/* ============================================================
   EddyGPT — Feuille de style principale
   DA "Warm / Claude" — fond clair, accent terracotta
   ============================================================ */

/* ---------- Variables ---------- */
:root{
  --cream:#F5F3EE;      /* fond principal */
  --ivory:#FFFFFF;      /* cartes / surfaces */
  --ink:#1F1D1A;        /* texte principal / boutons pleins */
  --terra:#C15F3C;      /* accent signature */
  --terra-dk:#A94F30;   /* survol accent */
  --ocre:#D8A24A;       /* accent secondaire */
  --taupe:#6E675C;      /* texte secondaire */
  --line:#EAE6DE;       /* séparateurs / bordures */
  --shadow:0 18px 40px rgba(120,70,40,.10);
  --radius:16px;
  --wrap:1180px;

  /* --- Échelle d'espacement (design system) --- */
  --sp-1:8px;
  --sp-2:16px;
  --sp-3:24px;
  --sp-4:32px;
  --sp-5:40px;
  --sp-6:48px;
  --sp-8:64px;
  --sp-10:80px;
  --page-top:64px;      /* écart standard nav → 1er contenu */
  --section-y:80px;     /* respiration verticale entre sections */
  --section-y-sm:56px;  /* sections resserrées */
}

/* ---------- Reset ---------- */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  background:var(--cream);color:var(--ink);line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 40px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Typo utilitaires ---------- */
.eyebrow{color:var(--terra);font-weight:700;font-size:13px;letter-spacing:.09em;text-transform:uppercase}
h1,h2,h3{letter-spacing:-.02em;line-height:1.05}
.h1{font-size:66px;font-weight:900;line-height:.98;letter-spacing:-.03em}
.section-title{font-size:42px;font-weight:900}
.lead{font-size:19px;color:var(--taupe)}

/* ---------- Boutons ---------- */
.btn{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:15px;
  padding:14px 24px;border-radius:30px;border:none;cursor:pointer;font-family:inherit;transition:transform .15s,background .2s,color .2s}
.btn-dark{background:var(--ink);color:var(--cream)}
.btn-dark:hover{transform:translateY(-2px)}
.btn-terra{background:var(--terra);color:#fff}
.btn-terra:hover{background:var(--terra-dk)}
.btn-ghost{background:transparent;color:var(--ink);font-weight:700}
.btn-ghost:hover{color:var(--terra)}
.btn .arw{transition:transform .2s}
.btn:hover .arw{transform:translateX(4px)}

/* ---------- Header / Nav ---------- */
.site-header{position:sticky;top:0;z-index:60;background:rgba(245,243,238,.85);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:11px;font-weight:800;font-size:19px}
.brand .ava{width:34px;height:34px;border-radius:50%;overflow:hidden;
  background:linear-gradient(135deg,var(--terra),var(--ocre));color:#fff;font-weight:900;font-size:15px;
  display:flex;align-items:center;justify-content:center}
.brand .ava img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.nav-menu{display:flex;gap:30px;font-size:15px;font-weight:500;color:var(--taupe)}
.nav-menu a:hover{color:var(--ink)}
.nav-menu a.active{color:var(--ink);font-weight:600}
.nav-right{display:flex;align-items:center;gap:16px}
.burger{display:none;background:none;border:none;cursor:pointer;padding:6px;color:var(--ink)}
.burger svg{width:26px;height:26px}

/* ---------- Footer ---------- */
.site-footer{border-top:1px solid var(--line);padding:38px 0 52px;margin-top:40px}
.footer-in{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:18px}
.footer-in .copy{font-size:13px;color:var(--taupe)}
.footer-menu{display:flex;gap:24px;font-size:14px;color:var(--taupe);font-weight:500;flex-wrap:wrap}
.footer-menu a:hover{color:var(--terra)}
.footer-social{display:flex;gap:16px}
.footer-social a{width:20px;height:20px;color:var(--taupe)}
.footer-social a:hover{color:var(--terra)}
.footer-social svg{width:100%;height:100%}

/* ---------- Hero (accueil) ---------- */
.hero{padding:var(--page-top) 0 var(--section-y)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}
.hero .eyebrow{display:block;margin-bottom:20px}
.hero h1{margin-bottom:26px}
.hero .lead{max-width:480px;margin-bottom:34px}
.hero .lead b{color:var(--ink);font-weight:600}
.hero-btns{display:flex;align-items:center;gap:20px;margin-bottom:36px;flex-wrap:wrap}
.socials{display:flex;gap:18px;margin-bottom:42px}
.socials a{width:22px;height:22px;color:var(--taupe)}
.socials a:hover{color:var(--terra)}
.socials svg{width:100%;height:100%}
.stats{display:flex;gap:44px;flex-wrap:wrap}
.stat .n{font-size:30px;font-weight:900;letter-spacing:-.02em}
.stat .l{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--taupe);margin-top:3px}

