/* Pages du simulateur (borne, tableau, rénovation, dépannage) alignées sur la page d'accueil :
   fond blanc, cartes et photo en gris du site #f1f1f4 aux coins de 14px avec la même ombre nette,
   titres en graisse 500, bleu du site #178bff. Chargé en dernier : ne contient que ces réglages communs. */

/* Fond blanc (comme l'accueil) ; la bannière du haut se fond dans le blanc */
.site-hero-wrap { --site-hero-end: #fff; }
.pq-wrap, .pq-eyebrow-wrap { background: #fff; }
.pq-wrap { padding-bottom: 120px; }

/* Photo : carte grise aux mêmes coins et à la même ombre que les photos du carrousel de l'accueil */
.pq-photo-box { background: #f1f1f4; border-radius: 14px; box-shadow: 0 1px 2px rgba(0,0,0,.06), 0 6px 14px rgba(0,0,0,.08); }

/* Titre de chaque étape : même style que les phrases-titres de l'accueil */
.pq-title { font-size: clamp(2rem, 2.6vw, 2.75rem); font-weight: 500; letter-spacing: -.035em; line-height: 1.15; }
.pq-label { font-weight: 600; }

/* Choix : cartes aux coins de 14px ; sélection dans la couleur de la rubrique, en léger (demande explicite,
   retour design) au lieu d'un gros contour noir */
.pq-opt, .pq-wall { border-radius: 14px; }
/* Petit retour au clic (demande explicite) : évite l'effet "bim" trop sec sur les cartes et boutons */
.pq-opt, .pq-wall, .pq-next, .pq-back, .pq-cable-back { transition: transform .12s ease, border-color .15s ease, background .15s ease, filter .15s ease; }
.pq-opt:active, .pq-wall:active, .pq-next:not(:disabled):active { transform: scale(.97); }
.pq-opt.is-selected { background: color-mix(in srgb, var(--rub, #178bff) 8%, #fff); border-color: var(--rub, #178bff); }
.pq-opt.is-selected .pq-radio { border-color: var(--rub, #178bff); }
.pq-wall.is-selected { background: color-mix(in srgb, var(--rub, #178bff) 8%, #fff); border-color: var(--rub, #178bff); color: var(--rub, #178bff); }

/* Champs de saisie : mêmes coins arrondis que les choix */
.pq-wrap input[type=text], .pq-wrap input[type=tel], .pq-wrap input[type=email], .pq-wrap textarea, .pq-wrap select, .pq-address-list { border-radius: 12px; }

/* Récapitulatif : carte grise (la page est blanche), bleu du site */
.pq-box { background: #f1f1f4; border-radius: 14px; }
.pq-box-title { color: #178bff; }
.pq-estimate-value { font-weight: 700; }

/* Couleur de la rubrique (--rub, --rub-fonce posées sur <body> de chaque page) : bouton principal (la bannière et la fumée du haut restent grises).
   Rubriques : bornes vert, rénovation terracotta, tableau anthracite, dépannage bordeaux (mêmes teintes que sur l'accueil). */
.pq-next { background: var(--rub, #178bff); color: var(--rub-text, #fff); } /* --rub-text : texte foncé si la couleur de rubrique est claire (beige) */
.pq-next:not(:disabled):hover { filter: brightness(1.1); }

@media (min-width: 901px) {
  /* Deux colonnes pour les choix doubles (Oui / Non, Noir / Blanc…) et les longues listes (7 choix et plus) */
  .pq-options:has(> .pq-opt:nth-child(2):last-child), .pq-options:has(> .pq-opt:nth-child(7)) { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
}

@media (max-width: 900px) {
  .pq-wrap { padding-bottom: 60px; }
  /* Mobile : à l'étape des coordonnées (récapitulatif), la photo du haut ne sert plus → masquée */
  .pq-wrap:has(.pq-step[data-step="contact"].is-current) .pq-photo-box { display: none !important; }
  .pq-title { font-size: 1.75rem; }
}

/* Estimations : plus de fondu gris en haut de page — fond blanc uni, logo et menu en noir (data-nav-light sur le menu de chaque page) */
.site-hero-wrap { background: #fff !important; }
.site-hero-smoke { display: none; }
