/*
 * Chetto theme · custom layer
 * --------------------------------------------------------------------
 * Replica 1:1 la identidad visual del frontend Next.js (chettoweb).
 * Se carga DESPUÉS de theme.css para sobreescribir Hummingbird.
 *
 * Convenciones:
 *   - Mobile-first.
 *   - Variables CSS expuestas en :root para que cualquier partial las use.
 *   - Namespacing `chetto-*` para evitar colisiones con Bootstrap.
 */

/* ------------------------------------------------------------------ */
/* Design tokens                                                       */
/* ------------------------------------------------------------------ */
:root {
  /* Brand */
  --chetto-color-brand: #c4b5a0;
  --chetto-color-brand-hover: #b4a48d;
  /* Sincronizados 1:1 con Next.js (app/globals.css):
     --color-ink             → main copy + topbar/footer background (#2d2d2d)
     --color-surface-muted   → search input + subtle sections (#f7f6f4)
     --color-border-subtle   → bordes finos (#e8e6e3) */
  --chetto-color-ink: #2d2d2d;
  --chetto-color-ink-soft: #2d2d2d;
  --chetto-color-white: #ffffff;
  --chetto-color-surface: #ffffff;
  --chetto-color-surface-muted: #f7f6f4;
  --chetto-color-border-subtle: #e8e6e3;

  /* Typography */
  --chetto-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

  /* Layout */
  --chetto-container-max: 1354px;
  --chetto-radius-sm: 6px;
  --chetto-radius-md: 12px;
  --chetto-radius-pill: 9999px;

  /* Topbar */
  --chetto-topbar-height: 40px;

  /* Header */
  --chetto-header-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.1);

  /* Aliases compatibles con Tailwind variables del Next.js */
  --color-brand: var(--chetto-color-brand);
  --color-ink: var(--chetto-color-ink);
  --color-surface-muted: var(--chetto-color-surface-muted);
  --color-border-subtle: var(--chetto-color-border-subtle);
}

/* ------------------------------------------------------------------ */
/* Reset / base                                                        */
/* ------------------------------------------------------------------ */
html {
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--chetto-font-sans);
  color: var(--chetto-color-ink);
  background: var(--chetto-color-surface);
  font-feature-settings: 'cv11', 'ss01';
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font-family: inherit;
}

/* Container compartido */
.chetto-container {
  width: 100%;
  max-width: var(--chetto-container-max);
  margin-inline: auto;
  padding-inline: 16px;
}

@media (min-width: 768px) {
  .chetto-container {
    padding-inline: 24px;
  }
}

/* Util: ocultar visualmente conservando accesibilidad */
.chetto-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;
}

/* ------------------------------------------------------------------ */
/* Topbar                                                              */
/* ------------------------------------------------------------------ */
.chetto-topbar {
  display: none;
  background: var(--chetto-color-ink);
  color: var(--chetto-color-white);
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.0107em;
}

@media (min-width: 768px) {
  .chetto-topbar {
    display: block;
  }
}

.chetto-topbar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  height: var(--chetto-topbar-height);
}

.chetto-topbar__left {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 24px;
}

.chetto-topbar__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  color: inherit;
  transition: opacity 0.15s ease;
}

.chetto-topbar__link:hover {
  opacity: 0.8;
  color: inherit;
}

.chetto-topbar__link--email {
  text-decoration: underline;
  min-width: 0;
}

.chetto-topbar__right {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-shrink: 0;
}

.chetto-topbar__link--stores,
.chetto-topbar__link--b2b {
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: -0.0195em;
  flex-shrink: 0;
}

.chetto-topbar__link--b2b {
  padding: 4px 12px;
  border: 1px solid currentColor;
  border-radius: 9999px;
  font-size: 13px;
  line-height: 1.2;
  transition: background 0.15s ease, color 0.15s ease;
}
.chetto-topbar__link--b2b:hover {
  background: var(--chetto-color-ink, #2d2d2d);
  color: #fff;
  opacity: 1;
}

.chetto-topbar__icon {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

.chetto-topbar__email-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ------------------------------------------------------------------ */
/* Header                                                              */
/* ------------------------------------------------------------------ */
.chetto-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--chetto-color-white);
  border-bottom: 1px solid var(--chetto-color-border-subtle);
  box-shadow: var(--chetto-header-shadow);
}

.chetto-header__top {
  border-bottom: 1px solid var(--chetto-color-border-subtle);
  padding-block: 12px;
}

@media (min-width: 768px) {
  .chetto-header__top {
    padding-top: 16px;
    padding-bottom: 1px;
  }
}

.chetto-header__row {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 56px;
}

@media (min-width: 768px) {
  .chetto-header__row {
    height: 80px;
    gap: 24px;
  }
}

/* Hamburguesa (solo móvil) */
.chetto-header__burger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--chetto-color-ink);
  cursor: pointer;
  border-radius: var(--chetto-radius-sm);
}

.chetto-header__burger:hover {
  background: var(--chetto-color-surface-muted);
}

@media (min-width: 768px) {
  .chetto-header__burger {
    display: none;
  }
}

/* Logo */
.chetto-header__logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 56px;
  width: 100px;
}

@media (min-width: 768px) {
  .chetto-header__logo {
    height: 80px;
    width: 115px;
  }
}

.chetto-header__logo img {
  width: auto;
  height: 100%;
  object-fit: contain;
  display: block;
}

/* Search desktop */
.chetto-header__search {
  display: none;
  flex: 1;
}

@media (min-width: 768px) {
  .chetto-header__search {
    display: block;
  }
}

/* Search input */
.chetto-search {
  position: relative;
  width: 100%;
}

.chetto-search__icon {
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  color: rgba(10, 10, 10, 0.5);
  pointer-events: none;
}

.chetto-search__input {
  width: 100%;
  height: 44px;
  border: 0;
  border-radius: var(--chetto-radius-pill);
  background: var(--chetto-color-surface-muted);
  padding: 0 16px 0 48px;
  font-size: 14px;
  color: var(--chetto-color-ink);
  font-family: inherit;
}

@media (min-width: 768px) {
  .chetto-search__input {
    height: 46px;
  }
}

.chetto-search__input::placeholder {
  color: rgba(10, 10, 10, 0.5);
}

.chetto-search__input:focus {
  outline: 2px solid var(--chetto-color-brand);
  outline-offset: 1px;
}

/* Acciones derecha (cuenta, wishlist, carrito) */
.chetto-header__actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 12px;
}

@media (min-width: 768px) {
  .chetto-header__actions {
    gap: 24px;
  }
}

.chetto-header__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--chetto-color-ink);
  position: relative;
  transition: opacity 0.15s ease;
}

.chetto-header__action:hover {
  opacity: 0.8;
  color: var(--chetto-color-ink);
}

.chetto-header__action--icon-only {
  width: 40px;
  height: 40px;
}

.chetto-header__action--account-desktop {
  display: none;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: -0.0107em;
}

@media (min-width: 768px) {
  .chetto-header__action--account-desktop {
    display: inline-flex;
  }
}

.chetto-header__action--account-mobile {
  display: inline-flex;
}

@media (min-width: 768px) {
  .chetto-header__action--account-mobile {
    display: none;
  }
}

.chetto-header__action svg {
  width: 20px;
  height: 20px;
}

.chetto-header__action--icon-only svg,
.chetto-header__action--cart svg,
.chetto-header__action--wishlist svg {
  width: 24px;
  height: 24px;
}

.chetto-header__action--account-desktop svg {
  width: 20px;
  height: 20px;
}

.chetto-header__cart-badge,
.chetto-header__wish-badge {
  position: absolute;
  top: -6px;
  right: -8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: var(--chetto-radius-pill);
  background: var(--chetto-color-brand);
  color: var(--chetto-color-white);
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  text-align: center;
}
.chetto-header__wish-badge[hidden] { display: none; }
/* El link wishlist necesita position:relative para que el badge absoluto
   se ancle a él (igual que el cart link). */
.chetto-header__action--wishlist { position: relative; }

/* Search móvil — segunda fila ocupando ancho */
.chetto-header__search-mobile {
  margin-top: 12px;
}

@media (min-width: 768px) {
  .chetto-header__search-mobile {
    display: none;
  }
}

/* Nav inferior — solo desktop (en móvil va al drawer) */
.chetto-header__nav {
  display: none;
  background: var(--chetto-color-white);
}

@media (min-width: 768px) {
  .chetto-header__nav {
    display: block;
  }
}

.chetto-header__nav-list {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
  height: 56px;
  list-style: none;
  margin: 0;
  padding: 0;
  overflow-x: auto;
}

.chetto-header__nav-item {
  flex-shrink: 0;
}

.chetto-header__nav-link {
  position: relative;
  display: flex;
  align-items: center;
  height: 56px;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: 0.0143em;
  color: var(--chetto-color-ink);
  transition: opacity 0.15s ease;
}

.chetto-header__nav-link:hover {
  opacity: 0.8;
  color: var(--chetto-color-ink);
}

.chetto-header__nav-link--active::after {
  content: '';
  position: absolute;
  inset: auto 0 0 0;
  height: 2px;
  background: var(--chetto-color-brand);
}

/* ------------------------------------------------------------------ */
/* Mobile drawer                                                       */
/* ------------------------------------------------------------------ */
.chetto-drawer {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: none;
}

.chetto-drawer[data-open='true'] {
  display: block;
}

.chetto-drawer__overlay {
  position: absolute;
  inset: 0;
  background: rgba(10, 10, 10, 0.4);
}

.chetto-drawer__panel {
  position: absolute;
  inset: 0 auto 0 0;
  width: min(85vw, 360px);
  background: var(--chetto-color-white);
  display: flex;
  flex-direction: column;
  box-shadow: 4px 0 24px rgba(0, 0, 0, 0.15);
  transform: translateX(0);
  animation: chetto-drawer-in 0.2s ease;
}

@keyframes chetto-drawer-in {
  from { transform: translateX(-100%); }
  to   { transform: translateX(0); }
}

.chetto-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--chetto-color-border-subtle);
}

.chetto-drawer__close {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  cursor: pointer;
  color: var(--chetto-color-ink);
  border-radius: var(--chetto-radius-sm);
}

.chetto-drawer__close:hover {
  background: var(--chetto-color-surface-muted);
}

.chetto-drawer__body {
  flex: 1;
  overflow-y: auto;
  padding: 16px 8px;
}

.chetto-drawer__nav {
  list-style: none;
  margin: 0;
  padding: 0;
}

.chetto-drawer__nav-link {
  display: block;
  padding: 14px 16px;
  font-size: 16px;
  font-weight: 500;
  color: var(--chetto-color-ink);
  border-radius: var(--chetto-radius-sm);
}

.chetto-drawer__nav-link:hover,
.chetto-drawer__nav-link--active {
  background: var(--chetto-color-surface-muted);
}

.chetto-drawer__section {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--chetto-color-border-subtle);
}

.chetto-drawer__section-link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  font-size: 14px;
  color: var(--chetto-color-ink);
  border-radius: var(--chetto-radius-sm);
}

.chetto-drawer__section-link:hover {
  background: var(--chetto-color-surface-muted);
}

.chetto-drawer__section-link svg {
  width: 16px;
  height: 16px;
  color: rgba(10, 10, 10, 0.6);
}

/* ------------------------------------------------------------------ */
/* Footer                                                              */
/* ------------------------------------------------------------------ */
/* IMPORTANTE: el bg del <footer> usa var(--chetto-color-ink) (#2d2d2d,
   sincronizado con Next.js). El "blanco" que se ve cerca del footer venía del
   <body>/<html> en zonas de overscroll (rebote del scroll en macOS) y en
   las franjas laterales/inferiores cuando el viewport es más alto que el
   contenido. Se fuerza el bg dark también en html/body sólo cuando hay
   footer en la página (page-* sin login modal etc.) para evitar el
   "flash blanco". Se mantiene el !important del footer por si Hummingbird
   reinyecta padding/bg blanco en variantes. */
html,
body {
  background-color: var(--chetto-color-ink);
}

#footer.footer,
footer#footer,
body#index #wrapper + #footer.footer,
body #footer.footer.chetto-footer-wrap {
  background: var(--chetto-color-ink) !important;
  background-color: var(--chetto-color-ink) !important;
  color: var(--chetto-color-white);
  padding: 0;
  margin-top: 0;
}

.chetto-footer,
#footer .chetto-footer,
footer#footer .chetto-footer {
  background: var(--chetto-color-ink) !important;
  background-color: var(--chetto-color-ink) !important;
  color: var(--chetto-color-white);
}

/* Evita que el scroll bounce muestre blanco bajo el footer dark. */
html {
  overscroll-behavior-y: none;
  background-color: var(--chetto-color-ink);
}

.chetto-footer a {
  color: inherit;
}

.chetto-footer__newsletter-wrap {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.chetto-footer__newsletter {
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding-block: 64px;
}

@media (min-width: 1024px) {
  .chetto-footer__newsletter {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
  }
}

.chetto-footer__newsletter-copy {
  max-width: 637px;
}

.chetto-footer__newsletter-title {
  font-size: 24px;
  font-weight: 500;
  line-height: 32px;
  letter-spacing: 0.003em;
  color: var(--chetto-color-white);
  margin: 0;
}

.chetto-footer__newsletter-sub {
  margin: 8px 0 0 0;
  font-size: 16px;
  line-height: 24px;
  color: rgba(255, 255, 255, 0.7);
  letter-spacing: -0.0195em;
}

.chetto-footer__newsletter-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  max-width: 637px;
}

.chetto-footer__newsletter-row {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

@media (min-width: 640px) {
  .chetto-footer__newsletter-row {
    flex-direction: row;
  }
}

.chetto-footer__newsletter-input {
  flex: 1;
  width: 100%;
  min-width: 0;
  min-height: 58px;
  height: auto;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  background: rgba(255, 255, 255, 0.1);
  color: var(--chetto-color-white);
  border-radius: var(--chetto-radius-pill);
  padding: 16px 24px !important;
  font-size: 16px;
  line-height: 1.4;
  font-family: inherit;
  appearance: none;
  -webkit-appearance: none;
}
@media (max-width: 639.98px) {
  .chetto-footer__newsletter-input { padding: 18px 24px !important; min-height: 56px; }
}

.chetto-footer__newsletter-input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.chetto-footer__newsletter-input:focus {
  outline: none;
  box-shadow: 0 0 0 2px var(--chetto-color-brand);
}

.chetto-footer__newsletter-btn {
  height: 58px;
  padding: 0 32px;
  border: 0;
  border-radius: var(--chetto-radius-pill);
  background: var(--chetto-color-brand);
  color: var(--chetto-color-white);
  font-weight: 500;
  font-size: 16px;
  letter-spacing: -0.0195em;
  cursor: pointer;
  transition: opacity 0.15s ease;
}

.chetto-footer__newsletter-btn:hover {
  opacity: 0.9;
}

.chetto-footer__newsletter-gdpr {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 13px;
  line-height: 20px;
  color: rgba(255, 255, 255, 0.7);
}

.chetto-footer__newsletter-gdpr input[type="checkbox"] {
  margin-top: 2px;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.1);
  accent-color: var(--chetto-color-brand);
  cursor: pointer;
}

