/* =========================================================
   Cheri Cheri · ajustes de paridad con el template Da Maria
   Se carga después del <style> de cada página.
   ========================================================= */

/* ---------- Tipografía global ----------
   El template no usa PT Sans: etiquetas y botones van en Playfair itálica,
   el texto corrido en Bitter 300. Redefinir --pt cambia todos los usos de una vez. */
:root{--pt:'Playfair Display',Georgia,serif;--zk:'Zodiak','Playfair Display',Georgia,serif}

/* ---------- Hoja y marco rojo ---------- */
body{padding:32px}
.sheet{max-width:1440px;padding:11px 67px 32px}
/* marco de 3px a 24px de los costados y 48px de arriba; termina en el footer */
.sheet::after{content:"";position:absolute;left:24px;right:24px;top:48px;bottom:260px;border:3px solid var(--red);border-bottom:0;pointer-events:none;z-index:0}
footer{background:var(--paper);margin-top:80px}
/* el marco baja hasta la mitad del footer y dobla hacia la caja, como en el template */
footer::before,footer::after{content:"";position:absolute;top:-60px;bottom:50%;width:43px;border:0 solid var(--red);border-bottom-width:3px;pointer-events:none}
footer::before{left:-45px;right:auto;border-left-width:3px;z-index:0}
footer::after{right:-45px;border-right-width:3px}
@media (max-width:767px){
  body{padding:8px}
  .sheet{padding:16px 31px 32px}
  .sheet::after{left:8px;right:8px}
  footer{padding:40px 20px}
  .sheet::after{bottom:340px}
  footer::before,footer::after{display:block!important;top:-40px;width:23px}
  footer::before{left:-25px}
  footer::after{right:-25px}
}

/* ---------- Header ---------- */
.menubtn{font-family:var(--pf);font-weight:500;font-style:italic;font-size:20px;letter-spacing:0}
.masthead{background:var(--paper)}
.masthead::after{display:none}
.masthead b{font-weight:700;letter-spacing:.02em}
.masthead small{font-family:var(--pf);font-style:italic;font-weight:700;font-size:16px}
.cta-pill{font-family:var(--pf);font-style:italic;font-weight:500;font-size:20px;letter-spacing:0;background:var(--paper);border-radius:50%;padding:12px 44px;transform:rotate(7deg)}
.cta-pill:hover{background:var(--red)}
/* ES/EN vive dentro del menú (ver dm.js) */
nav.main .lang{position:static;display:flex;gap:6px;font-family:var(--bt);font-style:italic;font-weight:600;font-size:14px;letter-spacing:.04em;margin-left:auto;margin-right:16px}
@media (max-width:767px){
  .top{grid-template-columns:1fr auto}
  .masthead{order:1;justify-self:start}
  .menubtn{order:2;justify-self:end;width:64px;height:64px;font-size:15px}
  .masthead small{font-size:13px}
  .cta-pill{display:none}
}

