@charset "UTF-8";
/* Commercial films keep their native portrait composition inside the stone UI. */
.works-page .works-collection { margin-top:30px; }
.works-page .works-collection > .section-heading h2 { margin:8px 0 0; font-size:25px; }
.works-page .ad-work-grid,.works-page .pending-work-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px; }
.works-page .pending-collection { margin-top:64px; }
.works-page .pending-work-grid .work-art { height:215px; }
.works-page .ad-cover { height:340px; padding:25px; justify-content:space-between; gap:15px; background:linear-gradient(125deg,#18382a,#0b2018); }
.works-page .ad-cover::after { display:none; }
.ad-cover-copy { z-index:1; min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:17px; max-width:48%; }
.ad-cover-kicker { font:10px/1.5 monospace; letter-spacing:.08em; color:#b6c798; }
.ad-cover-copy > strong { font:400 clamp(25px,3vw,42px)/1.25 var(--px-display,monospace); letter-spacing:-.04em; color:#edf1df; overflow-wrap:anywhere; }
.ad-cover-type { font-size:14px; line-height:1.6; color:#d3d9c0; }
.ad-cover-chip { padding:5px 8px; border:1px solid #a7b57688; background:#b7ca7c13; font:9px/1.4 monospace; color:#d6dda8; letter-spacing:.08em; }
.ad-cover-poster { position:relative; display:block; height:100%; width:auto; max-width:52%; aspect-ratio:9/16; flex-shrink:0; border:1px solid #9fae7377; box-shadow:5px 5px 0 #03130d; }
.ad-cover-poster .ad-cover-image { width:100%; height:100%; object-fit:contain; }
.ad-cover-play { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:grid; place-items:center; width:42px; height:42px; border:1px solid #eef1c4b3; color:#eff5da; background:#112b21c7; font-size:15px; }
.ad-cover-duration { position:absolute; bottom:12px; left:25px; font:10px/1.6 monospace; letter-spacing:.08em; color:#acc091; }
.works-page .ad-work-card .work-label { font-size:11px; }
.works-page .ad-work-card .status { font-size:10px; }
.works-page .ad-work-card h2 { font-size:25px; }
.works-page .ad-work-card .work-summary { font-size:13px; }
.ad-backlinks { display:flex; justify-content:space-between; gap:20px; align-items:center; }
.ad-backlinks .back-link { margin-bottom:24px; }
.page .ad-project-heading { align-items:center; gap:28px; padding-bottom:30px; }
.page .ad-project-heading h1 { font-size:clamp(30px,4.5vw,62px); margin:14px 0; }
.page .ad-project-heading p { font-size:14px; line-height:1.9; max-width:670px; }
.ad-heading-stamp { display:flex; flex-direction:column; align-items:center; gap:12px; padding:16px 20px; min-width:130px; border:1px solid #a4b17b77; color:#bac99b; font:10px/1.5 monospace; letter-spacing:.08em; }
.ad-heading-stamp b { font-size:30px; color:#d8dfb8; font-weight:400; }
.ad-feature { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(28px,6vw,80px); align-items:center; padding:36px 0 8px; }
.ad-player-mount { display:flex; justify-content:center; align-items:center; padding:20px; background:linear-gradient(135deg,#173a2a99,#091c158c); border:1px solid #69805a66; box-shadow:inset 0 1px #c2d5a816; }
.page .ad-video-frame { position:relative; display:block; width:min(100%,330px); aspect-ratio:9/16; margin:0; background:#020906; overflow:hidden; }
.ad-video-frame video { width:100%; height:100%; max-height:none; object-fit:contain; }
.ad-video-frame .film-play { position:absolute; inset:0; transform:none; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; width:100%; height:100%; padding:0; border:0; background:linear-gradient(0deg,#00130955,transparent 65%); }
.ad-video-frame .film-play > span { display:grid; place-items:center; width:64px; height:64px; font-size:20px; padding-left:3px; }
.ad-video-frame .film-play > strong { color:#f0f4df; font-weight:500; text-shadow:0 2px 8px #000; }
.ad-video-frame.has-started .film-play { display:none; }
.ad-feature-copy > h2 { margin:16px 0 20px; font-size:clamp(25px,3.2vw,38px); line-height:1.6; font-weight:400; }
.ad-feature-copy > p:not(.section-kicker) { font-size:14px; line-height:2; color:#bdcbb4; max-width:520px; }
.ad-facts { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin:28px 0; padding-block:24px; border-top:1px solid #81916466; border-bottom:1px solid #81916466; }
.ad-facts dt { color:#9bae89; font-size:11px; margin-bottom:6px; }
.ad-facts dd { margin:0; font-size:14px; color:#e1e8ce; }
.ad-tags { display:flex; flex-wrap:wrap; gap:8px; margin:20px 0 26px; }
.ad-tags > span { padding:5px 9px; border:1px solid #a0b07655; color:#cbd7b3; background:#132f22b3; font-size:11px; }
.page .ad-detail-tabs { display:flex; gap:10px; margin:34px 0 40px; }
.page .ad-detail-tabs button { width:auto; padding:10px 16px; }
.ad-approach { padding:28px 32px; margin-bottom:44px; border:1px solid #7e8f6666; border-left:3px solid #b7c986; background:#0e291fdb; }
.ad-approach h2 { font-size:25px; font-weight:400; margin:14px 0; }
.ad-approach > p:last-child { color:#bacab1; font-size:14px; line-height:2; margin-bottom:0; max-width:900px; }
.ad-project-page .section-heading h2 { margin:8px 0 0; font-size:25px; }
.ad-project-page .ad-stills-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:15px; }
.ad-project-page .ad-stills-grid .image-card { padding:6px; border:1px solid #83966b66; background:#0d271de8; }
.ad-project-page .ad-stills-grid img { aspect-ratio:9/16; object-fit:contain; width:100%; }
.ad-project-page .image-caption { display:block; color:#c0d1b2; font-size:11px; line-height:1.7; padding:10px 4px 4px; text-align:left; }
.ad-project-page .ad-assets-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.ad-project-page .ad-assets-grid .image-card { padding:8px; background:#0c241be8; border:1px solid #80936766; }
.ad-project-page .ad-assets-grid img { display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:contain; background:#061a12; }
.ad-project-page .ad-stills-section,.ad-project-page .ad-assets-section { margin-top:44px; }
.lab-page .ad-lab-card { grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); }
.lab-page .ad-lab-cover { min-height:340px; max-height:440px; padding:20px; background:linear-gradient(125deg,#21432f,#092016); }
.lab-page .ad-lab-cover img { width:100%; height:100%; max-height:400px; object-fit:contain; filter:none; }
.lab-page .ad-lab-note { display:block; color:#a7b993; font-size:10px; margin-top:18px; }
.lab-page .ad-lab-card .ad-tags { margin-top:0; margin-bottom:22px; }
@media(max-width:800px) {
  .works-page .ad-cover { height:300px; padding:18px; gap:10px; }
  .ad-cover-copy { gap:13px; }
  .ad-cover-copy > strong { font-size:27px; }
  .ad-cover-type { font-size:12px; }
  .ad-cover-kicker { font-size:8px; }
  .ad-cover-duration { left:18px; }
  .ad-feature { gap:28px; }
  .ad-player-mount { padding:12px; }
  .ad-facts { gap:15px; }
  .ad-facts dd { font-size:12px; }
  .ad-project-page .ad-assets-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:600px) {
  .works-page .ad-work-grid,.works-page .pending-work-grid { grid-template-columns:1fr; gap:30px; }
  .works-page .ad-cover { height:310px; padding:22px; }
  .ad-cover-copy > strong { font-size:34px; }
  .ad-cover-kicker { font-size:9px; }
  .ad-cover-type { font-size:14px; }
  .works-page .works-collection > .section-heading { flex-wrap:wrap; gap:13px; align-items:start; }
  .works-page .works-collection .section-heading > .status { font-size:9px; }
  .works-page .ad-work-card h2 { font-size:23px; }
  .ad-heading-stamp { display:none; }
  .page .ad-project-heading h1 { font-size:29px; letter-spacing:-1px; }
  .page .ad-project-heading p { font-size:12px; }
  .ad-feature { grid-template-columns:1fr; padding-top:24px; gap:28px; }
  .ad-player-mount { padding:16px; }
  .page .ad-video-frame { width:min(100%,290px); }
  .ad-feature-copy > h2 { font-size:26px; }
  .ad-feature-copy > p:not(.section-kicker) { font-size:13px; }
  .ad-facts dd { font-size:13px; }
  .page .ad-detail-tabs { gap:8px; margin:26px 0; }
  .page .ad-detail-tabs button { padding:8px 11px; font-size:10px; }
  .ad-approach { padding:22px; }
  .ad-approach h2 { font-size:22px; }
  .ad-approach > p:last-child { font-size:12px; }
  .ad-project-page .ad-stills-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ad-project-page .ad-assets-grid { grid-template-columns:1fr; }
  .lab-page .ad-lab-card { grid-template-columns:1fr; }
  .lab-page .ad-lab-cover { min-height:0; height:310px; max-height:none; padding:16px; border-right:0; }
  .lab-page .ad-lab-cover img { max-height:none; }
}
