/* Los nombres viejos se conservan porque 363 reglas de esta hoja los usan, pero
   ya no guardan un color: son alias del sistema "Botica" que define tokens.css.
   Escrito a mano a propósito. La conversión automática acertó en los neutros y
   falló en lo semántico: no puede saber que --blush es un rosa de fondo y no
   una superficie, ni que --cat-panel tiene que INVERTIRSE al pasar a tema claro. */
:root {
    --ink: var(--c-tinta);
    --ink-soft: var(--c-tinta-2);
    --wine: var(--c-granada);
    --wine-dark: var(--c-granada-alt);
    --wine-deep: var(--c-tinta);
    --rose: var(--c-granada);
    --blush: var(--c-granada-piel);
    --cream: var(--c-lino);
    --paper: var(--c-papel);
    --gold: var(--c-salvia);
    --gold-light: var(--c-salvia-piel);
    --line: var(--c-linea);
    --success: var(--c-salvia);
    --danger: var(--c-granada-alt);
    --shadow-sm: var(--s-1);
    --shadow-lg: var(--s-3);
    --radius-sm: var(--r-sm);
    --radius-md: var(--r-md);
    --radius-lg: var(--r-lg);
    --container: var(--ancho-contenedor);
    --serif: var(--f-display);
    --sans: var(--f-texto);
}

* { box-sizing: border-box; }

html {
    scroll-behavior: smooth;
    scroll-padding-top: 100px;
}

body {
    margin: 0;
    color: var(--ink);
    background: var(--cream);
    font-family: var(--sans);
    line-height:var(--i-suelto);
    -webkit-font-smoothing: antialiased;
}

body.is-locked { overflow: hidden; }

img { display: block; max-width: 100%; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--c-granada) 45%, transparent);
    outline-offset: 3px;
}

.container { width: var(--container); margin-inline: auto; }
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.skip-link {
    position: fixed;
    top: 12px;
    left: 12px;
    z-index: var(--z-aviso);
    padding: 10px 16px;
    color: var(--c-papel);
    background: var(--c-granada);
    border-radius:var(--r-sm);
    transform: translateY(-150%);
}

.skip-link:focus { transform: none; }

.eyebrow {
    margin: 0 0 12px;
    color: var(--wine);
    font-size:var(--f-xs);
    font-weight:var(--p-fuerte);
    letter-spacing: .15em;
    line-height:var(--i-medio);
    text-transform: uppercase;
}

.eyebrow > span {
    display: inline-block;
    width: 28px;
    height: 1px;
    margin-right: 10px;
    vertical-align: middle;
    background: currentColor;
}

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 0 24px;
    border: 1px solid transparent;
    border-radius:var(--r-redondo);
    font-size:var(--f-sm);
    font-weight:var(--p-fuerte);
    letter-spacing: .01em;
    cursor: pointer;
    transition: transform var(--m-medio) ease, background var(--m-medio) ease, color var(--m-medio) ease, border-color var(--m-medio) ease, box-shadow var(--m-medio) ease;
}

.button:hover { transform: translateY(-2px); }
.button:active { transform: translateY(0); }
.button:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.button i { margin-left: 9px; }
.button i:first-child { margin-left: 0; margin-right: 9px; }
.button--wide { width: 100%; }
/* Granada plano, no degradado: un degradado obliga a que el texto cumpla en
   su extremo mas claro, y ahi es donde fallaban los seis botones del catalogo. */
.button--primary {
    color: var(--c-papel);
    background: var(--c-granada);
    box-shadow: var(--s-1);
}
.button--primary:hover { background: var(--c-granada-alt); box-shadow: var(--s-2); }
.button--secondary { color: var(--wine); background: var(--blush); border-color: color-mix(in srgb, var(--c-granada-alt) 10%, transparent); }
.button--ghost { color: var(--c-tinta); background: var(--c-papel); border-color: var(--c-linea-fuerte); }
.button--ghost:hover { background: var(--c-lino); border-color: var(--c-granada); color: var(--c-granada); }
.button--light { color: var(--c-salvia); background: var(--c-salvia-piel); }
.button--outline-light { color: var(--c-salvia-piel); border-color: var(--c-salvia-piel); background: transparent; }
.button--outline-light:hover { background: color-mix(in srgb, var(--c-papel) 10%, transparent); }

.icon-button {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 50%;
    color: var(--ink);
    background: transparent;
    cursor: pointer;
    transition: background var(--m-medio) ease, color var(--m-medio) ease, transform var(--m-medio) ease;
}

.icon-button:hover { color: var(--c-papel); background: var(--c-granada); }

.text-button {
    padding: 0;
    border: 0;
    color: var(--wine);
    background: none;
    font-size:var(--f-sm);
    font-weight:var(--p-fuerte);
    text-decoration: underline;
    text-underline-offset: 4px;
    cursor: pointer;
}

.text-button--muted { color: var(--c-tinta-3); }

/* Age gate */
.age-gate {
    position: fixed;
    inset: 0;
    z-index: var(--z-aviso);
    display: grid;
    place-items: center;
    padding: 24px;
    color: var(--c-tinta);
    background:
        radial-gradient(circle at 20% 10%, color-mix(in srgb, var(--c-granada) 22%, transparent), transparent 36%),
        radial-gradient(circle at 80% 90%, color-mix(in srgb, var(--c-salvia) 18%, transparent), transparent 36%),
        color-mix(in srgb, var(--c-tinta) 96%, transparent);
    backdrop-filter: blur(12px);
    transition: opacity var(--m-lento) ease, visibility var(--m-lento) ease;
}

.age-gate[hidden] { display: none; }

.age-gate__card {
    width: min(480px, 100%);
    padding: 52px;
    text-align: center;
    background: var(--c-papel);
    border: 1px solid var(--c-linea);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
}

