/* ============================================================
   Tomettes — La Revue · système commun
   Chargé par TOUTES les pages. Les styles spécifiques par page
   restent inline (cf. <style> dans chaque .html).
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,300;0,6..72,400;0,6..72,500;0,6..72,600;1,6..72,300;1,6..72,400;1,6..72,500&family=Archivo:wght@400;500;600&display=swap');

/* ---------- Tokens ---------- */
:root{
  --paper:#F3EFE6;
  --paper-2:#ECE7DB;
  --ink:#1A1814;
  --ink-soft:#5C564C;
  --rule:#D7CFBF;
  --terra:#B0492A;
  --terra-deep:#8E3A22;
}

/* ---------- Reset ---------- */
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Newsreader',Georgia,serif;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{background:var(--terra);color:var(--paper);}
a{color:inherit;}
img{max-width:100%;}
button{font-family:inherit;}

/* ---------- Utilitaires ---------- */
.label{
  font-family:'Archivo',sans-serif;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:11px;
  font-weight:500;
}
.wrap{max-width:1280px;margin:0 auto;padding:0 40px;}

/* ---------- Masthead ---------- */
.masthead{
  border-bottom:1.5px solid var(--ink);
  position:sticky;top:0;z-index:50;
  background:var(--paper);
}
.masthead-top{
  display:flex;align-items:stretch;justify-content:space-between;
}
.mh-cell{padding:11px 22px;display:flex;align-items:center;gap:8px;}
.mh-cell + .mh-cell{border-left:1px solid var(--rule);}
.mh-cell.grow{flex:1;}
.mh-link{
  font-family:'Archivo',sans-serif;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;text-decoration:none;color:var(--ink-soft);
  transition:color .2s;
}
.mh-link:hover{color:var(--terra);}
.mh-link.active{color:var(--ink);}
.wordmark{
  font-weight:500;font-size:26px;letter-spacing:-.02em;line-height:1;
  text-decoration:none;color:var(--ink);
}
.wordmark .dot{color:var(--terra);}

/* ---------- Reveal au scroll ---------- */
.js-anim .rv{
  opacity:0;transform:translateY(22px);
  transition:opacity 1s ease,transform 1.1s cubic-bezier(.2,.8,.2,1);
}
.js-anim .rv.in{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){
  .js-anim .rv{opacity:1;transform:none;}
}

/* ---------- Opener (pages intérieures) ---------- */
.opener{padding:30px 0 52px;border-bottom:1px solid var(--rule);}
.crumb{
  display:flex;gap:14px;align-items:baseline;
  margin-bottom:30px;flex-wrap:wrap;
}
.crumb .label{color:var(--terra);}
.crumb .sep{color:var(--rule);}
.crumb a{color:var(--ink-soft);text-decoration:none;transition:color .2s;}
.crumb a:hover{color:var(--terra);}
h1.title{
  font-size:clamp(44px,7.4vw,108px);
  font-weight:400;line-height:.96;letter-spacing:-.025em;
  max-width:15ch;
}
h1.title em{font-style:italic;color:var(--terra);}
.opener .standfirst{
  font-size:20px;line-height:1.55;max-width:52ch;
  font-weight:300;margin-top:34px;
}
.opener .standfirst .firstcap,
.standfirst .firstcap{
  float:left;font-size:74px;line-height:.72;
  padding:8px 12px 0 0;color:var(--terra);font-weight:500;
}

/* ---------- Plate (planche photo pleine largeur) ---------- */
.plate{
  position:relative;border-bottom:1px solid var(--rule);
  overflow:hidden;
}
.plate figure{margin:0;overflow:hidden;}
.plate img{
  width:100%;display:block;
  height:clamp(360px,64vh,720px);object-fit:cover;
}
.plate .cap{
  display:flex;justify-content:space-between;gap:20px;
  padding:14px 40px;border-top:1px solid var(--ink);
}
.plate .cap .label{color:var(--ink-soft);}
.plate .cap .pg{
  font-family:'Archivo',sans-serif;font-size:11px;letter-spacing:.14em;
  color:var(--terra);white-space:nowrap;
}
.par-wrap{will-change:transform;}

