@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,600;1,400&family=DM+Sans:wght@300;400;500&display=swap');
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--onyx:#0D0D0D;--gold:#C9A96E;--gold-lt:#E8D5B0;--ivory:#F5F0E8;--ivory2:#EDE8DF;--gray:#6B6B6B;--lgray:#F0EDE8;--white:#FAFAF8;--nav-h:72px;--max:1140px;--radius:4px;--serif:'Cormorant Garamond',Georgia,serif;--sans:'DM Sans',system-ui,sans-serif;--ease:cubic-bezier(.4,0,.2,1)}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--sans);background:var(--white);color:var(--onyx);line-height:1.7;-webkit-font-smoothing:antialiased}

/* NAV */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--nav-h);display:flex;align-items:center;padding:0 1.5rem;background:rgba(13,13,13,.96);backdrop-filter:blur(12px);border-bottom:1px solid rgba(201,169,110,.15)}
.nav__inner{max-width:var(--max);width:100%;margin:0 auto;display:flex;align-items:center;justify-content:space-between}
.nav__logo{display:flex;flex-direction:column;gap:1px;text-decoration:none}
.nav__logo-name{font-family:var(--serif);font-size:1.2rem;font-weight:600;color:var(--white);letter-spacing:.08em;line-height:1}
.nav__logo-tag{font-size:.6rem;font-weight:300;color:var(--gold);letter-spacing:.18em;text-transform:uppercase}
.nav__links{display:flex;align-items:center;gap:2rem;list-style:none}
.nav__links a{font-size:.78rem;font-weight:400;color:rgba(250,250,248,.6);text-decoration:none;letter-spacing:.06em;text-transform:uppercase;transition:color .2s}
.nav__links a:hover,.nav__links a.active{color:var(--gold)}
.nav__cta{font-size:.72rem !important;font-weight:500 !important;color:var(--onyx) !important;background:var(--gold);padding:.45rem 1rem;border-radius:var(--radius);letter-spacing:.06em;text-transform:uppercase;transition:opacity .2s !important}
.nav__cta:hover{opacity:.85}
.nav__burger{display:none;background:none;border:none;cursor:pointer;padding:.5rem}
.nav__burger span{display:block;width:22px;height:1.5px;background:var(--white);margin:5px 0;transition:.3s}

/* HERO */
.hero{min-height:100vh;display:flex;align-items:center;background:var(--onyx);padding:calc(var(--nav-h) + 3rem) 1.5rem 4rem;position:relative;overflow:hidden}
.hero__bg{position:absolute;inset:0;background-image:url('https://images.unsplash.com/photo-1551288049-bebda4e38f71?w=1600&q=80&auto=format&fit=crop');background-size:cover;background-position:center;opacity:.07;pointer-events:none}
.hero::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 60% at 80% 40%,rgba(201,169,110,.07) 0%,transparent 70%);pointer-events:none}
.hero__inner{max-width:var(--max);width:100%;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center;position:relative;z-index:1}
.hero__eyebrow{font-size:.7rem;font-weight:500;color:var(--gold);letter-spacing:.2em;text-transform:uppercase;margin-bottom:1.25rem;display:flex;align-items:center;gap:.75rem}
.hero__eyebrow::before{content:'';display:block;width:2rem;height:1px;background:var(--gold)}
.hero__title{font-family:var(--serif);font-size:clamp(2.8rem,5vw,4.5rem);font-weight:600;line-height:1.08;color:var(--white);margin-bottom:1.25rem}
.hero__title em{font-style:italic;color:var(--gold)}
.hero__sub{font-size:.95rem;font-weight:300;color:rgba(250,250,248,.6);line-height:1.8;margin-bottom:2rem;max-width:440px}
.hero__actions{display:flex;align-items:center;gap:1.25rem;flex-wrap:wrap}
.hero__stats{display:flex;flex-direction:column;gap:1.5rem;padding-left:2rem;border-left:1px solid rgba(201,169,110,.2)}
.hero__stat-num{font-family:var(--serif);font-size:3rem;font-weight:600;color:var(--gold);line-height:1}
.hero__stat-label{font-size:.78rem;font-weight:300;color:rgba(250,250,248,.5);letter-spacing:.04em}
.hero__stat{border-bottom:1px solid rgba(201,169,110,.1);padding-bottom:1.5rem}
.hero__stat:last-child{border-bottom:none;padding-bottom:0}

