
:root {
  --fondo: #f3efe4;
  --fondo-2: #e9e3d3;
  --texto: #141a16;
  --tinta: #141a16;
  --verde: #1e3b2b;
  --cereza: #9b2335;
  --arandano: #3b4a7a;
  --humo: rgba(20, 26, 22, .62);
  --tenue: rgba(20, 26, 22, .36);
  --linea: rgba(20, 26, 22, .16);
  --mono: 'IBM Plex Mono', ui-monospace, monospace;
  --acento: #9b2335;
  --acento-tinta: #f3efe4;
  --fuente-titulos: 'Bricolage Grotesque', 'Arial Narrow', sans-serif;
  --fuente-texto: 'IBM Plex Sans', system-ui, sans-serif;
  --margen: clamp(1.25rem, 5vw, 5rem);
  --ds-fondo: var(--fondo);
  --ds-texto: var(--tinta);
  --ds-suave: var(--humo);
  --ds-tenue: var(--tenue);
  --ds-tarjeta: #faf7f0;
  --ds-linea: rgba(20, 26, 22, .1);
  --ds-borde: rgba(20, 26, 22, .16);
  --ds-encima: rgba(20, 26, 22, .05);
  --ds-relieve: rgba(20, 26, 22, .06);
  --ds-luz: rgba(255, 255, 255, .9);
  --ds-disco: var(--verde);
  --ds-disco-tinta: var(--fondo);
  --ds-nodo: #ebe5d6;
  --ds-mapa: #efe9db;
  --ds-m-punto: rgba(20, 26, 22, .12);
  --ds-m-calle: rgba(20, 26, 22, .08);
  --ds-m-agua: rgba(59, 74, 122, .2);
  --ds-m-cerro: rgba(30, 59, 43, .14);
  --ds-m-falta: rgba(20, 26, 22, .3);
  --ds-ok: var(--verde);
  --ds-ok-fondo: rgba(30, 59, 43, .12);
  --ds-sombra: none;
  --ds-alzada: 0 10px 24px -12px rgba(20, 26, 22, .3);
}


body.hs { font-size: 1rem; }
.hs ::selection { background: var(--cereza); color: var(--fondo); }


.hs::before {
  content: ""; position: fixed; inset: 0; z-index: 80; pointer-events: none; opacity: .5; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .95 0 0 0 0 .93 0 0 0 0 .88 0 0 0 .18 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)'/%3E%3C/svg%3E");
}
.hs img, .hs video { filter: saturate(.84) contrast(1.06) brightness(1.02); }


.hs h1, .hs h2, .hs h3, .hs-pie__gran, .hs-fruta__nombres { font-family: var(--fuente-titulos); font-variation-settings: "wdth" 76, "opsz" 96; font-weight: 700; letter-spacing: -.01em; text-transform: uppercase; }
.hs h2 { font-size: clamp(2.6rem, 6vw, 6rem); line-height: .92; }
.hs-indice { font-family: var(--mono); font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: var(--cereza); margin-bottom: 1.2rem; }
.hs-linea { display: block; overflow: hidden; }
.hs-linea > span { display: block; }
.hs dt { font-family: var(--mono); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: var(--humo); }
.hs dd { margin: 0; }
.hs small { font-size: .78em; color: var(--humo); }


.hs-cabecera { position: fixed; inset: 0 0 auto 0; z-index: 50; }
.hs-nav { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 2rem; padding: 1rem var(--margen); color: var(--fondo); transition: color .4s, background .4s, border-color .4s; border-bottom: 1px solid transparent; }
.hs-nav.is-oscuro { color: var(--tinta); background: rgba(243, 239, 228, .86); backdrop-filter: blur(10px); border-color: var(--linea); }
.hs-nav__marca { font-family: var(--fuente-titulos); font-variation-settings: "wdth" 76; font-weight: 700; text-transform: uppercase; font-size: 1.35rem; text-decoration: none; letter-spacing: .02em; }
.hs-nav__temporada { font-family: var(--mono); font-size: .76rem; letter-spacing: .04em; text-transform: uppercase; opacity: .85; }
.hs-nav__temporada span { opacity: .7; }
.hs-nav__lista { display: flex; gap: 1.6rem; font-size: .9rem; }
.hs-nav__lista a { text-decoration: none; border-bottom: 1px solid transparent; transition: border-color .3s; }
.hs-nav__lista a:hover { border-color: currentColor; }
.hs-nav__movil { display: none; }


