:root{--font:"Manrope","Aptos","Segoe UI",system-ui,sans-serif;--display:"Space Grotesk","Manrope",system-ui,sans-serif;--bg:#f7f4ee;--bg2:#eef3f8;--surface:rgba(255,255,255,.64);--strong:#fff;--ink:#0a1327;--muted:#667086;--line:rgba(10,19,39,.12);--navy:#071630;--blue:#2d69bd;--gold:#bfa46a;--shadow:0 30px 90px rgba(7,22,48,.14);--soft:0 18px 50px rgba(7,22,48,.09);--max:1200px}html[data-theme=dark]{--bg:#070b14;--bg2:#0b1529;--surface:rgba(255,255,255,.075);--strong:#101a2f;--ink:#f7f8fb;--muted:#aeb8ca;--line:rgba(255,255,255,.13);--navy:#eaf2ff;--blue:#91bfff;--gold:#d1bb82;--shadow:0 30px 90px rgba(0,0,0,.38);--soft:0 18px 50px rgba(0,0,0,.28)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:var(--font);color:var(--ink);background:radial-gradient(circle at 12% 8%,rgba(45,105,189,.16),transparent 30rem),radial-gradient(circle at 86% 18%,rgba(191,164,106,.18),transparent 28rem),linear-gradient(135deg,var(--bg),var(--bg2));letter-spacing:-.018em;overflow-x:hidden}body.modal-open{overflow:hidden}body:before{content:"";position:fixed;inset:0;z-index:-3;opacity:.45;background-image:radial-gradient(rgba(10,19,39,.08) 1px,transparent 1px);background-size:18px 18px}html[data-theme=dark] body:before{background-image:radial-gradient(rgba(255,255,255,.08) 1px,transparent 1px)}a{text-decoration:none;color:inherit}button{font:inherit}.progress{position:fixed;top:0;left:0;z-index:100;height:3px;width:0;background:linear-gradient(90deg,var(--blue),var(--gold));box-shadow:0 0 22px rgba(45,105,189,.45)}.cursor-glow{position:fixed;left:0;top:0;z-index:-2;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(45,105,189,.12),transparent 65%);transform:translate(-50%,-50%);pointer-events:none}.topbar{position:sticky;top:14px;z-index:50;width:min(var(--max),calc(100% - 28px));min-height:70px;margin:14px auto 0;padding:10px 12px 10px 18px;display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:center;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.58);backdrop-filter:blur(24px);box-shadow:0 14px 50px rgba(7,22,48,.08)}html[data-theme=dark] .topbar{background:rgba(11,21,41,.72)}.brand{display:flex;align-items:center;gap:10px;width:max-content;font-family:var(--display);font-weight:700;font-size:1.18rem}.brand span{display:grid;place-items:center;width:38px;height:38px;border-radius:13px;color:#fff;background:linear-gradient(135deg,#071630,#2d69bd)}html[data-theme=dark] .brand span{color:#071630;background:#eaf2ff}.nav{display:flex;align-items:center;gap:clamp(18px,3vw,34px);color:var(--muted);font-weight:800;font-size:.93rem}.nav a{position:relative}.nav a:after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:2px;border-radius:99px;background:var(--blue);transform:scaleX(0);transition:.18s}.nav a:hover,.nav a.active{color:var(--ink)}.nav a:hover:after,.nav a.active:after{transform:scaleX(1)}.actions{justify-self:end;display:flex;align-items:center;gap:8px}.resume,.round,.music-btn,.btn,.filters button,.tabs button{border:1px solid var(--line);cursor:pointer;transition:.18s}.resume{display:inline-flex;min-height:46px;align-items:center;justify-content:center;padding:0 22px;border-radius:999px;color:#fff;background:#071630;border-color:transparent;font-weight:900;box-shadow:0 14px 32px rgba(7,22,48,.16)}html[data-theme=dark] .resume{color:#071630;background:#eaf2ff}.round,.music-btn{min-height:46px;border-radius:999px;color:var(--ink);background:rgba(255,255,255,.48)}.round{width:46px}.music-btn{display:flex;align-items:center;gap:9px;padding:0 14px;font-weight:900}.music-btn span{display:flex;align-items:end;gap:3px;height:15px}.music-btn i{display:block;width:3px;height:6px;border-radius:99px;background:var(--blue)}.music-btn.playing i:nth-child(1){animation:bar .9s infinite}.music-btn.playing i:nth-child(2){animation:bar .9s .16s infinite}.music-btn.playing i:nth-child(3){animation:bar .9s .32s infinite}@keyframes bar{0%,100%{height:5px;opacity:.55}50%{height:15px;opacity:1}}.nav-toggle{display:none;border:1px solid var(--line);background:var(--surface);border-radius:999px;width:46px;height:46px}.nav-toggle i{display:block;width:18px;height:2px;margin:0 auto;border-radius:99px;background:var(--ink)}.nav-toggle i+i{margin-top:5px}.section{width:min(var(--max),calc(100% - 32px));margin:0 auto;padding:clamp(78px,10vw,138px) 0}.hero{min-height:calc(100vh - 88px);padding-top:clamp(48px,7vw,96px);padding-bottom:50px}.hero-grid{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(380px,.86fr);gap:clamp(36px,7vw,92px);align-items:center}.eyebrow{margin:0 0 18px;color:var(--blue);text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;font-weight:900}h1,h2,h3,p{margin-top:0}h1,.section-head h2,.contact h2,.modal-card h2{font-family:var(--display);letter-spacing:-.075em}h1{max-width:980px;margin-bottom:24px;font-size:clamp(2.15rem,4.1vw,4.55rem);line-height:1.02;font-weight:700}.lead{max-width:720px;margin-bottom:16px;color:#26324a;font-weight:850;font-size:clamp(1.02rem,2vw,1.24rem);line-height:1.55}html[data-theme=dark] .lead{color:#e7edf7}.copy,.section-head p,.card p,.timeline article>p:last-child,.project em,.credential p,.contact p,#modalSummary{color:var(--muted);line-height:1.72}.copy{max-width:650px;margin-bottom:32px;font-size:1.04rem}.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:42px}.btn{display:inline-flex;min-height:54px;align-items:center;justify-content:center;padding:0 24px;border-radius:999px;font-weight:900}.primary{color:#fff;background:#071630;border-color:transparent;box-shadow:0 18px 38px rgba(7,22,48,.18)}html[data-theme=dark] .primary{color:#071630;background:#eaf2ff}.secondary{color:var(--ink);background:rgba(255,255,255,.44)}.light{color:#fff;border-color:rgba(255,255,255,.24);background:rgba(255,255,255,.1)}.btn:hover,.resume:hover,.round:hover,.music-btn:hover,.filters button:hover,.tabs button:hover,.project button:hover{transform:translateY(-2px);box-shadow:var(--soft)}.stats{display:grid;grid-template-columns:repeat(4,minmax(108px,1fr));gap:12px}.card,.stat,.project{border:1px solid var(--line);background:var(--surface);backdrop-filter:blur(24px);box-shadow:var(--soft)}.stat{min-height:116px;border-radius:22px;padding:18px}.stat strong{display:block;font-family:var(--display);font-size:1.75rem;margin-bottom:6px}.stat span{color:var(--muted);font-size:.84rem;font-weight:800}.portrait-wrap{display:flex;justify-content:center}.portrait{position:relative;width:min(100%,500px);aspect-ratio:.78;overflow:hidden;border-radius:38px;background:var(--strong);border:1px solid rgba(255,255,255,.55);box-shadow:0 36px 120px rgba(7,22,48,.24)}.portrait:before{display:none}.portrait img{width:100%;height:100%;display:block;object-fit:cover;object-position:center top;transform:scale(1.01)}.badge,.portrait-caption{position:absolute;z-index:3;left:22px;right:22px;display:flex;align-items:center;border:1px solid rgba(255,255,255,.32);background:rgba(7,22,48,.45);color:#fff;backdrop-filter:blur(16px)}.badge{top:22px;gap:10px;padding:12px 14px;border-radius:999px;font-size:.82rem;font-weight:900}.badge span{width:9px;height:9px;border-radius:50%;background:#75f0b1;box-shadow:0 0 0 7px rgba(117,240,177,.14)}.portrait-caption{bottom:22px;justify-content:space-between;gap:16px;padding:14px 16px;border-radius:20px}.portrait-caption span{color:rgba(255,255,255,.78);font-size:.84rem;font-weight:800}.marquee{margin-top:clamp(50px,8vw,86px);overflow:hidden;border-block:1px solid var(--line);color:var(--muted)}.marquee div{display:flex;width:max-content;gap:36px;padding:18px 0;animation:marquee 28s linear infinite}.marquee span{font-family:var(--display);font-weight:700;text-transform:uppercase;opacity:.78}@keyframes marquee{to{transform:translateX(-50%)}}.section-head{max-width:840px;margin-bottom:clamp(32px,5vw,56px)}.section-head h2,.contact h2{margin-bottom:18px;font-size:clamp(2.6rem,5.2vw,5.4rem);line-height:.94;font-weight:700}.section-head p{max-width:720px;font-size:1.08rem}.about-grid,.credentials,.beyond-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{border-radius:26px;padding:clamp(26px,4vw,36px)}.card h3,.timeline h3,.project h3{font-family:var(--display);font-size:clamp(1.32rem,2.3vw,2rem);line-height:1.08;letter-spacing:-.06em}.dark{color:#fff;background:radial-gradient(circle at 82% 15%,rgba(145,191,255,.30),transparent 12rem),linear-gradient(135deg,#071630,#0e3472)}.dark p{color:rgba(255,255,255,.74)}.dark a{color:#dbeaff;font-weight:900}.tags{display:flex;flex-wrap:wrap;gap:10px}.tags span{display:inline-flex;min-height:38px;align-items:center;padding:8px 13px;border-radius:999px;color:var(--blue);background:rgba(45,105,189,.09);border:1px solid rgba(45,105,189,.18);font-size:.88rem;font-weight:900}.experience-grid{display:grid;grid-template-columns:minmax(0,1.1fr) 420px;gap:34px;align-items:start}.timeline{position:relative;display:grid;gap:20px}.timeline:before{content:"";position:absolute;top:10px;bottom:10px;left:16px;width:1px;background:linear-gradient(to bottom,var(--blue),transparent)}.timeline article{position:relative;padding-left:58px;padding-bottom:18px}.timeline article span{position:absolute;left:7px;top:4px;width:20px;height:20px;border:4px solid var(--bg);border-radius:50%;background:var(--blue);box-shadow:0 0 0 7px rgba(45,105,189,.12)}.date{margin-bottom:9px;color:var(--blue);text-transform:uppercase;letter-spacing:.09em;font-size:.82rem;font-weight:900}.company{margin-bottom:10px;color:var(--blue);font-weight:900}.dashboard{position:sticky;top:112px}.dashboard div{display:grid;gap:5px;padding:18px 0;border-bottom:1px solid var(--line)}.dashboard span{color:var(--muted);font-size:.88rem;font-weight:900}.bars{gap:10px;margin-top:18px;border:0!important}.bars i{display:block;height:12px;width:var(--w);border-radius:999px;background:linear-gradient(90deg,var(--blue),var(--gold))}.filters,.tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px}.filters button,.tabs button{min-height:44px;padding:0 16px;border-radius:999px;color:var(--ink);background:rgba(255,255,255,.42);font-weight:900}.filters button.active,.tabs button.active{color:#fff;background:#071630;border-color:transparent}html[data-theme=dark] .filters button.active,html[data-theme=dark] .tabs button.active{color:#071630;background:#eaf2ff}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.project{position:relative;min-height:376px;overflow:hidden;border-radius:26px;padding:28px;transition:.22s}.project:hover{transform:translateY(-7px);box-shadow:var(--shadow);border-color:rgba(45,105,189,.30)}.project.hidden{opacity:.15;transform:scale(.98);pointer-events:none}.project.featured{grid-column:span 2;color:#fff;background:radial-gradient(circle at 84% 15%,rgba(145,191,255,.27),transparent 18rem),linear-gradient(135deg,#071630,#102f62)}.project.featured em,.project.featured b,.project.featured p{color:rgba(255,255,255,.76)}.project.wide{grid-column:span 3;min-height:260px}.project>span{display:grid;place-items:center;width:42px;height:42px;margin-bottom:26px;border-radius:50%;color:#fff;background:#071630;font-weight:900}.project.featured>span{background:rgba(255,255,255,.16)}.project p{margin-bottom:10px;color:var(--blue);font-size:.82rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.project em{display:block;font-style:normal;margin-bottom:18px}.project b{display:block;margin-bottom:24px;color:var(--blue);line-height:1.46}.project button{border:0;padding:0;color:var(--blue);background:transparent;font-weight:900;cursor:pointer}.featured button{color:#fff}.tab-panel{min-height:260px}.panel{display:none}.panel.active{display:block;animation:fade .26s both}@keyframes fade{from{opacity:0;transform:translateY(8px)}}.credentials .card{min-height:260px}.education-only{grid-template-columns:repeat(2,1fr);max-width:820px}.credentials b{color:var(--blue);line-height:1.5}.cert-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.cert-card{min-height:190px}.cert-card span{display:inline-block;margin-bottom:18px;color:var(--blue);text-transform:uppercase;letter-spacing:.09em;font-size:.78rem;font-weight:900}.cert-card h3{font-size:clamp(1.05rem,1.55vw,1.35rem);line-height:1.18}.beyond-grid .card{min-height:260px}.beyond-grid .card span{color:var(--blue);font-weight:900;letter-spacing:.12em}.contact-section{padding-bottom:54px}.contact{position:relative;overflow:hidden;display:grid;grid-template-columns:1fr auto;gap:32px;align-items:end;min-height:440px;border-radius:36px;padding:clamp(34px,6vw,76px);color:#fff;background:radial-gradient(circle at 82% 22%,rgba(191,164,106,.24),transparent 18rem),radial-gradient(circle at 15% 90%,rgba(45,105,189,.28),transparent 22rem),linear-gradient(135deg,#061226,#0a2a62 68%,#071630);box-shadow:0 38px 120px rgba(7,22,48,.27)}.contact:after{content:"";position:absolute;right:-14%;bottom:-62%;width:670px;height:670px;border-radius:50%;background:repeating-radial-gradient(circle,rgba(255,255,255,.15) 0 1px,transparent 1px 10px);opacity:.36}.contact>*{position:relative;z-index:2}.contact .eyebrow{color:#c8dbff}.contact h2{color:#fff}.contact p{color:rgba(255,255,255,.73);max-width:620px}.contact-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px}.contact-lines{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:14px;padding-top:24px;border-top:1px solid rgba(255,255,255,.16)}.contact-lines a,.contact-lines span{color:rgba(255,255,255,.83);font-weight:800}.footer{width:min(var(--max),calc(100% - 32px));margin:0 auto;padding:0 0 36px;display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:.92rem}.footer p{margin:0}.footer a{color:var(--blue);font-weight:900}.modal{position:fixed;inset:0;z-index:100;display:none;place-items:center;padding:20px}.modal[aria-hidden=false]{display:grid}.backdrop{position:absolute;inset:0;background:rgba(5,10,22,.58);backdrop-filter:blur(18px)}.modal-card{position:relative;z-index:1;width:min(920px,100%);max-height:min(86vh,820px);overflow:auto;border:1px solid var(--line);border-radius:34px;padding:clamp(28px,5vw,54px);background:var(--strong);box-shadow:0 42px 130px rgba(0,0,0,.28)}.close{position:absolute;top:18px;right:18px;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;color:var(--ink);background:var(--surface);font-size:1.5rem;cursor:pointer}.modal-card h2{margin-bottom:18px;font-size:clamp(2.3rem,6vw,4.6rem);line-height:.95}.modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px;margin-top:30px}.modal-grid h3{color:var(--blue);text-transform:uppercase;letter-spacing:.11em;font-size:.86rem}.modal-grid ul{margin:0;padding-left:1.1rem;color:var(--muted);line-height:1.72}.modal-grid li+li{margin-top:12px}.reveal{opacity:0;transform:translateY(24px);transition:.65s}.reveal.visible{opacity:1;transform:translateY(0)}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}@media (max-width:1080px){.topbar{grid-template-columns:1fr auto auto}.nav-toggle{display:block}.nav{position:absolute;top:calc(100% + 10px);left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;padding:12px;border:1px solid var(--line);border-radius:26px;background:var(--strong);box-shadow:var(--soft)}.nav.open{display:flex}.nav a{padding:14px;border-radius:16px}.nav a:after{display:none}.hero-grid,.experience-grid,.contact{grid-template-columns:1fr}.portrait-wrap{order:-1}.dashboard{position:relative;top:auto}.about-grid,.credentials,.beyond-grid,.project-grid,.cert-grid{grid-template-columns:1fr 1fr}.project.featured,.project.wide{grid-column:span 2}.contact-actions{justify-content:flex-start}}@media (max-width:720px){.topbar{width:calc(100% - 20px);margin-top:10px;gap:8px}.music-btn b{display:none}.resume{display:none}.section{width:calc(100% - 24px);padding:70px 0}h1{font-size:clamp(2.45rem,12vw,4.1rem)}.stats,.about-grid,.credentials,.education-only,.beyond-grid,.project-grid,.cert-grid,.modal-grid{grid-template-columns:1fr}.project.featured,.project.wide{grid-column:span 1}.project,.project.wide{min-height:auto}.portrait{aspect-ratio:.76;border-radius:28px}.badge,.portrait-caption{left:14px;right:14px}.badge{top:14px;font-size:.72rem}.portrait-caption{bottom:14px;align-items:flex-start;flex-direction:column;gap:2px}.contact-lines,.footer{flex-direction:column}.modal{padding:10px}}

/* V4 refinements */
.hero .lead {
  max-width: 760px;
  margin-bottom: 32px;
}

.project-grid {
  align-items: stretch;
}

.project {
  min-height: 390px;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.project h3 {
  min-height: 2.2em;
}

.project em {
  flex: 1;
}

.project button {
  margin-top: auto;
}

.project.featured,
.project.wide {
  grid-column: auto !important;
  min-height: 390px !important;
  color: var(--ink) !important;
  background: var(--surface) !important;
  border-color: var(--line) !important;
}

.project.featured em,
.project.featured b,
.project.featured p {
  color: inherit;
}

.project.featured p,
.project.wide p {
  color: var(--blue) !important;
}

.project.featured em,
.project.wide em {
  color: var(--muted) !important;
}

.project.featured b,
.project.wide b {
  color: var(--blue) !important;
}

.project.featured button,
.project.wide button {
  color: var(--blue) !important;
}

.project.featured > span,
.project.wide > span {
  color: #fff !important;
  background: #071630 !important;
}

html[data-theme=dark] .project.featured > span,
html[data-theme=dark] .project.wide > span {
  color: #071630 !important;
  background: #eaf2ff !important;
}

@media (max-width: 1080px) {
  .project.featured,
  .project.wide {
    grid-column: auto !important;
  }
}

@media (max-width: 720px) {
  h1 {
    font-size: clamp(2.15rem, 10vw, 3.45rem);
  }

  .project {
    min-height: auto;
  }
}


/* V5 hero refinements */
.hero-name {
  font-size: clamp(1.05rem, 1.7vw, 1.45rem);
  letter-spacing: 0.22em;
  color: var(--blue);
  margin-bottom: 20px;
  font-weight: 900;
}

.hero h1 {
  max-width: 880px;
  font-size: clamp(2rem, 3.45vw, 3.85rem);
  line-height: 1.08;
  letter-spacing: -0.062em;
  margin-bottom: 26px;
}

@media (max-width: 720px) {
  .hero-name {
    font-size: 0.98rem;
    letter-spacing: 0.16em;
  }

  .hero h1 {
    font-size: clamp(2rem, 9vw, 3.15rem);
    line-height: 1.08;
  }
}


/* V6: dedicated What I Do Best section */
.section-head.compact {
  margin-bottom: 34px;
}
.section-head.compact p {
  max-width: 760px;
}
#about .about-grid {
  grid-template-columns: repeat(2, 1fr);
  max-width: 980px;
}
.what-i-do-section {
  width: min(1260px, calc(100% - 32px));
}
.do-best-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.do-best-card {
  min-height: 560px;
  padding: clamp(28px, 3vw, 36px);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 28px;
  color: #f7f8fb;
  background:
    radial-gradient(circle at 20% 0%, rgba(145,191,255,0.18), transparent 18rem),
    linear-gradient(145deg, rgba(15, 48, 108, 0.96), rgba(46, 18, 92, 0.96));
  box-shadow: 0 28px 90px rgba(7, 22, 48, 0.20);
}
.do-best-card:nth-child(2) {
  background:
    radial-gradient(circle at 80% 0%, rgba(191,164,106,0.16), transparent 18rem),
    linear-gradient(145deg, rgba(33, 18, 92, 0.96), rgba(12, 32, 75, 0.96));
}
.do-best-card:nth-child(3) {
  background:
    radial-gradient(circle at 50% 0%, rgba(145,191,255,0.15), transparent 18rem),
    linear-gradient(145deg, rgba(54, 22, 93, 0.96), rgba(11, 18, 46, 0.96));
}
.do-best-card h3 {
  margin-bottom: 22px;
  color: #ffffff;
  font-family: var(--display);
  font-size: clamp(1.55rem, 2.15vw, 2.15rem);
  line-height: 1.12;
  letter-spacing: -0.055em;
}
.do-best-card ul {
  margin: 0;
  padding-left: 1.2rem;
  color: rgba(255,255,255,0.78);
  font-size: 1.03rem;
  line-height: 1.72;
}
.do-best-card li + li {
  margin-top: 12px;
}
@media (max-width: 1080px) {
  #about .about-grid,
  .do-best-grid {
    grid-template-columns: 1fr 1fr;
  }
  .do-best-card {
    min-height: 500px;
  }
  .do-best-card:nth-child(3) {
    grid-column: span 2;
    min-height: auto;
  }
}
@media (max-width: 720px) {
  #about .about-grid,
  .do-best-grid,
  .do-best-card:nth-child(3) {
    grid-template-columns: 1fr;
    grid-column: auto;
  }
  .do-best-card {
    min-height: auto;
  }
}


/* V7 hard fix: What I Do Best must render as tiles */
#what-i-do .do-best-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
  align-items: stretch !important;
}
#what-i-do .do-best-card {
  display: block !important;
  min-height: 560px !important;
  padding: clamp(28px, 3vw, 36px) !important;
  border-radius: 28px !important;
  border: 1px solid rgba(255,255,255,0.16) !important;
  color: #f7f8fb !important;
  background:
    radial-gradient(circle at 20% 0%, rgba(145,191,255,0.18), transparent 18rem),
    linear-gradient(145deg, rgba(15, 48, 108, 0.96), rgba(46, 18, 92, 0.96)) !important;
  box-shadow: 0 28px 90px rgba(7, 22, 48, 0.20) !important;
}
#what-i-do .do-best-card:nth-child(2) {
  background:
    radial-gradient(circle at 80% 0%, rgba(191,164,106,0.16), transparent 18rem),
    linear-gradient(145deg, rgba(33, 18, 92, 0.96), rgba(12, 32, 75, 0.96)) !important;
}
#what-i-do .do-best-card:nth-child(3) {
  background:
    radial-gradient(circle at 50% 0%, rgba(145,191,255,0.15), transparent 18rem),
    linear-gradient(145deg, rgba(54, 22, 93, 0.96), rgba(11, 18, 46, 0.96)) !important;
}
#what-i-do .do-best-card h3 {
  margin: 0 0 22px !important;
  color: #ffffff !important;
}
#what-i-do .do-best-card ul {
  margin: 0 !important;
  padding-left: 1.25rem !important;
  color: rgba(255,255,255,0.80) !important;
  font-size: 1.03rem !important;
  line-height: 1.72 !important;
}
@media (max-width: 1080px) {
  #what-i-do .do-best-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #what-i-do .do-best-card:nth-child(3) {
    grid-column: span 2 !important;
    min-height: auto !important;
  }
}
@media (max-width: 720px) {
  #what-i-do .do-best-grid {
    grid-template-columns: 1fr !important;
  }
  #what-i-do .do-best-card,
  #what-i-do .do-best-card:nth-child(3) {
    grid-column: auto !important;
    min-height: auto !important;
  }
}


