/* Cinematic campaign shell; merchant graphics remain independent components. */
body { background: var(--canvas); }
h1, h2, h3, h1 *, h2 *, h3 *, em { font-family: var(--font); font-style: normal; }
h1 { font-weight: 800; }
h2 { font-weight: 750; letter-spacing: -.045em; }
h3 { font-weight: 750; }
.eyebrow, .step-kicker { color: var(--ink); }
.eyebrow.light { color: #fff; }
.site-header.scrolled { background: rgba(242,242,242,.97); }
.site-header:not(.scrolled) { background: linear-gradient(#10182B55,transparent); }
.site-header.scrolled .btn-light { background: var(--night); }
.wordmark { letter-spacing: -.055em; font-weight: 800; }
.hero { min-height: 800px; height: min(960px,100svh); max-height: 1040px; background: var(--night); }
.hero-media { inset: 0; width: 100%; height: 100%; max-height: none; opacity: 1; mask-image: none; transform: none; }
.hero-photo { width: 100%; height: 100%; object-fit: cover; object-position: 66% center; }
.hero-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(16,24,43,.8),rgba(16,24,43,.35) 42%,transparent 70%),linear-gradient(0deg,rgba(16,24,43,.58),transparent 25%); }
.hero-copy { padding-top: clamp(180px,23vh,260px); padding-bottom: 140px; }
.hero h1 { font-size: clamp(70px,7.1vw,108px); line-height: 1.01; letter-spacing: -.055em; max-width: 700px; margin-top: 27px; font-weight: 800; }
.hero-copy > p { max-width: 430px; font-size: 18px; color: #F2F2F2; line-height: 1.6; margin: 28px 0 32px; }
.hero .eyebrow { font-size: 10px; letter-spacing: .1em; }
.hero-meta { color: #E4E9F2; }
.hero .action-row { gap: 28px; }
.hero-bottom > span { color: #F2F2F2; font-size: 9px; letter-spacing: .1em; }
.hero-bottom .hero-image-note { font-size: 9px; letter-spacing: 0; opacity: .75; }
.btn-signal { background: var(--signal); color: var(--night); }
.btn-primary { color: #fff; }
.btn-outline { box-shadow: inset 0 0 0 1px var(--line); }
.hero .btn { min-height: 56px; padding-inline: 29px; }
.section { padding-block: 112px; }
.intro { background: var(--canvas); }
.value-grid { gap: 20px; }
.value-panel { border-radius: 24px; min-height: 480px; }
.light-panel { background: #fff; }
.primary-panel { background: var(--primary); }
.signal-panel { background: var(--night); color: #fff; }
.value-panel > p { color: var(--ink-muted); }
.primary-panel > p, .signal-panel > p { color: #FFFFFF; }
.primary-panel .feature-number { color: #FFFFFF; opacity: 1; }
.value-panel .mini-card { background: var(--canvas); color: var(--ink); border: 0; border-radius: 14px; transform: rotate(-5deg); }
.mini-card > span { font: 800 25px/1.1 var(--font); letter-spacing: -.045em; }
.wallet-back.one { background: #CCF2D0; }
.wallet-back.two { background: #C3CDDF; }
.reward-token { background: var(--signal); color: var(--night); border-color: #F2F2F2; box-shadow: 8px 13px 0 #587BEE; }
.reward-token span, .reward-token i { color: var(--night); }
.tiny-spark { color: var(--signal); }
.orbit-ring { border-color: #587BEE; }
.how-section { background: #fff; }
.how-section .section-head { max-width: 1100px; }
.how-section .section-head h2 { font-size: clamp(40px,5.2vw,76px); }
.flow-stage { border: 1px solid var(--line); border-radius: 24px; }
.flow-visual { background: var(--canvas); }
.counter-sign { background: var(--night); color: var(--canvas); border-color: #31405D; }
.counter-sign > span, .mini-iphone > span { font-family: var(--font); font-style: normal; font-weight: 750; letter-spacing: -.05em; }
.counter-sign .nfc-symbol { color: var(--signal); }
.mini-iphone { background: var(--primary); border-color: var(--night); color: #fff; box-shadow: 3px 4px 0 #90A0BA,18px 25px 40px #10182B24; }
.sign-cup { color: var(--signal); }
.scene-return { background: var(--primary); }
.reward-cup { background: var(--signal); }
.reward-ticket { background: var(--canvas); color: var(--night); }
.reward-ticket strong, .reward-ticket em { font-family: var(--font); font-style: normal; font-weight: 750; }
.return-ring { color: var(--signal); }
.brand-builder { border-radius: 24px; }
.builder-stage { background: #E8EEFC; }
.paper-preview { --card-ink: #587BEE!important; background: #fff!important; border-color: var(--line); border-radius: 16px!important; transform: rotate(-4deg)!important; }
.paper-preview[data-theme='graphite'] { --card-ink: #10182B!important; }
.paper-preview[data-theme='stone'] { --card-ink: #10182B!important; background: #F2F2F2!important; }
.paper-preview .preview-card-top > span:first-child { font: 800 32px/1.04 var(--font); letter-spacing: -.045em; }
.paper-pledge, .paper-pledge em { font: 750 30px/1.1 var(--font); letter-spacing: -.04em; }
.paper-edge { color: var(--ink-muted); border-color: var(--line); }
.paper-preview .preview-stamps i.earned { color: #fff; }
.paper-preview .card-rule { border-color: var(--line); }
.staff-section { background: var(--night); }
.staff-section .eyebrow, .daydaydate-section .eyebrow { color: var(--signal); }
.business-art { background: #E8EEFC!important; }
.business-art #business-card-art { transform: rotate(-5deg); }
.daydaydate-section { background: var(--primary); }
.daydaydate-section .muted-light { color: #FFFFFF; }
.badge, .planned-badge { color: var(--night); }
.dark-badge { color: #FFFFFF; }
.price-featured { background: var(--night); color: #fff; }
.price-featured p, .price-featured .price-basis, .price-featured li { color: #F2F2F2; }
.price-featured .btn-primary { background: var(--signal); color: var(--night); }
.counter-fit-art { background: #E8EEFC; }
.pos-display { background: #fff; border-color: var(--night); box-shadow: 12px 18px 0 #90A0BA,28px 35px 40px #10182B24; }
.pos-top { font: 800 20px var(--font); }
.pos-member { background: var(--canvas); }
.pos-status { color: var(--ink-muted); }
.closing { background: var(--signal); color: var(--night); }
.closing .eyebrow, .closing p, .closing-note { color: var(--night); }
.closing h2 { font-size: clamp(64px,8.5vw,128px); letter-spacing: -.055em; }
.site-footer { background: var(--night); color: var(--canvas); }
.footer-bottom, .footer-disclosure, .footer-top p { color: var(--night-muted); }
@media (hover:hover) {
  .btn-signal:hover { background: #DEF8E1; }
  .btn-primary:hover { background: #4768D8; }
  .price-featured .btn-primary:hover { background: #DEF8E1; }
}
@media (max-width:1000px) and (min-width:701px) {
  .hero h1 { font-size: 80px; }
  .hero-media { width: 100%; right: 0; }
  .hero-copy > p { max-width: 400px; }
}
@media (max-width:700px) {
  .hero { min-height: 850px; height: 100svh; max-height: 1020px; }
  .hero-media { inset: 0; width: 100%; height: 100%; }
  .hero-photo { object-position: 82% center; }
  .hero-media::after { background: linear-gradient(0deg,rgba(16,24,43,.98),rgba(16,24,43,.76) 36%,rgba(16,24,43,.1) 72%),linear-gradient(180deg,rgba(16,24,43,.6),transparent 24%); }
  .hero-copy { position: absolute; bottom: 100px; padding-top: 0; padding-bottom: 0; }
  .hero h1 { font-size: clamp(56px,12.4vw,80px); line-height: 1.02; margin-top: 18px; }
  .hero-copy > p { max-width: 370px; margin: 20px 0 23px; font-size: 15px; }
  .hero .eyebrow { font-size: 8px; }
  .hero .action-row { gap: 19px; }
  .hero .btn { min-height: 50px; padding-inline: 22px; }
  .hero .text-link { font-size: 12px; gap: 10px; }
  .hero .play-circle { width: 28px; height: 28px; font-size: 16px; }
  .hero-meta { font-size: 9px; gap: 10px; }
  .hero-meta span + span:before { margin-right: 10px; }
  .hero-bottom { bottom: 25px; gap: 12px; align-items: start; flex-direction: column; }
  .hero-bottom > span { font-size: 7px; }
  .section { padding-block: 76px; }
  .paper-preview .preview-card-top > span:first-child { font-size: 27px; }
  .paper-pledge { font-size: 27px; }
  .price-featured .btn-primary { color: var(--night); }
}
@media (max-width:374px) {
  .hero { min-height: 860px; }
  .hero .action-row { align-items: start; flex-direction: column; gap: 9px; }
  .hero-copy { bottom: 100px; }
}

/* Accessible pairings for the blue and mint identity. */
.btn-primary {color:var(--ink)}
.btn-primary:hover {color:#fff}
.primary-panel,.primary-panel>p,.primary-panel .feature-number {color:var(--ink)}
.daydaydate-section,.daydaydate-section .eyebrow,.daydaydate-section .muted-light,.daydaydate-section p {color:var(--ink)}
.mini-iphone,.mini-iphone>span,.mini-iphone strong {color:var(--ink)}
.phone-join {border-color:var(--ink)}
.dark-badge {color:var(--ink)}
.step-tab.active,.step-kicker,.paper-preview {color:#3656BB}
.paper-preview {--card-ink:#3656BB!important}
.paper-preview[data-theme="graphite"],.paper-preview[data-theme="stone"] {--card-ink:#10182B!important}
.preview-stamps i.earned {color:#fff}
.site-header.scrolled .btn-light {color:white}
.price-featured .btn-primary {color:var(--ink)}


.paper-preview .card-sun{color:var(--ink);background:var(--signal);border-color:transparent}
