@import url('/realisations-menu.css');

:root{--real-ink:#142329;--real-muted:#607078;--real-line:#dce5e8;--real-paper:#f6f8f8;--real-cyan:#21a7d4;--real-cyan-dark:#0f769b;--real-night:#101a1e}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--real-ink)}
.container{width:min(calc(100% - 48px),1440px);margin-inline:auto}
.realisations-header{position:relative;z-index:50;border-bottom:1px solid var(--real-line);background:#fff}
.realisations-header .nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:26px;min-height:102px;padding:8px 0}
.realisations-header .brand{display:flex;flex:0 0 auto;align-items:center;text-decoration:none}
.realisations-header .brand-sigle{display:block;width:82px;height:62px;object-fit:contain;margin-right:-9px}
.realisations-header .brand-wordmark{display:block;width:230px;height:auto}
.realisations-header .desktop-nav{display:flex;align-items:center;gap:20px;align-self:stretch}
.realisations-header .desktop-nav>a,.realisations-header .nav-dropdown>a{position:relative;color:#41535a;font-size:.77rem;font-weight:750;text-decoration:none;white-space:nowrap}
.realisations-header .desktop-nav>a:hover,.realisations-header .nav-dropdown>a:hover,.realisations-header .desktop-nav a.active{color:#117ca2}
.realisations-header .desktop-nav a.active:after{content:"";position:absolute;right:0;bottom:-11px;left:0;height:2px;background:var(--real-cyan)}
.realisations-header .nav-cta{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;padding:13px 18px;border:1px solid #1d95bc;border-radius:999px;background:#1d95bc;color:#fff;font-size:.73rem;font-weight:800;text-decoration:none;white-space:nowrap}
.realisations-header .nav-cta:hover{background:#117a9e}
.realisations-header .nav-wrap{max-width:1480px}
.realisations-header .desktop-nav{gap:20px}
.realisations-header .desktop-nav>a,.realisations-header .nav-dropdown>a{font-size:.77rem}
.realisation-kicker{display:inline-flex;align-items:center;gap:10px;color:var(--real-cyan-dark);font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.realisation-kicker:before{content:"";width:32px;height:1px;background:currentColor}
.realisation-kicker.light{color:#91d7ec}

.projects-hero{padding:96px 0 84px;background:linear-gradient(150deg,#f7fafb 0%,#fff 66%);border-bottom:1px solid var(--real-line)}
.projects-hero-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:7vw;align-items:end}
.projects-hero h1{max-width:950px;margin:25px 0 0;font-size:clamp(2.4rem,5.2vw,5.65rem);line-height:.97;letter-spacing:-.055em}
.projects-hero-copy{padding-bottom:8px}
.projects-hero-copy p{margin:0;color:var(--real-muted);font-size:clamp(1rem,1.3vw,1.22rem);line-height:1.72}
.realisation-text-link{display:inline-flex;align-items:center;gap:15px;margin-top:28px;color:var(--real-ink);font-size:.82rem;font-weight:800;text-decoration:none;text-transform:uppercase;letter-spacing:.09em}
.realisation-text-link span{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--real-cyan);color:#fff}
.projects-list{padding:92px 0 120px}
.projects-intro{display:grid;grid-template-columns:.35fr 1fr;gap:40px;max-width:960px;margin:0 0 54px}
.projects-intro span{color:var(--real-cyan-dark);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.15em}
.projects-intro p{margin:0;color:var(--real-muted);font-size:1.08rem;line-height:1.7}
.project-cards{display:grid;gap:88px}
.project-card{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(300px,.68fr);gap:clamp(34px,5vw,82px);align-items:center}
.project-card:nth-child(even){grid-template-columns:minmax(300px,.68fr) minmax(0,1.32fr)}
.project-card:nth-child(even) .project-card-image{grid-column:2;grid-row:1}
.project-card:nth-child(even) .project-card-copy{grid-column:1;grid-row:1}
.project-card-image{position:relative;display:block;overflow:hidden;aspect-ratio:16/10;border-radius:4px;background:#dfe8ea}
.project-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.7,.2,1)}
.project-card-image.preserve-framing{aspect-ratio:auto;background:transparent}
.project-card-image.preserve-framing img{width:100%;height:auto;object-fit:contain}
.project-card-image:hover img{transform:scale(1.025)}
.project-card-number{position:absolute;left:18px;bottom:18px;display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:rgba(16,26,30,.9);color:#fff;font-weight:700}
.project-card-arrow{position:absolute;right:18px;top:18px;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#fff;color:var(--real-ink);font-size:1.2rem}
.project-card-copy>div{display:flex;justify-content:space-between;gap:18px;border-bottom:1px solid var(--real-line);padding-bottom:13px;color:var(--real-cyan-dark);font-size:.69rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.project-card-copy small{color:#7a898f;font:inherit}
.project-card-copy h2{margin:26px 0 18px;font-size:clamp(1.75rem,3.2vw,3rem);line-height:1.08;letter-spacing:-.035em}
.project-card-copy h2 a{color:inherit;text-decoration:none}
.project-card-copy p{margin:0;color:var(--real-muted);font-size:1rem;line-height:1.72}
.project-card-link{display:inline-block;margin-top:25px;padding-bottom:5px;border-bottom:1px solid var(--real-ink);color:var(--real-ink);font-size:.78rem;font-weight:800;letter-spacing:.1em;text-decoration:none;text-transform:uppercase}
.projects-method{padding:100px 0;background:var(--real-night);color:#fff}
.projects-method-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw}
.projects-method h2{max-width:540px;margin:22px 0 0;font-size:clamp(2rem,4vw,4.2rem);line-height:1.02;letter-spacing:-.045em}
.projects-method-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#334045;border:1px solid #334045}
.projects-method-steps article{min-height:250px;padding:30px 24px;background:var(--real-night)}
.projects-method-steps b{color:#55c3e4;font-size:.72rem;letter-spacing:.12em}
.projects-method-steps h3{margin:64px 0 12px;font-size:1.28rem}
.projects-method-steps p{margin:0;color:#aebbc0;font-size:.9rem;line-height:1.6}

.realisation-breadcrumb{border-top:1px solid var(--real-line);border-bottom:1px solid var(--real-line);background:#fbfcfc}
.realisation-breadcrumb .container{display:flex;align-items:center;gap:10px;min-height:45px;color:#7b898e;font-size:.72rem}
.realisation-breadcrumb a{color:#53656c;text-decoration:none}
.realisation-hero{padding:72px 0 48px}
.realisation-hero-copy{display:grid;grid-template-columns:minmax(0,1.42fr) minmax(270px,.58fr);gap:6vw;align-items:end;margin-bottom:48px}
.realisation-hero h1{max-width:980px;margin:22px 0 0;font-size:clamp(2.15rem,4.65vw,5.15rem);line-height:.99;letter-spacing:-.052em}
.realisation-hero-lead{padding-bottom:8px}
.realisation-hero-lead>p{margin:0;color:var(--real-muted);font-size:clamp(1rem,1.35vw,1.2rem);line-height:1.72}
.realisation-hero-lead>div{display:flex;justify-content:space-between;gap:18px;margin-top:28px;padding-top:14px;border-top:1px solid var(--real-line);color:var(--real-cyan-dark);font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.realisation-hero-lead small{color:#74848a;font:inherit}
.realisation-hero-media{position:relative}
.realisation-hero-media>img{display:block;width:100%;height:clamp(420px,67vw,780px);object-fit:cover;border-radius:3px}
.realisation-hero-media.preserve-framing>img{height:auto;max-height:none;object-fit:contain}
.realisation-hero-media>p{max-width:720px;margin:12px 0 0;color:#738188;font-size:.76rem}
.realisation-hero-index{position:absolute;right:30px;bottom:48px;display:flex;align-items:center;gap:14px;padding:13px 17px;background:rgba(255,255,255,.94);box-shadow:0 16px 40px rgba(16,26,30,.16)}
.realisation-hero-index span{color:#64747b;font-size:.66rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.realisation-hero-index strong{color:var(--real-cyan-dark);font-size:1.7rem}
.realisation-overview{padding:86px 0;background:var(--real-paper);border-top:1px solid var(--real-line);border-bottom:1px solid var(--real-line)}
.realisation-overview-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:8vw}
.overview-heading>span,.realisation-gallery-heading>span,.realisation-next-grid>div>span,.realisation-cta-grid>div>span{color:var(--real-cyan-dark);font-size:.7rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.overview-heading h2,.realisation-gallery-heading h2,.realisation-next h2,.realisation-cta h2{max-width:620px;margin:18px 0 0;font-size:clamp(1.9rem,3.6vw,3.7rem);line-height:1.04;letter-spacing:-.04em}
.realisation-facts{display:grid;grid-template-columns:repeat(2,1fr);margin:0;border-top:1px solid #cbd7da}
.realisation-facts>div{padding:20px 16px 22px 0;border-bottom:1px solid #cbd7da}
.realisation-facts>div:nth-child(odd){border-right:1px solid #cbd7da}
.realisation-facts>div:nth-child(even){padding-left:24px}
.realisation-facts dt{margin-bottom:9px;color:#708087;font-size:.68rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.realisation-facts dd{margin:0;color:var(--real-ink);font-size:1rem;font-weight:700;line-height:1.4}
.realisation-story{padding:105px 0}
.story-row{display:grid;grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr);gap:clamp(42px,7vw,110px);align-items:center;padding:60px 0;border-bottom:1px solid var(--real-line)}
.story-row:first-child{padding-top:0}
.story-row.reverse{grid-template-columns:minmax(0,1.22fr) minmax(300px,.78fr)}
.story-row.reverse .story-copy{grid-column:2;grid-row:1}
.story-row.reverse .story-image,.story-row.reverse .story-note{grid-column:1;grid-row:1}
.story-copy>span{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#e6f6fa;color:var(--real-cyan-dark);font-size:.72rem;font-weight:800}
.story-copy h2{margin:23px 0 20px;font-size:clamp(1.65rem,3vw,2.75rem);line-height:1.08;letter-spacing:-.035em}
.story-copy p{margin:0 0 15px;color:var(--real-muted);font-size:1rem;line-height:1.78}
.story-image{margin:0}
.story-image img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:3px}
.story-image.preserve-framing img{height:auto;aspect-ratio:auto;object-fit:contain}
.story-image figcaption{margin-top:10px;color:#738188;font-size:.74rem;line-height:1.45}
.story-note{display:flex;min-height:420px;flex-direction:column;justify-content:space-between;padding:34px;background:linear-gradient(145deg,#122128,#1d333c);color:#fff}
.story-note>span{color:#70cbe6;font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.story-note strong{font-size:clamp(2rem,4vw,4.1rem);line-height:.98;letter-spacing:-.05em}
.story-note a{color:#fff;font-size:.75rem;font-weight:800;letter-spacing:.08em;text-decoration:none;text-transform:uppercase}
.realisation-local{padding:92px 0;background:#f6f8f8;border-top:1px solid var(--real-line)}
.realisation-local-grid,.realisation-faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw}
.realisation-local-grid span,.realisation-faq-grid>div:first-child>span{color:var(--real-cyan-dark);font-size:.7rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.realisation-local h2,.realisation-faq h2{max-width:620px;margin:18px 0 0;font-size:clamp(1.9rem,3.6vw,3.7rem);line-height:1.04;letter-spacing:-.04em}
.realisation-local p{margin:0;color:var(--real-muted);font-size:1.03rem;line-height:1.82}
.realisation-faq{padding:96px 0;background:#fff;border-top:1px solid var(--real-line)}
.realisation-faq-list{border-top:1px solid var(--real-line)}
.realisation-faq-list article{padding:25px 0;border-bottom:1px solid var(--real-line)}
.realisation-faq-list h3{margin:0 0 10px;font-size:1.12rem;line-height:1.35}
.realisation-faq-list p{margin:0;color:var(--real-muted);font-size:.96rem;line-height:1.7}
.realisation-gallery{padding:100px 0;background:var(--real-paper)}
.realisation-gallery-heading{display:grid;grid-template-columns:.45fr 1fr;gap:50px;margin-bottom:42px}
.realisation-gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.realisation-gallery figure{margin:0}
.realisation-gallery img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
.realisation-gallery figcaption{padding:11px 2px;color:#6c7c82;font-size:.75rem}
.realisation-next{padding:105px 0;background:var(--real-night);color:#fff}
.realisation-next-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw}
.realisation-next-grid>div>span{color:#71cce7}
.realisation-next-links{border-top:1px solid #35454b}
.realisation-next-links a{display:grid;grid-template-columns:40px 1fr 28px;gap:16px;align-items:center;padding:23px 0;border-bottom:1px solid #35454b;color:#fff;text-decoration:none}
.realisation-next-links b{color:#64c9e8;font-size:.7rem;letter-spacing:.1em}
.realisation-next-links span{font-size:1.02rem;font-weight:700}
.realisation-next-links small{display:block;margin-top:4px;color:#91a0a6;font-size:.72rem;font-weight:500}
.realisation-next-links i{font-style:normal;font-size:1.1rem}
.realisation-cta{padding:92px 0;background:#fff}
.realisation-cta-grid{display:grid;grid-template-columns:1fr .72fr;gap:8vw;align-items:end}
.realisation-cta-grid>div>p{margin:0 0 24px;color:var(--real-muted);font-size:1.04rem;line-height:1.7}

.realisations-footer{padding-top:70px!important;background:var(--real-night);color:#fff}
.realisations-footer-grid{display:grid;grid-template-columns:1.5fr .7fr .7fr 1fr;gap:48px;padding-bottom:52px}
.realisations-footer-grid>div:not(.footer-intro){display:flex;flex-direction:column;gap:10px}
.realisations-footer h2{margin:0 0 8px;color:#fff;font-size:.77rem;letter-spacing:.12em;text-transform:uppercase}
.realisations-footer a{color:#b9c5c9;text-decoration:none;font-size:.86rem;line-height:1.45}
.realisations-footer a:hover{color:#fff}
.footer-logo img{width:240px;height:auto;filter:brightness(0) invert(1)}
.footer-intro p{max-width:430px;margin:22px 0 0;color:#9eacb1;font-size:.88rem;line-height:1.65}
.footer-address address{margin:4px 0 0;color:#b9c5c9;font-size:.86rem;font-style:normal;line-height:1.65}
.footer-address small{margin-top:7px;color:#7f9097;font-size:.71rem;text-transform:uppercase;letter-spacing:.08em}
.realisations-footer-bottom{display:flex;justify-content:space-between;gap:20px;padding:20px 0;border-top:1px solid #334147;color:#829198;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase}

@media(max-width:900px){
  .container{width:min(calc(100% - 34px),1440px)}
  .realisations-header .nav-wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 14px;min-height:auto;padding:7px 0 0}
  .realisations-header .desktop-nav{grid-column:1/-1;grid-row:2;display:flex;width:100%;gap:6px;padding:7px 0 10px;overflow-x:auto;border-top:1px solid var(--real-line);white-space:nowrap}
  .realisations-header .desktop-nav>a,.realisations-header .nav-dropdown>a{flex:0 0 auto;padding:7px 12px;border:1px solid transparent;border-radius:999px;background:rgba(255,255,255,.72);font-size:.72rem}
  .realisations-header .desktop-nav a.active:after{display:none}
  .realisations-header .desktop-nav a.active{border-color:#9fcbd6;background:#e8f7fa;color:#126f93}
  .realisations-header .nav-cta{align-self:center;padding:8px 12px;font-size:.72rem}
  .projects-hero,.projects-list,.realisation-story{padding-top:70px;padding-bottom:78px}
  .projects-hero-grid,.projects-method-grid,.realisation-hero-copy,.realisation-overview-grid,.realisation-next-grid,.realisation-cta-grid,.realisation-local-grid,.realisation-faq-grid{grid-template-columns:1fr;gap:36px}
  .project-card,.project-card:nth-child(even){grid-template-columns:1fr;gap:28px}
  .project-card:nth-child(even) .project-card-image,.project-card:nth-child(even) .project-card-copy{grid-column:1;grid-row:auto}
  .projects-method-steps{grid-template-columns:1fr}
  .projects-method-steps article{min-height:auto}
  .projects-method-steps h3{margin-top:26px}
  .story-row,.story-row.reverse{grid-template-columns:1fr;gap:30px;padding:45px 0}
  .story-row.reverse .story-copy,.story-row.reverse .story-image,.story-row.reverse .story-note{grid-column:1;grid-row:auto}
  .story-row.reverse .story-copy{grid-row:1}
  .realisation-gallery-heading{grid-template-columns:1fr;gap:12px}
  .realisations-footer-grid{grid-template-columns:1fr 1fr}
  .footer-intro{grid-column:1/-1}
}
@media(max-width:600px){
  .realisations-header .brand-sigle{width:56px;height:48px;margin-right:-10px}
  .realisations-header .brand-wordmark{width:min(190px,48vw)}
  .realisations-header .nav-cta{max-width:108px;line-height:1.15;text-align:center}
  .projects-hero{padding-top:54px}
  .projects-hero h1{font-size:clamp(2.35rem,12vw,4rem)}
  .projects-intro{grid-template-columns:1fr;gap:12px}
  .project-cards{gap:62px}
  .project-card-image{aspect-ratio:4/3}
  .project-card-copy>div{align-items:flex-start;flex-direction:column;gap:6px}
  .realisation-hero{padding-top:48px}
  .realisation-hero h1{font-size:clamp(2rem,10.2vw,3.35rem)}
  .realisation-hero-media>img{height:62vw;min-height:300px}
  .realisation-hero-media.preserve-framing>img{height:auto;min-height:0}
  .realisation-hero-index{right:18px;bottom:40px}
  .realisation-facts{grid-template-columns:1fr}
  .realisation-facts>div:nth-child(odd){border-right:0}
  .realisation-facts>div:nth-child(even){padding-left:0}
  .realisation-gallery-grid{grid-template-columns:1fr}
  .realisations-footer-grid{grid-template-columns:1fr}
  .footer-intro{grid-column:auto}
  .realisations-footer-bottom{flex-direction:column}
}

/* Codex 18 — même famille et même échelle typographique que le guide inox. */
body {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.projects-hero h1,
.realisation-hero h1 {
  font-family: inherit;
  font-size: clamp(1.6rem, 3.15vw, 3.4rem);
  line-height: .92;
  letter-spacing: -.025em;
}

.project-card-copy h2,
.projects-method h2,
.overview-heading h2,
.realisation-gallery-heading h2,
.realisation-next h2,
.realisation-cta h2,
.story-copy h2,
.realisation-local h2,
.realisation-faq h2 {
  font-family: inherit;
  font-size: clamp(2rem, 4.3vw, 3.55rem);
  line-height: 1.05;
  letter-spacing: -.025em;
}

.projects-method-steps h3,
.realisation-faq-list h3 {
  font-family: inherit;
  font-size: 1.55rem;
  line-height: 1.25;
  letter-spacing: -.025em;
}

.projects-hero-copy p,
.projects-intro p,
.project-card-copy p,
.projects-method-steps p,
.realisation-hero-lead > p,
.story-copy p,
.realisation-local p,
.realisation-faq-list p,
.realisation-cta-grid > div > p {
  font-size: 1.02rem;
  line-height: 1.76;
}

@media(max-width:600px) {
  .projects-hero h1,
  .realisation-hero h1 {
    font-size: clamp(1.4rem, 7vw, 2.1rem);
  }

  .project-card-copy h2,
  .projects-method h2,
  .overview-heading h2,
  .realisation-gallery-heading h2,
  .realisation-next h2,
  .realisation-cta h2,
  .story-copy h2,
  .realisation-local h2,
  .realisation-faq h2 {
    font-size: 2.35rem;
  }

  .projects-method-steps h3,
  .realisation-faq-list h3 {
    font-size: 1.35rem;
  }
}