:root {
  --bg:#12100d; --panel:#1b1814; --panel-2:#211d18;
  --text:#f3ecdf; --muted:#a89e8d; --line:rgba(243,236,223,.12);
  --amber:#e9a13b; --amber-soft:rgba(233,161,59,.14);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0; min-height:100vh; color:var(--text); background:var(--bg);
  font-family:"Jost",Arial,sans-serif; line-height:1.5;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
a { color:inherit; }
::selection { background:var(--amber); color:#12100d; }

.glow { position:fixed; z-index:-1; border-radius:50%; filter:blur(120px); pointer-events:none; }
.glow-a { top:-220px; right:-160px; width:640px; height:640px; background:rgba(233,161,59,.16); }
.glow-b { bottom:-260px; left:-200px; width:560px; height:560px; background:rgba(140,90,40,.14); }

.site-header,.hero,.strip,.benefits,.steps,.contact,footer {
  width:min(1240px,calc(100% - 64px)); margin-inline:auto;
}
.site-header { min-height:104px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:block; width:clamp(160px,15vw,230px); }
.brand img { display:block; width:100%; height:auto; filter:invert(1) brightness(1.05); }
.header-nav { display:flex; align-items:center; gap:28px; font-size:15px; font-weight:500; }
.header-nav a { text-decoration:none; color:var(--muted); transition:color .2s ease; }
.header-nav a:hover { color:var(--text); }
.nav-cta {
  padding:10px 20px; border:1px solid var(--amber); border-radius:999px;
  color:var(--amber)!important; font-weight:600;
}
.nav-cta:hover { background:var(--amber-soft); }

h1,h2 { font-family:"Fraunces",Georgia,serif; font-weight:500; text-wrap:balance; margin:0; }
h1 { font-size:clamp(42px,5.4vw,76px); line-height:1.04; letter-spacing:-.01em; }
h1 em { font-style:italic; color:var(--amber); }
h2 { font-size:clamp(32px,3.8vw,54px); line-height:1.08; }

.hero { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr); gap:6vw; align-items:center; padding:64px 0 88px; }
.badge {
  display:inline-block; margin:0 0 26px; padding:8px 16px; border:1px solid var(--line);
  border-radius:999px; background:rgba(243,236,223,.04);
  font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted);
}
.intro { max-width:560px; margin:26px 0 0; color:var(--muted); font-size:clamp(17px,1.35vw,20px); }
.actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:36px; }
.button {
  display:inline-flex; align-items:center; justify-content:center; min-height:56px; padding:0 30px;
  background:var(--amber); color:#191307; border-radius:999px; border:1px solid var(--amber);
  font-size:16px; font-weight:600; text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease;
}
.button:hover,.button:focus-visible { transform:translateY(-2px); box-shadow:0 12px 32px rgba(233,161,59,.35); }
.button-ghost {
  display:inline-flex; align-items:center; min-height:56px; padding:0 26px;
  border:1px solid var(--line); border-radius:999px; color:var(--text);
  font-size:16px; font-weight:600; text-decoration:none; transition:border-color .2s ease;
}
.button-ghost:hover { border-color:var(--amber); color:var(--amber); }
a:focus-visible { outline:2px solid var(--amber); outline-offset:4px; }

.hero-facts { display:flex; gap:40px; margin:48px 0 0; padding:26px 0 0; list-style:none; border-top:1px solid var(--line); }
.hero-facts li { display:grid; gap:4px; }
.hero-facts strong { font-family:"Fraunces",Georgia,serif; font-size:30px; font-weight:600; color:var(--amber); }
.hero-facts span { max-width:150px; color:var(--muted); font-size:13px; line-height:1.4; }
.facts-note { margin:12px 0 0; color:var(--muted); font-size:11px; opacity:.8; }

