/* ============================================================
   ATANOR — styles spécifiques (cartes, fiches, accents alchimiques)
   Complète shared.css.
   ============================================================ */
:root{
  --ata-gold:#8a6a1f; --ata-gold-b:#b8892f; --ata-red:#8f2f22; --ata-ink:#2b2620;
  --ata-green:#3f6b3a; --ata-blue:#2f5b78;
}

/* En-tête de carte : chiffre romain · nom · lettre */
.atanor-head{ display:flex; align-items:baseline; gap:10px; }
.atanor-roman{ color:var(--ata-gold-b); font-weight:700; font-size:15px; min-width:34px; }
.atanor-nom{ color:var(--ata-red); font-weight:700; font-size:18px; flex:1; }
.atanor-lettre{ color:var(--ata-gold-b); font-weight:700; font-size:15px; }

.atanor-tranche{ letter-spacing:.14em; font-size:11px; color:var(--ata-gold-b);
  font-weight:600; margin:6px 0 10px; }

.atanor-dit, .atanor-invite{ font-size:14px; line-height:1.6; margin:0 0 6px; color:var(--text-secondary); }
.atanor-dit em, .atanor-invite em{ color:var(--ata-red); font-style:italic; font-weight:500; }
.atanor-intro{ font-style:italic; color:var(--ata-red); font-size:15px; margin-bottom:8px; }
.atanor-note{ border-top:1px solid var(--border); padding-top:8px; margin-top:8px;
  font-size:13px; color:var(--text-secondary); }
.atanor-poeme p{ font-style:italic; color:var(--text-secondary); margin:0 0 3px; font-size:14px; line-height:1.5; }

/* Les trois axes de lecture */
.atanor-axes{ display:flex; gap:16px; flex-wrap:wrap; margin-top:12px; }
.atanor-axe{ flex:1; min-width:150px; }
.atanor-axe-label{ display:block; text-transform:uppercase; letter-spacing:.1em;
  font-size:11px; font-weight:700; padding-bottom:4px; margin-bottom:6px; border-bottom:2px solid; }
.axe-amour .atanor-axe-label{ color:var(--ata-green); }
.axe-activite .atanor-axe-label{ color:var(--ata-gold-b); }
.axe-ame .atanor-axe-label{ color:var(--ata-blue); }
.atanor-axe ul{ margin:0; padding-left:16px; }
.atanor-axe li{ font-size:13px; line-height:1.45; margin-bottom:4px; color:var(--text-secondary); }

/* Carte dans la grille de résultat */
.atanor-card{ background:var(--bg-card); border:1px solid var(--border); border-radius:16px;
  padding:20px; box-shadow:var(--shadow-sm); }
