/* ============================================================
   4 MORE Capital Partners — Shared Design System
   Editorial · bone/cream paper · Spectral + IBM Plex Sans
   petrol-green accents · numbered 01–05 index motif
   Single source of truth for every page. Derived from the
   approved "variant-a" mockup. Keep class names stable.
   ============================================================ */

/* ============ 1. TOKENS ============ */
:root{
  --paper:#F1ECE3;
  --paper-2:#E8E1D4;
  --ink:#1A1A18;
  --ink-soft:#494640;
  --petrol:#0a3639;
  --teal:#426b6e;
  --hair:rgba(10,54,57,.28);
  --hair-soft:rgba(10,54,57,.16);
  --maxw:1320px;
  --gutter:clamp(20px,5vw,76px);
  --serif:'Spectral',Georgia,'Times New Roman',serif;
  --sans:'IBM Plex Sans',system-ui,-apple-system,sans-serif;
}

/* ============ 2. RESET / BASE ============ */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:clamp(16px,1.05vw,18px);
  line-height:1.62;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
::selection{background:var(--petrol);color:var(--paper);}

.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter);width:100%;}

/* paper grain */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;opacity:.8;
}
main,header,footer{position:relative;z-index:1;}

/* ============ 3. LABELS / EYEBROWS ============ */
/* Eyebrow: quiet sentence-case folio caption (not the uppercase-tracked micro-label cliché) */
.label{
  font-family:var(--sans);
  font-size:.82rem;
  font-weight:500;
  letter-spacing:.01em;
  color:var(--teal);
}

/* ============ 4. TOP BAR / NAV ============ */
.topbar{
  position:sticky;top:0;z-index:60;
  background:rgba(241,236,227,.72);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border-bottom:1px solid transparent;
  transition:border-color .35s ease,background .35s ease,box-shadow .35s ease;
}
.topbar.scrolled{
  background:rgba(241,236,227,.92);
  border-bottom:1px solid var(--hair-soft);
  box-shadow:0 1px 0 rgba(10,54,57,.04),0 12px 30px -26px rgba(10,54,57,.5);
}
.topbar__inner{
  display:flex;align-items:center;justify-content:space-between;
  height:74px;gap:24px;
}
.brand{display:flex;align-items:center;gap:14px;color:var(--petrol);}
.brand svg{display:block;}
.brand__tag{
  font-size:.62rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--teal);padding-left:14px;border-left:1px solid var(--hair);
  line-height:1.15;
}
@media (max-width:520px){.brand__tag{display:none;}}

.nav{display:flex;align-items:center;gap:6px;}
.nav a{
  font-size:.82rem;font-weight:500;letter-spacing:.02em;
  padding:12px 14px;border-radius:2px;color:var(--ink-soft);
  position:relative;transition:color .2s ease;
}
.nav a:hover{color:var(--petrol);}
.nav a.active{color:var(--petrol);}
.nav a.active::after{
  content:"";position:absolute;left:14px;right:14px;bottom:2px;height:1px;background:var(--petrol);
}
/* universal focus ring — every link and button, not an allowlist */
a:focus-visible,button:focus-visible{
  outline:2px solid var(--petrol);outline-offset:3px;border-radius:2px;
}
/* over dark surfaces (cover hero, CTA band) the petrol ring is invisible — use paper */
.cover a:focus-visible,.cta a:focus-visible,
html.js body.has-cover .topbar:not(.scrolled) a:focus-visible,
html.js body.has-cover .topbar:not(.scrolled) button:focus-visible{
  outline-color:var(--paper);
}

.menu-btn{
  display:none;align-items:center;justify-content:center;
  width:44px;height:44px;border:1px solid var(--hair);background:transparent;
  border-radius:2px;cursor:pointer;color:var(--petrol);
}
.menu-btn span{display:block;width:20px;height:1.5px;background:currentColor;position:relative;transition:.3s;}
.menu-btn span::before,.menu-btn span::after{content:"";position:absolute;left:0;width:20px;height:1.5px;background:currentColor;transition:.3s;}
.menu-btn span::before{top:-6px;}.menu-btn span::after{top:6px;}
.menu-btn[aria-expanded="true"] span{background:transparent;}
.menu-btn[aria-expanded="true"] span::before{top:0;transform:rotate(45deg);}
.menu-btn[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg);}

