@media (max-width: 1050px) {



    .header-whatsapp-button {

        display: none;

    }



    .menu-toggle {

        display: block;

        order: 3;

    }



    .main-navigation {

        position: fixed;

        top: var(--header-height);

        left: 0;

        right: 0;

        max-height: calc(100vh - var(--header-height));

        padding: 24px;

        overflow-y: auto;

        background-color: var(--color-surface);

        border-top: 1px solid var(--color-border);

        opacity: 0;

        visibility: hidden;

        transform: translateY(-12px);

        transition:

            opacity var(--transition-normal),

            visibility var(--transition-normal),

            transform var(--transition-normal);

    }



    .main-navigation.open {

        opacity: 1;

        visibility: visible;

        transform: translateY(0);

    }



    .navigation-list {

        align-items: stretch;

        flex-direction: column;

    }



    .navigation-link {

        width: 100%;

        justify-content: space-between;

        border-radius: var(--border-radius-small);

    }



    .dropdown-menu {

        position: static;

        width: 100%;

        max-height: 0;

        padding: 0 10px;

        border: 0;

        box-shadow: none;

        opacity: 1;

        visibility: visible;

        overflow: hidden;

        transform: none;

    }



    .navigation-dropdown.open .dropdown-menu {

        max-height: 700px;

        padding-top: 8px;

        padding-bottom: 8px;

    }



    .footer-container {

        grid-template-columns: repeat(2, 1fr);

    }



}



@media (max-width: 700px) {



    :root {

        --header-height: 76px;

    }



    .section-container,

    .header-container,

    .footer-container {

        width: min(100% - 28px, var(--container-width));

    }



    .brand-logo {

        width: 100px;

    }

    .hero-content h1 {

        font-size: clamp(2.7rem, 14vw, 4.4rem);

    }


    .button {

        width: 100%;

    }



    .intro-section {

        padding: 72px 0;

    }



    .footer-container {

        grid-template-columns: 1fr;

    }



    .footer-bottom {

        align-items: flex-start;

        flex-direction: column;

    }



    .floating-whatsapp-button {

        right: 14px;

        bottom: 14px;

    }



}

@media (max-width: 950px) {


    .services-grid {

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }



    .values-grid {

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }




}

@media (max-width: 700px) {



    .about-preview-section,

    .audience-section,

    .services-preview-section,

    .values-section {

        padding: 72px 0;

    }



    .about-preview-image img {

        min-height: 380px;

    }


}

@media (max-width: 900px) {



}

@media (max-width: 700px) {



    .page-hero {

        min-height: 450px;

    }



    .page-hero-content {

        padding-top: 95px;

        padding-bottom: 64px;

    }





}

@media (max-width: 1050px) {



    .individual-services-grid {

        grid-template-columns: 1fr;

    }


}

@media (max-width: 900px) {



    .individual-intro-grid,

    .psio-programs-preview-grid {

        grid-template-columns: 1fr;

        gap: 50px;

    }



    .psio-programs-preview-visual {

        min-height: 440px;

    }



    .individual-practical-grid {

        grid-template-columns: 1fr;

    }



}



@media (max-width: 700px) {



    .individual-intro-section,

    .individual-services-section,

    .psio-programs-preview-section,

    .individual-commitment-section,

    .individual-practical-section {

        padding: 76px 0;

    }



    .individual-service-card {

        grid-template-columns: 1fr;

    }



    .individual-service-visual {

        min-height: 240px;

    }



    .individual-service-content {

        padding: 34px 26px;

    }



    .psio-programs-preview-visual {

        min-height: 360px;

    }



    .individual-commitment-card {

        grid-template-columns: 1fr;

        padding: 38px 26px;

    }



    .individual-commitment-symbol {

        width: 90px;

        height: 90px;

        font-size: 3rem;

    }



}


/* =========================================================

   RESPONSIVE PAGE ENTREPRISES

========================================================= */



@media (max-width: 1100px) {



    .business-benefits-grid,

    .business-why-grid {

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }


    .business-process {

        grid-template-columns: repeat(3, minmax(0, 1fr));

        row-gap: 50px;

    }



    .business-process::before {

        display: none;

    }



}



@media (max-width: 900px) {



    .business-hero-grid,

    .business-intro-grid,

    .employee-benefits-grid,

    .business-faq-grid,

    .agefiph-card {

        grid-template-columns: 1fr;

        gap: 50px;

    }



    .business-hero-visual {

        min-height: 460px;

    }



    .agefiph-card {

        padding: 44px;

    }



    .business-process {

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }



}



@media (max-width: 700px) {



    .business-hero,

    .business-intro-section,

    .business-benefits-section,

    .business-services-section,

    .employee-benefits-section,

    .agefiph-section,

    .business-why-section,

    .business-process-section,

    .business-faq-section {

        padding: 76px 0;

    }



    .business-hero-content h1 {

        font-size: clamp(3.4rem, 16vw, 5.4rem);

    }



    .business-hero-actions {

        flex-direction: column;

    }



    .business-hero-actions .button {

        width: 100%;

    }



    .business-hero-visual {

        min-height: 360px;

    }



    .business-benefits-grid,

    .business-services-grid,

    .business-why-grid,

    .employee-benefits-list,

    .business-process {

        grid-template-columns: 1fr;

    }



    .business-benefit-card,

    .business-why-grid article {

        min-height: auto;

    }



    .business-service-card {

        min-height: 360px;

        padding: 30px 26px;

    }



    .agefiph-card {

        padding: 30px 22px;

    }



    .agefiph-percentage {

        padding: 38px 24px;

    }



    .business-process article {

        padding: 0;

        text-align: left;

    }



    .business-process span {

        margin-bottom: 18px;

    }



}

/* =========================================================

   RESPONSIVE PAGE TARIFS

========================================================= */



@media (max-width: 1050px) {



    .pricing-grid {

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }



    .pricing-steps-grid {

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }



    .pricing-cta-content {

        align-items: flex-start;

        flex-direction: column;

    }



    .pricing-cta-buttons {

        width: 100%;

    }



}