/* BUTTONS */
.btn-primary{display:inline-flex;align-items:center;gap:.5rem;background:var(--gold);color:var(--onyx);font-family:var(--sans);font-size:.78rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;padding:.85rem 1.75rem;border-radius:var(--radius);text-decoration:none;transition:opacity .2s var(--ease),transform .2s var(--ease);border:none;cursor:pointer}
.btn-primary:hover{opacity:.88;transform:translateY(-1px)}
.btn-ghost{display:inline-flex;align-items:center;gap:.5rem;background:transparent;color:rgba(250,250,248,.7);font-family:var(--sans);font-size:.78rem;font-weight:400;letter-spacing:.06em;text-decoration:none;padding:.85rem 0;border:none;cursor:pointer;transition:color .2s}
.btn-ghost:hover{color:var(--gold)}
.btn-dark{display:inline-flex;align-items:center;gap:.5rem;background:var(--onyx);color:var(--white);font-family:var(--sans);font-size:.78rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;padding:.85rem 1.75rem;border-radius:var(--radius);text-decoration:none;transition:opacity .2s}
.btn-dark:hover{opacity:.82}

/* SECTIONS */
.section{padding:5rem 1.5rem}
.section--ivory{background:var(--ivory)}
.section--dark{background:var(--onyx)}
.section__inner{max-width:var(--max);width:100%;margin:0 auto}
.section__eyebrow{font-size:.68rem;font-weight:500;color:var(--gold);letter-spacing:.2em;text-transform:uppercase;margin-bottom:1rem;display:flex;align-items:center;gap:.75rem}
.section__eyebrow::before{content:'';display:block;width:1.5rem;height:1px;background:var(--gold)}
.section__title{font-family:var(--serif);font-size:clamp(1.9rem,4vw,3rem);font-weight:600;line-height:1.12;color:var(--onyx);margin-bottom:1.25rem}
.section--dark .section__title{color:var(--white)}
.section__lead{font-size:.95rem;font-weight:300;color:var(--gray);max-width:560px;line-height:1.8;margin-bottom:3rem}
.section--dark .section__lead{color:rgba(250,250,248,.5)}

/* IMMERSIVE */
.immersive{position:relative;overflow:hidden;min-height:400px;display:flex;align-items:center;padding:4rem 1.5rem}
.immersive__bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(.3)}
.immersive__inner{position:relative;z-index:1;max-width:var(--max);margin:0 auto;width:100%}
.immersive__label{font-size:.68rem;font-weight:500;color:var(--gold);letter-spacing:.2em;text-transform:uppercase;margin-bottom:1rem}
.immersive__title{font-family:var(--serif);font-size:clamp(1.6rem,3.5vw,2.8rem);font-weight:600;color:var(--white);line-height:1.2;margin-bottom:1rem;max-width:600px}
.immersive__text{font-size:.92rem;font-weight:300;color:rgba(250,250,248,.7);line-height:1.8;max-width:520px;margin-bottom:1.75rem}

/* PAIN GRID */
.pain-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--ivory2);border:1px solid var(--ivory2)}
.pain-card{background:var(--white);padding:2rem;transition:background .2s}
.pain-card:hover{background:var(--ivory)}
.pain-card__num{font-family:var(--serif);font-size:2.2rem;font-weight:600;color:var(--gold-lt);line-height:1;margin-bottom:.75rem}
.pain-card__title{font-size:.92rem;font-weight:500;color:var(--onyx);margin-bottom:.5rem}
.pain-card__text{font-size:.85rem;font-weight:300;color:var(--gray);line-height:1.7}

