/* ───────────────────────────────────────────────
   Pouvoir Intérieur — Base CSS commun
   Palette « Safran + Bleu Nuit »
   Partagé par toutes les pages du site.
   ─────────────────────────────────────────────── */

:root{
  --creme:#F5EFE0;
  --bleu-nuit:#1A2541;
  --bleu-nuit-soft:#253056;
  --terracotta:#C89B3E;       /* safran */
  --terracotta-deep:#A68030;
  --sable:#E8DDC0;
  --ocre:#B8924A;
  --vert:#3D5340;
  --vert-soft:#5B7560;
  --vert-pale:#E4EBE3;

  --serif:"EB Garamond", Georgia, serif;
  --sans:"Inter Tight", system-ui, sans-serif;
  --script:"Mrs Saint Delafield", cursive;

  --read:680px;
}

*,*::before,*::after{box-sizing:border-box;}
html,body{margin:0;padding:0;background:var(--creme);color:var(--bleu-nuit);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
body{font-family:var(--sans);font-size:17px;line-height:1.65;font-weight:400;letter-spacing:.005em;}
img{max-width:100%;display:block;}
a{color:inherit;}

::selection{background:var(--terracotta);color:var(--creme);}

.page{overflow-x:hidden;}

h1,h2,h3,h4{font-family:var(--serif);font-weight:400;letter-spacing:-.01em;margin:0;}
p{margin:0 0 1.1em;}
p:last-child{margin-bottom:0;}

/* Layout columns */
.col{max-width:var(--read);margin:0 auto;padding:0 28px;}
.col-wide{max-width:1120px;margin:0 auto;padding:0 32px;}
.col-mid{max-width:920px;margin:0 auto;padding:0 32px;}

/* Eyebrow / sur-titre */
.eyebrow{
  font-family:var(--sans);font-size:13px;font-weight:500;
  letter-spacing:.26em;text-transform:uppercase;
  color:var(--terracotta);
}
.eyebrow-lg{font-size:15px;letter-spacing:.28em;}
.eyebrow-vert{color:var(--vert);}
.on-dark .eyebrow{color:var(--ocre);}
.on-dark .eyebrow-vert-dark{color:#a8c4a8;}

.rule{height:1px;background:currentColor;opacity:.18;width:60px;border:0;margin:0;}
.center{text-align:center;}

/* Sections */
section{position:relative;padding:140px 0;}
section.dense{padding:120px 0;}
section.tight{padding:96px 0;}

.on-dark{background:var(--bleu-nuit);color:var(--creme);}
.on-dark h1,.on-dark h2,.on-dark h3{color:var(--creme);}
.on-sand{background:var(--sable);}

/* Filets décoratifs verticaux */
.filet-v{position:absolute;left:50%;width:1px;background:currentColor;opacity:.18;transform:translateX(-.5px);}
.filet-v.top{top:0;height:64px;}
.filet-v.bot{bottom:0;height:64px;}

/* Stamp */
.stamp{font-family:var(--sans);font-size:13px;letter-spacing:.32em;text-transform:uppercase;color:rgba(31,42,68,.55);}
.on-dark .stamp{color:rgba(250,245,236,.55);}

/* CTAs / buttons */
.ctas{display:flex;gap:14px;flex-wrap:wrap;}
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 24px;border-radius:4px;font-family:var(--sans);font-weight:500;font-size:15px;letter-spacing:.01em;text-decoration:none;transition:all .25s ease;border:1px solid transparent;cursor:pointer;}
.btn-primary{background:var(--terracotta);color:var(--creme);}
.btn-primary:hover{background:var(--terracotta-deep);}
.btn-outline{border-color:rgba(31,42,68,.45);color:var(--bleu-nuit);background:transparent;}
.btn-outline:hover{background:var(--bleu-nuit);color:var(--creme);border-color:var(--bleu-nuit);}
.on-dark .btn-outline{border-color:rgba(250,245,236,.45);color:var(--creme);}
.on-dark .btn-outline:hover{background:var(--creme);color:var(--bleu-nuit);}
.btn .arrow{transition:transform .25s ease;display:inline-block;}
.btn:hover .arrow{transform:translateX(3px);}

/* Prose block (lecture éditoriale) */
.prose-block{font-family:var(--serif);font-size:22px;line-height:1.55;color:var(--bleu-nuit);font-weight:400;text-align:left;}
.prose-block p{margin:0 0 1em;}
.prose-block em{font-style:italic;color:var(--terracotta);}
.prose-block .signature-line{font-style:italic;color:var(--terracotta);font-size:26px;margin-top:1.4em;text-align:center;display:block;}

/* ─── Nav (top) ─── */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);background:rgba(245,239,224,.92);border-bottom:1px solid rgba(31,42,68,.08);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 32px;max-width:1280px;margin:0 auto;gap:32px;}
.logo{display:inline-flex;align-items:center;gap:10px;font-family:var(--serif);font-size:20px;font-weight:500;letter-spacing:-.005em;color:var(--bleu-nuit);text-decoration:none;line-height:1;}
.logo em{font-style:italic;font-weight:400;color:var(--terracotta);}
.logo-mark{height:30px;width:auto;display:block;flex-shrink:0;}
.logo-text{display:inline-block;}
@media (max-width:520px){.logo-text{display:none;}}
.nav-links{display:flex;gap:28px;font-family:var(--sans);font-size:14px;color:rgba(31,42,68,.78);}
.nav-links a{text-decoration:none;}
.nav-links a.active{color:var(--terracotta);}
.nav-links a.active-vert{color:var(--vert);}
.nav-cta{font-size:13px;color:var(--bleu-nuit);text-decoration:none;border:1px solid rgba(31,42,68,.2);padding:8px 14px;border-radius:4px;transition:all .2s ease;}
.nav-cta:hover{background:var(--bleu-nuit);color:var(--creme);}

