/* Mobile art direction. Desktop compositions remain in style.css. */
@media(max-width:700px){
  :root{--gutter:20px}
  html{scroll-padding-top:20px}
  .site-header{gap:12px;min-height:76px}
  nav{gap:20px}nav a{min-height:44px}
  .project-grid,.project-grid>*{min-width:0}
  .project-grid{grid-template-columns:minmax(0,1fr)}
  .intro-original{padding-top:12px}
  .intro-original h1{margin:32px 0;font-size:15vw;line-height:.94}
  .intro-original .name-bottom{padding-left:0}
  .intro-photo-band{display:flex;flex-direction:column;min-height:0}
  .intro-original-image{position:static;width:100%;height:auto;order:0}
  .intro-original-image img{width:100%;height:clamp(320px,105vw,460px);object-fit:cover;object-position:center 30%;mask-image:none}
  .intro-photo-content{order:1;min-height:0;padding-block:26px 32px}
  .intro-wide-copy{max-width:none;font-size:20px;line-height:1.45}
  .intro-wide-copy .project-jump{margin-top:20px;min-height:44px}
  .brand-section{padding-block:26px;background:#fff;isolation:isolate}
  .brand-section .wrap,.brand-scroll,.brand-row,.brand-row li,.brand-logo{background:#fff}
  .brand-logo{border:0;box-shadow:none}
  .brand-section h2{font-size:13px;line-height:1.5;margin-bottom:20px}
  .brand-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:24px 18px;padding:0}
  .brand-row li{width:auto;height:58px}.brand-row .brand-logo{max-height:54px;max-width:92px}
  .selected-heading{align-items:center}.selected-heading>span{font-size:11px;line-height:1.4}
  .project-grid{row-gap:38px}
  .project-image-stage,.sunset-featured .project-image-stage{aspect-ratio:auto;min-height:0;background:transparent}
  .project-image-stage .project-cover{height:auto;aspect-ratio:4/3;object-fit:cover}
  .project-image-stage .v-project-cover{transform:none;object-position:center 70%}
  .project-image-stage .sunset-project-cover{aspect-ratio:16/9;object-fit:contain}
  .project-contributions{position:static;flex-direction:row;flex-wrap:wrap;gap:6px;margin-top:12px}
  .project-contributions li{font-size:12px;padding:6px 8px;line-height:1.25;border-radius:2px}
  .project-contributions .project-category{margin-bottom:0}
  .project-grid .featured-caption{display:block;padding-top:16px}
  .project-grid .featured-caption h3{font-size:27px;overflow-wrap:break-word}
  .project-grid .featured-caption p{font-size:15px;line-height:1.5;margin-top:7px}
  .project-grid .case-link{margin-top:10px;min-height:44px}
  .about{display:flex;flex-direction:column;padding-block:48px;gap:22px}
  .about h2{font-size:clamp(34px,8.5vw,48px);margin:0 0 24px}
  .about p{font-size:17px;line-height:1.65}
  .portrait{margin:6px 0 0;max-width:100%}
  .home-page .quote{padding-block:36px;margin-bottom:40px}
  .quote blockquote{font-size:clamp(28px,7.5vw,36px);line-height:1.2}
  .cv-columns{grid-template-columns:minmax(0,1fr);gap:32px}.cv-heading{gap:16px}
  .case-opening{padding-top:22px;padding-bottom:32px}
  .case-back{margin-bottom:28px;min-height:36px}
  .case-opening-grid{gap:22px}.case-kind{margin-top:8px}
  .case-opening h1{font-size:clamp(38px,10.6vw,68px);line-height:1.03;overflow-wrap:break-word}
  .case-story.case-introduction{display:flex;flex-direction:column;padding-block:40px;gap:28px}
  .case-introduction>.credits{order:2;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 16px}
  .case-introduction .credits div+div{margin-top:0}
  .case-introduction .credits dt{margin-bottom:6px}.case-introduction .credits dd{font-size:14px}
  .case-lead{font-size:22px;line-height:1.4}.story-copy{font-size:17px;line-height:1.6}
  .case-narrative{padding-bottom:40px}.case-narrative>p{font-size:17px;line-height:1.6}
  .film-caption{padding-block:12px;font-size:12px;line-height:1.5}
  .minimal-heading{padding-top:40px;padding-bottom:24px}
  .minimal-heading h2{font-size:clamp(30px,8vw,44px);overflow-wrap:break-word}
  .case-page .case-end{padding-block:26px;gap:12px}.case-end a{min-height:44px}
  .foundation-board .swatch{height:100px}
  .motion-videos{grid-template-columns:minmax(0,1fr);gap:24px;overflow:visible;padding-bottom:0}
  .motion-videos video{width:100%;max-width:420px;margin-inline:auto}
  .osk-universe-grid,.osk-application-grid{grid-template-columns:minmax(0,1fr)}
  .osk-business-cards{aspect-ratio:4/3}.osk-photo-pair{grid-template-columns:1fr}
  .osk-presentation-grid{grid-template-columns:1fr}
  .osk-type-columns{grid-template-columns:1fr;gap:24px}
  .osk-wave-detail{grid-template-columns:1fr;gap:24px}
  .carlsberg-mosaic{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;aspect-ratio:auto}
  .carlsberg-mosaic figure{grid-area:auto;aspect-ratio:1}
  .carlsberg-mosaic .cb-mosaic-adcept-light,.carlsberg-mosaic .cb-mosaic-adcept-one{grid-column:1/-1;aspect-ratio:1191/1684}
  .carlsberg-context-grid{gap:24px}.carlsberg-adcept-notes h3{font-size:34px}
  .carlsberg-final-grid img{height:180px}
  .v-mosaic{grid-template-columns:1fr}.v-mosaic figure{aspect-ratio:4/3}
  .v-digital-pair{grid-template-columns:1fr;gap:24px}
  .elko-campaign-films{grid-template-columns:1fr;gap:22px;margin-top:22px}
  .elko-game-detail{width:100%;overflow-x:auto;padding-bottom:8px}
  .elko-game-detail img{min-width:560px}.elko-game-detail figcaption{position:sticky;left:0}
  .sunset-photo-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .sunset-photo-grid .sunset-tall{grid-row:auto;grid-column:1/-1}
  .sunset-photo-grid .sunset-tall img{height:auto;max-height:none}
  .sunset-photo-grid figure:last-child{grid-column:1/-1}
  .sunset-photo-grid figure:not(.sunset-tall) img{aspect-ratio:4/3}
  .sunset-product-films,.sunset-more-films{grid-template-columns:1fr;gap:24px}
  .sunset-product-films .sunset-portrait{width:100%;max-width:360px;margin-inline:auto}
  .sunset-more-films figure:last-child{width:100%;max-width:none}
  .sunset-editorial p,.sunset-variation-note{font-size:17px;line-height:1.6}
  .sunset-universe{padding-bottom:40px}
  .sof-section{padding-block:40px}.sof-heading{grid-template-columns:1fr;gap:20px;padding-bottom:28px}
  .sof-heading>p,.sof-crop-copy{font-size:17px;line-height:1.6}
  .sof-heart-evolution>figure img,.sof-heart-evolution .sof-values img{width:64px}
  .sof-build,.sof-area-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .sof-foundation{grid-template-columns:1fr;gap:32px}.sof-type{max-width:250px;justify-self:start}
  .sof-swatches,.sof-secondary{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 0}
  .sof-swatches p{font-size:12px}
  .sof-closing-universe{padding-bottom:0}
  .sof-closing-board{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .sof-closing-board>div,.sof-closing-board>div:last-child{display:contents}
  .sof-closing-board .sof-rotated{grid-column:1/-1}
  .sof-closing-heart{grid-column:1/-1;min-height:140px}
}
@media(max-width:360px){nav{gap:12px;font-size:13px}.site-header{gap:8px}.intro-top{font-size:10px}.case-opening h1{font-size:38px}.cv-heading{flex-wrap:wrap}.project-grid .featured-caption h3{font-size:25px}}