/* Rendering-led portfolio, in the navy and gold personal identity. */
.metrics { border-bottom: 0; padding-bottom: 32px; }
.pipeline-note { display:flex; align-items:center; justify-content:space-between; gap:24px; padding-block:22px; border-block:1px solid var(--line); }
.pipeline-note .eyebrow { color:var(--accent); }
.pipeline-note p { font-size:14px; line-height:1.6; color:var(--muted); }
.pipeline-note strong { font-weight:500; color:var(--ink); }
.featured-project { margin-bottom:76px; }
.feature-heading { display:flex; justify-content:space-between; gap:30px; align-items:end; margin-bottom:25px; }
.feature-heading .eyebrow { color:var(--accent); margin-bottom:12px; }
.section .feature-heading h3 { font-size:clamp(32px,4vw,57px); line-height:1.1; font-weight:400; letter-spacing:-.045em; }
.feature-heading > p { max-width:370px; font-size:13px; line-height:1.8; color:var(--muted); }
.feature-image { display:block; width:100%; padding:0; aspect-ratio:16/8.7; position:relative; background:var(--dark); overflow:hidden; border:1px solid var(--line); text-align:left; }
.feature-image img { width:100%;height:100%;object-fit:cover;transition:transform .7s; }
.feature-image:after { content:'';position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(3,9,17,.85));pointer-events:none; }
.feature-image:hover img { transform:scale(1.025); }
.feature-play { position:absolute;z-index:1;bottom:32px;left:32px;display:flex;align-items:center;gap:17px; }
.feature-play .play-icon { width:54px;height:54px;background:rgba(7,16,30,.75);font-size:15px; }
.feature-play strong { display:block;font-size:15px;font-weight:500; }
.feature-play small { display:block;margin-top:7px;font-size:10px;letter-spacing:.08em;color:#c9d1dc;text-transform:uppercase; }
.feature-badge { position:absolute;z-index:1;bottom:34px;right:32px;color:#e7d9b7;font-size:10px;letter-spacing:.12em;text-transform:uppercase; }
.whs-stills { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px; }
.whs-stills button { padding:0;background:var(--dark);position:relative;aspect-ratio:16/10;overflow:hidden;border:1px solid var(--line); }
.whs-stills img { width:100%;height:100%;object-fit:cover;transition:transform .5s; }
.whs-stills button:hover img { transform:scale(1.04); }
.whs-stills span { position:absolute;bottom:10px;right:10px;background:#0b1422df;color:var(--accent);padding:8px 10px;font-size:14px; }
.feature-footer { display:flex;justify-content:space-between;gap:25px;margin-top:18px; }
.feature-footer p { font-size:11px;color:var(--muted);line-height:1.7;max-width:640px; }
.feature-footer .eyebrow { color:var(--accent);white-space:nowrap; }
.collage-heading { display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:25px; }
.section .collage-heading h3 { font-size:32px;font-weight:400;letter-spacing:-.04em; }
.collage-heading p { font-size:12px;color:var(--muted);line-height:1.7;max-width:350px; }
.render-collage { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px; }
.render-tile { min-width:0; }
.render-tile[hidden] { display:none; }
.render-tile button { display:block;position:relative;padding:0;width:100%;aspect-ratio:16/11;overflow:hidden;background:var(--dark);text-align:left;border:1px solid #2b394e; }
.render-tile img { width:100%;height:100%;object-fit:cover;transition:transform .55s; }
.render-tile button:after { content:'';position:absolute;inset:30% 0 0;background:linear-gradient(transparent,rgba(2,8,16,.86));pointer-events:none; }
.render-tile button:hover img { transform:scale(1.045); }
.tile-caption { position:absolute;bottom:18px;left:18px;right:18px;z-index:1;display:flex;align-items:end;justify-content:space-between;gap:15px; }
.tile-caption strong { display:block;font-size:16px;line-height:1.2;letter-spacing:-.02em;font-weight:400;color:#fff; }
.tile-caption small { display:block;font-size:9px;color:#d7dce3;margin-top:7px;letter-spacing:.04em; }
.tile-arrow { color:var(--accent);font-size:20px; }
.motion-note { margin-top:38px;display:flex;align-items:center;gap:30px;padding:22px;border:1px solid var(--line);background:#101b2b; }
.motion-note > button { position:relative;flex:0 0 180px;padding:0;aspect-ratio:16/9;background:#0b1422; }
.motion-note img { width:100%;height:100%;object-fit:cover; }
.motion-note .play-icon { position:absolute;inset:0;margin:auto;background:#0a1528db; }
.motion-note h3 { font-size:22px;font-weight:400;letter-spacing:-.03em; }
.motion-note p { font-size:12px;line-height:1.7;color:var(--muted);margin-top:8px; }
.motion-note .text-link { flex-shrink:0;background:none;margin-left:auto; }
.viewer-controls { display:flex;justify-content:space-between;gap:20px;align-items:center;padding:12px 28px;border-bottom:1px solid var(--line);background:#0c1625; }
.viewer-controls[hidden] { display:none; }
.viewer-controls button { background:none;border:1px solid #475166;padding:10px 16px;font-size:11px;color:var(--accent); }
.viewer-controls button:hover { background:#1c2c43; }
#viewer-position { font-size:10px;color:var(--muted); }
dialog.image-viewer .dialog-details, dialog.image-viewer #dialog-link { display:none; }
dialog.image-viewer .dialog-copy { padding-block:22px; }
dialog.image-viewer .dialog-copy>p { margin-top:9px; }
dialog.image-viewer #dialog-media { aspect-ratio:auto;height:min(64dvh,650px); }
@media(max-width:1000px) { .metric-value{font-size:48px}.feature-heading{align-items:start}.feature-heading>p{max-width:310px}.tile-caption{left:12px;right:12px;bottom:12px}.tile-caption strong{font-size:14px}.tile-caption small{font-size:8px}.motion-note{gap:22px} }
@media(max-width:800px) { .metric-value{font-size:43px}.metric-value>span{font-size:13px}.pipeline-note{display:block}.pipeline-note p{margin-top:10px;font-size:13px}.feature-heading{display:block}.feature-heading>p{margin-top:16px;max-width:520px}.render-collage{grid-template-columns:repeat(2,minmax(0,1fr))}.motion-note{flex-wrap:wrap}.motion-note>div{flex:1}.motion-note .text-link{margin-left:0}.feature-badge{display:none}.feature-footer{display:block}.feature-footer .eyebrow{display:block;margin-top:12px} }
@media(max-width:580px) { .metrics{padding-bottom:32px}.metric-value{font-size:46px}.metric-value>span{font-size:15px}.pipeline-note{padding-block:18px}.pipeline-note .eyebrow{font-size:8px}.pipeline-note p{font-size:12px}.featured-project{margin-bottom:46px}.feature-image{aspect-ratio:4/3}.feature-play{bottom:20px;left:20px;gap:12px}.feature-play .play-icon{width:42px;height:42px;font-size:11px}.feature-play strong{font-size:13px}.feature-play small{font-size:8px}.whs-stills{gap:7px;margin-top:7px}.whs-stills button{aspect-ratio:1}.whs-stills span{padding:4px 6px;right:5px;bottom:5px;font-size:11px}.collage-heading{display:block}.section .collage-heading h3{font-size:29px}.collage-heading p{margin-top:12px}.render-collage{gap:8px}.render-tile button{aspect-ratio:4/4.7}.tile-caption{left:10px;right:10px;bottom:12px;gap:6px}.tile-caption strong{font-size:13px}.tile-caption small{font-size:8px;line-height:1.4}.tile-arrow{font-size:16px}.motion-note{padding:15px;gap:17px}.motion-note>button{flex-basis:112px}.motion-note h3{font-size:19px}.motion-note p{font-size:10px}.motion-note .text-link{font-size:11px}.viewer-controls{padding:10px 18px;gap:10px}.viewer-controls button{padding:9px 11px;font-size:10px}.feature-heading .eyebrow{font-size:9px} }
@media(prefers-reduced-motion:reduce){.feature-image img,.whs-stills img,.render-tile img{transition:none}}
.plain-button { background:none; }
.feature-footer .plain-button { flex-shrink:0;align-self:start; }
@media(max-width:580px){.filters button{padding:10px 8px;font-size:9px}.feature-footer .plain-button{margin-top:12px}.feature-image{aspect-ratio:16/11}}
@media(max-width:580px){dialog.image-viewer #dialog-media{height:auto;aspect-ratio:16/10}.render-tile button:focus-visible{outline-offset:2px}}
