/* ============================================================
   KB DIGITAL — style.css v4
   Identité : Noir profond / Or #999 / Blanc crème
   Photo fondateur plein écran + texture Art Déco géométrique
============================================================ */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
img,svg,iframe,video,picture{max-width:100%;height:auto;display:block}

:root {
  --c-black:   #0a0a0a;
  --c-dark:    #0e0e0e;
  --c-charcoal:#181818;
  --c-mid:     #242424;
  --c-border:  #2a2a2a;
  --c-muted:   #666;
  --c-light:   #999;
  --c-white:   #f5f3ef;
  --c-accent:  #c9a96e;
  --c-accent2: #e8d5a8;
  --c-gold-glow: rgba(201,169,110,.18);
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'DM Sans', system-ui, sans-serif;
  --space-md:  2rem;
  --space-lg:  4rem;
  --space-xl:  7rem;
  --max-width: 1200px;
  --nav-h:     72px;
  --ease:      cubic-bezier(0.25,0.46,0.45,0.94);
  --ease-out:  cubic-bezier(0.16,1,0.3,1);
}

html{scroll-behavior:smooth;scroll-padding-top:var(--nav-h);font-size:16px}
body{font-family:var(--font-body);background:var(--c-black);color:var(--c-white);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--c-accent);color:var(--c-black)}
.container{max-width:var(--max-width);margin:0 auto;padding:0 var(--space-md)}
@media(max-width:768px){.container{padding:0 1.25rem}}

/* REVEAL */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.reveal--delay-1{transition-delay:.12s}
.reveal--delay-2{transition-delay:.24s}
.reveal--delay-3{transition-delay:.38s}
.reveal--delay-4{transition-delay:.54s}
.reveal.is-visible{opacity:1;transform:translateY(0)}

/* BOUTONS */
.btn{display:inline-flex;align-items:center;gap:.6rem;padding:.85rem 2rem;border-radius:1px;font-family:var(--font-body);font-size:.82rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;cursor:pointer;border:1.5px solid transparent;transition:all .3s var(--ease);white-space:nowrap;position:relative;overflow:hidden}
.btn::before{content:'';position:absolute;inset:0;background:rgba(153,153,153,.08);opacity:0;transition:opacity .25s}
.btn:hover::before{opacity:1}

.btn--primary{background:var(--c-accent);color:var(--c-black);border-color:var(--c-accent);font-weight:600}
.btn--primary:hover{background:var(--c-accent2);border-color:var(--c-accent2);transform:translateY(-2px);box-shadow:0 10px 30px rgba(153,153,153,.3)}

.btn--ghost{background:rgba(255,255,255,.08);color:var(--c-white);border-color:rgba(255,255,255,.2);backdrop-filter:blur(8px)}
.btn--ghost:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.4);transform:translateY(-2px)}

.btn--outline{background:transparent;color:var(--c-white);border-color:var(--c-border)}
.btn--outline:hover{border-color:var(--c-accent);color:var(--c-accent);transform:translateY(-2px)}

.btn, .nav__mobile-link{
  touch-action: manipulation;
}
.btn:active, .nav__mobile-link:active{
  transform: translateY(1px) scale(0.99);
}

@keyframes mobileFloatIn{
  from{opacity:0;transform:translateY(16px) scale(0.98)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

.btn--full{width:100%;justify-content:center}
.btn--large{padding:1.1rem 2.5rem;font-size:.88rem}

/* TAGS */
.section-tag{display:inline-block;font-size:.65rem;font-weight:600;letter-spacing:.25em;text-transform:uppercase;color:var(--c-accent);margin-bottom:1rem}
.section-tag--light{color:var(--c-accent2)}
.section-header{text-align:center;margin-bottom:var(--space-lg)}
.section-title{font-family:var(--font-display);font-size:clamp(2.4rem,5vw,3.8rem);font-weight:300;line-height:1.12;color:var(--c-white)}
.section-title em{font-style:italic;color:var(--c-accent)}
.section-subtitle{margin-top:.9rem;color:var(--c-light);font-size:.9rem}

/* ═══════════════════════════════════════
   NAV
═══════════════════════════════════════ */
.nav{position:fixed;top:0;left:0;width:100%;z-index:100;height:var(--nav-h);background:transparent;border-bottom:1px solid transparent;transition:background .5s var(--ease),border-color .5s,backdrop-filter .5s}
.nav.nav--scrolled{background:rgba(10,10,10,.92);border-bottom-color:rgba(153,153,153,.15);backdrop-filter:blur(20px)}
.nav__container{max-width:var(--max-width);margin:0 auto;padding:0 var(--space-md);height:100%;display:flex;align-items:center;justify-content:space-between}
.nav__logo{text-decoration:none;display:flex;align-items:center}
.nav__logo-img{height:44px;width:auto;object-fit:contain;transition:filter .2s}
.nav__logo:hover .nav__logo-img{filter:drop-shadow(0 0 8px rgba(153,153,153,.6))}
.nav__links{display:flex;list-style:none;gap:2.5rem;align-items:center}
.nav__link{font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:rgba(245,243,239,.6);transition:color .25s;position:relative}
.nav__link::after{content:'';position:absolute;bottom:-4px;left:0;width:0;height:1px;background:var(--c-accent);transition:width .3s var(--ease-out)}
.nav__link:hover{color:var(--c-white)}
.nav__link:hover::after{width:100%}
.nav__link--cta{color:var(--c-accent)!important;border:1px solid rgba(153,153,153,.5);padding:.4rem 1rem;border-radius:1px}
.nav__link--cta::after{display:none}
.nav__link--cta:hover{background:var(--c-accent);color:var(--c-black)!important;border-color:var(--c-accent)}

.nav__burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:4px}
.nav__burger span{display:block;width:24px;height:1px;background:var(--c-white);transition:all .3s var(--ease)}
.nav__burger.is-open span:nth-child(1){transform:rotate(45deg) translate(4px,4px)}
.nav__burger.is-open span:nth-child(2){opacity:0}
.nav__burger.is-open span:nth-child(3){transform:rotate(-45deg) translate(4px,-4px)}
.nav__mobile{position:absolute;top:var(--nav-h);left:0;width:100%;background:rgba(14,14,14,.97);border-bottom:1px solid var(--c-border);max-height:0;overflow:hidden;transition:max-height .4s var(--ease),padding .3s;backdrop-filter:blur(20px)}
.nav__mobile.is-open{max-height:400px;padding:1.5rem 0}
.nav__mobile ul{list-style:none}
.nav__mobile-link{display:block;padding:.85rem var(--space-md);font-size:.82rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;color:var(--c-light);border-bottom:1px solid var(--c-border);transition:color .2s,padding-left .2s,border-color .2s}
.nav__mobile-link:hover{color:var(--c-accent);padding-left:calc(var(--space-md) + 10px);border-bottom-color:rgba(153,153,153,.2)}
@media(max-width:768px){.nav__links{display:none}.nav__burger{display:flex}}

/* ═══════════════════════════════════════
   HERO — Photo plein écran
═══════════════════════════════════════ */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;background:var(--c-black)}

