/* Hockley Pharmacy design system v3 (12 Oct 2026).
   Green leads: forest green #0F3714, leaf green #618B35, lime #B3D685, mint #EAF3DA on warm off-white #FFFDF6.
   The shop front's royal blue #1F4FD1 and teal #00B8A9 are mixed in: blue marks what you can act on or have selected
   (buttons, links, focus, chosen day and time, info notes) and the blue bands; teal is a small accent.
   Turn the blue down by changing --action and --action-hover below. The mix rules sit at the end of this file. */
:root{
  --ink:#0F3714; --ink-2:#17501f; --green:#618B35; --green-700:#4A6E26; --lime:#B3D685; --lime-2:#c9e5a2;
  --mint:#EAF3DA; --stone:#E2DCD0; --sand:#F1EDE2; --cream:#FFFDF6; --white:#fff;
  --blue:#1F4FD1; --blue-700:#1740B5; --blue-900:#0A2A8F; --sky:#E4EEFF; --teal:#00B8A9; --teal-2:#38D3C6;
  --action:var(--blue); --action-hover:var(--blue-700);
  --text:#14301a; --muted:#51644f; --danger:#a12a1f; --amber:#8a5a00; --amber-bg:#fff4dc;
  --line:rgba(15,55,20,.12);

  --r-sm:12px; --r:20px; --r-lg:32px; --r-xl:44px; --r-pill:999px;
  --sh-1:0 1px 2px rgba(15,55,20,.06),0 4px 14px rgba(15,55,20,.06);
  --sh-2:0 10px 30px rgba(15,55,20,.12);
  --sh-3:0 28px 70px rgba(15,55,20,.22);

  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:80px; --s9:120px;
  --font:'DM Sans',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --display:'Fraunces',Georgia,'Times New Roman',serif;
  --container:1220px; --ease:cubic-bezier(.22,.8,.3,1);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none !important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:1.0625rem;line-height:1.68;color:var(--text);background:var(--cream);-webkit-font-smoothing:antialiased;padding-bottom:68px;text-rendering:optimizeLegibility}
img,svg{max-width:100%;display:block}
a{color:var(--blue-700);text-underline-offset:3px}
a:hover{color:var(--ink)}
h1,h2,h3,h4{margin:0 0 var(--s4);color:var(--ink);line-height:1.1}
h1,h2{font-family:var(--display);font-weight:600;letter-spacing:-.025em;font-optical-sizing:auto}
h1{font-size:clamp(2.5rem,5.6vw,4.6rem)} h2{font-size:clamp(1.9rem,3.6vw,3rem)}
h3{font-size:1.25rem;font-weight:700;letter-spacing:-.01em} h4{font-size:1.05rem;font-weight:700}
h1 em,h2 em{font-style:italic;font-weight:500;color:var(--green)}
p{margin:0 0 var(--s4)} ul,ol{margin:0;padding:0}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--cream);padding:12px 16px;border-radius:8px;z-index:1000}
.skip:focus{left:8px}
.container{width:min(100% - 2rem,var(--container));margin-inline:auto}
.icon{width:1.25em;height:1.25em;flex:none}
.hide-sm{display:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:12px 28px;border-radius:var(--r-pill);font:700 1rem/1 var(--font);text-decoration:none;border:2px solid transparent;cursor:pointer;touch-action:manipulation;transition:transform .25s var(--ease),background .2s,color .2s,box-shadow .25s,border-color .2s}
.btn:hover{transform:translateY(-2px);box-shadow:var(--sh-2)}
.btn:active{transform:translateY(0) scale(.98)}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.btn--primary{background:var(--action);color:#fff} .btn--primary:hover{background:var(--action-hover);color:#fff}
.btn--lime{background:var(--lime);color:var(--ink)} .btn--lime:hover{background:var(--lime-2);color:var(--ink)}
.btn--ghost{background:transparent;border-color:currentColor;color:inherit}
.btn--ghost:hover{background:rgba(255,255,255,.1);color:inherit}
.btn--outline{background:transparent;border-color:var(--ink);color:var(--ink)} .btn--outline:hover{background:var(--ink);color:var(--cream)}
.btn--lg{min-height:58px;padding:16px 34px;font-size:1.05rem}
.btn--sm{min-height:44px;padding:8px 18px;font-size:.92rem}
.btn .icon{width:1.1em;height:1.1em;transition:transform .25s var(--ease)}
.btn:hover .icon:last-child{transform:translateX(3px)}

/* ---------- Top bar + header ---------- */
.topbar{background:var(--ink);color:var(--cream);font-size:.88rem}
.topbar__in{display:flex;justify-content:space-between;align-items:center;gap:var(--s4);min-height:40px;flex-wrap:wrap}
.topbar a{color:var(--cream);text-decoration:none;display:inline-flex;align-items:center;gap:8px;min-height:40px}
.topbar a:hover{color:var(--lime)}
.topbar__links{display:flex;gap:var(--s5)}
.topbar__status{display:inline-flex;align-items:center;gap:8px}
.dot{width:9px;height:9px;border-radius:50%;background:#d8a24a}
.is-open .dot{background:#8fe05a;box-shadow:0 0 0 4px rgba(143,224,90,.25)}
.header{position:sticky;top:0;z-index:40;background:rgba(255,253,246,.82);-webkit-backdrop-filter:saturate(1.5) blur(16px);backdrop-filter:saturate(1.5) blur(16px);border-bottom:1px solid transparent;transition:border-color .25s,box-shadow .25s,background .25s}
.header.scrolled{border-color:var(--line);box-shadow:0 8px 30px rgba(15,55,20,.07);background:rgba(255,253,246,.94)}
.header__in{display:flex;align-items:center;justify-content:space-between;gap:var(--s5);min-height:78px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.brand img{border-radius:14px}
.brand__text{display:flex;flex-direction:column;line-height:1}
.brand__text strong{font-family:var(--display);font-size:1.5rem;font-weight:700;letter-spacing:-.02em}
.brand__text span{margin-top:4px;font-size:.7rem;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--green-700)}
.brand--light{color:var(--cream)} .brand--light .brand__text span{color:var(--lime)}
/* the real logo: transparent PNG of the mark and name (img/logo.png, 593x184); on the dark footer it sits on a cream plate */
.brand img.brand__logo{width:auto;height:62px;border-radius:0}
.brand--plate{background:var(--cream);border-radius:18px;padding:12px 18px}
.brand--plate img.brand__logo{height:54px}
.brand img.brand__mark{background:var(--cream);border-radius:11px;padding:4px;object-fit:contain}
@media (max-width:639px){.brand img.brand__logo{height:48px}.brand--plate img.brand__logo{height:46px}}
.nav{display:flex;align-items:center}
.nav ul{list-style:none;display:flex;align-items:center;gap:2px}
.nav a{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;padding:10px 13px;min-height:44px;border-radius:var(--r-pill);color:var(--ink);font-weight:600;text-decoration:none;font-size:.97rem;transition:background .2s}
.nav a:hover{background:var(--mint)}
.nav a[aria-current=page]{background:var(--mint)}
.nav__feature{background:var(--lime);margin-inline:4px}
.nav__feature:hover{background:var(--lime-2) !important}
.nav .chev{width:14px;height:14px;transition:transform .2s}
.has-sub:hover .chev,.has-sub:focus-within .chev{transform:rotate(180deg)}
.nav__cta{margin-left:var(--s3)}
.nav .nav__cta{color:#fff;padding:12px 22px} .nav .nav__cta:hover{background:var(--action-hover)}
.has-sub{position:relative}
.sub{position:absolute;top:calc(100% + 6px);left:0;min-width:270px;background:var(--white);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-3);padding:var(--s2);display:block !important;opacity:0;visibility:hidden;transform:translateY(10px);transition:.2s var(--ease)}
.has-sub::after{content:"";position:absolute;left:0;right:0;top:100%;height:12px}
.has-sub:hover .sub,.has-sub:focus-within .sub{opacity:1;visibility:visible;transform:none}
.sub a{display:flex;width:100%;border-radius:12px;font-weight:600}
.burger{display:none;background:var(--ink);color:var(--cream);border:0;width:48px;height:48px;border-radius:50%;cursor:pointer;align-items:center;justify-content:center}
.burger .i-close{display:none} .burger[aria-expanded=true] .i-open{display:none} .burger[aria-expanded=true] .i-close{display:block}

/* ---------- Sections ---------- */
.section{padding-block:var(--s8)}
.section--tight{padding-block:var(--s7)}
.section--stone,.section--mint,.section--ink,.section--sand{margin-inline:clamp(6px,1.4vw,20px);border-radius:var(--r-xl);position:relative;overflow:hidden}
.section--stone{background:var(--stone)} .section--mint{background:var(--mint)} .section--sand{background:var(--sand)}
.section--ink{background:var(--ink);color:var(--cream)}
.section--ink::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 70% at 100% 0,rgba(97,139,53,.45),transparent 60%),radial-gradient(40% 50% at 0 100%,rgba(179,214,133,.14),transparent 60%);pointer-events:none}
.section--ink::after{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.07;mix-blend-mode:overlay;pointer-events:none}
.section--ink>.container{position:relative;z-index:1}
.section--ink h2,.section--ink h3{color:var(--cream)}
.section--ink h2 em{color:var(--lime)}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:.78rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--green-700);margin-bottom:var(--s4)}
.section--ink .eyebrow,.hero .eyebrow,.pagehero .eyebrow,.shero .eyebrow{color:var(--lime)}
.lead{font-size:1.2rem;line-height:1.6;color:var(--muted);max-width:62ch}
.section--ink .lead,.hero .lead,.pagehero .lead,.shero .lead{color:rgba(255,253,246,.84)}
.sec-head{max-width:740px;margin-bottom:var(--s7)}
.sec-head--center{text-align:center;margin-inline:auto}
.sec-head--center .lead{margin-inline:auto}
.sec-head--center .eyebrow{justify-content:center}
.sec-head--row{max-width:none;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:var(--s5)}
.sec-head--row>div{max-width:680px}

