/*
Theme Name: TOPS 2026
Theme URI: https://example.com/tops2026
Author: Click Happy Marketing
Author URI: https://clickhappymarketing.com
Description: A calm, accessible theme built around a teal and lime palette, generous type and rounded cards. Designed for professional service and clinic sites, it ships a full-width template and an Elementor canvas template, registers Elementor theme-builder locations, and works on its own with the block editor when no page builder is active. Includes a sticky header, mega-menu ready navigation, accordion and tab-of-contents patterns, bundled Mulish webfonts, editor styles and full translation support.
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.2.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tops2026
Tags: one-column, two-columns, right-sidebar, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, threaded-comments, translation-ready, theme-options, blog

TOPS 2026 is distributed under the terms of the GNU GPL v2 or later.

TOPS 2026 bundles the following third-party resources:

Mulish (variable), Copyright 2016 The Mulish Project Authors
License: SIL Open Font License, 1.1 -- https://opensource.org/licenses/OFL-1.1
Source: https://github.com/googlefonts/mulish
Files: assets/fonts/mulish/

Normalising rules and the accessible skip-link pattern are adapted from
Underscores (_s), Copyright Automattic, Inc.
License: GNU GPL v2 or later -- https://www.gnu.org/licenses/gpl-2.0.html
Source: https://underscores.me/
*/

/* ==========================================================================
   1. Bundled webfont (served locally -- no external requests)
   ========================================================================== */
