/* AtomicGate site styles: shared by /, /erp/ and /try/ */
:root{
  --ink:#16202a;        /* charcoal from the logo */
  --ink-2:#3b4855;
  --muted:#5f6b78;
  --line:#e4e8ee;
  --bg:#ffffff;
  --bg-soft:#f5f7fa;
  --navy:#0e1a24;       /* hero / footer */
  --navy-2:#13232f;
  --teal:#0fb5c9;       /* logo glow */
  --teal-ink:#0a7f8f;   /* teal dark enough for text on white */
  --teal-soft:#e6f7f9;
  --copper:#c4834f;     /* "GATE" in the wordmark */
  --copper-soft:#fbf1e8;
  --ok:#15803d; --warn:#b45309; --bad:#b91c1c;
  --radius:14px;
  --shadow:0 1px 2px rgba(16,24,40,.06),0 8px 24px rgba(16,24,40,.08);
  --shadow-lg:0 2px 4px rgba(0,0,0,.2),0 30px 60px rgba(0,0,0,.35);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,"Noto Sans Lao",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--teal-ink)}
h1,h2,h3{line-height:1.15;letter-spacing:-.02em}
h2{font-size:clamp(28px,3.4vw,40px);font-weight:800;margin:10px 0 14px}
.lead{font-size:18px;color:var(--muted);max-width:680px}
section{padding:96px 0}
.center{text-align:center}.center .lead{margin:0 auto}
.btn{display:inline-flex;align-items:center;gap:8px;padding:13px 22px;border-radius:10px;font-weight:600;font-size:15px;transition:transform .15s,box-shadow .15s,background .15s;white-space:nowrap}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--teal);color:#05232a;box-shadow:0 6px 20px rgba(15,181,201,.35)}
.btn-primary:hover{background:#2cc6d8}
.btn-ghost{border:1px solid rgba(255,255,255,.28);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.08)}
.btn-dark{background:var(--ink);color:#fff}
.btn-outline{border:1px solid var(--line);color:var(--ink);background:#fff}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:50;background:rgba(14,26,36,.92);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid rgba(255,255,255,.06)}
.nav .wrap{display:flex;align-items:center;height:68px;gap:28px}
.brand{display:flex;align-items:center;gap:10px;color:#fff;font-weight:800;letter-spacing:.06em;font-size:17px}
.brand img{width:34px;height:34px}
.brand b{color:var(--copper);font-weight:800}
.nav ul{display:flex;gap:26px;list-style:none;margin-left:auto}
.nav ul a{color:#c8d3dc;font-size:14.5px;font-weight:500}
.nav ul a:hover{color:#fff}
.nav .btn{padding:10px 16px;font-size:14px}
.lang{color:#c8d3dc;font-size:13px;border:1px solid rgba(255,255,255,.18);border-radius:8px;padding:6px 10px}

/* ---------- hero ---------- */
.hero{background:radial-gradient(1200px 500px at 85% -10%,rgba(15,181,201,.20),transparent 60%),radial-gradient(800px 400px at 0% 110%,rgba(196,131,79,.14),transparent 60%),var(--navy);color:#fff;padding:84px 0 64px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:48px;align-items:center}
.hero .eyebrow{color:#6fe3f0}
.hero h1{font-size:clamp(36px,4.6vw,56px);font-weight:800;margin:14px 0 18px}
.hero h1 em{font-style:normal;color:var(--teal)}
.hero p.sub{font-size:19px;color:#b9c6d1;max-width:560px}
.hero .ctas{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0 18px}
.hero .note{font-size:13.5px;color:#8fa1b0}
.trust{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:34px;padding-top:24px;border-top:1px solid rgba(255,255,255,.08)}
.trust span{display:flex;align-items:center;gap:8px;font-size:14px;color:#c8d3dc}
.trust svg{flex:none;color:var(--teal)}
.hero-visual{position:relative;padding-bottom:72px}

/* ---------- app mock (mirrors the real AtomicGate ERP UI) ---------- */
.app{background:#fff;color:var(--ink);border-radius:12px;box-shadow:var(--shadow-lg);overflow:hidden;font-size:12.5px;border:1px solid rgba(255,255,255,.08)}
.app-bar{display:flex;align-items:center;gap:6px;padding:9px 12px;background:#f1f4f8;border-bottom:1px solid var(--line)}
.app-bar i{width:9px;height:9px;border-radius:50%;background:#d6dce4}
.app-bar .url{margin-left:10px;background:#fff;border:1px solid var(--line);border-radius:6px;padding:2px 10px;color:var(--muted);font-size:11px}
.app-body{display:grid;grid-template-columns:124px 1fr;min-height:330px}
.app-side{background:#fafbfc;border-right:1px solid var(--line);padding:12px 8px}
.app-side .logo{display:flex;align-items:center;gap:6px;font-weight:700;color:#1d4ed8;font-size:11px;white-space:nowrap;padding:2px 4px 12px}
.app-side .logo img{width:18px;height:18px}
.app-side div.it{padding:6px 8px;border-radius:7px;color:#475467;margin-bottom:2px;display:flex;gap:7px;align-items:center}
.app-side div.it.on{background:#1d4ed8;color:#fff;font-weight:600}
.app-side div.it b{width:7px;height:7px;border-radius:2px;background:currentColor;opacity:.55}
.app-main{padding:16px 18px}
.app-main h4{font-size:15px;font-weight:700;margin-bottom:2px}
.app-main .meta{color:var(--muted);font-size:11.5px;margin-bottom:12px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.pill{display:inline-block;padding:2px 8px;border-radius:999px;font-size:10.5px;font-weight:600}
.pill.ok{background:#dcfce7;color:var(--ok)}.pill.warn{background:#fef3c7;color:var(--warn)}.pill.info{background:#dbeafe;color:#1d4ed8}.pill.bad{background:#fee2e2;color:var(--bad)}
table.t{width:100%;border-collapse:collapse}
table.t th{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);text-align:left;font-weight:600;padding:7px 6px;border-bottom:1px solid var(--line);background:#fafbfc}
table.t td{padding:8px 5px;border-bottom:1px solid #f0f2f5;white-space:nowrap}
table.t td.r,table.t th.r{text-align:right}
.mono{font-variant-numeric:tabular-nums}
.tot{display:flex;justify-content:flex-end;gap:22px;margin-top:10px;font-size:12px}
.tot strong{font-size:14px}
.float-card{position:absolute;background:#fff;color:var(--ink);border-radius:12px;box-shadow:var(--shadow-lg);padding:12px 14px;font-size:12px;width:230px}
.float-card .k{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:600}
.float-card .v{font-size:20px;font-weight:800;margin:2px 0}
.fc-1{left:-34px;bottom:22px}
.fc-2{right:-20px;top:-26px;width:210px}
.bar{height:7px;border-radius:9px;background:#eef1f5;overflow:hidden;margin-top:6px}
.bar span{display:block;height:100%;background:var(--teal)}

/* ---------- problems ---------- */
.problems{background:var(--bg-soft)}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:0 1px 2px rgba(16,24,40,.04)}
.card h3{font-size:18px;margin:12px 0 8px}
.card p{color:var(--muted);font-size:15px}
.card .q{font-size:15px;color:var(--ink-2);font-style:italic;border-left:3px solid var(--copper);padding-left:12px;margin-bottom:10px}
.ico{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;background:var(--teal-soft);color:var(--teal-ink)}
.ico.cu{background:var(--copper-soft);color:var(--copper)}

/* ---------- features ---------- */
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}
.feat{padding:26px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;transition:box-shadow .2s,border-color .2s}
.feat:hover{box-shadow:var(--shadow);border-color:#d5dde6}
.feat h3{font-size:17.5px;margin:14px 0 8px}
.feat p{color:var(--muted);font-size:15px}

/* ---------- showcase rows ---------- */
.row{display:grid;grid-template-columns:1fr 1.05fr;gap:64px;align-items:center;margin-top:84px}
.row.rev{grid-template-columns:1.05fr 1fr}
.row.rev .txt{order:2}
.row>*,.hero-grid>*,.proof-grid>*{min-width:0}
.panel{overflow-x:auto}
.row h3{font-size:clamp(24px,2.6vw,30px);font-weight:800;margin:10px 0 12px}
.row p{color:var(--muted);font-size:16.5px}
.ticks{list-style:none;margin-top:18px}
.ticks li{display:flex;gap:10px;margin:9px 0;color:var(--ink-2);font-size:15.5px}
.ticks li:before{content:"";flex:none;width:20px;height:20px;margin-top:2px;border-radius:50%;background:var(--teal-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%230a7f8f'%3E%3Cpath d='M8.1 13.6 4.6 10l1.2-1.2 2.3 2.3 6-6 1.2 1.2z'/%3E%3C/svg%3E") center/16px no-repeat}
.panel{background:var(--bg-soft);border:1px solid var(--line);border-radius:18px;padding:26px}
.panel .app{box-shadow:var(--shadow);border-color:var(--line)}
.trace{display:grid;gap:10px}
.step{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:13px}
.step .n{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;font-weight:700;font-size:12px;background:var(--teal-soft);color:var(--teal-ink)}
.step small{display:block;color:var(--muted);font-size:11.5px}
.yield-row{display:grid;grid-template-columns:120px 1fr 60px;gap:10px;align-items:center;font-size:12.5px;margin:9px 0}
.yield-row .bar{margin:0;height:10px}
.yield-row .bar span.c{background:var(--copper)}
.yield-row .bar span.g{background:#cbd5e1}

/* ---------- modules ---------- */
.modules{background:var(--bg-soft)}
.mod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
.mod{background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px}
.mod h3{font-size:15.5px;margin-bottom:6px;display:flex;align-items:center;gap:8px}
.mod h3:before{content:"";width:8px;height:8px;border-radius:2px;background:var(--teal)}
.mod p{font-size:14px;color:var(--muted)}
.mod.wide{grid-column:span 2;background:var(--navy);color:#fff;border-color:var(--navy)}
.mod.wide p{color:#b9c6d1}
.mod.wide h3:before{background:var(--copper)}

/* ---------- industries ---------- */
.ind-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}
.ind{border:1px solid var(--line);border-radius:12px;padding:18px 20px;font-weight:600;font-size:15px;display:flex;flex-direction:column;gap:4px}
.ind span{font-weight:400;color:var(--muted);font-size:13.5px}

/* ---------- proof ---------- */
.proof{background:var(--navy);color:#fff}
.proof-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}
.proof .eyebrow{color:#6fe3f0}
.proof p{color:#b9c6d1;font-size:17px}
.why{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.why div{background:var(--navy-2);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:18px}
.why b{display:block;font-size:15.5px;margin-bottom:4px}
.why span{font-size:14px;color:#9fb0be}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:44px;counter-reset:s}
.st{position:relative;padding:22px 18px;border:1px solid var(--line);border-radius:12px;background:#fff}
.st:before{counter-increment:s;content:counter(s);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--ink);color:#fff;font-weight:700;margin-bottom:12px}
.st h3{font-size:15.5px;margin-bottom:6px}
.st p{font-size:14px;color:var(--muted)}

/* ---------- pricing ---------- */
.pricing{background:var(--bg-soft)}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}
.price{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;display:flex;flex-direction:column}
.price.hl{border:2px solid var(--teal);box-shadow:var(--shadow)}
.price h3{font-size:19px}
.price .for{color:var(--muted);font-size:14.5px;margin:6px 0 16px}
.price .ticks{margin:0 0 22px;flex:1}
.price .ticks li{font-size:14.5px}
.price .tag{align-self:flex-start;font-size:12px;font-weight:700;color:var(--teal-ink);background:var(--teal-soft);padding:3px 10px;border-radius:999px;margin-bottom:10px}

/* ---------- faq ---------- */
.faq{max-width:820px;margin:40px auto 0}
details{border-bottom:1px solid var(--line);padding:18px 4px}
summary{cursor:pointer;font-weight:600;font-size:16.5px;list-style:none;display:flex;justify-content:space-between;gap:20px}
summary::-webkit-details-marker{display:none}
summary:after{content:"+";font-size:22px;line-height:1;color:var(--teal-ink)}
details[open] summary:after{content:"–"}
details p{color:var(--muted);margin-top:10px;font-size:15.5px}

/* ---------- other products ---------- */
.products{padding-top:24px}
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.prod{border:1px solid var(--line);border-radius:var(--radius);padding:26px;display:flex;flex-direction:column;background:#fff}
.prod-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.prod-top img{width:42px;height:42px}
.prod h3{font-size:19px;margin-bottom:8px}
.prod p{color:var(--muted);font-size:15px;flex:1}
.prod .link{margin-top:16px;font-weight:600;color:var(--teal-ink)}

/* ---------- cta + footer ---------- */
.cta{background:linear-gradient(120deg,var(--navy) 0%,#123342 100%);color:#fff;border-radius:22px;padding:56px;display:grid;grid-template-columns:1.3fr auto;gap:30px;align-items:center}
.cta h2{margin:0 0 8px}
.cta p{color:#b9c6d1;font-size:17px}
.cta .ctas{display:flex;gap:12px;flex-wrap:wrap}
.services{display:flex;gap:18px;flex-wrap:wrap;justify-content:center;margin-top:18px;color:var(--muted);font-size:15px}
.services a{color:var(--teal-ink);font-weight:600}
footer{background:var(--navy);color:#9fb0be;padding:64px 0 28px;font-size:14.5px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px}
footer h4{color:#fff;font-size:14px;margin-bottom:12px}
footer li{list-style:none;margin:8px 0}
footer a:hover{color:#fff}
.foot-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.08);margin-top:44px;padding-top:22px;font-size:13px}

/* ---------- responsive ---------- */
@media (max-width:1020px){
  .nav ul,.lang{display:none}
  .nav .btn{margin-left:auto}
  .hero-grid,.proof-grid,.row,.row.rev{grid-template-columns:1fr}
  .row.rev .txt{order:0}
  .hero-visual{padding-bottom:40px}
  .fc-1{left:8px}.fc-2{right:8px}
  .mod-grid,.ind-grid{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr}
  .cta{grid-template-columns:1fr;padding:40px 28px}
}
@media (max-width:860px){
  .nav ul,.lang{display:none}
  .nav .btn{margin-left:auto}
  .cards3,.feat-grid,.price-grid,.prod-grid{grid-template-columns:1fr}
  section{padding:72px 0}
}
@media (max-width:560px){
  .wrap{padding:0 16px}
  .mod-grid,.ind-grid,.steps,.why,.foot-grid{grid-template-columns:1fr}
  .mod.wide{grid-column:auto}
  .app-body{grid-template-columns:1fr}.app-side{display:none}
  .app{font-size:11.5px}
  .hide-sm{display:none}
  .float-card{position:static;width:auto;margin-top:12px}
  .hero .ctas .btn{width:100%;justify-content:center}
}

/* =================================================================
   Company home page (/)
   ================================================================= */
.home-hero .hero-grid{grid-template-columns:1fr 1fr}
.stack3{position:relative;height:470px}
.stack3>*{position:absolute}
.mini-app{left:0;top:0;width:82%}
.mini-app .app-body{grid-template-columns:1fr;min-height:0}
.doc{left:4%;top:262px;width:46%;background:#fff;color:var(--ink);border-radius:12px;box-shadow:var(--shadow-lg);padding:16px;font-size:11.5px}
.doc .ln{height:7px;border-radius:4px;background:#e9edf2;margin:7px 0}
.doc .hl{background:rgba(15,181,201,.22);outline:1px solid rgba(15,181,201,.6)}
.doc .tag{display:inline-block;margin:8px 4px 0 0}
.phone{right:3%;top:232px;width:176px;background:#0b141c;border-radius:26px;padding:10px;box-shadow:var(--shadow-lg);border:1px solid rgba(255,255,255,.12)}
.phone .scr{background:#fff;border-radius:18px;padding:12px 10px;color:var(--ink);font-size:11px;min-height:220px}
.phone .svc{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:7px;margin-top:7px}
.phone .svc i{width:22px;height:22px;border-radius:7px;background:var(--copper-soft);flex:none}
.phone .svc:nth-child(odd) i{background:var(--teal-soft)}
.big-prod{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:20px;margin-top:44px}
.big-prod .prod{padding:30px}
.big-prod .prod.flag{background:var(--navy);color:#fff;border-color:var(--navy)}
.big-prod .prod.flag p{color:#b9c6d1}
.big-prod .prod.flag .link{color:#6fe3f0}
.big-prod .prod p{flex:none}
.big-prod .prod ul.ticks{margin:14px 0 4px;flex:1}
.big-prod .prod ul.ticks li{font-size:14.5px}
.big-prod .prod.flag ul.ticks li{color:#dbe4ea}
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}
@media (max-width:1020px){
  .home-hero .hero-grid,.big-prod{grid-template-columns:1fr}
  .svc-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .stack3{height:auto;display:grid;gap:14px}
  .stack3>*{position:static;width:auto!important}
  .phone{width:200px!important;margin:0 auto}
  .svc-grid{grid-template-columns:1fr}
}

/* =================================================================
   Trial page (/try/)
   ================================================================= */
:root{--danger:#dc2626}
.hidden{display:none!important}
.try-page{min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(1100px 520px at 90% -10%,rgba(15,181,201,.20),transparent 60%),radial-gradient(800px 420px at -5% 105%,rgba(196,131,79,.14),transparent 60%),var(--navy);color:#fff}
.try-page main{flex:1;display:flex;align-items:center;padding:56px 0 72px}
.try-grid{display:grid;grid-template-columns:1fr 440px;gap:64px;align-items:center}
.try-grid>*{min-width:0}
.try-copy .eyebrow{color:#6fe3f0}
.try-copy h1{font-size:clamp(32px,4vw,48px);font-weight:800;margin:12px 0 16px}
.try-copy h1 em{font-style:normal;color:var(--teal)}
.try-copy p.sub{font-size:18px;color:#b9c6d1;max-width:520px}
.try-copy .ticks li{color:#dbe4ea}
.try-copy .ticks li:before{background-color:rgba(15,181,201,.16)}
.try-copy .small{margin-top:22px;font-size:14px;color:#8fa1b0;max-width:520px}
.try-card{background:#fff;color:var(--ink);border-radius:18px;box-shadow:var(--shadow-lg);overflow:hidden}
.try-card .card-top{height:4px;background:linear-gradient(90deg,var(--teal),var(--copper))}
.try-card .pad{padding:30px 30px 28px}
.try-card h2{font-size:22px;font-weight:800;margin:0 0 6px;letter-spacing:-.01em}
.try-card .sub{color:var(--muted);font-size:14.5px;margin-bottom:20px}
.try-card .field{margin-bottom:14px}
.try-card label{display:block;font-size:13.5px;font-weight:600;margin-bottom:6px}
.try-card .opt{font-weight:400;color:var(--muted)}
.try-card input{width:100%;font:inherit;font-size:15px;color:var(--ink);background:#fff;border:1px solid #cfd6df;border-radius:10px;padding:11px 13px;outline:none;transition:border-color .15s,box-shadow .15s}
.try-card input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(15,181,201,.18)}
.try-card .phone-row{display:grid;grid-template-columns:86px 1fr;gap:8px}
.try-card .phone-row .cc{text-align:center;font-weight:600}
.try-card .btn{width:100%;justify-content:center;margin-top:6px;border:0;cursor:pointer;font:inherit;font-weight:600;font-size:15.5px;background:var(--teal);color:#05232a;box-shadow:0 6px 20px rgba(15,181,201,.30)}
.try-card .btn:hover{background:#2cc6d8}
.try-card .btn:disabled{opacity:.6;cursor:default;transform:none}
.try-card .btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:none}
.try-card .btn.ghost:hover{background:var(--bg-soft)}
.try-card .err{color:var(--danger);font-size:13.5px;min-height:20px;margin:2px 0 4px}
.try-card .trust{display:flex;justify-content:center;gap:16px;margin-top:16px;font-size:13px;color:var(--muted)}
.try-card .trust span{display:flex;align-items:center;gap:6px}
.try-card .dot{width:6px;height:6px;border-radius:50%;background:var(--teal)}
.try-card .privacy{font-size:12.5px;color:var(--muted);text-align:center;margin-top:12px}
.try-card .privacy a{color:var(--teal-ink);text-decoration:underline}
.try-card .back{background:none;border:0;color:var(--teal-ink);font:inherit;font-size:14px;font-weight:600;cursor:pointer;margin-bottom:12px}
.try-card .to{font-weight:600;color:var(--ink)}
.try-card .otp{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:6px 0 4px}
.try-card .otp input{text-align:center;font-size:22px;font-weight:700;padding:12px 0}
.try-card .resend{text-align:center;font-size:13.5px;color:var(--muted);margin-top:14px}
.try-card .resend button{background:none;border:0;font:inherit;color:var(--teal-ink);font-weight:600;cursor:pointer}
.try-card .resend button:disabled{color:var(--muted);cursor:default}
.try-card .live{text-align:center}
.try-card .badge{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--ok);background:#dcfce7;padding:5px 12px;border-radius:999px}
.try-card .pulse{width:8px;height:8px;border-radius:50%;background:currentColor;animation:pulse 1.6s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(21,128,61,.45)}70%{box-shadow:0 0 0 8px rgba(21,128,61,0)}100%{box-shadow:0 0 0 0 rgba(21,128,61,0)}}
.try-card .clock{font-size:56px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin:12px 0 0}
.try-card .clock.warn{color:var(--warn)}
.try-card .clock.crit{color:var(--danger)}
.try-card .clocklabel{color:var(--muted);font-size:14px;margin-bottom:18px}
.try-card .stack{display:grid;gap:10px}
.try-card .note{font-size:13px;color:var(--muted);margin-top:14px}
.try-page .banner{max-width:440px;margin:14px 0 0 auto;font-size:13px;color:#fde68a;background:rgba(180,83,9,.25);border:1px solid rgba(253,230,138,.3);border-radius:10px;padding:9px 12px}
.try-foot{border-top:1px solid rgba(255,255,255,.08);padding:20px 0;font-size:13px;color:#8fa1b0}
.try-foot .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.try-foot a:hover{color:#fff}
@media (max-width:1020px){
  .try-grid{grid-template-columns:1fr;gap:36px}
  .try-card{max-width:520px}
  .try-page .banner{margin-left:0}
}
@media (max-width:560px){
  .try-page main{padding:32px 0 48px}
  .try-card .pad{padding:24px 18px}
  .try-card .clock{font-size:46px}
}
/* keep site-wide section / trust-row styles out of the trial card */
.try-card section{padding:0}
.try-card .trust{border-top:0;padding-top:0;flex-wrap:wrap}
.try-card .trust span{color:var(--muted);font-size:13px}

/* ---------- logo lockup: ATOMICGATE with the product name under "GATE" ---------- */
.brand .word{display:inline-flex;flex-direction:column;line-height:1}
.brand .word small{align-self:flex-end;margin-top:4px;margin-right:-.32em;font-size:10.5px;font-weight:700;letter-spacing:.32em;color:var(--teal)}
footer .brand .word small{color:#6fe3f0}

/* =================================================================
   Product pages (/sadouak/, /paperarchive/)
   ================================================================= */
.brand .word small.long{letter-spacing:.14em;margin-right:-.14em;font-size:9.5px}
.phone-xl{width:270px;margin:0 auto;background:#0b141c;border-radius:36px;padding:12px;box-shadow:var(--shadow-lg);border:1px solid rgba(255,255,255,.12);position:relative}
.phone-xl .scr{background:#f6fbfb;border-radius:26px;padding:16px 14px 18px;color:var(--ink);font-size:12px}
.phone-xl .top{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.phone-xl .top img{width:30px;height:30px;border-radius:8px}
.phone-xl .top b{font-size:15px}
.phone-xl .search{background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 10px;color:var(--muted);font-size:11.5px;margin-bottom:12px}
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.cat-grid div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 4px;text-align:center;font-size:10.5px;font-weight:600}
.cat-grid i{display:block;width:26px;height:26px;margin:0 auto 5px;border-radius:9px;background:var(--teal-soft)}
.cat-grid div:nth-child(even) i{background:#ffe8e1}
.pro{display:flex;gap:10px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px;margin-bottom:8px}
.pro .av{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#9be3ea,#ffc7b5);flex:none}
.pro small{display:block;color:var(--muted);font-size:10.5px}
.pro .rt{margin-left:auto;font-weight:700;font-size:11px;color:#c2410c;white-space:nowrap}
.urgent-btn{display:block;text-align:center;background:#ff7a59;color:#fff;font-weight:700;border-radius:12px;padding:10px;margin-top:6px}
.prod-hero-visual{position:relative;padding:10px 0 20px}
.prod-hero-visual .float-card{width:220px}
.prod-hero-visual .phone-xl.left{margin:0}
.prod-hero-visual .fc-a{right:0;bottom:70px}
.prod-hero-visual .fc-b{right:0;top:70px}
.prod-hero-visual .fc-c{right:24px;bottom:-62px}
.steps.four{grid-template-columns:repeat(4,1fr)}
.lang-row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:26px}
.lang-row span{border:1px solid var(--line);border-radius:999px;padding:7px 16px;font-weight:600;font-size:14.5px;background:#fff}
.ocr-doc{background:#fff;color:var(--ink);border-radius:14px;box-shadow:var(--shadow-lg);padding:20px;font-size:12px;position:relative}
.ocr-doc .ln{height:8px;border-radius:4px;background:#e9edf2;margin:9px 0}
.ocr-doc .hl{background:rgba(15,181,201,.22);outline:1px solid rgba(15,181,201,.6)}
.fields{display:grid;gap:8px;margin-top:6px}
.fields div{display:flex;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:10px;padding:8px 10px;font-size:12px}
.fields span{color:var(--muted)}
.searchbar{display:flex;align-items:center;gap:8px;background:#fff;color:var(--ink);border-radius:12px;padding:12px 14px;box-shadow:var(--shadow-lg);font-size:13px;margin-bottom:16px}
.searchbar b{color:var(--teal-ink)}
@media (max-width:1020px){
  .prod-hero-visual .float-card{position:static;width:auto;margin-top:12px}
  .prod-hero-visual .phone-xl.left{margin:0 auto}
  .steps.four{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){.steps.four{grid-template-columns:1fr}}
.card .ico{font-weight:800;font-size:17px}

/* Sadouak phone mock: mirrors the real customer app (teal header, round categories, urgent card) */
.scr.sd{padding:0;overflow:hidden;background:#f2fbfa}
.sd-head{display:flex;align-items:center;gap:10px;background:linear-gradient(135deg,#14a89a,#0f9488);color:#fff;padding:18px 14px 16px;border-radius:0 0 18px 18px}
.sd-head small{display:block;opacity:.8;font-size:10.5px}
.sd-head b{font-size:15px}
.sd-av{width:34px;height:34px;border-radius:50%;background:#dfe7ea;flex:none}
.sd-bell{margin-left:auto;width:30px;height:30px;border-radius:10px;background:rgba(255,255,255,.22)}
.sd-loc{margin:12px 12px 4px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 10px;font-size:11px;color:var(--muted)}
.sd-sec{display:flex;justify-content:space-between;align-items:baseline;margin:12px 12px 8px}
.sd-sec b{font-size:13px}.sd-sec span{font-size:10.5px;color:var(--muted)}
.sd-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:0 10px;text-align:center;font-size:9.5px;font-weight:600}
.sd-cats i{display:grid;place-items:center;font-style:normal;font-size:19px;width:44px;height:44px;margin:0 auto 5px;border-radius:50%;background:#d6f3ef}
.sd-urgent{display:flex;align-items:center;gap:8px;margin:14px 10px 12px;background:#fdeeea;border:1px solid #f6c9bd;border-radius:14px;padding:10px}
.sd-urgent b{display:block;font-size:11.5px}
.sd-urgent small{display:block;color:var(--muted);font-size:9.5px;line-height:1.35}
.sd-bolt{width:28px;height:28px;border-radius:50%;background:#f0645a;color:#fff;display:grid;place-items:center;font-size:13px;flex:none}
.sd-req{background:#f0645a;color:#fff;font-weight:700;font-size:10.5px;border-radius:9px;padding:6px 9px;flex:none}
.sd-nav{display:grid;grid-template-columns:repeat(5,1fr);align-items:center;text-align:center;background:#fff;border-top:1px solid var(--line);padding:9px 4px 11px;font-size:9.5px;color:var(--muted)}
.sd-nav .on{color:#0f9488;font-weight:700}
.sd-mid{width:34px;height:34px;margin:-18px auto 0;border-radius:12px;background:#0f9488;box-shadow:0 6px 14px rgba(15,148,136,.35)}

/* ---------- contact page ---------- */
.contact-list{display:grid;gap:12px;margin-top:28px;max-width:520px}
.contact-list>a,.contact-list>div{display:flex;gap:14px;align-items:flex-start;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09);border-radius:14px;padding:14px 16px;transition:background .15s}
.contact-list>a:hover{background:rgba(255,255,255,.08)}
.contact-list b{display:block;font-size:15.5px}
.contact-list small{color:#9fb0be;font-size:14px}
.contact-list .ci{width:38px;height:38px;border-radius:10px;background:rgba(15,181,201,.16);display:grid;place-items:center;font-size:18px;flex:none}
.try-card select,.try-card textarea{width:100%;font:inherit;font-size:15px;color:var(--ink);background:#fff;border:1px solid #cfd6df;border-radius:10px;padding:11px 13px;outline:none}
.try-card textarea{resize:vertical;min-height:120px}
.try-card select:focus,.try-card textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(15,181,201,.18)}
.try-card .field.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.try-card .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.try-card form{position:relative}
@media (max-width:560px){.try-card .field.two{grid-template-columns:1fr}}