/* =====================================================================
   Cooks Bay Marina — "Cook's Bay Harbour" design system
   Warm four-season lake-town editorial. Light cream canvas + harbour dark.
   ===================================================================== */

/* ---- fonts ---- */
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400..800&family=Inter+Tight:wght@400;500;600;700&family=Spline+Sans+Mono:wght@400;500;600&display=swap');

/* ---- tokens ---- */
:root{
  --sand:#F4EEE2;        /* page bg */
  --sand-2:#EDE4D2;      /* alt bands */
  --paper:#FBF7EF;       /* cards */
  --harbour:#102E40;     /* primary dark */
  --harbour-2:#0B2230;   /* deeper */
  --ink:#16242C;         /* body text */
  --ink-soft:#3D4F58;    /* muted text */
  --water:#155E66;       /* teal links/secondary */
  --water-bright:#1C7E86;
  --cedar:#A8602F;       /* warm wood */
  --sun:#E2912F;         /* amber accent / CTA */
  --sun-deep:#B96E15;    /* amber text on light */
  --foam:#FFFFFF;
  --line:rgba(16,46,64,.14);
  --line-soft:rgba(16,46,64,.08);

  --radius:14px;
  --radius-sm:8px;
  --radius-lg:22px;
  --shadow-sm:0 1px 2px rgba(16,46,64,.06), 0 2px 8px rgba(16,46,64,.05);
  --shadow:0 12px 34px -14px rgba(11,34,48,.30);
  --shadow-lg:0 30px 70px -28px rgba(11,34,48,.45);

  --font-display:'Bricolage Grotesque', Georgia, serif;
  --font-body:'Inter Tight', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --font-mono:'Spline Sans Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --wrap:1200px;
  --gutter:clamp(20px, 5vw, 64px);
  --nav-h:76px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ---- reset ---- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%}
html.lenis{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto !important}
.lenis.lenis-stopped{overflow:hidden}
body{
  font-family:var(--font-body);
  background:var(--sand);
  color:var(--ink);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,picture,svg,video{display:block;max-width:100%}
img{height:auto}
a{color:var(--water);text-decoration:none;transition:color .2s var(--ease)}
a:hover{color:var(--cedar)}
button{font-family:inherit;cursor:pointer}
ul{list-style:none;padding:0}
:focus-visible{outline:3px solid var(--sun);outline-offset:3px;border-radius:4px}

/* ---- type ---- */
h1,h2,h3,h4{font-family:var(--font-display);font-weight:650;line-height:1.08;color:var(--harbour);letter-spacing:-.012em}
h1{font-size:clamp(2.5rem,6vw,4.7rem);font-weight:700;letter-spacing:-.02em}
h2{font-size:clamp(2rem,4.2vw,3.2rem)}
h3{font-size:clamp(1.35rem,2.2vw,1.85rem)}
h4{font-size:1.18rem}
p{color:var(--ink-soft)}
strong{color:var(--ink);font-weight:600}
.eyebrow{
  font-family:var(--font-mono);
  font-size:.74rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  color:var(--sun-deep);display:inline-flex;align-items:center;gap:.6em;
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--cedar);opacity:.6}
.lede{font-size:clamp(1.1rem,1.6vw,1.32rem);color:var(--ink-soft);line-height:1.55;max-width:60ch}
.serif-accent{font-style:italic}

/* ---- layout ---- */
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:clamp(64px,9vw,128px)}
.section--tight{padding-block:clamp(48px,6vw,80px)}
.band-paper{background:var(--paper)}
.band-sand2{background:var(--sand-2)}
.band-dark{background:var(--harbour);color:#D7E2E6}
.band-dark h1,.band-dark h2,.band-dark h3,.band-dark h4{color:var(--foam)}
.band-dark p{color:#A9BcC4;color:#AEC0C7}
.band-dark .eyebrow{color:#F0B96A}
.band-dark .eyebrow::before{background:#F0B96A;opacity:.7}

.sec-head{max-width:62ch}
.sec-head h2{margin-top:.5rem}
.sec-head p{margin-top:1rem}
.center{text-align:center;margin-inline:auto}

/* ---- buttons ---- */
.btn{
  --bg:var(--harbour);--fg:var(--foam);
  display:inline-flex;align-items:center;justify-content:center;gap:.55em;
  font-family:var(--font-body);font-weight:600;font-size:1rem;
  padding:.85em 1.6em;border-radius:999px;border:1px solid transparent;
  background:var(--bg);color:var(--fg);
  position:relative;overflow:hidden;isolation:isolate;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease);
  min-height:48px;
}
.btn::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.22),transparent 60%);
  transform:translateX(-130%);transition:transform .7s var(--ease)}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.btn:hover::after{transform:translateX(130%)}