@font-face{
  font-family:'Mulish';
  font-style:normal;
  font-weight:200 1000;
  font-display:swap;
  src:url('assets/fonts/mulish/mulish-latin-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Mulish';
  font-style:normal;
  font-weight:200 1000;
  font-display:swap;
  src:url('assets/fonts/mulish/mulish-latin-ext-normal.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Mulish';
  font-style:italic;
  font-weight:200 1000;
  font-display:swap;
  src:url('assets/fonts/mulish/mulish-latin-italic.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Mulish';
  font-style:italic;
  font-weight:200 1000;
  font-display:swap;
  src:url('assets/fonts/mulish/mulish-latin-ext-italic.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ==========================================================================
   2. Design system -- tokens, layout, type, components
   ========================================================================== */
/* ---------- tokens ---------- */
:root{
  /* teal ramp */
  --teal-500:#5AA7A7;
  --teal-600:#4E9C9C;
  --teal-700:#2C6567;
  --teal-800:#26585A;
  --teal-850:#23595B;
  --teal-900:#1F4C4E;
  --teal-950:#1B4547;

  /* lime + yellow */
  --lime-500:#BAC94A;
  --lime-700:#91A32F;
  --yellow-400:#E2D36B;

  /* mint ramp */
  --mint-400:#96D7C6;
  --mint-200:#B9DCD3;
  --mint-100:#D6EFE7;
  --mint-50:#DDF0E9;

  /* surfaces */
  --surface-mint:#E8F5EF;
  --surface-page:#F5FAF8;
  --white:#FFFFFF;

  /* text */
  --text-body:#5C7B79;
  --text-nav:#3D5F5E;
  --text-muted:#7E9997;
  --text-placeholder:#9DB6B3;
  --dot-inactive:#BFD9D2;
  --bullet:#6E9E9E;
  --icon-bg:#EEF3D6;

  /* shadows */
  --sh-card:0 10px 30px rgba(31,76,78,.07);
  --sh-card-hover:0 28px 56px rgba(31,76,78,.2);
  --sh-cond:0 16px 36px rgba(31,76,78,.18);
  --sh-cond-hover:0 36px 68px rgba(31,76,78,.32);
  --sh-hero-card:0 30px 60px rgba(31,76,78,.34);
  --sh-lime:0 12px 28px rgba(186,201,74,.34);

  /* geometry */
  --gutter:56px;
  --sec-y:78px;
  /* Content cap. The design was drawn at 1440px with 56px gutters => 1328px of
     content. Backgrounds stay full-bleed; only the content is capped and centred,
     so the layout matches the comp at 1440px and stops stretching above it. */
  --content-max:1328px;
  --rail:max(var(--gutter), calc((100% - var(--content-max)) / 2));
  --r-pill:30px;
  --r-card:22px;
  --r-panel:18px;
  --r-chip:16px;
  --r-input:12px;

  --font:'Mulish',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ease:cubic-bezier(.4,0,.2,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;background:var(--surface-page);color:var(--text-body);
  font-family:var(--font);font-size:16px;line-height:1.75;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
h1,h2,h3,h4{margin:0;color:var(--teal-850);font-weight:800;letter-spacing:-.9px;line-height:1.15;}
p{margin:0;}
button{font-family:inherit;}
::selection{background:var(--lime-500);color:var(--teal-900);}
:focus-visible{outline:3px solid var(--lime-500);outline-offset:2px;}

/* ---------- layout ---------- */
.sec{padding:var(--sec-y) var(--rail);}        /* full-bleed background, capped content */
.sec--tight{padding-top:0;}
.bg-page{background:var(--surface-page);}
.bg-mint{background:var(--surface-mint);}
.bg-white{background:var(--white);}

/* ---------- type ---------- */
.eyebrow{
  font-size:12.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;
  color:var(--lime-700);margin-bottom:12px;display:block;
}
.eyebrow--dark{color:var(--yellow-400);}
.h1{font-size:66px;font-weight:800;letter-spacing:-1.4px;line-height:1.08;color:var(--white);}
.h1--page{font-size:56px;letter-spacing:-1.2px;}
.h2{font-size:43px;font-weight:800;letter-spacing:-.9px;}
.h2--lg{font-size:47px;}
.h2--light{color:var(--white);}
.h3{font-size:20px;font-weight:800;letter-spacing:-.3px;}
.lede{font-size:17.5px;line-height:1.7;}
.body{font-size:16px;line-height:1.75;}
.small{font-size:14.5px;line-height:1.65;}
.muted{color:var(--text-muted);}
.on-dark{color:var(--mint-200);}
.tnum{font-variant-numeric:tabular-nums;}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-size:15px;font-weight:700;padding:14px 28px;border-radius:var(--r-pill);
  border:0;cursor:pointer;white-space:nowrap;
  transition:transform .2s ease,filter .2s ease,background .2s ease,color .2s ease;
}
.btn--lime{background:var(--lime-500);color:var(--teal-900);box-shadow:var(--sh-lime);}
.btn--lime:hover{transform:translateY(-2px);filter:brightness(1.07);}
.btn--sm{font-size:14px;padding:13px 26px;}
.btn--block{width:100%;}
.btn--call{
  background:var(--white);color:var(--teal-500);border:1.5px solid var(--mint-200);
  box-shadow:none;
}
.btn--call:hover{
  background:var(--teal-500);color:var(--white);border-color:var(--teal-500);
  transform:translateY(-2px);
}
.btn--ghost-light{background:transparent;color:var(--white);border:1px solid rgba(255,255,255,.35);}
.btn--ghost-light:hover{border-color:var(--white);transform:translateY(-2px);}
.btn--ghost-light .arw{color:var(--yellow-400);transition:transform .2s ease;}
.btn--ghost-light:hover .arw{transform:translateX(4px);}
.link-plain{font-size:15px;font-weight:700;color:var(--white);display:inline-flex;align-items:center;gap:8px;}
.link-plain .arw{color:var(--yellow-400);transition:transform .2s ease;}
.link-plain:hover .arw{transform:translateX(4px);}
.link-more{font-size:13.5px;font-weight:700;color:var(--lime-700);display:inline-flex;align-items:center;gap:6px;}
.link-more .arw{transition:transform .2s ease;}
.link-more:hover .arw{transform:translateX(4px);}
.link-all{font-size:14px;font-weight:700;color:var(--teal-500);display:inline-flex;align-items:center;gap:8px;white-space:nowrap;}
.link-all:hover .arw{transform:translateX(4px);}
.link-all .arw{transition:transform .2s ease;}

/* ---------- announcement bar ---------- */
.topbar{
  background:var(--teal-900);color:var(--mint-100);
  font-size:13px;font-weight:500;letter-spacing:.3px;
  display:flex;align-items:center;justify-content:center;gap:26px;
  padding:10px var(--gutter);flex-wrap:wrap;
}
.topbar .bullet{color:var(--bullet);}
.topbar .tel{color:var(--yellow-400);font-weight:700;}

/* ---------- nav ---------- */
.nav{
  background:var(--surface-page);padding:22px var(--rail);
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  /* Sticky: the announcement bar scrolls away, the nav stays. z-index sits
     above the mega-menu's own stacking so dropdowns clear page content. */
  position:sticky;top:0;z-index:900;
  transition:box-shadow .25s var(--ease),padding .25s var(--ease);
}
/* --nav-h is measured at runtime by site.js; this is the pre-JS fallback and
   is what every scroll offset below is derived from. */
:root{--nav-h:106px;}
/* zero-height marker used to detect "has the page scrolled at all" */
.nav-sentinel{display:block;height:0;margin:0;padding:0;}

/* roomy at the top of the page ... */
.nav__logo img{transition:height .25s var(--ease);}
/* ... and compact once scrolling starts */
.nav.is-stuck{
  padding-top:12px;padding-bottom:12px;
  box-shadow:0 6px 24px rgba(31,76,78,.10);
}
.nav.is-stuck .nav__logo img{height:46px;}
.nav__logo{flex-shrink:0;}
.nav__logo img{height:62px;width:auto;}
.nav__links{display:flex;gap:32px;min-width:0;}
.nav__links a{font-size:15px;font-weight:500;color:var(--text-nav);transition:color .2s ease;}
.nav__links a:hover,.nav__links a[aria-current="page"]{color:var(--teal-500);}
.nav__right{display:flex;align-items:center;gap:20px;flex-shrink:0;}
.nav__tel{font-size:15px;font-weight:700;color:var(--teal-500);white-space:nowrap;}
.nav__burger{
  display:none;width:44px;height:44px;border:1px solid var(--mint-50);background:var(--white);
  border-radius:12px;cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:4px;
}
.nav__burger span{display:block;width:18px;height:2px;background:var(--teal-700);border-radius:2px;transition:transform .25s ease,opacity .2s ease;}
.nav__burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg);}
.nav__burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav__burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}

/* ---------- hero ---------- */
.hero{
  position:relative;overflow:hidden;
  background:linear-gradient(140deg,var(--teal-500) 0%,var(--teal-700) 100%);
  padding:76px var(--rail);
}
.hero::before{
  content:"";position:absolute;top:-130px;right:-70px;width:440px;height:440px;border-radius:50%;
  background:radial-gradient(circle at 40% 40%,rgba(255,255,255,.16),rgba(255,255,255,0) 70%);z-index:0;
}
.hero__grid{position:relative;z-index:2;display:grid;grid-template-columns:1.08fr .92fr;gap:48px;align-items:center;}
.hero__accent{
  color:var(--yellow-400);border-bottom:3px solid var(--lime-500);padding-bottom:4px;
}
.hero__lede{color:var(--mint-100);max-width:460px;margin:22px 0 30px;}
.hero__cta{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:30px;}
.hero__trust{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.hero__stars{color:var(--yellow-400);letter-spacing:2px;font-size:17px;}
.hero__trust span:last-child{font-size:13.5px;color:var(--mint-100);}

/* page hero (inner pages) */
.phero{
  position:relative;overflow:hidden;
  background:linear-gradient(140deg,var(--teal-500) 0%,var(--teal-700) 100%);
  padding:76px var(--rail);
}
.phero::before{
  content:"";position:absolute;top:-130px;right:-70px;width:440px;height:440px;border-radius:50%;
  background:radial-gradient(circle at 40% 40%,rgba(255,255,255,.16),rgba(255,255,255,0) 70%);
}
.phero__inner{position:relative;z-index:2;max-width:760px;}
.phero p{color:var(--mint-100);max-width:620px;margin-top:18px;}

/* ---------- hero booking card ---------- */
.bookcard{background:var(--white);border-radius:var(--r-card);padding:34px;box-shadow:var(--sh-hero-card);}
.bookcard__h{font-size:26px;font-weight:800;letter-spacing:-.4px;color:var(--teal-850);margin-bottom:4px;}
.bookcard__sub{font-size:14px;color:var(--text-muted);margin-bottom:22px;}
.callblock{
  display:flex;align-items:center;gap:13px;background:var(--surface-mint);
  border-radius:14px;padding:15px 18px;margin-bottom:22px;transition:background .2s ease;
}
.callblock:hover{background:var(--mint-50);}
.callblock__ic{
  width:42px;height:42px;border-radius:50%;background:var(--teal-500);color:var(--white);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.callblock__k{display:block;font-size:12px;color:var(--text-muted);}
.callblock__v{display:block;font-size:21px;font-weight:800;color:var(--teal-850);letter-spacing:-.3px;}
.checks{display:flex;flex-direction:column;gap:12px;margin-bottom:24px;}
.checks li{display:flex;align-items:center;gap:10px;font-size:14.5px;color:var(--text-body);}
.checks svg{flex-shrink:0;}
ul.checks{list-style:none;padding:0;margin:0 0 24px;}

/* ---------- feature strip ---------- */
.features{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
  margin:-52px var(--rail) 0;position:relative;z-index:5;
}
.feature{
  background:var(--white);border-radius:var(--r-panel);padding:24px 28px;
  display:flex;align-items:center;gap:16px;box-shadow:var(--sh-card);
  transition:transform .25s ease,box-shadow .25s ease;
}
.feature:hover{transform:translateY(-5px);box-shadow:var(--sh-card-hover);}
.feature__ic{
  width:46px;height:46px;border-radius:50%;background:var(--icon-bg);color:var(--lime-700);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.feature__t{display:block;font-weight:800;color:var(--teal-850);font-size:16px;letter-spacing:-.2px;}
.feature__d{display:block;font-size:13px;color:var(--text-muted);margin-top:2px;}

/* ---------- section head ---------- */
.sechead{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:40px;flex-wrap:wrap;}
.sechead--center{display:block;text-align:center;margin-bottom:34px;}

/* ---------- cards grid ---------- */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}

.card{
  background:var(--white);border-radius:var(--r-card);overflow:hidden;box-shadow:var(--sh-card);
  transition:transform .25s ease,box-shadow .25s ease,outline-color .25s ease;
  outline:2px solid transparent;outline-offset:-2px;display:block;
}
.card:hover{transform:translateY(-8px) scale(1.015);box-shadow:var(--sh-card-hover);outline-color:rgba(186,201,74,.65);}
.card__ph{height:170px;overflow:hidden;background:var(--mint-50);position:relative;}
.card__cat{
  position:absolute;top:12px;left:12px;z-index:2;background:rgba(245,250,248,.94);
  font-size:11px;font-weight:700;letter-spacing:.9px;text-transform:uppercase;
  color:var(--teal-700);padding:6px 12px;border-radius:var(--r-pill);
}
.card__ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease);}
.card:hover .card__ph img{transform:scale(1.05);}
.card__body{padding:26px;}
.card__body h3{margin-bottom:10px;}
.card__body p{margin-bottom:16px;}

/* plain (no photo) card */
.pcard{background:var(--white);border-radius:var(--r-card);padding:28px;box-shadow:var(--sh-card);
  transition:transform .25s ease,box-shadow .25s ease,outline-color .25s ease;outline:2px solid transparent;outline-offset:-2px;}
.pcard:hover{transform:translateY(-8px) scale(1.015);box-shadow:var(--sh-card-hover);outline-color:rgba(186,201,74,.65);}
.pcard h3{margin-bottom:8px;}

/* stat card */
.stat{background:var(--surface-mint);border-radius:var(--r-panel);padding:28px;text-align:left;}
.stat__n{font-size:40px;font-weight:900;color:var(--teal-850);letter-spacing:-1px;line-height:1;}
.stat__l{font-size:14.5px;color:var(--text-body);margin-top:8px;}

/* ---------- reviews carousel ---------- */
.reviews{background:var(--surface-mint);}
.carousel{position:relative;max-width:900px;margin:0 auto;}
.carousel__vp{overflow:hidden;}
.carousel__track{display:flex;transition:transform .5s var(--ease);}
.carousel__slide{flex:0 0 100%;padding:0 46px;text-align:center;}
.carousel__stars{font-size:26px;color:var(--lime-700);letter-spacing:4px;margin-bottom:18px;}
.carousel__q{font-size:31px;font-weight:600;letter-spacing:-.4px;line-height:1.45;color:var(--teal-850);max-width:760px;margin:0 auto 22px;}
.carousel__who{font-size:14.5px;font-weight:700;color:var(--teal-500);}
.carousel__who span{color:var(--text-muted);font-weight:500;}
.carousel__arw{
  position:absolute;top:calc(50% - 23px);width:46px;height:46px;border-radius:50%;background:var(--white);
  border:0;cursor:pointer;box-shadow:0 8px 22px rgba(31,76,78,.16);color:var(--teal-500);font-size:22px;
  display:flex;align-items:center;justify-content:center;transition:transform .2s ease,box-shadow .2s ease;
}
.carousel__arw:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(31,76,78,.24);}
.carousel__arw--prev{left:-6px;}
.carousel__arw--next{right:-6px;}
.carousel__dots{display:flex;gap:8px;justify-content:center;margin-top:32px;}
.carousel__dot{width:9px;height:9px;border-radius:20px;background:var(--dot-inactive);border:0;padding:0;cursor:pointer;transition:width .3s ease,background .3s ease;}
.carousel__dot.is-active{width:26px;background:var(--lime-500);}

/* ---------- FAQ accordion ---------- */
.faq{display:flex;flex-direction:column;gap:14px;}
.faq__item{border:1px solid rgba(255,255,255,.18);border-radius:var(--r-panel);overflow:hidden;background:rgba(255,255,255,.06);}
.faq__q{
  width:100%;background:none;border:0;cursor:pointer;text-align:left;color:var(--white);
  font-size:17px;font-weight:700;padding:20px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.faq__q .ind{color:var(--lime-500);font-size:20px;transition:transform .25s ease;flex-shrink:0;}
.faq__item.is-open .faq__q .ind{transform:rotate(45deg);}
.faq__a{max-height:0;overflow:hidden;transition:max-height .3s var(--ease);}
.faq__a p{padding:0 24px 20px;color:var(--mint-200);font-size:15px;line-height:1.7;}

/* ---------- booking band ---------- */
.booking{display:grid;grid-template-columns:1fr 1fr;}
/* Each half is 50% of the viewport, so `100%` here == 50vw. Aligning the outer
   edge to the page rail therefore reduces to (half-width - content-max/2). */
.booking__left{
  background:linear-gradient(140deg,var(--teal-850) 0%,var(--teal-950) 100%);
  padding:76px var(--gutter) 76px max(var(--gutter), calc(100% - var(--content-max) / 2));
}
.booking__left h2{color:var(--white);margin-bottom:16px;font-size:45px;}
.booking__left p{color:var(--mint-200);max-width:360px;margin-bottom:30px;}
.booking__tel{font-size:34px;font-weight:700;color:var(--white);letter-spacing:-.5px;display:inline-block;}
.booking__mail{font-size:14px;color:var(--mint-200);margin-top:6px;}
.booking__addr{font-size:14px;color:var(--mint-200);margin-top:20px;display:flex;align-items:center;gap:10px;}
.booking__addr .dot{color:var(--yellow-400);}
.booking__right{
  background:var(--teal-700);
  padding:64px max(var(--gutter), calc(100% - var(--content-max) / 2)) 64px var(--gutter);
}
.form{display:flex;flex-direction:column;gap:13px;}
.form input,.form select,.form textarea{
  font-family:inherit;font-size:14.5px;font-weight:400;line-height:1.5;
  color:var(--teal-850);background-color:var(--surface-page);
  border:1px solid var(--mint-50);border-radius:var(--r-input);padding:15px 16px;width:100%;
  transition:border-color .2s ease,box-shadow .2s ease;
  -webkit-appearance:none;-moz-appearance:none;appearance:none;
}
.form textarea{resize:vertical;min-height:110px;}
.form input::placeholder,.form textarea::placeholder{color:var(--text-placeholder);}
/* Native select chrome is replaced so the field matches the text inputs exactly. */
.form select{
  color:var(--text-placeholder);padding-right:44px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M1 1.5 7 7.5l6-6' stroke='%235C7B79' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 17px center;background-size:13px 8px;
}
.form select::-ms-expand{display:none;}
.form select.has-value{color:var(--teal-850);}
.form input:focus,.form select:focus,.form textarea:focus{
  outline:none;border-color:var(--lime-500);box-shadow:0 0 0 3px rgba(186,201,74,.25);
}
.form .btn{margin-top:6px;}
.form__err{color:#FFD9D0;font-size:12.5px;margin-top:-6px;display:none;}
.form__err.is-show{display:block;}
.form input[aria-invalid="true"],.form textarea[aria-invalid="true"]{border-color:#E9A79A;}
.form__ok{
  display:none;background:rgba(186,201,74,.16);border:1px solid var(--lime-500);color:var(--white);
  border-radius:var(--r-input);padding:14px 16px;font-size:14.5px;font-weight:600;
}
.form__ok.is-show{display:block;}
/* light form variant (contact page card) */
.form--light input,.form--light select,.form--light textarea{background-color:var(--white);border-color:var(--mint-50);}
.form--light .form__ok{background:rgba(186,201,74,.18);color:var(--teal-850);}
.form--light .form__err{color:#B4483A;}

/* ---------- footer ---------- */
.footer{background:var(--teal-900);padding:56px var(--rail) 40px;}
.footer__cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.1);}
.footer__logo{height:65px;width:auto;margin-bottom:18px;}
.footer__about{font-size:14px;line-height:1.7;color:var(--mint-400);max-width:280px;}
.footer h4{font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--white);margin-bottom:16px;}
.footer__links{display:flex;flex-direction:column;gap:11px;font-size:14px;}
.footer__links a{color:var(--mint-400);transition:color .2s ease;}
.footer__links a:hover{color:var(--yellow-400);}
.footer__links a.tel{color:var(--yellow-400);font-weight:700;}
.footer__links span{color:var(--mint-400);}
.footer__base{padding-top:26px;font-size:13px;color:#8CBDB4;}

/* ---------- contact page bits ---------- */
.contact-card{background:var(--white);border-radius:var(--r-card);padding:24px;box-shadow:var(--sh-card);display:flex;align-items:center;gap:16px;}
.contact-card__ic{width:46px;height:46px;border-radius:50%;background:var(--teal-500);color:var(--white);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.contact-card__k{font-size:12.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--text-muted);}
.contact-card__v{font-size:19px;font-weight:800;color:var(--teal-850);letter-spacing:-.3px;}
.loc{background:var(--surface-mint);border-radius:var(--r-panel);padding:22px;}
.loc h4{font-size:16px;font-weight:800;color:var(--teal-850);letter-spacing:-.2px;text-transform:none;margin-bottom:6px;}
.loc p{font-size:14.5px;color:var(--text-body);}
.hours{background:var(--white);border-radius:var(--r-card);padding:8px 24px;box-shadow:var(--sh-card);}
.hours__row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--surface-mint);font-size:15px;}
.hours__row:last-child{border-bottom:0;}
.hours__row b{color:var(--teal-850);font-weight:700;}
.map{height:300px;border-radius:var(--r-card);background:var(--mint-50);display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:14px;border:1px dashed var(--dot-inactive);}

/* physician card */
.doc{background:var(--white);border-radius:var(--r-card);overflow:hidden;box-shadow:var(--sh-card);transition:transform .25s ease,box-shadow .25s ease;}
.doc:hover{transform:translateY(-8px);box-shadow:var(--sh-card-hover);}
.doc__ph{height:280px;background:var(--mint-50);display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:13px;}
.doc__body{padding:24px;}
.doc__body h3{margin-bottom:2px;}
.doc__role{font-size:13px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--lime-700);margin-bottom:10px;}

/* inset teal panel (concierge closing) */
.inset-panel{
  background:linear-gradient(140deg,var(--teal-600) 0%,var(--teal-800) 100%);
  border-radius:26px;padding:56px;display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;
}
.inset-panel h2{color:var(--white);margin-bottom:14px;}
.inset-panel p{color:var(--mint-100);}
.inset-panel__side{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);border-radius:var(--r-panel);padding:26px;text-align:center;}
.inset-panel__side .k{font-size:12.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--yellow-400);margin-bottom:8px;}
.inset-panel__side .v{font-size:28px;font-weight:800;color:var(--white);letter-spacing:-.5px;margin-bottom:18px;display:block;}