/* ---------- Illustrated image blocks (swap for <img> when photos arrive) ---------- */
.ph{position:relative;border-radius:var(--r-lg);overflow:hidden;background:var(--green);isolation:isolate}
.ph img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.ph--ink img{filter:saturate(.8) brightness(.65)}
.ph--stone img{filter:saturate(.55) brightness(1.12)}

/* ---------- Hero ---------- */
.hero{position:relative;background:var(--ink);color:var(--cream);overflow:hidden;padding-block:var(--s8) calc(var(--s9) - 20px);border-radius:0 0 var(--r-xl) var(--r-xl)}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(55% 80% at 88% 10%,rgba(97,139,53,.6),transparent 62%),radial-gradient(45% 55% at 0 100%,rgba(179,214,133,.2),transparent 60%)}
.hero::after{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.08;mix-blend-mode:overlay;pointer-events:none}
.hero__grid{position:relative;z-index:1;display:grid;gap:var(--s7);align-items:center}
.hero h1{color:var(--cream);margin-bottom:var(--s5)}
.hero h1 em{color:var(--lime)}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--s3);margin:var(--s6) 0 var(--s5)}
.hero__chips{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);margin-top:var(--s5)}
.hero__chips li{display:inline-flex;align-items:center;gap:8px;color:rgba(255,253,246,.9);font-weight:500;font-size:.97rem}
.hero__chips .icon{color:var(--lime)}
.hero__visual{position:relative;max-width:560px;margin-inline:auto;width:100%}
.hero__visual .ph{aspect-ratio:1/1.04;border-radius:var(--r-xl) var(--r-xl) 160px var(--r-xl);box-shadow:var(--sh-3)}
.fcard{position:absolute;display:flex;align-items:center;gap:12px;background:rgba(255,253,246,.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:var(--text);border-radius:var(--r);padding:12px 18px 12px 12px;box-shadow:var(--sh-2);font-size:.9rem;line-height:1.3;animation:floaty 7s ease-in-out infinite}
.fcard strong{display:block;color:var(--ink);font-size:1.02rem}
.fcard__ico{width:44px;height:44px;border-radius:14px;background:var(--mint);display:grid;place-items:center;color:var(--ink);flex:none}
.fcard__ico .icon{width:22px;height:22px}
.fcard--a{left:-14px;top:9%}
.fcard--b{right:-10px;top:42%;animation-delay:-2.5s}
.fcard--c{left:5%;bottom:-24px;animation-delay:-4.5s;background:var(--lime)}
.fcard--c .fcard__ico{background:var(--ink);color:var(--lime)}
.fcard .stars{display:flex;gap:2px;color:#e0a100} .fcard .stars .icon{width:14px;height:14px;fill:#e0a100}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}

/* ---------- Marquee ---------- */
.marquee{overflow:hidden;background:var(--lime);color:var(--ink);padding-block:16px;margin-top:-28px;position:relative;z-index:2;border-block:1px solid rgba(15,55,20,.1)}
.marquee__track{display:flex;gap:var(--s7);width:max-content;animation:marquee 46s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__track span{display:inline-flex;align-items:center;gap:var(--s7);font-family:var(--display);font-size:1.25rem;font-weight:600;white-space:nowrap}
.marquee__track span::after{content:"✚";font-size:.8rem;color:var(--green-700)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------- Trust strip ---------- */
.trust{background:transparent}
.trust__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s4);padding-block:var(--s6);list-style:none}
.trust li{display:flex;align-items:center;gap:12px;font-weight:600;color:var(--ink);font-size:.95rem;line-height:1.3}
.trust .icon{width:34px;height:34px;padding:7px;border-radius:12px;background:var(--mint);color:var(--green-700);flex:none}

/* ---------- Bento tiles ---------- */
.bento{display:grid;gap:var(--s4);grid-template-columns:1fr}
.tile{position:relative;display:flex;flex-direction:column;gap:var(--s3);padding:var(--s6);border-radius:var(--r-lg);background:var(--mint);color:var(--text);text-decoration:none;overflow:hidden;min-height:250px;transition:transform .3s var(--ease),box-shadow .3s;isolation:isolate}
.tile:hover{transform:translateY(-6px);box-shadow:var(--sh-2);color:var(--text)}
.tile h3{margin:0;font-size:1.35rem}
.tile p{margin:0;color:var(--muted);font-size:.98rem;line-height:1.55;flex:1;max-width:44ch}
.tile__top{display:flex;justify-content:space-between;align-items:flex-start}
.tile__ico{width:58px;height:58px;border-radius:20px;background:var(--white);display:grid;place-items:center;color:var(--ink);box-shadow:var(--sh-1)}
.tile__ico .icon{width:28px;height:28px}
.tile__go{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;color:var(--ink);transition:.3s var(--ease)}
.tile:hover .tile__go{background:var(--ink);color:var(--lime);border-color:var(--ink);transform:rotate(-45deg)}
.tile--white{background:var(--white);box-shadow:var(--sh-1)}
.tile--white .tile__ico{background:var(--mint)}
.tile--lime{background:var(--lime)} .tile--lime p{color:#26451f}
.tile--sand{background:var(--sand)}
.tile--ink{background:var(--ink);color:var(--cream)}
.tile--ink h3{color:var(--cream)} .tile--ink p{color:rgba(255,253,246,.82)}
.tile--ink .tile__ico{background:var(--lime)} .tile--ink .tile__go{border-color:rgba(255,253,246,.3);color:var(--cream)}
.tile--ink:hover{color:var(--cream)}
.tile--feature{min-height:420px;justify-content:flex-end}
.tile--feature .tile__art{position:absolute;inset:0;z-index:-1}
.tile--feature .tile__art img{width:100%;height:100%;object-fit:cover;opacity:.55}
.tile--feature::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(15,55,20,.1) 0,rgba(15,55,20,.92) 85%)}
.tile--feature .tile__top{position:absolute;left:var(--s6);right:var(--s6);top:var(--s6)}
.tile--feature h3{font-family:var(--display);font-size:clamp(1.8rem,3vw,2.5rem);font-weight:600;letter-spacing:-.02em}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tag{font-size:.72rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:4px 11px;border-radius:var(--r-pill);background:rgba(255,255,255,.7);color:var(--green-700)}
.tile--white .tag,.tile--sand .tag{background:var(--mint)}
.tile--ink .tag,.tile--feature .tag{background:rgba(179,214,133,.2);color:var(--lime)}
.tile--lime .tag{background:rgba(15,55,20,.1);color:var(--ink)}
.pagehero .tag,.shero .tag{background:rgba(179,214,133,.2);color:var(--lime)}

/* ---------- Generic cards ---------- */
.cards{display:grid;gap:var(--s4);grid-template-columns:1fr}
.card{position:relative;display:flex;flex-direction:column;gap:var(--s3);padding:var(--s6);border-radius:var(--r-lg);background:var(--white);box-shadow:var(--sh-1);color:var(--text);text-decoration:none;transition:transform .3s var(--ease),box-shadow .3s}
a.card:hover{transform:translateY(-6px);box-shadow:var(--sh-2);color:var(--text)}
.card__ico{width:56px;height:56px;border-radius:18px;background:var(--mint);display:grid;place-items:center;color:var(--ink)}
.card__ico .icon{width:28px;height:28px}
.card h3{margin:0}
.card p{color:var(--muted);margin:0;font-size:.98rem;line-height:1.55;flex:1}
.card__more{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--ink)}
.card__more .icon{transition:transform .2s} a.card:hover .card__more .icon{transform:translateX(5px)}
.card .tag{background:var(--mint)}

