/* Foodie marketing — Ember Cinema (не net-menu / не teal) */
:root{
  --bg:#080605;
  --bg2:#120E0B;
  --panel:#1A1410;
  --ink:#F6EFE6;
  --muted:rgba(246,239,230,.66);
  --soft:rgba(246,239,230,.42);
  --line:rgba(255,107,42,.16);
  --ember:#FF6B2A;
  --ember2:#FF9A5C;
  --ember-deep:#C2410C;
  --gold:#E8B86D;
  --grad:linear-gradient(120deg,#FF9A5C 0%,#FF6B2A 45%,#C2410C 100%);
  --font:"Manrope",system-ui,sans-serif;
  --display:"Bricolage Grotesque","Manrope",system-ui,sans-serif;
  --radius:12px;
  --shadow:0 40px 80px -36px rgba(0,0,0,.85);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:92px}
body{
  font-family:var(--font);background:var(--bg);color:var(--ink);
  line-height:1.55;-webkit-font-smoothing:antialiased;min-height:100vh;
  background-image:
    radial-gradient(1200px 600px at 85% -10%, rgba(255,107,42,.12), transparent 55%),
    radial-gradient(800px 500px at -10% 40%, rgba(232,184,109,.06), transparent 50%);
}
img{max-width:100%;display:block}
a{color:var(--ember2);text-decoration:none}
a:hover{color:#FFC9A8}
.container{width:min(1140px,100% - 40px);margin-inline:auto}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:16px;z-index:200;background:#fff;color:#000;padding:10px 14px;border-radius:8px}

/* Header */
.mh{
  position:fixed;inset:0 0 auto;z-index:50;height:78px;
  display:flex;align-items:center;
  background:transparent;border-bottom:1px solid transparent;
  transition:background .3s,border-color .3s,backdrop-filter .3s
}
.mh.is-solid{
  background:rgba(8,6,5,.82);backdrop-filter:blur(16px) saturate(140%);
  border-bottom-color:var(--line)
}
.mh-in{display:flex;align-items:center;justify-content:space-between;gap:16px;width:min(1140px,100% - 40px);margin-inline:auto}
.mh-logo{
  font-family:var(--display);font-weight:700;font-size:1.45rem;letter-spacing:-.04em;
  color:var(--ink);display:inline-flex;align-items:center;gap:12px
}
.mh-logo i{
  width:34px;height:34px;border-radius:8px;display:grid;place-items:center;
  background:var(--grad);color:#fff;font-size:.9rem;box-shadow:0 8px 24px -8px rgba(255,107,42,.7)
}
.mh-nav{display:flex;gap:26px;align-items:center}
.mh-nav a{color:var(--muted);font-weight:600;font-size:.9rem;letter-spacing:.01em}
.mh-nav a:hover{color:var(--ink)}
.mh-cta{display:flex;align-items:center;gap:10px}
.mh-burger{
  display:none;width:42px;height:42px;border-radius:10px;border:1px solid var(--line);
  background:rgba(255,255,255,.03);color:var(--ink);cursor:pointer;font-size:1.05rem
}
.mh-mm{
  display:none;position:fixed;inset:78px 0 auto;z-index:49;
  background:rgba(8,6,5,.96);border-bottom:1px solid var(--line);
  padding:10px 20px 18px;flex-direction:column;gap:2px
}
.mh-mm.open{display:flex}
.mh-mm a{padding:14px 10px;color:var(--ink);font-weight:700;border-radius:10px}
.mh-mm a:hover{background:rgba(255,107,42,.12);color:var(--ember2)}

/* Buttons — не pills как у net-menu */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:14px 24px;border-radius:10px;font-weight:700;font-size:.98rem;
  border:1px solid transparent;cursor:pointer;
  transition:transform .15s,box-shadow .2s,background .2s,border-color .2s;
  text-decoration:none;white-space:nowrap;letter-spacing:-.01em
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{
  background:var(--grad);color:#fff;
  box-shadow:0 16px 36px -12px rgba(255,107,42,.55)
}
.btn-primary:hover{color:#fff}
.btn-ghost{
  background:rgba(255,255,255,.04);border-color:rgba(246,239,230,.16);color:var(--ink)
}
.btn-ghost:hover{background:rgba(255,255,255,.08);border-color:rgba(255,107,42,.35);color:#fff}

/* Hero — full-bleed cinema */
.hero{
  position:relative;min-height:100dvh;display:flex;align-items:flex-end;
  padding:130px 0 80px;overflow:hidden
}
.hero__media{
  position:absolute;inset:-4%;z-index:0;
  background:#1a100c center/cover no-repeat;
  transform:scale(1.08);
  animation:heroDrift 28s ease-in-out infinite alternate;
  will-change:transform
}
.hero__media::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.22;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:overlay
}
.hero__media::after{
  content:"";position:absolute;inset:0;z-index:2;
  background:
    linear-gradient(105deg, rgba(8,6,5,.94) 0%, rgba(8,6,5,.78) 38%, rgba(8,6,5,.28) 68%, rgba(8,6,5,.55) 100%),
    linear-gradient(180deg, rgba(8,6,5,.5) 0%, transparent 32%, rgba(8,6,5,.88) 100%);
}
@keyframes heroDrift{
  from{transform:scale(1.08) translate3d(0,0,0)}
  to{transform:scale(1.16) translate3d(-1.5%,1%,0)}
}
.hero__inner{position:relative;z-index:3;width:min(1140px,100% - 40px);margin-inline:auto}
.hero__brand{
  font-family:var(--display);font-weight:800;font-size:clamp(3rem,9vw,5.6rem);
  letter-spacing:-.055em;line-height:.88;margin-bottom:22px
}
.hero__brand span{
  display:block;font-size:.28em;font-weight:700;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ember2);margin-bottom:14px
}
.hero h1{
  font-family:var(--display);font-weight:700;letter-spacing:-.035em;
  font-size:clamp(1.45rem,3.2vw,2.15rem);max-width:16ch;line-height:1.18;margin-bottom:16px
}
.hero__lead{max-width:36ch;color:var(--muted);font-size:1.06rem;margin-bottom:30px}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:18px}
.hero__note{color:var(--soft);font-size:.9rem;letter-spacing:.01em}
.hero__scroll{
  position:absolute;left:50%;bottom:24px;transform:translateX(-50%);z-index:3;
  width:26px;height:42px;border:1px solid rgba(246,239,230,.22);border-radius:14px;
  display:grid;place-items:center
}
.hero__scroll span{
  width:3px;height:9px;border-radius:3px;background:var(--ember);
  animation:pulse 1.7s ease-in-out infinite
}
@keyframes pulse{0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(9px)}}

