/* A restrained glass and light layer over the existing portfolio. */
:root{--accent:#bce4d5;--line:rgba(197,225,215,.18)}
body{background:#0d1315}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 10% 40%,#20363366,transparent 50%),radial-gradient(ellipse at 90% 80%,#25374255,transparent 45%)}
::selection{background:#bce4d5;color:#10201b}
.site-header,.subpage .site-header{position:fixed;top:18px;left:50%;width:min(calc(100% - 48px),1320px);transform:translateX(-50%);border:1px solid rgba(255,255,255,.16);border-radius:18px;background:rgba(20,29,31,.86);box-shadow:0 12px 40px #0003,inset 0 1px 0 #ffffff0c}
@supports(backdrop-filter:blur(20px)){.site-header{background:rgba(20,29,31,.58);backdrop-filter:blur(22px) saturate(140%)}}
.header-inner{width:calc(100% - 48px);min-height:72px}
.site-header nav a{position:relative}
.site-header nav a[aria-current="location"]{color:var(--accent)}
.nav-contact{background:linear-gradient(135deg,#ffffff16,#ffffff04);border-color:#d8e8e333}
.hero{min-height:max(740px,100svh);isolation:isolate}
.hero-image{inset:-30px;background-image:linear-gradient(90deg,rgba(10,17,19,.95),rgba(10,17,19,.73) 48%,rgba(10,17,19,.12)),linear-gradient(0deg,#0d1315,transparent 40%),url('mineral.jpg');will-change:transform}
.hero::before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 82% 27%,#99dfce20,transparent 48%),radial-gradient(ellipse at 54% 80%,#e3c59910,transparent 40%)}
.hero-atmosphere{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;opacity:.65}
.hero-orbit{position:absolute;width:min(58vw,790px);aspect-ratio:1;right:-9%;top:9%;border:1px solid #dbefe71c;border-radius:50%;pointer-events:none;z-index:1;box-shadow:0 0 65px #bae7dd08,inset 0 0 65px #bae7dd08;transform:rotate(-28deg)}
.hero-orbit::before,.hero-orbit::after{content:'';position:absolute;border-radius:50%;inset:9%;border:1px solid #dbefe710}
.hero-orbit::after{inset:24%;border-style:dashed;border-color:#dbefe71a}
.hero-content{padding-top:165px;padding-bottom:140px}
.hero-copy{max-width:970px}
.hero h1{font-size:clamp(3.7rem,7.6vw,7.4rem);letter-spacing:-.065em;line-height:1.07;margin:26px 0 30px;text-shadow:0 2px 30px #0003}
.hero-intro{max-width:590px;color:#d4dfdc;font-size:1.12rem}
.hero-actions{gap:30px}
.button{border-radius:9px;transition:transform .25s,box-shadow .25s,background .25s}
.button-light{background:linear-gradient(140deg,#e6f2eb,#bddccc);box-shadow:0 5px 25px #bbdec916,inset 0 1px 0 #fff8}
.button-light:hover{box-shadow:0 8px 35px #bbdec92a}
.text-link span,.nav-contact span{transition:transform .25s}.text-link:hover span,.nav-contact:hover span{transform:translate(2px,-2px)}
.hero-bottom{bottom:36px;color:#d2dfd5}
.hero-bottom span::before{content:'';display:inline-block;width:40px;height:1px;background:#bad6c45c;vertical-align:middle;margin-right:18px}
.section{scroll-margin-top:110px}
.section-heading .eyebrow,.about-grid .eyebrow,.contact-section .eyebrow{display:flex;align-items:center;gap:14px}
.section-heading .eyebrow::before,.about-grid .eyebrow::before,.contact-section .eyebrow::before{content:'';width:24px;height:1px;background:currentColor;opacity:.5}
.project-grid{gap:28px}
.project-card{position:relative;border-radius:14px;overflow:hidden;background:linear-gradient(135deg,#ffffff09,#ffffff03);border:1px solid #d3e8e31e;box-shadow:0 12px 34px #0002;transition:transform .35s,border-color .35s,box-shadow .35s}
.project-card:hover,.project-card:focus-within{transform:translateY(-4px);border-color:#bce4d560;box-shadow:0 22px 55px #0004}
.project-info{position:relative;background:linear-gradient(130deg,#ffffff08,#ffffff01);padding:28px 30px}
.project-info::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(300px circle at var(--glow-x,50%) var(--glow-y,0%),#bde7d916,transparent 75%);opacity:0;transition:opacity .3s}
.project-card:hover .project-info::before{opacity:1}
.project-info h3{margin-bottom:0;letter-spacing:-.045em}
.project-kicker{color:#bce4d5!important;font-size:.64rem!important}
.arrow{border-color:#c4ded633;background:#ffffff08;transition:transform .3s,background .3s}
.project-card:hover .arrow{transform:rotate(8deg);background:#ffffff14}
.photo-section{position:relative;background:linear-gradient(145deg,#1b292b99,#18202255);border-top:1px solid #ffffff0a;border-bottom:1px solid #ffffff0a}
.photo-section .photo-grid figure{border-radius:10px}
.photo-grid img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.photo-grid figcaption{background:linear-gradient(transparent,#081013d9);padding-bottom:22px}
.setup-images figure{border-radius:0;background:transparent}
.about-section{background:linear-gradient(120deg,#c9d7cd,#b7c9c1);position:relative}
.about-section::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 85% 10%,#f3faf566,transparent 55%)}
.about-grid{position:relative;grid-template-columns:.8fr 1.55fr .65fr;gap:5%}
.about-body p{line-height:1.8}.about-body .lead{font-size:1.42rem;line-height:1.5}
.about-portrait{box-shadow:0 12px 45px #12251b1a}
.contact-section{position:relative}
.contact-section::before{content:'';position:absolute;z-index:-1;inset:5% -2%;background:radial-gradient(ellipse at center,#97d8c416,transparent 65%);pointer-events:none}
.contact-section .eyebrow{justify-content:center}
.contact-email{padding-bottom:18px;border-color:#bce4d54d;transition:color .25s,border-color .25s}
.contact-email:hover{border-color:var(--accent)}
.contact-email>span{border:1px solid #bce4d52e;border-radius:50%;width:1.7em;height:1.7em;display:grid;place-items:center;font-size:.65em;background:#ffffff06}
.site-footer{background:#090f1199;border-color:#ffffff0d}
.page-top{background:radial-gradient(ellipse at 85% 5%,#395d5e88,transparent 50%),#121b1d;border-bottom:1px solid #ffffff0b}
.spec-group{background:linear-gradient(110deg,#ffffff04,transparent)}
.typing-sample video{border-radius:10px}
.image-lightbox::backdrop{background:#071012ed;backdrop-filter:blur(12px)}
.lightbox-close{background:#233033b3;backdrop-filter:blur(12px);border-color:#d8e8e34d}
.reveal-pending{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.reveal-pending.is-visible{opacity:1;transform:none}
.scroll-progress{position:fixed;left:0;top:0;height:2px;width:100%;transform:scaleX(var(--scroll-progress,0));transform-origin:left;z-index:30;background:linear-gradient(90deg,#a5cfc1,#def2e8);pointer-events:none}
@media(max-width:900px){.about-grid{grid-template-columns:1fr 1fr}.header-inner{width:calc(100% - 32px)}.site-header nav{gap:16px}.hero h1{font-size:clamp(3.6rem,8vw,6rem)}}
@media(max-width:700px){.site-header,.subpage .site-header{top:10px;width:calc(100% - 24px);border-radius:13px}.header-inner{min-height:62px;width:calc(100% - 24px)}.site-header nav{top:74px;border:1px solid #ffffff1c;border-radius:13px;background:#142023f5;box-shadow:0 20px 40px #0005;padding:18px}.hero{min-height:750px}.hero-content{padding-top:145px;padding-bottom:120px}.hero h1{font-size:clamp(3.1rem,11vw,4.7rem)}.hero-intro{font-size:1rem;max-width:32em}.hero-orbit{width:90vw;top:20%;right:-38%;opacity:.55}.hero-bottom{bottom:30px}.project-info{padding:24px}.about-grid{display:block}.contact-email{font-size:clamp(.82rem,3.4vw,1.5rem);gap:10px}.reveal-pending{transform:translateY(14px)}}
@media(prefers-reduced-motion:reduce){.hero-image{transform:none;will-change:auto}.hero-atmosphere{display:none}.reveal-pending{opacity:1;transform:none}.project-card:hover{transform:none}.photo-grid figure:hover img{transform:none}}

/* Cinematic opening: one photograph, with depth, light, and a measured entrance. */
.hero{min-height:max(800px,100svh);background:#080e10}
.hero-image{inset:-6%;background-position:72% 48%;background-image:linear-gradient(90deg,#081113ed 0%,#081113a6 37%,#08111318 76%),linear-gradient(0deg,#0d1315,transparent 38%),url('mineral.jpg');transform:scale(1.02);transform-origin:72% 48%;animation:none}
.hero::before{background:radial-gradient(ellipse at var(--light-x,78%) 35%,#c1e9df27,transparent 46%),linear-gradient(180deg,#06101355,transparent 25%,transparent 80%,#0d1315);}
.hero::after{content:'';display:block;position:absolute;z-index:1;inset:-50%;pointer-events:none;background:linear-gradient(110deg,transparent 44%,#e4f1d806 48%,#e4f1d813 50%,transparent 54%);mix-blend-mode:screen;animation:opening-light 24s ease-in-out infinite}
.hero-orbit{display:none}
.hero-content{padding-top:145px;padding-bottom:130px}
.hero-copy{max-width:940px}
.hero h1{font-size:clamp(5rem,10.8vw,10rem);line-height:.9;letter-spacing:-.075em;margin:30px 0 34px;max-width:850px}
.hero h1>span{display:block;animation:title-entrance 1.25s cubic-bezier(.16,1,.3,1) both}
.hero h1>span:last-child{animation-delay:.14s;color:#e7f0e9}
.hero-copy>.eyebrow{animation:opening-entrance 1s .1s both}
.hero-intro{max-width:480px;font-size:1rem;animation:opening-entrance 1.1s .35s both}
.hero-actions{animation:opening-entrance 1.1s .5s both}
.hero-bottom{animation:opening-entrance 1.2s .8s both}
.hero-bottom a{display:inline-flex;align-items:center;gap:14px;padding:10px 0}
.hero-bottom a::before{content:'';height:36px;width:1px;background:linear-gradient(transparent,#cde4d5);}
@keyframes title-entrance{from{opacity:0;transform:translateY(30px);filter:blur(6px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes opening-entrance{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes opening-light{0%,100%{transform:translateX(-12%) rotate(-8deg);opacity:.2}50%{transform:translateX(12%) rotate(4deg);opacity:.8}}

/* Two wide shots anchor the portfolio sequence. Stills retain their full frame. */
.project-grid{grid-template-columns:1fr 1fr;gap:36px 28px}
.project-grid>.project-card:nth-child(4){grid-column:1/-1}
.project-grid>.project-card:last-child{grid-column:1/-1;width:78%;justify-self:center}
.project-feature .project-info,.project-grid>.project-card:nth-child(4) .project-info{padding:32px 36px}
.project-feature h3,.project-grid>.project-card:nth-child(4) h3{font-size:clamp(1.8rem,3vw,2.6rem)}
.project-card{border-radius:9px}
.project-art{background:#080e10}
.section-heading{margin-bottom:60px}
.battlestation-gallery{grid-template-columns:1fr;gap:30px}
.battlestation-gallery>.image-expand:last-child{width:82%;justify-self:end}
.page-top{padding-bottom:60px}

/* Immersive viewer. Navigation stays in the current collection. */
.image-lightbox{width:min(98vw,1900px);max-width:98vw;height:94svh;max-height:94svh;padding:16px;background:#0c1517e8;border:1px solid #d5ede01c;border-radius:14px;overflow:hidden;box-shadow:0 30px 100px #0008}
.image-lightbox[open]{display:flex;flex-direction:column;animation:viewer-entrance .25s ease-out}
.lightbox-toolbar{display:flex;align-items:center;gap:10px;flex:none;padding:0 0 14px}
.lightbox-status{margin:0 auto 0 6px;font-size:.8rem;letter-spacing:.12em;color:#c4d6ce}
.lightbox-toolbar button{height:42px;min-width:42px;padding:0 14px;border:1px solid #c9e3d62b;background:#ffffff07;color:#ecf3ee;border-radius:7px;cursor:pointer;font:500 .85rem system-ui,sans-serif}
.lightbox-toolbar button:hover{background:#ffffff15}
.lightbox-toolbar button:disabled{opacity:.3;cursor:default}
.lightbox-toolbar .lightbox-close{position:static;border-radius:7px;width:42px;font-size:24px;padding:0}
.lightbox-stage{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:5px;background:#05090b}
.image-lightbox .lightbox-stage img{max-width:100%;max-height:100%;width:auto;height:auto;margin:0;object-fit:contain;transform:translate(var(--pan-x,0px),var(--pan-y,0px)) scale(1);transition:transform .25s ease;user-select:none}
.lightbox-stage.is-zoomed{cursor:grab;touch-action:none}
.image-lightbox .lightbox-stage.is-zoomed img{transform:translate(var(--pan-x,0px),var(--pan-y,0px)) scale(2)}
.lightbox-stage.is-dragging{cursor:grabbing}
.lightbox-stage.is-dragging img{transition:none}
@keyframes viewer-entrance{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:900px){.hero h1{font-size:clamp(5rem,12vw,8rem)}.hero-intro{max-width:440px}}
@media(max-width:700px){.hero{min-height:max(740px,100svh)}.hero-content{padding-top:150px;padding-bottom:115px}.hero h1{font-size:clamp(4.2rem,17vw,7rem);margin-top:28px}.hero-image{background-position:65% 50%;background-image:linear-gradient(90deg,#081113db,#08111370),linear-gradient(0deg,#0d1315,transparent 45%),url('mineral.jpg')}.hero-intro{max-width:330px}.project-grid>.project-card:last-child{width:100%}.project-feature .project-info,.project-grid>.project-card:nth-child(4) .project-info{padding:24px}.section-heading{margin-bottom:34px}.battlestation-gallery>.image-expand:last-child{width:100%}.image-lightbox{padding:10px;border-radius:9px}.lightbox-toolbar{gap:6px;padding-bottom:10px}.lightbox-toolbar button{padding:0 10px;min-width:38px}.lightbox-status{font-size:.7rem}}
@media(prefers-reduced-motion:reduce){.hero-image{animation:none;transform:none;scale:1;will-change:auto}.hero::after{animation:none;opacity:.3}.hero h1>span,.hero-copy>.eyebrow,.hero-intro,.hero-actions,.hero-bottom{animation:none;opacity:1;transform:none;filter:none}.image-lightbox[open]{animation:none}.image-lightbox .lightbox-stage img{transition:none}}

.hero.is-outside::after{animation-play-state:paused}
.hero-bottom a span::before{display:none}

/* Group published work by the studio where it was made. */
.studio-group+.studio-group{margin-top:80px}
.studio-heading{display:flex;align-items:center;gap:22px;font:600 .8rem Manrope,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:28px}
.studio-heading::after{content:'';height:1px;flex:1;background:var(--line)}
.studio-group .project-grid>.project-card:nth-child(4){grid-column:auto}
.studio-group .project-grid>.project-card:last-child{grid-column:auto;width:100%;justify-self:stretch}
.blur-work>.project-card:last-child{grid-column:1/-1!important}

/* Column widths follow the source ratios, giving both photographs equal height. */
.battlestation-gallery{grid-template-columns:minmax(0,1.287240729fr) minmax(0,1.45351313fr);gap:20px;align-items:start}
.battlestation-gallery>.image-expand:last-child{width:100%;justify-self:stretch}
.battlestation-gallery img{width:100%;height:auto}
.hero.is-outside .hero-image{animation-play-state:paused}
@media(max-width:700px){.battlestation-gallery{grid-template-columns:1fr;gap:20px}.studio-group+.studio-group{margin-top:50px}.studio-heading{font-size:.7rem;gap:14px}.studio-group .project-grid>.project-card{width:100%}}

/* Keep the photograph on its own compositor layer. Never animate background sizing. */
.hero-image{inset:-60px;background:none;animation:none;transform:translate3d(0,0,0);transform-origin:center;will-change:transform;backface-visibility:hidden}
.hero-image>img{width:100%;height:100%;max-width:none;object-fit:cover;object-position:72% 48%;transform:none;pointer-events:none}
.hero-image::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#081113ed 0%,#081113a6 37%,#08111318 76%),linear-gradient(0deg,#0d1315,transparent 38%)}
@media(max-width:700px){.hero-image>img{object-position:65% 50%}.hero-image::after{background:linear-gradient(90deg,#081113db,#08111370),linear-gradient(0deg,#0d1315,transparent 45%)}}
@media(prefers-reduced-motion:reduce){.hero-image,.hero-image>img{transform:none!important;will-change:auto}}
