/*
Theme Name: Stockbridge Capital Holdings
Theme URI: https://stockbridgecapitalholdings.com
Author: Stockbridge Capital Holdings
Description: Bespoke single-page theme for Stockbridge Capital Holdings. Content editable via ACF.
Version: 1.0.0
License: All rights reserved
Text Domain: stockbridge
*/

:root{
  --navy:#0a1830;
  --navy-deep:#060f20;
  --ivory:#f4f1ea;
  --ivory-dim:#cdc8bd;
  --gold:#b69556;
  --gold-soft:#c9ac74;
  --line:rgba(244,241,234,0.14);
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Jost',-apple-system,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--navy);color:var(--ivory);font-family:var(--sans);font-weight:300;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px}
a{color:inherit;text-decoration:none}

.reveal{opacity:0;transform:translateY(24px);transition:opacity 1.4s cubic-bezier(.16,1,.3,1),transform 1.4s cubic-bezier(.16,1,.3,1)}
.reveal.in{opacity:1;transform:none}

header{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .5s,border-color .5s;border-bottom:1px solid transparent}
header.solid{background:rgba(6,15,32,0.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:22px 32px;max-width:1180px;margin:0 auto}
.brand{display:flex;align-items:center;gap:13px;font-family:var(--serif);font-size:21px;letter-spacing:.04em;color:var(--ivory)}
.brand svg{width:30px;height:30px;flex:none}
.brand span{font-weight:500}
.brand small{display:block;font-size:9.5px;letter-spacing:.42em;text-transform:uppercase;color:var(--ivory-dim);font-family:var(--sans);font-weight:400;margin-top:1px}
.navlinks{display:flex;gap:38px;align-items:center}
.navlinks a{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ivory-dim);transition:color .4s}
.navlinks a:hover{color:var(--gold-soft)}
.menu-btn{display:none;background:none;border:none;color:var(--ivory);cursor:pointer;flex-direction:column;gap:5px;padding:6px}
.menu-btn span{width:24px;height:1.5px;background:var(--ivory);display:block;transition:.3s}

.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;position:relative;padding:120px 0 80px}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 38%,rgba(20,38,72,0.6),transparent 70%);pointer-events:none}
.hero-mark{width:88px;height:88px;margin-bottom:40px;opacity:0}
.hero-mark.in{opacity:1;transition:opacity 2s ease 0.2s}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(38px,6.4vw,82px);line-height:1.04;letter-spacing:-0.01em;max-width:14ch;margin-bottom:34px}
.hero h1 em{font-style:italic;color:var(--gold-soft)}
.hero-sub{font-size:clamp(15px,1.6vw,18px);font-weight:300;letter-spacing:.02em;color:var(--ivory-dim);max-width:44ch;margin-bottom:48px}
.rule{width:54px;height:1px;background:var(--gold);margin-bottom:34px;transform-origin:left;transform:scaleX(0)}
.rule.in{transform:scaleX(1);transition:transform 1.6s cubic-bezier(.16,1,.3,1) .3s}
.scroll-cue{position:absolute;bottom:42px;left:32px;font-size:10.5px;letter-spacing:.32em;text-transform:uppercase;color:var(--ivory-dim);display:flex;align-items:center;gap:12px}
.scroll-cue::after{content:"";width:42px;height:1px;background:var(--line)}

section{position:relative}
.pad{padding:130px 0}
.eyebrow{font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--gold);margin-bottom:28px;font-weight:400}
.lead{font-family:var(--serif);font-weight:400;font-size:clamp(26px,3.6vw,42px);line-height:1.28;letter-spacing:-0.005em;max-width:24ch}
.lead em{font-style:italic;color:var(--gold-soft)}

.philo{border-top:1px solid var(--line)}
.philo .grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.philo p{font-size:16px;color:var(--ivory-dim);margin-bottom:22px;max-width:46ch}
.creed{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--ivory);border-left:2px solid var(--gold);padding-left:24px;margin-top:8px;line-height:1.4}

.tenets{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);margin-top:96px}
.tenet{padding:46px 30px 46px 0;border-right:1px solid var(--line)}
.tenet:last-child{border-right:none;padding-right:0}
.tenet .n{font-family:var(--serif);font-size:15px;color:var(--gold);margin-bottom:18px;letter-spacing:.05em}
.tenet h3{font-family:var(--serif);font-weight:500;font-size:23px;margin-bottom:12px;line-height:1.2}
.tenet p{font-size:13.5px;color:var(--ivory-dim);line-height:1.65}

.port{background:var(--navy-deep);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.port-head{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:24px;margin-bottom:72px}
.pcard{display:grid;grid-template-columns:0.42fr 0.58fr;gap:60px;align-items:center;padding:64px 0;border-top:1px solid var(--line)}
.pcard:last-of-type{border-bottom:1px solid var(--line)}
.pcard .meta .ix{font-family:var(--serif);font-size:14px;color:var(--gold);letter-spacing:.08em;margin-bottom:20px}
.pcard .meta h3{font-family:var(--serif);font-weight:400;font-size:clamp(30px,3.8vw,46px);line-height:1.08;margin-bottom:22px}
.pcard .meta .tag{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory-dim)}
.pcard .body p{font-size:15.5px;color:var(--ivory-dim);margin-bottom:26px;max-width:50ch}
.holdings{display:flex;flex-wrap:wrap;gap:10px}
.holdings span{font-size:12px;letter-spacing:.04em;color:var(--ivory);border:1px solid var(--line);padding:8px 16px;border-radius:1px;transition:border-color .4s,color .4s}
.holdings span:hover{border-color:var(--gold);color:var(--gold-soft)}
.holdings span.count{border:none;color:var(--gold);padding-left:0;letter-spacing:.16em;text-transform:uppercase;font-size:11px}