/* SERVICES CARDS */
.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.25rem}
.service-card{background:var(--white);border:1px solid var(--ivory2);padding:1.75rem;border-radius:var(--radius);transition:border-color .2s,transform .2s var(--ease)}
.service-card:hover{border-color:var(--gold);transform:translateY(-3px)}
.service-card--featured{border-color:var(--gold);background:var(--onyx)}
.service-card__tag{font-size:.6rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);background:rgba(201,169,110,.1);padding:.2rem .65rem;border-radius:2rem;display:inline-block;margin-bottom:1rem}
.service-card__title{font-family:var(--serif);font-size:1.3rem;font-weight:600;color:var(--onyx);margin-bottom:.5rem;line-height:1.2}
.service-card--featured .service-card__title{color:var(--white)}
.service-card__desc{font-size:.83rem;font-weight:300;color:var(--gray);line-height:1.7;margin-bottom:1.25rem}
.service-card--featured .service-card__desc{color:rgba(250,250,248,.55)}
.service-card__price{font-family:var(--serif);font-size:1.4rem;font-weight:600;color:var(--gold)}
.service-card__unit{font-size:.72rem;font-weight:300;color:var(--gray);margin-top:.1rem}
.service-card--featured .service-card__unit{color:rgba(250,250,248,.4)}

/* PROMISE */
.promise-block{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.promise-quote{font-family:var(--serif);font-size:clamp(1.6rem,3vw,2.4rem);font-weight:600;font-style:italic;color:var(--white);line-height:1.25;border-left:3px solid var(--gold);padding-left:1.5rem}
.promise-points{display:flex;flex-direction:column;gap:1.25rem}
.promise-point{display:flex;gap:1rem;align-items:flex-start}
.promise-point__icon{width:2rem;height:2rem;flex-shrink:0;border-radius:50%;background:rgba(201,169,110,.12);border:1px solid rgba(201,169,110,.3);display:flex;align-items:center;justify-content:center;margin-top:.1rem}
.promise-point__icon svg{width:12px;height:12px;stroke:var(--gold);fill:none;stroke-width:2}
.promise-point__title{font-size:.88rem;font-weight:500;color:var(--white);margin-bottom:.2rem}
.promise-point__text{font-size:.82rem;font-weight:300;color:rgba(250,250,248,.5);line-height:1.7}

/* CTA BAND */
.cta-band{background:var(--gold);padding:4rem 1.5rem;text-align:center}
.cta-band__title{font-family:var(--serif);font-size:clamp(1.6rem,3.5vw,2.5rem);font-weight:600;color:var(--onyx);margin-bottom:.75rem}
.cta-band__sub{font-size:.88rem;font-weight:300;color:rgba(13,13,13,.65);margin-bottom:2rem}

/* FOOTER */
footer{background:var(--onyx);border-top:1px solid rgba(201,169,110,.1);padding:2.5rem 1.5rem}
.footer__inner{max-width:var(--max);margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1.5rem}
.footer__logo{font-family:var(--serif);font-size:1.1rem;font-weight:600;color:var(--white);letter-spacing:.08em}
.footer__slogan{font-size:.75rem;font-weight:300;color:var(--gold);font-style:italic;margin-top:.2rem}
.footer__links{display:flex;gap:1.5rem;flex-wrap:wrap;list-style:none}
.footer__links a{font-size:.72rem;color:rgba(250,250,248,.4);text-decoration:none;letter-spacing:.05em;transition:color .2s}
.footer__links a:hover{color:var(--gold)}
.footer__copy{font-size:.7rem;color:rgba(250,250,248,.25);letter-spacing:.04em}

/* PAGE HERO */
.page-hero{background:var(--onyx);padding:calc(var(--nav-h) + 3.5rem) 1.5rem 3.5rem;text-align:center}
.page-hero__title{font-family:var(--serif);font-size:clamp(2rem,5vw,3.5rem);font-weight:600;color:var(--white);margin-bottom:1rem}
.page-hero__sub{font-size:.92rem;font-weight:300;color:rgba(250,250,248,.5);max-width:500px;margin:0 auto;line-height:1.8}

/* SERVICES PAGE */
.service-detail{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;padding:4rem 0;border-bottom:1px solid var(--ivory2)}
.service-detail:last-child{border-bottom:none}
.service-detail:nth-child(even) .service-detail__visual{order:-1}
.service-detail__label{font-size:.65rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);margin-bottom:.75rem}
.service-detail__title{font-family:var(--serif);font-size:2rem;font-weight:600;color:var(--onyx);margin-bottom:1rem;line-height:1.15}
.service-detail__desc{font-size:.92rem;font-weight:300;color:var(--gray);line-height:1.8;margin-bottom:1.5rem}
.service-detail__delivers{list-style:none;margin-bottom:1.75rem}
.service-detail__delivers li{font-size:.85rem;font-weight:400;color:var(--onyx);padding:.4rem 0;border-bottom:1px solid var(--lgray);display:flex;align-items:center;gap:.6rem}
.service-detail__delivers li::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--gold);flex-shrink:0}
.service-detail__price{font-family:var(--serif);font-size:1.7rem;font-weight:600;color:var(--onyx)}
.service-detail__price span{font-size:.82rem;font-weight:300;color:var(--gray);font-family:var(--sans)}
.service-detail__visual{border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3;position:relative}
.service-detail__visual img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease)}
.service-detail__visual:hover img{transform:scale(1.04)}
.service-visual-num{position:absolute;bottom:1.5rem;right:1.5rem;font-family:var(--serif);font-size:4rem;font-weight:600;color:rgba(255,255,255,.15);line-height:1}

