/* ============================================================
   V13 — refined biographical portfolio, precise grid and rhythm
   ============================================================ */
:root{
  --v13-shell:1440px;
  --v13-gutter:clamp(40px,5vw,84px);
  --v13-navy:#112d49;
  --v13-teal:#0b9f9a;
  --v13-text:#263944;
  --v13-muted:#5b6b74;
  --v13-paper:#f4f7f7;
  --v13-line:#d9e2e4;
}
html,body{max-width:100%;overflow-x:clip}
body{font-size:17px;line-height:1.65;color:var(--v13-text)}
.shell,.page-width{width:min(var(--v13-shell),calc(100% - (2 * var(--v13-gutter))));margin-inline:auto}
.section{position:relative}
.section-label{font-size:.9rem;line-height:1;font-weight:800;letter-spacing:.14em;color:var(--v13-teal);margin:0 0 18px;text-transform:uppercase}
h1,h2,h3{color:var(--v13-navy);text-wrap:balance}

/* Header */
.site-header{height:80px}
.header-inner{width:min(1540px,calc(100% - (2 * var(--v13-gutter))));height:80px}
.social-icons{gap:15px}
.social-icons a{width:40px;height:40px}
.social-icons img{width:29px;height:29px}
.social-icons a:nth-child(4) img{width:31px;height:31px}
.social-icons a:nth-child(5) img{width:30px;height:30px}
.primary-nav{gap:clamp(24px,2.4vw,42px)}
.primary-nav a{font-size:1.02rem;font-weight:750;padding:27px 0 23px}
.primary-nav a:not(.nav-cta)::after,.primary-nav .nav-cta::after{bottom:12px;height:3px}

