/* Michael Tuzzo - Architectural Portfolio / 2026 */
:root{
  --bg:#0c1b33;--bg-soft:#132746;--surface:#193352;--ink:#f3f7ff;
  --muted:#b9cbe2;--muted-dark:#8fa7c3;--accent:#8ebcf0;--rule:#2e486c;
  --white:#f5f8ff;--max:1340px;--gutter:clamp(22px,4.2vw,70px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:'Helvetica Neue',Arial,sans-serif;-webkit-font-smoothing:antialiased}
body.modal-open{overflow:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
::selection{background:#9bc9fa;color:var(--bg)}
.container{max-width:var(--max);padding-left:var(--gutter);padding-right:var(--gutter);margin:0 auto}
.site-header{position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(147,184,227,.18);background:rgba(12,27,51,.96);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.header-inner{display:flex;align-items:center;justify-content:space-between;min-height:86px;gap:20px}
.identity{display:flex;align-items:center;gap:15px;flex-shrink:0}
.monogram{display:grid;place-items:center;border:1px solid #6789b5;width:39px;height:39px;color:#d8e8ff;font-size:12px;letter-spacing:.13em;font-weight:700}
.identity-wordmark{display:grid;gap:4px}
.identity-name{font-size:13px;font-weight:700;letter-spacing:.16em}
.identity-caption{font-size:10px;color:var(--muted);letter-spacing:.16em;text-transform:uppercase}
.main-nav{display:flex;align-items:center;gap:clamp(18px,3vw,44px)}
.main-nav a{color:var(--muted);font-size:12px;letter-spacing:.12em;text-transform:uppercase;transition:color .2s}
.main-nav a:hover,.main-nav a[aria-current="page"]{color:var(--ink)}
.main-nav .resume-link{border:1px solid #6688ae;padding:13px 16px;color:var(--ink)}
.main-nav .resume-link:hover{background:var(--accent);color:var(--bg);border-color:var(--accent)}
.eyebrow{display:flex;align-items:center;gap:13px;font-size:11px;color:var(--accent);text-transform:uppercase;letter-spacing:.18em;font-weight:700}
.eyebrow::before{content:"";width:28px;height:1px;background:var(--accent);flex-shrink:0}
.section{padding:95px 0}
.section-header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:34px}
.section-title{font-weight:500;font-size:clamp(36px,4.3vw,66px);line-height:1.02;letter-spacing:-.055em;margin:16px 0 0}
.section-note{font-size:13px;line-height:1.6;color:var(--muted);max-width:280px;margin:0 0 6px;text-align:right}
.work-grid{display:grid;grid-template-columns:1fr 1fr;gap:43px 24px}
.project-card{display:block;min-width:0}
.project-card.featured{grid-column:span 2;display:grid;grid-template-columns:1.4fr .6fr;gap:0;background:var(--bg-soft)}
.project-card .project-image{position:relative;overflow:hidden;background:#1c3454;aspect-ratio:16/10}
.project-card.featured .project-image{aspect-ratio:auto;min-height:440px}
.project-card img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.72,.2,1)}
.project-card:hover img{transform:scale(1.04)}
.image-arrow{position:absolute;bottom:16px;right:17px;width:44px;height:44px;display:grid;place-items:center;background:rgba(12,27,51,.90);border:1px solid rgba(237,244,255,.4);color:#fff;font-size:19px;transition:background .2s}
.project-card:hover .image-arrow{background:var(--accent);color:var(--bg)}
.project-copy{padding:23px 0 0}
.project-card.featured .project-copy{display:flex;flex-direction:column;justify-content:flex-end;padding:45px 34px 38px}
.project-overline{font-size:10px;letter-spacing:.17em;text-transform:uppercase;color:var(--accent);font-weight:700;margin-bottom:17px}
.project-title{font-size:clamp(26px,2.5vw,38px);letter-spacing:-.045em;font-weight:500;line-height:1.13;margin:0 0 13px}
.project-desc{font-size:14px;color:var(--muted);line-height:1.64;max-width:475px;margin:0}
.project-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--rule);margin-top:22px;padding-top:14px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#e6eef9}
.project-bottom span:last-child{color:var(--accent)}
.about-band{background:var(--bg-soft);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.about-layout{display:grid;grid-template-columns:.86fr 1.14fr;gap:clamp(40px,8vw,145px);padding-top:102px;padding-bottom:104px}
.about-kicker{font-size:clamp(35px,3.65vw,56px);font-weight:500;letter-spacing:-.057em;line-height:1.13;margin:23px 0 25px}
.about-text{font-size:15px;color:#c3d3e7;line-height:1.82;max-width:510px}
.about-text p{margin:0 0 15px}
.about-col{padding-top:3px}
.detail-group{border-top:1px solid var(--rule);padding:22px 0 21px;display:grid;grid-template-columns:120px 1fr;gap:16px}
.detail-label{color:var(--accent);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding-top:4px}
.detail-content{font-size:14px;line-height:1.65;color:#d5e2f1}
.detail-content strong{display:block;font-size:15px;color:var(--ink);font-weight:500;margin-bottom:2px}
.detail-content small{display:block;color:var(--muted);font-size:12px}
.skills-line{color:#c9d8eb;line-height:1.85;font-size:14px}
.contact-section{padding:96px 0 100px}
.contact-layout{display:flex;justify-content:space-between;align-items:end;gap:32px}
.contact-title{font-size:clamp(56px,7vw,104px);letter-spacing:-.075em;line-height:1;margin:18px 0 16px;font-weight:500}
.contact-sub{max-width:460px;line-height:1.7;color:var(--muted);font-size:15px}
.contact-details{display:flex;flex-direction:column;align-items:flex-start;gap:17px;margin-bottom:8px;font-size:14px}
.contact-details a{border-bottom:1px solid #7699c7;padding-bottom:7px;white-space:nowrap}
.contact-details a:hover{color:var(--accent)}
.site-footer{border-top:1px solid var(--rule);padding:22px 0 25px;color:var(--muted-dark);font-size:11px;letter-spacing:.06em}
.footer-inner{display:flex;gap:20px;align-items:center;justify-content:space-between}
/* Project case-study pages */
.project-switcher{background:var(--bg-soft);border-bottom:1px solid var(--rule)}
.switcher-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:56px}
.switcher-label{color:var(--muted-dark);font-size:10px;letter-spacing:.13em;text-transform:uppercase}
.switcher-links{display:flex;gap:26px;align-items:center;overflow-x:auto;scrollbar-width:none}
.switcher-links::-webkit-scrollbar{display:none}
.switcher-links a{flex:none;font-size:11px;color:var(--muted);letter-spacing:.04em;padding:17px 0;white-space:nowrap}
.switcher-links a:hover,.switcher-links a.active{color:var(--accent)}
.case-study{scroll-margin-top:148px;padding:88px 0 105px;border-bottom:1px solid var(--rule)}
.case-study:last-of-type{border-bottom:0}
.case-heading{max-width:1040px;margin-bottom:32px}
.case-title{font-size:clamp(46px,6vw,88px);font-weight:500;letter-spacing:-.068em;line-height:1.03;margin:23px 0 20px}
.case-subtitle{color:var(--muted);font-size:15px;line-height:1.65;margin:0}
.case-hero{width:100%;aspect-ratio:16/8.65;overflow:hidden;background:#243f64}
.case-hero img{width:100%;height:100%;object-fit:cover}
.case-content{display:grid;grid-template-columns:1.26fr .74fr;gap:clamp(38px,6vw,100px);margin:58px 0 75px}
.case-content h3{color:var(--accent);font-size:11px;text-transform:uppercase;letter-spacing:.17em;font-weight:700;margin:0 0 22px}
.case-summary{font-size:16px;line-height:1.86;color:#d0dff0;margin:0}
.case-facts{margin:0}
.case-facts .fact{display:grid;grid-template-columns:105px 1fr;gap:15px;border-top:1px solid var(--rule);padding:14px 0}
.case-facts dt{font-size:11px;line-height:1.5;color:var(--muted);text-transform:uppercase;letter-spacing:.07em}
.case-facts dd{margin:0;color:#e0ebf9;font-size:13px;line-height:1.6}
.gallery-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid var(--rule);padding:27px 0 24px}
.gallery-heading h3{margin:0;font-weight:500;font-size:clamp(23px,3vw,36px);letter-spacing:-.04em}
.gallery-heading p{font-size:11px;color:var(--muted);margin:0;letter-spacing:.05em}
.case-gallery{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.gallery-item{display:block;position:relative;overflow:hidden;background:#edf1f7;aspect-ratio:16/10;cursor:zoom-in}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .45s}
.gallery-item:hover img{transform:scale(1.025)}
.gallery-item.full{grid-column:1/-1;aspect-ratio:16/6}
.gallery-item.full img{object-fit:contain}
.gallery-item::after{content:'↗  VIEW';position:absolute;bottom:14px;right:14px;padding:10px 12px;background:rgba(12,27,51,.93);color:#f5f8fe;font-size:10px;letter-spacing:.13em;opacity:0;transition:opacity .2s}
.gallery-item:hover::after,.gallery-item:focus-visible::after{opacity:1}
.next-project{margin-top:38px;display:flex;justify-content:space-between;gap:12px;align-items:center;border-top:1px solid var(--rule);padding-top:22px}
.next-project span{font-size:10px;color:var(--muted);letter-spacing:.13em;text-transform:uppercase}
.next-project a{font-size:14px;color:var(--ink);border-bottom:1px solid var(--muted);padding-bottom:5px}
.next-project a:hover{color:var(--accent)}
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(5,15,31,.97);display:flex;align-items:center;justify-content:center;padding:55px 22px 37px}
.lightbox[hidden]{display:none}
.lightbox img{max-width:98%;max-height:94%;object-fit:contain}
.lightbox-close{position:absolute;top:16px;right:20px;border:1px solid #6789b5;background:#122948;color:white;cursor:pointer;width:44px;height:44px;font-size:24px}
.lightbox-caption{position:absolute;left:22px;bottom:12px;color:#dae7f8;font-size:12px}
@media(max-width:1100px){
 .project-card.featured{grid-template-columns:1.18fr .82fr}
 .project-card.featured .project-copy{padding:27px 25px}
}
@media(max-width:800px){
 .header-inner{min-height:74px}.main-nav{gap:18px}.main-nav a{font-size:11px}
 .identity-caption{display:none}
 .project-card.featured{display:block;background:transparent}
 .project-card.featured .project-image{min-height:0;aspect-ratio:16/9}
 .project-card.featured .project-copy{padding:23px 0 0}
 .about-layout{grid-template-columns:1fr;gap:26px}
 .case-content{grid-template-columns:1fr;gap:30px;margin:35px 0 50px}
 .case-hero{aspect-ratio:16/10}
}
@media(max-width:600px){
 :root{--gutter:22px}
 html{scroll-padding-top:75px}
 .site-header .header-inner{min-height:73px;gap:8px}
 .identity{gap:10px}.monogram{height:34px;width:34px;font-size:11px}
 .identity-name{font-size:11px;letter-spacing:.1em}
 .main-nav{gap:12px}.main-nav a{font-size:10px;letter-spacing:.04em}
 .main-nav a[href="#about"],.main-nav a[href="index.html#about"],.main-nav a[href="#contact"],.main-nav a[href="index.html#contact"]{display:none}
 .main-nav .resume-link{padding:10px 10px}
 .section{padding:67px 0}.section-header{display:block}.section-note{text-align:left;margin-top:15px}
 .work-grid{grid-template-columns:1fr;gap:34px}.project-card.featured{grid-column:auto}
 .project-card .project-image,.project-card.featured .project-image{aspect-ratio:16/10}
 .project-copy{padding-top:16px}.project-title{font-size:27px}
 .about-layout{padding-top:75px;padding-bottom:77px}
 .detail-group{grid-template-columns:85px 1fr;gap:10px}
 .contact-section{padding:75px 0}.contact-layout{display:block}
 .contact-title{font-size:65px}.contact-details{margin-top:30px}
 .footer-inner{flex-wrap:wrap}
 .switcher-inner{display:block;padding-top:12px}.switcher-label{display:none}.switcher-links{justify-content:space-between;gap:15px}
 .switcher-links a{font-size:10px;letter-spacing:0}
 .case-study{scroll-margin-top:116px;padding:57px 0 70px}
 .case-title{font-size:clamp(42px,10vw,64px)}.case-subtitle{font-size:13px}
 .case-hero{aspect-ratio:16/11}.case-summary{font-size:14px}
 .case-facts .fact{grid-template-columns:85px 1fr}
 .case-gallery{grid-template-columns:1fr;gap:13px}.gallery-item.full{grid-column:auto;aspect-ratio:16/9}
 .gallery-item{aspect-ratio:16/10}.gallery-heading{align-items:flex-end}
 .gallery-heading p{font-size:9px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition-duration:.001ms!important;animation-duration:.001ms!important}}

/* Project-first homepage and visible, real project links */
.work-section{padding-top:clamp(48px,6vw,88px)}
.work-section .section-header{margin-bottom:40px}
.work-section .section-title{font-weight:550;letter-spacing:-.052em}
.project-card .project-image{display:block}
.project-cta{display:inline-flex;align-items:center;white-space:nowrap;color:var(--accent);font-weight:700;padding:8px 0 8px 10px;margin:-8px 0}
.project-cta:hover,.project-cta:focus-visible{color:#d4e8ff;text-decoration:underline;text-underline-offset:5px}
.project-card .project-image:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.about-kicker{font-size:clamp(34px,3.8vw,56px);margin-bottom:23px}
.about-text strong{font-weight:550;color:var(--ink)}
.document-link{border-bottom:1px solid #88add8;padding-bottom:4px}
.document-link:hover{color:var(--accent)}
@media(max-width:600px){
 .work-section{padding-top:42px}
 .work-section .section-header{margin-bottom:26px}
 .project-bottom{align-items:center;gap:8px;font-size:10px}
 .project-cta{padding-left:4px;font-size:11px}
}

/* STRATA thesis case study */
.strata-hero {aspect-ratio: 16/6.5; background: #203754;}
.strata-hero img {object-fit:cover;}
.strata-second-p {margin-top:17px;}
.strata-metrics {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin:2px 0 100px;}
.strata-metrics>div {padding:27px 25px 29px;border-right:1px solid var(--rule);}
.strata-metrics>div:first-child{padding-left:0}
.strata-metrics>div:last-child{border-right:0}
.strata-metrics strong{display:block;font-size:clamp(29px,3.8vw,49px);font-weight:500;letter-spacing:-.055em;line-height:1.2}
.strata-metrics strong span{font-size:19px;letter-spacing:0;color:var(--accent)}
.strata-metrics small{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;margin-top:7px;color:var(--muted)}
.strata-block-title {border-top:1px solid var(--rule);padding-top:29px;margin:72px 0 29px;max-width:850px;}
.strata-block-title h2{font-size:clamp(28px,3.8vw,51px);font-weight:500;letter-spacing:-.046em;margin:16px 0 10px;}
.strata-block-title p{font-size:15px;line-height:1.75;color:var(--muted);max-width:760px;margin:0;}
.strata-figure {margin:0;min-width:0;}
.strata-figure a{display:block;overflow:hidden;background:#e9eff5;cursor:zoom-in;}
.strata-figure img{width:100%;height:100%;object-fit:contain;display:block;}
.strata-figure figcaption{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);padding:12px 0 0;}
.strata-plan-feature{max-width:790px;margin:0 auto;}
.strata-plan-feature a{height:min(760px,72vw);}
.strata-level-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px;}
.strata-level-grid .strata-figure a{aspect-ratio:4/5.1;}
.strata-level-grid .strata-figure figcaption {font-size:10px;letter-spacing:.02em;}
.strata-view-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px 19px;}
.strata-view-grid .strata-figure a{aspect-ratio:16/10;}
.strata-view-grid .strata-figure img{object-fit:cover;}
.strata-section-figure a{width:100%;}
.strata-download{margin:88px 0 58px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:24px 0 28px;display:flex;align-items:center;justify-content:space-between;gap:30px;}
.strata-download p{font-size:13px;line-height:1.6;color:var(--muted);max-width:640px;}
.strata-download a{display:inline-block;flex:none;border:1px solid #6688ae;padding:15px 18px;font-size:12px;letter-spacing:.05em;}
.strata-download a:hover{border-color:var(--accent);color:var(--accent);}
.project-card.strata-featured{margin-top:17px}
@media(max-width:920px){.strata-level-grid{grid-template-columns:1fr 1fr;gap:22px 14px}.strata-metrics{margin-bottom:72px}}
@media(max-width:600px){.strata-hero{aspect-ratio:16/9}.strata-metrics{grid-template-columns:1fr 1fr;margin-bottom:58px}.strata-metrics>div{padding:15px 12px 17px!important;border-bottom:1px solid var(--rule)}.strata-metrics>div:nth-child(2){border-right:0}.strata-metrics>div:nth-child(3),.strata-metrics>div:nth-child(4){border-bottom:0}.strata-metrics strong{font-size:30px}.strata-metrics strong span{font-size:15px}.strata-metrics small{font-size:9px}.strata-block-title{margin-top:55px}.strata-block-title p{font-size:13px}.strata-plan-feature a{height:520px}.strata-view-grid{grid-template-columns:1fr;gap:22px}.strata-download{display:block;margin-top:60px}.strata-download a{margin-top:12px}.project-card.strata-featured{margin-top:0}}

/* STRATA originals: retain the complete drawing or perspective in every viewport. */
.strata-hero{aspect-ratio:auto;height:auto;}
.strata-hero img{width:100%;height:auto;object-fit:contain;}
.strata-level-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
.strata-level-grid .strata-figure a{aspect-ratio:9/10;}
.strata-view-grid .strata-figure img{object-fit:contain;}
.project-card.strata-featured .project-image img{object-fit:contain;background:#1c3454;}
@media(max-width:920px){.strata-level-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:700px){.strata-level-grid{grid-template-columns:1fr;gap:25px;}.strata-level-grid .strata-figure a{aspect-ratio:9/10;}}


/* STRATA gallery refinements — four-plan overview + uncropped views */
.strata-level-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;align-items:start}
.strata-level-grid .strata-figure a{aspect-ratio:1/1.14;display:flex;align-items:center;justify-content:center;background:#f7f9fc;}
.strata-level-grid .strata-figure img{height:100%;width:100%;object-fit:contain;}
/* Render every original perspective at its natural aspect ratio. No cover-cropping. */
.strata-view-grid{align-items:start;gap:30px 19px;}
.strata-view-grid .strata-figure a{aspect-ratio:auto;height:auto;background:#fff;overflow:visible;}
.strata-view-grid .strata-figure img{display:block;width:100%;height:auto;object-fit:contain;}
/* Site section includes the FULL original ground profile and architectural elements. */
.strata-section-figure a{height:auto;aspect-ratio:auto;overflow:visible;background:#fff;}
.strata-section-figure img{width:100%;height:auto;object-fit:contain;display:block;}
@media(max-width:950px){.strata-level-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:21px 15px;}}
@media(max-width:480px){.strata-level-grid{grid-template-columns:1fr;gap:24px;}.strata-level-grid .strata-figure a{aspect-ratio:1/1.02;}}

/* STRATA final framing: unified thumbnail cards + true-size zoom originals. */
.strata-view-grid {align-items:stretch;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 19px;}
.strata-view-grid .strata-figure a {width:100%;aspect-ratio:16/9;overflow:hidden;background:transparent;}
.strata-view-grid .strata-figure img {display:block;width:100%;height:100%;object-fit:cover;object-position:center;}
.strata-plan-feature a {display:flex;align-items:center;justify-content:center;height:auto;max-height:none;background:#f7f9fc;}
.strata-plan-feature img {display:block;width:100%;height:auto;object-fit:contain;}
.strata-level-grid .strata-figure a{background:#f7f9fc;}
@media(max-width:600px){.strata-view-grid{grid-template-columns:1fr;}}

/* Full-width selected drawings: show every edge, without artificial letterboxing. */
.gallery-item.full.clean-full {aspect-ratio:auto;background:transparent}
.gallery-item.full.clean-full img {display:block;width:100%;height:auto;object-fit:contain}