/* ─── Menu hamburger (visible mobile uniquement) ─── */
.nav-toggle{
  display:none;width:44px;height:44px;
  background:transparent;border:none;cursor:pointer;padding:0;
  color:var(--bleu-nuit);align-items:center;justify-content:center;
  flex-shrink:0;
}
.nav-toggle-bars{position:relative;width:22px;height:14px;display:block;}
.nav-toggle-bars::before,
.nav-toggle-bars::after,
.nav-toggle-bars > span{
  content:"";position:absolute;left:0;right:0;height:1.5px;
  background:currentColor;border-radius:2px;
  transition:transform .25s ease,opacity .2s ease,top .25s ease,bottom .25s ease;
}
.nav-toggle-bars::before{top:0;}
.nav-toggle-bars > span{top:50%;margin-top:-.75px;display:block;}
.nav-toggle-bars::after{bottom:0;}
.nav-toggle[aria-expanded="true"] .nav-toggle-bars::before{top:50%;margin-top:-.75px;transform:rotate(45deg);}
.nav-toggle[aria-expanded="true"] .nav-toggle-bars > span{opacity:0;}
.nav-toggle[aria-expanded="true"] .nav-toggle-bars::after{bottom:50%;margin-bottom:-.75px;transform:rotate(-45deg);}

@media (max-width:880px){
  /* Bouton visible */
  .nav-toggle{display:inline-flex;}
  /* Le menu devient un panneau qui se déroule sous la nav */
  .nav-links{
    display:flex;flex-direction:column;gap:0;
    position:absolute;top:100%;left:0;right:0;
    background:rgba(245,239,224,.98);
    backdrop-filter:blur(14px) saturate(140%);
    -webkit-backdrop-filter:blur(14px) saturate(140%);
    border-bottom:1px solid rgba(31,42,68,.08);
    padding:0 24px;
    max-height:0;overflow:hidden;
    opacity:0;pointer-events:none;
    transition:max-height .35s ease,opacity .25s ease,padding .35s ease;
  }
  .nav-links.is-open{
    max-height:70vh;opacity:1;pointer-events:auto;
    padding:8px 24px 20px;
  }
  .nav-links a{
    font-size:17px;padding:16px 0;
    border-bottom:1px solid rgba(31,42,68,.08);
    color:var(--bleu-nuit);
  }
  .nav-links a:last-child{border-bottom:none;}
}
/* Très petit mobile : on cache le CTA Newsletter pour gagner de la place */
@media (max-width:520px){.nav-cta{display:none;}}

