/* =========================================================================
   Anura Health Group — design tokens + section styles
   Tokens sampled from the brand frog mark. Colors/type/spacing also live in
   theme.json (global styles); this file adds the bespoke section treatments
   that native blocks can't express (glass caption, numbered service cards,
   accordion plus-icon, provider band, contact form states).
   ========================================================================= */

:root {
  /* Teal */
  --teal-900:#0d4650; --teal-800:#12606d; --teal-700:#156673; --teal-600:#1a7683;
  --teal-500:#1e8494; --teal-400:#4fa5b3; --teal-300:#87c4ce; --teal-200:#bfe0e5;
  --teal-100:#e4f2f4; --teal-50:#f0f8f9;
  /* Navy (ink) */
  --navy-900:#06283a; --navy-800:#0a3446; --navy-700:#0c3a4e; --navy-600:#14495c;
  --navy-500:#2a5f72; --navy-400:#4b7d8e; --navy-300:#7ba0ac;
  /* Warm neutrals */
  --paper-50:#ffffff; --paper-100:#faf9f6; --paper-200:#f5f4ef; --paper-300:#ecebe4;
  --paper-400:#e0ded4; --stone-500:#8b9298; --stone-600:#5b7683;
  /* Status */
  --success-500:#3f8f6f; --success-100:#e2f1ea;
  --warning-500:#c98a2e; --danger-500:#c0503f; --danger-100:#f7e4e0;

  /* Semantic aliases */
  --brand:var(--teal-500); --brand-hover:var(--teal-700); --brand-active:var(--teal-800);
  --brand-soft:var(--teal-100); --accent:var(--teal-400);
  --ink:var(--navy-700); --ink-strong:var(--navy-900);
  --text-muted:var(--stone-600); --text-on-dark:#eaf4f5;
  --surface:var(--paper-50); --surface-canvas:var(--paper-200);
  --surface-dark:var(--navy-700); --surface-dark-2:var(--navy-900);
  --border:var(--paper-400); --focus-ring:var(--teal-400);

  /* Type */
  --font-display:'Poppins','Century Gothic',system-ui,sans-serif;
  --font-body:'Public Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700;
  --fs-display:clamp(2.75rem,5vw,4rem); --fs-h1:2.5rem; --fs-h2:2rem; --fs-h3:1.5rem;
  --fs-h4:1.25rem; --fs-lg:1.125rem; --fs-body:1rem; --fs-sm:0.875rem; --fs-xs:0.75rem;
  --lh-tight:1.1; --lh-snug:1.25; --lh-normal:1.5; --lh-relaxed:1.65;
  --ls-tight:-0.02em; --ls-wide:0.08em; --ls-wider:0.16em; --ls-brand:0.22em;

  /* Space + layout */
  --space-2:0.5rem; --space-3:0.75rem; --space-4:1rem; --space-5:1.5rem;
  --space-6:2rem; --space-7:3rem; --space-8:4rem;
  --container-max:1200px; --container-narrow:760px;
  --gutter:clamp(1.25rem,4vw,3rem); --section-y:clamp(4rem,8vw,7rem);

  /* Radii */
  --radius-xs:4px; --radius-sm:6px; --radius-md:10px; --radius-lg:16px;
  --radius-xl:24px; --radius-pill:999px;

  /* Shadows — navy-tinted, low */
  --shadow-sm:0 2px 6px rgba(12,58,78,0.07);
  --shadow-md:0 6px 20px rgba(12,58,78,0.09);
  --shadow-lg:0 16px 40px rgba(12,58,78,0.12);
  --shadow-focus:0 0 0 3px rgba(79,165,179,0.45);

  /* Motion */
  --ease-out:cubic-bezier(0.16,1,0.3,1);
  --dur-fast:120ms; --dur-base:220ms; --dur-slow:400ms;
}

body { font-family:var(--font-body); color:var(--ink); background:var(--surface-canvas); }

/* ---- Shared helpers ------------------------------------------------------ */
.anura-eyebrow {
  font-family:var(--font-body); font-size:var(--fs-sm); font-weight:var(--fw-semibold);
  letter-spacing:var(--ls-wider); text-transform:uppercase; color:var(--brand);
}
.anura-section { padding-block:var(--section-y); }
.anura-lead { font-size:var(--fs-lg); line-height:var(--lh-relaxed); color:var(--text-muted); }

/* Outline / secondary button (add class "is-style-outline" is native; this is
   the Anura secondary style used on hero + provider CTAs). */
.wp-block-button.anura-btn-outline .wp-block-button__link {
  background:transparent; color:var(--brand-hover); border:1px solid var(--border);
}
.wp-block-button.anura-btn-outline .wp-block-button__link:hover {
  background:var(--brand-soft); border-color:var(--teal-300); color:var(--brand-hover);
}

