:root{--ink:#181818;--muted:#707070;--line:#d4d4d1;--paper:#fafaf8}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}a:focus-visible,button:focus-visible{outline:2px solid #3549ce;outline-offset:6px}header{display:flex;justify-content:space-between;align-items:center;padding:28px 4vw;background:var(--paper);border-bottom:1px solid var(--line)}.brand{display:block;width:170px}.brand img{display:block;width:100%}nav{display:flex;gap:34px;font-size:14px}nav a:hover,.text-link:hover,footer a:hover{text-decoration:underline;text-underline-offset:5px}.intro{padding:76px 4vw 65px}.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:12px;line-height:1.5}.intro h1{font-size:clamp(56px,8.5vw,140px);font-weight:400;letter-spacing:-.065em;line-height:1.04;margin:36px 0 48px}.intro h1 span{font-family:Georgia,serif;font-style:italic;letter-spacing:-.055em}.intro-bottom{display:flex;justify-content:space-between;align-items:end;gap:32px}.intro-bottom p{font-size:18px;line-height:1.6;max-width:435px;margin:0}.text-link{font-size:14px;border-bottom:1px solid;padding-bottom:7px;white-space:nowrap}.work,.studio{padding:32px 4vw 100px}.section-top{border-top:1px solid var(--ink);padding-top:22px;display:flex;align-items:center;justify-content:space-between;gap:20px}.section-top h2{font-weight:400;font-size:25px;margin:0;letter-spacing:-.035em}.filters{display:flex;gap:28px;flex-wrap:wrap;margin:34px 0}.filters button{padding:5px 0;background:none;border:0;border-bottom:1px solid transparent;color:var(--muted);cursor:pointer;font-size:14px}.filters button[aria-pressed=true]{color:var(--ink);border-bottom-color:var(--ink)}sup{font-size:10px;margin-left:4px}.projects{display:grid;grid-template-columns:1fr 1fr;gap:55px 24px}.card{border:0;padding:0;text-align:left;background:none;cursor:pointer;min-width:0}.card[hidden]{display:none}.card:first-child{grid-column:1/-1}.image-wrap{background:#e8e7e4;overflow:hidden;aspect-ratio:1.28;position:relative}.card:first-child .image-wrap{aspect-ratio:2.05}.image-wrap img{height:100%;width:100%;object-fit:cover;transition:transform .6s}.card:hover img{transform:scale(1.025)}.card-meta{display:flex;justify-content:space-between;gap:20px;margin-top:17px}.card h3{font-weight:400;font-size:24px;letter-spacing:-.035em;margin:0 0 6px}.card p{font-size:14px;color:var(--muted);line-height:1.5;margin:0}.card .number{font-size:12px;color:var(--muted);padding-top:5px}.studio{padding-top:15px}.studio-intro{display:grid;grid-template-columns:1.2fr 1fr;gap:8vw;margin:60px 0 70px}.statement{font-family:Georgia,serif;font-size:clamp(32px,4.4vw,70px);line-height:1.1;letter-spacing:-.04em;margin:0}.studio-intro>div p{font-size:18px;line-height:1.65;margin:0 0 23px;max-width:530px}.muted{color:var(--muted)}.services{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}.services article{border-top:1px solid var(--line);padding-top:20px}.services h3{font-size:21px;font-weight:400;letter-spacing:-.025em;margin:30px 0 16px}.services p{font-size:16px;line-height:1.65;color:var(--muted);max-width:360px}.contact{background:#181818;color:#f5f5f1;padding:65px 4vw}.contact h2{font-weight:400;font-size:clamp(45px,7.5vw,115px);letter-spacing:-.055em;line-height:1.05;margin:45px 0}.email{font-size:clamp(19px,3vw,40px);border-bottom:1px solid #7b7b78;padding-bottom:7px;overflow-wrap:anywhere}.contact-details{display:flex;justify-content:space-between;gap:20px;margin-top:75px;font-size:14px;color:#bebebb}footer{display:flex;justify-content:space-between;padding:24px 4vw;font-size:12px;color:var(--muted)}dialog{width:100%;max-width:none;height:100%;max-height:none;margin:0;border:0;background:var(--paper);padding:70px 5vw 60px;color:var(--ink)}dialog::backdrop{background:#181818cc}.close{position:fixed;top:20px;right:5vw;background:var(--paper);padding:12px 20px;border:1px solid var(--line);cursor:pointer;z-index:2}.close span{font-size:21px;margin-left:25px}.detail-heading{max-width:1150px;margin:35px auto 55px}.detail-heading h2{font-weight:400;font-size:clamp(42px,6vw,85px);letter-spacing:-.05em;margin:20px 0}.detail-heading .description{font-size:20px;line-height:1.65;max-width:740px}.facts{display:flex;gap:65px;margin-top:35px;padding-top:25px;border-top:1px solid var(--line);font-size:14px;line-height:1.65}.facts dt{color:var(--muted);margin-bottom:6px}.facts dd{margin:0}.gallery{max-width:1150px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}.gallery figure{margin:0;background:#eee}.gallery figure:first-child{grid-column:1/-1}.gallery img{display:block;width:100%;height:auto}.detail-bottom{max-width:1150px;margin:50px auto 0;border-top:1px solid var(--line);padding-top:28px;display:flex;justify-content:space-between;gap:20px}.detail-bottom button{background:none;border:none;border-bottom:1px solid;cursor:pointer;padding:6px 0}.skip,.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0)}.skip:focus{clip:auto;width:auto;height:auto;background:white;padding:12px;z-index:5}@media(max-width:650px){header{padding:23px 6vw}.brand{width:120px}nav{gap:18px;font-size:14px}.intro{padding:55px 6vw 48px}.intro h1{font-size:clamp(49px,11.5vw,76px);margin:30px 0}.intro-bottom{display:block}.intro-bottom p{font-size:16px;margin-bottom:25px}.text-link{display:inline-block}.work,.studio{padding:24px 6vw 60px}.section-top h2{font-size:22px}.section-top .eyebrow{font-size:12px}.filters{gap:20px;margin:27px 0}.projects{grid-template-columns:1fr;gap:35px}.card:first-child{grid-column:auto}.card:first-child .image-wrap{aspect-ratio:1.3}.card h3{font-size:22px}.studio-intro{grid-template-columns:1fr;gap:32px;margin:40px 0}.studio-intro>div p{font-size:16px}.services{grid-template-columns:1fr;gap:20px}.services h3{margin:15px 0 10px}.contact{padding:45px 6vw}.contact h2{margin:35px 0;font-size:51px}.contact-details{flex-direction:column;gap:6px;margin-top:50px}.contact-details p{margin:5px 0}.facts{gap:24px;flex-wrap:wrap}.gallery{grid-template-columns:1fr}.gallery figure:first-child{grid-column:auto}dialog{padding:65px 6vw 40px}.detail-heading .description{font-size:17px}.detail-bottom{font-size:14px}.statement{font-size:41px}footer{padding:23px 6vw}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.image-wrap img{transition:none}}
.brand img{filter:grayscale(1) contrast(3)}.product-image img{object-fit:contain;padding:3%}.projects.filtered .card:first-child{grid-column:auto}.projects.filtered .card:first-child .image-wrap{aspect-ratio:1.28}

.services-heading{font-size:25px;font-weight:400;margin:0 0 28px}.services h4{font-size:16px;font-weight:400;margin:24px 0 8px}.services h4+p{margin-top:0}.studio .statement{font-size:clamp(32px,3.8vw,60px);line-height:1.16}

/* Uniform merchandise frames, regardless of source image proportions. */
.product-image{padding:3%;background:#e8e7e4}.product-image img{display:block;width:100%;height:100%;padding:0;background:#fff;object-fit:contain}.work-summary{max-width:740px;margin-top:40px;border-top:1px solid var(--line);padding-top:24px}.work-summary h3{font-size:22px;font-weight:400;margin:0 0 20px}.work-summary ul{padding-left:20px;font-size:17px;line-height:1.7}.work-summary li{margin-bottom:14px}.confidential-note{font-size:14px;color:var(--muted);line-height:1.6;margin-top:26px}

/* An inset position keeps every grey edge inside the card on mobile. */
.product-image{padding:0}.product-image img{position:absolute;inset:3%;width:94%;height:94%;background:#fff;object-fit:contain;padding:0}.product-image:hover img{transform:none}
.strategy-image{background:#073b58}.strategy-image img{object-fit:contain}.card[href="/projects/san-ritual/"] .strategy-image{background:#efe7dc}
.korean,.studio-korean p{word-break:keep-all;color:var(--muted)}.intro-bottom .intro-korean{font-size:14px;line-height:1.85;margin-top:22px;max-width:490px}.studio-korean{margin-top:32px;padding-top:24px;border-top:1px solid var(--line)}.studio-intro .studio-korean p{font-size:14px;line-height:1.9}.service-ko{display:block;font-size:12px;line-height:1.6;font-weight:400;letter-spacing:0;color:var(--muted);margin-top:6px}
.merch-gallery{max-width:940px}.merch-gallery figure:first-child{grid-column:auto}.merch-gallery img{height:auto}
@media(max-width:650px){.merch-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:start}.merch-gallery figure:first-child{grid-column:auto}.intro-bottom .intro-korean{margin-bottom:25px;font-size:13px}.studio-intro .studio-korean p{font-size:13px}.product-image img{inset:3%;width:94%;height:94%}}

.studio-korean{border-top:0;padding-top:0}.white-gallery figure,.white-gallery img{background:#fff}.merch-gallery.single-column{grid-template-columns:1fr;max-width:800px}.project-video{max-width:1150px;margin:40px auto 0}.project-video video{display:block;width:100%;height:auto;background:#000}.project-links{display:flex;gap:25px;margin-top:24px}.project-links a{font-size:14px;border-bottom:1px solid;padding-bottom:6px}.card[data-type="strategy"]:last-child .strategy-image{background:#fbf8f4}

.detail-heading h2{font-size:clamp(28px,3.4vw,46px);line-height:1.25;letter-spacing:-.035em}.title-line{display:block;margin-bottom:6px}.card[href="/projects/san-ritual/"] .strategy-image{background:#fff}.card[href="/projects/san-ritual/"] .strategy-image img{object-fit:contain;padding:5%}

.merch-gallery.paired-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.merch-gallery.paired-gallery figure{grid-column:1/-1}.merch-gallery.paired-gallery figure.pair-item{grid-column:auto}
.card[href="/projects/san-ritual/"] .strategy-image{background:#fbf8f4;display:flex;justify-content:center;align-items:center}.card[href="/projects/san-ritual/"] .strategy-image img{width:30%;height:30%;padding:0;object-fit:contain;mix-blend-mode:multiply}.card[href="/projects/san-ritual/"]:hover img{transform:none}
.project-page{padding:50px 5vw 70px}.project-page .detail-heading h1{font-weight:400;font-size:clamp(28px,3.4vw,46px);line-height:1.25;letter-spacing:-.035em;margin:20px 0}.project-page .back-link{display:inline-block;font-size:14px;border-bottom:1px solid;padding-bottom:5px}.project-page .gallery figure{background:#fff}@media(max-width:650px){.merch-gallery.paired-gallery{gap:10px}}

.gallery.single-column{grid-template-columns:1fr}.gallery.two-column-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.gallery.two-column-gallery figure:first-child{grid-column:auto}@media(max-width:650px){.gallery.two-column-gallery{gap:10px}}

.card[href="/projects/ap-market-entry/"] .strategy-image{background:#eee7dc}

@media(max-width:650px){
  .projects{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px}
  .projects .card{grid-column:1/-1}
  .projects .card[data-type="merchandise"]{grid-column:auto}
}

.product-image{background:#fff;padding:0}.product-image img{inset:0;width:100%;height:100%;padding:0}
.close{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:var(--paper);box-shadow:none;outline:none;-webkit-tap-highlight-color:transparent}.close span{font-size:28px;line-height:1;margin:0;font-weight:400}.close:focus,.close:focus-visible{outline:none;box-shadow:none}.close:focus-visible span{text-decoration:underline;text-underline-offset:5px}.close:hover{background:#eeeee9}

@media(max-width:650px){.gallery.merch-gallery.paired-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.gallery.merch-gallery.paired-gallery figure{grid-column:1/-1}.gallery.merch-gallery.paired-gallery figure.pair-item{grid-column:auto}}

@media(max-width:650px){.projects.filtered .card[data-type="spaces"]{grid-column:1/-1}.projects.filtered .card[data-type="spaces"] .image-wrap{aspect-ratio:1.28}}

@media(max-width:650px){.filters{display:grid;grid-template-columns:repeat(3,max-content);gap:12px 20px;overflow:visible}.filters button{display:block;justify-self:start;white-space:nowrap}.filters button[data-filter="strategy"]{grid-column:2/span 2}}

@media(max-width:650px){.filters button[data-filter="all"]{grid-row:1;grid-column:1}.filters button[data-filter="content"]{grid-row:1;grid-column:2}.filters button[data-filter="merchandise"]{grid-row:1;grid-column:3}.filters button[data-filter="spaces"]{grid-row:2;grid-column:1}.filters button[data-filter="strategy"]{grid-row:2;grid-column:2/span 2}}

.project-summary-ko{font-size:13px;line-height:1.9;color:var(--muted);word-break:keep-all;max-width:900px;margin:20px 0 0}
@media(max-width:650px){.project-summary-ko{font-size:12px;line-height:1.85}.filters{grid-template-columns:repeat(2,max-content);gap:12px 22px}.filters button[data-filter="all"]{grid-row:1;grid-column:1/span 2}.filters button[data-filter="spaces"]{grid-row:2;grid-column:1}.filters button[data-filter="strategy"]{grid-row:2;grid-column:2}.filters button[data-filter="merchandise"]{grid-row:3;grid-column:1}.filters button[data-filter="content"]{grid-row:3;grid-column:2}}

@media(max-width:650px){.filters button[data-filter="strategy"]{transform:translateX(-30px)}}

.services{grid-template-columns:repeat(4,minmax(0,1fr))}@media(min-width:651px) and (max-width:1000px){.services{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.services{grid-template-columns:1fr}}

.close{position:fixed;top:max(16px,env(safe-area-inset-top));right:5vw;z-index:100;color:var(--ink);visibility:visible;opacity:1;flex-shrink:0;transform:translateZ(0)}.close span{display:block;color:inherit}.project-page .close{background:var(--paper)}

.card[href="/projects/ap-market-entry/"] .strategy-image{aspect-ratio:16/9;background:#eee7dc}.card[href="/projects/ap-market-entry/"] .strategy-image img{display:block;width:100%;height:100%;padding:0;object-fit:contain}

.card[href="/projects/ap-market-entry/"] .strategy-image{aspect-ratio:1.28;background:rgb(238,231,220)}

.card[href="/projects/san-ritual/"] .strategy-image{display:block;padding:0}.card[href="/projects/san-ritual/"] .strategy-image img{width:100%;height:100%;padding:0;object-fit:cover;object-position:center;mix-blend-mode:normal}

/* Compact top navigation on desktop and mobile. */
header nav{font-size:12px}@media(max-width:650px){header nav{font-size:11px}}

/* Crop replacement thumbnails within the existing card areas. */
.card[href="/projects/ap-market-entry/"] .strategy-image img{object-fit:cover;object-position:left center}.card[href="/projects/biolectra/"] .image-wrap img{object-fit:cover;object-position:center}

.project-video[data-project="lacalut"]{max-width:600px}

/* Keep ROSÉ T-shirts together and match mobile product pairs on desktop. */
.tshirt-stack{display:flex;flex-direction:column;gap:22px}.gallery.merch-gallery.paired-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery.merch-gallery.paired-gallery figure{grid-column:1/-1}.gallery.merch-gallery.paired-gallery figure.pair-item{grid-column:auto}@media(max-width:650px){.tshirt-stack{gap:10px}}

.media-stack{display:flex;flex-direction:column;gap:22px;min-width:0}.media-stack .project-video{margin:0;width:100%;max-width:none}@media(max-width:650px){.media-stack{gap:10px}}

/* Campaign media reordering applies only to mobile. */
.gallery>.project-video{grid-column:1/-1;margin:18px auto 0;width:100%}
@media(max-width:650px){
.gallery[data-project="lacalut"],.gallery[data-project="biolectra"]{display:flex;flex-direction:column}
.gallery[data-project="lacalut"]>*,.gallery[data-project="biolectra"]>*{width:100%}
.gallery[data-project="lacalut"]>figure{order:4}
.gallery[data-project="lacalut"]>figure:nth-child(1){order:1}
.gallery[data-project="lacalut"]>figure:nth-child(2){order:2}
.gallery[data-project="lacalut"]>.project-video{order:3;margin:0}
.gallery[data-project="biolectra"]>figure:nth-child(1){order:2}
.gallery[data-project="biolectra"]>figure:nth-child(2){order:1}
.gallery[data-project="biolectra"]>figure:nth-child(3){order:3}
.gallery[data-project="biolectra"]>figure:nth-child(4){order:5}
.gallery[data-project="biolectra"]>.project-video{order:4;margin:0}
}

/* Campaign and pop-up arrangements by screen size. */
.gallery[data-project="biolectra"]>.project-video{width:50%;justify-self:center;align-self:center}
@media(max-width:650px){
.gallery[data-project="biolectra"]>figure:nth-child(1){order:6}
.gallery[data-project="biolectra"]>.project-video{width:50%}
}
@media(min-width:651px){
.gallery[data-project="biolectra"]>figure:nth-child(1){grid-column:2;order:4}
.gallery[data-project="biolectra"]>figure:nth-child(2){grid-column:1;order:1}
.gallery[data-project="biolectra"]>figure:nth-child(3){grid-column:2;order:2}
.gallery[data-project="biolectra"]>figure:nth-child(4){grid-column:1;order:3}
.gallery[data-project="biolectra"]>.project-video{order:5}
.gallery[data-project="lacalut"]>figure{order:0}
.gallery[data-project="lacalut"]>figure:nth-child(7),.gallery[data-project="lacalut"]>figure:nth-child(8){order:1;grid-column:auto}
.gallery[data-project="lacalut"]>.project-video{order:2}
.gallery[data-project="lacalut"]>figure:nth-child(6){order:3;grid-column:1/-1}
.gallery[data-project="clase-azul-ultra"]>figure{order:2}
.gallery[data-project="clase-azul-ultra"]>figure:nth-child(1){order:0}
.gallery[data-project="clase-azul-ultra"]>figure:nth-child(4){order:1;grid-column:1/-1}
}

@media(max-width:650px){.gallery[data-project="biolectra"]>.project-video{width:100%}}
@media(min-width:651px){
.gallery[data-project="biolectra"]>figure:nth-child(2){order:1;grid-column:1}
.gallery[data-project="biolectra"]>figure:nth-child(4){order:2;grid-column:2}
.gallery[data-project="biolectra"]>figure:nth-child(1){order:3;grid-column:1}
.gallery[data-project="biolectra"]>figure:nth-child(3){order:4;grid-column:2}
}

.bottle-composite{position:relative;isolation:isolate}.gallery .bottle-composite>.bottle-model-overlay{position:absolute;left:1%;bottom:5%;width:36%;height:auto;background:transparent;z-index:1}

/* Bottle model bridges the adjacent images at each breakpoint. */
.gallery .bottle-composite{z-index:2;overflow:visible}
@media(max-width:650px){
.gallery .bottle-composite>.bottle-model-overlay{width:50.4%;left:-5%;top:auto;bottom:0;transform:translateY(50%)}
}
@media(min-width:651px){
.gallery .bottle-composite>.bottle-model-overlay{width:75.6%;max-width:none;left:calc(-37.8% - 11px);top:73%;bottom:auto;transform:translateY(-50%)}
}

/* Olivenol: portraits above alternating hand and product photographs. */
.gallery[data-project="olivenol"]>figure:first-child{grid-column:auto}
.gallery[data-project="olivenol"]>.project-video{max-width:600px}
.card[href="/projects/olivenol/"] .image-wrap img{object-position:center 32%}
@media(max-width:650px){
.gallery[data-project="olivenol"]{display:flex;flex-direction:column}
.gallery[data-project="olivenol"]>*{width:100%}
.gallery[data-project="olivenol"]>figure:nth-child(1){order:1}
.gallery[data-project="olivenol"]>figure:nth-child(3){order:2}
.gallery[data-project="olivenol"]>.project-video{order:3;max-width:none;margin:0}
.gallery[data-project="olivenol"]>figure:nth-child(2){order:4}
.gallery[data-project="olivenol"]>figure:nth-child(6){order:5}
.gallery[data-project="olivenol"]>figure:nth-child(4){order:6}
.gallery[data-project="olivenol"]>figure:nth-child(5){order:7}
}

.project-video[data-project="olivenol"]{max-width:600px}

@media(max-width:650px){
.gallery[data-project="olivenol"]>.project-video[data-video-role="bottom"]{order:6}
.gallery[data-project="olivenol"]>figure:nth-child(4){order:7}
.gallery[data-project="olivenol"]>figure:nth-child(5){order:8}
}

/* The Scrat uses only its original wordmark, with room around the logo. */
.card[href="/projects/the-scrat/"] .image-wrap{background:#fff}
.card[href="/projects/the-scrat/"] .image-wrap img{object-fit:contain;background:#fff;transform:scale(.8)}
.gallery[data-project="the-scrat"]{max-width:800px;margin-left:auto;margin-right:auto}
