/* public.css — public pages (home, about, contact) */
*,*::before,*::after{box-sizing:border-box}
:root{--accent:#b42318;--accent-600:#912018;--accent-50:#fef3f2;--bg:#ffffff;--bg-2:#f6f7f9;--surface:#fff;--border:#e4e7ec;--text:#101828;--text-2:#344054;--muted:#667085;--green:#067647;--navy:#1d2733}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.55}
a{color:var(--accent)}
img{max-width:100%;display:block}
h1,h2,h3{letter-spacing:-.02em;line-height:1.2;margin:0 0 .5em}
h1{font-size:clamp(28px,5.2vw,48px)}
h2{font-size:clamp(22px,3.4vw,32px);text-align:center;margin-bottom:24px}
h3{font-size:17px}
p{margin:0 0 1em}
.center{text-align:center}.muted{color:var(--muted)}.small{font-size:13px;color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--accent);color:#fff;border:none;border-radius:12px;padding:13px 22px;font-weight:700;font-size:15px;text-decoration:none;cursor:pointer;font-family:inherit;transition:background .15s,transform .1s}
.btn:hover{background:var(--accent-600)}.btn:active{transform:scale(.98)}
.btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border)}.btn-ghost:hover{background:var(--bg-2)}
.btn-sm{padding:9px 14px;font-size:14px;border-radius:10px}
.btn-block{width:100%}
/* header */
.ph{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px max(16px,calc((100vw - 1120px)/2));background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.ph-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text);font-weight:800;font-size:17px}
.ph-brand small{display:block;font-weight:500;font-size:12px;color:var(--muted)}
.ph-mark{width:36px;height:36px;border-radius:10px;background:var(--accent);flex-shrink:0;position:relative}
.ph-mark::before{content:"";position:absolute;inset:8px 7px 11px;border-radius:7px;background:#fff}
.ph-mark::after{content:"";position:absolute;left:11px;bottom:7px;border:5px solid transparent;border-top-color:#fff;border-left-color:#fff}
.ph-nav{display:flex;align-items:center;gap:6px}
.ph-nav a{text-decoration:none;color:var(--text-2);font-weight:600;font-size:14.5px;padding:8px 10px;border-radius:8px}
.ph-nav a.on{color:var(--accent);background:var(--accent-50)}
.ph-nav a.btn{color:#fff;padding:9px 14px}
.ph-lang{border:1px solid var(--border)}
.ph-burger{display:none;width:42px;height:42px;border:1px solid var(--border);border-radius:10px;background:#fff;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer}
.ph-burger span{width:18px;height:2px;background:var(--text);border-radius:2px}
@media (max-width:860px){
  .ph-burger{display:flex}
  .ph-nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;background:#fff;border-bottom:1px solid var(--border);padding:10px 16px 16px;box-shadow:0 12px 24px rgba(16,24,40,.08)}
  .ph-nav.open{display:flex}
  .ph-nav a{padding:12px}
  .ph-nav a.btn{margin-top:6px}
}
/* sections */
main{overflow-x:hidden}
.sec{padding:56px max(16px,calc((100vw - 1120px)/2))}
.sec-alt{background:var(--bg-2)}
.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;padding:48px max(16px,calc((100vw - 1120px)/2)) 56px;background:radial-gradient(1200px 500px at 85% -10%,#fde7e4 0%,rgba(255,255,255,0) 60%)}
@media (max-width:900px){.hero{grid-template-columns:1fr;gap:28px;padding-top:28px}}
.eyebrow{display:inline-block;background:var(--accent-50);color:var(--accent);font-weight:700;font-size:13px;padding:6px 12px;border-radius:999px;margin-bottom:16px}
.lead{font-size:clamp(16px,2vw,18.5px);color:var(--text-2);max-width:620px}
.hero-cta{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 18px}
.ticks{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--text-2);font-size:14px;font-weight:600}
.ticks li::before{content:"✓";color:var(--green);margin-right:6px;font-weight:800}
/* live demo phone */
.hero-demo{display:flex;flex-direction:column;align-items:center}
.phone{width:min(340px,100%);border-radius:34px;background:#0f172a;padding:12px;box-shadow:0 30px 60px rgba(16,24,40,.22),0 0 0 1px rgba(16,24,40,.08)}
.phone>*{border-radius:0}
.ph-top{display:flex;justify-content:space-between;align-items:center;background:#1d2733;color:#fff;padding:10px 12px;border-radius:24px 24px 0 0;font-size:12px;font-weight:700}
.ph-top .live{display:flex;align-items:center;gap:6px}.ph-top .live i{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.25)}
.ph-top .qn{background:rgba(255,255,255,.14);padding:3px 9px;border-radius:999px}
.stage{height:290px;background:#e9eef3;position:relative;overflow:hidden}
.stage svg{width:100%;height:100%;display:block}
.cap{background:linear-gradient(180deg,#1d2733,#151c25);color:#fff;padding:12px 14px;min-height:86px;text-align:center}
.cap-q{font-weight:700;font-size:15.5px;line-height:1.35;transition:opacity .3s}
.cap-sub{font-size:12.5px;opacity:.75;margin-top:4px;transition:opacity .3s}
.panel{background:#fff;border-radius:0 0 24px 24px;padding:12px 14px 16px;min-height:150px;position:relative}
.ans{background:var(--accent);color:#fff;border-radius:14px 14px 4px 14px;padding:8px 12px;font-size:13.5px;margin-left:24px;opacity:0;transform:translateY(6px);transition:all .35s}
.interp{font-size:12px;color:var(--text-2);margin:6px 0 0 24px;opacity:0;transition:opacity .35s}
.interp b{color:var(--muted)}
.score{display:inline-flex;gap:8px;align-items:center;margin-top:8px;font-size:12.5px;background:var(--bg-2);border:1px solid var(--border);border-radius:10px;padding:5px 10px;opacity:0;transition:opacity .35s}
.score b{color:var(--green);font-size:15px}
.show{opacity:1!important;transform:none!important}
.mic{position:absolute;right:14px;bottom:14px;width:46px;height:46px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 rgba(180,35,24,.4)}
.mic span{position:absolute;left:18px;top:11px;width:10px;height:16px;border-radius:6px;background:#fff}
.mic.on{animation:micp 1.1s infinite}
@keyframes micp{0%{box-shadow:0 0 0 0 rgba(180,35,24,.45)}100%{box-shadow:0 0 0 16px rgba(180,35,24,0)}}
.demo-note{font-size:12.5px;color:var(--muted);margin-top:12px;text-align:center}
/* avatar animation */
.stage .av-head{transform-origin:200px 260px;animation:avIdle 6s ease-in-out infinite}
.stage.talking .av-head{animation:avTalk 2.4s ease-in-out infinite}
.stage .av-eye{transition:transform .07s}.stage .av.blink .av-eye{transform:scaleY(.1)}
@keyframes avIdle{0%,100%{transform:rotate(0)}30%{transform:rotate(-1.2deg) translateY(1px)}60%{transform:rotate(.8deg) translateY(-1px)}}
@keyframes avTalk{0%,100%{transform:rotate(0)}20%{transform:rotate(1.4deg) translateY(-2px)}45%{transform:rotate(-1deg) translateY(1px)}70%{transform:rotate(.6deg)}}
/* features */
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:900px){.feat-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.feat-grid{grid-template-columns:1fr}}
.feat{background:#fff;border:1px solid var(--border);border-radius:16px;padding:20px}
.feat .fi{font-size:26px;width:48px;height:48px;border-radius:12px;background:var(--accent-50);display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.feat p{color:var(--text-2);font-size:14.5px;margin:0}
/* screenshots */
.shots{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media (max-width:980px){.shots{grid-template-columns:1fr 1fr}}
.shots figure{margin:0;background:#fff;border:1px solid var(--border);border-radius:18px;padding:10px;box-shadow:0 8px 20px rgba(16,24,40,.06)}
.shots img{border-radius:12px;width:100%;aspect-ratio:9/16;object-fit:cover;object-position:top;background:var(--bg-2)}
.shots figcaption{font-size:13.5px;color:var(--text-2);padding:10px 4px 2px;text-align:center}
/* steps */
.steps{list-style:none;padding:0;margin:0 auto;max-width:820px;display:grid;gap:14px}
.steps li{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid var(--border);border-radius:16px;padding:18px}
.steps b{flex-shrink:0;width:38px;height:38px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:17px}
.steps p{margin:0;color:var(--text-2)}
/* price */
.price-card{max-width:860px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:24px;background:#fff;border:1px solid var(--border);border-radius:20px;padding:28px;box-shadow:0 10px 30px rgba(16,24,40,.06)}
.price-card h2{text-align:left;margin-bottom:8px}
.price{text-align:center;flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:6px}
.price span{font-size:34px;font-weight:800}.price small{color:var(--muted);margin-bottom:8px}
@media (max-width:640px){.price-card{flex-direction:column;text-align:center}.price-card h2{text-align:center}}
/* languages */
.langs{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:900px;margin:0 auto}
.langs span{background:#fff;border:1px solid var(--border);border-radius:999px;padding:7px 14px;font-weight:600;font-size:14px}
/* faq */
.faq{max-width:760px;margin:0 auto;display:grid;gap:10px}
.faq details{background:#fff;border:1px solid var(--border);border-radius:14px;padding:14px 18px}
.faq summary{cursor:pointer;font-weight:700}
.faq p{margin:10px 0 0;color:var(--text-2)}
/* about / contact */
.page-hero{padding:48px max(16px,calc((100vw - 900px)/2)) 8px;text-align:center}
.page-hero .lead{margin:0 auto}
.prose{max-width:820px;margin:0 auto;padding-left:16px;padding-right:16px}
.prose h2{text-align:left;margin-top:28px}
.prose p,.prose li{color:var(--text-2);font-size:16px}
.prose li{margin-bottom:8px}
.note{background:#fff8e6;border:1px solid #f3d9a4;border-radius:14px;padding:16px 18px;color:#5b4410;margin-top:24px}
.contact-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:20px;max-width:1000px;margin:0 auto}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:20px}
.contact-side{display:grid;gap:14px;align-content:start}
.contact-side h3{margin-bottom:6px}.contact-side p{margin:0;color:var(--text-2);font-size:14.5px;overflow-wrap:anywhere}
.form-card form{display:grid;gap:14px}
.form-card label{display:grid;gap:6px;font-weight:600;font-size:14px;color:var(--text-2)}
.form-card input,.form-card select,.form-card textarea{width:100%;font:inherit;font-size:16px;padding:12px 14px;border:1px solid #d0d5dd;border-radius:10px;background:#fff;color:var(--text)}
.form-card input:focus,.form-card select:focus,.form-card textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(180,35,24,.12)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ok-box{background:#eefaf2;border:1px solid #bfe6cc;color:#14532d;border-radius:12px;padding:12px 14px;margin-bottom:14px}
.err-box{background:#fdecea;border:1px solid #f6c7bf;color:#912018;border-radius:12px;padding:12px 14px;margin-bottom:14px}
/* footer */
.pf{background:var(--navy);color:#cbd5e1;padding:36px max(16px,calc((100vw - 1120px)/2)) 24px;font-size:14px}
.pf-in{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.pf-brand{color:#fff;font-weight:800;font-size:17px;margin-bottom:6px}
.pf-links{display:flex;gap:16px;flex-wrap:wrap}
.pf a{color:#e2e8f0;text-decoration:none}.pf a:hover{text-decoration:underline}
.pf-legal{margin:24px 0 6px;font-size:12.5px;color:#94a3b8;max-width:820px}
.pf-copy{margin:0;font-size:12.5px;color:#94a3b8}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Logo + countries (v7.0) */
.ph-logo{width:38px;height:38px;border-radius:10px;flex-shrink:0;display:block}
.ph-accent{color:var(--accent);font-weight:800}
.countries{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:1000px;margin:0 auto}
@media (max-width:900px){.countries{grid-template-columns:repeat(2,1fr)}}
.ctry{background:#fff;border:1px solid var(--border);border-radius:14px;padding:14px;display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center}
.ctry .cf{font-size:26px;grid-row:span 2;line-height:1}
.ctry b{font-size:15px}
.ctry small{color:var(--muted);font-size:12.5px;line-height:1.3}
