/* ============================================================
   AGENCE AUGUSTIN — React fidelity layer
   Reference: final React pages. Loaded after every theme stylesheet.
   ============================================================ */

:root{
  --aa-header-height:72px;
  --aa-container-max:1440px;
  --aa-container-x:clamp(1.5rem,5vw,5rem);
  --aa-section-y:clamp(5.5rem,10vw,10rem);
  --aa-section-y-compact:clamp(4rem,7vw,7rem);
  --aa-grid-gap:clamp(2rem,4vw,4rem);
}

body{font-size:15px;line-height:1.85;letter-spacing:.01em;font-weight:300}
.container,.aa-container,.aa-container-wide{width:100%;max-width:var(--aa-container-max);margin-inline:auto;padding-inline:var(--aa-container-x)}
.section,.aa-section{padding-block:var(--aa-section-y)}

/* Header — exact 72px React behaviour. Transparent only Home/About/Kids. */
.site-header{position:fixed;inset:0 0 auto;z-index:50;height:72px;transition:background-color .5s ease,box-shadow .5s ease,color .5s ease}
.site-header__inner{height:100%;display:flex;align-items:center;justify-content:space-between}
.site-header__logo{display:block;width:110px;flex:0 0 auto;transition:opacity .3s ease}
.site-header__logo:hover{opacity:.75}
.site-header__navigation{margin-left:auto}
.site-header__menu{display:flex;align-items:center;gap:2rem;margin:0;padding:0;list-style:none}
.site-header__menu>li>a{font-size:.78rem;line-height:1;letter-spacing:.16em;text-transform:uppercase;font-weight:400}
.site-header--solid,.site-header.is-scrolled{background:var(--aa-lin);box-shadow:0 1px 0 rgba(60,42,30,.1);color:var(--aa-brun)}
.site-header--transparent:not(.is-scrolled){background:transparent;box-shadow:none;color:var(--aa-lin)}
.site-header--transparent:not(.is-scrolled) .site-header__logo-image--dark{opacity:0}
.site-header--transparent:not(.is-scrolled) .site-header__logo-image--light{opacity:1}
.site-header--solid .site-header__logo-image--dark,.site-header.is-scrolled .site-header__logo-image--dark{opacity:1}
.site-header--solid .site-header__logo-image--light,.site-header.is-scrolled .site-header__logo-image--light{opacity:0}
@media(min-width:768px){.site-header__logo{width:120px}}

/* Hero home */
.hero--home{height:100vh;min-height:680px;margin:0;color:var(--aa-lin)}
.hero--home .hero__overlay{background:linear-gradient(90deg,rgba(60,42,30,.68) 0%,rgba(60,42,30,.34) 48%,rgba(60,42,30,.08) 100%)}
.hero--home .hero__content{position:absolute;inset:0;display:flex;align-items:flex-end;padding:0 var(--aa-container-x) clamp(4rem,5.7vw,5.5rem)}
.hero--home .hero__content-inner{max-width:820px}
.hero--home .hero__title{margin:0;color:var(--aa-lin);font-size:clamp(2.65rem,6.15vw,5.8rem);line-height:.92;letter-spacing:.03em;text-align:left}
.hero--home .hero__subtitle{margin-top:1.75rem;color:var(--aa-lin);font-size:clamp(1.05rem,1.55vw,1.42rem);line-height:1.55;opacity:.88;text-align:left}
@media(min-width:768px){.hero--home .hero__subtitle{white-space:nowrap}}

/* Image hero — React About and Kids are lower-left, never right aligned. */
.hero--image{height:92vh;min-height:680px;margin:0;color:var(--aa-lin);display:flex;align-items:flex-end}
.hero--image .hero__overlay{background:linear-gradient(90deg,rgba(60,42,30,.58) 0%,rgba(60,42,30,.24) 52%,rgba(60,42,30,.12) 100%)}
.hero--image .hero__content{position:relative;z-index:2;width:100%;height:auto;display:block;padding:0 var(--aa-container-x) clamp(5rem,8vw,7rem)}
.hero--image .hero__content-inner{max-width:760px;margin:0;text-align:left}
.hero--image .hero__title{margin:0;color:var(--aa-lin);font-size:clamp(2.8rem,6vw,5.8rem);line-height:.94;letter-spacing:.03em;text-align:left}
.hero--image .hero__subtitle{margin-top:1.75rem;color:var(--aa-lin);font-size:clamp(.98rem,1.25vw,1.12rem);line-height:1.82;max-width:55ch;text-align:left}
.hero--image .hero__caption{display:none}

/* Solid Hero variants are centralized in assets/css/hero.css. */