@media (max-width: 700px) {



    .pricing-hero {

        padding: 90px 0;

    }



    .pricing-hero h1 {

        font-size: clamp(3.2rem, 16vw, 5.2rem);

    }



    .pricing-hero-buttons {

        align-items: stretch;

        flex-direction: column;

    }



    .pricing-hero-buttons .button {

        width: 100%;

    }



    .pricing-intro,

    .pricing-services,

    .pricing-steps,

    .pricing-faq,

    .pricing-cta {

        padding: 76px 0;

    }



    .pricing-grid,

    .pricing-steps-grid {

        grid-template-columns: 1fr;

    }



    .pricing-card {

        min-height: auto;

        padding: 32px 26px;

    }



    .pricing-top {

        margin-bottom: 32px;

    }



    .pricing-steps-grid article {

        padding: 30px 26px;

    }



    .pricing-cta-buttons {

        flex-direction: column;

    }



    .pricing-cta-buttons .button {

        width: 100%;

    }



}

/* =========================================================

   RESPONSIVE GALERIE

========================================================= */



@media (max-width:1100px){



.gallery-grid{



grid-template-columns:repeat(2,minmax(0,1fr));



}



.gallery-services{



grid-template-columns:repeat(2,minmax(0,1fr));



}



.gallery-business-grid{



grid-template-columns:repeat(2,minmax(0,1fr));



}



.gallery-item.large,



.gallery-item.wide{



grid-column:span 2;



}



.gallery-item.tall{



grid-row:auto;



min-height:380px;



}



}



@media (max-width:850px){



.atmosphere-grid{



grid-template-columns:1fr;



gap:50px;



}



.gallery-cta-content{



flex-direction:column;



align-items:flex-start;



}



}



@media (max-width:700px){



.gallery-hero{



padding:90px 0;



}



.gallery-hero h1{



font-size:clamp(3.2rem,16vw,5.4rem);



}



.gallery-buttons{



flex-direction:column;



}



.gallery-buttons .button{



width:100%;



}



.gallery-grid,



.gallery-services,



.gallery-business-grid{



grid-template-columns:1fr;



}



.gallery-item.large,



.gallery-item.wide{



grid-column:auto;



}



.gallery-item,



.gallery-atmosphere-image{



min-height:300px;



}



.gallery-intro,



.gallery-grid-section,



.gallery-care,



.gallery-business,



.gallery-atmosphere,



.gallery-quote,



.gallery-cta{



padding:76px 0;



}



.gallery-cta-buttons{



flex-direction:column;



width:100%;



}



.gallery-cta-buttons .button{



width:100%;



}



}

/* =========================================================

   RESPONSIVE PAGES PRESTATIONS

========================================================= */



@media (max-width: 1050px) {



    .service-hero-grid {

        grid-template-columns: 1fr;

        gap: 50px;

    }



    .service-image-placeholder {

        min-height: 460px;

    }



    .benefits-grid,

    .why-grid {

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }



    .session-grid {

        grid-template-columns: 1fr;

        gap: 50px;

    }



    .service-cta-content {

        align-items: flex-start;

        flex-direction: column;

    }



    .service-cta-buttons {

        width: 100%;

    }



}



@media (max-width: 700px) {



    .service-hero {

        padding: 90px 0;

    }



    .service-hero h1 {

        font-size: clamp(3.3rem, 16vw, 5.3rem);

    }



    .service-buttons {

        align-items: stretch;

        flex-direction: column;

    }



    .service-buttons .button {

        width: 100%;

    }



    .service-image-placeholder {

        min-height: 340px;

        font-size: 1.5rem;

    }



    .service-introduction,

    .benefits-section,

    .session-section,

    .precautions-section,

    .why-service,

    .service-faq,

    .service-cta {

        padding: 76px 0;

    }



    .benefits-grid,

    .why-grid {

        grid-template-columns: 1fr;

    }



    .benefits-grid article,

    .why-grid article {

        padding: 30px 26px;

    }



    .session-steps article {

        padding: 28px 24px;

    }



    .precautions-card {

        padding: 32px 24px;

    }



    .service-cta-buttons {

        flex-direction: column;

    }



    .service-cta-buttons .button {

        width: 100%;

    }



}

@media (max-width: 1050px) {



    .psio-programs-grid {

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }



}



@media (max-width: 700px) {



    .psio-programs-section {

        padding: 76px 0;

    }



    .psio-programs-grid {

        grid-template-columns: 1fr;

    }



    .psio-program-card {

        min-height: auto;

        padding: 30px 26px;

    }



}

/* =========================================================

   RESPONSIVE PAGE FAQ

========================================================= */



@media (max-width: 950px) {



    .faq-layout {

        grid-template-columns: 1fr;

        gap: 50px;

    }



    .faq-categories {

        position: static;

    }



    .faq-categories nav {

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }



    .faq-contact-card {

        grid-template-columns: 1fr;

        gap: 45px;

    }



}



@media (max-width: 700px) {



    .faq-hero {

        padding: 90px 0;

    }



    .faq-hero h1 {

        font-size: clamp(3.2rem, 16vw, 5.2rem);

    }



    .faq-hero-actions {

        flex-direction: column;

    }



    .faq-hero-actions .button {

        width: 100%;

    }



    .faq-intro-section,

    .faq-content-section,

    .faq-contact-section {

        padding: 76px 0;

    }



    .faq-categories {

        padding: 24px;

    }



    .faq-categories nav {

        grid-template-columns: 1fr;

    }



    .faq-groups {

        gap: 60px;

    }



    .faq-group-heading {

        flex-direction: column;

    }



    .faq-accordion summary {

        padding: 22px 56px 22px 22px;

        font-size: 1.25rem;

    }



    .faq-accordion summary::after {

        right: 22px;

    }



    .faq-accordion details p {

        padding: 0 22px 22px;

    }



    .faq-contact-card {

        padding: 36px 26px;

    }



    .faq-contact-actions .button {

        width: 100%;

    }



}