/* Photo plein écran */
.hero__bg{position:absolute;inset:0;z-index:0}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:100% center;animation:heroScale 14s ease-in-out infinite alternate}
@keyframes heroScale{from{transform:scale(1.03)}to{transform:scale(1)}}

/* Gradient sur la gauche pour lisibilité — dégradé fort de gauche vers transparent */
.hero__bg-overlay{
  position:absolute;inset:0;
  background:
    linear-gradient(to right,
      rgba(10,10,10,1) 0%,
      rgba(10,10,10,1) 30%,
      rgba(10,10,10,.95) 45%,
      rgba(10,10,10,.75) 60%,
      rgba(10,10,10,.4) 75%,
      rgba(10,10,10,.12) 90%,
      rgba(10,10,10,.05) 100%),
    linear-gradient(to top,
      rgba(10,10,10,.6) 0%,
      transparent 40%);
}

/* Texture Art Déco géométrique */
.hero__deco{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.5}

/* Lignes verticales */
.hero__grid-lines{position:absolute;inset:0;display:flex;justify-content:space-between;pointer-events:none;z-index:1;opacity:.06}
.hero__grid-lines span{display:block;width:1px;height:100%;background:linear-gradient(to bottom,transparent,var(--c-accent),transparent)}

/* Contenu */
.hero__container{position:relative;z-index:2;max-width:var(--max-width);margin:0 auto;padding:calc(var(--nav-h) + 3rem) 0.5rem 4rem;width:100%}
.hero__content{width:100%}

.hero__badge{display:inline-flex;align-items:center;gap:.6rem;font-size:.65rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--c-accent);border:1px solid rgba(153,153,153,.35);padding:.4rem 1rem;border-radius:1px;margin-bottom:2rem;background:rgba(153,153,153,.06);backdrop-filter:blur(4px)}
.hero__badge-dot{width:6px;height:6px;border-radius:50%;background:#4caf50;animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(76,175,80,.5)}50%{box-shadow:0 0 0 8px rgba(76,175,80,0)}}

.hero__title{font-family:var(--font-display);font-size:clamp(3rem,7.5vw,7rem);font-weight:300;line-height:1.02;letter-spacing:-.01em;margin-bottom:1.8rem;color:var(--c-white);text-shadow:0 2px 30px rgba(0,0,0,.5)}
.hero__title em{font-style:italic;color:var(--c-accent);display:block}

.hero__subtitle{font-size:x-large;color:rgba(245,243,239,.75);font-weight:300;line-height:1.8;margin-bottom:2.8rem;text-shadow:0 1px 10px rgba(0,0,0,.4)}

.hero__ctas{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:4rem}

.hero__stats{display:flex;align-items:center;gap:2.5rem;padding:1.5rem 2rem;background:rgba(10,10,10,.4);backdrop-filter:blur(12px);border:1px solid rgba(153,153,153,.15);border-radius:2px;width:fit-content}
.hero__stat{text-align:left}
.hero__stat-number{display:block;font-family:var(--font-display);font-size:2.2rem;font-weight:300;color:var(--c-accent);line-height:1}
.hero__stat-label{display:block;font-size:.62rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(245,243,239,.5);margin-top:.3rem}
.hero__stat-divider{width:1px;height:2.5rem;background:rgba(153,153,153,.2)}

.hero__scroll-hint{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;opacity:.35;z-index:2}
.hero__scroll-hint span{font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;color:var(--c-white)}
.hero__scroll-line{width:1px;height:36px;background:linear-gradient(to bottom,var(--c-white),transparent);animation:scrollAnim 2s ease-in-out infinite}
@keyframes scrollAnim{0%,100%{opacity:.35;transform:scaleY(1)}50%{opacity:.7;transform:scaleY(.7)}}

@media(max-width:900px){
  .hero{min-height:100vh}
  .hero__bg img{object-position:right center}
  .hero__container{padding:calc(var(--nav-h) + 2rem) 1rem 2.5rem;animation:mobileFloatIn .9s ease-out both}
  .hero__content{max-width:100%}
  .hero__badge{font-size:.72rem;padding:.55rem .95rem;animation:mobileFloatIn .9s ease-out both;animation-delay:.1s}
  .hero__title{font-size:clamp(2.5rem,8vw,4rem);margin-bottom:1.6rem}
  .hero__subtitle{font-size:1rem;margin-bottom:2rem}
  .hero__ctas{flex-direction:column;align-items:stretch;gap:1rem}
  .hero__ctas .btn{width:100%;justify-content:center;min-height:54px;border-radius:18px;box-shadow:0 20px 40px rgba(0,0,0,.18);animation:mobileFloatIn .9s ease-out both;animation-delay:.18s}
  .hero__stats{flex-direction:column;align-items:flex-start;gap:1rem;padding:1rem 1.25rem;width:100%;background:rgba(255,255,255,.05);border-radius:22px;animation:mobileFloatIn .9s ease-out both;animation-delay:.24s}
  .hero__stat-divider{display:none}
  .hero__scroll-hint{position:relative;bottom:auto;left:auto;transform:none;margin-top:1.5rem;opacity:.8}
}

@media(max-width:768px){
  .hero__bg img{object-position:right center}
  .hero__bg-overlay{background:linear-gradient(to right,rgba(10,10,10,.96) 0%,rgba(10,10,10,.88) 45%,rgba(10,10,10,.45) 75%,rgba(10,10,10,.2) 100%),linear-gradient(to top,rgba(10,10,10,.6) 0%,transparent 45%)}
  .hero__title{font-size:clamp(2.2rem,9vw,3.5rem)}
  .hero__subtitle{font-size:.98rem;line-height:1.7}
  .hero__ctas .btn{padding:1rem 1.2rem;font-size:.95rem}
  .hero__stats{gap:1rem;padding:1rem 1rem}
  .hero__stat-number{font-size:1.5rem}
  .nav__mobile-link{font-size:.95rem;padding:1rem 1.25rem}
}

@media(max-width:600px){
  .hero__bg img{object-position:right center}
  .hero__container{padding:calc(var(--nav-h) + 1.5rem) .9rem 2rem}
  .hero__title{font-size:clamp(2rem,10vw,3rem)}
  .hero__subtitle{font-size:.92rem;line-height:1.6}
  .hero__badge{padding:.45rem .8rem}
  .hero__ctas{gap:.85rem}
  .hero__ctas .btn{border-radius:20px;box-shadow:0 18px 36px rgba(0,0,0,.22);}
  .hero__stats{padding:1rem;gap:.85rem}
}

@media (hover: none) and (pointer: coarse){
  .presentation__founder:hover .presentation__founder-overlay,
  .presentation__founder:hover img,
  .service-card:hover,
  .service-card:hover .service-card__icon,
  .btn:hover,
  .pricing-card:hover,
  .pillar-card:hover{
    transform:none;
    box-shadow:none;
  }
  .presentation__founder-overlay{opacity:1}
  .presentation__founder img{transition:none}
}


/* ═══════════════════════════════════════
   TICKER
═══════════════════════════════════════ */
.ticker{overflow:hidden;border-top:1px solid rgba(153,153,153,.2);border-bottom:1px solid rgba(153,153,153,.2);background:var(--c-charcoal);padding:.65rem 0}
.ticker__track{display:flex;gap:2rem;width:max-content;animation:ticker 30s linear infinite}
.ticker__track span{font-size:.65rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--c-muted);white-space:nowrap;flex-shrink:0}
.ticker__sep{color:var(--c-accent)!important}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ═══════════════════════════════════════
   PRÉSENTATION