.age-gate .eyebrow { color: var(--c-tinta-3); }
.age-gate h1 {
    margin: 10px 0 16px;
    font: 400 clamp(2.2rem, 7vw, 3.35rem)/.98 var(--serif);
}
.age-gate p { max-width: 350px; margin: 0 auto 26px; color: var(--c-tinta-2); }
.age-gate small { display: block; margin-top: 20px; color: var(--c-tinta-3); }
.age-gate__exit { display: inline-flex; align-items: center; min-height: var(--toque); margin-top: 18px; color: var(--c-tinta-3); font-size:var(--f-sm); text-decoration: underline; text-underline-offset: 4px; }

/* Header */
.announcement {
    color: var(--c-salvia-piel);
    background: var(--c-salvia);
    font-size:var(--f-xs);
    font-weight:var(--p-fuerte);
    letter-spacing: .08em;
    text-transform: uppercase;
}

.announcement__inner {
    display: flex;
    justify-content: center;
    gap: clamp(24px, 6vw, 72px);
    min-height: 36px;
    align-items: center;
}

.announcement i { color: var(--c-salvia-piel); opacity: .75; margin-right: 6px; }

.site-header {
    position: sticky;
    top: 0;
    z-index: var(--z-pegado);
    background: color-mix(in srgb, var(--c-papel) 90%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--c-granada-alt) 8%, transparent);
    backdrop-filter: blur(18px);
}

.header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 76px;
    gap: 24px;
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    flex: none;
}

.brand-mark {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    color: var(--c-papel);
    background:
        radial-gradient(circle at 35% 25%, color-mix(in srgb, var(--c-papel) 25%, transparent), transparent 25%),
        linear-gradient(145deg, var(--c-granada), var(--wine-dark));
    border: 1px solid color-mix(in srgb, var(--c-salvia) 55%, transparent);
    border-radius: var(--r-md) var(--r-md) var(--r-lg) var(--r-lg);
    box-shadow: inset 0 0 0 3px color-mix(in srgb, var(--c-papel) 4%, transparent);
    font: italic 600 1.35rem/1 var(--serif);
}

.brand-mark--large {
    width: 62px;
    height: 62px;
    margin: 0 auto 22px;
    border-radius: var(--r-lg) var(--r-lg) var(--r-lg) var(--r-lg);
    font-size:var(--f-2xl);
}

.brand-copy { display: grid; line-height:var(--i-apretado); }
.brand-copy strong { font: 600 1.28rem/1 var(--serif); letter-spacing: .01em; }
.brand-copy small { margin-top: 5px; color: var(--wine); font-size:var(--f-xs); font-weight:var(--p-fuerte); letter-spacing: .15em; text-transform: uppercase; }

.main-nav {
    display: flex;
    align-items: center;
    gap: clamp(18px, 3vw, 34px);
    margin-left: auto;
}

.main-nav a {
    position: relative;
    color: var(--ink-soft);
    font-size:var(--f-sm);
    font-weight:var(--p-fuerte);
}

.main-nav a::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -7px;
    left: 0;
    height: 1px;
    background: var(--wine);
    transform: scaleX(0);
    transition: transform var(--m-medio) ease;
}

.main-nav a:hover { color: var(--wine); }
.main-nav a:hover::after { transform: scaleX(1); }

.header__actions { display: flex; align-items: center; gap: 10px; }
.menu-button { display: none; }

.cart-button {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 44px;
    padding: 0 9px 0 16px;
    color: var(--wine);
    background: var(--blush);
    border: 1px solid color-mix(in srgb, var(--c-granada-alt) 10%, transparent);
    border-radius:var(--r-redondo);
    font-size:var(--f-xs);
    font-weight:var(--p-fuerte);
    cursor: pointer;
}

.cart-button b {
    display: grid;
    place-items: center;
    min-width: 28px;
    height: 28px;
    padding: 0 7px;
    color: var(--c-papel);
    background: var(--wine);
    border-radius:var(--r-lg);
    font-size:var(--f-xs);
}

/* Hero */
.hero {
    position: relative;
    min-height: min(740px, calc(100vh - 112px));
    overflow: hidden;
    color: var(--c-papel);
    background: var(--wine-deep);
}

.hero__media,
.hero__veil {
    position: absolute;
    inset: 0;
}

.hero__media {
    background: url("../img/hero.webp") 60% center / cover no-repeat;
    filter: saturate(.7) contrast(1.05);
    transform: scale(1.015);
}

.hero__veil {
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--c-tinta) 97%, transparent) 0%, color-mix(in srgb, var(--c-tinta) 88%, transparent) 36%, color-mix(in srgb, var(--c-tinta) 35%, transparent) 69%, color-mix(in srgb, var(--c-tinta) 18%, transparent) 100%),
        linear-gradient(0deg, color-mix(in srgb, var(--c-tinta) 55%, transparent), transparent 45%);
}

.hero__content {
    position: relative;
    z-index: var(--z-base);
    display: flex;
    align-items: center;
    min-height: inherit;
    padding-block: 80px 92px;
}

.hero__copy { width: min(680px, 62%); }
.hero .eyebrow { color: var(--c-tinta-3); }

.hero h1 {
    max-width: 680px;
    margin: 0;
    font: 400 clamp(3.2rem, 6vw, 6.25rem)/.91 var(--serif);
    letter-spacing: -.045em;
}

.hero h1 em {
    color: var(--c-granada);
    font-weight:var(--p-display-fuerte);
}

.hero__lead {
    max-width: 610px;
    margin: 27px 0 32px;
    color: color-mix(in srgb, var(--c-papel) 76%, transparent);
    font-size: clamp(1rem, 1.4vw, 1.13rem);
    line-height:var(--i-suelto);
}

