*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --rose: #F5DCDC; --rose-mid: #EFC4C4; --rose-deep: #D89B9B;
      --rose-dark: #B87070; --white: #FFFFFF; --off-white: #FFF8F8;
      --text-dark: #1A1A1A; --text-mid: #4A4A4A; --text-light: #8A7070;
      --text-muted: rgba(255,248,248,0.6);
      --serif: 'Cormorant Garamond', Georgia, serif;
      --sans: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
      --ease: cubic-bezier(0.4,0,0.2,1);
    }
    html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; }
    body { font-family: var(--sans); color: var(--text-dark); background: var(--white); overflow-x: hidden; }
    a { text-decoration: none; color: inherit; }
    ul { list-style: none; }
    img { display: block; width: 100%; height: 100%; object-fit: cover; }
    button { cursor: pointer; font-family: var(--sans); border: none; background: none; }

    /* HEADER */
    .site-header { position: fixed; top: 0; left: 0; right: 0; z-index: 90; transition: background .35s var(--ease), box-shadow .35s var(--ease), transform .9s var(--ease), opacity .9s var(--ease); }
    .site-header.scrolled { background: rgba(255,248,248,.96); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 1px 0 rgba(184,112,112,.15); }
    .header-bar { display: flex; align-items: center; justify-content: space-between; padding: 0 48px; height: 48px; border-bottom: 1px solid rgba(184,112,112,.15); }
    .header-bar-left { display: flex; align-items: center; gap: 28px; }
    .bar-link { font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; font-weight: 500; color: var(--text-dark); transition: color .2s; }
    .bar-link:hover { color: var(--rose-dark); }
    .bar-link-btn { border: 1px solid var(--rose-dark); color: var(--rose-dark); padding: 6px 18px; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; transition: background .22s, color .22s; display: inline-block; }
    .bar-link-btn:hover { background: var(--rose-dark); color: var(--white); }
    .header-bar-right { display: flex; align-items: center; gap: 20px; }
    .lang-switcher { display: flex; gap: 14px; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; }
    .lang-switcher a { color: var(--text-dark); opacity: .4; transition: opacity .2s; }
    .lang-switcher a.active, .lang-switcher a:hover { opacity: 1; }
    .hamburger { display: flex; flex-direction: column; justify-content: center; gap: 5.5px; width: 36px; height: 36px; padding: 4px; }
    .hamburger span { display: block; width: 26px; height: 1.5px; background: var(--text-dark); transition: transform .32s var(--ease), opacity .32s var(--ease), width .32s var(--ease); transform-origin: center; }
    .hamburger.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
    .hamburger.active span:nth-child(2) { opacity: 0; width: 0; }
    .hamburger.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
    .header-main { display: flex; align-items: center; justify-content: space-between; padding: 0 48px; height: 68px; }
    .logo { font-family: var(--serif); font-size: 30px; font-weight: 500; letter-spacing: .3em; text-transform: uppercase; color: var(--text-dark); line-height: 1; cursor: pointer; text-decoration: none; }
    .logo .accent { color: var(--rose-dark); }
    .header-right { width: 80px; display: flex; align-items: center; justify-content: flex-end; }
    .lang-switcher-mobile { display: none; }
    .site-header.scrolled .logo { color: var(--text-dark); }
    .site-header:not(.scrolled) .logo { color: var(--white); }
    .site-header:not(.scrolled) .bar-link { color: var(--white); }
    .site-header:not(.scrolled) .bar-link-btn { border-color: rgba(255,255,255,.6); color: var(--white); }
    .site-header:not(.scrolled) .bar-link-btn:hover { background: rgba(255,255,255,.2); color: var(--white); }
    .site-header:not(.scrolled) .hamburger span { background: var(--white); }
    .site-header:not(.scrolled) .lang-switcher a { color: var(--white); }
    .site-header:not(.scrolled) .header-bar { border-bottom: 1px solid rgba(255,255,255,.15); }
    /* Force header style on sub-pages */
    body.on-subpage .site-header { background: rgba(255,248,248,.96) !important; backdrop-filter: blur(12px); box-shadow: 0 1px 0 rgba(184,112,112,.15); }
    body.on-subpage .logo { color: var(--text-dark) !important; }
    body.on-subpage .bar-link { color: var(--text-dark) !important; }
    body.on-subpage .bar-link-btn { border-color: var(--rose-dark) !important; color: var(--rose-dark) !important; }
    body.on-subpage .hamburger span { background: var(--text-dark) !important; }
    body.on-subpage .lang-switcher a { color: var(--text-dark) !important; }
    body.on-subpage .header-bar { border-bottom: 1px solid rgba(184,112,112,.15) !important; }

    /* MENU OVERLAY */
    .menu-overlay { position: fixed; inset: 0; background: #FAE8E8; z-index: 200; display: flex; flex-direction: column; transform: translateX(-100%); transition: transform .5s var(--ease); overflow-y: auto; }
    .menu-overlay.open { transform: translateX(0); }
    .menu-overlay-inner { display: flex; flex-direction: column; min-height: 100%; padding: 32px 64px 48px; }
    .menu-header { display: flex; align-items: center; justify-content: space-between; padding-bottom: 48px; border-bottom: 1px solid rgba(216,155,155,.15); }
    .menu-logo { font-family: var(--serif); font-size: 26px; font-weight: 500; letter-spacing: .3em; text-transform: uppercase; color: var(--text-dark); }
    .menu-logo .accent { color: var(--rose-deep); }
    .menu-close { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; color: var(--text-dark); font-size: 24px; opacity: .7; transition: opacity .2s, transform .3s; }
    .menu-close:hover { opacity: 1; transform: rotate(90deg); }
    .menu-body { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; padding: 60px 0; flex: 1; }
    .menu-nav-primary li { overflow: hidden; }
    .menu-nav-primary a { font-family: var(--serif); font-size: clamp(34px,4vw,52px); font-weight: 300; letter-spacing: .03em; color: var(--text-dark); display: block; padding: 10px 0; transition: color .25s, transform .25s; line-height: 1.1; }
    .menu-nav-primary a:hover { color: var(--rose-deep); transform: translateX(12px); }
    .menu-nav-secondary { padding-top: 12px; }
    .menu-nav-secondary a { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; font-weight: 500; color: var(--text-mid); display: block; padding: 10px 0; transition: color .25s; border-bottom: 1px solid rgba(184,112,112,.2); cursor: pointer; }
    .menu-nav-secondary a:hover { color: var(--rose-deep); }
    .menu-footer { padding-top: 40px; border-top: 1px solid rgba(216,155,155,.15); display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; }
    .menu-footer .lang-switcher a { color: var(--text-dark); }
    .menu-footer .lang-switcher a.active { opacity: 1; }
    .menu-socials { display: flex; gap: 24px; }
    .menu-socials a { font-size: 10px; letter-spacing: .16em; text-transform: uppercase; font-weight: 600; color: var(--text-light); transition: color .2s; }
    .menu-socials a:hover { color: var(--rose-deep); }

    /* HERO */
    .hero { position: relative; height: 100vh; min-height: 640px; overflow: hidden; }
    .hero-bg { position: absolute; inset: 0; isolation: isolate; }
    .hero-bg-behind { position: absolute; inset: 0; z-index: 0; background: url('../img/imanails-institut-interieur.jpg') center/cover no-repeat; }
    .hero-bg img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; transform: scale(1.05); transition: transform 8s ease-out; }
    .hero-bg img.loaded { transform: scale(1); }
    .hero-gradient { position: absolute; inset: 0; background: linear-gradient(160deg, rgba(26,26,26,.18) 0%, rgba(26,26,26,.55) 100%); }
    .hero-content { position: absolute; bottom: 18%; left: 0; right: 0; padding: 0 10%; color: var(--white); }
    .hero-label { display: block; font-size: 10px; letter-spacing: .28em; text-transform: uppercase; font-weight: 600; color: var(--rose-deep); margin-bottom: 20px; }
    .hero-title { font-family: var(--serif); font-size: clamp(68px,10.5vw,130px); font-weight: 300; line-height: .92; letter-spacing: .02em; margin-bottom: 40px; color: var(--white); }
    .hero-title em { font-style: italic; font-weight: 300; color: var(--rose-mid); }
    .hero-cta { display: inline-flex; align-items: center; gap: 14px; font-size: 10.5px; letter-spacing: .18em; text-transform: uppercase; font-weight: 600; color: var(--white); padding-bottom: 5px; border-bottom: 1px solid rgba(255,255,255,.45); transition: gap .3s, border-color .3s; }
    .hero-cta::after { content: '→'; font-size: 15px; font-weight: 400; transition: transform .3s; }
    .hero-cta:hover { gap: 22px; border-color: var(--white); }
    .hero-cta:hover::after { transform: translateX(4px); }
    .hero-scroll { position: absolute; bottom: 48px; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 10px; color: var(--white); opacity: .5; }
    .hero-scroll span { font-size: 9px; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; }
    .scroll-line { width: 1px; height: 56px; background: linear-gradient(to bottom, rgba(255,255,255,0), var(--white)); animation: scrollPulse 2.2s ease-in-out infinite; }
    @keyframes scrollPulse { 0% { opacity:0; transform:translateY(-16px);} 50% { opacity:.8;} 100%{ opacity:0; transform:translateY(0);} }

    /* ====== ANIMATION D'ENTRÉE DU HERO (harmonisée charte — entrée échelonnée, rythme lent) ====== */
    /* États initiaux appliqués uniquement si JS actif → le contenu reste visible sans JS */
    .js-hero .site-header { transform: translateY(-100%); opacity: 0; }
    .js-hero .hero-label,
    .js-hero .hero-title,
    .js-hero .hero-cta { opacity: 0; transform: translateY(22px); }
    .js-hero .hero-scroll { opacity: 0; }

    /* Transitions douces, easing de la charte */
    .hero-label, .hero-title { transition: opacity .7s var(--ease), transform .7s var(--ease); }
    .hero-cta { transition: opacity .7s var(--ease), transform .7s var(--ease), gap .3s, border-color .3s; }
    .hero-scroll { transition: opacity .9s var(--ease); }

    /* États joués (stagger : header puis label → titre → CTA → scroll) */
    .site-header.intro-in { transform: translateY(0); opacity: 1; }
    .hero.intro-in .hero-label  { opacity: 1; transform: none; transition-delay: .25s; }
    .hero.intro-in .hero-title  { opacity: 1; transform: none; transition-delay: .40s; }
    .hero.intro-in .hero-cta    { opacity: 1; transform: none; transition-delay: .58s; }
    .hero.intro-in .hero-scroll { opacity: .5; transition-delay: 1.05s; }

    /* Respect de prefers-reduced-motion → tout reste visible, sans mouvement */
    @media (prefers-reduced-motion: reduce) {
      .js-hero .site-header { transform: translateY(0); opacity: 1; }
      .js-hero .hero-label,
      .js-hero .hero-title,
      .js-hero .hero-cta { opacity: 1; transform: none; }
      .js-hero .hero-scroll { opacity: .5; }
      .site-header, .hero-label, .hero-title, .hero-cta, .hero-scroll { transition: none; }
    }

    /* SHARED SECTION */
    .section { padding: 112px 64px; }
    .section-label { display: block; font-size: 9.5px; letter-spacing: .28em; text-transform: uppercase; font-weight: 700; color: var(--rose-dark); margin-bottom: 18px; }
    .section-subtitle { font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; font-weight: 600; color: var(--text-mid); margin-bottom: 22px; display: block; }
    .section-title { font-family: var(--serif); font-size: clamp(38px,4.5vw,64px); font-weight: 300; line-height: 1.08; letter-spacing: .01em; color: var(--text-dark); margin-bottom: 28px; }
    .section-text { font-size: 14.5px; line-height: 1.85; color: var(--text-mid); font-weight: 300; max-width: 440px; }
    .btn { display: inline-flex; align-items: center; gap: 12px; font-size: 10px; letter-spacing: .18em; text-transform: uppercase; font-weight: 700; padding: 14px 30px; transition: all .25s var(--ease); }
    .btn::after { content: '→'; font-size: 13px; font-weight: 400; transition: transform .25s; }
    .btn:hover::after { transform: translateX(4px); }
    .btn-outline-dark { border: 1px solid var(--text-dark); color: var(--text-dark); }
    .btn-outline-dark:hover { background: var(--text-dark); color: var(--white); }
    .btn-outline-rose { border: 1px solid var(--rose-dark); color: var(--rose-dark); }
    .btn-outline-rose:hover { background: var(--rose-dark); color: var(--white); }
    .btn-filled-rose { border: 1px solid var(--rose-dark); background: var(--rose-dark); color: var(--white); }
    .btn-outline-light { border: 1px solid var(--rose-dark); color: var(--text-dark); }
    .btn-outline-light:hover { background: var(--rose-dark); color: var(--white); }
    .pill-group { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 36px; }
    .pill { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: var(--text-dark); border: 1px solid var(--rose-deep); padding: 10px 22px; transition: all .22s; display: inline-block; cursor: pointer; }
    .pill:hover { background: var(--rose-dark); color: var(--white); border-color: var(--rose-dark); }

    /* SECTION 1 INTRO */
    .section-intro-wrap { max-width: 1380px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 96px; align-items: center; }
    .intro-gallery { position: relative; height: 580px; flex-shrink: 0; }
    .gallery-main { position: absolute; top: 0; left: 0; width: 72%; height: 78%; overflow: hidden; }
    .gallery-main img { transition: transform 8s ease; }
    .gallery-main:hover img { transform: scale(1.04); }
    .gallery-accent { position: absolute; bottom: 0; right: 0; width: 52%; height: 52%; overflow: hidden; box-shadow: -8px -8px 0 var(--white); }
    .gallery-accent img { transition: transform 8s ease; }
    .gallery-accent:hover img { transform: scale(1.04); }
    .intro-ctas { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 36px; }

    /* ===========================
       PRESTATIONS HUB (4 cards)
    =========================== */
    .prestations-hub { background: #FAE8E8; }
    .hub-intro { max-width: 860px; margin: 0 auto 72px; text-align: center; }
    .hub-intro .section-label { color: var(--rose-deep); }
    .hub-intro .section-title { color: var(--text-dark); margin-bottom: 16px; }
    .hub-intro .section-text { max-width: 100%; color: var(--text-mid); margin: 0 auto; }
    .hub-grid { max-width: 1380px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 3px; }
    .hub-card { position: relative; overflow: hidden; height: 500px; cursor: pointer; }
    .hub-card img { transition: transform .7s var(--ease); }
    .hub-card:hover img { transform: scale(1.06); }
    .hub-card-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(26,26,26,.82) 0%, rgba(26,26,26,.25) 55%, rgba(26,26,26,.08) 100%); transition: background .4s; }
    .hub-card:hover .hub-card-overlay { background: linear-gradient(to top, rgba(26,26,26,.9) 0%, rgba(26,26,26,.4) 60%, rgba(26,26,26,.15) 100%); }
    .hub-card-content { position: absolute; bottom: 0; left: 0; right: 0; padding: 40px; color: var(--white); }
    .hub-card-tag { font-size: 9px; letter-spacing: .26em; text-transform: uppercase; font-weight: 700; color: var(--rose-deep); margin-bottom: 10px; display: block; }
    .hub-card-title { font-family: var(--serif); font-size: clamp(28px,2.6vw,40px); font-weight: 300; line-height: 1.1; margin-bottom: 12px; }
    .hub-card-desc { font-size: 12.5px; line-height: 1.75; color: rgba(255,248,248,.72); font-weight: 300; max-width: 360px; margin-bottom: 22px; opacity: 0; transform: translateY(14px); transition: opacity .4s .05s var(--ease), transform .4s .05s var(--ease); }
    .hub-card:hover .hub-card-desc { opacity: 1; transform: translateY(0); }
    .hub-card-cta { font-size: 9.5px; letter-spacing: .18em; text-transform: uppercase; font-weight: 700; color: var(--white); display: inline-flex; align-items: center; gap: 10px; padding-bottom: 4px; border-bottom: 1px solid rgba(255,255,255,.35); transition: gap .3s, border-color .3s; }
    .hub-card-cta::after { content: '→'; font-size: 13px; font-weight: 400; }
    .hub-card:hover .hub-card-cta { gap: 16px; border-color: var(--white); }

    /* SECTION CRAFT */
    .section-craft { padding: 0; overflow: hidden; background: #F5DCDC; }
    .craft-grid { display: grid; grid-template-columns: 1fr 1fr; min-height: 640px; }
    .craft-image { position: relative; overflow: hidden; }
    .craft-image img { height: 100%; object-fit: cover; object-position: center 20%; transition: transform 8s ease; }
    .craft-image:hover img { transform: scale(1.04); }
    .craft-image-overlay { position: absolute; inset: 0; background: rgba(26,26,26,.12); }
    .craft-content { padding: 100px 96px; display: flex; flex-direction: column; justify-content: center; }
    .craft-content .section-label { color: var(--rose-deep); }
    .craft-content .section-subtitle { color: var(--text-light); }
    .craft-content .section-title { color: var(--text-dark); }
    .craft-content .section-text { color: var(--text-mid); }

    /* SECTION INSTITUT */
    .section-institut { background: var(--off-white); }
    .institut-wrap { max-width: 1380px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 96px; align-items: center; }
    .institut-map { height: 480px; overflow: hidden; background: var(--rose); position: relative; }
    .institut-map iframe { width: 100%; height: 100%; border: 0; display: block; }
    .institut-map-fallback { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg,var(--rose) 0%,var(--rose-mid) 100%); flex-direction: column; gap: 16px; color: var(--text-mid); }
    .institut-map-fallback svg { width: 48px; height: 48px; opacity: .5; }
    .institut-map-fallback p { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; font-weight: 600; opacity: .6; }

    /* CONTACT INFO */
    .contact-info-block { margin-top: 36px; display: flex; flex-direction: column; gap: 18px; }
    .contact-info-item { display: flex; align-items: flex-start; gap: 14px; font-size: 13.5px; line-height: 1.65; color: var(--text-mid); font-weight: 300; }
    .contact-info-item .ci-icon { flex-shrink: 0; width: 18px; height: 18px; margin-top: 3px; color: var(--rose-dark); }
    .contact-info-item a { color: var(--text-mid); transition: color .2s; }
    .contact-info-item a:hover { color: var(--rose-dark); }
    .contact-info-item strong { display: block; font-size: 9px; letter-spacing: .2em; text-transform: uppercase; font-weight: 700; color: var(--rose-dark); margin-bottom: 3px; }

    /* FOOTER */
    .site-footer { background: #FAE8E8; color: var(--text-dark); }
    .footer-main { padding: 88px 64px 60px; display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 1.4fr; gap: 48px; border-bottom: 1px solid rgba(184,112,112,.25); }
    .footer-logo { font-family: var(--serif); font-size: 26px; font-weight: 500; letter-spacing: .3em; text-transform: uppercase; color: var(--text-dark); display: block; margin-bottom: 20px; }
    .footer-logo .accent { color: var(--rose-deep); }
    .footer-tagline { font-family: var(--serif); font-size: 20px; font-weight: 300; font-style: italic; color: var(--rose-deep); margin-bottom: 32px; line-height: 1.3; }
    .footer-col-title { font-size: 9.5px; letter-spacing: .26em; text-transform: uppercase; font-weight: 700; color: var(--rose-deep); margin-bottom: 22px; }
    .footer-nav-list { display: flex; flex-direction: column; gap: 10px; }
    .footer-nav-list a, .footer-nav-list li { font-size: 13px; letter-spacing: .04em; font-weight: 400; color: var(--text-mid); transition: color .2s; cursor: pointer; }
    .footer-nav-list a:hover, .footer-nav-list li:hover { color: var(--text-dark); }
    .footer-social-list { display: flex; flex-direction: column; gap: 12px; }
    .footer-social-list a { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: var(--text-light); transition: color .2s; display: flex; align-items: center; gap: 10px; }
    .footer-social-list a::before { content: ''; display: inline-block; width: 16px; height: 1px; background: var(--rose-dark); transition: width .3s; }
    .footer-social-list a:hover { color: var(--rose-deep); }
    .footer-social-list a:hover::before { width: 24px; }
    .footer-contact-list { display: flex; flex-direction: column; gap: 12px; margin-top: 4px; }
    .footer-contact-list li { font-size: 12.5px; line-height: 1.6; color: var(--text-mid); font-weight: 300; }
    .footer-contact-list li span { display: block; font-size: 9px; letter-spacing: .18em; text-transform: uppercase; font-weight: 700; color: var(--rose-deep); margin-bottom: 2px; }
    .footer-contact-list li a { color: var(--text-mid); transition: color .2s; }
    .footer-contact-list li a:hover { color: var(--text-dark); }
    .footer-bottom { padding: 28px 64px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; }
    .footer-legal-links { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; }
    .footer-legal-links a { font-size: 10.5px; letter-spacing: .08em; color: var(--text-light); transition: color .2s; }
    .footer-legal-links a:hover { color: var(--text-dark); }
    .footer-legal-links span { font-size: 10.5px; color: var(--rose-deep); }
    .footer-signature { font-family: var(--serif); font-size: 15px; font-style: italic; font-weight: 300; color: var(--rose-deep); letter-spacing: .06em; }

    /* COOKIE */
    .cookie-banner { position: fixed; bottom: 0; left: 0; right: 0; background: #FAE8E8; z-index: 500; padding: 22px 48px; display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; transform: translateY(100%); transition: transform .4s var(--ease); border-top: 1px solid rgba(216,155,155,.18); }
    .cookie-banner.visible { transform: translateY(0); }
    .cookie-text { font-size: 12.5px; line-height: 1.65; color: var(--text-mid); max-width: 620px; }
    .cookie-text a { color: var(--rose-deep); text-decoration: underline; text-underline-offset: 2px; }
    .cookie-actions { display: flex; gap: 12px; flex-shrink: 0; }
    .cookie-btn { font-size: 9.5px; letter-spacing: .16em; text-transform: uppercase; font-weight: 700; padding: 11px 24px; border: 1px solid; transition: all .22s; }
    .cookie-btn-accept { background: var(--rose-dark); color: var(--white); border-color: var(--rose-dark); }
    .cookie-btn-decline { background: transparent; color: var(--text-mid); border-color: var(--rose-deep); }
    .cookie-btn-decline:hover { color: var(--text-dark); border-color: var(--rose-dark); }

    /* ===========================
       SUB-PAGES
    =========================== */
    .sub-page { display: none; min-height: 100vh; background: var(--white); padding-top: 116px; }
    body.on-subpage .sub-page { display: block; }
    /* Sur les pages dédiées, on ne joue pas l'animation d'intro du hero — on force la visibilité du header */
    body.on-subpage .site-header { transform: none !important; opacity: 1 !important; }
    .sub-page-nav { position: sticky; top: 116px; z-index: 80; background: rgba(255,248,248,.97); backdrop-filter: blur(12px); padding: 0 64px; height: 60px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(184,112,112,.15); }
    .sub-page-back { display: inline-flex; align-items: center; gap: 10px; font-size: 10px; letter-spacing: .18em; text-transform: uppercase; font-weight: 600; color: var(--text-dark); cursor: pointer; transition: color .2s; background: none; border: none; font-family: var(--sans); }
    .sub-page-back::before { content: '←'; font-size: 15px; font-weight: 400; transition: transform .3s; }
    .sub-page-back:hover { color: var(--rose-dark); }
    .sub-page-back:hover::before { transform: translateX(-4px); }
    .sub-page-breadcrumb { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; font-weight: 500; color: var(--text-light); }
    .sub-page-breadcrumb span { color: var(--rose-dark); }
    .sub-page-banner { position: relative; height: 380px; overflow: hidden; }
    .sub-page-banner img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
    .sub-page-banner-overlay { position: absolute; inset: 0; background: linear-gradient(160deg, rgba(26,26,26,.15) 0%, rgba(26,26,26,.65) 100%); }
    .sub-page-banner-content { position: absolute; bottom: 56px; left: 64px; color: var(--white); }
    .sub-page-banner-tag { font-size: 9px; letter-spacing: .28em; text-transform: uppercase; font-weight: 700; color: var(--rose-deep); margin-bottom: 12px; display: block; }
    .sub-page-banner-title { font-family: var(--serif); font-size: clamp(44px,5.5vw,78px); font-weight: 300; line-height: 1; letter-spacing: .02em; }
    .sub-page-content { max-width: 1380px; margin: 0 auto; padding: 88px 64px; }
    .service-section { margin-bottom: 80px; }
    .service-section:last-child { margin-bottom: 0; }
    .service-section-header { margin-bottom: 40px; padding-bottom: 24px; border-bottom: 1px solid var(--rose-mid); }
    .service-section-tag { font-size: 9px; letter-spacing: .28em; text-transform: uppercase; font-weight: 700; color: var(--rose-dark); display: block; margin-bottom: 10px; }
    .service-section-title { font-family: var(--serif); font-size: clamp(30px,3.2vw,48px); font-weight: 300; color: var(--text-dark); line-height: 1.1; }
    .svc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; }
    .svc-card { background: var(--off-white); padding: 32px 28px; transition: background .25s; }
    .svc-card:hover { background: var(--rose); }
    .svc-card-name { font-family: var(--serif); font-size: 22px; font-weight: 400; color: var(--text-dark); margin-bottom: 10px; line-height: 1.2; }
    .svc-card-desc { font-size: 12.5px; line-height: 1.75; color: var(--text-mid); font-weight: 300; }
    .svc-card-tag { margin-top: 14px; font-size: 9px; letter-spacing: .18em; text-transform: uppercase; font-weight: 700; color: var(--rose-dark); }

    /* TRUST BADGES */
    .trust-badges { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; margin-bottom: 4px; }
    .trust-badge { font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; color: var(--rose-dark); border: 1px solid var(--rose-deep); padding: 8px 18px; display: inline-block; }

    /* FADE-IN */
    .fade-in { opacity: 0; transform: translateY(32px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
    .fade-in.visible { opacity: 1; transform: translateY(0); }
    .fade-in-delay-1 { transition-delay: .1s; }
    .fade-in-delay-2 { transition-delay: .22s; }
    .fade-in-delay-3 { transition-delay: .36s; }
    .fade-in-delay-4 { transition-delay: .50s; }

    /* RESPONSIVE */
    @media (max-width: 1100px) {
      .section { padding: 88px 40px; }
      .section-intro-wrap { grid-template-columns: 1fr; gap: 56px; }
      .hub-grid { grid-template-columns: 1fr; }
      .craft-grid { grid-template-columns: 1fr; }
      .craft-image { height: 420px; }
      .craft-content { padding: 80px 48px; }
      .footer-main { grid-template-columns: 1fr 1fr; gap: 48px; padding: 64px 40px 48px; }
      .footer-bottom { padding: 24px 40px; }
      .menu-body { grid-template-columns: 1fr; gap: 40px; }
      .header-bar { padding: 0 32px; }
      .header-main { padding: 0 32px; }
      .svc-grid { grid-template-columns: 1fr 1fr; }
      .sub-page-nav { padding: 0 40px; }
      .sub-page-content { padding: 64px 40px; }
      .sub-page-banner-content { left: 40px; }
      .institut-wrap { grid-template-columns: 1fr; gap: 56px; }
    }
    @media (max-width: 768px) {
      .section { padding: 72px 24px; }
      .intro-gallery { height: 420px; }
      .hub-card { height: 380px; }
      .svc-grid { grid-template-columns: 1fr; }
      .footer-main { grid-template-columns: 1fr; gap: 36px; padding: 56px 24px 40px; }
      .footer-bottom { padding: 20px 24px; flex-direction: column; align-items: flex-start; gap: 12px; }
      .cookie-banner { padding: 18px 24px; }
      .menu-overlay-inner { padding: 28px 32px 40px; }
      .header-bar { display: none; }
      .header-main { padding: 0 24px; }
      .header-right { width: auto; }
      .lang-switcher-mobile { display: flex; gap: 12px; }
      .hero-content { padding: 0 7%; }
      .hero-title { font-size: clamp(52px,14vw,90px); }
      .institut-map { height: 320px; }
      .sub-page { padding-top: 68px; }
      .sub-page-nav { top: 68px; padding: 0 24px; }
      .sub-page-banner { height: 280px; }
      .sub-page-banner-content { left: 24px; bottom: 36px; }
      .sub-page-content { padding: 48px 24px; }
    }
    @media (max-width: 480px) {
      .intro-gallery { height: 320px; }
      .gallery-main { width: 78%; height: 75%; }
      .gallery-accent { width: 55%; height: 50%; }
      .cookie-banner { flex-direction: column; align-items: flex-start; }
      .hub-card-content { padding: 28px; }
    }

    /* ===========================
       PARALLAX SCROLL SECTIONS
    =========================== */
    .section-parallax-wrap { background: #FEFAF7; }

    .parallax-wrapper {
      padding-left: 18px;
      padding-right: 18px;
      background: #FEFAF7;
    }
    .parallax-sticky-wrap {
      position: relative;
      height: 150vh;
      width: 85%;        /* -15% de largeur : bannières moins imposantes, centrées */
      margin: 0 auto;
    }
    .parallax-img {
      position: sticky;
      top: 18px;
      height: calc(86vh - 36px);
      border-radius: 24px;
      overflow: hidden;
      background-size: cover;
      background-position: center;
      z-index: 0;
      transform-origin: center;
      will-change: transform;
    }
    .parallax-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(160deg, rgba(42,16,16,0.38) 0%, rgba(26,15,13,0.70) 100%);
      will-change: opacity;
    }
    .parallax-copy {
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 100vh;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      pointer-events: none;
      will-change: transform, opacity;
      z-index: 2;
    }
    .parallax-sep {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 20px;
    }
    .parallax-sep-line {
      display: block;
      width: 32px;
      height: 1px;
      background: rgba(239,196,196,0.50);
    }
    .parallax-sep-dot {
      display: block;
      width: 4px;
      height: 4px;
      border-radius: 50%;
      background: rgba(239,196,196,0.60);
    }
    .parallax-sublabel {
      margin-bottom: 18px;
      text-align: center;
      font-family: var(--sans);
      font-size: 10px;
      letter-spacing: .28em;
      text-transform: uppercase;
      font-weight: 400;
      color: rgba(239,196,196,0.85);
    }
    .parallax-heading {
      text-align: center;
      font-family: var(--serif);
      font-size: clamp(2.4rem, 5.5vw, 5rem);
      font-weight: 300;
      font-style: italic;
      line-height: 1.12;
      letter-spacing: -.01em;
      color: #FEFAF7;
      padding: 0 24px;
      text-shadow: 0 2px 40px rgba(26,15,13,0.30);
    }
    /* Content block below each sticky image */
    .parallax-content {
      background: #FEFAF7;
      padding: 56px 48px 96px;
    }
    .parallax-content-inner {
      max-width: 1200px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 5fr 7fr;
      gap: 80px;
      align-items: start;
    }
    .parallax-content-title {
      font-family: var(--serif);
      font-size: clamp(1.55rem, 2.6vw, 2.2rem);
      font-weight: 300;
      color: #1A0F0D;
      line-height: 1.22;
    }
    .parallax-content-body {
      display: flex;
      flex-direction: column;
      gap: 20px;
    }
    .parallax-content-text {
      font-size: clamp(.9rem, 1.1vw, 1.05rem);
      line-height: 1.85;
      color: #3D2A27;
      font-weight: 300;
    }
    .parallax-content-btn {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 13px 30px;
      background: #1A0F0D;
      color: #FEFAF7;
      font-family: var(--sans);
      font-size: 10.5px;
      letter-spacing: .16em;
      text-transform: uppercase;
      font-weight: 500;
      border: none;
      cursor: pointer;
      transition: background .28s ease;
      text-decoration: none;
      align-self: flex-start;
    }
    .parallax-content-btn:hover { background: #3D2A27; color: #FEFAF7; }
    .parallax-content-btn svg { flex-shrink: 0; }

    @media (max-width: 1024px) {
      .parallax-content { padding: 48px 32px 80px; }
      .parallax-content-inner { gap: 48px; grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 768px) {
      .parallax-img { border-radius: 16px; top: 12px; height: calc(86vh - 24px); }
      .parallax-wrapper { padding-left: 12px; padding-right: 12px; }
      .parallax-content { padding: 36px 24px 64px; }
      .parallax-content-inner { grid-template-columns: 1fr; gap: 24px; }
      .parallax-heading { font-size: clamp(2rem, 10vw, 3rem); }
    }

    /* ===========================
       PAGE À PROPOS
    =========================== */
    .about-content {
      --about-accent: #B47474;
      --about-accent-light: #EFC4C4;
      --about-text: #1A0F0D;
      --about-muted: #3D2A27;
      --about-bg-card: #FAF5F2;
      --about-border: rgba(239,196,196,0.30);
    }
    .about-intro {
      max-width: 900px;
      margin: 0 auto 64px 0;
      padding-bottom: 48px;
      border-bottom: 1px solid var(--about-border);
    }
    .about-lead {
      font-family: var(--serif);
      font-size: clamp(1.3rem, 2.2vw, 1.8rem);
      font-weight: 300;
      line-height: 1.65;
      color: var(--about-text);
      font-style: italic;
    }
    .about-section {
      max-width: 900px;
      margin: 0 auto 72px 0;
    }
    .about-team-section { max-width: 1100px; margin-right: auto; margin-left: 0; }
    .about-timeline-section { max-width: 900px; margin-right: auto; margin-left: 0; }
    .about-h2 {
      font-family: var(--serif);
      font-size: clamp(1.45rem, 2.6vw, 2.1rem);
      font-weight: 300;
      color: var(--about-text);
      line-height: 1.2;
      margin-bottom: 28px;
      padding-bottom: 20px;
      border-bottom: 1px solid var(--about-border);
    }
    .about-body p {
      font-size: clamp(0.92rem, 1.1vw, 1.02rem);
      line-height: 1.9;
      color: var(--about-muted);
      font-weight: 300;
      margin-bottom: 18px;
    }
    .about-body p:last-child { margin-bottom: 0; }
    .about-pull {
      display: block;
      font-family: var(--serif);
      font-size: clamp(1.05rem, 1.7vw, 1.35rem);
      font-style: italic;
      font-weight: 300;
      color: var(--about-text);
      border-left: 2px solid var(--about-accent);
      padding: 6px 0 6px 22px;
      margin: 32px 0 !important;
      line-height: 1.65;
    }
    .about-team-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 2px;
    }
    .about-team-card {
      background: var(--about-bg-card);
      padding: 40px 32px;
      border-top: 2px solid var(--about-accent-light);
    }
    .about-team-role {
      font-family: var(--sans);
      font-size: 9px;
      letter-spacing: 0.24em;
      text-transform: uppercase;
      font-weight: 700;
      color: var(--about-accent);
      margin-bottom: 12px;
    }
    .about-team-name {
      font-family: var(--serif);
      font-size: clamp(1.45rem, 1.9vw, 1.8rem);
      font-weight: 300;
      color: var(--about-text);
      margin-bottom: 14px;
    }
    .about-team-desc {
      font-family: var(--sans);
      font-size: 13px;
      line-height: 1.8;
      color: var(--about-muted);
      font-weight: 300;
    }
    .about-timeline {
      list-style: none;
      padding: 0;
      margin: 0;
    }
    .about-tl-item {
      display: grid;
      grid-template-columns: 130px 1fr;
      gap: 36px;
      padding: 28px 0;
      border-bottom: 1px solid var(--about-border);
      align-items: start;
    }
    .about-tl-item:first-child { padding-top: 4px; }
    .about-tl-year {
      font-family: var(--sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.18em;
      color: var(--about-accent);
      text-transform: uppercase;
      padding-top: 5px;
      white-space: nowrap;
    }
    .about-tl-title {
      font-family: var(--serif);
      font-size: clamp(1.05rem, 1.5vw, 1.28rem);
      font-weight: 300;
      color: var(--about-text);
      margin-bottom: 8px;
      line-height: 1.3;
    }
    .about-tl-desc {
      font-family: var(--sans);
      font-size: 12.5px;
      line-height: 1.8;
      color: var(--about-muted);
      font-weight: 300;
    }
    .about-cta-block {
      max-width: 900px;
      margin: 0 auto 0 0;
      padding: 52px 0 16px;
      border-top: 1px solid var(--about-border);
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 28px;
    }
    .about-cta-text {
      font-family: var(--serif);
      font-size: clamp(1.1rem, 1.9vw, 1.55rem);
      font-weight: 300;
      font-style: italic;
      color: var(--about-text);
      line-height: 1.55;
    }
    @media (max-width: 768px) {
      .about-team-grid { grid-template-columns: 1fr; }
      .about-tl-item { grid-template-columns: 1fr; gap: 6px; }
      .about-tl-year { padding-top: 0; }
      .about-intro { margin-bottom: 40px; padding-bottom: 32px; }
      .about-section, .about-team-section, .about-timeline-section { margin-bottom: 48px; }
    }

    /* ===========================
       PAGES LÉGALES
    =========================== */
    .legal-updated {
      font-family: var(--sans);
      font-size: 11px;
      letter-spacing: .06em;
      text-transform: uppercase;
      font-weight: 600;
      color: var(--about-accent);
      margin-bottom: 24px;
      display: block;
    }
    .legal-content .about-body ul {
      list-style: none;
      margin: 0 0 18px;
      padding: 0;
    }
    .legal-content .about-body li {
      position: relative;
      padding-left: 22px;
      margin-bottom: 11px;
      font-size: clamp(0.92rem, 1.1vw, 1.02rem);
      line-height: 1.8;
      color: var(--about-muted);
      font-weight: 300;
    }
    .legal-content .about-body li::before {
      content: '';
      position: absolute;
      left: 2px; top: 11px;
      width: 5px; height: 5px;
      border-radius: 50%;
      background: var(--about-accent);
    }
    .legal-content .about-body a {
      color: var(--about-accent);
      text-decoration: underline;
      text-underline-offset: 2px;
    }
    .legal-dl { margin: 0 0 8px; }
    .legal-dl-row {
      display: grid;
      grid-template-columns: 230px 1fr;
      gap: 16px;
      padding: 13px 0;
      border-bottom: 1px solid var(--about-border);
    }
    .legal-dl-row dt {
      font-family: var(--sans);
      font-weight: 600;
      font-size: 12px;
      letter-spacing: .03em;
      color: var(--about-text);
    }
    .legal-dl-row dd {
      margin: 0;
      font-size: clamp(0.9rem, 1.1vw, 1rem);
      line-height: 1.7;
      color: var(--about-muted);
      font-weight: 300;
    }
    .legal-placeholder {
      color: var(--about-accent);
      font-style: italic;
    }
    @media (max-width: 600px) {
      .legal-dl-row { grid-template-columns: 1fr; gap: 3px; }
      .legal-dl-row dt { margin-bottom: 2px; }
    }

    /* ===========================
       SECTION 1 — INSPIRATIONS (Hero 9 collage)
    =========================== */
    .h9-section {
      background: var(--off-white);
      padding: 112px 32px;
      overflow: hidden;
    }
    .h9-grid {
      max-width: 1280px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 80px;
      align-items: center;
    }
    .h9-content {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
    }
    .h9-label {
      font-family: var(--sans);
      font-size: 9.5px;
      letter-spacing: .28em;
      text-transform: uppercase;
      font-weight: 700;
      color: var(--rose-deep);
      margin-bottom: 18px;
    }
    .h9-title {
      font-family: var(--serif);
      font-size: clamp(2.4rem, 4.6vw, 4rem);
      font-weight: 300;
      line-height: 1.04;
      letter-spacing: -.012em;
      color: var(--text-dark);
      margin-bottom: 22px;
    }
    .h9-title em {
      font-style: italic;
      color: var(--rose-dark);
    }
    .h9-subtitle {
      font-family: var(--sans);
      font-size: clamp(.95rem, 1.15vw, 1.05rem);
      line-height: 1.85;
      color: var(--text-mid);
      font-weight: 300;
      max-width: 480px;
      margin-bottom: 32px;
    }
    .h9-subtitle strong { color: var(--text-dark); font-weight: 500; }
    .h9-actions {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
      margin-bottom: 56px;
    }
    .h9-btn {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 14px 30px;
      font-family: var(--sans);
      font-size: 10.5px;
      font-weight: 600;
      letter-spacing: .22em;
      text-transform: uppercase;
      border-radius: 999px;
      text-decoration: none;
      cursor: pointer;
      transition: background .28s ease, color .28s ease, gap .3s ease, transform .28s ease;
      border: 1px solid transparent;
    }
    .h9-btn-primary {
      background: var(--text-dark);
      color: var(--white);
      box-shadow: 0 6px 24px -10px rgba(26,15,13,.4);
    }
    .h9-btn-primary:hover { background: var(--rose-dark); gap: 14px; }
    .h9-btn-outline {
      background: transparent;
      color: var(--text-dark);
      border: 1px solid rgba(26,15,13,.18);
    }
    .h9-btn-outline:hover { background: var(--text-dark); color: var(--white); border-color: var(--text-dark); }
    .h9-stats {
      display: flex;
      gap: 36px;
      flex-wrap: wrap;
      padding-top: 36px;
      border-top: 1px solid rgba(184,112,112,.20);
      width: 100%;
    }
    .h9-stat { display: flex; align-items: center; gap: 14px; }
    .h9-stat-icon {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: rgba(216,155,155,.18);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--rose-dark);
      flex-shrink: 0;
    }
    .h9-stat-icon svg { width: 18px; height: 18px; }
    .h9-stat-value {
      font-family: var(--serif);
      font-size: 22px;
      font-weight: 500;
      line-height: 1;
      color: var(--text-dark);
      margin: 0 0 4px 0;
    }
    .h9-stat-label {
      font-family: var(--sans);
      font-size: 11.5px;
      font-weight: 400;
      color: var(--text-light);
      margin: 0;
      letter-spacing: .04em;
    }

    /* Right collage */
    .h9-collage {
      position: relative;
      height: 560px;
      width: 100%;
    }
    .h9-img {
      position: absolute;
      background: var(--white);
      padding: 8px;
      border-radius: 22px;
      box-shadow: 0 16px 40px -12px rgba(26,15,13,.16);
      overflow: hidden;
      opacity: 0;
      transform: scale(.85);
      animation: h9-img-in .9s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }
    .h9-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 14px;
      display: block;
    }
    .h9-img-top {
      top: 0;
      left: 50%;
      transform-origin: bottom center;
      width: 280px;
      height: 280px;
      transform: translateX(-50%) scale(.85);
      animation-delay: .15s;
    }
    .h9-img-mid {
      top: 33%;
      right: 0;
      width: 230px;
      height: 230px;
      transform-origin: left center;
      animation-delay: .3s;
    }
    .h9-img-bot {
      bottom: 0;
      left: 0;
      width: 200px;
      height: 200px;
      transform-origin: top right;
      animation-delay: .45s;
    }
    @keyframes h9-img-in {
      to { opacity: 1; transform: scale(1); }
    }
    .h9-img-top { animation-name: h9-img-in-top; }
    @keyframes h9-img-in-top {
      to { opacity: 1; transform: translateX(-50%) scale(1); }
    }

    /* Floating decorative shapes */
    .h9-shape {
      position: absolute;
      animation: h9-float 3s ease-in-out infinite;
      pointer-events: none;
    }
    .h9-shape-1 {
      top: -16px;
      left: 22%;
      width: 64px;
      height: 64px;
      border-radius: 50%;
      background: rgba(216,155,155,.32);
      animation-delay: 0s;
    }
    .h9-shape-2 {
      bottom: -8px;
      right: 24%;
      width: 50px;
      height: 50px;
      border-radius: 12px;
      background: rgba(239,196,196,.45);
      animation-delay: .6s;
    }
    .h9-shape-3 {
      bottom: 28%;
      left: 12px;
      width: 24px;
      height: 24px;
      border-radius: 50%;
      background: rgba(180,116,116,.30);
      animation-delay: 1.2s;
    }
    @keyframes h9-float {
      0%, 100% { transform: translateY(0); }
      50%      { transform: translateY(-9px); }
    }

    /* Responsive */
    @media (max-width: 1024px) {
      .h9-section { padding: 96px 32px; }
      .h9-grid { grid-template-columns: 1fr; gap: 64px; }
      .h9-content { align-items: center; text-align: center; }
      .h9-stats { justify-content: center; }
      .h9-subtitle { margin-left: auto; margin-right: auto; }
      .h9-collage { max-width: 560px; margin: 0 auto; }
    }
    @media (max-width: 640px) {
      .h9-section { padding: 72px 20px; }
      .h9-grid { gap: 48px; }
      .h9-collage { height: 420px; }
      .h9-img-top { width: 220px; height: 220px; }
      .h9-img-mid { width: 175px; height: 175px; }
      .h9-img-bot { width: 155px; height: 155px; }
      .h9-shape-1 { width: 48px; height: 48px; }
      .h9-shape-2 { width: 38px; height: 38px; }
      .h9-actions { width: 100%; justify-content: center; }
      .h9-stats { gap: 24px; }
    }

    /* ===========================
       PRESTATIONS — HERO + CARDS (EthicalHero style)
    =========================== */
    .eth-section {
      background: #FAE8E8;
      padding: 96px 32px 120px;
    }
    .eth-hero {
      max-width: 760px;
      margin: 0 auto 88px;
      text-align: center;
    }
    .eth-label {
      display: inline-block;
      font-family: var(--sans);
      font-size: 9.5px;
      letter-spacing: .28em;
      text-transform: uppercase;
      font-weight: 700;
      color: var(--rose-deep);
      margin-bottom: 22px;
    }
    .eth-title {
      font-family: var(--serif);
      font-size: clamp(2.2rem, 4.4vw, 3.6rem);
      font-weight: 300;
      line-height: 1.06;
      letter-spacing: -.01em;
      color: var(--text-dark);
      margin-bottom: 26px;
    }
    .eth-title em {
      font-style: italic;
      color: var(--rose-dark);
      font-weight: 300;
    }
    .eth-subtitle {
      font-family: var(--sans);
      font-size: clamp(.95rem, 1.15vw, 1.05rem);
      line-height: 1.8;
      color: var(--text-mid);
      font-weight: 300;
      max-width: 600px;
      margin: 0 auto 36px;
    }
    .eth-subtitle strong {
      color: var(--text-dark);
      font-weight: 500;
    }
    .eth-cta {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 14px 32px;
      background: var(--text-dark);
      color: var(--white);
      font-family: var(--sans);
      font-size: 10.5px;
      font-weight: 600;
      letter-spacing: .22em;
      text-transform: uppercase;
      border-radius: 999px;
      text-decoration: none;
      transition: background .28s ease, gap .3s ease, transform .28s ease;
      box-shadow: 0 6px 24px -10px rgba(26,15,13,.4);
    }
    .eth-cta:hover {
      background: var(--rose-dark);
      gap: 16px;
    }
    .eth-cta svg { flex-shrink: 0; transition: transform .3s ease; }
    .eth-cta:hover svg { transform: translateX(2px); }

    /* Grid of cards */
    .eth-grid {
      max-width: 1280px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 24px;
    }
    .eth-card {
      display: block;
      background: var(--white);
      border-radius: 18px;
      overflow: hidden;
      box-shadow: 0 2px 16px -8px rgba(26,15,13,.10);
      cursor: pointer;
      text-decoration: none;
      color: inherit;
      transition: transform .35s var(--ease), box-shadow .35s var(--ease);
    }
    .eth-card:hover {
      transform: translateY(-4px) scale(1.015);
      box-shadow: 0 14px 36px -14px rgba(26,15,13,.22);
    }
    .eth-card-img {
      width: 100%;
      aspect-ratio: 1 / 1;
      overflow: hidden;
      background: var(--rose);
    }
    .eth-card-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform .6s var(--ease);
    }
    .eth-card:hover .eth-card-img img { transform: scale(1.06); }
    .eth-card-body {
      padding: 22px 22px 24px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
    }
    .eth-card-titles { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
    .eth-card-tag {
      font-family: var(--sans);
      font-size: 8.5px;
      letter-spacing: .22em;
      text-transform: uppercase;
      font-weight: 700;
      color: var(--rose-deep);
    }
    .eth-card-title {
      font-family: var(--serif);
      font-size: clamp(1.1rem, 1.4vw, 1.35rem);
      font-weight: 400;
      line-height: 1.2;
      color: var(--text-dark);
    }
    .eth-card-arrow {
      flex-shrink: 0;
      width: 38px;
      height: 38px;
      border-radius: 50%;
      background: rgba(216,155,155,.18);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--rose-dark);
      transition: background .3s var(--ease);
    }
    .eth-card:hover .eth-card-arrow { background: var(--rose-dark); color: var(--white); }
    .eth-card-arrow svg { transition: transform .3s var(--ease); }
    .eth-card:hover .eth-card-arrow svg { transform: translateX(3px); }

    @media (max-width: 1024px) {
      .eth-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
      .eth-section { padding: 80px 32px 96px; }
      .eth-hero { margin-bottom: 64px; }
    }
    @media (max-width: 640px) {
      .eth-grid { grid-template-columns: 1fr; gap: 18px; }
      .eth-section { padding: 64px 20px 80px; }
      .eth-hero { margin-bottom: 48px; }
      .eth-card-img { aspect-ratio: 16 / 11; }
    }

    /* ===========================
       HERO SECTION 2 — NOTRE INSTITUT
    =========================== */
    .section-hs2 {
      display: flex;
      flex-direction: row;
      min-height: 600px;
      background: var(--off-white);
      overflow: hidden;
    }
    .hs2-left {
      flex: 3;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: 80px 64px;
    }
    .hs2-brand { margin-bottom: 0; }
    .hs2-logo {
      font-family: var(--serif);
      font-size: 20px;
      font-weight: 400;
      letter-spacing: .32em;
      text-transform: uppercase;
      color: var(--text-dark);
      display: block;
      margin-bottom: 6px;
    }
    .hs2-logo .accent { color: var(--rose-deep); }
    .hs2-slogan {
      font-family: var(--sans);
      font-size: 9px;
      letter-spacing: .22em;
      text-transform: uppercase;
      font-weight: 600;
      color: var(--rose-deep);
    }
    .hs2-main {}
    .hs2-title {
      font-family: var(--serif);
      font-size: clamp(2.2rem, 3.5vw, 3.6rem);
      font-weight: 400;
      line-height: 1.05;
      color: var(--text-dark);
      margin-bottom: 0;
    }
    .hs2-divider {
      width: 80px;
      height: 3px;
      background: var(--rose-dark);
      margin: 24px 0;
    }
    .hs2-subtitle {
      max-width: 420px;
      font-size: clamp(.9rem, 1.1vw, 1rem);
      line-height: 1.85;
      color: var(--text-mid);
      font-weight: 300;
      margin-bottom: 32px;
      font-family: var(--sans);
    }
    .hs2-cta {
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .22em;
      text-transform: uppercase;
      color: var(--rose-dark);
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      transition: color .25s, gap .3s;
      cursor: pointer;
      background: none;
      border: none;
      padding: 0;
    }
    .hs2-cta:hover { color: var(--text-dark); gap: 18px; }
    .hs2-contact-row {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      padding-top: 36px;
      border-top: 1px solid rgba(184,112,112,.20);
    }
    .hs2-contact-item {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      font-family: var(--sans);
      font-size: 11.5px;
      line-height: 1.65;
      color: var(--text-mid);
      font-weight: 300;
    }
    .hs2-contact-item svg {
      flex-shrink: 0;
      width: 15px;
      height: 15px;
      stroke: var(--rose-dark);
      margin-top: 2px;
    }
    .hs2-contact-item a { color: inherit; }
    /* Right: salon photo with clip-path reveal */
    .hs2-right {
      flex: 2;
      min-height: 520px;
      background-size: cover;
      background-position: center;
      clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
      animation: hs2-reveal 1.4s cubic-bezier(0.16, 1, 0.3, 1) 0.25s forwards;
    }
    @keyframes hs2-reveal {
      to { clip-path: polygon(22% 0, 100% 0, 100% 100%, 0% 100%); }
    }
    /* Minimal footer */
    .site-footer-minimal {
      background: #FAE8E8;
      border-top: 1px solid rgba(184,112,112,.15);
    }
    .footer-minimal-inner {
      max-width: 1380px;
      margin: 0 auto;
      padding: 28px 64px;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 14px;
      text-align: center;
    }
    .footer-resources-links,
    .footer-legal-links {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      gap: 8px 10px;
      font-family: var(--sans);
      font-size: 12px;
      letter-spacing: .02em;
    }
    .footer-resources-links { font-weight: 500; }
    .footer-resources-links a,
    .footer-legal-links a {
      color: var(--text-dark);
      text-decoration: none;
      transition: color .2s ease;
    }
    .footer-resources-links a:hover,
    .footer-legal-links a:hover { color: var(--rose-dark); }
    .footer-resources-links span,
    .footer-legal-links span { color: rgba(0,0,0,.25); }
    @media (max-width: 1024px) {
      .hs2-left { padding: 64px 40px; }
      .hs2-contact-row { grid-template-columns: 1fr 1fr; gap: 16px; }
    }
    @media (max-width: 768px) {
      .section-hs2 { flex-direction: column; }
      .hs2-left { padding: 56px 24px; }
      .hs2-right { flex: none; min-height: 300px; clip-path: none !important; animation: none; }
      .hs2-contact-row { grid-template-columns: 1fr; gap: 14px; }
      .footer-minimal-inner { padding: 20px 24px; flex-direction: column; align-items: flex-start; }
    }

    /* ===== PARTENAIRES ===== */
    .partners-band {
      background: #FEFAF7;
      border-top: 1px solid rgba(184,112,112,.15);
      padding: 56px 64px;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 28px;
      text-align: center;
    }
    .partners-label {
      font-family: var(--sans);
      font-size: 9.5px;
      letter-spacing: .28em;
      text-transform: uppercase;
      font-weight: 700;
      color: var(--rose-dark);
    }
    .partners-logos {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
      gap: 36px;
    }
    .partner-logo {
      display: inline-flex;
      transition: opacity .25s var(--ease), transform .25s var(--ease);
    }
    .partner-logo:hover { opacity: .82; transform: translateY(-2px); }
    .partner-logo img {
      width: auto;
      height: auto;
      max-width: 100%;
      object-fit: contain;
      display: block;
    }
    @media (max-width: 768px) {
      .partners-band { padding: 44px 24px; }
    }

    /* ===== Soin Visage — Carrousel élégant ===== */
    .viz-carousel {
      --viz-accent: var(--rose-dark);
      position: relative;
      background: var(--off-white);
      padding: clamp(34px, 5vw, 72px);
      overflow: hidden;
      isolation: isolate;
    }
    .viz-wash {
      position: absolute; inset: 0; z-index: 0; pointer-events: none;
      background: radial-gradient(ellipse at 72% 45%, rgba(184,112,112,.10) 0%, transparent 68%);
      transition: background .8s var(--ease);
    }
    .viz-inner {
      position: relative; z-index: 1;
      display: grid;
      grid-template-columns: 1fr minmax(300px, 440px);
      gap: clamp(32px, 5vw, 72px);
      align-items: center;
    }

    /* Colonne texte */
    .viz-text-col { display: flex; flex-direction: column; }
    .viz-index { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; }
    .viz-index-line { width: 46px; height: 1px; background: var(--viz-accent); transition: background .8s var(--ease); }
    .viz-index-num { font-size: 11px; letter-spacing: .22em; font-weight: 600; color: var(--text-dark); }
    .viz-index-num span { color: var(--text-light); }

    .viz-text-stack { position: relative; display: grid; grid-template-columns: 1fr; min-height: 220px; }
    .viz-slide-text {
      grid-column: 1; grid-row: 1;
      opacity: 0; transform: translateY(18px); pointer-events: none;
      transition: opacity .7s var(--ease), transform .7s var(--ease);
    }
    .viz-slide-text.is-active { opacity: 1; transform: none; pointer-events: auto; }
    .viz-slide-title {
      font-family: var(--serif); font-weight: 300;
      font-size: clamp(34px, 4vw, 54px); line-height: 1.05; letter-spacing: .01em;
      color: var(--text-dark); margin-bottom: 14px;
    }
    .viz-slide-subtitle {
      display: block; font-size: 10px; letter-spacing: .24em; text-transform: uppercase;
      font-weight: 700; color: var(--viz-accent); margin-bottom: 22px;
      transition: color .8s var(--ease);
    }
    .viz-slide-desc {
      font-size: 14px; line-height: 1.8; font-weight: 300; color: var(--text-mid);
      max-width: 48ch; margin-bottom: 20px;
    }
    .viz-slide-meta {
      display: inline-block; font-size: 9.5px; letter-spacing: .18em; text-transform: uppercase;
      font-weight: 700; color: var(--viz-accent); transition: color .8s var(--ease);
    }

    /* Contrôles */
    .viz-controls { display: flex; align-items: center; gap: 26px; margin-top: 40px; flex-wrap: wrap; }
    .viz-arrows { display: flex; gap: 12px; }
    .viz-arrow {
      width: 48px; height: 48px; border: 1px solid var(--rose-mid); border-radius: 50%;
      display: flex; align-items: center; justify-content: center; color: var(--text-dark);
      transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
    }
    .viz-arrow:hover { background: var(--viz-accent); border-color: var(--viz-accent); color: var(--white); }
    .viz-book {
      font-size: 10px; letter-spacing: .16em; text-transform: uppercase; font-weight: 600;
      color: var(--rose-dark); border-bottom: 1px solid var(--rose-mid); padding-bottom: 4px;
      transition: color .2s, border-color .2s;
    }
    .viz-book:hover { color: var(--text-dark); border-color: var(--rose-dark); }

    /* Colonne image */
    .viz-image-col { position: relative; }
    .viz-image-stack { position: relative; aspect-ratio: 4 / 5; overflow: hidden; }
    .viz-image-frame {
      position: absolute; inset: 0; opacity: 0; transform: scale(1.06);
      transition: opacity .8s var(--ease), transform 1.3s var(--ease);
    }
    .viz-image-frame.is-active { opacity: 1; transform: scale(1); }
    .viz-image-frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .viz-image-frame::after {
      content: ''; position: absolute; inset: 0;
      background: linear-gradient(150deg, rgba(184,112,112,.20) 0%, transparent 55%);
    }
    .viz-corner {
      position: absolute; width: 38px; height: 38px; z-index: 2; pointer-events: none;
      border: 1px solid var(--viz-accent); transition: border-color .8s var(--ease);
    }
    .viz-corner--tl { top: -10px; left: -10px; border-right: none; border-bottom: none; }
    .viz-corner--br { bottom: -10px; right: -10px; border-left: none; border-top: none; }

    /* Progression */
    .viz-progress {
      position: relative; z-index: 1;
      display: grid; grid-auto-flow: column; grid-auto-columns: 1fr;
      gap: clamp(10px, 2vw, 26px);
      margin-top: clamp(40px, 5vw, 60px); padding-top: 28px;
      border-top: 1px solid var(--rose-mid);
    }
    .viz-dot { display: flex; flex-direction: column; gap: 12px; text-align: left; opacity: .5; transition: opacity .3s; min-width: 0; }
    .viz-dot.is-active, .viz-dot:hover { opacity: 1; }
    .viz-dot-track { height: 2px; width: 100%; background: var(--rose-mid); overflow: hidden; }
    .viz-dot-fill { display: block; height: 100%; width: 0%; background: var(--viz-accent); }
    .viz-dot-label { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: var(--text-mid); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .viz-dot.is-active .viz-dot-label { color: var(--text-dark); }
    /* Sections nombreuses (> 4 prestations) : segments compacts sans label */
    .viz-many .viz-progress { gap: 7px; }
    .viz-many .viz-dot { gap: 0; }
    .viz-many .viz-dot-label { display: none; }

    @media (max-width: 900px) {
      .viz-inner { grid-template-columns: 1fr; }
      .viz-image-col { order: -1; }
      .viz-image-stack { aspect-ratio: 3 / 2; }
      .viz-text-stack { transition: none; }
    }
    @media (max-width: 560px) {
      .viz-carousel:not(.viz-many) .viz-progress { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: 1fr; gap: 14px; }
      .viz-image-stack { aspect-ratio: 4 / 3; }
      .viz-controls { gap: 18px; }
    }
    @media (prefers-reduced-motion: reduce) {
      .viz-slide-text, .viz-image-frame, .viz-text-stack { transition: none; }
    }

    /* ===== Variante Équipe — pile de portraits (style testimonials) ===== */
    .viz-team { background: var(--white); padding: clamp(28px, 4vw, 56px) 0; }
    .viz-team .viz-wash { display: none; }
    .viz-team .viz-image-stack { overflow: visible; aspect-ratio: 4 / 5; }
    .viz-team .viz-image-frame {
      opacity: .4; transform: scale(.97) rotate(var(--tm-rot, 0deg));
      transition: opacity .65s var(--ease), transform .7s var(--ease);
      border-radius: 20px; overflow: hidden;
      box-shadow: 0 26px 55px -22px rgba(120,60,60,.5);
    }
    .viz-team .viz-image-frame::after {
      background: linear-gradient(150deg, rgba(184,112,112,.12) 0%, transparent 55%);
    }
    .viz-team .viz-image-frame.is-active { opacity: 1; transform: scale(1) rotate(0deg); z-index: 5; }
    .viz-team .viz-image-frame:nth-child(1) { --tm-rot: -8deg; }
    .viz-team .viz-image-frame:nth-child(2) { --tm-rot:  7deg; }
    .viz-team .viz-image-frame:nth-child(3) { --tm-rot: -5deg; }
    .viz-team .viz-image-frame:nth-child(4) { --tm-rot:  6deg; }
    /* Carte monogramme (portrait à venir) */
    .tm-monogram {
      position: absolute; inset: 0; display: flex; flex-direction: column;
      align-items: center; justify-content: center; gap: 14px;
      background: linear-gradient(155deg, var(--rose) 0%, var(--rose-mid) 52%, var(--rose-deep) 100%);
    }
    .tm-initial { font-family: var(--serif); font-weight: 300; font-size: clamp(90px, 13vw, 150px); line-height: 1; color: var(--white); }
    .tm-soon { font-size: 10px; letter-spacing: .24em; text-transform: uppercase; font-weight: 600; color: rgba(255,255,255,.92); }
    /* Layout image à gauche en desktop */
    @media (min-width: 901px) {
      .viz-team .viz-inner { grid-template-columns: minmax(300px, 420px) 1fr; }
    }
    @media (max-width: 900px) {
      .viz-team .viz-image-col { max-width: 360px; width: 100%; margin-inline: auto; }
    }

    /* ===== POP-UP VIDÉO ANNONCE ===== */
    .video-popup {
      position: fixed; inset: 0; z-index: 9999;
      display: flex; align-items: center; justify-content: center; padding: 24px;
      background: rgba(26,26,26,.82);
      -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
      opacity: 0; visibility: hidden;
      transition: opacity .4s var(--ease), visibility .4s var(--ease);
    }
    .video-popup.is-open { opacity: 1; visibility: visible; }
    .video-popup-inner {
      position: relative; width: 100%; max-width: 860px;
      transform: translateY(18px) scale(.985);
      transition: transform .45s var(--ease);
    }
    .video-popup.is-open .video-popup-inner { transform: none; }
    .video-popup video {
      display: block; width: 100%; height: auto; max-height: 82vh;
      border-radius: 6px; background: #000;
      box-shadow: 0 30px 80px rgba(0,0,0,.5);
    }
    .video-popup-close {
      position: absolute; top: -44px; right: 0;
      display: inline-flex; align-items: center; gap: 8px;
      color: var(--white); font-family: var(--sans);
      font-size: 10.5px; letter-spacing: .18em; text-transform: uppercase; font-weight: 600;
      background: none; transition: opacity .2s;
    }
    .video-popup-close:hover { opacity: .65; }
    .video-popup-close .x { font-size: 24px; line-height: 1; font-weight: 300; }
    .video-popup-unmute {
      position: absolute; top: 14px; left: 14px; z-index: 2;
      display: inline-flex; align-items: center; gap: 7px;
      padding: 9px 16px; border-radius: 999px;
      background: rgba(184,112,112,.92); color: var(--white);
      font-family: var(--sans); font-size: 10px; letter-spacing: .14em;
      text-transform: uppercase; font-weight: 600;
      -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
      box-shadow: 0 6px 20px rgba(0,0,0,.35);
      transition: opacity .2s var(--ease), transform .2s var(--ease);
    }
    .video-popup-unmute:hover { transform: translateY(-1px); opacity: .92; }
    .video-popup-unmute svg { width: 13px; height: 13px; }
    @media (max-width: 600px) {
      .video-popup { padding: 16px; }
      .video-popup-close { top: -38px; }
    }
    @media (prefers-reduced-motion: reduce) {
      .video-popup { transition: opacity .2s linear, visibility .2s linear; }
      .video-popup-inner { transition: none; transform: none; }
    }