═══════════════════════════════════════ */
.presentation{padding:var(--space-xl) 0;background:var(--c-dark);border-top:1px solid var(--c-border);position:relative;overflow:hidden}
.section-deco{position:absolute;inset:0;pointer-events:none;z-index:0;opacity:.4}
.presentation__inner{display:grid;grid-template-columns:1fr 1.5fr;gap:6rem;align-items:start;margin-bottom:5rem;position:relative;z-index:1}

.presentation__title{font-family:var(--font-display);font-size:clamp(2.6rem,5vw,4.5rem);font-weight:300;line-height:1.08;margin-bottom:1.5rem}
.presentation__title em{font-style:italic;color:var(--c-accent)}
.presentation__accent-line{width:50px;height:1px;background:linear-gradient(to right,var(--c-accent),transparent);margin-bottom:2rem}

/* Photo fondateur dans la section présentation */
.presentation__founder{position:relative;margin-top:2rem;overflow:hidden;border-radius:1px;max-width:120px}
.presentation__founder img{width:100%;max-width:120px;height:auto;object-fit:cover;object-position:right top;display:block;transition:transform .6s var(--ease),filter .4s}
.presentation__founder:hover img{transform:scale(1.04)}
.presentation__founder-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,10,10,.85) 0%,transparent 50%);display:flex;align-items:flex-end;padding:1rem 1.2rem;opacity:0;transition:opacity .35s}
.presentation__founder:hover .presentation__founder-overlay{opacity:1}
.presentation__founder-overlay span{font-size:.65rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--c-accent)}

.presentation__text{color:var(--c-light);font-size:.92rem;line-height:1.9;margin-bottom:1.2rem;font-weight:300}
.presentation__text strong{color:var(--c-white);font-weight:500}
.presentation__clients{display:flex;flex-wrap:wrap;gap:.5rem;margin:2rem 0;padding:1.2rem;border:1px solid var(--c-border);background:rgba(153,153,153,.03)}
.presentation__clients span{font-size:.65rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--c-muted);padding:.3rem .8rem;border:1px solid var(--c-border);transition:all .25s;cursor:default}
.presentation__clients span:hover{color:var(--c-accent);border-color:rgba(153,153,153,.4);background:rgba(153,153,153,.06);transform:translateY(-1px)}
.presentation__cta{margin-top:2rem}

/* Pillars */
.presentation__pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--c-border);border:1px solid var(--c-border);overflow:hidden;position:relative;z-index:1}
.pillar-card{background:var(--c-charcoal);padding:2rem 1.5rem;transition:background .3s,transform .3s;position:relative;overflow:hidden;cursor:default}
.pillar-card::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:linear-gradient(to right,var(--c-accent),var(--c-accent2));transition:width .4s var(--ease)}
.pillar-card:hover{background:var(--c-mid)}
.pillar-card:hover::after{width:100%}
.pillar-card__icon{width:44px;height:44px;border:1px solid rgba(153,153,153,.2);display:flex;align-items:center;justify-content:center;margin-bottom:1.2rem;color:var(--c-accent);transition:border-color .25s,background .25s,transform .25s}
.pillar-card:hover .pillar-card__icon{border-color:var(--c-accent);background:rgba(153,153,153,.08);transform:rotate(5deg) scale(1.05)}
.pillar-card__title{font-family:var(--font-display);font-size:1.15rem;font-weight:400;color:var(--c-white);margin-bottom:.5rem}
.pillar-card__text{font-size:.8rem;color:var(--c-muted);line-height:1.75}

@media(max-width:900px){.presentation__inner{grid-template-columns:1fr;gap:3rem}.presentation__pillars{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.presentation__pillars{grid-template-columns:1fr}}

/* ═══════════════════════════════════════
   SERVICES
═══════════════════════════════════════ */
.services{padding:var(--space-xl) 0;background:var(--c-black);border-top:1px solid var(--c-border)}
.services__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--c-border);border:1px solid var(--c-border);overflow:hidden}

.service-card{background:var(--c-charcoal);padding:3rem 2.5rem;position:relative;overflow:hidden;transition:background .35s}

/* Image qui apparaît au survol */
.service-card__img{position:absolute;inset:0;opacity:0;transition:opacity .5s var(--ease);z-index:0;background:var(--c-black)}
.service-card__img img{width:100%;height:100%;object-fit:contain;object-position:center;filter:saturate(.5) brightness(.55);background:var(--c-black)}
.service-card:hover .service-card__img{opacity:1}
.service-card:hover{background:transparent}

/* Overlay sur l'image */
.service-card::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(14,14,14,.95) 40%,rgba(14,14,14,.6) 100%);z-index:1;opacity:0;transition:opacity .4s}
.service-card:hover::before{opacity:1}

.service-card__number{font-family:var(--font-display);font-size:4rem;font-weight:300;color:rgba(255,255,255,.05);line-height:1;position:absolute;top:1.2rem;right:1.5rem;transition:color .35s;z-index:2}
.service-card:hover .service-card__number{color:rgba(153,153,153,.15)}

.service-card__content{position:relative;z-index:2}
.service-card__title{font-family:var(--font-display);font-size:1.6rem;font-weight:400;color:var(--c-white);margin-bottom:.9rem;transition:color .25s}
.service-card:hover .service-card__title{color:var(--c-accent2)}
.service-card__text{font-size:.85rem;color:var(--c-muted);line-height:1.85;margin-bottom:1.5rem;transition:color .25s}
.service-card:hover .service-card__text{color:rgba(245,243,239,.7)}
.service-card__list{list-style:none;display:flex;flex-direction:column;gap:.5rem}
.service-card__list li{font-size:.78rem;color:var(--c-light);padding-left:1.2rem;position:relative;transition:color .2s}
.service-card__list li::before{content:'—';position:absolute;left:0;color:var(--c-accent);font-size:.7rem}
.service-card:hover .service-card__list li{color:rgba(245,243,239,.6)}