/* Sections */
.sec{padding:96px 0;position:relative}
.sec--soft{background:linear-gradient(180deg,var(--bg2),var(--bg))}
.sec--ink{
  background:
    radial-gradient(900px 420px at 90% 10%, rgba(255,107,42,.16), transparent 58%),
    var(--bg2)
}
.stitle{
  font-family:var(--display);font-weight:800;letter-spacing:-.04em;
  font-size:clamp(1.85rem,4vw,2.75rem);line-height:1.08;margin-bottom:14px
}
.stitle .grad{
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent
}
.ssub{color:var(--muted);max-width:44ch;margin-bottom:40px;font-size:1.05rem}

.metrics{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  border:1px solid var(--line);border-radius:14px;overflow:hidden;
  background:rgba(255,255,255,.02)
}
.metric{
  padding:28px 22px;border-right:1px solid var(--line)
}
.metric:last-child{border-right:0}
.metric strong{
  display:block;font-family:var(--display);font-size:clamp(1.7rem,3.2vw,2.35rem);
  font-weight:800;color:var(--ember2);letter-spacing:-.04em;line-height:1
}
.metric span{display:block;margin-top:8px;color:var(--soft);font-size:.9rem;font-weight:600}

.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.feat,.why > div,.bene > div,.quote,.demo,.step{
  padding:28px 24px;border:1px solid var(--line);border-radius:var(--radius);
  background:linear-gradient(160deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
  transition:border-color .2s, transform .2s
}
.feat:hover,.demo:hover{border-color:rgba(255,154,92,.4);transform:translateY(-3px)}
.feat h3,.why h3,.bene h3,.step h3,.demo h3,.quote strong{
  font-family:var(--display);font-size:1.22rem;margin-bottom:10px;letter-spacing:-.03em
}
.feat p,.why p,.bene p,.step p,.demo p,.quote p{color:var(--muted);font-size:.98rem}
.why,.bene{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.step__n{
  font-family:var(--display);font-weight:800;font-size:2.4rem;color:var(--ember);
  letter-spacing:-.06em;margin-bottom:6px;line-height:1;opacity:.95
}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.quote{display:flex;flex-direction:column;gap:18px}
.quote footer{display:flex;align-items:center;gap:12px;margin-top:auto}
.quote__av{
  width:40px;height:40px;border-radius:10px;background:var(--grad);
  display:grid;place-items:center;font-weight:800;font-family:var(--display)
}
.quote footer span{display:block;color:var(--soft);font-size:.85rem}
.demos{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.demo{color:inherit}
.demo span{display:inline-block;margin-top:16px;color:var(--ember2);font-weight:800;font-size:.92rem}

.demo-creds{
  margin:0 0 22px;padding:22px 22px 18px;border-radius:var(--radius);
  border:1px solid rgba(255,154,92,.28);
  background:
    radial-gradient(600px 180px at 10% 0%, rgba(255,107,42,.16), transparent 55%),
    rgba(255,255,255,.03)
}
.demo-creds__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 16px;margin-bottom:16px}
.demo-creds__head strong{
  font-family:var(--display);font-size:1.15rem;letter-spacing:-.03em
}
.demo-creds__head span{color:var(--soft);font-size:.9rem;font-weight:600}
.demo-creds__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.demo-cred{
  display:flex;flex-direction:column;gap:6px;padding:14px 14px 12px;
  border-radius:10px;border:1px solid var(--line);background:rgba(0,0,0,.22)
}
.demo-cred__role{
  color:var(--ember2);font-weight:800;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase
}
.demo-cred code{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.92rem;color:var(--ink);word-break:break-all
}
.demo-cred__hint{color:var(--soft);font-size:.85rem;font-weight:600}
.price-band__note{color:var(--muted);margin-top:6px;font-weight:600}

.price-band{
  text-align:center;padding:48px 32px;border-radius:18px;border:1px solid var(--line);
  background:
    radial-gradient(700px 300px at 50% -10%, rgba(255,107,42,.22), transparent 60%),
    rgba(255,255,255,.025);
  box-shadow:var(--shadow)
}
.price-band__tag{
  display:inline-flex;padding:8px 14px;border-radius:8px;margin-bottom:18px;
  background:rgba(255,107,42,.12);border:1px solid rgba(255,107,42,.22);
  color:var(--ember2);font-weight:800;font-size:.82rem;letter-spacing:.04em;text-transform:uppercase
}
.price-band .old{color:var(--soft);text-decoration:line-through;margin-right:14px;font-size:1.15rem}
.price-band .now{
  font-family:var(--display);font-size:clamp(2.6rem,7vw,3.8rem);font-weight:800;
  letter-spacing:-.05em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent
}
.price-band__list{
  list-style:none;max-width:460px;margin:24px auto 30px;text-align:left;display:grid;gap:11px
}
.price-band__list li{position:relative;padding-left:28px;color:var(--muted);font-weight:500}
.price-band__list li::before{
  content:"";position:absolute;left:0;top:.55em;width:13px;height:13px;border-radius:3px;
  background:var(--grad);box-shadow:0 0 0 3px rgba(255,107,42,.15)
}
.price-band__cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}

.faq{display:grid;gap:10px}
.faq-item{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:rgba(255,255,255,.02)}
.faq-q{
  width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:18px 20px;background:transparent;border:0;color:var(--ink);font:inherit;
  font-weight:800;text-align:left;cursor:pointer;font-family:var(--display);letter-spacing:-.02em
}
.faq-q i{color:var(--ember2);transition:transform .2s}
.faq-item.open .faq-q i{transform:rotate(45deg)}
.faq-a{display:none;padding:0 20px 18px}
.faq-item.open .faq-a{display:block}
.faq-a p{color:var(--muted)}

.contact-band{
  text-align:center;padding:56px 28px;border-radius:18px;border:1px solid var(--line);
  background:
    linear-gradient(135deg, rgba(255,107,42,.1), transparent 50%),
    rgba(255,255,255,.02)
}
.contact-band .ssub{margin-inline:auto}

.mf{
  border-top:1px solid var(--line);padding:32px 0 110px;color:var(--soft);font-size:.9rem
}
.mf-in{display:flex;flex-wrap:wrap;gap:18px;justify-content:space-between;align-items:flex-start}
.mf a{color:var(--muted)}
.mf a:hover{color:var(--ember2)}
.mf nav{display:flex;flex-wrap:wrap;gap:12px 18px}

.mobile-cta{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:40;
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  background:rgba(8,6,5,.92);backdrop-filter:blur(14px);border-top:1px solid var(--line)
}
.mobile-cta .btn{width:100%}

.reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .hero__media{animation:none}
  .hero__scroll span{animation:none}
}

