.archive-category-view{position:absolute;left:270px;right:38px;top:138px;bottom:115px;z-index:2;padding:32px;background:linear-gradient(120deg,#0b0910f5,#0d0913ee);border-radius:20px;color:#e9e3e8;overflow:hidden;animation:archive-project-reveal .35s ease}
.archive-category-view>header{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:26px}.archive-category-view h2{font-size:27px;line-height:1.3;color:#f078c5;margin:0 0 13px;font-weight:600}.archive-category-view header p{font-size:16px;line-height:1.6;max-width:650px;margin:0;color:#c9bfc7}.category-reset{flex:none;padding:8px 13px;color:#f078c5;font-size:11px;margin-top:4px}.archive-project-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;max-height:calc(100% - 120px);overflow:auto;padding:2px 2px 14px}.archive-project-card{display:flex;flex-direction:column;text-align:left;overflow:hidden;border:1px solid #684154;border-radius:13px;background:#100c15;color:#e9e3e8;transition:border-color .2s,box-shadow .2s}.archive-project-card:hover:not(:disabled),.archive-project-card:focus-visible{border-color:var(--accent);box-shadow:0 0 20px #f078c51b}.case-card-visual{display:block;position:relative;aspect-ratio:3/4;width:100%;overflow:hidden;background:radial-gradient(ellipse at 65% 30%,#3b183a66,transparent 65%),linear-gradient(145deg,#15101c,#09080e)}.case-card-visual img{width:100%;height:100%;object-fit:cover}.case-media-pending{position:absolute;inset:0;display:grid;place-items:center;text-align:center;font-size:13px;letter-spacing:2px;color:#947b90;padding:25px}.case-card-copy{display:block;padding:17px 16px 20px}.case-card-copy strong{display:block;font-size:16px;font-weight:600;margin-bottom:10px}.case-card-copy small{display:block;font-size:10px;line-height:1.6;color:#a3919f}.archive-project-card:disabled{opacity:.62}.archive-room[data-state=archive-entering] .archive-category-view,.archive-room[data-state=home-returning] .archive-category-view,.archive-room[data-state=project-entering] .archive-category-view,.archive-room[data-state=project-placeholder] .archive-category-view,.archive-room[data-state=archive-returning] .archive-category-view{visibility:hidden;pointer-events:none}.archive-room[data-state=archive-filtered] .archive-displays{pointer-events:none}.archive-case-page{display:block;background:#09070e;overflow:hidden}.case-hero-media{position:absolute;inset:0;background:radial-gradient(ellipse at 75% 40%,#35122c 0%,#17101f 40%,#09070e 80%)}.case-hero-media img{width:100%;height:100%;object-fit:cover}.case-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#09070ff5 0%,#09070fc4 25%,#09070f25 70%),linear-gradient(0deg,#08060c,transparent 25%)}.archive-case-page>.archive-project-back{position:absolute;left:38px;top:135px;margin:0;font-size:12px}.case-hero-copy{position:absolute;left:42px;top:310px;width:470px}.case-number{color:#f078c5;font-size:17px}.case-hero-copy h2{font-size:48px;line-height:1.15;text-align:left;margin:20px 0 18px;font-weight:600;overflow-wrap:anywhere}.case-services{font-size:14px;line-height:1.7;color:#f078c5}.case-hero-copy .case-summary{font-size:17px;line-height:1.7;color:#e9e3e8;margin:20px 0}.case-project-link{display:inline-block;padding:13px 20px;font-size:13px;color:#f078c5;text-decoration:none;margin-top:12px}.case-content-note{display:block;max-width:400px;font-size:14px;line-height:1.7;color:#b19eac;margin-top:30px}.archive-category-view [hidden]{display:none!important}
@media(prefers-reduced-motion:reduce){.archive-category-view,.archive-project-card{animation:none;transition:none}}
.case-card-copy{position:relative;width:100%;padding-right:43px}
.case-card-arrow{position:absolute;right:15px;top:18px;display:inline-flex;align-items:center;justify-content:center;font-size:42px;line-height:40px;color:var(--pink-text,#f078c5)}

/* Imported YouTube artwork: preserve the full composition. */
.case-card-visual{aspect-ratio:16/9}.case-card-visual img{object-fit:contain}
.archive-project-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.archive-screen:has(img) .archive-screen-title,.archive-screen:has(img) .archive-screen-id,.archive-screen:has(img) .archive-screen-note{display:none}
.archive-screen img{object-fit:cover;background:#08070b}
.archive-case-page .case-hero-media{left:470px;right:35px;top:180px;bottom:130px;background:none;display:flex;align-items:center}
.archive-case-page .case-hero-media img{height:auto;max-height:100%;object-fit:contain}
.archive-case-page .case-hero-shade{display:none}
.archive-case-page .case-hero-copy{left:40px;top:260px;width:385px}
.archive-case-page .case-hero-copy h2{font-size:36px;text-align:left}
.archive-project-card:focus-visible{outline:2px solid #f3b5dd;outline-offset:3px}

.archive-case-page.has-video .case-hero-media{bottom:160px;flex-direction:column;justify-content:center;gap:18px}
.case-hero-media video{width:100%;min-height:0;max-height:100%;object-fit:contain;background:#08070b}
.case-media-tabs{display:flex;justify-content:center;gap:12px;flex-shrink:0}
.case-media-tabs button{font-size:12px;margin:0;padding:10px 16px}
.case-media-tabs button[aria-pressed=true]{border-color:#d6b47b;color:#edd7af}
.has-video .case-content-note{padding:14px 0;border-top:1px solid #d6b47b55;color:#edd7af;font-size:15px}
.has-video .case-hero-copy{top:220px}
.has-video .case-hero-media img{min-height:0;max-height:90%}

.case-hero-media video{width:auto;max-width:100%;height:100%;border-radius:8px}
/* Marketplace artwork keeps its original proportions, including long rich-content layouts. */
.archive-project-card.is-marketplace .case-card-visual{aspect-ratio:4/3}
.archive-case-page.has-gallery .case-hero-media{display:block;overflow-y:auto;overscroll-behavior:contain;padding:0 14px 24px 0;scrollbar-color:#8f426c #100c15}
.archive-case-page.has-gallery .case-hero-media img{display:block;width:100%;height:auto;max-height:none;margin:0 0 20px;object-fit:contain}
/* Project detail only: the first artwork always fits the first screen. */
.archive-case-page{overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#8f426c #100c15}
.archive-case-page .case-hero-media,.archive-case-page.has-gallery .case-hero-media{display:flex;align-items:center;justify-content:center;overflow:hidden;padding:0}
.archive-case-page .case-hero-media img,.archive-case-page.has-gallery .case-hero-media img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;margin:0;min-height:0}
.archive-case-page .case-extra-media{position:absolute;top:100%;left:470px;right:35px;padding:40px 0 100px;display:flex;flex-direction:column;gap:30px}
.archive-case-page .case-extra-media img{display:block;width:100%;height:auto;object-fit:contain}
.archive-case-page.has-video .case-hero-media img,.archive-case-page.has-video .case-hero-media video{flex:1;min-height:0;height:0;object-fit:contain}
/* All frames in a series are discoverable without scrolling. */
.archive-case-page.has-series .case-hero-media{bottom:285px}
.case-gallery-picker{position:absolute;left:470px;right:35px;bottom:130px;height:130px;display:grid;grid-template-columns:repeat(auto-fit,minmax(65px,1fr));gap:8px}
.case-gallery-picker button{position:relative;min-width:0;height:130px;padding:5px;border:1px solid #684154;border-radius:8px;background:#100c15}
.case-gallery-picker img{display:block;width:100%;height:100%;object-fit:contain}
.case-gallery-picker span{position:absolute;bottom:3px;right:3px;padding:2px 5px;border-radius:4px;background:#100c15dd;font-size:12px}
.case-gallery-picker button[aria-pressed=true]{border-color:#f078c5;box-shadow:0 0 12px #f078c544}
.case-gallery-picker button:hover{border-color:#f3b5dd}
/* Approved Archive category composition. Scoped to category browsing. */
.archive-room[data-state=archive-filtered] .archive-stage{filter:contrast(.9) brightness(.19) saturate(.65) blur(3px);transition:filter .5s}
.archive-room[data-state=archive-filtered]{background:#08070b}
.archive-room[data-state=archive-filtered] .archive-ui{top:115px;left:38px;width:240px}
.archive-room[data-state=archive-filtered] .archive-ui>small{visibility:visible;font-size:13px;color:#bdb9c0;letter-spacing:0}
.archive-room[data-state=archive-filtered] .archive-ui h1{margin:12px 0 38px}
.archive-room[data-state=archive-filtered] .archive-ui::before{display:none}
.archive-room[data-state=archive-filtered] .archive-ui nav{width:240px;gap:5px}
.archive-room[data-state=archive-filtered] .archive-ui nav button{min-height:51px;border:0;border-radius:7px;gap:12px;padding:12px 12px;font-weight:400;box-shadow:none}
.archive-room[data-state=archive-filtered] .archive-ui nav .category-title{font-size:13px}
.archive-room[data-state=archive-filtered] .archive-ui nav .category-number,.archive-room[data-state=archive-filtered] .archive-ui nav .category-plus{display:none}
.archive-room[data-state=archive-filtered] .archive-ui nav button::before{content:'';width:7px;height:7px;flex:none;border-radius:50%;background:transparent}
.archive-room[data-state=archive-filtered] .archive-ui nav button[aria-pressed=true]{background:#b7408614;color:#f39bd6}
.archive-room[data-state=archive-filtered] .archive-ui nav button[aria-pressed=true]::before{background:#f078c5}
.archive-category-view{left:315px;right:38px;top:120px;bottom:90px;padding:0;background:none;border-radius:0;overflow:hidden}
.archive-category-view>header{height:140px;margin:0;gap:0}
.category-index{display:block;color:#ee8bcc;font-size:16px;margin-bottom:6px}
.category-heading{display:flex;align-items:baseline;gap:20px}
.archive-category-view h2{font-size:43px;color:#f4f2f5;line-height:1.12;margin:0 0 12px;font-weight:600;letter-spacing:-1px}
.category-total{font-size:25px;color:#85808d;white-space:nowrap}
.archive-category-view header p{max-width:none;font-size:16px;color:#b5b0bc;line-height:1.4}
.archive-category-view .category-reset{display:none}
.archive-project-cards{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:calc((100% - 16px)/2);gap:16px;max-height:none;height:calc(100% - 175px);overflow:auto;scrollbar-width:thin;scrollbar-color:#61516055 transparent;padding:0 4px 0 0;align-content:start}
.archive-project-card{position:relative;display:block;min-height:0;border:1px solid #77617144;border-radius:10px;background:#0c0b0e;grid-column:span 4;transition:border-color .25s,box-shadow .25s,filter .25s}
.archive-project-card[data-layout='0']{grid-column:span 5}
.archive-project-card[data-layout='1'],.archive-project-card[data-layout='3']{grid-column:span 3}
.archive-project-card[data-layout='4']{grid-column:span 5}
.archive-project-card .case-card-visual,.archive-project-card.is-marketplace .case-card-visual{position:absolute;inset:0 0 62px;width:100%;height:auto;aspect-ratio:auto;display:block;background:#0c0b0e;overflow:hidden}
.archive-project-card .case-card-visual img{width:100%;height:100%;object-fit:contain;transition:transform .3s,filter .3s}
.archive-project-card .case-card-copy{position:absolute;bottom:0;left:0;right:0;padding:10px 52px 10px 16px;background:linear-gradient(0deg,#08070bea,#08070b99);height:62px}
.archive-project-card .case-card-copy strong{font-size:14px;line-height:18px;margin:0 0 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.archive-project-card .case-card-copy small{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#aaa5af}
.case-card-number{position:absolute;top:13px;left:15px;color:#f7a5df;font-size:15px;background:#08070b8a;border-radius:4px;padding:2px 4px}
.archive-project-card .case-card-arrow{top:12px;right:13px;width:34px;height:34px;border:1px solid #af8fa566;border-radius:50%;font-size:22px;line-height:1;color:#d8cdd7}
.archive-project-card:hover:not(:disabled) .case-card-visual img{transform:scale(1.018);filter:brightness(1.06)}
.archive-project-card:hover:not(:disabled){border-color:#dc86bf77;box-shadow:0 0 20px #ee71c121}
.archive-project-card:hover .case-card-arrow{color:#f8b2e3;border-color:#f078c5}
.gallery-scroll-hint{display:block;text-align:center;font-size:10px;letter-spacing:1px;color:#77727e;padding-top:17px}

/* Native-format gallery: visual ratio belongs to the artwork, not its grid slot. */
.archive-project-cards{grid-auto-rows:1px;grid-auto-flow:row dense;align-items:start}
.archive-project-card{align-self:start;grid-column:span 4;height:auto;padding:0}
.archive-project-card[data-format=portrait]{grid-column:span 3}
.archive-project-card[data-format=square]{grid-column:span 4}
.archive-project-card[data-format=landscape]{grid-column:span 5}
.archive-project-card[data-format=wide]{grid-column:span 6}
.archive-project-card .case-card-visual,.archive-project-card.is-marketplace .case-card-visual{position:relative;inset:auto;height:auto;aspect-ratio:var(--image-ratio,1);width:100%;background:none}
.archive-project-card .case-card-visual img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
.archive-project-card .case-card-copy{position:relative;inset:auto;height:62px;width:100%;box-sizing:border-box;background:none}

.archive-project-cards{grid-template-columns:repeat(24,minmax(0,1fr))}
.archive-project-card[data-format=portrait]{grid-column:span 6}
.archive-project-card[data-format=square]{grid-column:span 8}
.archive-project-card[data-format=landscape]{grid-column:span 7}
.archive-project-card[data-format=landscape][data-layout='0'],.archive-project-card[data-format=landscape][data-layout='4']{grid-column:span 10}
.archive-project-card[data-format=wide]{grid-column:span 12}

/* Alternating justified rows. Width follows the original image ratio. */
.archive-project-cards{display:flex;flex-wrap:wrap;align-content:flex-start;align-items:flex-start;column-gap:16px;row-gap:28px;scrollbar-gutter:stable}
.archive-project-card{flex:none;box-sizing:border-box;min-width:0}
/* Subdued desktop gallery; touch and keyboard users retain clear artwork. */
@media (hover:hover) and (pointer:fine){
 .archive-project-card .case-card-visual img{filter:saturate(.68) brightness(.92);transition:transform .3s ease,filter .3s ease}
 .archive-project-card:hover:not(:disabled) .case-card-visual img,
 .archive-project-card:focus-visible .case-card-visual img{filter:saturate(1) brightness(1)}
}
@media (hover:none), (pointer:coarse){
 .archive-project-card .case-card-visual img,
 .archive-project-card:hover:not(:disabled) .case-card-visual img{filter:none;transform:none}
}
@media (prefers-reduced-motion:reduce){
 .archive-project-card .case-card-visual img{transition:none}
}
/* Captions blend into the artwork instead of forming a separate footer. */
.archive-project-card .case-card-copy{position:absolute;left:0;right:0;bottom:0;top:auto;z-index:2;height:76px;padding:24px 58px 12px 16px;background:none}
.archive-project-card .case-card-copy::before{content:'';position:absolute;inset:-65px 0 0;z-index:-1;pointer-events:none;background:linear-gradient(to bottom,transparent 0%,rgba(8,7,11,.12) 25%,rgba(8,7,11,.72) 65%,rgba(8,7,11,.94) 100%)}
.archive-project-card .case-card-number{z-index:2;background:none;padding:0;top:16px;left:18px;text-shadow:0 1px 8px #08070b}
.archive-project-card .case-card-visual::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 140px 100px at top left,rgba(8,7,11,.65),transparent 100%)}
.archive-project-card .case-card-arrow{top:auto;bottom:14px;background:#08070b33}
/* Plum preview tone fades away for pointer and keyboard focus. */
@media (hover:hover) and (pointer:fine){
 .archive-project-card .case-card-visual img{filter:saturate(.92) brightness(.94) contrast(1.03)}
 .archive-project-card .case-card-visual::before{content:'';position:absolute;inset:0;z-index:1;background:rgba(83,40,29,.07);mix-blend-mode:soft-light;pointer-events:none;opacity:1;transition:opacity .3s ease}
 .archive-project-card:hover:not(:disabled) .case-card-visual::before,.archive-project-card:focus-visible .case-card-visual::before{opacity:0}
 .archive-project-card:hover:not(:disabled) .case-card-visual img,.archive-project-card:focus-visible .case-card-visual img{filter:saturate(1) brightness(1)}
}
@media (prefers-reduced-motion:reduce){.archive-project-card .case-card-visual::before{transition:none}}
/* Reference polish: readable labels and soft corner shading. */
.archive-project-card .case-card-copy{height:88px;padding:26px 78px 14px 18px}
.archive-project-card .case-card-copy strong{text-transform:uppercase;font-size:16px;line-height:21px;margin-bottom:4px}
.archive-project-card .case-card-copy small{font-size:13px;line-height:18px;color:#d4cdd7}
.archive-project-card .case-card-number{font-size:18px;font-weight:400;line-height:24px;top:17px;left:19px;color:#f6a1da}
.archive-project-card .case-card-arrow{width:48px;height:48px;font-size:29px;right:17px;bottom:17px;border-color:#b58aa77a;background:#08070b55}
.archive-project-card .case-card-visual::after{z-index:1;background:radial-gradient(ellipse 48% 48% at 0% 0%,rgba(5,4,8,.88) 0%,rgba(5,4,8,.5) 33%,transparent 100%),radial-gradient(ellipse 48% 48% at 100% 100%,rgba(5,4,8,.9) 0%,rgba(5,4,8,.48) 36%,transparent 100%)}
.archive-project-card .case-card-copy::before{inset:-80px 0 0;background:linear-gradient(to bottom,transparent 0%,rgba(5,4,8,.08) 20%,rgba(5,4,8,.5) 55%,rgba(5,4,8,.9) 100%)}
/* Fine arrow geometry stays centered independently of font metrics. */
.archive-project-card .case-card-arrow{display:grid;place-items:center;padding:0;box-sizing:border-box;line-height:0}
.archive-project-card .case-card-arrow svg{display:block;width:25px;height:25px;flex:none}
/* Shared reference vignette for every gallery preview. Text remains above it. */
.archive-project-card .case-card-visual::after{
 z-index:1;
 background:
  linear-gradient(to top,rgba(0,0,0,.88) 0%,rgba(0,0,0,.62) 10%,rgba(0,0,0,.22) 24%,transparent 40%),
  radial-gradient(ellipse 42% 44% at 0% 0%,rgba(0,0,0,.72) 0%,rgba(0,0,0,.32) 42%,transparent 100%),
  radial-gradient(ellipse 34% 38% at 100% 100%,rgba(0,0,0,.24) 0%,transparent 100%),
  linear-gradient(to right,rgba(0,0,0,.2),transparent 17%,transparent 83%,rgba(0,0,0,.2)),
  linear-gradient(to bottom,rgba(0,0,0,.14),transparent 16%);
}
.archive-project-card .case-card-copy::before{content:none}
/* Search uses product names, service descriptions and keyword synonyms. */
.archive-category-view>header{position:relative}
.archive-search{position:absolute;right:0;bottom:18px;width:300px;box-sizing:border-box;border:1px solid #68415488;border-radius:18px;background:#100c15b3;color:#eee7ee;padding:8px 13px;font:inherit;font-size:12px;outline-offset:3px}
.archive-search:focus-visible{outline:1px solid #f078c5}
.archive-search::placeholder{color:#aaa0ac}
.archive-project-card .case-card-copy strong{font-size:15px}
a.archive-project-card{text-decoration:none;font-family:inherit;cursor:pointer}
.archive-catalog-link{position:absolute;bottom:22px;left:0;font-size:11px;color:#bc91ac;text-decoration:none}
.archive-catalog-link:hover{color:#f078c5}
.archive-catalog-link:focus-visible{outline:1px solid #f078c5;outline-offset:4px}
.archive-press-link{display:flex;flex-direction:column;gap:7px;margin-top:30px;padding:16px 12px;border:1px solid #a55e843a;border-radius:12px;background:#160e1880;text-decoration:none;color:#cdbcc8;transition:border-color .25s,background .25s}
.archive-press-link small{font-size:9px;letter-spacing:2px;color:#a48e9e}.archive-press-link strong{font-size:21px;letter-spacing:1px;color:#f1dbe9}.archive-press-link span{font-size:10px;line-height:1.5}.archive-press-link:hover{border-color:#e780b9;background:#2e1525c0}.case-press-link{display:inline-block;color:#f4a5d4;font-size:13px;margin:8px 0;text-underline-offset:5px}.case-press-link:hover{color:white}