
/* SiteSee Work — V2.8 */
.page-work{background:#f7f7f7;color:#0b0f14}
.work-hero{background:#07131d;color:#fff;padding:clamp(76px,8vw,132px) 0 78px;position:relative;overflow:hidden}
.work-hero:after{content:"";position:absolute;inset:auto -10vw -20vw 35vw;height:42vw;background:radial-gradient(circle,rgba(255,193,7,.14),transparent 62%);pointer-events:none}
.work-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.92fr);gap:clamp(44px,7vw,110px);align-items:center}
.work-hero h1{font-size:clamp(52px,6vw,92px);line-height:.98;letter-spacing:-.045em;margin:16px 0 28px;max-width:11ch}
.work-hero .lede{font-size:clamp(19px,1.55vw,24px);line-height:1.62;max-width:720px;color:#d9e0e4}
.work-hero-visual{background:#0c1e2b;border:1px solid rgba(255,255,255,.18);padding:14px;box-shadow:0 28px 80px rgba(0,0,0,.35)}
.work-hero-visual img{width:100%;display:block}
.work-section{padding:clamp(76px,8vw,132px) 0}
.work-section.dark{background:#07131d;color:#fff}
.work-section.gold{background:#ffc107;color:#0b0f14}
.work-section-head{display:grid;grid-template-columns:minmax(180px,.32fr) minmax(0,1fr);gap:clamp(36px,6vw,86px);align-items:start;margin-bottom:52px}
.work-section-head h2{font-size:clamp(38px,4.4vw,68px);line-height:1.04;letter-spacing:-.038em;margin:0 0 22px;max-width:16ch}
.work-section-head p{font-size:20px;line-height:1.68;max-width:820px;margin:0;color:#535a60}
.dark .work-section-head p{color:#c7d0d5}.gold .work-section-head p{color:#2d3135}
.work-kicker{text-transform:uppercase;font-weight:800;letter-spacing:.14em;font-size:15px;color:#866400;border-top:4px solid #ffc107;padding-top:15px;display:inline-block}.dark .work-kicker{color:#ffc107}.gold .work-kicker{color:#0b0f14;border-color:#0b0f14}
.photo-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-flow:dense;gap:14px}
.photo-card{position:relative;overflow:hidden;min-height:270px;background:#d9dadb;border:0;cursor:zoom-in;padding:0;text-align:left}
.photo-card:nth-child(1),.photo-card:nth-child(6),.photo-card:nth-child(12){grid-column:span 5;min-height:430px}
.photo-card:nth-child(2),.photo-card:nth-child(5),.photo-card:nth-child(8),.photo-card:nth-child(10){grid-column:span 4}
.photo-card:nth-child(3),.photo-card:nth-child(4),.photo-card:nth-child(7),.photo-card:nth-child(9),.photo-card:nth-child(11){grid-column:span 3}
.photo-card:nth-child(n+13){grid-column:span 3;min-height:270px}
.photo-card:nth-child(13),.photo-card:nth-child(16),.photo-card:nth-child(20),.photo-card:nth-child(23),.photo-card:nth-child(25),.photo-card:nth-child(28){grid-column:span 4}
.photo-card:nth-child(15),.photo-card:nth-child(18),.photo-card:nth-child(21),.photo-card:nth-child(24),.photo-card:nth-child(27),.photo-card:nth-child(30){grid-column:span 5;min-height:430px}
.photo-card img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .45s ease}
.photo-card:after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(4,10,15,.72));pointer-events:none}
.photo-card:hover img,.photo-card:focus-visible img{transform:scale(1.035)}
.photo-label{position:absolute;z-index:2;left:20px;right:20px;bottom:18px;color:#fff;font-size:16px;font-weight:700;letter-spacing:.01em;text-shadow:0 2px 14px rgba(0,0,0,.45)}
.photo-placeholder{cursor:default;background:#e1e3e4 url("../images/logo/sitesee-symbol-black.png") center/82px auto no-repeat;border:1px solid #c7c9ca}
.photo-placeholder:after{display:none}
.work-note{margin-top:24px;font-size:16px;color:#666;line-height:1.55}
.experience-intro{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;margin-bottom:46px}
.experience-intro img{width:100%;display:block;border:1px solid #22323e}
.experience-intro h3{font-size:clamp(32px,3.3vw,52px);line-height:1.05;margin:0 0 20px}.experience-intro p{font-size:20px;line-height:1.65;color:#c7d0d5}
.embed-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.experience-slot{background:#0c1e2b;border:1px solid #31414c;padding:14px}
.experience-slot-head{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:10px 6px 17px;color:#fff}.experience-slot-head strong{font-size:20px}.experience-slot-head span{font-size:14px;color:#ffc107;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.experience-embed{aspect-ratio:16/9;background:linear-gradient(135deg,#101d26,#172f3e);border:1px dashed #60717b;display:grid;place-items:center;position:relative;overflow:hidden}
.experience-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#fff}
.iframe-placeholder{text-align:center;padding:28px;max-width:540px}.iframe-placeholder b{display:block;color:#fff;font-size:24px;margin-bottom:10px}.iframe-placeholder p{color:#b8c4ca;font-size:16px;line-height:1.55;margin:0}.iframe-placeholder code{display:inline-block;margin-top:15px;color:#ffc107;font-size:14px}
.os-behind{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:clamp(42px,8vw,110px);align-items:start}
.os-behind h2{font-size:clamp(44px,5.2vw,78px);line-height:1;letter-spacing:-.04em;margin:12px 0 24px}.os-behind>div>p{font-size:21px;line-height:1.65;max-width:720px}
.os-capabilities{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(0,0,0,.28);border-left:1px solid rgba(0,0,0,.28)}
.os-capability{padding:26px;border-right:1px solid rgba(0,0,0,.28);border-bottom:1px solid rgba(0,0,0,.28);min-height:180px}.os-capability small{font-size:14px;text-transform:uppercase;letter-spacing:.12em;font-weight:800}.os-capability h3{font-size:24px;line-height:1.18;margin:10px 0}.os-capability p{font-size:17px;line-height:1.55;margin:0}
.work-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}.work-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 22px;border:2px solid #0b0f14;color:#0b0f14;text-decoration:none;font-weight:800}.work-actions a.primary{background:#0b0f14;color:#fff}.dark .work-actions a{border-color:#fff;color:#fff}.dark .work-actions a.primary{background:#ffc107;border-color:#ffc107;color:#0b0f14}
.production-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #c9c9c9;border-left:1px solid #c9c9c9}.production-item{padding:30px;border-right:1px solid #c9c9c9;border-bottom:1px solid #c9c9c9;min-height:230px}.production-item b{font-size:15px;letter-spacing:.12em;text-transform:uppercase;color:#8b6700}.production-item h3{font-size:26px;line-height:1.15;margin:18px 0 12px}.production-item p{font-size:17px;line-height:1.6;margin:0;color:#565d61}
.work-cta{background:#07131d;color:#fff;padding:78px 0}.work-cta-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:50px;align-items:end}.work-cta h2{font-size:clamp(40px,5vw,74px);line-height:1;letter-spacing:-.04em;margin:0}.work-cta p{font-size:20px;color:#c6d0d5;line-height:1.6}
.work-lightbox{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:10000;display:none;align-items:center;justify-content:center;padding:5vw}.work-lightbox.is-open{display:flex}.work-lightbox img{max-width:90vw;max-height:82vh;box-shadow:0 20px 80px #000}.work-lightbox button{position:absolute;top:22px;right:28px;width:48px;height:48px;border:1px solid #fff;background:transparent;color:#fff;font-size:30px;cursor:pointer}.work-lightbox .lightbox-caption{position:absolute;left:5vw;bottom:28px;color:#fff;font-size:17px}
@media(max-width:1100px){.work-hero-grid,.work-section-head,.experience-intro,.os-behind,.work-cta-grid{grid-template-columns:1fr}.photo-card{grid-column:span 6!important}.embed-grid{grid-template-columns:1fr}.production-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.photo-grid{grid-template-columns:1fr}.photo-card{grid-column:1!important;min-height:300px!important}.os-capabilities,.production-grid{grid-template-columns:1fr}.work-hero h1{font-size:48px}.work-section{padding:68px 0}}
@media(prefers-reduced-motion:reduce){.photo-card img{transition:none}}

/* Version 2.8: fixed 30-position photography grid — 3 columns by 10 rows on desktop. */
@media(min-width:1101px){
  .photo-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:row;gap:14px}
  .photo-card,.photo-card:nth-child(n){grid-column:auto!important;min-height:0!important;aspect-ratio:3/2}
}
@media(max-width:1100px) and (min-width:701px){
  .photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row}
  .photo-card,.photo-card:nth-child(n){grid-column:auto!important;min-height:0!important;aspect-ratio:3/2}
}
