/* Paleta San Marcos: los colores de texto son versiones oscuras del logo para mantener contraste. */
:root {
  --paper:#FFFDF8; --paper-card:#FFFFFF; --ink:#2B1A12; --ink-soft:#5D4B42;
  --pink:#B8205C; --teal:#087C7D; --mustard:#FFBF16; --orange:#A54E16;
  --line:rgba(62,36,25,.17); --shadow:rgba(62,36,25,.14);
  --section-warm:#FFF5E8; --section-mint:#EAF8F5;
  --banner-bg:#FFF8E9; --banner-text:#51443C; --banner-pink:#C62561; --banner-line:#F0DFBC;
}
@media (prefers-color-scheme:dark) {
  :root:not([data-theme="light"]) {
    --paper:#1D1714; --paper-card:#2B211D; --ink:#FFF5E8; --ink-soft:#D6C5B6;
    --pink:#FF76A6; --teal:#62D3CF; --mustard:#FFD15E; --orange:#FFAC68;
    --line:rgba(255,245,232,.19); --shadow:rgba(0,0,0,.35);
    --section-warm:#291F1A; --section-mint:#1C2B29;
    --banner-bg:#33251F; --banner-text:#F1DFD0; --banner-pink:#FF83AD; --banner-line:#765444;
  }
}
:root[data-theme="dark"] {
  --paper:#1D1714; --paper-card:#2B211D; --ink:#FFF5E8; --ink-soft:#D6C5B6;
  --pink:#FF76A6; --teal:#62D3CF; --mustard:#FFD15E; --orange:#FFAC68;
  --line:rgba(255,245,232,.19); --shadow:rgba(0,0,0,.35);
  --section-warm:#291F1A; --section-mint:#1C2B29;
  --banner-bg:#33251F; --banner-text:#F1DFD0; --banner-pink:#FF83AD; --banner-line:#765444;
}
body{background:var(--paper);color:var(--ink)}
header{box-shadow:0 2px 14px var(--shadow)}
.brand span.tag,nav.links a:hover,nav.links a:focus-visible{color:var(--pink)}
nav.links a{color:var(--ink-soft)}
.hero{background:var(--paper)}
.hero h1 em,.next-date .num,.t-dot .d{color:var(--pink)}
.eyebrow-hero,.next-card .kicker,.product-card .p-vendedor{color:var(--teal)}
.btn-primary{background:var(--pink);border-color:var(--pink);color:#FFF}
.btn-primary:hover,.btn-primary:focus-visible{background:#94184A;border-color:#94184A;color:#FFF}
.btn-ghost{background:var(--paper-card);border-color:var(--teal);color:var(--teal)}
.btn-ghost:hover{background:var(--section-mint);border-color:var(--teal);color:var(--teal)}
.next-card,.vendor-card,.product-card{border-color:var(--line);box-shadow:0 12px 30px -22px var(--shadow)}
.next-card{border-top:5px solid var(--mustard)}
.vendor-card{border-top:4px solid var(--teal)}
.product-card{border-bottom:4px solid var(--mustard)}
#eventos{background:var(--section-warm)}
#productos{background:var(--section-mint)}
.section-head h2{color:var(--ink)}
.section-head p,.t-body .place,.vendor-cat,.product-card .p-precio{color:var(--ink-soft)}
.t-dot{border-color:var(--pink)}
.search-box:focus{border-color:var(--teal);box-shadow:0 0 0 3px color-mix(in srgb,var(--teal) 18%,transparent);outline:none}
.filter-btn.active{background:var(--teal);border-color:var(--teal);color:#FFF}
.vendor-contact a{background:var(--paper-card)}
.vendor-contact a:hover{border-color:var(--pink);color:var(--pink)}
.vendor-contact a.whatsapp{background:var(--teal);border-color:var(--teal);color:#FFF}
.vendor-contact a.whatsapp:hover{background:#075F60;border-color:#075F60;color:#FFF}
.swiper-button-next,.swiper-button-prev{color:var(--pink)}
.swiper-pagination-bullet-active{background:var(--pink)}
.join{background:#2B1A12;border:2px solid #5F3B27;box-shadow:0 18px 42px -26px var(--shadow)}
.join h2{color:#FFF7EA}.join p{color:#EADCCB}
.join .btn-primary{background:var(--mustard);border-color:var(--mustard);color:#2B1A12}
.join .btn-primary:hover{background:#FFE084;border-color:#FFE084;color:#2B1A12}
footer{background:var(--section-warm);border-top:1px solid var(--line)}
:focus-visible{outline-color:var(--teal)}
/* Banner aprobado */
.brand-banner{padding:0;position:relative;overflow:hidden;isolation:isolate;background:var(--banner-bg);border-bottom:3px solid var(--banner-line)}
.brand-banner::before{content:"";position:absolute;left:-100px;top:110px;width:300px;height:300px;border:20px solid #FFBF16;border-radius:50%;opacity:.18}
.brand-banner::after{content:"";position:absolute;right:-75px;top:-130px;width:320px;height:320px;border-radius:50%;background:#0DBBB5;opacity:.12}
.brand-banner-inner.container{max-width:1080px;min-height:344px;display:grid;grid-template-columns:minmax(0,1fr) 285px;align-items:center;gap:60px;padding:24px;position:relative;z-index:1}
.brand-banner-copy{min-width:0}
.brand-banner-eyebrow{color:var(--teal);text-transform:uppercase;letter-spacing:.12em;font-size:.82rem;font-weight:700;margin:0 0 12px}
.brand-banner h1{font-size:clamp(3rem,5vw,4.5rem);line-height:1.02;letter-spacing:-.035em;color:var(--ink);margin:0 0 19px}
.brand-banner h1 em{color:var(--banner-pink);font-style:normal}
.brand-banner-rule{width:94px;height:6px;border-radius:10px;background:linear-gradient(90deg,#FFBF16 0 32%,#0DBBB5 32% 65%,#F53D83 65%);margin-bottom:19px}
.brand-banner-lede{color:var(--banner-text);font-size:1.18rem;line-height:1.45;margin:0;max-width:54ch}
.brand-banner-motto{color:var(--orange);font-size:.87rem;font-weight:700;letter-spacing:.035em;margin:15px 0 0}
.brand-banner-logo{width:285px;height:285px;border:7px solid #FFF;border-radius:50%;background:#FFF;box-shadow:0 15px 40px rgba(76,40,15,.15);overflow:hidden;display:grid;place-items:center}
.brand-banner-logo img{display:block;width:100%;height:100%;object-fit:contain}
.brand-sprinkle{position:absolute;z-index:1;display:block;border-radius:999px}
.brand-sprinkle.one{width:24px;height:8px;left:5%;top:42px;background:#F53D83;transform:rotate(-30deg)}
.brand-sprinkle.two{width:14px;height:14px;left:43%;bottom:40px;background:#FFBF16}
.brand-sprinkle.three{width:23px;height:8px;right:4%;bottom:75px;background:#0DBBB5;transform:rotate(45deg)}
@media(max-width:860px){
  .brand-banner-inner.container{grid-template-columns:minmax(0,1fr) 220px;gap:26px}
  .brand-banner-logo{width:220px;height:220px}
  .brand-banner h1{font-size:clamp(2.5rem,5vw,3.5rem)}
}
@media(max-width:700px){
  .nav{padding:12px 20px}
  .brand-banner-inner.container{min-height:0;grid-template-columns:1fr;gap:14px;padding:24px 25px 31px;text-align:center}
  .brand-banner-logo{width:192px;height:192px;border-width:5px;grid-row:1;justify-self:center}
  .brand-banner-copy{grid-row:2}
  .brand-banner-eyebrow{font-size:.68rem;letter-spacing:.1em;margin-bottom:8px}
  .brand-banner h1{font-size:clamp(2.25rem,10vw,2.65rem);margin-bottom:14px}
  .brand-banner-rule{margin:0 auto 13px}
  .brand-banner-lede{font-size:1rem}
  .brand-banner-motto{font-size:.72rem;margin-top:10px}
  .brand-banner::before{left:-155px;top:195px}.brand-banner::after{right:-210px;top:-115px}
  .brand-sprinkle.one{top:110px}.brand-sprinkle.two{left:10%;bottom:80px}.brand-sprinkle.three{right:7%;bottom:40px}
  .hero{padding:48px 24px 40px}
}
@media(max-width:390px){.brand-banner h1{font-size:2.25rem}.brand-banner-logo{width:170px;height:170px}}
@media (prefers-color-scheme:dark) {
  :root:not([data-theme="light"]) .btn-primary,
  :root:not([data-theme="light"]) .filter-btn.active,
  :root:not([data-theme="light"]) .vendor-contact a.whatsapp { color:#2B1A12; }
}
:root[data-theme="dark"] .btn-primary,
:root[data-theme="dark"] .filter-btn.active,
:root[data-theme="dark"] .vendor-contact a.whatsapp { color:#2B1A12; }
@media (prefers-color-scheme:dark) {
  :root:not([data-theme="light"]) .hero .btn-primary:hover,
  :root:not([data-theme="light"]) .hero .btn-primary:focus-visible { background:#FFA5C5; border-color:#FFA5C5; color:#2B1A12; }
  :root:not([data-theme="light"]) .vendor-contact a.whatsapp:hover { background:#93E0DE; border-color:#93E0DE; color:#2B1A12; }
}
:root[data-theme="dark"] .hero .btn-primary:hover,
:root[data-theme="dark"] .hero .btn-primary:focus-visible { background:#FFA5C5; border-color:#FFA5C5; color:#2B1A12; }
:root[data-theme="dark"] .vendor-contact a.whatsapp:hover { background:#93E0DE; border-color:#93E0DE; color:#2B1A12; }

/* Fichas de productos: imagen cuadrada y tamaños uniformes en el carrusel. */
#carrusel-productos { padding: 4px 42px 54px; }
#carrusel-productos .swiper-wrapper { align-items: stretch; }
#carrusel-productos .swiper-slide { height: auto; display: flex; min-width: 0; }
#carrusel-productos .product-card { width: 100%; min-width: 0; display: flex; flex-direction: column; }
#carrusel-productos .product-media { width: 100%; aspect-ratio: 1 / 1; overflow: hidden; position: relative; background: var(--section-warm); }
#carrusel-productos .product-media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
#carrusel-productos .product-media.is-missing::after { content: "Sin foto"; position: absolute; inset: 0; display: grid; place-items: center; color: var(--ink-soft); font-family: 'Work Sans', sans-serif; font-size: 1rem; font-weight: 600; }
#carrusel-productos .product-card .info { flex: 1; display: flex; flex-direction: column; gap: 5px; padding: 16px 18px 18px; }
#carrusel-productos .product-card .p-nombre { font-size: 1.14rem; line-height: 1.25; overflow-wrap: anywhere; }
#carrusel-productos .product-card .p-vendedor { font-size: .88rem; margin: 0; }
#carrusel-productos .product-card .p-precio { margin-top: auto; color: var(--ink); font-size: 1.04rem; font-weight: 700; }
#carrusel-productos .swiper-button-prev,
#carrusel-productos .swiper-button-next { width: 36px; height: 36px; top: 43%; margin-top: 0; transform: translateY(-50%); border: 1px solid var(--line); border-radius: 50%; background: var(--paper-card); box-shadow: 0 4px 12px var(--shadow); color: var(--pink); }
#carrusel-productos .swiper-button-prev { left: 2px; }
#carrusel-productos .swiper-button-next { right: 2px; }
#carrusel-productos .swiper-button-prev::after,
#carrusel-productos .swiper-button-next::after { font-size: 14px; font-weight: 700; }
#carrusel-productos .swiper-pagination { bottom: 8px; }
#carrusel-productos:not(.swiper-initialized) .swiper-wrapper { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
#carrusel-productos:not(.swiper-initialized) .swiper-button-prev,
#carrusel-productos:not(.swiper-initialized) .swiper-button-next,
#carrusel-productos:not(.swiper-initialized) .swiper-pagination { display: none; }
@media (max-width: 1023px) {
  #carrusel-productos:not(.swiper-initialized) .swiper-wrapper { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  #carrusel-productos { padding: 4px 28px 46px; }
  #carrusel-productos:not(.swiper-initialized) .swiper-wrapper { grid-template-columns: 1fr; }
  #carrusel-productos .swiper-button-prev { left: 0; }
  #carrusel-productos .swiper-button-next { right: 0; }
}