.btn--sun{--bg:var(--sun);--fg:#3a230a}
.btn--sun:hover{background:#EDA044}
.btn--ghost{--bg:transparent;--fg:var(--harbour);border-color:var(--line)}
.btn--ghost:hover{background:rgba(16,46,64,.05)}
.btn--on-dark{--bg:var(--sun);--fg:#3a230a}
.btn--ghost.btn--on-dark{--bg:transparent;--fg:var(--foam);border-color:rgba(255,255,255,.28)}
.btn--ghost.btn--on-dark:hover{background:rgba(255,255,255,.08)}
.btn--lg{font-size:1.06rem;padding:1em 1.9em}
.btn svg{width:1.1em;height:1.1em}

/* ---- header ---- */
.site-header{
  position:fixed;inset:0 0 auto 0;z-index:100;height:var(--nav-h);
  display:flex;align-items:center;
  transition:background .3s var(--ease), box-shadow .3s var(--ease), backdrop-filter .3s var(--ease);
}
.site-header.scrolled{background:rgba(244,238,226,.86);backdrop-filter:blur(12px) saturate(1.2);box-shadow:0 1px 0 var(--line-soft)}
/* light treatment when overlaying a dark/photo hero (top of page, not scrolled) */
.site-header.header-overlay::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,24,34,.42),transparent);transition:opacity .3s var(--ease)}
.site-header.header-overlay.scrolled::before{opacity:0}
.site-header.header-overlay:not(.scrolled) .brand img{filter:brightness(0) invert(1)}
.site-header.header-overlay:not(.scrolled) .brand b{color:#fff}
.site-header.header-overlay:not(.scrolled) .nav a{color:#EAF1F3}
.site-header.header-overlay:not(.scrolled) .nav a:hover{color:#fff;background:rgba(255,255,255,.12)}
.site-header.header-overlay:not(.scrolled) .nav a[aria-current="page"]{color:#F2C078}
.site-header.header-overlay:not(.scrolled) .header-phone{color:#fff}
.site-header.header-overlay:not(.scrolled) .header-phone svg{color:#F2C078}
.site-header.header-overlay:not(.scrolled) .burger{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3)}
.site-header.header-overlay:not(.scrolled) .burger span{background:#fff}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;width:100%}
.brand{display:flex;align-items:center;gap:.7rem;flex-shrink:0}
.brand img{height:42px;width:auto}
.brand b{font-family:var(--font-display);font-weight:700;font-size:1.12rem;color:var(--harbour);line-height:1;letter-spacing:-.01em}
.brand span{display:block;font-family:var(--font-mono);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--water);margin-top:3px}
.nav{display:flex;align-items:center;gap:.2rem}
.nav a{
  font-size:.93rem;font-weight:500;color:var(--ink);padding:.5rem .8rem;border-radius:8px;position:relative;
}
.nav a:hover{color:var(--harbour);background:rgba(16,46,64,.05)}
.nav a[aria-current="page"]{color:var(--sun-deep)}
.nav a[aria-current="page"]::after{content:"";position:absolute;left:.8rem;right:.8rem;bottom:.25rem;height:2px;background:var(--sun);border-radius:2px}
.header-cta{display:flex;align-items:center;gap:.7rem}
.header-phone{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--font-mono);font-weight:600;font-size:.92rem;color:var(--harbour)}
.header-phone svg{width:1.05em;height:1.05em;color:var(--water)}

/* nav dropdown */
.has-sub{position:relative}
.submenu{
  position:absolute;top:calc(100% + 6px);left:0;min-width:230px;background:var(--paper);
  border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:.5rem;
  display:grid;gap:1px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.22s var(--ease);
}
.has-sub:hover .submenu,.has-sub:focus-within .submenu{opacity:1;visibility:visible;transform:translateY(0)}
.submenu a{padding:.6rem .8rem;border-radius:9px;font-size:.9rem}
.submenu a small{display:block;color:var(--ink-soft);font-size:.76rem;font-weight:400}

/* burger + mobile drawer */
.burger{display:none;width:46px;height:46px;border:1px solid var(--line);border-radius:11px;background:var(--paper);position:relative}
.burger span{position:absolute;left:12px;right:12px;height:2px;background:var(--harbour);transition:.3s var(--ease)}
.burger span:nth-child(1){top:16px}.burger span:nth-child(2){top:22px}.burger span:nth-child(3){top:28px}
.drawer{
  position:fixed;inset:0;z-index:200;background:var(--harbour);color:var(--foam);
  display:flex;flex-direction:column;padding:calc(var(--nav-h) + 16px) var(--gutter) 40px;
  transform:translateX(100%);transition:transform .4s var(--ease);overflow-y:auto;
}
.drawer.open{transform:translateX(0)}
.drawer a{color:var(--foam);font-family:var(--font-display);font-size:1.5rem;font-weight:600;padding:.6rem 0;border-bottom:1px solid rgba(255,255,255,.1)}
.drawer .drawer-foot{margin-top:auto;padding-top:24px}
.drawer-close{position:fixed;top:18px;right:var(--gutter);z-index:201;width:46px;height:46px;border:1px solid rgba(255,255,255,.2);border-radius:11px;background:transparent;color:var(--foam);font-size:1.4rem}

/* ---- cards ---- */
.card{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);
  position:relative;overflow:hidden;transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.card--hover:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:rgba(16,46,64,.2)}
.card__media{aspect-ratio:4/3;overflow:hidden;background:var(--sand-2)}
.card__media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.card--hover:hover .card__media img{transform:scale(1.05)}
.card__body{padding:1.4rem 1.5rem 1.6rem}
.card__body h3{color:var(--harbour)}
.card__body p{margin-top:.5rem;font-size:.97rem}
.hairline{height:1px;background:var(--line);border:none;margin:1rem 0}

/* spec readout (marine instrument) */
.spec{display:flex;flex-wrap:wrap;gap:.4rem .5rem;margin-top:1rem}
.spec span{
  font-family:var(--font-mono);font-size:.78rem;font-weight:500;color:var(--harbour);
  background:rgba(21,94,102,.08);border:1px solid rgba(21,94,102,.18);
  padding:.32em .7em;border-radius:7px;font-variant-numeric:tabular-nums;
}
.spec span b{color:var(--water);font-weight:600}
.price-row{display:flex;flex-wrap:wrap;gap:1.2rem;align-items:baseline;margin-top:1.1rem}
.price{font-family:var(--font-mono);font-weight:600;color:var(--harbour);font-size:1.05rem;font-variant-numeric:tabular-nums}
.price small{display:block;font-family:var(--font-body);font-weight:500;color:var(--ink-soft);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:2px}

/* grids */
.grid{display:grid;gap:1.4rem}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}

/* stat strip */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--paper)}
.stat{padding:1.6rem 1.4rem;border-right:1px solid var(--line)}
.stat:last-child{border-right:none}
.stat b{display:block;font-family:var(--font-display);font-weight:700;font-size:clamp(2rem,3.4vw,2.9rem);color:var(--harbour);line-height:1;font-variant-numeric:tabular-nums}
.stat span{display:block;margin-top:.5rem;font-size:.86rem;color:var(--ink-soft)}

