/* ============================================================
   Blue Line K-9 — brand.css
   Hand-written design system. No framework, no CDN.
   Tokens mirror DESIGN.md / CLAUDE.md (exact brand hex).
   ============================================================ */

/* ---------- Tokens ---------- */
:root{
  /* Brand palette (locked) */
  --police-blue:#124EA2;
  --police-blue-700:#0E3E82;
  --police-blue-900:#0A2C5C;
  --sky-blue:#4F7CBB;
  --alert-red:#C72D32;
  --badge-yellow:#FED72E;
  --black:#000000;
  --ink:#0b0f14;            /* near-black surface, tinted to blue */
  --dark-gray:#525152;
  --light-gray:#E7E8EC;
  --white:#FFFFFF;

  /* Text */
  --text:#15181d;
  --text-soft:#4a4f57;
  --text-invert:#FFFFFF;
  --text-invert-soft:#c6d2e6;

  /* Type */
  --font-display:'Russo One',system-ui,sans-serif;
  --font-body:'Lato',system-ui,sans-serif;

  /* Spacing scale (8pt-based, intentional) */
  --s-1:.25rem; --s-2:.5rem; --s-3:.75rem; --s-4:1rem; --s-5:1.5rem;
  --s-6:2rem; --s-7:3rem; --s-8:4rem; --s-9:6rem; --s-10:8rem;

  /* Radius */
  --r-sm:8px; --r-md:14px; --r-lg:22px; --r-xl:32px; --r-pill:999px;

  /* Layered, blue-tinted shadows */
  --shadow-1:0 1px 2px rgba(10,44,92,.06), 0 2px 6px rgba(10,44,92,.06);
  --shadow-2:0 4px 10px rgba(10,44,92,.08), 0 12px 28px rgba(10,44,92,.10);
  --shadow-3:0 10px 24px rgba(10,44,92,.12), 0 28px 60px rgba(10,44,92,.16);
  --shadow-blue:0 14px 34px rgba(18,78,162,.28);
  --shadow-yellow:0 14px 34px rgba(254,215,46,.30);

  /* Motion */
  --ease-out:cubic-bezier(.22,1,.36,1);       /* quint-ish */
  --ease-spring:cubic-bezier(.34,1.4,.5,1);
  --container:1200px;
}