/* CTA qui apparaît au survol */
.service-card__cta{position:absolute;bottom:1.8rem;right:2rem;font-size:.68rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--c-accent);opacity:0;transform:translateX(8px);transition:all .35s var(--ease);z-index:2}
.service-card:hover .service-card__cta{opacity:1;transform:translateX(0)}

.service-card__accent{position:absolute;bottom:0;left:0;height:2px;width:0;background:linear-gradient(to right,var(--c-accent),var(--c-accent2));transition:width .45s var(--ease);z-index:2}
.service-card:hover .service-card__accent{width:100%}

.service-card__tag{position:absolute;top:1.5rem;left:2.5rem;font-size:.6rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--c-accent);border:1px solid rgba(153,153,153,.4);padding:.25rem .7rem;z-index:3;background:rgba(10,10,10,.5)}

@media(max-width:768px){.services__grid{grid-template-columns:1fr}.service-card{padding:2.5rem 1.75rem}.service-card__cta{opacity:1;transform:none;position:relative;bottom:auto;right:auto;margin-top:1.5rem;display:inline-flex}.service-card__accent{display:none}.service-card::before{opacity:1}}

/* ═══════════════════════════════════════
   BAND CITATION
═══════════════════════════════════════ */
.identity-band{padding:5rem 0;background:var(--c-charcoal);border-top:1px solid rgba(153,153,153,.15);border-bottom:1px solid rgba(153,153,153,.15);position:relative;overflow:hidden;transition:border-color .7s ease,background .7s ease;cursor:default}
.identity-band:hover{border-top-color:rgba(201,169,110,.3);border-bottom-color:rgba(201,169,110,.3)}
.identity-band::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 100% at 50% 50%,rgba(201,169,110,.06) 0%,transparent 70%);opacity:0;transition:opacity 1s ease;pointer-events:none}
.identity-band:hover::before{opacity:1}
.identity-band__deco{position:absolute;inset:0;pointer-events:none;opacity:.5;transition:opacity .8s ease}
.identity-band:hover .identity-band__deco{opacity:.85}
.identity-band__inner{display:flex;align-items:center;gap:3rem}
.identity-band__line{flex:1;height:1px;background:linear-gradient(to right,transparent,rgba(153,153,153,.3),transparent);transition:background .7s ease,transform .8s cubic-bezier(0.16,1,0.3,1);transform:scaleX(1)}
.identity-band:hover .identity-band__line{background:linear-gradient(to right,transparent,rgba(201,169,110,.5),transparent)}
.identity-band__quote{font-family:var(--font-display);font-size:clamp(1.4rem,3vw,2.2rem);font-weight:300;color:var(--c-white);text-align:center;white-space:nowrap;flex-shrink:0;transition:letter-spacing .7s cubic-bezier(0.16,1,0.3,1)}
.identity-band:hover .identity-band__quote{letter-spacing:.05em}
.identity-band__quote em{font-style:italic;color:var(--c-accent);display:inline-block;transition:text-shadow .7s ease,transform .7s cubic-bezier(0.16,1,0.3,1)}
.identity-band:hover .identity-band__quote em{text-shadow:0 0 28px rgba(201,169,110,.4);transform:translateY(-2px)}
@media(max-width:768px){
  .identity-band__quote{font-size:1.2rem;white-space:normal}
  .identity-band__inner{flex-direction:column;gap:1.5rem}
  .identity-band:hover .identity-band__quote{letter-spacing:0}
  .identity-band--active .identity-band__line{background:linear-gradient(to right,transparent,rgba(201,169,110,.45),transparent);transition:background .7s ease}
  .identity-band--active .identity-band__quote{letter-spacing:.03em;transition:letter-spacing .6s ease}
  .identity-band--active .identity-band__quote em{text-shadow:0 0 20px rgba(201,169,110,.35);transform:translateY(-1px);transition:text-shadow .6s ease,transform .6s ease}
}

/* ═══════════════════════════════════════
   TARIFS
═══════════════════════════════════════ */
.offres{padding:var(--space-xl) 0;background:var(--c-dark);border-top:1px solid var(--c-border);position:relative;overflow:hidden}
.offres__bg-text{position:absolute;right:-3rem;top:50%;transform:translateY(-50%);font-family:var(--font-display);font-size:clamp(10rem,18vw,20rem);font-weight:300;font-style:italic;color:rgba(153,153,153,.025);pointer-events:none;user-select:none;line-height:1}

.pricing__groups{display:grid;grid-template-columns:1fr;gap:1.5rem;max-width:1120px;margin:0 auto 2rem}

.pricing__group{display:flex;flex-direction:column;gap:1.5rem}
.pricing__group-title{font-family:var(--font-display);font-size:1.05rem;font-weight:400;color:var(--c-white);text-transform:uppercase;letter-spacing:.2em;margin-bottom:.75rem}
.pricing__group-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}

.pricing-card{background:var(--c-charcoal);border:1px solid var(--c-border);padding:2.5rem;position:relative;transition:transform .35s var(--ease),box-shadow .35s,border-color .35s;display:flex;flex-direction:column;height:100%}
.pricing-card:hover{transform:translateY(-5px);border-color:rgba(153,153,153,.2)}
.pricing-card__cta{margin-top:auto}
.pricing-card--featured{border-color:rgba(153,153,153,.4);background:linear-gradient(135deg,#161209 0%,var(--c-charcoal) 100%)}
.pricing-card--featured:hover{transform:translateY(-7px);border-color:var(--c-accent);box-shadow:0 20px 60px rgba(153,153,153,.15)}
.pricing-card__badge{position:absolute;top:-1px;right:2rem;background:var(--c-accent);color:var(--c-black);font-size:.6rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;padding:.3rem .9rem;border-radius:0 0 3px 3px}
.pricing-card__tag{display:block;font-size:.62rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--c-accent);margin-bottom:.6rem}
.pricing-card__name{font-family:var(--font-display);font-size:1.9rem;font-weight:300;color:var(--c-white);margin-bottom:1rem}
.pricing-card__price{display:flex;align-items:baseline;gap:.3rem;margin-bottom:.4rem}
.pricing-card__amount{font-family:var(--font-display);font-size:3.8rem;font-weight:300;color:var(--c-white);line-height:1}
.pricing-card--featured .pricing-card__amount{color:var(--c-accent)}
.pricing-card__currency{font-size:1.5rem;color:var(--c-muted)}
.pricing-card__ttc{font-size:.65rem;font-family:var(--font-body);font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--c-muted);opacity:.55;align-self:flex-end;margin-bottom:.4rem}
.pricing-card__ttc{font-size:.7rem;font-family:var(--font-body);font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--c-muted);opacity:.7;align-self:flex-end;margin-bottom:.35rem;margin-left:.1rem}
.pricing-card__billing{font-size:.7rem;color:var(--c-muted);letter-spacing:.05em;margin-bottom:2rem}
.pricing-card__header{border-bottom:1px solid var(--c-border);margin-bottom:2rem;padding-bottom:1.5rem}
.pricing-card__description{margin-top:.5rem;font-size:.95rem;color:var(--c-light);line-height:1.7}
.pricing-card__features{list-style:none;display:flex;flex-direction:column;gap:.8rem;margin-bottom:2rem}
.pricing-card__features li{font-size:.83rem;color:var(--c-light);padding-left:1.4rem;position:relative;transition:color .2s}
.pricing-card:hover .pricing-card__features li{color:rgba(245,243,239,.8)}
.pricing-card__price-note{font-size:.8rem;color:var(--c-muted);background:rgba(255,255,255,.02);border:1px solid var(--c-border);padding:1rem 1rem 1rem 1rem;border-radius:6px;margin-bottom:1.5rem;line-height:1.65}
.pricing-card__features li::before{content:'✓';position:absolute;left:0;color:var(--c-accent);font-size:.75rem;font-weight:700}
.pricing__note{display:flex;align-items:flex-start;gap:.7rem;max-width:580px;margin:0 auto;padding:1.2rem 1.5rem;border:1px solid var(--c-border);font-size:.8rem;color:var(--c-muted);background:rgba(255,255,255,.015)}
.pricing__note svg{color:var(--c-accent);flex-shrink:0;margin-top:1px}
@media(max-width:900px){.pricing__group-grid{grid-template-columns:1fr}}

