/* ============================================================
   DE GIANI FOODS — base: variables, reset, tipografía, layout
   ============================================================ */
:root{
  --black: #000000;
  --navy: #0a0a18;
  --bg-1: #050509;
  --bg-2: #0a0a18;
  --orange: #e8673a;
  --orange-soft: #f0895c;
  --orange-dim: rgba(232,103,58,.35);
  --white: #ffffff;
  --w-100: rgba(255,255,255,1);
  --w-85: rgba(255,255,255,.85);
  --w-60: rgba(255,255,255,.60);
  --w-40: rgba(255,255,255,.40);
  --w-20: rgba(255,255,255,.16);
  --w-10: rgba(255,255,255,.08);
  --glass-bg: rgba(255,255,255,.05);
  --glass-bg-strong: rgba(255,255,255,.08);
  --glass-border: rgba(255,255,255,.10);
  --serif: Georgia, 'Times New Roman', Times, serif;
  --sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace;
  --ease: cubic-bezier(0.2, 0.9, 0.3, 1);

  /* Radios reutilizados por varios componentes (mismo valor exacto en cada uso) */
  --radius-pill: 999px;
  --radius-lg: 16px;
  --radius-md: 14px;
  --radius-sm: 12px;
  --radius-xs: 10px;
  --radius-2xs: 8px;

  /* Espaciado estructural reutilizado por el layout de secciones */
  --space-section-y: 120px;
  --space-section-y-sm: 80px;
  --space-wrap-x: 28px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background: radial-gradient(ellipse at 50% 0%, var(--bg-2) 0%, var(--bg-1) 55%, var(--black) 100%);
  color: var(--w-85);
  font-family: var(--sans);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}
input,textarea,select{font-family:inherit;}

/* ---------- typography helpers ---------- */
.kicker{
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color: var(--orange-soft);
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.kicker::before{content:'';width:22px;height:1px;background:var(--orange);display:inline-block;}
h1,h2,h3{font-family:var(--serif);font-weight:400;color:var(--w-100);margin:0;}
h1{font-size:clamp(2.6rem,6vw,4.6rem);line-height:1.04;letter-spacing:-.01em;}
h2{font-size:clamp(2rem,4.2vw,3.1rem);line-height:1.08;}
h3{font-size:1.3rem;}
em, .accent{font-style:italic;color:var(--orange-soft);}
p{color:var(--w-60);}
.sub{color:var(--w-60);font-size:1.02rem;max-width:52ch;}
.mono{font-family:var(--mono);}

/* ---------- layout scaffolding ---------- */
.wrap{max-width:1180px;margin:0 auto;padding:0 var(--space-wrap-x);}
section{position:relative;padding:var(--space-section-y) 0;}
@media (max-width:900px){ section{padding:var(--space-section-y-sm) 0;} }

/* ---------- glass card ---------- */
.glass{
  background:var(--glass-bg);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  border:1px solid var(--glass-border);
  border-radius:18px;
  transition: transform .5s var(--ease), box-shadow .5s var(--ease), border-color .5s var(--ease), background .5s var(--ease);
}
.glass:hover{
  transform:translateY(-5px);
  border-color:var(--orange-dim);
  box-shadow:0 24px 48px -12px rgba(0,0,0,.55), 0 0 0 1px rgba(232,103,58,.12);
  background:var(--glass-bg-strong);
}

/* ---------- scroll reveal ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease), transform .9s var(--ease);}
.reveal.in-view{opacity:1;transform:translateY(0);}
.reveal-stagger .reveal:nth-child(1){transition-delay:.02s;}
.reveal-stagger .reveal:nth-child(2){transition-delay:.09s;}
.reveal-stagger .reveal:nth-child(3){transition-delay:.16s;}
.reveal-stagger .reveal:nth-child(4){transition-delay:.23s;}
.reveal-stagger .reveal:nth-child(5){transition-delay:.30s;}
.reveal-stagger .reveal:nth-child(6){transition-delay:.37s;}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:9px;
  padding:14px 26px;border-radius:var(--radius-pill);
  font-family:var(--mono);font-size:.82rem;letter-spacing:.04em;
  border:1px solid var(--glass-border);
  transition: all .4s var(--ease);
  white-space:nowrap;
}
.btn-primary{
  background:linear-gradient(135deg, var(--orange-soft), var(--orange));
  color:#1a0d06;font-weight:600;border:none;
  box-shadow:0 8px 24px -6px rgba(232,103,58,.55);
}
.btn-primary:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 14px 34px -6px rgba(232,103,58,.75);}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none !important;box-shadow:none !important;}
.btn-ghost{
  background:var(--glass-bg);color:var(--w-85);
  backdrop-filter:blur(12px);
}
.btn-ghost:hover{border-color:var(--orange-dim);background:var(--glass-bg-strong);transform:translateY(-3px);}
.btn-sm{padding:9px 16px;border-radius:var(--radius-pill);font-family:var(--mono);font-size:.74rem;border:1px solid var(--glass-border);background:var(--glass-bg);color:var(--w-85);transition:all .3s var(--ease);}
.btn-sm:hover{border-color:var(--orange-dim);background:var(--glass-bg-strong);}
.btn-save{background:linear-gradient(135deg,var(--orange-soft),var(--orange));color:#1a0d06;font-weight:600;border:none;}
.btn-danger{background:rgba(200,70,50,.18);color:#ffb3a0;border:1px solid rgba(200,70,50,.35);}
.btn-secondary{background:var(--glass-bg-strong);color:var(--w-85);}

/* ============ SECTION HEADERS ============ */
.section-head{max-width:640px;margin-bottom:56px;}
.section-head h2{margin-top:16px;}
.section-head .sub{margin-top:14px;}