@media (max-width: 1050px) {



    .contact-cards {

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }



}



@media (max-width: 900px) {



    .contact-hero-grid,

    .contact-grid,

    .contact-practical-grid,

    .contact-social-grid,

    .contact-faq-grid {

        grid-template-columns: 1fr;

        gap: 50px;

    }



    .contact-image-placeholder,

    .contact-map-placeholder {

        min-height: 420px;

    }



}



@media (max-width: 700px) {



    .contact-hero {

        padding: 90px 0;

    }



    .contact-hero h1 {

        font-size: clamp(3.2rem, 16vw, 5.2rem);

    }



    .contact-buttons {

        flex-direction: column;

    }



    .contact-buttons .button {

        width: 100%;

    }



    .contact-information,

    .contact-form-section,

    .contact-practical-section,

    .contact-social-section,

    .contact-faq-section {

        padding: 76px 0;

    }



    .contact-cards {

        grid-template-columns: 1fr;

    }



    .contact-cards article {

        min-height: auto;

    }



    .contact-form {

        grid-template-columns: 1fr;

        padding: 30px 24px;

    }



    .form-group.full-width {

        grid-column: auto;

    }



    .contact-form > .button {

        grid-column: auto;

        width: 100%;

    }



    .contact-image-placeholder,

    .contact-map-placeholder {

        min-height: 340px;

    }



    .contact-social-actions .button {

        width: 100%;

    }



}

@media (max-width: 900px) {



    .contact-modalities-grid,

    .contact-professional-card {

        grid-template-columns: 1fr;

        gap: 50px;

    }



}



@media (max-width: 700px) {



    .contact-hero-panel {

        padding: 32px 24px;

    }



    .contact-modalities-section,

    .contact-professional-section {

        padding: 76px 0;

    }



    .contact-modalities-list article {

        padding: 24px;

    }



    .contact-professional-card {

        padding: 36px 26px;

    }



    .contact-professional-actions .button {

        width: 100%;

    }



    .form-consent {

        grid-column: auto;

    }



}


@media (max-width: 950px) {



    .legal-layout {

        grid-template-columns: 1fr;

        gap: 45px;

    }



    .legal-navigation {

        position: static;

    }



    .legal-navigation nav {

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }



}



@media (max-width: 700px) {



    .legal-hero {

        padding: 90px 0 75px;

    }



    .legal-hero h1 {

        font-size: clamp(3.2rem, 16vw, 5.2rem);

    }



    .legal-content-section {

        padding: 76px 0;

    }



    .legal-navigation {

        padding: 24px;

    }



    .legal-navigation nav {

        grid-template-columns: 1fr;

    }



    .legal-card,

    .legal-update-card {

        padding: 30px 24px;

    }



    .legal-information-list > div {

        grid-template-columns: 1fr;

        gap: 7px;

    }



}

/* =========================================================

   RESPONSIVE CONTACT FINAL

========================================================= */



@media (max-width: 950px) {



    .contact-hero-final .contact-hero-grid,

    .contact-grid-final {

        grid-template-columns: 1fr;

    }



    .contact-steps-grid {

        grid-template-columns: 1fr;

    }



    .contact-steps-grid article {

        min-height: auto;

    }



}



@media (max-width: 700px) {



    .contact-hero-final {

        padding: 82px 0;

    }



    .contact-hero-final .contact-hero-panel {

        min-height: auto;

        padding: 32px 24px;

    }



    .contact-information-final,

    .contact-form-section-final,

    .contact-steps-section,

    .contact-professional-final,

    .contact-faq-final {

        padding: 72px 0;

    }



    .contact-cards-final article {

        min-height: auto;

    }



    .contact-form-final {

        grid-template-columns: 1fr;

        padding: 28px 22px;

    }



    .contact-form-final .full-width,

    .contact-form-final .form-consent,

    .contact-form-final .form-status,

    .contact-form-final .button {

        grid-column: auto;

    }



    .contact-form-final .button {

        width: 100%;

    }



}

/* =========================================================

   RESPONSIVE MENU PRINCIPAL

========================================================= */



@media (max-width: 950px) {



    .menu-toggle {

        display: block;

        position: relative;

        z-index: 1002;

    }



    .main-navigation {

        position: fixed;

        inset: var(--header-height, 80px) 0 0;

        z-index: 1000;

        padding: 28px 22px 40px;

        overflow-y: auto;

        background-color: var(--color-surface);

        opacity: 0;

        visibility: hidden;

        transform: translateX(100%);

        transition:

            opacity 0.3s ease,

            visibility 0.3s ease,

            transform 0.3s ease;

    }



    .main-navigation.is-open {

        opacity: 1;

        visibility: visible;

        transform: translateX(0);

    }



    .navigation-list {

        display: grid;

        align-items: stretch;

        gap: 8px;

    }



    .navigation-list > li {

        width: 100%;

    }



    .navigation-link,

    .dropdown-toggle {

        width: 100%;

        display: flex;

        align-items: center;

        justify-content: space-between;

        padding: 15px 16px;

        border-radius: 13px;

        text-align: left;

    }



    .navigation-link:hover,

    .navigation-link.active,

    .dropdown-toggle:hover,

    .dropdown-toggle.active {

        background-color: var(--color-background);

    }



    .navigation-dropdown:hover .dropdown-menu,

    .navigation-dropdown:focus-within .dropdown-menu {

        opacity: 0;

        visibility: hidden;

        transform: none;

    }



    .navigation-dropdown.is-open .dropdown-menu {

        max-height: 600px;

        opacity: 1;

        visibility: visible;

    }



    .dropdown-menu {

        position: static;

        width: 100%;

        max-height: 0;

        margin: 4px 0 0;

        padding: 0 0 0 14px;

        border: 0;

        border-radius: 0;

        overflow: hidden;

        background: transparent;

        box-shadow: none;

        opacity: 0;

        visibility: hidden;

        transform: none;

        transition:

            max-height 0.35s ease,

            opacity 0.25s ease,

            visibility 0.25s ease;

    }



    .dropdown-menu a {

        padding: 12px 15px;

    }



    .header-whatsapp-button {

        display: none;

    }



}

