/* TKWS showroom — editorial workshop direction */
:root{
  --work-ink:#242424;
  --work-ink-2:#303030;
  --work-paper:#faf9f6;
  --work-paper-2:#f0ede7;
  --work-accent:#ff8a64;
  --work-accent-dark:#a32d0c;
  --work-line-dark:rgba(255,255,255,.22);
  --work-line-light:rgba(36,36,36,.16);
  --work-max:1180px;
}
html{scroll-behavior:smooth;background:var(--work-ink)}
body.showroom-page{margin:0;background:var(--work-ink);color:var(--work-paper);overflow-x:hidden}
/* Keep readable type sizes when the shared UI stylesheet finishes loading. */
body.showroom-page main {
  --tk-type-h1: clamp(2.25rem, 4.4vw, 3.5rem);
  --tk-type-h2: clamp(1.75rem, 3.3vw, 2.5rem);
  --tk-type-h4: clamp(1.375rem, 2vw, 1.75rem);
  --tk-type-body: 1.125rem;
  --tk-type-small: 1rem;
  --tk-type-caption: .875rem;
}
html body.showroom-page main :is(h1, h2, h3) {
  font-family: var(--font-body);
  font-weight: 700;
  overflow-wrap: anywhere;
  text-wrap: pretty;
}
.showroom-kicker, .workshop-package { --tk-type-body: .875rem; }
.workshop-section, .scope-lab { scroll-margin-top: 88px; }
.showroom-page main :is(a, button):focus-visible {
  outline: 3px solid currentColor;
  outline-offset: 4px;
}
.showroom-page .showroom-hero h1 { font-size: var(--tk-type-h1); }
.showroom-page .workshop-section__head h2,
.showroom-page .showroom-closing h2 { font-size: var(--tk-type-h2); }
.showroom-page .demo-specimen h3,
.showroom-page .scope-sheet h3 { font-size: var(--tk-type-h4); }
.showroom-page .showroom-hero__lead,
.showroom-page .showroom-process__steps p,
.showroom-page .showroom-closing p { font-size: var(--tk-type-body); line-height: 1.7; }
.showroom-specimen__top, .demo-specimen__meta { flex-wrap: wrap; }
.showroom-specimen__bar > span:last-child { min-width: 0; overflow-wrap: anywhere; }
.showroom-page .scope-sheet__top { font-size: .8125rem; line-height: 1.6; }
.showroom-page .scope-sheet__top b { font-size: 1rem; }
@media (max-width: 720px) {
  .showroom-hero__actions { display: grid; grid-template-columns: 1fr; }
  .showroom-kicker { letter-spacing: .08em; line-height: 1.6; }
}

.showroom-shell{width:min(var(--work-max),calc(100% - 40px));margin-inline:auto}
.showroom-kicker{display:flex;align-items:center;gap:8px;margin:0;color:var(--work-accent);font:800 10px/1.2 var(--font-body);letter-spacing:.15em;text-transform:uppercase}
.showroom-kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px rgba(255,138,100,.12)}