.chetto-footer__newsletter-gdpr-link {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.chetto-footer__newsletter-gdpr-link:hover {
  color: var(--chetto-color-white);
}

.chetto-footer__main-wrap {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.chetto-footer__main {
  display: grid;
  gap: 40px;
  padding-block: 64px;
  grid-template-columns: 1fr;
}

@media (min-width: 768px) {
  .chetto-footer__main {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .chetto-footer__main {
    grid-template-columns: 2fr 1fr 1fr 1fr;
  }
}

.chetto-footer__brand {
  max-width: 460px;
}

.chetto-footer__brand-logo img {
  width: auto;
  height: 64px;
  object-fit: contain;
}

.chetto-footer__brand-desc {
  margin-top: 24px;
  font-size: 16px;
  line-height: 26px;
  color: rgba(255, 255, 255, 0.7);
  letter-spacing: -0.0195em;
}

.chetto-footer__social {
  list-style: none;
  margin: 24px 0 0 0;
  padding: 0;
  display: flex;
  gap: 16px;
}

.chetto-footer__social-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: var(--chetto-radius-pill);
  background: rgba(255, 255, 255, 0.1);
  color: var(--chetto-color-white);
  transition: background 0.15s ease;
}

.chetto-footer__social-btn:hover {
  background: rgba(255, 255, 255, 0.2);
}

.chetto-footer__social-btn svg {
  width: 20px;
  height: 20px;
}

.chetto-footer__contact {
  list-style: none;
  margin: 24px 0 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  font-size: 16px;
  color: rgba(255, 255, 255, 0.7);
  letter-spacing: -0.0195em;
}

.chetto-footer__contact-item {
  display: flex;
  align-items: center;
  gap: 12px;
}

.chetto-footer__contact-item svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.chetto-footer__contact-item a:hover {
  color: var(--chetto-color-white);
}

.chetto-footer__col-title {
  margin: 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: -0.0195em;
  color: var(--chetto-color-white);
}

.chetto-footer__col-list {
  list-style: none;
  margin: 24px 0 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.chetto-footer__col-link {
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: -0.0107em;
  color: rgba(255, 255, 255, 0.7);
  transition: color 0.15s ease;
}

.chetto-footer__col-link:hover {
  color: var(--chetto-color-white);
}

.chetto-footer__legal {
  padding-block: 24px;
}

.chetto-footer__legal-row {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

@media (min-width: 1024px) {
  .chetto-footer__legal-row {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
}

.chetto-footer__legal-text,
.chetto-footer__legal-link {
  font-size: 14px;
  line-height: 20px;
  color: rgba(255, 255, 255, 0.5);
  letter-spacing: -0.0107em;
}

.chetto-footer__legal-text a {
  color: rgba(255, 255, 255, 0.7);
}

.chetto-footer__legal-text a:hover,
.chetto-footer__legal-link:hover {
  color: var(--chetto-color-white);
}

.chetto-footer__legal-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
}

/* ------------------------------------------------------------------ */
/* Body padding cuando el header sticky está visible (Hummingbird     */
/* gestiona esto via JS pero por si acaso)                             */
/* ------------------------------------------------------------------ */
#wrapper {
  background: var(--chetto-color-surface);
}

/* ====================================================================== */
/* /sobre-nosotros — replica AboutPage.tsx                                 */
/* ====================================================================== */
.chetto-about {
  background: #fff;
  color: var(--chetto-color-ink);
}
/* Reset márgenes nativos de <p>/<h*> que Hummingbird añade (`p{margin-bottom:1rem}`).
   Usamos `:where()` para tener especificidad 0 y NO machacar las reglas específicas
   `.chetto-about__*` que aplican mt/mb intencionalmente (replica Next.js mt-6/mt-8…). */
:where(.chetto-about) :where(p, h1, h2, h3, h4) { margin: 0; }
.chetto-about__pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border-radius: var(--chetto-radius-pill);
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.0107em;
  background: rgba(255, 255, 255, 0.8);
  color: #6b6b6b;
}
.chetto-about__pill--white { background: #fff; }
.chetto-about__pill--brand { background: var(--chetto-color-brand); color: #fff; }
.chetto-about__pill--ghost { background: rgba(255, 255, 255, 0.8); }

/* Breadcrumb */
.chetto-about__breadcrumb { background: var(--chetto-color-surface-muted); }
.chetto-about__breadcrumb-inner {
  max-width: var(--chetto-container-max);
  margin-inline: auto;
  padding: 0 24px;
  height: 56px;
  display: flex;
  align-items: center;
}
.chetto-about__breadcrumb-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  color: #6b6b6b;
  letter-spacing: -0.0195em;
  transition: color 0.15s;
}
.chetto-about__breadcrumb-link:hover { color: var(--chetto-color-ink); }
@media (min-width: 640px) { .chetto-about__breadcrumb-link { font-size: 16px; } }

/* Hero */
.chetto-about__hero {
  background: linear-gradient(to bottom, var(--chetto-color-surface-muted), #eae7e1);
  padding: 64px 24px 40px;
}
@media (min-width: 640px) { .chetto-about__hero { padding-top: 96px; } }
@media (min-width: 1024px) { .chetto-about__hero { padding-top: 128px; } }
.chetto-about__hero-grid {
  max-width: var(--chetto-container-max);
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
  align-items: center;
}
@media (min-width: 1024px) {
  .chetto-about__hero-grid { grid-template-columns: 1fr 546px; }
}
.chetto-about__hero-title {
  margin-top: 24px;
  font-size: 36px;
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: 0.004em;
  color: var(--chetto-color-ink);
}
@media (min-width: 640px) { .chetto-about__hero-title { font-size: 48px; } }
@media (min-width: 1024px) {
  .chetto-about__hero-title { font-size: 60px; line-height: 1.25; }
}
.chetto-about__hero-title-accent { color: var(--chetto-color-brand); }
.chetto-about__hero-subtitle {
  margin-top: 24px;
  max-width: 615px;
  font-size: 18px;
  line-height: 2;
  color: #6b6b6b;
  letter-spacing: -0.0225em;
}
@media (min-width: 640px) { .chetto-about__hero-subtitle { font-size: 20px; } }
.chetto-about__hero-media {
  position: relative;
  aspect-ratio: 546 / 786;
  width: 100%;
  overflow: hidden;
  border-radius: 24px;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}
.chetto-about__hero-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Historia + intro corporativa */
.chetto-about__history {
  background: #fff;
  padding: 64px 24px;
}
@media (min-width: 640px) { .chetto-about__history { padding-block: 80px; } }
.chetto-about__history-inner { max-width: 852px; margin-inline: auto; }
.chetto-about__history-card {
  background: var(--chetto-color-surface-muted);
  border-radius: 24px;
  padding: 32px;
}
@media (min-width: 640px) { .chetto-about__history-card { padding: 48px; } }
.chetto-about__history-text,
.chetto-about__intro-text {
  font-size: 18px;
  line-height: 1.625;
  color: #6b6b6b;
  letter-spacing: -0.0244em;
}
.chetto-about__history-text strong,
.chetto-about__intro-text strong { font-weight: 700; color: var(--chetto-color-ink); }
.chetto-about__history-text { margin-top: 24px; }
.chetto-about__intro-text { margin-top: 32px; }

/* Urban & Chic */
.chetto-about__urban {
  background: linear-gradient(to bottom, var(--chetto-color-surface-muted), #eae7e1);
  padding: 64px 24px;
}
@media (min-width: 640px) { .chetto-about__urban { padding-block: 80px; } }
.chetto-about__urban-grid {
  max-width: var(--chetto-container-max);
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
  align-items: start;
}
@media (min-width: 1024px) {
  .chetto-about__urban-grid { grid-template-columns: 1fr 1fr; }
}
.chetto-about__urban-title {
  margin-top: 24px;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: 0.005em;
  color: var(--chetto-color-ink);
}
@media (min-width: 640px) { .chetto-about__urban-title { font-size: 36px; } }
.chetto-about__urban-paragraphs { margin-top: 24px; display: flex; flex-direction: column; gap: 16px; }
.chetto-about__urban-text {
  font-size: 18px;
  line-height: 1.625;
  color: #6b6b6b;
  letter-spacing: -0.0244em;
}
.chetto-about__urban-text strong { font-weight: 700; color: var(--chetto-color-ink); }
.chetto-about__kpis {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}
@media (min-width: 640px) { .chetto-about__kpis { gap: 24px; } }
.chetto-about__kpi {
  background: #fff;
  border-radius: 16px;
  padding: 40px 24px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.chetto-about__kpi-value {
  font-size: 40px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.005em;
  color: var(--chetto-color-brand);
}
@media (min-width: 640px) { .chetto-about__kpi-value { font-size: 48px; } }
.chetto-about__kpi-label {
  margin-top: 16px;
  font-size: 14px;
  line-height: 20px;
  color: #6b6b6b;
  letter-spacing: -0.0107em;
}
.chetto-about__kpi-label + .chetto-about__kpi-label { margin-top: 0; }

/* Valores */
.chetto-about__values {
  background: #fff;
  padding: 64px 24px;
}
@media (min-width: 640px) { .chetto-about__values { padding-block: 80px; } }
.chetto-about__values-inner { max-width: var(--chetto-container-max); margin-inline: auto; }
.chetto-about__values-head { max-width: 672px; margin-inline: auto; text-align: center; }
.chetto-about__values-title {
  font-size: 28px;
  font-weight: 500;
  line-height: 2.5rem;
  letter-spacing: 0.005em;
  color: var(--chetto-color-ink);
}
@media (min-width: 640px) { .chetto-about__values-title { font-size: 36px; } }
.chetto-about__values-subtitle {
  margin-top: 16px;
  font-size: 18px;
  line-height: 1.75rem;
  color: #6b6b6b;
  letter-spacing: -0.0244em;
}
.chetto-about__values-grid {
  margin-top: 48px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
@media (min-width: 640px) { .chetto-about__values-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) {
  .chetto-about__values-grid { grid-template-columns: repeat(4, 1fr); gap: 32px; }
}
.chetto-about__value-card {
  background: var(--chetto-color-surface-muted);
  border-radius: 16px;
  padding: 32px;
}
.chetto-about__value-icon {
  display: flex;
  width: 64px;
  height: 64px;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: 9999px;
  color: var(--chetto-color-brand);
}
.chetto-about__value-title {
  margin-top: 24px;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.75rem;
  letter-spacing: -0.0225em;
  color: var(--chetto-color-ink);
}
.chetto-about__value-desc {
  margin-top: 8px;
  font-size: 16px;
  line-height: 1.625;
  color: #6b6b6b;
  letter-spacing: -0.0195em;
}

/* Cita destacada */
.chetto-about__quote {
  background: linear-gradient(to bottom, var(--chetto-color-surface-muted), #eae7e1);
  padding: 64px 24px;
}
@media (min-width: 640px) { .chetto-about__quote { padding-block: 80px; } }
.chetto-about__quote-inner { max-width: 852px; margin-inline: auto; text-align: center; }
.chetto-about__quote-card {
  background: #fff;
  padding: 32px;
  border-radius: 24px;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08);
}
@media (min-width: 640px) { .chetto-about__quote-card { padding: 48px; } }
.chetto-about__quote-text {
  font-size: 20px;
  line-height: 2.25rem;
  letter-spacing: 0.003em;
  color: var(--chetto-color-ink);
}
@media (min-width: 640px) { .chetto-about__quote-text { font-size: 24px; } }
.chetto-about__quote-text strong { font-weight: 700; }
.chetto-about__quote-footnote {
  margin-top: 24px;
  font-size: 16px;
  line-height: 1.75rem;
  color: #6b6b6b;
  letter-spacing: -0.0244em;
}
@media (min-width: 640px) { .chetto-about__quote-footnote { font-size: 18px; } }
.chetto-about__quote-footnote strong { font-weight: 700; color: var(--chetto-color-ink); }

/* CTA brand final */
.chetto-about__cta {
  background: linear-gradient(to bottom, var(--chetto-color-brand), #a89584);
  padding: 80px 24px;
  color: #fff;
  text-align: center;
}
.chetto-about__cta-inner { max-width: var(--chetto-container-max); margin-inline: auto; }
.chetto-about__cta-icon {
  margin-inline: auto;
  display: flex;
  width: 64px;
  height: 64px;
  align-items: center;
  justify-content: center;
}
.chetto-about__cta-title {
  margin-top: 24px;
  font-size: 32px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0.005em;
}
@media (min-width: 640px) {
  .chetto-about__cta-title { font-size: 48px; line-height: 1.25; }
}
.chetto-about__cta-subtitle {
  margin-top: 24px;
  font-size: 18px;
  line-height: 1.75rem;
  color: rgba(255, 255, 255, 0.9);
  letter-spacing: -0.0244em;
}
.chetto-about__cta-buttons {
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
}
@media (min-width: 640px) { .chetto-about__cta-buttons { flex-direction: row; } }
.chetto-about__cta-btn {
  display: inline-flex;
  height: 64px;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  padding-inline: 32px;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: -0.0244em;
  transition: opacity 0.15s, background-color 0.15s;
}
.chetto-about__cta-btn--primary {
  background: #fff;
  color: var(--chetto-color-ink);
}
.chetto-about__cta-btn--primary:hover { opacity: 0.9; }
.chetto-about__cta-btn--outline {
  background: transparent;
  border: 2px solid #fff;
  color: #fff;
}
.chetto-about__cta-btn--outline:hover { background: rgba(255, 255, 255, 0.1); }

/* ====================================================================== */
/* /materiales — replica MaterialsPage.tsx                                 */
/* ====================================================================== */
.chetto-materials { background: #fff; color: var(--chetto-color-ink); }

.chetto-materials__hero {
  background: linear-gradient(to bottom, var(--chetto-color-surface-muted), #eae7e1);
  padding: 48px 0 64px;
}
@media (min-width: 640px) { .chetto-materials__hero { padding: 56px 0 80px; } }
.chetto-materials__hero-inner { max-width: 1200px; margin-inline: auto; padding-inline: 24px; }
.chetto-materials__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 500;
  color: var(--chetto-color-ink);
  transition: opacity 0.15s;
}
.chetto-materials__back:hover { opacity: 0.8; }
.chetto-materials__hero-head {
  margin-top: 40px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
}
@media (min-width: 640px) { .chetto-materials__hero-head { gap: 20px; } }
.chetto-materials__hero-icon {
  display: flex;
  width: 64px;
  height: 64px;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  background: var(--chetto-color-brand);
  color: #fff;
  border-radius: 16px;
}
.chetto-materials__hero-title {
  font-size: 36px;
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: 0.004em;
  color: var(--chetto-color-ink);
}
@media (min-width: 640px) { .chetto-materials__hero-title { font-size: 48px; } }
.chetto-materials__hero-subtitle {
  margin-top: 24px;
  max-width: 640px;
  font-size: 17px;
  line-height: 1.55;
  color: rgba(10, 10, 10, 0.7);
  letter-spacing: -0.0225em;
}
@media (min-width: 640px) {
  .chetto-materials__hero-subtitle { font-size: 18px; line-height: 1.75rem; }
}

/* Intro */
.chetto-materials__intro { padding: 56px 0 32px; }
@media (min-width: 640px) { .chetto-materials__intro { padding-top: 64px; } }
.chetto-materials__intro-inner {
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 24px;
  text-align: left;
}
.chetto-materials__intro-title {
  font-size: 26px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--chetto-color-ink);
}
@media (min-width: 640px) { .chetto-materials__intro-title { font-size: 30px; } }
.chetto-materials__intro-text {
  margin-top: 24px;
  font-size: 17px;
  line-height: 1.65;
  color: rgba(10, 10, 10, 0.7);
  letter-spacing: -0.0225em;
}
@media (min-width: 640px) { .chetto-materials__intro-text { font-size: 18px; } }

/* Lista de materiales */
.chetto-materials__list { padding-block: 40px; }
@media (min-width: 640px) { .chetto-materials__list { padding-block: 56px; } }
.chetto-materials__list-inner {
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 24px;
  display: flex;
  flex-direction: column;
  gap: 64px;
}
@media (min-width: 640px) { .chetto-materials__list-inner { gap: 80px; } }
.chetto-materials__item {
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  gap: 24px;
}
@media (min-width: 768px) {
  .chetto-materials__item { grid-template-columns: 1fr 1fr; gap: 48px; }
}
/* MOBILE-ONLY: orden Title → Image → Desc → Benefits.
   `display: contents` aplana .item-body para que sus hijos (head, desc,
   benefits) sean hermanos directos del grid y podamos ordenarlos junto
   con la imagen vía `order`. */
@media (max-width: 767.98px) {
  .chetto-materials__item-body { display: contents; }
  .chetto-materials__item-head { order: 1; }
  .chetto-materials__item-media { order: 2; }
  .chetto-materials__item-desc { order: 3; margin-top: 0; }
  .chetto-materials__item-benefits { order: 4; margin-top: 0; }
}
.chetto-materials__item-media {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 16px;
  background: var(--chetto-color-surface-muted);
}
.chetto-materials__item-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (min-width: 768px) {
  .chetto-materials__item-media--first { order: 1; }
  .chetto-materials__item-media--second { order: 2; }
  .chetto-materials__item-body--first { order: 1; }
  .chetto-materials__item-body--second { order: 2; }
}
.chetto-materials__item-placeholder {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  color: rgba(10, 10, 10, 0.3);
}
.chetto-materials__item-body { display: flex; flex-direction: column; }
.chetto-materials__item-head { display: flex; align-items: center; gap: 12px; }
.chetto-materials__item-icon {
  display: flex;
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  background: var(--chetto-color-brand);
  color: #fff;
  border-radius: 9999px;
}
.chetto-materials__item-title {
  font-size: 22px;
  font-weight: 500;
  line-height: 1.3;
  color: var(--chetto-color-ink);
}
@media (min-width: 640px) { .chetto-materials__item-title { font-size: 24px; } }
.chetto-materials__item-desc {
  margin-top: 20px;
  font-size: 15px;
  line-height: 1.625;
  color: rgba(10, 10, 10, 0.7);
  letter-spacing: -0.0195em;
}
@media (min-width: 640px) { .chetto-materials__item-desc { font-size: 16px; } }
.chetto-materials__item-benefits { margin-top: 24px; }
.chetto-materials__item-benefits-title {
  font-size: 13px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--chetto-color-brand);
}
.chetto-materials__item-benefits-list {
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.chetto-materials__item-benefit {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 15px;
  line-height: 1.5rem;
  color: rgba(10, 10, 10, 0.7);
  letter-spacing: -0.0195em;
}
@media (min-width: 640px) { .chetto-materials__item-benefit { font-size: 16px; } }
.chetto-materials__benefit-icon {
  display: flex;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  background: rgba(196, 181, 160, 0.15);
  color: var(--chetto-color-brand);
  border-radius: 9999px;
}

/* Certificaciones */
.chetto-materials__certs { padding-block: 40px; }
@media (min-width: 640px) { .chetto-materials__certs { padding-block: 56px; } }
.chetto-materials__certs-inner { max-width: 1200px; margin-inline: auto; padding-inline: 24px; }
.chetto-materials__certs-card {
  background: var(--chetto-color-surface-muted);
  border-radius: 24px;
  padding: 48px 24px;
}
@media (min-width: 640px) { .chetto-materials__certs-card { padding: 56px 48px; } }
.chetto-materials__certs-title {
  text-align: center;
  font-size: 26px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--chetto-color-ink);
}
@media (min-width: 640px) { .chetto-materials__certs-title { font-size: 30px; } }
.chetto-materials__certs-list {
  margin: 40px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
  justify-items: center;
  align-items: center;
}
@media (min-width: 640px) { .chetto-materials__certs-list { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .chetto-materials__certs-list { grid-template-columns: repeat(4, 1fr); } }
.chetto-materials__cert {
  display: flex;
  width: 100%;
  justify-content: center;
}
.chetto-materials__cert img {
  height: 80px;
  width: auto;
  object-fit: contain;
}
@media (min-width: 640px) { .chetto-materials__cert img { height: 96px; } }

/* Banner brand */
.chetto-materials__banner { padding: 24px 0 80px; }
@media (min-width: 640px) { .chetto-materials__banner { padding-bottom: 96px; } }
.chetto-materials__banner-inner { max-width: 1200px; margin-inline: auto; padding-inline: 24px; }
.chetto-materials__banner-card {
  background: linear-gradient(to bottom, var(--chetto-color-brand), #a89584);
  border-radius: 24px;
  padding: 56px 32px;
  text-align: center;
  color: #fff;
}
@media (min-width: 640px) { .chetto-materials__banner-card { padding: 64px 96px; } }
.chetto-materials__banner-title {
  font-size: 26px;
  font-weight: 500;
  line-height: 1.2;
}
@media (min-width: 640px) { .chetto-materials__banner-title { font-size: 30px; } }
.chetto-materials__banner-text {
  margin: 24px auto 0;
  max-width: 760px;
  font-size: 17px;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.9);
  letter-spacing: -0.0225em;
}
@media (min-width: 640px) { .chetto-materials__banner-text { font-size: 18px; } }

/* ====================================================================== */
/* /que-es-barefoot — replica PorQueBarefoot.tsx                           */
/* ====================================================================== */

/* Tokens locales */
:root {
  --chetto-porque-container-max: 1354px;
  --chetto-porque-faq-max: 852px;
  --chetto-porque-pad-x: 24px;
  --chetto-porque-muted: #6b6b6b;
  --chetto-porque-card-bg: #f7f6f4;
  --chetto-porque-grad-end: #eae7e1;
  --chetto-porque-cta-final-end: #a89584;
  --chetto-porque-no: #c4736b;
  --chetto-porque-step-0: #c4b5a0;
  --chetto-porque-step-1: #8b8b8b;
  --chetto-porque-step-2: #6b6b6b;
}

/* Anular el container Bootstrap de PrestaShop SOLO en /que-es-barefoot.
 * PS9 envuelve TODO en `<div class="columns-container container">` que aplica
 * max-width + padding lateral. En Next.js cada section es full-bleed.
 * Usamos el body.cms-id-12 como ancla específica de esta página CMS.
 */
body.cms-id-12 .columns-container.container {
  max-width: none;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
  margin-left: 0;
  margin-right: 0;
}
body.cms-id-12 #center-column.page--full-width,
body.cms-id-12 .center-column.page--full-width {
  padding-left: 0;
  padding-right: 0;
}
/* PrestaShop inyecta <h1 class="page-title-section"> que duplica el hero */
body.cms-id-12 .page-header { display: none; }

/* Fallback full-bleed: si algún wrapper sigue limitando ancho, cada <section>
 * rompe del padre y ocupa 100vw, mientras su contenedor interno centra el contenido.
 */
.chetto-porque--fullbleed > section {
  position: relative;
  width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  max-width: 100vw;
  box-sizing: border-box;
}
/* Evita scroll horizontal por 100vw vs scrollbar */
body.cms-id-12 { overflow-x: hidden; }

/* ------------------------------------------------------------------ */
/* Fix GLOBAL para TODAS las pages migradas (CMS + módulos + contact)   */
/* ------------------------------------------------------------------ */
/* Hummingbird envuelve TODAS las pages en `<div class="columns-container container">`
 * que tiene max-width: 1320px + padding lateral. En el theme migrado desde Next.js
 * cada <section> ocupa el ancho COMPLETO de ventana (full-bleed) y centra su
 * contenedor interno. Anulamos el wrapper para:
 *   - cualquier CMS page (body.cms-id-*)
 *   - /contacto (body.page-contact)
 *   - /tiendas  (body.page-stores)
 *   - /faq, /guia-tallas y otros módulos (body.page-module-chettoweb_*)
 */
body[class*="cms-id-"] .columns-container.container,
body[class*="cms-id-"] #center-column.page--full-width,
body[class*="cms-id-"] .center-column.page--full-width,
body.page-contact .columns-container.container,
body.page-contact #center-column.page--full-width,
body.page-contact .center-column.page--full-width,
body.page-stores .columns-container.container,
body.page-stores #center-column.page--full-width,
body.page-stores .center-column.page--full-width,
body[class*="page-module-chettoweb_"] .columns-container.container,
body[class*="page-module-chettoweb_"] #center-column.page--full-width,
body[class*="page-module-chettoweb_"] .center-column.page--full-width {
  max-width: none;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
  margin-left: 0;
  margin-right: 0;
}

/* Evita scroll horizontal por 100vw vs scrollbar */
body[class*="cms-id-"],
body.page-contact,
body.page-stores,
body[class*="page-module-chettoweb_"] {
  overflow-x: hidden;
}

/* Fallback full-bleed: si algún wrapper sigue limitando ancho, cada <section>
 * directa hija del <main> rompe del padre y ocupa 100vw. Aplicado a todas las
 * pages CMS migradas con clase `--fullbleed`. */
.chetto-about--fullbleed > section,
.chetto-materials--fullbleed > section,
.chetto-shipping--fullbleed > section,
.chetto-returns--fullbleed > section,
.chetto-help--fullbleed > section,
.chetto-care--fullbleed > section,
.chetto-contact--fullbleed > section,
.chetto-stores--fullbleed > section,
.chetto-faq--fullbleed > section,
.chetto-sizing--fullbleed > section,
.chetto-editorial--fullbleed > section {
  position: relative;
  width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  max-width: 100vw;
  box-sizing: border-box;
}

/* Reset márgenes nativos de <p>/<h*> que Hummingbird inyecta (`p{margin-bottom:1rem}`).
   Usamos :where() para tener especificidad 0 y NO machacar reglas específicas
   `.chetto-*__*` que aplican mt/mb intencionalmente (replica Next.js mt-6/mt-8…). */
:where(.chetto-about, .chetto-materials, .chetto-editorial, .chetto-contact,
       .chetto-stores, .chetto-faq, .chetto-sizing, .chetto-porque)
:where(p, h1, h2, h3, h4) { margin: 0; }

/* ------------------------------------------------------------------ */
/* Home (page-index) y CMS-12 usado como home — limpieza de wrapper PS */
/* ------------------------------------------------------------------ */

/* Ocultar breadcrumb en TODAS las pages — el diseño Next.js no incluye
 * breadcrumb en ninguna sección. Si en el futuro se quiere recuperar en
 * alguna page concreta, añadir override específico. */
.breadcrumb__wrapper,
.breadcrumb,
nav[aria-label="breadcrumb"] {
  display: none !important;
}

/* Notifications wrapper vacío en home — quitar separación visual residual */
body.page-index #notifications:empty,
body.cms-id-12 #notifications:empty {
  display: none;
}

/* HOME (page-index) — full-bleed total: neutralizar wrapper Bootstrap
 * .columns-container.container (max-width 1320px + padding lateral) y
 * #center-column. Cada bloque .ch-* del index.tpl ya centra su propio
 * max-width interno con su padding, así que el container PS sobra. */
body.page-index .columns-container.container,
body.page-index #center-column,
body.page-index #center-column.page--full-width,
body.page-index .l-wrapper,
body.page-index .l-wrapper--boxed,
body.page-index #content,
body.page-index #content.page-content,
body.page-index .chetto-home {
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Hero pegado al trust: ningún margen entre bloques home consecutivos.
   Cubrimos toda la cadena de wrappers PS/Hummingbird que puedan tener padding. */
body.page-index #wrapper,
body.page-index #main-content,
body.page-index .l-wrapper,
body.page-index .l-main,
body.page-index .l-content,
body.page-index main,
body.page-index main#wrapper,
body.page-index .columns-container,
body.page-index .container,
body.page-index #notifications,
body.page-index #notifications:empty,
body.page-index .page,
body.page-index .page--home,
body.page-index .page-content,
body.page-index .page-content--home,
body.page-index .chetto-home {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
body.page-index #notifications:empty,
body.page-index #notifications:empty .container { display: none !important; }

body.page-index .ch-hero { padding-bottom: 0 !important; margin-bottom: 0 !important; }

/* TRUST: margin negativo SUFICIENTE (-40px) para tapar el hueco que dejen los
   wrappers PS, sea el que sea. El bg muted se extiende hacia arriba cubriendo
   la franja blanca. position:relative + z-index para que el border-top no se
   coma el slider. */
body.page-index .ch-trust {
  margin-top: -40px !important;
  position: relative;
  z-index: 5;
}

/* FEATURED: sección beige; cerramos el gap del grid con la sección de
   arriba (cats es blanca, así que el gap blanco ya no se nota, pero
   mantenemos el margin negativo para que la transición sea limpia). */
body.page-index .ch-featured {
  margin-top: -40px !important;
  position: relative;
  z-index: 3;
}

body.page-index { overflow-x: hidden; }

/* CATEGORY (page-category) y PRODUCT (page-product) — mismo full-bleed:
 * el listing/producto chetto centra su propio max-w-1354 interno. */
body.page-category .columns-container.container,
body.page-category #center-column,
body.page-category #center-column.page--full-width,
body.page-product .columns-container.container,
body.page-product #center-column,
body.page-product #center-column.page--full-width {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body.page-category, body.page-product { overflow-x: hidden; }

/* Cuando los bloques chettoweb_homepage se inyectan dentro del CMS-12,
 * forzamos full-bleed para que el .ch-hero / .ch-trust / etc. ocupen
 * todo el ancho como en Next.js, ignorando el container Bootstrap. */
body.cms-id-12 .ch-hero,
body.cms-id-12 .ch-trust,
body.cms-id-12 .ch-cats,
body.cms-id-12 .ch-featured,
body.cms-id-12 .ch-keys,
body.cms-id-12 .ch-favs,
body.cms-id-12 .ch-fams,
body.cms-id-12 .ch-exp {
  position: relative;
  width: 100vw;
  left: 50%;
  margin-left: -50vw;
  max-width: 100vw;
  box-sizing: border-box;
}

.chetto-porque { color: var(--chetto-color-ink); }
.chetto-porque__container { max-width: var(--chetto-porque-container-max); margin-inline: auto; padding-inline: var(--chetto-porque-pad-x); }
.chetto-porque__pill {
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  color: #6b6b6b;
  letter-spacing: -0.0107em;
}
.chetto-porque__section-head { text-align: center; }
.chetto-porque__section-title {
  font-size: 32px;
  font-weight: 500;
  line-height: 2.5rem;
  letter-spacing: 0.005em;
  color: var(--chetto-color-ink);
}
@media (min-width: 640px) { .chetto-porque__section-title { font-size: 36px; } }
.chetto-porque__section-subtitle {
  margin: 16px auto 0;
  max-width: 672px;
  font-size: 18px;
  line-height: 1.75rem;
  color: #6b6b6b;
  letter-spacing: -0.0244em;
}

/* Hero */
.chetto-porque__hero {
  background: linear-gradient(to bottom, var(--chetto-color-surface-muted), #eae7e1);
  padding: 64px 0 96px;
}
.chetto-porque__hero-grid {
  max-width: var(--chetto-porque-container-max);
  margin-inline: auto;
  padding-inline: var(--chetto-porque-pad-x);
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
}
@media (min-width: 1024px) {
  .chetto-porque__hero-grid { grid-template-columns: 1fr 1fr; align-items: center; gap: 64px; }
}
.chetto-porque__hero-title {
  margin-top: 24px;
  font-size: 48px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 0.004em;
  color: var(--chetto-color-ink);
}
@media (min-width: 640px) { .chetto-porque__hero-title { font-size: 60px; } }
.chetto-porque__hero-title-line { display: block; }
.chetto-porque__hero-title-accent { color: var(--chetto-color-brand); }
.chetto-porque__hero-desc {
  margin-top: 24px;
  max-width: 574px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.625;
  color: #6b6b6b;
  letter-spacing: -0.0225em;
}
@media (min-width: 640px) { .chetto-porque__hero-desc { font-size: 20px; } }
.chetto-porque__hero-ctas {
  margin-top: 32px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.chetto-porque__hero-media { position: relative; }
.chetto-porque__hero-image-wrap {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 24px;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}
.chetto-porque__hero-image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.chetto-porque__hero-badge {
  position: absolute;
  bottom: -24px;
  right: 16px;
  background: #fff;
  padding: 20px 24px;
  border-radius: 16px;
  box-shadow: 0 20px 25px 0 rgba(0, 0, 0, 0.1), 0 8px 10px 0 rgba(0, 0, 0, 0.1);
}
.chetto-porque__hero-badge-value {
  font-size: 36px;
  font-weight: 700;
  line-height: 2.5rem;
  color: var(--chetto-color-brand);
  letter-spacing: 0.01em;
}
.chetto-porque__hero-badge-label {
  margin-top: 4px;
  max-width: 112px;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  color: #6b6b6b;
  letter-spacing: -0.0107em;
}

/* CTA buttons (porque) */
.chetto-porque__cta-btn {
  display: inline-flex;
  height: 60px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 9999px;
  padding-inline: 32px;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.0195em;
  transition: background-color 0.15s, color 0.15s, opacity 0.15s;
}
.chetto-porque__cta-btn--primary {
  background: var(--chetto-color-ink);
  color: #fff;
}
.chetto-porque__cta-btn--primary:hover { background: var(--chetto-color-brand); }
.chetto-porque__cta-btn--outline {
  background: transparent;
  border: 2px solid var(--chetto-color-ink);
  color: var(--chetto-color-ink);
}
.chetto-porque__cta-btn--outline:hover { background: var(--chetto-color-ink); color: #fff; }
.chetto-porque__cta-btn--primary-on-dark {
  background: #fff;
  color: var(--chetto-color-ink);
}
.chetto-porque__cta-btn--primary-on-dark:hover { opacity: 0.9; }
.chetto-porque__cta-btn--outline-on-dark {
  background: transparent;
  border: 2px solid #fff;
  color: #fff;
}
.chetto-porque__cta-btn--outline-on-dark:hover { background: rgba(255, 255, 255, 0.1); }

/* Beneficios */
.chetto-porque__benefits { background: #fff; padding-block: 80px; }
.chetto-porque__benefits-grid {
  margin: 64px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
}
@media (min-width: 640px) { .chetto-porque__benefits-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .chetto-porque__benefits-grid { grid-template-columns: repeat(4, 1fr); } }
.chetto-porque__benefit-card {
  background: #f7f6f4;
  border-radius: 16px;
  padding: 32px;
}
.chetto-porque__benefit-icon {
  display: flex;
  width: 64px;
  height: 64px;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: 9999px;
}
.chetto-porque__benefit-title {
  margin-top: 24px;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.75rem;
  letter-spacing: -0.4492px;
  color: var(--chetto-color-ink);
}
.chetto-porque__benefit-desc {
  margin-top: 8px;
  font-size: 16px;
  line-height: 26px;
  color: #6b6b6b;
  letter-spacing: -0.3125px;
}

/* Comparativa */
.chetto-porque__comparison {
  background: var(--chetto-color-surface-muted);
  padding-block: 80px;
}
.chetto-porque__compare-card {
  margin-top: 48px;
  background: #fff;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08);
}
.chetto-porque__compare-head {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 16px;
  padding: 20px 24px;
  background: var(--chetto-color-ink);
  color: #fff;
  border-bottom: 1px solid var(--chetto-color-border-subtle);
}
@media (min-width: 640px) { .chetto-porque__compare-head { gap: 32px; padding: 20px 32px; } }
.chetto-porque__compare-feature {
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.0893em;
  color: rgba(255, 255, 255, 0.7);
}
.chetto-porque__compare-col { text-align: center; }
.chetto-porque__compare-col-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5rem;
  letter-spacing: -0.0195em;
}
.chetto-porque__compare-col-pill {
  display: inline-flex;
  width: 20px;
  height: 20px;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  font-size: 10px;
  color: #fff;
}
.chetto-porque__compare-col-pill--ok { background: var(--chetto-color-brand); }
.chetto-porque__compare-col-pill--ko { background: #c4736b; }
.chetto-porque__compare-col-tag {
  margin-top: 4px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
}
.chetto-porque__compare-rows { margin: 0; padding: 0; list-style: none; }
.chetto-porque__compare-row {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  align-items: center;
  gap: 16px;
  padding: 20px 24px;
}
@media (min-width: 640px) { .chetto-porque__compare-row { gap: 32px; padding: 20px 32px; } }
.chetto-porque__compare-row--alt { background: rgba(245, 243, 238, 0.5); }
.chetto-porque__compare-row-title {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5rem;
  color: var(--chetto-color-ink);
  letter-spacing: -0.0195em;
}
.chetto-porque__compare-row-subtitle {
  margin-top: 4px;
  font-size: 13px;
  line-height: 1rem;
  color: #6b6b6b;
}
.chetto-porque__compare-cell { display: flex; justify-content: center; }
.chetto-porque__compare-badge {
  display: flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
}
.chetto-porque__compare-badge--yes {
  background: rgba(196, 181, 160, 0.15);
  color: var(--chetto-color-brand);
}
.chetto-porque__compare-badge--no {
  background: rgba(196, 115, 107, 0.15);
  color: #c4736b;
}

/* Esenciales */
.chetto-porque__essentials { background: #fff; padding-block: 80px; }
.chetto-porque__essentials-grid {
  margin: 48px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
@media (min-width: 768px) { .chetto-porque__essentials-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .chetto-porque__essentials-grid { grid-template-columns: repeat(3, 1fr); } }
.chetto-porque__essential-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 24px;
  padding: 32px;
}
/* /que-es-barefoot: anular el padding-bottom: 2rem que el theme aplica
   en `.page:not(body)`. En esta página el último bloque es el CTA brand
   (fondo oscuro full-bleed) y el padding deja una franja blanca fea. */
.page:not(body):has(.chetto-porque),
body:has(.chetto-porque) .page:not(body) {
  padding-bottom: 0 !important;
}

/* Los 3 cuadros con el MISMO gradiente para uniformidad visual
   (antes el primero destacaba por usar un fondo más claro). */
.chetto-porque__essential-card--0,
.chetto-porque__essential-card--1,
.chetto-porque__essential-card--2 {
  background: linear-gradient(to bottom, #eae7e1, #d4d2cf);
}
.chetto-porque__essential-image {
  position: relative;
  aspect-ratio: 1 / 1;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
}
.chetto-porque__essential-image img {
  width: 81%;
  height: 81%;
  object-fit: contain;
}
.chetto-porque__essential-body {
  margin-top: 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.chetto-porque__essential-step {
  display: inline-flex;
  width: fit-content;
  height: 24px;
  align-items: center;
  border-radius: 9999px;
  padding-inline: 12px;
  font-size: 12px;
  line-height: 1rem;
  color: #fff;
}
/* Los 3 step pills con el MISMO color brand (antes 0=brand, 1=gris, 2=gris oscuro) */
.chetto-porque__essential-step--0,
.chetto-porque__essential-step--1,
.chetto-porque__essential-step--2 { background: #c4b5a0; }
.chetto-porque__essential-title {
  font-size: 24px;
  font-weight: 500;
  line-height: 2rem;
  letter-spacing: 0.0703px;
  color: var(--chetto-color-ink);
}
.chetto-porque__essential-desc {
  font-size: 16px;
  line-height: 26px;
  color: #6b6b6b;
  letter-spacing: -0.3125px;
}

/* Etapas */
.chetto-porque__stages {
  background: var(--chetto-color-surface-muted);
  padding-block: 80px;
}
.chetto-porque__stages-grid {
  margin: 48px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
@media (min-width: 640px) { .chetto-porque__stages-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .chetto-porque__stages-grid { grid-template-columns: repeat(4, 1fr); } }
.chetto-porque__stage-card {
  background: #fff;
  border-radius: 16px;
  padding: 24px;
}
.chetto-porque__stage-icon { display: inline-flex; }
.chetto-porque__stage-age {
  margin-top: 12px;
  display: inline-flex;
  height: 24px;
  align-items: center;
  border-radius: 9999px;
  background: rgba(196, 181, 160, 0.2);
  padding-inline: 12px;
  font-size: 12px;
  line-height: 1rem;
  color: #c4b5a0;
}
.chetto-porque__stage-title {
  margin-top: 16px;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.75rem;
  letter-spacing: -0.4492px;
  color: var(--chetto-color-ink);
}
.chetto-porque__stage-desc {
  margin-top: 8px;
  font-size: 14px;
  line-height: 22.75px;
  color: #6b6b6b;
  letter-spacing: -0.1504px;
}

/* FAQ */
.chetto-porque__faq { background: #fff; padding-block: 80px; }
.chetto-porque__faq-inner {
  max-width: var(--chetto-porque-faq-max);
  margin-inline: auto;
  padding-inline: var(--chetto-porque-pad-x);
}
.chetto-porque__faq-list { margin-top: 48px; display: flex; flex-direction: column; gap: 12px; }
.chetto-porque__faq-item {
  background: var(--chetto-color-surface-muted);
  border-radius: 16px;
  overflow: hidden;
  transition: background-color 0.15s;
}
.chetto-porque__faq-item[open] { background: #f7f6f4; }
.chetto-porque__faq-question {
  list-style: none;
  cursor: pointer;
  padding: 20px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  font-size: 16px;
  font-weight: 500;
  color: var(--chetto-color-ink);
}
.chetto-porque__faq-question::-webkit-details-marker { display: none; }
.chetto-porque__faq-chevron { transition: transform 0.2s; flex-shrink: 0; color: #6b6b6b; }
.chetto-porque__faq-item[open] .chetto-porque__faq-chevron { transform: rotate(180deg); }
.chetto-porque__faq-answer {
  padding: 0 24px 20px;
}
.chetto-porque__faq-answer p {
  margin: 0;
  font-size: 15px;
  line-height: 1.625;
  color: #6b6b6b;
  letter-spacing: -0.0195em;
}

/* Final CTA */
.chetto-porque__final-cta {
  background: linear-gradient(to bottom, var(--chetto-color-brand), #a89584);
  padding-block: 96px;
  color: #fff;
}
.chetto-porque__final-cta-inner { text-align: center; }
.chetto-porque__final-cta-title {
  margin: 0 auto;
  max-width: 780px;
  font-size: 40px;
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: 0.005em;
  color: #fff;
}
@media (min-width: 640px) { .chetto-porque__final-cta-title { font-size: 60px; } }
.chetto-porque__final-cta-subtitle {
  margin: 24px auto 0;
  max-width: 672px;
  font-size: 18px;
  line-height: 1.75rem;
  color: rgba(255, 255, 255, 0.9);
  letter-spacing: -0.0244em;
}
.chetto-porque__final-cta-buttons {
  margin-top: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}

/* ================================================================== */
/* Pages: contacto / tiendas / faq / guia-tallas (mobile-first)       */
/* Replica visual del frontend Next.js (Figma).                        */
/* ================================================================== */

.chetto-contact__container,
.chetto-stores__container,
.chetto-faq__container,
.chetto-sizing__container {
  width: 100%;
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 24px;
}
@media (min-width: 768px) {
  .chetto-contact__container,
  .chetto-stores__container,
  .chetto-faq__container,
  .chetto-sizing__container { padding-inline: 32px; }
}

.chetto-contact__hero,
.chetto-faq__hero,
.chetto-sizing__hero {
  background: linear-gradient(180deg, #f7f6f4 0%, #eae7e1 100%);
  padding: 48px 0 40px;
}
.chetto-contact__back,
.chetto-faq__back,
.chetto-sizing__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--chetto-color-ink);
  font-size: 16px;
  font-weight: 500;
  transition: color 0.15s ease;
}
.chetto-contact__back:hover,
.chetto-faq__back:hover,
.chetto-sizing__back:hover { color: var(--chetto-color-brand); }

.chetto-contact__hero-head,
.chetto-faq__hero-head,
.chetto-sizing__hero-head {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 40px;
}
.chetto-contact__hero-icon,
.chetto-faq__hero-icon,
.chetto-sizing__hero-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 16px;
  background: var(--chetto-color-brand);
  color: #fff;
  flex-shrink: 0;
}
.chetto-contact__hero-title,
.chetto-faq__hero-title,
.chetto-sizing__hero-title {
  font-size: 32px;
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: 0.022em;
  color: var(--chetto-color-ink);
  margin: 0;
}
@media (min-width: 768px) {
  .chetto-contact__hero-title,
  .chetto-faq__hero-title,
  .chetto-sizing__hero-title { font-size: 48px; }
}
.chetto-contact__hero-subtitle,
.chetto-faq__hero-subtitle,
.chetto-sizing__hero-subtitle {
  margin-top: 24px;
  max-width: 657px;
  font-size: 18px;
  line-height: 1.55;
  color: rgba(10, 10, 10, 0.7);
}

/* ---------- /contacto ---------- */
.chetto-contact__content { padding: 56px 0 80px; background: #fff; }
.chetto-contact__extras--commitment { margin-top: 100px; }
.chetto-contact__section-title {
  text-align: center;
  font-size: 28px;
  font-weight: 500;
  letter-spacing: 0.013em;
  color: var(--chetto-color-ink);
  margin: 0;
}
.chetto-contact__section-title--left { text-align: left; }
@media (min-width: 768px) { .chetto-contact__section-title { font-size: 30px; } }

.chetto-contact__methods {
  list-style: none;
  margin: 40px 0 0;
  padding: 0;
  display: grid;
  gap: 20px;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .chetto-contact__methods { grid-template-columns: repeat(3, 1fr); gap: 24px; }
}
.chetto-contact__method {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 28px;
  border-radius: 16px;
  color: #fff;
  min-height: 200px;
}
.chetto-contact__method--beige { background: linear-gradient(180deg, #c4b5a0 0%, #a89584 100%); }
.chetto-contact__method--green { background: linear-gradient(149.59deg, #00c950 0%, #00a63e 100%); }
.chetto-contact__method-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.22);
}
.chetto-contact__method-title { margin-top: 12px; font-size: 20px; font-weight: 500; line-height: 1.4; color: #fff; }
.chetto-contact__method-value { font-size: 18px; font-weight: 600; line-height: 1.55; color: #fff; word-break: break-word; }
a.chetto-contact__method-value:hover { color: rgba(255,255,255,0.9); }
.chetto-contact__method-hint { font-size: 14px; color: rgba(255, 255, 255, 0.85); margin: 0; }

.chetto-contact__grid {
  margin-top: 56px;
  display: grid;
  gap: 40px;
  grid-template-columns: 1fr;
}
@media (min-width: 992px) {
  .chetto-contact__grid { grid-template-columns: 1fr 1fr; gap: 48px; }
}
.chetto-contact__form-intro { margin: 12px 0 32px; max-width: 505px; color: rgba(10, 10, 10, 0.7); }
.chetto-contact__sidebar { display: flex; flex-direction: column; gap: 24px; }
.chetto-contact__card { border-radius: 16px; padding: 28px; }
.chetto-contact__card--muted { background: #f7f6f4; color: var(--chetto-color-ink); }
.chetto-contact__card--brand { background: linear-gradient(180deg, #c4b5a0 0%, #a89584 100%); color: #fff; }
.chetto-contact__card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.chetto-contact__card h3 { font-size: 20px; font-weight: 500; margin: 0; }
.chetto-contact__hours { list-style: none; margin: 16px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; color: rgba(10,10,10,0.7); }
.chetto-contact__address { margin: 16px 0 0; font-size: 14px; color: rgba(10,10,10,0.6); }
.chetto-contact__cta {
  display: inline-flex;
  align-items: center;
  height: 44px;
  padding: 0 24px;
  margin-top: 20px;
  background: #fff;
  color: var(--chetto-color-ink);
  border-radius: 9999px;
  font-weight: 500;
  font-size: 14px;
  text-decoration: none;
  transition: background 0.15s ease;
}
.chetto-contact__cta:hover { background: rgba(255,255,255,0.9); }

.chetto-contact__form-wrap .login-form,
.chetto-contact__form-wrap form {
  background: #f7f6f4;
  border-radius: 16px;
  padding: 28px;
}
.chetto-contact__form-wrap .login-form > header { display: none; }
.chetto-contact__form-wrap .form-fields { display: flex; flex-direction: column; gap: 16px; }
.chetto-contact__form-wrap label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 500; color: var(--chetto-color-ink); }
.chetto-contact__form-wrap input[type="email"],
.chetto-contact__form-wrap input[type="text"],
.chetto-contact__form-wrap select,
.chetto-contact__form-wrap textarea {
  width: 100%;
  background: #fff;
  border: 1px solid rgba(196, 181, 160, 0.3);
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 15px;
  font-family: inherit;
  color: var(--chetto-color-ink);
}
.chetto-contact__form-wrap textarea { min-height: 140px; resize: vertical; }
.chetto-contact__form-wrap input:focus,
.chetto-contact__form-wrap select:focus,
.chetto-contact__form-wrap textarea:focus {
  outline: none;
  border-color: var(--chetto-color-brand);
  box-shadow: 0 0 0 3px rgba(196, 181, 160, 0.2);
}
.chetto-contact__form-wrap .form-footer { margin-top: 20px; }
.chetto-contact__form-wrap button[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 0 28px;
  background: var(--chetto-color-ink);
  color: #fff;
  border: 0;
  border-radius: 9999px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease;
}
.chetto-contact__form-wrap button[type="submit"]:hover { background: #2d2d2d; }

/* ---------- /tiendas ---------- */
.chetto-stores__content { padding: 56px 0 80px; background: #fff; }
.chetto-stores__title {
  text-align: center;
  font-size: 28px;
  font-weight: 500;
  letter-spacing: 0.013em;
  color: var(--chetto-color-ink);
  margin: 0;
}
@media (min-width: 768px) { .chetto-stores__title { font-size: 30px; } }
.chetto-stores__intro { margin: 16px auto 0; max-width: 680px; text-align: center; color: rgba(10,10,10,0.7); }
.chetto-stores__intro p { margin: 0; }

.chetto-stores__grid {
  margin-top: 48px;
  display: grid;
  gap: 28px;
  grid-template-columns: 1fr;
}
@media (min-width: 992px) {
  .chetto-stores__grid { grid-template-columns: 1fr 1fr; gap: 32px; align-items: start; }
}
.chetto-stores__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; order: 2; }
@media (min-width: 992px) { .chetto-stores__list { order: 1; } }

.chetto-stores__card {
  background: #fff;
  border: 1px solid var(--chetto-color-border-subtle);
  border-radius: 16px;
  padding: 24px;
}
.chetto-stores__card-head { margin-bottom: 12px; }
.chetto-stores__name { font-size: 20px; font-weight: 500; letter-spacing: -0.022em; color: var(--chetto-color-ink); margin: 0 0 6px; }
.chetto-stores__address { display: flex; flex-direction: column; gap: 2px; font-style: normal; color: rgba(10,10,10,0.7); font-size: 15px; }
.chetto-stores__note { margin: 12px 0 0; color: rgba(10,10,10,0.6); font-size: 14px; }
.chetto-stores__contacts { list-style: none; margin: 16px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 15px; }
.chetto-stores__contacts li { display: flex; align-items: center; gap: 10px; color: rgba(10,10,10,0.75); }
.chetto-stores__contacts a:hover { color: var(--chetto-color-brand); }
.chetto-stores__hours { margin-top: 16px; font-size: 14px; }
.chetto-stores__hours summary { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; font-weight: 500; color: var(--chetto-color-ink); list-style: none; }
.chetto-stores__hours summary::-webkit-details-marker { display: none; }
.chetto-stores__hours table { margin-top: 12px; width: 100%; border-collapse: collapse; font-size: 13.5px; color: rgba(10,10,10,0.7); }
.chetto-stores__hours th, .chetto-stores__hours td { padding: 4px 0; text-align: left; }
.chetto-stores__hours th { font-weight: 500; color: var(--chetto-color-ink); width: 60px; }

.chetto-stores__locate {
  margin-top: 16px;
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 16px;
  background: transparent;
  color: var(--chetto-color-ink);
  border: 1px solid var(--chetto-color-brand);
  border-radius: 9999px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease;
}
.chetto-stores__locate:hover { background: rgba(196, 181, 160, 0.15); }

.chetto-stores__map-wrap { order: 1; background: #f7f6f4; border-radius: 24px; padding: 20px; }
@media (min-width: 992px) { .chetto-stores__map-wrap { order: 2; position: sticky; top: 96px; } }
.chetto-stores__map { width: 100%; height: 50vh; min-height: 360px; border-radius: 16px; overflow: hidden; background: var(--chetto-color-border-subtle); }
@media (min-width: 992px) { .chetto-stores__map { height: 600px; } }
.chetto-stores__map-cta { margin: 14px 0 0; text-align: center; font-size: 14px; color: rgba(10,10,10,0.6); }

.chetto-stores__empty {
  margin-top: 56px;
  padding: 56px 24px;
  text-align: center;
  background: #f7f6f4;
  border: 1px solid rgba(196, 181, 160, 0.2);
  border-radius: 16px;
}
.chetto-stores__empty-title { font-size: 17px; font-weight: 500; color: var(--chetto-color-ink); margin: 0; }
.chetto-stores__empty-hint { margin: 8px 0 0; font-size: 14px; color: rgba(10,10,10,0.6); }

/* Asterisco campos obligatorios.
   El theme base aplicaba `inline-flex !important` que con flex-wrap rompía
   el `*` a la 2ª línea. Forzamos `block` con MAYOR especificidad para que
   los spans hijos se rendericen inline naturalmente y el `*` quede pegado
   al texto del label, en la misma línea. */
.chetto-contact label.form-label.chetto-label,
form.form-validation label.form-label.chetto-label,
.contact-form label.form-label.chetto-label {
  display: block !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
}
.chetto-contact label.chetto-label > span,
form.form-validation label.chetto-label > span,
.contact-form label.chetto-label > span {
  display: inline !important;
  line-height: inherit !important;
}
.chetto-contact label.chetto-label .chetto-req,
form.form-validation label.chetto-label .chetto-req,
.contact-form label.chetto-label .chetto-req {
  color: #d2533f !important;
  font-weight: 600 !important;
  margin-left: 4px !important;
}

/* Sidebar con acordeones por provincia */
.chetto-stores__sidebar {
  order: 2;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
  max-height: none;
}
@media (min-width: 992px) {
  .chetto-stores__sidebar { order: 1; max-height: 700px; overflow-y: auto; padding-right: 8px; }
}
.chetto-stores__count { margin: 0; font-size: 14px; color: rgba(10,10,10,0.65); }
.chetto-stores__count strong { color: var(--chetto-color-ink); font-weight: 600; }

.chetto-stores__search { display: block; }
.chetto-stores__search-input {
  width: 100%;
  height: 44px;
  padding: 0 16px;
  background: #fff;
  border: 1px solid var(--chetto-color-border-subtle, #e8e6e3);
  border-radius: 9999px;
  font-size: 14px;
  color: var(--chetto-color-ink);
  outline: none;
  transition: border-color 0.15s ease;
}
.chetto-stores__search-input:focus { border-color: var(--chetto-color-brand, #c4b5a0); }
.chetto-stores__search-input::placeholder { color: rgba(10,10,10,0.45); }

.chetto-stores__provinces { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }

.chetto-stores__province {
  background: #fff;
  border: 1px solid var(--chetto-color-border-subtle, #e8e6e3);
  border-radius: 14px;
  overflow: hidden;
}

.chetto-stores__province-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  background: transparent;
  border: 0;
  cursor: pointer;
  text-align: left;
  font-size: 15px;
  font-weight: 500;
  color: var(--chetto-color-ink);
  transition: background 0.15s ease;
}
.chetto-stores__province-toggle:hover { background: rgba(196, 181, 160, 0.08); }
.chetto-stores__province-name { flex: 1; }
.chetto-stores__province-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px; height: 22px;
  padding: 0 8px;
  background: rgba(196, 181, 160, 0.18);
  color: rgba(10,10,10,0.7);
  border-radius: 9999px;
  font-size: 12px;
  font-weight: 500;
}
.chetto-stores__province-chevron { transition: transform 0.2s ease; color: rgba(10,10,10,0.5); flex-shrink: 0; }
.chetto-stores__province.is-open .chetto-stores__province-chevron { transform: rotate(180deg); }

/* Lista de tiendas dentro de cada provincia (oculta hasta abrir) */
.chetto-stores__province .chetto-stores__list { display: none; padding: 0 16px 16px; gap: 12px; }
.chetto-stores__province.is-open .chetto-stores__list { display: flex; }

.chetto-stores__province .chetto-stores__card {
  margin: 0;
  padding: 14px;
  background: #faf9f7;
  border: 1px solid rgba(196, 181, 160, 0.15);
  border-radius: 12px;
}
.chetto-stores__province .chetto-stores__name { font-size: 16px; margin: 0 0 4px; }
.chetto-stores__province .chetto-stores__address { font-size: 13.5px; }
.chetto-stores__province .chetto-stores__contacts { margin-top: 12px; font-size: 14px; }
.chetto-stores__locate {
  margin-top: 12px;
  padding: 8px 14px;
  background: var(--chetto-color-brand, #c4b5a0);
  color: #fff;
  border: 0;
  border-radius: 9999px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease;
}
.chetto-stores__locate:hover { background: #a89584; }

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ---------- Botón corazón en producto (PDP) — solo icono, sin círculo ---------- */
.ch-product__wish {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px;
  background: transparent;
  color: var(--chetto-color-ink, #2d2d2d);
  border: 0;
  cursor: pointer;
  transition: color 0.15s ease;
}
.ch-product__wish:hover { color: #000; }
.ch-product__wish svg { transition: fill 0.2s ease, stroke 0.2s ease, transform 0.2s ease; }
.ch-product__wish:active svg { transform: scale(0.85); }

/* Activo: corazón relleno NEGRO */
.ch-product__wish.is-active { color: #000; }
.ch-product__wish.is-active svg {
  fill: #000;
  stroke: #000;
  animation: chWishPop 0.35s ease;
}
@keyframes chWishPop {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.4); }
  70%  { transform: scale(0.92); }
  100% { transform: scale(1); }
}

/* ---------- Color swatches (variantes/hermanos del producto) ----------
   Reemplaza al antiguo bloque "Disponible en otros colores" como sección
   full-width. Ahora son mini-thumbs cuadrados dentro de la columna info,
   entre el precio y el selector de talla. El actual lleva borde negro,
   los demás son enlaces al producto correspondiente. */
.chetto-product__swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 16px 0 20px;
}
.chetto-swatch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  padding: 6px;
  background: transparent;
  border: 1.5px solid transparent;
  border-radius: 16px;
  overflow: hidden;
  text-decoration: none;
  cursor: pointer;
  transition: border-color 0.15s ease, transform 0.15s ease;
}
.chetto-swatch:hover {
  border-color: var(--chetto-color-border-subtle, #c4b5a0);
  transform: translateY(-1px);
}
.chetto-swatch--current {
  cursor: default;
  border-color: var(--chetto-color-ink, #2d2d2d);
  border-width: 2px;
}
.chetto-swatch--current:hover {
  transform: none;
}
.chetto-swatch__img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
@media (max-width: 480px) {
  .chetto-swatch {
    width: 60px;
    height: 60px;
    border-radius: 14px;
  }
}

/* ---------- Botón "Guía de tallas" en producto ---------- */
.chetto-sizing-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: transparent;
  color: var(--chetto-color-ink, #2d2d2d);
  border: 0;
  border-radius: 0;
  font-size: 13px;
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
  transition: color 0.15s ease;
}
.chetto-sizing-btn:hover {
  color: var(--chetto-color-brand, #c4b5a0);
  background: transparent;
  border-color: transparent;
}

/* Variant inline: dentro del label del grupo Talla, alineado a la derecha */
.chetto-variants__label {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}
.chetto-sizing-btn--inline {
  margin-left: auto;
  padding: 4px 0;
}

/* ---------- Modal Guía de tallas ---------- */
.chetto-sizing-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.chetto-sizing-modal[hidden] { display: none !important; }
.chetto-sizing-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(20, 20, 20, 0.55);
  backdrop-filter: blur(2px);
}
.chetto-sizing-modal__panel {
  position: relative;
  z-index: 1;
  background: #fff;
  border-radius: 20px;
  max-width: 720px;
  width: 100%;
  max-height: 88vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 25px 50px -12px rgba(0,0,0,0.4);
}
.chetto-sizing-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid var(--chetto-color-border-subtle, #e8e6e3);
}
.chetto-sizing-modal__title { margin: 0; font-size: 20px; font-weight: 500; color: var(--chetto-color-ink, #2d2d2d); }
.chetto-sizing-modal__close {
  background: transparent;
  border: 0;
  cursor: pointer;
  padding: 6px;
  color: rgba(10,10,10,0.6);
  transition: color 0.15s ease;
}
.chetto-sizing-modal__close:hover { color: var(--chetto-color-ink, #2d2d2d); }
.chetto-sizing-modal__body {
  padding: 24px;
  overflow-y: auto;
  flex: 1;
}
.chetto-sizing-modal__table-scroll { overflow-x: auto; }
.chetto-sizing-modal__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.chetto-sizing-modal__table thead th {
  text-align: left;
  padding: 12px 16px;
  font-weight: 600;
  color: rgba(10,10,10,0.7);
  border-bottom: 2px solid var(--chetto-color-border-subtle, #e8e6e3);
  background: #faf9f7;
}
.chetto-sizing-modal__table tbody th,
.chetto-sizing-modal__table tbody td {
  padding: 12px 16px;
  border-bottom: 1px solid var(--chetto-color-border-subtle, #e8e6e3);
  color: var(--chetto-color-ink, #2d2d2d);
}
.chetto-sizing-modal__table tbody th { font-weight: 500; }
.chetto-sizing-modal__table tbody tr:nth-child(even) { background: #faf9f7; }
.chetto-sizing-modal__note { margin: 16px 0 0; font-size: 13px; color: rgba(10,10,10,0.65); }

/* ---------- /faq ---------- */
.chetto-faq__content { padding: 56px 0 80px; background: #fff; }
.chetto-faq__pills { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 32px; }
.chetto-faq__pill {
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 16px;
  background: #f7f6f4;
  color: var(--chetto-color-ink);
  border: 0;
  border-radius: 9999px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.chetto-faq__pill:hover { background: #efeae1; }
.chetto-faq__pill.is-active { background: var(--chetto-color-brand); color: #fff; }

.chetto-faq__search { position: relative; margin-bottom: 40px; }
.chetto-faq__search-icon { position: absolute; left: 18px; top: 50%; transform: translateY(-50%); display: inline-flex; color: rgba(10,10,10,0.6); pointer-events: none; }
.chetto-faq__search-input {
  width: 100%;
  height: 56px;
  padding: 0 100px 0 48px;
  background: #fff;
  border: 1px solid rgba(196, 181, 160, 0.3);
  border-radius: 9999px;
  font-size: 16px;
  color: var(--chetto-color-ink);
}
.chetto-faq__search-input:focus { outline: none; border-color: var(--chetto-color-brand); box-shadow: 0 0 0 3px rgba(196, 181, 160, 0.2); }
.chetto-faq__search-clear {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: #f7f6f4;
  color: var(--chetto-color-ink);
  border: 0;
  border-radius: 9999px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
}
.chetto-faq__search-clear:hover { background: #efeae1; }

.chetto-faq__results { display: flex; flex-direction: column; gap: 40px; }
.chetto-faq__category-title { font-size: 22px; font-weight: 500; letter-spacing: 0.003em; color: var(--chetto-color-ink); margin: 0 0 20px; }
@media (min-width: 768px) { .chetto-faq__category-title { font-size: 24px; } }
.chetto-faq__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.chetto-faq__item { background: #fff; border: 1px solid rgba(196, 181, 160, 0.2); border-radius: 16px; overflow: hidden; }
.chetto-faq__question {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 64px;
  padding: 18px 24px;
  background: transparent;
  color: var(--chetto-color-ink);
  border: 0;
  text-align: left;
  font-size: 17px;
  font-weight: 500;
  line-height: 1.5;
  cursor: pointer;
  transition: background 0.15s ease;
}
.chetto-faq__question:hover { background: #faf8f5; }
.chetto-faq__chevron { flex-shrink: 0; transition: transform 0.2s ease; color: var(--chetto-color-ink); }
.chetto-faq__item.is-open .chetto-faq__chevron { transform: rotate(180deg); }
.chetto-faq__answer { padding: 0 24px 24px; color: rgba(10,10,10,0.7); font-size: 16px; line-height: 1.6; }
.chetto-faq__answer p { margin: 0 0 12px; }
.chetto-faq__answer p:last-child { margin-bottom: 0; }
.chetto-faq__empty { padding: 48px 24px; text-align: center; background: #f7f6f4; border: 1px dashed rgba(196, 181, 160, 0.4); border-radius: 16px; }
.chetto-faq__empty-title { font-size: 17px; font-weight: 500; color: var(--chetto-color-ink); margin: 0; }
.chetto-faq__empty-hint { margin: 8px 0 0; font-size: 14px; color: rgba(10,10,10,0.6); }

/* CTA inferior del FAQ — "¿No encuentras lo que buscas?" */
.chetto-faq__cta-wrap { padding: 48px 24px 80px; background: #fff; }
.chetto-faq__cta {
  max-width: 852px;
  margin: 0 auto;
  background: var(--chetto-color-ink);
  color: #fff;
  border-radius: 24px;
  padding: 56px 32px;
  text-align: center;
}
.chetto-faq__cta-title {
  font-size: 28px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.5px;
  color: #fff;
  margin: 0;
}
@media (min-width: 768px) {
  .chetto-faq__cta-title { font-size: 36px; }
  .chetto-faq__cta { padding: 72px 48px; }
}
.chetto-faq__cta-text {
  margin: 16px auto 0;
  max-width: 560px;
  font-size: 17px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.9);
}
.chetto-faq__cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 56px;
  margin-top: 32px;
  padding: 0 32px;
  background: #fff;
  color: var(--chetto-color-ink);
  font-size: 16px;
  font-weight: 500;
  border-radius: 9999px;
  text-decoration: none;
  transition: opacity 0.2s ease;
}
.chetto-faq__cta-btn:hover { opacity: 0.9; color: var(--chetto-color-ink); }

/* ---------- /guia-tallas ---------- */
.chetto-sizing__content { padding: 56px 0 80px; background: #fff; }
.chetto-sizing__section-title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 26px;
  font-weight: 500;
  letter-spacing: 0.013em;
  color: var(--chetto-color-ink);
  margin: 0 0 24px;
}
.chetto-sizing__section-title svg { color: var(--chetto-color-brand); }
@media (min-width: 768px) { .chetto-sizing__section-title { font-size: 30px; } }

.chetto-sizing__steps { list-style: none; margin: 0 0 48px; padding: 0; display: grid; gap: 16px; grid-template-columns: 1fr; }
@media (min-width: 768px) { .chetto-sizing__steps { grid-template-columns: repeat(3, 1fr); gap: 20px; } }
.chetto-sizing__step { background: #f7f6f4; border-radius: 16px; padding: 24px; display: flex; flex-direction: column; gap: 12px; }
.chetto-sizing__step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 9999px;
  background: var(--chetto-color-brand);
  color: #fff;
  font-size: 20px;
  font-weight: 500;
}
.chetto-sizing__step h3 { margin: 0; font-size: 20px; font-weight: 500; color: var(--chetto-color-ink); }
.chetto-sizing__step p { margin: 0; color: rgba(10,10,10,0.7); font-size: 15.5px; line-height: 1.55; }

.chetto-sizing__tips { margin-bottom: 48px; padding: 28px; background: #fff9e6; border: 1px solid rgba(196, 181, 160, 0.25); border-radius: 16px; }
.chetto-sizing__tips header { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.chetto-sizing__tips h3 { margin: 0; font-size: 20px; font-weight: 500; color: var(--chetto-color-ink); }
.chetto-sizing__tips ul { list-style: disc; margin: 0; padding-left: 20px; color: rgba(10,10,10,0.75); font-size: 15.5px; line-height: 1.6; }

.chetto-sizing__table-wrap { margin-bottom: 48px; }
.chetto-sizing__tabs { border-bottom: 1px solid var(--chetto-color-border-subtle); margin-bottom: 16px; }
.chetto-sizing__tabs .nav-link { border: 0; border-bottom: 2px solid transparent; background: transparent; color: rgba(10,10,10,0.6); padding: 12px 18px; font-weight: 500; }
.chetto-sizing__tabs .nav-link:hover { color: var(--chetto-color-ink); }
.chetto-sizing__tabs .nav-link.active { background: transparent; color: var(--chetto-color-ink); border-bottom-color: var(--chetto-color-brand); }

.chetto-sizing__table-scroll { overflow-x: auto; border-radius: 16px; -webkit-overflow-scrolling: touch; }
.chetto-sizing__table { width: 100%; min-width: 560px; border-collapse: collapse; text-align: left; font-size: 15px; }
.chetto-sizing__table thead tr { background: #2d2d2d; color: #fff; }
.chetto-sizing__table thead th { height: 56px; padding: 0 20px; font-weight: 600; font-size: 14px; letter-spacing: 0.02em; }
.chetto-sizing__table tbody tr:nth-child(odd) { background: #f7f6f4; }
.chetto-sizing__table tbody tr:nth-child(even) { background: #fff; }
.chetto-sizing__table tbody th, .chetto-sizing__table tbody td { height: 52px; padding: 0 20px; color: rgba(10,10,10,0.7); }
.chetto-sizing__table tbody th { font-weight: 500; color: var(--chetto-color-ink); }

.chetto-sizing__cta { background: linear-gradient(180deg, #c4b5a0 0%, #a89584 100%); color: #fff; border-radius: 24px; padding: 48px 28px; text-align: center; }
.chetto-sizing__cta h2 { margin: 0; font-size: 26px; font-weight: 500; letter-spacing: 0.013em; }
@media (min-width: 768px) { .chetto-sizing__cta h2 { font-size: 30px; } .chetto-sizing__cta { padding: 56px 48px; } }
.chetto-sizing__cta p { margin: 16px auto 0; max-width: 560px; color: rgba(255,255,255,0.92); font-size: 16px; line-height: 1.55; }
.chetto-sizing__cta-btn {
  display: inline-flex;
  align-items: center;
  height: 52px;
  padding: 0 28px;
  margin-top: 28px;
  background: #fff;
  color: var(--chetto-color-ink);
  border-radius: 9999px;
  font-weight: 500;
  font-size: 16px;
  text-decoration: none;
  transition: background 0.15s ease;
}
.chetto-sizing__cta-btn:hover { background: rgba(255,255,255,0.9); }
.chetto-sizing__empty { padding: 48px 24px; text-align: center; background: #f7f6f4; border: 1px dashed rgba(196, 181, 160, 0.4); border-radius: 16px; color: rgba(10,10,10,0.6); }

/* Bloque sustituto de la tabla — texto + botón "Ver catálogo" */
.chetto-sizing__catalog {
  margin: 48px 0;
  padding: 40px 28px;
  background: #f7f6f4;
  border-radius: 24px;
  text-align: center;
}
@media (min-width: 768px) { .chetto-sizing__catalog { padding: 56px 48px; } }
.chetto-sizing__catalog .chetto-sizing__section-title { justify-content: center; margin: 0 0 16px; }
.chetto-sizing__catalog-text { max-width: 640px; margin: 0 auto 28px; color: rgba(10,10,10,0.7); font-size: 16px; line-height: 1.6; }
.chetto-sizing__catalog-btn {
  display: inline-flex;
  align-items: center;
  height: 52px;
  padding: 0 32px;
  background: var(--chetto-color-ink, #2d2d2d);
  color: #fff;
  border-radius: 9999px;
  font-weight: 500;
  font-size: 16px;
  text-decoration: none;
  transition: background 0.15s ease, transform 0.15s ease;
}
.chetto-sizing__catalog-btn:hover { background: #1a1a1a; color: #fff; }

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ====================================================================== */
/* Editorial pages — common layer                                          */
/* (envios-y-devoluciones · politica-de-cambios · atencion-al-cliente      */
/*  · cuidado-del-calzado)                                                 */
/*                                                                         */
/* Replica 1:1 del frontend Next.js (chettoweb/_blocks/*.tsx).             */
/* Mobile-first. Todos los bloques comparten clases `chetto-editorial`.    */
/* ====================================================================== */

.chetto-editorial,
.chetto-editorial * { box-sizing: border-box; }

.chetto-editorial {
  background: var(--chetto-color-white);
  font-family: var(--chetto-font-sans);
  color: var(--chetto-color-ink);
  -webkit-font-smoothing: antialiased;
}

/* Iconos genéricos */
.chetto-icon-16 { width: 16px; height: 16px; flex-shrink: 0; }
.chetto-icon-24 { width: 24px; height: 24px; flex-shrink: 0; }
.chetto-icon-28 { width: 28px; height: 28px; flex-shrink: 0; }
.chetto-icon-32 { width: 32px; height: 32px; flex-shrink: 0; }
.chetto-icon-48 { width: 48px; height: 48px; flex-shrink: 0; }
.chetto-icon--white { color: var(--chetto-color-white); }

/* Hero (gradiente claro) */
.chetto-editorial__hero {
  background: linear-gradient(180deg, #f7f6f4 0%, #eae7e1 100%);
  padding: 48px 24px 56px;
}
@media (min-width: 640px) { .chetto-editorial__hero { padding-inline: 48px; } }

.chetto-editorial__hero-inner { max-width: 1200px; margin-inline: auto; }

.chetto-editorial__back {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 16px; font-weight: 500; line-height: 24px;
  letter-spacing: -0.0195em;
  color: var(--chetto-color-ink); text-decoration: none;
  transition: color .15s ease;
}
.chetto-editorial__back:hover { color: var(--chetto-color-brand); }
.chetto-editorial__back svg { width: 20px; height: 20px; }

.chetto-editorial__hero-row {
  display: flex; align-items: center; gap: 16px; margin-top: 40px;
}
.chetto-editorial__hero-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 64px; height: 64px; flex-shrink: 0;
  border-radius: 16px;
  background: var(--chetto-color-brand); color: var(--chetto-color-white);
}
.chetto-editorial__hero-img { width: 32px; height: 32px; object-fit: contain; }

.chetto-editorial__hero-title {
  margin: 0; font-size: 36px; font-weight: 500; line-height: 1.1;
  letter-spacing: 0.0073em; color: var(--chetto-color-ink);
}
@media (min-width: 640px) { .chetto-editorial__hero-title { font-size: 48px; } }

.chetto-editorial__hero-subtitle {
  margin: 32px 0 0; max-width: 672px;
  font-size: 17px; line-height: 28px;
  color: rgba(10,10,10,.7); letter-spacing: -0.0244em;
}
@media (min-width: 640px) { .chetto-editorial__hero-subtitle { font-size: 18px; } }

/* Body container */
.chetto-editorial__body {
  max-width: 1200px; margin-inline: auto;
  padding: 64px 24px;
  display: flex; flex-direction: column; gap: 64px;
}
@media (min-width: 640px) { .chetto-editorial__body { padding-inline: 48px; } }

/* Section common */
.chetto-editorial__section-title {
  margin: 0; text-align: center;
  font-size: 26px; font-weight: 500; line-height: 1.2;
  letter-spacing: 0.0132em; color: var(--chetto-color-ink);
}
@media (min-width: 640px) {
  .chetto-editorial__section-title { font-size: 30px; line-height: 36px; }
}
.chetto-editorial__section-title--inline { text-align: left; display: inline-block; }
.chetto-editorial__title-brand { color: var(--chetto-color-brand); }

.chetto-editorial__centered-block {
  max-width: 768px; margin-inline: auto; text-align: center;
}
.chetto-editorial__centered-text {
  margin: 24px 0 0; font-size: 17px; line-height: 1.625;
  color: rgba(10,10,10,.7); letter-spacing: -0.0244em;
}
@media (min-width: 640px) { .chetto-editorial__centered-text { font-size: 18px; } }

/* Brand banner (envío gratis) */
.chetto-editorial__brand-banner {
  background: linear-gradient(180deg, var(--chetto-color-brand) 0%, #a89584 100%);
  border-radius: 24px; padding: 40px 32px;
  color: var(--chetto-color-white); text-align: center;
  box-shadow: 0 1px 3px rgba(0,0,0,.05);
}
.chetto-editorial__brand-banner-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; margin-inline: auto;
  color: var(--chetto-color-white);
}
.chetto-editorial__brand-banner-title {
  margin: 24px 0 0; font-size: 26px; font-weight: 500;
  line-height: 1.2; letter-spacing: 0.0132em;
}
@media (min-width: 640px) { .chetto-editorial__brand-banner-title { font-size: 30px; } }
.chetto-editorial__brand-banner-subtitle {
  margin: 12px 0 0; font-size: 17px; line-height: 28px;
  color: rgba(255,255,255,.9);
}
@media (min-width: 640px) { .chetto-editorial__brand-banner-subtitle { font-size: 18px; } }

/* Opciones de envío (cards) */
.chetto-editorial__options-grid {
  margin-top: 40px; display: grid; grid-template-columns: 1fr; gap: 24px;
}
@media (min-width: 640px)  { .chetto-editorial__options-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .chetto-editorial__options-grid { grid-template-columns: repeat(3, 1fr); } }

.chetto-editorial__option-card {
  display: flex; flex-direction: column;
  background: var(--chetto-color-surface-muted);
  border: 1px solid var(--chetto-color-border-subtle);
  border-radius: 16px; padding: 32px;
}
.chetto-editorial__option-head {
  display: flex; align-items: flex-start; justify-content: space-between;
}
.chetto-editorial__option-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; border-radius: 9999px;
  background: var(--chetto-color-brand); color: var(--chetto-color-white);
}
.chetto-editorial__option-price {
  font-size: 24px; font-weight: 700; line-height: 1; color: var(--chetto-color-brand);
}
.chetto-editorial__option-name {
  margin: 24px 0 0; font-size: 20px; font-weight: 500;
  letter-spacing: -0.0225em; color: var(--chetto-color-ink);
}
.chetto-editorial__option-eta {
  margin: 8px 0 0; display: flex; align-items: center; gap: 8px;
  font-size: 14px; color: rgba(10,10,10,.7);
}
.chetto-editorial__option-desc {
  margin: 8px 0 0; font-size: 14px; line-height: 20px; color: rgba(10,10,10,.7);
}

/* Tabla tarifas */
.chetto-editorial__table-scroll {
  margin-top: 40px; overflow-x: auto; -webkit-overflow-scrolling: touch;
}
.chetto-editorial__rates {
  width: 100%; min-width: 720px;
  border-collapse: separate; border-spacing: 0;
  border-radius: 16px; overflow: hidden;
  text-align: left; font-size: 15px;
}
.chetto-editorial__rates thead {
  background: var(--chetto-color-ink); color: var(--chetto-color-white);
}
.chetto-editorial__rates th {
  padding: 16px 24px; font-weight: 700;
  letter-spacing: -0.01em; white-space: nowrap;
}
.chetto-editorial__rates td {
  padding: 16px 24px; color: rgba(10,10,10,.7); background: var(--chetto-color-white);
}
.chetto-editorial__rates-row--zebra td { background: var(--chetto-color-surface-muted); }
.chetto-editorial__rates-region { font-weight: 500; color: var(--chetto-color-ink) !important; }

/* Timeline */
.chetto-editorial__timeline {
  background: var(--chetto-color-surface-muted);
  border-radius: 24px; padding: 48px 32px;
}
@media (min-width: 640px) { .chetto-editorial__timeline { padding-inline: 48px; } }

.chetto-editorial__timeline-desc {
  max-width: 640px; margin: 16px auto 0; text-align: center;
  font-size: 15px; line-height: 24px; color: rgba(10,10,10,.7);
}
@media (min-width: 640px) { .chetto-editorial__timeline-desc { font-size: 16px; } }

.chetto-editorial__timeline-list {
  list-style: none; margin: 40px 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px;
}
@media (min-width: 640px) { .chetto-editorial__timeline-list { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 768px) {
  .chetto-editorial__timeline-list {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 0;
  }
}
.chetto-editorial__timeline-item {
  position: relative; display: flex; flex-direction: column;
  align-items: center; text-align: center;
}
@media (min-width: 768px) { .chetto-editorial__timeline-item { flex: 1 1 0; } }

.chetto-editorial__timeline-circle-wrap {
  position: relative; display: flex; align-items: center; justify-content: center;
  width: 100%;
}
.chetto-editorial__timeline-line { display: none; }
@media (min-width: 768px) {
  .chetto-editorial__timeline-line {
    display: block; position: absolute; left: 50%; top: 50%;
    width: 100%; height: 2px; transform: translateY(-50%);
    background: var(--chetto-color-brand);
  }
}
.chetto-editorial__timeline-circle {
  position: relative; z-index: 1;
  display: inline-flex; align-items: center; justify-content: center;
  width: 64px; height: 64px; border-radius: 9999px;
  border: 2px solid var(--chetto-color-brand);
  background: var(--chetto-color-white);
  font-size: 20px; font-weight: 700; color: var(--chetto-color-brand);
}
.chetto-editorial__timeline-title {
  margin-top: 12px; font-size: 14px; line-height: 20px; color: var(--chetto-color-ink);
}

/* Yellow grid */
.chetto-editorial__yellow-grid {
  display: grid; grid-template-columns: 1fr; gap: 32px;
}
@media (min-width: 768px) { .chetto-editorial__yellow-grid { grid-template-columns: repeat(2, 1fr); } }

.chetto-editorial__yellow-card {
  background: #fff9e6;
  border: 1px solid rgba(196,181,160,.2);
  border-radius: 16px; padding: 32px;
}
.chetto-editorial__yellow-card--single { padding: 32px; }
.chetto-editorial__yellow-card-row { display: flex; gap: 16px; }
.chetto-editorial__yellow-card-icon { margin-top: 4px; flex-shrink: 0; color: var(--chetto-color-ink); }
.chetto-editorial__yellow-card-body { flex: 1; }
.chetto-editorial__yellow-card-title {
  margin: 0; font-size: 20px; font-weight: 500;
  letter-spacing: -0.0225em; color: var(--chetto-color-ink);
}
.chetto-editorial__yellow-card-title--lg {
  font-size: 24px; line-height: 32px; letter-spacing: 0.0029em;
}
.chetto-editorial__bullet-list {
  list-style: none; margin: 16px 0 0; padding: 0;
  display: flex; flex-direction: column; gap: 8px;
  font-size: 15px; line-height: 24px; color: rgba(10,10,10,.7);
}
@media (min-width: 640px) { .chetto-editorial__bullet-list { font-size: 16px; } }

/* Dark banner */
.chetto-editorial__dark-banner {
  background: var(--chetto-color-ink); border-radius: 24px;
  padding: 48px 32px; text-align: center; color: var(--chetto-color-white);
}
@media (min-width: 640px) { .chetto-editorial__dark-banner { padding-inline: 48px; } }
.chetto-editorial__dark-banner-title {
  margin: 0; font-size: 26px; font-weight: 500; letter-spacing: 0.0132em;
}
@media (min-width: 640px) { .chetto-editorial__dark-banner-title { font-size: 30px; } }
.chetto-editorial__dark-banner-desc {
  margin: 20px auto 0; max-width: 640px;
  font-size: 17px; line-height: 28px; color: rgba(255,255,255,.9);
}
@media (min-width: 640px) { .chetto-editorial__dark-banner-desc { font-size: 18px; } }
.chetto-editorial__dark-banner-cta { margin-top: 32px; }

/* Final CTA */
.chetto-editorial__final-cta { text-align: center; }
.chetto-editorial__final-cta-title {
  margin: 0; font-size: 26px; font-weight: 500;
  letter-spacing: 0.0132em; color: var(--chetto-color-ink);
}
@media (min-width: 640px) { .chetto-editorial__final-cta-title { font-size: 30px; } }
.chetto-editorial__final-cta-desc {
  margin: 16px 0 0; font-size: 17px; line-height: 28px; color: rgba(10,10,10,.7);
}
@media (min-width: 640px) { .chetto-editorial__final-cta-desc { font-size: 18px; } }
.chetto-editorial__final-cta-row { margin-top: 32px; }

/* Botones */
.chetto-editorial__btn {
  display: inline-flex; align-items: center; justify-content: center;
  height: 56px; min-width: 200px; padding: 0 32px;
  border-radius: 9999px;
  font-size: 16px; font-weight: 500; line-height: 24px;
  letter-spacing: -0.0195em; text-decoration: none;
  border: 0; cursor: pointer;
  transition: opacity .15s ease, background-color .15s ease, color .15s ease;
}
.chetto-editorial__btn--brand { background: var(--chetto-color-brand); color: var(--chetto-color-white); }
.chetto-editorial__btn--brand:hover { background: var(--chetto-color-brand-hover); color: var(--chetto-color-white); }
.chetto-editorial__btn--white { background: var(--chetto-color-white); color: var(--chetto-color-ink); }
.chetto-editorial__btn--white:hover { background: rgba(255,255,255,.9); color: var(--chetto-color-ink); }
.chetto-editorial__btn--ghost-white {
  background: transparent; color: var(--chetto-color-white);
  border: 2px solid var(--chetto-color-white);
}
.chetto-editorial__btn--ghost-white:hover { background: rgba(255,255,255,.1); color: var(--chetto-color-white); }
.chetto-editorial__btn--sm { height: 48px; min-width: 0; padding: 0 24px; }

/* Returns: process */
.chetto-editorial__process-grid {
  list-style: none; margin: 48px 0 0; padding: 0;
  display: grid; grid-template-columns: 1fr; gap: 24px;
}
@media (min-width: 640px)  { .chetto-editorial__process-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .chetto-editorial__process-grid { grid-template-columns: repeat(4, 1fr); } }

.chetto-editorial__process-card {
  position: relative;
  background: var(--chetto-color-surface-muted);
  border-radius: 16px; padding: 24px;
}
.chetto-editorial__process-num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; border-radius: 9999px;
  background: var(--chetto-color-brand); color: var(--chetto-color-white);
  font-size: 24px; font-weight: 700; line-height: 32px;
}
.chetto-editorial__process-title {
  margin: 20px 0 0; font-size: 20px; font-weight: 500; line-height: 28px;
  letter-spacing: -0.0225em; color: var(--chetto-color-ink);
}
.chetto-editorial__process-desc {
  margin: 12px 0 0; font-size: 14px; line-height: 20px;
  color: rgba(10,10,10,.7); letter-spacing: -0.0107em;
}
.chetto-editorial__process-arrow {
  display: none; position: absolute; top: 50%; right: -18px;
  transform: translateY(-50%);
  font-size: 24px; line-height: 1; color: var(--chetto-color-brand);
  pointer-events: none;
}
@media (min-width: 1024px) { .chetto-editorial__process-arrow { display: block; } }

/* Dot list */
.chetto-editorial__dot-list {
  list-style: none; margin: 16px 0 0; padding: 0;
  display: flex; flex-direction: column; gap: 12px;
}
.chetto-editorial__dot-list li {
  display: flex; align-items: flex-start; gap: 16px;
  font-size: 16px; line-height: 24px; color: rgba(10,10,10,.7);
}
.chetto-editorial__dot-marker {
  margin-top: 9px; width: 8px; height: 8px; flex-shrink: 0;
  border-radius: 9999px; background: var(--chetto-color-brand);
}

/* Reasons */
.chetto-editorial__reasons-grid {
  margin-top: 48px; display: grid; grid-template-columns: 1fr; gap: 24px;
}
@media (min-width: 768px) { .chetto-editorial__reasons-grid { grid-template-columns: repeat(3, 1fr); } }

.chetto-editorial__reason-card {
  background: var(--chetto-color-surface-muted);
  border-radius: 16px; padding: 32px;
}
.chetto-editorial__reason-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; border-radius: 9999px;
  background: var(--chetto-color-brand); color: var(--chetto-color-white);
}
.chetto-editorial__reason-title {
  margin: 24px 0 0; font-size: 20px; font-weight: 500; line-height: 28px;
  letter-spacing: -0.0225em; color: var(--chetto-color-ink);
}
.chetto-editorial__reason-desc {
  margin: 8px 0 0; font-size: 16px; line-height: 24px;
  color: rgba(10,10,10,.7); letter-spacing: -0.0195em;
}

/* Red card */
.chetto-editorial__red-card {
  background: #fef2f2; border: 2px solid #ffc9c9;
  border-radius: 16px; padding: 32px;
}
.chetto-editorial__red-card-title {
  margin: 0; font-size: 24px; font-weight: 500; line-height: 32px;
  letter-spacing: 0.0029em; color: var(--chetto-color-ink);
  display: flex; align-items: center; gap: 12px;
}
.chetto-editorial__red-list {
  list-style: none; margin: 24px 0 0; padding: 0;
  display: flex; flex-direction: column; gap: 12px;
}
.chetto-editorial__red-list li {
  display: flex; align-items: flex-start; gap: 12px;
  font-size: 16px; line-height: 24px; color: rgba(10,10,10,.7);
}
.chetto-editorial__red-bullet { font-weight: 700; line-height: 24px; color: #e7000b; }
.chetto-editorial__cross-icon { font-size: 30px; line-height: 1; color: #e7000b; }

/* Green card */
.chetto-editorial__green-card {
  background: #f0fdf4; border: 2px solid #b9f8cf;
  border-radius: 16px; padding: 32px;
}
.chetto-editorial__green-card-row { display: flex; gap: 16px; }
.chetto-editorial__green-card-icon { margin-top: 4px; flex-shrink: 0; color: #00a63e; }
.chetto-editorial__green-card-body { flex: 1; }
.chetto-editorial__green-card-title {
  margin: 0; font-size: 24px; font-weight: 500; line-height: 32px;
  letter-spacing: 0.0029em; color: var(--chetto-color-ink);
  display: flex; align-items: center; gap: 12px;
}
.chetto-editorial__green-card-desc {
  margin: 16px 0 0; font-size: 16px; line-height: 26px;
  color: rgba(10,10,10,.7); letter-spacing: -0.0195em;
}
.chetto-editorial__check-icon { font-size: 30px; line-height: 1; color: #00a63e; }

/* Brand CTA banner */
.chetto-editorial__brand-cta {
  background: linear-gradient(180deg, var(--chetto-color-brand) 0%, #a89584 100%);
  border-radius: 24px; padding: 48px 32px;
  text-align: center; color: var(--chetto-color-white);
}
@media (min-width: 640px) { .chetto-editorial__brand-cta { padding-inline: 48px; } }
.chetto-editorial__brand-cta-title {
  margin: 0; font-size: 26px; font-weight: 500; line-height: 1.2;
  letter-spacing: 0.0132em; color: var(--chetto-color-white);
}
@media (min-width: 640px) { .chetto-editorial__brand-cta-title { font-size: 30px; } }
.chetto-editorial__brand-cta-desc {
  margin: 16px auto 0; max-width: 763px;
  font-size: 17px; line-height: 28px;
  color: rgba(255,255,255,.9); letter-spacing: -0.0244em;
}
@media (min-width: 640px) { .chetto-editorial__brand-cta-desc { font-size: 18px; } }
.chetto-editorial__brand-cta-row {
  margin-top: 32px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px;
}
@media (min-width: 640px) { .chetto-editorial__brand-cta-row { flex-direction: row; } }
.chetto-editorial__brand-cta--simple { padding-block: 48px; }

/* Help: channels */
.chetto-editorial__channels-grid {
  margin-top: 48px; display: grid; grid-template-columns: 1fr; gap: 24px;
}
@media (min-width: 768px)  { .chetto-editorial__channels-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .chetto-editorial__channels-grid { grid-template-columns: repeat(3, 1fr); } }

.chetto-editorial__channel-card {
  display: flex; flex-direction: column;
  background: linear-gradient(180deg, var(--chetto-color-brand) 0%, #a89584 100%);
  border-radius: 16px; padding: 32px;
  color: var(--chetto-color-white);
}
.chetto-editorial__channel-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 56px; height: 56px; border-radius: 9999px;
  background: rgba(255,255,255,.2);
}
.chetto-editorial__channel-name {
  margin: 24px 0 0; font-size: 24px; font-weight: 500; line-height: 32px;
  letter-spacing: 0.0029em;
}
.chetto-editorial__channel-desc {
  margin: 8px 0 0; font-size: 17px; line-height: 28px;
  color: rgba(255,255,255,.9); letter-spacing: -0.0244em;
}
@media (min-width: 640px) { .chetto-editorial__channel-desc { font-size: 18px; } }
.chetto-editorial__channel-availability {
  margin: 8px 0 0; font-size: 14px; line-height: 20px;
  color: rgba(255,255,255,.7); letter-spacing: -0.0107em;
}
.chetto-editorial__channel-cta {
  display: inline-flex; align-items: center; justify-content: center;
  margin-top: 32px; align-self: flex-start;
  height: 48px; padding: 0 24px; border-radius: 9999px;
  background: var(--chetto-color-white); color: var(--chetto-color-ink);
  font-size: 16px; font-weight: 500; text-decoration: none;
  transition: background-color .15s ease;
}
.chetto-editorial__channel-cta:hover { background: rgba(255,255,255,.9); color: var(--chetto-color-ink); }

/* Help: topics */
.chetto-editorial__topics-grid {
  margin-top: 48px; display: grid; grid-template-columns: 1fr; gap: 24px;
}
@media (min-width: 640px)  { .chetto-editorial__topics-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .chetto-editorial__topics-grid { grid-template-columns: repeat(4, 1fr); } }

.chetto-editorial__topic-card {
  display: flex; flex-direction: column;
  background: var(--chetto-color-surface-muted);
  border-radius: 16px; padding: 24px;
  text-decoration: none; color: inherit;
  transition: background-color .15s ease;
}
.chetto-editorial__topic-card:hover { background: #efeae1; color: inherit; }
.chetto-editorial__topic-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; border-radius: 9999px;
  background: var(--chetto-color-brand); color: var(--chetto-color-white);
}
.chetto-editorial__topic-title {
  margin: 24px 0 0; font-size: 18px; font-weight: 500; line-height: 28px;
  letter-spacing: -0.0244em; color: var(--chetto-color-ink);
}
.chetto-editorial__topic-desc {
  margin: 8px 0 0; font-size: 14px; font-weight: 500; line-height: 20px;
  color: rgba(10,10,10,.7); letter-spacing: -0.0107em;
}

/* Help: schedule */
.chetto-editorial__schedule {
  background: var(--chetto-color-surface-muted);
  border-radius: 24px; padding: 32px;
}
@media (min-width: 640px) { .chetto-editorial__schedule { padding: 48px; } }

.chetto-editorial__schedule-grid {
  display: grid; grid-template-columns: 1fr; gap: 32px;
}
@media (min-width: 1024px) {
  .chetto-editorial__schedule-grid { grid-template-columns: repeat(2, 1fr); gap: 48px; }
}
.chetto-editorial__schedule-head { display: flex; align-items: center; gap: 12px; }
.chetto-editorial__schedule-clock { display: inline-flex; color: var(--chetto-color-ink); }
.chetto-editorial__schedule-list {
  margin: 24px 0 0; padding: 0;
  display: flex; flex-direction: column;
}
.chetto-editorial__schedule-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 0; border-bottom: 1px solid rgba(196,181,160,.2);
}
.chetto-editorial__schedule-row--last { border-bottom: 0; }
.chetto-editorial__schedule-row dt {
  margin: 0; font-size: 16px; line-height: 24px;
  color: var(--chetto-color-ink); letter-spacing: -0.0195em;
}
.chetto-editorial__schedule-row dd {
  margin: 0; font-size: 16px; font-weight: 600; line-height: 24px;
  color: var(--chetto-color-ink); letter-spacing: -0.0195em;
}
.chetto-editorial__schedule-right {
  background: var(--chetto-color-white);
  border-radius: 16px; padding: 32px;
}
.chetto-editorial__after-title {
  margin: 0; font-size: 20px; font-weight: 500; line-height: 28px;
  color: var(--chetto-color-ink); letter-spacing: -0.0225em;
}
.chetto-editorial__after-desc {
  margin: 16px 0 0; font-size: 16px; line-height: 24px;
  color: rgba(10,10,10,.7); letter-spacing: -0.0195em;
}
.chetto-editorial__after-title + .chetto-editorial__btn,
.chetto-editorial__after-desc + .chetto-editorial__btn { margin-top: 32px; }

/* Help: pills */
.chetto-editorial__pill-list {
  list-style: none; margin: 32px 0 0; padding: 0;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px;
}
.chetto-editorial__pill {
  display: inline-flex; align-items: center; justify-content: center;
  height: 46px; padding: 0 24px; border-radius: 9999px;
  background: var(--chetto-color-white);
  border: 1px solid rgba(196,181,160,.3);
  color: var(--chetto-color-ink); font-size: 14px; font-weight: 500;
  text-decoration: none;
  transition: background-color .15s ease, border-color .15s ease;
}
.chetto-editorial__pill:hover {
  background: rgba(196,181,160,.05);
  border-color: var(--chetto-color-brand);
  color: var(--chetto-color-ink);
}

/* Help: brand banner large */
.chetto-editorial__brand-banner-lg {
  background: linear-gradient(180deg, var(--chetto-color-brand) 0%, #a89584 100%);
  border-radius: 24px; padding: 48px 32px;
}
@media (min-width: 640px)  { .chetto-editorial__brand-banner-lg { padding: 56px; } }
@media (min-width: 1024px) { .chetto-editorial__brand-banner-lg { padding-inline: 96px; } }

.chetto-editorial__brand-banner-inner {
  max-width: 768px; margin-inline: auto; text-align: center;
}
.chetto-editorial__brand-banner-h2 {
  margin: 0; font-size: 26px; font-weight: 500; line-height: 1.2;
  letter-spacing: 0.0132em; color: var(--chetto-color-white);
}
@media (min-width: 640px) { .chetto-editorial__brand-banner-h2 { font-size: 30px; } }
.chetto-editorial__brand-banner-p {
  margin: 24px 0 0; font-size: 17px; line-height: 1.625;
  color: rgba(255,255,255,.9); letter-spacing: -0.0244em;
}
@media (min-width: 640px) { .chetto-editorial__brand-banner-p { font-size: 18px; } }
.chetto-editorial__kpis-grid {
  margin: 40px 0 0; padding: 0;
  display: grid; grid-template-columns: 1fr; gap: 24px;
}
@media (min-width: 640px) { .chetto-editorial__kpis-grid { grid-template-columns: repeat(3, 1fr); } }
.chetto-editorial__kpi { display: flex; flex-direction: column; align-items: center; }
.chetto-editorial__kpi-value {
  margin: 0; font-size: 48px; font-weight: 500; line-height: 1;
  letter-spacing: 0.0103em; color: var(--chetto-color-white);
}
.chetto-editorial__kpi-label {
  margin: 8px 0 0; font-size: 14px; line-height: 20px;
  color: rgba(255,255,255,.8); letter-spacing: -0.0107em;
}

/* Care: guide */
.chetto-editorial__guide-grid {
  margin-top: 48px; display: grid; grid-template-columns: 1fr; gap: 32px;
}
@media (min-width: 768px) { .chetto-editorial__guide-grid { grid-template-columns: repeat(2, 1fr); } }

.chetto-editorial__guide-card {
  background: #f7f6f4; border-radius: 16px; padding: 32px;
}
.chetto-editorial__guide-head { display: flex; align-items: center; gap: 16px; }
.chetto-editorial__guide-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 56px; height: 56px; flex-shrink: 0;
  border-radius: 9999px;
  background: var(--chetto-color-brand); color: var(--chetto-color-white);
}
.chetto-editorial__guide-img { width: 28px; height: 28px; object-fit: contain; }
.chetto-editorial__guide-title {
  margin: 0; font-size: 24px; font-weight: 500; line-height: 32px;
  letter-spacing: 0.003em; color: var(--chetto-color-ink);
}

/* Care: tips */
.chetto-editorial__tips-grid {
  margin-top: 48px; display: grid; grid-template-columns: 1fr; gap: 32px;
}
@media (min-width: 768px) { .chetto-editorial__tips-grid { grid-template-columns: repeat(2, 1fr); } }

.chetto-editorial__check-list {
  list-style: none; margin: 24px 0 0; padding: 0;
  display: flex; flex-direction: column; gap: 12px;
}
.chetto-editorial__check-list li {
  display: flex; align-items: flex-start; gap: 12px;
  font-size: 16px; line-height: 24px; color: rgba(10,10,10,.7);
  letter-spacing: -0.0195em;
}
.chetto-editorial__check-bullet { font-weight: 700; color: #00a63e; }
.chetto-editorial__cross-bullet { font-weight: 700; color: #e7000b; }

/* Neutral CTA */
.chetto-editorial__neutral-cta {
  background: #f7f6f4; border-radius: 24px;
  padding: 48px 32px; text-align: center;
}
@media (min-width: 640px) { .chetto-editorial__neutral-cta { padding-inline: 96px; } }
.chetto-editorial__neutral-cta-title {
  margin: 0; font-size: 26px; font-weight: 500; line-height: 1.2;
  letter-spacing: 0.013em; color: var(--chetto-color-ink);
}
@media (min-width: 640px) { .chetto-editorial__neutral-cta-title { font-size: 30px; } }
.chetto-editorial__neutral-cta-desc {
  margin: 16px auto 0; max-width: 600px;
  font-size: 17px; line-height: 28px;
  color: rgba(10,10,10,.7); letter-spacing: -0.0244em;
}
@media (min-width: 640px) { .chetto-editorial__neutral-cta-desc { font-size: 18px; } }
.chetto-editorial__neutral-cta-row { margin-top: 32px; }

/* Variants */
.chetto-editorial__green-card--simple { padding: 32px; }
.chetto-editorial__red-card--simple { padding: 32px; }
.chetto-editorial__green-card--simple .chetto-editorial__green-card-title { margin-bottom: 0; }

/* ------------------------------------------------------------------ */
/* Search dropdown (predictive)                                        */
/* ------------------------------------------------------------------ */
.chetto-search-dropdown {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 8px);
  z-index: 60;
  background: var(--chetto-color-white);
  border: 1px solid var(--chetto-color-border-subtle);
  border-radius: var(--chetto-radius-md);
  box-shadow: 0 12px 32px -8px rgba(10, 10, 10, 0.18), 0 4px 8px -4px rgba(10, 10, 10, 0.08);
  padding: 8px;
  max-height: 420px;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.chetto-search-dropdown[hidden] { display: none; }

.chetto-search-dropdown__list {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.chetto-search-dropdown__msg {
  padding: 16px;
  font-size: 14px;
  color: rgba(10, 10, 10, 0.6);
  font-family: inherit;
}

.chetto-search-dropdown__msg--error {
  color: #b94a48;
}

.chetto-search-dropdown__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: var(--chetto-radius-sm);
  color: var(--chetto-color-ink);
  text-decoration: none;
  transition: background-color 120ms ease;
}

.chetto-search-dropdown__item:hover,
.chetto-search-dropdown__item:focus-visible {
  background: var(--chetto-color-surface-muted);
  outline: none;
}

.chetto-search-dropdown__thumb {
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  border-radius: var(--chetto-radius-sm);
  background: var(--chetto-color-surface-muted);
  border: 1px solid var(--chetto-color-border-subtle);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.chetto-search-dropdown__thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.chetto-search-dropdown__body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.chetto-search-dropdown__name {
  font-size: 14px;
  font-weight: 500;
  color: var(--chetto-color-ink);
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.chetto-search-dropdown__price {
  font-size: 13px;
  color: rgba(10, 10, 10, 0.7);
  font-weight: 500;
}

@media (min-width: 768px) {
  .chetto-search-dropdown {
    padding: 8px;
  }
  .chetto-search-dropdown__item {
    padding: 12px;
  }
}

/* ====================================================================== */
/* 404 — Página no encontrada (replica del estilo Next.js)                */
/* ====================================================================== */
.chetto-404 {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 60vh;
  padding: 64px 16px;
  background: var(--chetto-color-surface);
}
@media (min-width: 768px) {
  .chetto-404 { padding: 96px 24px; min-height: 70vh; }
}

.chetto-404__inner {
  width: 100%;
  max-width: 560px;
  margin-inline: auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.chetto-404__eyebrow {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 0 12px;
  border-radius: 9999px;
  background: var(--chetto-color-surface-muted);
  color: rgba(10, 10, 10, 0.65);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 24px;
}

.chetto-404__title {
  margin: 0;
  font-size: 32px;
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -0.0225em;
  color: var(--chetto-color-ink);
}
@media (min-width: 640px) { .chetto-404__title { font-size: 40px; } }
@media (min-width: 1024px) { .chetto-404__title { font-size: 48px; } }

.chetto-404__subtitle {
  margin: 16px 0 0;
  font-size: 16px;
  line-height: 26px;
  color: rgba(10, 10, 10, 0.7);
  letter-spacing: -0.0152em;
  max-width: 460px;
}
@media (min-width: 640px) { .chetto-404__subtitle { font-size: 17px; line-height: 28px; } }

.chetto-404__actions {
  margin-top: 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  max-width: 360px;
}
@media (min-width: 640px) {
  .chetto-404__actions {
    flex-direction: row;
    justify-content: center;
    max-width: none;
    gap: 16px;
  }
}

.chetto-404__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 56px;
  min-width: 180px;
  padding: 0 28px;
  border-radius: 9999px;
  font-size: 15px;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: -0.0195em;
  text-decoration: none;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease, opacity .15s ease;
}

.chetto-404__btn--brand {
  background: var(--chetto-color-brand);
  color: var(--chetto-color-white);
  border-color: var(--chetto-color-brand);
}
.chetto-404__btn--brand:hover {
  background: var(--chetto-color-brand-hover);
  border-color: var(--chetto-color-brand-hover);
  color: var(--chetto-color-white);
}

.chetto-404__btn--ghost {
  background: transparent;
  color: var(--chetto-color-ink);
  border-color: var(--chetto-color-border-subtle);
}
.chetto-404__btn--ghost:hover {
  background: var(--chetto-color-surface-muted);
  color: var(--chetto-color-ink);
  border-color: var(--chetto-color-ink);
}

.chetto-404__help {
  margin: 32px 0 0;
  font-size: 14px;
  line-height: 22px;
  color: rgba(10, 10, 10, 0.55);
}
.chetto-404__help-link {
  color: var(--chetto-color-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
.chetto-404__help-link:hover { color: var(--chetto-color-brand); }

/* ============================================================================
   .ch-card · Card de producto (réplica 1:1 de CollectionCard.tsx Next.js).
   Vive aquí (custom.css) para cargarse en TODAS las páginas: home, colecciones,
   búsqueda, favoritos, /tienda, /novedades, /ofertas. NO mover a home.css.
   ============================================================================ */
:root {
  --ch-card-ink: #2d2d2d;
  --ch-card-brand: #c4b5a0;
  --ch-card-border: #e8e6e3;
  --ch-card-muted: #6b6b6b;
  --ch-card-radius: 16px;
  --ch-card-shadow: 0 1px 3px 0 rgba(0,0,0,.1), 0 1px 2px 0 rgba(0,0,0,.1);
}

.product-miniature.ch-card,
.ch-card { display: block; position: relative; }

.product-miniature.ch-card .ch-card__media,
.ch-card__media {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 302 / 403;
  overflow: hidden;
  border-radius: var(--ch-card-radius);
  background: #fff;
  border: 1px solid var(--ch-card-border);
}

.product-miniature.ch-card .ch-card__media-link,
.ch-card__media-link {
  position: absolute;
  inset: 0;
  display: block;
  z-index: 0;
  text-decoration: none;
}

.product-miniature.ch-card .ch-card__img,
.ch-card__img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
  padding: 24px !important;
  background: #fff;
  transition: transform .5s ease;
}
.product-miniature.ch-card:hover .ch-card__img,
.ch-card:hover .ch-card__img,
.ch-card__media:hover .ch-card__img { transform: scale(1.05); }

.product-miniature.ch-card .ch-card__badge,
.ch-card__badge {
  pointer-events: none;
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 10;
  display: inline-flex;
  align-items: center;
  border-radius: 9999px;
  background: rgba(255,255,255,.9);
  padding: 4px 12px;
  font-size: 12px;
  line-height: 16px;
  color: var(--ch-card-ink);
}

.product-miniature.ch-card .ch-card__wish,
.ch-card__wish {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 11;
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 9999px;
  background: rgba(255,255,255,.9);
  color: var(--ch-card-ink);
  cursor: pointer;
  box-shadow: var(--ch-card-shadow);
  transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.ch-card__wish:hover,
.ch-card__wish:focus-visible {
  background: #fff;
  color: var(--ch-card-brand);
  outline: none;
}
.ch-card__wish:active { transform: scale(.94); }
.ch-card__wish svg { width: 16px; height: 16px; display: block; }
.ch-card__wish.is-active { color: var(--ch-card-brand); }
.ch-card__wish.is-active svg { fill: currentColor; }
.ch-card__wish[disabled] { opacity: .5; cursor: not-allowed; }

.product-miniature.ch-card .ch-card__action,
.ch-card__action {
  position: absolute;
  inset: auto 0 0 0;
  z-index: 10;
  display: inline-flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  padding: 12px 0;
  background: var(--ch-card-ink);
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: -0.0107em;
  border: 0;
  cursor: pointer;
  border-radius: 0 0 var(--ch-card-radius) var(--ch-card-radius);
  transform: translateY(100%);
  transition: transform .3s ease, background-color .2s;
  pointer-events: none;
  text-decoration: none;
}
.product-miniature.ch-card .ch-card__media:hover .ch-card__action,
.product-miniature.ch-card .ch-card__media:focus-within .ch-card__action,
.ch-card__media:hover .ch-card__action,
.ch-card__media:focus-within .ch-card__action,
.ch-card:hover .ch-card__action,
.ch-card__action:focus-visible {
  transform: translateY(0);
  pointer-events: auto;
}
.ch-card__action:hover { background: var(--ch-card-brand); color: #fff; }
.ch-card__action[disabled] { opacity: .6; cursor: progress; }

@media (max-width: 767.98px) {
  .product-miniature.ch-card .ch-card__action,
  .ch-card__action {
    transform: translateY(0);
    pointer-events: auto;
  }
}

.product-miniature.ch-card .ch-card__info,
.ch-card__info {
  display: block;
  margin-top: 16px;
  text-decoration: none;
  color: var(--ch-card-ink);
}
.ch-card__info:hover { text-decoration: none; }
.product-miniature.ch-card .ch-card__title,
.ch-card__title {
  margin: 0;
  font-size: 18px;
  font-weight: 500;
  line-height: 28px;
  color: var(--ch-card-ink);
  letter-spacing: -0.0244em;
}
.product-miniature.ch-card:hover .ch-card__title,
.ch-card:hover .ch-card__title,
.ch-card__info:hover .ch-card__title { text-decoration: underline; }
.ch-card__price-row {
  margin-top: 4px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.product-miniature.ch-card .ch-card__price,
.ch-card__price {
  margin: 0;
  font-size: 16px;
  color: var(--ch-card-ink);
  letter-spacing: -0.0195em;
}
.ch-card__price-old {
  margin-left: 8px;
  font-size: 14px;
  color: var(--ch-card-muted);
  text-decoration: line-through;
}
.ch-card__variant-info {
  margin: 0;
  font-size: 12px;
  color: var(--ch-card-muted);
}

/* Tallas disponibles · siempre visibles debajo del precio.
   Pills SIN background, solo border BEIGE (brand color) y texto ink. */
.ch-card__sizes {
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ch-card__size {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 24px;
  padding: 0 8px;
  border: 1px solid var(--chetto-color-brand, #c4b5a0);
  border-radius: 9999px;
  background: transparent;
  color: var(--chetto-color-ink, #2d2d2d);
  font-size: 11px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  transition: background-color .15s ease, color .15s ease;
}
/* Cliente: ocultar TODOS los page-headers nativos PS (título grande
   genérico). El theme chetto tiene sus propias cabeceras por página. */
.page-header,
.page-title-section,
#js-product-list-header { display: none !important; }

/* ============================================================================
   Override del PRIMARY de Bootstrap: azul Hummingbird (#0b69f6) → beige Chetto.
   Afecta a TODOS los .btn-primary, .btn-outline-primary, links, etc.
   ============================================================================ */
:root {
  --bs-primary: #c4b5a0;
  --bs-primary-rgb: 196, 181, 160;
  --bs-link-color: #c4b5a0;
  --bs-link-color-rgb: 196, 181, 160;
  --bs-link-hover-color: #a89584;
}
.btn-primary,
.btn-primary:focus {
  --bs-btn-bg: #c4b5a0;
  --bs-btn-border-color: #c4b5a0;
  --bs-btn-hover-bg: #a89584;
  --bs-btn-hover-border-color: #a89584;
  --bs-btn-active-bg: #a89584;
  --bs-btn-active-border-color: #a89584;
  --bs-btn-disabled-bg: #d6cdbf;
  --bs-btn-disabled-border-color: #d6cdbf;
  background-color: #c4b5a0 !important;
  border-color: #c4b5a0 !important;
  color: #fff !important;
}
.btn-primary:hover { background-color: #a89584 !important; border-color: #a89584 !important; }
.btn-outline-primary,
.btn-outline-primary:focus {
  --bs-btn-color: #c4b5a0;
  --bs-btn-border-color: #c4b5a0;
  --bs-btn-hover-bg: #c4b5a0;
  --bs-btn-hover-border-color: #c4b5a0;
  --bs-btn-active-bg: #c4b5a0;
  --bs-btn-active-border-color: #c4b5a0;
  color: #c4b5a0 !important;
  border-color: #c4b5a0 !important;
  background-color: transparent !important;
}
.btn-outline-primary:hover { background-color: #c4b5a0 !important; color: #fff !important; }
a.text-primary, .text-primary { color: #c4b5a0 !important; }
.bg-primary { background-color: #c4b5a0 !important; }
.form-check-input:checked { background-color: #c4b5a0 !important; border-color: #c4b5a0 !important; }
/* PSR icon color inline override (theme.yml puso #0b69f6 hardcoded) */
[style*="#0b69f6"] { color: #c4b5a0 !important; fill: #c4b5a0 !important; }

a.ch-card__size { text-decoration: none; }
.ch-card__size:hover {
  background: var(--chetto-color-brand, #c4b5a0);
  color: #fff;
}
.ch-card__size.is-active {
  background: var(--chetto-color-ink, #2d2d2d);
  color: #fff;
  border-color: var(--chetto-color-ink, #2d2d2d);
}
/* Talla SIN STOCK: tachado rojo, no clickable */
.ch-card__size.ch-card__size--out,
.ch-card__size--out {
  text-decoration: line-through;
  color: #c2362e;
  border-color: #e9c0bd;
  background: transparent;
  cursor: not-allowed;
  pointer-events: none;
}
.ch-card__size.ch-card__size--out:hover,
.ch-card__size--out:hover {
  background: transparent;
  color: #c2362e;
}

/* Vencer reglas Hummingbird que pueden romper la card */
.product-miniature.ch-card {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}
.product-miniature.ch-card .product-thumbnail,
.product-miniature.ch-card .product-title,
.product-miniature.ch-card .product-price-and-shipping,
.product-miniature.ch-card .product-flags,
.product-miniature.ch-card .product-availability,
.product-miniature.ch-card .highlighted-informations,
.product-miniature.ch-card .quick-view {
  display: none !important;
}

/* ===========================================================
   LEGAL PAGES (aviso-legal / privacidad / cookies / condiciones)
   Replica del componente Next.js LegalPage.tsx.
   =========================================================== */
.chetto-legal { background: #fff; }
.chetto-legal__container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
@media (min-width: 768px) { .chetto-legal__container { padding: 0 77px; } }

.chetto-legal__hero {
  background: linear-gradient(to bottom, #f7f6f4, #eae7e1);
  padding: 48px 0;
}
.chetto-legal__back {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 16px; font-weight: 500; color: var(--ch-ink, #2d2d2d);
  text-decoration: none;
  transition: color .2s ease;
}
.chetto-legal__back:hover { color: #a89584; text-decoration: none; }
.chetto-legal__back svg { width: 20px; height: 20px; }

.chetto-legal__pill {
  margin: 32px 0 0;
  font-size: 14px; font-weight: 500;
  text-transform: uppercase; letter-spacing: 0.1996px;
  color: #c4b5a0;
}
.chetto-legal__title {
  margin: 8px 0 0;
  font-size: 36px; font-weight: 500; line-height: 1.15; letter-spacing: 0.3516px;
  color: var(--ch-ink, #2d2d2d);
}
@media (min-width: 768px) { .chetto-legal__title { font-size: 48px; } }
.chetto-legal__subtitle {
  margin: 24px 0 0;
  max-width: 720px;
  font-size: 18px; line-height: 1.55;
  color: rgba(45, 45, 45, .7);
}
.chetto-legal__updated {
  margin: 16px 0 0;
  font-size: 13px;
  color: rgba(45, 45, 45, .5);
}

.chetto-legal__body { padding: 64px 0; }
.chetto-legal__layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
}
@media (min-width: 1024px) {
  .chetto-legal__layout { grid-template-columns: 260px 1fr; }
  .chetto-legal__toc { position: sticky; top: 96px; align-self: start; }
}

.chetto-legal__toc-label {
  margin: 0;
  font-size: 14px; font-weight: 500;
  text-transform: uppercase; letter-spacing: 0.1996px;
  color: rgba(45, 45, 45, .7);
}
.chetto-legal__toc-list {
  list-style: none;
  margin: 16px 0 0; padding: 0;
  display: flex; flex-direction: column; gap: 8px;
  font-size: 14px; line-height: 1.4;
}
.chetto-legal__toc-link {
  color: rgba(45, 45, 45, .7);
  text-decoration: none;
}
.chetto-legal__toc-link:hover { color: var(--ch-ink, #2d2d2d); text-decoration: underline; }

.chetto-legal__article {
  display: flex; flex-direction: column; gap: 48px;
  min-width: 0;
}
.chetto-legal__section { scroll-margin-top: 112px; }
.chetto-legal__section-title {
  margin: 0;
  font-size: 22px; font-weight: 500; line-height: 1.3;
  letter-spacing: -0.0195em;
  color: var(--ch-ink, #2d2d2d);
}
@media (min-width: 768px) { .chetto-legal__section-title { font-size: 24px; } }

.chetto-legal__section-body {
  margin-top: 16px;
  font-size: 16px; line-height: 1.75;
  color: rgba(45, 45, 45, .8);
}
.chetto-legal__section-body p { margin: 16px 0 0; }
.chetto-legal__section-body p:first-child { margin-top: 0; }
.chetto-legal__section-body ul,
.chetto-legal__section-body ol { margin: 16px 0 0; padding-left: 20px; }
.chetto-legal__section-body ul { list-style: disc; }
.chetto-legal__section-body ol { list-style: decimal; }
.chetto-legal__section-body li { margin-top: 8px; }
.chetto-legal__section-body strong { color: var(--ch-ink, #2d2d2d); }
.chetto-legal__section-body a { color: #c4b5a0; text-decoration: none; }
.chetto-legal__section-body a:hover { text-decoration: underline; }

/* ============================================================================
   Anti-overflow horizontal global (cinturón de seguridad)
   `overflow-x: clip` recorta cualquier desborde sin crear scroll lateral y
   sin romper `position: sticky` (a diferencia de `overflow-x: hidden`).
   Aplicado a html para máxima cobertura en TODAS las pages.
   ============================================================================ */
html, body {
  overflow-x: clip;
  max-width: 100%;
}

/* Cart drawer: contenerlo aunque su panel use translateX(100%) fuera del flow.
   El padre fixed inset:0 ya está bien, pero forzamos overflow:hidden por si
   algún parent intermedio tiene overflow:visible. */
.chetto-cart-drawer { overflow: hidden; }

/* Reassurance / blockreassurance en mobile: si el JS del carrusel aún no ha
   inicializado, las cards mantienen min-width:200px y desbordan. Forzamos
   wrap correcto en mobile para que nunca empuje el viewport.            */
@media (max-width: 767.98px) {
  .blockreassurance--product { flex-wrap: wrap; }
  .blockreassurance--product .reassurance {
    flex: 1 1 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .blockreassurance--product .blockreassurance__track {
    max-width: 100%;
    box-sizing: border-box;
  }
}

/* ============================================================================
   Top-menu (ps_mainmenu) · capitalización Title + subrayado en hover
   - Punto 1: respetar capitalización del label (no MAYÚSCULAS forzadas)
   - Punto 3: bottom-border beige #C4B5A0 SOLO al hacer hover
   ============================================================================ */
.ps-mainmenu__tree-link,
.menu__link,
.chetto-header__nav-link,
.ps-mainmenu .menu-item {
  text-transform: none !important;
}

/* Subrayado SOLO en hover · border-bottom beige #C4B5A0 directo
   Aplica al menú real (.chetto-header__nav-link) Y al fallback ps-mainmenu. */
.chetto-header__nav-link,
.chetto-header__nav-link:link,
.chetto-header__nav-link:visited,
.ps-mainmenu__tree-link,
.ps-mainmenu__tree-link:link,
.ps-mainmenu__tree-link:visited {
  border-bottom: 2px solid transparent !important;
  transition: border-bottom-color .18s ease, color .15s ease !important;
  text-decoration: none !important;
  padding-bottom: 4px;
}
.chetto-header__nav-link:hover,
.chetto-header__nav-link:focus-visible,
.chetto-header__nav-item:hover .chetto-header__nav-link,
.ps-mainmenu__tree-link:hover,
.ps-mainmenu__tree-link:focus-visible,
.ps-mainmenu__tree-item:hover .ps-mainmenu__tree-link {
  border-bottom-color: #C4B5A0 !important;
  color: var(--chetto-color-ink, #2d2d2d) !important;
}