/* ===========================================================================
   Blachonix — "Terminal Widokowy".
   Arkusz przeniesiony 1:1 z aplikacji React (client/src/index.css,
   public-pages.css, gallery.css, contact.css, watermark-logo.css).
   Usunięte: import Tailwinda (strony publiczne go nie używają) oraz blok
   @theme inline — zmienne fontów są zadeklarowane niżej wprost w :root.
   Czcionki wczytuje HTML nieblokująco, dlatego nie ma tu @import.
   =========================================================================== */
:root{
  --font-display:"Space Grotesk",'Segoe UI',Arial,sans-serif;
  --font-body:Manrope,'Segoe UI',Arial,sans-serif;
  --font-mono:"DM Mono",ui-monospace,Consolas,monospace;
}
:root {
  --ink: #111719;
  --ink-soft: #202a2b;
  --mist: #eff0eb;
  --mist-deep: #dfe2dc;
  --paper: #f7f7f3;
  --red: #ff4e2f;
  --cyan: #b7dce0;
  --line-dark: rgba(17, 23, 25, 0.22);
  --line-light: rgba(247, 247, 243, 0.25);
  --background: var(--mist);
  --foreground: var(--ink);
  --primary: var(--red);
  --primary-foreground: #ffffff;
  --border: rgba(17, 23, 25, 0.17);
  --radius: 0;
  /* Wariant wermilionu do TEKSTU na jasnym tle: 4,85:1 na --mist, 4,72:1 na --paper. */
  --red-ink: #c62d10;
  /* Akcent dobierany do tła: sekcje ciemne nadpisują go niżej na jasny wermilion. */
  --accent: var(--red-ink);
}

