/* ============================================================
   ATM Sections – Front-end CSS (Mobile-First)
   Design premium "Webflow Style" – préfixé .atm- pour éviter
   les conflits avec Avada et WordPress.
   ============================================================ */

/* --- Variables --- */
:root {
    --atm-bleu: #03045F;
    --atm-jaune-fonce: #FFCA2B;
    --atm-rose-fonce: #FCC0B6;
    --atm-rose-clair: #FEEAE7;
    --atm-jaune-clair: #FFEDB8;
    --atm-blanc: #FFFFFF;
    --atm-gris-texte: #1A1A1A;
    --atm-gris-doux: #F7F8FA;

    --atm-font-titre: 'Playfair Display', Georgia, serif;
    --atm-font-corps: 'Lato', Arial, sans-serif;

    --atm-ombre: 0 12px 34px rgba(3, 4, 95, 0.06);
    --atm-ombre-hover: 0 24px 48px rgba(3, 4, 95, 0.12);
    --atm-rayon: 24px;
    --atm-rayon-btn: 100px;
    --atm-transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    --atm-border: 1px solid rgba(3, 4, 95, 0.05);
}

/* --- Prevent horizontal scroll --- */
html,
body {
    overflow-x: hidden;
}

/* --- Avada wrapper overflow fix --- */
#wrapper,
#boxed-wrapper,
#main,
.fusion-row,
.fusion-fullwidth,
.fusion-content-container {
    overflow-x: hidden;
    max-width: 100vw;
}

/* --- Reset partiel (scoped) --- */
.atm-hero,
.atm-promesse-strip,
.atm-section {
    box-sizing: border-box;
}

.atm-hero *,
.atm-promesse-strip *,
.atm-section * {
    box-sizing: border-box;
}

/* --- Conteneur (mobile base) --- */
.atm-container {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 16px;
}

/* --- Sections (mobile base) --- */
.atm-section {
    padding: 48px 0;
}

/* --- Typographie --- */
.atm-hero h1,
.atm-section h2,
.atm-section h3 {
    font-family: var(--atm-font-titre);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--atm-bleu);
    line-height: 1.15;
}

.atm-hero h1 {
    font-size: clamp(1.6rem, 7vw, 2.2rem);
    margin-bottom: 24px;
    overflow-wrap: break-word;
    word-break: break-word;
}

.atm-section h2 {
    font-size: clamp(2rem, 5vw, 3.2rem);
}

.atm-section h3 {
    font-size: clamp(1.4rem, 3.5vw, 2rem);
}

.atm-section p {
    font-family: var(--atm-font-corps);
    font-size: 1.1rem;
    line-height: 1.8;
    color: #4A4A5A;
}

/* --- Badge de section (mobile base) --- */
.atm-section-badge {
    display: inline-block;
    background: var(--atm-jaune-clair);
    color: var(--atm-bleu);
    font-family: var(--atm-font-corps);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding: 6px 14px;
    border-radius: 50px;
    margin-bottom: 20px;
    border: var(--atm-border);
}

/* --- En-tête de section --- */
.atm-section-header {
    text-align: center;
    margin-bottom: 40px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

/* ===========================================
   BOUTONS (mobile base)
   =========================================== */
.atm-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 14px 28px;
    min-height: 56px;
    line-height: 1.4;
    border-radius: var(--atm-rayon-btn);
    font-family: var(--atm-font-corps);
    font-weight: 700;
    font-size: .9rem;
    cursor: pointer;
    border: 2px solid transparent;
    transition: var(--atm-transition);
    text-decoration: none;
}

.atm-btn-primary {
    background: var(--atm-bleu);
    color: var(--atm-blanc);
    border-color: var(--atm-bleu);
}

.atm-btn-primary:hover {
    background: var(--atm-jaune-fonce);
    border-color: var(--atm-jaune-fonce);
    color: var(--atm-bleu);
    transform: translateY(-4px);
    box-shadow: 0 14px 28px rgba(255, 202, 43, .3);
}

.atm-btn-secondary {
    background: transparent;
    color: var(--atm-bleu);
    border-color: var(--atm-bleu);
}

.atm-btn-secondary:hover {
    background: var(--atm-bleu);
    color: var(--atm-blanc);
    transform: translateY(-2px);
}

.atm-btn-yellow,
.atm-btn-whatsapp {
    background: var(--atm-jaune-fonce);
    color: var(--atm-bleu);
    border-color: var(--atm-jaune-fonce);
}

.atm-btn-yellow:hover,
.atm-btn-whatsapp:hover {
    background: var(--atm-bleu);
    color: var(--atm-blanc);
    transform: translateY(-2px);
}

/* --- Focus visible (accessibilite clavier) --- */
.atm-btn:focus-visible,
.atm-navbar-links a:focus-visible,
.atm-btn-nav:focus-visible,
.atm-hamburger:focus-visible,
.atm-footer-col a:focus-visible,
.atm-footer-socials a:focus-visible,
.atm-social-link:focus-visible,
.atm-faq-question:focus-visible,
.atm-pilier-card:focus-visible,
.atm-modal-close:focus-visible {
    outline: 3px solid var(--atm-jaune-fonce);
    outline-offset: 3px;
    border-radius: 4px;
}

/* ===========================================
   HERO (mobile base)
   =========================================== */
.atm-hero {
    display: flex;
    align-items: center;
    padding: 100px 0 48px;
    min-height: auto;
    position: relative;
    overflow: hidden;
    background: var(--atm-blanc);
}

.atm-hero::before {
    content: '';
    position: absolute;
    top: -20%;
    right: -10%;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    background: radial-gradient(circle, var(--atm-rose-clair) 0%, rgba(255, 255, 255, 0) 70%);
    z-index: 0;
}

.atm-hero::after {
    content: '';
    position: absolute;
    bottom: -20%;
    left: -10%;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    background: radial-gradient(circle, var(--atm-jaune-clair) 0%, rgba(255, 255, 255, 0) 70%);
    z-index: 0;
    opacity: 0.6;
}

.atm-hero .atm-container {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    align-items: center;
    position: relative;
    z-index: 1;
}

.atm-eyebrow {
    --atm-eyebrow-slot: 2.9em;
    --atm-eyebrow-line: 1.35;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    max-width: 100%;
    background: #FCC0B6;
    color: #03045F;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    line-height: var(--atm-eyebrow-line);
    padding: 8px 20px;
    border-radius: 50px;
    margin-bottom: 24px;
    border: 1px solid rgba(3, 4, 95, .12);
}

@supports (height: 2lh) {
    .atm-eyebrow {
        --atm-eyebrow-slot: 2.75lh;
    }
}

/* Icône : même axe optique que la ligne de texte */
.atm-eyebrow > i {
    color: #03045F;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    width: 1.2em;
    height: 1.2em;
    font-size: 1em;
    margin-top: 0.06em;
}

.atm-eyebrow > .fas,
.atm-eyebrow > .fa-home {
    color: #03045F;
}

.atm-eyebrow-inner {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0;
    min-width: 0;
}

.atm-eyebrow-prefix {
    white-space: nowrap;
    line-height: var(--atm-eyebrow-line);
    display: inline-flex;
    align-items: center;
}

.atm-eyebrow-prefix::after {
    content: '\00a0';
}

.atm-eyebrow-viewport {
    display: inline-block;
    overflow: hidden !important;
    vertical-align: middle;
    min-height: 1.35em;
    /* Même hauteur que chaque « slot » ville : le texte est centré dedans (alignement avec le préfixe) */
    height: var(--atm-eyebrow-slot);
    max-width: 100%;
    box-sizing: border-box;
}

