/* v09 · mejoras UX acordadas con Luis (29/10). Se carga después de cro.css y reviews.css. */

/* Respuestas neutras: el amarillo solo aparece al elegir (antes parecía ya marcada) */
#main .opt,#main .opt[data-value="no"]{background:var(--tile);color:var(--ink);font-weight:600}
#main .opt:hover,#main .opt[data-value="no"]:hover{background:var(--tile-press)}
#main .opt:active,#main .opt[aria-pressed="true"],#main .opt[data-value="no"]:active,#main .opt[data-value="no"][aria-pressed="true"]{background:var(--accent);color:var(--ink)}
#main .opt small,#main .opt[aria-pressed="true"] small,#main .opt:active small{color:var(--ink-soft)}

/* Banner de cookies compacto: texto y botones en una franja baja */
.cookies{padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom));font-size:13px;line-height:1.4}
.cookies .in{display:flex;align-items:center;gap:14px}
.cookies .in p{flex:1;min-width:0}
.cookies .row{margin-top:0;flex:none;gap:8px}
.cookies button{flex:none;min-height:44px;padding:0 18px;font-size:15px}
@media(max-width:520px){
  .cookies .in{flex-direction:column;align-items:stretch;gap:8px}
  .cookies .row{flex:1}
  .cookies button{flex:1}
}

/* Escritorio: más escala para que no quede pequeño en pantallas grandes */
@media(min-width:1100px){
  .wrap{max-width:560px}
  .top .wrap{height:72px}
  .top .logo{height:42px;width:auto}
  .step{padding-top:56px}
  h2{font-size:36px}
  .lead{font-size:19px}
  .hint{font-size:16px}
  #main .opt{height:72px;min-height:72px;font-size:19px}
  .cp{height:76px;font-size:32px}
  .cta{min-height:64px;font-size:20px}
  body.reviews-inline:has(.step[data-step="propietario"].active) #main>.wrap{max-width:1120px}
  .reviews-inline .step[data-step="propietario"].active{grid-template-columns:minmax(0,520px) minmax(0,460px);gap:0 80px}
  .reviews-inline .step[data-step="propietario"] h1{font-size:48px}
  .reviews-inline .hero-q{font-size:22px}
  .step[data-step="propietario"]>.proof{font-size:16px}
  .step[data-step="contacto"] h2{font-size:36px}
  .step[data-step="contacto"] .lead{font-size:18px}
  #form .field label{font-size:16px}
  #form .input{height:56px;font-size:18px}
  #form .cta{min-height:60px;font-size:20px}
  .cookies .in{max-width:960px}
}