/* Portrait placeholder */
.portrait{aspect-ratio:4/4.6;border-radius:22px;overflow:hidden;position:relative;
  background:radial-gradient(120% 90% at 70% 15%,#f3ceb6 0%,transparent 55%),
    linear-gradient(160deg,#e7c6ac,#cf9b7d 60%,#b97f5f);
  box-shadow:0 30px 60px rgba(120,70,40,.18);display:flex;align-items:flex-end;justify-content:center}
.portrait .silh{width:56%;height:70%;background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,.05));
  border-radius:50% 50% 45% 45%/60% 60% 40% 40%}
.portrait .slot{position:absolute;top:16px;left:16px;background:rgba(31,29,26,.6);color:#fff;
  font-size:11px;font-weight:600;padding:5px 10px;border-radius:14px}
.portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 18%}

/* ---------- Featured bar ---------- */
.featured{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0}
.featured-in{display:flex;align-items:center;justify-content:center;gap:38px;flex-wrap:wrap}
.featured-in .lbl{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--taupe)}
.featured-in .logo{font-weight:800;font-size:19px;color:#c0b8ab}
.featured-in .brand-logo{display:flex;align-items:center;gap:9px;font-weight:700;font-size:17px;color:var(--ink);transition:opacity .15s}
.featured-in .brand-logo:hover{opacity:.65}
.featured-in .brand-logo svg{height:23px;width:auto;display:block}

/* ---------- Sections génériques ---------- */
.section{padding:var(--section-y) 0}
.section.tight{padding:var(--section-y-sm) 0}
/* Première section d'une page interne : évite le double espacement en haut */
.section.first{padding-top:var(--page-top)}
.sec-head{text-align:center;max-width:640px;margin:0 auto 52px}
.sec-head .eyebrow{display:block;margin-bottom:14px}
.sec-head h2{font-size:42px;font-weight:900}
.sec-head p{color:var(--taupe);font-size:17px;margin-top:16px}

/* ---------- Cartes piliers ---------- */
.cards-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.card{background:var(--ivory);border:1px solid var(--line);border-radius:18px;padding:26px 22px 28px;transition:transform .18s,box-shadow .18s}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.card .ic{width:44px;height:44px;border-radius:12px;background:var(--terra);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:900;font-size:19px;margin-bottom:18px}
.card.o .ic{background:var(--ocre)}.card.b .ic{background:var(--terra-dk)}.card.i .ic{background:var(--ink)}
.card h3{font-size:19px;font-weight:800;margin-bottom:8px}
.card p{font-size:14px;color:var(--taupe)}

/* ---------- Bande newsletter ---------- */
.nl-band{background:var(--ink);color:var(--cream);border-radius:26px;padding:56px 48px;text-align:center}
.nl-band .eyebrow{display:block;color:var(--ocre);margin-bottom:14px}
.nl-band h2{font-size:38px;font-weight:900;margin-bottom:14px}
.nl-band p{color:#cfc7b8;font-size:17px;max-width:520px;margin:0 auto 30px}
.nl-form{display:flex;gap:10px;justify-content:center;max-width:470px;margin:0 auto;flex-wrap:wrap}
.nl-form input{flex:1;min-width:220px;background:#2a2723;border:1px solid #3c382f;color:var(--cream);
  padding:15px 18px;border-radius:30px;font-size:15px;font-family:inherit}
.nl-form input::placeholder{color:#8a8272}
.nl-form input:focus{outline:2px solid var(--terra);outline-offset:1px}
.nl-band .fine{font-size:12px;color:#8a8272;margin-top:16px}
.nl-msg{margin-top:16px;font-size:14px;font-weight:600;min-height:20px}
.nl-msg.ok{color:#7fd6a8}.nl-msg.err{color:#f0a3a3}

/* light variant (page newsletter) */
.nl-card{background:var(--ivory);border:1px solid var(--line);border-radius:24px;padding:52px 44px;
  text-align:center;max-width:620px;margin:0 auto;box-shadow:var(--shadow)}
.nl-card .eyebrow{display:block;margin-bottom:14px}
.nl-card h2{font-size:34px;font-weight:900;margin-bottom:14px}
.nl-card p{color:var(--taupe);font-size:16px;max-width:440px;margin:0 auto 28px}
.nl-card .nl-form input{background:var(--cream);border:1px solid var(--line);color:var(--ink)}
.nl-card .nl-form input::placeholder{color:#a49c8f}
.nl-card .reassure{font-size:13px;color:var(--taupe);margin-top:16px;display:flex;align-items:center;gap:7px;justify-content:center}
.nl-card .reassure .dot{width:8px;height:8px;border-radius:50%;background:#3fbf7f;display:inline-block}

/* ---------- Page header (pages internes) ---------- */
.page-head{text-align:center;padding:0 0 var(--sp-5);max-width:720px;margin:0 auto}
.page-head .eyebrow{display:block;margin-bottom:14px}
.page-head h1{font-size:52px;font-weight:900}
.page-head p{color:var(--taupe);font-size:18px;margin-top:16px}

/* ---------- Ressources ---------- */
.filters{margin:10px 0 8px}
.filter-group{margin-bottom:20px}
.filter-group .flabel{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--taupe);margin-bottom:10px}
.chips{display:flex;gap:9px;flex-wrap:wrap}
.chip{background:var(--ivory);border:1px solid var(--line);color:var(--ink);font-size:14px;font-weight:600;
  padding:8px 16px;border-radius:22px;cursor:pointer;transition:.15s;font-family:inherit}
.chip:hover{border-color:var(--terra)}
.chip.active{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.search-box{margin:22px 0 10px}
.search-box .flabel{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--taupe);margin-bottom:8px;display:block}
.search-box input{width:100%;background:var(--ivory);border:1px solid var(--line);color:var(--ink);
  padding:15px 18px;border-radius:14px;font-size:15px;font-family:inherit}
.search-box input:focus{outline:2px solid var(--terra);outline-offset:1px}
.res-meta{display:flex;align-items:center;justify-content:space-between;margin:18px 0 8px;color:var(--taupe);font-size:14px}
.res-list{border-top:1px solid var(--line)}
.res-item{display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:24px 4px;border-bottom:1px solid var(--line);transition:padding-left .15s}
.res-item:hover{padding-left:8px}
.res-item .cat{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--terra);margin-bottom:6px}
.res-item h3{font-size:20px;font-weight:800;margin-bottom:5px}
.res-item p{font-size:14px;color:var(--taupe);max-width:760px}
.res-item .go{color:var(--taupe);font-size:22px;flex-shrink:0}
.res-empty{padding:40px 0;text-align:center;color:var(--taupe)}

/* ---------- Partenariats ---------- */
.pk-hero{text-align:center;padding:0 0 var(--sp-3);max-width:720px;margin:0 auto}
.pk-hero .btn{margin:0 6px}
.pk-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:44px 0}
.pk-stat{background:var(--ivory);border:1px solid var(--line);border-radius:16px;padding:24px 20px;text-align:center}
.pk-stat .n{font-size:28px;font-weight:900}
.pk-stat .l{font-size:12px;color:var(--taupe);margin-top:4px}
.pk-2col{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}
.pk-panel{background:var(--ivory);border:1px solid var(--line);border-radius:16px;padding:26px 24px}
.pk-panel h3{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--taupe);margin-bottom:18px}
.bar-row{display:flex;align-items:center;gap:12px;margin-bottom:12px;font-size:14px}
.bar-row .bl{width:74px;flex-shrink:0;color:var(--taupe)}
.bar-track{flex:1;height:12px;background:var(--cream);border-radius:8px;overflow:hidden}
.bar-fill{height:100%;background:var(--terra);border-radius:8px}
.bar-row .bv{width:46px;text-align:right;font-weight:600}
.offers{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px}
.offer{background:var(--ivory);border:1px solid var(--line);border-radius:16px;padding:24px 22px}
.offer .oi{width:44px;height:44px;border-radius:12px;background:var(--terra);color:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.offer .oi svg{width:22px;height:22px}
.offer h4{font-size:16px;font-weight:800;margin-bottom:7px}
.offer p{font-size:13px;color:var(--taupe)}
.why{background:var(--ivory);border:1px solid var(--line);border-radius:20px;padding:36px 34px;margin:26px 0}
.why h3{font-size:22px;font-weight:900;margin-bottom:20px;text-align:center}
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 30px}
.why-grid li{list-style:none;display:flex;gap:10px;align-items:flex-start;font-size:15px;color:var(--taupe)}
.why-grid li .ck{color:var(--terra);font-weight:900;flex-shrink:0}
/* Marques accompagnées */
.brands-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:8px}
.brand-tile{background:var(--ivory);border:1px solid var(--line);border-radius:14px;height:78px;
  display:flex;align-items:center;justify-content:center;color:#b7ae9f;font-weight:800;font-size:14px;
  letter-spacing:.02em;transition:transform .15s}
.brand-tile:hover{transform:translateY(-3px)}
.brands-note{text-align:center;color:var(--taupe);font-size:14px;margin-top:16px}

.contact-band{background:var(--ink);color:var(--cream);border-radius:24px;padding:48px 40px;text-align:center}
.contact-band h3{font-size:30px;font-weight:900;margin-bottom:12px}
.contact-band p{color:#cfc7b8;margin-bottom:12px}
.contact-band .mail{color:var(--ocre);font-weight:700;font-size:20px;display:inline-block;margin-bottom:24px}

/* ---------- À propos ---------- */
.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start;padding:20px 0 40px}
.prose p{font-size:17px;color:#403b34;margin-bottom:20px}
.prose p b{color:var(--ink)}
.prose h2{font-size:26px;font-weight:900;margin:34px 0 14px}

/* ---------- Legal ---------- */
.legal{max-width:760px;margin:0 auto;padding:20px 0 40px}
.legal h2{font-size:22px;font-weight:800;margin:30px 0 10px}
.legal p{color:#403b34;margin-bottom:12px}
.legal .muted{color:var(--taupe);font-size:14px}

/* ---------- Archive éditions ---------- */
.editions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
.edition{background:var(--ivory);border:1px solid var(--line);border-radius:16px;padding:22px;transition:transform .15s,box-shadow .15s}
.edition:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.edition .date{font-size:12px;color:var(--taupe);margin-bottom:8px}
.edition h4{font-size:17px;font-weight:800;margin-bottom:8px}
.edition p{font-size:13px;color:var(--taupe)}

/* ---------- Bloc "dernières éditions" + newsletter (2 colonnes) ---------- */
.issues-block{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding:20px 0}
.issues-col{position:relative}
.annotate{position:relative;margin:0 0 22px 40px;font-family:Georgia,'Times New Roman',serif;font-style:italic;
  color:var(--terra);font-size:20px}
.annotate svg{position:absolute;left:-52px;top:6px;width:46px;height:40px;color:var(--terra)}
.issue-card{display:block;background:var(--ivory);border:1px solid var(--line);border-radius:14px;
  padding:20px 22px;margin-bottom:14px;transition:transform .15s,box-shadow .15s}
.issue-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.issue-card .date{font-size:12px;color:var(--taupe);margin-bottom:7px}
.issue-card h4{font-size:18px;font-weight:800;margin-bottom:6px}
.issue-card p{font-size:13px;color:var(--taupe)}
.issues-archive{font-weight:700;font-size:14px;color:var(--ink);display:inline-block;margin-top:6px}
.issues-archive:hover{color:var(--terra)}
.nl-inline .eyebrow{display:block;margin-bottom:12px}
.nl-inline h2{font-size:38px;font-weight:900;line-height:1.04;margin-bottom:16px}
.nl-inline p{color:var(--taupe);font-size:17px;max-width:440px;margin-bottom:22px}
.nl-inline .nl-form{justify-content:flex-start;margin:0 0 12px}
.nl-inline .nl-form input{background:var(--ivory);border:1px solid var(--line);color:var(--ink)}
.nl-inline .join{font-size:13px;color:var(--taupe);display:flex;align-items:center;gap:7px}
.nl-inline .join .dot{width:8px;height:8px;border-radius:50%;background:#3fbf7f;display:inline-block}

/* ---------- Tool finder ---------- */
.toolfinder{text-align:center;max-width:640px;margin:0 auto}
.toolfinder .eyebrow{display:block;margin-bottom:14px}
.toolfinder h2{font-size:42px;font-weight:900;margin-bottom:16px}
.toolfinder p{color:var(--taupe);font-size:18px;margin-bottom:28px}
.toolfinder .btn{margin-bottom:18px}
.toolfinder .alt{display:block;font-weight:700;font-size:14px;color:var(--taupe)}
.toolfinder .alt:hover{color:var(--terra)}

/* ---------- Grille ressources gratuites (cartes illustrées) ---------- */
.res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.res-card{background:var(--ivory);border:1px solid var(--line);border-radius:18px;overflow:hidden;
  transition:transform .18s,box-shadow .18s;display:block}
.res-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.res-thumb{height:160px;display:flex;align-items:center;justify-content:center;font-size:56px}
.res-thumb.t1{background:linear-gradient(150deg,#f6d9c2,#eab68f)}
.res-thumb.t2{background:linear-gradient(150deg,#f3e4c7,#e6c07f)}
.res-thumb.t3{background:linear-gradient(150deg,#f0cbb2,#d98c63)}
.res-thumb.t4{background:linear-gradient(150deg,#e9e2d3,#cbb28c)}
.res-thumb.t5{background:linear-gradient(150deg,#f5cdb6,#e0a074)}
.res-thumb.t6{background:linear-gradient(150deg,#efd7bd,#d9a06b)}
.res-card .body{padding:20px 22px 24px}
.res-card .cat{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--terra);margin-bottom:8px}
.res-card h3{font-size:18px;font-weight:800;margin-bottom:8px;line-height:1.2}
.res-card p{font-size:13px;color:var(--taupe)}
.center-link{text-align:center;margin-top:36px}
.center-link a{font-weight:700;color:var(--ink)}
.center-link a:hover{color:var(--terra)}

/* ---------- Responsive ---------- */
@media(max-width:980px){
  .issues-block{grid-template-columns:1fr;gap:34px}
  /* Comme Maverick : newsletter d'abord, puis annotation + cartes d'éditions */
  .issues-block .nl-inline{order:-1;text-align:center}
  .issues-block .nl-inline p{margin-left:auto;margin-right:auto}
  .issues-block .nl-inline .nl-form{justify-content:center}
  .issues-block .nl-inline .join{justify-content:center}
  .res-grid{grid-template-columns:1fr 1fr}
  .hero-grid{grid-template-columns:1fr;gap:40px}
  .portrait{max-width:400px}
  .cards-4{grid-template-columns:1fr 1fr}
  .pk-stats{grid-template-columns:1fr 1fr}
  .offers{grid-template-columns:1fr 1fr}
  .brands-grid{grid-template-columns:repeat(3,1fr)}
  .about-grid{grid-template-columns:1fr;gap:32px}
  .editions{grid-template-columns:1fr}
}
@media(max-width:720px){
  .wrap{padding:0 22px}
  .h1,.hero h1{font-size:44px}
  .section-title,.sec-head h2,.page-head h1{font-size:34px}
  .section{padding:56px 0}
  .nav-menu{display:none;position:absolute;top:72px;left:0;right:0;background:var(--cream);
    flex-direction:column;gap:0;padding:8px 0;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
  .nav-menu.open{display:flex}
  .nav-menu a{padding:14px 40px}
  .burger{display:block}
  /* CTA caché sur mobile (comme Maverick) : on garde logo + burger */
  .nav-right .btn{display:none}
  /* Hero mobile : photo en haut, contenu centré */
  .hero{padding-top:32px}
  .hero-grid{text-align:center}
  .hero-grid .portrait{order:-1;margin:0 auto 20px;max-width:320px}
  .hero .lead{margin-left:auto;margin-right:auto}
  .hero-btns{justify-content:center}
  .socials{justify-content:center}
  .stats{justify-content:center}
  .cards-4{grid-template-columns:1fr}
  .pk-stats,.offers,.pk-2col,.why-grid{grid-template-columns:1fr}
  .brands-grid{grid-template-columns:1fr 1fr}
  .nl-band,.nl-card{padding:40px 26px}
  .nl-band h2{font-size:30px}
  .stats{gap:28px}
  .res-grid{grid-template-columns:1fr}
  .nl-inline h2,.toolfinder h2{font-size:32px}
  /* Annotation centrée sous la newsletter, flèche décorative masquée sur mobile */
  .annotate{text-align:center;margin:0 0 16px}
  .annotate svg{display:none}
}
