/* ============================================================
   TOKENS
   ============================================================ */
:root{
  --gold:#C9A84C;
  --gold-light:#E8D5A3;
  --gold-dark:#8B6914;
  --sand:#F5ECD7;
  --obsidian:#0D0D0D;
  --obsidian-light:#1A1A1A;
  --obsidian-mid:#2A2522;
  --smoke:#3D3730;
  --ivory:#FAF6EE;
  --text-light:#C8BCA8;
  --blue-nile:#4A9EBF;
  --serif:'Cormorant Garamond',serif;
  --sans:'Josefin Sans',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--obsidian);
  color:var(--text-light);
  font-family:var(--sans);
  font-weight:300;
  font-size:15px;
  line-height:1.7;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;border:none;background:none;color:inherit;cursor:pointer}
::selection{background:var(--gold);color:var(--obsidian)}

/* ============================================================
   PRIMITIVES
   ============================================================ */
.eyebrow{font-size:.6rem;letter-spacing:.4em;text-transform:uppercase;color:var(--gold);font-weight:300;display:inline-block}
.section-line{width:60px;height:1px;background:var(--gold);opacity:.6;margin:1.25rem auto 2.5rem}
h1,h2,h3,h4{font-family:var(--serif);font-weight:300;color:var(--ivory);line-height:1.15}
h2{font-size:clamp(2rem,4vw,3.2rem);text-align:center;letter-spacing:.01em}
h3{font-size:clamp(1.6rem,2.6vw,2.2rem)}
em,i{font-style:italic}
p{text-wrap:pretty}
section{padding:7rem 6vw;position:relative}
.container{max-width:1280px;margin:0 auto}
.s-head{text-align:center;margin-bottom:4rem}
.s-head h2 i, h1 i{color:var(--gold-light)}

/* ============================================================
   PAGE HEADER (non-hero pages)
   ============================================================ */
.page-head{
  padding:11rem 6vw 5rem;text-align:center;position:relative;
  background:radial-gradient(ellipse at 50% 0%, rgba(201,168,76,.08), transparent 60%), var(--obsidian);
  border-bottom:1px solid rgba(201,168,76,.08);
}
.page-head h1{font-size:clamp(2.4rem,5.5vw,4.4rem);margin:1rem 0 .5rem;font-weight:300}
.page-head .lead{font-family:var(--serif);font-style:italic;font-size:1.15rem;color:var(--text-light);max-width:640px;margin:1.25rem auto 0;line-height:1.6}
.page-head .section-line{margin-top:1.4rem}

.back-link{
  position:absolute;top:6.5rem;left:6vw;
  font-size:.6rem;letter-spacing:.32em;text-transform:uppercase;color:var(--text-light);
  display:inline-flex;align-items:center;gap:.6rem;transition:color .3s;
}
.back-link:hover{color:var(--gold)}

/* ============================================================
   NAVIGATION
   ============================================================ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:200;height:64px;
  display:flex;align-items:center;justify-content:space-between;padding:0 6vw;
  background:rgba(13,13,13,.6);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(201,168,76,.08);
  transition:background .35s ease,border-color .35s ease;
}
.nav.scrolled, .nav.always-solid{background:rgba(13,13,13,.97);border-bottom-color:rgba(201,168,76,.16)}
.nav-logo{font-family:var(--serif);font-size:1.05rem;color:var(--gold);letter-spacing:.18em;font-weight:400}
.nav-logo span{color:var(--ivory);opacity:.8;margin:0 .4em}
.nav-links{display:flex;gap:1.8rem;align-items:center}
.nav-links a{font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--text-light);font-weight:300;position:relative;padding:.4rem 0;transition:color .3s}
.nav-links a:hover, .nav-links a.active{color:var(--gold)}
.nav-links a::after{content:'';position:absolute;bottom:0;left:0;height:1px;width:0;background:var(--gold);transition:width .35s ease}
.nav-links a:hover::after, .nav-links a.active::after{width:100%}
.nav-burger{display:none;flex-direction:column;gap:5px;width:26px;cursor:pointer;padding:8px 0}
.nav-burger span{height:1px;background:var(--gold);transition:.3s;display:block}

@media (max-width:1100px){
  .nav-links{position:fixed;inset:64px 0 auto 0;flex-direction:column;gap:0;padding:1rem 0;background:rgba(13,13,13,.98);border-bottom:1px solid rgba(201,168,76,.1);transform:translateY(-120%);transition:transform .4s ease;z-index:199}
  .nav-links.open{transform:translateY(0)}
  .nav-links a{padding:1rem 6vw;width:100%}
  .nav-burger{display:flex}
}

/* ============================================================
   HERO (index)
   ============================================================ */
