/* =====================================================================
   SC INFORMATICA — FICHA DE PRODUCTO (product-page.css)
   ---------------------------------------------------------------------
   Vista: /producto/{id}  ->  resources/views/partials/detalles_producto.blade.php
   Reemplaza el <style> de 568 lineas que vivia dentro del Blade.
   Todo sobre los tokens de sc-visual.css. Prefijo: pdp-
   Incluye los estilos de partials/product-reviews.blade.php (.review*, .hero-btn).
   ===================================================================== */

.pdp{
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--sc-space-5) var(--sc-space-8);
}

/* =====================================================================
   BREADCRUMB
   ===================================================================== */
.pdp-crumb{
  display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
  padding: var(--sc-space-4) 0 var(--sc-space-3);
  font-size: .82rem; color: var(--sc-muted);
}
.pdp-crumb a{ color: var(--sc-muted); text-decoration: none; transition: color var(--sc-t-fast); }
.pdp-crumb a:hover{ color: var(--sc-primary); text-decoration: none; }
.pdp-crumb i{ font-size: .66rem; opacity: .55; }
.pdp-crumb b{
  color: var(--sc-wine); font-weight: 700;
  max-width: 380px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* =====================================================================
   HERO — galeria + compra
   ===================================================================== */
.pdp-hero{
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: clamp(20px, 3vw, 40px);
  align-items: start;
  margin-bottom: var(--sc-space-8);
}

/* ---------- Galeria ---------- */
.pdp-gallery{ display: flex; flex-direction: column; gap: var(--sc-space-3); min-width: 0; }
.pdp-frame{
  position: relative;
  aspect-ratio: 1 / 1;
  display: grid; place-items: center;
  overflow: hidden;
  padding: clamp(20px, 3vw, 40px);
  border-radius: var(--sc-radius-lg);
  background: linear-gradient(160deg, #ffffff 0%, #fdf4f8 100%);
  border: 1px solid var(--sc-border-soft);
  box-shadow: var(--sc-shadow-sm);
}
.pdp-frame img{
  max-width: 100%; max-height: 100%;
  object-fit: contain;
  mix-blend-mode: multiply;
  transition: transform .35s var(--sc-ease);
}
.pdp-frame:hover img{ transform: scale(1.09); }

.pdp-frame__nav{
  position: absolute; top: 50%; transform: translateY(-50%);
  display: none; place-items: center;
  width: 42px; height: 42px; z-index: 2;
  border: 1px solid var(--sc-border);
  border-radius: 50%;
  background: rgba(255,255,255,.94);
  color: var(--sc-wine); font-size: 1.05rem;
  cursor: pointer;
  box-shadow: var(--sc-shadow-sm);
  transition: all var(--sc-t-fast);
}
.pdp-frame__nav:hover{ background: var(--sc-grad-brand); color: #fff; border-color: transparent; transform: translateY(-50%) scale(1.06); }
.pdp-frame__nav--prev{ left: 14px; }
.pdp-frame__nav--next{ right: 14px; }
.pdp-frame.has-multiple .pdp-frame__nav{ display: grid; }

.pdp-frame__counter{
  position: absolute; bottom: 14px; right: 14px; z-index: 2;
  padding: 5px 12px; border-radius: 999px;
  background: rgba(42,7,22,.78); color: #fff;
  font-size: .74rem; font-weight: 700;
  font-variant-numeric: tabular-nums;
  backdrop-filter: blur(4px);
}
.pdp-frame__zoom{
  position: absolute; bottom: 14px; left: 14px; z-index: 2;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 12px; border-radius: 999px;
  background: rgba(255,255,255,.9);
  border: 1px solid var(--sc-border);
  color: var(--sc-muted);
  font-size: .7rem; font-weight: 700;
  pointer-events: none;
  opacity: 0; transition: opacity var(--sc-t-base);
}
.pdp-frame:hover .pdp-frame__zoom{ opacity: 1; }

.pdp-thumbs{
  display: flex; gap: var(--sc-space-2);
  overflow-x: auto; padding-bottom: 4px;
  scrollbar-width: thin;
}
.pdp-thumbs::-webkit-scrollbar{ height: 6px; }
.pdp-thumbs::-webkit-scrollbar-thumb{ background: var(--sc-border); border-radius: 999px; }
.pdp-thumb{
  flex: none;
  width: 74px; height: 74px; padding: 6px;
  display: grid; place-items: center;
  border: 2px solid var(--sc-border-soft);
  border-radius: var(--sc-radius-sm);
  background: #fff;
  cursor: pointer;
  transition: all var(--sc-t-fast);
}
.pdp-thumb img{ max-width: 100%; max-height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.pdp-thumb:hover{ border-color: var(--sc-accent); transform: translateY(-2px); }
.pdp-thumb.is-active{ border-color: var(--sc-primary); box-shadow: 0 6px 16px rgba(204,0,102,.22); }

/* Mini tarjetas de confianza bajo la galeria */
.pdp-assurances{
  display: grid; grid-template-columns: repeat(3, minmax(0,1fr));
  gap: var(--sc-space-2); margin-top: var(--sc-space-2);
}
.pdp-assurance{
  display: flex; align-items: center; gap: 10px;
  padding: var(--sc-space-3);
  border-radius: var(--sc-radius-sm);
  background: var(--sc-surface);
  border: 1px solid var(--sc-border-soft);
}
.pdp-assurance i{ font-size: 1.2rem; color: var(--sc-primary); flex: none; }
.pdp-assurance strong{ display: block; color: var(--sc-ink); font-size: .82rem; font-weight: 700; line-height: 1.2; }
.pdp-assurance span{ display: block; color: var(--sc-muted); font-size: .74rem; line-height: 1.3; }

/* ---------- Columna de informacion ---------- */
.pdp-info{ display: flex; flex-direction: column; gap: var(--sc-space-4); min-width: 0; }

.pdp-badges{ display: flex; flex-wrap: wrap; gap: 7px; }
.pdp-badge{
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 11px; border-radius: 999px;
  font-size: .74rem; font-weight: 700; white-space: nowrap;
  background: var(--sc-surface-tint); color: var(--sc-wine);
}
.pdp-badge i{ font-size: .68rem; }
.pdp-badge--ok{ background: var(--sc-success-soft); color: var(--sc-success-ink); }
.pdp-badge--low{ background: var(--sc-warning-soft); color: var(--sc-warning-ink); }
.pdp-badge--out{ background: var(--sc-danger-soft); color: var(--sc-danger-ink); }
.pdp-badge--brand{ background: var(--sc-primary-soft); color: var(--sc-primary-dark); letter-spacing: .06em; }
.pdp-badge--code{ background: #f4f5f7; color: #5f6470; font-weight: 600; }
.pdp-badge--admin{ background: #eef2ff; color: #3730a3; border: 1px solid #c7d2fe; }

.pdp-title{
  margin: 0;
  color: var(--sc-ink);
  font-size: clamp(1.5rem, 2.6vw, 2.1rem);
  font-weight: 800; line-height: 1.2; letter-spacing: -.02em;
}
.pdp-lead{ margin: 0; color: var(--sc-text); font-size: .96rem; line-height: 1.6; }

/* Resumen de estrellas */
.pdp-rating{
  display: inline-flex; align-items: center; gap: 10px; width: max-content;
  padding: 7px 14px; border-radius: 999px;
  background: var(--sc-surface); border: 1px solid var(--sc-border);
  text-decoration: none; transition: all var(--sc-t-fast);
}
.pdp-rating:hover{ border-color: var(--sc-primary); text-decoration: none; transform: translateY(-1px); }
.pdp-rating__score{ color: var(--sc-wine); font-size: 1.05rem; font-weight: 800; }
.pdp-rating__stars{ display: flex; gap: 2px; color: var(--sc-star); font-size: .84rem; }
.pdp-rating__count{ color: var(--sc-muted); font-size: .82rem; font-weight: 600; }

/* ---------- BUY BOX ---------- */
.pdp-buybox{
  position: sticky; top: var(--sc-space-4);
  display: flex; flex-direction: column; gap: var(--sc-space-3);
  padding: var(--sc-space-5);
  border-radius: var(--sc-radius-lg);
  background: var(--sc-surface);
  border: 1px solid var(--sc-border);
  box-shadow: var(--sc-shadow-md);
}
.pdp-buybox__eyebrow{
  display: inline-flex; align-items: center; gap: 6px; width: max-content;
  padding: 4px 11px; border-radius: 999px;
  background: var(--sc-success-soft); color: var(--sc-success-ink);
  font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
}
.pdp-price{ display: flex; flex-direction: column; gap: 2px; }
.pdp-price__label{
  color: var(--sc-muted); font-size: .72rem; font-weight: 800;
  letter-spacing: .12em; text-transform: uppercase;
}
.pdp-price__row{ display: flex; align-items: baseline; gap: var(--sc-space-3); flex-wrap: wrap; row-gap: 6px; }
.pdp-price__amount{
  color: var(--sc-wine);
  font-size: clamp(2rem, 4vw, 2.6rem);
  font-weight: 800; line-height: 1; letter-spacing: -.03em;
  font-variant-numeric: tabular-nums;
}
.pdp-price__save{
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 11px; border-radius: 999px;
  background: var(--sc-success-soft); color: var(--sc-success-ink);
  font-size: .78rem; font-weight: 800; white-space: nowrap;
}
.pdp-price__alt{
  display: flex; align-items: baseline; justify-content: space-between; gap: var(--sc-space-3);
  padding: 10px 13px; margin-top: 4px;
  border-radius: var(--sc-radius-sm);
  background: var(--sc-surface-soft);
  border: 1px solid var(--sc-border-soft);
}
.pdp-price__alt span{ color: var(--sc-muted); font-size: .8rem; font-weight: 600; }
.pdp-price__alt b{ color: var(--sc-text); font-size: 1.05rem; font-weight: 800; font-variant-numeric: tabular-nums; }

.pdp-actions{ display: flex; gap: var(--sc-space-2); margin-top: 2px; }
.pdp-actions form{ margin: 0; flex: 1 1 auto; }

.hero-btn{
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  width: 100%; min-height: 52px; padding: 0 var(--sc-space-5);
  border: 0; border-radius: var(--sc-radius-sm);
  font-family: inherit; font-size: .98rem; font-weight: 800;
  text-decoration: none; cursor: pointer;
  transition: transform var(--sc-t-fast), box-shadow var(--sc-t-fast), filter var(--sc-t-fast);
}
.hero-btn i{ font-size: 1.1rem; }
.hero-btn--primary{
  background: var(--sc-grad-brand); color: #fff;
  box-shadow: 0 14px 30px rgba(204,0,102,.3);
}
.hero-btn--primary:hover{ color: #fff; transform: translateY(-2px); box-shadow: 0 20px 40px rgba(204,0,102,.4); filter: saturate(1.06); }
.hero-btn--ghost{
  background: var(--sc-surface); color: var(--sc-wine);
  border: 1px solid var(--sc-border);
}
.hero-btn--ghost:hover{ color: var(--sc-primary); border-color: var(--sc-primary); background: var(--sc-primary-soft); }
.hero-btn:disabled{ opacity: .6; cursor: not-allowed; transform: none; }

.pdp-fav{ width: 52px; min-width: 52px; flex: none; padding: 0; }
.pdp-fav span{ display: none; }
.pdp-fav[aria-pressed="true"]{ color: var(--sc-primary); border-color: var(--sc-primary); background: var(--sc-primary-soft); }

/* Entrega / retiro dentro del buy box */
.pdp-delivery{
  display: flex; flex-direction: column; gap: var(--sc-space-2);
  padding-top: var(--sc-space-3);
  border-top: 1px dashed var(--sc-border);
}
.pdp-delivery__row{ display: flex; align-items: flex-start; gap: 10px; }
.pdp-delivery__row > i{ font-size: 1.05rem; color: var(--sc-primary); margin-top: 1px; flex: none; }
.pdp-delivery__row strong{ display: block; color: var(--sc-ink); font-size: .86rem; font-weight: 700; }
.pdp-delivery__row span{ display: block; color: var(--sc-muted); font-size: .8rem; line-height: 1.4; }
.pdp-delivery__row em{ font-style: normal; color: var(--sc-primary); font-weight: 700; }

/* Beneficios */
.pdp-benefits{ list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.pdp-benefits li{
  display: flex; align-items: center; gap: 10px;
  color: var(--sc-text); font-size: .88rem;
}
.pdp-benefits i{ color: var(--sc-primary); font-size: .95rem; flex: none; }

/* =====================================================================
   ENCABEZADO DE SECCION
   ===================================================================== */
.pdp-head{ text-align: center; margin: 0 auto var(--sc-space-5); max-width: 720px; }
.pdp-head__eyebrow{
  display: inline-block; margin-bottom: 6px;
  color: var(--sc-primary);
  font-size: .72rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase;
}
.pdp-head h2{
  margin: 0; color: var(--sc-ink);
  font-size: clamp(1.35rem, 2.4vw, 1.95rem); font-weight: 800; letter-spacing: -.02em;
}
.pdp-head h2 b{ color: var(--sc-primary); font-weight: 800; }

/* =====================================================================
   DESCRIPCION + ESPECIFICACIONES
   ===================================================================== */
.pdp-detail{
  display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: clamp(20px, 3vw, 34px);
  align-items: start;
  margin-bottom: var(--sc-space-8);
}
.pdp-panel{
  padding: clamp(20px, 3vw, 30px);
  border-radius: var(--sc-radius-lg);
  background: var(--sc-surface);
  border: 1px solid var(--sc-border);
  box-shadow: var(--sc-shadow-sm);
  min-width: 0;
}
.pdp-panel__title{
  display: flex; align-items: center; gap: 10px;
  margin: 0 0 var(--sc-space-4);
  color: var(--sc-ink); font-size: 1.15rem; font-weight: 800;
}
.pdp-panel__title i{ color: var(--sc-primary); font-size: 1.1rem; }

.pdp-desc{ color: var(--sc-text); font-size: .94rem; line-height: 1.75; }
.pdp-desc p{ margin: 0 0 12px; }
.pdp-desc p:last-child{ margin-bottom: 0; }

/* Tabla de especificaciones */
.pdp-specs{ display: flex; flex-direction: column; }
.pdp-spec{
  display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: var(--sc-space-3);
  padding: 11px var(--sc-space-3);
  border-radius: 8px;
  font-size: .87rem;
}
.pdp-spec:nth-child(odd){ background: var(--sc-surface-soft); }
.pdp-spec dt{ color: var(--sc-muted); font-weight: 700; min-width: 0; overflow-wrap: anywhere; }
.pdp-spec dd{ margin: 0; color: var(--sc-ink); font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.pdp-spec--full{ grid-template-columns: 1fr; }
.pdp-spec--full dd{ color: var(--sc-text); font-weight: 500; }
.pdp-specs__more{
  margin-top: var(--sc-space-3);
  padding: 10px; width: 100%;
  border: 1px solid var(--sc-border); border-radius: var(--sc-radius-sm);
  background: var(--sc-surface); color: var(--sc-primary);
  font-family: inherit; font-size: .85rem; font-weight: 800; cursor: pointer;
  transition: all var(--sc-t-fast);
}
.pdp-specs__more:hover{ background: var(--sc-primary-soft); border-color: var(--sc-primary); }
.pdp-spec[hidden]{ display: none; }

/* Banda de servicios dentro de la descripcion */
.pdp-services{
  position: relative; overflow: hidden; isolation: isolate;
  margin-top: var(--sc-space-5);
  padding: clamp(20px, 3vw, 28px);
  border-radius: var(--sc-radius-lg);
  background: var(--sc-grad-wine);
  color: #fff;
}
.pdp-services::before{
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    radial-gradient(circle at 10% 0%, rgba(240,97,164,.28), transparent 45%),
    radial-gradient(circle at 95% 110%, rgba(204,0,102,.24), transparent 48%);
}
.pdp-services__eyebrow{
  display: inline-flex; align-items: center; gap: 7px;
  color: var(--sc-on-wine-soft); font-size: .7rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase;
}
.pdp-services h4{ margin: 10px 0 8px; color: #fff; font-size: 1.15rem; font-weight: 800; }
.pdp-services p{ margin: 0 0 var(--sc-space-4); color: rgba(255,255,255,.8); font-size: .9rem; line-height: 1.6; }
.pdp-services__list{ list-style: none; margin: 0 0 var(--sc-space-4); padding: 0; display: grid; gap: 10px; }
.pdp-services__list li{ display: flex; align-items: center; gap: 9px; color: rgba(255,255,255,.88); font-size: .88rem; }
.pdp-services__list i{ color: var(--sc-on-wine); flex: none; }
.pdp-services__cta{
  display: inline-flex; align-items: center; gap: 8px;
  padding: 11px 20px; border-radius: 999px;
  background: var(--sc-grad-brand); color: #fff;
  font-weight: 800; font-size: .88rem; text-decoration: none;
  box-shadow: 0 12px 26px rgba(204,0,102,.34);
  transition: transform var(--sc-t-fast);
}
.pdp-services__cta:hover{ transform: translateY(-2px); color: #fff; text-decoration: none; }

/* =====================================================================
   RELACIONADOS
   ===================================================================== */
.pdp-related{ margin-bottom: var(--sc-space-8); }
.pdp-related__grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: var(--sc-space-4);
}
.pdp-related .producto-card{ min-height: 0; min-width: 0; display: flex; flex-direction: column; }
.pdp-related .producto-card__body{ display: flex; flex-direction: column; gap: 5px; flex: 1 1 auto; }

/* =====================================================================
   BANDA DE INFORMACION
   ===================================================================== */
.pdp-trust{
  position: relative; overflow: hidden; isolation: isolate;
  margin-bottom: var(--sc-space-8);
  padding: clamp(26px, 4vw, 42px);
  border-radius: var(--sc-radius-xl);
  background: var(--sc-grad-wine);
  color: #fff;
  box-shadow: var(--sc-shadow-lg);
}
.pdp-trust::before{
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    radial-gradient(circle at 8% 0%, rgba(240,97,164,.24), transparent 45%),
    radial-gradient(circle at 92% 120%, rgba(204,0,102,.2), transparent 46%);
}
.pdp-trust__head{ text-align: center; margin-bottom: var(--sc-space-5); }
.pdp-trust__eyebrow{
  display: inline-flex; align-items: center; gap: 7px;
  padding: 6px 14px; border-radius: 999px;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.16);
  color: var(--sc-on-wine-soft); font-size: .7rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase;
}
.pdp-trust__head h2{ margin: 12px 0 0; color: #fff; font-size: clamp(1.35rem, 2.4vw, 1.95rem); font-weight: 800; }
.pdp-trust__grid{ display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: var(--sc-space-3); }
.pdp-trust__card{
  display: flex; flex-direction: column; gap: 5px;
  padding: var(--sc-space-4);
  border-radius: var(--sc-radius-md);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  transition: background var(--sc-t-fast), transform var(--sc-t-fast);
}
.pdp-trust__card:hover{ background: rgba(255,255,255,.11); transform: translateY(-3px); }
.pdp-trust__card i{ font-size: 1.45rem; color: var(--sc-on-wine); margin-bottom: 4px; }
.pdp-trust__card strong{ color: #fff; font-size: .95rem; font-weight: 700; }
.pdp-trust__card span{ color: rgba(255,255,255,.76); font-size: .84rem; line-height: 1.45; }

/* =====================================================================
   BARRA STICKY DE COMPRA (mobile) — la pide la guia de diseno
   ===================================================================== */
.pdp-stickybar{
  display: none;
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 70;
  align-items: center; gap: var(--sc-space-3);
  padding: 10px var(--sc-space-4);
  padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
  background: rgba(255,255,255,.97);
  border-top: 1px solid var(--sc-border);
  box-shadow: 0 -8px 28px rgba(85,16,44,.14);
  backdrop-filter: blur(8px);
}
.pdp-stickybar__price{ display: flex; flex-direction: column; min-width: 0; }
.pdp-stickybar__price small{
  color: var(--sc-muted); font-size: .62rem; font-weight: 800;
  letter-spacing: .1em; text-transform: uppercase;
}
.pdp-stickybar__price b{
  color: var(--sc-wine); font-size: 1.2rem; font-weight: 800;
  font-variant-numeric: tabular-nums; line-height: 1.15;
}
.pdp-stickybar .hero-btn{ width: auto; flex: 1 1 auto; min-height: 46px; font-size: .9rem; }

/* =====================================================================
   OPINIONES — estilos de partials/product-reviews.blade.php
   ===================================================================== */
.pdp-reviews{
  margin-bottom: var(--sc-space-8);
  padding: clamp(20px, 3vw, 32px);
  border-radius: var(--sc-radius-lg);
  background: var(--sc-surface);
  border: 1px solid var(--sc-border);
  box-shadow: var(--sc-shadow-sm);
  scroll-margin-top: var(--sc-space-5);
}
.reviews-head{
  display: flex; justify-content: space-between; align-items: center;
  gap: var(--sc-space-4); flex-wrap: wrap;
  padding-bottom: var(--sc-space-4);
  border-bottom: 1px solid var(--sc-border-soft);
}
.reviews-head h3{ margin: 4px 0 0; color: var(--sc-ink); font-size: 1.4rem; font-weight: 800; }
.reviews-eyebrow{
  margin: 0; color: var(--sc-primary);
  font-size: .7rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase;
}
.reviews-subtitle{ margin: 6px 0 0; color: var(--sc-muted); font-size: .9rem; }
.reviews-scorecard{
  flex: none; min-width: 148px; text-align: center;
  padding: var(--sc-space-4);
  border-radius: var(--sc-radius-md);
  background: var(--sc-surface-soft);
  border: 1px solid var(--sc-border-soft);
}
.reviews-scorecard__score{ color: var(--sc-wine); font-size: 2.2rem; font-weight: 800; line-height: 1; }
.reviews-scorecard__stars{ display: flex; justify-content: center; gap: 3px; margin: 8px 0 6px; color: var(--sc-star); }
.reviews-scorecard__count{ color: var(--sc-muted); font-size: .86rem; font-weight: 600; }

.review-form-card,
.review-auth-card{
  margin-top: var(--sc-space-4);
  padding: var(--sc-space-5);
  border-radius: var(--sc-radius-md);
  background: var(--sc-surface-soft);
  border: 1px solid var(--sc-border-soft);
}
.review-form-card__title h4,
.review-auth-card h4{ margin: 0; color: var(--sc-ink); font-size: 1.05rem; font-weight: 800; }
.review-form-card__title span{ display: block; margin-top: 3px; color: var(--sc-muted); font-size: .85rem; }
.review-auth-card{ display: flex; justify-content: space-between; align-items: center; gap: var(--sc-space-4); flex-wrap: wrap; }
.review-auth-card p{ margin: 4px 0 0; color: var(--sc-muted); font-size: .88rem; }
.review-auth-card__actions{ display: flex; gap: var(--sc-space-2); flex-wrap: wrap; }
.review-auth-card__actions .hero-btn{ width: auto; min-height: 44px; font-size: .88rem; }

.rating-picker{ display: flex; align-items: center; gap: 6px; margin: var(--sc-space-3) 0; flex-wrap: wrap; }
.rating-picker__star{
  width: 34px; height: 34px;
  display: grid; place-items: center;
  border: 0; border-radius: 8px;
  background: transparent; color: #dcd2d8;
  font-size: 1.15rem; cursor: pointer;
  transition: color var(--sc-t-fast), transform var(--sc-t-fast);
}
.rating-picker__star:hover{ transform: scale(1.12); }
.rating-picker__star.active{ color: var(--sc-star); }
.rating-picker__label{ margin-left: 8px; color: var(--sc-muted); font-size: .88rem; font-weight: 600; }

.form-label{ display: block; margin-bottom: 6px; color: var(--sc-ink); font-size: .86rem; font-weight: 700; }
.review-form-card textarea{
  width: 100%; padding: 12px 14px;
  border: 1px solid var(--sc-border); border-radius: var(--sc-radius-sm);
  background: var(--sc-surface); color: var(--sc-ink);
  font-family: inherit; font-size: .92rem; line-height: 1.55;
  outline: 0; resize: vertical;
  transition: border-color var(--sc-t-fast), box-shadow var(--sc-t-fast);
}
.review-form-card textarea:focus{ border-color: var(--sc-primary); box-shadow: 0 0 0 3px rgba(204,0,102,.13); }
.form-error{ margin: 5px 0 0; color: var(--sc-danger); font-size: .84rem; font-weight: 600; }
.review-form-card__actions{
  display: flex; align-items: center; gap: var(--sc-space-3);
  margin-top: var(--sc-space-4); flex-wrap: wrap;
}
.review-form-card__actions .hero-btn{ width: auto; min-height: 46px; font-size: .9rem; }
.review-form-card__hint{ color: var(--sc-muted); font-size: .86rem; }

.reviews-list{ margin-top: var(--sc-space-5); display: grid; gap: var(--sc-space-3); }
.review-card{
  padding: var(--sc-space-4);
  border-radius: var(--sc-radius-md);
  background: var(--sc-surface);
  border: 1px solid var(--sc-border-soft);
  transition: border-color var(--sc-t-fast), box-shadow var(--sc-t-fast);
}
.review-card:hover{ border-color: var(--sc-border); box-shadow: var(--sc-shadow-sm); }
.review-card__header{ display: flex; align-items: center; gap: 11px; }
.review-card__avatar{
  width: 40px; height: 40px; flex: none;
  display: grid; place-items: center;
  border-radius: 50%;
  background: var(--sc-grad-brand); color: #fff;
  font-weight: 800; font-size: 1rem;
}
.review-card__name{ color: var(--sc-ink); font-weight: 700; font-size: .92rem; }
.review-card__meta{ color: var(--sc-muted); font-size: .8rem; }
.review-card__stars{ margin-left: auto; color: var(--sc-star); font-size: .86rem; white-space: nowrap; }
.review-card__comment{ margin: 11px 0 0; color: var(--sc-text); font-size: .9rem; line-height: 1.6; }
.review-card__comment--muted{ color: var(--sc-muted); font-style: italic; }
.no-reviews{
  margin: var(--sc-space-5) 0 0; padding: var(--sc-space-5);
  text-align: center; color: var(--sc-muted); font-size: .92rem;
  border: 1px dashed var(--sc-border); border-radius: var(--sc-radius-md);
}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width: 980px){
  .pdp{ padding: 0 var(--sc-space-4) var(--sc-space-7); }
  .pdp-hero{ grid-template-columns: 1fr; gap: var(--sc-space-5); }
  .pdp-buybox{ position: static; }
  .pdp-detail{ grid-template-columns: 1fr; }
}

@media (max-width: 900px){
  /* La barra sticky toma el relevo del boton principal */
  .pdp-stickybar{ display: flex; }
  body.has-pdp-stickybar{ padding-bottom: 76px; }
}

@media (max-width: 620px){
  .pdp{ padding: 0 var(--sc-space-3) var(--sc-space-6); }
  .pdp-crumb b{ max-width: 180px; }
  .pdp-frame{ border-radius: var(--sc-radius-md); }
  .pdp-frame__nav{ width: 36px; height: 36px; }
  .pdp-thumb{ width: 62px; height: 62px; }
  .pdp-assurances{ grid-template-columns: 1fr; }
  .pdp-buybox{ padding: var(--sc-space-4); }
  .pdp-panel{ padding: var(--sc-space-4); }
  .pdp-spec{ grid-template-columns: 1fr; gap: 2px; padding: 10px var(--sc-space-2); }
  .pdp-spec dt{ font-size: .78rem; }
  .reviews-head{ flex-direction: column; align-items: stretch; }
  .reviews-scorecard{ min-width: 0; }
  .pdp-related__grid{ grid-template-columns: repeat(auto-fill, minmax(155px, 1fr)); gap: var(--sc-space-3); }
}
