@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&family=Caveat:wght@600;700&display=swap');
:root{color-scheme:light;--ink:#111111;--muted:#111111;--paper:#fff;--surface:#fff;--line:#dce5f1;--primary:#174ea6;--highlight:#d9ecff;--soft:#eff6ff;--blue:#2465b2;--purple:#8747ab;--success:#248050;--radius:18px;--header:76px}
*{box-sizing:border-box}html{scrollbar-gutter:stable;scroll-behavior:smooth;scroll-padding-top:104px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 'DM Sans',system-ui,sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,input{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.42}:focus-visible{outline:3px solid var(--blue);outline-offset:4px}h1,h2,h3{font-family:Manrope,system-ui,sans-serif;line-height:1.18;letter-spacing:-.045em;margin:0}h1{font-size:clamp(38px,5.5vw,76px);font-weight:600}h2{font-size:clamp(28px,3.2vw,42px);font-weight:600}h3{font-size:23px;font-weight:600}p{margin:0 0 18px}img{max-width:100%;display:block}button{color:inherit}svg{display:block}code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.9em}.container{width:min(1200px,calc(100% - 64px));margin:auto}.site-header{height:var(--header);position:sticky;top:0;z-index:30;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}.nav-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;gap:12px;align-items:center;font-size:15px;font-weight:700;letter-spacing:-.02em}.monogram{background:var(--ink);color:var(--highlight);width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-size:12px;letter-spacing:-.03em}.nav-links{display:flex;align-items:center;gap:28px;font-size:14px}.nav-links a{padding:7px 0;color:var(--muted)}.nav-links a:hover,.nav-links a[aria-current=page]{color:var(--ink)}.nav-links a[aria-current=page]{box-shadow:0 2px var(--primary)}.skip{position:fixed;left:16px;top:-90px;z-index:100;background:var(--ink);color:white;padding:12px}.skip:focus{top:12px}.eyebrow{text-transform:uppercase;font-size:11px;letter-spacing:.17em;font-weight:700;display:flex;align-items:center;gap:9px;margin-bottom:22px;color:var(--primary)}.dot{width:7px;height:7px;background:var(--primary);border-radius:50%}.muted{color:var(--muted)}.lede{font-size:19px;line-height:1.65;color:var(--muted);max-width:620px}.btn{display:inline-flex;justify-content:center;align-items:center;gap:16px;min-height:46px;padding:11px 20px;border:1px solid var(--line);border-radius:9px;background:var(--surface);font-size:14px;font-weight:600;transition:background .18s,transform .18s}.btn:hover:not(:disabled){background:var(--soft);transform:translateY(-1px)}.btn-primary{background:var(--primary);color:#fff;border-color:var(--primary)}.btn-primary:hover:not(:disabled){background:#123b7c}.btn-lime{background:var(--highlight);border-color:var(--highlight);color:var(--ink)}.actions{display:flex;flex-wrap:wrap;gap:12px}.text-link{display:inline-flex;gap:10px;align-items:center;font-size:14px;font-weight:600;text-decoration:underline;text-underline-offset:5px}.hero{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:76px;padding:64px 0 72px}.hero h1{margin-bottom:25px}.hero h1 em{font-style:normal;color:var(--primary)}.hero .lede{max-width:530px;margin-bottom:30px}.hero-name{font-size:16px;color:var(--muted);margin-bottom:14px}.portrait-wrap{position:relative}.portrait-frame{border-radius:140px 20px 20px 20px;overflow:hidden;background:#e6edf5;aspect-ratio:4/5}.portrait-frame img{height:100%;width:100%;object-fit:cover;object-position:center 30%}.portrait-caption{display:flex;justify-content:space-between;gap:16px;padding:15px 3px 0;font-size:12px;color:var(--muted)}.hero-note{margin-top:26px;font-size:12px;color:var(--muted)}.section{padding:70px 0;border-top:1px solid var(--line)}.section-heading{display:grid;grid-template-columns:1fr 1fr;gap:55px;margin-bottom:35px}.section-heading p{color:var(--muted);max-width:530px}.section-heading .eyebrow{margin-bottom:12px}.skills{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.tag{display:inline-flex;padding:5px 11px;border:1px solid var(--line);border-radius:6px;font-size:12px;color:var(--muted);background:var(--surface)}.experience{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.experience article{border-top:2px solid var(--primary);padding-top:22px}.experience h3{font-size:20px;margin:10px 0 13px}.experience p{font-size:15px;color:var(--muted)}.small-label{font-size:12px;color:var(--muted)}.learning-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.learning-card{border:1px solid var(--line);border-radius:var(--radius);padding:30px;background:var(--surface);display:flex;flex-direction:column;transition:transform .2s,border-color .2s}.learning-card:hover{transform:translateY(-3px);border-color:#a6bddb}.learning-card h3{font-size:30px;margin:20px 0 14px}.learning-card p{color:var(--muted);max-width:430px}.learning-card .text-link{margin-top:auto;padding-top:15px}.mini-array{display:flex;gap:8px;margin:26px 0 8px}.mini-array span{display:grid;place-items:center;width:48px;height:48px;border-radius:8px;background:var(--soft);font-family:ui-monospace,monospace;font-size:16px}.mini-array span:nth-child(2),.mini-array span:last-child{background:var(--highlight)}.ml-motif{height:48px;display:flex;align-items:center;gap:12px;margin:26px 0 8px}.ml-motif span{height:12px;width:12px;background:#a0bbdc;border-radius:50%}.ml-motif i{height:1px;width:42px;background:var(--line)}.ml-motif span:last-child{height:30px;width:30px;background:var(--primary)}.site-footer{padding:28px 0;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}.footer-inner{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}.page-intro{padding:64px 0 42px;max-width:860px}.page-intro h1{margin-bottom:24px;font-size:clamp(38px,5vw,62px)}.page-intro .eyebrow{margin-bottom:18px}.breadcrumb{font-size:12px;color:var(--muted);display:flex;gap:10px;margin-bottom:28px}.lesson-card{display:grid;grid-template-columns:1.2fr .8fr;gap:35px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);padding:36px;margin:0 0 60px}.lesson-card h2{font-size:30px;margin:15px 0}.lesson-card p{color:var(--muted)}.lesson-card .mini-array{justify-content:center;align-self:center}.topic-row{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.notice{background:var(--soft);border-radius:var(--radius);padding:38px;margin-bottom:55px}.notice h2{margin-bottom:18px}.topic-list{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;margin:32px 0 0}.topic-list article{padding-top:20px;border-top:1px solid #cbdcf0}.topic-list h3{font-size:20px;margin-bottom:10px}.topic-list p{font-size:14px;color:var(--muted)}.project-strip{margin-top:30px;padding:24px;border:1px solid var(--line);border-radius:12px;display:flex;justify-content:space-between;align-items:center;gap:24px}.project-strip p{margin:4px 0 0;color:var(--muted);font-size:14px}@media(max-width:900px){.container{width:calc(100% - 40px)}.hero{gap:35px}.hero h1{font-size:49px}.experience{gap:16px}.nav-links{gap:18px}.section-heading{gap:30px}}@media(max-width:640px){:root{--header:104px}.nav-inner{flex-wrap:wrap;justify-content:center;gap:0;padding:10px 0}.brand{font-size:14px}.nav-links{width:100%;justify-content:center;gap:24px;font-size:13px}.hero{grid-template-columns:1fr;padding:38px 0 44px;gap:34px}.hero h1{font-size:47px}.portrait-wrap{max-width:440px}.portrait-frame{aspect-ratio:1/1;border-radius:90px 16px 16px 16px}.portrait-frame img{object-position:50% 25%}.section{padding:44px 0}.section-heading,.experience,.learning-grid,.topic-list,.lesson-card{grid-template-columns:1fr;gap:24px}.learning-card,.lesson-card{padding:24px}.experience{gap:25px}.page-intro{padding:38px 0 30px}.notice{padding:26px}.project-strip{align-items:start;flex-direction:column}.lede{font-size:17px}.footer-inner{gap:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Small interactions complement the one-time entrance animations. */
@media(prefers-reduced-motion:no-preference){
  .portrait-frame img{transition:transform .65s cubic-bezier(.2,.65,.3,1)}
  .portrait-frame:hover img{transform:scale(1.025)}
  .btn [aria-hidden],.text-link [aria-hidden]{transition:transform .2s ease}
  .btn:hover [aria-hidden],.learning-card:hover .text-link [aria-hidden],.text-link:hover [aria-hidden]{transform:translate(3px,-2px)}
  .tag{transition:background .2s,border-color .2s}
  .tag:hover{background:var(--soft);border-color:#a6bddb}
  .learning-card .mini-array span{transition:transform .25s ease}
  .learning-card:hover .mini-array span:nth-child(2),.learning-card:hover .mini-array span:last-child{transform:translateY(-5px)}
}

/* Signature mark: midnight blue, silver-blue edge, and a restrained light sweep. */
.brand{display:inline-flex;flex-shrink:0;border-radius:13px}
.monogram{position:relative;isolation:isolate;overflow:hidden;width:46px;height:46px;border-radius:13px;background:linear-gradient(145deg,#183b70,#0d203d);color:#e7f2ff;border:1px solid #7fa6d6;font-family:Manrope,system-ui,sans-serif;font-size:17px;font-weight:700;letter-spacing:-.09em;padding-right:2px;box-shadow:inset 0 1px 0 #ffffff20,0 3px 10px #142b4a14}
.monogram::before{content:'';position:absolute;inset:3px;border:1px solid #b3d6ff4d;border-radius:9px;pointer-events:none}
.monogram::after{content:'';position:absolute;inset:-50%;background:linear-gradient(105deg,transparent 38%,#fff5 50%,transparent 62%);transform:translateX(-95%) rotate(12deg);pointer-events:none}
.portrait-caption{flex-wrap:wrap;gap:5px 16px}
@media(prefers-reduced-motion:no-preference){
  .monogram{animation:rg-arrive .65s cubic-bezier(.2,.65,.3,1) both;transition:transform .25s,box-shadow .25s}
  .monogram::after{animation:rg-sheen 1.2s .35s ease-out both}
  .brand:hover .monogram,.brand:focus-visible .monogram{transform:translateY(-2px);box-shadow:inset 0 1px 0 #ffffff20,0 6px 18px #142b4a25}
  .brand:hover .monogram::after,.brand:focus-visible .monogram::after{animation:rg-sheen-hover .8s ease-out both}
}
@keyframes rg-arrive{from{opacity:0;transform:translateY(5px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes rg-sheen{from{transform:translateX(-95%) rotate(12deg)}to{transform:translateX(95%) rotate(12deg)}}
@keyframes rg-sheen-hover{from{transform:translateX(-95%) rotate(12deg)}to{transform:translateX(95%) rotate(12deg)}}
@media(max-width:640px){.monogram{width:38px;height:38px;border-radius:11px;font-size:15px}.monogram::before{border-radius:7px}}

.learning-paths{padding:0 0 70px}.project-strip{position:relative;overflow:hidden}
.project-strip::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--primary);transform:scaleY(0);transform-origin:bottom}
@media(prefers-reduced-motion:no-preference){
 .project-strip{transition:border-color .25s,box-shadow .25s,transform .25s}
 .project-strip::before{transition:transform .3s ease}
 .project-strip:hover,.project-strip:focus-within{border-color:#a1bedf;box-shadow:0 8px 28px #17395c0a;transform:translateY(-2px)}
 .project-strip:hover::before,.project-strip:focus-within::before{transform:scaleY(1)}
 .learning-card .ml-motif span{transition:transform .3s ease}
 .learning-card:hover .ml-motif span:last-child{transform:scale(1.15)}
}
@media(max-width:640px){.nav-links{gap:16px}.nav-links a{font-size:12px}.learning-paths{padding-bottom:44px}}

/* Scalable, decorative learning illustrations. Motion runs on entry or interaction. */
.learning-art{margin:24px 0 4px;border-radius:16px;background:radial-gradient(ellipse at 70% 15%,#dcebff 0,transparent 65%),#f3f8ff;overflow:hidden;border:1px solid #dce8f7}
.learning-art svg{width:100%;height:auto;max-height:180px;display:block}
.art-guide{stroke:#ccddf2;stroke-width:1;fill:none}
.art-tile rect{fill:#fff;stroke:#ccdef3;stroke-width:1}
.art-tile text{fill:var(--ink);font:500 15px ui-monospace,monospace;text-anchor:middle}
.art-tile-active rect{fill:#d7eaff;stroke:#98c2ee}
.art-pointer rect{fill:var(--primary)}
.art-pointer-right rect{fill:#4676b1}
.art-pointer text{fill:white;font:600 13px ui-monospace,monospace;text-anchor:middle}
.art-pointer path{fill:none;stroke:var(--primary);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.art-indices text{fill:#6d819e;font:10px ui-monospace,monospace;text-anchor:middle}
.network-lines path{stroke:#bfd5ef;stroke-width:1.3;fill:none}
.network-signal{fill:none;stroke:#5086c6;stroke-width:2;stroke-dasharray:5 9;opacity:.5}
.network-input circle{fill:#fff;stroke:#90b5e1;stroke-width:1.5}
.network-hidden circle{fill:#d7eaff;stroke:#9bc4f0;stroke-width:1.5}
.network-output-ring{fill:none;stroke:#9ac0e9;stroke-width:1;stroke-dasharray:3 4}
.network-output{fill:var(--primary)}
.network-spark{fill:#e7f4ff}
.network-packet{fill:var(--primary);opacity:0}
.network-output-ring,.network-hidden circle{transform-box:fill-box;transform-origin:center}
@media(prefers-reduced-motion:no-preference){.learning-art{transition:border-color .25s,background-color .25s}.learning-card:hover .learning-art,.learning-card:focus-visible .learning-art{border-color:#9abfe8}}

/* Deep-blue headings keep the white theme crisp and readable. */
h1,h2,h3{color:#173e76}

/* Black reading text with a blue italic signature footer. */
.site-footer,.site-footer a{color:var(--primary);font-style:italic}
.site-footer .footer-inner > span:first-child{font-weight:600;letter-spacing:.04em}
.art-indices text{fill:#111111}

/* A handwritten blue signature, shared by the header and footer. */
.monogram{width:50px;height:48px;border:2px solid #2466cb;border-radius:16px 13px 18px 12px;background:#f4f9ff;color:#174ea6;font-family:'Caveat','Segoe Print','Bradley Hand',cursive;font-size:32px;font-weight:700;letter-spacing:-.065em;padding:0 3px 2px 0;box-shadow:3px 3px 0 #dceaff}
.monogram::before{inset:4px;border:1px solid #a9ccff;border-radius:11px 8px 13px 7px}
.monogram::after{background:linear-gradient(105deg,transparent 38%,#fff9 50%,transparent 62%)}
.site-footer .footer-inner > .footer-signature{font-family:'Caveat','Segoe Print','Bradley Hand',cursive;font-size:30px;line-height:1.2;font-weight:700;font-style:normal;letter-spacing:-.05em;transform:rotate(-5deg);display:inline-block}
.footer-inner{align-items:center}
@media(prefers-reduced-motion:no-preference){
 .monogram{animation:rg-sign-in .8s cubic-bezier(.2,.8,.3,1) both}
 .brand:hover .monogram,.brand:focus-visible .monogram{transform:rotate(-6deg) translateY(-2px);box-shadow:5px 6px 0 #dceaff}
}
@keyframes rg-sign-in{0%{opacity:0;transform:rotate(-12deg) scale(.85)}65%{opacity:1;transform:rotate(4deg) scale(1.04)}100%{opacity:1;transform:rotate(0) scale(1)}}
@media(max-width:640px){.monogram{width:43px;height:40px;font-size:28px;border-radius:13px 10px 15px 10px}}

/* Identical handwriting in both signatures; only the header has a frame. */
.monogram,.site-footer .footer-inner > .footer-signature{font-family:'Caveat','Segoe Print','Bradley Hand',cursive;font-size:30px;font-weight:700;font-style:normal;letter-spacing:-.05em;line-height:1;color:var(--primary)}
.monogram{display:flex;align-items:center;justify-content:center;padding:0; text-indent:0}
.site-footer .footer-inner > .footer-signature{transform:none;border:0;background:none;box-shadow:none;padding:0}
@media(max-width:640px){.monogram{font-size:30px}}

/* Quiet dotted backdrop, with company badges confined to clear outer lanes. */
.hero{position:relative;isolation:isolate;padding-top:130px;padding-bottom:170px}
.hero::before{content:'';position:absolute;inset:0 -20px;z-index:-2;background-color:#fff;background-image:radial-gradient(circle,#171f2c24 .75px,transparent .9px);background-size:20px 20px;pointer-events:none;mask-image:linear-gradient(to bottom,transparent,#000 7%,#000 92%,transparent)}
.hero > div:first-child,.hero > .portrait-wrap{z-index:1;position:relative}
.hero > div:first-child{background:radial-gradient(ellipse at center,#fffffff5 35%,#ffffffd9 72%,transparent 100%)}
.hero-companies{display:contents}
.company-band-label{position:absolute;left:0;right:0;bottom:104px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#525d6d}

.company-badge{position:absolute;display:flex;align-items:center;gap:10px;padding:12px 17px;border:1px solid #d6deea;background:#ffffffec;border-radius:14px;color:#58677e;box-shadow:0 5px 22px #162c4710;font-size:12px;white-space:nowrap;pointer-events:none;will-change:transform}
.company-monogram{font:700 17px/1.2 Manrope,system-ui,sans-serif;letter-spacing:-.06em;border:1px solid #d1dbe8;border-radius:8px;padding:6px;color:#3e5574;background:#f5f8fc}
.company-badge small{display:block;font-size:8px;letter-spacing:.08em;margin-top:3px}
.company-bofa{left:3%;top:26px;--drift-x:7px;--drift-y:-5px;--duration:9s;--delay:-2s}
.company-ronesans{right:5%;top:28px;--drift-x:-9px;--drift-y:5px;--duration:11s;--delay:-5s}
.company-hyundai{left:2%;bottom:27px;--drift-x:8px;--drift-y:5px;--duration:10s;--delay:-4s}
.company-gap{left:43%;bottom:28px;--drift-x:-6px;--drift-y:-6px;--duration:12s;--delay:-7s}
.company-dm{right:2%;bottom:27px;--drift-x:7px;--drift-y:-5px;--duration:9.5s;--delay:-1s}
.company-dm svg{width:31px;height:31px;fill:none;stroke:#536d90;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.company-dm strong{font-size:17px;letter-spacing:-.07em;color:#3e5574}
@media(prefers-reduced-motion:no-preference){.company-badge{animation:company-float var(--duration) ease-in-out var(--delay) infinite alternate}.hero.motion-offscreen .company-badge{animation-play-state:paused}}
@keyframes company-float{from{transform:translate(0,0) rotate(-1deg)}to{transform:translate(var(--drift-x),var(--drift-y)) rotate(1deg)}}
@media(max-width:1000px){.hero{padding-top:115px;padding-bottom:0}.hero-companies{display:flex;grid-column:1/-1;flex-wrap:wrap;gap:18px 14px;padding:0 0 35px;justify-content:center}.company-band-label{position:static;width:100%;margin-bottom:8px}.company-badge{position:relative;top:auto;bottom:auto;left:auto;right:auto;white-space:normal}.company-bofa,.company-ronesans{position:absolute;top:20px}.company-bofa{left:0}.company-ronesans{right:0}.company-hyundai{margin-right:0}.hero::before{inset:0 -10px}}
@media(max-width:640px){.hero{padding-top:38px;gap:28px}.hero-companies{padding-bottom:35px;gap:16px 12px}.company-bofa,.company-ronesans{position:relative;inset:auto}.company-badge{padding:10px 12px;font-size:11px}.company-band-label{font-size:10px;letter-spacing:.03em}.hero::before{background-size:18px 18px}.company-monogram{font-size:15px}}
@media(prefers-reduced-motion:reduce){.company-badge{will-change:auto}}

/* Keep career badges together in a single, responsive experience band. */
.hero{padding-top:64px;padding-bottom:42px;row-gap:48px}
.hero-companies{display:flex;position:relative;grid-column:1/-1;flex-wrap:wrap;align-items:center;justify-content:center;gap:22px 20px;padding:25px 0 12px;border-top:1px solid #dce5f1}
.company-band-label{position:static;width:100%;margin:0 0 4px}
.hero-companies .company-badge{position:relative;inset:auto;white-space:normal;min-height:68px}
@media(max-width:640px){.hero{padding-top:38px;row-gap:30px}.hero-companies{gap:18px 14px;padding-top:20px}.hero-companies .company-badge{min-height:62px}}

/* Uniform cards share a baseline, with subtle vertical floating. */
.hero-companies{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px 16px}
.company-band-label{grid-column:1/-1;justify-content:center;text-align:center;margin-bottom:10px}
.hero-companies .company-badge{width:100%;height:86px;min-height:86px;justify-content:center;padding:12px;--duration:2.5s;--drift-x:0px;--drift-y:-5px}
.company-monogram{flex-shrink:0}
.company-dm svg{flex-shrink:0}
@keyframes company-float{from{transform:translateY(2px)}to{transform:translateY(-5px)}}
@media(max-width:1100px){.hero-companies{grid-template-columns:repeat(6,minmax(0,1fr))}.hero-companies .company-badge{grid-column:span 2}.hero-companies .company-gap{grid-column:2/span 2}.hero-companies .company-dm{grid-column:4/span 2}}
@media(max-width:640px){.hero-companies{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}.hero-companies .company-badge{grid-column:auto;height:82px;min-height:82px;padding:10px;gap:7px}.hero-companies .company-dm{grid-column:1/-1;justify-self:center;width:calc(50% - 6px)}}

/* Seven experience badges arranged in balanced, aligned rows. */
.hero-companies{grid-template-columns:repeat(8,minmax(0,1fr))}
.hero-companies .company-badge{grid-column:span 2}
.hero-companies .company-gap{grid-column:span 2}
.hero-companies .company-dm{grid-column:2/span 2;width:100%}
.company-orlan{--delay:-2.7s}
.company-ruzvel{--delay:-1.4s}
@media(max-width:900px){.hero-companies{grid-template-columns:repeat(6,minmax(0,1fr))}.hero-companies .company-dm{grid-column:span 2}.hero-companies .company-ruzvel{grid-column:3/span 2}}
@media(max-width:640px){.hero-companies{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-companies .company-badge{grid-column:auto;width:100%}.hero-companies .company-ruzvel{grid-column:1/-1;justify-self:center;width:calc(50% - 6px)}}

/* Compact laptop introduction keeps the experience band in the first view. */
@media(min-width:901px){
 .hero{grid-template-columns:minmax(0,1.35fr) minmax(0,.8fr);column-gap:64px;row-gap:22px;padding-top:28px;padding-bottom:24px}
 .hero h1{font-size:clamp(42px,4vw,56px);line-height:1.12;margin-bottom:16px}
 .hero .eyebrow{margin-bottom:12px}
 .hero-name{margin-bottom:9px}
 .hero .lede{font-size:17px;line-height:1.55;max-width:580px;margin-bottom:18px}
 .hero-note{margin-top:14px;margin-bottom:0;font-size:11px}
 .hero .portrait-wrap{width:100%;max-width:300px;justify-self:center}
 .hero .portrait-frame{border-radius:95px 18px 18px 18px}
 .hero .portrait-caption{padding-top:9px;font-size:11px;gap:2px}
 .hero-companies{padding:16px 0 6px;gap:12px 16px}
 .company-band-label{margin:0 0 2px;font-size:10px}
 .hero-companies .company-badge{height:60px;min-height:60px;padding:8px 12px}
 .company-monogram{font-size:15px;padding:5px}
}
@media(min-width:901px) and (max-height:740px){
 .hero{padding-top:20px;row-gap:16px;padding-bottom:18px}
 .hero h1{font-size:44px}
 .hero .portrait-wrap{max-width:270px}
 .hero .lede{font-size:16px;margin-bottom:14px}
 .hero-companies .company-badge{height:54px;min-height:54px}
}

/* Accessible, persistent language selection shared by every page. */
.nav-inner{display:grid;grid-template-columns:auto 1fr auto;gap:24px}
.nav-links{justify-content:flex-end}
.language-switch{display:flex;gap:2px;padding:3px;border:1px solid #dce5f1;border-radius:12px;background:#f3f8ff}
.language-switch button{border:0;background:transparent;color:#173e76;font:600 12px 'DM Sans',system-ui,sans-serif;padding:7px 9px;min-height:36px;border-radius:8px}
.language-switch button[aria-pressed=true]{background:#174ea6;color:white;box-shadow:0 2px 5px #174ea620}
.language-switch button:hover{box-shadow:inset 0 0 0 1px #174ea6}
html:not([lang=en]) .hero h1{font-size:clamp(36px,3.4vw,48px)}
@media(max-width:1000px){
 :root{--header:114px}
 .nav-inner{grid-template-columns:auto 1fr;grid-template-rows:56px 48px;gap:0 16px;padding:5px 0}
 .brand{grid-column:1;grid-row:1;justify-self:start}
 .language-switch{grid-column:2;grid-row:1;justify-self:end}
 .nav-links{grid-column:1/-1;grid-row:2;width:100%;justify-content:center;gap:22px;font-size:13px}
 .lesson-page{--header:178px}.lesson-page .nav-inner{height:114px}
}
@media(max-width:420px){.nav-links{gap:12px;font-size:11px}.language-switch button{min-height:36px}.hero h1,html:not([lang=en]) .hero h1{font-size:37px}}

.portrait-caption .portrait-location{flex-basis:100%;margin-top:3px;font-size:11px;color:var(--ink)}

.portrait-caption{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.portrait-caption-top{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 7px}
.portrait-caption .portrait-location{flex-basis:auto;margin:0;font-size:inherit}
.portrait-role{display:block}

/* Center the caption and share aligned edges across both lines. */
.hero .portrait-caption{display:grid;grid-template-columns:minmax(0,max-content);justify-content:center;justify-items:stretch;text-align:center;gap:4px;padding-left:0;padding-right:0}
.portrait-caption-top{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:4px 7px}
.portrait-role{text-align:center}

/* Experience anchor remains visible beneath the sticky navigation. */
#experience .company-band-label,#experience .company-badge{color:#000}

/* One clean frame around the centered signature. */
.monogram{display:grid;place-items:center;padding:0;letter-spacing:0;line-height:1}
.monogram::before{content:none;border:0}
.notes-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:36px;align-items:start;padding-top:32px;padding-bottom:48px}
.notes-layout:has(> .notes-sidebar:is(details):not([open])){grid-template-columns:150px minmax(0,1fr)}
.notes-sidebar{position:sticky;top:calc(var(--header) + 20px);border:1px solid var(--line);border-radius:12px;background:#f5f9ff;font-size:14px;max-height:calc(100dvh - var(--header) - 40px);overflow:auto}
.notes-sidebar summary{cursor:pointer;padding:14px;font-weight:600;color:var(--primary)}
.notes-sidebar .notes-menu-toggle{border-bottom:1px solid var(--line)}
.notes-sidebar:is(details):not([open]) .notes-menu-toggle{border-bottom:0}
.notes-sidebar nav{padding:8px}
.notes-sidebar nav summary{padding:10px 6px}
.notes-sidebar a{display:block;padding:10px 12px;margin:3px 0;border-radius:7px;color:#000}
.notes-sidebar a:hover,.notes-sidebar a[aria-current=page]{background:#dceaff;color:#174ea6}
.notes-content{min-width:0}
.notes-heading{padding:8px 0 28px}.notes-heading h1{font-size:clamp(32px,4vw,48px);margin:0 0 16px}
.notes-heading .eyebrow{margin-bottom:12px}
.pattern-overview{padding:24px 0;border-top:1px solid var(--line)}
.pattern-overview h2{font-size:28px;margin:10px 0 18px}.pattern-overview h3{font-size:19px;margin:24px 0 12px}
.note-entry{padding:24px;border:1px solid var(--line);border-radius:12px;margin-top:24px;background:#f8fbff}
.note-entry h3{margin-top:10px}
.notes-content .lesson-intro{padding-top:8px}
@media(min-width:901px) and (max-width:1200px){.notes-layout{gap:22px;grid-template-columns:190px minmax(0,1fr)}.notes-content .workspace{gap:12px}}
@media(max-width:900px){.notes-layout,.notes-layout:has(> .notes-sidebar:is(details):not([open])){grid-template-columns:minmax(0,1fr);gap:22px}.notes-sidebar{position:static;max-height:none}.notes-content .workspace{grid-template-columns:1fr}.notes-content .code-pane{position:static}}

.dsa-sidebar>.notes-menu-toggle{padding:14px;font-weight:600;color:var(--primary)}.notes-content>.pattern-overview{padding-top:32px}