/* Legal */
.legal-wrap{padding:120px 0 80px}
.legal-card{
  max-width:820px;margin:0 auto;padding:40px 30px;border:1px solid var(--line);
  border-radius:16px;background:rgba(255,255,255,.03)
}
.legal-card h1{
  font-family:var(--display);font-size:clamp(1.7rem,3vw,2.3rem);letter-spacing:-.04em;margin-bottom:8px
}
.legal-card .meta{color:var(--soft);margin-bottom:28px;font-size:.92rem}
.legal-card h2{font-family:var(--display);font-size:1.2rem;margin:28px 0 10px;letter-spacing:-.03em}
.legal-card p,.legal-card li{color:var(--muted);margin-bottom:10px}
.legal-card ul{padding-left:1.2em;margin-bottom:12px}
.legal-card a{color:var(--ember2)}

@media (max-width:900px){
  .mh-nav{display:none}
  .mh-burger{display:inline-grid;place-items:center}
  .metrics{grid-template-columns:1fr 1fr}
  .metric:nth-child(2){border-right:0}
  .metric:nth-child(1),.metric:nth-child(2){border-bottom:1px solid var(--line)}
  .grid-2,.why,.bene,.quotes,.demos,.steps,.demo-creds__grid{grid-template-columns:1fr}
  .hero{align-items:flex-end;min-height:94dvh}
  .hero__media::after{
    background:
      linear-gradient(180deg, rgba(8,6,5,.4) 0%, rgba(8,6,5,.45) 35%, rgba(8,6,5,.94) 100%);
  }
  .mobile-cta{display:block}
  .mf{padding-bottom:120px}
}
@media (max-width:560px){
  .mh-cta .btn-ghost{display:none}
  .price-band{padding:36px 18px}
}