/* Contact — exact split layout from React Contact.tsx. */
.aa-page--contact .hero{display:none!important}
.aa-page--contact main,
.aa-page--contact .site-main{
  margin-top:0!important;
  padding-top:72px!important;
}

.aa-page--contact .site-footer{
  margin-top:0;
}

.contact-minimal{
  --contact-title:var(--aa-brun);
  --contact-copy:var(--aa-ardoise);
  --contact-label:var(--aa-ardoise);
  --contact-accent:var(--aa-or);
  --contact-body:"DM Sans",sans-serif;
  min-height:calc(100vh - 72px);
  padding:0;
}

.contact-minimal:is(.theme-brun,.theme-ardoise,.theme-nuit){
  --contact-title:var(--aa-lin);
  --contact-copy:var(--aa-lin);
  --contact-label:var(--aa-or-pale);
  --contact-accent:var(--aa-or-pale);
}

.contact-minimal__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  grid-template-areas:"content media";
  min-height:calc(100vh - 72px);
}

.contact-minimal--image-left .contact-minimal__grid{
  grid-template-areas:"media content";
}

.contact-minimal--no-image .contact-minimal__grid{
  grid-template-columns:1fr;
  grid-template-areas:"content";
}

.contact-minimal__content{
  grid-area:content;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  padding:6rem 2rem;
}

.contact-minimal--no-image .contact-minimal__content{
  width:100%;
  max-width:48rem;
  margin-inline:auto;
}

.contact-minimal__intro{
  margin:0 0 2rem;
  color:var(--contact-accent)!important;
  font-family:var(--aa-font-display);
  font-size:.75rem;
  font-weight:300;
  line-height:1.4;
  letter-spacing:.2em;
  text-transform:uppercase;
}

