/* =========================================================
   Grace Baby Store · Carrito, compra, pedido, panel y políticas
   Usa los mismos colores y tipografías de estilos.css
   ========================================================= */

body.sin-scroll { overflow: hidden; }

/* ---------- Página de producto ---------- */
.ficha { padding: 28px 0 80px; }
.ficha__migas a { text-decoration: none; }
.ficha__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 48px; align-items: start; margin-top: 12px; }
.ficha__grid[hidden] { display: none; }
.ficha__foto { position: relative; aspect-ratio: 4 / 5; border-radius: 6px; overflow: hidden; background: var(--beige-claro); }
.ficha__foto img, .ficha__foto .foto-pendiente { width: 100%; height: 100%; object-fit: cover; }
.ficha__foto .foto-pendiente svg { width: 56px; height: 56px; }
.ficha__info { position: sticky; top: 96px; }
.ficha__ref { font-size: 12.5px; color: var(--tinta-suave); letter-spacing: .04em; text-transform: uppercase; }
.ficha__ref span { margin: 0 4px; opacity: .5; }
.ficha__nombre { font-family: var(--f-texto); font-weight: 500; font-size: clamp(22px, 2.4vw, 30px); line-height: 1.25; margin: 8px 0 12px; }
.ficha__precio { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.ficha__precio-actual { font-size: 28px; font-weight: 700; color: var(--tinta); }
.ficha__precio-actual--oferta { color: var(--vino); }
.ficha__precio s { color: var(--tinta-suave); font-size: 18px; }
.sello-dto--en-linea { position: static; }
.ficha__tallas-cabeza { display: flex; justify-content: space-between; align-items: center; margin: 26px 0 10px; font-size: 15px; font-weight: 500; }
.ficha__guia { display: inline-flex; align-items: center; gap: 6px; background: none; border: 0; padding: 0; font: 500 13px/1 var(--f-texto); color: var(--tinta); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.ficha__guia svg { width: 20px; height: 20px; }
.ficha__tallas { display: grid; grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); gap: 8px; }
.ficha__talla {
  min-height: 46px;
  background: #fff;
  border: 1px solid var(--linea);
  border-radius: 6px;
  font: 500 14px/1 var(--f-texto);
  color: var(--tinta);
  cursor: pointer;
  transition: border-color .15s, background-color .15s;
}
.ficha__talla:hover:not(:disabled) { border-color: var(--tinta); }
.ficha__talla[aria-checked="true"] { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.ficha__talla:disabled { color: #bdb0a8; text-decoration: line-through; cursor: not-allowed; background: #faf7f3; }
.ficha__aviso { min-height: 22px; margin: 10px 0 6px; font-size: 14px; color: var(--tinta-suave); }
.ficha__aviso--urgente { color: var(--vino); font-weight: 600; }
.ficha__agregar { min-height: 54px; border-radius: 999px; font-size: 14px; }
.ficha__agregar:disabled { opacity: .5; cursor: not-allowed; }
/* Pedir un video real de la prenda por WhatsApp */
.ficha__video-boton {
  position: absolute; right: 14px; bottom: 14px; z-index: 2; display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 16px 9px 10px; border-radius: 999px; background: rgba(255, 255, 255, .92); color: var(--vino);
  font: 600 12.5px/1 var(--f-texto); letter-spacing: .04em; text-decoration: none; box-shadow: 0 6px 18px rgba(42, 23, 21, .16);
  transition: transform .2s, background .2s;
}
.ficha__video-boton:hover { transform: translateY(-2px); background: #fff; }
.ficha__video-boton svg { width: 24px; height: 24px; color: var(--vino); }
.ficha__video { display: flex; gap: 12px; align-items: center; margin-top: 14px; padding: 12px 14px; border: 1px solid var(--linea); border-radius: 10px; background: #fff; color: var(--tinta-suave); font-size: 13px; line-height: 1.5; text-decoration: none; transition: border-color .2s; }
.ficha__video:hover { border-color: var(--vino); }
.ficha__video strong { color: var(--tinta); }
.ficha__video-icono { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 52% 48% 55% 45% / 48% 56% 44% 52%; background: var(--beige-claro); }
.ficha__video-icono svg { width: 24px; height: 24px; color: var(--vino); }
.ficha__miniaturas { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.ficha__mini { width: 72px; aspect-ratio: 4 / 5; padding: 0; border: 2px solid transparent; border-radius: 6px; overflow: hidden; background: var(--beige-claro); cursor: pointer; }
.ficha__mini img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ficha__mini[aria-pressed="true"] { border-color: var(--vino); }
.ficha__mini--video { position: relative; }
.ficha__mini--video img { filter: brightness(.75); }
.ficha__mini--video svg { position: absolute; inset: 0; margin: auto; width: 28px; height: 28px; color: var(--vino); }
.ficha__video-reproductor { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #000; z-index: 1; }
.ficha__foto--video .ficha__video-boton { display: none; }
button.ficha__video-boton { border: 0; cursor: pointer; }
.ficha__descripcion { font-size: 15px; line-height: 1.65; color: var(--tinta); margin-bottom: 10px; }
.ficha__consulta { display: block; text-align: center; margin-top: 12px; font-size: 14px; color: var(--vino); font-weight: 600; text-underline-offset: 3px; }
.ficha__beneficios { list-style: none; padding: 16px 18px; margin: 22px 0; background: var(--beige-claro); border-radius: 6px; display: flex; flex-direction: column; gap: 8px; font-size: 13.5px; }
.ficha__beneficios li { display: flex; gap: 10px; align-items: flex-start; }
.ficha__acordeon details { border-top: 1px solid var(--linea); }
.ficha__acordeon details:last-child { border-bottom: 1px solid var(--linea); }
.ficha__acordeon summary {
  list-style: none;
  display: flex;
  justify-content: space-between;
  padding: 18px 0;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  cursor: pointer;
}
.ficha__acordeon summary::-webkit-details-marker { display: none; }
.ficha__acordeon summary::after { content: '+'; font-size: 18px; font-weight: 400; line-height: 1; }
.ficha__acordeon details[open] summary::after { content: '−'; }
.ficha__acordeon details > div { padding: 0 0 18px; font-size: 14.5px; line-height: 1.6; }
.ficha__acordeon ul { padding-left: 18px; margin: 8px 0; }
.ficha__no { text-align: center; padding: 64px 0; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.ficha__no[hidden] { display: none; }
.ficha__relacionados { margin-top: 72px; }
.ficha__relacionados[hidden] { display: none; }
.ficha__relacionados h2 { font-family: var(--f-titulo); font-size: clamp(26px, 3vw, 34px); margin-bottom: 24px; }
.tarjeta__nombre a { color: inherit; text-decoration: none; }

/* Barra fija de compra en celular */
.barra-compra { display: none; }
@media (max-width: 860px) {
  .ficha__grid { grid-template-columns: 1fr; gap: 24px; }
  .ficha__info { position: static; }
  .barra-compra:not([hidden]) {
    display: flex;
    flex-direction: column;
    gap: 10px;
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 40;
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
    background: #fff;
    box-shadow: 0 -8px 24px -12px rgba(42, 23, 21, .35);
  }
  .barra-compra__info { display: flex; flex-direction: column; }
  .barra-compra__nombre { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .barra-compra__precio { font-weight: 700; color: var(--vino); }
  .barra-compra__acciones { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .barra-compra select { font: 500 14px var(--f-texto); padding: 0 10px; min-height: 46px; border: 1px solid var(--linea); border-radius: 6px; background: #f6f1ea; }
  .barra-compra .btn { min-height: 46px; padding: 0 10px; font-size: 12px; border-radius: 6px; }
  body:has(.barra-compra:not([hidden])) .wa-flotante { bottom: 150px; }
}

/* Ventana de guía de tallas */
.modal { position: fixed; inset: 0; z-index: 70; display: grid; place-items: center; padding: 16px; }
.modal[hidden] { display: none; }
.modal__fondo { position: absolute; inset: 0; background: rgba(42, 23, 21, .5); }
.modal__caja { position: relative; width: min(560px, 100%); max-height: calc(100vh - 32px); overflow: auto; background: var(--papel); border-radius: 10px; padding: 22px 22px 26px; }
.modal__cabeza { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.modal__cabeza h2 { font-family: var(--f-titulo); font-size: 26px; }
.modal__tabla { margin-top: 14px; overflow-x: auto; }
.modal__tabla table { width: 100%; border-collapse: collapse; font-size: 14px; }
.modal__tabla th { text-align: left; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--tinta-suave); padding: 8px 10px; border-bottom: 2px solid var(--vino); }
.modal__tabla td { padding: 9px 10px; border-bottom: 1px solid var(--linea); white-space: nowrap; }
.modal__tabla td:first-child { font-weight: 700; color: var(--vino); }

/* Guía de tallas: pestañas, ilustración con medidas y tabla */
.modal__caja.guia { width: min(900px, 100%); padding: 26px 30px 28px; }
.guia__cabeza { display: flex; justify-content: space-between; align-items: flex-start; }
.guia__guion { font-family: var(--f-guion); font-size: 30px; color: var(--vino-claro); line-height: 1; }
.guia__cabeza h2 { font-family: var(--f-titulo); font-weight: 500; font-size: 30px; line-height: 1.1; }
.guia__pestanas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; padding: 4px; margin: 18px 0 22px; background: var(--beige-claro); border-radius: 999px; max-width: 360px; }
.guia__pestana { border: 0; background: none; padding: 10px 14px; border-radius: 999px; font: 600 13px/1 var(--f-texto); letter-spacing: .06em; text-transform: uppercase; color: var(--tinta-suave); cursor: pointer; transition: background .2s, color .2s; }
.guia__pestana[aria-selected="true"] { background: var(--vino); color: #fff; box-shadow: 0 4px 12px rgba(150, 1, 8, .25); }
.guia__panel { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 32px; align-items: start; }
.guia__panel[hidden] { display: none; }
.guia__figura { margin: 0 auto; max-width: 230px; }
.guia__figura svg { width: 100%; height: auto; display: block; }
.guia__gota { fill: var(--beige-claro); }
.guia__silueta { fill: #D9C3A5; }
.guia__bascula { fill: none; stroke: var(--tinta-suave); stroke-width: 1.4; opacity: .55; }
.guia__guia-linea { stroke: var(--vino-claro); stroke-width: 1; stroke-dasharray: 3 4; fill: none; opacity: .7; }
.guia__medida { stroke: var(--vino); stroke-width: 1.6; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.guia__marca circle { fill: var(--vino); }
.guia__marca text { fill: #fff; font: 700 11px var(--f-texto); text-anchor: middle; }
.guia__pasos { list-style: none; padding: 0; margin: 18px 0 0; display: flex; flex-direction: column; gap: 12px; }
.guia__pasos li { display: grid; grid-template-columns: 24px 1fr; gap: 12px; font-size: 13.5px; line-height: 1.5; color: var(--tinta-suave); }
.guia__pasos span { width: 24px; height: 24px; border-radius: 50%; background: var(--vino); color: #fff; display: grid; place-items: center; font-size: 11px; font-weight: 700; }
.guia__pasos strong { display: block; color: var(--tinta); font-size: 14px; }
.guia__tabla-caja { border-radius: 10px; overflow: hidden; border: 1px solid var(--linea); background: #fff; }
.guia__tabla { width: 100%; border-collapse: collapse; font-size: 13.5px; text-align: center; }
.guia__tabla th { background: var(--vino); color: #fff; font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; padding: 11px 8px; }
.guia__tabla td { padding: 9px 8px; border-top: 1px solid var(--beige-claro); white-space: nowrap; }
.guia__tabla tbody tr:nth-child(even) { background: #FCF8F3; }
.guia__tabla tbody tr { transition: background .15s; }
.guia__tabla tbody tr:hover { background: var(--rubor); }
.guia__tabla td:first-child { font-weight: 700; color: var(--vino); }
.guia__leyenda { padding: 10px 12px; font-size: 12px; color: var(--tinta-suave); text-align: center; background: var(--beige-claro); }
.guia__leyenda b { color: var(--vino); }
.guia__consejo { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; margin-top: 24px; padding: 16px 18px; border-radius: 10px; background: var(--beige-claro); font-size: 13.5px; line-height: 1.5; }
.guia__destello { width: 26px; height: 26px; fill: var(--vino); }
.guia__consejo .btn { white-space: nowrap; }
@media (max-width: 720px) {
  .modal__caja.guia { padding: 20px 16px 22px; }
  .guia__pestanas { max-width: none; }
  .guia__panel { grid-template-columns: 1fr; gap: 20px; }
  .guia__medir { display: grid; grid-template-columns: 120px 1fr; gap: 14px; align-items: center; }
  .guia__pasos { margin: 0; }
  .guia__tabla-caja { overflow-x: auto; }
  .guia__tabla { font-size: 12.5px; }
  .guia__tabla th { font-size: 10px; letter-spacing: .06em; padding: 10px 4px; }
  .guia__tabla td { padding: 8px 4px; white-space: normal; }
  .guia__consejo { grid-template-columns: auto 1fr; }
  .guia__consejo .btn { grid-column: 1 / -1; justify-self: stretch; text-align: center; }
}

/* ---------- Pie: suscripción, medios de pago y redes ---------- */
.pie__suscripcion {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 24px 40px;
  align-items: center;
  padding-top: 32px;
  padding-bottom: 32px;
  border-top: 1px solid rgba(255,255,255,.2);
}
.pie__suscripcion h3 { font-family: var(--f-titulo); font-size: 24px; font-weight: 500; margin-bottom: 6px; }
.pie__suscripcion p { opacity: .85; font-size: 14px; }
.suscripcion__fila { display: flex; gap: 8px; }
.suscripcion__fila input[type="email"] { flex: 1; min-width: 0; padding: 0 16px; min-height: 48px; border: 0; border-radius: 999px; font: 400 15px var(--f-texto); }
.suscripcion__fila .btn { border-radius: 999px; }
.suscripcion__acepto { display: flex; gap: 8px; align-items: flex-start; font-size: 12.5px; margin-top: 10px; opacity: .9; }
.suscripcion__acepto input { margin-top: 2px; accent-color: #fff; }
.suscripcion__acepto a { color: #fff; }
.suscripcion__estado { min-height: 18px; font-size: 13px; margin-top: 6px; font-weight: 600; }
.suscripcion__estado--ok { color: #ffe9a8; }
.pie__pagos { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; padding-top: 18px; padding-bottom: 18px; border-top: 1px solid rgba(255,255,255,.2); }
.pie__medios { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pie__medios-titulo { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; opacity: .75; margin-right: 6px; }
.medio {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 34px;
  background: #fff;
  color: var(--tinta);
  font-size: 12px;
  font-weight: 700;
  padding: 0 10px;
  border-radius: 6px;
}
.medio svg { height: 22px; width: auto; display: block; }
.medio--visa svg { height: 18px; }
.medio--texto svg { height: 20px; }
.pie__redes { display: flex; gap: 10px; flex-wrap: wrap; }
.red {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px 8px 8px;
  border-radius: 999px;
  background: #fff;
  color: var(--tinta);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: transform .15s;
}
.red:hover { transform: translateY(-2px); }
.red svg { width: 22px; height: 22px; padding: 7px; box-sizing: content-box; border-radius: 50%; color: #fff; }
.red--ig svg { background: linear-gradient(45deg, #f9a825, #e1306c 45%, #833ab4); }
.red--wa svg { background: #25D366; }

/* Íconos de redes en la cabecera */
.cabecera__red {
  flex: none;
  display: grid;
  place-items: center;
  width: 40px; height: 40px;
  border-radius: 50%;
  color: #fff;
  transition: transform .15s;
}
.cabecera__red:hover { transform: scale(1.08); }
.cabecera__red svg { width: 20px; height: 20px; }
.cabecera__red--ig { background: linear-gradient(45deg, #f9a825, #e1306c 45%, #833ab4); }
.cabecera__red--wa { background: #25D366; margin-left: -18px; }
.admin__suscriptores-cabeza { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
@media (max-width: 860px) {
  .pie__suscripcion { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .suscripcion__fila { flex-direction: column; }
  .suscripcion__fila .btn { width: 100%; }
}
.contenedor--angosto { max-width: 820px; }
.nota-suave { color: var(--tinta-suave); font-size: 14px; }

/* ---------- Botón del carrito en la cabecera ---------- */
.cabecera__carrito {
  position: relative;
  flex: none;
  display: grid;
  place-items: center;
  width: 42px; height: 42px;
  color: var(--tinta);
  border-radius: 50%;
  transition: background-color .2s;
}
.cabecera__carrito:hover { background: var(--beige-claro); }
.cabecera__carrito svg { width: 24px; height: 24px; }
.cabecera__contador {
  position: absolute;
  top: 2px; right: 0;
  min-width: 18px; height: 18px;
  padding: 0 5px;
  display: grid;
  place-items: center;
  background: var(--vino);
  color: #fff;
  font-size: 10.5px;
  font-weight: 700;
  border-radius: 999px;
}
.cabecera__contador[hidden] { display: none; }

/* ---------- Tallas: agregar al carrito ---------- */
.tallas__titulo {
  grid-column: 1 / -1;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--tinta-suave);
  text-align: center;
  margin-bottom: 2px;
}
.talla:disabled { color: #b9aaa2; text-decoration: line-through; cursor: not-allowed; }
.talla:disabled:hover { border-color: transparent; }
.talla--agregada { background: var(--vino) !important; color: #fff !important; }
.sello-agotado {
  position: absolute;
  left: 12px; bottom: 12px;
  background: var(--tinta);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 6px 12px;
  border-radius: 999px;
}
.tarjeta--agotada .tarjeta__media { opacity: .55; }
.tarjeta--agotada .tallas, .tarjeta--agotada .sello-oferta { display: none; }

/* ---------- Aviso flotante ---------- */
.aviso {
  position: fixed;
  left: 50%; bottom: 24px;
  z-index: 60;
  transform: translate(-50%, 20px);
  max-width: calc(100% - 32px);
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--tinta);
  color: #fff;
  font-size: 14px;
  padding: 12px 16px;
  border-radius: 6px;
  box-shadow: 0 12px 30px -10px rgba(0,0,0,.4);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s, transform .25s;
}
.aviso--visible { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
.aviso--error { background: var(--vino); }
.aviso__accion {
  flex: none;
  background: #fff;
  color: var(--vino);
  border: 0;
  border-radius: 999px;
  padding: 6px 12px;
  font: 600 12px/1 var(--f-texto);
  cursor: pointer;
}

/* ---------- Panel lateral del carrito ---------- */
.carrito { position: fixed; inset: 0; z-index: 50; }
.carrito[hidden] { display: none; }
.carrito__fondo { position: absolute; inset: 0; background: rgba(42, 23, 21, .45); }
.carrito__panel {
  position: absolute;
  top: 0; right: 0; bottom: 0;
  width: min(420px, 100%);
  display: flex;
  flex-direction: column;
  background: var(--papel);
  box-shadow: -10px 0 40px -20px rgba(0,0,0,.4);
  animation: entrar .25s ease;
}
@keyframes entrar { from { transform: translateX(30px); opacity: 0; } }
.carrito__cabeza {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 20px;
  border-bottom: 1px solid var(--linea);
}
.carrito__cabeza h2 { font-family: var(--f-titulo); font-size: 24px; }
.carrito__cerrar { background: none; border: 0; font-size: 30px; line-height: 1; cursor: pointer; color: var(--tinta); padding: 4px 8px; }
.carrito__cuerpo { flex: 1; overflow-y: auto; padding: 8px 20px; }
.carrito__pie { padding: 16px 20px 20px; border-top: 1px solid var(--linea); background: #fff; }
.carrito__vacio { text-align: center; padding: 48px 0; display: flex; flex-direction: column; align-items: center; gap: 16px; color: var(--tinta-suave); }
.carrito__sin-foto { display: grid; place-items: center; width: 100%; height: 100%; color: var(--vino); background: var(--beige-claro); }

.linea { display: grid; grid-template-columns: 72px 1fr; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--linea); }
.linea__foto { width: 72px; height: 90px; border-radius: 4px; overflow: hidden; background: var(--beige-claro); }
.linea__foto img { width: 100%; height: 100%; object-fit: cover; }
.linea__nombre { font-size: 14px; line-height: 1.35; }
.linea__detalle { font-size: 12px; color: var(--tinta-suave); margin-top: 2px; }
.linea__fila { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; }
.linea__precio { font-weight: 600; font-size: 15px; }
.linea__quitar { background: none; border: 0; padding: 0; margin-top: 8px; font: 500 12px/1 var(--f-texto); color: var(--tinta-suave); text-decoration: underline; cursor: pointer; }

.cantidad { display: inline-flex; align-items: center; border: 1px solid var(--linea); border-radius: 999px; background: #fff; }
.cantidad button { width: 32px; height: 32px; background: none; border: 0; font-size: 16px; cursor: pointer; color: var(--tinta); }
.cantidad button:disabled { color: #ccc; cursor: not-allowed; }
.cantidad span { min-width: 22px; text-align: center; font-size: 14px; font-weight: 600; }

.totales p { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; padding: 4px 0; }
.totales__nota { color: var(--tinta-suave); font-size: 12.5px !important; display: block !important; }
.totales__dto span:last-child { color: var(--vino); font-weight: 600; }
.totales__total { font-size: 17px !important; font-weight: 700; border-top: 1px solid var(--linea); margin-top: 8px; padding-top: 12px !important; }
.carrito__pie .btn { margin-top: 12px; }

/* ---------- Página de compra ---------- */
.compra { padding: 40px 0 88px; }
.compra .antetitulo a { text-decoration: none; }
.compra__titulo { font-family: var(--f-titulo); font-size: clamp(32px, 4vw, 48px); line-height: 1.1; margin-bottom: 28px; }
.compra__vacio { text-align: center; padding: 48px 0; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.compra__vacio[hidden], .compra__grid[hidden] { display: none; }
.compra__grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 40px; align-items: start; }

.formulario fieldset { border: 0; padding: 0; margin: 0 0 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.formulario legend { grid-column: 1 / -1; font-family: var(--f-titulo); font-size: 21px; margin-bottom: 12px; padding: 0; }
.campo { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600; color: var(--tinta); }
.campo--doble { grid-column: 1 / -1; }
.campo input, .campo select, .campo textarea {
  font: 400 15px/1.3 var(--f-texto);
  color: var(--tinta);
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--linea);
  border-radius: 4px;
  width: 100%;
}
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: 2px solid var(--vino); outline-offset: 0; border-color: var(--vino); }
/* Forma de entrega */
.entrega { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.entrega__opcion {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 14px;
  background: #fff;
  border: 1.5px solid var(--linea);
  border-radius: 6px;
  cursor: pointer;
  transition: border-color .2s, background-color .2s;
}
.entrega__opcion:has(input:checked) { border-color: var(--vino); background: #fdf7f6; }
.entrega__opcion input { margin-top: 3px; accent-color: var(--vino); width: 18px; height: 18px; flex: none; }
.entrega__opcion span { display: flex; flex-direction: column; gap: 2px; font-size: 14px; }
.entrega__opcion small { color: var(--tinta-suave); font-size: 12px; line-height: 1.4; }
.campos-domicilio, .campos-recogida { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.campos-domicilio[hidden], .campos-recogida[hidden] { display: none; }
.nota-recogida { grid-column: 1 / -1; background: var(--beige-claro); border-left: 4px solid var(--vino); padding: 12px 14px; font-size: 14px; border-radius: 2px; }
.recogida-mapa { display: block; width: 100%; height: 240px; border: 0; border-radius: 6px; margin-top: 12px; background: var(--beige-claro); }
.recogida-botones { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.recogida-info { display: block; background: #fff; border: 1px solid var(--linea); border-radius: 6px; padding: 12px 16px; margin: 12px auto; max-width: 420px; color: var(--tinta); text-align: left; }
@media (max-width: 560px) {
  .entrega, .campos-domicilio, .campos-recogida { grid-template-columns: 1fr; }
}

.aceptar { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; margin: 4px 0 16px; }
.aceptar input { margin-top: 3px; width: 18px; height: 18px; accent-color: var(--vino); flex: none; }
.formulario__error { background: #fbe9e9; color: var(--vino); border-left: 4px solid var(--vino); padding: 12px 14px; font-size: 14px; border-radius: 2px; margin-bottom: 16px; }
.formulario__error[hidden] { display: none; }
.formulario__error a { font-weight: 700; }
.btn--pagar { min-height: 56px; font-size: 14px; }
.formulario__seguro { font-size: 12.5px; color: var(--tinta-suave); text-align: center; margin-top: 10px; }

.resumen { position: sticky; top: 96px; background: #fff; border: 1px solid var(--linea); border-radius: 6px; padding: 24px; }
.resumen h2 { font-family: var(--f-titulo); font-size: 22px; margin-bottom: 12px; }
.resumen__linea { display: grid; grid-template-columns: 56px 1fr auto; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--linea); font-size: 13.5px; }
.resumen__foto { position: relative; width: 56px; height: 68px; border-radius: 4px; overflow: hidden; background: var(--beige-claro); }
.resumen__foto img, .resumen__foto .foto-pendiente { width: 100%; height: 100%; object-fit: cover; font-size: 0; padding: 0; }
.resumen__foto .foto-pendiente svg { width: 16px; height: 16px; }
.resumen__foto b { position: absolute; top: 3px; right: 3px; background: var(--tinta); color: #fff; font-size: 10px; min-width: 18px; height: 18px; border-radius: 999px; display: grid; place-items: center; }
.resumen__info { display: flex; flex-direction: column; min-width: 0; }
.resumen__info small { color: var(--tinta-suave); font-size: 11.5px; }
.resumen__precio { font-weight: 600; }
.codigo { padding: 16px 0 8px; }
.codigo label { font-size: 13px; font-weight: 600; }
.codigo__fila { display: flex; gap: 8px; margin-top: 6px; }
.codigo__fila input { flex: 1; min-width: 0; font: 500 14px/1 var(--f-texto); padding: 10px 12px; border: 1px solid var(--linea); border-radius: 4px; text-transform: uppercase; }
.codigo__nota { font-size: 12.5px; margin-top: 6px; }
.codigo__nota--ok { color: #2f7a3c; }
.codigo__nota--error { color: var(--vino); }

/* ---------- Página de pedido ---------- */
.estado-pedido { text-align: center; padding: 32px 0; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.estado-pedido__icono { width: 72px; height: 72px; display: grid; place-items: center; border-radius: 50%; background: var(--vino); color: #fff; font-size: 30px; }
.estado-pedido h1 { font-family: var(--f-titulo); font-size: clamp(28px, 4vw, 40px); line-height: 1.15; }
.estado-pedido > p { color: var(--tinta-suave); max-width: 52ch; }
.estado-pedido__detalle { width: 100%; max-width: 480px; text-align: left; background: #fff; border: 1px solid var(--linea); border-radius: 6px; padding: 18px 20px; margin-top: 12px; }
.estado-pedido__detalle[hidden] { display: none; }
.estado-pedido__detalle p { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; padding: 4px 0; }
.estado-pedido__ref { justify-content: center !important; color: var(--tinta-suave); border-bottom: 1px solid var(--linea); padding-bottom: 10px !important; margin-bottom: 6px; }
.estado-pedido__acciones { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 12px; }

.estado-pedido__guardar { flex-basis: 100%; margin-top: 8px; }

/* ---------- Quiénes somos (resumen en el inicio) ---------- */
.somos { padding: 72px 0 24px; }
.somos__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 64px; align-items: center; max-width: 1040px; }
.somos__foto { position: relative; margin: 0; justify-self: center; width: 100%; max-width: 340px; }
.somos__foto::before { content: ''; position: absolute; inset: 7% -8% -6% 9%; background: var(--beige); border-radius: 58% 42% 55% 45% / 48% 56% 44% 52%; }
.somos__foto img { position: relative; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 30%; border-radius: 170px 170px 14px 14px; border: 6px solid #fff; box-shadow: 0 18px 40px rgba(42, 23, 21, .14); }
.somos__destello { position: absolute; top: 6%; right: -6%; width: 40px; height: 40px; fill: var(--vino); }
.somos .somos__guion { display: block; font-family: var(--f-guion); font-size: 44px; text-transform: none; letter-spacing: 0; color: var(--vino); line-height: 1; margin-bottom: 6px; }
.somos__texto h2 { font-family: var(--f-titulo); font-size: clamp(28px, 3.2vw, 40px); line-height: 1.15; margin-bottom: 14px; }
.somos__texto > p { font-size: 16px; line-height: 1.7; color: var(--tinta-suave); margin-bottom: 18px; max-width: 54ch; }
.somos__datos { list-style: none; padding: 0; margin: 0 0 24px; display: flex; flex-wrap: wrap; gap: 10px; }
.somos__datos li { padding: 8px 14px; border: 1px solid var(--linea); border-radius: 999px; background: #fff; font-size: 13px; color: var(--tinta-suave); }
.somos__datos strong { color: var(--vino); }
@media (max-width: 860px) {
  .somos { padding: 48px 0 8px; }
  .somos__grid { grid-template-columns: 1fr; gap: 32px; text-align: center; }
  .somos__foto { max-width: 240px; }
  .somos__texto > p { margin-left: auto; margin-right: auto; }
  .somos__datos { justify-content: center; }
}

/* ---------- Quiénes somos ---------- */
.nosotros-portada { padding: 72px 0; }
.nosotros-portada__grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 48px; align-items: center; }
.nosotros-portada__guion { font-size: clamp(56px, 7vw, 88px); line-height: .9; margin-bottom: 8px; }
.nosotros-portada h1 { font-family: var(--f-titulo); font-size: clamp(30px, 3.6vw, 46px); line-height: 1.1; margin-bottom: 16px; }
.nosotros-portada p { opacity: .92; max-width: 52ch; }
.nosotros-portada__foto { margin: 0; }
.nosotros-portada__foto img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; object-position: 50% 35%; border-radius: 28px; border: 6px solid rgba(255, 255, 255, .9); box-shadow: 0 20px 44px rgba(0, 0, 0, .25); transform: rotate(1.5deg); }
.nosotros-texto h2 { font-family: var(--f-titulo); font-size: clamp(28px, 3vw, 38px); margin-bottom: 16px; }
.nosotros-texto p { font-size: 16.5px; line-height: 1.75; margin-bottom: 14px; }
/* Historia en filas alternadas: texto y foto con marco redondeado */
.historia { padding: 72px 0 24px; overflow: hidden; }
.historia__fila { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 64px; align-items: center; margin-bottom: 88px; }
.historia__fila--invertida .historia__foto { order: -1; }
.historia__texto { max-width: 520px; justify-self: center; }
.historia__texto h2, .recorrido__titulo { font-family: var(--f-titulo); font-weight: 300; font-size: clamp(30px, 3.4vw, 44px); line-height: 1.15; color: var(--tinta-suave); margin-bottom: 20px; }
.historia__texto h2 strong, .recorrido__titulo strong { font-weight: 600; color: var(--vino); }
.historia__texto p { font-size: 16.5px; line-height: 1.75; margin-bottom: 14px; }
.historia__texto .btn { margin-top: 10px; }
.historia__foto { position: relative; margin: 0; justify-self: center; width: 100%; max-width: 440px; }
.historia__foto::before {
  content: ''; position: absolute; inset: 8% -7% -6% 10%; z-index: 0;
  background: var(--beige); border-radius: 58% 42% 55% 45% / 48% 56% 44% 52%;
}
.historia__fila--invertida .historia__foto::before { inset: -6% 10% 8% -7%; background: var(--rubor); }
.historia__foto img { position: relative; z-index: 1; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 28px; border: 6px solid #fff; box-shadow: 0 18px 40px rgba(42, 23, 21, .12); }

/* Recorrido de la prenda, como una línea de tiempo */
.recorrido-seccion { background: #fff; }
.recorrido__titulo { text-align: center; margin-bottom: 40px; }
.recorrido { list-style: none; padding: 0; margin: 0 auto; max-width: 640px; position: relative; }
.recorrido::before { content: ''; position: absolute; left: 127px; top: 18px; bottom: 18px; width: 2px; background: var(--linea); }
.recorrido li { display: grid; grid-template-columns: 96px 1fr; gap: 64px; align-items: center; padding: 18px 0; position: relative; }
.recorrido li::before { content: ''; position: absolute; left: 120px; top: 50%; width: 16px; height: 16px; margin-top: -8px; border-radius: 50%; background: var(--vino); box-shadow: 0 0 0 5px #fff, 0 0 0 6px var(--vino); }
.recorrido__num { font-family: var(--f-titulo); font-size: 64px; font-weight: 600; line-height: 1; color: var(--beige); text-align: right; }
.recorrido strong { font-family: var(--f-titulo); font-size: 20px; font-weight: 500; color: var(--tinta); }
.recorrido p { font-size: 14.5px; color: var(--tinta-suave); margin-top: 4px; }

.confianza { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.confianza li { background: var(--papel); border-radius: 8px; padding: 22px; display: flex; flex-direction: column; gap: 6px; }
.confianza li { padding: 34px 26px 30px; gap: 8px; align-items: center; text-align: center; }
.confianza__icono {
  display: grid; place-items: center; width: 70px; height: 70px; margin-bottom: 10px;
  background: var(--beige); border-radius: 58% 42% 55% 45% / 48% 56% 44% 52%; /* gota, como en la marca */
}
.confianza__icono svg { width: 32px; height: 32px; fill: none; stroke: var(--vino); stroke-width: 1.25; stroke-linecap: round; stroke-linejoin: round; }
.confianza strong { font-family: var(--f-titulo); font-size: 19px; font-weight: 500; color: var(--vino); }
.confianza p { font-size: 14.5px; color: var(--tinta-suave); }
.pasos__accion { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.seccion--compacta { padding: 48px 0; }
.vendedor dl, dl.vendedor { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 8px 20px; font-size: 15px; }
.vendedor dd, dl.vendedor dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 560px) {
  .vendedor dl, dl.vendedor { grid-template-columns: 1fr; gap: 2px; }
  .vendedor dd, dl.vendedor dd { margin-bottom: 10px; }
}
.vendedor dt, dl.vendedor dt { font-weight: 700; }
.vendedor h2 { font-family: var(--f-titulo); font-size: 26px; margin-bottom: 14px; }
.pie__vendedor { font-size: 12.5px; opacity: .85; margin-bottom: 6px; }
.pie__vendedor a { color: #fff; }

/* Opiniones de clientes */
[data-opiniones][hidden] { display: none; }
.opiniones__lista { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.opinion { margin: 0; background: #fff; border: 1px solid var(--linea); border-radius: 8px; padding: 20px; display: flex; flex-direction: column; gap: 10px; }
.opinion img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 6px; }
.opinion__estrellas { color: #E0A100; letter-spacing: 2px; }
.opinion blockquote { margin: 0; font-family: var(--f-titulo); font-size: 17px; line-height: 1.5; }
.opinion figcaption { font-size: 13px; color: var(--tinta-suave); }
@media (max-width: 860px) {
  .nosotros-portada__grid, .confianza, .opiniones__lista { grid-template-columns: 1fr; }
  .nosotros-portada__foto img { transform: none; }
  .historia { padding-top: 48px; }
  .historia__fila { grid-template-columns: 1fr; gap: 36px; margin-bottom: 64px; }
  .historia__fila .historia__foto { order: -1; max-width: 340px; }
  .recorrido::before { left: 69px; }
  .recorrido li { grid-template-columns: 46px 1fr; gap: 48px; }
  .recorrido li::before { left: 62px; }
  .recorrido__num { font-size: 40px; }
}

/* ---------- Consultar mi pedido ---------- */
.seguimiento__intro { margin: -12px 0 20px; }
.seguimiento__form fieldset { grid-template-columns: 1.3fr 1fr; }
.seguimiento { margin-top: 32px; background: #fff; border: 1px solid var(--linea); border-radius: 8px; padding: 22px; }
.seguimiento[hidden] { display: none; }
.seguimiento__cabeza { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: 13.5px; color: var(--tinta-suave); }
.seguimiento__estado { font-family: var(--f-titulo); font-size: 26px; margin: 10px 0 18px; color: var(--vino); }
.seguimiento__estado--enviado { color: #2f7a3c; }
.linea-tiempo { list-style: none; padding: 0; margin: 0 0 18px; }
.linea-tiempo li { position: relative; display: flex; gap: 14px; padding: 0 0 18px 0; color: var(--tinta-suave); }
.linea-tiempo li:not(:last-child)::before { content: ''; position: absolute; left: 8px; top: 20px; bottom: 0; width: 2px; background: var(--linea); }
.linea-tiempo .punto { flex: none; width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--linea); background: #fff; margin-top: 2px; }
.linea-tiempo li.hecho { color: var(--tinta); }
.linea-tiempo li.hecho .punto { background: var(--vino); border-color: var(--vino); }
.linea-tiempo li.hecho:not(:last-child)::before { background: var(--vino); }
.linea-tiempo li.alerta .punto { background: #fff; border-color: var(--vino); }
.linea-tiempo span:last-child { display: flex; flex-direction: column; font-size: 14.5px; }
.linea-tiempo small { font-size: 12.5px; color: var(--tinta-suave); }
.seguimiento__guia { background: var(--beige-claro); padding: 12px 14px; border-radius: 6px; font-size: 14.5px; margin-bottom: 16px; }
.seguimiento .estado-pedido__detalle { max-width: none; margin-top: 0; }
.seguimiento__ayuda { font-size: 14px; margin-top: 14px; }
@media (max-width: 560px) { .seguimiento__form fieldset { grid-template-columns: 1fr; } }

/* ---------- Políticas ---------- */
.politicas section { padding: 24px 0; border-top: 1px solid var(--linea); }
.politicas h2 { font-family: var(--f-titulo); font-size: 26px; margin-bottom: 12px; color: var(--vino); }
.politicas h3 { font-size: 15px; font-weight: 700; margin: 16px 0 6px; }
.politicas p, .politicas li { font-size: 15px; color: var(--tinta); }
.politicas ul { padding-left: 20px; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.politicas__indice { font-size: 14px; margin-bottom: 8px; }
.politicas__indice a { color: var(--vino); font-weight: 600; }
.por-definir { background: #fff3b0; padding: 0 4px; border-radius: 2px; }

/* ---------- Panel de la tienda ---------- */
.admin { background: #f6f1ea; }
.admin__cabeza { background: #fff; border-bottom: 1px solid var(--linea); }
.admin__cabeza-fila { display: flex; align-items: center; gap: 16px; min-height: 64px; }
.admin__logo { height: 36px; width: auto; }
.admin__rotulo { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-suave); margin-right: auto; }
.admin__cuerpo { padding: 32px var(--margen) 80px; }
.admin__ingreso { max-width: 380px; margin: 48px auto; background: #fff; padding: 32px; border-radius: 8px; border: 1px solid var(--linea); display: flex; flex-direction: column; gap: 16px; }
.admin__ingreso[hidden] { display: none; }
.admin__ingreso h1 { font-family: var(--f-titulo); font-size: 28px; }
.admin__resumen { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 24px; }
.admin__resumen div { background: #fff; border: 1px solid var(--linea); border-radius: 6px; padding: 16px; display: flex; flex-direction: column; gap: 2px; }
.admin__resumen strong { font-family: var(--f-titulo); font-size: 26px; color: var(--vino); font-weight: 500; }
.admin__resumen span { font-size: 12px; color: var(--tinta-suave); }
.admin__pestanas { margin: 0 0 20px; }
.admin [data-seccion] .filtros { margin-bottom: 16px; }
.admin__pedidos { display: flex; flex-direction: column; gap: 14px; }
.pedido { background: #fff; border: 1px solid var(--linea); border-left: 5px solid var(--linea); border-radius: 6px; padding: 18px 20px; }
.pedido--pagado { border-left-color: var(--vino); }
.pedido--enviado { border-left-color: #2f7a3c; }
.pedido__cabeza { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 12px; }
.pedido__cabeza div { display: flex; flex-direction: column; }
.pedido__cabeza span { font-size: 12.5px; color: var(--tinta-suave); }
.pedido__estado { background: var(--beige-claro); color: var(--tinta) !important; font-size: 12px !important; font-weight: 600; padding: 5px 10px; border-radius: 999px; white-space: nowrap; }
.pedido--pagado .pedido__estado { background: var(--vino); color: #fff !important; }
.pedido--enviado .pedido__estado { background: #e3f1e5; color: #2f7a3c !important; }
.pedido__alerta { background: #fff3b0; padding: 8px 12px; border-radius: 4px; font-size: 13.5px; margin-bottom: 10px; }
.pedido__cuerpo { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 20px; font-size: 14px; }
.pedido__cuerpo h4 { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-suave); margin: 0 0 6px; }
.pedido__cuerpo p { margin-bottom: 4px; }
.pedido__totales { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--linea); }
.pedido__enviar { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--linea); }
.pedido__enviar input { flex: 1 1 160px; font: 400 14px/1 var(--f-texto); padding: 10px 12px; border: 1px solid var(--linea); border-radius: 4px; }
.pedido__guia { margin-top: 12px; font-size: 13px; color: #2f7a3c; }
.pedido__anular { margin-top: 10px; text-align: right; }
.pedido__anular .enlace { background: none; border: 0; cursor: pointer; font-size: 12.5px; color: var(--tinta-suave); }
.pedido--anulado { opacity: .6; }
.anular-caja { display: flex; flex-direction: column; gap: 10px; text-align: left; background: #fbe9e9; border-left: 4px solid var(--vino); padding: 12px 14px; border-radius: 4px; font-size: 13.5px; }
.anular-motivo { font: 400 14px/1 var(--f-texto); padding: 10px 12px; border: 1px solid var(--linea); border-radius: 4px; }
.anular-acciones { display: flex; gap: 8px; flex-wrap: wrap; }
.anular-error { color: var(--vino); font-weight: 600; font-size: 13px; }
.admin__venta { background: #fff; padding: 24px; border-radius: 8px; border: 1px solid var(--linea); display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; max-width: 720px; }
.admin__venta h2 { grid-column: 1 / -1; font-family: var(--f-titulo); font-size: 22px; }
.admin__venta .nota-suave, .admin__venta .formulario__error, .admin__venta .btn { grid-column: 1 / -1; }
.admin__venta .btn { justify-self: start; }
.admin__subtitulo { font-family: var(--f-titulo); font-size: 20px; margin: 28px 0 10px; }
.admin__manuales { list-style: none; padding: 0; margin: 0; background: #fff; border: 1px solid var(--linea); border-radius: 6px; }
.admin__manuales li { display: flex; justify-content: space-between; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--linea); font-size: 14px; }
.admin__manuales li:last-child { border-bottom: 0; }
.admin__manuales .enlace { background: none; border: 0; cursor: pointer; flex: none; }
.admin__buscador { margin-bottom: 14px; }
.admin__tabla-envoltura { overflow-x: auto; background: #fff; border: 1px solid var(--linea); border-radius: 6px; }
.admin__tabla { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.admin__tabla th { text-align: left; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--tinta-suave); padding: 12px 14px; border-bottom: 1px solid var(--linea); }
.admin__tabla td { padding: 10px 14px; border-bottom: 1px solid var(--linea); vertical-align: top; }
.admin__talla { display: inline-block; background: var(--beige-claro); padding: 3px 8px; border-radius: 999px; margin: 2px 2px 2px 0; font-size: 12px; white-space: nowrap; }
.admin__talla--agotada { background: #f1e3e3; color: #a08a8a; text-decoration: line-through; }

/* ---------- Responsive ---------- */
@media (max-width: 980px) {
  .compra__grid { grid-template-columns: 1fr; }
  .resumen { position: static; order: -1; }
  .admin__resumen { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pedido__cuerpo { grid-template-columns: 1fr; }
  .cabecera__red--wa { margin-left: 0; }
}
@media (max-width: 560px) {
  .formulario fieldset, .admin__venta { grid-template-columns: 1fr; }
  .cabecera__fila { gap: 8px; }
  .cabecera__red { width: 34px; height: 34px; }
  .cabecera__red svg { width: 17px; height: 17px; }
  .cabecera__menu { padding: 9px 10px; }
}

/* =========================================================
   Inicio · rediseño (portada, compromisos, categorías)
   ========================================================= */
.portada__titulo { font: 600 12.5px/1.5 var(--f-texto); letter-spacing: .14em; text-transform: uppercase; color: #fff; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
.portada__titulo span { font-weight: 500; letter-spacing: .08em; padding: 5px 10px; background: rgba(255,255,255,.16); border-radius: 2px; }

/* Historias (accesos rápidos estilo Instagram) */
.historias { background: var(--papel); border-bottom: 1px solid var(--linea); }
.historias__fila { display: flex; justify-content: center; gap: 22px; max-width: var(--ancho); margin: 0 auto; padding: 16px var(--margen) 12px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; }
.historias__fila::-webkit-scrollbar { display: none; }
.historia { flex: none; display: flex; flex-direction: column; align-items: center; gap: 6px; text-decoration: none; color: var(--tinta); scroll-snap-align: start; }
.historia__aro { width: 72px; height: 72px; padding: 3px; border-radius: 50%; background: conic-gradient(from 210deg, var(--vino), #e0567a, #f2b5a0, var(--vino-claro), var(--vino)); transition: transform .2s; }
.historia__aro img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; background: var(--beige-claro); border: 3px solid var(--papel); }
.historia__aro--icono { display: grid; place-items: center; }
.historia__aro--icono svg { width: 100%; height: 100%; padding: 18px; border-radius: 50%; fill: #fff; background: var(--vino); border: 3px solid var(--papel); }
.historia:hover .historia__aro { transform: scale(1.06); }
.historia__nombre { font-size: 12px; font-weight: 500; letter-spacing: .02em; }
@media (max-width: 980px) {
  .historias__fila { justify-content: flex-start; gap: 14px; padding: 12px var(--margen) 10px; }
  .historia__aro { width: 66px; height: 66px; }
  .historia__nombre { font-size: 11.5px; }
}

.portada__codigo { margin-top: 16px; font-size: 13px; letter-spacing: .02em; opacity: .85; }
.portada__codigo strong { letter-spacing: .08em; border-bottom: 1px dashed rgba(255,255,255,.6); }

/* Compromisos con íconos de línea */
.compromisos__lista--4 { grid-template-columns: repeat(4, 1fr); }
.compromisos__lista--4 li { display: grid; grid-template-columns: 36px 1fr; column-gap: 14px; row-gap: 2px; align-items: start; padding: 26px 22px; }
.compromisos__lista--4 li svg { grid-row: 1 / 3; width: 30px; height: 30px; fill: none; stroke: var(--vino); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; margin-top: 2px; }
.compromisos__lista--4 strong { font-size: 17px; line-height: 1.25; }
.compromisos__lista--4 span { font-size: 13.5px; line-height: 1.45; }

/* Categorías principales en arcos */
.cats { padding-bottom: 72px; }
.cats__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 20px; }
.cat { display: flex; flex-direction: column; text-decoration: none; color: var(--tinta); }
.cat__foto {
  position: relative;
  display: block;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border-radius: 999px 999px 14px 14px;   /* arco: forma propia de la marca */
  background: var(--beige-claro);
  box-shadow: inset 0 0 0 1px rgba(150, 1, 8, .06);
}
.cat__foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.cat:hover .cat__foto img { transform: scale(1.05); }
.cat__texto { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 16px 6px 0; }
.cat__nombre { font-family: var(--f-titulo); font-size: 22px; line-height: 1.15; }
.cat__desc { font-size: 13px; color: var(--tinta-suave); margin-top: 4px; }
.cat__ir {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 10px;
  font-size: 11.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--vino);
}
.cat__ir svg { width: 16px; height: 16px; transition: transform .25s; }
.cat:hover .cat__ir svg { transform: translateX(4px); }
.cat:hover .cat__nombre { color: var(--vino); }

/* Por tipo de prenda */
.tipos { margin-top: 56px; padding-top: 40px; border-top: 1px solid var(--linea); }
.tipos__titulo { text-align: center; font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--tinta-suave); margin-bottom: 22px; }
.tipos__lista { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.tipo {
  display: flex; align-items: center; gap: 12px; min-width: 0;
  padding: 8px 20px 8px 8px; background: #fff; border: 1px solid var(--linea); border-radius: 999px;
  text-decoration: none; color: var(--tinta); transition: border-color .2s, box-shadow .2s, transform .2s;
}
.tipo:hover { border-color: var(--vino); box-shadow: 0 6px 18px -10px rgba(150, 1, 8, .35); transform: translateY(-1px); }
.tipo__foto { flex: none; width: 46px; height: 46px; border-radius: 50%; overflow: hidden; background: var(--beige-claro); }
.tipo__foto img { width: 100%; height: 100%; object-fit: cover; }
.tipo__foto--icono { display: grid; place-items: center; background: var(--vino); }
.tipo__foto--icono svg { width: 22px; height: 22px; fill: #fff; }
.tipo__texto { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.tipo__texto strong { font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tipo__texto small { font-size: 11.5px; color: var(--tinta-suave); margin-top: 2px; }

.seccion--destacados { padding-top: 24px; }
.ficha__subtitulo { font: 600 11.5px/1.4 var(--f-texto); letter-spacing: .14em; text-transform: uppercase; color: var(--vino); margin: 18px 0 8px; }
.ficha__destacados { list-style: none; padding: 0; margin: 0 0 14px; display: grid; gap: 6px; }
.ficha__destacados li { position: relative; padding-left: 20px; }
.ficha__destacados li::before { content: '✦'; position: absolute; left: 0; top: 0; color: var(--vino); font-size: 11px; line-height: 1.9; }
.ficha__estilo { margin-bottom: 12px; }
/* =========================================================
   Quiénes somos · historia editorial
   ========================================================= */
.nos h2 { font-family: var(--f-titulo); font-weight: 500; line-height: 1.12; }
/* Bienvenida: foto protagonista a todo lo ancho */
.nos-portada { position: relative; min-height: min(86vh, 760px); display: flex; align-items: flex-end; overflow: hidden; background: var(--tinta); color: #fff; }
.nos-portada__foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 35%; }
.nos-portada::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(42,23,21,.78) 0%, rgba(42,23,21,.45) 42%, rgba(42,23,21,0) 70%), linear-gradient(0deg, rgba(42,23,21,.55), rgba(42,23,21,0) 45%); }
.nos-portada__texto { position: relative; z-index: 1; padding-top: 120px; padding-bottom: 72px; max-width: var(--ancho); }
.nos-portada__texto > * { max-width: 560px; }
.nos-portada__guion { font-size: clamp(38px, 4.4vw, 56px); color: var(--beige-claro); line-height: 1; }
.nos-portada h1 { font-family: var(--f-titulo); font-weight: 500; font-size: clamp(36px, 4.6vw, 60px); line-height: 1.05; margin: 10px 0 18px; }
.nos-portada h1 em { font-style: italic; font-weight: 400; color: var(--beige); }
.nos-portada__texto p:last-child { font-size: 17px; line-height: 1.6; opacity: .92; }

/* Historia: foto en arco + texto con letra capital */
.nos-historia { padding: 112px 0 96px; }
.nos-historia__grid { display: grid; grid-template-columns: 5fr 6fr; gap: 80px; align-items: center; }
.nos-historia__foto { position: relative; margin: 0; }
.nos-historia__foto img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 999px 999px 18px 18px; box-shadow: 0 30px 60px -36px rgba(42,23,21,.5); }
.nos-historia__foto::before { content: ''; position: absolute; inset: 18px -18px -18px 18px; border: 1px solid var(--beige); border-radius: 999px 999px 18px 18px; z-index: -1; }
.nos-historia__destello { position: absolute; top: 8%; right: -22px; width: 44px; height: 44px; fill: var(--vino); }
.nos-historia__texto h2 { font-size: clamp(32px, 3.4vw, 46px); margin-bottom: 26px; }
.nos-historia__texto p { font-size: 17px; line-height: 1.8; color: var(--tinta-suave); max-width: 54ch; }
.nos-historia__texto p + p { margin-top: 18px; }
.nos-capitular::first-letter { float: left; font-family: var(--f-titulo); font-size: 64px; line-height: .9; padding: 6px 10px 0 0; color: var(--vino); }

/* Frase */
.nos-frase { padding: 24px 0 104px; text-align: center; }
.nos-frase svg { width: 26px; height: 26px; fill: var(--vino); margin: 0 auto 20px; }
.nos-frase blockquote { margin: 0 auto; max-width: 22ch; font-family: var(--f-titulo); font-style: italic; font-weight: 400; font-size: clamp(28px, 3.6vw, 48px); line-height: 1.2; color: var(--vino); }

/* Esencia */
.nos-esencia { padding: 96px 0; border-top: 1px solid var(--linea); }
.nos-esencia .seccion__cabeza h2 { max-width: 30ch; text-wrap: balance; margin: 0 auto; font-size: clamp(28px, 3vw, 40px); }
.nos-esencia__lista { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-top: 48px; }
.nos-esencia__lista article { padding: 34px 30px; background: #fff; border: 1px solid var(--linea); border-radius: 18px; transition: transform .3s, box-shadow .3s; }
.nos-esencia__lista article:hover { transform: translateY(-4px); box-shadow: 0 20px 40px -28px rgba(150,1,8,.35); }
.nos-esencia__num { display: block; font-family: var(--f-titulo); font-size: 15px; color: var(--vino); letter-spacing: .12em; margin-bottom: 16px; }
.nos-esencia__lista h3 { font-family: var(--f-titulo); font-weight: 500; font-size: 23px; margin-bottom: 10px; }
.nos-esencia__lista p { color: var(--tinta-suave); line-height: 1.7; }

/* Lo que nos importa */
.nos-importa { padding: 104px 0; }
.nos-importa__grid { display: grid; grid-template-columns: 6fr 5fr; gap: 80px; align-items: center; }
.nos-importa__texto h2 { font-size: clamp(30px, 3.2vw, 42px); margin-bottom: 28px; }
.nos-importa__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.nos-importa__lista li { position: relative; padding-left: 30px; line-height: 1.7; color: var(--tinta-suave); }
.nos-importa__lista li::before { content: '✦'; position: absolute; left: 0; top: 1px; color: var(--vino); }
.nos-importa__lista strong { color: var(--tinta); font-weight: 600; }
.nos-importa__lista a { color: var(--vino); font-weight: 600; }
.nos-importa__foto { margin: 0; }
.nos-importa__foto img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 18px; box-shadow: 0 30px 60px -36px rgba(42,23,21,.5); }
.nos-importa__foto figcaption { margin-top: 14px; font-family: var(--f-guion); font-size: 28px; color: var(--vino); text-align: center; }

.nos-importa__puntos { list-style: none; margin: 48px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.nos-importa__puntos li { text-align: center; padding: 34px 24px; background: rgba(255,255,255,.72); border-radius: 18px; }
.nos-importa__puntos svg { width: 34px; height: 34px; margin: 0 auto 16px; fill: none; stroke: var(--vino); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.nos-importa__puntos strong { display: block; font-family: var(--f-titulo); font-weight: 500; font-size: 20px; margin-bottom: 8px; }
.nos-importa__puntos p { color: var(--tinta-suave); font-size: 14.5px; line-height: 1.65; }
.nos-importa__puntos a { color: var(--vino); font-weight: 600; }
@media (max-width: 980px) { .nos-importa__puntos { grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 32px; } .nos-importa__puntos li { padding: 24px 16px; } }
@media (max-width: 560px) { .nos-importa__puntos { grid-template-columns: 1fr; } }

/* Cierre */
.nos-cierre { padding: 112px 0; text-align: center; }
.nos-cierre__contenido { max-width: 760px; }
.nos-cierre p.nos-cierre__guion { font-size: clamp(38px, 4vw, 54px); color: var(--beige-claro); line-height: 1; opacity: 1; }
.nos-cierre h2 { font-size: clamp(28px, 3.4vw, 44px); margin: 14px auto 20px; max-width: 22ch; }
.nos-cierre p { opacity: .9; max-width: 52ch; margin: 0 auto; font-size: 17px; line-height: 1.7; }
.nos-cierre__acciones { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 34px; }

/* Aparición suave */
.con-revelar .revelar { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1); }
.con-revelar .revelar.revelado { opacity: 1; transform: none; }

@media (max-width: 980px) {
  .nos-portada { min-height: 78vh; }
  .nos-portada__foto { object-position: 46% center; }
  .nos-portada::after { background: linear-gradient(0deg, rgba(42,23,21,.85) 0%, rgba(42,23,21,.5) 45%, rgba(42,23,21,.05) 75%); }
  .nos-portada__texto { padding-bottom: 48px; }
  .nos-portada__texto p:last-child { font-size: 15.5px; }
  .nos-historia, .nos-esencia, .nos-importa, .nos-cierre { padding: 72px 0; }
  .nos-historia__grid, .nos-importa__grid { grid-template-columns: 1fr; gap: 48px; }
  .nos-historia__foto { max-width: 360px; margin: 0 auto; width: 86%; }
  .nos-historia__texto p, .nos-cierre p { font-size: 16px; }
  .nos-frase { padding: 8px 0 72px; }
  .nos-esencia__lista { grid-template-columns: 1fr; gap: 16px; margin-top: 32px; }
  .nos-esencia__lista article { padding: 26px 22px; }
  .nos-importa__foto { max-width: 380px; margin: 0 auto; }
}
/* Barra de envío gratis (bolsa y checkout) */
.envio-gratis { margin: 0 0 16px; padding: 14px 16px; background: var(--beige-claro); border-radius: 12px; }
.envio-gratis__texto { font-size: 13.5px; line-height: 1.45; color: var(--tinta); margin-bottom: 10px; }
.envio-gratis__texto strong { color: var(--vino); }
.envio-gratis__barra { height: 8px; background: #fff; border-radius: 999px; overflow: hidden; }
.envio-gratis__barra span { display: block; height: 100%; background: linear-gradient(90deg, var(--vino-claro), var(--vino)); border-radius: 999px; transition: width .5s cubic-bezier(.2,.7,.2,1); }
.envio-gratis--listo { background: #EAF4EA; }
.envio-gratis--listo .envio-gratis__texto strong { color: #2E7D32; }
.envio-gratis--listo .envio-gratis__barra span { background: #2E7D32; }
.filtros__separador { flex: none; width: 1px; align-self: stretch; margin: 4px 6px; background: var(--linea); }

@media (max-width: 980px) {
  .compromisos__lista--4 { grid-template-columns: 1fr 1fr; }
  .compromisos__lista--4 li, .compromisos__lista--4 li:first-child { border-left: 0; border-top: 0; padding: 18px 8px; }
  .cats__grid {
    grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 42%;
    overflow-x: auto; scroll-snap-type: x mandatory; gap: 14px;
    margin: 0 calc(var(--margen) * -1); padding: 0 var(--margen) 6px; scrollbar-width: none;
  }
  .cats__grid::-webkit-scrollbar { display: none; }
  .cat { scroll-snap-align: start; }
  .tipos { margin-top: 36px; padding-top: 28px; }
  .tipos__lista { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .tipo { padding-right: 10px; }
  .portada__mosaico { aspect-ratio: 4 / 3; }
}
@media (max-width: 560px) {
  .compromisos__lista--4 li { grid-template-columns: 28px 1fr; column-gap: 10px; padding: 14px 4px; }
  .compromisos__lista--4 li svg { width: 24px; height: 24px; }
  .compromisos__lista--4 strong { font-size: 14.5px; }
  .compromisos__lista--4 span { font-size: 12px; }
  .cats__grid { grid-auto-columns: 58%; }
  .cat__nombre { font-size: 20px; }
  .cat__desc { font-size: 12px; }
  .tipo { padding: 8px 10px 8px 8px; gap: 10px; }
  .tipo__foto { width: 38px; height: 38px; }
  .tipo__texto strong { font-size: 12.5px; white-space: normal; }
  .tipo__texto small { font-size: 11px; }
}