/* feature list with check */
.checks{display:grid;gap:.7rem;margin-top:1.2rem}
.checks li{display:flex;gap:.7rem;align-items:flex-start;color:var(--ink-soft);font-size:.98rem}
.checks li::before{content:"";flex-shrink:0;margin-top:.15em;width:1.15em;height:1.15em;border-radius:50%;
  background:var(--water);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/72% no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/72% no-repeat}

/* ---- forms ---- */
.field{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1.1rem}
.field label{font-weight:600;font-size:.9rem;color:var(--harbour)}
.field label .req{color:var(--cedar)}
.field input,.field select,.field textarea{
  font-family:inherit;font-size:1rem;color:var(--ink);background:var(--sand);
  border:1px solid var(--line);border-radius:10px;padding:.8rem .9rem;min-height:48px;transition:border-color .2s,box-shadow .2s;
}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--water);box-shadow:0 0 0 3px rgba(21,94,102,.14)}
.field textarea{min-height:130px;resize:vertical}
.field small{color:var(--ink-soft);font-size:.8rem}
.form-note{font-size:.84rem;color:var(--ink-soft);margin-top:.4rem}

/* ---- footer ---- */
.site-footer{background:var(--harbour-2);color:#9FB4BC;padding-block:clamp(56px,7vw,88px) 30px}
.site-footer a{color:#C6D5DA}
.site-footer a:hover{color:var(--sun)}
.footer-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:2.5rem}
.footer-brand img{height:46px;margin-bottom:1rem;filter:brightness(0) invert(1);opacity:.95}
.footer-brand p{color:#8DA4AD;font-size:.92rem;max-width:34ch}
.footer-col h4{color:var(--foam);font-size:.8rem;text-transform:uppercase;letter-spacing:.14em;margin-bottom:1rem;font-family:var(--font-mono);font-weight:600}
.footer-col ul{display:grid;gap:.6rem}
.footer-col a{font-size:.94rem}
.footer-nap{font-style:normal;display:grid;gap:.7rem;font-size:.94rem;color:#B7C8CE}
.footer-nap a{display:inline-flex;gap:.5rem;align-items:center}
.footer-nap svg{width:1.05em;height:1.05em;color:var(--sun);flex-shrink:0;margin-top:.15em}
.footer-bottom{margin-top:3rem;padding-top:1.6rem;border-top:1px solid rgba(255,255,255,.1);display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;font-size:.82rem;color:#7E959E}
.footer-social{display:flex;gap:.7rem}
.footer-social a{width:40px;height:40px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.16);border-radius:10px;color:#C6D5DA}
.footer-social a:hover{background:var(--water);border-color:var(--water);color:#fff}
.footer-social svg{width:1.15em;height:1.15em}

/* ---- NAP / contact bar (the #1 fix) ---- */
.napbar{background:var(--harbour);color:var(--foam);border-radius:var(--radius-lg);padding:clamp(1.4rem,3vw,2.2rem);box-shadow:var(--shadow);}
.napbar-grid{display:grid;grid-template-columns:repeat(3,1fr) auto;gap:1.6rem;align-items:center}
.napbar-item{display:flex;gap:.85rem;align-items:flex-start}
.napbar-item .ic{flex-shrink:0;width:42px;height:42px;border-radius:11px;background:rgba(226,145,47,.16);display:grid;place-items:center;color:var(--sun)}
.napbar-item .ic svg{width:1.3em;height:1.3em}
.napbar-item .lbl{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:#8FB7C0}
.napbar-item .val{font-weight:600;color:var(--foam);font-size:1.02rem;line-height:1.3}
.napbar-item .val a{color:var(--foam)}
.napbar-item .val a:hover{color:var(--sun)}

/* ---- breadcrumb ---- */
.crumbs{font-size:.82rem;font-family:var(--font-mono);color:var(--ink-soft);display:flex;gap:.5rem;flex-wrap:wrap;padding-top:.5rem}
.crumbs a{color:var(--water)}
.crumbs span{opacity:.5}

/* ---- quick answer (AEO) ---- */
.quick-answer{background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--sun);border-radius:var(--radius);padding:1.4rem 1.6rem;box-shadow:var(--shadow-sm)}
.quick-answer .q-label{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--sun-deep);font-weight:600}
.quick-answer p{margin-top:.5rem;color:var(--ink);font-size:1.04rem}

/* ---- key facts table ---- */
.facts-table{width:100%;border-collapse:collapse;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;font-size:.95rem}
.facts-table caption{text-align:left;font-family:var(--font-mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);padding:0 0 .6rem}
.facts-table th,.facts-table td{padding:.85rem 1.1rem;text-align:left;border-bottom:1px solid var(--line-soft)}
.facts-table thead th{background:rgba(16,46,64,.04);font-family:var(--font-mono);font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:var(--harbour)}
.facts-table tbody tr:last-child td{border-bottom:none}
.facts-table td:not(:first-child){font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--harbour)}
.facts-table tbody tr:hover{background:rgba(21,94,102,.04)}

/* ---- FAQ accordion ---- */
.faq-item{border-bottom:1px solid var(--line)}
.faq-item summary{list-style:none;cursor:pointer;padding:1.25rem 0;display:flex;justify-content:space-between;gap:1rem;align-items:center;font-family:var(--font-display);font-weight:600;font-size:1.12rem;color:var(--harbour)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"";width:1.3em;height:1.3em;flex-shrink:0;background:var(--water);transition:transform .3s var(--ease);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M11 5h2v6h6v2h-6v6h-2v-6H5v-2h6z'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M11 5h2v6h6v2h-6v6h-2v-6H5v-2h6z'/%3E%3C/svg%3E") center/contain no-repeat}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item .faq-a{padding:0 0 1.3rem;color:var(--ink-soft);max-width:72ch}
.faq-item .faq-a p+p{margin-top:.7rem}

/* ---- page hero (inner) ---- */
.page-hero{position:relative;padding-top:calc(var(--nav-h) + clamp(40px,7vw,80px));padding-bottom:clamp(40px,6vw,72px);overflow:hidden}
.page-hero.has-img{color:var(--foam);background:var(--harbour)}
.page-hero.has-img::before{content:"";position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(11,34,48,.5),rgba(11,34,48,.74)),
  linear-gradient(95deg,rgba(11,34,48,.62) 0%,rgba(11,34,48,.18) 55%,transparent 80%)}
.page-hero.has-img .ph-bg{position:absolute;inset:0;z-index:-0}
.page-hero.has-img .ph-bg img{width:100%;height:100%;object-fit:cover}
.page-hero.has-img .wrap{position:relative;z-index:2}
.page-hero.has-img h1,.page-hero.has-img .lede{color:var(--foam)}
.page-hero.has-img h1{text-shadow:0 2px 26px rgba(8,24,34,.55)}
.page-hero.has-img .lede{text-shadow:0 1px 16px rgba(8,24,34,.5)}
.page-hero.has-img .lede{color:#D7E2E6}
.page-hero.has-img .crumbs{color:#B7C8CE}
.page-hero.has-img .crumbs a{color:#fff}
.page-hero.has-img .eyebrow{color:#F0B96A}
.page-hero h1{margin-top:.6rem;max-width:18ch}
.page-hero .lede{margin-top:1.1rem}

/* ---- reveal ---- */
.reveal{opacity:0;transform:translateY(26px)}
.is-in .reveal,.reveal.is-in{opacity:1;transform:none}
[data-reveal]{will-change:opacity,transform}

/* ---- misc ---- */
.tag{display:inline-flex;align-items:center;gap:.4em;font-family:var(--font-mono);font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:.35em .7em;border-radius:7px;background:rgba(168,96,47,.12);color:var(--cedar)}
.tag--season{background:rgba(21,94,102,.12);color:var(--water)}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.media-frame{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);position:relative}
.media-frame img{width:100%;height:100%;object-fit:cover}
.watermark{font-family:var(--font-display);font-weight:700;color:rgba(16,46,64,.04);font-size:clamp(5rem,16vw,15rem);line-height:.8;letter-spacing:-.03em;pointer-events:none;user-select:none}

/* ---- responsive ---- */
@media (max-width:1000px){
  .footer-top{grid-template-columns:1fr 1fr}
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .napbar-grid{grid-template-columns:1fr 1fr;gap:1.3rem}
}
@media (max-width:820px){
  .nav,.header-phone{display:none}
  .burger{display:block}
  .split{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr 1fr}
  .stats{grid-template-columns:1fr 1fr}
  .stat:nth-child(2){border-right:none}
  .stat:nth-child(1),.stat:nth-child(2){border-bottom:1px solid var(--line)}
}
@media (max-width:560px){
  body{font-size:16px}
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .napbar-grid{grid-template-columns:1fr}
  .footer-top{grid-template-columns:1fr;gap:2rem}
  .stats{grid-template-columns:1fr 1fr}
}

/* ---- reduced motion ---- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;transition-duration:.001ms !important;scroll-behavior:auto !important}
  .reveal{opacity:1 !important;transform:none !important}
}