.hero{height:100vh;min-height:640px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:0 6vw;text-align:center}
.hero-bg{
  position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(ellipse at 50% 80%, rgba(201,168,76,.18), transparent 55%),
    linear-gradient(180deg,#1a0f00 0%, #0d0d0d 100%),
    url('../photos/IMG20260416184028.jpg') center/cover no-repeat;
  background-blend-mode:overlay,normal,normal;
  filter:saturate(.85) contrast(1.05);
  animation:slowzoom 22s ease-in-out infinite alternate;
}
.hero-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg, rgba(13,13,13,.35) 0%, rgba(13,13,13,.15) 40%, rgba(13,13,13,.95) 100%)}
@keyframes slowzoom{from{transform:scale(1.05)}to{transform:scale(1.14)}}
.hero-inner{position:relative;z-index:2;max-width:920px}
.hero h1{font-size:clamp(3.2rem,8vw,7rem);font-weight:300;letter-spacing:.005em;color:var(--ivory);margin:1.5rem 0 1.2rem}
.hero h1 i{color:var(--gold-light);font-weight:300}
.hero-sub{font-family:var(--serif);font-size:clamp(1rem,1.6vw,1.25rem);letter-spacing:.18em;color:var(--text-light);text-transform:uppercase;font-weight:300}
.hero-sub b{color:var(--gold);font-weight:400;margin:0 .35em}
.hero-arrow{position:absolute;bottom:9rem;left:50%;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:.6rem;font-size:.6rem;letter-spacing:.4em;color:var(--gold);text-transform:uppercase;cursor:pointer;animation:bounce 2s ease-in-out infinite}
.hero-arrow svg{stroke:var(--gold);width:14px;height:22px}
@keyframes bounce{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,8px)}}
.hero-stats{position:absolute;bottom:0;left:0;right:0;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(201,168,76,.18);background:rgba(13,13,13,.55);backdrop-filter:blur(8px)}
.hero-stats .stat{padding:1.4rem 1rem;text-align:center;border-right:1px solid rgba(201,168,76,.12)}
.hero-stats .stat:last-child{border-right:none}
.hero-stats .num{font-family:var(--serif);font-size:2rem;color:var(--gold-light);display:block;line-height:1;margin-bottom:.4rem}
.hero-stats .lbl{font-size:.6rem;letter-spacing:.35em;text-transform:uppercase;color:var(--text-light);opacity:.8}
@media (max-width:680px){.hero-arrow{bottom:11rem}.hero-stats .num{font-size:1.4rem}.hero-stats .stat{padding:1rem .4rem}.hero-stats .lbl{font-size:.5rem;letter-spacing:.25em}}

/* ============================================================
   INDEX — section explorer grid
   ============================================================ */
.explorer{padding:7rem 6vw 8rem}
.explorer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;max-width:1280px;margin:0 auto}
.ex-card{
  position:relative;display:block;overflow:hidden;
  aspect-ratio:4/5;
  background:#1a1410;
  border:1px solid rgba(201,168,76,.15);
  cursor:pointer;
  transition:border-color .35s ease;
}
.ex-card:hover{border-color:rgba(201,168,76,.45)}
.ex-card .bg{
  position:absolute;inset:0;background-size:cover;background-position:center;
  filter:saturate(.9) brightness(.92);
  transition:transform .9s ease,filter .9s ease;
}
.ex-card:hover .bg{transform:scale(1.08);filter:saturate(1.1) brightness(1.05)}
.ex-card::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,13,13,0) 0%, rgba(13,13,13,.1) 45%, rgba(13,13,13,.88) 100%);pointer-events:none}
.ex-card .body{position:absolute;inset:auto 0 0 0;padding:2rem 1.8rem;z-index:2}
.ex-card .num{font-family:var(--serif);font-size:.85rem;color:var(--gold);letter-spacing:.32em;display:block;margin-bottom:.5rem;font-weight:400}
.ex-card .ttl{font-family:var(--serif);font-size:1.85rem;color:var(--ivory);font-weight:400;line-height:1.1;margin-bottom:.65rem;letter-spacing:.005em}
.ex-card .ttl i{color:var(--gold-light)}
.ex-card .desc{font-size:.78rem;color:var(--text-light);line-height:1.6;opacity:.9;max-width:90%}
.ex-card .arrow{
  position:absolute;top:1.75rem;right:1.75rem;
  width:34px;height:34px;border:1px solid rgba(201,168,76,.4);
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:var(--gold);font-size:.85rem;
  transition:background .35s ease,color .35s ease,transform .45s ease;z-index:2;
}
.ex-card:hover .arrow{background:var(--gold);color:var(--obsidian);transform:rotate(-25deg)}
@media (max-width:980px){.explorer-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.explorer-grid{grid-template-columns:1fr}.ex-card{aspect-ratio:5/4}}

