:root { --navy:#061735; --navy-deep:#030d20; --paper:#f7f7f4; --silver:#c6c7ca; --muted:#9ea8b9; --gold:#fbbd1b; --chrome:linear-gradient(110deg,#fbbd1b 0%,#fed856 42%,#fdea8b 62%,#fdfbbb 100%); --line:rgba(224,231,244,.22); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; overflow-x:hidden; background:var(--navy-deep); color:var(--paper); font-family:Inter,sans-serif; line-height:1.6; } img { display:block; max-width:100%; } a { color:inherit; }
.container { width:min(1100px,calc(100% - 40px)); margin:0 auto; } .section { padding:104px 0; }
.site-nav { position:sticky; top:0; z-index:10; min-height:72px; padding:12px 40px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; background:rgba(3,13,32,.92); border-bottom:1px solid rgba(255,255,255,.13); backdrop-filter:blur(12px); }
.nav-date { grid-column:2; color:var(--paper); font-family:Montserrat,sans-serif; font-size:.74rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; white-space:nowrap; } .nav-cta { grid-column:3; justify-self:end; background:var(--chrome); color:#07152f; font-family:Montserrat,sans-serif; font-size:.72rem; font-weight:900; letter-spacing:.09em; padding:12px 18px; text-decoration:none; text-transform:uppercase; transition:transform 160ms ease-out,box-shadow 160ms ease-out; } .nav-cta:hover,.nav-cta:focus-visible { transform:translateY(-1px); box-shadow:0 8px 30px rgba(251,189,27,.25); } .nav-cta:active,.btn-primary:active,.btn-ghost:active { transform:scale(.97); }
.hero { position:relative; display:grid; min-height:clamp(700px,calc(100svh - 72px),980px); place-items:center; overflow:hidden; background:var(--navy); isolation:isolate; } .hero::before { content:""; position:absolute; inset:0; background:radial-gradient(ellipse at 50% 24%,rgba(14,47,97,.78),transparent 55%); z-index:-3; } .hero::after { content:""; position:absolute; inset:auto 0 0; height:35%; background:linear-gradient(to bottom,transparent,var(--navy-deep)); z-index:-1; }
.hero-content { position:relative; z-index:2; width:min(820px,calc(100% - 40px)); padding:74px 0 96px; text-align:center; } .hero-logo { width:min(330px,70vw); margin:0 auto 24px; filter:drop-shadow(0 0 22px rgba(251,189,27,.16)); } .hero-eyebrow,.section-label { margin:0 0 14px; color:rgba(255,255,255,.68); font-family:Montserrat,sans-serif; font-size:.68rem; font-weight:700; letter-spacing:.28em; text-transform:uppercase; }
.hero-location { display:inline-flex; overflow:hidden; margin:0 auto 24px; border:1px solid rgba(251,189,27,.48); font-family:Montserrat,sans-serif; font-size:clamp(.78rem,1.6vw,1rem); font-weight:800; letter-spacing:.07em; text-transform:uppercase; } .hero-location span { padding:11px 18px; } .hero-location span:first-child { background:var(--chrome); color:var(--navy-deep); } .hero-location span:last-child { color:var(--paper); }
h1,h2,h3 { margin-top:0; font-family:Montserrat,sans-serif; font-weight:900; letter-spacing:0; } h1 { max-width:780px; margin:0 auto 20px; font-size:clamp(2.25rem,4.4vw,3.7rem); line-height:1.14; } h1 em { font-style:normal; background:var(--chrome); -webkit-background-clip:text; background-clip:text; color:transparent; white-space:nowrap; } .hero-desc { max-width:610px; margin:0 auto 34px; color:rgba(255,255,255,.7); font-size:1rem; }
.hero-cta-group { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; } .btn-primary,.btn-ghost { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:54px; padding:15px 24px; font-family:Montserrat,sans-serif; font-size:.78rem; font-weight:900; letter-spacing:.08em; text-decoration:none; text-transform:uppercase; transition:transform 160ms ease-out,box-shadow 160ms ease-out,border-color 160ms ease-out; } .btn-primary { background:var(--chrome); color:var(--navy-deep); box-shadow:0 6px 28px rgba(251,189,27,.18); } .btn-primary:hover,.btn-primary:focus-visible { transform:translateY(-2px); box-shadow:0 10px 36px rgba(251,189,27,.32); } .btn-ghost { border:1px solid rgba(255,255,255,.35); color:var(--silver); } .btn-ghost:hover,.btn-ghost:focus-visible { border-color:var(--gold); color:var(--paper); } .hero-micro { margin:16px 0 0; color:rgba(255,255,255,.48); font-size:.76rem; }
.hero-lines::before,.hero-lines::after { content:""; position:absolute; width:140vw; height:1px; left:-20vw; transform:rotate(-24deg); transform-origin:center; z-index:-1; } .hero-lines::before { top:17%; background:rgba(253,234,139,.67); box-shadow:0 13px 0 rgba(255,255,255,.24); } .hero-lines::after { bottom:10%; background:rgba(253,234,139,.67); box-shadow:0 13px 0 rgba(255,255,255,.24); } .dot-field { position:absolute; width:260px; height:260px; background-image:radial-gradient(rgba(251,189,27,.52) 1px,transparent 1.5px); background-size:18px 18px; opacity:.58; z-index:-1; } .dot-field-left { top:12%; left:5%; mask-image:linear-gradient(135deg,#000,transparent 82%); } .dot-field-right { right:4%; bottom:10%; mask-image:linear-gradient(315deg,#000,transparent 82%); }
.problem { background:#061b3d; border-top:1px solid rgba(255,255,255,.15); border-bottom:1px solid rgba(255,255,255,.15); text-align:center; } .problem-content { max-width:900px; } .problem h2,.experience h2,.schedule h2,.closing h2 { font-size:clamp(2rem,4vw,3.5rem); line-height:1.14; } .problem p:last-child { max-width:760px; margin:0 auto; color:var(--silver); font-size:1.08rem; }
.experience { background:var(--paper); color:#0a1630; } .experience .section-label { color:#826006; } .experience h2 { max-width:830px; margin-bottom:52px; } .experience-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(10,22,48,.22); } .experience-grid article { min-height:280px; padding:28px 28px 16px 0; border-right:1px solid rgba(10,22,48,.22); } .experience-grid article + article { padding-left:28px; } .experience-grid article:last-child { border-right:0; } .number { display:inline-block; margin-bottom:32px; color:#a57500; font-family:Montserrat,sans-serif; font-size:.78rem; font-weight:900; letter-spacing:.14em; } .experience h3 { font-size:1.45rem; line-height:1.17; } .experience p { color:#4f5a6c; }
.schedule { background:var(--navy-deep); } .schedule h2 { max-width:920px; margin-bottom:42px; } .schedule-list { margin:0; padding:0; list-style:none; border-top:1px solid var(--line); } .schedule-list li { display:grid; grid-template-columns:130px 1fr; gap:24px; padding:26px 0; border-bottom:1px solid var(--line); } .schedule-list span { color:var(--gold); font-family:Montserrat,sans-serif; font-size:.78rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; } .schedule-list strong { font-family:Montserrat,sans-serif; font-size:clamp(1.1rem,2vw,1.55rem); line-height:1.3; }
.closing { background:#061b3d; text-align:center; } .closing-content { max-width:780px; } .closing h2 { margin-bottom:18px; } .closing > p { color:var(--silver); font-size:1.05rem; } .closing-note { margin-top:28px; color:rgba(255,255,255,.55)!important; font-size:.84rem!important; }
.footer { padding:42px 0; background:var(--navy-deep); border-top:1px solid var(--line); } .footer-inner { display:flex; align-items:center; justify-content:space-between; gap:28px; } .footer img { width:104px; } .footer p { margin:0; color:var(--muted); font-size:.83rem; }
@media (max-width:760px) { .section { padding:74px 0; } .site-nav { min-height:70px; padding:10px 18px; grid-template-columns:1fr auto; } .nav-date { grid-column:1; font-size:.64rem; letter-spacing:.08em; } .nav-cta { grid-column:2; padding:11px 13px; font-size:.62rem; } .hero { min-height:calc(100svh - 70px); } .hero-content { padding:54px 0 70px; } .hero-logo { width:min(270px,72vw); margin-bottom:22px; } .hero-eyebrow { font-size:.58rem; letter-spacing:.18em; line-height:1.65; } .hero-location { margin-bottom:20px; font-size:.66rem; } .hero-location span { padding:10px 12px; } h1 { font-size:clamp(2.05rem,10.5vw,2.8rem); line-height:1.11; } .hero-desc { font-size:.94rem; } .btn-primary,.btn-ghost { width:100%; } .hero-cta-group { display:grid; } .dot-field { opacity:.36; transform:scale(.75); } .experience-grid { grid-template-columns:1fr; } .experience-grid article,.experience-grid article + article { min-height:0; padding:28px 0; border-right:0; border-bottom:1px solid rgba(10,22,48,.22); } .schedule-list li { grid-template-columns:1fr; gap:8px; } .footer-inner { align-items:flex-start; flex-direction:column; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition-duration:.01ms!important; } }