.contact-minimal__title{
  margin:0 0 2.5rem;
  color:var(--contact-title)!important;
  font-family:var(--aa-font-display);
  font-size:clamp(2.5rem,4vw,3.5rem);
  font-weight:300;
  line-height:1.05;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.contact-minimal__subtitle{
  max-width:36ch;
  margin:-1.25rem 0 2.5rem;
  color:var(--contact-copy)!important;
  font-family:var(--contact-body);
  font-size:.88rem;
  font-weight:300;
  line-height:1.7;
}

.contact-minimal__rule{
  display:block;
  width:3rem;
  height:1px;
  margin:0 0 2.5rem;
  background:var(--contact-accent);
}

.contact-minimal__details{
  display:flex;
  flex-direction:column;
  gap:1.25rem;
}

.contact-minimal__detail{
  min-width:0;
}

.contact-minimal__label{
  margin:0 0 .25rem;
  color:var(--contact-label)!important;
  font-family:var(--contact-body);
  font-size:.68rem;
  font-weight:300;
  line-height:1.4;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.contact-minimal__email{
  display:inline-block;
  width:max-content;
  max-width:100%;
  padding-bottom:2px;
  border-bottom:1px solid var(--contact-accent);
  color:var(--contact-title)!important;
  font-family:var(--contact-body);
  font-size:.95rem;
  font-weight:300;
  line-height:1.5;
  overflow-wrap:anywhere;
  transition:opacity .25s ease;
}

.contact-minimal__email:hover{
  opacity:.6;
}

.contact-minimal__location{
  margin:0;
  color:var(--contact-title)!important;
  font-family:var(--contact-body);
  font-size:.88rem;
  font-weight:300;
  line-height:1.7;
}

.contact-minimal__message{
  margin-top:3rem;
}

.contact-minimal__text,
.contact-minimal__text p{
  max-width:36ch;
  color:var(--contact-copy)!important;
  font-family:var(--contact-body);
  font-size:.82rem;
  font-weight:300;
  line-height:1.9;
}

.contact-minimal__text p{
  margin:0;
}

.contact-minimal__text p + p{
  margin-top:1rem;
}

.contact-minimal__cta{
  display:inline-block;
  width:max-content;
  margin-top:1.5rem;
  padding-bottom:2px;
  border-bottom:1px solid var(--contact-accent);
  color:var(--contact-title)!important;
  font-family:var(--contact-body);
  font-size:.72rem;
  font-weight:400;
  line-height:1.4;
  letter-spacing:.15em;
  text-transform:uppercase;
  transition:opacity .3s ease;
}

.contact-minimal__cta:hover{
  opacity:.65;
}

.contact-minimal__quote{
  max-width:26ch;
  margin:3.5rem 0 0;
  color:var(--contact-accent)!important;
  font-family:var(--aa-font-display);
  font-size:1rem;
  font-style:italic;
  font-weight:300;
  line-height:1.7;
  letter-spacing:.04em;
  text-transform:none;
}

.contact-minimal__media{
  grid-area:media;
  position:relative;
  min-height:600px;
  overflow:hidden;
}

.contact-minimal__image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

.contact-minimal__overlay{
  position:absolute;
  inset:0;
  background:oklch(0.230 0.020 220 / .2);
  pointer-events:none;
}

@media(min-width:768px){
  .contact-minimal__content{
    padding-inline:4rem;
  }
}

@media(min-width:1024px){
  .contact-minimal__content{
    padding-inline:6rem;
  }
}

@media(max-width:767.98px){
  .contact-minimal__grid,
  .contact-minimal--image-left .contact-minimal__grid{
    grid-template-columns:1fr;
    grid-template-areas:"content";
  }

  .contact-minimal__media{
    display:none;
  }
}

/* Universal image treatment from React */
.editorial__media,.image-banner__media,.founder__portrait,.triptych figure,.project-showcase figure,.journal-card__media,.process-card__image,.timeline-step__media{overflow:hidden;background:var(--aa-or-pale)}
.editorial img,.image-banner img,.founder img,.triptych img,.project-showcase img,.journal-card img,.process-card img,.timeline-step img{transition:transform 1.4s ease;filter:saturate(.9) sepia(.08)}
.editorial img:hover,.image-banner img:hover,.founder img:hover,.triptych img:hover,.project-showcase img:hover,.journal-card img:hover,.process-card img:hover,.timeline-step img:hover{transform:scale(1.035)}

/* Editorial image + text — exact React reference: Expertises intro. */
.editorial{
  --editorial-title:var(--aa-brun);
  --editorial-copy:var(--aa-ardoise);
  --editorial-accent:var(--aa-or);
  padding-block:4rem;
  overflow:hidden;
}
.editorial:is(.theme-brun,.theme-ardoise,.theme-nuit){
  --editorial-title:var(--aa-lin);
  --editorial-copy:var(--aa-lin);
  --editorial-accent:var(--aa-or-pale);
}
.editorial__grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:3.5rem;
  row-gap:2.5rem;
  align-items:center;
}
.editorial__content{
  grid-column:8/span 5;
  min-width:0;
  overflow:visible;
}
.editorial__content-inner{
  width:100%;
  max-width:none;
  margin-right:auto;
  overflow:visible;
}
.editorial__media{
  grid-column:1/span 6;
  aspect-ratio:5/4;
  min-width:0;
  overflow:hidden;
  background:var(--aa-or-pale);
}
.editorial--right .editorial__content{
  grid-column:1/span 5;
}
.editorial--right .editorial__content-inner{
  margin-left:auto;
  margin-right:0;
}
.editorial--right .editorial__media{
  grid-column:7/span 6;
}
.editorial__image{
  width:100%;
  height:100%;
  object-fit:cover;
}
.editorial__kicker{
  margin:0 0 1rem;
  color:var(--editorial-accent)!important;
}
.editorial__title{
  margin:0;
  color:var(--editorial-title)!important;
  font-size:clamp(1.85rem,3.5vw,3rem)!important;
  font-weight:300;
  line-height:1.08!important;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.editorial__text{
  margin-top:1.75rem;
  width:100%;
  max-width:none;
  overflow:visible;
}
.editorial__text p{
  margin:0;
  width:max-content;
  max-width:none!important;
  color:var(--editorial-copy)!important;
  font-size:clamp(.98rem,1.08vw,1.06rem)!important;
  line-height:1.9!important;
}
.editorial:is(.theme-brun,.theme-ardoise,.theme-nuit) .editorial__text p:first-child{
  opacity:.72;
}
.editorial__text p + p{
  margin-top:1.5rem;
  color:var(--editorial-accent)!important;
  opacity:1!important;
}
.editorial__cta{
  margin-top:2rem;
}
@media(min-width:48rem){
  .editorial{padding-block:6rem}
}
@media(max-width:47.999rem){
  .editorial__grid{column-gap:0;row-gap:2.5rem}
  .editorial__media{width:100%}
}

/* Centered text sections are compact in React, not full-screen empty blocks. */
.text-centered{padding-block:clamp(3.5rem,6vw,5rem)}
.text-centered__inner{text-align:center;margin-inline:auto}
.text-centered h2{font-size:clamp(2.35rem,4.6vw,4.45rem);line-height:.98;letter-spacing:.03em;max-width:18ch;margin-inline:auto}
.text-centered__content{margin-top:1.4rem;font-size:clamp(.98rem,1.08vw,1.06rem);line-height:1.85;color:var(--aa-ardoise)}

/* Home process: 3 x 2 React grid on slate. */
.process-home{padding-block:clamp(4rem,7vw,6rem)}
.process-home .section-heading{text-align:center;max-width:720px;margin:0 auto clamp(2.5rem,5vw,4rem)}
.process-home__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(2rem,4vw,4rem)}
.process-card{border-top:1px solid rgba(243,230,212,.38);padding-top:1.15rem}
.process-card__image{width:100%;height:clamp(138px,15vw,190px);object-fit:cover;margin-bottom:1.35rem}
.process-card h3{font-size:clamp(1.45rem,2vw,1.95rem);line-height:1.05;letter-spacing:.045em}
.process-card p{font-size:.95rem;line-height:1.75}

/* Process Timeline — exact React composition from the Espace enfant page. */
.process-timeline{
  padding-top:2.5rem;
  padding-bottom:1.5rem;
}
/* The React Espace enfant Process uses this exact warm white, independently
 * from the shared WordPress "Blanc cassé" token used by other components. */
.process-timeline.theme-white{background:#F8F3EA}
.process-timeline__heading-container{margin-bottom:2rem}
.process-timeline__heading{
  width:100%;
  max-width:620px;
  margin:0 auto;
  text-align:center;
}
.process-timeline__kicker{
  margin:0 0 .8rem;
  text-align:center;
}
.process-timeline__title{
  margin:0;
  text-align:center;
}
.process-timeline__subtitle{
  width:max-content;
  max-width:none;
  margin:1rem auto 0;
  color:var(--aa-ardoise);
  font-size:.84rem;
  line-height:1.75;
  text-align:center;
  white-space:nowrap;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}
.process-timeline__cta{
  text-align:center;
}
.process-timeline__cta--heading{margin-top:1.5rem}
.process-timeline__cta--end{margin-top:1.5rem}
.process-timeline__cta .cta-link{margin-inline:auto}
.process-timeline__list{
  position:relative;
  width:100%;
  margin:0;
}
.process-timeline__list::before{
  content:none!important;
  display:none!important;
}
.process-timeline__line{
  position:absolute;
  left:50%;
  top:0;
  bottom:0;
  width:4px;
  transform:translateX(-50%);
  pointer-events:none;
  background:linear-gradient(180deg,rgba(165,124,50,0),rgba(165,124,50,.58),rgba(120,135,142,.38),rgba(165,124,50,.58),rgba(165,124,50,0));
}
.process-timeline__steps{
  display:flex;
  flex-direction:column;
  gap:1.75rem;
}
.timeline-step{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:1.5rem;
  align-items:center;
  padding:0;
}
.timeline-step__media{
  grid-column:7/span 6;
  aspect-ratio:18/9;
  width:100%;
  margin:0;
  overflow:hidden;
  background:var(--aa-or-pale);
}
.timeline-step--image-left .timeline-step__media{grid-column:1/span 6}
.timeline-step__image{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.timeline-step__content{
  grid-column:2/span 4;
  grid-row:1;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  padding:0;
  text-align:right;
}
.timeline-step--image-left .timeline-step__content{
  grid-column:8/span 4;
  align-items:flex-start;
  text-align:left;
}
.timeline-step__number{
  margin:0 0 .75rem;
  color:var(--aa-or);
  background:transparent;
  font-family:var(--aa-font-display);
  font-size:clamp(2.1rem,3.4vw,3.5rem);
  font-weight:300;
  line-height:1;
}
.timeline-step__title{
  width:max-content;
  max-width:none;
  margin:0 0 .75rem;
  color:var(--aa-brun);
  font-size:clamp(1.35rem,2vw,1.9rem);
  line-height:1.08;
  white-space:nowrap;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}
.timeline-step__text{
  width:max-content;
  max-width:none;
  margin:0;
  color:var(--aa-ardoise);
  font-size:.82rem;
  line-height:1.65;
  white-space:nowrap;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}
.process-timeline:is(.theme-brun,.theme-ardoise,.theme-nuit) .process-timeline__subtitle,
.process-timeline:is(.theme-brun,.theme-ardoise,.theme-nuit) .timeline-step__text{color:var(--aa-or-pale)}
.process-timeline:is(.theme-brun,.theme-ardoise,.theme-nuit) .timeline-step__title{color:var(--aa-lin)}
.process-timeline:is(.theme-brun,.theme-ardoise,.theme-nuit) .timeline-step__number{color:var(--aa-or-pale)}
.process-timeline:is(.theme-brun,.theme-ardoise,.theme-nuit) .process-timeline__cta .cta-link{color:var(--aa-lin)}
@media(min-width:768px){
  .process-timeline{
    padding-top:3.5rem;
    padding-bottom:2rem;
  }
  .process-timeline__heading-container{margin-bottom:2.5rem}
  .process-timeline__steps{gap:2.25rem}
  .timeline-step{gap:2.5rem}
}

/* About founders: edge-to-edge 12-col rows with centered name overlay. */
.founder{position:relative;padding-block:clamp(3.5rem,6vw,5rem);overflow:hidden}
.founder__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(3rem,5vw,5rem);align-items:center}
.founder__portrait{grid-column:span 6;position:relative;aspect-ratio:4/3}
.founder__image{width:100%;height:100%;object-fit:cover}
.founder__content{grid-column:8/span 4;color:var(--aa-ardoise)}
.founder--right .founder__portrait{grid-column:7/span 6;order:2}
.founder--right .founder__content{grid-column:2/span 4;order:1}
.founder__name{position:absolute;left:50%;top:-2.2rem;transform:translateX(-50%);z-index:3;white-space:nowrap;color:var(--aa-or);font-family:var(--aa-font-body);font-size:clamp(.92rem,1.35vw,1.14rem);font-weight:500;letter-spacing:.24em}
.founder blockquote{margin:2rem 0 0;font-family:var(--aa-font-display);font-style:italic;color:var(--aa-or);font-size:clamp(1.4rem,2vw,2rem)}
.founder__cta{margin-top:2rem}
.founder__cta .cta-link{color:var(--aa-section-title)}

/* Triptychs */
.triptych{padding-block:clamp(4rem,7vw,6rem)}
.triptych__head{text-align:center;max-width:720px;margin:0 auto clamp(2.5rem,4vw,3.5rem)}
.triptych__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.triptych--attached .triptych__grid{gap:0}.triptych--spaced .triptych__grid{gap:clamp(1rem,2vw,2rem)}
.triptych figure{height:clamp(320px,36vw,520px);margin:0}.triptych__image{width:100%;height:100%;object-fit:cover}


/* CTA final: React 12-column slate composition. */
.cta-banner{padding-block:clamp(4rem,7vw,6rem)}
.cta-banner__inner{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:2.5rem;align-items:center;text-align:left}
.cta-banner__inner>div{grid-column:span 6}.cta-banner__inner>a{grid-column:8/span 5;justify-self:start}
.cta-banner h2{font-size:clamp(2.35rem,4.6vw,4.45rem);line-height:1.08;letter-spacing:.03em}

/* Journal cards — editorial list, not generic 3-card grid. */
.journal-list{padding-block:clamp(4rem,7vw,6rem)}
.journal-list .journal-grid{display:flex;flex-direction:column;gap:0}
.journal-list .journal-card{display:grid;grid-template-columns:2fr 3fr 5fr;gap:clamp(2rem,4vw,4rem);align-items:start;padding-block:clamp(2.5rem,4vw,4rem);border-bottom:1px solid rgba(60,42,30,.12)}
.journal-list .journal-card>a{display:contents}
.journal-list .journal-card__media{grid-column:2;aspect-ratio:4/3}.journal-list .journal-card__media img{width:100%;height:100%;object-fit:cover}
.journal-list .journal-card h3,.journal-list .journal-card>p,.journal-list .journal-card .cta-link{grid-column:3}

@media(max-width:767px){
 .site-header__navigation{position:fixed;inset:0;background:var(--aa-lin);padding:7rem 1.5rem 3rem;display:none}.menu-open .site-header__navigation{display:block}
 .site-header__menu{flex-direction:column;align-items:center;gap:2rem}.site-header__menu>li>a{font-size:1rem}
 .hero--image{height:92vh}.hero--image .hero__content{padding-bottom:5rem}.hero--image .hero__title{font-size:clamp(2.65rem,13vw,4.2rem)}
 .editorial__grid,.cta-banner__inner,.founder__grid{grid-template-columns:1fr}
 .editorial__content,.editorial__media,.editorial--right .editorial__content,.editorial--right .editorial__media,.cta-banner__inner>div,.cta-banner__inner>a,.founder__portrait,.founder__content,.founder--right .founder__portrait,.founder--right .founder__content{grid-column:1}
 .editorial--right .editorial__content{order:1}.editorial--right .editorial__media{order:2}
 .editorial--left .editorial__media{order:1}.editorial--left .editorial__content{order:2}
 .editorial__content-inner,.editorial--right .editorial__content-inner{max-width:none;margin-inline:0}
 .process-home__grid{grid-template-columns:1fr}
 .process-timeline__line{display:none}
 .process-timeline__steps{gap:1.75rem}
 .timeline-step{grid-template-columns:1fr;gap:1.5rem}
 .timeline-step__media,.timeline-step--image-left .timeline-step__media{grid-column:1;grid-row:1}
 .timeline-step__content,.timeline-step--image-left .timeline-step__content{grid-column:1;grid-row:2;align-items:flex-start;padding-inline:1.5rem;text-align:left}
 .timeline-step--image-right .timeline-step__title,.timeline-step--image-right .timeline-step__text{margin-left:0}
 .triptych__grid{grid-template-columns:1fr}.triptych figure{height:420px}

 .contact-minimal__grid{grid-template-columns:1fr}.contact-minimal__grid>div:last-child{display:none}
 .journal-list .journal-card{grid-template-columns:1fr}.journal-list .journal-card__media,.journal-list .journal-card h3,.journal-list .journal-card>p,.journal-list .journal-card .cta-link{grid-column:1}
}

/* ============================================================
   V4 — Exact React hero geometry and typographic wrapping
   ============================================================ */

/* Prevent WordPress paragraph wrappers from changing React spacing. */
.hero__subtitle > :first-child{margin-top:0}
.hero__subtitle > :last-child{margin-bottom:0}
.hero__title{overflow-wrap:normal;word-break:normal;hyphens:none}

/* Home: h-screen / min-h-[680px], pb-16 md:pb-22. */
.aa-page--home .hero--home{
  height:100svh;
  min-height:680px;
}
.aa-page--home .hero--home .hero__content{
  padding-top:72px;
  padding-bottom:4rem;
}
.aa-page--home .hero--home .hero__content-inner{max-width:820px}
.aa-page--home .hero--home .hero__title{max-width:8.4ch}
.aa-page--home .hero--home .hero__subtitle{max-width:none;margin-top:1.75rem}

/* About and Kids: min-h-[92vh], pb-20 md:pb-28. */
.aa-page--about .hero--image,
.aa-page--kids .hero--image{
  height:auto;
  min-height:92svh;
}
.aa-page--about .hero--image .hero__content,
.aa-page--kids .hero--image .hero__content{
  padding-top:calc(72px + 3rem);
  padding-bottom:5rem;
}
.aa-page--about .hero--image .hero__content-inner,
.aa-page--kids .hero--image .hero__content-inner{
  max-width:720px;
  margin:0;
  text-align:left;
}
.aa-page--about .hero--image .hero__title,
.aa-page--kids .hero--image .hero__title{
  font-size:clamp(3.5rem,8vw,7rem);
  line-height:.92;
  letter-spacing:.02em;
}
.aa-page--about .hero--image .hero__title{max-width:7.5ch}
.aa-page--about .hero--image .hero__subtitle{
  max-width:36ch;
  margin-top:1.75rem;
  font-size:clamp(1.08rem,1.75vw,1.35rem);
  line-height:1.7;
  opacity:.84;
}
.aa-page--kids .hero--image .hero__subtitle{
  max-width:36ch;
  margin-top:2rem;
  font-size:.9rem;
  line-height:1.95;
  opacity:.85;
}
.aa-page--about .hero--image .hero__image{object-position:center top}

/* Minimal, Signature, Journal and Expertise Heroes are now styled exclusively in hero.css. */

@media(min-width:768px){
  .aa-page--home .hero--home .hero__content{padding-bottom:5.5rem}
  .aa-page--about .hero--image .hero__content,
  .aa-page--kids .hero--image .hero__content{padding-bottom:7rem}
}

@media(max-width:767px){
  .aa-page--home .hero--home .hero__title{max-width:8.4ch}
  .aa-page--home .hero--home .hero__subtitle{white-space:normal;max-width:32ch}
  .aa-page--about .hero--image .hero__content,
  .aa-page--kids .hero--image .hero__content{padding-bottom:5rem}
}


/* ============================================================
   V6 — Home page exact React layout and editable triptych cards
   ============================================================ */

/* React CTA: text, breathing room, then a thin gold rule. */
.cta-link,
a.cta-link,
.cta-link--light,
a.cta-link--light{
  position:relative;
  display:inline-block;
  width:max-content;
  padding:0 0 .5rem;
  border:0!important;
  background:transparent!important;
  font-size:.78rem;
  font-weight:400;
  line-height:1.35;
  letter-spacing:.15em;
  text-transform:uppercase;
  text-decoration:none;
}
.cta-link::after,
a.cta-link::after,
.cta-link--light::after,
a.cta-link--light::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:1px;
  background:var(--aa-or);
  transform-origin:left center;
  transition:transform .35s ease;
}
.cta-link:hover::after,
a.cta-link:hover::after{transform:scaleX(.68)}

/* Home hero: React uses explicit three-line title, with no CSS-induced fourth line. */
.aa-page--home .hero--home .hero__content-inner{max-width:820px}
.aa-page--home .hero--home .hero__title{
  width:max-content;
  max-width:none;
  white-space:nowrap;
}

/* Centered introduction: preserve the React 54ch measure and prevent inherited paragraph caps. */
.text-centered__inner{max-width:820px}
.text-centered__content,
.text-centered__content p{
  width:100%;
  max-width:54ch!important;
  margin-left:auto;
  margin-right:auto;
}

/* Process Home: exact React 3 x 2 rhythm and thumbnail dimensions. */
.process-home{padding-block:clamp(2.5rem,3.7vw,3.5rem)}
.process-home .section-heading{
  max-width:780px;
  margin-bottom:clamp(2.25rem,3vw,2.75rem);
}
.process-home__grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:2rem;
  row-gap:2.25rem;
}
.process-home .process-card__image{
  display:block;
  width:100%;
  height:clamp(138px,15vw,190px);
  margin-bottom:1.25rem;
  object-fit:cover;
}