.mobile-panel{
  display:none;position:fixed;inset:74px 0 0 0;z-index:55;
  background:var(--paper);padding:var(--gutter);
  flex-direction:column;gap:4px;
  border-top:1px solid var(--hair-soft);
}
.mobile-panel.open{display:flex;animation:fade .3s ease;}
.mobile-panel a{
  font-family:var(--serif);font-size:1.9rem;font-weight:400;color:var(--petrol);
  padding:14px 0;border-bottom:1px solid var(--hair-soft);
}
.mobile-panel a .mp-num{font-family:var(--sans);font-size:.7rem;font-weight:600;letter-spacing:.2em;color:var(--teal);vertical-align:super;margin-right:12px;}

/* Back to 6 nav items with Stories unlinked, so the original breakpoint is
   correct again. If Stories returns to the nav this must go back to 940px:
   the brand plus a 7-item nav measured about 908px wide. */
@media (max-width:760px){
  .nav{display:none;}
  .menu-btn{display:flex;}
}

@keyframes fade{from{opacity:0;}to{opacity:1;}}

/* ============ 5. BUTTONS / LINKS ============ */
/* Editorial button: sentence case, square corners, no sliding-arrow gimmick */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sans);font-size:.9rem;font-weight:600;letter-spacing:.005em;
  padding:13px 22px;border-radius:0;cursor:pointer;transition:.25s ease;
  border:1px solid var(--petrol);
}
.btn .arr{display:none;}
.btn--solid{background:var(--petrol);color:var(--paper);}
.btn--solid:hover{background:#0c4347;}
.btn--line{background:transparent;color:var(--petrol);}
.btn--line:hover{background:var(--petrol);color:var(--paper);}
/* Editorial inline link: sentence case, underline, no arrow */
.link-ar{
  display:inline-flex;align-items:center;gap:8px;
  font-size:.95rem;font-weight:500;letter-spacing:.005em;color:var(--petrol);
  border-bottom:1px solid var(--petrol);padding-bottom:3px;transition:.25s;
}
.link-ar:hover{opacity:.65;}
.link-ar .arr{display:none;}

/* ============ 6. SECTION SCAFFOLD (left-rail numbered index) ============ */
.section{padding-block:clamp(72px,9vw,150px);position:relative;}
.sec-grid{
  display:grid;
  grid-template-columns:[rail] 96px [main] 1fr;
  column-gap:clamp(24px,4vw,72px);
}
.rail{
  grid-column:rail;
  position:relative;
}
.rail__num{
  font-family:var(--serif);
  font-size:clamp(1.4rem,2vw,2rem);
  font-weight:400;
  color:var(--petrol);
  line-height:1;
  font-feature-settings:"tnum";
}
/* short, consistent index tick under each number — not a full-height line
   running through empty space (kept uniform across every section + page) */
.rail__line{
  width:1px;background:var(--hair);margin:18px 0 0 6px;
  height:clamp(40px,5vw,56px);
}
.sec-main{grid-column:main;min-width:0;}
@media (max-width:760px){
  .sec-grid{grid-template-columns:1fr;}
  .rail{display:flex;align-items:baseline;gap:18px;margin-bottom:26px;}
  .rail__line{display:none;}
  .rail::after{content:"";flex:1;height:1px;background:var(--hair-soft);align-self:center;}
  /* the CTA rail is empty (it carries no number) — don't draw its tick rule */
  .rail:empty{display:none;}
}

/* shared section header (lead + eyebrow) */
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:clamp(34px,4vw,60px);}

/* ============ 7. HAIRLINE RULE ============ */
.hair{height:1px;background:var(--hair);border:0;margin:0;}
/* .hair's margin:0 beats .wrap's margin:0 auto (equal specificity, declared
   later), so a combined hr.hair.wrap renders flush left instead of centred.
   Restore centring, and inset by the gutter so the rule aligns with the text
   column (and with .ticker's border-top) rather than overhanging it. */