/* ---------- long-form content pages ---------- */
.sec--dark{background:linear-gradient(160deg,var(--teal-600) 0%,var(--teal-800) 100%);}
.sechead--stack{display:block;text-align:left;margin-bottom:34px;}
.sec>.body+.body,.sec>.body+.ticks,.sec>.ticks+.body,
.sec>.h3--block,.sec>.h4,.sec>.numlist,.sec>.faq{margin-top:22px;}
.sec>.h3--block{margin-top:38px;}
/* Long-form article column: one shared measure so every child — prose, lists,
   headings — sits on the same left edge. ~760px keeps line length readable. */
.sec--prose>*{max-width:760px;margin-left:auto;margin-right:auto;}
/* .ticks/.numlist reset their own margins, so re-assert centring more specifically */
.sec--prose>.ticks,.sec--prose>.numlist,.sec--prose>.faq{margin-left:auto;margin-right:auto;}
.h3--block{font-size:24px;font-weight:800;letter-spacing:-.4px;color:var(--teal-850);}
.h3--light{color:var(--white);}
.h4{font-size:18px;font-weight:800;letter-spacing:-.2px;color:var(--teal-850);margin:30px 0 0;}
.h4--light{color:var(--white);}
.sec--dark .body{color:var(--mint-100);}

/* tick lists */
.ticks{list-style:none;padding:0;margin:0;display:grid;gap:11px;}
.ticks--2col{grid-template-columns:1fr 1fr;column-gap:32px;}
.ticks li{position:relative;padding-left:28px;font-size:15.5px;line-height:1.6;color:var(--text-body);}
.ticks li::before{
  content:"";position:absolute;left:0;top:.5em;width:14px;height:8px;
  border-left:2px solid var(--lime-700);border-bottom:2px solid var(--lime-700);
  transform:rotate(-45deg);border-radius:1px;
}
.ticks--dark li{color:var(--mint-100);}
.ticks--dark li::before{border-color:var(--lime-500);}

/* numbered steps in prose */
.numlist{list-style:none;padding:0;margin:0;display:grid;gap:16px;counter-reset:n;}
.numlist li{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;
  font-size:15.5px;line-height:1.65;color:var(--text-body);}
.numlist__n{
  width:30px;height:30px;border-radius:50%;background:var(--lime-500);color:var(--teal-900);
  display:flex;align-items:center;justify-content:center;font-weight:900;font-size:14px;flex-shrink:0;
}
.numlist--dark li{color:var(--mint-100);}

.mt-16{margin-top:16px;}
.mt-24{margin-top:24px;}

/* treatment hub cards */
.hub{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.hubcard{
  background:var(--white);border-radius:var(--r-card);padding:30px;box-shadow:var(--sh-card);
  display:flex;flex-direction:column;gap:12px;transition:transform .25s ease,box-shadow .25s ease,outline-color .25s ease;
  outline:2px solid transparent;outline-offset:-2px;
}
.hubcard:hover{transform:translateY(-8px);box-shadow:var(--sh-card-hover);outline-color:rgba(186,201,74,.65);}
.hubcard h3{font-size:21px;font-weight:800;letter-spacing:-.3px;color:var(--teal-850);}
.hubcard p{font-size:14.5px;line-height:1.65;color:var(--text-body);flex:1;}

@media (max-width:760px){
  .ticks--2col{grid-template-columns:1fr;}
  .hub{grid-template-columns:1fr;}
  .h3--block{font-size:21px;}
}

/* ==========================================================================
   LONG-FORM ARTICLE — accordion cards + sticky "On this page".
   Every content section becomes a card that echoes the homepage card language
   (white, rounded, soft shadow, lime accent), so inner pages read as designed
   rather than as a wall of prose.
   ========================================================================== */
.article-wrap{padding-top:52px;padding-bottom:52px;}
.sec--intro{padding-top:44px;padding-bottom:44px;}
.article-layout{display:grid;grid-template-columns:1fr;gap:0;}
.article-layout--toc{grid-template-columns:236px minmax(0,1fr);gap:clamp(30px,4vw,60px);align-items:start;}

/* --- sticky table of contents --- */
.toc{position:sticky;top:calc(var(--nav-h) + 20px);}
.toc__label{
  font-size:11.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;
  color:var(--lime-700);margin-bottom:12px;
}
.toc__links{display:flex;flex-direction:column;border-left:2px solid var(--mint-200);}
.toc__links a{
  font-size:13.5px;line-height:1.4;color:var(--text-body);padding:8px 0 8px 14px;
  margin-left:-2px;border-left:2px solid transparent;transition:color .18s ease,border-color .18s ease;
}
.toc__links a:hover,.toc__links a.is-current{color:var(--teal-500);border-left-color:var(--teal-500);font-weight:700;}
.toc__all{
  margin-top:14px;background:none;border:0;padding:0;cursor:pointer;
  font-size:12.5px;font-weight:700;color:var(--lime-700);letter-spacing:.2px;
}
.toc__all:hover{color:var(--teal-500);}

/* --- intro note above the cards --- */
.secnote{
  background:var(--white);border-radius:var(--r-card);padding:24px 28px;
  box-shadow:var(--sh-card);margin-bottom:16px;border-left:4px solid var(--lime-500);
}
.secnote .body{margin-top:8px;}
.secnote .body:first-child{margin-top:0;}

/* --- accordion section cards --- */
.article{display:flex;flex-direction:column;gap:14px;max-width:none;}
.acc{
  background:var(--white);border-radius:var(--r-card);box-shadow:var(--sh-card);
  overflow:hidden;scroll-margin-top:calc(var(--nav-h) + 14px);transition:box-shadow .25s var(--ease);
}
.acc:hover{box-shadow:0 18px 40px rgba(31,76,78,.12);}
.acc.is-open{box-shadow:0 20px 46px rgba(31,76,78,.14);}
.acc__q{
  width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;
  background:none;border:0;cursor:pointer;text-align:left;padding:22px 26px;
}
.acc__n{
  font-size:12px;font-weight:800;letter-spacing:.5px;color:var(--lime-700);
  background:var(--icon-bg);border-radius:8px;padding:5px 9px;font-variant-numeric:tabular-nums;
}
.acc__t{
  font-size:21px;font-weight:800;letter-spacing:-.45px;line-height:1.3;color:var(--teal-850);
}
.acc__ind{
  width:30px;height:30px;border-radius:50%;background:var(--surface-mint);position:relative;
  flex-shrink:0;transition:background .25s ease,transform .3s var(--ease);
}
.acc__ind::before,.acc__ind::after{
  content:"";position:absolute;left:50%;top:50%;background:var(--teal-700);border-radius:2px;
  transform:translate(-50%,-50%);transition:opacity .25s ease,background .25s ease,transform .3s var(--ease);
}
.acc__ind::before{width:11px;height:2px;}
.acc__ind::after{width:2px;height:11px;}
.acc.is-open .acc__ind{background:var(--lime-500);}
.acc.is-open .acc__ind::after{opacity:0;transform:translate(-50%,-50%) rotate(90deg);}
.acc.is-open .acc__ind::before{background:var(--teal-900);}
.acc__q:hover .acc__t{color:var(--teal-500);}
.acc__a{max-height:0;overflow:hidden;transition:max-height .34s var(--ease);}
.acc__inner{padding:0 26px 26px;max-width:82ch;}
.acc__inner>*:first-child{margin-top:0;}

.acc .body{margin-top:10px;line-height:1.62;}
.acc .h3--block{
  font-size:19.5px;font-weight:800;letter-spacing:-.35px;color:var(--teal-850);
  margin-top:34px;padding-top:24px;border-top:1px solid var(--mint-50);
}
.acc .h3--block:first-child{margin-top:0;padding-top:0;border-top:0;}
.acc .h4{font-size:15.5px;margin-top:16px;color:var(--teal-700);}
.acc .ticks{margin-top:10px;gap:5px;}
.acc .ticks li{font-size:14.5px;line-height:1.45;padding-left:24px;}
.acc .numlist{margin-top:12px;gap:9px;}

/* denser multi-column lists */
.ticks--2col{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px;}
.ticks--3col{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;}

@media (max-width:1000px){
  .article-layout--toc{grid-template-columns:1fr;}
  .toc{position:static;margin-bottom:22px;}
  .toc__links{flex-direction:row;flex-wrap:wrap;border-left:0;gap:6px;}
  .toc__links a{
    border:1px solid var(--mint-200);border-radius:100px;padding:7px 14px;margin-left:0;
    background:var(--white);
  }
  .toc__links a:hover,.toc__links a.is-current{border-color:var(--teal-500);}
  .ticks--3col{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:760px){
  .ticks--2col,.ticks--3col{grid-template-columns:1fr;}
  .acc__q{padding:18px 18px;gap:12px;}
  .acc__t{font-size:17.5px;}
  .acc__inner{padding:0 18px 20px;}
  .acc__n{display:none;}
}

/* ---------- mega-menu navigation ---------- */
.nav__links{display:flex;gap:6px;align-items:center;}
.nav__item{position:relative;}
.nav__top{
  display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:500;
  color:var(--text-nav);padding:10px 12px;border-radius:10px;transition:color .2s ease,background .2s ease;
  white-space:nowrap;   /* "Sports Medicine" / "PRP Therapy" were breaking over two lines */
}
.nav__top:hover,.nav__item:hover .nav__top{color:var(--teal-500);background:var(--surface-mint);}
.nav__top[aria-current="page"]{color:var(--teal-500);font-weight:700;}
.nav__chev{transition:transform .2s ease;opacity:.6;}
.nav__item--has-menu:hover .nav__chev{transform:rotate(180deg);}

/* The panel starts flush against the trigger (top:100%) and uses a transparent
   padding-top as the visual offset. That padding is still inside .mega, so the
   pointer never leaves the hovered .nav__item on its way down to the menu. */
.mega{
  /* anchored to the trigger's left edge, clamped to the viewport so a menu on
     a left-hand nav item can never run off screen */
  position:absolute;top:100%;left:0;
  min-width:520px;max-width:calc(100vw - 2 * var(--gutter));padding-top:10px;
  opacity:0;visibility:hidden;pointer-events:none;z-index:120;
  transition:opacity .18s ease,visibility .18s;
}
.nav__item--has-menu:hover .mega,
.nav__item--has-menu:focus-within .mega{opacity:1;visibility:visible;pointer-events:auto;}
.mega__inner{
  max-height:calc(100vh - var(--nav-h) - 12px);overflow-y:auto;overscroll-behavior:contain;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 20px;
  background:var(--white);border-radius:18px;border:1px solid var(--mint-50);
  box-shadow:0 26px 60px rgba(31,76,78,.22);padding:18px;
}
.mega[data-cols="3"]{min-width:880px;}
.mega[data-cols="3"] .mega__inner{grid-template-columns:repeat(3,minmax(0,1fr));}
.mega__item{padding:8px 10px;border-radius:10px;transition:background .18s ease;}
.mega__item:hover{background:var(--surface-mint);}
.mega__link{display:block;font-size:14.5px;font-weight:700;color:var(--teal-850);letter-spacing:-.2px;}
.mega__item:hover .mega__link{color:var(--teal-500);}
.mega__sub{display:block;margin-top:5px;font-size:12.5px;line-height:1.45;color:var(--text-muted);}
.mega__sub a{
  display:block;color:var(--text-muted);padding:5px 0 5px 11px;position:relative;
  border-radius:6px;transition:color .18s ease;
}
.mega__sub a::before{                 /* small tick marks each row as its own item */
  content:"";position:absolute;left:0;top:50%;width:4px;height:4px;margin-top:-2px;
  border-radius:50%;background:currentColor;opacity:.4;
}
.mega__sub a:hover{color:var(--teal-500);}
.mega__sub a:hover::before{opacity:1;}
.mega__all{
  grid-column:1/-1;margin-top:8px;padding:12px 10px 4px;border-top:1px solid var(--surface-mint);
  font-size:13.5px;font-weight:700;color:var(--lime-700);display:inline-flex;align-items:center;gap:8px;
}
.mega__all .arw{transition:transform .2s ease;}
.mega__all:hover .arw{transform:translateX(4px);}

/* ---------- breadcrumbs ---------- */
.crumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;margin-bottom:18px;color:var(--mint-100);}
.crumbs a{color:var(--mint-100);opacity:.85;}
.crumbs a:hover{opacity:1;text-decoration:underline;}
.crumbs span[aria-hidden]{opacity:.45;}
.crumbs>span:last-child{color:var(--yellow-400);font-weight:600;}

/* ---------- page hero with photo ---------- */
.phero--split{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;}
.phero--split .phero__inner{max-width:none;}
.phero__media{position:relative;z-index:2;border-radius:var(--r-card);overflow:hidden;
  box-shadow:0 30px 60px rgba(31,76,78,.34);aspect-ratio:3/2;}
.phero__media img{width:100%;height:100%;object-fit:cover;}

/* ---------- hub cards with photography ---------- */
.hubcard{padding:0;overflow:hidden;}
.hubcard--photo .hubcard__ph{aspect-ratio:16/10;overflow:hidden;background:var(--mint-50);}
.hubcard--photo .hubcard__ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease);}
.hubcard--photo:hover .hubcard__ph img{transform:scale(1.05);}
.hubcard__body{padding:24px 26px 26px;display:flex;flex-direction:column;gap:10px;flex:1;}
.hub{grid-template-columns:repeat(3,1fr);}

