/* Partner page additions to the investor stylesheet (app.css stays as the investor page has it).
   .pvis is the stage each film scene module draws into: right of the copy on a wide screen; on a phone, the gap
   between the top copy group and the bottom one (the engine writes --vt / --vb, in px, on every section). */
.pvis{display:none}
.cine .pvis{display:block;position:absolute;z-index:2;pointer-events:none;
  left:calc(var(--gut) + min(500px,38vw) + 48px);right:64px;top:96px;bottom:64px}
.cine .scene.live .pvis .act{pointer-events:auto}
@media (max-aspect-ratio:4/5){
  .cine .pvis{left:16px;right:16px;top:var(--vt,30%);height:calc(var(--vb,70%) - var(--vt,30%));bottom:auto}
}
/* the opening: the 3D tiles fill the stage (the engine draws them); no module */
.cine .p1 .pvis{display:none}
.cine .cap-l{font-size:clamp(20px,1.7vw,26px);line-height:1.38;max-width:30ch}
.cine .hl.sm{font-size:var(--h2)}
.tag-launch{color:var(--blue-t);letter-spacing:.24em}
/* the ask: QR and the link beside Book a partner call */
.qr-book{display:inline-grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:14px;align-items:center;text-decoration:none;margin-left:18px;vertical-align:middle}
.qr-book img{grid-row:1/3;width:84px;height:84px;border-radius:3px;background:#fff;padding:4px}
.qr-book .lab{align-self:end}
.qr-book .qr-link{font-family:var(--tech);font-size:12px;letter-spacing:.04em;color:var(--blue-t);align-self:start;max-width:22ch;overflow-wrap:anywhere}
@media (max-aspect-ratio:4/5){.qr-book{display:none}}
/* the opening tiles' names and the ignition sit in one overlay above slides one and two (assets/app.js, tfx) */
.tfx{display:none}
.cine .tfx{display:block;position:fixed;inset:0;z-index:3;pointer-events:none}
/* the film strikes the ten tools out in white */
.aplab.x{color:#fff;background:rgba(10,12,14,.9);text-decoration:line-through;text-decoration-color:#fff;text-decoration-thickness:2px}
@media (max-width:480px){.cine .p7 .kick{letter-spacing:.12em;font-size:9.5px;white-space:nowrap}.cine .p7 .kick::after{display:none}}
/* slide one: the laser blade (a hot head with a fading blue trail) and the flash at each cut */
.lzt,.lzcut{position:absolute;left:0;top:0;opacity:0;pointer-events:none;will-change:transform,opacity;z-index:4;border-radius:50%}
.lzt{width:9px;height:9px;background:#9cc0ff;box-shadow:0 0 10px 3px rgba(47,107,255,.85)}
.lzt.lzh{width:12px;height:12px;background:#fff;box-shadow:0 0 14px 5px rgba(143,178,255,.95),0 0 34px 10px rgba(47,107,255,.6)}
.lzcut{width:64px;height:64px;background:radial-gradient(closest-side,#fff 0,rgba(200,220,255,.9) 25%,rgba(47,107,255,.35) 60%,rgba(47,107,255,0) 100%);mix-blend-mode:screen}

/* round 4: the scroll cue on the opening (Jeremy 2026-10-07) */
.scue{position:fixed;left:50%;white-space:nowrap;bottom:calc(26px + env(safe-area-inset-bottom,0px));z-index:40;display:flex;align-items:center;gap:12px;padding:10px 18px 10px 12px;border-radius:999px;border:1px solid rgba(47,107,255,.5);background:rgba(8,10,14,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#fff;font-family:var(--tech);font-size:13px;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;opacity:0;pointer-events:none;transform:translate(-50%,14px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1);box-shadow:0 0 0 0 rgba(47,107,255,.45),0 10px 30px rgba(0,0,0,.5)}
.scue.on{opacity:1;pointer-events:auto;transform:translate(-50%,0);animation:scuePulse 2.4s ease-out infinite}
.scue-m{position:relative;width:20px;height:30px;border:1.5px solid rgba(255,255,255,.85);border-radius:11px;flex:none}
.scue-w{position:absolute;left:50%;top:6px;width:3px;height:7px;margin-left:-1.5px;border-radius:2px;background:#5A8CFF;box-shadow:0 0 8px #2F6BFF;animation:scueWheel 1.6s cubic-bezier(.45,0,.2,1) infinite}
.scue-c{display:flex;flex-direction:column;align-items:center;gap:2px}
.scue-c i{display:block;width:8px;height:8px;border-right:2px solid #5A8CFF;border-bottom:2px solid #5A8CFF;transform:rotate(45deg);opacity:.25;animation:scueChev 1.6s ease-in-out infinite}
.scue-c i+i{animation-delay:.2s}
.scue:hover,.scue:focus-visible{border-color:#5A8CFF;outline:none}
@keyframes scueWheel{0%{transform:translateY(0);opacity:0}25%{opacity:1}70%{transform:translateY(10px);opacity:0}100%{opacity:0}}
@keyframes scueChev{0%,100%{opacity:.2}50%{opacity:1}}
@keyframes scuePulse{0%{box-shadow:0 0 0 0 rgba(47,107,255,.45),0 10px 30px rgba(0,0,0,.5)}70%{box-shadow:0 0 0 14px rgba(47,107,255,0),0 10px 30px rgba(0,0,0,.5)}100%{box-shadow:0 0 0 0 rgba(47,107,255,0),0 10px 30px rgba(0,0,0,.5)}}
@media (max-width:600px){.scue{font-size:12px;letter-spacing:.16em;bottom:calc(18px + env(safe-area-inset-bottom,0px))}}
@media not all{.scue.on,.scue-w,.scue-c i{animation:none}.scue-w{opacity:1}.scue-c i{opacity:.8}}
/* on a phone the cue takes the booking bar's place on the opening rest only (the bar returns on the first swipe) */
@media (max-width:600px){.bar{transition:opacity .5s ease}html.cue-on .bar{opacity:0;pointer-events:none}.scue{bottom:calc(14px + env(safe-area-inset-bottom,0px))}}

/* round 6 (Jeremy 2026-10-07, on his phone): the top-right corner sits under the phone's own controls, so on a phone Sound
   moves down beside Book a call, full button height; the opening cue rises above that row instead of hiding the bar */
@media (max-width:899px){
  .top{z-index:31}
  #soundToggle{position:fixed;left:var(--gut);bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:31;width:112px;min-height:44px;height:44px;padding:0 10px;font-size:12px;letter-spacing:.12em}
  .bar{padding-left:calc(var(--gut) + 122px)}
  #restartBtn{display:none !important}
  .ask-close .top .restart-top{display:none !important}
}
@media (max-width:600px){html.cue-on .bar{opacity:1;pointer-events:none}html.cue-on .bar .book-bar{opacity:0;pointer-events:none}
  .scue{bottom:calc(10px + env(safe-area-inset-bottom,0px));left:calc(50% + 61px)}}

/* round 6, phone memory (Jeremy 2026-10-07: the page reset after six or seven slides on his iPhone). Measured on an emulated
   iPhone 13: the Win the deal floor (an 1800px masked plane in 3D) and the 40 MIN panes (blurred glass in a 3D scene) cost
   200-350 MB of graphics memory each. On a touch screen: no backdrop blur inside the scenes (the panes are near-solid
   already), a smaller floor faded by an overlay instead of a mask, no filter glow on the big figures, and a scene that is
   off screen is taken out of the page so its layers are freed. */
@media (pointer:coarse){
  .cine .pvis *{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  .cine .scene:not(.vis) .pvis{display:none!important}
  .p5s .fl{width:1200px!important;height:1200px!important;margin:-600px 0 0 -600px!important;-webkit-mask-image:none!important;mask-image:none!important}
  .p5s .fl::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 46% 50% at 50% 58%,rgba(8,10,14,0) 0,rgba(8,10,14,.45) 40%,rgba(8,10,14,1) 100%)}
  .p8r .hx .num,.p8r .num{filter:none!important;text-shadow:0 0 22px rgba(90,140,255,.45)}
}
/* round 6, phone memory: a pane that clips its content with rounded corners inside a 3D scene costs a rounded mask layer;
   on the 40 MIN slide three of them took ~370 MB (measured; square corners: ~10 MB). On a touch screen they clip square. */
@media (pointer:coarse){
  #p10 .p10-app,#p10 .p10-pan,#p10 .abtn,#p10 .drow,#p10 .pbar,#p11 .ft,#p2 .p2-pan,#p4 .bk,#p4 .fr,#p5 .glw,#p5 .vw,#p5a .glw,
  #p6 .sheet,#p7 .face,#p8 .pane,#p8 .hx,#p8 .pg,#p8 .st,#p8 .tw,#p9 .p9-plate{border-radius:0!important}
}
@media (pointer:coarse){#p5 .orb{overflow:visible!important}}
/* cue review 2026-10-08: hidden = out of the tab order and still (fade-out kept by delaying visibility) */
.scue{visibility:hidden;transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1),visibility 0s linear .6s}
.scue.on{visibility:visible;transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1),visibility 0s}
.scue:not(.on) .scue-w,.scue:not(.on) .scue-c i{animation:none}

/* 2026-10-19 (DealCloser commercial package, partner page) */
/* "Illustrative data": a small label above the copy of every slide whose picture is a sample, never a result */
.lab.ill{color:rgba(225,229,229,.62);letter-spacing:.2em;margin:0 0 -4px}
/* links inside the copy (the trust and FAQ link on the implementation slide, the packet link on the opening) */
.cine .scene.live .copy a:not(.btn){pointer-events:auto;color:var(--blue-t);text-decoration:underline;text-underline-offset:3px}
.cine .scene.live .copy a.btn{pointer-events:auto}
.r-cta2{margin-top:6px}
/* the opening hero (2026-10-19, founder: "size it, format it, and stack it ... Make it look good"; HERO_FORMAT_SPEC): the
   eyebrow, headline, proof line and subhead in one left column, the two buttons stacked under them at one width, the demonstration
   (filled blue) on top and the packet (blue outline) under it; Start and "Replace the stack." follow under the buttons. The sphere
   keeps its own side (dyson_intro.js fits it clear of the column, the buttons and their glow). Two layouts, chosen by the
   screen's shape exactly as the sphere is: side by side (copy left, sphere right) on any screen wider than about square, copy
   under the sphere on a portrait one. The overlay takes no taps; only the two buttons do. */
.dy-copy{gap:0}
.dy-copy .bh-kick{position:static;margin:0 0 14px;font-size:12px;letter-spacing:.2em;line-height:1.3;color:rgba(235,238,238,.8);white-space:nowrap}
.dy-copy h1{font-size:clamp(38px,4.4vw,64px);font-weight:600;letter-spacing:-.03em;line-height:1.02;text-wrap:balance}
.dy-copy h1.chrome{background-size:280% 100%,100% 1.02em}
.dy-hi{display:flex;flex-direction:column;gap:0}
.dy-hi .line{max-width:44ch;text-shadow:0 2px 18px rgba(0,0,0,.9),0 0 3px rgba(0,0,0,.8)}
.dy-hi .dy-proof{margin-top:18px;font-size:17px;line-height:1.4;font-weight:600;color:#fff}
.dy-hi .dy-proof + .line{margin-top:10px;font-size:16px;line-height:1.5;color:rgba(240,240,240,.82)}
.dy-cta{display:flex;flex-direction:column;align-items:flex-start;flex-wrap:nowrap;gap:10px;margin:22px 0 0;pointer-events:none}
.bh-x .dy-cta .btn{pointer-events:auto;width:min(300px,100%);min-height:44px;height:44px;padding:0 18px;justify-content:center;text-align:center;
  font-size:12px;letter-spacing:.12em;white-space:nowrap;transition:transform .2s,box-shadow .25s,background .25s,border-color .25s,filter .25s}
.bh-x .dy-cta .btn-blue:hover,.bh-x .dy-cta .btn-blue:focus-visible{filter:brightness(1.12)}
.bh-x .dy-cta .btn-ghost{background:transparent;border:1px solid rgba(90,140,255,.72);color:#EEF2FF;box-shadow:none}
.bh-x .dy-cta .btn-ghost:hover,.bh-x .dy-cta .btn-ghost:focus-visible{background:rgba(47,107,255,.13);border-color:#8FB2FF}
.dy-copy .dy-lo{margin-top:26px}
.dy-hi .nw{white-space:nowrap}   /* a compound word never breaks at its hyphens */
/* side by side: the column on the left, never wider than min(520px, 44vw) */
@media not all and (max-aspect-ratio:9/10){
  .dy-copy{top:max(100px,14vh);bottom:auto;right:auto;width:min(520px,44vw)}
}
/* side by side on a small window (under 900 px wide, the bottom bar showing): the column starts higher so Start clears the bar */
@media (max-width:899px) and (min-aspect-ratio:9/10){
  .dy-copy{top:72px;left:var(--gut)}
  .dy-copy .bh-kick{font-size:12px}
}
/* portrait: the column runs the screen's width under the sphere, above Start and the bottom bar */
@media (max-aspect-ratio:9/10){
  .dy-copy{top:auto;left:var(--gut);right:var(--gut);width:auto;max-width:560px;bottom:calc(var(--barh) + 64px)}
}
@media (max-aspect-ratio:9/10) and (max-width:599px){
  /* founder 2026-10-19 on the 390 shot: "text way too big, the sphere way too small" - smaller type, the room goes to the sphere */
  .dy-copy .bh-kick{margin-bottom:6px;font-size:11px}
  .dy-copy h1{font-size:clamp(24px,6.6vw,27px);line-height:1.06}
  .dy-hi .dy-proof{margin-top:10px;font-size:14px;line-height:1.38}
  .dy-hi .dy-proof + .line{margin-top:6px;font-size:13.5px;line-height:1.45}
  .dy-hi .nw{white-space:normal}
  .dy-cta{margin-top:14px;gap:8px}
  .bh-x .dy-cta .btn{width:100%;max-width:340px;height:40px;min-height:40px;font-size:11.5px}
  .dy-copy .dy-lo{margin-top:10px}
}
@media (max-aspect-ratio:9/10) and (max-width:599px) and (max-height:700px){
  .dy-copy h1{font-size:23px}
  .dy-hi .dy-proof{font-size:13.5px}
  .dy-hi .dy-proof + .line{font-size:13px;line-height:1.4}
  .dy-cta{margin-top:14px;gap:8px}
}
/* the field record under the timed proof (2026-10-19, founder tap): one block, the one sentence, no other figures */
.frec{display:flex;flex-direction:column;gap:6px;margin-top:6px;padding-top:12px;border-top:1px solid rgba(225,229,229,.2);max-width:44ch}
.frec .lab{color:rgba(120,160,255,.95)}
.frec .line{font-size:clamp(14px,1.05vw,16px);line-height:1.45;color:rgba(225,229,229,.9)}
@media (max-width:899px){.frec{gap:4px;margin-top:2px;padding-top:8px}.frec .line{font-size:12.5px;line-height:1.35}}
@media (max-width:640px){.cine .scene.p8 .cap-l{font-size:16px;line-height:1.35}.cine .scene.p8 .grp.lo{gap:8px}.cine .scene.p8 .frec .line{font-size:12px;line-height:1.35}}   /* timed proof on phones: smaller copy, so the race gets the room (Jeremy 2026-10-25) */
@media (max-width:899px) and (max-height:720px){.cine .scene.p8 .cap-l{font-size:15px;line-height:1.3}.cine .scene.p8 .frec .line{font-size:11.5px;line-height:1.3}.cine .scene.p8 .grp.lo{gap:8px}}
/* the phone opening (founder 2026-10-19): the headline first, the proof, the line and the buttons on the first scroll */
@media (max-aspect-ratio:9/10) and (max-width:699px){
  .dy-x:not(.dy-two) .dy-hi .line,.dy-x:not(.dy-two) .dy-cta{display:none}
  .dy-x.dy-two .dy-hi h1,.dy-x.dy-two .bh-kick,.dy-x.dy-two .dy-lo{display:none}
  .dy-x.dy-two .dy-hi .dy-proof{margin-top:0}
}
/* the opening's copy in the home page's sizes and layout (Jeremy 2026-10-19: "the text size and layout needs to be the same as the
   homepage and the Investor page... on the desktop, on the laptop and on the phone"): the kicker as the home eyebrow, the headline as
   the home headline, the proof and the line as the home's two lines, the buttons as the home's (210 by 31, a phone 238 by 28);
   side by side, the column stands centred down the screen under the menu as the home's does, with room kept under it for Start */
.dy-copy .bh-kick{font:700 clamp(11px,.9vw,14px)/1.4 var(--tech);letter-spacing:.14em;color:#fff;margin:0 0 14px}
.dy-copy h1{font-size:clamp(33.44px,3.87vw,56px);letter-spacing:-.03em;line-height:1.02}
.dy-hi .dy-proof{margin-top:18px;font-size:14.96px;line-height:1.35}
.dy-hi .dy-proof + .line{margin-top:12px;font-size:14.08px;line-height:1.5}
.dy-hi .line{max-width:min(44ch,520px)}
.dy-cta{margin-top:22px;gap:10px}
.bh-x .dy-cta .btn{width:min(210px,100%);height:30.8px;min-height:0;padding:0 11.2px;font-size:10px;line-height:1;letter-spacing:.12em}
.dy-lo h2{font-size:calc(var(--h3) * .88)}
.dy-lo .line{font-size:calc(var(--bt) * .88)}
.dy-copy .dy-lo{margin-top:22px}
@media not all and (max-aspect-ratio:9/10){
  .dy-copy{top:calc(50% + 28px);transform:translateY(-50%);padding-bottom:58px}
}
@media (max-width:899px){.dy-lo .line{font-size:12px}.dy-lo h2{font-size:16px}}
@media (max-aspect-ratio:9/10) and (max-width:599px){
  .dy-copy .bh-kick{font-size:10px;letter-spacing:.16em;margin-bottom:10px}
  .dy-copy h1{font-size:clamp(19.2px,5.28vw,21.6px);line-height:1.06}
  .dy-hi .dy-proof{margin-top:10px;font-size:11.2px;line-height:1.35}
  .dy-hi .dy-proof + .line{margin-top:8px;font-size:11.2px;line-height:1.45}
  .dy-cta{margin-top:16px;gap:8px}
  .bh-x .dy-cta .btn{width:min(238px,100%);max-width:none;height:28px;min-height:0;padding:0 9.8px;font-size:10px;letter-spacing:.1em}
}
@media (max-aspect-ratio:9/10) and (max-width:599px) and (max-height:700px){
  .dy-copy h1{font-size:19.2px}
}