.hair.wrap{margin-inline:auto;max-width:calc(var(--maxw) - 2 * var(--gutter));}

/* ============ 8. HERO (band container — the old hero__* sub-system was
   retired when the cinematic .cover replaced it; only the base band remains) */
.hero{position:relative;padding-top:clamp(40px,5vw,64px);overflow:hidden;}

/* ============ 9. FOCUS / LEDGER STRIP (ticker) ============
   Quiet ledger: one top hairline, four equal columns, no cell borders —
   symmetry comes from the grid, not from boxes. */
.ticker{border-top:1px solid var(--hair);margin-top:clamp(40px,5vw,80px);padding-top:clamp(22px,2.6vw,34px);}
.ticker__row{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,48px);align-items:start;}
.ticker__cell{display:flex;flex-direction:column;gap:8px;min-width:0;}
.ticker__k{font-family:var(--serif);font-size:clamp(1.25rem,1.7vw,1.65rem);font-weight:400;color:var(--petrol);line-height:1.15;}
.ticker__v{font-size:.74rem;letter-spacing:.06em;color:var(--ink-soft);line-height:1.45;}
@media (max-width:760px){
  .ticker__row{grid-template-columns:1fr 1fr;gap:clamp(18px,4vw,30px);}
}
@media (max-width:430px){
  .ticker__row{grid-template-columns:1fr;}
}

/* ============ 10. LEAD TYPE (large editorial heading) ============ */
.lead{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(1.65rem,3.1vw,2.7rem);line-height:1.1;letter-spacing:-.01em;
  color:var(--ink);margin:0 0 8px;max-width:none;
  text-wrap:balance;
}
.lead em{font-style:italic;color:var(--petrol);}

/* ============ 11. DISCIPLINES (two-up quiet surfaces) ============ */
.disciplines{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,1.6vw,24px);}
.disc{
  padding:clamp(30px,3.4vw,52px) clamp(28px,3vw,52px);
  background:var(--paper-2);
  border-top:3px solid var(--petrol);
}
.disc h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.6rem,2.4vw,2.3rem);line-height:1;color:var(--petrol);margin:0 0 18px;}
.disc p{margin:0 0 26px;color:var(--ink-soft);max-width:42ch;}
@media (max-width:760px){
  .disciplines{grid-template-columns:1fr;}
}

/* ============ 12. PRINCIPLES (four-up bordered grid) ============ */
.principles{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--hair);}
.prin{padding:clamp(26px,2.4vw,40px) clamp(20px,2vw,32px);border-left:1px solid var(--hair-soft);position:relative;}
.prin:first-child{border-left:0;}
.prin__n{font-family:var(--sans);font-size:.66rem;font-weight:600;letter-spacing:.2em;color:var(--teal);}
.prin h3,.prin h4{font-family:var(--serif);font-weight:400;font-size:clamp(1.3rem,1.7vw,1.7rem);color:var(--petrol);margin:22px 0 12px;line-height:1.05;}
.prin p{font-size:.92rem;color:var(--ink-soft);margin:0;line-height:1.55;}
@media (max-width:880px){.principles{grid-template-columns:1fr 1fr;}
  .prin:nth-child(odd){border-left:0;}
  .prin:nth-child(n+3){border-top:1px solid var(--hair-soft);}
}
@media (max-width:480px){.principles{grid-template-columns:1fr;}
  .prin{border-left:0;}
  .prin:nth-child(n+2){border-top:1px solid var(--hair-soft);}
}

