/* Approved light homepage and responsive enhancements. */
.customer-proof{padding:32px 48px 38px;background:#fff;border-bottom:1px solid #20242a14}
.customer-proof-inner{max-width:1160px;margin:0 auto;container-type:inline-size}
body:is(.light-theme,.dark-mode) .customer-proof h2{font-family:'Hanken Grotesk',sans-serif!important;font-size:16px!important;line-height:1.4!important;letter-spacing:0!important;font-weight:400!important;color:#606976;text-align:center;margin:0 0 28px}
.customer-proof h2 strong{color:#20242a;font-weight:600}
.customer-proof-logos{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:center;gap:24px;max-width:1200px;margin:0 auto}
.customer-brand{display:flex;align-items:center;justify-content:center;min-height:96px}
.brand-art{height:96px;width:100%;display:flex;align-items:center;justify-content:center;position:relative}
.customer-brand .brand-caption{font:500 12px/1.4 'Hanken Grotesk',sans-serif;color:#454c56;margin-top:14px;text-align:center}
.brand-pausa{font:500 28px/1 'Hanken Grotesk',sans-serif;letter-spacing:-.04em;color:#272b30;white-space:nowrap}
.customer-brand img{width:var(--logo-width,160px)!important;height:auto!important;max-width:calc(100% - 4px)!important;flex:none;object-fit:contain;filter:none;opacity:1;transform:translate(var(--logo-x,0px),var(--logo-y,0px))}
.customer-brand img.brand-dipndip{height:50px;max-width:172px}
.customer-brand>span{font:11px 'Hanken Grotesk',sans-serif;color:#606976;margin-top:6px}
.customer-brand img.brand-trimology{--logo-width:174px;--logo-x:-2px;--logo-y:1px}
.customer-brand img.brand-doctor{height:64px;width:64px;border-radius:50%}
.customer-brand img.brand-nestle{--logo-width:118px;--logo-x:1px;filter:none}
.customer-brand img.brand-saoud{--logo-width:196px;--logo-x:-3px;--logo-y:-1px;background:transparent;padding:0}
.customer-brand img.brand-dama{--logo-width:162px;--logo-x:1px;background:transparent;border-radius:0;padding:0}
.customer-brand img.brand-pausa{--logo-width:160px;--logo-y:-1px;border-radius:0}
.customer-brand img.brand-balaam{max-width:175px;filter:brightness(0)}
.customer-brand img.brand-medsky{max-width:180px;height:65px}
.customer-brand img.brand-bella{--logo-width:160px;--logo-x:1px}
.customer-brand img.brand-yasmeen{max-width:165px;height:76px}
.customer-brand img.brand-alkateb{max-width:180px;height:76px;filter:brightness(.28)}
@media(min-width:761px) and (max-width:1279px){.customer-proof-logos{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 36px;max-width:900px}.customer-proof{padding-left:32px;padding-right:32px}}
@container(max-width:1099px){.customer-proof-logos{grid-template-columns:repeat(3,minmax(0,1fr))}}
.integrations-caption{text-align:center;font:400 12px 'Hanken Grotesk',sans-serif;color:#606976;padding:20px 24px 0;margin:0}
@media(max-width:760px){
 .customer-proof{padding:28px 20px 30px}.customer-proof-logos{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 18px;max-width:560px}
 .customer-brand{min-height:64px}.brand-art{height:64px}
 .customer-brand img.brand-bella{--logo-width:99px}.customer-brand img.brand-pausa{--logo-width:99px}
 .customer-brand img.brand-trimology{--logo-width:108px}.customer-brand img.brand-nestle{--logo-width:76px}
 .customer-brand img.brand-saoud{--logo-width:122px}.customer-brand img.brand-dama{--logo-width:101px}
}
@media(max-width:360px){.customer-proof{padding-left:14px;padding-right:14px}.customer-proof-logos{gap:12px}.customer-brand img{scale:.9}}
body.dark-mode .customer-proof{background:#16181b;border-color:rgba(255,255,255,.1)}
body.dark-mode .customer-proof h2{color:#b9bfc7!important}
body.dark-mode .customer-proof h2 strong{color:#fafafa}
body.dark-mode .customer-proof img:is(.brand-bella,.brand-pausa,.brand-saoud,.brand-dama){filter:grayscale(1) brightness(0) invert(1)}
body.dark-mode .customer-brand:has(.brand-bella){--bella-width:160px}
body.dark-mode .customer-brand:has(.brand-bella) .brand-art::after{content:'';position:absolute;left:50%;top:50%;width:min(var(--bella-width),calc(100% - 4px));aspect-ratio:480/150;transform:translate(calc(-50% + 1px),-50%);background:url('/.netlify/images?url=%2Fassets%2Fcustomers%2Fbella-mia.png&w=400&fm=webp&q=88') center/contain no-repeat;clip-path:inset(0 70% 0 0);pointer-events:none}
@media(max-width:760px){body.dark-mode .customer-brand:has(.brand-bella){--bella-width:99px}}
body.light-theme{
 --bg:#fff;--bg2:#fff;--bg3:#fafafa;--surface:#fff;--surface2:#fff;
 --text:#20242a;--text2:#454c56;--text3:#606976;--border:rgba(32,36,42,.10);
 --border2:rgba(32,36,42,.18);--line:rgba(32,36,42,.06);
 --brand:#b93f24;--brand-mid:#b93f24;--brand-dark:#8c2e19;
 --brand-light:rgba(185,63,36,.06);--brand-border:rgba(185,63,36,.22);--brand-glow:rgba(185,63,36,.14);
 background:#fff;color:var(--text);color-scheme:light;
}
body.light-theme #hero{background:#fff!important;border-bottom:1px solid var(--border)}
body.light-theme #hero::before{background:#fff!important;opacity:1!important}
body.light-theme #hero::after{opacity:.14}
body.light-theme .kh-h1 .num{color:#b93f24}
/* Use the hero's heading family throughout the landing-page hierarchy. */
body.light-theme :is(h2,h3,h4,h5,h6,.sec-title,.feat-title,.plan-name,.comp-title,.card-type-name,.ease-step-title,.plan-custom-title,.plan-annual-includes-heading,.plan-not-sure-title,.roi-report-title,.modal-title,.trial-title,.cpanel-name){
 font-family:'Hanken Grotesk','Helvetica Neue',Helvetica,Arial,sans-serif!important;
 font-weight:600!important;font-style:normal;letter-spacing:-.025em!important;
}
body.light-theme .kh-primary-cta{background:#b93f24!important;color:#fff!important;box-shadow:0 8px 22px #b93f2426}
body.light-theme nav,body.light-theme #mainNav.scrolled{background:rgba(255,255,255,.96)!important;box-shadow:0 1px 0 var(--border)!important}
body.light-theme .trust-cards-wrap{background:#fff;border-bottom:1px solid var(--border)}
body.light-theme .trust-check-item{color:#454c56}
body.light-theme .trust-check-item strong{color:#a73820}
body.light-theme .trust-check-icon{filter:brightness(.65)}
body.light-theme .glass-band{background:#fff!important;border-color:var(--border)}
body.light-theme .glass-band::before{background:none!important}
/* Replace atmospheric orange blobs with crisp surfaces and neutral elevation. */
body.light-theme{--brand-glow:rgba(32,36,42,.10)}
body.light-theme :is(#features,#systems,.glass-band,.alt-bg,.system-section,.howit-section,.cta-sec,.mobile-menu,.stat-card,.howit-phone-3d,.wsl-phone-wrap)::before{background:none!important;box-shadow:none!important;filter:none!important}
body.light-theme .wburst{display:none}
body.light-theme #features .feat-card,
body.light-theme #features .feat-card:hover,
body.light-theme #systems .card-type,
body.light-theme #systems .card-type:hover,
body.light-theme .feat-card-ai,
body.light-theme .feat-card-ai:hover,
body.light-theme .comp-card.featured,
body.light-theme .plan-custom{
 background:#fff!important;border:1px solid var(--border)!important;
 box-shadow:0 4px 18px rgba(32,36,42,.045)!important;
 backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
body.light-theme #features .feat-card:hover,
body.light-theme #systems .card-type:hover{border-color:var(--border2)!important;box-shadow:0 8px 24px rgba(32,36,42,.08)!important}
body.light-theme .howit-dash-mock,body.light-theme .sys-dashboard{background:#fff!important;border-color:var(--border)!important;box-shadow:0 12px 32px rgba(32,36,42,.07)!important}
body.light-theme .kh-primary-cta,body.light-theme .kh-primary-cta:hover{box-shadow:0 5px 14px rgba(32,36,42,.12)!important}
body.light-theme .feat-card,body.light-theme .card-type{background:#fff;box-shadow:0 6px 24px #20242a05}
body.light-theme .nav-dd{box-shadow:0 14px 36px #20242a16}
body.light-theme footer{background:#fff}
body.light-theme .cta-sec{background:#fff;border-color:var(--brand-border)}
body.light-theme .chat-box,body.light-theme .flann-panel{background:#fff;box-shadow:0 24px 60px #20242a20}
body.light-theme .flann-overlay{background:rgba(32,36,42,.25)}
body.light-theme .flann-input,body.light-theme .flann-sug{background:#f2f4f7;color:#20242a}
body.light-theme .modal-overlay{background:rgba(32,36,42,.32)}
body.light-theme .ck-banner{background:#fff;border-top:1px solid var(--border);box-shadow:0 -4px 24px #20242a08} body.light-theme .ck-text,body.light-theme .ck-text a,body.light-theme .ck-btn.ck-ghost{color:#454c56} body.light-theme .ck-btn.ck-ghost{border-color:var(--border2)} body.light-theme #tweaksFab,body.light-theme #omTweaks{display:none!important}
/* Dark product walkthrough and footer frame white content and pricing. */
body.light-theme #howitworks,body.light-theme footer{
 --bg:#111315;--bg2:#191c20;--bg3:#23272c;--surface:#191c20;--surface2:#23272c;
 --text:#fafafa;--text2:#d1d5da;--text3:#a7afb9;
 --border:rgba(255,255,255,.13);--border2:rgba(255,255,255,.23);
 --brand:#ee896d;--brand-mid:#b93f24;--brand-light:rgba(238,137,109,.10);
 --brand-border:rgba(238,137,109,.3);--brand-glow:rgba(0,0,0,.12);
 --green:#86dda6;--plan-green:#86dda6;--plan-green-light:rgba(134,221,166,.06);--plan-green-border:rgba(134,221,166,.38);
 background:#111315!important;color:var(--text);border-color:var(--border);
}
body.light-theme #howitworks{border-top:1px solid #292d32;border-bottom:1px solid #292d32}
body.light-theme #howitworks .hiw-step:not(.is-active){opacity:.7}
body.light-theme #howitworks .hiw-step.is-active .hiw-step-num{background:#b93f24;border-color:#b93f24;box-shadow:none}
body.light-theme #howitworks .hiw-rail-fill{box-shadow:none}
body.light-theme #howitworks .hiw-mtab[aria-selected="true"]{background:#b93f24}
body.light-theme footer .logo-img-light{display:none}
body.light-theme footer .logo-img-dark{display:block}
body.light-theme .cta-sec{border-top:1px solid var(--border)}
/* Welcoming plan actions and concrete reassurance, shared across both themes. */
body #pricing .plans-three .plan-btn{background:#216f43!important;border-color:#216f43!important;color:#fff!important;opacity:1;box-shadow:0 4px 12px rgba(15,68,39,.12);font-family:'Hanken Grotesk',sans-serif;font-size:15px;font-weight:600;letter-spacing:0;text-transform:none;text-decoration:none;min-height:48px;display:flex;align-items:center;justify-content:center}
body #pricing .plans-three .plan-btn:hover{background:#195b36!important;border-color:#195b36!important;box-shadow:0 6px 16px rgba(15,68,39,.18);transform:translateY(-1px)}
body #pricing .plans-three .plan-btn:focus-visible{outline:3px solid #6ebf90;outline-offset:4px}
body #pricing .plans-three .plan{display:flex;flex-direction:column}
body #pricing .plans-three [id$="Feats"]{flex:1}
.pricing-reassurance{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin:30px 0 0;padding:26px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.pricing-reassurance>div{display:flex;align-items:flex-start;gap:12px}
.pricing-trust-check{width:27px;height:27px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;background:#eaf5ee;color:#216f43;font:600 15px 'Hanken Grotesk',sans-serif}
.pricing-reassurance strong{font:600 15px/1.4 'Hanken Grotesk',sans-serif;color:var(--text)}
.pricing-reassurance p{font:400 13px/1.55 'Hanken Grotesk',sans-serif;color:var(--text3);margin-top:5px}
.pricing-human-help{font:400 14px/1.6 'Hanken Grotesk',sans-serif;text-align:center;color:var(--text2);margin:22px 0 30px}
.pricing-human-help a{color:var(--text);text-decoration:underline;text-underline-offset:4px;font-weight:600;white-space:nowrap}
body.dark-mode .pricing-trust-check{background:#243c2e;color:#9fe2b7}
@media(max-width:680px){.pricing-reassurance{grid-template-columns:1fr;gap:20px;padding:24px 0}.pricing-human-help{max-width:30ch;margin-left:auto;margin-right:auto}}
/* Main navigation: shared geometry, readable labels, a single clear action. */
body #mainNav{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;height:80px!important;padding:0 max(28px,calc((100vw - 1240px)/2));gap:28px!important;border-bottom:1px solid var(--border);box-shadow:none!important}
body #mainNav .nav-logo{justify-self:start}.nav-logo:focus-visible{outline-offset:6px}
body #mainNav .nav-links{display:flex;justify-content:center;align-items:center;gap:6px!important;flex:none;margin:0;padding:0}
body #mainNav .nav-links>li>a,body #mainNav .nav-dd-btn{font-family:'Hanken Grotesk',sans-serif!important;font-size:14px!important;font-weight:500;letter-spacing:0!important;padding:11px 14px!important;line-height:1.3;color:var(--text2);border-radius:8px!important}
body #mainNav .nav-links>li>a:hover,body #mainNav .nav-dd-btn:hover,body #mainNav .nav-links>li>a.is-current{color:var(--text);background:rgba(100,110,120,.08)}
body #mainNav .nav-links .nav-dd-item{display:flex!important}
body #mainNav .nav-right{gap:16px!important;margin:0}.nav-right::before{display:none!important}
body #mainNav .nav-cta{background:#216f43!important;border-color:#216f43!important;color:#fff!important;box-shadow:none!important;border-radius:9px!important;font-family:'Hanken Grotesk',sans-serif;font-size:14px!important;font-weight:600;padding:12px 21px!important;letter-spacing:0!important;min-height:44px}
body #mainNav .nav-cta:hover{background:#195b36!important;opacity:1;transform:translateY(-1px)}
body #mainNav .nav-markets-btn{height:40px!important;border:none!important;background:transparent;font-family:'Hanken Grotesk',sans-serif;font-size:13px!important;padding:0 8px!important;color:var(--text3)}
body #mainNav .nav-dd{width:420px;min-width:0;padding:14px;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;left:50%;top:calc(100% + 16px);background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:0 20px 50px rgba(20,25,30,.13)}
body #mainNav .nav-dd-item.open .nav-dd{display:grid}
body #mainNav .nav-dd::before{content:'Find your business';grid-column:1/-1;font:500 11px/1.4 'Hanken Grotesk',sans-serif;color:var(--text3);padding:6px 12px 10px;letter-spacing:.06em;text-transform:uppercase}
body #mainNav .nav-dd a{font-family:'Hanken Grotesk',sans-serif;font-size:14px;padding:12px;border:none;border-radius:8px;color:var(--text2);text-decoration:none;white-space:normal}
body #mainNav .nav-dd a:hover{background:rgba(100,110,120,.09);color:var(--text)}
body #mainNav .nav-dd a:last-child{grid-column:1/-1}
body #mainNav .nav-markets-drop{background:var(--surface);border-color:var(--border);padding:6px;border-radius:12px;box-shadow:0 12px 35px rgba(20,25,30,.12)}
body #mainNav .nav-markets-drop a{font-family:'Hanken Grotesk',sans-serif;border-radius:6px;font-size:13px}
body #mainNav .hamburger{width:42px;height:42px;align-items:center;justify-content:center;border:1px solid var(--border);border-radius:9px;padding:10px;gap:5px}
body #mainNav .hamburger span{width:19px;height:1.5px}
body #mm{background:var(--bg)}body #mm::before,body #mm::after{display:none}
body #mm .mm-header,body #mm .mm-footer{background:var(--bg);border-color:var(--border)}
body #mm .mm-link{font-family:'Hanken Grotesk',sans-serif;font-size:19px;font-weight:500;padding:15px 0;letter-spacing:-.015em}
body #mm .mm-label{font-family:'Hanken Grotesk',sans-serif;font-size:11px;letter-spacing:.08em;color:var(--text3)}
body #mm .mm-cta{background:#216f43;color:#fff;border-color:#216f43;box-shadow:none;font-family:'Hanken Grotesk',sans-serif;letter-spacing:0;text-transform:none;font-size:16px;border-radius:10px}
@media(min-width:961px) and (max-width:1100px){body #mainNav{gap:14px!important;padding:0 24px}body #mainNav .nav-links>li>a,body #mainNav .nav-dd-btn{padding:10px 9px!important;font-size:13px!important}body #mainNav .nav-right{gap:8px!important}}
@media(max-width:960px){body #mainNav{height:72px!important;grid-template-columns:auto 1fr;padding:0 24px;gap:16px!important}body #mainNav .nav-links{display:none}body #mainNav .nav-right{justify-self:end;gap:12px!important}body #mainNav .nav-cta{display:inline-flex!important;align-items:center;justify-content:center;font-size:13px!important;padding:10px 16px!important}body #mainNav .nav-markets{display:none!important}}
@media(max-width:400px){body #mainNav{padding:0 16px}body #mainNav .nav-logo .logo-img-light{height:40px}body #mainNav .nav-logo .logo-img-dark{height:25px}body #mainNav .nav-right{gap:8px!important}body #mainNav .nav-cta{padding:10px 12px!important;font-size:12px!important}}
@media(max-width:359px){body #mainNav .nav-cta{display:none!important}}
/* Real supplied quotes, with clearly identified illustrative stock portraits. */
body #proof{background:var(--bg);padding-top:90px;padding-bottom:90px}
#proof .review-heading{max-width:700px;margin:0 auto 42px;text-align:center}
#proof .review-eyebrow{font:600 11px/1.4 'Hanken Grotesk',sans-serif;letter-spacing:.12em;color:var(--text3);margin-bottom:14px}
body #proof .sec-title{font-family:'Hanken Grotesk',sans-serif!important;font-weight:600;letter-spacing:-.035em;max-width:none;margin-bottom:16px}
#proof .review-intro{font:400 17px/1.6 'Hanken Grotesk',sans-serif;color:var(--text2);max-width:50ch;margin:0 auto}
body #proof .quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:0}
body #proof .quote{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:28px;box-shadow:0 5px 20px rgba(22,28,33,.035);transition:border-color .2s,box-shadow .2s}
body #proof .quote:hover{border-color:var(--border2);box-shadow:0 10px 28px rgba(22,28,33,.07);transform:none}
body #proof .quote-mark{font:500 48px/.8 Georgia,serif;color:#297b4e;height:32px;margin:0 0 14px;opacity:.75}
body #proof .quote-text{font-family:'Hanken Grotesk',sans-serif!important;font-size:18px!important;line-height:1.55!important;font-weight:400;letter-spacing:-.015em;color:var(--text);margin:0 0 26px;flex:1}
body #proof .quote-attr{border-top:1px solid var(--border);padding-top:20px;display:flex;align-items:flex-start;gap:14px;margin-top:auto}
#proof .q-portrait{margin:0;width:76px;flex:none;text-align:center}
#proof .q-portrait img{width:64px;height:64px;border-radius:50%;object-fit:cover;object-position:center 28%;display:block;margin:0 auto 6px;filter:saturate(.65)}
#proof .q-portrait figcaption{font:400 9px/1.3 'Hanken Grotesk',sans-serif;color:var(--text3);white-space:nowrap}
body #proof .q-name{font:600 15px/1.4 'Hanken Grotesk',sans-serif;color:var(--text);margin-top:9px;margin-bottom:4px}
body #proof .q-biz{font:400 12px/1.5 'Hanken Grotesk',sans-serif;color:var(--text3)}
body.dark-mode #proof .quote{background:#1e2023;border-color:rgba(255,255,255,.12)}
body.dark-mode #proof .quote-mark{color:#8ed2a7}
@media(max-width:1100px){body #proof .quotes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){body #proof{padding-top:60px;padding-bottom:60px}body #proof .quotes{grid-template-columns:1fr;gap:18px}body #proof .quote{padding:25px}body #proof .quote-text{font-size:18px!important}#proof .review-intro{font-size:15px}#proof .review-heading{margin-bottom:30px}}
/* Results must use theme colours, not the source page's fixed cream text. */
body #results .stat-card{background:var(--surface);border:1px solid var(--border);backdrop-filter:none;box-shadow:0 4px 18px rgba(25,30,35,.035);opacity:1!important;filter:none!important}
body #results .stat-num{color:var(--text);font-family:'Hanken Grotesk',sans-serif;font-size:clamp(36px,4vw,48px)}
body #results .stat-label{color:var(--text);font-size:15px}
body #results .stat-sub{color:var(--text3);font-size:13px;line-height:1.55}
body #results .stat-card:hover{background:var(--surface);border-color:var(--border2)}
/* Scanner-first hero, with live headline text kept separate from the photo. */
body #hero{padding:90px max(32px,calc((100vw - 1240px)/2)) 86px!important;min-height:620px;display:flex;justify-content:center;isolation:isolate;background:var(--bg)!important}
body #hero::before,body #hero::after{display:none!important}
#hero .hero-photo{position:absolute;inset:0;z-index:-1;overflow:hidden}
#hero .hero-photo img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
body #hero .kh-inner{max-width:1240px;width:100%;display:block;margin:0 auto;text-align:left}
body #hero .kh-h1{width:46%;max-width:550px;font-size:clamp(37px,3.7vw,54px)!important;text-align:left!important;margin-bottom:24px;line-height:1.07!important}
body #hero .kh-sub{width:43%;max-width:470px;text-align:left;margin-bottom:24px;font-size:17px!important}
body #hero .kh-wallets{width:46%;justify-content:flex-start;gap:9px 12px;margin-top:0}
body #hero .kh-wlock span{font-size:15px}body #hero .kh-wlock img{height:24px}
body #hero .kh-cta-row{width:46%;align-items:flex-start;margin-top:28px}
body #hero .kh-primary-cta{background:#216f43!important;color:#fff!important;box-shadow:0 5px 14px rgba(15,68,39,.12)!important}
body.dark-mode #hero{background:#17191b!important}
body.dark-mode #hero .hero-photo::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#17191b 0%,#17191b 37%,rgba(23,25,27,.95) 44%,rgba(23,25,27,.2) 61%,transparent 76%)}
@media(max-width:960px){
 body #hero{min-height:0;padding:52px 24px 0!important;display:flex;flex-direction:column}
 body #hero .kh-inner{order:0;text-align:center;width:100%}
 body #hero .kh-h1{width:100%;max-width:650px;margin:0 auto 22px;text-align:center!important;font-size:clamp(34px,5.5vw,48px)!important}
 body #hero .kh-sub{width:100%;max-width:500px;margin:0 auto 24px;text-align:center;font-size:16px!important}
 body #hero .kh-wallets{width:100%;justify-content:center}
 body #hero .kh-cta-row{width:100%;align-items:center;margin:26px 0 0}
 #hero .hero-photo{order:1;position:relative;inset:auto;width:calc(100% + 48px);height:clamp(340px,65vw,520px);margin:28px -24px 0;z-index:0;flex:none}
 #hero .hero-photo img{width:175%;max-width:none!important;height:100%;position:absolute;right:0;object-fit:cover;object-position:right center}
 body.dark-mode #hero .hero-photo::after{background:linear-gradient(180deg,#17191b 0%,rgba(23,25,27,.3) 10%,transparent 35%)}
}
@media(max-width:480px){body #hero{padding-top:40px!important}#hero .hero-photo{height:340px}body #hero .kh-h1{font-size:36px!important}body #results .stat-card{padding:24px 18px}.q-portrait img{object-position:center 35%}}
#proof .q-face{display:block;width:64px;height:64px;overflow:hidden;border-radius:50%;margin:0 auto 6px}
#proof .q-face img{border-radius:0;margin:0;transform:scale(1.25);object-position:center 28%}
#proof .quote:nth-child(2) .q-face img{transform:scale(1.7);object-position:center 20%}
#proof .quote:nth-child(3) .q-face img{transform:scale(1.3)}

@media(max-width:960px){
body #hero{display:block;min-height:800px;padding:46px 24px 330px!important}
body #hero .hero-photo{position:absolute;inset:0;width:100%;height:100%;margin:0;z-index:-1;border-radius:0}
body #hero .hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:76% bottom}
body #hero .hero-photo::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.98) 35%,rgba(255,255,255,.88) 50%,rgba(255,255,255,.1) 73%,transparent 90%)}
body.dark-mode #hero .hero-photo::after{background:linear-gradient(180deg,#17191b 0%,rgba(23,25,27,.98) 35%,rgba(23,25,27,.88) 50%,rgba(23,25,27,.1) 73%,transparent 90%)}
}
@media(max-width:480px){body #hero{min-height:790px;padding-top:36px!important;padding-bottom:330px!important}body #hero .kh-h1{font-size:36px!important}}


/* Art-directed mobile image and dark theme seam treatment. */
#hero .hero-photo picture{display:block;width:100%;height:100%}
body.dark-mode #hero,body.dark-mode .customer-proof,body.dark-mode .trust{background:var(--bg)!important}
body.dark-mode .integrations-caption{color:var(--text2)}
body.dark-mode #hero .hero-photo::after{background:linear-gradient(0deg,#1a1714 0%,rgba(26,23,20,0) 16%),linear-gradient(180deg,#1a1714 0%,rgba(26,23,20,0) 15%),linear-gradient(90deg,#1a1714 0%,#1a1714 33%,rgba(26,23,20,.95) 43%,rgba(26,23,20,.28) 61%,rgba(26,23,20,.04) 82%,rgba(26,23,20,.12) 100%)}
@media(max-width:960px){
body #hero{min-height:850px;padding:38px 24px 420px!important}
body #hero .hero-photo img{object-position:center bottom;object-fit:cover}
body #hero .hero-photo::after{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.35) 32%,transparent 48%,transparent 89%,#fff 100%)}
body.dark-mode #hero .hero-photo::after{background:linear-gradient(180deg,#1a1714 0%,#1a1714 32%,rgba(26,23,20,.96) 40%,rgba(26,23,20,.58) 50%,rgba(26,23,20,.04) 64%,rgba(26,23,20,.04) 84%,#1a1714 100%)}
body #hero .kh-h1{font-size:clamp(36px,5.5vw,48px)!important}
}
@media(min-width:481px) and (max-width:960px){body #hero{min-height:980px;padding-bottom:560px!important}body #hero .hero-photo img{object-fit:contain;background:#f9f7f4}body.dark-mode #hero .hero-photo::after{background:linear-gradient(180deg,#1a1714 0%,#1a1714 25%,rgba(26,23,20,.94) 34%,rgba(26,23,20,.3) 49%,rgba(26,23,20,.1) 75%,#1a1714 100%),linear-gradient(90deg,#1a1714 0%,transparent 18%,transparent 82%,#1a1714 100%)}}
@media(max-width:480px){body #hero{min-height:850px;padding-top:32px!important;padding-bottom:420px!important}body #hero .kh-sub{font-size:15px!important}body #hero .kh-h1{margin-bottom:20px}body #hero .kh-wallets{gap:8px}body #hero .kh-cta-row{margin-top:22px}}

body.dark-mode .dtrust-band{background:var(--bg)!important}body.dark-mode .dtrust-band .dlogo img{filter:grayscale(1) brightness(0) invert(1)!important;opacity:.8!important}body.dark-mode .dlogo + .dlogo::before{background:var(--border)}

/* Consistent emerald actions and a more orderly mobile hero. */
body #hero .kh-primary-cta,body #mainNav .nav-cta,body #mm .mm-cta,body #pricing .plans-three .plan-btn{background:#16804a!important;border-color:#16804a!important;color:#fff!important}
body #hero .kh-primary-cta{box-shadow:0 6px 18px rgba(22,128,74,.17)!important;gap:10px}
body #hero .kh-primary-cta span[aria-hidden]{margin-inline-start:0!important}
body #hero .kh-primary-cta:hover,body #mainNav .nav-cta:hover,body #pricing .plans-three .plan-btn:hover{background:#116b3d!important;border-color:#116b3d!important}
body #hero .kh-h1{text-wrap:balance}
@media(max-width:960px){
body #hero .kh-inner{display:flex;flex-direction:column;align-items:center}
body #hero .kh-h1{max-width:620px;margin-left:auto;margin-right:auto}
body #hero .kh-sub{max-width:440px;text-wrap:balance;margin-left:auto;margin-right:auto}
body #hero .kh-wallets{display:grid;grid-template-columns:auto auto;justify-content:center;align-items:center;column-gap:22px;row-gap:10px;width:100%;margin-top:0}
body #hero .kh-wallets .kh-wcap:first-child{grid-column:1/-1;text-align:center;font-size:11px;line-height:1.2}
body #hero .kh-wallets .kh-wcap:nth-child(3){display:none}
body #hero .kh-wlock{gap:7px;justify-content:center}
body #hero .kh-wlock span{font-size:14px}
body #hero .kh-wlock img{height:23px}
body #hero .kh-cta-row{margin:24px 0 0;align-items:center}
body #hero .kh-primary-cta{min-height:54px;padding:15px 28px;font-size:16px}
}
@media(max-width:480px){body #hero{min-height:880px;padding:34px 24px 440px!important}body #hero .kh-h1{max-width:350px;margin-bottom:20px!important}body #hero .kh-sub{max-width:335px;margin-bottom:22px!important}}
/* Blend the hero and integration marquee into a single surface. */
body.light-theme #hero,body.dark-mode #hero{border-bottom:0!important;box-shadow:none!important}
body .trust,body .dtrust-band{border-top:0!important;border-bottom:0!important;box-shadow:none!important}
body.light-theme .trust,body.light-theme .dtrust-band{background:#fff!important}
@media(min-width:961px){body.light-theme #hero .hero-photo::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#fff 0%,rgba(255,255,255,0) 17%)}}
body .trust-check-row{display:flex!important;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px 32px;margin:0 auto;max-width:1000px;text-align:center}
body .trust-check-item{display:flex;align-items:center;justify-content:center;text-align:center}
@media(max-width:760px){body .trust-check-row{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));justify-items:center;gap:14px 12px;max-width:390px;padding:0 12px}body .trust-check-item{gap:6px;font-size:12px}}
/* Individually framed portraits: hair, eyes and shoulders share a consistent crop. */
#proof .q-portrait{width:84px}
#proof .q-face{width:72px;height:72px;position:relative;background:#e5e7e6}
#proof .q-face img{position:absolute!important;max-width:none!important;height:auto!important;object-fit:initial!important;transform:none!important;border-radius:0!important;margin:0!important;filter:saturate(.8)}
#proof .quote:nth-child(1) .q-face img{width:84px!important;left:-6px;top:-1px}
#proof .quote:nth-child(2) .q-face img{width:144px!important;left:-45px;top:-44px}
#proof .quote:nth-child(3) .q-face img{width:162px!important;left:-45px;top:-16px}
#proof .quote:nth-child(4) .q-face img{width:96px!important;left:-12px;top:-10px}
#proof .quote:nth-child(5) .q-face img{width:102px!important;left:-15px;top:-28px}
#proof .quote:nth-child(6) .q-face img{width:108px!important;left:-18px;top:-9px}
body .pricing-reassurance{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px 28px;margin:22px 0;padding:0;border:0}
body .pricing-reassurance>div{align-items:center;gap:7px}
body .pricing-reassurance>div>span{color:#16804a}
body .pricing-reassurance strong{font-size:13px;font-weight:500}
.plan-features-toggle{display:none}
.calc-details summary{cursor:pointer;list-style:none;font:500 13px/1.4 'Hanken Grotesk',sans-serif;color:var(--text2);padding:12px 0;min-height:44px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--border)}
.calc-details summary::after{content:'+';font-size:20px}
.calc-details[open] summary::after{content:'−'}
.calc-detail-body{display:grid;gap:16px}
@media(min-width:761px){.calc-details summary{display:none}}
@media(max-width:760px){
body #pricing{padding-top:44px;padding-bottom:44px}
body #pricing .plans-three{margin-top:26px;gap:18px}
body #pricing .plan{padding:24px 22px;border-radius:20px;min-height:0}
body #pricing .plan-name{font-size:21px;margin-bottom:8px}
body #pricing .plan-desc{font-size:13px!important;line-height:1.45!important;margin-bottom:14px;min-height:0}
body #pricing .plan-price{font-size:42px;line-height:1.05;margin-bottom:5px}
body #pricing .plan-currency-note{font-size:11px;margin-bottom:4px}
body #pricing .plan-yr{font-size:12px;margin-bottom:0}
body #pricing .plan-div{margin:14px 0}
body #pricing .pf{font-family:'Hanken Grotesk',sans-serif;font-size:13px;line-height:1.4;padding:6px 0}
body #pricing .plan:not(.features-expanded) [id$="Feats"]>.pf:nth-child(n+4){display:none}
body #pricing .plan-features-toggle{display:block;align-self:flex-start;background:none;border:0;padding:10px 0;min-height:44px;font:500 13px 'Hanken Grotesk',sans-serif;color:var(--text2);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
body #pricing .plan-btn{margin-top:8px!important;min-height:46px!important}
body #calculator{padding-top:36px;padding-bottom:36px}
body #calculator .sec-title{font-size:26px!important;line-height:1.1!important;margin-bottom:18px}
body #calculator .calc-shell{gap:14px;margin-top:0}
body #calculator .calc-inputs{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px;position:static}
body #calculator .calc-field:first-child,body #calculator .calc-field:last-child{grid-column:1/-1}
body #calculator .calc-field-label{font-family:'Hanken Grotesk',sans-serif;text-transform:none;letter-spacing:0;font-size:12px;margin-bottom:0}
body #calculator .calc-field-top{gap:6px;margin-bottom:9px;align-items:center}
body #calculator .calc-num-input{font-size:17px;width:66px;min-height:38px;padding:5px 6px}
body #calculator .calc-num-input-prefixed{width:45px}
body #calculator .calc-num-prefix{font-size:16px}
body #calculator .calc-num-input-wrap{padding:0 6px}
body #calculator .calc-slider-ends{display:none}
body #calculator .calc-industry-select{min-height:44px;padding:10px 34px 10px 12px;font-size:14px;margin-top:7px;background-color:var(--surface);border-color:var(--border2)}
body #calculator .calc-out{padding:16px;gap:10px}
body #calculator .calc-callout{padding:8px 10px;font-size:11px;line-height:1.4}
body #calculator .calc-stats-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
body #calculator .calc-stat:last-child{grid-column:auto}
body #calculator .calc-stat{padding:8px 5px}
body #calculator .calc-stat-val{font-size:16px}
body #calculator .calc-stat-lbl{font-family:'Hanken Grotesk',sans-serif;font-size:10px;text-transform:none;letter-spacing:0}
body #calculator .calc-chart{height:120px}
body #calculator .calc-cta-row{margin-top:0}
}
@media(max-width:359px){body #calculator .calc-inputs{grid-template-columns:1fr}body #calculator .calc-field{grid-column:1/-1}}

@media(max-width:960px){body #hero .kh-sub,body #features>.sec-inner>.sec-sub{display:none!important}body #features .fb-list{margin-top:24px}}
@media(max-width:480px){body #hero{min-height:800px;padding-bottom:400px!important}body #features .fb-row{grid-template-columns:1fr;gap:7px;padding:18px 0}body #features .fb-t{font-size:20px!important;line-height:1.15!important}body #features .fb-d{font-size:14px!important;line-height:1.5!important}}
.customer-journey{width:100%;max-width:440px;background:var(--surface);border:1px solid var(--border2);border-radius:22px;padding:26px;box-shadow:0 12px 32px rgba(0,0,0,.06);text-align:left}
.journey-heading{padding-bottom:20px;border-bottom:1px solid var(--border)}
.journey-kicker{display:block;font:500 10px/1.4 'Hanken Grotesk',sans-serif;letter-spacing:.1em;color:var(--text3);margin-bottom:8px}
.journey-heading strong{font:600 23px/1.15 'Hanken Grotesk',sans-serif;letter-spacing:-.03em;color:var(--text)}
.journey-steps{list-style:none;padding:0;margin:20px 0 0;display:flex;flex-direction:column;gap:22px}
.journey-steps li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;position:relative;align-items:start}
.journey-steps li:not(:last-child)::after{content:'';position:absolute;width:1px;background:var(--border2);top:38px;bottom:-16px;left:16px}
.journey-number{width:32px;height:32px;border-radius:50%;background:#e7f5ed;color:#16804a;display:flex;align-items:center;justify-content:center;font:600 14px 'Hanken Grotesk',sans-serif}
.journey-steps h4{font:600 16px/1.3 'Hanken Grotesk',sans-serif;margin:4px 0 5px;color:var(--text)}
.journey-steps p{font:400 13px/1.45 'Hanken Grotesk',sans-serif;margin:0;color:var(--text2)}
.journey-wallet{display:flex;align-items:center;gap:9px;margin-top:10px}.journey-wallet img{width:23px!important;height:23px!important;filter:none!important;object-fit:contain}
body.dark-mode .journey-number{background:#193e2b;color:#9ce7b9}
@media(max-width:900px){.customer-journey{padding:20px;border-radius:18px;max-width:400px}.journey-steps{gap:18px}.journey-steps h4{font-size:15px}.journey-heading strong{font-size:22px}}
body #howitworks .hiw-frame img.signup-illustration{width:100%;max-width:480px;height:auto;object-fit:contain;background:transparent;filter:drop-shadow(0 12px 18px rgba(0,0,0,.1))}
@media(max-width:900px){body #howitworks .hiw-frame img.signup-illustration{max-width:350px;width:100%;max-height:none!important;object-fit:contain;filter:drop-shadow(0 8px 12px rgba(0,0,0,.08))}}
html[dir=rtl] body{--ar:'IBM Plex Sans Arabic',sans-serif;--body:'IBM Plex Sans Arabic',sans-serif;--heading:'IBM Plex Sans Arabic',sans-serif;--mono:'IBM Plex Sans Arabic',sans-serif}
html[dir=rtl] body,html[dir=rtl] body :is(h1,h2,h3,h4,p,a,button,label,input,select,textarea,span,strong,em,i,li,div,summary,td,th){font-family:'IBM Plex Sans Arabic','Hanken Grotesk',sans-serif!important;letter-spacing:0!important;font-style:normal!important;font-synthesis:none}
html[dir=rtl] body :is(h1,h2,h3,h4,.sec-title,.tl-sec-hd h2){font-weight:600!important;line-height:1.5!important}
html[dir=rtl] body :is(p,.sec-sub,.fb-d,.quote-text){line-height:1.8!important}
html[dir=rtl] #hero .kh-h1{text-align:right!important;line-height:1.4!important}
html[dir=rtl] #hero .kh-sub{text-align:right}
html[dir=rtl] #hero .kh-wallets{justify-content:flex-start}
html[dir=rtl] #hero .kh-cta-row{align-items:flex-start}
html[dir=rtl] #features .fb-row{text-align:right}
html[dir=rtl] .quote-attr{text-align:right}
html[dir=rtl] .calc-num-input,html[dir=rtl] .calc-num-input-wrap,html[dir=rtl] .plan-price,html[dir=rtl] .plan-yr{direction:ltr;unicode-bidi:isolate}
html[dir=rtl] .calc-triptych,html[dir=rtl] .calc-chart{direction:ltr}
html[dir=rtl] .plan-features-toggle{align-self:flex-start}
body #howitworks .hiw-frame img.wallet-illustration{width:100%;max-width:320px;height:auto;object-fit:contain}
body #howitworks .hiw-frame img.scan-illustration{width:100%;max-width:460px;height:auto;object-fit:contain}
@media(max-width:960px){body #hero{padding-top:52px!important}html[dir=rtl] #hero .kh-h1,html[dir=rtl] #hero .kh-sub{text-align:center!important}html[dir=rtl] #hero .kh-cta-row{align-items:center}html[dir=rtl] #hero .kh-wallets{justify-content:center}}
@media(max-width:900px){body #howitworks .hiw-frame img.wallet-illustration{max-width:260px;max-height:none!important}body #howitworks .hiw-frame img.scan-illustration{max-width:350px;max-height:none!important}html[dir=rtl] .hiw-mtab-lbl{font-size:11px;white-space:normal}html[dir=rtl] .hiw-mtabs{direction:rtl}html[dir=rtl] #howitworks .tl-sec-hd h2{font-size:30px!important;line-height:1.6!important}}
@media(max-width:480px){body #hero{padding-top:52px!important;min-height:820px}html[dir=rtl] #hero .kh-h1{font-size:34px!important;max-width:360px}html[dir=rtl] body #features .fb-t{font-size:21px!important}html[dir=rtl] .plan-features-toggle{font-size:14px}}
html[lang=ar][dir=rtl] body :is(#hero,#features,#howitworks,#systems,#pricing,#proof,#calculator,#results,#mainNav,#mm,footer) :is(h1,h2,h3,h4,p,a,button,label,input,select,span,strong,em,i,li,div,summary,td,th),html[lang=ar][dir=rtl] body .sec-title,html[lang=ar][dir=rtl] body .tl-sec-hd h2{font-family:'IBM Plex Sans Arabic',sans-serif!important;font-style:normal!important;letter-spacing:0!important}
html[lang=ar][dir=rtl] body #howitworks .tl-sec-hd h2,html[lang=ar][dir=rtl] body #features .sec-title{font-weight:600!important;line-height:1.6!important}
html[lang=ar][dir=rtl] body #howitworks .hiw-frame-mobile h3{font-size:21px!important;line-height:1.6!important}
html[lang=ar][dir=rtl] body #hero .kh-primary-cta{font-size:15px;max-width:100%;text-align:center}
html[lang=ar][dir=rtl] body .trust-check-item{line-height:1.6}
@media(min-width:961px){
html[dir=rtl] #hero .kh-inner{direction:ltr;text-align:left}
html[dir=rtl] #hero .kh-h1,html[dir=rtl] #hero .kh-sub{direction:rtl;text-align:right!important;margin-left:0;margin-right:auto}
html[dir=rtl] #hero .kh-wallets{direction:rtl;margin-left:0;margin-right:auto;justify-content:flex-start}
html[dir=rtl] #hero .kh-cta-row{direction:rtl;margin-left:0;margin-right:auto;align-items:flex-start}
}
@media(max-width:900px){body .hiw-mtabs{grid-template-columns:repeat(3,minmax(0,1fr))}}
body #hero .kh-primary-cta [aria-hidden]{direction:ltr;unicode-bidi:isolate;display:inline-block;font-family:Arial,sans-serif!important}

/* Billing selector: one balanced row at every supported viewport. */
body #pricing .bil-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;width:min(100%,360px);margin:28px auto 0;padding:5px;border:1px solid #dce4df;border-radius:17px;background:#f3f6f4;flex-wrap:nowrap;box-sizing:border-box}
body #pricing .bil-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:100%;min-width:0;min-height:64px;margin:0;padding:11px 8px;border:1px solid transparent;border-radius:12px;background:transparent;box-shadow:none;color:#606a64;font-family:'Hanken Grotesk',sans-serif;font-size:14px;font-weight:500;line-height:1.25;text-transform:none;letter-spacing:0;white-space:normal;text-align:center;transition:background .18s,border-color .18s,box-shadow .18s,color .18s}
body #pricing .bil-tab .billing-label{font:600 15px/1.25 'Hanken Grotesk',sans-serif;color:inherit}
body #pricing .bil-tab .billing-detail{font:400 11px/1.25 'Hanken Grotesk',sans-serif;color:#6a756e;letter-spacing:0;text-transform:none}
body #pricing .bil-tab .save-tag{display:block;border:0;border-radius:0;background:transparent;margin:0;padding:0;font:500 11px/1.25 'Hanken Grotesk',sans-serif;letter-spacing:0;color:#16804a;text-transform:none}
body #pricing .bil-tab:hover{background:#e9efeb;color:#25392e}
body #pricing .bil-tab.on{background:#fff;border-color:#b6cbbd;color:#125f38;box-shadow:0 2px 6px rgba(24,58,38,.09)}
body #pricing .bil-tab:focus-visible{outline:3px solid #91c9a8;outline-offset:3px;box-shadow:none}
body.dark-mode #pricing .bil-tabs{background:#222824;border-color:#38433b}
body.dark-mode #pricing .bil-tab{color:#c2cdc5}
body.dark-mode #pricing .bil-tab:hover{background:#2b362f}
body.dark-mode #pricing .bil-tab.on{background:#314b3a;border-color:#70a581;color:#fff}
body.dark-mode #pricing .bil-tab .billing-detail{color:#b7c6bc}
body.dark-mode #pricing .bil-tab .save-tag{color:#a5e5bd}
html[lang=ar] body #pricing .bil-tabs{display:flex;width:fit-content;max-width:100%;background:transparent;border:0;padding:0;box-shadow:none}
html[lang=ar] body #pricing .bil-tab[data-cycle=monthly],html[lang=ar] body #pricing .bil-tab[data-cycle="3mo"]{display:none!important}
html[lang=ar] body #pricing .bil-tab[data-cycle=annual]{flex-direction:row;min-height:36px;gap:12px;padding:6px 14px;cursor:default;background:#eef6f0;border:1px solid #d5e6da;box-shadow:none;pointer-events:none}
html[lang=ar] body #pricing .bil-tab[data-cycle=annual] .save-tag{border-inline-start:1px solid #c4d9cb;padding-inline-start:12px}
@media(max-width:480px){body #pricing .bil-tabs{margin-top:24px;border-radius:15px;padding:4px;gap:3px}body #pricing .bil-tab{min-height:62px;padding:10px 4px;border-radius:11px}body #pricing .bil-tab .billing-label{font-size:14px}body #pricing .bil-tab .billing-detail,body #pricing .bil-tab .save-tag{font-size:10px}}
/* Desktop hero action: generous breathing room and a clearly separated arrow. */
@media(min-width:961px){body #hero .kh-cta-row{margin-top:34px;margin-bottom:0;gap:0}body #hero .kh-primary-cta{min-height:62px;padding:18px 34px;gap:18px;font-size:17px;line-height:1.3;box-sizing:border-box}body #hero .kh-primary-cta>span:first-child{line-height:1.3}body #hero .kh-primary-cta>span[aria-hidden]{font-size:21px;line-height:1;flex:none}html[lang=ar][dir=rtl] body #hero .kh-primary-cta{font-size:16px;gap:18px;padding:17px 30px;min-height:64px}}
/* Chat on the light theme: the panel turned white, but its header, close button, input and footer kept
   the dark theme cream (#F5F0E8), so the only way out of the chat was invisible. */
body.light-theme .flann-panel-header,body.light-theme .flann-input-area{background:#fff;border-color:#20242a14}
body.light-theme .flann-panel-name{color:#20242a}
body.light-theme .flann-panel-sub{color:#606976}
body.light-theme .flann-panel-av::after{box-shadow:0 0 0 2px #fff}
body.light-theme .flann-close-btn{background:#f2f4f7;border:1px solid #20242a1f}
body.light-theme .flann-close-btn:hover{background:#e6e9ee;border-color:#20242a33}
body.light-theme .flann-close-btn svg{color:#20242a}
body.light-theme .flann-input{border-color:#20242a1f}
body.light-theme .flann-input::placeholder{color:#7a828d}
body.light-theme .flann-powered{color:#7a828d}
.flann-close-btn:active{transform:scale(.94);transition:transform .1s ease-out}
.flann-close-btn:focus-visible{outline:2px solid #C8400A;outline-offset:2px}
/* Full-screen chat on phones: a 44px close target, and 16px input text so iOS does not zoom on focus. */
@media(max-width:960px){.flann-close-btn{width:44px;height:44px}.flann-close-btn svg{width:18px;height:18px}.flann-input{font-size:16px}}
/* The floating chat button competes with the demo form, and is covered by the full-screen chat. */
body:has(#demoModal.open) .mst-chat-fab{display:none}
/* The cookie banner sat on top of the chat input on phones; it comes back when the chat closes. */
body:has(#flannOverlay.open) .ck-banner{display:none}
@media(max-width:960px){body:has(#flannOverlay.open) .mst-chat-fab{display:none}}
/* The nav was sticky inside a <header> exactly its own height, so it never stuck. Stick the header. */
#marketing-page>header{position:sticky;top:0;z-index:var(--z-sticky)}
/* Hero action back to the brand orange; nav and pricing actions stay emerald. */
body #hero .kh-primary-cta{background:#b93f24!important;border-color:#b93f24!important;box-shadow:0 6px 18px rgba(185,63,36,.2)!important}
body #hero .kh-primary-cta:hover{background:#9f3519!important;border-color:#9f3519!important}
/* Hero secondary action: create an account in the app. Outlined so the orange demo button stays the one primary. */
body #hero .kh-secondary-cta{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:54px;padding:15px 28px;border-radius:100px;border:1.5px solid #20242a2e;background:transparent;color:#20242a;font:600 16px/1.3 'Hanken Grotesk','Helvetica Neue',sans-serif;letter-spacing:-.005em;text-decoration:none;transition:background .15s,border-color .15s,transform .1s ease-out}
body #hero .kh-secondary-cta:hover{background:#20242a0a;border-color:#20242a52}
body #hero .kh-secondary-cta:active,body #hero .kh-primary-cta:active{transform:scale(.97)}
body #hero .kh-secondary-cta:focus-visible{outline:2px solid #b93f24;outline-offset:3px}
body #hero .kh-cta-row{gap:10px}
html[lang=ar] body #hero .kh-secondary-cta{font-family:var(--ar);font-size:15px}
@media(min-width:961px){body #hero .kh-cta-row{flex-direction:row;flex-wrap:wrap;align-items:center;gap:14px}body #hero .kh-secondary-cta{min-height:62px;padding:18px 24px;font-size:16px}}
/* Phones: the hero photo was object-fit:cover on a fixed-height hero, so it grew with the hero and the phone
   mockup ran into the second button. Keep the photo at its own proportions, pinned to the bottom with its top
   edge faded into the page, and reserve room under the buttons that scales with the photo (101vw + 24px). */
@media(max-width:480px){body #hero{min-height:calc(100vw * 666 / 374)!important;padding-bottom:calc(101vw + 24px)!important;overflow:hidden}body #hero picture img{top:auto!important;height:auto!important;aspect-ratio:374/666;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 22%);mask-image:linear-gradient(to bottom,transparent 0,#000 22%)}}
/* Top banner: the flex row squeezed the FREE TRIAL pill until its text spilled into the sentence. Never shrink it,
   and drop it on the narrowest phones, where the sentence already says "for free today". */
.launch-bar-tag{flex-shrink:0}
@media(max-width:380px){.launch-bar-tag{display:none}}