
/* ============ THEME TOKENS + BOOTSTRAP VARIABLE OVERRIDES ============ */
:root{
  --bg:#080808;
  --bg-2:#101010;
  --surface:#111111;
  --text:#f4f5fb;
  --text-mut:#8A8A8A;
  --text-faint:#8A8A8A;
  --red:#8b5cf6;
  --red-bright:#a78bfa;
  --border:#242438;
  --r:2px;
  --maxw:1280px;

  /* Bootstrap 5.3 CSS-variable API — theme the framework instead of fighting it */
  --bs-body-bg:var(--bg);
  --bs-body-color:var(--text-mut);
  --bs-body-font-family:'Inter',sans-serif;
  --bs-body-font-size:16px;
  --bs-body-line-height:1.7;
  --bs-heading-color:var(--text);
  --bs-link-color:var(--text);
  --bs-link-hover-color:var(--red-bright);
  --bs-link-decoration:none;
  --bs-border-color:var(--border);
  --bs-border-radius:var(--r);
  --bs-border-radius-lg:6px;
  --bs-primary:var(--red);
  --bs-primary-rgb:139,92,246;
  --bs-emphasis-color:var(--text);
  --bs-secondary-color:var(--text-mut);
}
body{ -webkit-font-smoothing:antialiased; position:relative; overflow-x:clip; }
html{ scroll-behavior:smooth; scroll-padding-top:84px; max-width:100%; overflow-x:clip; }
.page-body{ overflow-x:clip; max-width:100%; }
h1,h2,h3,h4{ font-family:'Space Grotesk',sans-serif; letter-spacing:-.01em; line-height:1.05; }
img,svg{ max-width:100%; }
:focus-visible{ outline:2px solid var(--red); outline-offset:3px; }
a{ color:inherit; }
.container{ max-width:100%; padding-inline:32px; }
@media (min-width:1200px){ .container{ max-width:var(--maxw); } }
@media (max-width:700px){ .container{ padding-inline:18px; } }
.section{ padding-block:110px; }
@media (max-width:700px){ .section{ padding-block:72px; } }

/* Bootstrap row gutters don't cover odd pixel hairline gaps — small reusable overrides */
.g-2px{ --bs-gutter-x:2px; --bs-gutter-y:2px; }

/* ============ EYEBROW (numbered section label) ============ */
.eyebrow{ display:flex; align-items:baseline; gap:10px; margin-bottom:26px; }
.eyebrow .num{ font-family:'Barlow Condensed',sans-serif; font-weight:600; color:var(--red); font-size:1.1rem; }
.eyebrow .lbl{ font-family:'Barlow Condensed',sans-serif; font-weight:600; text-transform:uppercase; letter-spacing:.16em; font-size:1.05rem; color:var(--text-mut); }
.eyebrow-line{ flex:1; height:1px; background:var(--border); margin-left:6px; transform-origin:left; transform:scaleX(0); transition:transform 1s cubic-bezier(.16,1,.3,1) .2s; }
.in-view .eyebrow-line{ transform:scaleX(1); }

/* ============ BUTTONS (Bootstrap .btn, themed via its variable API) ============ */
.btn{
  --bs-btn-padding-x:28px; --bs-btn-padding-y:15px; --bs-btn-border-radius:var(--r);
  --bs-btn-font-size:.78rem; --bs-btn-font-weight:600; --bs-btn-focus-box-shadow:none;
  display:inline-flex; align-items:center; gap:10px; text-transform:uppercase; letter-spacing:.1em;
}
.btn svg{ width:15px; height:15px; transition:transform .25s ease; }
.btn:hover svg{ transform:translateX(4px); }
.btn-primary{
  --bs-btn-color:var(--red); --bs-btn-bg:transparent; --bs-btn-border-color:var(--red);
  --bs-btn-hover-color:#080808; --bs-btn-hover-bg:var(--red); --bs-btn-hover-border-color:var(--red);
  --bs-btn-active-color:#080808; --bs-btn-active-bg:var(--red); --bs-btn-active-border-color:var(--red);
}
.btn-primary:hover{ box-shadow:0 0 26px rgba(139,92,246,.4); }
.btn-ghost{
  --bs-btn-color:var(--text); --bs-btn-bg:transparent; --bs-btn-border-color:var(--border);
  --bs-btn-hover-color:var(--red-bright); --bs-btn-hover-bg:transparent; --bs-btn-hover-border-color:var(--red-bright);
  --bs-btn-active-color:var(--red-bright); --bs-btn-active-bg:transparent; --bs-btn-active-border-color:var(--red-bright);
}

/* ============ TAGS / CHIPS ============ */
.tag{
  display:inline-block; padding:7px 14px; border:1px solid var(--border); border-radius:var(--r);
  font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--text-mut);
  transition:border-color .2s ease, color .2s ease;
}
.tag:hover{ border-color:var(--red); color:var(--red-bright); }

/* ============ GRAIN + GLOW PANEL (signature) ============ */
.glow-panel{ position:relative; overflow:hidden; background:#0c0c0c; border:1px solid var(--border); }
.glow-panel::before{
  content:""; position:absolute; inset:-15%;
  background:
    radial-gradient(circle at 75% 105%, rgba(139,92,246,.5), transparent 55%),
    radial-gradient(circle at 15% -5%, rgba(139,92,246,.14), transparent 50%);
  filter:blur(14px); animation:glowPulse 8s ease-in-out infinite;
}
.glow-panel::after{
  content:""; position:absolute; inset:0; opacity:.45; mix-blend-mode:overlay; pointer-events:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix type='matrix' values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.05 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  z-index:3;
}
.glow-panel.has-photo{ display:block; }
.glow-panel img{ position:relative; z-index:1; width:100%; height:100%; object-fit:cover; display:block; }
.glow-panel .photo-tint{
  position:absolute; inset:0; z-index:2; pointer-events:none; mix-blend-mode:screen;
  background:
    radial-gradient(circle at 82% 100%, rgba(139,92,246,.4), transparent 55%),
    radial-gradient(circle at 8% 0%, rgba(139,92,246,.12), transparent 45%);
}
.photo-slot{
  position:relative; z-index:1; height:100%; min-height:220px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px;
  color:rgba(242,242,242,.4); text-transform:uppercase; letter-spacing:.14em; font-size:.7rem; font-weight:600;
}
.photo-slot svg{ width:30px; height:30px; opacity:.55; }
@keyframes glowPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.7; } }