/* ============ 13. PORTFOLIO CARDS ============ */
.folio{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2vw,36px);}
.folio__card{position:relative;}
.folio__img{position:relative;overflow:hidden;background:var(--paper-2);aspect-ratio:1/1;}
/* near-natural colour for portfolio (no sepia/grayscale wash); no hover-zoom; caption sits OUTSIDE the image */
.folio__img img{width:100%;height:100%;object-fit:cover;filter:contrast(1.03) saturate(1.02);}
.folio__cap{display:flex;flex-direction:column;gap:6px;padding-top:16px;border-top:1px solid var(--hair);margin-top:16px;}
.folio__cap h4{font-family:var(--serif);font-weight:400;font-size:clamp(1.2rem,1.6vw,1.55rem);color:var(--petrol);margin:0;line-height:1.1;}
.folio__meta{font-family:var(--sans);font-size:.82rem;font-weight:500;letter-spacing:.01em;color:var(--ink-soft);}
/* quality-only proof line (no scale numbers; editorial, not a stats bar) */
.folio__proof{font-family:var(--serif);font-weight:300;font-size:clamp(1.1rem,1.5vw,1.4rem);font-style:italic;color:var(--ink-soft);margin:0 0 clamp(28px,3vw,40px);max-width:42ch;}
.folio__proof strong{font-style:normal;font-weight:400;color:var(--petrol);}
.folio__more{margin:clamp(28px,3vw,44px) 0 0;}
@media (max-width:880px){.folio{grid-template-columns:1fr;max-width:480px;}}

/* ============ 14. TEAM ============ */
/* clean square portrait, no decorative frame, sized to sit smaller than the text column */
.team{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:clamp(30px,4vw,72px);align-items:center;}
.team__portrait{position:relative;}
.team__portrait img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;filter:contrast(1.03) saturate(1.02);background:var(--paper-2);}
.team h3{font-family:var(--serif);font-weight:300;font-size:clamp(2rem,3.6vw,3.4rem);line-height:1;letter-spacing:-.01em;color:var(--ink);margin:18px 0 6px;}
.team__role{font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--teal);}
.team p{font-family:var(--serif);font-weight:300;font-size:clamp(1.15rem,1.6vw,1.5rem);line-height:1.4;color:var(--ink-soft);margin:26px 0 0;max-width:34ch;font-style:italic;}
@media (max-width:760px){.team{grid-template-columns:1fr;max-width:460px;}}
/* initials monogram stand-in for a member without a photo yet —
   same square footprint as .member__photo, brand petrol tile */
.member__photo.member__photo--mono{display:flex;align-items:center;justify-content:center;background:var(--petrol);}
.member__photo--mono span{
  font-family:var(--serif);font-weight:300;color:var(--paper);
  font-size:clamp(2.2rem,5vw,3.4rem);letter-spacing:.04em;line-height:1;
}

