/* ViaTrek v3 — fondations de la refonte (étape 1, 10/11/2026).
   Direction : outdoor premium · aventure · magazine. Tout est préfixé .v3 / --v3- pour cohabiter avec style.css et v2.css.
   Rien ne l'utilise encore en dehors de /nuancier/. */

@font-face{font-family:"Fraunces";src:url(/assets/fonts/fraunces-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Fraunces";src:url(/assets/fonts/fraunces-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}

:root{
  /* couleurs */
  --v3-craie:#F6F1EA; --v3-papier:#FFFDF9; --v3-sable:#EAE0D3;
  --v3-roche:#1F1B18; --v3-gris:#6B625B; --v3-trait:#DDD3C6;
  --v3-terre:#C8643B; --v3-terre-f:#A94E2A; --v3-terre-c:#F7E3D7;
  --v3-foret:#2F4A3A; --v3-foret-c:#DCE6DF;
  --v3-ciel:#4F7A99; --v3-nuit:#14110F; --v3-nuit-2:#221D19;
  /* activités */
  --v3-via:#C8643B; --v3-rando:#5BAE7A; --v3-vol:#4F7A99; --v3-escalade:#B4874A; --v3-decouverte:#7B5CD6; --v3-van:#D9A441;
  /* typo */
  /* 10/11 : style « sport » choisi par Yannick (maquette ChatGPT) → capitales italiques condensées */
  --v3-titre:"Barlow Condensed","Arial Narrow",system-ui,sans-serif;
  --v3-orange:#F26B1D; --v3-orange-f:#D9560B; --v3-noir:#101214; --v3-noir-2:#191C1F; --v3-noir-3:#24282C;
  --v3-texte:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --v3-t-hero:clamp(2.8rem,8vw,6.5rem); --v3-t-1:clamp(2.1rem,5vw,3.8rem); --v3-t-2:clamp(1.6rem,3.4vw,2.5rem); --v3-t-3:clamp(1.2rem,2vw,1.5rem);
  /* espaces, formes, ombres, mouvement */
  --v3-r:18px; --v3-r-s:10px; --v3-gout:clamp(16px,4vw,48px); --v3-max:1240px;
  --v3-ombre:0 10px 30px rgba(31,27,24,.12); --v3-ombre-f:0 24px 60px rgba(31,27,24,.22);
  --v3-ease:cubic-bezier(.2,.7,.2,1); --v3-d:.7s;
}

.v3{background:var(--v3-craie);color:var(--v3-roche);font-family:var(--v3-texte);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
.v3 *,.v3 *::before,.v3 *::after{box-sizing:border-box}
.v3 img{max-width:100%;display:block}
:where(.v3) a{color:inherit}/* 10/11 : :where = priorité minimale, pour ne plus écraser les couleurs de la barre du bas et des menus communs */
.v3 a.v3-carte{color:#fff}

/* mise en page */
.v3-wrap{max-width:var(--v3-max);margin:0 auto;padding:0 var(--v3-gout)}
.v3-sec{padding:clamp(56px,9vw,120px) 0}
.v3-sombre{background:var(--v3-nuit);color:#F3ECE4}
.v3-sombre .v3-chapo,.v3-sombre .v3-sur{color:#BFB3A8}
.v3-grille{display:grid;gap:clamp(16px,2.4vw,28px);grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}

/* typographie */
.v3-hero-t,.v3-h1,.v3-h2,.v3-h3{font-family:var(--v3-titre);font-weight:700;font-style:italic;text-transform:uppercase;letter-spacing:0;line-height:1;margin:0 0 .4em}
.v3-hero-t{font-size:var(--v3-t-hero);font-weight:800;line-height:.92}
.v3-h3{text-transform:none}
/* 10/11 : v2.css impose sa police à h1/h2/h3 avec !important → on reprend la main sur les pages v3 */
.v3 .v3-hero-t,.v3 .v3-h1,.v3 .v3-h2,.v3 .v3-h3,.v3 .act-t{font-family:var(--v3-titre)!important}
.v3-trait{color:var(--v3-orange);white-space:nowrap}/* 10/11 : le coup de pinceau sous le mot débordait sur la ligne suivante (Yannick : « moche ») → mot en orange */
.v3-orange{color:var(--v3-orange)}
.v3-h1{font-size:var(--v3-t-1)}.v3-h2{font-size:var(--v3-t-2)}.v3-h3{font-size:var(--v3-t-3);line-height:1.2}
.v3-sur{font:600 .78rem/1 var(--v3-texte);letter-spacing:.16em;text-transform:uppercase;color:var(--v3-terre);margin:0 0 1rem}
.v3-chapo{font-size:clamp(1.05rem,1.6vw,1.25rem);color:var(--v3-gris);max-width:38em;margin:0 0 1.5em}
.v3-lettrine::first-letter{font-family:var(--v3-titre);float:left;font-size:3.6em;line-height:.8;padding:.08em .1em 0 0;color:var(--v3-terre)}

/* boutons */
.v3-btn{display:inline-flex;align-items:center;gap:.55em;min-height:48px;padding:0 1.5em;border-radius:999px;border:1.5px solid transparent;font:600 1rem/1 var(--v3-texte);text-decoration:none;cursor:pointer;transition:transform .25s var(--v3-ease),background .25s,color .25s,box-shadow .25s}
.v3-btn:hover{transform:translateY(-2px)}
.v3-btn:focus-visible{outline:3px solid var(--v3-terre);outline-offset:3px}
.v3-btn-p{background:var(--v3-orange);color:#fff;box-shadow:0 8px 20px rgba(242,107,29,.32)}.v3-btn-p:hover{background:var(--v3-orange-f)}
.v3-btn-s{text-transform:none}
.v3-btn-s{background:transparent;border-color:currentColor}
.v3-btn-v{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.5);backdrop-filter:blur(8px)}.v3-btn-v:hover{background:rgba(255,255,255,.26)}
.v3-btn svg{width:18px;height:18px}

/* icônes au trait (remplacent les emojis des titres) */
.v3-ico{width:1.25em;height:1.25em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.22em}

/* étiquettes */
.v3-tag{display:inline-flex;align-items:center;gap:.4em;padding:.35em .8em;border-radius:999px;background:var(--v3-sable);font:600 .8rem/1 var(--v3-texte)}
.v3-tag i{width:.6em;height:.6em;border-radius:50%;background:var(--c,var(--v3-terre))}

/* ouverture plein écran */
.v3-hero{position:relative;min-height:min(92svh,860px);display:flex;align-items:flex-end;color:#fff;overflow:hidden;background:var(--v3-nuit)}
.v3-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:v3-zoom 14s var(--v3-ease) both}
.v3-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,17,15,.15) 0%,rgba(20,17,15,0) 35%,rgba(20,17,15,.75) 100%)}
.v3-hero-in{position:relative;z-index:1;width:100%;padding-bottom:clamp(40px,8vh,90px)}
.v3-hero .v3-chapo{color:rgba(255,255,255,.88)}
@keyframes v3-zoom{from{transform:scale(1.08)}to{transform:scale(1)}}

/* carte photo (univers, fiche, article) */
.v3-carte{position:relative;display:block;border-radius:var(--v3-r);overflow:hidden;background:var(--v3-nuit);color:#fff;text-decoration:none;aspect-ratio:3/4;box-shadow:var(--v3-ombre);transition:box-shadow .4s var(--v3-ease),transform .4s var(--v3-ease)}
.v3-carte img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--v3-ease)}
.v3-carte::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(20,17,15,.8))}
.v3-carte-in{position:absolute;z-index:1;left:0;right:0;bottom:0;padding:22px}
.v3-carte-in .v3-h3{margin:0 0 .2em}
.v3-carte small{opacity:.85;font-size:.9rem}
.v3-carte:hover{box-shadow:var(--v3-ombre-f);transform:translateY(-4px)}.v3-carte:hover img{transform:scale(1.06)}
.v3-carte-l{aspect-ratio:16/10}
@media (max-width:560px){.v3-carte{aspect-ratio:4/3}}

