/* One continuous studio, with content paced independently of the photographs. */
:root{--hero-image:url('assets/offering-workbench.webp');--brand-image:url('assets/offering-branding.webp');--launch-image:url('assets/offering-web-setup.webp');--operations-image:url('assets/offering-systems-support.webp')}
.content{width:min(1440px,90%)}
h1{font-size:clamp(56px,4.8vw,78px);margin-bottom:22px}
.site-header{min-height:88px;padding:20px 5%}
.site-header nav a{font-size:12px}
.hero{min-height:690px;padding:135px 0 65px}
.hero-copy h1{max-width:540px}
.hero-copy .lead{font-size:29px;max-width:405px;margin-bottom:28px}
.hero-art{inset:0 0 -20px 29%;background-image:var(--hero-image);background-size:cover;background-position:65% 45%;mask-image:linear-gradient(#000 0%,#000 75%,transparent)}
.hero-art:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--paper),transparent 32%)}
.hero .eyebrow{font-size:11px;margin-bottom:18px}
.story-shell{position:relative;background:radial-gradient(ellipse at 75% 40%,#eadbc855,transparent 65%)}
.package-story{display:grid;grid-template-columns:minmax(360px,.85fr) minmax(0,1.3fr);gap:25px;align-items:start}
.story-copy{position:relative;z-index:2}
.chapter{display:block;min-height:620px;padding:62px 0 64px;scroll-margin-top:20px}
.chapter .chapter-copy{max-width:465px;padding:0}
.chapter-copy>*{max-width:100%}
.chapter h2{font-size:clamp(52px,4.4vw,70px);margin-bottom:14px}
.chapter .price{font-size:32px;margin-bottom:21px}
.chapter-intro{font-size:28px;margin-bottom:25px}
.highlights{font-size:15px;line-height:1.5;margin-bottom:22px}
.highlights li{margin-bottom:8px}
.scope{margin:18px 0 23px;border:0}
.scope summary{font-size:14px;font-weight:700;min-height:54px;padding:12px 16px;border:1px solid #83735c;border-radius:6px;color:var(--ink);background:#fff9ee;box-shadow:0 2px 3px #493e2a0a}
.scope summary:hover{background:#fffdf7;border-color:var(--blue)}
.scope summary span{font-size:24px}
.scope[open] summary{margin-bottom:14px}
.scope>div{font-size:13px;background:transparent}
.scope li{margin-bottom:9px}
.chapter-copy>.quiet{margin-top:16px;margin-bottom:0;font-size:12px}
.chapter .button{font-size:14px;min-height:52px;padding:13px 24px}
.story-visual{position:sticky;top:40px;height:min(650px,calc(100svh - 80px));min-height:420px;margin:0;isolation:isolate}
.study{position:absolute;inset:0 -2vw 34px -40px;background-position:62% center;background-repeat:no-repeat;background-size:cover;opacity:0;transform:translateY(12px) scale(.985);transition:opacity .55s ease,transform .7s ease;mask-image:radial-gradient(ellipse 69% 66% at 57% 49%,#000 51%,transparent 78%)}
.study.is-active{opacity:1;transform:none}
.brand-study{background-image:var(--brand-image)}
.launch-study{background-image:var(--launch-image)}
.operations-study{background-image:var(--operations-image)}
.story-visual figcaption{position:absolute;bottom:28px;left:4%;right:4%;font-size:10px;color:var(--muted);text-align:center;letter-spacing:.025em}
.mobile-study{display:none}
.comparison{padding:52px 0 28px}
.comparison h2{font-size:52px}
.comparison-intro{font-size:14px}
.comparison-scroll{margin:27px 0 24px}
table{font-size:12px}
th,td{padding:15px 20px 15px 0}
thead th{font-size:14px}
thead th span{font-size:11px}
.ownership{gap:48px;font-size:12px}
.request-intro{padding:55px 0 45px;min-height:350px}
.request-intro h2{max-width:610px;font-size:62px}
.request-intro .serif{font-size:30px;max-width:500px;margin-bottom:14px}
.request-intro p{font-size:14px}
.request-art{inset:-30px 0 -65px;background-image:var(--brand-image);background-position:80% center;mask-image:linear-gradient(transparent,#000 20%,#000 70%,transparent)}
.request-workspace{padding:20px 0 70px}
.steps{max-width:680px;margin-bottom:42px}
.request-grid{gap:80px}
.request-summary h3{font-size:37px}
.summary-price{font-size:27px;margin-bottom:26px}
.request-summary ul{font-size:13px}
.custom-invitation{margin-top:38px}
.preview-pages-note{margin:100px 5% 0;padding:10px 0;color:var(--blue);font-size:13px}
@media(min-width:1700px){.hero{min-height:720px}.chapter{min-height:650px}.story-visual{top:55px;height:650px;max-height:calc(100svh - 80px)}}
@media(max-width:1100px){.site-header nav{gap:16px}.site-header nav a{font-size:11px}.hero-copy h1{max-width:475px}.hero-copy .lead{max-width:350px;font-size:27px}.package-story{grid-template-columns:minmax(320px,.9fr) minmax(0,1.1fr)}.chapter .chapter-copy{max-width:390px}.chapter-intro{font-size:26px}.highlights{font-size:14px}.request-grid{gap:45px}.request-summary h3{font-size:33px}.study{inset:0 -2vw 30px -20px}}
@media(max-width:900px){
  .content{width:88%}
  .site-header{position:relative;display:block;padding:22px 6% 5px;min-height:unset}
  .site-header nav{gap:3px 20px;margin-top:17px}.site-header nav a{font-size:11px;min-height:40px}
  h1{font-size:clamp(45px,8.4vw,65px)}
  .hero{min-height:640px;padding:30px 0 240px;align-items:flex-start}
  .hero-copy h1{max-width:600px;margin-bottom:20px}
  .hero-copy .lead{max-width:370px;font-size:26px;margin-bottom:25px}
  .hero .hero-art{inset:130px 0 -20px;background-size:auto 100%;background-position:75% bottom;mask-image:linear-gradient(transparent,#000 33%,#000 76%,transparent)}
  .hero-art:after{display:none}
  .package-story{display:block}.story-visual{display:none}.story-shell{background:none}
  .chapter{min-height:unset;padding:32px 0 38px}
  .chapter .chapter-copy{max-width:none}
  .chapter h2 br{display:none}.chapter h2{font-size:clamp(46px,8.8vw,62px);max-width:600px}
  .chapter .price{font-size:30px;margin-bottom:18px}
  .chapter-intro{font-size:26px;margin-bottom:10px}.chapter-intro br{display:none}
  .mobile-study{display:block;position:relative;margin:0 -6.8% 14px;padding-top:clamp(265px,65vw,470px);background-image:none}
  .mobile-study-art{position:absolute;inset:-25px 0 10px;background-position:66% center;background-size:cover;mask-image:radial-gradient(ellipse 72% 80% at 57% 48%,#000 48%,transparent 78%)}
  .brand-study .mobile-study-art{background-image:var(--brand-image)}
  .launch-study .mobile-study-art{background-image:var(--launch-image)}
  .operations-study .mobile-study-art{background-image:var(--operations-image)}
  .mobile-study figcaption{position:relative;font-size:9px;color:var(--muted);text-align:center;margin-top:0;padding:0 7% 5px}
  .highlights{font-size:14px;margin-bottom:18px}.scope{margin:15px 0 21px}.scope>div{background:transparent;font-size:13px}.scope summary{min-height:54px}
  .comparison{padding:35px 0 16px}.comparison h2{font-size:43px}.comparison-intro{font-size:13px}.comparison-scroll{margin:23px 0}.ownership{grid-template-columns:1fr;gap:0;font-size:11px}
  .request-intro{min-height:500px;padding:34px 0 255px;align-items:flex-start}
  .request-intro h2{font-size:53px;margin-bottom:16px}.request-intro .serif{font-size:27px}.request-intro p{font-size:13px}
  .request-art{inset:220px 0 -25px;background-size:auto 100%;background-position:72% bottom;mask-image:linear-gradient(transparent,#000 38%,#000 76%,transparent)}
  .request-workspace{padding:15px 0 50px}.mobile-selection{margin-bottom:17px}.steps{margin-bottom:30px}
  .request-grid{gap:36px}.form-main h3{font-size:28px}.package-options strong{font-size:16px}.package-options small{font-size:11px;max-width:170px}.package-options label{padding:18px 0;gap:9px}.package-options em{font-size:16px}
  .request-summary{padding-top:28px}.request-summary h3{font-size:33px}.custom-invitation{margin-top:28px}.preview-pages-note{margin:14px 6%}
}
@media(max-width:360px){h1{font-size:43px}.hero{min-height:650px}.hero-copy .lead{font-size:24px}.package-options strong{font-size:14px}.package-options em{font-size:14px}.package-options small{max-width:130px}.request-intro h2{font-size:46px}}
@media(prefers-reduced-motion:reduce){.study{transition:none;transform:none}}

.release-request{max-width:760px;padding:12px 0 32px}.release-request h3{font-size:clamp(29px,4vw,43px);line-height:1.15;margin-bottom:18px}.release-request p{max-width:630px;font-size:16px;line-height:1.6;margin-bottom:24px}.release-request .quiet{font-size:13px;margin-top:18px}.chapter a.button{display:inline-flex;text-decoration:none}
@media(max-width:900px){.hero{display:flex;flex-direction:column;padding:30px 0 0;min-height:0}.hero-copy{order:1}.hero .hero-art{position:relative;inset:auto;order:2;flex:none;width:100%;height:320px;margin-top:-10px;background-size:cover;background-position:65% 48%;mask-image:linear-gradient(transparent,#000 20%,#000 80%,transparent)}}