/* Spaced triptych = React Sur mesure / Univers cards. */
.triptych--spaced{padding-block:clamp(2.5rem,3.7vw,3.5rem)}
.triptych--spaced .triptych__head{
  max-width:820px;
  margin:0 auto clamp(2rem,3vw,2.5rem);
  text-align:center;
}
.triptych--spaced .triptych__head h2{
  font-size:clamp(2.35rem,4.6vw,4.45rem);
  line-height:.98;
  letter-spacing:.03em;
  text-transform:uppercase;
}
.triptych--spaced .triptych__intro,
.triptych--spaced .triptych__intro p{
  max-width:56ch;
  margin:1.25rem auto 0;
  text-align:center;
}
.triptych--spaced .triptych__grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(1.25rem,1.7vw,1.5rem);
}
.triptych--spaced .triptych-card__media{
  margin:0;
  aspect-ratio:4/5;
  overflow:hidden;
}
.triptych--spaced .triptych__image,
.triptych--spaced .triptych__grid figure:nth-child(2) .triptych__image{
  width:100%;
  height:100%;
  object-fit:cover;
}
.triptych-card__content{padding-top:1.25rem}
.triptych-card__content h3{
  margin:0 0 .75rem;
  font-size:clamp(1.45rem,2vw,1.95rem);
  line-height:1.05;
  letter-spacing:.045em;
  text-transform:uppercase;
}
.triptych-card__content p{
  max-width:32ch;
  margin:0;
  color:var(--aa-ardoise);
  font-size:.95rem;
  line-height:1.75;
}
.triptych--spaced .triptych-card__rule{
  display:block;
  width:42px;
  height:1px;
  margin:0 0 1.25rem;
  background:var(--aa-or);
}
.triptych__cta{
  display:flex;
  justify-content:center;
  margin-top:clamp(2.25rem,3vw,2.75rem);
  text-align:center;
}

