/* Sistema visual compartido de Le Cellier.
   Esta hoja se carga al final para mantener una jerarquía tipográfica legible
   y coherente en todas las páginas. */

@font-face {
  font-display: swap;
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400 700;
  src: url("recursos/fuentes/manrope-latin.woff2") format("woff2");
}

@font-face {
  font-display: swap;
  font-family: "Archivo";
  font-style: normal;
  font-weight: 400 700;
  src: url("recursos/fuentes/archivo-latin.woff2") format("woff2");
}

@font-face {
  font-display: swap;
  font-family: "Archivo";
  font-style: italic;
  font-weight: 400 700;
  src: url("recursos/fuentes/archivo-italic-latin.woff2") format("woff2");
}

:root {
  --display: "Archivo", Arial, sans-serif;
  --sans: "Manrope", Arial, sans-serif;
  --ink: #091d0c;
  --ink-soft: #3f4c42;
  --cream: #ffffff;
  --paper: #f7f7f4;
  --accent: #b8785c;
  --accent-ink: #8b4d38;
  --copper: var(--accent-ink);
  --copper-light: var(--accent);
  --cart-copper: var(--accent-ink);
  --checkout-copper: var(--accent-ink);
  --line: rgba(29, 42, 38, .22);
  --control-radius: 8px;
  --control-radius-round: 999px;
  --text-caption: clamp(.75rem, .73rem + .08vw, .8125rem);
  --text-ui: clamp(.8125rem, .79rem + .1vw, .875rem);
  --text-body: clamp(.9375rem, .9rem + .14vw, 1rem);
  --text-lead: clamp(1rem, .95rem + .22vw, 1.125rem);
}

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  background: var(--cream);
  color: var(--ink);
  font-family: var(--sans);
  font-size: var(--text-body);
  font-synthesis: none;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
}

button,
input,
select,
textarea {
  font-family: var(--sans);
}

input,
select,
textarea {
  font-size: 1rem;
}

.header-search input::placeholder,
.catalog-search input::placeholder,
.mobile-search input::placeholder,
.checkout-page input::placeholder,
.checkout-page textarea::placeholder,
.account-page input::placeholder,
.booking-fields input::placeholder,
.invitations-form input::placeholder {
  color: #5f685f;
  opacity: 1;
}

h1,
h2,
h3,
.cart-item-copy a,
.settings-block-heading h3 {
  font-family: var(--display);
  font-variation-settings: "wdth" 100;
  text-wrap: balance;
}

.shop-title-block h1,
.product-info h1,
.cart-heading h1,
.checkout-form-column h1,
.account-section-heading h2,
.policy-section h2 {
  font-weight: 500;
}

p,
li,
dd,
blockquote {
  text-wrap: pretty;
}

h1 em,
h2 em,
h3 em {
  display: inline-block;
  line-height: 1.1;
  padding-bottom: .06em;
}

:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

/* Lenguaje compartido de acciones.
   El botón de pago de Bold vive dentro de su propio componente y queda fuera
   de estas reglas para conservar exactamente su apariencia oficial. */
button:not([id^="boldPaymentButton"]) {
  border-radius: var(--control-radius);
}

:where(
  .button,
  .home-button,
  .home-hero-cta,
  .cart-primary-button,
  .checkout-primary,
  .checkout-secondary,
  .account-primary-button,
  .account-secondary-button,
  .account-danger-button,
  .add-button,
  .product-page .favorite-button,
  .product-page .outline-button,
  .origin-apply,
  .clear-filters,
  .shop-outline-button,
  .tastings-status-actions button,
  .tastings-status-actions a,
  .booking-primary,
  .invitations-form button,
  .payment-result-primary,
  .payment-result-secondary
) {
  border-radius: var(--control-radius);
}

:where(
  .button,
  .home-button,
  .home-hero-cta,
  .cart-primary-button,
  .checkout-primary,
  .checkout-secondary,
  .account-primary-button,
  .account-secondary-button,
  .account-danger-button,
  .add-button,
  .product-page .favorite-button,
  .product-page .outline-button,
  .origin-apply,
  .clear-filters,
  .shop-outline-button,
  .tastings-status-actions button,
  .tastings-status-actions a,
  .booking-primary,
  .invitations-form button,
  .payment-result-primary,
  .payment-result-secondary
):not(:disabled):active {
  transform: translateY(1px) scale(.98);
}