/* Outline badges (hero) */
.anura-badge {
  display:inline-flex; align-items:center; gap:6px; padding:6px 14px;
  border:1px solid var(--border); border-radius:var(--radius-pill);
  font-size:var(--fs-sm); font-weight:var(--fw-semibold); color:var(--ink);
  background:transparent;
}

/* ---- 1. Header ----------------------------------------------------------- */
.anura-header {
  position:sticky; top:0; z-index:40;
  background:var(--surface-canvas);
  border-bottom:1px solid transparent;
  transition:background var(--dur-base), border-color var(--dur-base);
}
.anura-header.is-scrolled {
  background:rgba(255,255,255,0.88);
  -webkit-backdrop-filter:saturate(1.2) blur(10px);
  backdrop-filter:saturate(1.2) blur(10px);
  border-bottom-color:var(--border);
}
.anura-logo-lockup { display:flex; align-items:center; gap:10px; text-decoration:none; }
.anura-logo-lockup img { height:38px; width:auto; display:block; }
.anura-nav a {
  font-size:var(--fs-sm); font-weight:var(--fw-semibold); color:var(--ink);
  text-decoration:none; letter-spacing:0.01em;
}
.anura-nav a:hover { color:var(--brand-hover); }

/* ---- 2. Hero ------------------------------------------------------------- */
.anura-hero { background:var(--surface-canvas); }
.anura-hero__title {
  font-family:var(--font-display); font-weight:var(--fw-bold); font-size:var(--fs-display);
  line-height:1.08; letter-spacing:var(--ls-tight); color:var(--ink); margin:0;
}
.anura-media {
  position:relative; border-radius:var(--radius-xl); overflow:hidden;
  box-shadow:var(--shadow-lg); background:var(--paper-300);
}
.anura-media--hero { aspect-ratio:4/5; }
.anura-media--square { aspect-ratio:1/1; }
.anura-media img { width:100%; height:100%; object-fit:cover; display:block; }
.anura-hero__caption {
  position:absolute; left:18px; right:18px; bottom:18px;
  background:rgba(12,58,78,0.82); color:#fff;
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
  border-radius:var(--radius-lg); padding:14px 18px;
  display:flex; align-items:center; gap:12px;
}
.anura-hero__caption .anura-icon-circle {
  width:40px; height:40px; border-radius:50%; background:var(--brand);
  display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; color:#fff;
}
.anura-hero__caption p { margin:0; font-size:var(--fs-sm); line-height:1.4; }

/* ---- 3. Services --------------------------------------------------------- */
.anura-services { background:var(--surface); }
.anura-service-grid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:20px;
}
.anura-service-card {
  position:relative; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-lg); box-shadow:var(--shadow-sm);
  padding:28px; transition:transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}
.anura-service-card:hover { transform:translateY(-2px); box-shadow:var(--shadow-md); }
.anura-service-card__num {
  font-family:var(--font-display); font-weight:var(--fw-semibold);
  font-size:var(--fs-sm); color:var(--stone-500); letter-spacing:0.04em;
}
.anura-service-card__icon {
  position:absolute; top:24px; right:24px; width:44px; height:44px;
  border-radius:var(--radius-md); background:var(--brand-soft); color:var(--brand-hover);
  display:inline-flex; align-items:center; justify-content:center;
}
.anura-service-card h3 {
  font-family:var(--font-display); font-size:var(--fs-h4); color:var(--ink);
  margin:14px 0 8px; line-height:var(--lh-snug);
}
.anura-service-card p { margin:0; font-size:var(--fs-body); line-height:var(--lh-relaxed); color:var(--text-muted); }

