:root{
  --bg:#080604;
  --ink:#f7efe2;
  --muted:#d7c7ad;
  --gold:#d9a640;
  --gold-2:#ffcf77;
  --dark-card:rgba(10,7,4,.66);
  --glass:rgba(255,246,226,.88);
  --line:rgba(218,166,64,.38);
  --shadow:0 30px 80px rgba(0,0,0,.58);
  --radius:32px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  color:var(--ink);
  background:var(--bg);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed; inset:0;
  background:
    radial-gradient(circle at 24% 22%, rgba(255,189,85,.26), transparent 28%),
    radial-gradient(circle at 82% 16%, rgba(218,166,64,.2), transparent 26%),
    linear-gradient(120deg, rgba(0,0,0,.92), rgba(0,0,0,.5) 45%, rgba(0,0,0,.88));
  z-index:-2;
}
.scene-bg{
  position:fixed; inset:-3vh -3vw;
  background-image:
    linear-gradient(90deg, rgba(0,0,0,.86), rgba(0,0,0,.45) 48%, rgba(0,0,0,.82)),
    url('../img/hero-bg.jpg');
  background-size:cover;
  background-position:center;
  filter:saturate(1.06) contrast(1.05);
  z-index:-3;
  animation:cinemaPan 18s ease-in-out infinite alternate;
}
.grain{
  pointer-events:none;
  position:fixed; inset:0;
  opacity:.16;
  mix-blend-mode:screen;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
  z-index:4;
}
.light-orb{
  position:fixed;
  border-radius:999px;
  filter:blur(25px);
  opacity:.28;
  pointer-events:none;
  background:radial-gradient(circle, var(--gold-2), rgba(217,166,64,.05) 70%, transparent);
  z-index:-1;
  animation:floatGlow 8s ease-in-out infinite alternate;
}
.orb-one{width:260px;height:260px;left:-80px;top:8vh}
.orb-two{width:330px;height:330px;right:-120px;bottom:10vh;animation-delay:1.5s}
.page-shell{
  min-height:calc(100vh - 58px);
  display:grid;
  place-items:center;
  padding:clamp(22px,4vw,60px);
}
.hero{
  width:min(1180px,100%);
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(360px,.98fr);
  gap:clamp(26px,4vw,68px);
  align-items:center;
}
.hero-copy{
  position:relative;
  padding:clamp(24px,4vw,50px);
  border:1px solid rgba(255,232,177,.16);
  background:linear-gradient(145deg, rgba(4,3,2,.75), rgba(14,10,5,.52));
  box-shadow:var(--shadow);
  border-radius:var(--radius);
  backdrop-filter:blur(14px);
  isolation:isolate;
  overflow:hidden;
}
.hero-copy::before{
  content:"";
  position:absolute; inset:1px;
  border-radius:calc(var(--radius) - 1px);
  background:
    linear-gradient(125deg, rgba(255,215,141,.18), transparent 32%, rgba(255,255,255,.06) 50%, transparent 72%),
    radial-gradient(circle at 80% 10%, rgba(217,166,64,.2), transparent 34%);
  z-index:-1;
}
.hero-copy::after{
  content:"";
  position:absolute;
  width:210px;height:210px;right:-80px;top:-80px;
  border:1px solid rgba(217,166,64,.4);
  border-radius:50%;
  opacity:.35;
}
.monogram-wrap{
  width:clamp(74px,10vw,110px);
  aspect-ratio:1;
  display:grid;
  place-items:center;
  border-radius:24px;
  background:var(--glass);
  box-shadow:0 18px 45px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.42);
  margin-bottom:22px;
}
.monogram{max-width:72%;max-height:72%;display:block}
.overline{
  margin:0 0 16px;
  color:var(--gold-2);
  letter-spacing:.18em;
  text-transform:uppercase;
  font-size:.78rem;
  font-weight:800;
}
.brand-plate{
  width:min(470px,100%);
  padding:clamp(14px,2vw,20px) clamp(18px,2.6vw,28px);
  background:linear-gradient(135deg, rgba(255,248,235,.96), rgba(245,228,198,.88));
  border-radius:26px;
  box-shadow:0 16px 60px rgba(0,0,0,.34), 0 0 0 1px rgba(255,255,255,.28) inset;
}
.brand-logo{display:block;width:100%;height:auto}
.tagline{
  margin:22px 0 0;
  font-family:Georgia, 'Times New Roman', serif;
  color:var(--gold-2);
  font-size:clamp(1.35rem,2.4vw,2.1rem);
  line-height:1.15;
}
h1{
  margin:18px 0 0;
  font-family:Georgia, 'Times New Roman', serif;
  font-size:clamp(2.7rem,7vw,6.6rem);
  line-height:.92;
  letter-spacing:.05em;
  text-transform:uppercase;
  text-wrap:balance;
}
h1 span:first-child{display:block;color:var(--ink)}
h1 span:last-child{display:block;color:var(--gold);text-shadow:0 0 30px rgba(217,166,64,.22)}
.intro{
  max-width:610px;
  margin:22px 0 26px;
  color:rgba(247,239,226,.82);
  font-size:clamp(1rem,1.25vw,1.12rem);
  line-height:1.7;
}
.signup-card{
  display:block;
  width:100%;
  max-width:680px;
  padding:14px;
  border-radius:26px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,232,177,.18);
}
.form-row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
}
input[type="email"]{
  width:100%;
  min-height:58px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(8,6,4,.74);
  color:var(--ink);
  border-radius:18px;
  padding:0 18px;
  font-size:1rem;
  outline:none;
  transition:border-color .2s, box-shadow .2s, background .2s;
}
input[type="email"]::placeholder{color:rgba(247,239,226,.54)}
input[type="email"]:focus{
  border-color:rgba(255,207,119,.72);
  box-shadow:0 0 0 4px rgba(217,166,64,.16);
  background:rgba(0,0,0,.72);
}
button{
  min-height:58px;
  border:0;
  border-radius:18px;
  padding:0 24px;
  cursor:pointer;
  color:#130d05;
  font-weight:900;
  letter-spacing:.03em;
  background:linear-gradient(135deg, #ffe2a2, #d9a640 58%, #b98122);
  box-shadow:0 18px 36px rgba(217,166,64,.24);
  transition:transform .2s, filter .2s, opacity .2s;
}
button:hover{transform:translateY(-1px);filter:saturate(1.05) brightness(1.03)}
button:disabled{opacity:.68;cursor:wait;transform:none}
.consent{
  display:flex;
  gap:10px;
  align-items:flex-start;
  margin:14px 4px 0;
  color:rgba(247,239,226,.72);
  font-size:.88rem;
  line-height:1.45;
}
.consent input{margin-top:3px;accent-color:var(--gold)}
a{color:var(--gold-2)}
.microcopy{
  margin:10px 4px 0;
  color:rgba(247,239,226,.52);
  font-size:.82rem;
}
.form-message{
  min-height:0;
  margin:12px 4px 0;
  font-weight:700;
  line-height:1.45;
}
.form-message.success{color:#ffe0a0}
.form-message.error{color:#ffb2a8}
.hp-field{position:absolute;left:-9999px;opacity:0;width:1px;height:1px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.food-stage{
  min-height:min(72vh,760px);
  position:relative;
  display:grid;
  place-items:center;
}
.food-stage::before{
  content:"";
  position:absolute;
  inset:8% 0 4% 5%;
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,198,102,.28), transparent 60%);
  filter:blur(22px);
}
.food-card{
  position:absolute;
  overflow:hidden;
  border-radius:32px;
  background:#160f09;
  border:1px solid rgba(255,232,177,.17);
  box-shadow:0 34px 70px rgba(0,0,0,.55);
  transform:rotate(var(--rot));
  animation:cardFloat 7s ease-in-out infinite alternate;
}
.food-card::before{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg, transparent 45%, rgba(0,0,0,.72));
  z-index:1;
}
.food-card img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(1.03) contrast(1.04)}
.food-card span{
  position:absolute;left:18px;bottom:16px;z-index:2;
  font-family:Georgia, 'Times New Roman', serif;
  color:#ffe0a0;
  font-size:clamp(1rem,1.6vw,1.35rem);
  letter-spacing:.03em;
}
.card-lasagna{--rot:-4deg;width:min(58%,370px);aspect-ratio:1;left:0;top:8%;animation-delay:.2s}
.card-gnocchi{--rot:3.5deg;width:min(67%,435px);aspect-ratio:1;right:0;top:28%;animation-delay:1.2s}
.card-crocche{--rot:-2deg;width:min(52%,330px);aspect-ratio:1;left:14%;bottom:3%;animation-delay:2.1s}
.site-footer{
  min-height:58px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  padding:0 clamp(22px,4vw,60px) 22px;
  color:rgba(247,239,226,.58);
  font-size:.9rem;
}
.reveal{opacity:0;transform:translateY(18px);animation:reveal .9s ease forwards}
.reveal-delay{animation-delay:.18s}
@keyframes reveal{to{opacity:1;transform:translateY(0)}}
@keyframes cinemaPan{from{transform:scale(1.02) translate3d(-.7%,0,0)}to{transform:scale(1.07) translate3d(.7%,-.5%,0)}}
@keyframes floatGlow{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(20px,-18px,0) scale(1.08)}}
@keyframes cardFloat{from{transform:translateY(0) rotate(var(--rot))}to{transform:translateY(-12px) rotate(var(--rot))}}
@media (max-width:960px){
  .hero{grid-template-columns:1fr;gap:28px}
  .food-stage{min-height:560px;order:-1}
  .hero-copy{padding:26px}
  .brand-plate{width:min(420px,100%)}
  .site-footer{flex-direction:column;align-items:flex-start}
}
@media (max-width:620px){
  .page-shell{padding:16px 14px 30px}
  .scene-bg{background-image:linear-gradient(180deg, rgba(0,0,0,.84), rgba(0,0,0,.5) 44%, rgba(0,0,0,.9)), url('../img/hero-blur.jpg')}
  .hero-copy{border-radius:24px;padding:22px}
  .monogram-wrap{width:76px;border-radius:20px}
  .form-row{grid-template-columns:1fr}
  button{width:100%}
  .food-stage{min-height:480px}
  .card-lasagna{width:64%;left:0;top:0}
  .card-gnocchi{width:70%;right:0;top:28%}
  .card-crocche{width:58%;left:7%;bottom:0}
  .site-footer{padding:0 18px 22px;font-size:.82rem}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition:none!important}
}