@font-face{font-family:"Montserrat";font-style:normal;font-weight:500 800;font-display:swap;src:url(fonts/montserrat-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --cream:#fbf3ea; --cream-2:#f6e8d9; --peach:#f1d6bd; --paper:#fffaf4;
  --ink:#16213e; --ink-2:#44506b; --terra:#c8452d; --terra-d:#a63620; --amber:#f09a3e; --glow:#ffb64d;
  --navy-2:#1d2a4d;
  --line:rgba(22,33,62,.12); --glass:rgba(255,250,244,.72);
  --r:22px; --shadow:0 18px 50px -20px rgba(120,60,20,.35);
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{font-family:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--cream);line-height:1.65;font-size:17px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.wrap{width:min(1160px,100% - 40px);margin-inline:auto}
h1,h2,h3{line-height:1.1;letter-spacing:-.025em;font-weight:800}
h2{font-size:clamp(30px,4.2vw,52px);margin-bottom:18px}
h3{font-size:21px;margin-bottom:10px;letter-spacing:-.01em}
p+p{margin-top:1em}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#b23c26;margin-bottom:14px}
.eyebrow::before{content:"";width:22px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--terra),var(--amber))}
.lead{font-size:clamp(18px,2vw,21px);color:var(--ink-2);max-width:60ch}
section{padding:clamp(70px,9vw,120px) 0}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:16px;top:-60px;z-index:100;background:var(--ink);color:#fff;padding:10px 18px;border-radius:999px;font-weight:700;text-decoration:none;transition:top .2s}
.skip:focus{top:12px}

