:root { --navy:#082b3b; --deep:#041d29; --orange:#e47c2a; --cream:#f5efe3; --paper:#fffdf8; --ink:#102b34; --muted:#5b6e72; --font-sans:Arial,Helvetica,sans-serif; --font-serif:Georgia,'Times New Roman',serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--font-sans),Arial,sans-serif; }
a { color:inherit; }
img { display:block; max-width:100%; }
.site-header { align-items:center; background:rgba(255,253,248,.94); border-bottom:1px solid rgba(8,43,59,.12); display:flex; justify-content:space-between; left:0; padding:16px clamp(22px,5vw,76px); position:sticky; right:0; top:0; z-index:20; backdrop-filter:blur(12px); }
.brand { align-items:center; display:flex; gap:11px; text-decoration:none; }
.brand-mark { align-items:center; background:var(--navy); border-radius:50%; color:white; display:flex; height:42px; justify-content:center; width:42px; }
.brand strong,.brand small { display:block; }
.brand strong { font-family:var(--font-serif),Georgia,serif; font-size:18px; letter-spacing:.08em; }
.brand small { color:var(--muted); font-size:10px; letter-spacing:.035em; }
nav { display:flex; gap:30px; }
nav a { font-size:14px; font-weight:650; text-decoration:none; }
nav a:hover { color:var(--orange); }
.hero { background:var(--cream); display:grid; gap:clamp(36px,7vw,100px); grid-template-columns:minmax(0,.9fr) minmax(340px,590px); min-height:calc(100vh - 75px); overflow:hidden; padding:clamp(58px,8vw,112px) clamp(24px,7vw,110px); position:relative; }
.hero::before { border:1px solid rgba(8,43,59,.12); border-radius:50%; content:''; height:430px; left:-270px; position:absolute; top:110px; width:430px; }
.hero-copy { align-self:center; max-width:660px; position:relative; z-index:2; }
.eyebrow { color:var(--orange); font-size:12px; font-weight:800; letter-spacing:.15em; margin:0 0 18px; text-transform:uppercase; }
h1,h2 { font-family:var(--font-serif),Georgia,serif; font-weight:400; letter-spacing:-.035em; margin:0; }
h1 { color:var(--navy); font-size:clamp(56px,7.2vw,108px); line-height:.95; }
h1 em { color:var(--orange); font-weight:400; }
.intro { font-size:clamp(18px,2vw,23px); line-height:1.55; margin:30px 0; max-width:590px; }
.event-meta { border-left:3px solid var(--orange); display:grid; gap:11px; margin:30px 0 36px; padding-left:20px; }
.event-meta span { align-items:center; display:flex; font-size:15px; font-weight:650; gap:10px; }
.primary-button { background:var(--navy); border-radius:4px; color:#fff; display:inline-flex; font-size:14px; font-weight:750; padding:15px 23px; text-decoration:none; transition:.2s ease; }
.primary-button:hover { background:var(--orange); transform:translateY(-2px); }
.poster-wrap { align-self:center; margin:0; padding:0 0 32px 32px; position:relative; z-index:1; }
.poster-wrap img { aspect-ratio:1; border:10px solid white; box-shadow:0 28px 70px rgba(4,29,41,.25); object-fit:cover; position:relative; width:100%; z-index:2; }
.poster-accent { background:var(--orange); bottom:0; height:78%; left:0; position:absolute; width:78%; z-index:0; }
.poster-wrap figcaption { color:var(--muted); font-size:11px; letter-spacing:.08em; margin-top:12px; text-align:right; text-transform:uppercase; }
.program-section,.gallery-section { padding:clamp(76px,10vw,142px) clamp(24px,7vw,110px); }
.section-heading { max-width:720px; }
h2 { color:var(--navy); font-size:clamp(38px,5vw,70px); line-height:1.08; }
.highlights { border-top:1px solid rgba(8,43,59,.2); display:grid; grid-template-columns:repeat(3,1fr); margin-top:64px; }
.highlight { border-right:1px solid rgba(8,43,59,.2); min-height:270px; padding:34px 38px 24px 0; position:relative; }
.highlight+.highlight { padding-left:38px; }
.highlight:last-child { border-right:0; }
.number { color:rgba(8,43,59,.35); float:right; font-family:var(--font-serif); font-size:13px; }
.highlight svg,.feature-icon { color:var(--orange); display:block; font-size:27px; margin-bottom:50px; }
.highlight h3 { font-family:var(--font-serif); font-size:22px; margin:0 0 10px; }
.highlight p { color:var(--muted); line-height:1.6; margin:0; max-width:260px; }
.explanation { background:var(--navy); color:#e9efef; display:grid; gap:clamp(46px,8vw,120px); grid-template-columns:minmax(300px,.85fr) minmax(0,1fr); padding:clamp(76px,10vw,140px) clamp(24px,7vw,110px); }
.explanation-photo { align-self:center; position:relative; }
.explanation-photo img { aspect-ratio:4/5; filter:saturate(.8); object-fit:cover; width:100%; }
.explanation-photo span { background:var(--orange); bottom:-20px; color:white; font-size:11px; font-weight:800; letter-spacing:.13em; padding:15px 20px; position:absolute; right:-18px; text-transform:uppercase; }
.explanation-copy { align-self:center; max-width:720px; }
.explanation-copy h2 { color:white; margin-bottom:34px; }
.explanation-copy>p:not(.eyebrow) { color:#c5d1d3; font-size:17px; line-height:1.75; }
blockquote { border-left:2px solid var(--orange); color:white; font-family:var(--font-serif); font-size:clamp(20px,2.3vw,29px); line-height:1.5; margin:38px 0 0; padding-left:26px; }
.gallery-section { background:var(--paper); }
.gallery-heading { align-items:end; display:flex; justify-content:space-between; max-width:none; }
.gallery-heading>p { color:var(--muted); line-height:1.7; margin:0 0 5px 40px; max-width:420px; }
.photo-grid { display:grid; gap:18px; grid-template-columns:1.2fr .8fr; grid-template-rows:repeat(2,310px); margin-top:60px; }
.photo { margin:0; overflow:hidden; position:relative; }
.photo-1 { grid-row:1/3; }
.photo img { height:100%; object-fit:cover; transition:transform .5s ease; width:100%; }
.photo:hover img { transform:scale(1.025); }
.photo figcaption { background:linear-gradient(transparent,rgba(4,29,41,.8)); bottom:0; color:white; font-size:12px; left:0; padding:45px 18px 16px; position:absolute; right:0; }
.closing { align-items:center; background:var(--cream); display:flex; flex-direction:column; padding:clamp(72px,9vw,120px) 24px; text-align:center; }
.closing>svg,.closing-anchor { color:var(--orange); font-size:34px; margin-bottom:20px; }
.closing h2 { font-size:clamp(38px,5vw,65px); }
.closing>p:last-child { color:var(--muted); font-size:17px; line-height:1.6; max-width:620px; }
footer { align-items:center; background:var(--deep); color:white; display:grid; gap:20px; grid-template-columns:1fr auto 1fr; padding:32px clamp(24px,7vw,110px); }
.footer-brand small,footer>p { color:#8fa3a8; }
.footer-contact { color:#8fa3a8; font-size:12px; line-height:1.7; margin:12px 0 0 53px; }
.footer-contact a { text-decoration:none; }
.footer-contact a:hover { color:white; text-decoration:underline; }
footer>p { font-size:12px; text-align:center; }
footer>p:last-child { text-align:right; }
@media (max-width:850px) { nav{display:none}.hero{grid-template-columns:1fr;min-height:auto}.poster-wrap{margin:0 auto;max-width:570px}.highlights{grid-template-columns:1fr}.highlight,.highlight+.highlight{border-bottom:1px solid rgba(8,43,59,.2);border-right:0;min-height:0;padding:28px 0}.highlight svg,.feature-icon{margin-bottom:25px}.explanation{grid-template-columns:1fr}.explanation-photo{max-width:620px}.gallery-heading{align-items:start;flex-direction:column}.gallery-heading>p{margin:25px 0 0}footer{grid-template-columns:1fr;text-align:center}.footer-brand{justify-content:center}.footer-contact{margin-left:0}footer>p:last-child{text-align:center} }
@media (max-width:560px) { .site-header{padding:12px 18px}.brand small{max-width:190px}.hero{padding-top:55px}.poster-wrap{padding:0 0 18px 18px}.photo-grid{display:flex;flex-direction:column}.photo{height:280px}.explanation-photo span{right:-8px} }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}*,*::before,*::after{transition-duration:.01ms!important} }