
@font-face{
  font-family:'Respaldo Cinzel G';
  src:local('Georgia'), local('Georgia Regular');
  size-adjust:106.2%; ascent-override:92%; descent-override:36%; line-gap-override:0%;
}
@font-face{
  font-family:'Respaldo Cinzel T';
  src:local('Times New Roman'), local('TimesNewRomanPSMT'),
      local('Liberation Serif'), local('Tinos');
  size-adjust:107.6%; ascent-override:90%; descent-override:34%; line-gap-override:0%;
}
@font-face{
  font-family:'Respaldo Cinzel N';
  src:local('Noto Serif'), local('Droid Serif');
  size-adjust:108.6%; ascent-override:89%; descent-override:35%; line-gap-override:0%;
}

:root{

  --bg:          #1C0705;
  --bg-2:        #260A07;
  --surface:     #34100A;
  --surface-2:   #46170E;
  --line:        rgba(245,232,216,.11);
  --line-strong: rgba(245,232,216,.22);

  --text:        #F5E8D8;
  --text-2:      #D6C3AC;
  --muted:       #97836D;

  --accent:      #E0713A;
  --accent-2:    #F09455;
  --accent-deep: #A94B1E;
  --on-accent:   #1C0705;
  --glow:        rgba(224,113,58,.34);
  --glow-soft:   rgba(224,113,58,.12);

  --vidrio:        linear-gradient(165deg,rgba(245,232,216,.09),rgba(245,232,216,.03));
  --vidrio-fuerte: linear-gradient(165deg,rgba(245,232,216,.16),rgba(245,232,216,.05));
  --campo-bg:      rgba(16,5,4,.55);

  --font:  'Inter', ui-sans-serif, system-ui, sans-serif;
  --serif: 'Instrument Serif', Georgia, serif;
  --tracking-h: -.018em;
  --radius:      10px;
  --radius-sm:   6px;
  --radius-pill: 100px;

  --sh-depth: 0 10px 38px rgba(0,0,0,.72);
  --sh-lit:   0 0 24px rgba(224,113,58,.30);
  --sh-hover: 0 0 22px rgba(240,148,85,.78), 0 0 54px rgba(224,113,58,.30);
  --sh-suave: 0 2px 14px rgba(0,0,0,.62);
  --sombra-panel: 0 40px 90px -58px rgba(0,0,0,.95);

  --grano-op: .055;

  --vineta: radial-gradient(108% 92% at 50% 44%, transparent 62%, rgba(14,3,2,.58) 100%);
}

