:root{--ink:#f5f4ef;--muted:#9b9da3;--gold:#d6aa4a;--blue:#66b5ff;--line:rgba(255,255,255,.12);--panel:#111317;--bg:#08090b;--ease:cubic-bezier(.16,1,.3,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Outfit,"Noto Sans SC","Microsoft YaHei",sans-serif;overflow-x:hidden}button,a{font:inherit}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.noise{position:fixed;inset:0;pointer-events:none;z-index:20;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='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}.site-header{position:fixed;top:20px;left:0;right:0;z-index:50;padding:0 4vw}.nav-shell{max-width:1180px;margin:auto;min-height:64px;padding:8px 10px 8px 16px;border:1px solid var(--line);border-radius:20px;background:rgba(10,11,14,.66);backdrop-filter:blur(22px) saturate(140%);display:flex;align-items:center;justify-content:space-between;box-shadow:0 18px 60px rgba(0,0,0,.28)}.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:-.02em}.brand img{width:36px;height:36px;object-fit:contain}.nav-links{display:flex;gap:32px;color:#c7c8cb;font-size:14px}.nav-links a{transition:color .3s}.nav-links a:hover{color:#fff}.nav-cta{background:#f6f2e8;color:#101114;padding:12px 18px;border-radius:12px;font-weight:700;font-size:14px}.chapter{position:relative;padding:150px max(5vw,24px)}.hero{min-height:100svh;padding-top:180px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}.hero-backdrop{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,9,11,.22),rgba(8,9,11,0) 58%),linear-gradient(0deg,var(--bg),transparent 24%),url('./assets/hero-energy.png') center/cover no-repeat;opacity:.9}.hero-backdrop:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 68% 55%,transparent 0,rgba(8,9,11,.12) 45%,rgba(8,9,11,.7) 100%)}.hero-copy{position:relative;z-index:2;max-width:1180px;width:100%;margin:0 auto 160px}.eyebrow{margin:0 0 24px;text-transform:uppercase;letter-spacing:.18em;font-size:12px;font-weight:700;color:var(--gold)}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(54px,7.1vw,112px);line-height:.95;letter-spacing:-.065em;max-width:1150px;margin-bottom:32px;font-weight:700}h1 span{color:#e0b95d}.hero-lede{max-width:660px;color:#c5c6c8;font-size:clamp(17px,1.4vw,21px);line-height:1.75}.hero-actions{display:flex;gap:12px;margin-top:36px}.button{border:1px solid transparent;border-radius:14px;padding:16px 24px;display:inline-flex;align-items:center;justify-content:center;font-weight:700;cursor:pointer;transition:transform .3s var(--ease),background .3s}.button:hover{transform:translateY(-3px)}.button-primary{background:#f5f0e4;color:#101114}.button-secondary{border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.06);color:white;backdrop-filter:blur(10px)}.hero-product{position:absolute;z-index:3;width:min(760px,48vw);right:-5vw;bottom:78px;border:1px solid rgba(255,255,255,.18);border-radius:20px;overflow:hidden;box-shadow:0 40px 120px rgba(0,0,0,.68),0 0 0 8px rgba(255,255,255,.025);transform:perspective(1200px) rotateY(-7deg) rotateX(3deg)}.hero-product img{width:100%}.window-bar{height:38px;background:#16191e;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:7px;padding:0 13px;font-size:10px;color:#74777f}.window-bar i{width:7px;height:7px;border-radius:50%;background:#3b3f47}.window-bar span{margin-left:7px}.hero-foot{position:absolute;z-index:4;bottom:36px;left:max(5vw,24px);display:flex;gap:30px;color:#8c8f96;font-size:11px;text-transform:uppercase;letter-spacing:.15em}.intro{text-align:center;max-width:1300px;margin:auto;padding-top:220px;padding-bottom:220px}.intro h2,.section-heading h2,.workflow-title h2,.visual-heading h2,.download h2{font-size:clamp(46px,6vw,88px);line-height:1.02;letter-spacing:-.055em;margin-bottom:32px}.intro>p:last-child{max-width:650px;margin:auto;color:var(--muted);font-size:18px;line-height:1.8}.bento-section{max-width:1500px;margin:auto}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:70px;gap:40px}.section-heading h2{max-width:850px;margin-bottom:0}.section-heading>p{max-width:410px;color:var(--muted);line-height:1.7}.bento-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(2,minmax(310px,1fr));grid-auto-flow:dense;gap:1px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.13);border-radius:28px;overflow:hidden}.bento-card{position:relative;overflow:hidden;background:#101216;min-height:310px}.bento-main{grid-column:span 7;grid-row:span 2}.bento-dlss{grid-column:span 5}.bento-filter{grid-column:span 3}.bento-safe{grid-column:span 2}.card-copy{position:relative;z-index:2;padding:34px}.card-copy span{font-size:12px;color:var(--gold);letter-spacing:.1em}.card-copy h3{font-size:clamp(23px,2vw,34px);letter-spacing:-.035em;margin:12px 0 10px}.card-copy p{max-width:450px;color:var(--muted);line-height:1.6}.card-media{position:absolute;left:34px;right:-15%;bottom:-12%;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 35px 80px rgba(0,0,0,.55);transition:transform .7s var(--ease)}.bento-dlss .card-media{left:30%;right:-18%;bottom:-29%}.interactive-card:hover .card-media{transform:scale(1.05)}.bento-filter{background:linear-gradient(145deg,#171316,#0c1018)}.color-ribbon{position:absolute;inset:38% -30% -30%;background:conic-gradient(from 90deg at 50% 50%,#4fc5ff,#636cff,#e878ff,#f0ba55,#4fc5ff);filter:blur(18px);opacity:.7;transform:rotate(-13deg);transition:transform .7s var(--ease)}.bento-filter:hover .color-ribbon{transform:rotate(-8deg) scale(1.1)}.safe-orbit{position:absolute;width:180px;height:180px;right:-75px;bottom:-75px;border:1px solid rgba(214,170,74,.45);border-radius:50%;box-shadow:0 0 70px rgba(214,170,74,.13)}.safe-orbit i{position:absolute;width:11px;height:11px;border-radius:50%;background:var(--gold);left:20px;top:20px;box-shadow:0 0 22px var(--gold)}.workflow{max-width:1500px;margin:auto;display:grid;grid-template-columns:5fr 7fr;gap:9vw;align-items:start}.workflow-title{position:sticky;top:150px}.workflow-title>p:last-child{max-width:440px;color:var(--muted);font-size:17px;line-height:1.7}.workflow-stack{display:flex;flex-direction:column;gap:28vh;padding-top:15vh}.flow-card{min-height:650px;background:#111318;border:1px solid var(--line);border-radius:26px;padding:34px;overflow:hidden;box-shadow:0 50px 100px rgba(0,0,0,.42)}.flow-card strong{color:var(--gold);font-size:12px;letter-spacing:.15em}.flow-card h3{font-size:38px;letter-spacing:-.04em;margin:18px 0 8px}.flow-card p{color:var(--muted)}.flow-card img{margin:80px 0 -15% 10%;width:110%;border-radius:14px;border:1px solid var(--line);box-shadow:0 30px 80px rgba(0,0,0,.6)}.visual{max-width:1500px;margin:auto}.visual-heading h2{max-width:1200px}.inline-image{display:inline-block;width:clamp(110px,12vw,190px);height:.58em;vertical-align:.03em;margin:0 .12em;border-radius:999px;background:url('./assets/map-vivid.jpg') center/cover;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}.compare{position:relative;aspect-ratio:16/8;border-radius:28px;overflow:hidden;border:1px solid var(--line);box-shadow:0 60px 120px rgba(0,0,0,.46)}.compare img{width:100%;height:100%;object-fit:cover}.compare-base{position:absolute;inset:0}.compare-after{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--position)) 0 0)}.compare-line{position:absolute;z-index:3;top:0;bottom:0;left:var(--position);width:2px;background:white;transform:translateX(-1px);pointer-events:none}.compare-line i{position:absolute;top:50%;left:50%;width:54px;height:54px;border-radius:50%;background:white;transform:translate(-50%,-50%);box-shadow:0 10px 30px rgba(0,0,0,.35)}.compare-line i:after{content:"↔";position:absolute;inset:0;display:grid;place-items:center;color:#111;font-style:normal;font-size:20px}.compare input{position:absolute;z-index:4;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize}.compare-label{position:absolute;z-index:3;top:24px;padding:9px 13px;border-radius:9px;background:rgba(8,9,11,.68);backdrop-filter:blur(10px);font-size:12px}.compare-label.before{left:24px}.compare-label.after{right:24px}.visual-note{display:flex;justify-content:space-between;color:var(--muted);padding-top:18px;font-size:13px}.visual-note span{color:#e5e5e5}.section-heading.compact{max-width:900px}.accordion-section{max-width:1500px;margin:auto}.accordion{display:flex;min-height:650px;gap:2px}.accordion-item{position:relative;flex:1;min-width:0;padding:30px;border:1px solid var(--line);background:#101216;overflow:hidden;cursor:pointer;transition:flex .7s var(--ease),background .4s}.accordion-item:first-child{border-radius:24px 0 0 24px}.accordion-item:last-child{border-radius:0 24px 24px 0}.accordion-item.active,.accordion-item:hover,.accordion-item:focus{flex:3.4;background:#15171c;outline:none}.accordion-item>span{color:var(--gold);font-size:11px}.accordion-item h3{font-size:28px;margin:18px 0;writing-mode:vertical-rl;transition:writing-mode .1s}.accordion-item p{opacity:0;width:390px;color:var(--muted);transition:opacity .3s}.accordion-item.active h3,.accordion-item:hover h3,.accordion-item:focus h3{writing-mode:horizontal-tb}.accordion-item.active p,.accordion-item:hover p,.accordion-item:focus p{opacity:1}.accordion-image{position:absolute;left:30px;right:30px;bottom:30px;height:55%;background-size:cover;background-position:top left;border-radius:14px;opacity:.25;transform:scale(.92);transition:opacity .7s,transform .7s var(--ease)}.accordion-item.active .accordion-image,.accordion-item:hover .accordion-image,.accordion-item:focus .accordion-image{opacity:.85;transform:scale(1)}.promise{padding-left:0;padding-right:0;overflow:hidden}.marquee{display:flex;width:max-content;font-size:clamp(50px,7vw,110px);font-weight:600;letter-spacing:-.05em;color:#d8d8d5;animation:marquee 30s linear infinite}.marquee div{white-space:nowrap}@keyframes marquee{to{transform:translateX(-50%)}}.download{text-align:center;min-height:900px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}.download-glow{position:absolute;width:700px;height:700px;border-radius:50%;background:radial-gradient(circle,rgba(214,170,74,.18),transparent 66%);filter:blur(30px)}.download>img{position:relative;width:84px;margin-bottom:38px}.download h2{position:relative;max-width:1100px}.download>p,.download small{position:relative;color:var(--muted)}.download .hero-actions{position:relative}.download small{margin-top:28px}footer{padding:40px max(5vw,24px);border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:13px}footer .brand{color:#fff}.toast{position:fixed;z-index:100;left:50%;bottom:28px;transform:translate(-50%,30px);padding:14px 20px;background:#f3eee2;color:#111;border-radius:12px;font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:.4s var(--ease)}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:900px){.site-header{top:10px}.nav-links{display:none}.nav-cta{padding:11px 13px}.chapter{padding:110px 20px}.hero{padding-top:160px;min-height:920px;justify-content:flex-start}.hero-copy{margin-bottom:0}.hero-product{width:88vw;right:-18vw;bottom:120px}.hero-foot{bottom:35px;gap:15px}.intro{padding-top:150px;padding-bottom:150px}.section-heading{display:block}.section-heading>p{margin-top:24px}.bento-grid{grid-template-columns:1fr;grid-template-rows:none;gap:1px}.bento-main,.bento-dlss,.bento-filter,.bento-safe{grid-column:1;grid-row:auto;min-height:430px}.bento-safe{min-height:280px}.workflow{display:block}.workflow-title{position:relative;top:auto}.workflow-stack{padding-top:90px;gap:80px}.flow-card{min-height:540px}.compare{aspect-ratio:4/3}.accordion{flex-direction:column;min-height:auto}.accordion-item,.accordion-item.active,.accordion-item:hover{min-height:130px;flex:none;border-radius:16px!important}.accordion-item.active,.accordion-item:hover,.accordion-item:focus{min-height:520px}.accordion-item h3{writing-mode:horizontal-tb}.accordion-item p{width:auto}.visual-note{display:block}.visual-note p{margin-top:8px}.download{min-height:760px}footer{gap:20px;align-items:flex-start;flex-direction:column}}
@media(max-width:560px){h1{font-size:49px}h1 br{display:none}.hero-lede{font-size:16px}.hero-actions{flex-direction:column;align-items:stretch}.hero-product{bottom:130px;right:-26vw;width:112vw}.hero-foot span:nth-child(2){display:none}.intro h2,.section-heading h2,.workflow-title h2,.visual-heading h2,.download h2{font-size:42px}.flow-card{padding:24px;min-height:460px}.flow-card h3{font-size:29px}.flow-card img{margin-top:60px}.visual{padding-left:12px;padding-right:12px}.visual-heading{padding:0 8px}.compare{border-radius:18px}.accordion-section{padding-left:12px;padding-right:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.hero-product{transform:none}}

/* Layout and motion refinements */
main{width:100%;max-width:100%;overflow:hidden}section[id]{scroll-margin-top:112px}.scroll-progress{position:fixed;z-index:80;left:0;right:0;top:0;height:2px;background:transparent;pointer-events:none}.scroll-progress i{display:block;width:100%;height:100%;background:linear-gradient(90deg,var(--gold),#fff3ce,var(--blue));transform:scaleX(0);transform-origin:left center;will-change:transform}.site-header{transition:top .5s var(--ease),padding .5s var(--ease)}.nav-shell{transition:min-height .5s var(--ease),background .5s var(--ease),border-color .5s var(--ease),box-shadow .5s var(--ease)}.site-header.is-scrolled{top:10px}.site-header.is-scrolled .nav-shell{min-height:56px;background:rgba(8,9,11,.86);border-color:rgba(255,255,255,.16);box-shadow:0 12px 45px rgba(0,0,0,.42)}.nav-links a{position:relative;padding:8px 0}.nav-links a:after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform .4s var(--ease)}.nav-links a:hover:after{transform:scaleX(1);transform-origin:left}.button,.nav-cta{position:relative;overflow:hidden;isolation:isolate}.button:after,.nav-cta:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.38) 48%,transparent 76%);transform:translateX(-130%);transition:transform .75s var(--ease);z-index:-1}.button:hover:after,.nav-cta:hover:after{transform:translateX(130%)}
.hero-copy{max-width:1240px;margin-bottom:120px}.hero-product{width:min(660px,42vw);right:max(5vw,calc((100vw - 1240px)/2));bottom:70px;transform:perspective(1400px) rotateY(-5deg) rotateX(2deg);transform-origin:center right;will-change:transform}.hero-foot{left:max(5vw,calc((100vw - 1240px)/2))}.hero-copy h1{max-width:1200px}.intro,.bento-section,.workflow,.visual,.accordion-section{width:min(1500px,100%)}
.bento-main{grid-column:span 6}.bento-dlss{grid-column:span 6}.bento-filter,.bento-safe{grid-column:span 3}.bento-dlss .card-media{left:24%;right:-8%;bottom:-25%}.bento-safe .card-copy h3{font-size:clamp(22px,1.65vw,30px)}.bento-card{transition:background .5s var(--ease),box-shadow .5s var(--ease)}.bento-card:hover{background:#15181e;box-shadow:inset 0 0 0 1px rgba(214,170,74,.2)}.card-media img,.flow-card img{transition:transform .8s var(--ease),filter .8s var(--ease)}.bento-card:hover .card-media img,.flow-card:hover img{transform:scale(1.035);filter:contrast(1.04)}
.workflow-title{position:relative;top:auto}.flow-card{will-change:transform,opacity;transition:border-color .5s,box-shadow .5s}.flow-card:hover{border-color:rgba(214,170,74,.28);box-shadow:0 55px 120px rgba(0,0,0,.55)}.reveal-word{display:inline-block;opacity:.13;will-change:opacity,transform}.compare-after,.compare-line{transition:clip-path .08s linear,left .08s linear}.accordion-item:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 45%,rgba(214,170,74,.08));opacity:0;transition:opacity .5s;pointer-events:none}.accordion-item:hover:after,.accordion-item:focus:after,.accordion-item.active:after{opacity:1}
@media(min-width:901px) and (max-width:1280px){.hero-copy{margin-bottom:200px}.hero-product{width:50vw;right:24px;bottom:54px}.hero-copy h1{font-size:clamp(58px,7vw,88px);max-width:900px}.bento-section,.workflow,.visual,.accordion-section{padding-left:34px;padding-right:34px}.bento-grid{grid-template-rows:repeat(2,minmax(280px,1fr))}}
@media(max-width:900px){section[id]{scroll-margin-top:88px}.scroll-progress{height:2px}.site-header,.site-header.is-scrolled{top:10px;padding:0 12px}.hero-copy{margin-bottom:0}.hero-product{width:88vw;right:-18vw;bottom:120px}.bento-main,.bento-dlss,.bento-filter,.bento-safe{grid-column:1}.workflow-title{position:relative!important;transform:none!important}.compare-after,.compare-line{transition:none}}
@media(max-width:560px){.hero{min-height:960px}.hero-product{bottom:118px;right:-18vw;width:104vw}.hero-foot{left:20px}.nav-shell{border-radius:16px}.brand span{font-size:14px}.nav-cta{font-size:12px}.bento-main,.bento-dlss{min-height:390px}.bento-filter{min-height:330px}.bento-safe{min-height:250px}}

/* Restrained typography scale */
.hero-copy h1{font-size:clamp(54px,4.45vw,74px);line-height:1.04;letter-spacing:-.055em}.intro h2,.section-heading h2,.workflow-title h2,.visual-heading h2,.download h2{font-size:clamp(42px,4.25vw,64px);line-height:1.08;letter-spacing:-.045em}.section-heading h2{max-width:720px}.intro{max-width:1120px}.intro>p:last-child{font-size:17px}.card-copy h3{font-size:clamp(22px,1.65vw,29px)}.flow-card h3{font-size:clamp(27px,2.35vw,36px)}.accordion-item h3{font-size:24px}.download h2{max-width:900px;font-size:clamp(44px,4.5vw,68px)}
.promise{min-height:300px;padding:84px 0;display:flex;align-items:center;background:linear-gradient(90deg,rgba(8,9,11,.28),rgba(8,9,11,.02),rgba(8,9,11,.28)),url('./assets/promise-texture.png') center/cover no-repeat;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}.promise:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--bg),transparent 22%,transparent 78%,var(--bg));pointer-events:none}.marquee{position:relative;z-index:2;font-size:clamp(26px,2vw,34px);letter-spacing:-.025em;color:rgba(245,244,239,.9);animation-duration:42s;text-shadow:0 3px 22px rgba(0,0,0,.75)}
.promise{min-height:330px;display:flex;flex-direction:column;justify-content:center;gap:24px;text-align:center;overflow:hidden;background:linear-gradient(90deg,rgba(8,9,11,.58),rgba(8,9,11,.12),rgba(8,9,11,.58)),url('./assets/promise-focus.png') center/cover no-repeat}.promise-copy{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px 22px;max-width:min(920px,calc(100% - 40px));margin:0 auto;color:rgba(245,244,239,.96);font-size:clamp(22px,2.1vw,34px);font-weight:600;letter-spacing:-.035em;text-shadow:0 4px 30px rgba(0,0,0,.65)}.promise-copy i{width:5px;height:5px;border-radius:50%;background:var(--gold);box-shadow:0 0 18px rgba(214,170,74,.72)}.promise>p{position:relative;z-index:2;margin:0;color:rgba(245,244,239,.58);font-size:13px;letter-spacing:.14em}.promise .marquee{display:none}
.text-motion{will-change:transform,opacity,filter}.chapter{isolation:isolate}
.chapter:before{content:"";position:absolute;z-index:-1;inset:12% 8%;background:url('./assets/parallax-field.png') center var(--scroll-shift,50%)/cover no-repeat;opacity:.045;pointer-events:none;mix-blend-mode:screen;transition:background-position 1.2s cubic-bezier(.16,1,.3,1)}.hero:before,.promise:before,.download:before{display:none}.button,.nav-cta,.bento-card,.flow-card,.accordion-item{will-change:transform,opacity}.card-media img,.flow-card img{transform:scale(1.018)}
@media(max-width:900px){.hero-copy h1{font-size:clamp(44px,9vw,58px)}.intro h2,.section-heading h2,.workflow-title h2,.visual-heading h2,.download h2{font-size:clamp(36px,8vw,48px)}.promise{min-height:240px;padding:66px 0}.marquee{font-size:26px}.flow-card h3{font-size:29px}}
@media(max-width:560px){.hero-copy h1{font-size:44px;line-height:1.04}.intro h2,.section-heading h2,.workflow-title h2,.visual-heading h2,.download h2{font-size:36px;line-height:1.12}.hero-lede,.intro>p:last-child{font-size:15px}.card-copy h3{font-size:24px}.promise{min-height:200px}.marquee{font-size:23px}}
@media(max-width:560px){.promise{min-height:255px;padding:52px 20px}.promise-copy{gap:13px 15px;font-size:20px;line-height:1.35}.promise-copy i{width:4px;height:4px}.promise>p{font-size:11px;letter-spacing:.1em}}

