/* Consumer expression of the plurelinc.com identity. Consumer sections,
   app walkthrough, forms and analytics remain intact. */
:root {
  --bg-1:var(--plurel-canvas); --bg-2:var(--plurel-cream); --paper:var(--plurel-paper);
  --ink:var(--plurel-ink); --ink-2:var(--plurel-muted); --ink-3:var(--plurel-muted); --ink-4:var(--plurel-muted);
  --hair:var(--plurel-border); --hair-2:var(--plurel-control-border);
  --terra:var(--plurel-orange); --butter:var(--plurel-yellow); --mint:var(--plurel-blue-ink);
  --sans:var(--plurel-body); --serif:var(--plurel-display); --mono:var(--plurel-body);
  --dark:var(--plurel-yellow); --dark-2:var(--plurel-paper); --dark-ink:var(--plurel-ink); --dark-hair:var(--plurel-border);
}
html { scroll-padding-top:112px; -webkit-text-size-adjust:100%; }
body { font:400 16px/1.55 var(--sans); }
body::before { content:""; position:absolute; inset:0 0 auto; height:104px; background:var(--plurel-canvas); border-bottom:1px solid var(--ink); }
.logo-pill { position:absolute; top:16px; left:4vw; height:72px; padding:0; border:0; background:none; box-shadow:none; backdrop-filter:none; }
.logo-badgeSvg { display:none; }
.logo-lockupSvg { height:64px; width:114px; }
.nav-cluster { position:absolute; top:28px; right:auto; left:50%; transform:translateX(-50%); }
.nav-linksPill { background:none; border:0; box-shadow:none; backdrop-filter:none; }
.nav-linksPill a { font-size:16px; min-height:44px; display:flex; align-items:center; }
.nav-cta, .invite-submit { background:var(--terra); color:var(--ink); border:1px solid var(--ink); border-radius:6px; box-shadow:var(--plurel-shadow-action); min-height:48px; font-size:16px; }
.nav-cta:hover, .invite-submit:hover { background:var(--plurel-orange-hover); color:var(--ink); box-shadow:var(--plurel-shadow-action); }
.nav-cta:active, .invite-submit:active { transform:translateY(3px); box-shadow:none; }
.hero { max-width:1440px; padding:158px max(4vw,24px) 72px; background:var(--plurel-canvas); border-bottom:1px solid var(--ink); gap:72px; min-height:800px; }
.hero::before { display:none; }
.hero-copy { padding:24px; max-width:680px; }
.hero-badge { background:none; border:0; border-radius:0; padding:0; font-size:14px; }
.hero-badgeDot { box-shadow:none; }
.hero-splitNowTrigger, .hero-h1Stars, .deck-stickerBurst, .deck-doodleFlower, .deck-doodleSpark { display:none; }
.hero-h1 { font:400 clamp(48px,5.1vw,74px)/.98 var(--serif); letter-spacing:-.04em; margin:24px 0; }
.hero-h1 > * { display:block; }
.hero-h1 .hero-script { font:400 1.24em/.8 var(--plurel-script); letter-spacing:-.02em; padding-left:.06em; }
.hero-h1 .hero-once { display:inline-block; font:700 .88em/1.04 var(--sans); letter-spacing:-.055em; background:var(--butter); padding:2px 14px 6px 5px; margin-top:22px; }
.hero-h1 strong { font-weight:400; }
.hero-h1 .serifAccent, .hero-h1 .mutedInk { color:var(--ink); }
.hero-sub { font-size:18px; line-height:1.6; }
.hero-metaStrip { display:none; }
.invite-bar { border-radius:6px; padding:8px; gap:8px; background:var(--paper); border-color:var(--ink); box-shadow:none; }
.invite-bar input { min-width:0; font-size:16px; min-height:48px; padding-left:8px; }
.invite-feedback { font:400 14px/1.5 var(--sans); color:var(--ink-2); }
.platform-pill { background:none; border:0; padding:0; border-radius:0; font-size:14px; }
.hero-deckWrap { position:relative; height:auto; padding:58px 28px 36px; perspective:none; background:var(--plurel-blue-soft); border-radius:8px; border:1px solid var(--ink); }
.hero-deckWrap::before { content:""; position:absolute; width:88px; height:88px; top:-34px; right:20px; background:url('/brand/plurel/doodle-1.svg') center/contain no-repeat; pointer-events:none; transform:rotate(10deg); }
.hero-deckWrap::after { content:""; position:absolute; width:62px; height:62px; bottom:32px; left:-32px; background:url('/brand/plurel/doodle-4.svg') center/contain no-repeat; pointer-events:none; }
.hero-deckStage { height:auto; transform:none!important; display:grid; gap:20px; }
.hero .deck-card { position:static; width:100%; max-width:440px; margin-inline:auto; opacity:1; transform:none!important; animation:none; }
.hero .deck-card--3, .hero .deck-card--4, .hero .deck-card--5 { display:none; }
.deck-float { transform:none!important; animation:none; }
.uiCard, .hero .uiCard { border-radius:8px; border:1px solid var(--ink); box-shadow:none; transform:none!important; }
.uiCard--darkCard { position:relative; background:var(--paper); color:var(--ink); aspect-ratio:1.586; padding:28px; }
.uiCard--darkCard .uiCard-top { justify-content:flex-end; }
.uiCard--darkCard .uiCard-lockup { width:94px; height:44px; }
.uiCard--darkCard .uiCard-chip { position:absolute; left:28px; top:44%; width:42px; height:32px; }
.uiCard--darkCard .uiCard-cardMid { position:absolute; left:28px; top:65%; margin:0; }
.uiCard--darkCard .uiCard-cardFoot { position:absolute; bottom:24px; left:28px; right:28px; border:0; padding:0; }
.uiCard--darkCard :is(.uiCard-cardLabel,.uiCard-metaLabel,.uiCard-metaVal,.uiCard-brandSub) { color:var(--ink-2); }
.uiCard--darkCard .uiCard-lockup path:first-child { fill:var(--ink); }
.uiCard--darkCard .uiCard-mark, .uiCard--darkCard .uiCard-cardBal { display:none; }
.uiCard--darkCard .uiCard-walletBadge { background:var(--plurel-cream); color:var(--ink); border-color:var(--hair); }
.uiCard--darkCard .uiCard-cardFoot { border-color:var(--hair); }
.uiCard-pillMint { background:var(--plurel-blue-soft); color:var(--plurel-blue-ink); }
.uiCard-bar span { background:var(--plurel-blue-ink); }
.uiCard-chip { background:#e8cd8c; border:1px solid #8d733c; border-radius:4px; box-shadow:none; }
.blueprint-sec, .theater-sec, .moments-sec, .faq-sec { padding-block:88px; }
.blueprint-sec .sec-h2 .serifAccent, .moments-sec .serifAccent, .close-h2 .serifAccent { font-family:var(--plurel-script); font-size:1.26em; }
.sec-h2, .sec-h2 strong, .section-h2, .blueprint-h2, .moments-h2, .faq-h2, .close-h2 { font-family:var(--serif); font-weight:400; }
.dark-pod, .close-pod { background:var(--butter); color:var(--ink); border-radius:0; border-block:1px solid var(--ink); margin-inline:0; }
.close-pod { margin-inline:auto; }
.dark-pod { max-width:none; box-shadow:none; }
.dark-pod :is(.kicker,.sec-h2,.mutedInk), .bento-title { color:var(--ink); }
.serifAccent { color:var(--ink); }
.site-footer .footer-wordmarkWrap { color:var(--ink); opacity:1; max-width:420px; margin:32px 0; }
.bento-card { border:1px solid var(--ink); border-radius:8px; }
.bento-desc, .bento-num, .bento-foot { color:var(--ink-2); }
.bento-desc { font-size:16px; line-height:1.6; }
.bento-foot { gap:12px; flex-wrap:wrap; }
.theater-stageSticker, .theater-stageDoodle, .close-badgeRow, .snapshot-sticker { display:none; }
.phPrimaryBtn { color:var(--ink); border:1px solid var(--ink); border-radius:6px; }
.phInputCard, .phLinkPreview, .phRingCard { border-radius:8px; box-shadow:none; }
.phScreen--dark { background:var(--plurel-canvas); color:var(--ink); }
.phWalletCard { background:var(--paper); border:1px solid var(--ink); box-shadow:none; border-radius:8px; color:var(--ink); }
.phWalletBadge { display:none; }
.phWalletLogo svg { width:80px; height:auto; }
.phWalletLogo svg path:first-child { fill:var(--ink); }
.phWalletVisa, .phWalletBalLabel, .phWalletBot, .phWaveBox p { color:var(--ink-2); }
.phWaveBox { background:var(--paper); border-color:var(--hair); border-radius:8px; }
.theater-stepBtn, .theater-stepBtn.is-active { border-radius:8px; box-shadow:none; }
.theater-stepBtn.is-active .theater-stepNum { color:var(--plurel-blue-ink); }
.snapshot-card, .polaroid { border-radius:8px; box-shadow:none; }
.close-pod :is(.close-h2,.close-sub,.invite-feedback,.kicker) { color:var(--ink); }
.close-fan { display:none; }
.close-pod .invite-bar { background:var(--paper); border-color:var(--ink); }
.close-pod .invite-bar input { color:var(--ink); }
.close-pod .invite-bar input::placeholder { color:var(--ink-2); }
.site-footer { background:var(--plurel-canvas); border-top:1px solid var(--ink); }
button, summary { min-height:44px; }
:focus-visible { outline:3px solid var(--plurel-blue-ink); outline-offset:4px; }
@media(max-width:1000px) {
  .nav-linksPill { display:none; }
  .hero { grid-template-columns:1fr; gap:28px; padding-top:144px; }
  .hero-copy { max-width:720px; margin:auto; padding:16px; }
  .hero-deckStage { max-width:540px; margin:auto; }
  .theater-sticky { grid-template-columns:minmax(0,1fr); }
  .theater-steps, .theater-stage { min-width:0; }
  .iphone-shell { width:min(370px,100%); box-shadow:none; }
  .theater-stepBtn.is-active .theater-stepDesc { max-height:none; }
}
@media(max-width:600px) {
  body::before { height:92px; }
  .logo-pill { left:20px; top:12px; height:64px; }
  .logo-lockupSvg { height:56px; width:100px; }
  .nav-cluster { top:24px; right:20px; }
  .nav-cta { padding:10px 12px; font-size:14px; }
  .hero { padding:132px 24px 52px; }
  .hero::before { inset:112px 12px 20px; }
  .hero-copy { padding:0; }
  .hero-deckWrap { padding:40px 16px 20px; margin-top:24px; }
  .hero-deckWrap::before { width:60px; height:60px; top:-25px; right:16px; }
  .hero-deckWrap::after { display:none; }
  .hero-topRow { margin-bottom:20px; }
  .hero-badge { font-size:12px; letter-spacing:.04em; }
  .hero-h1 { font-size:clamp(40px,12vw,60px); }
  .hero-sub { font-size:16px; }
  .invite-bar { flex-direction:column; align-items:stretch; padding:10px; }
  .invite-bar input, .invite-submit { width:100%; }
  .hero .deck-card { max-width:100%; }
  .uiCard--darkCard { padding:20px; }
  .uiCard--darkCard .uiCard-chip { left:20px; top:40%; }
  .uiCard--darkCard .uiCard-cardMid { left:20px; top:63%; }
  .uiCard--darkCard .uiCard-cardFoot { left:20px; right:20px; bottom:16px; }
  .uiCard--darkCard .uiCard-walletBadge { display:none; }
  .platform-pills { gap:16px; flex-wrap:wrap; }
  .blueprint-sec, .theater-sec, .moments-sec, .faq-sec { padding-block:56px; }
}
@media(prefers-reduced-motion:reduce) { html{scroll-behavior:auto} *,*::before,*::after{animation:none!important;transition:none!important} }

/* Original company artwork, adapted to the consumer site's vertical flow. */
body::before { background:var(--butter); }
.hero {
  max-width:none; min-height:0; padding:156px max(4vw,24px) 72px;
  grid-template-columns:minmax(0,1.55fr) minmax(320px,1fr); gap:64px;
  background:var(--butter); align-items:center;
}
.hero-copy { width:100%; max-width:850px; padding:0; min-width:0; }
.hero-topRow { margin-bottom:28px; }
.hero-badge { letter-spacing:.08em; }
.friendship-frame { display:block; width:100%; padding:28px 16px; border:1px solid var(--ink); border-radius:4px; }
.hero-h1.friendship-headline { width:100%; max-width:none; margin:0; line-height:1; }
.friendship-art { display:block; width:100%; height:auto; aspect-ratio:2075/1060; }
.hero-signup { margin-top:32px; }
.signup-label { display:block; font:400 28px/1.2 var(--serif); margin-bottom:14px; }
.hero .invite-bar { max-width:none; padding:0; border:0; background:none; gap:12px; box-shadow:none; }
.hero .invite-bar input { background:var(--plurel-canvas); border:1px solid var(--ink); border-radius:6px; padding:16px 18px; min-height:56px; }
.hero .invite-submit { display:flex; align-items:center; justify-content:center; gap:18px; min-height:56px; padding:14px 22px; white-space:nowrap; font-weight:700; }
.hero .invite-feedback { margin-top:16px; font-size:14px; }
.hero .platform-pills { margin-top:24px; gap:16px; flex-wrap:wrap; }
.hero .platform-pills a { margin-left:0!important; font-size:14px!important; min-height:44px; display:inline-flex; align-items:center; }
.consumer-pool-preview {
  display:block;
  width:100%; max-width:460px; justify-self:center; padding:28px;
  background:var(--plurel-blue-soft); border:1px solid var(--ink); border-radius:8px;
  box-shadow:4px 4px 0 var(--ink);
}
.consumer-pool-preview::before { width:64px; height:64px; top:-48px; right:10px; }
.consumer-pool-preview::after { display:none; }
.pool-preview-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; font-size:16px; }
.pool-preview-status { font-size:12px; border:1px solid var(--plurel-blue-ink); border-radius:4px; padding:4px 8px; white-space:nowrap; color:var(--plurel-blue-ink); }
.pool-preview-balance { margin:28px 0 24px; }
.pool-preview-balance>span { display:block; color:var(--ink-2); font-size:14px; }
.pool-preview-balance strong { display:block; font-size:clamp(36px,3.4vw,48px); line-height:1.15; letter-spacing:-.035em; margin-top:4px; }
.pool-preview-balance small { font-size:.6em; }
.consumer-pool-preview .uiCard--darkCard {
  width:100%; aspect-ratio:1.586; min-height:0; padding:24px;
  background:var(--plurel-canvas); border:1px solid var(--ink); border-radius:8px; overflow:hidden;
  box-shadow:0 3px 0 var(--ink);
}
.uiCard--darkCard .uiCard-top { margin:0; }
.uiCard--darkCard .uiCard-lockup { width:112px; height:auto; max-height:66px; }
.uiCard--darkCard .uiCard-chip { width:46px; height:34px; top:43%; left:24px; border:0; border-radius:0; background:none; opacity:1; }
.uiCard--darkCard .uiCard-cardFoot { left:24px; right:24px; bottom:22px; align-items:flex-end; }
.uiCard--darkCard .uiCard-metaVal { color:var(--ink); font-size:16px; letter-spacing:.08em; margin:0 0 10px; }
.uiCard--darkCard .uiCard-metaLabel { font-size:10px; letter-spacing:.1em; display:flex; gap:32px; }
.card-contactless { color:var(--ink); flex:none; }
.pool-preview-people { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-top:30px; }
.pool-preview-people>div { display:flex; flex-direction:column; align-items:center; gap:6px; font-size:14px; }
.pool-avatar { display:grid; place-items:center; width:38px; height:38px; border:1px solid var(--ink); border-radius:50%; background:var(--plurel-canvas); font-size:12px; }
.pool-preview-note { margin-top:24px; padding-top:18px; border-top:1px solid var(--ink); font-size:14px; text-align:center; }
.sec-head { padding-bottom:28px; border-bottom:1px solid var(--ink); }
.figure-card { background:var(--plurel-blue-soft); border:1px solid var(--ink); border-radius:8px; box-shadow:none; }
.theater-stage { background:var(--plurel-blue-soft); border:1px solid var(--ink); border-radius:8px; box-shadow:none; padding:36px 28px; }
.scrub-sec { max-width:none; padding:96px max(8vw,24px); background:var(--butter); border-block:1px solid var(--ink); }
.scrub-p { max-width:1000px; margin:28px auto 0; font-family:var(--serif); line-height:1.2; letter-spacing:-.025em; }
.scrub-word, .scrub-word.is-lit { color:var(--ink); }
.scrub-word.is-accent.is-lit { color:var(--ink); text-decoration:underline; text-decoration-color:var(--terra); text-underline-offset:8px; text-decoration-thickness:2px; }
.scrub-doodle--bl, .scrub-doodle--tr { display:none; }
.consumer-team { padding:88px max(4vw,24px); max-width:1440px; margin:auto; }
.consumer-team-heading { display:flex; align-items:center; justify-content:space-between; gap:32px; padding-bottom:30px; border-bottom:1px solid var(--ink); }
.consumer-team h2 { font:400 clamp(36px,4.2vw,60px)/1.1 var(--serif); letter-spacing:-.03em; margin-top:16px; }
.consumer-team h2 em { font-weight:400; }
.team-doodle { flex:none; width:76px; height:76px; }
.consumer-team-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:32px; margin-top:40px; }
.consumer-person { display:flex; align-items:flex-start; flex-direction:column; min-width:0; }
.consumer-headshot { width:132px; height:132px; border-radius:50%; object-fit:cover; margin-bottom:24px; }
.consumer-person h3 { font:400 30px/1.12 var(--serif); letter-spacing:-.025em; min-height:68px; }
.consumer-role { font-size:15px; font-weight:700; min-height:48px; margin-top:10px; }
.consumer-bio { font-size:16px; color:var(--ink-2); line-height:1.6; margin:12px 0 20px; }
.consumer-person>a { display:inline-flex; align-items:center; min-height:44px; text-underline-offset:5px; text-decoration:underline; font-size:16px; margin-top:auto; }
.site-footer { max-width:none; padding:56px max(4vw,24px) 32px; }
.site-footer .footer-wordmarkWrap { max-width:280px; margin:24px 0 48px; padding:0; }
.footer-wordmarkWrap img { display:block; width:100%; height:auto; }
.footer-col a { min-height:44px; display:flex; align-items:center; font-size:15px; }
.modal-backdrop { backdrop-filter:none; -webkit-backdrop-filter:none; }
.modal-card { border:1px solid var(--ink); border-radius:8px; box-shadow:4px 4px 0 var(--ink); max-height:calc(100dvh - 40px); overflow-y:auto; }
.modal-close { width:44px; height:44px; border:1px solid var(--ink); border-radius:6px; top:16px; right:16px; }
.modal-brandHead { padding-right:40px; }
.modal-releaseBox { border-radius:6px; }
.modal-card h3 { font-family:var(--serif); }
.modal-card .invite-bar { box-shadow:none; }
.close-pod .invite-feedback.is-ok { color:var(--ink); }
.close-pod .close-launch-label { color:var(--ink); font:700 14px/1.5 var(--sans); letter-spacing:.06em; }
@media(min-width:1600px) {
  .hero { padding-inline:max(4vw,calc((100vw - 1440px)/2)); }
}
@media(max-width:1100px) {
  .hero { gap:36px; grid-template-columns:minmax(0,1.3fr) minmax(300px,1fr); }
  .hero .invite-bar { flex-direction:column; align-items:stretch; }
  .hero .invite-submit, .hero .invite-bar input { width:100%; }
  .consumer-pool-preview { padding:22px; }
  .consumer-team-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px; }
}
@media(max-width:800px) {
  .hero { grid-template-columns:minmax(0,1fr); padding:138px 24px 56px; gap:54px; }
  .hero-copy { max-width:660px; margin:auto; }
  .hero .invite-bar { flex-direction:row; }
  .hero .invite-submit { width:auto; }
  .consumer-pool-preview { max-width:440px; margin:0; padding:24px; }
  .consumer-team { padding-block:60px; }
}
@media(max-width:1000px) {
  .logo-pill { left:50%; transform:translateX(-50%); }
  .nav-cluster { top:94px; left:20px; right:20px; transform:none; justify-content:center; }
  .nav-linksPill { display:flex; flex-wrap:wrap; justify-content:center; gap:4px 14px; padding:0; }
  .nav-linksPill a { font-size:14px; padding:0 4px; }
  .hero { padding-top:216px; }
  .theater-stage { padding:32px 20px; }
}
@media(max-width:600px) {
  .hero { padding:216px 20px 48px; }
  .hero-topRow { margin-bottom:22px; }
  .friendship-frame { padding:24px 10px; }
  .hero-signup { margin-top:28px; }
  .hero .invite-bar { flex-direction:column; gap:12px; }
  .hero .invite-submit { width:100%; }
  .hero .platform-pills { column-gap:18px; row-gap:8px; }
  .consumer-pool-preview { padding:20px; }
  .consumer-pool-preview .uiCard--darkCard { padding:18px; }
  .uiCard--darkCard .uiCard-lockup { width:96px; max-height:52px; }
  .uiCard--darkCard .uiCard-chip { left:18px; width:40px; height:30px; top:40%; }
  .uiCard--darkCard .uiCard-cardFoot { left:18px; right:18px; bottom:16px; }
  .uiCard--darkCard .uiCard-metaVal { font-size:14px; letter-spacing:.03em; margin-bottom:8px; }
  .pool-preview-heading { font-size:14px; gap:8px; }
  .pool-preview-balance { margin:22px 0; }
  .pool-preview-people { gap:4px; margin-top:26px; }
  .scrub-sec { padding:72px 28px; }
  .scrub-p { font-size:34px; }
  .scrub-doodle { width:30px; }
  .scrub-doodle--tl { top:20px; left:20px; }
  .scrub-doodle--br { bottom:20px; right:20px; }
  .consumer-team-heading { gap:12px; }
  .team-doodle { width:48px; height:48px; }
  .consumer-team-grid { grid-template-columns:minmax(0,1fr); gap:32px; margin-top:32px; }
  .consumer-person { display:grid; grid-template-columns:80px minmax(0,1fr); column-gap:20px; padding-bottom:24px; border-bottom:1px solid var(--hair); }
  .consumer-headshot { width:80px; height:80px; grid-column:1; grid-row:1 / 3; margin:0; }
  .consumer-person h3 { font-size:27px; min-height:0; align-self:end; }
  .consumer-role { grid-column:2; margin-top:8px; min-height:0; font-size:14px; }
  .consumer-bio { grid-column:1 / -1; margin:20px 0 8px; }
  .consumer-person>a { grid-column:1 / -1; justify-self:start; }
  .consumer-person:last-child { border-bottom:0; padding-bottom:0; }
  .site-footer .footer-wordmarkWrap { max-width:220px; }
  .theater-sec { padding-inline:16px; }
  .theater-stage { padding:28px 12px; }
  .iphone-shell { padding:10px; border-radius:40px; }
  .iphone-screen { border-radius:30px; }
  .modal-card { padding:28px 20px; }
  .modal-brandHead { padding-right:44px; }
  .modal-releaseBox { flex-wrap:wrap; }
}