.bg-static{
  background:
    radial-gradient(58% 46% at 62% 30%, #6E2109, transparent 70%),
    radial-gradient(70% 58% at 34% 96%, #0E0403, transparent 74%),
    var(--bg);
}

.h1, .h2, .h3{
  font-family:'Cinzel', 'Respaldo Cinzel G', 'Respaldo Cinzel T', 'Respaldo Cinzel N', var(--serif), Georgia, serif;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.045em;
  font-feature-settings:'liga' 0;
  font-variant-numeric:lining-nums;
}
.h1{ font-size:clamp(1.9rem,4.3vw,4.1rem); line-height:1.12; max-width:15em }
.h2{ font-size:clamp(1.55rem,3.4vw,2.9rem); line-height:1.16; max-width:16em }
.h3{ font-size:clamp(1.05rem,1.7vw,1.35rem); letter-spacing:.06em; font-weight:600 }
.h1 em, .h2 em, .h3 em{
  font-family:inherit;
  font-style:normal;
  font-weight:700;
  letter-spacing:.045em;
  color:#FFCE8C;
}
.eyebrow{ letter-spacing:.22em }

.hero--brasal{ min-height:100svh; display:flex; align-items:center; position:relative }
.hero--brasal .hero__inner{ position:relative; z-index:3; max-width:44rem }

.hero--brasal .h1{ margin-bottom:clamp(1.4rem,3vw,2.2rem) }
.hero--brasal .hero__lead{ max-width:38ch; color:var(--text-2) }

.hero--brasal .h1{ letter-spacing:-.025em }
.hero__lead.destella{ --dest-base:var(--text-2); --dest-luz:#FFB06B; animation-duration:8s }
.hero__acciones{ display:flex; flex-wrap:wrap; gap:.9rem; margin-top:clamp(1.8rem,4vw,2.6rem) }

.hero__foto{ position:absolute; inset:0; z-index:1; overflow:hidden }
.hero__foto img{ width:100%; height:100%; object-fit:cover; opacity:.40 }

.hero__foto--fuego img{ opacity:.74 }

.hf__brasa{ position:absolute; inset:0; pointer-events:none; z-index:2 }

.hf__subida{
  position:absolute; left:0; right:0; top:0; height:200%;
  animation:hfSubir 2.5s cubic-bezier(.46,.03,.24,1) .55s both;
}
@keyframes hfSubir{
  from{ transform:translate3d(0,-50%,0) }
  to  { transform:translate3d(0,0,0) }
}
.hf__pane{ position:absolute; left:0; right:0; height:50%; overflow:hidden }
.hf__pane--mesa { top:0 }
.hf__pane--brasa{ top:50% }

.hf__pane--brasa img{ opacity:1 }

.hf__filo{
  position:absolute; left:-3%; right:-3%; top:50%; height:13%;
  transform:translate3d(0,-50%,0); z-index:2; pointer-events:none;
  background:linear-gradient(180deg,
    rgba(255,120,30,0) 0%,
    rgba(255,140,45,.34) 34%,
    rgba(255,205,140,.70) 50%,
    rgba(230,90,20,.30) 66%,
    rgba(255,120,30,0) 100%);
}

.hf__brasa{
  background:radial-gradient(44% 50% at 64% 62%,
    rgba(255,196,120,.60) 0%,
    rgba(255,124,38,.30) 38%,
    rgba(200,60,10,.10) 58%,
    transparent 74%);
  transform-origin:64% 62%;
  animation:hfBrasa 2.6s cubic-bezier(.22,.61,.36,1) 1.15s both;
}
@keyframes hfBrasa{
  from{ opacity:0; transform:scale(.28) }
  to  { opacity:1; transform:scale(1) }
}

.hf__chispas{ position:absolute; inset:0; z-index:2; pointer-events:none; display:none }
@media (min-width:861px) and (hover:hover){
  .hf__chispas{ display:block }
}
.hf__chispas i{
  position:absolute; left:var(--x); bottom:-2%;
  width:3px; height:3px; border-radius:50%;
  background:#FFB765;
  box-shadow:0 0 6px 2px rgba(255,150,60,.55);
  opacity:0;
  animation:hfChispa var(--t) linear var(--d) infinite;
}

@keyframes hfChispa{
  0%   { opacity:0;  transform:translate3d(0,0,0) scale(.6) }
  12%  { opacity:.9 }
  70%  { opacity:.55 }

  100% { opacity:0;  transform:translate3d(26px,-680px,0) scale(.25) }
}

@media (prefers-reduced-motion: reduce){

  .hf__subida{ animation:none; transform:translate3d(0,0,0) }
  .hf__brasa{ animation:none; opacity:1; transform:none }
  .hf__chispas{ display:none }
}
.hero__foto::after{
  content:''; position:absolute; inset:0;
  background:
    linear-gradient(90deg,var(--bg) 2%,rgba(28,7,5,.82) 32%,rgba(28,7,5,.14) 100%),
    linear-gradient(0deg,var(--bg) 1%,transparent 26%);
}

.formatos{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(.9rem,2vw,1.5rem) }
@media (max-width:860px){ .formatos{ grid-template-columns:1fr } }
.formato{
  position:relative; overflow:hidden;
  border:1px solid var(--line); border-radius:var(--radius);
  background:var(--vidrio);
  transition:transform .55s var(--ease), border-color .45s var(--ease),
             box-shadow .55s var(--ease);
}

.formato::before{
  content:''; position:absolute; inset:0 0 auto; height:2px; z-index:2;
  background:linear-gradient(90deg, transparent, var(--accent) 22%, #FFC58A 50%, var(--accent) 78%, transparent);
  transform:scaleX(0); transform-origin:0 50%;
  transition:transform .7s var(--ease);
}
@media (hover:hover){
  .formato:hover{
    transform:translateY(-6px);
    border-color:var(--line-strong);
    box-shadow:0 30px 70px -40px rgba(0,0,0,.9), 0 0 0 1px rgba(224,113,58,.18);
  }
  .formato:hover::before{ transform:scaleX(1) }

  .formato:hover .formato__foto img{ transform:scale(1.09) rotate(-1.4deg); opacity:1 }
  .formato:hover .formato__ord{ opacity:.9; transform:translateY(0) }
}
.formato__foto{ position:relative; aspect-ratio:3/2; overflow:hidden }
.formato__foto img{
  width:100%; height:100%; object-fit:cover; opacity:.85;
  transition:transform 1.1s var(--ease), opacity .6s var(--ease);
}

.formato__ord{
  position:absolute; z-index:2; left:.9rem; bottom:.5rem;
  font-family:var(--serif); font-size:clamp(2.2rem,4.4vw,3.2rem);
  line-height:1; color:#F5E8D8; opacity:.42;
  transform:translateY(8px);
  transition:opacity .5s var(--ease), transform .5s var(--ease);
  text-shadow:0 4px 22px rgba(0,0,0,.8);
  pointer-events:none;
}
.formato__txt{ padding:clamp(1.2rem,2.6vw,1.8rem) }

.formato h3{ margin:0 0 .6rem; font-size:clamp(1.25rem,2.2vw,1.6rem) }
.formato p{ margin:0; color:var(--text-2); font-size:.95rem; line-height:1.6 }

.formato__desde{
  display:inline-block; margin-top:1rem;
  padding:.34rem .7rem;
  font-size:.78rem; letter-spacing:.06em; color:var(--accent-2);
  border:1px solid rgba(224,113,58,.3); border-radius:100px;
  background:rgba(224,113,58,.07);
}

.simple__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.4rem,3vw,2.6rem) }
@media (max-width:860px){ .simple__grid{ grid-template-columns:1fr } }
.simple__paso b{
  display:block; font-family:var(--serif); font-size:clamp(2.4rem,5vw,3.4rem);
  line-height:1; color:var(--accent); font-weight:400; margin-bottom:.6rem;
}

.simple__paso h3{
  margin:0 0 .5rem;
  font-family:'Cinzel', 'Respaldo Cinzel G', 'Respaldo Cinzel T', 'Respaldo Cinzel N', var(--serif), Georgia, serif;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:1rem;
  line-height:1.3;
}
.simple__paso p{ margin:0; color:var(--text-2); line-height:1.65 }

.cifras{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(.8rem,2vw,1.4rem) }
@media (max-width:760px){ .cifras{ grid-template-columns:repeat(2,1fr) } }
.cifra{
  padding:clamp(1.1rem,2.4vw,1.7rem); text-align:center;
  border:1px solid var(--line); border-radius:var(--radius); background:var(--vidrio);
}
.cifra b{
  display:block; font-family:var(--serif); font-weight:400;
  font-size:clamp(2.2rem,5vw,3.4rem); line-height:1; color:var(--accent-2);
}
.cifra span{ display:block; margin-top:.5rem; font-size:.78rem; color:var(--muted); letter-spacing:.04em }

.carta{ display:grid; gap:.2rem; margin-top:clamp(1.6rem,3vw,2.4rem) }
.carta__fila{
  display:flex; align-items:baseline; gap:.9rem;
  padding:.95rem 0; border-bottom:1px solid var(--line);
}
.carta__fila b{ font-family:var(--serif); font-weight:400; font-size:1.18rem; white-space:nowrap }
.carta__fila i{ flex:1; border-bottom:1px dotted var(--line-strong); transform:translateY(-.25em) }
.carta__fila span{ color:var(--text-2); font-size:.92rem; white-space:nowrap }
@media (max-width:640px){
  .carta__fila{ flex-wrap:wrap; gap:.35rem }
  .carta__fila i{ display:none }
  .carta__fila span{ width:100%; color:var(--muted) }
}

.process__grid{
  display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr);
  gap:clamp(2.5rem,6vw,5.5rem); align-items:start;
}
.process__aside{
  position:sticky;
  top:calc(var(--header-h) + clamp(2rem,7vh,5rem));
}
@media (max-width:900px){
  .process__grid{ grid-template-columns:1fr; gap:clamp(1.6rem,5vw,2.4rem) }
  .process__aside{ position:static }
}

.equipo__grid{
  display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:clamp(1.8rem,4vw,3.4rem); align-items:center;
}
@media (max-width:900px){ .equipo__grid{ grid-template-columns:minmax(0,1fr) } }
.equipo__foto{
  position:relative; border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--sombra-panel);
}
.equipo__foto img{ width:100%; height:auto; display:block }