/* V8: infinite right-to-left tech stack marquee */
.marquee {
  position: relative !important;
  width: 100% !important;
  overflow: hidden !important;
  margin-top: clamp(50px, 8vw, 86px) !important;
  border-block: 1px solid var(--line) !important;
  color: var(--muted) !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%) !important;
  mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%) !important;
}

.marquee .marquee-track {
  display: flex !important;
  align-items: center !important;
  width: max-content !important;
  gap: 42px !important;
  padding: 18px 0 !important;
  animation: marquee-scroll-v8 34s linear infinite !important;
  will-change: transform !important;
}

.marquee span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  font-family: var(--display, "Space Grotesk", system-ui, sans-serif) !important;
  font-size: clamp(0.95rem, 1.25vw, 1.16rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.035em !important;
  text-transform: uppercase !important;
  opacity: 0.72 !important;
  transform: translateZ(0) scale(1) !important;
  transition: transform 180ms ease, opacity 180ms ease, color 180ms ease !important;
}

.marquee span:hover {
  transform: translateZ(0) scale(1.16) !important;
  opacity: 1 !important;
  color: var(--blue) !important;
}

@keyframes marquee-scroll-v8 {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .marquee .marquee-track {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}


/* V10: About origin tile; based on pre-sunglasses V8 version */
#about .about-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  max-width: none !important;
}