/* ---------- Split / badges / lists ---------- */
.split{display:grid;gap:var(--s7);align-items:center}
.split__media{position:relative;max-width:560px;width:100%;margin-inline:auto}
.split__media .ph{aspect-ratio:1/1.05}
.badge{position:absolute;left:-10px;top:26px;background:var(--lime);color:var(--ink);border-radius:22px;padding:var(--s4) var(--s5);box-shadow:var(--sh-2);text-align:center;line-height:1.1;animation:floaty 8s ease-in-out infinite}
.badge strong{display:block;font-family:var(--display);font-size:2.2rem;font-weight:700}
.badge span{font-size:.85rem;font-weight:600}
.split__media .ph--small{position:absolute;right:-10px;bottom:-26px;width:44%;aspect-ratio:1;border:7px solid var(--cream);border-radius:28px}
.checks{list-style:none;display:grid;gap:var(--s3);margin:var(--s5) 0}
.checks li{display:flex;gap:12px;align-items:flex-start}
.checks .icon{color:var(--green-700);background:var(--mint);border-radius:50%;padding:5px;width:28px;height:28px;margin-top:1px}
.section--ink .checks .icon{background:rgba(179,214,133,.2);color:var(--lime)}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s5);margin-top:var(--s6)}
.stat strong{display:block;font-family:var(--display);font-size:clamp(2.2rem,4vw,3.2rem);font-weight:600;line-height:1;color:var(--ink);letter-spacing:-.02em}
.stat span{display:block;margin-top:8px;font-size:.9rem;color:var(--muted);font-weight:500;line-height:1.3}
.section--ink .stat strong{color:var(--lime)} .section--ink .stat span{color:rgba(255,253,246,.75)}