/* ============ 15. CTA BAND (thin closing strip, not a full-screen poster) ============ */
.cta{background:var(--petrol);color:var(--paper);position:relative;overflow:hidden;}
.cta__inner{padding-block:clamp(34px,4.5vw,52px);display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;position:relative;z-index:1;}
.cta h2{font-family:var(--serif);font-weight:300;font-size:clamp(1.35rem,2.2vw,1.9rem);line-height:1.25;letter-spacing:-.01em;margin:0;max-width:30ch;text-wrap:balance;}
.cta h2 em{font-style:italic;color:#cfe0df;}
.cta .btn--solid{background:var(--paper);color:var(--petrol);border-color:var(--paper);}
.cta .btn--solid:hover{background:#fff;}
.cta__label{color:#9bb7b6;}

/* ============ 16. FOOTER (three quiet columns: brand · navigate · contact) ============ */
.foot{background:var(--paper);border-top:1px solid var(--hair);}
.foot__inner{padding-block:clamp(34px,3.6vw,52px);}
.foot__top{display:grid;grid-template-columns:1.3fr .9fr .7fr;gap:clamp(32px,5vw,80px);align-items:start;}
.foot__brand{color:var(--petrol);}
/* footer brand lockup is identical to the header (.brand + .brand__tag) */
.foot__brand .brand svg{margin-bottom:0;}
.foot__h{display:block;font-size:.66rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--teal);margin-bottom:12px;}
.foot__nav{display:block;}
.foot__links{display:grid;grid-template-columns:1fr 1fr;gap:10px 28px;}
.foot__links a{font-size:.88rem;font-weight:500;color:var(--ink-soft);transition:color .2s;}
.foot__links a:hover{color:var(--petrol);}
.foot__col p{margin:0 0 8px;font-size:.88rem;color:var(--ink-soft);}
/* sub-labels under the footer Contact heading. Colour is inherited from
   .foot__col p on purpose: teal is the section heading above, so keeping
   these softer preserves the hierarchy rather than competing with it. */
.foot__lbl{margin:0 0 2px!important;font-size:.72rem!important;letter-spacing:.14em;text-transform:uppercase;}
.foot__col a + .foot__lbl{margin-top:14px!important;}
.foot__col a{font-size:.88rem;font-weight:600;color:var(--petrol);border-bottom:1px solid var(--hair);transition:border-color .25s;}
.foot__col a:hover{border-color:var(--petrol);}
@media (max-width:760px){
  .foot__top{grid-template-columns:1fr;gap:36px;}
}
.foot__legal{margin-top:clamp(26px,2.8vw,38px);padding-top:20px;border-top:1px solid var(--hair-soft);display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.foot__legal p{margin:0;font-size:.78rem;color:var(--ink-soft);max-width:62ch;line-height:1.6;}
.foot__legal .copy{white-space:nowrap;}

/* ============ 17. REVEAL / MOTION ============ */
/* Restrained: opacity-only fade (no translateY parade), reserved for section heads */
/* no-js guard: if JS is absent, never keep reveal content hidden.
   main.js removes the .no-js class from <html>, re-enabling the
   animated initial (hidden) state. Without JS this rule wins. */
@media (prefers-reduced-motion:reduce){
  .folio__img img{transition:none;}
}

/* ============ 18. SKIP LINK / A11Y ============ */
.skip{position:absolute;left:-9999px;top:0;background:var(--petrol);color:var(--paper);padding:12px 18px;z-index:100;}
.skip:focus{left:12px;top:12px;}

/* ============ 19. CINEMATIC COVER (shared by home + sub-pages) ============
   The homepage keeps an inline copy of these rules; defining them here too lets
   every sub-page open with the same full-bleed petrol-graded hero + nav-over-cover,
   so the whole site feels like one object. Sub-pages add `.cover--sub` for a
   shorter (not full-screen) cover. Both rely on body.has-cover for the nav. */
.cover{
  position:relative; isolation:isolate;
  min-height:100svh; min-height:100dvh;
  display:flex; overflow:hidden; background:var(--petrol);
}
.cover--sub{ min-height:clamp(420px,62vh,640px); }
.cover__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%;z-index:-2;}
.cover__scrim{position:absolute;inset:0;z-index:-1;pointer-events:none;background:rgba(10,54,57,.42);}
.cover__scrim::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,54,57,0) 44%,rgba(10,54,57,.8) 100%);}
.cover__inner{position:relative;z-index:1;width:100%;display:flex;flex-direction:column;
  padding-top:calc(74px + clamp(14px,2.5vh,28px));padding-bottom:clamp(36px,6vh,72px);}