/* ─── Footer ─── */
.footer{background:var(--bleu-nuit);color:rgba(250,245,236,.7);padding:96px 0 48px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;}
@media (max-width:880px){.footer-grid{grid-template-columns:1fr 1fr;gap:40px;}}
.footer-brand{display:flex;flex-direction:column;align-items:flex-start;gap:12px;font-family:var(--serif);font-size:24px;font-weight:500;color:var(--creme);margin-bottom:8px;}
.footer-brand em{font-style:italic;color:var(--terracotta);font-weight:400;}
.footer-brand-mark{height:54px;width:auto;display:block;}
.footer-brand-text{display:block;}
.footer-tag{font-family:var(--serif);font-style:italic;font-size:18px;color:rgba(250,245,236,.65);margin-bottom:0;}
.footer h4{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ocre);margin:0 0 18px;}
.footer ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;}
.footer a{color:rgba(250,245,236,.75);text-decoration:none;font-size:15px;transition:color .2s ease;}
.footer a:hover{color:var(--terracotta);}
.footer a.active{color:var(--terracotta);}
.footer-bottom{margin-top:72px;padding-top:32px;border-top:1px solid rgba(250,245,236,.12);display:flex;justify-content:space-between;font-size:13px;color:rgba(250,245,236,.5);}
@media (max-width:680px){.footer-bottom{flex-direction:column;gap:8px;}}

/* ─── Hero patterns ─── */
.hero-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:96px;align-items:center;}
@media (max-width:980px){.hero-grid{grid-template-columns:1fr;gap:64px;}}
.hero-type{font-size:clamp(48px,6.4vw,104px);line-height:.98;letter-spacing:-.022em;font-weight:400;margin:0;}
.hero-type em{font-style:italic;color:var(--terracotta);font-weight:400;}
.hero-sub{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(22px,2.4vw,30px);line-height:1.35;color:rgba(31,42,68,.78);margin:36px 0 0;max-width:540px;}
.hero-lede{font-size:18px;line-height:1.6;color:rgba(31,42,68,.78);margin:28px 0 40px;max-width:540px;}
.hero-illus{position:relative;display:flex;align-items:center;justify-content:center;min-height:520px;}
.hero-illus svg{width:100%;height:auto;max-width:380px;}
.hero-illus .frontis{position:absolute;bottom:0;left:50%;transform:translateX(-50%);font-family:var(--sans);font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:rgba(31,42,68,.45);white-space:nowrap;}

/* ─── Testimonials (Trustpilot quotes — partagé entre plusieurs pages) ─── */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;}
@media (max-width:980px){.quotes{grid-template-columns:1fr;gap:32px;}}
.quote{display:flex;flex-direction:column;gap:14px;background:rgba(232,221,192,.32);border:1px solid rgba(31,42,68,.08);border-radius:6px;padding:32px 28px 24px;transition:transform .25s ease, box-shadow .25s ease;text-decoration:none;color:inherit;}
.quote:hover{transform:translateY(-3px);box-shadow:0 14px 32px -18px rgba(31,42,68,.18);}
.quote-stars{display:flex;gap:2px;}
.quote-stars svg{width:18px;height:18px;}
.quote-title{font-family:var(--serif);font-weight:500;font-size:20px;line-height:1.25;color:var(--bleu-nuit);letter-spacing:-.005em;margin-top:4px;}
.quote-body{font-family:var(--serif);font-weight:400;font-size:16.5px;line-height:1.6;color:rgba(31,42,68,.85);margin:0;}
.quote-body em{font-style:italic;}
.quote-foot{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:18px;border-top:1px solid rgba(31,42,68,.1);}
.quote-avatar{width:36px;height:36px;border-radius:50%;background:var(--sable);border:1px solid rgba(31,42,68,.1);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:15px;font-weight:500;color:rgba(31,42,68,.75);flex-shrink:0;}
.quote-meta{font-family:var(--sans);font-size:12.5px;color:rgba(31,42,68,.62);line-height:1.4;flex:1;}
.quote-name{font-weight:500;color:var(--bleu-nuit);display:block;font-size:13.5px;}
.quote-verify{font-family:var(--sans);font-size:11px;color:rgba(31,42,68,.5);display:flex;align-items:center;gap:5px;}
.quote-verify::before{content:"";width:6px;height:6px;border-radius:50%;background:#00B67A;flex-shrink:0;}

.tp-bar{display:flex;align-items:center;justify-content:center;gap:14px;margin:32px auto 64px;flex-wrap:wrap;}
.tp-bar-stars{display:flex;gap:3px;}
.tp-bar-stars svg{width:24px;height:24px;}
.tp-bar-text{font-family:var(--sans);font-size:14.5px;color:var(--bleu-nuit);}
.tp-bar-text strong{font-weight:600;}
.tp-bar-text a{color:var(--terracotta);text-decoration:none;border-bottom:1px solid rgba(199,123,91,.4);}
.tp-bar-text a:hover{color:var(--terracotta-deep);}
