/* =====================================================================
   911 ATTIC INSULATION — Design System
   Brand: leafy green + warm gold + charcoal, eco / premium / modern
   ===================================================================== */

:root{
  /* Brand */
  --green:        #7fb93e;
  --green-600:    #6aa32f;
  --green-700:    #567f26;
  --green-300:    #a9d872;
  --green-050:    #f0f7e6;
  --gold:         #f0a83a;
  --gold-600:     #e0912a;
  --charcoal:     #3b352e;
  --ink:          #2a2721;
  --ink-soft:     #5c574e;
  --cream:        #faf9f4;
  --cream-2:      #f3f1e8;
  --white:        #ffffff;
  --deep:         #16261a;   /* dark green sections */
  --deep-2:       #0f1c12;

  /* Semantic */
  --bg:           var(--cream);
  --surface:      var(--white);
  --text:         var(--ink);
  --muted:        var(--ink-soft);
  --brand:        var(--green);
  --brand-ink:    var(--green-700);

  /* Type */
  --font-head: "Sora","Poppins",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-body: "Manrope","Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;

  /* Rhythm */
  --container: 1200px;
  --radius: 18px;
  --radius-lg: 28px;
  --shadow-sm: 0 2px 10px rgba(23,38,26,.06);
  --shadow:    0 14px 40px rgba(23,38,26,.10);
  --shadow-lg: 0 30px 70px rgba(23,38,26,.18);
  --ring: 0 0 0 4px rgba(127,185,62,.25);
  --ease: cubic-bezier(.22,.61,.36,1);

  --header-h: 84px;
}

/* base font scale controlled by accessibility widget */
html{ font-size: calc(100% * var(--a11y-scale, 1)); scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

*,*::before,*::after{ box-sizing:border-box; }
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--font-body);
  font-size:1.02rem; line-height:1.7; letter-spacing:.005em;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
h1,h2,h3,h4{ font-family:var(--font-head); color:var(--ink); line-height:1.1; font-weight:700; margin:0 0 .5em; letter-spacing:-.02em; }
h1{ font-size:clamp(2.3rem,5.2vw,4.2rem); font-weight:800; }
h2{ font-size:clamp(1.8rem,3.6vw,2.9rem); }
h3{ font-size:clamp(1.2rem,2vw,1.5rem); }
p{ margin:0 0 1em; color:var(--ink-soft); }
a{ color:var(--brand-ink); text-decoration:none; transition:color .2s; }
a:hover{ color:var(--green-600); }
img{ max-width:100%; display:block; }
ul{ margin:0; padding:0; }
strong{ color:var(--ink); }
:focus-visible{ outline:3px solid var(--green); outline-offset:2px; border-radius:6px; }

.container{ width:min(var(--container),92vw); margin-inline:auto; }
.section{ padding:clamp(56px,8vw,120px) 0; position:relative; }
.section--tight{ padding:clamp(40px,5vw,72px) 0; }
.center{ text-align:center; }
.lead{ font-size:1.18rem; color:var(--ink-soft); max-width:62ch; }
.center .lead{ margin-inline:auto; }

/* eyebrow / kicker */
.kicker{
  display:inline-flex; align-items:center; gap:.5em;
  font-family:var(--font-head); font-weight:700; font-size:.82rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--green-700);
  background:var(--green-050); border:1px solid rgba(127,185,62,.3);
  padding:.45em 1em; border-radius:999px; margin-bottom:1.1rem;
}
.kicker::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 0 4px rgba(127,185,62,.2); }

