/* Homepage: clear choices, tighter pacing, the same cinematic studio language. */
.home-refresh .flagship { min-height: 0; padding-top: clamp(44px,5vw,74px); }
.home-refresh .flagship-copy h1 { font-size: clamp(48px,6.1vw,94px); }
.home-refresh .hero-products { height: clamp(360px,35vw,560px); margin-top: 0; }
.home-refresh .hero-shirt-main { width: min(40vw,550px); margin-left: max(-20vw,-275px); }
.home-refresh .hero-shirt-left { width: min(32vw,460px); margin-left: max(-36vw,-505px); }
.home-refresh .hero-shirt-right { width: min(32vw,460px); margin-left: min(3vw,48px); }
.home-refresh .flagship-bottom { margin-top: 0; }
.home-refresh .studio-panel .studio-copy h2 { font-size: clamp(50px,5.4vw,82px); }
.studio-link { color: #fff; display: inline-flex; gap: 20px; padding: 14px 0; border-bottom: 1px solid #ffffff50; }
.studio-link:hover { color: #ff8bb0; }
.home-refresh .features-section { padding-block: clamp(54px,6vw,84px); }
.home-refresh .feature-card { min-height: 400px; height: 440px; flex-basis: clamp(250px,23vw,365px); }
.home-refresh .feature-card-copy { padding: 26px; }
.home-refresh .feature-card-copy h3 { font-size: clamp(24px,2vw,29px); }
.home-refresh .section-space { padding-block: clamp(56px,6vw,90px); }
.home-refresh .lineup-section { background: var(--paper); }
.home-refresh .section-intro { margin-bottom: 28px; }
.home-refresh .premium-rail .catalog-card { flex-basis: clamp(260px,24vw,370px); }
.home-refresh .catalog-card-copy h2 { font-size: 24px; }
.home-refresh .catalog-card-copy { flex-direction: column; gap: 14px; padding-top: 20px; }
.home-refresh .catalog-card-copy strong { text-align: left; font-size: 16px; padding: 0; }
.home-refresh .card-actions { gap: 12px; padding-top: 18px; }
.home-refresh .card-actions > .text-link { display: none; }
.home-refresh .catalog-image { border-radius: 26px; }
.home-refresh .rail-bottom { margin-top: 20px; }
.custom-print-banner { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; min-height: 420px; margin-block: 32px 76px; border: 1px solid var(--line); border-radius: 32px; background: radial-gradient(ellipse at 90% 55%,#6d67b82b,transparent 60%),var(--surface); }
.custom-banner-copy { padding: clamp(30px,4vw,60px); z-index: 2; }
.custom-banner-copy h2 { font-size: clamp(38px,4vw,62px); margin: 0 0 24px; }
.custom-banner-copy > p:not(.eyebrow) { color: var(--ink-soft); max-width: 460px; }
.banner-actions { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; margin: 26px 0; }
.custom-banner-art { height: 440px; display: grid; place-items: center; }
.custom-banner-art img { width: 112%; max-width: none; height: 112%; object-fit: contain; rotate: -10deg; filter: drop-shadow(0 28px 25px #0005); transition: transform 1.8s var(--ease); }
.custom-print-banner:hover .custom-banner-art img { transform: scale(1.035) rotate(2deg); }
.mini-process { display: flex; flex-wrap: wrap; gap: 12px 20px; list-style: none; padding: 0; margin: 28px 0 0; color: var(--ink-soft); font-size: 12px; }
.mini-process span { color: var(--muted); margin-right: 6px; font-size: 10px; }
.home-guides, .home-answers { padding-block: 30px 60px; }
.compact-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 25px; margin-bottom: 28px; }
.compact-heading .eyebrow { margin-bottom: 12px; font-size: 10px; }
.compact-heading h2 { margin: 0; font-size: clamp(30px,3vw,44px); }
.compact-heading > a { flex-shrink: 0; }
.guide-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.guide-card { display: grid; grid-template-columns: 105px 1fr; gap: 20px; border: 1px solid var(--line); border-radius: 22px; padding: 24px; background: var(--surface); align-items: start; transition: border-color .4s,transform .8s var(--ease); }
.guide-card:hover { transform: translateY(-5px); border-color: var(--muted); }
.guide-image { overflow: hidden; height: 136px; border-radius: 14px; background: linear-gradient(140deg,#69789540,#8f69bd20); }
.guide-image img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.2); transition: transform 1.7s var(--ease); }
.guide-card:hover .guide-image img { transform: scale(1.28); }
.guide-card .eyebrow { font-size: 9px; margin: 0 0 10px; }
.guide-card h3 { font-size: 21px; margin: 0 0 12px; line-height: 1.18; }
.guide-card p:not(.eyebrow) { font-size: 13px; color: var(--ink-soft); margin: 0 0 16px; }
.guide-card .text-link { font-size: 12px; }
.faq-list { border-top: 1px solid var(--line); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 21px 0; font-size: 17px; font-weight: 550; cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary > span { font-size: 24px; font-weight: 400; transition: rotate .35s; }
.faq-list details[open] summary > span { rotate: 45deg; }
.faq-list details > div { padding: 0 0 24px; max-width: 750px; }
.faq-list details p { color: var(--ink-soft); margin: 0 0 16px; }
.choice-banner { position: relative; isolation: isolate; overflow: hidden; border: 1px solid var(--line); border-radius: 30px; background: radial-gradient(ellipse at 65% 120%,#52659920,transparent 70%),var(--surface); display: flex; align-items: center; justify-content: space-between; gap: 40px; padding: clamp(30px,4vw,58px); margin-block: 20px 64px; }
.choice-copy, .choice-actions { position: relative; z-index: 2; }
.choice-copy h2 { font-size: clamp(36px,4vw,58px); margin: 0 0 15px; }
.choice-copy .eyebrow { font-size: 10px; margin-bottom: 14px; }
.choice-copy p:last-child { color: var(--ink-soft); margin: 0; font-size: 15px; }
.choice-actions { display: flex; flex-wrap: wrap; gap: 14px; }
.choice-secondary { color: var(--ink); border: 1px solid var(--line); background: #ffffff05; }
.choice-secondary:hover { background: var(--line); }
.shimmer-layer { position: absolute; inset: 0; z-index: 1; pointer-events: none; overflow: hidden; }
.shimmer-layer span { position: absolute; left: 0; opacity: 0; transform: translateX(-150%) skewX(-12deg); }
.shimmer-wide { top: -50%; bottom: -50%; width: 38%; background: linear-gradient(90deg,transparent,#e61c5d2e,transparent); filter: blur(40px); }
.shimmer-narrow { top: -25%; bottom: -25%; width: 16%; background: linear-gradient(90deg,transparent,#ffffff35,transparent); filter: blur(12px); }
[data-theme="light"] .shimmer-narrow { background: linear-gradient(90deg,transparent,#ffffff,transparent); }
.guide-page, .help-page, .design-start { padding-block: 55px 85px; }
.guide-page { max-width: 1050px; }
.guide-page .guide-grid .guide-card { grid-template-columns: 1fr; }
.guide-page .guide-grid .guide-image { height: 180px; }
.guide-page .guide-grid .guide-image img { object-fit: contain; }
.guide-page h1, .help-page h1, .design-start h1 { font-size: clamp(42px,5vw,72px); margin: 20px 0 24px; }
.guide-page .lede, .help-page .lede, .design-start .lede { color: var(--ink-soft); max-width: 740px; font-size: 19px; }
.guide-article { max-width: 760px; margin: 38px auto; }
.guide-article h2 { font-size: 28px; margin: 38px 0 18px; }
.guide-article p, .guide-article li { color: var(--ink-soft); line-height: 1.75; }
.guide-article li { margin: 12px 0; }
.guide-article aside { padding: 24px; border-left: 3px solid var(--pink); background: var(--surface); border-radius: 0 18px 18px 0; margin: 30px 0; }
.guide-article aside p { margin: 0; }
.article-actions { border-top: 1px solid var(--line); padding-top: 30px; margin-top: 35px; display: flex; gap: 24px; flex-wrap: wrap; align-items: center; }
.help-section { max-width: 1000px; margin-top: 45px; scroll-margin-top: 100px; }
.help-section h2 { font-size: 30px; }
.help-nav { display: flex; flex-wrap: wrap; gap: 12px; margin: 28px 0; }
.help-nav a { border: 1px solid var(--line); border-radius: 100px; padding: 9px 17px; font-size: 13px; }
.design-start-hero { display: grid; grid-template-columns: 1.15fr .85fr; gap: 35px; align-items: center; }
.design-start-hero .hero-actions { justify-content: flex-start; margin-top: 28px; }
.design-start-hero img { width: 100%; aspect-ratio: 1; object-fit: contain; filter: drop-shadow(0 30px 25px #0003); }
.design-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; list-style: none; padding: 0; margin: 30px 0; }
.design-steps li { border: 1px solid var(--line); background: var(--surface); border-radius: 24px; padding: 30px; }
.design-steps li > span { font-size: 12px; color: var(--pink); }
.design-steps h3 { font-size: 24px; margin: 18px 0; }
.design-steps p { color: var(--ink-soft); font-size: 15px; }
.designer-handoff { padding: clamp(24px,4vw,48px); border: 1px solid var(--line); border-radius: 24px; background: var(--surface); margin-top: 45px; }
.designer-handoff h2 { font-size: clamp(30px,3vw,44px); margin-top: 0; }
.designer-handoff > p { color: var(--ink-soft); max-width: 680px; }
.designer-handoff .integration-status { display: block; margin-top: 18px; }
main [id] { scroll-margin-top: 98px; }
@media(min-width:1600px) { .home-refresh .premium-rail .catalog-card { flex-basis: calc((100vw - 2 * var(--gutter) - 96px) / 5); } }
@media(max-width:1200px) { .guide-card { grid-template-columns: 1fr; }.guide-image { height: 155px; }.guide-image img { object-fit: contain; } .choice-banner { align-items: flex-start; flex-direction: column; gap: 28px; } }
@media(max-width:1023px) { .home-refresh .studio-panel { min-height: 670px; }.home-refresh .studio-panel .studio-copy h2 { font-size: clamp(46px,7vw,68px); } }
@media(max-width:760px) {
 .home-refresh .hero-products { height: min(85vw,560px); margin-top: 10px; }
 .home-refresh .hero-shirt-main { width: 82vw; margin-left: -41vw; }
 .home-refresh .hero-shirt-left { width: 62vw; margin-left: -58vw; }
 .home-refresh .hero-shirt-right { width: 62vw; margin-left: -4vw; }
 .home-refresh .flagship-copy > p:not(.eyebrow) { font-size: 16px; }
 .home-refresh .hero-actions { gap: 18px; flex-wrap: wrap; }
 .home-refresh .flagship-bottom > span:first-child { display: none; }
 .home-refresh .studio-panel { min-height: 680px; }
 .home-refresh .studio-panel .studio-copy { top: 45px; }
 .home-refresh .feature-card { flex-basis: 78vw; height: 420px; min-height: 0; }
 .home-refresh .premium-rail .catalog-card { flex-basis: 78vw; }
 .custom-print-banner { grid-template-columns: 1fr; margin-block: 16px 45px; }
 .custom-banner-copy { padding: 30px; }.custom-banner-art { height: 280px; margin-top: -30px; }
 .compact-heading { align-items: flex-start; flex-direction: column; gap: 18px; }
 .guide-grid, .design-steps { grid-template-columns: 1fr; }
 .guide-card { grid-template-columns: 95px 1fr; padding: 20px; gap: 18px; }.guide-image { height: 130px; }
 .choice-banner { padding: 30px 25px; margin-bottom: 40px; }.choice-actions { width: 100%; }.choice-actions .button { width: 100%; justify-content: center; }
 .design-start-hero { grid-template-columns: 1fr; }.design-start-hero img { max-height: 350px; margin-top: -30px; }
 .faq-list summary { font-size: 16px; }
}
@media(prefers-reduced-motion:reduce) {
 .shimmer-layer { display: none; }.guide-card, .guide-image img, .custom-banner-art img { transition: none; }.guide-card:hover { transform: none; }
}

/* Background films preserve the existing chapter artwork until a frame loads. */
.studio-background-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; max-width: none; opacity: 0; transition: opacity .55s ease; pointer-events: none; }
.studio-video-shade { display: none; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg,#000d 0%,#0007 43%,#0001 78%),linear-gradient(0deg,#0009,transparent 35%); }
.has-studio-video > .studio-background-video { opacity: 1; }
.has-studio-video > .studio-video-shade { display: block; }
.has-studio-video > :is(img,.studio-glow,.studio-overlay) { visibility: hidden; }
.studio-has-intro > .studio-background-video { transition: none; }
.studio-return-still > .studio-background-video { transition: opacity .7s ease; }
.studio-video-blackout { position: absolute; inset: 0; z-index: 2; background: #000; opacity: 0; pointer-events: none; transition: opacity .9s cubic-bezier(.4,0,.2,1); }
.studio-fade-black > .studio-video-blackout { opacity: 1; transition-duration: .7s; }
.studio-video-controls { position: absolute; right: var(--gutter); bottom: 25px; z-index: 12; display: flex; align-items: center; gap: 4px; padding: 4px; border: 1px solid #ffffff30; border-radius: 100px; background: #10111680; backdrop-filter: blur(14px); pointer-events: auto; }
.studio-is-pinned .studio-video-controls { bottom: 102px; }
.studio-panel[aria-hidden="true"] .studio-video-controls { display: none; }
.studio-video-controls button { width: 40px; height: 40px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #fff; cursor: pointer; transition: background .3s; }
.studio-video-controls button:hover { background: #ffffff1c; }
.studio-video-controls button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.studio-video-controls svg { width: 17px; height: 17px; stroke: currentColor; stroke-width: 1.6; fill: none; stroke-linecap: round; stroke-linejoin: round; }
@media(max-width:1023px) { .studio-video-shade { background: linear-gradient(180deg,#000c 0%,#0005 52%,#0006),linear-gradient(90deg,#0004,transparent); } }
@media(prefers-reduced-motion:reduce) { .studio-background-video, .studio-return-still > .studio-background-video, .studio-video-blackout { transition: none; } }

/* The Print: a larger transparent model/product opening, followed by a
   contained film. Smaller screens place the copy above the media window. */
.studio-is-pinned .studio-copy { translate: none; }
.studio-print { background: radial-gradient(ellipse at 76% 50%,#20313e 0%,#111922 45%,#090a0e 85%); }
.studio-print > img {
 position: absolute; inset: 12% 0 auto auto; width: 60%; height: 92%;
 max-width: none; object-fit: contain; object-position: center; mask-image: none;
 filter: drop-shadow(0 30px 30px #0004);
}
.studio-print > .studio-background-video {
 position: absolute; inset: 12% 0 auto; width: 100%; height: 78%;
 max-width: none; object-fit: contain; object-position: right center;
 mask-image: linear-gradient(90deg,transparent 0%,transparent 16%,#000 42%);
}
.studio-print > .studio-overlay { display: none; }
.studio-print > .studio-video-shade {
 background: linear-gradient(90deg,#000a 0%,#0004 35%,transparent 62%),linear-gradient(0deg,#0008,transparent 18%);
}
@media(max-width:1023px) {
 .home-refresh [data-studio-media="print"] { display: flex; flex-direction: column; height: auto; min-height: 0; background: radial-gradient(ellipse at 76% 70%,#20313e 0%,#111922 45%,#090a0e 85%); }
 .home-refresh [data-studio-media="print"] .studio-copy {
  position: relative; inset: auto; translate: none; max-width: none;
  /* GSAP can retain the desktop -50% centering transform after unpinning. */
  transform: none !important;
  padding: 42px var(--gutter) 26px;
 }
 .home-refresh [data-studio-media="print"] .studio-copy h2 { font-size: clamp(38px,5.8vw,60px); }
 .home-refresh [data-studio-media="print"] .studio-copy p:not(.eyebrow) { max-width: 540px; margin: 20px 0 12px; }
 .home-refresh .studio-print {
  position: relative; inset: auto; order: 2; width: calc(100% - 2 * var(--gutter));
  height: auto; aspect-ratio: 1.2; margin: 0 var(--gutter) 30px; border-radius: 22px; background: transparent;
 }
 .studio-print > img { inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center; }
 .studio-print > .studio-background-video { inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center; mask-image: none; background: #090a0e; }
 .studio-print > .studio-video-shade { background: linear-gradient(0deg,#0005,transparent 22%); }
}
@media(max-width:760px) {
 .home-refresh .studio-print { aspect-ratio: .8; border-radius: 18px; }
 .home-refresh [data-studio-media="print"] .studio-copy { padding-top: 36px; }
 .home-refresh [data-studio-media="print"] .studio-copy h2 { font-size: clamp(36px,9vw,48px); }
}