@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+Thai:wght@400;500;600;700&display=swap");

:root {
    --bg-dark: #07111f;
    --bg-deep: #020817;
    --bg-light: #f8fafc;
    --card: #ffffff;
    --text-main: #0f172a;
    --text-muted: #64748b;
    --text-light: #e5e7eb;
    --blue: #2563eb;
    --blue-dark: #1d4ed8;
    --amber: #f59e0b;
    --border: #e2e8f0;
    --shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
    --radius: 14px;
    --container: 1180px;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: "Noto Serif Thai", Georgia, serif;
    color: var(--text-main);
    background: var(--bg-light);
    line-height: 1.65;
}

a {
    color: inherit;
    text-decoration: none;
}

.container {
    width: min(var(--container), calc(100% - 48px));
    margin: 0 auto;
}

.site-header {
    background: rgba(2, 8, 23, 0.96);
    color: white;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    position: sticky;
    top: 0;
    z-index: 100;
}

.nav-container {
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.logo {
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 700;
}

.logo-mark {
    font-size: 26px;
    color: #60a5fa;
    letter-spacing: -2px;
}

.logo-text {
    font-size: 15px;
}

.main-nav {
    display: flex;
    align-items: center;
    gap: 18px;
    font-size: 13px;
}

@media (max-width: 850px) {
    .collaboration-cards {
        grid-template-columns: 1fr;
    }

    .collaboration-cards .feature-card {
        min-height: 0;
    }
}

button,
input,
textarea,
select {
    font: inherit;
}

.main-nav a,
.nav-group-toggle {
    color: #cbd5e1;
}

.main-nav a:hover,
.nav-group-toggle:hover {
    color: white;
}

.nav-group { position: relative; }
.nav-group-toggle {
    border: 0;
    background: transparent;
    padding: 25px 0;
    font: inherit;
    cursor: pointer;
    white-space: nowrap;
}
.nav-group-toggle::after {
    content: "⌄";
    margin-left: 5px;
    color: #60a5fa;
}
.submenu {
    position: absolute;
    top: calc(100% - 7px);
    left: -18px;
    width: 230px;
    padding: 10px;
    border: 1px solid rgba(148, 163, 184, 0.2);
    border-radius: 12px;
    background: rgba(2, 8, 23, 0.99);
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.3);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: 0.18s ease;
}
.submenu-wide { width: 310px; }
.main-nav .nav-group:nth-last-of-type(-n+2) .submenu {
    right: -18px;
    left: auto;
}
.submenu a {
    display: block;
    padding: 10px 12px;
    border-radius: 8px;
}
.submenu a:hover { background: rgba(37, 99, 235, 0.18); }
.nav-group:hover .submenu,
.nav-group:focus-within .submenu,
.nav-group.is-open .submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.language-switch {
    padding: 5px 9px;
    border: 1px solid rgba(96, 165, 250, 0.6);
    border-radius: 999px;
    color: #93c5fd !important;
    font-weight: 700;
}
.nav-toggle {
    display: none;
    width: 42px;
    height: 42px;
    padding: 10px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 8px;
    background: transparent;
}
.nav-toggle span:not(.sr-only) {
    display: block;
    height: 2px;
    margin: 4px 0;
    background: white;
}
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.page-hero {
    padding: 92px 0 72px;
    color: white;
    background: radial-gradient(circle at 16% 20%, rgba(37,99,235,.32), transparent 28%),
                linear-gradient(135deg, var(--bg-deep), var(--bg-dark));
}
.page-hero h1 {
    max-width: 900px;
    margin: 12px 0 18px;
    font-size: clamp(38px, 6vw, 68px);
    line-height: 1.08;
    letter-spacing: -1.5px;
}
.page-hero p {
    max-width: 820px;
    margin: 0;
    color: #cbd5e1;
    font-size: 19px;
}
.lab-hero {
    position: relative;
    overflow: hidden;
    padding: 112px 0 96px;
    background:
        radial-gradient(circle at 78% 20%, rgba(34,211,238,.18), transparent 24%),
        radial-gradient(circle at 15% 100%, rgba(99,102,241,.28), transparent 34%),
        #07111f;
}
.lab-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .13;
    pointer-events: none;
    background-image: linear-gradient(rgba(255,255,255,.14) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.14) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: linear-gradient(to right, transparent, #000 65%);
}
.lab-hero-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(260px, .65fr);
    gap: 80px;
    align-items: end;
}
.lab-hero h1 { max-width: 850px; font-size: clamp(44px, 6.7vw, 82px); }
.lab-hero-actions { display: flex; gap: 24px; align-items: center; margin-top: 34px; }
.lab-hero .text-link { color: #a5f3fc; font-weight: 700; }
.lab-manifesto {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 13px 18px;
    padding: 28px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 22px;
    background: rgba(15,23,42,.64);
    backdrop-filter: blur(14px);
}
.lab-manifesto span { color: #67e8f9; font: 700 12px/1.6 monospace; }
.lab-manifesto p { margin: 0; color: white; font-size: 15px; font-weight: 700; }
.lab-intro-section { padding-bottom: 54px; }
.research-intro {
    max-width: 900px;
    font-size: 18px;
    color: #334155;
}
.research-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 32px 0 0;
}
.research-nav a {
    padding: 8px 13px;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: white;
    color: #1e40af;
    font-size: 13px;
    font-weight: 700;
}
.research-category { scroll-margin-top: 92px; }
.archive-anchor { scroll-margin-top: 86px; }
.research-spotlight { padding-top: 82px; color: white; background: #0b1526; scroll-margin-top: 86px; }
.spotlight-heading {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 70px;
    align-items: end;
    margin-bottom: 36px;
}
.spotlight-heading h2 { max-width: 720px; margin: 10px 0 0; font-size: clamp(30px, 4vw, 48px); line-height: 1.12; }
.spotlight-heading > p { color: #94a3b8; }
.spotlight-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: rgba(255,255,255,.13); }
.spotlight-card {
    display: grid;
    min-height: 300px;
    padding: 28px;
    color: white;
    background: #101d31;
    transition: background .2s ease, transform .2s ease;
}
.spotlight-card:hover { z-index: 1; color: white; background: #172a45; transform: translateY(-4px); }
.spotlight-number { color: #64748b; font: 700 12px/1 monospace; }
.spotlight-icon { margin: 30px 0 18px; font-size: 34px; }
.spotlight-field { color: #67e8f9; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.spotlight-card h3 { margin: 8px 0 24px; font-size: 21px; line-height: 1.3; }
.spotlight-open { align-self: end; color: #cbd5e1; font-size: 13px; font-weight: 700; }
.research-dossier-archive { color: #172033; background: #e9e7e0; scroll-margin-top: 86px; }
.research-dossier-archive .spotlight-heading > p,
.research-dossier-archive .spotlight-heading > div > p { color: #596273; }
.archive-collection-link { color: #1d4ed8; font-size: 13px; font-weight: 800; }
.dossier-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.dossier-card {
    display: flex;
    min-height: 280px;
    padding: 24px;
    flex-direction: column;
    border: 1px solid rgba(15,23,42,.12);
    border-radius: 18px;
    background: rgba(255,255,255,.72);
    transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}
.dossier-card:hover { transform: translateY(-4px); background: white; box-shadow: 0 18px 36px rgba(15,23,42,.1); }
.dossier-index { color: #8a93a2; font: 700 11px/1 monospace; }
.dossier-icon { margin: 28px 0 15px; font-size: 31px; }
.dossier-field { color: #1d4ed8; font-size: 10px; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.dossier-card h3 { margin: 7px 0 20px; font-size: 17px; line-height: 1.35; }
.dossier-open { margin-top: auto; color: #596273; font-size: 12px; font-weight: 800; }
.category-heading {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 16px;
    align-items: start;
    margin-bottom: 28px;
}
.category-icon {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: #dbeafe;
    font-size: 27px;
}
.category-heading h2 { margin-bottom: 8px; }
.category-heading p {
    max-width: 850px;
    margin: 0;
    color: var(--text-muted);
}
.works-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.work-card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 13px;
    align-items: start;
    padding: 20px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: white;
    box-shadow: 0 8px 24px rgba(15,23,42,.05);
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.work-card:hover { transform: translateY(-2px); border-color: #93c5fd; box-shadow: 0 14px 32px rgba(15,23,42,.09); }
.work-icon { font-size: 22px; }
.work-card h3 {
    margin: 0 0 6px;
    font-size: 16px;
    line-height: 1.4;
}
.work-card p {
    margin: 0;
    color: var(--text-muted);
    font-size: 14px;
}
.work-link {
    display: flex;
    gap: 6px;
    align-items: center;
    color: var(--blue);
    font-size: 20px;
    font-weight: 700;
}
.work-link span { font-size: 10px; letter-spacing: .05em; }
.work-link.is-showcase { padding: 5px 8px; border-radius: 999px; background: #dbeafe; color: #1d4ed8; }
.join-card {
    padding: 38px;
    border-radius: 18px;
    color: white;
    background: linear-gradient(135deg, #1d4ed8, #0f172a);
}
.join-card h2 { margin-bottom: 12px; }
.join-card p {
    max-width: 780px;
    color: #dbeafe;
}
.labs-hero {
    padding: 112px 0 92px;
    color: white;
    background:
        linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px),
        radial-gradient(circle at 80% 15%, rgba(34,211,238,.2), transparent 30rem),
        #07111f;
    background-size: 64px 64px, 64px 64px, auto, auto;
}
.labs-hero h1 { max-width: 900px; margin: 14px 0 24px; font-size: clamp(46px, 7.5vw, 88px); line-height: 1; letter-spacing: -2.8px; }
.labs-hero > .container > p:not(.eyebrow) { max-width: 790px; color: #b8c5d8; font-size: 19px; }
.labs-path { display: flex; gap: 13px; align-items: center; flex-wrap: wrap; margin-top: 38px; color: #67e8f9; font-size: 12px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.labs-path i { color: #64748b; font-style: normal; }
.labs-intro { background: #eceae3; }
.labs-intro-grid { display: grid; grid-template-columns: .35fr 1.65fr; gap: 60px; }
.labs-intro-grid h2 { max-width: 820px; font-size: clamp(30px, 4vw, 50px); line-height: 1.12; }
.labs-intro-grid p { max-width: 820px; color: #5d6675; font-size: 17px; }
.section-kicker { margin: 0 0 12px; color: #2563eb; font-size: 11px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.lab-entity { padding: 90px 0; background: #f8fafc; }
.lab-entity-dark { color: white; background: #111c2f; }
.lab-entity-grid { display: grid; grid-template-columns: .42fr 1.58fr; gap: 60px; }
.lab-entity aside { display: flex; min-height: 230px; flex-direction: column; justify-content: space-between; padding-right: 32px; border-right: 1px solid #d8dee8; }
.lab-entity-dark aside { border-color: rgba(255,255,255,.15); }
.lab-number { color: #8b95a5; font: 700 12px/1 monospace; }
.lab-mark { color: #2563eb; font-size: clamp(40px, 6vw, 76px); font-weight: 950; letter-spacing: -.07em; writing-mode: vertical-rl; transform: rotate(180deg); }
.lab-entity-dark .lab-mark { color: #67e8f9; }
.lab-entity-copy { max-width: 850px; }
.lab-entity-copy h2 { margin: 5px 0 10px; font-size: clamp(40px, 5vw, 66px); line-height: 1; letter-spacing: -2px; }
.lab-tagline { margin: 0 0 24px; color: #2563eb; font-size: 19px; font-weight: 800; }
.lab-entity-dark .lab-tagline { color: #67e8f9; }
.lab-entity-copy > p:not(.section-kicker):not(.lab-tagline) { color: #5f6978; font-size: 17px; }
.lab-entity-dark .lab-entity-copy > p:not(.section-kicker):not(.lab-tagline) { color: #b8c5d8; }
.lab-focus { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 28px; }
.lab-focus span { padding: 7px 11px; border: 1px solid #d6dde8; border-radius: 999px; background: white; font-size: 11px; font-weight: 800; }
.lab-entity-dark .lab-focus span { border-color: rgba(255,255,255,.17); background: rgba(255,255,255,.06); }
.lab-entity-link { display: inline-block; margin-top: 28px; color: #2563eb; font-size: 13px; font-weight: 900; }
.lab-entity-dark .lab-entity-link { color: #67e8f9; }
.lab-join-card { padding: 54px; }
.data-systems-entry { background: #edf3f5; }
.data-systems-entry .lab-join-card { border: 1px solid #cbd8df; background: #f8faf9; box-shadow: 0 18px 45px rgba(15, 35, 50, .08); }
.data-systems-links { margin: 24px 0 30px; }
.data-systems-links a { color: #183c4d; text-decoration: none; }
.data-systems-links a:hover { border-color: #2b7482; background: #e5f2f1; }
.entity-hero { padding: 50px 0 90px; color: white; background: #07111f; }
.entity-hero.entity-theme-cyan { background: radial-gradient(circle at 80% 20%, rgba(34,211,238,.26), transparent 28rem), #07111f; }
.entity-hero.entity-theme-blue { background: radial-gradient(circle at 80% 20%, rgba(37,99,235,.34), transparent 30rem), #07111f; }
.entity-hero.entity-theme-orange { background: radial-gradient(circle at 80% 20%, rgba(249,115,22,.28), transparent 28rem), #17100b; }
.entity-hero.entity-theme-violet { background: radial-gradient(circle at 80% 20%, rgba(139,92,246,.3), transparent 28rem), #100d1a; }
.entity-hero.entity-theme-green { background: radial-gradient(circle at 80% 20%, rgba(16,185,129,.28), transparent 28rem), #071511; }
.entity-back { display: inline-block; margin-bottom: 72px; color: #a7b5ca; font-size: 12px; font-weight: 800; }
.entity-title-row { display: flex; justify-content: space-between; gap: 30px; align-items: end; }
.entity-title-row h1 { max-width: 900px; margin: 10px 0 20px; font-size: clamp(54px, 9vw, 110px); line-height: .92; letter-spacing: -4px; }
.entity-title-row > span { color: rgba(255,255,255,.12); font-size: clamp(58px, 10vw, 130px); font-weight: 950; letter-spacing: -.08em; }
.entity-hero > .container > p:not(.eyebrow) { max-width: 800px; margin: 0; color: #c2cede; font-size: 20px; }
.entity-mock-note { margin-top: 24px !important; color: #7f91a8 !important; font-size: 11px !important; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.entity-metrics { color: white; background: #111c2f; }
.entity-metrics .container { display: grid; grid-template-columns: repeat(4, 1fr); }
.entity-metrics .container > div { min-height: 145px; padding: 28px; border-right: 1px solid rgba(255,255,255,.1); }
.entity-metrics .container > div:first-child { border-left: 1px solid rgba(255,255,255,.1); }
.entity-metrics strong { display: block; color: #67e8f9; font-size: 34px; line-height: 1; }
.entity-metrics span { display: block; margin-top: 10px; color: #aebbd0; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.entity-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: start; }
.entity-two-col h2 { font-size: clamp(30px, 4vw, 48px); line-height: 1.12; }
.entity-lead { color: #263548; font-size: 20px; font-weight: 700; }
.entity-overview .entity-two-col > div:last-child > p:last-child { color: #637083; }
.entity-focus-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 28px; }
.entity-focus-grid article { min-height: 160px; padding: 22px; border: 1px solid #dce2eb; border-radius: 18px; background: white; }
.entity-focus-grid span { color: #2563eb; font: 700 11px/1 monospace; }
.entity-focus-grid h3 { margin: 44px 0 0; font-size: 17px; }
.entity-list { margin-top: 22px; border-top: 1px solid #dce2eb; }
.entity-list p { margin: 0; padding: 14px 0; border-bottom: 1px solid #dce2eb; color: #4e5b6d; }
.entity-programs { color: white; background: #0c1728; }
.entity-programs .section-kicker { color: #67e8f9; }
.entity-program-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 28px; background: rgba(255,255,255,.13); }
.entity-program-grid article { min-height: 330px; padding: 28px; background: #111f34; }
.entity-program-grid article > span { color: #718098; font: 700 10px/1 monospace; }
.entity-program-grid h3 { margin: 70px 0 14px; font-size: 22px; }
.entity-program-grid p { color: #aebbd0; }
.entity-program-grid b { display: block; margin-top: 24px; color: #67e8f9; font-size: 11px; }
.entity-initiative-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 28px; }
.entity-initiative-grid article { display: flex; min-height: 310px; padding: 26px; flex-direction: column; border: 1px solid #dce2eb; border-radius: 20px; background: white; }
.entity-initiative-grid span { color: #2563eb; font-size: 10px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.entity-initiative-grid h3 { margin: 54px 0 12px; font-size: 21px; }
.entity-initiative-grid p { color: #657184; }
.entity-initiative-grid a { margin-top: auto; color: #2563eb; font-size: 12px; font-weight: 800; }
.entity-operating-model { color: white; background: #111c2f; }
.entity-operating-model h2 { color: white; }
.entity-operating-model .section-kicker { color: #67e8f9; }
.entity-role-cloud { display: flex; gap: 8px; flex-wrap: wrap; }
.entity-role-cloud span { padding: 8px 12px; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; background: rgba(255,255,255,.06); color: #d4ddeb; font-size: 12px; }
.entity-timeline { border-left: 1px solid rgba(255,255,255,.16); }
.entity-timeline > div { position: relative; padding: 0 0 25px 28px; }
.entity-timeline > div::before { content: ""; position: absolute; top: 6px; left: -4px; width: 7px; height: 7px; border-radius: 99px; background: #67e8f9; }
.entity-timeline strong { color: #67e8f9; font-size: 12px; }
.entity-timeline p { margin: 5px 0 0; color: #aebbd0; }
.entity-faq details { border-bottom: 1px solid #dce2eb; }
.entity-faq summary { padding: 16px 0; cursor: pointer; font-weight: 800; }
.entity-faq details p { padding: 0 0 16px; color: #637083; }
.simple-page { min-height: 58vh; }
.simple-page .feature-card { min-height: 0; }
.teaching-lab-heading{align-items:flex-end;margin-bottom:28px}.teaching-lab-heading>div{max-width:920px}.teaching-lab-heading h2,.teaching-other-heading h2{margin-bottom:12px}.teaching-lab-heading p:last-child{max-width:850px;margin:0;color:var(--text-muted);font-size:17px}.teaching-data-labs{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:72px}.teaching-data-labs .feature-card{min-height:245px;border-top:4px solid #0f766e}.teaching-data-labs .feature-card h3{margin-top:18px}.teaching-other-heading{padding-top:52px;border-top:1px solid var(--border)}
.learning-map{display:flex;align-items:stretch;margin:0 0 78px;border:1px solid #bec9cd;background:#e8eeed;overflow:auto}.learning-map div{min-width:160px;flex:1;padding:20px;font-weight:800}.learning-map span{display:block;margin-bottom:5px;color:#0f766e;font:800 11px ui-monospace,monospace}.learning-map i{align-self:center;color:#0f766e;font-style:normal}.teaching-path{margin:0 0 104px}.teaching-path>header{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(260px,.6fr);column-gap:68px;align-items:end;margin-bottom:34px;padding-bottom:25px;border-bottom:1px solid #aebbc0}.teaching-path>header .eyebrow{grid-column:1/-1}.teaching-path>header h2{margin:0;font-size:clamp(31px,4vw,47px);line-height:1.13}.teaching-path>header>p:last-child{margin:0;color:var(--text-muted)}.teaching-sequence{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid #c4cdd1}.sequence-card{display:grid;grid-template-columns:58px 1fr;gap:18px;min-height:225px;padding:27px;border:solid #c4cdd1;border-width:0 1px 1px 0;background:#f8faf9;transition:.18s}.sequence-card:nth-child(even){border-right-width:0}.sequence-card:hover{position:relative;z-index:1;background:white;box-shadow:0 14px 34px rgba(15,23,42,.1);transform:translateY(-2px)}.sequence-number{color:#0f766e;font:800 13px ui-monospace,monospace}.sequence-card small{color:#687a83;font:800 10px ui-monospace,monospace;letter-spacing:.08em}.sequence-card h3{margin:8px 0 10px;font-size:23px;line-height:1.25}.sequence-card p{margin:0 0 18px;color:var(--text-muted);font-size:14px}.sequence-card b{color:#0f766e;font-size:13px}
@media(max-width:900px){.teaching-data-labs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:780px){.teaching-path>header{grid-template-columns:1fr;gap:15px}.teaching-sequence{grid-template-columns:1fr}.sequence-card,.sequence-card:nth-child(even){border-right-width:0}}
@media(max-width:640px){.teaching-data-labs{grid-template-columns:1fr;margin-bottom:54px}.teaching-data-labs .feature-card{min-height:0}.learning-map{flex-direction:column}.learning-map i{text-align:center;transform:rotate(90deg)}.sequence-card{grid-template-columns:40px 1fr;padding:21px}}

.hero {
    background:
        radial-gradient(circle at 20% 20%, rgba(37,99,235,0.25), transparent 30%),
        linear-gradient(135deg, var(--bg-deep), var(--bg-dark));
    color: white;
}

.hero-grid {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    min-height: 620px;
    align-items: center;
    gap: 56px;
}

.eyebrow {
    color: var(--amber);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
}

.hero h1 {
    font-size: clamp(44px, 6vw, 72px);
    line-height: 1.05;
    margin: 16px 0 24px;
    letter-spacing: -2px;
}

.hero-subtitle {
    color: #cbd5e1;
    max-width: 560px;
    font-size: 20px;
}

.hero-actions {
    display: flex;
    gap: 16px;
    margin-top: 32px;
}

.btn {
    padding: 13px 22px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 15px;
}

.btn-primary {
    background: var(--blue);
    color: white;
}

.btn-primary:hover {
    background: var(--blue-dark);
}

.btn-outline {
    border: 1px solid rgba(255,255,255,0.35);
    color: white;
}

.focus-list {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 18px;
    margin-top: 48px;
    color: #dbeafe;
    font-size: 13px;
}

.hero-image {
    position: relative;
}

.hero-image img {
    width: 100%;
    display: block;
    border-radius: 0 0 0 28px;
    box-shadow: 0 24px 70px rgba(0,0,0,0.35);
}

.quote-card {
    position: absolute;
    right: 28px;
    bottom: 28px;
    width: 330px;
    padding: 24px;
    background: rgba(15,23,42,0.88);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 12px;
    color: white;
    font-weight: 700;
}

.section {
    padding: 72px 0;
}

.section.soft {
    background: #f1f5f9;
}

.section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 28px;
}

.section-header h2,
.section h2 {
    font-size: 30px;
    margin: 0 0 24px;
    letter-spacing: -0.6px;
}

.section-header a {
    color: var(--blue);
    font-weight: 700;
}

.card-grid {
    display: grid;
    gap: 24px;
}

.card-grid.four {
    grid-template-columns: repeat(4, 1fr);
}

.card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 26px;
    box-shadow: var(--shadow);
}

.card h3 {
    margin: 14px 0 10px;
    font-size: 20px;
    line-height: 1.35;
}

.card p {
    color: var(--text-muted);
    font-size: 15px;
}

.card a {
    color: var(--blue);
    font-weight: 700;
    font-size: 14px;
}

.tag {
    display: inline-block;
    padding: 4px 9px;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 12px;
    font-weight: 700;
}

.feature-card {
    background: white;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 30px;
    min-height: 210px;
    box-shadow: var(--shadow);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.feature-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(15, 23, 42, 0.12);
}

.feature-card h3 {
    margin-top: 0;
    font-size: 22px;
}

.feature-card p {
    color: var(--text-muted);
}

.collaboration-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.collaboration-cards .feature-card {
    display: flex;
    min-height: 360px;
    flex-direction: column;
}

.collaboration-cards .feature-card h3 {
    margin-top: 18px;
    font-size: clamp(25px, 3vw, 34px);
    line-height: 1.18;
}

.collaboration-cards .feature-card b {
    margin-top: auto;
    padding-top: 22px;
    color: var(--blue);
}

/* Collaboration profile — Supatcha Lertampaiporn */
.collaborator-feature{padding:92px 0;color:#eaf2f3;background:#0b1c29}
.collaborator-feature-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:72px;align-items:center}
.collaborator-visual{display:grid;grid-template-columns:1.2fr .8fr;grid-template-rows:180px 180px;gap:10px}
.collaborator-visual img{width:100%;height:100%;object-fit:cover;border-radius:3px;filter:saturate(.82)}
.collaborator-visual img:first-child{grid-row:1/3}
.collaborator-copy h2{margin:8px 0 18px;color:white;font-size:clamp(38px,5vw,61px);letter-spacing:-.04em}
.collaborator-copy>p{max-width:700px;color:#b9c8ce;font-size:16px;line-height:1.85}
.collaborator-copy .collaborator-lead{color:#e7f1ef;font:italic 22px/1.55 Georgia,serif}
.collaborator-actions{display:flex;align-items:center;gap:24px;margin-top:28px}.collaborator-actions>a:not(.button){color:#74ddd1;font-weight:700}
.supatcha-profile-hero{padding:106px 0 92px;color:white;background:radial-gradient(circle at 82% 20%,rgba(242,138,200,.16),transparent 28rem),#091722}
.supatcha-profile-hero-grid{display:grid;grid-template-columns:1fr .72fr;gap:90px;align-items:end}
.supatcha-profile-hero h1{margin:14px 0 22px;font-size:clamp(52px,7vw,90px);line-height:.95;letter-spacing:-.055em}
.supatcha-profile-role{max-width:710px;color:#b9c9cf;font-size:17px}.supatcha-profile-hero blockquote{margin:0;padding:28px 0 4px 28px;border-left:3px solid #f28ac8;color:#dae6e8;font:italic 23px/1.58 Georgia,serif}
.supatcha-profile-body{padding:100px 0;background:#e6e9e6}.supatcha-profile-layout{display:grid;grid-template-columns:minmax(0,760px) 320px;gap:84px;align-items:start}
.supatcha-profile-story h2{margin:0 0 22px;color:#102936;font-size:clamp(31px,4vw,48px);line-height:1.16;letter-spacing:-.035em}.supatcha-profile-story>p:not(.story-kicker){color:#40535b;font-size:17px;line-height:1.93}.supatcha-profile-story .story-kicker:not(:first-child){margin-top:72px!important}
.supatcha-method-grid{display:grid;grid-template-columns:1fr 1fr;margin:38px 0 0;border:1px solid #bcc6c5}.supatcha-method-grid section{padding:25px;border:1px solid #c5cdcb;background:#f1f2ee}.supatcha-method-grid span{color:#b42f75;font:700 11px ui-monospace,monospace}.supatcha-method-grid h3{margin:24px 0 9px;color:#18323d}.supatcha-method-grid p{margin:0;color:#607078;font-size:14px;line-height:1.75}
.supatcha-profile-rail{position:sticky;top:110px;padding:28px;border:1px solid #bdc7c6;background:#f2f3ef}.supatcha-profile-rail>p{color:#a92d70;font:700 10px ui-monospace,monospace;letter-spacing:.12em}.supatcha-profile-rail ol{margin:0 0 28px;padding:0;list-style:none}.supatcha-profile-rail li{padding:18px 0;border-top:1px solid #cbd2d0}.supatcha-profile-rail time,.supatcha-profile-rail strong,.supatcha-profile-rail span{display:block}.supatcha-profile-rail time{color:#7b878c;font:10px ui-monospace,monospace}.supatcha-profile-rail strong{margin:6px 0;color:#17313c}.supatcha-profile-rail span{color:#6a797f;font-size:12px;line-height:1.55}.profile-back-link{display:block;margin-top:18px;color:#5c6c73;font-size:13px}
.supatcha-selected-work{padding:92px 0 110px;background:#d0d8d6}.supatcha-work-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.supatcha-work-grid a{display:grid;grid-template-rows:240px auto auto;gap:12px;padding:12px 12px 25px;color:#16303b;border:1px solid #b4c0be;background:#edf0ec;transition:.2s}.supatcha-work-grid a:hover{transform:translateY(-4px);box-shadow:0 16px 30px rgba(12,30,40,.1)}.supatcha-work-grid img{width:100%;height:100%;object-fit:cover}.supatcha-work-grid span{padding:0 10px;color:#a92d70;font:700 10px ui-monospace,monospace}.supatcha-work-grid strong{padding:0 10px;font-size:17px;line-height:1.55}
@media(max-width:900px){.collaborator-feature-grid,.supatcha-profile-hero-grid,.supatcha-profile-layout{grid-template-columns:1fr;gap:44px}.supatcha-profile-rail{position:static}.supatcha-work-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.collaborator-feature{padding:64px 0}.collaborator-visual{grid-template-rows:130px 130px}.collaborator-actions{align-items:flex-start;flex-direction:column}.supatcha-profile-hero{padding:70px 0 64px}.supatcha-profile-hero h1{font-size:48px}.supatcha-profile-hero blockquote{font-size:20px}.supatcha-profile-body{padding:68px 0}.supatcha-method-grid,.supatcha-work-grid{grid-template-columns:1fr}.supatcha-selected-work{padding:66px 0 80px}.supatcha-work-grid a{grid-template-rows:190px auto auto}}

.site-footer {
    background: var(--bg-deep);
    color: #cbd5e1;
    padding: 56px 0 24px;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
    gap: 48px;
}

.site-footer h3 {
    color: white;
    font-size: 16px;
}

.site-footer a {
    display: block;
    margin: 8px 0;
    color: #cbd5e1;
}

.site-footer a:hover {
    color: white;
}

.footer-bottom {
    margin-top: 42px;
    padding-top: 24px;
    border-top: 1px solid rgba(255,255,255,0.08);
    font-size: 13px;
    color: #94a3b8;
}
.name-credential{display:inline-block;margin-left:.14em;color:#67e8f9;font-size:.32em;font-weight:650;letter-spacing:.01em;vertical-align:.3em;white-space:nowrap}

/* About — professional identity and working philosophy */
.about-hero { padding:100px 0 82px;color:white;background:radial-gradient(circle at 80% 16%,rgba(37,99,235,.24),transparent 26%),#07111f; }
.about-hero-grid { display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.55fr);gap:78px;align-items:center; }
.about-hero-content h1 { margin:12px 0 22px;font-size:clamp(48px,7vw,82px);line-height:.98;letter-spacing:-.05em; }
.about-lead { max-width:710px;margin:0;color:#bcc9d8;font-size:20px;line-height:1.75; }
.about-hero-image { overflow:hidden;width:100%;max-width:410px;aspect-ratio:4/5;margin:0;border:1px solid rgba(255,255,255,.16);border-radius:24px;background:#eeeae2;box-shadow:0 30px 70px rgba(0,0,0,.32); }
.about-hero-image img { display:block;width:100%;height:100%;object-fit:cover;object-position:50% 19%; }
.about-essay { padding:88px 0 120px;background:#edf1f2; }
.essay-container { width:min(820px,calc(100% - 48px));margin:0 auto; }
.essay-block { position:relative;padding:0 0 72px;margin:0 0 72px;border-bottom:1px solid #cbd5da; }
.essay-block:last-child { padding-bottom:0;margin-bottom:0;border-bottom:0; }
.chapter-label { margin:0 0 12px;color:#0b8589;font:700 12px/1.4 monospace;letter-spacing:.13em;text-transform:uppercase; }
.essay-block h2 { margin:0 0 10px;color:#102c44;font-size:clamp(38px,5vw,57px);line-height:1.05;letter-spacing:-.04em; }
.chapter-subtitle { margin:0 0 31px!important;color:#466779!important;font-size:18px!important;font-style:italic; }
.essay-block>p:not(.chapter-label):not(.chapter-subtitle) { margin:0 0 22px;color:#344d5e;font-size:18px;line-height:2; }
.essay-block>p:last-child { margin-bottom:0!important; }

/* About editorial treatment — original long-form voice, stronger visual rhythm */
.about-hero { position:relative;overflow:hidden; }
.about-hero::before { content:"";position:absolute;inset:0;opacity:.12;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.14) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(90deg,#000,transparent 78%); }
.about-hero::after { content:"CURIOSITY  /  UNDERSTANDING  /  CREATION";position:absolute;right:-45px;bottom:72px;color:rgba(255,255,255,.12);font:700 11px/1 monospace;letter-spacing:.24em;transform:rotate(-90deg);transform-origin:center; }
.about-hero-grid { position:relative;z-index:1; }
.about-hero-content .eyebrow { display:inline-flex;padding:7px 11px;border:1px solid rgba(103,232,249,.35);border-radius:999px;color:#67e8f9;background:rgba(8,145,178,.08); }
.about-hero-content h1 { text-wrap:balance; }
.about-hero-image { position:relative;transform:rotate(1.2deg); }
.about-hero-image::after { content:"";position:absolute;inset:14px;border:1px solid rgba(255,255,255,.32);border-radius:15px;pointer-events:none; }
.about-essay { position:relative;overflow:hidden;background:radial-gradient(circle at 8% 5%,rgba(14,165,164,.11),transparent 24%),radial-gradient(circle at 94% 62%,rgba(37,99,235,.08),transparent 26%),#e8edef; }
.about-essay::before { content:"";position:absolute;left:calc(50% - 410px - 72px);top:0;bottom:0;width:1px;background:linear-gradient(transparent,#9fb3bc 8%,#9fb3bc 92%,transparent); }
.essay-container { counter-reset:about-chapter;position:relative; }
.essay-block { counter-increment:about-chapter;padding:48px 52px 52px;margin-bottom:42px;border:1px solid #c7d2d8;border-radius:24px;background:linear-gradient(145deg,rgba(250,251,249,.98),rgba(238,242,241,.98));box-shadow:0 20px 52px rgba(15,23,42,.085);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease; }
.essay-block::before { content:counter(about-chapter,decimal-leading-zero);position:absolute;left:-82px;top:48px;display:grid;width:48px;height:48px;place-items:center;border:1px solid #91adb4;border-radius:50%;color:#087f82;background:#e8edef;font:700 12px/1 monospace;box-shadow:0 0 0 9px #e8edef; }
.essay-block:nth-child(even) { transform:translateX(18px); }
.essay-block:hover { transform:translateY(-3px);border-color:#99adb5;box-shadow:0 27px 65px rgba(15,23,42,.12); }
.essay-block:nth-child(even):hover { transform:translate(18px,-3px); }
.essay-block:first-child { color:white;border-color:rgba(255,255,255,.12);background:radial-gradient(circle at 88% 15%,rgba(34,211,238,.14),transparent 25%),#0a1929;box-shadow:0 25px 62px rgba(7,17,31,.22); }
.essay-block:first-child h2 { color:white; }
.essay-block:first-child>p:not(.chapter-label):not(.chapter-subtitle) { color:#c1ceda; }
.essay-block:first-child::before { color:#67e8f9;background:#0a1929;border-color:#3e6570; }
.chapter-label { display:inline-flex;padding:6px 10px;border:1px solid #9fc1c3;border-radius:999px;background:#dcebec; }
.essay-block:first-child .chapter-label { border-color:rgba(103,232,249,.35);color:#67e8f9;background:rgba(14,165,164,.1); }
.chapter-subtitle { position:relative;padding:18px 22px 18px 25px;border-left:3px solid #0f999b;background:rgba(15,153,155,.07); }
.chapter-subtitle::before { content:"“";position:absolute;left:7px;top:2px;color:rgba(15,153,155,.35);font-size:30px;font-style:normal; }
.essay-block>p:not(.chapter-label):not(.chapter-subtitle)::first-letter { color:#153c54;font-size:1.08em;font-weight:600; }
.essay-block:first-child>p:not(.chapter-label):not(.chapter-subtitle)::first-letter { color:#d9f5f3; }
.about-brand-hero { padding: 104px 0 90px; color: white; background: radial-gradient(circle at 76% 12%,rgba(34,211,238,.16),transparent 25%),radial-gradient(circle at 8% 90%,rgba(37,99,235,.28),transparent 32%),#07111f; }
.about-brand-grid { display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr);gap:76px;align-items:center; }
.about-brand-copy h1 { max-width:830px;margin:14px 0 26px;font-size:clamp(45px,6.2vw,78px);line-height:1.02;letter-spacing:-.045em; }
.about-brand-lead { max-width:780px;margin:0;color:#c5d1df;font-size:19px;line-height:1.85; }
.about-brand-portrait { margin:0;overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:24px;background:#0e1b2c;box-shadow:0 30px 70px rgba(0,0,0,.32); }
.about-brand-portrait img { display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center top; }
.about-brand-portrait figcaption { display:grid;gap:3px;padding:20px 22px; }.about-brand-portrait figcaption strong{color:white}.about-brand-portrait figcaption span{color:#91a5ba;font-size:13px}
.about-identity-strip { border-bottom:1px solid #d7dee6;background:#e8edf1; }.about-identity-strip .container{display:flex;justify-content:center;gap:22px;padding:22px 0;color:#16324a;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.about-identity-strip i{color:#0ea5a4;font-style:normal}
.about-section-heading { display:grid;grid-template-columns:minmax(0,1.05fr) minmax(280px,.75fr);gap:70px;align-items:end;margin-bottom:42px; }
.about-section-heading h2,.about-bridge-grid h2,.about-students-grid h2 { margin:10px 0 0;font-size:clamp(36px,4.8vw,59px);line-height:1.08;letter-spacing:-.04em; }
.about-section-heading>p { margin:0;color:#566b7e;font-size:17px; }
.about-focus-section { background:#eef2f4; }.about-focus-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.about-focus-grid article{min-height:285px;padding:30px;border:1px solid #ccd6df;border-radius:20px;background:linear-gradient(145deg,#fbfcfc,#e9eef1);box-shadow:0 16px 38px rgba(15,23,42,.07)}.about-focus-grid article>span{color:#0f8c91;font:700 12px/1.4 monospace}.about-focus-grid h3{max-width:360px;margin:64px 0 13px;color:#102d45;font-size:27px;line-height:1.2}.about-focus-grid p{margin:0;color:#5b6d7c}
.about-bridge-section { color:white;background:#07111f; }.about-bridge-grid,.about-students-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:80px;align-items:start}.about-bridge-copy{padding-left:36px;border-left:1px solid rgba(255,255,255,.18)}.about-bridge-copy p{margin:0 0 24px;color:#b7c5d5;font-size:18px;line-height:1.9}
.about-principles-section { background:#e1e7e9; }.about-principles-list{border-top:1px solid #b8c6ce}.about-principles-list article{display:grid;grid-template-columns:55px minmax(220px,.65fr) minmax(0,1.35fr);gap:28px;padding:27px 4px;border-bottom:1px solid #c2ced4;align-items:start}.about-principles-list article>span{color:#0f8c91;font:700 12px/1.8 monospace}.about-principles-list h3{margin:0;color:#102d45;font-size:22px}.about-principles-list p{margin:0;color:#526879}
.about-students-section { background:#f4f6f6; }.about-students-grid>div:last-child{padding:30px;border:1px solid #c9d4d9;border-radius:20px;background:#e7eeed}.about-students-grid>div:last-child p{margin-top:0;color:#4e6574;font-size:17px}.about-students-grid .text-link{display:inline-block;margin-top:15px;color:#087f82;font-weight:700}
.about-paths-section { background:#dce4e6; }.about-paths-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.about-paths-grid a{display:grid;grid-template-columns:1fr auto;gap:8px 25px;min-height:170px;padding:27px;border:1px solid #bccad1;border-radius:18px;background:#f2f5f4;transition:.2s ease}.about-paths-grid a:hover{transform:translateY(-3px);border-color:#7f9ba5;box-shadow:0 17px 38px rgba(15,23,42,.1)}.about-paths-grid span{color:#102d45;font-size:22px;font-weight:700}.about-paths-grid p{grid-column:1;margin:0;color:#5a6f7d}.about-paths-grid b{grid-column:2;grid-row:1/3;align-self:center;color:#0f8c91;font-size:22px}

/* Research project portfolio */
.project-hero{padding:88px 0 82px;color:white;background:radial-gradient(circle at 80% 10%,rgba(45,212,191,.12),transparent 28%),#071321}.project-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:80px;align-items:end}.project-hero h1{max-width:760px;margin:0;font-size:clamp(46px,6vw,72px);line-height:1.08;letter-spacing:-.04em}.project-hero-grid>p{margin:0;color:#bbc8d4;font-size:18px}.project-principles{border-bottom:1px solid #cad1d6;background:#e8ecee}.project-principles-grid{display:grid;grid-template-columns:repeat(3,1fr)}.project-principles-grid>div{min-height:190px;padding:30px;border:1px solid #cad1d6;border-block-width:0 1px}.project-principles span,.project-number{display:block;color:#66747d;font:12px ui-monospace,monospace}.project-principles strong{display:block;margin-top:34px;font-size:18px}.project-principles p{margin-bottom:0;color:#5f6d76;font-size:14px}.project-index{padding-block:100px;background:#f0f2f2}.project-section-head{display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:end;margin-bottom:48px}.project-section-head h2{margin:0;font-size:clamp(34px,4vw,50px);line-height:1.15}.project-section-head>p{margin:0;color:#60707a}.research-project-list{border-top:1px solid #adb7bd}.research-project-row{display:grid;grid-template-columns:70px 1fr 160px;gap:24px;align-items:center;min-height:190px;padding:28px 16px;border-bottom:1px solid #c7cfd3;transition:.18s}.research-project-row:hover{padding-inline:26px;background:rgba(255,255,255,.7)}.project-copy>*{display:block}.project-kicker{margin-bottom:10px;color:#69777e;font:11px ui-monospace,monospace;letter-spacing:.08em}.project-copy strong{max-width:780px;font-size:25px;line-height:1.3}.project-copy small{max-width:780px;margin-top:9px;color:#66737a;font-size:14px}.project-status{justify-self:end;padding:7px 10px;border:1px solid #aeb8bd;border-radius:999px;color:#52616a;font-size:11px;white-space:nowrap}.project-invitation{padding:84px 0;color:white;background:#0c1b2a}.project-invitation-grid{display:grid;grid-template-columns:1fr .8fr;gap:80px;align-items:end}.project-invitation h2{margin:0;font-size:clamp(34px,4vw,50px);line-height:1.18}.project-invitation-grid>p{margin:0;color:#bac6d1}
.project-detail-hero{padding:72px 0 70px;color:white;background:#071321}.project-theme-automotive{background:radial-gradient(circle at 82% 22%,rgba(56,189,248,.18),transparent 29%),#071321}.project-theme-health{background:radial-gradient(circle at 82% 22%,rgba(244,114,182,.14),transparent 29%),#111526}.project-theme-proximity{background:radial-gradient(circle at 82% 22%,rgba(45,212,191,.15),transparent 29%),#071b1d}.project-breadcrumb{margin-bottom:38px;color:#8fa0ad;font:12px ui-monospace,monospace}.project-breadcrumb a{color:#91d8d0}.project-detail-hero h1{max-width:1000px;margin:0;font-size:clamp(46px,6vw,72px);line-height:1.08;letter-spacing:-.04em}.project-lead{max-width:860px;margin:25px 0 0;color:#c4cfd8;font-size:19px}.project-status-line{display:inline-block;margin-top:30px;padding:8px 12px;border:1px solid rgba(255,255,255,.22);border-radius:999px;color:#d6e0e7;font:11px ui-monospace,monospace}.project-local-nav{position:sticky;top:72px;z-index:70;border-bottom:1px solid #cbd1d4;background:rgba(240,242,242,.96);backdrop-filter:blur(10px)}.project-local-nav .container{display:flex;gap:26px;overflow-x:auto}.project-local-nav a{flex:0 0 auto;padding:16px 0 13px;border-bottom:3px solid transparent;color:#5c6971;font-size:12px;font-weight:700}.project-local-nav a:hover{border-color:#0f766e;color:#172731}.project-detail-body{padding:88px 0 110px;background:#f0f2f2}.project-reading-grid{display:grid;grid-template-columns:210px minmax(0,790px);gap:76px;justify-content:center;align-items:start}.project-reading-grid>aside{position:sticky;top:154px;color:#69777e;font-size:12px}.project-reading-grid>aside span{display:block;color:#0f766e;font:12px ui-monospace,monospace}.project-reading-grid>aside strong{display:block;margin-top:12px;color:#26353e;font-size:15px}.project-reading-grid article h2{margin:72px 0 20px;font-size:clamp(32px,4vw,44px);line-height:1.2;letter-spacing:-.025em}.project-reading-grid article h2:first-child{margin-top:0}.project-reading-grid article>p,.article-lead{color:#3e4b53;font-size:18px}.research-question{margin:38px 0;padding:26px 28px;border-left:4px solid #0f766e;background:#e2e8e8}.research-question span{color:#0f766e;font:11px ui-monospace,monospace;letter-spacing:.08em}.research-question p{margin:8px 0 0;font-size:19px}.project-pipeline{margin:34px 0;padding:0;list-style:none;border-top:1px solid #b8c1c5}.project-pipeline li{display:grid;grid-template-columns:54px 1fr;gap:20px;padding:18px 8px;border-bottom:1px solid #c6ced2}.project-pipeline span{color:#0f766e;font:12px ui-monospace,monospace}.project-pipeline p{margin:0}.project-work-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;padding:1px;background:#bdc6ca}.project-work-grid>div{min-height:210px;padding:26px;background:#f8f9f7}.project-work-grid h3{margin:0 0 22px;font-size:19px}.project-work-grid p{margin:0;color:#5b6971;font-size:14px}.responsibility-note{margin:30px 0;padding:28px;border:1px solid #c6b9bd;background:#eee6e7}.responsibility-note p{margin:0;color:#594a50}.project-cta{margin-top:50px;padding:30px;display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;color:white;background:#0c1b2a}.project-cta strong{font-size:20px}.project-cta p{margin:7px 0 0;color:#b9c6d0;font-size:14px}.project-cta>a{padding:11px 15px;border:1px solid #5eead4;color:#8ce9dd;font-weight:700}.project-more{padding:74px 0;background:#e5e9ea}.project-more-links{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;padding:1px;background:#b9c2c6}.project-more-links a{min-height:145px;padding:26px;background:#f5f6f4}.project-more-links span{display:block;color:#64737b;font:11px ui-monospace,monospace}.project-more-links strong{display:block;margin-top:28px;font-size:18px}

.research-project-row{position:relative;overflow:hidden}.research-project-row::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:#64748b;transform:scaleY(0);transition:.2s ease}.research-project-row:hover::before{transform:scaleY(1)}.project-automotive::before{background:#0284c7}.project-health::before{background:#be185d}.project-proximity::before{background:#0f766e}.project-philosophy{margin:42px 0;padding:30px;color:white;background:radial-gradient(circle at 90% 0,rgba(45,212,191,.13),transparent 30%),#0b1b29}.project-philosophy span{color:#75d8cc;font:11px ui-monospace,monospace;letter-spacing:.09em}.project-philosophy p{max-width:700px;margin:16px 0 0;color:#d1dbe2;font-size:19px;line-height:1.8}.project-evidence-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;margin:32px 0;padding:1px;background:#b9c2c6}.project-evidence-grid>div{padding:28px;background:#f8f9f7}.project-evidence-grid h3{margin:0 0 21px;color:#1c333e;font-size:18px}.project-evidence-grid ul{margin:0;padding-left:19px}.project-evidence-grid li{margin:11px 0;color:#586870;font-size:14px}.translation-path{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin:35px 0;padding:1px;background:#b8c2c6}.translation-path>div{min-height:145px;padding:22px;background:#e4e9e9}.translation-path span{display:block;color:#0f766e;font:11px ui-monospace,monospace}.translation-path strong{display:block;margin-top:35px;color:#2b3c45;font-size:14px;line-height:1.45}

@media (max-width: 1000px) {
    .nav-toggle { display: block; }
    .main-nav {
        display: none;
        position: absolute;
        top: 72px;
        left: 0;
        right: 0;
        max-height: calc(100vh - 72px);
        overflow-y: auto;
        padding: 18px 24px 28px;
        background: #020817;
        border-top: 1px solid rgba(255,255,255,.1);
    }
    .main-nav.is-open { display: block; }
    .main-nav > a,
    .nav-group-toggle {
        display: block;
        width: 100%;
        padding: 11px 0;
        text-align: left;
    }
    .nav-group { width: 100%; }
    .submenu,
    .submenu-wide {
        position: static;
        display: none;
        width: auto;
        padding: 0 0 8px 14px;
        border: 0;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
    }
    .nav-group.is-open .submenu { display: block; }

    .hero-grid {
        grid-template-columns: 1fr;
        padding: 72px 0;
    }

    .card-grid.four {
        grid-template-columns: repeat(2, 1fr);
    }

    .footer-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .focus-list {
        grid-template-columns: repeat(2, 1fr);
    }
    .works-list { grid-template-columns: 1fr; }
    .lab-hero-grid { grid-template-columns: 1fr; gap: 40px; }
    .lab-manifesto { max-width: 520px; }
    .spotlight-grid { grid-template-columns: repeat(2, 1fr); }
    .dossier-grid { grid-template-columns: repeat(2, 1fr); }
    .labs-intro-grid,
    .lab-entity-grid,
    .entity-two-col { grid-template-columns: 1fr; gap: 32px; }
    .lab-entity aside { min-height: auto; padding: 0 0 20px; border-right: 0; border-bottom: 1px solid #d8dee8; }
    .lab-mark { writing-mode: horizontal-tb; transform: none; }
    .about-brand-grid { grid-template-columns:1fr;gap:42px; }
    .about-hero-grid { grid-template-columns:1fr;gap:42px; }
    .about-hero-image { max-width:430px; }
    .about-brand-portrait { max-width:430px; }
    .about-section-heading,.about-bridge-grid,.about-students-grid { grid-template-columns:1fr;gap:28px; }
    .about-bridge-copy { padding:26px 0 0;border-left:0;border-top:1px solid rgba(255,255,255,.18); }
    .about-essay::before { display:none; }
    .essay-block::before { left:auto;right:28px;top:28px;width:42px;height:42px;box-shadow:none; }
    .essay-block:nth-child(even),.essay-block:nth-child(even):hover { transform:none; }
    .project-hero-grid,.project-section-head,.project-invitation-grid{grid-template-columns:1fr;gap:30px}
    .project-principles-grid{grid-template-columns:1fr}.project-principles-grid>div{min-height:150px}
    .project-reading-grid{grid-template-columns:1fr;gap:30px}.project-reading-grid>aside{position:static}
}

@media (max-width: 640px) {
    .container {
        width: min(100% - 28px, var(--container));
    }

    .card-grid.four {
        grid-template-columns: 1fr;
    }

    .footer-grid {
        grid-template-columns: 1fr;
    }

    .hero-actions {
        flex-direction: column;
    }

    .quote-card {
        position: static;
        width: auto;
        margin-top: 16px;
    }
    .lab-hero { padding: 78px 0 64px; }
    .lab-hero-actions { align-items: flex-start; flex-direction: column; }
    .spotlight-heading { grid-template-columns: 1fr; gap: 12px; }
    .spotlight-grid { grid-template-columns: 1fr; }
    .spotlight-card { min-height: 250px; }
    .dossier-grid { grid-template-columns: 1fr; }
    .dossier-card { min-height: 240px; }
    .labs-hero { padding: 76px 0 60px; }
    .lab-entity { padding: 64px 0; }
    .lab-join-card { padding: 34px; }
    .entity-title-row > span { display: none; }
    .entity-back { margin-bottom: 50px; }
    .entity-focus-grid { grid-template-columns: 1fr; }
    .entity-metrics .container,
    .entity-program-grid,
    .entity-initiative-grid { grid-template-columns: 1fr; }
    .entity-metrics .container > div { min-height: auto; border-bottom: 1px solid rgba(255,255,255,.1); }
    .entity-program-grid article { min-height: 270px; }
    .about-brand-hero { padding:72px 0 58px; }
    .about-hero { padding:72px 0 58px; }
    .about-hero-content h1 { font-size:clamp(44px,14vw,60px); }
    .about-lead { font-size:17px; }
    .about-essay { padding:62px 0 82px; }
    .essay-container { width:min(100% - 28px,820px); }
    .essay-block { padding-bottom:50px;margin-bottom:50px; }
    .essay-block { padding:31px 24px 34px;border-radius:18px; }
    .essay-block::before { position:static;float:right;margin:0 0 12px 14px;width:38px;height:38px; }
    .about-hero::after { display:none; }
    .about-hero-image { transform:none; }
    .essay-block>p:not(.chapter-label):not(.chapter-subtitle) { font-size:16px;line-height:1.9; }
    .chapter-subtitle { font-size:16px!important; }
    .about-brand-copy h1 { font-size:clamp(39px,12vw,56px); }
    .about-brand-lead { font-size:17px; }
    .about-identity-strip .container { justify-content:flex-start;gap:10px;overflow-x:auto;white-space:nowrap; }
    .about-focus-grid,.about-paths-grid { grid-template-columns:1fr; }
    .about-focus-grid article { min-height:auto;padding:24px; }
    .about-focus-grid h3 { margin-top:35px;font-size:24px; }
    .about-principles-list article { grid-template-columns:38px 1fr;gap:12px 16px; }
    .about-principles-list article p { grid-column:2; }
    .about-students-grid>div:last-child { padding:23px; }
    .about-paths-grid a { min-height:150px;padding:23px; }
    .project-hero,.project-detail-hero{padding-block:58px}
    .research-project-row{grid-template-columns:38px 1fr;min-height:0;padding-inline:4px}.project-status{grid-column:2;justify-self:start}
    .project-work-grid,.project-more-links{grid-template-columns:1fr}.project-cta{grid-template-columns:1fr}.project-cta>a{justify-self:start}
}
/* Research project dossier refinements */
.project-method{background:#e3e8e8}
.project-status-note{max-width:760px;margin:24px 0 0;color:#6a777d;font-size:12px;line-height:1.7}
.project-invitation .btn{display:inline-flex;margin-top:22px}
.project-invitation .btn-light{align-items:center;padding:12px 17px;border:1px solid #69d9cc;color:#8ce9dd;font-size:13px;font-weight:700;transition:.18s ease}
.project-invitation .btn-light:hover{color:#071b1d;background:#8ce9dd}
.project-dossier-hero{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:64px;align-items:end}.project-snapshot{padding:24px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.07);backdrop-filter:blur(10px)}.project-snapshot>p{margin:0 0 16px;color:#8ce9dd;font:11px ui-monospace,monospace;letter-spacing:.1em}.project-snapshot>div{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.14)}.project-snapshot span{min-height:92px;padding:15px;background:rgba(7,19,33,.82)}.project-snapshot strong,.project-snapshot small{display:block}.project-snapshot strong{font-size:17px}.project-snapshot small{margin-top:7px;color:#9eacb7;font-size:10px;line-height:1.4}.dossier-opening{padding-bottom:34px;border-bottom:1px solid #c2cacf}.dossier-label{color:#0f766e;font:11px ui-monospace,monospace;letter-spacing:.1em}.dossier-opening h2{margin-top:15px!important}.dossier-objectives{margin:38px 0;padding:28px;background:#e5eaea}.dossier-objectives>ol{margin:20px 0 0;padding:0;list-style:none}.dossier-objectives li{display:grid;grid-template-columns:42px 1fr;gap:15px;padding:13px 0;border-top:1px solid #c3cdcf}.dossier-objectives li span{color:#0f766e;font:12px ui-monospace,monospace}.dossier-objectives li p{margin:0;color:#44535b}.dossier-subhead{margin:38px 0 18px;font-size:24px}.citation-panel{padding:30px;border:1px solid #b9c4c7;background:#f8f9f7}.citation-panel>strong{display:block;font-size:19px;line-height:1.55}.citation-panel>p:not(.dossier-label){margin:28px 0 10px;color:#5c6971}.citation-panel code{display:block;padding:18px;overflow-wrap:anywhere;color:#dce7eb;background:#10202d;font:13px/1.7 ui-monospace,monospace}.citation-panel small{display:block;margin-top:15px;color:#65737a;line-height:1.6}
.project-detail-body{background:radial-gradient(circle at 5% 2%,rgba(15,118,110,.09),transparent 35rem),radial-gradient(circle at 95% 32%,rgba(2,132,199,.07),transparent 30rem),#eeefec}.project-detail-body .project-reading-grid{display:grid;grid-template-columns:1fr;max-width:1180px;gap:18px}.project-detail-body .project-reading-grid>aside{position:static;display:grid;grid-template-columns:110px 180px 1fr;gap:22px;align-items:center;padding:20px 24px;border:1px solid #d2d6d3;border-radius:20px;background:rgba(255,255,255,.82);box-shadow:0 8px 26px rgba(15,23,42,.035)}.project-detail-body .project-reading-grid>aside strong,.project-detail-body .project-reading-grid>aside p{margin:0}.project-detail-body article{display:grid;gap:18px}.dossier-card{padding:34px;border:1px solid #d6d8d5;border-radius:26px;background:rgba(255,255,255,.94);box-shadow:0 8px 26px rgba(15,23,42,.035)}.dossier-card h2{margin:12px 0 18px!important}.dossier-card .dossier-opening{padding:0;border:0}.dossier-split{display:grid;grid-template-columns:1fr 1fr;gap:18px}.dossier-split .dossier-card{height:100%}.dossier-split .dossier-objectives{margin:0;background:rgba(255,255,255,.94)}.dossier-flow{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;border:0}.dossier-flow li{display:block;min-height:150px;padding:18px;border:1px solid #d7dcda;border-radius:18px;background:#f4f5f2}.dossier-flow li p{margin-top:28px;font-size:14px}.project-detail-body .project-philosophy{margin:0;border-radius:26px;padding:36px}.project-detail-body .project-philosophy p{font-size:22px}.dossier-card .project-work-grid,.dossier-card .project-evidence-grid{border-radius:18px;overflow:hidden}.dossier-card .responsibility-note{border-radius:16px}.dossier-card .citation-panel{border-radius:18px}.dossier-card .project-cta{border-radius:18px}
@media (max-width:1000px){.translation-path{grid-template-columns:repeat(2,1fr)}.project-dossier-hero{grid-template-columns:1fr}.project-snapshot{max-width:620px}.dossier-split{grid-template-columns:1fr}.dossier-flow{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.project-evidence-grid,.translation-path,.dossier-flow{grid-template-columns:1fr}.project-snapshot>div{grid-template-columns:1fr}.project-snapshot span{min-height:0}.dossier-objectives{padding:20px}.citation-panel{padding:22px}.dossier-card{padding:24px;border-radius:20px}.project-detail-body .project-reading-grid>aside{grid-template-columns:1fr;gap:8px}.dossier-flow li{min-height:0}.project-detail-body .project-philosophy{padding:26px}.project-detail-body .project-philosophy p{font-size:18px}}
/* Teaching portfolio and course catalogue */
.course-portfolio-hero{padding:90px 0 82px;color:white;background:radial-gradient(circle at 85% 12%,rgba(45,212,191,.13),transparent 30%),radial-gradient(circle at 10% 80%,rgba(56,189,248,.08),transparent 28%),#071321}.course-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:80px;align-items:end}.course-portfolio-hero h1{max-width:800px;margin:0;font-size:clamp(44px,6vw,72px);line-height:1.08;letter-spacing:-.045em}.course-hero-grid>div:last-child>p{margin:0;color:#becbd4;font-size:18px;line-height:1.75}.course-legend{display:flex;flex-wrap:wrap;gap:9px;margin-top:28px}.course-legend span{padding:7px 10px;border:1px solid rgba(255,255,255,.18);border-radius:999px;color:#c6d1da;font-size:10px}.course-legend span:before{content:"";display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:#6b7280}.course-legend .is-ready:before{background:#2dd4bf}.course-legend .is-partial:before{background:#f59e0b}.course-teaching-frame{border-bottom:1px solid #c6ced1;background:#e4e9e9}.course-frame-grid{display:grid;grid-template-columns:repeat(3,1fr)}.course-frame-grid>div{min-height:190px;padding:28px;border-inline-start:1px solid #c8d0d2}.course-frame-grid>div:last-child{border-inline-end:1px solid #c8d0d2}.course-frame-grid span{color:#0f766e;font:11px ui-monospace,monospace}.course-frame-grid strong{display:block;margin-top:35px;font-size:18px}.course-frame-grid p{margin:9px 0 0;color:#647179;font-size:13px;line-height:1.6}.course-catalog{padding-block:100px;background:#eef0ef}.course-catalog-head{display:grid;grid-template-columns:1.15fr .85fr;gap:70px;align-items:end;margin-bottom:48px}.course-catalog-head h2{max-width:720px;margin:0;font-size:clamp(34px,4vw,50px);line-height:1.15}.course-catalog-head>p{margin:0;color:#607078;line-height:1.75}.course-list{border-top:1px solid #aeb8bc}.course-row{position:relative;display:grid;grid-template-columns:70px minmax(0,1fr) 250px;gap:25px;align-items:center;min-height:190px;padding:28px 18px;border-bottom:1px solid #c4cccf;background:rgba(255,255,255,.18);transition:.2s ease}.course-row:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:#78858b}.course-state-ready:before{background:#0f766e}.course-state-partial:before{background:#d97706}.course-row:hover{background:rgba(255,255,255,.7)}.course-no{align-self:start;padding-top:5px;color:#6a777d;font:12px ui-monospace,monospace}.course-title-line{display:flex;gap:18px;align-items:flex-start}.course-title-line h3{max-width:760px;margin:0;font-size:24px;line-height:1.3}.course-title-line>span{flex:0 0 auto;margin-top:5px;padding:5px 8px;border:1px solid #aeb9bd;border-radius:999px;color:#607078;font:9px ui-monospace,monospace}.course-state-ready .course-title-line>span{border-color:#77aaa4;color:#0f766e}.course-state-partial .course-title-line>span{border-color:#d6a66f;color:#9a5708}.course-main>p{margin:10px 0 0;color:#66747b;font-size:14px}.course-main>small{display:block;max-width:760px;margin-top:13px;color:#78848a;font-size:12px;line-height:1.6}.course-actions{display:flex;flex-direction:column;gap:8px;align-items:stretch}.course-actions a{display:flex;justify-content:space-between;gap:12px;padding:11px 13px;border:1px solid #aeb9bd;color:#233740;font-size:12px;font-weight:700}.course-actions a:hover{color:white;border-color:#0f766e;background:#0f766e}.course-actions span{color:#839097;font-size:11px;line-height:1.5}.course-closing{padding:84px 0;color:white;background:#0b1b29}.course-closing-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:end}.course-closing h2{margin:0;font-size:clamp(34px,4vw,50px);line-height:1.16}.course-closing-grid>p{margin:0;color:#bbc8d1;font-size:17px;line-height:1.75}
@media(max-width:1000px){.course-hero-grid,.course-catalog-head,.course-closing-grid{grid-template-columns:1fr;gap:35px}.course-row{grid-template-columns:45px 1fr}.course-actions{grid-column:2;align-items:flex-start}.course-actions a{min-width:240px}.course-frame-grid{grid-template-columns:1fr}.course-frame-grid>div{min-height:0;border-inline-end:1px solid #c8d0d2;border-bottom:1px solid #c8d0d2}}
@media(max-width:640px){.course-portfolio-hero{padding:64px 0}.course-portfolio-hero h1{font-size:42px}.course-catalog{padding-block:68px}.course-row{grid-template-columns:32px 1fr;padding:25px 5px}.course-title-line{display:block}.course-title-line h3{font-size:20px}.course-title-line>span{display:inline-block;margin-top:10px}.course-actions a{min-width:0;width:100%}}
/* Course catalogue readability refinements */
.course-catalog-head h2{max-width:660px;font-size:clamp(32px,3.5vw,46px);line-height:1.22}
.course-list{background:rgba(255,255,255,.28)}
.course-row{min-height:170px;padding-block:25px}
.course-row:nth-child(even){background:rgba(224,229,228,.55)}
.course-row:hover{background:#f8f9f7}
.course-main{max-width:800px}
.course-main>p{max-width:720px;line-height:1.65}
.course-actions a{background:rgba(255,255,255,.55)}
/* Scannable course table */
.course-table-wrap{overflow:hidden;border:1px solid #b9c2c5;background:#f6f7f5}
.course-table{width:100%;border-collapse:collapse;table-layout:fixed}
.course-table th{padding:15px 20px;color:#68767d;background:#dfe5e5;font:10px ui-monospace,monospace;letter-spacing:.08em;text-align:left;text-transform:uppercase}
.course-table th:nth-child(1){width:35%}.course-table th:nth-child(2){width:40%}.course-table th:nth-child(3){width:25%}
.course-table td{position:relative;padding:24px 20px;border-top:1px solid #cbd2d4;vertical-align:top}
.course-table tbody tr:nth-child(even){background:#e9eded}.course-table tbody tr:hover{background:#fff}
.course-table td:first-child{padding-left:26px}.course-table td:first-child:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:#7c888d}.course-table tr.course-state-ready td:first-child:before{background:#0f766e}.course-table tr.course-state-partial td:first-child:before{background:#d97706}
.course-table-no{display:block;margin-bottom:13px;color:#718087;font:10px ui-monospace,monospace}.course-table td strong{display:block;color:#22343d;font-size:18px;line-height:1.4}.course-table-status{display:inline-block;margin-top:13px;padding:5px 8px;border:1px solid #aeb8bc;border-radius:999px;color:#647179;font:9px ui-monospace,monospace;text-transform:uppercase}.course-state-ready .course-table-status{border-color:#75aaa4;color:#0f766e}.course-state-partial .course-table-status{border-color:#d8a66b;color:#9a5708}
.course-table td p{margin:0;color:#56656d;font-size:14px;line-height:1.7}.course-table td small{display:block;margin-top:10px;color:#748188;font-size:12px;line-height:1.6}.course-table-links{display:flex;flex-direction:column;gap:8px}.course-table-links a{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid #aeb9bd;color:#243943;background:rgba(255,255,255,.6);font-size:12px;font-weight:700}.course-table-links a:hover{color:white;border-color:#0f766e;background:#0f766e}.course-table-links span{color:#7d8a90;font-size:11px;line-height:1.5}
@media(max-width:760px){.course-table-wrap{overflow:visible;border:0;background:transparent}.course-table,.course-table tbody,.course-table tr,.course-table td{display:block;width:100%}.course-table thead{display:none}.course-table tr{margin-bottom:14px;border:1px solid #c4cccf;background:#f7f8f6!important}.course-table td{padding:18px 18px 18px 112px;border-top:1px solid #d4d9da}.course-table td:first-child{padding:22px 18px 20px 26px;border-top:0}.course-table td:not(:first-child):before{content:attr(data-label);position:absolute;left:18px;top:20px;width:78px;color:#718087;font:9px/1.4 ui-monospace,monospace;letter-spacing:.05em;text-transform:uppercase}.course-table-links a{width:100%}}
/* Course table contrast and Thai-reading pass */
.course-catalog{background:#dfe3e1}
.course-catalog-head h2{color:#142934;font-family:"Noto Sans Thai","Segoe UI",sans-serif;font-weight:750;letter-spacing:-.025em}
.course-catalog-head>p{color:#42545d;font-size:16px;line-height:1.85}
.course-table-wrap{border:0;border-radius:16px;overflow:hidden;background:#cbd2d1;box-shadow:0 14px 34px rgba(12,29,41,.09)}
.course-table{font-family:"Noto Sans Thai","Segoe UI",sans-serif}
.course-table th{padding:18px 22px;color:#dce8eb;background:#102838;font-size:12px;font-weight:700;letter-spacing:.045em}
.course-table td{padding:27px 22px;border-color:#aeb9ba;background:#eef0ed}
.course-table tbody tr:nth-child(even) td{background:#d9dfde}
.course-table tbody tr:hover td{background:#f7f3e9}
.course-table td:first-child{padding-left:30px}
.course-table-no{margin-bottom:10px;color:#526871;font-size:12px;font-weight:700}
.course-table td strong{color:#102a37;font-size:20px;font-weight:750;line-height:1.55}
.course-table td p{color:#30464f;font-size:15px;font-weight:450;line-height:1.8}
.course-table td small{color:#4f626a;font-size:13px;line-height:1.7}
.course-table-status{margin-top:14px;padding:6px 10px;color:#3f5057;border-color:#849398;background:rgba(255,255,255,.45);font-family:"Noto Sans Thai","Segoe UI",sans-serif;font-size:11px;font-weight:700;letter-spacing:0;text-transform:none}
.course-state-ready .course-table-status{color:#075e55;border-color:#4f9289;background:#c9e3de}
.course-state-partial .course-table-status{color:#7b4507;border-color:#c5873f;background:#f1d9b8}
.course-table-links{gap:10px}
.course-table-links a{padding:12px 14px;color:#fff;border-color:#0b665e;border-radius:8px;background:#0f766e;font-size:13px;line-height:1.45}
.course-table-links a:hover{border-color:#092b3a;background:#092b3a}
.course-table-links span{display:block;padding:12px 14px;border-left:3px solid #7b898e;color:#43565e;background:#cdd4d3;font-size:13px;line-height:1.55}
@media(max-width:760px){.course-catalog{background:#d9dfdd}.course-table tr{border:0;border-radius:14px;overflow:hidden;box-shadow:0 7px 20px rgba(12,29,41,.08);background:#edf0ed!important}.course-table tr:nth-child(even){background:#d6dddc!important}.course-table td,.course-table tr:nth-child(even) td{padding:18px;background:transparent}.course-table td:first-child{padding:23px 22px}.course-table td:not(:first-child){padding:47px 20px 20px}.course-table td:not(:first-child):before{left:20px;top:17px;width:auto;color:#53666e;font-size:10px;font-weight:700}.course-table td strong{font-size:19px}.course-table td p{font-size:15px;line-height:1.75}.course-table-links a{font-size:14px}}

/* Education and experience — narrative profile */
.profile-story-hero{position:relative;overflow:hidden;padding:112px 0 94px;color:#f5f2e9;background:radial-gradient(circle at 82% 12%,rgba(45,212,191,.14),transparent 29rem),linear-gradient(135deg,#06111f 0%,#0b2030 100%)}
.profile-story-hero:after{content:"";position:absolute;inset:0;opacity:.08;background-image:linear-gradient(rgba(255,255,255,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.2) 1px,transparent 1px);background-size:76px 76px;mask-image:linear-gradient(90deg,transparent,#000)}
.experience-hero{background:radial-gradient(circle at 10% 88%,rgba(245,158,11,.11),transparent 28rem),linear-gradient(135deg,#06111f 0%,#132635 100%)}
.profile-story-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.3fr .7fr;gap:90px;align-items:end}
.profile-story-hero .eyebrow{display:inline-flex;margin:0 0 20px;padding:7px 11px;border:1px solid rgba(103,232,249,.32);border-radius:999px;color:#67e8f9;font:700 10px ui-monospace,monospace;letter-spacing:.14em}
.profile-story-hero h1{max-width:900px;margin:0;font-size:clamp(45px,6.2vw,78px);line-height:1.05;letter-spacing:-.048em}
.profile-story-hero h1 em{color:#86ddd3;font-family:Georgia,serif;font-size:.77em;font-weight:400}
.profile-story-lead{margin:0;padding:25px 0 5px 27px;border-left:1px solid rgba(255,255,255,.2);color:#bdcbd2;font-size:17px;line-height:1.85}
.profile-story-body{padding:104px 0 120px;background:radial-gradient(circle at 6% 7%,rgba(15,118,110,.07),transparent 30rem),#e5e8e5}
.profile-story-layout{display:grid;grid-template-columns:minmax(0,760px) minmax(250px,340px);gap:90px;align-items:start;justify-content:center}
.profile-narrative{min-width:0}
.story-kicker{margin:0 0 12px!important;color:#0f766e!important;font:700 10px ui-monospace,monospace!important;letter-spacing:.13em;text-transform:uppercase}
.profile-narrative h2{margin:0 0 23px;color:#102835;font-size:clamp(31px,4vw,47px);line-height:1.18;letter-spacing:-.035em}
.profile-narrative>p:not(.story-kicker){margin:0 0 22px;color:#3c5059;font-size:17px;line-height:1.95}
.profile-narrative .story-kicker:not(:first-child){margin-top:75px!important}
.profile-narrative blockquote{position:relative;margin:64px 0;padding:34px 42px;border:0;border-left:4px solid #18a79a;color:#eaf4f3;background:#102936;font:italic 25px/1.55 Georgia,serif;box-shadow:0 18px 40px rgba(13,34,45,.1)}
.profile-narrative blockquote:before{content:"“";position:absolute;right:24px;top:6px;color:rgba(255,255,255,.09);font:90px Georgia,serif}
.profile-fact-rail{position:sticky;top:112px;padding:28px;border:1px solid #bdc7c6;border-radius:20px;background:rgba(246,247,243,.82);box-shadow:0 16px 42px rgba(12,29,41,.06);backdrop-filter:blur(9px)}
.profile-fact-rail>p{margin:0 0 18px;color:#0f766e;font:700 10px ui-monospace,monospace;letter-spacing:.12em}
.profile-fact-rail ol{margin:0;padding:0;list-style:none}
.profile-fact-rail li{position:relative;padding:18px 0 20px 24px;border-top:1px solid #d0d7d5}
.profile-fact-rail li:before{content:"";position:absolute;left:0;top:25px;width:8px;height:8px;border:2px solid #0f766e;border-radius:50%;background:#eef1ed}
.profile-fact-rail time,.profile-fact-rail strong,.profile-fact-rail span{display:block}
.profile-fact-rail time{margin-bottom:7px;color:#718087;font:10px ui-monospace,monospace}
.profile-fact-rail strong{color:#17303b;font-size:15px;line-height:1.45}
.profile-fact-rail span{margin-top:5px;color:#66777e;font-size:11px;line-height:1.55}
.profile-fact-rail>small{display:block;margin-top:18px;padding-top:18px;border-top:1px solid #d0d7d5;color:#748188;font-size:11px;line-height:1.65}
.story-next{display:grid;gap:1px;margin-top:76px;padding:26px;background:#cfd8d6}
.story-next>span{padding:5px 10px 17px;color:#52656c;font:700 10px ui-monospace,monospace;letter-spacing:.11em}
.story-next a{display:flex;justify-content:space-between;gap:20px;padding:17px 19px;color:#14313d;background:#edf0ec;font-weight:700}
.story-next a:hover{color:white;background:#0f766e}
.story-next b{font-size:19px;font-weight:400}
.about-profile-paths{padding:82px 0 96px;background:#cfd8d6}
.about-profile-paths h2{margin:0 0 30px;color:#102835;font-size:clamp(32px,4vw,48px);letter-spacing:-.035em}
.about-profile-paths .container>div{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.about-profile-paths a{position:relative;display:grid;min-height:190px;padding:28px;color:#17303b;border:1px solid #b5c0be;background:#e9ece8;transition:.2s ease}
.about-profile-paths a:hover{color:white;border-color:#0f766e;background:#0f766e;transform:translateY(-3px)}
.about-profile-paths a span{font:700 10px ui-monospace,monospace;letter-spacing:.11em}
.about-profile-paths a strong{max-width:440px;align-self:end;font-size:20px;line-height:1.55}
.about-profile-paths a b{position:absolute;right:25px;top:24px;font-size:20px;font-weight:400}
@media(max-width:900px){.profile-story-hero-grid,.profile-story-layout{grid-template-columns:1fr;gap:44px}.profile-story-lead{max-width:680px}.profile-fact-rail{position:static;grid-row:1}.profile-fact-rail ol{display:grid;grid-template-columns:repeat(2,1fr);gap:0 24px}}
@media(max-width:600px){.profile-story-hero{padding:72px 0 64px}.profile-story-hero h1{font-size:42px}.profile-story-lead{padding:20px 0 0;border-left:0;border-top:1px solid rgba(255,255,255,.2);font-size:16px}.profile-story-body{padding:66px 0 78px}.profile-story-layout{gap:36px}.profile-fact-rail{padding:22px}.profile-fact-rail ol{grid-template-columns:1fr}.profile-narrative h2{font-size:31px}.profile-narrative>p:not(.story-kicker){font-size:16px;line-height:1.88}.profile-narrative .story-kicker:not(:first-child){margin-top:55px!important}.profile-narrative blockquote{margin:48px 0;padding:28px 25px;font-size:21px}.story-next{margin-top:55px;padding:15px}.about-profile-paths{padding:62px 0}.about-profile-paths .container>div{grid-template-columns:1fr}.about-profile-paths a{min-height:170px;padding:23px}.about-profile-paths a strong{font-size:18px}}
.article-feature-list{border-top:1px solid #aeb9bc}.article-feature-row{display:grid;grid-template-columns:70px 1fr 36px;gap:25px;align-items:center;padding:34px 22px;border-bottom:1px solid #bdc6c7;background:#e6eae7;transition:.2s ease}.article-feature-row:hover{background:#f5f2e9}.article-feature-index{color:#0f766e;font:700 12px ui-monospace,monospace}.article-feature-row small{color:#0f766e;font:700 10px ui-monospace,monospace;letter-spacing:.09em}.article-feature-row h2{margin:10px 0 8px;color:#17303b;font-size:27px}.article-feature-row p{max-width:780px;margin:0;color:#52656d}.article-feature-row>b{font-size:23px;font-weight:400}.home-featured-note{border-top:4px solid #0f766e!important;background:linear-gradient(145deg,#fff,#e4efeb)!important}@media(max-width:640px){.article-feature-row{grid-template-columns:35px 1fr;padding:25px 14px}.article-feature-row>b{display:none}.article-feature-row h2{font-size:22px}}
.project-pico::before{background:#ef542e}