/* ==========================================================================
   THEME STUDIO — The Gallery  (showcase site for Speedy Websites' Total CMS themes)
   Prefix: .tst   Fonts: Instrument Serif (display), Instrument Sans (text), IBM Plex Mono (labels)
   A quiet white room: the themes are the only colour on the walls.
   ========================================================================== */

.tst{
  --wall:#f3f1ec; --wall-2:#ebe8e1; --paper:#fbfaf7; --mat:#ffffff; --ink:#151515; --muted:#69655d; --line:#dcd7cd;
  --frame:#1a1a1a; --dot:#d2392c; --code:#17171a;
  --serif:'Instrument Serif',Georgia,serif; --sans:'Instrument Sans',system-ui,sans-serif; --mono:'IBM Plex Mono',ui-monospace,monospace;
  background:var(--wall); color:var(--ink); font:400 17px/1.6 var(--sans); -webkit-font-smoothing:antialiased;
}
:where(.tst) *,:where(.tst) *::before,:where(.tst) *::after{box-sizing:border-box}
:where(.tst) h1,:where(.tst) h2,:where(.tst) h3,:where(.tst) h4,:where(.tst) p,:where(.tst) ul,:where(.tst) ol,:where(.tst) figure,:where(.tst) pre{margin:0}
:where(.tst) ul,:where(.tst) ol{padding:0;list-style:none}
:where(.tst) a{color:inherit;text-decoration:none}
:where(.tst) img{display:block;max-width:100%;height:auto}
body.tst{margin:0}
.tst .container{width:min(1280px,100% - 48px);margin-inline:auto}
.tst .narrow{width:min(860px,100% - 48px);margin-inline:auto}
.tst .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.tst a:focus-visible,.tst button:focus-visible,.tst select:focus-visible,.tst label:focus-visible,.tst summary:focus-visible{outline:2px solid var(--ink);outline-offset:3px}

/* ---- type ---- */
.tst .eyebrow{display:flex;align-items:center;gap:12px;font:500 12px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:22px}
.tst .eyebrow::before{content:'';width:28px;height:1px;background:currentColor}
.tst .h2{font:400 clamp(38px,4.8vw,64px)/1.02 var(--serif);letter-spacing:-.01em;margin-bottom:22px}
.tst .h2 em,.tst h1 em{font-style:italic}
.tst .lead{font-size:20px;line-height:1.55;color:var(--muted);max-width:560px}
.tst .muted{color:var(--muted)}
.tst .mono{font-family:var(--mono)}

