/*
Theme Name: BnD Dogcare Child
Theme URI: https://bnddogcare.com/
Description: Official BnD Dogcare child theme for Astra. Provides the BnD brand foundation and reusable website components without modifying the Astra parent theme.
Author: BnD Dogcare
Author URI: https://bnddogcare.com/
Template: astra
Version: 1.1.2
Text Domain: bnd-dogcare-child
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

:root {
  --bnd-blue: #73C9E7;
  --bnd-pink: #EF909C;
  --bnd-white: #FAFCFC;
  --bnd-sand: #F5DDC1;
  --bnd-text: #222222;
  --bnd-text-muted: #555555;
  --bnd-border: #DCE5E8;
  --bnd-surface: #FFFFFF;
  --bnd-radius-sm: 10px;
  --bnd-radius-md: 18px;
  --bnd-radius-lg: 28px;
  --bnd-shadow-soft: 0 10px 30px rgba(34, 34, 34, 0.08);
  --bnd-content-max: 1200px;
}

/* Brand-safe defaults. These intentionally avoid broad layout overrides. */
body.bnd-dogcare-site {
  color: var(--bnd-text);
  background: var(--bnd-white);
}

body.bnd-dogcare-site a {
  text-underline-offset: 0.16em;
}

body.bnd-dogcare-site :focus-visible {
  outline: 3px solid var(--bnd-blue);
  outline-offset: 3px;
}

/* Reusable BnD section primitives */
.bnd-section {
  padding-block: clamp(3rem, 7vw, 6rem);
}

.bnd-section--compact {
  padding-block: clamp(2rem, 5vw, 4rem);
}

.bnd-container {
  width: min(calc(100% - 2rem), var(--bnd-content-max));
  margin-inline: auto;
}

.bnd-eyebrow {
  margin: 0 0 0.6rem;
  color: var(--bnd-text-muted);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.bnd-lead,
.is-style-bnd-lead {
  color: var(--bnd-text-muted);
  font-size: clamp(1.08rem, 1rem + 0.4vw, 1.35rem);
  line-height: 1.65;
}

/* Cards */
.bnd-card,
.is-style-bnd-card {
  border: 1px solid var(--bnd-border);
  border-radius: var(--bnd-radius-md);
  background: var(--bnd-surface);
  box-shadow: var(--bnd-shadow-soft);
  padding: clamp(1.25rem, 2.5vw, 2rem);
}

.bnd-card--blue,
.is-style-bnd-card-blue {
  border-radius: var(--bnd-radius-md);
  background: color-mix(in srgb, var(--bnd-blue) 20%, white);
  padding: clamp(1.25rem, 2.5vw, 2rem);
}

.bnd-card--pink,
.is-style-bnd-card-pink {
  border-radius: var(--bnd-radius-md);
  background: color-mix(in srgb, var(--bnd-pink) 18%, white);
  padding: clamp(1.25rem, 2.5vw, 2rem);
}

.bnd-card--sand,
.is-style-bnd-card-sand {
  border-radius: var(--bnd-radius-md);
  background: var(--bnd-sand);
  padding: clamp(1.25rem, 2.5vw, 2rem);
}

/* Callouts */
.bnd-callout {
  border-left: 5px solid var(--bnd-blue);
  border-radius: 0 var(--bnd-radius-sm) var(--bnd-radius-sm) 0;
  background: #fff;
  padding: 1rem 1.2rem;
}

.bnd-callout--positive {
  border-left-color: var(--bnd-pink);
}

/* Buttons. Use class bnd-button on links or native buttons. */
.bnd-button,
.wp-block-button.is-style-bnd-primary .wp-block-button__link,
.wp-block-button.is-style-bnd-secondary .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  border: 2px solid transparent;
  border-radius: 999px;
  padding: 0.72rem 1.35rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.bnd-button,
.wp-block-button.is-style-bnd-primary .wp-block-button__link {
  background: var(--bnd-blue);
  color: var(--bnd-text);
}

.bnd-button--pink,
.wp-block-button.is-style-bnd-secondary .wp-block-button__link {
  background: var(--bnd-pink);
  color: var(--bnd-text);
}

.bnd-button:hover,
.wp-block-button.is-style-bnd-primary .wp-block-button__link:hover,
.wp-block-button.is-style-bnd-secondary .wp-block-button__link:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(34, 34, 34, 0.13);
}

/* KPI pattern */
.bnd-kpi {
  display: grid;
  gap: 0.25rem;
  align-content: start;
}