@media (max-width:1100px){
  .phero--split{grid-template-columns:1fr;gap:32px;}
  .phero__media{order:-1;aspect-ratio:16/9;}
  .mega{min-width:420px;}
  .mega[data-cols="3"]{min-width:520px;}
  .mega[data-cols="3"] .mega__inner{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:760px){
  .crumbs{font-size:12px;}
}

/* ==========================================================================
   NAVIGATION BREAKPOINT — the full menu (7 items + phone + button) needs
   ~1180px (8 top-level items since Blog was added). Below that it collapses
   to the burger drawer. Previously this
   switched at 760px, so iPad portrait (768px) rendered the desktop nav and
   overflowed the page by ~155px.
   ========================================================================== */
@media (max-width:1180px){
  .nav__burger{display:flex;}
  .nav__right .btn--lime{display:none;}   /* keep 'Call us' visible on mobile */
  .nav__logo img{height:52px;}

  .nav__links{
    display:none;position:absolute;top:100%;left:0;right:0;z-index:200;
    flex-direction:column;align-items:stretch;gap:0;background:var(--white);
    padding:8px var(--gutter) 20px;box-shadow:var(--sh-card);
    max-height:78vh;overflow-y:auto;
  }
  .nav__links.is-open{display:flex;}
  .nav__item{width:100%;}
  .nav__top{
    width:100%;justify-content:space-between;padding:15px 0;border-radius:0;
    border-bottom:1px solid var(--surface-mint);font-size:16px;
  }
  .nav__item--has-menu:hover .nav__chev{transform:none;}

  /* the mega panel becomes a plain nested list inside the drawer, collapsed
     until its parent row is tapped */
  .mega{
    position:static;transform:none;opacity:1;visibility:visible;pointer-events:auto;
    min-width:0;max-width:none;padding:2px 0 10px;
    display:none;
  }
  .nav__item--has-menu.is-open > .mega{display:block;}
  .nav__item--has-menu.is-open > .nav__top{border-bottom-color:transparent;}
  .nav__item--has-menu.is-open > .nav__top .nav__chev{transform:rotate(180deg);}
  .mega[data-cols="3"]{min-width:0;}
  .mega__inner,.mega[data-cols="3"] .mega__inner{
    grid-template-columns:1fr;background:transparent;border:0;box-shadow:none;padding:0;
    max-height:none;overflow:visible;   /* drawer scrolls, not the submenu */
  }
  .mega__sub{display:none;}
  .mega__item{padding:2px 10px;}
  .mega__link{font-weight:500;font-size:14.5px;display:block;padding:10px 0;}
  .mega__all{margin-top:4px;padding:12px 10px 4px;}
}

/* utility */
.stack-16>*+*{margin-top:16px;}
.stack-24>*+*{margin-top:24px;}
.mb-40{margin-bottom:40px;}
.mt-56{margin-top:56px;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ==========================================================================
   RESPONSIVE — direction defined during implementation (handoff left this open)
   ========================================================================== */
@media (max-width:1100px){
  :root{--sec-y:64px;}
  .hero__grid{grid-template-columns:1fr;gap:36px;}
  .hero .bookcard{max-width:560px;}
  .h1{font-size:52px;}
  .h1--page{font-size:44px;}
  .h2,.h2--lg{font-size:36px;}
  .grid-3,.dcards,.tindex{grid-template-columns:repeat(2,1fr);}
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .steps--4{grid-template-columns:repeat(2,1fr);}
  .split,.split--mirror{grid-template-columns:1fr;gap:32px;}
  .split__media{height:320px;order:-1;}
  /* once stacked, each half spans the full width, so revert to plain rails */
  .booking{grid-template-columns:1fr;}
  .booking__left{padding:var(--sec-y) var(--rail);}
  .booking__right{padding:var(--sec-y) var(--rail);}
  .inset-panel{grid-template-columns:1fr;padding:40px;}
  .features{grid-template-columns:1fr;margin-top:-40px;}
  .cx{grid-template-columns:1fr 1fr;gap:28px;}
  .sechead__lead{text-align:left;}
}

@media (max-width:760px){
  :root{--gutter:22px;--sec-y:52px;}
  .h1{font-size:40px;letter-spacing:-1px;}
  .h1--page{font-size:34px;}
  .h2,.h2--lg{font-size:30px;letter-spacing:-.6px;}
  .booking__left h2{font-size:32px;}
  .carousel__q{font-size:22px;}
  .carousel__slide{padding:0 8px;}
  .carousel__arw--prev{left:-4px;}
  .carousel__arw--next{right:-4px;}
  .topbar{font-size:11.5px;gap:10px;padding:9px 16px;}
  .topbar .bullet{display:none;}

  .nav__logo img{height:48px;}

  .grid-3,.grid-2,.grid-4,.dcards,.tindex,.steps,.steps--4{grid-template-columns:1fr;}
  .cx{grid-template-columns:1fr;}
  .footer__cols{grid-template-columns:1fr;gap:28px;}
  .split__media{height:240px;}
  .inset-panel{padding:28px;}
  .booking__left,.booking__right{padding:48px var(--gutter);}
  .hero,.phero{padding:52px var(--gutter);}
  .doc__ph{height:220px;}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important;}
}

/* ==========================================================================
   TOUCH TARGETS — phones AND tablets are touch devices, so this matches the
   1080px nav breakpoint rather than stopping at phone width. Every standalone
   link/button gets a comfortable hit area; gaps shrink to keep spacing even.
   ========================================================================== */
@media (max-width:1080px){
  .footer__links{gap:0;}
  .footer__links a{display:inline-block;padding:11px 0;}
  .footer__links span{display:inline-block;padding:8px 0;}
  .footer__base{line-height:1.9;}
  .footer__base a{display:inline-block;padding:8px 2px;}
  .topbar .tel{display:inline-block;padding:7px 6px;margin:-7px 0;}
  .nav__tel{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;}
  .toc__all{padding:12px 0;}
  .booking__mail a,.booking__addr a{display:inline-block;padding:10px 0;}
  .link-more,.link-all,.link-plain{display:inline-flex;align-items:center;min-height:44px;}
  .crumbs a{display:inline-block;padding:4px 0;}
}

/* ---------- inline link from a hub section to its dedicated page ---------- */
.acc__more{
  display:inline-flex;align-items:center;gap:8px;margin-top:18px;
  font-size:14px;font-weight:800;color:var(--teal-700);
  background:var(--surface-mint);border:1px solid var(--mint-50);
  border-radius:var(--r-pill);padding:11px 20px;
  transition:background .22s ease,border-color .22s ease,transform .22s ease;
}
.acc__more:hover{background:var(--lime-500);border-color:var(--lime-500);color:var(--teal-900);transform:translateY(-1px);}
.acc__more .arw{transition:transform .22s ease;}
.acc__more:hover .arw{transform:translateX(4px);}

/* ---------- "treatments for this condition" ---------- */
.rtwrap{padding-top:52px;padding-bottom:52px;}
.rtlead{max-width:62ch;margin-bottom:22px;}
.rtgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.rtcard{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  background:var(--white);border:1px solid var(--mint-50);border-radius:var(--r-panel);
  padding:18px 20px;box-shadow:var(--sh-card);
  transition:transform .22s var(--ease),box-shadow .22s var(--ease),border-color .22s var(--ease);
}
.rtcard:hover{transform:translateY(-3px);box-shadow:var(--sh-card-hover);border-color:var(--lime-500);}
.rtcard__t{font-size:15.5px;font-weight:800;color:var(--teal-850);letter-spacing:-.2px;line-height:1.35;}
.rtcard__a{color:var(--lime-700);font-size:17px;flex-shrink:0;transition:transform .22s var(--ease);}
.rtcard:hover .rtcard__a{transform:translateX(4px);}

@media (max-width:1000px){ .rtgrid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:640px){ .rtgrid{grid-template-columns:1fr;} }

/* ---------- light FAQ (homepage) ----------
   The dark FAQ band is used on inner pages; on the homepage it would make four
   dark sections in a row, so this variant uses the white card language. */
.faq-home .faq{max-width:860px;margin:0 auto;}
.faq--light .faq__item{
  background:var(--white);border:1px solid var(--mint-50);border-radius:var(--r-card);
  box-shadow:var(--sh-card);transition:box-shadow .25s var(--ease);
}
.faq--light .faq__item:hover{box-shadow:0 18px 40px rgba(31,76,78,.12);}
.faq--light .faq__q{color:var(--teal-850);font-size:17px;font-weight:800;letter-spacing:-.3px;padding:20px 24px;}
.faq--light .faq__q .ind{
  color:var(--teal-700);background:var(--surface-mint);width:30px;height:30px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:19px;line-height:1;
}
.faq--light .faq__item.is-open .faq__q .ind{background:var(--lime-500);color:var(--teal-900);}
.faq--light .faq__a p{color:var(--text-body);padding:0 24px 22px;font-size:15.5px;line-height:1.7;}
.faq-home__more{
  text-align:center;margin-top:28px;font-size:15px;color:var(--text-muted);
}
.faq-home__more a{color:var(--lime-700);font-weight:700;}
.faq-home__more a:hover{color:var(--teal-500);}
@media (max-width:760px){
  .faq--light .faq__q{font-size:15.5px;padding:16px 18px;}
  .faq--light .faq__a p{padding:0 18px 18px;}
}

/* ---------- inline treatment links inside condition sections ----------
   The core journey: read about the condition -> open the treatment page. */
.tlinks{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;
  margin-top:22px;padding-top:18px;border-top:1px dashed var(--mint-50);
}
.tlinks__lab{
  font-size:11.5px;font-weight:700;letter-spacing:1.1px;text-transform:uppercase;
  color:var(--lime-700);
}
.tlinks__set{display:flex;flex-wrap:wrap;gap:8px;}
.tlink{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--surface-mint);border:1px solid var(--mint-50);border-radius:var(--r-pill);
  padding:8px 16px;font-size:14px;font-weight:700;color:var(--teal-700);
  transition:background .2s ease,border-color .2s ease,transform .2s ease,color .2s ease;
}
.tlink .arw{transition:transform .2s ease;color:var(--lime-700);}
.tlink:hover{background:var(--lime-500);border-color:var(--lime-500);color:var(--teal-900);transform:translateY(-2px);}
.tlink:hover .arw{transform:translateX(3px);color:var(--teal-900);}
@media (max-width:760px){
  .tlinks{flex-direction:column;align-items:flex-start;gap:8px;}
}

