@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#050609;--panel:#101218;--text:#f5f6fa;--muted:#9299aa;--blue:#4266ff;--line:#ffffff12;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:120px}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;font-size:16px}body:has(dialog[open]){overflow:hidden}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #a8bbff;outline-offset:6px}.grain{position:fixed;inset:0;pointer-events:none;z-index:8;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.65' filter='url(%23n)'/%3E%3C/svg%3E")}.nav{position:absolute;z-index:10;top:24px;left:50%;transform:translateX(-50%);width:min(1080px,calc(100% - 48px));height:72px;padding:10px 14px 10px 28px;display:flex;align-items:center;justify-content:space-between;background:#0d1016dd;border:1px solid #ffffff20;border-radius:50px;backdrop-filter:blur(20px)}.brand{display:flex;align-items:center;gap:9px;font-family:'Manrope',sans-serif;font-size:31px;font-weight:800;letter-spacing:-1.5px}.brand svg{width:23px;height:28px;color:#5376ff}.brand>span{font-size:13px;align-self:flex-start;margin-top:6px;letter-spacing:0}.nav nav{display:flex;gap:30px;font-size:14px;color:#a6aab7}.nav nav a:hover{color:white}.button{display:inline-flex;align-items:center;justify-content:center;gap:28px;background:linear-gradient(180deg,#5178ff,#234be8);border:1px solid #819bff;border-radius:50px;padding:10px 12px 10px 26px;font-size:15px;font-weight:700;box-shadow:0 0 0 5px #3a5aff15,0 8px 35px #2c56ff28,inset 0 2px 5px #ffffff25;transition:transform .2s,box-shadow .2s}.button:hover{transform:translateY(-3px);box-shadow:0 0 0 5px #3a5aff20,0 8px 40px #2c56ff50}.arrow{background:#f1f5ff;color:#2149d5;border-radius:50%;width:29px;height:29px;display:grid;place-items:center;font-size:20px}.button.small{font-size:14px;padding:7px 9px 7px 20px;gap:22px}.hero{position:relative;overflow:hidden;padding-top:192px}.hero-glow{position:absolute;pointer-events:none;left:50%;top:180px;transform:translateX(-50%);width:1100px;height:730px;background:radial-gradient(ellipse,#153aca55 0%,#0b226833 35%,transparent 67%);filter:blur(12px)}.hero-copy{position:relative;text-align:center;z-index:1}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:600;color:#9ca6be}.hero .eyebrow{border:1px solid #597cfa30;border-radius:50px;background:#14224345;padding:9px 15px;font-size:10px;letter-spacing:1.8px;display:inline-flex;gap:10px;align-items:center}.spark{font-size:16px;color:#8098ff}h1,h2,h3,h4,p{margin:0}h1{font-family:'Manrope',sans-serif;font-weight:500;font-size:clamp(48px,5.7vw,82px);line-height:1.09;letter-spacing:-4.5px;margin:26px auto 23px}h1>span{background:linear-gradient(100deg,#7a9bff,#c9d5ff);background-clip:text;color:transparent}.hero-copy p{font-size:17px;line-height:1.7;color:#a2a9bc;margin-bottom:30px}.hero-note{font-size:12px;color:#727e97;margin-top:22px}.reel{width:1390px;position:relative;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:18px;margin-top:70px;height:260px;perspective:1000px;padding:10px 0}.reel-card{border:1px solid #91abff2a;border-radius:16px;text-align:left;position:relative;overflow:hidden;flex:1;height:210px;padding:19px;box-shadow:0 15px 30px #0008;transition:filter .25s,translate .25s;background:#102669}.reel-card:hover{filter:brightness(1.2);translate:0 -8px}.frame-label,.frame-bottom{font-size:8px;letter-spacing:1.5px;position:absolute;left:18px}.frame-label{top:17px}.frame-bottom{bottom:16px;opacity:.65}.reel-card strong{display:block;font-family:'Manrope',sans-serif;line-height:1.02;font-size:29px;letter-spacing:-1.2px;margin-top:5px}.reel-card strong i{font-family:Georgia,serif;font-weight:400}.r1{transform:rotateY(24deg) rotateZ(-8deg) translateY(-6px);background:linear-gradient(135deg,#052023,#055666)}.r2{transform:rotateY(12deg) rotateZ(-4deg) translateY(20px);background:linear-gradient(135deg,#24399e,#11172f)}.r3{transform:translateY(33px);background:radial-gradient(at top right,#6975c5,#222742 70%)}.r4{transform:rotateY(-12deg) rotateZ(4deg) translateY(20px);background:linear-gradient(130deg,#192543,#4f6686)}.r5{transform:rotateY(-24deg) rotateZ(8deg) translateY(-6px);background:linear-gradient(135deg,#112853,#142148)}.play{display:grid;place-items:center;width:45px;height:45px;border:1px solid #ffffff70;background:#ffffff16;backdrop-filter:blur(8px);border-radius:50%;font-size:14px;padding-left:3px}.reel-card .play{position:absolute;right:17px;bottom:45px}.service-strip{max-width:1080px;margin:74px auto 0;padding:28px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;color:#8c93a4;font-size:11px;letter-spacing:1.8px}.service-strip b{color:#5077ff;font-size:18px}.section{max-width:1080px;margin:auto;padding:130px 0 0}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:42px}h2{font-family:'Manrope',sans-serif;font-size:clamp(36px,4vw,52px);font-weight:500;letter-spacing:-2.3px;line-height:1.15;margin:20px 0}h2 em,h4 em{font-family:Georgia,serif;color:#9caede;font-weight:400;letter-spacing:-1.7px}.section-heading p,.center-heading p{color:var(--muted);line-height:1.7}.section-heading p{padding-bottom:5px}.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.work-card{border:0;background:transparent;text-align:left;padding:0}.work-art{height:260px;border-radius:14px;position:relative;overflow:hidden;border:1px solid #ffffff20;padding:23px;background:radial-gradient(at 100% 100%,#214ca2,#111a31 65%);transition:transform .25s}.work-card:hover .work-art{transform:translateY(-5px)}.tiny{font-size:10px;letter-spacing:1.6px;color:#929bac;display:block}.work-art strong{display:block;font-size:30px;letter-spacing:-1px;line-height:1.12;margin-top:35px;position:relative;z-index:1}.work-art strong i{font-family:Georgia,serif;font-weight:400;color:#b5c7ff}.work-art .play{position:absolute;bottom:25px;right:23px;z-index:2}.timeline{display:flex;gap:4px;position:absolute;bottom:27px;left:23px;right:92px;height:20px;transform:rotate(-3deg)}.timeline i{background:#4165c6;flex:1;border-radius:3px}.timeline i:nth-child(even){background:#7e94ca}.w2 .work-art{background:linear-gradient(135deg,#232c49,#07101e)}.timecode{position:absolute;bottom:35px;color:#7892c7;font-family:monospace;font-size:17px}.w3 .work-art{background:radial-gradient(at 30% 100%,#303867,#121422 80%)}.motion-word{font-size:76px;font-weight:800;color:#7185ce14;letter-spacing:-4px;position:absolute;bottom:-16px;left:18px}.work-caption{padding-top:19px;display:flex;flex-direction:column;gap:8px;font-size:15px}.work-caption>span+span{font-size:12px;color:#7c8496}.preview-note{text-align:center;color:#676f80;font-size:12px;margin-top:32px}.center-heading{text-align:center;margin-bottom:48px}.retention-panel{background:linear-gradient(130deg,#141822,#0c0e14);border:1px solid #ffffff12;border-radius:22px;padding:35px 37px;overflow:hidden}.chart-top{display:flex;justify-content:space-between;align-items:center;gap:20px}h3{font-size:17px;font-weight:500}.chart-top p{font-size:13px;color:#757f94;margin-top:7px}.segmented{display:flex;background:#07090e;border:1px solid #ffffff08;padding:5px;border-radius:40px;white-space:nowrap}.segmented button{font-size:12px;padding:10px 18px;border:0;border-radius:30px;background:transparent;color:#8e98ac}.segmented button.active{background:#2d52d6;box-shadow:0 0 16px #345cff30;color:white}.graph{position:relative;padding:40px 0 0 65px;margin:10px 0 35px}.graph svg{width:100%;height:220px;overflow:visible}.graph-labels{position:absolute;top:55px;left:0;bottom:42px;display:flex;flex-direction:column;justify-content:space-between;color:#747d91;font-size:11px}.gridline{stroke:#ffffff09;fill:none}.reference{stroke:#576079;stroke-width:1.5;fill:none;stroke-dasharray:5 5;opacity:.5}#curve{stroke:#5278ff;stroke-width:3;fill:none;filter:drop-shadow(0 0 6px #456cff90)}.graph-bottom{display:flex;justify-content:space-between;font-size:11px;color:#667188;margin-top:10px}.chart-insight{display:flex;align-items:center;gap:22px;border-top:1px solid var(--line);padding-top:25px}.insight-symbol{font-size:42px;color:#5e80ff}.chart-insight p{font-size:14px;color:#8c96ab;margin-top:8px;line-height:1.5}.illustration-note{display:block;color:#626d82;font-size:11px;margin-top:20px}.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:40px}.benefits article{border-left:1px solid #ffffff18;padding-left:25px}.benefits article>span{font-size:10px;letter-spacing:1.8px;color:#6587ff}.benefits h3{font-size:21px;margin:18px 0 12px}.benefits p{font-size:14px;color:#8f97a9;line-height:1.7}.pricing{padding-top:145px}.pricing-grid{max-width:910px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:25px;align-items:center}.price-card{padding:32px;border-radius:21px;background:linear-gradient(135deg,#14161e,#0d1016);border:1px solid #ffffff16}.price-card.featured{border-color:#4767d878;background:radial-gradient(at top right,#1b2b5840,transparent 70%),#10141e;box-shadow:0 0 70px #1a36a20b}.price-title{display:flex;justify-content:space-between;align-items:center;gap:10px}.price-title h3{font-size:16px}.price-title>span{font-size:9px;letter-spacing:1px;color:#799aff;border:1px solid #547fff30;border-radius:20px;padding:6px 9px}h4{font-size:37px;line-height:1.15;font-weight:400;letter-spacing:-1.4px;margin:32px 0 16px}.price-card>p{font-size:14px;color:#8a94a8;line-height:1.6}.price-card hr{border:0;border-top:1px solid var(--line);margin:27px 0}.price-card ul{padding:0;list-style:none;margin:22px 0 30px}.price-card li{font-size:14px;color:#b0b7c6;position:relative;padding-left:23px;margin:15px 0}.price-card li:before{content:'✓';position:absolute;left:0;color:#678cff}.full{width:100%;justify-content:space-between}.secondary{background:#161b29;border-color:#343e54;box-shadow:none}.price-note{display:block;text-align:center;font-size:11px;color:#6f7b92;margin-top:18px}footer{max-width:1200px;margin:135px auto 0;padding:40px 30px 25px;overflow:hidden}.footer-top,.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px}.footer-top a{font-size:13px;color:#a5b4d9}.footer-word{font-family:'Manrope',sans-serif;font-size:clamp(100px,20vw,270px);font-weight:600;letter-spacing:-.08em;line-height:1.3;color:#233c8f;position:relative;text-align:center;background:linear-gradient(#4063c3,#101d43);background-clip:text;-webkit-text-fill-color:transparent}.footer-word>span{font-size:30px;vertical-align:top;display:inline-block;margin:42px 0 0 12px;letter-spacing:0}.footer-bottom{border-top:1px solid var(--line);padding-top:25px;font-size:11px;color:#69748b}.footer-bottom>span:last-child{font-size:9px;letter-spacing:1.5px}dialog{border:1px solid #5b78ca40;background:#0e1422;color:var(--text);border-radius:22px;padding:38px;width:min(580px,calc(100% - 32px));box-shadow:0 30px 100px #000;max-height:90vh;overflow:auto}dialog::backdrop{background:#02040be6;backdrop-filter:blur(8px)}.close{position:absolute;right:16px;top:12px;background:transparent;border:0;font-size:30px;color:#a0aec7;width:35px;height:35px}.modal-preview{padding:40px 0;text-align:center}.modal-preview .play{margin:0 auto 30px;width:68px;height:68px;background:#2d50b6}.modal-preview h2{font-size:36px}.modal-preview p,dialog>p{color:#98a6bd;line-height:1.7;font-size:15px}dialog h2{font-size:32px;letter-spacing:-1px}form{margin-top:25px}label{display:block;font-size:14px;margin-bottom:20px}input,textarea{width:100%;margin-top:9px;background:#080d17;border:1px solid #2b3750;border-radius:9px;padding:12px;font:inherit;color:white;resize:vertical}input:focus,textarea:focus{outline:2px solid #6486ff;outline-offset:2px}.form-note{font-size:12px;color:#8390a9;line-height:1.6;margin-top:15px;text-align:center}@media(min-width:1600px){.hero{padding-top:225px}.reel{margin-top:90px}.hero-copy h1{font-size:90px}}@media(max-width:1150px){.section,.service-strip{margin-left:40px;margin-right:40px}.nav{max-width:1000px}.reel{width:1200px}.reel-card strong{font-size:25px}.work-art{padding:18px}.work-art strong{font-size:26px}}@media(max-width:760px){.nav{top:16px;width:calc(100% - 28px);height:62px;padding-left:18px}.brand{font-size:27px}.brand svg{width:19px}.nav nav{gap:18px;font-size:12px}.nav nav a:first-child,.nav nav a:nth-child(3){display:none}.nav .button{font-size:12px;gap:10px;padding-left:14px}.nav .arrow{width:24px;height:24px}.hero{padding-top:154px}h1{font-size:53px;letter-spacing:-2.7px;margin-top:25px}.hero .eyebrow{font-size:8px;letter-spacing:1px}.hero-copy p{font-size:15px;padding:0 20px}.reel{margin-top:37px;width:980px;height:235px;gap:12px}.reel-card{height:175px;padding:15px}.reel-card strong{font-size:23px}.frame-label,.frame-bottom{font-size:6px;left:13px;letter-spacing:1px}.frame-bottom{bottom:13px}.reel-card .play{height:34px;width:34px;bottom:34px;right:13px;font-size:10px}.service-strip{margin:43px 22px 0;padding:22px 0;flex-wrap:wrap;gap:17px;justify-content:center;font-size:8px;letter-spacing:1px}.service-strip b{font-size:10px}.service-strip b:last-of-type{display:none}.section{margin-left:22px;margin-right:22px;padding-top:85px}.section-heading{display:block;margin-bottom:28px}h2{font-size:38px;letter-spacing:-1.8px}.section-heading p{font-size:14px}.work-grid{grid-template-columns:1fr;gap:30px}.work-art{height:250px;padding:24px}.work-art strong{font-size:36px}.work-caption{flex-direction:row;justify-content:space-between;gap:15px;align-items:center;font-size:14px}.work-caption>span+span{font-size:10px}.center-heading p{font-size:14px}.retention-panel{padding:23px 18px;border-radius:16px}.chart-top{display:block}.chart-top h3{font-size:16px}.chart-top p{font-size:12px;line-height:1.5}.segmented{width:max-content;margin-top:22px}.graph{padding-left:40px}.graph svg{height:170px}.graph-labels{font-size:9px;top:55px;bottom:35px}.graph-bottom{font-size:9px}.chart-insight{gap:14px}.chart-insight h3{font-size:15px;line-height:1.5}.chart-insight p{font-size:12px}.benefits{grid-template-columns:1fr;gap:30px}.benefits article{padding-left:20px}.benefits h3{margin:12px 0 8px}.pricing-grid{grid-template-columns:1fr}.price-card{padding:27px}.pricing{padding-top:90px}footer{margin-top:80px;padding:30px 22px}.footer-top .eyebrow{font-size:8px;letter-spacing:1px}.footer-top a{font-size:11px}.footer-word{font-size:24vw;letter-spacing:-.09em;line-height:1.6}.footer-word>span{font-size:15px;margin-top:20px;margin-left:5px}.footer-bottom{font-size:9px;flex-wrap:wrap;row-gap:14px}.footer-bottom>span:last-child{font-size:8px}.eyebrow{font-size:10px;letter-spacing:1.5px}dialog{padding:32px 22px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* A quiet star field and tactile film grain behind the blue glow. */
@font-face {
  font-family: 'SF Pro Display Local';
  src: local('SF Pro Display Bold'), local('SFProDisplay-Bold');
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Display Local';
  src: local('SF Pro Display Medium'), local('SFProDisplay-Medium');
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image:
    radial-gradient(circle at 7% 18%, #d8e4ff9c 0 .8px, transparent 1.8px),
    radial-gradient(circle at 19% 42%, #b5ccff75 0 1px, transparent 2px),
    radial-gradient(circle at 35% 12%, #dce8ff60 0 .6px, transparent 1.6px),
    radial-gradient(circle at 54% 74%, #abc5ff60 0 .7px, transparent 1.7px),
    radial-gradient(circle at 73% 30%, #e8efff90 0 .9px, transparent 1.9px),
    radial-gradient(circle at 88% 61%, #bfd4ff80 0 .8px, transparent 1.9px),
    radial-gradient(circle at 95% 9%, #e8efff70 0 .6px, transparent 1.6px);
  background-size: 731px 619px, 967px 787px, 541px 827px, 853px 661px, 1103px 719px, 673px 937px, 997px 557px;
}
main { position: relative; }
.grain {
  opacity: .16;
  background-size: 180px 180px;
  background-repeat: repeat;
  mix-blend-mode: screen;
}
.hero-copy {
  font-family: 'SF Pro Display Local', 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
}
.hero-copy h1 {
  font-family: inherit;
  font-weight: 700;
  letter-spacing: -.055em;
  line-height: 1.06;
  -webkit-font-smoothing: antialiased;
}
.hero-copy p { font-weight: 500; }
@media (max-width: 760px) {
  .hero-copy h1 { font-size: clamp(38px, 7vw, 53px); letter-spacing: -.045em; }
  .grain { opacity: .13; }
}

/* Continuous drift; separate speeds keep the star field feeling natural. */
body::before {
  animation: star-drift 100s linear infinite;
  will-change: background-position;
}
@keyframes star-drift {
  from {
    background-position: 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0;
  }
  to {
    background-position: 731px -619px, -967px -787px, 541px -827px, -853px -661px, 1103px -719px, -673px -937px, 997px -557px;
  }
}
@media (prefers-reduced-motion: reduce) {
  body::before { animation: none; will-change: auto; }
}

/* Compact, closely set hero inspired by the supplied reference. */
.hero { padding-top: 170px; }
.hero-copy { max-width: 850px; margin-inline: auto; padding-inline: 20px; }
.hero-copy h1 {
  font-size: clamp(44px, 4.3vw, 64px);
  letter-spacing: -.06em;
  line-height: 1.02;
  margin: 23px auto 21px;
}
.hero-copy p { font-size: 17px; line-height: 1.4; margin-bottom: 25px; letter-spacing: -.025em; }
.hero .eyebrow { padding: 6px 12px; letter-spacing: 1px; }
.hero-note { margin-top: 17px; }
.reel { margin-top: 50px; }
.hero-glow { top: 125px; height: 650px; }
.grain {
  z-index: 0;
  opacity: .28;
  mix-blend-mode: screen;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' seed='14' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23g)' opacity='.7' d='M0 0h160v160H0z'/%3E%3C/svg%3E");
  background-size: 160px 160px;
}
@media (min-width: 1600px) {
  .hero { padding-top: 190px; }
  .hero-copy h1 { font-size: 68px; }
}
@media (max-width: 760px) {
  .hero { padding-top: 138px; }
  .hero-copy h1 { font-size: clamp(34px, 7.8vw, 48px); letter-spacing: -.055em; line-height: 1.04; }
  .hero-copy p { font-size: 15px; padding-inline: 0; }
  .hero .eyebrow { font-size: 8px; letter-spacing: .6px; }
  .reel { margin-top: 30px; }
  .grain { opacity: .24; }
}

/* Frosted glass navigation with a softly illuminated rim. */
.nav {
  background: linear-gradient(120deg, rgba(220,232,255,.105), rgba(113,143,193,.045) 45%, rgba(198,218,255,.085));
  border: 1px solid rgba(220,233,255,.22);
  -webkit-backdrop-filter: blur(28px) saturate(170%);
  backdrop-filter: blur(28px) saturate(170%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.23), inset 0 -1px 0 rgba(174,200,255,.06), 0 12px 40px rgba(0,0,0,.24), 0 2px 6px rgba(0,0,0,.16);
  isolation: isolate;
}
.nav::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: -1;
  background: linear-gradient(175deg, rgba(255,255,255,.07), transparent 42%, rgba(127,161,225,.025));
}
.nav nav a { color: #bfc6d3; transition: color .2s, text-shadow .2s; }
.nav nav a:hover { color: #fff; text-shadow: 0 0 16px #c9dcff60; }
.nav .button {
  background: linear-gradient(165deg, rgba(121,155,255,.92), rgba(51,92,250,.85) 48%, rgba(34,70,215,.9));
  border-color: rgba(178,199,255,.65);
  box-shadow: inset 0 1px 2px rgba(255,255,255,.4), inset 0 -1px 3px rgba(20,41,126,.4), 0 0 0 5px rgba(90,121,255,.09), 0 5px 22px rgba(29,69,235,.23);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .nav { background: linear-gradient(120deg, #242c3a, #141c29); }
}

/* Keep the glass navigation visible while the page scrolls beneath it. */
.nav { position: fixed; }

.real-reel { padding: 0; display: block; }
.real-reel img { width:100%; height:100%; object-fit:cover; }
.real-reel::after { content:''; position:absolute; inset:0; background:linear-gradient(#0007,transparent 35%,#0009); }
.real-reel .frame-label,.real-reel .frame-bottom,.real-reel .play { z-index:1; }
.real-art { padding:0; }
.real-art img { width:100%; height:100%; object-fit:cover; }
.real-art .play { background:#101a38aa; }

/* Two seamless frame ribbons around the Inferno wordmark. */
footer { max-width:none; padding-inline:0; }
.footer-top,.footer-bottom { width:min(1140px,calc(100% - 44px)); margin-inline:auto; }
.footer-showcase { position:relative; isolation:isolate; margin:38px 0 0; padding:112px 0; overflow:hidden; }
.footer-showcase .footer-word { font-size:clamp(130px,25vw,380px); line-height:1.04; letter-spacing:-.075em; z-index:0; }
.footer-showcase .footer-word>span { margin-top:35px; }
.frame-lane { position:absolute; left:0; width:100%; z-index:1; overflow:hidden; padding:28px 0; pointer-events:none; }
.frames-right { top:0; }
.frames-left { bottom:0; }
.frame-track { display:flex; width:max-content; will-change:transform; animation:footer-frames-left 55s linear infinite; }
.frames-right .frame-track { animation-name:footer-frames-right; animation-duration:60s; }
.frame-group { display:flex; flex-shrink:0; align-items:center; gap:clamp(55px,7vw,130px); padding-right:clamp(55px,7vw,130px); }
.footer-frame { width:clamp(180px,18vw,280px); aspect-ratio:16/9; flex:none; border:1px solid #c1d1ff26; border-radius:18px; overflow:hidden; transform:rotate(var(--tilt)); box-shadow:0 15px 30px #0007; background:#141b2c; }
.footer-frame img { display:block; width:100%; height:100%; object-fit:cover; transform:scale(1.045); }
@keyframes footer-frames-left { from { transform:translateX(0); } to { transform:translateX(-50%); } }
@keyframes footer-frames-right { from { transform:translateX(-50%); } to { transform:translateX(0); } }
.frames-paused .frame-track { animation-play-state:paused; }
.frame-control { width:min(1140px,calc(100% - 44px)); margin:12px auto 24px; text-align:right; }
#frame-motion { color:#97a7c7; background:#14203c55; border:1px solid #6b86c133; border-radius:24px; padding:9px 15px; font-size:12px; }
@media(max-width:760px) {
 .footer-showcase { padding:113px 0; margin-top:26px; }
 .footer-showcase .footer-word { font-size:27vw; }
 .footer-showcase .footer-word>span { font-size:13px; margin-top:8px; margin-left:4px; }
 .footer-frame { width:180px; border-radius:13px; }
 .frame-group { gap:48px; padding-right:48px; }
 .frame-track,.frames-right .frame-track { animation-duration:44s; }
}
@media(prefers-reduced-motion:reduce) {
 .frame-track,.frames-right .frame-track { animation:none; transform:translateX(-8%); will-change:auto; }
 .frame-control { display:none; }
}

/* Original foreground cards with a separate elliptical frame carousel. */
.hero { isolation:isolate; }
.hero-orbit { position:absolute; inset:90px 0 110px; z-index:0; pointer-events:none; overflow:hidden; mask-image:radial-gradient(ellipse 32% 31% at 50% 30%,transparent 30%,#0008 80%,#000 100%); }
.orbit-frame { position:absolute; left:50%; top:50%; width:clamp(150px,16vw,245px); aspect-ratio:16/9; margin-left:calc(clamp(150px,16vw,245px) / -2); margin-top:-68px; border-radius:16px; overflow:hidden; border:1px solid #91afff45; box-shadow:0 15px 45px #0008; background:#0d162b; will-change:transform; }
.orbit-frame img { display:block; width:100%; height:100%; object-fit:cover; transform:scale(1.045); }
.hero-copy { z-index:2; }
.hero .reel { z-index:3; }
.hero .service-strip { position:relative; z-index:2; }
.reel-card { display:flex; align-items:center; }
.orbit-control { display:block; margin:12px auto 0; border:0; padding:5px 10px; border-radius:20px; background:#09112680; color:#8495b8; font-size:11px; }
@media(max-width:760px){ .hero-orbit{inset:85px 0 130px;opacity:.65}.orbit-frame{width:150px;margin-left:-75px;border-radius:10px}.orbit-control{font-size:10px} }
@media(prefers-reduced-motion:reduce){.orbit-control{display:none}.orbit-frame{will-change:auto}}

.brand .brand-logo { display:block; width:40px; height:40px; flex-shrink:0; object-fit:contain; border-radius:10px; }
@media(max-width:760px) { .brand .brand-logo { width:32px; height:32px; border-radius:8px; } }

/* Phone layouts: deliberate stacking, readable type, and touch-sized controls. */
.mobile-menu-toggle { display:none; }
@media(max-width:760px){
 html { scroll-padding-top:100px; }
 body { overflow-x:clip; }
 .nav { width:calc(100% - 24px); top:12px; height:64px; padding:8px 12px; gap:10px; border-radius:32px; }
 .brand { font-size:25px; gap:7px; letter-spacing:-1.2px; margin-right:auto; }
 .brand>span { font-size:10px; }
 .brand .brand-logo { width:30px;height:30px;border-radius:8px; }
 .nav>.button { padding:12px 14px; min-height:42px; font-size:12px; gap:0; white-space:nowrap; }
 .nav>.button .arrow { display:none; }
 .mobile-menu-toggle { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:6px; width:42px;height:44px;flex-shrink:0;background:transparent;border:0;border-radius:50%; }
 .mobile-menu-toggle span { width:19px;height:2px;background:#e8efff;transition:transform .2s; }
 .menu-open .mobile-menu-toggle span:first-child { transform:translateY(4px) rotate(45deg); }
 .menu-open .mobile-menu-toggle span:last-child { transform:translateY(-4px) rotate(-45deg); }
 .nav nav { display:none; position:absolute; top:74px; left:0; right:0; padding:12px; border:1px solid #a9c0ff33; border-radius:23px; background:#0c1328f5; backdrop-filter:blur(24px); box-shadow:0 18px 35px #0008; }
 .nav.menu-open nav { display:flex;flex-direction:column;gap:2px; }
 .nav nav a,.nav nav a:first-child,.nav nav a:nth-child(3) { display:block; padding:14px 16px; font-size:16px; border-radius:12px; }
 .nav nav a:hover { background:#28458b55; }
 .hero { padding-top:136px; }
 .hero-copy { padding:0 22px; max-width:560px; }
 .hero-copy h1 { font-size:clamp(36px,9vw,54px);line-height:1.06;letter-spacing:-.05em;margin:25px auto 22px; }
 .hero-copy h1>span { display:inline; }
 .hero-copy p { font-size:16px;line-height:1.6;max-width:360px;margin:0 auto 26px; }
 .hero-copy p br { display:none; }
 .hero .eyebrow { font-size:10px;letter-spacing:.7px;line-height:1.5;max-width:100%;padding:8px 12px; }
 .hero .eyebrow .spark { flex-shrink:0; }
 .hero-note { font-size:12px;line-height:1.5; }
 .orbit-control { min-height:44px;font-size:12px;margin-top:5px; }
 .hero-orbit { opacity:.4;inset:100px 0 170px; }
 .hero .reel { left:0;transform:none;width:100%;height:auto;min-height:220px;perspective:none;justify-content:flex-start;gap:16px;margin-top:25px;padding:20px 24px 32px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:24px;scrollbar-width:thin;scrollbar-color:#3b5286 transparent; }
 .hero .reel-card { flex:0 0 min(76vw,320px);height:210px;transform:none;translate:none;scroll-snap-align:center;padding:22px;border-radius:18px; }
 .hero .reel-card strong { font-size:32px;line-height:1.07; }
 .hero .frame-label { top:19px;left:22px;font-size:10px;letter-spacing:1px; }
 .hero .frame-bottom { left:22px;bottom:17px;font-size:9px;letter-spacing:.7px;max-width:80%;line-height:1.4; }
 .hero .reel-card .play { width:42px;height:42px;right:20px;bottom:46px;font-size:13px; }
 .service-strip { margin:20px 22px 0;display:grid;grid-template-columns:1fr 1fr;text-align:center;gap:20px 10px;font-size:10px;line-height:1.5;letter-spacing:1px;padding:25px 0; }
 .service-strip b { display:none; }
 .section { margin-inline:22px;padding-top:76px; }
 .center-heading { margin-bottom:30px; }
 h2 { font-size:clamp(32px,8.5vw,42px);line-height:1.14;letter-spacing:-1.4px; }
 .center-heading p,.benefits p { font-size:16px;line-height:1.65; }
 .retention-panel { padding:23px 16px; }
 .chart-top h3 { font-size:18px;line-height:1.4; }
 .chart-top p { font-size:14px; }
 .segmented { width:100%; }
 .segmented button { flex:1;padding:12px 7px;font-size:13px;min-height:44px; }
 .graph { padding-left:43px;margin-bottom:25px; }
 .chart-insight h3 { font-size:16px; }
 .chart-insight p { font-size:14px; }
 .illustration-note { font-size:12px;line-height:1.5; }
 .benefits { gap:30px; }
 .benefits article>span { font-size:12px; }
 .pricing-grid { gap:22px; }
 .price-card { padding:25px 22px; }
 .price-title { flex-wrap:wrap; }
 .price-title h3 { font-size:17px; }
 h4 { font-size:36px; }
 .price-card>p,.price-card li { font-size:15px;line-height:1.6; }
 .price-note { font-size:12px;line-height:1.5; }
 .button { min-height:48px; }
 footer { margin-top:65px; }
 .footer-top { align-items:flex-start; }
 .footer-top .eyebrow { font-size:10px;line-height:1.5;max-width:170px; }
 .footer-top a { font-size:12px;white-space:nowrap;min-height:44px; }
 .footer-showcase { padding:120px 0;margin-top:10px; }
 .footer-showcase .footer-word { font-size:26vw;line-height:1.2; }
 .footer-frame { width:156px; }
 .frame-group { gap:38px;padding-right:38px; }
 .frame-control button { min-height:44px; }
 .footer-bottom { display:flex;flex-direction:column;align-items:flex-start;gap:12px;font-size:12px;padding-bottom:20px; }
 .footer-bottom>span:last-child { font-size:10px; }
}
@media(min-width:761px) and (max-width:1024px){.nav nav{gap:18px}.section{margin-inline:32px}.hero-copy h1{font-size:60px}.reel{width:1100px}.work-art strong{font-size:25px}}

.brand .brand-logo { border-radius:0; background:transparent; }