.intro{padding:7rem 6vw 0;text-align:center;max-width:820px;margin:0 auto}
.intro p{font-family:var(--serif);font-style:italic;font-size:1.4rem;color:var(--text-light);line-height:1.55;margin-top:1.6rem}

/* ============================================================
   ITINERAIRE
   ============================================================ */
.timeline{position:relative;max-width:1100px;margin:0 auto;padding:1rem 0}
.timeline::before{content:'';position:absolute;top:0;bottom:0;left:50%;width:1px;background:linear-gradient(180deg,transparent 0%,rgba(201,168,76,.4) 12%,rgba(201,168,76,.4) 88%,transparent 100%)}
.tl-item{position:relative;width:50%;padding:1.4rem 3rem;display:flex;justify-content:flex-end}
.tl-item:nth-child(even){margin-left:50%;justify-content:flex-start}
.tl-item .dot{position:absolute;top:2.4rem;right:-7px;width:14px;height:14px;border-radius:50%;border:1.5px solid var(--gold);background:var(--obsidian);transition:all .35s ease;cursor:pointer}
.tl-item:nth-child(even) .dot{right:auto;left:-7px}
.tl-item .card{background:var(--obsidian-mid);border:1px solid rgba(201,168,76,.12);padding:1.5rem 1.6rem;width:100%;max-width:430px;border-radius:2px;cursor:pointer;transition:border-color .4s ease,transform .4s ease;display:block}
.tl-item:hover .card{border-color:rgba(201,168,76,.42);transform:translateY(-2px)}
.tl-item:hover .dot{background:var(--gold);box-shadow:0 0 0 5px rgba(201,168,76,.18),0 0 18px rgba(201,168,76,.6)}
.tl-item .day-no{font-size:.55rem;letter-spacing:.35em;text-transform:uppercase;color:var(--gold)}
.tl-item .place{font-family:var(--serif);font-size:1.4rem;color:var(--ivory);margin:.4rem 0 .55rem;font-weight:400}
.tl-item .date{font-size:.65rem;letter-spacing:.2em;color:var(--gold-light);text-transform:uppercase;margin-bottom:.7rem;display:block;opacity:.85}
.tl-item .summary{font-size:.78rem;color:var(--text-light);line-height:1.75}
@media (max-width:780px){
  .timeline::before{left:18px}
  .tl-item, .tl-item:nth-child(even){width:100%;margin-left:0;padding:1rem 0 1rem 3rem;justify-content:flex-start}
  .tl-item .dot, .tl-item:nth-child(even) .dot{left:11px;right:auto;top:1.8rem}
  .tl-item .card{max-width:none}
}

/* ============================================================
   JOURNAL
   ============================================================ */
.day{padding:5.5rem 6vw;border-top:1px solid rgba(201,168,76,.08)}
.day:nth-of-type(even){background:rgba(26,26,26,.55)}
.day-grid{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:5fr 7fr;gap:4rem;align-items:start}
.day:nth-of-type(even) .day-grid{grid-template-columns:7fr 5fr}
.day:nth-of-type(even) .day-text{order:2}
.day:nth-of-type(even) .day-photos{order:1}
.day-text .eyebrow{margin-bottom:1rem}
.day-text h3{margin-bottom:1.2rem;font-style:italic}
.day-text h3 b{font-style:normal;font-weight:400;color:var(--gold-light)}
.day-text p{font-size:.9rem;line-height:1.95;margin-bottom:1.1rem;color:var(--text-light)}
.day-text p:first-of-type::first-letter{font-family:var(--serif);font-size:3.4rem;color:var(--gold);float:left;line-height:.85;padding:.3rem .55rem 0 0;font-weight:400}
.day-photos{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}
.day-photos .ph{position:relative;overflow:hidden;background:#191512;aspect-ratio:4/3;cursor:pointer;border:1px solid rgba(201,168,76,.06)}
.day-photos .ph.full{grid-column:1/-1;aspect-ratio:16/9}
.day-photos .ph img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease, filter .8s ease;filter:contrast(1.1) saturate(1.22) brightness(1.02) sepia(.1)}
.day-photos .ph:hover img{transform:scale(1.04);filter:contrast(1.06) saturate(1.4) brightness(1.06) sepia(.03)}
.day-photos .ph::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(13,13,13,.5));pointer-events:none}
.day-empty{background:var(--obsidian-mid);border:1px solid rgba(201,168,76,.1);padding:3rem 2rem;text-align:center;color:var(--text-light);font-family:var(--serif);font-style:italic;font-size:1.05rem;height:100%;display:flex;align-items:center;justify-content:center;min-height:220px}
@media (max-width:880px){
  .day-grid, .day:nth-of-type(even) .day-grid{grid-template-columns:1fr;gap:2rem}
  .day:nth-of-type(even) .day-text{order:1}
  .day:nth-of-type(even) .day-photos{order:2}
}