@media (max-width: 750px) {



    .cookie-banner {

        right: 12px;

        bottom: 12px;

        left: 12px;

        padding: 22px;

    }



    .cookie-banner-inner {

        grid-template-columns: 1fr;

        gap: 24px;

    }



    .cookie-banner-actions {

        flex-direction: column-reverse;

    }



    .cookie-banner-actions .button {

        width: 100%;

    }



    .cookie-settings-button {

        bottom: 12px;

        left: 12px;

    }



}

@media (max-width:900px){



.service-media-grid,

.service-media-grid-six{



grid-template-columns:repeat(2,1fr);



}



}



@media (max-width:650px){



.service-media-grid,

.service-media-grid-six{



grid-template-columns:1fr;



}



.service-image-real img{



min-height:340px;



}



}

@media (max-width: 1150px) {



    .about-preview-grid {

        gap: 65px;

    }



    .about-experience-card {

        right: -20px;

    }



    .services-grid {

        grid-template-columns:

            repeat(2, minmax(0, 1fr));

    }



    .values-grid {

        grid-template-columns:

            repeat(2, minmax(0, 1fr));

    }



}





@media (max-width: 900px) {


    .about-preview-grid {

        grid-template-columns: 1fr;

        gap: 70px;

    }



    .about-preview-visual {

        width: min(620px, 100%);

        margin-inline: auto;

    }



    .audience-grid {

        grid-template-columns: 1fr;

    }



    .services-heading-row {

        align-items: flex-start;

        flex-direction: column;

        gap: 22px;

    }



    .home-cta-content {

        align-items: flex-start;

        flex-direction: column;

        gap: 45px;

    }



    .home-cta-actions {

        flex-direction: row;

        flex-wrap: wrap;

    }



}





@media (max-width: 700px) {



    .hero-section {

        padding: 70px 0 80px;

    }



    .hero-content h1 {

        font-size: clamp(3.6rem, 16vw, 5.4rem);

    }



    .hero-description {

        font-size: 1rem;

    }



    .hero-actions {

        flex-direction: column;

    }



    .hero-actions .button {

        width: 100%;

    }



    .hero-reassurance {

        flex-direction: column;

        gap: 20px;

    }



    .hero-visual {

        min-height: 470px;

    }



    .hero-visual-main {

        width: 92%;

        height: 410px;

        border-radius: 120px 24px 110px 24px;

    }



    .hero-visual-secondary {

        width: 145px;

        height: 145px;

        border-width: 7px;

    }



    .hero-visual-badge {

        right: 0;

        bottom: 0;

        width: 110px;

        height: 110px;

    }



    .hero-visual-badge span {

        font-size: 1.8rem;

    }



    .hero-visual-badge p {

        font-size: 0.55rem;

    }



    .about-preview-section,

    .audience-section,

    .services-preview-section,

    .values-section {

        padding: 85px 0;

    }



    .about-preview-image {

        min-height: 500px;

        border-radius: 24px 110px 24px 110px;

    }



    .about-preview-image img {

        height: 500px;

    }



    .about-experience-card {

        right: 5px;

        bottom: 20px;

        width: 135px;

        height: 135px;

        border-width: 6px;

    }



    .about-experience-card strong {

        font-size: 2.4rem;

    }



    .about-preview-content h2 {

        font-size: clamp(3rem, 13vw, 4.4rem);

    }



    .audience-card {

        min-height: 500px;

    }



    .audience-card-content {

        padding: 32px 26px;

    }



    .services-grid {

        grid-template-columns: 1fr;

    }



    .service-card-media {

        height: 300px;

    }



    .service-card-content {

        padding: 27px 24px;

    }



    .service-card-content > p:not(.service-card-category) {

        min-height: auto;

    }



    .values-grid {

        grid-template-columns: 1fr;

    }



    .value-card {

        min-height: auto;

        padding: 28px;

    }



    .value-line {

        margin: 20px 0 26px;

    }



    .home-cta-section {

        padding: 85px 0;

    }



    .home-cta-content h2 {

        font-size: clamp(3.2rem, 13vw, 4.7rem);

    }



    .home-cta-actions {

        width: 100%;

        flex-direction: column;

    }



    .home-cta-actions .button {

        width: 100%;

    }



}





@media (max-width: 480px) {


    .service-card-media {

        height: 270px;

    }



    .audience-card {

        min-height: 460px;

    }



}

/* =========================================================

   RESPONSIVE À PROPOS PREMIUM

========================================================= */



@media (max-width: 1150px) {



    .about-hero-grid {

        grid-template-columns:

            minmax(0, 0.95fr)

            minmax(400px, 1.05fr);

        gap: 55px;

    }



    .about-hero-visual {

        min-height: 620px;

    }



    .about-hero-portrait {

        height: 550px;

    }



    .about-story-grid,

    .about-philosophy-grid {

        gap: 65px;

    }



    .about-values-grid {

        grid-template-columns:

            repeat(3, minmax(0, 1fr));

    }



    .about-value-card-highlight {

        grid-column: span 2;

    }



    .about-experience-card {

        grid-template-columns:

            160px minmax(0, 1fr);

    }



    .about-experience-card > .button {

        grid-column: 2;

        justify-self: start;

    }



}





@media (max-width: 900px) {



    .about-hero {

        padding: 85px 0 100px;

    }



    .about-hero-grid {

        grid-template-columns: 1fr;

        gap: 70px;

    }



    .about-hero-content {

        max-width: 760px;

    }



    .about-hero-visual {

        width: min(650px, 100%);

        min-height: 640px;

        margin-inline: auto;

    }



    .about-hero-portrait {

        width: 82%;

        height: 570px;

    }



    .about-story-grid,

    .about-philosophy-grid {

        grid-template-columns: 1fr;

        gap: 70px;

    }



    .about-story-visual {

        width: min(620px, 100%);

        margin-inline: auto;

    }



    .about-philosophy-content {

        max-width: 720px;

    }



    .about-experience-card {

        grid-template-columns: 1fr;

        gap: 35px;

    }



    .about-experience-card > .button {

        grid-column: auto;

    }



}





