/* ============================================================
   Tiny Shiny Ceramics — système de design v2 « Le temps long »
   Une seule feuille pour tout le site. Règles : charte inchangée,
   filets plutôt que cadres, angles vifs, typographie d'abord,
   rien ne bouge seul (sauf la pièce 3D de l'accueil).
   ============================================================ */
@font-face{font-family:'Joshico';src:url('../fonts/Joshico.woff2') format('woff2'),url('../fonts/Joshico.ttf') format('truetype');font-display:swap;}

:root{
  /* charte */
  --porcelaine:#FBF9F6; --creme:#EFEBE7; --sauge:#789C96; --sauge-fonce:#5F7E78; --sapin:#28524A;
  --rose:#FFDDD2; --or:#EABA4E; --vert-gris:#B8C8C4;
  /* rôles */
  --fond:var(--porcelaine); --fond-alt:var(--creme); --texte:#33463F; --doux:#66766F; --titre:var(--sapin);
  --filet:#DCE3E0; --filet-fort:var(--sapin); --accent:var(--sauge-fonce);
  /* rythme */
  --wrap:1200px; --gout:32px;
  /* échelle d'espacements (audit 08/10/2026, échelle B) : téléphone = ×0,6 via --sec-m */
  --sec:120px; --sec-m:72px; --sec-serre:64px;
  --douce:cubic-bezier(.22,1,.36,1);
  /* échelle typographique */
  --t-xs:11px; --t-s:13px; --t-m:16px; --t-l:18px; --t-xl:22px;
  --h-1:clamp(52px,8.4vw,120px);     /* H1 de page */
  --h-1b:clamp(44px,5.2vw,76px);     /* H1 condensé : À propos, intro de l'accueil */
  --h-2:clamp(42px,5.6vw,80px);      /* H2 de section */
  --h-scene:clamp(40px,4.6vw,64px);  /* H2 des scènes épinglées : accueil, vitrines, .ep-txt, .loupe-txt */
  --h-theme:clamp(32px,3.2vw,44px);  /* H2 de thème (FAQ) et des textes légaux */
  --h-3:clamp(28px,2.6vw,37px);      /* H3 de bloc */
  --h-q:clamp(22px,2vw,27px);        /* question de FAQ */
  --h-4:24px;                        /* H4 compact (Cormorant 400) */
}
/* Téléphone : étiquettes à 12 px, jamais plus petit que lisible */
@media(max-width:600px){:root{--t-xs:12px;}}
*{box-sizing:border-box;margin:0;padding:0;}
html{background:var(--fond);-webkit-text-size-adjust:100%;}
@view-transition{navigation:auto;}                    /* fondu doux d'une page à l'autre */
::view-transition-old(root),::view-transition-new(root){animation-duration:.45s;animation-timing-function:var(--douce);}
body{font-family:'Raleway',sans-serif;font-weight:400;font-size:var(--t-m);line-height:1.75;color:var(--texte);
  background:var(--fond);-webkit-font-smoothing:antialiased;overflow-x:clip;}
img,video{display:block;max-width:100%;}
a{color:inherit;}
::selection{background:var(--rose);color:var(--sapin);}
h1,h2,h3{font-family:'Cormorant Garamond',serif;font-weight:300;color:var(--titre);line-height:1.04;letter-spacing:-.01em;text-wrap:balance;}
h3{line-height:1.08;}
h4{font-family:'Cormorant Garamond',serif;font-weight:400;color:var(--titre);line-height:1.25;text-wrap:balance;}   /* H4 compact ; .pied h4 reste une étiquette */
h1 em,h2 em,h3 em{font-style:italic;color:var(--sauge);}
p{text-wrap:pretty;}
strong{font-weight:600;}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gout);}
@media(max-width:600px){:root{--gout:20px;}}

/* ---------- Petites capitales, numéros, chiffres ---------- */
.caps{display:block;font-weight:500;font-size:var(--t-xs);letter-spacing:.32em;text-transform:uppercase;color:var(--accent);margin-bottom:16px;}
.num{font-variant-numeric:lining-nums proportional-nums;}
.tab{font-variant-numeric:tabular-nums;}
/* Numéros 01, 02… : une étiquette forte en Raleway, commune à tout le site (les pages n'en gardent plus de copie) */
.n-romain{font-family:'Raleway',sans-serif;font-style:normal;font-weight:500;font-size:var(--t-xs);line-height:1;letter-spacing:.32em;
  color:var(--sauge-fonce);font-variant-numeric:tabular-nums lining-nums;}