.bnd-kpi__value {
  margin: 0;
  color: var(--bnd-text);
  font-size: clamp(2rem, 5vw, 3.6rem);
  font-weight: 800;
  line-height: 1;
}

.bnd-kpi__label {
  margin: 0;
  color: var(--bnd-text-muted);
  font-size: 0.95rem;
}

/* Image treatment for optional BnD cards */
.bnd-image {
  overflow: hidden;
  border-radius: var(--bnd-radius-md);
}

.bnd-image img {
  display: block;
  width: 100%;
  height: auto;
}

/* Utility backgrounds */
.bnd-bg-blue { background-color: var(--bnd-blue) !important; }
.bnd-bg-pink { background-color: var(--bnd-pink) !important; }
.bnd-bg-sand { background-color: var(--bnd-sand) !important; }
.bnd-bg-white { background-color: var(--bnd-white) !important; }
.bnd-text-dark { color: var(--bnd-text) !important; }
.bnd-text-muted { color: var(--bnd-text-muted) !important; }

/* Mobile guardrails */
@media (max-width: 767px) {
  .bnd-section {
    padding-block: 3rem;
  }

  .bnd-container {
    width: min(calc(100% - 1.25rem), var(--bnd-content-max));
  }

  .bnd-button,
  .wp-block-button.is-style-bnd-primary .wp-block-button__link,
  .wp-block-button.is-style-bnd-secondary .wp-block-button__link {
    min-height: 46px;
  }
}

/* Fallback for browsers without color-mix() */
@supports not (background: color-mix(in srgb, #000 10%, white)) {
  .bnd-card--blue,
  .is-style-bnd-card-blue { background: #E3F4FA; }
  .bnd-card--pink,
  .is-style-bnd-card-pink { background: #FCE9EC; }
}


/* BnD Homepage V2 components */
.bnd-section { padding: clamp(3rem, 7vw, 6rem) 1.25rem; }
.bnd-section-soft { background: #FAFCFC; }
.bnd-section-sand { background: #F5DDC1; }
.bnd-hero { padding: clamp(4.5rem, 10vw, 8rem) 1.25rem; background: linear-gradient(135deg, #FAFCFC 0%, #FAFCFC 60%, #F5DDC1 100%); }
.bnd-hero h1 { max-width: 850px; line-height: 1.04; color: #222222; }
.bnd-hero p { max-width: 760px; }
.bnd-eyebrow { color: #3c93b2; font-weight: 800; letter-spacing: .12em; font-size: .82rem; }
.bnd-lead { max-width: 850px; font-size: clamp(1.05rem, 2vw, 1.3rem); line-height: 1.65; }
.bnd-card { height: 100%; padding: 1.5rem; background: #fff; border: 1px solid rgba(34,34,34,.08); border-radius: 18px; box-shadow: 0 8px 28px rgba(34,34,34,.06); }
.bnd-card h3 { margin-top: 0; }
.bnd-kpis .wp-block-column { padding: 1.25rem; border-top: 4px solid #73C9E7; background: #fff; border-radius: 12px; }
.bnd-kpi-number { margin: 0; color: #EF909C; font-size: clamp(2rem,5vw,3.5rem); font-weight: 800; line-height: 1; }
.bnd-donate { background: #73C9E7; }
.bnd-image-note { margin-top: 2rem; padding: .8rem 1rem; border: 1px dashed #555; border-radius: 10px; font-size: .85rem; color: #555; }
.wp-block-button.is-style-bnd-primary .wp-block-button__link { background: #EF909C; color: #222; border-radius: 999px; font-weight: 700; padding: .85em 1.4em; }
.wp-block-button.is-style-bnd-secondary .wp-block-button__link { background: transparent; color: #222; border: 2px solid #73C9E7; border-radius: 999px; font-weight: 700; padding: calc(.85em - 2px) calc(1.4em - 2px); }
@media (max-width: 781px) { .bnd-section { padding: 3rem 1rem; } .bnd-hero { padding: 4rem 1rem; } }


/* v1.1.2 Gutenberg/editor readability fixes */
.bnd-section, .bnd-section p, .bnd-section h1, .bnd-section h2, .bnd-section h3,
.bnd-hero, .bnd-hero p, .bnd-hero h1, .bnd-hero h2, .bnd-hero h3,
.bnd-card, .bnd-card p, .bnd-card h3, .bnd-donate, .bnd-donate p, .bnd-donate h2 { color: #222222; }
.bnd-eyebrow { color: #3c93b2 !important; }