/* Corporate site additions on top of xk.css / consumer.css */
#nav .links.corp{gap:4px}
#nav .links.corp a{padding:8px 12px;border-radius:999px;opacity:.78;transition:opacity .2s,background .2s}
#nav .links.corp a:hover,#nav .links.corp a.on{opacity:1;background:rgba(14,22,32,.06)}
#nav .links.corp .sep{width:1px;height:18px;background:currentColor;opacity:.25;margin:0 8px}
#nav .links.corp a.ext{border:1px solid currentColor;opacity:.7}
#nav .links.corp a.ext:hover{opacity:1;background:transparent}
body:not(.on-light) #nav .links.corp a:hover,body:not(.on-light) #nav .links.corp a.on{background:rgba(255,255,255,.12)}

.vhero{position:relative;overflow:hidden}
.vhero .herostill{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.vhero .veil.lt{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(237,235,230,.96) 0%,rgba(237,235,230,.88) 45%,rgba(237,235,230,.35) 100%)}
.vhero.lt .wrap{position:relative;z-index:2}
.vhero.short{min-height:62vh}
#hero.vhero.lt .display{max-width:16ch}
@media (max-width:760px){.vhero .veil.lt{background:rgba(237,235,230,.9)}}

.wrap.narrow{max-width:820px}
.stat.sm b{font-size:clamp(24px,2.2vw,32px)}

.door{display:block;color:inherit;text-decoration:none;border-radius:20px;transition:transform .25s}
.door:hover{transform:translateY(-3px)}
.door .frame img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/10}
.door .frame{aspect-ratio:16/10}