/* Final CTA banner: title left, subtitle and CTA together on the right. */
.cta-banner__inner{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:clamp(2rem,4vw,4rem);
  align-items:center;
  text-align:left;
}
.cta-banner__heading{grid-column:span 6}
.cta-banner__content{grid-column:8/span 5}
.cta-banner__heading h2{
  max-width:11ch;
  margin:0;
  font-size:clamp(2.35rem,4.6vw,4.45rem);
  line-height:.98;
  letter-spacing:.03em;
  text-transform:uppercase;
}
.cta-banner__content .aa-rich-text,
.cta-banner__content .aa-rich-text p{
  max-width:40ch;
  font-size:clamp(.98rem,1.1vw,1.08rem);
  line-height:1.85;
}
.cta-banner__content .cta-link{margin-top:2rem}

@media(max-width:767px){
  .aa-page--home .hero--home .hero__title{width:auto;white-space:normal}
  .process-home__grid,
  .triptych--spaced .triptych__grid{grid-template-columns:1fr}
  .cta-banner__inner{grid-template-columns:1fr}
  .cta-banner__heading,.cta-banner__content{grid-column:1}
}

/* ============================================================
   V7 — Home section scale, exact card ratios and theme-aware text
   ============================================================ */

/* Semantic text colours follow the selected section background. */
:is(.section,.aa-section){
  --aa-section-title:var(--aa-brun);
  --aa-section-muted:var(--aa-ardoise);
  --aa-section-kicker:var(--aa-ardoise);
}
:is(.section,.aa-section):is(.theme-brun,.theme-ardoise,.theme-nuit,.aa-bg-brun,.aa-bg-ardoise,.aa-bg-petrole){
  --aa-section-title:var(--aa-lin);
  --aa-section-muted:var(--aa-lin);
  --aa-section-kicker:var(--aa-lin);
}
:is(.section,.aa-section) :is(h1,h2,h3,h4,h5,h6){color:var(--aa-section-title)}
:is(.section,.aa-section) :is(.eyebrow,.aa-kicker,.cta-banner__kicker){color:var(--aa-section-kicker)}
:is(.section,.aa-section) :is(
  .aa-rich-text p,
  .section-heading > p:not(.eyebrow),
  .editorial__text p,
  .triptych__intro p,
  .triptych-card__content p,
  .process-card p,
  .project-showcase__content p,
  .founder__content p,
  .journal-card > p
){color:var(--aa-section-muted)!important}
:is(.section,.aa-section):is(.theme-brun,.theme-ardoise,.theme-nuit,.aa-bg-brun,.aa-bg-ardoise,.aa-bg-petrole) :is(
  .aa-rich-text p,
  .section-heading > p:not(.eyebrow),
  .editorial__text p,
  .triptych__intro p,
  .triptych-card__content p,
  .process-card p,
  .project-showcase__content p,
  .founder__content p,
  .journal-card > p
){opacity:.78}