/* ---------- Values ---------- */
.values{display:grid;gap:var(--s4)}
.value{padding:var(--s6);border-radius:var(--r-lg);background:var(--white);box-shadow:var(--sh-1)}
.value .icon{width:50px;height:50px;padding:12px;border-radius:16px;background:var(--mint);color:var(--ink);margin-bottom:var(--s4)}
.value h3{margin-bottom:6px} .value p{margin:0;color:var(--muted);font-size:.98rem}

/* ---------- Steps / timeline ---------- */
.steps{list-style:none;counter-reset:s;display:grid;gap:var(--s4)}
.steps li{counter-increment:s;position:relative;background:var(--white);border-radius:var(--r);padding:var(--s5) var(--s5) var(--s5) 88px;box-shadow:var(--sh-1);min-height:96px}
.steps li::before{content:counter(s,decimal-leading-zero);position:absolute;left:var(--s5);top:var(--s5);width:46px;height:46px;border-radius:16px;background:var(--ink);color:var(--lime);display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:1.05rem}
.steps h3{margin:0 0 4px;font-size:1.08rem} .steps p{margin:0;color:var(--muted);font-size:.97rem}
.steps--row{display:grid}
.timeline{list-style:none;counter-reset:t;position:relative;display:grid;gap:var(--s5)}
.timeline::before{content:"";position:absolute;left:23px;top:8px;bottom:8px;width:2px;background:linear-gradient(var(--lime),var(--green));opacity:.6}
.timeline li{counter-increment:t;position:relative;padding-left:72px;min-height:48px}
.timeline li::before{content:counter(t);position:absolute;left:0;top:0;width:48px;height:48px;border-radius:50%;background:var(--ink);color:var(--lime);display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:1.15rem;box-shadow:0 0 0 6px var(--cream)}
.section--mint .timeline li::before{box-shadow:0 0 0 6px var(--mint)}
.timeline h3{margin:0 0 4px;font-size:1.1rem} .timeline p{margin:0;color:var(--muted)}