.atm-eyebrow-track {
    display: flex;
    flex-direction: column;
    will-change: transform;
    transition: transform 0.65s cubic-bezier(0.4, 0, 0.2, 1);
}

.atm-eyebrow-loc {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    line-height: var(--atm-eyebrow-line);
    white-space: normal;
    min-height: var(--atm-eyebrow-slot);
    box-sizing: border-box;
}

.atm-eyebrow--static .atm-eyebrow-viewport {
    height: auto !important;
    overflow: visible;
}

.atm-eyebrow--static .atm-eyebrow-track {
    transform: none !important;
    transition: none !important;
}

.atm-eyebrow--static .atm-eyebrow-loc:not(:first-of-type) {
    display: none;
}

.atm-eyebrow--static .atm-eyebrow-loc[aria-hidden="true"] {
    display: none;
}

.atm-eyebrow--static .atm-eyebrow-loc:first-of-type {
    min-height: 0;
}

.atm-hero h1 em {
    font-style: italic;
    background: linear-gradient(to right, var(--atm-rose-fonce), #E09E91);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.atm-hero-subtitle {
    font-size: 1rem;
    color: var(--atm-gris-texte);
    opacity: .85;
    margin-bottom: 40px;
    max-width: 540px;
    line-height: 1.8;
}

.atm-hero-actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
}

.atm-hero-actions .atm-btn {
    text-align: center;
    justify-content: center;
}

.atm-hero-trust {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 28px;
    font-size: .9rem;
    color: var(--atm-bleu);
    opacity: .7;
    font-family: var(--atm-font-corps);
}

.atm-trust-stars {
    color: var(--atm-jaune-fonce);
    font-size: 1.2rem;
}

.atm-hero-image-wrap {
    max-height: 400px;
    overflow: hidden;
    border-radius: 24px;
}

.atm-hero-image-wrap .atm-img-frame {
    max-height: 400px;
    border-radius: 24px;
    box-shadow: 0 32px 64px rgba(3, 4, 95, .12);
}

.atm-hero-image-wrap .atm-img-frame__img {
    width: 100%;
    border-radius: 24px;
    max-height: 400px;
    min-height: 220px;
    object-fit: cover;
    object-position: var(--atm-img-x, 50%) var(--atm-img-y, 50%);
    transform: scale(calc(var(--atm-img-zoom, 100) / 100));
    transform-origin: var(--atm-img-x, 50%) var(--atm-img-y, 50%);
}

/* Cadre image réutilisable (position + zoom, variables --atm-img-* / --atm-img-*-m) */
.atm-img-frame {
    display: block;
    width: 100%;
    overflow: hidden;
    border-radius: inherit;
}

.atm-img-frame__img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    object-position: var(--atm-img-x, 50%) var(--atm-img-y, 50%);
    transform: scale(calc(var(--atm-img-zoom, 100) / 100));
    transform-origin: var(--atm-img-x, 50%) var(--atm-img-y, 50%);
}

@media (max-width: 781px) {
    .atm-img-frame__img {
        object-position: var(--atm-img-x-m, 50%) var(--atm-img-y-m, 50%);
        transform: scale(calc(var(--atm-img-zoom-m, 100) / 100));
        transform-origin: var(--atm-img-x-m, 50%) var(--atm-img-y-m, 50%);
    }

    .atm-img-parallax:hover .atm-img-frame__img {
        transform: scale(calc((var(--atm-img-zoom-m, 100) / 100) * 1.05));
    }

    .atm-portfolio-item:hover .atm-img-frame__img {
        transform: scale(calc((var(--atm-img-zoom-m, 100) / 100) * 1.05));
    }

    .atm-page-hero--has-bg-img .atm-page-hero-bg-blur {
        background-position: var(--atm-bg-x-m, 50%) var(--atm-bg-y-m, 50%);
        transform: scale(calc(var(--atm-bg-zoom-m, 100) / 100));
        transform-origin: var(--atm-bg-x-m, 50%) var(--atm-bg-y-m, 50%);
    }

    .atm-hero-image-wrap .atm-img-frame__img,
    .atm-apropos-img-wrap .atm-img-frame__img,
    .atm-apropos-bio-img .atm-img-frame__img {
        object-position: var(--atm-img-x-m, 50%) var(--atm-img-y-m, 50%);
        transform: scale(calc(var(--atm-img-zoom-m, 100) / 100));
        transform-origin: var(--atm-img-x-m, 50%) var(--atm-img-y-m, 50%);
    }
}

.atm-hero-badge {
    position: relative;
    left: 0;
    margin-top: 16px;
    background: rgba(255, 255, 255, .9);
    backdrop-filter: blur(12px);
    color: var(--atm-bleu);
    border-radius: var(--atm-rayon);
    padding: 24px 32px;
    box-shadow: 0 24px 48px rgba(3, 4, 95, .12);
    text-align: center;
    min-width: 160px;
    border: 1px solid rgba(255, 255, 255, .5);
}

.atm-hero-badge strong {
    display: block;
    font-size: 2.2rem;
    font-family: var(--atm-font-titre);
    color: var(--atm-jaune-fonce);
    line-height: 1;
    margin-bottom: 4px;
}

.atm-hero-badge span {
    font-size: .85rem;
    font-weight: 700;
    opacity: .8;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.atm-hero-badge small {
    display: block;
    font-size: .75rem;
    font-style: italic;
    font-weight: 400;
    opacity: .6;
    margin-top: 6px;
    text-transform: none;
    letter-spacing: 0;
}

/* ===========================================
   PROMESSE STRIP (mobile base)
   =========================================== */
.atm-promesse-strip {
    background: var(--atm-bleu);
    padding: 48px 0;
}

.atm-promesse-strip .atm-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}

.atm-promesse-item {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 16px;
    color: var(--atm-blanc);
    flex: 1;
    min-width: 200px;
    font-family: var(--atm-font-corps);
}

.atm-pi-text {
    display: flex;
    flex-direction: column;
}

.atm-pi-icon {
    font-size: 2rem;
    color: var(--atm-jaune-fonce);
    margin-top: 4px;
    flex-shrink: 0;
}

.atm-promesse-item strong {
    font-family: var(--atm-font-titre);
    font-size: 1.25rem;
    display: block;
    margin-bottom: 4px;
}

.atm-promesse-item span {
    font-size: .95rem;
    opacity: .75;
    line-height: 1.5;
    display: block;
}

/* ===========================================
   À PROPOS (SECTION HOME) – mobile base
   =========================================== */
.atm-apropos-home {
    background: var(--atm-blanc);
}

.atm-apropos-home .atm-container {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    align-items: center;
}

.atm-apropos-img-wrap {
    position: relative;
}

.atm-apropos-img-wrap .atm-img-frame {
    border-radius: 24px;
    box-shadow: var(--atm-ombre);
}

.atm-apropos-img-wrap .atm-img-frame__img {
    border-radius: 24px;
    width: 100%;
    min-height: 260px;
    object-fit: cover;
    object-position: var(--atm-img-x, 50%) var(--atm-img-y, 50%);
    transform: scale(calc(var(--atm-img-zoom, 100) / 100));
    transform-origin: var(--atm-img-x, 50%) var(--atm-img-y, 50%);
}

.atm-apropos-img-wrap::before {
    content: '';
    position: absolute;
    top: -16px;
    left: -16px;
    width: 100%;
    height: 100%;
    border: 3px solid var(--atm-jaune-fonce);
    border-radius: 24px;
    z-index: -1;
}

.atm-apropos-content h2 {
    margin-bottom: 16px;
}

.atm-apropos-content p {
    margin-bottom: 16px;
    color: #555;
}