/* carte de fiche (liste) */
.v3-fiche{background:var(--v3-papier);border-radius:var(--v3-r);overflow:hidden;box-shadow:var(--v3-ombre);text-decoration:none;display:flex;flex-direction:column}
.v3-fiche-img{aspect-ratio:16/10;overflow:hidden}.v3-fiche-img img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--v3-ease)}
.v3-fiche:hover .v3-fiche-img img{transform:scale(1.05)}
.v3-fiche-in{padding:18px 20px 20px}
.v3-chiffres{display:flex;flex-wrap:wrap;gap:6px 16px;margin:.6em 0 0;padding:0;list-style:none;font-size:.88rem;color:var(--v3-gris)}
.v3-chiffres b{color:var(--v3-roche)}

/* bandeau de chiffres clés */
.v3-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:24px}
.v3-stat b{display:block;font:700 clamp(2.2rem,5vw,3.4rem)/1 var(--v3-titre);color:var(--v3-terre)}
.v3-stat span{font-size:.95rem;opacity:.8}

/* champs */
.v3-champ{display:flex;align-items:center;gap:10px;background:#fff;border-radius:999px;padding:6px 6px 6px 20px;box-shadow:var(--v3-ombre);max-width:560px}
.v3-champ input{flex:1;border:0;outline:0;font:inherit;background:transparent;color:var(--v3-roche);min-width:0}

/* apparition au défilement (ajoutée par JS : .v3-rev puis .v3-vu) */
.v3-rev{opacity:0;transform:translateY(28px);transition:opacity var(--v3-d) var(--v3-ease),transform var(--v3-d) var(--v3-ease)}
.v3-rev.v3-vu{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  .v3 *,.v3 *::before,.v3 *::after{animation:none!important;transition:none!important}
  .v3-rev{opacity:1;transform:none}
}