/* ============================================================
   GALERIE / BEST OF
   ============================================================ */
.galerie-wrap{background:#080808}
.masonry{columns:3;column-gap:.75rem;max-width:1280px;margin:0 auto}
.masonry .m-item{break-inside:avoid;margin-bottom:.75rem;position:relative;cursor:pointer;overflow:hidden;background:#1a1410;border:1px solid rgba(201,168,76,.05)}
.masonry .m-item img{width:100%;display:block;transition:transform .7s ease,filter .7s ease;filter:contrast(1.12) saturate(1.2) brightness(1.01) sepia(.1)}
.masonry .m-item:hover img{transform:scale(1.03);filter:contrast(1.06) saturate(1.38) brightness(1.05) sepia(.02)}
.masonry .m-item::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(201,168,76,.12) 100%);opacity:0;transition:opacity .5s ease;pointer-events:none}
.masonry .m-item:hover::after{opacity:1}
@media (max-width:880px){.masonry{columns:2}}
@media (max-width:480px){.masonry{columns:1}}

.bestof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;max-width:1280px;margin:0 auto}
.bo{position:relative;aspect-ratio:1/1;overflow:hidden;cursor:pointer;background:#1a1410;border:1px solid rgba(201,168,76,.08)}
.bo img{width:100%;height:100%;object-fit:cover;filter:saturate(.75) brightness(.72) contrast(1.12) sepia(.15);transition:transform .9s ease,filter .9s ease}
.bo:hover img{transform:scale(1.08);filter:saturate(1.25) brightness(1.02) contrast(1.06) sepia(.04)}
.bo .meta{position:absolute;left:0;right:0;bottom:0;padding:1.4rem 1.5rem;background:linear-gradient(180deg,transparent,rgba(13,13,13,.92));transform:translateY(20px);opacity:.85;transition:transform .5s ease,opacity .5s ease}
.bo:hover .meta{transform:translateY(0);opacity:1}
.bo .num{font-family:var(--serif);font-size:.9rem;color:var(--gold);letter-spacing:.2em;display:block;margin-bottom:.3rem}
.bo .ttl{font-family:var(--serif);font-size:1.25rem;color:var(--ivory);font-weight:400;line-height:1.15}
.bo .day-tag{font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-light);margin-top:.4rem;display:block;opacity:.85}
@media (max-width:780px){.bestof-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.bestof-grid{grid-template-columns:1fr}}

.sub-head{text-align:center;margin:0 auto 3rem;padding-top:6rem}
.sub-head h2{font-size:clamp(1.7rem,3vw,2.4rem)}

/* ============================================================
   CARTE
   ============================================================ */
