﻿/* Garage360 v2: minimal light/dark green system */
:root{--dk:#0b2016;--dk2:#10331f;--fo:#07492b;--g:#089847;--br:#7fe6a8;--lt:#e5f4ea;--lt2:#d6eddf;--ink:#0d1f15;--mut:#5c6d63;--ln:rgba(11,90,51,.14);--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.v2{margin:0;font-family:'DM Sans',system-ui,-apple-system,Segoe UI,sans-serif;background:var(--lt);color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:hidden}
.v2 *,.v2 *::before,.v2 *::after{box-sizing:border-box}
html{scroll-behavior:smooth}
.v2 a{color:inherit;text-decoration:none}.v2 img{max-width:100%}
.w{max-width:1180px;margin:0 auto;padding:0 1.5rem}
.mono{font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase}
/* progress road */
#pg{position:fixed;top:0;left:0;right:0;height:3px;z-index:80}#pg i{display:block;height:100%;width:0;background:var(--g)}
#pgcar{position:fixed;top:4px;left:0;z-index:80;width:30px;color:var(--fo);transform:translateX(-100%);pointer-events:none;will-change:left}
/* nav (shared by every page) */
.nv{position:sticky;top:3px;z-index:70;background:rgba(229,244,234,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--ln)}
.nv .in{display:flex;align-items:center;justify-content:space-between;height:68px;max-width:1180px;margin:0 auto;padding:0 1.5rem}
.nv .logo{height:36px;width:auto;display:block}
.nv nav{display:none;gap:2rem;font-size:.95rem;font-weight:500}
.nv nav a{position:relative;padding:.3rem 0}.nv nav a::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--g);transition:width .3s}.nv nav a:hover::after{width:100%}
.nv .r{display:flex;align-items:center;gap:1rem}.pgn{display:none;color:var(--mut)}
#menuBtn{background:none;border:0;padding:.4rem;cursor:pointer;color:var(--ink);display:grid}#menuBtn svg{width:24px;height:24px}
#mobileMenu{border-top:1px solid var(--ln);background:var(--lt)}#mobileMenu.hidden{display:none}#mobileMenu nav{display:grid;gap:0;padding:.5rem 1.5rem 1rem;font-weight:600}#mobileMenu a{padding:.9rem 0;border-bottom:1px solid var(--ln)}
@media(min-width:860px){.nv nav{display:flex}#menuBtn,#mobileMenu{display:none}}
.b{display:inline-flex;align-items:center;gap:.5rem;font:600 .95rem/1 'DM Sans',sans-serif;border-radius:999px;padding:.95rem 1.5rem;border:1.5px solid transparent;cursor:pointer;transition:transform .2s,background .2s,color .2s}
.b:hover{transform:translateY(-2px)}.b-dk{background:var(--fo);color:#fff}.b-dk:hover{background:var(--dk)}.b-gh{background:transparent;border-color:var(--fo);color:var(--fo)}.b-gh:hover{background:var(--fo);color:#fff}.b-br{background:var(--br);color:var(--dk)}.b-sm{padding:.7rem 1.2rem;font-size:.88rem}
.v2 .b-dk,.nv .b-dk{color:#fff}
/* hero */
.hero2{position:relative;padding:0 0 4rem}
.hero-art{position:absolute;z-index:0;right:max(-1.5rem, calc((100% - 1480px) / 2));top:1.8rem;width:min(46vw, 620px);height:auto;pointer-events:none;user-select:none}
.hero2 .w{position:relative;z-index:1}
.hero2 .fold{position:relative;min-height:calc(100svh - 71px);padding:5rem 0 2.5rem}
.hero-row{display:flex;align-items:flex-start;justify-content:space-between;gap:2rem}
.hero-seal{position:relative;z-index:2;width:252px;height:auto;flex:none;margin:-2rem -2rem 0 0;transform:rotate(-15deg)}
@media(max-width:860px){
  .hero2 .fold{min-height:0;padding:3.4rem 0 .4rem}
  .hero-row{flex-direction:column;align-items:flex-start}
  .hero-seal{align-self:center;width:min(250px,68vw);margin:.4rem 0 0}
  .hero-art{width:100vw;top:6rem;right:-22vw;opacity:.55}
  .hero2 .art{margin-top:1.25rem}
}
.chip2{display:inline-flex;align-items:center;gap:.6rem;border:1px solid var(--ln);background:#fff;border-radius:999px;padding:.5rem 1rem;color:var(--fo)}.chip2 i{width:8px;height:8px;border-radius:50%;background:var(--g);box-shadow:0 0 0 0 rgba(10,168,76,.6);animation:pu 2s infinite}
@keyframes pu{70%{box-shadow:0 0 0 9px rgba(10,168,76,0)}100%{box-shadow:0 0 0 0 rgba(10,168,76,0)}}
.hero2 h1{font-size:clamp(2.35rem,4.8vw,4.6rem);line-height:.98;letter-spacing:-.048em;font-weight:700;margin:1.35rem 0 1.15rem;color:var(--dk)}
.hero2 h1 .h1-kw{font-size:clamp(.85rem,1.1vw,1rem);letter-spacing:.08em;font-weight:500;padding-top:.6em}
.hero2 h1 .h1-kw>span{color:var(--mut);transform:none;animation:none}
.hero2 h1 .ln{display:block;overflow:hidden;padding-bottom:.2em}.hero2 h1 .ln>span{display:block;transform:translateY(105%);animation:up .9s cubic-bezier(.2,.8,.2,1) forwards}.hero2 h1 .ln:nth-child(2)>span{animation-delay:.12s;color:var(--g)}
@keyframes up{to{transform:none}}
.hero2 p.sub{font-size:clamp(1.02rem,1.35vw,1.15rem);color:#5c6b72;max-width:none;margin:0 0 1.7rem;line-height:1.5;white-space:nowrap}
@media(max-width:760px){.hero2 p.sub{white-space:normal}}
.cta{display:flex;flex-wrap:wrap;gap:.8rem}
.cue{display:flex;align-items:center;gap:.8rem;margin-top:1rem;color:var(--mut)}.cue i{display:block;width:22px;height:36px;border:1.5px solid var(--fo);border-radius:12px;position:relative}.cue i::after{content:"";position:absolute;left:50%;top:7px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--g);animation:sc 1.6s infinite}
@keyframes sc{60%{transform:translateY(12px);opacity:0}}
.art{margin:1.5rem auto 0;max-width:1040px}.art img{display:block;width:100%;height:auto}
/* sections */
.sec{padding:clamp(4.5rem,9vw,8rem) 0}.dkS{background:var(--dk);color:#eaf6ee}.ltS{background:var(--lt2)}
.lab{display:flex;align-items:center;gap:.8rem;color:var(--fo);margin-bottom:1.2rem}.lab::before{content:"";width:28px;height:2px;background:currentColor}.dkS .lab{color:var(--br)}
.h2{font-size:clamp(2.1rem,5.4vw,4.4rem);line-height:1.02;letter-spacing:-.04em;font-weight:700;margin:0 0 3rem;max-width:15ch}
/* expandable rows */
.rows{border-bottom:1px solid var(--ln)}.dkS .rows{border-color:rgba(255,255,255,.16)}
.row{border-top:1px solid var(--ln)}.dkS .row{border-color:rgba(255,255,255,.16)}
.row>button{all:unset;box-sizing:border-box;display:grid;grid-template-columns:3.4rem 1fr 44px;align-items:center;width:100%;padding:1.5rem 0;cursor:pointer}
.row>button:focus-visible{outline:2px solid var(--g);outline-offset:4px}
.row .n{font-family:var(--mono);font-size:.78rem;color:var(--g);letter-spacing:.1em}
.row .t{font-size:clamp(1.5rem,3.6vw,2.8rem);font-weight:600;letter-spacing:-.03em;transition:transform .35s,color .35s}
.row>button:hover .t{transform:translateX(12px);color:var(--g)}.dkS .row>button:hover .t{color:var(--br)}
.row .pl{width:44px;height:44px;border-radius:50%;border:1.5px solid currentColor;position:relative;transition:transform .35s,background .3s,color .3s}
.row .pl::before,.row .pl::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;margin:-1px 0 0 -7px;background:currentColor}.row .pl::after{transform:rotate(90deg);transition:transform .3s}
.row.open .pl{transform:rotate(180deg);background:var(--g);color:#fff;border-color:var(--g)}.row.open .pl::after{transform:rotate(0)}
.row .pn{max-height:0;overflow:hidden;transition:max-height .45s ease}
.row .pn p{margin:0 0 1.8rem 3.4rem;max-width:36rem;font-size:1.1rem;line-height:1.55;color:var(--mut)}.dkS .row .pn p{color:#b9d6c4}
/* process */
.steps{display:grid;grid-template-columns:1fr;gap:0;border-top:1px solid var(--ln)}
.step{padding:2rem 0;border-bottom:1px solid var(--ln)}
.step b{display:block;font-size:clamp(3.4rem,8vw,6rem);line-height:1;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.5px var(--fo);transition:color .4s}
.step:hover b,.step.in b{color:var(--g);-webkit-text-stroke-color:var(--g)}
.step h3{font-size:1.5rem;letter-spacing:-.02em;margin:.8rem 0 .3rem}.step p{margin:0;color:var(--mut)}
@media(min-width:860px){.steps{grid-template-columns:repeat(4,1fr);border-top:0}.step{padding:0 1.5rem 0 0;border:0;border-top:1px solid var(--ln);padding-top:2rem}}
/* tap the car */
.tap{display:grid;gap:2.5rem;align-items:center}
@media(min-width:960px){.tap{grid-template-columns:1.25fr 1fr}}
.car{position:relative;max-width:640px;margin:0 auto;width:100%}.car svg{display:block;width:100%;height:auto}
.hs{position:absolute;transform:translate(-50%,-50%);width:38px;height:38px;border-radius:50%;border:2px solid var(--br);background:rgba(127,230,168,.18);color:var(--br);cursor:pointer;padding:0;display:grid;place-items:center;transition:background .25s,transform .25s,color .25s}
.hs::before{content:"";position:absolute;inset:-8px;border-radius:50%;border:1.5px solid var(--br);opacity:.6;animation:rg 2.2s infinite}
@keyframes rg{0%{transform:scale(.7);opacity:.7}100%{transform:scale(1.5);opacity:0}}
.hs svg{width:16px;height:16px}.hs .ck{display:none}.hs[aria-pressed=true]{background:var(--br);color:var(--dk)}.hs[aria-pressed=true] .pp{display:none}.hs[aria-pressed=true] .ck{display:block}.hs[aria-pressed=true]::before{animation:none;opacity:0}
.hs:hover,.hs:focus-visible{transform:translate(-50%,-50%) scale(1.12);outline:none}
.hs .tip{position:absolute;bottom:130%;left:50%;transform:translateX(-50%) translateY(4px);background:#fff;color:var(--dk);font:600 .78rem/1 'DM Sans',sans-serif;padding:.45rem .7rem;border-radius:999px;white-space:nowrap;opacity:0;pointer-events:none;transition:.2s}
.hs:hover .tip,.hs:focus-visible .tip,.hs[aria-pressed=true] .tip{opacity:1;transform:translateX(-50%)}
.pick{min-height:3.2rem;display:flex;flex-wrap:wrap;gap:.5rem;margin:1.5rem 0 1.8rem;color:#b9d6c4}
.pick span.c{background:rgba(127,230,168,.16);border:1px solid rgba(127,230,168,.4);color:var(--br);border-radius:999px;padding:.4rem .9rem;font-size:.9rem;font-weight:600}
.cont{margin-top:2.2rem;display:grid;gap:.4rem;color:#b9d6c4;font-size:.98rem}.cont a:hover{color:var(--br)}
/* footer */
.ft2{background:var(--dk);color:#b9d6c4;padding:4rem 0 0;overflow:hidden;border-top:1px solid rgba(255,255,255,.08)}
.ft2 .top{display:flex;flex-wrap:wrap;gap:2rem 3rem;justify-content:space-between;align-items:flex-start}
.ft2 nav{display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;font-weight:500}.ft2 nav a:hover,.ft2 .soc a:hover{color:var(--br)}
.ft2 .soc{display:flex;gap:1rem}.ft2 .soc svg{width:20px;height:20px}
.ft2 small{display:block;margin-top:2.4rem;font-size:.85rem;line-height:1.7;color:#7fa690}.ft2 small a{color:#b9d6c4;text-decoration:underline}
.ft2 .wm{font-size:clamp(2.6rem,13.6vw,13rem);font-weight:700;letter-spacing:-.06em;line-height:.8;text-align:center;color:transparent;-webkit-text-stroke:1.5px rgba(127,230,168,.28);margin:2rem 0 -.1em;user-select:none;white-space:nowrap}
/* modal */
#dm{position:fixed;inset:0;z-index:100;display:none;place-items:center;background:rgba(10,36,23,.6);backdrop-filter:blur(6px);padding:1rem}#dm.on{display:grid}
#dm .bx{position:relative;background:#fff;color:var(--ink);border-radius:24px;padding:2rem;width:100%;max-width:440px}
#dm h2{margin:0 0 .4rem;font-size:1.7rem;letter-spacing:-.03em}#dm p{margin:0 0 1.2rem;color:var(--mut)}
#dm .x{position:absolute;top:.8rem;right:1rem;background:none;border:0;font-size:1.8rem;cursor:pointer;color:var(--mut)}
#dm label{display:block;font-size:.85rem;font-weight:600;margin-bottom:.9rem}#dm input,#dm select,#dm textarea{display:block;width:100%;margin-top:.35rem;padding:.8rem 1rem;border:1.5px solid var(--ln);border-radius:12px;font:inherit;background:var(--lt)}
#dm input:focus,#dm select:focus,#dm textarea:focus{outline:2px solid var(--g);border-color:var(--g)}
#dmFb{margin:.8rem 0 0;font-weight:600}
/* reveal */
.rv{opacity:0;transform:translateY(26px);transition:opacity .8s,transform .8s cubic-bezier(.2,.8,.2,1)}.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.hero2 h1 .ln>span{animation:none;transform:none}.rv{opacity:1;transform:none;transition:none}.hs::before,.chip2 i,.cue i::after{animation:none}html{scroll-behavior:auto}}

/* boxed feature cards */
.cards{display:grid;grid-template-columns:1fr;gap:1rem}
@media(min-width:640px){.cards{grid-template-columns:repeat(2,1fr)}}@media(min-width:1000px){.cards{grid-template-columns:repeat(4,1fr);gap:1.1rem}}
.card2{position:relative;border:1px solid rgba(127,230,168,.22);background:linear-gradient(160deg,rgba(127,230,168,.09),rgba(127,230,168,.02));border-radius:24px;padding:1.8rem 1.6rem 2rem;min-height:15rem;display:flex;flex-direction:column;transition:transform .35s,border-color .35s,background .35s}
.card2:hover{transform:translateY(-6px);border-color:var(--br);background:linear-gradient(160deg,rgba(127,230,168,.16),rgba(127,230,168,.04))}
.card2 .n{font-family:var(--mono);font-size:.78rem;letter-spacing:.1em;color:var(--br);border:1px solid rgba(127,230,168,.4);border-radius:999px;padding:.3rem .7rem;align-self:flex-start}
.card2 h3{font-size:clamp(1.6rem,2.4vw,2rem);letter-spacing:-.03em;margin:auto 0 .6rem;padding-top:2.4rem;font-weight:600}
.card2 p{margin:0;color:#b9d6c4;line-height:1.55}
/* techmind strip */
.sec.sm{padding:clamp(2.5rem,5vw,4rem) 0}
.tm{display:flex;flex-wrap:wrap;gap:1.5rem 2rem;align-items:center;justify-content:space-between;background:#fff;border:1px solid var(--ln);border-radius:26px;padding:clamp(1.6rem,3vw,2.4rem)}
.tm h3{font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:-.03em;margin:.4rem 0 .4rem}.tm p{margin:0;color:var(--mut);max-width:34rem;line-height:1.55}

/* 3D inspection car */
.car{position:relative;max-width:none;margin:0;width:100%;border-radius:28px;background:radial-gradient(ellipse at 50% 70%,rgba(127,230,168,.14),transparent 65%),rgba(127,230,168,.04);border:1px solid rgba(127,230,168,.18);overflow:hidden}
.car canvas{display:block;width:100%;cursor:grab;touch-action:pan-y}.car.grab canvas{cursor:grabbing}
.car .hint{position:absolute;left:1.1rem;bottom:1rem;display:flex;align-items:center;gap:.5rem;color:#7fa690;pointer-events:none}.car .hint svg{width:16px;height:16px}
.hs{left:0;top:0;width:34px;height:34px;transition:opacity .25s,background .25s,color .25s}
.pchips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
.pc{background:transparent;border:1px solid rgba(127,230,168,.3);color:#cfe6d8;border-radius:999px;padding:.5rem .95rem;font:600 .85rem 'DM Sans',sans-serif;cursor:pointer;transition:.2s}.pc:hover{border-color:var(--br)}.pc[aria-pressed=true]{background:var(--br);color:var(--dk);border-color:var(--br)}
.ckh{display:flex;justify-content:space-between}
.chk{list-style:none;margin:1rem 0 1.4rem;padding:0;display:grid;gap:.6rem}
.chk li{display:grid;grid-template-columns:1fr auto;gap:.15rem .8rem;align-items:center;border:1px solid rgba(127,230,168,.22);border-radius:16px;padding:.8rem 1rem;background:rgba(127,230,168,.06);animation:aiin .35s}
.chk b{font-size:1rem;color:#fff}.chk small{grid-column:1;color:#9fbfae;font-size:.85rem}
.st{grid-column:2;grid-row:1/3;border:0;border-radius:999px;padding:.45rem .9rem;font:700 .8rem 'DM Sans',sans-serif;cursor:pointer}.st.g{background:var(--br);color:var(--dk)}.st.w{background:#ffc14d;color:#3a2600}.st.r{background:#ff7a6b;color:#3a0c07}
.ckempty{margin:1rem 0 1.4rem;color:#9fbfae}
@keyframes aiin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.hs .tip{opacity:.92;transform:translateX(-50%);font-size:.72rem;padding:.38rem .6rem;bottom:125%}
.hs:hover .tip{opacity:1}

/* faq, guides, whatsapp */
.faq .row .t{font-size:clamp(1.15rem,2.2vw,1.5rem);font-weight:600;letter-spacing:-.02em}
.faq .row .pn p{max-width:44rem}
.guides{display:grid;gap:1rem}@media(min-width:860px){.guides{grid-template-columns:repeat(3,1fr)}}
.gl{position:relative;display:flex;flex-direction:column;gap:.7rem;min-height:11rem;background:#fff;border:1px solid var(--ln);border-radius:22px;padding:1.5rem 1.5rem 3.2rem;transition:transform .3s,border-color .3s}
.gl:hover{transform:translateY(-5px);border-color:var(--g)}.gl .mono{color:var(--fo)}.gl b{font-size:1.25rem;letter-spacing:-.02em;line-height:1.25}
.gl i{position:absolute;right:1.4rem;bottom:1.1rem;font-style:normal;width:38px;height:38px;border-radius:50%;border:1.5px solid var(--fo);display:grid;place-items:center;color:var(--fo);transition:.3s}.gl:hover i{background:var(--g);border-color:var(--g);color:#fff}
.wa-fab{position:fixed;right:1.1rem;bottom:1.1rem;z-index:60;display:flex;align-items:center;gap:.6rem;background:var(--fo);color:#fff;border-radius:999px;padding:.85rem;box-shadow:0 10px 30px rgba(10,36,23,.35);font-weight:600;font-size:.92rem;transition:transform .2s,background .2s}
.wa-fab:hover{background:var(--g);transform:translateY(-3px)}.wa-fab svg{width:26px;height:26px}.wa-fab span{display:none;padding-right:.5rem}


@media(min-width:760px){.wa-fab span{display:inline}}
.v2 .wa-fab{color:#fff}

/* inner pages */
.pghead{padding:4.5rem 0 1.5rem}.pghead .lab{color:var(--fo)}
.pghead h1{font-size:clamp(2.4rem,6.5vw,5.2rem);line-height:1;letter-spacing:-.045em;margin:1.1rem 0 1rem;max-width:15ch;color:var(--dk);font-weight:700}
.pghead .sub{color:var(--mut);font-size:1.2rem;max-width:34rem;margin:0;line-height:1.5}
.sec.sm2{padding:2rem 0 clamp(4rem,8vw,6.5rem)}
.pcards{display:grid;gap:1.3rem;grid-template-columns:1fr}@media(min-width:700px){.pcards{grid-template-columns:repeat(2,1fr)}}@media(min-width:1000px){.pcards{grid-template-columns:repeat(3,1fr)}}
.pc2{display:flex;flex-direction:column;background:#fff;border:1px solid var(--ln);border-radius:24px;overflow:hidden;transition:transform .3s,border-color .3s}a.pc2:hover{transform:translateY(-5px);border-color:var(--g)}
.pc2 img{display:block;width:100%;height:auto;background:var(--lt)}.pc2 .bd{padding:1.4rem 1.5rem 1.6rem;display:flex;flex-direction:column;gap:.6rem;flex:1}.pc2 .mono{color:var(--fo)}
.pc2 h2,.pc2 h3{font-size:1.3rem;letter-spacing:-.02em;line-height:1.25;margin:0}.pc2 p{margin:0;color:var(--mut);line-height:1.55;font-size:.97rem}.pc2 p strong{color:var(--dk)}.pc2 .rm{margin-top:auto;padding-top:.6rem;font-weight:600;color:var(--fo)}
.art2{max-width:780px;margin:0 auto;padding:3.5rem 1.5rem 4rem}
.crumb{font-size:.85rem;color:var(--mut);margin-bottom:1.8rem}.crumb a:hover{color:var(--g)}
.kk{color:var(--fo)}.art2 h1{font-size:clamp(2rem,5vw,3.4rem);line-height:1.04;letter-spacing:-.04em;margin:.9rem 0 1rem;color:var(--dk)}
.art2 .meta{color:var(--mut);margin:0}.art2 figure{margin:2rem 0}.art2 figure img{display:block;width:100%;height:auto;border-radius:22px;border:1px solid var(--ln)}
.prose p,.prose li{font-size:1.1rem;line-height:1.7;margin:0 0 1.2rem;color:#25382c}.prose strong{color:var(--dk)}.prose a{color:var(--fo);text-decoration:underline}.prose h3{font-size:1.35rem;letter-spacing:-.02em;margin:2rem 0 .5rem;color:var(--dk)}.prose.narrow{max-width:760px}.prose em{color:var(--mut)}
.more{margin-top:3rem;padding-top:1.6rem;border-top:1px solid var(--ln)}.more .ml{display:grid;gap:.6rem}.more a{color:var(--fo);font-weight:600}.more a:hover{color:var(--g)}
.row .pn .rl{display:inline-block;margin:0 0 1.8rem 3.4rem;font-weight:600;color:var(--fo)}.row .pn .rl:hover{color:var(--g)}.dkS .row .pn .rl{color:var(--br)}

/* article list: each row opens its own page */
.alist{border-bottom:1px solid var(--ln)}
.al{display:grid;grid-template-columns:3.4rem 1fr 44px;align-items:center;padding:1.4rem 0;border-top:1px solid var(--ln);cursor:pointer}
.al .n{font-family:var(--mono);font-size:.78rem;color:var(--g);letter-spacing:.1em}
.al .t{display:flex;flex-direction:column;gap:.35rem;font-size:clamp(1.15rem,2.2vw,1.55rem);font-weight:600;letter-spacing:-.02em;transition:transform .35s,color .35s}
.al .t small{font-weight:400;color:var(--fo)}
.al .ar{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--fo);display:grid;place-items:center;color:var(--fo);transition:.3s}
.al:hover .t{transform:translateX(12px);color:var(--g)}.al:hover .ar{background:var(--g);border-color:var(--g);color:#fff;transform:translateX(4px)}
.al:focus-visible{outline:2px solid var(--g);outline-offset:4px}
@media(max-width:560px){#contact .cta .b{width:100%;justify-content:center}.tm .b{width:100%;justify-content:center}}
#dm .b-gh{width:100%;justify-content:center;color:var(--fo)}
.car.nogl canvas{display:none}.car .glmsg{margin:0;padding:3rem 1.5rem;color:#9fbfae;text-align:center}
@media(max-width:640px){.hs .tip{opacity:0}.hs[aria-pressed=true] .tip{opacity:1}.hs{width:30px;height:30px}}

/* mobile app phone */
.mob{display:grid;gap:2.5rem;align-items:center}@media(min-width:900px){.mob{grid-template-columns:1fr auto;gap:4rem}}
.mtxt p{font-size:1.2rem;color:var(--mut);max-width:26rem;margin:0 0 1.6rem;line-height:1.5}.mtxt .h2{margin-bottom:1.2rem}
.phone{justify-self:center;width:clamp(270px,82vw,360px)}
.pbz{position:relative;aspect-ratio:9/18.5;background:#0a1a10;border-radius:46px;padding:11px;box-shadow:0 30px 70px rgba(10,36,23,.28),inset 0 0 0 2px #1d3a29}
.pbz iframe{display:block;width:100%;height:100%;border:0;border-radius:36px;background:#fff}
.pnotch{position:absolute;top:19px;left:50%;transform:translateX(-50%);width:96px;height:24px;background:#0a1a10;border-radius:14px;z-index:2;pointer-events:none}
.pbz .pfb{position:absolute;inset:11px;border-radius:36px;background:linear-gradient(180deg,#eaf6ee,#d6eddf);display:grid;place-content:center;text-align:center;gap:1rem;padding:2rem;color:var(--dk)}
.pfb b{font-size:1.3rem;letter-spacing:-.02em}.pfb span{color:var(--mut);font-size:.95rem}

/* hero phone: live app next to the dashboard */
.art{position:relative}
.hphone{position:absolute;left:76.4%;top:23.8%;width:22.4%}
.hlab{position:absolute;left:50%;bottom:calc(100% + .7rem);transform:translateX(-50%);background:var(--fo);color:#fff;border-radius:999px;padding:.5rem 1rem;white-space:nowrap;font-size:.7rem}
.hp{position:relative;aspect-ratio:232/470;box-sizing:border-box;background:#0a1a10;border-radius:16%/8%;padding:4.5%;box-shadow:0 24px 60px rgba(10,36,23,.35),inset 0 0 0 2px #1d3a29}
.hpn{position:absolute;top:2.4%;left:50%;transform:translateX(-50%);width:34%;aspect-ratio:4/1;background:#0a1a10;border-radius:99px;z-index:2;pointer-events:none}
.hp .scr{position:relative;width:100%;height:100%;overflow:hidden;border-radius:13%/6.5%;background:#f4f7f5 center/cover no-repeat}
.hp iframe{position:absolute;left:0;top:0;width:390px;border:0;transform-origin:0 0;background:#fff}
@media(max-width:760px){.hphone{position:relative;left:auto;top:auto;width:min(320px,80vw);margin:3.2rem auto 0}}

/* hero: dashboard + live mobile preview side by side (no overlap) */
.art{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:1.4rem;align-items:center;max-width:1180px;position:relative}
.art>img{display:block;width:100%;height:auto}
.hphone{position:relative;left:auto;top:auto;width:auto;margin:0}
.hphone .hlab{position:static;transform:none;display:inline-block;margin:0 0 .8rem}
.hphone iframe{position:static;display:block;width:100%;height:640px;border:0;border-radius:28px;background:#fff;transform:none;box-shadow:0 24px 60px rgba(10,36,23,.25)}
@media(max-width:900px){.art{grid-template-columns:1fr}.hphone{justify-self:center;width:min(380px,92vw)}.hphone iframe{height:700px}}

/* mobile app column: live page when reachable, otherwise a scrollable mobile mock */
.mwrap{position:relative;height:640px}
.mwrap iframe{position:absolute;inset:0;height:100%}
.mfb{position:absolute;inset:0;background:#0a1a10;border-radius:38px;padding:10px;box-shadow:0 24px 60px rgba(10,36,23,.3),inset 0 0 0 2px #1d3a29;display:flex;flex-direction:column}
.mfb .msc{flex:1;min-height:0;background:#f6f8f7;border-radius:30px 30px 0 0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none}.mfb .msc::-webkit-scrollbar{display:none}
.mst{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:.7rem 1.3rem .4rem;background:#f6f8f7;font-size:.78rem}.mst i{width:22px;height:10px;border:1.5px solid var(--dk);border-radius:3px}
.mbd{padding:.3rem 1rem 1.2rem;color:var(--ink)}.mk{margin:.6rem 0 .2rem;font:700 .62rem var(--mono);letter-spacing:.14em;color:var(--mut)}
.mbd h3{margin:0;font-size:1.35rem;letter-spacing:-.03em}.ms{margin:.3rem 0 .9rem;color:var(--mut);font-size:.8rem;line-height:1.4}
.mch{display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:none;margin-bottom:1rem}.mch button{flex:none;border:1px solid var(--ln);background:#fff;border-radius:10px;padding:.45rem .7rem;font:600 .72rem 'DM Sans',sans-serif;cursor:pointer;color:var(--ink)}.mch button.on{background:var(--dk);color:#fff;border-color:var(--dk)}
.mh{margin:1rem 0 .6rem;font-weight:700;font-size:.92rem}
.mg{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.mg>div{background:#fff;border:1px solid var(--ln);border-radius:14px;padding:.7rem .8rem}
.mg small{display:block;color:var(--mut);font-size:.68rem;font-weight:600}.mg b{display:block;font-size:1.35rem;letter-spacing:-.03em;margin:.35rem 0 .2rem}.mg b.gr{color:var(--fo)}.mg em{font-style:normal;color:var(--mut);font-size:.62rem}
.ml{display:grid;gap:.6rem}.ml>div{display:flex;justify-content:space-between;align-items:center;background:#fff;border:1px solid var(--ln);border-radius:14px;padding:.75rem .9rem;font-weight:600;font-size:.82rem}.ml small{display:block;color:var(--mut);font-weight:400;font-size:.68rem;margin-top:.15rem}.ml b{font-size:1.3rem}
.mtb{display:flex;background:#fff;border-radius:0 0 30px 30px;border-top:1px solid var(--ln);padding:.45rem .3rem .7rem}.mtb button{flex:1;border:0;background:none;font:600 .66rem 'DM Sans',sans-serif;color:var(--mut);padding:.5rem 0;cursor:pointer}.mtb button.on{color:var(--fo)}.mtb button.on::before{content:"";display:block;width:18px;height:3px;border-radius:2px;background:var(--g);margin:0 auto .3rem}
@media(max-width:900px){.mwrap{height:700px}}
.mwrap iframe[hidden]{display:none!important}

.prose h2{font-size:1.45rem;letter-spacing:-.025em;line-height:1.25;margin:2.2rem 0 .6rem;color:var(--dk);font-weight:700}

/* e‑invoice section responsive image */
#einvoice .art img {max-width:100%;height:auto;}