/* ---------- Reset / base ---------- */
*,*::before,*::after{box-sizing:border-box;}
*{margin:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  font-family:var(--font-body);
  font-weight:400;
  color:var(--text);
  background:var(--white);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg,video{display:block;max-width:100%;height:auto;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;padding:0;}
button{font:inherit;cursor:pointer;border:none;background:none;color:inherit;}
:focus-visible{outline:3px solid var(--badge-yellow);outline-offset:3px;border-radius:4px;}

/* ---------- Typography ---------- */
h1,h2,h3,h4,.display{
  font-family:var(--font-display);
  font-weight:400;
  line-height:1.04;
  letter-spacing:.5px;
  text-transform:uppercase;
  color:var(--police-blue-900);
}
h1,.h1{font-size:clamp(2.4rem,6vw,4.6rem);letter-spacing:.5px;}
h2,.h2{font-size:clamp(1.9rem,4vw,3.1rem);}
h3,.h3{font-size:clamp(1.25rem,2.2vw,1.7rem);letter-spacing:.6px;}
p{max-width:68ch;}
.lead{font-size:clamp(1.05rem,1.6vw,1.3rem);color:var(--text-soft);font-weight:400;}
.accent{color:var(--police-blue);}      /* default accent word color */
.oneline-md{font-size:clamp(1.6rem,3.2vw,2.2rem);} /* headline locked to one line on desktop */
@media (min-width:700px){.oneline-md{white-space:nowrap;}}
.br-md{display:none;} /* line break that only applies on desktop */
@media (min-width:700px){.br-md{display:inline;}}
/* heading held to one line on desktop; escapes its wrapper via max-content */
@media (min-width:700px){.oneline-lg{white-space:nowrap;width:max-content;margin-inline:auto;}}
/* heading sized to fit a two-column body column; the 1.9rem h2 floor overflows
   the 760-900px band where .grid-2 is two-up but the viewport is still narrow */
.h2-col-fit{font-size:clamp(1.9rem,3.4vw,2.85rem);}
@media (min-width:760px) and (max-width:900px){.h2-col-fit{font-size:3.4vw;}}
.hl{color:var(--badge-yellow);}          /* yellow accent (on dark only) */
.eyebrow{
  font-family:var(--font-display);
  font-size:.82rem;letter-spacing:2.5px;text-transform:uppercase;
  color:var(--police-blue);display:inline-flex;align-items:center;gap:.6rem;
}
.eyebrow::before{content:"";width:26px;height:3px;background:var(--badge-yellow);border-radius:2px;}
.section-num{
  font-family:var(--font-display);font-size:.8rem;letter-spacing:3px;
  color:var(--sky-blue);opacity:.85;
}

/* ---------- Layout ---------- */
.container{width:min(100% - 2.5rem,var(--container));margin-inline:auto;}
.section{padding-block:var(--s-9);}
.section--tight{padding-block:var(--s-8);}
.center{text-align:center;}
/* p carries max-width:68ch, so centered text needs centered boxes too */
p.center,.center>p{margin-inline:auto;}
.stack>*+*{margin-top:var(--s-4);}
.grid{display:grid;gap:var(--s-5);}
@media(min-width:760px){
  .grid-2{grid-template-columns:repeat(2,1fr);}
  .grid-3{grid-template-columns:repeat(3,1fr);}
  .grid-4{grid-template-columns:repeat(4,1fr);}
}


/* Surfaces */
.surface-dark{background:var(--ink);color:var(--text-invert);
  background-image:radial-gradient(120% 120% at 0% 0%,rgba(18,78,162,.55),transparent 55%),
                   radial-gradient(120% 120% at 100% 100%,rgba(79,124,187,.35),transparent 55%);}
.surface-blue{background:var(--police-blue);color:var(--text-invert);
  background-image:linear-gradient(135deg,var(--police-blue),var(--police-blue-900));}
.surface-gray{background:var(--light-gray);}
.surface-sky-tint{background:#e7f0fb;}
.surface-yellow{background:var(--badge-yellow);color:var(--black);}
.surface-dark h1,.surface-dark h2,.surface-dark h3,
.surface-blue h1,.surface-blue h2,.surface-blue h3{color:var(--white);}
.surface-dark .lead,.surface-blue .lead{color:var(--text-invert-soft);}
.surface-dark .eyebrow,.surface-blue .eyebrow{color:var(--badge-yellow);}

/* Grain overlay helper */
.grain{position:relative;}
.grain::after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.04;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.6rem;
  font-family:var(--font-display);text-transform:uppercase;letter-spacing:1.2px;
  font-size:.92rem;padding:.95rem 1.6rem;border-radius:var(--r-pill);
  transition:transform .35s var(--ease-spring),background-color .3s var(--ease-out),
             color .3s var(--ease-out),box-shadow .3s var(--ease-out);
  will-change:transform;
}
.btn:hover{transform:translateY(-2px);}
.btn:active{transform:translateY(0);}
.btn .arrow{transition:transform .35s var(--ease-spring);}
.btn:hover .arrow{transform:translateX(4px);}

.btn-primary{background:var(--sky-blue);color:#fff;box-shadow:0 14px 30px rgba(18,78,162,.30);}
.btn-primary:hover{background:var(--police-blue);color:#fff;}
.btn-secondary{background:transparent;color:var(--police-blue);box-shadow:inset 0 0 0 2px var(--police-blue);}
.btn-secondary:hover{background:var(--police-blue);color:var(--white);}
.btn-badge{background:var(--black);color:var(--badge-yellow);box-shadow:inset 0 0 0 2px var(--badge-yellow),var(--shadow-2);}
.btn-badge:hover{background:var(--badge-yellow);color:var(--black);box-shadow:var(--shadow-yellow);}
.surface-dark .btn-secondary,.surface-blue .btn-secondary{color:#fff;box-shadow:inset 0 0 0 2px rgba(255,255,255,.55);}
.surface-dark .btn-secondary:hover,.surface-blue .btn-secondary:hover{background:#fff;color:var(--police-blue);}
/* Phones: tighter type and full-width hero buttons so long labels
   ("Book a Call with a Trainer") stay on one line */
.btn-lg{padding:1rem 1.2rem;font-size:.86rem;letter-spacing:.8px;}
.hero__cta .btn{width:100%;justify-content:center;}
@media(min-width:480px){
  .btn-lg{padding:1.1rem 2rem;font-size:1rem;letter-spacing:1.2px;}
  .hero__cta .btn{width:auto;}
}

/* ---------- Header / nav ---------- */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.94);backdrop-filter:blur(10px);
  border-bottom:1px solid #e2e5ea;
  box-shadow:0 2px 14px rgba(10,44,92,.07);
}
/* full-width nav so the logo sits near the screen edge */
.site-header .container{width:100%;max-width:none;padding-inline:clamp(1.5rem,5vw,5rem);}
.nav{display:flex;align-items:center;justify-content:space-between;gap:var(--s-5);padding-block:.7rem;}
/* When the menu is crowded the logo box narrows; contain scales the logo down in proportion instead of squishing it */
.nav__logo{min-width:0;}
.nav__logo img{height:clamp(86px,9.5vw,116px);width:auto;object-fit:contain;object-position:left center;}
.nav__links{display:none;gap:clamp(.9rem,1.55vw,1.65rem);align-items:center;}
.nav__links a{font-family:var(--font-display);font-size:clamp(.86rem,1.02vw,.95rem);letter-spacing:1px;text-transform:uppercase;white-space:nowrap;color:var(--police-blue-900);
  transition:color .25s var(--ease-out);}
.nav__links a:hover{color:var(--police-blue);}
.nav__cta{display:flex;align-items:center;gap:var(--s-4);}
.nav__cta .btn{white-space:nowrap;}
.nav__phone{display:none;font-family:var(--font-display);font-size:clamp(.88rem,1.02vw,.96rem);letter-spacing:.8px;white-space:nowrap;color:var(--police-blue);}
.nav__phone:hover{color:var(--police-blue-700);}
.nav__toggle{display:inline-flex;flex-direction:column;gap:5px;padding:.5rem;}
.nav__toggle span{width:24px;height:2px;background:var(--police-blue-900);border-radius:2px;transition:transform .3s var(--ease-out),opacity .3s var(--ease-out);}
.nav[data-open="true"] .nav__toggle span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav[data-open="true"] .nav__toggle span:nth-child(2){opacity:0;}
.nav[data-open="true"] .nav__toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.nav__mobile{display:none;flex-direction:column;gap:var(--s-2);padding:var(--s-4) 0 var(--s-5);}
.nav__mobile a{font-family:var(--font-display);text-transform:uppercase;letter-spacing:1px;font-size:1rem;color:var(--police-blue-900);padding:.5rem 0;border-bottom:1px solid #e2e5ea;}
.nav[data-open="true"] .nav__mobile{display:flex;}
/* nav dropdowns (Programs, Locations) */
.nav__has-sub{position:relative;}
.nav__subtoggle{font-family:var(--font-display);font-size:clamp(.86rem,1.02vw,.95rem);letter-spacing:1px;text-transform:uppercase;white-space:nowrap;color:var(--police-blue-900);display:inline-flex;align-items:center;gap:.35rem;cursor:pointer;background:none;border:none;padding:0;transition:color .25s var(--ease-out);}
.nav__subtoggle:hover{color:var(--police-blue);}
.nav__caret{font-size:.62em;transition:transform .25s var(--ease-out);}
.nav__sub{position:absolute;top:calc(100% + .6rem);left:50%;transform:translateX(-50%) translateY(6px);min-width:230px;background:#fff;border:1px solid #e2e5ea;border-radius:var(--r-md);box-shadow:var(--shadow-3);padding:.5rem;display:flex;flex-direction:column;gap:.1rem;opacity:0;visibility:hidden;transition:opacity .2s var(--ease-out),transform .2s var(--ease-out);z-index:60;}
/* invisible hover-bridge so moving from the toggle to the menu doesn't drop the hover */
.nav__sub::before{content:"";position:absolute;left:0;right:0;top:-.9rem;height:.9rem;}
.nav__has-sub:hover .nav__sub,.nav__has-sub:focus-within .nav__sub,.nav__sub[data-open="true"]{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.nav__has-sub:hover .nav__caret,.nav__has-sub:focus-within .nav__caret{transform:rotate(180deg);}
.nav__sub a{font-family:var(--font-body);text-transform:none;letter-spacing:0;font-size:.95rem;font-weight:700;color:var(--text);padding:.55rem .75rem;border-radius:var(--r-sm);white-space:nowrap;}
.nav__sub a:hover{background:var(--light-gray);color:var(--police-blue);}
.nav__mobile-group{font-family:var(--font-display);text-transform:uppercase;letter-spacing:1px;font-size:.78rem;color:var(--police-blue);padding:.6rem 0 .1rem;}
/* The desktop nav needs about 1360px to lay out with the logo at full size;
   below that the burger menu is the correct affordance. */
@media(min-width:1360px){
  .nav__links{display:flex;}
  .nav__phone{display:inline;}
  .nav__toggle{display:none;}
}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#ffffff 0%,#e7f0fb 100%);}
.hero .container{position:relative;z-index:1;}
.hero__grid{display:grid;gap:var(--s-6);align-items:center;padding-block:clamp(2.25rem,6vw,4.75rem);}
/* Centered hero with no photo column: same vertical rhythm as .hero__grid,
   otherwise the copy and CTA sit flush against the section edges. */
.hero__center{padding-block:clamp(2.25rem,6vw,4.75rem);}
@media(min-width:900px){.hero__grid{grid-template-columns:1.05fr .95fr;gap:var(--s-8);}}
/* Hero variant: trades photo width for copy width, for pages whose headline
   needs the extra room to break where it should. */
@media(min-width:900px){
  .hero__grid--text-led{grid-template-columns:1.2fr .8fr;}
  .hero__grid--text-led .lead{font-size:clamp(1.12rem,1.75vw,1.4rem);}
}
.hero .eyebrow{color:var(--police-blue);}
.blk9-thanks .ty-mark{display:block;width:clamp(180px,22vw,240px);height:auto;margin:0 auto 18px;}
.dogtalk-mark{display:block;width:min(100%,460px);height:auto;margin-inline:auto;filter:drop-shadow(0 18px 30px rgba(10,44,92,.18));}
.hero h1{color:var(--police-blue-900);}
.hero .lead{color:var(--text-soft);max-width:48ch;margin-top:var(--s-5);}
.hero__cta{display:flex;flex-wrap:wrap;gap:var(--s-4);margin-top:var(--s-6);}
.hero__rating{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap;margin-top:var(--s-6);font-size:.95rem;color:var(--text-soft);}
.stars{color:var(--badge-yellow);letter-spacing:2px;-webkit-text-stroke:.6px #caa400;}
.hero__photo{position:relative;border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-3);aspect-ratio:4/5;}
@media(min-width:900px){.hero__photo{aspect-ratio:1/1.08;}}
.hero__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 12%;}
/* Book hero: the cover sits whole on a brand-tinted stage */
.hero__photo--book{display:flex;align-items:center;justify-content:center;padding:clamp(1.5rem,5vw,3.5rem);
  background:radial-gradient(90% 70% at 50% 100%,rgba(79,124,187,.3),transparent 65%),
             radial-gradient(60% 50% at 85% 10%,rgba(254,215,46,.22),transparent 70%),var(--light-gray);}
.hero__photo--book img{width:auto;max-width:100%;height:100%;object-fit:contain;border-radius:4px;
  box-shadow:0 3px 6px rgba(10,44,92,.16),0 24px 48px -12px rgba(18,78,162,.42);}
/* playful background blobs for pop */
.hero__blob{position:absolute;border-radius:50%;z-index:0;pointer-events:none;}
.hero__blob--yellow{width:240px;height:240px;background:var(--badge-yellow);top:-70px;right:14%;opacity:.32;}
.hero__blob--sky{width:340px;height:340px;background:var(--sky-blue);bottom:-150px;left:-90px;opacity:.20;}
.accent-red{color:var(--alert-red);}
.accent-yellow{color:var(--badge-yellow);-webkit-text-stroke:2.5px var(--police-blue-900);paint-order:stroke fill;}

/* ---------- Cards ---------- */
.card{background:var(--white);border-radius:var(--r-lg);padding:var(--s-6);box-shadow:var(--shadow-2);border:1px solid #eceef2;
  transition:transform .4s var(--ease-out),box-shadow .4s var(--ease-out);height:100%;}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-3);}
.card__icon{width:58px;height:58px;border-radius:var(--r-md);display:grid;place-items:center;
  background:linear-gradient(135deg,var(--police-blue),var(--sky-blue));color:#fff;margin-bottom:var(--s-4);box-shadow:var(--shadow-blue);}
.card__icon svg{width:28px;height:28px;}
.card__icon--red{background:var(--alert-red);box-shadow:0 10px 24px rgba(199,45,50,.35);}
.card__icon--sky{background:var(--sky-blue);box-shadow:0 10px 24px rgba(79,124,187,.40);}
.card__icon--yellow{background:var(--badge-yellow);color:#1a1a1a;box-shadow:0 10px 24px rgba(254,215,46,.45);}

/* ---------- FAQ accordion ----------
   Native <details>/<summary>: keyboard accessible and works with no JS.
   Answers stay in the DOM while collapsed, so FAQPage structured data and
   crawlers still see them. */
.faq{padding:0;height:auto;}
.faq:hover{transform:none;box-shadow:var(--shadow-3);}
.faq>summary{
  display:flex;align-items:flex-start;gap:var(--s-5);
  padding:var(--s-5) var(--s-6);cursor:pointer;list-style:none;
  transition:opacity .25s var(--ease-out);
}
.faq>summary::-webkit-details-marker{display:none;}
.faq>summary:hover{opacity:.7;}
.faq>summary:active{opacity:.55;}
.faq>summary h3{margin:0;flex:1 1 auto;}
/* chevron: points down when closed, up when open */
.faq>summary::after{
  content:"";flex:none;width:.6rem;height:.6rem;margin-top:.42rem;
  border-right:2.5px solid var(--police-blue);
  border-bottom:2.5px solid var(--police-blue);
  transform:rotate(45deg);
  transition:transform .35s var(--ease-out);
}
.faq[open]>summary::after{transform:rotate(-135deg);}
.faq>p{margin:0;padding:0 var(--s-6) var(--s-6);}
.faq[open]>p{animation:faq-open .3s var(--ease-out) both;}
@keyframes faq-open{from{opacity:0;transform:translateY(-8px);}to{opacity:1;transform:none;}}
@media(prefers-reduced-motion:reduce){
  .faq>summary::after{transition:none;}
  .faq[open]>p{animation:none;}
}
.card h3{color:var(--police-blue-900);margin-bottom:var(--s-2);}
.card__where{display:inline-block;font-family:var(--font-display);font-size:.7rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--police-blue);background:#eef4fc;border-radius:var(--r-pill);padding:.3rem .7rem;margin-bottom:var(--s-3);}
.card p{color:var(--text-soft);font-size:.98rem;}

/* benefit cards on dark */
.surface-dark .card{background:rgba(255,255,255,.05);box-shadow:none;border:1px solid rgba(255,255,255,.09);}
.surface-dark .card:hover{background:rgba(255,255,255,.08);box-shadow:var(--shadow-blue);transform:translateY(-6px);}
.surface-dark .card h3{color:#fff;}
.surface-dark .card p{color:var(--text-invert-soft);}

/* program cards */
.program{position:relative;overflow:hidden;border-radius:var(--r-lg);background:#fff;box-shadow:var(--shadow-2);
  display:flex;flex-direction:column;transition:transform .4s var(--ease-out),box-shadow .4s var(--ease-out);}
.program:hover{transform:translateY(-6px);box-shadow:var(--shadow-3);}
.program__media{aspect-ratio:16/10;overflow:hidden;}
.program__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-out);}
.program:hover .program__media img{transform:scale(1.05);}
/* Book cover: show the whole cover as an object, never crop it */
.program__media--book{display:flex;align-items:center;justify-content:center;padding:var(--s-5);
  background:radial-gradient(120% 90% at 50% 100%,rgba(79,124,187,.22),transparent 60%),var(--light-gray);}
.program__media--book img{width:auto;height:100%;object-fit:contain;border-radius:3px;
  box-shadow:0 2px 4px rgba(10,44,92,.14),0 14px 28px -8px rgba(18,78,162,.35);}
.program:hover .program__media--book img{transform:translateY(-4px) rotate(-1.5deg);}
.program__body{padding:var(--s-5) var(--s-6) var(--s-6);display:flex;flex-direction:column;gap:var(--s-3);flex:1;}
.program__tag{align-self:flex-start;font-family:var(--font-display);font-size:.72rem;letter-spacing:1.5px;text-transform:uppercase;
  background:var(--badge-yellow);color:var(--black);padding:.3rem .7rem;border-radius:var(--r-pill);}
.program h3{color:var(--police-blue-900);}
/* Price on the self-serve program cards. The in-person programs quote on a
   free call instead, so they carry no price. */
.program__price{font-family:var(--font-display);font-size:1.4rem;letter-spacing:1px;color:var(--police-blue);}
.program__price s{margin-left:.45rem;font-family:var(--font-body);font-size:.62em;letter-spacing:0;font-weight:400;color:var(--text-soft);}
.program p{color:var(--text-soft);font-size:.96rem;flex:1;}

/* ---------- Offer bar ---------- */
.offer{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--s-5);text-align:center;
  padding:var(--s-6) var(--s-7);border-radius:var(--r-xl);box-shadow:var(--shadow-2);}
.offer__text{display:flex;flex-direction:column;align-items:center;gap:.25rem;flex:1 1 22rem;}
.offer>.btn{flex-shrink:0;}
@media(min-width:760px){.offer{flex-wrap:nowrap;justify-content:space-between;text-align:left;}.offer__text{align-items:flex-start;}}
.offer__text strong{font-family:var(--font-display);font-size:clamp(1.3rem,2.6vw,2rem);text-transform:uppercase;color:var(--police-blue);}
.offer__text span{color:#3a3a1f;font-weight:700;}
.offer__text .offer__price{color:var(--alert-red);}

/* ---------- Stat / proof bar ---------- */
.proofbar{display:flex;flex-wrap:wrap;gap:var(--s-6) var(--s-8);align-items:center;justify-content:center;}
.stat{text-align:center;}
.stat__num{font-family:var(--font-display);font-size:clamp(2rem,4vw,3rem);color:var(--badge-yellow);line-height:1;}
.surface-gray .stat__num,.proofbar--light .stat__num{color:var(--police-blue);}
.stat__label{font-size:.85rem;letter-spacing:1px;text-transform:uppercase;color:var(--text-invert-soft);}
.surface-gray .stat__label{color:var(--text-soft);}

/* ---------- Testimonials ---------- */
.quote{background:#fff;border-radius:var(--r-lg);padding:var(--s-6);box-shadow:var(--shadow-2);display:flex;flex-direction:column;gap:var(--s-4);height:100%;}
.quote__stars{color:var(--badge-yellow);letter-spacing:2px;}
.quote p{color:var(--text);font-size:1.02rem;}
.quote__who{display:flex;align-items:center;gap:.8rem;margin-top:auto;}
.quote__avatar{width:42px;height:42px;border-radius:var(--r-pill);background:linear-gradient(135deg,var(--police-blue),var(--sky-blue));
  color:#fff;display:grid;place-items:center;font-family:var(--font-display);font-size:1rem;}
.quote__name{font-weight:700;color:var(--police-blue-900);}
.quote__meta{font-size:.82rem;color:var(--text-soft);}

/* ---------- Promise band ---------- */
.promise{text-align:center;border-radius:var(--r-xl);padding:clamp(2.5rem,6vw,4.5rem);box-shadow:var(--shadow-3);}
.promise h2{color:#fff;}
.promise .hl{color:var(--badge-yellow);}

/* ---------- Markets ---------- */
.market{display:flex;flex-direction:column;gap:var(--s-2);background:#fff;border-radius:var(--r-lg);padding:var(--s-6);
  box-shadow:var(--shadow-2);border-top:4px solid var(--police-blue);transition:transform .4s var(--ease-out),box-shadow .4s var(--ease-out);}
.market:hover{transform:translateY(-5px);box-shadow:var(--shadow-3);}
.market h3{color:var(--police-blue-900);}
.market__loc{font-size:.85rem;letter-spacing:1px;text-transform:uppercase;color:var(--sky-blue);font-family:var(--font-display);}
/* odd count in a 2-up picker: 4 half-columns so the last card keeps its width and centers */
@media(min-width:760px){
  .grid-2:has(>.market:last-child:nth-child(odd)){grid-template-columns:repeat(4,1fr);}
  .grid-2:has(>.market:last-child:nth-child(odd))>.market{grid-column:span 2;}
  .grid-2:has(>.market:last-child:nth-child(odd))>.market:last-child{grid-column:2/span 2;}
}

/* ---------- Launch countdown bar (home page; hidden until main.js starts it, removed at zero) ---------- */
.countdown{display:flex;justify-content:center;gap:clamp(.9rem,3vw,2rem);padding:.65rem 1rem;color:var(--white);
  background:radial-gradient(60% 140% at 85% 0%,rgba(254,215,46,.18),transparent 70%),linear-gradient(90deg,var(--police-blue-900),var(--police-blue));}
.countdown[hidden]{display:none;}
.countdown__unit{display:flex;align-items:baseline;gap:.4rem;}
.countdown__num{font-family:var(--font-display);font-size:clamp(1.15rem,2.4vw,1.5rem);line-height:1;letter-spacing:1px;color:var(--badge-yellow);font-variant-numeric:tabular-nums;}
.countdown__lbl{font-family:var(--font-display);font-size:.7rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--text-invert-soft);}

/* ---------- Pack Walks location forms ----------
   All three forms load with the page (so the GHL embed can size them); main.js shows one at a time.
   Hidden panels collapse instead of display:none, so each iframe keeps a real width to lay out in. */
.walk-form{margin-top:var(--s-5);scroll-margin-top:170px;}
#pack-walks-cta{scroll-margin-top:110px;}
.walk-form.is-collapsed{height:0;margin:0;overflow:hidden;visibility:hidden;}
.walk-form__bar{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-4);margin-bottom:var(--s-4);}
.walk-form__bar h3{color:var(--police-blue-900);margin-top:var(--s-1);}
.walk-form__back{flex:none;font-family:var(--font-display);font-size:.8rem;letter-spacing:1px;text-transform:uppercase;color:var(--police-blue);text-decoration:none;padding-bottom:3px;box-shadow:inset 0 -2px 0 var(--badge-yellow);transition:opacity .25s var(--ease-out);}
.walk-form__back:hover{opacity:.75;}
.walk-form__back:active{opacity:.6;}
[data-walk-picker].is-collapsed{display:none;}

/* ---------- Lead form ---------- */
.lead-form{background:#fff;border-radius:var(--r-xl);padding:clamp(1.6rem,4vw,2.6rem);box-shadow:var(--shadow-3);}
/* Buy card: price + checkout button for the course and the book (checkout lives on shop.bluelinek-9.com) */
.buy-card{background:#fff;border-radius:var(--r-xl);padding:clamp(1.6rem,4vw,2.6rem);box-shadow:var(--shadow-3);}
.buy-card__label{font-family:var(--font-display);font-size:.78rem;letter-spacing:2px;text-transform:uppercase;color:var(--police-blue);}
.buy-card__price{font-family:var(--font-display);font-size:clamp(2.6rem,6vw,3.4rem);line-height:1;letter-spacing:1px;color:var(--police-blue);margin-top:var(--s-3);}
.buy-card__price s{margin-left:.5rem;font-family:var(--font-body);font-size:.36em;letter-spacing:0;color:var(--text-soft);}
.buy-card__note{margin-top:var(--s-2);font-weight:700;color:var(--police-blue-900);}
.buy-card__list{margin-top:var(--s-5);display:grid;gap:.7rem;}
.buy-card__list li{position:relative;padding-left:2rem;color:var(--text-soft);line-height:1.55;}
.buy-card__list li::before{content:"";position:absolute;left:0;top:.1rem;width:1.3rem;height:1.3rem;border-radius:50%;background:var(--police-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/.72rem no-repeat;}
.buy-card__price--date{font-size:clamp(2.4rem,5.5vw,3.1rem);}
/* Call card (financing, events): the number itself is the big link */
.buy-card__price--phone{display:block;width:fit-content;font-size:clamp(1.75rem,4.6vw,2.6rem);white-space:nowrap;text-decoration:none;transition:opacity .25s var(--ease-out);}
.buy-card__price--phone:hover{opacity:.75;}
.buy-card__price--phone:active{opacity:.6;}
.buy-card__price--phone:focus-visible{outline:3px solid var(--badge-yellow);outline-offset:4px;border-radius:6px;}
.buy-card__btn svg{width:18px;height:18px;flex:none;}
.buy-card__alt{margin:var(--s-3) auto 0;text-align:center;font-size:.95rem;color:var(--text-soft);}
.buy-card__alt a{color:var(--police-blue);font-weight:700;text-decoration:none;box-shadow:inset 0 -2px 0 var(--badge-yellow);}
.buy-card__alt a:hover{opacity:.75;}
.buy-card__btn{width:100%;justify-content:center;margin-top:var(--s-6);}
.buy-card__fine{display:flex;align-items:center;justify-content:center;gap:.4rem;margin:var(--s-4) auto 0;font-size:.88rem;color:var(--text-soft);}
.buy-card__fine svg{width:14px;height:14px;flex:none;color:var(--police-blue);}
.field{display:flex;flex-direction:column;gap:.35rem;margin-bottom:var(--s-4);}
.field label{font-size:.82rem;letter-spacing:.5px;font-weight:700;color:var(--text);}
.field input,.field select,.field textarea{
  font:inherit;padding:.85rem 1rem;border-radius:var(--r-sm);border:1.5px solid #d3d7df;background:#fbfcfe;color:var(--text);
  transition:border-color .25s var(--ease-out),box-shadow .25s var(--ease-out);}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--police-blue);box-shadow:0 0 0 4px rgba(18,78,162,.14);}

/* ---------- GoHighLevel embed placeholder ---------- */
/* Shown wherever a GHL form/embed is needed but the code hasn't been pasted yet. */
.ghl-placeholder{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.65rem;text-align:center;
  min-height:240px;padding:clamp(1.5rem,4vw,2.5rem);
  border:2px dashed var(--police-blue);border-radius:var(--r-xl);
  background:repeating-linear-gradient(45deg,#eef3fb,#eef3fb 14px,#e3ecf8 14px,#e3ecf8 28px);
  color:var(--police-blue-900);
}
.ghl-placeholder__tag{font-family:var(--font-display);font-size:.7rem;letter-spacing:1.5px;text-transform:uppercase;
  background:var(--badge-yellow);color:#1a1a1a;padding:.3rem .7rem;border-radius:var(--r-pill);}
.ghl-placeholder__label{font-family:var(--font-display);text-transform:uppercase;letter-spacing:1px;font-size:1.05rem;}
.ghl-placeholder__hint{font-size:.85rem;color:var(--dark-gray);max-width:34ch;}

/* ---------- Footer ---------- */
.site-footer{padding-block:var(--s-8) var(--s-6);background:var(--police-blue);color:var(--text-invert);}
.footer-grid{display:grid;gap:var(--s-6);}
@media(min-width:760px){.footer-grid{grid-template-columns:1.4fr 1fr 1fr 1fr 1.2fr;}}
.site-footer h4{font-size:.85rem;letter-spacing:1.5px;color:var(--badge-yellow);margin-bottom:var(--s-3);}
.site-footer a{color:var(--text-invert-soft);font-size:.95rem;display:inline-block;padding:.2rem 0;transition:color .25s var(--ease-out);}
.site-footer a:hover{color:#fff;}
.footer-logo img{height:auto;width:clamp(210px,19vw,280px);margin-bottom:var(--s-4);}

/* ---------- Funnel header + footer (no nav: logo and phone only) ---------- */
.funnel-header{position:relative;z-index:50;background:#fff;border-bottom:1px solid #e2e5ea;box-shadow:0 2px 14px rgba(10,44,92,.07);}
.funnel-header .container{width:100%;max-width:none;padding-inline:clamp(1.25rem,5vw,5rem);
  display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);padding-block:.7rem;}
.funnel-header__logo{display:block;transition:transform .35s var(--ease-out);}
.funnel-header__logo img{height:clamp(86px,9.5vw,116px);width:auto;display:block;}
.funnel-header__logo:hover{transform:translateY(-2px);}
.funnel-header__phone{font-family:var(--font-display);font-size:clamp(.95rem,1.6vw,1.15rem);letter-spacing:1px;white-space:nowrap;
  color:var(--police-blue);transition:opacity .25s var(--ease-out),transform .25s var(--ease-out);}
.funnel-header__phone:hover{opacity:.78;}
.funnel-header__phone:active{transform:scale(.97);}
.funnel-header a:focus-visible{outline:3px solid var(--badge-yellow);outline-offset:4px;border-radius:4px;}
.funnel-footer{background:var(--police-blue);padding-block:var(--s-7);color:var(--text-invert-soft);text-align:center;}
.funnel-footer p{margin-inline:auto;}
.funnel-footer p+p{margin-top:var(--s-2);}
.funnel-footer__name{font-family:var(--font-display);letter-spacing:1.5px;color:#fff;text-transform:uppercase;}
.funnel-footer__phone{color:var(--badge-yellow);font-weight:700;}
.funnel-footer__legal{font-size:.85rem;}
.funnel-footer p.funnel-footer__legal{margin-top:var(--s-4);}
.funnel-footer__legal a{color:var(--text-invert-soft);}
.funnel-footer a{transition:opacity .25s var(--ease-out);}
.funnel-footer a:hover{opacity:.8;}
.funnel-footer a:focus-visible{outline:2px solid var(--badge-yellow);outline-offset:3px;border-radius:3px;}
/* The full lockup is Police Blue on transparent, and the footer IS Police Blue,
   so it sits on a white plate rather than being recoloured. */
.footer-logo__link{display:inline-block;border-radius:var(--r-lg);transition:transform .4s var(--ease-out);}
.footer-logo__link:hover{transform:translateY(-3px);}
.footer-logo__plate{background:var(--white);border-radius:var(--r-lg);padding:var(--s-4) var(--s-5);
  box-shadow:0 10px 24px rgba(0,0,0,.18),0 2px 6px rgba(18,78,162,.25);}
.footer-bottom{margin-top:var(--s-7);padding-top:var(--s-5);border-top:1px solid rgba(255,255,255,.1);
  display:flex;flex-wrap:wrap;gap:var(--s-4);justify-content:space-between;color:var(--text-invert-soft);font-size:.85rem;}
.social{display:flex;gap:var(--s-3);}
.social a{width:40px;height:40px;border-radius:var(--r-pill);display:grid;place-items:center;background:rgba(255,255,255,.08);}
.social a:hover{background:var(--badge-yellow);color:var(--black);}
.social svg{width:18px;height:18px;}

/* ---------- Reveal animation ---------- */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out);}
.reveal.in{opacity:1;transform:none;}
.reveal[data-d="1"]{transition-delay:.08s;}
.reveal[data-d="2"]{transition-delay:.16s;}
.reveal[data-d="3"]{transition-delay:.24s;}
.reveal[data-d="4"]{transition-delay:.32s;}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important;}
  .reveal{opacity:1;transform:none;}
}

/* ---------- Thank-you pages (location form confirmations) ---------- */
/* Thank-you layout, shared with the GHL version (brand_assets/scripts/ghl-checkout/5-thank-you.html) */
  .blk9-thanks { font-family: 'Lato', sans-serif; color: #15181d; max-width: 800px; margin: 0 auto; padding: 8px 4px; text-align: center; }
  .blk9-thanks * { box-sizing: border-box; }
  .blk9-thanks .bt-check { width: 60px; height: 60px; margin: 0 auto 22px; border-radius: 50%; background: #124EA2; display: flex; align-items: center; justify-content: center; box-shadow: 0 14px 34px rgba(18,78,162,0.28); }
  .blk9-thanks .bt-check svg { width: 28px; height: 28px; }
  .blk9-thanks .bt-eyebrow { display: inline-flex; align-items: center; gap: 10px; font-family: 'Russo One', sans-serif; font-size: 12px; letter-spacing: 2.5px; text-transform: uppercase; color: #124EA2; margin: 0 0 14px; }
  .blk9-thanks .bt-eyebrow::before { content: ''; width: 26px; height: 3px; border-radius: 2px; background: #FED72E; flex: none; }
  .blk9-thanks h1 { font-family: 'Russo One', sans-serif; font-weight: 400; font-size: clamp(44px, 6.5vw, 76px); line-height: 1; letter-spacing: 1px; text-transform: uppercase; color: #0A2C5C; margin: 0 0 18px; }
  .blk9-thanks h1 span { color: #FED72E; -webkit-text-stroke: 3px #0A2C5C; paint-order: stroke fill; }
  .blk9-thanks .bt-lead { font-size: 19px; line-height: 1.7; color: #4a4f57; margin: 0 auto 40px; max-width: 34em; text-wrap: balance; }

  .blk9-thanks .bt-video-label { display: flex; align-items: center; gap: 12px; font-family: 'Russo One', sans-serif; font-size: 12px; letter-spacing: 2.5px; text-transform: uppercase; color: #0A2C5C; margin: 0 0 12px; text-align: left; }
  .blk9-thanks .bt-video-label b { font-weight: 400; color: #124EA2; }
  .blk9-thanks .bt-video-label::after { content: ''; flex: 1; height: 1px; background: #d6dbe3; }
  .blk9-thanks .bt-video { border-radius: 22px; overflow: hidden; box-shadow: 0 10px 24px rgba(10,44,92,0.12), 0 28px 60px rgba(10,44,92,0.16); margin: 0 0 36px; aspect-ratio: 16 / 9; background: #0A2C5C; }
  .blk9-thanks .bt-video iframe, .blk9-thanks .bt-video video { width: 100%; height: 100%; border: 0; display: block; }

  .blk9-thanks .bt-card { text-align: left; background: #ffffff; border: 1px solid #e2e5ea; border-radius: 22px; padding: 38px 44px; box-shadow: 0 4px 10px rgba(10,44,92,0.08), 0 12px 28px rgba(10,44,92,0.10); margin: 0 0 40px; }
  .blk9-thanks .bt-card > p { font-size: 17px; line-height: 1.75; color: #4a4f57; margin: 0 0 16px; }
  .blk9-thanks .bt-card > p strong { color: #0A2C5C; }
  .blk9-thanks .bt-card > p.bt-label { font-family: 'Russo One', sans-serif; font-size: 12px; letter-spacing: 2.5px; text-transform: uppercase; color: #124EA2; margin: 30px 0 18px !important; }
  .blk9-thanks .bt-card > p.bt-label:first-child { margin-top: 0 !important; }
  .blk9-thanks .bt-moves { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 20px; }
  .blk9-thanks .bt-moves li { display: flex; gap: 16px; align-items: flex-start; }
  .blk9-thanks .bt-num { flex: none; width: 38px; height: 38px; border-radius: 50%; background: #124EA2; color: #ffffff; display: flex; align-items: center; justify-content: center; font-family: 'Russo One', sans-serif; font-size: 15px; }
  .blk9-thanks .bt-moves h3 { font-family: 'Russo One', sans-serif; font-weight: 400; font-size: 17px; letter-spacing: 1px; text-transform: uppercase; color: #0A2C5C; margin: 6px 0 4px; }
  .blk9-thanks .bt-moves p { font-size: 16px; line-height: 1.65; color: #4a4f57; margin: 0; }
  .blk9-thanks .bt-help { background: #eef4fc; border: 1px solid #d6e3f5; border-radius: 14px; padding: 20px 24px; }
  .blk9-thanks .bt-help h4 { font-family: 'Russo One', sans-serif; font-weight: 400; font-size: 12px; letter-spacing: 2.5px; text-transform: uppercase; color: #124EA2; margin: 0 0 8px; }
  .blk9-thanks .bt-help p { font-size: 16px; line-height: 1.65; color: #4a4f57; margin: 0; }
  .blk9-thanks .bt-help a { color: #124EA2; font-weight: 700; text-decoration: none; white-space: nowrap; }

  .blk9-thanks .bt-actions { display: flex; align-items: center; justify-content: center; gap: 28px; flex-wrap: wrap; margin: 0 0 48px; }
  .blk9-thanks .bt-btn { display: inline-flex; align-items: center; gap: 10px; font-family: 'Russo One', sans-serif; font-size: 16px; letter-spacing: 1.2px; text-transform: uppercase; color: #ffffff; background: #4F7CBB; border-radius: 999px; padding: 18px 34px; text-decoration: none; box-shadow: 0 14px 30px rgba(18,78,162,0.30); transition: transform 0.35s cubic-bezier(.34,1.4,.5,1), background-color 0.3s cubic-bezier(.22,1,.36,1); }
  .blk9-thanks .bt-btn:hover { background: #124EA2; transform: translateY(-2px); }
  .blk9-thanks .bt-btn:active { transform: translateY(0); }
  .blk9-thanks .bt-btn span { transition: transform 0.35s cubic-bezier(.34,1.4,.5,1); }
  .blk9-thanks .bt-btn:hover span { transform: translateX(4px); }
  .blk9-thanks .bt-link { font-family: 'Russo One', sans-serif; font-size: 14px; letter-spacing: 1.2px; text-transform: uppercase; color: #124EA2; text-decoration: none; padding-bottom: 3px; box-shadow: inset 0 -2px 0 #FED72E; transition: opacity 0.25s cubic-bezier(.22,1,.36,1); }
  .blk9-thanks .bt-link:hover { opacity: 0.75; }
  .blk9-thanks a:focus-visible { outline: 3px solid #FED72E; outline-offset: 3px; border-radius: 4px; }

  .blk9-thanks .bt-rule { width: 44px; height: 3px; border-radius: 2px; background: #FED72E; margin: 0 auto 22px; }
  .blk9-thanks .bt-close { font-family: 'Russo One', sans-serif; font-size: clamp(18px, 2.4vw, 24px); letter-spacing: 1px; text-transform: uppercase; color: #0A2C5C; margin: 0 auto 10px; }
  .blk9-thanks .bt-sig { font-size: 13px; letter-spacing: 2px; text-transform: uppercase; color: #525152; margin: 0 auto; }

  @media (max-width: 640px) {
    .blk9-thanks { padding: 0; }
    .blk9-thanks .bt-lead { font-size: 17px; margin-bottom: 32px; }
    .blk9-thanks .bt-card { padding: 26px 20px; }
    .blk9-thanks .bt-card > p { font-size: 16px; }
    .blk9-thanks .bt-actions { flex-direction: column; gap: 22px; }
    .blk9-thanks .bt-btn { width: 100%; justify-content: center; }
  }
  .ty-wash{background:radial-gradient(60% 50% at 92% 8%,rgba(254,215,46,.16),transparent 70%),linear-gradient(180deg,#fff 0%,#e7f0fb 100%);padding-block:clamp(2.5rem,6vw,4.5rem) clamp(3rem,7vw,5rem);}
  .blk9-thanks .bt-inline{color:#124EA2;font-weight:700;text-decoration:none;white-space:nowrap;box-shadow:inset 0 -2px 0 #FED72E;}
  .blk9-thanks .bt-inline:hover{opacity:.75;}