:root { --ink:#10233b; --blue:#0b5ea8; --cyan:#24b6bd; --paper:#f8f7f2; --muted:#5e6b77; --line:#d7dde1; --dark:#09213c; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Manrope,Arial,sans-serif; line-height:1.55; }
.site-header { max-width:1200px; min-height:82px; margin:auto; padding:18px 32px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { color:var(--ink); display:inline-flex; align-items:center; gap:10px; text-decoration:none; font-weight:800; letter-spacing:.08em; font-size:17px; }
.brand-mark { font-family:"DM Mono",monospace; letter-spacing:-.1em; padding:5px 7px; color:#fff; background:var(--blue); border-radius:4px; font-size:15px; }
nav { display:flex; align-items:center; gap:24px; font-size:14px; font-weight:700; }
nav a { color:var(--ink); text-decoration:none; }.nav-cta { background:var(--ink); color:#fff; padding:10px 14px; border-radius:5px; }
main { overflow:hidden; }.hero { max-width:1200px; margin:8px auto 0; padding:52px 32px 58px; display:grid; grid-template-columns:1.4fr .8fr; gap:58px; align-items:center; position:relative; }
.hero:before { content:""; position:absolute; width:600px; height:600px; border-radius:50%; right:-310px; top:-180px; background:radial-gradient(circle,rgba(36,182,189,.2),rgba(36,182,189,0) 67%); pointer-events:none; }
.eyebrow { color:var(--blue); letter-spacing:.15em; font-size:12px; font-weight:800; margin:0 0 18px; }.hero h1 { max-width:710px; font-size:clamp(42px,6vw,72px); letter-spacing:-.055em; line-height:1.04; margin:0; }.lead { max-width:620px; color:var(--muted); font-size:18px; margin:26px 0 32px; }
.actions { display:flex; flex-wrap:wrap; gap:13px; }.button { display:inline-flex; align-items:center; justify-content:center; gap:12px; text-decoration:none; font-weight:800; padding:14px 20px; border-radius:5px; transition:transform .15s ease,background .15s ease; }.button:hover { transform:translateY(-2px); }.primary { color:white; background:var(--blue); }.secondary { color:var(--ink); border:1px solid var(--line); }.light { color:var(--dark); background:#fff; }
.page-links { max-width:1200px; margin:0 auto; padding:0 32px 70px; display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }.page-links a { padding:25px 28px; background:#e9f0ef; border:1px solid #d5e0df; border-radius:10px; color:var(--ink); text-decoration:none; transition:transform .15s ease,background .15s ease; }.page-links a:hover { transform:translateY(-3px); background:#dcebe9; }.page-links .eyebrow { display:block; margin-bottom:8px; }.page-links strong { display:flex; justify-content:space-between; align-items:center; font-size:20px; letter-spacing:-.025em; }.page-hero { max-width:850px; margin:0 auto; padding:72px 32px 75px; text-align:center; }.page-hero h1 { margin:0; font-size:clamp(42px,6vw,68px); letter-spacing:-.055em; line-height:1.04; }.page-hero p:not(.eyebrow) { max-width:650px; color:var(--muted); margin:24px auto 0; font-size:18px; }
.session-card { position:relative; padding:28px; background:var(--dark); color:#fff; border-radius:12px; box-shadow:20px 20px 0 #dce6e6; }.card-top { color:#b9d4e6; font-family:"DM Mono",monospace; font-size:12px; text-transform:uppercase; letter-spacing:.05em; }.status-dot { display:inline-block; width:8px; height:8px; background:#71dc86; border-radius:50%; margin-right:7px; }.session-card h2 { font-size:30px; letter-spacing:-.04em; line-height:1.12; margin:25px 0; }.session-card dl { border-top:1px solid #38536c; margin:0 0 24px; }.session-card dl div { display:flex; justify-content:space-between; border-bottom:1px solid #38536c; padding:12px 0; font-size:14px; }.session-card dt { color:#b9d4e6; }.session-card dd { margin:0; font-weight:700; }.text-link { color:#fff; font-weight:800; text-decoration:none; }
.identity { max-width:1200px; margin:0 auto; padding:0 32px 88px; display:grid; grid-template-columns:190px 1fr 175px; align-items:center; gap:46px; }.identity figure { margin:0; }.group-logo { padding:12px; background:#fff; border:1px solid var(--line); border-radius:10px; }.group-logo img { display:block; width:100%; height:auto; }.ve-patch img { display:block; width:100%; aspect-ratio:1; object-fit:cover; border-radius:50%; border:5px solid #e3e7e4; }.identity h2 { max-width:540px; margin:0; font-size:clamp(27px,3.5vw,42px); line-height:1.12; letter-spacing:-.045em; }.identity p:not(.eyebrow) { max-width:580px; color:var(--muted); margin:15px 0 0; }
.intro { background:#e9f0ef; padding:90px max(32px,calc((100vw - 1136px)/2)); display:grid; grid-template-columns:.65fr 1.35fr; gap:40px; }.intro h2,.steps h2,.cta h2 { margin:0; line-height:1.12; letter-spacing:-.045em; font-size:clamp(30px,4vw,48px); }.intro p:not(.eyebrow) { max-width:680px; color:#465561; font-size:17px; margin:25px 0 0; }
.details { background:#e9f0ef; padding:75px max(32px,calc((100vw - 1136px)/2)); display:grid; grid-template-columns:1fr 1fr; gap:50px; }.details h2 { margin:0; font-size:clamp(30px,4vw,48px); line-height:1.12; letter-spacing:-.045em; }.details dl { margin:0; border-top:1px solid #bbc8c8; }.details dl div { display:flex; justify-content:space-between; padding:15px 0; border-bottom:1px solid #bbc8c8; }.details dt { color:var(--muted); }.details dd { margin:0; font-weight:800; }
.steps { max-width:1200px; margin:auto; padding:92px 32px; }.steps ol { list-style:none; padding:0; margin:46px 0 0; display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }.steps li { padding-top:20px; border-top:2px solid var(--blue); }.number { color:var(--cyan); font:500 16px "DM Mono",monospace; }.steps h3 { font-size:21px; margin:16px 0 8px; }.steps li p { margin:0; color:var(--muted); font-size:15px; }
.hamstudy-link { display:block; margin-top:20px; padding:14px; border:1px solid #d3e2e5; border-radius:8px; background:#f6fbfb; color:var(--ink); text-decoration:none; transition:transform .15s ease,box-shadow .15s ease; }.hamstudy-link:hover { transform:translateY(-2px); box-shadow:0 8px 20px rgba(9,33,60,.1); }.hamstudy-link img { display:block; width:155px; max-width:100%; height:auto; margin:0 0 10px; }.hamstudy-link span { display:block; color:var(--muted); font-size:13px; line-height:1.45; }.hamstudy-link b { display:block; color:var(--blue); margin-top:10px; font-size:13px; }
.cta { background:var(--blue); color:#fff; padding:92px 32px; text-align:center; }.cta .eyebrow { color:#bfe8ee; }.cta h2 { max-width:690px; margin:0 auto 30px; }.cta .button { font-size:15px; }footer { max-width:1200px; margin:auto; padding:42px 32px; display:flex; justify-content:space-between; align-items:flex-start; gap:28px; color:var(--muted); font-size:13px; }footer .brand { font-size:15px; }footer p { margin:9px 0 0; }footer small { color:#87919a; }
@media (max-width:760px) { .site-header { padding:16px 20px; }.site-header nav>a:first-child { display:none; }nav { gap:10px; }.hero { padding:48px 24px 58px; grid-template-columns:1fr; gap:45px; }.hero h1 { font-size:46px; }.page-links { padding:0 24px 65px; grid-template-columns:1fr; }.page-hero { padding:50px 24px 60px; }.page-hero h1 { font-size:44px; }.session-card { box-shadow:12px 12px 0 #dce6e6; }.identity { padding:0 24px 64px; grid-template-columns:1fr; gap:24px; text-align:center; }.group-logo { width:min(220px,75vw); margin:auto !important; }.ve-patch { width:150px; margin:auto !important; grid-row:2; }.identity-copy { grid-row:3; }.intro,.details { padding:64px 24px; grid-template-columns:1fr; gap:24px; }.steps { padding:65px 24px; }.steps ol { grid-template-columns:1fr; gap:26px; margin-top:36px; }.cta { padding:66px 24px; }footer { padding:34px 24px; flex-direction:column; gap:14px; } }