.cocina__quien{
  margin-top:clamp(2.4rem,5vw,4rem);
  display:grid;
  grid-template-columns:minmax(0,.78fr) minmax(0,1fr) minmax(0,1.22fr);
  gap:clamp(1.2rem,2.6vw,2.2rem);
  align-items:end;
}
.cocina__txt h3{ margin-bottom:1rem }
.cocina__txt p{ color:var(--text-2); line-height:1.7 }
.cocina__txt p + p{ margin-top:1.05rem }

.cocina__foto{
  margin:0; position:relative; overflow:hidden;
  border-radius:var(--radius);
  box-shadow:var(--sombra-panel);
}
.cocina__foto img{ display:block; width:100%; height:auto }

.cocina__foto figcaption{
  position:absolute; inset:auto 0 0 0;
  padding:1.8rem 1.1rem .8rem;
  background:linear-gradient(180deg,transparent,rgba(28,7,5,.62) 42%,rgba(28,7,5,.95));
  font-size:.85rem; letter-spacing:.02em; color:var(--text);
}

@media (max-width:900px){
  .cocina__quien{ grid-template-columns:minmax(0,1fr); gap:clamp(1rem,4vw,1.6rem) }
}

.banda--brasa{
  position:relative; overflow:hidden; border-block:1px solid var(--line);
  height:clamp(240px,42vh,460px);
}
.banda--brasa img{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover; opacity:.55;
}
.banda--brasa .banda__frase{
  position:absolute; inset:auto 0 0 0; padding:clamp(1.4rem,4vw,3rem);
  background:linear-gradient(180deg,transparent,rgba(28,7,5,.9));
  font-family:var(--serif); font-size:clamp(1.4rem,3.6vw,2.6rem);
  line-height:1.15; max-width:22ch;
}