/* ============ HEADER ============ */
.site-header{
  position:sticky; top:0; z-index:50;
  background:linear-gradient(180deg, rgba(18,14,32,.82) 0%, rgba(10,9,18,.82) 100%);
  backdrop-filter:blur(14px) saturate(140%); -webkit-backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid rgba(139,92,246,.14); transition:background .3s ease, border-color .3s ease, box-shadow .3s ease;
  padding-top:env(safe-area-inset-top, 0px);
}
.site-header.scrolled{
  background:linear-gradient(180deg, rgba(18,14,32,.97) 0%, rgba(10,9,18,.97) 100%);
  border-color:rgba(139,92,246,.28);
  box-shadow:0 10px 30px -14px rgba(0,0,0,.6);
}
.site-header .container{ height:78px; }
.logo-mark{
  width:36px; height:36px; border:1px solid var(--red); border-radius:50%;
  overflow:hidden; flex-shrink:0; background:#0c0c0c;
}
.logo-mark img{ width:100%; height:100%; object-fit:cover; object-position:center 15%; display:block; }
.logo-word{ font-family:'Barlow Condensed',sans-serif; font-weight:600; letter-spacing:.14em; font-size:.85rem; color:var(--text); }
.nav-links-list{ display:flex; align-items:center; gap:1rem; list-style:none; margin:0; padding:0; }
.nav-links-list li{ position:relative; }
.site-header .nav-links a{
  text-decoration: none;
  position:relative; display:inline-block; padding:6px 2px;
  font-size:.7rem; text-transform:uppercase; font-weight:500;
  color:var(--text-mut); transition:color .2s ease;
}
@media (min-width:1150px){
  .site-header .nav-links a{ font-size:.96rem; }
}
.site-header .nav-links a::after{
  content:""; position:absolute; left:0; bottom:0; height:2px; width:0;
  background:currentColor; transition:width .25s ease;
}
.site-header .nav-links a:hover{ color:var(--red-bright); }
.site-header .nav-links a:hover::after{ width:100%; }
/* wp_nav_menu() markup: active item */
.nav-links-list > li > a.current-menu-item,
.nav-links-list > li.current_page_item > a,
.nav-links-list > li > a.current-menu-ancestor{ color:var(--red-bright); }
.nav-links-list > li > a.current-menu-item::after,
.nav-links-list > li.current_page_item > a::after,
.nav-links-list > li > a.current-menu-ancestor::after{ width:100%; }
/* drop-down submenus (2 levels) */
.nav-links-list .sub-menu{
  position:absolute; top:100%; left:0; z-index:61; display:none;
  flex-direction:column; align-items:stretch; gap:0; min-width:180px;
  list-style:none; margin:0; padding:6px 0;
  background:rgba(16,16,16,.92); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  border:1px solid var(--border); border-radius:var(--r);
  box-shadow:0 20px 44px -22px rgba(0,0,0,.75);
}
.nav-links-list .menu-item-has-children:hover > .sub-menu,
.nav-links-list .menu-item-has-children:focus-within > .sub-menu{ display:flex; }
.nav-links-list .sub-menu .sub-menu{ display:none; }
.nav-links-list .sub-menu a{ display:block; width:auto; padding:9px 16px; font-size:.72rem; white-space:nowrap; }
.nav-links-list .sub-menu a::after{ display:none; }
@media (min-width:1150px){ .nav-links-list .sub-menu a{ font-size:.82rem; } }
.socials{ gap:14px !important; }
.socials a{
  width:22px; height:22px; color:var(--text-mut); transition:color .2s ease, transform .2s ease;
}
.socials a:hover{ color:var(--red-bright); transform:translateY(-2px); }
.nav-toggle{
  display:none; position:relative; color:var(--text); width:40px; height:40px; align-items:center; justify-content:center;
  border:1px solid transparent; border-radius:var(--r); background:none; padding:0; cursor:pointer;
  transition:border-color .2s ease, color .2s ease;
}
.nav-toggle:hover{ border-color:var(--border); color:var(--red-bright); }
.nav-toggle-bar{
  position:absolute; width:18px; height:2px; border-radius:2px; background:currentColor;
  transition:transform .3s cubic-bezier(.4,0,.2,1), opacity .2s ease, background .2s ease;
}
.nav-toggle-bar:nth-child(1){ transform:translateY(-6px); }
.nav-toggle-bar:nth-child(2){ transform:translateY(0); }
.nav-toggle-bar:nth-child(3){ transform:translateY(6px); }
.nav-toggle.active .nav-toggle-bar:nth-child(1){ transform:translateY(0) rotate(45deg); }
.nav-toggle.active .nav-toggle-bar:nth-child(2){ opacity:0; transform:translateY(0) scaleX(0); }
.nav-toggle.active .nav-toggle-bar:nth-child(3){ transform:translateY(0) rotate(-45deg); }
.nav-backdrop{
  position:fixed; inset:0; z-index:59; background:rgba(8,8,8,.45);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  opacity:0; pointer-events:none; transition:opacity .35s ease;
}
.nav-backdrop.open{ opacity:1; pointer-events:auto; }
@media (max-width:992px){
  .nav-toggle{ display:flex; }
  .site-header .nav-links{
    position:fixed; top:0; right:-260px; left:auto; bottom:0; z-index:60;
    width:min(62vw, 250px); height:100%;
    background:rgba(16,16,16,.72); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
    border-left:1px solid var(--border);
    flex-direction:column !important; align-items:stretch !important; justify-content:flex-start !important; gap:0 !important;
    padding:calc(100px + env(safe-area-inset-top, 0px)) 6px 32px;
    opacity:1; pointer-events:none;
    transition:right .45s cubic-bezier(.4,0,.2,1);
    box-shadow:-24px 0 60px rgba(0,0,0,.4);
  }
  .site-header .nav-links.open{ right:0; pointer-events:auto; }
  .nav-close{
    position:absolute; top:calc(20px + env(safe-area-inset-top, 0px)); right:20px; width:34px; height:34px;
    display:flex; align-items:center; justify-content:center;
    color:var(--text-mut); border:1px solid var(--border); border-radius:50%;
    background:none; transition:color .2s ease, border-color .2s ease;
  }
  .nav-close:hover{ color:var(--red-bright); border-color:var(--red); }
  .nav-close svg{ width:16px; height:16px; }
  .nav-links-list{ display:flex; flex-direction:column; width:100%; gap:0; }
  .nav-links-list li{ width:100%; }
  .site-header .nav-links a{
    display:block; width:100%; font-size:.86rem; padding:14px 22px; border-bottom:1px solid var(--border);
    opacity:0; transform:translateX(24px); color:var(--text);
  }
  .site-header .nav-links a::after{ display:none; }
  .nav-links-list li:first-child a{ border-top:1px solid var(--border); }
  .site-header .nav-links.open .nav-links-list a{ animation:navLinkIn .45s ease forwards; }
  .site-header .nav-links.open .nav-links-list li:nth-child(1) a{ animation-delay:.08s; }
  .site-header .nav-links.open .nav-links-list li:nth-child(2) a{ animation-delay:.13s; }
  .site-header .nav-links.open .nav-links-list li:nth-child(3) a{ animation-delay:.18s; }
  .site-header .nav-links.open .nav-links-list li:nth-child(4) a{ animation-delay:.23s; }
  .site-header .nav-links.open .nav-links-list li:nth-child(5) a{ animation-delay:.28s; }
  .site-header .nav-links.open .nav-links-list li:nth-child(6) a{ animation-delay:.33s; }
  .site-header .nav-links.open .nav-links-list li:nth-child(7) a{ animation-delay:.38s; }
  .site-header .nav-links.open .nav-links-list li:nth-child(8) a{ animation-delay:.43s; }
  .site-header .nav-links.open .nav-links-list li:nth-child(9) a{ animation-delay:.46s; }
  .site-header .nav-links.open .nav-links-list li:nth-child(10) a{ animation-delay:.48s; }
  .site-header .nav-links.open .nav-links-list li:nth-child(n+11) a{ animation-delay:.5s; }
  /* submenus collapse into indented, always-visible rows inside the drawer */
  .nav-links-list .menu-item-has-children{ position:static; }
  .nav-links-list .sub-menu{
    position:static; display:flex; min-width:0; padding:0;
    background:none; border:0; border-radius:0; box-shadow:none;
    backdrop-filter:none; -webkit-backdrop-filter:none;
  }
  .nav-links-list .sub-menu a{ padding:12px 22px 12px 44px; font-size:.8rem; color:var(--text-mut); }
  .nav-links-list .sub-menu li:last-child > a{ border-bottom:1px solid var(--border); }
}
@keyframes navLinkIn{ to{ opacity:1; transform:translateX(0); } }
@media (prefers-reduced-motion: reduce){
  .site-header .nav-links, .nav-backdrop, .site-header .nav-links a{ transition:none !important; animation:none !important; opacity:1 !important; transform:none !important; }
}