.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero__proof {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 24px;
    margin-top: 34px;
    color: color-mix(in srgb, var(--c-papel) 64%, transparent);
    font-size:var(--f-xs);
    font-weight:var(--p-fuerte);
}
.hero__proof i { margin-right: 6px; color: var(--gold-light); }

/* Benefit strip */
.benefit-strip { position: relative; z-index: var(--z-base); margin-top: -1px; color: var(--c-tinta); background: var(--c-papel); }
.benefit-strip__grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.benefit-strip article {
    display: flex;
    align-items: center;
    gap: 18px;
    min-height: 118px;
    padding: 20px 30px;
    border-right: 1px solid color-mix(in srgb, var(--c-papel) 13%, transparent);
}
.benefit-strip article:first-child { border-left: 1px solid color-mix(in srgb, var(--c-papel) 13%, transparent); }
.benefit-strip article > span { color: color-mix(in srgb, var(--c-papel) 32%, transparent); font: italic 400 2rem/1 var(--serif); }
.benefit-strip strong { display: block; font: 500 1.1rem/1.2 var(--serif); }
.benefit-strip p { margin: 7px 0 0; color: var(--c-tinta-2); font-size:var(--f-sm); line-height:var(--i-medio); }

/* Catalog */
.catalog-section { padding: clamp(80px, 10vw, 132px) 0; background: var(--cream); }
.section-heading {
    display: grid;
    grid-template-columns: 1fr minmax(280px, 420px);
    align-items: end;
    gap: 50px;
    margin-bottom: 48px;
}
.section-heading h2,
.experience h2,
.assistant-cta h2,
.faq-section h2 {
    margin: 0;
    font: 400 clamp(2.5rem, 5vw, 4.7rem)/.98 var(--serif);
    letter-spacing: -.035em;
}
.section-heading > p { margin: 0 0 6px; color: var(--ink-soft); }

.catalog-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 20px;
}
.category-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.filter-chip {
    min-height: 42px;
    padding: 0 18px;
    border: 1px solid var(--line);
    border-radius:var(--r-redondo);
    color: var(--ink-soft);
    background: transparent;
    font-size:var(--f-xs);
    font-weight:var(--p-fuerte);
    cursor: pointer;
    transition: all var(--m-medio) ease;
}
.filter-chip:hover,
.filter-chip.is-active { color: var(--c-papel); background: var(--c-granada); border-color: var(--c-granada); }

.catalog-search {
    display: flex;
    align-items: center;
    width: min(320px, 100%);
    min-height: 46px;
    padding: 0 16px;
    color: var(--ink-soft);
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius:var(--r-redondo);
    box-shadow: var(--shadow-sm);
}
.catalog-search input {
    width: 100%;
    margin-left: 10px;
    border: 0;
    outline: 0;
    color: var(--ink);
    background: transparent;
    font-size:var(--f-sm);
}
.catalog-search input::placeholder { color: var(--c-tinta-3); }
.catalog-meta { display: flex; justify-content: space-between; min-height: 30px; margin-bottom: 18px; color: var(--ink-soft); font-size:var(--f-xs); }
.catalog-meta p { margin: 0; }

.product-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
}

.product-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    background: var(--paper);
    border: 1px solid color-mix(in srgb, var(--c-granada-alt) 8%, transparent);
    border-radius: var(--radius-md);
    box-shadow: 0 12px 34px color-mix(in srgb, var(--c-granada-alt) 5%, transparent);
    transition: transform var(--m-medio) ease, box-shadow var(--m-medio) ease;
}
.product-card:hover { transform: translateY(-7px); box-shadow: 0 24px 52px color-mix(in srgb, var(--c-granada-alt) 13%, transparent); }
.product-card__media {
    position: relative;
    aspect-ratio: 1 / 1.08;
    overflow: hidden;
    background:
        radial-gradient(circle at 30% 25%, color-mix(in srgb, var(--c-papel) 85%, transparent), transparent 30%),
        linear-gradient(145deg, var(--c-lino), var(--c-lino-hondo));
    cursor: pointer;
}
.product-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--m-lento) cubic-bezier(.2,.7,.2,1);
}
.product-card:hover .product-card__media img { transform: scale(1.055); }
.product-card__media.is-placeholder::after {
    content: "B";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: color-mix(in srgb, var(--c-granada-alt) 20%, transparent);
    font: italic 500 5rem/1 var(--serif);
}
.product-badges { position: absolute; top: 14px; left: 14px; display: flex; flex-wrap: wrap; gap: 6px; z-index: var(--z-base); }
.product-badge { padding: 7px 10px; color: var(--wine); background: color-mix(in srgb, var(--c-papel) 92%, transparent); border-radius:var(--r-redondo); font-size:var(--f-xs); font-weight:var(--p-fuerte); letter-spacing: .08em; text-transform: uppercase; backdrop-filter: blur(8px); }
.product-badge--new { color: var(--c-papel); background: var(--c-granada); }
.quick-view {
    position: absolute;
    right: 12px;
    bottom: 12px;
    left: 12px;
    min-height: 42px;
    border: 0;
    border-radius:var(--r-redondo);
    color: var(--ink);
    background: color-mix(in srgb, var(--c-papel) 93%, transparent);
    font-size:var(--f-xs);
    font-weight:var(--p-fuerte);
    opacity: 0;
    transform: translateY(8px);
    cursor: pointer;
    transition: opacity var(--m-medio) ease, transform var(--m-medio) ease;
    backdrop-filter: blur(10px);
}
.product-card:hover .quick-view,
.quick-view:focus-visible { opacity: 1; transform: none; }
.product-card__body { padding: 20px; }
.product-category { margin: 0 0 7px; color: var(--rose); font-size:var(--f-xs); font-weight:var(--p-fuerte); letter-spacing: .12em; text-transform: uppercase; }
.product-card h3 { min-height: 2.5em; margin: 0; font: 500 1.22rem/1.25 var(--serif); }
.product-card__description {
    display: -webkit-box;
    min-height: 3em;
    margin: 11px 0 18px;
    overflow: hidden;
    color: var(--ink-soft);
    font-size:var(--f-xs);
    line-height:var(--i-medio);
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.product-card__footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.product-price { display: grid; }
.product-price strong { color: var(--wine-dark); font-size:var(--f-lg); line-height:var(--i-apretado); }
.product-price small { margin-top: 5px; color: var(--ink-soft); font-size:var(--f-xs); }
.add-button {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    color: var(--c-papel);
    background: var(--wine);
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    transition: transform var(--m-medio) ease, background var(--m-medio) ease;
}
.add-button:hover { background: var(--wine-dark); transform: scale(1.06); }
.add-button:disabled { color: var(--ink-soft); background: var(--c-lino); cursor: not-allowed; }

.product-skeleton {
    min-height: 450px;
    border-radius: var(--radius-md);
    background: linear-gradient(100deg, var(--c-lino) 20%, var(--c-papel) 36%, var(--c-lino) 52%);
    background-size: 200% 100%;
    animation: shimmer var(--m-lento) infinite linear;
}
@keyframes shimmer { to { background-position-x: -200%; } }

.catalog-error { padding: 70px 24px; text-align: center; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-lg); }
.catalog-error i { color: var(--rose); font-size:var(--f-2xl); }
.catalog-error h3 { margin: 16px 0 6px; font: 500 1.8rem/1.2 var(--serif); }
.catalog-error p { margin: 0 0 22px; color: var(--ink-soft); }
.catalog-empty { grid-column: 1 / -1; padding: 64px 20px; text-align: center; color: var(--ink-soft); }
.catalog-empty i { display: block; margin-bottom: 14px; color: var(--rose); font-size:var(--f-2xl); }