/* ===========================================
   PILIERS (mobile base)
   =========================================== */
.atm-piliers {
    background: var(--atm-rose-clair);
}

.atm-piliers-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}

.atm-pilier-card {
    background: var(--atm-blanc);
    border-radius: var(--atm-rayon);
    padding: 48px 32px;
    text-align: center;
    box-shadow: var(--atm-ombre);
    transition: var(--atm-transition);
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    border: var(--atm-border);
}

.atm-pilier-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--atm-ombre-hover);
}

.atm-pilier-icon {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.8rem;
    margin-bottom: 8px;
    transition: var(--atm-transition);
}

.atm-pilier-card:hover .atm-pilier-icon {
    transform: scale(1.1);
}

.atm-pilier-icon--maison {
    background: var(--atm-jaune-clair);
    color: var(--atm-bleu);
}

.atm-pilier-icon--papiers {
    background: var(--atm-jaune-clair);
    color: var(--atm-bleu);
}

.atm-pilier-icon--linge {
    background: var(--atm-jaune-clair);
    color: var(--atm-bleu);
}

.atm-pilier-card h3 {
    color: var(--atm-bleu);
    font-size: 1.6rem;
}

.atm-pilier-card p {
    color: #555;
    font-size: 1.05rem;
}

.atm-pilier-link {
    margin-top: auto;
    color: var(--atm-bleu);
    font-weight: 700;
    font-size: .95rem;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding-top: 20px;
}

.atm-pilier-link i {
    transition: transform 0.3s ease;
}

.atm-pilier-card:hover .atm-pilier-link i {
    transform: translateX(4px);
}

/* ===========================================
   PARCOURS (mobile base)
   =========================================== */
.atm-parcours {
    background: var(--atm-bleu);
    color: var(--atm-blanc);
}

.atm-parcours .atm-section-header h2,
.atm-parcours .atm-section-header h2 * {
    color: var(--atm-blanc) !important;
}

.atm-parcours .atm-section-badge {
    background: rgba(255, 255, 255, .1);
    color: var(--atm-blanc);
    border: 1px solid rgba(255, 255, 255, .2);
}

.atm-parcours .atm-section-header h2,
.atm-parcours .atm-section-header p {
    color: var(--atm-blanc) !important;
}

.atm-parcours-steps {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    position: relative;
}

.atm-parcours-steps::before {
    content: '';
    position: absolute;
    top: 40px;
    left: 17%;
    right: 17%;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .3), transparent);
    display: none;
}

.atm-parcours-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 0 16px;
    transition: var(--atm-transition);
}

.atm-parcours-step:hover {
    transform: translateY(-8px);
}

.atm-step-number {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--atm-font-titre);
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 32px;
    position: relative;
    z-index: 1;
    box-shadow: 0 12px 24px rgba(0, 0, 0, .2);
    box-sizing: border-box;
    padding-bottom: 8px;
}

.atm-step-1 .atm-step-number {
    background: var(--atm-jaune-clair);
    color: var(--atm-bleu);
}

.atm-step-2 .atm-step-number {
    background: var(--atm-jaune-fonce);
    color: var(--atm-bleu);
}

.atm-step-3 .atm-step-number {
    background: var(--atm-rose-fonce);
    color: var(--atm-bleu);
}

.atm-parcours-step h3,
.atm-parcours-step h3 * {
    color: var(--atm-blanc) !important;
    margin-bottom: 16px;
    font-size: 1.6rem;
}

.atm-parcours-step p {
    opacity: .85;
    font-size: 1.05rem;
    color: rgba(255, 255, 255, .9);
}

.atm-step-price {
    display: inline-block;
    background: rgba(255, 255, 255, .1);
    color: var(--atm-blanc) !important;
    padding: 8px 24px;
    border-radius: 50px;
    font-size: .95rem;
    font-weight: 700;
    margin-top: 24px;
    border: 1px solid rgba(255, 255, 255, .2);
}

.atm-parcours-cta {
    text-align: center;
    margin-top: 48px;
}

/* ===========================================
   AVANTAGES (mobile base)
   =========================================== */
.atm-avantages {
    background: var(--atm-gris-doux);
}

.atm-avantages-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.atm-avantage-card {
    background: var(--atm-blanc);
    border-radius: var(--atm-rayon);
    padding: 24px;
    display: flex;
    gap: 16px;
    align-items: flex-start;
    transition: var(--atm-transition);
    box-shadow: var(--atm-ombre);
    border: var(--atm-border);
}

.atm-avantage-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--atm-ombre-hover);
}

.atm-avantage-icon {
    font-size: 1.8rem;
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.atm-avantage-card:nth-child(1) .atm-avantage-icon {
    background: var(--atm-jaune-clair);
    color: var(--atm-bleu);
}

.atm-avantage-card:nth-child(2) .atm-avantage-icon {
    background: var(--atm-rose-clair);
    color: var(--atm-bleu);
}

.atm-avantage-card:nth-child(3) .atm-avantage-icon {
    background: var(--atm-rose-fonce);
    color: var(--atm-bleu);
}

.atm-avantage-card:nth-child(4) .atm-avantage-icon {
    background: var(--atm-jaune-fonce);
    color: var(--atm-bleu);
}

.atm-avantage-text h3 {
    color: var(--atm-bleu);
    margin-bottom: 12px;
    font-size: 1.2rem;
}

.atm-avantage-text p {
    color: #555;
    font-size: .95rem;
}

/* ===========================================
   PORTFOLIO (mobile base)
   =========================================== */
.atm-portfolio {
    background: var(--atm-rose-clair);
}

.atm-portfolio-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

.atm-portfolio-item {
    border-radius: var(--atm-rayon);
    overflow: hidden;
    box-shadow: var(--atm-ombre);
    transition: var(--atm-transition);
    border: var(--atm-border);
    background: var(--atm-blanc);
}

.atm-portfolio-item:hover {
    transform: translateY(-8px);
    box-shadow: var(--atm-ombre-hover);
}

.atm-portfolio-item .atm-img-frame {
    max-height: 480px;
}

.atm-portfolio-item .atm-img-frame__img {
    width: 100%;
    min-height: 240px;
    max-height: 480px;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    object-position: var(--atm-img-x, 50%) var(--atm-img-y, 50%);
    transform: scale(calc(var(--atm-img-zoom, 100) / 100));
    transform-origin: var(--atm-img-x, 50%) var(--atm-img-y, 50%);
}

@media (min-width: 782px) {
    .atm-portfolio-item:hover .atm-img-frame__img {
        transform: scale(calc((var(--atm-img-zoom, 100) / 100) * 1.05));
    }
}

/* Badge « Avant / Après » — section portfolio uniquement */
.atm-portfolio .atm-section-header .atm-section-badge {
    background: #FCC0B6;
    color: #FEEAE7;
    border-color: rgba(3, 4, 95, .1);
}

.atm-portfolio-caption {
    background: var(--atm-blanc);
    padding: 24px 32px;
    font-weight: 700;
    color: var(--atm-bleu);
    font-size: 1.1rem;
    font-family: var(--atm-font-corps);
}

/* ===========================================
   TÉMOIGNAGES (mobile base)
   =========================================== */
.atm-temoignages {
    background: var(--atm-jaune-clair);
}

.atm-temoignages-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

.atm-temoignage-card {
    background: var(--atm-blanc);
    border-radius: var(--atm-rayon);
    padding: 24px;
    box-shadow: var(--atm-ombre);
    position: relative;
    transition: var(--atm-transition);
    border: var(--atm-border);
}

.atm-temoignage-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--atm-ombre-hover);
}

