/* Habitat marketing site — uses the design tokens from habitat.css */
html{scroll-behavior:smooth}
.lp{background:var(--bg);overflow-x:hidden}
.lp-wrap{max-width:1160px;margin:0 auto;padding:0 20px}.lp-wrap.narrow{max-width:820px}
.lp-pill{display:inline-block;background:var(--primary-soft);color:var(--ink);font-weight:700;font-size:.8rem;padding:5px 14px;border-radius:99px;border:1px solid var(--primary)}
.lp h1{font-size:clamp(2rem,5vw,3.4rem);line-height:1.1;letter-spacing:-.02em;margin:14px 0}
.lp h1 span{color:var(--primary)}
.lp h2{font-size:clamp(1.6rem,3.4vw,2.4rem);letter-spacing:-.01em;margin:10px 0}
.lp .btn.lg{width:auto;padding:0 26px}

/* nav */
.lp-nav{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.lp-nav-in{display:flex;align-items:center;justify-content:space-between;gap:16px;height:68px}
.lp-brand img{height:44px;width:auto}
.lp-nav nav{display:flex;align-items:center;gap:6px}.lp-nav nav a:not(.btn){padding:8px 12px;color:var(--ink);font-weight:600;font-size:.94rem;text-decoration:none;border-radius:10px}.lp-nav nav a:not(.btn):hover{background:var(--grey-soft)}
.lp-burger{display:none;background:none;border:1px solid var(--border);border-radius:10px;width:42px;height:42px;font-size:1.3rem;color:var(--ink);cursor:pointer}

/* hero */
.lp-hero{background:radial-gradient(1000px 500px at 85% -10%,var(--primary-soft),transparent 60%),var(--bg);padding:48px 0 30px}
.lp-hero-in{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center}
.lp-hero-text p{font-size:1.12rem;color:var(--muted);max-width:560px}
.lp-cta{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 16px}
.lp-trust{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-weight:600;font-size:.88rem}
.lp-hero-art{position:relative;min-height:560px;display:flex;justify-content:center;align-items:center}
.lp-mark{position:absolute;width:460px;max-width:100%;opacity:.16;top:-10px;right:-60px}
.float-card{position:absolute;background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);padding:10px 14px;display:flex;flex-direction:column;font-size:.85rem;animation:fl 5s ease-in-out infinite}
.float-card span{color:var(--muted);font-size:.75rem}.fc1{left:-6px;top:90px}.fc2{right:-6px;bottom:80px;animation-delay:1.5s}
@keyframes fl{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* phone mockup */
.phone{position:relative;width:260px;height:530px;border-radius:38px;background:#15161a;padding:10px;box-shadow:0 30px 60px rgba(30,32,36,.28),0 0 0 2px #2b2d33;margin:0 auto}
.phone-notch{position:absolute;top:14px;left:50%;transform:translateX(-50%);width:84px;height:20px;background:#15161a;border-radius:0 0 14px 14px;z-index:3}
.phone .screen{width:100%;height:100%;border-radius:30px;overflow:hidden;background:var(--bg);color:var(--ink);padding:38px 14px 14px;font-size:.78rem;position:relative}
.phone-main{transform:rotate(-3deg)}
.screen.ring{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;justify-content:center}
.screen.ring .avatar-big{width:96px;height:96px;border-radius:50%;background:var(--grey-soft);border:5px solid var(--primary);display:flex;align-items:center;justify-content:center;font-size:2.6rem;animation:pulse 1.4s infinite}
.screen.ring .rn{font:700 1.15rem var(--font-head)}.screen.ring .rs{color:var(--muted);font-size:.75rem}
.rbtn{width:100%;padding:11px;border-radius:12px;font-weight:700;color:#fff;margin-top:2px}.rbtn.g{background:var(--green)}.rbtn.r{background:var(--red)}.rbtn.o{background:var(--surface);color:var(--ink);border:1px solid var(--border)}
.rcall{color:var(--muted);font-size:.72rem;margin-top:4px}
.screen.home .hero-amber{background:linear-gradient(135deg,#F5A33B,#F7C57A);color:#1E2024;border-radius:16px;padding:12px;display:flex;flex-direction:column;gap:1px}
.hero-amber .amt{font:800 1.7rem var(--font-head)}.hero-amber .pay{align-self:flex-end;background:#1E2024;color:#fff;border-radius:10px;padding:5px 12px;font-weight:700;margin-top:-26px}
.qa{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:10px 0}.qa i{font-style:normal;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:8px 2px;display:flex;flex-direction:column;align-items:center;font-size:1.15rem;gap:2px}.qa i b{font-size:.58rem;font-weight:700}.qa i.d{background:var(--red);color:#fff;border-color:var(--red)}
.screen.home .row{display:flex;justify-content:space-between;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:9px 10px;margin-bottom:6px;font-weight:600}
.c{font-style:normal;font-size:.62rem;font-weight:700;padding:2px 8px;border-radius:99px}.c.g{background:var(--green-soft);color:var(--green)}.c.x{background:var(--grey-soft);color:var(--muted)}.c.a{background:var(--amber-soft);color:#B26A00}
.screen.gatep .gt{margin-bottom:10px}.gt b{font:700 1.1rem var(--font-head);display:block}.gt small{color:var(--muted)}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:8px}.tiles i{font-style:normal;background:var(--surface);border:1px solid var(--border);border-radius:14px;min-height:92px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:1.7rem;gap:4px;text-align:center}.tiles i b{font-size:.68rem}.tiles i.p{background:var(--primary);border-color:var(--primary);color:#1E2024}.tiles i.d{background:var(--red);color:#fff;border-color:var(--red)}
.bar2{margin-top:10px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:10px;text-align:center;font-weight:600}

/* sections */
.lp-stats{background:var(--ink);color:#F4F3EF;padding:26px 0}.lp-stats .lp-wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;text-align:center}
.lp-stats b{display:block;font:800 1.9rem var(--font-head);color:var(--primary)}.lp-stats span{color:#C9CBD0;font-size:.9rem}
:root[data-theme=dark] .lp-stats{background:var(--surface)}
.lp-sec{padding:76px 0}.lp-sec.alt{background:var(--surface);border-block:1px solid var(--border)}
.lp-head{text-align:center;max-width:720px;margin:0 auto 38px}.lp-head p{color:var(--muted);font-size:1.05rem}
.lp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.lp-grid.four{grid-template-columns:repeat(4,1fr)}
.lp-card{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:22px;transition:.2s;box-shadow:var(--shadow)}
.alt .lp-card{background:var(--bg)}.lp-card:hover{transform:translateY(-4px);border-color:var(--primary)}
.lp-ic{width:52px;height:52px;border-radius:14px;background:var(--primary-soft);display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin-bottom:12px}
.lp-card h3{font-size:1.08rem;margin-bottom:6px}.lp-card p{color:var(--muted);margin:0;font-size:.95rem}
.lp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.step{background:var(--bg);border:1px solid var(--border);border-radius:18px;padding:24px;position:relative}
.step .n{width:40px;height:40px;border-radius:50%;background:var(--primary);color:#1E2024;font:800 1.1rem var(--font-head);display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.step p{color:var(--muted)}.mini{margin-top:14px;border-radius:12px;padding:12px 14px;font-weight:600;font-size:.9rem}
.mini.gate{background:var(--primary);color:#1E2024}.mini.ringm{background:var(--surface);border:2px solid var(--primary)}.mini.ok{background:var(--green-soft);color:var(--green)}
.lp-showcase{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;align-items:start}
.showcase-item{text-align:center}.showcase-item h3{margin-top:22px}.showcase-item p{color:var(--muted);max-width:300px;margin:0 auto}
.showcase-item.wide{align-self:center}
.laptop{background:#15161a;border-radius:14px 14px 4px 4px;padding:10px 10px 14px;box-shadow:0 24px 50px rgba(30,32,36,.25)}
.lscreen{display:grid;grid-template-columns:78px 1fr;background:var(--bg);border-radius:6px;overflow:hidden;height:230px;font-size:.58rem;text-align:left}
.lside{background:var(--surface);border-right:1px solid var(--border);padding:8px 6px;display:flex;flex-direction:column;gap:3px}.lside b{font:800 .8rem var(--font-head);margin-bottom:4px}.lside i{font-style:normal;padding:4px 5px;border-radius:6px;color:var(--muted);font-weight:600}.lside i.on{background:var(--primary-soft);color:var(--ink)}
.lmain{padding:8px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.stats div{background:var(--surface);border:1px solid var(--border);border-radius:7px;padding:5px}.stats b{display:block;font:800 .95rem var(--font-head)}.stats b.g{color:var(--green)}.stats b.r{color:var(--red)}.stats small{color:var(--muted);font-size:.5rem}
.chart{margin-top:8px;background:var(--surface);border:1px solid var(--border);border-radius:7px;height:120px;padding:6px}.chart svg{width:100%;height:100%}
.lp-roles{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.lp-roles>div{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:22px}.lp-roles ul{padding-left:18px;margin:8px 0 0;color:var(--muted)}.lp-roles li{margin-bottom:6px}

/* download */
.lp-dl{background:linear-gradient(135deg,#F5A33B,#F7C57A);color:#1E2024;padding:70px 0}
.lp-dl-in{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center}
.lp-dl h2{color:#1E2024}.lp-dl p{font-size:1.05rem}.dl-actions{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}
.lp-dl .btn.primary{background:#1E2024;border-color:#1E2024;color:#fff}.lp-dl .btn{background:#fff;color:#1E2024;border-color:#fff}.lp-dl .btn.primary small{opacity:.8;font-weight:500}
.dl-steps{padding-left:20px;margin:0;font-weight:500}.dl-steps li{margin-bottom:6px}
.dl-qr{background:#fff;border-radius:20px;padding:18px;text-align:center;box-shadow:0 18px 40px rgba(30,32,36,.2)}.dl-qr #qr{display:flex;justify-content:center}.dl-qr small{display:block;margin-top:8px;color:#555}
details{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px 18px;margin-bottom:10px}
summary{cursor:pointer;font-weight:700}details p{color:var(--muted);margin:10px 0 0}
.lp-foot{background:var(--surface);border-top:1px solid var(--border);padding:44px 0 18px}
.lp-foot-in{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:24px}.lp-foot-in b{display:block;margin-bottom:8px}.lp-foot-in a{display:block;color:var(--muted);padding:3px 0}.lp-foot-in p{color:var(--muted);font-size:.9rem}
.lp-copy{text-align:center;color:var(--muted);font-size:.82rem;margin-top:26px;border-top:1px solid var(--border);padding-top:16px}

@media(max-width:980px){
  .lp-hero-in{grid-template-columns:1fr;text-align:center}.lp-hero-text p{margin:0 auto}.lp-cta,.lp-trust{justify-content:center}
  .lp-hero-art{min-height:560px}.lp-grid,.lp-grid.four,.lp-roles{grid-template-columns:repeat(2,1fr)}.lp-steps,.lp-showcase{grid-template-columns:1fr}.lp-stats .lp-wrap{grid-template-columns:repeat(2,1fr)}
  .lp-dl-in{grid-template-columns:1fr}.dl-qr{display:none}.lp-foot-in{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .lp-burger{display:block}.lp-nav nav{display:none;position:absolute;top:68px;left:0;right:0;background:var(--surface);border-bottom:1px solid var(--border);flex-direction:column;align-items:stretch;padding:12px 20px;gap:6px}.lp-nav nav.open{display:flex}
  .lp-grid,.lp-grid.four,.lp-roles{grid-template-columns:1fr}.lp-sec{padding:54px 0}.fc1{left:0}.fc2{right:0}.lp .btn.lg{width:100%}
}

.lp-hero,.lp-dl,.lp-sec{overflow-x:clip}html{overflow-x:hidden}@media(max-width:700px){.lp-mark{right:0;width:320px}.phone{width:240px;height:490px}.lp-hero-art{min-height:520px}}