/* ---------- blog ---------- */
.post__meta{margin-top:18px;font-size:13.5px;color:var(--mint-100);display:flex;gap:10px;flex-wrap:wrap;align-items:center;}
.post__wrap{padding-top:0;}
.post__body{max-width:760px;margin:-40px auto 0;background:var(--white);border-radius:var(--r-card);
  box-shadow:var(--sh-card);padding:clamp(26px,4vw,52px);position:relative;z-index:3;}
.takeaway{background:var(--surface-mint);border-left:4px solid var(--lime-500);
  border-radius:var(--r-panel);padding:22px 26px;margin-bottom:34px;}
.takeaway__h{font-size:14px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;
  color:var(--teal-850);margin-bottom:14px;}
.takeaway__list{gap:8px;}
.takeaway__list li{font-size:15px;}
.post__h2{font-size:27px;font-weight:800;letter-spacing:-.5px;color:var(--teal-850);
  margin:38px 0 12px;padding-top:26px;border-top:1px solid var(--mint-50);
  scroll-margin-top:calc(var(--nav-h) + 14px);}
.post__body>.post__h2:first-of-type{border-top:0;padding-top:0;}
.post__h3{font-size:20px;font-weight:800;letter-spacing:-.3px;color:var(--teal-700);margin:26px 0 8px;}
.post__h4{font-size:16.5px;font-weight:800;color:var(--teal-700);margin:20px 0 6px;}
.post__p{font-size:16.5px;line-height:1.75;color:var(--text-body);margin-top:12px;}
.post__list{margin-top:14px;}
.post__steps{margin-top:16px;}
.post__quote{margin:24px 0;padding:18px 24px;border-left:3px solid var(--lime-500);
  background:var(--surface-page);border-radius:0 var(--r-panel) var(--r-panel) 0;
  font-size:17px;line-height:1.65;color:var(--teal-850);font-weight:600;}
.post__link{color:var(--teal-500);font-weight:700;border-bottom:1px solid rgba(90,167,167,.35);}
.post__link:hover{color:var(--lime-700);border-bottom-color:var(--lime-500);}
.post__cta{margin-top:44px;padding-top:30px;border-top:1px solid var(--mint-50);}
.post__cta-h{font-size:22px;font-weight:800;color:var(--teal-850);margin-bottom:8px;}
.post__cta p{color:var(--text-body);margin-bottom:20px;}
.post__cta-row{display:flex;gap:14px;flex-wrap:wrap;}
.post__cta-row .btn--call{
  background:var(--white);color:var(--teal-500);border:1.5px solid var(--mint-200);
  box-shadow:none;
}
.btn--call:hover{
  background:var(--teal-500);color:var(--white);border-color:var(--teal-500);
  transform:translateY(-2px);
}
.btn--ghost-light{color:var(--teal-700);border-color:var(--mint-200);}
.post__cta-row .btn--ghost-light:hover{border-color:var(--teal-500);color:var(--teal-500);}
.post__card-meta{display:block;font-size:12.5px;color:var(--text-muted);margin-bottom:10px;}
.post__faq{padding-top:0;}
@media (max-width:760px){
  .post__body{margin-top:-20px;}
  .post__h2{font-size:22px;}
}

/* ---------- highlighted callout ---------- */
.callout{
  background:var(--surface-mint);border-left:4px solid var(--lime-500);
  border-radius:0 var(--r-panel) var(--r-panel) 0;
  padding:20px 24px;margin-top:20px;
  font-size:16px;line-height:1.7;color:var(--teal-850);
}
.callout strong{color:var(--teal-900);}
.callout--dark{
  background:rgba(255,255,255,.08);border-left-color:var(--lime-500);color:var(--mint-100);
}
.callout--dark strong{color:var(--white);}

/* A portrait photo (headshot) would be badly cropped by the 3:2 hero frame. */
.phero__media--portrait{aspect-ratio:4/5;max-width:420px;margin-left:auto;}
.phero__media--portrait img{object-position:center top;}
@media (max-width:1100px){
  .phero__media--portrait{max-width:320px;margin:0 auto;}
}

/* very narrow phones: keep the call button, trim it to fit beside the burger */
@media (max-width:420px){
  .nav__right{gap:10px;}
  .btn--call{padding:11px 14px;font-size:13.5px;}
}

/* the same white call button sitting on the teal hero */
.hero__cta .btn--call{border-color:rgba(255,255,255,.55);box-shadow:0 8px 22px rgba(31,76,78,.18);}
.hero__cta .btn--call:hover{background:var(--teal-700);border-color:var(--teal-700);color:var(--white);}

/* cross-links written inline in the copy: "... treatment may include a
   [Lumbar Epidural Steroid Injection →]" — inherit the sentence, not the chip. */
.link-inline{
  color:var(--teal-700);font-weight:700;text-decoration:none;
  border-bottom:1.5px solid var(--mint-200);
  transition:color .18s ease,border-color .18s ease;
}
.link-inline:hover{color:var(--lime-700);border-bottom-color:var(--lime-500);}
.link-inline .arw{display:inline-block;transition:transform .2s ease;}
.link-inline:hover .arw{transform:translateX(3px);}