@media (max-width: 700px) {



    .about-hero {

        padding: 70px 0 80px;

    }



    .about-hero-content h1 {

        font-size: clamp(3.5rem, 15vw, 5.2rem);

    }



    .about-hero-actions {

        flex-direction: column;

    }



    .about-hero-actions .button {

        width: 100%;

    }



    .about-hero-visual {

        min-height: 500px;

    }



    .about-hero-portrait {

        width: 90%;

        height: 435px;

        border-radius: 25px 120px 25px 120px;

    }



    .about-hero-croquis {

        width: 160px;

        height: 210px;

        border-width: 7px;

    }



    .about-hero-badge {

        right: 0;

        bottom: 20px;

        width: 110px;

        height: 110px;

    }



    .about-hero-badge strong {

        font-size: 1.9rem;

    }



    .about-hero-badge span {

        font-size: 0.52rem;

    }



    .about-story-section,

    .about-values-section,

    .about-philosophy-section,

    .about-experience-section {

        padding: 85px 0;

    }



    .about-story-visual {

        min-height: 520px;

        border-radius: 25px 100px 25px 100px;

    }



    .about-story-visual > img {

        height: 520px;

    }



    .about-story-number {

        width: 115px;

        height: 115px;

        font-size: 2.1rem;

    }



    .about-story-number span {

        width: 75px;

        font-size: 0.52rem;

    }



    .about-story-content h2,

    .about-philosophy-content h2 {

        font-size: clamp(3rem, 13vw, 4.5rem);

    }



    .about-values-grid {

        grid-template-columns: 1fr;

    }



    .about-value-card,

    .about-value-card-highlight {

        min-height: auto;

        grid-column: auto;

    }



    .about-value-line {

        margin: 20px 0 28px;

    }



    .about-philosophy-list {

        grid-template-columns: 1fr;

    }



    .about-philosophy-list article {

        min-height: auto;

    }



    .about-philosophy-list span {

        margin-bottom: 25px;

    }



    .about-experience-card {

        padding: 38px 27px;

    }



    .about-experience-year {

        width: 130px;

        height: 130px;

    }



    .about-experience-content h2 {

        font-size: clamp(2.8rem, 12vw, 4.2rem);

    }



    .about-experience-card > .button {

        width: 100%;

    }



}





@media (max-width: 480px) {



    .about-hero-visual {

        min-height: 430px;

    }



    .about-hero-portrait {

        height: 380px;

    }



    .about-hero-croquis {

        width: 130px;

        height: 175px;

    }



    .about-story-visual {

        min-height: 450px;

    }



    .about-story-visual > img {

        height: 450px;

    }



}

@media (max-width: 1100px) {



    .about-values-grid {

        grid-template-columns:

            repeat(3, 1fr);

    }



    .about-philosophy-layout {

        grid-template-columns: 1fr;

    }



    .about-philosophy-visual {

        height: 380px;

    }



    .about-philosophy-list {

        grid-template-columns:

            repeat(2, 1fr);

    }



}





@media (max-width: 700px) {



    .about-values-grid {

        grid-template-columns: 1fr;

    }



    .about-value-card {

        min-height: auto;

    }



    .about-philosophy-visual {

        height: 300px;



        border-radius:

            22px 70px 22px 70px;

    }



    .about-philosophy-list {

        grid-template-columns: 1fr;

    }



    .about-philosophy-list article {

        min-height: auto;

    }



}

/* =========================================================

   RESPONSIVE PAGE 404

========================================================= */



@media (max-width: 700px) {



    .error-section {

        padding: 90px 0 76px;

    }



    .error-code {

        font-size: clamp(8rem, 42vw, 13rem);

    }



    .error-content h1 {

        font-size: clamp(3rem, 14vw, 4.8rem);

    }



    .error-actions {

        flex-direction: column;

    }



    .error-actions .button {

        width: 100%;

    }



    .error-help {

        margin-top: 45px;

        padding: 24px 20px;

    }



    .error-help nav {

        flex-direction: column;

    }



}


/* =========================================================

   ACCUEIL - HERO SLIDER RESPONSIVE

========================================================= */



@media (max-width: 900px) {



    .hero-section {

        min-height: calc(100svh - var(--header-height));

        padding: 75px 0 90px;

        align-items: center;

    }



    .hero-grid {

        display: block;

    }



    .hero-content {

        width: min(650px, 100%);

        max-width: 650px;

    }



    .hero-section::after {

        background:

            linear-gradient(

                90deg,

                rgba(248, 241, 235, 0.95) 0%,

                rgba(248, 241, 235, 0.82) 55%,

                rgba(248, 241, 235, 0.30) 100%

            );

    }



    .hero-slide img {

        object-position: center;

    }

}





@media (max-width: 700px) {



    .hero-section {

        min-height: calc(100svh - var(--header-height));

        padding: 60px 0 80px;

    }



    .hero-content {

        max-width: 100%;

    }



    .hero-content h1 {

        max-width: 520px;

        font-size: clamp(3.2rem, 15vw, 5rem);

        line-height: 0.9;

    }



    .hero-description {

        max-width: 500px;

        font-size: 0.95rem;

        line-height: 1.7;

    }



    .hero-actions {

        width: 100%;

        flex-direction: column;

        align-items: flex-start;

        margin-top: 28px;

    }



    .hero-actions .button {

        width: auto;

        min-width: 220px;

    }



    .hero-reassurance {

        gap: 28px;

        margin-top: 38px;

        padding-top: 22px;

    }



    .hero-section::after {

        background:

            linear-gradient(

                90deg,

                rgba(248, 241, 235, 0.96) 0%,

                rgba(248, 241, 235, 0.88) 58%,

                rgba(248, 241, 235, 0.48) 100%

            );

    }



    .hero-slider-dots {

        bottom: 22px;

    }

}