/* ============ HERO ============ */
.hero{
  position:relative; overflow:hidden; min-height:92vh; padding-block:56px;
  --hero-bg-1:#0a0d1c; --hero-bg-2:#12152e;
  --hero-accent:#8b5cf6; --hero-accent-2:#6d5cf6;
  background:linear-gradient(160deg, var(--hero-bg-1) 0%, var(--hero-bg-2) 55%, var(--hero-bg-1) 100%);
}
.hero-bg{
  position:absolute; top:-12%; left:0; right:0; height:112%; z-index:0; will-change:transform;
  background-repeat:no-repeat; background-position:right top; background-size:auto 185%;
  filter:grayscale(1) contrast(1.06) brightness(.92);
  mask-image:linear-gradient(90deg, transparent 0%, transparent 32%, black 54%);
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, transparent 32%, black 54%);
}
@media (max-width:1050px){
  .hero-bg{ background-size:cover; background-position:center 18%; mask-image:none; -webkit-mask-image:none; }
}
.hero::before{
  content:""; position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(100deg, rgba(10,13,28,.97) 0%, rgba(10,13,28,.88) 30%, rgba(10,13,28,.4) 58%, rgba(10,13,28,.18) 100%),
    linear-gradient(0deg, rgba(10,13,28,.55) 0%, rgba(10,13,28,0) 24%, rgba(10,13,28,0) 74%, rgba(10,13,28,.92) 100%),
    radial-gradient(circle at 90% 12%, rgba(139,92,246,.24), transparent 45%);
}
.hero::after{
  content:""; position:absolute; inset:0; z-index:2; opacity:.2; mix-blend-mode:overlay; pointer-events:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix type='matrix' values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.05 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}