#map{height:620px;max-width:1280px;margin:0 auto;border:1px solid rgba(201,168,76,.18);background:#0a0a0a}
.leaflet-container{background:#0d0d0d;font-family:var(--sans)}
.gold-marker{width:18px;height:18px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 0 rgba(201,168,76,.6);animation:pulse 2.2s ease-out infinite;border:2px solid #0d0d0d}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(201,168,76,.7)}70%{box-shadow:0 0 0 14px rgba(201,168,76,0)}100%{box-shadow:0 0 0 0 rgba(201,168,76,0)}}
.leaflet-popup-content-wrapper{background:var(--obsidian-mid)!important;color:var(--ivory);border:1px solid rgba(201,168,76,.4)!important;border-radius:2px!important;box-shadow:0 12px 40px rgba(0,0,0,.6)!important}
.leaflet-popup-tip{background:var(--obsidian-mid)!important}
.leaflet-popup-content{margin:1rem 1.1rem!important;font-family:var(--sans);font-size:.78rem;line-height:1.6;color:var(--text-light)}
.leaflet-popup-content h4{font-family:var(--serif);font-size:1.25rem;color:var(--gold-light);margin-bottom:.2rem;font-weight:400}
.leaflet-popup-content .pop-day{font-size:.55rem;letter-spacing:.35em;text-transform:uppercase;color:var(--gold);margin-bottom:.6rem;display:block}
.leaflet-popup-close-button{color:var(--gold)!important;font-size:1.2rem!important;padding:6px 8px!important}
.leaflet-control-attribution{background:rgba(13,13,13,.6)!important;color:#666!important;font-size:9px!important}
.leaflet-control-attribution a{color:#888!important}
.leaflet-bar a{background:var(--obsidian-mid)!important;color:var(--gold)!important;border-color:rgba(201,168,76,.3)!important}
.legend{max-width:1280px;margin:1.6rem auto 0;display:flex;justify-content:center;gap:2rem;flex-wrap:wrap;font-size:.65rem;letter-spacing:.25em;text-transform:uppercase;color:var(--text-light)}
.legend-dot{display:inline-block;width:8px;height:8px;background:var(--gold);border-radius:50%;margin-right:.6em;vertical-align:middle}
.legend-line{display:inline-block;width:18px;height:2px;background:repeating-linear-gradient(90deg,var(--gold) 0 4px,transparent 4px 8px);margin-right:.6em;vertical-align:middle}

.places-list{max-width:1100px;margin:5rem auto 0;display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.place-row{display:flex;gap:1.5rem;padding:1.6rem;background:var(--obsidian-light);border:1px solid rgba(201,168,76,.1);align-items:flex-start;transition:border-color .35s ease}
.place-row:hover{border-color:rgba(201,168,76,.4)}
.place-row .pn{font-family:var(--serif);font-size:1.4rem;color:var(--gold);min-width:36px;font-weight:400;line-height:1}
.place-row h4{font-family:var(--serif);color:var(--ivory);font-size:1.25rem;font-weight:400;margin-bottom:.25rem}
.place-row .pday{font-size:.55rem;letter-spacing:.32em;text-transform:uppercase;color:var(--gold-light);display:block;margin-bottom:.55rem;opacity:.85}
.place-row p{font-size:.78rem;line-height:1.65;color:var(--text-light)}
@media (max-width:780px){.places-list{grid-template-columns:1fr}}

/* ============================================================
   MYTHO
   ============================================================ */
.mytho-intro{font-family:var(--serif);font-style:italic;font-size:1.25rem;color:var(--gold-light);text-align:center;max-width:720px;margin:0 auto 4rem;line-height:1.6;font-weight:300}
.mytho-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;max-width:1280px;margin:0 auto}
.god{background:var(--obsidian-light);border:1px solid rgba(201,168,76,.15);padding:2rem 1.5rem;border-radius:2px;display:flex;flex-direction:column;transition:border-color .4s ease,transform .4s ease,background .4s ease}
.god:hover{border-color:rgba(201,168,76,.45);transform:translateY(-3px);background:#1f1c18}
.god-symbol{font-family:var(--serif);font-size:2.5rem;color:var(--gold);text-align:center;margin-bottom:1rem;line-height:1;font-weight:300;letter-spacing:.05em}
.god .eyebrow{font-size:.55rem;display:block;text-align:center;margin-bottom:.5rem}
.god h4{font-family:var(--serif);font-size:1.3rem;color:var(--ivory);font-weight:400;text-align:center;margin-bottom:1rem}
.god p{font-size:.78rem;color:var(--text-light);line-height:1.7;flex:1;margin-bottom:1rem}
.god .vu{display:inline-block;align-self:flex-start;background:rgba(201,168,76,.1);border:1px solid rgba(201,168,76,.25);color:var(--gold-light);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;padding:.5rem .75rem;line-height:1.3}
@media (max-width:980px){.mytho-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.mytho-grid{grid-template-columns:1fr}}

/* ============================================================
   INFOS
   ============================================================ */
.infos-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;max-width:1280px;margin:0 auto}
.info-card{background:var(--obsidian-mid);border:1px solid rgba(201,168,76,.12);padding:2rem 1.8rem;border-radius:2px;transition:border-color .4s ease}
.info-card:hover{border-color:rgba(201,168,76,.4)}
.info-card .icon{font-family:var(--serif);font-size:1.8rem;color:var(--gold);display:block;margin-bottom:.75rem;line-height:1}
.info-card h4{font-family:var(--serif);font-size:1.4rem;color:var(--ivory);font-weight:400;margin-bottom:1.4rem}
.info-card ul{list-style:none}
.info-card li{font-size:.78rem;line-height:1.6;color:var(--text-light);padding-left:1.2rem;position:relative;margin-bottom:.7rem}
.info-card li::before{content:'—';position:absolute;left:0;top:0;color:var(--gold)}
@media (max-width:880px){.infos-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:580px){.infos-grid{grid-template-columns:1fr}}

/* ============================================================
   FOOTER
   ============================================================ */
footer{background:var(--obsidian);border-top:1px solid rgba(201,168,76,.1);padding:4rem 6vw 3rem;text-align:center}
footer .logo{font-family:var(--serif);font-size:1.8rem;color:var(--gold);letter-spacing:.12em;font-weight:400}
footer .sub{font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:var(--text-light);margin-top:.8rem;opacity:.7}
footer .visitor-counter{font-family:var(--serif);font-size:.9rem;color:var(--gold);letter-spacing:.2em;margin-top:1.4rem;font-style:italic;min-height:1.4em}
footer .credit{font-size:.6rem;color:var(--smoke);margin-top:.8rem;letter-spacing:.18em;text-transform:uppercase}
footer .foot-nav{display:flex;justify-content:center;gap:1.4rem;flex-wrap:wrap;margin-top:1.6rem}
footer .foot-nav a{font-size:.65rem;letter-spacing:.28em;text-transform:uppercase;color:var(--text-light);transition:color .3s}
footer .foot-nav a:hover{color:var(--gold)}

/* ============================================================
   LIGHTBOX
   ============================================================ */
.lightbox{position:fixed;inset:0;z-index:500;background:rgba(13,13,13,.97);display:none;align-items:center;justify-content:center;padding:5rem 4rem}
.lightbox.open{display:flex}
.lightbox img{max-width:90vw;max-height:85vh;object-fit:contain;border:1px solid rgba(201,168,76,.2)}
.lightbox .lb-close{position:absolute;top:1.5rem;right:2rem;font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(201,168,76,.3);padding:.7rem 1.2rem;transition:background .3s,color .3s;cursor:pointer}
.lightbox .lb-close:hover{background:var(--gold);color:var(--obsidian)}
.lightbox .lb-nav{position:absolute;top:50%;transform:translateY(-50%);font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(201,168,76,.3);padding:1rem 1.4rem;transition:background .3s,color .3s;background:rgba(13,13,13,.5);cursor:pointer}
.lightbox .lb-nav:hover{background:var(--gold);color:var(--obsidian)}
.lightbox .lb-prev{left:2rem}
.lightbox .lb-next{right:2rem}
.lightbox .lb-counter{position:absolute;bottom:1.5rem;left:50%;transform:translateX(-50%);font-family:var(--serif);font-size:.95rem;color:var(--gold-light);letter-spacing:.18em}
@media (max-width:680px){.lightbox{padding:4rem 1rem}.lightbox .lb-prev{left:.5rem;padding:.7rem .9rem}.lightbox .lb-next{right:.5rem;padding:.7rem .9rem}}

/* reveal */
.reveal{opacity:0;transform:translateY(25px);transition:opacity .9s ease,transform .9s ease}
.reveal.in{opacity:1;transform:translateY(0)}

/* ============================================================
   NAV DROPDOWN — Villes & Le Voyage
   ============================================================ */
.nav-dropdown{position:relative;padding-bottom:0}
.nav-dropdown>button{
  font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;
  color:var(--text-light);font-weight:300;padding:.4rem 0;
  position:relative;transition:color .3s;cursor:pointer;
  border:none;background:none;font-family:var(--sans);
  display:inline-flex;align-items:center;gap:.5rem;
}
.nav-dropdown>button .dd-arrow{
  font-size:.5rem;opacity:.6;
  transition:transform .3s ease,opacity .3s ease;
  display:inline-block;
}
.nav-dropdown.dd-open>button .dd-arrow,
.nav-dropdown:hover>button .dd-arrow{transform:rotate(180deg);opacity:1}
.nav-dropdown.dd-open>button,
.nav-dropdown:hover>button,
.nav-dropdown.active>button{color:var(--gold)}
.nav-dropdown>button::after{
  content:'';position:absolute;bottom:0;left:0;
  height:1px;width:0;background:var(--gold);transition:width .35s ease;
}
.nav-dropdown.dd-open>button::after,
.nav-dropdown:hover>button::after{width:100%}

/* Invisible bridge between button and menu — fills the gap so mouse doesn't lose hover */
.nav-dropdown::after{
  content:'';position:absolute;
  bottom:0;left:-20px;right:-20px;
  height:20px; /* same as padding-top on .dropdown-menu */
  background:transparent;
  pointer-events:auto;
}

.dropdown-menu{
  position:absolute;top:calc(100% + 20px);left:50%;
  transform:translateX(-50%) translateY(-6px);
  background:rgba(10,10,10,.98);
  border:1px solid rgba(201,168,76,.22);
  min-width:220px;padding:.6rem 0;
  opacity:0;pointer-events:none;
  transition:opacity .22s ease,transform .22s ease;
  z-index:300;
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  box-shadow:0 24px 64px rgba(0,0,0,.75),0 0 0 1px rgba(201,168,76,.06);
}
.nav-dropdown.dd-open .dropdown-menu,
.nav-dropdown:hover .dropdown-menu{
  opacity:1;pointer-events:all;
  transform:translateX(-50%) translateY(0);
}
.dropdown-menu::before{
  content:'';position:absolute;top:-5px;left:50%;
  width:8px;height:8px;
  background:rgba(10,10,10,.98);
  border-left:1px solid rgba(201,168,76,.22);
  border-top:1px solid rgba(201,168,76,.22);
  transform:translateX(-50%) rotate(45deg);
}
.dropdown-menu a{
  display:flex;align-items:center;gap:.9rem;
  padding:.8rem 1.5rem;
  font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--text-light);transition:color .2s,background .2s,padding-left .2s;
  white-space:nowrap;font-weight:300;
}
.dropdown-menu a:hover{color:var(--gold);background:rgba(201,168,76,.06);padding-left:1.8rem}
.dropdown-menu a .dd-icon{font-size:1.05rem;opacity:.65;transition:opacity .2s;min-width:1.3rem;text-align:center}
.dropdown-menu a:hover .dd-icon{opacity:1}
.dropdown-menu .dd-sep{height:1px;background:rgba(201,168,76,.12);margin:.4rem 1.5rem}

@media (max-width:1100px){
  .nav-dropdown{width:100%}
  .nav-dropdown::after{display:none}
  .nav-dropdown>button{
    padding:1rem 6vw;width:100%;text-align:left;
    display:flex;justify-content:space-between;align-items:center;
  }
  .nav-dropdown>button::after{display:none}
  .dropdown-menu{
    position:static;transform:none;opacity:0;
    max-height:0;overflow:hidden;
    border:none;border-top:1px solid rgba(201,168,76,.06);
    background:rgba(201,168,76,.03);padding:0;
    box-shadow:none;backdrop-filter:none;
    transition:opacity .3s ease,max-height .4s ease;
    pointer-events:none;
  }
  .dropdown-menu::before{display:none}
  .nav-dropdown.mob-open .dropdown-menu{opacity:1;max-height:600px;pointer-events:all}
  .nav-dropdown.mob-open>button .dd-arrow,
  .nav-dropdown.dd-open>button .dd-arrow{transform:rotate(180deg)}
  .dropdown-menu a{padding:.85rem 8vw}
  .dropdown-menu a:hover{padding-left:8vw}
}

/* ============================================================
   PAGES VILLES — City pages
   ============================================================ */
.city-hero{
  position:relative;overflow:hidden;
  min-height:62vh;display:flex;align-items:flex-end;
}
.city-hero-bg{
  position:absolute;inset:0;
  background-size:cover;background-position:center;
  filter:contrast(1.08) saturate(1.1) brightness(.72) sepia(.1);
  animation:slowzoom 18s ease-in-out infinite alternate;
}
.city-hero-bg::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(13,13,13,.25) 0%, rgba(13,13,13,.15) 30%, rgba(13,13,13,.92) 100%);
}
.city-hero-inner{
  position:relative;z-index:2;
  max-width:1280px;margin:0 auto;width:100%;
  padding:5rem 6vw 4rem;
}
.city-hero-inner .eyebrow{margin-bottom:.8rem}
.city-hero-inner h1,
.city-hero-inner .city-hero-title{
  font-size:clamp(2.6rem,6vw,5.5rem);
  font-weight:300;color:var(--ivory);
  margin:.5rem 0 .8rem;letter-spacing:-.01em;
  font-family:var(--serif);
}
.city-hero-inner .hero-lead{
  font-family:var(--serif);font-style:italic;
  font-size:1.15rem;color:var(--text-light);
  max-width:600px;line-height:1.6;
}

.city-stats{
  display:flex;gap:2.5rem;flex-wrap:wrap;
  margin-top:2rem;padding-top:2rem;
  border-top:1px solid rgba(201,168,76,.15);
}
.city-stat{display:flex;flex-direction:column;gap:.25rem}
.city-stat .cs-val{font-family:var(--serif);font-size:1.6rem;color:var(--gold-light);font-weight:400}
.city-stat .cs-lbl{font-size:.58rem;letter-spacing:.32em;text-transform:uppercase;color:var(--text-light);opacity:.7}

/* Sites section */
.sites-section{padding:6rem 6vw;background:var(--obsidian)}
.sites-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1.2rem;max-width:1280px;margin:4rem auto 0;
}
.site-card{
  background:var(--obsidian-mid);border:1px solid rgba(201,168,76,.12);
  overflow:hidden;transition:border-color .4s ease,transform .4s ease;
  display:flex;flex-direction:column;
}
.site-card:hover{border-color:rgba(201,168,76,.42);transform:translateY(-3px)}
.site-card .sc-img{
  aspect-ratio:4/3;overflow:hidden;position:relative;
}
.site-card .sc-img img{
  width:100%;height:100%;object-fit:cover;
  filter:contrast(1.08) saturate(1.18) brightness(.95) sepia(.1);
  transition:transform .8s ease,filter .8s ease;
}
.site-card:hover .sc-img img{transform:scale(1.06);filter:contrast(1.05) saturate(1.3) brightness(1.02) sepia(.03)}
.site-card .sc-body{padding:1.6rem 1.5rem;flex:1;display:flex;flex-direction:column}
.site-card .sc-tag{font-size:.55rem;letter-spacing:.35em;text-transform:uppercase;color:var(--gold);margin-bottom:.6rem}
.site-card h3{font-family:var(--serif);font-size:1.4rem;color:var(--ivory);font-weight:400;margin-bottom:.9rem;line-height:1.15}
.site-card p{font-size:.8rem;line-height:1.75;color:var(--text-light);flex:1}
.site-card .sc-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1rem}
.site-card .sc-badge{
  font-size:.55rem;letter-spacing:.15em;text-transform:uppercase;
  background:rgba(201,168,76,.1);border:1px solid rgba(201,168,76,.2);
  color:var(--gold-light);padding:.35rem .65rem;
}
@media (max-width:980px){.sites-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:580px){.sites-grid{grid-template-columns:1fr}}