/* The editorial component owns its foreground hierarchy on every background. */
.editorial .editorial__title{color:var(--editorial-title)!important}
.editorial .editorial__text p{color:var(--editorial-copy)!important;opacity:1}
.editorial:is(.theme-brun,.theme-ardoise,.theme-nuit) .editorial__text p:first-child{opacity:.72}
.editorial .editorial__text p + p{color:var(--editorial-accent)!important;opacity:1!important}
.editorial .editorial__cta .cta-link{color:var(--editorial-title)!important}

/* Home introduction + first editorial block: React py-10/md:py-14 and mb-8/md:mb-10. */
.text-centered{
  padding-top:clamp(2.5rem,3.7vw,3.5rem);
  padding-bottom:clamp(2rem,2.65vw,2.5rem);
}

/* Process Home: remove inherited volume and keep the exact React card rhythm. */
.process-home .container{max-width:var(--aa-container-max)}
.process-home__grid{
  column-gap:2rem;
  row-gap:2.25rem;
}
.process-home .process-card{
  min-width:0;
  padding-top:1.15rem;
}
.process-home .process-card__image{
  width:100%;
  height:clamp(138px,15vw,190px)!important;
  max-height:190px;
  margin:0 0 1.25rem;
  object-fit:cover;
}
.process-home .process-card h3{margin:0 0 .75rem}
.process-home .process-card p{
  max-width:32ch;
  margin:0;
  font-size:.95rem;
  line-height:1.75;
}