/* Experience */
.experience { padding: clamp(80px, 10vw, 132px) 0; background: var(--paper); }
.experience__grid { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr); align-items: center; gap: clamp(50px, 8vw, 100px); }
.experience__image {
    min-height: 620px;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--c-tinta) 6%, transparent), color-mix(in srgb, var(--c-tinta) 35%, transparent)),
        url("../img/hero.webp") 72% center / cover;
    border-radius: var(--r-redondo) var(--r-redondo) var(--r-lg) var(--r-lg);
    box-shadow: var(--shadow-lg);
}
.experience__copy > p:not(.eyebrow) { margin: 24px 0 0; color: var(--ink-soft); font-size:var(--f-md); }
.steps { display: grid; gap: 22px; padding: 0; margin: 38px 0; list-style: none; }
.steps li { display: grid; grid-template-columns: 44px 1fr; gap: 16px; align-items: start; }
.steps li > span { display: grid; place-items: center; width: 42px; height: 42px; color: var(--wine); background: var(--blush); border-radius: 50%; font: italic 500 1.1rem/1 var(--serif); }
.steps strong { display: block; font: 500 1.18rem/1.2 var(--serif); }
.steps p { margin: 6px 0 0; color: var(--ink-soft); font-size:var(--f-sm); line-height:var(--i-medio); }
.inline-link { display: inline-flex; align-items: center; color: var(--wine); font-weight:var(--p-fuerte); font-size:var(--f-sm); }
.inline-link i { margin-left: 10px; transition: transform var(--m-medio) ease; }
.inline-link:hover i { transform: translateX(5px); }

/* CTA & FAQ */
.assistant-cta { padding: 0 0 clamp(80px, 10vw, 130px); background: var(--paper); }
.assistant-cta__card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 30px;
    padding: clamp(34px, 6vw, 64px);
    color: var(--c-papel);
    background:
        radial-gradient(circle at 90% 15%, color-mix(in srgb, var(--c-salvia) 23%, transparent), transparent 33%),
        linear-gradient(135deg, var(--wine-dark), var(--wine));
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
}
.assistant-cta__icon {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    color: var(--gold-light);
    background: color-mix(in srgb, var(--c-papel) 9%, transparent);
    border: 1px solid color-mix(in srgb, var(--c-papel) 15%, transparent);
    border-radius: 50%;
    font-size:var(--f-xl);
}
.assistant-cta .eyebrow { color: var(--gold-light); }
.assistant-cta h2 { font-size: clamp(2.2rem, 4vw, 3.6rem); }
.assistant-cta p:not(.eyebrow) { max-width: 610px; margin: 12px 0 0; color: var(--c-salvia-piel); }
.assistant-cta__actions { display: grid; gap: 10px; min-width: 210px; }

.faq-section { padding: clamp(80px, 10vw, 130px) 0; background: var(--blush); }
.faq__grid { display: grid; grid-template-columns: minmax(280px, .75fr) minmax(0, 1.25fr); gap: clamp(50px, 8vw, 110px); }
.faq__intro { position: sticky; top: 130px; align-self: start; }
.faq__intro > p:not(.eyebrow) { color: var(--ink-soft); }
.faq-list details { border-bottom: 1px solid color-mix(in srgb, var(--c-granada-alt) 16%, transparent); }
.faq-list summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 24px 4px;
    font: 500 1.18rem/1.35 var(--serif);
    cursor: pointer;
    list-style: none;
}
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary i { color: var(--wine); font-size:var(--f-xs); transition: transform var(--m-medio) ease; }
.faq-list details[open] summary i { transform: rotate(45deg); }
.faq-list details p { max-width: 650px; margin: -4px 0 24px; color: var(--ink-soft); }

