/* Pages publiques D2 : les textes et les liens restent ceux des pages existantes. */
.hc-design { background: var(--hc-ivoire); color: var(--hc-encre); }
.hc-design :is(.logo, .logo:hover) { color: var(--hc-nuit); }
.hc-design .logo-nom { font-family: var(--hc-police-titre); }
.hc-design .logo-sous { color: var(--hc-texte-secondaire); }
.hc-design :is(.lbl-cuivre, .etape-num) { color: var(--hc-cuivre); }
.hc-design .muted { color: var(--hc-texte-secondaire); }
.hc-design :is(a, button):focus-visible { outline: 2px solid var(--hc-cuivre); outline-offset: 3px; }

/* Navigation et boutons. */
.hc-design .entete { background: var(--hc-ivoire); border-bottom-color: var(--hc-trait); }
.hc-design .entete .conteneur { min-height: 80px; height: auto; padding-top: 12px; padding-bottom: 12px; }
.hc-design .menu a { color: var(--hc-encre); }
.hc-design .menu a:hover { color: var(--hc-cuivre); }
.hc-design .btn { min-height: 44px; height: auto; padding: 10px 18px; border-radius: 12px; font-family: var(--hc-police-texte); text-align: center; white-space: normal; line-height: 1.4; }
.hc-design .btn-lg { min-height: 50px; padding: 12px 22px; }
.hc-design :is(.btn-nuit, a.btn-nuit:hover) { background: var(--hc-nuit); color: var(--hc-blanc); }
.hc-design :is(.btn-cuivre, a.btn-cuivre:hover) { background: var(--hc-cuivre); color: var(--hc-blanc); }
.hc-design :is(.btn-clair, a.btn-clair:hover, .btn-blanc, a.btn-blanc:hover) { background: var(--hc-blanc); border-color: var(--hc-trait); color: var(--hc-nuit); }
.hc-design :is(.btn-contour-nuit, a.btn-contour-nuit:hover) { background: transparent; border-color: var(--hc-cuivre-vif); color: var(--hc-blanc); }
.hc-design :is(.btn-contour, a.btn-contour:hover) { background: transparent; border-color: var(--hc-blanc); color: var(--hc-blanc); }
.hc-design .btn:hover { filter: brightness(1.05); }

/* Accueil. */
.hc-design .hero { background: var(--hc-nuit); }
.hc-design .hero .conteneur { grid-template-columns: minmax(0, 1fr) minmax(0, 420px); gap: clamp(28px, 5vw, 72px); padding-top: 80px; padding-bottom: 88px; }
.hc-design .hero h1 { font-family: var(--hc-police-titre); color: var(--hc-blanc); }
.hc-design .hero-textes > p { color: var(--nuit-texte); }
.hc-design .hero-etiquette { height: auto; min-height: 32px; padding: 6px 13px; background: var(--nuit-2); border: 1px solid var(--nuit-3); color: var(--hc-ivoire); white-space: normal; font-size: 12px; }
.hc-design .hero-etiquette::before { flex: none; background: var(--hc-cuivre-vif); }
.hc-design .hero-garanties { border-top-color: var(--nuit-3); }
.hc-design .hero-garanties span { color: var(--hc-ivoire); }
.hc-design .hero-garanties svg { color: var(--hc-cuivre-vif); }
.hc-design .estimation { border-color: var(--hc-trait); border-radius: var(--hc-rayon); box-shadow: 0 14px 40px rgb(14 26 43 / 12%); }
.hc-design .estimation-titre { font-family: var(--hc-police-titre); color: var(--hc-nuit); }
.hc-design .hero .estimation p:not(.estimation-titre) { color: var(--hc-texte-secondaire); }
.hc-design .estimation .btn-clair { background: var(--hc-ivoire); }
.hc-design .section { padding: 88px 0; }
.hc-design .section-blanche { background: var(--hc-blanc); }
.hc-design .section h2 { color: var(--hc-nuit); }
.hc-design .section-intro { color: var(--hc-texte-secondaire); }
.hc-design :is(.service, .cible, .apercu) { border-color: var(--hc-trait); border-radius: var(--hc-rayon); box-shadow: 0 10px 30px rgb(14 26 43 / 5%); }
.hc-design .service { background: var(--hc-blanc); }
.hc-design .service :is(h3, li), .hc-design .cible strong, .hc-design .atouts strong, .hc-design .etape h3 { color: var(--hc-nuit); }
.hc-design .service :is(p, li), .hc-design .cible span, .hc-design .atouts span, .hc-design .etape p, .hc-design .pro-textes p { color: var(--hc-texte-secondaire); }
.hc-design .service-icone { background: var(--hc-cuivre-clair); color: var(--hc-cuivre); }
.hc-design .service-sombre { background: var(--hc-nuit); border-color: var(--hc-nuit); }
.hc-design .service-sombre :is(h3, li) { color: var(--hc-blanc); }
.hc-design .service-sombre p { color: var(--hc-ivoire); }
.hc-design .service-sombre .service-icone { background: var(--nuit-3); color: var(--hc-cuivre-vif); }
.hc-design .etape { border-top-color: var(--hc-nuit); }
.hc-design .apercu { background: var(--hc-blanc); }
.hc-design .apercu-carte { background: var(--hc-ivoire); }
.hc-design .frise li.fait { color: var(--hc-nuit); }
.hc-design .frise li.fait::before { background-color: var(--hc-nuit); }
.hc-design .frise li.actuel { color: var(--hc-cuivre); }
.hc-design .frise li.actuel::before { background-color: var(--hc-cuivre); }
.hc-design .appel { background: var(--hc-cuivre); border-radius: var(--hc-rayon); }
.hc-design .appel h2, .hc-design .appel p { color: var(--hc-blanc); }

