@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Playfair+Display:ital,wght@0,500;0,600;1,500&display=swap');
:root{--ink:#262626;--muted:#6f6f6b;--paper:#f8f7f3;--line:#deddd7;--accent:#b08b43;--deep:#263746}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",Arial,sans-serif;line-height:1.65}
.wrap{width:min(1080px,88vw);margin:auto}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:10px;color:var(--accent);font-weight:600;margin:0 0 18px}
.site-header{height:86px!important;min-height:86px;position:sticky;top:0;z-index:20;box-sizing:border-box;background:#fbfaf7;border-bottom:1px solid #e7e3da;padding:0!important}
.site-header-inner{width:min(1080px,88vw);height:100%;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:30px;box-sizing:border-box}
.site-header .brand{display:block;flex:0 0 auto;margin:0!important;padding:0!important;color:#222;text-decoration:none;line-height:1.05;font-family:Georgia,"Times New Roman",serif;font-size:20px!important;font-weight:400!important}
.site-header .brand span{display:block;font:400 20px/1.05 Georgia,"Times New Roman",serif!important;letter-spacing:0!important}
.site-header .brand small{display:block;margin:7px 0 0!important;color:#777;font-family:Arial,Helvetica,sans-serif!important;font-size:9px!important;font-weight:400!important;line-height:1!important;letter-spacing:.16em!important;text-transform:uppercase}
.site-nav{display:flex;align-items:center;justify-content:flex-end;gap:28px!important;margin:0!important;padding:0!important;font-family:Arial,Helvetica,sans-serif!important}
.site-nav .nav-link,.site-nav .nav-cta{color:#333;font-family:Arial,Helvetica,sans-serif!important;font-size:13px!important;line-height:1.2!important;font-weight:400!important;text-decoration:none!important;border:0;padding:0}
.site-nav .nav-link.active{font-weight:600!important;border-bottom:2px solid #333!important;padding-bottom:5px!important}
.site-nav .nav-cta{border:1px solid #333!important;padding:9px 16px!important}

.intro{padding:105px 0 95px}
.references-title{font-family:Georgia,"Times New Roman",serif!important;font-size:clamp(50px,6.4vw,78px)!important;line-height:1.03!important;font-weight:400!important;letter-spacing:-.035em!important;margin:0}
.references-title em{font-weight:400}
.lead{font-size:19px!important;line-height:1.65;max-width:820px;color:#555;margin:32px 0 0}

.experience-band{background:#eeeae0;padding:78px 0 82px}
.experience-inner{display:grid;grid-template-columns:.9fr 1.1fr;gap:100px;align-items:start}
.experience-inner h2,.section-heading h2,.dark-heading h2,.companies-heading h2,.closing-text h2{font-family:Georgia,"Times New Roman",serif;font-weight:400;line-height:1.08;margin:0;letter-spacing:-.02em}
.experience-inner h2{font-size:47px}
.experience-text{max-width:650px;font-size:17px;color:#4e4e49}
.experience-text p{margin:0 0 18px}
.experience-text p:last-child{margin-bottom:0}

.references{padding:110px 0 120px}
.section-heading{margin-bottom:58px;max-width:700px}
.section-heading h2{font-size:48px}
.institution-list{border-top:1px solid var(--line)}
.institution-group{padding:38px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:280px 1fr;gap:55px}
.institution-group h3{font-size:13px;text-transform:uppercase;letter-spacing:.1em;font-weight:600;margin:2px 0 0;color:#3e3e3b}
.institution-group p{margin:0;font-size:16px;line-height:1.8;color:#55554f}

.dark-section{background:#202426;color:#f7f5ee;padding:105px 0 112px}
.dark-heading{max-width:760px;margin-bottom:60px}
.dark-heading h2{font-size:52px}
.dark-heading h2 em{font-weight:400}
.association-list{border-top:1px solid rgba(255,255,255,.2);padding-top:38px;max-width:1000px}
.association-list p{margin:0;font-size:16px;line-height:1.9;color:#dedcd5}

.companies{padding:110px 0 115px}
.companies-heading{max-width:800px;margin-bottom:58px}
.companies-heading h2{font-size:43px}
.company-list{border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr)}
.company-list span{padding:21px 18px 21px 0;border-bottom:1px solid var(--line);font-size:15px;color:#4f4f4b}

.closing{display:grid;grid-template-columns:1fr 1fr;margin-bottom:120px;min-height:430px}
.closing-image img{width:100%;height:100%;min-height:430px;object-fit:cover;display:block}
.closing-text{background:#263746;color:#f7f5ee;padding:65px;display:flex;flex-direction:column;justify-content:center}
.closing-text h2{font-size:42px;margin-bottom:25px}
.closing-text p:not(.eyebrow){color:#dedcd5;font-size:17px;max-width:520px;margin:0 0 30px}
.button{display:inline-block;align-self:flex-start;background:#f7f5ee;color:#262626;text-decoration:none;padding:14px 23px;font-size:13px}

.site-footer{width:100%;box-sizing:border-box;background:#171918;color:rgba(255,255,255,.7);padding:35px 0;font-size:13px;border:0}
.site-footer .footer-inner{width:min(1080px,88vw);margin:0 auto;display:flex;justify-content:space-between;gap:30px}
.site-footer strong{display:inline;color:#fff;font-family:Georgia,"Times New Roman",serif;font-size:16px;font-weight:400}
.site-footer span{color:rgba(255,255,255,.7)}

@media(max-width:850px){
  .site-header{height:auto!important;min-height:0;padding:20px 0!important}
  .site-header-inner{width:min(100% - 36px,700px);height:auto;display:block}
  .site-header .brand{margin-bottom:18px!important}
  .site-nav{justify-content:flex-start;gap:15px!important;flex-wrap:wrap}
  .wrap{width:min(100% - 36px,700px)}
  .intro{padding:75px 0 65px}
  .references-title{font-size:47px!important}
  .lead{font-size:18px!important}
  .experience-band{padding:65px 0}
  .experience-inner{grid-template-columns:1fr;gap:35px}
  .experience-inner h2{font-size:40px}
  .experience-text{font-size:16px}
  .references{padding:75px 0 85px}
  .section-heading{margin-bottom:42px}
  .section-heading h2{font-size:40px}
  .institution-group{grid-template-columns:1fr;gap:17px;padding:30px 0}
  .institution-group p{font-size:15px;line-height:1.8}
  .dark-section{padding:75px 0 82px}
  .dark-heading{margin-bottom:42px}
  .dark-heading h2{font-size:42px}
  .association-list p{font-size:15px;line-height:1.85}
  .companies{padding:75px 0 85px}
  .companies-heading{margin-bottom:42px}
  .companies-heading h2{font-size:36px}
  .company-list{grid-template-columns:1fr}
  .company-list span{padding:17px 0}
  .closing{grid-template-columns:1fr;margin-bottom:85px}
  .closing-image img{min-height:300px}
  .closing-text{padding:48px 38px}
  .closing-text h2{font-size:36px}
  .site-footer .footer-inner{display:block}
  .site-footer .footer-inner>div+div{margin-top:12px}
}

/* V35 — retour de la deuxième photo et du chapitre « Ils étaient là » */
.visual-break{background:#202426;padding:80px 0}.visual-grid{width:min(1160px,calc(100% - 56px));margin:auto;display:grid;grid-template-columns:1.25fr .75fr;min-height:480px}.visual-grid img{width:100%;height:100%;min-height:480px;object-fit:cover;display:block}.visual-caption{background:#263746;color:#f7f5ee;padding:70px;display:flex;flex-direction:column;justify-content:center}.visual-caption .eyebrow{color:#d2b56d}.visual-caption h2{font-family:Georgia,"Times New Roman",serif;font-size:44px;line-height:1.1;font-weight:500;margin:0}
.testimonial-intro{background:#eeeae0;padding:100px 0}.testimonial-intro h2{font-family:Georgia,"Times New Roman",serif;font-size:39px;line-height:1.17;font-weight:500;margin:0}.testimonials{padding:105px 0 120px}.testimonial{border-top:1px solid #deddd7;padding-top:25px}.testimonial blockquote{font-family:Georgia,"Times New Roman",serif;font-size:25px;line-height:1.28;margin:0 0 18px;font-weight:500}.testimonial cite{font-style:normal;text-transform:uppercase;letter-spacing:.14em;font-size:10px;color:#b08b43;font-weight:600}.featured{max-width:900px;margin-bottom:72px}.featured blockquote{font-size:39px}.second{margin-left:auto}.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:45px}.testimonial-grid .testimonial blockquote{font-size:23px}
@media(max-width:850px){.visual-grid{grid-template-columns:1fr}.visual-grid img{min-height:330px}.visual-caption{padding:50px 38px}.testimonial-intro{padding:75px 0}.testimonial-intro h2{font-size:31px}.testimonials{padding:75px 0 85px}.featured blockquote{font-size:31px}.second{margin-left:0}.testimonial-grid{grid-template-columns:1fr;gap:55px}}



/* Identité visuelle — logo officiel Verre et Vitrail */
.site-header .brand {
  display: block;
  flex: 0 0 190px;
  width: 190px;
  line-height: 0;
}
.site-header .brand img {
  display: block;
  width: 190px;
  max-width: 100%;
  height: auto;
}
@media (min-width: 851px) {
  .site-header {
    height: 108px !important;
    min-height: 108px;
  }
}
@media (max-width: 850px) {
  .site-header .brand {
    width: 190px;
    max-width: 100%;
    margin-bottom: 18px !important;
  }
}

/* Correction ciblée : bandeau compact sur téléphone en mode paysage */
@media (orientation: landscape) and (max-height: 500px) and (max-width: 850px) {
  .site-header {
    height: 64px !important;
    min-height: 64px !important;
    padding: 0 !important;
  }
  .site-header-inner {
    width: calc(100% - 28px) !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
  }
  .site-header .brand {
    flex: 0 0 125px !important;
    width: 125px !important;
    max-width: 125px !important;
    margin: 0 !important;
  }
  .site-header .brand img {
    width: 125px !important;
    max-width: 125px !important;
    height: auto !important;
  }
  .site-header .site-nav {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
  }
  .site-header .site-nav .nav-link,
  .site-header .site-nav .nav-cta {
    white-space: nowrap !important;
    font-size: 11px !important;
  }
  .site-header .site-nav .nav-cta {
    padding: 6px 8px !important;
  }
}