.atm-temoignage-card::before {
    content: '\201C';
    font-family: var(--atm-font-titre);
    font-size: 6rem;
    color: var(--atm-jaune-clair);
    position: absolute;
    top: -16px;
    left: 24px;
    line-height: 1;
    z-index: 0;
}

.atm-temoignage-stars {
    color: #FFCA2B;
    font-size: 1.2rem;
    margin-bottom: 20px;
    position: relative;
    z-index: 1;
}

.atm-temoignage-text {
    color: #4A4A5A;
    font-size: 1.05rem;
    margin-bottom: 24px;
    line-height: 1.8;
    position: relative;
    z-index: 1;
}

.atm-temoignage-auteur strong {
    display: block;
    color: var(--atm-bleu);
    font-weight: 700;
    font-size: 1.1rem;
}

.atm-temoignage-auteur span {
    font-size: .9rem;
    color: #888;
}

/* ===========================================
   FAQ
   =========================================== */
.atm-faq {
    background: var(--atm-blanc);
}

.atm-faq-list {
    max-width: 860px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.atm-faq-item {
    border: 1px solid rgba(3, 4, 95, .08);
    border-radius: 16px;
    overflow: hidden;
    transition: var(--atm-transition);
    background: var(--atm-blanc);
}

.atm-faq-item:hover {
    border-color: rgba(3, 4, 95, .2);
}

.atm-faq-item.open {
    border-color: var(--atm-bleu);
    box-shadow: var(--atm-ombre);
}

.atm-faq-question {
    width: 100%;
    background: none;
    border: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px 32px;
    cursor: pointer;
    text-align: left;
    gap: 20px;
    transition: var(--atm-transition);
}

.atm-faq-item.open .atm-faq-question {
    background: rgba(3, 4, 95, .02);
}

.atm-faq-question-text {
    font-family: var(--atm-font-corps);
    font-weight: 700;
    font-size: 1.15rem;
    color: var(--atm-bleu);
}

.atm-faq-icon {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--atm-jaune-clair);
    color: var(--atm-bleu);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.2rem;
    transition: var(--atm-transition);
}

.atm-faq-item.open .atm-faq-icon {
    background: var(--atm-bleu);
    color: var(--atm-blanc);
    transform: rotate(45deg);
}

.atm-faq-answer {
    overflow: hidden;
}

.atm-faq-answer-inner {
    padding: 0 32px 32px;
    color: #555;
    font-size: 1.05rem;
    line-height: 1.8;
    font-family: var(--atm-font-corps);
}

/* ===========================================
   CONTACT (mobile base)
   =========================================== */
.atm-contact {
    background: var(--atm-bleu);
    color: var(--atm-blanc);
}

.atm-contact .atm-section-header h2 {
    color: var(--atm-blanc);
}

.atm-contact .atm-section-header p {
    color: #fff;
    opacity: 1;
}

.atm-contact .atm-section-badge {
    background: rgba(255, 255, 255, .15);
    color: var(--atm-blanc);
}

/* Page d'accueil ([atm_page_accueil]) — badges de section */
.atm-page-accueil .atm-section-badge {
    background: var(--atm-rose-fonce);
    color: var(--atm-rose-clair);
    border-color: rgba(3, 4, 95, 0.1);
}

.atm-contact-body {
    text-align: center;
    max-width: 640px;
    margin: 0 auto;
}

.atm-contact-actions {
    display: flex;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
    margin-bottom: 48px;
}

.atm-btn-contact-email {
    background: var(--atm-blanc);
    color: var(--atm-bleu);
    border-color: var(--atm-blanc);
}

.atm-btn-contact-email:hover {
    background: var(--atm-jaune-fonce);
    border-color: var(--atm-jaune-fonce);
    color: var(--atm-bleu);
    transform: translateY(-2px);
}

.atm-contact-details {
    display: flex;
    gap: 32px;
    justify-content: center;
    flex-wrap: wrap;
    font-family: var(--atm-font-corps);
}

.atm-contact-detail-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.atm-contact-detail-item--zone {
    justify-content: center;
    margin-top: 24px;
    font-family: var(--atm-font-corps);
}

.atm-contact-detail-item span {
    color: var(--atm-blanc);
}

.atm-contact-link {
    color: var(--atm-blanc);
    text-decoration: none;
}

.atm-contact-link:hover {
    text-decoration: underline;
}

.atm-contact-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

.atm-contact-info {
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.atm-contact-info-item {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.atm-cii-icon {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: var(--atm-jaune-fonce);
    flex-shrink: 0;
}

.atm-cii-text {
    color: rgba(255, 255, 255, .9);
    font-family: var(--atm-font-corps);
}

.atm-cii-text strong {
    display: block;
    color: var(--atm-blanc);
    font-weight: 700;
    margin-bottom: 2px;
}

.atm-cii-text a {
    color: var(--atm-jaune-fonce);
}

.atm-cii-text a:hover {
    text-decoration: underline;
}

.atm-social-links {
    display: flex;
    gap: 14px;
    margin-top: 8px;
}

.atm-social-link {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .12);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: var(--atm-blanc);
    transition: var(--atm-transition);
}

.atm-social-link:hover {
    background: var(--atm-jaune-fonce);
    color: var(--atm-bleu);
    transform: translateY(-3px);
}

/* Formulaire */
.atm-contact-form {
    background: var(--atm-blanc);
    border-radius: var(--atm-rayon);
    padding: 48px;
    box-shadow: 0 32px 64px rgba(0, 0, 0, .2);
}

.atm-form-group {
    margin-bottom: 24px;
}

.atm-form-group label {
    display: block;
    font-weight: 700;
    color: var(--atm-bleu);
    margin-bottom: 12px;
    font-size: .95rem;
    font-family: var(--atm-font-corps);
}

.atm-form-group input,
.atm-form-group select,
.atm-form-group textarea {
    width: 100%;
    padding: 16px 20px;
    border: 1px solid rgba(3, 4, 95, .15);
    border-radius: 12px;
    font-family: var(--atm-font-corps);
    font-size: 1rem;
    color: var(--atm-gris-texte);
    transition: var(--atm-transition);
    background: #FCFCFD;
}

.atm-form-group input:focus,
.atm-form-group select:focus,
.atm-form-group textarea:focus {
    outline: none;
    border-color: var(--atm-bleu);
    background: var(--atm-blanc);
    box-shadow: 0 0 0 4px rgba(3, 4, 95, .08);
}

.atm-form-group textarea {
    resize: vertical;
    min-height: 140px;
}

/* ===========================================
   ANIMATIONS PREMIUM (WEBFLOW STYLE)
   =========================================== */
.atm-reveal {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
        transform 0.8s cubic-bezier(0.16, 1, 0.3, 1),
        visibility 0.8s;
    will-change: opacity, transform;
}

.atm-reveal-up {
    transform: translateY(60px);
}

.atm-reveal-left {
    transform: translateX(-40px);
}

.atm-reveal-right {
    transform: translateX(40px);
}

.atm-reveal-scale {
    transform: scale(.95) translateY(30px);
}

.atm-reveal.active {
    opacity: 1;
    visibility: visible;
    transform: translate(0, 0) scale(1);
}

.atm-delay-1 {
    transition-delay: .1s;
}

.atm-delay-2 {
    transition-delay: .2s;
}

.atm-delay-3 {
    transition-delay: .3s;
}

.atm-delay-4 {
    transition-delay: .4s;
}

.atm-delay-5 {
    transition-delay: .5s;
}

/* Parallax hover sur les images */
.atm-img-parallax {
    overflow: hidden;
    border-radius: var(--atm-rayon);
}

.atm-img-parallax .atm-img-frame__img {
    transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

@media (min-width: 782px) {
    .atm-img-parallax:hover .atm-img-frame__img {
        transform: scale(calc((var(--atm-img-zoom, 100) / 100) * 1.05));
    }
}

/* ===========================================
   NAVBAR (mobile base)
   =========================================== */
.atm-navbar {
    position: sticky;
    top: 0;
    z-index: 999999;
    background: var(--atm-blanc);
    box-shadow: 0 2px 16px rgba(3, 4, 95, .08);
    transition: var(--atm-transition);
}

.admin-bar .atm-navbar {
    top: 32px;
}

.atm-navbar.scrolled {
    box-shadow: 0 4px 30px rgba(3, 4, 95, .16);
}

.atm-navbar .atm-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.atm-navbar-logo img {
    height: 36px;
    width: auto;
}

.atm-navbar-links {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--atm-blanc);
    flex-direction: column;
    gap: 0;
    padding: 16px 24px;
    box-shadow: 0 8px 24px rgba(3, 4, 95, .1);
    list-style: none;
    margin: 0;
    z-index: 9999;
}

.atm-navbar-links.open {
    display: flex;
}

.atm-navbar-links li {
    border-bottom: 1px solid rgba(3, 4, 95, .05);
    padding: 12px 0;
}

.atm-navbar-links li:last-child {
    border-bottom: none;
}

.atm-navbar-links a {
    font-family: var(--atm-font-corps);
    font-size: 1rem;
    font-weight: 700;
    color: var(--atm-bleu);
    position: relative;
    padding-bottom: 4px;
    text-decoration: none;
    display: block;
}

.atm-navbar-links a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--atm-jaune-fonce);
    transition: var(--atm-transition);
}

