/* B elegida: borde animado y relleno suave. A queda disponible en el comparador.
   Sólo cambian estas variables; estructura, borde y tamaños son comunes. */
:root {
  --inicio-primary-fill: linear-gradient(135deg, #60465d99, #3a2a40e6 52%, #51384b99);
  --inicio-primary-text: #f4edf7;
  --inicio-primary-shadow: inset 0 1px 1px #f3dce738, 0 0 26px -12px #d3a3b688;
  --inicio-button-height: 54px;
  --inicio-button-radius: 17px;
  --inicio-button-fill: linear-gradient(#30253bd9, #30253bd9);
}
[data-button-option='a'] {
  --inicio-primary-fill: linear-gradient(135deg, #d7b0c5, #e4c3d3 50%, #c7a4bf);
  --inicio-primary-text: #382634;
  --inicio-primary-shadow: inset 0 1px 1px #fff6ed99, inset 0 -1px 1px #66465555;
}
.cromo-night .inicio-button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: var(--inicio-button-height);
  border-radius: var(--inicio-button-radius);
  padding: 13px 18px;
  border: 1px solid transparent;
  color: var(--cream);
  font: 500 13px/1.3 'DM Sans', sans-serif;
  background: var(--inicio-button-fill) padding-box,
    linear-gradient(135deg, #eee2fccc, #9b79b033 38%, #e0c6f2aa 74%, #9880ac55) border-box;
  box-shadow: inset 0 1px 0 #ffffff24, inset 0 -1px 1px #08040dbb;
  text-align: left;
  text-decoration: none;
  backdrop-filter: blur(14px);
}
.inicio-button .button-label { flex: 1; }
.inicio-button .arrow { margin-left: auto; font-size: 20px; }
.inicio-button .inicio-icon, .inicio-button > svg {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.cromo-night .inicio-button-primary {
  color: var(--inicio-primary-text);
  background: var(--inicio-primary-fill) padding-box,
    linear-gradient(135deg, #fff5ee, #ac829e77 38%, #fff5ee 74%, #b58aa9) border-box;
  box-shadow: var(--inicio-primary-shadow);
}
.inicio-button:hover { filter: brightness(1.08); }
.inicio-button:focus-visible { outline: 2px solid #edc0d1; outline-offset: 4px; }
.inicio-button:disabled {
  cursor: not-allowed;
  opacity: .6;
  filter: none;
}
.inicio-button:disabled::after { animation: none; }
.cromo-night .inicio-button-small {
  --inicio-button-height: 44px;
  padding: 10px 15px;
  font-size: 12px;
}
.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}
.hero-actions .inicio-button { flex: 1 1 210px; max-width: 280px; }
.query-glass.inicio-button { min-height: var(--inicio-button-height); }
.reviews-section { margin-top: 30px; padding-bottom: 30px; border-bottom: 1px solid var(--line); }
.reviews-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.google-rating { display: flex; align-items: center; gap: 16px; }
.google-rating strong { font-family: var(--font-display); font-size: 70px; font-weight: 450; letter-spacing: -.04em; }
.stars { display: block; color: #d8b9ce; font-size: 13px; letter-spacing: 3px; }
.google-label { display: block; font-size: 11px; color: var(--muted); margin-top: 5px; }
.reviews-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; margin-top: 26px; }
.review-slot { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.review-slot { min-height: 104px; }
.review-slot[hidden], .review-pause[hidden] { display: none; }
.reviews-footer { display: flex; justify-content: space-between; gap: 20px; margin-top: 12px; }
.review-cta, .review-pause { display: inline-flex; align-items: center; min-height: 44px; color: var(--muted); font: inherit; font-size: 12px; background: none; border: 0; padding: 0; }
.review-pause { cursor: pointer; }
.review-pause[aria-pressed="true"] { color: var(--cream); text-decoration: underline; }
.review-pause:focus-visible, .review-cta:focus-visible { outline: 2px solid #edc0d1; outline-offset: 4px; }
@media (prefers-reduced-motion: no-preference) {
  .review-slot:not([hidden]) { animation: resena-entrada .45s ease-out; }
}
@keyframes resena-entrada { from { opacity: 0; } to { opacity: 1; } }
.review-slot blockquote { margin: 0 0 10px; color: var(--cream); }
.review-slot figcaption a { display: inline-flex; align-items: center; min-height: 44px; }
.review-slot[data-pending] { display: grid; align-content: start; gap: 6px; }
.review-number { font-size: 10px; color: var(--cream); }
/* Cinco accesos: dos pares y un cierre de ubicación a todo el ancho. */
.objects-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.object { overflow: clip; }
/* La ilustración tiene su propia zona: nunca puede pintar detrás del título. */
.object-art { position: absolute; inset: 104px 0 0; overflow: clip; }
.hero-headline .headline-rose { color: #e4c3d3; }
.object.map-object { grid-column: 1 / -1; min-height: 270px; }
.object .object-art picture { display: contents; }
.object .object-art .hand-drawing.trama-drawing,
.object.map-object .object-art .hand-drawing.trama-drawing {
  position: absolute;
  display: block;
  width: 100%;
  height: auto;
  max-width: none;
  left: 0;
  bottom: 0;
  margin: 0;
  translate: none;
  clip-path: none;
  object-fit: initial;
  filter: none;
  pointer-events: none;
  animation: none;
}
.object .object-art .hand-drawing.trama-drawing[hidden] { display: none; }
.object .object-heading { position: relative; z-index: 3; }
.object.map-object .object-art { inset: 0; }
.social-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
@media (max-width: 900px) {
  .hero-actions { flex-direction: column; }
  .hero-actions .inicio-button { flex: auto; width: 100%; max-width: none; }
}
@media (max-width: 650px) {
  .hero-actions { margin: 25px auto 0; width: min(100%, 340px); gap: 10px; }
  .reviews-section { margin-top: 23px; padding-bottom: 24px; }
  .reviews-heading { gap: 12px; }
  .google-rating { gap: 10px; }
  .google-rating strong { font-size: 64px; }
  .stars { font-size: 10px; letter-spacing: 1px; }
  .reviews-heading .inicio-button { padding-inline: 12px; gap: 8px; font-size: 11px; }
  .reviews-grid { gap: 14px; margin-top: 22px; grid-template-columns: 1fr; grid-auto-rows: minmax(112px, auto); }
  .review-slot { border-top: 1px solid var(--line); padding: 12px 0 0; }
  .review-slot[data-pending] { display: flex; justify-content: space-between; align-items: baseline; font-size: 11px; }
  .objects-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .object.map-object { min-height: 250px; }
  .object .object-art, .object.map-object .object-art { inset: 88px 0 0; }
  .object .object-art .hand-drawing.trama-drawing { width: 150%; left: -25%; }
  .object.map-object .object-art .hand-drawing.trama-drawing { width: 100%; left: 0; }
  .social-row { gap: 10px; }
  .social-row .inicio-button-small { flex: 1 1 130px; }
  .social-row .inicio-button-small:last-child { flex-basis: 100%; }
}