/* ...and on the dark teal sections, where the body copy is mint */
.sec--dark .link-inline,.on-dark .link-inline,.callout--dark .link-inline{
  color:var(--yellow-400);border-bottom-color:rgba(226,211,107,.45);
}
.sec--dark .link-inline:hover,.on-dark .link-inline:hover,
.callout--dark .link-inline:hover{color:#F0E7A6;border-bottom-color:#F0E7A6;}

/* block cross-links sitting on the dark teal sections */
.sec--dark .link-more,.faq__a .link-more{color:var(--yellow-400);}
.sec--dark .link-more:hover,.faq__a .link-more:hover{color:#F0E7A6;}
.faq__a p + p{margin-top:12px;}
.faq__link{margin-top:12px;}
.faq__link + .faq__link{margin-top:6px;}

/* ==========================================================================
   3. WordPress core -- classes WordPress and the block editor output
   ========================================================================== */

/* --- accessibility helpers (adapted from Underscores, GPLv2+) --- */
.screen-reader-text{
  border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;
  padding:0;position:absolute;width:1px;word-wrap:normal !important;
}
.screen-reader-text:focus{
  background-color:var(--white);clip-path:none;color:var(--teal-850);
  display:block;font-size:14px;font-weight:700;height:auto;left:16px;
  line-height:normal;padding:16px 24px;text-decoration:none;top:16px;
  width:auto;z-index:100000;border-radius:var(--r-input);
  box-shadow:var(--sh-card);
}
.skip-link:focus{outline:3px solid var(--lime-500);outline-offset:2px;}

/* honour a reduced-motion preference for the whole document */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{
    animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important;scroll-behavior:auto !important;
  }
}

/* --- alignments --- */
.alignleft{float:left;margin-right:1.5em;margin-bottom:1em;}
.alignright{float:right;margin-left:1.5em;margin-bottom:1em;}
.aligncenter{clear:both;display:block;margin-left:auto;margin-right:auto;}
.alignnone{margin-bottom:1em;}
.alignwide{max-width:min(100%,1120px);margin-left:auto;margin-right:auto;}
.alignfull{
  max-width:100vw;width:100vw;
  margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
}
.clear::after,.entry-content::after,.comment-content::after{
  content:"";display:table;clear:both;
}

/* --- captions and galleries --- */
.wp-caption{margin-bottom:1.5em;max-width:100%;}
.wp-caption img[class*="wp-image-"]{display:block;margin-left:auto;margin-right:auto;}
.wp-caption-text,.gallery-caption,.wp-block-image figcaption{
  font-size:14px;color:var(--text-muted);text-align:center;margin-top:10px;
}
.gallery{display:grid;gap:14px;margin-bottom:1.5em;}
.gallery-columns-2{grid-template-columns:repeat(2,1fr);}
.gallery-columns-3{grid-template-columns:repeat(3,1fr);}
.gallery-columns-4{grid-template-columns:repeat(4,1fr);}
.gallery-item img{border-radius:var(--r-chip);}

/* --- embeds and media --- */
embed,iframe,object,video{max-width:100%;}
.wp-block-embed iframe{max-width:100%;}
figure{margin:0 0 1.5em;}

/* --- post states WordPress adds via post_class() --- */
.sticky{position:relative;}
.sticky .entry-title::after{
  content:"\2605";margin-left:10px;color:var(--lime-700);font-size:.8em;
  vertical-align:super;
}
.bypostauthor > .comment-body .fn{color:var(--teal-700);}
.bypostauthor > .comment-body .fn::after{
  content:"\2022";margin-left:8px;color:var(--lime-700);
}
.post-password-form input[type="password"]{margin-right:8px;}

/* --- entry content: raw WordPress output needs the type defaults back --- */
.entry-content > *{margin-bottom:1.25em;}
.entry-content > *:last-child{margin-bottom:0;}
.entry-content h1,.entry-content h2,.entry-content h3,
.entry-content h4,.entry-content h5,.entry-content h6{
  margin-top:1.6em;margin-bottom:.6em;color:var(--teal-850);
}
.entry-content h1{font-size:40px;}
.entry-content h2{font-size:31px;}
.entry-content h3{font-size:24px;}
.entry-content h4{font-size:20px;}
.entry-content h5{font-size:17px;}
.entry-content h6{font-size:15px;text-transform:uppercase;letter-spacing:.8px;}
.entry-content a{
  color:var(--teal-700);font-weight:700;
  border-bottom:1.5px solid var(--mint-200);
}
.entry-content a:hover{color:var(--lime-700);border-bottom-color:var(--lime-500);}
.entry-content ul,.entry-content ol{padding-left:1.4em;}
.entry-content li{margin-bottom:.5em;}
.entry-content blockquote{
  margin:1.6em 0;padding:20px 26px;background:var(--surface-mint);
  border-left:4px solid var(--lime-500);border-radius:var(--r-input);
}
.entry-content blockquote p{margin-bottom:.8em;}
.entry-content blockquote cite{font-size:14px;color:var(--text-muted);font-style:normal;}
.entry-content pre,.wp-block-code{
  background:var(--teal-950);color:var(--mint-100);padding:20px 24px;
  border-radius:var(--r-input);overflow-x:auto;font-size:14px;line-height:1.6;
}
.entry-content code{
  background:var(--surface-mint);padding:2px 6px;border-radius:6px;font-size:.92em;
}
.entry-content pre code{background:none;padding:0;color:inherit;}
.entry-content table{
  width:100%;border-collapse:collapse;font-size:15px;display:block;overflow-x:auto;
}
.entry-content th,.entry-content td{
  padding:12px 14px;border-bottom:1px solid var(--mint-200);text-align:left;
}
.entry-content th{color:var(--teal-850);font-weight:800;}
.entry-content hr,.wp-block-separator{
  border:0;border-top:1px solid var(--mint-200);margin:2.4em 0;
}
.entry-content img{height:auto;border-radius:var(--r-chip);}

/* --- entry meta --- */
.entry-meta,.entry-footer{
  font-size:14px;color:var(--text-muted);display:flex;flex-wrap:wrap;
  gap:8px 18px;align-items:center;
}
.entry-meta a,.entry-footer a{color:var(--teal-700);font-weight:700;}
.entry-meta a:hover,.entry-footer a:hover{color:var(--lime-700);}

/* --- pagination --- */
.navigation.pagination,.navigation.posts-navigation,.navigation.post-navigation{
  margin-top:48px;
}
.nav-links{display:flex;flex-wrap:wrap;gap:10px;align-items:center;}
.page-numbers{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:44px;height:44px;padding:0 14px;border-radius:var(--r-input);
  background:var(--white);color:var(--teal-700);font-weight:700;font-size:15px;
  box-shadow:var(--sh-card);
}
.page-numbers:hover,.page-numbers.current{
  background:var(--lime-500);color:var(--teal-900);
}
.post-navigation .nav-links{justify-content:space-between;gap:24px;}
.post-navigation .nav-previous,.post-navigation .nav-next{max-width:48%;}
.post-navigation a{font-weight:800;color:var(--teal-700);}

/* --- comments --- */
.comments-area{margin-top:56px;}
.comments-title,.comment-reply-title{font-size:26px;margin-bottom:24px;}
.comment-list{list-style:none;margin:0;padding:0;}
.comment-list ol.children{list-style:none;margin:0 0 0 clamp(16px,4vw,44px);padding:0;}
.comment-body{
  background:var(--white);border-radius:var(--r-card);padding:24px 26px;
  margin-bottom:18px;box-shadow:var(--sh-card);
}
.comment-author{display:flex;align-items:center;gap:12px;margin-bottom:6px;}
.comment-author .avatar{border-radius:50%;}
.comment-author .fn{font-weight:800;color:var(--teal-850);font-style:normal;}
.comment-metadata{font-size:13.5px;color:var(--text-muted);margin-bottom:12px;}
.comment-metadata a{color:var(--text-muted);}
.comment-content p{margin-bottom:.9em;}
.comment-content p:last-child{margin-bottom:0;}
.reply{margin-top:10px;}
.comment-reply-link{
  font-size:13.5px;font-weight:700;color:var(--lime-700);
}
.comment-awaiting-moderation{font-size:14px;color:var(--text-muted);font-style:italic;}
.comment-respond{margin-top:32px;}
.comment-form{display:grid;gap:16px;}
.comment-form .comment-notes,.comment-form .logged-in-as{
  font-size:14px;color:var(--text-muted);
}
.comment-form label{
  display:block;font-size:14px;font-weight:700;color:var(--teal-850);margin-bottom:6px;
}
.comment-form input[type="text"],.comment-form input[type="email"],
.comment-form input[type="url"],.comment-form textarea,
.search-field,.post-password-form input[type="password"]{
  width:100%;padding:13px 16px;border:1.5px solid var(--mint-200);
  border-radius:var(--r-input);background:var(--white);
  font-family:inherit;font-size:15px;color:var(--text-body);
}
.comment-form input:focus,.comment-form textarea:focus,.search-field:focus{
  outline:3px solid var(--lime-500);outline-offset:1px;border-color:transparent;
}
.comment-form .form-submit{margin:0;}
.comment-form input[type="submit"],.search-submit,
.post-password-form input[type="submit"]{
  border:0;cursor:pointer;font-family:inherit;font-weight:800;font-size:15px;
  padding:14px 28px;border-radius:var(--r-pill);
  background:var(--lime-500);color:var(--teal-900);box-shadow:var(--sh-lime);
}
.comment-form input[type="submit"]:hover,.search-submit:hover{
  background:var(--lime-700);color:var(--white);
}
.no-comments{color:var(--text-muted);font-size:15px;}

/* --- search form --- */
.search-form{display:flex;gap:10px;align-items:stretch;}
.search-form label{flex:1;margin:0;}

/* --- widgets --- */
.widget{margin-bottom:34px;}
.widget:last-child{margin-bottom:0;}
.widget-title{
  font-size:15px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;
  color:var(--teal-850);margin-bottom:14px;
}
.widget ul{list-style:none;margin:0;padding:0;}
.widget li{
  padding:9px 0;border-bottom:1px solid var(--mint-200);
  font-size:15px;color:var(--text-body);
}
.widget li:last-child{border-bottom:0;}
.widget a{color:var(--teal-700);font-weight:700;}
.widget a:hover{color:var(--lime-700);}
.widget_search .search-form{margin:0;}
.widget select{
  width:100%;padding:12px 14px;border:1.5px solid var(--mint-200);
  border-radius:var(--r-input);background:var(--white);font-family:inherit;
}

/* --- sidebar + content shell for non-builder pages --- */
.site-main{padding:var(--sec-y) var(--rail);}
.content-area--with-sidebar{
  display:grid;gap:clamp(32px,5vw,64px);
  grid-template-columns:minmax(0,1fr) 320px;align-items:start;
}
.widget-area{position:sticky;top:calc(var(--nav-h) + 20px);}
.entry{
  background:var(--white);border-radius:var(--r-card);padding:clamp(24px,4vw,44px);
  margin-bottom:28px;box-shadow:var(--sh-card);
}
.entry-title{font-size:clamp(28px,4vw,40px);margin-bottom:12px;}
.entry-title a{color:inherit;}
.entry-title a:hover{color:var(--teal-700);}
.page-header{margin-bottom:32px;}
.page-title{font-size:clamp(28px,4vw,43px);}
.archive-description{margin-top:12px;color:var(--text-muted);}
.post-thumbnail{margin-bottom:20px;}
.error-404 .page-content{max-width:620px;}

@media (max-width:1000px){
  .content-area--with-sidebar{grid-template-columns:minmax(0,1fr);}
  .widget-area{position:static;}
}

/* --- footer widgets --- */
.site-footer__widgets{
  display:grid;gap:34px;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));
}

/* ==========================================================================
   4. Environment compatibility -- admin bar, Elementor, RTL
   ========================================================================== */

/* the sticky header must sit below the WordPress toolbar, not under it */
body.admin-bar .nav{top:32px;}
body.admin-bar .toc,body.admin-bar .widget-area{top:calc(var(--nav-h) + 52px);}
@media screen and (max-width:782px){
  body.admin-bar .nav{top:46px;}
}

/* Elementor renders its own containers; let them span the theme shell */
.elementor-page .site-main,
.tops2026-full-width .site-main{padding-left:0;padding-right:0;padding-top:0;}
.elementor-page .site-main > .entry{
  background:none;box-shadow:none;padding:0;border-radius:0;
}
.elementor-template-canvas .site-header,
.elementor-template-canvas .site-footer{display:none;}

/* Elementor sets its own content width; keep the theme cap from fighting it */
.elementor-section-boxed > .elementor-container,
.elementor-widget-container{max-width:100%;}

/* --- right-to-left --- */
.rtl .alignleft{float:right;margin-right:0;margin-left:1.5em;}
.rtl .alignright{float:left;margin-left:0;margin-right:1.5em;}
.rtl .entry-content ul,.rtl .entry-content ol{padding-left:0;padding-right:1.4em;}
.rtl .comment-list ol.children{margin-left:0;margin-right:clamp(16px,4vw,44px);}

/* ==========================================================================
   5. Navigation -- the design mapped onto standard wp_nav_menu() markup
   ========================================================================== */
.nav__links,.nav__links ul{list-style:none;margin:0;padding:0;}
.nav__links{gap:6px;align-items:center;}
.nav__links > li{position:relative;}
.nav__links > li > a{
  display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:500;
  color:var(--text-nav);padding:10px 12px;border-radius:10px;white-space:nowrap;
  transition:color .2s ease,background .2s ease;
}
.nav__links > li > a:hover,
.nav__links > li:hover > a,
.nav__links > li:focus-within > a{color:var(--teal-500);background:var(--surface-mint);}
.nav__links > li.current-menu-item > a,
.nav__links > li.current-menu-ancestor > a,
.nav__links > li.current_page_item > a{color:var(--teal-500);font-weight:700;}

/* submenu: flush to the trigger, with a transparent bridge so the pointer
   never leaves the parent on its way down (see .mega note above) */
.nav__links .sub-menu{
  position:absolute;top:100%;left:0;min-width:260px;
  max-width:calc(100vw - 2 * var(--gutter));padding-top:10px;
  opacity:0;visibility:hidden;pointer-events:none;z-index:120;
  transition:opacity .18s ease,visibility .18s;
}
.nav__links > li:hover > .sub-menu,
.nav__links > li:focus-within > .sub-menu,
.nav__links > li.is-open > .sub-menu{opacity:1;visibility:visible;pointer-events:auto;}
.nav__links .sub-menu > li{
  background:var(--white);border-left:1px solid var(--mint-50);
  border-right:1px solid var(--mint-50);
}
.nav__links .sub-menu > li:first-child{
  border-top:1px solid var(--mint-50);border-radius:18px 18px 0 0;padding-top:8px;
}
.nav__links .sub-menu > li:last-child{
  border-bottom:1px solid var(--mint-50);border-radius:0 0 18px 18px;padding-bottom:8px;
  box-shadow:0 26px 60px rgba(31,76,78,.22);
}
.nav__links .sub-menu a{
  display:block;padding:9px 18px;font-size:14.5px;font-weight:700;
  color:var(--teal-850);letter-spacing:-.2px;
}
.nav__links .sub-menu a:hover{background:var(--surface-mint);color:var(--teal-500);}

/* third level opens to the side on pointer devices */
.nav__links .sub-menu .sub-menu{top:0;left:100%;padding-top:0;padding-left:6px;}

/* the chevron and the touch/keyboard submenu toggle */
.nav__toggle{
  position:absolute;top:50%;right:2px;transform:translateY(-50%);
  width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;
  background:none;border:0;cursor:pointer;color:var(--text-nav);border-radius:8px;
}
.nav__toggle svg{transition:transform .2s ease;opacity:.6;}
.nav__toggle[aria-expanded="true"] svg{transform:rotate(180deg);}
.nav__links > li.menu-item-has-children > a{padding-right:34px;}

/* --- mobile drawer --- */
@media (max-width:1180px){
  .nav__burger{display:inline-flex;}
  .nav__links{
    display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    background:var(--white);padding:8px var(--rail) 18px;
    box-shadow:0 26px 60px rgba(31,76,78,.18);max-height:calc(100vh - var(--nav-h));
    overflow-y:auto;overscroll-behavior:contain;
  }
  .nav__links.is-open{display:flex;}
  .nav__links > li{border-bottom:1px solid var(--mint-50);}
  .nav__links > li:last-child{border-bottom:0;}
  .nav__links > li > a{padding:14px 2px;font-size:16px;}
  .nav__links .sub-menu{
    position:static;opacity:1;visibility:visible;pointer-events:auto;
    padding:0 0 10px 14px;max-width:none;min-width:0;display:none;
  }
  .nav__links > li.is-open > .sub-menu{display:block;}
  .nav__links > li:hover > .sub-menu,
  .nav__links > li:focus-within > .sub-menu{display:none;}
  .nav__links > li.is-open > .sub-menu{display:block;}
  .nav__links .sub-menu > li,
  .nav__links .sub-menu > li:first-child,
  .nav__links .sub-menu > li:last-child{
    border:0;border-radius:0;box-shadow:none;padding:0;background:none;
  }
  .nav__links .sub-menu .sub-menu{left:auto;padding-left:14px;}
  .nav__links .sub-menu a{padding:10px 2px;}
}

/* ==========================================================================
   6. Theme shell -- header, footer and content wrappers the templates output
   ========================================================================== */
.content-area__main{min-width:0;}

