
        .storefront {
            font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif !important;
        }
        
        :root {
            /* Theme defaults */
            --font-size-base: 16px;
            --text-color-primary: #0f172a;
            --text-color-secondary: #4b5563;
            --text-color-tertiary: #6b7280;
            --page-default-spacing: 24px;

            /* Website palette */
            --theme-color-50: #9cffff4d;
--theme-color-100: #8dffff80;
--theme-color-200: #6effffb3;
--theme-color-300: #4de5ff;
--theme-color-400: #1cccef;
--theme-color-500: #00b3d5;
--theme-color-600: #009bbc;
--theme-color-700: #0083a4;
--theme-color-800: #006c8c;
--theme-color-900: #005675;
        }
        
/* Custom CSS */
/* 2026-10-10 : espace autour des boutons de contenu */
.storefront-button { margin: 0.75rem 0.4rem; }

/* Vague 3, palier A (10/10/2026) : boutons pleins en vert ABC foncé #1F7A50 (contraste 5,3 au lieu de 2,5 pour le cyan), survol #18633F. Bannière cookies non concernée. */
section .storefront-customer-account-button[data-variant=theme],
section .storefront-customer-account-button[data-variant=theme]::before,
section .storefront-button-plain{background-color:#1F7A50!important;border-color:#1F7A50!important;color:#fff!important}
section .storefront-customer-account-button[data-variant=theme]:hover::before,
section .storefront-button-plain:hover{background-color:#18633F!important}

/* Vague 3, palier B (10/10/2026) : kickers, hiérarchie des titres, masquage visuel des sous-titres H2 vides du bloc Présentation (correctif de fond demandé à Stageo). */
.storefront-section-header-label,.storefront-split-hero-label,.storefront-feature-highlight-label{text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;font-weight:700;color:#2e748f}
.storefront-section-banner-title{font-size:clamp(1.75rem,3vw,2.25rem);letter-spacing:-.02em;line-height:1.15}
.storefront-section-header-title,.storefront-split-hero-title{font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:-.01em;line-height:1.2;font-weight:700}
.storefront-feature-highlight-title{font-weight:700}
.storefront-feature-highlight-subtitle:empty{display:none}

/* Vague 3, palier C (10/10/2026) : images arrondies avec ombre douce, boutons en pilule avec léger relief au survol. */
.storefront-split-hero-image,.storefront-feature-highlight-image,.storefront-image img{border-radius:18px;overflow:hidden;box-shadow:0 10px 30px rgba(0,86,117,.12)}
.storefront-button,section .storefront-customer-account-button,section .storefront-customer-account-button::before{border-radius:999px}
.storefront-button,section .storefront-customer-account-button{font-weight:600;transition:transform .15s ease,box-shadow .15s ease}
.storefront-button:hover,section .storefront-customer-account-button:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,0,0,.18)}

/* Vague 3, palier D (10/10/2026) : FAQ en cartes, défilement doux. */
.storefront-faq-item{border:1px solid #d7eef3;border-radius:12px;margin-bottom:8px;padding:16px;background:#fff}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* 2026-10-11 : titre FAQ de l'accueil recouvert par l'accordéon */
.storefront-heading + .storefront-faq { margin-top: 0; }
/* 2026-10-11 : titre de la bannière sur 2 lignes en mobile */
@media (max-width: 480px){ .storefront-section-banner-title{ font-size: clamp(21px, 6vw, 28px); } }

/* 2026-10-11 : boutons côte à côte, retour à la ligne en mobile */
@media (max-width: 480px){ .storefront-flex-container{ flex-wrap: wrap; } }

/* 2026-10-11 lot A1 : bandes teintées sur l'accueil (chiffres + avis en un seul bloc, journée de stage) */
main > .storefront-section-basic:has(.storefront-grid-container > .storefront-flex-container > .storefront-heading:first-child),
main > .storefront-section-basic:has(a[href*="maps.google.com"]),
main > .storefront-section-basic:has(img[alt="Horaires"]){background:var(--theme-color-50);padding-block:48px}
main > .storefront-section-basic:has(.storefront-grid-container > .storefront-flex-container > .storefront-heading:first-child){padding-bottom:16px}
main > .storefront-section-basic:has(.storefront-grid-container > .storefront-flex-container > .storefront-heading:first-child) + .storefront-section-basic:has(a[href*="maps.google.com"]){margin-top:-32px;padding-top:16px}
/* 2026-10-11 lot A2 : titre de la bannière équilibré sur 2 lignes */
.storefront-section-banner-title{text-wrap:balance}

/* 2026-10-11 lot D4 : illustrations « Vos attestations » et « Une question ? » sur ordinateur seulement */
@media (max-width:1023px){.storefront-feature-highlight:has(img[alt="Vos attestations"]) .storefront-feature-highlight-image,.storefront-feature-highlight:has(img[alt="Une question ?"]) .storefront-feature-highlight-image{display:none}}
/* 2026-10-11 lot B2 : grille des types de stages de l'accueil en 2 colonnes sur mobile et tablette, titres plus petits */
@media (max-width:1023px){.storefront-section-basic:has(a[href="/pages/types-de-stages"]) .storefront-grid-container{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px}
.storefront-section-basic:has(a[href="/pages/types-de-stages"]) .storefront-feature-highlight-title{font-size:1rem;line-height:1.25}}

/* 2026-10-11 lot F : grille des types de stages de l'accueil (4 + 3 cartes cliquables vers le catalogue, espace sous le texte, images alignées) */
.storefront-section-basic:has(a[href="/pages/types-de-stages"]) .storefront-grid-container{margin-top:32px;align-items:stretch}
.storefront-section-basic:has(a[href="/pages/types-de-stages"]) .storefront-grid-container + .storefront-grid-container{margin-top:24px}
.storefront-section-basic:has(a[href="/pages/types-de-stages"]) .storefront-grid-container + .storefront-flex-container{margin-top:24px}
.storefront-section-basic:has(a[href="/pages/types-de-stages"]) .storefront-grid-container > .storefront-flex-container{align-items:stretch;justify-content:space-between;height:100%}
.storefront-section-basic:has(a[href="/pages/types-de-stages"]) .storefront-grid-container .storefront-prose p:first-child{text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;font-weight:700;color:#2e748f;margin:0 0 4px}
.storefront-section-basic:has(a[href="/pages/types-de-stages"]) .storefront-grid-container .storefront-prose h3{margin:0;font-size:1.25rem;line-height:1.25;font-weight:700}
.storefront-section-basic:has(a[href="/pages/types-de-stages"]) .storefront-grid-container .storefront-prose h3 a{color:var(--text-color-primary,#0f172a);text-decoration:none}
.storefront-section-basic:has(a[href="/pages/types-de-stages"]) .storefront-grid-container .storefront-prose h3 a:hover{text-decoration:underline}
@media (max-width:1023px){.storefront-section-basic:has(a[href="/pages/types-de-stages"]) .storefront-grid-container .storefront-prose h3{font-size:1rem}
.storefront-section-basic:has(a[href="/pages/types-de-stages"]) .storefront-grid-container + .storefront-grid-container > :last-child:nth-child(odd){grid-column:1 / -1}}