.origin-card {
  color: #ffffff;
  background:
    radial-gradient(circle at 82% 10%, rgba(191,164,106,0.24), transparent 12rem),
    linear-gradient(135deg, #111827, #233a67) !important;
  box-shadow: var(--shadow) !important;
}

.origin-card p {
  color: rgba(255,255,255,0.74) !important;
}

.origin-card a {
  color: #dbeaff !important;
  font-weight: 900 !important;
}

@media (max-width: 1080px) {
  #about .about-grid {
    grid-template-columns: 1fr 1fr !important;
  }

  #about .about-grid .origin-card {
    grid-column: span 2;
  }
}

@media (max-width: 720px) {
  #about .about-grid,
  #about .about-grid .origin-card {
    grid-template-columns: 1fr !important;
    grid-column: auto !important;
  }
}


/* V11: About tile order and academic tile */
#about .about-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  max-width: none !important;
}

.academics-card {
  color: #ffffff;
  background:
    radial-gradient(circle at 15% 0%, rgba(145,191,255,0.18), transparent 12rem),
    linear-gradient(135deg, #1a2232, #263b66) !important;
  box-shadow: var(--shadow) !important;
}

.academics-card p {
  color: rgba(255,255,255,0.76) !important;
  margin-bottom: 18px !important;
}

.academics-card p:last-child {
  margin-bottom: 0 !important;
}

.academics-card strong {
  color: #ffffff !important;
  font-weight: 900 !important;
}

@media (max-width: 1080px) {
  #about .about-grid {
    grid-template-columns: 1fr 1fr !important;
  }

  #about .about-grid .dark {
    grid-column: span 2;
  }

  #about .about-grid .origin-card {
    grid-column: auto !important;
  }
}

@media (max-width: 720px) {
  #about .about-grid,
  #about .about-grid .dark,
  #about .about-grid .origin-card {
    grid-template-columns: 1fr !important;
    grid-column: auto !important;
  }
}