/* Full width means no sidebar and no card wrapper -- NOT no gutter. Zeroing
   the padding here ran plain text flush into the viewport edge. Only a page
   builder, which draws its own containers, gets the padding removed. */
.site-main--full{padding:var(--sec-y) var(--rail);}
.site-main--full > article > .entry-content{
  max-width:var(--content-max);margin-left:auto;margin-right:auto;
}
.site-main--canvas{padding:0;}

/* Front-page sections are full-bleed and carry their own --rail padding, so
   the shell adds none. Padding here would inset every band and halve the
   split booking row. */
.site-main--sections{padding:0;}

/* No form shortcode set: the band is one full-width column rather than a
   dark half beside an empty white half. */
.booking--solo{grid-template-columns:minmax(0,1fr);}
.booking--solo .booking__left{
  padding-left:var(--rail);padding-right:var(--rail);
}
.booking--solo .booking__left p{max-width:620px;}

/* branding fallback when no custom logo is set */
.nav__logo .site-title{font-size:24px;font-weight:800;letter-spacing:-.6px;margin:0;}
.nav__logo .site-title a{color:var(--teal-850);}
.nav__logo .site-title a:hover{color:var(--teal-500);}
.nav__logo .site-description{font-size:13px;color:var(--text-muted);margin:2px 0 0;}
.nav__logo .custom-logo{height:62px;width:auto;}
.nav.is-stuck .nav__logo .custom-logo{height:46px;}
.custom-logo-link{display:inline-block;}

/* footer */
.site-footer{
  background:var(--teal-900);color:var(--mint-400);
  padding:56px var(--rail) 40px;
}
.site-footer .widget-title,.site-footer h2,.site-footer h3,.site-footer h4{
  font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase;
  color:var(--white);margin-bottom:16px;
}
.site-footer .widget li{border-bottom-color:rgba(255,255,255,.1);font-size:14px;}
.site-footer .widget a{color:var(--mint-400);font-weight:500;}
.site-footer .widget a:hover{color:var(--yellow-400);}
.site-footer__nav{margin-top:28px;}
.site-footer .footer__links{
  display:flex;flex-direction:row;flex-wrap:wrap;gap:11px 24px;
  list-style:none;margin:0;padding:0;font-size:14px;
}
.site-footer .footer__links a{color:var(--mint-400);}
.site-footer .footer__links a:hover{color:var(--yellow-400);}
.site-info{
  margin-top:26px;padding-top:26px;font-size:13px;color:#8CBDB4;
  border-top:1px solid rgba(255,255,255,.1);
}
.site-info a{color:var(--mint-400);}

/* the announcement bar is a single centred line in the theme shell */
.topbar__text{display:inline-block;}

/* ==========================================================================
   7. Call-to-action band (template-parts/blocks/cta.php)
   ========================================================================== */
.cta-band__inner{max-width:760px;margin:0 auto;text-align:center;}
.cta-band__inner > * + *{margin-top:18px;}
.cta-band__buttons{
  display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:26px;
}
.hero__grid--solo{grid-template-columns:minmax(0,1fr);}
.site-footer__col{min-width:0;}

/* featured image in listings — a frame, not the photo's natural size */
.post-thumbnail img{
  width:100%;aspect-ratio:16/10;object-fit:cover;
  border-radius:var(--r-card);display:block;
}
/* the prose column inside a full-bleed section */
.sec--prose .entry-content{max-width:var(--content-max);margin-left:auto;margin-right:auto;}
.sec--prose .entry-meta,.sec--prose .entry-footer{
  max-width:var(--content-max);margin-left:auto;margin-right:auto;
}
.sec--prose .entry-meta{margin-bottom:18px;}

/* footer: the shell class and the design class are the same element now */
.site-footer.footer{padding:56px var(--rail) 40px;}
.footer__logo--text{font-size:22px;font-weight:800;margin-bottom:14px;}
.footer__logo--text a{color:var(--white);}
.footer__links--row{flex-direction:row;flex-wrap:wrap;gap:11px 24px;}
.site-footer .footer__cols h4{margin-bottom:16px;}
@media (max-width:900px){
  .footer__cols{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:560px){
  .footer__cols{grid-template-columns:minmax(0,1fr);}
}


/* ==========================================================================
   8. Body map -- the homepage 'where does it hurt?' selector
   Restored from the original design system; drives template-parts/front/bodymap.php
   ========================================================================== */
/* ---------- conditions: interactive selector (homepage) ---------- */
.conditions{background:linear-gradient(160deg,var(--teal-600) 0%,var(--teal-800) 100%);}
/* ==========================================================================
   BODY MAP — homepage showcase.
   Compact two-column stage: an anatomical back-view figure with pulsing
   hotspots, beside a panel that uses the region photo as its own backdrop.
   ========================================================================== */
.bmap{position:relative;overflow:hidden;padding-top:52px;padding-bottom:52px;}

.bmap__head{
  position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:20px 32px;
  align-items:flex-end;justify-content:space-between;margin-bottom:26px;
}
.bmap__intro{max-width:58ch;}
.bmap__title{font-size:clamp(30px,3.6vw,42px);margin-top:2px;}
.bmap__lead{color:var(--mint-100);font-size:15.5px;line-height:1.6;max-width:50ch;margin-top:12px;}

/* small lime rule before the eyebrow, echoing the hero's accent language */
.eyebrow--rule{display:inline-flex;align-items:center;gap:10px;}
.eyebrow--rule::before{
  content:"";width:26px;height:2px;border-radius:2px;background:var(--lime-500);flex-shrink:0;
}

/* the instruction cue doubles as the graphic that balances the row */
.bmap__hint{
  display:inline-flex;align-items:center;gap:10px;flex-shrink:0;
  padding:9px 17px;border-radius:100px;
  border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.07);
  color:var(--mint-100);font-size:13px;font-weight:700;letter-spacing:.2px;
  margin-bottom:4px;
}
.bmap__hint-dot{
  width:8px;height:8px;border-radius:50%;background:var(--lime-500);flex-shrink:0;
  box-shadow:0 0 0 0 rgba(186,201,74,.55);animation:hintPulse 2s var(--ease) infinite;
}
@keyframes hintPulse{
  0%{box-shadow:0 0 0 0 rgba(186,201,74,.55);}
  70%{box-shadow:0 0 0 9px rgba(186,201,74,0);}
  100%{box-shadow:0 0 0 0 rgba(186,201,74,0);}
}

.bmap__stage{
  position:relative;z-index:2;display:grid;
  grid-template-columns:minmax(240px,300px) minmax(0,1fr);
  gap:clamp(24px,3vw,44px);align-items:stretch;
}

/* ---------- figure ---------- */
.bmap__figure{
  position:relative;display:grid;place-items:center;padding:18px 8px;
  border-radius:24px;border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));
}
/* The hotspot layer must be the SAME box as the SVG. Previously it filled the
   padded figure wrapper while the SVG was a centred max-width box inside it, so
   on narrow screens (svg 190px vs full-width layer) the dots drifted off the body. */
.bmap__stack{position:relative;width:100%;max-width:268px;margin:0 auto;}
.bmap__svg{width:100%;height:auto;display:block;position:relative;z-index:3;}

/* faint imaging grid behind the body */
.bmap__grid{
  position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.5;
  background-image:
    linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(circle at 50% 45%,#000 38%,transparent 74%);
          mask-image:radial-gradient(circle at 50% 45%,#000 38%,transparent 74%);
}
/* lime glow that travels to whichever hotspot is active */
.bmap__pulse{
  position:absolute;left:var(--gx);top:var(--gy);width:170px;height:170px;z-index:2;
  transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(186,201,74,.34),rgba(186,201,74,0) 66%);
  transition:left .55s var(--ease),top .55s var(--ease);
}

.bmap__body path,.bmap__body circle,.bmap__body rect{
  fill:url(#bodyFill);stroke:rgba(255,255,255,.32);stroke-width:1.3;
}
.bmap__ribs path{stroke:rgba(255,255,255,.20);stroke-width:1.4;fill:none;stroke-linecap:round;}
.bmap__joints circle{fill:none;stroke:rgba(255,255,255,.26);stroke-width:1.4;}
.bmap__spine .vert{
  fill:rgba(214,239,231,.42);transition:fill .35s var(--ease),transform .35s var(--ease);
  transform-origin:130px center;
}
.bmap__spine .vert.is-lit{fill:var(--lime-500);transform:scaleX(1.28);}

/* ---------- hotspots ---------- */
.bmap__hots{position:absolute;inset:0;z-index:4;}
.hot{
  position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);
  width:34px;height:34px;padding:0;border:0;background:none;cursor:pointer;
  display:grid;place-items:center;
}
.hot__dot{
  width:13px;height:13px;border-radius:50%;background:var(--mint-100);
  box-shadow:0 0 0 3px rgba(255,255,255,.20);
  transition:transform .3s var(--ease),background .3s var(--ease),box-shadow .3s var(--ease);
}
.hot__ring{
  position:absolute;width:13px;height:13px;border-radius:50%;
  border:1.6px solid var(--mint-100);opacity:0;
}
.hot__ring--1{animation:hotRing 3s var(--ease) infinite;}
.hot__ring--2{animation:hotRing 3s var(--ease) infinite;animation-delay:1.5s;}
.hot:nth-child(2) .hot__ring--1{animation-delay:.5s;}
.hot:nth-child(3) .hot__ring--1{animation-delay:1s;}
.hot:nth-child(4) .hot__ring--1{animation-delay:1.5s;}
.hot:nth-child(5) .hot__ring--1{animation-delay:2s;}
.hot:nth-child(6) .hot__ring--1{animation-delay:2.5s;}
.hot:nth-child(7) .hot__ring--1{animation-delay:3s;}
.hot:nth-child(8) .hot__ring--1{animation-delay:3.5s;}
@keyframes hotRing{
  0%{transform:scale(1);opacity:.5;}
  70%,100%{transform:scale(3.2);opacity:0;}
}
.hot__label{
  position:absolute;left:calc(100% + 9px);white-space:nowrap;
  font-size:12px;font-weight:700;color:var(--teal-900);background:var(--lime-500);
  padding:4px 10px;border-radius:100px;
  opacity:0;transform:translateX(-5px) scale(.9);pointer-events:none;
  transition:opacity .25s var(--ease),transform .25s var(--ease);
}
.hot[style*="--x:58.5"] .hot__label{left:auto;right:calc(100% + 9px);transform:translateX(5px) scale(.9);}
.hot:hover .hot__label,.hot:focus-visible .hot__label,.hot.is-active .hot__label{
  opacity:1;transform:translateX(0) scale(1);
}
.hot:hover .hot__dot{transform:scale(1.3);}
.hot.is-active .hot__dot{
  background:var(--lime-500);transform:scale(1.45);
  box-shadow:0 0 0 5px rgba(186,201,74,.26),0 0 20px rgba(186,201,74,.8);
}
.hot.is-active .hot__ring{border-color:var(--lime-500);}
.hot:focus-visible{outline:none;}
.hot:focus-visible .hot__dot{box-shadow:0 0 0 4px var(--lime-500);}

/* ---------- panel ---------- */
.bmap__panel{
  position:relative;border-radius:24px;overflow:hidden;
  border:1px solid rgba(255,255,255,.16);box-shadow:0 26px 60px rgba(10,45,47,.36);
  min-height:326px;display:flex;align-items:flex-end;
}
.bmap__shots{position:absolute;inset:0;}
.bmap__shot{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transform:scale(1.07);
  transition:opacity .7s var(--ease),transform 1.1s var(--ease);
}
.bmap__shot.is-show{opacity:1;transform:scale(1);}
.bmap__scrim{
  position:absolute;inset:0;
  background:linear-gradient(105deg,rgba(20,64,66,.94) 34%,rgba(20,64,66,.62) 62%,rgba(20,64,66,.28) 100%);
}
.bmap__copy{position:relative;z-index:2;padding:clamp(22px,2.6vw,30px);max-width:62ch;}
.bmap__row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px;}
.bmap__name{font-size:clamp(24px,2.8vw,31px);color:var(--white);letter-spacing:-.6px;}
.bmap__count{
  font-size:11.5px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;
  color:var(--yellow-400);border:1px solid rgba(226,211,107,.4);
  border-radius:100px;padding:4px 10px;
}
.bmap__blurb{color:var(--mint-100);font-size:14.5px;line-height:1.6;max-width:52ch;min-height:4.8em;}
.bmap__copy .chips{display:flex;flex-wrap:wrap;gap:7px;list-style:none;padding:0;margin:14px 0 0;min-height:62px;align-content:flex-start;}
.bmap__copy .chips li{
  font-size:12.5px;color:var(--white);background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.22);border-radius:100px;padding:6px 13px;
  opacity:0;transform:translateY(6px);
  animation:chipIn .38s var(--ease) forwards;
}
.bmap__copy .chips li:nth-child(1){animation-delay:.04s;}
.bmap__copy .chips li:nth-child(2){animation-delay:.10s;}
.bmap__copy .chips li:nth-child(3){animation-delay:.16s;}
.bmap__copy .chips li:nth-child(4){animation-delay:.22s;}
.bmap__copy .chips li:nth-child(5){animation-delay:.28s;}
@keyframes chipIn{to{opacity:1;transform:translateY(0);}}
.bmap__cta{margin-top:14px;font-size:14px;padding:12px 24px;}

