/* Composition retenue : illustration du Vallon, services et portrait légendé. */
.site-complete .hero { background: #f9f5ed; }
.site-complete .hero-grid { grid-template-columns: minmax(0, .98fr) minmax(0, 1.02fr); gap: clamp(1rem, 3.4vw, 3.25rem); padding-block: clamp(3.6rem, 7vw, 6.5rem); }
.site-complete .hero h1 { font-size: clamp(3.1rem, 5.9vw, 5.65rem); text-wrap: balance; }
.site-complete .hero h1 em { margin-top: .1em; }
.hero-vallon-art { min-width: 0; width: 100%; align-self: center; }
.hero-vallon { --stamp-green: #286650; --paper-size: 1.32; width: 100%; height: auto; overflow: visible; }
.hero-vallon .paper-size { transform-box: fill-box; transform-origin: center; transform: scale(var(--paper-size)); }
.hero-vallon .origin-sheets { fill: none; stroke: var(--brand-navy); stroke-width: .8; opacity: 0; }
.hero-vallon .thread-bundle { stroke: url(#thread-colour); stroke-width: .95; }
.hero-vallon .leading-thread { stroke: url(#thread-guide-colour); stroke-width: 1.5; opacity: .8; }
.hero-vallon .arrival-mark { stroke: var(--gold-500); stroke-width: 1; opacity: 0; transform-box: fill-box; transform-origin: center; transform: scale(var(--paper-size)); }
.hero-vallon .ground-shadow { fill: var(--brand-navy); opacity: .14; transform-box: fill-box; transform-origin: center; transform: translateY(calc((var(--paper-size) - 1) * 148px)) scaleX(var(--paper-size)); }
.hero-vallon .flying-shadow { fill: var(--brand-navy); opacity: .06; }
.hero-vallon .paper-outline { fill: url(#paper-surface); stroke: var(--brand-navy); stroke-opacity: .72; stroke-width: 1.05; }
.hero-vallon .paper-fold { fill: #eee1cf; fill-opacity: .35; stroke: var(--brand-navy); stroke-opacity: .6; stroke-width: .9; }
.hero-vallon .paper-heading { fill: var(--brand-navy); font: 600 20.5px var(--font-copy); letter-spacing: .025em; }
.hero-vallon .justice-balance { fill: none; stroke: var(--brand-navy); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.hero-vallon .paper-lines { fill: none; stroke: var(--brand-navy); stroke-width: .85; opacity: .68; }
.hero-vallon .paper-footer { fill: none; stroke: var(--gold-500); stroke-width: .9; }
.hero-vallon .arrival-halo { fill: #ffe2a4; stroke: #ffe2a4; stroke-width: 36; stroke-linejoin: round; opacity: 0; }
.hero-vallon .completion-mark { opacity: 0; transform-box: fill-box; transform-origin: center; }
.hero-vallon .completion-mark circle { fill: #e4eee4; stroke: var(--stamp-green); stroke-width: 1.6; }
.hero-vallon .completion-mark path { fill: none; stroke: var(--stamp-green); stroke-width: 3.7; stroke-linecap: round; stroke-linejoin: round; }
.hero-vallon[data-landed] .arrival-halo { opacity: .46; }
.hero-vallon[data-landed] .completion-mark { opacity: 1; }
@media (prefers-reduced-motion: no-preference) {
  .hero-vallon.is-playing[data-landed] .arrival-halo { animation: vallon-halo 1050ms ease-out both; }
  .hero-vallon.is-playing[data-landed] .completion-mark { animation: vallon-stamp 420ms both; }
}
@keyframes vallon-halo { 0% { opacity: 0; } 40% { opacity: .92; } 100% { opacity: .46; } }
@keyframes vallon-stamp {
  0% { opacity: 0; transform: scale(1.48) rotate(-10deg); }
  36% { opacity: 1; transform: scale(.93) rotate(2deg); }
  65% { opacity: 1; transform: scale(1.035) rotate(-1deg); }
  100% { opacity: 1; transform: scale(1) rotate(0); }
}

.site-complete .service-card { min-width: 0; min-height: 0; padding-top: 1.5rem; }
.site-complete .service-scene { width: min(100%, 12rem); height: 7rem; margin: 0 0 1.25rem; color: var(--brand-navy); }
.site-complete .service-card > p { max-width: 35ch; }
.site-complete .service-card .service-examples { margin-top: 0; }
.site-complete .service-card h3 { text-wrap: balance; }
.site-complete :is(.section-heading, .about-copy) h2 { text-wrap: balance; }
.site-complete .service-highlight { margin-top: 1.25rem; padding: .8rem 1rem; border-left: 2px solid var(--gold-500); border-radius: 0 .55rem .55rem 0; background: #eee1cf; }
.site-complete .service-highlight p + p { margin: .25rem 0 0; color: var(--navy-950); font: 600 .94rem/1.5 var(--font-ui); }

.site-complete .values-reperes { max-width: 54rem; }
.site-complete .values-reperes .value-list { list-style: none; margin: 0; padding: 0; }
.site-complete .values-reperes .value-item { align-items: start; }
.site-complete .values-reperes .value-art { background: none; }
.commitments-logo { display: block; width: min(100%, 11rem); height: auto; margin: clamp(1.8rem, 4vw, 3.25rem) auto 0; }
@media (max-width: 640px) {
  .commitments-logo { width: min(100%, 13.75rem); margin-top: 2.5rem; }
}
@media (min-width: 981px) {
  .commitments-logo { width: 60%; }
}
.site-complete .about-grid { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: center; }
.about-portrait { margin: 0 auto; width: 100%; max-width: 26.25rem; }
.about-portrait img { display: block; width: 100%; height: auto; border-radius: 1.4rem 1.4rem 0 0; }
.about-portrait figcaption { padding: clamp(1.1rem, 3vw, 1.8rem); color: var(--cream-50); background: var(--brand-red); border-radius: 0 0 3rem 1.4rem; }
.about-portrait blockquote { margin: 0; font: 400 clamp(1.45rem, 2.45vw, 2.15rem)/1.17 var(--font-copy); }

/* Carte de situation, dans le même bloc que les coordonnées. */
.site-complete .contact-form { align-self: start; min-width: 0; }
.contact-form .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.upload-privacy { margin: 0 0 .4rem; padding: .75rem .85rem; border-left: 2px solid var(--gold-500); background: var(--cream-100); }
.upload-privacy strong, .upload-privacy span { display: block; }
.upload-privacy strong { font: 700 .8rem/1.35 var(--font-ui); color: var(--navy-950); }
.upload-privacy span { margin-top: .2rem; font-size: .95rem; }
.file-feedback { margin: 0; color: var(--red-700); font: 600 .78rem/1.4 var(--font-ui); }
.file-feedback:empty { display: none; }
.file-drop.is-file-target { border-color: var(--red-700); box-shadow: 0 0 0 2px rgba(166, 54, 59, .18); }
.file-drop.is-file-over { border-style: solid; background: #f2e5dc; box-shadow: 0 0 0 3px rgba(166, 54, 59, .28); }
.translation-languages { min-inline-size: 0; margin: 0; padding: .55rem .75rem .35rem; border: 1px solid rgba(16, 42, 61, .28); border-radius: .55rem; font-family: var(--font-ui); }
.translation-languages legend { padding-inline: .2rem; color: var(--navy-950); font-size: .84rem; font-weight: 700; }
.translation-languages p { margin: 0; font-size: .78rem; }
.translation-choices { display: flex; flex-wrap: wrap; gap: 0 1rem; }
.translation-choices label { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.75rem; font-size: .88rem; }
.translation-choices input { width: 1rem; height: 1rem; margin: 0; accent-color: var(--red-700); }
@media (max-width: 640px) { .contact-form .form-grid { grid-template-columns: minmax(0, 1fr); } }
.site-complete .contact-details { margin-bottom: .9rem; }
.site-complete .contact-location { min-width: 0; }
@media (min-width: 981px) {
  .site-complete .contact-grid { grid-template-rows: auto 1fr; row-gap: 0; }
  .site-complete .contact-copy { grid-area: 1 / 1; }
  .site-complete .contact-location { grid-area: 2 / 1; }
  .site-complete .contact-form { grid-area: 1 / 2 / span 2; }
}
@media (min-width: 641px) and (max-width: 980px) {
  .site-complete .contact-grid { row-gap: 0; }
  .site-complete .contact-copy { grid-row: 1; }
  .site-complete .contact-location { grid-row: 2; }
  .site-complete .contact-form { grid-row: 3; margin-top: clamp(2.5rem, 8vw, 7rem); }
}
@media (max-width: 640px) {
  .site-complete .contact-location .contact-details { margin-top: 0; }
}
.laon-map { width: 100%; max-width: 39rem; min-width: 0; margin: 0; container-type: inline-size; font-family: var(--font-ui); }
.laon-graphic { position: relative; isolation: isolate; aspect-ratio: 16 / 9; overflow: hidden; border-radius: .9rem .9rem 2.2rem .9rem; background: #e9eaf0; }
.laon-graphic svg { display: block; width: 100%; height: 100%; }
.laon-lands { fill: #f0e4cf; stroke: #b5a890; stroke-width: 1.1; stroke-linejoin: round; }
.laon-fr { fill: #f9f5ed; }
.laon-spokes { fill: none; stroke: #92713f; stroke-width: 1.2; stroke-dasharray: 2.3 5; stroke-linecap: round; opacity: .8; }
.laon-points { fill: var(--brand-navy); stroke: #f9f5ed; stroke-width: 1.5; }
.laon-halo { fill: var(--brand-red); opacity: .18; }
.laon-point { fill: var(--brand-red); stroke: #f9f5ed; stroke-width: 2; }
.laon-label { position: absolute; left: var(--x); top: var(--y); transform: translateY(-50%); white-space: nowrap; color: var(--brand-navy); font-size: .72rem; font-size: clamp(.72rem, 2.1cqi, .95rem); font-weight: 600; line-height: 1.2; text-shadow: 0 0 4px #f9f5ed, 0 0 5px #f9f5ed; }
.laon-main, .laon-lille, .laon-paris, .laon-luxembourg { transform: translate(-100%, -50%); }
.laon-main { --x: 48.1%; --y: 61.1%; color: #a32e36; background: #f9f5ed; border: 1px solid #dfccaa; border-radius: 999px; padding: .3em .6em; }
.laon-london { --x: 17.5%; --y: 9.2%; }
.laon-lille { --x: 43.5%; --y: 32.8%; }
.laon-brussels { --x: 60.7%; --y: 26.7%; }
.laon-reims { --x: 57.3%; --y: 69.2%; }
.laon-paris { --x: 36.5%; --y: 80%; }
.laon-luxembourg { --x: 97%; --y: 54%; }
.laon-map-time { display: none; color: #74552e; }
.laon-times { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; padding: 0; margin: .6rem 0 0; list-style: none; color: var(--cream-50); font-size: .875rem; }
.laon-times li { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; column-gap: .5rem; border-bottom: 1px solid rgba(247, 240, 229, .2); padding: .4rem 0; }
.laon-times strong { color: var(--gold-300); font-weight: 600; white-space: nowrap; }
.laon-map figcaption { margin-top: .55rem; color: var(--cream-200); font-size: .8rem; }
@container (min-width: 34rem) {
  .laon-map-time { display: inline; }
  /* Conserver la liste pour les lecteurs d’écran, sans doubler les durées à l’écran. */
  .laon-times { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}

@media (min-width: 821px) { .hero-vallon { --paper-size: 1.65; } }
@media (min-width: 1024px) { .hero-vallon { --paper-size: 1.82; } }
@media (min-width: 1280px) {
  .hero-vallon { --paper-size: 2; }
  .hero-vallon-art { transform: translateY(-.6rem); }
}
@media (max-width: 820px) {
  .site-complete .hero-grid { grid-template-columns: minmax(0, 1fr); gap: 1.4rem; }
  .site-complete .hero h1 { max-width: 15ch; font-size: clamp(2.65rem, 9.5vw, 5rem); }
  .hero-vallon-art { max-width: 36rem; justify-self: center; }
  .site-complete .about-grid { grid-template-columns: minmax(0, 1fr); }
  .site-complete .about-copy { grid-row: 1; }
}
@media (max-width: 640px) {
  .site-complete .hero-grid { padding-block: 3rem 2rem; }
  .site-complete .service-scene { height: 6rem; margin-bottom: 1rem; }
}