/* ═══════════════════════════════════════
   PROCESSUS
═══════════════════════════════════════ */
.processus{padding:var(--space-xl) 0;background:var(--c-charcoal);border-top:1px solid var(--c-border)}
.processus__steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;list-style:none;position:relative}
.processus__steps::before{content:'';position:absolute;top:1.75rem;left:12%;right:12%;height:1px;background:linear-gradient(to right,var(--c-accent),rgba(153,153,153,.1));z-index:0}
.processus__step{position:relative;padding:0 1.5rem;text-align:center;z-index:1;transition:transform .3s var(--ease)}
.processus__step:hover{transform:translateY(-6px)}
.processus__step-num{font-family:var(--font-display);font-size:1rem;font-weight:400;color:var(--c-accent);display:inline-flex;width:3.5rem;height:3.5rem;border:1px solid rgba(153,153,153,.4);border-radius:50%;align-items:center;justify-content:center;margin-bottom:1.5rem;background:var(--c-charcoal);letter-spacing:.05em;transition:background .3s,color .3s,border-color .3s,box-shadow .3s}
.processus__step:hover .processus__step-num{background:var(--c-accent);color:var(--c-black);border-color:var(--c-accent);box-shadow:0 0 20px rgba(153,153,153,.3)}
.processus__step-title{font-family:var(--font-display);font-size:1.3rem;font-weight:400;color:var(--c-white);margin-bottom:.7rem}
.processus__step-text{font-size:.8rem;color:var(--c-muted);line-height:1.8}
@media(max-width:900px){.processus__steps{grid-template-columns:repeat(2,1fr);gap:3rem}.processus__steps::before{display:none}}
@media(max-width:480px){.processus__steps{grid-template-columns:1fr}}

/* ═══════════════════════════════════════
   DISPONIBILITÉ
═══════════════════════════════════════ */
.disponibilite{padding:var(--space-xl) 0;background:var(--c-black);border-top:1px solid var(--c-border)}
.disponibilite__inner{display:grid;grid-template-columns:1fr 1.2fr;gap:5rem;align-items:center}
.disponibilite__title{font-family:var(--font-display);font-size:clamp(2.8rem,5vw,5rem);font-weight:300;line-height:1.02;margin-bottom:1.5rem}
.disponibilite__title em{font-style:italic;color:var(--c-accent)}
.disponibilite__text{font-size:.9rem;color:var(--c-light);line-height:1.85;margin-bottom:2rem;font-weight:300}
.disponibilite__badges{display:flex;flex-direction:column;gap:.8rem}
.dispo-badge{display:inline-flex;align-items:center;gap:.7rem;font-size:.72rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--c-light);padding:.5rem 1rem;border:1px solid var(--c-border);width:fit-content;transition:all .25s}
.dispo-badge:hover{border-color:rgba(153,153,153,.4);color:var(--c-white)}
.dispo-badge__dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.dispo-badge__dot--green{background:#4caf50;box-shadow:0 0 8px rgba(76,175,80,.5)}
.dispo-badge__dot--gold{background:var(--c-accent);box-shadow:0 0 8px rgba(153,153,153,.5)}
.dispo-days{display:flex;flex-direction:column;gap:.9rem;background:var(--c-charcoal);border:1px solid rgba(153,153,153,.12);padding:2rem}
.dispo-day{display:grid;grid-template-columns:3rem 1fr;gap:1rem;align-items:center}
.dispo-day__name{font-size:.68rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--c-muted)}
.dispo-day__bar{height:5px;background:var(--c-border);border-radius:2px;overflow:hidden}
.dispo-day__bar--full{height:100%;width:0;background:linear-gradient(to right,var(--c-accent),var(--c-accent2))}
@keyframes barGrow{from{width:0}to{width:100%}}
.dispo-caption{text-align:center;font-size:.65rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--c-muted);margin-top:1rem}
@media(max-width:900px){.disponibilite__inner{grid-template-columns:1fr;gap:3rem}}

/* ═══════════════════════════════════════
   LOCALISATION
═══════════════════════════════════════ */
.localisation{padding:1rem 0 1.4rem;background:var(--c-charcoal);border-top:1px solid var(--c-border)}
.localisation__inner{display:flex;flex-direction:column;gap:.8rem;align-items:flex-start;max-width:680px;margin:0 auto;padding:.6rem 0;}
.localisation__title{font-family:var(--font-display);font-size:clamp(1.8rem,3.8vw,3.2rem);font-weight:300;line-height:1.1;margin-bottom:.9rem}
.localisation__title em{font-style:italic;color:var(--c-accent)}
.localisation__details{font-style:normal}
.localisation__item{display:flex;align-items:center;gap:.9rem;padding:1rem 0;border-bottom:1px solid var(--c-border);color:var(--c-light);font-size:.9rem;transition:color .2s}
.localisation__item:last-child{border-bottom:none}
.localisation__item:hover{color:var(--c-white)}
.localisation__item svg{color:var(--c-accent);flex-shrink:0;transition:transform .2s}
.localisation__item:hover svg{transform:scale(1.2)}
.localisation__item a{color:inherit;text-decoration:none;transition:color .2s}
.localisation__item a:hover{color:var(--c-accent)}
.localisation__cta{margin-top:2rem}
.localisation__map{display:none}
@media(max-width:900px){.localisation__inner{grid-template-columns:1fr}}