@media (max-width: 480px) {



    .hero-section {

        min-height: calc(100svh - var(--header-height));

        padding: 50px 0 70px;

    }



    .hero-content h1 {

        font-size: clamp(3rem, 15vw, 4.3rem);

    }



    .hero-actions .button {

        width: 100%;

        min-width: 0;

    }



    .hero-reassurance {

        flex-direction: column;

        gap: 15px;

    }



    .hero-section::after {

        background:

            linear-gradient(

                90deg,

                rgba(248, 241, 235, 0.96) 0%,

                rgba(248, 241, 235, 0.88) 72%,

                rgba(248, 241, 235, 0.58) 100%

            );

    }

}



/* =========================================================

   HERO ACCUEIL RESPONSIVE

========================================================= */



@media (max-width: 900px) {



    .hero-section {

        min-height: calc(100svh - var(--header-height));

    }



    .hero-content {

        max-width: 620px;



        padding-top: 85px;

        padding-bottom: 95px;

    }



    .hero-overlay {

        background:

            linear-gradient(

                90deg,

                rgba(248, 241, 235, 0.96) 0%,

                rgba(248, 241, 235, 0.86) 55%,

                rgba(248, 241, 235, 0.35) 100%

            );

    }



}





@media (max-width: 700px) {



    .hero-content {

        padding-top: 65px;

        padding-bottom: 80px;

    }



    .hero-content h1 {

        font-size: clamp(3.2rem, 15vw, 5rem);

    }



    .hero-actions {

        flex-direction: column;

    }



    .hero-actions .button {

        width: 100%;

    }



    .hero-reassurance {

        flex-direction: column;

        gap: 18px;

    }



    .hero-overlay {

        background:

            rgba(248, 241, 235, 0.83);

    }



}

/* =========================================================

   HERO ACCUEIL FINAL RESPONSIVE

========================================================= */



@media (max-width: 900px) {



    .hero-section {

        height: 680px;

        min-height: 680px;

        padding: 0;

    }



    .hero-section .hero-grid {

        width: min(100% - 40px, 1200px);

    }



    .hero-section .hero-content {

        max-width: 580px;

    }



    .hero-overlay {

        background:

            linear-gradient(

                90deg,

                rgba(248, 241, 235, 0.96) 0%,

                rgba(248, 241, 235, 0.88) 45%,

                rgba(248, 241, 235, 0.42) 75%,

                rgba(248, 241, 235, 0.18) 100%

            );

    }



    .hero-visual,

    .hero-visual-main,

    .hero-visual-secondary,

    .hero-visual-badge {

        display: none !important;

    }



}





@media (max-width: 700px) {



    .hero-section {

        height: auto;

        min-height: 650px;



        padding: 80px 0 70px;

    }



    .hero-section .hero-grid {

        width: min(100% - 30px, 1200px);

    }



    .hero-section .hero-content {

        max-width: 100%;

    }



    .hero-section .hero-content h1 {

        font-size: clamp(3.2rem, 15vw, 4.8rem);

    }



    .hero-section .hero-description {

        max-width: 92%;

        font-size: 0.95rem;

    }



    .hero-section .hero-actions {

        flex-direction: column;

    }



    .hero-section .hero-actions .button {

        width: 100%;

    }



    .hero-section .hero-reassurance {

        flex-direction: column;

        gap: 15px;



        margin-top: 30px;

    }



    .hero-slide img {

        object-position: 65% center;

    }



    .hero-overlay {

        background:

            linear-gradient(

                90deg,

                rgba(248, 241, 235, 0.97) 0%,

                rgba(248, 241, 235, 0.88) 60%,

                rgba(248, 241, 235, 0.55) 100%

            );

    }



    .hero-slider-dots {

        bottom: 18px;

    }



    .about-preview-section {

        padding: 80px 0;

    }



    .about-preview-image img {

        height: 500px;

        object-position: center 15%;

    }



}





@media (max-width: 480px) {



    .hero-section {

        min-height: 620px;

    }



    .hero-section .hero-content h1 {

        font-size: clamp(3rem, 14vw, 4.2rem);

    }



    .hero-slide img {

        object-position: 68% center;

    }



    .about-preview-image img {

        height: 430px;

    }



}




/* =========================================================
   ACCUEIL - HERO SLIDER STABLE
   Ce bloc doit rester le DERNIER bloc responsive du fichier.
========================================================= */

@media (max-width: 900px) {
    .hero-section {
        height: 640px !important;
        min-height: 640px !important;
        max-height: 640px !important;
        padding: 0 !important;
    }

    .hero-section .hero-grid {
        width: min(100% - 40px, var(--container-width)) !important;
    }

    .hero-section .hero-content {
        max-width: 560px !important;
        padding: 0 !important;
    }

    .hero-overlay {
        background: linear-gradient(
            90deg,
            rgba(248, 241, 235, .97) 0%,
            rgba(248, 241, 235, .90) 48%,
            rgba(248, 241, 235, .45) 78%,
            rgba(248, 241, 235, .15) 100%
        ) !important;
    }
}

@media (max-width: 700px) {
    .hero-section {
        height: 610px !important;
        min-height: 610px !important;
        max-height: 610px !important;
        padding: 0 !important;
    }

    .hero-section .hero-grid {
        width: min(100% - 28px, var(--container-width)) !important;
    }

    .hero-section .hero-content {
        max-width: 100% !important;
        padding: 0 !important;
    }

    .hero-section .hero-content h1 {
        font-size: clamp(3rem, 14vw, 4.6rem) !important;
    }

    .hero-section .hero-description {
        max-width: 92% !important;
        font-size: .95rem !important;
        line-height: 1.65 !important;
    }

    .hero-section .hero-actions {
        margin-top: 24px !important;
    }

    .hero-section .hero-reassurance {
        margin-top: 28px !important;
        padding-top: 18px !important;
        gap: 22px !important;
        flex-direction: row !important;
    }

    .hero-overlay {
        background: rgba(248, 241, 235, .84) !important;
    }

    .hero-slide img {
        object-position: center !important;
    }

    .about-preview-section {
        padding: 76px 0 !important;
    }
}