/* buttons */
.btn{position:relative;display:inline-flex;align-items:center;gap:10px;padding:15px 28px;border-radius:999px;font-weight:700;font-size:16px;text-decoration:none;border:2px solid transparent;transition:transform .2s var(--ease),box-shadow .2s,background .2s,color .2s;cursor:pointer;font-family:inherit;overflow:hidden}
.btn-primary{background:linear-gradient(180deg,#cd482b,var(--terra));color:#fff;box-shadow:0 10px 26px -10px rgba(200,69,45,.75),inset 0 1px 0 rgba(255,255,255,.28)}
.btn-primary::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.4) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s var(--ease)}
.btn-primary:hover{background:linear-gradient(180deg,#c8452d,var(--terra-d));transform:translateY(-2px);box-shadow:0 16px 30px -12px rgba(200,69,45,.8),inset 0 1px 0 rgba(255,255,255,.28)}
.btn-primary:hover::after{transform:translateX(120%)}
.btn-ghost{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-ghost:hover{background:var(--ink);color:#fff;transform:translateY(-2px)}
.btn-sm{padding:10px 20px;font-size:15px}
.btn-light{border-color:rgba(255,255,255,.55);color:#fff;background:transparent}
.btn-light:hover{background:#fff;color:var(--ink);transform:translateY(-2px)}
.sec-cta{margin-top:30px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px;padding:24px 30px;border-radius:var(--r);background:var(--paper);border:1px dashed rgba(200,69,45,.35)}
.sec-cta p{margin:0;font-weight:700;font-size:17px;max-width:52ch}
.how-cta{margin-top:26px}
.proof-cta{margin-top:40px}

/* nav */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .25s,box-shadow .25s,backdrop-filter .25s}
.nav.scrolled{background:rgba(251,243,234,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:74px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:800;letter-spacing:-.01em;font-size:17px;line-height:1.1}
.brand img{width:52px;height:52px;border-radius:13px;box-shadow:0 6px 18px -8px rgba(120,60,20,.6);transition:box-shadow .9s var(--ease)}
/* the signature move: the logo is the bulb, and it stays lit once the glue figure has turned the light on */
.brand.lit img{box-shadow:0 0 0 2px rgba(240,154,62,.95),0 10px 26px -4px rgba(240,154,62,.85)}
.spark{position:fixed;left:0;top:0;width:20px;height:20px;margin:-10px 0 0 -10px;border-radius:50%;background:radial-gradient(circle,#fff7de 0,#ffc766 36%,rgba(255,166,58,0) 70%);pointer-events:none;opacity:0;z-index:60;will-change:transform,opacity}
.brand small{display:block;font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2)}
.links{display:flex;align-items:center;gap:30px;list-style:none}
.links a:not(.btn){text-decoration:none;font-weight:600;font-size:15px;color:var(--ink-2);transition:color .15s;position:relative;padding:6px 0}
.links a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--terra);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.links a:not(.btn):hover,.links a.on{color:var(--terra)}
.links a:not(.btn):hover::after,.links a.on::after{transform:scaleX(1)}
.burger{display:none;background:none;border:0;width:44px;height:44px;cursor:pointer;color:var(--ink)}
.burger span{display:block;width:24px;height:2.5px;background:currentColor;margin:5px auto;border-radius:2px;transition:.2s}
.progress{position:absolute;left:0;bottom:0;height:3px;width:100%;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,var(--amber),var(--terra));opacity:0;transition:opacity .3s}
.nav.scrolled .progress{opacity:1}

/* hero: a scene sized like background-size:cover, so the overlays always sit on the artwork */
.hero{--hh:max(100svh,660px);--sw:max(100vw,calc(var(--hh)*1.3405));position:relative;height:var(--hh);padding:0;overflow:hidden;background:linear-gradient(90deg,#d9c1a7,#e8d5be)}
.scene{position:absolute;left:50%;width:var(--sw);aspect-ratio:2000/1493;bottom:calc(var(--sw)*-.1015 + var(--hh)*.075);transform:translateX(-50%);container-type:inline-size}
.scene-in{position:absolute;inset:0;transform-origin:50% 100%;transform:scale(1.03);transition:opacity .7s var(--ease)}
.js .scene-in{opacity:0}
.js .scene.ready .scene-in{opacity:1}
.js .scene:not(.ready) .scene-in{animation:sceneIn .7s ease 2s forwards}
@keyframes sceneIn{to{opacity:1}}
/* depth planes: wall (with its circuit lines and panels), mascot and bulb, light flecks in front.
   --px/--py come from the pointer, --hs from how far the hero has scrolled away.
   Each plane moves by a different amount; the mascot leans from its feet so it stays planted. */
.ly{position:absolute;will-change:transform}
.ly-plate{inset:0}
.ly-over{pointer-events:none}
.ly-subj{left:18.2%;top:51.5%;width:38.2%;height:36.64%;transform-origin:49% 94%}
.ly-subj img{display:block;width:100%;height:100%;max-width:none}
.ly-front{inset:0;pointer-events:none}
.dr{position:absolute;inset:0;will-change:transform;animation:drift 14s ease-in-out infinite alternate}
.dr2{animation-duration:19s;animation-direction:alternate-reverse}
.dr3{animation-duration:11s}
@keyframes drift{from{transform:translate3d(0,0,0)}to{transform:translate3d(.8vw,-1.6vw,0)}}
.ly-front i{position:absolute;left:var(--x);top:var(--y);width:calc(var(--s)*1cqw);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(255,238,200,.95) 0,rgba(255,206,140,.5) 42%,transparent 70%);opacity:var(--o)}
.scene-img{width:100%;height:100%;display:block;max-width:none}
.bulb-glow{position:absolute;left:49.2%;top:66.6%;width:30%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:radial-gradient(circle,rgba(255,176,60,.9) 0,rgba(255,150,40,.35) 32%,transparent 66%);mix-blend-mode:screen;opacity:.2;animation:glowBeat 9s ease-in-out infinite;pointer-events:none;will-change:transform}
.flow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.flow path{fill:none;stroke:#ffc766;stroke-width:6;stroke-linecap:round;stroke-dasharray:.06 1;stroke-dashoffset:.06;opacity:0}
.flow .gl path{stroke-width:12;stroke:#ffa63a;opacity:.0}
.flow .fi path{animation:flowIn 9s linear infinite;animation-delay:calc(var(--i)*.22s)}
.flow .fo path{animation:flowOut 9s linear infinite;animation-delay:calc(var(--i)*.3s)}
@keyframes flowIn{0%{stroke-dashoffset:.06;opacity:0}3%{opacity:1}28%{stroke-dashoffset:-1;opacity:1}30%,100%{stroke-dashoffset:-1;opacity:0}}
@keyframes flowOut{0%,31%{stroke-dashoffset:.06;opacity:0}34%{opacity:1}58%{stroke-dashoffset:-1;opacity:1}60%,100%{stroke-dashoffset:-1;opacity:0}}
@keyframes glowBeat{0%,22%{opacity:.2}32%{opacity:1}46%{opacity:.5}100%{opacity:.2}}
.pnl{position:absolute;top:52.6%;height:19.1%;width:10.3%;display:flex;flex-direction:column;justify-content:flex-end;gap:.35cqw;padding:1.05cqw;border-radius:1.9cqw;color:var(--ink);overflow:hidden}
.pnl.p1{left:60.6%}.pnl.p2{left:72.65%}.pnl.p3{left:84.75%}
.pnl>*{opacity:0;transform:translateY(.8cqw);animation:panelIn 9s var(--ease) infinite}
.pnl.p1>*{--d:0s}.pnl.p2>*{--d:.35s}.pnl.p3>*{--d:.7s}
.pnl::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(160deg,rgba(255,255,255,.62),rgba(255,236,210,.4));box-shadow:inset 0 0 0 1px rgba(255,255,255,.65),0 1.4cqw 3cqw -1.4cqw rgba(160,80,20,.35);opacity:0;animation:panelBg 9s ease infinite;animation-delay:var(--d,0s)}
.pnl.p1{--d:0s}.pnl.p2{--d:.35s}.pnl.p3{--d:.7s}
.pnl .ck{width:2.5cqw;height:2.5cqw;border-radius:50%;background:linear-gradient(145deg,var(--amber),var(--terra));display:grid;place-items:center;margin-bottom:auto;box-shadow:0 .5cqw 1.2cqw -.4cqw rgba(200,69,45,.7);animation-delay:var(--d)}
.pnl .ck svg{width:1.3cqw;height:1.3cqw;stroke:#fff;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.pnl b{font-size:1.02cqw;line-height:1.2;font-weight:800;letter-spacing:-.01em;animation-delay:var(--d)}
.pnl span{font-size:.82cqw;line-height:1.3;font-weight:600;color:var(--ink-2);animation-delay:var(--d)}
@keyframes panelIn{0%,59%{opacity:0;transform:translateY(.8cqw)}66%,95%{opacity:1;transform:none}100%{opacity:0;transform:none}}
@keyframes panelBg{0%,57%{opacity:0}64%,95%{opacity:1}100%{opacity:0}}

.hero-copy{position:absolute;z-index:3;top:clamp(92px,calc(var(--hh)*.118),140px);left:calc(50% - var(--sw)/2 + var(--sw)*.5);right:max(24px,calc(50% - var(--sw)/2 + var(--sw)*.035))}
.hero-foot{margin-top:clamp(14px,2.2vh,24px)}
.hero h1{font-size:clamp(34px,min(3.65vw,6.4vh),66px);letter-spacing:-.03em;line-height:1.04}
.hero .eyebrow{color:#8c2a14}
.hero h1 em{font-style:normal;color:var(--terra);position:relative}
@media (min-width:1081px){.hero h1 em{display:inline-block}}
.hero h1 em::after{content:"";position:absolute;left:0;bottom:-.07em;height:.1em;width:100%;border-radius:.1em;background:linear-gradient(90deg,var(--terra),var(--amber));transform:scaleX(0);transform-origin:left;animation:uline 1s .9s var(--ease) forwards}
@keyframes uline{to{transform:scaleX(1)}}
.hero .lead{margin-bottom:20px;font-size:clamp(15.5px,1.3vw,19px);color:#3a4560;max-width:52ch}
.cta-row{display:flex;flex-wrap:wrap;gap:14px}
.outputs{display:none}
.hero-head>*,.hero-foot>*{opacity:0;transform:translateY(16px);animation:rise .9s var(--ease) forwards}
.hero-head .eyebrow{animation-delay:.1s}.hero-head h1{animation-delay:.2s}.hero-foot .lead{animation-delay:.5s}.hero-foot .cta-row{animation-delay:.65s}
@keyframes rise{to{opacity:1;transform:none}}

.trustbar{background:var(--ink);color:#e8e2da;padding:0}
.trustbar ul{list-style:none;display:grid;grid-template-columns:1.2fr 1.05fr 1.05fr .8fr .95fr 1.15fr;gap:0}
.trustbar li{padding:22px 20px;font-size:14px;font-weight:600;line-height:1.4;border-left:1px solid rgba(255,255,255,.12);color:#c9cbd8}
.trustbar li:first-child{border-left:0;padding-left:0}
.trustbar b{display:block;font-size:17px;color:#fff;font-weight:800;letter-spacing:-.01em}

/* story */
.story{background:var(--paper);padding-bottom:clamp(40px,5vw,70px)}
.story .wrap{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(30px,6vw,90px);align-items:start}
.story-head{position:sticky;top:110px}
.story h2{font-size:clamp(34px,4.8vw,60px)}
.story h2 em,.final h2 em{font-style:normal;color:var(--terra)}
.story p{color:var(--ink-2)}
.story p strong{color:var(--ink)}
.pull{margin-top:30px;padding:22px 26px;border-left:4px solid var(--terra);background:var(--cream-2);border-radius:0 var(--r) var(--r) 0;font-weight:700;color:var(--ink)!important;font-size:19px}

/* the glue figure. The script writes the moving values straight onto the few elements that change (see site.js);
   this CSS holds the resting "before" picture, and the finished picture for visitors without scripting.
   Timeline, as a share of the scroll through the figure (g, 0 to 1):
   .10 to .60  each dashed link is overwritten by a glowing rail, tool by tool
   .18 to .55  copy, paste and chase get swept into the middle
   .52 to .74  "You" steps out of the middle over to the approval gate
   .58 to .82  the bulb appears, then lights, and the card fills with warm light
   .80 to .90  "Your yes" arrives. The last tenth holds still on the finished picture. */
.glue{padding:0;background:var(--paper)}
.glue-track{height:330vh;position:relative}
.glue-stick{position:sticky;top:0;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:84px 0 28px}
.glue-box{background:linear-gradient(160deg,#fff,#fdf0e1);border:1px solid var(--line);border-radius:30px;padding:clamp(18px,3vw,36px);box-shadow:var(--shadow);position:relative;overflow:hidden}
.glue-box::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(22,33,62,.09) 1px,transparent 1.4px);background-size:22px 22px;-webkit-mask-image:radial-gradient(70% 80% at 50% 50%,#000,transparent);mask-image:radial-gradient(70% 80% at 50% 50%,#000,transparent);pointer-events:none}
.bloom{position:absolute;left:50%;top:58%;width:84%;aspect-ratio:1;margin:-42% 0 0 -42%;border-radius:50%;background:radial-gradient(circle,rgba(255,200,120,.5) 0,rgba(255,200,120,.2) 36%,transparent 66%);opacity:0;transform:scale(.5);pointer-events:none;will-change:transform,opacity}
.glue-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;position:relative;z-index:1;margin-bottom:6px}
.glue-cap{position:relative;min-height:calc(3.6em + 28px);flex:1 1 320px}
.glue-cap .eyebrow{margin-bottom:6px}
.glue-cap p{position:absolute;left:0;right:0;top:28px;margin:0;font-size:clamp(18px,2vw,24px);font-weight:800;letter-spacing:-.02em;line-height:1.25;will-change:transform,opacity}
.glue-cap .c-after{opacity:0;transform:translateY(10px);color:var(--ink)}
.glue-cap small{display:block;font-size:14px;font-weight:600;letter-spacing:0;color:var(--ink-2);margin-top:4px}
.seg{display:inline-flex;padding:4px;border-radius:999px;background:var(--cream-2);border:1px solid var(--line)}
.seg button{border:0;background:transparent;font:inherit;font-weight:700;font-size:14px;padding:9px 20px;border-radius:999px;cursor:pointer;color:var(--ink-2);transition:background .25s,color .25s}
.seg button[aria-pressed=true]{background:var(--ink);color:#fff}
/* two stacked drawings: tiles never repaint, everything that moves sits on top */
.gfig{display:grid;position:relative;z-index:1}
.gfig .glue-svg{grid-area:1/1;width:100%;height:auto;display:block;overflow:visible}
.gfig-m{display:none;max-width:420px;margin-inline:auto}
.glue-svg text{font-family:inherit;font-weight:700;fill:var(--ink)}
.gs-back .tile rect{fill:#fff;stroke:rgba(22,33,62,.14);stroke-width:1.5}
.gs-back .tile{filter:drop-shadow(0 8px 14px rgba(120,60,20,.14))}
.glue-svg .ti{fill:none;stroke:var(--terra);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lk path{fill:none;stroke-linecap:round}
.lk .man{stroke:#a8573f;stroke-width:2.5;stroke-dasharray:5 9;animation:march 1.4s linear infinite}
@keyframes march{to{stroke-dashoffset:-28}}
.lk .rail{stroke:rgba(240,154,62,.5);stroke-width:3;opacity:0}
.lk .draw{stroke:#f7b04c;stroke-width:3.4;stroke-dasharray:1 1.02;stroke-dashoffset:1;opacity:0}
.lk .pulse{stroke:#ffb347;stroke-width:4.5;stroke-dasharray:.08 1;stroke-dashoffset:.08;opacity:0}
.lk.on .pulse{animation:pulse 2.6s linear infinite;animation-delay:calc(var(--i) * .28s)}
@keyframes pulse{0%{stroke-dashoffset:.08}100%{stroke-dashoffset:-1}}
.tg{fill:rgba(255,179,71,.14);stroke:rgba(240,154,62,.85);stroke-width:2;opacity:0}
.chip{transform-box:fill-box;transform-origin:center}
.chip-w{transform-box:fill-box;transform-origin:center;animation:wob 3.4s ease-in-out var(--wd,0s) infinite}
@keyframes wob{50%{transform:translateY(-6px) rotate(-2deg)}}
.chip rect{fill:var(--cream-2);stroke:rgba(200,69,45,.35)}
.chip text{font-size:13px;fill:var(--terra-d)}
.you .disc{fill:var(--ink)}
.you .ring{fill:none;stroke:var(--terra);stroke-width:2;stroke-dasharray:3 9;transform-box:fill-box;transform-origin:center;animation:spin 14s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.you .person{fill:#fff}
.sys{opacity:0}
.sys .lit{opacity:0}
.sys text{opacity:0}
.halo-w{opacity:0;transform:scale(.55)}
.breath{transform-box:fill-box;transform-origin:center;animation:breath 3.4s ease-in-out infinite}
@keyframes breath{50%{transform:scale(1.08)}}
.yes{opacity:0;transform:translateY(10px)}
.yes rect{fill:var(--ink)}
.yes text{fill:#fff;font-size:13px}
.yes path{fill:none;stroke:var(--glow);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
/* once the story has played, the things that no longer show stop animating */
.glue.after .lk .man,.glue.after .chip-w,.glue.after .you .ring{animation:none}
.glue.off *{animation-play-state:paused!important}
/* no scripting: show the finished picture, no toggle */
html:not(.js) .seg{display:none}
html:not(.js) .glue-track{height:auto}
html:not(.js) .glue-stick{position:static;min-height:0;padding:40px 0}
html:not(.js) .lk .man,html:not(.js) .chip,html:not(.js) .you{opacity:0}
html:not(.js) .lk .rail,html:not(.js) .lk .draw,html:not(.js) .lk .pulse,html:not(.js) .tg,html:not(.js) .sys,html:not(.js) .sys .lit,html:not(.js) .sys text,html:not(.js) .halo-w,html:not(.js) .yes,html:not(.js) .bloom,html:not(.js) .glue-cap .c-after{opacity:1}
html:not(.js) .lk .draw{stroke-dashoffset:0}
html:not(.js) .lk .pulse{animation:pulse 2.6s linear infinite;animation-delay:calc(var(--i) * .28s)}
html:not(.js) .halo-w,html:not(.js) .yes,html:not(.js) .bloom,html:not(.js) .glue-cap .c-after{transform:none}
html:not(.js) .glue-cap .c-before{opacity:0}

/* what I build: bento */
.build{background:linear-gradient(180deg,var(--cream) 0,var(--cream-2) 100%)}
.head{max-width:760px;margin-bottom:46px}
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:22px}
.card{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:32px;box-shadow:var(--shadow);transition:transform .3s var(--ease),box-shadow .3s;overflow:hidden}
.card:hover{transform:translateY(-4px)}
.card.b1,.card.b2{grid-column:span 3}
.card.b3{grid-column:span 6;display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,4vw,56px);align-items:center;background:linear-gradient(150deg,#16213e,#22305a);color:#eef0f7;border-color:rgba(255,255,255,.08)}
.card .ico{width:52px;height:52px;border-radius:15px;background:linear-gradient(145deg,var(--amber),var(--terra));display:grid;place-items:center;margin-bottom:20px;color:#fff;box-shadow:0 10px 20px -10px rgba(200,69,45,.8),inset 0 1px 0 rgba(255,255,255,.35)}
.card .ico svg{width:26px;height:26px}
.card p{color:var(--ink-2);font-size:16px}
.card .real{margin-top:16px;padding-top:16px;border-top:1px dashed var(--line);font-size:15px}
.card .real b{color:var(--terra)}
.b3 h3{color:#fff;font-size:26px}
.b3 p{color:#c4c9dc}
.b3 .real{border-top-color:rgba(255,255,255,.2)}
.b3 .real b{color:var(--glow)}
.card::after{content:"";position:absolute;width:260px;height:260px;right:-90px;top:-90px;border-radius:50%;background:radial-gradient(circle,rgba(240,154,62,.22),transparent 70%);pointer-events:none}
.b3::after{background:radial-gradient(circle,rgba(240,154,62,.3),transparent 70%)}
.mini{list-style:none;margin:22px 0 4px;display:grid;gap:8px;counter-reset:m}
.mini li{counter-increment:m;position:relative;display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:14px;background:var(--cream);border:1px solid var(--line);font-size:14.5px;font-weight:700;color:var(--ink)}
.mini li::before{content:counter(m);width:24px;height:24px;border-radius:50%;background:var(--ink);color:#fff;font-size:12px;display:grid;place-items:center;flex:none}
.mini li:last-child{background:linear-gradient(135deg,#fff1e2,#f8d9bd)}
.mini li:last-child::after{content:"waiting for you";margin-left:auto;font-size:12px;font-weight:700;color:var(--terra)}
.mini.logged li:last-child::after{content:"no re-typing";}
.mini li:not(:last-child)::after{content:"";position:absolute;left:25px;bottom:-9px;width:2px;height:9px;background:var(--amber)}
.reveal.in .mini li{animation:pop .5s var(--ease) both}
.reveal.in .mini li:nth-child(2){animation-delay:.18s}.reveal.in .mini li:nth-child(3){animation-delay:.36s}
@keyframes pop{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:none}}
.draft{background:#fff;color:var(--ink);border-radius:20px;padding:20px 22px;box-shadow:0 24px 40px -22px rgba(0,0,0,.6);position:relative}
.draft .hd{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--terra);margin-bottom:12px}
.draft .hd span{display:inline-flex;align-items:center;gap:6px}
.draft .hd span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 0 rgba(240,154,62,.7);animation:ping 1.8s infinite}
@keyframes ping{70%{box-shadow:0 0 0 9px rgba(240,154,62,0)}100%{box-shadow:0 0 0 0 rgba(240,154,62,0)}}
.draft .ln{height:9px;border-radius:5px;background:var(--cream-2);margin-bottom:9px}
.draft .ln:nth-child(3){width:92%}.draft .ln:nth-child(4){width:78%}.draft .ln:nth-child(5){width:55%}
.draft .acts{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}
.draft .acts i{font-style:normal;font-weight:700;font-size:13px;padding:8px 16px;border-radius:999px;border:1.5px solid var(--line);color:var(--ink-2)}
.draft .acts i:first-child{background:var(--terra);border-color:var(--terra);color:#fff}

/* how */
.how .wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);align-items:start}
.how .pic{position:sticky;top:104px;border-radius:30px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/3}
.how .pic img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform .2s linear}
.steps{list-style:none;counter-reset:s;margin-top:34px;display:grid;gap:28px;position:relative}
.steps::before,.steps::after{content:"";position:absolute;left:23px;top:24px;bottom:24px;width:2px;border-radius:2px}
.steps::before{background:var(--line)}
.steps::after{background:linear-gradient(180deg,var(--amber),var(--terra));transform-origin:top;transform:scaleY(var(--sp,0))}
.steps li{counter-increment:s;display:grid;grid-template-columns:48px 1fr;gap:18px;position:relative;z-index:1}
.steps li::before{content:counter(s);width:48px;height:48px;border-radius:50%;background:var(--cream);color:var(--ink-2);border:2px solid var(--line);display:grid;place-items:center;font-weight:800;transition:background .4s,color .4s,border-color .4s,box-shadow .4s}
.steps li.on::before{background:var(--ink);color:#fff;border-color:var(--ink);box-shadow:0 0 0 6px rgba(240,154,62,.28)}
.steps h3{margin-bottom:4px;font-size:19px}
.steps p{color:var(--ink-2);font-size:16px}
.solo{margin-top:34px;padding:20px 24px;border-radius:var(--r);background:var(--cream-2);font-size:16px;color:var(--ink-2)}
.solo b{color:var(--ink)}

/* proof */
.proof{background:var(--ink);color:#f4ece3;position:relative;overflow:hidden;isolation:isolate}
.proof::before{content:"";position:absolute;z-index:-1;width:720px;height:720px;right:-220px;top:-260px;border-radius:50%;background:radial-gradient(circle,rgba(240,154,62,.28),transparent 66%)}
.proof::after{content:"";position:absolute;z-index:-1;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:linear-gradient(180deg,#000,transparent 70%);mask-image:linear-gradient(180deg,#000,transparent 70%)}
.proof h2{color:#fff}
.proof .eyebrow{color:var(--glow)}
.proof .lead{color:#c9c9d6}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin:40px 0 30px}
.stat{padding:30px;border-radius:var(--r);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);position:relative;overflow:hidden}
.stat::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--glow),transparent);opacity:.7}
.stat big{display:block;font-size:clamp(38px,4.4vw,58px);font-weight:800;background:linear-gradient(180deg,#ffd08a,var(--amber));-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.stat>span{display:block;margin-top:12px;color:#d8d8e2;font-size:15.5px}
.work-label{margin:0 0 14px;font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--glow)}
.cases{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.case{padding:20px 22px 22px;border-radius:var(--r);background:var(--cream);color:var(--ink);transition:transform .3s var(--ease)}
.case:hover{transform:translateY(-4px)}
.case h3{font-size:18.5px;margin:2px 0 0;line-height:1.2}
.case p{color:var(--ink-2);font-size:14.5px;line-height:1.5}
.case-top{display:flex;align-items:center;gap:13px;margin-bottom:12px}
.case .ci{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(145deg,#fff1e2,#f8d9bd);color:var(--terra-d);flex:none}
.case .ci svg{width:22px;height:22px}
.case .tag{display:block;font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#b23c26;line-height:1.3}
.case .tag em{font-style:normal;text-transform:none;letter-spacing:0;font-weight:600;color:var(--ink-2)}
.case .tag em::before{content:"\00b7";margin:0 7px}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:34px}
.chips span{padding:9px 18px;border-radius:999px;border:1px solid rgba(255,255,255,.25);font-weight:600;font-size:14.5px;color:#e9e0d6}

/* packages */
.pk-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:18px}
.pk-grid .pk{grid-column:span 2}
.pk-grid .pk:nth-child(n+5){grid-column:span 3}
.pk{--mx:50%;--my:50%;position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:18px;padding:26px;border-radius:var(--r);background:var(--paper);border:1px solid var(--line);text-decoration:none;transition:transform .3s var(--ease),box-shadow .3s,border-color .3s;min-height:176px;overflow:hidden;isolation:isolate}
.pk::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(260px circle at var(--mx) var(--my),rgba(240,154,62,.26),transparent 70%);opacity:0;transition:opacity .3s}
.pk:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--terra)}
.pk:hover::before{opacity:1}
.pk-img{display:block;width:calc(100% + 52px);max-width:none;margin:-26px -26px 2px;aspect-ratio:16/10;height:auto;object-fit:cover;transition:transform .5s var(--ease)}
.pk:hover .pk-img{transform:scale(1.04)}
.pk-grid .pk:nth-child(n+5){display:grid;grid-template-columns:44% 1fr;grid-template-areas:"img text" "img link";grid-template-rows:1fr auto;padding:0;gap:0}
.pk-grid .pk:nth-child(n+5) .pk-img{grid-area:img;margin:0;width:100%;height:100%;min-height:220px;aspect-ratio:auto}
.pk-grid .pk:nth-child(n+5)>span{grid-area:text;padding:26px 26px 12px}
.pk-grid .pk:nth-child(n+5)>i{grid-area:link;padding:0 26px 26px}
.pk b{font-size:18px;line-height:1.3;letter-spacing:-.01em}
.pk small{display:block;margin-top:6px;font-size:14.5px;color:var(--ink-2);line-height:1.5}
.pk i{font-style:normal;font-weight:700;font-size:14px;color:var(--terra);transition:letter-spacing .25s}
.pk:hover i{letter-spacing:.02em}
.pk-grid .pk.feature{grid-column:span 6}
.pk.feature{background:linear-gradient(145deg,#fff1e2,#f8d9bd);display:grid;grid-template-columns:minmax(220px,340px) 1fr auto;align-items:center;min-height:0;gap:30px;padding:0}
.pk.feature .pk-img{margin:0;width:100%;height:100%;min-height:210px;aspect-ratio:auto}
.pk.feature i{margin-right:34px}
.pk.feature>span{padding:28px 0}
.pk.feature b{font-size:22px}
.pk.feature i{white-space:nowrap;background:var(--terra);color:#fff;padding:12px 22px;border-radius:999px}
.pk .flag{display:block;width:max-content;font-style:normal;font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--terra);background:rgba(200,69,45,.1);padding:4px 10px;border-radius:999px;margin-bottom:8px}
.note{margin-top:22px;font-size:15px;color:var(--ink-2)}

/* books */
.books{background:var(--paper)}
.books .wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(30px,5vw,80px);align-items:center}
.books .pic{border-radius:30px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/3}
.books .pic img{width:100%;height:100%;object-fit:cover}
.booklist{list-style:none;margin:26px 0 30px;display:grid;gap:12px}
.booklist a{display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:18px;padding:12px 18px 12px 12px;border-radius:16px;background:var(--cream-2);text-decoration:none;font-weight:700;font-size:16.5px;line-height:1.3;transition:transform .25s var(--ease),background .25s,box-shadow .25s}
.booklist img{width:52px;height:78px;border-radius:4px 6px 6px 4px;object-fit:cover;box-shadow:0 8px 16px -8px rgba(60,30,10,.55),inset 0 0 0 1px rgba(0,0,0,.08);transition:transform .3s var(--ease)}
.booklist small{display:block;font-weight:500;color:var(--ink-2);font-size:14px;margin-top:3px;line-height:1.4}
.booklist i{font-style:normal;color:var(--terra);font-weight:800;opacity:.5;transition:opacity .25s,transform .25s var(--ease)}
.booklist a:hover{transform:translateX(6px);background:#f3e0cb;box-shadow:0 12px 24px -16px rgba(120,60,20,.5)}
.booklist a:hover img{transform:rotate(-3deg) scale(1.05)}
.booklist a:hover i{opacity:1;transform:translateX(3px)}

/* closing */
.final{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(135deg,var(--terra) 0,#e0662e 55%,var(--amber) 100%);color:#fff;padding:clamp(80px,10vw,130px) 0}
.final .wrap{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(20px,4vw,60px);align-items:center}
.final::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(95% 125% at 10% 62%,rgba(115,26,9,.62),transparent 84%);pointer-events:none}
.final h2{color:#fff;font-size:clamp(34px,5vw,64px);max-width:15ch}
.final h2 em{color:#fff;font-style:normal;text-decoration:underline;text-decoration-color:rgba(255,255,255,.45);text-decoration-thickness:.07em;text-underline-offset:.12em}
.final p{max-width:50ch;margin:0 0 32px;font-size:19px;color:#fff}
.final .btn-primary{background:#fff;color:var(--terra-d);box-shadow:0 14px 34px -12px rgba(0,0,0,.4)}
.final .btn-primary::after{background:linear-gradient(110deg,transparent 30%,rgba(200,69,45,.18) 50%,transparent 70%)}
.final .btn-primary:hover{background:var(--cream)}
.final .p-mail,.final .mail{margin-top:26px;font-weight:700;color:#fff}
.final .mail a{color:#fff;font-weight:800}
.bulb-stage{position:relative;display:grid;place-items:center;min-height:380px}
.bulb-stage::before{content:"";position:absolute;width:130%;aspect-ratio:1;border-radius:50%;background:conic-gradient(from 0deg,rgba(255,255,255,0),rgba(255,236,196,.38),rgba(255,255,255,0) 14%,rgba(255,236,196,.3) 28%,rgba(255,255,255,0) 42%,rgba(255,236,196,.38) 56%,rgba(255,255,255,0) 70%,rgba(255,236,196,.3) 84%,rgba(255,255,255,0));-webkit-mask-image:radial-gradient(closest-side,#000 8%,transparent 70%);mask-image:radial-gradient(closest-side,#000 8%,transparent 70%);opacity:calc(.15 + var(--cs,1) * .85);animation:spin 40s linear infinite}
.bulb-stage::after{content:"";position:absolute;width:92%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(255,246,222,.98) 0,rgba(255,228,178,.7) 34%,rgba(255,200,130,.28) 56%,transparent 72%);opacity:calc(.2 + var(--cs,1) * .8);animation:breathe 4.5s ease-in-out infinite}
.bulb-stage img{position:relative;z-index:1;width:min(330px,74%);animation:float 6s ease-in-out infinite}
@keyframes breathe{50%{transform:scale(1.12)}}
@keyframes float{50%{transform:translateY(-12px)}}

footer{padding:34px 0;background:var(--ink);color:#c5c9d8;font-size:14.5px}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;align-items:center}
footer a{color:#fff;text-decoration:none;font-weight:600}
footer a:hover{color:var(--amber)}
footer nav{display:flex;gap:22px;flex-wrap:wrap}

/* reveal: hidden only when JS is running, so the page still reads without it */
.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .reveal.in{opacity:1;transform:none}
.js .bento .reveal:nth-child(2),.js .stats .reveal:nth-child(2),.js .pk-grid .reveal:nth-child(2n+3){transition-delay:.1s}
.js .bento .reveal:nth-child(3),.js .stats .reveal:nth-child(3){transition-delay:.2s}
a:focus-visible,button:focus-visible{outline:3px solid var(--amber);outline-offset:3px}


@media (min-width:1081px) and (max-height:830px){
  .hero-copy{top:82px}
  .hero h1{font-size:clamp(30px,min(3.4vw,5.5vh),62px)}
  .hero .eyebrow{margin-bottom:8px}
  .hero .lead{font-size:15px;line-height:1.5;margin-bottom:12px}
  .hero-foot{margin-top:10px}
  .hero .btn{padding:11px 22px;font-size:15px}
}
@media (max-width:1080px){
  /* tablet and phone: text first, then the artwork at its natural shape */
  .hero{--sw:100%;height:auto;background:var(--cream);padding-top:92px}
  .hero-copy{position:static;padding-inline:max(20px,calc(50% - 580px))}
  .hero-foot{margin-top:18px}
  .hero h1{font-size:clamp(36px,8vw,64px)}
  .hero .lead{max-width:60ch}
  /* phone composition: crop the artwork to the mascot, the bulb and the tools that feed it,
     so the subject is nearly twice as big and the three empty panels leave the frame
     (the finished-work cards sit right below instead) */
  .scene{position:relative;left:0;bottom:auto;transform:none;width:100%;margin-top:26px;aspect-ratio:1110/910;overflow:hidden}
  .scene-in{inset:auto;left:-6.306%;top:-47.253%;width:180.18%;height:auto;aspect-ratio:2000/1493;transform:none}
  .pnl{display:none}
  .outputs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;list-style:none;width:min(1160px,100% - 40px);margin:18px auto 0;padding-bottom:6px}
  .outputs li{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:14px;font-size:13.5px;font-weight:800;line-height:1.3;letter-spacing:-.01em}
  .outputs li small{display:block;font-weight:600;color:var(--ink-2);font-size:12.5px;margin-top:3px;letter-spacing:0}
  .outputs li svg{width:22px;height:22px;padding:5px;border-radius:50%;background:linear-gradient(145deg,var(--amber),var(--terra));stroke:#fff;fill:none;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;margin-bottom:8px}
  .trustbar ul{grid-template-columns:repeat(3,1fr)}
  .trustbar li:nth-child(n+4){border-top:1px solid rgba(255,255,255,.12)}
  .trustbar li:nth-child(4){border-left:0;padding-left:0}
}
@media (max-width:980px){
  .bento{grid-template-columns:1fr}
  .card.b1,.card.b2,.card.b3{grid-column:auto}
  .card.b3{grid-template-columns:1fr}
  .pk-grid{grid-template-columns:1fr 1fr}
  .pk-grid .pk,.pk-grid .pk:nth-child(n+5){grid-column:span 1}
  .pk-grid .pk.feature{grid-column:span 2}
  .pk-grid .pk:last-child{grid-column:span 2}
  .pk-grid .pk:nth-child(5){display:flex;flex-direction:column;padding:26px}
  .pk-grid .pk:nth-child(5) .pk-img{margin:-26px -26px 2px;width:calc(100% + 52px);height:auto;min-height:0;aspect-ratio:16/10}
  .pk-grid .pk:nth-child(5)>span,.pk-grid .pk:nth-child(5)>i{padding:0}
  .stats{grid-template-columns:1fr}
  .story .wrap,.how .wrap,.books .wrap,.final .wrap{grid-template-columns:1fr}
  .story-head{position:static}
  .cases{grid-template-columns:1fr 1fr}
  .how .pic,.books .pic{order:-1}
  .how .pic{position:relative;top:0}
  .bulb-stage{min-height:300px;order:-1}
  .final::before{background:linear-gradient(180deg,transparent 30%,rgba(120,28,10,.5) 58%,rgba(120,28,10,.55) 100%)}
  .final h2{max-width:none}
}
@media (max-width:940px){
  .burger{display:block}
  .links{position:fixed;inset:74px 0 auto 0;flex-direction:column;align-items:stretch;gap:0;background:rgba(251,243,234,.97);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding:10px 20px 26px;box-shadow:0 20px 40px -20px rgba(0,0,0,.3);transform:translateY(-130%);transition:transform .3s;visibility:hidden}
  .nav.open .links{transform:none;visibility:visible}
  .nav.open{background:rgba(251,243,234,.97)}
  .links li{border-bottom:1px solid var(--line)}
  .links a:not(.btn){display:block;padding:16px 4px;font-size:17px}
  .links a:not(.btn)::after{display:none}
  .links li:last-child{border:0;padding-top:18px}
  .links li:last-child .btn{width:100%;justify-content:center}
  .nav.open .burger span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
  .nav.open .burger span:nth-child(2){opacity:0}
  .nav.open .burger span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
}
@media (max-width:820px){
  .gfig-d{display:none}.gfig-m{display:grid}
  .glue-track{height:300vh}
}
@media (max-width:620px){
  body{font-size:16px}
  .pk-grid{grid-template-columns:1fr}
  .trustbar ul{grid-template-columns:1fr 1fr}
  .trustbar li{padding:14px 14px;font-size:13.5px}
  .trustbar b{font-size:16px}
  .trustbar li:nth-child(odd){border-left:0;padding-left:0}
  .trustbar li:nth-child(even){border-left:1px solid rgba(255,255,255,.12);padding-left:14px}
  .trustbar li:nth-child(n+3){border-top:1px solid rgba(255,255,255,.12)}
  .cases{grid-template-columns:1fr;gap:0}
  .case{background:transparent;color:#f4ece3;border-radius:0;border-top:1px solid rgba(255,255,255,.14);padding:15px 0 16px}
  .case:hover{transform:none}
  .case h3{color:#fff}
  .case p{color:#cfd0dc}
  .case .tag{color:var(--glow)}
  .case .tag em{color:#cfd0dc}
  .case-top{margin-bottom:8px}
  .pk-grid .pk,.pk-grid .pk.feature,.pk-grid .pk:last-child,.pk-grid .pk:nth-child(n+5){grid-column:auto}
  .pk-grid .pk:nth-child(n+5){display:flex;flex-direction:column;padding:26px}
  .pk-grid .pk:nth-child(n+5) .pk-img{margin:-26px -26px 2px;width:calc(100% + 52px);height:auto;min-height:0;aspect-ratio:16/10}
  .pk-grid .pk:nth-child(n+5)>span,.pk-grid .pk:nth-child(n+5)>i{padding:0}
  .pk.feature{grid-template-columns:1fr;gap:16px;padding:0 0 26px}
  .pk.feature .pk-img{aspect-ratio:16/10;min-height:0;height:auto}
  .pk.feature>span{padding:0 26px}
  .pk.feature i{margin:0 26px;justify-self:start}
  .cta-row .btn{width:100%;justify-content:center}
  .outputs{grid-template-columns:1fr}
  .outputs li{display:flex;align-items:center;gap:12px}
  .outputs li svg{margin:0;flex:none}
  .glue-cap{min-height:calc(5.2em + 28px)}
  .final .btn{width:100%;justify-content:center}
  .sec-cta{padding:22px}
  .sec-cta .btn,.how-cta .btn,.proof-cta .btn{width:100%;justify-content:center}
}

/* tall portrait screens (a tablet held upright): the pinned stage used to be a whole screen high around a much
   shorter figure, which left a wide blank band under it. Here it hugs the figure; site.js centres it while pinned
   and sizes the track so the story keeps the same scroll length. Placed before the reduced-motion block on purpose. */
@media (orientation:portrait) and (min-width:600px){
  .glue-stick{min-height:0}
}

/* a screen too short to show the whole pinned figure (the bottom row of tiles would be cut off for the whole story):
   no pin, no scrub. Same layout reduced motion uses; site.js adds .still after measuring. */
.glue.still .glue-track{height:auto}
.glue.still .glue-stick{position:static;min-height:0;padding:40px 0}

.hero.off *{animation-play-state:paused!important}

/* last on purpose: reduced motion has to win over every width rule above */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .js .reveal{opacity:1;transform:none}
  .hero-head>*,.hero-foot>*{opacity:1;transform:none}
  .hero h1 em::after{transform:none}
  .pnl>*,.pnl::before{animation:none!important;opacity:1!important;transform:none!important}
  .flow,.bulb-glow{display:none}
  .glue-track{height:auto}.glue-stick{position:static;min-height:0;padding:40px 0}
  .ly,.bulb-glow{transform:none!important}
  .ly-front{display:none}
  .js .scene-in{opacity:1}
  .spark{display:none}
}