:root{
  --ink:#141414;--ink-2:#1E1E1E;--chalk:#F3F0EA;--paper:#FAF7F2;
  --crust:#B9793B;--crust-deep:#8F5A2A;--line:#E8DFD2;--muted:#6B6258;--muted-dark:#B5AEA3;
  --serif:"DM Serif Display",Georgia,serif;--sans:"Karla",system-ui,sans-serif;
  --pad-x:20px;--sec-y:clamp(64px,9vw,112px);--gap-t:36px;
}
@media (min-width:768px){:root{--pad-x:32px;--gap-t:52px}}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.65 var(--sans);-webkit-font-smoothing:antialiased;touch-action:manipulation;overflow-x:hidden;-webkit-tap-highlight-color:rgba(185,121,59,.2)}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;text-wrap:balance}
p{margin:0}
a{color:inherit}
:focus-visible{outline:2px solid var(--crust);outline-offset:3px;border-radius:4px}
[id]{scroll-margin-top:84px}
.wrap{max-width:1160px;margin:0 auto;padding:0 var(--pad-x);position:relative}
.skip{position:absolute;left:12px;top:-60px;background:var(--crust);color:var(--ink);padding:12px 16px;border-radius:10px;z-index:100;text-decoration:none;font-weight:700}
.skip:focus{top:12px}
.label{font:700 .8125rem/1.3 var(--sans);text-transform:uppercase;letter-spacing:.16em;color:var(--crust);margin-bottom:16px}
.label--light{color:var(--crust-deep)}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:10px;font:700 1rem/1 var(--sans);text-decoration:none;border:2px solid transparent;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s;white-space:nowrap}
.btn--sm{min-height:44px;padding:0 16px;font-size:.9375rem}
.btn--lg{min-height:52px;padding:0 28px}
.btn--block{width:100%}
.btn--crust{background:var(--crust);color:var(--ink);border-color:var(--crust)}
.btn--crust:hover{background:#CB8A4A;border-color:#CB8A4A}
.btn--ink{background:var(--ink);color:var(--chalk);border-color:var(--ink)}
.btn--ink:hover{background:#2C2C2C;border-color:#2C2C2C}
.btn--outline{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--outline:hover{background:var(--ink);color:var(--chalk)}
.btn--outline-chalk{background:transparent;color:var(--chalk);border-color:var(--chalk)}
.btn--ghost{background:transparent;color:var(--chalk);border-color:rgba(255,255,255,.3)}
.btn--ghost:hover{border-color:var(--chalk)}
.btn[aria-disabled="true"],.btn:disabled{opacity:.5;cursor:not-allowed}
.link{display:inline-flex;align-items:center;min-height:48px;font-weight:700;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px;transition:color .2s}
.link:hover{color:var(--crust)}

/* Ilustración de tiza */
.chalk{position:absolute;color:var(--chalk);opacity:.55;pointer-events:none}
.chalk--trigo{width:84px;height:112px;right:max(12px,calc(50% - 600px));top:24px}
.chalk--flor{width:110px;height:110px;right:max(8px,calc(50% - 610px));bottom:24px}

/* Header */
.header{position:sticky;top:0;z-index:50;background:var(--ink);color:var(--chalk)}
.header__in{height:68px;display:flex;align-items:center;gap:20px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:0;margin-right:auto}
.brand__logo{flex:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--chalk);display:grid;place-items:center;font:400 1.25rem/1 var(--serif);color:var(--chalk);overflow:hidden}
.brand__logo img{width:100%;height:100%;object-fit:cover}
.brand__name{font:400 1.25rem/1.1 var(--serif);white-space:nowrap}
.nav{display:none;gap:4px}
.nav a{display:inline-flex;align-items:center;min-height:48px;padding:0 12px;font-weight:500;text-decoration:none;color:var(--chalk);border-radius:10px;transition:color .2s}
.nav a:hover{color:var(--crust)}
@media (min-width:900px){.nav{display:flex}}
@media (max-width:400px){.brand__name{font-size:1.0625rem}.header .btn--sm{padding:0 12px;font-size:.875rem}}

/* Hero */
.hero{position:relative;background:var(--ink);color:var(--chalk);padding:48px 0;overflow:hidden}
.hero__grid{display:grid;gap:48px}
.hero h1{font-size:clamp(2.5rem,7vw,4.75rem);line-height:1.05}
.hero .acc{color:var(--crust)}
.hero__lead{font-size:1.125rem;max-width:42ch;margin-top:24px;color:var(--chalk)}
.hero__actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 28px;margin-top:32px}
.hero__media{margin:0;position:relative;max-width:480px;width:calc(100% - 12px);justify-self:center}
.hero__media::before{content:"";position:absolute;inset:0;transform:translate(12px,12px);border:1px dashed rgba(243,240,234,.4);border-radius:16px}
.hero__media img,.hero__ph{position:relative;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:16px;background:var(--ink-2)}
.hero__ph{display:flex;flex-direction:column;justify-content:flex-end;padding:28px;border:1px solid rgba(243,240,234,.14)}
.hero__ph-ill{position:absolute;top:28px;left:28px;width:96px;height:128px;color:var(--chalk);opacity:.55}
.hero__ph-t{font:400 clamp(1.5rem,3.4vw,2rem)/1.15 var(--serif);max-width:14ch}
.hero__ph-s{margin-top:10px;font-size:.875rem;letter-spacing:.06em;color:var(--muted-dark)}
@media (min-width:900px){.hero{padding:96px 0}.hero__grid{grid-template-columns:1fr 1fr;gap:56px;align-items:center}}

/* Secciones */
.sec{padding:var(--sec-y) 0;position:relative}
.sec--paper{background:var(--paper)}
.sec--ink{background:var(--ink);color:var(--chalk);overflow:hidden}
.sec--top0{padding-top:0}
.sec h2{font-size:clamp(1.875rem,4.5vw,3rem);line-height:1.1;margin-bottom:var(--gap-t)}

/* Temporada */
.temporada{display:grid;gap:20px;align-items:center;margin-bottom:var(--sec-y);background:var(--chalk);border-radius:16px;overflow:hidden}
.temporada img{width:100%;aspect-ratio:16/9;object-fit:cover}
.temporada div{padding:0 24px 24px}
@media (min-width:768px){.temporada{grid-template-columns:3fr 2fr}.temporada div{padding:24px 32px}}

/* Productos */
.cats{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px}
@media (min-width:900px){.cats{grid-template-columns:repeat(4,minmax(0,1fr))}}
.cat__media{aspect-ratio:4/5;border-radius:16px;overflow:hidden;background:var(--chalk)}
.cat__media img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.cat:hover .cat__media img{transform:scale(1.03)}
.cat__ph{height:100%;display:flex;flex-direction:column;justify-content:space-between;padding:18px;border:1px solid var(--line);border-radius:16px;color:var(--muted)}
.cat__ph svg{width:28px;height:28px;color:var(--crust-deep)}
.cat__ph span{font-size:.8125rem;letter-spacing:.06em}
.cat h3{font-size:1.375rem;line-height:1.2;margin-top:16px}
.cat p{color:var(--muted);font-size:.9375rem;line-height:1.5;margin-top:6px}

/* Pide tu pastel */
.pastel{display:grid;gap:40px}
.pasos{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.pasos li{display:flex;align-items:center;gap:16px;font-size:1.125rem}
.pasos span{flex:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--crust);color:var(--crust);display:grid;place-items:center;font:400 1.125rem/1 var(--serif)}
.form{display:grid;gap:18px}
.field{display:grid;gap:8px;min-width:0}
.field-row{display:grid;gap:18px}
@media (min-width:560px){.field-row{grid-template-columns:1fr 1fr}}
.field label{font-weight:700;font-size:.9375rem;color:var(--chalk)}
.field input{width:100%;height:52px;padding:0 16px;border-radius:10px;background:var(--ink-2);border:1px solid rgba(255,255,255,.14);color:var(--chalk);font:400 1.0625rem var(--sans);color-scheme:dark;transition:border-color .2s}
.field input::placeholder{color:#8F877D}
.field input:hover{border-color:rgba(255,255,255,.3)}
.field input:focus-visible{outline:2px solid var(--crust);outline-offset:2px;border-color:var(--crust)}
.field input[aria-invalid="true"]{border-color:#E39A8B}
.err{color:#F0B3A6;font-size:.875rem;min-height:0}
.err:empty{display:none}
.form__alt{border:1px dashed rgba(243,240,234,.3);border-radius:10px;padding:18px;display:grid;gap:12px}
.form__aviso{font-weight:700;color:var(--crust)}
.form__msg{white-space:pre-line;color:var(--muted-dark);font-size:.9375rem}
.form__alt-btns{display:flex;flex-wrap:wrap;gap:10px}
@media (min-width:900px){.pastel{grid-template-columns:5fr 7fr;gap:72px;align-items:start}}

/* Por qué venir */
.razones{list-style:none;margin:0;padding:0;display:grid}
.razones li{padding:24px 0;border-top:1px solid var(--line)}
.razones li:last-child{border-bottom:1px solid var(--line)}
.razones h3{font-size:1.375rem}
.razones p{color:var(--muted);margin-top:6px;max-width:36ch}
@media (min-width:768px){
  .razones{grid-template-columns:repeat(3,1fr)}
  .razones li,.razones li:last-child{border:0;border-left:1px solid var(--line);padding:4px 28px}
  .razones li:first-child{border-left:0;padding-left:0}
}

/* Visítanos */
.tabs{display:flex;gap:8px;margin:calc(var(--gap-t) * -.4) 0 28px}
.tabs button{min-height:48px;padding:0 20px;border-radius:10px;border:1px solid var(--line);background:transparent;font:700 1rem var(--sans);cursor:pointer}
.tabs button[aria-selected="true"]{background:var(--ink);color:var(--chalk);border-color:var(--ink)}
.visita{display:grid;gap:40px}
.suc__dir{font-style:normal;font-size:1.125rem;max-width:36ch}
.suc__tel{display:inline-flex;align-items:center;min-height:48px;font-weight:700;text-decoration:none;font-variant-numeric:tabular-nums}
.suc__tel:hover{color:var(--crust-deep)}
.horario{margin:16px 0 0;padding:0;list-style:none;max-width:400px}
.horario li{display:flex;justify-content:space-between;gap:16px;padding:10px 16px;font-variant-numeric:tabular-nums}
.horario li.hoy{background:var(--chalk);border-radius:10px;font-weight:700}
.horario .pc{color:var(--muted)}
.estado{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-weight:700;font-size:.9375rem;color:var(--muted)}
.estado::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.estado.is-open{color:#3F6B3A}
.suc__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.mapa{width:100%;height:360px;border:0;border-radius:16px;filter:grayscale(.6);background:var(--line)}
@media (min-width:900px){.visita{grid-template-columns:5fr 7fr;gap:56px;align-items:start}}

/* Cierre */
.cierre{background:var(--chalk);text-align:center;padding:72px 0}
.cierre h2{font-size:clamp(1.875rem,4.5vw,3rem);line-height:1.1;margin-bottom:28px}
.cierre__links{margin-top:20px;display:flex;justify-content:center;flex-wrap:wrap;gap:4px 24px}
.cierre__links a{display:inline-flex;align-items:center;min-height:48px;font-weight:700;color:var(--crust-deep);text-underline-offset:5px}

/* Footer */
.footer{background:var(--ink);color:var(--chalk);padding:48px 0 32px}
.footer__in{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px}
.footer__brand{display:flex;gap:16px;align-items:flex-start}
.footer__name{font:400 1.375rem/1.2 var(--serif)}
.footer__muted{color:var(--muted-dark);font-size:.9375rem;margin-top:6px}
.liston{max-width:1160px;margin:32px auto 0;padding:14px var(--pad-x) 0;border-top:1px solid rgba(255,255,255,.12);font-size:.8125rem;color:var(--muted-dark);text-align:center}

/* Barra móvil */
.barra{display:none}
@media (max-width:767px){
  body{padding-bottom:calc(60px + env(safe-area-inset-bottom))}
  .barra{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--ink);padding:6px 12px calc(6px + env(safe-area-inset-bottom))}
  .barra .btn{min-height:48px;padding:0 10px;font-size:.9375rem}
}

/* Movimiento */
.reveal{opacity:0;transform:translateY(12px);transition:opacity .5s ease-out,transform .5s ease-out}
.reveal.is-in,.no-js .reveal{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  *{transition-duration:0s!important}
}
@media (max-width:767px){.chalk{display:none}}
.cat__ph{justify-content:flex-end;background:repeating-linear-gradient(135deg,transparent 0 14px,rgba(20,20,20,.025) 14px 15px)}
