/* Asphares — Assaphir */
:root{
  --nuit:#101B33;
  --encre:#1B2A4E;
  --or:#B08A4A;
  --or-clair:#D9BC84;
  --chaux:#F7F3EA;
  --pierre:#ECE4D6;
  --texte:#1F2433;
  --texte-doux:#596075;
  --focus:#2F6FD6;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Outfit",system-ui,-apple-system,"Segoe UI",sans-serif;
  /* crépuscule méditerranéen : sert de fond tant qu'une photo manque */
  --crepuscule:linear-gradient(180deg,#0E1A33 0%,#23305A 38%,#7A5A6E 62%,#D59A62 76%,#2A3F66 77%,#0E1A33 100%);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--chaux);color:var(--texte);font:400 17px/1.6 var(--sans)}
img{max-width:100%;display:block}
a{color:var(--encre)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.wrap{width:min(1180px,100% - 32px);margin-inline:auto}
.lisible{max-width:62ch}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.05;margin:0;color:var(--encre)}
h2{font-size:clamp(36px,5.2vw,58px)}
h3{font-size:26px}
p{margin:0 0 1em}

/* ---------- ouverture plein écran ---------- */
.ouverture{position:relative;min-height:100svh;color:var(--chaux);display:flex;flex-direction:column;
  background:linear-gradient(180deg,rgba(10,18,36,.55) 0%,rgba(10,18,36,.05) 35%,rgba(10,18,36,.25) 60%,rgba(10,18,36,.92) 100%),var(--photo,none) center/cover no-repeat,var(--crepuscule)}
.barre{display:flex;align-items:center;justify-content:space-between;padding:22px 0}
.marque{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--chaux);font-family:var(--serif);font-size:21px;letter-spacing:.03em}
.marque img{width:34px;height:auto}
.barre nav a{color:var(--chaux);text-decoration:none;font-size:15px;margin-left:24px;text-shadow:0 1px 8px rgba(0,0,0,.35)}
.barre nav a:hover{text-decoration:underline;text-underline-offset:4px}
.ouverture .bas{margin-top:auto;padding:0 0 64px}
.titre{font-family:var(--serif);font-weight:400;font-size:clamp(84px,17vw,220px);line-height:.84;margin:0;color:#FBF7EE;text-shadow:0 2px 30px rgba(0,0,0,.25)}
.chapeau{font-family:var(--serif);font-size:clamp(23px,2.8vw,32px);line-height:1.28;max-width:32ch;margin:22px 0 0;color:#FBF7EE}
.ouverture .actions{margin-top:30px}
@media (prefers-reduced-motion:no-preference){
  .titre,.chapeau,.ouverture .actions{animation:lever 1.2s cubic-bezier(.2,.7,.2,1) both}
  .chapeau{animation-delay:.25s}.ouverture .actions{animation-delay:.45s}
  @keyframes lever{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
}

/* ---------- boutons ---------- */
.actions{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-block;background:var(--encre);color:var(--chaux);border:0;border-radius:999px;padding:15px 28px;font:500 16px var(--sans);text-decoration:none;cursor:pointer}
.btn:hover{background:var(--nuit)}
.btn.or{background:var(--or);color:#141B2C}
.btn.or:hover{background:var(--or-clair)}
.btn.clair{background:transparent;color:var(--encre);box-shadow:inset 0 0 0 1.5px var(--encre)}
.btn.clair:hover{background:var(--encre);color:var(--chaux)}
.btn.verre{background:rgba(247,243,234,.12);color:var(--chaux);box-shadow:inset 0 0 0 1.5px rgba(247,243,234,.6);backdrop-filter:blur(6px)}
.btn.verre:hover{background:rgba(247,243,234,.22)}

/* ---------- sections ---------- */
.section{padding:96px 0}
.section.suite{padding-top:0}
.intro-section{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:20px 40px;margin-bottom:36px}
.intro-section p{color:var(--texte-doux);max-width:46ch;margin:0}

/* ---------- mosaïque des escales ---------- */
.mosaique{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:240px;gap:14px}
.escale{position:relative;border-radius:18px;overflow:hidden;color:#FBF7EE;text-decoration:none;display:flex;flex-direction:column;justify-content:flex-end;padding:22px;
  background:linear-gradient(180deg,rgba(10,18,36,0) 35%,rgba(10,18,36,.82) 100%),var(--photo,none) center/cover no-repeat,var(--fond,var(--crepuscule))}
.escale.grande{grid-column:span 2;grid-row:span 2;padding:32px}
.escale h3{color:#FBF7EE;font-size:34px;margin:0}
.escale.grande h3{font-size:clamp(48px,6vw,76px)}
.escale .ligne{font-size:15px;opacity:.92;margin:4px 0 0;line-height:1.4}
.escale .etat-escale{position:absolute;top:18px;left:18px;font-size:13px;padding:5px 12px;border-radius:999px;background:rgba(10,18,36,.45);backdrop-filter:blur(4px)}
.escale.ouverte .etat-escale{background:var(--or);color:#141B2C;font-weight:500}
a.escale:hover h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px}
.escale.athenes{--fond:linear-gradient(160deg,#2B3E66,#C9925A 70%,#E8C38B)}
.escale.istanbul{--fond:linear-gradient(160deg,#3A2C55,#9A5B6E 60%,#E3A06C)}
.escale.tanger{--fond:linear-gradient(160deg,#1F4E6B,#3E8A9A 55%,#E9D3A6)}
.escale.rome{--fond:linear-gradient(160deg,#5A3A2E,#B8704A 55%,#EBC79A)}
.escale.barcelone{--fond:linear-gradient(160deg,#1E3F73,#3F86B8 55%,#F1C27D)}
.escale.marseille{--fond:linear-gradient(160deg,#173B5C,#2F7FA8 55%,#F2E2C2)}
.escale.carthage{--fond:linear-gradient(160deg,#1C4F8C,#3F8FC0 55%,#E4D3A8)}
.escale.beyrouth{--fond:linear-gradient(160deg,#145A5A,#3C9C92 55%,#E6D6B4)}
.escale.dubrovnik{--fond:linear-gradient(160deg,#1E5466,#3A97A0 55%,#E58A4E)}
.escale.alexandrie{--fond:linear-gradient(160deg,#4A3B2A,#B08A4A 55%,#E9DCC0)}
@media (min-width:901px){.escale.etiree{grid-column:span 2}}
@media (max-width:900px){.mosaique{grid-template-columns:repeat(2,1fr);grid-auto-rows:220px}}
@media (max-width:520px){
  .mosaique{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:78%;grid-auto-rows:340px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}
  .escale,.escale.grande{grid-column:auto;grid-row:auto;scroll-snap-align:start}
  .escale.grande h3{font-size:52px}
}

/* ---------- citation ---------- */
.citation{background:var(--nuit);color:var(--chaux);padding:110px 0;text-align:center}
.citation blockquote{margin:0 auto;max-width:24ch;font-family:var(--serif);font-style:italic;font-size:clamp(32px,4.6vw,54px);line-height:1.18;color:#FBF7EE}
.citation figcaption{margin-top:22px;color:#AEB6C8;font-size:15px}
.citation figure{margin:0}

/* ---------- ce qu'est un Asphares ---------- */
.piliers{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:44px;border-top:1px solid var(--or);padding-top:28px}
.piliers h3{font-size:25px;margin-bottom:8px}
.piliers p{color:var(--texte-doux);font-size:16px;margin:0}
@media (max-width:820px){.piliers{grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.piliers{grid-template-columns:1fr}}

/* ---------- Athènes en vedette ---------- */
.vedette{background:var(--pierre)}
.vedette .grille{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.vedette .image{aspect-ratio:4/5;border-radius:22px;background:var(--photo,none) center/cover no-repeat,linear-gradient(160deg,#2B3E66,#C9925A 70%,#E8C38B)}
@media (max-width:860px){.vedette .grille{grid-template-columns:1fr;gap:32px}.vedette .image{aspect-ratio:4/3}}
.question{font-family:var(--serif);font-style:italic;font-size:clamp(28px,3.6vw,40px);line-height:1.2;color:var(--encre);margin:16px 0 22px}
.fiche{margin:26px 0 0;display:grid;grid-template-columns:auto 1fr;gap:10px 22px;border-left:2px solid var(--or);padding-left:22px}
.fiche dt{color:var(--texte-doux);font-size:15px}
.fiche dd{margin:0;font-weight:500}
.vedette .actions{margin-top:30px}

/* ---------- formulaire ---------- */
.demande{background:var(--nuit);color:var(--chaux)}
.demande h2{color:var(--chaux)}
.demande .lead{color:#C9CFDC}
form{display:grid;gap:18px;margin-top:32px;max-width:680px}
fieldset{border:0;padding:0;margin:0}
legend,.champ>span{display:block;font-size:15px;font-weight:500;margin-bottom:8px;color:var(--chaux)}
.champ input,.champ select,.champ textarea{width:100%;padding:14px;border-radius:10px;border:1px solid #3A4A6E;background:#1A2848;color:var(--chaux);font:400 17px var(--sans)}
.champ textarea{min-height:110px;resize:vertical}
.deux{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:560px){.deux{grid-template-columns:1fr}}
.choix{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.choix label{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid #3A4A6E;border-radius:10px;cursor:pointer;line-height:1.35}
.choix label.large{grid-column:1/-1}
.choix label:has(input:checked){border-color:var(--or-clair);background:#1F3058}
.choix input{accent-color:var(--or-clair);margin-top:3px;width:18px;height:18px;flex:none}
.choix small{display:block;color:#AEB6C8}
@media (max-width:560px){.choix{grid-template-columns:1fr}}
.accord{display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.45}
.accord input{width:20px;height:20px;flex:none;margin-top:2px;accent-color:var(--or-clair)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.demande .btn{justify-self:start}
.demande .btn[disabled]{opacity:.6;cursor:wait}
.etat{min-height:1.5em;font-size:16px;margin:0}
.etat.ok{color:var(--or-clair)}
.etat.err{color:#F2A9A0}
details.donnees{max-width:680px;margin-top:28px;border-top:1px solid #3A4A6E;padding-top:14px;color:#C9CFDC;font-size:15px}
details.donnees summary{cursor:pointer;color:var(--chaux)}

/* ---------- pied ---------- */
.pied{background:var(--nuit);color:#AEB6C8;font-size:14px;padding:30px 0 44px;border-top:1px solid #26365A}
.pied .wrap{display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;align-items:center}
.pied a{color:#D8DCE6}
.pied .liens{display:flex;gap:20px;flex-wrap:wrap}

/* ---------- page d'une édition ---------- */
.jours{list-style:none;margin:36px 0 0;padding:0}
.jours li{display:grid;grid-template-columns:160px 1fr;gap:24px;padding:24px 0;border-top:1px solid #D6CCBA}
.jours .jour{color:var(--or);font-family:var(--serif);font-size:23px}
.jours h3{font-size:26px;margin-bottom:4px}
.jours p{margin:0;color:var(--texte-doux)}
@media (max-width:560px){.jours li{grid-template-columns:1fr;gap:4px}}
.ateliers{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 32px;margin-top:36px}
.ateliers .lieu{color:var(--or);font-size:15px;margin:0}
.ateliers h3{font-size:25px;margin:2px 0 8px}
.ateliers p{color:var(--texte-doux);font-size:16px;margin:0}
@media (max-width:820px){.ateliers{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.ateliers{grid-template-columns:1fr}}
.inclus{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:36px;margin-top:36px}
.inclus ul{margin:0;padding-left:18px;color:var(--texte-doux)}
.inclus li{margin-bottom:6px}
@media (max-width:820px){.inclus{grid-template-columns:1fr}}
.prix{display:grid;grid-template-columns:1fr 1fr;gap:36px;margin-top:36px}
.prix .montant{font-family:var(--serif);font-size:68px;line-height:1;color:var(--encre);margin:6px 0}
.prix .barre-prix{color:var(--texte-doux);margin:0}
@media (max-width:640px){.prix{grid-template-columns:1fr}}
.recit{font-family:var(--serif);font-size:clamp(23px,2.6vw,28px);line-height:1.45;color:var(--encre)}
.bandeau{height:min(62vh,560px);background:linear-gradient(180deg,rgba(10,18,36,0) 60%,rgba(10,18,36,.35)),var(--photo,none) center/cover no-repeat,linear-gradient(160deg,#2B3E66,#C9925A 70%,#E8C38B)}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
.demande .jours li{border-top-color:rgba(244,239,230,.18)}
.demande .jours h3{color:var(--chaux)}
.demande .jours p{color:#C9CFDC}

/* ---------- page Athènes ---------- */
.reperes{background:var(--nuit);color:var(--chaux)}
.reperes dl{display:grid;grid-template-columns:repeat(4,1fr);margin:0 auto;padding:26px 0}
.reperes dl>div{padding:4px 24px;border-left:1px solid rgba(247,243,234,.16)}
.reperes dl>div:first-child{border-left:0;padding-left:0}
.reperes dt{color:var(--or-clair);font-size:14px}
.reperes dd{margin:2px 0 0;font-family:var(--serif);font-size:25px;line-height:1.2}
@media (max-width:760px){.reperes dl{grid-template-columns:1fr 1fr;gap:18px 0}.reperes dl>div:nth-child(3){border-left:0;padding-left:0}}

.gage-grille{display:grid;grid-template-columns:5fr 6fr;gap:64px;align-items:start}
.question-gage{font-style:italic;font-weight:400;font-size:clamp(40px,5.4vw,68px);line-height:1.02}
@media (max-width:860px){.gage-grille{grid-template-columns:1fr;gap:28px}}

.programme{background:var(--pierre)}
.frise{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:28px;position:relative}
.frise::before{content:"";position:absolute;left:0;right:0;top:46px;border-top:1px solid #CDBF9F}
.frise li{position:relative}
.frise .date{display:flex;align-items:baseline;gap:10px;margin:0 0 26px;color:var(--texte-doux);font-size:15px}
.frise .date span{font-family:var(--serif);font-size:62px;line-height:.8;color:var(--or);background:var(--pierre);padding-right:10px}
.frise h3{font-size:27px;margin-bottom:8px}
.frise p:not(.date){color:var(--texte-doux);font-size:16px;margin:0}
.note-prog{margin-top:40px;color:var(--texte-doux)}
@media (max-width:900px){
  .frise{grid-template-columns:1fr;gap:0}
  .frise::before{display:none}
  .frise li{display:grid;grid-template-columns:96px 1fr;column-gap:8px;padding:0 0 30px}
  .frise .date{flex-direction:column;gap:4px;margin:0;grid-row:span 2;align-items:flex-start}
  .frise .date span{font-size:50px;padding:0 0 6px}
}

.lieux{background:var(--nuit);color:#C9CFDC}
.lieux h2,.lieux h3{color:var(--chaux)}
.lieu-ligne{display:grid;grid-template-columns:7fr 5fr;gap:56px;align-items:center;margin-top:64px}
.lieu-ligne img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:20px}
.lieu-ligne.inverse img{order:2}
.lieu-ligne h3{font-size:34px;margin:4px 0 10px}
.lieu-ligne h3+p+h3{margin-top:26px}
.lieux .lieu{color:var(--or-clair);font-size:15px;margin:0}
.lieux-fin{display:grid;grid-template-columns:1fr 1fr;gap:56px;margin-top:72px;padding-top:44px;border-top:1px solid rgba(247,243,234,.14)}
.lieux-fin h3{font-size:30px;margin:4px 0 10px}
@media (max-width:860px){.lieu-ligne{grid-template-columns:1fr;gap:22px;margin-top:48px}.lieu-ligne.inverse img{order:0}.lieux-fin{grid-template-columns:1fr;gap:32px}}

.odeon{min-height:min(88vh,760px);display:flex;align-items:flex-end;color:var(--chaux);
  background:linear-gradient(180deg,rgba(10,18,36,.1) 30%,rgba(10,18,36,.85) 100%),var(--photo,none) center/cover no-repeat,var(--nuit)}
.odeon .wrap{padding:0 0 72px}
.odeon-texte{font-family:var(--serif);font-size:clamp(34px,4.6vw,58px);line-height:1.08;max-width:22ch;margin:0 0 14px;color:#FBF7EE}
.odeon-note{margin:0;color:#D8DCE6}

.petit{color:var(--texte-doux);font-size:16px}
.non-compris{margin-top:36px}
.prix-section{background:var(--pierre)}
.carte-prix{background:var(--chaux);border-radius:20px;padding:34px 34px 26px}
.carte-prix.fondateur{background:var(--encre);color:#C9CFDC}
.carte-prix.fondateur .montant{color:var(--or-clair)}
.carte-prix.fondateur .barre-prix,.carte-prix.fondateur .petit{color:#C9CFDC}
.carte-prix:not(.fondateur) .montant{color:var(--texte-doux)}
.infos-prix{margin-top:36px}

@media (max-width:600px){.barre nav a:not(:last-child){display:none}}