/* City practical info */
.city-pratique{padding:6rem 6vw;background:rgba(26,20,14,.8)}
.pratique-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1rem;max-width:1280px;margin:3rem auto 0;
}
.prat-card{
  background:var(--obsidian-mid);border:1px solid rgba(201,168,76,.12);
  padding:1.8rem 1.6rem;
}
.prat-card .prat-icon{font-size:1.6rem;color:var(--gold);margin-bottom:.8rem;line-height:1}
.prat-card h4{font-family:var(--serif);font-size:1.25rem;color:var(--ivory);font-weight:400;margin-bottom:1rem}
.prat-card ul{list-style:none}
.prat-card li{font-size:.78rem;line-height:1.65;color:var(--text-light);padding-left:1.1rem;position:relative;margin-bottom:.6rem}
.prat-card li::before{content:'—';position:absolute;left:0;color:var(--gold);opacity:.7}
@media (max-width:880px){.pratique-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.pratique-grid{grid-template-columns:1fr}}

/* City quote banner */
.city-quote{
  padding:5rem 6vw;text-align:center;
  background:linear-gradient(135deg, rgba(201,168,76,.05) 0%, transparent 50%, rgba(201,168,76,.04) 100%);
  border-top:1px solid rgba(201,168,76,.08);
  border-bottom:1px solid rgba(201,168,76,.08);
}
.city-quote blockquote{
  font-family:var(--serif);font-size:clamp(1.3rem,2.5vw,2rem);
  font-style:italic;color:var(--gold-light);
  max-width:820px;margin:0 auto;line-height:1.5;font-weight:300;
}
.city-quote cite{
  display:block;margin-top:1.2rem;
  font-size:.65rem;letter-spacing:.3em;text-transform:uppercase;
  color:var(--text-light);font-style:normal;opacity:.7;
}

/* Cities nav bar on city pages */
.cities-nav{
  background:rgba(13,13,13,.85);
  border-bottom:1px solid rgba(201,168,76,.12);
  padding:.6rem 6vw;
  display:flex;justify-content:center;gap:1.5rem;
  flex-wrap:wrap;overflow-x:auto;
  position:sticky;top:64px;z-index:100;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
.cities-nav a{
  font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;
  color:var(--text-light);padding:.5rem .2rem;
  border-bottom:1px solid transparent;
  transition:color .3s,border-color .3s;
  white-space:nowrap;
}
.cities-nav a:hover,.cities-nav a.active{color:var(--gold);border-bottom-color:var(--gold)}

/* Highlight box */
.highlight-box{
  background:rgba(201,168,76,.06);border:1px solid rgba(201,168,76,.2);
  border-left:3px solid var(--gold);
  padding:1.4rem 1.8rem;margin:2rem 0;max-width:760px;
}
.highlight-box p{font-size:.85rem;line-height:1.8;color:var(--ivory);margin:0}
.highlight-box strong{color:var(--gold-light)}