/* =================================================================
   Tourdubloc · Full Preview
   Tokens fidèles à src/routes/style-guide.ts (source de vérité)
   Sable #f3f3f0 · Ink #0a0a0a · Green #28ae60 · Green-soft #7ce4a3
   Satoshi via Fontshare · Display-900 UPPERCASE
   ================================================================= */

:root{
  --ink:#0a0a0a;
  --bg:#f3f3f0;
  --sable:#f3f3f0;
  --sable-soft:#e8e8e0;
  --green:#28ae60;
  --green-deep:#1c8c4d;
  --green-soft:#7ce4a3;
  --muted:#6b6b66;
  --line:rgba(10,10,10,.12);
  --line-strong:#dcdcd6;
  --radius-card:24px;
  --radius-lg:32px;
  --radius-xl:72px;
  --shadow-lift:0 24px 60px -20px rgba(10,10,10,.18);
  --shadow-deep:0 30px 60px -20px rgba(0,0,0,.45);
}

/* === HERO HEADERS: NO ITALIC === */
.hero h1 *,
.page-hero h1 *,
.hero-studio-h1 *,
.brand-hero-o3 h1 *,
.about-hero-o3 h1 *,
.brand-hero-arc h1 *,
.results-hero-o3 h1 *,
.method-hero-o2 h1 *,
.pasunfit-h * {
  font-style: normal !important;
}

/* === HERO HEADERS: RESTORE OUTLINE STROKE on accent spans === */
.page-hero h1 > span:not([class]),
.results-hero-o3 h1 > span:not([class]),
.method-hero-o2 h1 > span:not([class]),
.about-hero-o3 h1 > span:not([class]),
.hero-studio-h1 .arc-italic {
  display: inline-block !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  -webkit-text-stroke:1.5px rgba(10,10,10,.4) !important;
  text-stroke:1.5px rgba(10,10,10,.4) !important;
  font-weight: 650 !important;
  padding: .03em .09em .16em;
  margin: -.03em -.05em -.12em;
}

/* Philippe · pale version of the guarantee band (overrides dark home treatment) */
body:not(.flow-option) .guarantee.guarantee--pale{
  background:#fafaf8 !important;
  color:var(--ink) !important;
}
body:not(.flow-option) .guarantee.guarantee--pale::before,
body:not(.flow-option) .guarantee.guarantee--pale::after{
  content:none !important;
  background:none !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .pill-section{
  color:rgba(10,10,10,.55) !important;
  background:rgba(10,10,10,.04) !important;
  border-color:rgba(10,10,10,.08) !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .pill-section .sq{
  background:rgba(40,174,96,.55) !important;
  box-shadow:0 0 0 6px rgba(40,174,96,.08) !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .h2,
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-h{
  color:rgba(10,10,10,.55) !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .lead,
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-p{
  color:rgba(10,10,10,.42) !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .h2 .hl-out,
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-h .hl-out{
  color:transparent !important;
  -webkit-text-stroke-color:rgba(10,10,10,.4) !important;
  text-stroke-color:rgba(10,10,10,.4) !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .h2 .hl-grad,
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-h .hl-grad{
  background:linear-gradient(135deg,rgba(40,174,96,.55) 0%,rgba(124,228,163,.6) 60%,rgba(40,174,96,.5) 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  color:transparent !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-card{
  background:#fafaf8 !important;
  border-color:rgba(10,10,10,.06) !important;
  box-shadow:0 24px 60px -48px rgba(10,10,10,.25) !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-card .guarantee-h{
  color:rgba(10,10,10,.55) !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-card .guarantee-p{
  color:rgba(10,10,10,.4) !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-list li{
  color:rgba(10,10,10,.42) !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-list li::before{
  background:rgba(40,174,96,.08) !important;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2328ae60' stroke-opacity='0.55' stroke-width='3' stroke-linecap='round'><polyline points='20 6 9 17 4 12'/></svg>") !important;
  background-size:12px !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
  box-shadow:none !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-seal svg circle:first-of-type{
  stroke:rgba(10,10,10,.18) !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-seal svg circle:nth-of-type(2){
  stroke:rgba(40,174,96,.4) !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-seal svg text,
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-seal text{
  fill:rgba(10,10,10,.3) !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-seal .seal-100{
  color:rgba(40,174,96,.5) !important;
}
body:not(.flow-option) .guarantee.guarantee--pale .guarantee-seal .seal-lbl{
  color:rgba(10,10,10,.4) !important;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%; overflow-x:hidden;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:'Satoshi Variable','Satoshi',-apple-system,'Segoe UI',Helvetica,sans-serif;
  font-weight:400;
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
#tdb-lp img,#tdb-lp video{display:block;max-width:100%;height:auto}
#tdb-lp a{color:inherit}
#tdb-lp button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
#tdb-lp ul{list-style:none}

.wrap{max-width:1240px;margin:0 auto;padding:0 28px}
@media (max-width:780px){.wrap{padding:0 18px}}

/* ===== Display-900 accent vocabulary (style guide) ===== */
.hl-out{
  font-style:italic;font-weight:500;color:transparent;
  -webkit-text-stroke:1.5px rgba(255,255,255,.55);
  background:none;
}
.hl-out--ink{ -webkit-text-stroke:1.5px rgba(10,10,10,.4); }
.hl-out--green{
  font-style:italic;font-weight:500;color:transparent;
  -webkit-text-stroke:1.6px var(--green);
  text-shadow:0 0 22px rgba(40,174,96,.35);
  background:none;
}
.hl-grad{
  background:linear-gradient(135deg,var(--green) 0%,var(--green-soft) 100%);
  -webkit-background-clip:text;background-clip:text;
  color:transparent;
  font-style:italic;font-weight:800;
  -webkit-text-stroke:0;
}

/* sable sections default hl-out to ink-stroked */
.sable .hl-out,
.bg-sable .hl-out,
.formule .hl-out,
.results .hl-out,
.pourqui .hl-out,
.bureau .hl-out,
.equipe .hl-out,
.avantapres .hl-out,
.vsembaucher .hl-out,
.faq .hl-out,
.guarantee .hl-out,
.cestquoi .hl-out,
.applycta .hl-out,
.page-hero .hl-out{ -webkit-text-stroke:1.5px rgba(10,10,10,.4); }

/* ===================== META PREVIEW BAR ===================== */
.meta-bar{
  position:relative;z-index:50;
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  padding:10px 22px;
  background:#fafaf8;border-bottom:1px solid var(--line);
  font-size:12.5px;font-weight:500;color:var(--muted);
  letter-spacing:.02em;
}
.meta-bar b{color:var(--ink);font-weight:700}
.meta-dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(40,174,96,.18)}
.meta-bar .meta-page{
  margin-left:auto;
  padding:4px 10px;border-radius:6px;background:var(--sable);
  font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:11.5px;color:var(--ink);
  border:1px solid var(--line);
}
.meta-bar .meta-tags{display:inline-flex;gap:6px;flex-wrap:wrap}
.meta-bar .meta-tags a{
  text-decoration:none;color:var(--ink);
  padding:5px 12px;border-radius:999px;
  background:var(--sable);border:1px solid var(--line);
  font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  transition:background .15s,color .15s;
}
.meta-bar .meta-tags a:hover{background:var(--ink);color:#fafaf8}
.meta-bar .meta-tags a.is-active{background:var(--ink);color:#fafaf8}

/* ===================== NAVBAR ===================== */
.tdb-hdr{
  position:sticky;top:0;z-index:40;
  margin:16px;
  background:rgba(10,10,10,.7);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.08);
  border-radius:24px;
  box-shadow:0 12px 32px -12px rgba(0,0,0,.35);
}
@media (max-width:780px){.tdb-hdr{margin:10px;border-radius:18px}}
.tdb-hdr-inner{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:14px 24px;
}
.tdb-logo{display:inline-flex;align-items:center;height:36px;flex-shrink:0}
.tdb-logo img{height:28px;width:auto}
.tdb-nav{display:flex;gap:8px}
.tdb-nav a{
  position:relative;
  color:#ffffff;font-size:14.5px;font-weight:500;text-decoration:none;
  padding:8px 14px;border-radius:999px;
  transition:background .15s;
}
.tdb-nav a:hover{background:rgba(255,255,255,.08)}
.tdb-nav a::after{
  content:"";position:absolute;left:14px;right:14px;bottom:4px;
  height:1.5px;background:var(--green);
  transform:scaleX(0);transform-origin:left;
  transition:transform .25s cubic-bezier(.22,1,.36,1);
}
.tdb-nav a:hover::after,
.tdb-nav a[aria-current="page"]::after{transform:scaleX(1)}
.philippe-btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:5px 18px 5px 5px;
  background:#fafaf8;color:var(--ink);
  border-radius:999px;
  font-weight:600;font-size:14px;text-decoration:none;
  box-shadow:0 8px 22px rgba(0,0,0,.18);
  border:1px solid #fafaf8;
  transition:border-color .2s,box-shadow .2s;
  flex-shrink:0;
}
.philippe-btn:hover{border-color:var(--green);box-shadow:0 14px 32px rgba(40,174,96,.32)}
@keyframes cta-pulse{
  0%,100%{transform:scale(1);box-shadow:0 8px 22px rgba(0,0,0,.18)}
  50%{transform:scale(1.05);box-shadow:0 12px 32px rgba(40,174,96,.45)}
}
.philippe-btn.pulse-active{
  animation:cta-pulse 2.5s ease-in-out infinite;
  border-color:var(--green);
}
.philippe-btn .ph-photo{position:relative;width:32px;height:32px;flex-shrink:0}
.philippe-btn .ph-photo img{width:32px;height:32px;border-radius:50%;object-fit:cover}
.philippe-btn .ph-photo::after{
  content:"";position:absolute;right:-1px;bottom:-1px;
  width:9px;height:9px;border-radius:50%;
  background:var(--green);border:2px solid #fafaf8;
}
.tdb-burger{display:none;flex-direction:column;gap:4px;padding:6px}
.tdb-burger span{display:block;width:22px;height:2px;background:#fafaf8;border-radius:2px}
.nav-status-dot{
  display:none;width:12px;height:12px;border-radius:50%;
  background:var(--green);box-shadow:0 0 0 4px rgba(40,174,96,.25);
  border:2px solid #fafaf8;
  flex-shrink:0;
}
@media (max-width:980px){
  .tdb-hdr-inner{padding:10px 16px;gap:12px}
  .tdb-nav{display:none}
  .tdb-burger{display:flex;order:3}
  .philippe-btn .ph-txt{display:none}
  .philippe-btn{padding:5px;order:1;margin-left:auto}
  .nav-status-dot{display:none}
}
/* Mobile drawer */
.mob-drawer{
  position:fixed;inset:0;z-index:90;
  background:radial-gradient(130% 90% at 85% 0%, #1d1d1d 0%, #060606 60%);
  display:none;flex-direction:column;justify-content:center;
  padding:88px 24px 32px;gap:0;
  counter-reset:menu;
  overflow-y:auto;
}
.mob-drawer.open{display:flex;animation:drawerFadeIn .35s ease both}
@keyframes drawerFadeIn{from{opacity:0}to{opacity:1}}
.mob-drawer::before{
  content:"Navigation";
  position:absolute;top:32px;left:28px;
  font-size:10px;letter-spacing:.3em;text-transform:uppercase;
  color:rgba(255,255,255,.42);font-weight:700;
}
.mob-drawer a{
  position:relative;
  color:#fafaf8 !important;
  font-family:'Satoshi',system-ui,sans-serif;
  font-size:32px;font-weight:500;line-height:1.1;letter-spacing:-.02em;
  text-decoration:none;
  padding:18px 8px 18px 56px;
  border-bottom:1px solid rgba(255,255,255,.08);
  display:flex;align-items:center;
  opacity:0;transform:translateY(14px);
  animation:drawerLinkIn .55s cubic-bezier(.2,.7,.2,1) forwards;
  transition:color .25s, padding-left .25s;
}
.mob-drawer.open a:nth-of-type(1){animation-delay:.05s}
.mob-drawer.open a:nth-of-type(2){animation-delay:.10s}
.mob-drawer.open a:nth-of-type(3){animation-delay:.16s}
.mob-drawer.open a:nth-of-type(4){animation-delay:.22s}
.mob-drawer.open a:nth-of-type(5){animation-delay:.28s}
.mob-drawer.open a:nth-of-type(6){animation-delay:.36s}
@keyframes drawerLinkIn{to{opacity:1;transform:none}}
.mob-drawer a::before{
  counter-increment:menu;
  content:"0" counter(menu);
  position:absolute;left:6px;top:50%;transform:translateY(-50%);
  font-size:11px;font-weight:700;letter-spacing:.15em;
  color:rgba(255,255,255,.38);
  font-feature-settings:"tnum";
}
.mob-drawer a::after{
  content:"";
  margin-left:auto;
  width:18px;height:10px;
  background:linear-gradient(currentColor,currentColor) left center/0 2px no-repeat,
             linear-gradient(45deg,transparent 45%,currentColor 45% 55%,transparent 55%) right center/8px 2px no-repeat,
             linear-gradient(-45deg,transparent 45%,currentColor 45% 55%,transparent 55%) right center/8px 2px no-repeat;
  color:rgba(255,255,255,.35);
  transition:transform .3s, color .3s, background-size .3s;
}
.mob-drawer a:hover,.mob-drawer a:active{color:#fff;padding-left:62px}
.mob-drawer a:hover::after,.mob-drawer a:active::after{color:var(--green);background-size:18px 2px,8px 2px,8px 2px;transform:translateX(4px)}
.mob-drawer a:last-of-type{
  margin-top:28px;
  background:var(--green);color:#0a0a0a;
  border-radius:999px;border-bottom:none;
  padding:18px 28px;
  font-size:15px;font-weight:800;
  text-transform:uppercase;letter-spacing:.1em;
  justify-content:center;
}
.mob-drawer a:last-of-type::before,
.mob-drawer a:last-of-type::after{display:none}
.mob-drawer a:last-of-type:hover{padding-left:28px;color:#0a0a0a;background:#1fa056}
.mob-drawer-close{
  position:absolute;top:20px;right:20px;
  background:rgba(255,255,255,.06);
  color:#fff;font-size:22px;line-height:1;
  width:44px;height:44px;border-radius:50%;
  border:1px solid rgba(255,255,255,.14);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;z-index:2;
  transition:background .25s, transform .35s, border-color .25s;
}
.mob-drawer-close:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.28);transform:rotate(90deg)}

/* ===================== HERO ===================== */
.hero{
  position:relative;overflow:hidden;
  margin:16px;
  border-radius:32px;
  background:linear-gradient(to bottom,#454545 0%,#161616 100%);
  color:#fff;
  padding:clamp(128px,16vh,176px) 0 clamp(48px,7vh,96px);
}
@media (max-width:780px){.hero{margin:10px;border-radius:24px;padding:112px 0 40px}}
.hero-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:175px 175px;background-position:center top;
  pointer-events:none;z-index:0;
}
.hero-vignette{
  position:absolute;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(80% 100% at 0% 50%,rgba(0,0,0,.45) 0%,transparent 50%),
    radial-gradient(80% 100% at 100% 50%,rgba(0,0,0,.45) 0%,transparent 50%),
    radial-gradient(ellipse 100% 80% at 50% 50%,rgba(10,10,10,0) 0%,rgba(10,10,10,.55) 100%);
}
.hero-inner{
  position:relative;z-index:1;
  display:grid;grid-template-columns:1.1fr 1fr;
  gap:clamp(2rem,5vw,4rem);
  align-items:center;
}
@media (max-width:980px){.hero-inner{grid-template-columns:1fr;gap:32px}}
.hero-content{display:flex;flex-direction:column;gap:24px}
.pill-hero{
  display:inline-flex;align-items:center;gap:10px;
  background:#2a2a2a;color:#fff;
  padding:10px 18px;border-radius:999px;
  font-size:13px;font-weight:500;letter-spacing:.06em;
  align-self:flex-start;
}
.pill-hero .sq{width:9px;height:9px;background:var(--green);border-radius:2px}
.hero-h1{
  font-family:'Satoshi','Satoshi Variable',-apple-system,sans-serif;
  font-size:clamp(36px,5.4vw,72px);
  font-weight:900;line-height:1.0;letter-spacing:-0.0405em;
  color:#fff;text-transform:none;
}
.hero-h1-accent{color:var(--green);font-style:italic;font-weight:900}
.hero-sub{
  font-size:17px;line-height:1.5;color:rgba(255,255,255,.7);
  max-width:540px;
  border-left:2px solid var(--green);padding-left:16px;
}
@media (max-width:780px){.hero-sub{font-size:15.5px}}
.hero-kpis{display:grid;grid-template-columns:repeat(3,auto);gap:8px 28px;padding-top:6px}
@media (max-width:560px){.hero-kpis{grid-template-columns:1fr 1fr}}
.kpi-n{
  font-size:32px;font-weight:900;letter-spacing:-0.025em;
  color:#fff;font-variant-numeric:tabular-nums;line-height:1;
}
@media (max-width:780px){.kpi-n{font-size:26px}}
.kpi-n sup{font-size:.55em;color:var(--green);font-weight:900;font-style:italic;vertical-align:top}
.kpi-l{font-size:12px;color:rgba(255,255,255,.5);margin-top:4px;letter-spacing:.04em}
.hero-trust{
  display:inline-flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding-top:6px;font-size:13px;color:rgba(255,255,255,.65);
}
.hero-trust .g-dot{
  width:32px;height:32px;border-radius:50%;background:#fafaf8;
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
}
.hero-trust .g-dot svg{width:18px;height:18px;display:block}
.hero-trust .stars{color:#f9b500;letter-spacing:2px;font-size:14px}

/* ===== Hero form (V4) ===== */
.hero-form-wrap{position:relative}
.tdbf-shell{position:relative;width:100%;max-width:480px;margin:24px 36px 36px auto}
@media (max-width:980px){.tdbf-shell{margin:0 auto 24px}}
.tdbf-stack{
  position:absolute;top:0;left:0;width:100%;height:100%;
  border-radius:28px;pointer-events:none;
}
.tdbf-stack-1{
  transform:translate(40px,36px) rotate(3deg);
  background:linear-gradient(155deg,#5e5e5e 0%,#444 100%);
  box-shadow:0 30px 60px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.06);
}
.tdbf-stack-2{
  transform:translate(22px,18px) rotate(1.5deg);
  background:linear-gradient(155deg,#4a4a4a 0%,#333 100%);
  box-shadow:0 24px 50px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.05);
}
.tdbf-card{
  position:relative;z-index:3;
  background:#fafaf8;border:1px solid var(--line);
  border-radius:28px;padding:28px 28px 24px;
  color:var(--ink);
  box-shadow:0 1px 2px rgba(10,10,10,.04),0 24px 60px rgba(10,10,10,.18);
}
.tdbf-badge-row{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:12px;
  font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
}
.tdbf-badge{display:inline-flex;align-items:center;gap:8px;color:var(--ink)}
.tdbf-badge .sq{width:8px;height:8px;background:var(--green);border-radius:2px}
.tdbf-time{color:var(--muted);display:inline-flex;align-items:center;gap:5px}
.tdbf-counter{font-size:12px;color:var(--muted);margin-bottom:6px}
.tdbf-progress{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin-bottom:18px}
.tdbf-progress > .d{height:4px;border-radius:2px;background:#ececea}
.tdbf-progress > .d.done{background:var(--green)}
.tdbf-title{
  font-size:21px;font-weight:800;letter-spacing:-0.018em;line-height:1.15;
  margin-bottom:6px;color:var(--ink);
}
.tdbf-title em{font-style:italic}
.tdbf-sub{font-size:14px;color:var(--muted);margin-bottom:16px;line-height:1.5}
.tdbf-opts{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.tdbf-opt{
  display:flex;align-items:center;gap:12px;
  padding:14px 16px;
  border:1.5px solid var(--line);border-radius:14px;
  background:#fafaf8;color:var(--ink);
  font-size:14.5px;font-weight:500;
  text-align:left;
  transition:border-color .15s,background .15s;
}
.tdbf-opt:hover{border-color:var(--ink)}
.tdbf-opt.selected{border-color:var(--green);background:rgba(40,174,96,.06)}
.tdbf-opt .rad{
  width:18px;height:18px;border:2px solid #c8c8c5;border-radius:50%;
  flex-shrink:0;position:relative;
}
.tdbf-opt.selected .rad{border-color:var(--green)}
.tdbf-opt.selected .rad::after{
  content:"";position:absolute;inset:3px;background:var(--green);border-radius:50%;
}
.tdbf-actions{display:flex;justify-content:flex-end}
.btn-primary{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 22px;border-radius:999px;
  background:var(--green);color:#fff;
  font-weight:700;font-size:14.5px;letter-spacing:.02em;
  box-shadow:0 18px 36px -12px rgba(40,174,96,.55);
  transition:transform .15s,box-shadow .15s;
  text-decoration:none;
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 22px 42px -12px rgba(40,174,96,.7)}

/* ===================== TICKER ===================== */
.ticker-wrap{margin:0 16px;padding:32px 0 16px;overflow:hidden}
.ticker-wrap.hero-ticker{
  position:relative;
  z-index:3;
  max-width:1184px;
  margin:18px auto 36px;
  padding:0;
}
.tdb-ticker{
  background:var(--green);color:var(--ink);
  overflow:hidden;padding:18px 0;
  border-radius:32px;
  transform:rotate(-1deg);
  box-shadow:none;
  position:relative;
}
.tdb-ticker-track{
  display:flex;gap:48px;white-space:nowrap;width:max-content;
  animation:tdb-tick 35s linear infinite;will-change:transform;
}

.tdb-ticker-item{
  display:inline-flex;align-items:center;gap:14px;
  font-size:clamp(18px,2vw,26px);font-weight:800;letter-spacing:-0.01em;text-transform:uppercase;
}
.tdb-ticker-item .dot{width:10px;height:10px;background:var(--ink);border-radius:50%;flex-shrink:0}
@keyframes tdb-tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.tdb-ticker-track{animation:none}}

/* ===================== FLOATING CARDS TRIO ===================== */
.floating-cards{padding:64px 0 32px;background:var(--bg)}
.floating-cards .wrap{display:flex;flex-direction:column;gap:32px}
.fc-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap}
.fc-head .left{display:flex;flex-direction:column;gap:14px;max-width:680px}
.fc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:980px){.fc-grid{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.fc-grid{grid-template-columns:1fr}}
.fc-card{
  position:relative;
  background:#fafaf8;border:1px solid var(--line);
  border-radius:24px;
  padding:28px;
  display:flex;flex-direction:column;gap:18px;
  min-height:280px;
  overflow:hidden;
  transition:transform .25s,box-shadow .25s,border-color .25s;
}
.fc-card:hover{transform:translateY(-4px);border-color:rgba(40,174,96,.4);box-shadow:var(--shadow-lift)}
.fc-card.tilt-1{transform:rotate(-1.2deg)}
.fc-card.tilt-1:hover{transform:rotate(-1.2deg) translateY(-4px)}
.fc-card.tilt-2{transform:rotate(0deg);margin-top:14px}
.fc-card.tilt-3{transform:rotate(1.2deg)}
.fc-card.tilt-3:hover{transform:rotate(1.2deg) translateY(-4px)}
.fc-icon{
  width:48px;height:48px;border-radius:14px;
  background:rgba(40,174,96,.12);color:var(--green);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.fc-card.dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.fc-card.dark .fc-icon{background:rgba(40,174,96,.18);color:var(--green-soft)}
.fc-card.dark .fc-label{color:rgba(255,255,255,.55)}
.fc-card.dark .fc-h{color:#fafaf8}
.fc-card.dark .fc-list li{color:rgba(255,255,255,.82)}
.fc-card.dark .fc-list li::before{background:rgba(40,174,96,.18);color:var(--green-soft)}
.fc-label{font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.fc-h{font-size:22px;font-weight:800;letter-spacing:-0.02em;line-height:1.15;color:var(--ink)}
.fc-list{display:flex;flex-direction:column;gap:8px;margin-top:auto}
.fc-list li{position:relative;padding-left:22px;font-size:13.5px;color:#2a2a2a;line-height:1.5}
.fc-list li::before{
  content:"";position:absolute;left:0;top:6px;width:14px;height:14px;border-radius:50%;
  background:rgba(40,174,96,.14);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2328ae60' stroke-width='3' stroke-linecap='round'><polyline points='20 6 9 17 4 12'/></svg>");
  background-size:10px 10px;background-position:center;background-repeat:no-repeat;
}

/* ===================== BIG STAT ===================== */
.stat-wrap{padding:32px 0;background:var(--bg)}
.stat-big{
  position:relative;overflow:hidden;
  background:#fafaf8;border:1px solid var(--line);
  border-radius:32px;
  padding:clamp(40px,5vw,64px);
}
.stat-big-panels{position:absolute;inset:0;pointer-events:none;z-index:0}
.stat-big-panels .p{position:absolute;border-radius:72px}
.stat-big-panels .p1{
  width:320px;height:200px;left:-140px;top:-90px;transform:rotate(10deg);
  background:linear-gradient(160deg,#efece5 0%,#ddd9cf 100%);
  box-shadow:0 30px 60px rgba(60,55,40,.18),inset 0 1px 0 rgba(255,255,255,.6);
  z-index:3;
}
.stat-big-panels .p2{
  width:280px;height:180px;left:-100px;top:-50px;transform:rotate(16deg);
  background:linear-gradient(155deg,#eceae3 0%,#d9d6cc 100%);opacity:.7;z-index:2;
}
.stat-big-panels .p3{
  width:240px;height:160px;left:-70px;top:-20px;transform:rotate(22deg);
  background:linear-gradient(155deg,#eceae3 0%,#d9d6cc 100%);opacity:.45;z-index:1;
}
.stat-big-content{position:relative;z-index:4;display:flex;flex-direction:column;gap:24px}
.num-row{display:flex;align-items:center;gap:40px;flex-wrap:wrap}
@media (max-width:780px){.num-row{gap:18px}}
.num-row .num{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:clamp(80px,14vw,180px);
  font-weight:900;letter-spacing:-0.045em;line-height:.85;
  color:var(--ink);font-variant-numeric:tabular-nums;
}
.num-row .num sup{font-size:.42em;vertical-align:top;font-weight:900;font-style:italic}
.num-row .lbl{font-size:17px;color:var(--muted);max-width:340px;line-height:1.4}
@media (max-width:780px){.num-row .lbl{font-size:15px}}

/* ===================== TRUST BAR ===================== */
.trust-bar{padding:48px 0;background:var(--bg);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.trust-bar .wrap{display:flex;align-items:center;gap:32px;flex-wrap:wrap;justify-content:space-between}
.trust-lbl{
  font-size:11.5px;font-weight:700;color:var(--muted);
  letter-spacing:.14em;text-transform:uppercase;
}
.trust-row{display:flex;gap:32px;flex-wrap:wrap;align-items:center}
.trust-row .client{
  font-size:18px;font-weight:900;color:var(--ink);
  letter-spacing:-0.02em;
  font-style:italic;
  opacity:.5;transition:opacity .2s;
}
.trust-row .client:hover{opacity:1;color:var(--green)}
.trust-cta{
  flex-shrink:0;
  white-space:nowrap;
  background:transparent !important;
  color:var(--ink) !important;
  border:0 !important;
  border-bottom:2px solid var(--green) !important;
  border-radius:0 !important;
  padding:0 0 4px !important;
  box-shadow:none !important;
  font-size:11.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:900;
}
.trust-cta:hover{
  background:transparent !important;
  color:var(--green-deep) !important;
  transform:translateY(-1px);
}

/* ===================== FORMULE ===================== */
.formule{padding:80px 0 24px;background:var(--bg)}
@media (max-width:780px){.formule{padding:56px 0 16px}}
.formule > .wrap{max-width:1328px;padding-left:clamp(20px,2.4vw,34px);padding-right:clamp(20px,2.4vw,34px)}
@media (max-width:780px){.formule > .wrap{padding-left:10px;padding-right:10px}}
.formule-head{max-width:780px;margin-bottom:48px}
.pill-section{
  display:inline-flex;align-items:center;gap:10px;
  background:#cef3fb;color:var(--ink);
  padding:7px 16px;border-radius:999px;
  font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  text-decoration:none;
}
.pill-section.pill-soft{background:#fafaf8;border:1px solid var(--line)}
.pill-section.pill-dark{background:var(--ink);color:#fafaf8}
.pill-section.pill-dark .sq{background:var(--green)}
.pill-section .sq{width:9px;height:9px;background:var(--ink);border-radius:2px;flex-shrink:0}
.h2{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:clamp(32px,4.4vw,56px);
  font-weight:900;line-height:1;letter-spacing:-0.025em;
  text-transform:uppercase;
  margin:18px 0 18px;
}
.lead{
  font-size:17px;line-height:1.5;color:var(--muted);
  border-left:2px solid var(--green);padding-left:14px;
  max-width:540px;
}

/* Formule stack */
.formule-stack{display:flex;flex-direction:column;gap:24px}
.formule-card{
  position:relative;
  display:grid;grid-template-columns:auto 1fr 1fr;gap:32px;
  background:#fafaf8;border:1px solid var(--line);
  border-radius:32px;
  padding:36px;
  align-items:start;
  overflow:hidden;
}
@media (max-width:980px){
  .formule-card{grid-template-columns:auto 1fr;gap:24px;padding:24px}
  .formule-card .formule-img{grid-column:1 / -1;margin-top:8px}
}
.formule-card.reverse{
  background:var(--ink);color:#fff;border-color:var(--ink);
  grid-template-columns:1fr 1fr auto;
}
.formule-card.reverse .formule-num{order:3;color:rgba(255,255,255,.9)}
.formule-card.reverse .formule-text{order:1}
.formule-card.reverse .formule-img{order:2}
.formule-card.reverse h3{color:#fafaf8}
.formule-card.reverse .pill-section.pill-soft{
  background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);color:#fff;
}
.formule-card.reverse .pill-section.pill-soft .sq{background:var(--green)}
.formule-card.reverse .formule-list li{color:rgba(255,255,255,.82)}
.formule-card.reverse .formule-list li::before{background:rgba(40,174,96,.18);color:var(--green-soft)}
@media (max-width:980px){
  .formule-card.reverse{grid-template-columns:auto 1fr}
  .formule-card.reverse .formule-num{order:0}
  .formule-card.reverse .formule-img{order:3}
}
.formule-num{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:clamp(64px,8vw,128px);
  font-weight:900;font-style:italic;
  letter-spacing:-0.05em;line-height:.85;
  color:var(--green);font-variant-numeric:tabular-nums;position:relative;
}
.formule-num span{display:block}
.formule-num.final{
  background:linear-gradient(135deg,var(--green),var(--green-soft));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.formule-text{display:flex;flex-direction:column;gap:14px;padding-top:8px}
.formule-text h3{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:clamp(24px,2.8vw,34px);
  font-weight:800;letter-spacing:-0.02em;line-height:1.1;
  margin-top:6px;
}
.formule-list{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.formule-list li{position:relative;padding-left:28px;font-size:15px;color:#2a2a2a;line-height:1.5}
.formule-list li::before{
  content:"";position:absolute;left:0;top:8px;width:18px;height:18px;border-radius:50%;
  background:rgba(40,174,96,.14);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2328ae60' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>");
  background-size:12px 12px;background-position:center;background-repeat:no-repeat;
}
.qc-badge{
  display:inline-flex;align-items:center;gap:10px;align-self:flex-start;
  margin-top:12px;padding:8px 14px;border-radius:999px;
  background:linear-gradient(135deg,#fafaf8,var(--sable));border:1px solid var(--line);
  font-size:12.5px;font-weight:700;color:var(--ink);
}
.qc-badge .qc-flag{font-size:14px}
.formule-img{
  position:relative;border-radius:24px;overflow:hidden;
  aspect-ratio:4/5;background:#1c1c1c;box-shadow:var(--shadow-lift);
}
.formule-img img,
.formule-img video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.formule-img.dark{background:#0a0a0a}
.formule-img .img-tag{
  position:absolute;left:14px;bottom:14px;
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 12px;border-radius:999px;
  background:rgba(255,255,255,.92);backdrop-filter:blur(8px);
  border:1px solid rgba(10,10,10,.08);
  color:#0a0a0a;font-size:11px;font-weight:700;letter-spacing:.1em;
}
.formule-img .img-tag .sq{width:8px;height:8px;background:var(--green);border-radius:2px}
.formule-img.dark .img-tag{
  background:#0a0a0a;
  border:1px solid rgba(255,255,255,.08);
  color:#fff;
}

/* ===== Promise band ===== */
.promise-band{
  position:relative;overflow:hidden;
  background:var(--ink);color:#fff;
  border-radius:32px;
  padding:48px;
  margin-top:40px;
  display:flex;flex-direction:row;gap:48px;
  align-items:center;justify-content:space-between;flex-wrap:wrap;
}
@media (max-width:780px){.promise-band{padding:32px 24px;gap:28px;flex-direction:column;align-items:flex-start;text-align:left}}
.promise-band::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 85% 50%,rgba(40,174,96,.18),transparent 55%);pointer-events:none;
}
.promise-band::after{
  content:"";position:absolute;right:-40px;top:-40px;
  width:240px;height:240px;border-radius:50%;
  border:1px dashed rgba(40,174,96,.18);pointer-events:none;
}
.promise-band > *{position:relative;z-index:1}
.promise-left{flex:1;min-width:280px;display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.promise-badge{
  display:inline-flex;align-items:center;gap:8px;
  font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,.6);
}
.promise-badge .sq{width:8px;height:8px;background:var(--green);border-radius:2px}
.promise-h{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:clamp(28px,3.6vw,48px);
  font-weight:900;letter-spacing:-0.025em;line-height:1.05;max-width:620px;
}
.promise-sub{font-size:15px;color:rgba(255,255,255,.7);max-width:520px;line-height:1.55}
.promise-counter-wrap{display:flex;flex-direction:column;align-items:center;gap:14px}
@media (max-width:780px){.promise-counter-wrap{align-items:flex-start;align-self:flex-start}}
.promise-live{
  display:inline-flex;align-items:center;gap:8px;
  font-size:10px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:var(--green);
}
.promise-live .pulse{
  width:8px;height:8px;border-radius:50%;background:var(--green);
  animation:promisePulse 1.6s ease-out infinite;
}
@keyframes promisePulse{
  0%{box-shadow:0 0 0 0 rgba(40,174,96,.55)}
  70%{box-shadow:0 0 0 10px rgba(40,174,96,0)}
  100%{box-shadow:0 0 0 0 rgba(40,174,96,0)}
}
.promise-counter{display:flex;gap:10px;align-items:flex-end}
.promise-sep{
  font-size:42px;font-weight:900;color:rgba(255,255,255,.18);
  line-height:1;align-self:center;padding-bottom:22px;
}
.flap{
  position:relative;width:62px;height:84px;
  border-radius:10px;background:#0a0a0a;
  box-shadow:0 10px 22px rgba(0,0,0,.55),
             inset 0 0 0 1px rgba(255,255,255,.06),
             inset 0 0 24px rgba(0,0,0,.6);
  overflow:hidden;display:flex;align-items:center;justify-content:center;
  color:#f0e6d2;font-size:50px;font-weight:900;letter-spacing:-0.04em;
}
.flap::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(0,0,0,.8);box-shadow:0 1px 0 rgba(255,255,255,.04)}
.promise-caption{
  font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,.5);text-align:center;
}
.promise-caption b{color:var(--green);font-weight:800}

/* ===================== RÉSULTATS ===================== */
.results{padding:80px 0 32px;background:var(--bg)}
@media (max-width:780px){.results{padding:56px 0 24px}}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap;margin-bottom:32px}
.section-head .left{display:flex;flex-direction:column;align-items:flex-start;gap:14px;max-width:680px}
.section-head .h2{margin:0}
@media (max-width:780px){.section-head{flex-direction:column;align-items:flex-start}}
.btn-pill{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 24px;border-radius:999px;
  background:var(--ink);color:#fff;text-decoration:none;
  font-weight:700;font-size:14.5px;letter-spacing:.02em;
  transition:background .15s,transform .15s;flex-shrink:0;
}
.btn-pill:hover{background:var(--green);transform:translateY(-2px)}
.btn-pill.btn-pill--green{background:var(--green)}
.btn-pill.btn-pill--green:hover{background:var(--green-deep)}
.btn-pill.btn-pill--ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.btn-pill.btn-pill--ghost:hover{background:var(--ink);color:#fafaf8}

/* Case grid */
.case-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:1fr;gap:18px;margin-bottom:64px}
@media (max-width:1100px){.case-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.case-grid{grid-template-columns:1fr}}
.case-card{
  position:relative;overflow:hidden;
  background:#fafaf8;border:1px solid var(--line);
  border-radius:24px;padding:24px;
  display:flex;flex-direction:column;gap:14px;height:100%;min-height:280px;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.case-card:hover{transform:translateY(-4px);border-color:var(--line-strong);box-shadow:0 24px 50px -22px rgba(10,10,10,.18)}
.case-card .client{font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--muted);text-transform:uppercase}
.case-card .case-num{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:clamp(48px,5vw,72px);
  font-weight:900;letter-spacing:-0.04em;line-height:.9;
  color:var(--ink);font-variant-numeric:tabular-nums;
  background:linear-gradient(135deg,var(--ink) 40%,var(--green) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.case-card .case-num sup{font-size:.55em;color:var(--green);font-weight:900;vertical-align:top;-webkit-text-fill-color:var(--green)}
.case-card .case-num .x{
  font-style:italic;font-weight:500;color:transparent;
  -webkit-text-stroke:1.5px rgba(10,10,10,.4);
  -webkit-text-fill-color:transparent;margin-right:4px;
}
.case-card .case-num .k{font-size:.45em;font-weight:800;vertical-align:top;margin-left:4px;-webkit-text-fill-color:var(--green)}
.case-card .case-num .num-val{-webkit-text-fill-color:var(--ink);color:var(--ink);background:none;-webkit-background-clip:initial;background-clip:initial}
.case-card .case-num--text{font-size:clamp(34px,4vw,48px);font-style:italic;letter-spacing:-0.03em}
.case-card .case-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.case-card .case-head{font-size:17px;font-weight:700;letter-spacing:-0.01em;color:var(--ink);line-height:1.3}
.case-card .case-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding-top:14px;border-top:1px dashed var(--line);gap:10px;flex-wrap:wrap}
.badge-pin{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;color:var(--muted)}
.badge-pin .dot{width:6px;height:6px;border-radius:50%;background:var(--green)}
.case-tag{
  display:inline-flex;align-items:center;
  padding:4px 10px;border-radius:6px;
  background:var(--sable);color:var(--ink);
  font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
}
.case-card.accent{background:linear-gradient(160deg,var(--green),var(--green-deep));border-color:transparent;color:#fff}
.case-card.accent .client{color:rgba(255,255,255,.75)}
.case-card.accent .case-num{-webkit-text-fill-color:#fff;color:#fff;background:none}
.case-card.accent .case-num .x{-webkit-text-stroke:1.5px rgba(255,255,255,.55);-webkit-text-fill-color:transparent}
.case-card.accent .case-head{color:#fafaf8}
.case-card.accent .case-foot{border-top-color:rgba(255,255,255,.18)}
.badge-pin--light{color:rgba(255,255,255,.85)}
.badge-pin--light .dot{background:#fafaf8}
.case-tag--light{background:rgba(255,255,255,.16);color:#fafaf8}

/* Marquee reviews */
.marquee-mask{
  position:relative;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 8%,#000 92%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 8%,#000 92%,transparent 100%);
}
.marquee-track{display:flex;gap:18px;width:max-content;animation:tdb-marq 60s linear infinite}
@keyframes tdb-marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none}}
.review-card{
  flex-shrink:0;width:340px;
  background:#ececea;border-radius:24px;padding:22px;
  display:flex;flex-direction:column;gap:14px;position:relative;
}
.review-card::before{content:"";position:absolute;inset:7px;border-radius:17px;background:#fafaf8;z-index:0}
.review-card > *{position:relative;z-index:1}
.review-card .stars{color:#f9b500;letter-spacing:2px;font-size:14px}
.review-card .quote{font-size:14.5px;line-height:1.5;color:var(--ink)}
.review-card .who{font-size:13px;color:var(--muted);margin-top:auto;padding-top:12px;border-top:1px solid var(--line)}
.review-card .who strong{color:var(--ink);font-weight:700}

/* Vertical reviews — replaces horizontal marquee */
.review-vertical{
  margin-top:26px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  max-height:430px;
  overflow:hidden;
  position:relative;
  -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 10%,#000 90%,transparent 100%);
  mask-image:linear-gradient(180deg,transparent 0%,#000 10%,#000 90%,transparent 100%);
}
.review-vertical::before{
  content:"";position:absolute;inset:-40px 38% auto auto;width:240px;height:240px;
  background:radial-gradient(circle,rgba(40,174,96,.16),transparent 68%);
  pointer-events:none;z-index:1;
}
.review-vcol{
  display:flex;
  flex-direction:column;
  gap:16px;
  animation:tdb-reviews-up 28s linear infinite;
}
.review-vcol.reverse{animation-name:tdb-reviews-down;transform:translateY(-120px)}
/* keep animation running on hover */
.review-vertical .review-card{
  width:auto;
  min-height:180px;
  box-shadow:0 16px 38px rgba(10,10,10,.08);
}
@keyframes tdb-reviews-up{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@keyframes tdb-reviews-down{from{transform:translateY(-50%)}to{transform:translateY(0)}}
@media (max-width:760px){
  .review-vertical{grid-template-columns:1fr;max-height:520px}
  .review-vcol.reverse{display:none}
}
@media (prefers-reduced-motion:reduce){.review-vcol,.review-vcol.reverse{animation:none;transform:none}}

/* ===================== POUR QUI (LIGHT) ===================== */
.pourqui{padding:80px 0;background:var(--bg)}
.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}
@media (max-width:780px){.compare-grid{grid-template-columns:1fr}}
.compare-card{
  position:relative;
  background:#fafaf8;border:1px solid var(--line);
  border-radius:32px;padding:36px;
  display:flex;flex-direction:column;gap:20px;
  overflow:hidden;
}
.compare-card.green{background:linear-gradient(160deg,#e6f9ee 0%,#d2f5e2 100%);border-color:rgba(40,174,96,.25)}
.compare-card.dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.compare-card .cc-tag{
  display:inline-flex;align-items:center;gap:8px;align-self:flex-start;
  padding:6px 14px;border-radius:999px;
  font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
}
.compare-card.green .cc-tag{background:var(--green);color:#fafaf8}
.compare-card.dark .cc-tag{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.18)}
.cc-h{font-size:clamp(24px,2.8vw,32px);font-weight:900;letter-spacing:-0.02em;line-height:1.1}
.cc-list{display:flex;flex-direction:column;gap:14px;margin-top:8px}
.cc-list li{
  position:relative;padding-left:36px;
  font-size:15px;line-height:1.5;
  padding-bottom:14px;border-bottom:1px dashed rgba(10,10,10,.1);
}
.cc-list li:last-child{border-bottom:0;padding-bottom:0}
.compare-card.dark .cc-list li{border-bottom-color:rgba(255,255,255,.1);color:rgba(255,255,255,.82)}
.cc-list li::before{
  content:"";position:absolute;left:0;top:1px;
  width:24px;height:24px;border-radius:50%;
}
.compare-card.green .cc-list li::before{
  background:var(--green);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>");
  background-size:14px;background-repeat:no-repeat;background-position:center;
}
.compare-card.dark .cc-list li::before{
  background:rgba(255,90,90,.18);border:1px solid rgba(255,90,90,.45);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff5a5a' stroke-width='3' stroke-linecap='round'><line x1='6' y1='6' x2='18' y2='18'/><line x1='18' y1='6' x2='6' y2='18'/></svg>");
  background-size:12px;background-repeat:no-repeat;background-position:center;
}

/* ===================== AVANT / APRÈS ===================== */
.avantapres{padding:80px 0;background:var(--bg)}
.aa-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}
@media (max-width:780px){.aa-grid{grid-template-columns:1fr}}
.aa-card{
  position:relative;
  background:#fafaf8;border:1px solid var(--line);
  border-radius:32px;padding:32px;
  display:flex;flex-direction:column;gap:18px;
  min-height:420px;overflow:hidden;
}
.aa-card.before{background:#ececea}
.aa-card.after{background:var(--ink);color:#fff;border-color:var(--ink)}
.aa-tag{
  display:inline-flex;align-items:center;gap:8px;align-self:flex-start;
  padding:6px 14px;border-radius:999px;
  font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
}
.aa-card.before .aa-tag{background:#dc2626;border:1px solid #dc2626;color:#fff}
.aa-card.after .aa-tag{background:var(--green);color:#fafaf8}
.aa-h{font-size:clamp(24px,3vw,32px);font-weight:900;letter-spacing:-0.02em;line-height:1.1}
.aa-cal{
  flex:1;background:#fafaf8;border-radius:18px;padding:14px;
  border:1px solid var(--line);
  display:grid;grid-template-columns:repeat(5,1fr);gap:6px;
  align-content:start;
}
.aa-card.after .aa-cal{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.1)}
.aa-cal .day{font-size:9.5px;font-weight:700;color:var(--muted);text-align:center;text-transform:uppercase;letter-spacing:.06em;padding-bottom:4px}
.aa-card.after .aa-cal .day{color:rgba(255,255,255,.5)}
.aa-cal .slot{
  height:18px;border-radius:4px;background:#f3f3f0;
}
.aa-card.after .aa-cal .slot{background:rgba(255,255,255,.06)}
.aa-cal .slot.filled{background:var(--green)}
.aa-cal .slot.dim{background:#ececea}
.aa-card.after .aa-cal .slot.dim{background:rgba(255,255,255,.04)}
.aa-foot{font-size:13.5px;color:var(--muted)}
.aa-card.after .aa-foot{color:rgba(255,255,255,.65)}
.aa-grid--agenda{align-items:stretch}
.aa-note{font-size:14px;line-height:1.45;color:var(--muted);margin-top:-6px}
.aa-card.after .aa-note{color:rgba(255,255,255,.7)}
.aa-grid--agenda .aa-card{overflow:visible}
.aa-grid--agenda .aa-cal{
  min-height:220px;
  box-shadow:inset 0 0 0 1px rgba(10,10,10,.04);
}
.aa-grid--agenda .slot{height:24px;position:relative}
.aa-grid--agenda .slot.filled{
  background:linear-gradient(135deg,var(--green),var(--green-soft));
  box-shadow:0 6px 16px rgba(40,174,96,.22);
}
.aa-legend{
  display:flex;gap:18px;flex-wrap:wrap;margin-top:16px;
  font-size:12px;font-weight:700;color:var(--muted);
}
.aa-legend span{display:inline-flex;align-items:center;gap:8px}
.aa-legend i{width:24px;height:12px;border-radius:4px;display:inline-block}
.legend-full{background:linear-gradient(135deg,var(--green),var(--green-soft))}
.legend-empty{background:#ececea;border:1px solid var(--line)}

/* ===================== EMBAUCHER vs TDB ===================== */
.vsembaucher{padding:80px 0;background:var(--bg)}
.vs-table{
  margin-top:24px;
  display:grid;grid-template-columns:1.4fr 1fr 1fr;
  border-radius:32px;overflow:hidden;
  background:#fafaf8;border:1px solid var(--line);
}
@media (max-width:780px){.vs-table{grid-template-columns:1fr;border-radius:24px}}
.vs-cell{padding:18px 22px;font-size:14.5px;color:#2a2a2a;border-bottom:1px solid var(--line)}
.vs-head{
  padding:24px 22px;font-weight:800;font-size:12.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
}
.vs-head.col-emp{background:var(--sable-soft);color:var(--ink)}
.vs-head.col-tdb{
  background:linear-gradient(135deg,var(--green) 0%,var(--green-deep) 100%);
  color:#fff;font-weight:900;
}
.vs-row{display:contents}
.vs-row .vs-cell:nth-child(2){background:var(--sable);}
.vs-row .vs-cell:nth-child(3){background:linear-gradient(135deg,rgba(40,174,96,.06),rgba(40,174,96,.12));border-left:1px solid var(--line)}
.vs-cell.lbl{font-weight:700;color:var(--ink);background:#fafaf8 !important}
.vs-cell .x{color:#d05050;font-weight:800;margin-right:6px}
.vs-cell .ok{color:var(--green);font-weight:800;margin-right:6px}
.vs-table .vs-cell:not(.lbl){
  color:rgba(10,10,10,.68);
  font-size:clamp(15px,1.15vw,19px);
  line-height:1.42;
  letter-spacing:-.025em;
}
.vs-table .vs-row .vs-cell:nth-child(3){
  color:#0a0a0a;
  font-weight:650;
}
.vs-table .vs-cell.lbl{
  font-size:clamp(15px,1.1vw,18px);
}
@media (max-width:780px){
  .vs-row{display:flex;flex-direction:column;border-top:1px dashed var(--line)}
  .vs-cell{border-bottom:0;padding:12px 18px}
  .vs-cell.lbl{padding-top:18px;font-size:15px}
  .vs-row .vs-cell:nth-child(2){background:transparent}
  .vs-row .vs-cell:nth-child(2)::before{content:"❌ Embaucher · "; font-weight:700;color:var(--muted);font-size:11px;letter-spacing:.06em;text-transform:uppercase}
  .vs-row .vs-cell:nth-child(3){background:transparent;border-left:0}
  .vs-row .vs-cell:nth-child(3)::before{content:"✅ Tourdubloc · "; font-weight:700;color:var(--green);font-size:11px;letter-spacing:.06em;text-transform:uppercase}
}

/* ===================== VRAI COÛT DE L'INTERNE ===================== */
.internal-cost{
  padding:34px 0 46px;
  background:var(--bg);
}
.internal-cost-card{
  position:relative;
  overflow:hidden;
  border-radius:34px;
  padding:clamp(36px,5.4vw,70px);
  background:
    radial-gradient(circle at 86% 0%,rgba(98,18,12,.42),transparent 42%),
    radial-gradient(circle at 10% 94%,rgba(40,174,96,.16),transparent 42%),
    linear-gradient(135deg,#050505 0%,#0d0d0b 54%,#22110f 100%);
  color:#fff;
  box-shadow:0 30px 90px -56px rgba(0,0,0,.84);
}
.internal-cost-card::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:175px 175px;
  opacity:.75;
  pointer-events:none;
}
.internal-cost-card::after{
  content:"!";
  position:absolute;
  top:34px;
  right:42px;
  width:46px;
  height:46px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.13);
  color:#ffce3a;
  font-weight:950;
  font-size:24px;
  transform:rotate(-7deg);
}
.internal-cost-card > *{
  position:relative;
  z-index:1;
}
.internal-cost .pill-section{
  width:max-content;
  margin-bottom:26px;
  background:rgba(255,96,88,.1) !important;
  border-color:rgba(255,96,88,.24) !important;
  color:#ff786f !important;
}
.internal-cost .pill-section .sq{
  background:#ffce3a !important;
}
.internal-cost-h{
  max-width:1180px;
  margin:0;
  color:#fff;
  font-size:clamp(34px,5.2vw,82px);
  line-height:.98;
  letter-spacing:-.07em;
  font-weight:950;
}
.internal-cost-h .cost-red{
  color:#ff615c;
  white-space:nowrap;
}
.internal-cost-h .cost-green{
  color:#28ae60;
  white-space:nowrap;
}
.internal-cost-copy{
  max-width:980px;
  margin-top:28px;
  display:grid;
  gap:18px;
}
.internal-cost-copy p{
  margin:0;
  color:rgba(255,255,255,.78);
  font-size:clamp(17px,1.75vw,25px);
  line-height:1.55;
  letter-spacing:-.025em;
}
.internal-cost-copy strong{
  color:#28ae60;
  font-weight:900;
}
@media (max-width:780px){
  .internal-cost{
    padding:24px 0 34px;
  }
  .internal-cost-card{
    border-radius:26px;
  }
  .internal-cost-card::after{
    display:none;
  }
}

/* ===================== BUREAU BLAINVILLE ===================== */
.bureau{padding:80px 0;background:var(--bg)}
.bureau-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;margin-top:24px}
@media (max-width:980px){.bureau-grid{grid-template-columns:1fr}}
.bureau-hero{
  position:relative;border-radius:32px;overflow:hidden;
  aspect-ratio:5/4;
}
.bureau-hero img,.bureau-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bureau-hero img{position:relative;inset:auto}
.bureau-thumbs{display:grid;grid-template-columns:1fr;gap:18px}
@media (min-width:561px) and (max-width:980px){.bureau-thumbs{grid-template-columns:1fr 1fr}}
.bureau-thumb{position:relative;border-radius:24px;overflow:hidden;aspect-ratio:5/4;background:#1c1c1c}
.bureau-caption{
  position:absolute;left:14px;bottom:14px;
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 12px;border-radius:999px;
  background:rgba(10,10,10,.7);backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.12);
  color:#fff;font-size:11px;font-weight:700;letter-spacing:.1em;
}
.bureau-caption .sq{width:8px;height:8px;background:var(--green);border-radius:2px}
.bureau-carousel{
  margin-top:26px;
  position:relative;
  border-radius:32px;
  overflow:hidden;
  background:var(--ink);
  box-shadow:0 30px 70px rgba(10,10,10,.18);
}
.bureau-track{
  display:flex;
  gap:0;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
}
.bureau-track::-webkit-scrollbar{display:none}
.bureau-slide{
  margin:0;
  flex:0 0 78%;
  min-height:520px;
  position:relative;
  scroll-snap-align:center;
  overflow:hidden;
  border-right:1px solid rgba(255,255,255,.12);
}
.bureau-slide:first-child{flex-basis:86%}
.bureau-slide img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.bureau-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.74))}
.bureau-slide figcaption{
  position:absolute;left:24px;bottom:24px;z-index:2;
  display:inline-flex;align-items:center;gap:10px;
  padding:10px 16px;border-radius:999px;
  background:rgba(10,10,10,.72);backdrop-filter:blur(12px);
  color:#fff;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;
}
.bureau-slide .sq,.bureau-dots span.is-active{background:var(--green)}
.bureau-dots{
  position:absolute;left:50%;bottom:24px;transform:translateX(-50%);
  display:flex;gap:8px;z-index:3;
  padding:8px 10px;border-radius:999px;background:rgba(10,10,10,.56);backdrop-filter:blur(10px);
}
.bureau-dots span{width:8px;height:8px;border-radius:999px;background:rgba(255,255,255,.5)}
@media (max-width:760px){
  .bureau-slide,.bureau-slide:first-child{flex-basis:88%;min-height:390px}
  .bureau-slide figcaption{left:14px;bottom:14px;font-size:10px}
}

/* ===================== ÉQUIPE INTÉGRÉE / SLACK MOCK ===================== */
.equipe{padding:80px 0;background:var(--bg)}
.equipe-grid{
  margin-top:24px;
  display:grid;grid-template-columns:1.1fr 1fr;gap:24px;
  align-items:stretch;
}
@media (max-width:980px){.equipe-grid{grid-template-columns:1fr}}
.team-roster{
  background:#fafaf8;border:1px solid var(--line);
  border-radius:32px;padding:32px;
  display:flex;flex-direction:column;gap:18px;
}
.team-roster > .pill-section{align-self:flex-start}
.team-list{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:560px){.team-list{grid-template-columns:1fr}}
.team-row{
  display:flex;align-items:center;gap:12px;
  padding:12px;border-radius:14px;background:var(--sable);
}
.team-avatar{
  width:42px;height:42px;border-radius:50%;
  background:linear-gradient(135deg,var(--green),var(--green-deep));
  color:#fff;font-weight:900;font-size:14px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  letter-spacing:-0.02em;
}
.team-name{font-size:14px;font-weight:800;color:var(--ink)}
.team-role{font-size:12px;color:var(--muted)}
.slack-mock{
  background:var(--ink);color:#fff;
  border-radius:32px;padding:24px;
  display:flex;flex-direction:column;gap:14px;
  overflow:hidden;position:relative;
}
.slack-mock::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 90% 10%,rgba(40,174,96,.14),transparent 50%);
  pointer-events:none;
}
.slack-head{
  display:flex;align-items:center;gap:8px;
  padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.08);
  position:relative;z-index:1;
}
.slack-channel{font-size:13.5px;font-weight:800;color:#fafaf8}
.slack-channel::before{content:"#";color:rgba(255,255,255,.4);margin-right:4px}
.slack-presence{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:11px;color:rgba(255,255,255,.55)}
.slack-presence .dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px rgba(40,174,96,.2)}
.slack-msgs{display:flex;flex-direction:column;gap:14px;position:relative;z-index:1}
.slack-msg{display:flex;gap:10px}
.slack-avatar{width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,#6b6b66,#3a3a35);color:#fff;font-weight:800;font-size:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.slack-avatar.g{background:linear-gradient(135deg,var(--green),var(--green-deep))}
.slack-avatar.o{background:linear-gradient(135deg,#f59e0b,#b45309)}
.slack-avatar.p{background:linear-gradient(135deg,#8b5cf6,#5b21b6)}
.slack-body{display:flex;flex-direction:column;gap:2px;font-size:13px}
.slack-user{font-weight:800;color:#fafaf8}
.slack-time{font-size:10.5px;color:rgba(255,255,255,.4);margin-left:6px;font-weight:500}
.slack-txt{color:rgba(255,255,255,.78);line-height:1.45}
.slack-txt em{color:var(--green-soft);font-style:normal;font-weight:700}
.slack-slider{min-height:390px}
.slack-slides{position:relative;z-index:1;min-height:270px}
.slack-panel{display:none;animation:slackIn .28s ease both}
.slack-panel.is-active{display:block}
.slack-tabs{
  position:relative;z-index:2;margin-top:auto;
  display:flex;gap:8px;flex-wrap:wrap;
  padding-top:14px;border-top:1px solid rgba(255,255,255,.08);
}
.slack-tabs button{
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.72);
  border-radius:999px;padding:8px 11px;
  font:800 11px/1 Satoshi,sans-serif;
  letter-spacing:.04em;cursor:pointer;
}
.slack-tabs button.is-active{background:var(--green);border-color:var(--green);color:#fafaf8}
@keyframes slackIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* ===================== GUARANTEE ===================== */
.guarantee{padding:80px 0;background:var(--bg)}
.guarantee-card{
  position:relative;background:#fafaf8;border:1px solid var(--line);
  border-radius:32px;padding:48px;
  display:grid;grid-template-columns:auto 1fr;gap:48px;
  align-items:center;overflow:hidden;
}
@media (max-width:780px){.guarantee-card{grid-template-columns:1fr;padding:32px;gap:24px}}
.guarantee-seal{
  position:relative;width:200px;height:200px;flex-shrink:0;
}
@media (max-width:780px){.guarantee-seal{width:160px;height:160px}}
.guarantee-seal svg{width:100%;height:100%}
.guarantee-seal .seal-center{
  position:absolute;inset:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;
}
.guarantee-seal .seal-100{font-size:46px;font-weight:900;line-height:.85;color:var(--green);letter-spacing:-0.04em;font-style:italic}
.guarantee-seal .seal-lbl{font-size:9px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);margin-top:4px}
.guarantee-body{display:flex;flex-direction:column;gap:14px}
.guarantee-h{font-size:clamp(28px,3.4vw,40px);font-weight:900;letter-spacing:-0.025em;line-height:1.05}
.guarantee-p{font-size:16px;color:var(--muted);line-height:1.55;max-width:560px}
.guarantee-list{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.guarantee-list li{position:relative;padding-left:28px;font-size:14.5px;color:#2a2a2a;line-height:1.45}
.guarantee-list li::before{
  content:"";position:absolute;left:0;top:4px;width:18px;height:18px;border-radius:50%;
  background:rgba(40,174,96,.14);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2328ae60' stroke-width='3' stroke-linecap='round'><polyline points='20 6 9 17 4 12'/></svg>");
  background-size:12px;background-position:center;background-repeat:no-repeat;
}

/* ----- Guarantee — pale variant (page Formule) ----- */
.guarantee--pale{background:#fafaf8}
.guarantee--pale .guarantee-card{
  background:#fafaf8;
  border:1px solid rgba(10,10,10,.06);
  box-shadow:none;
}
.guarantee--pale .guarantee-seal svg circle:nth-child(2){stroke:rgba(40,174,96,.35)}
.guarantee--pale .guarantee-seal svg circle:first-child{stroke:rgba(10,10,10,.08);stroke-dasharray:2 4}
.guarantee--pale .guarantee-seal svg text{fill:rgba(10,10,10,.18)}
.guarantee--pale .guarantee-seal .seal-100{color:rgba(40,174,96,.45)}
.guarantee--pale .guarantee-seal .seal-lbl{color:rgba(10,10,10,.35)}
.guarantee--pale .guarantee-h{color:rgba(10,10,10,.55)}
.guarantee--pale .guarantee-h .hl-out{-webkit-text-stroke-color:rgba(10,10,10,.4)}
.guarantee--pale .guarantee-h .hl-grad{
  background:linear-gradient(135deg,rgba(40,174,96,.45),rgba(124,228,163,.55));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.guarantee--pale .guarantee-p{color:rgba(10,10,10,.35)}
.guarantee--pale .guarantee-list li{color:rgba(10,10,10,.38)}
.guarantee--pale .guarantee-list li::before{
  background:rgba(40,174,96,.08);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2398d4b0' stroke-width='3' stroke-linecap='round'><polyline points='20 6 9 17 4 12'/></svg>");
  background-size:12px;background-position:center;background-repeat:no-repeat;
}
.guarantee--pale .section-head .pill-section,
.guarantee--pale .section-head .lead{color:rgba(10,10,10,.35)}


/* Old-school countdown counter */
.old-counter{align-items:stretch}
.counter-case{
  position:relative;
  padding:18px;
  border-radius:20px;
  background:linear-gradient(180deg,#2b2b2b,#080808);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 22px 55px rgba(0,0,0,.42);
}
.counter-case::before{
  content:"";position:absolute;inset:8px;border-radius:14px;
  border:1px dashed rgba(255,255,255,.14);
  pointer-events:none;
}
.counter-label{
  position:relative;z-index:1;
  color:rgba(255,255,255,.58);
  font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;
  margin-bottom:12px;text-align:center;
}
.old-counter .promise-counter{position:relative;z-index:1;gap:12px;align-items:flex-start}
.counter-unit{display:flex;flex-direction:column;align-items:center;gap:7px}
.counter-unit small{
  color:rgba(255,255,255,.62);
  font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;
}
.old-counter .flap{
  min-width:72px;height:78px;border-radius:10px;
  font-size:46px;
  background:linear-gradient(180deg,#242424 0%,#050505 49%,#000 50%,#1b1b1b 100%);
  border:1px solid #383838;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 -18px 26px rgba(0,0,0,.58);
}
.old-counter .flap span{font-variant-numeric:tabular-nums}
@media (max-width:560px){
  .old-counter .flap{min-width:58px;height:66px;font-size:36px}
  .old-counter .promise-counter{gap:8px}
}

/* ===================== DARK CTA BAND ===================== */
.darkcta{padding:32px 0;background:var(--bg)}
.darkcta-band{
  position:relative;background:var(--ink);color:#fff;
  border-radius:32px;padding:64px 48px;
  display:flex;align-items:center;justify-content:space-between;gap:32px;
  flex-wrap:wrap;overflow:hidden;
}
@media (max-width:780px){.darkcta-band{padding:40px 28px}}
.darkcta-band::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(circle at 10% 50%,rgba(40,174,96,.16),transparent 50%),
    radial-gradient(circle at 90% 50%,rgba(40,174,96,.12),transparent 55%);
  pointer-events:none;
}
.darkcta-band > *{position:relative;z-index:1}
.darkcta-h{font-size:clamp(28px,4vw,52px);font-weight:900;letter-spacing:-0.025em;line-height:1.05;max-width:680px}

/* ===================== C'EST QUOI TDB ===================== */
.cestquoi{padding:80px 0;background:var(--bg)}
.manifesto{
  background:#fafaf8;border:1px solid var(--line);
  border-radius:32px;padding:64px;
  display:flex;flex-direction:column;gap:24px;
  text-align:center;align-items:center;
}
@media (max-width:780px){.manifesto{padding:40px 28px}}
.manifesto-h{
  font-size:clamp(32px,5vw,72px);
  font-weight:900;letter-spacing:-0.025em;line-height:1;
  text-transform:uppercase;max-width:920px;
}
.manifesto-p{font-size:17px;line-height:1.55;color:var(--muted);max-width:680px}

/* ===================== FAQ ===================== */
.faq{padding:80px 0;background:var(--bg)}
.faq-wrap{margin-top:32px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:780px){.faq-wrap{grid-template-columns:1fr}}
.faq-item{
  background:#fafaf8;border:1px solid var(--line);
  border-radius:18px;overflow:hidden;
  transition:border-color .15s;
}
.faq-item:hover{border-color:rgba(40,174,96,.4)}
.faq-q{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:20px 22px;text-align:left;
  font-size:15.5px;font-weight:700;color:var(--ink);
  cursor:pointer;
}
.faq-q .ic{
  width:30px;height:30px;border-radius:50%;
  background:var(--sable);color:var(--ink);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  transition:background .15s,transform .25s;
}
.faq-item[open] .faq-q .ic{background:var(--green);color:#fff;transform:rotate(45deg)}
.faq-a{padding:0 22px 22px;font-size:14.5px;line-height:1.55;color:var(--muted)}
.faq-q::-webkit-details-marker{display:none}

/* ===================== CTA BOTTOM (iPhone) ===================== */
.applycta{padding:32px 0 80px;background:var(--bg)}
.applycta-band{
  background:var(--ink);color:#fff;
  border-radius:32px;padding:48px;
  display:grid;grid-template-columns:1.2fr 1fr;gap:48px;
  align-items:center;position:relative;overflow:hidden;
}
@media (max-width:980px){.applycta-band{grid-template-columns:1fr;padding:36px 28px;gap:32px}}
.applycta-band::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 80% 30%,rgba(40,174,96,.16),transparent 55%);
  pointer-events:none;
}
.applycta-band > *{position:relative;z-index:1}
.applycta-content{display:flex;flex-direction:column;gap:18px}
.applycta-h{font-size:clamp(28px,3.6vw,52px);font-weight:900;letter-spacing:-0.025em;line-height:1.05}
.applycta-sub{font-size:16px;color:rgba(255,255,255,.7);max-width:480px;line-height:1.5}
.applycta-actions{display:flex;gap:12px;flex-wrap:wrap;padding-top:8px}
.iphone-mock{
  position:relative;width:280px;height:560px;margin:0 auto;
  background:#000;border-radius:42px;
  padding:14px;
  box-shadow:0 30px 60px rgba(0,0,0,.5),inset 0 0 0 2px rgba(255,255,255,.06);
}
@media (max-width:780px){.iphone-mock{width:240px;height:480px}}
.iphone-notch{
  position:absolute;top:18px;left:50%;transform:translateX(-50%);
  width:96px;height:28px;border-radius:18px;background:#000;z-index:2;
}
.iphone-screen{
  width:100%;height:100%;border-radius:30px;
  background:linear-gradient(180deg,#1a1a1a 0%,#0a0a0a 100%);
  overflow:hidden;padding:42px 18px 18px;
  display:flex;flex-direction:column;gap:12px;
  color:#fff;
}
.iphone-screen .imp-time{font-size:14px;font-weight:800;text-align:center;margin-bottom:6px}
.iphone-screen .imp-card{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);
  border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:8px;
}
.iphone-screen .imp-lbl{font-size:10px;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.1em}
.iphone-screen .imp-val{font-size:15px;font-weight:700;color:#fafaf8}
.iphone-screen .imp-cta{
  margin-top:auto;padding:14px;border-radius:14px;
  background:var(--green);color:#fff;font-weight:800;font-size:13px;text-align:center;
  letter-spacing:.04em;
}

/* ===================== FOOTER ===================== */
.tdb-footer{padding:48px 0 64px;background:var(--bg);border-top:1px solid var(--line)}
.tdb-footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.footer-logo{height:28px;width:auto}
.footer-nav{display:flex;gap:18px;flex-wrap:wrap}
.footer-nav a{font-size:13.5px;color:var(--muted);text-decoration:none;font-weight:500}
.footer-nav a:hover{color:var(--ink)}
.footer-meta{font-size:12.5px;color:var(--muted);text-align:right}

/* ===================== PAGE HERO (sous-pages) ===================== */
.page-hero{
  position:relative;
  background:var(--bg);
  padding:64px 0 56px;
  border-bottom:1px solid var(--line);
}
@media (min-width:780px){.page-hero{padding:96px 0 80px}}
.page-hero-inner{
  display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:center;
}
@media (max-width:980px){.page-hero-inner{grid-template-columns:1fr;gap:32px}}
.page-hero-content{display:flex;flex-direction:column;gap:22px}
.page-hero-crumbs{
  display:flex;gap:8px;align-items:center;
  font-size:12px;color:var(--muted);font-weight:500;
  margin-bottom:18px;
}
.page-hero-crumbs a{text-decoration:none;color:var(--muted)}
.page-hero-crumbs a:hover{color:var(--ink)}
.page-hero-crumbs .sep{color:#0a0a0a}
.page-hero-eyebrow{
  display:inline-flex;align-items:center;gap:10px;align-self:flex-start;
  font-size:11.5px;font-weight:800;color:var(--green);letter-spacing:.14em;text-transform:uppercase;
}
.page-hero-eyebrow .sq{width:9px;height:9px;background:var(--green);border-radius:2px}
.page-hero-title{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:clamp(40px,6.4vw,88px);
  font-weight:900;line-height:.95;letter-spacing:-0.035em;
  text-transform:uppercase;color:var(--ink);
}
/* === Global title style (match contact page hero) === */
h1, h2,
.hero-studio-h1,
.brandhero-title,
.section-head,
.b-head,
.bsys-head,
.bsys-reel-head,
.case-head,
.vs-head,
.slack-head,
.formule-head,
.htrio-cal-head,
.promise-h{
  font-family:'Satoshi','Satoshi Variable',sans-serif !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:-0.035em !important;
  line-height:.95 !important;
  color:var(--ink);
}
.section-head .lead{text-transform:none !important;letter-spacing:normal !important;font-weight:400 !important;line-height:1.5 !important;font-family:inherit !important;color:var(--muted)}
.formule-head .lead{text-transform:none !important;letter-spacing:normal !important;font-weight:400 !important;line-height:1.5 !important;font-family:inherit !important;color:var(--muted)}
.page-hero-sub{
  font-size:16px;line-height:1.55;color:var(--muted);
  border-left:2px solid var(--green);padding-left:14px;
  max-width:560px;
}
.page-hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.page-hero-pill{
  display:inline-flex;align-items:center;gap:10px;
  padding:6px 22px 6px 6px;
  background:var(--ink);color:#fff;border-radius:999px;text-decoration:none;
  font-weight:700;font-size:14.5px;transition:background .2s;
}
.page-hero-pill:hover{background:var(--green)}
.page-hero-pill-img{width:34px;height:34px;border-radius:50%;overflow:hidden;flex-shrink:0;position:relative}
.page-hero-pill-img img{width:100%;height:100%;object-fit:cover}
.page-hero-pill-img::after{
  content:"";position:absolute;right:-1px;bottom:-1px;
  width:9px;height:9px;border-radius:50%;background:var(--green);border:2px solid var(--ink);
}
.page-hero-ghost{
  display:inline-flex;align-items:center;gap:6px;
  padding:13px 22px;border:1.5px solid var(--ink);border-radius:999px;
  color:var(--ink);text-decoration:none;font-weight:700;font-size:14.5px;
  transition:background .2s,color .2s;
}
.page-hero-ghost:hover{background:var(--ink);color:#fafaf8}

.page-hero-visual-wrap{position:relative}
.page-hero-card{
  position:relative;
  background:#fafaf8;border:1px solid var(--line);border-radius:32px;
  padding:32px;display:flex;flex-direction:column;gap:18px;
  box-shadow:var(--shadow-lift);
  min-height:340px;
}
.page-hero-card .ph-pill{
  display:inline-flex;align-items:center;gap:8px;align-self:flex-start;
  padding:5px 12px;border-radius:999px;background:var(--sable);
  font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);
  border:1px solid var(--line);
}

/* Steps card (methode hero) */
.steps-card .ph-step{
  display:grid;grid-template-columns:auto 1fr auto;gap:14px;
  padding:14px 16px;border:1px dashed var(--line);border-radius:14px;align-items:center;
}
.steps-card .ph-step .n{
  width:36px;height:36px;border-radius:50%;
  background:rgba(40,174,96,.12);color:var(--green);
  font-weight:900;font-size:14px;
  display:flex;align-items:center;justify-content:center;
}
.steps-card .ph-step .n.final{background:var(--green);color:#fafaf8}
.steps-card .ph-step .lbl{font-size:14px;font-weight:800;color:var(--ink)}
.steps-card .ph-step .sub{font-size:12px;color:var(--muted)}
.steps-card .ph-step .kpi{
  font-size:11.5px;font-weight:800;color:var(--green);
  padding:4px 10px;background:rgba(40,174,96,.08);border-radius:6px;
}

/* Stat card (resultats hero) */
.stat-card{align-items:flex-start;justify-content:center}
.stat-card .ph-bignum{
  font-size:clamp(72px,9vw,128px);
  font-weight:900;letter-spacing:-0.045em;line-height:.85;
  font-variant-numeric:tabular-nums;
}
.stat-card .ph-bignum sup{font-size:.4em;vertical-align:top;font-style:italic}
.stat-card .ph-bignum em{
  background:linear-gradient(135deg,var(--green),var(--green-soft));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  font-style:italic;font-weight:900;
}
.stat-card .ph-bnlbl{font-size:13.5px;color:var(--muted);max-width:320px;line-height:1.45}

/* Portrait card (a-propos hero) */
.portrait-card{padding:0;overflow:hidden;min-height:420px}
.portrait-card img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.portrait-card .portrait-inner{
  position:absolute;inset:0;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:24px;gap:8px;
  background:linear-gradient(180deg,transparent 50%,rgba(10,10,10,.78) 100%);
  color:#fff;
}
.portrait-card .portrait-name{font-size:22px;font-weight:900;letter-spacing:-0.015em}
.portrait-card .portrait-role{font-size:13px;color:rgba(255,255,255,.75)}

/* Calendar card (contact hero) */
.cal-card{display:flex;flex-direction:column;gap:14px}
.cal-head{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:700;color:var(--ink)}
.cal-head .nav-btn{
  width:28px;height:28px;border-radius:50%;background:var(--sable);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;
}
.cal-days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.cal-days .d{
  font-size:10px;font-weight:700;color:var(--muted);padding-bottom:4px;
  text-transform:uppercase;letter-spacing:.06em;
}
.cal-cells{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal-cell{
  aspect-ratio:1;font-size:12px;font-weight:600;
  display:flex;align-items:center;justify-content:center;
  border-radius:8px;background:#fafaf7;color:var(--ink);
}
.cal-cell.off{color:var(--line-strong);background:transparent}
.cal-cell.busy{background:#ececea;color:var(--muted)}
.cal-cell.free{background:rgba(40,174,96,.12);color:var(--green);font-weight:800}
.cal-cell.free.now{background:var(--green);color:#fafaf8}
.cal-slots{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.cal-slots .slot{
  font-size:11.5px;font-weight:800;padding:6px 10px;border-radius:8px;
  background:rgba(40,174,96,.08);color:var(--green);border:1px solid rgba(40,174,96,.18);
}

/* ===================== PAS UN FIT (page) ===================== */
.pasunfit-shell{
  min-height:80vh;display:flex;align-items:center;justify-content:center;
  padding:96px 24px;background:var(--bg);
}
.pasunfit{max-width:680px;display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.pasunfit-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:11.5px;font-weight:800;color:var(--muted);letter-spacing:.14em;text-transform:uppercase;
}
.pasunfit-eyebrow .sq{width:8px;height:8px;background:var(--muted);border-radius:2px}
.pasunfit-h{
  font-size:clamp(34px,5vw,64px);font-weight:900;letter-spacing:-0.03em;line-height:1;
  text-transform:uppercase;
}
.pasunfit-p{font-size:17px;line-height:1.55;color:var(--muted);max-width:540px}
.pasunfit-links{display:flex;flex-direction:column;gap:10px;margin-top:8px;width:100%}
.pasunfit-link{
  display:flex;justify-content:space-between;align-items:center;gap:14px;
  padding:18px 22px;border:1px solid var(--line);border-radius:14px;
  background:#fafaf8;text-decoration:none;color:var(--ink);
  transition:border-color .15s,transform .15s;
}
.pasunfit-link:hover{border-color:var(--green);transform:translateX(4px)}
.pasunfit-link .l-h{font-size:15px;font-weight:800}
.pasunfit-link .l-s{font-size:12.5px;color:var(--muted);margin-top:2px}
.pasunfit-link .arr{color:var(--green);font-size:18px;font-weight:900}

/* ===================== BIEN REÇU ===================== */
.bienrecu-shell{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:var(--bg);padding:48px 24px;
}
.bienrecu{display:flex;flex-direction:column;align-items:center;gap:32px;text-align:center}
.bienrecu .br-logo{height:32px;width:auto;opacity:.8}
.br-check{
  width:88px;height:88px;border-radius:50%;
  background:rgba(40,174,96,.12);color:var(--green);
  display:flex;align-items:center;justify-content:center;
  position:relative;
}
.br-check::before{
  content:"";position:absolute;inset:-8px;border-radius:50%;
  border:1px dashed rgba(40,174,96,.35);
}
.br-h{
  font-size:clamp(40px,6vw,72px);font-weight:900;letter-spacing:-0.03em;line-height:1;
  text-transform:uppercase;
}
.br-p{font-size:17px;color:var(--muted)}

/* ===================== IMAGE DE MARQUE ===================== */
.brandwall{padding:80px 0;background:var(--bg)}
.brandwall-hero{margin-bottom:48px}
.brandwall-h{
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(48px,9vw,128px);
  font-weight:400;font-style:italic;letter-spacing:-0.04em;line-height:.95;
  color:var(--ink);max-width:1100px;
}
.brandwall-meta{display:flex;gap:18px;margin-top:18px;font-size:13.5px;color:var(--muted);font-weight:600}
.brandwall-meta b{color:var(--ink);font-weight:800}
.brand-marquee-wrap{margin:0 -16px;padding:0;overflow:hidden;margin-bottom:32px}
.brand-marquee{
  background:var(--ink);color:#fff;padding:18px 0;overflow:hidden;
  border-radius:0;
}
.brand-marquee-track{
  display:flex;gap:48px;white-space:nowrap;width:max-content;
  animation:tdb-tick 60s linear infinite;
}
.brand-marquee-item{
  display:inline-flex;align-items:center;gap:14px;
  font-size:clamp(16px,1.6vw,22px);font-weight:800;letter-spacing:-0.01em;text-transform:uppercase;
}
.brand-marquee-item .dot{width:6px;height:6px;background:var(--green);border-radius:50%;flex-shrink:0}
.bento-wall{
  display:grid;grid-template-columns:repeat(12,1fr);gap:14px;
  margin-top:24px;
}
@media (max-width:980px){.bento-wall{grid-template-columns:repeat(6,1fr)}}
@media (max-width:560px){.bento-wall{grid-template-columns:repeat(2,1fr)}}
.bento-tile{
  position:relative;border-radius:18px;overflow:hidden;
  aspect-ratio:1/1;
  border:1px solid var(--line);
  background:#fafaf8;
  display:flex;align-items:flex-end;justify-content:flex-start;
  padding:14px;
  transition:transform .25s,box-shadow .25s;
}
.bento-tile:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift)}
.bento-tile.wide{grid-column:span 6}
.bento-tile.tall{grid-row:span 2;aspect-ratio:1/2}
.bento-tile.big{grid-column:span 4;grid-row:span 2;aspect-ratio:auto}
.bento-tile.sq{grid-column:span 3}
@media (max-width:980px){
  .bento-tile{grid-column:span 3}
  .bento-tile.wide{grid-column:span 6}
  .bento-tile.big{grid-column:span 6}
  .bento-tile.tall{grid-row:span 2;grid-column:span 3}
}
@media (max-width:560px){
  .bento-tile{grid-column:span 1}
  .bento-tile.wide,.bento-tile.big{grid-column:span 2}
}
.bento-tile .b-cap{
  position:relative;z-index:1;
  display:flex;flex-direction:column;gap:4px;color:var(--ink);
}
.bento-tile .b-cap .b-name{font-size:13.5px;font-weight:900;letter-spacing:-0.01em}
.bento-tile .b-cap .b-sec{font-size:11px;color:var(--muted);font-weight:600}
.bento-tile.dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.bento-tile.dark .b-cap{color:#fafaf8}
.bento-tile.dark .b-cap .b-sec{color:rgba(255,255,255,.55)}
.bento-tile.green{background:linear-gradient(160deg,var(--green),var(--green-deep));border-color:transparent;color:#fafaf8}
.bento-tile.green .b-cap{color:#fafaf8}
.bento-tile.green .b-cap .b-sec{color:rgba(255,255,255,.7)}
.bento-tile.swatch{background:var(--sable)}
.bento-tile .swatches{
  position:absolute;top:14px;right:14px;display:flex;gap:4px;
}
.bento-tile .swatches span{width:18px;height:18px;border-radius:50%;border:2px solid #fafaf8;box-shadow:0 4px 8px rgba(0,0,0,.1)}

/* Logo-like big tile */
.bento-tile.logo .logo-mark{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:Georgia,serif;font-style:italic;font-size:42px;font-weight:700;
  letter-spacing:-0.04em;
}

/* ===================== Reveal-on-view ===================== */
.rv{opacity:0;transform:translateY(14px);transition:opacity .6s cubic-bezier(.22,1,.36,1),transform .6s cubic-bezier(.22,1,.36,1)}
.rv.rv-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ===================== V3 CREATIVE OVERHAUL ===================== */

/* --- Italic crop fixes ---
   Italic glyphs (especially Satoshi 900 italic / -webkit-text-stroke) have
   ascenders/descenders that overflow the line box at tight line-heights.
   We expand padding + overflow:visible + slightly higher line-height
   on accent spans WITHOUT removing the italic. */
.hero-h1,
.h2,
.darkcta-h,
.applycta-h,
.guarantee-h,
.manifesto-h,
.promise-h,
.formule h3,
.bureau h2,
.brandwall-h{
  overflow:visible;
  padding-right:.04em;
  padding-bottom:.08em;
}
.hero-h1{ line-height:1.04; }
.hl-out,.hl-out--ink,.hl-out--green,.hl-grad,.hero-h1-accent{
  display:inline-block;
  padding:0 .12em .12em .14em;
  line-height:1.08;
  overflow:visible;
}
/* fix gradient clipping by giving room around the glyphs */
.hl-grad{ padding-right:.1em; }
/* When italic span is at end of a line, prevent right glyph clip */
h1,h2,h3,.brandwall-h{ overflow:visible; }

/* --- HERO CARDS TRIO (floating under green band) --- */
.hero-cards-band{
  position:relative;
  margin:0 16px 0;
  padding:0 0 64px;
  z-index:2;
}
@media (max-width:780px){
  .ticker-wrap.hero-ticker{margin:14px 10px 24px}
  .hero-cards-band{margin:0 10px 0;padding-bottom:32px}
}
.hero-cards-trio{
  display:grid;grid-template-columns:1fr 1.05fr 1fr;
  gap:18px;align-items:stretch;
  max-width:1240px;margin:0 auto;padding:0 28px;
}
@media (max-width:980px){.hero-cards-trio{grid-template-columns:1fr 1.05fr 1fr;gap:12px;padding:0 14px}}
@media (max-width:680px){.hero-cards-trio{grid-template-columns:1fr;gap:14px;padding:0 18px}}
@media (min-width:681px) and (max-width:1366px){
  .hero-cards-trio{grid-template-columns:1fr 1.05fr 1fr !important;gap:10px !important;padding:0 12px !important}
  .htrio-card{padding:14px !important}
}

.htrio-card{
  position:relative;background:#fafaf8;border:1px solid rgba(10,10,10,.055);
  border-radius:24px;padding:22px;
  box-shadow:0 34px 70px -36px rgba(10,10,10,.34),0 10px 26px -22px rgba(10,10,10,.18);
  transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s;
  overflow:hidden;
  display:flex;flex-direction:column;gap:14px;
}
.htrio-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.84);
  pointer-events:none;
  z-index:1;
}
.htrio-card > *{position:relative;z-index:2}
.htrio-card:hover{transform:translateY(-4px);box-shadow:0 42px 86px -40px rgba(10,10,10,.38),0 16px 34px -28px rgba(10,10,10,.2)}
.htrio-card.is-dark{background:#0a0a0a;color:#fff;border-color:#0a0a0a}
.htrio-card.tilt-l{transform:rotate(-1.1deg)}
.htrio-card.tilt-r{transform:rotate(1.1deg)}
.htrio-card.tilt-l:hover{transform:rotate(-1.1deg) translateY(-4px)}
.htrio-card.tilt-r:hover{transform:rotate(1.1deg) translateY(-4px)}
@media (max-width:680px){.htrio-card.tilt-l,.htrio-card.tilt-r{transform:none}.htrio-card.tilt-l:hover,.htrio-card.tilt-r:hover{transform:translateY(-4px)}}

.htrio-eyebrow{
  display:inline-flex;align-items:center;gap:8px;align-self:flex-start;
  font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);
}
.htrio-card.is-dark .htrio-eyebrow{color:rgba(255,255,255,.6)}
.htrio-eyebrow .sq{width:8px;height:8px;background:var(--green);border-radius:2px}

/* Card 1 — testimonial rotative */
.htrio-testi{
  min-height:380px;
}
.htrio-testi .htrio-quote{
  font-size:17px;line-height:1.45;color:var(--ink);
  font-weight:500;letter-spacing:-0.005em;
  min-height:11em;
  max-height:11em;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:8;
  -webkit-box-orient:vertical;
  transition:opacity .28s cubic-bezier(.4,0,.2,1),transform .28s cubic-bezier(.4,0,.2,1);
}
.htrio-testi .htrio-quote em{font-style:italic;color:var(--green);font-weight:700}
.htrio-testi .htrio-who{
  display:flex;align-items:center;gap:10px;padding-top:14px;border-top:1.5px dashed rgba(10,10,10,.18);margin-top:auto;
  transition:opacity .28s cubic-bezier(.4,0,.2,1),transform .28s cubic-bezier(.4,0,.2,1);
}
.htrio-testi .htrio-who img{width:36px;height:36px;border-radius:50%;object-fit:cover;flex-shrink:0}
.htrio-testi .htrio-who .nm{font-size:13.5px;font-weight:800;color:var(--ink);line-height:1.2}
.htrio-testi .htrio-who .rl{font-size:11.5px;color:var(--muted);margin-top:2px}
.htrio-testi .stars{color:#f9b500;letter-spacing:1.5px;font-size:13.5px}
.htrio-rotator{display:flex;align-items:center;gap:6px;margin-top:18px;padding-top:0}
.htrio-rotator .d{width:18px;height:3px;border-radius:2px;background:rgba(10,10,10,.12)}
.htrio-rotator .d.is-on{background:var(--green)}
.htrio-testi.is-swapping .htrio-quote,
.htrio-testi.is-swapping .htrio-who{opacity:0;transform:translateY(6px)}

/* Card 2 — portrait/video center (taller) */
.htrio-portrait{
  padding:0;background:#0a0a0a;border-color:rgba(255,255,255,.08);color:#fff;
  min-height:0;
  position:relative;
}
.htrio-portrait .htrio-media{
  position:absolute;inset:0;
  background-size:cover;background-position:center;
}
.htrio-portrait .htrio-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,10,10,.05) 0%,rgba(10,10,10,.85) 100%);
}
.htrio-portrait .htrio-overlay{
  position:absolute;inset:0;padding:22px;
  display:flex;flex-direction:column;justify-content:space-between;
  z-index:1;
}
.htrio-portrait .htrio-eyebrow{color:rgba(255,255,255,.75)}
.htrio-portrait .htrio-eyebrow .sq{background:var(--green)}
.htrio-portrait .htrio-name{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:22px;font-weight:900;letter-spacing:-0.02em;line-height:1.05;
  color:#fff;
}
.htrio-portrait .htrio-name em{color:var(--green);font-style:italic;font-weight:700}
.htrio-portrait .htrio-role{font-size:12.5px;color:rgba(255,255,255,.6);margin-top:2px;letter-spacing:.04em}
/* Card 3 — calendar / next RDV */
.htrio-cal{}
.htrio-cal .htrio-cal-head{
  display:flex;justify-content:space-between;align-items:center;
  font-size:12px;font-weight:700;color:var(--ink);
}
.htrio-cal .htrio-cal-head .month{letter-spacing:.04em}
.htrio-cal .htrio-cal-head .nav{display:inline-flex;gap:4px;color:var(--muted)}
.htrio-cal .htrio-cal-head .nav span{width:18px;height:18px;border-radius:6px;border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;font-size:10px;line-height:1}
.htrio-cal-grid{
  display:grid;grid-template-columns:repeat(7,1fr);gap:4px;
  margin-top:6px;
}
.htrio-cal-grid .hd{
  font-size:9.5px;font-weight:800;letter-spacing:.1em;color:var(--muted);
  text-transform:uppercase;text-align:center;padding:3px 0;
}
.htrio-cal-grid .dn{
  font-size:11.5px;font-weight:600;text-align:center;
  padding:6px 0;color:var(--muted);border-radius:6px;
  position:relative;
}
.htrio-cal-grid .dn.in{color:var(--ink)}
.htrio-cal-grid .dn.bk{background:rgba(40,174,96,.12);color:var(--green)}
.htrio-cal-grid .dn.bk::after{
  content:"";position:absolute;bottom:2px;left:50%;transform:translateX(-50%);
  width:4px;height:4px;border-radius:50%;background:var(--green);
}
.htrio-cal-grid .dn.tdy{background:var(--green);color:#fff;font-weight:800}
.htrio-cal-result{
  background:rgba(10,10,10,.035);border:1px solid rgba(10,10,10,.055);border-radius:14px;
  padding:10px 12px;display:flex;align-items:center;gap:10px;margin-top:8px;
  font-size:12.5px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65);
}
.htrio-cal-result .dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(40,174,96,.16);flex-shrink:0}
.htrio-cal-result b{color:var(--ink);font-weight:800}
.htrio-cal-result .when{color:var(--muted);margin-left:auto;font-weight:600}

/* --- Replacement final-CTA card (no phone shape) --- */
.bookcta-card{
  background:#fafaf8;color:var(--ink);
  border:1px solid var(--line);border-radius:28px;
  padding:24px;display:flex;flex-direction:column;gap:14px;
  box-shadow:0 30px 80px -20px rgba(0,0,0,.5);max-width:420px;margin:0 auto;
  position:relative;
}
.bookcta-card::before{
  content:"";position:absolute;inset:-12px -12px auto auto;width:160px;height:160px;
  background:radial-gradient(circle,rgba(124,228,163,.25),transparent 70%);
  pointer-events:none;border-radius:50%;z-index:0;
}
.bookcta-card > *{position:relative;z-index:1}
.bookcta-head{display:flex;align-items:center;gap:12px}
.bookcta-avatar{width:44px;height:44px;border-radius:50%;overflow:hidden;border:2px solid var(--green);flex-shrink:0}
.bookcta-avatar img{width:100%;height:100%;object-fit:cover}
.bookcta-name{font-size:14.5px;font-weight:800;color:var(--ink);line-height:1.15}
.bookcta-role{font-size:11.5px;color:var(--muted);margin-top:2px;letter-spacing:.04em;text-transform:uppercase}
.bookcta-rows{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.bookcta-row{
  background:var(--bg);border:1px solid var(--line);border-radius:14px;
  padding:12px 14px;display:flex;align-items:center;gap:12px;
}
.bookcta-row svg{width:16px;height:16px;color:var(--green);flex-shrink:0}
.bookcta-row .lbl{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;font-weight:700}
.bookcta-row .val{font-size:13.5px;font-weight:700;color:var(--ink);margin-top:1px}
.bookcta-row .col{display:flex;flex-direction:column;line-height:1.2}
.bookcta-cta{
  margin-top:4px;background:var(--green);color:#fff;
  padding:14px 18px;border-radius:14px;font-weight:800;font-size:13.5px;
  text-decoration:none;text-align:center;letter-spacing:.04em;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  box-shadow:0 14px 30px -10px rgba(40,174,96,.55);
  transition:transform .15s,box-shadow .15s;
}
.bookcta-cta:hover{transform:translateY(-1px);box-shadow:0 18px 38px -10px rgba(40,174,96,.7)}
.bookcta-foot{
  display:flex;align-items:center;gap:8px;justify-content:center;
  font-size:11px;color:var(--muted);padding-top:2px;
}
.bookcta-foot .live{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--green)}
.bookcta-foot .pulse{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(40,174,96,.16)}

/* --- BRAND WALL (homepage section + image-de-marque page) --- */
.brandsection{
  background:var(--ink);color:#fff;padding:96px 0 88px;position:relative;overflow:hidden;
}
.brandsection::before{
  content:"";position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:175px 175px;pointer-events:none;
}
.brandsection .section-head h2{color:#fafaf8}
.brandsection .section-head .lead{color:rgba(255,255,255,.65)}
.brandsection .pill-section{background:rgba(40,174,96,.18);color:var(--green-soft);border:1px solid rgba(40,174,96,.32)}
.brandsection .pill-section .sq{background:var(--green)}
.brandsection .hl-out{-webkit-text-stroke:1.5px rgba(255,255,255,.55)}

.brandwall-strip{
  display:flex;gap:14px;overflow:hidden;padding:8px 0;
  margin-top:32px;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}
.brandwall-strip-track{display:flex;gap:14px;flex-shrink:0;animation:brandStrip 60s linear infinite;will-change:transform}
@keyframes brandStrip{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.brandwall-thumb{
  width:280px;height:200px;flex-shrink:0;
  border-radius:16px;overflow:hidden;
  background:#1a1a1a;border:1px solid rgba(255,255,255,.06);
  position:relative;
}
.brandwall-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.22,1,.36,1)}
.brandwall-thumb:hover img{transform:scale(1.04)}
.brandwall-thumb .lbl{
  position:absolute;left:12px;bottom:12px;padding:5px 10px;
  background:rgba(0,0,0,.55);backdrop-filter:blur(8px);
  border-radius:999px;font-size:11px;font-weight:700;color:#fff;
  letter-spacing:.06em;text-transform:uppercase;
}
.brandsection .brandwall-cta{
  display:flex;justify-content:center;margin-top:40px;gap:12px;flex-wrap:wrap;
}

/* --- IMAGE-DE-MARQUE PAGE: bento brand wall (real assets) --- */
.bwall{
  background:var(--bg);padding:64px 0 96px;
}
.bwall-grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  grid-auto-rows:200px;gap:14px;
}
@media (max-width:1080px){.bwall-grid{grid-template-columns:repeat(8,1fr);grid-auto-rows:180px}}
@media (max-width:680px){.bwall-grid{grid-template-columns:repeat(4,1fr);grid-auto-rows:160px;gap:10px}}
.bwall-tile{
  position:relative;border-radius:22px;overflow:hidden;
  background:#fafaf8;border:1px solid var(--line);
  display:flex;flex-direction:column;justify-content:flex-end;
}
.bwall-tile img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center;display:block;
  transition:transform .8s cubic-bezier(.22,1,.36,1);
}
.bwall-tile:hover img{transform:scale(1.05)}
.bwall-tile.dark{background:#0a0a0a}
.bwall-tile .ovr{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,10,10,0) 30%,rgba(10,10,10,.85) 100%);
  pointer-events:none;
}
.bwall-tile .cap{
  position:relative;z-index:1;padding:16px 18px;color:#fff;
}
.bwall-tile .cap .brand{
  font-family:'Satoshi','Satoshi Variable',sans-serif;font-weight:900;letter-spacing:-0.02em;
  font-size:18px;line-height:1.1;
}
.bwall-tile .cap .sector{
  font-size:11px;color:rgba(255,255,255,.7);margin-top:3px;
  letter-spacing:.08em;text-transform:uppercase;font-weight:700;
}
.bwall-tile .num{
  position:absolute;top:14px;left:16px;z-index:1;
  font-size:10.5px;font-weight:800;color:rgba(255,255,255,.78);
  letter-spacing:.16em;text-transform:uppercase;
}
.bwall-tile .num::before{
  content:"";display:inline-block;width:7px;height:7px;background:var(--green);
  border-radius:2px;margin-right:8px;vertical-align:middle;
}
.bwall-tile.no-img{display:flex;align-items:center;justify-content:center;padding:24px}
.bwall-tile.no-img .quote{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:24px;font-weight:900;letter-spacing:-0.025em;line-height:1.05;color:var(--ink);
  text-align:left;
}
.bwall-tile.no-img.dark .quote{color:#fafaf8}
.bwall-tile.no-img .quote em{font-style:italic;color:var(--green);font-weight:700}
.bwall-tile.is-stat{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;padding:20px}
.bwall-tile.is-stat .num-big{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:64px;font-weight:900;letter-spacing:-0.04em;line-height:.9;color:var(--ink);
}
.bwall-tile.is-stat.dark .num-big{color:#fafaf8}
.bwall-tile.is-stat .stat-lbl{font-size:12px;color:var(--muted);margin-top:8px;font-weight:600;line-height:1.4}
.bwall-tile.is-stat.dark .stat-lbl{color:rgba(255,255,255,.65)}

/* size variants - 12-col grid */
.bwall-tile.r2{grid-row:span 2}
.bwall-tile.c3{grid-column:span 3}
.bwall-tile.c4{grid-column:span 4}
.bwall-tile.c5{grid-column:span 5}
.bwall-tile.c6{grid-column:span 6}
.bwall-tile.c8{grid-column:span 8}
@media (max-width:1080px){
  .bwall-tile.c3,.bwall-tile.c4{grid-column:span 4}
  .bwall-tile.c5,.bwall-tile.c6{grid-column:span 4}
  .bwall-tile.c8{grid-column:span 8}
}
@media (max-width:680px){
  .bwall-tile.c3,.bwall-tile.c4,.bwall-tile.c5,.bwall-tile.c6,.bwall-tile.c8{grid-column:span 4}
  .bwall-tile.r2{grid-row:span 1}
}

/* Brand index list (image-de-marque) */
.bindex{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px;
}
@media (max-width:980px){.bindex{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.bindex{grid-template-columns:1fr}}
.bindex-card{
  background:#fafaf8;border:1px solid var(--line);border-radius:18px;
  padding:18px 20px;display:flex;flex-direction:column;gap:10px;
  transition:border-color .2s,transform .2s,box-shadow .2s;
}
.bindex-card:hover{border-color:var(--green);transform:translateY(-2px);box-shadow:0 18px 36px -16px rgba(10,10,10,.18)}
.bindex-card .row{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.bindex-card .nm{font-family:'Satoshi','Satoshi Variable',sans-serif;font-size:20px;font-weight:900;letter-spacing:-0.02em;color:var(--ink)}
.bindex-card .yr{font-size:11px;color:var(--muted);font-weight:700;letter-spacing:.08em}
.bindex-card .sector{font-size:12px;color:var(--muted);letter-spacing:.04em;text-transform:uppercase;font-weight:700}
.bindex-card .deliv{display:flex;flex-wrap:wrap;gap:5px;padding-top:4px;border-top:1px dashed var(--line);margin-top:auto}
.bindex-card .deliv span{font-size:10.5px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:4px 9px;font-weight:600;color:var(--ink)}

/* Brand hero (page) */
.brandhero{
  background:var(--ink);color:#fff;padding:96px 0 72px;
  margin:0;position:relative;overflow:hidden;
  border-radius:0 0 32px 32px;
}
.brandhero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:175px 175px;pointer-events:none}
.brandhero-inner{position:relative;z-index:1}
.brandhero-eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:11.5px;font-weight:800;color:var(--green);letter-spacing:.16em;text-transform:uppercase}
.brandhero-eyebrow .sq{width:9px;height:9px;background:var(--green);border-radius:2px}
.brandhero-title{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:clamp(40px,7vw,96px);font-weight:900;line-height:.96;letter-spacing:-0.035em;
  color:#fff;margin:18px 0 22px;overflow:visible;padding-bottom:.08em;
}
.brandhero-title em{font-style:italic;font-weight:500;color:transparent;-webkit-text-stroke:1.6px rgba(255,255,255,.55);padding:0 .08em .12em;display:inline-block}
.brandhero-title em.green{-webkit-text-stroke:0;background:linear-gradient(135deg,var(--green),var(--green-soft));-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800}
.brandhero-sub{font-size:17px;color:rgba(255,255,255,.7);max-width:620px;border-left:2px solid var(--green);padding-left:18px;line-height:1.55}
.brandhero-stats{display:grid;grid-template-columns:repeat(4,auto);gap:28px;margin-top:36px}
@media (max-width:680px){.brandhero-stats{grid-template-columns:1fr 1fr;gap:18px}}
.brandhero-stat .n{font-size:34px;font-weight:900;letter-spacing:-0.025em;color:#fff;line-height:1}
.brandhero-stat .n sup{font-size:.5em;color:var(--green);font-style:italic;font-weight:900;vertical-align:top}
.brandhero-stat .l{font-size:11.5px;color:rgba(255,255,255,.5);margin-top:6px;letter-spacing:.08em;text-transform:uppercase;font-weight:700}

/* small alignment fixes */
.section-head .num{font-family:'Satoshi Variable',monospace;font-size:13px;color:var(--muted);letter-spacing:.14em}

/* Editorial methode banner */
.os-section{padding:96px 0;background:var(--ink);color:#fff;border-radius:32px;max-width:min(1240px,calc(100% - 56px));margin:24px auto;position:relative;overflow:hidden}
.os-section .wrap{position:relative;z-index:1}
.os-section::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:175px 175px}
.os-section .section-head h2,.os-section h2{color:#fafaf8}
.os-section .section-head .lead{color:rgba(255,255,255,.65)}
.os-section .pill-section{background:rgba(40,174,96,.18);color:var(--green-soft);border:1px solid rgba(40,174,96,.32)}
.os-section .pill-section .sq{background:var(--green)}
.os-section .hl-out{-webkit-text-stroke:1.5px rgba(255,255,255,.55)}
.os-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:48px}
@media (max-width:980px){.os-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.os-grid{grid-template-columns:1fr}}
.os-tile{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:12px;min-height:200px;transition:border-color .25s,background .25s}
.os-tile:hover{border-color:rgba(40,174,96,.5);background:rgba(40,174,96,.06)}
.os-tile .ico{width:36px;height:36px;border-radius:10px;background:rgba(40,174,96,.18);color:var(--green);display:flex;align-items:center;justify-content:center}
.os-tile .ico svg{width:18px;height:18px}
.os-tile h4{font-size:17px;font-weight:800;color:#fff;letter-spacing:-0.01em}
.os-tile p{font-size:13.5px;color:rgba(255,255,255,.6);line-height:1.5}
.os-tile .meta{font-size:10.5px;color:var(--green);letter-spacing:.14em;text-transform:uppercase;font-weight:800;margin-top:auto}

/* ===== FIX: ensure outline-italic is visible on light brand wall sections ===== */
.bwall .hl-out,
.bindex .hl-out,
.bindex-section .hl-out{ -webkit-text-stroke:1.5px rgba(10,10,10,.4); color:transparent; }
.bwall .hl-grad,
.bindex .hl-grad,
.bindex-section .hl-grad{
  background:linear-gradient(135deg, var(--green) 0%, var(--green-soft) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* =========================================================
   BRAND SYSTEMS WALL — éditorial, "paquets" fanned/stacked
   ========================================================= */

.bsys-section{padding:88px 0 96px;background:var(--bg);border:1px solid var(--line);border-radius:32px;max-width:min(1240px,calc(100% - 56px));margin:24px auto;overflow:visible}
.bsys-section .wrap{position:relative}

.bsys-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap;margin-bottom:56px}
.bsys-head .left{max-width:780px}
.bsys-head h2{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:clamp(36px,5.6vw,72px);font-weight:900;line-height:1;letter-spacing:-0.035em;
  color:var(--ink);margin:14px 0 14px;overflow:visible;padding-bottom:.08em;
}
.bsys-head h2 em{font-style:italic;font-weight:500;display:inline-block;padding:0 .06em .12em}
.bsys-head .lead{font-size:17px;color:var(--muted);max-width:640px;line-height:1.55}
.bsys-head .meta-num{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:12px;color:var(--muted);letter-spacing:.16em}

/* Row scaffolding — flexible 12-col layout */
.bsys-row{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;margin-bottom:24px}
.bsys-row{align-items:stretch}
.bsys-row > .bsys-card{height:100%}
.bsys-row > .bsys-card .bsys-stack{flex:1 1 auto;aspect-ratio:auto;min-height:240px}
.bsys-row > .bsys-card.feature .bsys-stack{min-height:300px}
@media (max-width:1080px){.bsys-row{grid-template-columns:repeat(6,1fr);gap:18px}}
@media (max-width:680px){.bsys-row{grid-template-columns:1fr;gap:16px;margin-bottom:16px}}

/* Each "brand card" — a panel containing a fanned stack */
.bsys-card{
  position:relative;background:#fafaf8;border:1px solid var(--line);border-radius:24px;
  padding:24px 24px 22px;overflow:visible;
  display:flex;flex-direction:column;gap:18px;
  transition:border-color .25s,transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s;
}
.bsys-card:hover{border-color:rgba(10,10,10,.22);transform:translateY(-3px);box-shadow:0 24px 48px -22px rgba(10,10,10,.18)}
.bsys-card.feature{padding:32px 32px 28px;border-radius:28px}
.bsys-card.dark{background:#0a0a0a;color:#fff;border-color:rgba(255,255,255,.12)}
.bsys-card.dark .b-sector,.bsys-card.dark .b-deliv span{color:rgba(255,255,255,.7)}
.bsys-card.dark .b-deliv span{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}
.bsys-card.sable{background:var(--sable)}

/* Column spans */
.bsys-card.col3{grid-column:span 3}
.bsys-card.col2{grid-column:span 2}
.bsys-card.col1{grid-column:span 1}
.bsys-card.col4{grid-column:span 4}
.bsys-card.col5{grid-column:span 5}
.bsys-card.col6{grid-column:span 6}
.bsys-card.col7{grid-column:span 7}
.bsys-card.col8{grid-column:span 8}
.bsys-card.col12{grid-column:span 12}
.bsys-quote.col3{grid-column:span 3}
@media (max-width:1080px){
  .bsys-card.col3{grid-column:span 3}
  .bsys-card.col4,.bsys-card.col5{grid-column:span 3}
  .bsys-card.col6,.bsys-card.col7,.bsys-card.col8{grid-column:span 6}
  .bsys-card.col12{grid-column:span 6}
  .bsys-quote.col3{grid-column:span 3}
}
@media (max-width:680px){
  .bsys-card.col3,.bsys-card.col4,.bsys-card.col5,.bsys-card.col6,.bsys-card.col7,.bsys-card.col8,.bsys-card.col12{grid-column:span 1}
  .bsys-quote.col3{grid-column:span 1}
}

/* Tablet (781-1024px): force 1-2-1-2 alternating layout, rows always full */
@media (min-width:681px) and (max-width:1024px){
  .bsys-section .wrap{display:grid;grid-template-columns:1fr 1fr;gap:18px;row-gap:18px}
  .bsys-section .wrap > .bsys-row{display:contents}
  .bsys-section .wrap > .bsys-row > .bsys-card{grid-column:span 1 !important;margin-bottom:0}
  .bsys-section .wrap > .bsys-row > .bsys-card.t-full{grid-column:1 / -1 !important}
}

/* Card header */
.bsys-card .b-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.bsys-card .b-num{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:11px;color:var(--muted);letter-spacing:.14em;text-transform:uppercase}
.bsys-card.dark .b-num{color:rgba(255,255,255,.5)}
.bsys-card .b-name{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:32px;font-weight:900;letter-spacing:-0.025em;color:var(--ink);line-height:1;
}
.bsys-card.feature .b-name{font-size:44px}
.bsys-card.dark .b-name{color:#fafaf8}
.bsys-card .b-sector{font-size:12px;color:var(--muted);letter-spacing:.05em;text-transform:uppercase;font-weight:700;margin-top:6px}

/* The stack — 3-4 brandbook pages fanned diagonally */
.bsys-stack{
  position:relative;width:100%;
  aspect-ratio: 16/10;
  perspective:1200px;
  margin-top: clamp(14px, 4.5%, 36px);
  overflow:visible;
  border-radius:14px;
}
.bsys-card.feature .bsys-stack{aspect-ratio: 16/9}
.bsys-stack .pg{
  position:absolute;inset:0;
  border-radius:10px;overflow:hidden;
  border:1px solid rgba(10,10,10,.08);
  box-shadow:0 18px 42px -18px rgba(10,10,10,.45),0 4px 14px -6px rgba(10,10,10,.18);
  background:#fafaf8;
  transition:transform .55s cubic-bezier(.22,1,.36,1),box-shadow .55s;
  will-change:transform;
}
.bsys-stack .pg img{width:100%;height:100%;object-fit:cover;display:block}
/* fanned by default — 4-page layout */
.bsys-stack .pg.p1{transform:translate(-18%,-6%) rotate(-7deg);z-index:1}
.bsys-stack .pg.p2{transform:translate(-6%,2%) rotate(-2deg);z-index:2}
.bsys-stack .pg.p3{transform:translate(8%,-2%) rotate(3deg);z-index:3}
.bsys-stack .pg.p4{transform:translate(20%,6%) rotate(7.5deg);z-index:4}
/* single-image variant — flush, no rotation */
.bsys-stack.single .pg.p1{transform:none;z-index:1}
.bsys-card:hover .bsys-stack.single .pg.p1{transform:none}
/* 3-page variant */
.bsys-stack.three .pg.p1{transform:translate(-6%,-2%) rotate(-4deg);z-index:1}
.bsys-stack.three .pg.p2{transform:translate(0,1%) rotate(0deg);z-index:2}
.bsys-stack.three .pg.p3{transform:translate(6%,-1%) rotate(4.2deg);z-index:3}
/* stacked variant (less fan, more layered/offset) */
.bsys-stack.layered .pg.p1{transform:translate(-3%,4%) rotate(-1.5deg);z-index:1}
.bsys-stack.layered .pg.p2{transform:translate(0,2%) rotate(0);z-index:2}
.bsys-stack.layered .pg.p3{transform:translate(3%,-2%) rotate(1.5deg);z-index:3}
.bsys-stack.layered .pg.p4{transform:translate(6%,-4%) rotate(3deg);z-index:4}
/* tilted-grid variant (2x2-ish, looser) */
.bsys-stack.grid .pg.p1{transform:translate(-12%,-6%) rotate(-3deg);z-index:1}
.bsys-stack.grid .pg.p2{transform:translate(10%,-4%) rotate(2.5deg);z-index:2}
.bsys-stack.grid .pg.p3{transform:translate(-9%,9%) rotate(-1.5deg);z-index:3}
.bsys-stack.grid .pg.p4{transform:translate(12%,8%) rotate(3.5deg);z-index:4}

/* hover spread */
.bsys-card:hover .bsys-stack .pg.p1{transform:translate(-26%,-9%) rotate(-10deg)}
.bsys-card:hover .bsys-stack .pg.p2{transform:translate(-9%,3%) rotate(-3deg)}
.bsys-card:hover .bsys-stack .pg.p3{transform:translate(11%,-3%) rotate(4.5deg)}
.bsys-card:hover .bsys-stack .pg.p4{transform:translate(28%,9%) rotate(11deg)}
.bsys-card:hover .bsys-stack.layered .pg.p1{transform:translate(-6%,7%) rotate(-3deg)}
.bsys-card:hover .bsys-stack.layered .pg.p2{transform:translate(0,3%) rotate(0)}
.bsys-card:hover .bsys-stack.layered .pg.p3{transform:translate(6%,-4%) rotate(3deg)}
.bsys-card:hover .bsys-stack.layered .pg.p4{transform:translate(12%,-7%) rotate(5deg)}
.bsys-card:hover .bsys-stack.grid .pg.p1{transform:translate(-16%,-9%) rotate(-5deg)}
.bsys-card:hover .bsys-stack.grid .pg.p2{transform:translate(15%,-7%) rotate(4.5deg)}
.bsys-card:hover .bsys-stack.grid .pg.p3{transform:translate(-13%,13%) rotate(-3deg)}
.bsys-card:hover .bsys-stack.grid .pg.p4{transform:translate(17%,12%) rotate(5.5deg)}

/* Card footer — palette + deliverables */
.bsys-card .b-foot{display:flex;flex-direction:column;gap:10px}
.bsys-card .b-palette{display:flex;gap:5px;align-items:center}
.bsys-card .b-palette .chip{width:18px;height:18px;border-radius:50%;border:1.5px solid rgba(255,255,255,.7);box-shadow:0 2px 6px rgba(10,10,10,.12)}
.bsys-card.dark .b-palette .chip{border-color:rgba(0,0,0,.4)}
.bsys-card .b-palette .pal-label{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:10.5px;color:var(--muted);letter-spacing:.12em;text-transform:uppercase;margin-left:6px}
.bsys-card .b-deliv{display:flex;flex-wrap:wrap;gap:5px}
.bsys-card .b-deliv span{
  font-size:10.5px;background:var(--bg);border:1px solid var(--line);border-radius:999px;
  padding:4px 9px;font-weight:600;color:var(--ink);letter-spacing:.02em;
}

/* Optional pull-quote tile inside the row */
.bsys-quote{
  grid-column:span 4;background:#0a0a0a;color:#fff;border-radius:24px;padding:32px 28px;
  display:flex;flex-direction:column;justify-content:space-between;gap:18px;min-height:280px;
  position:relative;overflow:hidden;
}
.bsys-quote::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:80px 80px;pointer-events:none}
.bsys-quote .q-mark{font-family:'Satoshi','Satoshi Variable',sans-serif;font-size:88px;line-height:.6;color:var(--green);font-style:italic;font-weight:900}
.bsys-quote .q-txt{font-size:18px;line-height:1.45;font-weight:500;position:relative;z-index:1}
.bsys-quote .q-txt em{font-style:italic;color:var(--green-soft);font-weight:700}
.bsys-quote .q-att{font-size:12px;color:rgba(255,255,255,.55);letter-spacing:.08em;text-transform:uppercase;font-weight:700;position:relative;z-index:1}
@media (max-width:1080px){.bsys-quote{grid-column:span 3}}
@media (max-width:680px){.bsys-quote{grid-column:span 1;min-height:220px}}

/* Stat tile */
.bsys-stat{
  grid-column:span 4;background:linear-gradient(160deg,#0a0a0a 0%,#1c8c4d 110%);color:#fff;
  border-radius:24px;padding:32px 28px;display:flex;flex-direction:column;justify-content:flex-end;
  min-height:280px;position:relative;overflow:hidden;
}
.bsys-stat::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:80px 80px;pointer-events:none}
.bsys-stat .n-big{font-family:'Satoshi','Satoshi Variable',sans-serif;font-size:96px;font-weight:900;letter-spacing:-0.045em;line-height:.9;position:relative;z-index:1}
.bsys-stat .n-big sup{font-size:.5em;color:var(--green-soft);font-style:italic;font-weight:900;vertical-align:top}
.bsys-stat .n-lbl{font-size:13px;color:rgba(255,255,255,.75);margin-top:10px;line-height:1.4;font-weight:600;max-width:240px;position:relative;z-index:1}
@media (max-width:1080px){.bsys-stat{grid-column:span 3}}
@media (max-width:680px){.bsys-stat{grid-column:span 1;min-height:200px}.bsys-stat .n-big{font-size:64px}}

/* Editorial separator with manifesto line */
.bsys-sep{
  grid-column:span 12;display:flex;align-items:center;gap:24px;
  padding:8px 0 8px;margin:8px 0 -4px;
}
.bsys-sep .line{flex:1;height:1px;background:var(--line)}
.bsys-sep .txt{
  font-family:'Satoshi','Satoshi Variable',sans-serif;font-size:13px;font-weight:700;
  color:var(--ink);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;
}
.bsys-sep .txt em{font-style:italic;color:var(--green);font-weight:900;text-transform:none;letter-spacing:0;font-size:1.15em}

/* =========================================================
   BRAND REEL — horizontal scroll de paquets (varié, pas cheap)
   ========================================================= */
.bsys-reel-section{
  padding:80px 0 88px;background:var(--ink);color:#fff;
  border-radius:32px;max-width:min(1240px,calc(100% - 56px));margin:16px auto;position:relative;overflow:hidden;
}
.bsys-reel-section::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:175px 175px;pointer-events:none}
.bsys-reel-section .wrap{position:relative;z-index:1}
.bsys-reel-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:40px}
.bsys-reel-head h2{font-family:'Satoshi','Satoshi Variable',sans-serif;font-size:clamp(32px,4.5vw,56px);font-weight:900;letter-spacing:-0.03em;line-height:1;color:#fff;overflow:visible;padding-bottom:.08em}
.bsys-reel-head h2 em{font-style:italic;font-weight:500;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.55);display:inline-block;padding:0 .06em .12em}
.bsys-reel-head .lead{color:rgba(255,255,255,.65);font-size:15px;max-width:540px;line-height:1.55}
.bsys-reel-head .pill-section{background:rgba(40,174,96,.18);color:var(--green-soft);border:1px solid rgba(40,174,96,.32)}

.bsys-reel{
  display:flex;gap:28px;overflow-x:auto;scroll-snap-type:x mandatory;
  padding:8px 28px 24px;margin:0 -28px;
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent;
}
.bsys-reel::-webkit-scrollbar{height:8px}
.bsys-reel::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:4px}
.bsys-reel-item{
  flex:0 0 auto;width:380px;scroll-snap-align:start;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);
  border-radius:20px;padding:22px;display:flex;flex-direction:column;gap:16px;
  transition:border-color .25s,background .25s,transform .35s;
}
.bsys-reel-item:hover{border-color:rgba(40,174,96,.45);background:rgba(40,174,96,.05);transform:translateY(-3px)}
.bsys-reel-item .r-name{font-family:'Satoshi','Satoshi Variable',sans-serif;font-size:22px;font-weight:900;letter-spacing:-0.02em;color:#fff;line-height:1}
.bsys-reel-item .r-sector{font-size:11px;color:var(--green-soft);letter-spacing:.1em;text-transform:uppercase;font-weight:700}
.bsys-reel-item .bsys-stack{aspect-ratio: 4/3}
@media (max-width:680px){.bsys-reel-item{width:280px}.bsys-reel-item .bsys-stack{aspect-ratio: 4/3}}

/* =========================================================
   BRIDGE — Avant une campagne… (lien branding ↔ performance)
   ========================================================= */
.bsys-bridge{padding:88px 0;background:var(--sable);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.bsys-bridge-inner{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center}
@media (max-width:980px){.bsys-bridge-inner{grid-template-columns:1fr;gap:32px}}
.bsys-bridge h2{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:clamp(32px,4.8vw,64px);font-weight:900;letter-spacing:-0.035em;line-height:1.02;
  color:var(--ink);overflow:visible;padding-bottom:.08em;
}
.bsys-bridge h2 em{font-style:italic;font-weight:500;display:inline-block;padding:0 .06em .12em}
.bsys-bridge p{font-size:17px;color:var(--ink);max-width:540px;line-height:1.55;margin-top:20px;border-left:2px solid var(--green);padding-left:18px}
.bsys-bridge .chain{display:flex;flex-direction:column;gap:14px;margin-top:28px}
.bsys-bridge .chain-step{
  display:flex;align-items:center;gap:18px;padding:18px 22px;background:#fafaf8;
  border:1px solid var(--line);border-radius:18px;
}
.bsys-bridge .chain-step .n{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:11px;color:var(--muted);letter-spacing:.14em;width:36px;flex-shrink:0}
.bsys-bridge .chain-step .t{font-family:'Satoshi','Satoshi Variable',sans-serif;font-size:18px;font-weight:800;color:var(--ink);letter-spacing:-0.015em}
.bsys-bridge .chain-step .t em{font-style:italic;color:var(--green);font-weight:900}
.bsys-bridge .chain-step .ar{margin-left:auto;color:var(--muted)}
.bsys-bridge .chain-step.is-active{border-color:var(--green);background:#fafaf8;box-shadow:0 18px 36px -18px rgba(40,174,96,.32)}
.bsys-bridge .chain-step.is-active .ar{color:var(--green)}

/* =========================================================
   HOME TEASER — replace the marquee thumbnails block
   ========================================================= */
.btease{padding:48px 0 24px}
.btease-row{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:32px}
@media (max-width:980px){.btease-row{grid-template-columns:1fr;gap:18px}}
.btease-card{
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);
  border-radius:22px;padding:24px;display:flex;flex-direction:column;gap:18px;
  transition:border-color .25s,background .25s,transform .35s;
}
.btease-card:hover{border-color:rgba(40,174,96,.45);background:rgba(40,174,96,.06);transform:translateY(-3px)}
.btease-card .t-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.btease-card .t-name{font-family:'Satoshi','Satoshi Variable',sans-serif;font-size:24px;font-weight:900;letter-spacing:-0.02em;color:#fff;line-height:1}
.btease-card .t-sector{font-size:11px;color:var(--green-soft);letter-spacing:.1em;text-transform:uppercase;font-weight:700}
.btease-card .bsys-stack{aspect-ratio: 16/10}
.btease-card .bsys-stack .pg{border-color:rgba(255,255,255,.1)}
.btease-card .b-deliv{display:flex;flex-wrap:wrap;gap:5px}
.btease-card .b-deliv span{font-size:10.5px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:4px 9px;font-weight:600;color:rgba(255,255,255,.8)}

/* Fix hl-out on sable backgrounds */
.bsys-section .hl-out,.bsys-bridge .hl-out{-webkit-text-stroke:1.5px rgba(10,10,10,.4);color:transparent}
.bsys-section .hl-grad,.bsys-bridge .hl-grad{
  background:linear-gradient(135deg,var(--green) 0%,var(--green-soft) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* =========================================================
   V4 Philippe pass — nav morph, clearer sections, no crop
   ========================================================= */

/* stronger italic crop guard */
.hero-h1,.h2,.darkcta-h,.applycta-h,.guarantee-h,.manifesto-h,.promise-h,.formule h3,.bureau h2,.brandwall-h,
.section-head,.manifesto,.promise-left,.btease-card,.case-card,.review-card{
  overflow:visible;
}
.hl-out,.hl-out--ink,.hl-out--green,.hl-grad,.hero-h1-accent,
.h2 em,.manifesto-h em,.promise-h em,.applycta-h em,.darkcta-h em{
  display:inline-block;
  line-height:1.22;
  padding:.08em .12em .22em;
  margin:-.08em -.05em -.18em;
  overflow:visible;
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
  vertical-align:baseline;
}

/* sticky logo morph: vertical at rest, horizontal on scroll down */
.tdb-hdr{
  position:fixed;
  top:18px;
  left:0;
  right:0;
  width:min(100%,1328px);
  padding-left:clamp(20px,2.4vw,34px);
  padding-right:clamp(20px,2.4vw,34px);
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  margin-inline:auto;
  z-index:999;
  transform:none;
  transition:transform .35s cubic-bezier(.16,1,.3,1),background .35s,border-color .35s;
}
.tdb-logo--morph{
  position:relative;
  width:61px;
  height:81px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:width .55s cubic-bezier(.4,0,.2,1),height .55s cubic-bezier(.4,0,.2,1);
  overflow:visible;
}
.tdb-logo--morph .logo-frame{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:opacity .42s cubic-bezier(.4,0,.2,1),transform .55s cubic-bezier(.4,0,.2,1);
  transform-origin:center;
}
.tdb-logo--morph .logo-frame-v img{height:81px;width:auto}
.tdb-logo--morph .logo-frame-h{display:none}
.tdb-hdr.is-horizontal .tdb-logo--morph{width:145px;height:42px}
.tdb-hdr.is-horizontal .logo-frame-v{opacity:1;transform:none}
.tdb-hdr.is-horizontal .logo-frame-h{display:none}
.contact-tdb-btn{gap:9px}
.contact-tdb-btn .ph-logo{background:#fafaf8}
.contact-tdb-btn .ph-logo img{object-fit:contain;padding:6px}
.tdb-nav a[href="contact.html"]{display:none}
@media (max-width:780px){
  .tdb-hdr{top:12px;left:0;right:0;width:100%;padding-left:10px;padding-right:10px}
  .tdb-logo--morph{width:48px;height:60px}
  .tdb-logo--morph .logo-frame-v img{height:56px}
  .tdb-hdr.is-horizontal .tdb-logo--morph{width:104px;height:34px}
  .contact-tdb-btn .ph-txt{font-size:0}
  .contact-tdb-btn .ph-txt::after{content:"Contact";font-size:12px}
}

/* hero cards: straight, floated, video-driven */
.hero-cards-band{
  background:transparent;
  margin-top:0;
  padding:0 0 42px;
  position:relative;
  z-index:2;
}
.hero-cards-band::before{display:none}
.htrio-card,.htrio-card.tilt-l,.htrio-card.tilt-r{transform:none!important}
.htrio-card:hover,.htrio-card.tilt-l:hover,.htrio-card.tilt-r:hover{transform:translateY(-4px)!important}
.htrio-portrait .htrio-media{display:none}
.htrio-portrait .htrio-video{
  position:absolute;
  inset:0;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  object-fit:cover !important;
  filter:saturate(.95) contrast(1.05);
}
.htrio-portrait::after{
  content:"";
  position:absolute;
  inset:0;
  background:none !important;
  pointer-events:none;
}
.htrio-portrait .htrio-overlay{z-index:2}
.htrio-agenda-lines{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.htrio-agenda-lines div{
  display:grid;
  grid-template-columns:48px 1fr;
  gap:10px;
  align-items:center;
  font-size:12px;
}
.htrio-agenda-lines span{color:var(--muted);font-weight:800;font-variant-numeric:tabular-nums}
.htrio-agenda-lines b{
  padding:9px 11px;
  border-radius:12px;
  font-size:12px;
  color:var(--ink);
  background:rgba(10,10,10,.035);
  border:1px solid transparent;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}
.htrio-agenda-lines .is-booked{background:rgba(40,174,96,.13);border-color:transparent}
.htrio-agenda-lines .is-closed{background:rgba(40,174,96,.22);border-color:transparent}
.htrio-agenda-lines .is-open{background:rgba(10,10,10,.045);border-color:rgba(10,10,10,.08);border-style:solid;color:rgba(10,10,10,.74)}
.htrio-cal .htrio-cal-head .nav{
  border:1px solid rgba(10,10,10,.06);
  border-radius:999px;
  padding:5px 9px;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.1em;
}

/* === Pale premium variant (v1) for the "Centre d'appel · RDV bookés" card === */
.htrio-cal{
  background:#fafaf8;
  color:#0a0a0a;
  border:1px solid rgba(10,10,10,.05);
  border-radius:32px;
  box-shadow:0 20px 50px -20px rgba(0,0,0,.12);
}
.htrio-cal .htrio-eyebrow{color:rgba(10,10,10,.5);letter-spacing:.15em;font-weight:700;font-style:italic}
.htrio-cal .htrio-eyebrow .sq{background:#56b37f;box-shadow:none;border-radius:3px;width:10px;height:10px}
.htrio-cal .htrio-cal-head{margin-top:22px;align-items:center}
.htrio-cal .htrio-cal-head .month{
  color:#0a0a0a;font-weight:900;font-size:15px;letter-spacing:-.01em;
  text-transform:uppercase;
}
.htrio-cal .htrio-cal-head .nav{
  border:1px solid rgba(10,10,10,.1);
  background:transparent;
  color:rgba(10,10,10,.6);
  font-weight:700;
  border-radius:999px;
  padding:6px 12px;
  letter-spacing:.12em;
  white-space:nowrap;
  text-align:center;
  line-height:1.15;
  border-radius:16px;
}
.htrio-cal .htrio-agenda-lines span{color:rgba(10,10,10,.55);font-weight:700}
.htrio-cal .htrio-agenda-lines b{
  background:#1a1a1a;
  border:none;
  color:#fff;
  box-shadow:0 6px 14px -8px rgba(0,0,0,.3);
}
.htrio-cal .htrio-agenda-lines .is-booked{
  background:#1a1a1a;
  color:#fff;
}
.htrio-cal .htrio-agenda-lines .is-closed{
  background:#28ae60;
  color:#fff;
}
.htrio-cal .htrio-agenda-lines .is-open{
  background:rgba(10,10,10,.08);
  color:rgba(10,10,10,.4);
  box-shadow:none;
}
.htrio-cal .htrio-agenda-lines div:last-child b{
  background:#1a1a1a;
  color:#fff;
  box-shadow:0 8px 18px -6px rgba(0,0,0,.35);
}
.htrio-cal .htrio-agenda-lines div:last-child b.is-closed,
.htrio-cal .htrio-agenda-lines b.is-closed{
  background:#28ae60;
  color:#fff;
}
.htrio-cal .htrio-cal-result{
  background:#1a1a1a;
  border:none;
  color:#fff;
}
.htrio-cal .htrio-cal-result b{color:#fff}
.htrio-cal .htrio-cal-result span[style]{color:rgba(255,255,255,.55)!important}
.htrio-cal .htrio-cal-result .dot{
  background:#56b37f;
  box-shadow:0 0 0 4px rgba(86,179,127,.2);
}
.htrio-cal .htrio-cal-result .when{
  color:rgba(255,255,255,.5);
}

/* compact stat chip instead of long blue bar */
.stat-big-content{position:relative;padding-top:28px}
.stat-chip{
  position:absolute;
  top:0;
  right:0;
  width:auto;
  max-width:max-content;
  padding:9px 13px;
  background:#cef3fb;
  color:#0a0a0a;
}
@media (max-width:680px){.stat-chip{position:static;margin-bottom:12px}}

/* case strip replaces standalone logo row */
.trust-bar{padding:36px 0;background:var(--bg);border-top:0}
.trust-bar .wrap{align-items:stretch}
.trust-lbl{
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:900;
  align-self:center;
}
.mini-case-row{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:12px;flex:1}
.mini-case-row article{
  background:#fafaf8;
  border:1px solid var(--line);
  border-radius:18px;
  padding:16px;
  min-height:104px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.mini-case-row span{font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--muted)}
.mini-case-row b{font-size:clamp(24px,3vw,38px);line-height:.95;letter-spacing:-.04em;color:var(--ink)}
.mini-case-row small{font-size:12px;color:var(--muted);font-weight:700}
@media (max-width:900px){.mini-case-row{grid-template-columns:repeat(2,1fr);width:100%}}
@media (max-width:560px){.mini-case-row{grid-template-columns:1fr}.trust-bar .wrap{gap:14px}}

/* Notre formule · results strip replacing standalone trust logos */
.method-results-bar{
  padding:28px 0 42px !important;
  background:#f3f3f0 !important;
}
.method-results-bar .wrap{
  grid-template-columns:auto minmax(0,1fr) !important;
  align-items:center !important;
  gap:24px !important;
}
.method-results-bar .mini-case-row{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
}
@media (max-width:900px){
  .method-results-bar .wrap{
    grid-template-columns:1fr !important;
  }
  .method-results-bar .mini-case-row{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (max-width:560px){
  .method-results-bar .mini-case-row{
    grid-template-columns:1fr !important;
  }
}
.method-results-bar .trust-lbl{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:118px;
}
.method-results-bar .trust-lbl::before{
  content:"";
  width:9px;
  height:9px;
  border-radius:2px;
  background:var(--green);
  box-shadow:0 0 0 7px rgba(40,174,96,.12);
  flex-shrink:0;
}
body .method-results-bar .mini-case-row.method-case-row{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
}
@media (max-width:900px){
  body .method-results-bar .mini-case-row.method-case-row{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (max-width:560px){
  body .method-results-bar .mini-case-row.method-case-row{
    grid-template-columns:1fr !important;
  }
}
.method-results-bar .method-case-row{
  gap:18px !important;
}
body .method-results-bar .method-case-row article{
  position:relative;
  display:flex !important;
  flex-direction:column;
  justify-content:flex-start;
  gap:0 !important;
  aspect-ratio:1/1;
  min-height:0 !important;
  padding:28px !important;
  border-radius:28px !important;
  background:#0a0a0a !important;
  border:0 !important;
  box-shadow:0 22px 54px -42px rgba(0,0,0,.55) !important;
  overflow:hidden;
  text-align:left !important;
  transform:none !important;
}
body .method-results-bar .method-case-row article .result-cap{
  position:relative;
  padding:0;
  background:transparent;
  border:0;
  box-shadow:none;
  color:#fff;
}
body .method-results-bar .method-case-row article .result-cap .result-client{
  display:block;
  font-size:clamp(14px,1.35vw,20px);
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  letter-spacing:-.035em;
  color:#fff;
  font-weight:800;
  padding-bottom:14px;
  margin-bottom:16px;
  min-height:1.15em;
  border-bottom:1.5px dashed rgba(255,255,255,.22);
}

/* === Quelques résultats · marquee carousel ============================ */
.results-marquee-section{
  padding:32px 0 44px !important;
  background:#f3f3f0 !important;
}
.results-marquee{
  position:relative;
  width:100%;
  overflow:hidden;
  border-radius:0;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 8%,#000 92%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 8%,#000 92%,transparent 100%);
}
.results-track{
  display:flex;
  flex-wrap:nowrap;
  width:max-content;
  gap:22px;
  padding:6px 0;
  animation:results-marquee 48s linear infinite;
  will-change:transform;
}
.results-marquee-section .result-card{
  flex:0 0 auto;
  width:clamp(320px,26vw,400px);
  aspect-ratio:auto;
  min-height:0;
  padding:28px !important;
  border-radius:28px !important;
  background:#fafaf8 !important;
  border:1px solid rgba(10,10,10,.08) !important;
  box-shadow:0 22px 54px -42px rgba(0,0,0,.35) !important;
  overflow:hidden;
  text-align:left !important;
  display:flex !important;
  flex-direction:column;
  justify-content:flex-start;
  color:#0a0a0a;
}
.results-marquee-section .result-card .result-cap{
  position:relative;
  padding:0;
  background:transparent;
  border:0;
  box-shadow:none;
  color:#0a0a0a;
}
.results-marquee-section .result-card .result-client{
  display:block;
  font-size:clamp(20px,1.7vw,26px);
  line-height:1.1;
  letter-spacing:-.035em;
  color:#0a0a0a;
  font-weight:800;
  white-space:nowrap;
  overflow:visible;
  text-overflow:clip;
  padding-bottom:14px;
  margin-bottom:16px;
  border-bottom:1.5px dashed rgba(10,10,10,.18);
}
.results-marquee-section .result-card b{
  display:block;
  font-size:clamp(16px,1.2vw,19px);
  line-height:1.3;
  letter-spacing:-.02em;
  color:rgba(10,10,10,.82);
  font-weight:600;
}
.results-marquee-section .result-card span{
  display:block;
  margin-top:14px;
  color:rgba(10,10,10,.42);
  font-size:12px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  line-height:1.35;
}
@keyframes results-marquee{
  from{transform:translate3d(0,0,0);}
  to  {transform:translate3d(-50%,0,0);}
}
@media (prefers-reduced-motion:reduce){
  .results-track{animation:none;}
}
@media (max-width:560px){
  .results-marquee-section .result-card{
    width:78vw;
    min-height:0;
  }
}
body .method-results-bar .method-case-row article .result-cap b{
  display:block;
  font-size:clamp(18px,1.5vw,22px) !important;
  line-height:1.25;
  letter-spacing:-.035em;
  color:rgba(255,255,255,.92);
  font-weight:600;
}
body .method-results-bar .method-case-row article .result-cap span{
  display:block;
  margin-top:14px;
  color:rgba(255,255,255,.45);
  font-size:12px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  line-height:1.35;
}
body .method-results-bar .method-case-row article .case-title{
  font-size:22px;
  font-weight:700;
  letter-spacing:-.01em;
  text-transform:none;
  color:#fff !important;
}
body .method-results-bar .method-case-row article .case-metric{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:14px;
  margin-top:auto;
  margin-bottom:18px;
}
body .method-results-bar .method-case-row article .case-metric b{
  font-size:clamp(56px,5.2vw,76px) !important;
  line-height:.9;
  letter-spacing:-.04em;
  color:#fff !important;
  font-weight:700;
}
body .method-results-bar .method-case-row article .case-metric p{
  margin:0;
  font-size:15px;
  line-height:1.35;
  color:rgba(255,255,255,.82);
}
body .method-results-bar .method-case-row article .case-foot{
  border-top:1px solid rgba(255,255,255,.12);
  padding-top:14px;
  font-size:13px;
  color:rgba(255,255,255,.55);
}
@media (max-width:560px){
  body .method-results-bar .method-case-row article{aspect-ratio:auto;min-height:280px !important;}
}

/* case studies left + one vertical Google review slider right */
.case-review-layout{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);
  gap:24px;
  align-items:start;
}
.case-stack{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.case-stack .case-card{min-height:230px;margin:0}
.case-stack .case-card::before{display:none}
.case-stack .case-head{font-size:20px}
.google-slider{
  position:sticky;
  top:118px;
  min-height:560px;
  background:#fafaf8;
  color:var(--ink);
  border:1px solid var(--line);
  border-radius:34px;
  padding:24px;
  overflow:hidden;
  box-shadow:0 30px 70px -42px rgba(10,10,10,.35);
}
.google-slider::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(40,174,96,.08),transparent 48%);
  pointer-events:none;
}
.google-slider-top{position:relative;z-index:1;display:flex;align-items:center;gap:12px;margin-bottom:24px}
.google-slider-top .g-dot{width:34px;height:34px;display:grid;place-items:center;background:#fafaf8;border:1px solid var(--line);border-radius:50%;flex-shrink:0}
.google-slider-top b{display:block;font-size:14px;font-weight:900}
.google-slider-top small{display:block;font-size:11px;color:var(--muted);letter-spacing:.06em;text-transform:uppercase;font-weight:800}
.google-slider-top .stars{margin-left:auto;color:#f9b500;font-size:12px;letter-spacing:1px}
.gslides{position:relative;z-index:1;min-height:360px}
.gslide{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  opacity:0;
  transform:translateY(24px);
  transition:opacity .45s cubic-bezier(.4,0,.2,1),transform .45s cubic-bezier(.4,0,.2,1);
  pointer-events:none;
}
.gslide.is-active{opacity:1;transform:translateY(0);pointer-events:auto}
.gslide p{
  font-size:clamp(25px,3.1vw,43px);
  font-weight:900;
  line-height:1.03;
  letter-spacing:-.04em;
  max-width:11ch;
}
.gslide span{margin-top:24px;font-size:13px;font-weight:900;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.gslider-dots{position:relative;z-index:1;display:flex;gap:8px;margin-top:auto}
.gslider-dots span{width:24px;height:4px;border-radius:4px;background:rgba(10,10,10,.14)}
.gslider-dots span.is-active{background:var(--green)}
@media (max-width:980px){
  .case-review-layout{grid-template-columns:1fr}
  .google-slider{position:relative;top:auto;min-height:440px}
}
@media (max-width:640px){.case-stack{grid-template-columns:1fr}.google-slider{border-radius:24px}.gslide p{max-width:13ch}}

/* clearer before/after agenda */
.aa-card{overflow:visible}
.pipeline-chaos{
  position:relative;
  display:grid;
  gap:10px;
  margin:22px 0;
  padding-left:18px;
}
.chaos-line{position:absolute;left:6px;top:8px;bottom:8px;width:2px;background:repeating-linear-gradient(to bottom,rgba(10,10,10,.2) 0 8px,transparent 8px 14px)}
.chaos-item{
  position:relative;
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:13px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.58);
  border:1px solid rgba(10,10,10,.1);
  font-weight:900;
}
.chaos-item::before{content:"";position:absolute;left:-18px;top:50%;width:10px;height:10px;border-radius:50%;background:#c2410c;transform:translateY(-50%)}
.chaos-item.warn::before{background:#d19900}
.chaos-item span{font-size:14px;color:var(--ink)}
.chaos-item b{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.packed-agenda{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:8px;
  margin:22px 0;
}
.agenda-col{
  background:rgba(255,255,255,.64);
  border:1px solid rgba(10,10,10,.08);
  border-radius:16px;
  padding:10px;
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:0;
}
.agenda-col b{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.12em}
.agenda-col span{font-size:11px;font-weight:900;line-height:1.05;padding:10px 9px;border-radius:12px;background:rgba(40,174,96,.13);color:#0a0a0a}
.agenda-col .closed{background:var(--green);color:#fafaf8}
@media (max-width:700px){.packed-agenda{grid-template-columns:1fr}.agenda-col{display:grid;grid-template-columns:42px 1fr;align-items:center}.agenda-col span{grid-column:2}}

/* bureau carousel + map card */
.bureau-experience-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);gap:22px;align-items:stretch}
.bureau-experience-grid .bureau-carousel{margin:0}
.bureau-experience-grid .bureau-slide{min-height:560px}
.bureau-map-card{
  background:#0a0a0a;
  color:#fff;
  border-radius:32px;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:16px;
  overflow:hidden;
}
.mapbox-frame{
  position:relative;
  min-height:280px;
  border-radius:22px;
  overflow:hidden;
  background:#151a17;
  border:1px solid rgba(255,255,255,.1);
}
.map-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:34px 34px;opacity:.65}
.map-road{position:absolute;height:16px;background:#30352f;border:1px solid rgba(255,255,255,.08);border-radius:999px;box-shadow:0 0 0 8px rgba(255,255,255,.02)}
.map-road.r1{width:120%;left:-10%;top:54%;transform:rotate(-17deg)}
.map-road.r2{width:90%;right:-20%;top:35%;transform:rotate(39deg)}
.map-pin{
  position:absolute;
  left:52%;
  top:48%;
  width:42px;
  height:42px;
  border-radius:50% 50% 50% 0;
  background:var(--green);
  transform:rotate(-45deg);
  box-shadow:0 0 0 12px rgba(40,174,96,.18),0 16px 34px rgba(40,174,96,.35);
}
.map-pin span{position:absolute;inset:12px;border-radius:50%;background:#fafaf8}
.map-label{position:absolute;left:calc(52% + 40px);top:48%;background:#fafaf8;color:#0a0a0a;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:900}
.map-copy{padding:10px 6px 4px}
.map-copy .pill-section{background:rgba(40,174,96,.14);border-color:rgba(40,174,96,.28);color:var(--green-soft)}
.map-copy h3{font-size:clamp(24px,3vw,38px);line-height:1.02;letter-spacing:-.04em;margin-top:18px;max-width:13ch}
.map-copy p{color:rgba(255,255,255,.7);line-height:1.55;margin-top:16px;font-size:15px}
.map-copy address{font-style:normal;color:#fff;border-top:1px solid rgba(255,255,255,.12);padding-top:16px;margin-top:18px;font-weight:800;line-height:1.35}
@media (max-width:980px){.bureau-experience-grid{grid-template-columns:1fr}.bureau-experience-grid .bureau-slide{min-height:430px}}

/* team roles + stronger Slack channel */
.equipe{background:#0a0a0a;color:#fff;max-width:min(1240px,calc(100% - 56px));margin:16px auto;border-radius:32px;position:relative;overflow:hidden}
.equipe .lead{color:rgba(255,255,255,.7)}
.equipe .h2{color:#fafaf8}
.equipe .hl-out{-webkit-text-stroke:1.5px rgba(255,255,255,.55);color:transparent}
.team-roster{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12)}
.team-row{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09);border-radius:18px;padding:12px}
.team-avatar{width:44px;border-radius:14px;font-size:10px;letter-spacing:.04em}
.team-name{color:#fafaf8}
.team-role{color:rgba(255,255,255,.55)}
.slack-mock{
  background:#1b121f;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 30px 80px -44px rgba(0,0,0,.8);
}
.slack-mock::before{
  background:
    linear-gradient(90deg,rgba(76,40,92,.88) 0 112px,transparent 112px),
    linear-gradient(180deg,rgba(255,255,255,.08),transparent);
}
.slack-head{
  margin-left:104px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
}
.slack-msgs{margin-left:104px}
.slack-msg{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.075);border-radius:16px;padding:12px}
.slack-avatar{border-radius:10px}
.slack-tabs{margin-left:104px}
.slack-tabs button{min-height:36px}
@media (max-width:680px){.slack-head,.slack-msgs,.slack-tabs{margin-left:0}.slack-mock::before{display:none}.equipe{margin:10px;border-radius:24px}}

/* Slack readability pass — keep the auto-slide alive, but never let the active
   channel look disabled or buried under the purple housing. */
.slack-panel.is-active{
  opacity:1 !important;
  filter:none !important;
  animation:slackIn .18s cubic-bezier(.16,1,.3,1) both;
}
.slack-panel.is-active .slack-head,
.slack-panel.is-active .slack-msgs,
.slack-panel.is-active .slack-tabs{
  opacity:1 !important;
}
.slack-panel.is-active .slack-msg{
  background:rgba(255,255,255,.095);
  border-color:rgba(255,255,255,.14);
}
.slack-panel.is-active .slack-user{color:#fafaf8}
.slack-panel.is-active .slack-txt{color:rgba(255,255,255,.88)}
.slack-panel.is-active .slack-time{color:rgba(255,255,255,.58)}

/* old-school counter with a real housing */
.promise-band{background:#0a0a0a;color:#fff;border-radius:34px}
.promise-h{color:#fafaf8}
.promise-sub{color:rgba(255,255,255,.7)}
.counter-case{
  background:linear-gradient(180deg,#1d1d19,#090909);
  border:1px solid rgba(255,255,255,.13);
  border-radius:24px;
  padding:18px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 26px 58px -36px rgba(0,0,0,.9);
}
.counter-case::before{
  content:"";
  position:absolute;
  inset:10px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  pointer-events:none;
}
.old-counter .flap{
  background:linear-gradient(180deg,#2b2b26 0%,#10100f 49%,#050505 50%,#171713 100%);
  color:#f4f4ef;
  border:1px solid rgba(255,255,255,.16);
  text-shadow:0 2px 0 rgba(0,0,0,.75);
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.08),inset 0 1px 0 rgba(255,255,255,.16),0 12px 22px rgba(0,0,0,.35);
}
.old-counter .flap::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(0,0,0,.88);box-shadow:0 -1px 0 rgba(255,255,255,.08)}
.promise-caption{color:rgba(255,255,255,.62)}

/* darker manifesto with bigger type punch */
.cestquoi--dark{background:#0a0a0a;color:#fff;max-width:min(1240px,calc(100% - 56px));margin:16px auto;border-radius:32px;overflow:hidden}
.cestquoi--dark .manifesto{background:transparent;border-color:rgba(255,255,255,.11);box-shadow:none;padding:clamp(40px,7vw,86px)}
.cestquoi--dark .pill-section{background:rgba(40,174,96,.14);border-color:rgba(40,174,96,.28);color:var(--green-soft)}
.cestquoi--dark .manifesto-h{color:#fff;font-size:clamp(38px,6.4vw,88px);max-width:920px}
.cestquoi--dark .manifesto-h .hl-out{-webkit-text-stroke:1.5px rgba(255,255,255,.55);color:transparent}
.cestquoi--dark .manifesto-p{color:rgba(255,255,255,.72);font-size:18px;max-width:760px}
.manifesto-punch{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.manifesto-punch span{border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:10px 14px;color:#fff;font-size:13px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;background:rgba(255,255,255,.055)}

/* final CTA phone form mock */
.phone-form-mock{position:relative;min-height:694px;display:grid;place-items:center}
.phone-shell{
  position:relative;
  width:min(378px,100%);
  padding:15px;
  border-radius:52px;
  background:
    linear-gradient(145deg,#343229,#050505);
  box-shadow:
    0 54px 120px -50px rgba(0,0,0,.98),
    0 0 0 1px rgba(255,255,255,.08),
    inset 0 0 0 1px rgba(255,255,255,.16);
  transform:rotate(2deg) translateY(6px);
  z-index:2;
}
.phone-shell::before{
  content:"";
  position:absolute;
  inset:-18px;
  border-radius:62px;
  border:1px solid rgba(40,174,96,.18);
  transform:rotate(-3deg);
  pointer-events:none;
}
.phone-notch{position:absolute;top:25px;left:50%;width:102px;height:24px;border-radius:999px;background:#050505;transform:translateX(-50%);z-index:3}
.phone-screen{
  min-height:602px;
  border-radius:38px;
  background:
    radial-gradient(circle at 100% 0,rgba(40,174,96,.13),transparent 30%),
    linear-gradient(180deg,#f7f5ec,#e9e3d3);
  color:#0a0a0a;
  padding:66px 19px 22px;
  overflow:hidden;
}
.phone-top{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:10px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--muted)}
.phone-badge{display:flex;gap:6px;align-items:center}
.phone-progress{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px;margin:16px 0}
.phone-progress span{height:5px;border-radius:5px;background:rgba(10,10,10,.13)}
.phone-progress span:first-child{background:var(--green)}
.phone-screen h3{font-size:24px;line-height:1.02;letter-spacing:-.04em;margin:18px 0 16px}
.phone-options{display:grid;gap:8px}
.phone-options span,.phone-form-fields span{
  display:block;
  border:1px solid rgba(10,10,10,.1);
  background:#fafaf8;
  border-radius:16px;
  padding:13px 14px;
  font-size:13px;
  font-weight:900;
  cursor:pointer;
}
.phone-options .is-selected{border-color:var(--green);box-shadow:0 0 0 4px rgba(40,174,96,.12)}
.phone-form-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}
.phone-form-fields span{color:rgba(10,10,10,.36)}
.phone-submit{display:flex;justify-content:center;align-items:center;height:48px;border-radius:999px;background:var(--green);color:#fff;font-weight:900;text-decoration:none}
.phone-shadow-card{position:absolute;z-index:1;background:#fafaf8;color:#0a0a0a;border:1px solid var(--line);box-shadow:0 22px 54px -34px rgba(0,0,0,.6);border-radius:18px;padding:13px 15px;font-size:12px;font-weight:900}
.phone-shadow-card.card-a{left:-12px;top:88px;transform:rotate(-5deg)}
.phone-shadow-card.card-b{right:-20px;bottom:118px;transform:rotate(5deg);background:#cef3fb}
.phone-brand-card{
  position:absolute;
  right:4px;
  top:18px;
  z-index:3;
  display:flex;
  flex-direction:column;
  gap:3px;
  min-width:128px;
  padding:14px 16px;
  border-radius:20px;
  background:#fafaf8;
  color:#0a0a0a;
  border:1px solid rgba(255,255,255,.7);
  box-shadow:0 24px 70px -34px rgba(0,0,0,.75);
  transform:rotate(5deg);
}
.phone-brand-card span{font-size:10px;text-transform:uppercase;letter-spacing:.1em;font-weight:900;color:var(--muted)}
.phone-brand-card b{font-size:26px;line-height:.9;letter-spacing:-.06em}
.applycta-proof-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:2px}
.applycta-proof-row span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.055);
  color:rgba(255,255,255,.82);
  border-radius:999px;
  padding:10px 13px;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.07em;
}
@media (max-width:980px){.phone-form-mock{min-height:560px}.phone-shell{transform:none}.phone-screen{min-height:520px}}

/* text replacements safety */
.bookcta-foot .live,.bookcta-foot .pulse{display:none!important}

/* Philippe micro-fix — beige panels in the 100M stat need more definition */
.stat-big-panels .p{
  border:1px solid rgba(10,10,10,.075);
  outline:1px solid rgba(255,255,255,.72);
  box-shadow:
    0 26px 54px rgba(60,55,40,.18),
    inset 0 1px 0 rgba(255,255,255,.82),
    inset 0 -1px 0 rgba(10,10,10,.045);
}
.stat-big-panels .p1{
  background:linear-gradient(160deg,#e9e3d5 0%,#d2cab9 100%) !important;
  opacity:.98 !important;
}
.stat-big-panels .p2{
  background:linear-gradient(155deg,#e3dece 0%,#cfc6b3 100%) !important;
  opacity:.82 !important;
}
.stat-big-panels .p3{
  background:linear-gradient(155deg,#ddd6c4 0%,#c9bea9 100%) !important;
  opacity:.62 !important;
}

/* Philippe micro-fix — formula step numbers should never crop, especially 03 */
.formule-card{
  overflow:visible !important;
}
.formule-num{
  min-width:clamp(150px,10.5vw,210px);
  padding-right:.18em;
  margin-right:-.08em;
  line-height:.96 !important;
}
.formule-num span{
  display:block;
  padding-right:.12em;
}
@media (max-width:980px){
  .formule-num{
    min-width:clamp(92px,22vw,132px);
    padding-right:.1em;
  }
}

/* =========================================================
   V5 Philippe pass — final requested round
   ========================================================= */

/* universal crop guard for italic display + numbers */
.hero-h1,
.hero-h1 *,
.h2,
.h2 *,
.case-num,
.case-num *,
.formule-num,
.formule-num *,
.promise-counter,
.promise-counter *,
.stat-big .num,
.stat-big .num *,
.phone-screen h3,
.manifesto-h,
.applycta-h,
.darkcta-h,
.guarantee-h{
  overflow:visible !important;
  line-height:1.13;
}
.hl-grad,
.hl-out,
.hl-out--ink,
.hl-out--green,
.hero-h1-accent,
.hero-word-outline{
  padding-bottom:.22em;
  margin-bottom:-.16em;
}

/* navbar CTA face */
.contact-tdb-btn .ph-face{
  background:#fafaf8;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.45);
}
.contact-tdb-btn .ph-face img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 20%;
  padding:0;
}

/* hero typography: more style-guide leverage without changing the promise */
.hero-h1{
  letter-spacing:-.075em;
  line-height:.9 !important;
  max-width:950px;
}
.hero-word-outline{
  color:transparent;
  -webkit-text-stroke:2px rgba(255,255,255,.72);
  text-stroke:2px rgba(255,255,255,.72);
  font-style:italic;
  font-weight:500;
  transform:skewX(-5deg);
}
.hero-h1-accent{
  background:linear-gradient(135deg,var(--green),var(--green-soft));
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  line-height:1.02 !important;
}
.hero-keep{
  display:inline;
}
.htrio-portrait{
  background:#0a0a0a;
}
.htrio-video{
  object-position:center;
}
.htrio-portrait{
  border-color:transparent !important;
  border-width:0 !important;
  outline:0 !important;
}
.htrio-portrait::before{
  box-shadow:none !important;
}

/* formula visual upgrades */
.formule-lead-visual{
  background:radial-gradient(circle at 25% 10%,rgba(40,174,96,.35),transparent 38%),#101412;
}
.formule-lead-visual img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  filter:saturate(1.05) contrast(1.05);
}
.formule-img video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
#tdb-lp .formule-img video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* case studies + vertical review rail */
.case-card--cta{
  background:#0a0a0a;
  color:#fff;
}
.case-card--cta .client,
.case-card--cta .case-head{color:#fafaf8}
.case-card--cta .btn-pill{
  width:max-content;
  margin-top:auto;
  color:#fff;
}
.reviews-vertical{
  position:sticky;
  top:118px;
  align-self:start;
  height:520px;
  min-height:0;
  max-height:520px;
  background:#fafaf8;
  color:var(--ink);
  border:1px solid var(--line);
  border-radius:34px;
  padding:22px;
  overflow:hidden;
  box-shadow:0 30px 70px -42px rgba(10,10,10,.35);
  display:flex;
  flex-direction:column;
}
.review-rail{
  position:relative;
  flex:1;
  height:auto;
  min-height:0;
  overflow:hidden;
}
.review-rail{
  -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 10%,#000 90%,transparent 100%);
  mask-image:linear-gradient(180deg,transparent 0%,#000 10%,#000 90%,transparent 100%);
}
.review-column{
  display:grid;
  gap:12px;
  animation:reviewDrift 26s linear infinite;
}
/* keep animation running on hover */
.review-mini{
  position:relative;
  border:1px solid rgba(10,10,10,.105);
  border-radius:22px;
  padding:16px;
  background:
    radial-gradient(circle at 94% 12%,rgba(40,174,96,.1),transparent 28%),
    linear-gradient(180deg,#fafaf8,#f8f8f3);
  box-shadow:0 16px 34px -30px rgba(10,10,10,.45);
  overflow:hidden;
}
.review-mini::before{
  content:"";
  position:absolute;
  left:0;
  top:18px;
  bottom:18px;
  width:4px;
  border-radius:0 999px 999px 0;
  background:var(--green);
}
.review-mini-top{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:13px;
}
.review-avatar{
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:linear-gradient(135deg,var(--green),var(--green-soft));
  color:#fff;
  font-size:14px;
  font-weight:900;
  box-shadow:0 10px 22px -14px rgba(40,174,96,.8);
}
.review-mini-top b{
  display:block;
  font-size:14px;
  font-weight:900;
  letter-spacing:-.015em;
  color:var(--ink);
}
.review-mini-top small{
  display:block;
  margin-top:2px;
  color:#f7b500;
  letter-spacing:.05em;
  font-size:11px;
  line-height:1;
}
.review-mini p{
  font-size:clamp(15px,1.25vw,19px);
  font-weight:900;
  line-height:1.15;
  letter-spacing:-.025em;
  color:var(--ink);
  max-width:100%;
}
.review-mini-foot{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top:14px;
  padding-top:11px;
  border-top:1px solid rgba(10,10,10,.08);
}
.review-mini-foot span{
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.075em;
}
@keyframes reviewDrift{
  from{transform:translateY(0)}
  to{transform:translateY(-50%)}
}

/* bureau carousel: one clean image at a time, no peeking/black bar */
.bureau-track{
  position:relative !important;
  display:block !important;
  overflow:hidden !important;
  min-height:560px;
  border-radius:32px;
  background:#0a0a0a;
}
.bureau-slide{
  position:absolute !important;
  inset:0;
  min-width:0 !important;
  min-height:100% !important;
  width:100% !important;
  opacity:0;
  transform:scale(1.025);
  transition:opacity .65s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1);
  pointer-events:none;
}
.bureau-slide.is-active{
  opacity:1;
  transform:scale(1);
  pointer-events:auto;
}
.bureau-slide img{
  width:100%;
  height:100%;
  min-height:560px;
  object-fit:cover;
}
.bureau-slide figcaption{
  position:absolute;
  left:18px;
  bottom:18px;
  background:rgba(255,255,255,.92);
  color:#0a0a0a;
  border:1px solid rgba(255,255,255,.5);
  border-radius:999px;
  padding:10px 14px;
  font-size:12px;
  font-weight:900;
  backdrop-filter:blur(10px);
}
.bureau-dots{
  position:absolute;
  bottom:18px;
  right:18px;
  z-index:5;
  background:rgba(10,10,10,.45);
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  padding:8px;
  backdrop-filter:blur(10px);
}
.tdb-map{
  min-height:320px;
  background:#151a17;
}
.tdb-map .mapboxgl-ctrl-logo,
.tdb-map .mapboxgl-ctrl-attrib{display:none!important}
.tdb-map-marker{
  width:46px;
  height:46px;
  border-radius:50% 50% 50% 0;
  background:var(--green);
  transform:rotate(-45deg);
  box-shadow:0 0 0 12px rgba(40,174,96,.18),0 18px 38px rgba(40,174,96,.38);
}
.tdb-map-marker span{
  position:absolute;
  inset:13px;
  border-radius:50%;
  background:#fafaf8;
}

/* dark section rhythm: team full bleed, promise light */
.equipe{
  max-width:min(1240px,calc(100% - 56px));
  width:auto;
  margin:16px auto;
  border-radius:32px;
  background:
    radial-gradient(circle at 14% 20%,rgba(40,174,96,.18),transparent 26%),
    linear-gradient(180deg,#0d0d0a,#050505) !important;
}
.equipe::after{
  content:"";
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:linear-gradient(180deg,rgba(0,0,0,.9),transparent 75%);
  pointer-events:none;
}
.equipe .wrap{
  position:relative;
  z-index:1;
}
.equipe-grid{
  align-items:stretch;
}
.equipe-layout{
  display:grid;
  grid-template-columns:1.05fr 1fr;
  gap:48px;
  align-items:start;
}
.equipe-layout .section-head{margin-bottom:0}
.equipe-layout .section-head .left{max-width:none}
.equipe-stack{
  display:flex;
  flex-direction:column;
  gap:20px;
  min-width:0;
}
.equipe-stack .team-roster,
.equipe-stack .slack-mock{width:100%;margin:0}
@media (max-width:980px){
  .equipe-layout{grid-template-columns:1fr;gap:32px}
}
.slack-mock{
  position:relative;
  display:grid;
  grid-template-columns:188px minmax(0,1fr);
  gap:0;
  padding:0 !important;
  overflow:hidden;
  background:#111114 !important;
  border:1px solid rgba(255,255,255,.05) !important;
  border-radius:20px;
  box-shadow:0 32px 64px -16px rgba(0,0,0,.6);
  font-family:'Inter',system-ui,sans-serif;
}
.slack-mock::before{
  display:none !important;
}
.slack-sidebar{
  background:#16161a;
  border-right:1px solid rgba(255,255,255,.05);
  color:#fff;
  padding:20px 14px;
  min-height:100%;
  display:flex;
  flex-direction:column;
  gap:22px;
}
.slack-workspace{
  font-size:17px;
  font-weight:800;
  letter-spacing:-.02em;
  margin:0;
  display:flex;
  align-items:center;
  gap:10px;
}
.slack-workspace::before{
  content:"T";
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;height:28px;
  border-radius:8px;
  background:var(--green);
  color:#0a0a0c;
  font-weight:800;
  font-size:14px;
  letter-spacing:0;
}
.slack-side-label{
  margin:0 0 10px;
  padding:0 10px;
  font-size:10px;
  font-weight:800;
  color:rgba(255,255,255,.32);
  text-transform:uppercase;
  letter-spacing:.15em;
}
.slack-sidebar button,
.slack-process{
  display:block;
  width:100%;
  text-align:left;
  border-radius:10px;
  padding:8px 12px;
  color:rgba(203,213,225,.7);
  font-size:13px;
  font-weight:500;
  background:transparent;
  border:0;
  transition:background .2s ease,color .2s ease;
  margin-bottom:2px;
}
.slack-sidebar button:hover{
  background:rgba(255,255,255,.05);
  color:#fff;
}
.slack-sidebar button.is-active{
  background:color-mix(in oklab,var(--green) 12%,transparent);
  color:var(--green);
  font-weight:600;
}
.slack-process{
  display:inline-flex !important;
  align-items:center;
  gap:8px;
  width:auto !important;
  padding:8px 12px !important;
  border-radius:12px;
  background:color-mix(in oklab,var(--green) 5%,transparent);
  border:1px solid color-mix(in oklab,var(--green) 20%,transparent);
  color:var(--green);
  font-size:12px;
  font-weight:600;
}
.slack-slides{
  position:relative;
  min-height:420px;
  padding:22px;
  background:#111114;
}
.slack-head,
.slack-msgs,
.slack-tabs{
  margin-left:0 !important;
}
.slack-head{
  border-bottom:1px solid rgba(255,255,255,.05);
  padding:0 0 16px;
  margin-bottom:20px;
}
.slack-channel{font-weight:600;font-size:15px}
.slack-channel::before{color:rgba(148,163,184,.6);font-weight:500;margin-right:2px}
.slack-presence{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:rgba(148,163,184,.7)}
.slack-msgs{gap:14px}
.slack-msg{
  background:rgba(255,255,255,.02) !important;
  border:1px solid rgba(255,255,255,.05) !important;
  border-radius:16px !important;
  padding:14px !important;
  gap:12px !important;
  align-items:flex-start;
  transition:border-color .3s ease;
}
.slack-msg:hover{border-color:rgba(255,255,255,.1) !important}
.slack-avatar{
  width:36px !important;
  height:36px !important;
  border-radius:12px !important;
  font-size:12px;
  color:#0a0a0c !important;
  box-shadow:0 8px 20px -8px rgba(0,0,0,.4);
}
.slack-avatar.g{background:var(--green) !important}
.slack-avatar.o{background:#f59e0b !important}
.slack-avatar.p{background:#a78bfa !important}
.slack-user{font-weight:700;font-size:14px}
.slack-time{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:rgba(148,163,184,.55);font-weight:500}
.slack-txt{color:rgba(203,213,225,.85);line-height:1.55;font-size:13.5px}
.slack-txt em{
  display:inline-block;
  padding:2px 8px;
  border-radius:6px;
  background:color-mix(in oklab,var(--green) 12%,transparent);
  border:1px solid color-mix(in oklab,var(--green) 22%,transparent);
  color:var(--green);
  font-style:normal;
  font-weight:600;
}
.slack-tabs{
  display:none !important;
}

.promesse-section{
  background:#f4f1e8;
}
.promesse-section .promise-band{
  background:
    radial-gradient(circle at 82% 7%,rgba(40,174,96,.28),transparent 32%),
    radial-gradient(circle at 10% 100%,rgba(255,255,255,.08),transparent 30%),
    linear-gradient(135deg,#181713 0%,#0c0c09 58%,#050505 100%) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 38px 100px -58px rgba(10,10,10,.78);
}
.promesse-section .promise-h{color:#fafaf8}
.promesse-section .promise-sub{color:rgba(255,255,255,.72)}
.promesse-section .promise-caption{color:rgba(255,255,255,.64) !important}
.tv-countdown{
  position:relative;
  transform:rotate(1.5deg);
}
.tv-antennas{
  position:absolute;
  left:50%;
  top:-72px;
  width:150px;
  height:82px;
  transform:translateX(-50%);
  z-index:0;
}
.tv-antennas span{
  position:absolute;
  bottom:0;
  width:4px;
  height:88px;
  background:#0a0a0a;
  border-radius:999px;
  transform-origin:bottom;
}
.tv-antennas span:first-child{left:42px;transform:rotate(-28deg)}
.tv-antennas span:last-child{right:42px;transform:rotate(28deg)}
.tv-case{
  position:relative;
  z-index:1;
  min-height:268px;
  border-radius:42px 36px 40px 42px !important;
  padding:42px 116px 34px 30px !important;
  background:
    radial-gradient(circle at 80% 20%,rgba(255,255,255,.14),transparent 20%),
    linear-gradient(145deg,#383328,#090909) !important;
  border:10px solid #201b13 !important;
  box-shadow:
    0 34px 70px -36px rgba(0,0,0,.95),
    inset 0 0 0 2px rgba(255,255,255,.08);
}
.tv-case::before{
  content:"";
  position:absolute;
  inset:22px 106px 22px 22px;
  border-radius:28px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,0)),
    radial-gradient(circle at 50% 20%,rgba(40,174,96,.12),transparent 45%),
    #11110f;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:inset 0 0 34px rgba(0,0,0,.72);
  pointer-events:none;
}
.tv-case::after{
  content:"";
  position:absolute;
  right:30px;
  top:50%;
  width:54px;
  height:136px;
  border-radius:28px;
  transform:translateY(-50%);
  background:
    radial-gradient(circle at 50% 24%,#6a5c45 0 10%,#15130f 12% 24%,transparent 25%),
    radial-gradient(circle at 50% 72%,#6a5c45 0 10%,#15130f 12% 24%,transparent 25%),
    linear-gradient(180deg,#2d271d,#110f0c);
  border:1px solid rgba(255,255,255,.08);
}
.tv-noise{
  position:absolute;
  inset:18px;
  border-radius:22px;
  opacity:.08;
  background-image:repeating-linear-gradient(0deg,#fafaf8 0 1px,transparent 1px 3px);
  pointer-events:none;
}
.tv-countdown .promise-counter{
  position:relative;
  z-index:1;
  gap:10px;
}
.tv-countdown .flap{
  min-width:82px;
}

/* compact manifesto so brand section stays the dark hero moment */
.cestquoi--compact{
  background:#f7f4ea !important;
  color:#0a0a0a !important;
  margin:0 !important;
  border-radius:0 !important;
  padding:56px 0;
}
.cestquoi--compact .manifesto{
  background:#fafaf8;
  border:1px solid var(--line);
  box-shadow:0 30px 70px -52px rgba(10,10,10,.32);
  padding:clamp(28px,5vw,54px);
}
.cestquoi--compact .manifesto-h{
  font-size:clamp(36px,5.8vw,76px);
  max-width:780px;
}
.cestquoi--compact .manifesto-p{
  color:var(--muted);
}
.cestquoi--compact .manifesto-punch span{
  color:#0a0a0a;
  border-color:rgba(10,10,10,.12);
  background:#f4f4ef;
}

/* final CTA closer to the brand-system dark section */
.applycta{
  background:#0a0a0a;
  color:#fff;
  position:relative;
  overflow:hidden;
}
.applycta::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 12% 18%,rgba(40,174,96,.2),transparent 26%),
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:auto,34px 34px,34px 34px;
  pointer-events:none;
}
.applycta .wrap{position:relative;z-index:1}
.applycta-band{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

@media (max-width:980px){
  .reviews-vertical{position:relative;top:auto;height:auto;max-height:none;min-height:420px}
  .review-rail{height:460px;min-height:0}
  .slack-mock{grid-template-columns:1fr}
  .slack-sidebar{min-height:auto}
  .bureau-track,
  .bureau-slide img{min-height:430px}
}
@media (max-width:640px){
  .hero-h1{letter-spacing:-.06em;font-size:clamp(40px,13vw,54px)}
  .hero-keep{display:block;font-size:.86em;line-height:.96}
  .hero-word-outline{-webkit-text-stroke:1.3px rgba(255,255,255,.72)}
  .tv-countdown{transform:none}
  .tv-countdown .flap{min-width:64px}
  .tv-case{padding:28px 20px 28px !important;min-height:0 !important}
  .tv-case::before{inset:14px}
  .tv-case::after{display:none}
  .tv-antennas{top:-56px;transform:translateX(-50%) scale(.75)}
}

/* ===================== REVIEW DESIGN OPTIONS PREVIEW ===================== */
.review-options-page{
  min-height:100vh;
  background:#f4f1e8;
  color:var(--ink);
  padding:120px 0 80px;
}
.review-options-hero{
  display:flex;
  justify-content:space-between;
  gap:32px;
  align-items:flex-end;
  margin-bottom:34px;
}
.review-options-title{
  font-size:clamp(44px,7vw,104px);
  line-height:.9;
  letter-spacing:-.06em;
  text-transform:uppercase;
  max-width:840px;
}
.review-options-title em{
  font-family:Georgia,'Times New Roman',serif;
  font-style:italic;
  font-weight:400;
  text-transform:none;
  letter-spacing:-.05em;
}
.review-options-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.review-option{
  min-height:650px;
  border-radius:34px;
  border:1px solid rgba(10,10,10,.1);
  background:#fafaf8;
  overflow:hidden;
  position:relative;
  padding:22px;
  box-shadow:0 30px 80px -58px rgba(10,10,10,.48);
}
.review-option.dark{
  background:
    radial-gradient(circle at 12% 12%,rgba(40,174,96,.22),transparent 28%),
    linear-gradient(180deg,#11110e,#050505);
  color:#fff;
  border-color:rgba(255,255,255,.1);
}
.review-option-label{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:18px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
}
.review-option.dark .review-option-label{color:rgba(255,255,255,.58)}
.review-option-label b{color:var(--green);font-size:13px}
.or-card{
  border-radius:24px;
  background:#fafaf8;
  border:1px solid rgba(10,10,10,.1);
  padding:18px;
  box-shadow:0 20px 48px -36px rgba(10,10,10,.55);
}
.or-card-top{display:flex;align-items:center;gap:11px;margin-bottom:13px}
.or-avatar{
  width:38px;
  height:38px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--green);
  color:#fff;
  font-weight:950;
}
.or-card-top b{display:block;font-size:14px;line-height:1}
.or-card-top small{display:block;margin-top:4px;color:#f9b500;font-size:11px;letter-spacing:1px}
.or-card p{font-size:17px;line-height:1.32;font-weight:750;letter-spacing:-.02em}
.or-foot{display:flex;justify-content:space-between;margin-top:16px;font-size:10px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);font-weight:900}
.option-receipts .receipt-stack{position:relative;height:560px}
.option-receipts .or-card{position:absolute;width:82%}
.option-receipts .r1{left:10%;top:16px;transform:rotate(-3deg)}
.option-receipts .r2{left:2%;top:170px;transform:rotate(2deg)}
.option-receipts .r3{right:3%;top:328px;transform:rotate(-1.5deg)}
.option-receipts .or-card::after{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  bottom:-8px;
  height:8px;
  background:repeating-linear-gradient(90deg,transparent 0 8px,#fafaf8 8px 16px);
}
.option-stack .stack-stage{height:560px;display:grid;place-items:center;position:relative}
.option-stack .or-card{position:absolute;width:min(390px,86%);transition:transform .3s}
.option-stack .s1{transform:translateY(-112px) scale(.9);opacity:.56}
.option-stack .s2{transform:translateY(-42px) scale(.95);opacity:.82}
.option-stack .s3{transform:translateY(44px) scale(1.03);z-index:3;border-color:rgba(40,174,96,.35);box-shadow:0 34px 80px -42px rgba(40,174,96,.5)}
.option-stack .s4{transform:translateY(160px) scale(.94);opacity:.72}
.option-phone .phone-review-shell{
  width:310px;
  height:585px;
  margin:8px auto 0;
  border-radius:46px;
  background:#050505;
  padding:14px;
  box-shadow:0 36px 90px -46px rgba(0,0,0,.85);
  transform:rotate(-2deg);
}
.phone-review-screen{
  height:100%;
  border-radius:34px;
  padding:54px 16px 18px;
  background:#f4f1e8;
  overflow:hidden;
}
.google-profile{
  display:flex;
  align-items:center;
  gap:10px;
  border-bottom:1px solid rgba(10,10,10,.1);
  padding-bottom:14px;
  margin-bottom:14px;
}
.google-g{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#fafaf8;border:1px solid var(--line);font-weight:950;color:#4285f4}
.google-profile b{display:block;font-size:15px}
.google-profile small{display:block;color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase}
.phone-review-screen .or-card{box-shadow:none;margin-bottom:10px;padding:14px;border-radius:18px}
.phone-review-screen .or-card p{font-size:14px}
.option-spotlight{padding:28px}
.spotlight-stars{color:#f9b500;font-size:18px;letter-spacing:3px;margin:90px 0 20px}
.spotlight-quote{
  font-size:clamp(34px,4.5vw,66px);
  line-height:.94;
  letter-spacing:-.055em;
  font-weight:950;
  max-width:9ch;
}
.spotlight-person{
  position:absolute;
  left:30px;
  bottom:30px;
  display:flex;
  align-items:center;
  gap:12px;
}
.spotlight-person .or-avatar{background:#fafaf8;color:#0a0a0a}
.spotlight-person b{display:block}
.spotlight-person span{display:block;font-size:12px;color:rgba(255,255,255,.58);font-weight:800}
.spotlight-dock{
  position:absolute;
  right:24px;
  bottom:24px;
  display:grid;
  gap:10px;
}
.spotlight-dock span{
  width:54px;
  height:54px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
  font-weight:950;
}
@media (max-width:980px){
  .review-options-hero{display:block}
  .review-options-grid{grid-template-columns:1fr}
}

/* ===================== APPLY CTA · IMAGE DE MARQUE TREATMENT ===================== */
.applycta{
  padding:96px 0 88px !important;
  background:#0a0a0a !important;
  color:#fff;
  position:relative;
  overflow:hidden;
}
.applycta::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:34px 34px;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.95),transparent 88%);
  mask-image:linear-gradient(180deg,rgba(0,0,0,.95),transparent 88%);
  pointer-events:none;
}
.applycta::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 14% 14%,rgba(40,174,96,.19),transparent 28%),
    radial-gradient(circle at 78% 42%,rgba(40,174,96,.13),transparent 28%),
    linear-gradient(90deg,rgba(255,255,255,.05),transparent 55%);
  pointer-events:none;
}
.applycta .wrap{
  position:relative;
  z-index:1;
}
.applycta-band{
  display:grid;
  grid-template-columns:minmax(0,.98fr) minmax(360px,1.02fr);
  gap:clamp(42px,7vw,92px);
  align-items:center;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
}
.applycta-band::before{
  display:none !important;
}
.applycta-content{
  max-width:660px;
}
.applycta .pill-section{
  background:rgba(40,174,96,.18);
  color:var(--green-soft);
  border:1px solid rgba(40,174,96,.32);
}
.applycta .pill-section .sq{
  background:var(--green);
}
.applycta-h{
  margin-top:22px;
  font-size:clamp(44px,6.5vw,88px);
  line-height:.92;
  letter-spacing:-.065em;
  max-width:10.4ch;
  color:#fff;
}
.applycta-h .hl-grad{
  display:inline-block;
  padding-right:.08em;
  background:linear-gradient(135deg,var(--green),var(--green-soft));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  font-style:italic;
}
.applycta-sub{
  max-width:560px;
  color:rgba(255,255,255,.66);
  font-size:18px;
  line-height:1.55;
}
.applycta-proof-row span{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.13);
  color:rgba(255,255,255,.82);
}
.applycta-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}
.phone-form-mock{
  min-height:660px;
  display:grid;
  place-items:center;
  position:relative;
  isolation:isolate;
}
.phone-form-mock::before{
  content:"";
  position:absolute;
  width:min(430px,82%);
  height:88%;
  right:7%;
  top:6%;
  border-radius:58px;
  background:
    radial-gradient(circle at 50% 16%,rgba(40,174,96,.16),transparent 30%),
    rgba(40,174,96,.055);
  border:1px solid rgba(40,174,96,.16);
  box-shadow:0 0 95px rgba(40,174,96,.12);
  z-index:-2;
}
.phone-form-mock::after{
  content:"";
  position:absolute;
  width:330px;
  height:330px;
  right:4%;
  bottom:0;
  border-radius:50%;
  background:rgba(40,174,96,.15);
  filter:blur(70px);
  z-index:-3;
}
.phone-shell{
  width:min(342px,88vw);
  padding:13px;
  border-radius:46px;
  background:
    linear-gradient(145deg,#262626,#050505 62%),
    #050505;
  box-shadow:
    0 44px 95px -44px rgba(0,0,0,.95),
    0 0 0 1px rgba(255,255,255,.12) inset,
    0 0 0 7px rgba(255,255,255,.035);
  transform:rotate(1.5deg) translateY(6px);
  transform-origin:50% 64%;
}
.applycta .phone-form-mock .phone-shadow-card.card-a,
.applycta .phone-form-mock .phone-shadow-card.card-b{
  z-index:7 !important;
}
.applycta .phone-form-mock .phone-brand-card.card-c{
  z-index:8 !important;
}
.applycta .phone-form-mock .phone-shell{
  position:relative;
  z-index:3 !important;
}
.phone-shell::before{
  display:none;
}
.phone-notch{
  top:25px;
  width:92px;
  height:24px;
  background:#050505;
  box-shadow:0 0 0 1px rgba(255,255,255,.08);
}
.phone-screen{
  min-height:575px;
  border-radius:36px;
  padding:28px 20px 20px;
  background:
    radial-gradient(circle at 50% 5%,rgba(40,174,96,.16),transparent 24%),
    linear-gradient(180deg,#10110f,#050505 74%);
  color:#fff;
  display:flex;
  flex-direction:column;
  gap:14px;
  overflow:hidden;
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset;
}
.phone-status{
  display:flex;
  align-items:center;
  gap:5px;
  min-height:18px;
  color:rgba(255,255,255,.76);
  font-size:11px;
  font-weight:900;
}
.phone-status span{
  margin-right:auto;
}
.phone-status i{
  width:6px;
  height:6px;
  border-radius:50%;
  background:rgba(255,255,255,.72);
}
.phone-call-profile{
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:7px;
  padding-top:8px;
}
.phone-call-profile img{
  width:58px;
  height:58px;
  border-radius:50%;
  object-fit:cover;
  object-position:center 20%;
  border:2px solid var(--green);
  box-shadow:0 0 0 7px rgba(40,174,96,.13),0 18px 36px -24px rgba(40,174,96,.7);
}
.phone-call-profile span{
  color:rgba(255,255,255,.5);
  font-size:10px;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.22em;
}
.phone-call-profile b{
  font-size:22px;
  letter-spacing:-.035em;
}
.phone-call-profile small{
  color:var(--green-soft);
  font-size:10px;
  font-weight:950;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.phone-call-profile em{
  max-width:22ch;
  color:rgba(255,255,255,.68);
  font-family:Georgia,'Times New Roman',serif;
  font-size:15px;
  line-height:1.22;
}
.phone-progress{
  width:92px;
  margin:4px auto 0;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:6px;
}
.phone-progress span{
  height:4px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
}
.phone-progress span:first-child{
  background:var(--green);
  box-shadow:0 0 18px rgba(40,174,96,.55);
}
.phone-progress span.is-active{
  background:var(--green);
  box-shadow:0 0 18px rgba(40,174,96,.55);
}
.phone-options{
  display:grid;
  gap:8px;
  margin-top:2px;
}
.phone-options span,
.phone-form-fields span{
  min-height:auto;
  border-radius:12px;
  padding:12px 14px;
  background:rgba(255,255,255,.065);
  color:#fff;
  border:1px solid rgba(255,255,255,.13);
  font-size:12.5px;
  font-weight:850;
  letter-spacing:-.01em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  cursor:pointer;
}
.phone-options span{
  display:flex;
  align-items:center;
  gap:8px;
}
.phone-options span.is-selected{
  color:#fff;
  border-color:rgba(40,174,96,.72);
  background:rgba(40,174,96,.14);
  box-shadow:0 0 24px rgba(40,174,96,.16),inset 0 1px 0 rgba(255,255,255,.08);
}
.phone-step-label{
  margin-top:auto;
  text-align:center;
  color:rgba(255,255,255,.46);
  font-size:10px;
  font-weight:950;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.phone-nav-controls{
  display:flex;
  justify-content:center;
  gap:18px;
  margin-top:2px;
}
.phone-nav-btn{
  width:64px;
  height:64px;
  border-radius:50%;
  border:0;
  color:#fff;
  font-size:9px;
  line-height:1.05;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.02em;
  cursor:pointer;
  box-shadow:0 18px 36px -22px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.28);
}
.phone-nav-btn.prev{
  background:linear-gradient(180deg,#ff6b5f,#ca2d2d);
}
.phone-nav-btn.next{
  background:linear-gradient(180deg,#4bd77a,#188342);
}
.phone-nav-btn:active{
  transform:translateY(2px) scale(.98);
}
.phone-brand-card,
.phone-shadow-card{
  border-radius:18px;
  background:rgba(255,255,255,.09);
  color:#fff;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 24px 56px -36px rgba(0,0,0,.9);
  backdrop-filter:blur(16px);
}
.phone-brand-card{
  right:2%;
  top:10%;
  z-index:4;
}
.phone-brand-card span{
  color:rgba(255,255,255,.58);
}
.phone-brand-card b{
  color:#fff;
}
.phone-shadow-card.card-a{
  left:2%;
  top:23%;
  background:rgba(40,174,96,.14);
  border-color:rgba(40,174,96,.24);
}
.phone-shadow-card.card-b{
  right:2%;
  bottom:17%;
  background:#fafaf8;
  color:#0a0a0a;
}
@keyframes phoneCtaShake{
  0%,100%{transform:rotate(1.5deg) translateY(6px)}
  18%{transform:rotate(-2.4deg) translate(-6px,6px)}
  36%{transform:rotate(3deg) translate(5px,6px)}
  54%{transform:rotate(-1.6deg) translate(-4px,6px)}
  72%{transform:rotate(2deg) translate(3px,6px)}
}
.phone-shell.phone-shake{
  animation:phoneCtaShake .54s cubic-bezier(.36,.07,.19,.97) both;
}
@keyframes phoneContactShake{
  0%,100%{transform:rotate(1.5deg) translateY(6px) scale(.94)}
  15%{transform:rotate(.2deg) translate(-5px,6px) scale(.94)}
  30%{transform:rotate(2.8deg) translate(5px,6px) scale(.94)}
  45%{transform:rotate(.4deg) translate(-4px,6px) scale(.94)}
  60%{transform:rotate(2.6deg) translate(3px,6px) scale(.94)}
  78%{transform:rotate(1deg) translate(-2px,6px) scale(.94)}
}
.contact-hero-phone .phone-shell.phone-shake{
  animation:phoneContactShake .7s cubic-bezier(.34,.07,.21,.97) both;
  transform-origin:50% 90%;
  will-change:transform;
}
@media (max-width:980px){
  .applycta{
    padding:74px 0 72px !important;
  }
  .applycta-band{
    grid-template-columns:1fr;
  }
  .applycta-h{
    max-width:11ch;
  }
  .phone-form-mock{
    min-height:620px;
  }
}
@media (max-width:560px){
  .applycta-actions .btn-pill{
    width:100%;
    justify-content:center;
  }
  .phone-brand-card,
  .phone-shadow-card{
    display:none;
  }
}

/* ===================== GLOBAL WIDTH · LESS CENTERED, MORE FULL-BLEED ===================== */
.wrap{
  width:min(100%,1328px);
  max-width:none;
  margin:0 auto;
  padding-left:clamp(20px,2.4vw,34px);
  padding-right:clamp(20px,2.4vw,34px);
}
.hero-cards-trio{
  max-width:1328px;
  padding-left:clamp(20px,2.4vw,34px);
  padding-right:clamp(20px,2.4vw,34px);
}
@media (min-width:1500px){
  .tdb-hdr{
    margin-left:auto;
    margin-right:auto;
  }
}

/* ===================== DARK GRID + TITLE LANGUAGE UNIFICATION ===================== */
.brandsection::before,
.brandhero::before,
.os-section::before,
.bsys-reel-section::before,
.equipe::after,
.applycta::before{
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px) !important,
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px) !important;
  background-size:175px 175px !important;
  background-position:center top !important;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.95),transparent 88%) !important;
  mask-image:linear-gradient(180deg,rgba(0,0,0,.95),transparent 88%) !important;
}
.bsys-quote::before,
.bsys-stat::before{
  background-size:175px 175px !important;
  background-position:center top !important;
}
.h2,
.manifesto-h,
.darkcta-h,
.applycta-h,
.guarantee-h,
.promise-h{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-weight:950;
  letter-spacing:-.055em;
  line-height:.96;
}
.section-head .h2{
  font-size:clamp(40px,5.6vw,82px);
  max-width:13.6ch;
}
.brandsection .section-head .h2{
  max-width:14.2ch;
}
.h2 .hl-out,
.h2 .hl-grad,
.manifesto-h .hl-out,
.manifesto-h .hl-grad,
.darkcta-h .hl-out,
.darkcta-h .hl-grad,
.applycta-h .hl-out,
.applycta-h .hl-grad,
.guarantee-h .hl-out,
.guarantee-h .hl-grad,
.promise-h .hl-out,
.promise-h .hl-grad{
  font-style:italic;
  font-weight:650;
  letter-spacing:-.06em;
  padding:.04em .18em .2em .14em;
  margin:-.04em -.12em -.16em -.08em;
}
.h2 .hl-grad,
.manifesto-h .hl-grad,
.darkcta-h .hl-grad,
.applycta-h .hl-grad,
.guarantee-h .hl-grad,
.promise-h .hl-grad{
  font-weight:850;
}
.h2 .hl-out,
.manifesto-h .hl-out,
.darkcta-h .hl-out,
.applycta-h .hl-out,
.guarantee-h .hl-out,
.promise-h .hl-out{
  -webkit-text-stroke-width:1.55px;
}
@media (max-width:780px){
  .section-head .h2,
  .manifesto-h,
  .darkcta-h,
  .applycta-h{
    font-size:clamp(34px,11vw,56px);
    max-width:100%;
  }
}

/* ===================== PROMISE TV · IMMERSIVE COUNTER FIX ===================== */
.promesse-section .promise-band{
  overflow:visible !important;
}
.tv-countdown{
  overflow:visible !important;
}
.tv-antennas{
  top:-104px !important;
  width:196px !important;
  height:122px !important;
  z-index:4 !important;
  pointer-events:none;
}
.tv-antennas span{
  width:5px !important;
  height:132px !important;
  background:linear-gradient(180deg,#050505,#241f16) !important;
  box-shadow:0 0 0 1px rgba(255,255,255,.08),0 18px 30px rgba(0,0,0,.35);
}
.tv-antennas span:first-child{
  left:54px !important;
  transform:rotate(-27deg) !important;
}
.tv-antennas span:last-child{
  right:54px !important;
  transform:rotate(27deg) !important;
}
.tv-antennas span::before{
  content:"";
  position:absolute;
  top:-9px;
  left:50%;
  width:17px;
  height:17px;
  border-radius:50%;
  transform:translateX(-50%);
  background:#100f0c;
  border:2px solid rgba(255,255,255,.12);
}
.tv-case{
  min-height:292px !important;
  padding:44px 118px 36px 38px !important;
}
.tv-case::before{
  inset:24px 110px 24px 26px !important;
  border-radius:30px !important;
}
.tv-noise{
  inset:24px 110px 24px 26px !important;
  border-radius:30px !important;
  opacity:.07 !important;
}
.tv-countdown .counter-label{
  margin-bottom:2px !important;
  color:rgba(255,255,255,.72) !important;
}
.tv-countdown .promise-counter{
  gap:16px !important;
  justify-content:center !important;
  align-items:center !important;
  width:100%;
  margin-top:20px;
  padding-right:8px;
}
.tv-countdown .flap{
  min-width:94px !important;
  height:92px !important;
  border-radius:13px !important;
  background:
    linear-gradient(180deg,#fafaf8 0%,#e7e7e0 49%,#d0d0c9 50%,#fafaf8 100%) !important;
  border:1px solid rgba(255,255,255,.75) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.85),
    inset 0 -15px 24px rgba(10,10,10,.1),
    0 18px 34px -22px rgba(0,0,0,.85) !important;
  color:#0a0a0a !important;
  font-size:58px !important;
}
.tv-countdown .flap span{
  color:#0a0a0a !important;
  text-shadow:none !important;
}
.tv-countdown .flap::after{
  background:rgba(10,10,10,.18) !important;
  box-shadow:0 -1px 0 rgba(255,255,255,.6) !important;
}
.tv-countdown .counter-unit small{
  color:rgba(255,255,255,.66) !important;
}
@media (max-width:640px){
  .tv-antennas{
    top:-72px !important;
    transform:translateX(-50%) scale(.72) !important;
  }
  .tv-countdown .flap{
    min-width:68px !important;
    height:72px !important;
    font-size:40px !important;
  }
  .tv-countdown .promise-counter{
    gap:8px !important;
    margin-top:14px;
  }
}

/* ===================== BATCH QA · TYPE, HERO, LAYOUT, FOOTER ===================== */
.wrap,
.hero-cards-trio{
  width:min(100%,1280px);
}
.tdb-hdr{
  width:min(1280px,calc(100vw - 88px));
}
.h2,
.manifesto-h,
.darkcta-h,
.applycta-h,
.guarantee-h,
.promise-h,
.h2 .hl-out,
.h2 .hl-grad,
.manifesto-h .hl-out,
.manifesto-h .hl-grad,
.darkcta-h .hl-out,
.darkcta-h .hl-grad,
.applycta-h .hl-out,
.applycta-h .hl-grad,
.guarantee-h .hl-out,
.guarantee-h .hl-grad,
.promise-h .hl-out,
.promise-h .hl-grad{
  text-transform:uppercase !important;
}
.hero{
  padding-top:clamp(112px,12vh,150px);
  padding-bottom:clamp(44px,7vh,78px);
}
.hero-inner{
  grid-template-columns:minmax(0,1.18fr) minmax(360px,.82fr);
  gap:clamp(42px,7vw,96px);
}
.hero-h1{
  font-size:clamp(56px,8.2vw,112px) !important;
  line-height:.88 !important;
  letter-spacing:-.072em !important;
  max-width:10.6ch;
}
.hero-display-solid{
  display:inline-block;
  color:#fff;
  font-weight:950;
  text-transform:uppercase;
  padding-bottom:.05em;
}
.hero-display-small{
  display:inline-block;
  color:#fff;
  font-size:.46em;
  line-height:1;
  letter-spacing:-.035em;
  text-transform:none;
  padding:.12em .04em .08em;
}
.hero-word-outline{
  color:transparent !important;
  -webkit-text-stroke:1.55px rgba(255,255,255,.72);
  text-stroke:1.55px rgba(255,255,255,.72);
  font-style:italic;
  font-weight:650;
  padding:.02em .08em .12em;
  margin:-.02em -.03em -.1em;
}
.hero-h1-accent{
  display:inline-block;
  background:linear-gradient(90deg,#28ae60 0%,#a5ffbf 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent !important;
  padding:.02em .08em .14em;
  margin:-.02em -.03em -.12em;
}
.hero-trust .g-txt{
  font-weight:900;
  color:rgba(255,255,255,.78);
  letter-spacing:.02em;
}
.ticker-wrap.hero-ticker{
  max-width:min(1280px,calc(100vw - 88px)) !important;
  margin:8px auto 44px !important;
  padding:0 !important;
  overflow:visible !important;
}
.ticker-wrap.hero-ticker .tdb-ticker{
  padding:20px 0 !important;
  overflow:hidden !important;
  border-radius:28px !important;
}
.trust-bar .wrap{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 228px;
  align-items:end !important;
  gap:26px;
}
.trust-cta{
  justify-self:stretch;
  align-self:end;
  margin-bottom:10px;
  text-align:center;
}
.formule .wrap{
  width:min(100%,1248px);
}
.formule-stack{
  max-width:1188px;
  margin:0 auto;
}

/* Align the 14-jours promise band to the exact same width as a formule-card */
.page-formule .promesse-section .promise-band{
  max-width:1188px;
  margin-left:auto;
  margin-right:auto;
  box-sizing:border-box;
}

/* === Page Formule — toutes les sections alignées à la largeur de la carte des 3 étapes (1248px wrap) === */
.page-formule .page-hero > .wrap,
.page-formule .promesse-section > .wrap,
.page-formule .avantapres > .wrap,
.page-formule .vsembaucher > .wrap,
.page-formule .internal-cost > .wrap,
.page-formule .guarantee > .wrap,
.page-formule .faq > .wrap,
.page-formule .trust-bar > .wrap{
  width:min(100%,1248px);
}
.page-formule .results-marquee-section .results-marquee{
  width:min(100%,1248px);
  margin-left:auto;
  margin-right:auto;
  padding-left:clamp(20px,2.4vw,34px);
  padding-right:clamp(20px,2.4vw,34px);
  box-sizing:border-box;
}
.formule-card{
  grid-template-columns:128px minmax(0,.94fr) minmax(320px,.86fr);
}
.formule-card.reverse{
  grid-template-columns:minmax(0,.94fr) minmax(320px,.86fr) 128px;
}
.case-review-layout{
  align-items:stretch !important;
}
.case-stack{
  grid-auto-rows:1fr !important;
  align-items:stretch !important;
}
.case-stack .case-card{
  height:auto !important;
  min-height:260px !important;
  overflow:visible !important;
}
.reviews-vertical{
  align-self:stretch !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
}
.review-rail{
  flex:1 1 auto !important;
}
.reviews-vertical.rv,
.applycta-band.rv{
  opacity:1 !important;
  transform:none !important;
}
.applycta-h{
  max-width:10.6ch;
  margin:18px 0 18px;
}
.phone-nav-controls{
  gap:26px !important;
  margin-top:10px !important;
}
.phone-nav-btn{
  width:56px !important;
  height:56px !important;
  border-radius:50% !important;
  font-size:9px !important;
  line-height:1.05 !important;
  letter-spacing:-.02em !important;
  text-transform:none !important;
  box-shadow:0 14px 24px -19px rgba(0,0,0,.88) !important;
}
.phone-nav-btn.prev{
  background:#f14443 !important;
}
.phone-nav-btn.next{
  background:#28b957 !important;
  box-shadow:0 14px 24px -19px rgba(0,0,0,.88) !important;
}

/* HERO · OPTION 02 STUDIO PROOF */
.hero.hero-studio{
  background:#f3f3f0 !important;
  color:#0a0a0a !important;
  padding-top:clamp(126px,13vh,166px) !important;
  padding-bottom:clamp(58px,7vw,96px) !important;
  overflow:hidden;
}
.hero.hero-studio .hero-grid{
  opacity:1 !important;
  background-image:
    linear-gradient(rgba(10,10,10,.11) 1px,transparent 1px),
    linear-gradient(90deg,rgba(10,10,10,.11) 1px,transparent 1px) !important;
  background-size:175px 175px !important;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,1) 0%,rgba(0,0,0,.95) 55%,rgba(0,0,0,.6) 85%,transparent 100%) !important;
  mask-image:linear-gradient(180deg,rgba(0,0,0,1) 0%,rgba(0,0,0,.95) 55%,rgba(0,0,0,.6) 85%,transparent 100%) !important;
}
.hero-studio-inner{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:.88fr 1.12fr;
  align-items:center;
  gap:clamp(36px,6vw,82px);
}
.hero-studio-copy{
  max-width:760px;
}
.hero-studio .pill-hero{
  background:var(--bg) !important;
  color:rgba(10,10,10,.66) !important;
  border:1px solid rgba(10,10,10,.08) !important;
  box-shadow:none !important;
}
.hero-studio .pill-hero.pill-hero--dark{
  background:#2a2a2a !important;
  color:#fff !important;
  border:0 !important;
}
.hero-studio-h1{
  margin-top:22px;
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:clamp(56px,7.6vw,122px);
  line-height:.83;
  letter-spacing:-.083em;
  font-weight:950;
  max-width:8.9ch;
  color:#0a0a0a;
}
.hero-studio-h1 em{
  display:inline-block;
  font-style:italic;
  font-weight:650;
  color:transparent;
  -webkit-text-stroke:1.5px rgba(10,10,10,.4);
  text-stroke:1.5px rgba(10,10,10,.4);
  padding:.03em .09em .16em;
  margin:-.03em -.05em -.12em;
}
.hero-studio-sub{
  max-width:560px;
  margin:26px 0 24px;
  color:#5f5f58;
  font-size:clamp(17px,1.35vw,20px);
  line-height:1.45;
  border-left:2px solid var(--green);
  padding-left:20px;
}
.hero-studio-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}
.hero-studio-ghost{
  background:#fafaf8 !important;
  color:#0a0a0a !important;
  border:1.5px solid rgba(10,10,10,.1) !important;
  box-shadow:none !important;
}
.hero-studio-proof{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:28px;
  max-width:560px;
}
.hero-studio-proof > div{
  min-height:96px;
  border-radius:22px;
  padding:16px;
  background:#fafaf8;
  border:1px solid rgba(10,10,10,.1);
  box-shadow:0 18px 42px -34px rgba(10,10,10,.36);
}
.hero-studio-proof b{
  display:block;
  font-size:clamp(28px,3vw,42px);
  line-height:.9;
  letter-spacing:-.055em;
}
.hero-studio-proof span,
.hero-studio-google strong{
  display:block;
  margin-top:8px;
  color:#6b6b66;
  font-size:11px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.hero-studio-google{
  grid-column:span 2;
  min-height:58px !important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.hero-studio-google .stars{
  margin:0;
  color:#28ae60;
  font-size:20px;
  letter-spacing:.03em;
}
.hero-studio-google strong{
  margin:0;
  color:#0a0a0a;
}
.hero-studio-visual{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  align-items:start;
}
.hero-studio-card{
  position:relative;
  min-height:clamp(460px,48vw,590px);
  overflow:hidden;
  border-radius:34px;
  background:
    radial-gradient(circle at 50% 18%,rgba(40,174,96,.08),transparent 36%),
    #111;
  box-shadow:0 30px 70px -42px rgba(0,0,0,.62);
}
.hero-studio-card-side{
  transform:translateY(56px);
}
.hero-studio-card-main{
  aspect-ratio:9/16;
  min-height:0;
  max-height:720px;
  margin-inline:auto;
  width:100%;
}
.hero-studio-card video{
  width:100%;
  height:100%;
  min-height:inherit;
  object-fit:contain;
  background:#111;
}
.hero-studio-card-main video{
  object-position:center center;
  object-fit:cover;
}
.hero-studio-card-side video{
  object-position:center center;
}
/* Vertical animated agenda (méthode hero side card) */
.vertical-agenda-card{
  background:#1c1f1d;
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:18px;
}
.vertical-agenda{
  position:absolute;
  inset:0;
  padding:0;
  display:flex;
  align-items:stretch;
  justify-content:stretch;
  overflow:visible;
  box-sizing:border-box;
}
.vertical-agenda .va-rows{
  flex:1;
  min-width:0;
  display:grid;
  grid-template-rows:repeat(6,1fr);
  align-content:stretch;
  gap:6px;
  width:100%;
  padding:14px 14px 140px 14px;
}
.vertical-agenda .va-row{align-items:stretch}
.vertical-agenda .va-slots{align-items:stretch}
.vertical-agenda .va-chip{height:100%}
.vertical-agenda .va-row{
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  align-items:center;
  gap:6px;
  padding:4px 6px;
  border-radius:12px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.06);
  min-width:0;
}
.vertical-agenda .va-day{
  font-size:16px;
  font-weight:900;
  letter-spacing:.14em;
  color:rgba(255,255,255,.55);
  text-transform:uppercase;
  display:flex;
  align-items:center;
  justify-content:center;
  align-self:stretch;
}
.vertical-agenda .va-slots{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:4px;
  min-width:0;
}
.vertical-agenda .va-chip{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:0;
  overflow:hidden;
  font-size:clamp(7px,.66vw,9px);
  font-weight:900;
  line-height:1.15;
  padding:7px 4px;
  border-radius:8px;
  text-align:center;
  letter-spacing:0;
  min-width:0;
  overflow-wrap:normal;
  word-break:keep-all;
  hyphens:none;
  opacity:0;
  transform:translateY(8px) scale(.94);
  /* Loop the cascade forever with a 2s pause between cycles.
     Each chip shares the same 8s cycle; staggering via positive
     animation-delay keeps the wave aligned across iterations. */
  animation:vaLoop 8s cubic-bezier(.22,.9,.28,1) infinite;
  animation-delay:calc(var(--i,0) * .14s);
}
.vertical-agenda .va-chip.booked{
  background:rgba(40,174,96,.16);
  color:#d8f5e3;
  border:1px solid rgba(40,174,96,.28);
}
.vertical-agenda .va-chip.closed{
  background:var(--green,#28ae60);
  color:#fff;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:none;
}
@keyframes vaLoop{
  0%   {opacity:0;transform:translateY(10px) scale(.92);}
  3%   {opacity:1;transform:translateY(-2px) scale(1.02);}
  6%   {opacity:1;transform:translateY(0) scale(1);}
  45%  {opacity:1;transform:translateY(0) scale(1);}
  50%  {opacity:0;transform:translateY(-4px) scale(.96);}
  100% {opacity:0;transform:translateY(10px) scale(.92);}
}
@media (prefers-reduced-motion:reduce){
  .vertical-agenda .va-chip{animation:none;opacity:1;transform:none;}
}
@media (max-width:560px){
  .vertical-agenda-card{padding:14px;gap:12px;}
  .vertical-agenda{padding:0;}
  .vertical-agenda .va-chip{font-size:8px;padding:6px 3px;}
  .vertical-agenda .va-day{font-size:15px;letter-spacing:.16em;}
}
@media (min-width:561px) and (max-width:1024px){
  .vertical-agenda .va-chip{font-size:13px;padding:12px 8px;border-radius:10px;}
  .vertical-agenda .va-day{font-size:18px;}
  .vertical-agenda .va-rows{gap:10px;padding:18px 18px 140px 18px;}
  .vertical-agenda .va-row{padding:6px 10px;gap:10px;grid-template-columns:48px minmax(0,1fr);}
  .vertical-agenda .va-slots{gap:8px;}
}
@media (min-width:1025px){
  .vertical-agenda .va-day{font-size:13px;letter-spacing:.12em;}
  .vertical-agenda .va-row{grid-template-columns:34px minmax(0,1fr);}
}
.hero-studio-card-caption{
  position:absolute;
  left:20px;
  right:20px;
  top:20px;
  padding:17px;
  border-radius:22px;
  background:
    linear-gradient(135deg,rgba(40,174,96,.22),rgba(40,174,96,.06) 60%,rgba(10,10,10,.72)),
    rgba(10,10,10,.72);
  border:1px solid rgba(40,174,96,.25);
  box-shadow:0 18px 40px -20px rgba(40,174,96,.45),inset 0 1px 0 rgba(255,255,255,.06);
  color:#fff;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.vertical-agenda-card .hero-studio-card-caption{
  position:absolute;
  left:20px;
  right:20px;
  bottom:20px;
  top:auto;
  background:rgba(10,10,10,.72);
  border:0;
  box-shadow:none;
}
/* Keep the main video card caption at the bottom — only flip the agenda side card */
.hero-studio-card-main .hero-studio-card-caption{
  top:auto;
  bottom:20px;
  background:rgba(10,10,10,.72);
  border:0;
  box-shadow:none;
}
.hero-studio-card-caption b{
  display:block;
  font-size:clamp(22px,2.3vw,34px);
  line-height:.92;
  letter-spacing:-.055em;
}
.hero-studio-card-caption > span{
  display:block;
  margin-top:8px;
  color:rgba(255,255,255,.62);
  font-size:11px;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
}
@media (max-width:1080px){
  .hero-studio-inner{
    grid-template-columns:1fr;
  }
  .hero-studio-copy{
    max-width:920px;
  }
  .hero-studio-h1{
    max-width:10.5ch;
  }
}
@media (max-width:780px){
  .hero.hero-studio{
    padding-top:112px !important;
  }
  /* Place the phone form right under the H1 on mobile */
  .hero-option6 .hero-studio-inner{
    display:flex;
    flex-direction:column;
  }
  .hero-option6 .hero-studio-copy{display:contents}
  .hero-option6 .hero-studio-copy > .pill-hero{order:1}
  .hero-option6 .hero-studio-copy > .hero-studio-h1{order:2}
  .hero-option6 .hero-studio-visual{order:3}
  .hero-option6 .hero-studio-copy > .hero-studio-sub{order:4;margin:4px 0 6px !important}
  .hero-option6 .hero-studio-copy > .hero-studio-actions{order:5}
  .hero-option6 .hero-studio-copy > .hero-studio-proof{order:6}
  .hero-studio-visual{
    grid-template-columns:1fr;
  }
  .hero-studio-card,
  .hero-studio-card video{
    min-height:390px;
  }
  .hero-studio-card-side{
    transform:none;
  }
  .hero-studio-proof{
    grid-template-columns:1fr;
  }
  .hero-studio-google{
    grid-column:auto;
  }
}
@media (max-width:560px){
  .hero-studio-actions .btn-pill{
    width:100%;
    justify-content:center;
  }
  .hero-studio-h1{
    font-size:clamp(44px,13vw,66px);
  }
}

/* PHONE CTA · INCOMING CALL BUTTONS */
.phone-nav-controls{
  width:min(224px,86%) !important;
  margin:8px auto 0 !important;
  justify-content:space-between !important;
  gap:0 !important;
  align-items:flex-start !important;
}
.phone-nav-btn{
  position:relative !important;
  display:grid !important;
  place-items:center !important;
  width:68px !important;
  height:68px !important;
  overflow:visible !important;
}
.phone-nav-btn svg{
  width:38px;
  height:38px;
  overflow:visible;
  display:block;
}
.phone-nav-btn text{
  display:none;
}
.phone-nav-btn .phone-icon{
  fill:#fafaf8;
  opacity:.98;
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.28));
}
.phone-nav-btn .phone-icon-hang{
  transform-origin:32px 32px;
  transform:rotate(132deg) scale(1.08);
}
.phone-nav-btn .phone-icon-answer{
  transform-origin:32px 32px;
  transform:rotate(-8deg) scale(1.08);
}
.phone-nav-btn .call-label{
  position:absolute;
  left:50%;
  top:calc(100% + 7px);
  transform:translateX(-50%);
  color:rgba(255,255,255,.72);
  font-size:9.5px;
  line-height:1;
  font-weight:850;
  letter-spacing:.01em;
  text-transform:lowercase;
  white-space:nowrap;
  pointer-events:none;
}
.phone-nav-btn.next::before,
.phone-nav-btn.next::after{
  content:"";
  position:absolute;
  inset:-7px;
  border-radius:50%;
  border:1.5px solid rgba(40,185,87,.48);
  animation:phoneIncomingPulse 1.55s ease-out infinite;
  pointer-events:none;
}
.phone-nav-btn.next::before,
.phone-nav-btn.next::after{
  top:-7px;
  left:-7px;
  right:-7px;
  bottom:-7px;
}
.phone-nav-btn .label-text{
  display:none;
}
.phone-nav-btn.next::after{
  animation-delay:.55s;
}
@keyframes phoneIncomingPulse{
  0%{transform:scale(.78);opacity:.82}
  70%{transform:scale(1.22);opacity:0}
  100%{transform:scale(1.22);opacity:0}
}

/* APPLY CTA · CONTRAST LOCK */
.applycta,
.applycta-band,
.applycta-content,
.phone-screen{
  color:#fff !important;
}
.applycta .pill-section,
.applycta .pill-section *,
.applycta-h,
.applycta-sub,
.applycta-proof-row span,
.phone-status,
.phone-status span,
.phone-call-profile,
.phone-call-profile span,
.phone-call-profile b,
.phone-call-profile em,
.phone-step-label,
.phone-options span,
.phone-form-fields span,
.phone-nav-btn,
.phone-brand-card,
.phone-brand-card span,
.phone-brand-card b,
.phone-shadow-card.card-a{
  color:#fff !important;
}
.phone-call-profile small{
  color:#28ae60 !important;
}
.phone-options span{
  background:rgba(255,255,255,.075) !important;
  border-color:rgba(255,255,255,.16) !important;
}
.phone-options span.is-selected{
  color:#fff !important;
  background:rgba(40,174,96,.16) !important;
  border-color:rgba(40,174,96,.72) !important;
}
.applycta-h .hl-out{
  color:transparent !important;
  -webkit-text-stroke-color:rgba(255,255,255,.82) !important;
  text-stroke-color:rgba(255,255,255,.82) !important;
}
.phone-shadow-card.card-b{
  color:#0a0a0a !important;
  max-width:174px !important;
  text-align:center !important;
  line-height:1.08 !important;
}

.applycta .phone-form-mock .phone-shadow-card.card-b{
  right:-52px !important;
  bottom:118px !important;
}

/* PHONE FLOATING CARDS · black treatment on both hero and CTA phones */
.hero-option6 .hero-phone-visual .phone-google-rating,
.applycta .phone-form-mock .phone-google-rating,
.hero-option6 .hero-phone-visual .phone-shadow-card.card-b,
.applycta .phone-form-mock .phone-shadow-card.card-b{
  background:#0a0a0a !important;
  color:#fff !important;
  border-color:rgba(255,255,255,.16) !important;
  box-shadow:0 24px 58px -36px rgba(0,0,0,.9),0 0 0 7px rgba(40,174,96,.08) !important;
}
.hero-option6 .hero-phone-visual .phone-google-rating b,
.hero-option6 .hero-phone-visual .phone-google-rating span,
.applycta .phone-form-mock .phone-google-rating b,
.applycta .phone-form-mock .phone-google-rating span{
  color:#fff !important;
}

/* GOOGLE REVIEWS · STYLE GUIDE MARQUEE TREATMENT */
.reviews-vertical{
  background:#f8f8f3 !important;
  border-color:rgba(10,10,10,.1) !important;
}
.google-slider-top{
  margin-bottom:16px !important;
  padding:4px 4px 14px !important;
  border-bottom:1px solid rgba(10,10,10,.08) !important;
}
.google-slider-top small{
  letter-spacing:.13em !important;
}
.review-column{
  gap:10px !important;
}
.review-mini{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
  min-height:124px !important;
  padding:15px 18px 14px 21px !important;
  border-radius:24px !important;
  background:
    linear-gradient(90deg,rgba(40,174,96,.08),rgba(40,174,96,0) 38%),
    #fafaf8 !important;
  border:1px solid rgba(10,10,10,.1) !important;
  box-shadow:none !important;
}
.review-mini::before{
  top:12px !important;
  bottom:12px !important;
  width:5px !important;
  border-radius:999px !important;
  background:linear-gradient(180deg,#7ce4a3,#28ae60) !important;
}
.review-mini::after{
  content:"AVIS GOOGLE · AVIS VÉRIFIÉ · TOURDUBLOC" !important;
  position:absolute !important;
  right:14px !important;
  bottom:11px !important;
  color:rgba(10,10,10,.22) !important;
  font-size:9px !important;
  font-weight:950 !important;
  letter-spacing:.16em !important;
  white-space:nowrap !important;
  pointer-events:none !important;
}
.review-mini-top{
  margin-bottom:0 !important;
  gap:8px !important;
}
.review-avatar{
  width:13px !important;
  height:13px !important;
  flex:0 0 13px !important;
  border-radius:3px !important;
  font-size:0 !important;
  box-shadow:none !important;
}
.review-mini-top b{
  font-size:12px !important;
  font-weight:950 !important;
  letter-spacing:.09em !important;
  text-transform:uppercase !important;
}
.review-mini-top small{
  margin-top:3px !important;
  font-size:10px !important;
  letter-spacing:.12em !important;
}
.review-mini p{
  padding-right:4px !important;
  font-size:clamp(17px,1.45vw,22px) !important;
  line-height:1.08 !important;
  letter-spacing:-.045em !important;
  font-weight:950 !important;
}
.review-mini-foot{
  margin-top:0 !important;
  padding-top:10px !important;
  border-top:1px solid rgba(10,10,10,.07) !important;
}
.review-mini-foot span{
  font-size:9.5px !important;
  letter-spacing:.16em !important;
}
.tdb-footer{
  position:relative;
  overflow:hidden;
  padding:92px 0 42px !important;
  background:#080807 !important;
  color:#fff !important;
  border-top:0 !important;
}
.tdb-footer::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:175px 175px;
  background-position:center top;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.92),rgba(0,0,0,.16));
  mask-image:linear-gradient(180deg,rgba(0,0,0,.92),rgba(0,0,0,.16));
  pointer-events:none;
}
.tdb-footer .footer-wrap{
  position:relative;
  z-index:1;
  display:grid !important;
  gap:46px;
}
.footer-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:32px;
  align-items:end;
  padding-bottom:42px;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.footer-hero h2{
  max-width:10.8ch;
  margin:18px 0 0;
  font-size:clamp(44px,7vw,104px);
  line-height:.9;
  letter-spacing:-.07em;
  font-weight:950;
}
.footer-hero .hl-out{
  font-style:italic;
  color:transparent;
  -webkit-text-stroke:1.45px rgba(255,255,255,.72);
  text-stroke:1.45px rgba(255,255,255,.72);
  padding:.02em .08em .14em;
}
.footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
}
.tdb-footer .footer-logo{
  height:34px;
  width:auto;
}
.tdb-footer .footer-nav{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:center;
}
.tdb-footer .footer-nav a{
  color:rgba(255,255,255,.78);
  text-decoration:none;
  padding:8px 13px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.035);
  font-size:13px;
  font-weight:800;
}
.tdb-footer .footer-nav a:hover{
  color:#fff;
  border-color:rgba(40,174,96,.45);
}
.tdb-footer .footer-meta{
  color:rgba(255,255,255,.46);
  font-size:12px;
  font-weight:800;
  letter-spacing:.02em;
}
@media (max-width:980px){
  .hero-inner,
  .trust-bar .wrap,
  .footer-hero{
    grid-template-columns:1fr;
  }
  .hero-h1{
    max-width:100%;
  }
  .formule-card,
  .formule-card.reverse{
    grid-template-columns:auto 1fr;
  }
  .trust-cta{
    justify-self:start;
  }
}
@media (max-width:780px){
  .tdb-hdr{
    width:calc(100vw - 20px);
  }
  .hero-h1{
    font-size:clamp(44px,13vw,68px) !important;
  }
}

/* ===================== FOOTER LIGHT · OPTION 01 SELECTED ===================== */
.tdb-footer{
  position:relative;
  overflow:hidden;
  padding:54px 0 30px !important;
  background:
    radial-gradient(circle at 88% 12%,rgba(40,174,96,.14),transparent 32%),
    #f8f7f0 !important;
  color:#0a0a0a !important;
  border-top:1px solid rgba(10,10,10,.06) !important;
}
.tdb-footer::before{
  display:none !important;
}
.tdb-footer .footer-wrap{
  position:relative;
  z-index:1;
  display:grid !important;
  gap:0;
}
.tdb-footer .footer-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) 280px;
  gap:34px;
  align-items:end;
  padding-bottom:42px;
  border-bottom:1px solid rgba(10,10,10,.08);
}
.tdb-footer .footer-pill{
  background:#fafaf8 !important;
  color:rgba(10,10,10,.7) !important;
  border:1px solid rgba(10,10,10,.08) !important;
}
.tdb-footer .footer-pill .sq{
  background:var(--green) !important;
}
.tdb-footer .footer-hero h2{
  max-width:10.8ch;
  margin:18px 0 0;
  font-size:clamp(44px,7vw,105px);
  line-height:.88;
  letter-spacing:-.075em;
  font-weight:950;
  color:#0a0a0a;
}
.tdb-footer .footer-hero .hl-out{
  color:transparent !important;
  -webkit-text-stroke:1.5px rgba(10,10,10,.4) !important;
  text-stroke:1.5px rgba(10,10,10,.4) !important;
  font-style:italic;
  padding:.02em .08em .14em;
}
.footer-cta-card{
  border-radius:28px;
  background:#fafaf8;
  padding:22px;
  border:1px solid rgba(10,10,10,.06);
  box-shadow:0 24px 60px -46px rgba(10,10,10,.4);
}
.footer-cta-card p{
  margin:0 0 18px;
  color:#73736d;
  font-size:13px;
  line-height:1.45;
  font-weight:800;
}
.tdb-footer .footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  flex-wrap:wrap;
  padding-top:22px;
  border-top:0;
}
.tdb-footer .footer-logo{
  height:34px;
  width:auto;
}
.tdb-footer .footer-nav{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:center;
}
.tdb-footer .footer-nav a{
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(10,10,10,.08);
  background:rgba(255,255,255,.42);
  color:rgba(10,10,10,.7);
  font-size:13px;
  font-weight:850;
  text-decoration:none;
}
.tdb-footer .footer-nav a:hover{
  color:#0a0a0a;
  border-color:rgba(40,174,96,.32);
  background:#fafaf8;
}
.tdb-footer .footer-meta{
  color:#73736d;
  font-size:12px;
  font-weight:800;
  letter-spacing:.02em;
}
@media (max-width:900px){
  .tdb-footer .footer-hero{
    grid-template-columns:1fr;
  }
  .footer-cta-card{
    max-width:360px;
  }
}

/* NAVBAR · LIGHT TEST */
.tdb-hdr{
  background:rgba(248,247,240,.88) !important;
  border:1px solid rgba(10,10,10,.1) !important;
  box-shadow:0 22px 54px -38px rgba(10,10,10,.42) !important;
  backdrop-filter:blur(18px) saturate(1.08) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.08) !important;
}
.tdb-hdr-inner{
  padding:12px 20px !important;
}
.tdb-nav a{
  color:#0a0a0a !important;
  font-weight:750 !important;
}
.tdb-nav a:hover{
  background:rgba(10,10,10,.055) !important;
}
.tdb-nav a::after{
  height:2px !important;
  background:#28ae60 !important;
}
.philippe-btn.contact-tdb-btn{
  background:#fafaf8 !important;
  color:#0a0a0a !important;
  border:1px solid rgba(10,10,10,.1) !important;
  box-shadow:0 14px 32px -24px rgba(10,10,10,.45) !important;
}
.philippe-btn.contact-tdb-btn:hover{
  border-color:rgba(40,174,96,.5) !important;
  box-shadow:0 18px 38px -24px rgba(40,174,96,.65) !important;
}
.tdb-burger span{
  background:#0a0a0a !important;
}

/* GOOGLE REVIEWS · SIMPLE WHITE CARDS REFERENCE */
.reviews-vertical{
  background:#f3f3f0 !important;
  border:0 !important;
  border-radius:34px !important;
  padding:22px !important;
  box-shadow:none !important;
}
.reviews-vertical::before{
  display:none !important;
}
.reviews-vertical::after{
  display:none !important;
}
.google-slider-top{
  padding:0 4px 18px !important;
  margin-bottom:14px !important;
  border-bottom:0 !important;
}
.google-slider-top small{
  color:rgba(10,10,10,.48) !important;
  text-transform:none !important;
  letter-spacing:0 !important;
}
.review-rail{
  height:calc(100% - 78px) !important;
}
.review-column{
  gap:16px !important;
}
.review-mini{
  min-height:172px !important;
  padding:26px 26px 22px !important;
  border-radius:28px !important;
  background:#fafaf8 !important;
  border:8px solid rgba(10,10,10,.045) !important;
  box-shadow:0 18px 48px -42px rgba(10,10,10,.48) !important;
  display:flex !important;
  flex-direction:column !important;
  gap:0 !important;
}
.review-mini::before,
.review-mini::after{
  display:none !important;
}
.review-mini-top{
  display:block !important;
  margin:0 0 18px !important;
}
.review-avatar,
.review-mini-top b{
  display:none !important;
}
.review-mini-top small{
  display:block !important;
  margin:0 !important;
  color:#f7b500 !important;
  font-size:19px !important;
  line-height:1 !important;
  letter-spacing:.08em !important;
}
.review-mini p{
  margin:0 !important;
  padding:0 !important;
  color:#20201d !important;
  font-size:clamp(17px,1.2vw,20px) !important;
  font-weight:520 !important;
  line-height:1.42 !important;
  letter-spacing:-.026em !important;
  text-transform:none !important;
}
.review-mini-foot{
  margin-top:auto !important;
  padding-top:18px !important;
  border-top:1px solid rgba(10,10,10,.08) !important;
  display:block !important;
}
.review-mini-foot span:first-child{
  display:block !important;
  color:#0a0a0a !important;
  font-size:16px !important;
  font-weight:900 !important;
  letter-spacing:-.015em !important;
  text-transform:none !important;
}
.review-mini-foot span:last-child{
  display:none !important;
}

/* CASE STUDIES · ALL BLACK CARDS */
.case-stack .case-card{
  background:
    radial-gradient(circle at 82% 0%,rgba(40,174,96,.2),transparent 34%),
    linear-gradient(145deg,#111 0%,#050505 72%) !important;
  color:#f8f7f0 !important;
  border:1px solid rgba(255,255,255,.1) !important;
  box-shadow:0 26px 70px -52px rgba(0,0,0,.92) !important;
}
.case-stack .case-card.accent,
.case-stack .case-card--cta{
  background:
    radial-gradient(circle at 78% 2%,rgba(40,174,96,.28),transparent 36%),
    linear-gradient(145deg,#101010 0%,#050505 74%) !important;
}
.case-stack .case-card .client{
  color:rgba(248,247,240,.66) !important;
}
.case-stack .case-card .case-num,
.case-stack .case-card .case-head{
  color:#fff !important;
}
.case-stack .case-card .case-num sup,
.case-stack .case-card .case-num .k,
.case-stack .case-card .case-num--text,
.case-stack .case-card .case-num .x{
  color:#28ae60 !important;
  -webkit-text-stroke:0 !important;
}
.case-stack .case-card .case-num--text{
  font-style:italic !important;
}
.case-stack .case-card .case-foot{
  border-top-color:rgba(255,255,255,.12) !important;
}
.case-stack .case-card .badge-pin{
  color:rgba(248,247,240,.72) !important;
}
.case-stack .case-card .badge-pin .dot{
  background:#28ae60 !important;
}
.case-stack .case-card .case-tag{
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.08) !important;
}
.case-stack .case-card .btn-pill--green{
  background:#28ae60 !important;
  color:#fff !important;
  border-color:transparent !important;
}

/* HERO · OPTION 06 PHONE HYBRID */
.hero-option6 .hero-studio-inner{
  grid-template-columns:.9fr 1.1fr !important;
}
.hero-option6 .hero-studio-visual.hero-phone-visual{
  position:relative !important;
  min-height:620px !important;
  display:grid !important;
  place-items:center !important;
}
.hero-option6 .hero-phone-visual.phone-form-mock{
  isolation:isolate;
}
.hero-option6 .hero-phone-visual.phone-form-mock::before{
  right:8% !important;
  top:7% !important;
}
.hero-option6 .hero-phone-visual.phone-form-mock::after{
  right:7% !important;
  bottom:4% !important;
}
.hero-option6 .hero-phone-visual .phone-brand-card.card-c{
  right:4% !important;
  top:12% !important;
}
.hero-option6 .hero-phone-visual .phone-shadow-card.card-a{
  left:5% !important;
  top:25% !important;
}
.hero-option6 .hero-phone-visual .phone-shadow-card.card-b{
  right:5% !important;
  bottom:18% !important;
}
.hero-phone-shell{
  position:absolute;
  right:12%;
  top:0;
  width:min(392px,81vw);
  padding:13px;
  border-radius:46px;
  background:linear-gradient(145deg,#2d2d2b,#050505 62%);
  box-shadow:0 50px 110px -42px rgba(0,0,0,.95),0 0 0 7px rgba(255,255,255,.035);
  transform:rotate(2deg);
  z-index:2;
}
.hero-phone-screen{
  min-height:616px;
  border-radius:35px;
  padding:30px 20px;
  background:
    radial-gradient(circle at 50% 6%,rgba(40,174,96,.17),transparent 23%),
    linear-gradient(180deg,#111,#050505 76%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
  color:#fff;
  text-align:center;
}
.hero-phone-face{
  width:62px;
  height:62px;
  object-fit:cover;
  border-radius:50%;
  margin:66px auto 14px;
  border:2px solid var(--green);
}
.hero-phone-screen h3{
  margin:0;
  color:#fff;
  font-size:24px;
  line-height:1;
  letter-spacing:-.04em;
  font-weight:950;
}
.hero-phone-screen small{
  display:block;
  margin-top:8px;
  color:var(--green);
  font-size:10px;
  font-weight:950;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.hero-phone-options{
  margin-top:28px;
  display:grid;
  gap:9px;
  text-align:left;
}
.hero-phone-options span{
  padding:13px 14px;
  border-radius:12px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.13);
  color:#fff;
  font-size:12px;
  font-weight:850;
  cursor:pointer;
}
.hero-phone-bubble{
  position:absolute;
  left:7%;
  bottom:10%;
  z-index:3;
  width:240px;
  border-radius:26px;
  padding:22px;
  background:#0a0a0a;
  color:#fff;
  box-shadow:0 24px 70px -34px rgba(0,0,0,.85);
  transform:rotate(-4deg);
}
.hero-phone-bubble b{
  display:block;
  font-size:44px;
  line-height:.9;
  letter-spacing:-.06em;
}
.hero-phone-bubble span{
  display:block;
  margin-top:7px;
  color:rgba(255,255,255,.62);
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.09em;
}
.hero-phone-proof{
  position:absolute;
  right:0;
  bottom:2%;
  width:260px;
  border-radius:28px;
  padding:22px;
  background:#fafaf8;
  border:1px solid rgba(10,10,10,.1);
  box-shadow:0 24px 70px -42px rgba(0,0,0,.45);
  transform:rotate(4deg);
  z-index:1;
}
.hero-phone-proof b{
  display:block;
  color:var(--green);
  font-size:48px;
  line-height:.85;
  letter-spacing:-.07em;
  font-weight:950;
}
.hero-phone-proof span{
  display:block;
  margin-top:9px;
  color:var(--muted);
  font-size:12px;
  font-weight:950;
  letter-spacing:.1em;
  text-transform:uppercase;
}

/* HERO RESERVE · OPTION 02 BELOW FOOTER */
.hero-reserve-option2{
  padding:54px 0 74px;
  background:#deded7;
  color:#0a0a0a;
  border-top:1px solid rgba(10,10,10,.1);
}
.reserve-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
  margin-bottom:24px;
}
.reserve-head h2{
  max-width:520px;
  margin:0;
  color:rgba(10,10,10,.58);
  font-size:16px;
  line-height:1.35;
  font-weight:850;
  letter-spacing:-.015em;
}
.reserve-o2-grid{
  display:grid;
  grid-template-columns:.86fr 1.14fr;
  gap:42px;
  align-items:center;
  position:relative;
  overflow:hidden;
  border-radius:34px;
  padding:clamp(34px,5vw,62px);
  background:#f3f3f0;
  box-shadow:0 24px 70px -50px rgba(0,0,0,.55);
}
.reserve-o2-grid::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(10,10,10,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(10,10,10,.055) 1px,transparent 1px);
  background-size:175px 175px;
  pointer-events:none;
}
.reserve-o2-grid > *{
  position:relative;
  z-index:1;
}
.reserve-o2-copy h3{
  margin:22px 0 0;
  max-width:760px;
  font-size:clamp(46px,6.6vw,108px);
  line-height:.83;
  letter-spacing:-.082em;
  font-weight:950;
}
.reserve-o2-copy h3 em{
  font-style:italic;
  color:transparent;
  -webkit-text-stroke:1.5px rgba(10,10,10,.4);
  text-stroke:1.5px rgba(10,10,10,.4);
}
.reserve-o2-copy p{
  max-width:520px;
  margin:26px 0 0;
  color:#5f5f58;
  font-size:20px;
  line-height:1.42;
}
.reserve-o2-media{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  min-height:500px;
}
.reserve-o2-media .hero-studio-card{
  min-height:500px;
}

/* Notre formule · page header uses reserved Option 02 studio proof direction */
.method-hero-o2{
  background:#deded7 !important;
  border-bottom:0 !important;
  padding-top:clamp(104px,12vh,142px) !important;
  padding-bottom:44px !important;
}
.method-o2-grid{
  background:#DEDED7 !important;
  box-shadow:0 28px 84px -54px rgba(0,0,0,.62);
}
.method-o2-copy .page-hero-crumbs{
  margin-bottom:20px;
}
.method-o2-copy h1{
  margin:22px 0 0;
  max-width:980px;
  font-size:clamp(38px,4.6vw,76px);
  line-height:.83;
  letter-spacing:-.082em;
  font-weight:950;
  color:#0a0a0a;
}
.method-o2-copy h1 .hl-grad{
  white-space:nowrap;
}
.method-o2-copy h1 .hl-grad .dot-ink{
  color:#0a0a0a !important;
  background:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  -webkit-text-fill-color:#0a0a0a !important;
  font-style:normal !important;
  font-weight:inherit;
  padding:0;
  margin:0;
}
.method-o2-copy h1 em{
  font-style:italic;
  color:transparent;
  -webkit-text-stroke:1.5px rgba(10,10,10,.4);
  text-stroke:1.5px rgba(10,10,10,.4);
  padding:.03em .06em .14em;
  margin:-.03em -.04em -.1em;
}
.method-o2-actions{
  margin-top:24px;
}
.method-o2-actions .btn-dark{
  padding:6px 22px 6px 7px;
}
.btn-pill.btn-dark{
  background:#0a0a0a !important;
  color:#fff !important;
}
.btn-pill.btn-dark:hover{
  background:#1a1a1a !important;
  color:#fff !important;
}
.btn-avatar{
  position:relative;
  width:34px;
  height:34px;
  border-radius:50%;
  flex-shrink:0;
  background:#fafaf8;
  box-shadow:0 0 0 2px rgba(255,255,255,.18);
}
.btn-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:50%;
}
.btn-avatar::after{
  content:"";
  position:absolute;
  right:-2px;
  bottom:-2px;
  width:14px;
  height:14px;
  border-radius:50%;
  background:#22e07a;
  border:2px solid #0a0a0a;
  box-shadow:0 0 0 1px rgba(34,224,122,.7), 0 0 10px rgba(34,224,122,.8);
  z-index:2;
}
.method-o2-media .hero-studio-card-caption b{
  font-size:clamp(18px,1.8vw,26px);
}
.method-o2-media .hero-studio-card{
  border:1px solid #0a0a0a !important;
}
/* Match the agenda side card to the "machine" main card (same size + same color) */
.method-o2-media .hero-studio-card-side{
  aspect-ratio:9/16;
  min-height:500px;
  max-height:720px;
  margin-inline:auto;
  width:100%;
}
.method-o2-media .vertical-agenda-card{
  background:#DEDED7 !important;
}
/* Match the agenda caption to the "machine" main card caption without green glow */
.method-o2-media .vertical-agenda-card .hero-studio-card-caption{
  background:#111 !important;
  border:1px solid #000 !important;
  box-shadow:none;
  padding:13px !important;
  left:16px !important;
  right:16px !important;
  bottom:16px !important;
}
/* Match the "machine se lance" caption to the agenda caption — fully opaque black */
.method-o2-media .hero-studio-card-main .hero-studio-card-caption{
  background:#111 !important;
  border:1px solid #000 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  padding:13px !important;
  left:16px !important;
  right:16px !important;
  bottom:16px !important;
}
.nowrap{white-space:nowrap}
.method-o2-media .vertical-agenda .va-day{
  color:rgba(10,10,10,.64);
}
.method-o2-media .vertical-agenda .va-row{
  background:rgba(10,10,10,.045);
  border-color:rgba(10,10,10,.08);
}
/* Dark-theme RDV/Deal chips */
.method-o2-media .vertical-agenda .va-chip.booked{
  background:rgba(10,10,10,.85);
  color:#eaeaea;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:none;
}
.method-o2-media .vertical-agenda .va-chip.closed{
  background:var(--green,#28ae60);
  color:#fff;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:none;
}
@media (max-width:980px){
  .method-o2-grid{
    grid-template-columns:1fr;
  }
  .method-o2-media{
    grid-template-columns:1fr;
    min-height:0;
  }
  .method-o2-media .hero-studio-card{
    min-height:360px;
  }
  .method-o2-media .hero-studio-card-side{
    transform:none;
  }
}
@media (max-width:560px){
  .method-o2-copy h1{
    font-size:clamp(30px,9vw,48px);
  }
  .method-o2-actions .btn-pill{
    width:100%;
    justify-content:center;
  }
}
@media (max-width:1080px){
  .hero-option6 .hero-studio-inner{
    grid-template-columns:1fr !important;
  }
}
@media (max-width:980px){
  .hero-option6 .hero-studio-visual.hero-phone-visual{
    min-height:640px !important;
  }
  .hero-option6 .hero-phone-visual .phone-brand-card.card-c{
    right:2% !important;
  }
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-a{
    left:2% !important;
  }
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-b{
    right:18% !important;
  }
  .hero-phone-shell{
    left:50%;
    right:auto;
    transform:translateX(-50%) rotate(1deg);
  }
  .hero-phone-bubble{
    left:7%;
    bottom:6%;
  }
.hero-phone-proof{
    right:6%;
    bottom:0;
  }
  .reserve-o2-grid{
    grid-template-columns:1fr;
  }
  .reserve-o2-media{
    grid-template-columns:1fr;
    min-height:0;
  }
  .reserve-o2-media .hero-studio-card{
    min-height:360px;
  }
  .reserve-o2-media .hero-studio-card-side{
    transform:none;
  }
}

/* HERO PHONE · EXACT COPY OF APPLY CTA MOCKUP */
.hero-option6 .hero-phone-visual.phone-form-mock{
  min-height:660px !important;
  display:grid !important;
  place-items:center !important;
  position:relative !important;
  isolation:isolate !important;
}
.hero-option6 .hero-phone-visual.phone-form-mock::before{
  width:min(430px,82%) !important;
  height:88% !important;
  right:7% !important;
  top:6% !important;
  border-radius:58px !important;
}
.hero-option6 .hero-phone-visual.phone-form-mock::after{
  width:330px !important;
  height:330px !important;
  right:4% !important;
  bottom:0 !important;
}
.hero-option6 .hero-phone-visual .phone-brand-card.card-c{
  right:2% !important;
  top:10% !important;
  z-index:4 !important;
}
.hero-option6 .hero-phone-visual .phone-shadow-card.card-a{
  left:2% !important;
  top:23% !important;
}
.hero-option6 .hero-phone-visual .phone-shadow-card.card-b{
  right:2% !important;
  bottom:30% !important;
}
.hero-option6 .hero-phone-visual .phone-shell{
  width:min(342px,88vw) !important;
  transform:rotate(-1.5deg) translateY(6px) !important;
}
@media (max-width:980px){
  .hero-option6 .hero-phone-visual.phone-form-mock{
    min-height:694px !important;
  }
}

/* NAVBAR · BLACK RESTORE */
.tdb-hdr-inner{
  background:rgba(7,7,6,.88) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:24px !important;
  box-shadow:0 24px 58px -38px rgba(0,0,0,.85) !important;
  backdrop-filter:blur(18px) saturate(1.08) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.08) !important;
}
.tdb-nav a{
  color:rgba(255,255,255,.82) !important;
}
.tdb-nav a:hover{
  color:#fff !important;
  background:rgba(255,255,255,.075) !important;
}
.tdb-nav a::after{
  background:#28ae60 !important;
}
.philippe-btn.contact-tdb-btn{
  background:#28ae60 !important;
  color:#fff !important;
  border:1px solid rgba(40,174,96,.55) !important;
  box-shadow:0 18px 40px -26px rgba(40,174,96,.75) !important;
}
.philippe-btn.contact-tdb-btn:hover{
  border-color:rgba(255,255,255,.28) !important;
  box-shadow:0 20px 44px -24px rgba(40,174,96,.95) !important;
}
.tdb-burger span{
  background:#fafaf8 !important;
}

/* NAVBAR · per-path morph: vertical letters decompose, horizontal letters assemble */
.tdb-logo--morph{
  width:145px !important;
  height:42px !important;
  transition:none !important;
}
.tdb-logo--morph .logo-frame{
  transition:opacity .5s ease !important;
  transform:none !important;
}
.tdb-logo--morph svg.logo-svg{
  width:100% !important;
  height:100% !important;
  display:block;
  overflow:visible;
  fill:#fafaf8;
}
.tdb-logo--morph svg.logo-svg path{
  fill:#fafaf8 !important;
  transform-box:fill-box;
  transform-origin:center;
  transition:transform .85s cubic-bezier(.65,-0.05,.25,1.2),
             opacity .55s cubic-bezier(.4,0,.2,1);
  will-change:transform,opacity;
}
/* Vertical logo = <img> (tour-vertical.webp). Simple fade between states. */
.tdb-logo--morph img.logo-v{
  width:100% !important;
  height:100% !important;
  display:block;
  object-fit:contain;
  object-position:center;
  transition:opacity .45s cubic-bezier(.4,0,.2,1),
             transform .55s cubic-bezier(.65,-0.05,.25,1.2);
}
/* Horizontal logo = GIF (animates itself, freezes on last frame via JS swap) */
.tdb-logo--morph img.logo-h{
  width:100% !important;
  height:100% !important;
  display:block;
  object-fit:contain;
  object-position:left center;
  transition:opacity .45s cubic-bezier(.4,0,.2,1);
}
/* Vertical logo only — always visible */
.tdb-logo--morph .logo-frame-v{opacity:1 !important}
.tdb-logo--morph .logo-frame-h{display:none !important}
.tdb-hdr.is-horizontal .tdb-logo--morph .logo-frame-v{opacity:1 !important}
.tdb-hdr.is-horizontal .tdb-logo--morph img.logo-v{transform:none}
.tdb-hdr.is-horizontal .tdb-logo--morph .logo-frame-h{display:none !important}
/* Stagger + scatter vectors (cycle through 8 variants per path) */
.tdb-logo--morph svg.logo-svg path:nth-child(8n+1){--sx:-180px;--sy:-90px;--sr:-22deg;transition-delay:.00s}
.tdb-logo--morph svg.logo-svg path:nth-child(8n+2){--sx: 160px;--sy:-110px;--sr: 18deg;transition-delay:.04s}
.tdb-logo--morph svg.logo-svg path:nth-child(8n+3){--sx:-120px;--sy: 130px;--sr: 28deg;transition-delay:.08s}
.tdb-logo--morph svg.logo-svg path:nth-child(8n+4){--sx: 200px;--sy: 80px;--sr:-16deg;transition-delay:.12s}
.tdb-logo--morph svg.logo-svg path:nth-child(8n+5){--sx:-220px;--sy: 40px;--sr: 12deg;transition-delay:.16s}
.tdb-logo--morph svg.logo-svg path:nth-child(8n+6){--sx: 120px;--sy:-160px;--sr:-26deg;transition-delay:.20s}
.tdb-logo--morph svg.logo-svg path:nth-child(8n+7){--sx:-80px; --sy: 180px;--sr: 20deg;transition-delay:.24s}
.tdb-logo--morph svg.logo-svg path:nth-child(8n+8){--sx: 80px; --sy: 160px;--sr:-14deg;transition-delay:.28s}

@media (max-width:780px){
  .tdb-logo--morph{
    width:114px !important;
    height:37px !important;
  }
}
@media (prefers-reduced-motion:reduce){
  .tdb-logo--morph svg.logo-svg path{
    transition:opacity .25s ease !important;
    transform:none !important;
  }
}

/* HERO PHONE · MATCH APPLY CTA ASSET CLUSTER WIDTH */
.hero-option6 .hero-phone-visual.phone-form-mock{
  width:min(620px,100%) !important;
  justify-self:center !important;
  overflow:visible !important;
}
.hero-option6 .hero-phone-visual.phone-form-mock::before{
  right:7% !important;
}
.hero-option6 .hero-phone-visual .phone-brand-card.card-c{
  right:2% !important;
  top:10% !important;
  opacity:1 !important;
}
.hero-option6 .hero-phone-visual .phone-shadow-card.card-a{
  left:2% !important;
  top:23% !important;
  opacity:1 !important;
}
.hero-option6 .hero-phone-visual .phone-shadow-card.card-b{
  right:18% !important;
  bottom:17% !important;
  opacity:1 !important;
}

/* HERO PHONE · PIXEL-LOCK ASSETS AROUND PHONE LIKE BOTTOM CTA */
.hero-option6 .hero-phone-visual.phone-form-mock{
  width:min(430px,100%) !important;
  min-width:min(430px,100%) !important;
}
.hero-option6 .hero-phone-visual .phone-shell{
  position:relative !important;
  z-index:3 !important;
}
.hero-option6 .hero-phone-visual .phone-brand-card.card-c{
  right:-58px !important;
  top:76px !important;
  background:rgba(22,34,28,.86) !important;
  border-color:rgba(255,255,255,.18) !important;
  color:#fff !important;
  z-index:5 !important;
}
.hero-option6 .hero-phone-visual .phone-shadow-card.card-a{
  left:-112px !important;
  top:138px !important;
  background:rgba(35,35,34,.92) !important;
  border-color:rgba(255,255,255,.18) !important;
  color:#fff !important;
  z-index:5 !important;
}
.hero-option6 .hero-phone-visual .phone-shadow-card.card-b{
  right:-55px !important;
  bottom:118px !important;
  background:#fafaf8 !important;
  color:#0a0a0a !important;
  z-index:5 !important;
}
.hero-option6 .hero-phone-visual.phone-form-mock::before{
  right:-18px !important;
}
.hero-option6 .hero-phone-visual.phone-form-mock::after{
  right:-36px !important;
}

/* PHONE BUTTONS · IPHONE INCOMING CALL FINAL LOCK */
.phone-nav-btn:not(.next)::before,
.phone-nav-btn:not(.next)::after{
  content:none !important;
}
.phone-nav-btn.next::before,
.phone-nav-btn.next::after{
  content:"" !important;
  position:absolute !important;
  top:-7px !important;
  left:-7px !important;
  right:-7px !important;
  bottom:-7px !important;
  border-radius:50% !important;
  border:1.5px solid rgba(40,185,87,.48) !important;
  animation:phoneIncomingPulse 1.55s ease-out infinite !important;
  pointer-events:none !important;
}
.phone-nav-btn.next::after{
  animation-delay:.55s !important;
}
.phone-nav-btn .call-label{
  position:absolute !important;
  left:50% !important;
  top:calc(100% + 7px) !important;
  transform:translateX(-50%) !important;
  color:rgba(255,255,255,.72) !important;
  font-size:9.5px !important;
  line-height:1 !important;
  font-weight:850 !important;
  letter-spacing:.01em !important;
  text-transform:lowercase !important;
  white-space:nowrap !important;
  pointer-events:none !important;
}
.hero-option6 .hero-phone-visual .phone-shell{
  transform:rotate(-1.5deg) translateY(6px) !important;
}

/* NAV CTA · ROUND FACE AVATAR STATUS */
.philippe-btn.contact-tdb-btn .ph-photo.ph-face{
  width:34px !important;
  height:34px !important;
  border-radius:50% !important;
  overflow:visible !important;
  background:transparent !important;
  border:2px solid var(--green) !important;
  box-shadow:0 0 0 1px var(--green) !important;
}
.philippe-btn.contact-tdb-btn .ph-photo.ph-face img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  border-radius:50% !important;
  object-fit:cover !important;
  object-position:center 20% !important;
  padding:0 !important;
  background:transparent !important;
}
.philippe-btn.contact-tdb-btn .ph-photo.ph-face::after{
  right:-2px !important;
  bottom:-2px !important;
  width:12px !important;
  height:12px !important;
  border-radius:50% !important;
  background:#22e07a !important;
  border:2px solid #0a0a0a !important;
  box-shadow:0 0 0 1px rgba(34,224,122,.6), 0 0 8px rgba(34,224,122,.65) !important;
}

/* HERO PHONE · NEUTRAL CARD + ORIGINAL ANGLE */
.hero-option6 .hero-phone-visual .phone-shell{
  transform:rotate(1.5deg) translateY(6px) !important;
}
.hero-option6 .hero-phone-visual .phone-brand-card.card-c{
  background:rgba(42,42,40,.94) !important;
  border-color:rgba(255,255,255,.2) !important;
  color:#fff !important;
  box-shadow:0 24px 56px -34px rgba(0,0,0,.82) !important;
}
.hero-option6 .hero-phone-visual.phone-form-mock::before{
  background:
    radial-gradient(circle at 50% 16%,rgba(42,42,40,.08),transparent 32%),
    rgba(42,42,40,.035) !important;
  border-color:rgba(42,42,40,.11) !important;
  box-shadow:0 0 90px rgba(42,42,40,.08) !important;
}
.hero-option6 .hero-phone-visual.phone-form-mock::after{
  background:rgba(42,42,40,.10) !important;
}
.hero-option6 .hero-phone-visual.phone-form-mock{
  transform:translateX(34px) !important;
}
@media (max-width:980px){
  .hero-option6 .hero-phone-visual.phone-form-mock{
    transform:none !important;
  }
}

/* HERO TICKER · TIGHTEN TOP GAP */
.ticker-wrap.hero-ticker{
  margin:-10px auto 38px !important;
  padding:0 !important;
  max-width:min(1280px,calc(100vw - 88px)) !important;
}

/* FORMULE PAGE · CLOSING NOTE */
.formula-note{
  max-width:760px;
  margin:18px auto 0;
  padding:14px 18px;
  border-radius:999px;
  background:#0a0a0a;
  color:#fff;
  font-size:15px;
  line-height:1.35;
  font-weight:800;
  letter-spacing:-.01em;
  box-shadow:0 22px 58px -40px rgba(0,0,0,.85);
}
.formula-note::before{
  content:"";
  display:inline-block;
  width:9px;
  height:9px;
  margin-right:9px;
  border-radius:2px;
  background:#28ae60;
  vertical-align:1px;
}
@media (max-width:680px){
  .formula-note{
    border-radius:22px;
    font-size:14px;
  }
}

/* HOME · NARRATIVE BRIDGE AFTER PROOF */
.home-bridge{
  margin:-10px 0 6px;
}
.home-bridge .wrap{
  display:flex;
  justify-content:center;
}
.home-bridge p{
  display:flex;
  align-items:center;
  gap:10px;
  max-width:820px;
  margin:0;
  padding:14px 20px;
  border:1px solid rgba(10,10,10,.1);
  border-radius:999px;
  background:rgba(255,255,255,.72);
  color:rgba(10,10,10,.7);
  font-size:15px;
  line-height:1.35;
  font-weight:750;
  letter-spacing:-.01em;
  box-shadow:0 18px 46px -38px rgba(0,0,0,.45);
}
.home-bridge p span{
  width:9px;
  height:9px;
  border-radius:2px;
  background:#28ae60;
  flex:0 0 auto;
}
@media (max-width:680px){
  .home-bridge{
    margin:4px 0 10px;
  }
  .home-bridge p{
    align-items:flex-start;
    border-radius:22px;
    font-size:14px;
  }
  .home-bridge p span{
    margin-top:5px;
  }
}

/* FOOTER · SIMPLE PALE VERSION */
.tdb-footer{
  padding:30px 0 42px !important;
  background:#f3f2ee !important;
  border-top:1px solid rgba(10,10,10,.08) !important;
  color:#0a0a0a !important;
}
.tdb-footer::before{
  content:none !important;
}
.tdb-footer .footer-bottom{
  width:min(calc(100% - clamp(40px,7vw,112px)),1280px) !important;
  margin:0 auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:22px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.tdb-footer .footer-logo{
  height:46px !important;
  width:auto !important;
  flex:0 0 auto !important;
}
.tdb-footer .footer-logo--lp{
  filter:invert(1) brightness(.1) !important;
}
.tdb-footer .footer-nav{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  flex-wrap:wrap !important;
  margin:0 auto !important;
}
.tdb-footer .footer-nav a{
  color:rgba(10,10,10,.66) !important;
  text-decoration:none !important;
  font-size:13px !important;
  font-weight:750 !important;
  line-height:1 !important;
  padding:10px 12px !important;
  border-radius:999px !important;
  background:transparent !important;
  border:1px solid transparent !important;
}
.tdb-footer .footer-nav a:hover{
  color:#0a0a0a !important;
  background:#fafaf8 !important;
  border-color:rgba(10,10,10,.08) !important;
}
.tdb-footer .footer-meta{
  color:rgba(10,10,10,.48) !important;
  font-size:12px !important;
  font-weight:700 !important;
  white-space:nowrap !important;
  text-align:right !important;
}
@media (max-width:860px){
  .tdb-footer .footer-bottom{
    flex-direction:column !important;
    justify-content:center !important;
    text-align:center !important;
  }
  .tdb-footer .footer-meta{
    text-align:center !important;
  }
}

/* CONTACT · hero synced with final phone-form mockup */
/* CONTACT · phone inherits home (.hero-option6) styles via shared classes */

.hero-sale-green{
  display:inline-block;
  color:var(--green);
  background:linear-gradient(180deg,#5fd38a 0%,#28ae60 55%,#1d8a4b 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  -webkit-text-stroke:0;
  text-stroke:0;
  line-height:1.04;
  padding-right:.11em;
  margin-right:-.08em;
}
.hero-studio-h1 .hero-industry{
  display:block;
  width:max-content;
  max-width:none;
  white-space:nowrap;
  line-height:1;
  margin-top:.02em;
  color:transparent;
  -webkit-text-fill-color:transparent;
  -webkit-text-stroke:1.5px rgba(10,10,10,.4);
  text-stroke:1.5px rgba(10,10,10,.4);
}
.brand-hero-o4 .hero-studio-h1 .hero-industry{
  width:auto;
  max-width:100%;
  white-space:normal;
}
.brand-hero-o4 .hero-studio-h1{
  font-size:clamp(38px,4.6vw,76px);
  max-width:980px;
}
.hero-studio-h1 .hero-dot{
  display:inline !important;
  color:#28ae60 !important;
  -webkit-text-fill-color:#28ae60 !important;
  -webkit-text-stroke:0 !important;
  text-stroke:0 !important;
}
.hero-studio-h1 .hero-nowrap{
  white-space:nowrap;
}
.phone-form-mock .phone-google-rating,
.hero-option6 .hero-phone-visual .phone-google-rating{
  display:inline-flex !important;
  align-items:center;
  gap:4px;
  padding:12px 15px !important;
  background:#fafaf8 !important;
  border-color:rgba(40,174,96,.25) !important;
  box-shadow:0 18px 46px -30px rgba(0,0,0,.65),0 0 0 7px rgba(40,174,96,.08) !important;
  font-weight:950;
}
.phone-form-mock .phone-google-rating b,
.hero-option6 .hero-phone-visual .phone-google-rating b{
  font-size:24px;
  line-height:1;
  letter-spacing:-.06em;
}
.phone-form-mock .phone-google-rating span,
.hero-option6 .hero-phone-visual .phone-google-rating span{
  font-size:19px;
  line-height:1;
  transform:translateY(-1px);
}
.hero-option6 .hero-phone-visual .phone-google-rating span{
  color:#fff;
}
.applycta .phone-form-mock .phone-google-rating b,
.applycta .phone-form-mock .phone-google-rating span{
  color:#0a0a0a;
}
.phone-form-mock .phone-google-rating i,
.hero-option6 .hero-phone-visual .phone-google-rating i{
  display:inline-block;
  background:conic-gradient(from -35deg,#4285f4 0 25%,#34a853 0 45%,#fbbc05 0 65%,#ea4335 0 82%,#4285f4 0 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  font-style:normal;
  font-size:24px;
  line-height:1;
  font-weight:950;
  font-family:Arial,sans-serif;
  margin-right:4px;
}

/* Contact page: larger Mapbox + useful contact details */
.contact-map-section{
  padding:32px 0 92px;
  background:var(--bg);
}
.page-hero:has(+ .contact-map-section){
  border-bottom:0 !important;
}
/* CONTACT · réduire la taille du H1 pour éviter trop de retours à la ligne */
.contact-hero-phone ~ * .page-hero-title,
section.page-hero:has(.contact-hero-phone) .page-hero-title{
  font-size:clamp(30px,3.6vw,54px) !important;
}
section.page-hero:has(.contact-hero-phone) .page-hero-title :where(em,.hl-grad,.hl-out){
  display:inline !important;
}
.contact-map-card{
  display:grid;
  grid-template-columns:minmax(340px,.8fr) minmax(0,1.2fr);
  gap:24px;
  align-items:stretch;
  background:#10100d;
  color:#fff;
  border-radius:34px;
  padding:clamp(18px,2vw,28px);
  overflow:hidden;
  box-shadow:0 28px 80px rgba(0,0,0,.18);
}
.contact-map-copy{
  padding:clamp(16px,2.2vw,28px);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:28px;
}
.contact-map-copy .lead{
  color:rgba(255,255,255,.72);
  max-width:46ch;
}
.contact-map-copy .h2{
  color:#fff;
  max-width:10ch;
}
.contact-map-copy .hero-studio-h1,
.contact-map-copy .hero-studio-h1 *{
  color:#fff;
}
.contact-map-copy .hero-studio-h1 .hero-industry{
  -webkit-text-stroke:1.6px rgba(255,255,255,.55);
  color:transparent;
}
.contact-map-copy .hero-studio-h1 .hero-bureau-grad{
  background:linear-gradient(90deg,#28ae60 0%,#7be495 50%,#28ae60 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
}
.contact-info-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.contact-info-tile{
  min-height:132px;
  padding:18px;
  border-radius:22px;
  background:rgba(255,255,255,.075);
  border:1px solid rgba(255,255,255,.11);
  color:#fff;
  text-decoration:none;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  transition:transform .25s ease, background .25s ease, border-color .25s ease;
}
.contact-info-tile:hover{
  transform:translateY(-3px);
  background:rgba(255,255,255,.11);
  border-color:rgba(40,174,96,.42);
}
.contact-info-tile span{
  color:var(--green-soft);
  font-size:11px;
  letter-spacing:.11em;
  text-transform:uppercase;
  font-weight:900;
}
.contact-info-tile b{
  font-size:clamp(15px,1.15vw,18px);
  line-height:1.22;
  letter-spacing:-.03em;
}
.contact-map-visual{
  min-height:620px;
  border-radius:28px;
  overflow:hidden;
  position:relative;
  background:#151a17;
}
.contact-mapbox{
  width:100%;
  height:100%;
  min-height:620px;
  border:1px solid rgba(255,255,255,.12);
}
@media (max-width:980px){
  .contact-map-card{grid-template-columns:1fr}
  .contact-map-copy .h2{max-width:12ch}
  .contact-map-visual,.contact-mapbox{min-height:440px}
}
@media (max-width:640px){
  .contact-info-grid{grid-template-columns:1fr}
  .contact-map-card{border-radius:28px;padding:14px}
  .contact-map-copy{padding:14px}
}

/* SAFETY · sections should never disappear if scroll reveal is not triggered by the preview frame */
.rv{
  opacity:1 !important;
  transform:none !important;
}

/* ===================== HOME FLOW 01 APPLIED · DARK/LIGHT SMOOTHING ===================== */
body:not(.flow-option) .stat-wrap,
body:not(.flow-option) .trust-bar,
body:not(.flow-option) .promesse-section,
body:not(.flow-option) .guarantee{
  background:#eee9dd !important;
}
body:not(.flow-option) .stat-wrap{
  position:relative;
  padding-top:54px !important;
  padding-bottom:20px !important;
}
body:not(.flow-option) .stat-wrap::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:rgba(10,10,10,.08);
  pointer-events:none;
}
body:not(.flow-option) .trust-bar{
  border-top:0 !important;
  border-bottom:0 !important;
  padding-top:18px !important;
  padding-bottom:34px !important;
}
body:not(.flow-option) .promesse-section{
  position:relative;
  padding-top:76px !important;
  padding-bottom:42px !important;
}
body:not(.flow-option) .promesse-section::before{
  content:none !important;
}
body:not(.flow-option) .promesse-section .wrap,
body:not(.flow-option) .guarantee .wrap{
  position:relative;
  z-index:1;
}
body:not(.flow-option) .promise-band{
  box-shadow:0 44px 100px -62px rgba(10,10,10,.86) !important;
}
body:not(.flow-option) .promise-band::after{
  border-color:rgba(0,0,0,.42) !important;
}
body:not(.flow-option) .guarantee{
  padding-top:34px !important;
  padding-bottom:92px !important;
}
body:not(.flow-option) .guarantee-card{
  background:rgba(255,255,255,.78) !important;
  border-color:rgba(10,10,10,.08) !important;
  box-shadow:0 32px 80px -58px rgba(10,10,10,.36) !important;
}
body:not(.flow-option) .brandsection{
  border-top:1px solid rgba(255,255,255,.08);
}
body:not(.flow-option) .ticker-wrap.hero-ticker{
  margin-top:-42px !important;
  padding-top:0 !important;
}

/* Philippe · latest home contrast pass */
body:not(.flow-option) .stat-wrap,
body:not(.flow-option) .trust-bar{
  background:#0a0a0a !important;
}
body:not(.flow-option) .stat-wrap::before{
  background:rgba(255,255,255,.08) !important;
}
body:not(.flow-option) .trust-lbl{
  color:rgba(255,255,255,.58) !important;
}
body:not(.flow-option) .trust-cta{
  color:#fff !important;
}
body:not(.flow-option) .promesse-section{
  background:#f3f3f0 !important;
}
body:not(.flow-option) .brandsection{
  isolation:isolate;
}
body:not(.flow-option) .brandsection::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 14% 14%,rgba(40,174,96,.19),transparent 28%),
    radial-gradient(circle at 78% 42%,rgba(40,174,96,.13),transparent 28%),
    linear-gradient(90deg,rgba(255,255,255,.05),transparent 55%);
  pointer-events:none;
  z-index:0;
}
body:not(.flow-option) .brandsection .wrap{
  position:relative;
  z-index:1;
}

/* Philippe · home simplification: all sections back to hero sable, except final CTA */
body:not(.flow-option) .hero-cards-band,
body:not(.flow-option) .stat-wrap,
body:not(.flow-option) .trust-bar,
body:not(.flow-option) .promesse-section,
body:not(.flow-option) .guarantee,
body:not(.flow-option) .faq,
body:not(.flow-option) .ticker-wrap.hero-ticker{
  background:#f3f3f0 !important;
}
body:not(.flow-option) .stat-wrap::before{
  background:rgba(10,10,10,.08) !important;
}
body:not(.flow-option) .trust-lbl{
  color:var(--muted) !important;
}
body:not(.flow-option) .trust-cta{
  color:var(--ink) !important;
}
body:not(.flow-option) .applycta{
  background:#0a0a0a !important;
}

/* Home · tighten transition from hero cards to 100M section */
body:not(.flow-option) .hero-cards-band{
  padding-bottom:24px !important;
}
body:not(.flow-option) .stat-wrap{
  padding-top:24px !important;
}
body:not(.flow-option) .stat-wrap::before{
  display:none !important;
  content:none !important;
}
body:not(.flow-option) .trust-bar{
  padding-top:24px !important;
  padding-bottom:38px !important;
}
body:not(.flow-option) .trust-bar .wrap{
  align-items:stretch !important;
  gap:18px !important;
}
body:not(.flow-option) .mini-case-row{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:16px !important;
}
body:not(.flow-option) .mini-case-row article{
  min-height:165px !important;
  padding:22px !important;
  border-radius:24px !important;
  box-shadow:0 28px 60px -42px rgba(10,10,10,.32) !important;
}
body:not(.flow-option) .mini-case-row b{
  font-size:clamp(28px,2.6vw,40px) !important;
  white-space:nowrap !important;
}
body:not(.flow-option) .mini-case-row small{
  font-size:13px !important;
}
body:not(.flow-option) .trust-cta{
  min-height:142px !important;
  margin-bottom:0 !important;
  display:flex !important;
  align-items:flex-end !important;
  justify-content:center !important;
  padding-bottom:8px !important;
}
@media (max-width:1100px){
  body:not(.flow-option) .trust-bar .wrap{
    grid-template-columns:1fr !important;
  }
  body:not(.flow-option) .mini-case-row{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  body:not(.flow-option) .trust-cta{
    min-height:72px !important;
  }
}
@media (max-width:680px){
  body:not(.flow-option) .mini-case-row{
    grid-template-columns:1fr !important;
  }
}

/* iPhone visual cue · bottom home indicator on every phone mockup */
.phone-screen,
.hero-phone-screen,
.iphone-screen,
.phone-review-screen{
  position:relative;
}
.phone-screen::after,
.hero-phone-screen::after,
.iphone-screen::after,
.phone-review-screen::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:13px;
  width:92px;
  height:5px;
  border-radius:999px;
  transform:translateX(-50%);
  background:rgba(255,255,255,.92);
  box-shadow:
    0 0 0 1px rgba(0,0,0,.08),
    0 4px 12px rgba(0,0,0,.2);
  pointer-events:none;
  z-index:12;
}
body:not(.flow-option) .hero-option6 .phone-screen::after{
  content:none !important;
  display:none !important;
}
.phone-screen,
.hero-phone-screen,
.iphone-screen,
.phone-review-screen{
  padding-bottom:max(30px, env(safe-area-inset-bottom)) !important;
}

/* Philippe · guarantee moved before 14-day promise and restyled like final strategic CTA */
body:not(.flow-option) .guarantee{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:#0a0a0a !important;
  color:#fff !important;
  padding-top:96px !important;
  padding-bottom:96px !important;
}
body:not(.flow-option) .guarantee::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:175px 175px;
  background-position:center top;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.95),transparent 88%);
  mask-image:linear-gradient(180deg,rgba(0,0,0,.95),transparent 88%);
  pointer-events:none;
  z-index:0;
}
body:not(.flow-option) .guarantee::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 14% 14%,rgba(40,174,96,.22),transparent 28%),
    radial-gradient(circle at 80% 46%,rgba(40,174,96,.14),transparent 30%),
    linear-gradient(90deg,rgba(255,255,255,.05),transparent 55%);
  pointer-events:none;
  z-index:0;
}
body:not(.flow-option) .guarantee .wrap{
  position:relative;
  z-index:1;
}
body:not(.flow-option) .guarantee .section-head{
  margin-bottom:28px;
}
body:not(.flow-option) .guarantee .pill-section{
  align-self:flex-start;
  color:rgba(255,255,255,.72) !important;
  background:rgba(255,255,255,.055) !important;
  border-color:rgba(255,255,255,.14) !important;
}
body:not(.flow-option) .guarantee .pill-section .sq{
  background:#28ae60 !important;
  box-shadow:0 0 0 6px rgba(40,174,96,.16) !important;
}
body:not(.flow-option) .guarantee .h2,
body:not(.flow-option) .guarantee-h{
  color:#fff !important;
}
body:not(.flow-option) .guarantee .section-head .h2{
  font-size:clamp(34px,4.4vw,64px) !important;
}
body:not(.flow-option) .guarantee .lead,
body:not(.flow-option) .guarantee-p{
  color:rgba(255,255,255,.68) !important;
}
body:not(.flow-option) .guarantee .h2 .hl-out,
body:not(.flow-option) .guarantee-h .hl-out{
  color:#fff !important;
  -webkit-text-stroke-color:rgba(255,255,255,.78) !important;
  text-stroke-color:rgba(255,255,255,.78) !important;
}
body:not(.flow-option) .guarantee .h2 .hl-grad,
body:not(.flow-option) .guarantee-h .hl-grad{
  background:linear-gradient(135deg,#fafaf8 0%,#89f0ac 45%,#28ae60 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  color:transparent !important;
}
body:not(.flow-option) .guarantee-card{
  background:#fafaf8 !important;
  border-color:rgba(10,10,10,.08) !important;
  color:var(--ink) !important;
  box-shadow:
    0 34px 100px -60px rgba(40,174,96,.5),
    0 24px 80px -56px rgba(0,0,0,.85) !important;
  backdrop-filter:none;
}
body:not(.flow-option) .guarantee-card .guarantee-h{
  color:var(--ink) !important;
}
body:not(.flow-option) .guarantee-card .guarantee-p{
  color:var(--muted) !important;
}
body:not(.flow-option) .guarantee-list li{
  color:#2a2a2a !important;
}
body:not(.flow-option) .guarantee-list li::before{
  background:rgba(40,174,96,.14) !important;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2328ae60' stroke-width='3' stroke-linecap='round'><polyline points='20 6 9 17 4 12'/></svg>") !important;
  background-size:12px !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
  box-shadow:none !important;
}
body:not(.flow-option) .guarantee-seal{
  color:var(--ink) !important;
}
body:not(.flow-option) .guarantee-seal svg circle:first-of-type{
  stroke:#0a0a0a !important;
}
body:not(.flow-option) .guarantee-seal svg circle:nth-of-type(2){
  stroke:#28ae60 !important;
}
body:not(.flow-option) .guarantee-seal svg text,
body:not(.flow-option) .guarantee-seal text{
  fill:#0a0a0a !important;
}
body:not(.flow-option) .guarantee-seal .seal-lbl{
  color:var(--ink) !important;
}
body:not(.flow-option) .guarantee-seal .seal-100{
  color:#28ae60 !important;
  text-shadow:none;
}

/* Home · dark sections should feel like rounded bands, not square full-bleed slabs */
body:not(.flow-option) #garantie.guarantee,
body:not(.flow-option) #applycta.applycta{
  width:min(calc(100% - clamp(40px,4.8vw,68px)),1280px) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  border-radius:34px !important;
  overflow:hidden !important;
}
body:not(.flow-option) #garantie.guarantee{
  margin-top:10px !important;
  margin-bottom:18px !important;
}
body:not(.flow-option) #applycta.applycta{
  margin-top:18px !important;
  margin-bottom:16px !important;
}
body:not(.flow-option) #garantie.guarantee,
body:not(.flow-option) #applycta.applycta{
  padding-top:68px !important;
  padding-bottom:96px !important;
}
body:not(.flow-option) #promesse .promise-band{
  width:100% !important;
  max-width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
  transform:none !important;
  overflow:visible !important;
}
@media (max-width:780px){
  body:not(.flow-option) #garantie.guarantee,
  body:not(.flow-option) #applycta.applycta{
    width:calc(100% - 20px) !important;
    border-radius:26px !important;
  }
  body:not(.flow-option) #promesse .promise-band{
    width:calc(100vw - 20px) !important;
  }
}

/* Page Formule — force la promise-band à matcher la largeur des cartes formule (1188px), centrée */
.page-formule body:not(.flow-option) #promesse .promise-band,
body.page-formule:not(.flow-option) #promesse .promise-band,
body:not(.flow-option) .page-formule #promesse .promise-band,
.page-formule #promesse .promise-band{
  width:100% !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
  transform:none !important;
  box-sizing:border-box !important;
}

/* Home phones · give incoming-call buttons more breathing room above iPhone home indicator */
.hero-option6 .hero-phone-visual .phone-shell{
  transform:rotate(1.5deg) translateY(6px) !important;
}
.applycta .phone-form-mock .phone-shell{
  transform:rotate(1.5deg) translateY(6px) !important;
}
.hero-option6 .hero-phone-visual .phone-nav-controls,
.applycta .phone-form-mock .phone-nav-controls{
  margin:18px auto 0 !important;
}
.hero-option6 .hero-phone-visual .phone-nav-btn .call-label,
.applycta .phone-form-mock .phone-nav-btn .call-label{
  top:calc(100% + 3px) !important;
}
.hero-option6 .hero-phone-visual.phone-form-mock,
.applycta .phone-form-mock{
  min-height:790px !important;
}

/* HERO PHONE · Google badge overlaps the phone like bottom CTA */
.hero-option6 .hero-phone-visual .phone-shadow-card.card-a.phone-google-rating{
  left:-58px !important;
  top:158px !important;
  z-index:8 !important;
  transform:rotate(-5deg) !important;
}
.applycta-nowrap{
  display:inline-block;
  white-space:nowrap;
}

/* PHONE FORM · keep mockup size stable across all qualification questions */
.hero-option6 .hero-phone-visual .phone-shell,
.applycta .phone-form-mock .phone-shell{
  width:min(382px,88vw) !important;
  height:708px !important;
  max-height:708px !important;
  overflow:visible !important;
}
.hero-option6 .hero-phone-visual .phone-screen,
.applycta .phone-form-mock .phone-screen{
  height:678px !important;
  min-height:678px !important;
  max-height:678px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
  box-sizing:border-box !important;
  padding-bottom:22px !important;
}
.hero-option6 .hero-phone-visual .phone-call-profile,
.applycta .phone-form-mock .phone-call-profile{
  min-height:0 !important;
  gap:6px !important;
  padding-top:4px !important;
}
.hero-option6 .hero-phone-visual .phone-options,
.applycta .phone-form-mock .phone-options{
  min-height:0 !important;
  align-content:start !important;
  gap:8px !important;
  margin-top:6px !important;
}
.hero-option6 .hero-phone-visual .phone-options span,
.applycta .phone-form-mock .phone-options span{
  padding:10px 13px !important;
}
.hero-option6 .hero-phone-visual .phone-step-label,
.applycta .phone-form-mock .phone-step-label{
  margin-top:12px !important;
}
.hero-option6 .hero-phone-visual .phone-progress,
.applycta .phone-form-mock .phone-progress{
  margin:4px auto 8px !important;
}
.hero-option6 .hero-phone-visual .phone-nav-controls,
.applycta .phone-form-mock .phone-nav-controls{
  flex-shrink:0 !important;
}
.hero-option6 .hero-phone-visual .phone-nav-btn,
.applycta .phone-form-mock .phone-nav-btn{
  width:64px !important;
  height:64px !important;
}
@media (max-width:980px){
  .hero-option6 .hero-phone-visual .phone-shell,
  .applycta .phone-form-mock .phone-shell{
    transform:rotate(1deg) translateY(4px) scale(1.02) !important;
  }
  .hero-option6 .hero-phone-visual.phone-form-mock,
  .applycta .phone-form-mock{
    min-height:690px !important;
  }
}

/* PHONE FLOATING CARDS · exact same dark treatment as Formulaire TDB */
.hero-option6 .hero-phone-visual .phone-shadow-card.card-a.phone-google-rating,
.applycta .phone-form-mock .phone-shadow-card.card-a.phone-google-rating,
.hero-option6 .hero-phone-visual .phone-shadow-card.card-b,
.applycta .phone-form-mock .phone-shadow-card.card-b{
  background:rgba(42,42,40,.94) !important;
  color:#fff !important;
  border-color:rgba(255,255,255,.2) !important;
  box-shadow:0 24px 56px -34px rgba(0,0,0,.82) !important;
  backdrop-filter:blur(16px) !important;
}
.hero-option6 .hero-phone-visual .phone-shadow-card.card-a.phone-google-rating b,
.hero-option6 .hero-phone-visual .phone-shadow-card.card-a.phone-google-rating span,
.applycta .phone-form-mock .phone-shadow-card.card-a.phone-google-rating b,
.applycta .phone-form-mock .phone-shadow-card.card-a.phone-google-rating span{
  color:#fff !important;
}

/* SITE GRID · slightly stronger background grid across sections */
.hero.hero-studio .hero-grid{
  background-image:
    linear-gradient(rgba(10,10,10,.078) 1px,transparent 1px) !important,
    linear-gradient(90deg,rgba(10,10,10,.078) 1px,transparent 1px) !important;
}
body:not(.flow-option) .hero-cards-band,
body:not(.flow-option) .stat-wrap,
body:not(.flow-option) .trust-bar,
body:not(.flow-option) .promesse-section,
body:not(.flow-option) .guarantee,
body:not(.flow-option) .faq{
  background-image:
    linear-gradient(rgba(10,10,10,.072) 1px,transparent 1px) !important,
    linear-gradient(90deg,rgba(10,10,10,.072) 1px,transparent 1px) !important;
  background-size:175px 175px !important;
  background-position:center top !important;
}
.brandsection::before,
.brandhero::before,
.os-section::before,
.bsys-reel-section::before,
.equipe::after,
.applycta::before,
.tdb-footer::before{
  background-image:
    linear-gradient(rgba(255,255,255,.062) 1px,transparent 1px) !important,
    linear-gradient(90deg,rgba(255,255,255,.062) 1px,transparent 1px) !important;
}
body:not(.flow-option) #promesse .promise-band{
  background:
    linear-gradient(rgba(255,255,255,.062) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.062) 1px,transparent 1px),
    radial-gradient(circle at 82% 7%,rgba(40,174,96,.28),transparent 32%),
    radial-gradient(circle at 10% 100%,rgba(255,255,255,.08),transparent 30%),
    linear-gradient(135deg,#181713 0%,#0c0c09 58%,#050505 100%) !important;
  background-size:175px 175px,175px 175px,auto,auto,auto !important;
  background-position:center top,center top,center,center,center !important;
}

/* ===================== FAQ OPTIONS PREVIEW ===================== */
.faq-options-preview{
  background:#f3f3f0;
}
.faq-options-preview .tdb-hdr{
  position:sticky;
}
.faq-option-hero{
  padding:150px 0 70px;
  background-image:
    linear-gradient(rgba(10,10,10,.078) 1px,transparent 1px),
    linear-gradient(90deg,rgba(10,10,10,.078) 1px,transparent 1px);
  background-size:175px 175px;
}
.faq-option-hero .h2{
  max-width:900px;
  margin-top:20px;
}
.faq-option-hero .lead{
  max-width:620px;
  margin-top:18px;
}
.faq-variant{
  padding:72px 0;
}
.faq-option-label{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:24px;
  padding:10px 14px;
  border:1px solid rgba(10,10,10,.12);
  border-radius:999px;
  background:#fafaf8;
  color:#0a0a0a;
  font-size:12px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.faq-option-label::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:2px;
  background:#28ae60;
}
.faq-option-label.dark{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.14);
  color:#fff;
}
.faq-a-layout{
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:clamp(34px,6vw,82px);
  align-items:start;
  padding:44px;
  border:1px solid rgba(10,10,10,.1);
  border-radius:36px;
  background:rgba(255,255,255,.62);
  box-shadow:0 34px 80px -62px rgba(10,10,10,.34);
}
.faq-a-copy{
  position:sticky;
  top:118px;
}
.faq-a-copy .h2{
  margin-top:18px;
}
.faq-a-copy .lead{
  margin-top:18px;
}
.faq-a-list{
  border-top:1px solid rgba(10,10,10,.12);
}
.faq-line{
  border-bottom:1px solid rgba(10,10,10,.12);
}
.faq-line summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:24px 0;
  cursor:pointer;
  font-size:clamp(19px,2vw,28px);
  line-height:1.02;
  letter-spacing:-.055em;
  font-weight:950;
}
.faq-line summary::-webkit-details-marker{display:none}
.faq-line summary span{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#0a0a0a;
  color:#fff;
  flex-shrink:0;
  transition:transform .22s,background .22s;
}
.faq-line[open] summary span{
  background:#28ae60;
  transform:rotate(45deg);
}
.faq-line p{
  max-width:760px;
  padding:0 58px 28px 0;
  color:#6b6b66;
  font-size:16px;
  line-height:1.65;
}
.faq-variant-b{
  color:#fff;
  background:#0a0a0a;
  background-image:
    linear-gradient(rgba(255,255,255,.062) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.062) 1px,transparent 1px);
  background-size:175px 175px;
}
.faq-b-head{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:28px;
  margin-bottom:26px;
}
.faq-b-head .h2{
  max-width:740px;
  color:#fff;
}
.faq-b-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr .85fr;
  gap:16px;
}
.faq-b-card{
  min-height:240px;
  padding:24px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:28px;
  background:rgba(255,255,255,.07);
  box-shadow:0 28px 70px -48px rgba(0,0,0,.9);
}
.faq-b-card.is-big{
  grid-row:span 2;
  min-height:496px;
  background:
    radial-gradient(circle at 90% 10%,rgba(40,174,96,.2),transparent 32%),
    rgba(255,255,255,.08);
}
.faq-b-card span{
  color:#7ce4a3;
  font-size:12px;
  font-weight:950;
  letter-spacing:.18em;
}
.faq-b-card h3{
  margin-top:22px;
  color:#fff;
  font-size:clamp(24px,3vw,44px);
  line-height:.92;
  letter-spacing:-.075em;
  font-weight:950;
}
.faq-b-card:not(.is-big) h3{
  font-size:clamp(20px,2vw,28px);
}
.faq-b-card p{
  margin-top:18px;
  color:rgba(255,255,255,.68);
  font-size:15px;
  line-height:1.55;
}
.faq-c-shell{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:18px;
  padding:18px;
  border:1px solid rgba(10,10,10,.1);
  border-radius:36px;
  background:#e9e5da;
  box-shadow:0 34px 80px -62px rgba(10,10,10,.34);
}
.faq-c-proof{
  min-height:580px;
  padding:36px;
  border-radius:26px;
  background:
    linear-gradient(rgba(10,10,10,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(10,10,10,.07) 1px,transparent 1px),
    #f3f3f0;
  background-size:175px 175px;
  display:flex;
  flex-direction:column;
}
.faq-c-proof .h2{
  margin-top:22px;
  font-size:clamp(40px,5.4vw,76px);
}
.faq-c-stats{
  margin-top:auto;
  display:grid;
  gap:10px;
}
.faq-c-stats div{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:18px;
  padding:18px 0;
  border-top:1px solid rgba(10,10,10,.12);
}
.faq-c-stats b{
  font-size:clamp(34px,4vw,58px);
  line-height:.9;
  letter-spacing:-.07em;
}
.faq-c-stats small{
  max-width:160px;
  color:#6b6b66;
  font-weight:800;
  text-align:right;
  line-height:1.15;
}
.faq-c-rows{
  display:grid;
  gap:10px;
}
.faq-c-row{
  border-radius:22px;
  background:#fafaf8;
  border:1px solid rgba(10,10,10,.08);
  overflow:hidden;
}
.faq-c-row summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:22px 24px;
  cursor:pointer;
}
.faq-c-row summary::-webkit-details-marker{display:none}
.faq-c-row summary b{
  font-size:18px;
  line-height:1.08;
  letter-spacing:-.035em;
}
.faq-c-row summary span{
  padding:8px 11px;
  border-radius:999px;
  background:#0a0a0a;
  color:#fff;
  font-size:10px;
  font-weight:950;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.faq-c-row[open] summary span{
  background:#28ae60;
}
.faq-c-row p{
  padding:0 24px 24px;
  color:#6b6b66;
  font-size:15px;
  line-height:1.55;
}
@media (max-width:980px){
  .faq-a-layout,
  .faq-c-shell,
  .faq-b-grid{
    grid-template-columns:1fr;
  }
  .faq-a-copy{
    position:relative;
    top:auto;
  }
  .faq-b-card.is-big{
    min-height:auto;
  }
  .faq-b-head{
    align-items:start;
    flex-direction:column;
  }
}

/* ===================== FAQ LEFT PANEL OPTIONS ===================== */
.faq-left-preview .faq-option-hero .h2{
  max-width:980px;
}
.faq-left-variant{
  padding:72px 0;
}
.faq-left-layout{
  grid-template-columns:.78fr 1.22fr;
}
.faq-left-card{
  min-height:590px;
  border-radius:28px;
  position:sticky;
  top:116px;
  overflow:hidden;
}
.faq-left-card .h2{
  margin-top:20px;
  font-size:clamp(30px,3.5vw,50px);
  line-height:.95;
  letter-spacing:-.06em;
}
.faq-left-card p{
  margin-top:22px;
  color:#6b6b66;
  font-size:16px;
  line-height:1.55;
}
.faq-left-editorial{
  padding:34px;
  background:
    linear-gradient(rgba(10,10,10,.072) 1px,transparent 1px),
    linear-gradient(90deg,rgba(10,10,10,.072) 1px,transparent 1px),
    #f3f3f0;
  background-size:175px 175px;
  border:1px solid rgba(10,10,10,.1);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.58);
}
.faq-left-editorial::after{
  content:"";
  position:absolute;
  right:-80px;
  bottom:-80px;
  width:260px;
  height:260px;
  border-radius:50%;
  border:1px dashed rgba(40,174,96,.45);
  opacity:.7;
}
.faq-left-rule{
  margin:34px 0 8px;
  height:1px;
  background:rgba(10,10,10,.12);
}
.faq-left-micro{
  display:flex;
  justify-content:space-between;
  gap:18px;
  padding:18px 0;
  border-bottom:1px solid rgba(10,10,10,.1);
}
.faq-left-micro b{
  font-size:12px;
  font-weight:950;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.faq-left-micro span{
  color:#6b6b66;
  font-size:14px;
  font-weight:800;
  text-align:right;
}
.faq-left-tickets{
  padding:24px;
  background:#e9e5da;
  border:1px solid rgba(10,10,10,.1);
}
.faq-left-tickets .h2{
  padding:8px 8px 0;
}
.ticket-stack{
  display:grid;
  gap:10px;
  margin-top:26px;
}
.ticket-card{
  position:relative;
  min-height:138px;
  padding:20px;
  border-radius:24px;
  background:#fafaf8;
  border:1px solid rgba(10,10,10,.08);
  box-shadow:0 24px 50px -40px rgba(10,10,10,.5);
}
.ticket-card:nth-child(2){
  transform:rotate(-1deg);
  background:#0a0a0a;
  color:#fff;
}
.ticket-card:nth-child(3){
  transform:rotate(1deg);
  background:#dff5e7;
}
.ticket-card small{
  display:block;
  font-size:10px;
  font-weight:950;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#6b6b66;
}
.ticket-card:nth-child(2) small{
  color:rgba(255,255,255,.56);
}
.ticket-card b{
  display:block;
  margin-top:12px;
  font-size:clamp(38px,4.2vw,64px);
  line-height:.85;
  letter-spacing:-.08em;
}
.ticket-card span{
  display:block;
  margin-top:12px;
  max-width:310px;
  color:#6b6b66;
  font-size:14px;
  font-weight:750;
  line-height:1.25;
}
.ticket-card:nth-child(2) span{
  color:rgba(255,255,255,.68);
}
.faq-left-dark{
  padding:34px;
  color:#fff;
  background:
    linear-gradient(rgba(255,255,255,.062) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.062) 1px,transparent 1px),
    radial-gradient(circle at 80% 12%,rgba(40,174,96,.28),transparent 34%),
    linear-gradient(145deg,#242420 0%,#080808 74%);
  background-size:175px 175px,175px 175px,auto,auto;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 30px 80px -58px rgba(0,0,0,.9);
}
.faq-left-dark .h2{
  color:#fff;
}
.faq-left-card.faq-left-dark .h2{
  font-size:clamp(34px,4.4vw,64px) !important;
  line-height:1.02 !important;
  letter-spacing:-.035em !important;
  text-wrap:balance;
  overflow-wrap:normal;
  word-break:keep-all;
  hyphens:none;
  max-width:100%;
}
.faq-left-dark .h2 .hl-out{
  color:rgba(165,255,191,.08) !important;
  -webkit-text-stroke:1.5px rgba(255,255,255,.72) !important;
  text-shadow:0 0 28px rgba(40,174,96,.24) !important;
}
.faq-left-dark p{
  color:rgba(255,255,255,.68);
}
.dark-fit-list{
  display:grid;
  gap:12px;
  margin-top:36px;
}
.dark-fit-list div{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:16px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:rgba(255,255,255,.06);
}
.dark-fit-list i{
  width:10px;
  height:10px;
  margin-top:6px;
  border-radius:2px;
  background:#28ae60;
  flex-shrink:0;
}
.dark-fit-list span{
  color:rgba(255,255,255,.82);
  font-size:15px;
  font-weight:850;
  line-height:1.25;
}
@media (max-width:980px){
  .faq-left-layout{
    grid-template-columns:1fr;
  }
  .faq-left-card{
    position:relative;
    top:auto;
    min-height:auto;
  }
}
@media (max-width:640px){
  .faq-left-card.faq-left-dark{
    padding:24px;
  }
  .faq-left-card.faq-left-dark .h2{
    font-size:clamp(22px,5.5vw,32px);
    line-height:1;
    letter-spacing:-.045em;
    text-wrap:balance;
    overflow-wrap:normal;
    word-break:keep-all;
    hyphens:none;
  }
  .faq-left-card.faq-left-dark .h2 .hl-out{
    -webkit-text-stroke:1px rgba(255,255,255,.72) !important;
    text-shadow:none !important;
  }
  .dark-fit-list{margin-top:22px}
  .dark-fit-list span{font-size:14px}
}
@media (min-width:641px) and (max-width:980px){
  .faq-left-card.faq-left-dark .h2{
    font-size:clamp(24px,4.2vw,34px);
    line-height:1;
    letter-spacing:-.04em;
    text-wrap:balance;
    overflow-wrap:normal;
    word-break:keep-all;
    hyphens:none;
  }
}

/* ===================== HOME FLOW OPTIONS · DARK/LIGHT ITERATIONS ===================== */
.flow-option-label{
  position:fixed;
  z-index:9999;
  left:24px;
  bottom:24px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(10,10,10,.88);
  color:#fff;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 20px 50px -28px rgba(0,0,0,.7);
  backdrop-filter:blur(12px);
  font-size:12px;
  font-weight:900;
  letter-spacing:.02em;
}
.flow-option-label span{
  color:rgba(255,255,255,.62);
  font-weight:800;
}
.flow-option-switcher{
  position:fixed;
  z-index:9999;
  right:24px;
  bottom:24px;
  display:flex;
  align-items:center;
  gap:6px;
  padding:6px;
  border-radius:999px;
  background:rgba(10,10,10,.88);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 20px 50px -28px rgba(0,0,0,.7);
  backdrop-filter:blur(12px);
}
.flow-option-switcher a{
  min-width:38px;
  height:38px;
  display:grid;
  place-items:center;
  padding:0 12px;
  border-radius:999px;
  color:rgba(255,255,255,.7);
  text-decoration:none;
  font-size:12px;
  font-weight:950;
  letter-spacing:.02em;
}
.flow-option-switcher a:last-child{
  min-width:auto;
  padding-inline:14px;
}
.flow-option-switcher a:hover,
.flow-option-switcher a.is-active{
  background:#28ae60;
  color:#071107;
}
.flow-option .meta-bar{
  display:none !important;
}
.flow-option .tdb-hdr{
  top:18px !important;
}

/* Option 01 — Sable continu: moins de rupture, la télé vit dans un runway chaud. */
.flow-option-1 .stat-wrap,
.flow-option-1 .trust-bar,
.flow-option-1 .promesse-section,
.flow-option-1 .guarantee{
  background:#eee9dd !important;
}
.flow-option-1 .stat-wrap{
  padding-top:54px !important;
  padding-bottom:20px !important;
}
.flow-option-1 .trust-bar{
  border-top:0 !important;
  border-bottom:1px solid rgba(10,10,10,.08) !important;
  padding-top:18px !important;
  padding-bottom:34px !important;
}
.flow-option-1 .promesse-section{
  padding-top:76px !important;
  padding-bottom:42px !important;
  position:relative;
}
.flow-option-1 .promesse-section::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:190px;
  background:linear-gradient(180deg,rgba(255,255,255,.26),rgba(255,255,255,0));
  pointer-events:none;
}
.flow-option-1 .promesse-section .wrap,
.flow-option-1 .guarantee .wrap{
  position:relative;
  z-index:1;
}
.flow-option-1 .promise-band{
  box-shadow:0 44px 100px -62px rgba(10,10,10,.86) !important;
}
.flow-option-1 .guarantee{
  padding-top:34px !important;
  padding-bottom:92px !important;
}
.flow-option-1 .guarantee-card{
  background:rgba(255,255,255,.78) !important;
  border-color:rgba(10,10,10,.08) !important;
  box-shadow:0 32px 80px -58px rgba(10,10,10,.36) !important;
}
.flow-option-1 .brandsection{
  border-top:1px solid rgba(255,255,255,.08);
}

/* Option 02 — Dark runway: la promesse + garantie deviennent un seul moment noir. */
.flow-option-2 .trust-bar{
  padding-bottom:58px !important;
  border-bottom:0 !important;
  background:linear-gradient(180deg,#f3f2ee 0%,#f0eee7 68%,#0b0b08 100%) !important;
}
.flow-option-2 .promesse-section,
.flow-option-2 .guarantee{
  background:#0b0b08 !important;
  color:#fff !important;
}
.flow-option-2 .promesse-section{
  padding-top:88px !important;
  padding-bottom:34px !important;
}
.flow-option-2 .promise-band{
  background:
    radial-gradient(circle at 84% 8%,rgba(40,174,96,.3),transparent 32%),
    linear-gradient(135deg,#1a1914,#050505 68%) !important;
  border-color:rgba(255,255,255,.1) !important;
  box-shadow:0 54px 110px -70px rgba(40,174,96,.52) !important;
}
.flow-option-2 .guarantee{
  padding-top:36px !important;
  padding-bottom:108px !important;
}
.flow-option-2 .guarantee .h2,
.flow-option-2 .guarantee-h{
  color:#fff !important;
}
.flow-option-2 .guarantee .lead,
.flow-option-2 .guarantee-p{
  color:rgba(255,255,255,.68) !important;
}
.flow-option-2 .guarantee-card{
  background:
    radial-gradient(circle at 0 0,rgba(40,174,96,.14),transparent 28%),
    rgba(255,255,255,.055) !important;
  color:#fff !important;
  border-color:rgba(255,255,255,.12) !important;
  box-shadow:0 28px 90px -60px rgba(40,174,96,.48) !important;
}
.flow-option-2 .guarantee-list li{
  color:rgba(255,255,255,.78) !important;
}
.flow-option-2 .guarantee-seal .seal-lbl,
.flow-option-2 .guarantee-card text{
  fill:#fafaf8 !important;
  color:#fff !important;
}
.flow-option-2 .brandsection{
  border-top:1px solid rgba(255,255,255,.08);
}

/* Option 03 — Editorial seam: rupture assumée, mais avec une transition verte + dark card plus cinématographique. */
.flow-option-3 .stat-wrap{
  background:#f3f2ee !important;
}
.flow-option-3 .trust-bar{
  position:relative;
  padding-bottom:70px !important;
  background:
    linear-gradient(180deg,#f3f2ee 0%,#f3f2ee 58%,#e7ebdf 100%) !important;
  border-bottom:0 !important;
  overflow:hidden;
}
.flow-option-3 .trust-bar::after{
  content:"";
  position:absolute;
  left:clamp(32px,7vw,112px);
  right:clamp(32px,7vw,112px);
  bottom:20px;
  height:12px;
  border-radius:999px;
  background:linear-gradient(90deg,#28ae60,#a5ffbf);
  box-shadow:0 18px 50px -28px rgba(40,174,96,.8);
}
.flow-option-3 .promesse-section{
  background:
    linear-gradient(180deg,#10110e 0%,#080806 100%) !important;
  padding-top:92px !important;
  padding-bottom:92px !important;
  color:#fff !important;
}
.flow-option-3 .promise-band{
  background:
    radial-gradient(circle at 76% -12%,rgba(165,255,191,.2),transparent 34%),
    linear-gradient(135deg,#171713,#050505 70%) !important;
  border-radius:48px !important;
  border-color:rgba(255,255,255,.12) !important;
  box-shadow:0 46px 120px -70px rgba(0,0,0,.9) !important;
}
.flow-option-3 .guarantee{
  background:#f7f4ea !important;
  padding-top:92px !important;
  padding-bottom:100px !important;
}
.flow-option-3 .guarantee-card{
  border-radius:34px !important;
  background:#fafaf8 !important;
  box-shadow:0 38px 86px -62px rgba(10,10,10,.38) !important;
}

/* Home · Appel découverte: left copy should visually lead the phone, like the hero */
body:not(.flow-option) #applycta .applycta-band{
  grid-template-columns:minmax(0,1.18fr) minmax(360px,.82fr) !important;
  align-items:start !important;
  gap:clamp(30px,5vw,68px) !important;
}
body:not(.flow-option) #applycta .applycta-content{
  max-width:820px !important;
  padding-top:clamp(0px,1.4vw,18px) !important;
}
body:not(.flow-option) #applycta .pill-section{
  width:max-content !important;
  max-width:max-content !important;
  white-space:nowrap !important;
  padding-right:14px !important;
}
body:not(.flow-option) #applycta .applycta-h{
  font-size:clamp(36px,4.5vw,56px) !important;
  line-height:.95 !important;
  max-width:18ch !important;
  margin-top:18px !important;
}
body:not(.flow-option) #applycta .applycta-byline{
  margin-top:8px !important;
  max-width:none !important;
  color:rgba(255,255,255,.82) !important;
  font-size:clamp(18px,1.7vw,24px) !important;
  font-weight:900 !important;
  letter-spacing:-.025em !important;
}
body:not(.flow-option) #applycta .phone-form-mock{
  transform:translateY(18px) scale(.9) !important;
  transform-origin:top center !important;
  min-height:720px !important;
}
body:not(.flow-option) #faq .wrap{
  width:min(calc(100vw - clamp(40px,4.8vw,68px)),1280px) !important;
  max-width:none !important;
  padding-left:0 !important;
  padding-right:0 !important;
}
body:not(.flow-option) #faq .faq-a-layout{
  width:100% !important;
  box-sizing:border-box !important;
}
@media (max-width:980px){
  body:not(.flow-option) #applycta .applycta-band{
    grid-template-columns:1fr !important;
  }
  body:not(.flow-option) #applycta .applycta-h{
    font-size:clamp(30px,8vw,48px) !important;
    max-width:16ch !important;
  }
  body:not(.flow-option) #applycta .phone-form-mock{
    transform:none !important;
  }
}
@media (max-width:780px){
  body:not(.flow-option) #faq .wrap{
    width:calc(100vw - 20px) !important;
  }
}

/* Home · CTA phone composition + vertical green support bars */
body:not(.flow-option) #applycta .applycta-h .hl-out{
  color:transparent !important;
  -webkit-text-stroke-color:rgba(255,255,255,.84) !important;
  text-stroke-color:rgba(255,255,255,.84) !important;
}
body:not(.flow-option) #applycta .applycta-h{
  font-family:'Satoshi','Satoshi Variable',sans-serif !important;
  font-weight:950 !important;
  letter-spacing:-.083em !important;
  line-height:.83 !important;
}
body:not(.flow-option) #applycta .applycta-grad{
  display:inline-block !important;
  background:linear-gradient(135deg,#28ae60 0%,#a5ffbf 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  color:transparent !important;
  padding-right:.08em !important;
  margin-right:-.06em !important;
}
body:not(.flow-option) #applycta .applycta-dot{
  color:#28ae60 !important;
  -webkit-text-stroke:0 !important;
}
body:not(.flow-option) #applycta .applycta-note,
body:not(.flow-option) #promesse .promise-sub{
  border-left:4px solid #28ae60 !important;
  padding-left:24px !important;
  margin-top:18px !important;
}
body:not(.flow-option) #applycta .applycta-note{
  max-width:520px !important;
  color:rgba(255,255,255,.72) !important;
  font-size:clamp(17px,1.5vw,21px) !important;
  line-height:1.45 !important;
  letter-spacing:-.02em !important;
}
body:not(.flow-option) #promesse .promise-sub{
  max-width:620px !important;
  font-size:clamp(17px,1.5vw,22px) !important;
  line-height:1.5 !important;
}
body:not(.flow-option) #applycta .phone-form-mock .phone-shell{
  transform:rotate(1.5deg) translate(-48px,6px) !important;
}
body:not(.flow-option) #applycta .phone-form-mock .phone-brand-card.card-c{
  right:-4px !important;
  top:28px !important;
}
body:not(.flow-option) #applycta .phone-form-mock .phone-shadow-card.card-b{
  right:-18px !important;
  bottom:132px !important;
}
body:not(.flow-option) #applycta .phone-form-mock .phone-shadow-card.card-a.phone-google-rating{
  left:-72px !important;
  top:158px !important;
  z-index:8 !important;
  transform:rotate(-5deg) !important;
}

/* Floating decorative cards must not intercept clicks on the form options/buttons below them */
.phone-form-mock .phone-shadow-card,
.phone-form-mock .phone-brand-card{
  pointer-events:none !important;
}

/* ===== Étape 2 — Lead-gen animated stage ===== */
.formule-img.dark.formule-lead-visual{
  background:#fafaf8;
}
.formule-lead-visual .lead-stage{
  position:absolute;inset:0;overflow:hidden;
}
/* soft emerald glow behind devices */
.formule-lead-visual .lead-stage::before{
  content:"";
  position:absolute;
  top:50%;left:50%;
  width:62%;aspect-ratio:1;
  transform:translate(-50%,-50%);
  background:radial-gradient(closest-side,rgba(40,174,96,.22),rgba(40,174,96,0) 70%);
  filter:blur(8px);
  pointer-events:none;
  z-index:0;
}
.lead-phones{
  position:absolute;inset:0;
  padding:2% 2%;
}
.lead-phone{
  position:relative;
  aspect-ratio:9/19;
  background:linear-gradient(145deg,#2a2f31 0%,#15191b 45%,#050608 100%);
  border-radius:34px;
  border:1.5px solid rgba(255,255,255,.12);
  box-shadow:
    0 40px 80px -24px rgba(0,0,0,.45),
    0 12px 24px -10px rgba(0,0,0,.35),
    inset 0 0 0 1px rgba(255,255,255,.06),
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 -18px 30px rgba(0,0,0,.28);
  overflow:hidden;
}
/* phone side buttons hint */
.lead-phone--a::before,
.lead-phone--a::after{
  content:"";position:absolute;width:2px;border-radius:2px;
  background:rgba(255,255,255,.18);z-index:4;
}
.lead-phone--a::before{left:-2px;top:22%;height:14%}
.lead-phone--a::after{right:-2px;top:30%;height:22%}
.lead-phone--a{
  position:absolute;
  left:3%; top:calc(8% + 5px);
  width:42%;
  transform:rotate(3deg);
  z-index:5;
}
.lead-phone--b{
  position:absolute;
  right:-11%; top:calc(34% - 3px);
  width:78%;
  aspect-ratio:auto;
  transform:rotate(-2deg);
  z-index:2;
}
/* Laptop chassis */
.lead-laptop{
  display:flex;
  flex-direction:column;
  align-items:stretch;
}
.lead-laptop-screen{
  position:relative;
  aspect-ratio:16/10;
  background:linear-gradient(145deg,#6a7376 0%,#3a4346 45%,#161b1e 100%);
  border:1.5px solid rgba(255,255,255,.3);
  border-radius:14px 14px 4px 4px;
  box-shadow:
    0 40px 80px -24px rgba(0,0,0,.45),
    0 12px 24px -10px rgba(0,0,0,.35),
    inset 0 0 0 1px rgba(255,255,255,.12),
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -18px 30px rgba(0,0,0,.28);
  overflow:hidden;
}
/* subtle screen gloss */
.lead-laptop-screen::after,
.lead-phone-screen::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.08) 0%,rgba(255,255,255,0) 35%,rgba(255,255,255,0) 100%);
  z-index:5;
}
.lead-laptop-screen .lead-lp{
  position:absolute;
  inset:8px;
  border-radius:6px;
  overflow:hidden;
}
.lead-laptop-base{
  position:relative;
  height:12px;
  margin:0 -5%;
  background:linear-gradient(180deg,#737d80 0%,#3d4649 55%,#171c1f 100%);
  border-radius:0 0 14px 14px;
  box-shadow:0 22px 36px -18px rgba(0,0,0,.55);
}
.lead-laptop-notch-base{
  position:absolute;left:50%;top:0;transform:translateX(-50%);
  width:22%;height:5px;border-radius:0 0 8px 8px;
  background:#050505;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.lead-phone-notch{
  position:absolute;top:8px;left:50%;transform:translateX(-50%);
  width:34%;height:14px;border-radius:999px;
  background:#050505;z-index:6;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}
.lead-phone-screen{
  position:absolute;inset:5px;border-radius:28px;overflow:hidden;
  background:linear-gradient(180deg,#0f1311,#0a0c0b);
}
.lead-ads{position:absolute;inset:0;}
.lead-ad{
  position:absolute;inset:0;
  display:flex;flex-direction:column;
  padding:22px 8px 8px;
  background:#fafafa;color:#111;
}
.lead-ad--static{opacity:1;}
.lead-ad-video{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  display:block;
}
.lead-ad-bar{
  display:flex;align-items:center;gap:6px;
  padding:0 4px 6px;font-size:8.5px;font-weight:600;
}
.lead-ad-dot{width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,#28ae60,#1a8348);flex:0 0 14px}
.lead-ad-handle{color:#111}
.lead-ad-net{margin-left:auto;color:#888;font-weight:500;font-size:7.5px;text-transform:uppercase;letter-spacing:.06em}
.lead-ad-media{
  flex:1;border-radius:6px;
  background-size:cover;background-position:center;
}
.lead-ad-media{position:relative;overflow:hidden;background:#0d1311;}
.lead-ad-cta{
  margin-top:6px;
  padding:6px 8px;
  background:#111;color:#fff;
  border-radius:6px;
  font-size:8.5px;font-weight:700;text-align:center;
}

/* notifications */
.lead-notifs{position:absolute;inset:0;pointer-events:none;z-index:6;}
.lead-notif{
  position:absolute;
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 12px;
  background:rgba(20,28,24,.92);
  border:1px solid rgba(40,174,96,.45);
  border-radius:999px;
  color:#eaf6ee;font-size:11px;font-weight:500;
  backdrop-filter:blur(6px);
  box-shadow:0 10px 24px -8px rgba(0,0,0,.55),0 0 0 3px rgba(40,174,96,.08);
  opacity:0;
  transform:translateY(6px) scale(.92);
  animation:leadNotifPop 7s infinite;
  animation-delay:calc(var(--i,0) * .9s);
  white-space:nowrap;max-width:62%;
}
.lead-notif b{color:#7cd49a;font-weight:700}
.lead-notif-dot{
  width:8px;height:8px;border-radius:50%;
  background:#3ddb86;
  box-shadow:0 0 0 3px rgba(61,219,134,.25),0 0 10px rgba(61,219,134,.6);
}
.lead-notif-ico{
  display:inline-flex;align-items:center;justify-content:center;
  width:18px;height:18px;flex:0 0 18px;
  border-radius:5px;overflow:hidden;
  background:#fafaf8;
  box-shadow:0 0 0 1px rgba(255,255,255,.12),0 4px 10px -2px rgba(0,0,0,.5);
}
.lead-notif-ico svg{width:100%;height:100%;display:block}
.lead-notif-ico.ico-tiktok,
.lead-notif-ico.ico-meta,
.lead-notif-ico.ico-instagram,
.lead-notif-ico.ico-facebook{background:transparent}
.lead-notif-txt{display:inline-block}
@keyframes leadNotifPop{
  0%   {opacity:0;transform:translate(-4px,8px) scale(.9)}
  4%   {opacity:1;transform:translate(0,0) scale(1)}
  22%  {opacity:1;transform:translate(0,0) scale(1)}
  28%  {opacity:0;transform:translate(0,-6px) scale(.96)}
  100% {opacity:0;transform:translate(0,-6px) scale(.96)}
}

@media (max-width:980px){
  .lead-notif{font-size:10px;padding:6px 10px}
  .lead-phones{gap:12px;padding:10% 6%}
}
@media (prefers-reduced-motion:reduce){
  .lead-notif{animation:none;opacity:1;transform:none}
}

/* ===== Lead phone B — fake landing page that auto-scrolls ===== */
.lead-lp{
  position:absolute;inset:0;
  display:flex;flex-direction:column;
  background:#fafaf8;color:#0a0a0a;
  font-family:Inter,system-ui,sans-serif;
}
.lead-lp-bar{
  display:flex;align-items:center;gap:6px;
  padding:18px 8px 4px;
  font-size:7.5px;color:#888;
  border-bottom:1px solid #eee;
}
.lead-lp-dots{display:inline-flex;gap:3px;margin-right:4px}
.lead-lp-dots i{width:5px;height:5px;border-radius:50%;background:#d8d8d8}
.lead-lp-url{
  flex:1;text-align:center;
  background:#f2f2f2;border-radius:6px;
  padding:2px 6px;font-size:7px;color:#555;
}
.lead-lp-scroll{
  flex:1;overflow:hidden;position:relative;
}
.lead-lp-track{
  position:absolute;inset:0;
  display:flex;flex-direction:column;
  gap:8px;
  padding:8px;
  bottom:auto;
  animation:lpScroll 14s ease-in-out infinite;
}
@keyframes lpScroll{
  0%,8%    {transform:translateY(0)}
  50%,58%  {transform:translateY(calc(-100% + 220px))}
  92%,100% {transform:translateY(0)}
}
.lp-nav{
  display:flex;align-items:center;justify-content:space-between;
  padding:2px 4px;
}
.lp-logo{font-weight:800;font-size:8px;color:#0a0a0a}
.lp-cta-mini{
  background:#0a0a0a;color:#fff;
  font-size:6.5px;font-weight:700;
  padding:3px 6px;border-radius:999px;
}
.lp-hero{
  text-align:center;padding:6px 4px 8px;
}
.lp-pill{
  display:inline-flex;align-items:center;gap:3px;
  font-size:6px;font-weight:700;letter-spacing:.08em;
  color:#1a8348;background:rgba(40,174,96,.1);
  padding:2px 6px;border-radius:999px;margin-bottom:5px;
}
.lp-pill i{width:4px;height:4px;background:#28ae60;border-radius:1px}
.lp-hero h4{
  margin:0 0 4px;font-size:13px;font-weight:800;line-height:1.1;
  color:#0a0a0a;
}
.lp-hero h4 em{font-style:normal;color:#28ae60}
.lp-hero p{margin:0 0 6px;font-size:7px;color:#666;line-height:1.3}
.lp-cta{
  display:inline-block;
  background:#28ae60;color:#fff;
  font-size:7.5px;font-weight:700;
  padding:6px 12px;border-radius:8px;
  box-shadow:0 4px 10px -2px rgba(40,174,96,.4);
}
.lp-cta-full{display:block;text-align:center;margin-top:4px}
.lp-stars{
  margin-top:6px;font-size:7px;color:#f5a623;font-weight:700;
}
.lp-stars span{color:#888;font-weight:500;margin-left:3px}
.lp-stars.sm{margin:0 0 4px;font-size:6.5px}
.lp-photo{
  width:100%;border-radius:6px;
  background:#222 center/cover no-repeat;
}
.lp-photo-1{
  aspect-ratio:16/9;
  background-image:url('/assets/media/si-grenier-laine.webp');
}
.lp-photo-2,.lp-photo-3{
  aspect-ratio:1/1;
}
.lp-photo-2{background-image:url('/assets/media/si-grenier-avant.webp')}
.lp-photo-3{background-image:url('/assets/media/si-facture.webp')}
.lp-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.lp-feat{
  display:flex;flex-direction:column;gap:5px;
  padding:4px;
}
.lp-feat-row{
  display:flex;align-items:center;gap:6px;
  padding:5px 6px;background:#f6f7f5;border-radius:6px;
}
.lp-check{
  width:14px;height:14px;flex:0 0 14px;border-radius:50%;
  background:#28ae60;color:#fff;
  font-size:8px;font-weight:800;
  display:inline-flex;align-items:center;justify-content:center;
}
.lp-feat-row b{display:block;font-size:7px;color:#0a0a0a;font-weight:700}
.lp-feat-row span{display:block;font-size:6px;color:#888;margin-top:1px}
.lp-quote{
  padding:8px;background:#0a0a0a;color:#fff;border-radius:8px;
}
.lp-quote p{margin:0 0 5px;font-size:7px;line-height:1.4;font-style:italic}
.lp-author{display:flex;align-items:center;gap:5px}
.lp-ava{
  width:14px;height:14px;border-radius:50%;
  background:linear-gradient(135deg,#28ae60,#7cd49a);flex:0 0 14px;
}
.lp-author b{display:block;font-size:7px;font-weight:700}
.lp-author span{display:block;font-size:6px;color:#999}
.lp-form{
  padding:8px;border:1px solid #e6e6e6;border-radius:8px;
  display:flex;flex-direction:column;gap:5px;background:#fafafa;
}
.lp-form h5{margin:0 0 2px;font-size:9px;font-weight:800;color:#0a0a0a}
.lp-input{
  background:#fafaf8;border:1px solid #e0e0e0;border-radius:5px;
  padding:5px 7px;font-size:6.5px;color:#aaa;
}

/* === Lead phone B — Solution Isolation skin (real client landing) === */
.lead-lp--si{ background:#0a1614; color:#e9f5f1; }
.lead-lp--si .lead-lp-bar{
  background:#070f0e; border-bottom:1px solid #122522; color:#7fbfb1;
}
.lead-lp--si .lead-lp-url{
  background:#13211f; color:#a7d8cc;
}
.lead-lp--si .lp-logo{
  display:inline-flex;flex-direction:column;line-height:1;color:#fff;letter-spacing:.14em;
}
.lead-lp--si .lp-logo b{font-size:5.5px;font-weight:800;letter-spacing:.18em}
.lead-lp--si .lp-logo span{font-size:8px;font-weight:800;letter-spacing:.18em;color:#14b8a6}
.lead-lp--si .lp-cta-mini{ background:#14b8a6; color:#06201c; }
.lead-lp--si .lp-pill{
  color:#7fe7d4; background:rgba(20,184,166,.14);
}
.lead-lp--si .lp-pill i{background:#14b8a6}
.lead-lp--si .lp-hero h4{color:#fff}
.lead-lp--si .lp-hero h4 em{color:#14b8a6;font-style:italic;font-weight:900}
.lead-lp--si .lp-hero p{color:#9bbab2}
.lead-lp--si .lp-cta{
  background:#14b8a6;color:#06201c;
  box-shadow:0 4px 12px -2px rgba(20,184,166,.5);
}
.lead-lp--si .lp-stars span{color:#7a978f}
.lead-lp--si .lp-feat-row{ background:#0f1f1c; border:1px solid #142c28 }
.lead-lp--si .lp-feat-row b{color:#eafaf5}
.lead-lp--si .lp-feat-row span{color:#7a978f}
.lead-lp--si .lp-check{ background:#14b8a6;color:#06201c }
.lead-lp--si .lp-quote{ background:#0f1f1c; border:1px solid #142c28 }
.lead-lp--si .lp-author b{color:#fafaf8}
.lead-lp--si .lp-form{
  background:#0f1f1c;border:1px solid #142c28;
}
.lead-lp--si .lp-form h5{ color:#fff }
.lead-lp--si .lp-form h5 em{ color:#14b8a6;font-style:normal }
.lead-lp--si .lp-input{
  background:#06100e;border:1px solid #1a332e;color:#5e7c75;
}
.lp-choice{gap:5px}
.lp-choice-card{
  display:flex;flex-direction:column;align-items:flex-start;gap:3px;
  padding:6px;border-radius:6px;
  background:#fafaf8;color:#0a0a0a;
  font-size:6.5px;font-weight:700;line-height:1.2;
  box-shadow:0 1px 0 rgba(0,0,0,.06);
}
.lp-choice-card span{font-size:11px}
.lead-lp--si .lp-photo-3{background-image:url('/assets/media/si-facture.webp');background-size:cover;background-position:center}

/* --- Polished LP additions (trust row, photo badges, fine hint) --- */
.lp-photo{position:relative}
.lp-photo-badge{
  position:absolute;left:5px;top:5px;
  display:inline-flex;align-items:center;gap:4px;
  padding:3px 7px;border-radius:999px;
  background:rgba(10,22,20,.78);backdrop-filter:blur(4px);
  color:#eafaf5;font-size:6px;font-weight:700;letter-spacing:.08em;
  border:1px solid rgba(255,255,255,.08);
}
.lp-photo-badge i{width:5px;height:5px;border-radius:50%;background:#14b8a6;box-shadow:0 0 0 2px rgba(20,184,166,.25)}
.lp-photo-tag{
  position:absolute;left:4px;bottom:4px;
  padding:2px 5px;border-radius:3px;
  background:rgba(10,10,10,.75);color:#fff;
  font-size:5.5px;font-weight:800;letter-spacing:.14em;
}
.lp-photo-tag--ok{background:#14b8a6;color:#06201c}
.lp-trust{
  display:flex;align-items:center;justify-content:center;gap:5px;flex-wrap:wrap;
  padding:5px 6px;margin:0 2px;
  font-size:5.5px;font-weight:700;letter-spacing:.08em;
  color:#7a978f;text-transform:uppercase;
  border-top:1px dashed #142c28;border-bottom:1px dashed #142c28;
}
.lp-finehint{
  margin-top:2px;text-align:center;
  font-size:5.5px;font-weight:600;color:#7a978f;letter-spacing:.04em;
}
.lead-lp--si .lp-form--final{
  background:linear-gradient(180deg,#0f1f1c 0%,#0a1614 100%);
  border:1px solid #1a3a34;
  box-shadow:0 8px 18px -8px rgba(20,184,166,.25),inset 0 1px 0 rgba(255,255,255,.04);
}

/* Full landing-page auto-scroll for the laptop mockup */
.lead-lp .lead-lp-track{
  animation:lpScrollLoop 18s cubic-bezier(.65,.05,.36,1) infinite;
}
@keyframes lpScrollLoop{
  0%,6%    { transform:translateY(0); }
  48%,56%  { transform:translateY(calc(-100% + 240px)); }
  94%,100% { transform:translateY(0); }
}
@media (prefers-reduced-motion:reduce){
  .lead-lp-track{animation:none}
}

/* =====================================================================
   MOBILE QA · overflow & sizing fixes (audit pass)
   ===================================================================== */
@media (max-width:560px){
  /* Promise TV band — keep antennas/TV inside viewport */
  .promesse-section .promise-band{
    overflow:hidden !important;
    padding:28px 20px !important;
  }
  .promise-h{font-size:clamp(26px,7.4vw,34px) !important;word-break:normal;hyphens:auto}
  .promise-sub{font-size:14.5px !important}
  .promise-counter-wrap.tv-countdown{
    align-self:center !important;
    width:100%;
    max-width:280px;
    margin:0 auto;
  }
  .tv-case{
    min-height:auto !important;
    padding:30px 22px 96px 22px !important;
    border-width:8px !important;
  }
  .tv-case::before{inset:18px 18px 84px 18px !important}
  .tv-noise{inset:18px 18px 84px 18px !important}
  .tv-case::after{
    top:auto !important;
    bottom:18px !important;
    right:50% !important;
    transform:translateX(50%) !important;
    width:120px !important;
    height:38px !important;
  }
  .tv-countdown .promise-counter{
    gap:6px !important;
    padding-right:0 !important;
    margin-top:14px !important;
  }
  .tv-countdown .flap{
    min-width:62px !important;
    height:64px !important;
    font-size:34px !important;
    border-radius:10px !important;
  }
  .tv-antennas{
    top:-45px !important;
    width:150px !important;
    height:51px !important;
    transform:translateX(-50%) scale(.7) !important;
  }

  /* Final apply-CTA phone shadow cards: hide on small screens to prevent
     horizontal overflow from the floating chips */
  .phone-shadow-card{display:none !important}
  .phone-brand-card{right:-4px !important;transform:rotate(4deg) scale(.85);transform-origin:top right}
  .phone-shell{transform:none !important}
  /* Bulles côté masquées sur mobile → rapetisser le téléphone pour
     compenser l'espace vide et éviter qu'il paraisse trop gros */
  .phone-form-mock{min-height:0 !important}
  .phone-shell{width:min(300px,86%) !important;padding:11px !important;border-radius:42px !important}
  .phone-screen{min-height:480px !important;border-radius:32px !important;padding:54px 16px 18px !important}
  .phone-notch{top:19px;width:84px;height:20px}
}

/* =====================================================================
   MOBILE AUDIT v2 · fixes pour overflow horizontal, titres clippés,
   pills débordantes, scoreboard et hero résultats. (<=560px / <=780px)
   ===================================================================== */
@media (max-width:780px){
  /* Garde-fou global : empêche le moindre élément de pousser la page
     plus large que le viewport sur petit écran. */
  html, body{overflow-x:hidden !important;max-width:100vw}
  body{background:var(--bg)}
  section, .wrap, header, footer{max-width:100vw}

  /* Pills — autoriser le retour à la ligne au lieu de déborder */
  .pill-section, .pill-hero, .badge-pin, .htrio-eyebrow{
    max-width:100%;
    white-space:normal;
    line-height:1.25;
    font-size:10.5px;
    text-align:left;
  }

  /* Résultats hero — le « 100M$+ » en nowrap à 96px débordait */
  .results-hero-o3 h1 .num{
    font-size:clamp(64px,16vw,96px) !important;
    white-space:nowrap;
    letter-spacing:-.06em;
  }
  .results-hero-o3 h1{font-size:clamp(30px,8vw,44px) !important}
  .results-hero-o3 .lead{font-size:15.5px;padding-left:14px}

  /* Scoreboard panel — réduire padding/font pour tenir dans 358 dispo */
  .scoreboard-panel{padding:22px 18px 18px;border-radius:24px}
  .sb-grid{gap:10px}
  .sb-cell{padding:14px 12px 14px;min-height:108px;border-radius:18px}
  .sb-cell .sb-num{font-size:24px}
  .sb-cell .sb-num--text{font-size:18px}
  .scoreboard-panel .sb-head{flex-wrap:wrap;gap:8px}

  /* Formule — réduire le gros chiffre 01/02/03 qui mange 80px sur 390 */
  .formule-num{font-size:clamp(44px,12vw,64px) !important;line-height:.9}
  .formule-card{padding:20px !important;gap:16px !important;border-radius:24px}
  .formule-text h3{font-size:clamp(20px,5.4vw,26px) !important}

  /* Garantie — l'outline « MARCHE PAS, » sortait du cadre */
  .guarantee-h, .guarantee-card h2{
    font-size:clamp(28px,8.4vw,40px) !important;
    word-break:normal;hyphens:none;
  }

  /* Hero studio — l'outline « EN AMÉLIORATION RÉSIDENTIELLE » */
  .hero-studio-h1{font-size:clamp(34px,9vw,56px) !important;line-height:1.02}

  /* Cartes résultats — bord-droit clippé */
  .case-card, .case-row, .case-foot{max-width:100%}
  .case-num{font-size:clamp(56px,16vw,80px) !important;letter-spacing:-.05em}
}

/* =========================================================
   CAPS OVERFLOW FIX
   All titles are now uppercase, which makes single words
   (ENTREPRENEURS, AMÉLIORATION, RÉSIDENTIELLE…) much wider
   than before. Allow wrapping, widen ch-based max-widths,
   and tighten clamps so nothing clips on mobile or desktop.
   ========================================================= */
h1, h2, h3,
.hero-h1, .hero-studio-h1, .page-hero-title,
.brandhero-title, .section-head, .b-head,
.bsys-head, .bsys-reel-head, .bsys-bridge h2,
.case-head, .vs-head, .slack-head, .formule-head,
.htrio-cal-head, .promise-h, .darkcta-h, .applycta-h,
.guarantee-h, .manifesto-h, .brandwall-h,
.cc-h, .aa-h, .map-copy h3, .phone-screen h3,
.method-o2-copy h1, .reserve-o2-copy h3, .reserve-head h2,
.footer-hero h2{
  overflow-wrap:break-word;
  word-break:normal;
  hyphens:none;
}

/* Hero (studio) — words like ENTREPRENEURS need room in CAPS */
.hero-studio-h1{
  max-width:none;
  font-size:clamp(40px,5.2vw,88px);
}
@media (max-width:1100px){
  .hero-studio-h1{ font-size:clamp(40px,5.6vw,76px); max-width:none; }
}
@media (max-width:780px){
  .hero-studio-h1{ font-size:clamp(36px,10.5vw,58px) !important; max-width:100%; }
}
@media (max-width:420px){
  .hero-studio-h1{ font-size:clamp(32px,10vw,46px) !important; letter-spacing:-.06em; }
}
@media (max-width:420px){
  .hero-studio-h1{ font-size:clamp(28px,8.4vw,38px) !important; letter-spacing:-.05em; line-height:1.04 !important; }
}

/* Legacy hero-h1 (used on some sections) */
.hero-h1{
  max-width:14ch;
}
@media (max-width:780px){
  .hero-h1{ font-size:clamp(38px,10.5vw,60px) !important; max-width:100%; }
}
@media (max-width:420px){
  .hero-h1{ font-size:clamp(32px,10vw,48px) !important; }
}

/* Generic page hero (a-propos, methode, resultats, etc.) */
.page-hero-title{
  max-width:100%;
  font-size:clamp(34px,5.6vw,76px);
}
@media (max-width:780px){
  .page-hero-title{ font-size:clamp(30px,9.5vw,52px); }
}
@media (max-width:420px){
  .page-hero-title{ font-size:clamp(26px,9vw,42px); letter-spacing:-.03em; }
}

/* Italic/outline em spans inside CAPS H1 must be allowed to wrap */
.hero-studio-h1 em,
.hero-h1 .hero-h1-accent,
.hero-h1 em,
.bsys-head h2 em,
.bsys-reel-head h2 em,
.method-o2-copy h1 em{
  max-width:100%;
  overflow-wrap:anywhere;
}

/* =========================================================
   DISPLAY TITLE UNIFICATION
   Match the homepage H1 language across major site titles,
   while keeping per-section sizing responsive and uncropped.
   ========================================================= */
:where(
  .page-hero-title,
  .method-o2-copy h1,
  .brandhero-title,
  .h2,
  .bsys-head h2,
  .bsys-bridge h2,
  .bsys-reel-head h2,
  .b-head h2,
  .case-head h2,
  .vs-head h2,
  .slack-head h2,
  .formule-head h2,
  .internal-cost-h,
  .manifesto-h,
  .darkcta-h,
  .applycta-h,
  .promise-h,
  .guarantee-h,
  .brandwall-h,
  .footer-hero h2,
  .reserve-head h2,
  .reserve-o2-copy h3,
  .pasunfit-h,
  .br-h,
  .map-copy h3,
  .aa-h,
  .cc-h
){
  font-family:'Satoshi','Satoshi Variable',sans-serif !important;
  font-weight:950 !important;
  text-transform:uppercase !important;
  letter-spacing:-.074em !important;
  line-height:.86 !important;
  overflow:visible !important;
  padding-bottom:.12em;
}

:where(
  .page-hero-title,
  .method-o2-copy h1,
  .brandhero-title,
  .h2,
  .bsys-head h2,
  .bsys-bridge h2,
  .bsys-reel-head h2,
  .b-head h2,
  .case-head h2,
  .vs-head h2,
  .slack-head h2,
  .formule-head h2,
  .internal-cost-h,
  .manifesto-h,
  .darkcta-h,
  .applycta-h,
  .promise-h,
  .guarantee-h,
  .brandwall-h,
  .footer-hero h2,
  .reserve-head h2,
  .reserve-o2-copy h3,
  .pasunfit-h,
  .br-h,
  .map-copy h3,
  .aa-h,
  .cc-h
) :where(em,.hl-out,.hl-out--ink,.hl-out--green,.hl-grad){
  display:inline-block;
  font-style:italic;
  line-height:.92;
  padding:.03em .1em .18em;
  margin:-.03em -.055em -.13em;
  max-width:100%;
  overflow:visible;
}

:where(.page-hero-title,.h2,.bsys-head h2,.manifesto-h,.internal-cost-h){
  font-size:clamp(34px,5.2vw,82px) !important;
}
:where(.applycta-h,.darkcta-h,.promise-h,.guarantee-h,.pasunfit-h,.br-h,.map-copy h3,.aa-h,.cc-h){
  font-size:clamp(28px,3.8vw,56px) !important;
}
:where(.brandhero-title){
  font-size:clamp(38px,6.2vw,92px) !important;
}
:where(.method-o2-copy h1){
  font-size:clamp(36px,4.8vw,82px) !important;
}

@media (max-width:780px){
  :where(.page-hero-title,.h2,.bsys-head h2,.manifesto-h,.internal-cost-h,.brandhero-title,.method-o2-copy h1){
    font-size:clamp(30px,9.2vw,52px) !important;
    letter-spacing:-.062em !important;
    line-height:.9 !important;
  }
  :where(.applycta-h,.darkcta-h,.promise-h,.guarantee-h){
    font-size:clamp(27px,8.4vw,46px) !important;
    letter-spacing:-.058em !important;
    line-height:.92 !important;
  }
  :where(.pasunfit-h,.br-h,.map-copy h3,.aa-h,.cc-h){
    font-size:clamp(26px,7.8vw,42px) !important;
    letter-spacing:-.055em !important;
    line-height:.94 !important;
  }
}

@media (max-width:420px){
  :where(.page-hero-title,.h2,.bsys-head h2,.manifesto-h,.internal-cost-h,.brandhero-title,.method-o2-copy h1){
    font-size:clamp(27px,8.6vw,40px) !important;
    letter-spacing:-.052em !important;
  }
  :where(.pasunfit-h,.br-h,.map-copy h3,.aa-h,.cc-h){
    font-size:clamp(24px,7.3vw,34px) !important;
  }
}

/* ============================================================
   ÉQUIPE — colorize team roster + slack mock (less dark, more accent)
   ============================================================ */

/* LEFT CARD : team-roster — fill the void with subtle color depth */
.team-roster{
  position:relative;
  background:
    radial-gradient(circle at 0% 0%,rgba(40,174,96,.12),transparent 45%),
    radial-gradient(circle at 100% 100%,rgba(99,102,241,.10),transparent 50%),
    rgba(255,255,255,.04) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  overflow:hidden;
}
.team-roster::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);
  background-size:22px 22px;
  mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%);
  pointer-events:none;
  opacity:.6;
}
.team-roster > *{position:relative;z-index:1}

.team-row{
  background:rgba(255,255,255,.045) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  transition:border-color .25s ease,background .25s ease,transform .25s ease;
}
.team-row:hover{transform:translateY(-1px)}

/* Per-role color coding (matches selected prototype palette) */
.team-row:nth-child(1) .team-avatar{
  background:color-mix(in oklab,#22c55e 22%,transparent);
  color:#4ade80;border:1px solid color-mix(in oklab,#22c55e 35%,transparent);
}
.team-row:nth-child(1):hover{border-color:color-mix(in oklab,#22c55e 35%,transparent) !important;background:color-mix(in oklab,#22c55e 6%,rgba(255,255,255,.045)) !important}

.team-row:nth-child(2) .team-avatar{
  background:color-mix(in oklab,#3b82f6 22%,transparent);
  color:#60a5fa;border:1px solid color-mix(in oklab,#3b82f6 35%,transparent);
}
.team-row:nth-child(2):hover{border-color:color-mix(in oklab,#3b82f6 35%,transparent) !important;background:color-mix(in oklab,#3b82f6 6%,rgba(255,255,255,.045)) !important}

.team-row:nth-child(3) .team-avatar{
  background:color-mix(in oklab,#6366f1 22%,transparent);
  color:#818cf8;border:1px solid color-mix(in oklab,#6366f1 35%,transparent);
}
.team-row:nth-child(3):hover{border-color:color-mix(in oklab,#6366f1 35%,transparent) !important;background:color-mix(in oklab,#6366f1 6%,rgba(255,255,255,.045)) !important}

.team-row:nth-child(4) .team-avatar{
  background:color-mix(in oklab,#a855f7 22%,transparent);
  color:#c084fc;border:1px solid color-mix(in oklab,#a855f7 35%,transparent);
}
.team-row:nth-child(4):hover{border-color:color-mix(in oklab,#a855f7 35%,transparent) !important;background:color-mix(in oklab,#a855f7 6%,rgba(255,255,255,.045)) !important}

.team-row:nth-child(5) .team-avatar{
  background:color-mix(in oklab,#f97316 22%,transparent);
  color:#fb923c;border:1px solid color-mix(in oklab,#f97316 35%,transparent);
}
.team-row:nth-child(5):hover{border-color:color-mix(in oklab,#f97316 35%,transparent) !important;background:color-mix(in oklab,#f97316 6%,rgba(255,255,255,.045)) !important}

.team-row:nth-child(6) .team-avatar{
  background:color-mix(in oklab,#10b981 22%,transparent);
  color:#34d399;border:1px solid color-mix(in oklab,#10b981 35%,transparent);
}
.team-row:nth-child(6):hover{border-color:color-mix(in oklab,#10b981 35%,transparent) !important;background:color-mix(in oklab,#10b981 6%,rgba(255,255,255,.045)) !important}

/* RIGHT CARD : slack-mock — inject color across channels and avatars */
.slack-mock{
  background:linear-gradient(180deg,#141418,#0f0f13) !important;
}
.slack-sidebar{
  background:linear-gradient(180deg,#191920,#131318) !important;
}

/* Colored channel pills (each channel keeps its own tone) */
.slack-sidebar button:nth-of-type(1){color:#4ade80}
.slack-sidebar button:nth-of-type(1).is-active{
  background:color-mix(in oklab,#22c55e 14%,transparent);
  color:#4ade80;
}
.slack-sidebar button:nth-of-type(2){color:rgba(96,165,250,.85)}
.slack-sidebar button:nth-of-type(2).is-active{
  background:color-mix(in oklab,#3b82f6 14%,transparent);color:#60a5fa;
}
.slack-sidebar button:nth-of-type(3){color:rgba(251,146,60,.85)}
.slack-sidebar button:nth-of-type(3).is-active{
  background:color-mix(in oklab,#f97316 14%,transparent);color:#fb923c;
}
.slack-sidebar button:nth-of-type(4){color:rgba(192,132,252,.85)}
.slack-sidebar button:nth-of-type(4).is-active{
  background:color-mix(in oklab,#a855f7 14%,transparent);color:#c084fc;
}
.slack-sidebar button:nth-of-type(5){color:rgba(52,211,153,.85)}
.slack-sidebar button:nth-of-type(5).is-active{
  background:color-mix(in oklab,#10b981 14%,transparent);color:#34d399;
}

/* Tighten the ÉQUIPE row — remove ~25% of vertical void on both cards */
.equipe-grid{align-items:start !important;}
.team-roster{padding:22px !important;gap:14px !important;}
.team-list{gap:10px !important;}
.team-row{padding:10px !important;}
.slack-slider{min-height:0 !important;}
.slack-slides{min-height:0 !important;padding:18px !important;}
.slack-sidebar{padding:16px 12px !important;gap:16px !important;min-height:0 !important;}
.slack-head{padding:0 0 12px !important;margin-bottom:14px !important;}
.slack-msgs{gap:10px !important;}
.slack-msg{padding:12px !important;}

/* Message cards : slightly more lift + tinted accent border on hover */
.slack-msg{
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.025)) !important;
  border:1px solid rgba(255,255,255,.08) !important;
}

/* Channel header accent */
.slack-head{
  background:linear-gradient(180deg,rgba(255,255,255,.025),transparent);
  padding:14px 0 16px !important;
}
.slack-channel{color:#fff}
.slack-channel::before{color:#4ade80 !important;font-weight:700 !important}

/* Fix · method-results-bar row overflowing past wrap on the right.
   The generic `.trust-bar .wrap` rule (display:grid; 1fr 228px) was
   squeezing the 4-card row into a 228px column, which then bled past
   the viewport. Re-assert the 2-column layout (label auto, cards 1fr)
   and constrain the cards row to its grid cell. */
.trust-bar.method-results-bar .wrap{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) !important;
  align-items:center !important;
  gap:24px !important;
}
.trust-bar.method-results-bar .mini-case-row{
  min-width:0 !important;
  width:100% !important;
  flex:initial !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
}
@media (max-width:900px){
  .trust-bar.method-results-bar .wrap{
    grid-template-columns:1fr !important;
  }
  .trust-bar.method-results-bar .mini-case-row{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (max-width:560px){
  .trust-bar.method-results-bar .mini-case-row{
    grid-template-columns:1fr !important;
  }
}

/* ===================== HOME · TOP-OF-PAGE GRADIENT FADE ===================== */
body.tdb-home-fade{
  background:
    linear-gradient(
      to bottom,
      #deded7 0,
      #f3f3f0 var(--tdb-fade-end, 1800px),
      #f3f3f0 100%
    ) no-repeat #f3f3f0;
}
/* Let the body gradient show through the top sections so the fade is one
   smooth band instead of getting cut by opaque section backgrounds. */
body.tdb-home-fade .hero.hero-studio.hero-option6,
body.tdb-home-fade .ticker-wrap.hero-ticker,
body.tdb-home-fade .hero-cards-band,
body.tdb-home-fade .stat-wrap,
body.tdb-home-fade .trust-bar{
  background:transparent !important;
}
/* Kill the trust-bar 1px borders on home so the fade band reads as one
   continuous wash instead of two stacked rectangles. */
body.tdb-home-fade .trust-bar{
  border-top:0 !important;
  border-bottom:0 !important;
}

/* ===================== HOME · HERO FLAT (match Formule hero look) ===================== */
body.tdb-home-fade .hero.hero-studio.hero-option6{
  margin:0 !important;
  border-radius:0 !important;
  background:transparent !important;
}
body.tdb-home-fade .hero.hero-studio.hero-option6 .hero-grid{
  /* keep the subtle grid, but darken its lines a touch since bg is now light */
  background-image:
    linear-gradient(rgba(10,10,10,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(10,10,10,.055) 1px,transparent 1px) !important;
}

/* Promise-h same size as guarantee h2 */
.promesse-section .promise-h{
  font-size:clamp(34px,4.4vw,64px) !important;
}
@media (max-width:780px){
  .promesse-section .promise-h{
    font-size:clamp(22px,5.5vw,32px) !important;
  }
}


/* ============ GUARANTEE — FLAT (frameless, pale, clean) ============ */
body:not(.flow-option) .guarantee.guarantee--flat{
  background:#fafaf8 !important;
  padding:80px 0 !important;
  position:relative;
}
body:not(.flow-option) .guarantee.guarantee--flat::before,
body:not(.flow-option) .guarantee.guarantee--flat::after{display:none !important}

body:not(.flow-option) .guarantee--flat .guarantee-flat{
  display:grid;
  grid-template-columns:280px 1fr;
  gap:64px;
  align-items:center;
  max-width:1080px;
  margin:0 auto;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
}
body:not(.flow-option) .guarantee--flat .guarantee-flat > .guarantee-seal{order:0}
body:not(.flow-option) .guarantee--flat .guarantee-flat > .guarantee-body{order:1}
@media (max-width:820px){
  body:not(.flow-option) .guarantee--flat .guarantee-flat{
    grid-template-columns:1fr;
    gap:32px;
    text-align:left;
  }
  body:not(.flow-option) .guarantee--flat .guarantee-seal{margin:0 auto}
}

body:not(.flow-option) .guarantee--flat .guarantee-seal{
  width:260px !important;
  height:260px !important;
  position:relative;
}
body:not(.flow-option) .guarantee--flat .guarantee-seal svg circle:first-of-type{
  stroke:rgba(10,10,10,.18) !important;
}
body:not(.flow-option) .guarantee--flat .guarantee-seal svg circle:nth-of-type(2){
  stroke:rgba(40,174,96,.55) !important;
}
body:not(.flow-option) .guarantee--flat .guarantee-seal svg text,
body:not(.flow-option) .guarantee--flat .guarantee-seal text{
  fill:rgba(10,10,10,.45) !important;
}
body:not(.flow-option) .guarantee--flat .guarantee-seal .seal-100{
  color:var(--green) !important;
  font-size:64px !important;
  font-weight:900 !important;
  font-style:italic;
  letter-spacing:-0.04em;
}
body:not(.flow-option) .guarantee--flat .guarantee-seal .seal-lbl{
  color:#0a0a0a !important;
  font-weight:900 !important;
  opacity:.85;
}

body:not(.flow-option) .guarantee--flat .guarantee-body{
  display:flex; flex-direction:column; gap:18px;
}
body:not(.flow-option) .guarantee--flat .pill-section{
  background:#cef3fb;
  color:var(--ink);
  border:none;
  align-self:flex-start;
}
body:not(.flow-option) .guarantee--flat .pill-section .sq{background:var(--ink)}

body:not(.flow-option) .guarantee--flat .guarantee-h{
  color:#0a0a0a !important;
  font-size:clamp(34px,4.4vw,60px) !important;
  font-weight:900 !important;
  text-transform:uppercase;
  letter-spacing:-0.03em !important;
  line-height:.92 !important;
  margin:0;
}
body:not(.flow-option) .guarantee--flat .guarantee-h .hl-out{
  -webkit-text-fill-color:transparent;
  -webkit-text-stroke:1.5px rgba(10,10,10,.4);
  color:transparent;
}
body:not(.flow-option) .guarantee--flat .guarantee-h .hl-grad{
  color:var(--green) !important;
  background:none !important;
  -webkit-text-fill-color:var(--green) !important;
  font-style:italic;
}

body:not(.flow-option) .guarantee--flat .guarantee-p{
  color:rgba(10,10,10,.7) !important;
  font-size:18px !important;
  line-height:1.55;
  max-width:560px;
  margin:0;
}

body:not(.flow-option) .guarantee--flat .guarantee-list{
  display:flex; flex-direction:column; gap:12px; margin-top:6px; padding:0; list-style:none;
}
body:not(.flow-option) .guarantee--flat .guarantee-list li{
  color:#0a0a0a !important;
  font-size:16px !important;
  font-weight:500;
  padding-left:32px;
  position:relative;
  line-height:1.45;
}
body:not(.flow-option) .guarantee--flat .guarantee-list li::before{
  content:"";
  position:absolute;
  left:0; top:3px;
  width:20px; height:20px;
  border-radius:999px;
  border:1.5px solid var(--green);
  background:transparent !important;
}
body:not(.flow-option) .guarantee--flat .guarantee-list li::after{
  content:"";
  position:absolute;
  left:6px; top:8px;
  width:8px; height:5px;
  border-left:2px solid var(--green);
  border-bottom:2px solid var(--green);
  transform:rotate(-45deg);
}

/* Guarantee flat — rotating seal + stronger outline contrast */
@keyframes tdb-seal-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
body:not(.flow-option) .guarantee--flat .guarantee-seal{
  animation: tdb-seal-spin 24s linear infinite;
}
body:not(.flow-option) .guarantee--flat .guarantee-seal .seal-center{
  animation: tdb-seal-spin 24s linear infinite reverse;
  transform-origin: center;
}
body:not(.flow-option) .guarantee--flat .guarantee-h .hl-out{
  -webkit-text-fill-color: transparent !important;
  -webkit-text-stroke:1.5px rgba(10,10,10,.4) !important;
  color: transparent !important;
  opacity: 1 !important;
}

body:not(.flow-option) .guarantee--flat .pill-section{
  background:#cef3fb !important;
  color:var(--ink) !important;
  border:none !important;
  padding:7px 16px !important;
  font-size:11.5px !important;
}
body:not(.flow-option) .guarantee--flat .pill-section,
body:not(.flow-option) .guarantee--flat .pill-section *{
  color:#0a0a0a !important;
  -webkit-text-fill-color:#0a0a0a !important;
}
body:not(.flow-option) .guarantee--flat .pill-section .sq{
  background:var(--ink) !important;
}

/* Simple CTA — split editorial */
.simple-cta{
  position:relative;
  background:
    radial-gradient(circle at 82% 7%,rgba(40,174,96,.28),transparent 32%),
    radial-gradient(circle at 10% 100%,rgba(255,255,255,.08),transparent 30%),
    linear-gradient(135deg,#181713 0%,#0c0c09 58%,#050505 100%);
  padding:72px 0;border-radius:32px;
  max-width:min(1240px,calc(100% - 56px));margin:24px auto;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 44px 100px -62px rgba(10,10,10,.86);
}
.simple-cta::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:175px 175px;
  background-position:center top;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.95),transparent 92%);
  mask-image:linear-gradient(180deg,rgba(0,0,0,.95),transparent 92%);
}
.simple-cta > .wrap{position:relative;z-index:1}
.simple-cta-inner{margin:0 auto;padding:0 28px;display:grid;grid-template-columns:7fr 5fr;gap:64px;align-items:end;position:relative;z-index:1}
.simple-cta-h{font-family:'Satoshi','Satoshi Variable',sans-serif;font-size:clamp(36px,5.4vw,76px);font-weight:900;color:#fff;line-height:.92;letter-spacing:-.035em;text-transform:uppercase;margin:0}
.simple-cta-h .accent{
  background:linear-gradient(135deg,#3ed47a 0%,#28ae60 45%,#15703a 100%);
  -webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent;
}
.simple-cta-h .cta-outline{color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.4);-webkit-text-fill-color:transparent}
.simple-cta-right{display:flex;flex-direction:column;gap:24px;border-left:1px solid rgba(255,255,255,.18);padding-left:36px;margin-bottom:6px}
.simple-cta-p{font-size:clamp(14px,1vw,16px);color:rgba(255,255,255,.6);line-height:1.55;max-width:340px;margin:0}
.simple-cta .btn-pill--green{align-self:flex-start}
@media (max-width:900px){
  .simple-cta{padding:64px 0}
  .simple-cta-inner{padding:0 18px;grid-template-columns:1fr;gap:32px;align-items:start}
  .simple-cta-right{border-left:0;border-top:1px solid rgba(255,255,255,.18);padding-left:0;padding-top:24px}
}

/* ===== Promesse TV — shrink case + push antennas out of the frame ===== */
.promesse-section .promise-band{overflow:visible !important}
.promesse-section .promise-counter-wrap.tv-countdown{
  align-self:center !important;
}
.promesse-section .tv-case{
  min-height:236px !important;
  padding:34px 96px 28px 30px !important;
  transform:scale(.86);
  transform-origin:center center;
}
.promesse-section .tv-case::before{
  inset:18px 90px 18px 20px !important;
}
.promesse-section .tv-noise{
  inset:18px 90px 18px 20px !important;
}
.promesse-section .tv-countdown .flap{
  min-width:78px !important;
  height:78px !important;
  font-size:48px !important;
}
.promesse-section .tv-countdown .promise-counter{gap:12px !important;margin-top:14px}
.promesse-section .tv-antennas{
  top:-66px !important;
  height:48px !important;
}
.promesse-section .tv-antennas span{
  height:51px !important;
}
@media (max-width:780px){
  .promesse-section .promise-counter-wrap.tv-countdown{
    align-self:center !important;
  }
  .promesse-section .tv-case{transform:scale(.82);transform-origin:center center}
}

/* ============================================================
   PROMESSE 14 JOURS — Retro-tech minimalism refresh (v2c)
   ============================================================ */
.promesse-section .promise-band{
  position:relative;
  background:
    radial-gradient(800px 400px at 100% 50%, rgba(115,255,184,.10), transparent 60%),
    #0a0d0c !important;
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 30px 80px rgba(0,0,0,.35);
  padding:56px 64px !important;
  overflow:hidden;
}
.promesse-section .promise-band::before{
  content:"";
  position:absolute;inset:0;
  background:none;
  opacity:0;
  pointer-events:none;
  z-index:0;
}
.promesse-section .promise-band > *{position:relative;z-index:1}

.promesse-section .promise-badge{
  display:inline-flex;align-items:center;gap:10px;
  color:#73ffb8;
  font-size:11px;letter-spacing:.22em;font-weight:800;text-transform:uppercase;
}
.promesse-section .promise-badge .sq{
  width:8px;height:8px;background:#73ffb8;border-radius:0;
  box-shadow:0 0 10px #73ffb8;
}

.promesse-section .promise-h{
  font-size:clamp(40px, 5.2vw, 72px) !important;
  line-height:.95 !important;
  letter-spacing:-.02em;
  text-transform:uppercase;
  font-weight:900;
  margin-top:18px;
}
.promesse-section .promise-h .hl-out--green{
  -webkit-text-stroke:1.5px #73ffb8;
  color:transparent !important;
  background:none !important;
  filter:drop-shadow(0 0 14px rgba(115,255,184,.35));
}

.promesse-section .promise-sub{
  margin-top:24px;
  padding-left:20px;
  border-left:2px solid rgba(115,255,184,.35);
  color:rgba(255,255,255,.65) !important;
  font-size:16px;line-height:1.6;
  max-width:520px;
}

/* TV refinements */
.promesse-section .tv-case{
  background:linear-gradient(180deg,#1c1f1e,#141716) !important;
  border:1px solid rgba(255,255,255,.08);
  border-radius:36px !important;
  box-shadow:0 25px 60px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.05);
}
.promesse-section .tv-case::before{
  background:#06080700 !important;
  box-shadow:inset 0 0 60px rgba(115,255,184,.08);
  border:1px solid rgba(255,255,255,.04);
  border-radius:22px;
}
.promesse-section .counter-label{
  color:rgba(115,255,184,.7) !important;
  font-size:10px;letter-spacing:.28em;font-weight:800;
  text-transform:uppercase;
}
.promesse-section .tv-countdown .flap{
  background:#fafaf8 !important;
  color:#0a0d0c !important;
  border-radius:12px !important;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.06), 0 2px 0 rgba(0,0,0,.4);
  font-weight:900 !important;
}
.promesse-section .counter-unit small{
  color:rgba(255,255,255,.45) !important;
  font-size:10px;letter-spacing:.18em;font-weight:800;
  text-transform:uppercase;
  margin-top:8px;
}

/* Antennas — cleaner thin lines with tips */
.promesse-section .tv-antennas span{
  background:linear-gradient(to top, rgba(255,255,255,.35), rgba(255,255,255,0)) !important;
  width:2px !important;
}
.promesse-section .tv-antennas span::after{
  content:"";
  position:absolute;top:-3px;left:50%;transform:translateX(-50%);
  width:6px;height:6px;border-radius:999px;background:rgba(255,255,255,.55);
  box-shadow:0 0 8px rgba(115,255,184,.4);
}

@media (max-width:780px){
  .promesse-section .promise-band{padding:40px 24px !important}
  .promesse-section .promise-sub{margin-top:18px}
}

/* Final width lock — these two non-hero bands must match the bottom CTA exactly */
body:not(.flow-option) #promesse.promesse-section,
body:not(.flow-option) #garantie.guarantee.guarantee--flat{
  width:calc(min(1280px, 100vw - 88px) - clamp(20px, 2.4vw, 34px) * 2) !important;
  max-width:calc(min(1280px, 100vw - 88px) - clamp(20px, 2.4vw, 34px) * 2) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}
body:not(.flow-option) #promesse.promesse-section > .wrap{
  max-width:none !important;
  padding-left:0 !important;
  padding-right:0 !important;
}
body:not(.flow-option) #promesse.promesse-section .promise-band{
  width:100% !important;
  max-width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
  transform:none !important;
  box-sizing:border-box !important;
}

/* === Promesse · slimmer band + antennas that break out of the rectangle === */
body:not(.flow-option) .promesse-section,
body:not(.flow-option) #promesse.promesse-section{
  overflow:visible !important;
  padding-top:120px !important;
  padding-bottom:32px !important;
}
body:not(.flow-option) #promesse.promesse-section .promise-band{
  padding:28px 36px !important;
  margin-top:0 !important;
  border-radius:24px !important;
  overflow:visible !important;
  gap:32px !important;
}
body:not(.flow-option) #promesse.promesse-section .promise-h{
  font-size:clamp(26px,3vw,40px) !important;
  margin-top:10px !important;
}
body:not(.flow-option) #promesse.promesse-section .promise-sub{
  font-size:14px !important;
  margin-top:14px !important;
  padding-left:14px !important;
  max-width:440px !important;
}
body:not(.flow-option) #promesse.promesse-section .promise-badge{
  font-size:10px !important;
}
body:not(.flow-option) #promesse.promesse-section .tv-case{
  min-height:220px !important;
  padding:32px 96px 26px 30px !important;
  border-radius:28px !important;
}
body:not(.flow-option) #promesse.promesse-section .tv-case::before,
body:not(.flow-option) #promesse.promesse-section .tv-noise{
  inset:18px 90px 18px 22px !important;
  border-radius:22px !important;
}
body:not(.flow-option) #promesse.promesse-section .tv-countdown .flap{
  min-width:74px !important;
  height:74px !important;
  font-size:46px !important;
}
/* Antennas — clearly break out above the band */
body:not(.flow-option) #promesse.promesse-section .tv-antennas{
  top:-116px !important;
  height:136px !important;
  width:220px !important;
  z-index:5 !important;
}
body:not(.flow-option) #promesse.promesse-section .tv-antennas span{
  height:144px !important;
  width:3px !important;
  background:linear-gradient(to top,rgba(255,255,255,.55),rgba(255,255,255,.05)) !important;
}
body:not(.flow-option) #promesse.promesse-section .tv-antennas span:first-child{
  left:60px !important; transform:rotate(-32deg) !important;
}
body:not(.flow-option) #promesse.promesse-section .tv-antennas span:last-child{
  right:60px !important; transform:rotate(32deg) !important;
}
@media (max-width:780px){
  body:not(.flow-option) #promesse.promesse-section{padding-top:96px !important}
  body:not(.flow-option) #promesse.promesse-section .promise-band{padding:24px 20px !important}
  body:not(.flow-option) #promesse.promesse-section .tv-antennas{
    top:-84px !important;
    transform:translateX(-50%) scale(.78) !important;
  }
}

/* CONTACT HERO PHONE · scale down + keep inside the right column */
/* CONTACT HERO PHONE · keep home look, just fit the column */
.hero-option6.method-hero-o2 .reserve-o2-media{
  grid-template-columns:1fr !important;
  min-height:0 !important;
  place-items:start center !important;
  overflow:visible !important;
}
.hero-option6.method-hero-o2 .reserve-o2-grid{
  align-items:start !important;
}
.hero-option6.method-hero-o2 .hero-phone-visual.phone-form-mock{
  transform:scale(.9) translateX(0) !important;
  transform-origin:top center !important;
  margin:-30px 0 -80px !important;
}

/* ===== FAQ light (home) ===== */
.faq--light{background:#fafaf8;padding:80px 0}

/* ===== About trio frame (cestquoi + equipe + slack) ===== */
.about-trio-wrap{padding:24px 0;background:var(--bg)}
/* Match the inter-section rhythm (~80px) between two stacked trio frames */
.about-trio-wrap + .about-trio-wrap{padding-top:56px}
.about-trio-frame{
  width:calc(min(1280px, 100vw - 88px) - clamp(20px, 2.4vw, 34px) * 2);
  max-width:calc(min(1280px, 100vw - 88px) - clamp(20px, 2.4vw, 34px) * 2);
  margin:0 auto;
  background:#fafaf8;
  border-radius:32px;
  overflow:hidden;
  box-sizing:border-box;
}
.about-trio-frame > section{background:transparent}
.about-trio-frame > section.equipe,
.about-trio-frame > section.equipe.equipe--slack{
  max-width:none !important;
  width:auto !important;
  margin:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  padding-top:40px !important;
}
@media (max-width:780px){
  .about-trio-wrap{padding:12px 10px}
  .about-trio-frame{border-radius:24px}
  .about-trio-frame > section.equipe{margin:0}
}
.faq--light .faq-a-layout{
  display:grid;grid-template-columns:5fr 7fr;gap:96px;align-items:start;
}
@media (max-width:900px){.faq--light .faq-a-layout{grid-template-columns:1fr;gap:48px}}

/* Left intro — no card, no dark bg */
.faq--light .faq-left-card.faq-left-light{
  background:transparent !important;
  border:0 !important;
  border-left:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  color:var(--ink);
}
.faq--light .faq-left-card.faq-left-light{overflow:visible !important;min-height:0 !important;border-radius:0 !important}
.faq--light .faq-left-card.faq-left-light > .pill-hero{margin-bottom:28px}
.faq--light .faq-left-card.faq-left-light > .pill-hero .sq{background:var(--green)}
.faq--light .faq-left-card.faq-left-light > .pill-hero{text-transform:uppercase;padding:10px 18px}
/* Match width of guarantee + bottom CTA */
body:not(.flow-option) #faq.faq--light{
  width:calc(min(1280px, 100vw - 88px) - clamp(20px, 2.4vw, 34px) * 2) !important;
  max-width:calc(min(1280px, 100vw - 88px) - clamp(20px, 2.4vw, 34px) * 2) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}
body:not(.flow-option) #faq.faq--light > .wrap{
  width:100% !important;
  max-width:none !important;
  padding-left:0 !important;
  padding-right:0 !important;
}
.faq--light .faq-a-layout{
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  background:#fafaf8 !important;
  border-color:transparent !important;
  box-shadow:none !important;
}
.faq--light .faq-light-h{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:clamp(32px,3.4vw,46px);
  line-height:1.05;
  letter-spacing:-.035em;
  font-weight:600;
  text-transform:uppercase;
  color:var(--ink);
  margin:0 0 36px;
}
.faq--light .faq-light-accent{color:var(--green);font-style:italic;font-weight:600}
.faq--light .faq-light-list{list-style:none;margin:0;padding:0}
.faq--light .faq-light-list li{
  display:flex;align-items:flex-start;gap:14px;
  padding:18px 0;
  border-bottom:1px solid rgba(10,10,10,.06);
}
.faq--light .faq-light-list li:last-child{border-bottom:0}
.faq--light .faq-light-list .dot{
  width:6px;height:6px;border-radius:999px;background:var(--green);
  margin-top:10px;flex-shrink:0;
}
.faq--light .faq-light-list p{
  margin:0;color:rgba(10,10,10,.78);
  font-size:15.5px;line-height:1.55;
}

/* Right accordion — hairline rows */
.faq--light .faq-a-list{border-top:1px solid rgba(10,10,10,.1)}
.faq--light .faq-line{
  background:transparent !important;
  border:0 !important;
  border-bottom:1px solid rgba(10,10,10,.1) !important;
  border-radius:0 !important;
  padding:0 !important;
  box-shadow:none !important;
}
.faq--light .faq-line summary{
  list-style:none;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;
  gap:24px;padding:26px 0;
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-size:19px;font-weight:500;letter-spacing:-.01em;
  color:var(--ink);
  transition:color .2s ease;
}
.faq--light .faq-line summary::-webkit-details-marker{display:none}
.faq--light .faq-line:hover summary{color:var(--green)}
.faq--light .faq-line summary > span{
  display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;position:relative;
  color:transparent;font-size:0;flex-shrink:0;
  background:transparent !important;
  border-radius:0 !important;
  transform:none !important;
}
.faq--light .faq-line summary > span::before,
.faq--light .faq-line summary > span::after{
  content:"";position:absolute;background:var(--ink);
  transition:transform .25s ease, opacity .25s ease;
}
.faq--light .faq-line summary > span::before{width:14px;height:1.5px}
.faq--light .faq-line summary > span::after{width:1.5px;height:14px}
.faq--light .faq-line[open] summary > span::after{transform:scaleY(0);opacity:0}
.faq--light .faq-line[open] summary > span{
  background:transparent !important;
  transform:none !important;
}
.faq--light .faq-line[open] summary > span::before{background:var(--green)}
.faq--light .faq-line p{
  margin:0;padding:0 0 26px;
  max-width:640px;
  color:rgba(10,10,10,.7);
  font-size:15px;line-height:1.6;
}

/* === HERO CARDS · résultats stat + google === */
.hero-stat-card{
  background:#DEDED7 !important;
  display:flex;flex-direction:column;justify-content:space-between;
  padding:clamp(28px,3vw,44px);
  gap:18px;
}
.hero-stat-pill{
  display:inline-flex;align-items:center;gap:8px;
  align-self:flex-start;
  background:#0a0a0a;color:#fafaf8;
  padding:7px 13px;border-radius:999px;
  font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
}
.hero-stat-pill .sq{width:8px;height:8px;background:var(--green);border-radius:2px}
.hero-stat-num{
  font-size:clamp(48px,5vw,82px);
  line-height:.85;letter-spacing:-.06em;font-weight:950;color:#0a0a0a;
  white-space:nowrap;
}
.hero-stat-num em{font-style:normal}
.hero-stat-num sup{
  font-size:.38em;vertical-align:super;
  color:var(--green);font-weight:900;
  background:linear-gradient(135deg,var(--green),#86d39e);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-stat-sub{
  font-size:15.5px;line-height:1.45;color:rgba(10,10,10,.7);max-width:36ch;
}
.hero-stat-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:12px;
  border-top:1px solid rgba(10,10,10,.12);padding-top:18px;
}
.hero-stat-grid > div{display:flex;flex-direction:column;gap:2px}
.hero-stat-grid b{font-size:17px;font-weight:900;color:#0a0a0a;letter-spacing:-.02em;white-space:nowrap}
.hero-stat-grid span{font-size:11.5px;color:rgba(10,10,10,.6);text-transform:uppercase;letter-spacing:.08em}

.hero-google-card{
  background:#fafaf8 !important;color:#0a0a0a;
  display:flex;flex-direction:column;justify-content:space-between;
  padding:clamp(20px,2.4vw,30px);gap:14px;
}
.hero-google-top{display:flex;align-items:center;gap:12px}
.hero-google-top .g-dot{
  width:36px;height:36px;border-radius:50%;background:#fff;
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
}
.hero-google-top .g-dot svg{width:20px;height:20px}
.hero-google-top b{display:block;font-size:14px;font-weight:800;letter-spacing:-.01em}
.hero-google-top span{display:block;font-size:11px;color:rgba(10,10,10,.55);letter-spacing:.06em}
.hero-google-q{
  font-size:clamp(15px,1.4vw,18px);line-height:1.45;
  color:#0a0a0a;margin:0;font-weight:500;
}
.hero-google-attr{
  font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(10,10,10,.55);
  border-top:1px solid rgba(10,10,10,.12);padding-top:12px;
}

/* === HERO CARDS · marque brandbook images === */
.hero-brand-card{
  background:#0a0a0a !important;
  padding:0;overflow:hidden;position:relative;
}
.hero-brand-card > img{
  width:100%;height:100%;object-fit:cover;display:block;
}
.hero-brand-card .hero-studio-card-caption{
  position:absolute;left:0;right:0;bottom:0;
}

/* ============== UNIQUE PAGE HEROES — v3 ============== */

/* ---------- RÉSULTATS · Dark scoreboard ---------- */
.results-hero-o3{
  position:relative;background:#DEDED7;color:#0a0a0a;
  padding:clamp(104px,12vh,142px) 0 44px;overflow:hidden;border-bottom:0;
  margin:0;border-radius:0;
}
.results-hero-o3::before{content:none}
/* Framed card (copy of .method-o2-grid/.reserve-o2-grid framing) */
.results-hero-o3 .res-grid{
  position:relative;overflow:hidden;border-radius:34px;
  padding:clamp(34px,5vw,62px);
  background:#DEDED7;
  box-shadow:0 28px 84px -54px rgba(0,0,0,.62);
}
.results-hero-o3 .res-grid::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(10,10,10,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(10,10,10,.055) 1px,transparent 1px);
  background-size:175px 175px;
}
.results-hero-o3 .res-grid > *{position:relative;z-index:1}
.results-hero-o3 > .wrap{position:relative;z-index:2}
.results-hero-o3 .res-grid{display:grid;grid-template-columns:1.15fr 1.08fr;gap:52px;align-items:center}
.results-hero-o3 .page-hero-crumbs{color:rgba(10,10,10,.55)}
.results-hero-o3 .page-hero-crumbs a{color:rgba(10,10,10,.8)}
.results-hero-o3 .pill-hero{background:#2a2a2a;color:#fff;border:0;box-shadow:none;margin-top:18px}
.results-hero-o3 .pill-hero .sq{background:#28ae60}
.results-hero-o3 h1{
  font-family:'Satoshi','Satoshi Variable',sans-serif;font-weight:900;
  font-size:clamp(40px,5vw,72px);line-height:.98;letter-spacing:-.035em;margin:18px 0 0;color:#0a0a0a;
}
.results-hero-o3 h1 .num{
  display:block;font-weight:900;letter-spacing:-.055em;line-height:.85;margin-bottom:6px;white-space:nowrap;
  font-size:clamp(96px,14vw,200px);
  background:linear-gradient(135deg,#3ed47a 0%,#28ae60 45%,#15703a 100%);
  -webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent;
}
.results-hero-o3 h1 .num sup{
  font-size:.32em;vertical-align:top;font-style:normal;font-weight:900;
  margin-left:.05em;line-height:1;display:inline-block;
  background:linear-gradient(135deg,#28ae60 0%,#1e8a4a 100%);
  -webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent;
}
.results-hero-o3 h1 em{
  font-style:italic;font-weight:800;color:transparent;
  -webkit-text-stroke:1.5px rgba(10,10,10,.4);
  text-stroke:1.5px rgba(10,10,10,.4);
}
.results-hero-o3 .lead{
  font-size:17px;line-height:1.55;color:#444;max-width:520px;
  margin:20px 0 0;padding-left:18px;border-left:2px solid #28ae60;
}
.results-hero-o3 .hero-studio-actions{margin-top:28px;display:flex;gap:12px;flex-wrap:wrap}
.results-hero-o3 .btn-pill.hero-studio-ghost{
  background:#fff;color:#0a0a0a;border:1px solid rgba(10,10,10,.12)
}
.results-hero-o3 .btn-pill.hero-studio-ghost:hover{background:#fafaf8;color:#0a0a0a;border-color:#0a0a0a}

.scoreboard-panel{
  background:#0a0a0a;border:1px solid rgba(255,255,255,.06);border-radius:32px;
  padding:32px 30px 26px;color:#fff;
  box-shadow:0 32px 64px -24px rgba(10,10,10,.45),0 2px 4px rgba(10,10,10,.08);
  width:100%;max-width:590px;justify-self:center;align-self:center;
}
.scoreboard-panel .sb-head{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:18px;
}
.scoreboard-panel .sb-head .sb-lbl{font-size:10.5px;text-transform:uppercase;letter-spacing:.2em;font-weight:800;color:#8a8a85}
.scoreboard-panel .sb-live{display:inline-flex;align-items:center;gap:8px;padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);font-size:10px;text-transform:uppercase;letter-spacing:.18em;font-weight:800;color:rgba(255,255,255,.7)}
@keyframes sbPulse{0%,100%{opacity:1}50%{opacity:.55}}
.sb-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sb-cell{
  background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.06);
  border-radius:22px;padding:16px 16px 18px;
  display:flex;flex-direction:column;gap:8px;min-height:128px;
  transition:border-color .25s ease,background .25s ease;
}
.sb-cell:hover{border-color:rgba(40,174,96,.35);background:rgba(40,174,96,.04)}
.sb-cell .sb-eyebrow{font-size:9.5px;text-transform:uppercase;letter-spacing:.16em;font-weight:700;color:#8a8a85}
.sb-cell .sb-num{
  font-family:'Satoshi','Satoshi Variable',sans-serif;font-weight:900;font-size:30px;letter-spacing:-.035em;line-height:1;color:#fff;white-space:nowrap;
  display:inline-flex;align-items:baseline;gap:3px;max-width:100%;overflow:visible;padding-right:6px;
}
.sb-cell .sb-num em{color:#28ae60;font-style:italic;font-weight:900;font-size:18px;padding-right:4px}
.sb-cell .sb-num--text{font-size:22px;letter-spacing:-.02em}
.sb-cell .sb-tag{font-size:9.5px;text-transform:uppercase;letter-spacing:.14em;font-weight:700;color:rgba(40,174,96,.8);margin-top:-2px}
.sb-cell .sb-spark{margin-top:auto;display:flex;gap:3px;align-items:flex-end;height:30px}
.sb-cell .sb-spark span{flex:1;background:rgba(255,255,255,.08);border-radius:2px 2px 0 0;display:block}
.sb-cell .sb-spark span.hi-soft{background:rgba(40,174,96,.45)}
.sb-cell .sb-spark span.hi{background:#28ae60;box-shadow:0 0 10px rgba(40,174,96,.35)}
.sb-cell .sb-bar{margin-top:auto;display:block;width:100%;height:6px;background:rgba(255,255,255,.08);border-radius:999px;overflow:hidden}
.sb-cell .sb-bar span{display:block;height:100%;background:#28ae60;border-radius:999px;box-shadow:0 0 10px rgba(40,174,96,.4)}
.sb-cell .sb-avatars{margin-top:auto;display:flex}
.sb-cell .sb-avatars span{width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.12);border:2px solid #0a0a0a;margin-left:-6px}
.sb-cell .sb-avatars span:first-child{margin-left:0}
.sb-cell .sb-avatars span.plus{background:#28ae60;color:#0a0a0a;font-weight:900;font-size:10px;display:inline-flex;align-items:center;justify-content:center;line-height:1}
.sb-cell .sb-wave{margin-top:auto;display:block;width:100%;height:24px;color:#28ae60}
.sb-foot{margin:14px 0 2px;text-align:center;font-size:9.5px;font-weight:600;color:#5a5a55;letter-spacing:.06em}
@media (max-width:980px){
  .results-hero-o3{padding:64px 0 72px;border-radius:0 0 24px 24px}
  .results-hero-o3 .res-grid{grid-template-columns:1fr;gap:34px;align-items:start}
}

/* ---------- MARQUE · Gallery wall ---------- */
.brand-hero-o3{
  position:relative;padding:84px 0 28px;background:var(--bg);
}
.brand-hero-o3 .bh-top{
  display:grid;grid-template-columns:1fr auto;gap:32px;align-items:end;margin-bottom:36px;
}
.brand-hero-o3 .bh-copy{max-width:820px}
.brand-hero-o3 h1{
  font-family:'Satoshi','Satoshi Variable',sans-serif;font-weight:900;
  font-size:clamp(44px,6vw,92px);line-height:.96;letter-spacing:-.035em;margin:14px 0 0;color:var(--ink);
}
.brand-hero-o3 h1 span{font-weight:900;color:#28ae60}
.brand-hero-o3 .bh-meta{
  display:flex;flex-direction:column;align-items:flex-end;gap:6px;
  font-size:11px;text-transform:uppercase;letter-spacing:.14em;font-weight:800;color:#6b6b6b;text-align:right
}
.brand-hero-o3 .bh-meta b{font-size:30px;color:var(--ink);font-weight:900;letter-spacing:-.025em}
.brand-hero-o3 .bh-actions{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap}

.brand-gallery{
  display:grid;grid-template-columns:repeat(5,1fr);
  gap:14px;align-items:stretch;
}
.brand-gallery .bg-tile{
  position:relative;overflow:hidden;border-radius:22px;background:#111;aspect-ratio:3/4.2;display:block;
  box-shadow:0 30px 60px -38px rgba(10,10,10,.4);
  transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s;text-decoration:none;
}
.brand-gallery .bg-tile:hover{transform:translateY(-6px);box-shadow:0 42px 80px -32px rgba(10,10,10,.5)}
.brand-gallery .bg-tile img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.05)}
.brand-gallery .bg-tile::after{
  content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.55) 100%);pointer-events:none;
}
.brand-gallery .bg-tile .bg-cap{
  position:absolute;left:14px;bottom:12px;right:14px;display:flex;justify-content:space-between;align-items:flex-end;
  color:#fff;font-size:13px;font-weight:900;letter-spacing:.02em;z-index:2;
  text-shadow:0 2px 8px rgba(0,0,0,.45)
}
.brand-gallery .bg-tile .bg-cap span{font-size:10.5px;font-weight:700;opacity:.8;letter-spacing:.14em;text-transform:uppercase}
.brand-gallery .bg-tile.tall{margin-top:-22px}
.brand-gallery .bg-tile.short{margin-top:22px}
@media (max-width:980px){
  .brand-hero-o3 .bh-top{grid-template-columns:1fr;gap:18px;align-items:flex-start;margin-bottom:24px}
  .brand-hero-o3 .bh-meta{align-items:flex-start;text-align:left}
  .brand-gallery{grid-template-columns:1fr 1fr;gap:12px}
  .brand-gallery .bg-tile,
  .brand-gallery .bg-tile.tall,
  .brand-gallery .bg-tile.short{aspect-ratio:3/4;margin-top:0}
}

/* ---------- À PROPOS · Editorial portrait ---------- */
.about-hero-o3{position:relative;padding:clamp(104px,12vh,142px) 0 44px;background:#deded7;overflow:hidden;border-bottom:0}
.about-hero-o3 .ah-grid{
  display:grid;grid-template-columns:1fr 1.05fr;gap:56px;align-items:stretch;position:relative;
  overflow:hidden;border-radius:34px;padding:clamp(34px,5vw,62px);
  background:#deded7;box-shadow:0 28px 84px -54px rgba(0,0,0,.62);
}
.about-hero-o3 .ah-grid::before{
  content:"";position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(10,10,10,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(10,10,10,.055) 1px,transparent 1px);
  background-size:175px 175px;pointer-events:none;
}
.about-hero-o3 .ah-grid > *{position:relative;z-index:1}
.about-hero-o3 .ah-copy{padding:8px 0 24px;position:relative;display:flex;flex-direction:column;justify-content:center}
.about-hero-o3 h1{
  font-family:'Satoshi','Satoshi Variable',sans-serif;font-weight:900;
  font-size:clamp(40px,4.2vw,66px);line-height:1.15;letter-spacing:-.045em;margin:28px 0 18px;color:var(--ink);
  text-transform:none;max-width:18ch;
}
.about-hero-o3 h1 span{font-weight:900;color:#28ae60}
.about-hero-o3 h1 .h1-outline{
  color:transparent;-webkit-text-stroke:1.5px rgba(10,10,10,.4);text-stroke:1.5px rgba(10,10,10,.4);
  font-weight:900;
}
.about-hero-o3 h1 .h1-grad{
  background:linear-gradient(135deg,#28ae60 0%,#7be495 60%,#28ae60 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  font-weight:900;
}
.about-hero-o3 .ah-lead{font-size:17px;line-height:1.55;color:#444;max-width:520px;margin:0;border-left:2px solid var(--green);padding-left:18px}
.about-hero-o3 .ah-signature{
  margin-top:28px;display:flex;align-items:center;gap:14px;
  padding:12px 16px 12px 12px;border:1px solid rgba(10,10,10,.08);border-radius:999px;align-self:flex-start;background:#fafaf8;
}
.about-hero-o3 .ah-signature .sig-photo{
  width:42px;height:42px;border-radius:50%;overflow:hidden;flex-shrink:0;
  border:2px solid #fff;box-shadow:0 6px 14px -6px rgba(0,0,0,.3)
}
.about-hero-o3 .ah-signature .sig-photo img{width:100%;height:100%;object-fit:cover;display:block}
.about-hero-o3 .ah-signature .sig-name{font-weight:900;font-size:14px;letter-spacing:-.01em;color:var(--ink)}
.about-hero-o3 .ah-signature .sig-role{font-size:11.5px;color:#666;letter-spacing:.02em;margin-top:1px}
.about-hero-o3 .ah-actions{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap}

.about-hero-o3 .ah-media{
  position:relative;border-radius:30px;overflow:hidden;min-height:740px;
  background:#0a0a0a;border:1px solid #0a0a0a;box-shadow:0 30px 80px -40px rgba(0,0,0,.45);
  display:grid;grid-template-rows:2fr auto 1.6fr;
}
.about-hero-o3 .ah-media-top{position:relative;overflow:hidden}
.about-hero-o3 .ah-media-map{position:relative;overflow:hidden;background:#0a0a0a;border-top:1px solid rgba(255,255,255,.08)}
.about-hero-o3 .ah-media-map .tdb-map{position:absolute;inset:0;width:100%;height:100%}
.about-hero-o3 .ah-media-map .mapbox-frame{border-top-left-radius:0;border-top-right-radius:0}
.about-hero-o3 .ah-media img{
  width:100%;height:100%;object-fit:cover;object-position:center 35%;position:absolute;inset:0;display:block;
}
.about-hero-o3 .ah-media::after{
  content:none;
}
.about-hero-o3 .ah-media-top::after{
  content:none;
}
.about-hero-o3 .ah-media .ah-cap{
  position:relative;background:#0a0a0a;color:#fff;padding:20px 24px;
  display:flex;justify-content:space-between;align-items:flex-start;gap:16px;
  border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);
}
.about-hero-o3 .ah-media .ah-cap b{font-size:18px;font-weight:900;letter-spacing:-.01em;display:block;text-transform:uppercase;line-height:1}
.about-hero-o3 .ah-media .ah-cap span{font-size:10px;opacity:.55;letter-spacing:.22em;text-transform:uppercase;display:block;margin-top:8px;font-weight:600}
.about-hero-o3 .ah-media .ah-cap > div:last-child b{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:900}

.about-hero-o3 .ah-map-coords{
  position:absolute;left:14px;bottom:14px;z-index:3;
  font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.5);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}
.about-hero-o3 .ah-map-ctrl{
  position:absolute;right:14px;bottom:14px;z-index:3;display:flex;gap:4px;
}
.about-hero-o3 .ah-map-ctrl span{
  width:24px;height:24px;display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.6);font-size:12px;line-height:1;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}

.about-hero-o3 .ah-stamp{
  position:absolute;left:0;top:24px;z-index:4;transform:none;
  width:auto;height:auto;border-radius:0;background:#28ae60;color:#fff;
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:left;
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  padding:10px 16px;border:0;box-shadow:none;
}
.about-hero-o3 .ah-stamp b{font-size:11px;font-weight:900;letter-spacing:.22em;text-transform:uppercase;line-height:1;display:block}
.about-hero-o3 .ah-stamp em{display:block;font-style:normal;font-size:9px;font-weight:600;line-height:1;margin:6px 0 0;letter-spacing:.18em;text-transform:uppercase;opacity:.85}

.about-hero-o3 .ah-meta{
  display:flex;gap:32px;flex-wrap:wrap;margin-top:48px;padding:22px 0;
  border-top:1px solid rgba(10,10,10,.08);border-bottom:1px solid rgba(10,10,10,.08);
}
.about-hero-o3 .ah-meta div{display:flex;flex-direction:column;gap:3px;min-width:120px}
.about-hero-o3 .ah-meta b{font-family:'Satoshi','Satoshi Variable',sans-serif;font-size:24px;font-weight:900;letter-spacing:-.02em;color:var(--ink)}
.about-hero-o3 .ah-meta span{font-size:11px;color:#6b6b6b;text-transform:uppercase;letter-spacing:.14em;font-weight:800}

@media (max-width:980px){
  .about-hero-o3 .ah-grid{grid-template-columns:1fr;gap:24px}
  .about-hero-o3 .ah-media{min-height:0;aspect-ratio:4/5}
  .about-hero-o3 .ah-stamp{top:16px;left:0}
  .about-hero-o3 .ah-meta{gap:20px;margin-top:32px}
}

/* ===================== /RESULTATS · Style guide cream (cases + avant/après) ===================== */
/* Aligne les sections RÉSULTATS CLIENTS et AVANT/APRÈS sur le look /formule :
   cartes crème, quadrillé subtil, ombres douces, plus aucune carte dark. */
#cases.results,
#avantapres.avantapres{
  background:#f3f3f0;
}

/* --- Cases (RÉSULTATS CLIENTS) --- */
#cases .case-card{
  position:relative;
  background:#fafaf8 !important;
  color:var(--ink) !important;
  border:1px solid rgba(10,10,10,.08) !important;
  border-radius:26px !important;
  box-shadow:0 18px 50px -38px rgba(10,10,10,.45) !important;
  overflow:hidden;
}
#cases .case-card .client{color:var(--muted) !important}
#cases .case-card .case-num,
#cases .case-card .case-head{color:var(--ink) !important}
#cases .case-card .case-num sup,
#cases .case-card .case-num .k{color:var(--green) !important;-webkit-text-fill-color:var(--green) !important}
#cases .case-card .case-num .x{
  -webkit-text-stroke:1.5px rgba(40,174,96,.6) !important;
  -webkit-text-fill-color:transparent !important;
  color:transparent !important;
}
#cases .case-card .case-foot{border-top:1px dashed rgba(10,10,10,.12) !important;color:var(--muted) !important}
#cases .case-card .badge-pin{
  background:#fafaf8 !important;color:var(--muted) !important;
  border:1px solid rgba(10,10,10,.08) !important;
}
#cases .case-card .badge-pin .dot{background:var(--green) !important}
#cases .case-card .case-tag{
  background:#fafaf8 !important;color:var(--muted) !important;
  border:1px solid rgba(10,10,10,.08) !important;
}
#cases .case-card::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(10,10,10,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(10,10,10,.045) 1px,transparent 1px);
  background-size:120px 120px;
  display:block !important;
}
#cases .case-card > *{position:relative;z-index:1}
/* Kill the dark green accent card — make it cream with a green accent edge */
#cases .case-card.accent{
  background:#fafaf8 !important;
  border:1px solid rgba(10,10,10,.08) !important;
  box-shadow:0 18px 50px -38px rgba(10,10,10,.45) !important;
}
#cases .case-stack .case-card{display:flex !important;flex-direction:column !important}

/* --- Avant / Après --- */
#avantapres .aa-card{
  background:#fafaf8 !important;
  color:var(--ink) !important;
  border:1px solid rgba(10,10,10,.08) !important;
  border-radius:26px !important;
  box-shadow:0 18px 50px -38px rgba(10,10,10,.45) !important;
}
#avantapres .aa-card.before{background:#ececea !important}
/* "Après" card: cream + green accent, plus de fond sombre */
#avantapres .aa-card.after{
  background:#fafaf8 !important;
  color:var(--ink) !important;
  border:1px solid rgba(10,10,10,.08) !important;
  box-shadow:0 18px 50px -38px rgba(10,10,10,.45) !important;
}
#avantapres .aa-card.after .aa-tag{background:var(--green) !important;color:#fff !important;border:0 !important}
#avantapres .aa-card.after .aa-cal{
  background:#fafaf8 !important;border:1px solid rgba(10,10,10,.08) !important;
}
#avantapres .aa-card.after .aa-cal .day{color:var(--muted) !important}
#avantapres .aa-card.after .aa-cal .slot{background:#f0f0ec !important}
#avantapres .aa-card.after .aa-cal .slot.dim{background:#ececea !important}
#avantapres .aa-card.after .aa-cal .slot.filled{
  background:linear-gradient(135deg,var(--green),var(--green-soft)) !important;
  box-shadow:0 6px 16px rgba(40,174,96,.22) !important;
}
#avantapres .aa-card.after .aa-foot,
#avantapres .aa-card.after .aa-note{color:var(--muted) !important}

/* ===================== Style "résultats cream" — appliqué aux cartes
   d'accueil (.mini-case-row article) et de /formule (.result-card),
   en gardant leurs grosseurs respectives ===================== */
.mini-case-row article,
.results-marquee-section .result-card{
  position:relative !important;
  background:#fafaf8 !important;
  color:var(--ink) !important;
  border:1px solid rgba(10,10,10,.08) !important;
  border-radius:22px !important;
  box-shadow:0 18px 50px -38px rgba(10,10,10,.45) !important;
  overflow:hidden;
}
.mini-case-row article::before,
.results-marquee-section .result-card::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(10,10,10,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(10,10,10,.045) 1px,transparent 1px);
  background-size:80px 80px;
  z-index:0;
}
.mini-case-row article > *,
.results-marquee-section .result-card > *{position:relative;z-index:1}

/* Accueil: client label + gros chiffre + caption */
.mini-case-row article{padding:18px !important}
.mini-case-row span{color:var(--muted) !important}
.mini-case-row b{color:var(--ink) !important;font-weight:900 !important}
.mini-case-row small{
  display:inline-block;margin-top:8px;padding-top:10px;
  border-top:1px dashed rgba(10,10,10,.18);
  color:var(--muted) !important;
}

/* /formule: client + headline + tag */
.results-marquee-section .result-card .result-client{
  color:var(--muted) !important;
  font-size:12px !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  white-space:normal !important;
  border-bottom:0 !important;
  padding-bottom:6px !important;
  margin-bottom:10px !important;
}
.results-marquee-section .result-card b{
  color:var(--ink) !important;
  font-weight:800 !important;
}
.results-marquee-section .result-card span{
  margin-top:14px !important;
  padding-top:12px !important;
  border-top:1px dashed rgba(10,10,10,.18) !important;
  color:var(--muted) !important;
}

/* NAVBAR · transparent shell so width matches hero .wrap, styled box on inner */
.tdb-hdr{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  border-radius:0 !important;
}

/* Pill variant — blue (match NOS RÉSULTATS stat-chip) */
.pill-hero.pill-hero--blue{
  background:#cef3fb !important;
  color:#0a0a0a !important;
  padding:7px 16px !important;
  font-size:11.5px !important;
  font-weight:700 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
}
.pill-hero.pill-hero--blue .sq{background:#0a0a0a !important}

/* SECTION WIDTH · cap every .wrap to navbar width (except hero headers) */
.wrap{
  max-width:min(1280px,calc(100vw - 88px)) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.hero > .wrap,
.page-hero > .wrap,
.hero .wrap,
.page-hero .wrap{
  max-width:min(1280px,100%) !important;
}
/* full-bleed band sections also capped */
.applycta-band,
.darkcta-band,
.promise-band,
.results-marquee-section,
.brand-marquee-wrap{
  max-width:min(1280px,calc(100vw - 88px)) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
@media (max-width:780px){
  .wrap,
  .applycta-band,
  .darkcta-band,
  .promise-band,
  .results-marquee-section,
  .brand-marquee-wrap{
    max-width:calc(100vw - 20px) !important;
  }
}

/* Final lock · every page section's outer box matches the visible navbar pill
   visible pill = .tdb-hdr-inner = .tdb-hdr width (min(1280,100vw-88)) minus its horizontal padding (2*clamp(20,2.4vw,34)) */
 body:not(.flow-option) #tdb-lp > section:not(.hero):not(.page-hero):not(.promesse-section):not(.guarantee):not(.faq--light):not(.simple-cta):not(.applycta):not(.results-marquee-section):not(.trust-bar):not(.bsys-section){
  width:min(1280px, calc(100vw - 88px)) !important;
  max-width:min(1280px, calc(100vw - 88px)) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}
@media (max-width:780px){
  body:not(.flow-option) #tdb-lp > section:not(.hero):not(.page-hero):not(.promesse-section):not(.guarantee):not(.faq--light):not(.simple-cta):not(.applycta):not(.results-marquee-section):not(.trust-bar):not(.bsys-section){
    width:calc(100vw - 40px) !important;
    max-width:calc(100vw - 40px) !important;
  }
}

/* Bottom CTA section matches the visible navbar pill width exactly */
body:not(.flow-option) #tdb-lp > section.simple-cta,
body:not(.flow-option) #tdb-lp > section.applycta,
body:not(.flow-option) #tdb-lp > section.results-marquee-section,
body:not(.flow-option) #tdb-lp > section.trust-bar.method-results-bar{
  width:min(1212px, calc(100vw - 88px - clamp(20px, 2.4vw, 34px) - clamp(20px, 2.4vw, 34px))) !important;
  max-width:min(1212px, calc(100vw - 88px - clamp(20px, 2.4vw, 34px) - clamp(20px, 2.4vw, 34px))) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

/* /marque · bsys-section card matches the navbar pill width (same as simple-cta) */
body:not(.flow-option) #tdb-lp > section.bsys-section{
  width:min(1212px, calc(100vw - 88px - clamp(20px, 2.4vw, 34px) - clamp(20px, 2.4vw, 34px))) !important;
  max-width:min(1212px, calc(100vw - 88px - clamp(20px, 2.4vw, 34px) - clamp(20px, 2.4vw, 34px))) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

/* /resultats fixes:
   1) .results content must match the visible navbar pill, not the wider shell
   2) right reviews column must not exceed the case-stack height (kills the big
      empty white space between case cards and the next section)
*/
body:not(.flow-option) #tdb-lp > section.results#cases{
  width:min(1212px, calc(100vw - 88px - clamp(20px, 2.4vw, 34px) - clamp(20px, 2.4vw, 34px))) !important;
  max-width:min(1212px, calc(100vw - 88px - clamp(20px, 2.4vw, 34px) - clamp(20px, 2.4vw, 34px))) !important;
}
/* /formule · numbered cards section must match the visible navbar pill, not the wider shell */
body:not(.flow-option) #tdb-lp > section.formule{
  width:min(1212px, calc(100vw - 88px - clamp(20px, 2.4vw, 34px) - clamp(20px, 2.4vw, 34px))) !important;
  max-width:min(1212px, calc(100vw - 88px - clamp(20px, 2.4vw, 34px) - clamp(20px, 2.4vw, 34px))) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
body:not(.flow-option) #tdb-lp > section.formule > .wrap{
  width:100% !important;
  max-width:100% !important;
  padding-left:0 !important;
  padding-right:0 !important;
}
body:not(.flow-option) #tdb-lp > section.formule .formule-stack{
  width:100% !important;
  max-width:none !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
@media (max-width:780px){
  body:not(.flow-option) #tdb-lp > section.formule{
    width:calc(100vw - 40px) !important;
    max-width:calc(100vw - 40px) !important;
  }
}
body:not(.flow-option) #tdb-lp > section.formule.formule.formule.formule.formule.formule.formule.formule.formule.formule.formule{
  width:min(1212px, calc(100vw - 88px - clamp(20px, 2.4vw, 34px) - clamp(20px, 2.4vw, 34px))) !important;
  max-width:min(1212px, calc(100vw - 88px - clamp(20px, 2.4vw, 34px) - clamp(20px, 2.4vw, 34px))) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
@media (max-width:780px){
  body:not(.flow-option) #tdb-lp > section.formule.formule.formule.formule.formule.formule.formule.formule.formule.formule.formule{
    width:calc(100vw - 40px) !important;
    max-width:calc(100vw - 40px) !important;
  }
}
body:not(.flow-option) #tdb-lp > section.results > .wrap{
  padding-left:0 !important;
  padding-right:0 !important;
  max-width:100% !important;
  width:100% !important;
}
body:not(.flow-option) #cases .case-review-layout{
  align-items:stretch !important;
  position:relative !important;
}
body:not(.flow-option) #cases .reviews-vertical{
  align-self:stretch !important;
  position:relative !important;
  top:auto !important;
  margin-top:0 !important;
  height:auto !important;
  max-height:none !important;
  padding:0 !important;
  display:block !important;
  overflow:hidden !important;
}
body:not(.flow-option) #cases .reviews-vertical .review-rail{
  margin-top:0 !important;
  position:absolute !important;
  inset:0 !important;
  min-height:0 !important;
  height:auto !important;
  overflow:hidden !important;
  -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 60px, #000 calc(100% - 80px), transparent 100%) !important;
  mask-image:linear-gradient(to bottom, transparent 0, #000 60px, #000 calc(100% - 80px), transparent 100%) !important;
}
body:not(.flow-option) #cases .review-mini .review-g{
  width:22px;height:22px;display:inline-grid;place-items:center;
  background:#0a0a0a;border:1px solid #0a0a0a;border-radius:50%;
  flex-shrink:0;margin-right:4px;margin-bottom:5px;
}
body:not(.flow-option) #cases .review-mini .review-g svg{
  width:14px;height:14px;display:block;
}
/* === Review card · Editorial quote hero === */
body:not(.flow-option) #cases .review-mini{
  position:relative !important;
  background:#fafaf8 !important;
  border:1px solid rgba(10,10,10,.07) !important;
  border-radius:32px !important;
  box-shadow:0 4px 24px -8px rgba(10,10,10,.06) !important;
  padding:30px 28px 24px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:0 !important;
  min-height:240px !important;
}
/* Header row (repurposed from foot): tiny uppercase client label */
body:not(.flow-option) #cases .review-mini .review-mini-foot{
  order:0 !important;
  margin:0 0 22px !important;
  padding:0 !important;
  border:0 !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
}
body:not(.flow-option) #cases .review-mini .review-mini-foot span:first-child{
  display:inline-block !important;
  font-size:11px !important;
  font-weight:800 !important;
  letter-spacing:.14em !important;
  text-transform:uppercase !important;
  color:#9ca3af !important;
}
body:not(.flow-option) #cases .review-mini .review-mini-foot span:last-child{
  display:none !important;
}
/* Hero quote */
body:not(.flow-option) #cases .review-mini p{
  order:1 !important;
  margin:0 !important;
  padding:0 !important;
  color:#0a0a0a !important;
  font-size:clamp(18px, 1.5vw, 24px) !important;
  font-weight:800 !important;
  line-height:1.15 !important;
  letter-spacing:-.02em !important;
  text-transform:uppercase !important;
}
/* Footer row (repurposed from top): green dot + label + stars */
body:not(.flow-option) #cases .review-mini .review-mini-top{
  order:2 !important;
  margin:24px 0 0 !important;
  padding:18px 0 0 !important;
  border-top:1px solid rgba(10,10,10,.08) !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
}
body:not(.flow-option) #cases .review-mini .review-mini-top::before{
  content:"" !important;
  width:6px;height:6px;border-radius:50%;
  background:#1db954 !important;
  flex-shrink:0;order:0;
}
body:not(.flow-option) #cases .review-mini .review-mini-top::after{
  content:"Témoignage Google" !important;
  order:1;
  margin-right:auto !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.1em !important;
  text-transform:uppercase !important;
  color:#6b7280 !important;
}
body:not(.flow-option) #cases .review-mini .review-mini-top .review-avatar,
body:not(.flow-option) #cases .review-mini .review-mini-top > div b{
  display:none !important;
}
body:not(.flow-option) #cases .review-mini .review-mini-top > div{
  order:3 !important;
  display:inline-flex !important;
  align-items:center !important;
  margin:0 !important;
}
body:not(.flow-option) #cases .review-mini .review-mini-top > div small{
  display:inline-block !important;
  color:#FBBC05 !important;
  font-size:13px !important;
  line-height:1 !important;
  letter-spacing:.08em !important;
  margin:0 !important;
}
/* G icon: absolute top-right, full-color crisp */
body:not(.flow-option) #cases .review-mini .review-g{
  position:absolute !important;
  top:26px !important;
  right:26px !important;
  width:18px !important;
  height:18px !important;
  background:transparent !important;
  border:0 !important;
  margin:0 !important;
  opacity:1 !important;
  display:block !important;
}
body:not(.flow-option) #cases .review-mini .review-g svg{
  width:18px !important;
  height:18px !important;
}
@media (max-width:980px){
  body:not(.flow-option) #cases .reviews-vertical{
    margin-top:0 !important;
  }
  body:not(.flow-option) #cases .reviews-vertical .review-rail{
    margin-top:0 !important;
  }
}
/* /image-de-marque hero tiles · brandbook source images are 16:9 landscape;
   match the tile aspect so covers fill without leaving black space. */
body:not(.flow-option) #tdb-lp .brand-hero-o3 .brand-gallery .bg-tile,
body:not(.flow-option) #tdb-lp .brand-hero-o3 .brand-gallery .bg-tile.tall,
body:not(.flow-option) #tdb-lp .brand-hero-o3 .brand-gallery .bg-tile.short{
  aspect-ratio:16/9 !important;
  background:transparent !important;
  margin-top:0 !important;
}
body:not(.flow-option) #tdb-lp .brand-hero-o3 .brand-gallery .bg-tile img{
  object-fit:cover !important;
  object-position:center top !important;
}

/* ---------- MARQUE · Hero v4 (mirror Formule layout) ---------- */
.brand-hero-o4.method-hero-o2{
  background:#deded7 !important;
}
.brand-hero-o4 .method-o2-copy h1 em{
  white-space:normal;
}
.brand-hero-o4 .method-o2-copy h1{
  font-size:clamp(42px,4vw,62px) !important;
  line-height:.88 !important;
  letter-spacing:-.066em !important;
  max-width:780px;
}
.brand-hero-o4 .method-o2-copy h1 .hl-grad{
  display:block;
  white-space:normal;
  overflow-wrap:normal;
  word-break:normal;
}
.brand-hero-o4 .reserve-o2-grid{
  grid-template-columns:minmax(0,1fr) minmax(250px,.48fr);
  gap:clamp(24px,3vw,42px);
}
/* Keep Marque close to the original stacked-card layout; only fill cards with real BrandBook pages. */
.brand-hero-o4 .method-o2-media,
.brand-hero-o4 .reserve-o2-media{
  overflow:hidden;
  grid-template-columns:1fr;
  min-height:0;
  justify-items:center;
}
.brand-hero-o4 .brand-mashup-card{
  min-height:500px;
  width:min(290px,100%);
}
.brand-mashup-card{
  background:#0a0a0a !important;
  overflow:hidden !important;
  padding:0 !important;
  position:relative;
}
.brand-mashup-strip{
  position:absolute;
  inset:0;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  padding:22px;
}
.brand-mashup-strip .bm-page{
  position:relative;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 18px 40px -18px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.06);
  background:#1a1a1a;
}
.brand-mashup-strip .bm-page img{
  width:100%;height:100%;object-fit:cover;object-position:center top;display:block;
  filter:saturate(1.05);
}
.brand-mashup-card .hero-studio-card-caption{
  z-index:4;
}
@media (max-width:980px){
  .brand-mashup-strip{grid-template-columns:repeat(2,1fr)}
}

/* ============ Hero — Image de marque (Architectural editorial) ============ */
.brand-hero-arc{position:relative;background:#deded7 !important;padding:clamp(104px,12vh,142px) 0 44px !important;overflow:visible;border-bottom:0 !important}
.brand-hero-arc .wrap{position:relative;z-index:2}
.brand-hero-arc .arc-grid-lines{position:absolute;inset:0;display:grid;grid-template-columns:repeat(6,1fr);pointer-events:none;opacity:.06;z-index:1}
.brand-hero-arc .arc-grid-lines span{border-right:1px solid #0A1F1C}
.brand-hero-arc .arc-grid-lines span:last-child{border-right:none}
.brand-hero-arc .arc-grid{display:grid;grid-template-columns:5.8fr 6.2fr;gap:32px;align-items:center;position:relative}
.brand-hero-arc .arc-grid{
  border-radius:34px;
  padding:clamp(34px,5vw,62px);
  background:#deded7;
  box-shadow:0 28px 84px -54px rgba(0,0,0,.62);
}
.brand-hero-arc .arc-grid::before{border-radius:inherit;overflow:hidden}
.brand-hero-arc .arc-grid::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(10,10,10,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(10,10,10,.055) 1px,transparent 1px);
  background-size:175px 175px;
}
.brand-hero-arc .arc-grid > *{position:relative;z-index:1}
.brand-hero-arc .arc-copy{position:relative;z-index:3}
.brand-hero-arc .page-hero-crumbs{margin-bottom:18px}
.brand-hero-arc .arc-pill{display:inline-flex;align-items:center;gap:10px;background:#0A1F1C;color:#fff;font-size:11px;font-weight:700;letter-spacing:.25em;text-transform:uppercase;padding:7px 16px;border-radius:999px;margin-bottom:22px}
.brand-hero-arc .arc-pill .sq{width:8px;height:8px;border-radius:50%;background:#22C55E;box-shadow:0 0 8px #22C55E;display:inline-block}
.brand-hero-arc .arc-h1{font-family:'Satoshi','Satoshi Variable',sans-serif;font-weight:950;text-transform:uppercase;color:#0a0a0a;font-size:clamp(42px,5.6vw,84px);line-height:.85;letter-spacing:-.06em;margin:0}
.brand-hero-arc .arc-faded{background:linear-gradient(135deg,#73FFB8 0%,#22C55E 50%,#16A34A 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.brand-hero-arc .arc-italic{display:inline-block;color:transparent;-webkit-text-stroke:1.4px #22C55E;font-weight:650;font-family:inherit;padding:.03em .09em .16em;margin:-.03em -.05em -.12em}
.brand-hero-arc .arc-dot{color:#22C55E;-webkit-text-stroke:0;font-style:normal}
.brand-hero-arc .arc-bottom{display:flex;flex-direction:column;align-items:flex-start;gap:28px;margin-top:40px}
.brand-hero-arc .arc-lead{max-width:460px;color:rgba(10,31,28,.7);font-size:17px;line-height:1.55;font-weight:500;text-transform:none;letter-spacing:normal;margin:0;border-left:2px solid var(--green);padding-left:20px}
.brand-hero-arc .arc-actions{display:flex;flex-direction:row;align-items:center;gap:18px;flex-wrap:wrap}
.brand-hero-arc .arc-cta-primary{background:#0A1F1C;color:#fff;border-radius:999px;padding:6px 28px 6px 8px;display:inline-flex;align-items:center;gap:14px;font-weight:700;transition:transform .2s}
.brand-hero-arc .arc-cta-primary:hover{transform:scale(1.04)}
.brand-hero-arc .arc-cta-primary .btn-avatar{width:40px;height:40px;border-radius:50%;overflow:hidden;border:2px solid #22C55E;background:#1a2e2a}
.brand-hero-arc .arc-cta-primary .btn-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.brand-hero-arc .arc-cta-ghost{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;font-weight:700;color:#0A1F1C;text-decoration:underline;text-decoration-color:rgba(34,197,94,.35);text-underline-offset:4px;text-decoration-thickness:2px;transition:color .2s}
.brand-hero-arc .arc-cta-ghost:hover{color:#22C55E}
.brand-hero-arc .arc-cta-ghost svg{width:16px;height:16px;transition:transform .2s}
.brand-hero-arc .arc-cta-ghost:hover svg{transform:translateX(4px)}

.brand-hero-arc .arc-media{position:relative;margin-left:40px;z-index:2}
.brand-hero-arc .arc-monolith{position:relative;background:#070706;border-radius:52px;padding:34px;box-shadow:0 40px 100px -20px rgba(0,0,0,.45);transform:rotate(3deg) scale(1.242);transform-origin:center;transition:transform 1s ease}
.brand-hero-arc .arc-monolith:hover{transform:rotate(0deg) scale(1.242)}
@media (hover:none) and (pointer:coarse),(max-width:1024px){
  .brand-hero-arc .arc-monolith,
  .brand-hero-arc .arc-monolith:hover{transform:none !important}
}
.brand-hero-arc .arc-mono-top{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;align-items:start}
.brand-hero-arc .arc-mono-row{display:grid;grid-template-columns:1.3fr 1fr 1.3fr;gap:16px;align-items:stretch}
.brand-hero-arc .arc-mono-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:14px;align-items:start}
.brand-hero-arc .arc-tile{border-radius:24px;overflow:hidden;position:relative;background:transparent}
.brand-hero-arc .arc-mono-strip .arc-tile{border-radius:18px}
.brand-hero-arc .arc-tile img{width:100%;height:auto;display:block}
.brand-hero-arc .arc-tile-img{position:relative}
.brand-hero-arc .arc-tile-img .arc-tile-alt{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#fff}
.brand-hero-arc .arc-tile-img .arc-tile-alt{opacity:0;animation:arcTileSwap 7s ease-in-out infinite}
/* Erco tile fix: middle tile (narrower column) needs explicit aspect-ratio so its
   bottom rounded corners are not clipped, and both base + alt images use contain
   so the helmet is never cropped. */
.brand-hero-arc .arc-mono-row .arc-tile{position:relative;overflow:hidden}
.brand-hero-arc .arc-mono-row .arc-tile:nth-child(2){aspect-ratio:1.3/1;background:#fff}
.brand-hero-arc .arc-mono-row .arc-tile > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center}
.brand-hero-arc .arc-mono-row .arc-tile:nth-child(2) > img{object-fit:cover;object-position:center;transform:scale(1.6);transform-origin:center}
.brand-hero-arc .arc-mono-row .arc-tile:nth-child(2) .arc-tile-alt{object-fit:cover;background:#fff;transform:scale(1.6);transform-origin:center}
.brand-hero-arc .arc-mono-row .arc-tile:nth-child(1) > img,
.brand-hero-arc .arc-mono-row .arc-tile:nth-child(3) > img{object-fit:cover;object-position:center;transform:scale(1.6);transform-origin:center}
.brand-hero-arc .arc-mono-row .arc-tile:nth-child(1) .arc-tile-alt,
.brand-hero-arc .arc-mono-row .arc-tile:nth-child(3) .arc-tile-alt{object-fit:cover;background:transparent;transform:scale(1.6);transform-origin:center}
.brand-hero-arc .arc-mono-top .arc-tile:nth-child(2) .arc-tile-alt{animation-delay:1.2s}
.brand-hero-arc .arc-mono-row .arc-tile:nth-child(1) .arc-tile-alt{animation-delay:.4s}
.brand-hero-arc .arc-mono-row .arc-tile:nth-child(2) .arc-tile-alt{animation-delay:2.1s}
.brand-hero-arc .arc-mono-row .arc-tile:nth-child(3) .arc-tile-alt{animation-delay:3.0s}
.brand-hero-arc .arc-mono-strip .arc-tile:nth-child(1) .arc-tile-alt{animation-delay:.9s}
.brand-hero-arc .arc-mono-strip .arc-tile:nth-child(2) .arc-tile-alt{animation-delay:1.8s}
.brand-hero-arc .arc-mono-strip .arc-tile:nth-child(3) .arc-tile-alt{animation-delay:2.7s}
.brand-hero-arc .arc-mono-strip .arc-tile:nth-child(4) .arc-tile-alt{animation-delay:3.6s}
.brand-hero-arc .arc-mono-strip .arc-tile:nth-child(5) .arc-tile-alt{animation-delay:4.5s}
@keyframes arcTileSwap{
  0%,42%{opacity:0}
  50%,92%{opacity:1}
  100%{opacity:0}
}
@media (prefers-reduced-motion: reduce){
  .brand-hero-arc .arc-tile-img .arc-tile-alt{animation:none;opacity:0}
}
.brand-hero-arc .arc-mono-foot{margin-top:24px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.brand-hero-arc .arc-mono-foot h2,
.brand-hero-arc .arc-mono-foot h3{font-family:'Satoshi','Satoshi Variable',sans-serif;font-weight:950;color:#fff;font-size:32px;line-height:.95;margin:0;text-transform:none;letter-spacing:-.04em}
.brand-hero-arc .arc-mono-foot h2 span,
.brand-hero-arc .arc-mono-foot h3 span{color:#22C55E}
@media (max-width:520px){
  .brand-hero-arc .arc-mono-foot h2,
  .brand-hero-arc .arc-mono-foot h3{font-size:24px;letter-spacing:-.045em}
}
.brand-hero-arc .arc-mono-foot p{margin:12px 0 0;font-size:9px;letter-spacing:.4em;font-weight:700;color:rgba(255,255,255,.3);text-transform:uppercase}
.brand-hero-arc .arc-mono-num{width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.2);display:inline-flex;align-items:center;justify-content:center;color:rgba(255,255,255,.4);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;flex-shrink:0}
.brand-hero-arc .arc-mono-badge{position:absolute;top:-18px;right:-18px;width:90px;height:90px;border-radius:50%;background:#22C55E;color:#0A1F1C;font-weight:800;font-size:10px;letter-spacing:.03em;text-transform:uppercase;display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.1;transform:rotate(-6deg);box-shadow:0 12px 28px -8px rgba(34,197,94,.4);padding:8px;font-family:'Satoshi','Satoshi Variable',sans-serif}

@media (max-width:980px){
  .brand-hero-arc{padding:48px 0 64px}
  .brand-hero-arc .arc-grid{grid-template-columns:1fr;gap:40px}
  .brand-hero-arc .arc-media{margin-left:0}
  .brand-hero-arc .arc-monolith{transform:none}
  .brand-hero-arc .arc-bottom{gap:28px}
}

/* ===== Auto-shuffle: top card lifts, slides behind, settles at the back ===== */
.bsys-stack .pg{
  transition: transform .55s cubic-bezier(.34,1.16,.64,1), opacity .35s ease;
}
.bsys-stack .pg.pg-lifting{
  transition: transform .45s cubic-bezier(.33,0,.2,1), opacity .25s ease-out;
  transform: translate(8%, -28%) rotate(6deg) scale(1.02) !important;
  opacity: 0;
  z-index: 99 !important;
}
.bsys-stack .pg.pg-returning{
  transition: transform .6s cubic-bezier(.22,.61,.36,1), opacity .45s ease-in;
}
@media (prefers-reduced-motion: reduce){
  .bsys-stack .pg, .bsys-stack .pg.pg-lifting, .bsys-stack .pg.pg-returning{
    transition:none !important; transform:none !important; opacity:1 !important;
  }
}

/* Click-to-shuffle hint badge */
.bsys-card{position:relative}
.bsys-hint{
  position:absolute; bottom:12px; right:12px; z-index:6;
  width:28px; height:28px;
  display:inline-flex; align-items:center; justify-content:center;
  pointer-events:none;
  color:#0a0a0a;
  filter: drop-shadow(0 2px 4px rgba(10,10,10,.18));
}
.bsys-hint-svg{
  position:relative; z-index:2;
  width:22px; height:22px; display:block;
  animation: bsysHintTap 1.8s cubic-bezier(.36,.07,.19,.97) infinite;
  transform-origin: 30% 30%;
}
.bsys-hint-svg--tap{display:none; transform-origin: 50% 90%}
/* "shock lines" radiating from the icon, triggered by the tap animation */
.bsys-hint-burst{
  position:absolute; inset:0; pointer-events:none;
  display:block;
}
.bsys-hint-ray{
  position:absolute; left:50%; top:50%;
  width:2px; height:7px; margin:-3.5px 0 0 -1px;
  background: var(--green,#28ae60);
  border-radius:2px;
  opacity:0;
  transform-origin: 50% 18px;
  animation: bsysHintRay 1.8s ease-out infinite;
}
.bsys-hint-ray:nth-child(1){transform: rotate(0deg)}
.bsys-hint-ray:nth-child(2){transform: rotate(60deg)}
.bsys-hint-ray:nth-child(3){transform: rotate(120deg)}
.bsys-hint-ray:nth-child(4){transform: rotate(180deg)}
.bsys-hint-ray:nth-child(5){transform: rotate(240deg)}
.bsys-hint-ray:nth-child(6){transform: rotate(300deg)}
@keyframes bsysHintTap{
  0%, 60%, 100%{transform: translate(0,0) scale(1)}
  68%{transform: translate(1px,1px) scale(.82)}
  76%{transform: translate(0,0) scale(1)}
}
@keyframes bsysHintRay{
  0%, 62%{opacity:0; transform-origin:50% 14px}
  70%{opacity:.9}
  100%{opacity:0; transform-origin:50% 22px}
}
/* keep each ray's rotation while animating the burst opacity/length */
.bsys-hint-ray:nth-child(1){animation-name: bsysHintRay1}
.bsys-hint-ray:nth-child(2){animation-name: bsysHintRay2}
.bsys-hint-ray:nth-child(3){animation-name: bsysHintRay3}
.bsys-hint-ray:nth-child(4){animation-name: bsysHintRay4}
.bsys-hint-ray:nth-child(5){animation-name: bsysHintRay5}
.bsys-hint-ray:nth-child(6){animation-name: bsysHintRay6}
@keyframes bsysHintRay1{0%,62%{opacity:0;transform:rotate(0) translateY(-10px) scaleY(.4)}72%{opacity:.95;transform:rotate(0) translateY(-14px) scaleY(1)}100%{opacity:0;transform:rotate(0) translateY(-18px) scaleY(.6)}}
@keyframes bsysHintRay2{0%,62%{opacity:0;transform:rotate(60deg) translateY(-10px) scaleY(.4)}72%{opacity:.95;transform:rotate(60deg) translateY(-14px) scaleY(1)}100%{opacity:0;transform:rotate(60deg) translateY(-18px) scaleY(.6)}}
@keyframes bsysHintRay3{0%,62%{opacity:0;transform:rotate(120deg) translateY(-10px) scaleY(.4)}72%{opacity:.95;transform:rotate(120deg) translateY(-14px) scaleY(1)}100%{opacity:0;transform:rotate(120deg) translateY(-18px) scaleY(.6)}}
@keyframes bsysHintRay4{0%,62%{opacity:0;transform:rotate(180deg) translateY(-10px) scaleY(.4)}72%{opacity:.95;transform:rotate(180deg) translateY(-14px) scaleY(1)}100%{opacity:0;transform:rotate(180deg) translateY(-18px) scaleY(.6)}}
@keyframes bsysHintRay5{0%,62%{opacity:0;transform:rotate(240deg) translateY(-10px) scaleY(.4)}72%{opacity:.95;transform:rotate(240deg) translateY(-14px) scaleY(1)}100%{opacity:0;transform:rotate(240deg) translateY(-18px) scaleY(.6)}}
@keyframes bsysHintRay6{0%,62%{opacity:0;transform:rotate(300deg) translateY(-10px) scaleY(.4)}72%{opacity:.95;transform:rotate(300deg) translateY(-14px) scaleY(1)}100%{opacity:0;transform:rotate(300deg) translateY(-18px) scaleY(.6)}}
.bsys-card:hover .bsys-hint{color:var(--green,#28ae60)}
.bsys-card.bsys-clicked .bsys-hint{opacity:.5}
.bsys-card.dark .bsys-hint{color:#fff}
/* Mobile: swap cursor icon for a finger/tap icon */
@media (max-width:680px){
  .bsys-hint-svg--cursor{display:none}
  .bsys-hint-svg--tap{display:block}
}
@media (prefers-reduced-motion: reduce){
  .bsys-hint-svg, .bsys-hint-ray{animation:none !important; opacity:1}
  .bsys-hint-ray{opacity:.6}
}

/* Brand hero arc — keep phrases on one line + outline dot */
.brand-hero-arc .hero-studio-h1{font-size:clamp(38px,4.9vw,76px)}
.brand-hero-arc .hero-studio-h1 .arc-line{display:inline-block;white-space:nowrap}
.brand-hero-arc .hero-studio-h1 .arc-dot-outline{
  background:linear-gradient(180deg,#5fd38a 0%,#28ae60 55%,#1d8a4b 100%) !important;
  -webkit-background-clip:text !important;background-clip:text !important;
  color:transparent !important;-webkit-text-fill-color:transparent !important;
  -webkit-text-stroke:0 !important;text-stroke:0 !important;
}


/* ============== À PROPOS · sections (style Formule) ============== */

/* Fondateur — gros card rond comme .formule-card */
.ap-founder{padding:80px 0 24px;background:var(--bg)}
.ap-founder > .wrap{max-width:1328px;padding-left:clamp(20px,2.4vw,34px);padding-right:clamp(20px,2.4vw,34px)}
.ap-founder-grid{
  display:grid;grid-template-columns:.9fr 1.2fr;gap:36px;
  background:#fafaf8;border:1px solid var(--line);
  border-radius:32px;padding:36px;align-items:center;overflow:hidden;
}
.ap-founder-media{position:relative;border-radius:24px;overflow:hidden;aspect-ratio:4/5;background:#1c1c1c;box-shadow:var(--shadow-lift)}
.ap-founder-media img{width:100%;height:100%;object-fit:cover;display:block}
.ap-founder-badge{position:absolute;left:14px;bottom:14px;display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;background:rgba(243,243,240,.94);font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--ink)}
.ap-founder-badge .sq{width:8px;height:8px;background:var(--green);border-radius:2px}
.ap-founder-copy{display:flex;flex-direction:column;gap:14px;padding-top:8px}
.ap-founder-copy h2{margin:6px 0 4px}
.ap-founder-copy .lead{margin:0;max-width:54ch}
.ap-founder-sig{margin-top:18px;padding-top:18px;border-top:1px solid var(--line)}
.ap-sig-name{display:block;font-family:'Satoshi','Satoshi Variable',sans-serif;font-style:italic;font-weight:900;font-size:30px;line-height:1;color:var(--ink);letter-spacing:-.02em}
.ap-sig-role{display:block;margin-top:6px;font-size:13px;color:var(--muted);letter-spacing:.04em}
@media (max-width:980px){.ap-founder-grid{grid-template-columns:1fr;padding:24px;gap:24px}}
@media (max-width:780px){.ap-founder{padding:56px 0 16px}.ap-founder > .wrap{padding-left:10px;padding-right:10px}}

/* Timeline — 4 cartes rondes alignées, même look que .formule-card */
.ap-timeline{padding:48px 0;background:var(--bg)}
.ap-timeline > .wrap{max-width:1328px;padding-left:clamp(20px,2.4vw,34px);padding-right:clamp(20px,2.4vw,34px)}
.ap-tl-head{max-width:780px;margin-bottom:32px}
.ap-tl-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.ap-tl-item{
  position:relative;
  background:#fafaf8;border:1px solid var(--line);
  border-radius:32px;padding:32px 28px;
  display:flex;flex-direction:column;gap:14px;
}
.ap-tl-item:nth-child(3){background:var(--ink);border-color:var(--ink);color:#fff}
.ap-tl-item:nth-child(3) .ap-tl-year{color:var(--green-soft)}
.ap-tl-item:nth-child(3) h3{color:#fafaf8}
.ap-tl-item:nth-child(3) p{color:rgba(255,255,255,.78)}
.ap-tl-year{
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-style:italic;font-weight:900;
  font-size:clamp(40px,4.4vw,56px);line-height:.85;letter-spacing:-.05em;
  color:var(--green);font-variant-numeric:tabular-nums;
}
.ap-tl-body h3{margin:0 0 4px;font-family:'Satoshi','Satoshi Variable',sans-serif;font-size:20px;font-weight:800;letter-spacing:-.02em;color:var(--ink)}
.ap-tl-body p{margin:0;font-size:15px;line-height:1.5;color:var(--muted)}
@media (max-width:980px){.ap-tl-list{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.ap-tl-list{grid-template-columns:1fr;gap:16px}.ap-tl-item{padding:24px}}

/* Partenaires — card unique style Formule */
.ap-partners{padding:48px 0;background:var(--bg)}
.ap-partners > .wrap{max-width:1328px;padding-left:clamp(20px,2.4vw,34px);padding-right:clamp(20px,2.4vw,34px)}
.ap-partners-card{
  background:#fafaf8;border:1px solid var(--line);
  border-radius:32px;padding:40px;
}
.ap-partners-head{max-width:760px;margin:0 0 28px}
.ap-partners-head h2{margin:14px 0 0}
.ap-logos{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--bg)}
.ap-logos li{display:flex;align-items:center;justify-content:center;padding:24px 16px;font-weight:700;font-size:14.5px;letter-spacing:.04em;color:var(--ink);border-right:1px solid var(--line);border-bottom:1px solid var(--line);text-transform:uppercase;text-align:center}
.ap-logos li:nth-child(4n){border-right:0}
.ap-logos li:nth-last-child(-n+4){border-bottom:0}
.ap-partners-meta{display:flex;flex-wrap:wrap;gap:18px;margin-top:22px;font-size:13px;color:var(--muted)}
.ap-partners-meta span b{color:var(--ink);margin-right:4px}
@media (max-width:880px){.ap-partners-card{padding:28px}.ap-logos{grid-template-columns:repeat(2,1fr)}.ap-logos li{border-right:1px solid var(--line)!important;border-bottom:1px solid var(--line)!important}.ap-logos li:nth-child(2n){border-right:0!important}.ap-logos li:nth-last-child(-n+2){border-bottom:0!important}}

/* CTA final — équivalent .formule-card.reverse */
.ap-cta{padding:48px 0 96px;background:var(--bg)}
.ap-cta > .wrap{max-width:1328px;padding-left:clamp(20px,2.4vw,34px);padding-right:clamp(20px,2.4vw,34px)}
.ap-cta-card{
  display:grid;grid-template-columns:1.4fr 1fr;gap:36px;align-items:center;
  padding:48px;border-radius:32px;
  background:var(--ink);color:#fafaf8;border:1px solid var(--ink);
  position:relative;overflow:hidden;
}
.ap-cta-card::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 240px at 80% 0%,rgba(40,174,96,.22),transparent 70%);pointer-events:none}
.ap-cta-copy{position:relative;z-index:1}
.ap-cta-copy .pill-section.pill-dark{background:rgba(255,255,255,.08);color:#fafafa;border:1px solid rgba(255,255,255,.16)}
.ap-cta-copy h2{color:#fafaf8;margin:14px 0 16px}
.ap-cta-copy .lead{color:rgba(250,250,250,.78);margin:0 0 26px;max-width:46ch;border-left-color:var(--green-soft)}
.ap-cta-actions{display:flex;flex-wrap:wrap;gap:18px;align-items:center}
.ap-cta-link{color:var(--green-soft);font-weight:600;text-decoration:none;font-size:15px}
.ap-cta-link:hover{color:#fff}
.ap-cta-side{position:relative;z-index:1;display:grid;gap:14px}
.ap-cta-side > div{padding:18px 22px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1)}
.ap-cta-side b{display:block;font-size:26px;color:#fafaf8;letter-spacing:-.01em}
.ap-cta-side span{display:block;margin-top:4px;font-size:13px;color:rgba(250,250,250,.66)}
@media (max-width:980px){.ap-cta-card{grid-template-columns:1fr;padding:32px;gap:24px}}

/* À propos · hero carousel (remplace l'image fixe dans .ah-media) */
.about-hero-o3 .ah-carousel{position:absolute;inset:0;z-index:0}
.about-hero-o3 .ah-track{position:absolute;inset:0}
.about-hero-o3 .ah-slide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity .7s ease}
.about-hero-o3 .ah-slide.is-active{opacity:1}
.about-hero-o3 .ah-slide img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0}
.about-hero-o3 .ah-dots{position:absolute;left:24px;top:22px;display:flex;gap:6px;z-index:3}
.about-hero-o3 .ah-dots span{width:22px;height:4px;border-radius:2px;background:rgba(255,255,255,.42);transition:background .3s}
.about-hero-o3 .ah-dots span.is-active{background:var(--green,#28ae60)}

/* À propos · stats band (bridge hero → manifesto) */
.about-stats{background:linear-gradient(180deg,#deded7 0%,#e8e8e2 55%,#f3f3f0 100%);padding:22px 0 26px;border-bottom:1px solid rgba(0,0,0,.05)}
.about-stats .about-stats-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:end}
.about-stats .about-stats-row li{position:relative;padding:6px 4px 6px 18px;display:flex;flex-direction:column;gap:2px}
.about-stats .about-stats-row li::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;background:#28ae60;border-radius:2px}
.about-stats .about-stats-row li b{font-family:"Satoshi",sans-serif;font-weight:900;font-size:clamp(28px,3vw,38px);letter-spacing:-.02em;color:#0d0d0d;line-height:1}
.about-stats .about-stats-row li span{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:rgba(13,13,13,.62);font-weight:500}
@media (max-width:720px){.about-stats .about-stats-row{grid-template-columns:repeat(2,1fr);gap:14px}}

/* À propos · team groups (Acquisition / Création / Vente) */
.team-groups{display:flex;flex-direction:column;gap:18px}
.team-group-h{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.72);font-weight:600;margin-bottom:8px;padding-left:2px}
.team-group-dot{width:8px;height:8px;border-radius:50%;background:var(--gd,#28ae60);box-shadow:0 0 0 3px color-mix(in oklab,var(--gd,#28ae60) 22%,transparent)}

/* ===================================================================
   TEAM PLAQUE — architectural org-chart for L'ÉQUIPE TDB
   =================================================================== */
.team-plaque{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:0;
  background:#f3f3f0;
  color:#0a0a0a;
  border:1px solid rgba(0,0,0,.10);
  border-radius:24px;
  overflow:hidden;
  font-family:'Satoshi','Plus Jakarta Sans',system-ui,sans-serif;
}
.team-plaque .tp-head{
  grid-column:1 / -1;
  border-bottom:1px solid rgba(0,0,0,.10);
  padding:28px 32px;
  display:flex;
  flex-direction:row;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
}
.team-plaque .tp-title{
  font-size:clamp(64px,9vw,148px);
  line-height:.85;
  font-weight:800;
  letter-spacing:-.04em;
  text-transform:uppercase;
  color:#0a0a0a;
  margin:0;
}
.team-plaque .tp-dot{color:#28ae60}
.team-plaque .tp-outline{
  color:transparent;
  -webkit-text-stroke:1.5px rgba(10,10,10,.4);
  text-stroke:1.5px rgba(10,10,10,.4);
}
.team-plaque .tp-sub{
  max-width:280px;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  line-height:1.6;
  color:rgba(0,0,0,.55);
  margin:0 0 8px 0;
  font-weight:500;
}

/* Columns */
.team-plaque .tp-col{
  padding:28px;
  display:flex;
  flex-direction:column;
  min-height:360px;
  position:relative;
}
.team-plaque .tp-col--list{grid-column:span 4;border-right:1px solid rgba(0,0,0,.10)}
.team-plaque .tp-col--center{grid-column:span 5;border-right:1px solid rgba(0,0,0,.10);background:#0a0a0a;color:#f3f3f0;align-items:center;justify-content:flex-start;text-align:center;overflow:hidden}
.team-plaque .tp-col--plaque{grid-column:span 3}

/* Headers */
.team-plaque .tp-h{display:flex;align-items:center;gap:12px;margin-bottom:40px}
.team-plaque .tp-tag{
  font-size:10px;font-weight:800;letter-spacing:.04em;
  padding:4px 7px;background:#0a0a0a;color:#fff;border-radius:2px;
}
.team-plaque .tp-tag--green{background:#28ae60}
.team-plaque .tp-label{font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.team-plaque .tp-h--inv{position:absolute;top:24px;left:24px;margin:0}
.team-plaque .tp-h--inv .tp-label{color:#f3f3f0;letter-spacing:.3em;font-size:11px}

/* List column */
.team-plaque .tp-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px;flex:1}
.team-plaque .tp-list li{
  display:flex;align-items:baseline;gap:14px;
  font-size:20px;font-weight:300;letter-spacing:-.01em;line-height:1.25;
  color:#0a0a0a;
  transition:transform .3s ease;
}
.team-plaque .tp-list li:hover{transform:translateX(4px)}
.team-plaque .tp-bullet{color:#28ae60;font-size:8px;line-height:1}
.team-plaque .tp-coord{
  margin-top:24px;
  font-family:ui-monospace,'JetBrains Mono',monospace;
  font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(0,0,0,.4);
}
.team-plaque .tp-col--list .tp-coord{text-align:right;}

/* Center typographic column */
.team-plaque .tp-type{display:flex;flex-direction:column;gap:6px;z-index:1}
.team-plaque .tp-col--center .tp-type{margin-top:62px}
.team-plaque .tp-type-line--accent{margin-top:18px}
.team-plaque .tp-type-line{
  font-size:clamp(28px,4vw,52px);
  font-weight:800;line-height:.95;letter-spacing:-.04em;
  text-transform:uppercase;
  transition:font-style .3s ease, color .3s ease;
}
.team-plaque .tp-type-line:hover{font-style:italic;color:#28ae60}
.team-plaque .tp-type-line--accent{color:#28ae60}
.team-plaque .tp-type-line--muted{opacity:.5}
.team-plaque .tp-foot{
  position:absolute;bottom:24px;right:24px;
  font-size:10px;letter-spacing:.2em;text-transform:uppercase;opacity:.4;
}

/* Plaque column */
.team-plaque .tp-plate{
  border:2px solid #0a0a0a;
  padding:22px 20px;
  position:relative;
  background:#f3f3f0;
}
.team-plaque .tp-plate-stamp{
  position:absolute;top:-9px;left:6px;
  background:#f3f3f0;padding:0 8px;
  font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
}
.team-plaque .tp-plate-row{
  display:flex;flex-direction:column;gap:2px;
  padding:14px 0;
  border-bottom:1px solid rgba(0,0,0,.10);
}
.team-plaque .tp-plate-row:first-of-type{padding-top:0}
.team-plaque .tp-plate-row:last-of-type{border-bottom:none;padding-bottom:0}
.team-plaque .tp-plate-k{font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:rgba(0,0,0,.4)}
.team-plaque .tp-plate-v{font-size:16px;font-weight:700;letter-spacing:-.01em;color:#0a0a0a}
.team-plaque .tp-seal{
  margin:18px 0;align-self:flex-end;
  width:48px;height:48px;border:1px solid #0a0a0a;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:10px;font-weight:800;letter-spacing:.05em;
  transform:rotate(12deg);
}

/* Align the plaque column's coord label like the others (bottom-right, same color/size) */
.team-plaque .tp-col--plaque .tp-coord{
  position:absolute;bottom:24px;right:24px;margin-top:0;
  font-family:ui-monospace,'JetBrains Mono',monospace;
  font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(0,0,0,.4);text-align:right;
}

/* Hard overrides: this section sits inside .equipe which forces dark bg + white text */
.equipe .team-plaque,
.equipe .team-plaque .tp-title,
.equipe .team-plaque .tp-list li,
.equipe .team-plaque .tp-plate-v{color:#0a0a0a}
.equipe .team-plaque .tp-col--center,
.equipe .team-plaque .tp-col--center .tp-type-line{color:#0a0a0a}
.equipe .team-plaque .tp-col--center .tp-type-line--accent{color:#28ae60}

/* Uniform light background #fafaf8 across the whole team-plaque section */
.equipe .team-plaque,
.equipe .team-plaque .tp-col--center,
.equipe .team-plaque .tp-plate,
.equipe .team-plaque .tp-plate-stamp{background:#fafaf8}
.equipe .team-plaque .tp-h--inv .tp-label{color:#0a0a0a}

/* Responsive */
@media (max-width:980px){
  .team-plaque{grid-template-columns:1fr}
  .team-plaque .tp-col--list,
  .team-plaque .tp-col--center,
  .team-plaque .tp-col--plaque{grid-column:1 / -1;border-right:none;border-bottom:1px solid rgba(0,0,0,.10);min-height:auto}
  .team-plaque .tp-col--plaque{border-bottom:none}
  .team-plaque .tp-head{flex-direction:column;align-items:flex-start;padding:24px}
}

/* À propos · #equipe: section claire (sans wrapper dark) — équipe--slack reste dark */
#equipe.equipe{background:transparent !important;color:var(--ink);max-width:none;margin:0;border-radius:0;padding:80px 0;overflow:visible}
#equipe.equipe::after,#equipe.equipe::before{content:none}
#equipe.equipe .lead{color:#4a4a4a}
#equipe.equipe .h2{color:var(--ink)}
#equipe.equipe .hl-out{-webkit-text-stroke:1.5px rgba(10,10,10,.4);color:transparent}
#equipe.equipe .pill-section{color:var(--ink)}

/* === Editorial moderne — manifesto C'est quoi Tourdubloc === */
.cestquoi--editorial{padding:96px 0 88px;background:#f3f3f0}
.manifesto-ed{max-width:1200px;margin:0 auto;padding:0 24px}
.manifesto-ed > .pill-hero{margin-bottom:32px}
.med-h--styled{
  font-size:clamp(28px,3.6vw,46px) !important;
  line-height:1.02 !important;
  letter-spacing:-.03em !important;
  font-weight:900 !important;
  text-transform:uppercase;
  color:#0a0a0a;
}
.med-h--styled .hero-h1-accent{
  background:linear-gradient(135deg,#28ae60,#a5ffbf);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent !important;
  font-style:normal;font-weight:900;
  display:inline !important;
  padding:0 !important;
  margin:0 !important;
}
.med-h--styled .hero-word-outline{
  font-style:normal !important;
  -webkit-text-stroke:1.5px rgba(10,10,10,.4);
  -webkit-text-fill-color:transparent;
  color:transparent;
  display:inline !important;
  transform:none !important;
  padding:0 !important;
  margin:0 !important;
}
.med-eyebrow{display:flex;align-items:center;gap:16px;margin-bottom:64px}
.med-rule{flex:1;height:1px;background:rgba(0,0,0,.1)}
.med-pill{display:inline-flex;align-items:center;gap:8px;padding:7px 16px;border:1px solid rgba(0,0,0,.06);background:rgba(255,255,255,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:999px;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:rgba(0,0,0,.6);white-space:nowrap;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.med-dot{width:6px;height:6px;border-radius:50%;background:#28ae60;display:inline-block}
.med-h-muted{color:rgba(0,0,0,.3);font-weight:800}
.med-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:48px 80px;align-items:start;position:relative}
.med-h{font-family:'Satoshi',system-ui,sans-serif;font-size:clamp(2rem,4vw,3.75rem);font-weight:800;line-height:1.1;letter-spacing:-0.02em;color:#0a0a0a;margin:0;text-transform:uppercase;grid-column:1 / span 7}
.med-card{grid-column:8 / -1;padding:32px;border-radius:20px;background:rgba(255,255,255,.4);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.6);box-shadow:0 20px 40px -20px rgba(0,0,0,.06);margin-top:0}
.med-p{font-size:1.05rem;line-height:1.65;font-weight:400;color:rgba(0,0,0,.7);margin:0}
.med-tagline{margin:16px 0 0;font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#28ae60}
.med-flow{position:relative;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin:28px 4px 12px;padding:0 8px}
.med-flow-track{position:absolute;top:18px;left:28px;right:28px;height:2px;background-image:linear-gradient(to right,rgba(10,10,10,.45) 50%,transparent 50%);background-size:8px 2px;background-repeat:repeat-x}
.med-flow-step{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;flex:1;min-width:0;text-align:center}
.med-flow-dot{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:#fff;border:1.5px solid #0a0a0a;color:#0a0a0a;font-size:.7rem;font-weight:800;letter-spacing:.05em}
.med-flow-dot--solid{background:#0a0a0a;color:#fff;box-shadow:0 6px 18px -6px rgba(10,10,10,.4)}
.med-flow-label{font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#0a0a0a;line-height:1.25}
@media (max-width:480px){.med-flow-label{font-size:.65rem;letter-spacing:.08em}}
.med-chips{display:flex;flex-wrap:wrap;gap:12px;margin-top:80px}
.med-chip{display:inline-flex;align-items:center;gap:12px;padding:12px 22px;background:#fff;border:1px solid rgba(0,0,0,.05);border-radius:14px;box-shadow:0 1px 2px rgba(0,0,0,.03);transition:border-color .25s ease,transform .25s ease,box-shadow .25s ease}
.med-chip:hover{border-color:rgba(40,174,96,.35);transform:translateY(-1px)}
.med-chip:hover .med-chip-dot{transform:scale(1.25)}
.med-chip-dot{width:8px;height:8px;border-radius:50%;background:#28ae60;display:inline-block;flex:0 0 auto;transition:transform .25s ease}
.med-chip span:last-child{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.14em;color:#0a0a0a}
.med-badge{position:absolute;top:-20px;right:0;width:clamp(200px,16vw,260px);aspect-ratio:1;z-index:3}
.med-badge-ring{position:absolute;inset:0;width:100%;height:100%;animation:medBadgeSpin 22s linear infinite;transform-origin:50% 50%}
.med-badge-core{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center}
.med-badge-since{font-size:clamp(11px,1vw,14px);font-weight:800;letter-spacing:.32em;color:rgba(0,0,0,.55);text-transform:uppercase}
.med-badge-year{font-family:'Satoshi',system-ui,sans-serif;font-size:clamp(3.4rem,6vw,5rem);font-weight:900;line-height:1;letter-spacing:-.02em;color:#0a0a0a}
@keyframes medBadgeSpin{to{transform:rotate(360deg)}}
@keyframes medBadgePulse{0%{box-shadow:0 0 0 0 rgba(40,174,96,.55)}70%{box-shadow:0 0 0 14px rgba(40,174,96,0)}100%{box-shadow:0 0 0 0 rgba(40,174,96,0)}}
@media (max-width:760px){
  .cestquoi--editorial{padding:64px 0 56px}
  .med-eyebrow{margin-bottom:32px}
  .med-grid{grid-template-columns:1fr;gap:28px}
  .med-h,.med-card{grid-column:1 / -1}
  .med-card{padding:24px}
  .med-chips{margin-top:40px}
  .med-badge{grid-column:1 / -1;justify-self:center;margin-top:8px;width:200px}
}

/* ============================================================
   EQUIPE--SLACK : Editorial glass (light, sable, vert #28ae60)
   Override de toute la version dark précédente.
   ============================================================ */
.equipe.equipe--slack{
  background:#f3f3f0 !important;
  color:#1a1a1a !important;
  max-width:none !important;
  width:auto !important;
  margin:0 !important;
  border-radius:0 !important;
  padding:96px 0 !important;
  overflow:visible !important;
  position:relative;
}
.equipe.equipe--slack::after,
.equipe.equipe--slack::before{display:none !important;content:none !important}
.equipe--slack .wrap{position:relative;z-index:1;max-width:1240px;margin:0 auto;padding:0 32px}

.equipe--slack .section-head{display:block;margin-bottom:56px}
.equipe--slack .section-head .left{max-width:760px}
.equipe--slack .pill-section{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 14px;background:#fff;
  border:1px solid rgba(40,174,96,.22);
  border-radius:999px;
  font-size:10px;font-weight:800;letter-spacing:.18em;
  text-transform:uppercase;color:#28ae60;
  box-shadow:0 1px 2px rgba(0,0,0,.04);
}
.equipe--slack .pill-section .sq{
  width:8px;height:8px;border-radius:50%;background:#28ae60;
  animation:slackPulse 2.2s ease-in-out infinite;
}
@keyframes slackPulse{0%,100%{opacity:1}50%{opacity:.5}}
.equipe--slack .h2{
  color:#1a1a1a;
  font-size:clamp(2.5rem,5.4vw,4.8rem);
  line-height:.95;letter-spacing:-.02em;
  font-weight:800;
  margin:22px 0 28px;
  text-transform:uppercase;
}
.equipe--slack .lead{
  position:relative;
  padding-left:14px;
  color:#4a4a4a;
  font-size:1.1rem;line-height:1.65;
  max-width:560px;margin:0;
  border-left:2px solid var(--green);
}
.equipe--slack .lead::before{content:none !important}

/* Glass mockup */
.equipe--slack .slack-mock{
  position:relative;
  display:grid;
  grid-template-columns:224px minmax(0,1fr);
  gap:0;
  padding:0 !important;
  overflow:hidden;
  background:rgba(255,255,255,.6) !important;
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border:1px solid #fff !important;
  border-radius:28px !important;
  box-shadow:
    0 32px 64px -24px rgba(0,0,0,.12),
    0 0 0 1px rgba(0,0,0,.03);
  font-family:'Satoshi','Inter',system-ui,sans-serif;
  min-height:500px;
}
.equipe--slack .slack-mock::before,
.equipe--slack .slack-mock::after{display:none !important;content:none !important}

/* Decorative glow */
.equipe--slack .slack-mock-wrap{position:relative}
.equipe--slack .slack-mock-wrap::before{
  content:"";position:absolute;top:-60px;right:-60px;
  width:280px;height:280px;border-radius:50%;
  background:rgba(40,174,96,.08);filter:blur(60px);
  pointer-events:none;z-index:0;
}
.equipe--slack .slack-mock-wrap::after{
  content:"";position:absolute;bottom:-60px;left:-60px;
  width:280px;height:280px;border-radius:50%;
  background:rgba(0,0,0,.05);filter:blur(60px);
  pointer-events:none;z-index:0;
}

/* Sidebar */
.equipe--slack .slack-sidebar{
  background:rgba(255,255,255,.4) !important;
  border-right:1px solid rgba(0,0,0,.05) !important;
  color:#1a1a1a !important;
  padding:22px 16px;
  display:flex;flex-direction:column;gap:18px;
  min-height:100%;
}
.equipe--slack .slack-workspace{
  font-size:15px;font-weight:800;color:#1a1a1a;
  display:flex;align-items:center;gap:10px;letter-spacing:-.01em;
}
.equipe--slack .slack-workspace::before{
  content:"T";display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:9px;
  background:#28ae60;color:#fff;font-weight:800;font-size:14px;
}
.equipe--slack .slack-side-label{
  margin:6px 0 4px;padding:0 8px;
  font-size:10px;font-weight:800;letter-spacing:.16em;
  text-transform:uppercase;color:#8a8a8a;
}
.equipe--slack .slack-sidebar button{
  display:block;width:100%;text-align:left;
  background:transparent;border:0;
  border-radius:10px;padding:9px 10px;
  font-size:13px;font-weight:500;color:#6a6a6a;
  cursor:pointer;transition:background .2s ease,color .2s ease;
}
.equipe--slack .slack-sidebar button:hover{background:rgba(0,0,0,.04);color:#1a1a1a}
.equipe--slack .slack-sidebar button.is-active{
  background:rgba(40,174,96,.1);color:#28ae60;font-weight:600;
}
.equipe--slack .slack-process{
  margin-top:auto;
  display:flex !important;flex-direction:row;align-items:center;gap:6px;
  width:auto !important;
  padding:12px !important;border-radius:14px;
  background:rgba(40,174,96,.06) !important;
  border:1px solid rgba(40,174,96,.18) !important;
  color:#28ae60 !important;
  font-size:10px;font-weight:800;letter-spacing:.06em;
  text-transform:uppercase;
  white-space:normal;
}

/* Chat panel */
.equipe--slack .slack-slides{
  position:relative;z-index:1;
  background:transparent !important;
  padding:0 !important;
  min-height:500px;
  display:flex;flex-direction:column;
}
.equipe--slack .slack-panel{display:none}
.equipe--slack .slack-panel.is-active{display:flex;flex-direction:column;flex:1}
.equipe--slack .slack-head{
  margin:0 !important;padding:0 24px !important;
  height:64px;
  display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid rgba(0,0,0,.05) !important;
  background:transparent !important;
}
.equipe--slack .slack-channel{font-weight:800;font-size:14px;color:#1a1a1a !important}
.equipe--slack .slack-channel::before{content:"#";color:#8a8a8a;margin-right:2px;font-weight:500}
.equipe--slack .slack-presence{
  margin-left:auto;
  font-size:10px;font-weight:800;letter-spacing:.16em;
  text-transform:uppercase;color:#8a8a8a !important;
}
.equipe--slack .slack-msgs{
  margin:0 !important;padding:24px;
  display:flex;flex-direction:column;gap:24px;
  flex:1;
}
.equipe--slack .slack-msg{
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  display:flex;gap:14px;align-items:flex-start;
}
.equipe--slack .slack-avatar{
  width:40px !important;height:40px !important;border-radius:12px !important;
  color:#fff !important;font-weight:800;font-size:11px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  box-shadow:0 8px 20px -8px rgba(40,174,96,.25);
}
.equipe--slack .slack-avatar.g{background:#28ae60 !important;box-shadow:0 8px 20px -8px rgba(40,174,96,.35) !important}
.equipe--slack .slack-avatar.o{background:#ff9f43 !important;box-shadow:0 8px 20px -8px rgba(255,159,67,.35) !important}
.equipe--slack .slack-avatar.p{background:#a78bfa !important;box-shadow:0 8px 20px -8px rgba(167,139,250,.35) !important}
.equipe--slack .slack-body{display:flex;flex-direction:column;gap:4px;min-width:0}
.equipe--slack .slack-body > div:first-child{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.equipe--slack .slack-user{font-weight:800;font-size:13.5px;color:#1a1a1a !important}
.equipe--slack .slack-time{
  font-size:10px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:#8a8a8a !important;margin:0;
}
.equipe--slack .slack-txt{
  color:#4a4a4a !important;font-size:13.5px;line-height:1.6;
}
.equipe--slack .slack-txt em{
  display:inline-block;padding:2px 10px;border-radius:999px;
  background:rgba(40,174,96,.1) !important;
  border:0 !important;
  color:#28ae60 !important;font-style:normal;font-weight:700;
}

/* Tabs (mobile fallback, normally hidden by sidebar) */
.equipe--slack .slack-tabs{display:none !important}

/* Layout : title left, mockup right on desktop */
@media (min-width:980px){
  .equipe--slack .wrap{
    display:grid;
    grid-template-columns:5fr 7fr;
    gap:64px;
    align-items:center;
  }
  .equipe--slack .section-head{margin-bottom:0}
  .equipe--slack .slack-mock{margin:0}
}
@media (max-width:979px){
  .equipe--slack{padding:64px 0 !important}
  .equipe--slack .h2{font-size:clamp(2rem,8vw,3rem)}
  .equipe--slack .slack-mock{grid-template-columns:1fr;min-height:auto}
  .equipe--slack .slack-sidebar{flex-direction:row;flex-wrap:wrap;gap:8px}
  .equipe--slack .slack-process{margin-top:0}
}

/* Expérience Tourdubloc — list + medal */
.xp-list{list-style:none;padding:0;margin:28px 0 0;display:flex;flex-direction:column;gap:18px}
.xp-list li{display:flex;align-items:center;gap:16px;font-size:1.15rem;font-weight:600;color:#0a0a0a;line-height:1.3}
.xp-list li em{font-style:italic;font-weight:600}
.xp-check{flex:0 0 auto;width:30px;height:30px;border-radius:50%;border:1.5px solid #0a0a0a;display:inline-flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#0a0a0a}
.xp-medal{margin-top:32px;display:inline-flex;align-items:center;gap:18px;padding:18px 28px;background:#fff;border-radius:18px;box-shadow:0 8px 24px -12px rgba(0,0,0,.12);max-width:520px}
.xp-medal-icon{font-size:2.25rem;line-height:1;flex:0 0 auto}
.xp-medal-txt{font-family:'Satoshi',system-ui,sans-serif;font-size:1rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#0a0a0a;line-height:1.3}
@media (max-width:640px){
  .xp-list li{font-size:1rem}
  .xp-medal{padding:14px 20px;gap:14px}
  .xp-medal-icon{font-size:1.75rem}
  .xp-medal-txt{font-size:.85rem}
}

/* xp-h — hero typo adapted for light section */
.equipe--slack .xp-h{font-size:clamp(40px,5.2vw,76px) !important;line-height:.95 !important;max-width:14ch;color:#0a0a0a;text-transform:uppercase}
.equipe--slack .xp-h .hero-word-outline{
  color:transparent !important;
  -webkit-text-stroke:1.5px rgba(10,10,10,.4);
  text-stroke:1.5px rgba(10,10,10,.4);
  font-style:normal !important;font-weight:600;transform:skewX(-5deg);display:inline-block;
  padding:.02em .08em .12em;margin:-.02em -.03em -.1em;
}
.equipe--slack .xp-h .hero-h1-accent{
  background:linear-gradient(135deg,#28ae60,#a5ffbf);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent !important;
  font-style:normal !important;
}

/* ===================== FLOW STANDALONE · MONOLITHIC EDITORIAL ===================== */
.flow-mono{background:transparent;padding:0 clamp(24px,5vw,80px) clamp(40px,6vw,80px);position:relative;z-index:3;margin-top:0}
.flow-mono__wrap{max-width:1280px;margin:0 auto;display:flex;flex-direction:column;gap:clamp(32px,4vw,56px)}
.flow-mono__steps{position:relative;margin-top:-40px}
.flow-mono__line{position:absolute;top:40px;left:8%;right:8%;height:2px;border-top:2px dashed rgba(10,10,10,.22);z-index:0}
.flow-mono__grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.flow-mono__step{display:flex;flex-direction:column;align-items:center;gap:32px}
.flow-mono__dot{width:80px;height:80px;border-radius:50%;background:transparent;border:2px solid #0a0a0a;display:flex;align-items:center;justify-content:center;font-family:'Satoshi','Satoshi Variable',system-ui,sans-serif;font-weight:800;font-size:20px;color:#0a0a0a;letter-spacing:-.02em}
.flow-mono__dot--solid{background:#0a0a0a;color:#f3f3f0;border-color:#0a0a0a;box-shadow:0 24px 48px -16px rgba(10,10,10,.32)}
.flow-mono__label{font-family:'Satoshi','Satoshi Variable',system-ui,sans-serif;font-weight:900;font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:#0a0a0a;text-align:center;margin:0;line-height:1.25}
.flow-mono__tagline{font-family:'Satoshi','Satoshi Variable',system-ui,sans-serif;font-weight:900;font-size:clamp(20px,2.4vw,34px);line-height:1.15;letter-spacing:-.02em;text-transform:uppercase;color:#28ae60;max-width:760px;margin:0}
@media (max-width:720px){
  .flow-mono__grid{grid-template-columns:repeat(3,1fr);gap:8px}
  .flow-mono__step{gap:16px}
  .flow-mono__dot{width:72px;height:72px;font-size:18px}
  .flow-mono__label{font-size:10px;letter-spacing:.18em}
  .flow-mono__steps{margin-top:-36px}
  .flow-mono__line{top:36px}
  .flow-mono__tagline{font-size:clamp(18px,5vw,24px)}
}

/* =====================================================================
   MOBILE OPTIM v3 · phone form compact, side cards inside viewport,
   stats 2-up, sections tightened. Appended LAST so it wins.
   ===================================================================== */
@media (max-width:780px){
  /* HERO PHONE — compact + contained */
  .hero-option6 .hero-phone-visual.phone-form-mock,
  .hero-option6 .hero-studio-visual.hero-phone-visual{
    width:100% !important;
    min-width:0 !important;
    min-height:560px !important;
    margin:8px auto 0 !important;
    overflow:visible !important;
    place-items:center !important;
  }
  .phone-form-mock{min-height:500px !important}
  .hero-option6 .hero-phone-visual .phone-shell{
    width:min(314px,81vw) !important;
    padding:10px !important;
    border-radius:38px !important;
    transform:rotate(1.2deg) translateY(0) !important;
  }
  .hero-option6 .hero-phone-visual .phone-screen{
    min-height:482px !important;
    border-radius:30px !important;
    padding:14px 14px 12px !important;
  }
  .phone-call-profile img{width:60px !important;height:60px !important}
  .phone-call-profile b{font-size:15px !important}
  .phone-call-profile small{font-size:9.5px !important}
  .phone-call-profile em{font-size:12px !important;line-height:1.35 !important;margin-top:8px !important}
  .phone-options span,
  .phone-form-fields span{padding:9px 12px !important;font-size:12px !important}
  .phone-step-label{font-size:10px !important}
  .phone-nav-controls{margin-top:8px !important}
  .phone-notch{top:14px !important;width:74px !important;height:18px !important}

  /* SIDE BUBBLES — anchored to visible edges */
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-a{
    left:4px !important;right:auto !important;
    top:118px !important;bottom:auto !important;
    padding:8px 11px !important;font-size:11px !important;
    transform:rotate(-6deg) !important;
    z-index:6 !important;opacity:1 !important;
    background:rgba(35,35,34,.94) !important;color:#fff !important;
    border-color:rgba(255,255,255,.18) !important;
  }
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-b{
    right:4px !important;left:auto !important;
    bottom:60px !important;top:auto !important;
    max-width:150px !important;
    padding:9px 12px !important;font-size:10.5px !important;line-height:1.3 !important;
    transform:rotate(5deg) !important;
    z-index:6 !important;opacity:1 !important;
    background:#fafaf8 !important;color:#0a0a0a !important;
  }
  .hero-option6 .hero-phone-visual .phone-brand-card.card-c{
    right:6px !important;left:auto !important;
    top:34px !important;
    padding:8px 12px !important;
    z-index:6 !important;opacity:1 !important;
    background:rgba(22,34,28,.88) !important;color:#fff !important;
    border-color:rgba(255,255,255,.18) !important;
  }
  .hero-option6 .hero-phone-visual .phone-brand-card.card-c b{font-size:17px !important}
  .hero-option6 .hero-phone-visual .phone-brand-card.card-c span{font-size:9px !important}

  /* Lined / green halo behind phone — visible on mobile */
  .hero-option6 .hero-phone-visual.phone-form-mock::before{
    width:86% !important;height:78% !important;
    right:7% !important;top:8% !important;
    border-radius:46px !important;
    opacity:1 !important;
  }
  .hero-option6 .hero-phone-visual.phone-form-mock::after{
    width:60vw !important;height:60vw !important;
    right:auto !important;left:50% !important;
    bottom:auto !important;top:55% !important;
    transform:translate(-50%,-50%) !important;
    opacity:1 !important;
  }

  /* PROOF STATS — 100M$+ & 3 500+ side by side */
  .hero-studio-proof{
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
    margin-top:20px !important;
    max-width:100% !important;
  }
  .hero-studio-proof > div{
    min-height:76px !important;
    padding:12px 12px !important;
    border-radius:18px !important;
  }
  .hero-studio-proof b{font-size:clamp(20px,5.6vw,28px) !important;line-height:.95 !important}
  .hero-studio-proof span{font-size:10px !important;margin-top:6px !important;letter-spacing:.07em !important;line-height:1.2 !important}

  /* HERO TRIO — portrait/video card must have height to render */
  .htrio-portrait{min-height:320px !important;overflow:hidden !important}
  .htrio-portrait .htrio-video{display:block !important}
  .htrio-testi{min-height:0 !important;padding:20px !important}
  .htrio-cal{padding:18px !important}

  /* SECTION PADDING TIGHTEN */
  .results-marquee-section{padding:24px 0 28px !important}
  .promesse-section{padding:32px 0 !important}
  .promesse-section .promise-band{padding:28px 22px !important;gap:20px !important}
  .guarantee{padding:44px 0 28px !important}
  .guarantee-card{padding:26px !important;gap:18px !important;border-radius:26px !important}
  .guarantee-seal{width:128px !important;height:128px !important;margin:0 auto !important}
  .equipe{padding:44px 0 !important}
  .faq{padding:44px 0 !important}
  .applycta{padding:44px 0 !important}
  .applycta-band{padding:30px 22px !important;gap:22px !important;border-radius:26px !important}
  .formule{padding:36px 0 12px !important}
  .hero-cards-band{padding:14px 0 28px !important}
  .stat-wrap{padding:18px 0 !important}
  .brandsection{padding:40px 0 !important}
  .ticker-wrap.hero-ticker{margin:6px 14px 22px !important;padding:0 !important;max-width:none !important}
  .tdb-ticker{padding:14px 0 !important;border-radius:22px !important}
  .tdb-ticker-item{font-size:14px !important}
  .tdb-ticker-track{gap:28px !important}
}

@media (max-width:560px){
  .hero-option6 .hero-phone-visual .phone-shell{width:min(258px,68vw) !important}
  .hero-option6 .hero-phone-visual .phone-screen{min-height:410px !important}
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-a{top:104px !important}
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-b{bottom:50px !important;max-width:138px !important}
  .hero-studio-proof b{font-size:clamp(19px,5.4vw,24px) !important}
  .htrio-portrait{min-height:280px !important}
}

/* =====================================================================
   MOBILE OPTIM v4 · phone shorter, stat compact, 2-up result cards,
   guarantee/FAQ list 2-col, simple-cta tightened.
   ===================================================================== */
@media (max-width:780px){
  /* HERO PHONE — shorter */
  .hero-option6 .hero-phone-visual.phone-form-mock,
  .hero-option6 .hero-studio-visual.hero-phone-visual{
    min-height:482px !important;
  }
  .phone-form-mock{min-height:430px !important}
  .hero-option6 .hero-phone-visual .phone-screen{
    min-height:414px !important;
    padding:12px 12px 10px !important;
  }
  .hero-option6 .hero-phone-visual .phone-shell{
    width:min(291px,76vw) !important;
    padding:9px !important;
    border-radius:36px !important;
  }
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-a{top:96px !important}
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-b{bottom:44px !important}

  /* STAT 100M$+ — compact band */
  .stat-wrap{padding:14px 0 !important}
  .stat-big{padding:24px 22px !important;border-radius:24px !important;gap:14px !important}
  .stat-big-content{gap:10px !important}
  .num-row{flex-direction:column !important;align-items:flex-start !important;gap:10px !important}
  .stat-big .num{font-size:clamp(64px,18vw,96px) !important;line-height:.9 !important}
  .stat-big .lbl{font-size:13px !important;line-height:1.4 !important}
  .stat-big-panels{display:none !important}

  /* RESULT CARDS — 2 per row on mobile (trust-bar mini-cases) */
  body:not(.flow-option) .mini-case-row,
  .mini-case-row{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }
  .mini-case-row article{padding:16px 14px !important;min-height:108px !important}
  .mini-case-row b{font-size:clamp(22px,7vw,30px) !important}
  .mini-case-row span{font-size:10px !important}
  .mini-case-row small{font-size:11px !important}

  /* GARANTIE — compact + 2-col bullet list */
  .guarantee{padding:32px 0 24px !important}
  body:not(.flow-option) .guarantee--flat .guarantee-flat{
    padding:24px 20px !important;gap:18px !important;border-radius:22px !important;
  }
  body:not(.flow-option) .guarantee--flat .guarantee-seal{
    width:108px !important;height:108px !important;
  }
  body:not(.flow-option) .guarantee--flat .guarantee-flat{
    display:flex !important;
    flex-direction:column !important;
  }
  body:not(.flow-option) .guarantee--flat .guarantee-flat > .guarantee-seal{
    order:2 !important;
    margin:18px auto 0 !important;
    width:160px !important;
    height:160px !important;
  }
  body:not(.flow-option) .guarantee--flat .guarantee-flat > .guarantee-body{
    order:1 !important;
  }
  body:not(.flow-option) .guarantee--flat .guarantee-seal .seal-100{font-size:34px !important}
  body:not(.flow-option) .guarantee--flat .guarantee-seal .seal-lbl{font-size:9px !important}
  body:not(.flow-option) .guarantee--flat .guarantee-h{
    font-size:clamp(26px,7.4vw,34px) !important;line-height:1.02 !important;
  }
  body:not(.flow-option) .guarantee--flat .guarantee-p{font-size:13px !important;line-height:1.45 !important;margin:0 !important}
  body:not(.flow-option) .guarantee--flat .guarantee-list{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:8px 14px !important;
  }
  body:not(.flow-option) .guarantee--flat .guarantee-list li{
    font-size:12px !important;line-height:1.35 !important;
    padding:8px 0 8px 18px !important;
  }
  body:not(.flow-option) .guarantee--flat .guarantee-list li::before{
    top:10px !important;width:10px !important;height:10px !important;
  }

  /* FAQ "Ce qu'il faut savoir" — compact + 2-col list */
  .faq--light{padding:36px 0 !important}
  .faq--light .faq-a-layout{gap:28px !important}
  .faq--light .faq-light-h{font-size:clamp(22px,6.4vw,30px) !important;line-height:1.1 !important}
  .faq--light .faq-light-list{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:6px 14px !important;
  }
  .faq--light .faq-light-list li{
    padding:10px 0 !important;
    border-bottom:0 !important;
    align-items:flex-start !important;
  }
  .faq--light .faq-light-list p{font-size:12.5px !important;line-height:1.35 !important}
  .faq--light .faq-light-list .dot{margin-top:6px !important}
  .faq--light .faq-line summary{padding:14px 0 !important;font-size:14px !important}
  .faq--light .faq-line p{font-size:13px !important;padding-bottom:14px !important}

  /* SIMPLE-CTA "Prêt à remplir ton agenda" — tight */
  .simple-cta{padding:36px 0 !important;margin:14px auto !important;border-radius:24px !important;max-width:calc(100% - 24px) !important}
  .simple-cta-inner{padding:0 20px !important;gap:18px !important}
  .simple-cta-h{font-size:clamp(30px,8.8vw,42px) !important;line-height:.98 !important}
  .simple-cta-right{padding-top:16px !important;gap:14px !important}
  .simple-cta-p{font-size:13px !important;line-height:1.45 !important}
}

@media (max-width:560px){
  .hero-option6 .hero-phone-visual.phone-form-mock,
  .hero-option6 .hero-studio-visual.hero-phone-visual,
  .phone-form-mock{min-height:410px !important}
  .hero-option6 .hero-phone-visual .phone-screen{min-height:350px !important}
  .stat-big .num{font-size:clamp(58px,17vw,80px) !important}
}

/* MOBILE OPTIM v5 · homepage hero phone must be visibly shorter */
@media (max-width:560px){
  .hero-option6 .hero-phone-visual.phone-form-mock,
  .hero-option6 .hero-studio-visual.hero-phone-visual{
    min-height:482px !important;
    margin-top:0 !important;
    overflow:visible !important;
  }
  .hero-option6 .hero-phone-visual .phone-shell{
    width:min(260px,70vw) !important;
    height:auto !important;
    max-height:none !important;
    padding:8px !important;
    border-radius:32px !important;
    transform:rotate(1deg) translateY(-4px) !important;
  }
  .hero-option6 .hero-phone-visual .phone-screen{
    height:340px !important;
    min-height:340px !important;
    max-height:340px !important;
    border-radius:25px !important;
    gap:5px !important;
    padding:10px 10px 9px !important;
  }
  .hero-option6 .hero-phone-visual .phone-notch{top:14px !important;width:66px !important;height:16px !important}
  .hero-option6 .hero-phone-visual .phone-call-profile{gap:4px !important;padding-top:0 !important}
  .hero-option6 .hero-phone-visual .phone-call-profile img{width:46px !important;height:46px !important}
  .hero-option6 .hero-phone-visual .phone-call-profile b{font-size:13px !important;line-height:1 !important}
  .hero-option6 .hero-phone-visual .phone-call-profile small{font-size:8px !important;line-height:1.1 !important}
  .hero-option6 .hero-phone-visual .phone-call-profile em{font-size:10px !important;line-height:1.18 !important;margin-top:3px !important;max-width:22ch !important}
  .hero-option6 .hero-phone-visual .phone-progress{width:74px !important;margin:3px auto 4px !important;gap:5px !important}
  .hero-option6 .hero-phone-visual .phone-progress span{height:3px !important}
  .hero-option6 .hero-phone-visual .phone-options{gap:5px !important;margin-top:2px !important}
  .hero-option6 .hero-phone-visual .phone-options span{padding:7px 9px !important;font-size:10px !important;border-radius:9px !important;line-height:1.1 !important}
  .hero-option6 .hero-phone-visual .phone-step-label{font-size:8px !important;margin-top:2px !important}
  .hero-option6 .hero-phone-visual .phone-nav-controls{
    display:flex !important;
    margin:6px auto 0 !important;
    gap:14px !important;
  }
  .hero-option6 .hero-phone-visual .phone-nav-btn{
    width:44px !important;
    height:44px !important;
  }
  .hero-option6 .hero-phone-visual .phone-nav-btn .call-label{font-size:8px !important;top:calc(100% + 2px) !important}
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-a{top:96px !important;left:-12px !important;transform:rotate(-5deg) !important;z-index:8 !important}
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-b{bottom:54px !important;right:-36px !important;max-width:130px !important;transform:rotate(4deg) !important;z-index:8 !important}
  .hero-option6 .hero-phone-visual .phone-brand-card.card-c{top:54px !important;right:-22px !important;z-index:8 !important}
}

@media (max-width:780px){
  .hero-option6 .hero-studio-ghost{
    display:none !important;
  }
}

/* MOBILE OPTIM v6 · Garantie readable, no awkward breaks / dead space */
@media (max-width:780px){
  body:not(.flow-option) #garantie.guarantee{
    padding:22px 0 14px !important;
    min-height:0 !important;
  }
  body:not(.flow-option) #garantie.guarantee .wrap{
    padding-left:12px !important;
    padding-right:12px !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-card{
    display:block !important;
    padding:16px 16px 12px !important;
    min-height:0 !important;
    overflow:visible !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-seal{
    width:160px !important;
    height:160px !important;
    margin:18px auto 0 !important;
    order:2 !important;
    animation: tdb-seal-spin 24s linear infinite !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-seal svg{
    display:block !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-seal .seal-center{
    animation: tdb-seal-spin 24s linear infinite reverse !important;
    transform-origin:center !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-card{
    display:flex !important;
    flex-direction:column !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-body{
    order:1 !important;
  }
  body:not(.flow-option) #garantie.guarantee .seal-100{
    font-size:32px !important;
  }
  body:not(.flow-option) #garantie.guarantee .seal-lbl{
    font-size:7.5px !important;
    max-width:72px !important;
    letter-spacing:.08em !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-body{
    gap:10px !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-h{
    font-size:clamp(25px,7.3vw,32px) !important;
    line-height:1.04 !important;
    max-width:none !important;
    text-wrap:pretty !important;
    letter-spacing:-.045em !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-h br{
    display:none !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-h :where(em,.hl-out,.hl-grad){
    display:inline !important;
    padding:0 !important;
    margin:0 !important;
    line-height:inherit !important;
    white-space:normal !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-h .hl-grad{
    white-space:nowrap !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-p{
    font-size:13px !important;
    line-height:1.35 !important;
    max-width:30ch !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-list{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
    margin-top:2px !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-list li{
    min-height:0 !important;
    padding:8px 10px 8px 34px !important;
    border:1px solid rgba(10,10,10,.08) !important;
    border-radius:14px !important;
    background:rgba(255,255,255,.58) !important;
    font-size:12.5px !important;
    line-height:1.28 !important;
  }
  body:not(.flow-option) #garantie.guarantee .guarantee-list li::before{
    left:10px !important;
    top:8px !important;
    width:16px !important;
    height:16px !important;
    background-size:11px !important;
  }
  body:not(.flow-option) #garantie.guarantee.guarantee--flat{
    width:calc(100% - 16px) !important;
    padding:14px 0 8px !important;
    margin-bottom:10px !important;
  }
  body:not(.flow-option) #garantie.guarantee--flat .guarantee-flat{
    width:100% !important;
    max-width:none !important;
    display:flex !important;
    flex-direction:column !important;
    padding:14px 14px 10px !important;
    box-sizing:border-box !important;
  }
  body:not(.flow-option) #garantie.guarantee--flat .guarantee-body{
    gap:9px !important;
  }
  body:not(.flow-option) #garantie.guarantee--flat .guarantee-line{
    display:block !important;
    white-space:normal !important;
  }
  body:not(.flow-option) #garantie.guarantee--flat .guarantee-h{
    font-size:clamp(25px,7vw,30px) !important;
    line-height:1.02 !important;
    max-width:100% !important;
    overflow:visible !important;
  }
  body:not(.flow-option) #garantie.guarantee--flat .guarantee-h :where(em,.hl-out,.hl-grad){
    display:inline !important;
    padding:0 !important;
    margin:0 !important;
    line-height:inherit !important;
  }
  body:not(.flow-option) #garantie.guarantee--flat .guarantee-p{
    max-width:100% !important;
    font-size:12.5px !important;
    line-height:1.35 !important;
  }
  body:not(.flow-option) #garantie.guarantee--flat .guarantee-list{
    grid-template-columns:1fr !important;
    gap:7px !important;
    margin:0 !important;
  }
  body:not(.flow-option) #garantie.guarantee--flat .guarantee-list li{
    padding:9px 10px 9px 36px !important;
    font-size:12.5px !important;
    line-height:1.25 !important;
  }
  body:not(.flow-option) #garantie.guarantee--flat .guarantee-list li::after{
    left:15px !important;
    top:15px !important;
  }
}

/* =====================================================================
   MOBILE OPTIM v7 · Hero phone — bubbles fully contained inside the
   visual frame (no overflow), Google rating shown in full, brand chip
   visible top-right, and "Quel chiffre…" no longer overlaps the avatar.
   ===================================================================== */
@media (max-width:780px){
  /* The wrapper becomes the positioning frame so absolute children stay
     inside the visible viewport edges. */
  .hero-option6 .hero-phone-visual.phone-form-mock{
    position:relative !important;
    overflow:visible !important;
    padding-top:18px !important;
  }

  /* Slightly narrower phone leaves room for side bubbles */
  .hero-option6 .hero-phone-visual .phone-shell{
    width:min(273px,72vw) !important;
  }

  /* Give the question more breathing room from the avatar */
  .hero-option6 .hero-phone-visual .phone-call-profile{
    gap:2px !important;
  }
  .hero-option6 .hero-phone-visual .phone-call-profile img{
    width:54px !important;height:54px !important;
  }
  .hero-option6 .hero-phone-visual .phone-call-profile em{
    margin-top:10px !important;
    font-size:11.5px !important;
    line-height:1.3 !important;
    padding:0 4px !important;
  }

  /* TOP-RIGHT — "Formulaire TDB · 3 étapes" inside frame */
  .hero-option6 .hero-phone-visual .phone-brand-card.card-c{
    position:absolute !important;
    top:6px !important;
    right:6px !important;
    left:auto !important;
    padding:6px 10px !important;
    border-radius:12px !important;
    transform:rotate(3deg) !important;
    z-index:7 !important;opacity:1 !important;
    background:rgba(22,34,28,.92) !important;color:#fff !important;
    border:1px solid rgba(255,255,255,.18) !important;
    max-width:46% !important;
  }
  .hero-option6 .hero-phone-visual .phone-brand-card.card-c span{
    font-size:8.5px !important;letter-spacing:.08em !important;
  }
  .hero-option6 .hero-phone-visual .phone-brand-card.card-c b{
    font-size:14px !important;
  }

  /* LEFT — Google 5 ★ fully visible */
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-a,
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-a.phone-google-rating{
    position:absolute !important;
    left:4px !important;right:auto !important;
    top:18% !important;bottom:auto !important;
    padding:7px 10px !important;
    border-radius:14px !important;
    transform:rotate(-6deg) !important;
    z-index:7 !important;opacity:1 !important;
    background:rgba(42,42,40,.94) !important;color:#fff !important;
    border:1px solid rgba(255,255,255,.2) !important;
    display:inline-flex !important;align-items:center !important;gap:5px !important;
    font-size:12px !important;
    max-width:none !important;width:auto !important;
    white-space:nowrap !important;
  }
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-a i,
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-a b,
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-a span{
    font-size:12px !important;line-height:1 !important;color:#fff !important;
  }

  /* RIGHT-BOTTOM bubble fully visible */
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-b{
    position:absolute !important;
    right:4px !important;left:auto !important;
    bottom:170px !important;top:auto !important;
    max-width:132px !important;
    padding:8px 10px !important;
    font-size:10.5px !important;line-height:1.28 !important;
    border-radius:14px !important;
    transform:rotate(5deg) !important;
    z-index:7 !important;opacity:1 !important;
    background:#cef3fb !important;color:#0a0a0a !important;
  }
}

@media (max-width:560px){
  .hero-option6 .hero-phone-visual .phone-shell{width:min(255px,70vw) !important}
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-b{max-width:120px !important;bottom:290px !important}
  .hero-option6 .hero-phone-visual .phone-brand-card.card-c{max-width:42% !important}
}

/* === TABLET · Hero phone bubbles repositionnées autour du téléphone === */
@media (min-width:781px) and (max-width:1024px){
  /* Pill d'eyebrow ne doit pas s'étendre sur toute la largeur */
  .hero-option6 .hero-studio-copy > .pill-hero{
    display:inline-flex !important;
    width:auto !important;
    align-self:flex-start !important;
    max-width:max-content !important;
  }
  .hero-option6 .hero-phone-visual.phone-form-mock{
    position:relative !important;
    overflow:visible !important;
  }
  /* TOP-RIGHT · Formulaire TDB 3 étapes */
  .hero-option6 .hero-phone-visual .phone-brand-card.card-c{
    position:absolute !important;
    top:20px !important;
    right:8% !important;
    left:auto !important;
    transform:rotate(4deg) !important;
    z-index:7 !important;
  }
  /* MIDDLE-LEFT · Google 5 ★ */
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-a,
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-a.phone-google-rating{
    position:absolute !important;
    left:8% !important;right:auto !important;
    top:46% !important;bottom:auto !important;
    transform:rotate(-6deg) !important;
    z-index:7 !important;
  }
  /* BOTTOM-RIGHT · 14 jours */
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-b{
    position:absolute !important;
    right:6% !important;left:auto !important;
    bottom:14% !important;top:auto !important;
    max-width:180px !important;
    transform:rotate(5deg) !important;
    z-index:7 !important;
  }
}

/* v7.1 · override the <=560 hide rules from MOBILE QA block so the hero
   phone bubbles stay visible on phones, and remove the question overlap. */
@media (max-width:560px){
  /* Re-show + reposition for hero phone specifically */
  .hero-option6 .hero-phone-visual .phone-shadow-card,
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-a,
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-b{
    display:inline-flex !important;
  }
  .hero-option6 .hero-phone-visual .phone-brand-card.card-c{
    display:inline-flex !important;
    right:6px !important;
    transform:rotate(3deg) !important;
    transform-origin:center !important;
  }
  .hero-option6 .hero-phone-visual .phone-call-profile{
    margin-bottom:4px !important;
  }
  /* Make sure phone screen has enough vertical room without the em */
  .hero-option6 .hero-phone-visual .phone-screen{
    padding:14px 12px 12px !important;
    min-height:426px !important;
  }
}

/* v7.2 · mobile only — allonger le téléphone de 15% (hauteur) */
@media (max-width:560px){
  .hero-option6 .hero-phone-visual .phone-screen{
    min-height:490px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-start !important;
    padding-bottom:26px !important;
  }
  .hero-option6 .hero-phone-visual .phone-screen > *{
    margin-top:0 !important;
    margin-bottom:0 !important;
  }
  .hero-option6 .hero-phone-visual .phone-progress{
    margin:14px auto !important;
    grid-template-columns:repeat(3, 56px) !important;
    justify-content:center !important;
    width:max-content !important;
  }
  .hero-option6 .hero-phone-visual .phone-body{
    margin-top:6px !important;
  }
  .hero-option6 .hero-phone-visual .phone-step-label{
    margin-top:10px !important;
  }
  .hero-option6 .hero-phone-visual .phone-nav-controls{
    margin-top:auto !important;
  }
  .hero-option6 .hero-studio-visual.hero-phone-visual,
  .hero-option6 .hero-phone-visual.phone-form-mock{
    min-height:554px !important;
  }
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-b{
    bottom:264px !important;
  }
}

/* MOBILE WIDTH MATCH · FAQ "Ce qu'il faut savoir" + Simple-CTA
   must match the 100M section width on mobile (calc(100vw - 40px)).
   Garantie is intentionally excluded. */
@media (max-width:780px){
  body:not(.flow-option) #tdb-lp > section#garantie.guarantee.guarantee--flat,
  body:not(.flow-option) #tdb-lp > section.faq--light,
  body:not(.flow-option) #tdb-lp > section.simple-cta,
  body:not(.flow-option) #tdb-lp > section.applycta{
    width:calc(100vw - 40px) !important;
    max-width:calc(100vw - 40px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
  }
  body:not(.flow-option) #tdb-lp > section#garantie.guarantee.guarantee--flat > .wrap,
  body:not(.flow-option) #tdb-lp > section.faq--light > .wrap,
  body:not(.flow-option) #tdb-lp > section.simple-cta > .wrap,
  body:not(.flow-option) #tdb-lp > section.applycta > .wrap{
    padding-left:0 !important;
    padding-right:0 !important;
    max-width:none !important;
    width:100% !important;
  }
  body:not(.flow-option) #tdb-lp > section#garantie.guarantee.guarantee--flat .guarantee-flat{
    width:100% !important;
    max-width:100% !important;
  }
}

/* === /formule · mobile: widen cards + 2-col checklist === */
@media (max-width:780px){
  body:not(.flow-option) #tdb-lp > section.formule > .wrap{
    padding-left:0 !important;
    padding-right:0 !important;
  }
  body:not(.flow-option) #tdb-lp > section.formule .formule-card,
  body:not(.flow-option) #tdb-lp > section.formule .formule-card.reverse{
    grid-template-columns:1fr !important;
    padding:18px !important;
    border-radius:24px;
    gap:12px !important;
    overflow:hidden;
  }
  body:not(.flow-option) #tdb-lp > section.formule .formule-card > *,
  body:not(.flow-option) #tdb-lp > section.formule .formule-card.reverse > *{
    min-width:0;
    max-width:100%;
    grid-column:1 / -1 !important;
  }
  body:not(.flow-option) #tdb-lp > section.formule .formule-num{
    font-size:56px !important;
    line-height:.9;
    margin:0;
  }
  body:not(.flow-option) #tdb-lp > section.formule .formule-text{
    padding-top:0;
    min-width:0;
  }
  body:not(.flow-option) #tdb-lp > section.formule .formule-text .pill-section{
    white-space:normal;
    max-width:100%;
    font-size:10.5px;
    letter-spacing:.06em;
    padding:6px 12px;
    line-height:1.25;
    text-align:left;
  }
  body:not(.flow-option) #tdb-lp > section.formule .formule-text h3{
    font-size:22px;
    word-wrap:break-word;
  }
  body:not(.flow-option) #tdb-lp > section.formule .formule-list{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:8px 12px;
  }
  body:not(.flow-option) #tdb-lp > section.formule .formule-list li{
    font-size:13px;
    padding-left:24px;
    line-height:1.4;
    min-width:0;
    word-wrap:break-word;
    overflow-wrap:break-word;
    hyphens:auto;
  }
  body:not(.flow-option) #tdb-lp > section.formule .formule-list li::before{
    width:16px;height:16px;background-size:10px 10px;top:5px;
  }
}

/* === /formule · #promesse TV mobile cleanup === */
@media (max-width:780px){
  body:not(.flow-option) #promesse.promesse-section .tv-case{
    padding:26px 18px 26px !important;
    min-height:0 !important;
  }
  body:not(.flow-option) #promesse.promesse-section .tv-case::before,
  body:not(.flow-option) #promesse.promesse-section .tv-noise{
    inset:14px !important;
  }
  body:not(.flow-option) #promesse.promesse-section .tv-case::after{
    display:none !important;
  }
  body:not(.flow-option) #promesse.promesse-section .tv-countdown .flap{
    min-width:64px !important;
    height:66px !important;
    font-size:36px !important;
    overflow:hidden !important;
  }
  body:not(.flow-option) #promesse.promesse-section .tv-countdown .promise-counter{
    gap:8px !important;
    margin-top:14px !important;
    padding-right:0 !important;
  }
}

/* ======== Résultats — mobile cleanup (largeurs unifiées + overflow) ======== */
@media (max-width:780px){
  /* Aligner toutes les sections sur la largeur visible de « Prêt à remplir ton agenda » */
  #tdb-lp:has(.results-hero-o3) > section:not(.simple-cta) > .wrap{
    padding-left:32px !important;
    padding-right:32px !important;
  }

  /* Hero — éviter le débordement de « POUR NOS CLIENTS » et du « 100M$+ » */
  .results-hero-o3 h1{
    font-size:clamp(28px,7.4vw,40px) !important;
    word-break:normal;
    overflow-wrap:break-word;
  }
  .results-hero-o3 h1 .num{
    font-size:clamp(56px,15vw,84px) !important;
  }
  .results-hero-o3 .lead{padding-left:0 !important}
  .results-hero-o3 .pill-hero{margin-left:0 !important}

  /* Scoreboard — « Construction » dépassait de la cellule */
  .scoreboard-panel{padding:18px 14px 14px !important}
  .sb-grid{gap:8px !important}
  .sb-cell{padding:12px 10px !important;min-height:96px !important;overflow:hidden}
  .sb-cell .sb-num{font-size:21px !important;letter-spacing:-.04em}
  .sb-cell .sb-num em{font-size:14px !important;padding-right:2px}
  .sb-cell .sb-num--text{font-size:14px !important;letter-spacing:-.02em;line-height:1.1;word-break:break-word}

  /* Cartes résultats — 2 par rangée sur mobile */
  .case-stack{grid-template-columns:1fr 1fr !important;gap:10px !important}
  .case-stack .case-card{padding:16px !important;min-height:0 !important;border-radius:18px}
  .case-stack .case-card .client{font-size:10px}
  .case-stack .case-card .case-row{gap:8px}
  .case-stack .case-card .case-num{font-size:clamp(30px,8vw,40px) !important;line-height:1}
  .case-stack .case-card .case-num--text{font-size:20px !important;letter-spacing:-.02em}
  .case-stack .case-card .case-head{font-size:12.5px !important;line-height:1.25}
  .case-stack .case-card .case-foot{padding-top:10px;gap:6px}
  .case-stack .case-card .case-foot .badge-pin,
  .case-stack .case-card .case-foot .case-tag{font-size:9px;padding:3px 7px}
}

/* ======== À propos — mobile cleanup (largeurs unifiées + overflow) ======== */
@media (max-width:780px){
  /* Aligner toutes les sections sur la largeur de « Prêt à remplir ton agenda » */
  #tdb-lp:has(.about-hero-o3) > section:not(.simple-cta) > .wrap,
  #tdb-lp:has(.about-hero-o3) > .about-trio-wrap > .about-trio-frame > section > .wrap{
    padding-left:20px !important;
    padding-right:20px !important;
  }

  /* Frame qui contient #equipe + slack-mock : pleine largeur mobile */
  #tdb-lp:has(.about-hero-o3) .about-trio-wrap{padding:12px 0 !important}
  #tdb-lp:has(.about-hero-o3) .about-trio-frame{
    width:calc(100vw - 20px) !important;
    max-width:calc(100vw - 20px) !important;
    border-radius:20px;
  }

  /* Hero — caption bureau : éviter le débordement */
  .about-hero-o3 .ah-media .ah-cap{padding:16px 18px;gap:10px}
  .about-hero-o3 .ah-media .ah-cap b{font-size:14px}
  .about-hero-o3 .ah-media .ah-cap span{font-size:9px;letter-spacing:.16em;margin-top:6px;word-wrap:break-word}
  .about-hero-o3 .ah-map-coords{font-size:8px;left:10px;bottom:10px}

  /* Hero — bureau + map: agrandir et donner plus d'espace à la map sur mobile */
  .about-hero-o3 .ah-media{
    aspect-ratio:auto !important;
    min-height:0 !important;
    height:auto !important;
    grid-template-rows:auto auto auto !important;
    background:transparent !important;
  }
  .about-hero-o3 .ah-media-top{aspect-ratio:4/5;background:#0a0a0a;height:auto !important;min-height:0 !important}
  .about-hero-o3 .ah-media-top .ah-carousel,
  .about-hero-o3 .ah-media-top .ah-track,
  .about-hero-o3 .ah-media-top .ah-slide,
  .about-hero-o3 .ah-media-top .ah-slide img{position:absolute !important;inset:0 !important;width:100% !important;height:100% !important;object-fit:cover !important}
  .about-hero-o3 .ah-media-map{height:320px;min-height:0}

  /* Team plaque — réduire les tailles pour rester dans la viewport */
  .team-plaque{border-radius:20px}
  .team-plaque .tp-head{padding:20px 18px;gap:12px}
  .team-plaque .tp-title{font-size:44px !important;line-height:.9}
  .team-plaque .tp-sub{font-size:10.5px;letter-spacing:.12em;line-height:1.5;max-width:100%}
  .team-plaque .tp-col{padding:20px 18px;min-height:0}
  .team-plaque .tp-h{margin-bottom:24px}
  .team-plaque .tp-list li{font-size:16px;line-height:1.3;word-wrap:break-word}
  .team-plaque .tp-coord{font-size:9px;letter-spacing:.14em;word-wrap:break-word}
  .team-plaque .tp-col--list .tp-coord{text-align:left}
  .team-plaque .tp-h--inv{position:relative;top:auto;left:auto}
  .team-plaque .tp-col--center{padding-top:20px}
  .team-plaque .tp-col--center .tp-type{margin-top:24px}
  .team-plaque .tp-type-line{font-size:22px !important;line-height:1}
  .team-plaque .tp-type-line--accent{margin-top:10px}
  .team-plaque .tp-foot{position:relative;bottom:auto;right:auto;margin-top:16px;font-size:9px;letter-spacing:.14em}
  .team-plaque .tp-col--plaque .tp-coord{position:relative;bottom:auto;right:auto;margin-top:14px;text-align:left}
  .team-plaque .tp-plate{padding:18px 16px}
  .team-plaque .tp-plate-v{font-size:14px}

  /* Slack mock — n'excède plus le cadre */
  .equipe--slack .slack-mock{border-radius:16px}
  .equipe--slack .slack-mock{grid-template-columns:108px minmax(0,1fr) !important}
  .equipe--slack .slack-sidebar{padding:14px 10px;gap:12px;min-height:100%}
  .equipe--slack .slack-workspace{font-size:13px;gap:6px}
  .equipe--slack .slack-side-label{font-size:9px;letter-spacing:.18em}
  .equipe--slack .slack-sidebar button,
  .equipe--slack .slack-process{
    font-size:9px;letter-spacing:.02em;padding:8px 8px;
    text-transform:uppercase;line-height:1.25;
    word-break:normal;overflow-wrap:normal;hyphens:none;
  }
  .equipe--slack .slack-process{width:max-content !important;max-width:none !important;min-width:0}
  .equipe--slack .slack-msgs,
  .equipe--slack .slack-tabs{margin-left:0 !important}
  .equipe--slack .slack-tabs{flex-wrap:wrap;gap:6px}
  .equipe--slack .slack-tabs button{font-size:10px;padding:5px 8px;min-height:28px}
  .equipe--slack .slack-sidebar button{
    white-space:normal;font-size:10px;padding:7px 6px;letter-spacing:-.01em;line-height:1.2;word-break:normal;overflow-wrap:break-word;
  }
  .equipe--slack .slack-sidebar button[data-slide="1"]{white-space:nowrap}
  .equipe--slack .slack-msg .slack-txt{font-size:12px;line-height:1.45}
  .equipe--slack .slack-msg .slack-user{font-size:12px}
  .equipe--slack .slack-msg .slack-time{font-size:10px}
  .equipe--slack .slack-avatar{width:28px;height:28px;font-size:10px;flex-shrink:0}
  .equipe--slack .slack-head{padding:12px 14px;gap:8px;flex-wrap:wrap}
  .equipe--slack .slack-head{padding-top:24px !important}
  .equipe--slack .slack-channel{font-size:13px}
  .equipe--slack .slack-presence{font-size:10px}
  .equipe--slack .slack-msgs{padding:12px 14px;gap:10px}
  .equipe--slack .slack-slides{min-height:240px}

  /* Section #equipe wrapper sur mobile : pas de padding latéral du wrap */
  #tdb-lp:has(.about-hero-o3) #equipe.equipe > .wrap,
  #tdb-lp:has(.about-hero-o3) #communication.equipe > .wrap{
    padding-left:16px !important;
    padding-right:16px !important;
  }
}

/* =====================================================================
   TABLET · hero phone proportions closer to desktop (no ridiculous height)
   ===================================================================== */
@media (min-width:681px) and (max-width:1366px){
  .hero-option6 .hero-phone-visual.phone-form-mock,
  .hero-option6 .hero-studio-visual.hero-phone-visual{
    min-height:660px !important;
    width:100% !important;
    margin:0 auto !important;
    place-items:center !important;
  }
  .phone-form-mock{min-height:620px !important}
  .hero-option6 .hero-phone-visual .phone-shell{
    width:min(384px,46vw) !important;
    padding:13px !important;
    border-radius:46px !important;
    transform:rotate(2deg) !important;
    position:relative !important;
    right:auto !important;
    top:auto !important;
  }
  .hero-option6 .hero-phone-visual .phone-screen{
    min-height:600px !important;
    border-radius:35px !important;
    padding:28px 20px 18px !important;
  }

  /* CTA + 2 stat cards on the same line */
  .hero-option6 .hero-studio-inner{
    display:grid !important;
    grid-template-columns:minmax(214px,.82fr) minmax(0,1fr) minmax(0,1fr) !important;
    column-gap:14px !important;
    row-gap:14px !important;
  }
  .hero-option6 .hero-studio-copy{display:contents !important}
  .hero-option6 .hero-studio-copy > .pill-hero,
  .hero-option6 .hero-studio-copy > .hero-studio-h1,
  .hero-option6 .hero-studio-visual,
  .hero-option6 .hero-studio-copy > .hero-studio-sub{
    grid-column:1 / -1 !important;
  }
  .hero-option6 .hero-studio-copy > .hero-studio-actions{
    grid-column:1 !important;
    align-self:center !important;
    margin:0 !important;
    min-width:0 !important;
  }
  .hero-option6 .hero-studio-copy > .hero-studio-actions .hero-studio-ghost{display:none !important}
  .hero-option6 .hero-studio-copy > .hero-studio-actions .hero-main-cta{
    width:100% !important;
    min-width:0 !important;
    padding-left:22px !important;
    padding-right:22px !important;
    justify-content:center !important;
    white-space:nowrap !important;
  }
  .hero-option6 .hero-studio-copy > .hero-studio-proof{
    grid-column:2 / span 2 !important;
    grid-row:5 !important;
    grid-template-columns:1fr 1fr !important;
    gap:14px !important;
    margin:0 !important;
    align-self:center !important;
    max-width:none !important;
    width:100% !important;
  }
  .hero-option6 .hero-studio-copy > .hero-studio-actions{grid-row:5 !important}
}

/* TABLET FIX · 768px included: compact pill + bubbles around phone */
@media (min-width:681px) and (max-width:1024px){
  .hero-option6 .hero-studio-copy > .pill-hero{
    display:inline-flex !important;
    width:max-content !important;
    max-width:calc(100vw - 96px) !important;
    justify-self:start !important;
    align-self:start !important;
    padding:10px 18px !important;
    white-space:nowrap !important;
  }

  .hero-option6 .hero-phone-visual .phone-brand-card.card-c{
    position:absolute !important;
    top:34% !important;
    right:-18px !important;
    left:auto !important;
    transform:rotate(4deg) !important;
    z-index:8 !important;
  }

  .hero-option6 .hero-phone-visual .phone-shadow-card.card-a{
    position:absolute !important;
    top:46% !important;
    left:24px !important;
    right:auto !important;
    transform:rotate(-6deg) !important;
    z-index:8 !important;
  }

  .hero-option6 .hero-phone-visual .phone-shadow-card.card-b{
    position:absolute !important;
    right:26px !important;
    bottom:auto !important;
    top:70% !important;
    left:auto !important;
    max-width:178px !important;
    transform:rotate(5deg) !important;
    z-index:8 !important;
  }
}

/* Make CTA form fields opaque so the section grid pattern doesn't show through */
.simple-cta .brand-cta-form input{
  background:#1a1a1a !important;
  border-color:rgba(255,255,255,.14) !important;
}
.simple-cta .brand-cta-form input:focus{
  background:#202020 !important;
  border-color:rgba(40,174,96,.55) !important;
}

/* === Fix: bsys stacks debordent à droite sur tablette/mobile === */
@media (max-width:1024px){
  .bsys-card{overflow:hidden}
  .bsys-stack .pg.p1{transform:translate(-8%,-3%) rotate(-4deg) !important}
  .bsys-stack .pg.p2{transform:translate(-3%,1%) rotate(-1.5deg) !important}
  .bsys-stack .pg.p3{transform:translate(3%,-1%) rotate(1.5deg) !important}
  .bsys-stack .pg.p4{transform:translate(8%,3%) rotate(4deg) !important}
  .bsys-stack.three .pg.p1{transform:translate(-3%,-1%) rotate(-2deg) !important}
  .bsys-stack.three .pg.p2{transform:translate(0,0) rotate(0deg) !important}
  .bsys-stack.three .pg.p3{transform:translate(3%,-1%) rotate(2deg) !important}
  .bsys-stack.layered .pg.p1{transform:translate(-2%,2%) rotate(-1deg) !important}
  .bsys-stack.layered .pg.p2{transform:translate(0,1%) rotate(0deg) !important}
  .bsys-stack.layered .pg.p3{transform:translate(2%,-1%) rotate(1deg) !important}
  .bsys-stack.layered .pg.p4{transform:translate(4%,-2%) rotate(2deg) !important}
}

@media (max-width:560px){
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-b{
    right:6px !important;
    transform:rotate(5deg) !important;
  }
  .hero-option6 .hero-phone-visual .phone-brand-card.card-c{
    top:16% !important;
    right:-10px !important;
    left:auto !important;
    bottom:auto !important;
    transform:rotate(4deg) !important;
    z-index:8 !important;
  }
}


/* v7.3 · desktop — remonter la carte "14 jours" pour qu'elle ne cache pas le bouton suivant du phone mock */
@media (min-width:1025px){
  .hero-option6 .hero-phone-visual .phone-shadow-card.card-b{
    bottom:210px !important;
  }
}

/* ============================================================
   BIEN REÇU · editorial confirmation page (brx-*)
   Sable bg, satoshi, green accent, outlined hero headline.
   ============================================================ */
.brx-shell{
  position:relative;
  min-height:100vh;
  background:#f3f3f0;
  color:#0a0a0a;
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  display:flex;align-items:center;justify-content:center;
  padding:48px 28px;
  overflow:hidden;
}
.brx-grain{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(40,174,96,.10), transparent 60%),
    radial-gradient(900px 500px at 0% 110%, rgba(10,10,10,.05), transparent 55%);
}
.brx-wrap{
  position:relative;z-index:1;
  width:min(1080px, 100%);
  display:flex;flex-direction:column;gap:48px;
  border-radius:34px;
  padding:clamp(34px,5vw,62px);
  background:#f3f3f0;
  box-shadow:0 28px 84px -54px rgba(0,0,0,.62);
  overflow:hidden;
}
.brx-wrap::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(10,10,10,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(10,10,10,.055) 1px,transparent 1px);
  background-size:175px 175px;
}
.brx-wrap > *{
  position:relative;z-index:1;
}

/* Top bar */
.brx-top{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
#tdb-lp .brx-logo img{height:126px !important;width:auto !important;display:block;opacity:.9}
.brx-status{
  display:inline-flex;align-items:center;gap:10px;
  font-size:12.5px;font-weight:600;letter-spacing:.04em;
  color:rgba(10,10,10,.6);text-transform:uppercase;
}
.brx-status time{color:#0a0a0a;font-weight:700;text-transform:none;letter-spacing:0;margin-left:2px}
.brx-status-dot{
  width:8px;height:8px;border-radius:50%;background:#28ae60;
  box-shadow:0 0 0 4px rgba(40,174,96,.18);
  animation:brxPulse 1.8s ease-in-out infinite;
}
@keyframes brxPulse{
  0%,100%{box-shadow:0 0 0 4px rgba(40,174,96,.18)}
  50%{box-shadow:0 0 0 8px rgba(40,174,96,.05)}
}

/* Hero */
.brx-hero{display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.brx-pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;border-radius:999px;
  background:#dbf3e4;color:#155f33;
  font-size:11.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
}
.brx-pill .brx-sq{width:8px;height:8px;background:#28ae60;border-radius:2px}
.brx-h{
  margin:0;
  font-family:'Satoshi','Satoshi Variable',sans-serif;
  font-weight:900;
  font-size:clamp(64px,11vw,168px);
  line-height:.86;letter-spacing:-0.045em;
  text-transform:uppercase;
}
.brx-h .brx-out{
  color:transparent;-webkit-text-stroke:1.5px rgba(10,10,10,.45);
}
.brx-h .brx-dot{color:#28ae60}
.brx-lead{
  margin:0;max-width:640px;
  font-size:clamp(18px,1.6vw,22px);line-height:1.45;
  color:rgba(10,10,10,.72);font-weight:500;
}
.brx-lead .brx-acc{
  color:#0a0a0a;font-weight:800;
  background:linear-gradient(transparent 62%, rgba(40,174,96,.22) 62%);
  padding:0 2px;
}

/* Card */
.brx-card{
  display:grid;grid-template-columns:1.4fr 1fr;gap:32px;align-items:center;
  padding:24px 28px;
  background:#fff;
  border:1px solid rgba(10,10,10,.08);
  border-radius:24px;
  box-shadow:0 1px 0 rgba(10,10,10,.02), 0 18px 40px -28px rgba(10,10,10,.18);
}
.brx-card-l{display:flex;align-items:center;gap:18px;min-width:0}
.brx-avatar{
  position:relative;flex:none;
  width:56px;height:56px;border-radius:50%;
  background:#eee;overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(10,10,10,.08);
}
.brx-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.brx-online{
  position:absolute;right:0;bottom:2px;
  width:14px;height:14px;border-radius:50%;
  background:#28ae60;border:2.5px solid #fff;
}
.brx-card-k{
  font-size:11px;font-weight:700;letter-spacing:.14em;
  color:rgba(10,10,10,.5);text-transform:uppercase;
}
.brx-card-v{font-size:16px;font-weight:700;color:#0a0a0a;margin-top:4px}
.brx-card-r{text-align:right;border-left:1px solid rgba(10,10,10,.08);padding-left:32px}
.brx-card-big{
  font-size:clamp(28px,3vw,40px);font-weight:900;letter-spacing:-0.02em;
  color:#0a0a0a;margin-top:4px;line-height:1;
}
.brx-card-big span{font-size:13px;font-weight:600;color:rgba(10,10,10,.55);letter-spacing:0;margin-left:6px;text-transform:lowercase}

/* Steps */
.brx-steps{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:rgba(10,10,10,.08);
  border:1px solid rgba(10,10,10,.08);
  border-radius:24px;overflow:hidden;
}
.brx-step{
  background:#f3f3f0;
  padding:28px 26px 30px;
  display:flex;flex-direction:column;gap:10px;
  transition:background .25s ease;
}
.brx-step:hover{background:#eeeeea}
.brx-step-no{
  font-size:12px;font-weight:800;letter-spacing:.18em;
  color:#28ae60;
}
.brx-step-h{
  font-size:18px;font-weight:800;letter-spacing:-0.01em;color:#0a0a0a;
}
.brx-step-p{
  margin:0;font-size:14px;line-height:1.5;color:rgba(10,10,10,.62);
}

/* Footer */
.brx-foot{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding-top:8px;
}
#tdb-lp a.brx-back{
  display:inline-flex;align-items:center;gap:10px;
  padding:12px 18px;border-radius:999px;
  background:#0a0a0a;color:#fff;
  font-size:14px;font-weight:700;text-decoration:none;
  transition:transform .2s ease, background .2s ease;
}
#tdb-lp a.brx-back:hover{transform:translateX(-2px);background:#1a1a1a;color:#fff}
.brx-back .brx-arr{font-size:16px;line-height:1}
.brx-mark{
  font-size:11px;font-weight:700;letter-spacing:.2em;
  color:rgba(10,10,10,.4);text-transform:uppercase;
}

/* Tablet */
@media (max-width:880px){
  .brx-card{grid-template-columns:1fr;gap:20px}
  .brx-card-r{border-left:0;border-top:1px solid rgba(10,10,10,.08);padding-left:0;padding-top:20px;text-align:left}
  .brx-steps{grid-template-columns:1fr;gap:1px}
}

/* Mobile */
@media (max-width:560px){
  .brx-shell{padding:32px 18px}
  .brx-wrap{gap:36px}
  .brx-top{flex-direction:column;align-items:flex-start;gap:14px}
  .brx-h{font-size:clamp(56px,16vw,96px)}
  .brx-foot{flex-direction:column;align-items:flex-start;gap:18px}
}