.bmap__panel .bmap__copy>*{transition:opacity .22s var(--ease),transform .22s var(--ease);}
.bmap__panel.is-swapping .bmap__copy>*{opacity:0;transform:translateY(7px);}

/* ---------- region rail ---------- */
.bmap__rail{
  position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:8px;
  margin-top:18px;justify-content:center;
}
.rail__btn{
  font-family:inherit;font-size:13.5px;font-weight:700;color:var(--mint-100);
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);
  border-radius:100px;padding:9px 18px;cursor:pointer;
  transition:background .25s ease,border-color .25s ease,color .25s ease,transform .25s ease;
}
.rail__btn:hover{background:rgba(255,255,255,.14);transform:translateY(-1px);}
.rail__btn.is-active{
  background:var(--lime-500);border-color:var(--lime-500);color:var(--teal-900);
}

@media (max-width:1000px){
  .bmap__head{gap:16px;}
  .bmap__stage{grid-template-columns:1fr;gap:24px;}
  .bmap__figure{padding:8px 0;}
  .bmap__stack{max-width:190px;}
  .bmap__blurb{min-height:0;}
  .bmap__panel{min-height:0;}
}
@media (max-width:760px){
  .bmap{padding-top:48px;padding-bottom:48px;}
  .bmap__pulse{width:140px;height:140px;}
  .hot__label{font-size:11px;padding:3px 8px;}
  .bmap__rail{justify-content:flex-start;}
  .rail__btn{font-size:12.5px;padding:8px 14px;}
}
@media (prefers-reduced-motion:reduce){
  .hot__ring,.bmap__hint-dot{animation:none;}
  .bmap__pulse{transition:none;}
  .bmap__copy .chips li{animation:none;opacity:1;transform:none;}
  .bmap__shot{transition:opacity .01s;}
}


/* ==========================================================================
   9. Plain content, styled as the design's components
   --------------------------------------------------------------------------
   The static build applied .ticks / .numlist / .h3--block while rendering
   markdown. WordPress stores plain <ul>, <ol> and headings, so the same
   treatment is applied here by element instead of by class. Editors get the
   design without having to know any class names; an explicit class still
   wins, because these selectors are element-scoped and the component rules
   above carry equal or higher specificity.
   ========================================================================== */

/* bullet lists read as tick lists */
.entry-content ul:not([class]){
  list-style:none;padding:0;margin:0 0 1.25em;display:grid;gap:11px;
}
.entry-content ul:not([class]) > li{
  position:relative;padding-left:28px;font-size:15.5px;line-height:1.6;
  color:var(--text-body);margin:0;
}
.entry-content ul:not([class]) > li::before{
  content:"";position:absolute;left:0;top:.5em;width:14px;height:8px;
  border-left:2px solid var(--lime-700);border-bottom:2px solid var(--lime-700);
  transform:rotate(-45deg);border-radius:1px;
}
/* nested lists stay ordinary bullets — ticks inside ticks read as noise */
.entry-content ul:not([class]) ul{
  list-style:disc;display:block;padding-left:1.2em;margin-top:8px;gap:0;
}
.entry-content ul:not([class]) ul > li{padding-left:0;}
.entry-content ul:not([class]) ul > li::before{content:none;}

/* numbered lists get the design's lime counters */
.entry-content ol:not([class]){
  list-style:none;padding:0;margin:0 0 1.25em;display:grid;gap:16px;counter-reset:tops-n;
}
.entry-content ol:not([class]) > li{
  counter-increment:tops-n;display:grid;grid-template-columns:auto 1fr;gap:14px;
  align-items:start;font-size:15.5px;line-height:1.65;color:var(--text-body);margin:0;
}
.entry-content ol:not([class]) > li::before{
  content:counter(tops-n);
  width:30px;height:30px;border-radius:50%;
  background:var(--lime-500);color:var(--teal-900);
  display:flex;align-items:center;justify-content:center;
  font-weight:900;font-size:14px;flex-shrink:0;
}

/* heading scale matches .h3--block / .h4 rather than browser defaults */
.entry-content h2{font-size:31px;font-weight:800;letter-spacing:-.6px;margin-top:1.8em;}
.entry-content h3{font-size:24px;font-weight:800;letter-spacing:-.4px;}
.entry-content h4{font-size:18px;font-weight:800;letter-spacing:-.2px;margin-top:1.8em;}
.entry-content h5{font-size:16px;font-weight:800;}
.entry-content h6{
  font-size:12.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;
  color:var(--lime-700);
}

/* the first heading after the hero should not push a second gap */
.entry-content > h2:first-child,
.entry-content > h3:first-child,
.entry-content > h4:first-child{margin-top:0;}

/* a lone strong line acts as a sub-heading in these documents */
.entry-content > p > strong:only-child{
  display:inline-block;color:var(--teal-850);font-size:17px;
}

/* dark sections invert the same treatment */
.sec--dark .entry-content ul:not([class]) > li,
.sec--dark .entry-content ol:not([class]) > li{color:var(--mint-100);}
.sec--dark .entry-content h2,
.sec--dark .entry-content h3,
.sec--dark .entry-content h4{color:var(--white);}


/* ==========================================================================
   10. Mega-menu inside the mobile drawer
   The panel is absolutely positioned on desktop; in the drawer it becomes a
   plain stacked list that the item's toggle opens.
   ========================================================================== */
.nav__links > li.nav__item{position:relative;}

@media (max-width:1180px){
  .nav__links .mega{
    position:static;opacity:1;visibility:visible;pointer-events:auto;
    min-width:0;max-width:none;padding-top:0;display:none;
  }
  .nav__links > li.is-open > .mega{display:block;}
  .nav__item--has-menu:hover .mega,
  .nav__item--has-menu:focus-within .mega{opacity:1;visibility:visible;}
  .nav__links > li:not(.is-open) > .mega{display:none;}
  .mega__inner{
    grid-template-columns:minmax(0,1fr) !important;
    max-height:none;overflow:visible;border:0;box-shadow:none;
    background:none;padding:0 0 12px 14px;gap:2px;
  }
  .mega__item{padding:6px 0;}
  .mega__link{font-size:15px;}
  .mega__sub a{font-size:13.5px;}
  .nav__links > li.nav__item > a.nav__top{padding:14px 34px 14px 2px;}
  .nav__chev{display:none;}
}

/* the honeypot must be unreachable but not display:none, which some bots detect */
.tops-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.form__err{
  background:#FBE9E7;color:#8A2F22;border-radius:var(--r-input);
  padding:12px 16px;font-size:14.5px;margin-bottom:8px;
}

/* ==========================================================================
   11. Blog article body
   The static build tagged each element (.post__p, .post__h2 ...). WordPress
   stores plain HTML, so the same treatment is applied by element within the
   article body.
   ========================================================================== */
.post__body .entry-content > p{
  font-size:17px;line-height:1.75;color:var(--text-body);margin-bottom:1.15em;
}
.post__body .entry-content > h2{
  font-size:29px;font-weight:800;letter-spacing:-.6px;color:var(--teal-850);
  margin:1.9em 0 .55em;
}
.post__body .entry-content > h3{
  font-size:21px;font-weight:800;letter-spacing:-.3px;color:var(--teal-850);
  margin:1.6em 0 .5em;
}
.post__body .entry-content > ul:not([class]),
.post__body .entry-content > ol:not([class]){margin-bottom:1.4em;}
.post__body .entry-content a{
  color:var(--teal-700);font-weight:700;border-bottom:1.5px solid var(--mint-200);
}
.post__body .entry-content a:hover{color:var(--lime-700);border-bottom-color:var(--lime-500);}

/* ==========================================================================
   12. Navigation fallback safety net
   If any menu source ever emits a nested list into the header, it must not
   render inline and push the page down. Submenus are positioned or hidden,
   never in flow.
   ========================================================================== */
.nav__links .children{
  position:absolute;top:100%;left:0;min-width:240px;padding-top:10px;
  opacity:0;visibility:hidden;pointer-events:none;z-index:120;
  list-style:none;margin:0;
}
.nav__links > li:hover > .children,
.nav__links > li:focus-within > .children{opacity:1;visibility:visible;pointer-events:auto;}
.nav__links .children > li{background:var(--white);border:1px solid var(--mint-50);border-top:0;}
.nav__links .children > li:first-child{border-top:1px solid var(--mint-50);border-radius:14px 14px 0 0;}
.nav__links .children > li:last-child{border-radius:0 0 14px 14px;box-shadow:var(--sh-card);}
.nav__links .children a{display:block;padding:9px 16px;font-size:14.5px;font-weight:700;}
.nav__links--fallback > li{position:relative;}
.nav__links--fallback > li > a{
  display:inline-flex;align-items:center;font-size:15px;font-weight:500;
  color:var(--text-nav);padding:10px 12px;border-radius:10px;white-space:nowrap;
}
/* The header must never grow into a wall of links -- but it must never push
   the document wider than the viewport either. Letting the menu wrap and the
   flex children shrink keeps both true; nowrap traded a tall header for a
   horizontally scrolling page. */
.nav{max-width:100%;}
.nav__nav{min-width:0;flex:0 1 auto;}
.nav__links{flex-wrap:wrap;max-height:none;}
.nav__logo,.nav__right{flex-shrink:0;}

/* ==========================================================================
   13. Responsive corrections — MUST STAY LAST IN THE FILE
   --------------------------------------------------------------------------
   Each rule below was written earlier inside a media query and then silently
   overridden by a later top-level rule of equal specificity, so it never
   applied. Three came from the original design system, three from this port.
   Re-asserted here, after every other rule, where nothing can outrank them.

   If you add CSS, add it ABOVE this section.
   ========================================================================== */

@media (max-width:1000px){
  /* hub grids step down before they reach phone width */
  .hub{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media (max-width:760px){
  .hub{grid-template-columns:minmax(0,1fr);}
  .ticks--2col,.ticks--3col{grid-template-columns:minmax(0,1fr);}
  .h3--block{font-size:21px;}
  .entry-content ul:not([class]){grid-template-columns:minmax(0,1fr);}
}

@media (max-width:900px){
  .footer__links{gap:11px;}
  .site-footer .footer__links--row{gap:11px 20px;}
}

@media (max-width:1180px){
  /* the mobile drawer: a stacked panel, not the desktop flex row */
  .nav__links{
    flex-direction:column;align-items:stretch;gap:0;flex-wrap:nowrap;
    max-height:calc(100vh - var(--nav-h));overflow-y:auto;
  }
}
