/* home page */
.announce{display:block;text-align:center;padding:9px 16px;font-size:13px;font-weight:500;color:var(--pink);background:#0D0F1A;border-bottom:1px solid var(--line)}
.announce:hover{color:#fff}
.pill{display:inline-flex;gap:8px;align-items:center;font-size:13px;font-weight:500;color:var(--pink);border:1px solid rgba(255,143,200,.35);background:rgba(255,143,200,.07);padding:7px 13px;border-radius:999px}
.pill.light{color:var(--pink-ink);background:rgba(255,255,255,.6);border-color:rgba(255,255,255,.75)}
.h2x{margin:0;font-family:var(--head);font-weight:500;font-size:clamp(38px,5.4vw,64px);line-height:1;letter-spacing:-.01em}
.h2x .acc{font-size:1.08em}
.h-head{display:flex;flex-direction:column;gap:10px;margin-bottom:28px;max-width:720px}
.h-p{margin:0;font-size:17px;line-height:1.65;color:var(--ink-2)}

/* hero */
.h-hero{padding-top:clamp(40px,7vw,84px);display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px}
.h-title{margin:0;font-family:var(--head);font-weight:500;font-size:clamp(40px,6.4vw,90px);line-height:1;letter-spacing:-.04em;display:flex;flex-direction:column;align-items:center}
.h-title .tl{display:block;white-space:nowrap}
.h-title .acc,.h-title .it{font-size:1.08em}
@media (max-width:620px){.h-title{font-size:9vw}}
.tpill{display:inline-block;width:1.5em;height:.74em;border-radius:999px;background:#1A1F33 center/cover;vertical-align:.04em}
.phone{position:relative;display:inline-block;width:.6em;height:1.24em;vertical-align:-.28em;margin:0 .08em;perspective:5em;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}
.phone.grabbing{cursor:grabbing}
.p3{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateY(-14deg) rotateX(8deg);will-change:transform}
.pe,.pf{position:absolute;inset:0;border-radius:.1em}
.pe{border:.014em solid #3A3C47;background:none;transform:translateZ(calc((var(--k) - 4) * .0075em))}
.pf{-webkit-backface-visibility:hidden;backface-visibility:hidden}
.pf.pfront{transform:translateZ(.032em);background:#07080C;box-shadow:inset 0 0 0 .008em #5A5D6A}
.pf.pback{transform:rotateY(180deg) translateZ(.032em);background:linear-gradient(150deg,#FFD3EA 0%,#FF9FD0 50%,#E06AA8 100%);box-shadow:inset 0 0 0 .008em rgba(255,255,255,.5)}
.cam{position:absolute;left:.05em;top:.05em;width:.24em;height:.24em;border-radius:.06em;background:rgba(255,255,255,.35);box-shadow:inset 0 0 0 .006em rgba(255,255,255,.6)}
.cam i{position:absolute;width:.085em;height:.085em;border-radius:50%;background:#14151C;box-shadow:0 0 0 .01em #8E909C}
.cam i:nth-child(1){left:.025em;top:.025em}.cam i:nth-child(2){left:.025em;top:.13em}.cam i:nth-child(3){left:.135em;top:.078em}
.plogo{position:absolute;left:50%;top:50%;width:.22em;height:.22em;margin:-.11em 0 0 -.11em;background:#7A1E4E;-webkit-mask:url(../images/logo.png) center/contain no-repeat;mask:url(../images/logo.png) center/contain no-repeat;opacity:.75}
.phone .scr{position:absolute;inset:.02em;border-radius:.085em;overflow:hidden;background:#0B0D16}
.phone .scr i,.phone .scr video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#0B0D16 center/cover}
.phone .scr i{opacity:0;transition:opacity .8s ease}
.phone .scr i.on{opacity:1}
.phone .scr::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(115deg,rgba(255,255,255,.2),rgba(255,255,255,0) 38%)}
.phone .island{position:absolute;left:34%;width:32%;top:2.2%;height:3.6%;border-radius:99px;background:#050608;z-index:2}
.h-sub{margin:0;max-width:580px;font-size:clamp(15px,2vw,18px);line-height:1.6;color:var(--ink-2)}
.h-cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.h-icons{display:flex;gap:10px;justify-content:center}
.hicon{width:44px;height:44px;border-radius:14px;border:1px solid var(--line-2);display:flex;align-items:center;justify-content:center;color:var(--ink-2);transition:color .2s,border-color .2s,background .2s}
.hicon:hover{color:var(--pink);border-color:rgba(255,143,200,.5);background:rgba(255,143,200,.06)}

/* endless carousel */
.marq{position:relative;margin-top:clamp(36px,5vw,60px);overflow:hidden;padding:6px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%)}
.marq::before,.marq::after{content:"";position:absolute;top:0;bottom:0;width:16%;z-index:3;pointer-events:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.marq::before{left:0;-webkit-mask-image:linear-gradient(90deg,#000,transparent);mask-image:linear-gradient(90deg,#000,transparent)}
.marq::after{right:0;-webkit-mask-image:linear-gradient(270deg,#000,transparent);mask-image:linear-gradient(270deg,#000,transparent)}
.mtrack{display:flex;gap:14px;width:max-content;will-change:transform}
.marq{cursor:grab;touch-action:pan-y;-webkit-user-select:none;user-select:none}
.marq.grabbing{cursor:grabbing}
.marq.grabbing .rcard{pointer-events:none}
.marq img,.marq video{-webkit-user-drag:none;pointer-events:none}
@keyframes marq{to{transform:translateX(calc(-50% - 7px))}}
.rcard{position:relative;flex:0 0 clamp(210px,24vw,290px);aspect-ratio:3/4;border-radius:20px;overflow:hidden;background:var(--panel-2);isolation:isolate}
.rcard .rm{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rcard::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(8,9,15,0) 50%,rgba(8,9,15,.9))}
.rt{position:absolute;left:16px;right:16px;bottom:14px;z-index:2;display:flex;flex-direction:column;gap:4px;text-align:left}
.rt b{font-family:var(--head);font-size:24px;font-weight:500;line-height:1.05}
.rt em{font-style:normal;font-size:12px;color:var(--ink-2)}
.rcard:hover b{color:var(--pink)}

/* path */
.path{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:760px){.path{grid-template-columns:1fr}}
.pcard{position:relative;display:flex;flex-direction:column;gap:10px;padding:18px 18px 22px;border-radius:24px;border:1px solid var(--line-2);background:var(--panel)}
.pcard:hover{color:var(--ink);border-color:rgba(255,143,200,.45)}
.pmedia{display:block;aspect-ratio:16/10;border-radius:16px;overflow:hidden;background:var(--panel-2);margin-bottom:6px}
.pmedia .pm{width:100%;height:100%;object-fit:cover}
.ptag{align-self:flex-start;font-size:12px;font-weight:500;color:#8FE3B0;background:rgba(143,227,176,.1);border:1px solid rgba(143,227,176,.3);padding:4px 10px;border-radius:999px}
.pt{font-family:var(--head);font-weight:500;font-size:clamp(32px,3.6vw,42px);line-height:1}

.pd{font-size:15px;line-height:1.6;color:var(--ink-2)}
.pl{margin-top:auto;padding-top:6px;color:var(--pink);font-weight:500;font-size:14px}
/* masterclass: a small lesson plan instead of a photo */
.mcg{position:relative;z-index:4;aspect-ratio:16/10;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:rgba(8,9,15,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:16px 16px 14px;display:flex;flex-direction:column;gap:10px;margin-bottom:6px}
.mch{display:flex;align-items:baseline;justify-content:space-between}
.mch span{font-family:var(--head);font-size:22px;font-weight:500}
.mch em{font-style:normal;font-size:12px;color:var(--ink-3)}
.mcl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;flex:1;justify-content:center;position:relative}
.mcl::before{content:"";position:absolute;left:11px;top:12px;bottom:12px;width:1px;background:linear-gradient(180deg,var(--pink),rgba(255,143,200,.1))}
.mcl li{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--ink-2)}
.mcl li b{position:relative;width:23px;height:23px;border-radius:999px;display:flex;align-items:center;justify-content:center;font-size:11px;background:#1A1E33;border:1px solid rgba(255,143,200,.5);color:var(--pink)}
.mcl li:first-child b{background:var(--pink);color:var(--pink-ink)}
.mcl li span{flex:1}
.mcl li i{color:var(--ink-3);display:flex}
.mcf{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:500;color:var(--ink-2)}
.dot{display:inline-block;width:7px;height:7px;border-radius:999px;background:var(--pink);box-shadow:0 0 0 4px rgba(255,143,200,.15);animation:pulse 2s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 0 0 7px rgba(255,143,200,0)}}
.soonc > *{position:relative;z-index:4}
@media (max-width:420px){.mcg{aspect-ratio:auto}}

/* collage after the reference: a tight pile of small pictures, a new one lands on top every 140 ms */
.shufsec{padding-top:clamp(36px,5vw,64px);padding-bottom:0}
.shuffle{position:relative;height:clamp(520px,58vw,760px);overflow:hidden;margin:0 calc(-1 * clamp(0px,2vw,24px))}
.sh-tiles{position:absolute;inset:0}
.sh-tiles span{position:absolute;background:#141826 center/cover;border-radius:2px}
.sh-text{position:absolute;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;text-align:center;pointer-events:none;
  font-family:'IBM Plex Mono',ui-monospace,monospace;font-weight:500;font-size:clamp(60px,10.6vw,150px);line-height:.98;letter-spacing:-.04em;color:var(--bg)}
@media (max-width:600px){.sh-text{font-size:16vw}}

/* all prompts banner: pink gradient, ghost wordmark, fan of covers */
.vaultbig{position:relative;border-radius:28px;padding:clamp(32px,5.5vw,68px);min-height:clamp(380px,38vw,470px);display:flex;align-items:center;color:var(--pink-ink);
  background:radial-gradient(48% 70% at 12% 18%,#FFD0E8 0%,rgba(255,208,232,0) 65%),radial-gradient(40% 60% at 78% 22%,#F05FA6 0%,rgba(240,95,166,0) 70%),radial-gradient(60% 80% at 70% 105%,#6E2556 0%,rgba(110,37,86,0) 70%),#F287BE}
.vaultbig > *{position:relative;z-index:4}
.vaultbig .ghost{position:absolute;z-index:1;left:0;bottom:-9%;width:100%;height:auto;pointer-events:none}
.ghost text{font-family:var(--head);font-weight:500;font-size:300px;letter-spacing:-.05em;fill:none;stroke:rgba(255,255,255,.34);stroke-width:1.4}
.vb-copy{display:flex;flex-direction:column;align-items:flex-start;max-width:min(560px,54%)}
.vb-h{margin:20px 0 0;font-family:var(--head);font-weight:500;font-size:clamp(40px,5.4vw,72px);line-height:.96;letter-spacing:-.04em;color:var(--pink-ink)}
.vb-p{margin:12px 0 0;max-width:420px;font-size:clamp(16px,1.4vw,18px);font-weight:500;line-height:1.5;color:#3A0F28}
.vb-copy .btn{margin-top:32px}
.fan{position:absolute;z-index:2;right:clamp(24px,5vw,80px);top:50%;width:min(44%,470px);height:330px;transform:translateY(-44%);pointer-events:none}
.fan span{position:absolute;left:50%;bottom:4%;width:32%;margin-left:-16%;aspect-ratio:3/4;border-radius:16px;overflow:hidden;background:#1A1F33;border:3px solid rgba(255,255,255,.9);box-shadow:0 18px 40px rgba(60,0,30,.3);
  transform-origin:50% 240%;transform:rotate(calc(var(--i) * 11deg));transition:transform .6s cubic-bezier(.34,1.5,.5,1)}
.vaultbig:hover .fan span{transform:rotate(calc(var(--i) * 14deg)) translateY(-8px)}
.fan .fm{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:820px){
  .vaultbig{flex-direction:column;align-items:flex-start}
  .vb-copy{max-width:100%}
  .fan{position:relative;right:auto;top:auto;transform:none;width:100%;height:clamp(240px,62vw,300px);margin-top:10px}
  .fan span{width:30%;margin-left:-15%}
}

/* how it works: steps on a line, with small product sketches */
.how-sec{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(28px,5vw,72px);align-items:start}
@media (max-width:860px){.how-sec{grid-template-columns:1fr}}
.how-l{display:flex;flex-direction:column;align-items:flex-start;gap:14px;position:sticky;top:100px}
@media (max-width:860px){.how-l{position:static}}
.how-l .btn{margin-top:10px}
.tl3{list-style:none;margin:0;padding:0;position:relative;display:flex;flex-direction:column;gap:14px}
.tl3::before{content:"";position:absolute;left:19px;top:24px;bottom:24px;width:1px;background:linear-gradient(180deg,var(--pink),rgba(255,143,200,.15))}
.tl3 li{display:flex;gap:16px;align-items:flex-start}
.tn{position:relative;z-index:1;flex:0 0 40px;height:40px;border-radius:999px;display:flex;align-items:center;justify-content:center;font-weight:500;background:var(--bg);border:1px solid rgba(255,143,200,.55);color:var(--pink)}
.tl3 li:first-child .tn{background:var(--pink);color:var(--pink-ink)}
.tb{flex:1;min-width:0;padding:16px 18px;border-radius:18px;border:1px solid var(--line);background:var(--panel)}
.tb b{display:block;font-size:17px}
.tb p{margin:4px 0 0;font-size:14px;line-height:1.55;color:var(--ink-2)}
.ui{margin-top:14px;height:56px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid var(--line);display:flex;align-items:center;gap:8px;padding:0 10px}
.ui-pick span{flex:0 0 30px;height:40px;border-radius:7px;background:linear-gradient(160deg,#2B3256,#141829)}
.ui-pick span.sel{flex-basis:30px;outline:2px solid var(--pink);outline-offset:2px;background:linear-gradient(160deg,#F2A3CC,#6E2556)}
.ui-copy .ln{flex:1;display:flex;flex-direction:column;gap:6px}
.ui-copy .ln i{display:block;height:6px;border-radius:6px;background:rgba(201,208,226,.18)}
.ui-copy .ln i:nth-child(2){width:80%}.ui-copy .ln i:nth-child(3){width:55%}
.ui-copy .cp{font-size:12px;font-weight:500;color:var(--pink-ink);background:var(--pink);padding:6px 10px;border-radius:999px}
.ui-gen .bar{flex:1;height:8px;border-radius:8px;background:rgba(255,255,255,.08);overflow:hidden}
.ui-gen .bar i{display:block;height:100%;width:6%;border-radius:8px;background:linear-gradient(90deg,#F2A3CC,var(--pink));animation:gen 6s ease-in-out infinite}
@keyframes gen{0%{width:6%;opacity:1}36%{width:100%}92%{width:100%;opacity:1}97%{opacity:0}100%{width:6%;opacity:0}}
.ui-gen .pc{font-size:12px;font-weight:500;color:var(--ink-2)}
.gstage{display:grid;margin-top:14px}
.gstage > *{grid-area:1/1}
.gstage .ui{margin-top:0;animation:genbox 6s ease infinite}
@keyframes genbox{0%,37%{opacity:1;transform:none}41%,91%{opacity:0;transform:scale(.94)}96%,100%{opacity:1;transform:none}}
.gbadges{display:flex;flex-wrap:wrap;align-items:center;align-content:center;gap:8px;pointer-events:none}
.gbadges span{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;font-size:12.5px;font-weight:500;color:var(--pink-ink);background:var(--pink);box-shadow:0 6px 18px rgba(255,143,200,.25);
  opacity:0;transform:translateY(10px) scale(.5);animation:gbadge 6s cubic-bezier(.34,1.7,.5,1) infinite}
.gbadges span:nth-child(2){animation-delay:.22s;background:#FFE3F1}
.gbadges span:nth-child(3){animation-delay:.44s;background:#2A1022;color:var(--pink);box-shadow:none;border:1px solid rgba(255,143,200,.4)}
@keyframes gbadge{0%,40%{opacity:0;transform:translateY(10px) scale(.5)}45%{opacity:1;transform:translateY(-2px) scale(1.07)}49%{transform:none}86%{opacity:1;transform:none}91%,100%{opacity:0;transform:translateY(-6px) scale(.9)}}
@media (prefers-reduced-motion: reduce){.ui-gen .bar i,.gstage .ui{animation:none}.ui-gen .bar i{width:100%}.gstage .ui{opacity:0}.gbadges span{animation:none;opacity:1;transform:none}}

/* faq */
.faq{display:flex;flex-direction:column;gap:10px;max-width:860px}
.faq details{border:1px solid var(--line-2);border-radius:16px;background:var(--panel)}
.faq summary{list-style:none;cursor:pointer;padding:18px 54px 18px 20px;position:relative;font-weight:500;font-size:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:22px;font-weight:400;color:var(--ink-2)}
.faq details[open] summary::after{content:"–";color:var(--pink)}
.faq details p{margin:0;padding:0 20px 18px;font-size:15px;line-height:1.65;color:var(--ink-2)}
.ask{display:flex;align-items:center;gap:14px;margin-top:14px;padding:16px 18px;border:1px solid var(--line-2);border-radius:16px;max-width:860px}
.ask .ni{width:38px;height:38px;border-radius:12px;background:rgba(255,143,200,.12);color:var(--pink);display:flex;align-items:center;justify-content:center;font-weight:500}
.ask b{display:block;font-size:15px}
.ask em{font-style:normal;font-size:13px;color:var(--ink-3)}
.ask .arr{margin-left:auto;color:var(--ink-3)}

/* contact */
.outro{padding:clamp(100px,12vw,150px) 0 clamp(70px,9vw,110px);text-align:center}
.outro-in{display:flex;flex-direction:column;align-items:center;gap:18px}
.outro .h2x{font-size:clamp(42px,6.6vw,86px)}
.sbtns{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:18px;padding:14px;border-radius:24px;background:#F5B3D5}
.sbtn2{width:68px;height:68px;border-radius:18px;background:#fff;color:#1A0712;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;transition:background .2s,color .2s}
.sbtn2 small{font-size:10px;font-weight:500;color:#6B5363}
.sbtn2:hover{background:#1A0712;color:var(--pink)}
.sbtn2:hover small{color:#F5B3D5}
@media (max-width:480px){.sbtns{gap:7px;padding:10px;flex-wrap:nowrap}.sbtn2{width:56px;height:56px;border-radius:15px}.sbtn2 small{font-size:9px}}

/* velvet footer, starts right under the fomo band */
.velvet{position:relative;background:#A61336;color:#FFE3EE}
.vel-svg,.vel-img{display:block;width:100%;height:auto}
.vel-ui{padding:0 24px 22px}
.velvet nav{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;padding:22px 0 14px;font-weight:500;font-size:15px}
.velvet a,.velvet .pf-bot{color:#FFE3EE;text-shadow:0 1px 0 rgba(60,0,15,.55)}
.velvet a:hover{color:#fff}
.velvet .pf-bot{display:flex;justify-content:space-between;gap:16px;padding-top:14px;font-size:12px;border-top:1px solid rgba(255,217,236,.25)}
@media (min-width:1000px){
  .velvet .vel-ui{position:absolute;left:0;right:0;bottom:0;top:22%;padding:0;display:flex;flex-direction:column;justify-content:space-between}
  .velvet nav{padding:18px 0 0}
  .velvet .pf-bot{border-top:0;justify-content:center;gap:28px;padding:0 0 12px;font-size:11px}
}
@media (max-width:760px){.velvet{padding-bottom:70px}}

/* mobile dock */
.dock{display:none}
@media (max-width:760px){
  .dock{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;align-items:center;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(8,9,15,.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--line)}
  .dock span{display:flex;flex-direction:column}
  .dock em{font-style:normal;font-size:12px;color:var(--ink-3)}
  .dock b{font-size:17px}
  .dock .btn{margin-left:auto;padding:12px 22px}
}

/* grain and drop-in textures */
.grain{position:relative;isolation:isolate;overflow:hidden}
.grain::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:3;opacity:.3;mix-blend-mode:overlay;background-size:220px 220px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .5  0 0 0 0 .5  0 0 0 0 .5  0 0 0 1 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
.soonc{background:radial-gradient(60% 80% at 90% 0%,rgba(255,143,200,.22),rgba(255,143,200,0) 70%),radial-gradient(50% 70% at 0% 100%,rgba(120,130,170,.18),rgba(120,130,170,0) 70%),var(--panel)}
.has-asset{background-image:var(--asset)!important;background-size:cover!important;background-position:center!important}
.has-asset.grain::after{opacity:.12}
.how-l .h2x{font-size:clamp(34px,4.1vw,54px);white-space:nowrap}
@media (max-width:420px){.how-l .h2x{white-space:normal}}
@media (min-width:1000px){.velvet .vel-ui{top:11%}}

/* reveal: words rise in one by one, pictures pop first */
.rv .w{display:inline-block;opacity:0;transform:translateY(.32em);filter:blur(10px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.8,.2,1),filter .7s ease;transition-delay:calc(var(--i,0) * 75ms + 120ms)}
.rv .w.obj{transform:scale(.3) rotate(-12deg);filter:none;transition:opacity .4s ease,transform .7s cubic-bezier(.34,1.7,.5,1);transition-delay:0s}
.rv.in .w{opacity:1;transform:none;filter:none}
.h-title .tl{white-space:nowrap}
.pop > *{opacity:0;transform:translateY(14px) scale(.7);transition:opacity .45s ease,transform .6s cubic-bezier(.34,1.7,.5,1)}
.pop.in > *{opacity:1;transform:none}
.pop.in > *:nth-child(1){transition-delay:.15s}.pop.in > *:nth-child(2){transition-delay:.25s}.pop.in > *:nth-child(3){transition-delay:.35s}.pop.in > *:nth-child(4){transition-delay:.45s}.pop.in > *:nth-child(5){transition-delay:.55s}.pop.in > *:nth-child(6){transition-delay:.65s}
@media (prefers-reduced-motion: reduce){.rv .w,.pop > *{opacity:1;transform:none;filter:none;transition:none}}
/* falling icon tiles in the contact block */
.outro{position:relative;overflow:hidden}
.outro-in{position:relative;z-index:2}
.pile{position:absolute;left:0;right:0;bottom:0;height:100%;pointer-events:none;z-index:1}
.pile .pt{position:absolute;left:0;top:0;border-radius:30%;display:flex;align-items:center;justify-content:center;will-change:transform;
  background:linear-gradient(155deg,#FFC2E2 0%,#FF8FC8 60%,#F26BAE 100%);color:#2A0718;
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.55),inset 0 -3px 6px rgba(120,10,60,.25),0 6px 14px rgba(0,0,0,.35)}
.pile .pt.dk{background:linear-gradient(155deg,#3A1530,#1C0814);color:var(--pink);box-shadow:inset 0 1px 0 rgba(255,143,200,.3),0 6px 14px rgba(0,0,0,.4)}
.pile .pt.wh{background:linear-gradient(155deg,#FFFFFF,#FFE6F2);color:#E0569C}
.pile .pt.hot{background:linear-gradient(155deg,#FF6FB1,#C7306F);color:#FFF0F7}
.pile .pt svg{display:block;filter:drop-shadow(0 1px 0 rgba(255,255,255,.18))}
.outro{padding-bottom:clamp(140px,16vw,200px)}
.h-title:not(.rv){visibility:hidden}

/* fomo: hero line and the band above the footer */
.fomo{display:inline-flex;align-items:center;gap:10px;margin:0;padding:9px 16px;border-radius:999px;font-size:14px;color:var(--ink-2);background:rgba(255,143,200,.08);border:1px solid rgba(255,143,200,.22)}
.fomo b{color:var(--ink);font-weight:500}
.fomo .live{position:relative;flex:0 0 8px;height:8px;border-radius:50%;background:var(--pink)}
.fomo .live::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1.5px solid var(--pink);animation:live 1.8s ease-out infinite}
@keyframes live{0%{transform:scale(.4);opacity:1}100%{transform:scale(1.5);opacity:0}}
@media (max-width:600px){.fomo{font-size:13px;border-radius:16px;text-align:left}}
.fband{position:relative;z-index:3;overflow:hidden;background:var(--pink);color:var(--pink-ink);padding:16px 0;border-top:1px solid rgba(255,255,255,.4)}
.fb-track{display:flex;align-items:center;gap:28px;width:max-content;animation:fbm 32s linear infinite;font-family:var(--head);font-weight:500;font-size:clamp(20px,2.4vw,30px);letter-spacing:-.03em;white-space:nowrap}
.fb-track i{font-style:normal;font-size:.7em;opacity:.7}
.fb-track span:nth-of-type(2n){font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em}
@media (prefers-reduced-motion: reduce){.fb-track{animation:none}}
@keyframes fbm{to{transform:translateX(calc(-50% - 14px))}}

/* logo in the contact block and cat tiles in the pile */
.o-logo{width:clamp(72px,8vw,100px);height:auto;margin-bottom:-4px;animation:bob 3.2s ease-in-out infinite;filter:drop-shadow(0 8px 24px rgba(255,143,200,.25))}
@keyframes bob{50%{transform:translateY(-7px) rotate(-5deg)}}
@media (prefers-reduced-motion: reduce){.o-logo{animation:none}}
.pt .cat{display:block;background:currentColor;-webkit-mask:url(../images/logo.png) center/contain no-repeat;mask:url(../images/logo.png) center/contain no-repeat}
.pile .pt{transition:none}

/* type v2 */
.h-title,.h2x{font-weight:400}
.h-title .acc,.h-title .it{font-size:.95em}
.pill,.announce,.fomo b,.pl,.faq summary,.velvet nav,.mch span,.pt,.rt b{font-weight:500}
.vb-h{font-weight:500}
.fb-track{font-weight:500}
.fb-track span:nth-of-type(2n){font-family:var(--serif);font-style:normal;letter-spacing:-.05em;font-size:1.05em}
@media (max-width:620px){.h-title{font-size:8.3vw}}

/* ---------- round 3 ---------- */
.sh-text{font-weight:700}
/* hero with a sky of stars and ascii glyphs */
.hero-wrap{position:relative;isolation:isolate}
.sky{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent);mask-image:linear-gradient(180deg,#000 70%,transparent)}
.h-hero{padding-bottom:10px}
/* path cards: same tags, lighter */
.ptag{font-weight:400;padding:5px 11px}
.ptag.soon{display:inline-flex;align-items:center;gap:8px;color:var(--pink);background:rgba(255,143,200,.08);border-color:rgba(255,143,200,.32)}
.ptag .dot{width:6px;height:6px}
.pl{font-weight:500}
.mcv{position:relative;display:flex;align-items:center;justify-content:center;background:
  radial-gradient(70% 90% at 85% 0%,rgba(255,143,200,.28),rgba(255,143,200,0) 60%),
  radial-gradient(60% 80% at 0% 100%,rgba(140,90,200,.22),rgba(140,90,200,0) 65%),#0B0D18;border:1px solid var(--line)}
.mcv-rows{position:absolute;inset:14% 12%;display:flex;flex-direction:column;justify-content:space-between;filter:blur(5px);opacity:.7}
.mcv-rows i{display:flex;align-items:center;gap:12px;height:14%}
.mcv-rows i::before{content:"";flex:0 0 auto;width:clamp(18px,2.2vw,26px);aspect-ratio:1;border-radius:50%;background:rgba(255,143,200,.55)}
.mcv-rows i::after{content:"";height:38%;width:var(--w);border-radius:99px;background:rgba(255,255,255,.28)}
.mcv-lock{position:relative;display:inline-flex;align-items:center;gap:9px;padding:11px 16px;border-radius:999px;background:rgba(8,9,15,.72);border:1px solid rgba(255,143,200,.35);color:var(--pink);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.mcv-lock em{font-style:normal;font-size:14px;color:var(--ink)}
#mc-card:hover .mcv-rows{filter:blur(3px);opacity:.85;transition:filter .4s,opacity .4s}
/* collage takes the whole screen */
.shufsec{min-height:100svh;display:flex;align-items:center;padding:clamp(48px,8vh,96px) 0}
.shuffle{width:100%;height:min(80svh,860px)}
/* banner: covers travel along an arc */
.vb-copy{max-width:min(560px,50%)}
.fan{position:absolute;left:0;top:0;right:0;bottom:0;z-index:2;width:auto;height:auto;transform:none;pointer-events:none}
.fan span{position:absolute;left:0;top:0;width:120px;height:160px;margin:0;border-radius:16px;overflow:hidden;background:#1A1F33;border:3px solid rgba(255,255,255,.9);box-shadow:0 18px 40px rgba(60,0,30,.3);transform-origin:50% 50%;transition:none;will-change:transform}
.vaultbig:hover .fan span{transform:none}
@media (max-width:820px){
  .vb-copy{max-width:100%}
  .fan{position:relative;inset:auto;width:100%;height:clamp(260px,72vw,330px);margin-top:12px}
}
/* paid collections on the home page */
.more-row{display:flex;justify-content:center;margin-top:24px}
/* generate: lighter tags */
.gbadges span{font-weight:400}
/* faq */
.faqsec{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,5vw,72px);align-items:start}
@media (max-width:860px){.faqsec{grid-template-columns:1fr}}
.faq-l{display:flex;flex-direction:column;align-items:flex-start;gap:14px;position:sticky;top:100px}
@media (max-width:860px){.faq-l{position:static}}
.faq-l .ask{margin-top:10px;width:100%}
.faq2{border-top:1px solid var(--line-2)}
.qa{border-bottom:1px solid var(--line-2)}
.q{width:100%;display:flex;align-items:center;gap:18px;padding:22px 4px;background:none;border:0;color:var(--ink);font:400 clamp(17px,1.6vw,21px)/1.3 var(--sans);text-align:left;cursor:pointer;transition:color .2s,padding .3s}
.q:hover{color:var(--pink);padding-left:10px}
.qn{flex:0 0 auto;font:400 12px var(--mono);color:var(--ink-3);transition:color .2s}
.qa.open .qn,.q:hover .qn{color:var(--pink)}
.qt{flex:1}
.qi{position:relative;flex:0 0 34px;height:34px;border-radius:50%;border:1px solid var(--line-2);transition:transform .4s cubic-bezier(.34,1.5,.5,1),background .25s,border-color .25s}
.qi::before,.qi::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;margin:-.75px 0 0 -6px;background:currentColor;border-radius:2px}
.qi::after{transform:rotate(90deg)}
.qa.open .qi{transform:rotate(135deg);background:var(--pink);border-color:var(--pink);color:var(--pink-ink)}
.a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.2,.8,.2,1)}
.a > div{overflow:hidden}
.a p{margin:0;padding:0 50px 22px 34px;font-size:16px;line-height:1.7;color:var(--ink-2);opacity:0;transform:translateY(-6px);transition:opacity .35s,transform .45s}
.qa.open .a{grid-template-rows:1fr}
.qa.open .a p{opacity:1;transform:none}
/* footer: big wordmark in the site's own type */
.velvet{display:none}
.ft{position:relative;overflow:hidden;padding:clamp(48px,7vw,90px) 0 calc(18px + env(safe-area-inset-bottom));background:var(--bg)}
.ft::before{content:"";position:absolute;left:50%;bottom:-30%;width:120%;height:90%;transform:translateX(-50%);background:radial-gradient(50% 50% at 50% 50%,rgba(255,143,200,.16),rgba(255,143,200,0) 70%);pointer-events:none}
.ft-top{position:relative;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:18px 40px}
.ft-say{margin:0;font-size:clamp(22px,2.6vw,34px);letter-spacing:-.03em;line-height:1.1}
.ft-links{display:flex;flex-wrap:wrap;gap:8px}
.ft-links a{padding:9px 15px;border-radius:999px;border:1px solid var(--line-2);font-size:14px;color:var(--ink-2);transition:color .2s,border-color .2s,background .2s}
.ft-links a:hover{color:var(--pink-ink);background:var(--pink);border-color:var(--pink)}
.ft-word{position:relative;display:flex;align-items:baseline;justify-content:center;margin:clamp(20px,4vw,50px) 0 clamp(6px,1.5vw,16px);line-height:.8;white-space:nowrap;user-select:none}
.fw1{font-family:var(--head);font-weight:400;font-size:clamp(110px,24vw,380px);letter-spacing:-.06em;color:var(--ink)}
.ft-word .fw2{font-size:clamp(110px,24vw,380px);padding:0 .04em 0 .06em;letter-spacing:-.05em}
.ft .pf-bot{position:relative;display:flex;justify-content:space-between;gap:16px;font-size:12px;color:var(--ink-3);border-top:1px solid var(--line);padding-top:14px}
.ft .pf-bot a{color:var(--ink-3)}
@media (max-width:760px){.ft{padding-bottom:90px}}
/* falling tiles: flat colours, no gradients */
.pile .pt{background:#FF8FC8;color:#2A0718;box-shadow:0 6px 14px rgba(0,0,0,.35)}
.pile .pt.dk{background:#2A1022;color:var(--pink);box-shadow:0 6px 14px rgba(0,0,0,.4)}
.pile .pt.wh{background:#FFFFFF;color:#E0569C}
.pile .pt.hot{background:#E0569C;color:#FFF0F7}
.pile .pt svg{filter:none}

/* ---------- round 4 ---------- */
/* more air around the collage */
.shufsec{min-height:0;padding:clamp(120px,18vh,220px) 0}
.shuffle{height:min(76svh,820px)}
/* minimal footer with the logo */
.ft{padding:clamp(36px,5vw,56px) 0 calc(18px + env(safe-area-inset-bottom))}
.ft::before{display:none}
.ft-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px}
.ft-logo img{display:block;width:56px;height:auto;transition:transform .35s cubic-bezier(.34,1.6,.5,1)}
.ft-logo:hover img{transform:rotate(-8deg) scale(1.06)}
.ft .pf-bot{margin-top:26px}

/* reel clips on the phone screen crossfade */
.phone .scr video.pv{opacity:0;transition:opacity .4s ease}
.phone .scr video.pv.on{opacity:1}
.fomo{white-space:nowrap;max-width:100%}
.fomo span{overflow:hidden;text-overflow:ellipsis}
@media (max-width:600px){.fomo{font-size:clamp(11px,3.3vw,13px);border-radius:999px;padding:8px 13px;gap:8px}}
a.fomo:hover b{color:var(--pink)}
/* equal space above and below the collage: the next section adds no extra top padding */
.shufsec + .section{padding-top:0}