:root{
    --terracotta:#C65D3B;
    --terracotta-fonce:#A84A2C;
    --creme:#F7F1E5;
    --creme-clair:#FBF7EF;
    --noir:#1C130D;
    --gris:#6E6259;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{font-family:'Archivo',sans-serif;background:var(--creme);color:var(--noir);line-height:1.65}
  img{max-width:100%;display:block}
  a{color:inherit;text-decoration:none}
  h1,h2,h3{font-family:'Archivo Black','Archivo',sans-serif;line-height:1.1;letter-spacing:-.02em}
  .container{max-width:1140px;margin:0 auto;padding:0 24px}
  section{padding:96px 0}

  /* ===== NAV ===== */
  header{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(247,241,229,.92);backdrop-filter:blur(8px);border-bottom:1px solid rgba(28,19,13,.08)}
  .nav{display:flex;align-items:center;justify-content:space-between;height:72px}
  .nav-logo img{height:34px;width:auto}
  .nav-links{display:flex;gap:8px;list-style:none;align-items:center}
  .nav-links a{padding:10px 16px;font-weight:700;font-size:.95rem;border-radius:8px;transition:.2s}
  .nav-links a:hover{background:rgba(198,93,59,.12);color:var(--terracotta)}
  .nav-cta{background:var(--terracotta);color:#fff !important;border-radius:999px;padding:10px 22px !important}
  .nav-cta:hover{background:var(--terracotta-fonce) !important;color:#fff !important}
  .burger{display:none;background:none;border:none;font-size:1.7rem;cursor:pointer;color:var(--noir)}

  /* ===== HERO ===== */
  .hero{min-height:100vh;display:flex;align-items:center;padding:140px 0 80px;position:relative;overflow:hidden}
  .hero-glyph{position:absolute;right:-6%;top:12%;width:46vw;max-width:560px;opacity:.08;pointer-events:none}
  .hero h1{font-size:clamp(3rem,8vw,6rem)}
  .hero .tagline{color:var(--terracotta);font-weight:900;font-size:clamp(1.1rem,2.4vw,1.6rem);text-transform:uppercase;letter-spacing:.18em;margin:18px 0 10px}
  .hero p.accroche{font-size:clamp(1.05rem,2vw,1.35rem);max-width:560px;color:var(--gris);margin-bottom:36px}
  .hero-points{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:0 0 32px}
  .hero-points li{background:rgba(198,93,59,.12);color:var(--terracotta-fonce);font-weight:700;font-size:.92rem;padding:8px 18px;border-radius:999px;border:1px solid rgba(198,93,59,.35)}
  .btn{display:inline-block;background:var(--terracotta);color:#fff;font-weight:700;padding:16px 36px;border-radius:999px;font-size:1.05rem;transition:.2s;border:2px solid var(--terracotta)}
  .btn:hover{background:var(--terracotta-fonce);border-color:var(--terracotta-fonce);transform:translateY(-2px)}
  .btn-ghost{background:transparent;color:var(--noir);border:2px solid var(--noir);margin-left:12px}
  .btn-ghost:hover{background:var(--noir);color:var(--creme)}

  /* ===== SECTION TITLES ===== */
  .kicker{color:var(--terracotta);font-weight:900;text-transform:uppercase;letter-spacing:.2em;font-size:.85rem;margin-bottom:12px}
  h2{font-size:clamp(2rem,4.5vw,3.2rem);margin-bottom:18px}
  .section-intro{max-width:640px;color:var(--gris);margin-bottom:56px;font-size:1.1rem}

  /* ===== SERVICES ===== */
  .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
  .grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
  @media (max-width:1100px){.grid-4{grid-template-columns:repeat(2,1fr)}}
  @media (max-width:640px){.grid-4{grid-template-columns:1fr}}
  .card{background:var(--creme-clair);border:1px solid rgba(28,19,13,.08);border-radius:20px;padding:36px 30px;transition:.25s}
  .card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(28,19,13,.10);border-color:var(--terracotta)}
  .card .num{font-family:'Archivo Black';font-size:2.4rem;color:var(--terracotta);margin-bottom:14px}
  .card h3{font-size:1.35rem;margin-bottom:12px}
  .card p{color:var(--gris);font-size:.98rem;margin-bottom:16px}
  .card ul{list-style:none;margin-bottom:20px}
  .card li{padding:6px 0 6px 26px;position:relative;font-size:.95rem}
  .card li::before{content:"";position:absolute;left:0;top:13px;width:14px;height:3px;background:var(--terracotta);border-radius:2px}
  .card .lien{color:var(--terracotta);font-weight:700}
  .card .lien:hover{text-decoration:underline}

  /* ===== MISSION (bloc sombre) ===== */
  .mission{background:var(--noir);color:var(--creme);text-align:center}
  .mission blockquote{font-family:'Archivo Black';font-size:clamp(1.4rem,3.4vw,2.4rem);max-width:900px;margin:0 auto;line-height:1.35}
  .mission blockquote span{color:var(--terracotta)}
  .mission img{height:40px;margin:0 auto 32px;width:auto}

  /* ===== RÉALISATIONS ===== */
  .projet{background:var(--creme-clair);border-radius:20px;border:1px solid rgba(28,19,13,.08);overflow:hidden;display:flex;flex-direction:column}
  .projet-tag{display:inline-block;background:rgba(198,93,59,.14);color:var(--terracotta);font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;padding:5px 12px;border-radius:999px;margin-bottom:14px;align-self:flex-start}
  .projet-body{padding:32px 28px}
  .projet h3{font-size:1.25rem;margin-bottom:14px}
  .projet dl{font-size:.94rem}
  .projet dt{font-weight:700;color:var(--terracotta);text-transform:uppercase;font-size:.76rem;letter-spacing:.1em;margin-top:12px}
  .projet dd{color:var(--gris)}
  .projet-bande{height:8px;background:linear-gradient(90deg,var(--terracotta),var(--terracotta-fonce))}

  /* ===== PARTENAIRES ===== */
  .partenaires{padding:64px 0;background:var(--creme);overflow:hidden}
  .partenaires .kicker{text-align:center}
  .partenaires h2{text-align:center;font-size:clamp(1.6rem,3.5vw,2.4rem);margin-bottom:48px}
  .marquee{overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
  .marquee-track{display:flex;gap:72px;align-items:center;width:max-content;animation:defile 35s linear infinite}
  .marquee:hover .marquee-track{animation-play-state:paused}
  .marquee-track img{height:64px;width:auto;filter:grayscale(1);opacity:.75;transition:filter .3s,opacity .3s}
  .marquee-track img:hover{filter:none;opacity:1}
  @keyframes defile{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  @media (max-width:640px){.marquee-track img{height:48px}.marquee-track{gap:48px}}

  /* ===== À PROPOS ===== */
  .apropos-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center}
  .histoire{font-size:1.15rem}
  .histoire strong{color:var(--terracotta)}
  .valeurs{display:grid;gap:20px;margin-top:8px}
  .valeur{border-left:4px solid var(--terracotta);padding:6px 0 6px 20px}
  .valeur h3{font-size:1.1rem;margin-bottom:4px}
  .valeur p{color:var(--gris);font-size:.95rem}

  /* ===== CONTACT ===== */
  .contact{background:var(--noir);color:var(--creme)}
  .contact .kicker{color:var(--terracotta)}
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px}
  .contact form{display:grid;gap:16px}
  .contact label{font-weight:700;font-size:.9rem}
  .contact input,.contact select,.contact textarea{width:100%;padding:14px 16px;border-radius:10px;border:1px solid rgba(247,241,229,.25);background:rgba(247,241,229,.07);color:var(--creme);font-family:inherit;font-size:1rem}
  .contact input::placeholder,.contact textarea::placeholder{color:rgba(247,241,229,.45)}
  .contact input:focus,.contact select:focus,.contact textarea:focus{outline:2px solid var(--terracotta);border-color:var(--terracotta)}
  .coords{display:grid;gap:22px;align-content:start}
  .coord{display:flex;gap:16px;align-items:flex-start}
  .coord .ico{width:44px;height:44px;border-radius:12px;background:var(--terracotta);display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0}
  .coord h3{font-size:1rem;margin-bottom:2px}
  .coord p, .coord a{color:rgba(247,241,229,.75);font-size:.95rem}
  .coord a:hover{color:var(--terracotta)}
  .promesse{background:rgba(198,93,59,.16);border:1px solid var(--terracotta);border-radius:14px;padding:18px 22px;font-weight:700}

  /* ===== BOUTON WHATSAPP FLOTTANT ===== */
  .whatsapp-btn{position:fixed;bottom:24px;right:24px;z-index:200;width:60px;height:60px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(0,0,0,.25);transition:.2s}
  .whatsapp-btn:hover{transform:scale(1.08)}
  .whatsapp-btn svg{width:32px;height:32px;fill:#fff}

  /* ===== FOOTER ===== */
  footer{background:var(--noir);color:rgba(247,241,229,.6);border-top:1px solid rgba(247,241,229,.12);padding:36px 0;font-size:.9rem}
  .footer-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
  footer img{height:28px;width:auto}

  /* ===== RESPONSIVE ===== */
  @media (max-width:900px){
    .grid-3,.apropos-grid,.contact-grid{grid-template-columns:1fr}
    .nav-links{position:fixed;inset:72px 0 auto 0;background:var(--creme);flex-direction:column;padding:24px;display:none;border-bottom:1px solid rgba(28,19,13,.1)}
    .nav-links.open{display:flex}
    .burger{display:block}
    .btn-ghost{margin-left:0;margin-top:12px}
    section{padding:72px 0}
  }

  /* ===== CHIFFRES CLÉS ===== */
  .stats{background:var(--noir);color:var(--creme);padding:56px 0}
  .stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;text-align:center}
  .stat .num{font-family:'Archivo Black';font-size:clamp(2.2rem,5vw,3.4rem);color:var(--terracotta)}
  .stat p{color:rgba(247,241,229,.75);font-weight:700}
  @media(max-width:900px){.stats-grid{grid-template-columns:repeat(2,1fr)}}

  /* ===== TÉMOIGNAGES ===== */
  .temoignage{background:var(--creme-clair);border:1px solid rgba(28,19,13,.08);border-radius:20px;padding:32px 28px;display:flex;flex-direction:column;gap:18px}
  .temoignage blockquote{font-size:1.02rem;font-style:italic;line-height:1.6}
  .temoignage .auteur{display:flex;align-items:center;gap:14px;margin-top:auto}
  .temoignage .avatar{width:46px;height:46px;border-radius:50%;background:var(--terracotta);color:#fff;font-weight:900;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .temoignage .auteur h4{font-size:.98rem}
  .temoignage .auteur p{font-size:.85rem;color:var(--gris)}
  .etoiles{color:var(--terracotta);letter-spacing:2px}

  /* ===== PAGES INTÉRIEURES ===== */
  .page-hero{padding:170px 0 70px;background:var(--creme-clair);border-bottom:1px solid rgba(28,19,13,.06)}
  .page-hero h1{font-size:clamp(2.4rem,6vw,4rem);margin-bottom:14px}
  .page-hero p{max-width:680px;color:var(--gris);font-size:1.1rem}

  /* ===== PORTFOLIO ===== */
  .folio{border-radius:20px;overflow:hidden;background:var(--creme-clair);border:1px solid rgba(28,19,13,.08);transition:.25s;display:flex;flex-direction:column}
  .folio:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(28,19,13,.12)}
  .folio-visuel{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
  .folio-visuel img{height:56px;width:auto;opacity:.45}
  .folio-visuel.v1{background:linear-gradient(135deg,var(--terracotta),var(--terracotta-fonce))}
  .folio-visuel.v2{background:linear-gradient(135deg,var(--noir),#4a3423)}
  .folio-visuel.v3{background:linear-gradient(135deg,#d99a63,var(--terracotta))}
  .folio-body{padding:24px 24px 28px}
  .folio-body h3{font-size:1.15rem;margin:10px 0 8px}
  .folio-body p{color:var(--gris);font-size:.93rem}
  .a-remplacer{position:absolute;top:14px;right:14px;background:rgba(255,255,255,.88);color:var(--noir);font-size:.7rem;font-weight:700;padding:4px 10px;border-radius:999px}

  /* ===== FAQ ===== */
  .faq-list{max-width:820px;margin:0 auto;display:grid;gap:14px}
  .faq-list details{background:var(--creme-clair);border:1px solid rgba(28,19,13,.08);border-radius:14px;padding:20px 24px}
  .faq-list summary{font-weight:700;cursor:pointer;font-size:1.05rem;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
  .faq-list summary::-webkit-details-marker{display:none}
  .faq-list summary::after{content:"+";font-family:'Archivo Black';color:var(--terracotta);font-size:1.4rem;flex-shrink:0}
  .faq-list details[open] summary::after{content:"–"}
  .faq-list details p{margin-top:12px;color:var(--gris)}

  /* ===== BLOG ===== */
  .article-card{background:var(--creme-clair);border:1px solid rgba(28,19,13,.08);border-radius:20px;overflow:hidden;transition:.25s;display:flex;flex-direction:column}
  .article-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(28,19,13,.10)}
  .article-banniere{height:10px;background:linear-gradient(90deg,var(--terracotta),var(--terracotta-fonce))}
  .article-body{padding:28px}
  .article-body .date{font-size:.8rem;color:var(--gris);text-transform:uppercase;letter-spacing:.08em;font-weight:700}
  .article-body h3{font-size:1.2rem;margin:10px 0}
  .article-body p{color:var(--gris);font-size:.95rem;margin-bottom:14px}
  .badge-exemple{display:inline-block;background:rgba(198,93,59,.14);color:var(--terracotta);font-weight:700;font-size:.72rem;text-transform:uppercase;padding:4px 10px;border-radius:999px;margin-bottom:10px}

  /* ===== ÉTUDES DE CAS ===== */
  .cas{background:var(--creme-clair);border:1px solid rgba(28,19,13,.08);border-radius:24px;padding:48px 44px;margin-bottom:40px}
  .cas h2{font-size:clamp(1.5rem,3vw,2.1rem)}
  .cas-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;margin-top:28px}
  .cas-bloc h3{font-size:1rem;color:var(--terracotta);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
  .cas-bloc p, .cas-bloc li{color:var(--gris);font-size:.97rem}
  .cas-bloc ul{list-style:none}
  .cas-bloc li{padding:4px 0 4px 24px;position:relative}
  .cas-bloc li::before{content:"";position:absolute;left:0;top:14px;width:12px;height:3px;background:var(--terracotta);border-radius:2px}
  .cas-resultats{display:flex;gap:32px;flex-wrap:wrap;margin-top:12px}
  .cas-resultats .r .num{font-family:'Archivo Black';font-size:1.9rem;color:var(--terracotta)}
  .cas-resultats .r p{font-size:.85rem;color:var(--gris)}
  @media(max-width:800px){.cas-grid{grid-template-columns:1fr}.cas{padding:32px 24px}}

  /* ===== COULEURS LISSES : dégradés doux & transitions veloutées ===== */
  a,button{transition:color .25s ease,background-color .25s ease,border-color .25s ease,box-shadow .25s ease}

  .hero{background:linear-gradient(165deg,var(--creme-clair) 0%,var(--creme) 45%,#F0E4CE 100%)}
  .stats{background:linear-gradient(135deg,#251811 0%,var(--noir) 55%,#2E1D12 100%)}
  .mission{background:linear-gradient(135deg,var(--noir) 0%,#35200F 100%)}
  .contact{background:linear-gradient(160deg,#251811 0%,var(--noir) 65%,#221510 100%)}
  footer{background:#171009}
  .partenaires{background:linear-gradient(180deg,var(--creme) 0%,var(--creme-clair) 100%)}
  #temoignages{background:linear-gradient(180deg,var(--creme-clair) 0%,var(--creme) 100%)}
  .page-hero{background:linear-gradient(165deg,var(--creme-clair) 0%,#F0E4CE 100%)}

  .btn{background:linear-gradient(135deg,#D9744E 0%,var(--terracotta) 45%,var(--terracotta-fonce) 100%);border:none;padding:18px 38px}
  .btn:hover{background:linear-gradient(135deg,var(--terracotta) 0%,var(--terracotta-fonce) 100%);transform:translateY(-2px);box-shadow:0 10px 26px rgba(198,93,59,.35)}
  .btn-ghost{background:transparent;border:2px solid var(--noir);box-shadow:none}
  .btn-ghost:hover{background:var(--noir);box-shadow:0 10px 26px rgba(28,19,13,.25)}
  .nav-cta{background:linear-gradient(135deg,#D9744E,var(--terracotta-fonce)) !important}

  .stat .num{background:linear-gradient(135deg,#E89468 0%,var(--terracotta) 60%,#D9744E 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
  .card .num{background:linear-gradient(135deg,#E89468,var(--terracotta-fonce));-webkit-background-clip:text;background-clip:text;color:transparent}
  .mission blockquote span{background:linear-gradient(135deg,#E89468,var(--terracotta));-webkit-background-clip:text;background-clip:text;color:transparent}

  .card,.projet,.temoignage,.folio,.article-card{transition:transform .35s cubic-bezier(.22,.61,.36,1),box-shadow .35s cubic-bezier(.22,.61,.36,1),border-color .35s ease}
  .card:hover{border-color:rgba(198,93,59,.55)}
  .promesse{background:linear-gradient(135deg,rgba(198,93,59,.22),rgba(198,93,59,.10))}
  .projet-bande,.article-banniere{background:linear-gradient(90deg,#E89468,var(--terracotta) 45%,var(--terracotta-fonce))}
  .folio-visuel.v1{background:linear-gradient(140deg,#D9744E 0%,var(--terracotta) 45%,var(--terracotta-fonce) 100%)}
  .folio-visuel.v3{background:linear-gradient(140deg,#E3A778 0%,#D9744E 55%,var(--terracotta) 100%)}
  header{transition:box-shadow .3s ease}

  /* ===== PORTFOLIO AVEC PHOTOS RÉELLES ===== */
  .folio-photo{padding:0}
  .folio-photo img{width:100%;height:100%;object-fit:cover;opacity:1;transition:transform .5s cubic-bezier(.22,.61,.36,1)}
  .folio:hover .folio-photo img{transform:scale(1.05)}