/* ==========================================================================
   Système visuel "mini agence" — accueil + catalogue (refonte 2026-09).
   Inspiration : mise en page éditoriale déstructurée (libellés ● à gauche,
   titres serrés, blocs asymétriques, sections sombres "plan technique",
   boutons ronds ↗). CSS autonome : aucune classe Tailwind à recompiler.
   Chargée APRÈS site.css, uniquement sur les pages qui ont body.ag.
   ========================================================================== */

:root {
  --ag-paper: #F6F6F3;
  --ag-paper-2: #ECECE7;
  --ag-ink: #141617;
  --ag-ink-soft: rgba(20, 22, 23, .62);
  --ag-line: rgba(20, 22, 23, .12);
  --ag-night: #1D2122;
  --ag-night-2: #111415;
  --ag-on-night: #F3F3EF;
  --ag-on-night-soft: rgba(243, 243, 239, .58);
  --ag-line-night: rgba(243, 243, 239, .14);
  --ag-accent: #0F6B62;
  --ag-accent-deep: #1F4F53;
  --ag-gutter: clamp(16px, 3vw, 28px);
  --ag-max: 1440px;
}

html, body.ag { background-color: var(--ag-paper); }
body.ag { color: var(--ag-ink); font-family: 'Manrope', system-ui, sans-serif; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
body.ag ::selection { background: var(--ag-accent); color: #fff; }

.ag-wrap { max-width: var(--ag-max); margin: 0 auto; padding-left: var(--ag-gutter); padding-right: var(--ag-gutter); }
.ag-section { padding-top: clamp(72px, 10vw, 140px); padding-bottom: clamp(72px, 10vw, 140px); position: relative; }
.ag-dark { background: var(--ag-night); color: var(--ag-on-night); }
.ag-darker { background: var(--ag-night-2); color: var(--ag-on-night); }

/* Libellé de section "● LIBELLÉ" */
.ag-label { display: inline-flex; align-items: center; gap: 14px; font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-accent-deep); margin: 0 0 28px; }
.ag-label::before { content: ''; width: 9px; height: 9px; border-radius: 50%; background: currentColor; flex-shrink: 0; }
.ag-dark .ag-label, .ag-darker .ag-label, .ag-on-image .ag-label { color: var(--ag-on-night); }

/* Titres serrés */
.ag-h1 { font-weight: 700; letter-spacing: -.045em; line-height: .98; font-size: clamp(44px, 8.4vw, 124px); margin: 0; }
.ag-h2 { font-weight: 700; letter-spacing: -.04em; line-height: 1.04; font-size: clamp(32px, 4.6vw, 64px); margin: 0; }
.ag-h3 { font-weight: 700; letter-spacing: -.03em; line-height: 1.1; font-size: clamp(22px, 2.2vw, 30px); margin: 0; }
.ag-muted { color: var(--ag-ink-soft); }
.ag-dark .ag-muted, .ag-darker .ag-muted { color: var(--ag-on-night-soft); }
.ag-lead { font-size: clamp(17px, 1.35vw, 20px); line-height: 1.6; }
.ag-small { font-size: 14px; line-height: 1.6; }
.ag-grey-tail { color: rgba(243, 243, 239, .42); }
.ag-grey-tail-light { color: rgba(20, 22, 23, .34); }

/* Bouton rond ↗ + lien texte */
.ag-arrow { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--ag-accent-deep); color: #fff; flex-shrink: 0; transition: transform .25s ease, background-color .25s ease; }
.ag-arrow svg { width: 14px; height: 14px; }
.ag-dark .ag-arrow, .ag-darker .ag-arrow, .ag-on-image .ag-arrow, .ag-arrow--light { background: #fff; color: var(--ag-ink); }
.ag-link { display: inline-flex; align-items: center; gap: 16px; font-weight: 600; font-size: 15px; color: inherit; text-decoration: none; padding: 6px 0; }
.ag-link:hover .ag-arrow, .ag-link:focus-visible .ag-arrow, a:hover > .ag-arrow { transform: rotate(45deg); }
.ag-link:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; border-radius: 4px; }

.ag-btn { display: inline-flex; align-items: center; gap: 14px; padding: 14px 16px 14px 22px; border-radius: 999px; font-weight: 600; font-size: 15px; text-decoration: none; background: var(--ag-ink); color: #fff; transition: background-color .2s ease; }
.ag-btn .ag-arrow { width: 30px; height: 30px; background: #fff; color: var(--ag-ink); }
.ag-btn:hover { background: var(--ag-accent-deep); }
.ag-btn--light { background: #fff; color: var(--ag-ink); }
.ag-btn--light .ag-arrow { background: var(--ag-ink); color: #fff; }
.ag-btn--light:hover { background: var(--ag-paper-2); }
.ag-btn:focus-visible { outline: 2px solid var(--ag-accent); outline-offset: 3px; }

.ag-rule { border: 0; border-top: 1px solid var(--ag-line); margin: 0; }
.ag-dark .ag-rule, .ag-darker .ag-rule { border-top-color: var(--ag-line-night); }

/* --------------------------------------------------------------------------
   HERO
-------------------------------------------------------------------------- */
.ag-hero { position: relative; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; background: var(--ag-night-2); color: #fff; }
.ag-hero__top { background: var(--ag-night-2); padding-top: 128px; padding-bottom: clamp(40px, 6vw, 72px); }
.ag-hero__image { position: relative; flex: 1 1 auto; min-height: 44vh; overflow: hidden; }
.ag-hero__image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 35%; filter: saturate(.75) contrast(1.05); transform: scale(1.04); }
.ag-hero__image::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(17,20,21,.55) 0%, rgba(17,20,21,.15) 45%, rgba(17,20,21,.55) 100%); }
.ag-hero__grid { display: grid; gap: 28px; grid-template-columns: 1fr; align-items: end; }
@media (min-width: 900px) { .ag-hero__grid { grid-template-columns: 1fr 340px; } }
.ag-hero__side { margin: 0; max-width: 360px; font-size: 16px; line-height: 1.65; color: rgba(255,255,255,.78); }
@media (min-width: 900px) { .ag-hero__side { text-align: right; justify-self: end; padding-bottom: 10px; } }

/* Header et footer partagés (Tailwind max-w-6xl) alignés sur la grille large de ces pages */
body.ag #site-header .max-w-6xl, body.ag footer .max-w-6xl { max-width: var(--ag-max); padding-left: var(--ag-gutter); padding-right: var(--ag-gutter); }
.ag-hero__h1 span { display: block; }
.ag-hero__h1 .ag-grey-tail { color: rgba(255,255,255,.34); }

/* Carte CTA flottante à cheval sur le bas du hero */
.ag-float-card { position: relative; z-index: 5; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; width: min(440px, calc(100% - 2 * var(--ag-gutter))); margin: -96px 0 0 clamp(16px, 10vw, 150px); padding: 28px 28px 30px; background: var(--ag-accent-deep); color: #fff; text-decoration: none; box-shadow: 0 30px 60px -30px rgba(0,0,0,.55); transition: background-color .25s ease; }
.ag-float-card:hover { background: #245c61; }
.ag-float-card strong { display: block; font-size: 24px; letter-spacing: -.03em; line-height: 1.15; margin-bottom: 12px; }
.ag-float-card span.ag-small { color: rgba(255,255,255,.82); display: block; max-width: 300px; }
.ag-float-card:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

/* --------------------------------------------------------------------------
   BANDEAU DÉFILANT
-------------------------------------------------------------------------- */
.ag-marquee { overflow: hidden; padding: 56px 0 8px; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.ag-marquee__track { display: flex; gap: 14px; width: max-content; animation: ag-marquee 48s linear infinite; }
.ag-marquee__item { display: inline-flex; align-items: center; height: 64px; padding: 0 26px; background: #fff; border: 1px solid var(--ag-line); font-weight: 700; font-size: 17px; letter-spacing: -.02em; color: rgba(20,22,23,.78); white-space: nowrap; }
.ag-marquee:hover .ag-marquee__track { animation-play-state: paused; }
@keyframes ag-marquee { to { transform: translateX(-50%); } }
.ag-marquee-caption { text-align: center; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-ink-soft); margin-top: 18px; }

/* --------------------------------------------------------------------------
   À PROPOS — split asymétrique
-------------------------------------------------------------------------- */
.ag-split-head { display: grid; gap: 28px; grid-template-columns: 1fr; align-items: start; }
@media (min-width: 900px) { .ag-split-head { grid-template-columns: 1.4fr 1fr; } .ag-split-head__right { text-align: right; } }
.ag-about-grid { display: grid; gap: 40px; grid-template-columns: 1fr; margin-top: 44px; position: relative; }
@media (min-width: 900px) { .ag-about-grid { grid-template-columns: 1fr 1.05fr 1fr; gap: 48px; } }
.ag-portrait img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 20%; display: block; background: #fff; }
.ag-portrait h3 { margin-top: 20px; }
.ag-portrait ul { list-style: none; padding: 0; margin: 10px 0 0; font-size: 14px; line-height: 1.75; color: var(--ag-ink-soft); }
.ag-about-text p { font-size: 17px; line-height: 1.85; margin: 0 0 28px; }
.ag-about-img { position: relative; }
@media (min-width: 900px) { .ag-about-img { margin-top: 160px; } }
.ag-about-img img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; display: block; position: relative; z-index: 1; }
.ag-circle-deco { position: absolute; width: 760px; height: 760px; border-radius: 50%; border: 1px solid var(--ag-line); left: 45%; top: 260px; pointer-events: none; z-index: 0; display: none; }
@media (min-width: 900px) { .ag-circle-deco { display: block; } }

/* --------------------------------------------------------------------------
   FOND "PLAN TECHNIQUE" (sections sombres)
-------------------------------------------------------------------------- */
.ag-blueprint { position: relative; overflow: hidden; }
.ag-blueprint::before { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .55;
  background-image:
    linear-gradient(rgba(243,243,239,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(243,243,239,.045) 1px, transparent 1px),
    linear-gradient(rgba(243,243,239,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(243,243,239,.07) 1px, transparent 1px);
  background-size: 24px 24px, 24px 24px, 120px 120px, 120px 120px;
  mask-image: radial-gradient(ellipse at 75% 30%, #000 0%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at 75% 30%, #000 0%, transparent 70%); }
.ag-blueprint > * { position: relative; }
.ag-blueprint__svg { position: absolute; right: -8%; top: -4%; width: 70%; max-width: 1000px; opacity: .22; pointer-events: none; }

/* --------------------------------------------------------------------------
   OFFRE — 3 besoins × 3 niveaux
-------------------------------------------------------------------------- */
.ag-offer-intro { max-width: 980px; }
.ag-needs { display: grid; gap: 8px; grid-template-columns: 1fr; margin-top: 56px; }
@media (min-width: 1000px) { .ag-needs { grid-template-columns: repeat(3, 1fr); } }
.ag-need { display: flex; flex-direction: column; background: rgba(38, 47, 49, .72); border: 1px solid var(--ag-line-night); padding: 30px 28px 26px; min-height: 100%; backdrop-filter: blur(2px); transition: background-color .25s ease, border-color .25s ease; }
.ag-need:hover { background: rgba(42, 56, 58, .9); border-color: rgba(243,243,239,.28); }
.ag-need__head { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.ag-need__icon { width: 34px; height: 34px; color: var(--ag-on-night); flex-shrink: 0; }
.ag-need p.ag-small { color: var(--ag-on-night-soft); margin: 0 0 22px; }
.ag-tiers { list-style: none; padding: 0; margin: 0 0 22px; border-top: 1px solid var(--ag-line-night); }
.ag-tiers li { display: grid; grid-template-columns: 92px 1fr auto; gap: 12px; align-items: baseline; padding: 14px 0; border-bottom: 1px solid var(--ag-line-night); font-size: 14px; }
.ag-tiers .t-level { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-on-night-soft); }
.ag-tiers .t-name { color: var(--ag-on-night); font-weight: 600; }
.ag-tiers .t-price { color: var(--ag-on-night); font-weight: 700; white-space: nowrap; }
.ag-need .ag-link { margin-top: auto; justify-content: space-between; width: 100%; }

.ag-entry { display: grid; gap: 8px; grid-template-columns: 1fr; margin-top: 8px; }
@media (min-width: 800px) { .ag-entry { grid-template-columns: 1fr 1fr; } }
.ag-entry a { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px 26px; text-decoration: none; color: var(--ag-on-night); border: 1px solid var(--ag-line-night); transition: background-color .25s ease; }
.ag-entry a:hover { background: rgba(243,243,239,.06); }
.ag-entry .e-kicker { display: block; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-on-night-soft); margin-bottom: 6px; }
.ag-entry .e-title { font-weight: 700; font-size: 18px; letter-spacing: -.02em; }

/* --------------------------------------------------------------------------
   RÉALISATIONS — carrousel sur fond sombre flouté
-------------------------------------------------------------------------- */
.ag-projects { position: relative; overflow: hidden; }
.ag-projects__bg { position: absolute; inset: -40px; background-size: cover; background-position: center; filter: blur(38px) brightness(.35) saturate(.8); transform: scale(1.1); transition: background-image .6s ease; }
.ag-projects__inner { position: relative; }
.ag-carousel { display: flex; gap: clamp(18px, 3vw, 44px); overflow-x: auto; scroll-snap-type: x mandatory; padding: 40px var(--ag-gutter) 10px; scrollbar-width: none; }
.ag-carousel::-webkit-scrollbar { display: none; }
.ag-slide { flex: 0 0 min(78vw, 820px); scroll-snap-align: center; color: #fff; text-decoration: none; display: block; }
.ag-slide__title { font-size: clamp(28px, 4.4vw, 60px); font-weight: 700; letter-spacing: -.045em; line-height: 1; margin: 0 0 -0.34em; position: relative; z-index: 2; padding-left: clamp(0px, 3vw, 40px); text-shadow: 0 4px 30px rgba(0,0,0,.35); }
.ag-slide__media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: #2a2f31; }
.ag-slide__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .8s cubic-bezier(.16,1,.3,1); }
.ag-slide:hover .ag-slide__media img { transform: scale(1.04); }
.ag-slide__tag { position: absolute; right: 18px; bottom: 18px; padding: 8px 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,.6); background: rgba(20,22,23,.35); backdrop-filter: blur(6px); font-size: 13px; font-weight: 600; }
.ag-slide__meta { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-top: 16px; font-size: 15px; color: rgba(255,255,255,.86); }
.ag-slide__meta .ag-link { font-size: 14px; }
.ag-slide__media--text { display: flex; align-items: flex-end; padding: clamp(24px, 4vw, 48px); background: linear-gradient(135deg, #1F4F53 0%, #111415 100%); }
.ag-slide__media--text p { font-size: clamp(18px, 2vw, 26px); line-height: 1.35; letter-spacing: -.02em; max-width: 520px; margin: 0; color: rgba(255,255,255,.92); }
.ag-carousel-ctrl { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 30px; }
.ag-carousel-ctrl button.nav { width: 44px; height: 44px; border-radius: 50%; border: 0; background: #fff; color: var(--ag-ink); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.ag-carousel-ctrl button.nav:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.ag-dots { display: flex; gap: 8px; }
.ag-dots button { width: 10px; height: 10px; border-radius: 50%; border: 0; padding: 0; background: rgba(255,255,255,.35); cursor: pointer; position: relative; }
.ag-dots button::before { content: ''; position: absolute; inset: -7px; }
.ag-dots button.is-active { background: #fff; }
.ag-projects__foot { display: flex; flex-direction: column; align-items: center; gap: 22px; margin-top: 48px; }
.ag-vline { width: 1px; height: 96px; background: rgba(255,255,255,.7); }

/* --------------------------------------------------------------------------
   LIVRABLES — carte flottante sur image
-------------------------------------------------------------------------- */
.ag-proof { display: grid; grid-template-columns: 1fr; }
@media (min-width: 1000px) { .ag-proof { grid-template-columns: 1fr 1fr; } }
.ag-proof__img { min-height: 380px; position: relative; overflow: hidden; }
.ag-proof__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(.2); }
.ag-proof__img .ag-label { position: absolute; left: var(--ag-gutter); top: 40px; z-index: 2; color: #fff; }
.ag-proof__card { background: var(--ag-paper); padding: clamp(32px, 5vw, 64px); }
@media (min-width: 1000px) { .ag-proof__card { margin: 90px 0 90px -18%; box-shadow: 0 40px 80px -40px rgba(0,0,0,.35); position: relative; z-index: 2; } }
.ag-docs { list-style: none; padding: 0; margin: 28px 0 0; counter-reset: doc; }
.ag-docs li { display: grid; grid-template-columns: 44px 1fr; gap: 6px 14px; padding: 16px 0; border-top: 1px solid var(--ag-line); }
.ag-docs li::before { counter-increment: doc; content: counter(doc, decimal-leading-zero); font-size: 13px; font-weight: 700; color: var(--ag-accent-deep); padding-top: 3px; grid-row: span 2; }
.ag-docs strong { font-size: 17px; letter-spacing: -.02em; }
.ag-docs span { font-size: 14px; color: var(--ag-ink-soft); line-height: 1.55; }

/* --------------------------------------------------------------------------
   PROCESSUS — cercles concentriques + étapes
-------------------------------------------------------------------------- */
.ag-process { display: grid; grid-template-columns: 1fr; gap: 48px; align-items: center; margin-top: 24px; }
@media (min-width: 1000px) { .ag-process { grid-template-columns: 1fr 1fr; gap: 80px; } }
.ag-orbit { position: relative; width: min(100%, 520px); aspect-ratio: 1; margin: 0 auto; }
.ag-orbit svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.ag-orbit__spin { transform-origin: 50% 50%; animation: ag-spin 60s linear infinite; }
@keyframes ag-spin { to { transform: rotate(360deg); } }
.ag-orbit__core { position: absolute; left: 50%; top: 50%; width: 52%; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; background: #fff; color: var(--ag-ink); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 18px; box-shadow: 0 0 0 1px rgba(255,255,255,.4); }
.ag-orbit__num { font-size: clamp(28px, 3vw, 40px); font-weight: 700; letter-spacing: -.04em; }
.ag-orbit__title { font-size: clamp(15px, 1.4vw, 20px); font-weight: 600; letter-spacing: -.02em; line-height: 1.2; margin-top: 4px; }
.ag-steps { list-style: none; margin: 0; padding: 0; }
.ag-step { border-bottom: 1px solid var(--ag-line-night); }
.ag-step button { all: unset; box-sizing: border-box; display: block; width: 100%; cursor: pointer; padding: 22px 0; }
.ag-step button:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.ag-step .s-kicker { display: block; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ag-on-night-soft); margin-bottom: 4px; }
.ag-step .s-title { font-size: clamp(22px, 2.2vw, 30px); font-weight: 700; letter-spacing: -.035em; color: rgba(243,243,239,.45); transition: color .25s ease; }
.ag-step .s-body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .45s cubic-bezier(.16,1,.3,1); }
.ag-step .s-body > div { overflow: hidden; }
.ag-step .s-body p { margin: 12px 0 0; font-size: 15px; line-height: 1.7; color: var(--ag-on-night-soft); max-width: 520px; }
.ag-step.is-active .s-title { color: var(--ag-on-night); }
.ag-step.is-active .s-body { grid-template-rows: 1fr; }

/* --------------------------------------------------------------------------
   RESSOURCES — liste façon "journal"
-------------------------------------------------------------------------- */
.ag-news { margin-top: 44px; border-top: 1px solid var(--ag-line); }
.ag-news a { display: grid; grid-template-columns: 1fr; gap: 6px 32px; padding: 26px 0; border-bottom: 1px solid var(--ag-line); text-decoration: none; color: inherit; align-items: center; transition: padding-left .3s ease; }
@media (min-width: 800px) { .ag-news a { grid-template-columns: 140px 1fr auto; } .ag-news a:hover { padding-left: 12px; } }
.ag-news .n-tag { font-size: 13px; color: var(--ag-ink-soft); }
.ag-news .n-title { font-size: clamp(20px, 2vw, 28px); font-weight: 700; letter-spacing: -.03em; }
.ag-news .n-desc { display: block; font-size: 14px; font-weight: 400; letter-spacing: 0; color: var(--ag-ink-soft); margin-top: 4px; }

/* --------------------------------------------------------------------------
   CONTACT final
-------------------------------------------------------------------------- */
.ag-contact { display: grid; gap: 40px; grid-template-columns: 1fr; }
@media (min-width: 900px) { .ag-contact { grid-template-columns: 1.3fr 1fr; align-items: end; } }
.ag-contact address { font-style: normal; font-size: 16px; line-height: 1.9; color: var(--ag-on-night-soft); }
.ag-contact address a { color: var(--ag-on-night); text-decoration: none; }
.ag-contact address a:hover { text-decoration: underline; }
.ag-signature { font-size: clamp(34px, 7vw, 110px); font-weight: 700; letter-spacing: -.05em; line-height: .95; color: rgba(243,243,239,.1); margin-top: clamp(56px, 8vw, 110px); user-select: none; }

/* --------------------------------------------------------------------------
   CATALOGUE (offres.html)
-------------------------------------------------------------------------- */
.ag-page-head { padding-top: 150px; padding-bottom: clamp(48px, 6vw, 80px); }
.ag-tabs { position: sticky; top: 80px; z-index: 30; background: rgba(246,246,243,.94); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-top: 1px solid var(--ag-line); border-bottom: 1px solid var(--ag-line); }
.ag-tabs nav { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 10px 0; }
.ag-tabs nav::-webkit-scrollbar { display: none; }
.ag-tabs a { flex-shrink: 0; padding: 9px 16px; border-radius: 999px; font-size: 14px; font-weight: 600; color: var(--ag-ink-soft); text-decoration: none; border: 1px solid transparent; }
.ag-tabs a:hover { color: var(--ag-ink); border-color: var(--ag-line); }
.ag-tabs a.is-active { color: #fff; background: var(--ag-ink); }
.ag-cat-block { scroll-margin-top: 150px; }
.ag-cat-head { display: grid; gap: 20px; grid-template-columns: 1fr; margin-bottom: 40px; }
@media (min-width: 900px) { .ag-cat-head { grid-template-columns: 80px 1.2fr 1fr; align-items: end; } }
.ag-cat-num { font-size: 15px; font-weight: 700; color: var(--ag-accent-deep); }
.ag-levels { display: grid; gap: 8px; grid-template-columns: 1fr; }
@media (min-width: 1000px) { .ag-levels { grid-template-columns: 1fr 1.35fr 1fr; } }
.ag-level { display: flex; flex-direction: column; gap: 8px; }
.ag-level__head { display: flex; justify-content: space-between; align-items: baseline; padding: 0 2px 10px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-ink-soft); border-bottom: 2px solid var(--ag-ink); }
.ag-level__head em { font-style: normal; font-weight: 500; letter-spacing: 0; text-transform: none; font-size: 13px; }
.ag-product { background: #fff; border: 1px solid var(--ag-line); padding: 22px 22px 20px; display: flex; flex-direction: column; gap: 10px; transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.ag-product:hover { border-color: rgba(20,22,23,.35); transform: translateY(-2px); box-shadow: 0 16px 30px -22px rgba(20,22,23,.4); }
.ag-product__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; }
.ag-product h3 { font-size: 19px; font-weight: 700; letter-spacing: -.025em; line-height: 1.2; margin: 0; }
.ag-price { font-size: 19px; font-weight: 700; letter-spacing: -.02em; white-space: nowrap; }
.ag-price small { font-size: 12px; font-weight: 500; color: var(--ag-ink-soft); }
.ag-product p { margin: 0; font-size: 14px; line-height: 1.6; color: var(--ag-ink-soft); }
.ag-product ul { margin: 2px 0 0; padding: 0; list-style: none; font-size: 13.5px; line-height: 1.55; }
.ag-product ul li { position: relative; padding-left: 16px; margin: 3px 0; }
.ag-product ul li::before { content: ''; position: absolute; left: 0; top: .62em; width: 6px; height: 6px; border-radius: 50%; background: var(--ag-accent-deep); }
.ag-product__foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--ag-line); font-size: 13px; color: var(--ag-ink-soft); }
.ag-product__foot a { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; font-size: 14px; color: var(--ag-ink); text-decoration: none; }
.ag-product__foot a .ag-arrow { width: 30px; height: 30px; }
.ag-product__foot a:focus-visible { outline: 2px solid var(--ag-accent); outline-offset: 3px; border-radius: 4px; }
.ag-product--sub { background: var(--ag-night); color: var(--ag-on-night); border-color: var(--ag-night); }
.ag-product--sub:hover { border-color: var(--ag-night); }
.ag-product--sub p, .ag-product--sub .ag-product__foot, .ag-product--sub .ag-price small { color: var(--ag-on-night-soft); }
.ag-product--sub .ag-product__foot { border-top-color: var(--ag-line-night); }
.ag-product--sub .ag-product__foot a { color: #fff; }
.ag-product--sub .ag-product__foot a .ag-arrow { background: #fff; color: var(--ag-ink); }
.ag-product--sub ul li::before { background: #fff; }
.ag-product--free .ag-price { color: var(--ag-accent); }
.ag-badge { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 4px 9px; border-radius: 999px; background: var(--ag-paper-2); color: var(--ag-ink); align-self: flex-start; }
.ag-product--sub .ag-badge { background: rgba(255,255,255,.12); color: #fff; }

.ag-terms { display: grid; gap: 1px; grid-template-columns: 1fr; background: var(--ag-line-night); border: 1px solid var(--ag-line-night); margin-top: 48px; }
@media (min-width: 800px) { .ag-terms { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .ag-terms { grid-template-columns: repeat(4, 1fr); } }
.ag-terms div { background: var(--ag-night); padding: 28px 26px; }
.ag-terms strong { display: block; font-size: 18px; letter-spacing: -.02em; margin-bottom: 10px; }
.ag-terms p { margin: 0; font-size: 14px; line-height: 1.65; color: var(--ag-on-night-soft); }

/* Header sur ces pages : transparent sur fond sombre en haut, papier au scroll */
body.ag #site-header.header-scrolled { background-color: rgba(246,246,243,.94); }
body.ag .cta-btn { background-color: var(--ag-ink); border-radius: 999px; }
body.ag .cta-btn:hover, body.ag .cta-btn:focus-visible { background-color: var(--ag-accent-deep); color: #fff; }
body.ag.hero-dark #site-header:not(.header-scrolled) .cta-btn { background: #fff; color: var(--ag-ink); }
body.ag.hero-dark #site-header:not(.header-scrolled) a.text-ink\/70 { color: rgba(255,255,255,.78); }
body.ag footer { background: var(--ag-paper); margin-top: 0; }

/* Apparition au scroll (même mécanique que .reveal de site.js) */
body.ag .reveal { opacity: 0; transform: translateY(24px); transition: opacity .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1); }
body.ag .reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 640px) {
  .ag-float-card { margin: -64px var(--ag-gutter) 0; width: auto; }
  .ag-tiers li { grid-template-columns: 1fr auto; }
  .ag-tiers .t-level { grid-column: 1 / -1; }
  .ag-slide { flex-basis: 86vw; }
}

@media (prefers-reduced-motion: reduce) {
  .ag-marquee__track, .ag-orbit__spin { animation: none; }
  body.ag .reveal { opacity: 1; transform: none; transition: none; }
  .ag-step .s-body { transition: none; }
}

/* ==========================================================================
   PAGES INTÉRIEURES — en-tête sombre commun, blocs de contenu, formulaires
   ========================================================================== */

/* En-tête de page (id="hero" : le header reste transparent/clair dessus) */
.ag-page-hero { background: var(--ag-night-2); color: #fff; padding-top: 150px; padding-bottom: clamp(56px, 7vw, 96px); position: relative; overflow: hidden; }
.ag-page-hero .ag-label { color: var(--ag-on-night); }
.ag-page-hero__grid { display: grid; gap: 28px; grid-template-columns: 1fr; align-items: end; }
@media (min-width: 900px) { .ag-page-hero__grid { grid-template-columns: 1.5fr 1fr; } .ag-page-hero__side { text-align: right; } }
.ag-page-hero h1 { font-weight: 700; letter-spacing: -.045em; line-height: 1.02; font-size: clamp(38px, 5.6vw, 84px); margin: 0; }
.ag-page-hero h1 .ag-grey-tail { color: rgba(255,255,255,.36); }
.ag-page-hero__side p { margin: 0; font-size: 17px; line-height: 1.65; color: rgba(255,255,255,.72); }
.ag-page-hero__meta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.ag-pill { display: inline-flex; align-items: center; gap: 8px; padding: 8px 15px; border-radius: 999px; border: 1px solid rgba(255,255,255,.35); font-size: 13px; font-weight: 600; color: rgba(255,255,255,.9); text-decoration: none; }
a.ag-pill:hover { background: rgba(255,255,255,.08); }
.ag-pill--light { border-color: var(--ag-line); color: var(--ag-ink); }
.ag-back { display: flex; width: fit-content; gap: 8px; align-items: center; font-size: 14px; color: rgba(255,255,255,.7); text-decoration: none; margin-bottom: 26px; }
.ag-back:hover { color: #fff; }
.ag-page-hero--image { padding-bottom: 0; }
.ag-page-hero__img { position: relative; margin-top: clamp(40px, 6vw, 72px); aspect-ratio: 21 / 8; overflow: hidden; }
.ag-page-hero__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.85); }

/* Deux colonnes : texte / aside */
.ag-cols { display: grid; gap: 40px; grid-template-columns: 1fr; }
@media (min-width: 900px) { .ag-cols { grid-template-columns: 1.4fr 1fr; gap: 72px; } .ag-cols--even { grid-template-columns: 1fr 1fr; } .ag-cols--rev { grid-template-columns: 1fr 1.4fr; } }
.ag-text p { font-size: 17px; line-height: 1.8; margin: 0 0 22px; }
.ag-text p:last-child { margin-bottom: 0; }
.ag-text a { color: var(--ag-accent-deep); text-decoration: underline; text-underline-offset: 3px; }
.ag-dark .ag-text a, .ag-darker .ag-text a { color: #fff; }
.ag-aside { border-top: 2px solid var(--ag-ink); padding-top: 18px; }
.ag-dark .ag-aside { border-top-color: var(--ag-on-night); }
.ag-aside h3, .ag-aside .ag-aside__title { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-ink-soft); margin: 0 0 14px; }
.ag-dark .ag-aside h3 { color: var(--ag-on-night-soft); }
.ag-list { list-style: none; padding: 0; margin: 0; }
.ag-list li { position: relative; padding: 11px 0 11px 22px; border-bottom: 1px solid var(--ag-line); font-size: 15px; line-height: 1.55; }
.ag-list li::before { content: ''; position: absolute; left: 0; top: 19px; width: 7px; height: 7px; border-radius: 50%; background: var(--ag-accent-deep); }
.ag-dark .ag-list li, .ag-darker .ag-list li { border-bottom-color: var(--ag-line-night); }
.ag-dark .ag-list li::before, .ag-darker .ag-list li::before { background: #fff; }
.ag-note { font-size: 13px; line-height: 1.6; color: var(--ag-ink-soft); margin-top: 18px; }
.ag-dark .ag-note { color: var(--ag-on-night-soft); }

/* Cartes numérotées (piliers, constats, étapes) */
.ag-cards { display: grid; gap: 8px; grid-template-columns: 1fr; margin-top: 44px; }
@media (min-width: 760px) { .ag-cards { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .ag-cards--3 { grid-template-columns: repeat(3, 1fr); } .ag-cards--4 { grid-template-columns: repeat(4, 1fr); } }
.ag-card { background: #fff; border: 1px solid var(--ag-line); padding: 28px 26px; display: flex; flex-direction: column; gap: 12px; }
.ag-card__num { font-size: 13px; font-weight: 700; color: var(--ag-accent-deep); }
.ag-card h3 { font-size: 21px; font-weight: 700; letter-spacing: -.03em; line-height: 1.2; margin: 0; }
.ag-card p { margin: 0; font-size: 15px; line-height: 1.65; color: var(--ag-ink-soft); }
.ag-dark .ag-card, .ag-darker .ag-card { background: rgba(38,47,49,.72); border-color: var(--ag-line-night); }
.ag-dark .ag-card__num, .ag-darker .ag-card__num { color: var(--ag-on-night-soft); }
.ag-dark .ag-card p, .ag-darker .ag-card p { color: var(--ag-on-night-soft); }

/* Formules tarifaires (pages COO / Growth) */
.ag-plans { display: grid; gap: 8px; grid-template-columns: 1fr; margin-top: 44px; }
@media (min-width: 900px) { .ag-plans { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); } }
.ag-plan { display: flex; flex-direction: column; gap: 16px; padding: 32px 28px; border: 1px solid var(--ag-line-night); background: rgba(38,47,49,.72); }
.ag-plan__name { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-on-night-soft); }
.ag-plan__price { font-size: clamp(34px, 3.6vw, 48px); font-weight: 700; letter-spacing: -.04em; line-height: 1; }
.ag-plan__price small { display: block; font-size: 14px; font-weight: 500; letter-spacing: 0; color: var(--ag-on-night-soft); margin-top: 8px; }
.ag-plan p { margin: 0; font-size: 15px; line-height: 1.65; color: var(--ag-on-night-soft); }
.ag-plan .ag-list li { font-size: 14px; color: var(--ag-on-night); }
.ag-plan__sub { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-on-night-soft); margin-top: 6px; }

/* Bandeau CTA final */
.ag-cta-band { background: var(--ag-night-2); color: #fff; }
.ag-cta-band__inner { display: grid; gap: 28px; grid-template-columns: 1fr; align-items: end; }
@media (min-width: 900px) { .ag-cta-band__inner { grid-template-columns: 1.5fr auto; } }
.ag-cta-band h2 { font-weight: 700; letter-spacing: -.04em; line-height: 1.04; font-size: clamp(30px, 4.2vw, 58px); margin: 0; }
.ag-cta-band h2 span { color: rgba(255,255,255,.4); }

/* Avant / après (cas clients) */
.ag-compare { display: grid; grid-template-columns: 1fr; gap: 8px; }
@media (min-width: 900px) { .ag-compare { grid-template-columns: 1fr 64px 1fr; align-items: stretch; } }
.ag-compare__col { padding: 30px 28px; border: 1px solid var(--ag-line); background: #fff; }
.ag-compare__col--after { background: var(--ag-accent-deep); color: #fff; border-color: var(--ag-accent-deep); }
.ag-compare__title { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-ink-soft); margin: 0 0 18px; }
.ag-compare__col--after .ag-compare__title { color: rgba(255,255,255,.7); }
.ag-compare__row { padding: 14px 0; border-top: 1px solid var(--ag-line); }
.ag-compare__col--after .ag-compare__row { border-top-color: rgba(255,255,255,.2); }
.ag-compare__row strong { display: block; font-size: 28px; font-weight: 700; letter-spacing: -.035em; line-height: 1.1; }
.ag-compare__row span { font-size: 14px; line-height: 1.55; color: var(--ag-ink-soft); }
.ag-compare__col--after .ag-compare__row span { color: rgba(255,255,255,.78); }
.ag-compare__arrow { display: none; align-items: center; justify-content: center; }
@media (min-width: 900px) { .ag-compare__arrow { display: flex; } }

/* Horizons (feuille de route) */
.ag-horizons { display: grid; gap: 8px; grid-template-columns: 1fr; margin-top: 44px; }
@media (min-width: 900px) { .ag-horizons { grid-template-columns: repeat(3, 1fr); } }
.ag-horizon { border-top: 2px solid var(--ag-on-night); padding-top: 18px; }
.ag-horizon__when { font-size: 30px; font-weight: 700; letter-spacing: -.04em; }
.ag-horizon__label { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-on-night-soft); margin: 4px 0 14px; }

/* Figure pleine largeur avec légende */
.ag-figure { margin: 0; }
.ag-figure img { width: 100%; display: block; aspect-ratio: 16 / 9; object-fit: cover; }
.ag-figure figcaption { font-size: 13px; color: var(--ag-ink-soft); margin-top: 12px; }

/* Grille de photos (à propos) */
.ag-gallery { display: grid; gap: 8px; grid-template-columns: 1fr; margin-top: 44px; }
@media (min-width: 700px) { .ag-gallery { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .ag-gallery { grid-template-columns: repeat(3, 1fr); } .ag-gallery figure:nth-child(3n+2) { margin-top: 64px; } }
.ag-gallery figure { margin: 0; }
.ag-gallery img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; filter: saturate(.9); }
.ag-gallery figcaption { padding-top: 14px; }
.ag-gallery figcaption strong { display: block; font-size: 18px; letter-spacing: -.02em; }
.ag-gallery figcaption span { font-size: 13px; color: var(--ag-on-night-soft); }

/* Logos (références de carrière) */
.ag-logos { display: grid; gap: 8px; grid-template-columns: repeat(2, 1fr); margin-top: 44px; }
@media (min-width: 700px) { .ag-logos { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1100px) { .ag-logos { grid-template-columns: repeat(5, 1fr); } }
.ag-logos span { display: flex; align-items: center; justify-content: center; height: 96px; background: #fff; border: 1px solid var(--ag-line); padding: 18px; }
.ag-logos img { max-width: 120px; max-height: 44px; width: auto; height: auto; filter: grayscale(1); opacity: .8; }

/* FAQ (details/summary) */
.ag-faq { border-top: 1px solid var(--ag-line); }
.ag-faq details { border-bottom: 1px solid var(--ag-line); }
.ag-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 24px 0; font-size: clamp(18px, 1.6vw, 22px); font-weight: 700; letter-spacing: -.025em; }
.ag-faq summary::-webkit-details-marker { display: none; }
.ag-faq summary::after { content: '+'; flex-shrink: 0; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--ag-line); display: inline-flex; align-items: center; justify-content: center; font-weight: 500; font-size: 20px; transition: transform .25s ease, background-color .25s ease; }
.ag-faq details[open] summary::after { transform: rotate(45deg); background: var(--ag-ink); color: #fff; border-color: var(--ag-ink); }
.ag-faq summary:focus-visible { outline: 2px solid var(--ag-accent); outline-offset: 4px; }
.ag-faq details p { margin: 0 0 24px; max-width: 780px; font-size: 16px; line-height: 1.75; color: var(--ag-ink-soft); }
.ag-faq details a { color: var(--ag-accent-deep); text-decoration: underline; text-underline-offset: 3px; }
.ag-faq-group { display: grid; gap: 20px; grid-template-columns: 1fr; padding: 48px 0; border-top: 1px solid var(--ag-line); }
.ag-faq-group:first-child { border-top: 0; padding-top: 0; }
@media (min-width: 900px) { .ag-faq-group { grid-template-columns: 280px 1fr; gap: 48px; } }
.ag-faq-group h2 { font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-accent-deep); margin: 6px 0 0; }

/* Étapes numérotées verticales (check-list, blueprint) */
.ag-timeline { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ag-line); }
.ag-timeline li { display: grid; grid-template-columns: 1fr; gap: 8px 32px; padding: 28px 0; border-bottom: 1px solid var(--ag-line); }
@media (min-width: 800px) { .ag-timeline li { grid-template-columns: 140px 1fr; } }
.ag-timeline .t-step { font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ag-accent-deep); padding-top: 6px; }
.ag-timeline h3 { font-size: clamp(20px, 2vw, 26px); font-weight: 700; letter-spacing: -.03em; margin: 0 0 8px; }
.ag-timeline p { margin: 0; font-size: 16px; line-height: 1.7; color: var(--ag-ink-soft); max-width: 760px; }

/* Tableau simple */
.ag-table { width: 100%; border-collapse: collapse; margin: 28px 0; font-size: 15px; }
.ag-table th { text-align: left; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-ink-soft); padding: 0 16px 12px 0; border-bottom: 2px solid var(--ag-ink); }
.ag-table td { padding: 16px 16px 16px 0; border-bottom: 1px solid var(--ag-line); vertical-align: top; line-height: 1.6; }
.ag-table td:first-child { font-weight: 700; white-space: nowrap; }
@media (max-width: 640px) { .ag-table td:first-child { white-space: normal; } }

/* Encadré mis en avant */
.ag-callout { border-left: 3px solid var(--ag-accent-deep); background: #fff; padding: 22px 26px; font-size: 16px; line-height: 1.7; margin: 28px 0 0; }

/* Formulaire d'accès aux ressources (gate) */
.ag-gate { background: #fff; border: 1px solid var(--ag-line); padding: clamp(26px, 4vw, 44px); }
.ag-gate p { margin: 0 0 22px; font-size: 16px; }
.ag-form-grid { display: grid; gap: 14px; grid-template-columns: 1fr; }
@media (min-width: 700px) { .ag-form-grid { grid-template-columns: 1fr 1fr auto; align-items: end; } }
.ag-field label { display: block; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ag-ink-soft); margin-bottom: 8px; }
.ag-field input, .ag-field select, .ag-field textarea { width: 100%; box-sizing: border-box; border: 1px solid rgba(20,22,23,.22); background: var(--ag-paper); padding: 14px 16px; font: inherit; font-size: 15px; color: var(--ag-ink); border-radius: 0; }
.ag-field input:focus, .ag-field select:focus, .ag-field textarea:focus { outline: 2px solid var(--ag-accent); outline-offset: 0; border-color: var(--ag-accent); }
button.ag-btn { border: 0; cursor: pointer; font: inherit; font-weight: 600; font-size: 15px; }
.ag-gate .field-invalid { border-color: #9a3b2f; }
.ag-gate #gate-error { margin: 14px 0 0; font-size: 14px; color: #9a3b2f; }

/* Flux vertical (blueprint) */
.ag-flow { display: flex; flex-direction: column; align-items: stretch; gap: 0; margin: 32px 0; }
.ag-flow__node { background: #fff; border: 1px solid var(--ag-line); padding: 22px 26px; }
.ag-flow__node strong { display: block; font-size: 19px; letter-spacing: -.02em; margin-bottom: 6px; }
.ag-flow__node p { margin: 0; font-size: 15px; line-height: 1.65; color: var(--ag-ink-soft); }
.ag-flow__link { width: 1px; height: 34px; background: var(--ag-ink); margin-left: 34px; position: relative; }
.ag-flow__link::after { content: ''; position: absolute; left: -4px; bottom: -1px; border: 4px solid transparent; border-top: 6px solid var(--ag-ink); }

/* Prose (pages légales) */
.ag-prose { max-width: 820px; }
.ag-prose h2 { font-size: clamp(22px, 2.2vw, 28px); font-weight: 700; letter-spacing: -.03em; margin: 56px 0 16px; padding-top: 24px; border-top: 1px solid var(--ag-line); }
.ag-prose section:first-child h2, .ag-prose > h2:first-child { margin-top: 0; }
.ag-prose h3 { font-size: 18px; font-weight: 700; margin: 28px 0 10px; }
.ag-prose p, .ag-prose li { font-size: 16px; line-height: 1.75; color: rgba(20,22,23,.82); }
.ag-prose p { margin: 0 0 16px; }
.ag-prose ul, .ag-prose ol { margin: 0 0 16px; padding-left: 22px; }
.ag-prose li { margin: 6px 0; }
.ag-prose a { color: var(--ag-accent-deep); text-decoration: underline; text-underline-offset: 3px; }

/* Liens-tuiles (404, merci) */
.ag-tiles { display: grid; gap: 8px; grid-template-columns: 1fr; margin-top: 40px; }
@media (min-width: 700px) { .ag-tiles { grid-template-columns: repeat(2, 1fr); } }
.ag-tiles a { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 24px 26px; background: #fff; border: 1px solid var(--ag-line); text-decoration: none; color: var(--ag-ink); transition: border-color .2s ease; }
.ag-tiles a:hover { border-color: var(--ag-ink); }
.ag-tiles strong { display: block; font-size: 19px; letter-spacing: -.02em; }
.ag-tiles span.ag-small { color: var(--ag-ink-soft); }

/* Pages à formulaire existant (contact, tunnel) : conteneur papier + champs harmonisés */
body.ag .ag-legacy-form .rounded-lg, body.ag .ag-legacy-form .rounded { border-radius: 0 !important; }
body.ag .ag-legacy-form .shadow-sm { box-shadow: none !important; }
body.ag .ag-legacy-form input:not([type=range]):not([type=radio]):not([type=checkbox]), body.ag .ag-legacy-form select, body.ag .ag-legacy-form textarea { border-width: 1px !important; border-color: rgba(20,22,23,.22); background-color: var(--ag-paper); }
body.ag .ag-legacy-form .hl { background: none; padding: 0; transform: none; color: inherit; }
body.ag .ag-legacy-form .text-petrole { color: var(--ag-accent-deep); }
body.ag .ag-legacy-form details { border-radius: 0; }

/* Schéma Méthode Squad */
.ag-squad { display: flex; flex-direction: column; align-items: center; gap: 0; padding: 28px; border: 1px solid var(--ag-line); background: #fff; }
.ag-squad__row { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.ag-squad__node { display: inline-flex; flex-direction: column; align-items: center; text-align: center; padding: 12px 18px; border: 1px solid var(--ag-line); font-weight: 600; font-size: 14px; background: var(--ag-paper); }
.ag-squad__node small { font-weight: 400; font-size: 12px; color: rgba(255,255,255,.75); margin-top: 4px; }
.ag-squad__node--you { background: #fff; border-color: var(--ag-ink); }
.ag-squad__node--lead { background: var(--ag-accent-deep); border-color: var(--ag-accent-deep); color: #fff; padding: 18px 26px; font-size: 17px; }
.ag-squad__link { width: 1px; height: 36px; background: var(--ag-ink); }

/* Catalogue : cartes compactes (kits) et sous-titres de colonne */
.ag-product--compact { padding: 16px 18px 14px; gap: 6px; }
.ag-product--compact h3 { font-size: 16px; }
.ag-product--compact .ag-price { font-size: 16px; }
.ag-product--compact p { font-size: 13px; line-height: 1.5; }
.ag-product--compact .ag-product__foot { padding-top: 8px; }
.ag-subhead { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-ink-soft); margin: 14px 2px 0; }
.ag-subhead:first-of-type { margin-top: 4px; }
.ag-packs { display: grid; gap: 8px; grid-template-columns: 1fr; }
@media (min-width: 900px) { .ag-packs { grid-template-columns: repeat(3, 1fr); } }

/* ==========================================================================
   COULEUR — une couleur par besoin + accent lime de la marque
   ========================================================================== */
:root {
  --c-clients: #945452;     /* 01 · Trouver des clients : terre cuite */
  --c-structure: #4E689A;   /* 02 · Structurer : bleu ardoise */
  --c-outils: #4B7548;      /* 03 · Outiller, automatiser & IA : sauge */
  --c-lime: #E8FF5B;        /* accent historique de la marque */
  --c-ia: linear-gradient(100deg, #4B7548 0%, #4E689A 100%);
  /* Palette choisie en OKLCH (L 0.52, C 0.085, teintes à ±60° et 180° du pétrole de marque) :
     même luminosité et même chroma, ΔE 15 entre chaque paire, contraste ≥ 5.3:1 avec le blanc. */
}
[hidden] { display: none !important; }
body.ag ::selection { background: var(--c-lime); color: var(--ag-ink); }

/* Boutons clairs (sur fond sombre) et CTA du header : lime */
.ag-btn--light { background: var(--c-lime); color: var(--ag-ink); }
.ag-btn--light:hover { background: #fff; }
body.ag.hero-dark #site-header:not(.header-scrolled) .cta-btn { background: var(--c-lime); color: var(--ag-ink); }
.ag-dark .ag-label::before, .ag-darker .ag-label::before, .ag-page-hero .ag-label::before, .ag-on-image .ag-label::before { background: var(--c-lime); }

/* Halo de couleur dans les en-têtes sombres */
.ag-page-hero::before, .ag-hero__top::before { content: ''; position: absolute; pointer-events: none; inset: -20% -10% auto auto; width: 70%; height: 140%;
  background: radial-gradient(closest-side, rgba(78,104,154,.30), transparent 70%), radial-gradient(closest-side at 30% 70%, rgba(148,84,82,.22), transparent 70%); filter: blur(20px); }
.ag-hero__top { position: relative; overflow: hidden; }
.ag-page-hero > .ag-wrap, .ag-hero__top > .ag-wrap { position: relative; z-index: 1; }
.ag-page-hero__img { z-index: 1; }

/* Couleur de catégorie : variable --cat posée par section */
.ag-cat--clients, .ag-need--clients, .ag-tab--clients { --cat: var(--c-clients); }
.ag-cat--structure, .ag-need--structure, .ag-tab--structure { --cat: var(--c-structure); }
.ag-cat--outils, .ag-need--outils, .ag-tab--outils { --cat: var(--c-outils); }
.ag-cat--depart, .ag-cat--packs { --cat: var(--ag-accent); }
.ag-cat-block .ag-cat-num { color: var(--cat, var(--ag-accent-deep)); font-size: 22px; }
.ag-cat-block .ag-level__head { border-bottom-color: var(--cat, var(--ag-ink)); }
.ag-cat-block .ag-product { border-top: 3px solid var(--cat, var(--ag-line)); }
.ag-cat-block .ag-product ul li::before { background: var(--cat, var(--ag-accent-deep)); }
.ag-cat-block .ag-product--sub { border-top-color: var(--cat); }
.ag-cat-block .ag-product--sub ul li::before { background: var(--cat); }
.ag-cat-block .ag-product__foot a .ag-arrow { background: var(--cat, var(--ag-accent-deep)); }
.ag-cat-block .ag-product--sub .ag-product__foot a .ag-arrow { background: #fff; color: var(--ag-ink); }
.ag-cat-block .ag-subhead { color: var(--cat); }
.ag-tabs a.ag-tab--clients::before, .ag-tabs a.ag-tab--structure::before, .ag-tabs a.ag-tab--outils::before { content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--cat); margin-right: 8px; vertical-align: 1px; }

/* Cartes "besoin" de l'accueil */
.ag-need { border-top: 3px solid var(--cat, transparent); }
.ag-need .ag-need__icon { color: var(--cat, var(--ag-on-night)); }
.ag-need .ag-tiers .t-price { color: #fff; }
.ag-need .ag-link .ag-arrow { background: var(--cat, #fff); color: #fff; }

/* Tags */
.ag-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 2px; }
.ag-tag { font-size: 11px; font-weight: 600; letter-spacing: .01em; padding: 3px 9px; border-radius: 999px; background: #F0F0EB; color: rgba(20,22,23,.75); }
@supports (background: color-mix(in srgb, red 10%, white)) {
  .ag-cat-block .ag-tag { background: color-mix(in srgb, var(--cat) 11%, white); color: color-mix(in srgb, var(--cat) 75%, black); }
  .ag-cat-block .ag-product--sub .ag-tag { background: color-mix(in srgb, var(--cat) 30%, transparent); color: #fff; }
}
.ag-product--sub .ag-tag { background: rgba(255,255,255,.12); color: #fff; }
.ag-tag--ia, .ag-cat-block .ag-tag--ia, .ag-cat-block .ag-product--sub .ag-tag--ia { background: var(--c-ia); color: #fff; }
.ag-badge--ia, .ag-product--sub .ag-badge--ia { background: var(--c-ia); color: #fff; }

/* Recherche dans la barre d'onglets */
.ag-tabs__inner { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.ag-tabs__inner nav { flex: 1 1 auto; min-width: 0; }
.ag-search { position: relative; display: flex; align-items: center; flex: 0 1 340px; min-width: 220px; margin: 8px 0; }
.ag-search svg { position: absolute; left: 14px; width: 17px; height: 17px; color: var(--ag-ink-soft); pointer-events: none; }
.ag-search input { width: 100%; box-sizing: border-box; padding: 11px 104px 11px 40px; border-radius: 999px; border: 1px solid rgba(20,22,23,.2); background: #fff; font: inherit; font-size: 14px; color: var(--ag-ink); }
.ag-search input:focus { outline: 2px solid var(--c-outils); outline-offset: 1px; border-color: transparent; }
.ag-search__count { position: absolute; right: 16px; font-size: 12px; font-weight: 700; color: var(--c-outils); pointer-events: none; }
@media (max-width: 760px) { .ag-search { flex: 1 1 100%; margin-top: 0; } }
.ag-search-empty { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; justify-content: space-between; margin: 48px 0; padding: 28px; background: #fff; border: 1px solid var(--ag-line); border-left: 3px solid var(--c-outils); }
.ag-search-empty p { margin: 0; max-width: 640px; font-size: 16px; line-height: 1.6; }
body.ag-is-searching .ag-cat-block { padding-top: 32px !important; padding-bottom: 32px !important; }
body.ag-is-searching .ag-subhead { display: none; }
body.ag-is-searching .ag-cat-block .ag-rule { margin-bottom: 32px !important; }

/* Sélecteur de quantité (liste de prospection) */
.ag-qty { display: flex; align-items: center; gap: 6px; margin: 4px 0 2px; }
.ag-qty__label { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ag-ink-soft); margin-right: 4px; }
.ag-qty button { min-width: 52px; padding: 7px 12px; border-radius: 999px; border: 1px solid rgba(20,22,23,.2); background: #fff; font: inherit; font-size: 14px; font-weight: 700; color: var(--ag-ink); cursor: pointer; transition: background-color .15s ease, color .15s ease, border-color .15s ease; }
.ag-qty button:hover { border-color: var(--cat, var(--ag-ink)); }
.ag-qty button[aria-pressed="true"] { background: var(--cat, var(--ag-ink)); border-color: var(--cat, var(--ag-ink)); color: #fff; }
.ag-qty button:focus-visible { outline: 2px solid var(--cat, var(--ag-accent)); outline-offset: 2px; }
.ag-bump { animation: ag-bump .35s ease; }
@keyframes ag-bump { 40% { transform: scale(1.12); color: var(--cat, var(--ag-accent)); } }

/* Pages intérieures : un peu de couleur sur les cartes numérotées et les horizons */
.ag-card { border-top: 3px solid var(--c-lime); }
.ag-section:not(.ag-dark):not(.ag-darker) .ag-card { border-top-color: var(--ag-accent); }
.ag-horizon { border-top-color: var(--c-lime); }
.ag-compare__col--after { background: linear-gradient(135deg, var(--ag-accent-deep) 0%, #2B2F7A 100%); }
.ag-plan { border-top: 3px solid var(--c-lime); }
.ag-faq details[open] summary::after { background: var(--c-outils); border-color: var(--c-outils); }
.ag-tabs__inner { flex-wrap: nowrap; }
.ag-tabs__inner nav { flex: 1 1 0; }
@media (max-width: 760px) { .ag-tabs__inner { flex-wrap: wrap; gap: 0; } .ag-tabs__inner nav { flex: 1 1 100%; } }

/* ==========================================================================
   ACCUEIL v3 — réalisations homogènes, livrables, processus, ressources
   ========================================================================== */
/* Réalisations : titre sur 2 lignes réservées → toutes les images alignées */
.ag-slide__title { min-height: 2em; display: flex; align-items: flex-end; font-size: clamp(26px, 3.6vw, 50px); }
.ag-slide__media { aspect-ratio: 16 / 10; }
.ag-slide__media img { object-position: center; }

/* Livrables : pile de documents dessinée en CSS (remplace la photo) */
.ag-proof__img--docs { background: var(--ag-night); display: flex; align-items: center; justify-content: center; padding: 110px 40px 60px; min-height: 520px; }
.ag-proof__img--docs::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(243,243,239,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(243,243,239,.05) 1px, transparent 1px); background-size: 28px 28px; }
.ag-docstack { position: relative; width: min(420px, 82%); aspect-ratio: 4 / 5; }
.ag-doc { position: absolute; inset: 0; background: #fff; box-shadow: 0 30px 60px -30px rgba(0,0,0,.6); padding: 26px 24px; display: flex; flex-direction: column; gap: 14px; border-top: 5px solid var(--c-clients); }
.ag-doc--3 { transform: translate(34px, -34px) rotate(4deg); border-top-color: var(--c-outils); opacity: .92; }
.ag-doc--2 { transform: translate(17px, -17px) rotate(2deg); border-top-color: var(--c-structure); }
.ag-doc--1 { border-top-color: var(--c-clients); }
.ag-doc__kicker { font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ag-ink-soft); }
.ag-doc__title { font-size: 20px; font-weight: 700; letter-spacing: -.03em; line-height: 1.15; color: var(--ag-ink); }
.ag-doc__lines { display: flex; flex-direction: column; gap: 8px; }
.ag-doc__lines i { display: block; height: 7px; border-radius: 4px; background: #E7E7E1; }
.ag-doc__lines i:nth-child(2) { width: 86%; } .ag-doc__lines i:nth-child(3) { width: 64%; } .ag-doc__lines i:nth-child(4) { width: 78%; }
.ag-doc__bars { display: flex; flex-direction: column; gap: 10px; margin-top: 6px; }
.ag-doc__bars i { display: block; height: 14px; border-radius: 2px; background: var(--c-structure); opacity: .85; }
.ag-doc__bars i:nth-child(n+3) { opacity: .35; }
.ag-doc__cols, .ag-doc__chips { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: auto; }
.ag-doc__chips { grid-template-columns: repeat(4, 1fr); }
.ag-doc__cols b, .ag-doc__chips b { font-size: 10px; font-weight: 700; text-align: center; padding: 22px 4px 8px; border-top: 3px solid var(--c-clients); background: #F4F1EE; color: var(--ag-ink); }
.ag-doc__chips b { border-top-color: var(--c-outils); background: #F0F3EF; padding-top: 30px; }
.ag-docs--links li { display: block; padding: 0; grid-template-columns: none; }
.ag-docs--links li::before { display: none; }
.ag-docs--links a { display: grid; grid-template-columns: 44px 1fr 20px; gap: 6px 14px; padding: 16px 0; color: inherit; text-decoration: none; counter-increment: doc; }
.ag-docs--links a::before { content: counter(doc, decimal-leading-zero); font-size: 13px; font-weight: 700; color: var(--ag-accent-deep); padding-top: 3px; grid-row: span 2; }
.ag-docs--links a::after { content: '→'; grid-column: 3; grid-row: 1 / span 2; align-self: center; color: var(--ag-ink-soft); transition: transform .2s ease; }
.ag-docs--links a:hover strong { color: var(--ag-accent-deep); }
.ag-docs--links a:hover::after { transform: translateX(4px); color: var(--ag-ink); }
.ag-docs--links strong { grid-column: 2; }
.ag-docs--links span { grid-column: 2; }

/* Processus : lien par étape + rangée de CTA */
.ag-step__link { display: inline-block; margin-top: 12px; font-size: 14px; font-weight: 700; color: var(--c-lime); text-decoration: none; }
.ag-step__link:hover { text-decoration: underline; text-underline-offset: 3px; }
.ag-process__cta { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; margin-top: 56px; padding-top: 32px; border-top: 1px solid var(--ag-line-night); }

/* Ressources : tuiles de kits */
.ag-subtitle { font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-ink-soft); margin: 56px 0 16px; }
.ag-kit-tiles { display: grid; gap: 8px; grid-template-columns: 1fr; }
@media (min-width: 700px) { .ag-kit-tiles { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .ag-kit-tiles { grid-template-columns: repeat(4, 1fr); } }
.ag-kit-tile { display: flex; flex-direction: column; gap: 8px; padding: 22px; background: #fff; border: 1px solid var(--ag-line); border-top: 3px solid var(--cat, var(--ag-accent)); text-decoration: none; color: var(--ag-ink); transition: transform .2s ease, box-shadow .2s ease; }
.ag-kit-tile:hover { transform: translateY(-2px); box-shadow: 0 16px 30px -22px rgba(20,22,23,.4); }
.ag-kit-tile--clients { --cat: var(--c-clients); } .ag-kit-tile--structure { --cat: var(--c-structure); } .ag-kit-tile--outils { --cat: var(--c-outils); } .ag-kit-tile--depart { --cat: var(--ag-accent); }
.ag-kit-tile__cat { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--cat); }
.ag-kit-tile strong { font-size: 18px; letter-spacing: -.02em; line-height: 1.25; }
.ag-kit-tile__price { margin-top: auto; font-size: 20px; font-weight: 700; letter-spacing: -.02em; }
.ag-kit-tile p { margin: 0; font-size: 14px; line-height: 1.55; color: var(--ag-ink-soft); }

/* ==========================================================================
   HEADER v3 — logo, menu catalogue déroulant, recherche, menu mobile
   ========================================================================== */
#site-header.ag-header { position: fixed; top: 0; left: 0; right: 0; z-index: 50; }
.ag-header__bar { max-width: var(--ag-max); margin: 0 auto; padding: 0 var(--ag-gutter); height: 76px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 24px; }
.ag-logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ag-ink); font-weight: 700; font-size: 18px; letter-spacing: -.03em; white-space: nowrap; }
.ag-logo__mark { width: 14px; height: 14px; border: 2.5px solid currentColor; transform: rotate(45deg); position: relative; }
.ag-logo__mark::after { content: ''; position: absolute; inset: 2px; background: var(--c-lime); }
.ag-nav { display: none; justify-content: center; align-items: center; gap: 4px; }
@media (min-width: 1100px) { .ag-nav { display: flex; } }
.ag-nav__link { display: inline-flex; align-items: center; gap: 4px; padding: 9px 12px; border-radius: 999px; font-size: 14px; font-weight: 600; color: rgba(20,22,23,.72); text-decoration: none; transition: color .2s ease, background-color .2s ease; }
.ag-nav__link:hover { color: var(--ag-ink); background: rgba(20,22,23,.06); }
.ag-nav__link.is-active { color: var(--ag-ink); background: rgba(20,22,23,.08); }
.ag-nav__chevron { width: 12px; height: 12px; transition: transform .2s ease; }
.ag-nav__item { position: relative; }
.ag-nav__menu { position: absolute; top: calc(100% + 10px); left: 50%; transform: translate(-50%, 6px); width: 360px; background: #fff; border: 1px solid var(--ag-line); box-shadow: 0 30px 60px -25px rgba(20,22,23,.35); padding: 10px; opacity: 0; visibility: hidden; transition: opacity .18s ease, transform .18s ease, visibility .18s; }
.ag-nav__menu::before { content: ''; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
.ag-nav__item--menu:hover .ag-nav__menu, .ag-nav__item--menu:focus-within .ag-nav__menu { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.ag-nav__item--menu:hover .ag-nav__chevron, .ag-nav__item--menu:focus-within .ag-nav__chevron { transform: rotate(180deg); }
.ag-nav__menu-item { display: flex; align-items: flex-start; gap: 12px; padding: 12px; text-decoration: none; color: var(--ag-ink); transition: background-color .15s ease; }
.ag-nav__menu-item:hover { background: var(--ag-paper); }
.ag-nav__menu-item strong { display: block; font-size: 14px; }
.ag-nav__menu-item small { display: block; font-size: 12px; color: var(--ag-ink-soft); margin-top: 2px; }
.ag-nav__dot { flex-shrink: 0; width: 9px; height: 9px; border-radius: 50%; margin-top: 5px; background: var(--dot, var(--ag-accent)); }
.ag-nav__menu-item--clients { --dot: var(--c-clients); } .ag-nav__menu-item--structure { --dot: var(--c-structure); } .ag-nav__menu-item--outils { --dot: var(--c-outils); } .ag-nav__menu-item--depart { --dot: var(--ag-accent); }
.ag-nav__menu-all { display: block; margin-top: 6px; padding: 12px; border-top: 1px solid var(--ag-line); font-size: 13px; font-weight: 700; color: var(--ag-accent-deep); text-decoration: none; }
.ag-header__actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.ag-header__search { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; color: var(--ag-ink); border: 1px solid rgba(20,22,23,.15); transition: background-color .2s ease; }
.ag-header__search:hover { background: rgba(20,22,23,.06); }
.ag-header__search svg { width: 17px; height: 17px; }
.ag-header__cta { display: none; padding: 10px 18px; font-size: 14px; font-weight: 700; text-decoration: none; }
@media (min-width: 640px) { .ag-header__cta { display: inline-flex; } }
#burger-btn { background: none; border: 0; padding: 8px; margin-right: -8px; cursor: pointer; }
@media (min-width: 1100px) { #burger-btn { display: none; } }
/* Header clair sur les en-têtes sombres, tant qu'on n'a pas défilé */
body.hero-dark #site-header:not(.header-scrolled) .ag-logo,
body.hero-dark #site-header:not(.header-scrolled) .ag-nav__link,
body.hero-dark #site-header:not(.header-scrolled) .ag-header__search { color: rgba(255,255,255,.9); }
body.hero-dark #site-header:not(.header-scrolled) .ag-nav__link:hover,
body.hero-dark #site-header:not(.header-scrolled) .ag-nav__link.is-active { color: #fff; background: rgba(255,255,255,.1); }
body.hero-dark #site-header:not(.header-scrolled) .ag-header__search { border-color: rgba(255,255,255,.3); }
/* Menu mobile */
#mobile-menu.is-open { max-height: 900px; }
#mobile-menu .mobile-menu-links { max-width: var(--ag-max); margin: 0 auto; padding: 8px var(--ag-gutter); display: flex; flex-direction: column; }
.ag-mobile__link { padding: 14px 0; font-size: 17px; font-weight: 700; color: var(--ag-ink); text-decoration: none; border-bottom: 1px solid var(--ag-line); }
.ag-mobile__sub { display: flex; align-items: center; gap: 10px; padding: 9px 0 9px 14px; font-size: 14px; color: var(--ag-ink-soft); text-decoration: none; border-bottom: 0 !important; }
.ag-mobile__sub .ag-nav__dot { margin-top: 0; }
#mobile-menu .mobile-menu-cta { max-width: var(--ag-max); margin: 0 auto; padding: 16px var(--ag-gutter) 24px; }

/* ==========================================================================
   FOOTER v3
   ========================================================================== */
footer.ag-footer, body.ag footer.ag-footer { background: var(--ag-night-2); color: var(--ag-on-night); margin-top: 0; border: 0; }
.ag-footer__top, .ag-footer__cols, .ag-footer__legal { max-width: var(--ag-max); margin: 0 auto; padding-left: var(--ag-gutter); padding-right: var(--ag-gutter); }
.ag-footer__top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 28px; padding-top: clamp(56px, 7vw, 96px); padding-bottom: 48px; border-bottom: 1px solid var(--ag-line-night); }
.ag-footer__claim { margin: 0; font-size: clamp(34px, 5.4vw, 76px); font-weight: 700; letter-spacing: -.045em; line-height: 1; }
.ag-footer__claim span { color: rgba(243,243,239,.34); }
.ag-footer__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; }
.ag-footer__link-strong { color: #fff; font-weight: 700; font-size: 15px; text-decoration: none; }
.ag-footer__link-strong:hover { text-decoration: underline; text-underline-offset: 3px; }
.ag-footer__cols { display: grid; gap: 32px; grid-template-columns: repeat(2, 1fr); padding-top: 48px; padding-bottom: 48px; }
@media (min-width: 900px) { .ag-footer__cols { grid-template-columns: repeat(4, 1fr); } }
.ag-footer__col { display: flex; flex-direction: column; gap: 4px; }
.ag-footer__title { margin: 0 0 10px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(243,243,239,.5); }
.ag-footer__col a { color: rgba(243,243,239,.82); text-decoration: none; font-size: 14px; padding: 5px 0; }
.ag-footer__col a:hover { color: #fff; }
.ag-footer__cat { display: inline-flex; align-items: center; gap: 9px; }
.ag-footer__cat .ag-nav__dot { margin-top: 0; }
.ag-footer__legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; padding-top: 22px; padding-bottom: 28px; border-top: 1px solid var(--ag-line-night); font-size: 12px; color: rgba(243,243,239,.45); }

/* ==========================================================================
   ARTICLES
   ========================================================================== */
.ag-article-grid { display: grid; gap: 8px; grid-template-columns: 1fr; }
@media (min-width: 760px) { .ag-article-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .ag-article-grid { grid-template-columns: repeat(3, 1fr); } }
.ag-article-card { display: flex; flex-direction: column; gap: 10px; padding: 0 0 22px; background: #fff; border: 1px solid var(--ag-line); text-decoration: none; color: var(--ag-ink); transition: transform .2s ease, box-shadow .2s ease; }
.ag-article-card:hover { transform: translateY(-3px); box-shadow: 0 20px 36px -26px rgba(20,22,23,.45); }
.ag-article-card > *:not(.ag-article-card__img) { margin-left: 22px; margin-right: 22px; }
.ag-article-card__img { aspect-ratio: 16 / 9; overflow: hidden; margin-bottom: 8px; background: var(--ag-paper-2); }
.ag-article-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s cubic-bezier(.16,1,.3,1); }
.ag-article-card:hover .ag-article-card__img img { transform: scale(1.04); }
.ag-article-card__meta { font-size: 12px; font-weight: 600; color: var(--ag-ink-soft); }
.ag-article-card__title { font-size: 21px; letter-spacing: -.03em; line-height: 1.2; }
.ag-article-card__desc { font-size: 14px; line-height: 1.6; color: var(--ag-ink-soft); }
.ag-article__hero { margin: 0 0 clamp(40px, 5vw, 64px); }
.ag-article__hero img { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; display: block; }
.ag-article { max-width: 760px; margin: 0 auto; }
.ag-article p, .ag-article li { font-size: 18px; line-height: 1.8; }
.ag-article h2 { border-top: 0; padding-top: 0; margin-top: 48px; font-size: clamp(24px, 2.4vw, 32px); }
.ag-article figure { margin: 36px 0; }
.ag-article figure img { width: 100%; display: block; }
.ag-article figcaption { font-size: 13px; color: var(--ag-ink-soft); margin-top: 10px; }
.ag-article blockquote { margin: 32px 0; padding: 6px 0 6px 24px; border-left: 3px solid var(--c-clients); }
.ag-article blockquote p { font-size: 22px; line-height: 1.5; font-weight: 600; letter-spacing: -.02em; color: var(--ag-ink); margin: 0; }
.ag-article__author { max-width: 760px; margin: 40px auto 0; padding-top: 20px; border-top: 1px solid var(--ag-line); }
/* Livrables : la carte de texte chevauche la colonne visuelle de 18 % → on décale la pile */
@media (min-width: 1000px) {
  .ag-proof__img--docs { justify-content: flex-start; padding-left: 9%; padding-right: 26%; }
  .ag-docstack { width: min(360px, 100%); }
}
/* Tailwind (preflight) supprime puces et numéros : on les rétablit dans les textes longs */
.ag-prose ul { list-style: disc; }
.ag-prose ol { list-style: decimal; }
.ag-prose li::marker { color: var(--ag-accent-deep); font-weight: 700; }

/* ==========================================================================
   v4 — cartes sans liseré, couleur de besoin alignée sur le catalogue,
   guide de navigation latéral
   ========================================================================== */
/* Catalogue : plus de liseré de couleur en haut des cartes */
.ag-cat-block .ag-product { border-top: 1px solid var(--ag-line); }
.ag-cat-block .ag-product--sub { border-top-color: var(--ag-night); }
/* Cartes et formules des autres pages : même traitement, sans liseré */
.ag-card, .ag-section:not(.ag-dark):not(.ag-darker) .ag-card { border-top: 1px solid var(--ag-line); }
.ag-dark .ag-card, .ag-darker .ag-card { border-top-color: var(--ag-line-night); }
.ag-plan { border-top: 1px solid var(--ag-line-night); }
/* Couleur de besoin portée par la page (COO = structurer, Growth = clients) ou par la carte (Missions) */
body.ag-cat--clients, body.ag-cat--structure, body.ag-cat--outils { --cat-light: color-mix(in srgb, var(--cat) 55%, white); }
body[class*="ag-cat--"] .ag-card__num { color: var(--cat); }
body[class*="ag-cat--"] .ag-dark .ag-card__num, body[class*="ag-cat--"] .ag-darker .ag-card__num { color: var(--cat-light, #fff); }
body[class*="ag-cat--"] .ag-plan__name, body[class*="ag-cat--"] .ag-plan__sub { color: var(--cat-light, var(--ag-on-night-soft)); }
body[class*="ag-cat--"] .ag-list li::before, body[class*="ag-cat--"] .ag-plan .ag-list li::before { background: var(--cat); }
body[class*="ag-cat--"] .ag-page-hero .ag-label::before { background: var(--cat-light, var(--c-lime)); }
.ag-product[class*="ag-cat--"] ul li::before { background: var(--cat); }
.ag-cat-chip { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; text-decoration: none; color: var(--dot); }
.ag-cat-chip:hover { text-decoration: underline; text-underline-offset: 3px; }
.ag-pill .ag-nav__dot { width: 8px; height: 8px; }

/* Guide de navigation latéral (#scroll-dots, piloté par site.js) */
#scroll-dots { position: fixed; right: 16px; top: 50%; transform: translateY(-50%); z-index: 40; display: none; flex-direction: column; gap: 2px; padding: 10px 7px; border-radius: 999px; background: rgba(246,246,243,.85); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid var(--ag-line); box-shadow: 0 10px 30px -18px rgba(20,22,23,.45); }
@media (min-width: 1200px) { #scroll-dots { display: flex; } }
#scroll-dots .scroll-dot { position: relative; display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; text-decoration: none; }
#scroll-dots .scroll-dot > span:first-child { display: block; width: 7px; height: 7px; border-radius: 50%; background: rgba(20,22,23,.28); transition: transform .2s ease, background-color .2s ease; }
#scroll-dots .scroll-dot:hover > span:first-child { background: var(--ag-ink); }
#scroll-dots .scroll-dot.is-active > span:first-child { background: var(--ag-accent-deep); transform: scale(1.6); }
#scroll-dots .dot-label { position: absolute; right: 34px; top: 50%; transform: translateY(-50%); white-space: nowrap; font-size: 12px; font-weight: 600; color: var(--ag-ink); background: #fff; padding: 4px 10px; border-radius: 999px; box-shadow: 0 6px 16px -8px rgba(20,22,23,.35); opacity: 0; pointer-events: none; transition: opacity .18s ease; }
#scroll-dots:hover .dot-label, #scroll-dots .scroll-dot:focus-visible .dot-label { opacity: 1; }
#scroll-dots .scroll-dot.is-active .dot-label { font-weight: 800; color: var(--ag-accent-deep); }
#scroll-dots .scroll-dot:focus-visible { outline: 2px solid var(--ag-accent); outline-offset: 2px; border-radius: 50%; }

/* ==========================================================================
   v5 — passe UI/UX (règles ui-ux-pro-max) + preuves + sprint 1
   ========================================================================== */
/* U1 contraste : fins de titre et textes secondaires (≥ 4,5:1 texte, ≥ 3:1 grands titres) */
:root { --ag-ink-soft: rgba(20, 22, 23, .7); --ag-on-night-soft: rgba(243, 243, 239, .68); }
.ag-grey-tail-light, .ag-grey-tail-light * { color: rgba(20, 22, 23, .52); }
.ag-grey-tail, .ag-page-hero h1 .ag-grey-tail, .ag-hero__h1 .ag-grey-tail { color: rgba(243, 243, 239, .55); }
.ag-cta-band h2 span, .ag-footer__claim span { color: rgba(243, 243, 239, .55); }
.ag-footer__legal { color: rgba(243, 243, 239, .62); }
.ag-footer__title { color: rgba(243, 243, 239, .66); }
.ag-marquee-caption, .ag-note { color: rgba(20, 22, 23, .66); }

/* U2 lien d'évitement */
.ag-skip { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 10px 16px; background: var(--ag-ink); color: #fff; font-weight: 700; font-size: 14px; border-radius: 999px; text-decoration: none; transition: top .15s ease; }
.ag-skip:focus { top: 12px; outline: 2px solid var(--c-lime); outline-offset: 2px; }
/* U3 focus visible partout (3:1 minimum) */
body.ag :where(a, button, summary, input, select, textarea, [tabindex]):focus-visible { outline: 2px solid var(--ag-accent); outline-offset: 3px; }
body.ag :where(.ag-dark, .ag-darker, .ag-page-hero, .ag-hero, .ag-footer, .ag-cta-band) :where(a, button, summary):focus-visible { outline-color: var(--c-lime); }
/* U4 ancres non masquées par le header fixe */
body.ag [id] { scroll-margin-top: 96px; }
/* U6 titres équilibrés, U7 chiffres tabulaires */
.ag-h1, .ag-h2, .ag-h3, .ag-page-hero h1, .ag-cta-band h2, .ag-product h3, .ag-card h3 { text-wrap: balance; }
.ag-text p, .ag-lead, .ag-product p { text-wrap: pretty; }
.ag-price, .ag-plan__price, .t-price, .ag-kit-tile__price, .ag-rating strong { font-variant-numeric: tabular-nums; }
/* U8 images avec width/height : hauteur calculée par le CSS */
:where(img[height]) { height: auto; }
/* U9 curseur et délai tactile */
body.ag :where(button, summary, [role="button"], label[for]) { cursor: pointer; }
body.ag :where(a, button, summary) { touch-action: manipulation; }
/* U10 longueur de ligne */
.ag-text p, .ag-lead, .ag-page-hero__side p { max-width: 68ch; }
.ag-split-head__right .ag-lead { margin-left: auto; }

/* S1.1 hero : libellé au-dessus du titre */
.ag-hero__top .ag-label { color: var(--ag-on-night); margin-bottom: 22px; }

/* S1.7 autorité : logos de carrière + ContrasteBTP */
.ag-authority { display: grid; gap: 18px 32px; grid-template-columns: 1fr; align-items: center; margin-top: 40px; padding: 22px 0; border-top: 1px solid var(--ag-line); }
@media (min-width: 1000px) { .ag-authority { grid-template-columns: 1fr auto; } }
.ag-authority__cap { grid-column: 1 / -1; margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ag-ink-soft); }
.ag-authority__logos { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 34px; }
.ag-authority__logos img { height: 30px; width: auto; max-width: 110px; object-fit: contain; filter: grayscale(1); opacity: .72; }
.ag-authority__stat { display: flex; align-items: center; gap: 12px; padding: 12px 18px; border: 1px solid var(--ag-line); background: #fff; text-decoration: none; color: var(--ag-ink); }
.ag-authority__stat strong { font-size: 30px; letter-spacing: -.04em; color: var(--ag-accent-deep); }
.ag-authority__stat span { font-size: 13px; line-height: 1.4; max-width: 220px; color: var(--ag-ink-soft); }

/* S2.8 visage près des CTA */
.ag-float-card { align-items: center; }
.ag-float-card__face { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; border: 2px solid rgba(255,255,255,.7); flex-shrink: 0; align-self: flex-start; }
.ag-sign { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
.ag-sign img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; border: 2px solid var(--c-lime); }
.ag-sign strong { display: block; color: #fff; font-size: 16px; }
.ag-sign span { font-size: 13px; color: var(--ag-on-night-soft); }

/* S2.1 / S2.2 avis */
.ag-stars { display: inline-flex; gap: 2px; color: #E0A526; }
.ag-stars svg { width: 16px; height: 16px; }
.ag-reviews { background: var(--ag-paper-2); }
.ag-rating { display: inline-flex; align-items: center; gap: 10px; padding: 12px 18px; background: #fff; border: 1px solid var(--ag-line); text-decoration: none; color: var(--ag-ink); justify-self: end; }
.ag-rating strong { font-size: 26px; letter-spacing: -.03em; }
.ag-rating span:last-child { font-size: 13px; color: var(--ag-ink-soft); }
.ag-quotes { display: grid; gap: 8px; grid-template-columns: 1fr; margin-top: 44px; }
@media (min-width: 900px) { .ag-quotes { grid-template-columns: 1fr 1fr; } }
.ag-quote { margin: 0; padding: 32px 30px; background: #fff; border: 1px solid var(--ag-line); display: flex; flex-direction: column; justify-content: space-between; gap: 24px; }
.ag-quote blockquote { margin: 0; }
.ag-quote blockquote p { margin: 0; font-size: clamp(19px, 1.7vw, 23px); line-height: 1.45; font-weight: 600; letter-spacing: -.02em; }
.ag-quote figcaption { display: flex; flex-direction: column; gap: 8px; font-size: 13px; color: var(--ag-ink-soft); }
.ag-quote figcaption strong { color: var(--ag-ink); }
.ag-proofbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-bottom: 40px; padding: 16px 20px; background: #fff; border: 1px solid var(--ag-line); text-decoration: none; color: var(--ag-ink); }
.ag-proofbar strong { font-size: 15px; }
.ag-proofbar span:last-child { flex: 1 1 320px; font-size: 14px; color: var(--ag-ink-soft); font-style: italic; }

/* S1.11 recommandé, S1.8 bientôt */
.ag-product--reco { box-shadow: 0 0 0 2px var(--cat, var(--ag-accent)); border-color: transparent; }
.ag-reco { align-self: flex-start; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; background: var(--cat, var(--ag-accent)); color: #fff; }
.ag-product--sub.ag-product--reco { box-shadow: 0 0 0 2px var(--c-lime); }
.ag-product--sub .ag-reco { background: var(--c-lime); color: var(--ag-ink); }
[data-ag-soon] .ag-price { color: var(--ag-ink-soft); }
[data-ag-soon] .ag-product__foot > span { font-weight: 700; color: var(--cat, var(--ag-accent-deep)); }

/* S5.2 sélecteur de besoin */
.ag-needsel { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 34px; }
.ag-needsel__label { font-size: 13px; font-weight: 700; color: rgba(255,255,255,.8); margin-right: 6px; }
.ag-needsel button { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,.3); background: transparent; color: #fff; font: inherit; font-size: 14px; font-weight: 600; }
.ag-needsel button .ag-nav__dot { margin-top: 0; }
.ag-needsel button:hover { background: rgba(255,255,255,.08); }
.ag-needsel button[aria-pressed="true"] { background: #fff; color: var(--ag-ink); border-color: #fff; }
body[data-need="clients"] .ag-cat-block:not(#clients):not(#conditions),
body[data-need="structure"] .ag-cat-block:not(#structure):not(#conditions),
body[data-need="outils"] .ag-cat-block:not(#outils):not(#conditions) { display: none; }
/* Guide latéral : le contenu ne passe jamais dessous (≥ 1200 px, pages qui l'affichent) */
@media (min-width: 1200px) {
  body:has(#scroll-dots) .ag-wrap { padding-right: max(var(--ag-gutter), 64px); }
}
.ag-examples { margin: 22px 0 0; font-size: 14px; color: var(--ag-ink-soft); }
.ag-examples a { color: var(--ag-accent-deep); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.ag-badge--start { background: var(--c-lime); color: var(--ag-ink); }
/* Liste d'attente des kits « Bientôt » (formulaire inline, agence.js) */
.ag-waitlist { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--ag-line); display: grid; gap: 8px; }
.ag-waitlist label { font-size: 13px; font-weight: 600; color: var(--ag-ink); }
.ag-waitlist__row { display: flex; gap: 6px; }
.ag-waitlist input[type=email] { flex: 1; min-width: 0; min-height: 44px; padding: 0 12px; border: 1px solid var(--ag-line); border-radius: 999px; font: inherit; font-size: 14px; background: #fff; color: var(--ag-ink); }
.ag-waitlist input[type=email]:focus-visible { outline: 2px solid var(--ag-accent); outline-offset: 1px; }
.ag-waitlist button { min-height: 44px; padding: 0 16px; border: 0; border-radius: 999px; background: var(--ag-ink); color: #fff; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.ag-waitlist button:disabled { opacity: .6; cursor: wait; }
.ag-waitlist__msg { margin: 0; font-size: 12px; color: var(--ag-ink-soft); }
.ag-waitlist.is-error .ag-waitlist__msg { color: #B42318; }
.ag-waitlist.is-error input[type=email] { border-color: #B42318; }
.ag-waitlist__done { margin: 0; font-size: 14px; font-weight: 600; color: var(--c-outils); }

/* ==========================================================================
   v6 — Passe mobile (audit du 26/09/2026, 390 px et 320 px)
   ========================================================================== */
/* Tableaux : défilement horizontal interne plutôt que débordement de la page */
@media (max-width: 700px) {
  .ag-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .ag-table th, .ag-table td { min-width: 150px; }
}
/* Colonnes du catalogue : l'intitulé passe à la ligne sur les très petits écrans */
.ag-level__head { flex-wrap: wrap; gap: 2px 12px; }

@media (max-width: 767px) {
  /* Champs à 16 px : iOS ne zoome plus au focus */
  input:not([type=checkbox]):not([type=radio]), select, textarea { font-size: 16px !important; }

  /* Cibles tactiles ≥ 44 px (WCAG 2.5.8 / recommandations Apple) */
  #burger-btn { min-width: 44px; min-height: 44px; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; }
  .ag-header__search { width: 44px; height: 44px; }
  .ag-mobile__sub { min-height: 44px; padding-top: 0; padding-bottom: 0; }
  .ag-footer__col a { display: flex; align-items: center; min-height: 44px; padding: 0; }
  .ag-footer__link-strong, .ag-back, .ag-cat-chip { display: inline-flex; align-items: center; min-height: 44px; }
  .ag-dots { gap: 2px; }
  .ag-dots button { width: 24px; height: 44px; background: transparent !important; }
  .ag-dots button::after { content: ''; position: absolute; left: 7px; top: 17px; width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.35); }
  .ag-dots button.is-active::after { background: #fff; }
  .faq-item summary, details > summary { min-height: 44px; }

  /* Textes : 12 px minimum */
  .ag-tag, .ag-badge, .ag-tiers .t-level, .ag-entry .e-kicker, .ag-kit-tile__cat, .ag-cat-chip { font-size: 12px; }

  /* Accueil — carte « Diagnostic » sous le visuel : flèche sous le texte, colonne pleine largeur */
  .ag-float-card { flex-wrap: wrap; align-items: flex-start; gap: 16px; padding: 24px; }
  .ag-float-card span.ag-small { max-width: none; }

  /* Accueil — réalisations : titre au-dessus de l'image (plus de chevauchement) */
  .ag-slide__title { margin: 0 0 12px; min-height: 0; font-size: 26px; line-height: 1.1; }
  .ag-slide__meta { align-items: flex-start; }
  .ag-slide__meta .ag-link { white-space: nowrap; flex-shrink: 0; }
  .ag-projects__foot { margin-top: 28px; gap: 16px; }
  .ag-vline { display: none; }

  /* Accueil — libellé « Livrables » lisible sur la photo claire */
  .ag-proof__img .ag-label { background: rgba(17,19,20,.72); padding: 6px 12px; border-radius: 999px; top: 20px; }
  .ag-proof__img { min-height: 260px; }

  /* Catalogue : barre onglets + recherche non collante sur mobile (le header l'est déjà ;
     les deux ensemble occupaient près d'un quart de l'écran) */
  .ag-tabs { position: static; }

  /* À propos — encart 1 % for the Planet : logo au-dessus du texte */
  .ag-callout[style*="display:flex"] { flex-direction: column; align-items: flex-start !important; }
}
/* v6 — compléments de la seconde mesure mobile */
@media (max-width: 767px) {
  #burger-btn { margin-right: -6px; }
  .ag-logo { min-height: 44px; }
  .ag-needsel button, .ag-tabs a, .ag-pill { min-height: 44px; }
  .ag-tabs a { display: inline-flex; align-items: center; }
  .ag-step__link { display: inline-flex; align-items: center; min-height: 44px; margin-top: 4px; }
  .ag-reco, .ag-subhead, .ag-qty__label { font-size: 12px; }
}
@media (max-width: 360px) {
  .ag-level, .ag-level > * { min-width: 0; }
  .ag-levels { grid-template-columns: minmax(0, 1fr) !important; }
}
@media (max-width: 767px) { #burger-btn { margin-right: 0; } }
@media (max-width: 360px) { .ag-product__top { flex-wrap: wrap; row-gap: 4px; } }

/* ==========================================================================
   v7 — Thème clair (27/09/2026) : heros des pages intérieures et CTA finaux
   clairs. Seul le hero de l'accueil reste sombre (signature de la marque) ;
   une seule bande sombre au plus par page, plus le pied de page.
   ========================================================================== */
.ag-page-hero { background: var(--ag-paper-2); color: var(--ag-ink); border-bottom: 1px solid var(--ag-line); }
.ag-page-hero::before { background: radial-gradient(closest-side, color-mix(in srgb, var(--cat, var(--ag-accent)) 14%, transparent), transparent 72%) !important; opacity: 1; }
.ag-page-hero .ag-label { color: var(--cat, var(--ag-accent-deep)); }
.ag-page-hero .ag-label::before,
body[class*="ag-cat--"] .ag-page-hero .ag-label::before { background: var(--cat, var(--ag-accent)); }
.ag-page-hero h1 { color: var(--ag-ink); }
.ag-page-hero h1 .ag-grey-tail, .ag-page-hero .ag-grey-tail { color: rgba(20, 22, 23, .4); }
.ag-page-hero__side p { color: var(--ag-ink-soft); }
.ag-page-hero .ag-pill { border-color: rgba(20, 22, 23, .2); color: var(--ag-ink); background: rgba(255, 255, 255, .55); }
.ag-page-hero .ag-pill:hover { background: #fff; }
.ag-page-hero .ag-back { color: var(--ag-ink-soft); }
.ag-page-hero .ag-back:hover { color: var(--ag-ink); }
.ag-needsel__label { color: var(--ag-ink-soft); }
.ag-page-hero .ag-needsel button { border-color: rgba(20, 22, 23, .18); color: var(--ag-ink); background: rgba(255, 255, 255, .6); }
.ag-page-hero .ag-needsel button:hover { background: #fff; }
.ag-page-hero .ag-needsel button[aria-pressed="true"] { background: var(--ag-ink); color: #fff; border-color: var(--ag-ink); }
.ag-page-hero :where(a, button, summary):focus-visible { outline-color: var(--ag-accent); }

/* CTA final : bande claire teintée de lime, bouton sombre */
.ag-cta-band { background: color-mix(in srgb, var(--c-lime) 22%, var(--ag-paper)); color: var(--ag-ink); border-top: 1px solid var(--ag-line); }
.ag-cta-band h2 span, .ag-cta-band .ag-grey-tail { color: rgba(20, 22, 23, .45); }
.ag-cta-band .ag-label { color: var(--ag-accent-deep); }
.ag-cta-band .ag-label::before { background: var(--ag-accent-deep); }
.ag-cta-band .ag-btn--light { background: var(--ag-ink); color: #fff; }
.ag-cta-band .ag-btn--light:hover { background: #000; }
.ag-cta-band .ag-btn--light .ag-arrow { background: var(--c-lime); color: var(--ag-ink); }
.ag-cta-band .ag-link { color: var(--ag-ink) !important; }
.ag-cta-band .ag-link .ag-arrow { background: var(--ag-ink); color: #fff; }
.ag-cta-band :where(a, button):focus-visible { outline-color: var(--ag-accent); }
/* Accueil : bloc contact sur le même modèle */
.ag-cta-band .ag-contact address { color: var(--ag-ink-soft); }
.ag-cta-band .ag-contact address a { color: var(--ag-ink); }
.ag-cta-band .ag-sign strong { color: var(--ag-ink); }
.ag-cta-band .ag-sign span { color: var(--ag-ink-soft); }

/* Bandes secondaires repassées en clair (cas clients, à propos, growth) */
.ag-section.ag-soft { background: var(--ag-paper-2); color: var(--ag-ink); }
.ag-soft .ag-horizon { border-top-color: var(--ag-ink); }
.ag-soft .ag-horizon__label, .ag-soft .ag-gallery figcaption span { color: var(--ag-ink-soft); }
.ag-soft .ag-list li { border-bottom-color: var(--ag-line); }
.ag-soft .ag-list li::before { background: var(--ag-ink); }
.ag-soft .ag-grey-tail { color: rgba(20, 22, 23, .4); }

/* ==========================================================================
   v8 — Réalisations sans clignotement, avis en défilement dès 4 avis
   ========================================================================== */
.ag-projects__bg { opacity: 0; transition: opacity .7s ease; will-change: opacity; }
.ag-projects__bg.is-on { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .ag-projects__bg { transition: none; } }
/* À partir du 4e avis, la grille devient une bande à faire défiler (glisser au doigt,
   molette ou clavier), sans rien changer au HTML : il suffit d'ajouter une <figure>. */
.ag-quotes:has(> .ag-quote:nth-child(4)) {
  display: grid; grid-auto-flow: column; grid-auto-columns: min(420px, 86%);
  grid-template-columns: none; overflow-x: auto; scroll-snap-type: x mandatory;
  gap: 16px; padding-bottom: 12px; scrollbar-width: thin;
}
.ag-quotes:has(> .ag-quote:nth-child(4)) > .ag-quote { scroll-snap-align: start; }
.ag-card__org { margin: -6px 0 0; font-size: 13px; font-weight: 600; color: var(--ag-ink-soft); }
/* À propos — formations et certifications : logos des organismes */
.ag-card--cert { gap: 10px; }
.ag-card__logos { display: flex; align-items: center; gap: 14px; min-height: 40px; margin-bottom: 6px; flex-wrap: wrap; }
.ag-card__logos img { height: 28px; width: auto; max-width: 140px; object-fit: contain; }
.ag-monogram { display: inline-flex; align-items: center; min-height: 32px; padding: 4px 12px; border: 1.5px solid var(--ag-ink); font-size: 13px; font-weight: 800; letter-spacing: .02em; color: var(--ag-ink); }
/* Accueil — logos des donneurs d'ordre : bande qui défile en continu */
.ag-logo-marquee { display: block !important; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.ag-logo-marquee__track { display: flex; width: max-content; animation: ag-logo-scroll 45s linear infinite; }
.ag-logo-marquee:hover .ag-logo-marquee__track { animation-play-state: paused; }
.ag-logo-marquee__set { display: flex; align-items: center; gap: 56px; padding-right: 56px; }
.ag-logo-marquee__set img { height: 36px; width: auto; max-width: 140px; object-fit: contain; flex-shrink: 0; }
@keyframes ag-logo-scroll { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .ag-logo-marquee { -webkit-mask-image: none; mask-image: none; }
  .ag-logo-marquee__track { animation: none; width: auto; }
  .ag-logo-marquee__set { flex-wrap: wrap; gap: 24px 40px; }
  .ag-logo-marquee__set[aria-hidden] { display: none; }
}

/* ==========================================================================
   v8 — Diagnostic 360° : questionnaire aligné sur le reste du site
   (cartes numérotées, sélection noire, boutons en pilule, accent pétrole foncé)
   ========================================================================== */
body.ag .ag-diag { border-radius: 0 !important; border-color: var(--ag-line) !important; box-shadow: 0 30px 60px -45px rgba(20, 22, 23, .35) !important; }
body.ag .ag-diag #qblock-label, body.ag .ag-diag #report-eyebrow { color: var(--ag-accent-deep); letter-spacing: .08em; }
body.ag .ag-diag #qblock-pillar-label { color: var(--ag-ink); font-weight: 600; }
body.ag .ag-diag #qblock-bar { background: var(--ag-accent-deep); }
/* Une carte par question, numérotée 01 à 15 sur les cinq blocs */
body.ag .ag-diag .qblock { counter-reset: q 0; display: grid; gap: 10px; }
body.ag .ag-diag .qblock[data-qblock="2"] { counter-reset: q 3; }
body.ag .ag-diag .qblock[data-qblock="3"] { counter-reset: q 6; }
body.ag .ag-diag .qblock[data-qblock="4"] { counter-reset: q 9; }
body.ag .ag-diag .qblock[data-qblock="5"] { counter-reset: q 12; }
body.ag .ag-diag .qblock[hidden] { display: none; }
body.ag .ag-diag .qblock > div { counter-increment: q; position: relative; margin: 0 !important; padding: 22px 24px 20px 64px; background: var(--ag-paper); border: 1px solid var(--ag-line); transition: border-color .2s ease; }
body.ag .ag-diag .qblock > div:has(input:checked) { border-color: rgba(20, 22, 23, .28); background: #fff; }
body.ag .ag-diag .qblock > div::before { content: counter(q, decimal-leading-zero); position: absolute; left: 22px; top: 22px; font-size: 13px; font-weight: 800; color: var(--ag-accent-deep); font-variant-numeric: tabular-nums; }
body.ag .ag-diag .qblock p { font-size: 15px !important; font-weight: 600 !important; color: var(--ag-ink) !important; line-height: 1.5; margin-bottom: 16px !important; }
body.ag .ag-diag .qblock > div { min-width: 0; }
@media (max-width: 560px) {
  body.ag .ag-diag { padding: 20px 14px !important; }
  body.ag .ag-diag .qblock > div { padding: 44px 12px 16px; }
  body.ag .ag-diag .qblock > div::before { left: 12px; top: 16px; }
}
@media (max-width: 400px) {
  body.ag .ag-diag .likert-btn { width: 36px !important; height: 36px !important; font-size: 13px; }
  body.ag .ag-diag .likert > div { gap: 6px !important; }
  body.ag .ag-diag .likert > div + div { font-size: 11px; }
}
/* Échelle 1 à 5 */
body.ag .ag-diag .likert-btn { border: 1.5px solid rgba(20, 22, 23, .18) !important; color: var(--ag-ink) !important; background: #fff !important; box-shadow: none !important; font-variant-numeric: tabular-nums; }
body.ag .ag-diag label:hover .likert-btn { border-color: var(--ag-ink) !important; }
body.ag .ag-diag .peer:checked + .likert-btn { background: var(--ag-ink) !important; border-color: var(--ag-ink) !important; color: #fff !important; transform: none !important; }
body.ag .ag-diag .peer:focus-visible + .likert-btn { outline: 2px solid var(--ag-accent); outline-offset: 3px; }
body.ag .ag-diag .likert > div > div.absolute { background: var(--ag-line); }
/* Boutons : pilules comme sur le reste du site */
body.ag .ag-diag .cta-btn { border-radius: 999px !important; background: var(--ag-ink) !important; color: #fff !important; min-height: 48px; padding-left: 26px !important; padding-right: 26px !important; }
body.ag .ag-diag .cta-btn:not(:disabled):hover { background: #000 !important; }
body.ag .ag-diag button.border { border-radius: 999px !important; min-height: 48px; }
/* Champs et choix */
body.ag .ag-diag input[type=text], body.ag .ag-diag input[type=email], body.ag .ag-diag input[type=tel], body.ag .ag-diag select, body.ag .ag-diag textarea { border-radius: 12px !important; border: 1px solid rgba(20, 22, 23, .2) !important; background: #fff; }
body.ag .ag-diag input:focus, body.ag .ag-diag select:focus, body.ag .ag-diag textarea:focus { border-color: var(--ag-ink) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--ag-accent) 22%, transparent) !important; }
body.ag .ag-diag .peer:checked + span.block { border-color: var(--ag-ink) !important; background: var(--ag-ink) !important; color: #fff !important; }
body.ag .ag-diag span.block { border-radius: 12px !important; border-width: 1px !important; }
body.ag .ag-diag .capture-progress-dot.is-active { background: var(--ag-accent-deep); }
body.ag .ag-diag .capture-progress-dot.is-done { background: color-mix(in srgb, var(--ag-accent-deep) 45%, transparent); }
/* Étapes du tunnel au-dessus de la carte */
.ag-diag-steps .progress-step { color: var(--ag-ink-soft); }
.ag-diag-steps .progress-step.is-active { color: var(--ag-ink); }
.ag-diag-steps .progress-step.is-active .progress-dot { background-color: var(--ag-accent-deep); }
/* Fin du rapport : même suite pour tous, un échange */
.ag-diag__next-title { font-size: 22px; font-weight: 700; letter-spacing: -.02em; margin: 0 0 8px; color: var(--ag-ink); }
.ag-diag__next-text { max-width: 52ch; margin: 0 auto 22px; color: var(--ag-ink-soft); font-size: 15px; line-height: 1.6; }
.ag-diag__alt { margin: 14px 0 0; font-size: 14px; }
.ag-diag__alt a { color: var(--ag-ink); font-weight: 600; text-underline-offset: 3px; }
/* Ressources gratuites : ce que contient l'outil, avant la capture d'email */
.ag-gate-intro { display: grid; gap: 24px 48px; grid-template-columns: 1fr; margin: 0 0 32px; padding: 32px; background: #fff; border: 1px solid var(--ag-line); }
@media (min-width: 900px) { .ag-gate-intro { grid-template-columns: 1.4fr 1fr; } }
.ag-gate-intro__title { margin: 0 0 14px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--cat, var(--ag-accent-deep)); }
.ag-gate-intro__meta { margin: 0; display: grid; gap: 16px; align-content: start; }
.ag-gate-intro__meta dt { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ag-ink-soft); }
.ag-gate-intro__meta dd { margin: 4px 0 0; font-size: 15px; line-height: 1.55; color: var(--ag-ink); }
.ag-list--check li::before { content: '✓'; background: none !important; width: auto; height: auto; color: var(--ag-accent); font-weight: 800; }
.ag-card__logos img.ag-logo--tall { height: 48px; margin: -10px 0; }