/* Footer */
.site-footer { padding: 72px 0 28px; color: var(--c-tinta-2); background: var(--c-papel); border-top: 1px solid var(--c-linea); }
.footer__grid { display: grid; grid-template-columns: 1.45fr repeat(3, .72fr); gap: 50px; }
.brand--footer { color: var(--c-tinta); }
.footer__grid > div:first-child > p { max-width: 380px; margin: 22px 0 0; }
.footer__grid h3 { margin: 5px 0 18px; color: var(--c-tinta); font-size:var(--f-xs); letter-spacing: var(--tr-etiqueta); text-transform: uppercase; }
.footer__grid > div:not(:first-child) { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; font-size:var(--f-xs); }
.footer__grid a:hover { color: var(--c-granada); }
.footer__grid i { width: 18px; margin-right: 5px; color: var(--gold-light); }
.footer__bottom { display: flex; justify-content: space-between; gap: 20px; margin-top: 58px; padding-top: 22px; border-top: 1px solid color-mix(in srgb, var(--c-papel) 10%, transparent); color: color-mix(in srgb, var(--c-papel) 42%, transparent); font-size:var(--f-xs); }
.footer__bottom p { margin: 0; }

/* Cart drawer */
.drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: var(--z-velo);
    background: color-mix(in srgb, var(--c-tinta) 55%, transparent);
    backdrop-filter: blur(4px);
}
.cart-drawer {
    position: fixed;
    top: 0;
    right: 0;
    z-index: var(--z-panel);
    display: flex;
    flex-direction: column;
    width: min(480px, 100vw);
    height: 100dvh;
    padding: 26px;
    background: var(--paper);
    box-shadow: -30px 0 70px color-mix(in srgb, var(--c-tinta) 20%, transparent);
    transform: translateX(102%);
    transition: transform var(--m-lento) cubic-bezier(.2,.7,.2,1);
}
.cart-drawer.is-open { transform: none; }
.cart-drawer__header { display: flex; align-items: center; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.cart-drawer__header .eyebrow { margin-bottom: 4px; }
.cart-drawer h2 { margin: 0; font: 500 2rem/1 var(--serif); }
.cart-shipping-progress { padding: 18px 0; border-bottom: 1px solid var(--line); }
.cart-shipping-progress p { margin: 0 0 9px; color: var(--ink-soft); font-size:var(--f-xs); }
.cart-shipping-progress > div { height: 5px; overflow: hidden; background: var(--blush); border-radius:var(--r-lg); }
.cart-shipping-progress span { display: block; width: 0; height: 100%; background: linear-gradient(90deg, var(--rose), var(--wine)); border-radius: inherit; transition: width var(--m-lento) ease; }
.cart-items { flex: 1; overflow-y: auto; padding: 8px 2px; }
.cart-empty { display: grid; place-items: center; min-height: 330px; padding: 30px; text-align: center; color: var(--ink-soft); }
.cart-empty i { display: block; margin-bottom: 16px; color: var(--rose); font-size:var(--f-2xl); }
.cart-empty strong { display: block; margin-bottom: 6px; color: var(--ink); font: 500 1.4rem/1.2 var(--serif); }
.cart-item { display: grid; grid-template-columns: 82px 1fr auto; gap: 14px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--line); }
.cart-item img { width: 82px; height: 92px; object-fit: cover; background: var(--blush); border-radius:var(--r-md); }
.cart-item h3 { margin: 0; font: 500 1rem/1.25 var(--serif); }
.cart-item__price { display: block; margin-top: 4px; color: var(--wine); font-size:var(--f-xs); font-weight:var(--p-fuerte); }
.quantity-control { display: inline-flex; align-items: center; gap: 12px; margin-top: 10px; padding: 4px; background: var(--blush); border-radius:var(--r-lg); }
.quantity-control button { display: grid; place-items: center; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 50%; color: var(--wine); background: var(--c-papel); cursor: pointer; }
.quantity-control span { min-width: 16px; text-align: center; font-size:var(--f-xs); font-weight:var(--p-fuerte); }
.cart-item__remove { align-self: start; padding: 6px; border: 0; color: var(--c-tinta-3); background: none; cursor: pointer; }
.cart-drawer__footer { padding-top: 18px; border-top: 1px solid var(--line); }
.cart-drawer__footer > div { display: flex; justify-content: space-between; margin-bottom: 7px; color: var(--ink-soft); font-size:var(--f-xs); }
.cart-drawer__footer .cart-total { margin: 14px 0 18px; padding-top: 14px; border-top: 1px solid var(--line); color: var(--ink); font-size:var(--f-md); }
.cart-drawer__footer .cart-total strong { color: var(--wine); font-size:var(--f-lg); }
.cart-drawer__footer > small { display: block; margin-top: 10px; color: var(--c-tinta-3); text-align: center; }

/* Product modal */
.product-modal {
    position: fixed;
    inset: 0;
    z-index: var(--z-panel);
    display: grid;
    place-items: center;
    padding: 24px;
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--m-medio) ease, visibility var(--m-medio) ease;
}
.product-modal.is-open { opacity: 1; visibility: visible; }
.product-modal__backdrop { position: absolute; inset: 0; background: color-mix(in srgb, var(--c-tinta) 72%, transparent); backdrop-filter: blur(6px); }
.product-modal__panel {
    position: relative;
    z-index: var(--z-base);
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: min(940px, 100%);
    max-height: min(760px, calc(100dvh - 48px));
    overflow: auto;
    background: var(--paper);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    transform: translateY(18px) scale(.98);
    transition: transform var(--m-medio) ease;
}
.product-modal.is-open .product-modal__panel { transform: none; }
.product-modal__close { position: absolute; top: 16px; right: 16px; z-index: var(--z-base); background: color-mix(in srgb, var(--c-papel) 92%, transparent); }
.product-modal__gallery { display: flex; flex-direction: column; min-height: 560px; padding: 24px; background: var(--blush); border-radius: var(--radius-lg) 0 0 var(--radius-lg); }
.product-modal__gallery > img { width: 100%; min-height: 0; flex: 1; object-fit: cover; border-radius: var(--radius-md); }
.product-modal__thumbs { display: flex; gap: 8px; margin-top: 12px; overflow-x: auto; }
.product-modal__thumbs button { flex: none; width: 58px; height: 58px; padding: 2px; border: 2px solid transparent; border-radius:var(--r-md); background: var(--c-papel); cursor: pointer; }
.product-modal__thumbs button.is-active { border-color: var(--wine); }
.product-modal__thumbs img { width: 100%; height: 100%; object-fit: cover; border-radius:var(--r-sm); }
.product-modal__content { display: flex; flex-direction: column; justify-content: center; padding: clamp(34px, 6vw, 66px); }
.product-modal__content h2 { margin: 0; font: 500 clamp(2.2rem, 4vw, 3.7rem)/.98 var(--serif); }
.product-modal__description { margin: 22px 0; color: var(--ink-soft); }
.product-modal__price { display: grid; margin: 6px 0 24px; }
.product-modal__price strong { color: var(--wine); font-size:var(--f-2xl); }
.product-modal__price span { color: var(--ink-soft); font-size:var(--f-xs); }
.product-modal__trust { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 18px; color: var(--ink-soft); font-size:var(--f-xs); }
.product-modal__trust i { margin-right: 5px; color: var(--wine); }

