/* Portfolio styles are scoped to the two project pages. */
.portfolio-page { --portfolio-line: rgba(174,186,209,.18); }
.portfolio-page button, .portfolio-page input { font: inherit; }
.portfolio-page button { cursor: pointer; }
.portfolio-page [hidden] { display: none !important; }
.portfolio-page :is(button,a,input):focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.portfolio-page .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; }
.portfolio-hero { padding: 120px 0 56px; background: radial-gradient(ellipse at 80% 10%,rgba(187,255,51,.065),transparent 60%); border-bottom:1px solid var(--portfolio-line); }
.portfolio-hero-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.portfolio-eyebrow { color:var(--accent); font-size:.72rem; font-weight:700; letter-spacing:.16em; margin:0 0 18px; }
.portfolio-intro h1 { font-family:var(--font-heading); font-size:clamp(2.4rem,4.4vw,4rem); font-weight:600; line-height:1.08; letter-spacing:-.055em; margin:0 0 24px; }
.portfolio-intro h1 span { color:var(--accent); }
.portfolio-intro > p:not(.portfolio-eyebrow) { max-width:460px; font-size:1rem; line-height:1.75; margin-bottom:28px; }
.portfolio-primary { display:inline-flex; align-items:center; gap:30px; background:var(--accent); color:#09120a; border-radius:8px; padding:13px 20px; font-weight:700; text-decoration:none; }
.portfolio-primary:hover { background:#d0ff76; }
.portfolio-facts { display:flex; gap:30px; margin-top:38px; padding-top:23px; border-top:1px solid var(--portfolio-line); }
.portfolio-facts strong { display:block; font-size:1.65rem; line-height:1.3; font-weight:500; }
.portfolio-facts span { display:block; font-size:.7rem; color:var(--text-2); margin-top:6px; }
.portfolio-hero-photo { position:relative; display:block; width:100%; padding:0; border:1px solid var(--portfolio-line); border-radius:18px; overflow:hidden; text-align:left; background:#101927; color:white; min-height:480px; }
.portfolio-hero-photo > img { position:absolute; width:100%; height:100%; inset:0; object-fit:cover; }
.portfolio-hero-photo::after { content:''; position:absolute; inset:0; background:linear-gradient(transparent 30%,rgba(2,6,23,.92)); }
.portfolio-hero-photo > span { position:absolute; z-index:1; bottom:28px; left:28px; right:28px; }
.portfolio-hero-photo small { display:block; color:var(--accent); font-size:.7rem; letter-spacing:.1em; }
.portfolio-hero-photo strong { display:block; font-family:var(--font-heading); font-size:1.35rem; line-height:1.4; margin:8px 0 18px; }
.portfolio-hero-photo > span > span { font-size:.85rem; }
.portfolio-work { padding-top:58px; padding-bottom:64px; scroll-margin-top:90px; }
.portfolio-work-heading { display:flex; gap:40px; justify-content:space-between; align-items:end; margin-bottom:28px; }
.portfolio-work-heading h2,.portfolio-cta h2 { font-family:var(--font-heading); font-size:clamp(1.6rem,3vw,2.25rem); letter-spacing:-.04em; line-height:1.25; margin:0; }
.portfolio-work-heading .portfolio-eyebrow { margin-bottom:10px; }
.portfolio-work-heading > p { max-width:310px; font-size:.9rem; margin:0; }
.portfolio-toolbar { display:flex; flex-wrap:wrap; gap:20px; justify-content:space-between; padding:20px 0; border-top:1px solid var(--portfolio-line); border-bottom:1px solid var(--portfolio-line); }
.portfolio-filters { display:flex; flex-wrap:wrap; gap:8px; }
.portfolio-filters button { border:1px solid var(--portfolio-line); border-radius:7px; background:transparent; color:var(--text-2); padding:8px 12px; font-size:.78rem; }
.portfolio-filters button span { font-size:.68rem; margin-left:6px; opacity:.65; }
.portfolio-filters button[aria-pressed="true"] { background:var(--accent); border-color:var(--accent); color:#09120a; }
.portfolio-search { flex:1; min-width:220px; max-width:290px; }
.portfolio-search input { width:100%; padding:9px 12px; border:1px solid var(--portfolio-line); border-radius:7px; background:#0b1220; color:var(--text); font-size:.8rem; }
.portfolio-results { color:var(--muted); font-size:.75rem; margin:20px 0; }
.portfolio-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.portfolio-card { min-width:0; background:#0a1120; border:1px solid var(--portfolio-line); border-radius:12px; overflow:hidden; display:flex; flex-direction:column; transition:border-color .2s; }
.portfolio-card:hover { border-color:rgba(187,255,51,.5); }
.portfolio-cover { display:block; position:relative; padding:0; border:0; width:100%; aspect-ratio:4/3; background:#172034; overflow:hidden; color:white; text-align:left; }
.portfolio-cover img { width:100%; height:100%; object-fit:cover; transition:transform .35s; }
.portfolio-cover:hover img { transform:scale(1.045); }
.portfolio-label,.portfolio-photo-count { position:absolute; font-size:.65rem; line-height:1.2; border-radius:5px; padding:7px 9px; background:rgba(2,6,23,.85); backdrop-filter:blur(8px); }
.portfolio-label { top:12px; left:12px; color:var(--accent); }
.portfolio-photo-count { bottom:12px; right:12px; }
.portfolio-card-body { display:flex; flex-direction:column; flex:1; padding:21px; }
.portfolio-location { font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); margin:0 0 8px; }
.portfolio-card h2 { font-family:var(--font-heading); font-size:1.1rem; line-height:1.45; font-weight:500; letter-spacing:-.025em; margin:0 0 12px; }
.portfolio-description { font-size:.85rem; line-height:1.7; margin:0 0 22px; }
.portfolio-view { display:flex; justify-content:space-between; width:100%; border:0; border-top:1px solid var(--portfolio-line); padding:14px 0 0; margin-top:auto; background:none; color:var(--text); text-align:left; font-size:.8rem !important; }
.portfolio-view span { color:var(--accent); }
.portfolio-cta { display:flex; justify-content:space-between; align-items:center; gap:30px; padding-top:40px; padding-bottom:40px; margin-bottom:60px; border-top:1px solid var(--portfolio-line); }
.portfolio-cta p:last-child { margin-bottom:0; }
.portfolio-gallery-open { overflow:hidden; }
.portfolio-dialog { width:min(1000px,94vw); max-height:92dvh; padding:24px; color:var(--text); background:#090f1c; border:1px solid var(--portfolio-line); border-radius:14px; overflow:auto; overscroll-behavior:contain; }
.portfolio-dialog::backdrop { background:rgba(0,3,10,.9); backdrop-filter:blur(6px); }
.portfolio-dialog-heading { display:flex; justify-content:space-between; align-items:start; gap:16px; margin-bottom:18px; }
.portfolio-dialog-heading h2 { margin:0; font-size:1.25rem; line-height:1.4; }
.portfolio-dialog-heading .portfolio-eyebrow { margin-bottom:6px; }
.portfolio-dialog button { color:var(--text); background:#152035; border:1px solid var(--portfolio-line); border-radius:7px; }
#gallery-close { width:40px; height:40px; flex-shrink:0; }
.portfolio-dialog-stage { position:relative; background:#030713; border-radius:8px; }
#gallery-image { width:100%; height:min(52dvh,580px); object-fit:contain; }
.portfolio-dialog-stage button { position:absolute; top:50%; transform:translateY(-50%); width:42px; height:44px; }
#gallery-prev { left:10px; } #gallery-next { right:10px; }
#gallery-counter { font-size:.75rem; color:var(--accent); margin:14px 0 8px; }
#gallery-description { font-size:.87rem; margin:0 0 18px; }
.portfolio-thumbnails { display:flex; gap:9px; overflow-x:auto; padding:5px 5px 12px; }
.portfolio-thumbnails button { padding:0; width:76px; height:60px; flex-shrink:0; overflow:hidden; }
.portfolio-thumbnails img { width:100%; height:100%; object-fit:cover; }
.portfolio-thumbnails button[aria-pressed="true"] { outline:2px solid var(--accent); outline-offset:2px; }
@media (max-width:1000px) { .portfolio-hero-grid { gap:28px; } .portfolio-hero-photo { min-height:440px; } .portfolio-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:700px) {
  .portfolio-hero { padding:105px 0 38px; } .portfolio-hero-grid { grid-template-columns:1fr; gap:30px; }
  .portfolio-intro h1 { font-size:2.8rem; } .portfolio-hero-photo { min-height:340px; }
  .portfolio-facts { gap:24px; } .portfolio-facts span { font-size:.65rem; }
  .portfolio-work { padding-top:38px; } .portfolio-work-heading { display:block; } .portfolio-work-heading > p { margin-top:14px; }
  .portfolio-toolbar { gap:16px; } .portfolio-search { max-width:none; flex-basis:100%; }
  .portfolio-grid { grid-template-columns:1fr; gap:22px; } .portfolio-card-body { padding:22px; }
  .portfolio-cta { flex-direction:column; align-items:start; } .portfolio-dialog { padding:15px; }
  #gallery-image { height:46dvh; } .portfolio-dialog-heading h2 { font-size:1.05rem; }
}
@media (prefers-reduced-motion:reduce) { .portfolio-page *, .portfolio-page *::before, .portfolio-page *::after { scroll-behavior:auto !important; transition:none !important; } }