@media (prefers-reduced-motion:no-preference){
  html:not(.motion-ready) .nav-shell{animation:ios-fade-up 1.1s cubic-bezier(.16,1,.3,1) both}
  html:not(.motion-ready) .hero-copy > *{animation:ios-fade-up 1.35s cubic-bezier(.16,1,.3,1) both}
  html:not(.motion-ready) .hero-copy > :nth-child(1){animation-delay:.12s}html:not(.motion-ready) .hero-copy > :nth-child(2){animation-delay:.2s}html:not(.motion-ready) .hero-copy > :nth-child(3){animation-delay:.29s}html:not(.motion-ready) .hero-copy > :nth-child(4){animation-delay:.38s}
  html:not(.motion-ready) .hero-product{animation:ios-product-in 1.7s cubic-bezier(.16,1,.3,1) .27s both}
  html:not(.motion-ready) .bento-card,html:not(.motion-ready) .flow-card,html:not(.motion-ready) .compare,html:not(.motion-ready) .accordion-item{animation:ios-fade-up 1.35s cubic-bezier(.16,1,.3,1) both}
  html:not(.motion-ready) .bento-card:nth-child(2),html:not(.motion-ready) .accordion-item:nth-child(2){animation-delay:.08s}html:not(.motion-ready) .bento-card:nth-child(3),html:not(.motion-ready) .accordion-item:nth-child(3){animation-delay:.16s}html:not(.motion-ready) .bento-card:nth-child(4),html:not(.motion-ready) .accordion-item:nth-child(4){animation-delay:.24s}
}
@keyframes ios-fade-up{from{opacity:0;transform:translate3d(0,22px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes ios-product-in{from{opacity:0;transform:perspective(1400px) rotateY(-5deg) rotateX(2deg) translate3d(28px,18px,0) scale(.99)}to{opacity:1;transform:perspective(1400px) rotateY(-5deg) rotateX(2deg) translate3d(0,0,0) scale(1)}}

/* Content remains visible even when a browser blocks animation scripts. */
html .nav-shell,html .hero-copy > *,html .bento-card,html .flow-card,html .compare,html .accordion-item{animation:none!important;visibility:visible!important}

/* High-resolution color comparison grades are derived from one source plate. */
.compare-base{filter:saturate(.68) contrast(.92) brightness(.8)}
.compare-after img{filter:saturate(1.18) contrast(1.06) brightness(1.04)}
.inline-image{background-image:url('./assets/color-compare-highres.png')}

/* Keep the neutral source on the left and the vivid grade on the right. */
.compare-after{clip-path:inset(0 0 0 var(--position))}

/* Real application views in every feature card. */
.bento-filter .card-media{left:26px;right:-24%;bottom:-8%}
.bento-safe .card-media{left:18px;right:-82%;bottom:-8%}

.hero-backdrop{background-image:linear-gradient(90deg,rgba(8,9,11,.92),rgba(8,9,11,.76) 58%),linear-gradient(0deg,var(--bg),transparent 24%),url('./assets/app-tools.png');opacity:.38}

.contact-section{width:min(980px,100%);padding-top:80px;padding-bottom:90px}.contact-section .section-heading{margin-bottom:34px}.contact-section .section-heading h2{font-size:clamp(36px,3.6vw,52px)}.contact-card{min-height:220px;padding:28px}.contact-card img{width:58px;height:58px;margin-bottom:20px}.contact-card span{font-size:clamp(24px,2vw,32px)}.contact-card p{margin:8px 0 18px;font-size:14px}

.contact-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.contact-card{min-height:330px;padding:38px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(145deg,#15171c,#0d0f13);display:flex;flex-direction:column;align-items:flex-start;text-align:left;color:var(--ink);cursor:pointer;transition:transform .55s var(--ease),border-color .55s var(--ease),background .55s var(--ease)}.contact-card:hover{transform:translateY(-6px);border-color:rgba(214,170,74,.55);background:#181b21}.contact-card img{width:76px;height:76px;object-fit:cover;border-radius:50%;margin-bottom:30px;border:1px solid rgba(255,255,255,.16);background:#0c0e12}.contact-card span{font-size:clamp(28px,2.4vw,40px);font-weight:700;letter-spacing:-.045em}.contact-card p{margin:12px 0 30px;color:var(--muted);font-size:16px}.contact-card b{margin-top:auto;color:var(--gold);font-size:14px}.contact-author{font:inherit;border-style:solid}.qr-modal[hidden]{display:none}.qr-modal{position:fixed;z-index:200;inset:0;display:grid;place-items:center;padding:24px}.qr-modal__backdrop{position:absolute;inset:0;background:rgba(3,4,6,.74);backdrop-filter:blur(12px)}.qr-modal__panel{position:relative;z-index:1;width:min(410px,100%);padding:28px;background:#f6f3ec;color:#111317;border-radius:24px;text-align:center;box-shadow:0 35px 100px rgba(0,0,0,.5)}.qr-modal__panel img{width:min(100%,320px);margin:0 auto 20px;border-radius:14px}.qr-modal__panel h2{margin:0 0 8px;font-size:27px;letter-spacing:-.04em}.qr-modal__panel p{margin:0;color:#666b73}.qr-modal__close{position:absolute;top:11px;right:15px;width:34px;height:34px;border:0;border-radius:50%;background:rgba(0,0,0,.08);color:#111;font-size:25px;line-height:1;cursor:pointer}.modal-open{overflow:hidden}@media(max-width:700px){.contact-cards{grid-template-columns:1fr}.contact-card{min-height:250px;padding:30px}.contact-card img{width:62px;height:62px;margin-bottom:22px}}

/* Native fallback: entrance, focus, and exit without external animation libraries. */
html.motion-fallback .chapter:not(.hero){opacity:.38;transform:translate3d(0,22px,0) scale(.992);transition:opacity 1.15s cubic-bezier(.16,1,.3,1),transform 1.15s cubic-bezier(.16,1,.3,1)}html.motion-fallback .chapter:not(.hero).is-visible{opacity:1;transform:translate3d(0,0,0) scale(1)}html.motion-fallback .bento-card,html.motion-fallback .flow-card,html.motion-fallback .compare,html.motion-fallback .accordion-item{transition:transform 1.05s cubic-bezier(.16,1,.3,1),opacity 1.05s cubic-bezier(.16,1,.3,1)}html.motion-fallback .chapter:not(.is-visible) .bento-card,html.motion-fallback .chapter:not(.is-visible) .flow-card,html.motion-fallback .chapter:not(.is-visible) .compare,html.motion-fallback .chapter:not(.is-visible) .accordion-item{opacity:.55;transform:translate3d(0,15px,0) scale(.985)}
@supports (animation-timeline:view()){@media (prefers-reduced-motion:no-preference){html:not(.motion-ready):not(.motion-fallback) .chapter:not(.hero){animation:chapter-view linear both;animation-timeline:view();animation-range:entry 8% exit 90%}@keyframes chapter-view{0%{opacity:.35;transform:translate3d(0,24px,0) scale(.992)}32%,70%{opacity:1;transform:translate3d(0,0,0) scale(1)}100%{opacity:.42;transform:translate3d(0,-14px,0) scale(.994)}}}}

/* Compact contact cards at the end of the page. */
.contact-section{width:min(980px,100%);padding-top:80px;padding-bottom:90px}.contact-section .section-heading{margin-bottom:34px}.contact-section .section-heading h2{font-size:clamp(36px,3.6vw,52px)}.contact-section .contact-card{min-height:220px;padding:28px}.contact-section .contact-card img{width:58px;height:58px;margin-bottom:20px}.contact-section .contact-card span{font-size:clamp(24px,2vw,32px)}.contact-section .contact-card p{margin:8px 0 18px;font-size:14px}