.showroom-hero{position:relative;min-height:auto;padding:72px 0 76px;overflow:hidden;border-bottom:1px solid var(--work-line-dark);isolation:isolate}
.showroom-hero__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,1fr);gap:clamp(32px,4vw,56px);align-items:center}
.showroom-hero h1{max-width:680px;margin:20px 0 24px;color:#fbfdfd;font-family:var(--font-display);font-size:clamp(52px,6.6vw,92px);font-weight:800;line-height:1.12;letter-spacing:-.025em}
.showroom-hero h1 span{color:var(--work-accent)}
.showroom-hero__lead{max-width:560px;margin:0;color:#e4e0da;font-size:clamp(15px,1.4vw,18px);line-height:1.65}
.showroom-hero__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.showroom-button{display:inline-flex;min-height:46px;align-items:center;justify-content:center;gap:8px;padding:11px 16px;border:1px solid rgba(229,242,250,.28);border-radius:6px;background:transparent;color:#faf9f6;font:700 1rem/1.4 var(--font-body);text-decoration:none;transition:transform .18s ease,border-color .18s ease,background .18s ease,color .18s ease}
.showroom-button:hover,.showroom-button:focus-visible{transform:translateY(-2px);border-color:var(--work-accent);color:var(--work-accent)}
.showroom-button--accent{border-color:var(--work-accent);background:var(--work-accent);color:var(--work-ink)}
.showroom-button--accent:hover,.showroom-button--accent:focus-visible{background:#ffb39a;color:var(--work-ink)}
.showroom-button--ink{border-color:var(--work-ink);background:var(--work-ink);color:#fff}
.showroom-button--ink:hover,.showroom-button--ink:focus-visible{border-color:var(--work-accent-dark);background:var(--work-accent-dark);color:#fff}
.showroom-button--paper{border-color:rgba(36,36,36,.28);color:var(--work-ink)}
.showroom-button--paper:hover,.showroom-button--paper:focus-visible{border-color:var(--work-accent-dark);color:var(--work-accent-dark)}

.showroom-specimen{position:relative;padding:0;background:#303030;border:1px solid #77716a;box-shadow:0 16px 32px rgba(0,0,0,.18)}
.showroom-specimen__top{position:relative;min-height:44px;padding:12px 14px;display:flex;align-items:center;gap:8px;background:rgba(245,246,239,.96);color:#56514d;font:700 .75rem/1.5 var(--font-body);letter-spacing:.1em;text-transform:uppercase}
.showroom-specimen__top i{width:7px;height:7px;border-radius:50%;background:#41d79d;box-shadow:0 0 0 3px rgba(65,215,157,.15)}
.showroom-specimen__top b{margin-left:auto;color:var(--work-ink);font-weight:700;letter-spacing:0;text-transform:none}
.showroom-specimen__browser{display:block;overflow:hidden;border:1px solid #77716a;background:var(--work-paper);transform:none;box-shadow:none}
.showroom-specimen__bar{min-height:34px;padding:8px 10px;display:flex;align-items:center;justify-content:space-between;gap:8px;background:#f4f2ed;border-bottom:1px solid #dedbd5;color:#56514d;font-size:.75rem}
.showroom-specimen__dots{display:flex;gap:4px}.showroom-specimen__dots i{width:7px;height:7px;border-radius:50%;background:#ff625d}.showroom-specimen__dots i:nth-child(2){background:#ffca45}.showroom-specimen__dots i:nth-child(3){background:#36c66b}
.showroom-specimen__browser img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top;background:#e8e5df}
.showroom-specimen__foot{position:relative;min-height:44px;padding:12px 14px;display:flex;align-items:center;gap:8px;background:#242424;color:#e4e0da;font-size:.875rem}
.showroom-specimen__foot strong{color:#fff}.showroom-specimen__foot a{margin-left:auto;color:var(--work-accent);font-weight:800}
.showroom-scroll{display:none!important;position:absolute;bottom:28px;left:max(20px,calc((100vw - var(--work-max))/2));display:flex;align-items:center;gap:10px;color:#bcb6ae;font-size:10px;letter-spacing:.09em;text-transform:uppercase}.showroom-scroll i{width:36px;height:1px;background:var(--work-accent)}

.showroom-disclaimer{padding:18px 0;border-bottom:1px solid var(--work-line-dark);background:#303030}
.showroom-disclaimer__inner{display:flex;gap:12px;align-items:flex-start;color:#e4e0da;font-size:1rem;line-height:1.7}.showroom-disclaimer__inner strong{color:#fff}.showroom-disclaimer__mark{flex:0 0 auto;padding:5px 7px;border:1px solid rgba(255,138,100,.5);color:var(--work-accent);font:700 .8125rem/1.5 var(--font-body);letter-spacing:.08em;text-transform:uppercase}

.workshop-section{position:relative;padding:clamp(76px,9vw,126px) max(20px,calc((100vw - var(--work-max))/2)) clamp(76px,9vw,112px) max(58px,calc((100vw - var(--work-max))/2 + 84px));overflow:hidden}
.workshop-section--paper{background:var(--work-paper);color:var(--work-ink)}
.workshop-section--paper2{background:var(--work-paper-2);color:var(--work-ink)}
.workshop-section--ink{background:var(--work-ink);color:var(--work-paper)}
.workshop-section--ink2{background:var(--work-ink-2);color:var(--work-paper)}
.workshop-rail{position:absolute;top:0;bottom:0;left:max(24px,calc((100vw - var(--work-max))/2 + 16px));width:1px;background:currentColor;opacity:.2}
.workshop-rail span{position:absolute;top:42px;left:-17px;padding:4px 6px;background:inherit;color:var(--work-accent-dark);font:700 .8125rem/1.5 var(--font-body);letter-spacing:.08em}.workshop-section--ink .workshop-rail span,.workshop-section--ink2 .workshop-rail span{color:var(--work-accent)}
.workshop-rail i{position:absolute;top:88px;left:-2px;width:4px;height:58px;background:var(--work-accent)}
.workshop-section__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(270px,400px);gap:34px;align-items:end;margin-bottom:42px}
.workshop-section__head h2{max-width:760px;margin:15px 0 0;font-family:var(--font-display);font-size:clamp(44px,5.5vw,76px);font-weight:800;line-height:1.2;letter-spacing:-.025em}
.workshop-section--paper .workshop-section__head h2,.workshop-section--paper2 .workshop-section__head h2{color:var(--work-ink)}
.workshop-section__head>p{margin:0;color:inherit;opacity:1;font-size:1.125rem;line-height:1.7}
.workshop-package{display:inline-flex;align-items:center;gap:8px;color:var(--work-accent-dark);font:700 .875rem/1.5 var(--font-body);letter-spacing:.11em;text-transform:uppercase}.workshop-section--ink .workshop-package,.workshop-section--ink2 .workshop-package{color:var(--work-accent)}
.workshop-package b{padding:5px 8px;border:1px solid currentColor;font-size:.875rem;letter-spacing:0}

.specimen-grid{display:grid;gap:22px}.specimen-grid--two{grid-template-columns:repeat(2,minmax(0,1fr))}.specimen-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}
.demo-specimen{position:relative;min-width:0;border-top:1px solid currentColor;padding-top:14px}.workshop-section--paper .demo-specimen,.workshop-section--paper2 .demo-specimen{border-color:rgba(36,36,36,.18)}.workshop-section--ink .demo-specimen,.workshop-section--ink2 .demo-specimen{border-color:rgba(226,245,255,.16)}
.demo-specimen__meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;font:700 .8125rem/1.5 var(--font-body);letter-spacing:.11em;text-transform:uppercase;opacity:1}.demo-specimen__meta span:first-child{color:var(--work-accent-dark)}.workshop-section--ink .demo-specimen__meta span:first-child,.workshop-section--ink2 .demo-specimen__meta span:first-child{color:var(--work-accent)}
.demo-specimen__window{display:block;overflow:hidden;border:1px solid #bcb6ae;background:#e8e5df;box-shadow:12px 12px 0 var(--work-accent)}.workshop-section--ink .demo-specimen__window,.workshop-section--ink2 .demo-specimen__window{box-shadow:12px 12px 0 rgba(255,138,100,.18)}
.demo-specimen__browserbar{min-height:34px;padding:8px 10px;display:flex;align-items:center;justify-content:space-between;gap:8px;background:#f4f2ed;border-bottom:1px solid #dedbd5;color:#56514d;font-size:.75rem}.demo-specimen__browserbar span{display:flex;gap:4px}.demo-specimen__browserbar i{width:6px;height:6px;border-radius:50%;background:#ff625d}.demo-specimen__browserbar i:nth-child(2){background:#ffca45}.demo-specimen__browserbar i:nth-child(3){background:#36c66b}
.demo-specimen__window img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;background:#e8e5df;transition:transform .28s ease}.demo-specimen__window:hover img{transform:scale(1.018)}
.demo-specimen__body{padding:22px 4px 0}.demo-specimen h3{margin:0;font-family:var(--font-display);font-size:clamp(27px,2.6vw,38px);line-height:1.25;letter-spacing:-.02em}.demo-specimen__body>p{max-width:52ch;margin:12px 0 0;opacity:1;font-size:1.125rem;line-height:1.7}.demo-specimen__tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}.demo-specimen__tags span{padding:5px 8px;border:1px solid currentColor;opacity:1;font-size:.8125rem;line-height:1.5;font-weight:600}.demo-specimen__actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}

.scope-lab{background:var(--work-paper-2);color:var(--work-ink)}
.scope-lab__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);gap:clamp(40px,8vw,104px);align-items:start;margin-top:52px}
.scope-list{border-top:1px solid rgba(36,36,36,.4)}
.scope-list button{position:relative;width:100%;padding:17px 44px 17px 0;display:grid;grid-template-columns:42px 1fr;gap:12px;text-align:left;color:var(--work-ink);border:0;border-bottom:1px solid rgba(36,36,36,.22);background:transparent;cursor:pointer;transition:padding .18s ease,background .18s ease}.scope-list button:hover,.scope-list button.is-active{padding-left:13px;background:#fff0e9;box-shadow:inset 3px 0 0 var(--work-accent-dark)}
.scope-list button>span{color:rgba(36,36,36,.52);font:700 .875rem/1.5 var(--font-body)}.scope-list button b{display:block;font:700 1.125rem/1.4 var(--font-body);letter-spacing:0}.scope-list button small{display:block;margin-top:4px;color:#56514d;font-size:.9375rem;line-height:1.6}.scope-list button>i{position:absolute;top:50%;right:7px;width:19px;height:19px;margin-top:-10px;border:1px solid rgba(36,36,36,.58);border-radius:50%}.scope-list .is-active>i::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--work-ink)}
.scope-sheet{position:relative;padding:25px;background:var(--work-paper);border-top:5px solid #f1c65d;box-shadow:14px 14px 0 var(--work-ink)}
.scope-sheet::before{content:"SCOPE SHEET / V.01";position:absolute;top:-27px;left:-5px;color:#756b4f;font:700 .75rem/1.5 var(--font-body);letter-spacing:.12em;text-transform:uppercase}
.scope-sheet__top{display:flex;justify-content:space-between;gap:14px;padding-bottom:14px;border-bottom:1px solid #dedbd5;color:#56514d;font:700 .8125rem/1.5 var(--font-body);letter-spacing:.11em;text-transform:uppercase}.scope-sheet__top b{color:var(--work-accent-dark);font-size:13px;letter-spacing:0}.scope-sheet h3{margin:27px 0 7px;font-family:var(--font-body);font-size:1.75rem;letter-spacing:-.02em}.scope-sheet__copy{margin:0;color:#56514d;font-size:1.125rem;line-height:1.7}.scope-sheet__list{display:grid;gap:8px;margin:18px 0 20px;padding:16px 0;border-top:1px solid #dedbd5;border-bottom:1px solid #dedbd5;list-style:none}.scope-sheet__list li{display:flex;align-items:center;gap:8px;color:#403d39;font-size:12px}.scope-sheet__list li::before{content:"✓";color:var(--work-accent-dark);font-weight:900}.scope-sheet__concepts{margin:0 0 18px;color:#56514d;font-size:12px}.scope-sheet__concepts strong{color:var(--work-ink)}

.showroom-process__steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:56px;border-top:1px solid rgba(229,242,250,.18)}.showroom-process__steps article{position:relative;min-height:210px;padding:24px 20px 10px 0;border-right:1px solid rgba(229,242,250,.18)}.showroom-process__steps article+article{padding-left:20px}.showroom-process__steps article:last-child{border-right:0}.showroom-process__steps span{color:#c9c3bb;font:700 .875rem/1.5 var(--font-body)}.showroom-process__steps i{display:block;width:38px;height:4px;margin:28px 0 15px;background:var(--work-accent)}.showroom-process__steps h3{margin:0 0 8px;font-family:var(--font-display);font-size:1.5rem;letter-spacing:-.02em}.showroom-process__steps p{margin:0;color:#e4e0da;font-size:1rem;line-height:1.7}

.showroom-closing{position:relative;padding:clamp(80px,11vw,150px) max(20px,calc((100vw - var(--work-max))/2));overflow:hidden;background:#242424}.showroom-closing>*{position:relative;z-index:1}.showroom-closing h2{max-width:860px;margin:20px 0 0;font-family:var(--font-display);font-size:clamp(48px,6vw,82px);line-height:1.2;letter-spacing:-.025em}.showroom-closing p{max-width:560px;margin:24px 0 0;color:#e4e0da;font-size:15px;line-height:1.65}.showroom-closing__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}

@media(max-width:1020px){
  .showroom-hero{min-height:auto}.showroom-hero__grid{grid-template-columns:1fr}.showroom-specimen{width:min(760px,100%);margin-inline:auto}.showroom-scroll{display:none}
  .workshop-section__head,.scope-lab__grid{grid-template-columns:1fr}.specimen-grid--three{grid-template-columns:repeat(2,minmax(0,1fr))}.showroom-process__steps{grid-template-columns:repeat(2,minmax(0,1fr))}.showroom-process__steps article:nth-child(2){border-right:0}.showroom-process__steps article:nth-child(n+3){border-top:1px solid rgba(229,242,250,.18)}
}
@media(max-width:720px){
  .showroom-shell{width:min(var(--work-max),calc(100% - 40px))}.showroom-hero{padding:40px 0 48px}.showroom-hero h1{font-size:clamp(48px,14vw,68px)}.showroom-specimen{width:100%;padding:0;box-shadow:none}.showroom-specimen__foot{font-size:.875rem;flex-wrap:wrap}.showroom-specimen__foot span:nth-child(2){display:none}
  .workshop-section{padding:48px 20px}.workshop-rail{display:none}.workshop-section__head{margin-bottom:30px}.workshop-section__head h2{font-size:clamp(40px,12vw,58px)}
  .specimen-grid--two,.specimen-grid--three{grid-template-columns:1fr}.demo-specimen__actions{display:grid;grid-template-columns:1fr}.demo-specimen__actions .showroom-button{width:100%}
  .scope-lab__grid{gap:34px}.scope-sheet{padding:20px;box-shadow:8px 8px 0 var(--work-ink)}.showroom-process__steps{grid-template-columns:1fr}.showroom-process__steps article,.showroom-process__steps article+article{min-height:auto;padding:20px 0;border-right:0;border-bottom:1px solid rgba(229,242,250,.18)}.showroom-process__steps article:nth-child(n+3){border-top:0}.showroom-process__steps article:last-child{border-bottom:0}
  .showroom-closing{padding:76px 20px}.showroom-closing h2{font-size:clamp(44px,13vw,62px)}.showroom-closing__actions{display:grid;grid-template-columns:1fr}.showroom-closing__actions .showroom-button{width:100%}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.001ms!important}}
