/* index.php — the landing page */
.pill-tag{display:inline-block;background:#fff;color:var(--deep);font:800 12px/1 var(--text);letter-spacing:.08em;text-transform:uppercase;padding:9px 15px;border-radius:99px;box-shadow:0 8px 18px rgba(11,42,94,.16)}
section.sec{padding:96px 0 0}section.sec.alt{background:var(--cream);margin-top:96px;padding:84px 0 90px}
section.sec.alt + section.sec{padding-top:96px}
.narrow{max-width:820px}
.btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.lnk{color:var(--orangeD);font-weight:700}.lnk:hover{text-decoration:underline}

/* ── hero ── */
.hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#FFFFFF 0%,#E4ECF8 60%,#C5D6EE 100%);padding:64px 0 90px}
.hero:before{content:'';position:absolute;right:-140px;top:-180px;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#D5E1F3,#2F62AE);opacity:.5}
.hero:after{content:'';position:absolute;left:-160px;bottom:-240px;width:480px;height:480px;border-radius:50%;background:#fff;opacity:.6}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.02fr .98fr;gap:34px;align-items:center}
.hero-copy h1{font:800 clamp(38px,5.4vw,66px)/1.0 var(--display);letter-spacing:-.025em;margin-top:20px;text-wrap:balance}
.hero-copy h1 em{font-style:normal;color:var(--orangeD)}
.lede{margin-top:18px;font-size:18.5px;color:#44587F;max-width:52ch}
.mini-link{margin-top:18px;font-size:14.5px;font-weight:600}.mini-link a{color:var(--deep)}.mini-link a:hover{text-decoration:underline}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.chips li{background:rgba(255,255,255,.75);border:1px solid rgba(11,42,94,.18);padding:8px 14px;border-radius:99px;font-size:13px;font-weight:700;color:#143A7B}
@media(max-width:940px){.hero-grid{grid-template-columns:1fr}.hero-art{max-width:520px;margin:10px auto 0}}

.hero-art{position:relative;padding:28px 18px 54px}
.dash{background:#fff;border-radius:22px;box-shadow:0 30px 70px rgba(11,42,94,.26),0 4px 10px rgba(11,42,94,.12);overflow:hidden}
.dash .bar{height:34px;background:#F6EEE2;display:flex;align-items:center;gap:7px;padding:0 14px}
.dash .bar i{width:10px;height:10px;border-radius:50%;background:#E3D3BC;display:block}
.dash .bar span{margin-left:10px;height:18px;flex:1;max-width:260px;border-radius:9px;background:#fff;font:600 10.5px/18px var(--text);color:var(--dim);padding:0 10px}
.dash-body{padding:18px}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.kpi{background:var(--cream);border-radius:14px;padding:12px 13px}
.kpi small{display:block;font:700 10px/1 var(--text);letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.kpi b{display:block;font:800 22px/1.1 var(--display);margin-top:7px}
.kpi em{display:block;font:700 11px/1 var(--text);color:var(--body);margin-top:5px;font-style:normal}.kpi em.up{color:var(--goD)}
.kpi.hot{background:linear-gradient(150deg,#58C77A,#2E8449);color:#fff}.kpi.hot small,.kpi.hot em{color:rgba(255,255,255,.88)}
.chart{margin:16px 0 8px;background:#FFFFFF;border-radius:14px;padding:12px 12px 4px}.chart svg{width:100%;height:120px;display:block}
.rows{display:grid;gap:8px;margin-top:10px}.rows div{display:flex;justify-content:space-between;gap:10px;font-size:13px;padding:10px 12px;background:var(--cream);border-radius:12px}
.rows span{font-weight:700}.g{color:var(--goD);font-weight:800}.r{color:#C0392B;font-weight:800}
.float{position:absolute;background:#fff;border-radius:16px;padding:11px 15px;box-shadow:0 18px 36px rgba(11,42,94,.22);animation:fl 6s ease-in-out infinite}
.float small{display:block;font:700 10px/1 var(--text);letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.float b{display:block;font:800 22px/1.1 var(--display);margin-top:5px}
.float.a{right:-8px;top:-6px}.float.b{right:26px;bottom:-12px;animation-delay:-2s}.float.c{left:34px;bottom:-12px;animation-delay:-4s}
@keyframes fl{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@media(prefers-reduced-motion:reduce){.float{animation:none}}
@media(max-width:560px){.float{display:none}.kpi b{font-size:18px}}

/* ── problem ── */
.gap{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:center;margin-top:44px;max-width:900px;margin-left:auto;margin-right:auto}
.gap-card{background:#fff;border-radius:24px;padding:28px 30px;box-shadow:0 2px 4px rgba(11,27,58,.05),0 18px 40px rgba(11,27,58,.09)}
.gap-card small{display:block;font:800 11px/1 var(--text);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.gap-card b{display:block;font:800 clamp(34px,5vw,50px)/1.05 var(--display);margin:12px 0 8px}
.gap-card span{font-size:16px;color:var(--body)}
.gap-card.lost{border:2px dashed #D64B2A;box-shadow:0 0 0 6px rgba(214,75,42,.09),0 22px 44px rgba(214,75,42,.20)}.gap-card.lost small{color:#C0392B}.gap-card.lost b{color:#D64B2A;text-shadow:0 2px 0 #A5321A,0 6px 12px rgba(165,50,26,.25)}
mark{border-radius:9px;padding:3px 12px 4px;font:800 .95em/1 var(--display);letter-spacing:.05em;color:#fff;display:inline-block}
.m-sold{background:linear-gradient(180deg,#FFE04D,#F0B400);color:#0B2A5E;box-shadow:0 3px 0 #A97A00,0 8px 14px rgba(200,140,0,.35)}
.m-lost{background:linear-gradient(180deg,#D93A3A,#9B1010);box-shadow:0 3px 0 #5E0808,0 8px 14px rgba(155,16,16,.4)}
.gap-ne{width:74px;height:84px;display:grid;place-items:center;font:800 34px/1 var(--display);color:#fff;background:linear-gradient(150deg,#2A4F8F,#0B1B3A);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
@media(max-width:760px){.gap{grid-template-columns:1fr}.gap-ne{margin:0 auto;transform:rotate(90deg)}}
.leaks{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:44px}
@media(max-width:900px){.leaks{grid-template-columns:1fr 1fr}}@media(max-width:520px){.leaks{grid-template-columns:1fr}}
.leaks>div{padding:6px 4px}.leaks .dot{display:block;width:12px;height:12px;border-radius:50%;background:#D64B2A;margin-bottom:12px;box-shadow:0 0 0 6px rgba(214,75,42,.14)}
.leaks b{font:800 17px/1.2 var(--display)}.leaks p{color:var(--body);font-size:14.5px;margin-top:5px}
.chain{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;margin-top:46px}
.chain i{font:800 30px/1 var(--display);color:var(--orangeD);font-style:normal}
.ch{width:200px;padding:20px 16px;border-radius:24px;text-align:center;color:#fff;box-shadow:0 20px 40px rgba(11,27,58,.18)}
.ch small{display:block;font:700 12px/1 var(--text);opacity:.9}.ch b{display:block;font:800 36px/1.05 var(--display);margin:8px 0 4px}.ch span{font-size:13.5px;font-weight:600;opacity:.95}
.ch.c1{background:linear-gradient(150deg,#6F9BDB,#2F62AE)}.ch.c2{background:linear-gradient(150deg,#2F62AE,#0B2A5E);transform:scale(1.05)}.ch.c3{background:linear-gradient(150deg,#2A4F8F,#0B1B3A);transform:scale(1.1)}
@media(max-width:700px){.chain i{transform:rotate(90deg)}.ch.c2,.ch.c3{transform:none}}
.fine{text-align:center;color:var(--dim);margin-top:26px;font-size:14.5px}

/* ── products ── */
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:46px}
@media(max-width:980px){.prod-grid{grid-template-columns:1fr 1fr}}@media(max-width:620px){.prod-grid{grid-template-columns:1fr}}
.prod{background:#fff;border-radius:26px;padding:28px 26px 26px;box-shadow:0 2px 4px rgba(11,27,58,.05),0 16px 36px rgba(11,27,58,.09);transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column;position:relative;overflow:hidden}
.prod:hover{transform:translateY(-6px);box-shadow:0 2px 4px rgba(11,27,58,.05),0 28px 54px rgba(11,27,58,.15)}
.prod:before{content:'';position:absolute;right:-50px;top:-50px;width:150px;height:150px;border-radius:50%;opacity:.14}
.prod .ic{width:56px;height:56px;border-radius:17px;display:grid;place-items:center;color:#fff;margin-bottom:18px;box-shadow:0 12px 24px rgba(11,27,58,.2)}
.prod h3{font:800 24px/1.1 var(--display)}.prod .t{font-weight:700;color:var(--deep);font-size:13.5px;margin:4px 0 10px}.prod p{color:var(--body);font-size:15px}
.prod .in{margin-top:auto;padding-top:18px;font:800 12px/1 var(--text);letter-spacing:.04em;color:var(--ink)}
.prod .in:before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--go);margin-right:8px}
.c-green .ic{background:linear-gradient(150deg,#5FD08A,#2E8449)}.c-green:before{background:#3BA55C}
.c-amber .ic{background:linear-gradient(150deg,#6F9BDB,#143A7B)}.c-amber:before{background:#2F62AE}
.c-blue .ic{background:linear-gradient(150deg,#6B9BF0,#2F62AE)}.c-blue:before{background:#2F62AE}
.c-rose .ic{background:linear-gradient(150deg,#F58A7A,#C0392B)}.c-rose:before{background:#C0392B}
.c-ink .ic{background:linear-gradient(150deg,#2A4F8F,#0B1B3A)}.c-ink:before{background:#0B1B3A}
.c-violet .ic{background:linear-gradient(150deg,#A98AF0,#6B46C1)}.c-violet:before{background:#6B46C1}

/* ── how smartmenu works ── */
.flow{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:40px}
.flow span{background:#fff;border-radius:14px;padding:13px 20px;font-weight:700;box-shadow:0 8px 20px rgba(11,27,58,.1)}.flow i{font:800 20px/1 var(--display);color:var(--orangeD);font-style:normal}
.wwa{display:flex;align-items:center;justify-content:space-around;max-width:760px;margin:20px auto 0;background:linear-gradient(100deg,#0B2A5E,#2A4F8F);border-radius:18px;padding:18px 24px;color:#fff;font:800 22px/1 var(--display)}.wwa i{color:#9EBBE6;font-style:normal}
.six{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:34px}
@media(max-width:900px){.six{grid-template-columns:1fr 1fr}}@media(max-width:560px){.six{grid-template-columns:1fr}}
.six>div{background:#fff;border-radius:18px;padding:20px 22px;box-shadow:0 2px 4px rgba(11,27,58,.05),0 12px 28px rgba(11,27,58,.08);border-left:5px solid #D64B2A}
.six h4{font:800 16px/1.25 var(--display)}.six p{color:var(--body);font-size:14.5px;margin-top:5px}
.story{text-align:center;max-width:62ch;margin:34px auto 0;font-size:16.5px;color:var(--body)}.story b{color:var(--ink);display:block;font:800 22px/1.2 var(--display);margin-bottom:6px}
.insights{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:26px}
.insights span{background:var(--sand);color:var(--deep);font-weight:800;font-size:13px;padding:10px 16px;border-radius:99px}

/* ── features ── */
.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:46px}
@media(max-width:900px){.feat{grid-template-columns:1fr 1fr}}@media(max-width:560px){.feat{grid-template-columns:1fr}}
.feat>div{background:#fff;border-radius:22px;padding:24px 24px 22px;box-shadow:0 2px 4px rgba(11,27,58,.04),0 12px 28px rgba(11,27,58,.07)}
.fi{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:var(--sand);color:var(--orangeD);margin-bottom:14px}
.feat h4{font:800 18px/1.2 var(--display)}.feat p{color:var(--body);font-size:14.5px;margin-top:6px}

/* ── pricing teaser ── */
.mini-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px;align-items:stretch}
@media(max-width:900px){.mini-plans{grid-template-columns:1fr;max-width:460px;margin-left:auto;margin-right:auto}}
.mp{position:relative;display:flex;flex-direction:column;background:#fff;border-radius:26px;padding:30px 28px 26px;box-shadow:0 2px 4px rgba(11,27,58,.05),0 16px 36px rgba(11,27,58,.09);transition:transform .2s,box-shadow .2s;border-top:7px solid var(--go)}
.mp.amber{border-top-color:var(--orange)}.mp.ink{border-top-color:var(--ink)}
.mp:hover{transform:translateY(-6px);box-shadow:0 28px 54px rgba(11,27,58,.16)}
.mp.feat{box-shadow:0 0 0 3px var(--orange),0 28px 54px rgba(11,42,94,.26)}
.mp .bd{position:absolute;top:-17px;left:26px;background:var(--ink);color:#fff;font:800 11px/1 var(--text);letter-spacing:.08em;text-transform:uppercase;padding:8px 13px;border-radius:99px}
.mp.green .bd{background:var(--go)}.mp.amber .bd{background:var(--orangeD)}
.mp h3{font:800 26px/1 var(--display)}
.mp .pr{display:flex;align-items:baseline;gap:8px;margin:14px 0 8px;flex-wrap:wrap}.mp .pr s{color:var(--dim);font-size:16px}.mp .pr b{font:800 44px/1 var(--display);letter-spacing:-.02em}.mp .pr span{color:var(--body);font-weight:600}
.mp p{color:var(--body);font-size:14.5px;flex:1}.mp em{font-style:normal;font-weight:800;color:var(--deep);margin-top:18px}

/* ── cta ── */
.cta-card{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;background:linear-gradient(120deg,#143A7B,#2F62AE 60%,#B7CAE8);color:#fff;border-radius:32px;padding:46px 48px;box-shadow:0 30px 60px rgba(11,42,94,.3);position:relative;overflow:hidden}
.cta-card:before{content:'';position:absolute;right:-60px;top:-80px;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.16)}
.cta-card h2{font:800 clamp(26px,3.6vw,38px)/1.08 var(--display);max-width:20ch}.cta-card p{margin-top:8px;opacity:.96;font-size:17px}
.cta-btns{display:flex;gap:12px;flex-wrap:wrap;position:relative}
.btn.white{background:#fff;color:var(--deep);box-shadow:0 12px 26px rgba(0,0,0,.14)}.btn.white:hover{transform:translateY(-2px)}

/* faq (shared look with pricing) */
details{background:#fff;border-radius:18px;margin-top:14px;box-shadow:0 2px 4px rgba(11,27,58,.05),0 10px 24px rgba(11,27,58,.07);overflow:hidden}
summary{cursor:pointer;list-style:none;padding:20px 24px;font:700 17px/1.3 var(--text);display:flex;justify-content:space-between;gap:16px;align-items:center}
summary::-webkit-details-marker{display:none}
summary:after{content:'+';flex:none;width:30px;height:30px;border-radius:50%;background:var(--sand);color:var(--orangeD);display:grid;place-items:center;font-size:20px;font-weight:700}
details[open] summary:after{content:'–'}
details p{padding:0 24px 22px;color:var(--body);font-size:15.5px}details p a{color:var(--orangeD);font-weight:700}

.prod h3 a:hover{color:var(--orangeD)}