/* ---- buttons ---- */
.tst .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:500 15px/1 var(--sans);padding:16px 26px;border-radius:999px;border:1px solid var(--ink);cursor:pointer;transition:background .2s,color .2s,transform .2s}
.tst .btn-ink{background:var(--ink);color:var(--paper)}
.tst .btn-ink:hover{background:#000;transform:translateY(-2px)}
.tst .btn-line{background:transparent;color:var(--ink)}
.tst .btn-line:hover{background:var(--ink);color:var(--paper)}
.tst .btn .arrow{transition:transform .2s}
.tst .btn:hover .arrow{transform:translateX(4px)}
.tst .actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.tst .link{font-weight:500;border-bottom:1px solid currentColor;padding-bottom:2px}
.tst .link:hover{color:var(--muted)}

/* ==========================================================================
   HEADER
   ========================================================================== */
.tst-sticky{position:sticky;top:0;z-index:50}
.tst .header{position:sticky;top:0;z-index:50;background:rgba(243,241,236,.86);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .2s}
.tst.tst-sticky .header{position:relative}
.tst .header .container{display:flex;align-items:center;justify-content:space-between;gap:24px;height:78px}
.tst .wordmark{display:flex;align-items:baseline;gap:10px;font:400 28px/1 var(--serif);white-space:nowrap}
.tst .wordmark small{font:500 10.5px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.tst .nav{display:flex;align-items:center;gap:34px}
.tst .nav a{font-size:15px;font-weight:500;padding:6px 0;border-bottom:1px solid transparent}
.tst .nav a:hover,.tst .nav a[aria-current="page"]{border-color:var(--ink)}
.tst .nav a.cta{padding:11px 20px;border:1px solid var(--ink);border-radius:999px}
.tst .nav a.cta:hover{background:var(--ink);color:var(--paper)}
.tst .nav-toggle{position:absolute;opacity:0;pointer-events:none}
.tst .nav-toggle-label{display:none;cursor:pointer}
@media (max-width:900px){
  .tst .nav-toggle-label{display:block}
  .tst .nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:6px 24px 26px;background:var(--wall);border-bottom:1px solid var(--line)}
  .tst .nav-toggle:checked ~ .nav{display:flex}
  .tst .nav a{padding:16px 0;border-bottom:1px solid var(--line)}
  .tst .nav a:hover,.tst .nav a[aria-current="page"]{border-color:var(--line)}
  .tst .nav a.cta{margin-top:20px;text-align:center}
}

/* ==========================================================================
   FRAMES — the "artworks"
   ========================================================================== */
.tst .frame{display:block;position:relative;background:var(--mat);padding:clamp(10px,1.4vw,20px);border:5px solid var(--frame);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.06),0 34px 60px -34px rgba(0,0,0,.45),0 10px 22px -14px rgba(0,0,0,.3)}
.tst .frame img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.tst .frame.tall img{aspect-ratio:4/5}
.tst .phone{position:relative;width:min(230px,42%);padding:9px;border-radius:34px;background:var(--frame);box-shadow:0 30px 50px -24px rgba(0,0,0,.5)}
.tst .phone::before{content:'';position:absolute;top:15px;left:50%;width:56px;height:14px;margin-left:-28px;border-radius:10px;background:var(--frame);z-index:1}
.tst .phone img{width:100%;aspect-ratio:390/844;object-fit:cover;object-position:top;border-radius:26px}