.hero-phone { display:grid; justify-items:center; gap:22px; }
.phone {
  position:relative; width:min(320px,86%); border-radius:44px; padding:14px;
  background:#0b0a08; border:1px solid rgba(243,236,223,.16);
  box-shadow:0 40px 90px rgba(0,0,0,.55), inset 0 0 0 2px rgba(243,236,223,.05);
  transform:rotate(3deg);
}
.phone-notch { position:absolute; top:14px; left:50%; transform:translateX(-50%); width:110px; height:24px; background:#0b0a08; border-radius:0 0 16px 16px; z-index:2; }
.phone-screen { border-radius:32px; overflow:hidden; background:linear-gradient(170deg,#241f19,#171410); padding:52px 16px 16px; display:grid; gap:10px; }
.app-head { margin:0 0 4px; font-size:13px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.app-head span { color:var(--amber); }
.dish {
  display:grid; grid-template-columns:auto 1fr auto; gap:12px; align-items:center;
  padding:12px; border-radius:16px; background:rgba(243,236,223,.05); border:1px solid var(--line);
}
.dish-thumb { width:44px; height:44px; display:grid; place-items:center; border-radius:12px; background:rgba(233,161,59,.12); font-size:22px; }
.dish-thumb.ai { font-size:13px; font-weight:700; color:var(--amber); border:1px solid var(--amber); background:transparent; }
.dish strong { display:block; font-size:14px; }
.dish small { color:var(--muted); font-size:11.5px; }
.dish-ai { border-color:rgba(233,161,59,.4); background:var(--amber-soft); }
.price { font-weight:600; font-size:14px; color:var(--amber); }
.app-cta { margin-top:4px; padding:14px; border-radius:14px; background:var(--amber); color:#191307; font-weight:700; font-size:14px; text-align:center; }
.scan-hint { display:flex; align-items:center; gap:12px; margin:0; color:var(--muted); font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
.qr {
  width:26px; height:26px; border-radius:6px;
  background:
    linear-gradient(var(--amber),var(--amber)) 2px 2px/8px 8px no-repeat,
    linear-gradient(var(--amber),var(--amber)) 16px 2px/8px 8px no-repeat,
    linear-gradient(var(--amber),var(--amber)) 2px 16px/8px 8px no-repeat,
    linear-gradient(var(--amber),var(--amber)) 16px 16px/4px 4px no-repeat,
    rgba(243,236,223,.08);
  border:1px solid var(--line);
}

.strip { padding:22px 28px; border-block:1px solid var(--line); text-align:center; }
.strip p { margin:0; color:var(--muted); font-size:14px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; }

.benefits,.steps { padding:110px 0; }
.section-head { display:grid; gap:18px; margin-bottom:56px; max-width:760px; }
.kicker { margin:0; color:var(--amber); font-size:13px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; }
.cards { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.card {
  padding:30px 26px 34px; border-radius:22px; background:var(--panel);
  border:1px solid var(--line); display:grid; gap:14px; align-content:start;
  transition:transform .25s ease, border-color .25s ease, background .25s ease;
}
.card:hover { transform:translateY(-6px); border-color:rgba(233,161,59,.45); background:var(--panel-2); }
.card-num { font-family:"Fraunces",Georgia,serif; font-size:15px; color:var(--amber); }
.card h3 { margin:6px 0 0; font-size:21px; font-weight:600; line-height:1.15; }
.card p { margin:0; color:var(--muted); font-size:15px; }

.steps-list { margin:0; padding:0; list-style:none; display:grid; gap:0; border-top:1px solid var(--line); }
.steps-list li { display:grid; grid-template-columns:88px 1fr; gap:28px; align-items:start; padding:34px 0; border-bottom:1px solid var(--line); }
.steps-list li>span {
  width:56px; height:56px; display:grid; place-items:center; border-radius:50%;
  border:1px solid var(--amber); color:var(--amber);
  font-family:"Fraunces",Georgia,serif; font-size:22px;
}
.steps-list strong { display:block; font-size:clamp(20px,2vw,26px); font-weight:600; margin-bottom:6px; }
.steps-list p { margin:0; max-width:640px; color:var(--muted); font-size:16px; }

.contact { padding:40px 0 110px; }
.contact-inner {
  padding:clamp(44px,6vw,84px); border-radius:32px; text-align:center;
  background:linear-gradient(160deg,#241d13,#171310 60%);
  border:1px solid rgba(233,161,59,.3); display:grid; justify-items:center; gap:20px;
}
.contact-lead { max-width:520px; margin:0; color:var(--muted); font-size:17px; }
.contact-box {
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:28px;
  margin-top:16px; padding-top:30px; border-top:1px solid var(--line); width:min(640px,100%);
}
.contact-box span { display:block; color:var(--muted); font-size:13px; margin-bottom:4px; }
.contact-box a:not(.button) { font-family:"Fraunces",Georgia,serif; font-size:clamp(20px,2.4vw,28px); text-decoration:none; color:var(--text); }
.contact-box a:not(.button):hover { color:var(--amber); }

footer { min-height:88px; display:flex; align-items:center; justify-content:space-between; color:var(--muted); font-size:12px; letter-spacing:.1em; text-transform:uppercase; border-top:1px solid var(--line); }

@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; transition:none!important; } }
@media (max-width:1020px) {
  .cards { grid-template-columns:repeat(2,1fr); }
  .hero { grid-template-columns:1fr; gap:64px; padding-top:40px; }
  .hero-phone { justify-items:start; }
  .phone { transform:rotate(0); }
}
@media (max-width:640px) {
  .site-header,.hero,.strip,.benefits,.steps,.contact,footer { width:calc(100% - 36px); }
  .site-header { min-height:84px; }
  .header-nav a:not(.nav-cta) { display:none; }
  .hero-facts { flex-wrap:wrap; gap:22px; }
  .cards { grid-template-columns:1fr; }
  .benefits,.steps { padding:72px 0; }
  .steps-list li { grid-template-columns:1fr; gap:14px; }
  .actions { width:100%; }
  .button,.button-ghost { width:100%; }
  .contact-box { flex-direction:column; }
}