/* ---------- Page heroes ---------- */
.pagehero,.shero{position:relative;background:var(--ink);color:var(--cream);padding-block:var(--s8) var(--s8);overflow:hidden;border-radius:0 0 var(--r-xl) var(--r-xl)}
.pagehero::before,.shero::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 90% at 92% 0,rgba(97,139,53,.55),transparent 60%),radial-gradient(35% 60% at 0 100%,rgba(179,214,133,.16),transparent 60%)}
.pagehero::after,.shero::after{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.08;mix-blend-mode:overlay;pointer-events:none}
.pagehero .container,.shero .container{position:relative;z-index:1}
.pagehero h1,.shero h1{color:var(--cream);font-size:clamp(2.2rem,4.8vw,3.8rem);max-width:18ch}
.pagehero h1 em,.shero h1 em{color:var(--lime)}
.pagehero__actions{display:flex;gap:var(--s3);flex-wrap:wrap;margin-top:var(--s5)}
.crumbs{display:flex;gap:8px;list-style:none;font-size:.9rem;margin-bottom:var(--s5);flex-wrap:wrap;align-items:center}
.crumbs a{color:var(--lime)} .crumbs li+li::before{content:"/";margin-right:8px;opacity:.45}
.shero__grid{display:grid;gap:var(--s7);align-items:center}
.factscard{background:rgba(255,253,246,.1);border:1px solid rgba(255,253,246,.2);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:var(--r-lg);padding:var(--s6)}
.factscard h2{font-family:var(--font);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--lime);margin-bottom:var(--s4);font-weight:700}
.facts{list-style:none;display:grid;gap:var(--s4)}
.facts li{display:flex;gap:14px;align-items:flex-start}
.facts .icon{width:42px;height:42px;padding:10px;border-radius:14px;background:rgba(179,214,133,.2);color:var(--lime)}
.facts span{display:block;font-size:.8rem;color:rgba(255,253,246,.7);text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.facts strong{display:block;color:var(--cream);font-weight:600;line-height:1.35}

/* ---------- Service page layout ---------- */
.toc{position:sticky;top:78px;z-index:30;background:rgba(255,253,246,.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);margin-top:-1px}
.toc__in{display:flex;gap:6px;overflow-x:auto;padding-block:10px;scrollbar-width:none}
.toc__in::-webkit-scrollbar{display:none}
.toc a{flex:none;display:inline-flex;align-items:center;min-height:42px;padding:8px 18px;border-radius:var(--r-pill);font-weight:600;font-size:.93rem;color:var(--ink);text-decoration:none;transition:.2s}
.toc a:hover{background:var(--mint)}
.toc a.active{background:var(--ink);color:var(--cream)}
.svc{display:grid;gap:var(--s7);align-items:start}
.sblock{scroll-margin-top:150px;margin-bottom:var(--s8)}
.sblock:last-child{margin-bottom:0}
.sblock>h2{font-size:clamp(1.7rem,3vw,2.35rem);margin-bottom:var(--s5)}
.sblock>.lead{margin-bottom:var(--s5)}
.prose-p p{max-width:68ch;color:var(--text)}
.aside{display:grid;gap:var(--s4)}
.bookcard{background:var(--ink);color:var(--cream);border-radius:var(--r-lg);padding:var(--s6);position:relative;overflow:hidden;box-shadow:var(--sh-3)}
.bookcard::before{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(97,139,53,.7),transparent 70%)}
.bookcard>*{position:relative}
.bookcard h2{font-family:var(--display);font-size:1.6rem;color:var(--cream);margin-bottom:var(--s2)}
.bookcard p{color:rgba(255,253,246,.8);font-size:.97rem}
.bookcard .btn{width:100%;margin-top:var(--s2)}
.bookcard__status{display:inline-flex;align-items:center;gap:8px;font-size:.88rem;font-weight:600;background:rgba(255,253,246,.1);padding:6px 14px;border-radius:var(--r-pill);margin-bottom:var(--s4)}
.bookcard ul{list-style:none;display:grid;gap:8px;margin:var(--s4) 0;font-size:.93rem}
.bookcard li{display:flex;gap:10px;align-items:center;color:rgba(255,253,246,.9)} .bookcard li .icon{color:var(--lime);width:1.1em}
.sidecard{background:var(--white);border-radius:var(--r-lg);padding:var(--s5);box-shadow:var(--sh-1)}
.sidecard h3{font-size:1rem;margin-bottom:var(--s3)}
.sidecard ul{list-style:none;display:grid;gap:6px}
.sidecard li a{display:flex;align-items:center;gap:10px;padding:8px 0;font-weight:600;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line)}
.sidecard li:last-child a{border:0} .sidecard li a:hover{color:var(--green-700)} .sidecard li a .icon{color:var(--green)}
.groups{display:grid;gap:var(--s4)}
.group{background:var(--white);border-radius:var(--r-lg);padding:var(--s6);box-shadow:var(--sh-1)}
.group h3{display:flex;gap:10px;align-items:center;margin-bottom:var(--s3)}
.group .checks{margin:0}
.notbox{margin-top:var(--s4);background:var(--amber-bg);border:1px solid #f0d9a6;border-radius:var(--r-lg);padding:var(--s6)}
.notbox h3{display:flex;gap:10px;align-items:center;color:var(--amber);margin-bottom:var(--s3)}
.notbox ul{list-style:none;display:grid;gap:10px}
.notbox li{display:flex;gap:12px;align-items:flex-start;color:#4a3300}
.notbox li .icon{color:var(--amber);margin-top:3px;width:1.1em;height:1.1em}
.igrid{display:grid;gap:var(--s4)}
.icard{background:var(--white);border-radius:var(--r-lg);padding:var(--s5);box-shadow:var(--sh-1);display:flex;gap:16px;align-items:flex-start}
.icard .icon{width:48px;height:48px;padding:12px;border-radius:16px;background:var(--mint);color:var(--ink)}
.icard h3{margin-bottom:4px;font-size:1.05rem} .icard p{margin:0;color:var(--muted);font-size:.96rem}
.mgrid{display:grid;gap:var(--s3)}
.mcard{background:var(--white);border-radius:var(--r);padding:var(--s5);box-shadow:var(--sh-1);border:1px solid transparent;transition:.25s var(--ease)}
.mcard:hover{border-color:var(--lime);transform:translateY(-3px);box-shadow:var(--sh-2)}
.mcard__top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:6px}
.mcard h3{margin:0;font-size:1.05rem} .mcard p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.55}
.mcard>.icon{width:42px;height:42px;padding:10px;border-radius:14px;background:var(--mint);color:var(--ink);margin-bottom:var(--s3)}
.pill{display:inline-block;padding:3px 12px;border-radius:99px;font-size:.74rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;background:var(--mint);color:var(--green-700);white-space:nowrap}
.bigsec{display:grid;gap:var(--s4)}
.bigsec__item{background:var(--white);border-radius:var(--r-lg);padding:var(--s6);box-shadow:var(--sh-1)}
.bigsec__item h3{display:flex;gap:12px;align-items:center;font-size:1.3rem}
.bigsec__item h3 .icon{width:48px;height:48px;padding:12px;border-radius:16px;background:var(--mint);color:var(--ink)}
.bigsec__item .checks{margin:var(--s4) 0}
.bigsec__foot{margin:0;font-size:.93rem;color:var(--green-700);font-weight:600;border-top:1px dashed var(--line);padding-top:var(--s3)}
.twocol{display:grid;gap:var(--s4)}
.minicard{background:var(--white);border-radius:var(--r-lg);padding:var(--s6);box-shadow:var(--sh-1)}
.minicard h3{display:flex;gap:10px;align-items:center}
.minicard h3 .icon{color:var(--green)}
.minicard ul{list-style:none;display:grid;gap:12px;margin-top:var(--s3)}
.minicard li{display:flex;gap:12px;align-items:flex-start}
.minicard li::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--lime);margin-top:.6em;box-shadow:0 0 0 3px var(--mint)}
.callout{display:flex;gap:16px;border-radius:var(--r-lg);padding:var(--s5) var(--s6);margin-block:var(--s5)}
.callout .icon{width:28px;height:28px;margin-top:2px}
.callout h3{margin-bottom:4px;font-size:1.05rem} .callout p{margin:0}
.callout--info{background:var(--mint);border:1px solid var(--lime)} .callout--info .icon{color:var(--green-700)}
.callout--warn{background:var(--amber-bg);border:1px solid #f0d9a6} .callout--warn .icon,.callout--warn h3{color:var(--amber)}
.callout--urgent{background:#fdecea;border:1px solid #efb7b1} .callout--urgent .icon,.callout--urgent h3{color:var(--danger)}
.sources{list-style:none;display:grid;gap:8px}
.sources a{display:inline-flex;align-items:center;gap:8px;font-weight:600}
.sources .icon{width:1em;height:1em}
.note{display:flex;gap:12px;background:var(--mint);border-left:4px solid var(--green);border-radius:var(--r-sm);padding:var(--s4);color:var(--text);font-size:.95rem}
.note .icon{color:var(--green-700);margin-top:2px}
.note--warn{background:var(--amber-bg);border-color:#c98a1b}
.vgrid{display:grid;gap:var(--s3)}
.vcard{background:var(--white);border-radius:var(--r);padding:var(--s4) var(--s5);box-shadow:var(--sh-1);display:flex;gap:14px;align-items:flex-start}
.vcard .icon{width:40px;height:40px;padding:9px;border-radius:13px;background:var(--mint);color:var(--ink)}
.vcard strong{display:block;color:var(--ink);line-height:1.25} .vcard span{font-size:.92rem;color:var(--muted);line-height:1.45;display:block;margin-top:2px}

/* ---------- Services index ---------- */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:var(--s6)}
.chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 20px;border-radius:var(--r-pill);border:1.5px solid var(--line);background:var(--white);font:600 .95rem var(--font);color:var(--ink);cursor:pointer;transition:.2s}
.chip:hover{border-color:var(--green)}
.chip[aria-pressed=true]{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.scards{display:grid;gap:var(--s4)}
.scards .tile[hidden]{display:none}

/* ---------- Compare (vaccinations hub) ---------- */
.compare{display:grid;gap:var(--s4)}
.cmp{background:var(--white);border-radius:var(--r-lg);padding:var(--s6);box-shadow:var(--sh-1);display:flex;flex-direction:column}
.cmp__ico{width:56px;height:56px;border-radius:18px;background:var(--mint);display:grid;place-items:center;margin-bottom:var(--s4)}
.cmp__ico .icon{width:28px;height:28px}
.cmp dl{margin:var(--s4) 0;display:grid;gap:var(--s3);flex:1}
.cmp dt{font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:700}
.cmp dd{margin:0;color:var(--ink);font-weight:500;line-height:1.45}
.cmp .btn{width:100%}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:var(--s3);max-width:900px}
.faq details{background:var(--white);border-radius:var(--r);box-shadow:var(--sh-1);border:1px solid transparent;transition:border-color .2s}
.faq details[open]{border-color:var(--lime)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--s4);padding:var(--s4) var(--s5);min-height:64px;font-weight:700;color:var(--ink);font-size:1.03rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary .icon{transition:transform .25s var(--ease);color:var(--green);background:var(--mint);border-radius:50%;padding:5px;width:30px;height:30px}
.faq details[open] summary .icon{transform:rotate(180deg)}
.faq details p{padding:0 var(--s5) var(--s5);margin:0;color:var(--muted);max-width:70ch}

/* ---------- CTA band ---------- */
.cta{background:var(--ink);color:var(--cream);border-radius:var(--r-xl);padding:var(--s7) var(--s6);display:grid;gap:var(--s5);align-items:center;position:relative;overflow:hidden}
.cta::before{content:"";position:absolute;right:-90px;top:-90px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(97,139,53,.65),transparent 70%)}
.cta::after{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.07;mix-blend-mode:overlay}
.cta>*{position:relative;z-index:1}
.cta h2{color:var(--cream);margin:0 0 var(--s2)} .cta h2 em{color:var(--lime)} .cta p{margin:0;color:rgba(255,253,246,.8)}
.cta__actions{display:flex;flex-wrap:wrap;gap:var(--s3)}
.section--cta{padding-block:var(--s7) var(--s8)}