.atm-navbar-links a:hover::after,
.atm-navbar-links a.active::after {
    width: 100%;
}

.atm-btn-nav {
    background: var(--atm-blanc);
    color: var(--atm-bleu) !important;
    padding: 0 28px !important;
    height: 42px;
    border-radius: var(--atm-rayon-btn);
    font-weight: 700;
    font-size: .95rem;
    line-height: 42px;
    transition: var(--atm-transition);
    border: 1px solid rgba(3, 4, 95, .1);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-top: 8px;
}

.atm-btn-nav:hover {
    background: var(--atm-bleu) !important;
    color: var(--atm-blanc) !important;
    transform: translateY(-2px);
}

.atm-btn-nav::after {
    display: none !important;
}

.atm-navbar.scrolled .atm-btn-nav {
    background: var(--atm-bleu);
    color: var(--atm-blanc) !important;
}

.atm-navbar.scrolled .atm-btn-nav:hover {
    background: var(--atm-jaune-fonce) !important;
    color: var(--atm-bleu) !important;
}

.atm-hamburger {
    display: flex;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
    background: none;
    border: none;
    padding: 4px;
}

.atm-hamburger span {
    display: block;
    width: 26px;
    height: 2px;
    background: var(--atm-bleu);
    border-radius: 2px;
    transition: var(--atm-transition);
}

/* ===========================================
   HAMBURGER ANIMATION (3 bars → X)
   =========================================== */
.atm-hamburger.active span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
}

.atm-hamburger.active span:nth-child(2) {
    opacity: 0;
}

.atm-hamburger.active span:nth-child(3) {
    transform: rotate(-45deg) translate(5px, -5px);
}

/* ===========================================
   FOOTER (mobile base)
   =========================================== */
.atm-footer {
    background: #020340;
    color: rgba(255, 255, 255, .7);
    padding: 24px 0 8px;
    font-family: var(--atm-font-corps);
}

.atm-footer-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
    margin-bottom: 28px;
}

.atm-footer-brand img {
    height: 44px;
    filter: brightness(0) invert(1);
    margin-bottom: 10px;
}

.atm-footer-brand p {
    font-size: .85rem;
    max-width: 220px;
    line-height: 1.6;
    color: rgba(255, 255, 255, .7);
}

.atm-footer-socials {
    display: flex;
    gap: 10px;
    margin-top: 12px;
}

.atm-footer-socials a {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--atm-blanc);
    font-size: 1rem;
    transition: var(--atm-transition);
}

.atm-footer-socials a:hover {
    background: var(--atm-jaune-fonce);
    color: var(--atm-bleu);
    transform: translateY(-3px);
}

.atm-footer-col {
    list-style: none;
    margin: 0;
    padding: 0;
}

.atm-footer-col h4 {
    font-family: var(--atm-font-corps);
    color: var(--atm-blanc);
    font-size: .85rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.atm-footer-col li {
    margin-bottom: 6px;
    display: block;
}

.atm-footer-col li::before,
.atm-footer-col li::after {
    /* Neutralise les séparateurs éventuels ajoutés par le thème */
    content: none !important;
}

.atm-footer-col a {
    font-size: .9rem;
    color: rgba(255, 255, 255, .7);
    text-decoration: none;
    transition: var(--atm-transition);
}

.atm-footer-col a:hover {
    color: var(--atm-jaune-fonce);
}

.atm-footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, .1);
    padding-top: 16px;
    display: flex;
    flex-direction: column;
    text-align: center;
    flex-wrap: wrap;
    gap: 6px;
    font-size: .82rem;
    color: rgba(255, 255, 255, .5);
}

/* Compacte le footer sur les très petits écrans */
@media (max-width: 480px) {
    .atm-footer-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "brand brand"
            "offres infos";
        column-gap: 18px;
        row-gap: 14px;
        margin-bottom: 20px;
        justify-items: center;
        align-items: start;
    }

    .atm-footer-brand {
        grid-area: brand;
        text-align: center;
    }

    .atm-footer-brand p {
        margin-left: auto;
        margin-right: auto;
    }

    .atm-footer-socials {
        justify-content: center;
    }

    .atm-footer-grid nav[aria-label*="Offres"] {
        grid-area: offres;
    }

    .atm-footer-grid nav[aria-label*="Informations"] {
        grid-area: infos;
    }

    .atm-footer-grid nav[aria-label*="Offres"],
    .atm-footer-grid nav[aria-label*="Informations"] {
        text-align: center;
    }

    .atm-footer-col {
        text-align: center;
    }

    .atm-footer-col h4 {
        text-align: center;
    }

    .atm-footer-col li {
        text-align: center;
    }

    .atm-footer-col a {
        display: inline-block;
    }

    .atm-footer-col h4 {
        margin-bottom: 10px;
        font-size: .82rem;
    }

    .atm-footer-col li {
        margin-bottom: 4px;
    }

    .atm-footer-bottom {
        padding-top: 14px;
    }
}

.atm-footer-bottom a {
    color: var(--atm-jaune-fonce);
    text-decoration: none;
}

.atm-footer-bottom a:hover {
    text-decoration: underline;
}

/* ===========================================
   PAGE HERO (mobile base)
   =========================================== */
.atm-page-hero {
    padding: 80px 0 32px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.atm-page-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, .6) 0%, transparent 100%);
    z-index: 0;
}

.atm-page-hero .atm-container {
    position: relative;
    z-index: 1;
}

.atm-page-hero h1 {
    font-family: var(--atm-font-titre);
    font-size: 1.6rem;
    color: var(--atm-bleu);
    margin-bottom: 16px;
}

.atm-page-hero h1 i {
    margin-right: 12px;
}