@media (max-width:760px){
  .hero__foto{ -webkit-mask-image:none; mask-image:none }
  .hero__foto img{ opacity:.26 }

  .hf__pane--brasa img{ opacity:1 }

  .hero--brasal .hero__lead{ max-width:30ch }
}

.reflejo{
  --rf-1: var(--text);
  --rf-2: var(--accent);
  --rf-3: #FFCE8C;
  --rf-luz: 6s;
}

.simple__paso{ position:relative }
.simple__paso b{
  position:relative; z-index:1;
  font-size:clamp(3.2rem,7.5vw,5.2rem);
  background-image:linear-gradient(178deg,
    #FFE0A3 0%, #FFCE8C 22%, #E0713A 62%, #A94B1E 100%);
  -webkit-background-clip:text; background-clip:text;
  color:transparent;
}
.simple__paso::before{
  content:''; position:absolute; z-index:0; pointer-events:none;
  left:-.35em; top:-.30em; width:2.6em; height:2.6em;
  font-size:clamp(3.2rem,7.5vw,5.2rem);
  border-radius:50%;
  background:radial-gradient(circle at 50% 55%,
    rgba(255,180,90,.34) 0%,
    rgba(224,113,58,.20) 38%,
    transparent 68%);
  transform:scale(.9);
  animation:brasaLatir 4.6s ease-in-out infinite;
}
.simple__paso:nth-child(2)::before{ animation-delay:-1.5s }
.simple__paso:nth-child(3)::before{ animation-delay:-3.1s }
@keyframes brasaLatir{
  0%, 100%{ transform:scale(.9);  opacity:.75 }
  50%     { transform:scale(1.07); opacity:1 }
}

.banda--brasa .banda__frase{
  font-size:clamp(2rem,5.6vw,4.4rem);
  line-height:1.02; max-width:none; width:100%;
  letter-spacing:-.02em;
  padding:clamp(2rem,6vw,4.2rem) clamp(1.4rem,4vw,3rem);
  background:linear-gradient(180deg,
    transparent 0%, rgba(28,7,5,.42) 22%, rgba(28,7,5,.74) 52%, rgba(28,7,5,.94) 100%);
}
.banda--brasa .banda__frase{
  --rf-1:#FFF0DC;
  --rf-2:#FF8A3D;
  --rf-3:#FFCE8C;
  --rf-luz:5.2s;
}

.banda--brasa .banda__frase{ position:absolute; z-index:2; isolation:isolate }
.banda--brasa .banda__frase::before,
.banda--brasa .banda__frase::after{
  content:''; position:absolute; z-index:-1; pointer-events:none;
  left:0; right:0; bottom:0; height:88%;
  background:radial-gradient(52% 100% at 22% 100%,
    rgba(255,138,61,.50) 0%, rgba(224,113,58,.22) 44%, transparent 74%);
  transform-origin:50% 100%;
  animation:llama 6.5s ease-in-out infinite;
  mix-blend-mode:screen;
}
.banda--brasa .banda__frase::after{
  background:radial-gradient(40% 100% at 58% 100%,
    rgba(255,206,140,.40) 0%, rgba(255,138,61,.16) 48%, transparent 76%);
  animation-duration:4.9s; animation-delay:-2.2s;
}
@media (prefers-reduced-motion:reduce){
  .simple__paso::before,
  .banda--brasa .banda__frase::before,
  .banda--brasa .banda__frase::after{ animation:none }
}

.tarjeta__foto{
  margin:calc(clamp(1.4rem,2.6vw,2rem) * -1);
  margin-bottom:clamp(1.1rem,2.2vw,1.5rem);
  border-radius:var(--radius) var(--radius) 0 0;
  overflow:hidden;
  background:var(--surface);
}
.tarjeta__foto img{
  display:block; width:100%; height:auto;
  aspect-ratio:16/9; object-fit:cover;
}

.tarjeta__foto + .tarjeta__num{ margin-top:0 }