.hs-hero { min-height: 100svh; display: grid; grid-template-rows: 1fr auto; color: var(--fondo); isolation: isolate; overflow: hidden; }
.hs-hero__fondo { position: absolute; inset: 0; z-index: -1; margin: 0; background: var(--verde); }
.hs-hero__video { width: 100%; height: 100%; object-fit: cover; }
.hs-hero__fondo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20, 26, 22, .45) 0%, rgba(30, 59, 43, .15) 45%, rgba(20, 26, 22, .7) 100%); }
.hs-hero__cuerpo { padding: 28vh var(--margen) 3rem; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 2rem 4rem; }
.hs-hero__sobre { grid-column: 1 / -1; font-family: var(--mono); font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; opacity: .85; }
.hs-hero__sobre span { text-transform: none; letter-spacing: 0; opacity: .75; }
.hs-hero__titulo { font-size: clamp(3.4rem, 10.5vw, 10.5rem); line-height: .86; }
.hs-hero__datos { display: grid; gap: .9rem; font-size: .92rem; border-left: 1px solid rgba(243, 239, 228, .35); padding-left: 1.4rem; min-width: 15rem; }
.hs-hero__datos dt { color: rgba(243, 239, 228, .7); }
.hs-hero__datos small { color: rgba(243, 239, 228, .6); }
.hs-marquee { border-top: 1px solid rgba(243, 239, 228, .3); padding: .9rem 0; overflow: hidden; white-space: nowrap; font-family: var(--fuente-titulos); font-variation-settings: "wdth" 76; font-weight: 600; text-transform: uppercase; font-size: clamp(1rem, 1.6vw, 1.4rem); letter-spacing: .04em; }
.hs-marquee__cinta { display: inline-flex; animation: hs-marquee 36s linear infinite; }
.hs-marquee__cinta span { padding-right: .6em; }
@keyframes hs-marquee { to { transform: translateX(-50%); } }


.hs-fruta { background: var(--fondo); }
.hs-fruta__pin { min-height: 100svh; display: grid; align-items: center; padding: 0 var(--margen); }
.hs-fruta__rejilla { display: grid; grid-template-columns: repeat(12, 1fr); gap: 2rem; align-items: center; width: 100%; padding: 6rem 0; }
.hs-fruta__indice { grid-column: 1 / span 6; }
.hs-fruta__nombres { display: grid; gap: .1em; font-size: clamp(3rem, 7.4vw, 7.6rem); line-height: .9; margin-bottom: 2.2rem; }
.hs-fruta__nombres button { background: none; border: 0; padding: 0; font: inherit; letter-spacing: inherit; text-transform: inherit; text-align: left; color: transparent; -webkit-text-stroke: 1px var(--tenue); transition: color .5s, -webkit-text-stroke-color .5s; }
.hs-fruta__nombres .is-activa button { color: var(--tinta); -webkit-text-stroke-color: var(--tinta); }
.hs-fruta__nombres button:hover { -webkit-text-stroke-color: var(--tinta); }
.hs-fruta__datos { position: relative; min-height: 11rem; max-width: 30rem; }
.hs-datos { position: absolute; inset: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 2rem; align-content: start; opacity: 0; transform: translateY(10px); transition: opacity .5s, transform .5s; pointer-events: none; }
.hs-datos.is-activa { opacity: 1; transform: none; pointer-events: auto; }
.hs-datos div { border-top: 1px solid var(--linea); padding-top: .6rem; }
.hs-fruta__nota { font-size: .8rem; color: var(--humo); margin-top: 1.4rem; }
.hs-fruta__fotos { grid-column: 7 / span 6; position: relative; aspect-ratio: 4 / 5; max-height: 78vh; justify-self: end; width: 100%; }
.hs-fruta__foto { position: absolute; inset: 0; margin: 0; clip-path: inset(0 0 100% 0); }
.hs-fruta__foto.is-activa { clip-path: inset(0 0 0 0); }
.hs-fruta__foto img { width: 100%; height: 100%; object-fit: cover; }
.hs-fruta__foto figcaption { position: absolute; left: 0; bottom: 0; font-family: var(--mono); font-size: .74rem; background: var(--tinta); color: var(--fondo); padding: .4rem .7rem; }