/* Spaced triptych: cancel the old generic fixed figure height.
   React cards use a strict 4/5 ratio for all three images. */
.triptych--spaced .triptych__grid figure,
.triptych--spaced .triptych-card__media{
  width:100%;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:4/5;
  margin:0;
}
.triptych--spaced .triptych__image,
.triptych--spaced .triptych__grid figure:nth-child(2) .triptych__image{
  width:100%;
  height:100%!important;
  object-fit:cover;
}
.triptych--spaced .triptych-card__content p{color:var(--aa-section-muted)!important}

/* Final Home CTA: py-10/md:py-14, 12-column React grid, no accidental wrapping. */
.cta-banner--default{padding-block:clamp(2.5rem,3.7vw,3.5rem)}
.cta-banner--default .cta-banner__inner{
  gap:2rem;
  align-items:center;
}
.cta-banner__kicker{
  margin:0 0 1rem;
  font-family:var(--aa-font-body);
  font-size:.78rem;
  font-weight:400;
  line-height:1.4;
  letter-spacing:.22em;
  text-transform:uppercase;
  white-space:nowrap;
  opacity:.62;
}
.cta-banner--default .cta-banner__heading h2{
  width:11ch;
  max-width:11ch;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}
.cta-banner--default .cta-banner__content,
.cta-banner--default .cta-banner__content .aa-rich-text,
.cta-banner--default .cta-banner__content .aa-rich-text p{min-width:0}
.cta-banner--default .cta-banner__content .aa-rich-text p{
  max-width:40ch;
  margin:0;
}
.cta-banner--default .cta-banner__content .cta-link{margin-top:2rem}

@media(max-width:767px){
  .cta-banner__kicker{white-space:normal}
  .cta-banner--default .cta-banner__heading h2{width:auto;max-width:11ch}
}