/* ============================================================
 * Work With Ted — v2 cinematic redesign
 * New hero · path portals · closing. Builds on src/site.css + work.css.
 * ============================================================ */

/* ---------- shared display ---------- */
/* keep anchor jumps clear of the fixed sticky header (≈104px) */
html { scroll-padding-top: 116px; }
#wk-coaching, #wk-brand, #wk-investors { scroll-margin-top: 116px; }
.wk2-textured {
  background: url("assets/heading-texture.jpg") center 38% / cover, var(--grad-bronze);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.wk2-grain {
  position: absolute; inset: 0; z-index: 6; pointer-events: none;
  opacity: 0.06; mix-blend-mode: overlay;
  background: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjAwIDIwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZmlsdGVyIGlkPSJuIj48ZmVUdXJidWxlbmNlIHR5cGU9ImZyYWN0YWxOb2lzZSIgYmFzZUZyZXF1ZW5jeT0iMC44IiBudW1PY3RhdmVzPSIzIiBzdGl0Y2hUaWxlcz0ic3RpdGNoIi8+PC9maWx0ZXI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsdGVyPSJ1cmwoI24pIi8+PC9zdmc+");
}

/* ============================================================
 *  HERO 2 — full-bleed cinematic
 * ============================================================ */
.wk2-hero {
  position: relative; overflow: hidden; min-height: 100svh;
  display: flex; flex-direction: column;
  background: #050301;
}
/* video pinned to the right, focused on its centre */
.wk2-hero__bg { position: absolute; inset: 0 0 0 auto; width: 80%; z-index: 0; will-change: transform; }
.wk2-hero__bg video { width: 100%; height: 100%; object-fit: cover; object-position: center center; display: block; }
.wk2-hero__aura {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(70% 70% at 66% 42%, rgba(122,72,30,0.4) 0%, rgba(90,52,25,0) 56%);
  mix-blend-mode: screen; opacity: 0.8;
}
/* fade on the left so the text stays readable, plus a soft bottom fade for the tab bar */
.wk2-hero__scrim {
  position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background:
    linear-gradient(90deg, #050301 0%, #050301 18%, rgba(5,3,1,0.9) 30%, rgba(5,3,1,0.45) 46%, rgba(5,3,1,0) 64%),
    linear-gradient(180deg, rgba(5,3,1,0.55) 0%, rgba(5,3,1,0) 20%, rgba(5,3,1,0) 70%, rgba(5,3,1,0.92) 92%, #050301 100%);
}
.wk2-hero .wk-dust { z-index: 3; }

/* reticles */
.wk2-ret { position: absolute; z-index: 4; width: clamp(26px, 2.4vw, 46px); height: clamp(26px, 2.4vw, 46px); border-color: rgba(255,234,202,0.55); pointer-events: none; }
.wk2-ret.tl { top: clamp(94px,11vh,150px); left: clamp(20px,3vw,56px); border-top: 2px solid; border-left: 2px solid; }
.wk2-ret.tr { top: clamp(94px,11vh,150px); right: clamp(20px,3vw,56px); border-top: 2px solid; border-right: 2px solid; }
.wk2-ret.bl { bottom: clamp(150px,18vh,220px); left: clamp(20px,3vw,56px); border-bottom: 2px solid; border-left: 2px solid; }
.wk2-ret.br { bottom: clamp(150px,18vh,220px); right: clamp(20px,3vw,56px); border-bottom: 2px solid; border-right: 2px solid; }

.wk2-hero__inner {
  position: relative; z-index: 5; flex: 1;
  display: flex; flex-direction: column; align-items: flex-start; justify-content: center; text-align: left;
  max-width: min(1000px, 82%);
  padding: clamp(140px,17vh,210px) clamp(24px,4vw,72px) clamp(40px,6vh,72px) clamp(28px,6vw,110px);
}
.wk2-eyebrow {
  font-family: var(--font-sans); font-weight: 600;
  font-size: clamp(11px, 1.05vw, 16px); letter-spacing: 0.42em; text-transform: uppercase;
  color: var(--c-cream); opacity: 0; transform: translateY(14px);
  animation: wk2Up 0.9s cubic-bezier(0.16,1,0.3,1) 0.15s forwards;
}
.wk2-eyebrow .sep { opacity: 0.55; margin: 0 0.5em; color: #E8C98A; }
.wk2-wordmark {
  font-family: var(--font-display); font-weight: 500;
  font-size: clamp(52px, 6.6vw, 116px); line-height: 0.9; letter-spacing: 0.005em;
  text-transform: uppercase; margin: clamp(16px,2.2vh,30px) 0 0; white-space: normal;
  opacity: 0; transform: translateY(26px) scale(0.98);
  animation: wk2Up 1s cubic-bezier(0.16,1,0.3,1) 0.28s forwards;
  filter: drop-shadow(0 18px 50px rgba(0,0,0,0.6));
}
.wk2-promise {
  font-family: var(--font-display); font-style: italic;
  font-size: clamp(20px, 2.4vw, 38px); line-height: 1.15; color: #FFEACA; margin: clamp(18px,2.4vh,30px) 0 0;
  text-shadow: 0 2px 18px rgba(0,0,0,0.75);
  opacity: 0; transform: translateY(18px);
  animation: wk2Up 0.95s cubic-bezier(0.16,1,0.3,1) 0.42s forwards;
}
.wk2-lede {
  font-family: var(--font-body); font-weight: 300;
  font-size: clamp(15px, 1.25vw, 20px); line-height: 1.6; color: rgba(255,243,226,0.84);
  max-width: 680px; margin: clamp(16px,2vh,24px) 0 0; text-wrap: pretty;
  opacity: 0; transform: translateY(16px);
  animation: wk2Up 0.95s cubic-bezier(0.16,1,0.3,1) 0.54s forwards;
}
@keyframes wk2Up { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .wk2-eyebrow, .wk2-wordmark, .wk2-promise, .wk2-lede { animation: none; opacity: 1; transform: none; }
}

/* stats */
.wk2-proofhead {
  font-family: var(--font-sans); font-weight: 500;
  font-size: clamp(11px, 0.92vw, 14px); letter-spacing: 0.18em; text-transform: uppercase;
  color: rgba(255,234,202,0.78); text-align: left; line-height: 1.5;
  margin: clamp(30px,4.4vh,52px) 0 0; max-width: 42ch;
  opacity: 0; transform: translateY(16px);
  animation: wk2Up 1s cubic-bezier(0.16,1,0.3,1) 0.6s forwards;
}
@media (prefers-reduced-motion: reduce) { .wk2-proofhead { animation: none; opacity: 1; transform: none; } }
.wk2-stats {
  display: flex; flex-wrap: nowrap; align-items: flex-start; justify-content: flex-start;
  gap: clamp(18px, 2.4vw, 40px); margin: clamp(20px,2.6vh,30px) 0 0;
  opacity: 0; transform: translateY(16px);
  animation: wk2Up 1s cubic-bezier(0.16,1,0.3,1) 0.66s forwards;
}
.wk2-stat { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-width: 0; flex: 1 1 0; }
.wk2-stat__num {
  font-family: var(--font-body); font-weight: 200; font-size: clamp(34px, 3.6vw, 64px); line-height: 0.9;
  background: var(--grad-bronze); -webkit-background-clip: text; background-clip: text; color: transparent;
  letter-spacing: -0.01em; white-space: nowrap;
}
.wk2-stat__lbl {
  font-family: var(--font-sans); font-weight: 600; font-size: clamp(10px, 0.78vw, 12.5px);
  letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,234,202,0.74); text-align: left;
}
/* scroll cue centered to the page */
.wk2-hero .wk2-cue { align-self: center; align-items: center; margin-left: auto; margin-right: auto; }
/* stacked layout: video becomes a full-bleed backdrop, text overlaid left */
@media (max-width: 860px) {
  .wk2-hero__bg { inset: 0; width: 100%; }
  .wk2-hero__scrim {
    background:
      linear-gradient(90deg, #050301 0%, rgba(5,3,1,0.7) 42%, rgba(5,3,1,0.25) 78%),
      linear-gradient(180deg, rgba(5,3,1,0.6) 0%, rgba(5,3,1,0.1) 30%, rgba(5,3,1,0.6) 72%, #050301 100%);
  }
  .wk2-hero__inner { max-width: 100%; padding-right: clamp(24px,6vw,110px); }
  .wk2-hero .wk2-cue { align-self: flex-start; }
}

/* scroll cue */
.wk2-cue {
  position: relative; z-index: 5;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  margin: clamp(20px,3vh,34px) auto clamp(28px,4vh,44px);
  font-family: var(--font-sans); font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase;
  color: rgba(255,234,202,0.6); cursor: pointer; background: none; border: 0;
  animation: wk2Bob 2.2s ease-in-out infinite;
}
.wk2-cue:hover { color: #FBE6B8; }
@keyframes wk2Bob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(6px); } }
@media (prefers-reduced-motion: reduce) { .wk2-cue { animation: none; } }

/* ============================================================
 *  PATH PORTALS — "Choose how you work with Ted"
 * ============================================================ */
.wk2-paths {
  position: relative; overflow: hidden;
  scroll-margin-top: 116px;
  padding: clamp(96px,14vh,180px) clamp(24px,6vw,120px) clamp(80px,11vh,150px);
  background:
    linear-gradient(180deg, rgba(8,5,3,0.86) 0%, rgba(8,5,3,0.72) 50%, rgba(5,3,1,0.9) 100%),
    url("assets/paths-leather-bg.jpg") center / cover no-repeat, #080503;
}
.wk2-paths__rings { position: absolute; left: 50%; top: clamp(40px,8vh,120px); transform: translateX(-50%); z-index: 0; width: min(1100px, 120vw); aspect-ratio: 1; pointer-events: none; opacity: 0.5; }
.wk2-paths__rings svg { width: 100%; height: 100%; display: block; }
.wk2-ring-rot { transform-origin: 250px 250px; animation: wk2Spin 80s linear infinite; }
.wk2-ring-rot--rev { animation: wk2Spin 110s linear infinite reverse; }
@keyframes wk2Spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .wk2-ring-rot, .wk2-ring-rot--rev { animation: none; } }

.wk2-paths__head { position: relative; z-index: 2; text-align: center; max-width: 880px; margin: 0 auto clamp(44px,6vh,76px); }
.wk2-paths__eyebrow { font-family: var(--font-sans); font-weight: 700; font-size: clamp(12px,0.95vw,15px); letter-spacing: 0.34em; text-transform: uppercase; background: var(--grad-bronze); -webkit-background-clip: text; background-clip: text; color: transparent; margin: 0; }
.wk2-paths__title { font-family: var(--font-display); font-size: clamp(36px,4.6vw,80px); line-height: 0.98; text-transform: uppercase; letter-spacing: 0.01em; margin: 16px 0 0; }
.wk2-paths__sub { font-family: var(--font-body); font-weight: 300; font-size: clamp(16px,1.3vw,21px); line-height: 1.6; color: rgba(255,243,226,0.78); margin: 20px auto 0; max-width: 640px; text-wrap: pretty; }

.wk2-portals { position: relative; z-index: 2; display: flex; gap: 10px; height: clamp(293px,41vh,427px); max-width: 1340px; margin: 0 auto; }
.wk2-portal {
  position: relative; flex: 1; overflow: hidden; cursor: pointer; isolation: isolate;
  border-radius: 12px; border: 1px solid rgba(247,219,160,0.16);
  transition: flex 0.7s cubic-bezier(0.16,1,0.3,1), box-shadow 0.6s ease, border-color 0.6s ease;
  box-shadow: 0 30px 70px -36px rgba(0,0,0,0.9);
}
.wk2-portals .wk2-portal:hover { border-color: rgba(251,230,184,0.5); box-shadow: 0 46px 90px -34px rgba(0,0,0,0.92), 0 0 60px -18px rgba(240,196,120,0.3); }
.wk2-portal__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); transition: transform 1.1s cubic-bezier(0.16,1,0.3,1); }
.wk2-portal:hover .wk2-portal__img { transform: scale(1.04); }
.wk2-portal__atmos { position: absolute; inset: 0; z-index: 1; transition: opacity 0.7s ease; opacity: 0.55; }
.wk2-portal--coaching .wk2-portal__atmos { background: radial-gradient(120% 90% at 50% 18%, rgba(120,74,30,0.55) 0%, rgba(20,12,5,0.92) 72%); }
.wk2-portal--brand .wk2-portal__atmos { background: radial-gradient(120% 90% at 50% 20%, rgba(58,86,104,0.5) 0%, rgba(8,12,16,0.92) 72%); }
.wk2-portal--invest .wk2-portal__atmos { background: radial-gradient(120% 90% at 50% 20%, rgba(74,52,96,0.52) 0%, rgba(12,8,20,0.92) 72%); }
.wk2-portal:hover .wk2-portal__atmos { opacity: 0.2; }
.wk2-portal__scrim {
  position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: linear-gradient(180deg, rgba(5,3,2,0.32) 0%, rgba(5,3,2,0) 30%, rgba(5,3,2,0.55) 62%, rgba(5,3,2,0.92) 100%);
  transition: background 0.6s ease;
}
.wk2-portal:hover .wk2-portal__scrim { background: linear-gradient(180deg, rgba(5,3,2,0.24) 0%, rgba(5,3,2,0) 34%, rgba(5,3,2,0.5) 62%, rgba(5,3,2,0.94) 100%); }

.wk2-portal__num {
  position: absolute; top: 26px; left: 28px; z-index: 4;
  font-family: var(--font-display); font-size: 20px; letter-spacing: 0.1em; color: rgba(247,219,160,0.62);
}
.wk2-portal__glyph {
  position: absolute; top: 22px; right: 24px; z-index: 4; width: 42px; height: 42px;
  color: #E8C98A; opacity: 0.9; transition: opacity 0.5s ease, transform 0.5s ease;
}
.wk2-portal:hover .wk2-portal__glyph { opacity: 1; transform: rotate(8deg) scale(1.06); }

/* content pinned from a fixed top so labels align across all three */
.wk2-portal__content {
  position: absolute; left: 0; right: 0; top: 34%; bottom: 0; z-index: 4;
  padding: 0 clamp(20px,1.8vw,32px) clamp(26px,3vh,40px);
  display: flex; flex-direction: column; justify-content: flex-start;
}
.wk2-portal__kicker { font-family: var(--font-sans); font-weight: 700; font-size: 12px; letter-spacing: 0.24em; text-transform: uppercase; color: #CBA14C; margin: 0 0 12px; white-space: nowrap; }
.wk2-portal__label { font-family: var(--font-display); font-size: clamp(24px,2vw,40px); line-height: 1.02; text-transform: uppercase; letter-spacing: 0.01em; margin: 0; color: #FBF3E4; text-shadow: 0 3px 14px rgba(0,0,0,0.7); }
.wk2-portal__copy {
  font-family: var(--font-body); font-weight: 300; font-size: 16px; line-height: 1.56; color: #E5D8C2; margin: 16px 0 0; max-width: 440px;
  text-shadow: 0 2px 10px rgba(0,0,0,0.7);
  opacity: 1;
}
.wk2-portal__cta {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 24px; align-self: flex-start;
  font-family: var(--font-sans); font-weight: 700; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase;
  color: #1A1206; background: var(--grad-bronze); border: 0; border-radius: 4px; padding: 13px 22px; cursor: pointer;
  opacity: 1; transition: box-shadow 0.3s ease;
}
.wk2-portal__cta svg { transition: transform 0.25s ease; }
.wk2-portal__cta:hover { box-shadow: 0 14px 30px -12px rgba(240,196,120,0.6); }
.wk2-portal__cta:hover svg { transform: translateX(4px); }
.wk2-portal:hover .wk2-portal__copy,
.wk2-portal:hover .wk2-portal__cta { opacity: 1; transform: none; }
/* affordance hint on condensed cards */
.wk2-portal__hint { display: none; }
.wk2-portal__hint span { font-family: var(--font-sans); font-weight: 700; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(245,237,227,0.8); text-shadow: 0 1px 6px rgba(0,0,0,0.7); }
.wk2-portal__hint i { width: 26px; height: 26px; border-radius: 50%; flex: 0 0 auto; border: 1px solid rgba(201,162,75,0.55); display: inline-flex; align-items: center; justify-content: center; color: #CBA14C; font-style: normal; font-size: 15px; line-height: 1; background: rgba(8,5,3,0.38); }
.wk2-portal:hover .wk2-portal__hint { opacity: 0; }

@media (max-width: 1000px) {
  .wk2-portals { flex-direction: column; height: auto; gap: 14px; }
  .wk2-portal { flex: none; height: 64vh; min-height: 420px; }
  .wk2-portals:hover .wk2-portal, .wk2-portals .wk2-portal:hover { flex: none; }
  .wk2-portal__content { top: auto; bottom: 0; justify-content: flex-end; }
  .wk2-portal__copy, .wk2-portal__cta { opacity: 1; transform: none; }
  .wk2-portal__hint { display: none; }
}

/* ============================================================
 *  CLOSING — cinematic parallax CTA
 * ============================================================ */
.wk2-close {
  position: relative; overflow: hidden; min-height: 104vh;
  display: flex; align-items: center; justify-content: center;
  background: #000;
}
.wk2-close__bg { position: absolute; inset: 0; width: 100%; z-index: 0; will-change: transform; }
.wk2-close__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 12% 28%; display: block; opacity: 0.92; transform: scaleX(-1); }
.wk2-close__aura { position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(60% 60% at 50% 42%, rgba(140,84,36,0.5) 0%, rgba(90,52,25,0) 60%); mix-blend-mode: screen; }
.wk2-close__scrim {
  position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(5,3,1,0.98) 0%, rgba(5,3,1,0.95) 30%, rgba(5,3,1,0.6) 44%, rgba(5,3,1,0.15) 56%, rgba(5,3,1,0) 66%),
    linear-gradient(180deg, #000 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 60%, #000 100%);
}
.wk2-close { justify-content: flex-start; }
.wk2-close__inner {
  position: relative; z-index: 4; text-align: left;
  width: 100%; max-width: min(1000px, 82%); margin-right: auto;
  padding: clamp(80px,12vh,160px) clamp(28px,6vw,110px);
}
.wk2-close__body { margin-left: 0; margin-right: 0; }
.wk2-close__cta { justify-content: flex-start; }
.wk2-close__divider { margin-left: 0; margin-right: 0; }
.wk2-close__eyebrow { font-family: var(--font-sans); font-weight: 700; font-size: clamp(12px,0.95vw,15px); letter-spacing: 0.34em; text-transform: uppercase; background: var(--grad-bronze); -webkit-background-clip: text; background-clip: text; color: transparent; margin: 0; }
.wk2-close__title { font-family: var(--font-display); font-size: clamp(44px,6.6vw,128px); line-height: 0.92; text-transform: uppercase; letter-spacing: 0.01em; margin: 20px 0 0; filter: drop-shadow(0 16px 44px rgba(0,0,0,0.6)); }
.wk2-close__sub { font-family: var(--font-display); font-style: italic; font-size: clamp(20px,2.2vw,34px); color: #FFEACA; margin: 24px 0 0; text-shadow: 0 2px 16px rgba(0,0,0,0.7); }
.wk2-close__body { font-family: var(--font-body); font-weight: 300; font-size: clamp(16px,1.25vw,20px); line-height: 1.62; color: rgba(255,243,226,0.84); max-width: 600px; margin: 22px auto 0; text-wrap: pretty; }
.wk2-close__cta { display: flex; flex-wrap: wrap; gap: 18px; justify-content: center; margin-top: clamp(34px,5vh,52px); }
.wk2-close__divider { display: flex; align-items: center; justify-content: center; gap: 22px; margin: clamp(44px,6vh,72px) auto 0; max-width: 520px; }
.wk2-close__divider .rule { flex: 1; height: 1px; background: linear-gradient(90deg, rgba(201,162,75,0) 0%, rgba(201,162,75,0.55) 50%, rgba(201,162,75,0) 100%); }
.wk2-close__disc { width: 52px; height: 52px; object-fit: contain; opacity: 0.9; filter: drop-shadow(0 0 16px rgba(240,196,120,0.4)); }

@media (max-width: 900px) {
  .wk2-close { min-height: 90vh; }
  .wk2-close__title { font-size: clamp(40px,11vw,72px); }
}

/* Invitation: keep body + CTAs left-aligned with the title (beats base auto/center) */
.wk2-close .wk2-close__body { max-width: 600px; margin: 22px 0 0; }
.wk2-close .wk2-close__cta { justify-content: flex-start; }
.wk2-close .wk2-close__divider { margin-left: 0; margin-right: 0; }