/* ---------- Menú desplegable ---------- */
nav.main .hd{font-family:var(--bt);font-style:italic;font-weight:600;font-size:18px;letter-spacing:0;color:#313131}
nav.main a:not(.btn){font-family:var(--zk);font-weight:700;font-size:42px;line-height:1;padding:8px 0}
@media (max-width:767px){nav.main a:not(.btn){font-size:24px;padding:6px 0}}

/* ---------- Botones, volantas y etiquetas ---------- */
.btn{font-family:var(--pf);font-style:italic;font-weight:700;font-size:24px;letter-spacing:0}
.lbl{letter-spacing:0}
.redbox .lbl,.eyebrow{font-family:var(--pf)!important;font-style:italic!important;font-weight:700!important;text-transform:uppercase!important;letter-spacing:0!important;font-size:20px!important}
.redbox .lbl{display:flex!important;align-items:center;gap:16px;margin-bottom:10px}
.redbox .lbl::after{display:block!important;content:"";flex:1;height:1px;background:rgba(255,255,255,.8)}
.redbox{padding:24px 24px 20px!important}
@media (max-width:767px){.redbox .lbl,.eyebrow{font-size:6vw!important}}

/* ---------- Sellos: grises y suaves, como el template ---------- */
.stamp,.stamp2{filter:grayscale(1);opacity:.45}

/* ---------- Letra capital: en línea, el texto arranca al pie del recuadro ---------- */
.dc,.order .head .blurb .dc,.book .grid p .dc{float:none;display:inline-flex;vertical-align:text-bottom;font-size:92px;margin:0 6px 0 0}
@media (max-width:767px){.dc,.order .head .blurb .dc,.book .grid p .dc{font-size:72px}}

/* ---------- Texto corrido: Bitter 300, 20/32 ---------- */
.herofig .quote,.menu p,.who .text p,.note,.spec .card>div{font-weight:300;font-size:20px;line-height:1.6}
.spec .right .item p,.order .head .blurb,.book .grid p{font-weight:300;font-size:18px;line-height:1.5}
@media (max-width:767px){
  .herofig .quote,.menu p,.who .text p,.note,.spec .card>div{font-size:18px;line-height:1.6}
}

/* =========================================================
   HOME
   ========================================================= */

/* hero */
.ticker h1{font-size:min(17vw,245px);line-height:.9!important;letter-spacing:-.004em;padding-top:14px}
.ticker .ico{width:min(3.4vw,49px);height:min(3.4vw,49px);background:var(--red);color:#fff;padding:min(.8vw,11px);border-radius:4px}
.stamp{right:-70px;top:120px;width:200px}
.award{font-family:var(--bt);font-style:italic;font-weight:400;font-size:18px;padding-right:150px}
@media (max-width:767px){
  .ticker h1{font-size:24vw}
  .ticker .ico{width:9vw;height:9vw;padding:2vw}
  .stamp{display:none}
  .award{font-size:16px;padding-right:0}
}

/* títulos de sección: tamaños del template (dm.js los achica si una palabra no entra) */
.menu-h{font-size:min(12.5vw,180px);line-height:1!important;letter-spacing:0}
.spec .left h2,.order .head h2,#cotizar h2{font-size:min(11vw,158px);line-height:1!important;letter-spacing:0}
.who .text .redbox h2{font-size:min(10.5vw,151px)!important}
.reserve .redbox h2{font-size:min(6.1vw,88px)!important}
.spec .right h3,.order .right h3{font-size:min(3.5vw,50px);line-height:1.15;text-transform:uppercase}
@media (max-width:767px){
  .menu-h{font-size:24vw}
  .spec .left h2,.order .head h2,#cotizar h2{font-size:21vw}
  .who .text .redbox h2{font-size:18vw!important}
  .reserve .redbox h2{font-size:15vw!important}
  .spec .right h3,.order .right h3{font-size:10vw}
}

/* variedades + pedidos */
.menu p{max-width:647px;margin-left:57px}
@media (max-width:900px){.menu p{margin-left:0}}
.reserve .contact{display:block;font-family:var(--pf);font-style:italic;font-weight:600;font-size:32px;line-height:1.3;color:var(--red);margin:6px 0 34px;overflow-wrap:anywhere}
.reserve .info{font-size:20px;line-height:1.6;gap:24px}
.reserve .info b{font-family:var(--bt);font-weight:600;text-transform:none;letter-spacing:0;color:#313131;margin-bottom:0}
.reserve .info a{color:var(--ink);font-size:20px}
@media (max-width:767px){.reserve .contact{font-size:6.4vw}.reserve .info{font-size:18px}}

/* cherry club: la copa grande entra en el recuadro y el texto queda abajo */
.spec .left h2{display:block}
.spec .grid{align-items:stretch;margin-top:48px}
.spec .grid figure img{aspect-ratio:436/810;height:100%}
.spec .card{margin-top:150px}
.spec .card>div{justify-content:flex-end;gap:34px;padding:0 24px 56px}
.spec .card .ill{width:min(92%,300px);margin:-170px auto auto;mix-blend-mode:multiply}
.spec .card b,.spec .right .item b{font-family:var(--bt);font-style:italic;font-weight:600;font-size:20px;line-height:1.2;letter-spacing:0;text-transform:uppercase;color:var(--ink);margin-bottom:6px}
@media (max-width:900px){.spec .card{margin-top:140px}.spec .grid figure img{aspect-ratio:4/5}}

/* esta semana: líneas rojas cortas */
.spec .right h3{margin-bottom:0}
.spec .right h3::after{content:"";display:block;width:80px;height:1px;background:var(--red);margin:44px auto 0}
.spec .right hr{width:80px;border-top-color:var(--red)}
.spec .right .item p{max-width:295px}

/* cajas y pallets */
.order .left{display:flex;flex-direction:column}
.order .head{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:36px;align-items:start}
.order .head .blurb{margin-top:6px}
.prod b{font-family:var(--bt);font-weight:600;font-size:18px;color:#313131;margin-top:16px}
.prod span{font-weight:300;font-size:18px;color:var(--ink);line-height:1.5}
.order .btns{margin-top:auto;padding-top:80px}
@media (max-width:900px){.order .head{grid-template-columns:minmax(0,1fr);gap:0}.order .head .blurb{margin-top:28px}.prod b,.prod span{font-size:15px}}

/* nota del productor: tarjeta más angosta que la columna */
.note{margin:0 30px;padding:48px 40px}
.note .hi,.note .sig{font-family:var(--pf);font-style:italic;font-weight:600;font-size:32px;line-height:1.3}
.order .right figure{margin:0 30px}
@media (max-width:767px){.note{margin:0;padding:40px 24px}.order .right figure{margin:0}.note .hi,.note .sig{font-size:8vw}}

/* pedí tu cotización */
#cotizar.book{border-top:0;padding-top:56px}
#cotizar.book::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:conic-gradient(var(--red) 25%,transparent 0 50%,var(--red) 0 75%,transparent 0) 0 0/8px 8px;opacity:.5}
.form .tag{font-family:var(--pf);font-style:italic;font-weight:500;font-size:18px;letter-spacing:0}
.form .submit.full{grid-column:2}
@media (max-width:900px){.form .submit.full{grid-column:1}}
@media (max-width:767px){.form .tag{font-size:16px}}

/* footer */
footer .g{max-width:1090px}
footer .g>div{justify-self:center}
footer b{font-family:var(--pf);font-style:italic;font-weight:600;font-size:18px;color:var(--ink)}
footer a,footer span{font-family:var(--bt);font-weight:300;font-size:18px;line-height:1.72;color:#3c3c3c}
@media (max-width:767px){footer .g>div{justify-self:start}}

/* =========================================================
   LA CARTA · en celular la grilla no debe estirarse más que la hoja
   ========================================================= */
@media (max-width:900px){.carta{grid-template-columns:minmax(0,1fr)!important}.carta .item{grid-template-columns:minmax(0,1fr) auto}}
