/* Page Noms de domaine (/noms-de-domaines), 20/10/2026 : fiche IA de la page 150466 (« contenu et mise en page validés »).
   Seulement ce qui est propre à cette page : le reste vient de ad-socle.css et ad-composants.css.
   Sections d'après la fiche : ouverture (texte à gauche, domaine relié au site et aux emails à droite, dessin sans texte) ;
   choisir (deux colonnes, sans cartes) ; extensions (trois blocs, extensions en grand) ; technique (courte, sans schéma) ;
   contrôle (cinq prestations à pictogramme discret) ; interlocuteur (bande de nuit, planète pour lampe) ; fin d'encre. */

/* ouverture */
.ad-dom-ouverture { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.ad-dom-tete { display: grid; gap: var(--ad-e-5); justify-items: start; }
.ad-dom-tete > p { margin: 0; }
.ad-dom-titre { text-wrap: balance; }
.ad-dom-chapeau { max-width: 36em; text-wrap: pretty; }
.ad-dom-pour { max-width: 38em; text-wrap: pretty; }
.ad-dom-tete .ad-actions { margin-top: var(--ad-e-2); }
.ad-dom-visuel { width: 100%; max-width: 480px; justify-self: end; }
.ad-dom-dessin { display: block; width: 100%; height: auto; }
.ad-dom-dessin .d-adresse { fill: var(--ad-surface); stroke: var(--ad-texte); stroke-width: 2; }
.ad-dom-dessin .d-globe { fill: none; stroke: var(--ad-texte); stroke-width: 2; }
.ad-dom-dessin .d-trait { fill: none; stroke: var(--ad-texte); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.ad-dom-dessin .d-surligne { fill: var(--ad-c-soleil-pale); }   /* le surlignage pâle d'un détail (charte §1.2) : le nom lui-même */
.ad-dom-dessin .d-barre-forte { fill: var(--ad-texte); opacity: .78; }
.ad-dom-dessin .d-barre { fill: var(--ad-filet-fort); }
.ad-dom-dessin .d-lien { fill: none; stroke: var(--ad-filet-fort); stroke-width: 2; stroke-linecap: round; }
.ad-dom-dessin .d-point-lien { fill: var(--ad-texte); }
.ad-dom-dessin .d-cadre { fill: var(--ad-surface); stroke: var(--ad-filet-fort); stroke-width: 1; }
.ad-dom-dessin .d-filet { stroke: var(--ad-filet); stroke-width: 1; }
.ad-dom-dessin .d-point { fill: var(--ad-filet-fort); }
.ad-dom-dessin .d-enveloppe { fill: var(--ad-surface); stroke: var(--ad-texte); stroke-width: 2.5; }

/* deux colonnes : le titre et son propos à gauche, le développement à droite (choisir, technique) */
.ad-dom-duo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.ad-dom-duo__tete, .ad-dom-duo__corps { display: grid; gap: var(--ad-e-4); align-content: start; }
.ad-dom-duo__tete > *, .ad-dom-duo__corps > * { margin: 0; }
.ad-dom-duo .ad-titre-2 { text-wrap: balance; }
.ad-dom-duo__corps > p { max-width: 62ch; text-wrap: pretty; }
.ad-dom-intro { font-weight: 600; margin: 0; }

/* les questions à se poser : une liste à filets, pas des cartes */
.ad-dom-questions { list-style: none; margin: 0; padding: 0; display: grid; border-top: 1px solid var(--ad-filet-fort); }
.ad-dom-questions > li { padding-block: var(--ad-e-4); border-bottom: 1px solid var(--ad-filet-fort); text-wrap: pretty; }

/* phrase mise en avant : la voix du titrage, l'accent en pastille-planète de 10 px (jamais de filet jaune) */
.ad-dom-encart { position: relative; margin: var(--ad-e-2) 0 0; padding: var(--ad-e-4) var(--ad-e-5) var(--ad-e-4) calc(var(--ad-e-5) + 18px);
  border-radius: var(--ad-r-2); background: var(--ad-surface); box-shadow: inset 0 0 0 1px var(--ad-filet);
  font-family: var(--ad-police-titre); font-size: var(--ad-t-titre-4); line-height: 1.4; font-weight: 560; color: var(--ad-texte); text-wrap: pretty; max-width: 62ch; }
.ad-dom-encart::before { content: ""; position: absolute; left: var(--ad-e-5); top: calc(var(--ad-e-4) + .7em - 5px); width: 10px; height: 10px; border-radius: 50%; background: var(--ad-planete); }

/* extensions : la réponse en titrage, trois blocs, l'extension en grand */
.ad-dom-reponse { margin: 0; font-family: var(--ad-police-titre); font-size: var(--ad-t-titre-3); font-weight: 560; letter-spacing: -0.01em; }
.ad-dom-extensions { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ad-e-6); }
.ad-dom-extension { display: grid; gap: var(--ad-e-3); align-content: start; padding-top: var(--ad-e-5); border-top: 2px solid var(--ad-texte); }
.ad-dom-extension__nom { margin: 0; font-family: var(--ad-police-titre); font-size: clamp(2.5rem, 2rem + 2vw, 3.75rem); line-height: 1; font-weight: 560; letter-spacing: -0.03em; }
.ad-dom-extension p { margin: 0; max-width: 32ch; text-wrap: pretty; }
.ad-dom-suite { display: grid; gap: var(--ad-e-4); margin-top: clamp(40px, 5vw, 64px); }
.ad-dom-suite > p { margin: 0; max-width: 62ch; text-wrap: pretty; }

/* contrôle : cinq prestations, pictogramme discret, une colonne à filets (cinq éléments sur deux colonnes en laissaient un seul) */
.ad-dom-services { list-style: none; margin: var(--ad-e-4) 0 0; padding: 0; display: grid; max-width: 820px; }
.ad-dom-services > li:last-child { border-bottom: 1px solid var(--ad-filet-fort); }
.ad-dom-services > li { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--ad-e-4); align-items: start; padding-block: var(--ad-e-4);
  border-top: 1px solid var(--ad-filet-fort); text-wrap: pretty; }
