/* Careers page styles, scoped from the supplied design. */
.kg-careers{--warn:#B44526}
.kg-careers button{text-align:left}
.kg-careers .hero{position:relative;min-height:min(74svh,660px);display:flex;flex-direction:column;overflow:hidden;background:var(--ink)}
.kg-careers .hero-media{position:absolute;inset:-8% 0;will-change:transform}
.kg-careers .hero-img{position:absolute;inset:0;background-size:cover;background-position:30% center;transform:scale(1.08);animation:kg-careers-kb 2.6s var(--ease) forwards}
@keyframes kg-careers-kb{to{transform:scale(1)}}
@media (max-aspect-ratio:1/1){.kg-careers .hero-img{background-position:24% center}}
.kg-careers .hero-scrim{position:absolute;inset:0;background:linear-gradient(88deg,rgba(11,13,12,.94) 0%,rgba(11,13,12,.72) 44%,rgba(11,13,12,.3) 82%,rgba(11,13,12,.42) 100%)}
.kg-careers .hero-scrim2{position:absolute;inset:0;background:linear-gradient(to top,rgba(11,13,12,.94) 0%,rgba(11,13,12,.46) 32%,rgba(11,13,12,0) 60%)}
.kg-careers .hero-noise{position:absolute;inset:0;background-image:var(--grain);opacity:.06;mix-blend-mode:overlay;pointer-events:none}
.kg-careers .hero-in{position:relative;z-index:5;margin-top:auto;padding-top:calc(var(--hdr) + 54px);padding-bottom:clamp(32px,5.5vh,66px)}
.kg-careers .hero h1{font-size:clamp(2.1rem,5.4vw,4.8rem);letter-spacing:-.05em;line-height:1;max-width:17ch;margin-bottom:clamp(16px,2.2vh,26px)}
.kg-careers .hero h1 .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em}
.kg-careers .hero h1 .w>i{display:inline-block;font-style:normal;transform:translateY(112%);transition:transform 1.15s var(--ease)}
.kg-careers .hero.go h1 .w>i{transform:none}
.kg-careers .hero .sub{max-width:52ch;color:rgba(255,255,255,.64)}
.kg-careers .hero .fade{opacity:0;transform:translateY(22px);filter:blur(6px);transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s var(--ease)}
.kg-careers .hero.go .fade{opacity:1;transform:none;filter:blur(0)}

.kg-careers .premise{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(26px,5vw,88px);align-items:start}
.kg-careers .premise h2{font-size:clamp(1.7rem,4vw,3.4rem);letter-spacing:-.048em;line-height:1.06;max-width:16ch}
.kg-careers .premise h2 em{font-style:normal;color:var(--accent)}
.kg-careers .premise-r p+p{margin-top:16px}

