
/* SJK / Intentional legacy-inspired editorial refinements — 2026-10-22.
   Never affects Saturn video, flagship prices, A-RES or global navigation. */
.sjk-story-people{background:linear-gradient(130deg,#141e23,#0c1115)!important;border:1px solid #27363b!important;box-shadow:0 24px 70px #0003!important;padding:clamp(15px,2.8vw,30px)!important;min-height:0!important;color:#f7f7f4!important;gap:16px;overflow:hidden}
.sjk-story-people>span{color:#ffab6a!important;font:800 10px/1.6 Inter,Arial,sans-serif!important;letter-spacing:.14em!important}
.sjk-story-people-pics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.sjk-story-people-pics figure{margin:0;position:relative;min-width:0;background:#091216;overflow:hidden;border-radius:12px}
.sjk-story-people-pics img{display:block;width:100%;height:clamp(210px,24vw,330px);object-fit:cover;object-position:center 30%;filter:contrast(1.08)}
.sjk-story-people-pics figcaption{position:absolute;inset:auto 0 0;padding:38px 10px 12px;background:linear-gradient(transparent,#000d);display:grid;gap:3px}
.sjk-story-people-pics figcaption strong{color:#fff;font:800 clamp(11px,1.1vw,15px)/1.2 Inter,Arial,sans-serif;letter-spacing:-.02em}
.sjk-story-people-pics figcaption small{font:700 9px Inter,sans-serif;letter-spacing:.07em;color:#cdd5d9}
.sjk-story-people>a{color:#ffae76!important;text-decoration:none;font:800 11px Inter,Arial,sans-serif;letter-spacing:.07em;border-bottom:1px solid #ff9f58;width:max-content;max-width:100%;padding-bottom:7px}

/* Original electric-green custom build: immersive video and a single artwork,
   rather than a mismatched PC photo sitting inside a card. */
.sjk-pc-showcase{background:#020807!important;padding:clamp(76px,10vw,130px) 0!important;min-height:600px;overflow:hidden}
.sjk-pc-showcase-bg{background:#010705!important}
.sjk-pc-showcase-bg video{opacity:.35!important;filter:contrast(1.14) saturate(1.12)}
.sjk-pc-showcase-bg:after{background:linear-gradient(90deg,#020c0cfa 0%,#041310cf 48%,#0311097f 100%)!important}
.sjk-pc-showcase-body{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(14px,3.5vw,55px);min-height:430px}
.sjk-pc-showcase-content{position:relative;z-index:2}
.sjk-pc-showcase-content h2{line-height:1.08!important;letter-spacing:-.035em!important}
.sjk-pc-showcase-content p:not(.eyebrow){max-width:480px!important}
.sjk-pc-showcase-visual{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;min-height:390px;isolation:isolate}
.sjk-pc-showcase-visual:before{content:"";position:absolute;inset:7% 0;background:radial-gradient(ellipse,#00ff7750 0%,#005f4f18 42%,transparent 72%);filter:blur(25px);z-index:-1}
.sjk-pc-showcase-visual img{display:block;width:100%;max-height:530px;object-fit:contain;mix-blend-mode:screen;filter:contrast(1.08) brightness(1.2) saturate(1.08)}
.sjk-pc-showcase-caption{position:absolute;right:0;bottom:0;display:grid;text-align:right;gap:7px}
.sjk-pc-showcase-caption span{font:800 9px Inter,Arial,sans-serif;letter-spacing:.12em;color:#8dd3aa}
.sjk-pc-showcase-caption strong{font:900 clamp(16px,1.75vw,24px) Inter,sans-serif;color:#f8f8f7}

/* The useful Harmony design idea: asymmetric pale editorial narratives,
   with image/word alignment rather than an unrelated catalog of tiles. */
.sjk-editorial-services{background:#f6f5f2;color:#151b20;border-block:1px solid #d8d9d6}
.sjk-editorial-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,6vw,85px);align-items:center;min-height:350px;padding:clamp(36px,5.5vw,72px) 0;border-bottom:1px solid #e3e2dd}
.sjk-editorial-row:last-child{border-bottom:0}
.sjk-editorial-copy>span{font:800 10px Inter,Arial,sans-serif;letter-spacing:.14em;color:#a05211}
.sjk-editorial-copy h2{font:850 clamp(30px,4.1vw,56px)/1.07 Inter,Arial,sans-serif;letter-spacing:-.038em;color:#181e22;margin:19px 0}
.sjk-editorial-copy h2 em{font-style:normal;color:#d66b11}
.sjk-editorial-copy p{font:400 clamp(15px,1.55vw,18px)/1.7 "IBM Plex Sans",Arial,sans-serif;color:#49555b;max-width:530px}
.sjk-editorial-copy a{display:inline-flex;margin-top:20px;text-decoration:none!important;color:#172026!important;font:800 11px Inter,Arial,sans-serif;letter-spacing:.075em;border-bottom:2px solid #e67b18;padding-bottom:10px}
.sjk-editorial-copy a:hover,.sjk-editorial-copy a:focus-visible{color:#ad540b!important;outline-offset:4px}
.sjk-editorial-art{min-width:0;margin:0;display:grid;place-items:center}
.sjk-editorial-art img{display:block;width:100%;height:clamp(245px,29vw,380px);object-fit:contain;mix-blend-mode:multiply}

/* Specialty media is now *inside* the existing hero, never another block. */
.sjk-integrated-hero{overflow:hidden;min-height:unset!important;padding:clamp(70px,8vw,112px) 0!important}
.sjk-integrated-hero-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.94fr);gap:clamp(30px,4vw,65px);align-items:center}
.sjk-integrated-hero-copy{min-width:0}
.sjk-integrated-hero-copy h1{font-size:clamp(40px,5.5vw,78px)!important;line-height:1.06!important;letter-spacing:-.04em!important;margin:12px 0 20px}
.sjk-integrated-hero-copy p{max-width:570px}
.sjk-integrated-hero-art{margin:0;min-width:0}
.sjk-integrated-hero-art img{display:block;width:100%;height:clamp(240px,31vw,460px);object-fit:contain}
.sjk-integrated-hero-gaming{background:radial-gradient(circle at 80% 50%,#06472955,transparent 55%),#061012!important}
.sjk-integrated-hero-gaming .sjk-integrated-hero-art img{mix-blend-mode:screen;filter:brightness(1.18) contrast(1.09)}
.sjk-integrated-hero-light{background:#f8f8f5!important;color:#151b20!important;border-color:#dedfdc!important}
.sjk-integrated-hero-light h1{color:#151b20!important}
.sjk-integrated-hero-light p{color:#4d5960!important}
.sjk-integrated-hero-light .eyebrow{color:#ac560a!important}
.sjk-integrated-hero-light .sjk-integrated-hero-art img{mix-blend-mode:multiply}

/* Founder portraits stay in About, as one clean editorial diptych. */
.about-founders-panel{background:linear-gradient(125deg,#111e23,#223038)!important;border:1px solid #ffffff30!important;backdrop-filter:none!important;box-shadow:0 22px 65px #0005!important}
.about-founders-panel .sjk-founder-pics{gap:12px}
.about-founders-panel .sjk-founder-pic{border:0;border-radius:12px;box-shadow:none;background:#091216}
.about-founders-panel .sjk-founder-pic img{height:clamp(195px,21vw,320px);object-fit:cover}
.about-founders-panel .sjk-founder-pic figcaption{background:#111b20;padding:12px}
.about-founders-panel .sjk-founder-pic figcaption strong{font-size:14px}
.about-founders-panel .sjk-founder-pic figcaption span{font-size:9px}

@media(max-width:860px){
 .sjk-pc-showcase-body,.sjk-integrated-hero-layout{grid-template-columns:1fr}
 .sjk-pc-showcase-visual{min-height:260px}
 .sjk-pc-showcase-visual img{max-height:410px}
 .sjk-editorial-row{gap:20px}
}
@media(max-width:600px){
 .sjk-story-people-pics img{height:clamp(190px,54vw,280px)}
 .sjk-editorial-row{grid-template-columns:1fr;padding:42px 0;min-height:0}
 .sjk-editorial-row .sjk-editorial-art{grid-row:2}
 .sjk-editorial-art img{height:clamp(210px,66vw,290px)}
 .sjk-editorial-copy h2{font-size:clamp(31px,8.5vw,45px)}
 .sjk-integrated-hero{padding:57px 0!important}
 .sjk-integrated-hero-art img{height:260px}
 .sjk-pc-showcase{padding:70px 0!important;min-height:0}
 .sjk-pc-showcase-visual img{max-height:330px}
 .sjk-pc-showcase-caption{bottom:4px}
}
@media(max-width:390px){
 .sjk-story-people-pics{gap:8px}
 .sjk-story-people-pics figcaption{padding:25px 8px 10px}
 .sjk-story-people-pics figcaption strong{font-size:11px}
 .sjk-story-people-pics figcaption small{font-size:8px}
 .sjk-pc-showcase-caption strong{font-size:16px}
 .about-founders-panel .sjk-founder-pic img{height:180px}
}
@media(prefers-reduced-motion:reduce){
 .sjk-pc-showcase-bg video{display:none}
}

/* SJK Meet the Team — premium two-column correction, October 22 2026.
   Scoped to existing About page. No alterations to other site pages or assets. */

/* Page narrative: balanced split compositions with breathing space. */
.about-hero-grid,
.about-intro-grid,
.about-founders-grid,
.about-closer-grid {
  display: grid;
  align-items: center;
  min-width: 0;
}
.about-hero-grid > *,
.about-intro-grid > *,
.about-founders-grid > *,
.about-closer-grid > * { min-width: 0; }

.about-hero {
  padding-block: clamp(80px, 8vw, 112px);
}
.about-hero-grid {
  grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr);
  gap: clamp(28px, 4.7vw, 74px);
}
.about-hero h1 {
  max-width: 730px;
  font-size: clamp(41px, 5.05vw, 77px);
  line-height: 1.075;
  letter-spacing: -.044em;
  text-wrap: balance;
}
.about-hero h1 em {
  font-size: .89em;
  font-style: normal;
}
.about-hero-art {
  min-height: clamp(315px, 33vw, 460px);
  border-radius: 26px;
  padding: clamp(24px, 3.5vw, 39px);
}
.about-hero-art > div {
  font-size: clamp(39px, 4vw, 65px);
  letter-spacing: -.045em;
  line-height: 1.065;
}

.about-intro-grid {
  grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr);
  gap: clamp(25px, 4.5vw, 76px);
}
.about-intro-grid h2 {
  font-size: clamp(37px, 4.6vw, 66px);
  line-height: 1.075;
  letter-spacing: -.042em;
  text-wrap: balance;
}
.about-intro-grid p {line-height: 1.7;}

/* Main correction: text left, real founders side by side on the right. */
.about-founders {
  padding-block: clamp(75px, 8vw, 118px);
}
.about-founders-grid {
  grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
  gap: clamp(30px, 5vw, 82px);
  align-items: center;
}
.about-founders-grid > div:first-child {
  align-self: center;
}
.about-founders h2 {
  font-size: clamp(39px, 4.3vw, 67px);
  line-height: 1.09;
  letter-spacing: -.043em;
  margin-bottom: 24px;
  text-wrap: balance;
}
.about-founders-grid > div:first-child p:not(.eyebrow) {
  line-height: 1.72;
  max-width: 540px;
}
.about-founders-panel {
  width: 100%;
  min-width: 0;
  padding: clamp(16px, 2.2vw, 29px);
  border-radius: 24px;
  overflow: hidden;
}
.about-founders-panel > span {
  display: block;
  margin-bottom: 14px;
}
.about-founders-panel .sjk-founder-pics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: clamp(10px, 1.45vw, 18px);
  margin: 0 0 22px;
  width: 100%;
}
.about-founders-panel .sjk-founder-pic {
  display: flex;
  flex-direction: column;
  min-width: 0;
  max-width: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
  border: 1px solid rgba(255,255,255,.19);
  border-radius: 15px;
  overflow: hidden;
  background: #101a1e;
}
.about-founders-panel .sjk-founder-pic img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: clamp(220px, 24vw, 365px);
  min-height: 0;
  object-fit: cover;
  object-position: center 21%;
  background: #070b0d;
  flex-shrink: 0;
}
.about-founders-panel .sjk-founder-pic figcaption {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 13px 13px 17px;
  flex: 1;
  min-width: 0;
  background: #111b20;
}
.about-founders-panel .sjk-founder-pic figcaption strong {
  font: 800 clamp(12px, 1.25vw, 17px)/1.25 Inter, Arial, sans-serif;
  letter-spacing: -.024em;
  color: #fff;
  overflow-wrap: break-word;
}
.about-founders-panel .sjk-founder-pic figcaption span {
  font: 700 clamp(8px, .8vw, 10px)/1.45 Inter, Arial, sans-serif;
  letter-spacing: .05em;
  color: #bfcbd0;
  text-transform: uppercase;
  overflow-wrap: break-word;
}
.about-founders-panel .founder-quote {
  margin: 0;
  padding: 19px 2px 3px;
  font-size: clamp(18px, 2vw, 27px);
  line-height: 1.3;
  letter-spacing: -.024em;
  border-top: 1px solid rgba(255,255,255,.12);
}

.about-closer-grid {
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  gap: clamp(24px, 4vw, 60px);
}

/* Existing site breakpoint at 890px stacks everything. Override just About. */
@media (min-width: 720px) and (max-width: 1080px) {
  .about-hero-grid,
  .about-intro-grid,
  .about-founders-grid,
  .about-closer-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .about-hero-grid {gap: 24px;}
  .about-hero h1 {
    font-size: clamp(36px, 4.7vw, 53px);
    letter-spacing: -.036em;
    line-height: 1.09;
  }
  .about-hero-art {min-height: 290px;}
  .about-hero-art > div {font-size: clamp(36px, 4.3vw, 50px);}
  .about-intro-grid, .about-founders-grid, .about-closer-grid {gap: 28px;}
  .about-intro-grid h2, .about-founders h2 {font-size: clamp(33px, 4.4vw, 49px);}
  .about-founders-panel {padding: 15px;}
  .about-founders-panel .sjk-founder-pic img {height: clamp(195px, 25vw, 275px);}
  .about-founders-panel .sjk-founder-pic figcaption {padding: 10px;}
  .about-founders-panel .founder-quote {font-size: 18px;}
  .about-founders-grid > div:first-child p:not(.eyebrow) {font-size: 15px;line-height: 1.62;}
}

/* Narrow screens: keep the people paired visually but give text full width. */
@media (max-width: 719px) {
  .about-hero-grid,
  .about-intro-grid,
  .about-founders-grid,
  .about-closer-grid {grid-template-columns: minmax(0, 1fr);gap: 26px;}
  .about-hero {padding-block: 65px;}
  .about-hero h1 {font-size: clamp(38px, 9.3vw, 60px);line-height: 1.09;}
  .about-hero-art {min-height: 270px;}
  .about-hero-art > div {font-size: clamp(35px, 9vw, 57px);}
  .about-founders {padding-block: 72px;}
  .about-founders-grid {gap: 30px;}
  .about-founders h2 {font-size: clamp(37px, 8.7vw, 55px);}
  .about-founders-panel {padding: 12px;}
  .about-founders-panel .sjk-founder-pics {grid-template-columns: repeat(2,minmax(0,1fr));gap: 9px;}
  .about-founders-panel .sjk-founder-pic img {height: clamp(175px, 47vw, 285px);}
  .about-founders-panel .sjk-founder-pic figcaption {padding: 10px 9px 12px;}
  .about-founders-panel .sjk-founder-pic figcaption strong {font-size: 12px;}
  .about-founders-panel .sjk-founder-pic figcaption span {font-size: 8px;}
  .about-founders-panel .founder-quote {font-size: 19px;}
}
@media (max-width: 370px) {
  .about-hero h1 {font-size: 36px;}
  .about-founders-panel .sjk-founder-pic img {height: 170px;}
  .about-founders-panel .sjk-founder-pic figcaption strong {font-size: 11px;}
  .about-founders-panel .sjk-founder-pic figcaption span {font-size: 7.5px;}
}