.atm-page-hero p,
.fusion-fullwidth .atm-page-hero p,
.fusion-content-container .atm-page-hero p,
#content .atm-page-hero p,
#main .atm-page-hero p,
.post-content .atm-page-hero p,
body .atm-page-hero .atm-container p {
    font-size: 1rem;
    color: #4A4A5A;
    max-width: 100%;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 0 !important;
    margin-bottom: 32px !important;
    line-height: 1.8;
    text-align: center !important;
    display: block !important;
    padding: 0 16px;
}

.atm-page-hero--rose {
    background: var(--atm-rose-clair);
}

.atm-page-hero--jaune {
    background: var(--atm-jaune-clair);
}

.atm-page-hero--bleu {
    background: linear-gradient(135deg, #03045F 0%, #050580 100%);
}

.atm-page-hero--bleu h1,
.atm-page-hero--bleu p {
    color: var(--atm-blanc);
}

.atm-page-hero--bleu p {
    opacity: .85;
}

.atm-page-hero--bleu .atm-section-badge {
    background: rgba(255, 255, 255, .15);
    color: var(--atm-blanc);
}

/* Pages offre (Maison / Papiers / Linge) — entête uniforme */
.atm-page-hero--offre {
    background: #FFEDB8;
}

.atm-page-hero--offre::before {
    background: transparent;
}

.atm-page-hero--has-bg-img .atm-page-hero-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.atm-page-hero--has-bg-img .atm-page-hero-bg-blur {
    position: absolute;
    inset: -12%;
    background-size: cover;
    background-position: var(--atm-bg-x, 50%) var(--atm-bg-y, 50%);
    background-repeat: no-repeat;
    filter: blur(var(--atm-hero-blur, 0px));
    transform: scale(calc(var(--atm-bg-zoom, 100) / 100));
    transform-origin: var(--atm-bg-x, 50%) var(--atm-bg-y, 50%);
}

.atm-page-hero--offre .atm-section-badge {
    background: #FCC0B6;
    color: #FEEAE7;
    border-color: rgba(3, 4, 95, .1);
}

.atm-page-hero-title--icon-only {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 16px;
    line-height: 1;
}

.atm-page-hero-title--icon-only > i {
    margin-right: 0;
    font-size: 3rem;
    color: var(--atm-bleu);
}

/* Texte masqué visuellement, lu par les lecteurs d’écran (titre offre) */
.atm-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Page Qui suis-je — entête */
.atm-page-hero--apropos {
    background: #FEEAE7;
}

.atm-page-hero--apropos::before {
    background: transparent;
}

.atm-page-hero--apropos .atm-section-badge {
    background: #FCC0B6;
    color: #FEEAE7;
    border-color: rgba(3, 4, 95, .1);
}

/* Page Qui suis-je — badge « Mon histoire » */
.atm-apropos-bio .atm-section-badge {
    background: #FCC0B6;
    color: #FEEAE7;
    border-color: rgba(3, 4, 95, .1);
}

/* Page Qui suis-je — section « Ce que vous gagnez vraiment » (réutilise [atm_avantages]) */
.atm-apropos-gains .atm-avantages {
    background: #FEEAE7;
}

.atm-apropos-gains .atm-avantages .atm-section-header .atm-section-badge {
    background: #FCC0B6;
    color: #FEEAE7;
    border-color: rgba(3, 4, 95, .1);
}

/* ===========================================
   OFFRE DETAIL (mobile base)
   =========================================== */
.atm-offre-detail .atm-container {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    align-items: start;
}

.atm-offre-content h2 {
    font-family: var(--atm-font-titre);
    color: var(--atm-bleu);
    font-size: clamp(1.5rem, 6vw, 2rem);
    margin-bottom: 24px;
}

.atm-offre-content p {
    margin-bottom: 16px;
    color: #555;
    line-height: 1.8;
}

.atm-offre-content h3 {
    color: var(--atm-bleu);
}

/* Offre includes grid (mobile base) */
.atm-offre-includes {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.atm-offre-include-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: var(--atm-rose-clair);
    border-radius: 12px;
    padding: 16px;
}

.atm-oii-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--atm-blanc);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--atm-bleu);
    font-size: 1.1rem;
    box-shadow: var(--atm-ombre);
}

.atm-oii-text {
    color: var(--atm-gris-texte);
    font-size: .95rem;
    font-weight: 600;
    line-height: 1.5;
}

/* TIP box */
.atm-offre-tip {
    border-radius: 16px;
    padding: 16px 24px 28px;
    margin-top: 36px;
    text-align: center;
}

.atm-offre-tip h3 {
    color: var(--atm-bleu);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
}

.atm-offre-tip p {
    color: #444;
    margin: 0 auto;
    max-width: 40rem;
    text-align: center;
}

/* Sidebar (mobile base) */
.atm-offre-sidebar {
    position: static;
    width: 100%;
}

.atm-offre-cta-card {
    background: var(--atm-blanc);
    border-radius: var(--atm-rayon);
    padding: 32px;
    text-align: center;
    box-shadow: var(--atm-ombre);
    border: var(--atm-border);
}

.atm-offre-cta-card h3 {
    font-family: var(--atm-font-titre);
    color: var(--atm-bleu);
    font-size: 1.5rem;
    margin-bottom: 12px;
}

.atm-offre-cta-card p {
    color: #555;
    margin-bottom: 20px;
}

.atm-price-display {
    margin-bottom: 20px;
}

.atm-amount {
    font-family: var(--atm-font-titre);
    font-size: 3rem;
    font-weight: 700;
    color: var(--atm-jaune-fonce);
    display: block;
    line-height: 1;
}

.atm-price-label {
    color: #555;
    font-size: .9rem;
    display: block;
    margin-top: 8px;
    line-height: 1.5;
}

