@font-face{font-family:'Young Serif';src:url('/fonts/young-serif-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Figtree';src:url('/fonts/figtree-latin-wght-normal.woff2') format('woff2');font-weight:300 800;font-display:swap}
:root{--rosa:#fce6f0;--rosa-d:#f7c9dc;--vichy:rgba(247,163,203,.42);--galleta:#e9cf7c;--oro:#d9ae3f;--oro-t:#b08a28;--titulo:#b8902c;--lazo:#e5578a;--marron:#5a2d25;--crema:#fdf5dd;--crema-d:#faebbd;--gris:#8a6a60;--linea:#f1dfa8;
  --disp:'Young Serif',Georgia,serif;--sans:'Figtree',system-ui,sans-serif;--ease:cubic-bezier(.22,1,.36,1)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:5.5rem}
body{margin:0;background:#fffbf6;color:var(--marron);font:400 16px/1.65 var(--sans);-webkit-font-smoothing:antialiased;}
img{max-width:100%;display:block}a{color:inherit}
html,body{overflow-x:clip}
:focus-visible{outline:3px solid var(--lazo);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:.6rem 1rem;z-index:99}.skip:focus{left:0}
.wrap{width:min(1120px,100% - 2.5rem);margin:0 auto}
h1,h2,h3{font-family:var(--disp);font-weight:400;line-height:1.1;margin:0}
.ttl{font-size:clamp(1.9rem,4.2vw,2.9rem);text-align:center;color:var(--marron)}.ttl.l{text-align:left}
.sub{text-align:center;color:var(--gris);max-width:34rem;margin:.9rem auto 0}
.mini{font-size:.8rem;color:var(--gris);text-align:center;margin:1.2rem 0 0}.mini.l{text-align:left}
.btn{display:inline-block;padding:.9rem 1.55rem;border-radius:999px;font:700 .9rem/1 var(--sans);text-decoration:none;border:2px solid var(--marron);cursor:pointer;transition:transform .3s var(--ease),background .3s}
.btn.dark{background:var(--marron);color:#fff}.btn.dark:hover{background:var(--lazo);border-color:var(--lazo)}
.btn.gold{background:var(--galleta);color:var(--marron)}.btn.gold:hover{background:var(--oro)}
.btn.sm{padding:.7rem 1.2rem}
.lnk{font-weight:700;color:var(--lazo);text-underline-offset:5px}

/* cabecera */
.top{position:sticky;top:0;z-index:50;background:rgba(253,228,236,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--rosa-d)}
.top .wrap{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1.5rem;padding:.45rem 0}
.brand img{width:56px;height:56px;border-radius:50%}
.nav{display:flex;gap:1.6rem;justify-content:center}
.nav a{text-decoration:none;font-weight:600;font-size:.92rem;padding:.4rem 0;border-bottom:2px solid transparent}
.nav a:hover{border-color:var(--lazo)}
.top .btn{justify-self:end}

/* portada */
.hero{position:relative;background:var(--rosa);overflow:hidden}
.hero::before{content:"";position:absolute;inset:0 0 0 46%;background-color:var(--rosa);background-image:linear-gradient(90deg,var(--vichy) 50%,transparent 50%),linear-gradient(var(--vichy) 50%,transparent 50%);background-size:64px 64px}
.hero-in{position:relative;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:2rem;padding:clamp(2rem,5vw,4rem) 0 clamp(3rem,6vw,5rem)}
h1{font-size:clamp(2.3rem,5.4vw,4.1rem);max-width:12ch;letter-spacing:-.005em}
.hero-sub{font-size:1.08rem;max-width:30rem;margin:1.2rem 0 1.6rem}
.btns{display:flex;gap:.8rem;flex-wrap:wrap}
.rate{margin:1.5rem 0 0;font-size:.95rem}.stars{color:var(--oro);letter-spacing:.1em}
.estado{margin:.3rem 0 0;font-size:.88rem;color:var(--gris);font-weight:600}
.estado::before{content:"";display:inline-block;width:.6rem;height:.6rem;border-radius:50%;background:#b9a89c;margin-right:.45rem}
.estado.on::before{background:#3d9a58}
.hero-pic{position:relative;margin:0;justify-self:center;width:min(380px,100%)}
.arco{border-radius:999px 999px 28px 28px;overflow:hidden;border:5px solid var(--galleta);background:var(--crema);aspect-ratio:3/4;box-shadow:0 24px 40px -22px rgba(59,33,24,.45)}
.arco img{width:100%;height:100%;object-fit:cover}
.arco.sm{border-width:4px}
.sello{position:absolute;left:-16px;bottom:8%;width:92px;height:92px;border-radius:50%;border:4px solid #fff;box-shadow:0 10px 24px -10px rgba(59,33,24,.5)}
.chapa{position:absolute;right:-14px;top:12%;width:92px;height:92px;border-radius:50%;background:var(--lazo);color:#fff;display:grid;place-content:center;text-align:center;font:400 1.3rem/1 var(--disp);transform:rotate(10deg);box-shadow:0 10px 24px -10px rgba(59,33,24,.5)}
.chapa small{font:700 .66rem/1.2 var(--sans);letter-spacing:.04em;margin-top:.15rem}

/* carrusel de cookies */
.fav{padding:clamp(2.5rem,6vw,4.5rem) 0}
.panel{background:var(--crema-d);border-radius:34px;padding:clamp(1.8rem,4vw,3rem) clamp(1rem,3vw,2.5rem);border:1px solid var(--linea)}
.car{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.6rem;margin-top:1.8rem}
.arr{width:44px;height:44px;border-radius:50%;border:2px solid var(--marron);background:#fff;color:var(--marron);font:400 1.6rem/1 var(--sans);cursor:pointer;padding:0 0 .2rem}
.arr:hover{background:var(--marron);color:#fff}
.car-track{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:.4rem .2rem}
.car-track::-webkit-scrollbar{display:none}
.ck{flex:0 0 clamp(150px,22%,210px);scroll-snap-align:start;background:#fff;border:2px solid transparent;border-radius:22px;padding:.7rem .7rem 1rem;text-align:center;cursor:pointer;font:inherit;color:inherit;transition:border-color .25s,transform .35s var(--ease)}
.ck:hover{transform:translateY(-4px)}
.ck[aria-pressed="true"]{border-color:var(--lazo)}
.ck .im{display:block;aspect-ratio:1;border-radius:16px;background:var(--rosa);overflow:hidden;display:grid;place-items:center}
.ck .im svg{width:78%;height:auto}
.ck .im img{width:100%;height:100%;object-fit:cover}
.ck b{display:block;margin-top:.7rem;font:400 1.1rem/1.2 var(--disp)}
.ck span.p{font-size:.85rem;color:var(--gris)}
.det{margin:1.6rem auto 0;max-width:40rem;text-align:center}
.det h3{font-size:1.7rem}
.det p{margin:.5rem 0 0}.det-p{font-size:.95rem}.det-p small{color:var(--gris)}
.det .btn{margin-top:1rem}

/* packs */
.packs{padding:clamp(1rem,3vw,2rem) 0 clamp(2.5rem,6vw,4.5rem)}
.pk{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:2rem}
.pkc{background:var(--rosa);border-radius:28px;padding:1.6rem 1.4rem;text-align:center;border:1px solid var(--rosa-d);display:flex;flex-direction:column;align-items:center}
.pkc .n{font:400 3.6rem/1 var(--disp);color:var(--lazo)}
.pkc h3{font-size:1.15rem;margin:.2rem 0 .4rem}
.pkc .pr{font:400 1.7rem/1 var(--disp)}
.pkc small{color:var(--gris);min-height:1.3em;margin:.3rem 0 1rem}
.pkc .btn{margin-top:auto}

/* más que cookies */
.mas{background:var(--rosa);padding:clamp(2.5rem,6vw,4.5rem) 0;background-image:linear-gradient(90deg,rgba(255,255,255,.35) 50%,transparent 50%);background-size:64px 64px}
.cr{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-top:2rem}
.cc{background:#fff;border-radius:26px;overflow:hidden;border:1px solid var(--rosa-d);display:flex;flex-direction:column}
.cc .im{aspect-ratio:4/5;overflow:hidden;background:var(--crema)}
.cc .im img{width:100%;height:100%;object-fit:cover}
.cc div.tx{padding:1rem 1.1rem 1.3rem}
.cc h3{font-size:1.15rem}
.cc p{margin:.45rem 0 0;font-size:.92rem;color:var(--gris);line-height:1.5}
.cc small{display:block;margin-top:.6rem;font-weight:700;font-size:.8rem;color:var(--oro-t)}

/* local */
.local{padding:clamp(2.5rem,6vw,4.5rem) 0}
.local-in{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(1.5rem,5vw,4rem);align-items:center}
.local-in figure{margin:0;max-width:300px;justify-self:center}
.local-txt p{max-width:32rem}

/* reseñas */
.rev{background:var(--crema-d);padding:clamp(2.5rem,6vw,4.5rem) 0}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:2rem}
.quotes blockquote{margin:0;background:#fff;border-radius:24px;padding:1.4rem 1.4rem 1.5rem;font-size:.97rem;line-height:1.6;border:1px solid var(--linea)}
.quotes blockquote::before{content:"★★★★★";display:block;color:var(--oro);letter-spacing:.12em;margin-bottom:.6rem}
.quotes cite{display:block;margin-top:.8rem;font-style:normal;font-size:.8rem;color:var(--gris)}

/* horario y mapa */
.donde{padding:clamp(2.5rem,6vw,4.5rem) 0}
.donde-in{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3rem);align-items:stretch}
.week{list-style:none;margin:1.4rem 0 0;padding:0}
.week li{display:flex;justify-content:space-between;gap:1rem;padding:.7rem .9rem;border-bottom:1px dashed var(--linea);font-size:.97rem}
.week li.hoy{background:var(--rosa);border-radius:12px;font-weight:700;border-bottom-color:transparent}
.week li.off{color:var(--gris)}
address{font-style:normal;margin-top:1.2rem;line-height:1.9}
address a{text-underline-offset:4px}
.map{border-radius:28px;overflow:hidden;border:4px solid var(--galleta);min-height:320px}
.map iframe{width:100%;height:100%;min-height:320px;border:0;display:block}

/* pedir */
.pedir{background:var(--rosa);padding:clamp(2.5rem,6vw,4.5rem) 0}
.pedir-in{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3rem);align-items:center}
.form{background:#fff;border-radius:28px;padding:1.6rem;display:grid;gap:1rem;border:1px solid var(--rosa-d)}
.form label{display:grid;gap:.35rem;font-weight:700;font-size:.88rem}
.form label span{font-weight:400;color:var(--gris)}
.form input,.form select{font:400 1rem var(--sans);padding:.8rem .9rem;border:2px solid var(--linea);border-radius:14px;background:#fffdf9;color:var(--marron)}
.form input:focus,.form select:focus{border-color:var(--lazo);outline:0}

.foot{background:var(--marron);color:#fbe7c2;padding:2rem 0 1.2rem;margin-top:0}
.foot .wrap{display:flex;align-items:center;gap:1rem}
.foot img{border-radius:50%}.foot p{margin:0}
.cred{font-size:.76rem;opacity:.7;margin-top:1rem;line-height:1.5}

/* entrada */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.on{opacity:1;transform:none}
html.flat .reveal{opacity:1;transform:none;transition:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.ck,.btn{transition:none}}

@media (max-width:900px){
  .cr{grid-template-columns:repeat(2,1fr)}
  .quotes{grid-template-columns:1fr}
  .pk{grid-template-columns:1fr}
  .donde-in,.pedir-in,.local-in{grid-template-columns:1fr}
}
@media (max-width:720px){
  .top .wrap{grid-template-columns:auto 1fr auto;gap:.8rem}
  .nav{grid-column:1/-1;grid-row:2;justify-content:flex-start;gap:1.2rem;overflow-x:auto;white-space:nowrap;padding-bottom:.3rem;scrollbar-width:none}
  .hero::before{inset:46% 0 0 0}
  .hero-in{grid-template-columns:1fr;padding-bottom:3rem}
  .hero-pic{width:min(300px,78%)}
  .chapa{right:-6px}.sello{left:-6px}
  .car{grid-template-columns:1fr}.arr{display:none}
  .ck{flex-basis:46%}
  .cr{grid-template-columns:1fr 1fr;gap:.8rem}
  .cc p{font-size:.85rem}
}

/* Colores fieles a las referencias: oro en títulos, crema amarillo en bandas, rosa y blanco de cuadros, chocolate en el texto */
h1,.ttl{color:var(--titulo)}
h3{color:var(--marron)}
.top{background:linear-gradient(90deg,#ecd584,#f8edb8 50%,#ecd584);border-bottom:1px solid #d9bf62}
.nav a:hover{border-color:var(--lazo)}
.hero{background:#fff}
.hero::before{background-color:#fff;background-image:linear-gradient(90deg,var(--vichy) 50%,transparent 50%),linear-gradient(var(--vichy) 50%,transparent 50%)}
.hero-sub,.rate{color:var(--marron)}
.btn{border:2px solid var(--oro)}
.btn.dark{background:var(--lazo);border-color:var(--lazo);color:#fff}.btn.dark:hover{background:#cf3e72;border-color:#cf3e72}
.btn.gold{background:#fff;color:var(--oro-t);border-color:var(--oro)}.btn.gold:hover{background:var(--crema-d)}
.panel{background:var(--crema-d);border:0}
.arco{border-color:var(--oro)}
.chapa{background:var(--lazo)}
.ck{background:#fff}.ck .im{background:#fde3ee}
.ck[aria-pressed="true"]{border-color:var(--oro)}
.pkc{background:var(--crema);border-color:var(--linea)}.pkc .n{color:var(--lazo)}
.mas{background-color:#fff;background-image:linear-gradient(90deg,var(--rosa) 50%,transparent 50%)}
.cc{border-color:var(--linea)}.cc .im{background:var(--crema)}
.rev{background:var(--crema-d)}.quotes blockquote{border-color:transparent}
.pedir{background:var(--rosa)}
.week li.hoy{background:var(--crema-d)}
.map{border-color:var(--oro)}
.foot{background:#672f27;color:#faebbd}

/* cierre estático: invitación a visitar la tienda */
.cierre{text-align:center}
.cierre .ttl{max-width:22ch;margin-inline:auto}
.cierre-p{max-width:34rem;margin:1rem auto 0;color:var(--marron)}
.cierre-b{margin:1.4rem 0 0}
.pkc{padding-bottom:1.8rem}

/* mantel de cuadros más suave y difuminado; sin recuadro blanco por encima */
.hero::before{background-image:linear-gradient(90deg,rgba(247,176,208,.26) 50%,transparent 50%),linear-gradient(rgba(247,176,208,.26) 50%,transparent 50%);
  -webkit-mask-image:radial-gradient(ellipse 75% 85% at 72% 50%,#000 10%,transparent 72%);mask-image:radial-gradient(ellipse 75% 85% at 72% 50%,#000 10%,transparent 72%)}
.arco{background:#fbc6dc;border-color:#e9cf7c}
.arco img{object-position:center}
.arco{background:#f6e7c8}