/* Pages d'information et pied de page. */
.hc-design[data-page='devis'] .section, .hc-design[data-page='suivi'] .section { min-height: calc(100vh - 80px); padding: 64px 0 88px; }
.hc-design[data-page='devis'] h1, .hc-design[data-page='suivi'] h1 { margin-top: 8px; color: var(--hc-nuit); font: 500 clamp(2rem, 4vw, 2.7rem)/1.15 var(--hc-police-titre); }
.hc-design .carte-corps { border-color: var(--hc-trait); border-radius: var(--hc-rayon); padding: clamp(22px, 4vw, 32px); background: var(--hc-blanc); box-shadow: 0 10px 30px rgb(14 26 43 / 5%); }
.hc-design .carte-corps h2 { color: var(--hc-nuit); font: 500 1.45rem/1.25 var(--hc-police-titre); }
.hc-design .carte-corps p { line-height: 1.6; }
.hc-design .pied { background: var(--hc-nuit); color: var(--hc-ivoire); }
.hc-design .pied a { color: var(--hc-ivoire); }
.hc-design .pied a:hover { color: var(--hc-cuivre-vif); }
.hc-design .pied .lbl { color: var(--hc-ivoire) !important; }
.hc-design .pied-bas { border-top-color: var(--nuit-3); color: var(--hc-ivoire); }

/* Même famille de carte que la page connexion. */
.hc-design .hc-auth { background: var(--hc-ivoire); }
.hc-design .cp-carte { width: min(100%, 640px); max-width: 640px; padding: clamp(24px, 4vw, 36px); gap: 18px; border: 1px solid var(--hc-trait); border-radius: var(--hc-rayon); background: var(--hc-blanc); box-shadow: 0 14px 40px rgb(14 26 43 / 6%); }
.hc-design .cp-carte h1 { color: var(--hc-nuit); }
.hc-design .cp-carte p { line-height: 1.6; }
.hc-design .cp-carte .hc-auth-marque-sous { color: var(--hc-texte-secondaire); }
.hc-design[data-page='vitrine-compte-pro'] .connexion { padding: 32px 16px; }
.hc-design .cp-carte, .hc-design .cp-carte * { min-width: 0; }
.hc-design .cp-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hc-design .cp-groupe { margin: 0; padding: 0; border: 0; }
.hc-design .cp-groupe legend { margin-bottom: 10px; font-size: 12px; font-weight: 800; }
.hc-design .cp-gammes label { display: inline-flex; align-items: center; gap: 5px; overflow-wrap: anywhere; }
.hc-design .cp-carte .hc-champ small { color: var(--hc-texte-secondaire); }
.hc-design .cp-carte [aria-invalid='true'] { border-color: var(--hc-rouge); outline: 2px solid var(--hc-rouge); }
.hc-design .cp-envoyer { width: 100%; margin-top: 20px; }
.hc-design .cp-carte [hidden] { display: none !important; }
.hc-design .cp-ok { text-align: left; }

