@font-face { font-family: "Inter"; src: url("../fonts/inter-var-latin.woff") format("woff"); font-weight: 100 900; font-style: normal; font-display: swap; }

/* SCS Ambition Group — Design Tokens
   Triptyque : blanc · noir #1C1F1F · rouge crimson #E73133
   Fonds : blanc ou blush #FFF2F1 (principal), crimson ou noir (occasionnel)
   Dégradé signature : #9F1417 → #E73133 → #FFF2F1 */


:root {
  /* ---------- Triptyque ---------- */
  --color-white: #FFFFFF;
  --color-ink: #1C1F1F;
  --color-crimson: #E73133;

  /* ---------- Nuances de rouge ---------- */
  --color-red-50: #FFF2F1;   /* blush — fond principal */
  --color-red-100: #FFE1DF;
  --color-red-200: #FFA2A2;  /* rose */
  --color-red-400: #EF3D3D;
  --color-red-500: #E73133;  /* crimson */
  --color-red-700: #9F1417;  /* deep */
  --color-red-800: #68000B;
  --color-red-900: #490608;

  /* ---------- Gris ---------- */
  --color-grey-50: #F6F6F6;
  --color-grey-100: #ECECEC;
  --color-grey-200: #D9DADA;
  --color-grey-400: #9A9D9D;
  --color-grey-500: #6B6F6F;
  --color-grey-700: #3F4242;
  --color-grey-900: #1C1F1F;
  --color-steel: #BACCD9;    /* accent froid, usage rare */

  /* ---------- Sous-marques (usage limité à leurs supports) ---------- */
  --color-mb-navy: #1D3A4F;
  --color-ps-blue: #1B3A8C;
  --color-ps-yellow: #F5C400;
  --color-india-navy: #253880;

  /* ---------- Sémantique ---------- */
  --fg-primary: var(--color-ink);
  --fg-secondary: var(--color-grey-500);
  --fg-muted: var(--color-grey-400);
  --fg-inverted: var(--color-white);
  --fg-accent: var(--color-crimson);

  --bg-base: var(--color-white);
  --bg-blush: var(--color-red-50);
  --bg-subtle: var(--color-grey-50);
  --bg-brand: var(--color-crimson);
  --bg-dark: var(--color-ink);

  --border-default: var(--color-grey-100);
  --border-blush: var(--color-red-100);
  --border-strong: var(--color-grey-400);
  --border-brand: var(--color-crimson);

  --interactive-primary: var(--color-crimson);
  --interactive-primary-hover: var(--color-red-700);
  --interactive-primary-press: var(--color-red-800);
  --interactive-secondary: var(--color-ink);
  --interactive-secondary-hover: var(--color-grey-700);

  /* ---------- Dégradés ---------- */
  --gradient-signature: linear-gradient(90deg, #9F1417 0%, #E73133 50%, #FFF2F1 100%); /* @kind other */
  --gradient-signature-v: linear-gradient(180deg, #9F1417 0%, #E73133 50%, #FFF2F1 100%); /* @kind other */
  --gradient-deep: linear-gradient(135deg, #9F1417 0%, #E73133 100%); /* @kind other */
  --gradient-blush: linear-gradient(90deg, #FFF2F1 0%, #FFF2F1 35%, #9F1417 100%); /* @kind other */
  --gradient-fade: linear-gradient(180deg, #FFFFFF 0%, #FFF2F1 100%); /* @kind other */

  /* ---------- Patterns ---------- */
  --pattern-arcs: url('img/02-1ff8ffbf47.png'); /* @kind other */
  --pattern-logo: url('img/03-b007b77ff9.webp'); /* @kind other */
  --pattern-fade-down: linear-gradient(180deg, #000 0%, transparent 80%); /* @kind other */
  --pattern-fade-right: linear-gradient(90deg, #000 0%, transparent 85%); /* @kind other */
  --pattern-fade-radial: radial-gradient(circle at 30% 30%, #000 0%, transparent 70%); /* @kind other */

  /* ---------- Typo ---------- */
  --font-display: 'Inter', sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-label: 'Inter', sans-serif;
  --font-mono: ui-monospace, 'SF Mono', Menlo, monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 4rem;
  --text-7xl: 5rem;

  --h-display-family: var(--font-display);
  --h-display-size: var(--text-7xl);
  --h-display-weight: 800;
  --h-display-tracking: -0.03em; /* @kind other */
  --h-display-line: 0.95; /* @kind other */
  --h1-family: var(--font-display);
  --h1-size: var(--text-5xl);
  --h1-weight: 700;
  --h1-tracking: -0.02em; /* @kind other */
  --h1-line: 1.05; /* @kind other */
  --h2-family: var(--font-display);
  --h2-size: var(--text-4xl);
  --h2-weight: 700;
  --h2-tracking: -0.015em; /* @kind other */
  --h2-line: 1.1; /* @kind other */
  --h3-family: var(--font-body);
  --h3-size: var(--text-2xl);
  --h3-weight: 600;
  --h3-line: 1.25; /* @kind other */
  --body-family: var(--font-body);
  --body-size: var(--text-base);
  --body-weight: 400;
  --body-line: 1.6; /* @kind other */
  --label-family: var(--font-label);
  --label-size: var(--text-xs);
  --label-weight: 600;
  --label-tracking: 0.14em; /* @kind other */

  /* ---------- Espacement ---------- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* ---------- Rayons (le cercle est la signature) ---------- */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 9999px;

  /* ---------- Ombres (teintées rouge) ---------- */
  --shadow-sm: 0 1px 3px rgba(159,20,23,0.08), 0 1px 2px rgba(28,31,31,0.04);
  --shadow-md: 0 6px 18px rgba(159,20,23,0.10), 0 2px 4px rgba(28,31,31,0.04);
  --shadow-lg: 0 16px 40px rgba(159,20,23,0.14), 0 4px 8px rgba(28,31,31,0.05);
  --shadow-brand: 0 10px 28px rgba(231,49,51,0.35);

  --transition-fast: 150ms ease; /* @kind other */
  --transition-normal: 250ms ease; /* @kind other */
  --z-overlay: 100; /* @kind other */
  --z-modal: 1000; /* @kind other */
}

*,*::before,*::after{box-sizing:border-box}
body{font-family:var(--font-body);font-size:var(--body-size);line-height:var(--body-line);color:var(--fg-primary);background:var(--bg-base);-webkit-font-smoothing:antialiased;text-wrap:pretty}
h1{font-family:var(--h1-family);font-size:var(--h1-size);font-weight:var(--h1-weight);line-height:var(--h1-line);letter-spacing:var(--h1-tracking);color:var(--fg-primary)}
h2{font-family:var(--h2-family);font-size:var(--h2-size);font-weight:var(--h2-weight);line-height:var(--h2-line);letter-spacing:var(--h2-tracking);color:var(--fg-primary)}
h3{font-family:var(--h3-family);font-size:var(--h3-size);font-weight:var(--h3-weight);line-height:var(--h3-line);color:var(--fg-primary)}
p{color:var(--fg-secondary)}
a{color:var(--color-crimson);text-decoration:none}
a:hover{color:var(--color-red-700)}
.text-accent{color:var(--fg-accent)}
.bg-blush{background:var(--bg-blush)}
.bg-brand{background:var(--bg-brand);color:var(--fg-inverted)}
.bg-dark{background:var(--bg-dark);color:var(--fg-inverted)}
.text-gradient{background:var(--gradient-deep);-webkit-background-clip:text;background-clip:text;color:transparent}

/* Patterns — logo PNG = alpha ~15% intégré, non raccordable : utiliser en cover, opacité 1 par défaut.
   Arcs PNG = tuile raccordable, opacité 20–35%. */
/* Patterns — arcs (blanc/rouge/noir) ou logo blanc, toujours en transparence + fondu */
.pattern-arcs,.pattern-logo{position:relative;isolation:isolate;overflow:hidden}
.pattern-arcs::before,.pattern-logo::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;-webkit-mask-image:var(--pattern-mask,var(--pattern-fade-down));mask-image:var(--pattern-mask,var(--pattern-fade-down))}
.pattern-arcs::before{background:var(--pattern-arcs) 0 0/var(--pattern-size,140px) auto repeat;opacity:var(--pattern-opacity,.22)}
.pattern-logo::before{background:var(--pattern-logo) var(--pattern-pos,center)/var(--pattern-size,cover) no-repeat;opacity:var(--pattern-opacity,1)}
.fade-right{--pattern-mask:var(--pattern-fade-right); /* @kind other */}
.fade-radial{--pattern-mask:var(--pattern-fade-radial); /* @kind other */}
.fade-none{--pattern-mask:none; /* @kind other */}




body{margin:0;background:#FFFFFF}
a{color:#9F1417}a:hover{color:#68000B}
h1,h2,h3,p{margin:0}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:16px;top:-80px;z-index:50;background:#1C1F1F;color:#FFFFFF;padding:12px 20px;border-radius:9999px;font-weight:600}
.skip:focus{top:16px;color:#FFFFFF}
:focus-visible{outline:3px solid #E73133;outline-offset:3px}
.nav a{color:#1C1F1F;text-decoration:none}
.nav a:hover{color:#9F1417}
.btnp{transition:background .18s ease}
.btnp:hover{background:#68000B!important;color:#FFFFFF!important}
.pgrid{list-style:none;margin:0;padding:0;display:grid;gap:12px;height:520px;grid-template-columns:var(--pcols);grid-template-rows:1fr;transition:grid-template-columns .55s cubic-bezier(.2,.7,.2,1),grid-template-rows .55s cubic-bezier(.2,.7,.2,1)}
.pc{position:relative;overflow:hidden;border-radius:22px;background:#1C1F1F;min-width:0;min-height:0}
.pc-ring{position:absolute;right:-130px;top:-130px;width:360px;height:360px;border-radius:50%;border:60px solid #E73133;border-top-color:transparent;border-right-color:transparent;opacity:0;transform:rotate(-40deg);transition:opacity .5s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.pc[data-active="true"] .pc-ring{opacity:1;transform:rotate(0deg)}
.pc-num{position:absolute;top:22px;left:24px;font-size:13px;font-weight:700;letter-spacing:.14em;color:#D9DADA}
.pc-icon{position:absolute;left:50%;top:calc(100% - 96px);width:64px;height:64px;margin:0 0 0 -32px;border-radius:50%;background:#E73133;color:#FFFFFF;display:flex;align-items:center;justify-content:center;transition:left .55s cubic-bezier(.2,.7,.2,1),top .55s cubic-bezier(.2,.7,.2,1),margin .55s cubic-bezier(.2,.7,.2,1),width .55s ease,height .55s ease,background .4s ease,color .4s ease,transform .3s ease}
.pc[data-active="true"] .pc-icon{left:36px;top:72px;margin:0;width:64px;height:64px;background:#FFFFFF;color:#9F1417}
.pc:not([data-active="true"]):hover .pc-icon{transform:scale(1.08)}
.pc-vtitle{position:absolute;left:50%;bottom:120px;writing-mode:vertical-rl;transform:translateX(-50%) rotate(180deg);font-size:calc(14px * var(--fs));font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#FFFFFF;white-space:nowrap;transition:opacity .25s ease}
.pc[data-active="true"] .pc-vtitle{opacity:0}
.pc-trigger{position:absolute;inset:0;z-index:2;width:100%;height:100%;margin:0;padding:0;border:0;background:transparent;cursor:pointer;border-radius:22px}
.pc-trigger:focus-visible{outline:3px solid #FFA2A2;outline-offset:-6px}
.pc-body{position:absolute;left:0;bottom:0;z-index:1;width:100%;min-width:440px;max-width:640px;padding:36px;box-sizing:border-box;display:flex;flex-direction:column;gap:14px}
.pc-fade{opacity:0;transform:translateY(12px);visibility:hidden;transition:opacity .3s ease-out,transform .3s ease-out,visibility 0s linear .3s}
.pc[data-active="true"] .pc-fade{opacity:1;transform:none;visibility:visible;transition:opacity .4s ease-out,transform .4s ease-out,visibility 0s}
.pc[data-active="true"] .d1{transition-delay:.12s}.pc[data-active="true"] .d2{transition-delay:.19s}.pc[data-active="true"] .d3{transition-delay:.26s}.pc[data-active="true"] .d4{transition-delay:.33s}
.pc-cta{position:relative;z-index:3}
.pc-cta:hover{color:#FFA2A2!important}
@media (max-width: 767px){.pc-ring{width:200px;height:200px;border-width:34px;right:-90px;top:-90px}.pgrid{height:780px;grid-template-columns:1fr;grid-template-rows:var(--prows)}.pc-body{min-width:0;padding:24px}.pc:not([data-active="true"]) .pc-num{opacity:0}.pc-icon{left:24px;top:50%;width:56px;height:56px;margin:-28px 0 0 0}.pc-vtitle{writing-mode:horizontal-tb;left:96px;bottom:50%;transform:translateY(50%)}.pc[data-active="true"] .pc-icon{top:56px;left:24px;margin:0}}
.float-confort{position:fixed;right:24px;bottom:24px;z-index:45;display:inline-flex;align-items:center;gap:12px;min-height:56px;padding:0 10px 0 20px;border-radius:9999px;border:2px solid #FFFFFF;background:#1C1F1F;color:#FFFFFF;font-size:calc(16px * var(--fs));font-weight:700;cursor:pointer;box-shadow:0 16px 40px rgba(28,31,31,.35);animation:floatIn .45s cubic-bezier(.2,.7,.2,1) both}
.float-confort:hover{background:#2A2E2E}
.float-confort:focus-visible{outline:3px solid #E73133;outline-offset:3px}
.float-track{position:relative;width:50px;height:28px;border-radius:9999px;transition:background .2s ease}
.float-track > span{position:absolute;top:4px;width:20px;height:20px;border-radius:50%;background:#FFFFFF;transition:left .2s ease}
@keyframes floatIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media (max-width: 480px){.float-confort{right:16px;bottom:16px;padding:0 8px 0 14px;gap:8px}.float-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes caret{0%,49%{opacity:1}50%,100%{opacity:0}}
.spin{animation:spin 22s linear infinite}
.floaty{animation:floaty 5s ease-in-out infinite}
.caret{animation:caret 1.1s steps(1) infinite}
.stackcard{transition:transform .6s cubic-bezier(.2,.7,.2,1),opacity .45s ease}
.acc{transition:flex-grow .55s cubic-bezier(.2,.7,.2,1)}
@supports (animation-timeline: view()){
.grow{animation:grow linear both;animation-timeline:view();animation-range:entry 0% cover 45%}
@keyframes grow{from{transform:scale(.7)}to{transform:scale(1)}}
.px{animation:px linear both;animation-timeline:view()}
@keyframes px{from{transform:translateY(-70px)}to{transform:translateY(70px)}}
.plx{animation:plx linear both;animation-timeline:scroll(root);animation-range:0px 900px}
@keyframes plx{from{transform:translateY(0)}to{transform:translateY(var(--d,0px))}}
.plx-1{--d:220px}.plx-2{--d:110px}.plx-3{--d:-90px}.plx-4{--d:-200px}.plx-5{--d:-280px}
}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
[data-motion="off"] *,[data-motion="off"] *::before,[data-motion="off"] *::after{animation:none!important;transition:none!important}
[data-contrast="on"] .muted{color:#1C1F1F!important}
[data-contrast="on"] .onink{color:#FFFFFF!important}
[data-contrast="on"] .line{border-color:#3F4242!important}
[data-contrast="on"] a{text-decoration:underline}
details summary{list-style:none;cursor:pointer}
details summary::-webkit-details-marker{display:none}
details[open] .plus{transform:rotate(45deg)}
.plus{transition:transform .2s ease}
input,select,textarea,button{font:inherit}
.hdr-burger{display:none}
.group-nav a{display:inline-flex;align-items:center;min-height:44px;color:#D9DADA;text-decoration:none}
.group-nav a:hover{color:#FFFFFF;text-decoration:underline;text-underline-offset:3px}
.group-nav a:focus-visible{outline:3px solid #FFA2A2;outline-offset:2px}
[data-contrast="on"] .group-nav a{color:#FFFFFF}
@media (max-width: 960px){.group-nav{overflow-x:auto;scrollbar-width:none}.group-nav ul{justify-content:flex-start!important}}
.ref-detail{display:flex;flex-direction:column;gap:10px}
.acc[data-open="false"] .ref-detail{display:none}
@media (max-width: 960px){.hdr-nav{display:none;order:3;flex-basis:100%!important}.hdr-nav[data-open="true"]{display:block}.hdr-nav ul{flex-direction:column;gap:0!important;padding:4px 0 8px!important}.hdr-nav a{display:block;padding:12px 0;border-top:1px solid #ECECEC}.hdr-cta{display:none!important}.hdr-burger{display:inline-flex}}
@media (max-width: 480px){.bu-logo{height:30px!important}.hdr-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}}
@media (max-width: 767px){.svc-right{padding:28px 16px!important}.svc-left{padding:20px 12px!important}#panneau-service{height:540px!important}.stackcard{inset:0 10px 0 0!important;padding:26px 22px!important}.stackcard ul{grid-template-columns:1fr!important}.stackcard h3{font-size:calc(24px * var(--fs))!important}.refs-acc{flex-direction:column;height:auto!important}.refs-acc > li{flex:none!important}.refs-acc a{min-height:0!important;padding:0!important;justify-content:flex-start!important}.refs-acc .ref-img{position:static!important;height:auto!important;aspect-ratio:16/9}.refs-acc .ref-shade{display:none}.refs-acc .ref-box{border-radius:0!important;padding:20px 22px 24px!important}.acc .ref-detail{display:flex!important}}
.door{transition:transform .3s cubic-bezier(.2,.7,.2,1),border-color .3s ease}
.door:hover,.door:focus-visible{transform:translateY(-6px);border-color:#E73133!important}
.door:hover .arrow,.door:focus-visible .arrow{background:#9F1417!important;transform:rotate(-45deg)}
.arrow{transition:background .3s ease,transform .3s ease}

[hidden]{display:none!important}
[data-simple="on"] .only-rich{display:none!important}
[data-simple="off"] .only-simple{display:none!important}


/* ---------- Page ADM construite dans l'éditeur ---------- */
body { margin: 0; }
#adm-root { --fs: 1; font-family: 'Inter', sans-serif; color: #1C1F1F; background: #FFFFFF; position: relative; overflow-x: clip; }
/* Les blocs Groupe ajoutent leurs propres marges : on les neutralise. */
.wp-block-group__inner-container { display: contents; }
#adm-root :where(.wp-block-group, .wp-block-group__inner-container) > *, #adm-root > * { margin-block: 0; }
/* Valeurs par défaut avant le chargement du script du mode confort. */
#adm-root:not([data-simple="on"]) .only-simple { display: none !important; }

/* Piliers : la carte ouverte laisse passer le clic vers son lien « Parlons-en ». */
.pc[data-active="true"] .pc-trigger{pointer-events:none}