.hs-calendario { padding: clamp(5rem, 10vh, 8rem) var(--margen); background: var(--fondo-2); border-top: 1px solid var(--linea); }
.hs-calendario__cabeza { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 3rem; align-items: end; margin-bottom: 3.5rem; }
.hs-calendario__cabeza .hs-indice { grid-column: 1 / -1; margin-bottom: 0; }
.hs-calendario__nota { color: var(--humo); max-width: 36ch; padding-bottom: .5rem; }
.hs-tabla { position: relative; --cols: 7; font-family: var(--mono); font-size: .8rem; }
.hs-tabla__meses, .hs-tabla__fila { display: grid; grid-template-columns: 9rem repeat(var(--cols), 1fr); align-items: center; }
.hs-tabla__meses { text-transform: uppercase; letter-spacing: .06em; color: var(--humo); padding-bottom: .6rem; border-bottom: 1px solid var(--tinta); }
.hs-tabla__meses span:not(:first-child) { border-left: 1px solid var(--linea); padding-left: .6rem; }
.hs-tabla__fila { height: 4.6rem; border-bottom: 1px solid var(--linea); position: relative; }
.hs-tabla__fruta { font-family: var(--fuente-texto); font-size: 1rem; }
.hs-barra { grid-column: calc(var(--desde) + 1) / calc(var(--hasta) + 1); height: 2.2rem; display: flex; align-items: center; padding: 0 .8rem; color: var(--fondo); transform-origin: left; overflow: hidden; }
.hs-barra i { font-style: normal; white-space: nowrap; font-size: .74rem; }
.hs-barra--cereza { background: var(--cereza); margin-left: 50%; }
.hs-barra--arandano { background: var(--arandano); }
.hs-barra--uva { background: var(--verde); }
.hs-tabla__hoy { position: absolute; top: 0; bottom: 0; left: calc(9rem + (100% - 9rem) * var(--mes) / var(--cols)); border-left: 1px dashed var(--cereza); pointer-events: none; }
.hs-tabla__hoy span { position: absolute; top: -1.4rem; left: .3rem; color: var(--cereza); text-transform: uppercase; letter-spacing: .06em; }
.hs-calendario__cifras { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; margin-top: 4rem; }
.hs-calendario__cifras div { border-top: 1px solid var(--tinta); padding-top: .8rem; display: grid; gap: .3rem; }
.hs-calendario__cifras b { font-family: var(--fuente-titulos); font-variation-settings: "wdth" 76; font-weight: 700; font-size: clamp(2.2rem, 4vw, 3.8rem); line-height: 1; }
.hs-calendario__cifras span { font-size: .86rem; color: var(--humo); }


.hs-traza { padding-bottom: clamp(5rem, 10vh, 8rem); }
.hs-traza__gran { margin: 0; position: relative; height: clamp(70vh, 56vw, 100vh); overflow: hidden; color: var(--fondo); }
.hs-traza__gran img { width: 100%; height: 120%; object-fit: cover; margin-top: -10%; }
.hs-traza__gran::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20, 26, 22, .2), rgba(20, 26, 22, .7)); }
.hs-traza__gran figcaption { position: absolute; left: var(--margen); right: var(--margen); bottom: clamp(2rem, 6vh, 5rem); z-index: 1; }
.hs-traza__gran .hs-indice { color: var(--fondo); opacity: .8; }
.hs-traza__gran h2 { font-size: clamp(2.8rem, 8vw, 8rem); }
.hs-pasos { display: grid; grid-template-columns: repeat(12, 1fr); gap: 3rem 2rem; padding: clamp(4rem, 8vh, 6rem) var(--margen) 0; counter-reset: paso; }
.hs-paso { display: grid; grid-template-columns: 1fr 1.3fr; gap: 1.4rem; align-items: end; }
.hs-paso:nth-child(1) { grid-column: 1 / span 5; }
.hs-paso:nth-child(2) { grid-column: 7 / span 6; margin-top: 10vh; }
.hs-paso:nth-child(3) { grid-column: 2 / span 5; }
.hs-paso:nth-child(4) { grid-column: 8 / span 5; margin-top: 8vh; }
.hs-paso figure { margin: 0; aspect-ratio: 3 / 4; overflow: hidden; }
.hs-paso img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.22, 1, .36, 1); }
.hs-paso:hover img { transform: scale(1.05); }
.hs-paso__n { font-family: var(--mono); font-size: .76rem; color: var(--cereza); display: block; margin-bottom: .6rem; }
.hs-paso h3 { font-size: clamp(1.6rem, 2.4vw, 2.4rem); line-height: .95; margin-bottom: .8rem; }
.hs-paso p { color: var(--humo); font-size: .95rem; max-width: 34ch; }