.hero, .about-section, .services-hero, .services-process, .public-hero, .public-cta,
.gallery-page-hero, .contact-card-primary, .service-card, .album-directory-card,
.managed-album-card, .section-index.light, .site-header, .lightbox { --accent: var(--red); }

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ink); }
body { margin: 0; background: var(--mist); color: var(--ink); font-family: var(--font-body); overflow-x: hidden; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
button:focus-visible, a:focus-visible { outline: 2px solid var(--red); outline-offset: 4px; }

.terminal-shell { overflow: clip; background: var(--mist); }
.site-header { position: absolute; z-index: 20; top: 0; left: 0; width: 100%; height: 84px; display: flex; align-items: center; justify-content: space-between; padding: 0 3.2vw; color: #fff; border-bottom: 1px solid rgba(255,255,255,.22); }
.brand { display: inline-flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; }
.brand-mark { width: 39px; height: 39px; object-fit: contain; }
.brand-wordmark, .footer-brand span { font: 600 15px/1 var(--font-display); letter-spacing: .12em; }
.main-nav { display: flex; gap: 30px; align-items: center; }
.main-nav button, .main-nav a { border: 0; background: transparent; color: inherit; font: 500 10px/1 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; text-decoration: none; padding: 8px 0; transition: opacity .18s var(--ease-out, ease-out); }
.main-nav button:hover, .main-nav a:hover { opacity: .64; }
.main-nav span { color: var(--red); margin-right: 7px; }
.header-cta { display: flex; align-items: center; gap: 8px; color: var(--ink); background: var(--mist); padding: 11px 15px 11px 17px; border: 0; font: 600 10px/1 var(--font-mono); text-transform: uppercase; letter-spacing: .06em; cursor: pointer; transition: transform .18s cubic-bezier(.23,1,.32,1), background .18s; }
.header-cta:hover { transform: translateY(-2px); background: #fff; }
.header-cta:active, .filter-chip:active, .gallery-image-button:active { transform: scale(.97); }
.menu-button { display: none; color: #fff; border: 0; background: transparent; }

.hero { position: relative; min-height: 760px; height: 100svh; isolation: isolate; display: flex; align-items: flex-end; color: #fff; }
.hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 61% 50%; z-index: -3; }
.hero-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(6,13,15,.88) 0%, rgba(6,13,15,.55) 35%, rgba(6,13,15,.1) 74%), linear-gradient(0deg, rgba(6,13,15,.56) 0%, transparent 42%); }
.hero-grid { position: absolute; inset: 0; z-index: -1; opacity: .38; background-image: linear-gradient(90deg, transparent 0, transparent calc(25% - .5px), rgba(255,255,255,.26) 25%, transparent calc(25% + .5px), transparent calc(50% - .5px), rgba(255,255,255,.22) 50%, transparent calc(50% + .5px)), linear-gradient(0deg, transparent 0, transparent calc(33.333% - .5px), rgba(255,255,255,.18) 33.333%, transparent calc(33.333% + .5px)); }
.hero-content { width: min(1120px, 100%); margin: 0 12vw 13vh; }
.eyebrow { margin: 0 0 23px; display: flex; align-items: center; gap: 8px; font: 500 10px/1.2 var(--font-mono); letter-spacing: .13em; text-transform: uppercase; color: rgba(17,23,25,.66); }
.eyebrow.inverse { color: rgba(255,255,255,.78); }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 4px rgba(255,78,47,.14); flex: 0 0 auto; }
.status-dot.dark { box-shadow: 0 0 0 4px rgba(255,78,47,.15); }
.hero h1, .gallery-heading h2, .about-copy h2, .contact-main h2 { margin: 0; font-family: var(--font-display); font-weight: 600; letter-spacing: -.065em; line-height: .86; }
.hero h1 { max-width: 720px; font-size: clamp(65px, 8.3vw, 136px); text-wrap: balance; }
h1 em, h2 em { color: var(--accent); font-style: normal; font-weight: 400; }
.hero-bottom { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; margin-top: 34px; max-width: 860px; }
.hero-bottom p { max-width: 390px; margin: 0; color: rgba(255,255,255,.82); font-size: 14px; line-height: 1.7; }
.play-reel { padding: 0; border: 0; background: transparent; color: #fff; display: flex; align-items: center; gap: 11px; font: 500 10px/1 var(--font-mono); text-transform: uppercase; letter-spacing: .1em; cursor: pointer; }
.play-disc { width: 37px; height: 37px; display: grid; place-items: center; border-radius: 50%; background: var(--red); transition: transform .2s cubic-bezier(.23,1,.32,1); }
.play-reel:hover .play-disc { transform: rotate(20deg) scale(1.08); }
.hero-coordinate { position: absolute; right: 3.2vw; bottom: 30px; display: flex; gap: 14px; font: 10px/1 var(--font-mono); letter-spacing: .06em; color: rgba(255,255,255,.58); }
.scroll-cue { position: absolute; right: 3.2vw; bottom: 84px; display: grid; place-items: center; width: 41px; height: 41px; border-radius: 50%; color: #fff; background: transparent; border: 1px solid rgba(255,255,255,.5); cursor: pointer; animation: cue-bob 1.9s cubic-bezier(.77,0,.175,1) infinite; }
@keyframes cue-bob { 0%,100% { transform: translateY(0); } 48% { transform: translateY(8px); } }

.gallery-section { position: relative; display: grid; grid-template-columns: 18vw 1fr; min-height: 1000px; padding: 155px 5.2vw 140px 3.2vw; background: var(--mist); }
.section-index { padding-top: 3px; display: flex; align-items: flex-start; gap: 12px; height: max-content; color: var(--ink); font: 500 10px/1 var(--font-mono); letter-spacing: .11em; }
.index-number { color: var(--accent); }
.index-line { display: block; margin-top: 5px; width: min(4vw, 50px); height: 1px; background: currentColor; opacity: .55; }
.index-label { writing-mode: vertical-rl; margin-top: 16px; }
.gallery-main { min-width: 0; }
.gallery-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 48px; padding-bottom: 67px; border-bottom: 1px solid var(--line-dark); }
.gallery-heading h2, .about-copy h2, .contact-main h2 { font-size: clamp(58px, 7vw, 108px); color: var(--ink); }
.gallery-intro { width: min(330px, 35%); margin: 0 0 5px; font-size: 14px; line-height: 1.7; color: rgba(17,23,25,.68); }
.filter-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; padding: 27px 0 38px; }
.filter-chip { border: 1px solid rgba(17,23,25,.25); background: transparent; color: var(--ink); padding: 10px 12px; font: 500 10px/1 var(--font-mono); letter-spacing: .04em; text-transform: uppercase; cursor: pointer; transition: color .18s, background .18s, transform .18s; }
.filter-chip:hover, .filter-chip.active { color: #fff; background: var(--ink); border-color: var(--ink); }
.image-count { margin-left: auto; font: 500 11px/1 var(--font-mono); color: rgba(17,23,25,.52); }
.gallery-grid { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: 20px; row-gap: 58px; align-items: start; }
.gallery-card { min-width: 0; }
.gallery-card.card-1, .gallery-card.card-3 { grid-column: span 8; }
.gallery-card.card-2, .gallery-card.card-4 { grid-column: span 4; }
.gallery-card.card-5, .gallery-card.card-6, .gallery-card.card-7, .gallery-card.card-8 { grid-column: span 3; }
.gallery-card.card-1 { margin-top: 29px; }.gallery-card.card-2 { margin-top: 0; }.gallery-card.card-3 { margin-top: 26px; }.gallery-card.card-4 { margin-top: -40px; }.gallery-card.card-5 { margin-top: 0; }.gallery-card.card-6 { margin-top: 37px; }.gallery-card.card-7 { margin-top: -10px; }.gallery-card.card-8 { margin-top: 52px; }
.gallery-image-button { position: relative; display: block; width: 100%; padding: 0; overflow: hidden; border: 0; color: #fff; background: var(--ink); cursor: zoom-in; text-align: left; }
.wide .gallery-image-button { aspect-ratio: 1.58 / 1; }.tall .gallery-image-button { aspect-ratio: .79 / 1; }.square .gallery-image-button { aspect-ratio: 1 / 1; }
.gallery-image-button img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .54s cubic-bezier(.23,1,.32,1), filter .54s; }
.gallery-image-button:hover img { transform: scale(1.045); filter: saturate(.9) contrast(1.04); }
.image-gradient { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(7,12,14,.64) 0%, transparent 44%); pointer-events: none; }
.card-meta-top { position: absolute; top: 13px; left: 14px; font: 10px/1 var(--font-mono); letter-spacing: .08em; color: rgba(255,255,255,.84); }
.expand-control { position: absolute; right: 13px; top: 13px; width: 31px; height: 31px; display: grid; place-items: center; background: rgba(17,23,25,.64); opacity: 0; transform: translateY(-6px); transition: opacity .2s, transform .2s cubic-bezier(.23,1,.32,1); }
.gallery-image-button:hover .expand-control { opacity: 1; transform: translateY(0); }
.card-footer { display: flex; justify-content: space-between; gap: 16px; padding-top: 13px; }
.origin-label { display: block; margin-bottom: 7px; font: 500 9px/1 var(--font-mono); color: var(--accent); letter-spacing: .09em; text-transform: uppercase; }
.card-footer h3 { margin: 0; font: 500 18px/1.1 var(--font-display); letter-spacing: -.045em; }.card-subtitle { max-width: 120px; padding-top: 5px; font: 400 10px/1.4 var(--font-mono); color: rgba(17,23,25,.58); text-align: right; }

.about-section { display: grid; grid-template-columns: 18vw minmax(0, 1fr) minmax(280px, .72fr); gap: 0; position: relative; min-height: 750px; padding: 135px 5.2vw 110px 3.2vw; overflow: hidden; background: var(--ink); color: var(--mist); }
.section-index.light { color: var(--mist); }.about-copy { position: relative; z-index: 1; }.about-copy h2 { color: var(--mist); max-width: 850px; }.about-copy h2 em { color: var(--cyan); }.about-lead { width: min(540px, 85%); margin: 36px 0 72px; font-size: 16px; line-height: 1.8; color: rgba(239,240,235,.76); }.about-facts { display: flex; gap: 45px; }.about-facts > div { display: flex; gap: 10px; align-items: baseline; }.about-facts strong { font: 500 12px/1 var(--font-mono); color: var(--red); }.about-facts span { font-size: 12px; line-height: 1.35; color: rgba(239,240,235,.67); }
.about-graphic { position: relative; align-self: center; justify-self: end; width: min(31vw, 430px); aspect-ratio: 1; border: 1px solid var(--line-light); border-radius: 50%; display: grid; place-items: center; overflow: visible; }.orbit { position: absolute; display: block; z-index: 2; border: 1px solid var(--line-light); border-radius: 50%; }.orbit-one { inset: 12%; }.orbit-two { inset: 31%; border-color: rgba(183,220,224,.55); }.signal-core { position: relative; z-index: 5; width: 10px; height: 10px; background: var(--red); border-radius: 50%; box-shadow: 0 0 0 14px rgba(255,78,47,.1), 0 0 0 42px rgba(255,78,47,.045); animation: radar-pulse 2.25s ease-out infinite; }.about-graphic p { position: absolute; z-index: 6; left: -25px; bottom: 15%; margin: 0; padding: 6px; background: var(--ink); font: 10px/1.6 var(--font-mono); letter-spacing: .08em; color: rgba(239,240,235,.63); }
.radar-display { isolation: isolate; background: radial-gradient(circle at center, rgba(255,78,47,.07) 0 13%, transparent 14% 100%); }.radar-grid { position: absolute; z-index: 1; inset: 0; overflow: hidden; border-radius: inherit; opacity: .42; background: repeating-linear-gradient(0deg, transparent 0 24px, rgba(183,220,224,.12) 25px), repeating-linear-gradient(90deg, transparent 0 24px, rgba(183,220,224,.1) 25px); mask-image: radial-gradient(circle, #000 0 58%, transparent 87%); }.radar-sweep { position: absolute; z-index: 3; inset: -1px; border-radius: 50%; background: conic-gradient(from 215deg, rgba(183,220,224,.42), rgba(183,220,224,.14) 12deg, transparent 43deg 360deg); animation: radar-rotate 4.8s linear infinite; mix-blend-mode: screen; }.radar-arm { position: absolute; z-index: 4; top: 50%; left: 50%; width: 47%; height: 1px; transform-origin: left center; background: linear-gradient(90deg, rgba(183,220,224,.9), rgba(183,220,224,.08)); box-shadow: 0 0 10px rgba(183,220,224,.25); animation: radar-arm-rotate 4.8s linear infinite; }.radar-contact { position: absolute; z-index: 5; width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 0 4px rgba(183,220,224,.1), 0 0 10px rgba(183,220,224,.75); animation: radar-contact-flash 4.8s linear infinite; }.contact-north { top: 21%; left: 55%; animation-delay: .45s; }.contact-east { top: 55%; right: 16%; animation-delay: 1.8s; }.contact-south { bottom: 17%; left: 35%; animation-delay: 3.4s; }.radar-display::after { content: ""; position: absolute; z-index: 2; inset: 50% 0 auto; height: 1px; background: rgba(183,220,224,.22); }.radar-display::before { content: ""; position: absolute; z-index: 2; inset: 0 auto 0 50%; width: 1px; background: rgba(183,220,224,.22); }.radar-display .orbit { pointer-events: none; }.radar-display p { box-shadow: 0 0 0 8px var(--ink); }.radar-display:hover .radar-sweep, .radar-display:hover .radar-arm { animation-duration: 3.2s; }@keyframes radar-rotate { to { transform: rotate(360deg); } }@keyframes radar-arm-rotate { to { transform: rotate(360deg); } }@keyframes radar-pulse { 0%, 100% { box-shadow: 0 0 0 14px rgba(255,78,47,.1), 0 0 0 42px rgba(255,78,47,.045); } 50% { box-shadow: 0 0 0 20px rgba(255,78,47,.08), 0 0 0 58px rgba(255,78,47,.015); } }@keyframes radar-contact-flash { 0%, 15%, 100% { opacity: .25; transform: scale(.72); } 19%, 26% { opacity: 1; transform: scale(1.35); } 30% { opacity: .55; transform: scale(1); } }

.contact-section { position: relative; display: grid; grid-template-columns: .55fr 1.5fr .55fr; gap: 30px; align-items: end; padding: 120px 5.2vw 47px 3.2vw; min-height: 580px; background: var(--paper); }.contact-section::before { content:""; position:absolute; top: 0; left:0; height: 10px; width: 100%; background: repeating-linear-gradient(90deg, var(--red) 0 12px, transparent 12px 20px); }.contact-kicker { align-self: start; padding-top: 7px; font: 500 10px/1.55 var(--font-mono); letter-spacing: .09em; color: rgba(17,23,25,.58); }.contact-main h2 { margin-bottom: 38px; }.contact-link { display: inline-flex; align-items: center; gap: 14px; color: var(--ink); font: 500 15px/1 var(--font-display); letter-spacing: -.03em; text-decoration: none; padding-bottom: 10px; border-bottom: 1px solid var(--ink); transition: color .2s, border .2s; }.contact-link:hover { color: var(--red); border-color: var(--red); }.contact-info { display: flex; flex-direction: column; gap: 44px; align-items: flex-end; font: 400 10px/1.6 var(--font-mono); color: rgba(17,23,25,.65); }.contact-info > div:first-child { display: flex; align-items: flex-start; gap: 9px; }.socials { display: flex; gap: 7px; }.socials a { display: grid; place-items: center; width: 35px; height: 35px; color: var(--ink); border: 1px solid rgba(17,23,25,.3); transition: color .18s, background .18s; }.socials a:hover { background: var(--ink); color: #fff; }

.managed-albums { padding: 130px 7.5vw 135px; background: var(--paper); border-top: 1px solid var(--line-dark); }.managed-albums-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; padding-bottom: 50px; }.managed-albums-head h2 { margin: 0; font: 600 clamp(52px, 6.6vw, 96px)/.87 var(--font-display); letter-spacing: -.065em; }.managed-albums-head p:last-child { width: min(370px, 36%); margin: 0; color: rgba(17,23,25,.64); font-size: 14px; line-height: 1.7; }.managed-albums-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }.managed-album-card { min-height: 245px; position: relative; display: flex; flex-direction: column; justify-content: flex-end; padding: 22px; background: var(--ink); color: var(--mist); text-decoration: none; overflow: hidden; transition: transform .24s cubic-bezier(.23,1,.32,1), background .24s; }.managed-album-card::before { content:""; position:absolute; inset:-40% 50% auto -20%; height: 150%; border:1px solid rgba(183,220,224,.25); border-radius:50%; transition: transform .4s cubic-bezier(.23,1,.32,1); }.managed-album-card:hover { transform: translateY(-5px); background: #202a2b; }.managed-album-card:hover::before { transform: translate(25px, 18px) scale(1.1); }.managed-album-no, .managed-album-link { position: relative; z-index: 1; font: 500 10px/1 var(--font-mono); letter-spacing: .1em; }.managed-album-no { position: absolute; top: 22px; left: 22px; color: var(--red); }.managed-album-icon { position: absolute; top: 62px; left: 22px; width: 38px; height: 38px; color: var(--cyan); }.managed-album-card h3 { position: relative; z-index:1; max-width: 240px; margin:0 0 16px; font: 500 28px/1 var(--font-display); letter-spacing:-.06em; }.managed-album-link { display:flex; align-items:center; gap:7px; color: rgba(239,240,235,.7); }
.site-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 3.2vw; background: var(--paper); color: rgba(17,23,25,.58); border-top: 1px solid var(--line-dark); font: 500 9px/1 var(--font-mono); letter-spacing: .08em; }.footer-brand { display: flex; align-items: center; gap: 9px; color: var(--ink); }.footer-brand img { width: 24px; height: 24px; }.footer-brand span { font-size: 11px; }.site-footer button { display: flex; align-items:center; gap: 7px; padding: 0; color: var(--ink); border: 0; background: transparent; font: inherit; cursor: pointer; }

.lightbox { position: fixed; z-index: 50; inset: 0; display: grid; place-items: center; padding: 3.5vh 5vw; color: var(--mist); }.lightbox-backdrop { position: absolute; inset: 0; border: 0; background: rgba(4,8,9,.94); cursor: zoom-out; }.lightbox-content { position: relative; width: min(1060px, 100%); max-height: 93vh; animation: lightbox-in .23s cubic-bezier(.23,1,.32,1); }.lightbox-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; font: 10px/1 var(--font-mono); letter-spacing: .1em; }.lightbox-head button, .lightbox-controls button { width: 39px; height: 39px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.32); color: var(--mist); background: transparent; cursor: pointer; transition: background .18s, color .18s; }.lightbox-head button:hover, .lightbox-controls button:hover { background: var(--mist); color: var(--ink); }.lightbox-image-wrap { height: min(70vh, 700px); overflow: hidden; background: #090e0f; }.lightbox-image-wrap img { width: 100%; height: 100%; object-fit: contain; display: block; }.lightbox-foot { display: flex; justify-content: space-between; align-items: flex-end; padding-top: 15px; }.lightbox-foot p, .lightbox-foot span { margin: 0; font: 10px/1.5 var(--font-mono); color: rgba(239,240,235,.63); }.lightbox-foot h3 { margin: 6px 0 4px; font: 500 25px/1 var(--font-display); letter-spacing: -.05em; }.lightbox-controls { display: flex; gap: 7px; }@keyframes lightbox-in { from { opacity: 0; transform: translateY(12px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }

@media (max-width: 900px) { .site-header { height: 70px; padding: 0 20px; }.brand-mark { width: 34px; height: 34px; }.main-nav { position: absolute; top: 69px; left: 0; right: 0; padding: 18px 20px 22px; background: var(--ink); border-top: 1px solid var(--line-light); display: none; flex-direction: column; align-items: flex-start; gap: 17px; }.main-nav.is-open { display: flex; }.main-nav button, .main-nav a { font-size: 11px; }.header-cta { display: none; }.menu-button { display: grid; place-items: center; }.hero { min-height: 700px; }.hero-content { margin: 0 24px 10vh; }.hero h1 { font-size: clamp(58px, 12vw, 94px); }.hero-bottom { align-items: flex-start; flex-direction: column; }.hero-coordinate { display: none; }.scroll-cue { right: 24px; bottom: 28px; }.gallery-section { grid-template-columns: 1fr; padding: 88px 24px; }.section-index { margin-bottom: 54px; }.index-label { writing-mode: initial; margin-top: 0; }.gallery-heading { padding-bottom: 43px; }.gallery-heading h2, .about-copy h2, .contact-main h2 { font-size: clamp(56px, 11vw, 90px); }.gallery-intro { width: 42%; }.gallery-grid { column-gap: 14px; row-gap: 38px; }.gallery-card.card-1, .gallery-card.card-3 { grid-column: span 8; }.gallery-card.card-2, .gallery-card.card-4 { grid-column: span 4; }.gallery-card.card-5, .gallery-card.card-6, .gallery-card.card-7, .gallery-card.card-8 { grid-column: span 3; }.about-section { grid-template-columns: 1fr; padding: 88px 24px; }.about-copy h2 { max-width: 680px; }.about-graphic { width: min(52vw, 350px); margin-top: 58px; justify-self: end; }.contact-section { grid-template-columns: .6fr 1.4fr; padding: 90px 24px 36px; }.contact-info { grid-column: 2; align-items: flex-start; flex-direction: row; justify-content: space-between; }.contact-kicker { grid-column: 1; }.contact-main { grid-column: 2; }.site-footer { padding: 18px 24px; }.footer-brand span { display: none; } }
@media (max-width: 600px) { .brand-wordmark { font-size: 12px; }.hero { min-height: 670px; }.hero-image { object-position: 68% 50%; }.hero-shade { background: linear-gradient(90deg, rgba(6,13,15,.81), rgba(6,13,15,.25)), linear-gradient(0deg, rgba(6,13,15,.7), transparent 48%); }.hero-content { margin-bottom: 94px; }.hero h1 { font-size: clamp(53px, 15.8vw, 75px); }.hero-bottom p { font-size: 12px; line-height: 1.6; max-width: 290px; }.gallery-heading { display: block; }.gallery-intro { width: auto; max-width: 320px; margin: 25px 0 0; font-size: 12px; }.filter-bar { gap: 6px; padding: 24px 0 29px; }.filter-chip { padding: 9px 10px; font-size: 9px; }.image-count { display: none; }.gallery-grid { grid-template-columns: repeat(2, 1fr); row-gap: 34px; }.gallery-card.card-1, .gallery-card.card-3, .gallery-card.card-2, .gallery-card.card-4, .gallery-card.card-5, .gallery-card.card-6, .gallery-card.card-7, .gallery-card.card-8 { grid-column: span 1; margin-top: 0; }.gallery-card.card-1, .gallery-card.card-3 { grid-column: span 2; }.gallery-card.card-2, .gallery-card.card-4 { margin-top: 26px; }.card-footer { display: block; }.card-subtitle { display: block; text-align: left; max-width: 170px; padding-top: 7px; }.expand-control { opacity: 1; transform: none; background: rgba(17,23,25,.43); }.about-lead { width: 100%; margin: 28px 0 42px; font-size: 14px; }.about-facts { flex-wrap: wrap; gap: 23px; }.about-facts > div { width: 40%; }.about-graphic { width: 72vw; }.about-graphic p { left: -5px; bottom: 8%; }.contact-section { display: block; min-height: auto; padding: 77px 24px 30px; }.contact-kicker { margin-bottom: 62px; }.contact-main h2 { margin-bottom: 28px; }.contact-info { margin-top: 62px; }.site-footer span:not(.footer-brand span) { display: none; }.lightbox { padding: 18px; }.lightbox-image-wrap { height: 63vh; }.lightbox-foot h3 { font-size: 20px; }.lightbox-controls button { width: 35px; height: 35px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } }

.hero-video-portfolio { background: #0b1214; }
.services-page { min-height: 100vh; background: var(--paper); color: var(--ink); }.services-header { position: absolute; }.services-hero { position: relative; min-height: 780px; height: 100svh; isolation: isolate; display: flex; align-items: flex-end; overflow: hidden; color: var(--mist); }.services-hero-video { position: absolute; z-index: -3; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; background: var(--ink); }.services-hero-shade { position: absolute; z-index: -2; inset: 0; background: linear-gradient(90deg, rgba(8,15,16,.92), rgba(8,15,16,.6) 41%, rgba(8,15,16,.2) 74%), linear-gradient(0deg, rgba(8,15,16,.48), transparent 46%); }.services-hero-grid { position: absolute; z-index: -1; inset: 0; background-image: linear-gradient(90deg, transparent 0, transparent calc(25% - .5px), rgba(239,240,235,.22) 25%, transparent calc(25% + .5px), transparent calc(50% - .5px), rgba(239,240,235,.2) 50%, transparent calc(50% + .5px)); }.services-hero-content { max-width: 1050px; margin: 0 12vw 14vh; }.services-hero-index { margin: 0 0 34px; color: var(--cyan); font: 500 10px/1 var(--font-mono); letter-spacing: .13em; }.services-hero h1, .services-list-heading h2, .services-process h2, .services-cta h2 { margin: 0; font: 600 clamp(66px, 8vw, 132px)/.86 var(--font-display); letter-spacing: -.07em; }.services-hero-lead { max-width: 430px; margin: 34px 0 0; color: rgba(239,240,235,.78); font-size: 15px; line-height: 1.75; }.services-scroll { position: absolute; right: 5.2vw; bottom: 42px; display: grid; width: 42px; height: 42px; place-items: center; color: var(--mist); border: 1px solid rgba(239,240,235,.5); border-radius: 50%; animation: cue-bob 1.9s cubic-bezier(.77,0,.175,1) infinite; }
.services-list { padding: 145px 8vw; }.services-list-heading { display: grid; grid-template-columns: 1fr 1fr; column-gap: 12vw; align-items: end; padding-bottom: 72px; border-bottom: 1px solid var(--line-dark); }.services-list-heading .eyebrow { grid-column: 1 / -1; }.services-list-heading h2 { font-size: clamp(55px, 6.8vw, 104px); }.services-list-heading > p:last-child { margin: 0 0 8px; color: rgba(17,23,25,.64); font-size: 15px; line-height: 1.8; }.services-list-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; padding-top: 14px; }.service-card { display: flex; min-height: 430px; flex-direction: column; padding: 25px; background: var(--ink); color: var(--mist); transition: transform .24s cubic-bezier(.23,1,.32,1), background .24s; }.service-card:hover { transform: translateY(-7px); background: #202b2d; }.service-card-top { display: flex; align-items: center; justify-content: space-between; color: var(--cyan); font: 500 11px/1 var(--font-mono); }.service-card-top span { color: var(--red); }.service-card h3 { margin: auto 0 20px; font: 500 clamp(28px, 3vw, 48px)/.96 var(--font-display); letter-spacing: -.06em; }.service-card > p { margin: 0; color: rgba(239,240,235,.68); font-size: 14px; line-height: 1.75; }.service-output { display: flex; gap: 8px; align-items: flex-start; margin-top: 28px; padding-top: 15px; border-top: 1px solid rgba(239,240,235,.18); color: var(--cyan); font: 10px/1.5 var(--font-mono); }.service-output svg { flex: 0 0 auto; color: var(--red); }
.services-process { display: grid; grid-template-columns: 1fr 1fr; gap: 10vw; padding: 130px 8vw; background: var(--ink); color: var(--mist); }.services-process h2 { font-size: clamp(57px, 6.8vw, 108px); }.services-process h2 em { color: var(--cyan); }.services-process-list { display: grid; gap: 0; padding: 0; margin: 0; list-style: none; }.services-process-list li { display: grid; grid-template-columns: 68px 1fr; gap: 18px; padding: 24px 0; border-top: 1px solid var(--line-light); }.services-process-list li:last-child { border-bottom: 1px solid var(--line-light); }.services-process-list li > span { color: var(--red); font: 500 11px/1 var(--font-mono); }.services-process-list strong { font: 500 22px/1.1 var(--font-display); letter-spacing: -.04em; }.services-process-list p { margin: 10px 0 0; color: rgba(239,240,235,.65); font-size: 14px; line-height: 1.65; }.services-cta { display: flex; min-height: 590px; flex-direction: column; justify-content: center; align-items: center; padding: 120px 24px; text-align: center; background: var(--paper); }.services-cta h2 { margin-bottom: 36px; font-size: clamp(56px, 7vw, 112px); }.services-cta > a:not(.services-back) { display: inline-flex; align-items: center; gap: 12px; padding: 14px 18px; background: var(--ink); color: var(--mist); text-decoration: none; font: 500 11px/1 var(--font-mono); letter-spacing: .07em; transition: transform .18s cubic-bezier(.23,1,.32,1); }.services-cta > a:not(.services-back):hover { transform: translateY(-4px); }.services-panel { margin-top: 18px; background: var(--red) !important; color: #fff !important; }.services-back { display: inline-flex; gap: 8px; align-items: center; margin-top: 22px; color: rgba(17,23,25,.64); font: 500 10px/1 var(--font-mono); letter-spacing: .06em; text-decoration: none; }
@media (max-width: 900px) { .services-hero { min-height: 700px; }.services-hero-content { margin: 0 24px 12vh; }.services-list, .services-process { padding: 90px 24px; }.services-list-heading, .services-process { grid-template-columns: 1fr; gap: 42px; }.services-list-heading > p:last-child { max-width: 480px; }.services-list-grid { grid-template-columns: 1fr; }.service-card { min-height: 310px; }.services-cta { min-height: 500px; }.services-scroll { right: 24px; bottom: 28px; } }
@media (max-width: 600px) { .services-hero { min-height: 680px; }.services-hero-video { object-position: 62% 50%; }.services-hero-content { margin-bottom: 92px; }.services-hero h1 { font-size: clamp(54px, 15.6vw, 78px); }.services-hero-lead { font-size: 13px; }.services-list-heading { display: block; padding-bottom: 46px; }.services-list-heading h2 { margin-top: 30px; }.services-list-heading > p:last-child { margin-top: 27px; font-size: 13px; }.service-card { min-height: 290px; }.service-card h3 { font-size: 36px; }.services-process-list li { grid-template-columns: 42px 1fr; gap: 12px; }.services-cta { min-height: 450px; }.services-cta h2 { font-size: clamp(51px, 15vw, 74px); } }

.service-card{position:relative;isolation:isolate;overflow:hidden;background:#111a1c}.service-card-visual{position:absolute;z-index:-3;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.86;filter:saturate(.78) contrast(1.08)}.service-card-shade{position:absolute;z-index:-2;inset:0;background:linear-gradient(180deg,rgba(7,13,15,.46) 0%,rgba(7,13,15,.83) 48%,rgba(7,13,15,.97) 100%)}.service-card>*:not(.service-card-visual):not(.service-card-shade){position:relative;z-index:1}.service-card:hover .service-card-visual{transform:scale(1.045);filter:saturate(.92) contrast(1.08)}

/* ---------- public-pages.css ---------- */
.public-page{min-height:100vh;background:var(--paper);color:var(--ink)}.public-page .site-header{position:absolute;z-index:10}.public-hero{position:relative;display:flex;min-height:720px;height:100svh;align-items:flex-end;overflow:hidden;color:var(--mist);isolation:isolate}.public-hero>video{position:absolute;z-index:-3;inset:0;width:100%;height:100%;object-fit:cover;background:#10191b}.public-hero-shade{position:absolute;z-index:-2;inset:0;background:linear-gradient(90deg,rgba(8,14,16,.91),rgba(8,14,16,.5) 55%,rgba(8,14,16,.12)),linear-gradient(0deg,rgba(8,14,16,.35),transparent 50%)}.public-hero-grid{position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,transparent 24.9%,rgba(239,240,235,.16) 25%,transparent 25.1%,transparent 49.9%,rgba(239,240,235,.11) 50%,transparent 50.1%)}.public-hero-copy{max-width:830px;margin:0 12vw 14vh}.public-hero-index{margin:0 0 25px;color:var(--cyan);font:500 10px/1 var(--font-mono);letter-spacing:.14em}.public-hero h1,.public-intro h2,.public-cta h2{margin:0;font:600 clamp(66px,8vw,130px)/.86 var(--font-display);letter-spacing:-.07em}.public-hero-copy>p:last-child{max-width:520px;margin:30px 0 0;color:rgba(239,240,235,.82);font-size:15px;line-height:1.7}.public-intro{display:grid;grid-template-columns:1fr 1fr;gap:10vw;padding:140px 12vw}.public-intro h2{margin-top:30px;font-size:clamp(55px,6.5vw,98px)}.public-copy{display:grid;gap:20px;align-content:end;color:rgba(17,23,25,.68);font-size:16px;line-height:1.8}.public-copy p{margin:0}.about-values{display:grid;grid-template-columns:repeat(3,1fr);background:#142023;color:var(--mist)}.about-values article{position:relative;min-height:340px;padding:42px;border-right:1px solid rgba(239,240,235,.16)}.about-values article:last-child{border:0}.about-values svg{color:var(--cyan)}.about-values span{position:absolute;right:32px;top:38px;color:var(--red);font:500 12px/1 var(--font-mono)}.about-values h3{margin:74px 0 12px;font:500 38px/1 var(--font-display);letter-spacing:-.05em}.about-values p{max-width:290px;margin:0;color:rgba(239,240,235,.64);font-size:14px;line-height:1.7}.public-cta{display:flex;min-height:490px;flex-direction:column;align-items:center;justify-content:center;padding:100px 24px;background:#10191b;color:var(--mist);text-align:center}.public-cta h2{margin:0 0 32px;font-size:clamp(58px,7vw,112px)}.public-cta a,.contact-card-primary>a{display:inline-flex;gap:10px;align-items:center;padding:14px 18px;background:var(--red);color:#111719;font:500 11px/1 var(--font-mono);letter-spacing:.07em;text-decoration:none}.contact-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:1px;background:var(--line-dark)}.contact-card{min-height:360px;padding:44px;background:var(--paper)}.contact-card>svg{color:var(--red)}.contact-card-primary{background:#142023;color:var(--mist)}.contact-card h2{margin:34px 0;font:500 clamp(38px,4vw,62px)/.92 var(--font-display);letter-spacing:-.06em}.contact-label{margin:76px 0 10px;color:var(--red);font:500 10px/1 var(--font-mono);letter-spacing:.1em}.contact-card h3{margin:0 0 18px;font:500 28px/1.08 var(--font-display);letter-spacing:-.045em}.contact-card>span,.contact-note{display:block;max-width:270px;margin:0;color:rgba(17,23,25,.62);font-size:14px;line-height:1.7}.contact-note{margin-top:28px;color:rgba(239,240,235,.62)}.public-footer{background:var(--paper)}@media(max-width:800px){.public-hero-copy{margin:0 24px 12vh}.public-intro{grid-template-columns:1fr;gap:45px;padding:90px 24px}.about-values{grid-template-columns:1fr}.about-values article{min-height:260px;border-right:0;border-bottom:1px solid rgba(239,240,235,.16)}.contact-grid{grid-template-columns:1fr}.contact-card{min-height:280px}.public-footer{flex-wrap:wrap}}@media(max-width:600px){.public-hero{min-height:680px}.public-hero h1{font-size:clamp(55px,15vw,78px)}.public-hero-copy>p:last-child{font-size:13px}.public-intro h2{font-size:clamp(52px,15vw,76px)}.public-cta{min-height:420px}.public-cta h2{font-size:clamp(50px,14vw,74px)}}

/* ---------- gallery.css ---------- */
.portfolio-gallery-page{min-height:100vh;background:var(--paper);color:var(--ink)}
.gallery-header{position:absolute;z-index:10}.gallery-page-hero{position:relative;display:flex;min-height:760px;height:100svh;align-items:flex-end;overflow:hidden;color:var(--mist);isolation:isolate}.gallery-page-hero>video{position:absolute;z-index:-3;inset:0;width:100%;height:100%;object-fit:cover;background:var(--ink)}.gallery-page-hero-shade{position:absolute;z-index:-2;inset:0;background:linear-gradient(90deg,rgba(8,15,16,.92),rgba(8,15,16,.54) 48%,rgba(8,15,16,.1) 78%),linear-gradient(0deg,rgba(8,15,16,.45),transparent 52%)}.gallery-page-hero-grid{position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,transparent calc(25% - .5px),rgba(239,240,235,.18) 25%,transparent calc(25% + .5px),transparent calc(50% - .5px),rgba(239,240,235,.14) 50%,transparent calc(50% + .5px))}.gallery-page-hero-copy{max-width:800px;margin:0 12vw 14vh}.gallery-page-index{margin:0 0 28px;color:var(--cyan);font:500 10px/1 var(--font-mono);letter-spacing:.14em}.gallery-page-hero h1,.gallery-archive-heading h2,.gallery-page-cta h2{margin:0;font:600 clamp(66px,8vw,130px)/.86 var(--font-display);letter-spacing:-.07em}.gallery-page-hero-copy>p:last-child{max-width:500px;margin:32px 0 0;color:rgba(239,240,235,.8);font-size:15px;line-height:1.7}.gallery-page-scroll{position:absolute;right:5.2vw;bottom:42px;display:grid;width:42px;height:42px;place-items:center;border:1px solid rgba(239,240,235,.52);border-radius:50%;color:var(--mist);animation:gallery-cue 1.9s ease-in-out infinite}
.gallery-archive{padding:145px 8vw}.gallery-archive-heading{display:grid;grid-template-columns:1fr 1fr;gap:12vw;align-items:end;padding-bottom:55px;border-bottom:1px solid var(--line-dark)}.gallery-archive-heading .eyebrow{grid-column:1/-1}.gallery-archive-heading h2{font-size:clamp(55px,6.8vw,104px)}.gallery-archive-heading>p{max-width:460px;margin:0 0 7px;color:rgba(17,23,25,.64);font-size:15px;line-height:1.8}.gallery-search{display:flex;align-items:center;gap:12px;margin:26px 0 0;padding:14px 16px;border:1px solid var(--line-dark);background:#f8f8f4}.gallery-search svg{color:var(--red)}.gallery-search input{width:100%;border:0;outline:0;background:transparent;color:var(--ink);font:500 16px/1 var(--font-display)}.gallery-search input::placeholder{color:rgba(17,23,25,.45)}.gallery-search span{white-space:nowrap;color:rgba(17,23,25,.55);font:500 9px/1 var(--font-mono);letter-spacing:.1em}
.gallery-mode-tabs{display:flex;gap:8px;align-items:center;padding:22px 0}.gallery-mode-tabs button{display:inline-flex;gap:9px;align-items:center;padding:10px 12px;border:1px solid var(--line-dark);background:transparent;color:rgba(17,23,25,.7);font:500 10px/1 var(--font-mono);letter-spacing:.05em;transition:background .18s,color .18s}.gallery-mode-tabs button:hover,.gallery-mode-tabs button.active{border-color:var(--ink);background:var(--ink);color:var(--mist)}.gallery-mode-tabs span{color:var(--red)}
.album-directory-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}.album-directory-card{grid-column:span 6;min-width:0}.album-directory-card:nth-child(3n+1){grid-column:span 7}.album-directory-card:nth-child(3n+2){grid-column:span 5}.album-directory-cover{position:relative;display:block;width:100%;min-height:385px;padding:0;overflow:hidden;border:0;background:var(--ink);color:var(--mist);text-align:left;cursor:pointer}.album-directory-cover img,.album-directory-cover video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.23,1,.32,1)}.album-directory-cover:hover img,.album-directory-cover:hover video{transform:scale(1.045)}.album-cover-fallback{position:absolute;inset:0;background:linear-gradient(145deg,#0f1d21,#314d57)}.album-cover-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,9,11,.08),rgba(4,9,11,.8) 90%)}.album-directory-top,.album-directory-count,.album-open{position:absolute;z-index:2;display:flex;align-items:center;gap:7px;font:500 10px/1 var(--font-mono);letter-spacing:.08em}.album-directory-top{top:18px;left:18px;color:var(--cyan)}.album-directory-count{right:18px;bottom:18px;color:rgba(239,240,235,.8)}.album-open{bottom:18px;left:18px;padding:10px 12px;background:var(--mist);color:var(--ink);opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s cubic-bezier(.23,1,.32,1)}.album-directory-cover:hover .album-open{opacity:1;transform:translateY(0)}.album-watermark{position:absolute;z-index:1;pointer-events:none;user-select:none;color:rgba(239,240,235,.48);font:600 11px/1 var(--font-mono);letter-spacing:.18em;text-shadow:0 1px 4px rgba(0,0,0,.5)}.watermark-cover{right:-28px;bottom:72px;transform:rotate(-28deg);white-space:nowrap}.album-directory-info{padding-top:15px}.album-directory-info>span{color:var(--red);font:500 10px/1 var(--font-mono);letter-spacing:.08em}.album-directory-info h3{margin:10px 0 8px;font:500 clamp(29px,3.2vw,48px)/.95 var(--font-display);letter-spacing:-.06em}.album-directory-info p{max-width:500px;margin:0;color:rgba(17,23,25,.67);font-size:14px;line-height:1.65}
.gallery-empty{display:grid;justify-items:center;gap:12px;min-height:290px;place-content:center;padding:44px;text-align:center;border:1px dashed var(--line-dark)}.gallery-empty h3{margin:0;font:500 30px/1 var(--font-display);letter-spacing:-.05em}.gallery-empty p{max-width:450px;margin:0;color:rgba(17,23,25,.65);font-size:14px;line-height:1.6}.gallery-empty a{display:inline-flex;align-items:center;gap:8px;margin-top:6px;padding:11px 14px;background:var(--ink);color:var(--mist);font:500 10px/1 var(--font-mono);letter-spacing:.08em;text-decoration:none}.gallery-loader{width:18px;height:18px;border:2px solid rgba(17,23,25,.16);border-top-color:var(--red);border-radius:50%;animation:gallery-spin .7s linear infinite}
.gallery-page-cta{display:flex;min-height:540px;flex-direction:column;align-items:center;justify-content:center;padding:110px 24px;text-align:center}.gallery-page-cta h2{margin:0 0 34px;font-size:clamp(58px,7vw,112px)}.gallery-page-cta>a{display:inline-flex;gap:10px;align-items:center;padding:14px 18px;background:var(--ink);color:var(--mist);font:500 11px/1 var(--font-mono);letter-spacing:.07em;text-decoration:none}.gallery-footer{gap:20px}.footer-panel,.footer-gallery-back{display:inline-flex;gap:8px;align-items:center;color:inherit;font:500 10px/1 var(--font-mono);letter-spacing:.07em;text-decoration:none}.footer-panel{padding:10px 12px;color:#111719;background:var(--red)}.footer-gallery-back{margin-left:auto;opacity:.72}
.album-overlay{position:fixed;z-index:80;inset:0;display:grid;place-items:center;padding:4vh 5vw;color:var(--mist)}.album-overlay-backdrop{position:absolute;inset:0;border:0;background:rgba(4,8,10,.94);cursor:zoom-out}.album-overlay-shell{position:relative;width:min(1120px,100%);max-height:92vh}.album-overlay-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:14px}.album-overlay-head p{margin:0 0 7px;color:var(--cyan);font:10px/1 var(--font-mono);letter-spacing:.08em}.album-overlay-head h2{margin:0;font:500 clamp(28px,4vw,54px)/.95 var(--font-display);letter-spacing:-.06em}.album-overlay-head button,.album-overlay-controls button{display:grid;width:39px;height:39px;place-items:center;border:1px solid rgba(239,240,235,.35);background:transparent;color:var(--mist);cursor:pointer}.album-overlay-media{position:relative;height:min(67vh,660px);overflow:hidden;background:#060b0d}.album-overlay-media img,.album-overlay-media video{display:block;width:100%;height:100%;object-fit:contain}.watermark-overlay{right:50%;top:50%;transform:translate(50%,-50%) rotate(-22deg);white-space:nowrap;color:rgba(239,240,235,.42);font-size:clamp(12px,2vw,22px);letter-spacing:.24em}.album-overlay-foot{display:flex;justify-content:space-between;align-items:center;padding-top:15px}.album-overlay-foot>div:first-child{display:grid;gap:6px}.album-overlay-foot span{display:flex;align-items:center;gap:7px;color:rgba(239,240,235,.65);font:10px/1 var(--font-mono);letter-spacing:.08em}.album-overlay-foot strong{font:500 22px/1 var(--font-display);letter-spacing:-.04em}.album-overlay-controls{display:flex;gap:7px}.portfolio-gallery-page [data-protected-media] img,.portfolio-gallery-page [data-protected-media] video{-webkit-user-drag:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.portfolio-gallery-page [data-protected-media] img{pointer-events:none}
@keyframes gallery-spin{to{transform:rotate(360deg)}}@keyframes gallery-cue{50%{transform:translateY(6px)}}
@media(max-width:900px){.gallery-page-hero{min-height:700px}.gallery-page-hero-copy{margin:0 24px 12vh}.gallery-archive{padding:90px 24px}.gallery-archive-heading{grid-template-columns:1fr;gap:40px}.album-directory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.album-directory-card,.album-directory-card:nth-child(3n+1),.album-directory-card:nth-child(3n+2){grid-column:span 1}.album-directory-card:nth-child(3n+1){grid-column:span 2}.album-directory-cover{min-height:320px}.gallery-page-scroll{right:24px;bottom:28px}}
@media(max-width:600px){.gallery-page-hero{min-height:680px}.gallery-page-hero-copy{margin-bottom:92px}.gallery-page-hero h1{font-size:clamp(54px,15.6vw,78px)}.gallery-page-hero-copy>p:last-child{font-size:13px}.gallery-archive-heading{display:block;padding-bottom:36px}.gallery-archive-heading h2{margin-top:28px}.gallery-archive-heading>p{margin-top:26px;font-size:13px}.gallery-search{padding:12px}.gallery-search span{display:none}.gallery-mode-tabs{overflow-x:auto;padding-bottom:20px}.gallery-mode-tabs button{white-space:nowrap}.album-directory-grid{grid-template-columns:1fr}.album-directory-card,.album-directory-card:nth-child(3n+1),.album-directory-card:nth-child(3n+2){grid-column:span 1}.album-directory-cover{min-height:300px}.album-open{opacity:1;transform:none}.gallery-page-cta{min-height:440px}.gallery-page-cta h2{font-size:clamp(51px,15vw,74px)}.gallery-footer{flex-wrap:wrap}.album-overlay{padding:18px}.album-overlay-media{height:58vh}.album-overlay-head h2{font-size:32px}.album-overlay-foot strong{font-size:18px}}

/* ---------- contact.css ---------- */
@media (max-width: 600px) {
  .contact-page .public-hero h1 {
    max-width: 340px;
    font-size: clamp(46px, 12.6vw, 56px);
    line-height: .9;
  }
}

/* ---------- watermark-logo.css ---------- */
.album-watermark-image {
  position: absolute;
  z-index: 3;
  right: 18px;
  bottom: 18px;
  display: block;
  width: min(37%, 180px);
  height: auto;
  max-height: 64px;
  object-fit: contain;
  padding: 8px 10px;
  background: rgba(255, 255, 255, .78);
  border-radius: 2px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .25);
  pointer-events: none;
  user-select: none;
}

.album-watermark-image.watermark-cover {
  inset: auto;
  right: 14px;
  bottom: 14px;
  transform: none;
}

.album-watermark-image.watermark-overlay {
  inset: auto;
  right: 22px;
  bottom: 22px;
  transform: none;
}

.album-overlay-media .album-watermark-image {
  width: min(31%, 240px);
  max-height: 88px;
  background: rgba(255, 255, 255, .84);
}

.album-watermark-tile {
  position: absolute;
  z-index: 3;
  inset: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  place-items: center;
  gap: 4px;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
}

.album-watermark-tile-image {
  display: block;
  height: auto;
  max-width: 90%;
  object-fit: contain;
  padding: 4px 5px;
  background: rgba(255, 255, 255, .78);
  box-shadow: 0 4px 12px rgba(0, 0, 0, .22);
}

.album-watermark-tile-text {
  display: block;
  max-width: 90%;
  overflow: hidden;
  color: #fff;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .14em;
  text-align: center;
  text-shadow: 0 2px 4px rgba(0, 0, 0, .8);
  transform: rotate(-24deg);
}

@media (max-width: 600px) {
  .album-watermark-image.watermark-cover { right: 12px; bottom: 12px; }
  .album-watermark-image.watermark-overlay { right: 12px; bottom: 12px; }
  .album-watermark-image { width: min(44%, 150px); padding: 6px 8px; }
  .album-overlay-media .album-watermark-image { width: min(45%, 170px); }
}

/* ---------- widok pojedynczego albumu ----------------------------------- */
/* W wersji React ta strona była zbudowana na Tailwindzie, którego tutaj nie ma.
   Odtworzona w tym samym języku wizualnym: mono-etykiety, zero zaokrągleń, ink/mist. */
.album-page { min-height: 100vh; background: var(--mist); color: var(--ink); }
.album-page .site-header { position: relative; background: var(--ink); }
.album-page-head { padding: 118px 8vw 0; }
.album-page-head h1 { max-width: 15ch; margin: 22px 0 0; font: 600 clamp(52px, 7vw, 108px)/.88 var(--font-display); letter-spacing: -.07em; }
.album-page-head h1 em { font-style: normal; color: var(--accent); }
.album-page-lead { max-width: 60ch; margin: 26px 0 0; color: rgba(17,23,25,.68); font-size: 16px; line-height: 1.8; }
.album-page-strip { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 44px; padding: 16px 0; border-top: 1px solid var(--line-dark); border-bottom: 1px solid var(--line-dark); color: rgba(17,23,25,.6); font: 500 10px/1 var(--font-mono); letter-spacing: .1em; }
.album-page-strip svg { color: var(--red); flex: 0 0 auto; }
.album-page-strip span { margin-left: auto; color: var(--red); }
.album-page-film { padding: 42px 8vw 0; }
.album-page-film video, .album-page-film iframe { display: block; width: 100%; max-height: 74vh; aspect-ratio: 16/9; border: 0; background: var(--ink); }
.album-page-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; padding: 44px 8vw 110px; }
.album-page-grid figure { margin: 0; overflow: hidden; background: var(--ink); }
.album-page-grid img { display: block; width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4/3; user-select: none; transition: transform .5s cubic-bezier(.23,1,.32,1); }
.album-page-grid figure:hover img { transform: scale(1.04); }
.album-page-empty { grid-column: 1 / -1; padding: 60px 24px; border: 1px dashed var(--line-dark); text-align: center; color: rgba(17,23,25,.6); font-size: 14px; }
@media (max-width: 900px) {
  .album-page-head { padding: 60px 24px 0; }
  .album-page-film { padding: 32px 24px 0; }
  .album-page-grid { grid-template-columns: repeat(2, 1fr); padding: 32px 24px 80px; }
}
@media (max-width: 600px) {
  .album-page-grid { grid-template-columns: 1fr; }
  .album-page-strip span { margin-left: 0; width: 100%; }
}

/* Atrybut hidden musi wygrać z display:grid — inaczej lightbox wisi otwarty. */
.lightbox[hidden] { display: none; }

/* ---------- cele dotykowe i czytelność mikro-etykiet -------------------- */
/* Oryginalny projekt był robiony pod kursor: przycisk menu miał 32×27 px,
   a odnośniki w stopce 15 px wysokości. Palec potrzebuje ok. 44 px.
   Zmieniamy WYŁĄCZNIE obszar klikalny — typografia i układ zostają. */
.menu-button { width: 44px; height: 44px; margin-right: -8px; }
.site-footer a, .site-footer button { min-height: 44px; padding-block: 6px; }
.footer-panel { padding: 12px 14px; }

/* Filtry galerii to przyciski, nie podpisy — na telefonie muszą dać się trafić. */
@media (max-width: 600px) {
  .filter-chip { font-size: 10px; padding: 11px 12px; min-height: 42px; }
  .origin-label { font-size: 10px; }
  .gallery-mode-tabs button { min-height: 42px; }
}

/* Widoczny fokus klawiatury na wszystkim, co klikalne w stopce i nawigacji. */
.site-footer a:focus-visible, .site-footer button:focus-visible,
.menu-button:focus-visible, .filter-chip:focus-visible {
  outline: 2px solid var(--red); outline-offset: 3px;
}

/* Rozwinięte menu mobilne: linki miały 27 px wysokości. Powiększamy obszar
   klikalny do 44 px i zmniejszamy odstęp, żeby wysokość listy została podobna. */
@media (max-width: 900px) {
  .main-nav { gap: 6px; }
  .main-nav a, .main-nav button { display: flex; align-items: center; min-height: 44px; padding: 8px 0; width: 100%; }
}

/* Linki menu na desktopie miały 26 px wysokości. Nagłówek ma 84 px, więc 40 px
   mieści się bez zmiany układu, a na tablecie z dotykiem da się w nie trafić. */
.main-nav a, .main-nav button { display: inline-flex; align-items: center; min-height: 40px; }

/* ---------- utrudnienie kopiowania zdjęć -------------------------------- */
/* -webkit-touch-callout wyłącza menu „Zapisz obraz” po długim przytrzymaniu
   na iOS — bez tego całe blokowanie prawego przycisku nic na telefonie nie daje. */
.gallery-card img,
.album-page-grid img,
.album-directory-cover img,
.lightbox-image-wrap img,
.managed-album-card img {
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -webkit-user-drag: none;
}

/* Przezroczysta warstwa nad zdjęciem: „Zapisz obraz jako…” trafia w nią,
   a nie w plik. Klikalność zostaje, bo warstwa nie łapie zdarzeń wskaźnika. */
/* W siatce BEZ powiększania warstwa może leżeć na całym kafelku. */
.album-page-grid:not(.is-zoomable) figure { position: relative; }
.album-page-grid:not(.is-zoomable) figure::after {
  content: "";
  position: absolute;
  inset: 0;
  background: transparent;
}
/* W siatce Z powiększaniem warstwa musi być WEWNĄTRZ przycisku. Umieszczona na
   figure przechwytywała kliknięcie i lightbox nigdy się nie otwierał — pod
   kursorem zamiast przycisku był pseudoelement figure. Jako dziecko przycisku
   nadal przejmuje „Zapisz obraz jako…”, a kliknięcie bąbelkuje do przycisku. */
.album-page-grid.is-zoomable .album-zoom { position: relative; }
.album-page-grid.is-zoomable .album-zoom::after {
  content: "";
  position: absolute;
  inset: 0;
  background: transparent;
}

/* Powiększanie zdjęć w albumie — przycisk musi być niewidoczny jako przycisk. */
.album-page-grid .album-zoom { display:block; width:100%; padding:0; border:0; background:none; cursor:zoom-in; }
.album-page-grid .album-zoom img { display:block; width:100%; height:100%; object-fit:cover; aspect-ratio:4/3; }
.album-page-grid .album-zoom:focus-visible { outline:2px solid var(--red); outline-offset:3px; }