@font-face{font-family:'switzer';font-weight:100 900;font-style:normal;font-display:swap;src:url('/fonts/switzer-v1/Switzer-Variable.woff2') format('woff2')}
@font-face{font-family:'switzer';font-weight:100 900;font-style:italic;font-display:swap;src:url('/fonts/switzer-v1/Switzer-VariableItalic.woff2') format('woff2')}
body{font-weight:400}
strong,b{font-weight:700}
#pricing{padding:0}
img{width:auto;max-width:100%;height:auto}
:root{color-scheme:dark;--ink:#0E121B;--ink-2:#141A26;--raise:#19212F;--panel:#1A2233;--line:rgba(255,255,255,.085);--line-2:rgba(255,255,255,.14);--cream:#F5EFE2;--cream-ink:#1B212E;--cream-mut:#6A6A5E;--gold:#C9A24B;--gold-br:#E4C570;--gold-soft:rgba(201,162,75,.13);--text:#EEF1F7;--mut:#98A1B2;--mut-2:#8A93A5;--rd:18px;--maxw:1160px;--disp:'switzer',system-ui,-apple-system,'Segoe UI',sans-serif;--body:'switzer',system-ui,-apple-system,'Segoe UI',sans-serif;--mono:'switzer',system-ui,-apple-system,'Segoe UI',sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:clip}
/* Animated scrolling is motion the visitor did not ask for, across the whole
   viewport, and a vestibular trigger. Every other reduced-motion block in
   these sheets switches its animation off; this declaration was the one that
   was missed. See FINDINGS.md item 4. */
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{overflow-x:clip}
body{background:radial-gradient(1100px 520px at 50% 0%, rgba(201,162,75,.17), transparent 66%), radial-gradient(900px 560px at 10% 20%, rgba(201,162,75,.11), transparent 60%), radial-gradient(950px 600px at 92% 40%, rgba(201,162,75,.10), transparent 60%), radial-gradient(900px 560px at 14% 60%, rgba(201,162,75,.10), transparent 60%), radial-gradient(950px 600px at 90% 80%, rgba(201,162,75,.10), transparent 60%), radial-gradient(1100px 560px at 50% 100%, rgba(201,162,75,.18), transparent 66%), var(--ink);background-repeat:no-repeat;background-attachment:scroll;color:var(--text);font-family:var(--body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--disp);font-weight:600;letter-spacing:-.02em;line-height:1.05}
.eyebrow{font-family:var(--mono);font-weight:500;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.gold{color:var(--gold-br)}
.gold-grad{color:transparent;background:linear-gradient(94deg,var(--gold-br),#F6E2A0 52%,var(--gold));-webkit-background-clip:text;background-clip:text}
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--disp);font-weight:600;font-size:15px;padding:11px 22px;border-radius:12px;border:1px solid transparent;cursor:pointer;transition:.22s ease;white-space:nowrap}
.btn-gold{background:var(--gold);color:#1a1505;position:relative;overflow:hidden}
.btn-gold::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-22deg);animation:shimmer 5s ease-in-out infinite}
@keyframes shimmer{0%,55%{left:-70%}78%,100%{left:140%}}
.scrollbar{position:fixed;top:0;left:0;height:3px;width:0;z-index:60;background:linear-gradient(90deg,var(--gold),var(--gold-br));box-shadow:0 0 12px rgba(201,162,75,.6)}
.btn-gold:hover{background:var(--gold-br);transform:translateY(-2px);box-shadow:0 12px 30px -10px rgba(201,162,75,.55)}
.btn-ghost{background:rgba(255,255,255,.04);color:var(--text);border-color:var(--line-2)}
.btn-ghost:hover{background:rgba(255,255,255,.08);transform:translateY(-2px)}
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:13px 24px;transition:.3s ease;border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(14,18,27,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--disp);font-weight:600;font-size:20px;letter-spacing:-.01em}
.brand img{width:30px;height:30px;border-radius:8px}
.brand .wordmark{height:20.4px;width:auto;border-radius:0}
.brand sup{font-size:9px;color:var(--mut);font-weight:400;margin-left:-3px}
.nav-links{display:flex;align-items:center;gap:30px}
.nav-links a{font-size:14.5px;color:var(--mut);transition:.2s}
.nav-links a:hover{color:var(--text)}
.nav-cta{display:flex;align-items:center;gap:14px}
.menu-btn{display:none}
@media(max-width:820px){
.nav-links{display:none}
.nav-cta .btn-ghost{display:none}
}
.hero{position:relative;padding:122px 0 70px;overflow-x:clip}
.hero-glow{position:absolute;top:-12%;left:50%;transform:translateX(-50%);width:1080px;height:700px;pointer-events:none;background:radial-gradient(ellipse at center, rgba(201,162,75,.26), transparent 64%);filter:blur(22px);animation:aurora 16s ease-in-out infinite alternate}
.hero-glow.two{top:6%;left:74%;width:560px;height:520px;background:radial-gradient(ellipse at center, rgba(120,150,210,.10), transparent 62%);animation:aurora2 19s ease-in-out infinite alternate}
@keyframes aurora{0%{transform:translateX(-50%) translateY(0) scale(1)}100%{transform:translateX(-44%) translateY(26px) scale(1.1)}}
@keyframes aurora2{0%{transform:translate(0,0) scale(1)}100%{transform:translate(-40px,30px) scale(1.16)}}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:48px;align-items:center;position:relative}
.hero h1{font-size:clamp(40px,5.4vw,66px);margin:18px 0 6px;text-wrap:balance}
.hero .free{font-family:var(--disp);font-weight:700;font-size:clamp(26px,3.4vw,40px);letter-spacing:-.02em;margin-bottom:20px;display:block;color:var(--gold-br)}
.hero .free .shine{background:linear-gradient(90deg,#C9A24B,#F4DF95,#C9A24B,#F4DF95);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:freeShine 5s linear infinite}
.blur-in{opacity:0;filter:blur(12px);will-change:opacity,filter}
@keyframes blurIn{to{opacity:1; filter:blur(0)}}
.hero h1.blur-in{animation:blurIn 1.1s cubic-bezier(.22,.61,.36,1) forwards;animation-delay:.35s}
.hero .free.blur-in{animation:blurIn 1s cubic-bezier(.22,.61,.36,1) forwards;animation-delay:.95s}
.reveal.in .blur-in{animation:blurIn 1.1s cubic-bezier(.22,.61,.36,1) forwards}
@keyframes freeShine{to{background-position:250% 0}}
.sg-badge{display:inline-flex;align-items:center;gap:9px;padding:8px 15px;border-radius:30px;border:1px solid rgba(201,162,75,.35);background:var(--gold-soft);position:relative;overflow:hidden;font-family:var(--mono);font-weight:500;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-br)}
.sg-badge .dot{width:7px;height:7px;border-radius:50%;background:var(--gold-br);animation:dotpulse 2.4s infinite}
.sg-badge em{font-style:normal;color:var(--mut)}
.sg-badge::after{content:"";position:absolute;top:0;left:-60%;width:42%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);transform:skewX(-20deg);animation:shimmer 5.5s ease-in-out infinite 1s}
@keyframes dotpulse{0%{box-shadow:0 0 0 0 rgba(228,197,112,.6)}70%{box-shadow:0 0 0 8px rgba(228,197,112,0)}100%{box-shadow:0 0 0 0 rgba(228,197,112,0)}}
.hero-copy>*{animation:heroUp .85s cubic-bezier(.2,.7,.2,1) both}
.hero-copy>*:nth-child(1){animation-delay:.05s}
.hero-copy>*:nth-child(2){animation-delay:.12s}
.hero-copy>*:nth-child(3){animation-delay:.20s}
.hero-copy>*:nth-child(4){animation-delay:.28s}
.hero-copy>*:nth-child(5){animation-delay:.36s}
.hero-copy>*:nth-child(6){animation-delay:.44s}
.hero-copy>*:nth-child(7){animation-delay:.52s}
.mgmt-cta{display:inline-flex;align-items:center;gap:7px;margin-top:16px;font-size:14px;color:var(--mut);transition:color .2s, gap .2s}
.mgmt-cta b{font-weight:600;color:var(--text);font-family:var(--disp)}
.mgmt-cta svg{color:var(--gold);transition:transform .25s}
.mgmt-cta:hover{color:var(--text)}
.mgmt-cta:hover svg{transform:translateX(3px)}
.phone-stage{animation:heroPhone 1s .25s cubic-bezier(.2,.7,.2,1) both}
@keyframes heroUp{from{opacity:0; transform:translateY(22px)}to{opacity:1; transform:none}}
@keyframes heroPhone{from{opacity:0; transform:translateY(30px) scale(.96)}to{opacity:1; transform:none}}
.hero p.lede{font-size:18px;color:var(--mut);max-width:480px;margin-bottom:30px}
.hero-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:22px}
.stores{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.store{display:flex;align-items:center;gap:9px;padding:9px 16px;border-radius:11px;border:1px solid var(--line-2);background:rgba(255,255,255,.03);transition:.2s}
.store:hover{background:rgba(255,255,255,.07);transform:translateY(-2px)}
.store svg{width:20px;height:20px;flex:none}
.store small{display:block;font-size:9.5px;color:var(--mut);line-height:1.1;text-transform:uppercase;letter-spacing:.05em}
.store b{font-family:var(--disp);font-weight:600;font-size:15px;line-height:1.15}
.trustline{display:flex;align-items:center;gap:9px;font-size:13.5px;color:var(--mut);font-family:var(--mono);font-weight:500}
.trustline .dot{width:5px;height:5px;border-radius:50%;background:var(--gold)}
.phone-stage{display:flex;justify-content:center;position:relative;perspective:2400px;perspective-origin:50% 42%}
.phone-stage .phone{z-index:2}
.phone-stage::before{content:"";position:absolute;inset:-6% -2%;border-radius:50%;background:radial-gradient(ellipse at center, rgba(201,162,75,.10), transparent 60%)}
.phone{position:relative;width:300px;height:656px;transition:transform .35s cubic-bezier(.2,.7,.2,1);will-change:transform}
.phone .screen{position:relative;width:100%;height:100%;border-radius:42px;overflow:hidden;background:#0b0e14}
.phone .screen img.feed{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.screen::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,10,15,.55) 0%,transparent 26%,transparent 52%,rgba(8,10,15,.78) 100%)}
.notch{position:absolute;top:11px;left:50%;transform:translateX(-50%);width:104px;height:26px;background:#05070b;border-radius:16px;z-index:3}
.call-top{position:absolute;top:42px;left:0;right:0;z-index:4;text-align:center;padding:0 20px}
.call-top .live{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:#fff;background:rgba(0,0,0,.4);padding:5px 11px;border-radius:20px;text-transform:uppercase}
.call-top .live i{width:6px;height:6px;border-radius:50%;background:#ff5a5a;animation:blink 1.4s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
/* Chrome inside the phone mockup, not page content (SEO-W4.3): as an <h4> it
   was the first heading after the h1 and injected a fake node into the
   outline. display:block replaces what the h4 gave it; the margins are
   unchanged, since *{margin:0} already zeroed the UA box. */
.call-top .call-title{display:block;font-family:var(--disp);font-weight:600;font-size:19px;margin-top:14px}
.call-top span{font-size:12.5px;color:rgba(255,255,255,.72)}
.call-bot{position:absolute;bottom:22px;left:0;right:0;z-index:4;padding:0 20px}
.open-door{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--disp);font-weight:600;font-size:14px;color:#0b1118;background:#c9a84c;border:none;border-radius:13px;padding:13px;cursor:pointer;box-shadow:0 0 0 0 rgba(201,162,75,.6);animation:pulse 2.4s infinite;transition:background .3s, color .3s, opacity .15s}
.open-door:active{opacity:.92;transform:scale(.985)}
.open-door svg{width:16px;height:16px;flex:none}
.open-door.sent{background:rgba(57,179,116,.22);color:#39b374;animation:none;border:.5px solid rgba(57,179,116,.42);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 4px 18px rgba(57,179,116,.2)}
.open-door.sent svg{stroke:#39b374}
.door-modal{position:absolute;inset:0;z-index:30;display:none;align-items:flex-end;background:rgba(0,0,0,.5);border-radius:inherit}
.door-modal.open{display:flex}
.door-sheet{width:100%;background:#131d2a;border-radius:22px 22px 0 0;border-top:.5px solid rgba(255,255,255,.08);overflow:hidden;padding-bottom:16px;animation:sheetUp .22s cubic-bezier(.25,.46,.45,.94)}
@keyframes sheetUp{from{transform:translateY(100%)}to{transform:none}}
@media(prefers-reduced-motion:reduce){
.door-sheet{animation:none}
}
.door-handle{display:flex;justify-content:center;padding:11px 0 0}
.door-bar{width:28px;height:3px;border-radius:2px;background:rgba(255,255,255,.15)}
.door-hero{display:flex;align-items:center;gap:11px;padding:14px 17px 12px;border-bottom:.5px solid rgba(255,255,255,.07)}
.door-hero img{width:40px;height:40px;object-fit:contain;flex:none;border-radius:6px}
.door-sheet-name{font-family:var(--disp);font-size:13px;font-weight:600;color:#edeae0;letter-spacing:-.2px}
.door-sheet-sub{font-size:10px;color:rgba(237,234,224,.5);margin-top:2px}
.door-lock-row{display:flex;flex-direction:column;align-items:center;padding:18px 17px 12px;gap:7px}
.door-lock-icon{width:50px;height:50px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;background:rgba(201,168,76,.13);border:.5px solid rgba(201,168,76,.28);transition:background .3s, border-color .3s}
.door-lock-icon svg{width:21px;height:21px}
.door-lock-icon.success{background:rgba(57,179,116,.15);border-color:rgba(57,179,116,.35)}
.door-hint{font-size:11px;color:rgba(237,234,224,.55);text-align:center;line-height:1.4}
.door-hint strong{color:rgba(237,234,224,.9);font-weight:600}
.door-spinning{display:flex;flex-direction:column;align-items:center;gap:7px;font-size:11px;color:rgba(237,234,224,.5)}
.door-spinning::before{content:"";display:block;width:30px;height:30px;border-radius:50%;border:2.5px solid rgba(201,168,76,.15);border-top-color:#c9a84c;animation:spin .72s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.door-ok{display:flex;flex-direction:column;align-items:center;gap:2px}
.door-unlocked-lbl{color:#39b374;font-size:13px;font-weight:600}
.door-unlocked-time{color:rgba(237,234,224,.4);font-size:10px}
.door-buttons{padding:0 17px;display:flex;flex-direction:column;gap:8px;margin-top:2px}
.sheet-open-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px 0;border-radius:13px;cursor:pointer;border:none;background:#c9a84c;color:#0b1118;font-family:var(--disp);font-size:13px;font-weight:600;transition:opacity .15s, transform .1s}
.sheet-open-btn:active{transform:scale(.98);opacity:.88}
.sheet-cancel-btn{width:100%;padding:12px 0;border-radius:13px;cursor:pointer;background:rgba(255,255,255,.06);border:.5px solid rgba(255,255,255,.1);color:rgba(237,234,224,.55);font-family:var(--disp);font-size:13px;font-weight:600;transition:opacity .15s, transform .1s}
.sheet-done-btn{width:100%;padding:12px 0;border-radius:13px;cursor:pointer;background:rgba(57,179,116,.15);border:.5px solid rgba(57,179,116,.35);color:#39b374;font-family:var(--disp);font-size:13px;font-weight:600;transition:opacity .15s, transform .1s}
.sheet-cancel-btn:active,.sheet-done-btn:active{transform:scale(.98);opacity:.8}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(201,162,75,.5)}70%{box-shadow:0 0 0 16px rgba(201,162,75,0)}100%{box-shadow:0 0 0 0 rgba(201,162,75,0)}}
.call-ctrls{display:flex;justify-content:center;gap:20px;margin-top:18px}
.cc{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.14);backdrop-filter:blur(6px)}
.cc.end{background:#ff4d4d}
.cc svg{width:21px;height:21px}
.wphone{position:absolute;left:50%;bottom:-30px;z-index:1;width:300px;height:656px;margin-left:124px;rotate:y 10deg;transform-origin:50% 100%;animation:floaty 7s ease-in-out infinite 1.2s}
.wphone:hover{animation-play-state:paused}
.phone,.wphone{border-radius:47px;padding:5px;background:radial-gradient(150% 100% at 6% -4%, rgba(196,216,255,.13), rgba(196,216,255,0) 52%), conic-gradient( #232b3a 0deg, #191f2c 26deg, #101521 62deg, #0b0f19 96deg, #080b14 136deg, #060810 178deg, #080b13 214deg, #111725 252deg, #263043 286deg, #3e4a63 312deg, #2d3648 328deg, #232b3a 360deg);box-shadow:inset 0 0 0 .5px rgba(208,224,255,.24), inset 0 1.5px 1px -1px rgba(208,224,255,.46), inset 0 -2px 1px -1px rgba(0,0,0,.88), inset 2px 0 1px -1px rgba(208,224,255,.24), inset -2px 0 2px -1px rgba(0,0,0,.84), 0 42px 60px -34px rgba(0,0,0,.9), 34px 40px 80px -44px rgba(0,0,0,.85), 26px 0 44px -28px rgba(0,0,0,.95), 0 90px 130px -60px rgba(0,0,0,.9)}
.flank{position:absolute;left:-11px;top:47px;bottom:47px;width:11px;z-index:1;transform-origin:100% 50%;transform:perspective(620px) rotateY(-71deg);border-radius:3px 0 0 3px;pointer-events:none;background:linear-gradient(90deg, #020409 0%, #090d16 12%, #1b2334 30%, #333e57 47%, #4a5674 56%, #2b3549 66%, #151b28 82%, #080b12 94%, #03050a 100%);-webkit-mask:linear-gradient(180deg,transparent,#000 14px,#000 calc(100% - 14px),transparent);mask:linear-gradient(180deg,transparent,#000 14px,#000 calc(100% - 14px),transparent)}
.flank i{position:absolute;left:-1.5px;width:calc(100% + 1.5px);border-radius:2px 0 0 2px;background:linear-gradient(90deg,#04060b 0%,#141a26 18%,#333d54 46%,#46516b 58%,#232b3c 78%,#080b12 100%);box-shadow:0 1px 0 rgba(0,0,0,.6), 0 -1px 0 rgba(255,255,255,.14)}
.flank i:nth-child(1){top:9%;height:5.5%}
.flank i:nth-child(2){top:20%;height:10%}
.flank i:nth-child(3){top:33%;height:10%}
.glare{position:absolute;inset:5px;z-index:6;border-radius:42px;pointer-events:none;background:linear-gradient(107deg, rgba(255,255,255,0) 21%, rgba(255,255,255,.028) 25.5%, rgba(255,255,255,.062) 27.5%, rgba(255,255,255,.018) 30%, rgba(255,255,255,0) 33.5%), linear-gradient(100deg, rgba(206,224,255,.14) 0%, rgba(206,224,255,.03) 15%, rgba(255,255,255,0) 38%), linear-gradient(302deg, rgba(255,255,255,.055) 0%, rgba(255,255,255,0) 24%);box-shadow:inset 0 0 0 1px rgba(0,0,0,.8), inset 0 2px 5px -2px rgba(0,0,0,.95), inset 0 -1px 3px -1px rgba(0,0,0,.8), inset 0 0 24px -8px rgba(0,0,0,.6)}
@media(prefers-reduced-motion:no-preference){
.phone .glare{transition:opacity .35s}
}
.wphone::after{content:"";position:absolute;inset:-14% -18%;z-index:-1;border-radius:50%;background:radial-gradient(ellipse at 45% 55%, rgba(201,162,75,.20), transparent 66%);pointer-events:none}
.wphone-screen{position:relative;border-radius:42px;overflow:hidden;height:100%;padding:18px 14px 20px;display:flex;flex-direction:column;background:radial-gradient(88% 30% at 6% -6%, #949a76 0%, rgba(148,154,118,0) 72%), radial-gradient(120% 40% at -22% 34%,#1d5384 0%, rgba(29,83,132,0) 74%), linear-gradient(178deg,#7c876a 0%,#5c7a76 12%,#3c6a80 26%,#215079 42%, #10324f 58%,#061525 72%,#000205 86%,#000 100%)}
.wp-art{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center;pointer-events:none}
.wphone-screen > *:not(.wp-art):not(.wp-notch){position:relative;z-index:1;flex:none}
.wp-top{height:60px;flex:none}
.wp-notch{position:absolute;top:11px;left:50%;translate:-50% 0;width:104px;height:26px;background:#05070b;border-radius:16px;z-index:4}
.wp-widget{position:relative;border-radius:18px;overflow:hidden;background:linear-gradient(135deg,#152640 0%,#0b1926 38%,#060c16 68%,#030609 100%);border:.5px solid rgba(255,255,255,.07);box-shadow:0 2px 20px rgba(0,0,0,.55), 0 0 0 .5px rgba(255,255,255,.04)}
.wp-widget::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg, rgba(255,255,255,.055), transparent 34%)}
.wp-widget > *{position:relative}
.wp-slot{display:flex;align-items:center;gap:14px;min-height:76px;padding:10px 14px;position:relative;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .12s ease}
.wp-slot.press{background:rgba(255,255,255,.07)}
.wp-slot.press .wp-lock{scale:.9}
.wp-lock{transition:background .25s ease, border-color .25s ease, color .25s ease, box-shadow .25s ease, scale .12s ease}
.wp-slot + .wp-slot{border-top:.5px solid rgba(255,255,255,.06)}
.wp-main{flex:1;min-width:0}
.wp-name{color:var(--text);font-size:12px;font-weight:700;letter-spacing:-.1px;line-height:1.25}
.wp-loc{color:rgba(255,255,255,.42);font-size:9.5px;font-weight:500;margin-top:2px}
.wp-sub{color:rgba(255,255,255,.38);font-size:9px;font-weight:500;margin-top:3px}
.wp-sub.sent{color:rgba(57,196,122,.9);font-weight:600}
.wp-sub.sending{color:rgba(201,168,76,.9);font-weight:600}
.wp-slot.sending .wp-lock{background:rgba(201,168,76,.10);border-color:rgba(201,168,76,.30);box-shadow:none}
.wp-lock.sending::before{content:"";width:15px;height:15px;border-radius:50%;border:2px solid rgba(201,168,76,.20);border-top-color:var(--gold-br);animation:spin .72s linear infinite}
@media(prefers-reduced-motion:reduce){
.wp-lock.sending::before{animation:none}
}
.wp-lock{width:30px;height:30px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;background:rgba(201,162,75,.18);border:1px solid rgba(201,162,75,.62);color:var(--gold-br);box-shadow:0 0 14px -2px rgba(201,162,75,.45), inset 0 1px 0 rgba(255,255,255,.12)}
.wp-lock svg{width:14px;height:14px}
.wp-slot.sent .wp-lock{background:rgba(34,143,92,.24);border-color:rgba(34,143,92,.7);color:#39c47a;box-shadow:0 0 14px -2px rgba(57,196,122,.4), inset 0 1px 0 rgba(255,255,255,.1)}
.wp-foot{display:flex;align-items:center;gap:6px;padding:6px 14px 7px;border-top:.5px solid rgba(255,255,255,.05)}
.wp-foot img{width:12px;height:12px;border-radius:4px;opacity:.32}
.wp-foot span{font-size:8.5px;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;color:rgba(201,168,76,.38)}
.wp-cards{display:flex;flex-direction:column;gap:18px;margin-top:18px}
.wp-card{animation:heroUp .7s cubic-bezier(.2,.7,.2,1) both}
.wp-card:nth-child(1){animation-delay:1.5s}
.wp-card:nth-child(2){animation-delay:2s}
.wp-card:nth-child(3){animation-delay:2.5s}
@media(prefers-reduced-motion:reduce){
.wp-card{animation:none}
}
.wp-card{display:flex;align-items:center;justify-content:space-between;gap:8px;border-radius:17px;padding:15px 9px 15px 12px;overflow:hidden;box-shadow:0 2px 16px rgba(0,0,0,.45)}
.wp-card{background:linear-gradient(150deg,#16212f,#111a26);border:.5px solid rgba(255,255,255,.11)}
.wp-card-l{flex:1;min-width:0}
.wp-eyebrow{font-size:7.5px;font-weight:700;letter-spacing:1.1px;margin-bottom:4px}
.wp-card.booking .wp-eyebrow{color:#39b374}
.wp-card.payment .wp-eyebrow{color:#c9a84c}
.wp-card.notice .wp-eyebrow{color:#9d97e8}
.wp-title{color:#edeae0;font-size:14px;font-weight:700;letter-spacing:-.3px;line-height:1.2}
.wp-sub2{color:#95a9bd;font-size:9.5px;margin-top:3px}
.wp-act{display:inline-flex;align-items:center;gap:3px;margin-top:7px;font-size:8.5px;font-weight:600;border-radius:6px;padding:4px 8px}
.wp-act svg{width:8px;height:8px}
.wp-card.booking .wp-act{color:#39b374;background:rgba(57,179,116,.12);border:.5px solid rgba(57,179,116,.32)}
.wp-card.payment .wp-act{color:#c9a84c;background:rgba(201,168,76,.12);border:.5px solid rgba(201,168,76,.32)}
.wp-card.notice .wp-act{color:#9d97e8;background:rgba(157,151,232,.12);border:.5px solid rgba(157,151,232,.32)}
.wp-thumb{width:65px;height:65px;border-radius:14px;flex:none;object-fit:cover;display:block;box-shadow:0 4px 12px rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.12)}
.wp-ico{width:65px;height:65px;border-radius:14px;flex:none;display:flex;align-items:center;justify-content:center;background:rgba(201,168,76,.12);border:1px solid rgba(201,168,76,.26)}
.wp-ico img{width:50px;height:31px;object-fit:contain;display:block}
.phone-stage .wphone{translate:0 calc(var(--hp,0) * 11px)}
@media(prefers-reduced-motion:reduce){
.phone-stage .wphone{translate:none}
}
@media(min-width:1180px){
.phone-stage{translate:-78px -20px;scale:.969;transform-origin:50% 40%}
.phone-stage .phone{rotate:y 10deg}
}
@media(min-width:1440px) and (max-width:1599px){
.phone-stage{translate:-72px -20px;scale:.9206;transform-origin:50% 40%}
}
@media(min-width:1180px) and (max-width:1439px){
.phone-stage{translate:-92px -18px;scale:.8531;transform-origin:50% 40%}
}
@media(max-width:1179px){
.phone-stage{display:flex;flex-direction:row;align-items:flex-start;gap:16px;justify-content:flex-start;min-width:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;margin-inline:calc(50% - 50vw);width:100vw;padding-inline:max(0px, calc(50vw - 150px));perspective:none}
.phone-stage::-webkit-scrollbar{display:none}
.phone-stage::before{display:none}
.phone-stage .phone,.phone-stage .wphone{flex:none;scroll-snap-align:center;rotate:none;translate:none;width:300px;height:656px}
.phone-stage .wphone{display:block;position:relative;left:auto;bottom:auto;margin:0;animation:none}
.phone-stage .wphone::after{display:none}
.phone-stage .flank{display:none}
.phone-stage .phone{order:1}
.phone-stage .wphone{order:2}
.hero .phone-dots{display:flex}
}
.phone-dots{display:none;justify-content:center;gap:7px;margin-top:16px}
.phone-dots i{width:6px;height:6px;border-radius:50%;display:block;background:rgba(255,255,255,.22);transition:background .25s, width .25s}
.phone-dots i.on{background:var(--gold);width:18px;border-radius:3px}
@media(prefers-reduced-motion:reduce){
.wphone{animation:none}
}
.phone-stage .phone{translate:0 calc(var(--hp,0) * 26px)}
@media(prefers-reduced-motion:reduce){
.phone-stage .phone{translate:none}
}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.marquee-sec{padding:30px 0;background:var(--ink-2)}
.marquee-sec .lbl{text-align:center;font-family:var(--mono);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--mut-2);margin-bottom:18px}
.marquee{display:flex;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.marquee .track{display:flex;gap:14px;padding-right:14px;animation:marqueeSlide 32s linear infinite;flex:none}
.marquee:hover .track{animation-play-state:paused}
@keyframes marqueeSlide{to{transform:translateX(-50%)}}
.chip{display:flex;align-items:center;gap:9px;padding:10px 18px;border-radius:30px;white-space:nowrap;border:1px solid var(--line);background:rgba(255,255,255,.025);font-family:var(--disp);font-weight:500;font-size:14.5px;color:var(--mut)}
.chip i{width:7px;height:7px;border-radius:50%;background:var(--gold);opacity:.7}
.section{padding:96px 0}
.sec-head{max-width:680px;margin-bottom:50px}
.sec-head.center{margin:0 auto 54px;text-align:center}
.sec-head h2{font-size:clamp(30px,4vw,46px);margin:14px 0 14px}
.sec-head p{color:var(--mut);font-size:17px}
.gold-band{position:relative;background:radial-gradient(ellipse 110% 55% at 50% 50%, rgba(201,162,75,.16), transparent 68%), radial-gradient(ellipse 80% 30% at 18% 30%, rgba(201,162,75,.07), transparent 60%), radial-gradient(ellipse 80% 30% at 82% 70%, rgba(201,162,75,.07), transparent 60%)}
.feat-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:22px;row-gap:0;align-items:stretch}
.col{border-radius:24px;padding:34px 30px;display:grid;grid-template-rows:subgrid;grid-row:span 14;align-content:start}
.col-free{background:var(--cream);color:var(--cream-ink)}
.col-cloud{background:linear-gradient(180deg,#1b2436,#141b29);border:1px solid var(--line)}
.col h3{font-size:32px;font-weight:700;line-height:1.12;letter-spacing:-.022em;margin:2px 0 9px}
.col-free h3{color:var(--cream-ink)}
.col-cloud h3{color:transparent;background:linear-gradient(94deg,var(--gold-br),#F6E2A0 52%,var(--gold));-webkit-background-clip:text;background-clip:text}
.col .sub{font-size:14.5px;margin-bottom:8px}
.col-free .sub{color:var(--cream-mut)}
.col-cloud .sub{color:var(--mut)}
.col .rule{height:1px;margin:22px 0 8px}
.col-free .rule{background:rgba(0,0,0,.1)}
.col-cloud .rule{background:var(--line)}
.frow{position:relative;display:flex;gap:13px;padding:10px 14px 10px 16px;margin:0 -14px;border-radius:14px;align-items:center;cursor:pointer;opacity:0;transform:translateY(20px);transition:opacity .55s cubic-bezier(.2,.7,.2,1), transform .55s cubic-bezier(.2,.7,.2,1), background .3s ease, padding-left .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s ease}
.frow.frow-visible{opacity:1;transform:translateY(0)}
.frow.frow-pop .fic{transform:scale(1.22) rotate(-6deg)!important;transition:transform .38s cubic-bezier(.34,1.56,.64,1)!important}
.frow.frow-pop b{color:var(--gold-br)!important;transition:color .28s ease!important}
.col-free .frow.frow-pop b{color:#7e6c39!important}
@keyframes rowIn{from{opacity:0; transform:translateY(16px)}to{opacity:1; transform:translateY(0)}}
.frow::before{content:"";position:absolute;left:5px;top:50%;transform:translateY(-50%);width:3px;height:0;border-radius:3px;background:var(--gold-br);transition:height .3s cubic-bezier(.2,.7,.2,1)}
.col-free .frow::before{background:var(--cream-ink)}
.frow:hover{padding-left:25px}
.frow:hover::before{height:60%}
.frow:active{transform:scale(.985)}
.col-free .frow:hover{background:rgba(27,33,46,.06)}
.col-cloud .frow:hover{background:rgba(201,162,75,.09);box-shadow:0 10px 34px -16px rgba(201,162,75,.55)}
.frow:hover .fic{transform:scale(1.14) rotate(-5deg)}
.frow:active .fic{transform:scale(.9)}
.col-cloud .frow:hover .fic{background:rgba(201,162,75,.3);box-shadow:0 0 0 4px rgba(201,162,75,.16)}
.col-free .frow:hover .fic{background:rgba(27,33,46,.13)}
.col-cloud .frow:hover b{color:var(--gold-br)}
.frow:hover b{letter-spacing:.01em}
.frow + .frow{border-top:1px solid transparent}
.fic{width:38px;height:38px;border-radius:10px;flex:none;display:flex;align-items:center;justify-content:center;transition:transform .35s cubic-bezier(.34,1.56,.64,1), background .3s ease, box-shadow .3s ease}
.col-free .fic{background:rgba(27,33,46,.07)}
.col-cloud .fic{background:var(--gold-soft)}
.fic svg{width:20px;height:20px}
.col-free .fic svg{color:#2a3142}
.col-cloud .fic svg{color:var(--gold-br)}
.frow b{font-family:var(--disp);font-weight:600;font-size:15.5px;display:block;margin-bottom:2px;transition:color .3s ease, letter-spacing .3s ease}
.frow p{font-size:13.5px;line-height:1.5;transition:color .3s ease}
.col-free .frow p{color:var(--cream-mut)}
.col-cloud .frow p{color:var(--mut)}
.feat-grid{position:relative}
.col{position:relative}
.col-cloud{border:1px solid rgba(201,162,75,.5);box-shadow:0 30px 80px -40px rgba(201,162,75,.45), inset 0 1px 0 rgba(228,197,112,.18)}
.col-cloud .rec{position:absolute;top:31px;right:26px;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:#1a1505;background:linear-gradient(135deg,var(--gold-br),var(--gold));padding:6px 12px;border-radius:30px}
.price{font-family:var(--disp);font-weight:700;font-size:34px;letter-spacing:-.02em;line-height:1.1;margin:20px 0 4px}
.price small{display:block;font-family:var(--body);font-weight:500;font-size:13.5px;letter-spacing:0;margin-top:5px}
.col-free .price{color:var(--cream-ink)}
.col-free .price small{color:var(--cream-mut)}
.col-cloud .price{color:var(--text)}
.col-cloud .price small{color:var(--mut)}
.list-intro{font-family:var(--disp);font-weight:600;font-size:16px;margin:16px -30px 10px;padding:13px 30px;display:flex;align-items:center;gap:10px;border-top:1px solid;border-bottom:1px solid;opacity:0;transform:translateY(20px);transition:opacity .55s cubic-bezier(.2,.7,.2,1), transform .55s cubic-bezier(.2,.7,.2,1)}
.list-intro.li-in{opacity:1;transform:none}
.list-intro svg{width:18px;height:18px;flex:none}
.col-free .list-intro{color:var(--cream-ink);background:rgba(27,33,46,.05);border-color:rgba(27,33,46,.09)}
.col-free::after,.col-cloud::after{align-self:end;margin-top:22px;padding-top:18px;text-align:center;font-family:var(--disp);font-weight:500;font-size:13px;letter-spacing:.03em;border-top:1px solid}
.col-free::after{content:"No ads, no resident data sold, no feature locks.";color:var(--cream-mut);border-top-color:rgba(27,33,46,.09)}
.col-cloud::after{content:"Unlimited hardware warranty. Cabling and installation quoted separately.";color:var(--mut);border-top-color:rgba(201,162,75,.28)}
.plus-line{color:var(--gold-br);font-weight:700;letter-spacing:.01em;background:linear-gradient(90deg,rgba(201,162,75,.26),rgba(201,162,75,.08));border-color:rgba(201,162,75,.45)}
.col-cta{margin:20px 0 4px;display:flex;flex-direction:column;gap:10px;align-items:stretch}
.col-cta .btn{justify-content:center;text-align:center}
.cta-note{text-align:center}
.btn-ink{background:var(--cream-ink);color:var(--cream)}
.btn-ink:hover{transform:translateY(-2px);box-shadow:0 12px 30px -12px rgba(27,33,46,.55)}
.cta-note{font-size:12.5px}
.col-free .cta-note{color:var(--cream-mut)}
.col-cloud .cta-note{color:var(--mut)}
.cta-note a{text-decoration:underline;text-underline-offset:3px;transition:color .2s ease}
.col-cloud .cta-note a:hover{color:var(--gold-br)}
@media(max-width:880px){
.col-cloud{margin-top:40px}
.col-cloud .rec{top:-13px;right:auto;left:50%;transform:translateX(-50%)}
.frow p{display:none}
.frow b{margin-bottom:0;font-size:15px}
.frow{padding-top:12px;padding-bottom:12px;gap:13px}
}
.life-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.life{position:relative}
.life img{width:100%;aspect-ratio:1/1.04;object-fit:cover;display:block;border-radius:20px;border:1px solid var(--line);filter:saturate(.88) contrast(1.04);transition:transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s ease}
.life:hover img{transform:translateY(-5px);box-shadow:0 26px 60px -26px rgba(0,0,0,.65)}
.life figcaption{padding:18px 6px 0}
.life .ico{position:absolute;top:16px;left:16px;width:36px;height:36px;border-radius:10px;background:rgba(10,13,20,.5);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;border:1px solid rgba(201,162,75,.35)}
.life .ico svg{width:18px;height:18px;color:var(--gold-br)}
.life b{font-family:var(--disp);font-weight:600;font-size:18.5px;display:block;margin-bottom:5px;color:var(--text)}
.life span{font-size:14px;line-height:1.55;color:var(--mut)}
@media(max-width:820px){
.life-grid{grid-template-columns:1fr;gap:34px}
.life img{aspect-ratio:4/3;object-position:center 25%}
.life-grid figure:nth-child(1) img{object-position:center 68%}
}
.gal-sec{background:radial-gradient(820px 640px at 84% 22%, rgba(201,162,75,.10), transparent 60%), var(--ink-2);padding:50px 0}
.gal-sec .sec-head{margin-bottom:26px}
.gal-sec .sec-head h2{font-size:clamp(26px,3.2vw,38px)}
.screens{margin:0 auto;padding:40px 0 20px;overflow:hidden;touch-action:pan-y;cursor:grab;-webkit-user-select:none;user-select:none}
.screens.dragging{cursor:grabbing}
.screens.dragging .strack{transition:none}
.ph img{-webkit-user-drag:none;user-drag:none}
.strack{display:flex;gap:20px;align-items:flex-start;width:max-content;will-change:transform}
.ph{flex:0 0 auto;width:220px;text-align:center;cursor:pointer;position:relative;opacity:.62;scroll-snap-align:center;transition:transform .5s cubic-bezier(.2,.7,.2,1), opacity .45s}
/* Same as index.css: one box for every export size, so the row of screens is
   level. The mobile block at the end of this file overrides the height. */
.ph img{width:100%;aspect-ratio:400/960;object-fit:cover;display:block;border-radius:30px;box-shadow:0 18px 44px -18px rgba(0,0,0,.55);transition:box-shadow .5s}
.ph figcaption{margin-top:14px;padding:0 16px;min-height:88px;text-align:center;transition:opacity .45s ease}
.ph figcaption strong{display:block;font-size:18.5px;font-weight:600;letter-spacing:-.015em;line-height:1.3;color:var(--text);margin-bottom:8px;transition:color .45s ease}
.ph figcaption strong::before{content:"";display:block;width:0;height:2px;margin:0 auto 14px;border-radius:2px;background:var(--gold-br);box-shadow:0 0 10px rgba(228,197,112,.5);opacity:0;transition:width .5s cubic-bezier(.2,.7,.2,1),opacity .45s ease}
.ph figcaption span{display:block;max-width:248px;margin:0 auto;font-size:14.5px;line-height:1.5;color:var(--mut);font-weight:450;opacity:0;transform:translateY(4px);transition:opacity .45s ease,transform .5s cubic-bezier(.2,.7,.2,1)}
.ph.active figcaption strong{color:var(--gold-br)}
.ph.active figcaption strong::before{width:26px;opacity:1}
.ph.active figcaption span{opacity:1;transform:none;color:#c4ccdb}
.ph.active{opacity:1;z-index:2}
.ph.active img{box-shadow:0 26px 70px -18px rgba(201,162,75,.5);border-radius:30px}
.screens:hover .ph:not(.active){opacity:.45}
@media(max-width:1080px){
.ph{width:238px}
}
@media(max-width:820px){
.screens{padding:20px 0}
.strack{gap:18px}
.ph{width:309px;opacity:1}
.screens:hover .ph:not(.active){opacity:1}
}
@media(max-width:480px){
.ph{width:274px}
}
.sdots{display:flex;justify-content:center;align-items:center;gap:9px;margin-top:30px;padding:0 24px}
.sdots button{appearance:none;-webkit-appearance:none;border:0;padding:0;cursor:pointer;width:22px;height:2px;border-radius:2px;background:rgba(255,255,255,.16);transition:background .35s ease, width .4s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease}
.sdots button:hover{background:rgba(255,255,255,.34)}
.sdots button.on{width:40px;background:var(--gold-br);box-shadow:0 0 12px -2px rgba(228,197,112,.6)}
@media(prefers-reduced-motion:reduce){
.sdots button{transition:none}
}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.stat .num{font-family:var(--disp);font-weight:700;font-size:clamp(44px,6vw,72px);color:var(--gold-br);line-height:1;letter-spacing:-.03em}
.stat .lbl{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin-top:12px}
@media(max-width:600px){
.stats{grid-template-columns:1fr 1fr;gap:38px 24px}
}
.sg-sec{background:radial-gradient(820px 640px at 16% 64%, rgba(201,162,75,.10), transparent 60%), var(--ink-2)}
.sg-grid{display:grid;grid-template-columns:1fr .82fr;gap:56px;align-items:center}
.sg-grid p{color:var(--mut);font-size:16.5px;margin-bottom:18px;max-width:460px}
.sg-stack{list-style:none;margin:30px 0 0;padding:0;position:relative}
.sg-stack::before{content:"";position:absolute;left:13px;top:22px;bottom:22px;width:1px;background:linear-gradient(180deg,transparent,rgba(201,162,75,.32) 10%,rgba(201,162,75,.32) 90%,transparent);transform:scaleY(0);transform-origin:50% 0;transition:transform 1s cubic-bezier(.2,.7,.2,1) .12s}
.reveal.in .sg-stack::before{transform:scaleY(1)}
.sg-stack li{position:relative;display:flex;gap:17px;align-items:flex-start;padding:16px 0;opacity:0;transform:translateY(10px);transition:opacity .6s ease, transform .6s cubic-bezier(.2,.7,.2,1)}
.reveal.in .sg-stack li{opacity:1;transform:none}
.reveal.in .sg-stack li:nth-child(1){transition-delay:.20s}
.reveal.in .sg-stack li:nth-child(2){transition-delay:.32s}
.reveal.in .sg-stack li:nth-child(3){transition-delay:.44s}
.reveal.in .sg-stack li:nth-child(4){transition-delay:.56s}
.sg-stack li+li::before{content:"";position:absolute;left:44px;right:0;top:0;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.09),rgba(255,255,255,.045) 70%,transparent)}
.sg-stack li:first-child{padding-top:4px}
.sg-stack li:last-child{padding-bottom:4px}
.sg-n{position:relative;z-index:1;flex:none;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:var(--ink-2);box-shadow:inset 0 0 0 1px rgba(201,162,75,.42);font-family:var(--mono);font-weight:700;font-size:10.5px;letter-spacing:.04em;color:var(--gold);transition:color .25s ease, box-shadow .25s ease, background .25s ease}
.sg-stack li:hover .sg-n{color:var(--gold-br);background:#1b2030;box-shadow:inset 0 0 0 1px rgba(228,197,112,.72), 0 0 18px -4px rgba(228,197,112,.4)}
.sg-stack li:hover em{color:#c4ccdb}
.sg-stack b{display:block;font-family:var(--disp);font-weight:600;font-size:15.5px;color:var(--text);margin:3px 0 4px}
.sg-stack em{display:block;font-style:normal;font-size:14.5px;line-height:1.55;color:var(--mut);transition:color .3s ease}
.sg-note{grid-column:1/-1;align-self:start;margin-top:clamp(20px,2.4vw,38px);padding-top:30px;border-top:1px solid rgba(255,255,255,.09);display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:20px 56px}
.sg-grid .sg-note p{max-width:60ch;margin:0;color:var(--mut);font-size:clamp(16px,1.42vw,19px);line-height:1.55}
.sg-note p strong{display:block;font-weight:600;color:var(--text);font-family:var(--disp);letter-spacing:-.012em;font-size:clamp(19px,1.85vw,25px);line-height:1.3;margin-bottom:9px}
.sg-note .inshort-link{margin-top:4px;flex:none}
.hw-shots{display:flex;justify-content:center;position:relative}
.hw-shots::before{content:"";position:absolute;left:50%;top:46%;width:min(520px,92%);height:56%;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;background:radial-gradient(ellipse at center, rgba(255,226,170,.085), transparent 66%)}
.hw-fig{position:relative;margin:0;display:block}
.hw-fig>img{position:relative;z-index:1;display:block;height:auto;max-height:576px;width:auto;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.hw-fig:hover>img{transform:translateY(-9px)}
.hw-fig::after{content:"";position:absolute;z-index:0;left:2%;right:2%;bottom:-12px;height:32px;background:radial-gradient(46% 100% at 27% 50%, rgba(0,0,0,.82), transparent 74%), radial-gradient(42% 100% at 73% 50%, rgba(0,0,0,.68), transparent 76%);filter:blur(9px);transition:transform .5s cubic-bezier(.2,.7,.2,1), opacity .5s ease}
.hw-fig:hover::after{transform:scale(1.07,1.3);opacity:.6}
.hw-refl{position:absolute;left:0;top:100%;width:100%;height:100%;overflow:hidden;opacity:.14;pointer-events:none;transition:transform .5s cubic-bezier(.2,.7,.2,1), opacity .5s ease;-webkit-mask-image:linear-gradient(180deg,#000 0,rgba(0,0,0,.4) 8%,transparent 24%);mask-image:linear-gradient(180deg,#000 0,rgba(0,0,0,.4) 8%,transparent 24%)}
.hw-fig:hover .hw-refl{opacity:.07;transform:translateY(7px)}
.hw-refl img{width:100%;height:100%;object-fit:fill;transform:scaleY(-1);filter:blur(1.5px)}
@media(prefers-reduced-motion:reduce){
.sg-stack::before{transform:scaleY(1);transition:none}
.sg-stack li{opacity:1;transform:none;transition:none}
.hw-fig>img,.hw-fig::after,.hw-refl{transition:none}
.hw-fig:hover>img{transform:none}
.hw-fig:hover::after{transform:none;opacity:1}
.hw-fig:hover .hw-refl{opacity:.14;transform:none}
}
.inshort{text-align:center;max-width:880px;margin:0 auto}
.inshort h3{font-size:clamp(28px,4vw,46px);font-weight:700;letter-spacing:-.022em;line-height:1.1;margin:16px 0 16px}
.inshort p{color:var(--mut);font-size:18px;line-height:1.6}
.inshort-link{display:inline-flex;align-items:center;gap:8px;margin-top:22px;font-family:var(--disp);font-weight:600;font-size:15.5px;color:var(--gold-br);transition:gap .25s ease, color .25s ease}
.inshort-link svg{width:17px;height:17px;transition:transform .25s ease}
.inshort-link:hover{gap:12px;color:#F6E2A0}
.rd2{transition-delay:.15s}
.rd3{transition-delay:.3s}
.cta-sec{position:relative;overflow:hidden}
.cta-glow{position:absolute;bottom:-40%;left:50%;transform:translateX(-50%);width:1200px;height:820px;background:radial-gradient(ellipse at center,rgba(201,162,75,.26),transparent 62%);pointer-events:none}
.cta-grid{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;border:1px solid var(--line);border-radius:26px;padding:48px;background:rgba(20,26,38,.5)}
.cta-grid h2{font-size:clamp(30px,4vw,46px);margin-bottom:14px}
.cta-grid .lede{color:var(--mut);font-size:17px;margin-bottom:28px}
.cta-bens{display:flex;flex-direction:column;gap:13px;margin-bottom:30px}
.inshort p.free-proof{position:relative;margin:32px auto 0;padding-top:28px;max-width:56ch;font-size:18px;line-height:1.6;color:var(--mut);text-wrap:balance}
.inshort p.free-proof::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:38px;height:1px;background:linear-gradient(90deg,transparent,rgba(228,197,112,.55),transparent)}
.cta-assure{margin-top:14px;font-size:12.5px;color:var(--mut-2,var(--mut));letter-spacing:.01em;text-align:center}
.cta-bens div{display:flex;gap:11px;align-items:center;font-size:15.5px}
.cta-bens svg{width:20px;height:20px;color:var(--gold);flex:none}
.qr-box{display:flex;flex-direction:column;align-items:center;gap:16px;padding:30px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:20px}
.qr-box img{width:170px;height:170px;border-radius:12px;background:#fff;padding:10px}
.qr-box .qr-cap{font-family:var(--disp);font-weight:600;font-size:15px;text-align:center}
.timeline{margin-top:48px;margin-bottom:48px;text-align:center}
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:start}
.faq-head h2{font-size:clamp(34px,4.4vw,52px);line-height:1.04;margin:18px 0 0}
.faq-list.reveal{opacity:1;transform:none}
.faq-list{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line);opacity:0;transform:translateY(12px);transition:opacity .55s ease, transform .55s cubic-bezier(.2,.7,.2,1)}
.faq-list.in .faq-item{opacity:1;transform:none}
.faq-list.in .faq-item:nth-child(1){transition-delay:.04s}
.faq-list.in .faq-item:nth-child(2){transition-delay:.09s}
.faq-list.in .faq-item:nth-child(3){transition-delay:.14s}
.faq-list.in .faq-item:nth-child(4){transition-delay:.19s}
.faq-list.in .faq-item:nth-child(5){transition-delay:.24s}
.faq-list.in .faq-item:nth-child(6){transition-delay:.29s}
.faq-list.in .faq-item:nth-child(7){transition-delay:.34s}
.faq-list.in .faq-item:nth-child(8){transition-delay:.39s}
.faq-list.in .faq-item:nth-child(9){transition-delay:.44s}
.faq-list.in .faq-item:nth-child(10){transition-delay:.49s}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 4px;background:none;border:0;cursor:pointer;text-align:left;font-family:var(--disp);font-size:16px;font-weight:600;letter-spacing:-.01em;color:var(--text);transition:color .25s}
.faq-q:hover{color:#fff}
.faq-item.open .faq-q{color:var(--gold-br)}
.faq-q svg{width:18px;height:18px;flex:none;color:var(--mut-2);transition:transform .38s cubic-bezier(.4,0,.2,1), color .3s}
.faq-item.open .faq-q svg{transform:rotate(180deg);color:var(--gold-br)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s cubic-bezier(.4,0,.2,1)}
.faq-item.open .faq-a{grid-template-rows:1fr}
.faq-a>div{overflow:hidden}
.faq-a p{margin:0;padding:0 4px 22px;color:var(--mut);font-size:14.5px;line-height:1.62;max-width:60ch;opacity:0;transition:opacity .3s ease}
.faq-item.open .faq-a p{opacity:1;transition:opacity .45s ease .12s}
.faq-foot{text-align:center;margin-top:52px}
.faq-foot p{color:var(--mut);font-size:15px;margin-bottom:18px}
@media(max-width:880px){
.faq-grid{grid-template-columns:1fr;gap:26px}
}
.tl-lead{display:inline-block;font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:36px}
.tl-steps{display:flex;gap:0}
.tl-step{flex:1;position:relative;padding:0 18px}
.tl-step::before{content:"";position:absolute;top:7px;left:50%;width:100%;height:2px;background:linear-gradient(90deg,var(--gold-br),rgba(201,162,75,.12));z-index:0}
.tl-step:last-child::before{display:none}
.tl-node{position:relative;z-index:1;width:16px;height:16px;margin:0 auto 22px;border-radius:50%;background:var(--gold-br);box-shadow:0 0 0 6px rgba(201,162,75,.12)}
.tl-node::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--gold-br);animation:tlPing 1.9s cubic-bezier(0,0,.2,1) infinite}
.tl-step:nth-child(2) .tl-node::after{animation-delay:.55s}
.tl-step:nth-child(3) .tl-node::after{animation-delay:1.1s}
.tl-step:first-child .tl-node{background:#34D399;box-shadow:0 0 0 6px rgba(52,211,153,.15)}
.tl-step:first-child .tl-node::after{background:#34D399}
.tl-num{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--gold);margin-bottom:7px}
.tl-step h3{font-family:var(--body);font-size:18px;font-weight:600;line-height:1.55;letter-spacing:-.01em;margin-bottom:7px}
.tl-step p{font-size:14px;color:var(--mut);line-height:1.5;max-width:230px;margin:0 auto}
@keyframes tlPing{0%{transform:scale(1); opacity:.6} 70%,100%{transform:scale(2.6); opacity:0}}
@media(max-width:680px){
.tl-steps{flex-direction:column;max-width:420px;margin:0 auto}
.tl-step{flex:none;display:flex;gap:18px;text-align:left;padding:0 0 30px}
.tl-step::before{top:7px;left:7px;width:2px;height:100%;background:linear-gradient(180deg,var(--gold-br),rgba(201,162,75,.12))}
.tl-node{margin:3px 0 0}
.tl-step p{margin:0;max-width:none}
}
.qr-box small{font-size:12.5px;color:var(--mut-2)}
footer{padding:54px 0 30px;background:radial-gradient(900px 500px at 50% 110%, rgba(201,162,75,.10), transparent 62%), var(--ink-2)}
.foot-top{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;margin-bottom:40px}
.foot-brand{max-width:340px;display:flex;align-items:flex-start;gap:14px}
.foot-brand .brand{margin:0;flex:none}
.foot-brand .brand img:first-child{width:38px;height:38px;border-radius:10px;box-shadow:0 6px 16px -6px rgba(201,162,75,.5)}
.foot-brand .brand .wordmark{height:20px}
.foot-brand p{color:var(--mut);font-size:13.5px;line-height:1.5;margin:0}
.foot-cols{display:flex;gap:64px;flex-wrap:wrap}
/* h2, not h4 (FINDINGS.md item 2). The report suggested h4, but the heading
   immediately before the footer is h1 on 404 and h2 on nine other pages, so
   h4 still skipped a level on eleven of twelve. Going shallower never skips,
   so h2 is valid everywhere. font-weight and line-height are pinned because
   these sheets carry a bare h2{font-weight:600;line-height:1.05} that h4 was
   never subject to; inherit keeps the body ratio, which differs per sheet. */
.foot-col h2{font-family:var(--mono);font-size:11px;font-weight:700;line-height:inherit;letter-spacing:.16em;text-transform:uppercase;color:var(--mut);margin-bottom:14px}
.foot-col a{display:block;color:var(--mut);font-size:14.5px;padding:5px 0;transition:.2s}
.foot-col a:hover{color:var(--gold-br)}
.foot-bot{border-top:1px solid var(--line);padding-top:22px;display:flex;justify-content:space-between;align-items:center;gap:14px 24px;flex-wrap:wrap;font-size:13px;color:var(--mut)}
.fb-left{display:flex;align-items:center;gap:10px 18px;flex-wrap:wrap}
.fb-links{display:inline-flex;align-items:center}
.fb-links a{color:var(--mut);transition:color .2s}
.fb-links a:hover{color:var(--text)}
.fb-links a + a{margin-left:18px;position:relative}
.fb-links a + a::before{content:"·";position:absolute;left:-11px;color:var(--mut)}
@media(max-width:640px){
.foot-bot{flex-direction:column;align-items:flex-start;gap:12px}
.fb-left{flex-direction:column;align-items:flex-start;gap:10px}
}
.foot-note{font-size:12px;color:var(--mut);margin-top:16px;font-style:italic}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
.price{opacity:0;filter:blur(10px);transform:translateY(6px);will-change:opacity,filter}
.reveal.in .price{animation:priceIn .85s cubic-bezier(.22,.61,.36,1) .28s forwards}
@keyframes priceIn{to{opacity:1; filter:blur(0); transform:none}}
@media(prefers-reduced-motion:reduce){
.price{opacity:1;filter:none;transform:none}
.reveal.in .price{animation:none}
}
@media(max-width:880px){
.hero-grid,.sg-grid,.cta-grid{grid-template-columns:1fr;gap:40px}
.feat-grid{grid-template-columns:1fr}
.hero{padding-top:120px}
.cta-grid{padding:32px}
.sg-grid{text-align:left}
}
@media(max-width:560px){
.phone{width:286px;height:626px}
.hero h1{font-size:clamp(34px,9vw,46px);margin:12px 0 4px}
.hero .free{font-size:23px;margin-bottom:14px}
.hero p.lede{font-size:16.5px;margin-bottom:24px}
.mgmt-cta{display:none}
.sg-badge{font-size:11px;letter-spacing:.12em;padding:7px 13px}
.sg-badge em{display:none}
.section{padding:72px 0}
.hw-shots{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.hw-fig>img{width:min(calc(100vw - 36px),460px);height:auto;max-height:none}
.hw-refl{display:none}
.sg-stack{margin-top:24px}
.foot-top{flex-direction:column;gap:34px}
.foot-cols{gap:48px}
.col h3{font-size:27px}
.wrap{padding:0 20px}
}
.nav-links{gap:34px}
.nav-links a{position:relative;font-size:15px;font-weight:500;color:var(--mut);letter-spacing:.005em;padding:2px 0;transition:color .22s}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:2px;border-radius:2px;background:var(--gold-br);transform:scaleX(0);transform-origin:50% 50%;opacity:0;transition:transform .3s cubic-bezier(.2,.7,.2,1),opacity .25s}
.nav-links a:hover{color:var(--text)}
.nav-links a:hover::after{transform:scaleX(.55);opacity:.45}
.nav-links a.active{color:var(--gold-br)}
.nav-links a.active::after{transform:scaleX(1);opacity:1;box-shadow:0 0 9px rgba(228,197,112,.55)}
.nav-cta{gap:22px}
.nav-cta .contact-link{font-size:15px;font-weight:500;color:var(--mut);transition:color .22s}
.nav-cta .contact-link:hover{color:var(--text)}
.menu-btn{display:none;width:42px;height:42px;border-radius:11px;border:1px solid var(--line-2);background:rgba(255,255,255,.04);color:var(--text);align-items:center;justify-content:center;cursor:pointer;transition:.2s;padding:0}
.menu-btn:hover{background:rgba(255,255,255,.08)}
.menu-btn svg{width:20px;height:20px}
.mobile-panel{display:none;position:fixed;top:64px;left:14px;right:14px;z-index:49;background:rgba(20,26,38,.97);backdrop-filter:blur(16px);border:1px solid var(--line-2);border-radius:16px;padding:14px;flex-direction:column;gap:2px}
.mobile-panel.open{display:flex}
.mobile-panel a{padding:12px 14px;border-radius:10px;font-weight:500;color:var(--mut)}
.mobile-panel a:hover{background:rgba(255,255,255,.05);color:var(--text)}
.mobile-panel a.active{color:var(--gold-br)}
.mobile-panel .btn{margin-top:8px;justify-content:center;color:#1a1505}
@media(max-width:820px){
.menu-btn{display:flex}
.nav-cta{display:none}
}
.nav-cta .contact-link{font-family:var(--body);font-size:14.5px;font-weight:500;color:var(--mut);transition:color .2s}
.nav-cta .contact-link:hover{color:var(--text)}
.nav-links{gap:34px}
@media(max-width:820px){
.nav-cta .contact-link{display:none}
}
footer .foot-brand{max-width:360px;display:block}
footer .foot-brand .brand{display:inline-flex;align-items:center;margin:0 0 14px}
footer .foot-brand .brand img.wordmark{width:auto!important;height:24px!important;border-radius:0!important;box-shadow:none!important}
footer .foot-brand .brand .sub{display:none}
footer .foot-brand p{margin:0}
.stores{align-items:center;gap:14px}
.store-icon{height:50px;width:auto;flex:none;filter:drop-shadow(0 6px 16px rgba(0,0,0,.42))}
.store-badges{display:flex;gap:12px;flex-wrap:wrap}
@media(max-width:560px){
.stores{flex-wrap:nowrap;gap:10px}
.store-badges{flex-wrap:nowrap;gap:8px;min-width:0}
.store{padding:8px 10px;gap:6px;min-width:0}
.store>div{min-width:0}
.store svg{width:18px;height:18px}
.store small{font-size:8.5px;white-space:nowrap}
.store b{font-size:13px;white-space:nowrap}
.store-icon{height:44px}
}
.trust-strip{display:flex;flex-wrap:wrap;gap:9px;margin-top:6px}
.trust-strip .tchip{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:10px;background:var(--gold-soft);border:1px solid rgba(201,162,75,.35);font-family:var(--disp);font-weight:500;font-size:13px;letter-spacing:.005em;color:var(--gold-br)}
.trust-strip .tchip svg{width:15px;height:15px;color:var(--gold-br);flex:none}
@media(max-width:560px){
.trust-strip{gap:8px}
.trust-strip .tchip{padding:7px 11px;font-size:12.5px}
}
.trust-strip .tchip{position:relative;overflow:hidden}
.trust-strip .tchip::after{content:"";position:absolute;top:0;left:-70%;width:42%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);transform:skewX(-20deg);animation:shimmer 5.5s ease-in-out infinite;pointer-events:none}
.trust-strip .tchip:nth-child(1)::after{animation-delay:1s}
.trust-strip .tchip:nth-child(2)::after{animation-delay:1.22s}
.trust-strip .tchip:nth-child(3)::after{animation-delay:1.44s}
.trust-strip .tchip:nth-child(4)::after{animation-delay:1.66s}
#nav .nav-links{font-size:16.5px;font-weight:400}
#nav .nav-links a{font-size:16.5px;font-weight:400;position:relative}
#nav .nav-cta .contact-link,#nav .contact-link{font-size:16.5px;font-weight:400}
#nav .nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:2px;border-radius:2px;background:var(--gold-br);transform:scaleX(0);transform-origin:50% 50%;opacity:0;transition:transform .3s cubic-bezier(.2,.7,.2,1),opacity .25s}
#nav .nav-links a:hover::after{transform:scaleX(.55);opacity:.45}
#nav .nav-links a.active::after{transform:scaleX(1);opacity:1;box-shadow:0 0 9px rgba(228,197,112,.55)}
@media(min-width:821px){
#nav .nav-links{position:absolute;left:50%;transform:translateX(-50%)}
}
#nav .nav-links a::after{background:linear-gradient(94deg,var(--gold-br),#F6E2A0);transform-origin:0 50%;transition:transform .38s cubic-bezier(.22,.61,.36,1), opacity .3s}
#nav .nav-links a:hover::after{transform:scaleX(1);opacity:.85}
#nav .btn-gold{padding:10px 18px;border-radius:10px;font-size:14px}
#nav .btn-gold,#nav .nav-sales-m{background:rgba(201,162,75,.18);color:var(--gold-br);border:1px solid transparent;box-shadow:none;font-weight:500}
#nav .btn-gold:hover,#nav .nav-sales-m:hover{background:var(--gold);color:#1a1505;border-color:transparent}
#nav.nav{transition:background .3s ease, border-color .3s ease, padding .3s ease, box-shadow .3s ease}
#nav.scrolled{background:rgba(14,18,27,.7);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);border-bottom:1px solid rgba(255,255,255,.09);padding-top:10px;padding-bottom:10px}
.mobile-panel{top:70px;left:12px;right:12px;background:rgba(15,20,30,.9);backdrop-filter:blur(24px) saturate(1.4);-webkit-backdrop-filter:blur(24px) saturate(1.4);border:1px solid rgba(255,255,255,.09);border-radius:18px;padding:6px 22px;gap:0;box-shadow:0 32px 64px -24px rgba(0,0,0,.65)}
.mobile-panel.open{animation:mpIn .3s cubic-bezier(.22,.61,.36,1) both}
@keyframes mpIn{from{opacity:0; transform:translateY(-10px)}to{opacity:1; transform:none}}
.mobile-panel a{padding:16px 2px;border-radius:0;font-weight:400;font-size:15.5px;letter-spacing:.01em;color:var(--text);border-bottom:1px solid rgba(255,255,255,.06);background:none}
.mobile-panel a:hover{background:none;color:var(--gold-br)}
.mobile-panel a.active{color:var(--gold-br)}
.mobile-panel a.btn.btn-gold{margin:0;padding:16px 2px;background:none;border:none;border-radius:0;color:var(--gold-br);font-weight:600;font-size:15.5px;justify-content:space-between;overflow:visible;box-shadow:none}
.mobile-panel a.btn.btn-gold::after{content:"\2192";position:static;width:auto;height:auto;background:none;transform:none;animation:none;font-weight:400}
.mobile-panel::before{content:"";position:fixed;inset:0;z-index:-1;background:rgba(10,13,19,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.mobile-panel .mp-eyebrow{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-br);opacity:.8;padding:12px 2px 4px}
.mobile-panel a{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.mobile-panel a .mp-d{font-size:12px;color:var(--mut-2,var(--mut));font-weight:400}
.mobile-panel a.btn.btn-gold{flex-direction:row;align-items:center}
.mobile-panel.open>*{animation:mpItem .38s cubic-bezier(.22,.61,.36,1) both}
.mobile-panel.open>*:nth-child(1){animation-delay:.03s}
.mobile-panel.open>*:nth-child(2){animation-delay:.07s}
.mobile-panel.open>*:nth-child(3){animation-delay:.11s}
.mobile-panel.open>*:nth-child(4){animation-delay:.15s}
.mobile-panel.open>*:nth-child(5){animation-delay:.19s}
.mobile-panel.open>*:nth-child(6){animation-delay:.23s}
@keyframes mpItem{from{opacity:0; transform:translateY(7px)}to{opacity:1; transform:none}}
.mobile-panel a:last-of-type{border-bottom:none}
.mobile-panel{padding:8px 20px 4px}
.mobile-panel::after{content:"";position:absolute;top:0;left:20px;right:20px;height:1px;background:linear-gradient(90deg,transparent,rgba(228,197,112,.55),transparent)}
.mobile-panel a{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:14px;padding:13px 2px}
.mobile-panel a::after{content:"\203A";font-size:19px;line-height:1;color:var(--mut-2,var(--mut));opacity:.55;padding-right:2px}
.mobile-panel .mp-ic{width:38px;height:38px;border-radius:11px;background:var(--gold-soft,rgba(201,162,75,.13));border:1px solid rgba(201,162,75,.28);display:flex;align-items:center;justify-content:center}
.mobile-panel .mp-ic svg{width:17px;height:17px;color:var(--gold-br)}
.mobile-panel .mp-tx{display:flex;flex-direction:column;gap:2px}
.mobile-panel .mp-t{font-family:var(--disp);font-weight:500;font-size:16.5px;letter-spacing:-.01em;color:var(--text)}
.mobile-panel .mp-d{font-size:12px;color:var(--mut-2,var(--mut));font-weight:400}
.mobile-panel a.active .mp-t{color:var(--gold-br)}
.mobile-panel a.active .mp-ic{border-color:rgba(228,197,112,.6);box-shadow:0 0 14px -4px rgba(228,197,112,.5)}
.mobile-panel .mp-foot{font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--mut);padding:13px 2px 12px;border-top:1px solid rgba(255,255,255,.06)}
@media(prefers-reduced-motion:reduce){
.mobile-panel.open>*{animation:none}
}
@media(max-width:640px){
footer .foot-brand .brand{display:none}
footer .foot-brand::before{content:"Schonell";display:block;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-br);margin-bottom:14px}
footer .foot-brand p{font-size:14.5px;line-height:1.7;color:var(--mut);margin:0}
footer .foot-brand p br{display:none}
footer .foot-top{margin-bottom:38px;gap:38px}
footer .foot-cols{display:grid;grid-template-columns:auto auto auto;gap:28px 22px;width:100%;justify-content:space-between}
footer .foot-col h2{white-space:nowrap}
footer .foot-bot{gap:14px}
footer .foot-bot>span{font-size:11.5px;letter-spacing:.02em;color:var(--mut);line-height:1.7}
footer .fb-left{display:flex;flex-direction:column;gap:8px;font-size:11.5px}
footer .foot-note{font-style:normal;font-size:11px;opacity:.6;margin-top:12px}
footer .foot-bot{border-top:0;position:relative}
footer .foot-bot::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(228,197,112,.45),transparent)}
}
@media(min-width:641px){
footer{padding:72px 0 34px}
footer .foot-brand .brand{display:none}
footer .foot-brand::before{content:"Schonell";display:block;font-family:var(--mono);font-size:11.5px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-br);margin-bottom:16px}
footer .foot-top{margin-bottom:48px}
footer .foot-cols{gap:88px}
footer .foot-brand p{max-width:44ch}
footer .foot-bot{border-top:0;position:relative;padding-top:26px}
footer .foot-bot::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(228,197,112,.4),transparent)}
footer .foot-note{font-style:normal;font-size:11.5px;opacity:.65}
}
@media(max-width:820px){
/* Side padding is half the leftover width, so the first and last cards can
   actually reach the centre. With scroll-snap-align:center and a fixed side
   padding they cannot: centring the first card needs a negative scrollLeft,
   so mandatory snapping pushes it back and only the middle card is ever
   reachable. The basis is in vw rather than % because a percentage basis
   resolves against the content box, which this padding is what sets — the
   two would chase each other.

   width:100vw and min-width:0 are not optional company for that basis. A
   vw-sized child does not shrink with its container, so the row's automatic
   minimum size grows to fit all three cards and pushes the whole page wider
   — the home page scrolled sideways by 134px until these were added.
   .phone-stage in schonell-app.css already carried all of this; these did
   not. Copy that rule, not this comment, if you add another one. */
.life-grid{display:flex;width:100vw;min-width:0;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:16px;scrollbar-width:none;margin:0 calc(50% - 50vw) -48px;padding:0 8vw 48px}
.life-grid::-webkit-scrollbar{display:none}
.life{flex:0 0 84vw;scroll-snap-align:center}
}
.nav-sales-m{display:none}
.nav-sales-m .s-short{display:none}
@media(max-width:820px){
.nav-sales-m{display:inline-flex;align-items:center;margin-left:auto;margin-right:12px;padding:10px 16px;font-size:14px;border-radius:10px}
}
@media(max-width:380px){
.nav-sales-m{margin-right:10px;padding:9px 13px;font-size:13px}
.nav-sales-m .s-long{display:none}
.nav-sales-m .s-short{display:inline}
}
.mp-sec{position:relative;overflow:hidden;padding-bottom:40px}
.mp-glow{position:absolute;top:2%;left:50%;transform:translateX(-50%);width:1120px;max-width:120vw;height:720px;pointer-events:none;z-index:0;background:radial-gradient(ellipse at center, rgba(201,162,75,.18), transparent 62%);filter:blur(28px)}
.mp-glow.two{top:34%;width:760px;height:620px;background:radial-gradient(ellipse at center, rgba(120,150,210,.10), transparent 62%)}
.mp-head{position:relative;z-index:1;max-width:720px;margin:0 auto;text-align:center}
.mp-head h2{font-family:var(--disp);font-weight:600;letter-spacing:-.02em;font-size:clamp(30px,4vw,50px);line-height:1.03;margin:16px 0 0}
.mp-head .lede2{color:var(--mut);font-size:clamp(16px,1.5vw,18.5px);line-height:1.6;margin:20px auto 0;max-width:600px}
.mp-head .lede2 strong{color:var(--gold-br);font-weight:600}
.mp-cta-row{margin-top:30px;display:flex;gap:16px;flex-wrap:wrap;align-items:center;justify-content:center}
.mp-incl{display:inline-flex;align-items:center;gap:9px;padding:9px 16px;border-radius:30px;border:1px solid rgba(201,162,75,.35);background:var(--gold-soft);font-family:var(--mono);font-weight:500;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-br)}
.mp-incl .dot{width:7px;height:7px;border-radius:50%;background:var(--gold-br)}
.mp-chips{margin:26px auto 0;display:flex;gap:9px;flex-wrap:wrap;justify-content:center;position:relative;z-index:1}
.mp-chips span{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:30px;border:1px solid var(--line-2);background:rgba(255,255,255,.03);font-family:var(--disp);font-size:13px;color:var(--mut)}
.mp-chips span i{width:6px;height:6px;border-radius:50%;background:var(--gold);opacity:.75}
.mp-stage{position:relative;z-index:1;margin-top:56px}
.mp-win{--ok:#42C182;max-width:1140px;margin:0 auto;border-radius:14px;overflow:hidden;border:1px solid var(--line-2);background:var(--ink-2);box-shadow:0 56px 120px -48px rgba(0,0,0,.92);transform-origin:50% 0%;transform:scale(.985);opacity:.85;transition:transform 1.15s cubic-bezier(.2,.7,.2,1), opacity 1.15s ease;will-change:transform}
.mp-win.in{transform:scale(1);opacity:1}
.mp-bar{display:flex;align-items:center;gap:8px;padding:12px 16px;background:rgba(255,255,255,.03);border-bottom:1px solid var(--line)}
.mp-bar .tl{display:flex;gap:7px}
.mp-bar .tl i{width:11px;height:11px;border-radius:50%;background:#3a4152}
.mp-bar .url{margin:0 auto;font-family:var(--mono);font-size:12px;color:var(--mut-2);background:var(--ink);border:1px solid var(--line);border-radius:8px;padding:5px 20px;display:flex;align-items:center;gap:8px}
.mp-bar .url svg{width:12px;height:12px;color:var(--gold)}
.mp-bar .live{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);flex:none}
.mp-bar .live i{width:7px;height:7px;border-radius:50%;background:#42C182;box-shadow:0 0 8px rgba(66,193,130,.8)}
.mp-frame{position:relative;width:100%;background:var(--ink)}
.mp-frame iframe{display:block;width:100%;height:720px;border:0;background:var(--ink)}
.mp-hint{margin:20px auto 0;text-align:center;font-size:13px;color:var(--mut-2);position:relative;z-index:1}
@media(max-width:860px){
.mp-stage{margin-top:40px;perspective:none}
.mp-win{transform:none!important;opacity:1!important}
.mp-frame iframe{height:640px}
}
@media(max-width:560px){
.mp-frame iframe{height:560px}
}
@media(max-width:359px){
.hero .sg-badge{font-size:11px;letter-spacing:.12em;padding:8px 13px}
}
@media(min-width:821px){
.nav{padding-left:40px;padding-right:40px}
}
.sg-badge{display:inline-flex;align-items:baseline;gap:0;padding:0;border:0;background:none;border-radius:0;overflow:visible;font-size:12px;letter-spacing:.2em}
.sg-badge .dot{display:none}
.sg-badge::after{content:none}
.sg-badge em{font-style:normal;margin-left:15px;padding-left:16px;position:relative;letter-spacing:.2em}
.sg-badge em::before{content:"";position:absolute;left:0;top:.1em;bottom:.1em;width:1px;background:currentColor;opacity:.38}
@media(max-width:359px){
.hero .sg-badge{padding:0;font-size:12px;letter-spacing:.2em}
}
@media(min-width:861px){
.hero-grid{align-items:start}
}
.gal-sec,.sg-sec{background:none;position:relative;z-index:0}
.gal-sec::before,.sg-sec::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 120px,#000 calc(100% - 120px),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 120px,#000 calc(100% - 120px),transparent 100%)}
.gal-sec::before{background:radial-gradient(820px 640px at 84% 22%, rgba(201,162,75,.10), transparent 60%)}
.sg-sec::before{background:radial-gradient(820px 640px at 16% 64%, rgba(201,162,75,.10), transparent 60%)}
.marquee-sec{background:none}
@supports not (mask-image:linear-gradient(#000,#000)){
.gal-sec::before,.sg-sec::before{opacity:.6}
}
.marquee .track{--mq-shift:50%;will-change:transform;backface-visibility:hidden}
@keyframes marqueeSlide{to{transform:translateX(calc(var(--mq-shift) * -1))}}

/* Mobile only: the app screens in #screens are sized to exactly what the same
   screenshots render at on the home page, so the two pages do not show the app
   at two different sizes. Same values, same breakpoints as .fl-ph there — see
   the note in index.css. 820px is .sc-phone's unscaled height and the decimals
   are its scale() steps; change one page's and change the other's.

   Height is set on the <img> rather than the <figure>, because the figure also
   holds the caption. Width comes from the height at the screenshots' own 2.4131
   proportion, so these are scaled and never stretched. object-fit:cover trims
   about 1% off the few screenshots exported at a slightly different size, which
   is what keeps all fourteen exactly level.

   #screens is a JS-driven belt, but it measures its own layout on load and on
   resize, so it picks these widths up on its own. */
@media (max-width:730px){
  #screens .ph{--ph-h:calc(820px * .635);--ph-w:calc(var(--ph-h) / 2.4131);width:var(--ph-w)}
  #screens .ph img{height:var(--ph-h);object-fit:cover}
  @media (max-width:389px){#screens .ph{--ph-h:calc(820px * .586)}}
  @media (min-width:431px) and (max-width:560px){#screens .ph{--ph-h:calc(820px * .697)}}
  @media (min-width:561px) and (max-width:720px){#screens .ph{--ph-h:calc(820px * .909)}}
  @media (min-width:721px) and (max-width:730px){#screens .ph{--ph-h:calc(820px * .738)}}
}

/* ---------------------------------------------------------------------------
   No-JavaScript fallback.

   Reveal-on-scroll, the FAQ accordions, the feature rows and the staggered hero
   copy all start hidden and are uncovered by script. With scripting off or
   broken that left every page blank below the hero — 127 FAQ paragraphs and 25
   reveal blocks on the home page alone, and nothing said so.

   These undo the hidden state. The .js class is set in the <head> by build.js,
   so none of this applies when a script actually ran. Decorative things that
   start at opacity 0 — spinners, glows, hover underlines, the demo mockups —
   are deliberately left alone: the point is that the page reads, not that the
   animations are simulated.
   --------------------------------------------------------------------------- */
html:not(.js) .rv,
html:not(.js) .reveal,
html:not(.js) .frow,
html:not(.js) .blur-in,
html:not(.js) .faq-item,
html:not(.js) .pp-fig,
html:not(.js) .faq-a p,
html:not(.js) .rv h2,
html:not(.js) .list-intro,
html:not(.js) .trust-strip,
html:not(.js) .hero-ctas,
html:not(.js) .tier-note h3,
html:not(.js) .price,
html:not(.js) .sg-stack li,
html:not(.js) .ph figcaption span,
html:not(.js) .hs-eyebrow,
html:not(.js) .hs-copy .lede,
html:not(.js) .hs-copy .hv-ctas,
html:not(.js) .hs-lede-m,
html:not(.js) .hs-copy h1 .hl>span,
html:not(.js) .hv-line.l2{opacity:1!important;transform:none!important;filter:none!important;animation:none!important}
html:not(.js) .faq-a{grid-template-rows:1fr}

/* Skip link and the main landmark (see AGENTS.md).
   Off-screen rather than display:none, so it stays in the tab order and can be
   reached by the very first Tab press; it flies in on focus. #main takes
   tabindex="-1" so following the link actually moves focus, not just the
   viewport, and the scroll-margin keeps the fixed nav off the heading. */
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;padding:12px 20px;background:#0E121B;color:#E4C570;border:1px solid currentColor;border-radius:0 0 10px 0;font-size:15px;font-weight:600;line-height:1;text-decoration:none}
.skip-link:focus{left:0}
#main{scroll-margin-top:90px}
#main:focus{outline:none}

/* Tap targets on touch devices (TCH-04).
   The footer's column links measured 33px and the Privacy/Terms pair 14px,
   against the 44px WCAG asks for. Padding rather than height, so the footer
   keeps its proportions on a pointer device — where these are fine already. */
@media (hover:none){
  footer .foot-col a{padding-block:11px}
  footer .fb-links a{display:inline-block;padding-block:15px}
}

/* The drawer's second group heading (see index.css note). */
.mp-eyebrow-2{margin-top:14px}