/* ═══════════════════════════════════════
   CONTACT FINAL
═══════════════════════════════════════ */
.cta-final{padding:var(--space-xl) 0;background:var(--c-dark);border-top:1px solid var(--c-border);position:relative;overflow:hidden}
.cta-final__deco{position:absolute;inset:0;pointer-events:none;opacity:.4}
.cta-final__logo-bg{position:absolute;right:-3rem;bottom:-5rem;font-family:var(--font-display);font-size:clamp(15rem,24vw,28rem);font-weight:300;font-style:italic;color:rgba(153,153,153,.035);pointer-events:none;user-select:none;line-height:1}
.cta-final__inner{max-width:700px;margin:0 auto;text-align:center;position:relative;z-index:1}
.cta-final__title{font-family:var(--font-display);font-size:clamp(2.5rem,6vw,5.5rem);font-weight:300;line-height:1.08;margin-bottom:1.2rem}
.cta-final__title em{font-style:italic;color:var(--c-accent)}
.cta-final__subtitle{color:var(--c-light);font-size:.95rem;line-height:1.8;margin-bottom:3rem;font-weight:300}
.cta-final__form{text-align:left;margin-bottom:2rem}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem}
.form-group{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1rem}
.form-group:last-child{margin-bottom:0}
.form-label{font-size:.65rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--c-muted)}
.form-input{background:var(--c-mid);border:1px solid var(--c-border);padding:.9rem 1rem;font-family:var(--font-body);font-size:.88rem;color:var(--c-white);outline:none;transition:border-color .25s,background .25s;width:100%;-webkit-appearance:none;border-radius:1px}
select.form-input{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23f5f3ef' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;background-size:10px 6px;padding-right:2.5rem;-moz-appearance:none;appearance:none}
select.form-input::-ms-expand{display:none}

.form-input::placeholder{color:#444}
.form-input:focus{border-color:rgba(153,153,153,.5);background:var(--c-charcoal)}
.form-textarea{resize:vertical;min-height:90px}
.form-message{font-size:.82rem;padding:.7rem 1rem;margin-bottom:1rem;display:none}
.form-message--success{display:block;background:rgba(153,153,153,.1);border:1px solid rgba(153,153,153,.3);color:var(--c-accent2)}
.form-message--error{display:block;background:rgba(220,80,80,.08);border:1px solid rgba(220,80,80,.3);color:#e07070}
.form-input--error{border-color:rgba(220,80,80,.5)!important;background:rgba(220,80,80,.04)!important}
.cta-final__or{font-size:.7rem;color:var(--c-muted);letter-spacing:.18em;text-transform:uppercase;margin:1.8rem 0}
.cta-final__direct{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}
@media(max-width:600px){.form-row{grid-template-columns:1fr}}

/* ═══════════════════════════════════════
   FOOTER
═══════════════════════════════════════ */
.footer{background:var(--c-black);border-top:1px solid rgba(153,153,153,.1);padding:4rem 0 2rem}
.footer__inner{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:3rem;margin-bottom:3rem;padding-bottom:3rem;border-bottom:1px solid var(--c-border)}
.footer__logo{display:inline-block;text-decoration:none;margin-bottom:.75rem}
.footer__logo img{height:28px;width:auto;object-fit:contain;transition:filter .3s}
.footer__logo:hover img{filter:drop-shadow(0 0 8px rgba(153,153,153,.5))}
.footer__tagline{font-size:.82rem;color:var(--c-muted);font-weight:300}
.footer__tagline--sub{margin-top:.3rem;font-size:.75rem}
.footer__nav-title{font-size:.62rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--c-accent);margin-bottom:1.2rem}
.footer__nav ul{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem 1rem;margin:0;padding:0;justify-items:start}
.footer__nav ul li{padding-bottom:.2rem}
.footer__contact ul{list-style:none;display:flex;flex-direction:column;gap:.7rem;margin:0;padding:0}
.footer__nav a,.footer__contact a,.footer__contact li{font-size:.85rem;color:var(--c-muted);text-decoration:none;transition:color .2s}
.footer__nav a:hover,.footer__contact a:hover{color:var(--c-accent)}
.footer__bottom{display:flex;justify-content:space-between;align-items:center;font-size:.72rem;color:var(--c-muted);letter-spacing:.04em}
@media(max-width:768px){.footer__inner{grid-template-columns:1fr 1fr}.footer__brand{grid-column:1/-1}.footer__bottom{flex-direction:column;gap:.5rem;text-align:center}}
@media(max-width:480px){.footer__inner{grid-template-columns:1fr}}

/* ═══════════════════════════════════════
   ACCESSIBILITÉ & GLOBAL
═══════════════════════════════════════ */
:focus-visible{outline:2px solid var(--c-accent);outline-offset:3px}
@media(max-width:768px){:root{--space-xl:5rem;--space-lg:3rem}}
@media(max-width:480px){:root{--space-xl:4rem}.btn{padding:.8rem 1.4rem;font-size:.8rem}}
@media(prefers-reduced-motion:reduce){.reveal{transition:none;opacity:1;transform:none}.ticker__track{animation:none}.hero__bg img{animation:none}}


/* ═══════════════════════════════════════════════════════════
   KB DIGITAL — RESPONSIVE MOBILE v3
   Flow-based layout — no fixed svh positioning
   Desktop inchangé.
═══════════════════════════════════════════════════════════ */

/* ── Variables globales mobile ── */
@media(max-width:768px){
  :root{
    --space-xl: 3rem;
    --space-lg: 2rem;
    --space-md: 1.25rem;
  }
}

/* ════════════════════════════════
   1. HERO — image portrait mobile
════════════════════════════════ */

/* Desktop : image desktop visible, wrappers mobile cachés */
.hero__bg-mobile        { display: none; }
.hero__bg-desktop       { display: block; }
.hero__mobile-img-wrap  { display: none; }

@media(max-width:768px){

  /* Masquer bg desktop */
  .hero__bg-desktop { display: none; }

  /* ── Hero : flex column, plein écran dynamique ── */
  .hero{
    min-height: 100dvh;
    position: relative;
    overflow: hidden;
    background: #0a0a0a;
    display: flex;
    flex-direction: column;
  }

  /* ── Image fond : couvre tout en absolu ── */
  .hero__bg{
    display: block;
    position: absolute;
    inset: 0;
    background: #0a0a0a;
    z-index: 0;
  }

  .hero__bg-mobile{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 15%;
  }

  /* ── Overlay renforcé pour lisibilité du texte ── */
  .hero__bg-overlay{
    background:
      linear-gradient(to bottom,
        rgba(10,10,10,.82) 0%,
        rgba(10,10,10,.55) 25%,
        rgba(10,10,10,.40) 50%,
        rgba(10,10,10,.70) 72%,
        rgba(10,10,10,.95) 88%,
        rgba(10,10,10,1.0) 100%);
  }

  /* Masquer l'image inline */
  .hero__mobile-img-wrap{ display: none !important; }

  /* ── Container : flex column, pousse le contenu vers le bas ── */
  .hero__container{
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    flex: 1;
    padding: calc(var(--nav-h) + 1.5rem) 1.4rem 2rem;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    animation: none !important;
  }

  /* ── Content : flex column, spacing naturel ── */
  .hero__content{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    max-width: 100%;
    position: static;
  }

  /* 1. BADGE */
  .hero__badge{
    position: static;
    align-self: flex-start;
    font-size: .6rem;
    padding: .42rem .9rem;
    margin: 0 0 1rem 0;
    display: inline-flex;
    animation: none !important;
  }

  /* 2. TITRE */
  .hero__title{
    position: static;
    font-size: clamp(2.2rem, 10vw, 3.2rem);
    line-height: 1.08;
    margin: 0 0 .9rem 0;
    text-shadow: 0 2px 28px rgba(0,0,0,.9);
    animation: none !important;
    width: 100%;
  }

  /* 3. SUBTITLE */
  .hero__subtitle{
    position: static;
    font-size: .95rem;
    line-height: 1.65;
    margin: 0 0 1.4rem 0;
    opacity: .88;
    text-shadow: 0 1px 14px rgba(0,0,0,.8);
    animation: none !important;
    width: 100%;
  }

  /* 4. BOUTONS */
  .hero__ctas{
    position: static;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: .75rem;
    margin: 0 0 1.4rem 0;
    align-items: stretch;
    width: 100%;
    animation: none !important;
  }
  .hero__ctas .btn{
    flex: 1 1 0;
    min-width: 0;
    justify-content: center;
    padding: .9rem .55rem;
    font-size: .72rem;
    border-radius: 3px;
    min-height: 48px;
    white-space: normal;
    text-align: center;
    line-height: 1.3;
    box-shadow: none;
    animation: none !important;
  }

  /* 5. STATS */
  .hero__stats{
    position: static;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0;
    width: 100%;
    margin: 0;
    padding: .88rem 1rem;
    background: rgba(10,10,10,.82);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(201,169,110,.22);
    border-radius: 5px;
    animation: none !important;
  }
  .hero__stat-divider{ display: none; }
  .hero__stat{
    text-align: center;
    padding: .3rem .1rem;
    position: relative;
  }
  .hero__stat + .hero__stat::before{
    content: '';
    position: absolute; left: 0; top: 15%; bottom: 15%;
    width: 1px;
    background: rgba(201,169,110,.22);
  }
  .hero__stat-number{ font-size: 1.2rem; }
  .hero__stat-label{ font-size: .5rem; letter-spacing: .07em; margin-top: .2rem; }

  .hero__scroll-hint{ display: none; }
}

/* Petits écrans <= 390px */
@media(max-width:390px){
  .hero__bg-mobile{
    object-position: center 10%;
  }
  .hero__container{
    padding: calc(var(--nav-h) + 1rem) 1.1rem 1.5rem;
  }
  .hero__title{
    font-size: clamp(1.9rem, 9.5vw, 2.6rem);
    margin-bottom: .75rem;
  }
  .hero__subtitle{
    font-size: .85rem;
    margin-bottom: 1.1rem;
  }
  .hero__ctas{
    margin-bottom: 1.1rem;
  }
  .hero__ctas .btn{
    font-size: .66rem;
    padding: .82rem .4rem;
    min-height: 44px;
  }
}
/* ════════════════════════════════
   2. "CE QU'ON FAIT" — services
════════════════════════════════ */
@media(max-width:768px){

  /* 2 colonnes sur mobile */
  .services__grid{
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1px;
    background: var(--c-border);
  }

  .service-card{
    padding: 1.25rem 1rem;
    min-height: 0;
  }

  /* Désactive l'image hover sur mobile (inutile + lourd) */
  .service-card__img{ display: none; }
  .service-card::before{ opacity: 0 !important; }

  .service-card__number{
    font-size: 2rem;
    top: .5rem;
    right: .7rem;
  }

  .service-card__title{
    font-size: .95rem;
    margin-bottom: .5rem;
    line-height: 1.25;
  }

  .service-card__text{
    font-size: .72rem;
    line-height: 1.6;
    margin-bottom: .8rem;
    color: var(--c-muted);
  }

  .service-card__list{
    gap: .25rem;
    margin-bottom: .8rem;
  }
  .service-card__list li{
    font-size: .68rem;
    line-height: 1.4;
    padding-left: 1rem;
  }

  /* Tag "Sur devis" — positionné proprement, ne déborde plus */
  .service-card__tag{
    position: static;
    display: inline-block;
    margin-bottom: .6rem;
    font-size: .55rem;
    padding: .2rem .5rem;
    background: rgba(201,169,110,.1);
    border: 1px solid rgba(201,169,110,.3);
    color: var(--c-accent);
    letter-spacing: .12em;
  }

  /* CTA "Voir nos tarifs" — toujours visible, bien calé en bas */
  .service-card__cta{
    opacity: 1 !important;
    transform: none !important;
    position: static;
    bottom: auto; right: auto;
    display: inline-flex;
    margin-top: auto;
    font-size: .6rem;
    letter-spacing: .1em;
    padding-top: .5rem;
    color: var(--c-accent);
  }

  /* Accent line : visible même sans hover */
  .service-card__accent{
    display: block;
    width: 100%;
  }

  /* Aligner les cartes en flex column pour que le CTA reste en bas */
  .service-card{
    display: flex;
    flex-direction: column;
  }
  .service-card__content{
    flex: 1;
  }
}

@media(max-width:380px){
  .services__grid{
    grid-template-columns: 1fr !important;
  }
}

/* ════════════════════════════════
   3. SLOGAN — identity band fine
════════════════════════════════ */
@media(max-width:768px){

  .identity-band{
    padding: 1.75rem 0;  /* réduit de 5rem → 1.75rem */
  }

  .identity-band__inner{
    gap: 1rem;
  }

  .identity-band__quote{
    font-size: 1rem;
    white-space: normal;
    letter-spacing: .01em;
  }

  /* Lignes décoratives : plus fines et courtes */
  .identity-band__line{
    height: 1px;
    opacity: .5;
  }
}

/* ════════════════════════════════
   4. NOS OFFRES — 2 colonnes équilibrées
════════════════════════════════ */
@media(max-width:768px){

  .offres{
    padding: var(--space-xl) 0;
  }

  /* 2 colonnes pour les 2 groupes (site vitrine + identité & supports) */
  .pricing__group-grid{
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1rem;
  }

  .pricing-card{
    padding: 1.35rem 1rem;
  }

  .pricing-card__header{
    margin-bottom: 1rem;
    padding-bottom: 1rem;
  }

  .pricing-card__name{
    font-size: .95rem;
    line-height: 1.2;
    margin-bottom: .4rem;
  }

  .pricing-card__amount{
    font-size: 1.9rem;
  }

  .pricing-card__currency{
    font-size: .85rem;
  }

  .pricing-card__billing{
    font-size: .58rem;
    margin-bottom: .75rem;
    line-height: 1.4;
  }

  .pricing-card__features{
    gap: .4rem;
    margin-bottom: 1rem;
  }

  .pricing-card__features li{
    font-size: .65rem;
    line-height: 1.45;
    padding-left: .9rem;
  }

  .pricing-card__description{
    font-size: .68rem;
    line-height: 1.5;
    margin-top: .25rem;
  }

  .pricing-card__price-note{
    font-size: .62rem;
    padding: .65rem .75rem;
    margin-bottom: 1rem;
    line-height: 1.5;
  }

  .pricing-card__badge{
    font-size: .48rem;
    padding: .22rem .55rem;
    right: .7rem;
  }

  /* Bouton CTA — pleine largeur, lisible */
  .pricing-card .btn{
    padding: .7rem .4rem;
    font-size: .6rem;
    min-height: 40px;
    text-align: center;
    justify-content: center;
    white-space: normal;
    line-height: 1.3;
    width: 100%;
  }

  /* Titre de groupe */
  .pricing__group-title{
    font-size: .8rem;
    letter-spacing: .15em;
    margin-bottom: .6rem;
  }

  .pricing__groups{
    gap: 2.5rem;
  }

  .pricing__note{
    font-size: .72rem;
    padding: 1rem;
  }
}

/* ════════════════════════════════
   5. PASSER À L'ACTION — 2 colonnes formulaire
════════════════════════════════ */
@media(max-width:768px){

  .cta-final{
    padding: var(--space-xl) 0;
  }

  .cta-final__title{
    font-size: clamp(1.9rem, 7vw, 2.8rem);
    margin-bottom: .8rem;
  }

  .cta-final__subtitle{
    font-size: .82rem;
    line-height: 1.65;
    margin-bottom: 1.75rem;
  }

  /* Formulaire : toujours 2 colonnes pour prénom/activité, email/tel */
  .form-row{
    grid-template-columns: 1fr 1fr !important;
    gap: .6rem;
    margin-bottom: .6rem;
  }

  .form-group{
    margin-bottom: .6rem;
  }

  .form-input{
    padding: .75rem .75rem;
    font-size: .82rem;
  }

  .form-label{
    font-size: .58rem;
    letter-spacing: .12em;
  }

  /* Boutons directs (tel + email) : colonne unique pour éviter la coupure de l'email */
  .cta-final__direct{
    display: flex;
    flex-direction: column;
    gap: .75rem;
  }
  .cta-final__direct .btn{
    justify-content: center;
    padding: .85rem 1rem;
    font-size: .78rem;
    text-align: center;
    white-space: nowrap;
    overflow: visible;
    min-height: 44px;
    width: 100%;
  }

  .cta-final__or{
    font-size: .62rem;
    margin: 1.2rem 0;
  }
}

/* ════════════════════════════════
   FOOTER — compact 2 colonnes
════════════════════════════════ */
@media(max-width:768px){

  .footer{
    padding: 2rem 0 1rem;
  }

  .footer__inner{
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem 1rem;
    margin-bottom: 1.25rem;
    padding-bottom: 1.25rem;
  }

  /* Brand : pleine largeur en haut */
  .footer__brand{
    grid-column: 1 / -1;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
  }
  .footer__logo{ margin-bottom: 0; flex-shrink: 0; margin-top: .2rem; }
  .footer__tagline{ font-size: .75rem; }

  .footer__nav-title{ font-size: .58rem; margin-bottom: .6rem; }

  /* Mention légale TVA : affichée sur mobile, discrète */
  .footer__tagline--sub{
    display: block;
    font-size: .62rem;
    color: var(--c-muted);
    margin-top: .3rem;
    opacity: .75;
  }

  .footer__nav ul{
    grid-template-columns: 1fr 1fr;
    gap: .3rem .5rem;
  }
  .footer__nav a,
  .footer__contact a,
  .footer__contact li{ font-size: .75rem; }

  .footer__contact ul{ gap: .4rem; }

  .footer__bottom{
    flex-direction: column;
    gap: .25rem;
    text-align: center;
    font-size: .62rem;
  }
}

@media(max-width:480px){
  .footer{ padding: 1.5rem 0 .75rem; }
  .footer__inner{ grid-template-columns: 1fr; gap: 1rem; }
}

/* ════════════════════════════════
   DIVERS — corrections globales
════════════════════════════════ */
@media(max-width:768px){

  /* Section header */
  .section-header{ margin-bottom: var(--space-lg); }
  .section-title{ font-size: clamp(1.8rem, 7vw, 2.8rem); }
  .section-subtitle{ font-size: .8rem; }

  /* Piliers À propos : 2 colonnes */
  .presentation__pillars{
    grid-template-columns: repeat(2, 1fr);
  }
  .pillar-card{ padding: 1.25rem 1rem; }
  .pillar-card__title{ font-size: .95rem; }
  .pillar-card__text{ font-size: .73rem; }

  /* Présentation inner */
  .presentation__inner{
    grid-template-columns: 1fr;
    gap: 2rem;
    margin-bottom: 2rem;
  }
  .presentation__title{
    font-size: clamp(1.9rem, 7.5vw, 2.8rem);
    margin-bottom: .9rem;
  }
  .presentation__text{
    font-size: .85rem;
    line-height: 1.75;
    margin-bottom: .9rem;
  }
  .presentation__clients{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .35rem;
    padding: .75rem;
    margin: 1.2rem 0;
  }
  .presentation__clients span{
    font-size: .58rem;
    padding: .3rem .4rem;
    text-align: center;
  }
  .presentation__founder{
    float: right;
    margin: 0 0 .75rem 1rem;
    max-width: 80px;
  }
  .presentation__cta{
    width: 100%;
    justify-content: center;
    margin-top: 1.25rem;
  }

  /* Processus : 2x2 */
  .processus__steps{
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1.75rem 1rem;
  }
  .processus__step{ padding: 0 .4rem; }
  .processus__step-title{ font-size: .95rem; }
  .processus__step-text{ font-size: .72rem; line-height: 1.65; }
  .processus__step-num{ width: 2.8rem; height: 2.8rem; font-size: .9rem; margin-bottom: 1rem; }

  /* Disponibilité */
  .disponibilite__title{ font-size: clamp(1.9rem, 7.5vw, 3rem); }
  .dispo-days{ padding: 1rem; }
  .dispo-badge{ font-size: .62rem; padding: .35rem .7rem; }

  /* Localisation */
  .localisation{ padding: 1.5rem 0; }
  .localisation__title{ font-size: clamp(1.4rem, 5.5vw, 2rem); margin-bottom: .5rem; }
  .localisation__cta{ width: 100%; justify-content: center; margin-top: 1rem; }

  /* Tap targets */
  .btn{ min-height: 44px; }
}


/* ═══════════════════════════════════════
   FIN RESPONSIVE MOBILE v2 — KB DIGITAL
═══════════════════════════════════════ */