/* ============================================================
   Arcline Cleaning Group — shared styles  (rebuild v2)
   Premium exterior-cleaning brand. Deep ink + restrained steel
   accent. Solid confident buttons (no gradient glow).
   ============================================================ */
:root{
  /* surfaces */
  --ink:#0a0e14;          /* page base */
  --ink-2:#0d121a;        /* alt section */
  --panel:#121925;        /* raised card */
  --panel-2:#172132;      /* hover / input bg */
  --line:#1d2836;         /* hairline */
  --line-2:#2a3a4d;       /* stronger hairline */

  /* accent — clean confident blue (reference vibe), used with restraint */
  --acc:#3d9be0;
  --acc-bright:#5cb2f0;
  --acc-deep:#2b7fc0;
  --acc-wash:rgba(61,155,224,.12);
  --acc-line:rgba(61,155,224,.34);

  /* text */
  --text:#f2f5f8;
  --muted:#9fb0c0;
  --faint:#67788a;
  --warn:#e8a06b;

  --maxw:1180px;
  --r:14px;
  --r-lg:20px;
  --shadow:0 30px 70px rgba(0,0,0,.55);
  --shadow-s:0 12px 34px rgba(0,0,0,.42);
  --ease:cubic-bezier(.4,.01,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:80px}
body{background:var(--ink);color:var(--text);font-family:'Inter',system-ui,-apple-system,sans-serif;font-size:17px;line-height:1.62;overflow-x:hidden;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,.display{font-family:'Archivo',sans-serif;line-height:1.05;letter-spacing:-.022em}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 26px}
.narrow{max-width:880px;margin-left:auto;margin-right:auto}
.eyebrow{font-family:'Archivo';font-weight:700;font-size:.72rem;letter-spacing:.28em;text-transform:uppercase;color:var(--acc);display:inline-flex;align-items:center;gap:10px;margin-bottom:18px}
.eyebrow::before{content:"";width:26px;height:1.5px;background:var(--acc);display:inline-block;opacity:.8}
.center .eyebrow{justify-content:center}
.section{padding:96px 0}
.section.tight{padding:64px 0}
h1.page{font-size:clamp(2.5rem,5.8vw,4.1rem);font-weight:800}
h2.h{font-size:clamp(2rem,4.4vw,3rem);font-weight:800;margin-bottom:16px;letter-spacing:-.025em}
h3.sub{font-size:clamp(1.4rem,3vw,2rem);font-weight:700;margin-bottom:12px}
.lead{color:var(--muted);font-size:1.12rem;max-width:640px;line-height:1.6}
.prose p{color:var(--muted);margin-bottom:18px}
.prose strong{color:var(--text);font-weight:600}
.center{text-align:center}.center .lead{margin-left:auto;margin-right:auto}
.mb-head{margin-bottom:56px}
:focus-visible{outline:2.5px solid var(--acc-bright);outline-offset:3px;border-radius:5px}
.skip{position:absolute;left:-999px;top:0;background:var(--acc);color:#04121b;padding:10px 16px;font-weight:800;z-index:300}
.skip:focus{left:10px;top:10px}
[id]{scroll-margin-top:90px}

/* ---------- buttons : solid + confident, no glow ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:'Archivo';font-weight:700;font-size:.98rem;letter-spacing:.01em;padding:15px 30px;border-radius:10px;cursor:pointer;border:1.5px solid transparent;transition:transform .18s var(--ease),background .2s,border-color .2s,color .2s;white-space:nowrap}
.btn svg{width:18px;height:18px}
/* primary = solid white, reads premium on dark */
.btn-primary{background:var(--text);color:#0a0e14;border-color:var(--text)}
.btn-primary:hover{background:#fff;transform:translateY(-2px)}
/* accent = filled steel, used for the single key action on light bands */
.btn-acc{background:var(--acc);color:#04141f;border-color:var(--acc)}
.btn-acc:hover{background:var(--acc-bright);border-color:var(--acc-bright);transform:translateY(-2px)}
/* ghost = hairline outline */
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.32)}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.06);transform:translateY(-2px)}
.btn-dark{background:rgba(10,14,20,.5);color:#fff;border-color:rgba(255,255,255,.22);backdrop-filter:blur(6px)}
.btn-dark:hover{border-color:#fff;transform:translateY(-2px)}
.btn-block{width:100%}

/* ---------- header : transparent over hero, solid on scroll ---------- */
header.site{position:fixed;top:0;left:0;right:0;z-index:200;background:transparent;border-bottom:1px solid transparent;transition:background .35s var(--ease),border-color .35s,backdrop-filter .35s}
header.site.scrolled{background:rgba(8,11,16,.82);backdrop-filter:blur(18px) saturate(1.3);border-bottom-color:var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:78px}
.brand img{height:46px;width:auto;display:block}
.navlinks{display:flex;align-items:center;gap:30px}
.navlinks a{font-family:'Archivo';font-weight:600;font-size:.92rem;color:rgba(255,255,255,.82);transition:color .15s;position:relative;padding:4px 0}
.navlinks a::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:1.5px;background:var(--acc);transform:scaleX(0);transform-origin:left;transition:transform .22s var(--ease)}
.navlinks a:hover{color:#fff}
.navlinks a:hover::after,.navlinks a[aria-current="page"]::after{transform:scaleX(1)}
.navlinks a[aria-current="page"]{color:#fff}

/* services dropdown */
.navdrop{position:relative;display:flex;align-items:center}
.navdrop-btn{font-family:'Archivo';font-weight:600;font-size:.92rem;color:rgba(255,255,255,.82);background:none;border:0;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:4px 0;margin:0;position:relative;transition:color .15s;line-height:inherit;vertical-align:baseline}
.navdrop-btn svg{width:14px;height:14px;transition:transform .22s var(--ease)}
.navdrop-btn::after{content:"";position:absolute;left:0;right:18px;bottom:-3px;height:1.5px;background:var(--acc);transform:scaleX(0);transform-origin:left;transition:transform .22s var(--ease)}
.navdrop:hover .navdrop-btn,.navdrop-btn[data-active="true"]{color:#fff}
.navdrop:hover .navdrop-btn::after,.navdrop-btn[data-active="true"]::after{transform:scaleX(1)}
.navdrop:hover .navdrop-btn svg{transform:rotate(180deg)}
.navdrop-menu{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(8px);min-width:280px;background:rgba(13,18,26,.98);backdrop-filter:blur(20px);border:1px solid var(--line-2);border-radius:16px;padding:10px;box-shadow:var(--shadow);opacity:0;visibility:hidden;transition:opacity .2s var(--ease),transform .2s var(--ease);z-index:60}
.navdrop::before{content:"";position:absolute;top:100%;left:0;right:0;height:18px}
.navdrop:hover .navdrop-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.navdrop-menu a{display:flex;align-items:center;gap:14px;padding:13px 15px;border-radius:11px;color:rgba(255,255,255,.82);transition:background .15s,color .15s}
.navdrop-menu a::after{display:none}
.navdrop-menu a:hover{background:var(--panel-2);color:#fff}
.navdrop-menu a[aria-current="page"]{background:var(--acc-wash);color:#fff}
.navdrop-menu .dd-ic{flex:0 0 auto;width:38px;height:38px;border-radius:10px;background:var(--acc-wash);border:1px solid var(--acc-line);display:flex;align-items:center;justify-content:center}
.navdrop-menu .dd-ic svg{width:19px;height:19px;color:var(--acc-bright)}
.navdrop-menu b{display:block;font-family:'Archivo';font-weight:700;font-size:.92rem;line-height:1.2}
.navdrop-menu small{display:block;color:var(--faint);font-size:.78rem;margin-top:2px;font-family:'Inter';font-weight:400}
.navcta{display:flex;align-items:center;gap:18px}
.navphone{display:inline-flex;align-items:center;gap:8px;font-family:'Archivo';font-weight:700;font-size:.95rem;color:#fff}
.navphone svg{width:16px;height:16px;color:var(--acc)}
.navcta .btn{padding:11px 22px;font-size:.9rem}
.burger{display:none;background:none;border:0;cursor:pointer;width:44px;height:44px;color:#fff}
.burger svg{width:28px;height:28px}
.mobilemenu{display:none;flex-direction:column;gap:0;position:fixed;top:78px;left:0;right:0;z-index:199;padding:14px 26px 30px;border-bottom:1px solid var(--line);background:rgba(10,13,19,.97);backdrop-filter:blur(20px);max-height:calc(100vh - 78px);overflow-y:auto}
.mobilemenu a{font-family:'Archivo';font-weight:600;padding:15px 4px;border-bottom:1px solid var(--line);color:rgba(255,255,255,.85);display:block}
.mobilemenu a.callrow{color:var(--acc-bright);font-weight:700}
.mobilemenu .mob-label{font-family:'Archivo';font-weight:700;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);padding:16px 4px 6px;display:block}
.mobilemenu a.mob-sub{padding-left:18px;font-size:.96rem;color:rgba(255,255,255,.78)}
.mobilemenu .btn{margin-top:18px}

/* ---------- hero ---------- */
.hero{position:relative;min-height:clamp(680px,94vh,880px);display:flex;align-items:center;overflow:hidden;padding-top:78px}
.hero.short{min-height:clamp(540px,72vh,680px)}
.hero-bg{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;transform:scale(1.05)}
.hero-bg::after{content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(8,11,16,.84) 0%,rgba(8,11,16,.60) 36%,rgba(8,11,16,.24) 66%,rgba(8,11,16,.08) 100%),
    linear-gradient(0deg,var(--ink) 0%,rgba(8,11,16,.08) 40%,rgba(8,11,16,.04) 100%)}
.hero .wrap{position:relative;z-index:3;width:100%}
.hero-inner{max-width:740px;padding-top:34px}
.rating-pill{display:inline-flex;align-items:center;gap:10px;background:var(--acc-wash);border:1px solid var(--acc-line);padding:8px 18px;border-radius:999px;font-weight:500;font-size:.88rem;margin-bottom:26px}
.stars{color:var(--acc-bright);letter-spacing:2px;font-size:.92rem}
.hero h1{font-size:clamp(2.9rem,6.6vw,5rem);font-weight:800;margin-bottom:22px;letter-spacing:-.03em}
.hero h1 .hl{background:linear-gradient(100deg,var(--acc-bright),var(--acc));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--acc)}
.hero p.sub{font-size:clamp(1.08rem,2vw,1.3rem);color:#c8d4df;max-width:560px;margin-bottom:34px;line-height:1.55}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:34px}
.hero-trust{display:flex;flex-wrap:wrap;gap:12px 30px;color:#c0cdda;font-size:.92rem;font-weight:500}
.hero-trust span{display:inline-flex;align-items:center;gap:9px}
.hero-trust svg{width:17px;height:17px;color:var(--acc-bright)}
.breadcrumb{font-size:.84rem;color:rgba(255,255,255,.55);margin-bottom:20px}
.breadcrumb a:hover{color:var(--acc-bright)}
.breadcrumb span{color:rgba(255,255,255,.8)}

/* ---------- trust strip ---------- */
.strip{background:var(--ink-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.strip-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 46px;padding:22px 0;text-align:center}
.strip-in .lbl{font-family:'Archivo';font-weight:700;letter-spacing:.02em;color:var(--muted)}
.logos{display:flex;align-items:center;gap:14px}
.glogo{font-family:'Archivo';font-weight:800;font-size:1.1rem;letter-spacing:-.02em}
.glogo .b{color:#4285F4}.glogo .r{color:#EA4335}.glogo .y{color:#FBBC05}.glogo .g{color:#34A853}

/* ---------- two col ---------- */
.two{display:grid;width:100%;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:62px;align-items:center}
.two>*{min-width:0}
.two.flip>*:first-child{order:2}.two.flip>*:last-child{order:1}
.media{position:relative;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
.media img{width:100%;height:100%;object-fit:cover;display:block}
.media.r45{aspect-ratio:4/5}.media.r43{aspect-ratio:4/3}.media.r32{aspect-ratio:3/2}.media.r11{aspect-ratio:1/1}
.media-tag{position:absolute;left:16px;bottom:16px;z-index:2;display:inline-flex;align-items:center;gap:8px;background:rgba(8,11,16,.74);backdrop-filter:blur(8px);border:1px solid var(--line-2);border-radius:999px;padding:8px 15px;font-family:'Archivo';font-weight:700;font-size:.78rem;color:#fff}
.media-tag svg{width:15px;height:15px;color:var(--acc-bright)}

/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:36px}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:26px 16px;text-align:center;transition:transform .2s var(--ease),border-color .2s}
.stat:hover{transform:translateY(-3px);border-color:var(--acc-line)}
.stat .n{font-family:'Archivo';font-weight:800;font-size:clamp(1.9rem,4vw,2.6rem);color:#fff;line-height:1}
.stat .t{color:var(--faint);font-size:.78rem;font-weight:600;margin-top:9px;text-transform:uppercase;letter-spacing:.08em}

/* ---------- checklist ---------- */
ul.ticks{list-style:none;display:grid;gap:15px;margin-top:12px}
ul.ticks li{display:flex;gap:13px;align-items:flex-start;color:var(--muted)}
ul.ticks .tk{width:24px;height:24px;border-radius:7px;background:var(--acc-wash);border:1px solid var(--acc-line);display:flex;align-items:center;justify-content:center;flex:0 0 auto;margin-top:1px}
ul.ticks .tk svg{width:14px;height:14px;color:var(--acc-bright)}
ul.ticks li strong{color:var(--text);font-weight:600}

/* ---------- warns ---------- */
ul.warns{list-style:none;display:grid;gap:15px;margin-top:12px}
ul.warns li{display:flex;gap:13px;align-items:flex-start;color:var(--muted)}
ul.warns .wn{width:24px;height:24px;border-radius:7px;background:rgba(232,160,107,.1);border:1px solid rgba(232,160,107,.32);display:flex;align-items:center;justify-content:center;flex:0 0 auto;margin-top:1px}
ul.warns .wn svg{width:14px;height:14px;color:var(--warn)}
.callout{background:rgba(232,160,107,.07);border:1px solid rgba(232,160,107,.3);border-left:3px solid var(--warn);border-radius:12px;padding:18px 22px;margin-top:24px;color:var(--text);font-weight:500}

/* ---------- services (image cards) ---------- */
.svc-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.svc{position:relative;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);min-height:420px;display:flex;align-items:flex-end;background-size:cover;background-position:center;transition:transform .3s var(--ease),border-color .3s}
.svc:hover{transform:translateY(-5px);border-color:var(--acc-line)}
.svc::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,10,15,.96) 5%,rgba(7,10,15,.55) 50%,rgba(7,10,15,.15) 100%);transition:background .3s}
.svc:hover::before{background:linear-gradient(0deg,rgba(7,10,15,.97) 5%,rgba(7,10,15,.6) 55%,rgba(7,10,15,.2) 100%)}
.svc-body{position:relative;z-index:2;padding:36px}
.svc .kicker{font-family:'Archivo';font-weight:700;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--acc-bright);margin-bottom:12px;display:block}
.svc h3{font-size:1.7rem;font-weight:700;margin-bottom:11px}
.svc p{color:#bccadb;margin-bottom:22px;max-width:440px}
.svc .more{display:inline-flex;align-items:center;gap:9px;font-family:'Archivo';font-weight:700;color:#fff}
.svc .more svg{width:18px;height:18px;color:var(--acc-bright);transition:transform .2s}
.svc:hover .more svg{transform:translateX(5px)}

/* ---------- cards ---------- */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:32px 28px;transition:border-color .2s,transform .2s var(--ease)}
.card.hov:hover{border-color:var(--acc-line);transform:translateY(-4px)}
.card .ic{width:52px;height:52px;border-radius:13px;background:var(--acc-wash);border:1px solid var(--acc-line);display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.card .ic svg{width:24px;height:24px;color:var(--acc-bright)}
.card h3{font-size:1.24rem;font-weight:700;margin-bottom:10px}
.card p{color:var(--muted);font-size:.97rem}

/* ---------- process timeline ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;position:relative}
.steps.four{grid-template-columns:repeat(4,1fr)}
.step{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:30px 28px;position:relative;transition:border-color .2s,transform .2s var(--ease)}
.step:hover{border-color:var(--acc-line);transform:translateY(-3px)}
.step .num{font-family:'Archivo';font-weight:800;font-size:1rem;width:42px;height:42px;border-radius:11px;background:var(--acc-wash);border:1px solid var(--acc-line);color:var(--acc-bright);display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.step h3{font-size:1.16rem;font-weight:700;margin:0 0 8px}
.step p{color:var(--muted);font-size:.95rem}

/* ============================================================
   BEFORE / AFTER — real drag slider (the only B/A device now)
   ============================================================ */
.ba-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.ba-grid.three{grid-template-columns:repeat(3,1fr)}
.ba{position:relative;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);aspect-ratio:3/2;user-select:none;touch-action:pan-y;box-shadow:var(--shadow-s);cursor:ew-resize}
.ba .layer{position:absolute;inset:0}
.ba .layer img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.ba .after{clip-path:inset(0 0 0 50%)}
.ba .tag{position:absolute;top:14px;font-family:'Archivo';font-weight:700;font-size:.7rem;letter-spacing:.12em;padding:6px 13px;border-radius:999px;background:rgba(8,11,16,.8);backdrop-filter:blur(6px);border:1px solid var(--line-2);z-index:4;pointer-events:none}
.ba .tag.b{left:14px}.ba .tag.a{right:14px;color:var(--acc-bright);border-color:var(--acc-line)}
.ba .handle{position:absolute;top:0;bottom:0;width:2px;background:#fff;left:50%;transform:translateX(-50%);z-index:5;pointer-events:none;box-shadow:0 0 0 1px rgba(0,0,0,.25)}
.ba .knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50px;height:50px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;z-index:6;box-shadow:0 6px 22px rgba(0,0,0,.5);pointer-events:none}
.ba .knob svg{width:22px;height:22px;color:#0a0e14}
.ba .cap{position:absolute;left:14px;bottom:14px;z-index:4;padding:7px 14px;border-radius:999px;background:rgba(8,11,16,.78);backdrop-filter:blur(8px);border:1px solid var(--line-2);font-size:.78rem;color:#e6edf4;pointer-events:none;font-weight:600;max-width:calc(100% - 28px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- gallery grid + lightbox ---------- */
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.gal.three{grid-template-columns:repeat(3,1fr)}
.gal figure{position:relative;border-radius:14px;overflow:hidden;border:1px solid var(--line);cursor:zoom-in;margin:0;transition:border-color .2s}
.gal figure:hover{border-color:var(--acc-line)}
.gal figure img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .4s var(--ease)}
.gal figure:hover img{transform:scale(1.05)}
.gal figcaption{position:absolute;left:0;right:0;bottom:0;padding:28px 14px 13px;font-size:.82rem;font-weight:600;color:#fff;background:linear-gradient(0deg,rgba(8,11,16,.92),transparent);z-index:2}
.gal .lbl{position:absolute;top:11px;left:11px;z-index:3;font-family:'Archivo';font-weight:700;font-size:.64rem;letter-spacing:.1em;padding:5px 11px;border-radius:999px;background:rgba(8,11,16,.75);border:1px solid var(--line-2)}
.gal .lbl.after{color:var(--acc-bright);border-color:var(--acc-line)}
#lightbox{position:fixed;inset:0;background:rgba(4,6,9,.96);z-index:400;display:none;align-items:center;justify-content:center;padding:24px}
#lightbox.open{display:flex}
#lightbox img{max-width:94vw;max-height:90vh;border-radius:10px;box-shadow:var(--shadow)}
#lightbox .x{position:absolute;top:18px;right:22px;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.1);border:1px solid var(--line-2);color:#fff;font-size:24px;cursor:pointer;display:flex;align-items:center;justify-content:center}

/* ---------- reviews marquee ---------- */
.reviews{overflow:hidden}
.marquee{position:relative;width:100%;overflow:hidden;margin-top:12px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.track{display:flex;gap:20px;width:max-content;will-change:transform}
.rev{width:350px;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:28px;flex:0 0 auto}
.rev .stars{margin-bottom:13px;display:block}
.rev .who{font-weight:700;font-family:'Archivo'}
.rev .loc{color:var(--faint);font-size:.85rem;margin-bottom:2px}
.rev .src{font-size:.78rem;color:var(--faint);margin-bottom:13px}
.rev .src b .b{color:#4285F4}.rev .src b .r{color:#EA4335}.rev .src b .y{color:#FBBC05}.rev .src b .g{color:#34A853}
.rev p{color:var(--muted);font-style:italic;font-size:.97rem;line-height:1.6}
.rev-links{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 30px;margin-top:34px;font-family:'Archivo';font-weight:700}
.rev-links a{color:var(--acc-bright);display:inline-flex;align-items:center;gap:8px}
.rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}

/* ---------- areas ---------- */
.areas-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:stretch}
.areas-grid>*{min-width:0}
.areas-left{display:flex;flex-direction:column}
.area-block{margin-bottom:28px}
.area-block h3{display:flex;align-items:center;gap:10px;color:#fff;font-size:1.4rem;font-weight:700;margin-bottom:18px}
.area-block h3 svg{width:21px;height:21px;color:var(--acc-bright)}
.pills{display:flex;flex-wrap:wrap;gap:10px}
.pill{display:inline-flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:9px 17px;font-size:.92rem;color:var(--muted);transition:border-color .15s,color .15s}
.pill:hover{border-color:var(--acc-line);color:var(--text)}
.pill svg{width:14px;height:14px;color:var(--acc-bright)}
.callbox{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--acc);border-radius:16px;padding:30px;margin-top:auto}
.callbox h3{font-size:1.36rem;font-weight:700;margin-bottom:11px}
.callbox p{color:var(--muted);margin-bottom:22px}
.area-map{position:relative;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);min-height:420px}
.area-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(.2) contrast(1.05)}

/* ---------- faq ---------- */
.acc{max-width:860px;margin:0 auto}
.acc details{border:1px solid var(--line);border-radius:14px;background:var(--panel);margin-bottom:12px;overflow:hidden;transition:border-color .2s}
.acc details[open]{border-color:var(--acc-line)}
.acc summary{list-style:none;cursor:pointer;padding:22px 26px;font-family:'Archivo';font-weight:700;font-size:1.04rem;display:flex;justify-content:space-between;align-items:center;gap:16px;transition:background .15s}
.acc summary:hover{background:var(--panel-2)}
.acc summary::-webkit-details-marker{display:none}
.acc summary .pm{flex:0 0 auto;width:22px;height:22px;color:var(--acc-bright);transition:transform .22s var(--ease)}
.acc details[open] summary .pm{transform:rotate(45deg)}
.acc .a{padding:0 26px 24px;color:var(--muted);line-height:1.7}

/* ============================================================
   CTA band — now uses a real photo bg, not flat gradient void
   ============================================================ */
.band{position:relative;border-radius:var(--r-lg);padding:64px 50px;text-align:center;overflow:hidden;border:1px solid var(--line-2);background:var(--panel)}

/* ---------- full bleed photo CTA banner ---------- */
.fb-banner{position:relative;width:100%;min-height:420px;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;background:var(--ink-2)}
.fb-banner-bg{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;background-attachment:fixed}
.fb-banner-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,11,16,.78),rgba(8,11,16,.68) 50%,rgba(8,11,16,.82)),linear-gradient(110deg,rgba(43,127,192,.28),transparent 60%)}
.fb-inner{position:relative;z-index:2;max-width:760px;padding:88px 24px}
.fb-banner .eyebrow{justify-content:center}
.fb-banner h2{font-family:'Archivo';font-weight:800;font-size:clamp(2rem,4vw,3rem);line-height:1.08;letter-spacing:-.02em;color:#fff;margin:0 0 16px}
.fb-banner p{color:#d6e0ea;font-size:1.08rem;line-height:1.6;margin:0 auto 30px;max-width:560px}
.fb-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.fb-stats{display:flex;gap:42px;justify-content:center;flex-wrap:wrap;margin-top:38px;padding-top:30px;border-top:1px solid rgba(255,255,255,.14)}
.fb-stats .fb-stat{text-align:center}
.fb-stats .fb-stat b{display:block;font-family:'Archivo';font-weight:800;font-size:2rem;color:#fff;line-height:1}
.fb-stats .fb-stat span{display:block;color:#aebfce;font-size:.82rem;margin-top:7px;letter-spacing:.04em}
@media(max-width:640px){
  .fb-banner-bg{background-attachment:scroll}
  .fb-inner{padding:64px 20px}
  .fb-stats{gap:26px;margin-top:28px}
  .fb-stats .fb-stat b{font-size:1.6rem}
}
.band-bg{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center}
.band-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(8,11,16,.82),rgba(10,14,20,.62) 50%,rgba(63,122,163,.45))}
.band>*{position:relative;z-index:2}
.band>.band-bg{position:absolute;z-index:0}
.band .eyebrow{justify-content:center;color:var(--acc-bright)}
.band h2{font-size:clamp(1.9rem,3.8vw,2.7rem);font-weight:800;margin-bottom:14px}
.band p{color:#cfdce7;margin-bottom:28px;max-width:560px;margin-left:auto;margin-right:auto}
.band .btns{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}

/* ---------- quote form ---------- */
.quote-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:48px;align-items:start}
form.q{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);padding:34px;box-shadow:var(--shadow)}
.field{margin-bottom:17px}
.field label{display:block;font-family:'Archivo';font-weight:600;font-size:.88rem;margin-bottom:8px;color:#dbe4ec}
.field label .req{color:var(--acc-bright)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
input,select,textarea{width:100%;background:var(--ink);border:1px solid var(--line-2);border-radius:10px;padding:14px 16px;color:#fff;font-family:inherit;font-size:1rem;transition:border-color .15s,box-shadow .15s}
input::placeholder,textarea::placeholder{color:#52646f}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px var(--acc-wash)}
select option{background:var(--ink)}
textarea{resize:vertical;min-height:104px}
.benefits{list-style:none;display:grid;gap:18px;margin-bottom:30px}
.benefits li{display:flex;align-items:center;gap:13px;font-weight:500;color:var(--text)}
.benefits .tk{width:26px;height:26px;border-radius:8px;background:var(--acc-wash);border:1px solid var(--acc-line);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.benefits .tk svg{width:15px;height:15px;color:var(--acc-bright)}
.formnote{color:var(--faint);font-size:.82rem;margin-top:12px;text-align:center}
.formnote a{color:var(--acc-bright)}
.thanks{display:none;background:var(--acc-wash);border:1px solid var(--acc-line);border-radius:14px;padding:26px;text-align:center}
.thanks h3{color:var(--acc-bright);margin-bottom:8px}
.contactcards{display:grid;gap:14px;margin-bottom:28px}
.ccard{display:flex;gap:15px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px 22px}
.ccard .ic{width:46px;height:46px;border-radius:12px;background:var(--acc-wash);border:1px solid var(--acc-line);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.ccard .ic svg{width:20px;height:20px;color:var(--acc-bright)}
.ccard b{display:block;font-family:'Archivo'}
.ccard span{color:var(--muted);font-size:.92rem}

/* ---------- footer ---------- */
footer.site{background:#06090f;border-top:1px solid var(--line);padding:64px 0 34px}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr auto;gap:44px}
.foot-grid img.flogo{height:54px;margin-bottom:20px}
.foot-grid p{color:var(--muted);font-size:.94rem;max-width:300px}
.foot h4{font-family:'Archivo';font-weight:700;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:18px;color:#fff}
.foot ul{list-style:none;display:grid;gap:12px}
.foot a{color:var(--muted);font-size:.94rem;transition:color .15s}.foot a:hover{color:var(--acc-bright)}
.foot .contactline{display:flex;align-items:flex-start;gap:10px;color:var(--muted);font-size:.94rem}
.foot .contactline svg{width:16px;height:16px;color:var(--acc-bright);flex:0 0 auto;margin-top:4px}
.foot-badges{display:flex;flex-wrap:wrap;gap:14px;margin-top:20px}
.foot-badges span{display:inline-flex;align-items:center;gap:7px;font-size:.84rem;color:var(--muted)}
.foot-badges svg{width:16px;height:16px;color:var(--acc-bright)}
.foot-bottom{border-top:1px solid var(--line);margin-top:46px;padding-top:26px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px;color:var(--faint);font-size:.85rem}
.socials{display:flex;gap:16px}.socials a{color:var(--faint);transition:color .15s}.socials a:hover{color:var(--acc-bright)}
.socials svg{width:20px;height:20px}
.foot-legal{border-top:1px solid var(--line);margin-top:40px;padding-top:22px}
.foot-legal p{color:#8a9bad;font-size:.75rem;line-height:1.65;max-width:900px;margin:0}
.foot-legal + .foot-bottom{margin-top:22px;padding-top:22px}
@media (max-width:640px){.foot-legal p{font-size:.72rem}}

/* ---------- whatsapp ---------- */
.wa{position:fixed;left:22px;bottom:22px;z-index:170;font-family:'Inter'}
/* launcher button (always visible) */
.wa-launcher{position:relative;width:62px;height:62px;border-radius:50%;background:#111;border:1px solid #2a2a2a;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.5);transition:transform .2s var(--ease)}
.wa-launcher:hover{transform:scale(1.06)}
.wa-launcher svg{width:34px;height:34px;color:#25D366}
.wa-launcher-pulse{position:absolute;inset:0;border-radius:50%;border:2px solid #25D366;opacity:0;animation:waPulse 2.6s ease-out infinite}
@keyframes waPulse{0%{opacity:.6;transform:scale(1)}70%{opacity:0;transform:scale(1.5)}100%{opacity:0}}
/* chat panel */
.wa-panel{position:absolute;bottom:76px;left:0;width:330px;max-width:calc(100vw - 44px);background:#0d0d0d;border:1px solid #262626;border-radius:18px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.6);opacity:0;visibility:hidden;transform:translateY(16px) scale(.97);transform-origin:bottom left;transition:opacity .25s var(--ease),transform .25s var(--ease),visibility .25s}
.wa.open .wa-panel{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.wa.open .wa-launcher-pulse{display:none}
.wa-head{display:flex;align-items:center;gap:12px;padding:16px 16px;background:#111;border-bottom:1px solid #222;position:relative}
.wa-head .wa-avatar{flex:0 0 auto;width:44px;height:44px;border-radius:50%;background:#000;border:1px solid #2c2c2c;display:flex;align-items:center;justify-content:center;overflow:hidden}
.wa-head .wa-avatar img{width:84%;height:auto}
.wa-head-txt strong{display:block;color:#fff;font-family:'Archivo';font-weight:700;font-size:.96rem;line-height:1.2}
.wa-head-txt .status{display:flex;align-items:center;gap:6px;color:#9aa3ab;font-size:.78rem;margin-top:3px}
.wa-head-txt .status-dot{width:8px;height:8px;border-radius:50%;background:#25D366;box-shadow:0 0 0 3px rgba(37,211,102,.18)}
.wa-close{position:absolute;top:12px;right:12px;width:30px;height:30px;border-radius:50%;background:transparent;color:#8a8a8a;border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .15s,background .15s}
.wa-close svg{width:17px;height:17px}
.wa-close:hover{color:#fff;background:#1e1e1e}
.wa-body{padding:20px 16px 8px;background:#0d0d0d;background-image:radial-gradient(rgba(255,255,255,.02) 1px,transparent 0);background-size:18px 18px}
.wa-msg{background:#1c1c1c;color:#e8e8e8;font-size:.9rem;line-height:1.5;padding:11px 14px;border-radius:4px 14px 14px 14px;margin-bottom:9px;max-width:88%;box-shadow:0 1px 2px rgba(0,0,0,.3)}
.wa-msg-time{color:#5e5e5e;font-size:.72rem;margin:4px 2px 0}
.wa-start{display:flex;align-items:center;justify-content:center;gap:10px;margin:14px 16px 18px;padding:14px;background:#25D366;color:#062b14;font-family:'Archivo';font-weight:700;font-size:.95rem;border-radius:12px;transition:background .15s,transform .15s}
.wa-start svg{width:20px;height:20px}
.wa-start:hover{background:#2ee575;transform:translateY(-1px)}
@keyframes waIn{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}

/* ---------- recent booking toast (social proof) ---------- */
.booking-toast{position:fixed;left:22px;bottom:96px;z-index:168;width:300px;max-width:calc(100vw - 44px);display:flex;align-items:flex-start;gap:12px;padding:14px 16px 14px 14px;background:rgba(18,25,37,.97);border:1px solid var(--line-2);border-left:3px solid var(--acc);border-radius:14px;box-shadow:0 16px 40px rgba(0,0,0,.55);backdrop-filter:blur(8px);opacity:0;visibility:hidden;transform:translateX(-20px) scale(.97);transition:opacity .4s var(--ease),transform .4s var(--ease),visibility .4s;pointer-events:none}
.booking-toast.show{opacity:1;visibility:visible;transform:translateX(0) scale(1);pointer-events:auto}
.booking-ico{flex:0 0 auto;width:38px;height:38px;border-radius:50%;background:var(--acc-wash);border:1px solid var(--acc-line);display:flex;align-items:center;justify-content:center;margin-top:1px}
.booking-ico svg{width:19px;height:19px;color:var(--acc-bright)}
.booking-body{min-width:0;flex:1}
.booking-main{color:var(--text);font-size:.9rem;font-weight:600;line-height:1.35;margin:0 0 3px;font-family:'Inter'}
.booking-sub{color:var(--muted);font-size:.78rem;line-height:1.3;margin:0}
.booking-x{position:absolute;top:8px;right:9px;width:22px;height:22px;border:0;background:transparent;color:var(--faint);font-size:18px;line-height:1;cursor:pointer;border-radius:6px;transition:color .15s,background .15s;display:flex;align-items:center;justify-content:center}
.booking-x:hover{color:var(--text);background:rgba(255,255,255,.06)}
@media(max-width:640px){
  .booking-toast{left:12px;right:12px;bottom:84px;width:auto;max-width:none}
}

/* ---------- sticky cta ---------- */
.sticky-cta{position:fixed;right:20px;bottom:20px;z-index:165;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .3s ease,transform .3s ease,visibility .3s}
.sticky-cta.show{opacity:1;visibility:visible;transform:translateY(0)}
.sticky-cta a{display:inline-flex;align-items:center;gap:9px;background:#fff;color:#0a0e14;font-family:'Archivo';font-weight:700;padding:14px 22px;border-radius:999px;box-shadow:0 12px 34px rgba(0,0,0,.5)}
.sticky-cta svg{width:20px;height:20px;color:var(--acc)}

/* ---------- scroll reveal ---------- */
.reveal{transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.pre{opacity:0;transform:translateY(22px)}
.reveal.in{opacity:1;transform:none}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:980px){
  .navlinks,.navphone{display:none}
  .burger{display:flex;align-items:center;justify-content:center}
  .two,.two.flip,.areas-grid,.quote-grid{grid-template-columns:1fr;gap:40px}
  .two.flip>*:first-child,.two.flip>*:last-child{order:0}
  .svc-grid{grid-template-columns:1fr}
  .grid2{grid-template-columns:1fr 1fr}
  .ba-grid,.ba-grid.three{grid-template-columns:1fr 1fr}
  .rev-grid{grid-template-columns:repeat(2,1fr)}
  .grid4{grid-template-columns:1fr 1fr}
  .gal,.gal.three{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1fr 1fr;gap:34px}
  .media.r45{aspect-ratio:16/11;max-width:580px;margin:0 auto}
  .band{padding:48px 30px}
  .steps{grid-template-columns:repeat(3,1fr)}
  .steps.four{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .section{padding:66px 0}
  .stats{grid-template-columns:repeat(3,1fr);gap:9px}.stat{padding:18px 8px}
  .grid2,.grid3,.grid4,.steps,.gal,.gal.three,.rev-grid,.ba-grid,.ba-grid.three,.svc-grid{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .row2{grid-template-columns:1fr}
  .sticky-cta a span{display:none}.sticky-cta a{padding:16px}
  body{padding-bottom:78px}
  .wa-bubble{max-width:calc(100vw - 100px)}
  .band{padding:38px 22px}
  .mobilemenu{top:70px}
  .nav{height:70px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.track{transform:none!important}.reveal,.reveal.pre{opacity:1;transform:none;transition:none}}

/* ============================================================
   MOBILE HERO — clean, no wall of text
   ============================================================ */
@media(max-width:640px){
  .hero{min-height:auto;padding:104px 0 60px;align-items:flex-end}
  .hero.short{padding:96px 0 48px}
  .hero-inner{padding-top:0}
  .hero h1{font-size:2.4rem;line-height:1.08;margin-bottom:14px}
  .hero h1.page{font-size:2.15rem}
  .rating-pill{font-size:.78rem;padding:7px 14px;margin-bottom:18px;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
  .rating-pill .stars{font-size:.82rem}
  .hero p.sub{font-size:.98rem;line-height:1.5;margin-bottom:22px}
  .hero.short p.sub{font-size:.95rem;margin-bottom:20px}
  .hero-cta{flex-direction:column;gap:11px;margin-bottom:24px}
  .hero-cta .btn{width:100%;padding:15px 20px}
  .hero-trust{gap:10px 18px;font-size:.84rem}
  .hero-trust span{gap:7px}
  .hero-trust svg{width:15px;height:15px}
  .hero-trust span:nth-child(n+4){display:none}
  .breadcrumb{font-size:.78rem;margin-bottom:12px}
  .hero-bg::after{background:linear-gradient(0deg,var(--ink) 4%,rgba(8,11,16,.42) 55%,rgba(8,11,16,.30))}
}

/* ============================================================
   COMMERCIAL PAGE additions
   ============================================================ */
/* sector strip marquee */
.sector-strip{background:var(--ink-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0}
.sector-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.sector-track{display:flex;gap:14px;width:max-content;will-change:transform}
.sector-chip{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-family:'Archivo';font-weight:600;font-size:.9rem;color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:9px 18px}
.sector-chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--acc);flex:0 0 auto}

/* numbered commercial service grid */
.cnum-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.cnum{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:34px 28px 30px;transition:border-color .2s,transform .2s var(--ease);overflow:hidden}
.cnum:hover{border-color:var(--acc-line);transform:translateY(-4px)}
.cnum-n{font-family:'Archivo';font-weight:800;font-size:1rem;color:var(--acc-bright);letter-spacing:.05em;margin-bottom:16px;display:inline-block;padding-bottom:10px;border-bottom:2px solid var(--acc-line)}
.cnum h3{font-size:1.22rem;font-weight:700;margin-bottom:10px}
.cnum p{color:var(--muted);font-size:.96rem}

/* comparison table */
.cmp-wrap{max-width:920px;margin:0 auto;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.cmp{width:100%;border-collapse:collapse;font-size:.98rem}
.cmp th,.cmp td{padding:18px 22px;text-align:left;border-bottom:1px solid var(--line)}
.cmp thead th{background:var(--panel-2);font-family:'Archivo';font-weight:700;color:#fff;font-size:.9rem}
.cmp th.c,.cmp td.c{text-align:center;width:170px}
.cmp tbody tr:last-child td{border-bottom:0}
.cmp tbody td{color:var(--muted)}
.cmp tbody tr:nth-child(odd) td{background:rgba(255,255,255,.012)}
.cmp .yes{color:#4fc77f;font-weight:800;font-size:1.2rem}
.cmp .no{color:#5a6b7a;font-weight:700;font-size:1.15rem}
.cmp .varies{color:var(--faint);font-size:.86rem;font-style:italic}
.cmp thead th.c:nth-child(2){color:var(--acc-bright)}

/* case study */
.casestudy{display:grid;grid-template-columns:.85fr 1.15fr;gap:0;border:1px solid var(--line-2);border-radius:var(--r-lg);overflow:hidden;background:var(--panel)}
.cs-media{position:relative;min-height:100%}
.cs-media img{width:100%;height:100%;object-fit:cover;min-height:420px}
.cs-body{padding:44px 46px}
.cs-tag{display:inline-block;font-family:'Archivo';font-weight:700;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--acc-bright);background:var(--acc-wash);border:1px solid var(--acc-line);border-radius:999px;padding:7px 15px;margin-bottom:18px}
.cs-body h3.sub{margin-bottom:16px}
.cs-body>p{color:var(--muted);margin-bottom:16px}
.cs-metrics{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:26px 0;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cs-metric{display:flex;flex-direction:column;gap:4px}
.cs-metric .l{font-size:.76rem;text-transform:uppercase;letter-spacing:.08em;color:var(--faint);font-weight:600}
.cs-metric .v{font-family:'Archivo';font-weight:700;color:#fff;font-size:1.02rem}
.cs-quote{border-left:3px solid var(--acc);padding-left:22px}
.cs-quote p{font-style:italic;color:var(--text);font-size:1.05rem;margin-bottom:18px;line-height:1.6}
.cs-author{display:flex;align-items:center;gap:14px}
.cs-author>img:first-child{width:54px;height:54px;border-radius:50%;object-fit:cover;border:2px solid var(--acc-line)}
.cs-author b{display:block;font-family:'Archivo';font-size:1rem}
.cs-author span{color:var(--faint);font-size:.84rem}
.cs-author .cs-logo{width:auto;height:38px;margin-left:auto;border-radius:8px;background:#000;padding:4px 8px}
.cs-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:16px}
.cs-strip figure{position:relative;margin:0;border-radius:14px;overflow:hidden;border:1px solid var(--line)}
.cs-strip img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .4s var(--ease)}
.cs-strip figure:hover img{transform:scale(1.05)}
.cs-strip figcaption{position:absolute;left:0;right:0;bottom:0;padding:22px 12px 10px;font-size:.78rem;font-weight:600;color:#fff;background:linear-gradient(0deg,rgba(8,11,16,.92),transparent)}

@media(max-width:980px){
  .cnum-grid{grid-template-columns:repeat(3,1fr)}
  .casestudy{grid-template-columns:1fr}
  .cs-media img{min-height:300px}
  .cs-strip{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:640px){
  .cnum-grid{grid-template-columns:1fr}
  .cs-body{padding:32px 24px}
  .cs-metrics{grid-template-columns:1fr 1fr}
  .cs-strip{grid-template-columns:1fr 1fr}
  .cs-author .cs-logo{display:none}
  .cmp th,.cmp td{padding:14px 12px;font-size:.86rem}
  .cmp th.c,.cmp td.c{width:80px}
}

/* ---------- video frame (pressure washing "watch the difference") ---------- */
.video-col{display:flex;justify-content:center}
.videoframe{position:relative;width:100%;max-width:340px;aspect-ratio:9/16;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line-2);box-shadow:var(--shadow);background:#000}
.videoframe iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@media(max-width:980px){.videoframe{max-width:300px}}
@media(max-width:640px){.videoframe{max-width:260px}}

/* ============================================================
   PREMIUM UPGRADE — white sections, animations, Google cards
   ============================================================ */

/* --- White / light section variant --- */
.section.light{background:#fff;color:#0a0e14}
.section.light h2.h,.section.light h3,.section.light h4{color:#0a0e14}
.section.light .eyebrow{color:var(--acc-deep)}
.section.light .eyebrow::before{background:var(--acc-deep)}
.section.light .lead,.section.light .prose p{color:#3d4f5e}
.section.light .muted{color:#5a7080}
.section.light .card{background:#f4f7fa;border-color:#dce5ed;color:#0a0e14}
.section.light .card h3{color:#0a0e14}
.section.light .card p{color:#4a6070}
.section.light .step{background:#f4f7fa;border-color:#dce5ed}
.section.light .step h3{color:#0a0e14}
.section.light .step p{color:#4a6070}
.section.light .step .num{background:rgba(61,155,224,.14);border-color:rgba(61,155,224,.35);color:var(--acc-deep)}
.section.light .acc details{background:#fff;border-color:#dce5ed}
.section.light .acc summary{color:#0a0e14}
.section.light .acc .a{color:#4a6070}
.section.light .pill{background:#eaf1f8;border-color:#cddbe8;color:#2d4a5c}
.section.light .callbox{background:#f0f5fa;border-color:#cddbe8}
.section.light .callbox h3{color:#0a0e14}
.section.light .callbox p{color:#4a6070}
.section.light ul.ticks li{color:#4a6070}
.section.light ul.ticks li strong{color:#0a0e14}

/* --- Google review cards — white, proper widget style --- */
.rev-white{width:340px;background:#fff;border:1px solid #e8ecef;border-radius:12px;padding:22px 24px;flex:0 0 auto;box-shadow:0 2px 12px rgba(0,0,0,.07)}
.rev-white .rw-top{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.rev-white .rw-avatar{width:40px;height:40px;border-radius:50%;background:var(--acc-deep);display:flex;align-items:center;justify-content:center;font-family:'Archivo';font-weight:800;font-size:1rem;color:#fff;flex:0 0 auto}
.rev-white .rw-name{font-family:'Archivo';font-weight:700;color:#0a0e14;font-size:.95rem;line-height:1.2}
.rev-white .rw-src{display:flex;align-items:center;gap:5px;color:#5f6368;font-size:.78rem;margin-top:2px}
.rev-white .rw-stars{color:#fbbc05;font-size:.95rem;letter-spacing:1px;margin-bottom:10px;display:block}
.rev-white p{color:#3c4043;font-size:.9rem;line-height:1.55;font-style:italic}
/* marquee container uses white-card reviews */
.reviews-white{background:var(--ink-2);padding:56px 0}
.reviews-white .track-white{display:flex;gap:18px;width:max-content;will-change:transform}

/* --- Staggered animation --- */
@keyframes fadeUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideRight{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:translateX(0)}}
@keyframes scaleIn{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}
@keyframes lineGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}

.animate-up{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}
.animate-up.fired{opacity:1;transform:none}
.animate-up.d1{transition-delay:.1s}
.animate-up.d2{transition-delay:.2s}
.animate-up.d3{transition-delay:.3s}
.animate-up.d4{transition-delay:.4s}
.animate-up.d5{transition-delay:.5s}
.animate-up.d6{transition-delay:.6s}

/* --- Hero upgrade --- */
/* Make homepage hero genuinely full-height and split */
.hero.full{min-height:100vh;min-height:100svh}
/* Floating number accent in hero */
.hero-accent-num{position:absolute;right:10%;top:50%;transform:translateY(-50%);font-family:'Archivo';font-weight:900;font-size:clamp(160px,20vw,300px);color:rgba(255,255,255,.025);line-height:1;pointer-events:none;z-index:1;letter-spacing:-.04em;user-select:none}
/* Hero split — text left, big stat right */
.hero-split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding-top:44px}
.hero-split-right{display:flex;flex-direction:column;gap:16px}
.hero-stat-block{background:rgba(255,255,255,.05);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:30px;text-align:center}
.hero-stat-block .big{font-family:'Archivo';font-weight:900;font-size:clamp(3rem,5vw,4.5rem);color:#fff;line-height:1;letter-spacing:-.03em}
.hero-stat-block .big span{color:var(--acc-bright)}
.hero-stat-block .label{color:#9fb0c0;font-size:.88rem;margin-top:8px;letter-spacing:.06em;text-transform:uppercase;font-weight:600}
@media(max-width:860px){
  .hero-split{grid-template-columns:1fr;padding-top:20px}
  .hero-split-right{flex-direction:row;flex-wrap:wrap}
  .hero-stat-block{flex:1;min-width:140px}
}

/* --- Commercial hero fix --- same height as other heroes --- */
.hero.short.commercial-hero{min-height:clamp(680px,94vh,880px)}

/* --- Bold text accent lines (horizontal rule style) --- */
.accent-rule{display:block;width:48px;height:3px;background:var(--acc);border-radius:2px;margin:18px 0 26px}
.center .accent-rule{margin-left:auto;margin-right:auto}

/* --- Split section with background photo on one side --- */
.split-photo{display:grid;grid-template-columns:1fr 1fr;min-height:560px}
.split-photo-img{position:relative;overflow:hidden}
.split-photo-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.split-photo-content{display:flex;flex-direction:column;justify-content:center;padding:72px 64px}
.split-photo-content.dark{background:var(--ink)}
.split-photo-content.light-bg{background:#fff;color:#0a0e14}
.split-photo-content.light-bg h2{color:#0a0e14}
.split-photo-content.light-bg p,.split-photo-content.light-bg .lead{color:#3d4f5e}
.split-photo-content.light-bg .eyebrow{color:var(--acc-deep)}
.split-photo-content.light-bg .eyebrow::before{background:var(--acc-deep)}
.split-photo-content.light-bg .accent-rule{background:var(--acc-deep)}
.split-photo-content.light-bg ul.ticks li{color:#4a6070}
.split-photo-content.light-bg ul.ticks li strong{color:#0a0e14}
@media(max-width:860px){
  .split-photo{grid-template-columns:1fr}
  .split-photo-img{min-height:300px;position:relative}
  .split-photo-img img{position:relative;width:100%;height:300px}
  .split-photo-content{padding:48px 28px}
}

/* --- Full bleed section with bg image (non-fixed, reliable) --- */
.photo-section{position:relative;overflow:hidden;min-height:480px;display:flex;align-items:center}
.photo-section-bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0}
.photo-section-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,11,16,.92) 0%,rgba(8,11,16,.78) 45%,rgba(8,11,16,.4) 100%)}
.photo-section .wrap{position:relative;z-index:2}
.photo-section.overlay-center .photo-section-bg::after{background:rgba(6,9,14,.82)}
.photo-section.overlay-center{text-align:center}
.photo-section.overlay-center .hero-inner{max-width:860px;margin:0 auto;padding:88px 0}

/* --- Marquee strip variant for section breaks --- */
.photo-strip{height:260px;overflow:hidden;position:relative}
.photo-strip-track{display:flex;gap:12px;width:max-content;height:100%;will-change:transform}
.photo-strip-track img{height:100%;width:auto;aspect-ratio:3/2;border-radius:12px;object-fit:cover;pointer-events:none}

/* --- Numbered list (for "why us" etc) --- */
.numlist{list-style:none;display:grid;gap:24px}
.numlist li{display:grid;grid-template-columns:56px 1fr;gap:18px;align-items:start}
.numlist .nl-num{font-family:'Archivo';font-weight:900;font-size:1.8rem;color:var(--acc-bright);line-height:1;opacity:.8}
.numlist h4{font-family:'Archivo';font-weight:700;font-size:1.08rem;margin-bottom:6px}
.numlist p{color:var(--muted);font-size:.96rem}
.section.light .numlist .nl-num{color:var(--acc-deep)}
.section.light .numlist h4{color:#0a0e14}
.section.light .numlist p{color:#4a6070}


/* Gallery editorial grid - simpler reliable layout */
.gal-editorial{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;grid-auto-flow:dense}
.gal-editorial .ge-wide{grid-column:span 2}
.gal-editorial .ge-tall{grid-row:span 2}
.gal-editorial .ge-norm{grid-column:span 1}
.gal-editorial figure{margin:0;border-radius:14px;overflow:hidden;border:1px solid var(--line);cursor:zoom-in;position:relative;min-height:220px}
.gal-editorial figure img{width:100%;height:100%;min-height:220px;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.22,1,.36,1)}
.gal-editorial figure:hover img{transform:scale(1.04)}
.gal-editorial figure figcaption{position:absolute;left:0;right:0;bottom:0;padding:32px 16px 13px;font-size:.82rem;font-weight:600;color:#fff;background:linear-gradient(0deg,rgba(8,11,16,.9),transparent);z-index:2}
@media(max-width:860px){
  .gal-editorial{grid-template-columns:1fr 1fr}
  .gal-editorial .ge-wide,.gal-editorial .ge-tall,.gal-editorial .ge-norm{grid-column:span 1;grid-row:span 1}
}
@media(max-width:480px){.gal-editorial{grid-template-columns:1fr}}


/* --- Contact split layout --- */
.contact-split{display:grid;grid-template-columns:1fr 1fr;min-height:600px}
.contact-split-left{position:relative;overflow:hidden}
.contact-split-left-img{position:absolute;inset:0;background-size:cover;background-position:center}
.contact-split-left-img::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(8,11,16,.75) 0%,rgba(8,11,16,.50) 60%)}
.contact-split-left-inner{position:relative;z-index:2;padding:64px 56px;display:flex;flex-direction:column;justify-content:space-between;height:100%}
.contact-split-right{background:var(--ink-2);padding:64px 56px;display:flex;flex-direction:column;justify-content:center}
@media(max-width:900px){
  .contact-split{grid-template-columns:1fr}
  .contact-split-left{min-height:320px}
  .contact-split-left-inner{padding:40px 28px}
  .contact-split-right{padding:48px 28px}
}

/* --- Big number highlight --- */
.num-highlight{font-family:'Archivo';font-weight:900;font-size:clamp(3.5rem,7vw,6rem);color:var(--acc-bright);line-height:1;letter-spacing:-.04em}
.section.light .num-highlight{color:var(--acc-deep)}


/* Stats inside light/split sections */
.split-photo-content.light-bg .stats{margin-top:36px}
.split-photo-content.light-bg .stat{background:#f0f4f8;border-color:#dce5ed}
.split-photo-content.light-bg .stat .n{color:var(--acc-deep)}
.split-photo-content.light-bg .stat .t{color:#5a7080}

/* Photo strip height */
.photo-strip{height:220px}
.photo-strip-track img{height:220px;width:auto;object-fit:cover;border-radius:0}

/* Contact split responsive */
@media(max-width:900px){
  .contact-split{grid-template-columns:1fr}
  .contact-split-left{min-height:280px}
}

/* Review cards scrolling edge fade */
.reviews-white .marquee{
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 6%,#000 94%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 6%,#000 94%,transparent 100%);
  overflow:hidden;
}

/* section.light heading colour fix */
.section.light .h{color:#0a0e14}

/* photo-section stats */
.photo-section .fb-stats{display:flex;gap:32px;justify-content:center;margin-top:28px;padding-top:28px;border-top:1px solid rgba(255,255,255,.15)}
.photo-section .fb-stat b{display:block;font-family:'Archivo';font-weight:800;font-size:1.6rem;color:#fff}
.photo-section .fb-stat span{font-size:.82rem;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.06em}



/* ====================================================
   COMPREHENSIVE MOBILE FIXES
   ==================================================== */

/* Hero split mobile - collapse properly */
@media(max-width:768px){
  .hero-split{
    grid-template-columns:1fr;
    gap:28px;
    padding-top:14px;
    padding-bottom:28px;
  }
  .hero-split-right{
    flex-direction:row;
    flex-wrap:wrap;
    gap:10px;
  }
  .hero-stat-block{
    flex:1;
    min-width:120px;
    padding:18px 12px;
  }
  .hero-stat-block .big{font-size:2rem}
  .hero-stat-block .label{font-size:.72rem}
  .hero.full{min-height:auto;padding-bottom:32px}
}

/* Photo strip mobile */
@media(max-width:768px){
  .photo-strip{height:160px}
  .photo-strip-track img{height:160px}
}

/* Split photo mobile */
@media(max-width:768px){
  .split-photo{grid-template-columns:1fr}
  .split-photo-img{min-height:260px;max-height:340px;position:relative;overflow:hidden}
  .split-photo-img img{width:100%;height:100%;object-fit:cover;position:absolute;top:0;left:0}
  .split-photo-content{padding:40px 22px}
}

/* Contact split mobile */
@media(max-width:768px){
  .contact-split{grid-template-columns:1fr}
  .contact-split-left{min-height:260px}
  .contact-split-right{padding:36px 22px}
  .contact-split-left-inner{padding:28px 22px}
}

/* Review marquee mobile - no fade edges that cut off */
@media(max-width:768px){
  .reviews-white .marquee{
    -webkit-mask-image:none;
    mask-image:none;
  }
  .rev-white{width:290px;padding:18px 18px}
}

/* Photo section mobile */
@media(max-width:768px){
  .photo-section .hero-inner{padding:64px 0}
  .photo-section .h{font-size:clamp(1.8rem,5vw,2.6rem)}
  .photo-section .fb-stats{flex-wrap:wrap;gap:18px}
}

/* Service cards mobile */
@media(max-width:768px){
  .svc-grid{grid-template-columns:1fr}
  .svc.span2{grid-column:span 1}
}

/* Gallery editorial mobile (ensure no black gaps) */
@media(max-width:768px){
  .gal-editorial{grid-template-columns:1fr 1fr;gap:10px}
  .gal-editorial figure{min-height:180px}
}
@media(max-width:480px){
  .gal-editorial{grid-template-columns:1fr}
  .gal-editorial figure{min-height:220px}
}

/* Wrap padding on mobile */
@media(max-width:480px){
  .wrap{padding:0 16px}
  h2.h{font-size:clamp(1.6rem,6vw,2.2rem)}
}

/* Nav hamburger ensure works */
@media(max-width:860px){
  .site-nav .navlinks,.site-nav .tel,.site-nav .btn{display:none}
  .site-nav .hamburger{display:flex}
}
@media(min-width:861px){
  .mobilemenu{display:none!important}
  .hamburger{display:none!important}
}



/* ================================================
   MOBILE PATCH v2 - fix all identified issues
   ================================================ */

/* Fix split-photo text overflow on mobile */
@media(max-width:860px){
  .split-photo{display:flex;flex-direction:column}
  .split-photo-img{width:100%;height:280px;flex:none;position:relative;overflow:hidden}
  .split-photo-img img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}
  .split-photo-content{width:100%;box-sizing:border-box;padding:40px 20px;overflow:hidden}
  .split-photo-content h2,.split-photo-content .h{word-break:break-word}
  .split-photo-content .lead{max-width:100%}
  .split-photo-content .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
  .split-photo-content .stat{padding:14px 8px}
  .split-photo-content .stat .n{font-size:1.6rem}
}

/* Fix hero stat blocks - force 3 across on mobile */
@media(max-width:768px){
  .hero-split-right{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
    width:100%;
  }
  .hero-stat-block{
    padding:14px 8px;
    min-width:0;
    flex:none;
  }
  .hero-stat-block .big{font-size:1.5rem}
  .hero-stat-block .label{font-size:.65rem;letter-spacing:.03em}
}

/* Fix before/after sliders on mobile - prevent images escaping */
.ba{overflow:hidden;position:relative}
.ba .layer{position:absolute;inset:0;overflow:hidden}
.ba .layer img{width:100%;height:100%;object-fit:cover;display:block}

/* Fix ba-grid on mobile - single column, sensible height */
@media(max-width:640px){
  .ba-grid{grid-template-columns:1fr !important}
  .ba{aspect-ratio:4/3}
}
@media(max-width:860px){
  .ba-grid.three{grid-template-columns:1fr}
  .ba{aspect-ratio:4/3}
}

/* Fix review marquee on mobile */
@media(max-width:640px){
  .reviews-white .marquee{overflow:hidden}
  .track-white{padding:4px 0}
  .rev-white{width:280px;padding:16px}
  .rev-white p{font-size:.85rem}
}

/* Fix photo section on mobile */
@media(max-width:640px){
  .photo-section .hero-inner{padding:48px 0}
  .photo-section .h{font-size:1.6rem}
  .photo-section .fb-stats{flex-direction:row;flex-wrap:wrap;gap:16px;justify-content:center}
  .photo-section .fb-stat{min-width:80px;text-align:center}
}

/* Fix contact split */
@media(max-width:768px){
  .contact-split{display:flex;flex-direction:column}
  .contact-split-left{min-height:240px;position:relative}
  .contact-split-left-img{position:absolute;inset:0}
  .contact-split-right{padding:32px 20px;box-sizing:border-box}
}

/* General mobile overflow guard */
@media(max-width:768px){
  body{overflow-x:hidden}
  .wrap{box-sizing:border-box;width:100%;max-width:100%}
  section,main{overflow-x:hidden;max-width:100vw}
}

/* Photo strip on mobile - shorter and faster */
@media(max-width:640px){
  .photo-strip{height:140px}
  .photo-strip-track img{height:140px}
}


/* Photo strip must not overflow */
.photo-strip{overflow:hidden !important;position:relative}
.photo-strip-track{display:flex !important;flex-wrap:nowrap !important;will-change:transform}
.photo-strip-track img{flex-shrink:0;border-radius:8px;object-fit:cover}


/* ============================================================
   MOBILE FIX PASS — June (header declutter, trust align,
   eyebrow legibility, toast, footer, email overflow, menu CTA)
   These are appended last so they win the cascade.
   ============================================================ */

/* B) Header: drop the "Get Free Quote" button on mobile/tablet.
   Logo + hamburger only — the menu and hero already carry the CTA. */
@media(max-width:980px){
  .navcta .btn{display:none}
  .navcta{gap:0}
}

/* C) Hero eyebrow + over-photo eyebrows: white for legibility on busy images */
.hero .eyebrow{color:#fff}
.hero .eyebrow::before{background:#fff;opacity:.85}
.contact-split-left-inner .eyebrow{color:#fff}
.contact-split-left-inner .eyebrow::before{background:#fff;opacity:.85}

/* E) Hero trust badges: clean vertical stack on mobile, never a broken 2+1 wrap */
@media(max-width:640px){
  .hero-trust{flex-direction:column;align-items:flex-start;gap:12px;width:100%}
  .hero-trust span{gap:9px}
  .hero-trust span:nth-child(n+4){display:flex} /* show all when stacked */
}

/* G) Mobile menu CTA: dark text on the light button (was white-on-white) */
.mobilemenu a.btn,
.mobilemenu a.btn-primary{color:#0a0e14}

/* F) Email never runs off screen — break long address anywhere */
.foot .contactline a,
.foot .contactline,
.ccard span,
.ccard b{overflow-wrap:anywhere;word-break:break-word;min-width:0}

/* H) Footer: single clean column on phones, nothing clipped or overlapping */
@media(max-width:640px){
  .foot-grid{grid-template-columns:1fr;gap:30px;text-align:left;width:100%}
  .foot-grid>div{min-width:0}
  .foot-grid p{max-width:100%}
  .foot ul{gap:11px}
  .foot-bottom{flex-direction:column;align-items:flex-start;gap:16px;text-align:left}
  .foot-badges{gap:10px 18px}
}

/* D) Booking toast: smaller, and it takes the WhatsApp launcher's spot.
   While the toast is up the WhatsApp button hides; it returns when the toast goes. */
.booking-toast{
  width:264px;
  padding:11px 30px 11px 12px;
  gap:11px;
  bottom:22px;left:22px;
  border-radius:13px;
}
.booking-ico{width:30px;height:30px}
.booking-ico svg{width:16px;height:16px}
.booking-main{font-size:.82rem}
.booking-sub{font-size:.72rem}
@media(max-width:640px){
  .booking-toast{left:12px;right:12px;bottom:22px;width:auto;max-width:none}
}
/* WhatsApp launcher fades out while a toast is showing, fades back after */
.wa{transition:opacity .3s var(--ease),visibility .3s}
body.toast-on .wa{opacity:0;visibility:hidden;pointer-events:none}

/* Footer email on one line on phones (was wrapping mid-word).
   Desktop keeps wrapping because its column is narrow. */
@media(max-width:640px){
  .foot .contactline a[href^="mailto:"]{
    white-space:nowrap;
    word-break:normal;
    overflow-wrap:normal;
    font-size:14px;
    letter-spacing:-.1px;
  }
}

/* Footer email: one line at every width (overrides the break-anywhere rule).
   Desktop column auto-sizes to fit it; mobile shrinks the font (see rule above). */
.foot .contactline a[href^="mailto:"]{
  white-space:nowrap;
  overflow-wrap:normal;
  word-break:normal;
}

/* ============ Upgrade pass ============ */

/* Per-page stat strip (replaces old Google-logo trust band) */
.strip-stat{display:inline-flex;align-items:center;gap:13px;font-size:1.04rem;color:var(--muted);font-weight:500;flex-wrap:wrap;justify-content:center;text-align:center;line-height:1.4}
.strip-stat strong{color:var(--acc-bright);font-weight:800;font-size:1.32rem;letter-spacing:.01em}
.strip-ic{width:27px;height:27px;color:var(--acc);flex:none}

/* Footer: Powered by Obsidian Media */
.foot-bottom .powered{color:var(--faint);font-size:.82rem}
.foot-bottom .powered a{color:var(--muted);text-decoration:none;border-bottom:1px solid var(--acc-line);transition:color .2s}
.foot-bottom .powered a:hover{color:var(--acc-bright)}

@media(max-width:640px){
  /* Stat cards: fit cleanly, never overlap */
  .stats, .split-photo-content .stats{grid-template-columns:repeat(3,1fr) !important;gap:8px}
  .stat{padding:15px 6px}
  .stat .n{font-size:clamp(1.3rem,5.2vw,1.7rem)}
  .stat .t{font-size:.57rem;letter-spacing:.02em;margin-top:6px;line-height:1.25}
  .strip-stat{font-size:.92rem;gap:10px}
  .strip-stat strong{font-size:1.12rem}
  .strip-ic{width:22px;height:22px}

  /* Contact: stop the two photo sections competing - darken the lower one to a textured panel */
  .contact-split-left-img::after{background:linear-gradient(160deg,rgba(8,11,16,.88) 0%,rgba(8,11,16,.93) 100%)}
  .contact-split-left{min-height:auto}
  .hero.short{min-height:60vh}
}

@media(max-width:640px){
  /* contact card email: fit on one line on phones */
  .contact-split-left-inner b + span{font-size:13.5px;letter-spacing:-.1px}
}

/* ===== Mobile cleanup pass (v20260628d) ===== */

/* Strip icon: hard cap so it can never blow up even without other CSS */
.strip-ic{width:26px;height:26px;max-width:26px;max-height:26px;flex:none}

@media(max-width:760px){
  /* Hero: deeper scrim so headline + buttons always pop over the photo */
  .hero-bg::after{background:linear-gradient(180deg,rgba(8,11,16,.66) 0%,rgba(8,11,16,.5) 38%,rgba(8,11,16,.76) 82%,var(--ink) 100%) !important}
  .hero h1{font-size:2.2rem;line-height:1.1;letter-spacing:-.02em;margin-bottom:16px}
  .hero p.sub{font-size:1rem;line-height:1.5}
}

@media(max-width:640px){
  /* Stat cards: number stacked over full label, always fits three across */
  .stats, .split-photo-content .stats{grid-template-columns:repeat(3,1fr) !important;gap:8px}
  .stat{padding:16px 5px;min-width:0}
  .stat .n{display:block;font-size:clamp(1.25rem,5vw,1.6rem)}
  .stat .t{display:block;font-size:.56rem;letter-spacing:.02em;margin-top:5px;line-height:1.25}
}

/* ============================================================
   HERO + STAT TICKER REFRESH (v20260628e)
   ============================================================ */

/* ---- Homepage hero now uses the centred .hero-home block at the end of this file ---- */
.hero-br{display:none}

/* ---- Hero trust badges: tidy pill row with separators (desktop/tablet) ---- */
@media(min-width:641px){
  .hero-trust{
    gap:0;
    align-items:center;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.10);
    border-radius:999px;
    padding:11px 8px;
    width:fit-content;
    backdrop-filter:blur(6px);
  }
  .hero-trust span{
    padding:0 20px;
    position:relative;
    font-size:.9rem;
    color:#d4dde6;
  }
  .hero-trust span + span::before{
    content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
    width:1px;height:16px;background:rgba(255,255,255,.16);
  }
}


/* ---- Hero trust badges on mobile: clean, evenly spaced stack ---- */
@media(max-width:640px){
  .hero-trust{
    flex-direction:column;align-items:flex-start;
    gap:13px;width:100%;
    background:none;border:0;padding:0;backdrop-filter:none;
  }
  .hero-trust span{padding:0;font-size:.95rem;color:#d4dde6}
  .hero-trust span + span::before{display:none}
  .hero-trust span:nth-child(n+4){display:flex}
}


/* ============================================================
   HOMEPAGE HERO — centred, full height
   Layout, spacing and mobile ladder ported from the Brightside
   build so the two sites behave identically. Arcline tokens,
   Archivo headline, Arcline accent.
   ============================================================ */
.hero.hero-home{
  min-height:100vh;min-height:100dvh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:9rem 2rem 4.5rem;
  overflow:hidden;background:var(--ink);
}
.hero.hero-home .hero-bg{
  position:absolute;inset:0;z-index:0;
  background-size:cover;background-position:center 55%;
  transform:none;animation:heroZoom 22s ease-out forwards;
}
.hero.hero-home .hero-bg::after{content:none}
@keyframes heroZoom{from{transform:scale(1.05)}to{transform:scale(1)}}
.hero-overlay{
  position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(180deg,rgba(6,11,20,.62) 0%,rgba(6,11,20,.42) 30%,rgba(6,11,20,.84) 88%,rgba(6,11,20,1) 100%),
    linear-gradient(90deg,rgba(8,17,32,.55) 0%,rgba(8,17,32,.15) 50%,rgba(8,17,32,.55) 100%);
}
.hero-home .hero-content{position:relative;z-index:2;max-width:1100px;text-align:center;width:100%}

.hero-home .hero-eyebrow{
  display:inline-block;color:var(--acc-bright);
  font-family:'Archivo',sans-serif;
  font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;font-weight:700;
  margin-bottom:2rem;
  opacity:0;animation:heroFadeUp .9s cubic-bezier(.22,1,.36,1) .2s forwards;
}
.hero-home .hero-title{
  font-family:'Archivo',sans-serif;
  font-weight:900;text-transform:uppercase;letter-spacing:-.02em;line-height:.92;
  font-size:clamp(2.25rem,6.4vw,5.2rem);
  color:#fff;margin-bottom:1.7rem;
  text-shadow:0 2px 30px rgba(0,0,0,.5);
}
.hero-home .hero-title span{display:block;opacity:0;transform:translateY(28px);animation:heroFadeUp 1s cubic-bezier(.22,1,.36,1) forwards}
.hero-home .hero-title span:nth-child(1){animation-delay:.35s}
.hero-home .hero-title span:nth-child(2){animation-delay:.48s}
.hero-home .hero-title span:nth-child(3){animation-delay:.61s}
.hero-home .hero-title .accent{color:var(--acc-bright)}
.hero-home .hero-sub{
  font-size:clamp(1rem,1.4vw,1.14rem);color:#dfe7ee;
  max-width:750px;margin:0 auto 2.3rem;line-height:1.6;
  opacity:0;animation:heroFadeUp 1s cubic-bezier(.22,1,.36,1) .85s forwards;
}
.hero-home .hero-cta-row{
  display:flex;justify-content:center;gap:.75rem;flex-wrap:wrap;
  opacity:0;animation:heroFadeUp 1s cubic-bezier(.22,1,.36,1) 1.05s forwards;
}
.hero-home .hero-cta-row .btn{padding:1.15rem 2.3rem;font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;border-radius:2px}
.hero-home .hero-cta-row .btn svg{width:16px;height:16px}
.hero-home .hero-trust-row{
  display:flex;justify-content:center;align-items:center;flex-wrap:wrap;
  gap:1.2rem 2.3rem;margin-top:2.3rem;
  opacity:0;animation:heroFadeUp 1s cubic-bezier(.22,1,.36,1) 1.2s forwards;
}
.hero-home .trust-item{display:flex;align-items:center;gap:.55rem;font-size:.85rem;color:#e4ebf1;font-weight:600;letter-spacing:.02em}
.hero-home .trust-item svg{width:18px;height:18px;color:var(--acc-bright);flex-shrink:0}
@keyframes heroFadeUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}

@media(max-width:760px){
  .hero.hero-home{padding:7.2rem 1.35rem 3.6rem;min-height:100vh;min-height:100dvh;align-items:center}
  .hero-home .hero-cta-row{width:100%}
  .hero-home .hero-cta-row .btn{width:100%}
  .hero-home .trust-item{font-size:.77rem}
  .hero-home .hero-trust-row{gap:.75rem 1.4rem}
}
@media(max-width:640px){.hero.hero-home{padding-bottom:6.2rem}}
@media(max-width:400px){.hero-home .hero-title{font-size:2.05rem}}
@media(max-width:360px){
  .hero.hero-home{padding:6.4rem 1.1rem 2.6rem}
  .hero-home .hero-title{font-size:1.9rem;line-height:.95}
  .hero-home .hero-eyebrow{margin-bottom:1.2rem;letter-spacing:.2em}
  .hero-home .hero-sub{font-size:.92rem;margin-bottom:1.5rem}
  .hero-home .hero-trust-row{gap:.5rem 1rem;margin-top:1.5rem}
  .hero-home .trust-item{font-size:.72rem}
  .hero-home .hero-cta-row .btn{padding:.95rem 1.4rem}
}
@media(prefers-reduced-motion:reduce){
  .hero.hero-home .hero-bg{animation:none}
  .hero-home .hero-eyebrow,.hero-home .hero-title span,.hero-home .hero-sub,.hero-home .hero-cta-row,.hero-home .hero-trust-row{opacity:1;transform:none;animation:none}
}

/* ============================================================
   STAT BAND — the banner directly under the hero
   Replaces the scrolling ticker. Same shape as Brightside:
   four figures over a large faded wordmark.
   ============================================================ */
.statband{
  background:var(--ink-3,#05080d);
  padding:4.6rem 2rem;position:relative;overflow:hidden;
  border-top:1px solid rgba(255,255,255,.05);
  border-bottom:1px solid rgba(255,255,255,.05);
}
.statband::before{
  content:'ARCLINE';
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  font-family:'Archivo',sans-serif;font-weight:900;
  font-size:clamp(6rem,17vw,19rem);
  color:rgba(255,255,255,.026);
  letter-spacing:-.03em;white-space:nowrap;pointer-events:none;z-index:0;
}
.statband-inner{
  max-width:1300px;margin:0 auto;
  display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;
  position:relative;z-index:1;
}
.sb-stat{text-align:center}
.sb-num{
  font-family:'Archivo',sans-serif;font-weight:800;
  font-size:clamp(2.6rem,5.4vw,4.4rem);
  color:#fff;line-height:1;margin-bottom:.65rem;display:block;letter-spacing:-.02em;
}
.sb-num sup{font-size:.45em;vertical-align:super;font-weight:700;color:var(--acc-bright)}
.sb-label{
  font-family:'Archivo',sans-serif;
  font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;
  color:rgba(238,242,249,.62);font-weight:600;
}
@media(max-width:720px){
  .statband{padding:3.1rem 1.25rem}
  .statband-inner{grid-template-columns:repeat(2,1fr);gap:2.1rem 1.2rem}
}
@media(max-width:760px){.sb-label{font-size:.75rem;letter-spacing:.18em}}

/* ============================================================
   MOBILE STICKY BAR — two actions, floating clear of the
   browser chrome. Ported from Brightside.
   ============================================================ */
.sticky-cta{
  position:fixed;left:0;right:0;bottom:0;top:auto;z-index:96;
  display:none;background:var(--acc-deep);
  box-shadow:0 -6px 24px rgba(4,13,28,.35);
  padding-bottom:env(safe-area-inset-bottom);
  opacity:1;visibility:visible;transform:none;
}
.sticky-inner{display:grid;grid-template-columns:1fr 1fr}
.sticky-cta a{
  display:flex;align-items:center;justify-content:center;gap:.6rem;
  padding:1rem;background:none;color:#fff;border-radius:0;box-shadow:none;
  font-family:'Archivo',sans-serif;font-weight:800;
  font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;
}
.sticky-cta a+a{border-left:1px solid rgba(255,255,255,.25)}
.sticky-cta svg{width:17px;height:17px;color:#fff}
@media(max-width:640px){
  .sticky-cta{
    display:block;
    left:.55rem;right:.55rem;
    bottom:calc(.55rem + env(safe-area-inset-bottom));
    border-radius:12px;overflow:hidden;padding-bottom:0;
    box-shadow:0 6px 20px rgba(4,10,20,.45),0 0 0 1px rgba(255,255,255,.08);
  }
  .sticky-cta a{padding:.62rem .4rem;font-size:.74rem;letter-spacing:.08em;gap:.4rem}
  .sticky-cta a span{display:inline}
  .sticky-cta svg{width:14px;height:14px}
  .wa{bottom:calc(3.9rem + env(safe-area-inset-bottom))}
}

/* ============================================================
   MOBILE HEADER — below 600px the logo, phone, quote button and
   burger no longer fit side by side. The sticky bar carries call
   and quote, so the header keeps the logo and the menu.
   ============================================================ */
@media(max-width:600px){
  .navphone{display:none}
  .navcta .btn{display:none}
}

/* Archivo sets wider than Brightside's Montserrat, so the smallest phones need
   one extra step to keep each headline line on a single row. */
@media(max-width:340px){
  .hero-home .hero-title{font-size:1.62rem}
  .hero-home .hero-sub{font-size:.88rem}
}
@media(max-width:640px){
  .wa-launcher{width:52px;height:52px}
  .wa-launcher svg{width:26px;height:26px}
}