/* ============ Esker brand tokens ============ */
:root{
  --font:'Inter Tight', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --navy:#012340; --navy-2:#003C5A; --teal:#006684; --sky:#008CAD; --gray:#B4BBC4; --deep:#004A60;
  --bg:#ffffff; --bg-alt:#f3f5f8;
  --heading:var(--navy); --text:#33465c; --muted:#5f6e7f;
  --line:#e1e5ea; --line-strong:var(--gray);
  --img-bg:#dfe4ea;
  color-scheme:light;
  --head-h:88px;
  --edge:clamp(1.25rem, 5vw, 4rem);
  --maxw:1280px;
  --gut:clamp(1rem, 2.4vw, 2.25rem);
  --sec:clamp(5rem, 11vw, 9rem);
  --ease:cubic-bezier(.2,.7,.15,1);
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top, 0px);
  padding-bottom:env(safe-area-inset-bottom, 0px);
}
.ph-ties{background-image:url(/wp-content/uploads/2026/09/AdobeStock_2097257768-scaled.jpeg)} .ph-chips{background-image:url(/wp-content/uploads/2026/09/AdobeStock_2086999882-scaled.jpeg)}
.ph-road{background-image:url(/wp-content/uploads/2026/09/AdobeStock_1779731394-scaled.jpeg)} .ph-sky{background-image:url(/wp-content/uploads/2026/09/AdobeStock_1573766249-scaled.jpeg)}

/* ============ Base ============ */
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:calc(env(safe-area-inset-top, 0px) + var(--head-h)); -webkit-text-size-adjust:100%}
@media (prefers-reduced-motion: no-preference){ html{scroll-behavior:smooth} }
body{margin:0; background:var(--bg); color:var(--text); font:400 1.0625rem/1.65 var(--font); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility}
.page{overflow-x:clip}
img{display:block; max-width:100%}
p{margin:0 0 1em} p:last-child{margin-bottom:0}
h1,h2,h3,h4{margin:0; color:var(--heading); font-weight:600}
a{color:inherit}
.wrap{max-width:var(--maxw); margin-inline:auto; padding-inline:var(--edge)}
:where(a,button,input,textarea):focus-visible{outline:2px solid var(--sky); outline-offset:3px; border-radius:4px}
.skip{position:absolute; left:1rem; top:-120px; z-index:100; background:var(--teal); color:#fff; padding:.6rem 1.1rem; border-radius:999px; text-decoration:none}
.skip:focus{top:calc(env(safe-area-inset-top, 0px) + .75rem)}
.ico{width:28px; height:28px; flex:none; fill:none; stroke:currentColor; stroke-width:1.25; stroke-linecap:square; stroke-linejoin:miter}

.g{display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); column-gap:var(--gut); row-gap:clamp(2.5rem, 5vw, 4rem)}
.c-1-5{grid-column:1/6} .c-1-6{grid-column:1/7} .c-1-7{grid-column:1/8}
.c-7-12{grid-column:7/13} .c-8-12{grid-column:8/13}

.label{display:flex; align-items:center; gap:.65rem; margin:0 0 1.25rem; color:var(--teal); font-size:.95rem; line-height:1.4; letter-spacing:0; font-weight:500}
.slash{display:inline-block; flex:none; width:13px; height:15px; background:var(--sky); clip-path:polygon(55% 0,100% 0,100% 22%,45% 100%,0 100%,0 78%)}
h2{font-size:clamp(2.2rem, 4.8vw, 3.9rem); line-height:1.04; letter-spacing:-.02em; text-wrap:balance}
.h2-statement{font-size:clamp(1.9rem, 3.6vw, 3.1rem); line-height:1.12; letter-spacing:-.02em; max-width:22ch}
.lead{font-size:clamp(1.2rem, 1.9vw, 1.5rem); line-height:1.5; color:var(--heading)}

/* buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:.6rem; min-height:50px; padding:.85rem 1.5rem; border-radius:999px; border:1px solid transparent; font:500 1rem/1 var(--font); text-decoration:none; cursor:pointer; transition:background-color .25s, color .25s, border-color .25s, transform .25s}
.btn .ico{width:18px; height:18px; stroke-width:1.6; transition:transform .3s var(--ease)}
.btn:hover .ico{transform:translateX(4px)}
.btn-solid{background:var(--teal); color:#fff}
.btn-solid:hover{background:var(--navy-2)}
.btn-white{background:#fff; color:var(--navy)}
.btn-white:hover{background:#e6f2f6}
.btn-ghost{color:var(--heading); border-color:var(--line-strong)}
.btn-ghost:hover{border-color:var(--heading)}
.btn-ghost-light{color:#fff; border-color:rgba(255,255,255,.5)}
.btn-ghost-light:hover{background:rgba(255,255,255,.12); border-color:#fff}
.btn-sm{min-height:44px; padding:.65rem 1.2rem; font-size:.95rem}

/* ============ Header ============ */
.head{position:fixed; top:0; left:0; right:0; z-index:50; padding-top:env(safe-area-inset-top, 0px); color:#fff; border-bottom:1px solid transparent; transition:background-color .35s, color .35s, border-color .35s}
.head.scrolled,.head.menu-open{background:rgba(255,255,255,.94); -webkit-backdrop-filter:saturate(150%) blur(14px); backdrop-filter:saturate(150%) blur(14px); color:var(--navy); border-bottom-color:var(--line)}
.head-in{height:var(--head-h); display:flex; align-items:center; gap:2rem}
.brand{display:inline-flex; align-items:center; margin-right:auto; text-decoration:none}
.logo{display:block; height:40px; width:auto}
.logo-on-light{display:none}
.head.scrolled .logo-on-dark,.head.menu-open .logo-on-dark{display:none}
.head.scrolled .logo-on-light,.head.menu-open .logo-on-light{display:block}
.nav{display:flex; gap:clamp(1.1rem, 2vw, 2.1rem)}
.nav a{position:relative; padding:.4rem 0; color:inherit; text-decoration:none; font-size:1rem; font-weight:500}
.nav a::after{content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px; background:var(--sky); transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease)}
.nav a:hover::after,.nav a.active::after{transform:scaleX(1)}
.menu-btn{display:none; align-items:center; min-height:44px; padding:.5rem 1.1rem; border-radius:999px; border:1px solid currentColor; background:transparent; color:inherit; font:500 .95rem/1 var(--font); cursor:pointer}

