/* brand.css - generated by tools/build_wp.py from the prototype. Do not edit here. Every rule is scoped under .gk-brand. */
.gk-brand{background:var(--night);color:var(--cream);font:400 1rem/1.65 var(--font-body);overflow-x:clip}
/* Bootstrap in the theme colours headings and .card text dark; the brand pages are dark, so reset both */
.gk-brand h1,.gk-brand h2,.gk-brand h3{color:var(--cream)}
.gk-brand {--night: #070a17;
  --ink: #0d1124;
  --ink-2: #151a33;
  --panel: rgba(21, 24, 45, 0.78);
  --panel-solid: #161a31;
  --line: rgba(240, 196, 130, 0.24);
  --line-strong: rgba(240, 196, 130, 0.5);
  --gold: #f0b46a;
  --gold-2: #ffd48a;
  --amber: #c4683a;
  --plum: #5a2f3c;
  --cream: #f4ece0;
  --muted: #bdb3a6;
  --teal: #7fd8c9;
  --violet: #b9a6ff;
  --focus: #ffd48a;
  --radius: 14px;
  --gutter: 16px;
  --maxw: 1160px;
  --font-display: "Cinzel", "Times New Roman", serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "Cascadia Code", Consolas, monospace;
  color-scheme: dark;}
.gk-brand * {box-sizing: border-box;}
html .gk-brand {-webkit-text-size-adjust: 100%; scroll-behavior: smooth;}
@media (prefers-reduced-motion: reduce){
html .gk-brand {scroll-behavior: auto;}
.gk-brand *, .gk-brand *::before, .gk-brand *::after {animation: none !important; transition: none !important;}
}
.gk-brand {margin: 0; background: var(--night); color: var(--cream);
  font: 400 1rem/1.65 var(--font-body);
  overflow-x: hidden;
  padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right);}