.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line)}
.stat{padding:54px 24px 54px 0;border-right:1px solid var(--line)}
.stat:last-child{border-right:none}
.stat .v{font-family:var(--serif);font-weight:400;font-size:clamp(36px,4.4vw,56px);color:var(--ivory);line-height:1;letter-spacing:-0.01em}
.stat .v em{font-style:normal;color:var(--gold-soft);font-size:0.6em;vertical-align:super;margin-left:2px}
.stat .l{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ivory-dim);margin-top:16px;line-height:1.5}

.estates .lead{margin-bottom:60px}
.egrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}
.estate{background:var(--navy);padding:38px 30px;min-height:188px;display:flex;flex-direction:column;justify-content:space-between;transition:background .5s}
.estate:hover{background:var(--navy-deep)}
.estate .nm{font-family:var(--serif);font-size:25px;font-weight:400;line-height:1.1;margin-bottom:8px}
.estate .lo{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ivory-dim)}
.estate .pr{font-size:12.5px;color:var(--gold-soft);letter-spacing:.08em;margin-top:auto;padding-top:22px}
.estate .grade{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}

.founder{background:var(--navy-deep);border-top:1px solid var(--line)}
.founder .grid{display:grid;grid-template-columns:0.4fr 0.6fr;gap:72px;align-items:center}
.founder blockquote{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(24px,3.2vw,36px);line-height:1.34;letter-spacing:-0.005em}
.founder blockquote em{color:var(--gold-soft)}
.founder .attr{margin-top:34px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--ivory-dim)}
.founder .attr b{color:var(--ivory);font-weight:500;display:block;margin-bottom:5px;font-size:13px}
.founder .pic{aspect-ratio:3/4;background:linear-gradient(160deg,#16294a,#0a1830);border:1px solid var(--line);display:flex;align-items:flex-end;padding:30px;position:relative;background-size:cover;background-position:center}
.founder .pic span{font-family:var(--serif);font-size:19px;color:var(--ivory-dim)}

.contact{text-align:center}
.contact h2{font-family:var(--serif);font-weight:400;font-size:clamp(34px,5.2vw,64px);line-height:1.06;margin-bottom:30px;letter-spacing:-0.01em}
.contact h2 em{font-style:italic;color:var(--gold-soft)}
.contact-lines{display:flex;justify-content:center;gap:60px;flex-wrap:wrap;margin-top:54px}
.cl{text-align:center}
.cl .k{font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
.cl .v{font-size:15px;color:var(--ivory);line-height:1.7}
.cl .v a{border-bottom:1px solid transparent;transition:border-color .4s}
.cl .v a:hover{border-color:var(--gold)}

footer{border-top:1px solid var(--line);padding:56px 0 40px}
.fgrid{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:28px}
.fbrand{font-family:var(--serif);font-size:18px;letter-spacing:.04em}
.fcreed{font-size:12px;letter-spacing:.04em;color:var(--ivory-dim);max-width:48ch;line-height:1.7}
.fmeta{font-size:11px;letter-spacing:.08em;color:var(--ivory-dim);margin-top:32px;border-top:1px solid var(--line);padding-top:28px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px}

@media(max-width:900px){
  .wrap{padding:0 24px}
  .nav{padding:18px 24px}
  .navlinks{position:fixed;inset:0;background:var(--navy-deep);flex-direction:column;justify-content:center;gap:36px;transform:translateX(100%);transition:transform .5s cubic-bezier(.16,1,.3,1);z-index:60}
  .navlinks.open{transform:none}
  .navlinks a{font-size:15px}
  .menu-btn{display:flex;z-index:70}
  .menu-btn.x span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
  .menu-btn.x span:nth-child(2){opacity:0}
  .menu-btn.x span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
  .pad{padding:86px 0}
  .philo .grid{grid-template-columns:1fr;gap:38px}
  .tenets{grid-template-columns:1fr 1fr;margin-top:56px}
  .tenet{border-right:none;padding:34px 20px 34px 0}
  .tenet:nth-child(odd){border-right:1px solid var(--line)}
  .pcard{grid-template-columns:1fr;gap:30px;padding:48px 0}
  .stats{grid-template-columns:1fr 1fr}
  .stat{padding:38px 20px 38px 0}
  .stat:nth-child(2){border-right:none}
  .egrid{grid-template-columns:1fr 1fr}
  .founder .grid{grid-template-columns:1fr;gap:44px}
  .founder .pic{aspect-ratio:4/3;order:-1}
  .contact-lines{gap:40px}
  .scroll-cue{left:24px}
}
@media(max-width:560px){
  .tenets,.stats,.egrid{grid-template-columns:1fr}
  .tenet,.stat{border-right:none!important}
  .brand small{display:none}
  .holdings span{font-size:11px;padding:7px 13px}
}