/* =========================================================================
   ATLANTIS STRENGTH — Carrières · « En savoir plus sur nous »
   Long-form editorial page styles. Built on colors_and_type.css tokens.
   ========================================================================= */

/* ---- hero ---- */
.ab-hero{background:#000;color:#fff;padding:96px 0 0;position:relative;overflow:hidden}
.ab-hero .ab-h-inner{display:grid;grid-template-columns:1.25fr 1fr;gap:64px;align-items:end;padding-bottom:72px}
.ab-hero .hero-meta{font-family:var(--font-mono);font-size:calc(var(--atl-fs,1) * (11px));letter-spacing:0.18em;text-transform:uppercase;color:#A8A8AD;margin-bottom:18px;display:flex;align-items:center;gap:14px}
.ab-hero .hero-meta .dot{width:6px;height:6px;background:var(--atl-red);display:inline-block}
.ab-hero .ab-mark{width:64px;height:8px;background:var(--atl-red);margin-bottom:26px}
.ab-hero h1{font-family:var(--font-display);font-weight:700;text-transform:uppercase;font-size:calc(var(--atl-fs,1) * (clamp(48px,6.6vw,108px)));line-height:0.9;letter-spacing:-0.02em;margin:0}
.ab-hero h1 em{font-style:normal;color:var(--atl-red)}
.ab-hero .ab-h-paras{display:flex;flex-direction:column;gap:18px}
.ab-hero .ab-h-paras p{font-family:var(--font-sans);font-size:calc(var(--atl-fs,1) * (17px));line-height:1.55;color:#D2D2D5;margin:0;max-width:46ch}
.ab-hero .ab-h-paras p:first-child{color:#fff;font-size:calc(var(--atl-fs,1) * (19px))}
.ab-tagline{border-top:1px solid #36363B;padding:22px 0 26px;font-family:var(--font-display);font-weight:600;text-transform:uppercase;font-size:calc(var(--atl-fs,1) * (clamp(18px,2vw,28px)));letter-spacing:-0.005em;color:#fff;display:flex;align-items:center;gap:16px}
.ab-tagline::before{content:"";width:40px;height:4px;background:var(--atl-red);flex:none}

/* ---- generic section ---- */
.ab-sec{padding:104px 0;border-bottom:1px solid var(--rule-2)}
.ab-sec.alt{background:var(--bg-alt)}
.ab-sec.dark{background:#000;color:#fff;border-bottom:0}
.ab-eyebrow{font-family:var(--font-sans);font-weight:600;font-size:calc(var(--atl-fs,1) * (12px));letter-spacing:0.18em;text-transform:uppercase;color:var(--fg-3);display:inline-flex;align-items:center;gap:12px}
.ab-eyebrow::before{content:"";width:24px;height:2px;background:var(--atl-red)}
.ab-sec.dark .ab-eyebrow{color:#A8A8AD}
.ab-mark-sm{width:48px;height:8px;background:var(--atl-red);margin:20px 0 22px}
.ab-title{font-family:var(--font-display);font-weight:700;text-transform:uppercase;font-size:calc(var(--atl-fs,1) * (clamp(28px,3.3vw,48px)));line-height:1.05;letter-spacing:-0.015em;margin:0 0 26px;max-width:none}
.ab-title em{font-style:normal;color:var(--atl-red)}
.ab-body{display:flex;flex-direction:column;gap:20px;margin-top:0}
.ab-body p{font-family:var(--font-sans);font-size:calc(var(--atl-fs,1) * (16px));line-height:1.66;color:var(--fg-2);margin:0;max-width:62ch;text-wrap:pretty}
.ab-sec.dark .ab-body p{color:#D2D2D5}

/* split: text + figure */
.ab-split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.ab-split.flip .ab-figure{order:-1}
.ab-figure{position:relative;align-self:stretch;min-height:420px}
.ab-split .ab-text .ab-title{margin-bottom:26px}
/* full-width narrative (no figure) */
.ab-stack{display:grid;grid-template-columns:1fr 1.4fr;gap:64px;align-items:start}
.ab-stack .ab-title{position:sticky;top:104px}

/* pull quote */
.ab-pull{margin:48px 0 0;padding:40px 0 0;border-top:2px solid #000}
.ab-pull .q{font-family:var(--font-display);font-weight:700;text-transform:uppercase;font-size:calc(var(--atl-fs,1) * (clamp(30px,4.4vw,64px)));line-height:1.0;letter-spacing:-0.02em;color:#000;max-width:16ch}
.ab-pull .q .red{color:var(--atl-red)}

/* customization items */
.ab-custom-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid #000;border-left:1px solid var(--rule-2);margin-top:8px}
.ab-custom-grid .it{padding:28px 28px 30px;border-right:1px solid var(--rule-2);border-bottom:1px solid var(--rule-2)}
.ab-custom-grid .it .k{font-family:var(--font-display);font-weight:600;text-transform:uppercase;font-size:calc(var(--atl-fs,1) * (22px));letter-spacing:-0.005em;margin-bottom:10px}
.ab-custom-grid .it .v{font-family:var(--font-sans);font-size:calc(var(--atl-fs,1) * (14px));line-height:1.55;color:var(--fg-2)}
.ab-custom-close{margin-top:28px;font-family:var(--font-display);font-weight:600;text-transform:uppercase;font-size:calc(var(--atl-fs,1) * (clamp(20px,2.4vw,32px)));letter-spacing:-0.01em}

/* global refs */
.ab-refs{display:flex;flex-direction:column;border-top:1px solid var(--rule-2);margin-top:8px}
.ab-refs .r{display:flex;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--rule-2);font-family:var(--font-mono);font-size:calc(var(--atl-fs,1) * (13px));letter-spacing:0.04em;color:var(--fg-2)}
.ab-refs .r .n{font-family:var(--font-display);font-weight:700;font-size:calc(var(--atl-fs,1) * (18px));color:var(--atl-red);min-width:40px}

/* stats band */
.ab-statband{background:#000;color:#fff;padding:0}
.ab-statgrid{display:grid;grid-template-columns:repeat(5,1fr)}
.ab-statgrid .cell{padding:56px 24px;border-right:1px solid #36363B;display:flex;flex-direction:column;gap:16px}
.ab-statgrid .cell:last-child{border-right:0}
.ab-statgrid .cell b{font-family:var(--font-display);font-weight:700;font-size:calc(var(--atl-fs,1) * (clamp(44px,4.6vw,72px)));line-height:0.86;letter-spacing:-0.02em}
.ab-statgrid .cell.accent b{color:var(--atl-red)}
.ab-statgrid .cell span{font-family:var(--font-sans);font-size:calc(var(--atl-fs,1) * (13px));line-height:1.5;color:#A8A8AD}

/* closing */
.ab-closing{padding:112px 0}
.ab-closing .ab-c-inner{max-width:24ch}
.ab-closing h2{font-family:var(--font-display);font-weight:700;text-transform:uppercase;font-size:calc(var(--atl-fs,1) * (clamp(34px,4.4vw,64px)));line-height:0.98;letter-spacing:-0.02em;margin:0}
.ab-closing .ab-c-body{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-top:40px;padding-top:32px;border-top:1px solid var(--rule-2);align-items:start}
.ab-closing .ab-c-body p{font-family:var(--font-sans);font-size:calc(var(--atl-fs,1) * (16px));line-height:1.6;color:var(--fg-2);margin:0;max-width:46ch}
.ab-closing .ab-addr{font-family:var(--font-mono);font-size:calc(var(--atl-fs,1) * (12px));letter-spacing:0.06em;color:var(--fg-3);line-height:1.7}
.ab-closing .ab-cta{margin-top:36px;display:flex;gap:14px;flex-wrap:wrap}

@media (max-width:1080px){
  .ab-hero .ab-h-inner,.ab-split,.ab-stack,.ab-closing .ab-c-body{grid-template-columns:1fr;gap:40px}
  .ab-stack .ab-title{position:static}
  .ab-split.flip .ab-figure{order:0}
  .ab-figure{min-height:300px}
  .ab-statgrid{grid-template-columns:repeat(2,1fr)}
  .ab-statgrid .cell:nth-child(2){border-right:0}
}
@media (max-width:560px){
  .ab-custom-grid,.ab-statgrid{grid-template-columns:1fr}
  .ab-statgrid .cell{border-right:0}
  .ab-sec{padding:72px 0}
}

/* ── Images de fond des zones sombres (accueil + À propos) ──
   Calque plein cadre derrière le contenu, opacité réglable, parallaxe (JS).
   Le contenu passe au-dessus (z-index). Mobile : parallaxe désactivée (statique).
   Générique : marche pour .ab-hero/.ab-sec/.ab-statband ET .hero/.band de l'accueil. */
.has-bg{position:relative;overflow:hidden}
.has-bg>.container{position:relative;z-index:2}
.ab-secbg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.ab-secbg-img{position:absolute;left:0;right:0;top:-16%;height:132%;background-size:cover;background-position:center;will-change:transform}

/* Révélation douce (fade-up) — réservée à la page À propos. */
.ab-up{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.ab-up.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.ab-up{opacity:1;transform:none;transition:none}}