.cover__lockup{margin-top:auto;max-width:min(94vw,920px);}
.cover__title{font-family:var(--serif);font-weight:300;
  font-size:clamp(2.1rem,min(4.6vw,6.2vh),3.9rem);line-height:1.08;letter-spacing:-.022em;
  color:#fdfdfb;margin:0;text-shadow:0 1px 44px rgba(0,0,0,.28);text-wrap:balance;}
.cover--sub .cover__title{font-size:clamp(2rem,min(4.4vw,8vh),3.4rem);}
.cover__sub{margin:clamp(16px,2vw,24px) 0 0;max-width:min(96ch,100%);text-wrap:normal;
  font-size:clamp(.98rem,1.15vw,1.12rem);line-height:1.6;color:rgba(242,243,245,.88);}
.cover__cta{margin-top:clamp(22px,2.6vw,32px);display:flex;flex-direction:column;align-items:flex-start;gap:16px;}
/* solid cream button over the cover (matches homepage) */
.btn--cream{background:var(--paper);color:var(--petrol);border-color:var(--paper);}
.btn--cream:hover{background:#fff;border-color:#fff;}
/* quiet secondary action: underlined text link, no button, no arrow */
.cover__textlink{
  color:rgba(253,253,251,.9);font-family:var(--sans);font-size:.95rem;font-weight:500;
  border-bottom:1px solid rgba(253,253,251,.4);padding-bottom:2px;transition:.25s;
}
.cover__textlink:hover{color:#fff;border-color:#fff;}
.cover__lockup{animation:coverRise 1s cubic-bezier(.22,.61,.36,1) both;}
.cover__lockup{animation-delay:.12s;}
@keyframes coverRise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* nav laid over the cover (matches homepage) */
body.has-cover .topbar{position:fixed;left:0;right:0;top:0;
  transition:background .35s ease,border-color .35s ease,box-shadow .35s ease;}
body.has-cover .brand,body.has-cover .brand__tag,body.has-cover .nav a,body.has-cover .menu-btn{
  transition:color .35s ease,border-color .35s ease;}
html.js body.has-cover .topbar:not(.scrolled){background:transparent;
  -webkit-backdrop-filter:none;backdrop-filter:none;border-bottom-color:transparent;box-shadow:none;}
html.js body.has-cover .topbar:not(.scrolled) .brand{color:#fdfdfb;}
html.js body.has-cover .topbar:not(.scrolled) .brand__tag{color:rgba(253,253,251,.9);border-left-color:rgba(253,253,251,.34);}
html.js body.has-cover .topbar:not(.scrolled) .nav a{color:rgba(253,253,251,.82);}
html.js body.has-cover .topbar:not(.scrolled) .nav a:hover,
html.js body.has-cover .topbar:not(.scrolled) .nav a.active{color:#fff;}
html.js body.has-cover .topbar:not(.scrolled) .nav a.active::after{background:#fff;}
html.js body.has-cover .topbar:not(.scrolled) .menu-btn{color:#fdfdfb;border-color:rgba(253,253,251,.4);}
@media (prefers-reduced-motion:reduce){
  body.has-cover .topbar{transition:none;}
  .cover__lockup{animation:none;}
}

/* ============ 20. NAV CTA + FOOTER CONTACT (2026-06 SEO/UX pass) ============ */
/* Contact as quiet outlined pill in the top bar */
.nav a.nav-cta{
  margin-left:10px;padding:9px 18px;border:1px solid var(--petrol);
  color:var(--petrol);border-radius:0;transition:.25s ease;
}
.nav a.nav-cta:hover{background:var(--petrol);color:var(--paper);}
.nav a.nav-cta.active{color:var(--petrol);}
.nav a.nav-cta.active::after{display:none;}
/* over the hero (transparent bar at rest): light outline, stays legible */
html.js body.has-cover .topbar:not(.scrolled) .nav a.nav-cta{
  border-color:rgba(253,253,251,.55);color:rgba(253,253,251,.92);
}
html.js body.has-cover .topbar:not(.scrolled) .nav a.nav-cta:hover{
  background:rgba(253,253,251,.95);color:var(--petrol);border-color:rgba(253,253,251,.95);
}

/* ============ 21. SUB-PAGE COVER PHOTOGRAPHY ============
   advisory / investment / acquisitions / contact now open with real
   photographs (assets/images/covers/) instead of the shared abstract
   background. Those pictures are already graded to the petrol tone and carry
   their own contrast, so the flat veil is lightened for them and the legibility
   is carried by the bottom gradient the shared .cover__scrim already draws. */
.cover--photo .cover__scrim{background:rgba(10,54,57,.30);}
.cover--photo .cover__scrim::after{
  background:linear-gradient(180deg,rgba(10,54,57,0) 30%,rgba(10,54,57,.86) 100%);
}

/* ---------------------------------------------------------------------------
   Widow control. The reviewer flagged single words stranded on their own line
   in several places ("einzelne Worte alleine auf Zeile"). Shortening individual
   sentences does not fix this: the narrow columns re-wrap at any length. Let the
   browser rebalance the last line instead, everywhere prose is set.
   Degrades to normal wrapping where text-wrap:pretty is unsupported.
   --------------------------------------------------------------------------- */
p, dd, li, figcaption, blockquote, .cover__sub, .lead, h1, h2, h3, h4{
  text-wrap:pretty;
}

/* visually hidden but available to assistive tech */
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}