:root{font-family:Arial,Helvetica,sans-serif;color:#080808;background:#ffdebf}*{box-sizing:border-box}body{margin:0}header{display:flex;align-items:center;gap:18px;justify-content:space-between;padding:18px 3%;font-size:clamp(16px,2.1vw,28px)}.home{background:white;border:2px solid black;border-radius:20px;padding:10px 16px;cursor:pointer;font-weight:800}main{max-width:1500px;margin:auto;padding:0 2.4% 28px}.hero,.choices button{background:#748bf6;border:0;border-radius:28px}.hero{min-height:280px;padding:30px;display:flex;align-items:center;justify-content:space-between}.hero h1{font-size:clamp(25px,3.1vw,48px);line-height:1.25;margin:0}.hero p,.choices p{color:white;font-size:clamp(18px,2.1vw,28px);font-weight:700;line-height:1.4}.sign{font-size:120px;margin:0 5%}.choices{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}.choices button{padding:24px;text-align:left;cursor:pointer;min-height:250px}.choices button:hover,.choices button:focus-visible{outline:5px solid #243acb}.choices h2{font-size:clamp(23px,2.5vw,38px);margin:0}.choices p{margin-bottom:0}footer{text-align:center;font-size:24px;font-weight:800;padding:18px}.toolbar{background:#748bf6;padding:20px;border-radius:24px;margin-bottom:14px}.toolbar h1{font-size:clamp(24px,3vw,36px);margin:0}.toolbar p{color:white;font-size:17px;font-weight:700}.controls{display:flex;flex-wrap:wrap;gap:10px}.controls input,.controls select{padding:13px;border-radius:14px;border:2px solid #333;font-size:16px;flex:1;min-width:190px}.layout{display:grid;grid-template-columns:1fr 1fr;gap:16px}#map{height:72vh;min-height:450px;border:3px solid #fff;border-radius:20px;position:sticky;top:10px}.results{max-height:72vh;overflow:auto}.school{background:#fff;border-radius:18px;padding:18px;margin-bottom:12px;border-left:8px solid #748bf6}.school h2{font-size:23px;margin:0 0 6px}.school p,.school li{font-size:16px;line-height:1.5}.school a{display:inline-block;color:#12269d;font-weight:bold;margin:6px 8px 4px 0}.school .trip{background:#162d87;color:white;padding:12px;border-radius:12px;text-decoration:none}.flag{display:inline-block;background:#ffe377;border-radius:20px;padding:5px 10px;font-weight:800}.pending{color:#87431d;font-weight:700}.notice{font-size:15px;line-height:1.5}.legend{background:white;padding:8px;border-radius:8px}@media(max-width:800px){header{gap:8px;font-size:15px}header span{white-space:nowrap}.sign{display:none}.choices,.layout{grid-template-columns:1fr}.choices button{min-height:190px}#map{position:relative;height:370px;min-height:370px}.results{max-height:none}.hero{min-height:220px}.hero p{font-size:18px}}@media print{header .home,#map,.controls,.trip{display:none!important}.layout{display:block}.results{max-height:none}.school{break-inside:avoid;border:1px solid black}body{background:white}}
.sign{flex:0 0 auto;width:clamp(155px,23vw,300px);margin:0 3%;display:flex;align-items:center;justify-content:center}.sign img{display:block;width:100%;height:auto;mix-blend-mode:multiply}@media(max-width:800px){.sign{display:flex;width:clamp(105px,25vw,180px);margin:0 0 0 12px}.hero{gap:12px}}@media(max-width:480px){.hero{flex-direction:column;align-items:flex-start}.sign{align-self:center;width:150px;margin:0}}


/* Accueil fidèle à la maquette fournie (1649 × 928). */
body:has(#welcome:not([hidden])) header .home{display:none}
body:has(#welcome:not([hidden])) header{padding:22px 1.6% 16px;font-size:clamp(23px,2.45vw,41px);gap:12px}
body:has(#welcome:not([hidden])) header strong{margin-right:auto}
body:has(#welcome:not([hidden])) main{max-width:none;padding:0 2.35% 0}
#welcome .hero{min-height:0;aspect-ratio:1562 / 374;padding:1.1%;border-radius:29px;gap:15px}
#welcome .hero h1{font-size:clamp(25px,3.05vw,51px);line-height:1.42;letter-spacing:-.025em}
#welcome .hero p{font-size:clamp(19px,2.08vw,35px);line-height:1.38;margin:5px 0 0}
#welcome .sign{width:clamp(170px,23vw,365px);margin:0 5.5% 0 0;flex-shrink:0}
#welcome .sign img{mix-blend-mode:multiply}
#welcome .choices{gap:2%;margin-top:1.7%}
#welcome .choices button{min-height:0;aspect-ratio:765 / 369;padding:2.2%;border-radius:29px}
#welcome .choices h2{font-size:clamp(23px,3vw,51px);letter-spacing:-.035em;line-height:1.2}
#welcome .choices p{font-size:clamp(18px,2.08vw,35px);line-height:1.4;margin:9px 0 0}
#welcome footer{font-size:clamp(23px,2.35vw,40px);padding:18px 0 5px}
@media(max-width:900px){#welcome .hero{aspect-ratio:auto;min-height:260px;padding:20px}#welcome .hero h1{font-size:clamp(23px,3.3vw,35px)}#welcome .hero p{font-size:clamp(17px,2.5vw,24px)}#welcome .sign{width:clamp(120px,25vw,220px);margin:0}#welcome .choices button{aspect-ratio:auto;min-height:230px;padding:20px}#welcome .choices h2{font-size:clamp(24px,3vw,32px)}#welcome .choices p{font-size:clamp(18px,2.4vw,23px)}}
@media(max-width:650px){body:has(#welcome:not([hidden])) header{padding:18px 4%;font-size:clamp(17px,4.6vw,26px)}body:has(#welcome:not([hidden])) main{padding:0 4%}#welcome .hero{flex-direction:column;align-items:flex-start;gap:10px}#welcome .hero h1{font-size:clamp(23px,5vw,32px);line-height:1.25}#welcome .hero p{font-size:18px}#welcome .sign{align-self:center;width:165px}#welcome .choices{grid-template-columns:1fr;gap:14px;margin-top:14px}#welcome .choices button{min-height:0;padding:25px}#welcome .choices h2{font-size:27px}#welcome .choices p{font-size:19px}#welcome footer{font-size:22px}}

/* Illustration originale conservée sans filtre de fusion ni changement de teinte. */
#welcome .sign img{mix-blend-mode:normal!important;object-fit:contain;background:transparent}

/* Accueil ajusté à la hauteur visible, sans défilement sur écrans usuels. */
@media screen and (min-width: 901px){
 body:has(#welcome:not([hidden])){height:100dvh;overflow:hidden}
 body:has(#welcome:not([hidden])) header{height:9dvh;min-height:0;padding:1vh 1.6%;font-size:clamp(21px,2.4vw,40px)}
 body:has(#welcome:not([hidden])) main{height:91dvh;padding-bottom:0}
 #welcome{height:100%;display:flex;flex-direction:column;gap:2.4vh;min-height:0}
 #welcome .hero{height:43%;flex:0 0 43%;aspect-ratio:auto;min-height:0;padding:1.1%}
 #welcome .hero h1{font-size:clamp(22px,min(3vw,5.1vh),51px);line-height:1.36}
 #welcome .hero p{font-size:clamp(17px,min(2.06vw,3.7vh),35px);line-height:1.3}
 #welcome .sign{width:min(23vw,34vh,365px)}
 #welcome .choices{height:42%;flex:0 0 42%;min-height:0;margin-top:0;gap:2%}
 #welcome .choices button{height:100%;min-height:0;aspect-ratio:auto;padding:2.2%;overflow:hidden}
 #welcome .choices h2{font-size:clamp(21px,min(3vw,5vh),51px)}
 #welcome .choices p{font-size:clamp(16px,min(2.08vw,3.65vh),35px);line-height:1.33}
 #welcome footer{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;font-size:clamp(20px,2.35vw,40px);padding:0}
}
/* Sur les petits écrans, conserver la lisibilité plutôt que rogner le contenu. */
@media screen and (max-width:900px){body:has(#welcome:not([hidden])){overflow-y:auto}}
@media screen and (min-width:651px) and (max-width:900px){
 body:has(#welcome:not([hidden])) header{padding:10px 2%;font-size:clamp(20px,2.7vw,26px)}
 #welcome .hero{min-height:0;padding:14px}
 #welcome .choices button{min-height:0;padding:15px}
 #welcome .choices p{font-size:clamp(16px,2.1vw,20px)}
 #welcome footer{padding:8px 0}
}

/* Consultation : seul le bouton Accueil est affiché en haut. */
body:has(#explore:not([hidden])) header{padding:10px 2.4%;justify-content:flex-start;min-height:0}
body:has(#explore:not([hidden])) header strong,body:has(#explore:not([hidden])) header span{display:none}
body:has(#explore:not([hidden])) main{max-width:none;padding:0 2.4% 20px}
#explore .toolbar{background:transparent;padding:0;margin:0 0 10px;border-radius:0}
#explore .toolbar h1,#explore .toolbar>p{display:none}
#explore .controls{margin:0 0 10px}
#explore .layout{align-items:start}
#explore .results{scrollbar-gutter:stable}
@media(max-width:800px){body:has(#explore:not([hidden])) header{padding:8px 4%}body:has(#explore:not([hidden])) main{padding:0 4% 20px}#explore .layout{gap:12px}}

.college-pin{background:#fff;border:3px solid #172a63;border-radius:50%;box-shadow:0 2px 8px #0006;text-align:center;font-size:26px;line-height:36px}.college-label{font-weight:800;color:#172a63;border:2px solid #172a63;background:#fff;white-space:nowrap;font-size:12px}

/* Carte schématique responsive */
#map{height:auto!important;min-height:430px;overflow:hidden;background:#fff7ed;border-radius:22px;display:flex;flex-direction:column;align-self:start}#map svg{width:100%;height:auto;display:block}.map-city-list{padding:12px 18px 18px;display:flex;flex-direction:column;gap:5px;font-size:14px;color:#28304c}.map-city-list strong{font-size:17px}

/* Navigation : un seul écran actif, même lorsque les styles d’accueil définissent display:flex. */
#welcome[hidden], #explore[hidden] {display:none!important}
body:has(#explore:not([hidden])) {height:auto!important;overflow:auto!important}
body:has(#explore:not([hidden])) header strong {display:block!important;font-size:clamp(17px,2vw,26px)}
body:has(#explore:not([hidden])) header span {display:none}
body:has(#explore:not([hidden])) header {align-items:center;gap:18px}
body:has(#explore:not([hidden])) .controls {margin-top:4px}
body:has(#explore:not([hidden])) .controls #search {flex:2;min-width:min(100%,320px)}
@media(min-width:801px){#explore .layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}#explore #map{position:sticky;top:12px}#explore .results{max-height:calc(100dvh - 155px);overflow-y:auto}}
@media(max-width:800px){body:has(#explore:not([hidden])) header strong{font-size:16px!important}#explore .results{max-height:none;overflow:visible}}

/* En-tête identique sur toutes les vues */
header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;background:#ffdebf;min-height:76px}header .home{justify-self:start}header strong{justify-self:center;text-align:center}header span{justify-self:end;text-align:right;font-weight:700}@media(max-width:600px){header{grid-template-columns:auto 1fr auto;padding:12px 2%;gap:8px}header strong{font-size:clamp(13px,3.5vw,20px)}header span{font-size:clamp(12px,3vw,17px)}header .home{padding:8px 10px}}

/* En-tête identique sur l'accueil et les deux cartes */
body header, body:has(#welcome:not([hidden])) header, body:has(#explore:not([hidden])) header {display:grid!important;grid-template-columns:minmax(110px,1fr) minmax(0,2fr) minmax(110px,1fr)!important;align-items:center!important;justify-content:initial!important;gap:12px!important;min-height:74px!important;height:auto!important;padding:12px 2.4%!important;font-size:clamp(17px,2.1vw,28px)!important;background:#ffdebf!important}
body header .home, body:has(#welcome:not([hidden])) header .home, body:has(#explore:not([hidden])) header .home{display:inline-block!important;justify-self:start!important;margin:0!important}
body header strong, body:has(#welcome:not([hidden])) header strong, body:has(#explore:not([hidden])) header strong{display:block!important;justify-self:center!important;text-align:center!important;margin:0!important;font-size:inherit!important}
body header span, body:has(#welcome:not([hidden])) header span, body:has(#explore:not([hidden])) header span{display:block!important;justify-self:end!important;text-align:right!important;font-size:inherit!important;white-space:nowrap!important}
@media(max-width:600px){body header,body:has(#welcome:not([hidden])) header,body:has(#explore:not([hidden])) header{grid-template-columns:auto minmax(0,1fr) auto!important;gap:7px!important;padding:10px 2%!important;font-size:clamp(12px,3vw,16px)!important;min-height:62px!important}body header .home{font-size:12px;padding:7px 9px!important}}