
  :root{
    --bg: #0a0f1a;
    --bg-soft: #0d1420;
    --panel: #121a2b;
    --panel-2: #17203355;
    --line: #22304a;
    --text: #eef1f6;
    --muted: #8fa0b8;
    --muted-2: #63748f;
    --cold: #2fb4d9;
    --cold-deep: #146e8a;
    --hot: #ff9a3d;
    --hot-deep: #ff6a3d;
    --clay: #b98470;
    --radius: 18px;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth; overflow-x:hidden; width:100%;}
  body{
    background:var(--bg);
    color:var(--text);
    font-family:'Manrope', sans-serif;
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  img{display:block; max-width:100%; height:auto;}
  a{color:inherit; text-decoration:none;}
  h1,h2,h3{font-family:'Unbounded', sans-serif; letter-spacing:-0.01em;}
  .mono{font-family:'JetBrains Mono', monospace;}
  .wrap{max-width:1160px; margin:0 auto; padding:0 24px;}
  section{position:relative;}

  /* ---------- background thermal gradient wash ---------- */
  .bg-noise{
    position:fixed; inset:0; z-index:-2; pointer-events:none;
    background:
      radial-gradient(circle at 12% -10%, #124a5c55 0%, transparent 45%),
      radial-gradient(circle at 90% 10%, #7a2f1233 0%, transparent 40%),
      var(--bg);
  }

  /* ---------- header ---------- */
  header{
    position:sticky; top:0; z-index:50;
    background:rgba(10,15,26,0.82);
    backdrop-filter:blur(14px);
    border-bottom:1px solid var(--line);
  }
  .headerbar{
    display:flex; align-items:center; justify-content:space-between;
    padding:12px 24px; max-width:1160px; margin:0 auto;
    gap:16px;
  }
  .brand{display:flex; align-items:center; gap:10px;}
  .brand .logo-badge{
    background:#fff; border-radius:10px; padding:5px 8px;
    display:flex; align-items:center;
  }
  .brand .logo-badge img{height:26px; width:auto;}
  .brand-name{font-family:'Unbounded'; font-size:14px; font-weight:600; letter-spacing:0.02em;}
  .brand-sub{font-size:11px; color:var(--muted); font-weight:500;}
  nav{display:flex; gap:22px; font-size:14px; color:var(--muted);}
  nav a:hover{color:var(--text);}
  .header-cta{display:flex; align-items:center; gap:12px;}
  .phone-link{font-family:'JetBrains Mono'; font-weight:600; font-size:15px; white-space:nowrap;}
  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    padding:12px 22px; border-radius:100px; font-weight:700; font-size:14.5px;
    cursor:pointer; border:none; transition:transform .15s ease, box-shadow .15s ease;
    white-space:nowrap;
  }
  .btn-primary{
    background:linear-gradient(135deg, var(--hot) 0%, var(--hot-deep) 100%);
    color:#160a03;
    box-shadow:0 8px 24px -8px #ff6a3d88;
  }
  .btn-primary:hover{transform:translateY(-2px); box-shadow:0 12px 28px -6px #ff6a3daa;}
  .btn-ghost{
    background:transparent; border:1px solid var(--line); color:var(--text);
  }
  .btn-ghost:hover{border-color:var(--cold);}
  .btn-sm{padding:9px 16px; font-size:13px;}
  @media (max-width:860px){ nav{display:none;} .brand-sub{display:none;} }
  @media (max-width:480px){
    .headerbar{padding:10px 16px; gap:8px;}
    .phone-link{display:none;}
    .btn-sm{padding:8px 12px; font-size:12.5px;}
    .brand-name{font-size:12.5px;}
    .brand .logo-badge img{height:22px;}
  }

  /* ---------- hero ---------- */
  .hero{padding:64px 0 40px;}
  .eyebrow{
    display:inline-flex; align-items:center; gap:8px;
    font-family:'JetBrains Mono'; font-size:12.5px; color:var(--cold);
    border:1px solid var(--cold-deep); background:#0f2c3644;
    padding:6px 14px; border-radius:100px; margin-bottom:22px;
  }
  .eyebrow .dot{width:6px; height:6px; border-radius:50%; background:var(--hot); box-shadow:0 0 0 3px #ff9a3d33;}
  .hero h1{
    font-size:clamp(34px, 5.2vw, 60px); font-weight:700; line-height:1.06;
    max-width:820px;
  }
  .hero h1 .grad{
    background:linear-gradient(90deg, var(--cold) 0%, var(--hot) 100%);
    -webkit-background-clip:text; background-clip:text; color:transparent;
  }
  .hero p.lead{
    margin-top:22px; font-size:18px; color:var(--muted); max-width:600px; font-weight:500;
  }
  .hero-ctas{display:flex; gap:14px; margin-top:32px; flex-wrap:wrap;}
  .trust-row{
    display:flex; gap:28px; margin-top:40px; flex-wrap:wrap;
    padding-top:28px; border-top:1px solid var(--line);
  }
  .trust-item{display:flex; flex-direction:column; gap:2px;}
  .trust-item .num{font-family:'JetBrains Mono'; font-size:22px; font-weight:700; color:var(--text);}
  .trust-item .lbl{font-size:12.5px; color:var(--muted-2);}

  /* ---------- section heading ---------- */
  .kicker{
    font-family:'JetBrains Mono'; font-size:12.5px; color:var(--hot);
    text-transform:uppercase; letter-spacing:0.12em; margin-bottom:12px; display:block;
  }
  .sec-head{max-width:640px; margin-bottom:44px;}
  .sec-head h2{font-size:clamp(26px,3.4vw,38px); font-weight:700; line-height:1.15;}
  .sec-head p{color:var(--muted); margin-top:14px; font-size:16px;}
  section{padding:88px 0;}
  section.tight{padding:64px 0;}

  /* ---------- thermal slider (signature) ---------- */
  .slider-card{
    background:var(--panel); border:1px solid var(--line); border-radius:24px;
    padding:20px; margin-bottom:24px;
  }
  .compare{
    position:relative; border-radius:16px; overflow:hidden; aspect-ratio:750/844;
    max-width:420px; margin:0 auto; cursor:ew-resize; user-select:none;
    box-shadow:0 20px 50px -20px #000a;
  }
  .compare img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; pointer-events:none;}
  .compare .after-wrap{position:absolute; inset:0; width:50%; overflow:hidden;}
  .compare .after-wrap img{width:420px; max-width:none;}
  .compare input[type=range]{
    position:absolute; inset:0; width:100%; height:100%; margin:0;
    opacity:0; cursor:ew-resize;
  }
  /* .after-wrap defaults to width:50% below, so even without JS running,
     visitors still see a clean 50/50 before/after comparison. */
  .compare .handle{
    position:absolute; top:0; bottom:0; left:50%; width:0; pointer-events:none;
    transform:translateX(-50%);
  }
  .compare .handle::before{
    content:''; position:absolute; top:0; bottom:0; left:-1px; width:2px; background:#fff; opacity:.85;
  }
  .compare .handle::after{
    content:'⟷'; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    width:42px; height:42px; border-radius:50%; background:#fff; color:#0a0f1a;
    display:flex; align-items:center; justify-content:center; font-size:16px; font-weight:700;
    box-shadow:0 6px 16px #0006;
  }
  .compare .tag{
    position:absolute; top:14px; z-index:3; font-family:'JetBrains Mono'; font-size:11.5px;
    font-weight:700; padding:5px 10px; border-radius:100px; letter-spacing:0.03em;
  }
  .tag-before{left:14px; background:#1c3a52dd; color:#8fd3ec;}
  .tag-after{right:14px; background:#5c2c0edd; color:#ffcf9e;}
  .slider-cap{display:flex; justify-content:space-between; align-items:center; margin-top:16px; padding:0 4px;}
  .slider-cap .lbl{font-size:13.5px; color:var(--muted); font-weight:600;}

  .thermal-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:24px;
  }
  @media (max-width:900px){ .thermal-grid{grid-template-columns:1fr; max-width:440px; margin:0 auto;} }

  /* ---------- services ---------- */
  .svc-grid{display:grid; grid-template-columns:1.1fr 1fr; gap:24px;}
  @media (max-width:860px){ .svc-grid{grid-template-columns:1fr;} }
  .svc-card{
    background:var(--panel); border:1px solid var(--line); border-radius:24px; padding:36px;
    position:relative; overflow:hidden;
  }
  .svc-card.b2b{border-color:#3a2c1f;}
  .svc-card h3{font-size:22px; margin-bottom:10px;}
  .svc-card .desc{color:var(--muted); font-size:15px; margin-bottom:26px;}
  .price-list{display:flex; flex-direction:column; gap:0;}
  .price-row{
    display:flex; justify-content:space-between; align-items:baseline;
    padding:16px 0; border-top:1px solid var(--line); gap:12px;
  }
  .price-row .name{font-size:15px; color:var(--text); font-weight:600;}
  .price-row .note{font-size:12.5px; color:var(--muted-2); margin-top:3px;}
  .price-row .price{font-family:'JetBrains Mono'; font-weight:700; font-size:17px; white-space:nowrap; color:var(--cold);}
  .svc-card.b2b .price{color:var(--hot);}
  .svc-card .btn{margin-top:26px; width:100%;}
  .badge-excl{
    display:inline-block; font-size:12px; color:#ffb27a; background:#3a220f; border:1px solid #5a3520;
    padding:6px 12px; border-radius:100px; margin-top:18px; font-weight:600;
  }

  /* ---------- process ---------- */
  .process-wrap{display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;}
  .process-wrap > *{min-width:0;}
  @media (max-width:900px){ .process-wrap{grid-template-columns:1fr;} }
  .process-photos{display:grid; grid-template-columns:1fr 1fr; gap:14px; min-width:0;}
  .process-photos img{width:100%; border-radius:16px; aspect-ratio:3/4; object-fit:cover; border:1px solid var(--line);}
  .process-photos .tall{grid-row:span 2; aspect-ratio:3/5.2;}
  .steps{display:flex; flex-direction:column; gap:0;}
  .step{display:flex; gap:18px; padding:22px 0; border-top:1px solid var(--line);}
  .step > div{min-width:0;}
  .step:last-child{border-bottom:1px solid var(--line);}
  .step .idx{font-family:'JetBrains Mono'; font-size:13px; color:var(--muted-2); padding-top:2px; min-width:26px;}
  .step h4{font-size:16.5px; margin-bottom:6px; overflow-wrap:break-word;}
  .step p{font-size:14.5px; color:var(--muted);}

  /* ---------- geo ---------- */
  .geo-wrap{
    background:var(--panel); border:1px solid var(--line); border-radius:24px; padding:44px;
    display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start;
  }
  @media (max-width:860px){ .geo-wrap{grid-template-columns:1fr; padding:28px;} }
  .chips{display:flex; flex-wrap:wrap; gap:10px; margin-top:8px;}
  .chip{
    font-size:13.5px; padding:9px 16px; border-radius:100px; border:1px solid var(--line);
    color:var(--muted); font-weight:600;
  }
  .chip.city{color:var(--text); border-color:var(--cold-deep); background:#0f2c3633;}

  /* ---------- video ---------- */
  .video-strip{display:flex; gap:18px; overflow-x:auto; padding-bottom:8px; scroll-snap-type:x mandatory;}
  .video-strip::-webkit-scrollbar{height:6px;}
  .video-strip::-webkit-scrollbar-thumb{background:var(--line); border-radius:10px;}
  .video-card{
    flex:0 0 auto; width:220px; scroll-snap-align:start;
    border-radius:18px; overflow:hidden; border:1px solid var(--line); background:#000;
  }
  .video-card iframe{width:220px; height:391px; display:block; border:0;}

  /* ---------- B2B band ---------- */
  .b2b-band{
    background:linear-gradient(120deg, #1a1108 0%, #241407 100%);
    border:1px solid #3a2410; border-radius:28px; padding:48px;
    display:flex; justify-content:space-between; align-items:center; gap:32px; flex-wrap:wrap;
  }
  .b2b-band h3{font-size:24px; max-width:480px;}
  .b2b-band p{color:#c9a888; margin-top:10px; max-width:480px; font-size:15px;}
  @media (max-width:480px){
    .b2b-band{padding:28px;}
    .b2b-band .btn{white-space:normal; text-align:center; padding:12px 16px; font-size:13.5px;}
  }

  /* ---------- footer ---------- */
  footer{border-top:1px solid var(--line); padding:56px 0 110px;}
  .foot-grid{display:flex; justify-content:space-between; gap:40px; flex-wrap:wrap;}
  .foot-col h5{font-size:12.5px; color:var(--muted-2); text-transform:uppercase; letter-spacing:0.08em; margin-bottom:14px; font-weight:700;}
  .foot-col a, .foot-col div{font-size:14.5px; color:var(--muted); margin-bottom:8px; display:block;}
  .foot-col a:hover{color:var(--text);}
  .legal{margin-top:40px; padding-top:24px; border-top:1px solid var(--line); font-size:12.5px; color:var(--muted-2);}

  /* ---------- sticky mobile call bar ---------- */
  .mobile-bar{
    display:none; position:fixed; bottom:0; left:0; right:0; z-index:60;
    background:rgba(10,15,26,0.92); backdrop-filter:blur(14px);
    border-top:1px solid var(--line); padding:12px 16px;
    gap:10px;
  }
  @media (max-width:760px){ .mobile-bar{display:flex;} .hero{padding-top:36px;} }
  .mobile-bar a{flex:1; min-width:0;}
  .mobile-bar .btn{padding:12px 8px; white-space:normal; text-align:center;}

  /* reveal animation — progressive enhancement only: content is visible by
     default, JS opts elements INTO the animated state, so a JS failure
     never hides content permanently. */
  .js-anim .reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease;}
  .js-anim .reveal.in{opacity:1; transform:none;}

  @media (prefers-reduced-motion: reduce){
    .js-anim .reveal{opacity:1; transform:none; transition:none;}
    html{scroll-behavior:auto;}
  }
\n\n/* SEO service pages */\n.breadcrumbs{padding:24px 0 0;color:var(--muted-2);font-size:13px}.breadcrumbs a{color:var(--cold)}\n.seo-hero{padding:56px 0 42px}.seo-hero h1{font-size:clamp(32px,4.6vw,54px);line-height:1.08;max-width:940px}.seo-lead{margin-top:18px;max-width:780px;color:var(--muted);font-size:18px}.seo-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:28px}.seo-copy,.seo-aside{background:var(--panel);border:1px solid var(--line);border-radius:24px;padding:32px}.seo-copy h2{font-size:26px;margin:30px 0 12px}.seo-copy h2:first-child{margin-top:0}.seo-copy h3{font-size:19px;margin:24px 0 10px}.seo-copy p,.seo-copy li{color:var(--muted);font-size:16px}.seo-copy p+p{margin-top:14px}.seo-copy ul{padding-left:20px;margin:14px 0 0}.seo-copy li+li{margin-top:8px}.seo-aside{height:max-content;position:sticky;top:88px}.seo-aside h3{font-size:20px;margin-bottom:16px}.seo-aside .price{font-family:'JetBrains Mono';font-size:28px;color:var(--hot);font-weight:700}.seo-links{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:22px}.seo-link{display:block;border:1px solid var(--line);border-radius:16px;padding:18px;background:var(--panel-2)}.seo-link strong{display:block;margin-bottom:5px}.seo-link span{color:var(--muted);font-size:13px}.faq{margin-top:24px}.faq details{border-top:1px solid var(--line);padding:16px 0}.faq summary{cursor:pointer;font-weight:700}.faq p{margin-top:10px}.keyword-note{font-size:12px;color:var(--muted-2);margin-top:16px}.cta-band{display:flex;justify-content:space-between;gap:24px;align-items:center;background:linear-gradient(135deg,#142233,#2f1b12);border:1px solid var(--line);border-radius:24px;padding:30px}.cta-band h2{font-size:24px}.cta-band p{color:var(--muted);margin-top:8px}.service-nav{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.service-nav a{border:1px solid var(--line);padding:8px 12px;border-radius:100px;color:var(--muted);font-size:13px}.service-nav a:hover{border-color:var(--cold);color:var(--text)}\n@media(max-width:860px){.seo-grid{grid-template-columns:1fr}.seo-aside{position:static}.seo-links{grid-template-columns:1fr}.cta-band{align-items:flex-start;flex-direction:column}}\n
/* Lead form, privacy and cookie consent */
.modal-open{overflow:hidden}
.lead-modal{position:fixed;inset:0;z-index:1200;display:none;align-items:center;justify-content:center;padding:20px}
.lead-modal.is-open{display:flex}
.lead-modal__backdrop{position:absolute;inset:0;background:rgba(10,13,17,.72);backdrop-filter:blur(5px)}
.lead-modal__dialog{position:relative;z-index:1;width:min(520px,100%);background:var(--surface,#171b21);border:1px solid var(--line,rgba(255,255,255,.1));border-radius:22px;padding:30px;box-shadow:0 28px 80px rgba(0,0,0,.45)}
.lead-modal__dialog h2{margin:8px 0 10px;font-size:clamp(24px,4vw,36px)}
.lead-modal__text{color:var(--muted);margin:0 0 22px;line-height:1.6}
.lead-modal__close{position:absolute;right:14px;top:10px;border:0;background:transparent;color:inherit;font-size:32px;line-height:1;cursor:pointer;padding:6px 10px}
.lead-form{display:grid;gap:15px}
.lead-form>label:not(.consent-check){display:grid;gap:7px;font-weight:700;font-size:14px}
.lead-form input[type=text],.lead-form input[type=tel]{width:100%;box-sizing:border-box;border:1px solid var(--line,rgba(255,255,255,.12));background:rgba(255,255,255,.05);color:inherit;border-radius:12px;padding:14px 15px;font:inherit;outline:none}
.lead-form input:focus{border-color:var(--accent,#f3b33d)}
.consent-check{display:flex;align-items:flex-start;gap:10px;font-size:12px;line-height:1.45;color:var(--muted)}
.consent-check input{margin-top:3px;flex:0 0 auto}
.consent-check a,.cookie-banner a,.legal-doc a,footer .legal a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.lead-form__status{min-height:20px;font-size:14px;color:var(--muted)}
.hp-field{position:absolute!important;left:-99999px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.cookie-banner{position:fixed;z-index:1100;left:18px;right:18px;bottom:18px;margin:auto;max-width:1120px;background:#11161c;border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:16px 18px;display:flex;align-items:center;gap:24px;justify-content:space-between;box-shadow:0 18px 60px rgba(0,0,0,.36)}
.cookie-banner__text{display:grid;gap:4px;font-size:13px;line-height:1.5;color:var(--muted)}
.cookie-banner__text strong{color:var(--text,#fff);font-size:14px}
.cookie-banner__actions{display:flex;gap:9px;flex:0 0 auto}
.legal-doc{max-width:920px}
.legal-doc h2{margin-top:34px;margin-bottom:10px;font-size:clamp(20px,3vw,28px)}
.legal-doc p{color:var(--muted);line-height:1.75;margin:0 0 12px}
.service-nav{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 28px}.service-nav a{display:inline-flex;padding:9px 12px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:13px;text-decoration:none}.service-nav a:hover{color:var(--text);border-color:rgba(255,255,255,.28)}
@media(max-width:700px){.cookie-banner{align-items:stretch;flex-direction:column;gap:12px;left:10px;right:10px;bottom:10px}.cookie-banner__actions{display:grid;grid-template-columns:1fr 1fr}.lead-modal__dialog{padding:26px 20px}.lead-modal{padding:12px}}