.ad-dom-services > li > .bi { font-size: 1.25rem; line-height: 1.5; color: var(--ad-texte-doux); }
.ad-dom-objectif { margin: var(--ad-e-6) 0 0; max-width: 62ch; }

/* interlocuteur (nuit) : le titre et la planète pour lampe à gauche, le propos et le lien à droite */
.ad-dom-nuit { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.ad-dom-nuit__tete { display: grid; gap: var(--ad-e-5); justify-items: start; }
.ad-dom-nuit__tete .ad-titre-2 { margin: 0; text-wrap: balance; }
.ad-dom-lampe { width: 214px; }   /* DESIGN §6 : lampe 214 px, 168 sous 1 100, 150 sous 960 ; anneau clair par les rôles de nuit */
.ad-dom-lampe svg { display: block; width: 100%; height: auto; }
.ad-dom-nuit__corps { display: grid; gap: var(--ad-e-4); }
.ad-dom-nuit__corps > p { margin: 0; max-width: 58ch; text-wrap: pretty; }
.ad-dom-lien { margin-top: var(--ad-e-3) !important; font-weight: 600; }
.ad-dom-lien a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .ad-dom-lien .bi { transition: transform .15s ease; }
  .ad-dom-lien a:hover .bi { transform: translateX(3px); }
}

/* fin */
#contact .ad-titre-2 { text-wrap: balance; }
#contact .ad-fonction__texte p { max-width: 62ch; }

@media (max-width: 1100px) {
  .ad-dom-lampe { width: 168px; }
}
@media (max-width: 960px) {
  .ad-dom-ouverture, .ad-dom-duo, .ad-dom-nuit { grid-template-columns: minmax(0, 1fr); }
  .ad-dom-visuel { justify-self: start; max-width: 420px; }
  .ad-dom-extensions { grid-template-columns: minmax(0, 1fr); gap: var(--ad-e-5); }
  .ad-dom-lampe { width: 150px; }
}
@media (max-width: 640px) {
  .ad-dom-visuel { max-width: 320px; }
}