@media (max-width: 480px) {
    .hero-section {
        height: 620px !important;
        min-height: 620px !important;
        max-height: 620px !important;
    }

    .hero-section .hero-reassurance {
        flex-direction: column !important;
        gap: 12px !important;
    }
}


/* =========================================================
   RESPONSIVE FINAL GLOBAL - AMMANAURA
   Priorité livraison : mobile / tablette / desktop
========================================================= */

/* Sécurités globales contre les débordements */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

img,
video,
iframe,
svg {
    max-width: 100%;
}

img,
video {
    height: auto;
}

input,
select,
textarea,
button {
    max-width: 100%;
}

table {
    max-width: 100%;
}

.section-container,
.header-container,
.footer-container {
    min-width: 0;
}

[class*="grid"],
[class*="content"],
[class*="card"],
[class*="visual"],
[class*="actions"] {
    min-width: 0;
}

/* =========================================================
   TABLETTE ET PETITS ORDINATEURS
========================================================= */

@media (max-width: 1050px) {

    .site-header {
        min-height: var(--header-height);
    }

    .header-container {
        gap: 14px;
    }

    .main-navigation {
        z-index: 1200;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        box-shadow: 0 22px 45px rgba(55, 38, 26, 0.10);
    }

    .navigation-list {
        gap: 4px;
    }

    .navigation-link {
        min-height: 48px;
        padding: 12px 14px;
        font-size: 0.94rem;
    }

    .dropdown-menu a {
        min-height: 44px;
        display: flex;
        align-items: center;
    }

    .footer-container {
        gap: 34px;
    }

    .legal-layout,
    .contact-grid,
    .contact-hero-grid,
    .business-hero-grid,
    .business-intro-grid,
    .business-faq-grid,
    .employee-benefits-grid,
    .service-hero-grid,
    .session-grid,
    .individual-intro-grid,
    .psio-programs-preview-grid,
    .pricing-cta-content,
    .about-preview-grid {
        min-width: 0;
    }
}

/* =========================================================
   TABLETTE
========================================================= */

