/* TF2Seller / a compact product dossier, with the original project imagery. */
.case-page.tf2{--case-gold:#cbaa70;background:#09090c}
.case-page.tf2 .case-atmosphere{background:radial-gradient(ellipse at 80% 8%,#bd894c0d,transparent 42%),linear-gradient(180deg,#09090cd9,#09090c 70%),url('/assets/hero-redcity-v8.webp') center top/cover no-repeat}
.case-page.tf2 .case-topline{padding:24px 0 30px}
.case-page.tf2 .case-category{font-size:10px;letter-spacing:1.5px}
.case-page.tf2 .case-category>span:first-child{color:var(--case-gold)}
.case-page.tf2 .case-title-row{margin:18px 0 22px}
.case-page.tf2 .case-title-row h1{font-size:clamp(43px,8.1vw,118px);font-weight:500;letter-spacing:-.072em;line-height:1.1;background:linear-gradient(165deg,#faf9f7 24%,#a8a5a8 85%);-webkit-background-clip:text;background-clip:text;color:transparent}
.case-page.tf2 .case-title-stamp{border-color:#cbaa7044;color:var(--case-gold);width:108px}
.case-page.tf2 .case-title-stamp:before{background:var(--case-gold)}
.case-page.tf2 .case-title-stamp strong{-webkit-text-stroke-color:#cbaa7088;font-size:45px}
.case-page.tf2 .case-intro-row{padding-top:19px;margin-bottom:19px;gap:28px}
.case-page.tf2 .case-tagline{font-size:17px;line-height:1.65;max-width:570px;color:#bdbac0}
.case-page.tf2 .case-tags>span{border-color:#ffffff15;padding:7px 11px;font-size:10px;color:#99969f;background:#ffffff03}
.case-page.tf2 .tf2-project-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px 25px;margin:0 0 29px}
.case-page.tf2 .tf2-project-actions a{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;min-height:46px;padding:13px 21px;font-size:12px;line-height:1.4;transition:background .2s,color .2s,border-color .2s}
.case-page.tf2 .tf2-project-actions a:first-child{background:#e7e5e3;color:#141216;border:1px solid #e7e5e3}
.case-page.tf2 .tf2-project-actions a:first-child:hover{background:#fff;border-color:#fff}
.case-page.tf2 .tf2-project-actions a:last-child{color:#ddd7db;border-bottom:1px solid #ff4c5c66;padding-inline:0}
.case-page.tf2 .tf2-project-actions a:last-child:hover{color:#ff7782;border-color:#ff7782}
.case-page.tf2 .tf2-project-actions a:focus-visible{outline:2px solid #ff6976;outline-offset:5px}
.case-page.tf2 .tf2-project-actions a>span{font-size:19px}
.case-page.tf2 .case-hero{padding-bottom:49px}
.case-page.tf2 .case-cover{border-color:#cbaa702d;background:#0b0b0d;box-shadow:0 26px 80px #0007}
.case-page.tf2 .case-cover:before{border-color:#cbaa70a6;width:27px;height:27px}
.case-page.tf2 .case-cover:after{border-color:#d8d1c859;width:27px;height:27px}
.case-page.tf2 .case-cover-toolbar{padding:14px 22px;font-size:10px;letter-spacing:.8px;border-color:#ffffff12;background:#0e0e11}
.case-page.tf2 .case-cover-caption>i{background:var(--case-gold);box-shadow:0 0 12px #cbaa7055}
.case-page.tf2 .case-cover-image{aspect-ratio:2.2;padding:0}
.case-page.tf2 .case-cover-image>.object-canvas{display:none!important}
.case-page.tf2 .case-cover-image .case-cover-art{opacity:1!important;object-fit:cover;object-position:center 56%;filter:saturate(.9);transform:none!important}
.case-page.tf2 .case-terminal-screen{left:4.8%;top:19%;width:45%;transform:perspective(1400px) rotateY(5deg) rotateZ(-.8deg);border-color:#b0a38766;box-shadow:0 28px 65px #000e,0 0 0 5px #131114d9;opacity:1!important}
.case-page.tf2 .case-terminal-screen:before{border-color:#cbaa7059}
.case-page.tf2 .case-terminal-top{color:#c6bba6;padding:10px 12px;font-size:9px}
.case-page.tf2 .case-terminal-top i{background:var(--case-gold);box-shadow:0 0 9px #cbaa7077}
.case-page.tf2 .case-terminal-base{font-size:8px;padding:8px 12px}
.case-page.tf2 .case-cover>figcaption{padding:14px 22px;border-color:#ffffff12;font-size:11px}
.case-page.tf2 .case-cover-coordinate{font-size:9px}
.case-page.tf2 .case-about{grid-template-columns:.75fr 1.25fr;gap:48px;padding-top:33px;margin-bottom:56px;border-color:#ffffff17}
.case-page.tf2 .case-section-intro h2{font-size:clamp(24px,2.5vw,34px);margin-top:19px;line-height:1.32}
.case-page.tf2 .case-about-lead{font-size:14px;line-height:1.8;margin-top:21px;max-width:390px}
.case-page.tf2 .case-source-note{font-size:11px;margin-top:20px}
.case-page.tf2 .case-feature-label{margin:0 0 19px}
.case-page.tf2 .case-features{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid #ffffff15;background:linear-gradient(125deg,#ffffff05,transparent)}
.case-page.tf2 .case-feature{display:block;padding:20px;min-width:0;border:0}
.case-page.tf2 .case-feature:nth-child(odd){border-right:1px solid #ffffff12}
.case-page.tf2 .case-feature:nth-child(n+3){border-top:1px solid #ffffff12}
.case-page.tf2 .case-feature:last-child{grid-column:1/-1;border-right:0}
.case-page.tf2 .case-feature:before{display:none}
.case-page.tf2 .case-feature-number{display:block;font-size:10px;padding:0;margin-bottom:12px;color:#cbaa70aa}
.case-page.tf2 .case-feature>div{display:block}
.case-page.tf2 .case-feature h3{font-size:15px;line-height:1.45;color:#e0dce0}
.case-page.tf2 .case-feature p{font-size:12px;line-height:1.75;color:#99969f;margin:9px 0 0}
.case-page.tf2 .case-preview{padding-bottom:54px}
.case-page.tf2 .case-preview-heading{margin-bottom:25px;gap:20px}
.case-page.tf2 .case-preview-heading h2{font-size:clamp(25px,2.8vw,37px);margin-top:18px;line-height:1.3}
.case-page.tf2 .case-preview-heading>span{font-size:10px;color:#89858f}
.case-page.tf2 .case-story{grid-template-columns:1fr 1fr;gap:20px}
.case-page.tf2 .case-story-scene{display:flex;flex-direction:column;align-items:stretch;gap:25px;padding:27px 24px 24px;min-width:0;background:linear-gradient(145deg,#ffffff05,transparent 58%),#0e0d11;border-color:#ffffff17}
.case-page.tf2 .case-story-quote{order:0}
.case-page.tf2 .case-story-history{order:1}
.case-page.tf2 .case-story-copy h3{font-size:clamp(22px,2vw,28px);margin:16px 0 15px;line-height:1.32}
.case-page.tf2 .case-story-copy p{font-size:13px;line-height:1.75;max-width:430px}
.case-page.tf2 .case-story-number{font-size:9px;letter-spacing:1px}
.case-page.tf2 .case-story-label{margin-top:15px;font-size:8px;color:#807b87}
.case-page.tf2 .case-screen-frame,.case-page.tf2 .case-story-history .case-screen-frame{transform:none!important;opacity:1!important;margin-top:auto;border-color:#cbaa7033;box-shadow:0 14px 35px #0005;transition:none}
.case-page.tf2 .case-screen-bar{padding:10px;font-size:8px;background:#141217}
.case-page.tf2 .case-screen-bar>span:last-child{display:none}
.case-page.tf2 .case-screen-frame figcaption{font-size:10px;line-height:1.6;padding:11px;color:#918a99}
.case-page.tf2 .case-exchange-scene{order:2;grid-column:1/-1;padding:27px 28px 23px;border-color:#ff4c5c25;background:radial-gradient(ellipse at 55% 90%,#ff314109,transparent 65%),#0e0d11}
.case-page.tf2 .case-exchange-title{grid-template-columns:.35fr 1fr auto;align-items:center;gap:25px}
.case-page.tf2 .case-exchange-title .case-story-number{grid-column:auto}
.case-page.tf2 .case-exchange-title h3{font-size:22px;line-height:1.35}
.case-page.tf2 .case-exchange-title .case-story-label{font-size:8px;max-width:145px;padding:0}
.case-page.tf2 .case-exchange-path{margin:30px 0 23px;grid-template-columns:1fr 55px 1fr 55px 1fr 55px 1fr}
.case-page.tf2 .case-exchange-symbol{width:49px;height:49px;font-size:18px;margin-bottom:14px;border-color:#ff4c5c35}
.case-page.tf2 .case-exchange-symbol svg{width:28px;height:28px}
.case-page.tf2 .case-exchange-connector{margin-top:25px}
.case-page.tf2 .case-exchange-node strong{font-size:15px}
.case-page.tf2 .case-exchange-node p{font-size:11px;margin-top:5px}
.case-page.tf2 .case-exchange-kicker{font-size:8px;margin-bottom:5px}
.case-page.tf2 .case-exchange-note{font-size:11px;line-height:1.75;padding-top:18px}
.case-page.tf2 .case-purchase{padding:34px 38px;margin-bottom:10px;gap:30px}
.case-page.tf2 .case-purchase h2{font-size:clamp(27px,3vw,39px);margin-top:19px;line-height:1.25}
.case-page.tf2 .case-purchase-copy p{font-size:13px;margin-top:18px}
.case-page.tf2 .case-purchase-link{padding:24px;gap:19px 25px;min-width:285px}
.case-page.tf2 .case-purchase-link strong{font-size:36px}
.case-page.tf2 .case-next{padding:28px 0 33px}
.case-page.tf2 .case-next h3{font-size:28px;margin-top:12px}
.case-page.tf2 .case-next-visual{width:170px;aspect-ratio:1.65}
@media(max-width:900px){
 .case-page.tf2 .case-about{grid-template-columns:1fr;gap:27px}
 .case-page.tf2 .case-about-lead{max-width:660px}
 .case-page.tf2 .case-title-stamp{width:78px}
 .case-page.tf2 .case-title-stamp strong{font-size:37px}
 .case-page.tf2 .case-intro-row{align-items:flex-start;gap:16px}
 .case-page.tf2 .case-exchange-title{grid-template-columns:1fr 2fr}
 .case-page.tf2 .case-exchange-title .case-story-label{display:none}
 .case-page.tf2 .case-exchange-path{grid-template-columns:1fr 28px 1fr 28px 1fr 28px 1fr}
}
@media(max-width:600px){
 .case-page.tf2 .case-topline{padding:21px 0 25px}
 .case-page.tf2 .case-title-row{margin:18px 0}
 .case-page.tf2 .case-title-row h1{font-size:9.3vw;letter-spacing:-.07em}
 .case-page.tf2 .case-title-stamp{display:none}
 .case-page.tf2 .case-category{font-size:9px;letter-spacing:.8px}
 .case-page.tf2 .case-intro-row{padding-top:16px;margin-bottom:18px;gap:14px}
 .case-page.tf2 .case-tagline{font-size:14px;line-height:1.7}
 .case-page.tf2 .case-tags{gap:6px}
 .case-page.tf2 .case-tags>span{font-size:9px;padding:6px 9px}
 .case-page.tf2 .tf2-project-actions{gap:12px 19px;margin-bottom:24px}
 .case-page.tf2 .tf2-project-actions a{font-size:11px;padding:11px 14px;gap:13px;min-height:43px}
 .case-page.tf2 .case-cover-image{aspect-ratio:1.3}
 .case-page.tf2 .case-cover-image .case-cover-art{object-position:60% center}
 .case-page.tf2 .case-cover-toolbar{padding:12px;font-size:8px;letter-spacing:.1px}
 .case-page.tf2 .case-cover-coordinate{font-size:8px}
 .case-page.tf2 .case-terminal-screen{width:60%;left:5%;top:32%;transform:rotate(-1.5deg);box-shadow:0 15px 35px #000e,0 0 0 3px #131114d9}
 .case-page.tf2 .case-terminal-top{padding:6px;font-size:6px;gap:5px;letter-spacing:.2px}
 .case-page.tf2 .case-terminal-base{display:none}
 .case-page.tf2 .case-cover>figcaption{padding:12px;font-size:9px;gap:8px}
 .case-page.tf2 .case-cover>figcaption>a{font-size:10px}
 .case-page.tf2 .case-hero{padding-bottom:34px}
 .case-page.tf2 .case-about{padding-top:26px;margin-bottom:37px;gap:24px}
 .case-page.tf2 .case-section-intro h2{font-size:25px;margin-top:17px}
 .case-page.tf2 .case-about-lead{font-size:13px;margin-top:17px}
 .case-page.tf2 .case-feature{padding:16px 13px}
 .case-page.tf2 .case-feature h3{font-size:13px}
 .case-page.tf2 .case-feature p{font-size:11px;line-height:1.65}
 .case-page.tf2 .case-feature-number{margin-bottom:9px;font-size:9px}
 .case-page.tf2 .case-preview{padding-bottom:37px}
 .case-page.tf2 .case-preview-heading{gap:12px;margin-bottom:20px}
 .case-page.tf2 .case-preview-heading h2{font-size:26px;margin-top:17px}
 .case-page.tf2 .case-story{grid-template-columns:1fr;gap:16px}
 .case-page.tf2 .case-story-scene{padding:22px 17px 17px;gap:21px}
 .case-page.tf2 .case-story-copy h3{font-size:24px}
 .case-page.tf2 .case-story-copy p{font-size:12px}
 .case-page.tf2 .case-exchange-scene{padding:22px 17px}
 .case-page.tf2 .case-exchange-title{display:block}
 .case-page.tf2 .case-exchange-title h3{margin-top:15px;font-size:23px}
 .case-page.tf2 .case-exchange-path{grid-template-columns:1fr 25px 1fr;gap:25px 0;margin-top:25px}
 .case-page.tf2 .case-purchase{padding:26px 21px;gap:24px}
 .case-page.tf2 .case-purchase h2{font-size:29px}
 .case-page.tf2 .case-purchase-link{min-width:0;padding:21px;gap:15px}
 .case-page.tf2 .case-purchase-link strong{font-size:33px}
 .case-page.tf2 .case-next-visual{width:110px}
 .case-page.tf2 .case-next h3{font-size:23px}
}