.atanor-card-top{ display:flex; gap:14px; align-items:flex-start; margin-bottom:10px; }
.atanor-card-img{ width:74px; flex-shrink:0; border-radius:6px; box-shadow:0 2px 10px rgba(0,0,0,.12); }
.atanor-card-info{ flex:1; min-width:0; }
.atanor-card.type-noire{ border-color:#4a4136; background:linear-gradient(#fbf7ee,#efe9db); }
.atanor-card.type-blanche{ border-color:var(--ata-gold-b); }
.atanor-card.type-colere{ border-color:var(--ata-red); }

/* Encadré « lecture de la carte Rouge / voisines » */
.atanor-context{ margin-top:12px; padding:12px 14px; border-radius:10px;
  background:rgba(143,47,34,.05); border:1px solid rgba(143,47,34,.15); font-size:13px; line-height:1.5; }
.atanor-context .ctx-title{ font-weight:700; color:var(--ata-red); margin-bottom:6px; font-size:12px;
  text-transform:uppercase; letter-spacing:.06em; }
.atanor-context .ctx-adj strong{ color:var(--ata-ink); }

/* ============================================================
   THÈME SOMBRE (fond chaud sombre, or, feu — jamais noir pur)
   ============================================================ */
:root[data-theme="sombre"]{
  --bg:#1b1510; --bg-card:#241c14; --bg-card-hover:#2d2318;
  --text:#f2e8d6; --text-secondary:#cbb896; --text-muted:#9c8a6c;
  --border:rgba(210,170,90,0.16); --border-hover:rgba(210,170,90,0.34);
  --accent:#d3a24a; --positive:#7bbf6a; --negative:#e0664f; --neutral:#b7a684;
  --shadow-sm:0 1px 6px rgba(0,0,0,0.4); --shadow-md:0 6px 20px rgba(0,0,0,0.5);
  --shadow-lg:0 12px 40px rgba(0,0,0,0.6);
  --glass:rgba(24,17,11,0.66);
  --ata-gold:#c99a3f; --ata-gold-b:#e0b45a; --ata-red:#e07a54; --ata-ink:#f2e8d6;
  --ata-green:#8fbf7a; --ata-blue:#79b0d0;
}
:root[data-theme="sombre"] body{
  background:
    radial-gradient(120% 80% at 50% -10%, #3a2410 0%, #241811 40%, #16110b 100%) fixed;
}
:root[data-theme="sombre"] nav{ border-bottom-color:rgba(210,170,90,0.18); }
:root[data-theme="sombre"] .btn-dark{ background:linear-gradient(#3a2b18,#2a2013); color:#f0e2c4;
  border:1px solid rgba(210,170,90,0.35); }
:root[data-theme="sombre"] .btn-light{ background:rgba(255,255,255,0.06); color:#f0e2c4;
  border:1px solid rgba(210,170,90,0.30); }
:root[data-theme="sombre"] .choice-card{ background:var(--bg-card); }
:root[data-theme="sombre"] .hero h1{ -webkit-text-fill-color:initial; background:none;
  color:#e7b85a; text-shadow:0 0 22px rgba(210,150,60,.35); }
:root[data-theme="sombre"] .atanor-card.type-noire{ background:linear-gradient(#241c14,#1c1610); }

/* ============================================================
   BOUTON BASCULE DE THÈME
   ============================================================ */
.theme-toggle{
  position:fixed; right:18px; bottom:18px; z-index:800;
  display:inline-flex; align-items:center; gap:8px;
  padding:9px 16px; border-radius:100px; cursor:pointer;
  font-family:var(--font); font-size:13px; font-weight:600;
  color:var(--text); background:var(--glass);
  backdrop-filter:saturate(180%) blur(14px); -webkit-backdrop-filter:saturate(180%) blur(14px);
  border:1px solid var(--border-hover); box-shadow:var(--shadow-md);
  transition:transform .2s ease, box-shadow .2s ease;
}
.theme-toggle:hover{ transform:translateY(-2px); box-shadow:var(--shadow-lg); }
.theme-toggle .tt-icon{ font-size:15px; color:var(--ata-gold-b); }

/* ============================================================
   HALO CENTRAL DU TORE (pulse + change de couleur)
   ============================================================ */
.tore-halo{
  position:absolute; top:50%; left:50%; width:300px; height:300px; margin:-150px 0 0 -150px;
  border-radius:50%; pointer-events:none; z-index:0;
  background:radial-gradient(circle,
     rgba(255,190,70,0.55) 0%, rgba(255,110,45,0.30) 42%, rgba(255,90,40,0) 72%);
  opacity:.35;
  animation:haloPulse 4.2s ease-in-out infinite, haloHue 14s linear infinite;
}
@keyframes haloPulse{ 0%,100%{ transform:scale(0.82); } 50%{ transform:scale(1.12); } }
@keyframes haloHue{ 0%{ filter:blur(8px) hue-rotate(0deg); } 100%{ filter:blur(8px) hue-rotate(360deg); } }
:root[data-theme="sombre"] .tore-halo{ opacity:.95;
  background:radial-gradient(circle,
     rgba(255,205,90,0.75) 0%, rgba(255,120,50,0.45) 40%, rgba(210,60,40,0.12) 66%, rgba(0,0,0,0) 78%); }

/* Étalement des cartes du tore (une à une) */
.tore-card{ transition:transform 0.7s cubic-bezier(.2,.72,.2,1), opacity 0.5s ease; will-change:transform; }

/* ============================================================
   THÈME SOMBRE — corrections de contraste des boutons/badges
   (les éléments à fond clair reçoivent un texte sombre)
   ============================================================ */
:root[data-theme="sombre"] .btn-dark{ background:linear-gradient(#4a3720,#332614); color:#20180f;
  font-weight:600; }
:root[data-theme="sombre"] .btn-dark{ color:#f4ead2; } /* fond foncé -> texte clair, OK */
:root[data-theme="sombre"] .btn-accent{ background:var(--ata-gold-b); color:#241a0e; font-weight:600; }
:root[data-theme="sombre"] .cta-btn{ background:var(--ata-gold-b); color:#241a0e; font-weight:600; }
:root[data-theme="sombre"] .badge-3{ background:var(--ata-gold-b); color:#241a0e; }
:root[data-theme="sombre"] .badge-24{ background:linear-gradient(135deg,#e7d3a6,#d8bd83); color:#241a0e; }
:root[data-theme="sombre"] .answer-badge,
:root[data-theme="sombre"] .result-card-badge{ color:#241a0e; }

/* ============================================================
   PUPILLE CENTRALE DU TORE (l'œil : halo = iris, pupille = noir)
   ============================================================ */
.tore-pupil{
  position:absolute; top:50%; left:50%; width:112px; height:112px; margin:-56px 0 0 -56px;
  border-radius:50%; z-index:0; pointer-events:none;
  background:radial-gradient(circle, #000 0%, #000 50%, rgba(0,0,0,0.7) 66%, rgba(0,0,0,0) 80%);
  box-shadow:0 0 26px 8px rgba(0,0,0,0.30);
}
:root[data-theme="sombre"] .tore-pupil{ box-shadow:0 0 34px 10px rgba(0,0,0,0.55); }

/* Lisibilité du texte central par-dessus la pupille */
.center-name{ text-shadow:0 0 12px rgba(255,246,224,0.92), 0 1px 2px rgba(0,0,0,0.35); }
.center-sub, .center-number{ text-shadow:0 0 9px rgba(255,246,224,0.9); }
:root[data-theme="sombre"] .center-name{ text-shadow:0 0 14px rgba(0,0,0,0.7); }
:root[data-theme="sombre"] .center-sub,
:root[data-theme="sombre"] .center-number{ text-shadow:0 0 10px rgba(0,0,0,0.75); }

/* ============================================================
   TORE ANIMÉ (atanor-deck.js) — mélange « creuset », vague, choix
   ============================================================ */
/* Le conteneur 800×550 est centré hors flux et mis à l'échelle en JS */
.container-wrapper{ position:relative; }
.container-wrapper > .container{ position:absolute; left:50%; top:50%; margin:-275px 0 0 -400px; }

/* pendant la vague, les lames sont animées image par image en JS */
.container.tore-hovering > .card,
.container.tore-hovering > .tore-card{ transition:opacity .4s ease; }
.container.tore-hovering{ cursor:pointer; }

/* lame visée : elle sort du tore et s'illumine */
.tore-hot img{ filter:brightness(1.12) drop-shadow(0 0 10px rgba(224,180,90,.9)) drop-shadow(0 6px 10px rgba(0,0,0,.25)); }

/* le creuset s'embrase pendant le mélange, la pupille se contracte */
.tore-halo, .tore-pupil{ transition:transform .6s cubic-bezier(.2,.8,.2,1), opacity .6s ease; }
.tore-mixing .tore-halo{ opacity:1; animation:haloBlaze .8s ease-in-out infinite, haloHue 3s linear infinite; }
@keyframes haloBlaze{ 0%,100%{ transform:scale(1.25); } 50%{ transform:scale(1.7); } }
.tore-mixing .tore-pupil{ transform:scale(.55); }
.tore-mixing > .card img,
.tore-mixing > .tore-card{ filter:drop-shadow(0 8px 10px rgba(0,0,0,.28)); }

/* lame en vol vers un emplacement */
.tore-flying{ z-index:400 !important; pointer-events:none; }
.tore-flying img{ filter:drop-shadow(0 22px 20px rgba(0,0,0,.35)); }

/* après le choix : les lames restantes s'effacent doucement */
.container.tore-dim > .card{ opacity:.35 !important; filter:saturate(.6); transition:opacity .8s ease, filter .8s ease; }

/* tracé de lecture (la Roue) : de la Noire vers la lame en cours */
.tore-trail{ position:absolute; left:50%; margin-left:-310px; top:0; width:620px; height:550px; overflow:visible; pointer-events:none; z-index:0; }
.tore-trail .trail{ fill:none; stroke:var(--ata-gold-b); stroke-width:3; stroke-linecap:round;
  filter:drop-shadow(0 0 6px rgba(224,180,90,.8)); transition:stroke-dashoffset .7s cubic-bezier(.3,.7,.3,1); }
.tore-trail .trail-bg{ fill:none; stroke:var(--border-hover); stroke-width:1; stroke-dasharray:2 6; }
.tore-trail .trail-dot{ fill:var(--ata-gold-b); filter:drop-shadow(0 0 6px rgba(224,180,90,.9)); transition:opacity .4s; }

/* emplacement en attente de sa carte */
.slot-wrapper.is-next .draw-slot{ background:rgba(184,137,47,.10); animation:slotBreath 1.8s ease-in-out infinite; }
.slot-wrapper.is-next .slot-label{ text-decoration:underline; text-underline-offset:4px; }
@keyframes slotBreath{ 0%,100%{ background:rgba(184,137,47,.06); } 50%{ background:rgba(184,137,47,.20); } }

@media (prefers-reduced-motion: reduce){
  .tore-mixing .tore-halo, .slot-wrapper.is-next .draw-slot{ animation:none; }
}

/* la Roue : la Noire et la Blanche, pôles de la lecture, pulsent après le mélange */
.tore-pole{ animation:polePulse 1.8s ease-in-out infinite; }
@keyframes polePulse{
  0%,100%{ filter:drop-shadow(0 0 2px rgba(224,180,90,.4)); }
  50%{ filter:drop-shadow(0 0 12px rgba(224,180,90,1)) brightness(1.1); }
}
.tore-card.active{ z-index:200; }
@media (prefers-reduced-motion: reduce){ .tore-pole{ animation:none; filter:drop-shadow(0 0 8px rgba(224,180,90,1)); } }

/* ============================================================
   LECTURE CROISÉE (atanor-interpret.js)
   ============================================================ */
.lecture{ text-align:left; background:var(--bg-card); border:1px solid var(--border-hover); border-radius:16px;
  padding:22px 24px; margin-bottom:18px; box-shadow:var(--shadow-sm); }
.lecture-lead{ font-size:15.5px; line-height:1.7; color:var(--text); margin:0 0 6px; }
.lecture-lead em{ color:var(--ata-red); }
.lecture-section{ border-top:1px solid var(--border); margin-top:14px; padding-top:12px; }
.lecture-h{ font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--ata-gold-b); font-weight:700; margin:0 0 8px; }
.lecture p{ font-size:14.5px; line-height:1.7; color:var(--text-secondary); margin:0 0 8px; }
.lecture-trame, .lecture-mots{ font-size:13px !important; letter-spacing:.03em; }
.lecture-mots{ color:var(--text-muted); }
.lecture-invit{ margin:0; padding-left:20px; }
.lecture-invit li{ font-size:14px; line-height:1.6; color:var(--text-secondary); margin-bottom:6px; }
ul.lecture-invit{ list-style:none; padding-left:0; }

/* nom de lame, avec la pastille de la couleur de son dos */
.lame{ font-weight:600; color:var(--ata-red); white-space:nowrap; }
.lame::before, .dos-pastille{ content:''; display:inline-block; width:8px; height:8px; border-radius:50%; margin:0 5px 1px 0;
  vertical-align:middle; background:#999; box-shadow:0 0 0 1px rgba(0,0,0,.25); }
.dos-pastille{ width:10px; height:10px; margin-right:8px; }
[data-dos="vert"]::before, .dos-pastille[data-dos="vert"]{ background:#6f9a5a; }
[data-dos="bleu"]::before, .dos-pastille[data-dos="bleu"]{ background:#7fa6c2; }
[data-dos="jaune"]::before, .dos-pastille[data-dos="jaune"]{ background:#d4b24c; }
[data-dos="rouge"]::before, .dos-pastille[data-dos="rouge"]{ background:#c0674f; }
[data-dos="noir"]::before, .dos-pastille[data-dos="noir"]{ background:#222; }
[data-dos="blanc"]::before, .dos-pastille[data-dos="blanc"]{ background:#f4efe4; }

/* étiquette d'axe */
.axe{ display:inline-block; min-width:62px; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; margin-right:6px; }
.axe-amour{ color:var(--ata-green); } .axe-activite{ color:var(--ata-gold-b); } .axe-ame{ color:var(--ata-blue); }
.lecture-titre{ text-transform:uppercase; letter-spacing:.1em; font-size:12px; font-weight:700; color:var(--ata-gold-b); margin:22px 0 10px; text-align:center; }

/* ============================================================
   TITRES — Cormorant Garamond sur toutes les pages
   (le texte courant reste en Inter ; la police est chargée dans le <head> de chaque page)
   ============================================================ */
:root{ --display:'Cormorant Garamond', Georgia, serif; }
.nav-logo, .title, .page-title, .modal h2, .form-title, .success-title, .profile-name,
.cta-title, .no-data h2, .atanor-nom, .center-name{
  font-family:var(--display); letter-spacing:.01em;
  font-variant-numeric:lining-nums; /* chiffres alignés (le « 3 » ne descend pas sous la ligne) */
}
/* la Cormorant paraît plus petite que l'Inter à taille égale : on compense */
body .nav-logo{ font-size:20px; font-weight:700; letter-spacing:.14em; }
body .title{ font-size:clamp(28px, 7vw, 42px); font-weight:600; line-height:1.1; }
body .page-title{ font-size:clamp(30px, 7vw, 44px); font-weight:600; }
body .modal h2{ font-size:clamp(26px, 6vw, 34px); font-weight:600; }
body .form-title{ font-size:26px; font-weight:600; }
body .success-title{ font-size:30px; font-weight:600; }
body .profile-name{ font-size:28px; font-weight:700; }
body .cta-title{ font-size:23px; font-weight:700; }
body .no-data h2{ font-size:32px; font-weight:600; }
body .atanor-nom{ font-size:21px; line-height:1.1; }
body .center-name{ font-size:28px; line-height:1.05; }

/* Fiche de carte sur mobile : image en haut, repères (n°, chiffre, lettre), puis le nom sur toute la largeur */
@media (max-width: 600px){
  .atanor-card-top{ flex-direction:column; align-items:center; text-align:center; gap:10px; }
  .atanor-card-img{ width:96px; }
  .atanor-card-info{ width:100%; }
  .atanor-head{ flex-wrap:wrap; justify-content:center; gap:4px 12px; }
  .atanor-roman{ min-width:0; }
  body .atanor-nom{ order:3; flex:0 0 100%; text-align:center; font-size:24px; }
  .atanor-card .atanor-tranche{ text-align:center; }
}

/* ============================================================
   CHARTE « PARCHEMIN & OR » — commune à toutes les pages
   (la Blanche = thème clair parchemin ; la Noire = thème sombre)
   ============================================================ */
:root[data-theme="clair"]{
  --bg:#efe5cf; --bg-card:#f8f1e2; --bg-card-hover:#fbf6ea;
  --text:#2b2118; --text-secondary:#5a4a38; --text-muted:#8a765c;
  --border:rgba(122,90,40,.18); --border-hover:rgba(122,90,40,.36);
  --glass:rgba(241,231,210,.84); --accent:#b8892f;
  --shadow-sm:0 1px 6px rgba(60,40,10,.06); --shadow-md:0 6px 20px rgba(60,40,10,.10); --shadow-lg:0 12px 36px rgba(60,40,10,.14);
  --ata-ink:#2b1d10;
}
:root[data-theme] body{ font-variant-numeric:lining-nums; }

/* fond : l'image du creuset en filigrane (l'accueil l'affiche en grand, il n'en a pas besoin) */
body::before{
  content:''; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:url(images/hero-creuset.webp) right center / cover no-repeat;
  opacity:.09; -webkit-mask-image:linear-gradient(90deg, transparent 5%, #000 60%); mask-image:linear-gradient(90deg, transparent 5%, #000 60%);
}
:root[data-theme="sombre"] body::before{ opacity:.16; filter:brightness(.6) saturate(1.1); }
body.page-accueil::before{ display:none; }

/* ---------- Navigation ---------- */
:root[data-theme] nav{ height:64px; border-bottom-color:rgba(184,137,47,.25); }
:root[data-theme] .nav-logo{ display:inline-flex; align-items:center; gap:12px; font-size:22px; letter-spacing:.16em; }
.nav-logo svg{ width:26px; height:26px; stroke:var(--ata-gold-b); fill:none; stroke-width:1.4; }
:root[data-theme] .nav-links{ gap:clamp(18px, 2.6vw, 40px); align-items:center; }
:root[data-theme] .nav-links a{
  font-family:var(--display); font-size:14px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--text); padding:6px 2px;
}
:root[data-theme] .nav-links a:hover{ color:var(--ata-gold-b); }
:root[data-theme] .nav-links a.active::after{ height:1px; bottom:-8px; background:linear-gradient(90deg, transparent, var(--ata-gold-b), transparent); }
:root[data-theme] .nav-links a.active::before{
  content:''; position:absolute; left:50%; bottom:-11px; width:5px; height:5px; margin-left:-2.5px;
  background:var(--ata-gold-b); transform:rotate(45deg);
}
/* sous-menu « Tirages » */
.nav-links .has-sub{ position:relative; }
.nav-sub{ position:absolute; left:50%; top:calc(100% + 14px); transform:translate(-50%, 6px); min-width:200px; list-style:none;
  background:var(--bg-card); border:1px solid var(--border-hover); border-radius:14px; padding:8px; box-shadow:var(--shadow-md);
  opacity:0; visibility:hidden; transition:opacity .2s, transform .2s, visibility .2s; }
.nav-sub::before{ content:''; position:absolute; left:0; right:0; top:-16px; height:16px; } /* passerelle de survol */
.has-sub:hover .nav-sub, .has-sub:focus-within .nav-sub{ opacity:1; visibility:visible; transform:translate(-50%, 0); }
:root[data-theme] .nav-sub a{ display:block; padding:9px 12px; border-radius:9px; font-size:13px; white-space:nowrap; }
:root[data-theme] .nav-sub a:hover{ background:rgba(184,137,47,.12); }
:root[data-theme] .nav-sub a.active::before, :root[data-theme] .nav-sub a.active::after{ display:none; }
:root[data-theme] .nav-sub a.active{ color:var(--ata-gold-b); }

/* interrupteur de thème : la Noire (sombre) ◐ la Blanche (clair) */
.pole-switch{
  display:inline-flex; align-items:center; gap:12px; background:none; border:0; cursor:pointer; padding:6px 4px;
  font-family:var(--display); font-size:13px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--text-muted);
}
.pole-switch .pole{ transition:color .4s; }
.pole-switch .pole::before{ content:'✦'; color:var(--ata-gold-b); margin-right:6px; font-size:10px; }
:root[data-theme="sombre"] .pole-switch .noire, :root[data-theme="clair"] .pole-switch .blanche{ color:var(--text); }
.eclipse{
  width:38px; height:38px; border-radius:50%; flex:none;
  border:1px solid var(--ata-gold-b); box-shadow:0 0 0 3px rgba(184,137,47,.15), 0 0 14px rgba(224,180,90,.45);
  background:linear-gradient(90deg, #15110c 50%, #f2e6c9 50%); transition:transform .8s cubic-bezier(.3,1.3,.5,1);
}
:root[data-theme="sombre"] .eclipse{ transform:rotate(180deg); }
.pole-switch:hover .eclipse{ box-shadow:0 0 0 3px rgba(184,137,47,.25), 0 0 22px rgba(224,180,90,.8); }
@media (max-width:980px){ .pole-switch .pole{ display:none; } }
@media (max-width:768px){ :root[data-theme] nav{ gap:10px; } .pole-switch{ margin-left:auto; } }

/* menu mobile */
:root[data-theme] .sidebar{ background:var(--bg); border-left-color:rgba(184,137,47,.3); }
:root[data-theme] .sidebar a{ font-family:var(--display); font-size:21px; font-weight:600; color:var(--text); border-bottom-color:var(--border); }
:root[data-theme] .sidebar a:hover, :root[data-theme] .sidebar a.active{ color:var(--ata-gold-b); }
:root[data-theme] .sidebar a.sub{ font-size:18px; padding-left:18px; color:var(--text-secondary); }

/* ---------- Titres de page : filet doré orné d'un losange ---------- */
:root[data-theme] .title::after, :root[data-theme] .page-title::after, :root[data-theme] .modal h2::after{
  content:''; display:block; width:150px; height:10px; margin:10px auto 0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='10'%3E%3Cpath d='M0 5H64M86 5H150' stroke='%23b8892f' stroke-width='1'/%3E%3Cpath d='M75 1L79 5L75 9L71 5Z' fill='%23b8892f'/%3E%3C/svg%3E") center no-repeat;
}

/* ---------- Surfaces : plus de blanc pur ---------- */
:root[data-theme] .modal, :root[data-theme] .form-card{ background:var(--bg-card); border-color:var(--border-hover); }
:root[data-theme] .modal{ box-shadow:0 0 0 6px rgba(184,137,47,.08), 0 20px 60px rgba(40,25,5,.25); }
:root[data-theme] .modal-overlay{ background:rgba(30,20,10,.45); }
:root[data-theme] .form-input:focus, :root[data-theme] .form-select:focus, :root[data-theme] .form-textarea:focus{
  background:var(--bg-card); border-color:var(--ata-gold-b); box-shadow:0 0 0 3px rgba(184,137,47,.15);
}
:root[data-theme] .atanor-card, :root[data-theme] .lecture, :root[data-theme] .cta-section{ position:relative; }
:root[data-theme] .lecture::before, :root[data-theme] .cta-section::before{
  content:''; position:absolute; inset:6px; border:1px solid rgba(184,137,47,.2); border-radius:12px; pointer-events:none;
}

/* ---------- Boutons « rituel » : encre et filet d'or ---------- */
:root[data-theme] .btn, :root[data-theme] .cta-btn, :root[data-theme] .form-submit{
  font-family:var(--display); font-size:17px; font-weight:600; letter-spacing:.05em;
}
:root[data-theme] .btn-dark, :root[data-theme] .form-submit{
  background:linear-gradient(#2a2016, #17110b); color:#f3e4c1; border:1px solid #b8892f;
  box-shadow:0 0 0 3px var(--bg), 0 0 0 4px rgba(184,137,47,.45), 0 6px 16px rgba(40,25,5,.2);
}
:root[data-theme] .btn-dark:hover, :root[data-theme] .form-submit:hover{
  box-shadow:0 0 0 3px var(--bg), 0 0 0 4px rgba(224,180,90,.9), 0 8px 20px rgba(40,25,5,.25), 0 0 18px rgba(224,180,90,.3);
}
:root[data-theme] .btn-dark:disabled{ opacity:.45; box-shadow:none; }
:root[data-theme] .btn-light{ background:var(--bg-card); color:var(--text); border:1px solid rgba(184,137,47,.55); }
:root[data-theme] .btn-light:hover{ border-color:var(--ata-gold-b); box-shadow:0 0 14px rgba(224,180,90,.25); }
:root[data-theme] .btn-accent, :root[data-theme] .cta-btn{
  background:linear-gradient(#e0b862, #b8892f); color:#241a0e; border:1px solid #9c7424;
  box-shadow:0 0 0 3px var(--bg), 0 0 0 4px rgba(184,137,47,.5);
}
:root[data-theme] .btn-accent:hover, :root[data-theme] .cta-btn:hover{ box-shadow:0 0 0 3px var(--bg), 0 0 0 4px #e0b862, 0 0 20px rgba(224,180,90,.45); }

/* icônes dorées en ligne fine (remplacent les émojis) */
.ico{ width:18px; height:18px; stroke:var(--ata-gold-b); fill:none; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; vertical-align:-3px; }
.ico-lg{ width:46px; height:46px; stroke-width:1.2; filter:drop-shadow(0 0 10px rgba(224,180,90,.5)); }

/* ============================================================
   PAGES DE L'UNIVERS (univers.html, lames.html)
   ============================================================ */
.page-wrap{ position:relative; z-index:1; padding:64px 20px 0; overflow-x:clip; }
.page-wrap section{ max-width:1100px; margin:0 auto; padding:70px 0 10px; scroll-margin-top:80px; }
.section-kicker{ display:block; text-align:center; font-size:12px; letter-spacing:.24em; text-transform:uppercase; color:var(--ata-gold-b); font-weight:600; margin-bottom:10px; }
.page-wrap .section-title{ font-family:var(--display); font-size:clamp(34px, 5vw, 48px); font-weight:600; text-align:center; color:var(--ata-ink); margin-bottom:8px; line-height:1.1; }
.page-wrap .section-intro{ text-align:center; color:var(--text-secondary); margin:0 auto 34px; max-width:620px; line-height:1.55; font-family:var(--display); font-size:21px; }
.prose-atanor{ max-width:680px; margin:0 auto; font-size:16px; line-height:1.75; color:var(--text-secondary); }
.prose-atanor p{ margin:0 0 14px; }
.prose-atanor strong{ color:var(--text); font-weight:600; }
.citation{ max-width:640px; margin:26px auto; padding:18px 26px; text-align:center; font-family:var(--display); font-style:italic; font-size:clamp(21px, 2.4vw, 27px); line-height:1.4; color:var(--text); position:relative; }
.citation::before, .citation::after{ content:''; display:block; width:120px; height:1px; margin:0 auto; background:linear-gradient(90deg, transparent, var(--ata-gold-b), transparent); }
.citation::before{ margin-bottom:16px; } .citation::after{ margin-top:16px; }
.citation cite{ display:block; margin-top:8px; font-style:normal; font-family:var(--font); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-muted); }
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .8s ease, transform .8s cubic-bezier(.2,.8,.2,1); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; } }
.footer-univers{ padding:60px 20px 40px; font-size:12px; color:var(--text-muted); text-align:center; letter-spacing:.06em; line-height:1.8; }

/* motif d'alvéoles de ruche (discret, en fond de section) */
.alveoles{ position:relative; }
.alveoles::before{
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cpath d='M28 0 L56 16 L56 48 L28 64 L0 48 L0 16 Z M28 64 L28 97' fill='none' stroke='%23b8892f' stroke-opacity='.18' stroke-width='1'/%3E%3C/svg%3E");
  -webkit-mask-image:radial-gradient(ellipse at center, #000 20%, transparent 70%); mask-image:radial-gradient(ellipse at center, #000 20%, transparent 70%);
}

/* ---------- Prototype 3D : étiquette de menu et bandeau d'accueil ---------- */
.tag-proto{ font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--ata-gold-b, #b8892f); border:1px solid rgba(184,137,47,.45);
  border-radius:20px; padding:1px 7px; margin-left:6px; vertical-align:2px; font-weight:600; }
.proto-3d{ position:relative; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); align-items:center; gap:0; max-width:900px; margin:22px auto 0;
  border-radius:var(--radius-lg, 22px); overflow:hidden; text-decoration:none; color:#f3e2b8; border:1px solid rgba(184,137,47,.5);
  background:radial-gradient(ellipse 90% 90% at 30% 70%, #3d2511 0%, #1a100a 50%, #070503 100%); box-shadow:var(--shadow-sm);
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s, border-color .35s; }
.proto-3d::before{ content:''; position:absolute; inset:6px; border:1px solid rgba(224,180,90,.2); border-radius:15px; pointer-events:none; z-index:2; }
.proto-3d:hover{ transform:translateY(-6px); box-shadow:0 26px 60px rgba(0,0,0,.35), 0 0 40px rgba(224,160,70,.18); border-color:rgba(224,180,90,.9); }
.proto-3d .proto-visuel{ position:relative; aspect-ratio:16/10; overflow:hidden; }
.proto-3d .proto-visuel img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform 1.6s cubic-bezier(.2,.8,.2,1); }
.proto-3d:hover .proto-visuel img{ transform:scale(1.06) rotate(-2deg); }
.proto-3d .proto-texte{ padding:28px 30px; }
.proto-3d .proto-kicker{ font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:#e0b45a; font-weight:600; }
.proto-3d h3{ font-family:var(--display); font-size:clamp(28px,3.4vw,36px); font-weight:700; line-height:1.05; margin:8px 0 10px; color:#f6dfae; }
.proto-3d p{ font-size:14.5px; line-height:1.6; color:#d8c29c; margin-bottom:16px; }
.proto-3d .proto-go{ font-family:var(--display); font-size:18px; font-weight:700; color:#e0b45a; }
.proto-3d:hover .proto-go{ letter-spacing:.02em; }
@media (max-width:700px){ .proto-3d{ grid-template-columns:1fr; } .proto-3d .proto-texte{ padding:22px 22px 26px; text-align:center; } }

/* nav : pas de retour à la ligne sur les écrans moyens */
:root[data-theme] .nav-links a{ white-space:nowrap; }
@media (max-width:1180px){
  .pole-switch .pole{ display:none; }
  :root[data-theme] .nav-links{ gap:clamp(14px, 2vw, 26px); }
  :root[data-theme] .nav-links a{ letter-spacing:.1em; font-size:13px; }
}

/* ============================================================
   LE RUCHER — bande cinématique : le Fermier, le logo, les abeilles
   ============================================================ */
.rucher{ position:relative; overflow:hidden; isolation:isolate; background:#0d0906; color:#f3e2b8;
  height:clamp(620px, 100vh, 980px); display:flex; flex-direction:column; justify-content:space-between; }
.rucher-fond{ position:absolute; left:0; right:0; top:-12%; height:124%; z-index:-2; will-change:transform; }
.rucher-fond img{ width:100%; height:100%; object-fit:cover; object-position:62% 40%; display:block;
  animation:respire 30s ease-in-out infinite alternate; transform-origin:62% 30%; }
@keyframes respire{ from{ transform:scale(1); } to{ transform:scale(1.07); } }
.rucher::before{ /* fondus haut/bas vers la nuit, vignette, et assise sombre pour le texte */
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    linear-gradient(180deg, #0d0906 0%, rgba(13,9,6,.35) 14%, rgba(13,9,6,0) 30%, rgba(13,9,6,0) 62%, rgba(13,9,6,.75) 86%, #0d0906 100%),
    linear-gradient(90deg, rgba(13,9,6,.72) 0%, rgba(13,9,6,.25) 38%, rgba(13,9,6,0) 55%),
    radial-gradient(ellipse 120% 90% at 60% 45%, transparent 55%, rgba(13,9,6,.55) 100%);
}
.rucher-haut{ position:relative; padding:clamp(70px, 11vh, 120px) clamp(20px, 6vw, 90px) 0; max-width:min(900px, 56vw); }
.rucher-logo{ display:block; width:100%; height:auto; margin:0;
  filter:drop-shadow(0 10px 30px rgba(0,0,0,.55)) drop-shadow(0 0 40px rgba(255,180,60,.25));
  clip-path:inset(0 0 100% 0); transition:clip-path 2.2s cubic-bezier(.6,0,.2,1); }
.rucher.in .rucher-logo{ clip-path:inset(0 0 -10% 0); }   /* le miel se déverse de haut en bas */
.rucher-titre{ margin:0; font-size:0; line-height:0; }
.rucher-sous{ display:flex; align-items:center; gap:14px; margin-top:14px; padding-left:4%;
  font-size:12px; letter-spacing:.3em; text-transform:uppercase; color:#f0cf86; font-weight:600;
  opacity:0; transform:translateY(12px); transition:opacity 1s 1.6s, transform 1s 1.6s; }
.rucher-sous::before{ content:''; width:40px; height:1px; background:currentColor; }
.rucher.in .rucher-sous{ opacity:1; transform:none; }
.rucher-bas{ position:relative; padding:0 clamp(20px, 6vw, 90px) clamp(60px, 10vh, 110px); max-width:720px; }
.rucher-citation{ font-family:var(--display); font-style:italic; font-weight:500; font-size:clamp(26px, 3.2vw, 42px); line-height:1.15; color:#fff0cc;
  text-shadow:0 2px 24px rgba(0,0,0,.8); margin:0; text-wrap:balance; opacity:0; transform:translateY(20px); transition:opacity 1.2s 2s, transform 1.2s 2s; }
.rucher-citation cite{ display:block; font-style:normal; font-family:var(--font); font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:#d9b56a; margin-top:14px; }
.rucher.in .rucher-citation{ opacity:1; transform:none; }
/* abeilles en vol */
.abeille{ position:absolute; z-index:1; width:var(--t, 34px); pointer-events:none; opacity:.95;
  filter:drop-shadow(0 0 8px rgba(255,190,70,.6)); animation:vol var(--d, 18s) linear infinite; animation-delay:var(--r, 0s); offset-rotate:auto 90deg; }
.abeille img{ width:100%; display:block; animation:bourdonne .12s ease-in-out infinite alternate; }
@keyframes bourdonne{ to{ transform:scaleX(.86); } }
@keyframes vol{ from{ offset-distance:0%; } to{ offset-distance:100%; } }
@supports not (offset-path: path('M0 0')){ .abeille{ display:none; } }
@media (max-width:760px){
  .rucher{ height:clamp(640px, 108vh, 900px); }
  .rucher-fond img{ object-position:50% 40%; transform-origin:50% 35%; }
  .rucher::before{ background:linear-gradient(180deg, #0d0906 0%, rgba(13,9,6,.55) 12%, rgba(13,9,6,0) 32%, rgba(13,9,6,0) 55%, rgba(13,9,6,.85) 82%, #0d0906 100%); }
  .rucher-haut{ max-width:none; padding-top:56px; }
  .rucher-sous{ justify-content:center; padding-left:0; }
  .rucher-sous::after{ content:''; width:40px; height:1px; background:currentColor; }
  .rucher-bas{ text-align:center; }
}
@media (prefers-reduced-motion:reduce){
  .rucher-fond img, .abeille, .abeille img{ animation:none; }
  .abeille{ display:none; }
  .rucher-logo{ clip-path:none; transition:none; }
  .rucher-sous, .rucher-citation{ opacity:1; transform:none; transition:none; }
}
/* petite abeille ornementale */
.orn-abeille{ display:block; width:64px; height:auto; margin:0 auto 18px; filter:drop-shadow(0 0 12px rgba(255,190,70,.45)); }
.rucher-page{ margin-top:64px; height:clamp(560px, calc(100vh - 64px), 900px); }
.page-wrap.page-apres-rucher{ padding-top:0; }
.rucher-page::after{ content:''; position:absolute; left:0; right:0; bottom:0; height:170px; pointer-events:none; background:linear-gradient(180deg, transparent, var(--bg)); }
.rucher-page .rucher-bas{ padding-bottom:190px; }

/* ============================================================
   LES TROIS MIELS — pots illustrés (accueil, univers)
   ============================================================ */
/* les trois Miels : trois pots posés sur la pierre, devant la scène des trois pots */
.miels-scene { position: relative; margin: 90px calc(50% - 50vw) 0; padding: 110px 20px 40px; isolation: isolate; }
.miels-fond { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none;
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 22%, #000 60%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0%, #000 22%, #000 60%, transparent 100%); }
.miels-fond img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; opacity: .24; filter: blur(4px) saturate(1.1); transform: scale(1.06); }
.miels-titre { font-family: var(--display); font-weight: 600; font-size: clamp(40px, 5.4vw, 68px); color: #f6e3b4; line-height: 1; text-shadow: 0 0 40px rgba(224,160,70,.35); }
.miels-intro { font-family: var(--display); font-style: italic; font-size: clamp(20px, 2vw, 25px); color: #d9c29a; margin: 12px auto 0; max-width: 640px; }
.miels { display: grid; grid-template-columns: 1fr; gap: 26px; max-width: 1120px; margin: 70px auto 0; text-align: center; }
@media (min-width: 860px) { .miels { grid-template-columns: repeat(3, 1fr); } }
.miel { position: relative; border-radius: 28px; padding: 250px 28px 30px; margin-top: 120px; display: flex; flex-direction: column; align-items: center; isolation: isolate;
  transition: transform .6s cubic-bezier(.2,.8,.2,1), box-shadow .6s, border-color .6s; }
.pot { position: absolute; left: 50%; top: -130px; width: 380px; height: 360px; transform: translateX(-50%); pointer-events: none; }
.pot::after { /* halo et reflet sur la pierre sous le pot */
  content: ''; position: absolute; left: 12%; right: 12%; bottom: -8px; height: 40px; z-index: -1; border-radius: 50%; filter: blur(14px); opacity: .8; }
.pot img { position: absolute; left: 0; right: 0; bottom: 0; margin: 0 auto; width: auto; height: 100%; max-width: 100%; object-fit: contain; display: block; animation: flotte 7s ease-in-out infinite; transition: transform .7s cubic-bezier(.2,.8,.2,1), filter .7s; }
.miel-hab .pot img { animation-delay: -2.3s; } .miel-trois .pot img { animation-delay: -4.6s; }
@keyframes flotte { 0%, 100% { translate: 0 0; } 50% { translate: 0 -9px; } }
.miel:hover .pot img { transform: scale(1.06) rotate(-2deg); }
.miel .tag { font-size: 11px; letter-spacing: .26em; text-transform: uppercase; font-weight: 600; }
.miel h3 { font-family: var(--display); font-size: clamp(38px, 3.4vw, 50px); font-weight: 700; line-height: 1; margin: 8px 0 8px; }
.miel .aspect { font-family: var(--display); font-style: italic; font-size: 20px; line-height: 1.3; margin-bottom: 14px; }
.miel p { font-size: 14.5px; line-height: 1.65; max-width: 320px; }
.miel .verdict { margin-top: auto; position: relative; top: 0; padding: 9px 26px; margin-top: 24px; border-radius: 6px; font-size: 11.5px; letter-spacing: .3em; text-transform: uppercase; font-weight: 700; }
.miel .verdict::before, .miel .verdict::after { content: ''; position: absolute; top: 50%; width: 5px; height: 5px; margin-top: -2.5px; transform: rotate(45deg); background: currentColor; }
.miel .verdict::before { left: -12px; } .miel .verdict::after { right: -12px; }
.miel-ba { background: linear-gradient(180deg, rgba(40,20,10,.4), rgba(20,10,5,.92) 45%); border: 1px solid rgba(190,100,50,.35); color: #d9c5a0; }
.miel-ba .pot::after { background: radial-gradient(ellipse, rgba(200,70,20,.8), transparent 70%); }
.miel-ba .pot img { filter: drop-shadow(0 20px 30px rgba(0,0,0,.6)) drop-shadow(0 0 30px rgba(220,80,20,.35)); }
.miel-ba .tag { color: #d0874f; } .miel-ba h3 { color: #f0c79a; }
.miel-ba .verdict { color: #e0a070; border: 1px solid rgba(224,140,80,.55); background: rgba(80,30,10,.35); }
.miel-hab { background: linear-gradient(180deg, rgba(90,60,15,.35), rgba(35,22,8,.92) 45%); border: 1px solid rgba(240,190,90,.55); color: #ecdab4; box-shadow: 0 0 60px rgba(233,180,80,.12); }
.miel-hab .pot::after { background: radial-gradient(ellipse, rgba(255,200,90,.95), transparent 70%); }
.miel-hab .pot img { filter: drop-shadow(0 20px 30px rgba(0,0,0,.5)) drop-shadow(0 0 40px rgba(255,190,70,.5)); }
.miel-hab .tag { color: #f0c870; } .miel-hab h3 { color: #ffd98a; }
.miel-hab .verdict { color: #ffd98a; border: 1px solid rgba(255,210,120,.6); background: rgba(120,80,20,.35); }
.miel-trois { background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(16,14,16,.9) 45%); border: 1px solid rgba(230,225,255,.4); color: #e8e2d6;
  box-shadow: inset 0 0 60px rgba(220,220,255,.05); }
.miel-trois .pot::after { background: radial-gradient(ellipse, rgba(240,240,255,.9), transparent 70%); }
.miel-trois .pot img { filter: drop-shadow(0 20px 30px rgba(0,0,0,.5)) drop-shadow(0 0 45px rgba(255,245,220,.45)); }
.miel-trois .tag { color: #d8d2ea; } .miel-trois h3 { color: #fffaf0; }
.miel-trois .verdict { color: #fffaf0; border: 1px solid rgba(255,250,235,.7); text-shadow: 0 0 14px rgba(255,245,220,.8); box-shadow: 0 0 22px rgba(255,245,220,.2); }
.miel-trois::before { content: ''; position: absolute; left: 50%; top: -140px; width: 2px; height: 180px; margin-left: -1px; z-index: -1;   /* le fil de lumière qui descend dans le pot */
  background: linear-gradient(180deg, transparent, rgba(255,250,230,.9), transparent); filter: blur(1px); animation: fil 4s ease-in-out infinite; }
@keyframes fil { 0%, 100% { opacity: .3; } 50% { opacity: 1; } }
@media (max-width: 859px) { .miel { margin-top: 150px; } .miels .miel:first-child { margin-top: 120px; } }
@media (max-width: 480px) { .pot { width: 300px; height: 300px; top: -110px; } .miel { padding-top: 210px; } }
@media (prefers-reduced-motion: reduce){ .pot img, .miel-trois::before{ animation:none; } }
/* bande de nuit pleine largeur dans les pages de contenu */
.page-wrap section.bande-nuit{ max-width:none; margin:80px calc(50% - 50vw) 0; padding:100px 20px 110px; background:#0d0906; color:#eadcbf; position:relative; isolation:isolate; }
.bande-nuit .section-kicker{ color:#e0b45a; }
.bande-nuit .section-title{ color:#f6e3b4; }
.bande-nuit .section-intro{ color:#c8b18a; }
.bande-nuit .miels-scene{ margin:0; padding:20px 0 0; }
.bande-nuit .citation{ color:#f0dcae; }
.bande-nuit .citation cite{ color:#a88c5e; }
.btn-or{ display:inline-flex; align-items:center; gap:12px; text-decoration:none; border-radius:40px; padding:13px 28px; cursor:pointer;
  font-family:var(--display); font-size:17px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#1c1208;
  background:linear-gradient(180deg, #f6dc98, #d9a847 60%, #b8862f); border:1px solid #f3d58c;
  box-shadow:0 0 0 4px rgba(224,180,90,.14), 0 12px 30px rgba(0,0,0,.35); transition:transform .25s, box-shadow .25s; }
.btn-or:hover{ transform:translateY(-2px); box-shadow:0 0 0 5px rgba(224,180,90,.25), 0 0 34px rgba(224,180,90,.5), 0 14px 32px rgba(0,0,0,.4); }

/* renvois vers le Rucher (blog) */
.rucher-liens{ max-width:1080px; margin:0 auto; }
.rucher-liens .rl-titre{ display:block; text-align:center; font-size:11.5px; letter-spacing:.28em; text-transform:uppercase; color:var(--ata-gold-b); font-weight:600; margin-bottom:18px; }
.rucher-liens > div{ display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:12px; }
.rucher-liens > div a{ display:block; padding:16px 20px; border-radius:14px; text-decoration:none; font-family:var(--display); font-size:20px; font-weight:700; line-height:1.2;
  color:var(--ata-ink); background:var(--bg-card); border:1px solid var(--border-hover); transition:border-color .25s, transform .25s; }
.rucher-liens > div a:hover{ border-color:var(--ata-gold-b); transform:translateY(-3px); }
.rucher-liens small{ display:block; font-family:var(--font); font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--ata-gold-b); font-weight:600; margin-bottom:6px; }
.rucher-liens .rl-tout{ display:block; text-align:center; margin-top:18px; font-family:var(--display); font-size:18px; font-weight:700; color:var(--ata-red); text-decoration:none; }
.rucher-liens.sombre > div a{ background:rgba(255,255,255,.04); border-color:rgba(224,180,90,.35); color:#f6e3b4; }
.rucher-liens.sombre .rl-tout{ color:#e9bd62; }


/* ============================================================
   BOUTONS — le style « rituel » partout
   pilule d'encre, filet d'or, anneau, losanges ; les liens secondaires en version filet
   --anneau : couleur de l'anneau extérieur (le fond sur lequel le bouton est posé)
   ============================================================ */
:root { --anneau: var(--bg); }
.nuit, .nuit-m, .bande-nuit, .rucher, .f-tete, .ruban, .savoir, .fin, .finale, .manifeste, .lien-carte.livre { --anneau: #0d0906; }
:root[data-theme] .btn-or, :root[data-theme] .btn-fil, :root[data-theme] .btn, :root[data-theme] .cta-btn, :root[data-theme] .form-submit {
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 14px; text-decoration: none; cursor: pointer;
  font-family: var(--display); font-size: 16px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; line-height: 1.15;
  padding: 14px 32px; border-radius: 40px; overflow: visible; transform: none;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease; }
/* losanges d'ornement */
:root[data-theme] .btn-or::before, :root[data-theme] .btn-or::after, :root[data-theme] .btn::before, :root[data-theme] .btn::after,
:root[data-theme] .cta-btn::before, :root[data-theme] .cta-btn::after, :root[data-theme] .form-submit::before, :root[data-theme] .form-submit::after,
:root[data-theme] .btn-fil::before, :root[data-theme] .btn-fil::after {
  content: ''; position: absolute; top: 50%; left: auto; right: auto; bottom: auto; inset: auto; width: 7px; height: 7px; margin-top: -3.5px;
  background: #b8892f; border: 0; opacity: 1; transform: rotate(45deg); pointer-events: none; z-index: 1; transition: none; }
:root[data-theme] .btn-or::before, :root[data-theme] .btn::before, :root[data-theme] .cta-btn::before, :root[data-theme] .form-submit::before, :root[data-theme] .btn-fil::before { left: -9px; top: 50%; }
:root[data-theme] .btn-or::after, :root[data-theme] .btn::after, :root[data-theme] .cta-btn::after, :root[data-theme] .form-submit::after, :root[data-theme] .btn-fil::after { right: -9px; top: 50%; }
/* principal : encre et or */
:root[data-theme] .btn-or, :root[data-theme] .btn-dark, :root[data-theme] .btn-accent, :root[data-theme] .cta-btn, :root[data-theme] .form-submit {
  background: linear-gradient(#2a2016, #17110b); color: #f3e4c1; border: 1px solid #b8892f;
  box-shadow: 0 0 0 4px var(--anneau), 0 0 0 5px rgba(184,137,47,.55), 0 10px 24px rgba(40,25,5,.3); }
:root[data-theme] .btn-or:hover, :root[data-theme] .btn-dark:hover, :root[data-theme] .btn-accent:hover, :root[data-theme] .cta-btn:hover, :root[data-theme] .form-submit:hover {
  transform: translateY(-2px); background: linear-gradient(#2a2016, #17110b); color: #fff3cf;
  box-shadow: 0 0 0 4px var(--anneau), 0 0 0 5px rgba(224,180,90,.9), 0 14px 30px rgba(40,25,5,.35), 0 0 26px rgba(224,180,90,.35); }
/* secondaire : même forme, en filet */
:root[data-theme] .btn-fil, :root[data-theme] .btn-light {
  background: transparent; color: var(--text); border: 1px solid rgba(184,137,47,.7); box-shadow: 0 0 0 4px var(--anneau), 0 0 0 5px rgba(184,137,47,.25); }
:root[data-theme] .nuit .btn-fil, :root[data-theme] .nuit-m .btn-fil, :root[data-theme] .fin .btn-fil, :root[data-theme] .bande-nuit .btn-fil, :root[data-theme] .nuit .btn-light, :root[data-theme] .bande-nuit .btn-light, :root[data-theme="sombre"] .btn-light, :root[data-theme="sombre"] .btn-fil { color: #f0dcae; }
:root[data-theme] .btn-fil:hover, :root[data-theme] .btn-light:hover { transform: translateY(-2px); background: rgba(184,137,47,.1); border-color: #e0b45a;
  box-shadow: 0 0 0 4px var(--anneau), 0 0 0 5px rgba(224,180,90,.6), 0 0 20px rgba(224,180,90,.2); }
:root[data-theme] .btn:disabled, :root[data-theme] .btn[disabled] { opacity: .45; cursor: not-allowed; transform: none; }
:root[data-theme] .btn-or:focus-visible, :root[data-theme] .btn-fil:focus-visible, :root[data-theme] .btn:focus-visible, :root[data-theme] .cta-btn:focus-visible { outline: 1px solid #e0b45a; outline-offset: 8px; }
/* groupes d'actions : on laisse la place aux losanges et à l'anneau */
:root .actions-centre, :root .fin .actions, :root .lame-actions, :root .porte-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 20px 26px; }
:root .atanor-actions, :root .daily-actions { gap: 18px 24px; padding-left: 10px; }
@media (max-width: 560px) { :root[data-theme] .btn-or, :root[data-theme] .btn-fil, :root[data-theme] .btn, :root[data-theme] .cta-btn, :root[data-theme] .form-submit { font-size: 14.5px; letter-spacing: .08em; padding: 13px 24px; } }

/* ---------- Lecture croisée v2 : Fermiers, Miel, question du jour, pratique ---------- */
.lecture-lame{ display:grid; grid-template-columns:62px 1fr; gap:14px; align-items:start; padding:12px 0; border-bottom:1px dashed var(--border); }
.lecture-lame:last-child{ border-bottom:0; }
.lecture-lame.prio{ background:linear-gradient(90deg, rgba(184,137,47,.10), transparent 70%); border-radius:12px; padding:12px; margin:0 -12px; }
.lecture-vignette{ display:block; width:62px; aspect-ratio:2/3; border-radius:40px 40px 6px 6px; overflow:hidden; border:1px solid var(--ata-gold-b); box-shadow:0 6px 14px rgba(40,25,5,.25); }
.lecture-vignette img{ width:100%; height:100%; object-fit:cover; object-position:50% 25%; display:block; transition:transform .5s; }
a.lecture-vignette:hover img{ transform:scale(1.08); }
.lecture .lecture-axe-texte{ color:var(--text); font-size:15px; margin-bottom:6px; }
.lecture .lecture-sous{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-muted); margin:8px 0 4px; }
.lecture-facettes{ list-style:none; margin:0 0 8px; padding:0; }
.lecture-facettes li{ position:relative; padding-left:16px; font-size:13.5px; line-height:1.55; color:var(--text-secondary); margin-bottom:3px; }
.lecture-facettes li::before{ content:'✦'; position:absolute; left:0; top:1px; font-size:9px; color:var(--ata-gold-b); }
.lecture .lecture-fermier{ font-size:13px; color:var(--text-muted); margin:6px 0 0; }
.lecture .lecture-fermier em{ color:var(--ata-red); }
.lecture-miel{ display:inline-block; margin-left:6px; padding:1px 9px; border-radius:20px; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; font-weight:700; font-style:normal; vertical-align:1px; }
.miel-ba{ background:rgba(122,53,16,.14); color:#8a3a14; }
.miel-hab{ background:rgba(217,152,44,.18); color:#946210; }
.miel-ba-hab{ background:linear-gradient(90deg, rgba(122,53,16,.14), rgba(217,152,44,.18)); color:#8a5414; }
.miel-aucun{ background:rgba(120,120,160,.12); color:#5a5a7a; }
:root[data-theme="sombre"] .miel-ba{ color:#e0a070; } :root[data-theme="sombre"] .miel-hab{ color:#f0c870; }
:root[data-theme="sombre"] .miel-ba-hab{ color:#e9b77a; } :root[data-theme="sombre"] .miel-aucun{ color:#d8d2ea; }
.lecture-paire{ font-size:12px; color:var(--text-muted); white-space:nowrap; }
.lecture-lien{ font-family:var(--display); font-weight:700; font-size:15px; color:var(--ata-red); text-decoration:none; white-space:nowrap; }
.lecture-lien:hover{ text-decoration:underline; text-underline-offset:3px; }
.lecture .lecture-question{ font-family:var(--display); font-style:italic; font-size:21px; line-height:1.35; color:var(--text); padding:14px 18px; margin:4px 0 14px;
  border-left:2px solid var(--ata-gold-b); background:linear-gradient(90deg, rgba(184,137,47,.08), transparent); border-radius:0 10px 10px 0; }
.lecture-question span{ display:block; font-family:var(--font); font-style:normal; font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--ata-gold-b); font-weight:700; margin-bottom:4px; }
.lecture-pratique{ margin-top:14px; padding:14px 18px; border-radius:12px; background:#1c140c; color:#eadcbf; }
.lecture-pratique b{ display:block; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:#e0b45a; margin-bottom:6px; }
.lecture .lecture-pratique p{ color:#e6d6b6; font-size:14px; margin-bottom:8px; }
.lecture-pratique .lecture-lien{ color:#e9bd62; }
.lecture .lecture-avert{ font-size:11.5px; color:var(--text-muted); margin-top:10px; }
.lecture-toutes{ margin:8px 0 4px; }
.lecture-toutes summary{ cursor:pointer; font-size:13px; color:var(--ata-gold-b); font-weight:600; margin-bottom:6px; }

/* bouton de l'ambiance sonore */
.son-switch{ display:inline-grid; place-items:center; width:38px; height:38px; margin-right:6px; border-radius:50%; border:1px solid rgba(184,137,47,.45);
  background:none; cursor:pointer; color:var(--text-muted); transition:color .3s, border-color .3s, box-shadow .3s; flex:none; }
.son-switch svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.son-switch .hp{ fill:currentColor; fill-opacity:.15; }
.son-switch .onde{ display:none; } .son-switch .barre{ display:inline; }
.son-switch.on{ color:var(--ata-gold-b); border-color:var(--ata-gold-b); box-shadow:0 0 12px rgba(224,180,90,.35); }
.son-switch.on .onde{ display:inline; animation:onde 2.4s ease-in-out infinite; } .son-switch.on .o2{ animation-delay:.3s; }
.son-switch.on .barre{ display:none; }
.son-switch:hover{ color:var(--ata-gold-b); border-color:var(--ata-gold-b); }
@keyframes onde{ 0%,100%{ opacity:.35; } 50%{ opacity:1; } }
@media (prefers-reduced-motion:reduce){ .son-switch.on .onde{ animation:none; } }
@media (max-width:768px){ .son-switch{ margin-left:auto; width:34px; height:34px; } .son-switch ~ .pole-switch{ margin-left:0; } }

.lecture-souffle{ display:block; margin-top:10px; padding:0; background:none; border:0; cursor:pointer; font-family:var(--display); font-size:15px; font-weight:700; color:#f3d58c; text-decoration:underline; text-underline-offset:3px; }
.lecture-souffle:hover{ color:#fff3cf; }
.btn-souffle-or{ margin-top:22px; }