/* ---------- BMI calculator ---------- */
.bmi{background:var(--white);border-radius:var(--r-xl);box-shadow:var(--sh-2);padding:var(--s6);display:grid;gap:var(--s5)}
.bmi__result{border-radius:var(--r-lg);background:var(--ink);color:var(--cream);padding:var(--s6);min-height:200px;position:relative;overflow:hidden}
.bmi__result::before{content:"";position:absolute;right:-50px;top:-50px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(97,139,53,.7),transparent 70%)}
.bmi__result>*{position:relative}
.bmi__num{font-family:var(--display);font-size:4rem;font-weight:600;color:var(--lime);line-height:1}
.bmi__cat{font-weight:700;margin:8px 0 10px;color:var(--cream)}
.bmi__msg{margin:0;color:rgba(255,253,246,.82);font-size:.98rem}
.unit-switch{display:inline-flex;background:var(--mint);border-radius:var(--r-pill);padding:4px;gap:4px}
.unit-switch button{border:0;background:transparent;border-radius:var(--r-pill);padding:10px 18px;min-height:44px;font:600 .95rem var(--font);color:var(--ink);cursor:pointer}
.unit-switch button[aria-pressed=true]{background:var(--ink);color:var(--cream)}

/* ---------- Forms ---------- */
.form{display:grid;gap:var(--s5)}
.form__row{display:grid;gap:var(--s5)}
.form__row>*{min-width:0}
.field label,.field legend{display:block;font-weight:700;color:var(--ink);margin-bottom:6px;font-size:.96rem;padding:0}
.field .req{color:var(--danger)}
.field .hint{display:block;font-size:.88rem;color:var(--muted);margin-top:6px;font-weight:400}
input[type=text],input[type=email],input[type=tel],input[type=url],input[type=number],input[type=password],input[type=date],input[type=time],select,textarea{width:100%;min-height:54px;padding:12px 18px;border:1.5px solid #bccbb3;border-radius:14px;background:var(--white);font:400 1rem/1.4 var(--font);color:var(--text);transition:border-color .15s,box-shadow .15s}
textarea{min-height:130px;resize:vertical}
input:hover,select:hover,textarea:hover{border-color:var(--green)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 4px rgba(97,139,53,.28)}
.field.has-error input,.field.has-error select,.field.has-error textarea{border-color:var(--danger)}
.error{display:flex;gap:6px;align-items:flex-start;color:var(--danger);font-weight:600;font-size:.9rem;margin-top:6px}
.error .icon{width:1.1em;height:1.1em;margin-top:2px}
.alert{border-radius:var(--r);padding:var(--s4) var(--s5);display:flex;gap:12px;align-items:flex-start;font-weight:600}
.alert--error{background:#fdecea;color:var(--danger);border:1px solid #efb7b1}
.alert--ok{background:var(--mint);color:var(--ink);border:1px solid var(--lime)}
.check{display:flex;gap:12px;align-items:flex-start}
.check input{width:24px;height:24px;margin-top:2px;accent-color:var(--ink);flex:none}
.check label{margin:0;font-weight:400;color:var(--text)}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}
.slots{display:flex;flex-wrap:wrap;gap:8px}
.slots input{position:absolute;opacity:0;pointer-events:none}
.slots label{margin:0;display:inline-flex;align-items:center;justify-content:center;min-width:80px;min-height:46px;padding:8px 14px;border:1.5px solid #bccbb3;border-radius:var(--r-pill);background:var(--white);font-weight:600;color:var(--ink);cursor:pointer;transition:.15s}
.slots label:hover{border-color:var(--green)}
.slots input:checked+label{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.slots input:focus-visible+label{outline:3px solid var(--green);outline-offset:2px}
.slots__msg{color:var(--muted);font-size:.95rem;margin:0 0 var(--s2)}
.formcard{background:var(--white);border-radius:var(--r-xl);box-shadow:var(--sh-2);padding:var(--s6)}
.wm-fields{background:var(--mint);border-radius:var(--r);padding:var(--s5);display:grid;gap:var(--s4)}
.wm-fields[hidden]{display:none}

/* ---------- Page helpers ---------- */
.two{display:grid;gap:var(--s7)}
.contact-list{list-style:none;display:grid;gap:var(--s4)}
.contact-list li{display:flex;gap:14px;align-items:flex-start}
.contact-list .ico{width:50px;height:50px;border-radius:16px;background:var(--mint);display:grid;place-items:center;color:var(--ink);flex:none}
.contact-list strong{display:block;color:var(--ink)}
.map{border:0;width:100%;aspect-ratio:16/10;border-radius:var(--r-xl);box-shadow:var(--sh-1);background:var(--stone)}
.prose{max-width:760px} .prose h2{font-size:1.6rem;margin-top:var(--s6)} .prose ul{padding-left:1.2rem;margin-bottom:var(--s4)}
.hours-table{width:100%;border-collapse:collapse}
.hours-table th,.hours-table td{text-align:left;padding:11px 0;border-bottom:1px solid var(--line);font-weight:500}
.hours-table td{text-align:right;font-weight:700;color:var(--ink)}
.hours-table tr.today th,.hours-table tr.today td{color:var(--green-700)}
.confirm{max-width:720px;text-align:center;margin-inline:auto}
.confirm .card__ico{margin:0 auto var(--s5);background:var(--lime)}
.confirm .hero__actions{justify-content:center}
.ref{font-size:1.4rem;letter-spacing:.08em;background:var(--mint);padding:4px 14px;border-radius:8px}
.legend-like{display:block;margin-bottom:6px;color:var(--ink)}
.block{background:var(--white);border-radius:var(--r-lg);padding:var(--s6);box-shadow:var(--sh-1);color:var(--text)}
.block h3{display:flex;gap:12px;align-items:center}
.block h3 .icon{color:var(--green);background:var(--mint);width:44px;height:44px;padding:10px;border-radius:14px}
.block .checks{margin-bottom:0}
.section--ink .block h3{color:var(--ink)}
.section--ink .block .checks .icon{background:var(--mint);color:var(--green)}
.reviews-badge{display:inline-flex;align-items:center;gap:10px;background:var(--white);border-radius:var(--r-pill);padding:10px 18px;box-shadow:var(--sh-1);font-weight:700;color:var(--ink)}
.reviews-badge .icon{color:#e0a100;fill:#e0a100}
.hours-card{background:var(--white);border-radius:var(--r-xl);padding:var(--s6);box-shadow:var(--sh-1)}
.visit{display:grid;gap:var(--s5);align-items:stretch}
.pillars{display:grid;gap:var(--s4)}
.pillar{background:rgba(255,253,246,.08);border:1px solid rgba(255,253,246,.16);border-radius:var(--r-lg);padding:var(--s5)}
.pillar .icon{width:48px;height:48px;padding:12px;border-radius:16px;background:var(--lime);color:var(--ink);margin-bottom:var(--s3)}
.pillar h3{margin-bottom:6px;color:var(--cream)} .pillar p{margin:0;color:rgba(255,253,246,.8);font-size:.96rem}

/* ---------- Footer ---------- */
.footer{background:var(--ink);color:rgba(255,253,246,.82);padding-top:var(--s8);margin:var(--s7) clamp(6px,1.4vw,20px) 0;border-radius:var(--r-xl) var(--r-xl) 0 0;position:relative;overflow:hidden}
.footer::before{content:"";position:absolute;inset:0;background:radial-gradient(40% 50% at 100% 0,rgba(97,139,53,.4),transparent 60%);pointer-events:none}
.footer>*{position:relative}
.footer a{color:rgba(255,253,246,.9);text-decoration:none} .footer a:hover{color:var(--lime);text-decoration:underline}
.footer__grid{display:grid;gap:var(--s7);padding-bottom:var(--s7)}
.footer__h{font-family:var(--font);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--lime);margin-bottom:var(--s4);font-weight:700}
.footer__list{list-style:none;display:grid;gap:2px} .footer__list a{display:inline-block;padding:5px 0}
.footer__about{margin-top:var(--s4);max-width:36ch}
.footer__addr{font-style:normal;margin-bottom:var(--s4)}
.footer__big{font-family:var(--display);font-size:1.5rem;font-weight:600;display:inline-flex;gap:10px;align-items:center}
.footer p a{display:inline-flex;gap:10px;align-items:center;padding:4px 0}
.hours{margin:0;display:grid;gap:6px}
.hours div{display:flex;justify-content:space-between;gap:var(--s4);border-bottom:1px dashed rgba(255,253,246,.18);padding-bottom:6px}
.hours dt{font-weight:600} .hours dd{margin:0}
.social{display:flex;gap:10px;margin-top:var(--s4)}
.social a{width:44px;height:44px;border-radius:50%;background:rgba(255,253,246,.1);display:grid;place-items:center}
.footer__legal{border-top:1px solid rgba(255,253,246,.14);padding-block:var(--s5);font-size:.88rem;display:grid;gap:6px}
.footer__legal p{margin:0}

/* ---------- Mobile action bar ---------- */
.mobilebar{position:fixed;left:10px;right:10px;bottom:10px;z-index:50;display:grid;grid-template-columns:1fr 1.5fr;gap:8px;padding:8px;background:rgba(15,55,20,.94);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--r-pill);box-shadow:var(--sh-3)}
.mobilebar a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:var(--r-pill);font-weight:700;text-decoration:none;color:var(--cream);background:rgba(255,253,246,.12)}
.mobilebar a.is-primary{background:var(--lime);color:var(--ink)}

/* ---------- Reveal ---------- */
.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js .reveal.in{opacity:1;transform:none}
.js .reveal[data-d="1"]{transition-delay:.08s}.js .reveal[data-d="2"]{transition-delay:.16s}.js .reveal[data-d="3"]{transition-delay:.24s}

/* ---------- Responsive ---------- */
@media (max-width:959px){
  .burger{display:inline-flex}
  .nav{display:block;position:absolute;left:0;right:0;top:100%;background:var(--cream);border-bottom:1px solid var(--line);box-shadow:var(--sh-2);padding:var(--s4) var(--s4) var(--s6);max-height:calc(100dvh - 78px);overflow:auto;transform:translateY(-8px);opacity:0;visibility:hidden;transition:transform .25s var(--ease),opacity .25s,visibility .25s}
  .nav.open{transform:none;opacity:1;visibility:visible}
  .nav ul{flex-direction:column;align-items:stretch;gap:4px}
  .nav a{font-size:1.1rem;padding:14px 16px;width:100%}
  .nav__feature{margin-inline:0}
  .sub{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;background:transparent;padding:0 0 0 var(--s4);min-width:0}
  .has-sub::after{display:none}
  .sub a{font-weight:400;font-size:1rem}
  .nav .chev{display:none}
  .nav__cta{margin:var(--s4) 0 0;width:100%}
  body.menu-open{overflow:hidden}
  .fcard--a{left:6px} .fcard--b{right:6px}
}
@media (min-width:640px){
  .hide-sm{display:inline-flex}
  .cards{grid-template-columns:repeat(2,1fr)}
  .bento{grid-template-columns:repeat(2,1fr)}
  .trust__grid{grid-template-columns:repeat(4,1fr)}
  .stats{grid-template-columns:repeat(4,1fr)}
  .form__row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .values,.igrid,.twocol,.groups,.vgrid,.mgrid,.scards,.pillars{grid-template-columns:repeat(2,1fr)}
  .cta{grid-template-columns:1.5fr 1fr;padding:var(--s8) var(--s7)} .cta__actions{justify-content:flex-end}
  .footer__legal{grid-template-columns:1fr auto;align-items:center}
  .compare{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:640px) and (max-width:959px){.bento .tile--feature{grid-column:1/-1}}
@media (min-width:960px){
  body{padding-bottom:0}
  .mobilebar{display:none}
  .hero__grid{grid-template-columns:1.05fr .95fr}
  .split{grid-template-columns:1fr 1fr} .split--rev .split__media{order:2}
  .two{grid-template-columns:1fr 1fr}
  .shero__grid{grid-template-columns:1.3fr .7fr}
  .bmi{grid-template-columns:1fr 1fr;padding:var(--s7)}
  .footer__grid{grid-template-columns:1.1fr 1fr 1fr 1.1fr}
  .svc{grid-template-columns:minmax(0,1fr) 360px}
  .aside{position:sticky;top:170px}
  .visit{grid-template-columns:.8fr 1.2fr}
  .bento{grid-template-columns:repeat(12,1fr)}
  .bento .span-6{grid-column:span 6} .bento .span-4{grid-column:span 4} .bento .span-3{grid-column:span 3} .bento .span-8{grid-column:span 8}
  .bento .row-2{grid-row:span 2}
  .pillars{grid-template-columns:repeat(4,1fr)}
}
@media (min-width:1100px){
  .cards--3,.scards{grid-template-columns:repeat(3,1fr)}
  .cards--4,.values{grid-template-columns:repeat(4,1fr)}
  .steps--row{grid-template-columns:repeat(4,1fr)}
  .steps--row li{padding:88px var(--s5) var(--s5)}
  .steps--row li::before{top:var(--s5)}
  .vgrid{grid-template-columns:repeat(3,1fr)}
  .mgrid--3{grid-template-columns:repeat(3,1fr)}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important;animation-iteration-count:1 !important;scroll-behavior:auto !important}
  .js .reveal{opacity:1;transform:none}
  .marquee__track{animation:none}
}
@media print{.topbar,.header,.mobilebar,.cta,.toc,.aside{display:none}}

/* ---------- Utilities ---------- */
.mt-4{margin-top:var(--s4)} .mt-5{margin-top:var(--s5)} .mt-6{margin-top:var(--s6)} .mt-7{margin-top:var(--s7)} .mb-4{margin-bottom:var(--s4)} .mb-7{margin-bottom:var(--s7)}
.maxw-860{max-width:860px} .is-body{color:var(--text)} .center{text-align:center}

/* ---------- Fixes ---------- */
.tile--feature h3{margin-top:auto}
.tile--feature p{flex:none}
a.fcard{text-decoration:none}
a.fcard:hover{color:var(--text);transform:translateY(-3px)}
.groups>.group:only-child{grid-column:1/-1}

.nav__opt{display:none}
@media (min-width:1200px){.nav__opt{display:list-item}}
@media (max-width:959px){.nav__opt{display:list-item}}

/* ---------- Blue and teal mixed into the green (12 Oct 2026) ----------
   Green stays the lead: dark panels, headings, tiles and the footer are forest green with lime highlights.
   Royal blue from the shop front is the colour of actions and of what is selected or hovered, plus two blue bands.
   Teal is only a small accent (glows and the dots in the strip under the hero). Nothing here is needed by the
   green design, so it can be dialled back or removed. */

/* the closing call-to-action band is royal blue */
.cta{background:var(--blue)}

/* a little blue in the light behind dark panels, teal in the small glows */
.hero::before{background:radial-gradient(55% 80% at 88% 10%,rgba(97,139,53,.6),transparent 62%),radial-gradient(48% 62% at 0 100%,rgba(31,79,209,.4),transparent 64%)}
.pagehero::before,.shero::before{background:radial-gradient(50% 90% at 92% 0,rgba(97,139,53,.55),transparent 60%),radial-gradient(42% 75% at 0 100%,rgba(31,79,209,.38),transparent 64%)}
.section--ink::before{background:radial-gradient(50% 70% at 100% 0,rgba(97,139,53,.45),transparent 60%),radial-gradient(40% 60% at 0 100%,rgba(31,79,209,.3),transparent 64%)}
.footer::before{background:radial-gradient(40% 50% at 100% 0,rgba(97,139,53,.4),transparent 60%),radial-gradient(40% 60% at 0 100%,rgba(31,79,209,.28),transparent 64%)}
.bookcard::before,.bmi__result::before,.cta::before{background:radial-gradient(circle,rgba(0,184,169,.5),transparent 70%)}
.bookcard h2 em{color:var(--lime)}

/* the royal blue band under the hero, like the window band on the shop front */
.marquee{background:var(--blue);color:var(--cream);border-block:0}
.marquee__track span::after{color:var(--teal-2)}

/* mobile action bar: blue bar, lime button */
.mobilebar{background:rgba(10,42,143,.95)}

/* pale blue tile, info note and callout */
.tile--sky{background:var(--sky)}
.tile--sky .tile__ico{color:var(--blue-700)}
.tile--sky .tag{background:rgba(255,255,255,.78)}
.callout--info{background:var(--sky);border-color:#b8cdfa} .callout--info .icon{color:var(--blue-700)}
.note{background:var(--sky);border-left-color:var(--blue)} .note .icon{color:var(--blue-700)}

/* icon chips on light surfaces are pale blue with a blue icon (ticks and checks stay green) */
.card__ico,.value .icon,.icard .icon,.mcard>.icon,.vcard .icon,.bigsec__item h3 .icon,.contact-list .ico,.cmp__ico,.trust .icon,.block h3 .icon,.faq summary .icon,.fcard__ico,.tile--white .tile__ico{background:var(--sky);color:var(--blue-700)}
.sidecard li a .icon,.minicard h3 .icon,.sidecard li a:hover{color:var(--blue-700)}

/* hovered, chosen and current things are blue */
.chip:hover,.mcard:hover,.faq details[open]{border-color:var(--blue)}
.chip[aria-pressed=true],.toc a.active,.unit-switch button[aria-pressed=true]{background:var(--action);border-color:var(--action);color:#fff}
.toc a:hover,.unit-switch{background:var(--sky)}
.slots label:hover,input:hover,select:hover,textarea:hover{border-color:var(--blue)}
.slots input:checked+label{background:var(--action);border-color:var(--action);color:#fff}
.slots input:focus-visible+label{outline-color:var(--blue)}
input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(31,79,209,.22)}
.check input{accent-color:var(--blue)}
.timeline::before{background:linear-gradient(var(--teal),var(--blue))}

/* on dark panels the keyboard focus ring is lime so it can be seen */
.hero :focus-visible,.pagehero :focus-visible,.shero :focus-visible,.section--ink :focus-visible,.footer :focus-visible,.cta :focus-visible,.bookcard :focus-visible,.topbar :focus-visible,.marquee :focus-visible{outline-color:var(--lime)}