.gk-brand img, .gk-brand video, .gk-brand canvas {display: block; max-width: 100%;}
.gk-brand a {color: var(--gold-2); text-underline-offset: 3px;}
.gk-brand a:hover {color: #fff1d0;}
.gk-brand :focus-visible {outline: 3px solid var(--focus); outline-offset: 3px; border-radius: 6px;}
.gk-brand .wrap {width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gutter);}
.gk-brand h1, .gk-brand h2, .gk-brand h3 {font-family: var(--font-display); font-weight: 600; letter-spacing: 0.02em; line-height: 1.15; margin: 0 0 0.5em;}
.gk-brand h1 {font-size: clamp(2.05rem, 7.6vw, 3.9rem);}
.gk-brand h2 {font-size: clamp(1.55rem, 5.2vw, 2.45rem);}
.gk-brand h3 {font-size: 1.12rem; letter-spacing: 0.03em;}
.gk-brand p {margin: 0 0 1em;}
.gk-brand .eyebrow {font: 600 0.78rem/1.3 var(--font-body); letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold); margin: 0 0 12px;}
.gk-brand .lede {font-size: 1.12rem; line-height: 1.65; color: var(--cream); max-width: 40em;}
.gk-brand .muted {color: var(--muted);}
.gk-brand .mono {font-family: var(--font-mono); font-size: 0.9em;}
.gk-brand .btns {display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px;}
.gk-brand .btn {display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 20px; border-radius: 999px; font-weight: 600; font-size: 1rem; text-decoration: none; border: 1px solid var(--line-strong); color: var(--cream); background: rgba(13, 17, 36, 0.6); cursor: pointer;}
.gk-brand .btn:hover {border-color: var(--gold-2); color: #fff;}
.gk-brand .btn-primary {background: linear-gradient(180deg, #ffd48a, #f0a45a); color: #1d1206; border-color: transparent;}
.gk-brand .btn-primary:hover {color: #000; filter: brightness(1.06);}
.gk-brand .section {padding: 64px 0; position: relative;}
.gk-brand .section + .section {border-top: 1px solid rgba(240, 196, 130, 0.1);}
.gk-brand .section-head {max-width: 46em; margin-bottom: 26px;}
.gk-brand .bg-deep {background: linear-gradient(180deg, var(--night), var(--ink) 30%, var(--ink) 70%, var(--night));}
.gk-brand .grid {display: grid; gap: 16px; grid-template-columns: 1fr;}
@media (min-width: 640px){
.gk-brand .grid-2 {grid-template-columns: 1fr 1fr;}
.gk-brand .grid-3 {grid-template-columns: 1fr 1fr;}
}
@media (min-width: 980px){
.gk-brand .grid-3 {grid-template-columns: 1fr 1fr 1fr;}
}
.gk-brand .card {color: var(--cream); background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; min-width: 0;}
.gk-brand .card .media {position: relative; aspect-ratio: 16 / 9; background: #0b0e1d; overflow: hidden;}
.gk-brand .card .media.tall {aspect-ratio: 4 / 5;}
.gk-brand .card .media img, .gk-brand .card .media video {width: 100%; height: 100%; object-fit: cover;}
.gk-brand img[width][height] {height: auto;}
.gk-brand .card .media.contain img, .gk-brand .card .media.contain video {object-fit: contain;}
.gk-brand .card .body {padding: 16px 16px 18px; display: flex; flex-direction: column; gap: 8px; flex: 1;}
.gk-brand .card h3 {margin: 0;}
.gk-brand .card p {margin: 0; color: var(--muted);}
.gk-brand .card .meta {display: flex; flex-wrap: wrap; gap: 6px; align-items: center;}
.gk-brand .card .links {display: flex; flex-wrap: wrap; gap: 14px; margin-top: auto; padding-top: 6px;}
.gk-brand .card .links a {font-weight: 600; min-height: 44px; display: inline-flex; align-items: center;}
.gk-brand .chip {display: inline-flex; align-items: center; gap: 6px; font: 600 0.72rem/1 var(--font-body); letter-spacing: 0.08em; text-transform: uppercase; padding: 6px 9px; border-radius: 999px; border: 1px solid currentColor; white-space: nowrap;}
.gk-brand .chip::before {content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor;}
.gk-brand .chip.shipped {color: var(--teal);}
.gk-brand .chip.building {color: var(--gold-2);}
.gk-brand .chip.lab {color: var(--violet);}
.gk-brand .chip.teaser {color: #f2a7a0;}
.gk-brand .chip.private {color: var(--muted);}
.gk-brand .chip.running {color: var(--teal); background: rgba(127, 216, 201, 0.1);}
.gk-brand .chip.running::before {box-shadow: 0 0 0 0 rgba(127, 216, 201, 0.6); animation: pulse 2s infinite;}
@keyframes pulse{ 0% { box-shadow: 0 0 0 0 rgba(127, 216, 201, 0.6); } 70% { box-shadow: 0 0 0 8px rgba(127, 216, 201, 0); } 100% { box-shadow: 0 0 0 0 rgba(127, 216, 201, 0); } }
.gk-brand .tag {font: 500 0.78rem/1 var(--font-body); color: var(--muted); padding: 6px 8px; border-radius: 6px; background: rgba(255, 255, 255, 0.05); white-space: nowrap;}
.gk-brand .signup {background: linear-gradient(160deg, rgba(90, 47, 60, 0.55), rgba(21, 24, 45, 0.9) 55%); border: 1px solid var(--line-strong); border-radius: 18px; padding: 24px 18px;}
.gk-brand .signup h2 {margin-bottom: 0.3em;}
.gk-brand .signup form {display: flex; flex-direction: column; gap: 10px; margin-top: 16px;}
.gk-brand .signup label {font-weight: 600; font-size: 0.95rem;}
.gk-brand .signup input[type="email"] {width: 100%; min-height: 52px; padding: 12px 14px; font: inherit; font-size: 1.05rem; color: var(--cream); background: rgba(7, 10, 23, 0.8); border: 1px solid var(--line-strong); border-radius: 12px;}
.gk-brand .signup input::placeholder {color: #9d9384;}
.gk-brand .signup .fine {font-size: 0.85rem; color: var(--muted); margin: 4px 0 0;}
.gk-brand .signup .ok {color: var(--teal); font-weight: 600; min-height: 1.5em; margin: 0;}
@media (min-width: 640px){
.gk-brand .signup {padding: 34px;}
.gk-brand .signup .sbrow {display: flex; gap: 10px;}
.gk-brand .signup .sbrow input {flex: 1;}
}
.gk-brand .page-head {position: relative; padding: 56px 0 40px; overflow: hidden; background: linear-gradient(180deg, #080c1c 0%, #1d1a34 46%, #5a2f3c 78%, #c4683a 100%);}
.gk-brand .page-head::after {content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 38%; background: linear-gradient(180deg, transparent, var(--night)); pointer-events: none;}
.gk-brand .page-head .wrap {position: relative; z-index: 1;}
.gk-brand .page-head .rail {position: absolute; left: 50%; bottom: -2px; width: 4px; height: 62%; transform: translateX(-50%) perspective(300px) rotateX(58deg); transform-origin: bottom; background: linear-gradient(180deg, transparent, #ffd48a); box-shadow: 0 0 22px 4px rgba(255, 180, 90, 0.5); z-index: 0; opacity: 0.55;}
.gk-brand .page-head p.lede {color: #f7efe3;}
.gk-brand .visually-hidden {position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;}
.gk-brand .center {text-align: center;}
.gk-brand .stack > * + * {margin-top: 12px;}
.gk-brand .card .media.stat {display: flex; align-items: center; justify-content: center; background: radial-gradient(120% 90% at 50% 110%, rgba(196, 104, 58, 0.55), rgba(29, 26, 52, 0.9) 55%, #0b0e1d);}
.gk-brand .card .media.stat span {font: 600 clamp(1.6rem, 7vw, 2.3rem)/1.1 var(--font-display); color: var(--gold-2); text-align: center; padding: 0 12px; text-shadow: 0 0 24px rgba(255, 190, 110, 0.45);}
.gk-brand .card[hidden] {display: none;}
.gk-brand .filters {margin-bottom: 20px;}
.gk-brand .frow {display: flex; gap: 8px; overflow-x: auto; padding: 4px 2px 10px; scrollbar-width: thin; -webkit-overflow-scrolling: touch;}
.gk-brand .fbtn {flex: none; min-height: 44px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line); background: rgba(13, 17, 36, 0.7); color: var(--cream); font: 500 0.92rem/1 var(--font-body); cursor: pointer; white-space: nowrap;}
.gk-brand .fbtn[aria-pressed="true"] {background: var(--gold-2); color: #1d1206; border-color: transparent; font-weight: 600;}
.gk-brand .fcount {margin: 4px 0 0; font-size: 0.9rem;}
.gk-brand .strip {display: grid; gap: 16px; grid-template-columns: 1fr;}
@media (min-width: 640px){
.gk-brand .strip {grid-template-columns: 1fr 1fr;}
}
@media (min-width: 980px){
.gk-brand .strip {grid-template-columns: repeat(3, 1fr);}
}
.gk-brand h2.h3 {font-size: 1.15rem; letter-spacing: 0.03em; margin: 0;}
.gk-brand .credit {display: block; font-size: 0.78rem; color: var(--muted); margin-top: 2px;}
.gk-brand .hero-track {position: relative; height: 720vh; background: var(--night);}
.gk-brand .stage {position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden;}
.gk-brand .stage .poster, .gk-brand .stage .poster img, .gk-brand #hero-canvas {position: absolute; inset: 0; width: 100%; height: 100%;}
.gk-brand .stage .poster img {object-fit: cover;}
.gk-brand #hero-canvas {opacity: 0; transition: opacity 0.6s ease;}
.gk-brand .stage.ready #hero-canvas {opacity: 1;}
.gk-brand .stage::after {content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(7, 10, 23, 0) 45%, rgba(7, 10, 23, 0.55) 78%, rgba(7, 10, 23, 0.85) 100%);}
.gk-brand .caps {position: absolute; inset: 0; z-index: 2; pointer-events: none;}
.gk-brand .cap {position: absolute; left: var(--gutter); right: var(--gutter); bottom: calc(26px + env(safe-area-inset-bottom)); padding: 18px 18px 20px; border-radius: var(--radius);
  background: rgba(10, 12, 26, 0.74); border: 1px solid var(--line); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  opacity: 0; transform: translateY(14px); transition: opacity 0.45s ease, transform 0.45s ease;}
.gk-brand .cap.on {opacity: 1; transform: none; pointer-events: auto;}
.gk-brand .cap h2 {font-size: clamp(1.35rem, 5.4vw, 2rem); margin-bottom: 0.35em;}
.gk-brand .cap p:last-child {margin-bottom: 0;}
.gk-brand .cap p {font-size: 1.04rem;}
.gk-brand .cap.intro {background: rgba(10, 12, 26, 0.62);}
@media (max-width: 820px){
.gk-brand .cap.intro {top: 14px; bottom: auto; padding: 16px 16px 18px;}
.gk-brand .cap.intro h1 {font-size: clamp(1.85rem, 8vw, 2.4rem);}
.gk-brand .cap.intro .lede {font-size: 1.04rem; margin-bottom: 0;}
.gk-brand .cap.intro .btns {margin-top: 14px;}
.gk-brand .cap.intro .btn {min-height: 46px; padding: 10px 18px;}
}
.gk-brand .cap.intro h1 {font-size: clamp(2rem, 8.4vw, 3.9rem); margin-bottom: 0.3em;}
.gk-brand .cap.intro .lede {font-size: 1.08rem;}
.gk-brand .scroll-hint {margin: 14px 0 0; font-size: 0.85rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold);}
.gk-brand .scroll-hint::after {content: ""; display: inline-block; width: 8px; height: 8px; margin-left: 10px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-3px);}
.gk-brand .dots {position: absolute; z-index: 3; right: 10px; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; gap: 9px;}
.gk-brand .dots i {width: 7px; height: 7px; border-radius: 50%; background: rgba(244, 236, 224, 0.3);}
.gk-brand .dots i.on {background: var(--gold-2); box-shadow: 0 0 10px var(--gold);}
@media (min-width: 821px){
.gk-brand .cap {left: max(32px, calc((100vw - var(--maxw)) / 2 + 16px)); right: auto; width: min(560px, 46vw); bottom: auto; top: 50%; transform: translateY(calc(-50% + 14px)); padding: 26px 28px;}
.gk-brand .cap.on {transform: translateY(-50%);}
.gk-brand .cap.intro {width: min(640px, 52vw);}
.gk-brand .dots {right: 26px;}
}
html.static .gk-brand .hero-track {height: auto;}
html.static .gk-brand .stage {position: relative; height: auto; overflow: visible;}
html.static .gk-brand .stage::after, html.static .gk-brand #hero-canvas, html.static .gk-brand .dots, html.static .gk-brand .scroll-hint {display: none;}
html.static .gk-brand .stage .poster {position: relative; display: block; height: 52vh; min-height: 260px;}
html.static .gk-brand .stage .poster img {position: absolute; inset: 0;}
html.static .gk-brand .caps {position: relative; inset: auto; padding: 0 var(--gutter) 40px; max-width: var(--maxw); margin: -80px auto 0; display: grid; gap: 14px;}
html.static .gk-brand .cap {position: relative; inset: auto; width: auto; opacity: 1; transform: none; pointer-events: auto;}
@media (min-width: 821px){
html.static .gk-brand .caps {grid-template-columns: 1fr 1fr;}
html.static .gk-brand .cap.intro {grid-column: 1 / -1;}
}
.gk-brand .bts {display: grid; gap: 16px; grid-template-columns: 1fr;}
.gk-brand .bts-item {margin: 0; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; min-width: 0;}
.gk-brand .bts-item video, .gk-brand .bts-item img {width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: #0b0e1d;}
.gk-brand .bts-item figcaption {padding: 12px 14px 14px; color: var(--muted); font-size: 0.98rem; display: flex; flex-direction: column; gap: 8px; align-items: flex-start;}
@media (min-width: 700px){
.gk-brand .bts {grid-template-columns: 1fr 1fr;}
.gk-brand .bts-item.wide {grid-column: 1 / -1;}
.gk-brand .bts-item.wide video {aspect-ratio: 21 / 9;}
}
@media (min-width: 1000px){
.gk-brand .bts {grid-template-columns: repeat(4, 1fr);}
.gk-brand .bts-item.wide {grid-column: span 2; grid-row: span 2; display: flex; flex-direction: column;}
.gk-brand .bts-item.wide video {aspect-ratio: auto; flex: 1 1 0; min-height: 300px; height: auto;}
.gk-brand .bts-item.wide figcaption {flex: none;}
}
.gk-brand .breadth {list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; grid-template-columns: 1fr;}
.gk-brand .breadth li {display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; align-items: center; padding: 14px 16px; border-radius: 12px; background: var(--panel); border: 1px solid var(--line);}
.gk-brand .breadth .f {font: 600 0.98rem/1.3 var(--font-display); color: var(--gold-2); letter-spacing: 0.03em; grid-column: 1;}
.gk-brand .breadth .p {grid-column: 1; color: var(--cream); font-size: 0.98rem;}
.gk-brand .breadth a {grid-column: 2; grid-row: 1 / span 2; font-weight: 600; min-height: 44px; display: inline-flex; align-items: center; white-space: nowrap;}
@media (min-width: 760px){
.gk-brand .breadth {grid-template-columns: 1fr 1fr;}
}
.gk-brand .also {display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; margin-top: 18px;}
.gk-brand .also p {margin: 0;}
.gk-brand .also ul {list-style: none; display: flex; flex-wrap: wrap; gap: 0 18px; margin: 0; padding: 0;}
.gk-brand .also a {display: inline-block; min-height: 44px; line-height: 44px; font-weight: 600;}
.gk-brand .cap {visibility: hidden; transition: opacity 0.45s ease, transform 0.45s ease, visibility 0s linear 0.45s;}
.gk-brand .cap.on {visibility: visible; transition-delay: 0s;}
.gk-brand .cap .cap-link {margin-top: 12px; min-height: 44px; padding: 10px 16px; font-size: 0.95rem;}
.gk-brand .hero-chip {position: absolute; left: 0; top: 0; z-index: 3; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 16px; border-radius: 999px;
  background: rgba(255, 212, 138, 0.95); color: #1d1206; font-weight: 600; font-size: 0.95rem; text-decoration: none; white-space: nowrap; box-shadow: 0 6px 24px rgba(0, 0, 0, 0.45), 0 0 18px rgba(255, 190, 110, 0.5);
  transform: translate(-50%, -100%); will-change: transform;}
.gk-brand .hero-chip::after {content: ""; width: 8px; height: 8px; border-right: 2px solid currentColor; border-top: 2px solid currentColor; transform: rotate(45deg);}
.gk-brand .hero-chip:hover {color: #000; background: #ffe1a8;}
.gk-brand .hero-chip[hidden] {display: none;}
.gk-brand #hero-canvas.pickable {cursor: pointer;}
html.static .gk-brand .cap {visibility: visible;}
html.static .gk-brand .hero-chip {display: none;}
.gk-brand .field-links {padding-top: 22px; padding-bottom: 6px;}
.gk-brand .field-links .eyebrow {margin-bottom: 8px;}
.gk-brand .field-links ul {list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px;}
.gk-brand .field-links a {display: inline-flex; align-items: center; min-height: 44px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line-strong); color: var(--cream); text-decoration: none; font-weight: 500; background: rgba(13, 17, 36, 0.7);}
.gk-brand .field-links a:hover {border-color: var(--gold-2);}
.gk-brand .interest {margin-top: 16px; max-width: 640px; border-style: dashed;}
.gk-brand.gk-page-ledger .ledger {position: relative; list-style: none; margin: 0; padding: 0 0 0 30px;}
.gk-brand.gk-page-ledger .ledger::before {content: ""; position: absolute; left: 9px; top: 6px; bottom: 6px; width: 3px; border-radius: 3px; background: linear-gradient(180deg, #ffd48a, #c4683a 70%, rgba(196, 104, 58, 0.2)); box-shadow: 0 0 16px 2px rgba(255, 180, 90, 0.45);}
.gk-brand.gk-page-ledger .entry {position: relative; margin: 0 0 22px;}
.gk-brand.gk-page-ledger .entry::before {content: ""; position: absolute; left: -27px; top: 22px; width: 15px; height: 15px; border-radius: 50%; background: #070a17; border: 3px solid var(--gold-2); box-shadow: 0 0 12px rgba(255, 200, 120, 0.7);}
.gk-brand.gk-page-ledger .entry .when {font: 600 0.8rem/1.3 var(--font-body); letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold); margin: 0 0 8px; padding-top: 18px;}
.gk-brand.gk-page-ledger .entry .card .body p {color: var(--cream);}
.gk-brand.gk-page-ledger .entry .card .body p.what {color: var(--muted);}
.gk-brand.gk-page-ledger .games {display: flex; flex-wrap: wrap; gap: 6px 18px;}
.gk-brand.gk-page-ledger .games a {font-weight: 600; min-height: 44px; display: inline-flex; align-items: center;}
@media (min-width: 760px){
.gk-brand.gk-page-ledger .ledger {max-width: 900px; padding-left: 44px;}
.gk-brand.gk-page-ledger .ledger::before {left: 12px;}
.gk-brand.gk-page-ledger .entry::before {left: -40px;}
.gk-brand.gk-page-ledger .entry .card {flex-direction: row;}
.gk-brand.gk-page-ledger .entry .card .media {flex: 0 0 42%; aspect-ratio: auto; height: 240px;}
}
.gk-brand.gk-page-ledger .ask {text-align: left;}
.gk-brand.gk-page-portfolio .jump {display: flex; gap: 8px; overflow-x: auto; padding: 4px 2px 10px; margin-top: 18px;}
.gk-brand.gk-page-portfolio .jump a {flex: none; min-height: 44px; display: inline-flex; align-items: center; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line-strong); background: rgba(7, 10, 23, 0.55); color: var(--cream); text-decoration: none; font-weight: 500;}
.gk-brand.gk-page-portfolio .group-head {display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; margin-bottom: 18px;}
.gk-brand.gk-page-portfolio .group-head h2 {margin: 0;}
.gk-brand.gk-page-start {background: radial-gradient(130% 70% at 50% 0%, #1d1a34 0%, #0d1124 45%, var(--night) 80%);}
.gk-brand.gk-page-start .start {max-width: 520px; margin: 0 auto; padding: calc(28px + env(safe-area-inset-top)) var(--gutter) calc(32px + env(safe-area-inset-bottom));}
.gk-brand.gk-page-start .who {display: flex; align-items: center; gap: 14px; margin-bottom: 18px;}
.gk-brand.gk-page-start .mark {flex: none; width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; font: 600 1.35rem/1 var(--font-display); color: #1d1206; background: linear-gradient(160deg, #ffd48a, #c4683a); box-shadow: 0 0 24px rgba(255, 180, 90, 0.45);}
.gk-brand.gk-page-start .who h1 {font-size: 1.6rem; margin: 0;}
.gk-brand.gk-page-start .who p {margin: 2px 0 0; color: var(--gold); font-weight: 600; font-size: 0.9rem; letter-spacing: 0.06em;}
.gk-brand.gk-page-start .hook {font-size: 1.12rem; line-height: 1.6; margin: 0 0 18px;}
.gk-brand.gk-page-start .teaser {border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); margin: 0 0 18px; background: #0b0e1d;}
.gk-brand.gk-page-start .teaser video, .gk-brand.gk-page-start .teaser img {width: 100%; aspect-ratio: 16 / 9; object-fit: cover;}
.gk-brand.gk-page-start .teaser p {margin: 0; padding: 10px 14px 12px; color: var(--muted); font-size: 0.95rem;}
.gk-brand.gk-page-start .links {list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 10px;}
.gk-brand.gk-page-start .links a {display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 58px; padding: 14px 18px; border-radius: 14px; background: var(--panel); border: 1px solid var(--line); color: var(--cream); text-decoration: none; font-weight: 600; font-size: 1.04rem;}
.gk-brand.gk-page-start .links a span {color: var(--muted); font-weight: 400; font-size: 0.9rem; text-align: right;}
.gk-brand.gk-page-start .links a:hover {border-color: var(--gold-2);}
.gk-brand.gk-page-start .signup .sbrow {display: flex; flex-direction: column; gap: 10px;}
.gk-brand.gk-page-start .signup .btn {width: 100%;}
.gk-brand.gk-page-start .foot {margin-top: 26px; color: var(--muted); font-size: 0.85rem; text-align: center;}
/* the theme nav is fixed at 90px on desktop (1.1.4): keep the 3D stage below it. Check on staging. */
@media (min-width: 821px){.gk-brand .stage{top:var(--gk-nav,90px);height:calc(100vh - var(--gk-nav,90px))}}
/* the prototype body rule maps onto the wrapper; overflow hidden there would break the sticky 3D stage */
.gk-brand{overflow:visible;overflow-x:clip;margin:0;padding:0;width:100%;max-width:none}

/* 1.4.2 header gap fix. The theme sets body padding-top to --header-height (90px) for a fixed nav, but the name-led nav is about 56px tall,
   which left a white strip of about 34px under it on desktop. On the GK Brand templates the nav now sits in the page flow (sticky), so no padding is needed. */
body[class*="page-template-page-templatesgk-"]{padding-top:0 !important;--gk-nav:56px}
body[class*="page-template-page-templatesgk-"] nav.navbar.fixed-top{position:sticky;top:0}