@media (max-width: 900px) {

    .section-container,
    .header-container,
    .footer-container {
        width: min(100% - 36px, var(--container-width));
    }

    .section-heading {
        max-width: 760px;
    }

    .section-heading h2,
    .legal-hero h1,
    .contact-hero h1,
    .page-hero h1,
    .service-hero h1,
    .business-hero h1,
    .pricing-hero h1 {
        overflow-wrap: anywhere;
    }

    .home-cta-content,
    .service-cta-content,
    .pricing-cta-content {
        gap: 28px;
    }

    .home-cta-actions,
    .service-cta-buttons,
    .pricing-cta-buttons,
    .contact-professional-actions {
        flex-wrap: wrap;
    }

    .legal-layout {
        grid-template-columns: 1fr !important;
        gap: 34px;
    }

    .legal-navigation {
        position: static !important;
        top: auto !important;
    }

    .legal-navigation nav {
        display: flex;
        gap: 10px;
        overflow-x: auto;
        padding-bottom: 8px;
        scroll-snap-type: x proximity;
        scrollbar-width: thin;
    }

    .legal-navigation nav a {
        flex: 0 0 auto;
        scroll-snap-align: start;
        white-space: nowrap;
    }

    .cookie-table-wrapper {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .cookie-table {
        min-width: 680px;
    }

    .contact-cards,
    .contact-cards-final {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* =========================================================
   SMARTPHONE
========================================================= */

@media (max-width: 700px) {

    :root {
        --header-height: 74px;
    }

    body {
        font-size: 16px;
        line-height: 1.65;
    }

    .section-container,
    .header-container,
    .footer-container {
        width: min(100% - 28px, var(--container-width));
    }

    .site-header {
        min-height: var(--header-height);
    }

    .header-container {
        min-height: var(--header-height);
        gap: 10px;
    }

    .brand-logo {
        width: 96px;
        max-height: 58px;
    }

    .menu-toggle {
        flex: 0 0 46px;
    }

    .main-navigation {
        top: var(--header-height);
        max-height: calc(100dvh - var(--header-height));
        padding: 18px 14px 28px;
    }

    .navigation-link {
        font-size: 1rem;
    }

    .dropdown-menu {
        background: rgba(196, 154, 90, 0.055);
        border-radius: 14px;
    }

    .dropdown-menu a {
        font-size: 0.94rem;
    }

    /* Typographie mobile lisible */
    h1 {
        line-height: 0.98;
    }

    h2 {
        line-height: 1.06;
    }

    h3 {
        line-height: 1.15;
    }

    p,
    li,
    dd,
    dt,
    summary,
    label,
    input,
    textarea,
    select {
        font-size: 1rem;
    }

    .section-eyebrow,
    .page-hero-eyebrow,
    .hero-eyebrow {
        font-size: 0.74rem;
        line-height: 1.45;
        letter-spacing: 0.13em;
    }

    .section-heading h2 {
        font-size: clamp(2.45rem, 11vw, 3.7rem);
    }

    /* Espacement vertical plus maîtrisé */
    section {
        scroll-margin-top: calc(var(--header-height) + 18px);
    }

    .individual-intro-section,
    .individual-services-section,
    .psio-programs-preview-section,
    .individual-commitment-section,
    .individual-practical-section,
    .business-intro-section,
    .business-benefits-section,
    .business-services-section,
    .employee-benefits-section,
    .agefiph-section,
    .business-why-section,
    .business-process-section,
    .business-faq-section,
    .pricing-intro,
    .pricing-services,
    .pricing-steps,
    .pricing-faq,
    .pricing-cta,
    .service-introduction,
    .benefits-section,
    .session-section,
    .precautions-section,
    .why-service,
    .service-faq,
    .contact-information,
    .contact-form-section,
    .contact-steps-section,
    .contact-professional-section,
    .legal-content-section {
        padding-top: 64px !important;
        padding-bottom: 64px !important;
    }

    /* Boutons */
    .button {
        min-height: 50px;
        width: 100%;
        padding: 13px 18px;
        white-space: normal;
        text-align: center;
        line-height: 1.25;
    }

    .hero-actions,
    .service-buttons,
    .business-hero-actions,
    .pricing-hero-buttons,
    .home-cta-actions,
    .service-cta-buttons,
    .pricing-cta-buttons,
    .contact-buttons,
    .contact-professional-actions {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .hero-actions .button,
    .service-buttons .button,
    .business-hero-actions .button,
    .pricing-hero-buttons .button,
    .home-cta-actions .button,
    .service-cta-buttons .button,
    .pricing-cta-buttons .button,
    .contact-buttons .button,
    .contact-professional-actions .button {
        width: 100% !important;
        min-width: 0 !important;
    }

    /* Cartes et grilles */
    .services-grid,
    .values-grid,
    .pricing-grid,
    .pricing-steps-grid,
    .benefits-grid,
    .why-grid,
    .business-benefits-grid,
    .business-services-grid,
    .business-why-grid,
    .business-process,
    .contact-cards,
    .contact-cards-final,
    .contact-steps-grid,
    .individual-services-grid,
    .individual-practical-grid,
    .about-values-grid,
    .about-philosophy-list {
        grid-template-columns: 1fr !important;
    }

    .individual-service-card {
        grid-template-columns: 1fr !important;
    }

    .individual-service-content,
    .pricing-card,
    .business-service-card,
    .contact-cards article,
    .contact-cards-final article,
    .legal-card {
        padding-left: 22px !important;
        padding-right: 22px !important;
    }

    /* Images / visuels */
    .service-image-placeholder,
    .business-hero-visual,
    .psio-programs-preview-visual {
        min-height: 300px !important;
    }

    .individual-service-visual {
        min-height: 230px !important;
    }

    .individual-service-visual img,
    .service-image-placeholder img,
    .business-hero-visual img,
    .psio-programs-preview-visual img,
    .service-card-media img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    /* Contact */
    .contact-hero-grid,
    .contact-grid,
    .contact-grid-final,
    .contact-professional-card {
        grid-template-columns: 1fr !important;
        gap: 34px !important;
    }

    .contact-form,
    .contact-form-final {
        width: 100%;
    }

    .contact-form .form-group,
    .contact-form-final .form-group {
        min-width: 0;
    }

    .contact-form input,
    .contact-form textarea,
    .contact-form select,
    .contact-form-final input,
    .contact-form-final textarea,
    .contact-form-final select {
        width: 100%;
        font-size: 16px; /* évite le zoom automatique iOS */
    }

    .form-consent {
        align-items: flex-start;
    }

    /* FAQ */
    details summary {
        cursor: pointer;
        overflow-wrap: anywhere;
    }

    /* Legal */
    .legal-card {
        overflow: hidden;
    }

    .legal-information-list > div {
        grid-template-columns: 1fr !important;
        gap: 5px !important;
    }

    .legal-navigation nav {
        margin-inline: -2px;
    }

    /* Footer */
    .site-footer {
        padding-top: 54px;
    }

    .footer-container {
        grid-template-columns: 1fr !important;
        gap: 34px;
    }

    .footer-bottom {
        width: min(100% - 28px, var(--container-width));
        margin-top: 34px;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    /* Réseaux sociaux flottants */
    .floating-socials {
        right: 12px !important;
        bottom: 16px !important;
        gap: 9px !important;
    }

    .floating-social-button {
        width: 48px !important;
        min-width: 48px !important;
        height: 48px !important;
        padding: 0 !important;
        border-radius: 50% !important;
    }

    .floating-social-button svg {
        width: 22px !important;
        height: 22px !important;
        flex-basis: 22px !important;
    }

    .floating-social-label {
        display: none !important;
    }

    /* Cookies */
    .cookie-banner {
        right: 10px !important;
        left: 10px !important;
        bottom: 10px !important;
        max-height: calc(100dvh - 20px);
        overflow-y: auto;
        padding: 20px !important;
        border-radius: 20px !important;
    }

    .cookie-banner h2 {
        font-size: clamp(1.8rem, 8vw, 2.4rem);
        line-height: 1.05;
    }

    .cookie-banner-actions {
        flex-direction: column;
        width: 100%;
    }

    .cookie-banner-actions .button {
        width: 100%;
    }

    .cookie-settings-button {
        left: 10px;
        bottom: 10px;
        min-height: 42px;
    }
}

/* =========================================================
   PETITS SMARTPHONES
========================================================= */

@media (max-width: 480px) {

    .section-container,
    .header-container,
    .footer-container {
        width: min(100% - 22px, var(--container-width));
    }

    .brand-logo {
        width: 88px;
    }

    .section-heading h2 {
        font-size: clamp(2.25rem, 11vw, 3.25rem);
    }

    .page-hero,
    .service-hero,
    .contact-hero,
    .business-hero,
    .pricing-hero {
        min-height: auto !important;
    }

    .page-hero-content,
    .service-hero-grid,
    .contact-hero-grid,
    .business-hero-grid,
    .pricing-hero-content {
        padding-top: 58px !important;
        padding-bottom: 58px !important;
    }

    .individual-service-content,
    .pricing-card,
    .business-service-card,
    .contact-cards article,
    .contact-cards-final article,
    .legal-card {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    .cookie-table {
        min-width: 620px;
    }
}

/* =========================================================
   ORIENTATION PAYSAGE / PETITE HAUTEUR
========================================================= */

@media (max-height: 620px) and (max-width: 1050px) {

    .main-navigation {
        max-height: calc(100dvh - var(--header-height));
    }

    .hero-section {
        min-height: 560px !important;
        max-height: none !important;
        height: auto !important;
    }
}

/* =========================================================
   MOUVEMENTS RÉDUITS
========================================================= */

@media (prefers-reduced-motion: reduce) {

    html {
        scroll-behavior: auto;
    }

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