:root { color-scheme: dark; --ink:#08090a; --panel:#111315; --panel2:#191b1c; --line:rgba(255,255,255,.16); --white:#f5f3ef; --muted:#aaa9a6; --gold:#d5a749; --gold-bright:#efbd57; --display:Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif; --body:Inter,"Helvetica Neue",Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--white); font-family:var(--body); -webkit-font-smoothing:antialiased; }
button,input { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
a { color:inherit; text-decoration:none; }
a:focus-visible,button:focus-visible,input:focus-visible,.carousel:focus-visible { outline:2px solid var(--gold-bright); outline-offset:4px; }
.wrap { max-width:1440px; padding:0 clamp(22px,5.3vw,84px); margin:0 auto; }
.skip-link { position:absolute; left:16px; top:-60px; z-index:100; background:var(--gold); color:#000; padding:12px 16px; }
.skip-link:focus { top:12px; }
.site-header { position:relative; z-index:30; background:#070809; border-bottom:1px solid rgba(255,255,255,.12); }
.header-inner { display:flex; align-items:center; justify-content:space-between; min-height:86px; gap:24px; }
.brand { display:block; flex:none; width:clamp(155px,15vw,205px); }
.brand img { display:block; width:100%; height:auto; }
.site-nav { display:flex; align-items:center; gap:clamp(18px,3vw,48px); }
.site-nav a { text-transform:uppercase; font-size:11px; font-weight:800; letter-spacing:.18em; color:#d8d8d6; position:relative; transition:color .2s; }
.site-nav a:hover,.site-nav a:focus-visible { color:#fff; }
.site-nav a.nav-active::after { content:""; position:absolute; height:2px; background:var(--gold); bottom:-13px; left:0; right:0; }
.menu-toggle { display:none; }
.hero { min-height:min(710px,calc(100vh - 86px)); position:relative; isolation:isolate; overflow:hidden; }
.hero-image { position:absolute; inset:0; z-index:-3; background-image:url('assets/wsm-mosaic.jpg'); background-size:auto 100%; background-position:right center; background-repeat:no-repeat;  }
.hero-shade { position:absolute; inset:0; z-index:-2; background:linear-gradient(90deg,rgba(4,5,6,.98) 0%,rgba(4,5,6,.89) 22%,rgba(4,5,6,.47) 54%,rgba(4,5,6,.05) 100%),linear-gradient(0deg,rgba(3,4,5,.85),transparent 32%),linear-gradient(180deg,rgba(3,4,5,.12),transparent 25%); }
.hero-inner { position:relative; min-height:inherit; display:flex; flex-direction:column; justify-content:center; padding-top:72px; padding-bottom:25px; }
.hero-copy { width:min(730px,72%); padding-bottom:35px; }
.eyebrow { display:flex; align-items:center; gap:15px; margin:0 0 32px; text-transform:uppercase; color:var(--gold-bright); font-size:11px; font-weight:800; letter-spacing:.23em; }
.gold-line { display:inline-block; width:39px; height:2px; background:var(--gold-bright); flex:none; }
h1,h2,h3,p { margin-top:0; }
h1,h2 { font-family:var(--display); font-weight:900; text-transform:uppercase; letter-spacing:.012em; }
.hero h1 { font-size:clamp(59px,7.5vw,114px); line-height:.94; margin:0 0 30px; text-wrap:balance; text-shadow:0 3px 20px rgba(0,0,0,.14); }
.hero h1 span { color:var(--white); }
.hero-lead { color:#e1e0df; font-size:clamp(16px,1.4vw,20px); max-width:510px; line-height:1.6; margin-bottom:32px; }
.hero-actions { display:flex; align-items:center; gap:32px; flex-wrap:wrap; }
.button { display:inline-flex; align-items:center; justify-content:space-between; gap:27px; min-height:52px; padding:0 22px; text-transform:uppercase; font-size:11px; font-weight:850; letter-spacing:.15em; transition:background .2s,color .2s,transform .2s,border-color .2s; cursor:pointer; border-radius:0; }
.button:hover { transform:translateY(-2px); }
.button-gold { color:#0c0c0c; background:var(--gold-bright); border:1px solid var(--gold-bright); }
.button-gold:hover { background:#fff1cb; border-color:#fff1cb; }
.text-link { text-transform:uppercase; font-size:11px; font-weight:800; letter-spacing:.15em; border-bottom:1px solid rgba(255,255,255,.6); padding-bottom:6px; }
.text-link span { margin-left:10px; color:var(--gold-bright); }
.hero-bottom { margin-top:auto; display:flex; justify-content:space-between; color:#cdcbc6; letter-spacing:.24em; font-size:9px; font-weight:700; }
.section-pad { padding:clamp(70px,8vw,124px) 0; }
.latest { background:#0a0b0c; border-top:1px solid var(--line); }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:34px; }
.section-heading .eyebrow,.about .eyebrow { margin-bottom:18px; }
.section-heading h2,.about h2 { font-size:clamp(48px,5.6vw,82px); line-height:.98; margin:0 0 17px; }
.period { color:var(--gold-bright); }
.section-intro { max-width:530px; color:var(--muted); line-height:1.65; margin:0; font-size:15px; }
.social-links { display:flex; flex-wrap:wrap; gap:20px; align-items:center; }
.social-handle { display:inline-flex; gap:10px; align-items:center; flex:none; margin-bottom:7px; padding-bottom:8px; border-bottom:1px solid var(--gold); text-transform:uppercase; font-size:11px; font-weight:800; letter-spacing:.12em; }
.social-handle svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.7px; }
.social-handle .ig-dot { fill:currentColor; stroke:none; }
.social-handle span { color:var(--gold-bright); }
.feed-meta { min-height:34px; display:flex; flex-wrap:wrap; align-items:center; gap:9px 18px; margin-bottom:14px; color:#898b8b; font-size:11px; line-height:1.45; }
.feed-status { display:inline-flex; align-items:center; gap:7px; color:#dedbd2; font-weight:750; text-transform:uppercase; letter-spacing:.14em; white-space:nowrap; }
.status-dot { width:6px; height:6px; background:var(--gold-bright); border-radius:50%; }
.feed-status.is-live .status-dot { background:#7bd58e; }
.carousel-shell { position:relative; }
.carousel { display:grid; grid-auto-columns:calc((100% - 42px)/3); grid-auto-flow:column; gap:21px; overflow-x:auto; overscroll-behavior-inline:contain; scroll-snap-type:x mandatory; scrollbar-width:none; padding-bottom:3px; }
.carousel::-webkit-scrollbar { display:none; }
.photo-card { display:block; position:relative; overflow:hidden; background:var(--panel); min-width:0; aspect-ratio:3/3.9; scroll-snap-align:start; }
.photo-card-image { position:absolute; inset:0; display:block; background-position:center; background-size:cover; transition:transform .45s ease; }
.photo-card:hover .photo-card-image { transform:scale(1.055); }
.sample-photo { background-image:url('assets/sample-sports.png'); background-size:auto 200%; }
.pos-a { background-position:0 0; }.pos-b { background-position:100% 0; }.pos-c { background-position:0 100%; }.pos-d { background-position:100% 100%; }
.photo-card::after { content:""; position:absolute; inset:25% 0 0; background:linear-gradient(0deg,rgba(0,0,0,.92),rgba(0,0,0,.34) 45%,transparent 85%); pointer-events:none; }
.photo-card-info { position:absolute; z-index:2; left:23px; right:23px; bottom:22px; display:flex; flex-direction:column; align-items:start; gap:8px; }
.photo-tag { color:var(--gold-bright); font-size:10px; letter-spacing:.18em; font-weight:850; }
.photo-card-info strong { font-family:var(--display); font-size:clamp(27px,2.8vw,42px); font-weight:900; line-height:1.02; text-transform:uppercase; letter-spacing:.025em; }
.photo-card-info > span:last-child { margin-top:4px; color:#d6d3cb; font-size:9px; font-weight:750; letter-spacing:.16em; }
.carousel-controls { position:absolute; right:15px; top:14px; display:flex; gap:8px; z-index:5; }
.carousel-controls button { width:38px; height:38px; border:1px solid rgba(255,255,255,.38); background:rgba(0,0,0,.58); color:#fff; cursor:pointer; font-size:18px; transition:background .2s,border-color .2s; }
.carousel-controls button:hover { background:var(--gold); border-color:var(--gold); color:#111; }
.latest-bottom { display:flex; justify-content:space-between; gap:20px; border-top:1px solid var(--line); margin-top:38px; padding-top:25px; color:#8f8f8b; font-size:10px; letter-spacing:.18em; font-weight:750; }
.latest-bottom a { color:var(--white); text-transform:uppercase; }
.latest-bottom a span { color:var(--gold-bright); margin-left:8px; }
.latest-bottom > div { display:flex; gap:22px; }
.about { background:#161718; position:relative; overflow:hidden; }
.about::before { content:""; position:absolute; inset:0; pointer-events:none; opacity:.35; background:radial-gradient(circle at 83% 23%,rgba(212,168,74,.09),transparent 28%),linear-gradient(120deg,transparent 65%,rgba(255,255,255,.025) 65.1%,transparent 65.3%); }
.about-grid { position:relative; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); align-items:center; gap:clamp(45px,7vw,110px); }
.about h2 { font-size:clamp(48px,5.5vw,76px); margin-bottom:26px; }
.about h2 span { color:var(--gold-bright); }
.about-copy > p:not(.eyebrow) { color:#c7c5c1; max-width:575px; font-size:16px; line-height:1.75; margin-bottom:17px; }
.contact { margin-top:48px; border-top:1px solid rgba(255,255,255,.2); padding-top:32px; }
.contact-label { display:block; color:var(--gold-bright); font-size:10px; font-weight:850; letter-spacing:.21em; margin-bottom:12px; }
.contact h3 { font-family:var(--display); text-transform:uppercase; font-size:32px; font-weight:800; letter-spacing:.035em; margin-bottom:8px; }
.contact p { color:var(--muted); line-height:1.5; font-size:14px; margin-bottom:22px; }
.contact-actions { display:flex; align-items:center; flex-wrap:wrap; gap:23px; }
.button-outline { border:1px solid var(--gold); background:transparent; color:var(--white); }
.button-outline:hover { background:var(--gold); color:#111; }
.contact-secondary { font-size:11px; font-weight:750; text-transform:uppercase; letter-spacing:.14em; border-bottom:1px solid #8d8d8d; padding-bottom:7px; }
.contact-email { display:inline-block; margin-top:20px; color:#dedbd4; font-size:13px; text-decoration:underline; text-decoration-color:var(--gold); text-underline-offset:4px; overflow-wrap:anywhere; }
.about-visual { align-self:stretch; min-height:550px; display:flex; flex-direction:column; justify-content:center; }
.about-visual img { display:block; width:100%; height:410px; object-fit:contain; background:#090a0a; border:1px solid var(--line); }
.visual-caption { display:flex; justify-content:space-between; gap:15px; padding-top:13px; color:#888; font-size:9px; letter-spacing:.18em; font-weight:700; }
.site-footer { background:#08090a; border-top:1px solid var(--line); }
.footer-inner { min-height:91px; display:flex; align-items:center; justify-content:space-between; gap:20px; color:#8f8f8c; font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.footer-brand { color:var(--white); font-family:Arial,Helvetica,sans-serif; font-size:29px; font-weight:900; letter-spacing:-.12em; }
.footer-brand span { color:var(--gold-bright); letter-spacing:0; }
.footer-inner > a:last-child { color:var(--white); }
@media (max-width:850px) {
  .hero { min-height:670px; }
  .hero-copy { width:min(680px,90%); }
  .hero-shade { background:linear-gradient(90deg,rgba(4,5,6,.94),rgba(4,5,6,.66) 60%,rgba(4,5,6,.25)),linear-gradient(0deg,rgba(3,4,5,.85),transparent 35%); }
  .section-heading { align-items:start; flex-direction:column; }
  .carousel { grid-auto-columns:calc((100% - 18px)/2); gap:18px; }
  .about-grid { grid-template-columns:1fr; gap:42px; }
  .about-visual { min-height:0; }
  .about-visual img { height:auto; aspect-ratio:1942/809; }
}
@media (max-width:640px) {
  .header-inner { min-height:68px; }
  .brand { width:155px; }
  .menu-toggle { display:flex; flex-direction:column; justify-content:center; gap:6px; width:42px; height:42px; border:1px solid var(--line); background:transparent; padding:10px; }
  .menu-toggle span { height:2px; width:100%; background:var(--white); }
  .site-nav { display:none; position:absolute; top:68px; left:0; right:0; padding:25px 22px 28px; background:#090a0b; border-bottom:1px solid var(--line); flex-direction:column; align-items:start; gap:25px; }
  .site-nav.is-open { display:flex; }
  .site-nav a.nav-active::after { bottom:-7px; }
  .hero { min-height:calc(100svh - 68px); max-height:850px; }
  .hero-image { background-image:url('assets/wsm-mosaic-mobile.jpg'); background-size:cover; background-position:center top; }
  .hero-shade { background:linear-gradient(0deg,rgba(4,5,6,.96) 0%,rgba(4,5,6,.77) 51%,rgba(4,5,6,.33) 100%); }
  .hero-inner { justify-content:end; padding-top:70px; padding-bottom:26px; }
  .hero-copy { width:100%; padding-bottom:40px; }
  .eyebrow { font-size:9px; gap:10px; letter-spacing:.19em; margin-bottom:24px; }
  .gold-line { width:24px; }
  .hero h1 { font-size:clamp(53px,13.5vw,80px); line-height:.98; margin-bottom:20px; }
  .hero-lead { font-size:15px; line-height:1.55; margin-bottom:25px; max-width:380px; }
  .hero-actions { gap:23px; }
  .button { min-height:50px; }
  .hero-bottom { font-size:7px; letter-spacing:.15em; }
  .hero-bottom span:last-child { display:none; }
  .section-heading h2,.about h2 { font-size:clamp(44px,11vw,66px); }
  .section-intro { font-size:14px; }
  .social-handle { margin-top:4px; }
  .feed-meta { font-size:10px; }
  .carousel { grid-auto-columns:80%; gap:13px; margin-right:-22px; padding-right:22px; }
  .photo-card { aspect-ratio:3/3.7; }
  .photo-card-info strong { font-size:38px; }
  .latest-bottom { flex-direction:column; gap:13px; font-size:9px; }
  .latest-bottom > div { gap:18px; }
  .contact { margin-top:32px; }
  .contact h3 { font-size:29px; }
  .about-visual img { aspect-ratio:1942/809; }
  .footer-inner { padding-top:22px; padding-bottom:22px; flex-wrap:wrap; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms !important; animation-duration:.01ms !important; } }

/* Version 1.7: retain the bold left-aligned composition, balance its placement. */
.header-inner, .hero-inner { max-width:1760px; padding-left:clamp(22px,5vw,96px); padding-right:clamp(22px,5vw,96px); }
.header-inner { min-height:106px; }
.brand { width:clamp(200px,19vw,285px); }
.hero { min-height:740px; max-height:none; }
.hero-image { background-size:cover; background-position:center; }
.hero-inner { width:100%; min-height:740px; padding-top:60px; padding-bottom:28px; }
.hero-copy { width:100%; max-width:850px; padding-bottom:35px; }
.hero h1 { font-size:clamp(62px,6.3vw,104px); line-height:.97; text-wrap:initial; }
.hero h1 span { white-space:nowrap; }
.hero-lead { max-width:530px; }
@media (max-width:850px) {
  .hero, .hero-inner { min-height:690px; }
  .hero-copy { max-width:100%; }
  .hero h1 { font-size:clamp(54px,9vw,76px); }
}
@media (max-width:640px) {
  .header-inner { min-height:84px; }
  .brand { width:200px; }
  .site-nav { top:84px; }
  .hero, .hero-inner { min-height:660px; }
  .hero-inner { padding-top:50px; padding-bottom:25px; }
  .hero-image { background-position:center top; }
  .hero-copy { width:100%; padding-bottom:35px; }
  .hero h1 { font-size:clamp(40px,10.5vw,66px); }
}

/* Version 1.8: consistent edge spacing and a darker text backdrop. */
.header-inner, .hero-inner { max-width:none; padding-left:clamp(22px,2.5vw,48px); padding-right:clamp(22px,2.5vw,48px); }
.hero-shade { background:linear-gradient(90deg,rgba(0,0,0,.99) 0%,rgba(0,0,0,.96) 24%,rgba(0,0,0,.88) 40%,rgba(0,0,0,.54) 57%,rgba(0,0,0,.12) 78%,rgba(0,0,0,.06) 100%),linear-gradient(0deg,rgba(0,0,0,.80),transparent 35%); }
.hero-copy { max-width:min(850px,100%); }
@media (min-width:641px) and (max-width:1100px) {
  .hero h1 { font-size:clamp(54px,7.4vw,81px); }
  .hero-shade { background:linear-gradient(90deg,rgba(0,0,0,.98),rgba(0,0,0,.91) 40%,rgba(0,0,0,.65) 65%,rgba(0,0,0,.22)),linear-gradient(0deg,rgba(0,0,0,.8),transparent 40%); }
}
@media (max-width:640px) {
  .hero-shade { background:linear-gradient(90deg,rgba(0,0,0,.91),rgba(0,0,0,.77) 70%,rgba(0,0,0,.60)),linear-gradient(0deg,rgba(0,0,0,.90),transparent 45%); }
  .hero-inner { justify-content:flex-start; }
  .hero-copy { padding-bottom:35px; }
  .hero h1 { font-size:clamp(40px,10.5vw,66px); }
  .hero-actions { align-items:flex-start; }
}