/* ---------- Fil du temps : progression de lecture sous l'en-tête ---------- */
.fil{position:fixed;top:0;left:0;right:0;height:1px;background:var(--sapin);transform-origin:0 50%;transform:scaleX(0);z-index:60;pointer-events:none;}

/* ---------- En-tête ---------- */
.tete{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .4s,border-color .4s;border-bottom:1px solid transparent;}
/* Le flou vit sur un calque à part : un backdrop-filter sur .tete en ferait le cadre de référence du menu
   plein écran (position:fixed) et l'enfermerait dans les 72 px de l'en-tête (bug du 08/10/2026). */
.tete::before{content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .4s;
  background:rgba(251,249,246,.92);background:color-mix(in srgb,var(--fond) 92%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);}
.tete.plein::before{opacity:1;} .tete.plein{border-color:var(--filet);}
.tete-in{max-width:var(--wrap);margin:0 auto;padding:16px var(--gout);display:flex;align-items:center;justify-content:space-between;gap:24px;}
.marque{display:flex;align-items:baseline;gap:6px;text-decoration:none;color:var(--sauge);white-space:nowrap;}
.marque .s{font-family:'Joshico',cursive;font-size:23px;font-variant-ligatures:none;font-feature-settings:"calt" 0,"liga" 0,"dlig" 0;}
.marque .e{color:var(--or);font-size:10px;align-self:flex-start;}
.marque .c{font-size:10px;letter-spacing:.3em;text-transform:uppercase;}
.nav{display:flex;align-items:center;gap:26px;}
.nav a{text-decoration:none;font-weight:500;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--texte);position:relative;padding:4px 0;}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--sapin);transform:scaleX(0);transform-origin:right;transition:transform .5s var(--douce);}
.nav a:hover::after,.nav > a[aria-current]::after{transform:scaleX(1);transform-origin:left;}
.nav > a[aria-current]{color:var(--sapin);}   /* page ou section courante ; « > » laisse de côté le sélecteur de langue */
.nav .club{border:1px solid var(--sapin);padding:9px 16px;color:var(--sapin);}
.nav .club::after{display:none;}
.nav .club:hover{background:var(--sapin);color:#fff;}
.nav .club .e{color:var(--or);}
.langue{font-size:11px;letter-spacing:.12em;color:var(--doux);padding-left:18px;border-left:1px solid var(--filet);}
.langue a{font-size:11px;letter-spacing:.12em;opacity:.55;} .langue a[aria-current]{opacity:1;}
.burger{display:none;background:none;border:none;cursor:pointer;width:44px;height:44px;position:relative;z-index:70;}   /* cible tactile 44 px */
.burger span{position:absolute;left:10px;right:10px;height:1px;background:var(--sapin);transition:transform .45s var(--douce),top .45s var(--douce);}
.burger span:first-child{top:18px;} .burger span:last-child{top:25px;}
.menu-ouvert .burger span:first-child{top:22px;transform:rotate(45deg);} .menu-ouvert .burger span:last-child{top:22px;transform:rotate(-45deg);}
body.menu-ouvert{overflow:hidden;touch-action:none;}   /* la page ne défile pas sous le menu ouvert */
@media(max-width:1180px){
  .burger{display:block;}
  .nav{position:fixed;inset:0;z-index:65;background:var(--fond);flex-direction:column;align-items:flex-start;justify-content:center;justify-content:safe center;
    gap:6px;padding:0 var(--gout);opacity:0;visibility:hidden;transition:opacity .45s var(--douce),visibility .45s;
    overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;}
  .menu-ouvert .nav{opacity:1;visibility:visible;}
  .nav a{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(34px,9vw,52px);letter-spacing:-.01em;text-transform:none;line-height:1.15;}
  .nav .club{border:none;padding:4px 0;margin-top:14px;font-style:italic;}
  .nav .club:hover{background:none;color:var(--sapin);}
  .langue{border:none;padding:24px 0 0;}
  .langue a{font-family:'Raleway',sans-serif;font-size:13px;padding:10px 6px;}
}

/* ---------- Sections ---------- */
main{display:block;}
.sec{padding:var(--sec) 0;}
.sec.alt{background:var(--fond-alt);}
.sec.sapin{background:var(--sapin);color:#E9EFEC;} .sec.sapin h2,.sec.sapin h3{color:#fff;} .sec.sapin .caps{color:var(--or);}
.sec.sapin h2 em{color:var(--vert-gris);}
@media(max-width:700px){.sec{padding:var(--sec-m) 0;}}
.sec.premiere{padding-top:32px;}                      /* première section sous l'en-tête de page */
@media(max-width:700px){.sec.premiere{padding-top:24px;}}
.filet{border:none;border-top:1px solid var(--filet);}

/* En-tête de page (toutes les pages sauf l'accueil) */
.entete{padding-top:150px;padding-bottom:56px;}       /* vertical seulement : le retrait latéral reste celui de .wrap */
.entete h1{font-size:var(--h-1);max-width:14ch;}
.entete .chapo{display:grid;grid-template-columns:1fr 1.25fr;gap:48px;align-items:end;margin-top:36px;padding-top:20px;border-top:1px solid var(--filet-fort);}
.entete .chapo p{font-size:var(--t-l);max-width:560px;}
.entete .chapo .meta{font-size:var(--t-s);letter-spacing:.06em;color:var(--doux);}
.entete .chapo > p:only-child{grid-column:2;}          /* chapeau sans information courte : il garde sa colonne */
@media(max-width:820px){.entete{padding-top:120px;padding-bottom:40px;}.entete .chapo{grid-template-columns:1fr;gap:16px;margin-top:32px;}
  .entete .chapo > p:only-child{grid-column:auto;}}

/* Titre de section en deux colonnes */
.titre-sec{display:grid;grid-template-columns:1fr 1.3fr;gap:48px;align-items:end;margin-bottom:48px;}
.titre-sec h2{font-size:var(--h-2);}
.titre-sec p{font-size:var(--t-l);max-width:540px;}
.titre-sec.seul{grid-template-columns:1fr;}
@media(max-width:820px){.titre-sec{grid-template-columns:1fr;gap:16px;margin-bottom:32px;}}

/* Appel au Club en fin de page : toujours <section class="sec alt"><div class="wrap appel">, centré sur fond crème.
   Le fond sapin reste réservé à une seule section-image ou programme par page. */
.appel{text-align:center;}
.appel h2{font-size:var(--h-2);}
.appel p{max-width:620px;margin:20px auto 0;font-size:var(--t-l);}
.appel .rang-btn{justify-content:center;}

/* Texte long (journal, mentions) */
.lecture{max-width:680px;margin:0 auto;font-size:18px;line-height:1.85;}
.lecture > * + *{margin-top:1.1em;}
.lecture h2{font-size:var(--h-theme);margin-top:2em;}
.lecture h3{font-size:26px;margin-top:1.6em;}
.lecture ol{padding-left:1.2em;} .lecture li + li{margin-top:.4em;}
.lecture ul{list-style:none;padding-left:0;border-top:1px solid var(--filet);}      /* liste à tirets, entre filets */
.lecture ul li{position:relative;padding:14px 0 14px 28px;border-bottom:1px solid var(--filet);}
.lecture ul li + li{margin-top:0;}
.lecture ul li::before{content:"";position:absolute;left:0;top:1.55em;width:12px;height:1px;background:var(--sapin);}
.lecture strong{color:var(--sapin);}
.lecture a{text-decoration-thickness:1px;text-underline-offset:3px;color:var(--sapin);}
.lecture .lettrine::first-letter{font-family:'Cormorant Garamond',serif;font-weight:300;float:left;font-size:5.2em;line-height:.82;padding:.06em .1em 0 0;color:var(--sapin);}
.lecture blockquote{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:30px;line-height:1.25;color:var(--sapin);padding:8px 0 8px 0;border-top:1px solid var(--filet);border-bottom:1px solid var(--filet);}
.lecture figure{margin:2.2em -60px;} .lecture figcaption{font-size:13px;color:var(--doux);margin-top:10px;padding:0 60px;}
@media(max-width:820px){.lecture figure{margin:2em 0;} .lecture figcaption{padding:0;}}
/* Titre numéroté (pages légales) */
.lecture h2.numero{display:flex;align-items:baseline;gap:14px;}
.lecture h2.numero .n-romain{font-size:12px;min-width:3.2em;flex:none;}
.lecture h2.numero .n-libelle{text-wrap:balance;}
/* Lien de retour en pied de texte */
.lecture .retour{margin-top:3em;padding-top:28px;border-top:1px solid var(--filet);}
/* Devise en fin de texte */
.signe{margin-top:48px;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:24px;color:var(--sapin);}
@media(max-width:600px){.lecture h2.numero .n-romain{min-width:3em;}}

/* Fiche : tableau à filets. th[scope=row] = libellé en petites capitales (38 %) ;
   avec un <thead>, la première cellule de chaque ligne est un nom en Cormorant. Empilé sous 600 px (libellés via data-l). */
.fiche{width:100%;border-collapse:collapse;border-top:1px solid var(--filet-fort);font-size:15px;line-height:1.6;}   /* corps compact : 15 px, 16 au téléphone */
.fiche th,.fiche td{text-align:left;vertical-align:baseline;padding:14px 16px 14px 0;border-bottom:1px solid var(--filet);}
.fiche th:last-child,.fiche td:last-child{padding-right:0;}
.fiche th{font-weight:500;font-size:var(--t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--doux);}
.fiche th[scope="row"]{width:38%;padding-right:24px;}
.fiche thead th:first-child{width:22%;}
.fiche td{color:var(--texte);overflow-wrap:anywhere;}
.fiche td:first-child{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:var(--h-4);line-height:1.25;color:var(--sapin);}
@media(max-width:600px){
  .fiche{font-size:var(--t-m);}
  .fiche th[scope="row"]{width:auto;padding-right:0;}
  .fiche thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
  .fiche tr{display:block;padding:14px 0;border-bottom:1px solid var(--filet);}
  .fiche th,.fiche td{display:block;width:auto;padding:0;border:none;}
  .fiche th{margin-bottom:4px;}
  .fiche td + td{margin-top:8px;}
  .fiche td[data-l]::before{content:attr(data-l);display:block;margin-bottom:2px;font-size:var(--t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--doux);}
}

/* Liste éditoriale à filets (remplace les cartes) */
.liste{list-style:none;border-top:1px solid var(--filet-fort);}
.liste > li{display:grid;grid-template-columns:80px 1fr 1.4fr;gap:32px;align-items:baseline;padding:28px 0;border-bottom:1px solid var(--filet);}
.liste h3{font-size:var(--h-3);}
.liste p{max-width:560px;}
@media(max-width:820px){.liste > li{grid-template-columns:1fr;gap:6px;padding:24px 0;}}

/* Planche : image + texte qui alternent */
.planche{display:grid;grid-template-columns:repeat(12,1fr);gap:32px;align-items:center;}
.planche + .planche{margin-top:120px;}
.planche .visuel{grid-column:1 / span 7;} .planche .texte{grid-column:9 / span 4;}
.planche.inverse .visuel{grid-column:6 / span 7;order:2;} .planche.inverse .texte{grid-column:1 / span 4;}
.planche h3{font-size:var(--h-3);margin-bottom:12px;}
.planche .texte p + p{margin-top:12px;}
@media(max-width:820px){.planche{grid-template-columns:1fr;gap:20px;} .planche .visuel,.planche .texte,.planche.inverse .visuel,.planche.inverse .texte{grid-column:auto;order:0;} .planche + .planche{margin-top:72px;}}

/* Images : angles vifs, cadrage soigné */
.cadre{position:relative;overflow:hidden;background:#E8E2DA;}
.cadre img,.cadre video{width:100%;height:100%;object-fit:cover;}
.r-34{aspect-ratio:3/4;} .r-45{aspect-ratio:4/5;} .r-43{aspect-ratio:4/3;} .r-11{aspect-ratio:1;} .r-169{aspect-ratio:16/9;} .r-pano{aspect-ratio:21/9;}
figcaption,.legende{font-size:var(--t-s);letter-spacing:.03em;color:var(--doux);margin-top:12px;}

/* Mosaïque libre sur 12 colonnes */
.mosaique{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;}
@media(max-width:820px){.mosaique{grid-template-columns:repeat(2,1fr);gap:14px;} .mosaique > *{grid-column:auto!important;margin:0!important;} .mosaique > .large{grid-column:1 / -1!important;}}

/* Citation */
.citation{max-width:860px;margin:0 auto;text-align:center;font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:300;
  font-size:clamp(30px,3.8vw,52px);line-height:1.18;color:var(--sapin);}
.citation cite{display:block;margin-top:22px;font-family:'Raleway',sans-serif;font-style:normal;font-weight:500;font-size:var(--t-xs);letter-spacing:.32em;text-transform:uppercase;color:var(--accent);}
.sec.sapin .citation cite{color:var(--or);}

/* ---------- Boutons et liens ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 28px;font:500 12px 'Raleway',sans-serif;letter-spacing:.16em;
  text-transform:uppercase;text-decoration:none;border:1px solid var(--sapin);color:var(--sapin);background:transparent;cursor:pointer;
  transition:background .35s var(--douce),color .35s var(--douce);}
.btn:hover{background:var(--sapin);color:#fff;}
.btn.plein{background:var(--sapin);color:#fff;} .btn.plein:hover{background:#1D3D37;border-color:#1D3D37;}
.btn .e{color:var(--or);}
.sec.sapin .btn{border-color:#fff;color:#fff;} .sec.sapin .btn:hover{background:#fff;color:var(--sapin);}
.sec.sapin .btn.plein{background:#fff;border-color:#fff;color:var(--sapin);} .sec.sapin .btn.plein .e{color:var(--or);}
.sec.sapin .btn.plein:hover{background:var(--creme);border-color:var(--creme);}
.rang-btn{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px;}
.lien{display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-weight:500;font-size:12px;line-height:1;letter-spacing:.16em;text-transform:uppercase;color:var(--sapin);}
.lien::after{content:"";width:34px;height:1px;background:currentColor;transition:width .5s var(--douce);}
.lien:hover::after{width:58px;}
.lien.arriere{flex-direction:row-reverse;}            /* retour : le trait passe devant le texte */
:focus-visible{outline:2px solid var(--or);outline-offset:3px;}
@media(max-width:600px){.lien{padding:12px 0;}}     /* cible tactile ≥ 44 px */

/* ---------- Volets repliables (FAQ, programmes) ---------- */
.volets{border-top:1px solid var(--filet-fort);}
.volets details{border-bottom:1px solid var(--filet);}
.volets summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:64px 1fr 28px;gap:20px;align-items:baseline;padding:26px 0;}
.volets summary::-webkit-details-marker{display:none;}
.volets summary h3{font-size:var(--h-q);line-height:1.3;}
.volets summary .pm{position:relative;width:16px;height:16px;align-self:center;}
.volets summary .pm::before,.volets summary .pm::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--sapin);transition:transform .45s var(--douce);}
.volets summary .pm::after{transform:rotate(90deg);}
.volets details[open] summary .pm::after{transform:rotate(0);}
.volets .corps{padding:0 48px 30px 84px;max-width:860px;}
.volets .corps p + p{margin-top:12px;}
@media(max-width:700px){.volets summary{grid-template-columns:36px 1fr 20px;gap:12px;} .volets .corps{padding:0 0 26px 48px;}}

