/* =========================================================================
   FenuaTravel — design system v3 · feuille unique
   Remplace site.css, directory.css, portal-refresh.css et les couches
   agenda-refresh / itinerary-refresh / culture-maohi / environment-refresh.
   18 août 2026
   ========================================================================= */

/* ---------- polices auto-hébergées ---------- */
@font-face{font-family:Spectral;font-weight:400;font-style:normal;font-display:swap;src:url(fonts/spectral-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:Spectral;font-weight:600;font-style:normal;font-display:swap;src:url(fonts/spectral-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:Spectral;font-weight:700;font-style:normal;font-display:swap;src:url(fonts/spectral-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:Spectral;font-weight:400;font-style:italic;font-display:swap;src:url(fonts/spectral-latin-400-italic.woff2) format('woff2')}
@font-face{font-family:Karla;font-weight:400;font-style:normal;font-display:swap;src:url(fonts/karla-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:Karla;font-weight:600;font-style:normal;font-display:swap;src:url(fonts/karla-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:Karla;font-weight:700;font-style:normal;font-display:swap;src:url(fonts/karla-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:Karla;font-weight:400;font-style:italic;font-display:swap;src:url(fonts/karla-latin-400-italic.woff2) format('woff2')}

/* ---------- jetons ---------- */
:root{
  --ink:#0A2A31; --ink-2:#123c45; --deep:#04161A; --paper:#FBF6EE; --sand:#F1E7D8;
  --coral:#DD4F2C; --lagoon:#0E8A93; --gold:#C8912F; --sky:#4FA8C4;
  --accent:var(--coral); --accent-soft:rgba(221,79,44,.10);
  --line:rgba(10,42,49,.16); --line-soft:rgba(10,42,49,.08);
  --muted:#5c6f73; --text:#22383c;
  --shadow:0 24px 60px -30px rgba(4,22,26,.55);
  --shadow-s:0 10px 26px -18px rgba(4,22,26,.5);
  --display:Spectral,Georgia,serif; --body:Karla,system-ui,-apple-system,sans-serif;
  --r:14px; --r-l:26px; --maxw:1220px; --gut:26px;
}
body.mode-local{--accent:var(--lagoon); --accent-soft:rgba(14,138,147,.12)}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;line-height:1.08;letter-spacing:-.015em;margin:0}
h1{font-size:clamp(2.3rem,5vw,3.9rem);line-height:1.02}
h2{font-size:clamp(1.7rem,3.1vw,2.6rem)}
h3{font-size:1.2rem;line-height:1.22}
h4{font-size:1.02rem}
p{margin:0 0 1rem}
main p>a:not([class]),main li>a:not([class]),main td>a:not([class]){color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px;text-decoration-thickness:2px}
main p>a:not([class]):hover,main li>a:not([class]):hover{color:var(--accent)}
:focus-visible{outline:3px solid var(--lagoon);outline-offset:2px;border-radius:4px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;z-index:999;background:var(--ink);color:var(--paper);padding:.7rem 1.1rem;border-radius:999px}
.sr-only,.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap,main>section>.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut)}

/* ---------- bandeau + en-tête ---------- */
.topstrip{background:var(--deep);color:#cfe3e4;font-size:.8rem}
.topstrip a{display:flex;gap:.7rem;align-items:center;justify-content:center;max-width:var(--maxw);margin:0 auto;padding:.55rem var(--gut);flex-wrap:wrap}
.topstrip strong{color:#fff}
.topstrip span{color:#9dbcbd}
.topstrip a:hover strong{color:var(--gold)}

.ft-header{position:sticky;top:0;z-index:60;background:rgba(251,246,238,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line-soft)}
.ft-header>.wrap{display:flex;align-items:center;gap:1.4rem;height:72px}
.brand{font-family:var(--display);font-size:1.45rem;font-weight:700;letter-spacing:-.03em;white-space:nowrap}
.brand span{color:var(--accent)}
.ft-nav{display:flex;gap:1.35rem;margin-left:auto;font-weight:600;font-size:.94rem}
.ft-nav a{position:relative;padding:.3rem 0;white-space:nowrap}
.ft-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:2px;background:var(--accent);transition:right .28s ease}
.ft-nav a:hover::after,.ft-nav a[aria-current]::after{right:0}
.switch{display:flex;background:var(--sand);border:1px solid var(--line-soft);border-radius:999px;padding:4px;gap:2px}
.switch button{font:inherit;font-size:.8rem;font-weight:700;border:0;cursor:pointer;background:transparent;color:var(--muted);padding:.4rem .85rem;border-radius:999px;transition:.2s}
.switch button[aria-pressed=true]{background:var(--ink);color:var(--paper)}
.burger{display:none;background:var(--ink);color:var(--paper);border:0;border-radius:999px;padding:.5rem 1rem;font:inherit;font-weight:700;cursor:pointer}
.ft-lang{font-weight:700;font-size:.82rem;border:1px solid var(--line);border-radius:999px;padding:.28rem .6rem}

/* ---------- fil d'ariane + tête de page ---------- */
.ft-breadcrumb{max-width:var(--maxw);margin:1.4rem auto .2rem;padding:0 var(--gut);font-size:.84rem;color:var(--muted)}
.ft-breadcrumb a{text-decoration:none}
.ft-breadcrumb a:hover{color:var(--accent)}
.ft-breadcrumb span,.ft-breadcrumb li+li::before{content:""}
.ft-breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:.45rem;margin:0;padding:0}
.ft-breadcrumb li+li::before{content:"›";margin-right:.45rem;color:var(--line)}

.page-head{max-width:var(--maxw);margin:0 auto;padding:2.4rem var(--gut) 1.6rem}
.page-head h1{margin:.5rem 0 .9rem}
.eyebrow,.portal-kicker,.ft-continue-kicker,.trip-stop-kicker{display:inline-flex;align-items:center;gap:.55rem;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--accent);margin:0 0 .2rem}
.eyebrow::before,.portal-kicker::before{content:"";width:20px;height:1px;background:currentColor}
.lede,.section-intro{font-size:1.1rem;color:var(--text);max-width:44rem}
.updated{font-size:.82rem;color:var(--muted)}

/* ---------- contenu éditorial ---------- */
main{display:block}
main section{max-width:var(--maxw);margin:0 auto;padding:1.6rem var(--gut) 2.2rem}
main section>h2{margin:.4rem 0 .8rem}
main section>h3{margin:1.4rem 0 .5rem}
main ul,main ol{padding-left:1.15rem;margin:0 0 1.1rem}
main li{margin-bottom:.4rem}
main table{width:100%;border-collapse:collapse;margin:0 0 1.4rem;font-size:.95rem}
main th,main td{text-align:left;padding:.7rem .8rem;border-bottom:1px solid var(--line-soft);vertical-align:top}
main th{font-family:var(--body);font-weight:700;background:var(--sand)}
main figure{margin:0 0 1.4rem}
main figure img{border-radius:var(--r)}
main figcaption{font-size:.82rem;color:var(--muted);margin-top:.45rem}
blockquote{margin:0 0 1.4rem;padding:.2rem 0 .2rem 1.1rem;border-left:3px solid var(--accent);font-family:var(--display);font-size:1.15rem}
hr{border:0;border-top:1px solid var(--line-soft);margin:2rem 0}
time{font-variant-numeric:tabular-nums}

main dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.7rem;margin:0 0 1.6rem;padding:0}
main dl>div{background:#fff;border:1px solid var(--line-soft);border-radius:12px;padding:.85rem 1rem}
main dt{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700}
main dd{margin:.15rem 0 0;font-family:var(--display);font-size:1.1rem;line-height:1.25}
main dt+dd{margin-bottom:.9rem}

/* ---------- cartes et grilles (vocabulaire existant du site) ---------- */
.editorial-grid,.resource-grid,.hub-index-grid,.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem;margin:0 0 1.6rem}
.editorial-card,.resource,.card,.local-card{background:#fff;border:1px solid var(--line-soft);border-radius:var(--r);padding:1.15rem 1.2rem;box-shadow:var(--shadow-s);transition:transform .25s,box-shadow .25s,border-color .25s;position:relative;overflow:hidden}
a.editorial-card,a.resource,a.card{display:block}
.editorial-card:hover,.resource:hover,.card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--line)}
.editorial-card h3,.resource h3,.card h3{margin:.15rem 0 .35rem}
.editorial-card p,.resource p,.card p{margin:0 0 .5rem;font-size:.95rem;color:var(--text)}
.editorial-card small,.resource small,.card small{color:var(--muted);font-size:.85rem}
.editorial-card img,.card img{border-radius:10px;margin:-1.15rem -1.2rem .9rem;width:calc(100% + 2.4rem);max-width:none;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r) var(--r) 0 0}
.soft{background:var(--sand);border-color:transparent}
.notice,.warning{background:#FFF6E6;border:1px solid #E9CF9B;border-left:4px solid var(--gold);border-radius:10px;padding:1rem 1.1rem;margin:0 0 1.4rem}
.warning{background:#FDEEEA;border-color:#F0BBAA;border-left-color:var(--coral)}
.checks{list-style:none;padding:0}
.checks li{position:relative;padding-left:1.6rem;margin-bottom:.55rem}
.checks li::before{content:"✓";position:absolute;left:0;color:var(--lagoon);font-weight:700}
.stat{display:inline-block;margin-right:2rem}
.stat-value{display:block;font-family:var(--display);font-size:1.7rem;line-height:1}
.stat-label{font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.source-citation,.source-row{font-size:.84rem;color:var(--muted);border-top:1px solid var(--line-soft);padding-top:.7rem;margin-top:1rem}

/* ---------- boutons ---------- */
.btn,.primary,.portal-button{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:.95rem;border-radius:999px;padding:.78rem 1.4rem;border:1px solid transparent;cursor:pointer;transition:.22s;text-decoration:none!important}
.btn,.primary{background:var(--ink);color:var(--paper)}
.btn:hover,.primary:hover{background:var(--accent);color:#fff}
.secondary,.portal-button--line{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:.95rem;border-radius:999px;padding:.78rem 1.4rem;border:1px solid var(--line);background:transparent;color:var(--ink);transition:.22s;text-decoration:none!important}
.secondary:hover{border-color:var(--ink);background:#fff}
.actions{display:flex;flex-wrap:wrap;gap:.7rem;margin:0 0 1.4rem}
.link-more{font-weight:700;border-bottom:2px solid var(--accent);padding-bottom:2px;white-space:nowrap}

/* ---------- bloc affiliation / réservation ---------- */
.ft-book{background:linear-gradient(160deg,#0d333b,#0A2A31);color:#eaf2f1;border-radius:var(--r-l);padding:1.6rem 1.7rem;margin:2rem auto;max-width:var(--maxw)}
.ft-book h2,.ft-book h3{color:#fff;margin:.2rem 0 .5rem}
.ft-book .eyebrow{color:#7ed4d8}
.ft-book p{color:#a8c3c4}
.ft-book-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.8rem;margin-top:1.1rem}
.ft-book-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:.95rem 1rem;transition:.22s;display:block}
.ft-book-card:hover{background:rgba(255,255,255,.13);transform:translateY(-3px)}
.ft-book-card strong{display:block;color:#fff;font-size:1rem}
.ft-book-card span{font-size:.85rem;color:#9dbcbd}
.ft-book-card em{display:block;margin-top:.5rem;font-style:normal;font-weight:700;color:#ffd9b0;font-size:.85rem}
.ft-partner{font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;background:rgba(255,255,255,.14);color:#cfe3e4;padding:.16rem .45rem;border-radius:4px;margin-left:.4rem}

/* ---------- capture email ---------- */
.ft-capture{background:var(--sand);border-radius:var(--r-l);padding:1.8rem;margin:2.2rem auto;max-width:var(--maxw);display:grid;grid-template-columns:1.1fr 1fr;gap:1.6rem;align-items:center}
.ft-capture h2{font-size:1.7rem;margin:.3rem 0 .5rem}
.ft-capture form{display:flex;gap:.5rem;flex-wrap:wrap}
.ft-capture input{flex:1;min-width:190px;border:1px solid var(--line);border-radius:999px;padding:.8rem 1.2rem;font:inherit;background:#fff}
.ft-capture button{border:0;cursor:pointer;font:inherit;font-weight:700;background:var(--ink);color:var(--paper);border-radius:999px;padding:.8rem 1.35rem}
.ft-capture small{color:var(--muted);font-size:.8rem}

/* ---------- agenda ---------- */
.agenda-toolbar{position:sticky;top:72px;z-index:40;background:rgba(251,246,238,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-soft);padding:.8rem 0}
.agenda-toolbar .wrap{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.chip{font:inherit;font-size:.85rem;font-weight:600;cursor:pointer;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:999px;padding:.4rem .95rem;transition:.2s;white-space:nowrap}
.chip:hover{border-color:var(--ink)}
.chip[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.agenda-count{margin-left:auto;font-size:.85rem;color:var(--muted)}
.agenda-month{max-width:var(--maxw);margin:2.2rem auto .8rem;padding:0 var(--gut);display:flex;align-items:baseline;gap:1rem}
.agenda-month h2{font-size:1.55rem;text-transform:capitalize}
.agenda-month span{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.agenda-list{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut);display:flex;flex-direction:column;gap:.55rem}
.ev-row{display:grid;grid-template-columns:104px 1fr auto;gap:1.1rem;align-items:center;background:#fff;border:1px solid var(--line-soft);border-radius:var(--r);padding:.9rem 1.1rem;transition:.22s}
.ev-row:hover{transform:translateX(3px);border-color:var(--accent);box-shadow:var(--shadow-s)}
.ev-row.is-hidden{display:none}
.ev-date{text-align:center;background:var(--sand);border-radius:10px;padding:.5rem .3rem;line-height:1.05}
.ev-date strong{display:block;font-family:var(--display);font-size:1.5rem}
.ev-date span{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.ev-date em{display:block;font-style:normal;font-size:.68rem;color:var(--accent);font-weight:700;margin-top:.15rem}
.ev-body h3{font-size:1.05rem;margin-bottom:.15rem}
.ev-meta{font-size:.85rem;color:var(--muted);display:flex;gap:.7rem;flex-wrap:wrap}
.ev-tag{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;padding:.16rem .5rem;border-radius:5px;background:var(--accent-soft);color:var(--accent)}
.ev-check{font-size:.72rem;color:var(--lagoon);font-weight:700;white-space:nowrap}
.ev-check[data-status="a-verifier"]{color:var(--gold)}
.agenda-empty{max-width:var(--maxw);margin:2rem auto;padding:2rem var(--gut);text-align:center;color:var(--muted)}

/* ---------- jeux du pacifique ---------- */
.games-hero{background:linear-gradient(150deg,#04161A 10%,#0d3d46 60%,#12656b);color:#fff;position:relative;overflow:hidden}
.games-hero::after{content:"";position:absolute;inset:auto -10% -50% auto;width:60vw;height:60vw;border-radius:50%;background:radial-gradient(circle at 40% 40%,rgba(200,145,47,.28),transparent 62%)}
.games-hero .wrap{position:relative;z-index:2;padding-top:3.4rem;padding-bottom:3rem}
.games-hero h1{color:#fff;max-width:16ch}
.games-hero .eyebrow{color:var(--gold)}
.games-hero p{color:#c9dedf;max-width:46ch;font-size:1.1rem}
.countdown{display:flex;gap:.8rem;margin:1.6rem 0 1.2rem;flex-wrap:wrap}
.countdown div{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:.75rem 1.1rem;text-align:center;min-width:88px}
.countdown strong{display:block;font-family:var(--display);font-size:2rem;line-height:1}
.countdown span{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:#9dbcbd}
.games-nums{display:flex;gap:2.2rem;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.16);padding-top:1.2rem;margin-top:.4rem}
.games-nums div strong{font-family:var(--display);font-size:1.6rem;display:block;line-height:1}
.games-nums div span{font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:#9dbcbd}
.sport-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.6rem}
.sport{background:#fff;border:1px solid var(--line-soft);border-radius:10px;padding:.7rem .85rem;font-weight:600;font-size:.92rem;display:flex;justify-content:space-between;gap:.5rem;align-items:center}
.sport span{font-size:.75rem;color:var(--muted);font-weight:400}
.venue-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}
.venue{background:var(--sand);border-radius:var(--r);padding:1.1rem 1.2rem}
.venue strong{display:block;font-family:var(--display);font-size:1.25rem}

/* ---------- île : encadré pratique ---------- */
.ft-island-photo{border-radius:var(--r-l);overflow:hidden;margin:0 auto 1.8rem;max-width:var(--maxw)}
.ft-island-photo img{width:100%;aspect-ratio:21/9;object-fit:cover}
.ft-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.7rem;max-width:var(--maxw);margin:0 auto 1.8rem;padding:0 var(--gut)}
.ft-fact{background:#fff;border:1px solid var(--line-soft);border-radius:12px;padding:.85rem 1rem}
.ft-fact span{display:block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.ft-fact strong{font-family:var(--display);font-size:1.15rem}

/* ---------- bandeau confiance + suite ---------- */
.trust-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.55);margin-top:2.4rem}
.trust-strip>*{max-width:var(--maxw);margin:0 auto}
.trust-strip{padding:1rem var(--gut);font-size:.9rem;display:flex;gap:1.6rem;flex-wrap:wrap;align-items:center;justify-content:space-between}
.ft-continue{max-width:var(--maxw);margin:2.4rem auto;padding:0 var(--gut)}
.ft-continue-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:.8rem;margin-top:.8rem}

/* ---------- pied ---------- */
.ft-footer{background:var(--deep);color:#b9d1d2;padding:3.2rem 0 1.8rem;margin-top:3rem;font-size:.93rem}
.ft-footer .wrap{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:2rem}
.ft-footer strong{display:block;color:#fff;margin-bottom:.7rem;font-size:.76rem;letter-spacing:.16em;text-transform:uppercase}
.ft-footer a{display:block;padding:.16rem 0;color:#b9d1d2}
.ft-footer a:hover{color:#fff}
.ft-footer .brand{color:#fff;font-size:1.4rem}
.ft-legal{max-width:var(--maxw);margin:2.2rem auto 0;padding:1.1rem var(--gut) 0;border-top:1px solid rgba(255,255,255,.12);font-size:.79rem;color:#7f9c9e;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}

/* ---------- dock mobile ---------- */
.ft-dock{display:none}

/* ---------- animations ---------- */
@media (prefers-reduced-motion:no-preference){
  .rv{opacity:0;transform:translateY(16px);animation:rise .8s cubic-bezier(.2,.7,.3,1) forwards}
  .d1{animation-delay:.04s}.d2{animation-delay:.1s}.d3{animation-delay:.16s}.d4{animation-delay:.22s}.d5{animation-delay:.28s}
  @keyframes rise{to{opacity:1;transform:none}}
}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .ft-footer .wrap{grid-template-columns:1fr 1fr 1fr}
  .ft-capture{grid-template-columns:1fr}
}
@media (max-width:900px){
  .ft-header>.wrap{height:auto;flex-wrap:wrap;gap:.7rem;padding-top:.6rem;padding-bottom:.6rem}
  .brand{font-size:1.25rem}
  .ft-lang{order:4;margin-left:0}
  .switch{order:5;flex-basis:100%;justify-content:center;margin-left:0}
  .switch button{flex:1;text-align:center}
  .ft-nav{top:auto;margin-top:.4rem;position:static;box-shadow:none;padding:.6rem 0 0}
  .ft-nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--paper);border-bottom:1px solid var(--line);padding:1rem var(--gut) 1.3rem;flex-direction:column;gap:.9rem;box-shadow:var(--shadow)}
  .ft-nav.open{display:flex}
  .burger{display:block;margin-left:auto;order:2}
  .switch{order:3}
  .ft-lang{order:4}
  .ev-row{grid-template-columns:76px 1fr;gap:.8rem}
  .ev-check{grid-column:2;justify-self:start}
  .agenda-toolbar{top:0}
  .ft-dock{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:70;background:rgba(4,22,26,.96);backdrop-filter:blur(10px);padding:.45rem .4rem calc(.45rem + env(safe-area-inset-bottom));justify-content:space-around}
  .ft-dock a{color:#cfe3e4;font-size:.68rem;font-weight:700;letter-spacing:.04em;text-align:center;padding:.35rem .5rem;border-radius:10px;display:flex;flex-direction:column;gap:.18rem;align-items:center}
  .ft-dock a b{font-size:1.05rem;font-weight:400;line-height:1}
  .ft-dock a[aria-current]{color:#fff;background:rgba(255,255,255,.12)}
  body{padding-bottom:58px}
}
@media (max-width:560px){
  :root{--gut:18px}
  .ft-footer .wrap{grid-template-columns:1fr 1fr}
  .trust-strip{flex-direction:column;align-items:flex-start;gap:.5rem}
  .editorial-grid,.resource-grid,.hub-index-grid{grid-template-columns:1fr}
}
@media print{.ft-header,.ft-dock,.topstrip,.agenda-toolbar{display:none}}

/* ================= accueil v3 ================= */
.home-hero{position:relative;overflow:hidden;padding:clamp(2rem,4vw,3.6rem) 0 2.6rem}
.home-hero::after{content:"";position:absolute;right:-14%;top:-30%;width:70vw;height:70vw;border-radius:50%;
  background:radial-gradient(circle at 30% 30%,rgba(14,138,147,.13),transparent 62%);pointer-events:none}
.home-hero>.wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(1.6rem,4vw,3.6rem);align-items:center;position:relative}
.home-hero h1{margin:.9rem 0 1rem}
.home-hero h1 em{font-style:italic;color:var(--accent);font-weight:400}
.home-search{margin:1.5rem 0 .9rem;display:flex;background:#fff;border:1px solid var(--line);border-radius:999px;
  padding:6px 6px 6px 20px;align-items:center;box-shadow:0 12px 30px -22px rgba(4,22,26,.7)}
.home-search input{flex:1;min-width:0;border:0;outline:0;font:inherit;background:transparent;padding:.72rem 0}
.home-search button{border:0;cursor:pointer;font:inherit;font-weight:700;background:var(--ink);color:var(--paper);border-radius:999px;padding:.75rem 1.4rem;transition:.2s}
.home-search button:hover{background:var(--accent)}
.home-chips{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:1.4rem}
.home-chips a{font-size:.85rem;font-weight:600;border:1px solid var(--line);border-radius:999px;padding:.34rem .8rem;background:rgba(255,255,255,.6);transition:.2s}
.home-chips a:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.home-stats{display:flex;gap:2rem;border-top:1px solid var(--line-soft);padding-top:1.1rem;flex-wrap:wrap}
.home-stats div strong{font-family:var(--display);font-size:1.6rem;display:block;line-height:1}
.home-stats div span{font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.collage{position:relative;height:min(52vw,500px)}
.collage figure{position:absolute;margin:0;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);background:var(--sand)}
.collage figure img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.3,1)}
.collage figure:hover img{transform:scale(1.06)}
.c1{inset:0 26% 22% 0;z-index:1}.c2{width:44%;right:0;top:6%;aspect-ratio:3/4;z-index:2;transform:rotate(2.2deg)}
.c3{width:38%;left:0;bottom:0;aspect-ratio:4/3;z-index:3;transform:rotate(-2.4deg)}
.tag{position:absolute;left:12px;top:12px;z-index:4;background:rgba(4,22,26,.72);color:#fff;font-size:.68rem;
  letter-spacing:.14em;text-transform:uppercase;padding:.3rem .65rem;border-radius:999px}
.home-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.6rem;margin-bottom:1.8rem;flex-wrap:wrap}
.starts{display:grid;grid-template-columns:repeat(4,1fr);gap:.9rem}
.start{background:#fff;border:1px solid var(--line-soft);border-radius:var(--r);padding:1.3rem 1.2rem 1.1rem;
  display:flex;flex-direction:column;gap:.4rem;min-height:172px;transition:.26s;position:relative;overflow:hidden}
.start::before{content:"";position:absolute;inset:auto 0 0 0;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:0 50%;transition:.3s}
.start:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.start:hover::before{transform:scaleX(1)}
.start .num{font-family:var(--display);font-size:.86rem;color:var(--accent);font-weight:700}
.start h3{margin-top:auto}.start small{color:var(--muted);font-size:.85rem}
.compare{background:var(--ink);color:#eaf2f1;border-radius:var(--r-l);padding:clamp(1.6rem,3vw,2.8rem)}
.compare h2{color:#fff}.compare .eyebrow{color:#7ed4d8}.compare .home-head p{color:#a8c3c4;margin:0}
.isles{display:grid;grid-template-columns:repeat(4,1fr);gap:.9rem}
.isle{border-radius:var(--r);overflow:hidden;background:#0d333b;border:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;transition:.3s;min-width:0}
.isle.hide{display:none}
.isle .ph{aspect-ratio:4/3;overflow:hidden}.isle .ph img{width:100%;height:100%;object-fit:cover;transition:transform 1s}
.isle:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.28)}.isle:hover .ph img{transform:scale(1.07)}
.isle .body{padding:.95rem 1rem 1.1rem;display:flex;flex-direction:column;gap:.35rem;flex:1;min-width:0}
.isle h3{color:#fff}.isle .meta{display:flex;gap:.7rem;font-size:.78rem;color:#9dbcbd;flex-wrap:wrap}
.isle p{color:#9dbcbd;font-size:.87rem;margin:0}
.isle .go{margin-top:auto;padding-top:.5rem;font-size:.82rem;font-weight:700;color:#ffd9b0}
.trips{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.trip{position:relative;border-radius:var(--r);overflow:hidden;min-height:380px;display:flex;align-items:flex-end;color:#fff;box-shadow:var(--shadow)}
.trip img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s}
.trip::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,22,26,0) 30%,rgba(4,22,26,.9) 100%)}
.trip:hover img{transform:scale(1.06)}
.trip .in{position:relative;z-index:2;padding:1.5rem;display:flex;flex-direction:column;gap:.4rem}
.trip h3{color:#fff;font-size:1.4rem}.trip .days{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#ffc9a8;font-weight:700}
.trip .price{font-size:.88rem;color:#dbeaea}.trip .go{font-weight:700;font-size:.88rem;border-bottom:2px solid rgba(255,255,255,.5);align-self:flex-start;padding-bottom:2px;margin-top:.3rem}
.home-agenda{display:grid;grid-template-columns:repeat(4,1fr);gap:.9rem}
.home-ev{background:#fff;border:1px solid var(--line-soft);border-radius:var(--r);padding:1rem 1.1rem;transition:.24s;display:flex;flex-direction:column;gap:.3rem}
.home-ev:hover{transform:translateY(-3px);box-shadow:var(--shadow-s);border-color:var(--accent)}
.home-ev .d{font-weight:800;color:var(--accent);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase}
.home-ev strong{font-family:var(--display);font-size:1.05rem;line-height:1.2}
.home-ev small{color:var(--muted);font-size:.84rem}
.living-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
.living-grid a{background:#fff;border:1px solid var(--line-soft);border-radius:12px;padding:1rem 1.1rem;transition:.24s;display:flex;flex-direction:column;gap:.1rem}
.living-grid a:hover{border-color:var(--accent);transform:translateX(3px)}
.living-grid strong{font-weight:700}.living-grid span{font-size:.85rem;color:var(--muted)}
.games-band{background:linear-gradient(150deg,#04161A,#0d3d46 65%,#12656b);color:#fff;border-radius:var(--r-l);
  padding:clamp(1.6rem,3vw,2.6rem);display:grid;grid-template-columns:1.2fr 1fr;gap:2rem;align-items:center}
.games-band h2{color:#fff}.games-band .eyebrow{color:var(--gold)}.games-band p{color:#c9dedf}
.guides-3{display:grid;grid-template-columns:repeat(3,1fr);gap:.9rem}
.guide{background:linear-gradient(160deg,#12414a,#0a2a31);color:#fff;border-radius:var(--r);padding:1.2rem;min-height:230px;
  display:flex;flex-direction:column;gap:.35rem;transition:.26s}
.guide:hover{transform:translateY(-4px)}.guide.free{background:linear-gradient(160deg,var(--accent),#a8331a)}
.guide .fmt{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;opacity:.8;font-weight:700}
.guide h3{color:#fff;margin-top:auto;font-size:1.15rem}.guide .price{font-weight:800}
@media(max-width:1080px){.starts,.isles,.home-agenda{grid-template-columns:repeat(2,1fr)}.trips{grid-template-columns:1fr 1fr}
  .living-grid{grid-template-columns:1fr 1fr}.games-band{grid-template-columns:1fr}}
@media(max-width:860px){.home-hero>.wrap{grid-template-columns:minmax(0,1fr)}.collage{height:86vw;max-height:460px}
  .home-stats{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.trips{grid-template-columns:1fr}}
@media(max-width:560px){.starts,.home-agenda,.living-grid,.guides-3{grid-template-columns:1fr 1fr}
  .isles{grid-template-columns:1fr}.isle{flex-direction:row}.isle .ph{width:40%;flex:none;aspect-ratio:1/1}}

/* ================= compatibilité widgets =================
   Styles des composants injectés par les scripts de page (annuaire, planificateurs,
   agenda culture, fédérations, guides, recherche). Reprend le vocabulaire existant
   du site : rien à changer dans les scripts. */
.source-watch-heading,.guide-collection__head{font-family:var(--display);font-size:1.25rem;margin:1.6rem 0 .5rem}
.source-watch-meta,.source-watch-status,.federation-count{font-size:.84rem;color:var(--muted);margin-bottom:.8rem}
.source-watch-list,.guide-collection__list,.federation-directory-section ul{list-style:none;padding:0;margin:0 0 1.4rem;
  display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.7rem}
.source-watch-item,.federation-cultural-entry,.culture-event-row{background:#fff;border:1px solid var(--line-soft);
  border-radius:12px;padding:.9rem 1rem;transition:.22s}
.source-watch-item:hover,.federation-cultural-entry:hover,.culture-event-row:hover{border-color:var(--accent);transform:translateY(-2px)}
.source-watch-item strong,.culture-event-row strong{display:block;font-family:var(--display);font-size:1.05rem}
.source-watch-controls,.activity-search-box,.federation-search{display:flex;gap:.5rem;flex-wrap:wrap;margin:0 0 1.2rem}
.source-watch-controls input,.source-watch-controls select,.activity-search-box input,.federation-search input,
.activity-search-box select,main select,main input[type=search],main input[type=text]{
  font:inherit;border:1px solid var(--line);border-radius:999px;padding:.6rem 1.05rem;background:#fff;min-width:0}
main select{border-radius:10px}
.activity-now-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.8rem;margin-bottom:1.4rem}
.culture-calendar-empty,.agenda-empty{color:var(--muted);font-size:.95rem}
.is-loading{opacity:.55;pointer-events:none}
.federation-prototype{border:1px dashed var(--line);border-radius:12px;padding:1rem;margin-bottom:1.2rem}
.search-results{background:#fff;border:1px solid var(--line);border-radius:14px;margin-top:.6rem;
  box-shadow:var(--shadow-s);overflow:hidden}
.search-results a{display:block;padding:.7rem 1rem;border-bottom:1px solid var(--line-soft)}
.search-results a:hover{background:var(--sand)}
.search-results a:last-child{border-bottom:0}

/* ---------- météo (module conservé) ---------- */
.ft-weather{background:var(--sand);border-radius:var(--r-l);padding:clamp(1.4rem,3vw,2.4rem);
  display:grid;grid-template-columns:1fr 1.1fr;gap:1.8rem;align-items:center;max-width:var(--maxw);margin:2rem auto}
.weather-controls{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin:.9rem 0}
.weather-controls button{font:inherit;font-weight:700;font-size:.88rem;cursor:pointer;border:1px solid var(--line);
  background:#fff;border-radius:999px;padding:.5rem 1rem;transition:.2s}
.weather-controls button:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.weather-controls label{display:flex;flex-direction:column;gap:.2rem;font-size:.74rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted)}
.weather-status,.weather-privacy,.weather-source{font-size:.82rem;color:var(--muted)}
.weather-loading,.weather-card{background:#fff;border:1px solid var(--line-soft);border-radius:12px;padding:1rem;text-align:center}
[data-weather-output]{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.6rem}
[data-weather-output] strong{display:block;font-family:var(--display);font-size:1.5rem;line-height:1}
[data-weather-output] span{font-size:.76rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}

/* la bascule d'audience n'apparaît que là où elle change quelque chose */
body:not(.has-panes) .switch{display:none}
@media(max-width:900px){.ft-weather{grid-template-columns:1fr}}

/* ---------- v3.1 · grilles éditoriales, illustrations, FAQ (19 août 2026) ---------- */
.answer-grid,.circuit-steps{display:grid;gap:1rem;margin:1.2rem 0 1.6rem;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.answer-grid>article,.circuit-steps>article{min-width:0;background:#fff;border:1px solid var(--line-soft);
  border-radius:var(--r);padding:1rem 1.1rem;box-shadow:var(--shadow-s)}
.answer-grid>article h3,.circuit-steps>article h3{margin:.15rem 0 .45rem;font-size:1.08rem;line-height:1.25}
.answer-grid>article p,.circuit-steps>article p{margin:0;font-size:.94rem}
.circuit-steps>article{position:relative;padding-left:1.1rem;border-left:3px solid var(--accent)}
.circuit-steps>article>span{display:inline-block;font-family:var(--body);font-weight:700;font-size:.7rem;
  letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:.35rem}

figure[data-ft-illustration]{max-width:var(--maxw);margin:0 auto 1.8rem;padding:0 var(--gut)}
figure[data-ft-illustration] img{width:100%;height:auto;display:block;border-radius:var(--r-l);
  box-shadow:var(--shadow);aspect-ratio:16/10;object-fit:cover}
figcaption .credit{display:block;margin-top:.15rem;font-size:.74rem;color:var(--muted);opacity:.85}
figcaption .credit a{color:inherit}

.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 1.4rem}
.table-wrap table{margin:0;min-width:34rem}
.ft-table tbody tr:hover{background:var(--accent-soft)}

.ft-answer{background:var(--sand);border-radius:var(--r-l)}
.ft-answer h2{max-width:38ch}

details.ft-faq{border-bottom:1px solid var(--line-soft);padding:.2rem 0}
details.ft-faq summary{cursor:pointer;list-style:none;padding:.85rem 2rem .85rem 0;position:relative}
details.ft-faq summary::-webkit-details-marker{display:none}
details.ft-faq summary h3{display:inline;margin:0;font-size:1.05rem;line-height:1.3}
details.ft-faq summary::after{content:"+";position:absolute;right:.2rem;top:.7rem;font-size:1.4rem;
  color:var(--accent);line-height:1}
details.ft-faq[open] summary::after{content:"–"}
details.ft-faq>p{margin:0 0 1rem;font-size:.95rem;max-width:70ch}

/* blocs de fin de page : « poursuivre », fil de confiance */
.ft-continue>div{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:.8rem;margin-top:.9rem}
.ft-continue>div>a{display:block;min-width:0;background:#fff;border:1px solid var(--line-soft);
  border-radius:var(--r);padding:.9rem 1rem;text-decoration:none;color:var(--ink);box-shadow:var(--shadow-s);
  transition:transform .18s ease,border-color .18s ease}
.ft-continue>div>a:hover{transform:translateY(-2px);border-color:var(--accent)}
.ft-continue>div>a>strong{display:block;font-family:var(--display);font-size:1.05rem;line-height:1.25;margin-bottom:.2rem}
.ft-continue>div>a>span{display:block;font-size:.86rem;color:var(--muted)}

nav.context-links{max-width:var(--maxw);margin:1.8rem auto 0;padding:0 var(--gut);
  display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
nav.context-links>strong{flex:0 0 100%;font-family:var(--body);font-size:.72rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--muted);margin-bottom:.2rem}
nav.context-links>a{display:inline-block;background:#fff;border:1px solid var(--line-soft);border-radius:999px;
  padding:.4rem .9rem;font-size:.86rem;text-decoration:none;color:var(--ink)}
nav.context-links>a:hover{border-color:var(--accent);color:var(--accent)}

.trust-strip>div{display:flex;flex-direction:column;gap:.1rem;min-width:0}
.trust-strip>div>strong{font-family:var(--body);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.trust-strip>div>span{font-size:.92rem}

/* sources en grille + tableau empilé sur mobile */
.source-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:.9rem;margin:1rem 0 1.4rem}
.source-row>article{min-width:0;background:#fff;border:1px solid var(--line-soft);border-radius:var(--r);padding:.9rem 1rem}
.source-row>article h3{margin:0 0 .3rem;font-size:1.02rem}
.source-row>article p{margin:0 0 .5rem;font-size:.88rem;color:var(--muted)}
.source-row>article a{font-size:.85rem}
@media(max-width:640px){
  .table-wrap{overflow:visible}
  .table-wrap table{min-width:0}
  .ft-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .ft-table tr{display:block;background:#fff;border:1px solid var(--line-soft);border-radius:var(--r);
    padding:.6rem .85rem;margin-bottom:.7rem}
  .ft-table td{display:flex;gap:.8rem;justify-content:space-between;align-items:baseline;
    border:0;padding:.3rem 0;text-align:right}
  .ft-table td[data-label]::before{content:attr(data-label);flex:0 0 auto;text-align:left;
    font-family:var(--body);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
}

/* ---------- calculateur de budget (FR et EN) ---------- */
.ft-calc{max-width:var(--maxw);margin:0 auto;padding:1.4rem var(--gut) 2.4rem}
.ft-calc .hero{text-align:left;padding:0 0 1.4rem}
.ft-calc .hero h1{margin:.3rem 0 .6rem;max-width:20ch}
.ft-calc .hero-sub{font-size:1.05rem;color:var(--text);max-width:62ch;margin:0 0 1rem}
.ft-calc .hero-tag{display:inline-block;font-family:var(--body);font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;font-weight:700;color:var(--accent)}
.ft-calc .hero-badges{display:flex;flex-wrap:wrap;gap:.45rem}
.ft-calc .badge{background:var(--sand);border-radius:999px;padding:.32rem .8rem;font-size:.82rem}
.ft-calc .calc-main{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:1.4rem;align-items:start}
.ft-calc .form-col{display:flex;flex-direction:column;gap:1rem;min-width:0}
.ft-calc .card{background:#fff;border:1px solid var(--line-soft);border-radius:var(--r-l);
  box-shadow:var(--shadow-s);overflow:hidden}
.ft-calc .card-head{display:flex;align-items:center;gap:.7rem;padding:.9rem 1.1rem;background:var(--sand);
  border-bottom:1px solid var(--line-soft)}
.ft-calc .card-num{flex:0 0 auto;width:1.7rem;height:1.7rem;border-radius:50%;background:var(--accent);
  color:#fff;font-family:var(--body);font-weight:700;font-size:.85rem;display:grid;place-items:center}
.ft-calc .card-title{font-family:var(--display);font-size:1.12rem;font-weight:600}
.ft-calc .card-body{padding:1rem 1.1rem 1.2rem}
.ft-calc .field-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.8rem;margin-bottom:.8rem}
.ft-calc .field-row:last-child{margin-bottom:0}
.ft-calc .field{min-width:0}
.ft-calc label{display:block;font-family:var(--body);font-size:.78rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:.3rem}
.ft-calc .select-wrap{position:relative}
.ft-calc select{width:100%;appearance:none;font:inherit;font-size:.95rem;padding:.6rem 2rem .6rem .8rem;
  border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);cursor:pointer}
.ft-calc select:focus{outline:2px solid var(--accent);outline-offset:1px}
.ft-calc .select-wrap::after{content:"";position:absolute;right:.85rem;top:50%;width:.45rem;height:.45rem;
  border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);
  transform:translateY(-70%) rotate(45deg);pointer-events:none}
.ft-calc .chips{display:flex;flex-wrap:wrap;gap:.45rem}
.ft-calc .chip{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:.42rem .9rem;
  font-size:.88rem;cursor:pointer;background:#fff;user-select:none;transition:.15s ease}
.ft-calc .chip:hover{border-color:var(--accent)}
.ft-calc .chip.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.ft-calc .result-sticky{position:sticky;top:1rem;min-width:0}
.ft-calc .result-card{background:var(--deep);color:var(--paper);border-radius:var(--r-l);overflow:hidden;
  box-shadow:var(--shadow)}
.ft-calc .result-head{padding:1.1rem 1.2rem .9rem;border-bottom:1px solid rgba(251,246,238,.14)}
.ft-calc .result-icon{font-size:1.4rem}
.ft-calc .result-label{font-family:var(--body);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;
  opacity:.7;margin:.2rem 0}
.ft-calc .result-total{font-family:var(--display);font-size:2.3rem;line-height:1.05;font-weight:700}
.ft-calc .result-pp{font-size:.85rem;opacity:.75}
.ft-calc .result-body{padding:.9rem 1.2rem 1.2rem}
.ft-calc .result-line{display:flex;justify-content:space-between;gap:1rem;padding:.4rem 0;
  border-bottom:1px solid rgba(251,246,238,.1);font-size:.92rem}
.ft-calc .result-line:last-of-type{border-bottom:0}
.ft-calc .result-val{font-weight:700;white-space:nowrap}
.ft-calc .result-note{font-size:.78rem;opacity:.7;margin-top:.7rem}
.ft-calc .breakdown{margin-top:1rem}
.ft-calc .bar-row{margin-bottom:.6rem}
.ft-calc .bar-label-row{display:flex;justify-content:space-between;font-size:.8rem;margin-bottom:.2rem}
.ft-calc .bar-track{height:.5rem;border-radius:999px;background:rgba(251,246,238,.16);overflow:hidden}
.ft-calc .bar-fill{height:100%;border-radius:999px;background:var(--accent)}
.ft-calc .tip-box{background:var(--sand);border-left:4px solid var(--gold);border-radius:12px;
  padding:.9rem 1.1rem;margin:1rem 0;font-size:.92rem}
.ft-calc .disclaimer{font-size:.82rem;color:var(--muted);margin-top:1rem;max-width:70ch}
.ft-calc .cta-vol{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.7rem;margin-top:1rem}
@media(max-width:900px){
  .ft-calc .calc-main{grid-template-columns:1fr}
  .ft-calc .result-sticky{position:static;order:-1}
  .ft-calc .result-total{font-size:1.9rem}
}

/* photo d'en-tete d'ile : gouttiere et legende lisible */
.ft-island-photo{padding:0 var(--gut);border-radius:0;overflow:visible}
.ft-island-photo img{border-radius:var(--r-l);box-shadow:var(--shadow);display:block}
.ft-island-photo figcaption{display:flex;flex-wrap:wrap;gap:.2rem .8rem;align-items:baseline;
  margin-top:.5rem;font-size:.82rem;color:var(--muted)}
.ft-island-photo figcaption strong{font-family:var(--body);font-weight:700;color:var(--ink);font-size:.86rem}
.ft-island-photo figcaption a{color:inherit;font-size:.76rem}

/* == agenda : sorties depliables == */
.agenda-month h2{text-transform:none}
.agenda-month{scroll-margin-top:210px}
.agenda-jump{display:flex;gap:.4rem;flex-wrap:wrap;margin:.55rem 0 0;font-size:.82rem}
.agenda-jump a{display:inline-flex;align-items:center;gap:.35rem;padding:.28rem .7rem;border:1px solid var(--line);
  border-radius:999px;text-decoration:none;color:var(--ink);background:#fff;white-space:nowrap}
.agenda-jump a:hover{border-color:var(--accent);color:var(--accent)}
.agenda-jump b{font-weight:700;font-size:.72rem;color:var(--muted)}
a.ft-fact{text-decoration:none;color:inherit;display:block;transition:border-color .15s,transform .15s}
a.ft-fact:hover{border-color:var(--accent);transform:translateY(-1px)}
a.ft-fact strong{color:var(--accent)}
.agenda-toolbar{scroll-margin-top:80px}
.agenda-jump a:hover b{color:var(--accent)}
.agenda-toolbar .agenda-count{display:block;margin:.35rem 0 0;text-align:right}
@media (max-width:720px){
  /* la premiere date doit etre atteignable sans deux ecrans de defilement */
  .page-head+figure[data-ft-illustration] img{max-height:120px;object-fit:cover}
  .page-head+figure[data-ft-illustration] figcaption{font-size:.72rem;line-height:1.3}
  #contenu>.page-head h1{font-size:1.95rem;line-height:1.1}
  #contenu>.page-head .lede{font-size:.95rem;line-height:1.45}
  .ft-facts{grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:.4rem}
  .ft-fact{padding:.5rem .6rem}
  .ft-fact strong{font-size:1rem}
  .agenda-jump{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .agenda-jump::-webkit-scrollbar{display:none}
  .agenda-jump a{flex:0 0 auto}
  .agenda-month{scroll-margin-top:150px}
  /* deux rangees defilantes plutot qu'un pave de dix lignes qui mange l'ecran */
  .agenda-toolbar .wrap{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:.15rem}
  .agenda-toolbar .wrap::-webkit-scrollbar{display:none}
  .agenda-toolbar .chip{flex:0 0 auto}
  .agenda-toolbar .agenda-count{text-align:left;font-size:.78rem}
  /* cote a cote, « Ce week-end » se casse en deux lignes et la periode vient s'y
     coller. Sous 720 px, chacun sa ligne. */
  .agenda-month{display:grid;gap:.15rem;align-items:start;margin-bottom:.6rem}
  .agenda-month h2{font-size:1.4rem;line-height:1.15}
  .agenda-month span{font-size:.72rem;letter-spacing:.1em;line-height:1.35}
}
.ev-item{border:0;padding:0}
.ev-item.is-hidden{display:none}
.ev-item>summary{list-style:none;cursor:pointer}
.ev-item>summary::-webkit-details-marker{display:none}
.ev-item>summary .ev-row{width:100%}
.ev-item[open]>summary .ev-row{border-color:var(--accent);box-shadow:var(--shadow-s)}
.ev-detail{background:#fff;border:1px solid var(--line-soft);border-top:0;
  border-radius:0 0 12px 12px;margin:-6px .4rem 0;padding:1rem 1.1rem 1.1rem;font-size:.92rem}
.ev-detail>p{margin:0 0 .6rem;max-width:70ch}
.ev-detail .actions{margin:.8rem 0 .6rem}
.ev-prepare{font-size:.85rem;color:var(--muted);display:flex;gap:.6rem;flex-wrap:wrap;align-items:baseline}
.ev-prepare a{margin-right:.2rem}
/* == fin agenda depliable == */

/* == sorties par ile == */
.ile-sorties{list-style:none;margin:.8rem 0 1rem;padding:0;display:grid;gap:.45rem;max-width:60ch}
.ile-sorties li{display:flex;gap:.6rem;flex-wrap:wrap;align-items:baseline;font-size:.94rem;
  padding:.5rem .8rem;background:#fff;border:1px solid var(--line-soft);border-radius:10px}
.ile-sorties span{color:var(--muted);font-size:.85rem}
/* == fin sorties par ile == */

/* == schemas == */
/* Un schema n'est pas une photo : le recadrage 16/10 en object-fit:cover lui coupait
   la premiere colonne. Ici on garde le dessin entier, et sur petit ecran on le fait
   defiler horizontalement plutot que de le reduire jusqu'a l'illisible. */
figure[data-ft-schema] img{aspect-ratio:auto;object-fit:contain;background:var(--paper);
  box-shadow:none;border:1px solid var(--line-soft);border-radius:var(--r)}
@media(max-width:760px){
  figure[data-ft-schema]{overflow-x:auto;-webkit-overflow-scrolling:touch}
  figure[data-ft-schema] img{min-width:720px}
  figure[data-ft-schema] figcaption{position:sticky;left:0}
}
/* == fin schemas == */

/* == peage guides == */
/* Le formulaire remplace un bouton : il doit garder le poids visuel d'un bouton,
   pas celui d'un formulaire administratif. Sur mobile il passe en colonne. */
.guide-gate{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:.2rem 0 .4rem}
.guide-gate label{flex:1 0 100%;font-size:.82rem;font-weight:700;letter-spacing:.02em}
.guide-gate input[type=email]{flex:1 1 15rem;min-width:0;padding:.72rem .9rem;font:inherit;
  color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:999px}
.guide-gate input[type=email]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.guide-gate button{flex:0 0 auto;cursor:pointer;border:0}
/* La note prend sa propre ligne et hérite de la couleur du bloc : posée dans un
   conteneur clair comme dans un conteneur sombre, elle reste lisible. */
.gate-note{flex:1 0 100%;margin:.35rem 0 .1rem;font-size:.82rem;color:inherit;opacity:.75;max-width:56ch}
/* == fin peage guides == */

/* == rattrapage v3 == */
/* La consolidation de v3 a fusionné dix feuilles en une, et 503 classes présentes dans
   le HTML se sont retrouvées sans aucune règle. Un conteneur sans règle ne disparaît
   pas : il se replie en display:block. Une grille devient une pile, et une liste
   d'attributs faite de <span> se colle en un seul pavé — « FenuaTravel N°09Publication :
   2026Langue : français ». Sur un écran de téléphone, où rien ne peut se cacher dans la
   marge, c'est illisible.

   Plutôt que rapatrier les 97 ko de règles supprimées, on traite ici les huit familles
   de blocs réellement cassées. Tout est en mobile d'abord : une colonne par défaut,
   plusieurs quand la largeur le permet. */

/* --- A. listes d'attributs : des <span> qui doivent devenir des lignes --- */
.guide-facts, .need-chips, .education-filters, .recipe-list, .map-key,
.trip-hero-facts, .facebook-strip, .island-route__marker{
  display:grid;gap:.4rem;margin:1rem 0;padding:1rem 1.1rem;
  background:var(--sand);border-radius:var(--r);font-size:.92rem}
.guide-facts>span, .need-chips>span, .education-filters>span, .recipe-list>span,
.map-key>span, .facebook-strip>a, .island-route__marker>span{display:block;color:var(--muted)}
.guide-facts>strong, .map-key>strong, .facebook-strip>strong{
  font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.trip-hero-facts{grid-template-columns:1fr;gap:.7rem}
.trip-hero-facts>span{display:grid;gap:.1rem}
.trip-hero-facts small{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.trip-hero-facts strong{font-size:1.02rem}
.island-route__marker{display:flex;gap:.4rem;align-items:baseline;padding:.4rem .7rem;margin:0}

/* --- B. cartes de lien : un <a> qui contient un titre et une explication --- */
.direct-links, .tourism-experiences, .education-paths, .contact-grid,
.adoption-actions, .trip-stay-links{display:grid;gap:.6rem;margin:1rem 0}
.direct-links>a, .tourism-experiences>a, .education-paths>a, .contact-grid>a,
.adoption-actions>a, .trip-stay-links>a, .culture-story-cta{
  display:grid;gap:.15rem;padding:.9rem 1.1rem;background:#fff;text-decoration:none;
  border:1px solid var(--line-soft);border-radius:var(--r);color:var(--ink)}
.direct-links>a:hover, .tourism-experiences>a:hover, .education-paths>a:hover,
.contact-grid>a:hover, .adoption-actions>a:hover, .trip-stay-links>a:hover,
.culture-story-cta:hover{border-color:var(--accent);background:var(--accent-soft)}
.direct-links strong, .tourism-experiences strong, .education-paths strong,
.contact-grid strong, .trip-stay-links strong, .culture-story-cta strong{font-size:1rem}
.direct-links span, .tourism-experiences span, .education-paths span, .contact-grid span,
.trip-stay-links span, .culture-story-cta span, .education-paths small{
  font-size:.88rem;color:var(--muted)}

/* --- C. grilles de cartes : une colonne au téléphone, deux dès qu'il y a la place --- */
.decision-grid, .travel-steps, .local-topic-grid, .profile-grid, .grid,
.trip-stay-card, .place-card{display:grid;gap:.9rem;margin:1.1rem 0}
@media(min-width:760px){
  .decision-grid, .travel-steps, .local-topic-grid, .profile-grid, .grid{
    grid-template-columns:repeat(auto-fit,minmax(17rem,1fr))}
  .direct-links, .tourism-experiences, .education-paths, .contact-grid{
    grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
}

/* --- D. barres de liens horizontales : elles défilent plutôt que de déborder --- */
.profile-strip, .trip-quick-nav, .ft-island-links{
  display:flex;flex-wrap:wrap;gap:.45rem;margin:.9rem 0;padding:0;list-style:none}
.profile-strip>a, .trip-quick-nav>a, .ft-island-links>a{
  padding:.42rem .85rem;font-size:.88rem;text-decoration:none;color:var(--ink);
  background:#fff;border:1px solid var(--line);border-radius:999px}
.profile-strip>a:hover, .trip-quick-nav>a:hover, .ft-island-links>a:hover{
  border-color:var(--accent);color:var(--accent)}

/* --- E. variantes de bouton restées sans habillage --- */
.outline, .ghost, .shop-buy{
  display:inline-flex;align-items:center;gap:.4rem;padding:.62rem 1.1rem;
  font-weight:700;font-size:.92rem;text-decoration:none;border-radius:999px;
  border:1px solid var(--line);color:var(--ink);background:transparent}
.shop-buy{border-color:var(--accent);color:var(--accent)}
.outline:hover, .ghost:hover, .shop-buy:hover{border-color:var(--accent);background:var(--accent-soft)}
.dark-actions{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}

/* --- F. encadrés : un fond et de l'air, sinon ils se fondent dans le texte --- */
.callout, .understand, .context-banner, .freshness-review, .legal-section{
  margin:1.2rem 0;padding:1rem 1.15rem;background:var(--sand);
  border-radius:var(--r);border-left:3px solid var(--accent)}
.callout>:first-child, .understand>:first-child, .context-banner>:first-child,
.freshness-review>:first-child, .legal-section>:first-child{margin-top:0}
.callout>:last-child, .understand>:last-child, .context-banner>:last-child,
.freshness-review>:last-child, .legal-section>:last-child{margin-bottom:0}
.reading{max-width:68ch}
.kind, .mag-badge{display:inline-block;padding:.16rem .6rem;margin:0 .3rem .3rem 0;
  font-size:.74rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--accent);background:var(--accent-soft);border-radius:999px}

/* --- G. en-têtes de page déclinés --- */
.local-head, .about-head, .guide-head{margin-bottom:1.4rem}

/* --- H. images et crédits --- */
.editorial-lead-photo, .guide-preview, .ft-context-photo, .notebook{
  display:block;margin:0 0 1.2rem}
.editorial-lead-photo img, .guide-preview img, .ft-context-photo img, .notebook img{
  width:100%;height:auto;display:block;border-radius:var(--r-l)}
.photo-credit, .trip-photo-credit{display:block;margin-top:.3rem;font-size:.74rem;
  color:var(--muted);opacity:.85}

/* --- I. le jour d'itinéraire, sur 45 pages --- */
.trip-day{margin:1.1rem 0;padding:1.1rem 1.2rem;background:#fff;
  border:1px solid var(--line-soft);border-radius:var(--r)}
.trip-day>:first-child{margin-top:0}
.trip-day>:last-child{margin-bottom:0}
.trip-stay-booking{display:inline-block;margin-top:.4rem;font-size:.88rem}

/* --- J. tableaux comparatifs : ils débordent au lieu de casser la page --- */
.compare-table{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:1.1rem 0}
.compare-table table{min-width:32rem}
@media(max-width:520px){
  /* sous 520 px un tableau à trois colonnes n'a plus de sens : chaque ligne devient
     une fiche, et l'intitulé de colonne passe devant la valeur via data-label */
  .compare-table{overflow:visible}
  .compare-table table, .compare-table thead, .compare-table tbody,
  .compare-table tr, .compare-table td{display:block;min-width:0;width:auto}
  .compare-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .compare-table tr{margin-bottom:.7rem;padding:.8rem .95rem;background:#fff;
    border:1px solid var(--line-soft);border-radius:var(--r)}
  .compare-table td{padding:.2rem 0;border:0}
  .compare-table td[data-label]::before{content:attr(data-label) " · ";
    font-weight:700;font-size:.76rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
}

/* --- K. le reste, une a trois pages chacun, meme traitement par famille --- */
.trip-hero-actions, .island-nav, .guide-paths, .hero-meta, .timeline{
  display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:.9rem 0}
.trip-button{display:inline-flex;align-items:center;gap:.4rem;padding:.62rem 1.15rem;
  font-weight:700;font-size:.92rem;text-decoration:none;border-radius:999px;
  border:1px solid var(--line);color:var(--ink)}
.trip-button.primary{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.trip-button:hover{border-color:var(--accent);color:var(--accent)}
.trip-button.primary:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.island-nav>a, .guide-paths>a{padding:.4rem .85rem;font-size:.88rem;text-decoration:none;
  color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:999px}
.island-nav>a:hover, .guide-paths>a:hover{border-color:var(--accent);color:var(--accent)}
.hero-meta>span, .calm-kit>span, .games-host-route>span{display:inline-block;
  padding:.2rem .7rem;font-size:.84rem;color:var(--muted);
  background:var(--sand);border-radius:999px}
.timeline>span{display:inline-grid;justify-items:center;min-width:2.6rem;padding:.35rem .5rem;
  background:var(--sand);border-radius:var(--r);line-height:1.1}
.timeline b{font-size:1.05rem}
.timeline small{font-size:.7rem;color:var(--muted)}
.games-date-line{display:flex;gap:.45rem;align-items:baseline;flex-wrap:wrap;font-size:1.02rem}
.games-host-route, .calm-kit{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin:.9rem 0}
.source-list, .local-action-grid{display:grid;gap:.6rem;margin:1rem 0}
.source-list>a, .local-action-grid>a{display:grid;gap:.15rem;padding:.9rem 1.1rem;
  background:#fff;text-decoration:none;border:1px solid var(--line-soft);
  border-radius:var(--r);color:var(--ink)}
.source-list>a:hover, .local-action-grid>a:hover{border-color:var(--accent);background:var(--accent-soft)}
.source-list span, .local-action-grid span{font-size:.88rem;color:var(--muted)}
@media(min-width:760px){
  .source-list, .local-action-grid{grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
}

/* --- L. la grille de carnets de l'accueil : des <a> images cote a cote --- */
.fenua-notebooks__grid{display:grid;gap:.9rem;margin:1.1rem 0}
.notebook{display:grid;gap:.35rem;text-decoration:none;color:var(--ink)}
.notebook img{width:100%;height:auto;display:block;border-radius:var(--r-l)}
.notebook strong{font-size:1rem}
.notebook span{font-size:.88rem;color:var(--muted)}
@media(min-width:760px){
  .fenua-notebooks__grid{grid-template-columns:repeat(auto-fit,minmax(16rem,1fr))}
  .notebook--wide{grid-column:span 2}
}
/* == fin rattrapage v3 == */