/* Hero */
.v13-hero{padding-top:80px;background:linear-gradient(110deg,#fff 0%,#fff 63%,#f3f8f8 100%);border-bottom:1px solid #e5ecee}
.v13-hero .hero-inner{min-height:0;grid-template-columns:minmax(0,1fr) minmax(360px,450px);gap:clamp(58px,6vw,104px);padding-block:clamp(48px,5vw,76px);align-items:center}
.v13-hero .hero-copy{max-width:760px}
.v13-hero .hero-role{font-size:clamp(1.15rem,1.35vw,1.38rem);font-weight:600;letter-spacing:.01em;margin:0 0 14px;color:var(--v13-teal)}
.v13-hero .hero-role span{color:#8a9aa2;margin-inline:.32em}
.v13-hero h1{font-size:clamp(3.55rem,4.25vw,4.9rem);line-height:.98;letter-spacing:-.035em;margin:0 0 23px;white-space:normal}
.v13-hero h1 small{font-size:.46em;font-weight:700;letter-spacing:-.01em;white-space:nowrap;margin-left:.13em;color:#31506c}
.v13-hero .hero-intro{font-size:clamp(1.15rem,1.32vw,1.32rem);line-height:1.58;max-width:60ch;margin:0 0 14px;color:#2e414d}
.v13-hero .hero-detail{font-size:clamp(1rem,1.08vw,1.1rem);line-height:1.7;max-width:67ch;margin:0;color:#556670}
.v13-hero .hero-actions{margin-top:28px;gap:16px}
.v13-hero .button{min-height:52px;padding-inline:28px}
.v13-hero .hero-portrait{width:100%;max-width:430px;justify-self:end;margin:0;filter:drop-shadow(0 20px 38px rgba(17,45,73,.14))}
.v13-hero .hero-portrait::before{inset:12px -13px -12px 13px;clip-path:polygon(12% 0,100% 0,100% 100%,0 100%);background:linear-gradient(135deg,#d8f0ef,#eef4f6)}
.v13-hero .hero-portrait img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:center;clip-path:polygon(12% 0,100% 0,100% 100%,0 100%);filter:none}

/* About */
.about{padding:clamp(76px,6.5vw,108px) 0;background:#fff}
.about-inner{text-align:left}
.about-top{display:grid;grid-template-columns:minmax(320px,.78fr) minmax(0,1.22fr);gap:clamp(58px,7vw,112px);align-items:start}
.about-heading{position:sticky;top:116px}
.about-heading h2{font-size:clamp(2.8rem,3.7vw,4.15rem);line-height:1.04;max-width:12.5ch;margin:0;letter-spacing:-.035em}
.about-copy-v13{font-size:1.05rem;line-height:1.76;color:#4d5c65;padding-top:3px}
.about-copy-v13 p{margin:0 0 19px;max-width:73ch}
.about-copy-v13 .about-lead{font-size:clamp(1.22rem,1.5vw,1.48rem);line-height:1.55;color:#223641;margin-bottom:24px}
.about-copy-v13 strong{color:#087f7b;font-style:italic}
.degree-row-v13{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(26px,3vw,48px);max-width:none;margin:54px 0 0}
.degree-row-v13 article{border-top:2px solid var(--v13-teal);padding:18px 0 0;min-height:118px}
.degree-row-v13 span{font-size:.82rem;letter-spacing:.13em;color:#718089;margin-bottom:8px}
.degree-row-v13 strong{font-family:var(--display);font-size:clamp(1.35rem,1.6vw,1.65rem);line-height:1.18;color:var(--v13-navy)}
.degree-row-v13 small{display:block;margin-top:7px;color:#6e7d85;font-size:.84rem}

/* Principles */
.principles{padding:clamp(78px,6.4vw,106px) 0;background:var(--v13-paper)}
.principles-intro{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(320px,.72fr);gap:clamp(58px,7vw,112px);align-items:end}
.principles-intro h2{font-size:clamp(2.8rem,3.75vw,4.2rem);line-height:1.05;letter-spacing:-.035em;max-width:16ch;margin:0}
.principles-intro>p{font-size:1.08rem;line-height:1.7;color:#596a74;max-width:39ch;margin:0 0 4px;justify-self:end}
.principle-grid-v13{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:48px}
.principle-grid-v13 article{background:#fff;border:1px solid #e1e8e9;border-top:4px solid var(--v13-teal);padding:27px 25px 29px;min-height:260px;box-shadow:0 12px 30px rgba(16,45,62,.045)}
.principle-grid-v13 span{font-family:var(--display);font-size:3.15rem;line-height:1;color:rgba(11,159,154,.5);letter-spacing:-.06em;margin:0 0 31px}
.principle-grid-v13 h3{font-size:clamp(1.28rem,1.45vw,1.52rem);line-height:1.18;margin:0 0 12px}
.principle-grid-v13 p{font-size:.98rem;line-height:1.62;color:#62727b;margin:0}

/* Work */
.work{padding:clamp(82px,6.8vw,112px) 0;background:#fff}
.work .split-heading{grid-template-columns:minmax(0,1.05fr) minmax(320px,.65fr);gap:clamp(52px,6vw,94px)}
.work .split-heading h2{font-size:clamp(2.8rem,3.65vw,4.05rem);max-width:15ch}
.work-grid-v13{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:280px;gap:18px;margin-top:46px}
.work-grid-v13 .work-card{grid-column:auto;grid-row:auto;border-radius:4px;min-width:0;overflow:hidden}
.work-grid-v13 .work-feature{grid-column:span 2;grid-row:span 2}
.work-grid-v13 .work-card:nth-child(6){grid-column:span 2}
.work-grid-v13 .ssa-card{grid-column:span 2;background:#fff;border:1px solid #dfe7e9}
.work-grid-v13 .work-wide{grid-column:span 2}
.work-grid-v13 .work-card img{width:100%;height:100%;object-fit:cover}
.work-grid-v13 .clean-card img{object-fit:contain;background:#fff;padding:18px}
.work-grid-v13 .ssa-card img{object-fit:contain;padding:20px 22px 62px;background:#fff}
.work-grid-v13 .work-card figcaption{padding:62px 22px 19px}
.work-grid-v13 .clean-card figcaption{padding:42px 20px 17px;background:linear-gradient(transparent,rgba(5,20,31,.94))}
.work-grid-v13 .work-card small{font-size:.71rem}
.work-grid-v13 .work-card strong{font-size:1.08rem;line-height:1.3}
.work-footer{padding-top:30px}

/* YouTube: no fake local thumbnails */
.youtube{padding:clamp(78px,6.5vw,104px) 0;background:#edf3f3}
.youtube-heading-v13{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(320px,.64fr);gap:clamp(52px,6vw,94px);align-items:end}
.youtube-heading-v13 h2{font-size:clamp(2.9rem,3.8vw,4.2rem);line-height:1.04;max-width:12ch;margin:0}
.youtube-heading-v13>div:last-child p{font-size:1.06rem;line-height:1.7;color:#5a6a73;max-width:39ch;margin:0 0 14px}
.youtube-grid-v13{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr);gap:20px;margin-top:42px}
.live-video-card{display:block;background:#fff;border-radius:4px;overflow:hidden;box-shadow:0 12px 30px rgba(17,45,73,.07)}
.video-embed-shell{position:relative;aspect-ratio:16/9;background:#06111c}
.video-embed-shell iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.live-video-card .video-meta{padding:22px 24px 24px}
.live-video-card .video-meta small{font-size:.72rem;letter-spacing:.13em}
.live-video-card .video-meta strong{display:block;font-size:clamp(1.4rem,1.8vw,1.85rem);margin:7px 0 3px}
.live-video-card .video-meta span{color:#60717a;font-size:.9rem}
.channel-card{display:grid;grid-template-columns:64px minmax(0,1fr) 24px;gap:22px;align-items:center;background:var(--v13-navy);color:#fff;border-radius:4px;padding:clamp(30px,3vw,46px);min-height:100%;transition:transform .2s ease,background .2s ease}
.channel-card:hover{transform:translateY(-3px);background:#173b5e}
.channel-mark{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#ef2b25;color:#fff;font-size:1.3rem}
.channel-card small{display:block;color:#75e4dd;font-size:.72rem;text-transform:uppercase;letter-spacing:.13em;font-weight:800;margin-bottom:9px}
.channel-card strong{display:block;color:#fff;font-family:var(--display);font-size:clamp(1.45rem,1.9vw,1.95rem);line-height:1.15}
.channel-card p{color:#c6d2da;margin:14px 0 0;font-size:.93rem;line-height:1.55}
.channel-card>b{font-size:1.5rem;color:#75e4dd}

/* Build together */
.build{padding:clamp(80px,6.6vw,108px) 0 74px;background:var(--v13-navy)}
.build-head-v13{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.72fr);gap:clamp(56px,7vw,112px);align-items:end}
.build-head-v13 h2{font-size:clamp(2.9rem,3.85vw,4.35rem);line-height:1.04;max-width:16ch;letter-spacing:-.035em}
.build-head-v13 .build-copy p{font-size:1.12rem;line-height:1.74;max-width:45ch}
.build-paths-v13{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:48px}
.build-paths-v13 a{display:block;border-top:3px solid #65ded7;background:rgba(255,255,255,.045);padding:25px 24px 27px;min-height:242px;transition:.2s}
.build-paths-v13 a:hover{background:rgba(255,255,255,.075);transform:translateY(-3px)}
.build-paths-v13 span{font-family:var(--display);font-size:2.8rem;line-height:1;color:#65ded7;opacity:.72}
.build-paths-v13 h3{font-size:1.5rem;color:#fff;margin:28px 0 11px;line-height:1.18}
.build-paths-v13 p{font-size:.95rem;line-height:1.62;color:#b9c7d0;margin:0 0 20px}
.build-paths-v13 b{color:#75e4dd;font-size:.85rem;letter-spacing:.02em}
.site-footer{padding:32px 0}

/* Responsive */
@media(max-width:1180px){
  :root{--v13-gutter:clamp(34px,4vw,58px)}
  .v13-hero .hero-inner{grid-template-columns:minmax(0,1fr) minmax(330px,390px);gap:48px}
  .v13-hero h1{font-size:clamp(3.2rem,5vw,4.4rem)}
  .principle-grid-v13{grid-template-columns:repeat(2,minmax(0,1fr))}
  .work-grid-v13{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:300px}
  .work-grid-v13 .work-feature,.work-grid-v13 .work-card:nth-child(6),.work-grid-v13 .ssa-card,.work-grid-v13 .work-wide{grid-column:span 2}
}
@media(max-width:900px){
  :root{--v13-gutter:28px}
  .header-inner{width:calc(100% - 40px)}
  .v13-hero .hero-inner{grid-template-columns:1fr;gap:40px;padding-block:48px 64px}
  .v13-hero .hero-copy{max-width:760px}
  .v13-hero .hero-portrait{justify-self:center;max-width:430px}
  .about-top,.principles-intro,.youtube-heading-v13,.build-head-v13{grid-template-columns:1fr;gap:30px}
  .about-heading{position:static}
  .about-heading h2{max-width:14ch}
  .degree-row-v13{grid-template-columns:1fr;gap:24px}
  .degree-row-v13 article{min-height:0}
  .youtube-grid-v13{grid-template-columns:1fr}
  .channel-card{min-height:260px}
  .build-paths-v13{grid-template-columns:1fr}
}
@media(max-width:820px){
  .site-header,.header-inner{height:72px}
  .v13-hero{padding-top:72px}
  .social-icons{gap:5px}
  .social-icons a{width:34px;height:34px}
  .social-icons img{width:24px;height:24px}
}
@media(max-width:620px){
  :root{--v13-gutter:18px}
  .v13-hero h1{font-size:clamp(2.95rem,13vw,4rem)}
  .v13-hero h1 small{display:block;font-size:.42em;margin:8px 0 0}
  .v13-hero .hero-role{font-size:1.04rem}
  .v13-hero .hero-intro{font-size:1.05rem}
  .v13-hero .hero-detail{font-size:.97rem}
  .v13-hero .hero-actions{display:grid;grid-template-columns:1fr 1fr}
  .v13-hero .button{padding-inline:16px;text-align:center}
  .v13-hero .hero-portrait img,.v13-hero .hero-portrait::before{clip-path:none}
  .about-heading h2,.principles-intro h2,.youtube-heading-v13 h2,.build-head-v13 h2{font-size:2.55rem}
  .principle-grid-v13{grid-template-columns:1fr}
  .principle-grid-v13 article{min-height:0}
  .work-grid-v13{grid-template-columns:1fr;grid-auto-rows:300px}
  .work-grid-v13 .work-feature,.work-grid-v13 .work-card:nth-child(6),.work-grid-v13 .ssa-card,.work-grid-v13 .work-wide{grid-column:auto;grid-row:auto}
  .work-grid-v13 .ssa-card{height:330px}
  .channel-card{grid-template-columns:54px minmax(0,1fr);min-height:0;padding:28px 24px}
  .channel-card>b{display:none}
  .channel-mark{width:50px;height:50px}
  .build-paths-v13 a{min-height:0}
}