.grad-text{ background:linear-gradient(100deg,var(--green-600),var(--gold)); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* ---------- Buttons ---------- */
.btn{
  --_bg:var(--green); --_fg:#fff;
  display:inline-flex; align-items:center; gap:.6em; cursor:pointer;
  font-family:var(--font-head); font-weight:700; font-size:1rem;
  padding:.9em 1.6em; border-radius:999px; border:2px solid transparent;
  background:var(--_bg); color:var(--_fg); position:relative; overflow:hidden;
  transition:transform .25s var(--ease), box-shadow .25s, background .25s;
  box-shadow:0 10px 24px rgba(127,185,62,.28);
}
.btn:hover{ transform:translateY(-3px); box-shadow:0 18px 36px rgba(127,185,62,.4); color:#fff; }
.btn:active{ transform:translateY(-1px); }
.btn--gold{ --_bg:var(--gold); box-shadow:0 10px 24px rgba(240,168,58,.32); }
.btn--gold:hover{ box-shadow:0 18px 36px rgba(240,168,58,.45); }
.btn--ghost{ --_bg:transparent; --_fg:var(--ink); border-color:rgba(59,53,46,.22); box-shadow:none; }
.btn--ghost:hover{ background:var(--ink); --_fg:#fff; box-shadow:var(--shadow); }
.btn--light{ --_bg:#fff; --_fg:var(--green-700); box-shadow:var(--shadow); }
.btn--lg{ padding:1.05em 2em; font-size:1.08rem; }
.btn__shine{ position:absolute; inset:0; background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%); transform:translateX(-120%); }
.btn:hover .btn__shine{ transform:translateX(120%); transition:transform .8s var(--ease); }

/* ---------- Header ---------- */
.site-header{
  position:fixed; inset:0 0 auto 0; height:var(--header-h); z-index:1000;
  display:flex; align-items:center;
  transition:background .35s, box-shadow .35s, height .35s, backdrop-filter .35s;
}
.site-header .container{ display:flex; align-items:center; gap:1.5rem; width:min(var(--container),94vw); }
.site-header.scrolled{ height:70px; background:rgba(255,255,255,.86); backdrop-filter:blur(14px) saturate(1.3); box-shadow:0 6px 24px rgba(23,38,26,.09); }
.brand{ display:flex; align-items:baseline; gap:.5rem; margin-right:auto; text-decoration:none; }
.brand__num{ font-family:var(--font-head); font-weight:800; font-size:2rem; line-height:1; letter-spacing:-.03em; background:linear-gradient(115deg,var(--green) 30%,var(--gold)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.brand__name{ font-family:var(--font-head); font-weight:800; font-size:1.02rem; line-height:1.05; letter-spacing:.16em; text-transform:uppercase; color:var(--ink); }
.brand__name small{ display:block; font-size:.58rem; letter-spacing:.4em; font-weight:700; color:var(--green-600); margin-top:.15em; }
.nav{ display:flex; align-items:center; gap:.35rem; }
.nav a{
  font-family:var(--font-head); font-weight:600; font-size:.96rem; color:var(--ink);
  padding:.55em .85em; border-radius:10px; position:relative; white-space:nowrap;
}
.site-header:not(.scrolled) .nav a{ color:rgba(255,255,255,.92); }
.site-header:not(.scrolled) .header-phone{ color:#fff; }
.site-header:not(.scrolled) .header-phone svg{ fill:var(--green-300); }
.site-header:not(.scrolled) .brand__name{ color:#fff; }
.hide-sm{ display:inline-flex; }
@media(max-width:900px){ .hide-sm{ display:none !important; } }
.nav a::after{ content:""; position:absolute; left:.85em; right:.85em; bottom:.28em; height:2px; background:var(--green); transform:scaleX(0); transform-origin:left; transition:transform .28s var(--ease); border-radius:2px; }
.nav a:hover::after,.nav a[aria-current="page"]::after{ transform:scaleX(1); }
.nav a[aria-current="page"]{ color:var(--green-700); }
.header-cta{ display:flex; align-items:center; gap:.7rem; }
.header-phone{ display:inline-flex; align-items:center; gap:.5em; font-family:var(--font-head); font-weight:800; color:var(--ink); font-size:1rem; white-space:nowrap; }
.header-cta .btn{ padding:.7em 1.35em; font-size:.94rem; white-space:nowrap; }
.header-phone svg{ width:20px; height:20px; fill:var(--green-600); }
.nav-toggle{ display:none; width:46px; height:46px; border:0; background:var(--green-050); border-radius:12px; cursor:pointer; align-items:center; justify-content:center; }
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{ content:""; display:block; width:22px; height:2.5px; background:var(--ink); border-radius:3px; transition:.3s; position:relative; }
.nav-toggle span::before{ position:absolute; top:-7px; } .nav-toggle span::after{ position:absolute; top:7px; }
.nav-open .nav-toggle span{ background:transparent; }
.nav-open .nav-toggle span::before{ top:0; transform:rotate(45deg); }
.nav-open .nav-toggle span::after{ top:0; transform:rotate(-45deg); }

/* ---------- Hero ---------- */
.hero{ position:relative; min-height:100vh; display:flex; align-items:center; overflow:hidden; padding-top:var(--header-h); }
.hero__media{ position:absolute; inset:0; z-index:0; }
.hero__media video,.hero__media img{ width:100%; height:100%; object-fit:cover; }
.hero__media::after{ content:""; position:absolute; inset:0; background:linear-gradient(105deg,rgba(11,22,13,.82) 0%,rgba(11,22,13,.55) 42%,rgba(11,22,13,.18) 100%); }
.hero__inner{ position:relative; z-index:2; color:#fff; max-width:760px; }
.hero__inner h1{ color:#fff; text-shadow:0 4px 30px rgba(0,0,0,.35); }
.hero__inner .lead{ color:rgba(255,255,255,.9); }
.hero__cta{ display:flex; gap:1rem; flex-wrap:wrap; margin-top:2rem; }
.hero__scroll{ position:absolute; left:50%; bottom:26px; transform:translateX(-50%); z-index:3; color:#fff; font-size:.8rem; letter-spacing:.2em; text-transform:uppercase; opacity:.8; display:flex; flex-direction:column; align-items:center; gap:.5rem; }
.hero__scroll .mouse{ width:26px; height:42px; border:2px solid rgba(255,255,255,.7); border-radius:14px; position:relative; }
.hero__scroll .mouse::after{ content:""; position:absolute; left:50%; top:8px; transform:translateX(-50%); width:4px; height:8px; background:#fff; border-radius:2px; animation:wheel 1.6s infinite; }
@keyframes wheel{ 0%{opacity:1;top:8px} 70%{opacity:0;top:20px} 100%{opacity:0} }
.hero__badges{ display:flex; gap:1.4rem; flex-wrap:wrap; margin-top:2.2rem; }
.hero__badge{ display:flex; align-items:center; gap:.6rem; color:#fff; font-family:var(--font-head); font-weight:600; font-size:.95rem; }
.hero__badge b{ display:block; font-size:1.5rem; color:var(--green-300); line-height:1; }

/* ---------- Intro overlay (video entrance) ---------- */
.intro-overlay{ position:fixed; inset:0; z-index:4000; background:#0f1c12; display:flex; align-items:center; justify-content:center; }
.intro-overlay video{ width:100%; height:100%; object-fit:cover; }
.intro-skip{ position:absolute; bottom:34px; right:34px; z-index:2; background:rgba(255,255,255,.16); color:#fff; border:1px solid rgba(255,255,255,.35); backdrop-filter:blur(8px); padding:.7em 1.4em; border-radius:999px; font-family:var(--font-head); font-weight:600; cursor:pointer; letter-spacing:.03em; transition:.25s; }
.intro-skip:hover{ background:rgba(255,255,255,.28); }
.intro-overlay.hide{ opacity:0; visibility:hidden; transition:opacity .8s var(--ease),visibility .8s; }
body.intro-lock{ overflow:hidden; }

/* ---------- Special backgrounds ---------- */
.bg-mesh{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.bg-mesh .blob{ position:absolute; border-radius:50%; filter:blur(60px); opacity:.5; animation:float 18s var(--ease) infinite; }
.bg-mesh .b1{ width:520px;height:520px; background:radial-gradient(circle,#a9d872,transparent 70%); top:-120px; left:-80px; }
.bg-mesh .b2{ width:460px;height:460px; background:radial-gradient(circle,#f7cd84,transparent 70%); bottom:-140px; right:-60px; animation-delay:-6s; }
.bg-mesh .b3{ width:380px;height:380px; background:radial-gradient(circle,#bfe39a,transparent 70%); top:40%; left:55%; animation-delay:-11s; }
@keyframes float{ 0%,100%{ transform:translate(0,0) scale(1);} 33%{ transform:translate(40px,-30px) scale(1.08);} 66%{ transform:translate(-30px,25px) scale(.95);} }
.bg-dots{ background-image:radial-gradient(rgba(127,185,62,.18) 1.4px,transparent 1.4px); background-size:26px 26px; }
.bg-deep{ background:radial-gradient(1200px 600px at 80% -10%,rgba(127,185,62,.18),transparent 60%),linear-gradient(180deg,var(--deep),var(--deep-2)); color:#eaf3ea; }
.bg-deep h1,.bg-deep h2,.bg-deep h3{ color:#fff; }
.bg-deep p{ color:rgba(230,240,228,.78); }
/* cards on dark sections keep their own light background + dark text */
.bg-deep .card h1,.bg-deep .card h2,.bg-deep .card h3,.bg-deep .card h4{ color:var(--ink); }
.bg-deep .card p{ color:var(--ink-soft); }
.bg-deep .review p{ color:var(--ink); }
.bg-cream2{ background:var(--cream-2); }
.grain::before{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.4; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E"); mix-blend-mode:overlay; }

/* section heading block */
.sec-head{ max-width:64ch; margin-bottom:3rem; }
.sec-head.center{ margin-inline:auto; }

/* ---------- Cards / services ---------- */
.grid{ display:grid; gap:1.6rem; }
.grid-3{ grid-template-columns:repeat(3,1fr); }
.grid-2{ grid-template-columns:repeat(2,1fr); }
.grid-4{ grid-template-columns:repeat(4,1fr); }
.card{ background:var(--surface); border:1px solid rgba(23,38,26,.07); border-radius:var(--radius-lg); padding:2rem; box-shadow:var(--shadow-sm); transition:transform .35s var(--ease),box-shadow .35s,border-color .35s; position:relative; overflow:hidden; }
.card:hover{ transform:translateY(-8px); box-shadow:var(--shadow-lg); border-color:rgba(127,185,62,.4); }
.card__icon{ width:62px; height:62px; border-radius:16px; display:grid; place-items:center; background:linear-gradient(135deg,var(--green-050),#fff); border:1px solid rgba(127,185,62,.3); margin-bottom:1.2rem; font-size:1.7rem; }
.card__icon svg{ width:30px; height:30px; fill:var(--green-600); }
.card h3{ margin-bottom:.5rem; }
.card__link{ font-family:var(--font-head); font-weight:700; color:var(--green-700); display:inline-flex; align-items:center; gap:.4em; margin-top:.6rem; }
.card__link::after{ content:"→"; transition:transform .25s; }
.card:hover .card__link::after{ transform:translateX(5px); }
.card--media{ padding:0; }
.card--media img{ aspect-ratio:16/11; object-fit:cover; width:100%; }
.card--media .card__body{ padding:1.6rem 1.8rem 2rem; }
.card__topbar{ position:absolute; top:0; left:0; right:0; height:5px; background:linear-gradient(90deg,var(--green),var(--gold)); transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease); }
.card:hover .card__topbar{ transform:scaleX(1); }

/* feature list with check */
.checks{ list-style:none; display:grid; gap:.7rem; }
.checks li{ position:relative; padding-left:2rem; color:var(--ink-soft); }
.checks li::before{ content:""; position:absolute; left:0; top:.28em; width:20px; height:20px; border-radius:50%; background:var(--green-050); border:1px solid rgba(127,185,62,.4);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236aa32f'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E"); background-size:15px; background-repeat:no-repeat; background-position:center; }

/* ---------- Stats / counters ---------- */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; }
.stat{ text-align:center; padding:1.6rem 1rem; border-radius:var(--radius); }
.stat b{ font-family:var(--font-head); font-weight:800; font-size:clamp(2.2rem,4vw,3.4rem); line-height:1; background:linear-gradient(120deg,var(--green-600),var(--gold)); -webkit-background-clip:text; background-clip:text; color:transparent; display:block; }
.stat span{ display:block; margin-top:.5rem; font-weight:600; color:var(--muted); font-size:.98rem; }
.bg-deep .stat span{ color:rgba(230,240,228,.8); }

/* ---------- Split / feature rows ---------- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.split__media{ position:relative; }
.split__media img{ border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); width:100%; aspect-ratio:4/3; object-fit:cover; }
.split__media .float-badge{ position:absolute; bottom:-24px; left:-24px; background:#fff; border-radius:var(--radius); padding:1rem 1.3rem; box-shadow:var(--shadow); display:flex; align-items:center; gap:.8rem; font-family:var(--font-head); }
.float-badge b{ font-size:1.8rem; color:var(--green-600); line-height:1; }

/* ---------- Gallery ---------- */
.gallery{ columns:3; column-gap:1.1rem; }
.gallery figure{ margin:0 0 1.1rem; break-inside:avoid; border-radius:var(--radius); overflow:hidden; position:relative; cursor:pointer; box-shadow:var(--shadow-sm); }
.gallery img{ width:100%; transition:transform .6s var(--ease); }
.gallery figure::after{ content:"⤢"; position:absolute; inset:0; display:grid; place-items:center; font-size:1.6rem; color:#fff; background:rgba(15,28,18,.45); opacity:0; transition:opacity .3s; }
.gallery figure:hover img{ transform:scale(1.08); }
.gallery figure:hover::after{ opacity:1; }
/* lightbox */
.lightbox{ position:fixed; inset:0; z-index:3000; background:rgba(10,18,12,.92); display:none; align-items:center; justify-content:center; padding:4vw; }
.lightbox.open{ display:flex; }
.lightbox img{ max-width:92vw; max-height:88vh; border-radius:12px; box-shadow:var(--shadow-lg); }
.lightbox__close,.lightbox__nav{ position:absolute; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.3); color:#fff; width:52px; height:52px; border-radius:50%; font-size:1.4rem; cursor:pointer; display:grid; place-items:center; transition:.25s; }
.lightbox__close:hover,.lightbox__nav:hover{ background:rgba(255,255,255,.28); }
.lightbox__close{ top:24px; right:24px; }
.lightbox__nav{ top:50%; transform:translateY(-50%); }
.lightbox__nav.prev{ left:24px; } .lightbox__nav.next{ right:24px; }

/* ---------- Reviews ---------- */
.reviews-track{ display:flex; gap:1.4rem; overflow-x:auto; scroll-snap-type:x mandatory; padding:1rem .2rem 2rem; scrollbar-width:none; }
.reviews-track::-webkit-scrollbar{ display:none; }
.review{ scroll-snap-align:start; flex:0 0 min(420px,85vw); background:#fff; border-radius:var(--radius-lg); padding:2rem; box-shadow:var(--shadow-sm); border:1px solid rgba(23,38,26,.06); display:flex; flex-direction:column; gap:1rem; }
.review .stars{ color:var(--gold); font-size:1.1rem; letter-spacing:.1em; }
.review p{ color:var(--ink); font-size:1.05rem; margin:0; }
.review__who{ display:flex; align-items:center; gap:.8rem; margin-top:auto; }
.review__avatar{ width:46px; height:46px; border-radius:50%; background:linear-gradient(135deg,var(--green),var(--green-700)); color:#fff; display:grid; place-items:center; font-family:var(--font-head); font-weight:700; }
.review__who b{ display:block; font-family:var(--font-head); }
.review__who span{ font-size:.86rem; color:var(--muted); }

/* ---------- FAQ accordion ---------- */
.faq{ max-width:840px; margin-inline:auto; display:grid; gap:1rem; }
.faq__item{ background:#fff; border:1px solid rgba(23,38,26,.08); border-radius:var(--radius); overflow:hidden; transition:box-shadow .3s,border-color .3s; }
.faq__item.open{ box-shadow:var(--shadow); border-color:rgba(127,185,62,.4); }
.faq__q{ width:100%; text-align:left; background:none; border:0; cursor:pointer; padding:1.3rem 1.5rem; font-family:var(--font-head); font-weight:700; font-size:1.08rem; color:var(--ink); display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.faq__q .plus{ flex:0 0 auto; width:26px; height:26px; position:relative; }
.faq__q .plus::before,.faq__q .plus::after{ content:""; position:absolute; inset:0; margin:auto; background:var(--green-600); border-radius:2px; transition:transform .3s; }
.faq__q .plus::before{ width:16px; height:2.5px; } .faq__q .plus::after{ width:2.5px; height:16px; }
.faq__item.open .plus::after{ transform:rotate(90deg); opacity:0; }
.faq__a{ max-height:0; overflow:hidden; transition:max-height .4s var(--ease); }
.faq__a > div{ padding:0 1.5rem 1.4rem; color:var(--ink-soft); }

/* ---------- CTA band ---------- */
.cta-band{ position:relative; overflow:hidden; border-radius:var(--radius-lg); padding:clamp(2.5rem,6vw,4.5rem); background:linear-gradient(120deg,var(--green-700),var(--green-600)); color:#fff; text-align:center; box-shadow:var(--shadow-lg); }
.cta-band h2{ color:#fff; } .cta-band p{ color:rgba(255,255,255,.9); }
.cta-band .btn--light{ margin-top:1.4rem; }

/* ---------- Contact ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:2.5rem; }
.info-list{ list-style:none; display:grid; gap:1.2rem; }
.info-list li{ display:flex; gap:1rem; align-items:flex-start; }
.info-list .ico{ flex:0 0 auto; width:48px; height:48px; border-radius:14px; background:var(--green-050); display:grid; place-items:center; }
.info-list .ico svg{ width:22px; height:22px; fill:var(--green-600); }
.info-list b{ font-family:var(--font-head); display:block; }
.form{ background:#fff; border-radius:var(--radius-lg); padding:2rem; box-shadow:var(--shadow); border:1px solid rgba(23,38,26,.06); }
.field{ margin-bottom:1.1rem; }
.field label{ font-family:var(--font-head); font-weight:600; font-size:.92rem; display:block; margin-bottom:.4rem; }
.field input,.field textarea,.field select{ width:100%; padding:.85em 1em; border:1.5px solid rgba(23,38,26,.14); border-radius:12px; font:inherit; background:var(--cream); transition:border-color .2s,box-shadow .2s; }
.field input:focus,.field textarea:focus,.field select:focus{ outline:none; border-color:var(--green); box-shadow:var(--ring); background:#fff; }

/* ---------- Footer ---------- */
.site-footer{ background:linear-gradient(180deg,var(--deep),var(--deep-2)); color:#cfe0cd; padding:clamp(48px,6vw,84px) 0 2rem; position:relative; }
.footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:2.5rem; }
.site-footer h4{ color:#fff; font-size:1.05rem; margin-bottom:1.1rem; }
.site-footer a{ color:#bcd4b8; } .site-footer a:hover{ color:var(--green-300); }
.footer-links{ list-style:none; display:grid; gap:.6rem; }
.footer-brand{ display:flex; align-items:baseline; gap:.55rem; margin-bottom:1rem; }
.site-footer .brand__name{ color:#fff; }
.site-footer .brand__name small{ color:var(--green-300); }
.socials{ display:flex; gap:.7rem; margin-top:1.1rem; }
.socials a{ width:42px; height:42px; border-radius:12px; background:rgba(255,255,255,.08); display:grid; place-items:center; transition:.25s; }
.socials a:hover{ background:var(--green-600); transform:translateY(-3px); }
.socials svg{ width:20px; height:20px; fill:#fff; }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.12); margin-top:3rem; padding-top:1.5rem; display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:.88rem; color:#8fb08a; }

/* ---------- Floating widgets ---------- */
/* WhatsApp widget — original floating circle + chat popup */
.wa-float{ position:fixed; right:22px; bottom:22px; z-index:1500; }
.wa-float__btn{ width:62px; height:62px; border-radius:50%; background:#25d366; box-shadow:0 12px 30px rgba(37,211,102,.5); display:grid; place-items:center; cursor:pointer; border:0; transition:transform .3s; animation:wa-pulse 2.6s infinite; }
.wa-float__btn:hover{ transform:scale(1.08); }
.wa-float__btn svg{ width:34px; height:34px; fill:#fff; }
@keyframes wa-pulse{ 0%{ box-shadow:0 12px 30px rgba(37,211,102,.5),0 0 0 0 rgba(37,211,102,.5);} 70%{ box-shadow:0 12px 30px rgba(37,211,102,.5),0 0 0 16px rgba(37,211,102,0);} 100%{ box-shadow:0 12px 30px rgba(37,211,102,.5),0 0 0 0 rgba(37,211,102,0);} }
.wa-float__pop{ position:absolute; bottom:76px; right:0; width:290px; background:#fff; border-radius:18px; box-shadow:var(--shadow-lg); overflow:hidden; transform:translateY(12px) scale(.96); opacity:0; visibility:hidden; transition:.28s var(--ease); }
.wa-float.open .wa-float__pop{ transform:translateY(0) scale(1); opacity:1; visibility:visible; }
.wa-float__pop header{ background:#075e54; color:#fff; padding:1rem 1.1rem; display:flex; align-items:center; gap:.7rem; font-family:var(--font-head); }
.wa-float__pop .body{ padding:1.1rem; background:#e5ddd5; }
.wa-float__pop .bubble{ background:#fff; border-radius:0 12px 12px 12px; padding:.8rem 1rem; font-size:.92rem; color:#333; box-shadow:0 1px 2px rgba(0,0,0,.12); }
.wa-float__pop .wa-go{ display:block; margin:1rem; text-align:center; background:#25d366; color:#fff; font-family:var(--font-head); font-weight:700; padding:.8em; border-radius:12px; }

/* Accessibility widget */
.a11y-btn{ position:fixed; left:14px; top:58%; transform:translateY(-50%); z-index:2147483000; width:54px; height:54px; border-radius:50%; background:#1a4fb4; color:#fff; border:0; cursor:pointer; box-shadow:0 12px 30px rgba(26,79,180,.45); display:grid; place-items:center; transition:transform .3s; }
.a11y-btn:hover{ transform:translateY(-50%) scale(1.08) rotate(8deg); }
.a11y-btn svg{ width:32px; height:32px; fill:#fff; }
.a11y-panel{ position:fixed; left:80px; top:50%; z-index:2147483001; width:310px; max-width:calc(100vw - 96px); max-height:88vh; overflow:auto; background:#fff; border-radius:18px; box-shadow:var(--shadow-lg); padding:1.2rem; transform:translateY(-50%) translateX(12px); opacity:0; visibility:hidden; transition:.28s var(--ease); border:1px solid rgba(0,0,0,.08); }
.a11y-panel.open{ transform:translateY(-50%) translateX(0); opacity:1; visibility:visible; }
.a11y-panel h3{ font-size:1.1rem; margin-bottom:.9rem; display:flex; align-items:center; gap:.5rem; }
.a11y-grid{ display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
.a11y-opt{ border:1.5px solid rgba(0,0,0,.12); background:var(--cream); border-radius:12px; padding:.7rem .5rem; font-family:var(--font-head); font-weight:600; font-size:.82rem; cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:.35rem; text-align:center; transition:.2s; color:var(--ink); }
.a11y-opt:hover{ border-color:#1a4fb4; }
.a11y-opt.active{ background:#1a4fb4; color:#fff; border-color:#1a4fb4; }
.a11y-opt svg{ width:22px; height:22px; fill:currentColor; }
.a11y-reset{ width:100%; margin-top:.8rem; background:#eee; border:0; padding:.7em; border-radius:12px; font-family:var(--font-head); font-weight:700; cursor:pointer; color:#333; }
.a11y-reset:hover{ background:#e0e0e0; }

/* Accessibility body states */
body.a11y-contrast{ --bg:#000; --surface:#000; --text:#fff; --ink:#fff; --ink-soft:#ffe; --cream:#000; --cream-2:#111; background:#000 !important; }
body.a11y-contrast .card,body.a11y-contrast .form,body.a11y-contrast .review,body.a11y-contrast .faq__item{ background:#000 !important; border-color:#ff0 !important; }
body.a11y-contrast h1,body.a11y-contrast h2,body.a11y-contrast h3,body.a11y-contrast h4,body.a11y-contrast p,body.a11y-contrast a,body.a11y-contrast li{ color:#fff !important; }
body.a11y-contrast .grad-text,body.a11y-contrast .stat b{ -webkit-text-fill-color:#ff0; color:#ff0 !important; }
body.a11y-grayscale{ filter:grayscale(1); }
body.a11y-links a{ text-decoration:underline !important; text-underline-offset:3px; box-shadow:inset 0 -.6em 0 rgba(240,168,58,.35); }
body.a11y-readable *{ font-family:Verdana,Tahoma,Arial,sans-serif !important; letter-spacing:.02em !important; }
body.a11y-bigcursor,body.a11y-bigcursor *{ cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' stroke='%23fff' stroke-width='1' d='M4 2l16 8-7 2-2 7z'/%3E%3C/svg%3E") 4 4, auto !important; }

/* ---------- Animated stat showcase ---------- */
.stats2{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; }
.stat2{ position:relative; overflow:hidden; text-align:center; padding:2.1rem 1.2rem 1.8rem; border-radius:28px 14px 28px 14px; background:linear-gradient(160deg,#ffffff,#f4f3ea); border:1px solid rgba(127,185,62,.2); box-shadow:0 16px 40px rgba(23,38,26,.08); transition:transform .4s var(--ease), box-shadow .4s; }
.stat2:hover{ transform:translateY(-8px); box-shadow:0 28px 60px rgba(23,38,26,.16); }
.stat2::after{ content:""; position:absolute; top:0; left:-80%; width:55%; height:100%; background:linear-gradient(105deg,transparent,rgba(255,255,255,.75),transparent); transform:skewX(-20deg); animation:stat-shine 5s var(--ease) infinite; pointer-events:none; }
.stat2:nth-child(2)::after{ animation-delay:1.2s; }
.stat2:nth-child(3)::after{ animation-delay:2.4s; }
.stat2:nth-child(4)::after{ animation-delay:3.6s; }
@keyframes stat-shine{ 0%,55%{ left:-80%; } 100%{ left:135%; } }
.stat2__icon{ position:relative; width:84px; height:84px; margin:0 auto 1rem; display:grid; place-items:center; font-size:2.5rem; border-radius:50%; background:radial-gradient(circle at 35% 30%,#ffffff,var(--green-050)); box-shadow:inset 0 0 0 2px rgba(127,185,62,.28), 0 12px 26px rgba(127,185,62,.3); animation:stat-bob 3.4s ease-in-out infinite; }
.stat2:nth-child(2) .stat2__icon{ animation-delay:.4s; }
.stat2:nth-child(3) .stat2__icon{ animation-delay:.8s; }
.stat2:nth-child(4) .stat2__icon{ animation-delay:1.2s; }
@keyframes stat-bob{ 0%,100%{ transform:translateY(0) rotate(0deg); } 50%{ transform:translateY(-8px) rotate(3deg); } }
.stat2__icon::before,.stat2__icon::after{ content:"✦"; position:absolute; color:var(--gold); opacity:0; font-size:1rem; animation:spark 2.6s ease-in-out infinite; }
.stat2__icon::before{ top:0; right:4px; }
.stat2__icon::after{ bottom:4px; left:0; font-size:.75rem; animation-delay:1.3s; }
.stat2__icon--stars::before{ content:"⭐"; font-size:.8rem; }
.stat2__icon--money::before{ content:"🪙"; font-size:.85rem; }
@keyframes spark{ 0%,100%{ opacity:0; transform:scale(.3) rotate(0deg); } 50%{ opacity:1; transform:scale(1.2) rotate(45deg); } }
.stat2 b{ display:block; font-family:var(--font-head); font-weight:800; font-size:clamp(2rem,3.4vw,2.9rem); line-height:1; background:linear-gradient(120deg,var(--green-600),var(--gold)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.stat2 .lbl{ display:block; margin-top:.45rem; font-weight:600; color:var(--muted); }
.qa-mode .stat2::after,.qa-mode .stat2__icon,body.a11y-nomotion .stat2::after,body.a11y-nomotion .stat2__icon{ animation:none !important; }
@media (prefers-reduced-motion:reduce){ .stat2::after,.stat2__icon,.stat2__icon::before,.stat2__icon::after{ animation:none !important; } }
@media (max-width:1000px){ .stats2{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .stats2{ grid-template-columns:1fr; } }

/* ---------- Why-choose glass cards (dark section) ---------- */
.why-card{ position:relative; overflow:hidden; background:rgba(255,255,255,.07); border:1px solid rgba(127,185,62,.28); border-radius:32px 16px 32px 16px; padding:2.1rem 1.7rem; backdrop-filter:blur(8px); transition:transform .4s var(--ease), border-color .4s, background .4s; }
.why-card:hover{ transform:translateY(-9px); border-color:rgba(240,168,58,.55); background:rgba(255,255,255,.11); }
.why-card::after{ content:""; position:absolute; top:0; left:-80%; width:55%; height:100%; background:linear-gradient(105deg,transparent,rgba(255,255,255,.14),transparent); transform:skewX(-20deg); animation:stat-shine 5.5s var(--ease) infinite; pointer-events:none; }
.why-card:nth-child(2)::after{ animation-delay:1.3s; } .why-card:nth-child(3)::after{ animation-delay:2.6s; } .why-card:nth-child(4)::after{ animation-delay:3.9s; }
.why-card h3{ color:#fff; font-size:1.15rem; }
.why-card p{ color:rgba(230,240,228,.78); margin:0; }
.why-card .stat2__icon{ margin:0 0 1.1rem; width:72px; height:72px; font-size:2.1rem; background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.95),rgba(233,243,230,.85)); }
.qa-mode .why-card::after,body.a11y-nomotion .why-card::after{ animation:none !important; }

/* ---------- Estimate strip (living gradient + glows) ---------- */
.estimate-strip{ position:relative; overflow:hidden; color:#fff;
  background:linear-gradient(115deg,var(--green-700),var(--green-600),#83bd44,var(--green-700));
  background-size:280% 280%; animation:grad-move 12s ease-in-out infinite; }
@keyframes grad-move{ 0%,100%{ background-position:0% 50%; } 50%{ background-position:100% 50%; } }
.estimate-strip .glow{ position:absolute; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle,rgba(255,255,255,.22),transparent 70%); filter:blur(6px);
  animation:float 16s var(--ease) infinite; }
.estimate-strip .g1{ width:420px; height:420px; top:-190px; right:8%; }
.estimate-strip .g2{ width:300px; height:300px; bottom:-150px; left:16%; animation-delay:-7s; }
.estimate-strip .g3{ width:200px; height:200px; top:-60px; left:42%; animation-delay:-12s; background:radial-gradient(circle,rgba(240,168,58,.28),transparent 70%); }
.leaf--wh{ background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='%23ffffff' d='M24 3C37 9 44 25 24 45 4 25 11 9 24 3Z'/%3E%3Cpath stroke='%23dfeccb' stroke-width='2' fill='none' stroke-linecap='round' d='M24 10v28'/%3E%3C/svg%3E") center/contain no-repeat; opacity:.22; }
.qa-mode .estimate-strip,body.a11y-nomotion .estimate-strip{ animation:none !important; }
@media (prefers-reduced-motion:reduce){ .estimate-strip{ animation:none !important; } .estimate-strip .glow{ animation:none !important; } }

/* ---------- Floating leaves decoration (light sections) ---------- */
.leaves{ position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.leaf{ position:absolute; width:44px; height:44px; opacity:.4;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='%238fc94e' d='M24 3C37 9 44 25 24 45 4 25 11 9 24 3Z'/%3E%3Cpath stroke='%23567f26' stroke-width='2' fill='none' stroke-linecap='round' d='M24 10v28'/%3E%3C/svg%3E") center/contain no-repeat;
  animation:leaf-drift var(--dur,12s) ease-in-out var(--d,0s) infinite; }
.leaf--lt{ background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='%23c3e29b' d='M24 3C37 9 44 25 24 45 4 25 11 9 24 3Z'/%3E%3Cpath stroke='%237fb93e' stroke-width='2' fill='none' stroke-linecap='round' d='M24 10v28'/%3E%3C/svg%3E") center/contain no-repeat; opacity:.35; }
@keyframes leaf-drift{
  0%,100%{ transform:translate(0,0) rotate(-10deg); }
  25%{ transform:translate(16px,-24px) rotate(12deg); }
  50%{ transform:translate(-10px,-42px) rotate(-5deg); }
  75%{ transform:translate(12px,-18px) rotate(16deg); }
}
.qa-mode .leaf, body.a11y-nomotion .leaf{ animation:none !important; }
@media (prefers-reduced-motion:reduce){ .leaf{ animation:none !important; } }
@media (max-width:820px){ .leaf{ width:30px; height:30px; opacity:.28; } }

/* ---------- Animated house build + premium package panels ---------- */
.pkg-section{ overflow:hidden; }
.pkg-scene{ margin:0 auto .5rem; }
.house-svg{ width:min(440px,86vw); height:auto; display:block; margin-inline:auto; overflow:visible; filter:drop-shadow(0 18px 30px rgba(23,38,26,.12)); }
.house-svg .draw{ stroke-dasharray:520; stroke-dashoffset:520; }
.house-svg .pop{ opacity:0; transform-box:fill-box; transform-origin:center; }
.pkg-scene.in .h-ground{ animation:h-draw .9s var(--ease) .1s forwards; }
.pkg-scene.in .h-walls{ animation:h-draw .8s var(--ease) .55s forwards; }
.pkg-scene.in .h-roof{ animation:h-draw 1.1s var(--ease) .95s forwards; }
.pkg-scene.in .h-roof2{ animation:h-draw .9s var(--ease) 1.5s forwards; }
.pkg-scene.in .h-chimney{ animation:h-pop .5s var(--ease) 2s forwards; }
.pkg-scene.in .h-window{ animation:h-pop .55s var(--ease) 2.2s forwards; }
.pkg-scene.in .h-fluff1{ animation:h-pop .45s var(--ease) 2.45s forwards; }
.pkg-scene.in .h-fluff2{ animation:h-pop .45s var(--ease) 2.6s forwards; }
.pkg-scene.in .h-fluff3{ animation:h-pop .45s var(--ease) 2.75s forwards; }
.pkg-scene.in .h-leaf,.pkg-scene.in .h-leaf2{ animation:h-pop .6s var(--ease) 2.95s forwards; }
.pkg-scene.in .h-sun{ animation:h-pop .6s var(--ease) 3.15s forwards; }
.pkg-scene.in .h-smoke1{ animation:h-smoke 3.2s ease-out 3.4s infinite; }
.pkg-scene.in .h-smoke2{ animation:h-smoke 3.2s ease-out 4.9s infinite; }
@keyframes h-draw{ to{ stroke-dashoffset:0; } }
@keyframes h-pop{ 0%{ opacity:0; transform:scale(.2); } 70%{ opacity:1; transform:scale(1.18); } 100%{ opacity:1; transform:scale(1); } }
@keyframes h-smoke{ 0%{ opacity:0; transform:translateY(0) scale(.5); } 25%{ opacity:.8; } 100%{ opacity:0; transform:translateY(-52px) scale(1.4); } }
.qa-mode .house-svg .draw, body.a11y-nomotion .house-svg .draw{ animation:none !important; stroke-dashoffset:0 !important; }
.qa-mode .house-svg .pop, body.a11y-nomotion .house-svg .pop{ animation:none !important; opacity:1 !important; }
@media (prefers-reduced-motion:reduce){
  .house-svg .draw{ stroke-dashoffset:0; animation:none !important; }
  .house-svg .pop{ opacity:1; animation:none !important; }
  .pkg-scene.in .h-smoke1,.pkg-scene.in .h-smoke2{ animation:none !important; }
}

.pkg-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.7rem; align-items:stretch; margin-top:2.8rem; }
.pkg{ position:relative; display:flex; flex-direction:column; background:linear-gradient(165deg,#ffffff,#f6f6ec); border:1px solid rgba(127,185,62,.2); border-radius:48px 22px 48px 22px; padding:2.6rem 2.1rem 2.2rem; box-shadow:0 24px 55px rgba(23,38,26,.10); overflow:hidden; transition:transform .45s var(--ease), box-shadow .45s; }
.pkg::after{ content:""; position:absolute; right:-46px; bottom:-46px; width:170px; height:170px; border-radius:50%; background:radial-gradient(circle,rgba(127,185,62,.16),transparent 70%); pointer-events:none; }
.pkg:hover{ transform:translateY(-12px); box-shadow:0 38px 80px rgba(23,38,26,.18); }
.pkg__num{ position:absolute; top:.9rem; right:1.3rem; font-family:var(--font-head); font-weight:800; font-size:4.2rem; line-height:1; color:transparent; -webkit-text-stroke:2px rgba(127,185,62,.28); pointer-events:none; }
.pkg__icon{ width:76px; height:76px; border-radius:28px 12px 28px 12px; display:grid; place-items:center; font-size:2.1rem; background:linear-gradient(135deg,var(--green),var(--green-700)); box-shadow:0 12px 28px rgba(127,185,62,.45); transform:rotate(-5deg); margin-bottom:1.2rem; transition:transform .4s var(--ease); }
.pkg:hover .pkg__icon{ transform:rotate(0deg) scale(1.07); }
.pkg__flag{ display:inline-flex; align-items:center; gap:.4em; align-self:flex-start; background:linear-gradient(120deg,var(--gold),var(--gold-600)); color:#fff; font-family:var(--font-head); font-weight:700; font-size:.78rem; letter-spacing:.07em; text-transform:uppercase; padding:.5em 1.1em; border-radius:999px; box-shadow:0 8px 18px rgba(240,168,58,.4); margin-bottom:1rem; }
.pkg h3{ font-size:1.32rem; }
.pkg p{ flex:1; }
.pkg .checks{ margin:.4rem 0 1.1rem; }
.pkg__cta{ margin-top:auto; display:inline-flex; align-items:center; justify-content:center; gap:.5em; font-family:var(--font-head); font-weight:700; color:var(--green-700); background:var(--green-050); border:1.5px solid rgba(127,185,62,.35); padding:.85em 1.4em; border-radius:999px; transition:.3s; }
.pkg__cta::after{ content:"→"; transition:transform .3s; }
.pkg__cta:hover{ background:var(--green); color:#fff; }
.pkg__cta:hover::after{ transform:translateX(4px); }
.pkg--featured{ background:radial-gradient(140% 120% at 18% 0%,#26502b,#16261a 72%); border-color:rgba(127,185,62,.4); border-radius:22px 48px 22px 48px; transform:scale(1.045); z-index:2; }
.pkg--featured:hover{ transform:scale(1.045) translateY(-12px); }
.pkg--featured h3{ color:#fff; }
.pkg--featured p{ color:rgba(233,243,230,.83); }
.pkg--featured .checks li{ color:rgba(233,243,230,.85); }
.pkg--featured .pkg__num{ -webkit-text-stroke-color:rgba(240,168,58,.45); }
.pkg--featured .pkg__cta{ background:var(--gold); border-color:transparent; color:#fff; box-shadow:0 12px 26px rgba(240,168,58,.4); }
.pkg--featured .pkg__cta:hover{ background:var(--gold-600); }
@media (max-width:1000px){
  .pkg-row{ grid-template-columns:1fr; max-width:560px; margin-inline:auto; }
  .pkg--featured{ transform:none; }
  .pkg--featured:hover{ transform:translateY(-12px); }
}

/* ---------- Reveal animations ---------- */
[data-reveal]{ opacity:0; transform:translateY(34px); transition:opacity .7s var(--ease),transform .7s var(--ease); }
[data-reveal].in{ opacity:1; transform:none; }
[data-reveal="left"]{ transform:translateX(-40px); } [data-reveal="left"].in{ transform:none; }
[data-reveal="right"]{ transform:translateX(40px); } [data-reveal="right"].in{ transform:none; }
[data-reveal="zoom"]{ transform:scale(.9); } [data-reveal="zoom"].in{ transform:none; }
[data-reveal-delay]{ transition-delay:calc(var(--d,0)*1ms); }
@media (prefers-reduced-motion: reduce){ [data-reveal]{ opacity:1 !important; transform:none !important; } .bg-mesh .blob{ animation:none; } }

/* page hero (inner pages) */
.page-hero{ padding:calc(var(--header-h) + 60px) 0 60px; position:relative; overflow:hidden; text-align:center; }
.page-hero .crumbs{ font-size:.9rem; color:var(--muted); margin-top:.8rem; }
.page-hero .crumbs a{ color:var(--green-700); }

/* pill row */
.pills{ display:flex; flex-wrap:wrap; gap:.6rem; justify-content:center; }
.pill{ background:#fff; border:1px solid rgba(127,185,62,.3); color:var(--green-700); padding:.5em 1.1em; border-radius:999px; font-family:var(--font-head); font-weight:600; font-size:.9rem; box-shadow:var(--shadow-sm); }

/* marquee logos */
.marquee{ overflow:hidden; -webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.marquee__track{ display:flex; gap:3rem; align-items:center; width:max-content; animation:scrollx 28s linear infinite; }
@keyframes scrollx{ to{ transform:translateX(-50%); } }
.marquee img{ height:44px; opacity:.7; filter:grayscale(.3); }

/* utility */
.mt-1{margin-top:1rem} .mt-2{margin-top:2rem} .mb-0{margin-bottom:0}
.hide{ display:none !important; }
.qa-mode .hero{ min-height:auto !important; padding-top:150px; padding-bottom:90px; }
.qa-mode [data-reveal]{ transition:none !important; opacity:1 !important; transform:none !important; }

/* ---------- Responsive ---------- */
@media (max-width:1000px){
  .grid-3,.grid-4{ grid-template-columns:repeat(2,1fr); }
  .stats{ grid-template-columns:repeat(2,1fr); }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .gallery{ columns:2; }
}
@media (max-width:820px){
  .nav-toggle{ display:flex; }
  .nav{ position:fixed; inset:var(--header-h) 0 auto 0; flex-direction:column; align-items:stretch; background:#fff; padding:1rem 1.2rem 1.6rem; gap:.2rem; box-shadow:var(--shadow); transform:translateY(-120%); transition:transform .4s var(--ease); max-height:calc(100vh - var(--header-h)); overflow:auto; }
  .nav-open .nav{ transform:none; }
  .nav a{ font-size:1.1rem; padding:.9em .6em; border-bottom:1px solid rgba(0,0,0,.05); }
  .nav a::after{ display:none; }
  .header-phone span{ display:none; }
  .split,.contact-grid{ grid-template-columns:1fr; }
  .split__media{ order:-1; }
}
@media (max-width:600px){
  .grid-3,.grid-4,.grid-2,.stats{ grid-template-columns:1fr; }
  .gallery{ columns:1; }
  :root{ --header-h:72px; }
  .hero__cta{ flex-direction:column; align-items:stretch; }
  .btn{ justify-content:center; }
}