/* À PROPOS */
.about-grid{display:grid;grid-template-columns:5fr 7fr;gap:4rem;align-items:start}
.about-photo{border-radius:var(--radius);overflow:hidden;aspect-ratio:3/4;max-width:340px}
.about-photo img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.about-name{font-family:var(--serif);font-size:2.2rem;font-weight:600;color:var(--onyx);margin-bottom:.25rem}
.about-role{font-size:.78rem;font-weight:400;color:var(--gold);letter-spacing:.1em;text-transform:uppercase;margin-bottom:1.75rem}
.about-bio{font-size:.9rem;font-weight:300;color:var(--gray);line-height:1.9;margin-bottom:1.75rem}
.about-skills{display:grid;grid-template-columns:1fr 1fr;gap:.65rem;margin-bottom:2rem}
.about-skill{display:flex;align-items:center;gap:.6rem;font-size:.82rem;font-weight:400;color:var(--onyx)}
.about-skill::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--gold);flex-shrink:0}
.about-values{display:flex;flex-direction:column;gap:1rem}
.about-value{padding:1.1rem 1.25rem;background:var(--ivory);border-left:3px solid var(--gold)}
.about-value__title{font-size:.85rem;font-weight:500;color:var(--onyx);margin-bottom:.25rem}
.about-value__text{font-size:.82rem;font-weight:300;color:var(--gray);line-height:1.7}

/* CONTACT */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.contact-info__title{font-family:var(--serif);font-size:1.7rem;font-weight:600;color:var(--onyx);margin-bottom:1rem}
.contact-info__text{font-size:.88rem;font-weight:300;color:var(--gray);line-height:1.8;margin-bottom:2rem}
.contact-items{display:flex;flex-direction:column;gap:1.1rem}
.contact-item{display:flex;gap:1rem;align-items:flex-start}
.contact-item__icon{width:2.1rem;height:2.1rem;flex-shrink:0;background:var(--ivory);border:1px solid var(--ivory2);border-radius:var(--radius);display:flex;align-items:center;justify-content:center}
.contact-item__icon svg{width:14px;height:14px;stroke:var(--gold);fill:none;stroke-width:1.8}
.contact-item__label{font-size:.66rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--gray);margin-bottom:.2rem}
.contact-item__value{font-size:.88rem;font-weight:400;color:var(--onyx)}
.contact-item__value a{color:var(--gold);text-decoration:none}
.calendly-box{background:var(--onyx);border-radius:var(--radius);padding:2.5rem 2rem;text-align:center}
.calendly-box__title{font-family:var(--serif);font-size:1.4rem;font-weight:600;color:var(--white);margin-bottom:.75rem}
.calendly-box__sub{font-size:.83rem;font-weight:300;color:rgba(250,250,248,.5);line-height:1.8;margin-bottom:1.75rem}
.calendly-box__detail{font-size:.72rem;font-weight:300;color:rgba(250,250,248,.3);margin-top:1rem}