.toast {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: var(--z-aviso);
    max-width: min(380px, calc(100vw - 48px));
    padding: 14px 18px;
    color: var(--c-papel);
    background: var(--wine-deep);
    border: 1px solid color-mix(in srgb, var(--c-papel) 13%, transparent);
    border-radius:var(--r-md);
    box-shadow: var(--shadow-lg);
    opacity: 0;
    transform: translateY(14px);
    pointer-events: none;
    transition: opacity var(--m-medio) ease, transform var(--m-medio) ease;
}
.toast.is-visible { opacity: 1; transform: none; }

/* Checkout & thank you */
.checkout-page { min-height: 100vh; background: var(--cream); }
.simple-header { background: var(--paper); border-bottom: 1px solid var(--line); }
.simple-header__inner { display: flex; align-items: center; justify-content: space-between; min-height: 82px; }
.simple-header__secure { color: var(--ink-soft); font-size:var(--f-xs); font-weight:var(--p-fuerte); }
.simple-header__secure i { color: var(--success); margin-right: 6px; }
.checkout-main { padding: 54px 0 90px; }
.checkout-heading { margin-bottom: 34px; }
.checkout-heading h1 { margin: 0; font: 500 clamp(2.7rem, 5vw, 4.5rem)/1 var(--serif); }
.checkout-heading p { margin: 12px 0 0; color: var(--ink-soft); }
.checkout-layout { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(340px, .7fr); gap: 34px; align-items: start; }
.checkout-card { padding: clamp(24px, 4vw, 38px); background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.checkout-card + .checkout-card { margin-top: 20px; }
.checkout-card h2 { display: flex; align-items: center; gap: 12px; margin: 0 0 24px; font: 500 1.55rem/1.2 var(--serif); }
.checkout-card h2 span { display: grid; place-items: center; width: 32px; height: 32px; color: var(--c-papel); background: var(--wine); border-radius: 50%; font: 700 .72rem/1 var(--sans); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.form-field { display: grid; gap: 7px; }
.form-field--full { grid-column: 1 / -1; }
.form-field label { color: var(--ink); font-size:var(--f-xs); font-weight:var(--p-fuerte); }
.form-field label span { color: var(--rose); }
.form-field input,
.form-field textarea,
.form-field select {
    width: 100%;
    min-height: 50px;
    padding: 12px 14px;
    border: 1px solid color-mix(in srgb, var(--c-granada-alt) 18%, transparent);
    border-radius:var(--r-md);
    color: var(--ink);
    background: var(--c-papel);
    outline: 0;
    transition: border-color var(--m-medio) ease, box-shadow var(--m-medio) ease;
}
.form-field textarea { min-height: 92px; resize: vertical; }
.form-field input:focus,
.form-field textarea:focus,
.form-field select:focus { border-color: var(--wine); box-shadow: 0 0 0 4px color-mix(in srgb, var(--c-granada-alt) 8%, transparent); }
.form-field small { color: var(--ink-soft); font-size:var(--f-xs); }
.checkout-summary { position: sticky; top: 110px; }
.checkout-summary__items { display: grid; gap: 16px; max-height: 360px; margin-bottom: 22px; overflow-y: auto; }
.summary-item { display: grid; grid-template-columns: 64px 1fr auto; gap: 12px; align-items: center; }
.summary-item__image { position: relative; }
.summary-item img { width: 64px; height: 72px; object-fit: cover; border-radius:var(--r-md); background: var(--blush); }
.summary-item__qty { position: absolute; top: -7px; right: -7px; display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 5px; color: var(--c-papel); background: var(--wine); border: 2px solid var(--c-papel); border-radius:var(--r-lg); font-size:var(--f-xs); font-weight:var(--p-fuerte); }
.summary-item h3 { margin: 0; font: 500 .97rem/1.25 var(--serif); }
.summary-item small { color: var(--ink-soft); font-size:var(--f-xs); }
.summary-item strong { color: var(--wine); font-size:var(--f-xs); }
.summary-totals { padding-top: 18px; border-top: 1px solid var(--line); }
.summary-totals > div { display: flex; justify-content: space-between; margin-bottom: 8px; color: var(--ink-soft); font-size:var(--f-xs); }
.summary-totals__total { margin-top: 16px !important; padding-top: 16px; border-top: 1px solid var(--line); color: var(--ink) !important; font-size:var(--f-md) !important; }
.summary-totals__total strong { color: var(--wine); font-size:var(--f-xl); }
.payment-note { display: flex; gap: 10px; margin: 16px 0; padding: 13px; color: var(--ink-soft); background: var(--blush); border-radius:var(--r-md); font-size:var(--f-xs); }
.payment-note i { color: var(--success); margin-top: 3px; }
.checkout-error { margin: 14px 0 0; padding: 12px 14px; color: var(--danger); background: var(--c-lino); border-radius:var(--r-md); font-size:var(--f-xs); }
.checkout-empty { padding: 80px 20px; text-align: center; }
.checkout-empty i { color: var(--rose); font-size:var(--f-3xl); }
.checkout-empty h1 { margin: 18px 0 8px; font: 500 2.4rem/1.1 var(--serif); }
.checkout-empty p { color: var(--ink-soft); }
.loading-spinner { animation: spin var(--m-lento) linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.thankyou-main { display: grid; place-items: center; min-height: calc(100vh - 83px); padding: 50px 20px; }
.thankyou-card { width: min(650px, 100%); padding: clamp(34px, 7vw, 64px); text-align: center; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }
.status-icon { display: grid; place-items: center; width: 82px; height: 82px; margin: 0 auto 24px; color: var(--wine); background: var(--blush); border-radius: 50%; font-size:var(--f-2xl); }
.status-icon.is-success { color: var(--success); background: var(--c-lino); }
.status-icon.is-error { color: var(--danger); background: var(--c-lino); }
.thankyou-card h1 { margin: 0; font: 500 clamp(2.3rem, 6vw, 4rem)/1 var(--serif); }
.thankyou-card > p { max-width: 470px; margin: 16px auto 28px; color: var(--ink-soft); }
.order-reference { margin: 0 auto 28px; padding: 14px 18px; color: var(--ink-soft); background: var(--cream); border-radius:var(--r-md); font-size:var(--f-xs); }
.order-reference strong { color: var(--ink); }
.thankyou-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; }

@media (max-width: 1040px) {
    .main-nav { gap: 18px; }
    .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .assistant-cta__card { grid-template-columns: auto 1fr; }
    .assistant-cta__actions { grid-column: 2; display: flex; }
    .footer__grid { grid-template-columns: 1.4fr repeat(2, 1fr); }
    .footer__grid > div:last-child { grid-column: 2 / -1; flex-direction: row; flex-wrap: wrap; }
}

@media (max-width: 820px) {
    :root { --container: min(100% - 30px, 680px); }
    .announcement__inner span:nth-child(2) { display: none; }
    .main-nav {
        position: fixed;
        top: 113px;
        right: 15px;
        left: 15px;
        display: grid;
        gap: 0;
        padding: 14px;
        background: var(--paper);
        border: 1px solid var(--line);
        border-radius:var(--r-lg);
        box-shadow: var(--shadow-lg);
        opacity: 0;
        visibility: hidden;
        transform: translateY(-8px);
        transition: var(--m-medio) ease;
    }
    .main-nav.is-open { opacity: 1; visibility: visible; transform: none; }
    .main-nav a { padding: 13px 12px; }
    .main-nav a::after { display: none; }
    .menu-button { display: inline-grid; }
    .cart-button span { display: none; }
    .hero { min-height: 690px; }
    .hero__media { background-position: 66% center; opacity: .72; }
    .hero__veil { background: linear-gradient(90deg, color-mix(in srgb, var(--c-tinta) 96%, transparent), color-mix(in srgb, var(--c-tinta) 66%, transparent)), linear-gradient(0deg, color-mix(in srgb, var(--c-tinta) 76%, transparent), transparent 60%); }
    .hero__copy { width: min(620px, 100%); }
    .benefit-strip__grid { grid-template-columns: 1fr; }
    .benefit-strip article { min-height: 96px; border-right: 0; border-bottom: 1px solid color-mix(in srgb, var(--c-papel) 13%, transparent); }
    .benefit-strip article:first-child { border-left: 0; }
    .section-heading { grid-template-columns: 1fr; gap: 20px; }
    .catalog-toolbar { align-items: stretch; flex-direction: column; }
    .catalog-search { width: 100%; }
    .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .experience__grid { grid-template-columns: 1fr; }
    .experience__image { min-height: 520px; order: 2; }
    .assistant-cta__card { grid-template-columns: 1fr; text-align: center; }
    .assistant-cta__icon { margin-inline: auto; }
    .assistant-cta__actions { grid-column: auto; justify-content: center; }
    .faq__grid { grid-template-columns: 1fr; }
    .faq__intro { position: static; }
    .footer__grid { grid-template-columns: 1fr 1fr; }
    .footer__grid > div:first-child { grid-column: 1 / -1; }
    .footer__grid > div:last-child { grid-column: 1 / -1; }
    .product-modal__panel { grid-template-columns: 1fr; }
    .product-modal__gallery { min-height: 410px; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
    .checkout-layout { grid-template-columns: 1fr; }
    .checkout-summary { position: static; }
}

@media (max-width: 560px) {
    .announcement__inner { justify-content: space-between; gap: 10px; font-size:var(--f-xs); }
    .announcement__inner span:nth-child(3) { display: none; }
    .header__inner { min-height: 70px; }
    .brand-copy strong { font-size:var(--f-lg); }
    .brand-copy small { font-size:var(--f-xs); }
    .brand-mark { width: 36px; height: 36px; }
    .main-nav { top: 106px; }
    .hero { min-height: calc(100svh - 106px); }
    .hero__content { padding-block: 66px; align-items: end; }
    .hero h1 { font-size: clamp(3rem, 15vw, 4.4rem); }
    .hero__lead { font-size:var(--f-md); line-height:var(--i-suelto); }
    .hero__actions { flex-direction: column; align-items: stretch; }
    .hero__proof { gap: 10px 15px; }
    .benefit-strip article { padding-inline: 8px; }
    .catalog-section, .experience, .faq-section { padding-block: 76px; }
    .section-heading h2, .experience h2, .faq-section h2 { font-size:var(--f-3xl); }
    .category-filters { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
    .filter-chip { flex: none; }
    .product-grid { gap: 12px; }
    .product-card__body { padding: 14px; }
    .product-card h3 { font-size:var(--f-md); }
    .product-card__description { display: none; }
    .product-card__footer { align-items: end; }
    .product-price strong { font-size:var(--f-sm); }
    .product-price small { max-width: 84px; line-height:var(--i-medio); }
    .add-button { width: 38px; height: 38px; }
    .quick-view { display: none; }
    .product-skeleton { min-height: 330px; }
    .experience__image { min-height: 400px; }
    .assistant-cta__card { padding: 34px 22px; border-radius:var(--r-lg); }
    .assistant-cta__actions { display: grid; }
    .footer__grid { grid-template-columns: 1fr; gap: 34px; }
    .footer__grid > div:first-child,
    .footer__grid > div:last-child { grid-column: auto; }
    .footer__grid > div:last-child { flex-direction: column; }
    .footer__bottom { flex-direction: column; }
    .age-gate__card { padding: 38px 24px; }
    .cart-drawer { padding: 20px; }
    .product-modal { padding: 0; }
    .product-modal__panel { max-height: 100dvh; height: 100dvh; border-radius: 0; }
    .product-modal__gallery { min-height: 46vh; padding: 18px; border-radius: 0; }
    .product-modal__content { padding: 28px 22px 40px; }
    .form-grid { grid-template-columns: 1fr; }
    .form-field--full { grid-column: auto; }
    .simple-header__secure { font-size: 0; }
    .simple-header__secure i { font-size:var(--f-md); }
    .checkout-main { padding-top: 36px; }
    .checkout-card { padding: 22px 18px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* ===========================================================================
   PIE LEGAL Y PAGINAS LEGALES
   ---------------------------------------------------------------------------
   Estaba escrito a pelo dentro del HTML: un bloque <style> de 13 reglas en cada
   una de las tres paginas legales, y un style="" en el pie del checkout y del
   gracias. Todos con los colores del tema OSCURO anterior (#090609, #d8b96f,
   #a5959e). Al pasar la tienda al sistema "Botica" esas cinco paginas se
   quedaban como una isla negra dentro de una tienda de lino, y el aviso de
   tratamiento de datos del checkout (#cfc2c9) quedaba ilegible sobre el fondo
   claro, que es justo el texto que la Ley 1581 obliga a mostrar.
   Traido aqui y escrito con fichas. Cero literales.
   =========================================================================== */

.legal-page { min-height: 100vh; }

.legal-header { padding: var(--e-5) 0; background: var(--c-papel); border-bottom: 1px solid var(--c-linea); }
.legal-header__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--e-4); max-width: 1000px; margin: 0 auto; padding: 0 var(--e-5); }
.legal-header img { height: 45px; }

.legal-container { max-width: var(--ancho-lectura); margin: var(--e-7) auto; padding: 0 var(--e-5) var(--e-9); line-height: var(--i-suelto); }
.legal-container h1 { margin-bottom: var(--e-3); color: var(--c-tinta); font-family: var(--f-display); font-size: var(--f-2xl); }
.legal-container h2 { margin-top: var(--e-6); padding-bottom: var(--e-2); border-bottom: 1px solid var(--c-linea); color: var(--c-tinta); font-size: var(--f-xl); }
.legal-container p, .legal-container li { margin-bottom: var(--e-4); color: var(--c-tinta-2); font-size: var(--f-md); }
.legal-container ul { padding-left: var(--e-5); }
.legal-container a { color: var(--c-granada); }

.legal-box { margin: var(--e-5) 0; padding: var(--e-5); background: var(--c-papel); border: 1px solid var(--c-linea); border-radius: var(--r-md); }

/* Un solo pie para las cinco paginas sin cabecera de tienda. */
.legal-footer { padding: var(--e-5) 0; border-top: 1px solid var(--c-linea); background: var(--c-papel); color: var(--c-tinta-3); font-size: var(--f-xs); text-align: center; }
.legal-footer p { margin: 0; }
.legal-footer p + p { margin-top: var(--e-2); }
.legal-footer a { margin: 0 var(--e-2); color: var(--c-tinta-2); text-decoration: none; }
.legal-footer a:hover { color: var(--c-granada); text-decoration: underline; }

/* El consentimiento de datos del checkout. Es texto legal obligatorio: va en
   tinta secundaria (8,3:1 sobre lino), nunca en un gris de tema oscuro. */
.legal-consent { margin: var(--e-4) 0; }
.legal-consent label { display: flex; align-items: flex-start; gap: var(--e-2); color: var(--c-tinta-2); font-size: var(--f-sm); line-height: var(--i-medio); cursor: pointer; }
.legal-consent input[type="checkbox"] { flex: none; width: var(--e-4); height: var(--e-4); margin-top: 2px; accent-color: var(--c-granada); }
.legal-consent a { color: var(--c-granada); text-decoration: underline; }

/* Restos del tema oscuro que iban en style="" dentro del HTML: el dorado
   #d8b96f sobre el lino nuevo da 1,7:1 — invisible. Los enlaces legales del pie
   de la portada eran de los peores casos. */
.legal-links { margin: var(--e-2) 0; font-size: var(--f-sm); }
.legal-links a { color: var(--c-tinta-2); text-decoration: none; }
.legal-links a:hover { color: var(--c-granada); text-decoration: underline; }
.legal-volver { color: var(--c-tinta-2); font-size: var(--f-sm); text-decoration: none; }
.legal-volver:hover { color: var(--c-granada); }
.legal-container ol { padding-left: var(--e-5); color: var(--c-tinta-2); }
.legal-container ol li { margin-bottom: var(--e-3); }