/* ============ Hero (image-led first impression) ============ */
.hero{position:relative; min-height:max(640px, 100svh); display:flex; align-items:flex-end; overflow:hidden; background:var(--navy); color:#fff}
.hero-media{position:absolute; inset:-4% 0 -8% 0; will-change:transform}
.hero-media img{width:100%; height:100%; object-fit:cover; object-position:50% 55%}
.hero-shade{position:absolute; inset:0; background:
  linear-gradient(90deg, rgba(1,35,64,.84) 0%, rgba(1,35,64,.55) 42%, rgba(1,35,64,.08) 78%),
  linear-gradient(0deg, rgba(1,35,64,.7) 0%, rgba(1,35,64,0) 42%),
  linear-gradient(180deg, rgba(1,35,64,.6) 0%, rgba(1,35,64,.3) 34%, rgba(1,35,64,0) 52%)}
.hero-inner{position:relative; width:100%; padding-top:calc(var(--head-h) + 4rem); padding-bottom:clamp(5.5rem, 13vh, 9rem)}
.hero-title{color:#fff; font-size:clamp(2.9rem, 7.2vw, 6.9rem); line-height:.98; letter-spacing:-.025em; max-width:15ch}
.hero-lede{color:rgba(255,255,255,.88); font-size:clamp(1.12rem, 1.6vw, 1.35rem); line-height:1.55; max-width:40ch; margin-top:1.75rem}
.hero-actions{display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2.1rem}
.scroll-cue{position:absolute; right:var(--edge); bottom:2.2rem; display:flex; align-items:center; gap:.8rem; color:rgba(255,255,255,.8); font-size:.85rem; text-decoration:none}
.scroll-cue i{position:relative; display:block; width:1px; height:46px; background:rgba(255,255,255,.3); overflow:hidden}
.scroll-cue i::after{content:""; position:absolute; left:0; top:0; width:1px; height:40%; background:#fff}

/* ============ Sections ============ */
.sec{padding-block:var(--sec)}
.sec-alt{background:var(--bg-alt)}
.band{background:var(--navy); color:#fff}

.media{position:relative; margin:0; overflow:hidden; border-radius:6px; background:var(--img-bg)}
.media img{width:100%; height:100%; object-fit:cover; transition:transform 1.4s var(--ease)}
.media:hover img{transform:scale(1.045)}

/* About */
.about{align-items:center}
.about .lead{margin-bottom:1.25rem}
.about .btn{margin-top:1.25rem}
.about-img{aspect-ratio:595/500}
.about-img::after{content:""; position:absolute; left:0; bottom:0; width:38%; height:6px; background:linear-gradient(90deg, var(--sky), var(--teal), var(--deep))}

/* The name: image band with esker contour lines and word-by-word reveal */
.name{position:relative; overflow:hidden; padding-block:clamp(6rem, 14vw, 11rem)}
.name-bg{position:absolute; inset:-18% 0; background:url(../img/autumn.jpg) center/cover no-repeat; will-change:transform}
.name-shade{position:absolute; inset:0; background:linear-gradient(90deg, rgba(1,35,64,.9) 0%, rgba(1,35,64,.72) 50%, rgba(1,35,64,.42) 100%)}
.topo{position:absolute; top:0; right:0; width:64%; height:100%; color:var(--sky); opacity:.5;
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 45%); mask-image:linear-gradient(90deg, transparent 0%, #000 45%)}
.name .wrap{position:relative}
.name .label{color:var(--sky)}
.name-statement{color:#fff; font-size:clamp(1.65rem, 3.3vw, 2.75rem); line-height:1.24; letter-spacing:-.02em; font-weight:500; max-width:28ch; text-wrap:pretty}
.name-statement{--lit:#ffffff; --dim:rgba(255,255,255,.24)}
.name-statement .w{transition:color .35s ease}
.js .name-statement .w{color:var(--dim)}
.js .name-statement .w.lit{color:var(--lit)}
.name-statement.tone-sky{--lit:#8ED0E4; --dim:rgba(142,208,228,.22)}
.name-statement.tone-teal{--lit:#5FB3CE; --dim:rgba(95,179,206,.22)}
.name-statement.tone-gray{--lit:#B4BBC4; --dim:rgba(180,187,196,.2)}
.name-statement+.name-statement{margin-top:1.5rem}
.name-follow{color:rgba(255,255,255,.76); font-size:1.15rem; max-width:52ch; margin-top:clamp(2rem, 3.5vw, 2.75rem)}

/* Approach cards */
.cards3{list-style:none; margin:clamp(3rem, 6vw, 4.5rem) 0 0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--gut)}
.card{position:relative; background:#fff; border:1px solid var(--line); border-radius:8px; padding:clamp(1.75rem, 3vw, 2.5rem); transition:transform .45s var(--ease), box-shadow .45s var(--ease), border-color .45s}
.card::before{content:""; position:absolute; top:-1px; left:-1px; right:-1px; height:4px; border-radius:8px 8px 0 0; background:var(--c); transform:scaleX(.16); transform-origin:left; transition:transform .55s var(--ease)}
.card:hover{transform:translateY(-6px); box-shadow:0 26px 50px -28px rgba(1,35,64,.45); border-color:transparent}
.card:hover::before{transform:scaleX(1)}
.card .ico{width:46px; height:46px; color:var(--c); margin-bottom:2rem; transition:transform .45s var(--ease)}
.card:hover .ico{transform:translateY(-3px)}
.card .n{position:absolute; top:clamp(1.75rem, 3vw, 2.5rem); right:clamp(1.75rem, 3vw, 2.5rem); font-size:.9rem; font-weight:500; color:var(--muted); font-variant-numeric:tabular-nums}
.card h3{font-size:clamp(1.5rem, 2.3vw, 1.95rem); letter-spacing:-.02em; margin:0 0 .7rem}
.card p{margin:0}

/* Project Nahoonai */
.facts{list-style:none; margin:clamp(3rem, 6vw, 4.5rem) 0 0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); border-top:1px solid var(--line-strong); border-bottom:1px solid var(--line)}
.facts li{display:flex; gap:1.1rem; align-items:flex-start; padding:1.75rem 1.75rem 1.75rem 0}
.facts li+li{padding-left:1.75rem; border-left:1px solid var(--line)}
.facts .ico{width:42px; height:42px; color:var(--teal)}
.facts .k{display:block; font-weight:600; color:var(--navy); margin-bottom:.2rem}
.facts .v{display:block; color:var(--text); line-height:1.5}
.how{margin-top:clamp(4.5rem, 9vw, 7.5rem); align-items:start}
.how-aside{position:sticky; top:calc(var(--head-h) + env(safe-area-inset-top, 0px) + 2rem)}
.how-frame{position:relative; aspect-ratio:1/1; border-radius:6px; overflow:hidden; background:var(--img-bg)}
.how-frame .layer{position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transform:scale(1.06); transition:opacity .8s ease, transform 1.4s var(--ease)}
.how-frame .layer.on{opacity:1; transform:scale(1)}
.sub{font-size:1rem; line-height:1.4; font-weight:600; margin:0 0 1rem}
.steps-wrap{position:relative; --pad:64px; --rx:10px; padding-left:var(--pad)}
.rail,.rail-fill{position:absolute; left:var(--rx); width:18px; top:var(--rail-top, 0px); border-left:2px solid var(--line-strong); border-right:2px solid var(--line-strong)}
.rail{height:var(--rail-h, 100%)}
.rail-fill{height:var(--fill-h, 0px); border-color:var(--teal); transition:height .6s var(--ease)}
.steps{list-style:none; margin:0; padding:0}
.step{position:relative; padding-bottom:clamp(3rem, 15vh, 9rem)}
.step:last-child{padding-bottom:0}
.step-tie{position:absolute; left:calc(var(--rx) - 9px - var(--pad)); top:calc(.75rem - 4px); width:36px; height:8px; border-radius:2px; background:var(--bg); border:2px solid var(--line-strong); transition:background-color .3s, border-color .3s}
.step.on .step-tie,.step.past .step-tie{background:var(--teal); border-color:var(--teal)}
.step-n{display:block; font-size:.95rem; line-height:1.5rem; font-weight:500; color:var(--muted); margin-bottom:.6rem; font-variant-numeric:tabular-nums}
.step h4{font-size:clamp(1.45rem, 2.4vw, 2rem); line-height:1.15; letter-spacing:-.02em; margin:0 0 .7rem}
.step p{font-size:1.1rem; margin:0; max-width:40ch}
.js .step :is(.step-n,h4,p){opacity:.34; transition:opacity .45s ease}
.js .step.on :is(.step-n,h4,p){opacity:1}
.step-img{display:none; aspect-ratio:16/10; background-size:cover; background-position:center; border-radius:6px; margin-top:1.25rem; background-color:var(--img-bg)}

.nah-img{margin-top:2.25rem; aspect-ratio:692/240}

/* Leadership */
.lead-row{align-items:center}
.lead-img{aspect-ratio:16/10}
.lead-img img{object-position:60% 50%}
.lead-statement{font-size:clamp(1.65rem, 3vw, 2.5rem); line-height:1.2; letter-spacing:-.02em; font-weight:500; color:var(--heading); margin:0 0 2rem}

/* Investors */
.inv{padding-block:clamp(5rem, 10vw, 8rem)}
.inv h2{color:#fff}
.inv-cards{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--gut); margin-top:clamp(2.5rem, 5vw, 3.75rem)}
.inv-card{display:flex; flex-direction:column; justify-content:space-between; gap:3rem; min-height:250px; padding:clamp(1.75rem, 2.6vw, 2.25rem); border:1px solid rgba(255,255,255,.16); border-radius:8px; background:rgba(255,255,255,.03); color:#fff; text-decoration:none; transition:background-color .35s, border-color .35s, transform .45s var(--ease)}
.inv-card:hover{background:rgba(255,255,255,.07); border-color:var(--sky); transform:translateY(-5px)}
.inv-card>.ico{width:46px; height:46px; color:var(--sky)}
.inv-row{display:flex; align-items:flex-end; justify-content:space-between; gap:1rem}
.inv-t{font-size:clamp(1.35rem, 2.2vw, 1.8rem); line-height:1.15; letter-spacing:-.015em; font-weight:500}
.tag{display:inline-block; margin-top:.6rem; font-size:.8rem; font-weight:500; letter-spacing:0; color:rgba(255,255,255,.7); border:1px solid rgba(255,255,255,.2); border-radius:999px; padding:.28rem .7rem}
.inv-go{flex:none; width:48px; height:48px; border-radius:999px; border:1px solid rgba(255,255,255,.3); display:grid; place-items:center; transition:background-color .3s, border-color .3s}
.inv-go .ico{width:20px; height:20px; stroke-width:1.6; transition:transform .3s var(--ease)}
.inv-card:hover .inv-go{background:var(--sky); border-color:var(--sky)}
.inv-card:hover .inv-go .ico{transform:translateX(3px)}

/* Contact */
.info-item{display:flex; gap:1rem; align-items:flex-start; margin-top:1.75rem}
.info-item .ico{color:var(--teal); margin-top:.1rem}
.info-item .k{display:block; font-weight:600; color:var(--navy); font-size:.95rem}
address{font-style:normal}
.info-item a{color:var(--heading); text-decoration:underline; text-decoration-color:var(--line-strong); text-underline-offset:3px; transition:text-decoration-color .2s}
.info-item a:hover{text-decoration-color:var(--teal)}
.form{display:grid; gap:1.1rem; align-content:start; background:var(--bg-alt); border-radius:8px; padding:clamp(1.5rem, 3vw, 2.5rem)}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:1.1rem}
.field{display:grid; gap:.45rem}
.field label{font-size:.92rem; font-weight:500; color:var(--muted)}
.field input,.field textarea{width:100%; font:inherit; font-size:1rem; color:var(--heading); background:#fff; border:1px solid var(--line); border-radius:8px; padding:.85rem 1rem; transition:border-color .2s, box-shadow .2s}
.field input:hover,.field textarea:hover{border-color:var(--gray)}
.field input:focus,.field textarea:focus{outline:none; border-color:var(--teal); box-shadow:0 0 0 3px rgba(0,102,132,.18)}
.field textarea{min-height:150px; resize:vertical}
.form-foot{display:flex; flex-wrap:wrap; align-items:center; gap:1.25rem; margin-top:.4rem}
.note{margin:0; font-size:.9rem; color:var(--muted)}

/* Footer */
.foot{padding-block:clamp(4rem, 8vw, 5.5rem) clamp(2rem, 4vw, 3rem)}
.foot-top{display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:2.5rem var(--gut); align-items:start}
.foot .logo{height:44px}
.foot-claim{color:rgba(255,255,255,.72); margin-top:1.25rem; max-width:26ch; font-size:1.05rem}
.foot h3{color:#fff; font-size:.95rem; font-weight:600; margin:0 0 .9rem}
.foot-nav{display:grid; gap:.55rem}
.foot a{color:rgba(255,255,255,.74); text-decoration:none; transition:color .2s}
.foot a:hover{color:#fff}
.foot address,.foot p{color:rgba(255,255,255,.74)}
.foot-bottom{display:flex; flex-wrap:wrap; justify-content:space-between; gap:.75rem 2rem; margin-top:clamp(3rem, 6vw, 4rem); padding-top:1.5rem; border-top:1px solid rgba(255,255,255,.14); font-size:.9rem; color:rgba(255,255,255,.66)}
.legal{display:flex; gap:1.5rem}
.draft{margin:1.25rem 0 0; font-size:.8rem; color:rgba(255,255,255,.42)}

/* ============ Motion ============ */
.js [data-reveal]{opacity:0; transform:translateY(30px); transition:opacity 1s var(--ease) var(--d,0s), transform 1s var(--ease) var(--d,0s)}
.js [data-reveal="img"]{transform:none; clip-path:inset(14% 0 0 0 round 6px); transition:opacity 1s var(--ease) var(--d,0s), clip-path 1.3s var(--ease) var(--d,0s)}
.js [data-reveal].in{opacity:1; transform:none; clip-path:inset(0 0 0 0 round 6px)}
@media (prefers-reduced-motion: no-preference){
  .hero-media img{animation:kenburns 16s var(--ease) both}
  .hero-title{animation:fadeup 1.1s var(--ease) .2s both}
  .hero-lede{animation:fadeup 1s var(--ease) .55s both}
  .hero-actions{animation:fadeup 1s var(--ease) .7s both}
  .head{animation:fadein 1s ease .1s both}
  .scroll-cue i::after{animation:cue 2.2s var(--ease) infinite}
  @keyframes kenburns{from{transform:scale(1.14)} to{transform:scale(1)}}
  @keyframes fadeup{from{opacity:0; transform:translateY(16px)} to{opacity:1; transform:none}}
  @keyframes fadein{from{opacity:0} to{opacity:1}}
  @keyframes cue{0%{transform:translateY(-100%)} 60%,100%{transform:translateY(260%)}}
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{transition-duration:.01ms !important; animation:none !important}
  .js [data-reveal]{opacity:1; transform:none; clip-path:none}
  .js .name-statement .w{opacity:1}
}

/* ============ Responsive ============ */
@media (max-width:1080px){
  .nav{position:absolute; top:100%; left:0; right:0; display:none; flex-direction:column; gap:0; padding:.25rem var(--edge) 1.25rem; background:#fff; border-bottom:1px solid var(--line)}
  .nav.open{display:flex}
  .nav a{padding:.95rem 0; border-top:1px solid var(--line); font-size:1.05rem; color:var(--navy)}
  .nav a::after{display:none}
  .menu-btn{display:inline-flex}
  .head-in{gap:.75rem}
  .inv-cards{grid-template-columns:1fr}
  .inv-card{min-height:0; flex-direction:row; align-items:center; gap:1.25rem}
  .inv-row{flex:1}
}
@media (max-width:960px){
  .g>*{grid-column:1/-1 !important}
  .how-aside{display:none}
  .step-img{display:block}
  .js .step :is(.step-n,h4,p){opacity:1}
  .step{padding-bottom:3rem}
  .cards3,.facts{grid-template-columns:1fr}
  .facts li{padding:1.4rem 0}
  .facts li+li{padding-left:0; border-left:0; border-top:1px solid var(--line)}
  .foot-top{grid-template-columns:1fr 1fr}
  .topo{width:100%; opacity:.3; -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 70%); mask-image:linear-gradient(180deg, transparent 0%, #000 70%)}
}
@media (max-width:560px){
  :root{--head-h:72px}
  .logo{height:32px}
  .head-btn{display:none}
  .row2{grid-template-columns:1fr}
  .steps-wrap{--pad:52px; --rx:6px}
  .foot-top{grid-template-columns:1fr}
  .scroll-cue{display:none}
  .hero-actions .btn{flex:1 1 auto}
}

/* ---- WordPress plumbing ------------------------------------------------- */
.wp-site-blocks{margin:0}
.wp-site-blocks>*+*{margin-block-start:0}
.entry-content>*{margin-block-start:0}
figure{margin:0}
.screen-reader-text{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.admin-bar .head{top:32px}
@media (max-width:782px){ .admin-bar .head{top:46px} }
/* inner page template (everything that is not the landing page) */
.page-wrap{padding-top:calc(var(--head-h) + clamp(3rem,7vw,5rem)); padding-bottom:var(--sec)}
.page-wrap h1{font-size:clamp(2.2rem,4.8vw,3.9rem); line-height:1.04; letter-spacing:-.02em; margin-bottom:1.5rem}
.page-wrap :is(h2,h3){margin:2.5rem 0 1rem}
.page-wrap :is(ul,ol){padding-left:1.25rem}


/* ---- hero built with the core cover block (image + text stay editable) --- */
.hero.wp-block-cover{min-height:max(640px, 100svh); padding:0; align-items:flex-end; color:#fff}
.hero.wp-block-cover .wp-block-cover__inner-container{width:100%; position:relative; z-index:2}
.hero .wp-block-cover__image-background{object-position:50% 55%; will-change:transform}
.hero .wp-block-cover__background,.hero .wp-block-cover__gradient-background{opacity:1 !important; background:
  linear-gradient(90deg, rgba(1,35,64,.84) 0%, rgba(1,35,64,.55) 42%, rgba(1,35,64,.08) 78%),
  linear-gradient(0deg, rgba(1,35,64,.7) 0%, rgba(1,35,64,0) 42%),
  linear-gradient(180deg, rgba(1,35,64,.6) 0%, rgba(1,35,64,.3) 34%, rgba(1,35,64,0) 52%) !important}
.hero.wp-block-cover .hero-title,.hero.wp-block-cover p{color:#fff}

/* Group blocks may render an extra wrapper; let it pass layout through. */
.wp-block-group__inner-container{display:contents}

/* Inner pages have no hero, so the header is solid from the start. */
body:not(.is-landing) .head{background:var(--header-bg); -webkit-backdrop-filter:saturate(150%) blur(12px); backdrop-filter:saturate(150%) blur(12px); color:var(--navy); border-bottom-color:var(--line)}
body:not(.is-landing) .head .logo-on-dark{display:none}
body:not(.is-landing) .head .logo-on-light{display:block}

/* ---- navigation menus from Design > Menus ------------------------------- */
.nav ul{list-style:none; margin:0; padding:0; display:flex; gap:clamp(1.1rem, 2vw, 2.1rem)}
.nav li{position:relative}
.foot-nav ul{list-style:none; margin:0; padding:0; display:grid; gap:.55rem}
@media (max-width:1080px){
  .nav ul{flex-direction:column; gap:0}
  .nav li{width:100%}
  .nav a{display:block; width:100%}
}

/* ---- images coming from the media library ------------------------------- */
.media .wp-block-image,.media figure{margin:0}
.wp-block-image img{border-radius:6px}
.about-img img,.lead-img img,.nah-img img{border-radius:6px}

.page-wrap{max-width:var(--maxw); margin-inline:auto}
.page-intro{font-size:clamp(1.15rem,1.8vw,1.4rem); line-height:1.5; color:var(--heading); max-width:60ch; margin-bottom:2.5rem}
.page-wrap .cards3{margin-top:2.5rem}
.page-wrap .card{background:var(--bg-alt); border-color:transparent}

/* document / download lists on the investor pages */
.doc-list{list-style:none; margin:1.5rem 0 3rem; padding:0; border-top:1px solid var(--line-strong)}
.doc-list li{border-bottom:1px solid var(--line)}
.doc-list a,.doc-list .doc-row{display:flex; align-items:center; gap:1rem; padding:1.15rem .25rem; color:var(--heading); text-decoration:none; transition:background-color .2s, padding-left .2s}
.doc-list a:hover{background:var(--bg-alt); padding-left:1rem}
.doc-list .ico{width:26px; height:26px; color:var(--teal)}
.doc-list .t{flex:1; font-weight:500}
.doc-list .m{color:var(--muted); font-size:.92rem; white-space:nowrap}
.doc-note{display:inline-block; margin-left:.6rem; font-size:.78rem; font-weight:500; color:var(--muted); border:1px solid var(--line-strong); border-radius:999px; padding:.2rem .6rem; white-space:nowrap}
.callout{background:var(--bg-alt); border-left:4px solid var(--sky); border-radius:0 8px 8px 0; padding:clamp(1.25rem,2.5vw,2rem); margin:2.5rem 0}
.callout h2,.callout h3{margin-top:0}
.callout .info-item:first-of-type{margin-top:1rem}
.post-list{list-style:none; margin:2rem 0 0; padding:0; display:grid; gap:2rem}
.post-list li{border-top:1px solid var(--line); padding-top:1.5rem}
.post-list a{font-size:1.5rem; font-weight:600; color:var(--heading); text-decoration:none; letter-spacing:-.015em}
.post-list a:hover{color:var(--teal)}
.post-date{display:block; color:var(--muted); font-size:.92rem; margin:.3rem 0 .6rem}

/* ---- [esker_posts]: year tabs and document rows ------------------------- */
.esk-fin{--esk-navy:#012340;--esk-teal:#006684;--esk-sky:#008CAD;--esk-line:#E1E5EA;--esk-muted:#5F6E7F;margin:2.5rem 0 0}
.esk-fin-tabs{display:flex;flex-wrap:wrap;gap:.4rem;border-bottom:1px solid var(--esk-line);margin-bottom:2.25rem;overflow-x:auto}
.esk-fin input{position:absolute;opacity:0;pointer-events:none}
.esk-fin-tabs label{cursor:pointer;padding:.7rem 1.1rem;font-weight:600;font-size:1rem;color:var(--esk-muted);border-bottom:3px solid transparent;margin-bottom:-1px;white-space:nowrap;transition:color .2s,border-color .2s}
.esk-fin-tabs label:hover{color:var(--esk-navy)}
.esk-fin-panel{display:none}
.esk-fin-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem 2.5rem}
.esk-fin-group h3{font-size:1.05rem;font-weight:600;color:var(--esk-navy);margin:0 0 .75rem}
.esk-fin-plain .esk-fin-group+.esk-fin-group{margin-top:2rem}
.esk-fin-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--esk-line)}
.esk-fin-list li{border-bottom:1px solid var(--esk-line)}
.esk-fin-row{display:flex;align-items:center;gap:.85rem;padding:1rem .25rem;transition:background-color .2s,padding-left .2s}
.esk-fin-row:hover{background:#F3F5F8;padding-left:.9rem}
.esk-doc-ico{width:22px;height:22px;flex:none;fill:none;stroke:var(--esk-teal);stroke-width:1.3;stroke-linecap:square;stroke-linejoin:miter}
.esk-fin-row .esk-t{flex:1;color:var(--esk-navy);text-decoration:none;font-size:1.05rem;line-height:1.4}
.esk-fin-row .esk-t:hover{color:var(--esk-teal)}
.esk-fin-row .esk-d{color:var(--esk-muted);font-size:.9rem;white-space:nowrap}
.esk-fin-row .esk-pdf{display:inline-flex;align-items:center;gap:.35rem;color:var(--esk-teal);text-decoration:none;font-size:.85rem;font-weight:600;border:1px solid var(--esk-line);border-radius:999px;padding:.25rem .7rem;white-space:nowrap;transition:background-color .2s,border-color .2s,color .2s}
.esk-fin-row .esk-pdf:hover{background:var(--esk-teal);border-color:var(--esk-teal);color:#fff}
.esk-fin-empty{color:var(--esk-muted);font-style:italic}
@media (max-width:760px){
  .esk-fin-groups{grid-template-columns:1fr}
}
@media (max-width:600px){
  .esk-fin-row{flex-wrap:wrap;gap:.5rem .85rem}
  .esk-fin-row .esk-t{flex:1 1 100%}
}

/* ---- stack the two column sections earlier (About, Nahoonai, Leadership, Contact) ---- */
@media (max-width:1080px){
  /* Column cells span the full width. The classes are listed explicitly because
     the editor can wrap them in an extra container, so "direct child" would miss them. */
  .g :is(.c-1-4,.c-1-5,.c-1-6,.c-1-7,.c-5-12,.c-7-12,.c-8-12,.c-9-12,.media,.form,figure){
    grid-column:1 / -1 !important;
  }

  /* Leadership has the image before the text in the markup: push it below */
  .lead-row .media,.lead-row figure{order:2}

  /* a little less air once the sections are stacked */
  .g{row-gap:clamp(1.75rem, 4vw, 2.75rem)}
  .about-img img,.lead-img img,.nah-img img{aspect-ratio:16/9}
}