.routes{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.route{display:flex;gap:16px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px;color:inherit;text-decoration:none;transition:transform .25s,box-shadow .25s}
.route:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(14,22,32,.08)}
.route img{width:88px;height:88px;object-fit:cover;border-radius:12px;flex:none}
.route b{display:block;font-size:16px;letter-spacing:-.01em}
.route span{display:block;font-size:13.5px;color:var(--muted);line-height:1.45;margin-top:4px}
@media (max-width:900px){.routes{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.routes{grid-template-columns:1fr}}

.photostrip{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.photostrip figure{margin:0;border-radius:16px;overflow:hidden;position:relative;aspect-ratio:4/5}
.photostrip img{width:100%;height:100%;object-fit:cover;display:block}
.photostrip figcaption{position:absolute;left:12px;bottom:12px;right:12px;color:#fff;font-size:13px;letter-spacing:.06em;text-transform:uppercase;text-shadow:0 1px 8px rgba(0,0,0,.6)}
@media (max-width:900px){.photostrip{grid-template-columns:repeat(3,1fr)}}
@media (max-width:600px){.photostrip{grid-template-columns:1fr 1fr}}

.newscard{display:block;color:inherit;text-decoration:none;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:transform .25s}
.newscard:hover{transform:translateY(-3px)}
.newscard .frame{aspect-ratio:16/9;border-radius:0}
.newscard .frame img{width:100%;height:100%;object-fit:cover}
.newscard .date{display:block;padding:16px 18px 0;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan-d)}
.newscard b{display:block;padding:8px 18px 0;font-size:17px;letter-spacing:-.01em;line-height:1.3}
.newscard>span:last-child{display:block;padding:6px 18px 18px;font-size:14px;color:var(--muted);line-height:1.5}

.newslist{display:grid;gap:10px;max-width:980px}
.newsitem{display:grid;grid-template-columns:150px 120px 1fr;gap:16px;align-items:start;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 20px;scroll-margin-top:90px}
.newsitem .date{font-size:12.5px;color:var(--muted);padding-top:3px}
.newsitem .pill{justify-self:start}
.newsitem b{display:block;font-size:16px;letter-spacing:-.01em;line-height:1.35}
.newsitem b a{color:inherit;text-decoration:none;border-bottom:1px solid var(--cyan-d)}
.newsitem div>span{display:block;font-size:14px;color:var(--muted);line-height:1.5;margin-top:4px}
@media (max-width:700px){.newsitem{grid-template-columns:1fr;gap:6px}}

.people{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.person{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px 20px}
.person .mono{width:64px;height:64px;border-radius:50%;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:500;letter-spacing:.02em;margin-bottom:16px}
.person b{display:block;font-size:17px;letter-spacing:-.01em}
.person span{display:block;font-size:14px;color:var(--body,#3A4A52);line-height:1.45;margin-top:4px}
.person small{display:block;font-size:12.5px;color:var(--muted);margin-top:6px}
.person .head{width:96px;height:96px;border-radius:50%;object-fit:cover;display:block;margin-bottom:16px;background:#EDEBE6}
.person p{font-size:14px;line-height:1.55;color:var(--muted);margin:10px 0 0}
@media (max-width:900px){.people{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.people{grid-template-columns:1fr}}

.story{display:grid;grid-template-columns:7fr 5fr;gap:36px;align-items:start}
.tline li b{display:block;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan-d)}
.tline li span{display:block;font-size:15px;line-height:1.55;color:var(--body,#3A4A52);margin-top:4px}
.storypics{display:grid;grid-template-columns:1fr 1fr;gap:14px;position:sticky;top:90px}
.storypics .frame{aspect-ratio:1/1}
.storypics img{width:100%;height:100%;object-fit:cover}
@media (max-width:900px){.story{grid-template-columns:1fr}.storypics{position:static}}

.door-card .frame{aspect-ratio:16/9}
.door-card .frame img{width:100%;height:100%;object-fit:cover}
.btn.soon{opacity:.55;cursor:not-allowed}
.office .frame{aspect-ratio:16/9}
.office .frame img{width:100%;height:100%;object-fit:cover}
.office b{display:block;font-size:20px;letter-spacing:-.01em}
.office>span{display:block;font-size:14px;color:var(--body,#3A4A52);line-height:1.55;margin-top:6px}

.award-card{text-align:center}
.award-card img{height:56px;width:auto;object-fit:contain;display:block;margin:6px auto 14px}
.award-card b{display:block;font-size:15px;letter-spacing:-.01em}
.award-card span{display:block;font-size:13px;color:var(--muted);margin-top:4px}

.kit{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.kititem{display:block;color:inherit;text-decoration:none}
.kititem .frame{aspect-ratio:4/3;background:#fff;border:1px solid var(--line)}
.kititem .frame img{width:100%;height:100%;object-fit:cover}
.kititem .frame.pad img{object-fit:contain;padding:18px}
.kititem .frame.dark{background:var(--ink)}
.kititem b{display:block;font-size:14px;margin-top:10px}
.kititem span{display:block;font-size:12.5px;color:var(--muted)}
@media (max-width:600px){.kit{grid-template-columns:1fr 1fr}}

.jobs{display:grid;gap:10px;max-width:820px}
.job{display:flex;justify-content:space-between;align-items:center;gap:16px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 20px;color:inherit;text-decoration:none}
.job b{display:block;font-size:17px;letter-spacing:-.01em}
.job div>span{display:block;font-size:13.5px;color:var(--muted);margin-top:3px}

.tabs.corp{display:flex;flex-wrap:wrap;gap:8px}
.tabs.corp .tab{padding:10px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;font:inherit;font-size:13.5px;cursor:pointer;color:var(--ink)}
.tabs.corp .tab.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.cpanel{display:none}
.cpanel.on{display:grid}
.cpanel.on:not(.split){display:block}
.cpanel .form{margin-top:0}

.vhero .herostill.hq{object-position:62% 45%}
@media (max-width:760px){.vhero .herostill.hq{object-position:50% 40%}}

/* home: split hero */
#hero.splith .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:48px;align-items:center}
#hero.splith .heropic{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:4/3;box-shadow:0 30px 60px rgba(14,22,32,.12)}
#hero.splith .heropic img{width:100%;height:100%;object-fit:cover;object-position:50% 42%;display:block}
#hero.splith .heropic span{position:absolute;left:14px;bottom:12px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.5)}
@media (max-width:900px){#hero.splith .wrap{grid-template-columns:1fr;gap:28px}#hero.splith .heropic{aspect-ratio:16/10}}

/* rotating hero photos */
#hero.splith .heropic.rotate figure{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1.4s ease}
#hero.splith .heropic.rotate figure.on{opacity:1}
#hero.splith .heropic.rotate figure span{position:absolute;left:14px;bottom:12px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.5)}
@media (prefers-reduced-motion: reduce){#hero.splith .heropic.rotate figure{transition:none}}

/* home: office photo hero */
#hero.office .herostill{object-position:50% 50%}
#hero.office .veil.lt{background:linear-gradient(90deg,rgba(237,235,230,.92) 0%,rgba(237,235,230,.72) 38%,rgba(237,235,230,.12) 70%,rgba(237,235,230,0) 100%)}
#hero.office{min-height:88vh}

#hero.office .veil.lt{background:linear-gradient(180deg,rgba(237,235,230,.06) 0%,rgba(237,235,230,.18) 55%,rgba(237,235,230,.55) 100%)}
#hero.office .heropanel{max-width:600px;padding:34px 36px 30px;border-radius:24px;background:rgba(247,249,251,.78);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.7);box-shadow:0 20px 50px rgba(14,22,32,.08);margin-top:14vh}
#hero.office .heropanel .display{font-size:clamp(40px,4.6vw,64px)}
@media (max-width:760px){#hero.office .heropanel{padding:24px 20px;margin-top:22vh}}

/* contact tabs are plain pills, not film tabs */
.tabs.corp .tab,.tabs.corp .tab.on{display:inline-flex;flex-direction:row;align-items:center;text-align:center;padding:10px 16px}
.tabs.corp .tab:before,.tabs.corp .tab.on:before{content:none;display:none}

/* no panel: text straight on the photo */
#hero.office .heropanel{background:none;backdrop-filter:none;-webkit-backdrop-filter:none;border:0;box-shadow:none;padding:0;max-width:640px;margin-top:16vh}
#hero.office .veil.lt{background:linear-gradient(180deg,rgba(237,235,230,0) 0%,rgba(237,235,230,0) 45%,rgba(237,235,230,.45) 100%)}

/* a light touch of panel */
#hero.office .heropanel{background:rgba(247,249,251,.42);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:30px 32px 26px;border-radius:24px;max-width:620px;margin-top:14vh}

/* clean card images + flash-card rotation */
.newscard .frame.white{background:#fff}
.newscard .frame.white img{object-fit:cover;background:#fff}
.newscard .frame.logo img{object-fit:contain;padding:28px}
.flash{position:relative;aspect-ratio:16/10;overflow:hidden;background:#EDEBE6}
.flash figure{position:absolute;inset:0;margin:0;opacity:0;transform:translateX(8%) scale(1.03);transition:opacity .7s ease,transform .7s ease;pointer-events:none}
.flash figure.on{opacity:1;transform:none}
.flash figure.out{opacity:0;transform:translateX(-8%) scale(.98)}
.flash img{width:100%;height:100%;object-fit:cover;display:block}
.flash span{position:absolute;left:14px;bottom:12px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.5)}
@media (prefers-reduced-motion: reduce){.flash figure{transition:none}}

.vhero .herostill.room{object-position:100% 60%}

/* route icons instead of photos */
.route .ric{width:64px;height:64px;border-radius:14px;flex:none;display:grid;place-items:center;background:#EAF6F9;color:var(--cyan-d)}
.route .ric svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.office .kicker{margin-bottom:8px}

.vhero .herostill.portrait{object-position:70% 30%}
.job{display:block;padding:0}
.job summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 20px;cursor:pointer;list-style:none}
.job summary::-webkit-details-marker{display:none}
.job[open] summary{border-bottom:1px solid var(--line)}
.job .jd{padding:18px 20px 22px}
.job .jd .grid-2{margin-top:12px}
.job .jd .kicker{margin-bottom:6px}

.person .head{filter:grayscale(1)}

/* no panel on the home hero (Sam: not clean) */
#hero.office .heropanel{background:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding:0;border:0;box-shadow:none;max-width:640px;margin-top:16vh}

/* milestones mosaic */
.mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:220px;grid-auto-flow:dense;gap:14px}
.mosaic figure{margin:0;position:relative;border-radius:16px;overflow:hidden;background:#EDEBE6}
.mosaic figure.wide{grid-column:span 2}
.mosaic figure.tall{grid-row:span 2}
.mosaic img{width:100%;height:100%;object-fit:cover;display:block}
.mosaic figcaption{position:absolute;left:0;right:0;bottom:0;padding:28px 14px 12px;font-size:12.5px;line-height:1.4;color:#fff;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.62))}
@media (max-width:900px){.mosaic{grid-template-columns:repeat(2,1fr);grid-auto-rows:200px}}
@media (max-width:520px){.mosaic{grid-template-columns:1fr;grid-auto-rows:220px}.mosaic figure.wide,.mosaic figure.tall{grid-column:auto;grid-row:auto}}

/* dark stage heroes */
.vhero.dark{background:#0E1620}
.vhero.dark .wrap{position:relative;z-index:2}
.vhero.dark .veil.lt{background:linear-gradient(90deg,rgba(8,14,20,.78) 0%,rgba(8,14,20,.45) 50%,rgba(8,14,20,.1) 100%)}
.vhero.dark .display,.vhero.dark .lede{color:#fff}
.vhero.dark .eyebrow{color:#9FDCE8}
.vhero.dark .lede{color:rgba(255,255,255,.82)}
.vhero.dark .btn.ghost{color:#fff;border-color:rgba(255,255,255,.6)}
.vhero .herostill.stage{object-position:70% 30%}
@media (max-width:760px){.vhero.dark .veil.lt{background:rgba(8,14,20,.7)}}

/* stage heroes: keep the photo, fade only the bottom for the text */
.vhero.dark .veil.lt{background:linear-gradient(180deg,rgba(8,14,20,.05) 0%,rgba(8,14,20,.25) 45%,rgba(8,14,20,.82) 100%)}
.vhero .herostill.stage{object-position:65% 25%;filter:brightness(1.08)}
@media (max-width:760px){.vhero.dark .veil.lt{background:linear-gradient(180deg,rgba(8,14,20,.3),rgba(8,14,20,.85))}}

/* 2026 stage heroes, light */
.vhero .herostill.lsi{object-position:60% 30%}
.vhero .herostill.panel{object-position:35% 55%}

/* heroes: no fade, a solid tile behind the text (Sam) */
.vhero .veil.lt{display:none}
.vhero.lt .herotile{display:inline-block;max-width:680px;background:#fff;border-radius:22px;padding:34px 38px 30px;margin-top:10vh}
.vhero.lt .herotile .row{margin-top:18px}
#hero.office .heropanel{background:#fff;border-radius:22px;padding:34px 38px 30px;max-width:680px;margin-top:14vh}
@media (max-width:760px){.vhero.lt .herotile,#hero.office .heropanel{padding:22px 20px;border-radius:16px;margin-top:8vh}}

.vhero .herostill.fast50{object-position:70% 40%}
.vhero .herostill.ces{object-position:50% 60%}

/* investors: narrower tile, the screen stays visible */
.vhero.tileleft .herotile{max-width:460px;padding:28px 30px 26px}
.vhero.tileleft .display{font-size:clamp(32px,3.2vw,46px)}
.vhero.tileleft .lede{font-size:15.5px}

.vhero .herostill.coffee{object-position:50% 50%}

/* investors: tile hard left so the screen stays clear */
.vhero.tileleft .herotile{max-width:440px}

/* investors: shift the tile left on wide screens, photo untouched */
@media (min-width:1100px){.vhero.tileleft .herotile{transform:translateX(calc(-1 * min(170px, (100vw - 1100px) / 2)))}}

/* investors tile: a little wider now the shift works */
.vhero.tileleft .herotile{max-width:560px}
.vhero.tileleft .display{font-size:clamp(34px,3.6vw,52px)}

/* leadership: the team wall beside the text */
#hero.wall .heropic{aspect-ratio:auto;box-shadow:none;border-radius:22px}
#hero.wall .heropic img{object-fit:contain;object-position:center}
#hero.wall .wrap{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)}
#hero.wall{min-height:auto;padding-top:120px}

/* the open executive role */
.person.open{text-decoration:none;color:inherit;border-style:dashed;background:#F7FAFB}
.person.open .mono.open{background:#EAF6F9;color:var(--cyan-d)}
.person.open .mono.open svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.person.open .pill{display:inline-block}

/* leadership: group photo hero, wall in the team block */
#hero.wall .heropic.group{aspect-ratio:16/9;border-radius:22px;overflow:hidden}
#hero.wall .heropic.group img{object-fit:cover}
#hero.wall .wrap{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr)}
.wallframe{aspect-ratio:auto;background:#F7F9FB}
.wallframe img{width:100%;height:auto;display:block}
/* home hero tile: tighter, balanced headline, no orphan lines */
#hero.office .heropanel{max-width:640px;padding:30px 34px 26px}
#hero.office .heropanel .display{font-size:clamp(38px,4.1vw,56px);max-width:none;margin:14px 0 16px;text-wrap:balance}
#hero.office .heropanel .lede{max-width:none;margin:0}
#hero.office .heropanel .row{margin-top:20px}
#hero.office .heropanel .who{margin-top:22px;font-size:12px;letter-spacing:.1em;line-height:1.6;text-wrap:balance}