.hero-wrap{ position:relative; z-index:3; width:100%; min-height:calc(92vh - 112px); }
.hero-copy{ max-width:600px; }
.hero-kicker{
  display:inline-flex; align-items:center; gap:9px;
  background:rgba(139,92,246,.16); border:1px solid rgba(139,92,246,.45);
  color:#f7f6ff; padding:8px 18px 8px 14px; border-radius:999px;
  letter-spacing:.08em; font-size:.7rem; font-weight:700; text-transform:uppercase; width:fit-content;
  box-shadow:0 4px 18px rgba(139,92,246,.18);
}
.hero-kicker .bar{
  width:6px; height:6px; border-radius:50%; background:var(--hero-accent);
  box-shadow:0 0 8px 1px rgba(139,92,246,.9);
}
.hero-role{ font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:#8992b8; }
.hero-copy h1{ font-size:clamp(2.6rem,5.4vw,4.1rem); text-transform:uppercase; font-weight:700; color:#f4f5fb; }
.hero-copy h1 span{ display:block; }
.hero-copy h1 span:nth-child(2), .hero-copy h1 .accent{
  background:linear-gradient(90deg, #f4f5fb 0%, var(--hero-accent) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-desc{ max-width:38ch; color:#9aa3c7; }
.hero .btn-primary{
  --bs-btn-color:#fff; --bs-btn-bg:linear-gradient(135deg, var(--hero-accent), var(--hero-accent-2));
  --bs-btn-border-color:transparent; --bs-btn-border-radius:999px;
  background:linear-gradient(135deg, var(--hero-accent), var(--hero-accent-2));
  border-color:transparent; color:#fff; box-shadow:0 10px 30px rgba(139,92,246,.35);
}
.hero .btn-primary:hover{ background:linear-gradient(135deg, var(--hero-accent-2), var(--hero-accent)); color:#fff; box-shadow:0 12px 36px rgba(139,92,246,.5); }
.hero .btn-ghost{ --bs-btn-border-radius:999px; border-color:rgba(255,255,255,.25); color:#f4f5fb; }
.hero .btn-ghost:hover{ border-color:#fff; color:#fff; }
.hero-stats{ border-top:1px solid rgba(255,255,255,.12); padding-top:28px; }
.stat-num{ font-family:'Space Grotesk',sans-serif; font-weight:700; color:var(--hero-accent); font-size:1.7rem; line-height:1; }
.stat-label{ font-family:'Barlow Condensed',sans-serif; font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; color:#8992b8; margin-top:6px; max-width:14ch; }
@media (max-width:1050px){ .hero{ min-height:100vh; padding-block:110px 40px; } .hero-wrap{ min-height:auto; } }
.hero-copy > *{ animation:heroIn .8s ease both; }
.hero-copy > *:nth-child(2){ animation-delay:.06s; }
.hero-copy > *:nth-child(3){ animation-delay:.12s; }
.hero-copy > *:nth-child(4){ animation-delay:.18s; }
.hero-copy > *:nth-child(5){ animation-delay:.24s; }
.hero-copy > *:nth-child(6){ animation-delay:.3s; }
@keyframes heroIn{ from{opacity:0; transform:translateY(16px);} to{opacity:1; transform:translateY(0);} }
.hero-stats > div{ opacity:0; animation:heroIn .8s ease both; }
.hero-stats > div:nth-child(1){ animation-delay:.42s; }
.hero-stats > div:nth-child(2){ animation-delay:.48s; }
.hero-stats > div:nth-child(3){ animation-delay:.54s; }

/* ============ ABOUT (01) ============ */
.about-section{
  background:linear-gradient(160deg, #0a0d1c 0%, #12152e 55%, #0a0d1c 100%);
  border-block:1px solid rgba(139,92,246,.18);
}
.about-photo{ min-height:440px; border-radius:14px; overflow:hidden; border:1px solid rgba(139,92,246,.25); position:relative; }
.about-photo img{ object-fit:cover; object-position:top center; width:100%; height:100%; filter:saturate(1.1) contrast(1.03); }
.about-photo::before{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(160deg, transparent 55%, rgba(10,13,28,.55) 100%),
    radial-gradient(120% 70% at 50% 100%, transparent 55%, rgba(10,13,28,.6) 100%);
}
.about-photo::after{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(135deg, rgba(109,92,246,.12), rgba(10,13,28,.12));
  mix-blend-mode:color;
}
.about-kicker{
  display:inline-flex; align-items:center; gap:9px;
  background:rgba(139,92,246,.16); border:1px solid rgba(139,92,246,.45);
  color:#8b5cf6; padding:8px 18px 8px 14px; border-radius:999px;
  letter-spacing:.08em; font-size:.7rem; font-weight:700; text-transform:uppercase;
  width:fit-content; box-shadow:0 4px 18px rgba(139,92,246,.18);
}
.about-kicker .bar{ width:6px; height:6px; border-radius:50%; background:#8b5cf6; box-shadow:0 0 8px 1px rgba(139,92,246,.9); }
.about-text h2{ font-size:clamp(1.5rem,2.6vw,2.1rem); text-transform:none; color:#f4f5fb; }
.about-text p{ color:#9aa3c7; }
.about-info-grid{ border-top:1px solid rgba(255,255,255,.12); }
.about-info-item .label{ font-family:'Barlow Condensed',sans-serif; font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; color:#8992b8; }
.about-info-item .value{ font-family:'Space Grotesk',sans-serif; font-size:.9rem; color:#f4f5fb; }
.about-text .btn-primary{
  --bs-btn-color:#fff; --bs-btn-border-color:transparent; --bs-btn-border-radius:999px;
  background:linear-gradient(135deg, #8b5cf6, #6d5cf6); border-color:transparent; color:#fff;
  box-shadow:0 10px 30px rgba(139,92,246,.35);
}
.about-text .btn-primary:hover{ background:linear-gradient(135deg, #6d5cf6, #8b5cf6); color:#fff; box-shadow:0 12px 36px rgba(139,92,246,.5); }

/* ============ WHAT I DO (02) ============ */
.whatido-section{
  background:linear-gradient(160deg, #0a0d1c 0%, #12152e 55%, #0a0d1c 100%);
  border-block:1px solid rgba(139,92,246,.18);
}
.whatido-kicker{
  display:inline-flex; align-items:center; gap:9px;
  background:rgba(139,92,246,.16); border:1px solid rgba(139,92,246,.45);
  color:#8b5cf6; padding:8px 18px 8px 14px; border-radius:999px;
  letter-spacing:.08em; font-size:.7rem; font-weight:700; text-transform:uppercase;
  width:fit-content; margin-bottom:20px; box-shadow:0 4px 18px rgba(139,92,246,.18);
}
.whatido-kicker .bar{ width:6px; height:6px; border-radius:50%; background:#8b5cf6; box-shadow:0 0 8px 1px rgba(139,92,246,.9); }
.whatido-heading{ font-size:clamp(1.8rem,3.4vw,2.6rem); text-transform:uppercase; color:#f4f5fb; line-height:1.1; }
.whatido-heading .accent{
  background:linear-gradient(90deg, #f4f5fb 0%, #8b5cf6 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.capability-sub{ color:#9aa3c7; max-width:34ch; font-size:.98rem; }
.whatido-card{
  position:relative; height:100%; padding:28px 24px 52px; border-radius:14px;
  background:linear-gradient(160deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  border:1px solid rgba(139,92,246,.18); transition:border-color .25s ease, transform .25s ease, background .25s ease;
}
.whatido-card:hover{ border-color:rgba(139,92,246,.5); transform:translateY(-4px); background:linear-gradient(160deg, rgba(139,92,246,.1), rgba(255,255,255,.01)); }
.whatido-icon{
  width:44px; height:44px; border-radius:12px; margin-bottom:20px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(139,92,246,.28), rgba(109,92,246,.08));
  border:1px solid rgba(139,92,246,.35); color:#c4b5fd;
}
.whatido-icon svg{ width:20px; height:20px; }
.whatido-card h3{ font-size:1rem; text-transform:uppercase; letter-spacing:.03em; color:#f4f5fb; margin-bottom:10px; }
.whatido-card p{ font-size:.85rem; color:#9aa3c7; margin:0; }
.whatido-num{
  position:absolute; left:24px; bottom:20px; font-family:'Barlow Condensed',sans-serif;
  color:#6d5cf6; font-weight:600; font-size:.85rem; letter-spacing:.04em;
}

/* ============ PROJECT / DATA-ANALYTICS / DASHBOARD GRIDS ============ */
/* Hairline-divider grid: real CSS Grid, since Bootstrap's row/col gutter is
   padding-based (no visible gap for a background color to peek through). */
.divider-grid{ display:grid; gap:2px; background:var(--border); }
.divider-grid.cols-2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.divider-grid.cols-3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.divider-grid > *{ background:var(--bg); }
@media (max-width:900px){ .divider-grid.cols-3{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px){ .divider-grid.cols-2, .divider-grid.cols-3{ grid-template-columns:1fr; } }
.proj-preview{ aspect-ratio:16/9; border:1px solid var(--border); overflow:hidden; position:relative; }
.proj-preview img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease; filter:grayscale(.15) contrast(1.05); }
.project-card:hover .proj-preview img{ transform:scale(1.06); }
.project-card{ padding:28px; min-height:800px; display:flex; flex-direction:column; transition:background .3s ease, transform .3s ease; }
@media (max-width:1200px){ .project-card{ min-height:680px; } }
@media (max-width:992px){ .project-card{ min-height:560px; } }
@media (max-width:900px){ .project-card{ min-height:480px; } }
@media (max-width:600px){ .project-card{ min-height:auto; } }
.project-card .view-case{ margin-top:0; }
.project-card:hover{ background:var(--bg-2); transform:translateY(-6px); box-shadow:0 20px 50px rgba(0,0,0,.5); }
.proj-num{ font-family:'Barlow Condensed',sans-serif; color:var(--text-faint); font-size:.8rem; letter-spacing:.1em; text-transform:uppercase; margin:18px 0 6px; }
.project-card h3{ font-size:1.15rem; text-transform:uppercase; transition:transform .3s ease, color .3s ease; }
.project-card:hover h3{ transform:translateX(8px); }
.project-card p{ font-size:.88rem; color:var(--text-mut); margin:12px 0 18px; }
.project-card:hover .proj-tags .tag{ border-color:rgba(139,92,246,.4); }
.view-case{ display:inline-flex; align-items:center; gap:8px; font-size:.76rem; font-weight:600; text-transform:uppercase; letter-spacing:.1em; color:var(--text); border-bottom:1px solid var(--border); padding-bottom:4px; transition:border-color .25s ease, color .25s ease; }
.view-case svg{ width:15px; height:15px; flex-shrink:0; transition:transform .25s ease; }
.view-case:hover svg{ transform:translateX(4px); }
.view-case:hover{ color:var(--red-bright); border-color:var(--red-bright); }

.da-lead{ color:var(--text-mut); max-width:64ch; }
.da-featured{ border:1px solid var(--border); background:#0c0c0c; padding:40px; }
.da-featured-cat{ font-size:.78rem; color:var(--text-faint); text-transform:uppercase; letter-spacing:.06em; white-space:nowrap; }
.da-role-line{ font-size:.78rem; color:var(--text-faint); text-transform:uppercase; letter-spacing:.06em; margin-top:4px; }
.da-badge{ font-size:.68rem; padding:6px 13px; border:1px solid var(--border); border-radius:20px; color:var(--text-mut); text-transform:uppercase; letter-spacing:.06em; font-family:'Barlow Condensed',sans-serif; font-weight:600; }
.da-overview{ font-size:.94rem; color:var(--text-mut); max-width:74ch; }
.da-stats-row{ padding:22px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.da-stat b{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.4rem; color:var(--text); display:block; }
.da-stat span{ font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; color:var(--text-faint); }
.da-toggle{
  font-size:.76rem; font-weight:600; text-transform:uppercase; letter-spacing:.1em; color:var(--text);
  border:1px solid var(--border); padding:13px 24px; border-radius:var(--r); cursor:pointer;
  display:inline-flex; align-items:center; gap:10px; background:none; transition:all .25s ease;
}
.da-toggle:hover{ border-color:var(--red-bright); color:var(--red-bright); }
.da-toggle svg{ width:14px; height:14px; transition:transform .3s ease; }
.da-details{ max-height:0; overflow:hidden; opacity:0; transition:max-height .5s ease, opacity .4s ease, margin-top .4s ease; }
.da-featured.expanded .da-details{ max-height:20000px; opacity:1; margin-top:32px; }
.da-toggle-less{ display:none; }
.da-featured.expanded .da-toggle-more{ display:none; }
.da-featured.expanded .da-toggle-less{ display:inline; }
.da-featured.expanded .da-toggle svg{ transform:rotate(180deg); }
.da-analysis-card{ background:var(--bg); padding:26px; }
.da-analysis-num{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.4rem; color:var(--border); margin-bottom:8px; }
.da-analysis-card h4{ font-size:.95rem; text-transform:uppercase; margin-bottom:14px; }
.da-analysis-card li{ font-size:.82rem; color:var(--text-mut); padding-left:14px; position:relative; }
.da-analysis-card li::before{ content:"\2014"; position:absolute; left:0; color:var(--text-faint); }
.da-analysis-card .da-quote{ font-style:italic; color:var(--text); font-size:.82rem; padding-left:14px; border-left:2px solid var(--red); margin-top:14px; max-width:52ch; }
.da-metric{ font-family:'Space Grotesk',sans-serif; font-size:.88rem; color:var(--text); }
.da-reliability-wrap{ overflow-x:auto; }
.da-reliability-table{ width:100%; border-collapse:collapse; font-size:.82rem; margin:14px 0; }
.da-reliability-table th{ text-align:left; font-family:'Barlow Condensed',sans-serif; text-transform:uppercase; letter-spacing:.06em; color:var(--text-faint); font-weight:600; padding:6px 8px; border-bottom:1px solid var(--border); }
.da-reliability-table td{ padding:7px 8px; border-bottom:1px solid var(--border); color:var(--text-mut); }
.da-reliability-table td:first-child, .da-reliability-table th:first-child{ color:var(--text); font-weight:600; }
.da-path-diagram{ font-family:'Barlow Condensed',sans-serif; font-size:.84rem; color:var(--text-mut); display:flex; flex-direction:column; gap:7px; margin:14px 0; padding:14px 16px; border:1px solid var(--border); }
.da-path-diagram b{ color:var(--text); font-weight:600; }
.da-path-diagram .strong-path{ color:var(--red-bright); }
.da-screens-head, .da-learned-head{ font-family:'Barlow Condensed',sans-serif; font-weight:600; text-transform:uppercase; letter-spacing:.12em; font-size:.9rem; color:var(--text); padding-bottom:12px; border-bottom:1px solid var(--border); }
.da-screen-img{ aspect-ratio:16/10; overflow:hidden; border-bottom:1px solid var(--border); }
.da-screen-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.da-screen-cap{ padding:14px 16px; font-size:.74rem; color:var(--text-mut); text-transform:uppercase; letter-spacing:.03em; line-height:1.5; background:var(--bg); }
.da-mini-soon{ font-size:.62rem; font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:var(--text-faint); border:1px solid var(--border); padding:4px 10px; border-radius:20px; white-space:nowrap; }
.da-mini-card p{ font-size:.85rem; color:var(--text-mut); max-width:48ch; }
.da-dataset-card{ background:var(--bg); padding:24px; }
.da-dataset-card h5{ font-family:'Space Grotesk',sans-serif; color:var(--text); font-size:.88rem; text-transform:uppercase; margin-bottom:10px; }
.da-dataset-card p{ font-size:.8rem; color:var(--text-mut); }
.da-dataset-card li{ font-size:.8rem; color:var(--text-mut); padding-left:14px; position:relative; }
.da-dataset-card li::before{ content:"\2014"; position:absolute; left:0; color:var(--text-faint); }
.da-workflow-step{
  font-family:'Barlow Condensed',sans-serif; font-size:.78rem; text-transform:uppercase; letter-spacing:.05em;
  color:var(--text); border:1px solid var(--border); padding:11px 18px; border-radius:20px; white-space:nowrap;
}
.da-workflow-arrow{ color:var(--text-faint); }
.da-code-block{ border:1px solid var(--border); background:#0a0a0a; border-radius:var(--r); overflow:hidden; }
.da-code-block summary{
  display:flex; align-items:center; gap:10px; list-style:none; cursor:pointer;
  padding:14px 18px; font-family:'Space Grotesk',sans-serif; font-size:.84rem; color:var(--text); background:#111;
  border-bottom:1px solid transparent; transition:border-color .2s ease;
}
.da-code-block summary::-webkit-details-marker{ display:none; }
.da-code-block[open] summary{ border-bottom-color:var(--border); }
.da-code-block summary .cd-lang{ font-family:'Barlow Condensed',sans-serif; font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color:var(--red); border:1px solid var(--border); padding:3px 10px; border-radius:20px; }
.da-code-block summary .cd-caret{ margin-left:auto; color:var(--text-faint); transition:transform .3s ease; width:14px; height:14px; }
.da-code-block[open] summary .cd-caret{ transform:rotate(180deg); }
.da-code-block pre{ margin:0; padding:20px; overflow-x:auto; font-family:'Space Grotesk',monospace; font-size:.8rem; line-height:1.7; color:#d6d6d6; }
.da-code-block .cd-kw{ color:#ff6b6b; }
.da-code-block .cd-fn{ color:#7fd1ff; }
.da-code-block .cd-cm{ color:#6b6b6b; font-style:italic; }
.da-code-caption{ font-size:.78rem; color:var(--text-mut); }
.da-bar-row{ display:grid; grid-template-columns:110px 1fr 64px; align-items:center; gap:12px; }
.da-bar-label{ font-size:.78rem; color:var(--text-mut); text-transform:uppercase; letter-spacing:.03em; }
.da-bar-track{ height:8px; background:var(--border); border-radius:6px; overflow:hidden; }
.da-bar-fill{ height:100%; background:var(--red); border-radius:6px; }
.da-bar-val{ font-family:'Space Grotesk',sans-serif; font-size:.78rem; color:var(--text); text-align:right; }
@media (max-width:520px){ .da-bar-row{ grid-template-columns:80px 1fr 52px; gap:8px; } }
.da-insight-item h5{ font-family:'Space Grotesk',sans-serif; color:var(--text); font-size:.88rem; text-transform:uppercase; margin-bottom:8px; }
.da-insight-item p{ font-size:.82rem; color:var(--text-mut); max-width:46ch; }
.da-limits-list{ border:1px solid var(--border); padding:24px; }
.da-limits-list b{ color:var(--text); font-family:'Space Grotesk',sans-serif; font-size:.84rem; white-space:nowrap; }
.da-limits-list span{ font-size:.82rem; color:var(--text-mut); }
.da-closing-quote{ font-style:italic; color:var(--text); font-size:1rem; max-width:64ch; padding-left:18px; border-left:2px solid var(--red); }

/* ============ EXPERIENCE (05) ============ */
.exp-section{
  background:linear-gradient(160deg, #0a0d1c 0%, #12152e 55%, #0a0d1c 100%);
  border-block:1px solid rgba(139,92,246,.18);
}
.exp-kicker{
  display:inline-flex; align-items:center; gap:9px;
  background:rgba(139,92,246,.16); border:1px solid rgba(139,92,246,.45);
  color:#8b5cf6; padding:8px 18px 8px 14px; border-radius:999px;
  letter-spacing:.08em; font-size:.7rem; font-weight:700; text-transform:uppercase;
  width:fit-content; margin-bottom:20px; box-shadow:0 4px 18px rgba(139,92,246,.18);
}
.exp-kicker .bar{ width:6px; height:6px; border-radius:50%; background:#8b5cf6; box-shadow:0 0 8px 1px rgba(139,92,246,.9); }
.exp-text h2{ font-size:clamp(1.5rem,2.6vw,2.1rem); text-transform:none; color:#f4f5fb; }
.exp-text p{ color:#9aa3c7; }
.exp-visual{
  min-height:360px; border-radius:14px; overflow:hidden; position:relative;
  border:1px solid rgba(139,92,246,.25);
  background:linear-gradient(160deg, rgba(139,92,246,.14), rgba(10,13,28,.94));
  display:flex; align-items:center; padding:44px 40px;
}
.exp-visual::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(circle at 25% 15%, rgba(139,92,246,.3), transparent 55%);
}
.exp-visual-inner{ position:relative; z-index:1; width:100%; display:flex; flex-direction:column; gap:26px; }
.exp-visual-stat{ display:flex; flex-direction:column; gap:4px; }
.ev-num{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:2.2rem; color:#f4f5fb; line-height:1; }
.ev-label{ font-family:'Barlow Condensed',sans-serif; font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; color:#8992b8; }
.exp-visual-divider{ height:1px; background:rgba(255,255,255,.12); }
@media (max-width:900px){ .exp-visual{ min-height:auto; } }
.timeline{ position:relative; padding-left:36px; }
.timeline::before{ content:""; position:absolute; left:5px; top:6px; bottom:6px; width:1px; background:var(--border); }
.tl-item{ position:relative; padding:16px 20px 16px 16px; border-radius:12px; transition:background .3s ease, border-color .3s ease; border:1px solid transparent; }
.tl-item:hover{ background:rgba(139,92,246,.06); border-color:rgba(139,92,246,.18); }
.tl-item::before{ content:""; position:absolute; left:-36px; top:22px; width:11px; height:11px; border-radius:50%; background:var(--bg); border:2px solid var(--red); }
.tl-role{ font-size:1.25rem; text-transform:uppercase; }
.tl-date{ font-family:'Barlow Condensed',sans-serif; font-size:.9rem; letter-spacing:.08em; color:var(--text-faint); }
.tl-org{ color:var(--red); font-size:.85rem; text-transform:uppercase; letter-spacing:.08em; }
.tl-desc{ font-size:.88rem; color:var(--text-mut); max-width:60ch; }
.exp-subhead{
  font-family:'Barlow Condensed',sans-serif; font-weight:600; text-transform:uppercase; letter-spacing:.12em;
  font-size:.9rem; color:var(--text); padding-bottom:12px; border-bottom:1px solid var(--border);
}
.exp-col{ border-left:1px solid var(--border); }
.exp-col:first-child{ border-left:none; }
@media (max-width:900px){ .exp-col{ border-left:none; } }
.compact-item .ci-title{ font-family:'Space Grotesk',sans-serif; font-weight:700; color:var(--text); font-size:.85rem; letter-spacing:.01em; }
.compact-item .ci-date{ font-family:'Barlow Condensed',sans-serif; font-size:.76rem; letter-spacing:.06em; color:var(--text-faint); white-space:nowrap; }
.compact-item .ci-org{ color:var(--text-mut); font-size:.76rem; text-transform:uppercase; letter-spacing:.05em; }
.tl-positions{ border-left:1px solid var(--border); }
.tp-title{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:.86rem; color:var(--text); }
.tp-date{ font-family:'Barlow Condensed',sans-serif; font-size:.74rem; letter-spacing:.06em; color:var(--text-faint); white-space:nowrap; }
.tp-meta{ font-size:.72rem; color:var(--red); text-transform:uppercase; letter-spacing:.04em; }
.tp-desc{ font-size:.84rem; color:var(--text-mut); max-width:58ch; }
.tp-quote{ font-style:italic; color:var(--text); font-size:.84rem; padding-left:14px; border-left:2px solid var(--red); max-width:52ch; }
.ci-positions{ border-left:1px solid var(--border); }
.cip-title{ font-size:.78rem; color:var(--text); font-weight:600; }
.cip-date{ font-family:'Barlow Condensed',sans-serif; font-size:.7rem; color:var(--text-faint); white-space:nowrap; }

/* ============ BY THE NUMBERS ============ */
.numbers-section{ background:var(--bg-2); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.num-block .big{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:clamp(2.2rem,4vw,3.4rem); color:var(--red); line-height:1; }
.num-block .label{ font-family:'Barlow Condensed',sans-serif; font-size:.95rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-mut); margin-top:12px; }
.num-block.words li{ display:flex; align-items:baseline; gap:10px; font-family:'Space Grotesk',sans-serif; font-weight:700; text-transform:uppercase; font-size:1.15rem; color:var(--text); }
.num-block.words li i{ font-family:'Barlow Condensed',sans-serif; font-style:normal; color:var(--red); font-size:.8rem; }

/* ============ TOOLS & TECH ============ */
.tool-cat-top svg{ width:20px; height:20px; color:var(--red); }
.tool-cat-top h3{ font-size:.92rem; text-transform:uppercase; letter-spacing:.05em; }
.lang-line{ padding-top:28px; border-top:1px solid var(--border); font-size:.85rem; color:var(--text-mut); }
.lang-label{ font-family:'Barlow Condensed',sans-serif; text-transform:uppercase; letter-spacing:.1em; color:var(--text-faint); font-size:.76rem; }
.lang-item b{ color:var(--text); font-weight:600; }

/* ============ HOW I WORK ============ */
.work-statement{ font-size:clamp(1.5rem,3vw,2.3rem); text-transform:uppercase; max-width:20ch; }
.principle .p-num{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:2.4rem; color:var(--border); line-height:1; margin-bottom:16px; }
.principle h3{ font-size:1rem; text-transform:uppercase; letter-spacing:.06em; margin-bottom:10px; }
.principle p{ font-size:.9rem; }

/* ============ BEYOND WORK ============ */
.beyond-item{ background:var(--bg); }
.beyond-img{ aspect-ratio:4/3; overflow:hidden; }
.beyond-img img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease; filter:grayscale(.1) contrast(1.05); }
.beyond-item:hover .beyond-img img{ transform:scale(1.05); }
.beyond-text{ padding:26px 30px 30px; }
.beyond-item h3{ font-size:1rem; text-transform:uppercase; letter-spacing:.04em; margin-bottom:10px; }
.beyond-item p{ font-size:.9rem; }

/* ============ CONTACT CTA ============ */
.contact-cta{ position:relative; overflow:hidden; border-top:1px solid var(--border); }
.contact-cta::before{ content:""; position:absolute; inset:0; background:radial-gradient(ellipse at 30% 40%, rgba(139,92,246,.16), transparent 60%); }
.contact-cta .container{ position:relative; z-index:1; padding-block:130px; text-align:center; }
.contact-cta h2{ font-size:clamp(2.2rem,6vw,4rem); text-transform:uppercase; max-width:16ch; margin-inline:auto; }
.contact-cta h2 .accent{ color:var(--red); }
.contact-cta p{ max-width:42ch; font-size:1.02rem; margin-inline:auto; }
.contact-links a{ font-size:.82rem; text-transform:uppercase; letter-spacing:.08em; color:var(--text-mut); border-bottom:1px solid var(--border); padding-bottom:4px; transition:color .2s ease, border-color .2s ease; }
.contact-links a:hover{ color:var(--red-bright); border-color:var(--red); }

/* ============ FOOTER ============ */
.footer{ padding-block:48px; border-top:1px solid var(--border); }
.footer-name{ font-size:1rem; text-transform:uppercase; letter-spacing:.05em; margin-bottom:8px; color:var(--text); }
.footer-tagline{ font-family:'Barlow Condensed',sans-serif; font-size:.85rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-faint); }
.footer-links a{ font-size:.78rem; text-transform:uppercase; letter-spacing:.06em; color:var(--text-mut); transition:color .2s ease; }
.footer-links a:hover{ color:var(--red-bright); }
.footer-bottom{ margin-top:40px; padding-top:24px; border-top:1px solid var(--border); font-size:.76rem; color:var(--text-faint); }
.footer--minimal .footer-bottom{ margin-top:0; padding-top:0; border-top:none; }

/* ============ PROJECT SINGLE ============ */
.project-single{ padding-block:150px 110px; }
.project-back{
  display:inline-flex; align-items:center; gap:8px; margin-bottom:40px;
  font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; color:var(--text-mut);
  text-decoration:none; transition:color .2s ease;
}
.project-back svg{ width:16px; height:16px; }
.project-back:hover{ color:var(--red-bright); }
.project-single-kicker{
  display:inline-flex; align-items:center; gap:9px; margin-bottom:18px;
  font-family:'Barlow Condensed',sans-serif; font-weight:600; text-transform:uppercase;
  letter-spacing:.1em; font-size:.82rem; color:var(--red-bright);
}
.project-single-kicker .bar{ width:20px; height:2px; background:var(--red); flex-shrink:0; }
.project-single-title{ font-size:clamp(2rem,4.4vw,3.2rem); text-transform:uppercase; max-width:22ch; margin-bottom:24px; }
.project-single-tags{ margin-bottom:40px; }
.post-single-date{ margin:-8px 0 24px; font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-faint); }
.project-single-media{ aspect-ratio:16/9; overflow:hidden; border:1px solid var(--border); margin-bottom:48px; }
.project-single-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.project-single-content{ max-width:74ch; font-size:1rem; color:var(--text-mut); }
.project-single-content > *:first-child{ margin-top:0; }
.project-single-content h2{ font-size:1.5rem; text-transform:uppercase; color:var(--text); margin:48px 0 18px; }
.project-single-content h3{ font-size:1.15rem; text-transform:uppercase; color:var(--text); margin:36px 0 14px; }
.project-single-content p{ margin:0 0 20px; line-height:1.8; }
.project-single-content ul, .project-single-content ol{ margin:0 0 20px; padding-left:22px; }
.project-single-content li{ margin-bottom:8px; }
.project-single-content a{ color:var(--red-bright); text-decoration:underline; text-underline-offset:3px; }
.project-single-content img{ display:block; width:100%; height:auto; border:1px solid var(--border); margin:32px 0; }
.project-single-content blockquote{
  margin:32px 0; padding-left:18px; border-left:2px solid var(--red);
  font-style:italic; color:var(--text);
}
.project-single-cta{ margin-top:56px; }
@media (max-width:700px){
  .project-single{ padding-block:118px 72px; }
  .project-single-media{ margin-bottom:32px; }
}

/* ============ COLLABORATORS ============ */
.section-lead{ color:var(--text-mut); max-width:56ch; }
.logo-grid, .people-grid{
  scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch;
  padding-bottom:14px; margin-bottom:-14px;
}
.logo-tile{
  flex:0 0 132px; height:80px; background:#f5f5f3; border-radius:6px;
  display:flex; align-items:center; justify-content:center; padding:14px;
  scroll-snap-align:start; transition:transform .3s ease, box-shadow .3s ease;
}
.logo-tile:hover{ transform:translateY(-4px); box-shadow:0 12px 26px rgba(0,0,0,.4); }
.logo-tile img{ max-width:100%; max-height:100%; object-fit:contain; }
.person-card{ flex:0 0 148px; scroll-snap-align:start; }
.person-photo{ aspect-ratio:4/5; margin-bottom:12px; }
.person-text h3{ font-size:.8rem; text-transform:uppercase; letter-spacing:.02em; margin-bottom:3px; }
.person-text p{ font-size:.68rem; color:var(--text-mut); text-transform:uppercase; letter-spacing:.04em; }
.logo-grid::-webkit-scrollbar, .people-grid::-webkit-scrollbar{ height:4px; }
.logo-grid::-webkit-scrollbar-track, .people-grid::-webkit-scrollbar-track{ background:var(--border); border-radius:2px; }
.logo-grid::-webkit-scrollbar-thumb, .people-grid::-webkit-scrollbar-thumb{ background:var(--red); border-radius:2px; }

/* ============ REVEAL / MOTION ============ */
.reveal{ opacity:0; transform:translateY(24px) scale(.985); transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.reveal.in-view{ opacity:1; transform:translateY(0) scale(1); }
.reveal.stagger{ opacity:1; transform:none; transition:none; }
.reveal.stagger > *{ opacity:0; transform:translateY(22px) scale(.97); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
.reveal.stagger.in-view > *{ opacity:1; transform:translateY(0) scale(1); }
.reveal.stagger > *:nth-child(1){ transition-delay:.03s; }
.reveal.stagger > *:nth-child(2){ transition-delay:.1s; }
.reveal.stagger > *:nth-child(3){ transition-delay:.17s; }
.reveal.stagger > *:nth-child(4){ transition-delay:.24s; }
.reveal.stagger > *:nth-child(5){ transition-delay:.31s; }

.scroll-progress{
  position:fixed; top:0; left:0; height:2px; width:0%; z-index:100;
  background:var(--red); box-shadow:0 0 8px rgba(139,92,246,.6); pointer-events:none;
}

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .reveal, .reveal.stagger > *, .hero-copy > *, .hero-stats > div, .glow-panel::before, .eyebrow-line{
    animation:none !important; transition:none !important; opacity:1 !important; transform:none !important;
  }
  .project-card:hover .proj-preview img, .project-card:hover h3, .btn:hover svg{ transform:none; }
  .hero-bg{ transform:none !important; }
}

/* ============ RESPONSIVE — TABLET (laptops, iPads landscape/portrait) ============ */
@media (max-width:992px){
  .section{ padding-block:84px; }
  .about-photo{ min-height:360px; }
  .da-featured{ padding:32px; }
  .timeline{ padding-left:30px; }
  .contact-cta .container{ padding-block:96px; }
  .hero-stats{ gap:32px !important; }
}

@media (max-width:768px){
  h1{ word-break:break-word; }
  .whatido-card{ padding:24px 20px 44px; }
  .beyond-text{ padding:22px 24px 26px; }
  .da-analysis-card, .da-dataset-card{ padding:22px; }
}

/* ============ RESPONSIVE — MOBILE ============ */
@media (max-width:700px){
  .site-header{
    background:linear-gradient(180deg, rgba(18,14,32,.95) 0%, rgba(10,9,18,.95) 100%);
    -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  }
  .da-workflow-step{ padding:8px 14px; font-size:.72rem; }
}

@media (max-width:576px){
  .section{ padding-block:56px; }
  .eyebrow{ margin-bottom:20px; }
  .hero{ padding-block:96px 32px; }
  .hero-kicker{ font-size:.64rem; padding:7px 14px 7px 11px; }
  .hero-stats{ gap:22px !important; }
  .hero-stats > div{ flex:1 1 100%; }
  .about-photo{ min-height:280px; border-radius:10px; }
  .da-featured{ padding:20px; }
  .da-stats-row{ gap:20px !important; }
  .da-analysis-card, .da-dataset-card{ padding:18px; }
  .da-limits-list{ padding:18px; }
  .da-code-block pre{ padding:14px; font-size:.74rem; }
  .timeline{ padding-left:24px; }
  .timeline::before{ left:3px; }
  .tl-item::before{ left:-24px; }
  .tl-positions, .tl-tags{ padding-left:0 !important; }
  .contact-cta .container{ padding-block:72px; }
  .contact-links{ gap:16px !important; }
  .contact-links a{ word-break:break-word; text-align:center; }
  .footer .container{ text-align:center; justify-content:center !important; }
  .footer-links{ justify-content:center; }
  .logo-tile{ flex:0 0 108px; height:66px; padding:10px; }
  .person-card{ flex:0 0 120px; }
  .beyond-text{ padding:20px 18px 24px; }
  .da-bar-row{ grid-template-columns:72px 1fr 48px; gap:6px; }
  .socials a{ width:24px; height:24px; }
}

@media (max-width:400px){
  .hero-copy h1{ font-size:clamp(2.1rem,10vw,2.6rem); }
  .btn{ --bs-btn-padding-x:20px; --bs-btn-padding-y:13px; }
  .logo-word{ display:none; }
}

/* Block style: Quote → Accent border (registered in inc/setup.php). */
.wp-block-quote.is-style-heliolisk-accent{
  border-left:4px solid var(--red);
  padding:20px 28px;
  text-align:left;
  background:transparent;
}

/* Optional banner from Appearance → Customize → Header Image. */
.site-header-image{ display:block; width:100%; line-height:0; }
.site-header-image img{ display:block; width:100%; height:auto; max-height:420px; object-fit:cover; }