.kg-careers .roles{border-top:1px solid rgba(255,255,255,.16)}
.kg-careers .role{border-bottom:1px solid rgba(255,255,255,.16);position:relative}
.kg-careers .role-btn{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:clamp(12px,2.4vw,32px);align-items:center;padding:clamp(20px,2.8vw,34px) 0;transition:padding-left .5s var(--ease)}
.kg-careers .role:hover .role-btn{padding-left:clamp(10px,1.6vw,22px)}
.kg-careers .role::before{content:"";position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(255,255,255,.04);transition:width .6s var(--ease);pointer-events:none}
.kg-careers .role:hover::before{width:100%}
.kg-careers .role-btn>*{position:relative;z-index:2}
.kg-careers .role-t{font-size:clamp(1.1rem,2.3vw,1.85rem);letter-spacing:-.042em;line-height:1.08;font-weight:600}
.kg-careers .role-t span{display:block;margin-top:8px;font-size:11px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.42)}
.kg-careers .pill{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;border-radius:100px;padding:6px 13px;white-space:nowrap;border:1px solid rgba(255,255,255,.24);color:rgba(255,255,255,.6)}
.kg-careers .pill.open{border-color:var(--accent-hi);color:var(--accent-hi)}
.kg-careers .plus{width:22px;height:22px;position:relative;flex:0 0 auto;opacity:.5;transition:opacity .35s,transform .5s var(--ease)}
.kg-careers .plus::before,.kg-careers .plus::after{content:"";position:absolute;left:50%;top:50%;background:currentColor;transform:translate(-50%,-50%)}
.kg-careers .plus::before{width:13px;height:1.5px}
.kg-careers .plus::after{width:1.5px;height:13px;transition:transform .5s var(--ease)}
.kg-careers .role.on .plus{opacity:1;transform:rotate(180deg)}
.kg-careers .role.on .plus::after{transform:translate(-50%,-50%) scaleY(0)}
.kg-careers .role-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--ease)}
.kg-careers .role.on .role-panel{grid-template-rows:1fr}
.kg-careers .role-panel>div{overflow:hidden}
.kg-careers .role-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(18px,3vw,54px);padding:0 0 clamp(26px,3.4vw,42px)}
.kg-careers .role-in h4{font-size:11px;font-weight:700;letter-spacing:.14em;line-height:1.5;text-transform:uppercase;color:var(--accent-hi);margin-bottom:14px}
.kg-careers .role-in li{list-style:none;font-size:14.5px;line-height:1.55;color:rgba(255,255,255,.66);padding:7px 0 7px 16px;position:relative}
.kg-careers .role-in li::before{content:"";position:absolute;left:0;top:1.05em;width:7px;height:1px;background:var(--accent-hi)}
.kg-careers .role-apply{margin-top:22px;display:inline-flex;align-items:center;gap:12px;border-radius:100px;border:1px solid rgba(255,255,255,.3);padding:11px 22px;font-size:14px;font-weight:500;transition:background-color .3s,color .3s,border-color .3s}
.kg-careers .role-apply:hover{background:#fff;color:var(--ink);border-color:#fff}
.kg-careers .role-apply svg{width:15px;height:15px;transition:transform .45s var(--ease)}
.kg-careers .role-apply:hover svg{transform:translate(3px,-3px)}

.kg-careers .spec{border-radius:16px;padding:clamp(22px,2.8vw,38px);max-width:76ch;margin-top:clamp(26px,3.4vw,44px)}
.kg-careers .spec h3{font-size:clamp(1.05rem,1.7vw,1.35rem);letter-spacing:-.035em;margin-bottom:12px}
.kg-careers .spec p{color:rgba(255,255,255,.6)}

.kg-careers .grid4{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(11,13,12,.16);border:1px solid rgba(11,13,12,.16);border-radius:16px;overflow:hidden}
.kg-careers .g4{background:var(--paper);padding:clamp(24px,3vw,44px);position:relative;min-height:clamp(200px,20vw,260px);display:flex;flex-direction:column;gap:12px;transition:background-color .5s}
.kg-careers .g4:hover{background:#fff}
.kg-careers .g4 .gn{position:absolute;right:clamp(14px,2vw,24px);top:clamp(10px,1.4vw,16px);font-size:clamp(3rem,6vw,5.4rem);font-weight:700;letter-spacing:-.07em;color:rgba(11,13,12,.05);line-height:1}
.kg-careers .g4 h3{font-size:clamp(1.05rem,1.9vw,1.45rem);letter-spacing:-.038em;line-height:1.1;margin-top:auto;position:relative}
.kg-careers .g4 p{color:rgba(11,13,12,.62);font-size:14.5px;line-height:1.58;position:relative;max-width:44ch}

.kg-careers .terms{border-top:1px solid rgba(11,13,12,.16)}
.kg-careers .terms div{display:grid;grid-template-columns:clamp(120px,17vw,220px) 1fr;gap:clamp(14px,2.6vw,36px);padding:16px 0;border-bottom:1px solid rgba(11,13,12,.16);align-items:baseline}
.kg-careers .terms .k{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(11,13,12,.42)}
.kg-careers .terms .v{font-size:clamp(.95rem,1.2vw,1.08rem);letter-spacing:-.02em}

@media (max-width:1024px){
  .kg-careers .premise{grid-template-columns:1fr;gap:24px}
  .kg-careers .role-btn{grid-template-columns:minmax(0,1fr) auto;row-gap:12px}
  .kg-careers .role-btn .pill{grid-row:2;grid-column:1;justify-self:start}
  .kg-careers .role-in{grid-template-columns:1fr;gap:20px}
  .kg-careers .grid4{grid-template-columns:1fr}
  .kg-careers .terms div{grid-template-columns:1fr;row-gap:6px}
}
@media (prefers-reduced-motion:reduce){
  .kg-careers *,.kg-careers *::before,.kg-careers *::after{animation-duration:.001ms !important;transition-duration:.001ms !important}
  .kg-careers [data-r]{opacity:1;transform:none;filter:none}
  .kg-careers .at .w>i,.kg-careers .hero h1 .w>i{transform:none}
  .kg-careers .hero .fade{opacity:1;transform:none;filter:none}
}
