
/* DESIGN FIDELITY REVISION — 2026-10-29
   Preserve the user's original two-rectangle workshop composition and Orator Std typography.
   Adobe Fonts web project: https://use.typekit.net/ojg2uta.css
*/
:root{--mono:'orator-std','Orator Std','Courier New',Courier,monospace}
body{font-family:var(--mono);font-weight:400}
.site-header{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none}
.header-rule{display:block;width:100%;height:auto;object-fit:contain}
.primary-nav a{font-family:var(--mono);font-weight:400;letter-spacing:.075em;font-size:clamp(11px,.98vw,14px)}
.eyebrow,.kicker,.text-link,.date-soon,.btn{font-family:var(--mono);font-weight:400}
/* Actual workshop PSD: patterned background, two simple cream rectangles, no added title banner. */
.workshop-detail-hero{min-height:0;padding:clamp(34px,5vw,76px) 0 86px;background-position:center top;background-size:cover;background-repeat:no-repeat}
.detail-outer{width:min(1270px,calc(100% - 78px));max-width:1270px;grid-template-columns:1fr 1fr;gap:30px;align-items:stretch}
.detail-paper{background:#fffaf5;border:10px solid #f6eee7;padding:clamp(25px,3.6vw,55px);min-height:570px;display:flex;flex-direction:column;align-items:stretch}
.detail-paper>.eyebrow{font:400 clamp(11px,1.05vw,14px)/1.5 var(--mono);letter-spacing:.18em;text-align:center;margin:0 0 28px;color:var(--red)}
.detail-paper h1,.detail-paper h1.workshop-letterpress-title{font:400 clamp(19px,2.08vw,30px)/1.47 var(--mono);letter-spacing:.13em;text-transform:uppercase;margin:0 0 22px;color:var(--red);max-width:100%;overflow-wrap:break-word;text-align:left}
.detail-rule{display:block;width:100%;height:auto;aspect-ratio:3300/59;object-fit:contain;margin:0 0 26px}
.detail-paper>p{font:400 clamp(12px,1.17vw,15px)/2 var(--mono);letter-spacing:.085em;text-transform:uppercase;color:var(--red);margin:0;max-width:100%}
.detail-lower{margin-top:auto;padding-top:28px;width:100%;gap:13px}
.detail-lower .eyebrow{width:100%;text-align:center;font:400 13px/1.5 var(--mono);letter-spacing:.14em;margin:0}
.detail-lower .btn{min-height:55px;width:100%;text-align:center;font:400 13px/1.5 var(--mono);letter-spacing:.10em;padding:14px 12px}
.detail-photo{min-height:570px;padding:18px;border:none;background:#fffaf5;display:flex;align-items:stretch;justify-content:center;overflow:hidden}
.detail-photo>img{width:100%;height:100%;min-height:0;object-fit:cover}
/* Remove the invented oversized workshop index page banner. */
.workshop-index-heading{display:none!important}
.workshop-index-section{padding:60px 0 98px}
.workshop-index-intro{margin:0 0 35px;border-bottom:1px solid #deafb1;padding-bottom:22px;display:flex;justify-content:space-between;align-items:baseline;gap:30px}
.workshop-index-intro h1{font:400 clamp(25px,3.4vw,42px)/1.1 var(--mono);letter-spacing:.14em;color:var(--red)}
.workshop-index-intro p{font:400 13px/1.7 var(--mono);color:var(--ink);max-width:470px}
/* The user's red stacked logo is the only oversized display graphic.
   Live headings match the original Orator Std aesthetic rather than generic sans-serif. */
.intro-layout h2,.section-head h2,.feature-text h3,.home-market h2,.party-teaser h2,.updates-teaser h2,.shop-heading h1,.private-intro h2,.inquiry h3,.updates-description h2,.interior-title h1,.card-body h3,.workshop-index-grid .workshop-card:first-child h3{
 font-family:var(--mono);font-weight:400;letter-spacing:.045em;line-height:1.25;text-transform:uppercase}
.intro-layout h2{font-size:clamp(31px,3.6vw,52px);letter-spacing:.025em}
.intro-layout h2 em{font:inherit;font-style:normal;letter-spacing:inherit}
.section-head h2{font-size:clamp(32px,4vw,53px)}
.feature-text h3{font-size:clamp(23px,2.6vw,35px)}
.home-market h2,.party-teaser h2,.updates-teaser h2{font-size:clamp(29px,3.9vw,51px)}
.shop-heading h1,.interior-title h1{font-size:clamp(31px,4.5vw,60px);letter-spacing:.06em}
.card-body h3{font-size:clamp(17px,1.65vw,22px);letter-spacing:.04em}
.private-intro h2,.updates-description h2{font-size:clamp(26px,3vw,38px)}
.inquiry h3{font-size:23px}
.workshop-index-grid .workshop-card:first-child h3{font-size:clamp(21px,2.1vw,29px)}
/* Clean white masthead and original stacked red logo at the bottom of each page. */
.site-footer{background:#fffaf4}
.footer-top img{width:clamp(140px,15vw,215px);height:auto;object-fit:contain}
/* Keep high-resolution Photoshop patterns and handwriting crisp by avoiding rescaling the line height. */
.red-scribble{background-size:contain;aspect-ratio:3300 / 59}
@media(max-width:760px){
 .primary-nav a{font-size:13px}
 .workshop-detail-hero{padding:26px 0 48px;background-size:auto 100%;background-position:center top}
 .detail-outer{width:min(100% - 32px,600px);grid-template-columns:1fr;gap:22px}
 .detail-paper{min-height:440px;padding:27px 28px;border-width:7px}
 .detail-paper>.eyebrow{margin-bottom:21px;font-size:12px}
 .detail-paper h1,.detail-paper h1.workshop-letterpress-title{font-size:clamp(19px,5.2vw,26px);line-height:1.5;letter-spacing:.11em;margin:0 0 18px}
 .detail-paper>p{font-size:clamp(11px,3vw,13px);line-height:1.8}
 .detail-rule{margin-bottom:19px}
 .detail-photo{min-height:0;height:clamp(330px,95vw,550px);padding:11px}
 .detail-photo>img{min-height:0;height:100%}
 .detail-followup{padding:25px 0}
 .workshop-index-intro{display:block}
 .workshop-index-intro p{margin-top:12px}
 .intro-layout h2{font-size:clamp(28px,8vw,38px)}
 .section-head h2{font-size:clamp(32px,9vw,44px)}
 .feature-text h3{font-size:26px}
 .home-market h2,.party-teaser h2,.updates-teaser h2{font-size:clamp(30px,8vw,42px)}
 .workshop-index-grid .workshop-card:first-child h3{font-size:23px}
 .card-body h3{font-size:18px}
 .shop-heading h1{font-size:clamp(28px,8vw,41px)}
 .footer-top img{width:160px}
}
@media(prefers-reduced-motion:reduce){.float-art{transform:none!important}}