/* ---- 4. Provider band ---------------------------------------------------- */
.anura-provider { background:var(--surface-dark); color:var(--text-on-dark); }
.anura-provider :is(h1,h2,h3) { color:#fff; }
.anura-provider .anura-eyebrow { color:var(--teal-300); }
.anura-provider .anura-lead { color:#cfe3e7; }
.anura-quote {
  margin:0; padding-left:20px; border-left:3px solid var(--brand);
  font-family:var(--font-display); font-size:var(--fs-h4); font-weight:var(--fw-medium);
  line-height:1.4; color:#fff;
}
.anura-quote cite {
  display:block; margin-top:12px; font-family:var(--font-body); font-size:var(--fs-sm);
  font-weight:var(--fw-regular); font-style:normal; color:var(--teal-300);
}
.anura-stats { display:flex; gap:44px; flex-wrap:wrap; }
.anura-stat__value {
  font-family:var(--font-display); font-size:var(--fs-h3); font-weight:var(--fw-bold); color:var(--teal-300);
}
.anura-stat__label { font-size:var(--fs-sm); color:#cfe3e7; max-width:180px; margin-top:4px; }

/* ---- 5. FAQ accordion (built on core/details) ---------------------------- */
.anura-faq { background:var(--surface-canvas); }
.anura-faq details {
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md);
  padding:0; margin-bottom:12px; overflow:hidden;
}
.anura-faq summary {
  list-style:none; cursor:pointer; padding:18px 22px;
  font-family:var(--font-display); font-size:var(--fs-lg); font-weight:var(--fw-semibold);
  color:var(--ink); display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.anura-faq summary::-webkit-details-marker { display:none; }
.anura-faq summary::after {
  content:"+"; font-family:var(--font-body); font-weight:400; font-size:1.6rem; line-height:1;
  color:var(--brand); transition:transform var(--dur-base) var(--ease-out); flex:0 0 auto;
}
.anura-faq details[open] summary::after { transform:rotate(45deg); }
.anura-faq details > *:not(summary) {
  padding:0 22px 20px; font-size:var(--fs-body); line-height:var(--lh-relaxed); color:var(--text-muted);
}
.anura-faq details p { margin:0; }

/* ---- 6. Contact ---------------------------------------------------------- */
.anura-contact { background:var(--surface); }
.anura-contact-row { display:flex; align-items:center; gap:12px; color:var(--text-muted); font-size:var(--fs-body); }
.anura-icon-chip {
  width:38px; height:38px; border-radius:var(--radius-md);
  background:var(--brand-soft); color:var(--brand-hover);
  display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto;
}
.anura-form-card {
  background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-lg); box-shadow:var(--shadow-md); padding:32px;
}
/* Style whatever form plugin renders inside the card. */
.anura-form-card input[type=text],
.anura-form-card input[type=email],
.anura-form-card textarea {
  width:100%; border:1px solid var(--border); border-radius:var(--radius-md);
  padding:11px 14px; font-family:var(--font-body); font-size:var(--fs-body); color:var(--ink);
  background:#fff; transition:border-color var(--dur-fast), box-shadow var(--dur-fast);
}
.anura-form-card input:focus, .anura-form-card textarea:focus {
  outline:none; border-color:var(--brand); box-shadow:var(--shadow-focus);
}
.anura-form-card input.anura-invalid { border-color:var(--danger-500); }
.anura-form__error { color:var(--danger-500); font-size:var(--fs-sm); margin-top:4px; }
.anura-form-card label { font-size:var(--fs-sm); font-weight:var(--fw-semibold); color:var(--ink); }
.anura-form__success {
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:14px; padding:28px 8px;
}
.anura-form__success .check {
  width:60px; height:60px; border-radius:50%; background:var(--success-100); color:var(--success-500);
  display:inline-flex; align-items:center; justify-content:center;
}

/* ---- Certifications band -------------------------------------------------- */
.anura-certs { background:var(--surface-canvas); text-align:center; }
.anura-certs.anura-section { padding-block:clamp(2.5rem,5vw,4rem); }
.anura-cert-row {
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:32px; margin-top:1.5rem;
}
.anura-cert-badge {
  height:120px; width:auto; display:block;
  filter:drop-shadow(var(--shadow-sm));
}
.anura-cert-note { margin-top:1.25rem; font-size:var(--fs-sm); color:var(--text-muted); }
@media (max-width:520px){ .anura-cert-badge { height:96px; } .anura-cert-row { gap:20px; } }

/* ---- 7. Footer ----------------------------------------------------------- */
.anura-footer { background:var(--surface-dark-2); color:var(--text-on-dark); }
.anura-footer .anura-foot-heading {
  font-size:var(--fs-xs); letter-spacing:var(--ls-wide); text-transform:uppercase;
  color:var(--teal-300); font-weight:var(--fw-semibold);
}
.anura-footer a { color:var(--text-on-dark); text-decoration:none; font-size:var(--fs-sm); }
.anura-footer a:hover { color:#fff; }
.anura-footer .anura-muted { color:var(--navy-300); font-size:var(--fs-sm); line-height:var(--lh-relaxed); }
.anura-footer__bar { border-top:1px solid var(--navy-600); }
.anura-footer__bar .anura-muted { font-size:var(--fs-xs); }

/* ---- Icons (inline Lucide SVG sizing) ------------------------------------ */
.anura-svg { width:22px; height:22px; stroke-width:1.75; }
.anura-hero__caption .anura-svg, .anura-form__success .check .anura-svg { width:22px; height:22px; }

/* ---- Responsive ---------------------------------------------------------- */
@media (max-width:860px) {
  .anura-nav-desktop { display:none !important; }
  /* Force two-column sections to a single column below 860px (core stacks at 782). */
  .anura-2col { flex-wrap:wrap; row-gap:2rem; }
  .anura-2col > .wp-block-column { flex-basis:100% !important; }
  .anura-stats { gap:28px; }
}
@media (min-width:861px) {
  .anura-nav-mobile { display:none !important; }
}
@media (max-width:720px) {
  .anura-footer__grid { grid-template-columns:1fr !important; gap:28px !important; }
}

/* ---- Reduced motion ------------------------------------------------------ */
@media (prefers-reduced-motion:reduce) {
  * { transition:none !important; }
  .anura-service-card:hover { transform:none; }
}