:root{
  --green:#12362f;--green-2:#193f37;--ink:#18342e;--paper:#f3f0e9;--white:#fff;--gold:#b79b68;--line:rgba(18,54,47,.16);--text:#263833;--muted:#6e7a76;--shell:min(1240px,calc(100% - 64px));--ease:cubic-bezier(.2,.72,.2,1);--sans:"Manrope","Helvetica Neue",Arial,sans-serif;--serif:"Cormorant Garamond",Georgia,serif;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--text);font-family:var(--sans);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}img{display:block;width:100%;height:100%;object-fit:cover}figure{margin:0}h1,h2,h3,p{margin-top:0}.shell{width:var(--shell);margin-inline:auto}.section{padding:128px 0}.kicker,.section-tag p{font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.kicker{color:var(--green)}.kicker.light{color:#d8e0dc}.lead{font-size:1.18rem;line-height:1.55;color:var(--ink)}h2{font-size:clamp(2.6rem,4.7vw,5.6rem);line-height:1.02;letter-spacing:-.055em;font-weight:500;color:var(--ink);margin-bottom:34px}.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease) var(--delay,0s),transform .8s var(--ease) var(--delay,0s)}.reveal.in-view{opacity:1;transform:none}
.page-progress{position:fixed;left:0;right:0;top:0;height:2px;z-index:100}.page-progress span{display:block;height:100%;width:0;background:var(--gold)}
.site-header{position:fixed;z-index:90;top:0;left:0;right:0;height:84px;padding:0 32px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;color:#fff;border-bottom:1px solid rgba(255,255,255,.2);transition:.35s var(--ease)}.site-header.scrolled{height:70px;background:rgba(243,240,233,.94);backdrop-filter:blur(16px);color:var(--ink);border-bottom-color:var(--line)}.brand{display:flex;align-items:center;width:max-content;background:rgba(248,246,240,.94);padding:8px 12px;border-radius:2px;box-shadow:0 8px 28px rgba(5,18,15,.08)}.brand-logo{width:210px;height:auto;max-height:40px;object-fit:contain}.site-header.scrolled .brand{background:transparent;box-shadow:none;padding-left:0}.site-header.scrolled .brand-logo{width:196px}.desktop-nav{display:flex;gap:30px;align-items:center;font-size:.66rem;text-transform:uppercase;letter-spacing:.11em;font-weight:700}.desktop-nav a{position:relative}.desktop-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:-7px;height:1px;background:currentColor;transition:right .3s}.desktop-nav a:hover::after{right:0}.header-cta{justify-self:end;font-size:.66rem;text-transform:uppercase;letter-spacing:.11em;font-weight:700;display:flex;gap:10px}.menu-toggle{display:none;background:none;border:0;padding:10px;color:inherit}.menu-toggle span{display:block;width:24px;height:1px;background:currentColor;margin:7px 0}.mobile-nav{display:none}
.hero{min-height:100svh;color:#fff;position:relative;overflow:hidden;display:flex;flex-direction:column;background:var(--green)}.hero-image{position:absolute;inset:0;background:url('../images/06.webp') center 55%/cover no-repeat;transform:scale(1.02)}.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,20,17,.68) 0%,rgba(7,24,21,.30) 38%,rgba(6,19,17,.82) 100%),linear-gradient(90deg,rgba(5,18,15,.56) 0%,rgba(5,18,15,.14) 62%,rgba(5,18,15,.26) 100%)}.hero-topline{position:relative;z-index:1;margin-top:118px;display:flex;justify-content:space-between;font-size:.6rem;text-transform:uppercase;letter-spacing:.15em;color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.35)}.hero-content{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:6vh}.hero-label{display:inline-flex;width:max-content;background:#f2eee5;color:var(--green);padding:8px 11px;font-size:.64rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;margin-bottom:18px}.hero-main{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,.72fr);align-items:end;gap:70px;padding-top:26px;border-top:1px solid rgba(255,255,255,.32)}.hero h1{font-family:var(--sans);font-size:clamp(4.6rem,9vw,9.3rem);line-height:.82;letter-spacing:-.068em;font-weight:500;margin:0;text-shadow:0 2px 30px rgba(0,0,0,.24)}.hero-side{padding:22px 22px 8px;background:rgba(7,24,21,.42);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.18)}.hero-side p{font-size:1rem;line-height:1.55;max-width:430px;color:#fff;margin-bottom:24px}.outline-link{display:flex;justify-content:space-between;align-items:center;width:100%;border:1px solid rgba(255,255,255,.62);padding:14px 16px;font-size:.64rem;text-transform:uppercase;letter-spacing:.12em;font-weight:700;transition:.25s}.outline-link:hover{background:#fff;color:var(--green)}
.facts-strip{background:#fff;border-bottom:1px solid var(--line)}.facts-grid{display:grid;grid-template-columns:repeat(4,1fr)}.facts-grid>div{padding:27px 28px 28px 0;border-right:1px solid var(--line);position:relative}.facts-grid>div+div{padding-left:28px}.facts-grid>div:last-child{border-right:0}.facts-grid span{position:absolute;right:18px;top:25px;font-size:.6rem;color:#a2aaa7}.facts-grid small,.facts-grid strong{display:block}.facts-grid small{font-size:.57rem;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);margin-bottom:6px}.facts-grid strong{font-size:.84rem;line-height:1.45;color:var(--ink);font-weight:700;padding-right:18px}
.section-tag{display:flex;gap:18px;align-items:center;margin-bottom:32px}.section-tag span{width:34px;height:34px;border:1px solid var(--line);display:grid;place-items:center;border-radius:50%;font-size:.62rem;color:var(--muted)}.section-tag p{margin:0;color:var(--green)}.intro-grid{display:grid;grid-template-columns:1fr 2.1fr 1.15fr;gap:52px;align-items:start}.intro-title h2{font-size:clamp(2.7rem,4.8vw,5.5rem)}.intro-copy{padding-top:9px}.intro-copy p:last-child{color:var(--muted)}.image-wide{height:min(64vw,720px);margin-top:70px;position:relative}.image-wide img{filter:saturate(.92) contrast(.98)}figcaption{position:absolute;left:18px;bottom:16px;background:rgba(245,242,235,.92);color:var(--ink);padding:9px 12px;font-size:.56rem;text-transform:uppercase;letter-spacing:.12em}figcaption span{margin-right:10px;color:var(--muted)}
.dark-section{background:var(--green);color:#fff}.dark-section h2{color:#fff}.concept-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:10vw}.concept-left h2{font-size:clamp(3.4rem,5.8vw,6.4rem);font-weight:500}.concept-left h2 span{font-family:var(--serif);font-weight:500;font-size:1.08em}.concept-right{padding-top:54px}.statement{font-size:clamp(1.35rem,2vw,2.15rem);line-height:1.35;letter-spacing:-.03em;color:#eef2ef;margin-bottom:58px}.concept-points{border-top:1px solid rgba(255,255,255,.18)}.concept-points>div{display:grid;grid-template-columns:38px 140px 1fr;gap:18px;padding:23px 0;border-bottom:1px solid rgba(255,255,255,.13)}.concept-points span{font-size:.64rem;color:#aebdb8}.concept-points h3{font-size:.82rem;text-transform:uppercase;letter-spacing:.07em;margin:0}.concept-points p{font-size:.84rem;color:#b9c6c1;margin:0}
.split-heading{display:grid;grid-template-columns:1fr 2fr;gap:50px;align-items:start;margin-bottom:70px}.split-heading h2{font-size:clamp(2.9rem,4.8vw,5.8rem);margin:0}.programme-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.programme-card{background:var(--paper);padding:32px;min-height:520px;display:grid;grid-template-rows:auto auto 1fr;gap:22px}.card-index{font-size:.62rem;color:var(--muted)}.programme-card h3{font-size:1.75rem;letter-spacing:-.035em;color:var(--ink);margin:0 0 10px}.programme-card p{max-width:470px;color:var(--muted);margin-bottom:0}.programme-card img{height:250px;margin-top:auto}
.location-section{background:#fff}.location-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:80px;align-items:center}.location-copy h2{font-size:clamp(2.8rem,4.7vw,5.4rem)}.location-copy ul{list-style:none;padding:0;margin:42px 0 0;border-top:1px solid var(--line)}.location-copy li{display:grid;grid-template-columns:44px 1fr;padding:16px 0;border-bottom:1px solid var(--line);font-size:.9rem;color:var(--ink)}.location-copy li span{font-size:.62rem;color:var(--muted)}.location-visual{height:660px;position:relative}.location-visual img{object-position:center}
.architecture-stage{display:grid;grid-template-columns:1.6fr 1fr;grid-template-rows:1fr 1fr;gap:16px}.architecture-stage figure{position:relative;overflow:hidden;background:#ddd}.arch-main{grid-row:1/3;min-height:760px}.arch-side{min-height:372px}.architecture-stage img{transition:transform .7s var(--ease)}.architecture-stage figure:hover img{transform:scale(1.025)}
.progress-section{background:#e8e4dc}.progress-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:90px;align-items:end}.progress-copy h2{font-size:clamp(2.9rem,4.8vw,5.7rem)}.progress-copy>p:last-child{max-width:640px;color:var(--muted)}.timeline{border-top:1px solid var(--line)}.timeline-item{display:grid;grid-template-columns:18px 90px 1fr;gap:18px;align-items:center;padding:20px 0;border-bottom:1px solid var(--line)}.timeline-item>span{width:8px;height:8px;border-radius:50%;background:#b6b6b1}.timeline-item.complete>span{background:var(--green)}.timeline-item.active>span{background:var(--gold);box-shadow:0 0 0 6px rgba(181,154,102,.18)}.timeline-item small{font-size:.6rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}.timeline-item strong{font-size:.86rem;color:var(--ink)}.progress-visual{height:560px;margin-top:66px;position:relative}
.future-section{background:#fff}.future-grid{display:grid;grid-template-columns:.45fr 1.4fr 1fr;gap:60px}.future-number{font-family:var(--serif);font-size:clamp(6rem,11vw,12rem);line-height:.8;letter-spacing:-.06em;color:#d7ddd8}.future-copy h2{font-size:clamp(2.8rem,4.7vw,5.5rem)}.future-list{border-top:1px solid var(--line)}.future-list p{margin:0;padding:14px 0;border-bottom:1px solid var(--line);font-size:.86rem;color:var(--ink)}
.art-band{background:var(--green-2);color:#fff;padding:100px 0}.art-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:80px;align-items:center}.art-copy h2{color:#fff;font-size:clamp(3rem,5vw,5.8rem)}.art-copy>p:last-child{max-width:650px;color:#c0ccc7}.art-visual{height:500px;position:relative}.contact{background:var(--paper)}.contact-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:100px}.contact-heading h2{font-size:clamp(3rem,5vw,5.9rem)}.contact-card{background:#fff;border:1px solid var(--line);padding:36px}.contact-card>div{padding:18px 0;border-bottom:1px solid var(--line)}.contact-card small,.contact-card strong,.contact-card a{display:block}.contact-card small{font-size:.57rem;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);margin-bottom:5px}.contact-card strong,.contact-card>div>a{font-size:.92rem;color:var(--ink);font-weight:700}.contact-button{margin-top:30px;background:var(--green);color:#fff!important;padding:17px 18px;display:flex!important;justify-content:space-between;align-items:center;text-transform:uppercase;font-size:.66rem!important;letter-spacing:.12em;font-weight:700!important}.contact-button:hover{background:var(--green-2)}
.site-footer{background:#0d2c26;color:#fff;padding:34px 0}.footer-grid{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:end}.footer-brand img{width:230px;height:auto;filter:brightness(0) invert(1);opacity:.86}.footer-grid>p{margin:0;font-size:.58rem;text-transform:uppercase;letter-spacing:.1em;color:#aebbb7}.footer-grid>p:nth-child(2){text-align:center}.footer-grid>p:last-child{text-align:right}
@media(max-width:980px){:root{--shell:min(100% - 36px,760px)}.site-header{height:72px;padding:0 18px;grid-template-columns:1fr auto}.brand-logo{width:175px}.site-header.scrolled .brand-logo{width:165px}.desktop-nav,.header-cta{display:none}.menu-toggle{display:block}.mobile-nav{display:flex;position:fixed;z-index:85;inset:0;background:var(--paper);color:var(--ink);flex-direction:column;justify-content:center;padding:80px 28px;gap:10px;transform:translateX(100%);transition:.4s var(--ease)}.mobile-nav.open{transform:none}.mobile-nav a{font-size:2.1rem;letter-spacing:-.04em}.hero-topline{margin-top:104px}.hero-topline span:last-child{display:none}.hero-main{grid-template-columns:1fr;gap:30px}.hero h1{font-size:clamp(5rem,16vw,8rem)}.hero-side{max-width:520px}.facts-grid{grid-template-columns:1fr 1fr}.facts-grid>div:nth-child(2){border-right:0}.facts-grid>div:nth-child(n+3){border-top:1px solid var(--line)}.intro-grid,.concept-grid,.location-grid,.progress-grid,.future-grid,.art-grid,.contact-grid{grid-template-columns:1fr}.split-heading{grid-template-columns:1fr}.programme-grid{grid-template-columns:1fr}.architecture-stage{grid-template-columns:1fr 1fr}.arch-main{grid-column:1/3;grid-row:auto;min-height:560px}.location-visual{height:560px}.art-visual{height:430px}.footer-grid{grid-template-columns:1fr auto}.footer-grid>p:nth-child(2){display:none}}
@media(max-width:640px){:root{--shell:calc(100% - 28px)}.section{padding:88px 0}.hero{min-height:760px}.hero h1{font-size:clamp(4.2rem,20vw,6.6rem)}.hero-side p{font-size:.92rem}.facts-grid{grid-template-columns:1fr}.facts-grid>div,.facts-grid>div+div{padding:17px 0;border-right:0;border-top:1px solid var(--line)}.facts-grid>div:first-child{border-top:0}.intro-grid{gap:16px}.intro-title h2{font-size:3rem}.image-wide{height:440px;margin-top:46px}.concept-left h2{font-size:3.6rem}.concept-points>div{grid-template-columns:28px 1fr}.concept-points p{grid-column:2}.split-heading{margin-bottom:44px}.split-heading h2{font-size:3rem}.programme-card{padding:24px;min-height:440px}.programme-card img{height:220px}.location-visual{height:440px}.architecture-stage{grid-template-columns:1fr}.arch-main{grid-column:auto;min-height:430px}.arch-side{min-height:350px}.progress-visual{height:430px}.timeline-item{grid-template-columns:16px 72px 1fr}.future-grid{gap:34px}.future-number{font-size:6rem}.art-band{padding:78px 0}.art-visual{height:390px}.contact-grid{gap:45px}.contact-card{padding:26px}.footer-grid{grid-template-columns:1fr;gap:14px}.footer-grid>p:last-child{text-align:left}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}}

/* V7 — image placeholders. Replace each .visual-placeholder with an <img> later if desired. */
.visual-placeholder{position:relative;overflow:hidden;display:flex;align-items:flex-end;justify-content:space-between;padding:18px 20px;color:rgba(18,54,47,.72);isolation:isolate}
.visual-placeholder::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--placeholder-bg,#d8d2c8)}
.visual-placeholder::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(135deg,rgba(255,255,255,.18),transparent 48%,rgba(18,54,47,.06))}
.visual-placeholder>span{font-size:clamp(2.5rem,5vw,5rem);font-weight:500;letter-spacing:-.06em;line-height:.8;opacity:.32}
.visual-placeholder>small{font-size:.55rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:.58}
.placeholder-01{--placeholder-bg:#d8d3ca}.placeholder-02{--placeholder-bg:#b9c5bd}.placeholder-03{--placeholder-bg:#d7c8b8}.placeholder-04{--placeholder-bg:#c9bca8}.placeholder-05{--placeholder-bg:#aebcaf}.placeholder-06{--placeholder-bg:#c8cbc4}.placeholder-07{--placeholder-bg:#b8c0ba}.placeholder-08{--placeholder-bg:#d4cdc0}.placeholder-09{--placeholder-bg:#b9b4aa}.placeholder-10{--placeholder-bg:#c8bda9}
.hero-image{background:none!important;transform:none;padding:0;align-items:flex-end;justify-content:flex-end;color:rgba(255,255,255,.65)}
.hero-image::before{background:linear-gradient(120deg,#173a32 0%,#284d43 48%,#8a8f7f 100%)}
.hero-image::after{background:radial-gradient(circle at 68% 24%,rgba(255,255,255,.16),transparent 28%),linear-gradient(180deg,transparent 45%,rgba(6,20,17,.18))}
.hero-image>span,.hero-image>small{position:absolute;right:32px;bottom:26px;z-index:1}.hero-image>span{bottom:44px;font-size:3.5rem;opacity:.18}.hero-image>small{opacity:.42}
.hero-shade{background:linear-gradient(180deg,rgba(6,20,17,.18),rgba(6,20,17,.28) 40%,rgba(6,20,17,.64) 100%)}
.image-wide>.visual-placeholder,.location-visual>.visual-placeholder,.progress-visual>.visual-placeholder,.art-visual>.visual-placeholder{width:100%;height:100%}
.programme-card>.visual-placeholder{width:100%;height:250px;margin-top:auto}
.architecture-stage .visual-placeholder{width:100%;height:100%;min-height:inherit}
.brand{background:rgba(248,246,240,.96)}
.brand-logo{width:236px;max-height:46px}
.site-header.scrolled .brand-logo{width:220px}
.footer-brand img{width:245px;filter:none;opacity:1;background:#fff;padding:8px 10px}
@media(max-width:980px){.brand-logo{width:190px}.site-header.scrolled .brand-logo{width:178px}}
@media(max-width:640px){.programme-card>.visual-placeholder{height:220px}.hero-image>span,.hero-image>small{right:14px}}


/* V8 — logo integration */
.brand{background:transparent!important;padding:0!important;box-shadow:none!important;border-radius:0!important}
.brand-logo{width:236px;max-height:46px;object-fit:contain}
.site-header.scrolled{background:rgba(13,44,38,.94)!important;color:#fff!important;border-bottom-color:rgba(255,255,255,.16)!important}
.site-header.scrolled .brand{background:transparent!important;padding:0!important;box-shadow:none!important}
.site-header.scrolled .brand-logo{width:220px}
.hero-wordmark{min-width:0;display:flex;align-items:flex-end}
.hero-logo{width:min(690px,100%);height:auto;object-fit:contain;object-position:left bottom}
.hero-main{grid-template-columns:minmax(0,1.6fr) minmax(280px,.72fr)}
.footer-brand img{background:transparent!important;padding:0!important}
@media(max-width:980px){.brand-logo{width:190px}.site-header.scrolled .brand-logo{width:178px}.hero-logo{width:min(560px,100%)}}
@media(max-width:640px){.brand-logo{width:165px}.site-header.scrolled .brand-logo{width:155px}.hero-logo{width:100%}}


/* V9 — hero photograph with premium green fade */
.hero-image.hero-photo{
  background:url('../images/00.webp') center 42%/cover no-repeat!important;
  transform:scale(1.065);
  padding:0!important;
}
.hero-image.hero-photo::before,
.hero-image.hero-photo::after{display:none!important}
.hero-shade{
  background:
    linear-gradient(180deg,
      rgba(7,24,21,.20) 0%,
      rgba(7,24,21,.08) 30%,
      rgba(7,24,21,.18) 56%,
      rgba(13,44,38,.68) 76%,
      rgba(13,44,38,.96) 94%,
      #0d2c26 100%)!important,
    linear-gradient(90deg,rgba(5,18,15,.26) 0%,rgba(5,18,15,.04) 58%,rgba(5,18,15,.15) 100%)!important;
}
.hero-content{padding-bottom:7vh}
.hero-topline{text-shadow:0 2px 18px rgba(0,0,0,.38)}
.hero-label{box-shadow:0 12px 30px rgba(6,20,17,.12)}
.hero-side{
  background:rgba(10,34,29,.46);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
@media(max-width:640px){
  .hero-image.hero-photo{background-position:58% center!important}
  .hero-shade{
    background:linear-gradient(180deg,rgba(7,24,21,.22) 0%,rgba(7,24,21,.10) 28%,rgba(13,44,38,.70) 70%,#0d2c26 100%)!important
  }
}

/* V10.1 — popup d'information projet : format plus compact et typographie simplifiée */
.project-modal{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:24px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .38s var(--ease),visibility .38s var(--ease)}
.project-modal.is-open{opacity:1;visibility:visible;pointer-events:auto}
.project-modal__backdrop{position:absolute;inset:0;background:rgba(4,15,13,.76);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.project-modal__dialog{position:relative;z-index:1;width:min(860px,90vw);min-height:470px;display:grid;grid-template-columns:44% 56%;background:#f7f5ef;box-shadow:0 28px 72px rgba(0,0,0,.30);overflow:hidden;transform:translateY(18px) scale(.99);opacity:0;transition:transform .5s var(--ease),opacity .4s var(--ease)}
.project-modal.is-open .project-modal__dialog{transform:none;opacity:1}
.project-modal__visual{position:relative;min-height:470px;overflow:hidden;background:#c9cec6}
.project-modal__visual img{width:100%;height:100%;object-fit:cover;object-position:48% center;display:block;transform:scale(1.015);transition:transform 1s var(--ease)}
.project-modal.is-open .project-modal__visual img{transform:scale(1)}
.project-modal__visual::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,44,38,.01) 52%,rgba(13,44,38,.45) 100%)}
.project-modal__visual-tag{position:absolute;z-index:2;left:22px;bottom:20px;color:#fff;text-transform:uppercase;font-size:.64rem;font-weight:700;letter-spacing:.12em;border:1px solid rgba(255,255,255,.50);padding:9px 11px;background:rgba(13,44,38,.22);backdrop-filter:blur(8px)}
.project-modal__content{display:flex;flex-direction:column;justify-content:center;padding:46px 50px 42px;color:var(--ink)}
.project-modal__eyebrow,.project-modal__status,.project-modal__cta{font-family:"Manrope",sans-serif;font-size:.66rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase}
.project-modal__eyebrow{margin:0 0 13px;color:var(--green-2)}
.project-modal__content h2{margin:0 0 18px;font-family:"Manrope",sans-serif;font-weight:500;font-size:clamp(2.05rem,3.2vw,3.05rem);line-height:1.02;letter-spacing:-.045em;color:var(--green)}
.project-modal__content h2 span{font:inherit;letter-spacing:inherit;color:inherit}
.project-modal__status{margin:0 0 20px;padding:0 0 15px;border-bottom:1px solid rgba(18,54,47,.15);color:#4d625b}
.project-modal__content>p:not(.project-modal__eyebrow):not(.project-modal__status):not(.project-modal__note){margin:0 0 12px;font-size:.91rem;line-height:1.62;color:#2d3c37}
.project-modal__note{margin:0 0 22px;font-size:.78rem;line-height:1.55;color:#6d7773}
.project-modal__cta{align-self:flex-start;border:0;background:var(--green);color:#fff;padding:14px 17px;display:inline-flex;align-items:center;gap:28px;cursor:pointer;transition:background .25s ease,transform .25s ease}
.project-modal__cta:hover{background:var(--green-2);transform:translateY(-2px)}
.project-modal__cta span{font-size:.95rem;font-weight:400;line-height:1}
.project-modal__close{position:absolute;z-index:4;top:14px;right:14px;width:38px;height:38px;border:0;background:transparent;cursor:pointer}
.project-modal__close span{position:absolute;left:10px;top:18px;width:18px;height:1px;background:var(--green);transition:transform .25s ease}
.project-modal__close span:first-child{transform:rotate(45deg)}
.project-modal__close span:last-child{transform:rotate(-45deg)}
.project-modal__close:hover span:first-child{transform:rotate(135deg)}
.project-modal__close:hover span:last-child{transform:rotate(45deg)}
body.modal-open{overflow:hidden}
@media(max-width:820px){
  .project-modal{padding:18px}
  .project-modal__dialog{width:min(560px,100%);max-height:91vh;overflow:auto;grid-template-columns:1fr;min-height:0}
  .project-modal__visual{height:190px;min-height:190px}
  .project-modal__content{padding:30px 30px 28px}
  .project-modal__content h2{font-size:clamp(2rem,7vw,2.65rem)}
  .project-modal__close{background:rgba(247,245,239,.90);border-radius:50%}
  .project-modal__visual-tag{left:16px;bottom:15px}
}
@media(max-width:520px){
  .project-modal{padding:10px}
  .project-modal__dialog{width:100%;max-height:94vh}
  .project-modal__visual{height:155px;min-height:155px}
  .project-modal__content{padding:24px 20px 22px}
  .project-modal__eyebrow{margin-bottom:10px}
  .project-modal__content h2{margin-bottom:14px;font-size:clamp(1.8rem,9vw,2.25rem)}
  .project-modal__status{margin-bottom:16px;padding-bottom:12px}
  .project-modal__content>p:not(.project-modal__eyebrow):not(.project-modal__status):not(.project-modal__note){font-size:.88rem;line-height:1.55}
  .project-modal__note{margin-bottom:18px;font-size:.75rem;line-height:1.5}
  .project-modal__cta{width:100%;justify-content:space-between;gap:12px;padding:14px 15px}
}
@media(prefers-reduced-motion:reduce){.project-modal,.project-modal__dialog,.project-modal__visual img{transition:none}}

/* V11 — wellness image + contact/footer scene */
.programme-photo{width:100%;margin:auto 0 0;overflow:hidden;position:relative;background:#b9c5bd}
.programme-photo img{display:block;width:100%;height:250px;object-fit:cover;object-position:center;transition:transform .7s var(--ease)}
.programme-card:hover .programme-photo img{transform:scale(1.025)}
.programme-photo figcaption{position:absolute;left:14px;bottom:12px;margin:0;padding:7px 9px;background:rgba(13,44,38,.72);color:#fff;font-size:.54rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}

.contact-scene{position:relative;isolation:isolate;overflow:hidden;background:#0d2c26;color:#fff;padding:170px 0 0}
.contact-scene__image{position:absolute;inset:0;z-index:-3;background:url('../images/footer.webp') center 52%/cover no-repeat;transform:scale(1.01)}
.contact-scene::before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,#f5f1e9 0%,rgba(245,241,233,.95) 10%,rgba(245,241,233,.55) 29%,rgba(13,44,38,.42) 58%,rgba(13,44,38,.86) 82%,#0d2c26 100%)}
.contact-scene::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(13,44,38,.14),transparent 42%,rgba(13,44,38,.14))}
.contact-panel{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:90px;padding:56px 62px 50px;background:rgba(33,62,54,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 30px 90px rgba(4,15,13,.22);border:1px solid rgba(255,255,255,.08)}
.contact-panel__intro h2{margin:18px 0 24px;color:#fff;font-family:"Manrope",sans-serif;font-size:clamp(2.4rem,4.2vw,4.7rem);font-weight:500;line-height:1.03;letter-spacing:-.045em;max-width:760px}
.contact-panel__intro>p{max-width:610px;color:rgba(255,255,255,.75);font-size:.94rem;line-height:1.75}
.contact-panel__where{margin-top:34px;padding-top:22px;border-top:1px solid rgba(255,255,255,.18)}
.contact-panel__where small,.contact-panel__details small{display:block;margin-bottom:7px;color:rgba(255,255,255,.52);font-size:.57rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.contact-panel__where strong,.contact-panel__details strong,.contact-panel__details a{color:#fff;font-size:.9rem;line-height:1.5;font-weight:600}
.contact-panel__details{display:grid;grid-template-columns:1fr 1fr;align-content:center;gap:0 28px}
.contact-panel__details>div{padding:18px 0;border-bottom:1px solid rgba(255,255,255,.18)}
.contact-panel__details>div:nth-child(n+3){grid-column:span 1}
.contact-panel__details a{display:block;text-decoration:none}
.contact-panel__cta{grid-column:1/-1;margin-top:26px;padding:18px 0 14px;border-bottom:1px solid rgba(255,255,255,.45);display:flex;justify-content:space-between;align-items:center;color:#fff!important;text-transform:uppercase;font-size:.66rem;font-weight:700;letter-spacing:.16em;transition:opacity .25s ease}
.contact-panel__cta:hover{opacity:.65}
.contact-panel__cta span{font-size:1rem;font-weight:400}
.contact-scene .site-footer{position:relative;background:transparent;color:#fff;padding:48px 0 38px}
.contact-scene .footer-grid{padding-top:26px;border-top:1px solid rgba(255,255,255,.18)}
.contact-scene .footer-brand img{filter:brightness(0) invert(1);opacity:.92}
.contact-scene .footer-grid>p{color:rgba(255,255,255,.62)}

@media(max-width:980px){
  .contact-scene{padding-top:130px}
  .contact-panel{grid-template-columns:1fr;gap:38px;padding:46px 42px}
  .contact-panel__details{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .programme-photo img{height:220px}
  .contact-scene{padding-top:96px}
  .contact-scene__image{background-position:58% center}
  .contact-scene::before{background:linear-gradient(180deg,#f5f1e9 0%,rgba(245,241,233,.90) 12%,rgba(245,241,233,.34) 35%,rgba(13,44,38,.70) 67%,#0d2c26 100%)}
  .contact-panel{gap:30px;padding:34px 24px 30px}
  .contact-panel__intro h2{font-size:clamp(2.2rem,10vw,3.2rem)}
  .contact-panel__intro>p{font-size:.9rem}
  .contact-panel__details{grid-template-columns:1fr}
  .contact-panel__details>div{grid-column:1!important}
  .contact-panel__cta{margin-top:18px}
  .contact-scene .site-footer{padding:34px 0 26px}
}

/* V12 — architecture rendus, bloc 06 plus ouvert, footer sur fond blanc */
/* Le hero conserve son image dédiée et ne dépend plus du visuel architecture 06. */
.hero-image{background-image:url('../images/00.webp')!important}

/* Section 06 : composition plus ouverte, moins centrée/étriquée. */
.future-section{background:#fff;padding:150px 0 160px}
.future-section .future-grid{
  width:min(1500px,calc(100% - 96px));
  max-width:none;
  grid-template-columns:minmax(120px,.38fr) minmax(420px,1.45fr) minmax(300px,.95fr);
  gap:clamp(56px,7vw,120px);
  align-items:start;
}
.future-number{font-family:var(--sans);font-weight:400;font-size:clamp(5.5rem,9vw,9.5rem);letter-spacing:-.07em;color:#d8ded9}
.future-copy{max-width:720px}
.future-copy h2{font-size:clamp(3.2rem,5vw,6rem);margin-bottom:0}
.future-list{margin-top:8px}

/* Les trois rendus fournis remplacent les placeholders 06 / 07 / 08. */
.architecture-stage figure{background:#dfe2de}
.architecture-stage img{width:100%;height:100%;object-fit:cover;display:block}
.arch-main img{object-position:center center}
.arch-side img{object-position:center center}

/* Contact/footer : l'image est incrustée dans un fond blanc, comme la référence. */
.contact-scene{background:#fff;color:var(--ink);padding:185px 0 0}
.contact-scene__image{inset:0 0 92px;background-position:center 52%;opacity:.96}
.contact-scene::before{
  background:linear-gradient(180deg,
    #fff 0%,
    rgba(255,255,255,.98) 7%,
    rgba(255,255,255,.72) 24%,
    rgba(255,255,255,.18) 48%,
    rgba(255,255,255,.22) 69%,
    rgba(255,255,255,.86) 88%,
    #fff 100%)
}
.contact-scene::after{background:linear-gradient(90deg,rgba(255,255,255,.16),transparent 42%,rgba(255,255,255,.12))}
.contact-scene .site-footer{background:#fff;color:var(--ink);padding:48px 0 38px}
.contact-scene .footer-grid{border-top:1px solid rgba(18,54,47,.16)}
.contact-scene .footer-brand img{filter:none;opacity:1}
.contact-scene .footer-grid>p{color:#708079}

@media(max-width:980px){
  .future-section{padding:120px 0 128px}
  .future-section .future-grid{width:var(--shell);grid-template-columns:1fr;gap:34px}
  .future-number{font-size:6rem}
  .contact-scene{padding-top:130px}
  .contact-scene__image{inset:0 0 78px}
}
@media(max-width:640px){
  .future-section{padding:92px 0 96px}
  .future-section .future-grid{width:var(--shell)}
  .future-copy h2{font-size:clamp(2.7rem,12vw,3.8rem)}
  .contact-scene{padding-top:96px}
  .contact-scene__image{inset:0 0 68px}
  .contact-scene::before{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.92) 11%,rgba(255,255,255,.28) 37%,rgba(255,255,255,.32) 67%,#fff 100%)}
}

/* V12.1 — correction de l'alternance des blocs + restauration du bas de page V11 */
/* 06 — Vision évolutive : bloc vert */
.future-section{
  background:var(--green-2);
  color:#fff;
}
.future-section .future-number{
  color:rgba(255,255,255,.18);
}
.future-section .future-copy .kicker{
  color:rgba(255,255,255,.62);
}
.future-section .future-copy h2{
  color:#fff;
}
.future-section .future-list{
  border-top-color:rgba(255,255,255,.22);
}
.future-section .future-list p{
  color:rgba(255,255,255,.84);
  border-bottom-color:rgba(255,255,255,.18);
}

/* Jardin d'art : bloc blanc */
.art-band{
  background:#fff;
  color:var(--ink);
}
.art-band .art-copy .kicker.light{
  color:var(--green);
}
.art-band .art-copy h2{
  color:var(--ink);
}
.art-band .art-copy>p:last-child{
  color:var(--muted);
}

/* Bas de page : retour au traitement V11, image fondue vers le vert foncé. */
.contact-scene{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:#0d2c26;
  color:#fff;
  padding:170px 0 0;
}
.contact-scene__image{
  position:absolute;
  inset:0;
  z-index:-3;
  background:url('../images/footer.webp') center 52%/cover no-repeat;
  transform:scale(1.01);
  opacity:1;
}
.contact-scene::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background:linear-gradient(180deg,#f5f1e9 0%,rgba(245,241,233,.95) 10%,rgba(245,241,233,.55) 29%,rgba(13,44,38,.42) 58%,rgba(13,44,38,.86) 82%,#0d2c26 100%);
}
.contact-scene::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,rgba(13,44,38,.14),transparent 42%,rgba(13,44,38,.14));
}
.contact-scene .site-footer{
  position:relative;
  background:transparent;
  color:#fff;
  padding:48px 0 38px;
}
.contact-scene .footer-grid{
  padding-top:26px;
  border-top:1px solid rgba(255,255,255,.18);
}
.contact-scene .footer-brand img{
  filter:brightness(0) invert(1);
  opacity:.92;
}
.contact-scene .footer-grid>p{
  color:rgba(255,255,255,.62);
}

@media(max-width:980px){
  .contact-scene{padding-top:130px}
}
@media(max-width:640px){
  .contact-scene{padding-top:96px}
  .contact-scene__image{inset:0;background-position:58% center}
  .contact-scene::before{background:linear-gradient(180deg,#f5f1e9 0%,rgba(245,241,233,.90) 12%,rgba(245,241,233,.34) 35%,rgba(13,44,38,.70) 67%,#0d2c26 100%)}
  .contact-scene .site-footer{padding:34px 0 26px}
}


/* V13 — territoire hivernal + fondu blanc du footer */
/* Le visuel de Saint-Remy remplace le placeholder 05 dans la section Territoire. */
.location-visual--winter{
  overflow:hidden;
  background:#fff;
}
.location-visual--winter img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 54%;
}
.location-visual--winter .location-fade{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.90) 7%,rgba(255,255,255,.48) 18%,rgba(255,255,255,.12) 31%,transparent 46%);
}
.location-visual--winter figcaption{
  z-index:2;
}

/* Le haut de la scène contact se fond maintenant dans du blanc pur et non dans du beige. */
.contact-scene::before{
  background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.96) 10%,rgba(255,255,255,.56) 29%,rgba(13,44,38,.42) 58%,rgba(13,44,38,.86) 82%,#0d2c26 100%);
}

@media(max-width:640px){
  .location-visual--winter .location-fade{
    background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.92) 8%,rgba(255,255,255,.46) 20%,rgba(255,255,255,.10) 34%,transparent 48%);
  }
  .contact-scene::before{
    background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.92) 12%,rgba(255,255,255,.34) 35%,rgba(13,44,38,.70) 67%,#0d2c26 100%);
  }
}


/* V15 — intégration des 2 visuels extraits du PDF dans la section Jardin d’art */
.art-visual{overflow:visible;background:#fff;display:block}
.art-visual__main{display:block;width:100%;height:100%;object-fit:cover;object-position:center center;box-shadow:0 18px 60px rgba(18,54,47,.08)}
.art-visual__inset-wrap{position:absolute;right:-18px;bottom:-34px;width:min(44%, 250px);background:#fff;padding:10px;box-shadow:0 18px 60px rgba(18,54,47,.14)}
.art-visual__inset{display:block;width:100%;height:auto;aspect-ratio:758 / 377;object-fit:cover}
.art-visual figcaption{position:absolute;left:14px;bottom:12px;z-index:3;margin:0;padding:7px 9px;background:rgba(13,44,38,.76);color:#fff;font-size:.54rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}

@media(max-width:980px){
  .art-visual{height:520px}
  .art-visual__inset-wrap{right:16px;bottom:16px;width:min(40%, 220px)}
}
@media(max-width:640px){
  .art-visual{height:auto;min-height:0;display:grid;gap:14px;overflow:hidden}
  .art-visual__main{height:auto;aspect-ratio:1242 / 551}
  .art-visual__inset-wrap{position:relative;right:auto;bottom:auto;width:68%;margin:0 0 0 auto;padding:8px}
  .art-visual figcaption{left:10px;bottom:auto;top:10px}
}


/* V16 — esquisse architecturale + nouvelle image Nature & expériences */
.intro-sketch{
  background:#fff;
  overflow:hidden;
}
.intro-sketch img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 54%;
  filter:none;
}
.intro-sketch::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,0) 70%);
}
.programme-card .programme-photo img[src$="12.webp"]{
  object-position:center 58%;
  filter:saturate(.94) contrast(.98);
}

@media(max-width:640px){
  .intro-sketch{height:360px}
  .intro-sketch img{object-position:center 58%}
  .programme-card .programme-photo img[src$="12.webp"]{object-position:center center}
}


/* V17 — remplacement du dessin par la prairie + fondu beige en haut */
.intro-meadow{
  background:#f5f1e9;
  overflow:hidden;
}
.intro-meadow img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 56%;
  filter:saturate(.96) contrast(.98);
}
.intro-meadow::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,
      rgba(245,241,233,1) 0%,
      rgba(245,241,233,.94) 7%,
      rgba(245,241,233,.72) 14%,
      rgba(245,241,233,.26) 24%,
      rgba(245,241,233,0) 36%);
  z-index:1;
}
.intro-meadow::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0) 72%);
  z-index:1;
}
.intro-meadow figcaption{
  z-index:2;
}

@media(max-width:640px){
  .intro-meadow{
    height:360px;
  }
  .intro-meadow img{
    object-position:center 58%;
  }
  .intro-meadow::before{
    background:
      linear-gradient(180deg,
        rgba(245,241,233,1) 0%,
        rgba(245,241,233,.96) 9%,
        rgba(245,241,233,.74) 18%,
        rgba(245,241,233,.28) 30%,
        rgba(245,241,233,0) 42%);
  }
}


/* V17.1 — typographie popup plus uniforme + bandeau d'informations renforcé */

/* POPUP
   Une hiérarchie plus courte : label / titre / texte.
   Les sous-informations utilisent désormais des tailles très proches. */
.project-modal__content{
  padding:42px 46px 40px;
}
.project-modal__eyebrow,
.project-modal__status,
.project-modal__cta{
  font-family:"Manrope",sans-serif;
}
.project-modal__eyebrow{
  margin:0 0 12px;
  font-size:.72rem;
  line-height:1.4;
  font-weight:700;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.project-modal__content h2{
  margin:0 0 20px;
  font-family:"Manrope",sans-serif;
  font-weight:500;
  font-size:clamp(2.15rem,3vw,2.75rem);
  line-height:1.04;
  letter-spacing:-.04em;
}
.project-modal__content h2 span{
  font:inherit;
  color:inherit;
}
.project-modal__status{
  margin:0 0 20px;
  padding:0 0 16px;
  border-bottom:1px solid rgba(18,54,47,.16);
  font-size:.76rem;
  line-height:1.45;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.project-modal__content>p:not(.project-modal__eyebrow):not(.project-modal__status):not(.project-modal__note){
  margin:0 0 14px;
  font-size:.92rem;
  line-height:1.62;
}
.project-modal__note{
  margin:0 0 22px;
  font-size:.84rem;
  line-height:1.58;
}
.project-modal__cta{
  font-size:.72rem;
  line-height:1.35;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

/* BANDEAU INFORMATIONS CLÉS
   Les 4 données deviennent de vrais points de lecture, sans effet "carte". */
.facts-strip{
  background:#fff;
  border-top:1px solid rgba(18,54,47,.10);
  border-bottom:1px solid rgba(18,54,47,.14);
}
.facts-grid>div{
  padding:32px 34px 32px 0;
  min-height:142px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.facts-grid>div+div{
  padding-left:34px;
}
.facts-grid span{
  right:20px;
  top:22px;
  font-size:.62rem;
  font-weight:600;
  color:#a2aaa7;
}
.facts-grid small{
  margin-bottom:10px;
  font-size:.60rem;
  line-height:1.3;
  font-weight:600;
  letter-spacing:.13em;
}
.facts-grid strong{
  max-width:95%;
  padding-right:18px;
  font-size:1.02rem;
  line-height:1.42;
  font-weight:700;
  letter-spacing:-.018em;
}
.facts-grid>div::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-1px;
  width:42px;
  height:2px;
  background:var(--green);
  opacity:.42;
}
.facts-grid>div+div::after{
  left:34px;
}

/* Tablette */
@media(max-width:980px){
  .facts-grid>div{
    min-height:128px;
    padding-top:26px;
    padding-bottom:26px;
  }
  .facts-grid strong{
    font-size:.98rem;
  }
  .project-modal__content{
    padding:30px 30px 28px;
  }
  .project-modal__content h2{
    font-size:clamp(2rem,6vw,2.45rem);
  }
}

/* Mobile */
@media(max-width:640px){
  .facts-grid>div,
  .facts-grid>div+div{
    min-height:auto;
    padding:20px 0;
  }
  .facts-grid span{
    right:0;
    top:20px;
  }
  .facts-grid small{
    margin-bottom:7px;
    font-size:.58rem;
  }
  .facts-grid strong{
    max-width:88%;
    padding-right:0;
    font-size:.97rem;
    line-height:1.38;
  }
  .facts-grid>div::after,
  .facts-grid>div+div::after{
    left:0;
    width:34px;
  }

  .project-modal__content{
    padding:23px 20px 22px;
  }
  .project-modal__eyebrow{
    margin-bottom:9px;
    font-size:.66rem;
  }
  .project-modal__content h2{
    margin-bottom:15px;
    font-size:clamp(1.9rem,8.5vw,2.2rem);
  }
  .project-modal__status{
    margin-bottom:15px;
    padding-bottom:12px;
    font-size:.68rem;
  }
  .project-modal__content>p:not(.project-modal__eyebrow):not(.project-modal__status):not(.project-modal__note){
    font-size:.88rem;
    line-height:1.55;
  }
  .project-modal__note{
    margin-bottom:17px;
    font-size:.80rem;
    line-height:1.52;
  }
  .project-modal__cta{
    font-size:.68rem;
  }
}


/* V18 — loader premium 3 secondes */
body.is-loading{
  overflow:hidden;
}
.site-loader{
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  place-items:center;
  background:#0d2c26;
  color:#fff;
  opacity:1;
  visibility:visible;
  transition:opacity .72s cubic-bezier(.22,.61,.36,1),visibility .72s;
}
.site-loader.is-leaving{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.site-loader__inner{
  width:min(440px,72vw);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.site-loader__logo{
  display:block;
  width:min(270px,58vw);
  height:auto;
  opacity:0;
  transform:translateY(10px) scale(.985);
  animation:loaderLogoIn .9s .14s cubic-bezier(.22,.61,.36,1) forwards;
}
.site-loader__line{
  width:min(230px,54vw);
  height:1px;
  margin:34px 0 18px;
  overflow:hidden;
  background:rgba(255,255,255,.14);
}
.site-loader__line span{
  display:block;
  width:100%;
  height:100%;
  background:#c9a06c;
  transform:translateX(-100%);
  animation:loaderProgress 2.55s .18s cubic-bezier(.45,0,.2,1) forwards;
}
.site-loader p{
  margin:0;
  font-family:"Manrope",sans-serif;
  font-size:.62rem;
  line-height:1.4;
  font-weight:600;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:rgba(255,255,255,.70);
  opacity:0;
  animation:loaderTextIn .65s .48s ease forwards;
}
@keyframes loaderLogoIn{
  to{opacity:1;transform:none}
}
@keyframes loaderProgress{
  to{transform:translateX(0)}
}
@keyframes loaderTextIn{
  to{opacity:1}
}

/* V18 — les deux paragraphes informatifs du popup ont exactement
   la même taille, couleur et interlignage. */
.project-modal__content>p:not(.project-modal__eyebrow):not(.project-modal__status){
  font-family:"Manrope",sans-serif;
  font-size:.88rem;
  line-height:1.58;
  font-weight:400;
  color:#394943;
}
.project-modal__content>p:not(.project-modal__eyebrow):not(.project-modal__status):not(.project-modal__note){
  margin:0 0 12px;
  font-size:.88rem;
  line-height:1.58;
  color:#394943;
}
.project-modal__note{
  margin:0 0 22px;
  font-size:.88rem;
  line-height:1.58;
  color:#394943;
}
.project-modal__content strong{
  font-weight:700;
  color:inherit;
}

@media(max-width:640px){
  .site-loader__inner{width:82vw}
  .site-loader__logo{width:min(235px,64vw)}
  .site-loader__line{margin-top:28px}
  .project-modal__content>p:not(.project-modal__eyebrow):not(.project-modal__status),
  .project-modal__content>p:not(.project-modal__eyebrow):not(.project-modal__status):not(.project-modal__note),
  .project-modal__note{
    font-size:.84rem;
    line-height:1.55;
  }
}


/* V19 — concept harmonisé, hero en léger dézoom, pictogrammes SVG */
.concept-left h2,
.concept-left h2 span{
  font-family:var(--sans);
  font-weight:500;
  font-size:clamp(3.4rem,5.8vw,6.4rem);
  line-height:.98;
  letter-spacing:-.052em;
}
.concept-left h2 span{color:inherit}

.hero-image.hero-photo{
  transform-origin:center center;
  animation:heroPremiumDezoom 10s cubic-bezier(.16,.72,.28,1) forwards;
  will-change:transform;
}
@keyframes heroPremiumDezoom{
  0%{transform:scale(1.065)}
  100%{transform:scale(1.015)}
}
@media(prefers-reduced-motion:reduce){
  .hero-image.hero-photo{animation:none;transform:scale(1.015)}
}

.future-list{margin-top:8px;border-top:1px solid rgba(255,255,255,.22)}
.future-item{
  display:grid;
  grid-template-columns:32px minmax(0,1fr);
  gap:14px;
  align-items:center;
  min-height:52px;
  border-bottom:1px solid rgba(255,255,255,.18);
}
.future-item p{
  margin:0!important;padding:0!important;border:0!important;
  font-size:.86rem!important;line-height:1.35;color:rgba(255,255,255,.86)!important;
}
.future-icon{
  width:26px;height:26px;display:grid;place-items:center;color:#c9a06c;
  transition:transform .28s ease;
}
.future-icon svg{
  width:21px;height:21px;display:block;fill:none;stroke:currentColor;
  stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round;
}
.future-item:hover .future-icon{transform:translateX(2px)}

/* V20 — timeline : double cercle plus visible */
.timeline-item>span{
  position:relative;
  width:18px;
  height:18px;
  border-radius:50%;
  background:transparent;
  box-shadow:none;
}
.timeline-item>span::after{
  content:"";
  position:absolute;
  inset:5px;
  border-radius:50%;
}
.timeline-item.complete>span{
  background:rgba(101,164,132,.22);
  box-shadow:none;
}
.timeline-item.complete>span::after{
  background:#4f806a;
}
.timeline-item.active>span{
  background:rgba(211,150,64,.22);
  box-shadow:none;
  animation:timelinePulse 1.9s ease-out infinite;
}
.timeline-item.active>span::after{
  background:#d38d2e;
}
@keyframes timelinePulse{
  0%{box-shadow:0 0 0 0 rgba(211,141,46,.35)}
  55%{box-shadow:0 0 0 9px rgba(211,141,46,0)}
  100%{box-shadow:0 0 0 0 rgba(211,141,46,0)}
}
@media(prefers-reduced-motion:reduce){
  .timeline-item.active>span{animation:none}
}

/* Footer legal link */
.footer-meta a{
  color:inherit;
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.28);
  padding-bottom:2px;
  transition:border-color .2s ease,color .2s ease;
}
.footer-meta a:hover{
  color:#fff;
  border-color:#c9a06c;
}

/* Legal page */
.legal-page{
  min-height:100vh;
  background:#f5f1e9;
  color:var(--ink);
}
.legal-header{
  position:relative;
  height:auto;
  min-height:92px;
  background:#0d2c26;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.legal-header .brand-logo{filter:none}
.legal-main{
  padding:150px 0 110px;
}
.legal-hero{
  display:grid;
  grid-template-columns:.72fr 1.5fr;
  gap:70px;
  align-items:start;
  margin-bottom:80px;
}
.legal-kicker{
  margin:0;
  font-size:.66rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--green);
}
.legal-hero h1{
  margin:0;
  font-size:clamp(3.2rem,6vw,6.4rem);
  line-height:.94;
  letter-spacing:-.055em;
}
.legal-content{
  display:grid;
  grid-template-columns:.72fr 1.5fr;
  gap:70px;
}
.legal-nav{
  position:sticky;
  top:120px;
  align-self:start;
  border-top:1px solid var(--line);
}
.legal-nav a{
  display:block;
  padding:13px 0;
  border-bottom:1px solid var(--line);
  color:var(--muted);
  font-size:.72rem;
}
.legal-article section{
  padding:0 0 42px;
  margin:0 0 42px;
  border-bottom:1px solid var(--line);
}
.legal-article h2{
  font-size:clamp(1.6rem,2.4vw,2.5rem);
  margin-bottom:16px;
}
.legal-article p,
.legal-article li{
  color:#5f6b66;
  line-height:1.75;
  font-size:.96rem;
}
.legal-article ul{padding-left:18px}
.legal-article a{
  color:var(--green);
  text-decoration:underline;
  text-underline-offset:3px;
}
.legal-back{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:10px;
  font-size:.7rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
}

@media(max-width:980px){
  .legal-hero,.legal-content{grid-template-columns:1fr;gap:30px}
  .legal-nav{position:relative;top:auto}
}
@media(max-width:640px){
  .concept-left h2,.concept-left h2 span{font-size:3.6rem;line-height:1}
  .future-item{grid-template-columns:30px 1fr;gap:12px;min-height:50px}
  .future-icon svg{width:20px;height:20px}
  .timeline-item{grid-template-columns:24px 72px 1fr}
  .legal-main{padding:115px 0 80px}
}


/* V21 — liens utiles, footer, favicon et compléments du dossier client */
.address-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:inherit;
  text-decoration:none;
}
.address-link span{
  font-size:.72em;
  opacity:.6;
  transition:transform .2s ease,opacity .2s ease;
}
.address-link:hover span{
  opacity:1;
  transform:translate(2px,-2px);
}

/* Logo footer spécifique : aucun fond carré. */
.contact-scene .footer-brand img,
.site-footer .footer-brand img{
  background:transparent!important;
  padding:0!important;
}

/* Service / exploitation — contenu du PDF client, traité de manière légère */
.service-section{
  background:#f5f1e9;
  padding:105px 0 115px;
  border-top:1px solid rgba(18,54,47,.10);
  border-bottom:1px solid rgba(18,54,47,.10);
}
.service-heading{
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:50px;
  align-items:start;
  margin-bottom:55px;
}
.service-heading h2{
  margin:0;
  max-width:820px;
  font-size:clamp(2.6rem,4.3vw,5rem);
}
.service-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  border-top:1px solid var(--line);
}
.service-item{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:18px;
  padding:25px 24px 25px 0;
  border-bottom:1px solid var(--line);
}
.service-item:nth-child(odd){
  border-right:1px solid var(--line);
  padding-right:42px;
}
.service-item:nth-child(even){
  padding-left:42px;
}
.service-item>span{
  font-size:.62rem;
  color:#9ba7a2;
  padding-top:4px;
}
.service-item strong{
  display:block;
  color:var(--ink);
  font-size:.88rem;
  margin-bottom:6px;
}
.service-item p{
  margin:0;
  color:var(--muted);
  font-size:.82rem;
  line-height:1.55;
}

@media(max-width:980px){
  .service-heading{grid-template-columns:1fr;gap:10px}
}
@media(max-width:640px){
  .service-section{padding:80px 0}
  .service-grid{grid-template-columns:1fr}
  .service-item,
  .service-item:nth-child(odd),
  .service-item:nth-child(even){
    border-right:0;
    padding:20px 0;
  }
}


/* V21.1 — échange 00/01 + mouvement hero légèrement renforcé */
.hero-image.hero-photo{
  background-position:center 58%!important;
  animation:heroPremiumDezoomV211 12s cubic-bezier(.16,.72,.28,1) forwards!important;
}
@keyframes heroPremiumDezoomV211{
  0%{transform:scale(1.085)}
  100%{transform:scale(1.018)}
}
@media(max-width:640px){
  .hero-image.hero-photo{
    background-position:62% center!important;
  }
}
@media(prefers-reduced-motion:reduce){
  .hero-image.hero-photo{
    animation:none!important;
    transform:scale(1.018);
  }
}


/* =========================================================
   V22 — nettoyage des micro-numéros, labels images, mobile
   hero et animation du mot "destination".
   ========================================================= */

/* Footer : wordmark blanc propre, sans carré ni filtre destructif. */
.contact-scene .footer-brand img,
.site-footer .footer-brand img{
  width:min(360px,72vw);
  height:auto;
  display:block;
  filter:none!important;
  opacity:1!important;
  background:transparent!important;
  padding:0!important;
}

/* Titre dynamique de la section 01 */
.rotating-word{
  display:inline-block;
  min-width:5.9em;
  color:inherit;
  transition:opacity .22s ease,transform .22s ease;
  transform-origin:left center;
}
.rotating-word.is-changing{
  opacity:0;
  transform:translateY(8px);
}

/* Plus de petites numérotations dans le bandeau infos */
.facts-grid>div{
  padding-top:31px;
}
.facts-grid small{
  margin-bottom:9px;
}
.facts-grid strong{
  padding-right:0;
}
.facts-grid span{
  display:none!important;
}

/* Programme : suppression visuelle des index */
.card-index{
  display:none!important;
}
.programme-card{
  grid-template-rows:auto 1fr;
  gap:20px;
}

/* Les légendes/bandes superposées aux images sont supprimées */
figure figcaption,
.programme-photo figcaption,
.location-visual figcaption,
.architecture-stage figcaption,
.progress-visual figcaption,
.art-visual figcaption{
  display:none!important;
}

/* Le hover des images reste léger mais plus propre */
.programme-photo{
  margin-top:auto;
}
.programme-photo img{
  display:block;
}

/* Mobile : le hero tient réellement dans le viewport et cadre davantage
   le bâtiment plutôt que le grand ciel. */
@media(max-width:640px){
  .hero{
    min-height:100svh!important;
    height:100svh;
    max-height:100svh;
  }

  .hero-image.hero-photo{
    background-position:68% 58%!important;
    animation:heroMobileDezoomV22 11s cubic-bezier(.16,.72,.28,1) forwards!important;
  }

  @keyframes heroMobileDezoomV22{
    0%{transform:scale(1.20)}
    100%{transform:scale(1.08)}
  }

  .hero-topline{
    margin-top:88px;
    font-size:.53rem;
  }

  .hero-content{
    padding-bottom:18px;
    justify-content:flex-end;
  }

  .hero-label{
    margin-bottom:10px;
    padding:7px 9px;
    font-size:.56rem;
  }

  .hero-main{
    gap:12px;
    padding-top:14px;
  }

  .hero-wordmark{
    max-width:86%;
  }

  .hero-side{
    max-width:none;
    padding:14px 15px 12px;
    background:rgba(7,24,21,.48);
  }

  .hero-side p{
    margin:0 0 12px;
    font-size:.82rem;
    line-height:1.42;
  }

  .outline-link{
    padding:11px 12px;
    font-size:.56rem;
  }

  /* Le bandeau d'infos reste juste après le viewport hero. */
  .facts-grid>div,
  .facts-grid>div+div{
    padding:18px 0;
  }

  .rotating-word{
    min-width:0;
  }
}

@media(prefers-reduced-motion:reduce){
  .rotating-word{
    transition:none;
  }
}


/* =========================================================
   V23 — ajustements mobile hero + mot rotatif
   ========================================================= */

/* Mot rotatif : italique et ponctuation collée naturellement au mot */
.intro-title h2{
  text-wrap:balance;
}
.rotating-word{
  min-width:0!important;
  display:inline!important;
  font-style:italic;
  font-family:"Cormorant Garamond",serif;
  font-weight:500;
  white-space:nowrap;
  transition:opacity .22s ease,transform .22s ease;
}
.rotating-word.is-changing{
  opacity:0;
  transform:translateY(6px);
}

/* MOBILE UNIQUEMENT : remonter le bloc de contenu du hero */
@media(max-width:640px){
  .hero-content{
    padding-bottom:96px!important;
  }

  .hero-main{
    gap:10px!important;
  }

  .hero-side{
    transform:translateY(-28px);
  }

  .hero-label{
    transform:translateY(-28px);
  }

  /* On garde le mot animé compact afin que le point reste juste après. */
  .rotating-word{
    white-space:normal;
  }
}


/* =========================================================
   V24 — mobile Chrome: arrows, project images, intro typography
   ========================================================= */

/* 1. Flèches vectorielles CSS : aucune dépendance aux glyphes/emoji du navigateur */
.ui-arrow-link{
  display:inline-flex;
  align-items:center;
  gap:.55em;
}
.ui-arrow{
  position:relative;
  display:inline-block;
  flex:0 0 auto;
  width:13px;
  height:13px;
  color:currentColor;
}
.ui-arrow::before,
.ui-arrow::after{
  content:"";
  position:absolute;
  box-sizing:border-box;
}
.ui-arrow--external::before{
  width:8px;
  height:8px;
  border-top:1.5px solid currentColor;
  border-right:1.5px solid currentColor;
  top:0;
  right:0;
}
.ui-arrow--external::after{
  width:10px;
  height:1.5px;
  background:currentColor;
  transform:rotate(-45deg);
  transform-origin:right center;
  top:6px;
  right:1px;
}
.ui-arrow--right::before{
  width:11px;
  height:1.5px;
  background:currentColor;
  top:6px;
  left:0;
}
.ui-arrow--right::after{
  width:6px;
  height:6px;
  border-top:1.5px solid currentColor;
  border-right:1.5px solid currentColor;
  transform:rotate(45deg);
  top:3.7px;
  right:0;
}

/* 2. Images projet : composition plus stable */
.architecture-stage figure,
.art-visual,
.progress-visual,
.intro-meadow,
.location-visual{
  overflow:hidden;
}
.architecture-stage img,
.art-visual img,
.progress-visual img,
.intro-meadow img,
.location-visual img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

/* 3. Bloc intro : hiérarchie plus simple */
.intro-copy--uniform p{
  font-size:1rem;
  line-height:1.72;
  color:var(--muted);
}
.intro-copy--uniform p:first-child{
  color:var(--ink);
  font-weight:500;
}

@media(max-width:640px){

  /* Flèches: un peu plus grandes et nettes sur Chrome mobile */
  .ui-arrow{
    width:14px;
    height:14px;
  }
  .address-link{
    align-items:flex-start;
  }

  /* Images Architecture / projet : plus de débordement ou de cadrage étrange */
  .architecture-stage{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
  }
  .arch-main,
  .arch-side{
    grid-column:auto!important;
    grid-row:auto!important;
    min-height:0!important;
    height:auto!important;
    aspect-ratio:4 / 3;
  }
  .architecture-stage img{
    object-fit:cover!important;
    object-position:center center!important;
  }

  /* Jardin d'art : les 2 images deviennent un vrai flux vertical,
     sans inset flottant ni espace blanc artificiel. */
  .art-visual{
    height:auto!important;
    min-height:0!important;
    display:block!important;
    overflow:visible!important;
  }
  .art-visual__main{
    width:100%!important;
    height:auto!important;
    aspect-ratio:1242 / 551;
    object-fit:cover!important;
    margin:0!important;
  }
  .art-visual__inset-wrap{
    position:relative!important;
    right:auto!important;
    bottom:auto!important;
    width:78%!important;
    margin:12px 0 0 auto!important;
    padding:7px!important;
    background:#fff;
    box-shadow:none!important;
  }
  .art-visual__inset{
    width:100%!important;
    height:auto!important;
    aspect-ratio:758 / 377;
    object-fit:cover!important;
  }

  /* Avancement : image proportionnelle sur mobile */
  .progress-visual{
    height:auto!important;
    aspect-ratio:4 / 3;
    margin-top:38px!important;
  }
  .progress-visual img{
    object-fit:cover!important;
    object-position:center center!important;
  }

  /* Paysage / intro : meilleur rendu responsive */
  .intro-meadow{
    height:auto!important;
    aspect-ratio:4 / 3;
  }
  .location-visual{
    height:auto!important;
    aspect-ratio:4 / 3;
  }

  /* Bloc "Un projet immobilier pensé comme..." :
     les deux paragraphes ont exactement la même taille et le même rythme. */
  .intro-copy--uniform{
    padding-top:0!important;
  }
  .intro-copy--uniform p,
  .intro-copy--uniform p:first-child{
    font-size:1rem!important;
    line-height:1.68!important;
    font-weight:400!important;
    color:#596660!important;
    margin:0!important;
  }
  .intro-copy--uniform p + p{
    margin-top:22px!important;
  }

  /* Le titre reste le seul vrai niveau typographique du bloc */
  .intro-title h2{
    margin-bottom:28px!important;
  }
}


/* =========================================================
   V25 — vraies flèches SVG + art & paysage corrigé sur mobile
   ========================================================= */

/* Les flèches sont de vrais SVG : aucun risque d'emoji sur Chrome/iOS. */
.ui-arrow{
  display:none!important;
}
.link-arrow{
  flex:0 0 auto;
  width:15px;
  height:15px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.55;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .22s ease,opacity .22s ease;
}
.ui-arrow-link:hover .link-arrow--external{
  transform:translate(2px,-2px);
}
.ui-arrow-link:hover .link-arrow--right{
  transform:translateX(3px);
}

/* Contact CTA : garde bien la flèche à droite sur toute la largeur */
.contact-panel__cta.ui-arrow-link{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:20px;
}
.contact-panel__cta .link-arrow{
  width:18px;
  height:18px;
}

/* Art & paysage — desktop garde la composition éditoriale */
.art-visual__inset-wrap{
  overflow:hidden;
}
.art-visual__inset{
  display:block;
}

/* Mobile : plus aucun décalage.
   Les 2 images ont exactement la même largeur et s'empilent proprement. */
@media(max-width:640px){

  .link-arrow{
    width:16px;
    height:16px;
    stroke-width:1.45;
  }

  .art-visual{
    display:flex!important;
    flex-direction:column!important;
    gap:12px!important;
    width:100%!important;
    height:auto!important;
    overflow:hidden!important;
  }

  .art-visual__main{
    position:relative!important;
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    aspect-ratio:1242 / 551!important;
    object-fit:cover!important;
    margin:0!important;
    padding:0!important;
  }

  .art-visual__inset-wrap{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  .art-visual__inset{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    aspect-ratio:758 / 377!important;
    object-fit:cover!important;
    margin:0!important;
    padding:0!important;
  }

  /* évite tout dépassement hérité d'anciennes règles */
  .art-grid{
    overflow:hidden;
  }
}


/* =========================================================
   V25.1 — correction définitive des flèches
   Aucun caractère Unicode, aucun emoji, aucun SVG inline.
   Les flèches sont dessinées en CSS comme dans la version appréciée.
   ========================================================= */

.link-arrow{
  display:none!important;
}

/* lien + flèche */
.ui-arrow-link{
  display:inline-flex!important;
  align-items:center!important;
  gap:.58em;
}

/* base */
.ui-arrow{
  display:inline-block!important;
  position:relative;
  flex:0 0 auto;
  width:14px;
  height:14px;
  color:currentColor;
  background:none!important;
}

/* flèche diagonale ↗ */
.ui-arrow--external::before{
  content:"";
  position:absolute;
  width:8px;
  height:8px;
  right:1px;
  top:1px;
  border-top:1.35px solid currentColor;
  border-right:1.35px solid currentColor;
  box-sizing:border-box;
}
.ui-arrow--external::after{
  content:"";
  position:absolute;
  width:11px;
  height:1.35px;
  right:1px;
  top:7px;
  background:currentColor;
  transform:rotate(-45deg);
  transform-origin:right center;
}

/* flèche horizontale → */
.ui-arrow--right::before{
  content:"";
  position:absolute;
  left:0;
  top:6.3px;
  width:12px;
  height:1.35px;
  background:currentColor;
}
.ui-arrow--right::after{
  content:"";
  position:absolute;
  right:0;
  top:3.3px;
  width:6px;
  height:6px;
  border-top:1.35px solid currentColor;
  border-right:1.35px solid currentColor;
  transform:rotate(45deg);
  box-sizing:border-box;
}

/* placement dans le panneau contact */
.contact-panel__details a.ui-arrow-link,
.contact-panel__where a.ui-arrow-link{
  display:inline-flex!important;
}

.contact-panel__cta.ui-arrow-link{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  width:100%;
}

.contact-panel__cta .ui-arrow{
  width:16px;
  height:16px;
}

/* mouvement léger desktop */
@media(hover:hover){
  .ui-arrow-link:hover .ui-arrow--external{
    transform:translate(2px,-2px);
  }
  .ui-arrow-link:hover .ui-arrow--right{
    transform:translateX(3px);
  }
}
.ui-arrow{
  transition:transform .2s ease;
}

/* mobile */
@media(max-width:640px){
  .ui-arrow{
    width:15px;
    height:15px;
  }

  .address-link.ui-arrow-link{
    align-items:flex-start!important;
  }

  .contact-panel__cta .ui-arrow{
    width:17px;
    height:17px;
  }
}


/* =========================================================
   V26 — système de flèches global, sans emoji et sans pseudo-formes.
   Les icônes utilisent un masque SVG monochrome, rendu par le navigateur.
   ========================================================= */

/* Neutralise toutes les anciennes implémentations de flèches */
.ui-arrow,
.link-arrow{
  display:none!important;
}
.ui-arrow::before,
.ui-arrow::after{
  content:none!important;
}

/* Tous les liens à flèche suivent la même logique d'alignement */
.arrow-link{
  display:inline-flex!important;
  align-items:center!important;
  gap:.55em;
}
.contact-panel__cta.arrow-link{
  display:flex!important;
  width:100%;
  justify-content:space-between!important;
  align-items:center!important;
}

/* Base */
.icon-arrow{
  display:inline-block!important;
  flex:0 0 auto!important;
  width:14px!important;
  height:14px!important;
  background-color:currentColor!important;
  background-image:none!important;
  vertical-align:middle;
  transition:transform .22s ease,opacity .22s ease;
  opacity:.9;
}

/* ↗ */
.icon-arrow--ne{
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 17L17 7M9 7h8v8' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 17L17 7M9 7h8v8' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* ↘ */
.icon-arrow--se{
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7l10 10M9 17h8V9' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7l10 10M9 17h8V9' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* → */
.icon-arrow--right{
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M14 7l5 5-5 5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M14 7l5 5-5 5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* ← */
.icon-arrow--left{
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 12H5M10 7l-5 5 5 5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 12H5M10 7l-5 5 5 5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Taille adaptée selon le contexte */
.header-cta .icon-arrow{width:13px!important;height:13px!important}
.outline-link .icon-arrow{width:14px!important;height:14px!important}
.project-modal__cta .icon-arrow{width:15px!important;height:15px!important}
.contact-panel__cta .icon-arrow{width:17px!important;height:17px!important}
.legal-back .icon-arrow{width:13px!important;height:13px!important}

/* Mouvement subtil sur desktop seulement */
@media(hover:hover){
  .arrow-link:hover .icon-arrow--ne{transform:translate(2px,-2px)}
  .arrow-link:hover .icon-arrow--se{transform:translate(2px,2px)}
  .arrow-link:hover .icon-arrow--right{transform:translateX(3px)}
  .arrow-link:hover .icon-arrow--left{transform:translateX(-3px)}
}

@media(max-width:640px){
  .icon-arrow{
    width:15px!important;
    height:15px!important;
  }
  .address-link.arrow-link{
    align-items:flex-start!important;
  }
  .header-cta .icon-arrow{
    width:14px!important;
    height:14px!important;
  }
}


/* =========================================================
   V27 — flèches inline SVG fiables + titre rotatif sans reflow
   ========================================================= */

/* Neutralise l'ancien système masque */
.icon-arrow{
  display:none!important;
}

/* Flèches inline SVG : stroke explicitement forcé, aucun fill possible */
.arrow-svg{
  display:inline-block!important;
  flex:0 0 auto!important;
  width:14px;
  height:14px;
  overflow:visible;
  vertical-align:middle;
  color:inherit;
  fill:none!important;
  stroke:currentColor!important;
  transition:transform .22s ease,opacity .22s ease;
}
.arrow-svg path{
  fill:none!important;
  stroke:currentColor!important;
  vector-effect:non-scaling-stroke;
}

/* Tailles contextuelles */
.header-cta .arrow-svg{width:13px;height:13px}
.outline-link .arrow-svg{width:14px;height:14px}
.project-modal__cta .arrow-svg{width:15px;height:15px}
.contact-panel__cta .arrow-svg{width:17px;height:17px}
.legal-back .arrow-svg{width:13px;height:13px}

/* Positionnement cohérent des liens */
.arrow-link{
  display:inline-flex!important;
  align-items:center!important;
  gap:.55em;
}
.contact-panel__cta.arrow-link{
  display:flex!important;
  width:100%;
  justify-content:space-between!important;
  align-items:center!important;
}

/* Micro-mouvement desktop */
@media(hover:hover){
  .arrow-link:hover .arrow-svg--ne{transform:translate(2px,-2px)}
  .arrow-link:hover .arrow-svg--se{transform:translate(2px,2px)}
  .arrow-link:hover .arrow-svg--right{transform:translateX(3px)}
  .arrow-link:hover .arrow-svg--left{transform:translateX(-3px)}
}

/* Mot rotatif : le slot garde une largeur fixe.
   Le texte visible change sans faire bouger les retours à la ligne. */
.rotating-slot{
  display:inline-block;
  position:relative;
  width:5.95em;
  height:.96em;
  vertical-align:-.04em;
}
.rotating-slot .rotating-word{
  position:absolute;
  left:0;
  bottom:0;
  display:inline-block!important;
  width:auto!important;
  min-width:0!important;
  white-space:nowrap!important;
  font-style:italic;
  font-family:"Cormorant Garamond",serif;
  font-weight:500;
  line-height:.96;
  color:#a7aea9;
  transition:opacity .22s ease,transform .22s ease;
}
.rotating-slot .rotating-word.is-changing{
  opacity:0;
  transform:translateY(6px);
}

@media(max-width:640px){
  .arrow-svg{
    width:15px;
    height:15px;
  }
  .header-cta .arrow-svg{
    width:14px;
    height:14px;
  }
  .address-link.arrow-link{
    align-items:flex-start!important;
  }

  /* largeur fixe plus compacte mais suffisante pour "destination." */
  .rotating-slot{
    width:5.65em;
  }
}


/* =========================================================
   V28 — correction définitive :
   1) flèches externes SVG en <img> avec dimensions natives
   2) ligne rotative figée, aucun reflow
   ========================================================= */

/* Neutralise les anciennes flèches */
.arrow-svg,
.icon-arrow,
.ui-arrow,
.link-arrow{
  display:none!important;
}

/* Flèches externes : dimensions forcées pour empêcher tout agrandissement */
.arrow-img{
  display:inline-block!important;
  flex:0 0 16px!important;
  width:16px!important;
  height:16px!important;
  min-width:16px!important;
  min-height:16px!important;
  max-width:16px!important;
  max-height:16px!important;
  object-fit:contain!important;
  vertical-align:middle!important;
  filter:none!important;
  transform:none;
  transition:transform .2s ease,opacity .2s ease;
}

/* Les SVG externes utilisent currentColor; pour les <img>, on garde le trait sombre/blanc
   grâce au fichier source et à la couleur du contexte. */
.header-cta .arrow-img,
.outline-link .arrow-img,
.project-modal__cta .arrow-img,
.contact-panel__cta .arrow-img,
.address-link .arrow-img,
.legal-back .arrow-img{
  width:16px!important;
  height:16px!important;
}

/* CTA contact : flèche petite et propre à droite */
.contact-panel__cta.arrow-link{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  width:100%;
}

/* Micro mouvement desktop */
@media(hover:hover){
  .arrow-link:hover .arrow-img--ne{transform:translate(2px,-2px)}
  .arrow-link:hover .arrow-img--se{transform:translate(2px,2px)}
  .arrow-link:hover .arrow-img--right{transform:translateX(3px)}
  .arrow-link:hover .arrow-img--left{transform:translateX(-3px)}
}

/* TITRE : la dernière ligne est structurellement fixe */
.intro-title h2{
  display:block;
}
.intro-title__static{
  display:block;
}
.rotating-line{
  display:flex;
  align-items:baseline;
  gap:.16em;
  white-space:nowrap;
  width:100%;
}
.rotating-slot{
  position:relative!important;
  display:inline-block!important;
  width:5.85em!important;
  height:1em!important;
  flex:0 0 5.85em!important;
  vertical-align:baseline!important;
}
.rotating-slot .rotating-word{
  position:absolute!important;
  left:0!important;
  top:0!important;
  bottom:auto!important;
  display:block!important;
  width:auto!important;
  max-width:none!important;
  min-width:0!important;
  white-space:nowrap!important;
  font-style:italic;
  font-family:"Cormorant Garamond",serif;
  font-weight:500;
  line-height:1!important;
  color:#a7aea9;
}

/* Sur mobile, le principe reste identique : "une + mot" forme UNE ligne indépendante. */
@media(max-width:640px){
  .rotating-line{
    white-space:nowrap!important;
  }
  .rotating-slot{
    width:5.7em!important;
    flex-basis:5.7em!important;
  }
  .arrow-img{
    width:15px!important;
    height:15px!important;
    min-width:15px!important;
    min-height:15px!important;
    max-width:15px!important;
    max-height:15px!important;
    flex-basis:15px!important;
  }
}


/* =========================================================
   V29 — correction du header / menu mobile
   ========================================================= */

@media(max-width:980px){

  /* Le header mobile devient un vrai flex simple :
     logo à gauche, burger à droite. */
  .site-header{
    display:flex!important;
    grid-template-columns:none!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
    height:76px!important;
    padding:0 20px!important;
    box-sizing:border-box!important;
  }

  /* Le bouton Contact desktop disparaît totalement sur mobile. */
  .site-header .desktop-nav,
  .site-header .header-cta{
    display:none!important;
  }

  .site-header .brand{
    display:flex!important;
    align-items:center!important;
    flex:0 1 auto!important;
    width:auto!important;
    max-width:calc(100% - 74px)!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  .site-header .brand-logo{
    display:block!important;
    width:190px!important;
    max-width:100%!important;
    height:auto!important;
    max-height:42px!important;
  }

  /* Burger toujours à droite et sur la même ligne que le logo */
  .site-header .menu-toggle{
    display:flex!important;
    flex:0 0 46px!important;
    width:46px!important;
    height:46px!important;
    margin:0 0 0 auto!important;
    padding:8px!important;
    align-items:center!important;
    justify-content:center!important;
    flex-direction:column!important;
    position:relative!important;
    inset:auto!important;
    z-index:3!important;
  }

  .site-header .menu-toggle span{
    display:block!important;
    width:28px!important;
    height:1.5px!important;
    margin:4px 0!important;
    background:currentColor!important;
    transform-origin:center!important;
  }

  /* Navigation ouverte : rien sur le côté droit,
     Contact fait partie de la même liste que les autres liens. */
  .mobile-nav{
    display:flex!important;
    position:fixed!important;
    z-index:85!important;
    inset:0!important;
    width:100%!important;
    height:100svh!important;
    padding:110px 28px 44px!important;
    box-sizing:border-box!important;
    background:var(--paper)!important;
    color:var(--ink)!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:flex-start!important;
    gap:4px!important;
    overflow-y:auto!important;
    transform:translateX(100%)!important;
    transition:transform .4s var(--ease)!important;
  }

  .mobile-nav.open{
    transform:translateX(0)!important;
  }

  .mobile-nav a{
    display:block!important;
    width:100%!important;
    padding:10px 0!important;
    margin:0!important;
    text-align:left!important;
    font-size:clamp(2rem,8vw,3.2rem)!important;
    line-height:1.04!important;
    letter-spacing:-.045em!important;
    border-bottom:1px solid rgba(18,54,47,.12);
  }

  .mobile-nav a:last-child{
    margin-top:12px!important;
    color:var(--green)!important;
  }
}

@media(max-width:640px){
  .site-header{
    height:72px!important;
    padding:0 16px!important;
  }

  .site-header .brand{
    max-width:calc(100% - 62px)!important;
  }

  .site-header .brand-logo,
  .site-header.scrolled .brand-logo{
    width:165px!important;
    max-height:38px!important;
  }

  .site-header .menu-toggle{
    flex-basis:42px!important;
    width:42px!important;
    height:42px!important;
    padding:6px!important;
  }

  .site-header .menu-toggle span{
    width:26px!important;
  }

  .mobile-nav{
    padding:96px 22px 36px!important;
  }
}


/* =========================================================
   V30 — correction robuste des flèches et du menu mobile
   ========================================================= */

/* ---------------------------------------------------------
   FLÈCHES
   Pas de <img>, pas de glyphes Unicode, pas d'emoji.
   Petits SVG fixes utilisés en background-image.
   --------------------------------------------------------- */
.arrow-img,
.arrow-svg,
.icon-arrow,
.ui-arrow,
.link-arrow{
  display:none!important;
}

.v30-arrow{
  display:inline-block!important;
  flex:0 0 15px!important;
  width:15px!important;
  height:15px!important;
  min-width:15px!important;
  min-height:15px!important;
  max-width:15px!important;
  max-height:15px!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:15px 15px!important;
  vertical-align:middle!important;
  transition:transform .2s ease,opacity .2s ease;
}

/* Blanc : utilisé partout par défaut sur les zones sombres */
.v30-arrow--ne{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24'%3E%3Cpath d='M7 17L17 7M9 7h8v8' fill='none' stroke='%23ffffff' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}
.v30-arrow--se{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24'%3E%3Cpath d='M7 7l10 10M9 17h8V9' fill='none' stroke='%23ffffff' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}
.v30-arrow--right{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M14 7l5 5-5 5' fill='none' stroke='%23ffffff' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}
.v30-arrow--left{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24'%3E%3Cpath d='M19 12H5M10 7l-5 5 5 5' fill='none' stroke='%23ffffff' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}

/* Sur les pages claires / contenu légal : version vert foncé */
.legal-article .v30-arrow--ne{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24'%3E%3Cpath d='M7 17L17 7M9 7h8v8' fill='none' stroke='%2312362f' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}
.legal-article .v30-arrow--left{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24'%3E%3Cpath d='M19 12H5M10 7l-5 5 5 5' fill='none' stroke='%2312362f' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}

/* Si le header était clair dans un contexte futur, garde une flèche sombre */
.site-header:not(.scrolled) .header-cta .v30-arrow--ne{
  opacity:.92;
}

.arrow-link{
  display:inline-flex!important;
  align-items:center!important;
  gap:.55em!important;
}
.contact-panel__cta.arrow-link{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  width:100%!important;
}
@media(hover:hover){
  .arrow-link:hover .v30-arrow--ne{transform:translate(2px,-2px)}
  .arrow-link:hover .v30-arrow--se{transform:translate(2px,2px)}
  .arrow-link:hover .v30-arrow--right{transform:translateX(3px)}
  .arrow-link:hover .v30-arrow--left{transform:translateX(-3px)}
}

/* ---------------------------------------------------------
   MENU MOBILE
   Header = logo gauche / burger droite.
   Le menu s'ouvre SOUS le header et ne peut plus se superposer
   avec un ancien bouton Contact desktop.
   --------------------------------------------------------- */
@media(max-width:980px){

  .site-header,
  .site-header.scrolled{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    z-index:100!important;
    width:100%!important;
    height:76px!important;
    min-height:76px!important;
    padding:0 22px!important;
    display:flex!important;
    grid-template-columns:none!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:18px!important;
    background:rgba(13,44,38,.97)!important;
    color:#fff!important;
    border-bottom:1px solid rgba(255,255,255,.13)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
    box-sizing:border-box!important;
  }

  .site-header .desktop-nav,
  .site-header .header-cta{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  .site-header .brand,
  .site-header.scrolled .brand{
    position:relative!important;
    inset:auto!important;
    flex:0 1 auto!important;
    display:flex!important;
    align-items:center!important;
    width:auto!important;
    max-width:calc(100% - 68px)!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
    background:none!important;
    box-shadow:none!important;
    transform:none!important;
  }

  .site-header .brand-logo,
  .site-header.scrolled .brand-logo{
    display:block!important;
    width:190px!important;
    max-width:100%!important;
    height:auto!important;
    max-height:40px!important;
    margin:0!important;
  }

  .site-header .menu-toggle{
    position:relative!important;
    inset:auto!important;
    z-index:102!important;
    display:flex!important;
    flex:0 0 46px!important;
    width:46px!important;
    height:46px!important;
    margin:0!important;
    padding:8px!important;
    border:0!important;
    background:transparent!important;
    color:#fff!important;
    align-items:center!important;
    justify-content:center!important;
    flex-direction:column!important;
    box-sizing:border-box!important;
  }

  .site-header .menu-toggle span{
    position:absolute!important;
    left:9px!important;
    width:28px!important;
    height:1.5px!important;
    margin:0!important;
    background:#fff!important;
    border:0!important;
    border-radius:0!important;
    transform:none;
    transition:transform .28s ease,top .28s ease,opacity .2s ease!important;
  }
  .site-header .menu-toggle span:first-child{top:17px!important}
  .site-header .menu-toggle span:last-child{top:28px!important}

  .site-header .menu-toggle.open span:first-child{
    top:22px!important;
    transform:rotate(45deg)!important;
  }
  .site-header .menu-toggle.open span:last-child{
    top:22px!important;
    transform:rotate(-45deg)!important;
  }

  .mobile-nav{
    position:fixed!important;
    z-index:99!important;
    top:76px!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    inset:auto 0 0 0!important;
    width:100%!important;
    height:calc(100svh - 76px)!important;
    margin:0!important;
    padding:34px 28px 38px!important;
    box-sizing:border-box!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    align-items:stretch!important;
    gap:0!important;
    background:#f4f0e8!important;
    color:#12362f!important;
    overflow-y:auto!important;
    transform:translateX(100%)!important;
    opacity:1!important;
    visibility:visible!important;
    transition:transform .38s cubic-bezier(.22,.61,.36,1)!important;
  }

  .mobile-nav.open{
    transform:translateX(0)!important;
  }

  .mobile-nav a{
    position:relative!important;
    display:block!important;
    flex:none!important;
    width:100%!important;
    margin:0!important;
    padding:18px 0!important;
    text-align:left!important;
    color:#12362f!important;
    font-family:var(--sans)!important;
    font-size:clamp(2rem,7.5vw,3rem)!important;
    line-height:1!important;
    font-weight:500!important;
    letter-spacing:-.045em!important;
    text-transform:none!important;
    border:0!important;
    border-bottom:1px solid rgba(18,54,47,.14)!important;
    transform:none!important;
  }

  .mobile-nav a:last-child{
    margin-top:12px!important;
    color:#12362f!important;
    border-bottom-color:#12362f!important;
  }
}

@media(max-width:640px){
  .site-header,
  .site-header.scrolled{
    height:72px!important;
    min-height:72px!important;
    padding:0 16px!important;
  }

  .site-header .brand,
  .site-header.scrolled .brand{
    max-width:calc(100% - 58px)!important;
  }

  .site-header .brand-logo,
  .site-header.scrolled .brand-logo{
    width:165px!important;
    max-height:36px!important;
  }

  .site-header .menu-toggle{
    flex-basis:42px!important;
    width:42px!important;
    height:42px!important;
    padding:6px!important;
  }
  .site-header .menu-toggle span{
    left:8px!important;
    width:26px!important;
  }
  .site-header .menu-toggle span:first-child{top:15px!important}
  .site-header .menu-toggle span:last-child{top:26px!important}
  .site-header .menu-toggle.open span:first-child,
  .site-header .menu-toggle.open span:last-child{
    top:20.5px!important;
  }

  .mobile-nav{
    top:72px!important;
    height:calc(100svh - 72px)!important;
    padding:24px 22px 34px!important;
  }

  .mobile-nav a{
    padding:16px 0!important;
    font-size:clamp(1.9rem,8.2vw,2.65rem)!important;
  }

  .v30-arrow{
    flex-basis:14px!important;
    width:14px!important;
    height:14px!important;
    min-width:14px!important;
    min-height:14px!important;
    max-width:14px!important;
    max-height:14px!important;
    background-size:14px 14px!important;
  }
}


/* =========================================================
   V31 — flèches blanches partout + menu mobile simplifié
   ========================================================= */

/* Neutralise toutes les anciennes implémentations */
.v30-arrow,
.arrow-img,
.arrow-svg,
.icon-arrow,
.ui-arrow,
.link-arrow{
  display:none!important;
}

/* Flèches simples et fiables dessinées en CSS.
   Toujours blanches sur le site. */
.site-arrow{
  position:relative;
  display:inline-block!important;
  flex:0 0 15px!important;
  width:15px!important;
  height:15px!important;
  min-width:15px!important;
  min-height:15px!important;
  max-width:15px!important;
  max-height:15px!important;
  color:#fff!important;
  vertical-align:middle;
}

.site-arrow::before,
.site-arrow::after{
  content:"";
  position:absolute;
  box-sizing:border-box;
}

/* ↗ */
.site-arrow--ne::before{
  width:8px;
  height:8px;
  right:1px;
  top:1px;
  border-top:1.5px solid #fff;
  border-right:1.5px solid #fff;
}
.site-arrow--ne::after{
  width:11px;
  height:1.5px;
  right:1px;
  top:7px;
  background:#fff;
  transform:rotate(-45deg);
  transform-origin:right center;
}

/* ↘ */
.site-arrow--se::before{
  width:8px;
  height:8px;
  right:1px;
  bottom:1px;
  border-bottom:1.5px solid #fff;
  border-right:1.5px solid #fff;
}
.site-arrow--se::after{
  width:11px;
  height:1.5px;
  right:1px;
  top:6px;
  background:#fff;
  transform:rotate(45deg);
  transform-origin:right center;
}

/* → */
.site-arrow--right::before{
  width:12px;
  height:1.5px;
  left:0;
  top:6.5px;
  background:#fff;
}
.site-arrow--right::after{
  width:6px;
  height:6px;
  right:0;
  top:4px;
  border-top:1.5px solid #fff;
  border-right:1.5px solid #fff;
  transform:rotate(45deg);
}

/* ← */
.site-arrow--left::before{
  width:12px;
  height:1.5px;
  right:0;
  top:6.5px;
  background:#fff;
}
.site-arrow--left::after{
  width:6px;
  height:6px;
  left:0;
  top:4px;
  border-left:1.5px solid #fff;
  border-bottom:1.5px solid #fff;
  transform:rotate(45deg);
}

.arrow-link{
  display:inline-flex!important;
  align-items:center!important;
  gap:.55em!important;
}

.contact-panel__cta.arrow-link{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  width:100%!important;
}

@media(hover:hover){
  .arrow-link:hover .site-arrow--ne{transform:translate(2px,-2px)}
  .arrow-link:hover .site-arrow--se{transform:translate(2px,2px)}
  .arrow-link:hover .site-arrow--right{transform:translateX(3px)}
  .arrow-link:hover .site-arrow--left{transform:translateX(-3px)}
}
.site-arrow{transition:transform .2s ease}

/* MENU MOBILE :
   - aucun Contact dans le header
   - burger toujours à droite
   - logo toujours à gauche */
@media(max-width:980px){
  .site-header,
  .site-header.scrolled{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    grid-template-columns:none!important;
    padding:0 18px!important;
  }

  .site-header .desktop-nav,
  .site-header .header-cta{
    display:none!important;
    visibility:hidden!important;
  }

  .site-header .brand,
  .site-header.scrolled .brand{
    display:flex!important;
    align-items:center!important;
    flex:0 1 auto!important;
    max-width:calc(100% - 64px)!important;
    margin:0!important;
    padding:0!important;
    position:relative!important;
    inset:auto!important;
    transform:none!important;
  }

  .site-header .menu-toggle{
    display:flex!important;
    flex:0 0 44px!important;
    width:44px!important;
    height:44px!important;
    margin-left:auto!important;
    position:relative!important;
    inset:auto!important;
    align-items:center!important;
    justify-content:center!important;
    flex-direction:column!important;
    z-index:120!important;
  }

  .site-header .menu-toggle span{
    position:absolute!important;
    left:8px!important;
    width:28px!important;
    height:1.5px!important;
    background:#fff!important;
    margin:0!important;
  }

  .site-header .menu-toggle span:first-child{top:17px!important}
  .site-header .menu-toggle span:last-child{top:27px!important}

  .site-header .menu-toggle.open span:first-child{
    top:22px!important;
    transform:rotate(45deg)!important;
  }
  .site-header .menu-toggle.open span:last-child{
    top:22px!important;
    transform:rotate(-45deg)!important;
  }

  /* Au cas où un Contact aurait survécu dans le menu mobile */
  .mobile-nav a[href="#contact"]{
    display:none!important;
  }
}

@media(max-width:640px){
  .site-header,
  .site-header.scrolled{
    padding:0 16px!important;
  }
  .site-header .menu-toggle{
    flex-basis:42px!important;
    width:42px!important;
    height:42px!important;
  }
  .site-header .menu-toggle span{
    left:8px!important;
    width:26px!important;
  }
}


/* =========================================================
   V32 — correction des flèches + retour du header mobile transparent
   ========================================================= */

/* Neutralisation de tous les anciens systèmes de flèches */
.site-arrow,
.v30-arrow,
.arrow-img,
.arrow-svg,
.icon-arrow,
.ui-arrow,
.link-arrow{
  display:none!important;
}

/* Nouveau système isolé : petit SVG blanc en background.
   Aucune pseudo-forme, aucun emoji, aucune balise image. */
.v32-arrow{
  display:inline-block!important;
  flex:0 0 15px!important;
  width:15px!important;
  height:15px!important;
  min-width:15px!important;
  min-height:15px!important;
  max-width:15px!important;
  max-height:15px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background-color:transparent!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:15px 15px!important;
  box-shadow:none!important;
  font-size:0!important;
  line-height:0!important;
  vertical-align:middle!important;
  transition:transform .2s ease;
}

.v32-arrow--ne{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 17L17 7M9 7h8v8' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}
.v32-arrow--se{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7l10 10M9 17h8V9' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}
.v32-arrow--right{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M14 7l5 5-5 5' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}
.v32-arrow--left{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 12H5M10 7l-5 5 5 5' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}

/* Sur la page légale claire, les flèches doivent rester visibles */
.legal-page .v32-arrow--ne{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 17L17 7M9 7h8v8' fill='none' stroke='%2312362f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}
.legal-page .v32-arrow--left{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 12H5M10 7l-5 5 5 5' fill='none' stroke='%2312362f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}

.arrow-link{
  display:inline-flex!important;
  align-items:center!important;
  gap:.55em!important;
}
.contact-panel__cta.arrow-link{
  display:flex!important;
  width:100%!important;
  align-items:center!important;
  justify-content:space-between!important;
}

@media(hover:hover){
  .arrow-link:hover .v32-arrow--ne{transform:translate(2px,-2px)}
  .arrow-link:hover .v32-arrow--se{transform:translate(2px,2px)}
  .arrow-link:hover .v32-arrow--right{transform:translateX(3px)}
  .arrow-link:hover .v32-arrow--left{transform:translateX(-3px)}
}

/* MOBILE HEADER
   Au-dessus du hero = transparent.
   Après scroll = bandeau vert plein. */
@media(max-width:980px){

  .site-header:not(.scrolled){
    background:transparent!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    border-bottom:1px solid rgba(255,255,255,.22)!important;
    box-shadow:none!important;
  }

  .site-header.scrolled{
    background:rgba(13,44,38,.97)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
    color:#fff!important;
    border-bottom:1px solid rgba(255,255,255,.16)!important;
  }

  /* Logo/burger gardent leur bonne position de la V31 */
  .site-header .brand,
  .site-header.scrolled .brand{
    background:transparent!important;
    box-shadow:none!important;
  }

  .site-header .menu-toggle{
    margin-left:auto!important;
    color:#fff!important;
  }

  .site-header .menu-toggle span{
    background:#fff!important;
  }

  .v32-arrow{
    flex-basis:14px!important;
    width:14px!important;
    height:14px!important;
    min-width:14px!important;
    min-height:14px!important;
    max-width:14px!important;
    max-height:14px!important;
    background-size:14px 14px!important;
  }
}


/* =========================================================
   V33 — flèches fiables + header mobile réellement transparent
   ========================================================= */

/* Cache définitivement tous les anciens objets de flèches. */
.v32-arrow,
.site-arrow,
.v30-arrow,
.arrow-img,
.arrow-svg,
.icon-arrow,
.ui-arrow,
.link-arrow{
  display:none!important;
}

/* Flèches dessinées directement sur le lien/bouton avec ::after.
   Plus aucun span/image/SVG dans le HTML : pas d'emoji et pas de conflit CSS. */
.arrow-ne::after,
.arrow-se::after,
.arrow-right::after,
.arrow-left::before{
  content:""!important;
  display:inline-block!important;
  flex:0 0 15px!important;
  width:15px!important;
  height:15px!important;
  min-width:15px!important;
  min-height:15px!important;
  max-width:15px!important;
  max-height:15px!important;
  margin:0!important;
  padding:0!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:15px 15px!important;
  vertical-align:middle!important;
  transition:transform .2s ease!important;
}

/* ↗ */
.arrow-ne::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 17L17 7M9 7h8v8' fill='none' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}

/* ↘ */
.arrow-se::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7l10 10M9 17h8V9' fill='none' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}

/* → */
.arrow-right::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M14 7l5 5-5 5' fill='none' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}

/* ← */
.arrow-left::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 12H5M10 7l-5 5 5 5' fill='none' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}

/* Mise en page propre des liens à flèche */
.arrow-ne,
.arrow-se,
.arrow-right,
.arrow-left{
  display:inline-flex!important;
  align-items:center!important;
  gap:.55em!important;
}
.contact-panel__cta.arrow-right{
  display:flex!important;
  width:100%!important;
  justify-content:space-between!important;
  align-items:center!important;
}

/* Page légale claire : flèches vert foncé */
.legal-page .arrow-ne::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 17L17 7M9 7h8v8' fill='none' stroke='%2312362f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}
.legal-page .arrow-left::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 12H5M10 7l-5 5 5 5' fill='none' stroke='%2312362f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}

@media(hover:hover){
  .arrow-ne:hover::after{transform:translate(2px,-2px)!important}
  .arrow-se:hover::after{transform:translate(2px,2px)!important}
  .arrow-right:hover::after{transform:translateX(3px)!important}
  .arrow-left:hover::before{transform:translateX(-3px)!important}
}

/* MOBILE HEADER
   En haut de page = totalement transparent.
   Le fond vert n'apparaît que lorsque JS ajoute .scrolled. */
@media(max-width:980px){
  .site-header,
  .site-header:not(.scrolled){
    background:transparent!important;
    background-color:transparent!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    box-shadow:none!important;
    border-bottom:1px solid rgba(255,255,255,.20)!important;
  }

  .site-header.scrolled{
    background:#12362f!important;
    background-color:#12362f!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
    border-bottom:1px solid rgba(255,255,255,.16)!important;
  }

  .site-header .brand,
  .site-header:not(.scrolled) .brand,
  .site-header.scrolled .brand{
    background:transparent!important;
    box-shadow:none!important;
  }

  .arrow-ne::after,
  .arrow-se::after,
  .arrow-right::after,
  .arrow-left::before{
    flex-basis:14px!important;
    width:14px!important;
    height:14px!important;
    min-width:14px!important;
    min-height:14px!important;
    max-width:14px!important;
    max-height:14px!important;
    background-size:14px 14px!important;
  }
}


/* =========================================================
   V34 — correction définitive demandée :
   flèches blanches visibles + header mobile transparent au départ
   ========================================================= */

/* Neutralise TOUS les anciens systèmes de flèche */
.v32-arrow,
.site-arrow,
.v30-arrow,
.arrow-img,
.arrow-svg,
.icon-arrow,
.ui-arrow,
.link-arrow{
  display:none!important;
}
.arrow-ne::after,
.arrow-se::after,
.arrow-right::after,
.arrow-left::before{
  content:none!important;
  display:none!important;
}

/* Nouvelle flèche construite avec deux vrais éléments HTML.
   Aucun emoji, aucun SVG, aucun pseudo-élément. */
.v34-arrow{
  position:relative!important;
  display:inline-block!important;
  flex:0 0 16px!important;
  width:16px!important;
  height:16px!important;
  min-width:16px!important;
  min-height:16px!important;
  max-width:16px!important;
  max-height:16px!important;
  margin:0!important;
  padding:0!important;
  color:#fff!important;
  vertical-align:middle!important;
  transition:transform .2s ease!important;
}

.v34-arrow__shaft{
  position:absolute!important;
  display:block!important;
  left:1px!important;
  top:7px!important;
  width:12px!important;
  height:1.5px!important;
  margin:0!important;
  padding:0!important;
  background:#fff!important;
  border:0!important;
  border-radius:2px!important;
}

.v34-arrow__head{
  position:absolute!important;
  display:block!important;
  right:1px!important;
  top:4px!important;
  width:6px!important;
  height:6px!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  border-top:1.5px solid #fff!important;
  border-right:1.5px solid #fff!important;
  border-radius:0!important;
  transform:rotate(45deg)!important;
  transform-origin:center!important;
}

/* Orientation du petit ensemble */
.v34-arrow--right{transform:rotate(0deg)!important}
.v34-arrow--ne{transform:rotate(-45deg)!important}
.v34-arrow--se{transform:rotate(45deg)!important}
.v34-arrow--left{transform:rotate(180deg)!important}

.arrow-link,
.project-modal__cta{
  display:inline-flex!important;
  align-items:center!important;
  gap:.55em!important;
}
.contact-panel__cta.arrow-link{
  display:flex!important;
  width:100%!important;
  justify-content:space-between!important;
  align-items:center!important;
}

/* Sur la page légale claire, utiliser une version vert foncé */
.legal-page .v34-arrow{
  color:#12362f!important;
}
.legal-page .v34-arrow__shaft{
  background:#12362f!important;
}
.legal-page .v34-arrow__head{
  border-top-color:#12362f!important;
  border-right-color:#12362f!important;
}

@media(hover:hover){
  .arrow-link:hover .v34-arrow--ne{transform:rotate(-45deg) translate(2px,0)!important}
  .arrow-link:hover .v34-arrow--se{transform:rotate(45deg) translate(2px,0)!important}
  .arrow-link:hover .v34-arrow--right{transform:translateX(3px)!important}
  .arrow-link:hover .v34-arrow--left{transform:rotate(180deg) translate(2px,0)!important}
}

/* MOBILE HEADER :
   totalement transparent au départ.
   Le fond vert arrive uniquement avec .scrolled. */
@media(max-width:980px){

  .site-header,
  .site-header:not(.scrolled){
    background:transparent!important;
    background-color:transparent!important;
    background-image:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    box-shadow:none!important;
    border-bottom:1px solid rgba(255,255,255,.20)!important;
  }

  .site-header.scrolled{
    background:#12362f!important;
    background-color:#12362f!important;
    background-image:none!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
    box-shadow:none!important;
    border-bottom:1px solid rgba(255,255,255,.16)!important;
  }

  .site-header .brand,
  .site-header:not(.scrolled) .brand,
  .site-header.scrolled .brand{
    background:transparent!important;
    background-color:transparent!important;
    box-shadow:none!important;
  }

  .v34-arrow{
    flex-basis:15px!important;
    width:15px!important;
    height:15px!important;
    min-width:15px!important;
    min-height:15px!important;
    max-width:15px!important;
    max-height:15px!important;
  }
}