.hs-seg { padding: clamp(5rem, 10vh, 8rem) var(--margen); background: var(--fondo-2); border-top: 1px solid var(--linea); }
.hs-seg__cabeza { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 3rem; align-items: end; margin-bottom: 3rem; }
.hs-seg__cabeza .hs-indice { grid-column: 1 / -1; margin-bottom: 0; }
.hs-seg__nota { color: var(--humo); max-width: 36ch; padding-bottom: .5rem; }
.hs-seg .ds-despacho { width: 100%; max-width: none; border-radius: 6px; }
.hs-seg .ds-llegada-titulo { font-family: var(--fuente-titulos); font-variation-settings: "wdth" 80; font-weight: 700; text-transform: uppercase; letter-spacing: 0; }
.hs-seg__demo { margin-top: 1rem; font-size: .8rem; color: var(--humo); }


.hs-pie { background: var(--verde); color: var(--fondo); overflow: hidden; }
.hs-pie .hs-indice { color: rgba(243, 239, 228, .7); }
.hs-pie__cuerpo { display: grid; grid-template-columns: 7fr 5fr; gap: 3rem; padding: clamp(5rem, 10vh, 8rem) var(--margen) 4rem; }
.hs-pie__parrafo { margin-top: 1.6rem; max-width: 40ch; color: rgba(243, 239, 228, .78); }
.hs-pie__datos { display: grid; gap: 1.4rem; align-self: end; }
.hs-pie__datos div { border-top: 1px solid rgba(243, 239, 228, .3); padding-top: .7rem; }
.hs-pie__datos dt { color: rgba(243, 239, 228, .6); }
.hs-pie__datos dd { display: grid; }
.hs-pie__datos small { color: rgba(243, 239, 228, .55); }
.hs-pie__gran { font-size: clamp(4rem, 17.5vw, 17.5rem); line-height: .8; padding: 0 var(--margen); white-space: nowrap; color: transparent; -webkit-text-stroke: 1px rgba(243, 239, 228, .5); margin-bottom: -.1em; }
.hs-pie__fin { padding: 2rem var(--margen) 1.4rem; font-family: var(--mono); font-size: .76rem; color: rgba(243, 239, 228, .7); display: flex; flex-wrap: wrap; justify-content: space-between; gap: .4rem 1.5rem; }
.hs-pie__moxen a { color: var(--fondo); }


@media (max-width: 899px) {
  .hs-nav { grid-template-columns: 1fr auto; gap: 1rem; }
  .hs-nav__temporada, .hs-nav__lista { display: none; }
  .hs-nav__movil { display: inline-block; font-size: .86rem; text-decoration: none; border: 1px solid currentColor; padding: .4rem .9rem; }
  .hs-hero__cuerpo { grid-template-columns: 1fr; padding-top: 22vh; gap: 2rem; }
  .hs-hero__titulo { font-size: clamp(3.4rem, 17vw, 6.4rem); }
  .hs-hero__datos { grid-template-columns: 1fr 1fr; border-left: 0; padding-left: 0; border-top: 1px solid rgba(243, 239, 228, .35); padding-top: 1rem; }
  .hs-fruta__pin { min-height: 0; padding-top: 5rem; }
  .hs-fruta__rejilla { grid-template-columns: 1fr; padding: 0 0 4rem; gap: 2rem; }
  .hs-fruta__indice, .hs-fruta__fotos { grid-column: 1; }
  .hs-fruta__fotos { aspect-ratio: 4 / 5; max-height: none; position: relative; }
  .hs-fruta__nombres { font-size: clamp(2.8rem, 14vw, 4.6rem); }
  .hs-calendario__cabeza, .hs-seg__cabeza, .hs-pie__cuerpo { grid-template-columns: 1fr; }
  .hs-tabla { font-size: .7rem; }
  .hs-tabla__meses, .hs-tabla__fila { grid-template-columns: 5.4rem repeat(var(--cols), 1fr); }
  .hs-tabla__hoy { left: calc(5.4rem + (100% - 5.4rem) * var(--mes) / var(--cols)); }
  .hs-tabla__fruta { font-size: .86rem; }
  .hs-barra { padding: 0 .4rem; }
  .hs-barra i { font-size: .62rem; }
  .hs-calendario__cifras { grid-template-columns: 1fr 1fr; gap: 1.5rem; }
  .hs-pasos { grid-template-columns: 1fr; gap: 3rem; }
  .hs-paso { grid-column: 1 !important; margin-top: 0 !important; }
  .hs-paso:nth-child(even) { grid-template-columns: 1.3fr 1fr; }
  .hs-paso:nth-child(even) figure { order: 2; }
  .hs-pie__gran { font-size: 20vw; }
}
@media (prefers-reduced-motion: reduce) {
  .hs-marquee__cinta { animation: none; }
  .hs-datos, .hs-fruta__nombres button { transition: none; }
}



