:root { --ink:#102b33; --muted:#5c7175; --paper:#f7faf9; --card:#fff; --line:#dce8e5; --teal:#0b6b68; --teal-dark:#07524f; --mint:#dff2ed; --coral:#e56d4f; --shadow:0 20px 50px rgba(16,43,51,.09); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color:var(--ink); background:var(--paper); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; background:radial-gradient(circle at 92% 0%, #e8f3f0 0, transparent 29rem),var(--paper); line-height:1.5; }
a { color:inherit; text-decoration:none; }
.site-header { width:min(1180px,calc(100% - 40px)); margin:auto; min-height:82px; display:flex; align-items:center; justify-content:space-between; gap:28px; }
.brand { display:flex; align-items:center; gap:12px; }
.brand-mark { display:grid; place-items:center; width:38px; height:38px; border-radius:10px; color:#fff; background:var(--teal); font-weight:800; font-size:12px; letter-spacing:.04em; }
.brand strong,.brand small { display:block; }.brand strong { font-size:14px; letter-spacing:-.01em; }.brand small { color:var(--muted); font-size:11px; margin-top:1px; }
nav { display:flex; align-items:center; gap:26px; color:var(--muted); font-size:13px; font-weight:600; } nav a { transition:color .2s ease; } nav a:hover,nav a:focus-visible { color:var(--teal); }
.nav-action { padding:11px 16px; color:#fff; background:var(--ink); border-radius:8px; }.nav-action:hover,.nav-action:focus-visible { color:#fff; background:var(--teal); }
.page-shell { width:min(1180px,calc(100% - 40px)); margin:auto; }
.hero { min-height:470px; display:grid; grid-template-columns:1.2fr .8fr; align-items:center; gap:70px; padding:68px 0 80px; }
.eyebrow,.card-kicker,.term-label { margin:0 0 13px; color:var(--teal); font-size:11px; text-transform:uppercase; letter-spacing:.13em; font-weight:800; }.status-dot { display:inline-block; width:7px; height:7px; margin-right:7px; border-radius:50%; background:#5ea982; box-shadow:0 0 0 4px #dff2e8; }
h1,h2,h3,p { margin-top:0; } h1 { max-width:700px; margin-bottom:21px; font-size:clamp(42px,6vw,72px); line-height:1.03; letter-spacing:-.065em; font-weight:760; } h2 { margin-bottom:14px; font-size:clamp(28px,4vw,42px); letter-spacing:-.045em; line-height:1.08; } h3 { margin-bottom:9px; font-size:20px; letter-spacing:-.025em; line-height:1.2; }
.hero-lede { max-width:590px; color:var(--muted); font-size:18px; line-height:1.65; }.hero-actions { display:flex; align-items:center; gap:24px; margin-top:31px; }.button { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:46px; padding:0 18px; border:1px solid transparent; border-radius:8px; font-size:13px; font-weight:750; cursor:pointer; transition:transform .2s ease,background .2s ease,box-shadow .2s ease; }.button:hover,.button:focus-visible { transform:translateY(-2px); box-shadow:0 8px 20px rgba(16,43,51,.14); }.button-primary { color:#fff; background:var(--coral); }.button-primary:hover,.button-primary:focus-visible { background:#ce583d; }.button-secondary { color:var(--teal-dark); border-color:#badbd4; background:#eff8f5; }.text-link { color:var(--teal); font-size:13px; font-weight:750; border-bottom:1px solid #a9cfca; padding-bottom:4px; }
.hero-card { max-width:375px; justify-self:end; width:100%; padding:30px; border:1px solid #cde1dc; border-radius:18px; background:rgba(255,255,255,.8); box-shadow:var(--shadow); }.course-image { display:block; width:calc(100% + 60px); height:145px; margin:-30px -30px 25px; border-radius:18px 18px 0 0; object-fit:cover; }.hero-date { margin:4px 0 29px; color:var(--teal); font-size:72px; line-height:.9; font-weight:800; letter-spacing:-.09em; }.hero-card-row { display:flex; justify-content:space-between; gap:20px; padding:15px 0; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }.hero-card-row strong { color:var(--ink); text-align:right; font-size:12px; }.hero-card-row small { display:block; color:var(--muted); font-weight:500; font-size:10px; }
.section { padding:76px 0; border-top:1px solid var(--line); }.section-heading { display:flex; justify-content:space-between; align-items:end; gap:25px; margin-bottom:28px; }.course-count,.info-pill { color:var(--teal); background:var(--mint); padding:8px 12px; border-radius:999px; font-size:11px; font-weight:800; white-space:nowrap; }.course-card { display:flex; justify-content:space-between; gap:35px; padding:30px; border:1px solid var(--line); border-radius:15px; background:var(--card); box-shadow:0 8px 28px rgba(16,43,51,.04); }.course-card-main { display:flex; gap:21px; }.course-icon { flex:none; display:grid; place-items:center; width:52px; height:52px; color:var(--teal); background:var(--mint); border-radius:12px; font-size:13px; font-weight:800; }.course-card p { max-width:570px; margin-bottom:18px; color:var(--muted); font-size:14px; }.tag-row { display:flex; flex-wrap:wrap; gap:8px; }.tag-row span { padding:6px 9px; color:var(--teal-dark); background:#f0f6f4; border-radius:5px; font-size:10px; font-weight:700; }.course-card-side { min-width:170px; display:flex; flex-direction:column; align-items:flex-end; }.course-card-side strong { font-size:20px; }.course-card-side > span { margin:2px 0 22px; color:var(--muted); font-size:11px; }.course-card-side .button { margin-top:auto; }
.detail-section { background:#edf6f3; margin-left:calc((1180px - 100vw)/2); margin-right:calc((1180px - 100vw)/2); padding-left:max(20px,calc((100vw - 1180px)/2)); padding-right:max(20px,calc((100vw - 1180px)/2)); }.detail-intro { max-width:670px; }.detail-intro > p:last-child { color:var(--muted); font-size:16px; }.detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:32px; }.detail-panel { padding:29px; border:1px solid #d2e7e1; border-radius:14px; background:#fff; }.detail-panel-accent { color:#fff; background:var(--teal); border-color:var(--teal); }.detail-panel-accent .card-kicker,.detail-panel-accent p { color:#bfe0d9; }.detail-panel-accent .button { margin-top:12px; color:var(--teal-dark); background:#fff; }.check-list { display:grid; gap:16px; padding:0; margin:19px 0 0; list-style:none; color:var(--muted); font-size:14px; }.check-list li { display:flex; gap:10px; }.check-list span { color:var(--coral); font-weight:900; }
.terms-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:13px; }.term-card { min-height:190px; display:flex; flex-direction:column; padding:20px; border:1px solid var(--line); border-radius:12px; background:#fff; }.term-card-fixed { background:#f0f7f5; border-color:#cce2dc; }.term-card .term-label { margin-bottom:22px; color:var(--muted); font-size:9px; }.term-card-fixed .term-label { color:var(--teal); }.term-card h3 { font-size:17px; }.term-card p { min-height:44px; margin-bottom:19px; color:var(--muted); font-size:12px; }.term-note { margin-top:auto; color:var(--teal); font-size:11px; font-weight:750; }.capacity { display:flex; justify-content:space-between; gap:8px; margin-top:auto; color:var(--teal); font-size:11px; font-weight:750; }.capacity > span:last-child { color:var(--muted); font-weight:500; }.capacity-dot { display:inline-block; width:7px; height:7px; border-radius:50%; background:#5ea982; }.capacity-muted { color:var(--muted); }.capacity-muted .capacity-dot { background:#e5a250; }.notice { display:flex; gap:12px; align-items:flex-start; margin-top:25px; padding:17px 19px; border:1px solid #f0d8ad; border-radius:10px; background:#fffaf0; }.notice-icon { display:grid; place-items:center; width:20px; height:20px; flex:none; border-radius:50%; color:#fff; background:#d69743; font-size:12px; font-weight:800; }.notice p { margin:0; color:#70592f; font-size:12px; }.notice strong { color:#4e3a1c; }
.site-footer { width:min(1180px,calc(100% - 40px)); display:flex; justify-content:space-between; gap:20px; margin:0 auto; padding:28px 0 40px; color:var(--muted); font-size:11px; }
.booking-section { background:#fff; }
.booking-layout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr); gap:24px; align-items:start; }
.booking-form { display:grid; gap:20px; }
.booking-form fieldset { min-width:0; margin:0; padding:23px; border:1px solid var(--line); border-radius:14px; background:#fbfdfc; }
.booking-form legend { padding:0 8px; color:var(--ink); font-size:17px; font-weight:750; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.form-grid label { display:grid; gap:7px; color:var(--ink); font-size:12px; font-weight:700; }
.form-grid .span-2 { grid-column:span 2; }
.optional { color:var(--muted); font-weight:500; }
.form-grid input,.form-grid select { width:100%; min-height:46px; padding:10px 12px; border:1px solid #b9d2cd; border-radius:8px; color:var(--ink); background:#fff; font:inherit; font-weight:500; }
.form-grid input:focus,.form-grid select:focus { border-color:var(--teal); outline:3px solid rgba(11,107,104,.16); outline-offset:1px; }
.field-note,.form-intro { margin:0 0 17px; color:var(--muted); font-size:13px; }
.check-control,.shared-choice { display:flex; align-items:flex-start; gap:10px; margin:0 0 18px; color:var(--ink); font-size:12px; font-weight:650; }
.check-control input { flex:none; width:18px; height:18px; margin:0; accent-color:var(--teal); }
.participant-list,.participants { display:grid; gap:13px; }
.participant-card { padding:17px; border:1px solid #d5e5e1; border-radius:10px; background:#fff; }
.participant-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.participant-head h3 { margin:0; font-size:15px; }
.remove-participant { padding:6px 8px; border:0; border-radius:5px; color:var(--muted); background:#eef5f3; font:inherit; font-size:11px; font-weight:700; cursor:pointer; }
.remove-participant:hover,.remove-participant:focus-visible { color:var(--ink); background:#dcebe7; }
.form-actions { display:flex; align-items:center; gap:15px; flex-wrap:wrap; }
.form-actions .button { border:0; }
.add-button { margin-top:15px; }
.form-footnote { margin:0; color:var(--muted); font-size:11px; }
.form-alert { margin:0; padding:13px 15px; border:1px solid #e7b9ae; border-radius:8px; color:#8c3828; background:#fff4f1; font-size:12px; }
.booking-summary { position:sticky; top:20px; padding:24px; border:1px solid #c7dfd9; border-radius:14px; color:#fff; background:var(--teal); box-shadow:var(--shadow); }
.booking-summary h3 { margin-bottom:20px; font-size:19px; }
.summary-row { display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-top:1px solid rgba(255,255,255,.2); color:#bfe0d9; font-size:12px; }
.summary-row strong { color:#fff; text-align:right; }
.summary-total { margin-top:8px; font-size:15px; }
.summary-total strong { font-size:19px; }
.success-message,.prep-success { display:grid; gap:3px; margin-top:18px; padding:14px; border-radius:8px; color:var(--teal-dark); background:#dff2ed; font-size:12px; }
.review-section { background:#edf6f3; }
.review-layout { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr); gap:24px; align-items:start; }
.review-card,.review-confirmation { padding:25px; border:1px solid #d2e7e1; border-radius:14px; background:#fff; }
.review-card h3 { margin:0 0 15px; font-size:18px; }.review-card h3 + .review-list { margin-bottom:30px; }
.review-list { display:grid; grid-template-columns:125px 1fr; gap:9px 18px; margin:0; font-size:13px; }.review-list dt { color:var(--muted); }.review-list dd { margin:0; font-weight:700; }
.review-participants { display:grid; gap:10px; }.review-participant { padding:14px; border-left:4px solid var(--teal); border-radius:7px; background:#f3f9f7; }.review-participant h4 { margin:0 0 3px; font-size:14px; }.review-participant p { margin:0; color:var(--muted); font-size:12px; }
.review-confirmation { color:#fff; background:var(--teal); border-color:var(--teal); }.review-confirmation .card-kicker,.review-confirmation .form-footnote { color:#bfe0d9; }.review-confirmation h3 { margin-bottom:7px; font-size:30px; }.review-confirmation > p { color:#d9efea; font-size:13px; }.review-confirmation .shared-choice { color:#fff; margin-top:22px; }.review-confirmation .button { width:100%; margin-top:14px; }.review-confirmation .form-alert { color:#8c3828; background:#fff4f1; }.review-confirmation .prep-success { color:var(--teal-dark); }
:focus-visible { outline:3px solid #e5a250; outline-offset:4px; }
@media (max-width:850px) { nav a:not(.nav-action) { display:none; }.hero { grid-template-columns:1fr; gap:35px; padding-top:45px; }.hero-card { justify-self:start; }.terms-grid { grid-template-columns:repeat(2,1fr); }.term-card:last-child { grid-column:span 2; }.course-card { flex-direction:column; }.course-card-side { align-items:flex-start; }.course-card-side .button { margin-top:12px; }.booking-layout,.review-layout { grid-template-columns:1fr; }.booking-summary { position:static; } }
@media (max-width:560px) { .site-header,.page-shell,.site-footer { width:min(100% - 28px,1180px); }.site-header { min-height:70px; }.nav-action { padding:9px 11px; font-size:11px; }.hero { padding:42px 0 60px; }.hero-lede { font-size:16px; }.hero-actions { align-items:flex-start; flex-direction:column; gap:17px; }.section { padding:54px 0; }.section-heading { align-items:flex-start; flex-direction:column; gap:10px; }.course-card { padding:20px; }.course-card-main { flex-direction:column; gap:15px; }.detail-grid { grid-template-columns:1fr; }.terms-grid { grid-template-columns:1fr; }.term-card:last-child { grid-column:auto; }.site-footer { flex-direction:column; gap:8px; }.form-grid { grid-template-columns:1fr; }.form-grid .span-2 { grid-column:auto; }.booking-form fieldset,.booking-summary,.review-card,.review-confirmation { padding:18px; }.review-list { grid-template-columns:1fr; gap:3px; }.review-list dd { margin-bottom:8px; } }
 .admin-shell { padding:60px 0; }.admin-shell h1 { font-size:clamp(38px,6vw,64px); }.attendance-row { display:flex; align-items:center; gap:10px; min-height:44px; margin-top:10px; color:var(--muted); font-size:13px; }.attendance-row input { width:18px; height:18px; accent-color:var(--teal); }
@media (prefers-reduced-motion:reduce) { *,html { scroll-behavior:auto !important; transition-duration:.01ms !important; } }