/* museum wall label */
.tst .placard{display:grid;gap:4px;margin-top:22px}
.tst .placard .no{display:flex;align-items:center;gap:10px;font:500 11.5px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tst .placard h3{font:400 28px/1.1 var(--serif)}
.tst .placard h3 small{font:italic 400 20px/1 var(--serif);color:var(--muted)}
.tst .placard p{font-size:15px;color:var(--muted);max-width:440px}
.tst .new{display:inline-flex;align-items:center;gap:7px;color:var(--dot)}
.tst .new::before{content:'';width:9px;height:9px;border-radius:50%;background:var(--dot)}
.tst .swatches{display:flex;gap:5px;margin-top:8px}
.tst .swatches i{width:16px;height:16px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}

/* ==========================================================================
   HOME HERO
   ========================================================================== */
.tst .hero{padding:70px 0 110px}
.tst .hero-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:70px;align-items:center}
.tst .hero h1{font:400 clamp(56px,7.6vw,112px)/.94 var(--serif);letter-spacing:-.02em;margin-bottom:30px}
.tst .hero .lead{font-size:21px}
.tst .showing{display:flex;flex-wrap:wrap;gap:30px;margin-top:54px;padding-top:26px;border-top:1px solid var(--line)}
.tst .showing li{display:grid;gap:2px}
.tst .showing strong{font:400 40px/1 var(--serif)}
.tst .showing span{font:500 11.5px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tst .hang{position:relative;padding:0 0 60px 0}
.tst .hang .phone{position:absolute;right:-14px;bottom:0;width:min(200px,30%);transform:rotate(3deg)}
.tst .hang .frame{margin-right:12%}
.tst .hang .placard{max-width:62%}
.tst .spot{position:relative}
.tst .spot::before{content:'';position:absolute;left:10%;right:10%;top:-80px;height:220px;background:radial-gradient(ellipse at center,rgba(255,255,255,.9),rgba(255,255,255,0) 70%);pointer-events:none;z-index:-1}

/* ==========================================================================
   SECTIONS
   ========================================================================== */
.tst .section{padding:120px 0;position:relative}
.tst .paper{background:var(--paper)}
.tst .dark{background:var(--ink);color:var(--paper)}
.tst .dark .muted,.tst .dark .lead,.tst .dark .eyebrow{color:#a7a39b}
.tst .section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;margin-bottom:70px}
.tst .section-head .h2{margin-bottom:0;max-width:760px}
.tst .section-head p{max-width:400px}
.tst .rule{height:1px;background:var(--line);border:0;margin:0}

/* ---- the wall: salon hang (home) and catalogue grid (themes) ---- */
.tst .wall{display:grid;grid-template-columns:repeat(12,1fr);gap:90px 48px;align-items:end}
.tst .work{grid-column:span 4;display:block}
.tst .work.w5{grid-column:span 5}
.tst .work.w7{grid-column:span 7}
.tst .work.w6{grid-column:span 6}
.tst .work .frame{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.tst a.work:hover .frame{transform:translateY(-8px);box-shadow:inset 0 0 0 1px rgba(0,0,0,.06),0 50px 70px -36px rgba(0,0,0,.5),0 14px 26px -16px rgba(0,0,0,.3)}
.tst .work .placard h3{transition:color .2s}
.tst a.work:hover .placard h3 em{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.tst .work .view{font:500 12px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;margin-top:12px;opacity:0;transform:translateX(-6px);transition:.25s}
.tst a.work:hover .view{opacity:1;transform:none}

/* catalogue filter (pure CSS: radios + :has) */
.tst .filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:64px}
.tst .filters input{position:absolute;opacity:0;pointer-events:none}
.tst .filters label{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border:1px solid var(--line);border-radius:999px;font-size:15px;font-weight:500;cursor:pointer;background:var(--paper);transition:.2s}
.tst .filters label span{font:500 11px/1 var(--mono);color:var(--muted)}
.tst .filters label:hover{border-color:var(--ink)}
.tst .filters input:checked + label{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.tst .filters input:checked + label span{color:#a7a39b}
.tst .filters input:focus-visible + label{outline:2px solid var(--ink);outline-offset:3px}
.tst .catalogue{display:grid;grid-template-columns:repeat(3,1fr);gap:80px 44px}
.tst .catalogue .work{grid-column:auto}
.tst:has(#kit-plumbing:checked) .catalogue .work:not([data-kit="plumbing"]),
.tst:has(#kit-cafe:checked) .catalogue .work:not([data-kit="cafe"]),
.tst:has(#kit-accommodation:checked) .catalogue .work:not([data-kit="accommodation"]),
.tst:has(#kit-counselling:checked) .catalogue .work:not([data-kit="counselling"]){display:none}

/* ---- rooms (the kits) ---- */
.tst .rooms{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:24px}
.tst .room{display:flex;flex-direction:column;padding:30px 28px;background:var(--mat);border:1px solid var(--line);transition:border-color .2s,transform .25s}
.tst a.room:hover{border-color:var(--ink);transform:translateY(-4px)}
.tst .room .no{font:500 11.5px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tst .room h3{font:400 34px/1.05 var(--serif);margin:14px 0 10px}
.tst .room p{color:var(--muted);font-size:15.5px;margin-bottom:26px}
.tst .stack{position:relative;height:120px;margin-top:auto}
.tst .stack img{position:absolute;bottom:0;width:62%;aspect-ratio:16/10;object-fit:cover;object-position:top;border:3px solid var(--frame);box-shadow:0 14px 24px -14px rgba(0,0,0,.45)}
.tst .stack img:nth-child(1){left:0;transform:rotate(-4deg)}
.tst .stack img:nth-child(2){left:19%;bottom:10px;z-index:1}
.tst .stack img:nth-child(3){left:38%;transform:rotate(4deg);z-index:2}

/* ---- includes ---- */
.tst .includes{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.tst .includes li{padding:38px 34px 42px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.tst .includes .num{font:500 12px/1 var(--mono);color:var(--muted)}
.tst .includes h3{font:400 28px/1.1 var(--serif);margin:18px 0 10px}
.tst .includes p{color:var(--muted);font-size:16px}
.tst .dark .includes,.tst .dark .includes li{border-color:#333}

/* ---- settings → site ---- */
.tst .setting-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:center}
.tst .setting-grid > *,.tst .hero-grid > *,.tst .exhibit-grid > *,.tst .detail-grid > *,.tst .contact-grid > *{min-width:0}
.tst .code{background:var(--code);color:#e6e3dc;border-radius:14px;padding:28px 30px;font:400 14px/1.75 var(--mono);overflow-x:auto;box-shadow:0 30px 60px -36px rgba(0,0,0,.6)}
.tst .code .c{color:#7d7a73}
.tst .code .k{color:#f2c27a}
.tst .code .s{color:#9fd3a8}
.tst .code .tab{display:flex;gap:7px;margin-bottom:20px}
.tst .code .tab i{width:11px;height:11px;border-radius:50%;background:#3a3a3e}
.tst .code .tab span{margin-left:10px;font-size:12px;color:#7d7a73}

/* ---- steps ---- */
.tst .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:50px;counter-reset:s}
.tst .steps li{counter-increment:s;padding-top:28px;border-top:1px solid var(--ink)}
.tst .steps li::before{content:counter(s,decimal-leading-zero);display:block;font:400 64px/1 var(--serif);font-style:italic;margin-bottom:20px}
.tst .steps h3{font:600 19px/1.3 var(--sans);margin-bottom:10px}
.tst .steps p{color:var(--muted)}
.tst .steps.five{grid-template-columns:repeat(5,1fr);gap:34px}
.tst .steps.five li::before{font-size:50px}

/* ---- CTA ---- */
.tst .cta{padding:130px 0;text-align:center}
.tst .cta h2{font:400 clamp(46px,7vw,100px)/.98 var(--serif);letter-spacing:-.02em;margin-bottom:26px}
.tst .cta p{max-width:540px;margin:0 auto;font-size:19px}
.tst .cta .actions{justify-content:center}
.tst .dark .btn-ink{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.tst .dark .btn-ink:hover{background:#fff}
.tst .dark .btn-line{border-color:#5a5852;color:var(--paper)}
.tst .dark .btn-line:hover{background:var(--paper);color:var(--ink)}

/* ==========================================================================
   PAGE HERO (inner pages)
   ========================================================================== */
.tst .page-hero{padding:80px 0 70px}
.tst .crumbs{display:flex;flex-wrap:wrap;gap:10px;font:500 12px/1.4 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:34px}
.tst .crumbs li+li::before{content:'/';margin-right:10px}
.tst .crumbs a:hover{color:var(--ink)}
.tst .page-hero h1{font:400 clamp(52px,7vw,100px)/.96 var(--serif);letter-spacing:-.02em;margin-bottom:26px;max-width:980px}

/* ==========================================================================
   EXHIBIT (one theme)
   ========================================================================== */
.tst .exhibit-head{padding:70px 0 54px}
.tst .exhibit-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:70px;align-items:end}
.tst .exhibit-head .no{display:flex;align-items:center;gap:12px;font:500 12px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:18px}
.tst .exhibit-head h1{font:400 clamp(64px,9vw,136px)/.9 var(--serif);letter-spacing:-.025em}
.tst .exhibit-head h1 em{display:block;font-size:.42em;line-height:1.15;color:var(--muted);letter-spacing:-.01em;margin-top:12px}
.tst .exhibit-head .lead{margin-top:26px;max-width:640px}
.tst .meta{display:grid;gap:0;border-top:1px solid var(--ink)}
.tst .meta li{display:flex;justify-content:space-between;gap:20px;padding:13px 0;border-bottom:1px solid var(--line);font-size:15px}
.tst .meta li span:first-child{font:500 11.5px/1.9 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tst .meta li span:last-child{text-align:right}
.tst .exhibit-head .actions{margin-top:26px}
.tst .exhibit-head .actions .btn{flex:1}

/* ---- the fitting room ---- */
.tst .fitting{padding:0 0 110px}
.tst .toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 30px;padding:16px 18px;background:var(--mat);border:1px solid var(--line);border-bottom:0;border-radius:16px 16px 0 0}
.tst .tool{display:flex;align-items:center;gap:12px}
.tst .tool small{font:500 11px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tst .seg{display:inline-flex;padding:4px;border-radius:999px;background:var(--wall)}
.tst .seg button{display:inline-flex;align-items:center;gap:7px;border:0;background:transparent;font:500 14px/1 var(--sans);color:var(--muted);padding:9px 14px;border-radius:999px;cursor:pointer}
.tst .seg button svg{width:16px;height:16px}
.tst .seg button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.tst .tool select{font:500 14px/1 var(--sans);color:var(--ink);padding:10px 34px 10px 14px;border:1px solid var(--line);border-radius:999px;background:var(--paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23151515' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center;-webkit-appearance:none;appearance:none;cursor:pointer}
.tst .presets{display:flex;gap:8px}
.tst .presets button{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border:1px solid var(--line);border-radius:999px;background:var(--paper);font:500 13.5px/1 var(--sans);cursor:pointer}
.tst .presets button i{display:inline-flex;width:26px;height:26px;border-radius:50%;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.tst .presets button i b{flex:1}
.tst .presets button[aria-pressed="true"]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.tst .stage{position:relative;display:flex;justify-content:center;align-items:flex-start;padding:46px 30px 54px;min-height:420px;background:radial-gradient(ellipse 70% 60% at 50% 0%,#fff,rgba(255,255,255,0) 70%),var(--wall-2);border:1px solid var(--line);border-radius:0 0 16px 16px;overflow:hidden}
.tst .device{position:relative;flex:none;transition:width .35s,height .35s}
.tst .device .bar{display:flex;align-items:center;gap:7px;height:38px;padding:0 14px;background:#e4e1da;border-radius:10px 10px 0 0;border:1px solid #d3cfc6;border-bottom:0}
.tst .device .bar i{width:10px;height:10px;border-radius:50%;background:#c9c5bc}
.tst .device .bar span{flex:1;margin:0 40px;height:22px;border-radius:6px;background:var(--paper);font:400 11.5px/22px var(--mono);color:var(--muted);text-align:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.tst .viewport{position:relative;overflow:hidden;background:#fff;box-shadow:0 40px 70px -40px rgba(0,0,0,.55),0 0 0 1px #d3cfc6}
.tst .viewport iframe{position:absolute;top:0;left:0;border:0;transform-origin:0 0;background:#fff}
.tst [data-device="tablet"] .bar,.tst [data-device="phone"] .bar{display:none}
.tst [data-device="tablet"] .device{padding:18px;border-radius:30px;background:var(--frame)}
.tst [data-device="phone"] .device{padding:11px;border-radius:40px;background:var(--frame)}
.tst [data-device="tablet"] .viewport{border-radius:12px;box-shadow:none}
.tst [data-device="phone"] .viewport{border-radius:30px;box-shadow:none}
.tst [data-device="tablet"] .device,.tst [data-device="phone"] .device{box-shadow:0 40px 70px -36px rgba(0,0,0,.55)}
.tst .fit-note{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:16px;font-size:14px;color:var(--muted)}

/* ---- details ---- */
.tst .detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}
.tst .palette{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:16px}
.tst .chip{background:var(--mat);border:1px solid var(--line);padding:8px 8px 12px}
.tst .chip i{display:block;aspect-ratio:1.2;margin-bottom:10px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.tst .chip b{display:block;font:500 13px/1.3 var(--sans)}
.tst .chip small{font:400 12px/1.3 var(--mono);color:var(--muted);text-transform:uppercase}
.tst .specimen{display:grid;gap:18px}
.tst .specimen > div{display:grid;grid-template-columns:120px 1fr;gap:24px;align-items:center;padding:22px 24px;background:var(--mat);border:1px solid var(--line)}
.tst .specimen .aa{font-size:64px;line-height:1}
.tst .specimen b{display:block;font:500 15px/1.3 var(--sans)}
.tst .specimen small{font:400 12px/1.5 var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.tst .specimen p{font-size:19px;line-height:1.4;margin-top:6px}
.tst .page-list{border-top:1px solid var(--ink)}
.tst .page-list li{display:grid;grid-template-columns:44px 1fr auto;gap:16px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--line)}
.tst .page-list .n{font:500 12px/1 var(--mono);color:var(--muted)}
.tst .page-list b{font:400 24px/1.2 var(--serif)}
.tst .page-list a{font:500 12px/1 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.tst .page-list a:hover{color:var(--ink)}
.tst .box{display:grid;gap:0;border-top:1px solid var(--ink)}
.tst .box li{display:grid;grid-template-columns:1fr auto;gap:16px;padding:15px 0;border-bottom:1px solid var(--line)}
.tst .box li span:last-child{font:400 14px/1.6 var(--mono);color:var(--muted);text-align:right}
.tst .sub{font:400 30px/1.1 var(--serif);margin-bottom:24px}
.tst .stack-gap > * + *{margin-top:70px}

/* ---- related ---- */
.tst .related{display:grid;grid-template-columns:repeat(3,1fr);gap:44px}

/* ==========================================================================
   FAQ + FORM
   ========================================================================== */
.tst .faq{border-top:1px solid var(--ink)}
.tst .faq details{border-bottom:1px solid var(--line)}
.tst .faq summary{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0;cursor:pointer;list-style:none;font:400 26px/1.25 var(--serif)}
.tst .faq summary::-webkit-details-marker{display:none}
.tst .faq summary::after{content:'+';font:300 30px/1 var(--sans);flex:none;transition:transform .25s}
.tst .faq details[open] summary::after{transform:rotate(45deg)}
.tst .faq details p{padding:0 0 26px;color:var(--muted);max-width:720px}

.tst .contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;align-items:start}
.tst .info{display:grid;gap:22px;margin-top:40px}
.tst .info li{display:grid;gap:4px}
.tst .info small{font:500 11.5px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tst .info a{font:400 24px/1.3 var(--serif)}
.tst .info a:hover{color:var(--muted)}
.tst .form{padding:44px;background:var(--mat);border:1px solid var(--line)}
.tst .form .row2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.tst .form .row2 > *{min-width:0}
.tst .form .field{margin-bottom:24px}
.tst .form label{display:block;font:500 11.5px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.tst .form input,.tst .form select,.tst .form textarea{width:100%;min-width:0;padding:14px 0;font:400 17px/1.4 var(--sans);color:var(--ink);background:transparent;border:0;border-bottom:1px solid #bdb8ae;border-radius:0}
.tst .form select{-webkit-appearance:none;appearance:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23151515' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 2px center}
.tst .form input:focus,.tst .form select:focus,.tst .form textarea:focus{outline:none;border-bottom-color:var(--ink);box-shadow:0 1px 0 var(--ink)}
.tst .form .note{font-size:14px;color:var(--muted);margin:0 0 26px}
.tst .form-tcms{display:block;min-width:0;max-width:100%}
.tst .form-tcms :is(.field,.form-field,.form-group){min-width:0;max-width:100%}
.tst .form-tcms .form-group-icon{display:none}
.tst .form-tcms .help{display:none}
.tst .form-tcms :is(input:not([type=checkbox]):not([type=radio]):not([type=submit]),select,textarea){box-sizing:border-box;width:100%;max-width:100%;height:auto;margin:0}
.tst .form-tcms select{padding-right:24px;text-overflow:ellipsis}
.tst .form-tcms :is(input,select,textarea){box-shadow:none}
.tst .form-tcms textarea{min-height:120px;resize:vertical}
.tst .form-tcms .select-clear-button{display:none}
.tst .form-done{display:none;margin-top:4px;font:400 26px/1.3 var(--serif);color:var(--ink)}
.tst .form:has(form.success) .form-done{display:block}
.tst .form:has(form.success) form{display:none}
.tst .form button[type=submit],.tst .form-tcms button[type=submit]{font:500 15px/1 var(--sans);padding:17px 28px;border-radius:999px;border:0;background:var(--ink);color:var(--paper);cursor:pointer}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.tst .footer{padding:100px 0 0;background:var(--wall);border-top:1px solid var(--line)}
.tst .foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:50px}
.tst .footer p,.tst .footer li{color:var(--muted);font-size:15.5px}
.tst .footer h3{font:500 11.5px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;margin-bottom:18px}
.tst .footer ul{display:grid;gap:10px}
.tst .footer a:hover{color:var(--ink)}
.tst .footer .wordmark{margin-bottom:18px}
.tst .big-mark{margin-top:90px;font:400 clamp(70px,16vw,240px)/.8 var(--serif);letter-spacing:-.035em;text-align:center;white-space:nowrap;color:var(--ink);opacity:.92;user-select:none}
.tst .big-mark em{font-style:italic}
.tst .bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:26px 0;margin-top:40px;border-top:1px solid var(--line);font:500 11.5px/1.6 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1100px){
  .tst .rooms{grid-template-columns:repeat(2,1fr)}
  .tst .steps.five{grid-template-columns:repeat(3,1fr)}
  .tst .catalogue,.tst .related{grid-template-columns:repeat(2,1fr)}
  .tst .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .tst .section{padding:90px 0}
  .tst .hero-grid,.tst .setting-grid,.tst .exhibit-grid,.tst .detail-grid,.tst .contact-grid{grid-template-columns:1fr;gap:56px}
  .tst .wall{grid-template-columns:1fr 1fr;gap:64px 32px}
  .tst .work,.tst .work.w5,.tst .work.w6{grid-column:span 1}
  .tst .work.w7{grid-column:1/-1}
  .tst .includes{grid-template-columns:1fr 1fr}
  .tst .steps{grid-template-columns:1fr;gap:40px}
  .tst .steps.five{grid-template-columns:1fr 1fr}
  .tst .toolbar{border-radius:16px 16px 0 0}
}
@media (max-width:640px){
  .tst{font-size:16px}
  .tst .container,.tst .narrow{width:calc(100% - 32px)}
  .tst .header .container{height:68px}
  .tst .wordmark{font-size:24px}
  .tst .wordmark small{display:none}
  .tst .hero{padding:40px 0 80px}
  .tst .hero .lead{font-size:18px}
  .tst .actions .btn{width:100%}
  .tst .hang{padding-bottom:40px}
  .tst .hang .phone{right:0}
  .tst .hang .frame{margin-right:16%}
  .tst .hang .placard{max-width:70%}
  .tst .wall,.tst .catalogue,.tst .related{grid-template-columns:1fr;gap:56px}
  .tst .work.w7{grid-column:auto}
  .tst .rooms,.tst .includes,.tst .steps.five{grid-template-columns:1fr}
  .tst .includes li{padding:30px 24px}
  .tst .exhibit-head .actions .btn{flex:auto}
  .tst .toolbar{padding:14px}
  .tst .tool{flex-wrap:wrap}
  .tst .presets{flex-wrap:wrap}
  .tst .stage{padding:28px 12px 34px}
  .tst .specimen > div{grid-template-columns:1fr;gap:10px}
  .tst .form{padding:28px 20px}
  .tst .form .row2{grid-template-columns:1fr;gap:0}
  .tst .foot-grid{grid-template-columns:1fr;gap:36px}
  .tst .code{font-size:12.5px;padding:22px 18px}
}
@media (prefers-reduced-motion:reduce){
  .tst *,.tst *::before,.tst *::after{transition:none!important;animation:none!important}
}
