/* =====================================================================
   אוהל אברהם – Visual Identity v4 "Tile Wall"
   The site is the bathroom wall the visitor is afraid of losing.
   Bottle-green glazed tiles + cream tiles with light grout; the grout grid
   IS the layout grid and every block snaps to whole tiles (main.js).
   Large-format cream slabs carry the text; text never sits on grout.
   One red only for the leak tile and the urgent action. WhatsApp green.
   Typeface: Noto Sans Hebrew only. RTL, mobile first.
   ===================================================================== */

/* ============ TOKENS ============ */
:root{
  --glaze:#1e4d41;      /* bottle-green glazed tile */
  --glaze-d:#163a31;
  --grout-g:#d9d2c0;    /* light grout on the green wall */
  --bisque:#f1ebde;     /* cream glazed tile */
  --grout-c:#d4c9b3;
  --slab:#f7f3ea;       /* large-format cream tile */
  --ink:#13211c;
  --ink-2:#3b4842;
  --on-g:#f5efe2;
  --on-g-2:#cfe0d6;
  --marker:#e3372b;     /* the one red: leak tile only */
  --urgent:#bf271e;     /* ...and the urgent action */
  --err:#a3221a;        /* form error text (AA on cream) */
  --wa:#25D366; --wa-ink:#0f2a18;
  --tape:#f3e8c6;
  --focus:#13211c;
  --rule:rgba(30,77,65,.16);  /* scored line inside a slab */
  --tape-bg:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 60' preserveAspectRatio='none'%3E%3Cpath d='M8 2.5C80 1 220 .5 292 2.2L295.5 5 291.8 8.6 296.4 12 292.6 16.2 297 20.4 292.2 24.8 296 29.4 291.6 33.6 296.8 38 292.4 42.6 296.2 47 291.8 51.2 295.6 55.6 291.5 57.8C220 59.4 80 59.8 8.2 58L4.6 54.6 8.4 50.8 3.6 46.6 7.8 42.2 3.2 37.8 7.6 33.4 2.8 29 7.2 24.6 3.4 20.2 8 15.8 3.8 11.4 7.6 7.2 4.2 4.4Z' fill='%23f3e8c6' fill-opacity='.9'/%3E%3Cpath d='M296.4 12l2.8-.6M297 20.4l2.6.4M296.8 38l2.9-.3M296.2 47l2.4.7M295.6 55.6l2.2.9M292.6 16.2l1.8-.9M3.6 46.6l-2.6.5M3.2 37.8l-2.8-.4M2.8 29l-2.4.6M3.4 20.2l-2.7-.5M3.8 11.4l-2.3.8M8.4 50.8l-1.9.9' fill='none' stroke='%23e4d6a9' stroke-width='.9' stroke-linecap='round'/%3E%3Cpath d='M14 16H286' stroke='%23fff' stroke-opacity='.3' stroke-width='2.5'/%3E%3Cpath d='M14 45H286' stroke='%23d6c58f' stroke-opacity='.32' stroke-width='1.6'/%3E%3C/svg%3E") center / 100% 100% no-repeat;  /* masking tape, as a background */

  --cols:6;
  --t-raw:min(96px, calc((100vw - 32px) / 6));
  --t:var(--t-raw);
  --g:2px;
  --pad:clamp(16px, calc(var(--t) * .3), 30px);
  --fs:16px;
  --ease:cubic-bezier(.16,1,.3,1);
  --decor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Crect width='100' height='100' fill='%23efe6d2'/%3E%3Cg fill='%231e4d41'%3E%3Cpath d='M0 0h22a22 22 0 0 1-22 22z'/%3E%3Cpath d='M100 0v22a22 22 0 0 1-22-22z'/%3E%3Cpath d='M0 100v-22a22 22 0 0 1 22 22z'/%3E%3Cpath d='M100 100h-22a22 22 0 0 1 22-22z'/%3E%3Cpath d='M50 17c9 10 9 23 0 33-9-10-9-23 0-33zM50 83c-9-10-9-23 0-33 9 10 9 23 0 33zM17 50c10-9 23-9 33 0-10 9-23 9-33 0zM83 50c-10 9-23 9-33 0 10-9 23-9 33 0z'/%3E%3C/g%3E%3Cpath d='M50 7 93 50 50 93 7 50z' fill='none' stroke='%231e4d41' stroke-width='2.2'/%3E%3Ccircle cx='50' cy='50' r='6.5' fill='%23b9822a'/%3E%3C/svg%3E");
  --listello:repeating-linear-gradient(90deg, var(--glaze) 0 18px, #f6f1e6 18px 21px, #b9822a 21px 27px, #f6f1e6 27px 30px);
}
@media (min-width:768px){
  :root{ --cols:10; --t-raw:min(104px, calc((100vw - 64px) / 10)); --g:3px; --fs:16.5px; }
}
@media (min-width:1200px){
  :root{ --cols:14; --t-raw:min(92px, calc((100vw - 96px) / 14)); --fs:17px; }
}
@supports (width: round(down, 10.5px, 1px)){
  :root{ --t:round(down, var(--t-raw), 1px); }
}

/* ============ BASE ============ */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scrollbar-color:var(--glaze) #e7e0d0; scroll-padding-top:84px; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
  margin:0; background:#e7e0d0; color:var(--ink);
  font-family:"Noto Sans Hebrew", sans-serif; font-size:var(--fs); line-height:1.6;
  overflow-x:hidden; -webkit-tap-highlight-color:transparent;
}
::selection{ background:var(--glaze); color:var(--on-g); }
h1,h2,h3,p,ul,ol,figure{ margin:0; }
ul,ol{ padding:0; list-style:none; }
a{ color:inherit; text-underline-offset:.22em; text-decoration-thickness:1.5px; }
img,svg{ display:block; }
input, select, textarea, button{ caret-color:var(--glaze); }
.ltr{ direction:ltr; unicode-bidi:isolate; display:inline-block; }
.nw{ white-space:nowrap; }
.num, .mono{ font-variant-numeric:tabular-nums lining-nums; }
.vh, .sr-only{ position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
:focus-visible{ outline:3px solid var(--focus); outline-offset:3px; border-radius:3px; }
.icon{ width:1.25em; height:1.25em; flex:none; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.icon--fill, .icon--wa{ fill:currentColor; stroke:none; }
.stars .icon, .rating-card__stars .icon{ fill:currentColor; stroke:none; }
.sprite{ position:absolute; width:0; height:0; overflow:hidden; }
.tprobe{ position:absolute; visibility:hidden; pointer-events:none; top:0; left:0; width:var(--t); height:var(--g); }
.skip-link{ position:absolute; top:-60px; right:16px; z-index:100; background:var(--ink); color:#fff; padding:10px 16px; border-radius:4px; text-decoration:none; font-weight:700; }
.skip-link:focus{ top:10px; }
.text-center{ text-align:center; }
.mt-2{ margin-top:1.5rem; } .mt-3{ margin-top:2.25rem; }
.muted{ color:var(--ink-2); }
.small{ font-size:.88rem; }

/* ============ BUTTONS ============ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.55em;
  min-height:50px; padding:.7em 1.25em; border-radius:6px; border:0;
  font:inherit; font-weight:800; font-size:1.02rem; line-height:1.2; text-decoration:none; cursor:pointer;
  transition:transform .18s var(--ease), box-shadow .18s, background-color .18s;
  box-shadow:0 2px 0 rgba(0,0,0,.18), 0 6px 14px -8px rgba(0,0,0,.5);
}
.btn:hover{ transform:translateY(-1px); }
.btn:active{ transform:translateY(1px); box-shadow:0 1px 0 rgba(0,0,0,.18); }
.btn .icon{ width:1.3em; height:1.3em; }
.btn--wa{ background:var(--wa); color:var(--wa-ink); }
.btn--wa:hover{ background:#2ee070; }
.btn--call, .btn--primary{ background:var(--ink); color:#fff; }
.btn--call:hover, .btn--primary:hover{ background:#22352e; }
.btn--outline{ background:transparent; color:var(--ink); box-shadow:inset 0 0 0 2px var(--ink); }
.btn--outline:hover{ background:rgba(19,33,28,.07); }
.btn--outline-light{ background:transparent; color:var(--on-g); box-shadow:inset 0 0 0 2px rgba(245,239,226,.8); }
.btn--outline-light:hover{ background:rgba(245,239,226,.12); }
.btn--lg{ min-height:56px; font-size:1.08rem; }
.btn--block{ width:100%; }
.btn-row{ display:flex; flex-wrap:wrap; gap:10px; }

/* ============ HEADER ============ */
.hdr{ position:relative; z-index:40; background:#f6f1e6; border-bottom:1px solid #cfc4ad; }
.hdr::after{ /* thin listello under the header */
  content:""; position:absolute; inset:auto 0 -7px 0; height:6px; background:var(--listello);
}
.hdr__in{ display:flex; align-items:center; gap:8px; height:58px; padding-inline:16px; max-width:1440px; margin-inline:auto; }
.brand{ display:flex; align-items:center; gap:10px; text-decoration:none; margin-inline-end:auto; min-width:0; color:inherit; }
.brand__mark{ width:36px; height:36px; flex:none; color:var(--glaze); }
.brand__txt{ display:flex; flex-direction:column; line-height:1.1; white-space:nowrap; }
.brand__txt b{ font-weight:900; font-size:1.12rem; letter-spacing:-.01em; }
.brand__txt small{ font-size:.78rem; color:var(--ink-2); font-weight:500; }
.hdr .btn{ min-height:44px; padding:.5em .7em; font-size:.95rem; }
.hdr__wa{ display:none; }
.hdr__short{ display:none; }
.nav{ display:none; }
.menu-toggle{
  flex:none; width:44px; height:44px; display:grid; place-items:center; padding:0; cursor:pointer;
  background:#fffaf0; color:var(--ink); border:1.5px solid #c9bda4; border-radius:6px;
}
.menu-toggle .icon{ width:22px; height:22px; }
.menu-toggle:hover{ background:#efe8d8; }
@media (max-width:479px){ .hdr .brand__txt small{ display:none; } }
@media (max-width:379px){ .hdr__num{ display:none; } .hdr__short{ display:inline; } }
@media (min-width:768px){
  .hdr{ position:sticky; top:0; }
  .hdr__in{ height:68px; padding-inline:24px; gap:12px; }
  .hdr .btn{ padding:.5em .95em; }
  .hdr__wa{ display:inline-flex; }
}
@media (min-width:1200px){
  .hdr__in{ gap:14px; }
  .menu-toggle{ display:none; }
  .nav{ display:block; }
  .nav__list{ display:flex; gap:2px; }
  .nav__item{ position:relative; }
  .nav__link{ display:inline-flex; align-items:center; gap:4px; text-decoration:none; font-weight:600; font-size:.95rem; padding:.45em .62em; border-radius:4px; white-space:nowrap; }
  .nav__link:hover{ background:#e9e1cf; }
  .nav__item.is-active > .nav__link{ text-decoration:underline; text-decoration-color:var(--glaze); text-decoration-thickness:3px; text-underline-offset:.55em; font-weight:800; }
  .nav__link .icon{ width:.95em; height:.95em; transition:transform .2s var(--ease); }
  .nav__item--has-sub:hover > .nav__link .icon, .nav__item--has-sub:focus-within > .nav__link .icon{ transform:rotate(180deg); }
  .nav__sub{
    position:absolute; top:100%; right:0; min-width:250px; z-index:50; padding:6px;
    background:var(--slab); border-radius:3px;
    box-shadow:inset 0 1.5px 0 rgba(255,255,255,.9), 0 4px 6px -3px rgba(0,0,0,.2), 0 18px 30px -16px rgba(0,0,0,.45);
    opacity:0; visibility:hidden; transform:translateY(4px);
    transition:opacity .18s, transform .2s var(--ease), visibility .18s;
  }
  .nav__item--has-sub:hover .nav__sub, .nav__item--has-sub:focus-within .nav__sub{ opacity:1; visibility:visible; transform:none; }
  .nav__sub a{ display:flex; align-items:center; gap:10px; padding:.55em .7em; text-decoration:none; font-weight:600; font-size:.95rem; border-radius:2px; }
  .nav__sub a:hover{ background:#ece4d2; }
  .nav__sub a[aria-current="page"]{ font-weight:800; color:var(--glaze); }
  .nav__sub .icon{ color:var(--glaze); width:1.1em; height:1.1em; }
  .nav__sub-divider{ height:1px; background:var(--grout-c); margin:4px 8px; }
}

/* ============ MOBILE MENU ============ */
.mobile-menu{ position:fixed; inset:0; z-index:80; visibility:hidden; transition:visibility 0s .38s; }
.mobile-menu.is-open{ visibility:visible; transition-delay:0s; }
.mobile-menu__backdrop{ position:absolute; inset:0; background:rgba(16,38,31,.55); opacity:0; transition:opacity .3s; }
.mobile-menu.is-open .mobile-menu__backdrop{ opacity:1; }
.mobile-menu__panel{
  position:absolute; top:0; right:0; bottom:0; width:min(88vw, 400px); overflow-y:auto;
  display:flex; flex-direction:column; background:var(--slab); color:var(--ink);
  box-shadow:-8px 0 30px -12px rgba(0,0,0,.5);
  transform:translateX(100%); transition:transform .38s var(--ease);
}
.mobile-menu.is-open .mobile-menu__panel{ transform:none; }
.mobile-menu__head{ position:relative; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:7px 16px; min-height:58px; background:#f6f1e6; border-bottom:1px solid #cfc4ad; }
.mobile-menu__head::after{ content:""; position:absolute; inset:auto 0 -7px 0; height:6px; background:var(--listello); }
.mobile-menu__head .brand{ margin:0; }
.mobile-menu__list{ padding:14px 20px 0; }
.mobile-menu__list a{ display:block; padding:.62em 0; border-bottom:1.5px solid #e3dac7; font-weight:800; font-size:1.12rem; text-decoration:none; }
.mobile-menu__list .is-sub a{ font-weight:600; font-size:1rem; padding-inline-start:14px; }
.mobile-menu__list a:hover{ color:var(--glaze); }
.mobile-menu__group{ padding:16px 0 2px; font-size:.85rem; font-weight:800; color:var(--ink-2); }
.mobile-menu__ctas{ display:grid; gap:10px; padding:20px; margin-top:auto; }
.mobile-menu__trust{ font-size:.85rem; color:var(--ink-2); text-align:center; }
@media (prefers-reduced-motion: reduce){ .mobile-menu__panel, .mobile-menu__backdrop{ transition:none; } }

/* ============ WALL (the grout grid is the layout grid) ============ */
.wall, .section, .page-hero{
  --base:var(--bisque); --gr:var(--grout-c); --gl:.55; --sh:.06; --bev:.75; --streak:.35;
  --bx:calc(50% + var(--t) / 2);
  position:relative;
  padding-block:var(--t);
  background-color:var(--base);
  background-image:
    linear-gradient(to right, var(--gr) var(--g), transparent var(--g)),
    linear-gradient(to bottom, var(--gr) var(--g), transparent var(--g)),
    linear-gradient(to bottom, transparent var(--g), rgba(255,255,255,var(--bev)) var(--g), rgba(255,255,255,var(--bev)) calc(var(--g) + 1.5px), transparent calc(var(--g) + 1.5px)),
    linear-gradient(135deg, transparent 13%, rgba(255,255,255,var(--streak)) 13% 15.5%, transparent 15.5%),
    linear-gradient(140deg, rgba(255,255,255,var(--gl)) 0%, rgba(255,255,255,0) 34%, rgba(0,0,0,0) 62%, rgba(0,0,0,var(--sh)) 100%),
    linear-gradient(90deg, rgba(0,0,0,.05) 33.33%, transparent 33.33% 66.66%, rgba(255,255,255,.04) 66.66%),
    linear-gradient(0deg, rgba(0,0,0,.035) 20%, transparent 20% 60%, rgba(255,255,255,.03) 60% 80%, transparent 80%);
  background-size:
    var(--t) var(--t), var(--t) var(--t), var(--t) var(--t), var(--t) var(--t), var(--t) var(--t),
    calc(var(--t) * 3) var(--t), var(--t) calc(var(--t) * 5);
  background-position:var(--bx) 0;
}
.wall--g, .section--alt, .section--dark, .page-hero, .notfound{ --base:var(--glaze); --gr:var(--grout-g); --gl:.13; --sh:.16; --bev:.16; --streak:.07; color:var(--on-g); --focus:var(--on-g); }
.wall--flush{ padding-top:0; }
.band{
  height:var(--t);
  background-color:#efe6d2;
  background-image:
    linear-gradient(to right, var(--grout-c) var(--g), transparent var(--g)),
    linear-gradient(to bottom, var(--grout-c) var(--g), transparent var(--g)),
    linear-gradient(140deg, rgba(255,255,255,.4) 0%, rgba(255,255,255,0) 34%, rgba(0,0,0,0) 62%, rgba(0,0,0,.08) 100%),
    var(--decor);
  background-size:var(--t) var(--t);
  background-position:calc(50% + var(--t) / 2) 0;
}
.band + .band{ display:none; }

.tg, .nest{
  display:grid;
  grid-template-columns:repeat(var(--n), var(--t));
  grid-auto-rows:minmax(var(--t), auto);
  grid-auto-flow:row;
}
.js .tg, .js .nest{ grid-auto-rows:var(--t); }
.tg{ --n:var(--cols); width:calc(var(--n) * var(--t)); margin-inline:auto; position:relative; }
.nest{ min-width:0; }

/* slabs: large-format tiles that sit exactly on the grout lines */
.slab{
  margin:var(--g) 0 0 var(--g);
  position:relative; min-width:0;
  display:flex; flex-direction:column; justify-content:center;
  background-color:var(--slab); color:var(--ink); --focus:var(--ink);
  background-image:linear-gradient(150deg, rgba(255,255,255,.75) 0%, rgba(255,255,255,0) 26%, rgba(0,0,0,0) 70%, rgba(0,0,0,.05) 100%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.9), inset 0 -2px 0 rgba(0,0,0,.06);
}
.slab--top{ justify-content:flex-start; }
.slab--g{ background-color:var(--glaze); color:var(--on-g); --focus:var(--on-g);
  background-image:linear-gradient(150deg, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,.16) 100%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.16), inset 0 -2px 0 rgba(0,0,0,.2); }
.slab--d{ background-color:var(--glaze-d); color:var(--on-g); --focus:var(--on-g);
  background-image:linear-gradient(150deg, rgba(255,255,255,.1) 0%, rgba(255,255,255,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,.16) 100%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.12), inset 0 -2px 0 rgba(0,0,0,.2); }
.lift{ box-shadow:inset 0 1.5px 0 rgba(255,255,255,.9), 0 3px 4px -2px rgba(0,0,0,.18), 0 12px 22px -12px rgba(0,0,0,.45); z-index:1; }
.slab--g.lift{ box-shadow:inset 0 1.5px 0 rgba(255,255,255,.16), 0 3px 4px -2px rgba(0,0,0,.25), 0 12px 22px -12px rgba(0,0,0,.55); z-index:1; }
.slab > .in{ padding:var(--pad); }
.fig{ position:relative; min-width:0; }
.fig > svg{ width:100%; height:100%; }

/* type */
h1,h2,h3{ text-wrap:balance; }
h2{ font-weight:900; font-size:clamp(1.55rem, calc(var(--t) * .4), 2.4rem); line-height:1.12; letter-spacing:-.02em; }
h3{ font-weight:800; font-size:1.18rem; line-height:1.25; }
.lead, .section__lead{ margin-top:.6em; color:var(--ink-2); max-width:62ch; text-wrap:pretty; }
.slab--g .lead, .slab--d .lead{ color:var(--on-g-2); }
p{ text-wrap:pretty; }
.more{ display:inline-flex; align-items:center; gap:.45em; font-weight:800; text-decoration:none; }
.more .icon{ transition:transform .2s var(--ease); }
.more:hover .icon, a:hover > .more .icon{ transform:translateX(-4px); }
.more:hover{ text-decoration:underline; }

/* ======================================================================
   HOME (the approved concept)
   ====================================================================== */

/* ============ HERO ============ */
.hero{ overflow:hidden; padding-bottom:0; }
.hero .tg{ --hero:1; }
.mirror, .page-hero__inner > .page-hero__panel, .notfound > .container{
  --min:7;
  margin:var(--g) 0 0 var(--g);
  position:relative; z-index:3; color:var(--ink); --focus:var(--ink);
  display:flex; flex-direction:column; justify-content:center;
  border-radius:3px;
  background:
    linear-gradient(118deg, rgba(255,255,255,0) 0 18%, rgba(255,255,255,.55) 18% 21%, rgba(255,255,255,0) 21% 27%, rgba(255,255,255,.35) 27% 28.2%, rgba(255,255,255,0) 28.2%),
    linear-gradient(170deg, #eef2f1 0%, #e2e9e7 55%, #d9e1df 100%);
  background-color:#e2e9e7;
  box-shadow:
    inset 0 0 0 calc(var(--t) * .06) #cdd6d3,
    inset 0 0 0 calc(var(--t) * .06 + 1.5px) rgba(255,255,255,.95),
    inset 0 0 0 calc(var(--t) * .06 + 3px) #c3cdca,
    0 4px 6px -3px rgba(0,0,0,.3), 0 18px 30px -16px rgba(0,0,0,.6);
}
.mirror{ grid-column:1 / span 6; grid-row:1; }
.mirror .in{ padding:calc(var(--t) * .42) calc(var(--t) * .38); }
.clip{ position:absolute; width:26px; height:9px; border-radius:3px; background:linear-gradient(#f4f6f5,#aeb7b4); box-shadow:0 1px 2px rgba(0,0,0,.35); }
.clip--1{ top:-3px; right:18%; } .clip--2{ top:-3px; left:18%; } .clip--3{ bottom:-3px; right:18%; } .clip--4{ bottom:-3px; left:18%; }
.hero h1{
  font-weight:900; font-size:calc(var(--t) * .55); line-height:1.04; letter-spacing:-.025em;
}
.hero h1 .l{ display:block; }
.hero h1 .l3{ color:var(--glaze); }
.hero .sub{ margin-top:.75em; font-size:1rem; line-height:1.55; color:#26332e; max-width:46ch; text-wrap:pretty; }
.hero .sub b{ font-weight:800; color:var(--ink); }
.sub__more{ display:none; }
.acts{ display:flex; flex-direction:column; gap:10px; margin-top:18px; }
.acts .btn{ width:100%; }
.proof{ display:flex; flex-wrap:wrap; gap:4px 16px; margin-top:16px; font-size:.86rem; color:#26332e; font-weight:600; }
.proof li{ display:flex; align-items:center; gap:6px; }
.proof .stars{ display:inline-flex; color:var(--glaze); }
.proof .stars .icon{ width:13px; height:13px; }
.proof .icon{ color:var(--glaze); width:16px; height:16px; }

.zone{ --n:6; grid-column:1 / span 6; grid-row-end:span 5; grid-template-rows:repeat(5, var(--t)); position:relative; z-index:1; }
.tape{
  grid-column:3 / span 3; grid-row:1;
  margin:var(--g) 0 0 var(--g); align-self:center; height:calc(var(--t) * .78);
  display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center;
  color:#231d10; font-weight:800; line-height:1.2;
  font-size:clamp(13.5px, calc(var(--t) * .2), 19px);
  position:relative; z-index:4; isolation:isolate;
}
.tape span{ display:block; }
.tape__bg{ position:absolute; inset:0; width:100%; height:100%; z-index:-1; overflow:visible; filter:drop-shadow(0 1px 1.2px rgba(0,0,0,.32)); }
.leak{ grid-column:4; grid-row:3; position:relative; z-index:2; }
.stainsvg{ position:absolute; left:calc(var(--t) * -2); top:calc(var(--t) * -1); width:calc(var(--t) * 5); height:calc(var(--t) * 5); pointer-events:none; transform-origin:50% 30%; }
.stainsvg .s1{ fill:rgba(42,30,6,.42); }
.stainsvg .s2{ fill:rgba(42,30,6,.32); }
.stainsvg .s3{ fill:none; stroke:rgba(42,30,6,.4); stroke-width:9; stroke-linecap:round; }
.stainsvg .tide{ fill:none; stroke:rgba(226,200,136,.5); stroke-width:3.2; }
.cavity{ position:absolute; inset:var(--g) 0 0 var(--g); overflow:hidden; box-shadow:inset 5px 5px 9px rgba(0,0,0,.55); background:#4f4a42; }
.cavity svg{ width:100%; height:100%; }
.face{
  position:absolute; inset:var(--g) 0 0 var(--g);
  background-color:var(--glaze);
  background-image:
    radial-gradient(120% 90% at 55% 120%, rgba(42,30,6,.55), rgba(42,30,6,.3) 55%, rgba(42,30,6,0) 80%),
    linear-gradient(135deg, transparent 13%, rgba(255,255,255,.07) 13% 15.5%, transparent 15.5%),
    linear-gradient(140deg, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 34%, rgba(0,0,0,0) 62%, rgba(0,0,0,.16) 100%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.16);
  transform-origin:0 50%;
  transform:translate(calc(var(--t) * -.16), calc(var(--t) * -.1)) perspective(calc(var(--t) * 6)) rotateY(-58deg) rotateX(9deg);
  filter:drop-shadow(8px 10px 7px rgba(0,0,0,.5));
  transform-style:preserve-3d;
}
.face::after{ content:""; position:absolute; top:0; right:0; width:7px; height:100%; background:#d8ceb6; transform-origin:100% 50%; transform:rotateY(-90deg); }
.hmark{ position:absolute; left:calc(var(--t) * -1); top:calc(var(--t) * -1.1); width:calc(var(--t) * 3); height:calc(var(--t) * 2.6); overflow:visible; pointer-events:none; z-index:5; }
.hmark path{ fill:none; stroke:var(--marker); stroke-width:6; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:1 1; stroke-dashoffset:0; }
.probe{ position:absolute; left:50%; top:50%; width:calc(var(--t) * .34); height:calc(var(--t) * .34); margin:calc(var(--t) * -.17) 0 0 calc(var(--t) * -.17); border-radius:50%; border:2.5px solid var(--on-g); background:rgba(245,239,226,.22); opacity:0; z-index:6; pointer-events:none; }
.probe::after{ content:""; position:absolute; inset:38%; border-radius:50%; background:var(--on-g); }
.rip{ position:absolute; left:50%; top:50%; width:calc(var(--t) * .9); height:calc(var(--t) * .9); margin:calc(var(--t) * -.45) 0 0 calc(var(--t) * -.45); border-radius:50%; border:2px solid rgba(245,239,226,.85); opacity:0; pointer-events:none; z-index:6;
  transform:translate(calc(var(--t) * var(--x)), calc(var(--t) * var(--y))) scale(.3); }

/* signature: the stain spreads, a probe taps tile to tile, the one tile is marked, then lifts out */
.anim .stainsvg{ animation:spread 2.8s var(--ease) .05s both; }
.anim .probe{ animation:probe 2.4s linear .5s both; }
.anim .rip{ animation:rip .75s var(--ease) var(--d) both; }
.anim .hmark path{ animation:draw .8s cubic-bezier(.65,0,.35,1) 2.75s both; }
.anim .hmark path.arw{ animation-delay:3.35s; animation-duration:.45s; }
.anim .tape{ animation:tape .55s var(--ease) 3.25s both; }
.anim .face{ animation:lift 1.25s var(--ease) 3.7s both; }
@keyframes spread{ from{ transform:scale(.8); opacity:.55; } to{ transform:none; opacity:1; } }
@keyframes draw{ from{ stroke-dashoffset:1; } to{ stroke-dashoffset:0; } }
@keyframes tape{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
@keyframes rip{ 0%{ opacity:.95; transform:translate(calc(var(--t) * var(--x)), calc(var(--t) * var(--y))) scale(.25); } 100%{ opacity:0; transform:translate(calc(var(--t) * var(--x)), calc(var(--t) * var(--y))) scale(1.25); } }
@keyframes lift{
  0%{ transform:translate(0,0) perspective(calc(var(--t) * 6)) rotateY(0deg) rotateX(0deg); filter:drop-shadow(0 0 0 rgba(0,0,0,0)); }
  18%{ transform:translate(0,0) perspective(calc(var(--t) * 6)) rotateY(-4deg) rotateX(2deg); filter:drop-shadow(2px 3px 3px rgba(0,0,0,.35)); }
  100%{ transform:translate(calc(var(--t) * -.16), calc(var(--t) * -.1)) perspective(calc(var(--t) * 6)) rotateY(-58deg) rotateX(9deg); filter:drop-shadow(8px 10px 7px rgba(0,0,0,.5)); }
}
@keyframes probe{
  0%  { opacity:0; transform:translate(calc(var(--t) * -2), var(--t)); animation-timing-function:ease-out; }
  6%  { opacity:1; transform:translate(calc(var(--t) * -2), var(--t)); }
  15% { opacity:1; transform:translate(calc(var(--t) * -2), var(--t)); animation-timing-function:cubic-bezier(.6,0,.25,1); }
  27% { transform:translate(var(--t), calc(var(--t) * 2)); }
  35% { transform:translate(var(--t), calc(var(--t) * 2)); animation-timing-function:cubic-bezier(.6,0,.25,1); }
  47% { transform:translate(calc(var(--t) * -1), calc(var(--t) * -1)); }
  55% { transform:translate(calc(var(--t) * -1), calc(var(--t) * -1)); animation-timing-function:cubic-bezier(.6,0,.25,1); }
  67% { transform:translate(var(--t), 0); }
  75% { transform:translate(var(--t), 0); animation-timing-function:cubic-bezier(.6,0,.25,1); }
  87% { opacity:1; transform:translate(0, 0); }
  95% { opacity:1; transform:translate(0, 0) scale(.85); }
  100%{ opacity:0; transform:translate(0, 0) scale(.85); }
}

@media (min-width:768px){
  .hero{ padding-bottom:var(--t); }
  .mirror{ --min:6; grid-column:1 / span 6; }
  .mirror .in{ padding:calc(var(--t) * .45) calc(var(--t) * .42); }
  .hero h1{ font-size:calc(var(--t) * .53); }
  .acts{ flex-direction:row; flex-wrap:wrap; }
  .acts .btn{ width:auto; }
  .sub__more{ display:inline; }
  .zone{ --n:4; grid-column:7 / span 4; grid-row:1 / span 6; grid-template-rows:repeat(6, var(--t)); }
  .tape{ grid-column:1 / span 3; }
  .leak{ grid-column:2; }
}
@media (min-width:1200px){
  .mirror{ grid-column:1 / span 7; }
  .hero h1{ font-size:calc(var(--t) * .64); }
  .hero .sub{ font-size:1.08rem; }
  .zone{ --n:7; grid-column:8 / span 7; }
  .tape{ grid-column:3 / span 3; }
  .leak{ grid-column:4; }
}

/* ============ SYMPTOMS ============ */
.symmain{ --n:6; grid-column:1 / span 6; }
.symmain > *{ grid-column:1 / -1; }
.symlist{ --n:6; }
.symlist > li{ grid-column:span 6; --min:1; }
.sym{ position:relative; }
.sym a{ text-decoration:none; }
.sym a::after{ content:""; position:absolute; inset:0; }
.sym .in{ display:grid; grid-template-columns:auto 1fr; column-gap:14px; align-items:start; }
.sym .ico, .symptom__ico{ width:40px; height:40px; border-radius:50%; display:grid; place-items:center; background:rgba(30,77,65,.1); color:var(--glaze); grid-row:span 3; }
.sym.slab--g .ico{ background:rgba(245,239,226,.12); color:var(--on-g); }
.sym .ico .icon, .symptom__ico .icon{ width:22px; height:22px; }
.sym h3{ font-size:1.08rem; }
.sym p{ font-size:.93rem; color:var(--ink-2); margin-top:2px; }
.sym.slab--g p{ color:var(--on-g-2); }
.go, .symptom__go{ display:inline-flex; align-items:center; gap:.4em; margin-top:8px; font-weight:800; font-size:.92rem; }
.go .icon, .symptom__go .icon{ width:1.2em; height:1.2em; }
.slab:not(.slab--g):not(.urg) .go .icon--fill{ color:#128c47; }
.slab--g .go .icon--fill{ color:var(--wa); }
.sym{ transition:transform .2s var(--ease), box-shadow .2s; }
.sym:hover, .sym:focus-within{ transform:translateY(-2px); box-shadow:inset 0 1.5px 0 rgba(255,255,255,.5), 0 10px 18px -10px rgba(0,0,0,.45); z-index:2; }
.sym:hover .go, .sym:focus-within .go{ text-decoration:underline; }
.sym:focus-within{ outline:3px solid var(--ink); outline-offset:2px; }
.sym a:focus-visible{ outline:none; }
.urg{ background-color:var(--urgent); color:#fff; --focus:#fff;
  background-image:linear-gradient(150deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,.14) 100%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.25), inset 0 -2px 0 rgba(0,0,0,.18); --min:2; }
.urg .ico{ background:rgba(255,255,255,.16); color:#fff; width:48px; height:48px; }
.urg .ico .icon{ width:26px; height:26px; }
.urg h3{ font-size:1.32rem; font-weight:900; }
.urg p{ color:#fff; font-size:.98rem; }
.urg .go{ justify-self:start; font-size:1.12rem; background:#fff; color:var(--urgent); padding:.45em .9em; border-radius:5px; margin-top:12px; }
.symfoot{ --min:1; }
.symfoot p{ font-size:.95rem; }
.symfoot a{ font-weight:700; }
.elev{ display:none; }
@media (min-width:768px){
  .symmain{ grid-column:1 / span 6; }
  .symlist > li{ grid-column:span 3; --min:2; }
  .sym .in{ grid-template-columns:1fr; }
  .sym .ico{ grid-row:auto; margin-bottom:8px; }
  .urg .in{ grid-template-columns:auto 1fr; }
  .urg .ico{ grid-row:span 3; margin:0; }
  .elev{ display:grid; --n:4; grid-column:7 / span 4; grid-row:1; }
  .elev .fig{ grid-column:1 / span 4; grid-row:1 / span 8; }
  .elev .slab{ grid-column:1 / span 4; grid-row:9; --min:1; }
}
@media (min-width:1200px){
  .symmain, .symlist{ --n:9; }
  .symmain{ grid-column:1 / span 9; }
  .symlist > li:nth-child(1), .symlist > li:nth-child(4), .symlist > li:nth-child(5){ grid-column:span 5; }
  .symlist > li:nth-child(2), .symlist > li:nth-child(3), .symlist > li:nth-child(6){ grid-column:span 4; }
  .sym .in{ grid-template-columns:auto 1fr; }
  .sym .ico{ grid-row:span 3; margin:0; }
  .elev{ grid-column:11 / span 4; }
}
.elev svg .mk path{ fill:none; stroke:var(--glaze); stroke-width:7; stroke-linecap:round; stroke-dasharray:1 1; stroke-dashoffset:1; transition:stroke-dashoffset .6s var(--ease); }
.elev svg .mk.on path{ stroke-dashoffset:0; }
@media (prefers-reduced-motion: reduce){ .elev svg .mk path{ transition:none; } }
.elev .cap b{ display:block; font-weight:800; font-size:1rem; line-height:1.3; }
.elev .cap small{ display:block; font-size:.85rem; color:var(--ink-2); margin-top:2px; }

/* ============ COMPARE ============ */
.cmp-head{ grid-column:1 / span 6; }
.cfig{ grid-column:1 / span 6; grid-row-end:span 4; }
.clist{ grid-column:1 / span 6; --min:2; }
.clist h3{ font-size:1.2rem; }
.clist ul{ margin-top:10px; display:grid; gap:8px; }
.clist li{ display:flex; gap:10px; align-items:flex-start; }
.clist li .icon{ margin-top:.2em; }
.clist--them li .icon{ color:#7a3a1a; }
.clist--ours li .icon{ color:var(--on-g); }
.clist--ours strong{ font-weight:800; }
.cmp-photo{ grid-column:1 / span 5; --rot:-1.4deg; }
.cmp-real{ --n:6; grid-column:1 / span 6; }
.cmp-real > *{ grid-column:1 / -1; }
.cmp-real h3{ font-size:1.2rem; }
.cmp-real p{ margin-top:6px; color:var(--ink-2); }
.cmp-real .note{ font-size:.9rem; font-weight:700; color:var(--glaze); }
.cmp-real .btn{ margin-top:14px; }
.cmp-real .more{ display:flex; width:max-content; margin-top:12px; color:var(--glaze); }
.cfig figcaption{ position:absolute; top:calc(var(--t) * .12); right:calc(var(--t) * .14); font-size:.78rem; font-weight:700; background:rgba(247,243,234,.92); color:var(--ink-2); padding:2px 8px; border-radius:3px; }
@media (min-width:768px){
  .cmp-head{ grid-column:1 / span 8; }
  .cfig{ grid-column:1 / span 6; }
  .clist{ grid-column:7 / span 4; --min:4; }
  .cmp-photo{ grid-column:1 / span 4; }
  .cmp-real{ grid-column:5 / span 6; }
}
@media (min-width:1200px){
  .cmp-head{ grid-column:2 / span 9; }
  .cfig--a{ grid-column:2 / span 6; }
  .cfig--b{ grid-column:8 / span 6; }
  .clist--them{ grid-column:2 / span 6; --min:2; }
  .clist--ours{ grid-column:8 / span 6; --min:2; }
  .cmp-real{ grid-column:2 / span 6; }
  .cmp-photo{ grid-column:9 / span 4; }
  .cfig--a{ order:1; } .cfig--b{ order:2; } .clist--them{ order:3; } .clist--ours{ order:4; } .cmp-real{ order:5; } .cmp-photo{ order:6; }
}

/* ============ SERVICES ============ */
.svc-head{ grid-column:1 / span 6; }
.spec{ grid-column:1 / span 6; --min:3; position:relative; }
.spec a{ text-decoration:none; }
.spec a::after{ content:""; position:absolute; inset:0; }
.spec .art{ width:calc(var(--t) * 1.1); height:calc(var(--t) * 1.1); min-width:64px; min-height:64px; margin-bottom:14px; color:var(--glaze); }
.spec h3{ font-size:clamp(1.35rem, calc(var(--t) * .3), 1.75rem); font-weight:900; }
.spec p{ margin-top:6px; color:var(--ink-2); }
.spec .more{ margin-top:12px; color:var(--glaze); }
.spec:hover .more{ text-decoration:underline; }
.spec:focus-within{ outline:3px solid var(--on-g); outline-offset:3px; }
.spec a:focus-visible{ outline:none; }
.smalls{ --n:6; grid-column:1 / span 6; }
.smalls > li{ grid-column:span 3; --min:2; position:relative; }
.smalls a{ text-decoration:none; }
.smalls a::after{ content:""; position:absolute; inset:0; }
.smalls strong{ display:block; font-weight:800; font-size:1rem; line-height:1.25; }
.smalls small{ display:block; font-size:.86rem; line-height:1.4; margin-top:4px; color:var(--ink-2); }
.smalls .slab--d small{ color:var(--on-g-2); }
.smalls .icon{ margin-top:6px; width:1.1em; height:1.1em; transition:transform .2s var(--ease); }
.smalls li:hover .icon{ transform:translateX(-4px); }
.smalls li:hover strong{ text-decoration:underline; }
.smalls li:focus-within{ outline:3px solid var(--on-g); outline-offset:2px; z-index:2; }
.smalls a:focus-visible{ outline:none; }
.smalls .in{ padding:calc(var(--pad) * .8); }
.drain{ grid-column:1 / span 6; --min:3; }
.drain h3{ font-size:clamp(1.2rem, calc(var(--t) * .26), 1.5rem); font-weight:900; }
.drain ul{ margin-top:10px; display:grid; gap:6px; font-weight:700; }
.drain li{ display:flex; gap:8px; align-items:flex-start; }
.drain li .icon{ margin-top:.2em; color:var(--glaze); flex:none; }
.drain .btn{ margin-top:14px; }
.routine{ grid-column:1 / span 6; --min:1; }
.routine .in{ padding-block:14px; font-size:.95rem; }
.routine b{ font-weight:800; }
.routine a{ font-weight:800; white-space:nowrap; color:var(--glaze); }
@media (min-width:768px){
  .svc-head{ grid-column:1 / span 8; }
  .spec{ --min:4; }
  .spec--1{ grid-column:1 / span 5; }
  .spec--2{ grid-column:6 / span 5; }
  .smalls{ --n:10; grid-column:1 / span 10; }
  .smalls > li{ grid-column:span 5; --min:1; }
  .drain{ grid-column:1 / span 10; --min:2; }
  .drain ul{ grid-template-columns:1fr 1fr; column-gap:24px; }
  .routine{ grid-column:1 / span 10; }
}
@media (min-width:1200px){
  .svc-head{ grid-column:1 / span 8; }
  .spec--1{ grid-column:1 / span 4; }
  .spec--2{ grid-column:5 / span 4; }
  .smalls{ --n:6; grid-column:9 / span 6; }
  .smalls > li{ grid-column:span 2; --min:2; }
  .drain{ grid-column:1 / span 8; }
  .routine{ grid-column:1 / span 14; }
}

/* ============ PROCESS ============ */
.proc-head{ grid-column:1 / span 6; }
.tsteps{ --n:6; grid-column:1 / span 6; }
.tsteps > li{ --n:6; grid-column:span 6; }
.tsteps .ill{ grid-column:1 / span 3; grid-row:1 / span 2; }
.tsteps .st{ grid-column:4 / span 3; grid-row:1 / span 2; }
.tsteps .st .in{ display:flex; flex-direction:column; gap:2px; }
.tsteps .st h3{ display:flex; align-items:center; gap:10px; font-size:1.12rem; font-weight:900; }
.st__n{ flex:none; display:grid; place-items:center; width:clamp(34px, calc(var(--t) * .5), 46px); height:clamp(34px, calc(var(--t) * .5), 46px); background:#c8912f; color:var(--ink); font-size:1.3rem; font-weight:900; line-height:1; border-radius:2px;
  background-image:linear-gradient(150deg, rgba(255,255,255,.3) 0%, rgba(255,255,255,0) 40%, rgba(0,0,0,0) 70%, rgba(0,0,0,.12) 100%); box-shadow:inset 0 1.5px 0 rgba(255,255,255,.35), inset 0 -2px 0 rgba(0,0,0,.18); }
.tsteps .sp{ grid-column:1 / span 6; grid-row:auto; --min:1; }
.tsteps .ill--photo{ display:flex; align-items:center; justify-content:center; padding:calc(var(--t) * .22) calc(var(--t) * .14) calc(var(--t) * .12); --rot:1.2deg; }
.ill--photo .print__paper{ height:100%; padding-bottom:clamp(4px, calc(var(--t) * .07), 9px); }
.ill--photo .print__img{ height:100%; aspect-ratio:3 / 2; }
.ill--photo .print__tape{ width:clamp(52px, 38%, 110px); }
.tsteps .sp p{ font-size:.95rem; color:var(--ink-2); }
@media (min-width:768px){
  .proc-head{ grid-column:1 / span 8; }
  .tsteps{ --n:10; grid-column:1 / span 10; }
  .tsteps > li{ --n:5; grid-column:span 5; }
  .tsteps .st{ grid-column:4 / span 2; }
  .tsteps .sp{ grid-column:1 / span 5; }
}
@media (min-width:1200px){
  .proc-head{ grid-column:2 / span 8; }
  .tsteps{ --n:14; grid-column:1 / span 14; }
  .tsteps > li{ --n:3; grid-column:span 3; }
  .tsteps > li:nth-child(1){ grid-column:2 / span 3; }
  .tsteps .ill{ grid-column:1 / span 3; grid-row:1 / span 2; }
  .tsteps .st{ grid-column:1 / span 3; grid-row:auto; --min:1; }
  .tsteps .st .in{ padding-block:12px; }
  .tsteps .sp{ grid-column:1 / span 3; }
}

/* ============ ABOUT ============ */
.about-t{ grid-column:1 / span 6; }
.about-t .pull{ font-weight:800; font-size:clamp(1.12rem, calc(var(--t) * .24), 1.4rem); line-height:1.4; margin-top:.6em; color:var(--glaze); }
.about-t p + p{ margin-top:.8em; }
.about-t .body{ color:var(--ink-2); max-width:62ch; }
.sign{ margin-top:1em; font-weight:900; font-size:1.1rem; }
.sign small{ display:block; font-weight:500; font-size:.85rem; color:var(--ink-2); }
.about-t .more{ margin-top:14px; color:var(--glaze); }
.plate{ grid-column:1 / span 6; --min:4; background-color:#f6f0e2; }
.plate .in, .bizcard{ margin:calc(var(--t) * .14); padding:calc(var(--pad) * .9); border:3px solid var(--glaze); outline:1.5px solid var(--glaze); outline-offset:-9px; border-radius:2px; text-align:center; color:var(--glaze); position:relative; }
.plate .in::before, .plate .in::after, .bizcard::before, .bizcard::after{ content:""; position:absolute; width:14px; height:14px; background:var(--glaze); transform:rotate(45deg); top:-8px; }
.plate .in::before, .bizcard::before{ right:-8px; } .plate .in::after, .bizcard::after{ left:-8px; }
.plate .name, .bizcard__name{ font-weight:900; font-size:clamp(1.9rem, calc(var(--t) * .48), 2.6rem); line-height:1.05; margin:.15em 0 .1em; color:var(--ink); }
.plate .role, .bizcard__role{ font-size:.9rem; color:var(--ink-2); }
.plate ul, .bizcard ul{ margin:12px auto 0; display:grid; gap:4px; font-weight:700; font-size:.92rem; color:var(--ink); justify-items:center; }
.plate li, .bizcard li{ display:flex; align-items:center; gap:6px; }
.plate li .icon, .bizcard li .icon{ color:var(--glaze); width:1.05em; height:1.05em; }
.plate .pfoot, .bizcard__foot{ margin-top:12px; padding-top:10px; border-top:1.5px solid rgba(30,77,65,.35); display:flex; justify-content:center; gap:14px; font-weight:800; font-size:.95rem; color:var(--ink); flex-wrap:wrap; }
@media (min-width:768px){
  .about-t{ grid-column:1 / span 6; }
  .plate{ grid-column:7 / span 4; grid-row:1; }
}
@media (min-width:1200px){
  .about-t{ grid-column:1 / span 8; }
  .plate{ grid-column:10 / span 4; }
}

/* ============ REVIEWS ============ */
.rev-head{ grid-column:1 / span 6; }
.score{ --n:4; grid-column:2 / span 4; direction:ltr; }
.dg{ margin:var(--g) 0 0 var(--g); display:grid; place-items:center; color:var(--on-g); background-color:var(--glaze);
  font-weight:900; font-size:calc(var(--t) * .66); line-height:1; letter-spacing:-.02em; font-variant-numeric:lining-nums;
  background-image:linear-gradient(150deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,.16) 100%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.18), inset 0 -2px 0 rgba(0,0,0,.2), 0 3px 4px -2px rgba(0,0,0,.25), 0 10px 18px -12px rgba(0,0,0,.5); }
.dg--pt{ font-size:calc(var(--t) * .8); align-items:end; padding-bottom:calc(var(--t) * .14); }
.mid{ grid-column:1 / span 6; --min:2; }
.mid .stars{ display:flex; gap:2px; color:var(--glaze); }
.mid .stars .icon{ width:17px; height:17px; }
.mid p{ margin-top:8px; color:var(--ink-2); max-width:52ch; }
.mid p b{ color:var(--ink); font-weight:800; }
.mid a{ margin-top:10px; color:var(--glaze); }
.mid .mid__g{ margin-top:10px; padding-top:10px; border-top:1.5px solid var(--rule); font-size:.92rem; }
.rev-link{ grid-column:1 / span 6; --min:1; }
.rev-link .in{ padding-block:12px; }
.rev-link a{ color:var(--glaze); }
/* review carousel under the hero: a swipe / scroll-snap track, cards sized in whole tiles (main.js 5c) */
.wall--quote{ padding-bottom:0; }
.car-head{ grid-column:1 / span 6; --min:1; }
.car-head .in{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding-block:10px; }
.car-head h2{ font-size:clamp(1.25rem, calc(var(--t) * .3), 1.6rem); }
.car-head p{ margin-top:2px; font-size:.86rem; color:var(--ink-2); }
.car__btns{ flex:none; display:flex; gap:8px; }
.car__btn{ width:44px; height:44px; display:grid; place-items:center; border:0; border-radius:3px; cursor:pointer;
  background-color:var(--glaze); color:var(--on-g);
  background-image:linear-gradient(150deg, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 40%, rgba(0,0,0,0) 70%, rgba(0,0,0,.16) 100%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.16), inset 0 -2px 0 rgba(0,0,0,.2); transition:opacity .2s; }
.car__btn .icon{ width:20px; height:20px; }
.car__btn--prev .icon{ transform:scaleX(-1); }
.car__btn:disabled{ opacity:.3; cursor:default; }
.car{ grid-column:1 / span 6; margin:var(--g) 0 0 var(--g); min-width:0; }
.car__track{ --n:5; display:flex; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-width:none; }
.car__track::-webkit-scrollbar{ display:none; }
.car__track:focus-visible{ outline:3px solid var(--ink); outline-offset:3px; }
.car__track > .testimonial{ flex:0 0 calc(var(--n) * var(--t) - var(--g)); margin:0 0 0 var(--g); padding:var(--pad); scroll-snap-align:start; }
.car__track > .testimonial:last-child{ margin-left:0; }
@media (min-width:768px){
  .rev-head{ grid-column:1 / span 8; }
  .score{ grid-column:1 / span 4; }
  .mid{ grid-column:5 / span 6; }
  .rev-link{ grid-column:1 / span 4; }
  .car-head, .car{ grid-column:1 / span 10; }
  .car__track{ --n:4; }
}
@media (min-width:1200px){
  .rev-head{ grid-column:2 / span 6; }
  .score{ grid-column:9 / span 4; grid-row:1; }
  .mid{ grid-column:8 / span 6; grid-row-start:2; }
  .rev-link{ grid-column:2 / span 4; }
  .car-head, .car{ grid-column:2 / span 12; }
}

/* ============ AREAS ============ */
.area-t{ grid-column:1 / span 6; }
.area-t .btn{ margin-top:16px; background:var(--ink); color:#fff; }
.coast{ --n:6; grid-column:1 / span 6; }
.coast > li{ grid-column:1 / span 6; --min:1; margin:var(--g) 0 0 var(--g); display:grid; grid-template-columns:calc(var(--t) - var(--g)) 1fr calc(var(--t) - var(--g)); column-gap:var(--g); }
.coast .dec{ background:var(--decor) center / calc(var(--t) - var(--g)) calc(var(--t) - var(--g)) repeat-y #efe6d2; box-shadow:inset 0 1.5px 0 rgba(255,255,255,.6); }
.coast .in{ background:var(--slab); color:var(--ink); padding:8px 14px; display:flex; flex-direction:column; justify-content:center; box-shadow:inset 0 1.5px 0 rgba(255,255,255,.9); }
.coast strong{ font-weight:800; font-size:1.02rem; line-height:1.25; }
.coast small{ font-size:.84rem; color:var(--ink-2); line-height:1.35; }
.coast .end .in{ background:var(--ink); color:#fff; }
.coast .end small{ color:#d8e2dc; }
.coast .cap .in{ background:transparent; box-shadow:none; color:var(--on-g); align-items:center; font-weight:800; font-size:.9rem; padding:0 var(--t) 0 0; flex-direction:row; justify-content:center; gap:8px; }
.coast .cap .dec{ background:none; box-shadow:none; }
.coast .cap .icon{ width:18px; height:18px; }
@media (min-width:768px){
  .area-t{ grid-column:1 / span 4; }
  .coast{ grid-column:5 / span 6; }
}
@media (min-width:1200px){
  .area-t{ grid-column:2 / span 5; }
  .coast{ grid-column:8 / span 6; }
}

/* ============ FAQ (home + inner pages share the slab question) ============ */
.faq-head{ grid-column:1 / span 6; }
.faq-head .more{ margin-top:12px; color:var(--glaze); }
.tfaq{ --n:6; grid-column:1 / span 6; }
.tfaq > div{ grid-column:1 / -1; --min:1; }
.tfaq .slab > details.in{ padding:0; }
.tfaq summary, .faq summary{ list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px var(--pad); font-weight:800; font-size:1.02rem; line-height:1.35; min-height:calc(var(--t) - var(--g) - 1px); }
.tfaq summary::-webkit-details-marker, .faq summary::-webkit-details-marker{ display:none; }
.tfaq summary .icon, .faq summary .icon{ flex:none; width:22px; height:22px; color:var(--glaze); transition:transform .25s var(--ease); }
.tfaq details[open] summary .icon, .faq details[open] summary .icon{ transform:rotate(45deg); }
.tfaq summary:hover, .faq summary:hover{ color:var(--glaze); }
.tfaq summary:focus-visible, .faq summary:focus-visible{ outline-offset:-4px; }
.tfaq .faq__body, .faq .faq__body{ padding:0 var(--pad) 18px; color:var(--ink-2); max-width:68ch; }
.tfaq .faq__body a, .faq .faq__body a{ color:var(--glaze); font-weight:700; }
@media (prefers-reduced-motion: reduce){ .tfaq summary .icon, .faq summary .icon{ transition:none; } }
@media (min-width:768px){
  .faq-head{ grid-column:1 / span 8; }
  .tfaq{ --n:10; grid-column:1 / span 10; }
}
@media (min-width:1200px){
  .faq-head{ grid-column:1 / span 5; }
  .tfaq{ --n:9; grid-column:6 / span 9; }
}

/* ============ CONTACT ============ */
.ct-main{ grid-column:1 / span 6; --min:4; }
.ct-main .acts{ margin-top:20px; }
.ct-side{ grid-column:1 / span 6; --min:2; }
.ct-side .item{ display:flex; gap:12px; align-items:flex-start; }
.ct-side .item + .item{ margin-top:16px; padding-top:16px; border-top:1.5px solid rgba(207,224,214,.25); }
.ct-side .icon{ margin-top:.2em; color:var(--on-g); }
.ct-side strong{ display:block; font-weight:800; overflow-wrap:anywhere; }
.ct-side span span{ display:block; color:var(--on-g-2); font-size:.92rem; }
.ct-side a{ text-decoration:underline; text-decoration-color:rgba(245,239,226,.45); }
@media (min-width:768px){
  .ct-main{ grid-column:1 / span 6; }
  .ct-side{ grid-column:7 / span 4; --min:4; }
}
@media (min-width:1200px){
  .ct-main{ grid-column:2 / span 7; }
  .ct-side{ grid-column:9 / span 5; }
}

/* ======================================================================
   INNER PAGES: the same wall. Every section container is a tile grid;
   its blocks are slabs that sit on the grout lines, and main.js snaps
   each slab's height to whole tiles. Nests are transparent sub-grids.
   Keep the NEST list in sync with TILE_NEST in main.js.
   ====================================================================== */
.section > .container, .page-hero__inner{
  display:grid; grid-template-columns:repeat(var(--cols), var(--t));
  grid-auto-rows:auto; align-content:start;
  width:calc(var(--cols) * var(--t)); margin-inline:auto; position:relative;
}
/* consecutive walls of the same glaze share one empty tile row */
.section:not(.section--alt):not(.section--dark):not(.notfound) + .section:not(.section--alt):not(.section--dark):not(.notfound),
.section:is(.section--alt, .section--dark) + .section:is(.section--alt, .section--dark){ padding-top:0; }

/* default: every block is a cream slab */
.section > .container > *, .page-hero__inner > *,
.grid--3 > *, .related > *, .rating-cards > *, .areas > *, .symptoms > *, .why-list > *,
.section > .container > .steps > *, .section > .container > .faq > *,
.faq-group > *, .faq-group > .faq > *, .contact-grid > *, .contact-cards > *, .aside > *, .work > *{
  grid-column:1 / -1; margin:var(--g) 0 0 var(--g); min-width:0; position:relative;
  display:flex; flex-direction:column; justify-content:center;
  padding:var(--pad);
  background-color:var(--slab); color:var(--ink); --focus:var(--ink);
  background-image:linear-gradient(150deg, rgba(255,255,255,.75) 0%, rgba(255,255,255,0) 26%, rgba(0,0,0,0) 70%, rgba(0,0,0,.05) 100%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.9), inset 0 -2px 0 rgba(0,0,0,.06);
}
/* nests: transparent sub-grids whose children are the slabs */
.section > .container > :is(.grid--3, .related, .rating-cards, .areas, .symptoms, .why-list, .steps, .faq, .faq-group, .contact-grid, .aside, .work),
.faq-group > .faq, .contact-grid > .contact-cards{
  display:grid; grid-template-columns:repeat(var(--cols), var(--t)); grid-template-columns:subgrid;
  grid-auto-rows:auto; align-content:start;
  margin:0; padding:0; background:none; box-shadow:none; color:inherit;
}
/* while main.js measures, slabs show their natural height */
.ts-measure [data-ts]{ min-height:0 !important; align-self:start !important; }

/* re-apply the coloured slabs over the default cream */
.section > .container > .cta-band, .grid--3 > .card--featured, .related > .card--featured, .rating-cards > :first-child{
  background-color:var(--glaze); color:var(--on-g); --focus:var(--on-g);
  background-image:linear-gradient(150deg, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,.16) 100%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.16), inset 0 -2px 0 rgba(0,0,0,.2);
}
.rating-cards > :first-child{ box-shadow:inset 0 1.5px 0 rgba(255,255,255,.16), 0 3px 4px -2px rgba(0,0,0,.25), 0 12px 22px -12px rgba(0,0,0,.55); z-index:1; }
.aside > .aside-card--dark{
  background-color:var(--glaze-d); color:var(--on-g); --focus:var(--on-g);
  background-image:linear-gradient(150deg, rgba(255,255,255,.1) 0%, rgba(255,255,255,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,.16) 100%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.12), inset 0 -2px 0 rgba(0,0,0,.2);
}
.contact-grid > :first-child, .section > .about-teaser > :first-child, .page-hero__inner > .hero-card{
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.9), 0 3px 4px -2px rgba(0,0,0,.18), 0 12px 22px -12px rgba(0,0,0,.45); z-index:1;
}
.contact-cards > .contact-card--wa{
  background-color:var(--wa); color:var(--wa-ink); --focus:var(--wa-ink);
  background-image:linear-gradient(150deg, rgba(255,255,255,.28) 0%, rgba(255,255,255,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,.08) 100%);
}

/* single-slab sections: legal text and the 404 mirror */
.section > .container.legal, .notfound > .container{
  display:block; width:calc(6 * var(--t) - var(--g)); margin:var(--g) auto 0 calc(50% - 3 * var(--t) + var(--g));
  padding:var(--pad);
}
.section > .container.legal{
  background-color:var(--slab); color:var(--ink);
  background-image:linear-gradient(150deg, rgba(255,255,255,.75) 0%, rgba(255,255,255,0) 26%, rgba(0,0,0,0) 70%, rgba(0,0,0,.05) 100%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.9), inset 0 -2px 0 rgba(0,0,0,.06);
}
.section > .container.legal > *, .notfound > .container > *{
  grid-column:auto; margin:0; padding:0; display:block; background:none; box-shadow:none; min-height:0;
}
.section > .container.legal > * + *{ margin-top:.95em; }
.section > .container.legal > ul{ display:grid; gap:.5em; padding-inline-start:1.35em; }
.section > .container.legal > .todo-note{ padding:16px 26px; background:var(--tape-bg); margin-bottom:.4em; }

/* ============ PAGE HERO: green wall, a mirror holding the copy ============ */
.page-hero__inner > .page-hero__panel{ padding:calc(var(--t) * .42) calc(var(--t) * .38); justify-content:center; }
.breadcrumb{ display:flex; flex-wrap:wrap; align-items:center; gap:2px 0; font-size:.86rem; font-weight:600; color:#26332e; margin-bottom:12px; }
.breadcrumb li + li::before{ content:"/"; padding-inline:7px; color:#56635d; }
.breadcrumb a{ color:var(--glaze); text-decoration:underline; text-decoration-color:rgba(30,77,65,.4); }
.breadcrumb a:hover{ text-decoration-color:currentColor; }
.page-hero h1{ font-weight:900; font-size:clamp(1.8rem, calc(var(--t) * .44), 3.1rem); line-height:1.1; letter-spacing:-.02em; }
.page-hero .hero__sub{ margin-top:.7em; font-size:1.02rem; line-height:1.58; color:#26332e; max-width:54ch; }
.page-hero .hero__actions{ display:flex; flex-direction:column; gap:10px; margin-top:18px; }
.page-hero .hero__actions .btn{ width:100%; }
.hero__urgent{ margin-top:14px; font-weight:700; font-size:.95rem; line-height:1.5; color:#26332e; }
.hero__urgent .icon{ display:inline-block; vertical-align:-.25em; margin-inline-end:6px; color:var(--urgent); }
.hero__urgent a{ color:var(--err); font-weight:800; }
.hero__trust{ display:flex; flex-wrap:wrap; gap:4px 16px; margin-top:16px; font-size:.86rem; color:#26332e; font-weight:600; }
.hero__trust li{ display:flex; align-items:center; gap:6px; }
.hero__trust .icon{ color:var(--glaze); width:16px; height:16px; }

/* the card beside the mirror */
.hero-card{ justify-content:center; }
.hero-card__title{ font-weight:900; font-size:1.15rem; line-height:1.3; }
.hero-card ol{ counter-reset:hc; display:grid; gap:9px; margin-top:12px; }
.hero-card li{ counter-increment:hc; display:grid; grid-template-columns:28px 1fr; gap:10px; align-items:start; font-size:.96rem; line-height:1.45; color:var(--ink-2); }
.hero-card li::before{ content:counter(hc); display:grid; place-items:center; width:28px; height:28px; background:var(--glaze); color:var(--on-g); font-weight:800; font-size:.9rem; border-radius:2px; box-shadow:inset 0 1.5px 0 rgba(255,255,255,.16), inset 0 -2px 0 rgba(0,0,0,.2); }
.hero-card__score{ display:flex; align-items:center; gap:12px; padding-bottom:14px; margin-bottom:14px; border-bottom:1.5px solid var(--rule); }
.tdig{ flex:none; display:inline-flex; gap:2px; padding:2px; background:var(--grout-c); border-radius:2px; }
.tdig > span{ display:grid; place-items:center; width:30px; height:36px; background:var(--glaze); color:var(--on-g); font-weight:900; font-size:1.3rem; line-height:1; font-variant-numeric:lining-nums;
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.16), inset 0 -2px 0 rgba(0,0,0,.2); }
.tdig > span:nth-child(2){ width:16px; align-items:end; padding-bottom:5px; }
.hero-card__score small{ display:block; font-size:.85rem; line-height:1.4; color:var(--ink-2); }
.hero-card .stars{ display:flex; gap:1px; color:var(--glaze); }
.hero-card .stars .icon{ width:14px; height:14px; }
.hero-card__phone{
  display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:16px; padding:10px 14px;
  background:var(--ink); color:#fff; --focus:var(--ink); border-radius:6px; text-decoration:none; font-weight:900; font-size:1.22rem; line-height:1.15;
  box-shadow:0 2px 0 rgba(0,0,0,.18), 0 6px 14px -8px rgba(0,0,0,.5); transition:transform .18s var(--ease), background-color .18s;
}
.hero-card__phone:hover{ background:#22352e; transform:translateY(-1px); }
.hero-card__phone small{ font-weight:500; font-size:.8rem; color:#d8e2dc; }
.hero-card__phone .icon{ width:1.4em; height:1.4em; }
.page-emergency .hero-card__phone{ background:var(--urgent); }
.page-emergency .hero-card__phone:hover{ background:#a8211a; }
.page-emergency .hero-card__phone small{ color:#fff; }

@media (min-width:768px){
  .page-hero__inner > .page-hero__panel{ padding:calc(var(--t) * .45) calc(var(--t) * .42); grid-column:1 / span 8; }
  .page-hero--card .page-hero__inner > .page-hero__panel{ grid-column:1 / span 6; }
  .page-hero__inner > .hero-card{ grid-column:7 / span 4; }
  .page-hero .hero__actions{ flex-direction:row; flex-wrap:wrap; }
  .page-hero .hero__actions .btn{ width:auto; }
}
@media (min-width:1200px){
  .page-hero__inner > .page-hero__panel{ grid-column:2 / span 8; }
  .page-hero--card .page-hero__inner > .page-hero__panel{ grid-column:2 / span 7; }
  .page-hero__inner > .hero-card{ grid-column:10 / span 4; }
}

/* the signature device on the leak landing page: stain, probe, the one tile, the tape */
.page-hero--device{ overflow:hidden; }
.page-hero__inner > .zone{
  display:grid; grid-template-columns:repeat(var(--n), var(--t)); grid-template-rows:repeat(5, var(--t)); grid-auto-rows:var(--t);
  grid-row:auto; margin:0; padding:0; background:none; box-shadow:none; color:var(--on-g); min-height:0; z-index:1;
}
@media (min-width:768px){
  .page-hero__inner > .zone{ --n:4; grid-column:7 / span 4; grid-row:1; grid-template-rows:repeat(6, var(--t)); }
  .page-hero--device .page-hero__inner > .page-hero__panel{ grid-column:1 / span 6; grid-row:1; }
  .page-hero--device .page-hero__inner > .hero-card{ grid-column:1 / span 6; grid-row:2; }
}
@media (min-width:1200px){
  .page-hero__inner > .zone .tape{ grid-column:1 / span 3; }
  .page-hero__inner > .zone .leak{ grid-column:2; }
  .page-hero--device .page-hero__inner > .hero-card{ grid-column:11 / span 4; grid-row:1; }
}

/* ============ JOB PHOTOS: real prints taped to the wall ============
   A print is a whole-tile block (main.js snaps it like a slab); the paper inside
   is rotated a little and held by the same masking tape as the notes. */
.print{ position:relative; z-index:1; min-width:0; display:flex; flex-direction:column; justify-content:center; }
.print > .in{ padding:calc(var(--t) * .26) calc(var(--t) * .12) calc(var(--t) * .14); }
.print__paper{
  position:relative; margin:0; background:#fbf8f1; color:var(--ink);
  padding:clamp(4px, calc(var(--t) * .07), 9px) clamp(4px, calc(var(--t) * .07), 9px) 0;
  box-shadow:0 1px 1.5px rgba(0,0,0,.3), 0 12px 20px -12px rgba(0,0,0,.6);
  transform:rotate(var(--rot, -1deg));
}
.print__img{ position:relative; aspect-ratio:4 / 5; overflow:hidden; background:#cfc7b6; }
.print__img img{ width:100%; height:100%; object-fit:cover; }
.print__paper figcaption{ padding:.5em .15em .7em; font-size:.88rem; font-weight:700; line-height:1.38; color:var(--ink); text-wrap:pretty; }
.print__tape{
  position:absolute; z-index:2; top:calc(var(--t) * -.17); left:50%; width:clamp(60px, 42%, 140px); height:clamp(20px, calc(var(--t) * .32), 30px);
  transform:translateX(-50%) rotate(calc(var(--rot, -1deg) * -2.4)); overflow:visible; pointer-events:none;
  filter:drop-shadow(0 1px 1.1px rgba(0,0,0,.3));
}
/* the one red marker loop, as on the leak tile */
.print__mark{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
.print__mark path{ fill:none; stroke:var(--marker); stroke-width:5px; vector-effect:non-scaling-stroke; stroke-linecap:round; stroke-linejoin:round; }
@media (max-width:767px){ .print__paper figcaption{ font-size:.82rem; } }

/* inner pages: a wall of prints, then the action */
.section > .container > .work > .print{ padding:0; background:none; box-shadow:none; justify-content:center; }
.work > .print{ grid-column:auto / span 3; }
.work > .print:nth-child(4n+1){ --rot:-1.3deg; } .work > .print:nth-child(4n+2){ --rot:1deg; }
.work > .print:nth-child(4n+3){ --rot:-.7deg; } .work > .print:nth-child(4n){ --rot:1.5deg; }
.work--feature > .print{ grid-column:1 / span 5; }
.work__cta{ justify-content:flex-start !important; align-self:start; }
.work__cta h3{ font-size:1.2rem; font-weight:900; }
.work__cta h2{ font-size:clamp(1.35rem, calc(var(--t) * .32), 1.9rem); }
.work__cta p{ margin-top:6px; color:var(--ink-2); max-width:56ch; }
.work__cta .note{ font-weight:700; color:var(--glaze); }
.work__cta .btn-row{ margin-top:14px; }
.work__cta .more{ margin-top:12px; color:var(--glaze); }
@media (min-width:768px){
  .work > .print{ grid-column:auto / span 5; }
  .work--feature > .print{ grid-column:1 / span 4; }
  .work--feature > .work__cta{ grid-column:5 / span 6; }
}
@media (min-width:1200px){
  .work > .print{ grid-column:auto / span 3; }
  .work > .print:nth-child(4n+1){ grid-column:2 / span 3; }
  .work > .work__cta{ grid-column:2 / span 12; }
  .work--pair > .work__cta{ grid-column:8 / span 6; }
  .work--feature > .print:nth-child(n){ grid-column:2 / span 4; }
  .work--feature > .work__cta{ grid-column:6 / span 8; }
  /* the full-width action under a row of four: copy and buttons on one line */
  .work:not(.work--pair):not(.work--feature) > .work__cta{ display:grid; grid-template-columns:1fr auto; column-gap:32px; align-content:center; align-items:center; }
  .work:not(.work--pair):not(.work--feature) > .work__cta > .btn-row{ grid-column:2; grid-row:1 / span 2; margin-top:0; }
}

/* a print in the page hero, in the device's place */
.page-hero__inner > .hero-print{ padding:0; background:none; box-shadow:none; grid-column:1 / span 5; --rot:1.3deg; }
@media (min-width:768px){
  .page-hero--device .page-hero__inner > .hero-print{ grid-column:7 / span 4; grid-row:1; }
}

/* ============ SECTION HEADS ============ */
.section__head h2 + .section__lead{ margin-top:.5em; }
/* a heading on its own needs one tile, not two */
.section > .container > h2, .section > .container > .section__head:not(:has(> .section__lead)), .faq-group > h2{ padding-block:calc(var(--pad) * .55); }
.section__head--center{ text-align:center; }
.section__head--center .section__lead{ margin-inline:auto; }
.section > .container > h2{ font-size:clamp(1.45rem, calc(var(--t) * .36), 2.1rem); }
@media (min-width:768px){
  .section > .container > .section__head, .section > .container > h2{ grid-column:1 / span 8; }
  .section > .container > .section__head--center, .section > .container > h2.text-center{ grid-column:2 / span 8; }
  .section > .container > .section__head--row{ grid-column:1 / -1; }
}
@media (min-width:1200px){
  .section > .container > *{ grid-column:2 / span 12; }
  .section > .container > .section__head, .section > .container > h2, .section > .container > .prose{ grid-column:2 / span 8; }
  .section > .container > .section__head--center, .section > .container > h2.text-center{ grid-column:3 / span 10; }
  .section > .container > .section__head--row{ grid-column:2 / span 12; display:grid; grid-template-columns:1fr 1fr; gap:0 calc(var(--pad) * 1.4); align-items:end; }
  .section__head--row .section__lead{ margin-top:0; }
}

/* ============ PROSE ============ */
.prose{ justify-content:flex-start !important; }
.prose > * + *{ margin-top:.95em; }
.prose h2{ font-size:clamp(1.3rem, calc(var(--t) * .28), 1.75rem); line-height:1.2; margin-top:1.7em; }
.prose > h2:first-child{ margin-top:0; }
.prose h3{ font-size:1.2rem; }
.prose p, .prose li{ color:var(--ink-2); max-width:68ch; }
.prose strong{ color:var(--ink); font-weight:800; }
.prose .lead{ font-size:1.13rem; line-height:1.6; color:var(--ink); font-weight:500; max-width:62ch; margin-top:0; }
.prose a:not(.btn), .legal a, .why-list a, .section__lead a, .steps a{ color:var(--glaze); font-weight:700; text-decoration:underline; text-decoration-color:rgba(30,77,65,.4); }
.prose a:not(.btn):hover, .legal a:hover, .why-list a:hover, .section__lead a:hover, .steps a:hover{ text-decoration-color:currentColor; }
.prose ul:not([class]), .prose ol:not([class]){ display:grid; gap:.5em; padding-inline-start:1.35em; }
.prose ul:not([class]) > li{ position:relative; }
.prose ul:not([class]) > li::before{ content:""; position:absolute; right:-1.15em; top:.62em; width:.42em; height:.42em; background:var(--glaze); box-shadow:inset 0 1px 0 rgba(255,255,255,.25); }
.prose ol:not([class]){ list-style:decimal; }
.prose ol:not([class]) > li::marker{ color:var(--glaze); font-weight:800; }

/* checklists, scored like grout inside the slab */
.checklist{ display:grid; }
.checklist li{ display:flex; gap:10px; align-items:flex-start; padding:.55em 0; border-top:1.5px solid var(--rule); color:var(--ink-2); }
.checklist li:first-child{ border-top:0; padding-top:0; }
.checklist .icon{ color:var(--glaze); margin-top:.2em; stroke-width:2.2; }
@media (min-width:768px){
  .checklist--cols{ grid-template-columns:1fr 1fr; column-gap:28px; }
  .checklist--cols li:nth-child(2){ border-top:0; padding-top:0; }
}

/* the taped note, and a green inset for the hard rules */
.callout, .todo-note{
  padding:16px 26px; background:var(--tape-bg); color:#231d10;
}
.prose .callout{ margin-block:1.5em; }
.callout p, .callout li, .todo-note{ color:#231d10; max-width:none; }
.callout strong{ color:#231d10; }
.callout--dark{
  border-radius:2px; background:var(--glaze); color:var(--on-g);
  background-image:linear-gradient(150deg, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,.16) 100%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.16), inset 0 -2px 0 rgba(0,0,0,.2);
}
.callout--dark p, .callout--dark li, .callout--dark strong{ color:var(--on-g); }
.callout--dark ol{ display:grid; gap:.4em; margin-top:.6em; padding-inline-start:1.4em; list-style:decimal; }
.callout--dark ol > li::marker{ color:var(--on-g); font-weight:800; }
.callout--dark a{ color:var(--on-g); }

/* benefits: a scored two-column list, not cards */
.benefits{ display:grid; }
.prose .benefits{ margin-top:1.1em; }
.benefit{ display:flex; gap:12px; align-items:flex-start; padding:14px 0; border-top:1.5px solid var(--rule); }
.benefit .card__icon{ flex:none; color:var(--glaze); margin-top:2px; }
.benefit .card__icon .icon{ width:24px; height:24px; }
.benefit strong{ display:block; font-weight:800; color:var(--ink); }
.benefit div > span{ display:block; color:var(--ink-2); font-size:.95rem; margin-top:2px; }
@media (min-width:768px){ .benefits{ grid-template-columns:1fr 1fr; column-gap:28px; } }

/* steps: the sequence is the information, so each step carries its number tile */
.steps{ counter-reset:st; display:grid; }
.steps > li{ counter-increment:st; display:grid !important; grid-template-columns:40px 1fr; column-gap:14px; align-content:center; }
.steps > li::before{ content:counter(st); grid-row:span 2; display:grid; place-items:center; width:40px; height:40px; background:var(--glaze); color:var(--on-g); font-weight:900; font-size:1.1rem; border-radius:2px; box-shadow:inset 0 1.5px 0 rgba(255,255,255,.16), inset 0 -2px 0 rgba(0,0,0,.2); }
.steps h3{ font-size:1.2rem; font-weight:900; align-self:center; }
.steps p{ grid-column:2; margin-top:4px; color:var(--ink-2); font-size:.97rem; }
.prose .steps{ margin-top:1.1em; gap:18px; }
.prose .steps > li{ align-content:start; }
@media (min-width:768px){ .prose .steps--3{ grid-template-columns:repeat(3, 1fr); column-gap:22px; } .prose .steps--3 > li{ grid-template-columns:1fr; } .prose .steps--3 > li::before{ grid-row:auto; margin-bottom:10px; } .prose .steps--3 p{ grid-column:1; } }

/* ============ CARDS (link slabs, no icon tiles) ============ */
.card{ justify-content:flex-start !important; text-decoration:none; transition:transform .2s var(--ease), box-shadow .2s; }
.card > *{ order:2; }
.card > h3{ order:0; font-size:clamp(1.15rem, calc(var(--t) * .26), 1.45rem); font-weight:900; }
.card .card__icon{ display:none; }
.card__badge{ order:1 !important; align-self:flex-start; margin-top:6px; padding:1px 8px; font-size:.8rem; font-weight:800; border-radius:3px; background:rgba(245,239,226,.16); color:var(--on-g); }
.card p{ margin-top:6px; color:var(--ink-2); }
.card .checklist{ margin-top:12px; }
.card__link{ order:3 !important; margin-top:auto; padding-top:14px; display:inline-flex; align-items:center; gap:.45em; font-weight:800; color:var(--glaze); }
.card__link .icon{ transition:transform .2s var(--ease); }
.card--featured p{ color:var(--on-g-2); }
.card--featured .card__link{ color:var(--on-g); }
a.card:hover, a.card:focus-visible{ transform:translateY(-2px); z-index:2; box-shadow:inset 0 1.5px 0 rgba(255,255,255,.5), 0 10px 18px -10px rgba(0,0,0,.45); }
a.card:hover h3{ text-decoration:underline; }
a.card:hover .card__link .icon{ transform:translateX(-4px); }
a.card:focus-visible{ outline:3px solid var(--on-g); outline-offset:2px; }
.section:not(.section--alt):not(.section--dark) a.card:focus-visible{ outline-color:var(--ink); }

/* three-up and two-up rows on the grid */
@media (min-width:768px){
  :is(.grid--3, .related, .why-list, .areas) > :nth-child(odd){ grid-column:1 / span 5; }
  :is(.grid--3, .related, .why-list, .areas) > :nth-child(even){ grid-column:6 / span 5; }
}
@media (min-width:1200px){
  .section > .container > :is(.grid--3, .related, .rating-cards, .areas, .symptoms, .why-list, .steps, .contact-grid, .faq-group, .work){ grid-column:1 / -1; }
  :is(.grid--3, .related, .why-list, .areas) > :nth-child(3n+1), .section > .container > .steps > :nth-child(3n+1){ grid-column:2 / span 4; }
  :is(.grid--3, .related, .why-list, .areas) > :nth-child(3n+2), .section > .container > .steps > :nth-child(3n+2){ grid-column:6 / span 4; }
  :is(.grid--3, .related, .why-list, .areas) > :nth-child(3n), .section > .container > .steps > :nth-child(3n){ grid-column:10 / span 4; }
  .section > .container > .steps > li{ grid-template-columns:1fr; align-content:start; }
  .section > .container > .steps > li::before{ grid-row:auto; margin-bottom:12px; }
  .section > .container > .steps p{ grid-column:1; }
}

/* ============ LEAK SIGNS (symptom slabs, as on the home wall) ============ */
.symptoms > li{ padding:0; transition:transform .2s var(--ease), box-shadow .2s; }
.symptoms > li:nth-child(2), .symptoms > li:nth-child(5){
  background-color:var(--glaze); color:var(--on-g); --focus:var(--on-g);
  background-image:linear-gradient(150deg, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,.16) 100%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.16), inset 0 -2px 0 rgba(0,0,0,.2);
}
.symptoms > .symptoms__urgent{
  background-color:var(--urgent); color:#fff; --focus:#fff;
  background-image:linear-gradient(150deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,.14) 100%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.25), inset 0 -2px 0 rgba(0,0,0,.18);
}
.symptom{ flex:1; display:grid; grid-template-columns:auto 1fr; column-gap:14px; align-content:center; padding:var(--pad); color:inherit; text-decoration:none; }
.symptom h3{ font-size:1.08rem; }
.symptom p{ font-size:.93rem; color:var(--ink-2); margin-top:2px; }
.symptom__go{ grid-column:2; color:var(--glaze); }
.symptom__go .icon--wa{ color:#128c47; }
.symptoms > li:nth-child(2) .symptom__ico, .symptoms > li:nth-child(5) .symptom__ico{ background:rgba(245,239,226,.12); color:var(--on-g); }
.symptoms > li:nth-child(2) p, .symptoms > li:nth-child(5) p{ color:var(--on-g-2); }
.symptoms > li:nth-child(2) .symptom__go, .symptoms > li:nth-child(5) .symptom__go{ color:var(--on-g); }
.symptoms > li:nth-child(2) .symptom__go .icon--wa, .symptoms > li:nth-child(5) .symptom__go .icon--wa{ color:var(--wa); }
.symptom--urgent .symptom__ico{ background:rgba(255,255,255,.16); color:#fff; width:48px; height:48px; }
.symptom--urgent .symptom__ico .icon{ width:26px; height:26px; }
.symptom--urgent h3{ font-size:1.32rem; font-weight:900; }
.symptom--urgent p{ color:#fff; font-size:.98rem; }
.symptom--urgent .symptom__go{ justify-self:start; font-size:1.12rem; background:#fff; color:var(--urgent); padding:.45em .9em; border-radius:5px; margin-top:12px; }
.symptoms > li:hover, .symptoms > li:focus-within{ transform:translateY(-2px); box-shadow:inset 0 1.5px 0 rgba(255,255,255,.5), 0 10px 18px -10px rgba(0,0,0,.45); z-index:2; }
.symptoms > li:hover .symptom__go, .symptoms > li:focus-within .symptom__go{ text-decoration:underline; }
.symptoms > li:focus-within{ outline:3px solid var(--ink); outline-offset:2px; }
.symptom:focus-visible{ outline:none; }
@media (min-width:768px){
  .symptoms > .symptoms__urgent{ grid-column:1 / -1; }
  .symptoms > li:nth-child(2), .symptoms > li:nth-child(4){ grid-column:1 / span 5; }
  .symptoms > li:nth-child(3), .symptoms > li:nth-child(5){ grid-column:6 / span 5; }
  .symptom:not(.symptom--urgent){ grid-template-columns:1fr; }
  .symptom:not(.symptom--urgent) .symptom__ico{ grid-row:auto; margin-bottom:8px; }
  .symptom:not(.symptom--urgent) .symptom__go{ grid-column:1; }
}
@media (min-width:1200px){
  .symptoms > .symptoms__urgent{ grid-column:2 / span 4; grid-row:1 / span 2; }
  .symptoms > .symptoms__urgent .symptom{ grid-template-columns:1fr; }
  .symptoms > .symptoms__urgent .symptom__ico{ grid-row:auto; margin-bottom:10px; }
  .symptoms > .symptoms__urgent .symptom__go{ grid-column:1; }
  .symptoms > li:nth-child(2){ grid-column:6 / span 4; grid-row:1; }
  .symptoms > li:nth-child(3){ grid-column:10 / span 4; grid-row:1; }
  .symptoms > li:nth-child(4){ grid-column:6 / span 4; grid-row:2; }
  .symptoms > li:nth-child(5){ grid-column:10 / span 4; grid-row:2; }
  .symptom:not(.symptom--urgent){ grid-template-columns:auto 1fr; }
  .symptom:not(.symptom--urgent) .symptom__ico{ grid-row:span 3; margin:0; }
  .symptom:not(.symptom--urgent) .symptom__go{ grid-column:2; }
}

/* ============ SERVICE PAGES: article + aside ============ */
.aside{ align-self:start; }
.aside-card h3{ font-size:1.2rem; font-weight:900; }
.aside-card p{ margin-top:6px; color:var(--ink-2); }
.aside-card--dark p{ color:var(--on-g-2); }
.aside-card .btn-row{ margin-top:16px; }
.aside-card .btn-row .btn{ flex:1 1 auto; }
.aside-trust{ display:grid; gap:6px; margin-top:16px; padding-top:14px; border-top:1.5px solid rgba(207,224,214,.22); font-size:.9rem; color:var(--on-g-2); font-weight:600; }
.aside-trust li{ display:flex; align-items:center; gap:8px; }
.aside-trust .icon{ color:var(--on-g); width:1.1em; height:1.1em; }
.aside-card:not(.aside-card--dark) ul{ display:grid; margin-top:10px; }
.aside-card:not(.aside-card--dark) a{ display:flex; align-items:center; gap:10px; padding:.55em 0; border-top:1.5px solid var(--rule); text-decoration:none; font-weight:700; }
.aside-card:not(.aside-card--dark) li:first-child a{ border-top:0; }
.aside-card:not(.aside-card--dark) a .icon{ color:var(--glaze); }
.aside-card:not(.aside-card--dark) a:hover{ color:var(--glaze); text-decoration:underline; }
.aside-card a[aria-current="page"]{ color:var(--glaze); font-weight:900; }
.aside-card a[aria-current="page"]::after{ content:""; margin-inline-start:auto; width:10px; height:10px; background:var(--glaze); }
@media (min-width:768px){
  .aside > *:nth-child(odd){ grid-column:1 / span 5; }
  .aside > *:nth-child(even){ grid-column:6 / span 5; }
}
@media (min-width:1200px){
  .section > .service-layout > .prose{ grid-column:2 / span 7; }
  .section > .service-layout > .aside{ grid-column:9 / span 5; }
  .aside > *:nth-child(n){ grid-column:1 / -1; }
}

/* ============ CTA BAND ============ */
.cta-band h2{ font-size:clamp(1.4rem, calc(var(--t) * .34), 2.1rem); }
.cta-band p{ margin-top:.5em; color:var(--on-g-2); max-width:58ch; }
.cta-band__actions{ display:flex; flex-direction:column; gap:10px; margin-top:18px; }
.cta-band__actions .btn{ width:100%; }
.cta-band .btn--primary{ background:var(--on-g); color:var(--ink); }
.cta-band .btn--primary:hover{ background:#fff; }
.cta-band__aside{ font-size:.95rem; }
.cta-band__aside a{ color:var(--on-g); font-weight:700; text-decoration:underline; text-decoration-color:rgba(245,239,226,.5); }
.cta-band__aside a:hover{ text-decoration-color:currentColor; }
@media (min-width:768px){
  .cta-band__actions{ flex-direction:row; flex-wrap:wrap; }
  .cta-band__actions .btn{ width:auto; }
}
@media (min-width:1200px){
  .section > .container > .cta-band{ flex-direction:row; align-items:center; justify-content:space-between; gap:32px; }
  .cta-band__actions{ margin-top:0; flex:none; }
}

/* ============ FAQ PAGE / FAQ SECTIONS ============ */
.section > .container > .faq > details, .faq-group > .faq > details{ padding:0; display:block; }
.faq > details:not([open]) > summary{ min-height:inherit; }
.faq-group > h2{ font-size:clamp(1.3rem, calc(var(--t) * .3), 1.8rem); flex-direction:row; align-items:center; justify-content:flex-start; gap:10px; }
.faq-group > h2 .icon{ color:var(--glaze); width:1em; height:1em; }
@media (min-width:1200px){
  .section > .container > .faq{ grid-column:3 / span 10; }
  .faq-group > h2{ grid-column:2 / span 4; align-self:start; }
  .faq-group > .faq{ grid-column:6 / span 8; }
}

/* ============ CONTACT SECTION + FORM ============ */
.contact-grid > :first-child{ justify-content:flex-start; }
.contact-card{ flex-direction:row !important; align-items:center; justify-content:flex-start !important; gap:12px; padding-block:calc(var(--pad) * .55) !important; text-decoration:none; transition:transform .2s var(--ease), box-shadow .2s; }
.contact-card .card__icon{ flex:none; width:42px; height:42px; border-radius:50%; display:grid; place-items:center; background:rgba(30,77,65,.1); color:var(--glaze); }
.contact-card .card__icon .icon{ width:22px; height:22px; }
.contact-card strong{ display:block; font-weight:800; font-size:1.05rem; line-height:1.3; overflow-wrap:anywhere; }
.contact-card strong + span{ display:block; color:var(--ink-2); font-size:.92rem; line-height:1.45; }
.contact-card--wa .card__icon{ background:rgba(15,42,24,.12); color:var(--wa-ink); }
.contact-card--wa strong + span{ color:var(--wa-ink); }
a.contact-card:hover{ transform:translateY(-2px); z-index:2; box-shadow:inset 0 1.5px 0 rgba(255,255,255,.5), 0 10px 18px -10px rgba(0,0,0,.45); }
a.contact-card:hover strong{ text-decoration:underline; }
a.contact-card:focus-visible{ outline:3px solid var(--on-g); outline-offset:2px; }
@media (min-width:768px){
  .contact-grid > :first-child{ grid-column:1 / span 6; }
  .contact-grid > .contact-cards{ grid-column:7 / span 4; }
}
@media (min-width:1200px){
  .contact-grid > :first-child{ grid-column:2 / span 7; }
  .contact-grid > .contact-cards{ grid-column:9 / span 5; }
}

.form h3{ font-size:clamp(1.2rem, calc(var(--t) * .28), 1.5rem); font-weight:900; }
.form > .muted{ margin-top:6px; }
.form__grid{ display:grid; gap:14px; margin-top:18px; }
.field{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.field label{ font-weight:700; font-size:.95rem; }
.field input, .field select, .field textarea{
  width:100%; min-height:48px; padding:10px 12px; font:inherit; font-size:16px; color:var(--ink);
  background:#fffdf8; border:1.5px solid #8a7f68; border-radius:4px;
  transition:border-color .15s, box-shadow .15s;
}
.field textarea{ min-height:112px; resize:vertical; line-height:1.5; }
.field select{
  appearance:none; padding-left:38px; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231e4d41' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:left 12px center; background-size:18px;
}
.field input::placeholder, .field textarea::placeholder{ color:#5c6660; opacity:1; }
.field input:hover, .field select:hover, .field textarea:hover{ border-color:var(--glaze); }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible{ outline:3px solid var(--glaze); outline-offset:1px; border-color:var(--glaze); }
.field .error{ display:none; color:var(--err); font-weight:700; font-size:.9rem; }
.field.has-error input, .field.has-error select, .field.has-error textarea{ border-color:var(--err); background:#fff6f4; }
.field.has-error .error{ display:block; }
.form__submit .btn{ width:100%; }
.form__note{ display:flex; align-items:center; gap:8px; margin-top:12px; font-size:.86rem; color:var(--ink-2); }
.form__note .icon{ color:var(--glaze); width:18px; height:18px; }
.form__success{ display:none; margin-top:16px; padding:14px 16px; background:#e4efe8; border:1.5px solid #8fb9a0; border-radius:4px; color:var(--ink); line-height:1.6; }
.form__success:focus{ outline:none; }
.form__success a{ color:var(--glaze); font-weight:800; }
.form.is-sent .form__success{ display:block; }
.form.is-sent .form__grid, .form.is-sent .form__submit, .form.is-sent .form__note{ display:none; }
@media (min-width:768px){
  .form__grid{ grid-template-columns:1fr 1fr; }
  .form__grid .span-2{ grid-column:1 / -1; }
}

/* ============ ABOUT PAGE ============ */
.section > .about-teaser > :first-child{ background-color:#f6f0e2; padding:0; align-self:start; }
.bizcard{ display:flex; flex-direction:column; align-items:center; }
.bizcard__top{ order:3; display:flex; flex-direction:row; align-items:center; gap:8px; margin-top:12px; text-align:start; }
.bizcard .logo__mark svg{ width:34px; height:34px; color:var(--glaze); }
.bizcard__brand{ font-weight:800; font-size:.9rem; line-height:1.3; }
.bizcard__brand small{ display:block; font-weight:600; font-size:.78rem; color:var(--ink-2); }
.bizcard__stamp{ order:4; margin-top:10px; font-size:.82rem; font-weight:800; color:var(--glaze); }
.bizcard__stamp b{ margin-inline-start:.3em; }
.bizcard__foot{ order:5; align-self:stretch; }
.bizcard__foot a{ text-decoration:none; }
.bizcard__foot a:hover{ text-decoration:underline; }
.about-teaser__cert{ display:flex; flex-wrap:wrap; gap:8px; margin-top:1.3em; }
.chip{ display:inline-flex; align-items:center; gap:6px; padding:4px 10px; background:var(--bisque); border:1.5px solid var(--grout-c); border-radius:3px; font-weight:700; font-size:.9rem; color:var(--ink); }
.chip .icon{ color:var(--glaze); width:1.05em; height:1.05em; }
.why-list > li{ flex-direction:row !important; align-items:flex-start; justify-content:flex-start !important; gap:12px; }
.why-list > li > .icon{ color:var(--glaze); width:24px; height:24px; margin-top:2px; stroke-width:2.2; }
.why-list strong{ display:block; font-weight:900; font-size:1.06rem; line-height:1.3; }
.why-list li div > span{ display:block; margin-top:4px; color:var(--ink-2); font-size:.95rem; }
@media (min-width:768px){
  .section > .about-teaser > :first-child{ grid-column:7 / span 4; grid-row:1; }
  .section > .about-teaser > .prose{ grid-column:1 / span 6; grid-row:1; }
}
@media (min-width:1200px){
  .section > .about-teaser > :first-child{ grid-column:10 / span 4; }
  .section > .about-teaser > .prose{ grid-column:2 / span 7; }
}

/* ============ REVIEWS PAGE ============ */
.rating-card{ gap:8px; }
.rating-card__score{ font-weight:900; font-size:clamp(3.4rem, calc(var(--t) * 1.15), 6rem); line-height:.9; letter-spacing:-.03em; }
.rating-card__score small{ font-size:max(.36em, 1rem); font-weight:700; color:var(--on-g-2); letter-spacing:0; }
.rating-card__score--sm{ font-size:clamp(2.2rem, calc(var(--t) * .6), 3.2rem); line-height:1; }
.rating-card__stars{ display:flex; gap:2px; color:var(--glaze); }
.rating-cards > :first-child .rating-card__stars{ color:var(--on-g); }
.rating-card__stars .icon{ width:16px; height:16px; }
.rating-card__src{ font-weight:900; font-size:1.3rem; line-height:1.2; margin-top:4px; }
.rating-card__meta{ color:var(--ink-2); max-width:46ch; margin-top:4px; }
.rating-cards > :first-child .rating-card__meta{ color:var(--on-g-2); }
.rating-card a{ display:inline-flex; align-items:center; gap:.45em; margin-top:10px; font-weight:800; text-decoration:none; }
.rating-card a:hover{ text-decoration:underline; }
/* testimonials: real Midrag quotes (home carousel + reviews page grid) */
.testimonial{ justify-content:flex-start !important; }
.testimonial__mark{ flex:none; width:30px; height:30px; fill:currentColor; color:var(--glaze); opacity:.85; }
.testimonial blockquote{ margin:10px 0 0; }
.testimonial blockquote p{ font-size:1.04rem; line-height:1.6; color:var(--ink); }
.testimonial figcaption{ margin-top:auto; padding-top:14px; display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 8px; font-size:.9rem; color:var(--ink-2); }
.testimonial figcaption::before{ content:""; flex:0 0 100%; height:1.5px; margin-bottom:10px; background:var(--rule); }
.testimonial figcaption b{ color:var(--ink); font-weight:800; font-size:1rem; }
.testimonial figcaption b::after{ content:" ·"; font-weight:400; color:var(--ink-2); }
.testimonial__src{ flex-basis:100%; display:inline-flex; align-items:center; gap:5px; margin-top:2px; font-weight:700; font-size:.84rem; color:var(--glaze); }
.testimonial__src .icon{ width:15px; height:15px; }
@media (min-width:768px){
  .rating-cards > :first-child{ grid-column:1 / span 6; }
  .rating-cards > :nth-child(2){ grid-column:7 / span 4; }
}
@media (min-width:1200px){
  .rating-cards > :first-child{ grid-column:2 / span 7; }
  .rating-cards > :nth-child(2){ grid-column:9 / span 5; }
}

/* ============ SERVICE AREAS PAGE ============ */
.route{ flex-direction:row !important; flex-wrap:wrap; align-items:center; justify-content:center !important; gap:6px 10px; font-weight:800; font-size:1.02rem; }
.route .icon{ color:var(--glaze); width:1.1em; height:1.1em; }
.route span:first-child, .route span:last-child{ color:var(--glaze); font-weight:900; }
.area{ justify-content:flex-start !important; }
.area h2{ display:flex; align-items:center; gap:8px; font-size:1.25rem; }
.area h2 .icon{ color:var(--glaze); }
.area ul{ display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.area li{ padding:3px 10px; background:var(--bisque); border:1.5px solid var(--grout-c); border-radius:3px; font-weight:700; font-size:.95rem; }

/* ============ LEGAL + 404 ============ */
.notfound > .container{ text-align:center; padding:calc(var(--t) * .5) calc(var(--t) * .42); }
.notfound .big{ font-weight:900; font-size:clamp(3.5rem, calc(var(--t) * 1.2), 6rem); line-height:1; letter-spacing:-.03em; color:var(--glaze); }
.notfound h1{ font-weight:900; font-size:clamp(1.7rem, calc(var(--t) * .42), 2.8rem); line-height:1.12; margin-top:.25em !important; }
.notfound .section__lead{ margin:.7em auto 0 !important; color:#26332e; }
.notfound .btn-row{ display:flex; flex-direction:row; flex-wrap:wrap; justify-content:center; margin-top:1.5rem !important; }
@media (min-width:768px){
  .section > .container.legal, .notfound > .container{ width:calc(8 * var(--t) - var(--g)); margin-left:calc(50% - 4 * var(--t) + var(--g)); }
}
@media (min-width:1200px){
  .notfound > .container{ width:calc(10 * var(--t) - var(--g)); margin-left:calc(50% - 5 * var(--t) + var(--g)); }
}

/* unused today, kept styled */

/* ============ FOOTER ============ */
.ftr{ background:#10261f; color:#e9e2d2; padding:40px 16px 110px; --focus:#f5efe2; }
.ftr__in{ max-width:1288px; margin-inline:auto; display:grid; gap:28px; }
.ftr .brand__mark{ color:#cfe0d6; }
.ftr .brand__txt small{ color:#b9c9c0; }
.ftr p{ color:#b9c9c0; font-size:.92rem; margin-top:10px; max-width:42ch; }
.ftr h2{ font-size:.95rem; font-weight:800; letter-spacing:0; margin-bottom:10px; color:#f5efe2; }
.ftr ul{ display:grid; gap:6px; font-size:.93rem; }
.ftr a{ color:#e9e2d2; text-decoration:none; }
.ftr a:hover{ text-decoration:underline; }
.ftr li a{ display:inline-flex; align-items:center; gap:6px; }
.ftr li a .icon{ width:1.05em; height:1.05em; color:#b9c9c0; }
.ftr__nap{ margin-top:14px; }
.ftr__base{ max-width:1288px; margin:28px auto 0; padding-top:18px; border-top:1px solid rgba(233,226,210,.18); display:flex; flex-wrap:wrap; gap:8px 22px; font-size:.86rem; color:#b9c9c0; }
.ftr__base a{ color:#e9e2d2; text-decoration:underline; text-decoration-color:rgba(233,226,210,.4); }
@media (min-width:768px){
  .ftr{ padding:52px 32px 40px; }
  .ftr__in{ grid-template-columns:1.4fr 1fr 1fr 1fr; }
}

/* ============ STICKY BAR (mobile) ============ */
.sticky-bar{
  position:fixed; inset:auto 0 0 0; z-index:60; display:grid; grid-template-columns:1fr 1fr; gap:8px;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom)); background:#f6f1e6; border-top:1px solid #cfc4ad;
  box-shadow:0 -8px 20px -12px rgba(0,0,0,.4);
}
.js .sticky-bar{ transform:translateY(110%); transition:transform .35s var(--ease), visibility 0s .35s; visibility:hidden; }
.js .sticky-bar.is-shown{ transform:none; visibility:visible; transition-delay:0s; }
.sticky-bar::before{ content:""; position:absolute; inset:-7px 0 auto 0; height:6px; background:var(--listello); }
.sticky-bar .btn{ min-height:50px; padding-inline:.6em; font-size:1rem; }
.page-emergency .sticky-bar .btn--call{ order:-1; }
@media (min-width:768px){ .sticky-bar{ display:none; } }
@media (prefers-reduced-motion: reduce){
  .sticky-bar, .js .sticky-bar{ transition:none; }
  .btn, .sym, .more .icon, .card, .symptoms > li, .contact-card, .hero-card__phone, .card__link .icon, .nav__sub{ transition:none; }
}