/* CLIENTS */
.clients-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;margin-top:1rem}
.client-card{background:var(--white);border:1px solid var(--ivory2);border-radius:var(--radius);padding:1.75rem;transition:border-color .2s,transform .2s var(--ease)}
.client-card:hover{border-color:var(--gold);transform:translateY(-3px)}
.client-card__sector{font-size:.62rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);margin-bottom:.65rem}
.client-card__name{font-family:var(--serif);font-size:1.5rem;font-weight:600;color:var(--onyx);margin-bottom:.65rem;line-height:1.1}
.client-card__desc{font-size:.83rem;font-weight:300;color:var(--gray);line-height:1.7}

/* ANIMATIONS */
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.fade-up{animation:fadeUp .7s var(--ease) both}
.delay-1{animation-delay:.1s}
.delay-2{animation-delay:.22s}
.delay-3{animation-delay:.34s}
.delay-4{animation-delay:.46s}

/* ── MOBILE FIXES ─────────────────────────────────────────────────── */
@media(max-width:900px){
  /* Nav */
  .nav__links{display:none}
  .nav__burger{display:block}
  .nav__links.open{display:flex;flex-direction:column;position:fixed;top:var(--nav-h);left:0;right:0;background:var(--onyx);padding:1.5rem 1.5rem 2rem;gap:1.25rem;border-top:1px solid rgba(201,169,110,.12);z-index:99}

  /* Hero — une colonne, stats en ligne */
  .hero{padding:calc(var(--nav-h) + 2rem) 1.25rem 3rem;min-height:auto}
  .hero__inner{grid-template-columns:1fr;gap:2.5rem}
  .hero__title{font-size:2.6rem}
  .hero__sub{max-width:100%;font-size:.9rem}
  .hero__stats{flex-direction:row;flex-wrap:wrap;gap:1rem;border-left:none;padding-left:0;border-top:1px solid rgba(201,169,110,.15);padding-top:1.5rem}
  .hero__stat{border-bottom:none;padding-bottom:0;flex:1;min-width:120px}
  .hero__stat-num{font-size:2rem}
  .hero__actions{flex-direction:column;align-items:flex-start;gap:1rem}
  .btn-primary,.btn-ghost{width:100%;justify-content:center}

  /* Pain grid — une colonne */
  .pain-grid{grid-template-columns:1fr}

  /* Services cards */
  .services-grid{grid-template-columns:1fr}

  /* Promise */
  .promise-block{grid-template-columns:1fr;gap:2rem}

  /* Service detail */
  .service-detail{grid-template-columns:1fr;gap:2rem;padding:2.5rem 0}
  .service-detail:nth-child(even) .service-detail__visual{order:0}
  .service-detail__title{font-size:1.6rem}

  /* À propos */
  .about-grid{grid-template-columns:1fr;gap:2rem}
  .about-photo{max-width:280px;margin:0 auto}
  .about-name{font-size:1.8rem}
  .about-skills{grid-template-columns:1fr 1fr}

  /* Contact */
  .contact-grid{grid-template-columns:1fr;gap:2rem}

  /* Clients */
  .clients-grid{grid-template-columns:1fr}

  /* Footer */
  .footer__inner{flex-direction:column;text-align:center;gap:1.25rem}
  .footer__links{justify-content:center;gap:1rem}

  /* Sections padding */
  .section{padding:3.5rem 1.25rem}
  .immersive{padding:3rem 1.25rem;min-height:320px}
  .cta-band{padding:3rem 1.25rem}
  .page-hero{padding:calc(var(--nav-h) + 2.5rem) 1.25rem 2.5rem}
}

@media(max-width:560px){
  .hero__title{font-size:2.2rem}
  .about-skills{grid-template-columns:1fr}
  .about-photo{max-width:100%}
  .hero__stat{min-width:100px}
  .service-detail__title{font-size:1.5rem}
  .section__title{font-size:1.7rem}

  /* Notre histoire — grille nom */
  .histoire-nom-grid{grid-template-columns:1fr !important}
  
  /* Mission Vision Valeurs — une colonne */
  .mvv-grid{grid-template-columns:1fr !important}
}