/* Device geometry designed in Figma: 426 × 898 chassis, 402 × 874 display.
   https://www.figma.com/design/03ukwawY4pa2Zc9pIczlsi?node-id=4-40
   The actual app screens stay live HTML, using the site's Plurel typeface. */
.hero { grid-template-columns:minmax(0,1fr); justify-items:center; gap:0; }
.hero-copy { max-width:900px; text-align:center; margin-inline:auto; }
.hero-topRow, .hero .platform-pills { justify-content:center; }
.hero-signup { max-width:660px; margin:32px auto 0; text-align:left; }
.hero .invite-feedback { text-align:center; }
.hero .invite-bar { flex-direction:row; }
.hero .invite-submit { width:auto; }
.theater-stage {
  --phone-bezel-total:23px;
  --stage-padding-y:36px;
  padding-block:var(--stage-padding-y);
}
@media(min-width:1025px) {
  /* The navigation is not fixed: land on the full-height walkthrough itself. */
  .theater-sec { padding-block:0; scroll-margin-top:-112px; }
  .theater-sticky { grid-template-rows:minmax(0,1fr); }
}
.iphone-shell {
  /* Fit both dimensions, reserving stage padding and 24px above/below it.
     Account for the bezel before converting display height to display width. */
  width:min(370px,calc(100% - 8px),calc((100svh - 48px - 2 * var(--stage-padding-y) - 2px - var(--phone-bezel-total)) * 402 / 874 + var(--phone-bezel-total)));
  height:auto; padding:10px;
  border:1.5px solid #777772; border-radius:54px; background:#141414;
  box-shadow:0 2px 0 #141414; flex:none;
}
.iphone-screen {
  aspect-ratio:402 / 874; height:auto; border-radius:43px;
  background:var(--plurel-canvas); isolation:isolate;
}
.iphone-content {
  position:absolute; inset:0 auto auto 0; width:346px; height:752.249px;
  transform:scale(var(--iphone-scale,1)); transform-origin:top left;
}
.iphone-shell::before, .iphone-shell::after,
.iphone-action-button, .iphone-power-button {
  content:""; position:absolute; width:3px; border-radius:2px;
  background:#555551; pointer-events:none;
}
.iphone-shell::before { left:-4px; top:18.2%; height:5.8%; }
.iphone-shell::after { left:-4px; top:25.4%; height:5.8%; }
.iphone-action-button { left:-4px; top:12.4%; height:2.7%; }
.iphone-power-button { right:-4px; top:21.2%; height:8.9%; }
.iphone-status {
  position:absolute; inset:10px 0 auto; z-index:2; height:38px;
  display:grid; grid-template-columns:1fr 110px 1fr;
  align-items:center; padding-inline:21px; color:#141414; pointer-events:none;
}
.iphone-time { font:600 14px/1 -apple-system,BlinkMacSystemFont,sans-serif; text-align:center; }
.iphone-island { display:block; width:110px; height:32px; background:#050505; border-radius:18px; position:relative; }
.iphone-island>span { position:absolute; right:10px; top:11px; width:10px; height:10px; border-radius:50%; background:#11141b; }
.iphone-status-icons { display:block; width:62px; height:16px; justify-self:center; }
.iphone-home-indicator { position:absolute; bottom:8px; left:50%; transform:translateX(-50%); width:35%; height:4px; background:#141414; border-radius:3px; z-index:2; pointer-events:none; }
.iphone-screen .phScreen { padding:72px 18px 38px; background:var(--plurel-canvas); }
.iphone-screen .phStatus { display:none; }
.iphone-screen .phBody { min-height:0; }

/* One app, one layout: shared screen geometry and explicit step selection. */
.theater-sec { height:auto; padding:80px 48px; scroll-margin-top:-80px; }
.theater-sticky { position:relative; height:auto; min-height:0; gap:64px; align-items:center; }
.theater-steps { gap:0; }
.theater-steps .sec-h2 { margin-top:18px; max-width:550px; }
.theater-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-top:28px; }
.theater-stepBtn, .theater-stepBtn.is-active { display:flex; flex-direction:column; align-items:flex-start; gap:10px; padding:16px 14px; border:1px solid var(--hair); border-radius:6px; background:transparent; min-height:84px; font:700 16px/1.2 var(--sans); color:var(--ink-2); transition:background .15s,border-color .15s; }
.theater-stepBtn.is-active { background:var(--paper); border-color:var(--ink); box-shadow:0 3px 0 var(--ink); color:var(--ink); }
.theater-stepNum, .theater-stepBtn.is-active .theater-stepNum { margin:0; font:400 12px/1 var(--sans); letter-spacing:.05em; color:var(--ink-2); }
.theater-stepBtn.is-active .theater-stepNum { color:var(--plurel-blue-ink); }
.theater-description { min-height:150px; padding-top:32px; }
.theater-description h3 { font:700 22px/1.3 var(--sans); letter-spacing:-.02em; margin:0 0 12px; }
.theater-description p { max-width:460px; font:400 16px/1.55 var(--sans); color:var(--ink-2); }
.theater-illustration-note { border-top:1px solid var(--hair); padding-top:20px; margin-top:20px; font:400 13px/1.5 var(--sans); color:var(--ink-2); }
.theater-stage { --stage-padding-y:24px; flex-direction:column; gap:20px; padding:var(--stage-padding-y) 24px; }
.iphone-shell { width:min(350px,calc(100% - 8px),calc((100svh - 48px - 2 * var(--stage-padding-y) - 66px - var(--phone-bezel-total)) * 402 / 874 + var(--phone-bezel-total))); }
.theater-pagination { width:min(100%,350px); display:flex; align-items:center; justify-content:space-between; gap:20px; }
.theater-pagination button { display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--ink); border-radius:6px; background:var(--plurel-canvas); font:400 22px/1 var(--sans); cursor:pointer; }
.theater-pagination button:hover:not(:disabled) { background:var(--butter); }
.theater-pagination button:disabled { opacity:.4; cursor:default; }
.theater-pagination>span { font:400 13px/1 var(--sans); letter-spacing:.12em; font-variant-numeric:tabular-nums; }
.theater-frame { display:none; opacity:1; transform:none; transition:none; will-change:auto; }
.theater-frame.is-active { display:block; transform:none; }
.tour-screen { height:100%; display:grid; grid-template-rows:44px 62px minmax(0,1fr) 76px; gap:10px; padding:62px 18px 32px; background:var(--plurel-canvas); color:var(--ink); font:400 14px/1.35 var(--sans); }
.tour-screen * { box-sizing:border-box; }
.tour-app-header { display:flex; justify-content:space-between; align-items:center; }
.tour-app-header img { display:block; width:68px; height:42px; object-fit:contain; }
.tour-account { display:grid; place-items:center; width:30px; height:30px; border:1px solid var(--hair); border-radius:50%; font-size:11px; }
.tour-screen-heading { padding-top:9px; }
.tour-screen-heading>span { display:block; color:var(--ink-2); font-size:12px; margin-bottom:3px; }
.tour-screen-heading h4 { font:700 25px/1.2 var(--sans); letter-spacing:-.035em; margin:0; }
.tour-screen-content { display:flex; flex-direction:column; gap:12px; min-height:0; }
.tour-balance { padding:16px 0 6px; }
.tour-balance>span { display:block; font-size:13px; color:var(--ink-2); }
.tour-balance strong { display:block; font:700 43px/1.18 var(--sans); letter-spacing:-.045em; font-variant-numeric:tabular-nums; margin:4px 0; }
.tour-balance small { display:flex; align-items:center; gap:5px; font-size:12px; color:var(--ink-2); }
.tour-section-label { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:12px; font-weight:700; color:var(--ink-2); }
.tour-section-label>span { font-size:11px; font-weight:400; }
.tour-segments { display:grid; grid-template-columns:repeat(3,1fr); gap:4px; padding:3px; border:1px solid var(--hair); border-radius:6px; background:var(--plurel-paper); }
.tour-segments>span { padding:7px 3px; text-align:center; font-size:12px; border-radius:4px; }
.tour-segments .is-selected { background:var(--plurel-ink); color:var(--plurel-paper); }
.tour-people { border-block:1px solid var(--hair); }
.tour-person { display:flex; align-items:center; gap:10px; height:48px; border-bottom:1px solid var(--hair); }
.tour-person:last-child { border-bottom:0; }
.tour-avatar { display:grid; place-items:center; flex:none; width:30px; height:30px; border:1px solid var(--hair); border-radius:50%; background:var(--plurel-paper); font-size:10px; }
.tour-person-name { font-size:13px; font-weight:700; min-width:0; }
.tour-person-name small { display:block; font:400 10px/1.3 var(--sans); color:var(--ink-2); margin-top:2px; }
.tour-person-status { display:flex; align-items:center; gap:4px; margin-left:auto; font-size:12px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.tour-person-status.is-pending { color:var(--ink-2); }
.tour-person-status svg, .tour-funded svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.tour-invite { padding:12px; border:1px solid var(--hair); border-radius:6px; background:var(--paper); }
.tour-link { display:flex; align-items:center; gap:8px; margin:7px 0; font-size:13px; font-weight:700; }
.tour-link svg, .tour-action svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; }
.tour-invite p { font-size:11px; color:var(--ink-2); }
.tour-progress-label { display:flex; align-items:center; justify-content:space-between; font-size:12px; }
.tour-progress-label span:last-child { color:var(--ink-2); }
.tour-progress { height:6px; background:var(--plurel-track); border-radius:2px; margin-top:-5px; }
.tour-progress>span { display:block; width:75%; height:100%; background:var(--plurel-blue-ink); border-radius:2px; }
.tour-notice { display:flex; align-items:center; gap:10px; padding:12px; border:1px solid var(--hair); border-radius:6px; background:var(--paper); font-size:13px; font-weight:700; }
.tour-notice>svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.5; flex:none; }
.tour-notice small { display:block; margin-top:3px; font:400 12px/1.3 var(--sans); color:var(--ink-2); }
.tour-screen-footer { display:flex; flex-direction:column; justify-content:flex-end; gap:10px; }
.tour-action { display:flex; justify-content:space-between; align-items:center; height:44px; flex:none; padding:0 14px; border:1px solid var(--ink); border-radius:6px; background:var(--terra); box-shadow:0 2px 0 var(--ink); font-weight:700; font-size:14px; }
.tour-action--quiet { background:var(--paper); }
.tour-screen-footer p { text-align:center; color:var(--ink-2); font-size:11px; line-height:1.4; }
.tour-payment-card { position:relative; width:100%; aspect-ratio:1.586; flex:none; background:var(--plurel-cream); border:1px solid var(--ink); border-radius:8px; box-shadow:0 2px 0 var(--ink); }
.tour-payment-card>img { position:absolute; top:14px; right:16px; width:90px; height:56px; object-fit:contain; }
.tour-card-chip { position:absolute; top:43%; left:17px; width:36px; height:27px; fill:#e8cd8c; stroke:#8d733c; stroke-width:1; }
.tour-card-chip path { fill:none; }
.tour-card-number { position:absolute; bottom:40px; left:17px; font-size:14px; letter-spacing:.08em; }
.tour-card-footer { position:absolute; bottom:18px; left:17px; display:flex; gap:28px; font-size:9px; letter-spacing:.08em; }
.tour-card-contactless { position:absolute; right:17px; bottom:18px; width:18px; height:24px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; }
.tour-activity { display:flex; align-items:center; gap:8px; border-block:1px solid var(--hair); padding:12px 0; font-size:12px; }
.tour-activity>svg { width:24px; height:24px; flex:none; fill:none; stroke:currentColor; stroke-width:1.5; padding:3px; background:var(--plurel-blue-soft); border-radius:4px; }
.tour-activity small { display:block; font-size:9px; color:var(--ink-2); margin-top:3px; }
.tour-activity strong { margin-left:auto; font-size:12px; font-variant-numeric:tabular-nums; }
@media(min-width:1025px) {
  .theater-sec { padding-block:24px; scroll-margin-top:-112px; }
}
@media(max-width:1024px) {
  .theater-sec { padding:56px 24px; scroll-margin-top:-88px; }
  .theater-sticky { gap:24px; grid-template-columns:minmax(0,1fr); }
  .theater-steps { max-width:560px; width:100%; margin:auto; }
  .theater-tabs { margin-top:20px; }
  .theater-description { min-height:126px; padding-top:24px; }
  .theater-illustration-note { margin-top:12px; padding-top:12px; }
  .theater-stage { width:100%; max-width:560px; margin:auto; }
}
@media(max-width:600px) {
  .theater-sec { padding:48px 16px; }
  .theater-steps .sec-h2 { font-size:30px!important; line-height:1.1; }
  .theater-tabs { gap:6px; }
  .theater-stepBtn, .theater-stepBtn.is-active { min-height:60px; padding:10px 8px; gap:6px; font-size:14px; align-items:center; }
  .theater-stepNum { font-size:10px; }
  .theater-description { min-height:145px; }
  .theater-description h3 { font-size:20px; margin-bottom:8px; }
  .theater-illustration-note { font-size:12px; }
  .theater-stage { --stage-padding-y:18px; padding-inline:12px; gap:20px; }
}
@media(max-width:600px) {
  .hero .invite-bar { flex-direction:column; }
  .hero .invite-submit { width:100%; }
  .theater-stage { --phone-bezel-total:21px; --stage-padding-y:30px; padding-inline:14px; }
  .iphone-shell { padding:9px; border-radius:46px; }
  .iphone-screen { border-radius:35px; }
}