@media (max-width: 1080px) {
  .hc-design .hero .conteneur { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .hc-design .entete .conteneur { min-height: 68px; }
  .hc-design .menu:not(.ouvert), .hc-design .entete-actions .btn { display: none; }
  .hc-design .menu.ouvert { top: 68px; background: var(--hc-blanc); border-bottom-color: var(--hc-trait); }
  .hc-design .menu.ouvert a { border-top-color: var(--hc-trait); }
  .hc-design .menu.ouvert .menu-mobile { color: var(--hc-cuivre); }
  .hc-design .bouton-menu { display: inline-flex; color: var(--hc-nuit); }
  .hc-design .hero .conteneur { padding-top: 44px; padding-bottom: 52px; }
  .hc-design .hero h1 { font-size: clamp(2.35rem, 10vw, 3.2rem); }
  .hc-design .hero-boutons .btn { width: 100%; }
  .hc-design .section { padding: 64px 0; }
  .hc-design .section-tete { margin-bottom: 36px; }
  .hc-design .service { padding: 24px; }
  .hc-design .appel { padding: 32px 24px; }
  .hc-design .appel-boutons { width: 100%; }
  .hc-design .appel-boutons .btn { flex: 1 1 100%; }
  .hc-design .pied { padding: 52px 0 32px; }
  .hc-design .pied-colonnes { gap: 32px; }
}
@media (max-width: 400px) {
  .hc-design .logo-nom { font-size: 17px; }
  .hc-design .hero-garanties { gap: 14px; }
  .hc-design .frise li { font-size: 10px; overflow-wrap: anywhere; }
  .hc-design .cp-carte { padding: 22px; }
}
@media (max-width: 640px) {
  .hc-design .cp-grille { grid-template-columns: minmax(0, 1fr); }
}

/* Commande publique sans compte. */
.hc-design[data-page='commander'] .commande-page { padding: 64px 0 88px; }
.commande-conteneur { max-width: 820px; display: flex; flex-direction: column; gap: 24px; }
.commande-conteneur h1 { margin: 8px 0 12px; color: var(--hc-nuit); font: 500 clamp(2rem, 4vw, 2.7rem)/1.15 var(--hc-police-titre); }
.commande-conteneur > div > p { color: var(--hc-texte-secondaire); line-height: 1.6; }
.commande-etape { padding: clamp(20px, 4vw, 36px); border: 1px solid var(--hc-trait); border-radius: var(--hc-rayon); background: var(--hc-blanc); box-shadow: 0 10px 30px rgb(14 26 43 / 5%); }
.commande-etape[hidden], .commande-conteneur [hidden] { display: none !important; }
.commande-etape h2 { margin: 4px 0 24px; color: var(--hc-nuit); font: 500 1.65rem/1.2 var(--hc-police-titre); }
.commande-etape h2:focus { outline: none; }
.commande-numero { color: var(--hc-cuivre); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.commande-choix { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; }
.commande-choix label { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 14px; border: 1px solid var(--hc-trait); border-radius: 12px; cursor: pointer; }
.commande-grille { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.commande-large { grid-column: 1 / -1; }
.commande-groupe { min-width: 0; margin: 0 0 24px; padding: 0; border: 0; }
.commande-groupe legend { margin-bottom: 14px; color: var(--hc-nuit); font-weight: 800; }
.commande-etape .hc-champ small { color: var(--hc-texte-secondaire); line-height: 1.45; }
.commande-etape [aria-invalid='true'] { border-color: var(--hc-rouge); outline: 2px solid var(--hc-rouge); }
.commande-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 26px; }
.commande-erreur { margin-top: 18px; }
.commande-note { margin-top: 18px; color: var(--hc-texte-secondaire); font-size: 14px; line-height: 1.5; }
.commande-prestations { display: grid; gap: 12px; }
.commande-prestations label { display: flex; gap: 12px; padding: 14px; border: 1px solid var(--hc-trait); border-radius: 12px; cursor: pointer; }
.commande-prestations label input { align-self: start; margin-top: 3px; }
.commande-prestations label span { display: grid; gap: 4px; }
.commande-prestations small { color: var(--hc-texte-secondaire); line-height: 1.4; }
.commande-prix { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px; margin-top: 18px; padding: 18px; border-radius: 12px; background: var(--hc-ivoire); }
.commande-prix strong { color: var(--hc-nuit); font-size: 1.5rem; }
.commande-regles { padding: 18px; border: 1px solid var(--hc-trait); border-radius: 12px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.commande-regles dl { margin: 0; }
.commande-regles dt { font-weight: 800; }
.commande-regles dd { margin: 0 0 10px; }
.commande-accepte { display: flex; align-items: start; gap: 10px; margin-top: 20px; font-weight: 700; }
.commande-accepte input { margin-top: 4px; }
#commande-resultat .hc-bouton { margin: 8px 0; }
@media (max-width: 600px) {
  .hc-design[data-page='commander'] .commande-page { padding: 40px 0 64px; }
  .commande-grille { grid-template-columns: minmax(0, 1fr); }
  .commande-actions .hc-bouton { flex: 1 1 100%; }
  .commande-choix { flex-direction: column; }
}
