/* Jhatpat website — design system shared with the app (see app/design/tokens.json) */
/* Inter (variable, self-hosted — no third-party font request). Files: assets/fonts/, SIL OFL 1.1. The ₹ glyph has its own 1 KB face so price pages never pull the 85 KB latin-ext file. */
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/inter-latin-wght-normal.woff2) format("woff2-variations"),url(../fonts/inter-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/inter-rupee-wght-normal.woff2) format("woff2-variations"),url(../fonts/inter-rupee-wght-normal.woff2) format("woff2");unicode-range:U+20B9}
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/inter-latin-ext-wght-normal.woff2) format("woff2-variations"),url(../fonts/inter-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20B8,U+20BA-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{--green:#123d32;--green2:#0d2d25;--green3:#1f5b49;--orange:#e58a2b;--orange2:#f5a442;--orangeSoft:#fff0df;--sage:#eaf1e6;--sage2:#f4f6f1;--cream:#fbfaf5;--ink:#14372f;--muted:#6f7e78;--line:#e1e7e2;--line2:#eef2ee;--tile:#f4f5f2;--success:#1d9a5b;--successSoft:#e1f5e7;--error:#d9453d;--errorSoft:#fdecec;--wa:#25d366;--shadow:0 26px 80px rgba(18,61,50,.13);--soft:0 12px 36px rgba(18,61,50,.075);--max:1240px;--r:28px}
*{box-sizing:border-box}
body{margin:0;background:var(--cream);color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.45}
a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button{font:inherit}
.wrap{width:min(var(--max),calc(100% - 44px));margin:auto}
.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;z-index:999;background:#fff;padding:10px;border-radius:10px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* header */
.header{position:sticky;top:0;z-index:80;background:rgba(251,250,245,.9);backdrop-filter:blur(18px);border-bottom:1px solid rgba(18,61,50,.07);transition:.25s}
.header.scrolled{box-shadow:0 12px 36px rgba(18,61,50,.08);background:rgba(251,250,245,.98)}
.nav{height:78px;display:flex;align-items:center;gap:26px}
.brand{display:flex;align-items:center;margin-right:auto}
.wordmark{font-size:30px;font-weight:950;letter-spacing:-1.9px;line-height:1;color:var(--green);white-space:nowrap}.wordmark em{font-style:normal;color:var(--orange)}
.navlinks{display:flex;align-items:center;gap:4px}
.navitem{position:relative}
.navitem>a{display:flex;align-items:center;gap:6px;padding:27px 11px 25px;font-size:14px;font-weight:800}
.navitem>a:after{content:"";position:absolute;left:12px;right:100%;bottom:18px;height:2px;background:var(--orange);transition:.2s}
.navitem:hover>a:after,.navitem:focus-within>a:after{right:12px}
.chev{font-size:10px;opacity:.55}
.mega{position:absolute;top:66px;left:50%;transform:translate(-50%,8px);width:760px;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);padding:18px;opacity:0;visibility:hidden;pointer-events:none;transition:.18s}
.navitem:hover .mega,.navitem:focus-within .mega{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
.mega.services{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.mega.cities{width:430px}
.megaTitle{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;padding:5px 7px 12px;border-bottom:1px solid var(--line);margin-bottom:6px}
.megaTitle strong{font-size:13px}.megaTitle a{font-size:12px;color:var(--orange);font-weight:850}
.megaLink{padding:8px 10px;border-radius:14px;display:flex;align-items:center;gap:10px}.megaLink:hover{background:var(--sage2)}
.megaLink .illus{width:40px;height:40px;border-radius:12px;flex:0 0 auto}
.megaLink b{display:block;font-size:13px}.megaLink small{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.cityMini{display:flex;justify-content:space-between;align-items:center;padding:12px;border-radius:14px}.cityMini:hover{background:var(--sage2)}
.cityMini small{display:block;color:var(--muted);font-size:10px;margin-top:2px}
.status{font-size:10px;padding:5px 8px;border-radius:999px;background:var(--sage);font-weight:850;white-space:nowrap}.status.live{color:#1d6e48;background:#e1f5e7}
.navActions{display:flex;gap:9px;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:12px 18px;border-radius:14px;border:1px solid transparent;font-weight:850;cursor:pointer;transition:.22s;font-size:14px}
.btn:hover{transform:translateY(-2px)}
.btn.green{background:var(--green);color:#fff;box-shadow:0 12px 28px rgba(18,61,50,.17)}
.btn.orange{background:var(--orange);color:#fff;box-shadow:0 12px 28px rgba(229,138,43,.18)}
.btn.light{background:#fff;border-color:rgba(18,61,50,.14);color:var(--green)}.btn.light:hover{background:#f8fbf8}
.btn.ghost{background:transparent;border-color:var(--line)}
.btn.text{background:transparent;padding:8px 2px;color:var(--green)}
.btn.wa{background:var(--wa);color:#fff}
.btn.lg{min-height:54px;padding:14px 24px;font-size:15px}
.waDot{width:9px;height:9px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 0 rgba(34,197,94,.35);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(34,197,94,0)}}
.menu{display:none;width:44px;height:44px;border:1px solid var(--line);background:#fff;border-radius:13px;cursor:pointer}
.mobile{display:none;background:#fff;border-top:1px solid var(--line);padding:12px 22px 22px}
.mobile.open{display:grid;gap:6px}.mobile a{padding:12px 3px;font-weight:850}
.mobile .mcta{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:6px}

/* hero */
.hero{padding:46px 0 62px;position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;width:620px;height:620px;border-radius:50%;right:-250px;top:-320px;background:radial-gradient(circle,rgba(229,138,43,.14),transparent 65%);pointer-events:none}
.heroGrid{display:grid;grid-template-columns:1.02fr .98fr;gap:46px;align-items:center}
.eyebrow{display:flex;align-items:center;gap:9px;text-transform:uppercase;letter-spacing:.15em;font-size:11px;font-weight:900}
.eyebrow:before{content:"";width:28px;height:2px;background:var(--orange)}
h1{font-size:clamp(56px,7vw,96px);line-height:.9;letter-spacing:-5px;margin:18px 0 22px;font-weight:950}
h1 em{font:italic 400 .97em Georgia,serif;color:var(--orange);letter-spacing:-3px}
.lead{font-size:18px;line-height:1.62;color:var(--muted);max-width:610px;margin:0}
.heroActions{display:flex;gap:10px;flex-wrap:wrap;margin-top:27px}
.heroProof{display:flex;flex-wrap:wrap;gap:15px 20px;margin-top:18px;color:var(--muted);font-size:12px;font-weight:750}
.heroProof span{display:flex;align-items:center;gap:7px}
.check{width:18px;height:18px;border-radius:50%;display:inline-grid;place-items:center;background:var(--sage);color:var(--green);font-size:10px;font-style:normal;flex:0 0 auto}
.heroMedia{position:relative;min-height:535px;perspective:1200px}
.photoShell{position:absolute;inset:0 2% 0 4%;border-radius:44px;overflow:hidden;background:linear-gradient(135deg,#edf2e9,#f4e8d8);box-shadow:var(--shadow);transform:rotateY(-2deg);animation:heroFloat 7s ease-in-out infinite}
.photoShell img{width:100%;height:100%;object-fit:cover;object-position:center}
.floatCard{position:absolute;background:rgba(255,255,255,.95);border:1px solid rgba(255,255,255,.85);border-radius:20px;padding:15px 17px;box-shadow:0 18px 50px rgba(18,61,50,.16);backdrop-filter:blur(12px);animation:float 6s ease-in-out infinite}
.floatCard b{display:block;font-size:14px}.floatCard small{display:block;margin-top:4px;color:var(--muted);font-size:11px}
.floatCard.one{right:-6px;top:66px}.floatCard.two{left:-12px;bottom:38px;animation-delay:1.3s}
@keyframes float{50%{transform:translateY(-7px)}}@keyframes heroFloat{50%{transform:rotateY(-1deg) translateY(-8px)}}

/* ticker */
.serviceTicker{position:relative;z-index:3;margin-top:-28px;overflow:hidden}
.tickerViewport{width:min(var(--max),calc(100% - 44px));margin:auto;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:23px;box-shadow:var(--shadow);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.tickerTrack{width:max-content;display:flex;animation:ticker 60s linear infinite}
.tickerViewport:hover .tickerTrack{animation-play-state:paused}
.tickerSet{display:flex;padding:9px 6px}
.tickerItem{display:flex;align-items:center;gap:9px;white-space:nowrap;padding:7px 15px 7px 9px;border-right:1px solid var(--line);font-size:12px;font-weight:850}
.tickerItem .illus{width:34px;height:34px;border-radius:10px}
.tickerItem:hover{color:var(--orange)}
@keyframes ticker{to{transform:translateX(-50%)}}

/* sections */
.section{padding:88px 0}.section.white{background:#fff}.section.sage{background:var(--sage2)}.section.dark{background:var(--green2);color:#fff}
.section.tight{padding:56px 0}
.sectionHead{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;margin-bottom:30px}
.kicker{text-transform:uppercase;letter-spacing:.14em;font-size:11px;font-weight:900;color:var(--orange)}
h2{font-size:clamp(36px,4.8vw,62px);line-height:1.02;letter-spacing:-3px;margin:9px 0 9px;font-weight:900}
h3{font-weight:850}
.copy{font-size:16px;line-height:1.65;color:var(--muted);max-width:720px;margin:0}.dark .copy{color:#c8d8d1}

/* illustration tile — same rule as the app: light render on #F4F5F2 with multiply */
.illus{background:var(--tile);border-radius:16px;overflow:hidden;display:grid;place-items:center}
.illus img{width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply}

/* service cards */
.serviceGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.serviceCard{position:relative;background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:0 8px 28px rgba(18,61,50,.05);transition:.25s;display:flex;flex-direction:column}
.tagNew{position:absolute;top:12px;left:12px;background:var(--orange);color:#fff;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:5px 9px;border-radius:999px;z-index:2}
.tagNew.inline{position:static;margin-left:8px;vertical-align:middle;padding:3px 7px;font-size:9px}
.serviceCard:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.serviceCard .illus{border-radius:0;aspect-ratio:1/.8}
.serviceBody{padding:15px 16px 17px;flex:1;display:flex;flex-direction:column}
.serviceBody h3{font-size:16px;margin:0 0 6px}
.serviceBody p{font-size:12px;line-height:1.5;color:var(--muted);margin:0;flex:1}
.serviceMeta{display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-size:11px;font-weight:850}
.serviceMeta .from{color:var(--green);font-size:13px}.serviceMeta .from s{color:var(--muted);font-weight:500;margin-left:4px;font-size:11px}
.arrow{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:var(--sage)}

/* why / mini cards */
.whyGrid{display:grid;grid-template-columns:1.12fr .88fr;gap:18px}
.whyHero{background:var(--green);color:#fff;border-radius:32px;padding:40px;position:relative;overflow:hidden}
.whyHero p{color:#cbdad4;line-height:1.7}
.whyHero:after{content:"J.";position:absolute;right:-18px;bottom:-70px;font-size:230px;font-weight:950;color:rgba(255,255,255,.055)}
.whyHero .kicker{color:var(--orange2)}
.whyLink{display:inline-flex;align-items:center;gap:8px;color:#fff;font-weight:850;margin-top:14px;padding-bottom:3px;border-bottom:1px solid rgba(255,255,255,.48);position:relative;z-index:2;transition:.2s}
.whyLink:hover{color:#ffd9ab;border-color:#ffd9ab;transform:translateX(3px)}
.whyCards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.miniCard{background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px;transition:.2s}
.miniCard:hover{transform:translateY(-3px);box-shadow:var(--soft)}
.miniIcon{width:42px;height:42px;border-radius:13px;background:var(--sage);display:grid;place-items:center;font-weight:900;color:var(--green)}
.miniIcon svg{width:22px;height:22px}
.miniCard h3{font-size:16px;margin:12px 0 6px}.miniCard p{font-size:12.5px;line-height:1.5;color:var(--muted);margin:0}
.miniCards3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.miniCards4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}

/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.step{background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px}
.stepNo{font-size:11px;font-weight:900;color:var(--orange);letter-spacing:.12em}
.step h3{font-size:22px;margin:12px 0 8px;letter-spacing:-.5px}.step p{color:var(--muted);font-size:13px;line-height:1.6;margin:0}

/* app section */
.appWrap{display:grid;grid-template-columns:.92fr 1.08fr;gap:22px;align-items:stretch}
.phoneScene{background:linear-gradient(135deg,#edf2e9,#fff0df);border-radius:34px;border:1px solid var(--line);min-height:640px;position:relative;overflow:hidden}
.device{position:relative;border-radius:42px;background:linear-gradient(155deg,#3b3b3e 0%,#151517 30%,#0c0c0d 62%,#26262a 100%);padding:7px;box-shadow:0 34px 80px rgba(13,45,37,.30),0 0 0 1px rgba(0,0,0,.65),0 0 0 1.5px rgba(255,255,255,.05) inset,-2px 0 0 -1px #2a2a2e,2px 0 0 -1px #2a2a2e}
.device:before{content:"";position:absolute;left:50%;top:15px;width:11px;height:11px;border-radius:50%;background:#050506;box-shadow:0 0 0 2px #1a1a1c,0 0 0 3px rgba(255,255,255,.05);transform:translateX(-50%);z-index:3}
.device:after{content:"";position:absolute;inset:7px;border-radius:35px;box-shadow:0 0 0 1px rgba(0,0,0,.55) inset,0 0 10px rgba(0,0,0,.28) inset;pointer-events:none;z-index:2}
.keys{position:absolute;inset:0;pointer-events:none}
.keys:before{content:"";position:absolute;left:-3px;top:17%;width:3px;height:22%;border-radius:2px 0 0 2px;background:linear-gradient(#232326 0 40%,transparent 40% 56%,#232326 56% 100%)}
.keys:after{content:"";position:absolute;right:-3px;top:23%;width:3px;height:13%;border-radius:0 2px 2px 0;background:#232326}
.device img{border-radius:35px;width:100%;height:auto;display:block;background:#faf9f5}
.phoneScene .device{position:absolute;left:9%;top:48px;width:252px;transform:rotate(-4deg)}
.phoneScene .device.two{left:auto;right:8%;top:122px;width:228px;transform:rotate(5deg)}
.appCopy{background:#fff;border:1px solid var(--line);border-radius:34px;padding:38px}
.appCopy h2{margin-top:7px}
.appButtons{display:flex;gap:9px;flex-wrap:wrap;margin-top:24px}
.playBadge{display:inline-flex;align-items:center;gap:10px;background:#111;color:#fff;border-radius:13px;padding:10px 15px;min-height:50px}
.playBadge svg{width:22px}.playBadge small{display:block;font-size:8px;opacity:.75;text-transform:uppercase;letter-spacing:.05em}.playBadge b{font-size:14px}
.whatsappBadge{display:inline-flex;align-items:center;gap:10px;background:#1fa855;color:#fff;border-radius:13px;padding:10px 15px;min-height:50px;font-weight:850}
.appPoints{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:26px}
.appPoint{display:flex;gap:9px;align-items:center;font-size:12.5px;font-weight:800}
.appShots{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;align-items:start}
.appShots.three{grid-template-columns:repeat(3,1fr);max-width:780px;margin:0 auto;gap:22px}
.appShot{margin:0}
.appShot .frame{position:relative;border-radius:34px;background:linear-gradient(155deg,#3b3b3e 0%,#151517 30%,#0c0c0d 62%,#26262a 100%);padding:6px;box-shadow:0 24px 60px rgba(13,45,37,.22),0 0 0 1px rgba(0,0,0,.65),0 0 0 1.5px rgba(255,255,255,.05) inset,-2px 0 0 -1px #2a2a2e,2px 0 0 -1px #2a2a2e}
.appShot .frame:before{content:"";position:absolute;left:50%;top:12px;width:9px;height:9px;border-radius:50%;background:#050506;box-shadow:0 0 0 2px #1a1a1c;transform:translateX(-50%);z-index:3}
.appShot .frame:after{content:"";position:absolute;inset:6px;border-radius:28px;box-shadow:0 0 0 1px rgba(0,0,0,.55) inset,0 0 8px rgba(0,0,0,.28) inset;pointer-events:none;z-index:2}
.appShot img{border-radius:28px;display:block;width:100%;height:auto;background:#faf9f5}
.appShot figcaption{color:var(--muted);font-size:12.5px;line-height:1.35;text-align:center;margin:14px 6px 0;font-weight:700;letter-spacing:-.1px}
.modes{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.mode{border-radius:28px;padding:30px;border:1px solid var(--line);background:#fff}
.mode.partner{background:var(--green);color:#fff;border-color:transparent}
.mode.partner p,.mode.partner li{color:#c8d8d1}
.mode h3{font-size:24px;margin:8px 0 10px;letter-spacing:-.6px}
.mode ul{margin:14px 0 0;padding:0;list-style:none;display:grid;gap:8px}
.mode li{font-size:13.5px;display:flex;gap:9px;align-items:flex-start;color:var(--muted)}
.mode li:before{content:"✓";flex:0 0 auto;width:18px;height:18px;border-radius:50%;background:var(--sage);color:var(--green);display:grid;place-items:center;font-size:10px}
.mode.partner li:before{background:rgba(255,255,255,.14);color:#fff}
.modeTag{display:inline-flex;font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;padding:6px 10px;border-radius:999px;background:var(--sage);color:var(--green)}
.mode.partner .modeTag{background:var(--orange);color:#fff}

/* photos strip */
.photoStrip{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.photoStrip figure{margin:0;border-radius:22px;overflow:hidden;position:relative;aspect-ratio:4/3.4;box-shadow:var(--soft)}
.photoStrip img{width:100%;height:100%;object-fit:cover;transition:.4s}
.photoStrip figure:hover img{transform:scale(1.04)}
.photoStrip figcaption{position:absolute;left:14px;bottom:12px;color:#fff;font-size:12px;font-weight:850;text-shadow:0 2px 10px rgba(0,0,0,.4)}
.photoStrip figure:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(7,27,22,.7))}

/* cities */
.cityGrid{display:grid;grid-template-columns:repeat(5,1fr);gap:15px}
.cityCard{height:290px;border-radius:24px;overflow:hidden;position:relative;background:linear-gradient(145deg,#235647,#d9a665);box-shadow:var(--soft)}
.cityCard img{width:100%;height:100%;object-fit:cover;transition:.3s}.cityCard:hover img{transform:scale(1.04)}
.cityCard:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(7,27,22,.85))}
.cityFallback{position:absolute;inset:0;background:radial-gradient(circle at 72% 20%,rgba(255,255,255,.2),transparent 27%),linear-gradient(145deg,#245e4d,#dba96c)}
.cityFallback:after{content:"";position:absolute;left:0;right:0;bottom:0;height:50%;background:linear-gradient(90deg,transparent 4%,rgba(255,255,255,.16) 5% 12%,transparent 13% 20%,rgba(255,255,255,.12) 21% 28%,transparent 29% 38%,rgba(255,255,255,.18) 39% 49%,transparent 50%);clip-path:polygon(0 70%,10% 53%,18% 66%,28% 31%,37% 67%,47% 42%,57% 69%,68% 35%,79% 64%,90% 45%,100% 66%,100% 100%,0 100%)}
.cityInfo{position:absolute;z-index:2;left:18px;right:18px;bottom:17px;color:#fff}
.cityInfo h3{font-size:24px;margin:0 0 3px}.cityInfo p{font-size:11px;color:#dbe7e1;margin:0}
.cityPill{display:inline-flex;align-items:center;gap:7px;margin-top:9px;padding:7px 9px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);font-size:9px;text-transform:uppercase;letter-spacing:.09em;font-weight:900}
.liveDot{width:7px;height:7px;border-radius:50%;background:#66df96;box-shadow:0 0 0 0 rgba(102,223,150,.45);animation:pulse 2s infinite}
.areaChips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.areaChips span{padding:9px 13px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:12px;font-weight:800}

/* faq */
.faq{max-width:900px;display:grid;gap:9px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:17px;padding:0 18px}
.faq summary{cursor:pointer;padding:17px 0;font-weight:850;list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";font-size:20px;color:var(--muted);flex:0 0 auto}
.faq details[open] summary:after{content:"–"}
.faq p{margin:0 0 17px;color:var(--muted);font-size:13.5px;line-height:1.6}

/* cta band */
.ctaBand{background:linear-gradient(125deg,var(--green2),var(--green3));border-radius:32px;padding:40px;display:flex;justify-content:space-between;gap:30px;align-items:center;color:#fff;overflow:hidden;position:relative}
.ctaBand:after{content:"J.";position:absolute;right:20%;bottom:-90px;font-size:260px;font-weight:950;color:rgba(255,255,255,.05)}
.ctaBand h2{font-size:42px;margin:0 0 8px}.ctaBand p{margin:0;color:#c9dad2}
.ctaBand .heroActions{margin:0;position:relative;z-index:2}
.ctaBand .btn.light{color:var(--green)!important;min-width:140px}

/* footer */
.footer{background:#0d0f0e;color:#fff;padding:68px 0 26px}
.footerTop{display:grid;grid-template-columns:1.45fr repeat(4,1fr);gap:42px}
.footer .wordmark{color:#fff;font-size:34px}
.footerBrand p{color:#9ca6a1;font-size:13px;line-height:1.65;max-width:280px;margin:18px 0 20px}
.footerCtas{display:grid;gap:8px}
.footerAction{color:#69db9b!important;font-weight:850!important}.footerAction:hover{color:#8be7b2!important}
.footer h4,.footer .fh{color:#fff;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.16em;margin:0 0 18px}
.footer a,.footer .linkBtn{display:block;color:#9ca6a1;font-size:13px;line-height:1.4;margin:10px 0;transition:.18s}
.footer a:hover,.footer .linkBtn:hover{color:#fff;transform:translateX(2px)}
.footer .brand a{margin:0}.footer .brand:hover{transform:none}
.footerRule{height:1px;background:#252a28;margin:44px 0}
.seoTitle{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}
.seoTitle span{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:900}
.seoTitle a{margin:0;color:#69db9b;font-weight:850}
.seoServiceGrid{display:grid;grid-template-columns:repeat(5,1fr);gap:34px}
.seoServiceCol h4{color:#cfd5d2;margin-bottom:10px}.seoServiceCol a{font-size:12px;margin:0;padding:4px 0}
.footerBottom{border-top:1px solid #252a28;margin-top:44px;padding-top:22px;display:flex;justify-content:space-between;gap:20px;font-size:11px;color:#676f6b;flex-wrap:wrap}
.footerBottom a{display:inline;margin:0 12px 0 0;font-size:11px;color:#8a938e}

/* inner pages */
.pageHero{padding:62px 0 44px}
.pageHero h1{font-size:clamp(46px,6.5vw,82px);line-height:.94;letter-spacing:-4px;margin:10px 0 16px}
.pageLead{font-size:17px;line-height:1.65;color:var(--muted);max-width:730px;margin:0}
.crumbs{font-size:12px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.crumbs a:hover{color:var(--orange)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0}
.filter{padding:10px 13px;border-radius:999px;border:1px solid var(--line);background:#fff;font-weight:800;font-size:12px;cursor:pointer}
.filter.active{background:var(--green);color:#fff;border-color:var(--green)}
.filter .fem{margin-right:6px;font-family:"Noto Color Emoji","Apple Color Emoji","Segoe UI Emoji",sans-serif}
.catBlock{margin-top:40px}.catBlock:first-child{margin-top:0}
.catBlock h2{font-size:30px;letter-spacing:-1.4px;margin:0 0 4px}
.catBlock .copy{margin-bottom:18px;font-size:14px}
.allServices{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}
.listCard{background:#fff;border:1px solid var(--line);border-radius:19px;padding:14px;display:flex;gap:13px;align-items:center;transition:.2s}
.listCard:hover{transform:translateY(-3px);box-shadow:var(--soft)}
.listCard .illus{width:64px;height:64px;border-radius:16px;flex:0 0 auto}
.listCard h3{font-size:14px;margin:0 0 4px}.listCard p{font-size:11.5px;color:var(--muted);line-height:1.4;margin:0}
.listCard .from{display:block;font-size:12px;font-weight:850;color:var(--green);margin-top:6px}
.detail{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:center}
.detailPhoto{aspect-ratio:1/1;max-height:470px;border-radius:30px;overflow:hidden;box-shadow:var(--shadow)}
.detailPhoto .illus{width:100%;height:100%;border-radius:30px}
.priceBox{display:flex;align-items:center;gap:14px;margin:22px 0 4px;flex-wrap:wrap}
.priceBox .big{font-size:34px;font-weight:950;letter-spacing:-1.5px}
.priceBox .big small{font-size:14px;font-weight:700;color:var(--muted);letter-spacing:0;margin-left:4px}
.priceBox s{color:var(--muted);font-size:15px}
.priceBox .tag{font-size:11px;font-weight:850;padding:6px 10px;border-radius:999px;background:var(--successSoft);color:#156b40}
.priceNote{font-size:12px;color:var(--muted);margin:0 0 6px}
.scopeGrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.scopeBox{background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px}
.scopeBox h3{margin:0 0 12px;font-size:18px}
.scopeBox ul{list-style:none;padding:0;margin:0;display:grid;gap:9px}
.scopeBox li{font-size:13px;color:var(--muted);line-height:1.45;padding-left:22px;position:relative}
.scopeBox.good li:before{content:"✓";position:absolute;left:0;color:var(--success);font-weight:900}
.scopeBox.bad li:before{content:"–";position:absolute;left:3px;color:#a3633b;font-weight:900}
.variants{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.variants span{padding:9px 13px;border-radius:999px;background:var(--sage);font-size:12px;font-weight:800;color:var(--green)}
.durations span{background:#fff;border:1px solid var(--line)}
.related{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.prose{max-width:820px;font-size:15px;line-height:1.7;color:#2e4b43}
.prose h2{font-size:26px;letter-spacing:-1px;margin:34px 0 10px}.prose h3{font-size:18px;margin:24px 0 8px}
.prose p,.prose li{color:#3f5951}.prose ul{padding-left:20px}
.notice{background:var(--orangeSoft);border-radius:16px;padding:14px 18px;font-size:13px;color:#8b4f0f;font-weight:600;margin:0 0 20px}
.legalSummary{background:var(--sage);border-radius:18px;padding:18px 20px;margin:0 0 22px;font-size:15px}.legalSummary b{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--green);margin-bottom:6px}.legalSummary p{margin:0;color:var(--ink)}.legalSummary a{color:var(--green);font-weight:700}
.legalToc{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}.legalToc a{font-size:12px;font-weight:700;color:var(--green);background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 11px}
.prose a{color:var(--green);font-weight:700}.prose ul{margin:8px 0 14px}.prose li{margin:4px 0}
.legalTable{width:100%;border-collapse:collapse;font-size:13.5px;margin:12px 0 18px;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 6px 20px rgba(18,61,50,.05)}.legalTable th,.legalTable td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}.legalTable th{background:var(--sage);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.statRow{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:24px}
.statBox{background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px}
.statBox b{display:block;font-size:30px;font-weight:950;letter-spacing:-1.5px}.statBox small{color:var(--muted);font-size:12px}
.dark .statBox{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12)}.dark .statBox small{color:#b9cdc5}
.contactGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.contactCard{background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px;display:flex;flex-direction:column;gap:10px}
.contactCard.wa{border-color:var(--wa)}
.contactCard h3{margin:0;font-size:18px}.contactCard p{margin:0;color:var(--muted);font-size:13px;line-height:1.5;flex:1}
.reveal{opacity:0;transform:translateY(16px);transition:.6s ease}.reveal.in{opacity:1;transform:none}
.notfound{text-align:center;padding:100px 0}
.notfound h1{font-size:120px;margin:0;color:var(--sage)}

@media(max-width:1050px){.navlinks{display:none}.menu{display:block}.heroGrid,.whyGrid,.appWrap,.detail{grid-template-columns:1fr}.heroMedia{min-height:500px}.serviceGrid,.photoStrip,.related{grid-template-columns:repeat(2,1fr)}.cityGrid{grid-template-columns:repeat(2,1fr)}.allServices{grid-template-columns:repeat(2,1fr)}.appShots{grid-template-columns:repeat(3,1fr)}.miniCards4{grid-template-columns:1fr 1fr}.footerTop{grid-template-columns:1.4fr 1fr 1fr}.seoServiceGrid{grid-template-columns:repeat(3,1fr)}.navActions .btn.light{display:none}}
@media(max-width:700px){.wrap{width:min(var(--max),calc(100% - 28px))}.nav{height:68px}.wordmark{font-size:27px}.navActions .btn.green{display:none}.hero{padding:38px 0 58px}.hero h1{font-size:50px;letter-spacing:-3.2px}.lead{font-size:16px}.heroMedia{min-height:380px}.photoShell{inset:0;border-radius:32px;transform:none;animation:none}.floatCard{padding:11px 12px;max-width:190px}.floatCard.one{right:7px;top:13px}.floatCard.two{left:7px;bottom:12px}.serviceTicker{margin-top:-19px}.tickerViewport{width:calc(100% - 18px);border-radius:19px}.section{padding:64px 0}.sectionHead{flex-direction:column;align-items:flex-start}h2{font-size:38px;letter-spacing:-2px}.serviceGrid,.cityGrid,.allServices,.whyCards,.steps,.scopeGrid,.miniCards3,.miniCards4,.modes,.contactGrid,.statRow{grid-template-columns:1fr}.photoStrip,.related{grid-template-columns:1fr 1fr}.serviceCard{display:grid;grid-template-columns:112px 1fr}.serviceCard .illus{aspect-ratio:auto;height:100%;min-height:130px}.cityCard{height:250px}.whyHero{padding:28px}.phoneScene{min-height:430px}.phoneScene .device{width:210px;left:50%;transform:translateX(-50%) rotate(0)}.phoneScene .device.two{display:none}.appCopy{padding:27px}.appPoints{grid-template-columns:1fr}.appShots{grid-template-columns:1fr 1fr}.ctaBand{padding:28px;align-items:flex-start;flex-direction:column}.ctaBand h2{font-size:34px}.ctaBand .heroActions{width:100%}.ctaBand .heroActions .btn{flex:1}.footerTop{grid-template-columns:1fr 1fr;gap:30px}.footerBrand{grid-column:1/-1}.seoServiceGrid{grid-template-columns:1fr 1fr;gap:24px}.footer{padding-top:52px}.seoTitle{align-items:flex-start;flex-direction:column}.footerBottom{flex-direction:column}.pageHero{padding:45px 0 28px}.pageHero h1{font-size:44px;letter-spacing:-2.6px}.detailPhoto{max-height:340px}}
@media(prefers-reduced-motion:reduce){.tickerTrack,.floatCard,.photoShell,.waDot,.liveDot{animation:none!important}.reveal{opacity:1!important;transform:none!important;transition:none!important}}

/* cookie consent bar (Cookie Policy §5) */
.cookieBar{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;max-width:760px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 24px 60px rgba(13,45,37,.22);padding:16px 18px;display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.cookieBar[hidden]{display:none}
.cookieBar p{margin:0;flex:1 1 320px;font-size:13.5px;line-height:1.5;color:var(--ink2)}
.cookieBar p a{color:var(--green);font-weight:700}
.cookieBtns{display:flex;gap:8px}
.cookieBtns .btn{padding:10px 14px;font-size:13px;cursor:pointer;font-family:inherit}
a.miniCard{display:block;color:inherit;text-decoration:none}
/* footer link rendered as a button (no href="#" links for crawlers) */
.footer .linkBtn{background:none;border:0;padding:0;font:inherit;cursor:pointer;text-align:left}
/* defer layout/paint of the big link footer until it is near the viewport */
.seoFooter{content-visibility:auto;contain-intrinsic-size:auto 900px}