.atm-offre-cta-buttons {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.atm-offre-info-box {
    border-radius: 16px;
    padding: 24px;
    margin-top: 20px;
}

.atm-offre-info-box h4 {
    color: var(--atm-bleu);
    margin-bottom: 8px;
}

.atm-offre-info-box h4 i {
    margin-right: 8px;
}

.atm-offre-info-box p {
    color: #555;
    font-size: .9rem;
    margin: 0;
}

/* Offre : sous-titres de contenu */
.atm-offre-subtitle {
    margin-top: 32px;
    margin-bottom: 16px;
}

/* Offre : liste zones */
.atm-offre-zones-list {
    list-style: disc;
    padding-left: 24px;
    color: #555;
    line-height: 2;
}

/* Offre : icone astuce */
.atm-offre-tip h3 i {
    margin-right: 0;
    color: var(--atm-jaune-fonce);
}

/* Cross-sell */
.atm-cross-sell {
    padding: 80px 0;
    text-align: center;
}

.atm-cross-sell h2 {
    margin: 12px 0 24px;
}

.atm-cross-sell-actions {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

.atm-cross-cards {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.atm-cross-card {
    width: 100%;
}

/* CTA finale (page A propos) */
.atm-cta-finale {
    background: var(--atm-bleu);
    padding: 64px 0;
    text-align: center;
}

.atm-cta-finale h2 {
    color: var(--atm-blanc);
    margin-bottom: 12px;
}

.atm-cta-finale p {
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 28px;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
}

.atm-cta-finale-actions {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}

.atm-btn-cta-light {
    border-color: var(--atm-blanc);
    color: var(--atm-blanc);
}

.atm-btn-cta-light:hover {
    background: var(--atm-blanc);
    color: var(--atm-bleu);
    transform: translateY(-2px);
}

/* CTA finale — bouton secondaire : rose + texte bleu, survol jaune (page À propos ; WA = jaune or global) */
.atm-cta-finale .atm-btn-secondary.atm-btn-cta-light {
    background: #FCC0B6;
    color: #03045F;
    border-color: #FCC0B6;
}

.atm-cta-finale .atm-btn-secondary.atm-btn-cta-light:hover {
    background: var(--atm-jaune-fonce);
    border-color: var(--atm-jaune-fonce);
    color: #03045F;
    transform: translateY(-2px);
}

.atm-cta-finale .atm-btn-secondary.atm-btn-cta-light:focus-visible {
    background: var(--atm-jaune-fonce);
    border-color: var(--atm-jaune-fonce);
    color: #03045F;
}

/* Mentions/CGV contenu */
.atm-mentions-section {
    padding: 60px 0;
    background: var(--atm-blanc);
}

.atm-mentions-container {
    max-width: 800px;
    color: #333;
    font-family: var(--atm-font-corps);
    line-height: 1.8;
    font-size: 1rem;
}

/* À propos bio (mobile base) */
.atm-apropos-bio .atm-container {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas:
        "image"
        "content"
        "values";
    gap: 48px;
    align-items: start;
}

.atm-apropos-bio-img {
    grid-area: image;
}

.atm-apropos-bio-content {
    grid-area: content;
}

.atm-apropos-values-wrap {
    grid-area: values;
}

.atm-apropos-values-wrap .atm-offre-subtitle {
    margin-top: 0;
}

.atm-apropos-bio-img .atm-img-frame {
    width: 100%;
    max-width: 240px;
    margin: 0 auto;
    border-radius: 24px;
    box-shadow: var(--atm-ombre);
}

.atm-apropos-bio-img .atm-img-frame__img {
    border-radius: 24px;
    width: 100%;
    max-width: 240px;
    margin: 0 auto;
    min-height: 200px;
    max-height: 360px;
    object-fit: cover;
    object-position: var(--atm-img-x, 50%) var(--atm-img-y, 50%);
    transform: scale(calc(var(--atm-img-zoom, 100) / 100));
    transform-origin: var(--atm-img-x, 50%) var(--atm-img-y, 50%);
    display: block;
}

.atm-diplome-badge {
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 12px;
    align-items: center;
    background: var(--atm-jaune-clair);
    border-radius: 16px;
    padding: 20px 24px;
    margin-top: 24px;
}

/* Encadré diplôme — Qui suis-je : ~25 % moins haut, logo x1.25 (mobile-first) */
.atm-apropos-bio .atm-diplome-badge {
    gap: 9px;
    padding: 15px 18px;
    margin-top: 18px;
}

.atm-db-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Diplome badge image (mobile base) */
.atm-db-icon img {
    width: 100px;
    height: 100px;
    object-fit: contain;
}

.atm-apropos-bio .atm-db-icon img {
    width: 125px;
    height: 125px;
}

@media (max-width: 640px) {
    .atm-apropos-bio .atm-diplome-badge {
        padding: 0 18px 15px 18px;
        gap: 0;
    }

    .atm-apropos-bio .atm-db-icon img {
        width: min(250px, 85vw);
        height: min(250px, 85vw);
    }
}

.atm-diplome-badge h4 {
    color: var(--atm-bleu);
    margin-top: 0;
    margin-bottom: 4px;
}

.atm-apropos-bio .atm-diplome-badge > div:not(.atm-db-icon) {
    margin: 0;
    padding: 0;
}

.atm-diplome-badge p {
    color: #555;
    font-size: .9rem;
    margin: 0;
}

.atm-apropos-values {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 16px;
}

.atm-apropos-value-item {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.atm-avi-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--atm-rose-clair);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--atm-bleu);
    flex-shrink: 0;
}

.atm-avi-text strong {
    display: block;
    color: var(--atm-bleu);
    margin-bottom: 2px;
}

.atm-avi-text span {
    color: #555;
    font-size: .9rem;
}

/* ===========================================
   MODAL CONTACT
   =========================================== */
.atm-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(3, 4, 95, .8);
    z-index: 9999999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: var(--atm-transition);
}

.atm-modal-overlay:target,
.atm-modal-overlay.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.atm-modal-content {
    background: var(--atm-blanc);
    padding: 40px;
    border-radius: 24px;
    width: 95%;
    max-width: 540px;
    position: relative;
    transform: translateY(20px) scale(0.95);
    transition: var(--atm-transition);
    max-height: 90vh;
    overflow-y: auto;
    text-align: left;
}

.atm-modal-overlay:target .atm-modal-content,
.atm-modal-overlay.open .atm-modal-content {
    transform: translateY(0) scale(1);
}

.atm-modal-close {
    position: absolute;
    top: 24px;
    right: 28px;
    font-size: 1.5rem;
    color: #999;
    text-decoration: none;
    transition: var(--atm-transition);
}

.atm-modal-close:hover {
    color: var(--atm-bleu);
    transform: rotate(90deg);
}

.atm-modal-title {
    color: var(--atm-bleu);
    font-family: var(--atm-font-titre);
    font-size: 1.8rem;
    margin-bottom: 24px;
    text-align: left;
}

.atm-modal-form {
    padding: 0;
    box-shadow: none;
}

.atm-modal-form .atm-form-group input,
.atm-modal-form .atm-form-group select,
.atm-modal-form .atm-form-group textarea {
    background: var(--atm-gris-doux);
    color: var(--atm-gris-texte);
}

.atm-btn-full {
    width: 100%;
}

/* =========================================
   PAGES LÉGALES (CGV / Mentions)
   ========================================= */
.atm-mentions-content h2 {
    margin-top: 40px;
    margin-bottom: 24px;
    font-size: clamp(1.5rem, 6vw, 2rem);
    color: var(--atm-bleu);
}

.atm-mentions-content h2:first-child {
    margin-top: 0;
}

.atm-mentions-content h3 {
    margin-top: 28px;
    margin-bottom: 16px;
    font-size: clamp(1.2rem, 5vw, 1.5rem);
    color: var(--atm-bleu);
}

.atm-mentions-content p,
.atm-mentions-content ul {
    margin-bottom: 20px;
    font-size: 1rem;
    color: #4A4A5A;
    line-height: 1.8;
}

.atm-mentions-content ul {
    list-style-type: disc;
    margin-left: 20px;
}

.atm-mentions-content ul li {
    margin-bottom: 8px;
}

.atm-mentions-content a {
    color: var(--atm-bleu);
    text-decoration: underline;
}

.atm-mentions-content hr {
    margin: 60px 0;
    border: none;
    border-top: 1px solid rgba(3, 4, 95, 0.1);
}

/* ===========================================
   AVADA THEME OVERRIDES
   =========================================== */
footer.atm-footer h4,
footer.atm-footer .atm-footer-col h4,
.atm-footer nav h4 {
    color: var(--atm-blanc) !important;
    font-family: var(--atm-font-corps) !important;
}

footer.atm-footer .atm-footer-col li,
footer.atm-footer .atm-footer-col a {
    color: rgba(255, 255, 255, 0.75) !important;
}

footer.atm-footer .atm-footer-col a:hover {
    color: var(--atm-jaune-fonce) !important;
}

footer.atm-footer .atm-footer-brand p,
footer.atm-footer .atm-footer-bottom,
footer.atm-footer .atm-footer-bottom span {
    color: rgba(255, 255, 255, 0.6) !important;
}

/* ===========================================
   RESPONSIVE — min-width: 481px
   =========================================== */
@media (min-width: 481px) {
    .atm-section-badge {
        font-size: .85rem;
        padding: 8px 20px;
    }

    .atm-btn {
        padding: 0 40px;
        font-size: 1rem;
    }

    .atm-footer {
        padding: 48px 0 24px;
    }

    .atm-page-hero {
        padding: 100px 0 48px;
    }

    .atm-page-hero h1 {
        font-size: clamp(1.8rem, 8vw, 2.5rem);
    }

    .atm-page-hero-title--icon-only > i {
        font-size: 3.5rem;
    }

    .atm-page-hero p,
    body .atm-page-hero .atm-container p {
        font-size: 1rem;
        padding: 0 16px;
    }
}

