.works.section { padding-block:88px; background:#101010; }
.works h2 { font-size:clamp(1.75rem,3.2vw,2.75rem); }
.portfolio-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.portfolio-grid--single { grid-template-columns:minmax(0,920px); justify-content:center; }
.portfolio-card { position:relative; display:block; width:100%; aspect-ratio:3/4; overflow:hidden; border:1px solid var(--line); padding:0; background:#080808; cursor:zoom-in; }
.portfolio-card img { width:100%;height:100%; display:block; }
.portfolio-grid--single .portfolio-card { aspect-ratio:981/812; }
.portfolio-enlarge,.portfolio-duration { position:absolute; right:14px;bottom:14px;background:#101010e6;color:#eee;padding:8px 12px;font-size:.875rem; }
.portfolio-play { position:absolute; left:50%;top:50%;transform:translate(-50%,-50%);width:64px;height:64px;display:grid;place-items:center;border:1px solid var(--gold);border-radius:50%;background:#121212e6;color:var(--gold);font-size:24px; }
.instagram-preview { display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,440px);align-items:center;gap:clamp(32px,8vw,120px);max-width:1060px;margin:88px auto 0; }
.instagram-copy { max-width:430px; }
.instagram-copy p { margin:18px 0 30px; }
.instagram-phone { margin:0;width:100%;padding:18px 12px 24px;border:2px solid #414141;border-radius:38px;background:#151515;overflow:hidden; }
.phone-speaker { width:58px;height:5px;border-radius:3px;background:#3a3a3a;margin:0 auto 27px; }
.phone-account { display:flex;align-items:center;gap:16px;padding:0 12px 28px; }
.phone-account img { width:54px;height:80px;object-fit:contain; }
.phone-account strong { display:block;font-size:1rem; }
.phone-account span { display:block;font-size:.875rem;color:#bcbcbc;margin-top:5px;overflow-wrap:anywhere; }
.phone-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px; }
.phone-grid > * { position:relative;display:block;aspect-ratio:4/5;min-width:0;background:#080808; }
.phone-grid img { width:100%;height:100%;object-fit:contain;display:block; }
.phone-video { position:absolute;right:4px;top:4px;padding:3px 5px;background:#111c;color:#fff;font-size:.75rem; }
.instagram-phone figcaption { color:#aaa;font-size:.8125rem;line-height:1.6;text-align:center;margin:20px 12px 0; }
.interior-grid--single { grid-template-columns:minmax(0,760px);justify-content:center; }
.portfolio-open { overflow:hidden; }
.portfolio-viewer { position:fixed;inset:0;margin:0;width:100%;max-width:none;height:100dvh;max-height:none;padding:0;border:0;background:#080808;color:#fff;overscroll-behavior:contain; }
.portfolio-viewer::backdrop {background:#000;}
.portfolio-viewer[open] { display:grid;grid-template-rows:72px minmax(0,1fr) 72px; }
.viewer-bar,.viewer-footer { display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px max(20px,env(safe-area-inset-right)); }
.viewer-bar p {color:#c3c3c3;font-size:.875rem;margin:0;}
.portfolio-viewer button { min-width:48px;height:48px;padding:0 12px;display:grid;place-items:center;border:1px solid #484848;background:#151515;color:var(--gold);font-size:1.75rem;cursor:pointer; }
.portfolio-viewer button[hidden] {display:none;}
.viewer-close {font-size:2rem!important;}
.viewer-stage { display:flex;align-items:center;justify-content:center;min-height:0;min-width:0;overflow:hidden;touch-action:pan-y pinch-zoom; }
.viewer-stage img,.viewer-stage video { display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain; }
.instagram-profile-screenshot { display:block;width:100%;height:auto;border-radius:24px; }
.viewer-caption {flex:1;text-align:center;font-size:.875rem;}
.viewer-footer {padding-bottom:max(10px,env(safe-area-inset-bottom));}
.media-error {padding:24px;text-align:center;}
@media(max-width:1000px){.portfolio-grid:not(.portfolio-grid--single){grid-template-columns:repeat(2,minmax(0,1fr));}.instagram-preview{gap:32px;grid-template-columns:minmax(0,1fr) minmax(280px,390px);}}
@media(max-width:700px){.works.section{padding-block:56px;}.instagram-preview{grid-template-columns:minmax(0,1fr);margin-top:56px;gap:32px;}.instagram-copy{max-width:none;}.instagram-phone{max-width:440px;justify-self:center;}.instagram-copy .button{width:auto;}.portfolio-grid{gap:14px;}}
@media(max-width:540px){.portfolio-grid:not(.portfolio-grid--single){grid-template-columns:1fr;}.phone-account{gap:12px;padding-inline:4px;}.phone-account span{font-size:.8125rem;}.instagram-phone{padding-inline:8px;border-radius:30px;}.portfolio-viewer[open]{grid-template-rows:64px minmax(0,1fr) 72px;}}
@media(prefers-reduced-motion:reduce){.portfolio-viewer *{scroll-behavior:auto;}}

/* One compact row; native scrolling supports touch and trackpads. */
.portfolio-grid,.portfolio-grid:not(.portfolio-grid--single) { display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px)/3);gap:24px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;justify-content:normal; }
.portfolio-grid::-webkit-scrollbar { display:none; }
.portfolio-card { scroll-snap-align:start;scroll-snap-stop:normal;min-width:0; }
.portfolio-card:focus-visible { outline:2px solid var(--gold);outline-offset:-3px; }
.portfolio-controls { display:flex;align-items:center;justify-content:flex-end;gap:20px;margin-top:22px; }
.portfolio-controls[hidden] { display:none; }
.portfolio-controls button { width:48px;height:48px;border:1px solid var(--gold);background:transparent;color:var(--gold);font-size:1.6rem;cursor:pointer; }
.portfolio-controls button:disabled { opacity:.25;cursor:default; }
.portfolio-range { color:#bbb;font-size:.875rem;min-width:82px;text-align:center;font-variant-numeric:tabular-nums; }
@media(max-width:1000px){.portfolio-grid,.portfolio-grid:not(.portfolio-grid--single){grid-auto-columns:calc((100% - 20px)/2);gap:20px;}}
@media(max-width:540px){.portfolio-grid,.portfolio-grid:not(.portfolio-grid--single){grid-auto-columns:100%;gap:14px;}.portfolio-controls{justify-content:center;margin-top:16px;}.instagram-preview{margin-top:48px;}}