/* ---------- Section + en-tête ---------- */
.sec{padding:80px 0;border-bottom:1px solid var(--rule);}
.sec-head{
  display:flex;justify-content:space-between;align-items:baseline;
  border-bottom:1.5px solid var(--ink);
  padding-bottom:16px;margin-bottom:46px;
  gap:20px;flex-wrap:wrap;
}
.sec-head h2{
  font-size:clamp(26px,3.4vw,42px);
  font-weight:400;letter-spacing:-.02em;font-style:italic;
}
.sec-head .label{color:var(--ink-soft);}

/* ---------- Liens / CTA textuels ---------- */
.read-cta{
  font-family:'Archivo',sans-serif;font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;text-decoration:none;color:var(--ink);
  border-bottom:1.5px solid var(--terra);padding-bottom:4px;
  white-space:nowrap;transition:color .2s;
}
.read-cta:hover{color:var(--terra);}

/* ---------- Colophon / CTA sombre de fin ---------- */
.colophon{background:var(--ink);color:var(--paper);}
.colophon .wrap{padding:86px 40px;}
.colophon .label{color:var(--terra);}
.colophon h2{
  font-size:clamp(38px,6.4vw,86px);
  font-weight:400;line-height:.98;letter-spacing:-.025em;
  margin:22px 0 0;
}
.colophon h2 em{font-style:italic;color:#E08A66;}
.cl-bottom{
  display:flex;justify-content:space-between;align-items:flex-end;
  margin-top:50px;gap:30px;flex-wrap:wrap;
}
.colophon p{
  font-size:18px;line-height:1.5;max-width:40ch;
  color:#CFC7B8;font-weight:300;
}
.btn-rev{
  font-family:'Archivo',sans-serif;font-size:13px;letter-spacing:.12em;
  text-transform:uppercase;text-decoration:none;color:var(--ink);
  background:var(--paper);padding:18px 34px;
  display:inline-flex;align-items:center;gap:10px;
  transition:background .25s,color .25s;border:none;cursor:pointer;
}
.btn-rev:hover{background:var(--terra);color:var(--paper);}
.impressum{
  display:flex;justify-content:space-between;gap:20px;
  border-top:1px solid rgba(255,255,255,.16);
  margin-top:60px;padding-top:22px;flex-wrap:wrap;
}
.impressum .label{color:#9C9486;}

/* ---------- Footer léger ---------- */
.foot{
  display:flex;justify-content:space-between;align-items:center;
  gap:20px;flex-wrap:wrap;
  padding:30px 40px;max-width:1280px;margin:0 auto;
}
.foot .fl{display:flex;gap:26px;flex-wrap:wrap;}
.foot a{text-decoration:none;}
.foot a svg{display:block;}

/* ---------- Floating CTA mobile (préservé du legacy, restylé Revue) ---------- */
.floating-cta{
  display:none;
  position:fixed;bottom:16px;left:16px;right:16px;
  z-index:90;
  padding:14px 24px;
  background:var(--terra);color:var(--paper);
  text-align:center;text-decoration:none;
  font-family:'Archivo',sans-serif;font-size:13px;font-weight:500;
  letter-spacing:.12em;text-transform:uppercase;
  transition:background .2s,transform .15s;
}
.floating-cta:hover{background:var(--terra-deep);}
.floating-cta:active{transform:scale(0.98);}
body.page-contact .floating-cta{display:none !important;}

/* ---------- Bandeau cookie : héritage analytics.js ---------- */
#tom-cookie-banner button.tom-cb-accept{background:var(--terra) !important;}
#tom-cookie-banner button.tom-cb-accept:hover{background:var(--terra-deep) !important;}

/* ---------- Responsive commun ---------- */
@media(max-width:880px){
  .wrap{padding:0 20px;}
  .mh-cell.hide-sm{display:none;}
  h1.title{font-size:13.5vw;}
  .plate .cap{padding:12px 20px;}
  .colophon .wrap{padding:60px 20px;}
  .foot{padding:24px 20px;}
  .floating-cta{display:block;}
}