/* ============================================================
   Raavi Solar — Powering Tomorrow
   Design System & Stylesheet
   ============================================================ */

:root{
  /* Brand palette derived from the Raavi Solar logo */
  --blue:#0A84FF;
  --blue-deep:#1546C8;
  --violet:#7C3AED;
  --magenta:#D6199B;
  --red:#F5254A;
  --orange:#FF7A00;
  --amber:#FFAA1D;
  --sun:#FF9500;

  --grad-brand:linear-gradient(90deg,#0A84FF 0%,#6B2BEF 28%,#F5254A 58%,#FF7A00 82%,#FFAA1D 100%);
  --grad-warm:linear-gradient(135deg,#FF7A00 0%,#FFAA1D 100%);
  --grad-cool:linear-gradient(135deg,#0A84FF 0%,#7C3AED 100%);
  --grad-fire:linear-gradient(135deg,#F5254A 0%,#FF7A00 100%);

  --ink:#0B1020;
  --ink-2:#151B2E;
  --slate:#5A6478;
  --slate-2:#8A93A6;
  --line:#E6E9F0;
  --bg:#FFFFFF;
  --bg-soft:#F6F8FC;
  --bg-tint:#F0F4FF;

  --radius:18px;
  --radius-lg:26px;
  --radius-sm:12px;
  --shadow-sm:0 2px 10px rgba(11,16,32,.06);
  --shadow:0 10px 34px rgba(11,16,32,.09);
  --shadow-lg:0 24px 70px rgba(11,16,32,.16);
  --shadow-brand:0 18px 44px rgba(245,37,74,.24);

  --f-head:'Sora','Plus Jakarta Sans',system-ui,sans-serif;
  --f-body:'Plus Jakarta Sans','Hind',system-ui,-apple-system,sans-serif;

  --nav-h:76px;
  --max:1240px;
}

html[lang="hi"] body{font-family:'Hind','Plus Jakarta Sans',system-ui,sans-serif;}
/* Sora has no Devanagari glyphs — in Hindi every element that uses it must fall
   back to Hind, otherwise the text renders as empty boxes (□□□). */
html[lang="hi"] h1,html[lang="hi"] h2,html[lang="hi"] h3,html[lang="hi"] h4,
html[lang="hi"] .h,
html[lang="hi"] .track__b b,
html[lang="hi"] .trackcta__box b,
html[lang="hi"] .finhook b,
html[lang="hi"] .finbank b,
html[lang="hi"] .billnudge__tx b,
html[lang="hi"] .toc b,
html[lang="hi"] .callout b,
html[lang="hi"] .emi-verdict b,
html[lang="hi"] .plan__size b,
html[lang="hi"] .stat b,
html[lang="hi"] .hero__trust div b,
html[lang="hi"] .proj__ov b,
html[lang="hi"] .post h3,
html[lang="hi"] .nf__links b,
html[lang="hi"] .float-badge b,
html[lang="hi"] .cmp thead th.us b,
html[lang="hi"] .fin-table td.us,
html[lang="hi"] .calc-res .big b,
html[lang="hi"] .emi-hero-row b,
html[lang="hi"] .plan__net,
html[lang="hi"] .step__n,
html[lang="hi"] .track__n,
html[lang="hi"] .mapcard b,
html[lang="hi"] .footer h4{font-family:'Hind','Plus Jakarta Sans',system-ui,sans-serif;letter-spacing:0;}

*,*::before,*::after{box-sizing:border-box;}
*{margin:0;padding:0;}
/* the [hidden] attribute must always win over display:grid/flex utilities */
[hidden]{display:none!important;}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 16px);-webkit-text-size-adjust:100%;}
html,body{overflow-x:hidden;}   /* marquee + off-canvas menu must never scroll the page sideways */
body{
  font-family:var(--f-body);
  color:var(--ink);
  background:var(--bg);
  line-height:1.65;
  font-size:16.5px;
  -webkit-font-smoothing:antialiased;
}
.header{overflow-x:clip;}
img{max-width:100%;display:block;}
/* <picture> wraps our images for WebP delivery — it must not break the layout
   of parents that rely on the child filling 100% height (hero, split, cards). */
picture{display:contents;}
.hero__bg picture,.split__media picture,.proj picture{display:block;width:100%;height:100%;}
a{color:inherit;text-decoration:none;}
button,input,select,textarea{font:inherit;color:inherit;}
ul{list-style:none;}

h1,h2,h3,h4{font-family:var(--f-head);font-weight:700;line-height:1.15;letter-spacing:-.02em;color:var(--ink);}
h1{font-size:clamp(2.1rem,5.2vw,3.85rem);letter-spacing:-.035em;}
h2{font-size:clamp(1.75rem,3.6vw,2.7rem);letter-spacing:-.03em;}
h3{font-size:clamp(1.12rem,1.7vw,1.35rem);}
p{color:var(--slate);}

.wrap{width:min(100% - 40px,var(--max));margin-inline:auto;}
.section{padding:clamp(64px,8vw,110px) 0;position:relative;}
.section--soft{background:var(--bg-soft);}
.section--tint{background:linear-gradient(180deg,#F3F7FF 0%,#FFFFFF 100%);}
.section--dark{background:var(--ink);color:#fff;}
.section--dark h2,.section--dark h3{color:#fff;}
.section--dark p{color:#A9B2C6;}

.grad-text{background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent;}
.grad-warm-text{background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent;}

/* ---------- Section heading ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:.74rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  padding:7px 15px;border-radius:100px;
  background:var(--bg-tint);color:var(--blue-deep);
  border:1px solid rgba(10,132,255,.16);margin-bottom:16px;
}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--grad-fire);}
.section--dark .eyebrow{background:rgba(255,255,255,.07);color:#FFC46B;border-color:rgba(255,255,255,.14);}
.sec-head{max-width:760px;margin-bottom:52px;}
.sec-head.center{margin-inline:auto;text-align:center;}
.sec-head p{margin-top:16px;font-size:1.05rem;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:14px 26px;border-radius:100px;border:1.5px solid transparent;
  font-weight:700;font-size:.95rem;cursor:pointer;white-space:nowrap;
  transition:transform .22s cubic-bezier(.34,1.4,.64,1),box-shadow .22s,background .22s,color .22s;
}
.btn svg{width:18px;height:18px;flex:none;}
.btn:hover{transform:translateY(-2.5px);}
.btn--primary{background:var(--grad-fire);color:#fff;box-shadow:var(--shadow-brand);}
.btn--primary:hover{box-shadow:0 22px 52px rgba(245,37,74,.36);}
.btn--dark{background:var(--ink);color:#fff;box-shadow:0 12px 30px rgba(11,16,32,.24);}
.btn--ghost{background:#fff;color:var(--ink);border-color:var(--line);box-shadow:var(--shadow-sm);}
.btn--ghost:hover{border-color:var(--blue);color:var(--blue-deep);}
.btn--wa{background:#25D366;color:#fff;box-shadow:0 14px 32px rgba(37,211,102,.32);}
.btn--outline-light{border-color:rgba(255,255,255,.35);color:#fff;background:rgba(255,255,255,.06);}
.btn--outline-light:hover{background:#fff;color:var(--ink);}
.btn--sm{padding:11px 20px;font-size:.86rem;}
.btn--block{width:100%;}

/* ============================================================
   TOP BAR
   ============================================================ */
.topbar{background:var(--ink);color:#C7CEDD;font-size:.83rem;padding:9px 0;}
.topbar__in{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;}
.topbar__left{display:flex;align-items:center;gap:22px;flex-wrap:wrap;}
.topbar a{display:inline-flex;align-items:center;gap:7px;transition:color .2s;}
.topbar a:hover{color:#fff;}
.topbar svg{width:14px;height:14px;opacity:.75;}
.topbar__right{display:flex;align-items:center;gap:14px;}
.tb-badge{
  display:inline-flex;align-items:center;gap:7px;padding:4px 12px;border-radius:100px;
  background:linear-gradient(90deg,rgba(255,122,0,.18),rgba(245,37,74,.18));
  border:1px solid rgba(255,150,60,.28);color:#FFC46B;font-weight:700;font-size:.76rem;
}
.socials{display:flex;gap:8px;}
.socials a{width:28px;height:28px;border-radius:8px;background:rgba(255,255,255,.08);display:grid;place-items:center;position:relative;}
/* invisible 44x44 hit area so small icons still meet touch-target guidelines */
.socials a::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px;}
.socials a:hover{background:var(--grad-fire);}
.socials svg{width:14px;height:14px;opacity:1;}

/* Language switch */
.langsw{display:inline-flex;background:rgba(255,255,255,.09);border-radius:100px;padding:3px;gap:2px;}
.langsw button{
  border:0;background:transparent;color:#C7CEDD;padding:7px 15px;border-radius:100px;
  font-size:.78rem;font-weight:700;cursor:pointer;transition:.2s;min-height:34px;
}
.langsw button.is-active{background:#fff;color:var(--ink);}

/* ============================================================
   HEADER / NAV
   ============================================================ */
.header{
  position:sticky;top:0;z-index:900;background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px);
  border-bottom:1px solid rgba(230,233,240,.9);transition:box-shadow .25s,background .25s;
}
.header.is-stuck{box-shadow:0 8px 30px rgba(11,16,32,.08);}
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;height:var(--nav-h);}
.brand{display:flex;align-items:center;flex:none;}
.brand img{height:46px;width:auto;transition:height .25s;}
.header.is-stuck .brand img{height:40px;}

.nav__menu{display:flex;align-items:center;gap:3px;margin-left:auto;}
.nav__menu > li:not(.nav__mobcta) > a,
.nav__menu > li:not(.nav__mobcta) > button{
  display:inline-flex;align-items:center;gap:5px;padding:9px 11px;border-radius:10px;
  font-size:.9rem;font-weight:600;color:#2B3345;background:none;border:0;cursor:pointer;
  transition:.2s;white-space:nowrap;
}
.nav__menu > li:not(.nav__mobcta) > a:hover,
.nav__menu > li:not(.nav__mobcta) > button:hover,
.nav__menu > li.is-open:not(.nav__mobcta) > button{background:var(--bg-tint);color:var(--blue-deep);}
.nav__menu .caret{width:11px;height:11px;transition:transform .25s;}
.nav__menu li.is-open .caret{transform:rotate(180deg);}
.nav__actions{display:flex;align-items:center;gap:10px;flex:none;}

.has-drop{position:relative;}
.drop{
  position:absolute;top:calc(100% + 12px);left:0;min-width:290px;background:#fff;
  border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lg);
  padding:10px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:.22s;
}
.has-drop:hover .drop,.has-drop.is-open .drop{opacity:1;visibility:visible;transform:translateY(0);}
.drop a{display:flex;gap:12px;align-items:flex-start;padding:11px 12px;border-radius:12px;transition:.18s;}
.drop a:hover{background:var(--bg-soft);}
.drop .di{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:none;background:var(--bg-tint);}
.drop .di svg{width:17px;height:17px;stroke:var(--blue-deep);}
.drop b{display:block;font-size:.9rem;font-weight:700;}
.drop span{display:block;font-size:.78rem;color:var(--slate-2);line-height:1.4;}

.nav__mobcta{display:none;}
.burger{display:none;width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:#fff;cursor:pointer;}
.burger span{display:block;width:19px;height:2px;background:var(--ink);margin:4px auto;border-radius:2px;transition:.28s;}
.burger.is-active span:nth-child(1){transform:translateY(6px) rotate(45deg);}
.burger.is-active span:nth-child(2){opacity:0;}
.burger.is-active span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}

/* Scroll progress */
.progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--grad-brand);z-index:1000;transition:width .1s linear;}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative;overflow:hidden;background:var(--ink);color:#fff;}
.hero__bg{position:absolute;inset:0;}
.hero__bg img{width:100%;height:100%;object-fit:cover;opacity:.4;}
.hero__bg::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(105deg,rgba(11,16,32,.96) 0%,rgba(11,16,32,.86) 42%,rgba(11,16,32,.42) 100%);
}
.hero__glow{position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none;}
.hero__glow.g1{width:420px;height:420px;background:rgba(255,122,0,.42);top:-90px;right:6%;}
.hero__glow.g2{width:380px;height:380px;background:rgba(10,132,255,.34);bottom:-140px;left:-60px;}
.hero__in{position:relative;z-index:2;display:grid;grid-template-columns:1.08fr .92fr;gap:56px;align-items:center;padding:clamp(56px,7vw,96px) 0 clamp(48px,6vw,80px);}
.hero h1{color:#fff;}
.hero h1 .grad-text{background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero__sub{color:#B7C0D2;font-size:1.08rem;margin-top:20px;max-width:560px;}
.hero__pill{
  display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;border-radius:100px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);font-size:.84rem;font-weight:600;color:#E7ECF6;margin-bottom:22px;
}
.hero__pill i{
  font-style:normal;background:var(--grad-warm);color:#231000;font-weight:800;font-size:.7rem;
  padding:4px 11px;border-radius:100px;letter-spacing:.04em;
}
.hero__cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px;}
.hero__trust{display:flex;gap:26px;flex-wrap:wrap;margin-top:34px;padding-top:26px;border-top:1px solid rgba(255,255,255,.12);}
.hero__trust div b{display:block;font-family:var(--f-head);font-size:1.6rem;font-weight:800;background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero__trust div span{font-size:.8rem;color:#98A2B8;}

/* Hero lead card */
.leadcard{
  background:rgba(255,255,255,.98);border-radius:var(--radius-lg);padding:28px;
  box-shadow:0 30px 80px rgba(0,0,0,.42);position:relative;overflow:hidden;
}
.leadcard::before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:var(--grad-brand);}
.leadcard h3{font-size:1.28rem;}
.leadcard .lc-sub{font-size:.86rem;color:var(--slate);margin-top:6px;margin-bottom:18px;}
.field{margin-bottom:12px;}
.field label{display:block;font-size:.79rem;font-weight:700;color:#3A4356;margin-bottom:6px;}
.field input,.field select,.field textarea{
  width:100%;padding:12.5px 15px;border:1.5px solid var(--line);border-radius:12px;background:#fff;
  font-size:.93rem;transition:.2s;outline:none;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(10,132,255,.12);}
.field textarea{resize:vertical;min-height:96px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.form-note{font-size:.74rem;color:var(--slate-2);text-align:center;margin-top:11px;line-height:1.5;}
.hp{position:absolute!important;left:-9999px!important;opacity:0;height:0;width:0;}

/* ============================================================
   MARQUEE / TRUST STRIP
   ============================================================ */
.strip{background:#fff;border-bottom:1px solid var(--line);padding:22px 0;overflow:hidden;}
.strip__label{text-align:center;font-size:.73rem;letter-spacing:.18em;text-transform:uppercase;color:var(--slate-2);font-weight:800;margin-bottom:16px;}
.marquee{display:flex;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);}
.marquee__track{display:flex;gap:14px;animation:scrollx 34s linear infinite;flex:none;padding-right:14px;}
.strip:hover .marquee__track{animation-play-state:paused;}
@keyframes scrollx{to{transform:translateX(-100%);}}
.chip{
  display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:100px;
  background:var(--bg-soft);border:1px solid var(--line);font-weight:700;font-size:.88rem;color:#3A4356;white-space:nowrap;
}
.chip i{font-style:normal;width:7px;height:7px;border-radius:50%;background:var(--grad-fire);}

/* ============================================================
   STAT COUNTERS
   ============================================================ */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.stat{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px 24px;text-align:center;
  transition:transform .28s,box-shadow .28s,border-color .28s;position:relative;overflow:hidden;
}
.stat::after{content:"";position:absolute;inset:auto 0 0 0;height:3px;background:var(--grad-brand);transform:scaleX(0);transition:transform .35s;}
.stat:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:transparent;}
.stat:hover::after{transform:scaleX(1);}
.stat b{display:block;font-family:var(--f-head);font-size:clamp(1.9rem,3.4vw,2.5rem);font-weight:800;line-height:1;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent;}
.stat span{display:block;margin-top:9px;font-size:.86rem;color:var(--slate);font-weight:600;}

/* ============================================================
   CARD GRIDS
   ============================================================ */
.grid{display:grid;gap:24px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}

.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px;
  transition:transform .3s cubic-bezier(.2,.8,.3,1),box-shadow .3s,border-color .3s;position:relative;overflow:hidden;
}
.card:hover{transform:translateY(-7px);box-shadow:var(--shadow);border-color:rgba(10,132,255,.2);}
.card__icon{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;margin-bottom:20px;background:var(--grad-cool);box-shadow:0 10px 24px rgba(10,132,255,.26);}
.card__icon svg{width:26px;height:26px;stroke:#fff;fill:none;stroke-width:1.9;}
.card__icon.warm{background:var(--grad-warm);box-shadow:0 10px 24px rgba(255,140,0,.28);}
.card__icon.fire{background:var(--grad-fire);box-shadow:0 10px 24px rgba(245,37,74,.24);}
.card__icon.violet{background:linear-gradient(135deg,#7C3AED,#D6199B);box-shadow:0 10px 24px rgba(124,58,237,.26);}
.card h3{margin-bottom:10px;}
.card p{font-size:.93rem;}
.card ul{margin-top:16px;display:grid;gap:9px;}
.card ul li{display:flex;gap:9px;font-size:.87rem;color:#404B60;line-height:1.5;}
.card ul li::before{content:"";width:16px;height:16px;flex:none;margin-top:3px;border-radius:50%;background:var(--grad-fire);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/13px no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/13px no-repeat;}
.card__link{display:inline-flex;align-items:center;gap:7px;margin-top:18px;font-weight:700;font-size:.87rem;color:var(--blue-deep);padding:6px 0;}
.card__link svg{width:15px;height:15px;transition:transform .25s;}
.card:hover .card__link svg{transform:translateX(4px);}

/* ============================================================
   PRICING
   ============================================================ */
.pricing{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;align-items:start;}
.plan{
  background:#fff;border:1.5px solid var(--line);border-radius:var(--radius-lg);padding:30px 26px;
  position:relative;transition:transform .3s,box-shadow .3s,border-color .3s;
}
.plan:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);}
.plan--featured{border-color:transparent;box-shadow:var(--shadow-lg);transform:scale(1.035);background:linear-gradient(180deg,#fff,#FFFCF7);}
.plan--featured::before{
  content:"";position:absolute;inset:-1.5px;border-radius:var(--radius-lg);background:var(--grad-brand);z-index:-1;
}
.plan--featured{outline:2px solid transparent;background-clip:padding-box;border:1.5px solid #FFB84D;}
.plan__tag{
  position:absolute;top:-13px;left:50%;transform:translateX(-50%);white-space:nowrap;
  background:var(--grad-fire);color:#fff;font-size:.7rem;font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;padding:6px 16px;border-radius:100px;box-shadow:var(--shadow-brand);
}
.plan__size{display:flex;align-items:baseline;gap:7px;}
.plan__size b{font-family:var(--f-head);font-size:2.15rem;font-weight:800;line-height:1;}
.plan__size span{font-size:1rem;font-weight:700;color:var(--slate);}
.plan__for{font-size:.83rem;color:var(--slate-2);margin-top:7px;min-height:38px;}
.plan__price{margin:18px 0 4px;padding-top:18px;border-top:1px dashed var(--line);}
.plan__mrp{font-size:.8rem;color:var(--slate-2);}
.plan__mrp s{color:#B0B8C8;}
.plan__net{font-family:var(--f-head);font-size:1.95rem;font-weight:800;line-height:1.1;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent;margin-top:4px;}
.plan__after{font-size:.78rem;color:var(--slate-2);}
.plan__subsidy{
  display:inline-flex;align-items:center;gap:6px;margin-top:12px;padding:6px 12px;border-radius:100px;
  background:rgba(16,185,129,.1);color:#047857;font-size:.78rem;font-weight:800;border:1px solid rgba(16,185,129,.22);
}
.plan__specs{margin:18px 0;display:grid;gap:8px;}
.plan__specs li{display:flex;justify-content:space-between;gap:10px;font-size:.84rem;padding:7px 0;border-bottom:1px dashed #EFF1F6;}
.plan__specs li:last-child{border-bottom:0;}
.plan__specs li span{color:var(--slate);}
.plan__specs li b{font-weight:700;color:var(--ink);text-align:right;}

.price-note{
  margin-top:32px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--orange);
  border-radius:var(--radius-sm);padding:18px 22px;font-size:.85rem;color:var(--slate);
}
.price-note b{color:var(--ink);}

/* ============================================================
   FINANCING / BANK EMI
   ============================================================ */
.finbanks{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;}
.finbank{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px 18px;
  text-align:center;transition:transform .28s,box-shadow .28s,border-color .28s;
}
.finbank:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:rgba(10,132,255,.24);}
.finbank b{display:block;font-family:var(--f-head);font-size:1rem;font-weight:800;}
.finbank span{display:block;font-size:.76rem;color:var(--slate-2);margin:4px 0 10px;line-height:1.35;}
.finbank i{
  display:inline-block;font-style:normal;font-size:.82rem;font-weight:800;padding:5px 12px;
  border-radius:100px;background:rgba(16,185,129,.1);color:#047857;border:1px solid rgba(16,185,129,.22);
}
.fin-table td.us{font-family:var(--f-head);font-weight:800;font-size:1.05rem;color:#C41F3E;}
.fin-table .fin-save{color:#047857;font-weight:700;}
.fin-table thead th.us span{display:block;font-size:.7rem;font-weight:600;color:var(--slate);letter-spacing:0;text-transform:none;margin-top:2px;}

.finhook{
  display:flex;gap:16px;align-items:flex-start;margin-top:28px;padding:24px 26px;border-radius:var(--radius-lg);
  background:linear-gradient(135deg,#ECFDF3,#F4FDF8);border:1.5px solid rgba(18,183,106,.28);
}
.finhook__ic{
  width:42px;height:42px;border-radius:50%;background:#12B76A;color:#fff;flex:none;
  display:grid;place-items:center;box-shadow:0 8px 20px rgba(18,183,106,.3);
}
.finhook__ic svg{width:22px;height:22px;}
.finhook b{display:block;font-family:var(--f-head);font-size:1.05rem;margin-bottom:5px;}
.finhook p{font-size:.93rem;color:#2F5741;line-height:1.65;}

@media(max-width:1024px){
  .finbanks{grid-template-columns:repeat(3,1fr);}
}
@media(max-width:620px){
  .finbanks{grid-template-columns:repeat(2,1fr);gap:12px;}
  .finbank{padding:16px 12px;}
  .finhook{flex-direction:column;gap:12px;padding:20px;}
}

/* ============================================================
   CALCULATOR
   ============================================================ */
.calc{display:grid;grid-template-columns:1fr 1fr;gap:0;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg);background:#fff;}
.calc__in{padding:clamp(28px,3.4vw,44px);}
.calc__out{padding:clamp(28px,3.4vw,44px);background:var(--ink);color:#fff;position:relative;overflow:hidden;}
.calc__out::before{content:"";position:absolute;width:320px;height:320px;border-radius:50%;background:rgba(255,122,0,.28);filter:blur(80px);top:-100px;right:-80px;}
.calc__out > *{position:relative;z-index:1;}
.slider-row{margin-bottom:26px;}
.slider-row .top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px;}
.slider-row label{font-size:.88rem;font-weight:700;}
.slider-row .val{font-family:var(--f-head);font-weight:800;font-size:1.2rem;background:var(--grad-fire);-webkit-background-clip:text;background-clip:text;color:transparent;}
input[type=range]{width:100%;-webkit-appearance:none;appearance:none;height:7px;border-radius:100px;background:#E8ECF4;outline:none;}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:#fff;border:5px solid var(--orange);cursor:pointer;box-shadow:0 4px 14px rgba(255,122,0,.4);transition:transform .15s;}
input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.12);}
input[type=range]::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:#fff;border:5px solid var(--orange);cursor:pointer;}
.seg{display:flex;gap:8px;flex-wrap:wrap;}
.seg button{
  flex:1;min-width:88px;padding:11px 8px;border-radius:12px;border:1.5px solid var(--line);
  background:#fff;font-size:.85rem;font-weight:700;cursor:pointer;transition:.2s;
}
.seg button.is-active{background:var(--ink);color:#fff;border-color:var(--ink);}
.calc-res{display:grid;gap:16px;}
.calc-res .big{padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.14);}
.calc-res .big span{font-size:.82rem;color:#9AA5BB;display:block;}
.calc-res .big b{font-family:var(--f-head);font-size:clamp(2.1rem,4.4vw,3rem);font-weight:800;line-height:1.1;background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent;}
.calc-res .row{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:.9rem;}
.calc-res .row span{color:#A9B2C6;}
.calc-res .row b{font-weight:700;font-size:1.02rem;}
.calc-res .row b.green{color:#4ADE80;}

/* ---------- EMI add-on ---------- */
.emi-box{margin-top:26px;padding-top:24px;border-top:1px dashed var(--line);}
.emi-toggle{display:flex;align-items:flex-start;gap:13px;cursor:pointer;user-select:none;}
.emi-toggle input{position:absolute;opacity:0;width:0;height:0;}
.emi-switch{
  width:46px;height:26px;border-radius:100px;background:#DDE3EE;flex:none;position:relative;
  transition:background .25s;margin-top:2px;
}
.emi-switch::after{
  content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;
  background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.2);transition:transform .25s;
}
.emi-toggle input:checked + .emi-switch{background:var(--grad-fire);}
.emi-toggle input:checked + .emi-switch::after{transform:translateX(20px);}
.emi-toggle input:focus-visible + .emi-switch{outline:3px solid rgba(10,132,255,.4);outline-offset:2px;}
.emi-toggle b{display:block;font-size:.93rem;font-weight:700;}
.emi-toggle small{display:block;font-size:.79rem;color:var(--slate);line-height:1.45;margin-top:2px;}
.emi-fields{margin-top:24px;animation:emiIn .35s ease;}
@keyframes emiIn{from{opacity:0;transform:translateY(-8px)}}

.emi-result{
  margin-top:6px;padding-top:18px;border-top:1px solid rgba(255,255,255,.14);
  animation:emiIn .35s ease;display:grid;gap:14px;
}
.emi-result__head{
  font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#FFB84D;
}
.emi-hero-row b{
  font-family:var(--f-head);font-size:1.7rem!important;font-weight:800;
  background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.emi-verdict{
  display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:14px;
  background:rgba(74,222,128,.12);border:1px solid rgba(74,222,128,.3);
}
.emi-verdict.warn{background:rgba(255,170,29,.12);border-color:rgba(255,170,29,.32);}
.emi-verdict__ic{
  width:26px;height:26px;border-radius:50%;background:#4ADE80;color:#06301A;flex:none;
  display:grid;place-items:center;font-weight:900;font-size:.85rem;
}
.emi-verdict.warn .emi-verdict__ic{background:#FFAA1D;color:#3A2400;}
.emi-verdict b{display:block;font-size:.92rem;color:#fff;}
.emi-verdict span{display:block;font-size:.81rem;color:#B7C0D2;line-height:1.5;}

.emi-bars{display:grid;gap:12px;}
.emi-bar{display:grid;grid-template-columns:82px 1fr 82px;align-items:center;gap:11px;}
.emi-bar__lbl{font-size:.8rem;color:#A9B2C6;}
.emi-bar__track{height:10px;border-radius:100px;background:rgba(255,255,255,.1);overflow:hidden;}
.emi-bar__fill{height:100%;border-radius:100px;width:0;transition:width .6s cubic-bezier(.2,.8,.3,1);}
.emi-bar__fill.red{background:linear-gradient(90deg,#F5254A,#FF7A00);}
.emi-bar__fill.green{background:linear-gradient(90deg,#22C55E,#4ADE80);}
.emi-bar__val{font-size:.85rem;font-weight:700;text-align:right;}
.emi-note{font-size:.75rem!important;color:#8892A8!important;line-height:1.5;}

/* ============================================================
   COMPARISON TABLE
   ============================================================ */
.cmp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--radius-lg);box-shadow:var(--shadow);}
.cmp{width:100%;min-width:680px;border-collapse:separate;border-spacing:0;background:#fff;}
.cmp th,.cmp td{padding:16px 20px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top;}
.cmp thead th{
  background:var(--bg-soft);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;
  font-weight:800;color:var(--slate);position:sticky;top:0;
}
.cmp thead th.us{
  background:linear-gradient(135deg,rgba(245,37,74,.09),rgba(255,122,0,.09));
  color:var(--ink);font-size:.88rem;letter-spacing:0;text-transform:none;
}
.cmp thead th.us b{display:block;font-family:var(--f-head);font-size:1.02rem;
  background:var(--grad-fire);-webkit-background-clip:text;background-clip:text;color:transparent;}
.cmp tbody td:first-child{font-weight:700;font-size:.9rem;width:24%;}
.cmp td{font-size:.87rem;color:var(--slate);}
.cmp td.us{background:rgba(255,122,0,.045);color:#25303F;font-weight:600;border-left:2px solid rgba(255,122,0,.25);border-right:2px solid rgba(255,122,0,.25);}
.cmp tbody tr:last-child td{border-bottom:0;}
.cmp tbody tr:last-child td.us{border-bottom:2px solid rgba(255,122,0,.25);}
.cmp .yes,.cmp .no{display:inline-flex;align-items:center;gap:7px;}
.cmp .yes::before{content:"✓";width:19px;height:19px;border-radius:50%;background:#DCFCE7;color:#15803D;font-weight:900;font-size:.72rem;display:grid;place-items:center;flex:none;}
.cmp .no::before{content:"✕";width:19px;height:19px;border-radius:50%;background:#FEE2E2;color:#B91C1C;font-weight:900;font-size:.72rem;display:grid;place-items:center;flex:none;}
.cmp-hint{display:none;text-align:center;font-size:.78rem;color:var(--slate-2);margin-bottom:12px;}
@media(max-width:760px){.cmp-hint{display:block;}}

/* ============================================================
   LEGAL PAGES
   ============================================================ */
.legal{max-width:820px;margin-inline:auto;}
.legal h2{margin:36px 0 12px;font-size:1.35rem;}
.legal h2:first-child{margin-top:0;}
.legal p,.legal li{font-size:.95rem;color:var(--slate);line-height:1.75;}
.legal ul{margin:12px 0 12px 4px;display:grid;gap:8px;}
.legal ul li{display:flex;gap:10px;}
.legal ul li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--grad-fire);flex:none;margin-top:9px;}
.legal a{color:var(--blue-deep);font-weight:600;text-decoration:underline;}
.legal .updated{
  display:inline-block;font-size:.8rem;font-weight:700;color:var(--blue-deep);
  background:var(--bg-tint);padding:6px 14px;border-radius:100px;margin-bottom:8px;
}
.legal-hero{background:var(--ink);color:#fff;padding:clamp(50px,7vw,80px) 0 clamp(40px,5vw,60px);position:relative;overflow:hidden;}
.legal-hero::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:rgba(255,122,0,.22);filter:blur(100px);top:-160px;right:-60px;}
.legal-hero .wrap{position:relative;z-index:1;}
.legal-hero h1{color:#fff;font-size:clamp(1.9rem,4vw,2.8rem);}
.legal-hero p{color:#A9B2C6;margin-top:12px;}
.backlink{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:.88rem;color:#FFB84D;margin-bottom:18px;}
.backlink svg{width:16px;height:16px;}

/* ============================================================
   BLOG
   ============================================================ */
.bloghero{background:var(--ink);color:#fff;padding:clamp(46px,6vw,74px) 0 clamp(38px,5vw,58px);position:relative;overflow:hidden;}
.bloghero::before{content:"";position:absolute;width:440px;height:440px;border-radius:50%;background:rgba(255,122,0,.22);filter:blur(105px);top:-170px;right:-60px;}
.bloghero::after{content:"";position:absolute;width:340px;height:340px;border-radius:50%;background:rgba(10,132,255,.18);filter:blur(95px);bottom:-190px;left:-70px;}
.bloghero .wrap{position:relative;z-index:1;}
.bloghero h1{color:#fff;font-size:clamp(1.9rem,4vw,2.9rem);}
.bloghero p{color:#A9B2C6;margin-top:12px;max-width:640px;}

.postgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.post{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s,border-color .3s;}
.post:hover{transform:translateY(-7px);box-shadow:var(--shadow);border-color:rgba(10,132,255,.2);}
.post__img{position:relative;overflow:hidden;}
.post__img img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .7s;}
.post:hover .post__img img{transform:scale(1.06);}
.post__cat{position:absolute;top:12px;left:12px;background:var(--grad-fire);color:#fff;
  font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:5px 12px;border-radius:100px;}
.post__body{padding:22px;display:flex;flex-direction:column;flex:1;}
.post__meta{display:flex;gap:12px;font-size:.76rem;color:var(--slate-2);margin-bottom:10px;flex-wrap:wrap;}
.post__meta span{display:inline-flex;align-items:center;gap:5px;}
.post h3{font-size:1.06rem;line-height:1.35;margin-bottom:9px;}
.post p{font-size:.88rem;flex:1;}
.post__link{display:inline-flex;align-items:center;gap:7px;margin-top:16px;font-weight:700;font-size:.86rem;color:var(--blue-deep);}
.post__link svg{width:15px;height:15px;transition:transform .25s;}
.post:hover .post__link svg{transform:translateX(4px);}
.post--feat{grid-column:span 3;flex-direction:row;}
.post--feat .post__img{flex:1.15;}
.post--feat .post__img img{height:100%;aspect-ratio:auto;min-height:300px;}
.post--feat .post__body{flex:1;justify-content:center;padding:clamp(24px,3vw,42px);}
.post--feat h3{font-size:clamp(1.3rem,2.2vw,1.75rem);}
.post--feat p{flex:none;font-size:.95rem;}

/* article */
.article{max-width:790px;margin-inline:auto;}
.article__hero{background:var(--ink);color:#fff;padding:clamp(40px,5vw,64px) 0 clamp(34px,4vw,50px);position:relative;overflow:hidden;}
.article__hero::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:rgba(255,122,0,.2);filter:blur(100px);top:-160px;right:-50px;}
.article__hero .wrap{position:relative;z-index:1;max-width:830px;}
.article__hero h1{color:#fff;font-size:clamp(1.75rem,3.6vw,2.6rem);margin-top:14px;}
.article__meta{display:flex;gap:16px;flex-wrap:wrap;font-size:.83rem;color:#A9B2C6;margin-top:18px;
  padding-top:16px;border-top:1px solid rgba(255,255,255,.13);}
.article__meta span{display:inline-flex;align-items:center;gap:6px;}
.article__meta svg{width:14px;height:14px;stroke:#FFB84D;fill:none;stroke-width:2;}
.article__cover{border-radius:var(--radius);overflow:hidden;margin:-38px auto 34px;position:relative;z-index:5;
  max-width:900px;box-shadow:var(--shadow-lg);}
.article__cover img{width:100%;aspect-ratio:16/8;object-fit:cover;}
.article h2{font-size:clamp(1.3rem,2.2vw,1.65rem);margin:38px 0 14px;}
.article h3{font-size:1.12rem;margin:26px 0 10px;}
.article p{margin-bottom:15px;font-size:1rem;line-height:1.78;}
.article ul,.article ol{margin:0 0 18px 2px;display:grid;gap:9px;}
.article ul li,.article ol li{font-size:.98rem;color:var(--slate);line-height:1.7;display:flex;gap:11px;}
.article ul li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--grad-fire);flex:none;margin-top:10px;}
.article ol{counter-reset:n;}
.article ol li{counter-increment:n;}
.article ol li::before{content:counter(n);width:22px;height:22px;border-radius:50%;background:var(--bg-tint);
  color:var(--blue-deep);font-size:.75rem;font-weight:800;display:grid;place-items:center;flex:none;margin-top:3px;}
.article a{color:var(--blue-deep);font-weight:600;text-decoration:underline;}
.article strong{color:var(--ink);font-weight:700;}
.article table{width:100%;border-collapse:collapse;margin:22px 0;font-size:.92rem;
  border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;}
.article th{background:var(--bg-soft);text-align:left;padding:13px 15px;font-size:.8rem;
  text-transform:uppercase;letter-spacing:.06em;font-weight:800;color:var(--slate);}
.article td{padding:13px 15px;border-top:1px solid var(--line);}
.article tbody tr:nth-child(even){background:#FBFCFE;}
.callout{background:var(--bg-tint);border-left:4px solid var(--blue);border-radius:0 14px 14px 0;
  padding:20px 24px;margin:26px 0;}
.callout b{display:block;margin-bottom:6px;font-size:.95rem;}
.callout p{font-size:.92rem;margin:0;}
.callout--warm{background:#FFF6EC;border-left-color:var(--orange);}
.callout--green{background:#ECFDF3;border-left-color:#12B76A;}
.toc{background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--radius);padding:22px 26px;margin-bottom:32px;}
.toc b{display:block;font-family:var(--f-head);font-size:.95rem;margin-bottom:12px;}
.toc ol{margin:0;gap:7px;}
.toc ol li{font-size:.9rem;}
.toc a{text-decoration:none;color:var(--slate);}
.toc a:hover{color:var(--blue-deep);}
.article__cta{background:var(--grad-fire);color:#fff;border-radius:var(--radius-lg);
  padding:clamp(26px,3.5vw,40px);margin:40px 0 10px;text-align:center;}
.article__cta h3{color:#fff;font-size:1.35rem;margin:0 0 8px;}
.article__cta p{color:rgba(255,255,255,.92);margin-bottom:20px;}
.article__cta .btn{background:#fff;color:var(--red);border-color:#fff;}
.article__cta .btn--wa2{background:rgba(255,255,255,.15);color:#fff;border:1.5px solid rgba(255,255,255,.5);}
.related{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:20px;}
@media(max-width:1024px){
  .postgrid{grid-template-columns:repeat(2,1fr);}
  .post--feat{grid-column:span 2;flex-direction:column;}
  .post--feat .post__img img{min-height:0;aspect-ratio:16/9;}
  .related{grid-template-columns:1fr;}
}
@media(max-width:620px){
  .postgrid{grid-template-columns:1fr;}
  .post--feat{grid-column:span 1;}
  .article__cover{margin-top:-22px;}
}

/* ============================================================
   404 PAGE
   ============================================================ */
.nf{max-width:760px;margin-inline:auto;text-align:center;position:relative;}
.nf__code{
  font-family:var(--f-head);font-size:clamp(6rem,18vw,11rem);font-weight:800;line-height:.9;
  background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent;
  opacity:.16;margin-bottom:-18px;letter-spacing:-.04em;user-select:none;
}
.nf h1{margin:12px 0 14px;}
.nf > p{max-width:560px;margin-inline:auto;}
.nf__btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px;}
.nf__or{font-size:.88rem;margin-top:44px;margin-bottom:16px;}
.nf__links{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;text-align:left;}
.nf__links a{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);padding:16px 18px;
  transition:transform .26s,box-shadow .26s,border-color .26s;
}
.nf__links a:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:rgba(10,132,255,.28);}
.nf__links b{display:block;font-size:.93rem;font-weight:700;margin-bottom:3px;}
.nf__links span{display:block;font-size:.79rem;color:var(--slate-2);line-height:1.45;}
@media(max-width:820px){.nf__links{grid-template-columns:repeat(2,1fr);}}
@media(max-width:460px){.nf__links{grid-template-columns:1fr;}.nf__btns .btn{width:100%;}}

/* Skip link (keyboard & screen-reader accessibility) */
.skip{
  position:absolute;left:-9999px;top:0;z-index:1500;background:var(--ink);color:#fff;
  padding:12px 22px;border-radius:0 0 12px 0;font-weight:700;font-size:.9rem;
}
.skip:focus{left:0;}

/* ============================================================
   PROCESS TIMELINE
   ============================================================ */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;position:relative;}
.step{position:relative;padding-left:0;}
.step__n{
  width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font-family:var(--f-head);
  font-weight:800;font-size:1.15rem;color:#fff;background:var(--grad-cool);margin-bottom:18px;
  box-shadow:0 10px 26px rgba(10,132,255,.25);position:relative;z-index:2;
}
.step:nth-child(2) .step__n{background:linear-gradient(135deg,#5B3AF0,#A020C0);box-shadow:0 10px 26px rgba(124,58,237,.26);}
.step:nth-child(3) .step__n{background:linear-gradient(135deg,#C41A82,#F5254A);box-shadow:0 10px 26px rgba(214,25,155,.26);}
.step:nth-child(4) .step__n{background:linear-gradient(135deg,#F5254A,#FF6A00);box-shadow:0 10px 26px rgba(245,37,74,.26);}
.step:nth-child(5) .step__n{background:var(--grad-warm);box-shadow:0 10px 26px rgba(255,140,0,.26);}
.step:nth-child(6) .step__n{background:linear-gradient(135deg,#FFA51F,#FFD23F);box-shadow:0 10px 26px rgba(255,180,30,.3);}
.step h3{font-size:1.08rem;margin-bottom:8px;}
.step p{font-size:.9rem;}
.step__time{display:inline-block;margin-top:10px;font-size:.75rem;font-weight:800;color:var(--blue-deep);background:var(--bg-tint);padding:4px 11px;border-radius:100px;}

/* ============================================================
   SUBSIDY STATUS TRACKER
   ============================================================ */
.track{list-style:none;counter-reset:none;position:relative;max-width:840px;margin-inline:auto;padding:0;}
.track__i{display:flex;gap:20px;position:relative;padding-bottom:26px;}
.track__i:last-child{padding-bottom:0;}
/* connecting line */
.track__i::before{
  content:"";position:absolute;left:21px;top:44px;bottom:-4px;width:2px;
  background:linear-gradient(180deg,var(--line),#E6E9F0);
}
.track__i:last-child::before{display:none;}
.track__n{
  width:44px;height:44px;border-radius:50%;flex:none;display:grid;place-items:center;
  font-family:var(--f-head);font-weight:800;font-size:1rem;color:#fff;position:relative;z-index:1;
  background:var(--grad-cool);box-shadow:0 8px 20px rgba(10,132,255,.22);
}
.track__i:nth-child(2) .track__n{background:linear-gradient(135deg,#5B3AF0,#A020C0);box-shadow:0 8px 20px rgba(124,58,237,.22);}
.track__i:nth-child(3) .track__n{background:linear-gradient(135deg,#C41A82,#F5254A);box-shadow:0 8px 20px rgba(214,25,155,.22);}
.track__i:nth-child(4) .track__n{background:var(--grad-fire);box-shadow:0 8px 20px rgba(245,37,74,.22);}
.track__i:nth-child(5) .track__n{background:var(--grad-warm);box-shadow:0 8px 20px rgba(255,140,0,.24);}
.track__i--done .track__n{background:#12B76A!important;box-shadow:0 8px 22px rgba(18,183,106,.34)!important;font-size:1.2rem;}
.track__b{
  flex:1;background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:18px 22px;transition:transform .26s,box-shadow .26s,border-color .26s;
}
.track__b:hover{transform:translateX(5px);box-shadow:var(--shadow);border-color:rgba(10,132,255,.2);}
.track__i--done .track__b{background:linear-gradient(135deg,#ECFDF3,#F6FEFA);border-color:rgba(18,183,106,.3);}
.track__b b{display:block;font-family:var(--f-head);font-size:1.03rem;margin-bottom:5px;}
.track__b p{font-size:.9rem;line-height:1.6;}
.track__t{
  display:inline-block;margin-top:10px;font-size:.74rem;font-weight:800;
  color:var(--blue-deep);background:var(--bg-tint);padding:4px 12px;border-radius:100px;
}
.track__t--done{color:#047857;background:rgba(18,183,106,.12);}

.trackcta{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:40px;}
.trackcta__box{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:26px;
  display:flex;flex-direction:column;align-items:flex-start;
}
.trackcta__ic{
  width:46px;height:46px;border-radius:13px;display:grid;place-items:center;color:#fff;margin-bottom:14px;
}
.trackcta__ic svg{width:23px;height:23px;}
.trackcta__box b{display:block;font-family:var(--f-head);font-size:1.06rem;margin-bottom:7px;}
.trackcta__box p{font-size:.9rem;line-height:1.6;flex:1;margin-bottom:18px;}

@media(max-width:760px){
  .trackcta{grid-template-columns:1fr;}
  .track__i{gap:14px;}
  .track__n{width:38px;height:38px;font-size:.9rem;}
  .track__i::before{left:18px;top:38px;}
  .track__b{padding:15px 17px;}
}

/* ============================================================
   PRODUCTS / BRANDS
   ============================================================ */
.brandbox{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;transition:.3s;}
.brandbox:hover{box-shadow:var(--shadow);transform:translateY(-5px);}
.brandbox__h{display:flex;align-items:center;gap:13px;margin-bottom:18px;}
.brandbox__h .ic{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;flex:none;}
.brandbox__h .ic svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:1.9;}
.brandbox__h h3{font-size:1.08rem;}
.brandbox__h small{display:block;font-size:.76rem;color:var(--slate-2);font-weight:600;}
.tags{display:flex;flex-wrap:wrap;gap:8px;}
.tag{padding:7px 14px;border-radius:9px;background:var(--bg-soft);border:1px solid var(--line);font-size:.82rem;font-weight:600;color:#3A4356;transition:.2s;}
.tag:hover{background:var(--grad-cool);color:#fff;border-color:transparent;transform:translateY(-2px);}
.brandbox p{font-size:.86rem;margin-top:16px;}

/* ============================================================
   FEATURE / WHY US SPLIT
   ============================================================ */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
.split__media{position:relative;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg);}
.split__media img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3.1;transition:transform .8s;}
.split__media:hover img{transform:scale(1.05);}
.float-badge{
  position:absolute;bottom:22px;left:22px;right:22px;background:rgba(255,255,255,.96);
  backdrop-filter:blur(12px);border-radius:16px;padding:16px 20px;display:flex;align-items:center;gap:14px;box-shadow:var(--shadow);
}
.float-badge .fb-ic{width:44px;height:44px;border-radius:12px;background:var(--grad-warm);display:grid;place-items:center;flex:none;}
.float-badge .fb-ic svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:2;}
/* badge sits on a light card, so force dark text even inside .section--dark */
.float-badge b{display:block;font-size:.95rem;color:var(--ink);}
.float-badge span{font-size:.78rem;color:var(--slate);}
.section--dark .float-badge b{color:var(--ink);}
.section--dark .float-badge span{color:var(--slate);}

.uspgrid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:30px;}
.usp{display:flex;gap:14px;}
.usp .ui{width:42px;height:42px;border-radius:12px;background:var(--bg-tint);display:grid;place-items:center;flex:none;}
.usp .ui svg{width:20px;height:20px;stroke:var(--blue-deep);fill:none;stroke-width:2;}
.usp b{display:block;font-size:.95rem;font-weight:700;margin-bottom:3px;}
.usp p{font-size:.84rem;line-height:1.55;}
.section--dark .usp .ui{background:rgba(255,255,255,.09);}
.section--dark .usp .ui svg{stroke:#FFB84D;}
.section--dark .usp b{color:#fff;}

/* ============================================================
   SUBSIDY BAND
   ============================================================ */
.subsidy{background:linear-gradient(120deg,#0B1020 0%,#14203D 52%,#2A1330 100%);color:#fff;position:relative;overflow:hidden;}
.subsidy::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:rgba(255,122,0,.25);filter:blur(110px);top:-160px;left:-100px;}
.subsidy::after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:rgba(10,132,255,.22);filter:blur(100px);bottom:-160px;right:-80px;}
.subsidy .wrap{position:relative;z-index:2;}
.sub-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center;}
.sub-table{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.13);border-radius:var(--radius-lg);padding:8px;backdrop-filter:blur(10px);}
.sub-table table{width:100%;border-collapse:collapse;}
.sub-table th{
  text-align:left;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:#8E9ABA;
  font-weight:800;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.12);
}
.sub-table td{padding:14px 16px;font-size:.92rem;border-bottom:1px solid rgba(255,255,255,.07);}
.sub-table tr:last-child td{border-bottom:0;}
.sub-table td:first-child{font-weight:700;}
.sub-table td.hl{color:#4ADE80;font-weight:800;}
.sub-steps{display:grid;gap:14px;margin-top:26px;}
.sub-steps li{display:flex;gap:14px;align-items:flex-start;}
.sub-steps .n{width:28px;height:28px;border-radius:9px;background:var(--grad-warm);color:#231000;display:grid;place-items:center;font-weight:800;font-size:.82rem;flex:none;}
.sub-steps p{font-size:.9rem;color:#B7C0D2;}
.sub-steps b{color:#fff;display:block;font-size:.93rem;}

/* ============================================================
   PROJECTS
   ============================================================ */
.filters{display:flex;gap:9px;flex-wrap:wrap;justify-content:center;margin-bottom:34px;}
.filters button{
  padding:9px 20px;border-radius:100px;border:1.5px solid var(--line);background:#fff;
  font-size:.86rem;font-weight:700;cursor:pointer;transition:.22s;
}
.filters button.is-active{background:var(--ink);color:#fff;border-color:var(--ink);}
.proj{border-radius:var(--radius);overflow:hidden;position:relative;box-shadow:var(--shadow-sm);transition:.35s;background:#000;}
.proj:hover{transform:translateY(-7px);box-shadow:var(--shadow-lg);}
.proj img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .7s,opacity .4s;opacity:.92;}
.proj:hover img{transform:scale(1.07);opacity:1;}
.proj__ov{position:absolute;inset:auto 0 0 0;padding:56px 22px 20px;background:linear-gradient(transparent,rgba(6,9,18,.93));color:#fff;}
.proj__ov b{display:block;font-family:var(--f-head);font-size:1.05rem;}
.proj__ov span{font-size:.81rem;color:#C3CBDC;}
.proj__cap{position:absolute;top:14px;left:14px;background:var(--grad-warm);color:#231000;font-size:.72rem;font-weight:800;padding:5px 12px;border-radius:100px;}

/* ============================================================
   TESTIMONIALS
   ============================================================ */
.tcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px;position:relative;transition:.3s;}
.tcard:hover{box-shadow:var(--shadow);transform:translateY(-5px);}
.tcard .quote{position:absolute;top:20px;right:24px;font-family:Georgia,serif;font-size:4.4rem;line-height:1;color:#EEF2F9;}
.stars{display:flex;gap:3px;margin-bottom:14px;}
.stars svg{width:16px;height:16px;fill:#FFA51F;}
.tcard p{font-size:.94rem;color:#3E4759;position:relative;z-index:1;}
.tmeta{display:flex;align-items:center;gap:13px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line);}
.avatar{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:.95rem;background:var(--grad-cool);flex:none;}
.avatar.v2{background:var(--grad-fire);}
.avatar.v3{background:var(--grad-warm);}
.avatar.v4{background:linear-gradient(135deg,#7C3AED,#D6199B);}
.tmeta b{display:block;font-size:.92rem;}
.tmeta span{font-size:.79rem;color:var(--slate-2);}

/* ============================================================
   SERVICE AREAS
   ============================================================ */
.areas{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;}
.area{
  padding:9px 18px;border-radius:100px;background:#fff;border:1px solid var(--line);
  font-size:.86rem;font-weight:600;color:#3A4356;transition:.22s;cursor:default;
}
.area:hover{background:var(--grad-cool);color:#fff;border-color:transparent;transform:translateY(-3px) scale(1.04);box-shadow:0 8px 20px rgba(10,132,255,.24);}
.area.is-hq{background:var(--grad-fire);color:#fff;border-color:transparent;box-shadow:var(--shadow-brand);}

/* ============================================================
   FAQ
   ============================================================ */
.faq{max-width:880px;margin-inline:auto;}
.faq__i{background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);margin-bottom:12px;overflow:hidden;transition:.25s;}
.faq__i.is-open{box-shadow:var(--shadow);border-color:rgba(10,132,255,.28);}
.faq__q{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;text-align:left;
  padding:19px 24px;background:none;border:0;cursor:pointer;font-weight:700;font-size:1rem;
}
.faq__q .pm{width:26px;height:26px;border-radius:50%;background:var(--bg-tint);display:grid;place-items:center;flex:none;transition:.3s;}
.faq__q .pm svg{width:13px;height:13px;stroke:var(--blue-deep);stroke-width:2.6;transition:.3s;}
.faq__i.is-open .pm{background:var(--grad-fire);}
.faq__i.is-open .pm svg{stroke:#fff;transform:rotate(45deg);}
.faq__a{max-height:0;overflow:hidden;transition:max-height .38s ease;}
.faq__a p{padding:0 24px 22px;font-size:.93rem;}

/* ============================================================
   CTA BAND
   ============================================================ */
.ctaband{background:var(--grad-fire);color:#fff;border-radius:var(--radius-lg);padding:clamp(34px,5vw,58px);position:relative;overflow:hidden;}
.ctaband::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:rgba(255,255,255,.13);top:-180px;right:-80px;}
.ctaband::after{content:"";position:absolute;width:300px;height:300px;border-radius:50%;background:rgba(255,255,255,.1);bottom:-160px;left:6%;}
.ctaband__in{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:34px;flex-wrap:wrap;}
.ctaband h2{color:#fff;}
.ctaband p{color:rgba(255,255,255,.9);margin-top:10px;max-width:560px;}
.ctaband .btn--ghost{background:#fff;color:var(--red);border-color:#fff;}

/* ============================================================
   CONTACT
   ============================================================ */
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:40px;align-items:start;}
.cinfo{display:grid;gap:16px;}
.cinfo__i{display:flex;gap:16px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;transition:.28s;}
.cinfo__i:hover{box-shadow:var(--shadow);transform:translateX(5px);border-color:rgba(10,132,255,.22);}
.cinfo__i .ic{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;flex:none;background:var(--grad-cool);}
.cinfo__i:nth-child(2) .ic{background:var(--grad-fire);}
.cinfo__i:nth-child(3) .ic{background:var(--grad-warm);}
.cinfo__i:nth-child(4) .ic{background:linear-gradient(135deg,#7C3AED,#D6199B);}
.cinfo__i .ic svg{width:21px;height:21px;stroke:#fff;fill:none;stroke-width:1.9;}
.cinfo__i b{display:block;font-size:.79rem;text-transform:uppercase;letter-spacing:.09em;color:var(--slate-2);margin-bottom:4px;}
.cinfo__i a,.cinfo__i p{font-size:.98rem;font-weight:600;color:var(--ink);}
.cinfo__i a:hover{color:var(--blue-deep);}
.formcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(26px,3.2vw,40px);box-shadow:var(--shadow);}
/* WhatsApp "send your bill" shortcut above the contact form */
.billnudge{
  display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:16px;
  background:linear-gradient(135deg,#EAFBF0,#F2FDF6);border:1.5px solid rgba(37,211,102,.32);
  transition:transform .25s,box-shadow .25s,border-color .25s;
}
.billnudge:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(37,211,102,.2);border-color:#25D366;}
.billnudge__ic{width:44px;height:44px;border-radius:13px;background:#25D366;color:#fff;
  display:grid;place-items:center;flex:none;box-shadow:0 8px 20px rgba(37,211,102,.32);}
.billnudge__ic svg{width:24px;height:24px;}
.billnudge__tx{flex:1;}
.billnudge__tx b{display:block;font-size:.95rem;color:var(--ink);}
.billnudge__tx small{display:block;font-size:.82rem;color:#3E6B50;line-height:1.45;margin-top:2px;}
.billnudge__ar{width:20px;height:20px;color:#1FA855;flex:none;transition:transform .25s;}
.billnudge:hover .billnudge__ar{transform:translateX(4px);}
.orsplit{display:flex;align-items:center;gap:14px;margin:20px 0 18px;}
.orsplit::before,.orsplit::after{content:"";flex:1;height:1px;background:var(--line);}
.orsplit span{font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--slate-2);}
@media(max-width:480px){
  .billnudge{flex-wrap:wrap;gap:11px;}
  .billnudge__ar{display:none;}
}

.formcard h3{margin-bottom:6px;}
.formcard > p{font-size:.9rem;margin-bottom:22px;}
.mapbox{margin-top:26px;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-sm);min-height:260px;}
.mapbox iframe{width:100%;height:260px;border:0;display:block;filter:grayscale(.15);}

/* Click-to-load map placeholder (never blocked by ad-blockers) */
.mapcard{position:relative;min-height:260px;display:grid;place-items:center;padding:26px 22px;
  background:linear-gradient(135deg,#F3F7FF 0%,#FFF4EC 100%);overflow:hidden;}
.mapcard__grid{position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(rgba(10,132,255,.13) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(10,132,255,.13) 1px,transparent 1px);
  background-size:34px 34px;
  -webkit-mask:radial-gradient(circle at 50% 45%,#000 30%,transparent 78%);
          mask:radial-gradient(circle at 50% 45%,#000 30%,transparent 78%);}
.mapcard__body{position:relative;z-index:1;text-align:center;display:grid;justify-items:center;gap:5px;}
.mapcard__pin{width:52px;height:52px;border-radius:50%;background:var(--grad-fire);display:grid;place-items:center;
  color:#fff;box-shadow:var(--shadow-brand);margin-bottom:6px;animation:pinBob 2.6s ease-in-out infinite;}
.mapcard__pin svg{width:25px;height:25px;}
@keyframes pinBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.mapcard b{font-family:var(--f-head);font-size:1.12rem;}
.mapcard__addr{font-size:.87rem;color:var(--slate);line-height:1.55;}
.mapcard__btns{display:flex;gap:9px;flex-wrap:wrap;justify-content:center;margin-top:14px;}
.mapcard__note{font-size:.73rem;color:var(--slate-2);margin-top:10px;}
@media(max-width:420px){.mapcard__btns .btn{width:100%;}}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{background:var(--ink);color:#A9B2C6;padding-top:70px;}
.footer__top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.25fr;gap:40px;padding-bottom:48px;}
.footer__logo{background:#fff;border-radius:14px;padding:12px 16px;display:inline-block;margin-bottom:18px;}
.footer__logo img{height:44px;width:auto;}
.footer p{font-size:.9rem;color:#8E97AB;}
.footer h4{color:#fff;font-family:var(--f-head);font-size:.98rem;font-weight:700;margin-bottom:18px;letter-spacing:0;}
.footer ul{display:grid;gap:11px;}
.footer ul a{font-size:.89rem;color:#9AA3B7;transition:.2s;display:inline-flex;align-items:center;gap:7px;}
.footer ul a:hover{color:#fff;transform:translateX(4px);}
.fnews input{
  width:100%;padding:12px 15px;border-radius:11px;border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);color:#fff;font-size:.9rem;outline:none;margin-bottom:10px;
}
.fnews input::placeholder{color:#7A8397;}
.fnews input:focus{border-color:var(--orange);}
.footer__bottom{
  border-top:1px solid rgba(255,255,255,.1);padding:22px 0 26px;display:flex;
  justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:.83rem;color:#79839A;
}
.footer__bottom a:hover{color:#fff;}
.fcerts{display:flex;gap:9px;flex-wrap:wrap;margin-top:20px;}
.fcert{font-size:.72rem;font-weight:700;padding:5px 11px;border-radius:7px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.11);color:#C3CBDC;}

/* ============================================================
   FLOATING ACTIONS
   ============================================================ */
.floats{position:fixed;right:20px;bottom:24px;z-index:880;display:flex;flex-direction:column;gap:12px;}
.fab{
  width:56px;height:56px;border-radius:50%;display:grid;place-items:center;color:#fff;
  box-shadow:0 12px 32px rgba(0,0,0,.24);transition:transform .25s;position:relative;border:0;cursor:pointer;
}
.fab:hover{transform:scale(1.1) translateY(-2px);}
.fab svg{width:27px;height:27px;}
.fab--wa{background:#25D366;}
.fab--call{background:var(--grad-fire);}
.fab--top{background:var(--ink);width:46px;height:46px;margin-inline:auto;opacity:0;visibility:hidden;}
.fab--top.show{opacity:1;visibility:visible;}
.fab--top svg{width:19px;height:19px;stroke:#fff;fill:none;stroke-width:2.6;}
.fab--wa::after{
  content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #25D366;
  animation:pulse 2.2s infinite;
}
@keyframes pulse{0%{transform:scale(1);opacity:.9}70%{transform:scale(1.55);opacity:0}100%{opacity:0}}
.fab__tip{
  position:absolute;right:calc(100% + 12px);top:50%;transform:translateY(-50%);white-space:nowrap;
  background:var(--ink);color:#fff;font-size:.79rem;font-weight:600;padding:7px 13px;border-radius:9px;
  opacity:0;visibility:hidden;transition:.22s;pointer-events:none;
}
.fab:hover .fab__tip{opacity:1;visibility:visible;}

/* Mobile sticky bar */
.mbar{
  position:fixed;left:0;right:0;bottom:0;z-index:870;display:none;
  background:rgba(255,255,255,.97);backdrop-filter:blur(14px);border-top:1px solid var(--line);
  padding:9px 12px;gap:9px;box-shadow:0 -6px 24px rgba(0,0,0,.09);
}
.mbar a{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;padding:12px;border-radius:12px;font-size:.87rem;font-weight:700;}
.mbar svg{width:17px;height:17px;}
.mbar .m1{background:var(--ink);color:#fff;}
.mbar .m2{background:#25D366;color:#fff;}
.mbar .m3{background:var(--grad-fire);color:#fff;}

/* ============================================================
   MODAL
   ============================================================ */
.modal{position:fixed;inset:0;z-index:960;display:none;place-items:center;padding:20px;}
.modal.is-open{display:grid;}
.modal__bd{position:absolute;inset:0;background:rgba(8,12,24,.72);backdrop-filter:blur(6px);animation:fade .3s;}
.modal__box{
  position:relative;background:#fff;border-radius:var(--radius-lg);width:min(100%,520px);
  max-height:92vh;overflow-y:auto;padding:34px;box-shadow:var(--shadow-lg);animation:pop .38s cubic-bezier(.2,1.2,.4,1);
}
@keyframes fade{from{opacity:0}}
@keyframes pop{from{opacity:0;transform:translateY(26px) scale(.96)}}
.modal__x{position:absolute;top:16px;right:16px;width:36px;height:36px;border-radius:50%;border:0;background:var(--bg-soft);cursor:pointer;font-size:1.3rem;line-height:1;color:var(--slate);transition:.2s;}
.modal__x:hover{background:var(--red);color:#fff;transform:rotate(90deg);}
body.no-scroll{overflow:hidden;}

.toast{
  position:fixed;bottom:30px;left:50%;transform:translate(-50%,140%);z-index:1200;
  background:var(--ink);color:#fff;padding:15px 26px;border-radius:100px;font-size:.9rem;font-weight:600;
  box-shadow:var(--shadow-lg);transition:transform .45s cubic-bezier(.2,1.2,.4,1);display:flex;align-items:center;gap:10px;
}
.toast.show{transform:translate(-50%,0);}
.toast svg{width:19px;height:19px;stroke:#4ADE80;fill:none;stroke-width:2.6;}

/* ============================================================
   REVEAL ANIMATION
   ============================================================ */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.3,1),transform .7s cubic-bezier(.2,.7,.3,1);}
.reveal.in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001s!important;transition-duration:.001s!important;}
  .reveal{opacity:1;transform:none;}
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
/* Narrow desktop / landscape tablet: tighten the nav so it never overflows */
@media(min-width:1025px) and (max-width:1380px){
  .nav__menu > li:not(.nav__mobcta) > a,
  .nav__menu > li:not(.nav__mobcta) > button{padding:9px 8px;font-size:.83rem;}
  .nav__actions .btn{padding:10px 15px;font-size:.82rem;}
  .nav__actions{gap:7px;}
  .brand img{height:40px;}
}
@media(min-width:1025px) and (max-width:1200px){
  .nav__actions .btn--wa span{display:none;}
  .nav__actions .btn--wa{padding:10px 12px;}
}
@media(min-width:1025px) and (max-width:1110px){
  .nav__menu > li:not(.nav__mobcta) > a,
  .nav__menu > li:not(.nav__mobcta) > button{padding:9px 6px;font-size:.79rem;}
  .brand img{height:36px;}
}

@media(max-width:1080px){
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .pricing{grid-template-columns:repeat(2,1fr);}
  .plan--featured{transform:none;}
  .hero__in{grid-template-columns:1fr;gap:40px;}
  .leadcard{max-width:560px;}
  .footer__top{grid-template-columns:1fr 1fr;gap:34px;}
}
@media(max-width:1024px){
  /* NOTE: .header uses backdrop-filter, which makes it the containing block for
     fixed-position children. The mobile menu therefore uses absolute positioning
     anchored to the header instead of position:fixed. */
  .nav__menu{
    position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;
    align-items:stretch;gap:4px;padding:20px;overflow-y:auto;transform:translateX(100%);
    height:calc(100vh - var(--nav-h));height:calc(100dvh - var(--nav-h));
    transition:transform .34s cubic-bezier(.3,.9,.3,1),visibility .34s;
    box-shadow:var(--shadow-lg);border-top:1px solid var(--line);
    visibility:hidden;   /* keeps the parked menu out of the layout & tab order */
  }
  .nav__menu.is-open{transform:none;visibility:visible;}
  .nav__menu > li:not(.nav__mobcta) > a,
  .nav__menu > li:not(.nav__mobcta) > button{padding:14px 16px;font-size:1rem;width:100%;justify-content:space-between;}
  .drop{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;
    max-height:0;overflow:hidden;padding:0 0 0 12px;transition:max-height .3s;}
  .has-drop.is-open .drop{max-height:520px;padding-bottom:8px;}
  .has-drop:hover .drop{max-height:0;}
  .has-drop.is-open:hover .drop{max-height:520px;}
  .burger{display:block;}
  .nav__actions .btn{display:none;}
  .nav__mobcta{display:grid;gap:10px;margin-top:20px;padding-top:20px;border-top:1px solid var(--line);}
  .nav__mobcta .btn{justify-content:center;padding:14px 20px;font-size:.95rem;}
  .grid-3,.grid-2,.steps,.split,.calc,.sub-grid,.contact-grid{grid-template-columns:1fr;}
  .split{gap:34px;}
  .stats{grid-template-columns:repeat(2,1fr);}
  .tb-hide{display:none!important;}
  .topbar__in{justify-content:center;}
  .topbar__left{gap:14px;justify-content:center;}
  .topbar__right{gap:10px;}
  .floats{bottom:82px;right:14px;}
  .fab{width:50px;height:50px;}
  .mbar{display:flex;}
  body{padding-bottom:0;}
  footer.footer{padding-bottom:70px;}
}
@media(max-width:620px){
  .grid-4,.pricing,.uspgrid{grid-template-columns:1fr;}
  .field-row{grid-template-columns:1fr;}
  .topbar{font-size:.76rem;}
  .topbar__left{gap:14px;}
  .section{padding:56px 0;}
  .wrap{width:min(100% - 30px,var(--max));}
  .card,.formcard,.leadcard{padding:24px;}
  .hero__trust{gap:20px;}
  .ctaband__in{flex-direction:column;align-items:flex-start;}
  .modal__box{padding:26px 22px;}
}
