/* ============================================================
   De Cecco — Homepage + page-hero sections
   ============================================================ */

/* ---- Signature hero ---- */
.hero{ position:relative; min-height:100svh; display:flex; align-items:flex-end;
  background:var(--blue-deep); color:#fff; isolation:isolate; overflow:hidden; }
.hero__poster,#hero-gl{ position:absolute; inset:0; width:100%; height:100%; }
.hero__poster{ object-fit:cover; z-index:0;
  background:
    radial-gradient(120% 90% at 78% 12%, rgba(229,178,75,.32), transparent 52%),
    radial-gradient(90% 80% at 8% 92%, rgba(18,58,133,.85), transparent 60%),
    linear-gradient(160deg, #06183C 0%, #0A2A66 55%, #06183C 100%); }
#hero-gl{ z-index:1; opacity:.9; }
.hero__veil{ position:absolute; inset:0; z-index:2;
  background:linear-gradient(180deg, rgba(6,24,60,.25) 0%, transparent 30%, rgba(6,24,60,.55) 100%); }
.hero__inner{ position:relative; z-index:3; padding:8rem 0 clamp(3rem,2rem + 4vw,6rem); width:100%; }
.hero__eyebrow{ display:inline-flex; align-items:center; gap:.7rem; font:600 .78rem/1 var(--sans);
  letter-spacing:.22em; text-transform:uppercase; color:var(--gold); margin-bottom:1.6rem; }
.hero__eyebrow::before{ content:""; width:34px; height:2px; background:var(--gold); }
.hero h1{ color:#fff; font-size:clamp(2.8rem,1.4rem + 6vw,6.6rem); font-weight:400;
  line-height:.98; max-width:16ch; margin-bottom:1.4rem; }
.hero h1 em{ font-style:italic; color:var(--gold); }
.hero__sub{ font-size:clamp(1.05rem,.95rem + .7vw,1.45rem); color:#dbe4f6; max-width:52ch;
  font-family:var(--serif); margin-bottom:2rem; }
.hero__cta{ display:flex; flex-wrap:wrap; gap:1rem; align-items:center; }
.hero__scroll{ position:absolute; left:50%; bottom:1.6rem; transform:translateX(-50%); z-index:3;
  font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:#aebbd8; display:flex;
  flex-direction:column; align-items:center; gap:.5rem; }
.hero__scroll::after{ content:""; width:1px; height:38px; background:linear-gradient(var(--gold),transparent);
  animation:scrolldrop 2s infinite; }
@keyframes scrolldrop{ 0%{ transform:scaleY(0); transform-origin:top; } 50%{ transform:scaleY(1); transform-origin:top; }
  51%{ transform:scaleY(1); transform-origin:bottom; } 100%{ transform:scaleY(0); transform-origin:bottom; } }
.split-char{ display:inline-block; }

/* ---- Intro / value ---- */
.intro-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(2rem,5vw,6rem); align-items:center; }
.intro-figure{ position:relative; }
.intro-figure .imgph{ aspect-ratio:4/5; }
.intro-figure .floating-no{ position:absolute; bottom:-1.4rem; right:-1.4rem; background:var(--paper);
  border:1px solid var(--line); border-radius:var(--radius-lg); padding:1rem 1.4rem; box-shadow:var(--shadow-lg);
  font-family:var(--serif); }
.floating-no strong{ display:block; font-size:2.4rem; color:var(--red); line-height:1; }
.floating-no span{ font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft); }

/* ---- Method (pinned scrub) ---- */
.method{ background:var(--blue-deep); color:#fff; position:relative; overflow:hidden; }
.method__head{ max-width:60ch; margin-bottom:3rem; }
.method-steps{ display:grid; gap:1.2rem; }
.method-step{ display:grid; grid-template-columns:auto 1fr; gap:1.5rem; align-items:start;
  padding:1.6rem 0; border-top:1px solid rgba(255,255,255,.14); }
.method-step__n{ font-family:var(--serif); font-style:italic; font-size:1.6rem; color:var(--gold); }
.method-step h3{ color:#fff; margin-bottom:.4rem; }
.method-step p{ color:#bcc8e4; margin:0; }

/* ---- Range cards ---- */
.range-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
.range-card{ position:relative; display:flex; flex-direction:column; min-height:260px; background:#fff;
  border:1px solid var(--line); border-radius:var(--radius-lg); padding:1.6rem; overflow:hidden;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease); }
.range-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg,transparent,rgba(229,178,75,.7),transparent); }
.range-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.range-card .rc-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:1rem; }
.range-card h3{ font-size:1.35rem; margin:.2rem 0; }
.range-card p{ color:var(--ink-soft); font-size:.95rem; flex:1; }
.range-card .rc-arrow{ font-weight:700; color:var(--red); margin-top:.8rem; display:inline-flex; gap:.4rem;
  transition:gap .25s; }
.range-card:hover .rc-arrow{ gap:.9rem; }

/* ---- Heritage band ---- */
.heritage{ position:relative; background:var(--cream); overflow:hidden; }
.timeline-mini{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; margin-top:2.5rem; }
.tl-item{ position:relative; padding-top:1.5rem; border-top:2px solid var(--gold); }
.tl-item .yr{ font-family:var(--serif); font-size:1.8rem; color:var(--blue); display:block; line-height:1; }
.tl-item p{ font-size:.9rem; color:var(--ink-soft); margin:.5rem 0 0; }

/* ---- Recipes teaser ---- */
.recipe-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
.recipe-card{ position:relative; border-radius:var(--radius-lg); overflow:hidden; min-height:320px;
  display:flex; align-items:flex-end; color:#fff; isolation:isolate; }
.recipe-card .imgph{ position:absolute; inset:0; border-radius:0; z-index:-2; aspect-ratio:auto; }
.recipe-card::after{ content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg,transparent 30%, rgba(6,24,60,.85)); }
.recipe-card__body{ padding:1.4rem; }
.recipe-card h3{ color:#fff; font-size:1.25rem; margin:.3rem 0; }
.recipe-card .meta{ font-size:.8rem; color:var(--gold); letter-spacing:.05em; text-transform:uppercase; }

/* ---- CTA band ---- */
.cta-band{ position:relative; background:var(--blue); color:#fff; text-align:center; overflow:hidden; isolation:isolate; }
.cta-band::before{ content:""; position:absolute; inset:0; z-index:-1; opacity:.5;
  background:radial-gradient(60% 120% at 50% 0%, rgba(229,178,75,.3), transparent 60%); }
.cta-band h2{ color:#fff; max-width:18ch; margin-inline:auto; }
.cta-band .lede{ color:#d6e0f5; max-width:55ch; margin-inline:auto; }

/* trust logos row */
.trust-row{ display:flex; flex-wrap:wrap; gap:1.5rem 2.5rem; align-items:center; justify-content:center; }
.trust-row .pill{ font-size:.85rem; }

@media (max-width:820px){
  .intro-grid{ grid-template-columns:1fr; }
  .range-grid,.recipe-grid{ grid-template-columns:1fr; }
  .timeline-mini{ grid-template-columns:1fr 1fr; }
  .hero{ min-height:92svh; }
}