.shop-outline-button {
  border: 1px solid currentColor;
  padding: 10px 14px;
  transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

.home-hero-cta {
  border: 1px solid rgba(255, 255, 255, .78);
  min-height: 46px;
  padding: 0 16px;
}

.shop-outline-button:hover {
  background: var(--shop-accent);
  color: #fff;
  transform: translateY(-2px);
}

.clear-filters {
  border-radius: var(--control-radius);
}

.cart-quantity,
.quantity-control {
  border-radius: var(--control-radius);
  overflow: hidden;
}

.thumbnail,
.dialog-close,
.home-slider-controls button,
.filter-mobile-head button {
  border-radius: var(--control-radius);
}

.image-expand,
.dialog-close,
  .home-slider-controls button,
.header-search-toggle,
.header-search-close,
.filter-mobile-head button {
  border-radius: var(--control-radius-round);
}

.cart-quantity button,
.quantity-control button {
  border-radius: 0;
}

.booking-back,
.booking-secondary {
  border: 1px solid var(--tasting-accent);
  border-radius: var(--control-radius) !important;
  padding: 10px 14px;
  transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

.booking-back:hover,
.booking-secondary:hover {
  background: #fff;
  color: var(--tasting-accent-deep);
}

.home-slider-controls button {
  transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

.home-slider-controls button:hover {
  background: var(--paper);
  color: var(--accent-ink);
}

/* Navegación y pie globales */
.skip-link,
.location-trigger,
.location-option,
.desktop-nav-links a,
.header-search-copy small,
.header-search-price,
.header-search-status,
.header-search-all,
.cart-count {
  font-size: var(--text-caption);
  line-height: 1.4;
}

.header-search input {
  font-size: var(--text-ui);
}

.header-search-copy strong {
  font-size: 1rem;
  line-height: 1.3;
}

.footer-column h2 {
  font-size: var(--text-ui);
  letter-spacing: .06em;
}

.footer-column a {
  color: rgba(247, 247, 244, .74);
  font-size: var(--text-ui);
  line-height: 1.55;
}

.footer-notices p,
.footer-bottom {
  color: rgba(247, 247, 244, .68);
  font-size: var(--text-caption);
  line-height: 1.55;
}

/* Portada */
.home-kicker,
.home-category-name,
.home-promo-copy small,
.home-campaign-copy small,
.home-promo-copy > span,
.home-campaign-copy > span,
.home-featured-status,
.home-visit-mark span,
.home-visit-details strong {
  font-size: var(--text-caption);
  line-height: 1.4;
}

.home-button,
.home-text-link,
.home-inline-link,
.home-hero-cta,
.home-filter-list button {
  font-size: var(--text-ui);
  line-height: 1.35;
}

.home-benefit h2 {
  font-size: 1rem;
  line-height: 1.3;
}

.home-benefit p,
.home-visit-details p {
  font-size: .875rem;
  line-height: 1.55;
}

.home-section-heading > p {
  font-size: var(--text-body);
  line-height: 1.7;
  max-width: 62ch;
}

/* Tienda y explorador de origen */
body {
  --shop-ink: #142018;
  --shop-muted: #5f685f;
  --shop-paper: #f7f7f4;
  --shop-white: #ffffff;
  --shop-accent: var(--accent-ink);
  --shop-green: #091d0c;
  --shop-line: #d9ddd7;
  --shop-card: #ffffff;
}

.shop-breadcrumbs,
.origin-bar-copy small,
.origin-selection-summary,
.origin-toggle-label,
.origin-clear,
.origin-breadcrumbs button,
.origin-map-toolbar > p,
.origin-map-loading,
.origin-map-canvas .map-region-marker text,
.origin-map-tooltip,
.origin-eyebrow,
.origin-detail-facts dt,
.filter-heading,
.filter-section summary,
.filter-count,
.filter-checks label,
.origin-mobile-fields label,
.origin-mobile-detail dt,
.origin-mobile-detail dd {
  font-size: var(--text-caption);
  line-height: 1.45;
}

.catalog-count,
.sort-control,
.sort-control select,
.origin-apply,
.catalog-search input,
.filter-checkbox-row,
.filter-country-row,
.filter-section select,
.price-range > div,
.clear-filters,
.filter-toggle,
.mobile-search input,
.shop-outline-button,
.shop-toast {
  font-size: var(--text-ui);
  line-height: 1.45;
}

.shop-title-block p,
.origin-detail-copy,
.origin-detail-facts dd,
.origin-mobile-detail p,
.catalog-state p {
  font-size: var(--text-body);
  line-height: 1.65;
  max-width: 58ch;
}

/* Ficha de producto */
.breadcrumbs,
.product-kicker,
.section-label,
.wine-details dt,
.price span,
.stock-note,
.map-france span,
.map-pin small {
  font-size: var(--text-caption);
  line-height: 1.45;
}

.feature strong,
.feature small,
.rating-line,
.wine-details dd,
.details-toggle,
.details-extra,
.tax-note,
.quantity-control button,
.quantity-control output,
.add-button,
.favorite-button,
.service-list li,
.outline-button,
.map-france,
.toast,
.mobile-buy-bar .add-button {
  font-size: var(--text-ui);
  line-height: 1.45;
}

.product-status p,
.product-description,
.origin-copy p:not(.section-label),
.tasting-note p,
.tasting-note span:last-child {
  font-size: var(--text-body);
  line-height: 1.7;
}

.add-button,
.cart-primary-button,
.checkout-primary {
  background: var(--accent-ink);
  border-color: var(--accent-ink);
}

.add-button:hover,
.checkout-primary:hover {
  background: #713a2b;
}

.product-features {
  display: grid;
  gap: 18px 16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  justify-content: initial;
}

.feature {
  align-items: flex-start;
}

.feature strong,
.feature small {
  white-space: normal;
}

/* Carrito */
.cart-breadcrumbs,
.cart-kicker,
.cart-loading p,
.cart-list-heading,
.cart-total small,
.cart-summary-note {
  font-size: var(--text-caption);
  line-height: 1.45;
}

.cart-item-copy p,
.cart-quantity output,
.cart-item-total,
.cart-continue,
.cart-summary dl div,
.cart-total span,
.cart-primary-button,
.cart-notice {
  font-size: var(--text-ui);
  line-height: 1.5;
}

.cart-remove {
  font-size: var(--text-ui);
  line-height: 1.45;
}

.cart-intro,
.cart-empty > p:not(.cart-kicker) {
  font-size: var(--text-body);
  line-height: 1.7;
}

.cart-summary-note,
.cart-summary dt {
  color: var(--cart-muted);
}

.checkout-summary-top > a,
.checkout-summary-item p,
.checkout-summary dt,
.checkout-delivery-note {
  color: var(--checkout-muted);
}

/* Checkout */
.checkout-steps,
.checkout-loading p,
.checkout-kicker,
.checkout-fields label > span,
.checkout-fields small,
.checkout-simulation-note,
.checkout-summary-top > a,
.checkout-summary-item p,
.checkout-summary dl div,
.checkout-summary-total span,
.checkout-summary-total small,
.checkout-delivery-note,
.success-order span,
.success-status span {
  font-size: var(--text-caption);
  line-height: 1.5;
}

.checkout-session-note,
.checkout-consents label,
.checkout-message,
.checkout-summary-item > span,
.success-item,
.success-total,
.checkout-secondary {
  font-size: var(--text-ui);
  line-height: 1.55;
}

.checkout-primary {
  font-size: var(--text-ui);
  line-height: 1.35;
}

.checkout-form-column header > p:last-child,
.success-intro,
.checkout-error-state > p:not(.checkout-kicker) {
  font-size: var(--text-body);
  line-height: 1.7;
}

/* Cuenta */
.account-loading p,
.account-kicker,
.auth-visual-copy > p,
.auth-visual-copy > span,
.account-field > span:first-child,
.account-heading > p,
.account-section-heading > p,
.account-section-heading span,
.settings-block-heading p,
.account-order header p,
.account-order footer span,
.account-mobile-nav label {
  font-size: var(--text-caption);
  line-height: 1.5;
}

.auth-mode-switch button,
.password-input button,
.account-check,
.account-primary-button,
.account-secondary-button,
.account-danger-button,
.account-text-button,
.form-note,
.account-message,
.account-sidebar nav button,
.account-sidebar nav button span,
.account-sidebar-signout,
.account-preference strong,
.deletion-status,
.account-order header > strong,
.account-order-items div,
.account-orders-loading {
  font-size: var(--text-ui);
  line-height: 1.5;
}

.account-field input,
.account-mobile-nav select {
  font-size: 1rem;
}

.auth-intro,
.auth-confirmation p,
.consent-gate > div > p:not(.account-kicker),
.account-empty-state p,
.account-dialog form > p:not(.account-kicker) {
  font-size: var(--text-body);
  line-height: 1.7;
}

/* Catas y formularios de reserva */
.tastings-page {
  --tasting-bg: #ffffff;
  --tasting-surface: #f7f7f4;
  --tasting-surface-strong: #efefec;
  --tasting-ink: #142018;
  --tasting-copy: #465047;
  --tasting-muted: #656d65;
  --tasting-accent: #b8785c;
  --tasting-accent-deep: #8b4d38;
  --tasting-reserve: #8b4d38;
  --tasting-reserve-hover: #713a2b;
}

.tastings-kicker,
.tasting-availability,
.tasting-card-meta,
.tasting-price,
.tasting-action,
.tasting-wines li span,
.tasting-card-date span,
.tasting-meta dt,
.tasting-host p,
.booking-options legend,
.booking-option-copy span,
.booking-option > strong,
.booking-mode,
.booking-fields label > span,
.invitations-form label > span,
.invitations-form > small,
.booking-success > div span {
  font-size: var(--text-caption);
  line-height: 1.5;
}

.tasting-price strong,
.tasting-meta dd,
.tasting-includes li,
.tasting-host strong,
.tasting-host span,
.booking-summary span,
.booking-availability,
.booking-consents label,
.invitations-consent,
.booking-message,
.invitations-message,
.booking-success dl div,
.booking-success > a {
  font-size: var(--text-ui);
  line-height: 1.55;
}

.booking-primary,
.booking-back,
.booking-secondary,
.invitations-form button {
  font-size: var(--text-ui);
  line-height: 1.35;
}

.tasting-editorial {
  grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr);
}

.tastings-status,
.tastings-hero-copy > span,
.tasting-card-excerpt,
.tasting-detail-excerpt,
.tasting-about > p:last-child,
.waitlist-form > p:not(.tastings-kicker),
.booking-success > p:not(.tastings-kicker),
.invitations-copy > p:last-child {
  font-size: var(--text-body);
  line-height: 1.65;
}

/* Política de datos */
.policy-breadcrumbs,
.policy-kicker,
.policy-hero-meta span,
.policy-toc > p,
.policy-toc a,
.policy-document-label,
.policy-section-number,
.policy-section h3,
.policy-details dt,
.policy-contact-line span,
.policy-signoff p,
.policy-signoff > a {
  font-size: var(--text-caption);
  line-height: 1.5;
}

.policy-document-label,
.policy-section-number {
  font-size: var(--text-caption) !important;
}

.policy-hero-meta p {
  font-size: var(--text-ui);
  line-height: 1.55;
}

.policy-section p,
.policy-section li,
.policy-details dd,
.policy-principles dd {
  font-size: var(--text-body);
  line-height: 1.75;
}

@media (max-width: 800px) {
  .desktop-nav-links a,
  .location-trigger,
  .header-search.is-open input,
  .footer-column a {
    font-size: var(--text-ui);
  }

  .home-benefit p,
  .home-visit-details p {
    font-size: var(--text-body);
  }

  .product-features {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: visible;
  }
}

@media (max-width: 520px) {
  :root {
    --text-caption: .8125rem;
    --text-ui: .875rem;
    --text-body: 1rem;
  }

  .footer-column a {
    font-size: .875rem;
  }

  .home-hero-cta {
    min-width: 220px;
    white-space: nowrap;
    width: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}