:root { --ink:#0f1923; --navy:#1b3a5c; --navy-deep:#102942; --gold:#e8a838; --paper:#f5f7fa; --line:#dfe5eb; --muted:#637080; --white:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"IBM Plex Sans","Segoe UI",Arial,sans-serif; }
button,select { font:inherit; }
a { color:inherit; }
.shell { width:min(1180px,calc(100% - 40px)); margin:0 auto; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.topbar { background:var(--ink); color:rgba(255,255,255,.8); font-size:12px; }
.topbar-inner { min-height:34px; display:flex; align-items:center; gap:22px; }
.topbar-note { margin-left:auto; }
.site-header { position:sticky; top:0; z-index:20; background:rgba(255,255,255,.97); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
.header-inner { min-height:72px; display:flex; align-items:center; gap:28px; }
.brand { display:inline-flex; align-items:center; gap:11px; color:var(--navy); text-decoration:none; }
.brand img { width:44px; height:44px; }
.brand span { display:grid; }
.brand strong { font-size:19px; letter-spacing:.08em; }
.brand small { color:var(--muted); font-size:10px; letter-spacing:.13em; text-transform:uppercase; }
nav { display:flex; align-items:center; gap:28px; margin-left:auto; }
nav a { color:#344252; text-decoration:none; font-size:14px; font-weight:700; }
nav a:hover,nav a[aria-current="page"] { color:#b57b18; }
.language-control select { border:1px solid var(--line); border-radius:3px; background:#fff; color:var(--navy); padding:8px 9px; font-weight:700; }

.gallery-hero { min-height:430px; display:grid; align-items:end; color:#fff; background:linear-gradient(90deg,rgba(15,25,35,.92) 0%,rgba(15,25,35,.7) 52%,rgba(15,25,35,.18) 100%),url('/images/gallery/shipping-featured.webp') center/cover no-repeat; }
.hero-content { padding-bottom:62px; }
.eyebrow,.section-label { margin:0 0 12px; color:var(--gold); font-size:12px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.gallery-hero h1 { max-width:720px; margin:0; font-size:clamp(38px,5.2vw,64px); line-height:1.03; letter-spacing:-.035em; }
.gallery-hero p:not(.eyebrow) { max-width:650px; margin:22px 0 28px; color:rgba(255,255,255,.8); font-size:17px; line-height:1.7; }
.hero-cta { display:inline-flex; padding:13px 20px; border-radius:3px; background:var(--gold); color:var(--ink); text-decoration:none; font-weight:800; }

.gallery-section { padding:84px 0 96px; }
.story-intro { max-width:760px; margin-bottom:72px; }
.story-intro h2,.gallery-cta h2 { margin:0; color:var(--navy); font-size:clamp(30px,4vw,48px); line-height:1.1; letter-spacing:-.025em; }
.story-intro p:not(.section-label) { margin:16px 0 0; color:var(--muted); line-height:1.75; }
.story-group + .story-group { margin-top:86px; }
.story-heading { display:grid; grid-template-columns:54px 1fr; gap:22px; align-items:start; margin-bottom:28px; padding-top:22px; border-top:1px solid #ccd5de; }
.story-heading > span { color:var(--gold); font-size:14px; font-weight:800; letter-spacing:.12em; }
.story-heading h3 { margin:0; color:var(--navy); font-size:26px; letter-spacing:-.015em; }
.story-heading p { max-width:650px; margin:7px 0 0; color:var(--muted); line-height:1.65; }
.gallery-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px; }
.gallery-card { margin:0; overflow:hidden; border:1px solid var(--line); border-radius:4px; background:#fff; transition:border-color .2s ease; }
.gallery-card:hover { border-color:#b7c2cc; }
.gallery-open { position:relative; width:100%; padding:0; display:block; border:0; background:#e7ecf0; cursor:zoom-in; overflow:hidden; }
.gallery-open img { width:100%; height:auto; aspect-ratio:4/3; display:block; object-fit:cover; object-position:center; transition:transform .3s ease; }
.gallery-open:hover img { transform:scale(1.018); }
.zoom-label { position:absolute; left:14px; top:14px; min-width:30px; height:30px; display:grid; place-items:center; border-radius:50%; background:rgba(15,25,35,.78); color:#fff; font-size:11px; font-weight:800; }
.gallery-card figcaption { min-height:78px; padding:16px 18px; display:grid; align-content:center; gap:5px; border-top:1px solid var(--line); }
.gallery-card figcaption span { color:var(--navy); font-size:14px; font-weight:800; line-height:1.35; }
.gallery-card time { color:var(--muted); font-size:11px; letter-spacing:.05em; text-transform:uppercase; }
.gallery-card-featured { grid-column:1/-1; }
.gallery-card-featured .gallery-open img { aspect-ratio:16/7; }
.gallery-grid-two .gallery-open img { aspect-ratio:3/2; }
.confidentiality-note { margin-top:64px; padding:24px 28px; display:grid; grid-template-columns:240px 1fr; gap:26px; border-left:3px solid var(--gold); background:#fff; }
.confidentiality-note strong { color:var(--navy); }
.confidentiality-note p { margin:0; color:var(--muted); line-height:1.7; }

.gallery-cta { padding:68px 0; background:var(--navy-deep); color:#fff; }
.cta-inner { display:flex; align-items:center; justify-content:space-between; gap:40px; }
.gallery-cta h2 { max-width:760px; color:#fff; }
.gallery-cta p:not(.section-label) { margin:15px 0 0; color:rgba(255,255,255,.68); }
.gallery-cta a { flex:0 0 auto; padding:14px 22px; border-radius:3px; background:var(--gold); color:var(--ink); text-decoration:none; font-weight:800; }
footer { background:var(--ink); color:rgba(255,255,255,.62); }
.footer-inner { min-height:76px; display:flex; align-items:center; justify-content:space-between; font-size:12px; }

.lightbox { width:min(920px,calc(100% - 32px)); max-height:calc(100vh - 32px); padding:0; border:0; border-radius:6px; overflow:hidden; background:var(--ink); color:#fff; box-shadow:0 24px 80px rgba(0,0,0,.45); }
.lightbox::backdrop { background:rgba(6,11,16,.82); backdrop-filter:blur(3px); }
.lightbox img { width:100%; max-height:76vh; display:block; object-fit:contain; background:#080d12; }
.lightbox-close { position:absolute; top:12px; right:12px; z-index:2; width:40px; height:40px; border:1px solid rgba(255,255,255,.25); border-radius:50%; background:rgba(15,25,35,.78); color:#fff; cursor:pointer; font-size:26px; line-height:1; }
.lightbox-copy { padding:16px 20px; display:flex; justify-content:space-between; gap:20px; }
.lightbox-copy span { color:rgba(255,255,255,.62); font-size:12px; }

@media (max-width:700px) {
  .shell { width:min(100% - 28px,1180px); }
  .topbar-note { display:none; }
  .header-inner { min-height:66px; gap:14px; }
  .brand img { width:38px; height:38px; }
  .brand small { display:none; }
  nav { display:none; }
  .language-control { margin-left:auto; }
  .gallery-hero { min-height:420px; background-position:58% center; }
  .hero-content { padding-bottom:46px; }
  .gallery-hero h1 { font-size:40px; }
  .gallery-section { padding:62px 0 72px; }
  .story-intro { margin-bottom:52px; }
  .story-group + .story-group { margin-top:62px; }
  .story-heading { grid-template-columns:38px 1fr; gap:12px; }
  .story-heading h3 { font-size:22px; }
  .gallery-grid { grid-template-columns:1fr; gap:18px; }
  .gallery-card-featured { grid-column:auto; }
  .gallery-card-featured .gallery-open img,.gallery-grid-two .gallery-open img,.gallery-open img { aspect-ratio:4/3; }
  .confidentiality-note { grid-template-columns:1fr; gap:10px; margin-top:48px; }
  .cta-inner { align-items:flex-start; flex-direction:column; }
}
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; transition:none!important; } }
