:root{--teal:#0F4761;--coral:#E07A3F;--coral-ink:#A84B1A;/* coral-ink: AA-contrast coral for text; brand coral stays for fills, outlines, shadows */--cream:#F5F1E8;--paper:#FFFFFF;--paper-2:#EFE9DC;--line:#D9D0BD;--grid:#E7E0D0;--ink:#0B1F2A;--muted:#4A5A63;--sun:#FFE08A;--sx:3px;color-scheme:light}
[dir="rtl"]{--sx:-3px}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:28px 28px;color:var(--ink);font:400 16px/1.6 'Readex Pro',system-ui,sans-serif}
h1,h2,h3,.brand b,.btn,.pill,.ph-num{font-family:'Alexandria','Readex Pro',sans-serif}
a{color:var(--teal)}
:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.try-text :focus-visible{outline-color:var(--sun)}
main,.top,.foot{max-width:1080px;margin:0 auto;padding:0 16px}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:14px;padding-bottom:14px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.word{display:flex;flex-direction:column;line-height:1}
.word b{font-size:24px;font-weight:700;color:var(--teal)}
.word small{font:600 11px/1 'Alexandria',sans-serif;letter-spacing:.12em;color:var(--muted);margin-top:3px}
.links{display:flex;align-items:center;gap:14px;font-weight:600}
.links>a:first-child{text-decoration:none}
.btn{display:inline-block;white-space:nowrap;border:1.5px solid var(--teal);border-radius:8px;padding:10px 16px;font-weight:600;font-size:15px;text-decoration:none;transition:transform .15s}
.btn:hover{transform:translateY(-2px)}
.btn.primary{background:var(--teal);color:#fff;box-shadow:var(--sx) 3px 0 var(--coral)}
.btn.ghost{background:var(--paper);color:var(--teal)}
.hero{text-align:center;padding:36px 0 28px}
.pill{display:inline-block;background:var(--sun);border-radius:999px;padding:3px 14px;font-size:13px;font-weight:600;margin:0 0 14px}
h1{text-wrap:balance;font-size:clamp(30px,7vw,52px);line-height:1.2;margin:0 auto 14px;max-width:16em;font-weight:800}
h1 em{font-style:normal;color:var(--coral-ink)}
.lead{color:var(--muted);font-size:clamp(16px,2.6vw,19px);max-width:34em;margin:0 auto 22px}
.actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;margin:0}
h2{font-size:clamp(22px,4.5vw,30px);margin:0 0 16px}
section{padding:22px 0}
.cards{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.card{background:var(--paper);border:1.5px solid var(--teal);border-radius:10px;box-shadow:var(--sx) 3px 0 var(--teal);padding:16px}
.card.soft{border-color:var(--line);box-shadow:none}
.card h3{margin:0 0 4px;font-size:18px;color:var(--teal);display:flex;align-items:center;gap:8px}
.card p{margin:0;color:var(--muted)}
.dot{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--coral);color:var(--ink);font-size:13px;flex:none}
@media (min-width:700px){.cards.three{grid-template-columns:repeat(3,1fr)}.cards.two{grid-template-columns:repeat(2,1fr)}}
.try{background:var(--teal);color:#fff;border-radius:14px;padding:22px 16px;margin:12px 0;display:grid;gap:18px;scroll-margin-top:12px}
.try h2{color:#fff;margin-bottom:6px}
.try-text p{margin:0;opacity:.9}
@media (min-width:900px){.try{grid-template-columns:1fr auto;align-items:center;padding:28px}}
.replay{margin-top:12px;background:none;border:0;color:var(--sun);font:600 15px 'Alexandria',sans-serif;cursor:pointer;padding:4px 0}
.demo{display:grid;grid-template-columns:repeat(2,minmax(0,170px));gap:12px;justify-content:center}
@media (min-width:900px){.demo{grid-template-columns:repeat(2,minmax(0,200px))}}
.phone{background:var(--paper);color:var(--ink);border:2px solid var(--ink);border-radius:22px;box-shadow:var(--sx) 4px 0 var(--coral);padding:14px 10px;min-height:240px;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.ph-label{font-size:12px;color:var(--muted);margin:0}
.ph-shop{font-weight:600;margin:0;font-size:14px}
.ph-num{font-size:56px;font-weight:800;color:var(--teal);line-height:1;margin:8px 0 4px}
.ph-status{margin:0;font-weight:600}
.customer.is-ready{background:#FFF5EE}
.customer.is-ready .ph-status{color:var(--coral-ink);font-size:18px}
.customer.ringing{animation:shake .5s 6;outline:3px solid var(--coral)}
.customer.is-coming .ph-status{color:var(--teal)}
.coming{margin-top:auto;background:var(--coral);color:var(--ink);border:0;border-radius:8px;padding:10px 14px;font:600 15px 'Alexandria',sans-serif;cursor:pointer;width:100%}
.rows{list-style:none;padding:0;margin:4px 0 0;width:100%;display:grid;gap:8px}
.row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px;border:1px solid var(--line);border-radius:8px;padding:8px}
.row b{font-family:'Alexandria',sans-serif;color:var(--teal);font-size:18px}
.row button{background:var(--teal);color:#fff;border:0;border-radius:6px;padding:7px 12px;font:600 14px 'Alexandria',sans-serif;cursor:pointer}
.row button[disabled]{opacity:.5;cursor:default}
.chip{font-size:11px;white-space:nowrap;border-radius:999px;padding:2px 6px;background:var(--sun);color:var(--ink)}
.row.is-coming .chip{background:var(--coral);color:var(--ink)}
.nojs{text-align:center;font-size:14px}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
@media (prefers-reduced-motion:reduce){.customer.ringing{animation:none}.btn{transition:none}html{scroll-behavior:auto}}
.early{display:grid;gap:12px;margin:18px 0;box-shadow:var(--sx) 4px 0 var(--coral)}
.early h2{margin:0 0 4px;font-size:clamp(20px,4vw,26px)}
.early p{margin:0}
@media (min-width:700px){.early{grid-template-columns:1fr auto;align-items:center}}
.mail{font-weight:600}
.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;padding-top:18px;padding-bottom:28px;color:var(--muted);font-size:14px}
.foot a{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:var(--muted)}
@media (max-width:359px){.btn{padding:9px 10px;font-size:14px}.top{gap:8px}.links{gap:8px}}