/* ===========================================
   RESPONSIVE — min-width: 641px
   =========================================== */
@media (min-width: 641px) {
    .atm-container {
        padding: 0 32px;
    }

    .atm-section {
        padding: 64px 0;
    }

    .atm-promesse-strip .atm-container {
        flex-direction: row;
        gap: 40px;
    }

    .atm-offre-includes {
        grid-template-columns: 1fr 1fr;
    }

    .atm-apropos-values {
        grid-template-columns: 1fr 1fr;
    }

    .atm-diplome-badge {
        flex-direction: row;
        text-align: left;
        align-items: center;
        gap: 16px;
    }

    .atm-db-icon img {
        width: 160px;
        height: 160px;
    }

    .atm-apropos-bio .atm-diplome-badge {
        gap: 12px;
        padding: 0 22px;
        margin-top: 20px;
    }

    .atm-apropos-bio .atm-db-icon img {
        width: 200px;
        height: 200px;
    }

    .atm-apropos-bio-img .atm-img-frame,
    .atm-apropos-bio-img .atm-img-frame__img {
        max-width: 100%;
        margin: 0;
    }

    .atm-mentions-content h2 {
        margin-top: 60px;
        font-size: clamp(2rem, 5vw, 2.5rem);
    }

    .atm-mentions-content h3 {
        margin-top: 40px;
        font-size: clamp(1.4rem, 3.5vw, 1.8rem);
    }

    .atm-mentions-content p,
    .atm-mentions-content ul {
        font-size: 1.1rem;
    }
}

/* ===========================================
   RESPONSIVE — min-width: 769px
   =========================================== */
@media (min-width: 769px) {
    /* Hero amélioré */
    .atm-hero {
        padding: 100px 0 64px;
    }

    .atm-hero h1 {
        font-size: clamp(2.5rem, 6vw, 4.5rem);
        overflow-wrap: normal;
        word-break: normal;
    }

    .atm-hero-subtitle {
        font-size: 1.25rem;
    }

    .atm-hero-actions {
        flex-direction: row;
        align-items: center;
    }

    .atm-hero::before {
        width: 800px;
        height: 800px;
    }

    .atm-hero::after {
        width: 600px;
        height: 600px;
    }

    /* Grilles 2 colonnes */
    .atm-piliers-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .atm-avantages-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 32px;
    }

    .atm-avantage-card {
        padding: 40px;
        gap: 24px;
    }

    .atm-avantage-icon {
        width: 80px;
        height: 80px;
        font-size: 2.8rem;
    }

    .atm-avantage-text h3 {
        font-size: 1.5rem;
    }

    .atm-avantage-text p {
        font-size: 1.05rem;
    }

    .atm-portfolio-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 40px;
    }

    .atm-temoignages-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 32px;
    }

    .atm-temoignage-card {
        padding: 40px;
    }

    /* Navbar desktop */
    .atm-hamburger {
        display: none;
    }

    .atm-navbar .atm-container {
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .atm-navbar-logo img {
        height: 56px;
    }

    .atm-navbar-links {
        display: flex;
        position: static;
        flex-direction: row;
        align-items: center;
        gap: 32px;
        padding: 0;
        background: transparent;
        box-shadow: none;
        z-index: auto;
    }

    .atm-navbar-links li {
        border-bottom: none;
        padding: 0;
    }

    .atm-navbar-links a {
        font-size: .95rem;
        display: inline;
    }

    .atm-btn-nav {
        text-align: initial;
        margin-top: 0;
    }

    /* Footer tablette */
    .atm-footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px;
    }

    .atm-footer-bottom {
        flex-direction: row;
        justify-content: space-between;
        text-align: left;
        gap: 12px;
    }

    /* Page hero */
    .atm-page-hero p,
    body .atm-page-hero .atm-container p {
        font-size: 1.2rem;
        max-width: 640px;
        padding: 0;
    }

    /* Cross-sell tablette */
    .atm-cross-cards {
        flex-direction: row;
        align-items: center;
    }

    .atm-cross-card {
        max-width: 400px;
    }
}

/* ===========================================
   RESPONSIVE — min-width: 1025px (desktop)
   =========================================== */
@media (min-width: 1025px) {
    /* Hero 2 colonnes */
    .atm-hero {
        padding: 64px 0;
    }

    .atm-hero .atm-container {
        grid-template-columns: 1fr 1fr;
        gap: 60px;
    }

    .atm-hero-badge {
        position: absolute;
        bottom: 0px;
        left: -20px;
        margin-top: 0;
    }

    .atm-hero-image-wrap {
        max-height: none;
        overflow: visible;
        border-radius: 0;
        position: relative;
    }

    .atm-hero-image-wrap .atm-img-frame {
        max-height: none;
        border-radius: 32px;
    }

    .atm-hero-image-wrap .atm-img-frame__img {
        border-radius: 32px;
        max-height: 640px;
    }

    /* Grilles 3 colonnes */
    .atm-piliers-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .atm-parcours-steps {
        grid-template-columns: repeat(3, 1fr);
        gap: 40px;
    }

    .atm-parcours-steps::before {
        display: block;
    }

    .atm-temoignages-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    /* Sections 2 colonnes desktop */
    .atm-apropos-home .atm-container {
        grid-template-columns: 1fr 1fr;
        gap: 64px;
    }

    .atm-contact-grid {
        grid-template-columns: 1fr 1fr;
        gap: 60px;
    }

    /* Footer 3 colonnes */
    .atm-footer-grid {
        grid-template-columns: 2fr 1fr 1fr;
        gap: 48px;
    }

    /* Page hero desktop */
    .atm-page-hero {
        padding: 140px 0 80px;
    }

    .atm-page-hero h1 {
        font-size: clamp(2.5rem, 5vw, 4rem);
    }

    .atm-page-hero-title--icon-only > i {
        font-size: 4.25rem;
    }

    /* Offre detail 2 colonnes */
    .atm-offre-detail .atm-container {
        grid-template-columns: 1fr 380px;
        gap: 48px;
    }

    .atm-offre-content h2 {
        font-size: 2rem;
    }

    .atm-offre-sidebar {
        position: sticky;
        top: 100px;
        width: auto;
    }

    /* À propos bio 2 colonnes */
    .atm-apropos-bio .atm-container {
        grid-template-columns: 1fr 1.5fr;
        grid-template-areas:
            "image content"
            "values content";
        column-gap: 64px;
        row-gap: 24px;
    }
}

/* ===========================================
   ACCESSIBILITE — prefers-reduced-motion
   =========================================== */
@media (prefers-reduced-motion: reduce) {
    .atm-reveal {
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        transition: none !important;
        animation: none !important;
    }

    .atm-reveal-up,
    .atm-reveal-left,
    .atm-reveal-right,
    .atm-reveal-scale {
        transform: none !important;
    }

    .atm-img-parallax:hover .atm-img-frame__img,
    .atm-pilier-card:hover,
    .atm-parcours-step:hover,
    .atm-avantage-card:hover,
    .atm-portfolio-item:hover,
    .atm-temoignage-card:hover {
        transform: none !important;
    }

    .atm-btn:hover,
    .atm-btn-primary:hover,
    .atm-btn-secondary:hover,
    .atm-btn-yellow:hover,
    .atm-btn-whatsapp:hover {
        transform: none !important;
    }

    *,
    *::before,
    *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}