/* ---------- Formulaires : un filet, pas de boîte ---------- */
.champ{display:block;margin-bottom:26px;}
.champ span{display:block;font-weight:500;font-size:var(--t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--doux);margin-bottom:6px;}
.champ input,.champ textarea,.champ select{width:100%;font:400 18px 'Raleway',sans-serif;color:var(--texte);background:transparent;border:none;
  border-bottom:1px solid var(--sapin);padding:10px 0;border-radius:0;outline:none;transition:border-color .3s;}
.champ input:focus,.champ textarea:focus{border-bottom-color:var(--or);}
.case{display:flex;gap:12px;align-items:flex-start;font-size:var(--t-s);color:var(--doux);margin-bottom:22px;}
.case input{margin-top:4px;accent-color:var(--sapin);}
@media(max-width:600px){.case{font-size:14px;} .case input{flex:none;width:22px;height:22px;margin-top:2px;}}

/* ---------- Pied de page ---------- */
.pied{background:var(--sapin);color:#DCE6E2;padding:90px 0 40px;}
.pied a{text-decoration:none;color:#DCE6E2;} .pied a:hover{color:#fff;}
.pied-haut{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:48px;padding-bottom:60px;border-bottom:1px solid rgba(255,255,255,.18);}
.pied .devise{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:300;font-size:clamp(30px,3.4vw,46px);line-height:1.12;color:#fff;max-width:14ch;}
.pied .devise .e{color:var(--or);font-style:normal;font-size:.5em;vertical-align:super;}
.pied h4{font-family:'Raleway',sans-serif;font-weight:500;font-size:var(--t-xs);line-height:1.04;letter-spacing:.32em;text-transform:uppercase;color:var(--or);margin-bottom:16px;}
.pied ul{list-style:none;} .pied li{margin-bottom:8px;font-size:15px;}
.pied-bas{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:28px;font-size:12px;letter-spacing:.06em;color:#B9CBC5;}
@media(max-width:820px){.pied-haut{grid-template-columns:1fr 1fr;} .pied .devise{grid-column:1 / -1;}}
@media(max-width:600px){.pied li{font-size:var(--t-m);} .pied-bas{font-size:13px;} .pied-bas a{display:inline-block;padding:6px 0;}}

/* ---------- Révélations (seulement si JS actif et mouvement autorisé) ---------- */
.anim .rv{opacity:0;transform:translateY(28px);transition:opacity 1s var(--douce),transform 1s var(--douce);}
.anim .rv.vu{opacity:1;transform:none;}
.anim .voile{clip-path:inset(0 0 100% 0);transition:clip-path 1.4s var(--douce);}
.anim .voile.vu{clip-path:inset(0 0 0 0);}
.anim .voile img,.anim .voile video{transform:scale(1.08);transition:transform 1.8s var(--douce);}
.anim .voile.vu img,.anim .voile.vu video{transform:none;}
@media (prefers-reduced-motion: reduce){
  @view-transition{navigation:none;}
  .fil{display:none;}
}

/* Utilitaires */
.centre{text-align:center;} .mt-l{margin-top:64px;} .mt-m{margin-top:32px;} .doux{color:var(--doux);}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ---------- Signature du Shiny Club (08/10/2026) : ✦ / « Le Shiny » en Joshico / CLUB en capitales ----------
   La même que le logo du Club (logos/shiny_club/). Réservée au Club, jamais pour la marque. */
.club-l{display:inline-flex;flex-direction:column;align-items:center;line-height:1;white-space:nowrap;}
.club-l .e{color:var(--or);font-size:.62em;line-height:1;margin-bottom:.1em;}
.club-l .s{font-family:'Joshico',cursive;font-variant-ligatures:none;font-feature-settings:"calt" 0,"liga" 0,"dlig" 0;
  text-transform:none;letter-spacing:0;font-size:1.9em;line-height:.95;color:var(--sauge-fonce);padding:0 .12em .08em;}
.club-l .c{font-family:'Raleway',sans-serif;font-weight:500;font-size:.72em;letter-spacing:.34em;text-indent:.34em;text-transform:uppercase;color:var(--sapin);}
/* en ligne (boutons, pied de page) : « le Shiny » puis CLUB, sur la même ligne */
.club-l.en-ligne{flex-direction:row;align-items:baseline;gap:.45em;vertical-align:baseline;}
.club-l.en-ligne .s{font-size:1.7em;line-height:0;padding:0 .08em;}
.club-l.en-ligne .c{font-size:1em;letter-spacing:inherit;text-indent:0;color:inherit;}
.btn .club-l.en-ligne .s{color:inherit;}
.pied .club-l.en-ligne .s{color:#fff;font-size:1.5em;} .pied .club-l.en-ligne .c{font-size:.8em;letter-spacing:.24em;}
/* l'onglet du menu : la signature empilée, sans cadre */
.nav .club{border:none;padding:0 4px;display:inline-flex;align-items:center;}
.nav .club:hover{background:none;color:var(--sapin);}
.nav .club .club-l{font-size:11px;}
.nav .club .club-l .s{font-size:21px;}
.nav .club .club-l .c{font-size:8px;}
.nav .club[aria-current] .club-l .s{color:var(--sapin);}
@media(max-width:1180px){
  .nav .club{margin-top:18px;padding:0;}
  .nav .club .club-l{align-items:flex-start;font-size:13px;}
  .nav .club .club-l .s{font-size:44px;} .nav .club .club-l .c{font-size:11px;text-indent:0;}
}
/* le titre de la page Club et le médaillon des appels */
.club-h1{font-size:16px;overflow:visible;padding-top:.2em;}
.club-h1 .club-l{vertical-align:top;}   /* sans cela, l alignement sur la ligne de base ajoutait ~30 px au-dessus de l étoile (09/10/2026) */
.anim .club-h1{animation:club-h1 1.4s var(--douce) both;}
@keyframes club-h1{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion: reduce){.anim .club-h1{animation:none;}}
.club-h1 .club-l{align-items:flex-start;}
.club-h1 .club-l .e{font-size:22px;margin:0 0 18px .5em;}
.club-h1 .club-l .s{font-size:var(--h-1);line-height:1;padding:0 .1em .12em 0;}
.club-h1 .club-l .c{font-size:clamp(14px,1.6vw,20px);text-indent:0;margin-top:4px;}
.club-medaillon{display:block;width:88px;height:88px;margin:0 auto 22px;}
/* Le médaillon du Club sert d'appel : on clique sur le logo (le bandeau « Rejoindre le Shiny Club » est retiré, 08/10/2026) */
.club-appel{display:inline-flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none;color:var(--sapin);margin:0 auto 26px;}
.appel .club-appel,.club-appel.seul{display:flex;width:max-content;}
.club-appel img{width:120px;height:120px;transition:transform .9s var(--douce),filter .6s;}
.club-appel span{font-size:var(--t-xs);font-weight:500;letter-spacing:.32em;text-indent:.32em;text-transform:uppercase;display:inline-flex;align-items:center;gap:10px;}
.club-appel span::after{content:"";width:22px;height:1px;background:currentColor;transition:width .5s var(--douce);}
.club-appel:hover img{transform:rotate(-8deg) scale(1.06);filter:drop-shadow(0 8px 14px rgba(40,82,74,.18));}
.club-appel:hover span::after{width:44px;}
.club-appel:focus-visible{outline:2px solid var(--or);outline-offset:6px;border-radius:50%;}
.sec.sapin .club-appel{color:#fff;}
@media (prefers-reduced-motion: reduce){.club-appel img{transition:none;}}
.club-appel.fin{margin:34px auto 0;}
/* La devise du pied de page dans la typo des petites capitales du site (Thibault, 08/10/2026) */
.pied .devise{font-family:'Raleway',sans-serif;font-style:normal;font-weight:500;font-size:clamp(13px,1.15vw,15px);line-height:2;
  letter-spacing:.34em;text-transform:uppercase;color:#fff;max-width:none;white-space:nowrap;}
.pied .devise .e{font-size:1.1em;vertical-align:baseline;margin-left:.2em;letter-spacing:0;}

/* Justification homogène des paragraphes de lecture (Thibault, 08/10/2026), toujours avec la coupure des mots.
   Ni les textes centrés (appels, seuil), ni les listes, ni les légendes, ni les textes courts à côté d'un titre (blancs trop visibles). */
.lecture > p,.pres-texte > p:not(.signe){
  text-align:justify;hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:6 3 3;}

/* Téléphone (≤ 600 px) : jamais de justification, les blancs y deviennent des trous (arbitrage du 08/10/2026) */
@media(max-width:600px){
  .lecture > p,.pres-texte > p,.recit-a .texte > p{text-align:left;hyphens:manual;-webkit-hyphens:manual;}
}

/* Chapeaux de page : une seule colonne alignée sous le titre, partout (cohérence, 08/10/2026) */
.entete .chapo{display:block;max-width:760px;}
.entete .chapo > p:only-child{grid-column:auto;}
.entete .chapo p{max-width:62ch;}
.entete .chapo p + p,.entete .chapo .meta + p{margin-top:12px;}
.entete .chapo .meta{display:block;margin-bottom:10px;}