/* 9042 — Oxblood Night / Olive Brass. The work itself keeps its original colours. */
:root {
  --oxblood:#281419; --brass:#848344; --on-brass:#161214; --ink-black:#111111; --paper:#f8f8f5; --brown:var(--ink-black);
  --studio-key:var(--brass); --studio-key-text:var(--oxblood); --studio-tint:var(--brass);
  --accent:var(--brass); --accent-soft:#f1f1ef; --accent-sage:var(--brass); --accent-sand:var(--brass); --accent-ink:var(--on-brass);
  --line:#28141935;
}
::selection {background:var(--ink-black);color:white}
.ink ::selection,.home-services ::selection {background:var(--brass);color:var(--on-brass)}
body.ink .header.scrolled,.studio-home .header.over-dark {background:var(--ink-black)}
body .pill:is(:hover,:focus-visible),body .light-panel .pill:is(:hover,:focus-visible),
body .quick-actions a:is(:hover,:focus-visible),body .quick-actions .quick-contact:is(:hover,:focus-visible),
body .submit-inquiry:is(:hover,:focus-visible),body .roller-controls button:is(:hover,:focus-visible) {background:var(--brass);border-color:var(--brass);color:var(--on-brass)}
.menu .menu-body nav>a:is(:hover,:focus-visible),.menu .menu-service-links a:is(:hover,:focus-visible) {color:var(--paper);text-decoration-color:var(--brass)}
.menu .menu-body nav>a:is(:hover,:focus-visible)>span:last-child {color:var(--brass)}
.studio-home .index-lockup h1 i {color:var(--brass)}
.studio-home .index-jump:is(:focus-visible,:hover) span {background:var(--brass);border-color:var(--brass);color:var(--on-brass)}
/* Work index: type first, refinement second. Every control shares the same gutter. */
.work-page-intro,.work-index {width:100%;max-width:1880px;margin-inline:auto;padding-inline:max(var(--gutter),3%)}
.work-page-intro {display:flex;align-items:end;justify-content:space-between;gap:28px;padding-block:clamp(115px,10vw,170px) clamp(34px,3.5vw,64px)}
.work-page-intro .eyebrow {font:550 13px/1.3 var(--studio-type);letter-spacing:.02em}
.work-page-intro h1 {font:555 clamp(62px,7.9vw,146px)/.96 var(--studio-type);letter-spacing:-.065em;margin:13px 0 0}
.work-page-intro h1>span {color:var(--brass)}
.work-page-intro .work-intro-bottom {margin:0 0 3px;display:block}
.work-page-intro .work-intro-bottom p {margin:0;font-size:clamp(14px,1.1vw,18px);font-weight:450;letter-spacing:-.035em;line-height:1.65;color:var(--paper)}
.work-index .work-tools.archive-tools {
  display:block;--facet-bg:var(--ink-black);--facet-border:#ffffff65;--facet-muted:#cfceca;--facet-light:var(--brass);
  padding:0;color:var(--paper);border:0;scroll-margin-top:0;
}
.work-index .archive-tools[hidden],.archive-grid[hidden],.archive-preparing[hidden],.archive-tools .facet-body[hidden] {display:none}
.discipline-picker {padding:0;border:0;margin:0;min-width:0}
.discipline-picker legend {margin:0 0 12px;padding:0;color:var(--paper)}
.discipline-tiles {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-block:1px solid var(--facet-border);border-left:1px solid var(--facet-border)}
.discipline-choice {position:relative;display:block;min-width:0}
.discipline-choice>input {position:absolute;width:1px;height:1px;opacity:0}
.discipline-tile {height:100%;min-height:87px;display:flex;flex-direction:column;justify-content:space-between;gap:13px;padding:clamp(12px,1.5vw,28px);border-right:1px solid var(--facet-border);transition:color .2s,background-color .2s}
.tile-meta {display:flex;align-items:baseline;justify-content:space-between;gap:3px;color:#d2d2cf;font:500 clamp(10px,.74vw,13px)/1.12 var(--studio-type);font-variant-numeric:tabular-nums}
.tile-meta [lang=en] {letter-spacing:.01em}
.discipline-tile strong {font:560 clamp(20px,1.85vw,35px)/1.12 var(--studio-type);letter-spacing:-.065em;white-space:nowrap}
.discipline-choice:hover .discipline-tile {background:#242424}
.discipline-choice>input:checked+.discipline-tile {background:var(--brass);color:var(--on-brass)}
.discipline-choice>input:checked+.discipline-tile .tile-meta {color:var(--on-brass)}
.discipline-choice>input:focus-visible+.discipline-tile,.color-choices input:focus-visible+span {outline:2px solid white;outline-offset:-4px}
.archive-utility {margin-top:18px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;border-bottom:1px solid var(--facet-border);min-height:58px;gap:24px}
.archive-tools .archive-search {position:relative;display:flex;flex-direction:row;align-items:center;min-width:0;max-width:780px;gap:11px}
.archive-search svg {flex:none;color:var(--paper)}
.archive-search input {background:transparent;border:0;border-radius:0;padding:10px 0;color:var(--paper);font-size:16px;min-width:0;min-height:48px;outline-offset:-2px}
.archive-search input::placeholder {color:#c7c7c3}
.archive-search input:focus-visible {outline:0}
.archive-search:focus-within {box-shadow:0 2px var(--brass)}
.facet-disclosure {display:inline-flex;align-items:center;gap:12px;text-align:start;min-height:48px;max-width:100%;color:var(--paper);font-weight:570;font-size:15px}
.facet-disclosure .facet-preview {font-weight:440;color:var(--facet-muted);font-size:12px;word-break:keep-all}
.facet-disclosure i {display:grid;place-items:center;width:26px;height:26px;border:1px solid var(--facet-border);border-radius:50%;font-style:normal}
.facet-disclosure i::before {content:'+';font:400 18px/1 var(--studio-type)}
.facet-disclosure[aria-expanded=true] i::before {content:'−'}
.facet-disclosure:focus-visible {outline:2px solid var(--brass);outline-offset:2px}
.archive-tools .facet-body {display:grid;grid-template-columns:minmax(150px,1fr) minmax(150px,1fr) minmax(0,2.9fr);align-items:start;gap:clamp(18px,3vw,60px);padding:24px 0;border-bottom:1px solid var(--facet-border)}
.archive-tools .archive-select,.archive-tools .archive-colors {margin:0;padding:0;min-width:0}
.archive-tools .archive-select {gap:10px}
.archive-tools .archive-select select {border:0;border-bottom:1px solid #ffffff65;border-radius:0;color:var(--paper);background:transparent;padding:6px 0;min-height:44px;min-block-size:44px}
.archive-tools .archive-select select option,.archive-sort select option {background:var(--ink-black);color:var(--paper)}
.archive-tools .archive-colors legend {margin:0 0 5px}
.archive-tools .color-choices {gap:0 2px}
.archive-tools .color-choices label {min-height:42px}
.archive-tools .color-choices span {font-size:12px;min-height:30px;padding:5px 8px;gap:5px}
.archive-tools .color-choices input:checked+span {color:var(--on-brass);background:var(--brass);border-color:var(--brass)}
.archive-tools .color-choices i {height:12px;width:12px}
.archive-results {--facet-border:#ffffff65;margin:14px 0 28px;padding:0}
.archive-results .archive-reset {color:#f5efef}
.archive-preparing h2 {font-size:clamp(24px,3.4vw,52px);font-weight:560;letter-spacing:-.055em;line-height:1.15;margin:12px 0}
.work-index .archive-preparing {padding:clamp(38px,5vw,80px) 0;max-width:850px}
.archive-preparing>span {font:520 12px/1 var(--studio-type);letter-spacing:.095em}
.archive-preparing>span::before {content:'';display:inline-block;width:8px;height:8px;background:var(--brass);border-radius:50%;margin-right:8px}
.archive-preparing p {font-size:15px;line-height:1.6;margin:12px 0 20px}
.archive-grid .work-card:is([data-service=website],[data-service=content]) .card-image {display:grid;align-items:center;background:var(--ink-black)}
.archive-grid .work-card:is([data-service=website],[data-service=content]) .card-image img {object-fit:contain;height:100%;width:100%}
.archive-grid .work-card[data-service=branding] .card-image {background:white}
.archive-grid .card-meta {white-space:normal}
.brand-example[id],#website-showcase,#channel-strong-zzung {scroll-margin-top:28px}
@media(max-width:1080px) {
 .archive-tools .facet-body {grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 26px}
 .archive-tools .archive-colors {grid-column:1/-1}
 .discipline-tile {padding:14px 10px}
}
@media(max-width:700px) {
 .work-page-intro,.work-index {padding-inline:var(--gutter)}
 .work-page-intro {display:block;padding-block:calc(106px + env(safe-area-inset-top)) 26px}
 .work-page-intro h1 {font-size:clamp(53px,14.5vw,82px);margin-top:8px}
 .work-page-intro .work-intro-bottom {margin:15px 0 0}
 .work-page-intro .work-intro-bottom p {font-size:14px;line-height:1.55}
 .discipline-picker legend {margin-bottom:9px}
 .discipline-tiles {grid-template-columns:repeat(3,minmax(0,1fr))}
 .discipline-choice:nth-child(-n+3) .discipline-tile {border-bottom:1px solid var(--facet-border)}
 .discipline-tile {padding:10px clamp(7px,2.8vw,17px);min-height:73px;gap:11px}
 .tile-meta {font-size:10px;line-height:1.2}
 .discipline-tile strong {font-size:clamp(17px,4.7vw,25px)}
 .archive-utility {margin-top:7px;min-height:55px;gap:7px}
 .archive-tools .archive-search {gap:5px}
 .archive-search input {font-size:16px}
 .facet-disclosure {font-size:13px;gap:5px;white-space:nowrap}
 .facet-disclosure i {width:22px;height:22px}
 .facet-disclosure .facet-preview {display:none}
 .facet-disclosure[data-selected=true] i {background:var(--brass);border-color:var(--brass);color:var(--on-brass)}
 .archive-tools .facet-body {gap:17px 15px;padding:17px 0}
 .archive-tools .color-choices {gap:0}
 .archive-tools .color-choices label {min-height:44px}
 .archive-tools .color-choices span {padding:4px 7px}
 .archive-results {margin:7px 0 18px}
 .archive-results .archive-sort select {font-size:13px}
 .archive-results .work-count {font-size:13px}
 .archive-preparing h2 {font-size:26px}
}
@media(max-width:365px) {
 .discipline-tile {padding:9px 6px;min-height:69px}
 .tile-meta {font-size:9px}
 .archive-utility {gap:3px}
 .archive-search input {padding-left:2px}
}
@media(prefers-reduced-motion:reduce) {.discipline-tile {transition:none}}
/* Studio UI and art direction boards use the same two highlights as the homepage. */
.svc-page .identity-symbol,.svc-page .identity-compact,.svc-page .svc-type-poster,
.svc-page .coming-scene,.svc-page .project-modes,.svc-page .svc-team-band,.svc-page .svc-cta,
.svc--website .svc-web-visual,.svc--website .svc-responsive-study {background:var(--brass);color:var(--on-brass)}
.svc-page .identity-wide,.svc-page .svc-message-flow {background:var(--paper)}
.svc-page .identity-colors>span:nth-child(2) {background:#f1f1ef;color:var(--oxblood)}
.svc-page .identity-colors>span:nth-child(2)::before {content:"";display:block;width:20px;height:20px;border-radius:50%;background:currentColor}
.svc-page .identity-colors>span:nth-child(3) {background:var(--brass);color:var(--on-brass)}
.svc--content .content-direction-board,.svc--content .project-modes,.svc--content .svc-cta,.svc-page .svc-duo,.svc-page .svc-duo--food {background:var(--ink-black);color:var(--paper)}
.svc--content .project-modes,.svc--content .content-direction-board,.svc--content .svc-cta {--muted:#d9d3d5;--line:#ffffff65}
.svc--content .direction-questions p,.svc--content .direction-footer,.svc--content .mode-grid article {border-color:#ffffff60}
.svc--content .svc-cta .pill {border-color:currentColor;color:var(--paper)}
.svc--content .svc-cta .pill:is(:hover,:focus-visible) {background:var(--brass);color:var(--on-brass)}
.svc-page .svc-cta-bottom p,.coming-bottom p,.svc-page .coming-label,.coming-topline {color:inherit}
.svc--content .project-modes :is(.eyebrow,p,li),.svc--content .content-direction-board small {color:inherit}
.svc-page .identity-wordmark,.svc-page .svc-hero-figure>figcaption,.svc-page .svc-screen {background:var(--paper);color:var(--oxblood)}
.service-options input:checked+span {background:var(--brass);color:var(--on-brass)}
body.ink .work-index .archive-roadmap li:first-child small {color:var(--paper)}
body.quick-actions-obstructed .quick-actions:not(:focus-within) {opacity:0;visibility:hidden;pointer-events:none}
.ink .header .logo-image {width:clamp(145px,12vw,190px);height:auto}
@media(max-width:700px) {.ink .header .logo-image {width:150px}}
/* V30 layout, with the V32 colours used as ink and small wayfinding marks. */
.studio-home .index-disciplines>a {position:relative;color:var(--oxblood);white-space:nowrap}
.studio-home .index-disciplines>a:not(:last-child)::after {background:var(--brass);width:3px;height:3px}
.studio-home .index-disciplines>a:is(:hover,:focus-visible) {text-decoration:none}
.studio-home .index-disciplines>a:is(:hover,:focus-visible)::before {content:'';position:absolute;height:1px;left:0;right:1.2em;bottom:.5em;background:var(--brass)}
.studio-home .index-disciplines>a:last-child:is(:hover,:focus-visible)::before {right:0}
.studio-home .index-disciplines>a:focus-visible {outline:2px solid var(--oxblood);outline-offset:2px}
.studio-home .index-jump:is(:hover,:focus-visible) span {background:var(--brass);border-color:var(--brass);color:var(--on-brass)}
.studio-home .portfolio-index h2 {color:var(--oxblood)}
.portfolio-index .portfolio-tabs button[aria-selected=true] {color:var(--oxblood);border-color:var(--brass)}
.portfolio-index .portfolio-tabs button::before {background:var(--brass)}
.studio-home .home-studio {background:#f0f0ee;color:var(--ink-black)}
.studio-home .home-studio .pill:is(:hover,:focus-visible) {color:var(--paper);background:var(--ink-black);border-color:var(--oxblood);text-decoration:underline;text-decoration-color:var(--brass);text-underline-offset:4px}
.studio-home .home-studio>.index-label,.studio-home .home-studio strong {color:var(--oxblood)}
.studio-home .home-services,.menu,.menu::backdrop {background:var(--ink-black)}
.studio-home .home-inquiry {background:var(--brass);color:var(--on-brass)}
.studio-home .home-inquiry>a:is(:hover,:focus-visible) {color:var(--oxblood)}
.portfolio-stage .archive-pending {background:#f0f0ee}
.portfolio-stage .archive-pending .pending-status {color:var(--oxblood)}
.portfolio-stage .pending-status::before {background:var(--brass);border-color:var(--brass)}
/* A secondary translation sits on the same baseline as each Korean title. */
.menu .menu-title {display:inline-flex;align-items:baseline;gap:clamp(10px,1.25vw,24px);min-width:0;white-space:nowrap}
.menu .menu-title small,.menu .menu-service-links small {font-family:var(--studio-type);font-weight:490;letter-spacing:.01em;line-height:1.1;color:#bababa}
.menu .menu-title small {font-size:clamp(13px,1.15vw,21px)}
.menu .menu-index {color:#b7b7b7;opacity:1}
.menu .menu-body nav>a[aria-current=page] .menu-index,.menu .menu-body nav>a:is(:hover,:focus-visible) .menu-index {color:var(--brass)}
.menu .menu-body nav>a:is(:hover,:focus-visible) .menu-title small,.menu .menu-service-links a:is(:hover,:focus-visible) small {color:var(--paper)}
.menu .menu-body nav>a:is(:focus-visible),.menu .menu-service-links a:focus-visible {outline:2px solid var(--brass);outline-offset:-2px}
.menu .menu-service-links {gap:0 clamp(12px,1.4vw,26px)}
.menu .menu-service-links a {align-items:baseline;gap:5px;white-space:nowrap}
.menu .menu-service-links small {font-size:11px}
.menu .menu-service-links a[aria-current=page],.menu .menu-service-links a:is(:hover,:focus-visible) {text-decoration:underline;text-decoration-color:var(--brass);text-underline-offset:5px}
.svc-page .identity-colors>span:nth-child(2) {flex-direction:column;align-items:start;justify-content:space-between}
@media (max-width:700px) {
  .menu .menu-title {gap:9px}
  .menu .menu-title small {font-size:13px}
  .menu .menu-service-links {padding-block:0 3px;gap:0 15px}
  .menu .menu-service-links a {align-items:center;min-height:44px;padding-block:4px}
  .menu .menu-service-links small {font-size:11px}
}
@media (max-width:359px) {
  .menu .menu-body nav>a {gap:9px}
  .menu .menu-title {gap:7px}
  .menu .menu-title small {font-size:12px}
}
