:root{--navy:#192533;--text:#253247;--muted:#687589;--mint:#17b890;--mint-light:#eaf7f2;--line:#e5e9ed;--light:#f7f9fc;--radius:18px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;color:var(--text);background:#fff;font-family:Inter,Arial,sans-serif;font-size:14px;line-height:1.65;-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button{color:inherit}img{max-width:100%;height:auto}h1,h2,h3,h4,p{margin:0}h1,h2,h3,h4{color:var(--navy);line-height:1.18;letter-spacing:-.045em}h2{font-size:43px;font-weight:650}h3{font-size:18px;font-weight:650}p{color:var(--muted)}.container{width:calc(100% - 112px);max-width:1232px;margin-inline:auto;padding:0}.icon{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;vertical-align:middle}.svg-library{position:absolute;width:0;height:0;overflow:hidden}.btn{display:inline-flex;justify-content:center;align-items:center;gap:14px;min-height:52px;padding:13px 21px;border-radius:8px;font-size:13px;font-weight:600;line-height:1.5;border:1px solid transparent;transition:transform .2s,background .2s,box-shadow .2s;white-space:nowrap}.btn:hover{transform:translateY(-2px)}.btn-dark{color:white;background:var(--navy);border-color:var(--navy);box-shadow:0 4px 7px #1925330b}.btn-dark:hover{color:#fff;background:#2c3e4d;border-color:#2c3e4d;box-shadow:0 7px 15px #19253317}.btn-outline{border-color:#d9dfe3;background:#fff;color:var(--navy)}.btn-outline:hover{border-color:#9fb7b0;background:#f8fcfa}.btn-mint{background:#8ce1c5;color:var(--navy)}.btn-mint:hover{background:#b4efd9;color:var(--navy)}.btn-small{min-height:43px;padding:9px 17px;font-size:12px}.text-link{display:inline-flex;align-items:center;gap:12px;font-weight:600;font-size:13px;color:var(--navy);background:none;border:0;padding:0}.text-link:hover{color:#078563}.text-link .icon{width:18px}.eyebrow{display:block;color:#478171;font-size:10px;letter-spacing:1.65px;font-weight:650;margin-bottom:22px}.status-dot{display:inline-block;width:6px;height:6px;background:var(--mint);border-radius:50%;flex-shrink:0}.muted-heading{color:#89949f}.section{padding:100px 0}.section-heading{margin-bottom:48px}.section-heading p{margin-top:20px;font-size:14px}.centered{text-align:center}.skip-link{position:fixed;top:-80px;left:20px;z-index:100;background:var(--navy);color:#fff;padding:12px}.skip-link:focus{top:12px}:focus-visible{outline:3px solid #17b890;outline-offset:5px}
/* Header */
.site-header{height:88px;position:sticky;top:0;z-index:50;background:#fffffff2;backdrop-filter:blur(15px);border-bottom:1px solid #edf0f1}.nav-shell{display:flex;align-items:center;justify-content:space-between;height:100%;gap:35px}.brand{display:inline-flex;align-items:center;gap:9px;font-size:26px;font-weight:750;letter-spacing:-1.2px;color:var(--navy);line-height:1}.brand-dot{color:var(--mint);margin-left:-9px}.brand-mark{position:relative;display:inline-flex;align-items:center;justify-content:center;background:var(--navy);width:30px;height:33px;border-radius:8px;color:#fff;font-size:30px;font-weight:750;padding:0 3px 5px 0;line-height:1}.brand-mark>span{position:absolute;width:7px;height:7px;bottom:7px;right:5px;border-radius:2px;background:#80dbbd}.nav-shell nav{display:flex;align-items:center;justify-content:space-between;flex:1;margin-left:52px;gap:20px}.nav-links,.nav-actions{display:flex;align-items:center;gap:27px}.nav-links a,.login-link{font-size:11px;font-weight:550;white-space:nowrap}.nav-links a{color:#6a7381}.nav-links a:hover,.nav-links a.active{color:var(--navy)}.nav-actions{gap:23px}.menu-toggle{display:none}
/* Hero & product presentation */
.hero{position:relative;background:linear-gradient(115deg,#fff 25%,#fafdfb 70%,#f2faf6);overflow:hidden}.hero-grid{display:grid;grid-template-columns:1fr 1.04fr;min-height:741px;align-items:center;gap:30px;padding-top:45px;padding-bottom:58px}.hero-copy{position:relative;z-index:2}.badge-label{display:inline-flex;align-items:center;gap:9px;border:1px solid #d9eae2;background:#f4faf7;border-radius:30px;padding:6px 11px;font-size:9px;letter-spacing:1.35px;margin-bottom:26px}.hero h1{font-size:66px;line-height:1.065;font-weight:650;letter-spacing:-3.4px}.highlight{position:relative;display:inline-block}.highlight svg{position:absolute;bottom:-13px;left:0;width:100%;height:15px;fill:none;stroke:#7ad4b4;stroke-width:5;stroke-linecap:round}.mint-period{color:var(--mint)}.hero-copy>p{max-width:445px;font-size:14px;line-height:1.9;margin-top:30px}.hero-actions{display:flex;gap:12px;margin-top:27px}.hero-actions .btn{font-size:11px;padding-inline:17px;min-height:48px;gap:11px}.play-icon{font-size:20px;line-height:1}.hero-reassurance{display:flex;gap:17px;font-size:9px;color:#788493;margin-top:21px}.hero-reassurance>span{display:flex;align-items:center;gap:3px;white-space:nowrap}.hero-reassurance .icon{width:12px;height:12px;color:#3fa286}.hero-visual{position:relative;min-width:0;height:605px;margin-top:20px}.visual-orbit{position:absolute;border:1px solid #d7e9df;border-radius:50%;pointer-events:none}.orbit-one{width:580px;height:580px;left:-15px;top:15px}.orbit-two{width:440px;height:440px;left:55px;top:85px}.browser-preview{position:absolute;top:63px;left:12px;width:436px;background:#fff;border:1px solid #e2e8e2;box-shadow:0 24px 65px #274a3820,0 4px 12px #1d3a3010;border-radius:13px;transform:rotate(-2deg);overflow:hidden}.browser-bar{height:35px;background:#fbfcfb;border-bottom:1px solid #e5e9e5;display:flex;gap:12px;align-items:center;padding:0 12px;color:#85928c;font-size:11px}.window-dots{display:flex;gap:4px}.window-dots i{display:block;width:5px;height:5px;border-radius:50%;background:#d2d9d5}.window-dots i:first-child{background:#e9b5af}.window-dots i:nth-child(2){background:#e9d6a7}.window-dots i:nth-child(3){background:#b4d3ba}.address{flex:1;font-size:7px;display:flex;align-items:center;justify-content:center;gap:4px;background:#f0f4f1;border-radius:4px;padding:3px}.address .icon{width:9px;height:9px}.profile-cover{height:138px;background:#e3eee6;display:flex;align-items:center;position:relative;overflow:hidden;padding:20px 24px}.profile-cover>div{z-index:1;flex-shrink:0}.cover-overline{display:block;font-size:7px;font-weight:600;letter-spacing:1.3px;color:#547e68}.profile-cover strong{display:block;font-size:24px;line-height:1.14;letter-spacing:-1px;font-weight:650;margin-top:9px;color:#29513d}.cover-tag{display:block;font-size:7px;color:#547e68;margin-top:8px}.profile-cover img{position:absolute;width:242px;right:-15px;bottom:-13px}.mini-profile-content{padding:0 23px 17px;position:relative}.business-logo{width:47px;height:47px;background:#fbfefa;border:3px solid #fff;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:750;color:#2c674b;letter-spacing:-3px;box-shadow:0 2px 7px #1925330d;position:relative}.business-logo>span{position:absolute;bottom:5px;right:2px;font-size:10px;letter-spacing:0}.mini-profile-content>.business-logo{margin-top:-23px;margin-bottom:10px}.business-type{display:block;font-size:6px;letter-spacing:1.3px;color:#698273;font-weight:650}.mini-profile-content h2{font-size:19px;letter-spacing:-.6px;margin-top:6px}.verified{display:inline-flex;background:#27a782;color:white;align-items:center;justify-content:center;width:12px;height:12px;border-radius:50%;font-size:8px;vertical-align:middle}.profile-location{display:flex;align-items:center;gap:6px;font-size:7px;margin-top:8px}.profile-location .icon{width:10px;height:10px}.open-text{color:#388468}.mini-description{font-size:7.4px;line-height:1.75;margin-top:9px;max-width:330px}.profile-buttons{display:flex;align-items:center;gap:7px;margin-top:13px}.profile-buttons button{background:var(--navy);border:1px solid var(--navy);border-radius:5px;font-size:8px;font-weight:550;display:inline-flex;align-items:center;justify-content:center;gap:6px;color:white;padding:7px 18px;min-height:29px}.profile-buttons .whatsapp{background:#eaf8f0;color:#2b8061;border-color:#d4eadf}.profile-buttons .save-contact{padding:6px 8px;background:white;border-color:var(--line);color:#53675c}.profile-buttons .icon{width:11px;height:11px}.profile-tabs{display:flex;gap:24px;border-bottom:1px solid #e7ece8;margin:17px 0 12px;font-size:7px;color:#879088}.profile-tabs span{padding-bottom:8px}.profile-tabs .selected{border-bottom:2px solid #478467;color:#2c5b43}.mini-products{display:grid;grid-template-columns:1fr 1fr;gap:10px}.product-image{background:#edf3ec;border-radius:7px;display:flex;justify-content:center;align-items:center;overflow:hidden}.mini-products .product-image{height:85px}.mini-products img{width:145px}.sand{background:#f1eee6!important}.blue{background:#edf1f6!important}.dark-scooter{filter:saturate(.15) brightness(.65)}.blue-scooter{filter:hue-rotate(65deg) saturate(.65)}.mini-products strong{display:block;font-size:8px;margin-top:6px;font-weight:600}.mini-products small{font-size:6px;color:#849088;display:block;margin-top:1px}.link-float{position:absolute;top:9px;left:72px;background:white;border:1px solid #e5eee8;border-radius:10px;display:flex;align-items:center;gap:10px;padding:10px 13px;box-shadow:0 8px 25px #324f3e08;z-index:4;transform:rotate(-2deg);font-size:10px;font-weight:600}.float-icon{display:grid;place-items:center;width:30px;height:30px;background:#eff9f3;border-radius:7px;color:#47977a}.float-icon .icon{width:17px;height:17px}.link-float small{display:block;font-size:7px;color:#829088;font-weight:400;margin-top:1px}.check-circle{display:flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:#edf8f1;color:#3b9b78;margin-left:10px;font-size:10px}.phone-preview{position:absolute;right:-2px;bottom:22px;width:181px;height:365px;border:5px solid #24312c;border-radius:29px;box-shadow:0 20px 45px #233b3a30,0 0 0 1px #65736a;z-index:5;background:#fff;transform:rotate(7deg);overflow:hidden}.phone-camera{width:57px;height:13px;position:absolute;background:#24312c;left:calc(50% - 28px);top:0;border-radius:0 0 9px 9px;z-index:2}.phone-cover{height:91px;background:#dcece0;position:relative;overflow:hidden}.phone-cover img{width:150px;position:absolute;bottom:-13px;right:-13px}.phone-content{padding:0 12px}.phone-content .business-logo{width:33px;height:33px;border-radius:8px;font-size:18px;margin-top:-16px;letter-spacing:-2px}.phone-content .business-logo>span{font-size:7px;bottom:1px}.phone-content h3{font-size:12px;letter-spacing:-.35px;margin-top:6px}.phone-content p{font-size:5px;margin-top:5px;display:flex;align-items:center;gap:3px}.phone-content .status-dot{width:3px;height:3px}.phone-buttons{display:flex;gap:5px;margin-top:9px}.phone-buttons>span{padding:5px 10px;display:flex;gap:4px;align-items:center;border-radius:4px;background:var(--navy);color:#fff;font-size:6px;flex:1;justify-content:center}.phone-buttons>span+span{background:#e6f5ec;color:#377a56}.phone-buttons .icon{width:8px;height:8px}.phone-section-title{font-size:7px;display:block;margin-top:13px}.phone-product{background:#edf3ea;border-radius:6px;margin-top:6px;height:71px;display:flex;justify-content:center;align-items:center}.phone-product img{width:120px}.phone-product-name{font-size:6px;display:flex;justify-content:space-between;margin-top:6px}.phone-nav{display:flex;justify-content:space-between;border-top:1px solid #e9eeea;margin-top:12px;padding-top:9px;color:#7d9486}.phone-nav .icon{width:11px;height:11px}.qr-float{display:flex;gap:13px;align-items:center;padding:12px;background:#fff;border:1px solid #e0e9e3;border-radius:11px;box-shadow:0 12px 30px #2e4a3810;position:absolute;bottom:11px;left:-20px;z-index:6;transform:rotate(-5deg)}.qr-float img{width:64px;height:64px}.qr-float>span{font-size:11px;line-height:1.5;color:#67796c}.qr-float strong{color:var(--navy);font-weight:600}.qr-float small{display:block;font-size:6px;margin-top:6px}.visual-caption{position:absolute;bottom:-25px;width:100%;text-align:center;font-size:8px;color:#7d9185;letter-spacing:.2px}.visual-caption .status-dot{width:4px;height:4px;margin-right:5px}.value-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff}.value-grid{display:grid;grid-template-columns:repeat(4,1fr);padding:26px 0}.value-grid>div{display:flex;gap:12px;align-items:center;justify-content:center;font-size:11px;font-weight:550;border-right:1px solid var(--line)}.value-grid>div:last-child{border-right:0}.value-grid .icon{color:#508473;width:20px;height:20px}
/* Comparison */
.problem-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:80px;align-items:center}.section-copy p{margin-top:20px;max-width:360px;font-size:13px}.section-copy .text-link{margin-top:25px}.comparison{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:center}.before-card,.after-card{padding:25px 22px;border:1px solid var(--line);border-radius:14px;background:#fcfcfc;min-width:0}.before-card{margin-right:-13px;padding-right:30px}.after-card{background:#f2f9f5;border-color:#cde4d8;position:relative;box-shadow:0 12px 24px #244f3408;padding-top:31px;padding-bottom:31px}.comparison-label{font-size:8px;font-weight:600;letter-spacing:1px;color:#899399;display:flex;align-items:center;gap:6px}.after-card .comparison-label{color:#408164}.comparison .status-dot{width:5px;height:5px}.paper-card{padding:18px 13px;background:white;border:1px solid #ecebea;box-shadow:0 4px 8px #28323807;transform:rotate(-6deg);margin:28px 4px 30px;border-radius:3px}.paper-card>span{display:block;font-size:8px;letter-spacing:1px;font-weight:600;color:#b2b7b7}.paper-card i{display:block;width:60%;height:3px;background:#e7eaea;margin-top:7px}.paper-card i+i{width:40%}.paper-card small{font-size:5px;color:#a6ada9;display:block;margin-top:12px}.comparison h3{font-size:12px;letter-spacing:-.3px;line-height:1.5;min-height:36px}.cross-list,.check-list{list-style:none;padding:0;margin:14px 0 0}.cross-list li,.check-list li{font-size:8px;margin-top:13px;position:relative;padding-left:15px;line-height:1.6;color:#7b8490}.cross-list li:before{content:'×';position:absolute;left:0;font-size:13px;line-height:1;color:#a1a8ac}.check-list li:before{content:'✓';position:absolute;left:0;color:#3e9f7b;font-size:10px}.after-card .check-list li{color:#507260}.digital-link{display:flex;align-items:center;gap:6px;padding:14px 9px;margin:33px 0;background:white;border:1px solid #dfece4;border-radius:8px;transform:rotate(-3deg)}.digital-link .brand-mark{width:21px;height:24px;font-size:23px;border-radius:5px;padding-bottom:4px}.digital-link .brand-mark>span{width:4px;height:4px;bottom:4px;right:3px}.digital-link>span:nth-child(2){font-size:6px;color:#718b7b;line-height:1.6;flex:1}.digital-link strong{display:block;color:#325440;font-size:9px}.digital-link .icon{width:13px;height:13px;color:#5c9172}
/* Features */
.features-section{background:#f8fafb;border-block:1px solid #eef1f3}.features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}.feature-card{position:relative;background:white;border:1px solid #e7ecee;border-radius:12px;padding:25px 22px 28px;transition:transform .2s,box-shadow .2s,border-color .2s}.feature-card:hover{transform:translateY(-5px);border-color:#bdddcf;box-shadow:0 12px 24px #25463709}.feature-icon{display:grid;place-items:center;width:39px;height:39px;background:#f0f7f4;border:1px solid #e6f1eb;border-radius:10px;color:#487e67;margin-bottom:23px}.feature-icon .icon{width:20px;height:20px}.feature-card h3{font-size:12px;letter-spacing:-.25px;margin-bottom:11px}.feature-card p{font-size:10px;line-height:1.8}.card-index{position:absolute;right:21px;top:30px;font-size:8px;color:#c1c9cc;letter-spacing:1px}
/* Live demo */
.demo-section{background:#fff}.demo-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:40px;gap:30px}.demo-heading>div+div{padding-bottom:5px}.demo-heading p{font-size:12px;line-height:1.8}.demo-heading .text-link{margin-top:15px}.demo-stage{border-radius:15px;background:#f4f7f5;border:1px solid #dce5df;padding:12px;box-shadow:0 18px 50px #263e3209}.demo-toolbar{display:flex;align-items:center;justify-content:space-between;padding:5px 10px 15px;gap:12px}.demo-url{font-size:9px;color:#7a887f}.sample-tag{font-size:7px;letter-spacing:1px;color:#567563}.full-profile{background:white;border:1px solid #e1e8e2;border-radius:9px;padding:27px 32px 0;overflow:hidden}.demo-business-header{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:24px}.demo-identity{display:flex;align-items:center;gap:14px}.demo-identity .business-logo{width:54px;height:54px;background:#eef7ef;border:1px solid #dfebe0;box-shadow:none}.demo-identity .business-type{font-size:7px;margin-bottom:5px}.demo-identity h3{font-size:20px;letter-spacing:-.55px}.demo-identity p{font-size:8px;margin-top:7px;display:flex;align-items:center;gap:5px}.demo-identity p .icon{width:11px;height:11px}.demo-identity .open-text{margin-left:8px}.demo-business-header .profile-buttons{margin-top:0}.demo-business-header .profile-buttons button{font-size:9px;padding:8px 15px}.demo-business-header .profile-buttons .icon{width:13px;height:13px}.demo-banner{display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden;background:#e7f0e6;border-radius:9px;min-height:260px;padding:34px 45px}.demo-banner:before{content:'';position:absolute;width:350px;height:350px;border:1px solid #d1e2cf;border-radius:50%;right:20px;top:-45px}.demo-banner>div{position:relative;z-index:1}.demo-banner .cover-overline{font-size:8px;letter-spacing:1.8px}.demo-banner h3{font-size:34px;color:#2f553f;margin-top:15px}.demo-banner p{font-size:10px;color:#6b856e;margin-top:12px}.demo-banner .btn{font-size:9px;min-height:35px;margin-top:18px}.demo-banner .btn .icon{width:14px;height:14px}.demo-banner>img{position:absolute;right:35px;bottom:-21px;width:420px}.demo-tablist{display:flex;align-items:center;gap:27px;border-bottom:1px solid #e5eae5;margin-top:10px}.demo-tablist button{border:none;background:transparent;padding:17px 0;font-size:10px;color:#8a948c;border-bottom:2px solid transparent}.demo-tablist button[aria-selected=true]{color:#325b42;border-bottom-color:#41846a}.demo-tablist .demo-enquire{margin-left:auto;color:#47765c;display:flex;align-items:center;gap:6px}.demo-enquire .icon{width:14px;height:14px}.demo-panel{padding:22px 0;min-height:255px}.demo-product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.demo-product-grid .product-image{height:170px}.demo-product-grid img{width:245px}.product-info{display:flex;align-items:center;justify-content:space-between;padding-top:12px}.product-info h4{font-size:12px;letter-spacing:-.25px}.product-info p{font-size:9px;margin-top:4px}.product-info button{border:1px solid #e2e9e3;width:25px;height:25px;display:grid;place-items:center;border-radius:50%;background:white;font-size:13px}.demo-footnote{border-top:1px solid #eef0ed;margin-top:0;display:flex;justify-content:space-between;padding:14px 0;font-size:8px;color:#8a948d}.demo-footnote .icon{width:11px;height:11px;margin-right:4px}.demo-footnote strong{color:#506554}.service-grid,.about-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.service-grid article{background:#f6f9f6;border-radius:10px;padding:28px 22px;min-height:220px}.service-grid .icon{color:#4e8e70;margin-bottom:18px}.service-grid h4,.about-grid h4{font-size:15px;letter-spacing:-.3px}.service-grid p,.about-grid p{font-size:12px;margin-top:12px}.gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.gallery-grid figure{background:#ecf3eb;border-radius:10px;padding:15px;display:grid;place-items:center;margin:0}.gallery-grid img{width:240px;height:162px}.gallery-grid figcaption{font-size:10px;color:#58745e}.about-grid{grid-template-columns:1.2fr 1fr;padding:25px 10px;gap:60px}.about-grid .text-link{font-size:11px;margin-top:18px}.business-hours{font-size:11px;margin-top:20px}.business-hours>div{display:flex;justify-content:space-between;border-bottom:1px solid #e5ebe5;padding:8px 0;gap:15px}.business-hours dt{font-weight:500}.business-hours dd{margin:0;color:var(--muted)}[hidden]{display:none!important}
/* Setup steps and value */
.steps-section{border-top:1px solid #edf0f1}.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}.step-number{display:flex;align-items:center;justify-content:space-between;font-size:32px;font-weight:550;letter-spacing:-2px;color:#a3b5ad;border-bottom:1px solid #dce6e0;padding-bottom:20px;position:relative;margin-bottom:23px}.step-number:after{content:'';position:absolute;bottom:-4px;left:0;width:7px;height:7px;background:#7fb99d;border-radius:50%;box-shadow:0 0 0 5px #fff}.step-number .icon{color:#6b9b83;width:24px;height:24px;stroke-width:1.3}.step h3{font-size:13px;letter-spacing:-.25px}.step p{font-size:11px;margin-top:12px;max-width:215px;line-height:1.8}.why-section{background:#f0f7f3;border-block:1px solid #e4eee7;padding:65px 0}.why-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:80px;align-items:center}.why-grid h2{font-size:36px}.why-grid p{margin-top:20px;font-size:12px;line-height:1.8}.why-grid .btn{margin-top:25px;font-size:11px;min-height:44px}.why-benefits{display:grid;grid-template-columns:1fr;gap:17px;padding-left:30px}.why-benefits>div{display:flex;gap:14px;align-items:center;font-size:12px}.why-benefits .icon{border:1px solid #c8e0d1;background:#e3f2e9;color:#488b68;width:23px;height:23px;padding:4px;border-radius:50%}
/* Pricing */
.billing-label{display:inline-flex;align-items:center;gap:7px;font-size:10px;border:1px solid #e2e9e4;border-radius:25px;padding:5px 12px;color:#698271;margin-top:22px;background:#f6faf7}.billing-label .icon{width:12px;height:12px}.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch;max-width:1050px;margin:0 auto}.pricing-card{position:relative;display:flex;flex-direction:column;border:1px solid #e1e7e4;border-radius:14px;padding:32px;background:white}.pricing-card.recommended{border:1.5px solid #66ad8e;background:#f7fcf9;box-shadow:0 10px 30px #245d3a0a}.recommended-label{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:#3b8061;color:white;font-size:8px;letter-spacing:1px;padding:5px 15px;border-radius:20px;white-space:nowrap}.plan-name{font-size:10px;letter-spacing:1.7px;font-weight:650}.plan-description{font-size:10px;margin-top:9px}.plan-price{margin-top:25px;display:flex;align-items:baseline;gap:5px}.plan-price strong{font-size:39px;color:var(--navy);line-height:1.2;font-weight:650;letter-spacing:-2px}.plan-price span{font-size:10px;color:#849087}.plan-billing{font-size:9px;color:#92a095;margin-top:4px}.pricing-card .btn{margin-top:25px;width:100%;font-size:11px;min-height:44px}.plan-divider{height:1px;background:#e5ebe6;margin:25px 0 20px}.plan-feature-label{font-size:10px;font-weight:550;margin-bottom:2px}.plan-features{margin-bottom:0;flex:1}.plan-features li{font-size:11px;color:#68796d;margin-top:13px;padding-left:21px}.plan-features li:before{font-size:12px}.pricing-note{text-align:center;font-size:9px;line-height:1.9;margin-top:25px;color:#929b96}.audience-section{background:#fafbfc;border-block:1px solid #edf0f1;padding-top:78px;padding-bottom:78px}.audience-section h2{font-size:36px}.audience-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.audience-grid>div{background:#fff;border:1px solid #e7eceb;border-radius:10px;display:flex;align-items:center;gap:12px;padding:19px 17px;transition:border-color .2s,transform .2s}.audience-grid>div:hover{border-color:#b7d6c5;transform:translateY(-2px)}.audience-grid .icon{color:#6c9280;width:21px;height:21px}.audience-grid h3{font-size:11px;letter-spacing:-.15px;line-height:1.5}
/* FAQ, call to action and footer */
.faq-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:100px}.faq-section h2{font-size:39px}.faq-list details{border-bottom:1px solid #e5eae7;padding:0}.faq-list summary{font-size:12px;font-weight:550;list-style:none;cursor:pointer;position:relative;padding:19px 32px 19px 0;line-height:1.5}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:'+';position:absolute;right:3px;top:16px;font-size:21px;font-weight:400;color:#7b9485}.faq-list details[open] summary:after{content:'−'}.faq-list details[open] summary{color:#347557}.faq-list p{font-size:11px;line-height:1.9;padding:0 30px 20px 0}.final-cta{padding:76px 0 65px;background:var(--navy);text-align:center;position:relative;overflow:hidden}.final-cta .container{position:relative}.final-cta .eyebrow{color:#93b5a8;font-size:9px;position:relative}.final-cta .status-dot{margin-right:6px;background:#8adbbc;width:5px;height:5px}.final-cta h2{font-size:48px;color:white;line-height:1.15;position:relative}.final-cta h2 span{color:#92dbbf}.final-cta p{color:#9daeb9;font-size:12px;margin-top:20px;position:relative}.final-cta .btn{margin-top:28px;position:relative;font-size:11px;min-height:48px;padding-inline:25px}.cta-caption{display:block;color:#849c9c;font-size:9px;margin-top:16px;position:relative}.cta-orbit{position:absolute;width:560px;height:560px;border:1px solid #ffffff08;border-radius:50%;left:calc(50% - 280px);top:-110px;pointer-events:none}.cta-orbit:after,.cta-orbit:before{content:'';position:absolute;inset:-80px;border:1px solid #ffffff06;border-radius:50%}.cta-orbit:after{inset:-160px}.site-footer{padding:60px 0 0}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:55px;padding-bottom:45px}.footer-brand .brand{font-size:24px}.footer-brand .brand-mark{width:28px;height:30px;font-size:29px}.footer-brand p{font-size:11px;line-height:1.9;margin-top:18px;color:#87918c}.footer-domain{display:flex;align-items:center;gap:8px;font-size:10px;color:#789482;margin-top:18px}.footer-domain .icon{width:12px;height:12px}.footer-grid h3{font-size:11px;letter-spacing:0;margin:5px 0 19px}.footer-grid>div>a:not(.brand),.footer-link{display:block;font-size:10px;color:#7b8781;margin-bottom:10px}.footer-link{border:0;padding:0;background:transparent}.footer-grid a:hover,.footer-link:hover{color:#2e7757}.footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #edf0ed;padding:22px 0;font-size:9px;color:#9aa39e}.tiny-spark{color:#5ba786;margin-left:7px;font-size:14px}.back-to-top{display:grid;place-items:center;position:fixed;bottom:25px;right:25px;width:39px;height:39px;background:var(--navy);border:1px solid #ffffff30;border-radius:50%;color:#fff;box-shadow:0 4px 16px #19253320;z-index:20;opacity:0;visibility:hidden;transform:translateY(15px);transition:.2s}.back-to-top.visible{opacity:1;visibility:visible;transform:translateY(0)}.back-to-top .icon{transform:rotate(-90deg);width:17px}.reveal{opacity:1}.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}.js .reveal.is-visible{opacity:1;transform:none}dialog{width:calc(100% - 36px);max-width:460px;padding:40px;border:1px solid #dbe8e0;border-radius:18px;text-align:center;box-shadow:0 25px 100px #172d3240;background:white;color:var(--text)}dialog::backdrop{background:#122a3580;backdrop-filter:blur(5px)}.dialog-close{position:absolute;right:13px;top:6px;font-size:28px;border:none;background:none;color:#82948a}.dialog-symbol{width:52px;height:52px;background:#edf8f1;color:#529477;border-radius:50%;display:grid;place-items:center;margin:0 auto 22px}dialog .eyebrow{font-size:8px;margin-bottom:10px}dialog h2{font-size:27px}dialog p{font-size:12px;margin:18px 0 24px;line-height:1.9}dialog .btn{font-size:11px}.dialog-dismiss{display:block;background:none;border:0;font-size:10px;color:#71877a;margin:18px auto 0}
/* Responsive */
@media(min-width:1450px){.hero-grid{min-height:790px;gap:60px}.hero h1{font-size:73px}.hero-visual{transform:scale(1.04);transform-origin:left center}}
@media(max-width:1199px){.container{width:calc(100% - 70px)}.nav-shell nav{margin-left:15px}.nav-links{gap:18px}.nav-links a,.login-link{font-size:10px}.nav-actions{gap:16px}.hero h1{font-size:58px}.hero-grid{gap:15px;min-height:705px}.hero-visual{transform:scale(.88);transform-origin:left center;width:520px;margin-left:0}.hero-copy>p{font-size:12px;max-width:380px}.hero-actions{gap:8px;flex-wrap:wrap}.hero-actions .btn{font-size:10px;padding-inline:12px}.hero-reassurance{gap:10px;font-size:8px}.problem-grid{gap:40px}h2{font-size:37px}.feature-card{padding:23px 17px}.feature-card h3{font-size:11px}.demo-identity h3{font-size:17px}.demo-banner>img{right:0;width:380px}.demo-product-grid .product-image{height:150px}.faq-grid{gap:65px}.pricing-card{padding:28px}.audience-grid>div{padding:17px 12px;gap:9px}.audience-grid h3{font-size:10px}}
@media(max-width:991px){.container{width:calc(100% - 48px)}.site-header{height:74px}.brand{font-size:25px}.menu-toggle{width:38px;height:38px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;border:1px solid #dce5df;border-radius:8px;background:#fff}.menu-toggle span{height:1.5px;width:17px;background:var(--navy);transition:.2s}.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3.75px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.75px) rotate(-45deg)}.nav-shell nav{display:none;position:absolute;top:73px;left:0;right:0;margin:0;padding:24px;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 16px 25px #1925330c;max-height:calc(100dvh - 74px);overflow-y:auto}.nav-shell nav.is-open{display:block}.nav-links{display:flex;flex-direction:column;align-items:stretch;gap:0}.nav-links a{padding:10px 0;font-size:13px}.nav-actions{margin-top:15px;justify-content:space-between}.login-link{font-size:13px}.hero-grid{grid-template-columns:1fr 1fr;gap:10px;min-height:650px;padding-top:30px;padding-bottom:30px}.hero h1{font-size:48px;letter-spacing:-2.5px}.hero-copy>p{font-size:11px}.hero-visual{transform:scale(.7);width:520px;margin-left:0;height:605px}.hero-reassurance{flex-wrap:wrap;row-gap:6px;max-width:260px}.badge-label{font-size:7px;padding:5px 9px;letter-spacing:1px;margin-bottom:20px}.hero-actions .btn{min-height:42px;font-size:9px}.hero-copy>p{margin-top:26px}.hero-actions{margin-top:21px}.value-grid>div{font-size:9px;gap:8px}.value-grid .icon{width:17px}.section{padding:75px 0}.problem-grid{grid-template-columns:.85fr 1.15fr;gap:30px}.problem-section h2{font-size:31px}.section-copy p{font-size:11px}.comparison{grid-template-columns:1fr;gap:12px}.before-card,.after-card{padding:20px;margin:0}.before-card .paper-card,.after-card .digital-link{display:none}.comparison h3{margin-top:12px;min-height:0;font-size:11px}.cross-list,.comparison .check-list{display:grid;grid-template-columns:1fr 1fr;gap:0 10px;margin-top:5px}.cross-list li,.comparison .check-list li{font-size:7px;margin-top:9px;padding-left:12px}.features-grid{grid-template-columns:repeat(2,1fr)}.feature-card h3{font-size:13px}.feature-card p{font-size:11px}.feature-icon{margin-bottom:18px}.demo-heading h2{font-size:32px}.demo-heading p{font-size:10px}.demo-heading .text-link{font-size:11px}.full-profile{padding:22px 22px 0}.demo-business-header{align-items:start}.demo-identity h3{font-size:14px}.demo-identity .business-type{font-size:6px}.demo-identity .business-logo{width:43px;height:43px;font-size:23px}.demo-identity p{font-size:7px;flex-wrap:wrap}.demo-identity .open-text{margin:0}.demo-business-header .profile-buttons button{padding:7px 10px;font-size:8px}.demo-banner{min-height:235px;padding:28px}.demo-banner h3{font-size:29px}.demo-banner>img{width:320px;right:-20px}.demo-product-grid{gap:12px}.demo-product-grid .product-image{height:125px}.product-info h4{font-size:10px}.product-info p{font-size:7px}.steps-grid{gap:20px}.step h3{font-size:11px}.step p{font-size:10px}.why-grid{gap:35px;grid-template-columns:1.2fr 1fr}.why-grid h2{font-size:29px}.why-benefits{padding-left:0;gap:15px}.why-benefits>div{font-size:10px}.pricing-grid{gap:14px}.pricing-card{padding:25px 20px}.plan-price strong{font-size:32px}.plan-features li{font-size:10px;padding-left:17px}.plan-description{font-size:9px}.plan-price span{font-size:9px}.audience-grid{gap:10px}.audience-grid>div{flex-direction:column;text-align:center;padding:20px 10px}.audience-grid h3{font-size:10px}.audience-section h2{font-size:31px}.faq-grid{gap:45px;grid-template-columns:.8fr 1.2fr}.faq-section h2{font-size:32px}.faq-list summary{font-size:11px}.faq-list p{font-size:10px}.footer-grid{gap:30px}.footer-grid>div>a:not(.brand),.footer-link{font-size:9px}.footer-brand p{font-size:10px}.footer-bottom{font-size:8px}}
@media(max-width:767px){.container{width:calc(100% - 40px)}.hero-grid{grid-template-columns:1fr;padding-top:42px;padding-bottom:48px;gap:22px;min-height:0}.hero-copy{text-align:center}.hero h1{font-size:61px;letter-spacing:-3px}.hero h1 br:nth-of-type(2){display:none}.hero h1 br:nth-of-type(2):after{content:' '}.hero h1{max-width:520px;margin:0 auto}.hero-copy>p{font-size:13px;max-width:440px;margin:29px auto 0}.hero-actions{justify-content:center;margin-top:24px}.hero-actions .btn{font-size:11px;padding-inline:18px;min-height:48px}.hero-reassurance{justify-content:center;max-width:none;font-size:9px;gap:15px;margin-top:18px}.badge-label{font-size:8px;padding:6px 11px;margin-bottom:23px}.hero-visual{width:520px;height:605px;transform:scale(.87);transform-origin:top center;margin:5px auto -70px;left:0}.browser-preview{left:22px}.phone-preview{right:-2px}.qr-float{left:4px}.value-grid{grid-template-columns:1fr 1fr;padding:10px 0}.value-grid>div{font-size:10px;justify-content:start;padding:14px 7px;border:0}.section{padding:65px 0}.problem-grid{grid-template-columns:1fr;gap:35px}.section-copy p{font-size:13px;max-width:500px}.problem-section h2{font-size:35px}.problem-section h2 br:nth-child(1){display:none}.comparison{grid-template-columns:1fr 1fr;gap:12px}.before-card,.after-card{padding:20px 17px}.comparison .paper-card,.comparison .digital-link{display:block;margin:25px 0}.comparison .digital-link{display:flex;padding:14px 6px}.comparison h3{font-size:12px}.cross-list,.comparison .check-list{display:block}.cross-list li,.comparison .check-list li{font-size:8px;margin-top:12px}.eyebrow{font-size:8px;letter-spacing:1.4px;margin-bottom:16px}h2{font-size:34px}.section-heading{margin-bottom:33px}.section-heading p{font-size:12px;line-height:1.8;margin-top:17px}.feature-card{padding:22px 18px}.feature-card h3{font-size:12px}.feature-card p{font-size:10px}.features-grid{gap:13px}.demo-heading{display:block}.demo-heading>div+div{margin-top:20px}.demo-heading h2{font-size:35px}.demo-heading p{font-size:12px}.demo-heading p br{display:none}.demo-heading .text-link{font-size:12px;margin-top:14px}.demo-stage{padding:7px;border-radius:12px}.demo-toolbar{padding:7px 5px 13px;gap:9px}.demo-url{font-size:7px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sample-tag{display:none}.full-profile{padding:18px 17px 0}.demo-business-header{display:block;margin-bottom:18px}.demo-identity{gap:10px}.demo-identity h3{font-size:15px}.demo-identity p{font-size:8px;gap:4px}.demo-identity .business-type{font-size:6px}.demo-identity .business-logo{width:43px;min-width:43px;height:43px}.demo-business-header .profile-buttons{margin-top:16px}.demo-business-header .profile-buttons button{font-size:10px;flex:1;min-height:36px}.demo-banner{padding:24px 20px;min-height:280px;align-items:flex-start}.demo-banner .cover-overline{font-size:6px;letter-spacing:1px}.demo-banner h3{font-size:28px;margin-top:11px}.demo-banner p{font-size:8px;max-width:145px}.demo-banner .btn{font-size:8px;padding-inline:10px;margin-top:14px}.demo-banner>img{width:260px;right:-35px;bottom:-8px}.demo-banner:before{width:250px;height:250px;top:90px;right:-20px}.demo-tablist{gap:18px;flex-wrap:wrap;position:relative;margin-top:6px;row-gap:0;padding-bottom:0}.demo-tablist button{font-size:9px;padding:14px 0}.demo-tablist .demo-enquire{flex-basis:100%;padding:10px 0;margin-top:-1px;border-top:1px solid #eef0ed;font-size:9px}.demo-panel{padding:16px 0;min-height:240px}.demo-product-grid{grid-template-columns:1fr 1fr;gap:16px 10px}.demo-product-grid>article:last-child{grid-column:1/-1;display:flex;align-items:center;gap:15px}.demo-product-grid>article:last-child .product-image{width:48%;height:95px;flex-shrink:0}.demo-product-grid>article:last-child .product-info{flex:1;align-items:start;gap:5px}.demo-product-grid .product-image{height:113px}.product-info h4{font-size:10px}.product-info p{font-size:8px;max-width:110px}.product-info button{width:23px;height:23px;flex-shrink:0}.demo-footnote{font-size:6px;gap:12px;align-items:center;line-height:1.6}.demo-footnote>span+span{white-space:nowrap}.demo-footnote .icon{width:9px;height:9px}.service-grid{grid-template-columns:1fr;gap:10px}.service-grid article{min-height:0;padding:18px}.service-grid .icon{margin-bottom:10px}.service-grid h4{font-size:13px}.service-grid p{font-size:10px;margin-top:8px}.gallery-grid{gap:12px;grid-template-columns:1fr}.gallery-grid img{width:230px;height:150px}.gallery-grid figcaption{font-size:9px}.about-grid{grid-template-columns:1fr;gap:30px;padding:12px 0}.about-grid h4{font-size:14px}.about-grid p{font-size:11px}.steps-grid{grid-template-columns:1fr 1fr;gap:35px 25px}.step-number{margin-bottom:17px;padding-bottom:15px}.step h3{font-size:13px}.step p{font-size:11px;max-width:250px}.why-section{padding:50px 0}.why-grid{grid-template-columns:1fr;gap:35px}.why-grid h2{font-size:34px}.why-grid p{font-size:12px}.why-benefits{grid-template-columns:1fr 1fr;gap:20px 15px}.why-benefits>div{font-size:10px;gap:9px;align-items:start}.why-benefits .icon{width:20px;height:20px}.pricing-grid{grid-template-columns:1fr;max-width:440px;gap:28px}.pricing-card{padding:30px}.plan-name{font-size:11px}.plan-description{font-size:11px}.plan-price strong{font-size:43px}.plan-price span{font-size:11px}.plan-billing{font-size:10px}.pricing-card .btn{font-size:12px}.plan-feature-label{font-size:11px}.plan-features{display:grid;grid-template-columns:1fr 1fr;gap:0 15px}.plan-features li{font-size:10px}.pricing-note{font-size:8px}.billing-label{font-size:9px}.audience-section h2{font-size:32px}.audience-grid{grid-template-columns:1fr 1fr;gap:12px}.audience-grid>div{padding:20px 12px;gap:12px}.audience-grid h3{font-size:11px}.faq-grid{grid-template-columns:1fr;gap:30px}.faq-section h2{font-size:35px}.faq-section .section-copy p{font-size:12px}.faq-list summary{font-size:12px;padding-block:18px}.faq-list p{font-size:11px}.final-cta{padding:62px 0 55px}.final-cta h2{font-size:38px}.final-cta p{font-size:12px;max-width:400px;margin-inline:auto}.final-cta .eyebrow{font-size:7px;letter-spacing:1.2px}.site-footer{padding-top:45px}.footer-grid{grid-template-columns:repeat(3,1fr);gap:35px 18px;padding-bottom:30px}.footer-brand{grid-column:1/-1}.footer-brand p{font-size:11px}.footer-grid>div>a:not(.brand),.footer-link{font-size:9px}.footer-grid h3{font-size:11px;margin-bottom:17px}.footer-bottom{flex-direction:column;gap:8px;font-size:8px;padding:20px 0}.back-to-top{bottom:18px;right:15px;width:35px;height:35px}.desktop-only{display:none}}
@media(max-width:480px){.hero h1{font-size:49px;letter-spacing:-2.5px}.hero h1 br:nth-of-type(2){display:block}.hero h1 br:nth-of-type(3){display:none}.hero-visual{width:520px;left:calc(50% - 260px);margin-left:0;margin-right:0;transform:scale(.65);margin-bottom:-190px}.hero-copy>p{font-size:12px;line-height:1.85}.hero-actions{gap:8px}.hero-actions .btn{font-size:9px;padding-inline:12px;gap:7px;min-height:44px}.hero-actions .icon{width:15px}.hero-reassurance{gap:10px;font-size:7px}.badge-label{font-size:7px}.hero-grid{padding-top:35px;gap:26px}.value-grid>div{font-size:8px;gap:7px;padding-inline:0}.value-grid .icon{width:17px;height:17px}.comparison{gap:9px}.before-card,.after-card{padding:18px 12px}.comparison h3{font-size:10px}.comparison-label{font-size:6px}.cross-list li,.comparison .check-list li{font-size:7px;padding-left:12px}.digital-link .icon{display:none}.digital-link>span:nth-child(2){font-size:5px}.digital-link strong{font-size:8px}.section-copy h2,h2{font-size:30px}.section-heading p{font-size:11px}.feature-card{padding:19px 14px}.feature-card h3{font-size:11px;line-height:1.4}.feature-card p{font-size:9px}.feature-icon{width:35px;height:35px;margin-bottom:17px}.feature-icon .icon{width:18px;height:18px}.card-index{top:25px;right:14px;font-size:7px}.demo-heading h2{font-size:30px}.demo-identity h3{font-size:12px}.demo-identity p{font-size:6px}.demo-identity .business-type{font-size:5px;letter-spacing:.8px}.demo-banner h3{font-size:25px}.demo-banner>img{width:245px;right:-32px;bottom:-5px}.demo-banner .btn{margin-top:12px}.demo-tablist{gap:17px}.demo-tablist button{font-size:8px}.product-info h4{font-size:9px}.product-info p{font-size:7px}.demo-product-grid .product-image{height:95px}.why-grid h2{font-size:29px}.why-benefits>div{font-size:9px}.audience-section h2{font-size:29px}.faq-section h2{font-size:31px}.final-cta h2{font-size:32px}.final-cta p{font-size:11px}.plan-features{display:block}.pricing-card{padding:28px}.plan-features li{font-size:11px}.footer-grid{gap:30px 12px}.footer-grid>div>a:not(.brand),.footer-link{font-size:8px}dialog{padding:34px 25px}dialog h2{font-size:24px}}
/* Fixed-width device artwork must not enlarge the grid's intrinsic tracks. */
.hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.04fr)}
.hero-copy{min-width:0}
.menu-toggle{min-width:44px;min-height:44px}
@media(max-width:767px){.hero-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:360px){.hero h1{font-size:40px;letter-spacing:-2px}.hero-visual{transform:scale(.53);margin-bottom:-260px}.hero-actions{flex-direction:column;align-items:center}.hero-actions .btn{min-width:195px;font-size:10px}.hero-reassurance{font-size:6.5px;gap:6px}.demo-tablist{gap:12px}.demo-banner{padding-inline:15px}.demo-banner h3{font-size:22px}.demo-banner>img{width:220px}.demo-identity h3{font-size:11px}.demo-identity .open-text{display:block}.full-profile{padding-inline:12px}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:last-child{grid-column:1/-1}.footer-grid>div>a:not(.brand),.footer-link{font-size:10px}}
/* Editorial type scale and tonal card surfaces. Keep the device previews at
   their own miniature scale; marketing content uses comfortable reading sizes. */
:root {
  --sage-surface: #eaf3ed;
  --ivory-surface: #f7f1e5;
  --blue-surface: #eaf0f7;
  --lilac-surface: #f0edf6;
  --muted: #5f6e7e;
}
body { font-size: 16px; }
.eyebrow { font-size: 12px; letter-spacing: 1.7px; }
.badge-label { font-size: 11px; }
.nav-shell nav { margin-left: 28px; }
.nav-links { gap: 22px; }
.nav-links a, .login-link { font-size: 14px; }
.btn, .btn-small, .hero-actions .btn, .why-grid .btn,
.final-cta .btn, .pricing-card .btn { font-size: 14px; min-height: 50px; }
.hero-copy > p { font-size: 17px; line-height: 1.85; max-width: 485px; }
.hero-reassurance { font-size: 11px; gap: 14px; }
.hero-reassurance .icon { width: 15px; height: 15px; }
.value-grid > div { font-size: 14px; gap: 11px; }
.value-grid { padding-block: 30px; }
.section-heading p, .section-copy p, .demo-heading p,
.why-grid p, .final-cta p { font-size: 16px; line-height: 1.85; }
.text-link, .demo-heading .text-link { font-size: 15px; }
.section-copy p { max-width: 420px; }
.muted-heading { color: #78858e; }

/* Feature cards: an intentional collection of rich and quiet surfaces. */
.features-section { background: #f7f8f6; }
.features-grid { gap: 20px; }
.feature-card {
  --card-ink: #365e4a;
  padding: 29px 25px 31px;
  border-radius: 18px;
  border-color: #dce6de;
  background: var(--sage-surface);
  box-shadow: inset 0 1px 0 #ffffff8c, 0 4px 14px #223b2e04;
}
.feature-card:nth-child(2), .feature-card:nth-child(7) {
  --card-ink: #8a6c3c;
  background: var(--ivory-surface);
  border-color: #e8dfce;
}
.feature-card:nth-child(4) {
  --card-ink: #476b91;
  background: var(--blue-surface);
  border-color: #dce4ee;
}
.feature-card:nth-child(5) {
  --card-ink: #77618d;
  background: var(--lilac-surface);
  border-color: #e3dcec;
}
.feature-card:nth-child(1), .feature-card:nth-child(8) {
  --card-ink: #a6e4cb;
  background: #203b3a;
  border-color: #2f504c;
  box-shadow: inset 0 1px 0 #ffffff12, 0 8px 22px #1c38330c;
}
.feature-card:nth-child(8) { background: #25364c; border-color: #34465e; }
.feature-icon {
  width: 48px; height: 48px; border-radius: 14px;
  background: #ffffff8c; border-color: #ffffffa3;
  color: var(--card-ink); margin-bottom: 28px;
}
.feature-icon .icon { width: 24px; height: 24px; }
.feature-card h3 { font-size: 18px; line-height: 1.4; margin-bottom: 12px; }
.feature-card p { font-size: 15px; line-height: 1.8; color: #5e6d69; }
.feature-card:nth-child(1) h3, .feature-card:nth-child(8) h3 { color: #f5faf7; }
.feature-card:nth-child(1) p, .feature-card:nth-child(8) p { color: #bdcec8; }
.feature-card:nth-child(1) .feature-icon,
.feature-card:nth-child(8) .feature-icon { background: #ffffff0c; border-color: #ffffff1c; }
.card-index { font-size: 11px; top: 36px; right: 25px; color: var(--card-ink); opacity: .65; }
.feature-card:hover { border-color: #87b49d; box-shadow: 0 16px 30px #25463710; }

/* Before and after: larger copy, warm paper and a confident sage finish. */
.before-card, .after-card { padding: 27px 23px; border-radius: 18px; }
.before-card { background: #f7f3ed; border-color: #e8e1d6; }
.after-card { background: #e5f0e8; border-color: #c5d9cb; }
.comparison-label { font-size: 10px; }
.comparison h3 { font-size: 17px; min-height: 50px; }
.comparison .cross-list li, .comparison .check-list li {
  font-size: 13px; line-height: 1.75; padding-left: 18px;
}
.comparison .cross-list li { color: #7a756c; }
.comparison .check-list li { color: #42634e; }
.comparison .cross-list li:before, .comparison .check-list li:before { font-size: 14px; }
.paper-card > span { font-size: 11px; }
.paper-card small { font-size: 9px; }
.digital-link { min-height: 80px; gap: 9px; }
.digital-link > span:nth-child(2) { font-size: 10px; }
.digital-link strong { font-size: 12px; }

/* Full-size interactive profile (the hero device artwork remains miniature). */
.demo-url { font-size: 12px; }
.sample-tag { font-size: 10px; }
.demo-identity .business-type { font-size: 10px; }
.demo-identity h3 { font-size: 22px; }
.demo-identity p { font-size: 12px; }
.demo-business-header .profile-buttons button { font-size: 13px; min-height: 42px; }
.demo-banner .cover-overline { font-size: 10px; }
.demo-banner p { font-size: 14px; }
.demo-banner .btn { font-size: 12px; min-height: 42px; }
.demo-tablist button { font-size: 14px; min-height: 48px; }
.demo-product-grid article { background: #f8faf7; border: 1px solid #e5ebe1; padding: 10px; border-radius: 13px; }
.product-info { padding: 15px 5px 7px; }
.product-info h4 { font-size: 16px; }
.product-info p { font-size: 12px; }
.product-info button { width: 32px; height: 32px; }
.demo-footnote { font-size: 11px; }
.service-grid h4, .about-grid h4 { font-size: 18px; }
.service-grid p, .about-grid p, .business-hours { font-size: 14px; }
.gallery-grid figcaption { font-size: 13px; }

.step h3 { font-size: 18px; line-height: 1.4; }
.step p { font-size: 15px; line-height: 1.85; max-width: none; }
.step-number { font-size: 40px; }
.why-benefits > div { font-size: 15px; line-height: 1.65; }
.why-benefits { gap: 22px; }

/* Annual plans: ivory, deep navy, and porcelain blue. */
.pricing-grid { max-width: 1140px; gap: 24px; }
.pricing-card { background: #fbf7ef; border-color: #e9e1d2; padding: 34px 29px; border-radius: 20px; }
.pricing-card:nth-child(3) { background: #eff3f8; border-color: #dbe4ef; }
.pricing-card.recommended { background: #192d36; border-color: #29454b; box-shadow: 0 18px 40px #192d361c; }
.recommended-label { background: #8cdbb9; color: #193c30; font-size: 10px; padding: 6px 17px; top: -15px; }
.plan-name { font-size: 13px; letter-spacing: 1.6px; }
.plan-description { font-size: 14px; line-height: 1.7; min-height: 48px; }
.plan-price strong { font-size: 47px; }
.plan-price span { font-size: 14px; }
.plan-billing { font-size: 12px; }
.plan-feature-label { font-size: 13px; }
.plan-features li { font-size: 14px; margin-top: 15px; line-height: 1.65; }
.billing-label { font-size: 12px; padding: 7px 15px; }
.pricing-note { font-size: 12px; }
.recommended .plan-name, .recommended .plan-price strong { color: #f4faf8; }
.recommended .plan-description, .recommended .plan-billing,
.recommended .plan-price span, .recommended .plan-features li { color: #bbccc9; }
.recommended .plan-feature-label { color: #e4efea; }
.recommended .plan-divider { background: #ffffff20; }
.recommended .btn { color: #17382e; background: #9ae0c2; border-color: #9ae0c2; }
.recommended .btn:hover { background: #b7edd6; border-color: #b7edd6; }
.recommended .plan-features li:before { color: #8bdbba; }

/* Audience tiles have tactile surfaces and generous icon containers. */
.audience-section { background: #faf9f6; }
.audience-grid { gap: 16px; }
.audience-grid > div { min-height: 100px; padding: 23px 18px; gap: 14px; border-radius: 15px; background: #edf3ed; border-color: #dde6db; box-shadow: inset 0 1px 0 #ffffff9c; }
.audience-grid > div:nth-child(4n + 2) { background: #f5eee2; border-color: #e9dfd0; }
.audience-grid > div:nth-child(4n + 3) { background: #eaf0f6; border-color: #dce4ee; }
.audience-grid > div:nth-child(4n) { background: #f0edf4; border-color: #e3ddeb; }
.audience-grid .icon { width: 43px; height: 43px; padding: 10px; border-radius: 12px; background: #ffffffa6; color: #4c735f; }
.audience-grid > div:nth-child(4n + 2) .icon { color: #947342; }
.audience-grid > div:nth-child(4n + 3) .icon { color: #4d7396; }
.audience-grid > div:nth-child(4n) .icon { color: #816a91; }
.audience-grid h3 { font-size: 15px; line-height: 1.5; }
.audience-grid > div:hover { border-color: #adc7b2; box-shadow: 0 8px 22px #304d3710; }

.faq-list summary { font-size: 17px; padding-block: 22px; }
.faq-list summary:after { top: 20px; }
.faq-list p { font-size: 15px; }
.final-cta .eyebrow { font-size: 11px; }
.cta-caption { font-size: 12px; }
.footer-brand p { font-size: 14px; }
.footer-grid h3 { font-size: 14px; }
.footer-grid > div > a:not(.brand), .footer-link { font-size: 13px; margin-bottom: 13px; }
.footer-domain, .footer-bottom { font-size: 12px; }
dialog p { font-size: 15px; }
dialog .btn { font-size: 14px; }
.dialog-dismiss { font-size: 13px; }

@media (min-width: 992px) and (max-width: 1199px) {
  .nav-links { gap: 14px; }
  .nav-links a, .login-link { font-size: 12px; }
  .nav-shell nav { margin-left: 5px; }
  .nav-actions { gap: 14px; }
  .nav-actions .btn { padding-inline: 12px; font-size: 12px; }
}
@media (max-width: 1199px) {
  .features-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .feature-card h3 { font-size: 19px; }
  .feature-card p { font-size: 15px; }
  .hero-actions { flex-wrap: wrap; }
  .hero-reassurance { flex-wrap: wrap; }
  .value-grid > div { font-size: 12px; }
  .comparison { grid-template-columns: 1fr; gap: 15px; }
  .before-card { margin: 0; }
  .comparison .paper-card, .comparison .digital-link { display: none; }
  .comparison h3 { min-height: 0; margin-top: 14px; }
  .comparison .cross-list, .comparison .check-list { display: block; }
  .audience-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .audience-grid > div { flex-direction: row; text-align: left; }
  .pricing-card { padding: 30px 22px; }
  .plan-description { font-size: 13px; }
}
@media (max-width: 991px) {
  .nav-shell nav { margin-left: 0; }
  .nav-links a, .login-link { font-size: 16px; }
  .hero-copy > p { font-size: 15px; }
  .hero-actions .btn { font-size: 12px; padding-inline: 15px; }
  .hero-reassurance { font-size: 10px; }
  .hero-grid { padding-block: 55px; }
  .badge-label { font-size: 9px; }
  .demo-business-header { flex-wrap: wrap; }
  .demo-identity h3 { font-size: 19px; }
  .demo-identity p { font-size: 11px; }
  .demo-tablist { gap: 20px; }
  .demo-tablist button { font-size: 12px; }
  .demo-product-grid { gap: 10px; }
  .product-info h4 { font-size: 14px; }
  .product-info p { font-size: 11px; }
  .why-grid { grid-template-columns: 1fr; gap: 35px; }
  .why-benefits { grid-template-columns: 1fr 1fr; padding: 0; }
  .plan-price strong { font-size: 36px; }
  .plan-price span { font-size: 12px; }
  .plan-features li { font-size: 12px; }
  .plan-feature-label, .plan-billing { font-size: 11px; }
  .pricing-card .btn { font-size: 12px; padding-inline: 10px; }
  .footer-grid { gap: 35px 22px; }
}
@media (max-width: 767px) {
  .hero-grid { padding-top: 42px; padding-bottom: 48px; }
  .hero-copy > p { font-size: 16px; }
  .hero-actions .btn { font-size: 13px; }
  .hero-reassurance { font-size: 10px; gap: 12px; }
  .eyebrow { font-size: 10px; }
  .badge-label { font-size: 9px; }
  .value-grid > div { font-size: 11px; align-items: flex-start; padding-block: 14px; }
  .value-grid { gap: 0 12px; padding-block: 15px; }
  .value-grid .icon { margin-top: 2px; }
  .section-heading p, .section-copy p, .demo-heading p,
  .why-grid p, .final-cta p { font-size: 15px; }
  .feature-card { padding: 25px 21px; }
  .feature-card h3 { font-size: 17px; }
  .feature-card p { font-size: 14px; }
  .card-index { top: 31px; right: 21px; }
  .comparison h3 { font-size: 18px; }
  .comparison .cross-list li, .comparison .check-list li { font-size: 14px; }
  .comparison-label { font-size: 10px; }
  .demo-url { font-size: 9px; }
  .demo-identity .business-type { font-size: 8px; letter-spacing: .8px; }
  .demo-identity h3 { font-size: 16px; line-height: 1.35; }
  .demo-identity p { font-size: 10px; }
  .demo-banner { min-height: 340px; }
  .demo-banner .cover-overline { font-size: 8px; }
  .demo-banner p { font-size: 12px; max-width: 190px; }
  .demo-banner .btn { font-size: 10px; }
  .demo-tablist { gap: 18px; }
  .demo-tablist button, .demo-tablist .demo-enquire { font-size: 11px; }
  .demo-product-grid { grid-template-columns: 1fr; gap: 15px; }
  .demo-product-grid > article:last-child { display: block; }
  .demo-product-grid > article:last-child .product-image { width: 100%; height: 150px; }
  .demo-product-grid .product-image { height: 150px; }
  .product-info h4 { font-size: 16px; }
  .product-info p { font-size: 12px; max-width: none; }
  .demo-footnote { font-size: 9px; }
  .step h3 { font-size: 17px; }
  .step p { font-size: 14px; }
  .why-benefits > div { font-size: 13px; }
  .why-benefits { gap: 20px 14px; }
  .pricing-card { padding: 32px 28px; }
  .plan-name { font-size: 13px; }
  .plan-description { font-size: 14px; min-height: 0; }
  .plan-price strong { font-size: 46px; }
  .plan-price span { font-size: 14px; }
  .plan-billing { font-size: 12px; }
  .plan-features { display: block; }
  .plan-features li { font-size: 14px; }
  .plan-feature-label { font-size: 13px; }
  .pricing-card .btn { font-size: 14px; }
  .billing-label { font-size: 11px; }
  .pricing-note { font-size: 11px; }
  .audience-grid > div { flex-direction: column; text-align: center; padding: 24px 15px; gap: 14px; }
  .audience-grid h3 { font-size: 14px; }
  .faq-list summary { font-size: 16px; }
  .faq-list p { font-size: 14px; }
  .final-cta .eyebrow { font-size: 9px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 35px 24px; }
  .footer-grid > div:last-child { grid-column: auto; }
  .footer-grid > div > a:not(.brand), .footer-link { font-size: 13px; }
  .footer-bottom { font-size: 11px; }
}
@media (max-width: 480px) {
  .features-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .feature-card { padding: 28px; }
  .feature-card h3 { font-size: 20px; }
  .feature-card p { font-size: 15px; }
  .feature-icon { margin-bottom: 23px; }
  .card-index { right: 28px; top: 36px; }
  .hero-actions { flex-direction: column; align-items: center; }
  .hero-actions .btn { min-width: 230px; font-size: 13px; }
  .hero-reassurance { font-size: 10px; gap: 8px 12px; }
  .hero-reassurance > span { white-space: normal; }
  .value-grid > div { font-size: 11px; }
  .demo-identity .business-type { font-size: 7px; }
  .demo-identity h3 { font-size: 15px; }
  .demo-identity .open-text { display: block; width: 100%; }
  .demo-banner .btn { font-size: 10px; padding-inline: 12px; }
  .why-benefits { grid-template-columns: 1fr; }
  .why-benefits > div { font-size: 14px; }
  .steps-grid { grid-template-columns: 1fr; gap: 28px; }
  .step { padding-left: 24px; border-left: 1px solid #d5e3d9; }
  .step-number { margin-bottom: 17px; padding-bottom: 12px; font-size: 34px; }
  .step p { font-size: 15px; }
  .audience-grid { gap: 12px; }
  .audience-grid h3 { font-size: 13px; }
  .faq-list summary { font-size: 16px; }
  .footer-grid h3 { font-size: 14px; }
  .footer-domain { font-size: 12px; }
}
/* My Portal monogram. */
.brand-mark { font-size: 24px; padding: 0 3px 4px 0; }
.brand-mark > span { width: 5px; height: 5px; right: 4px; bottom: 5px; }
.footer-brand .brand-mark { font-size: 22px; }
.digital-link .brand-mark { font-size: 17px; }

/* FAQ: centered introduction and two independent accordion columns. */
.faq-section { background: #f7f9f7; border-top: 1px solid #e8eee8; }
.faq-grid { display: block; max-width: 1140px; }
.faq-heading { margin-bottom: 42px; }
.faq-heading h2 { font-size: clamp(30px, 3.1vw, 43px); line-height: 1.25; }
.faq-heading p { max-width: 600px; margin-inline: auto; }
.faq-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; align-items: start; }
.faq-column { min-width: 0; }
.faq-category { display: flex; align-items: center; gap: 9px; font-size: 14px; letter-spacing: -.15px; font-weight: 600; color: #486756; margin: 0 3px 18px; }
.faq-category .icon { width: 18px; height: 18px; }
.faq-category > span { margin-left: auto; color: #8e9b90; font-size: 10px; font-weight: 450; letter-spacing: 1px; }
.faq-list details { background: #fff; border: 1px solid #e0e7df; border-radius: 12px; margin-bottom: 12px; padding: 0; box-shadow: 0 2px 5px #27433203; transition: background .2s, border-color .2s; }
.faq-list details:last-child { margin-bottom: 0; }
.faq-list details:hover { border-color: #b4cdbb; }
.faq-list details[open] { background: #edf5ef; border-color: #bdd6c5; }
.faq-list summary { padding: 21px 57px 21px 21px; font-size: 16px; line-height: 1.55; font-weight: 550; }
.faq-list summary:after { width: 25px; height: 25px; right: 18px; top: 21px; display: grid; place-items: center; border: 1px solid #e2eae3; border-radius: 50%; background: #f8fbf8; color: #52775d; font-size: 19px; line-height: 1; }
.faq-list details[open] summary { color: #2b6045; }
.faq-list details[open] summary:after { background: #dcece0; border-color: #c7dece; }
.faq-list p { padding: 0 23px 23px; font-size: 15px; line-height: 1.85; color: #5e7165; overflow-wrap: anywhere; }
.faq-help { display: flex; align-items: center; gap: 15px; padding: 24px 28px; margin-top: 30px; border: 1px solid #e7dfcf; background: #f6f1e7; border-radius: 14px; }
.faq-help-icon { width: 43px; height: 43px; display: grid; place-items: center; border: 1px solid #e7decc; background: #fffcf5; border-radius: 12px; color: #8b754e; flex-shrink: 0; }
.faq-help h3 { font-size: 16px; letter-spacing: -.3px; }
.faq-help p { font-size: 13px; margin-top: 5px; color: #827865; }
.faq-help .text-link { margin-left: auto; white-space: nowrap; font-size: 14px; min-height: 44px; }
@media(max-width:767px) {
  .faq-list { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .faq-heading { margin-bottom: 32px; }
  .faq-heading p { font-size: 15px; }
  .faq-category { font-size: 13px; margin-bottom: 14px; }
  .faq-list summary { font-size: 16px; padding-left: 19px; }
  .faq-list p { font-size: 14px; padding-inline: 19px; }
  .faq-help { flex-wrap: wrap; padding: 23px 20px; gap: 13px; }
  .faq-help h3 { font-size: 15px; }
  .faq-help p { font-size: 12px; }
  .faq-help .text-link { width: 100%; justify-content: center; margin: 3px 0 0; border-top: 1px solid #e6ddcb; padding-top: 15px; }
}
.login-dialog { max-width: 480px; padding: 38px 34px 27px; }
.login-emblem { width: 56px; height: 56px; border: 1px solid #d6e7dc; border-radius: 17px; background: #edf5ef; color: #42765a; display: grid; place-items: center; margin: 0 auto 24px; }
.login-emblem .icon { width: 25px; height: 25px; }
.login-dialog .eyebrow { font-size: 10px; }
.login-dialog #login-description { font-size: 15px; margin: 14px 0 26px; }
.login-dialog form { text-align: left; }
.login-dialog label, .otp-fieldset legend { display: block; font-size: 13px; font-weight: 600; margin-bottom: 9px; }
.mobile-field { display: flex; align-items: center; border: 1px solid #d5e0d8; border-radius: 9px; background: #fbfdfb; overflow: hidden; }
.mobile-field:focus-within { border-color: #58a37d; box-shadow: 0 0 0 3px #17b89013; }
.mobile-field > span { padding: 0 15px; border-right: 1px solid #dce5de; font-size: 15px; font-weight: 550; }
.mobile-field input { width: 100%; min-width: 0; border: 0; background: transparent; padding: 15px 12px; font-size: 15px; color: var(--navy); outline: 0; }
.mobile-field input::placeholder { font-size: 13px; color: #8b9890; }
.field-hint { display: block; font-size: 11px; color: #829087; margin-top: 8px; }
.login-submit { width: 100%; margin-top: 25px; }
.login-submit:disabled { opacity: .42; cursor: not-allowed; transform: none; box-shadow: none; }
.login-dialog .login-demo-note { border-top: 1px solid #e8ede8; margin: 25px 0 0; padding-top: 17px; font-size: 11px; line-height: 1.7; color: #829086; }
.login-demo-note strong { font-weight: 650; color: #3c6d51; letter-spacing: .5px; }
.otp-recipient { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; color: #5e7165; margin-bottom: 23px; }
#change-mobile { background: none; padding: 5px 0; border: 0; color: #347957; font-size: 12px; font-weight: 550; }
.otp-fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.otp-fieldset legend { float: none; width: auto; }
.otp-inputs { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 9px; }
.otp-inputs input { width: 100%; height: 56px; text-align: center; background: #f7faf7; border: 1px solid #d5e1d7; border-radius: 9px; font-size: 23px; font-weight: 600; color: var(--navy); padding: 0; caret-color: #358565; }
.otp-inputs input:focus { border-color: #4c9e72; outline: 2px solid #17b89025; outline-offset: 1px; background: #fff; }
.otp-inputs input[aria-invalid=true] { border-color: #bd6c60; }
.login-dialog .login-error { color: #a34537; font-size: 12px; margin: 12px 0 0; line-height: 1.6; }
.login-error:empty { display: none; }
.login-success { padding: 9px 0; }
.login-success-check { margin: 0 auto 15px; display: grid; place-items: center; width: 65px; height: 65px; border-radius: 50%; background: #e3f4e9; color: #329165; }
.login-success-check .icon { width: 30px; height: 30px; }
.login-success strong { display: block; font-size: 20px; color: #2d6c4b; }
.login-dialog .login-success p { font-size: 14px; margin: 9px 0 0; }
@media(max-width:480px) { .login-dialog { padding: 32px 22px 23px; } .otp-inputs { gap: 6px; } .otp-inputs input { height: 49px; font-size: 20px; } .login-dialog #login-description { font-size: 14px; } }
.registration-dialog { width: calc(100% - 32px); max-width: 620px; max-height: calc(100dvh - 36px); padding: 34px; text-align: left; overflow-y: auto; overscroll-behavior: contain; }
.registration-heading .eyebrow { font-size: 10px; margin-bottom: 11px; }
.registration-heading h2 { font-size: 28px; padding-right: 10px; }
.registration-dialog .registration-heading p { font-size: 14px; margin: 12px 0 26px; }
.registration-field { margin-bottom: 18px; min-width: 0; }
.registration-field label { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; font-weight: 600; margin-bottom: 8px; }
.registration-field > input, .registration-field select { width: 100%; min-height: 46px; border: 1px solid #d7e1d9; border-radius: 8px; padding: 11px 13px; background: #fbfdfb; font-size: 14px; color: var(--navy); }
.registration-field input::placeholder { color: #8a978f; font-size: 13px; }
.registration-field > input:focus, .registration-field select:focus { outline: 2px solid #17b89020; outline-offset: 1px; border-color: #69a986; background: #fff; }
.registration-two-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.registration-phone-row { display: flex; align-items: stretch; gap: 10px; }
.registration-phone-row .mobile-field { flex: 1; min-width: 0; }
.registration-phone-row .mobile-field input { padding-block: 11px; }
.registration-phone-row .btn { min-height: 46px; font-size: 12px; min-width: 92px; padding: 9px 13px; }
.registration-dialog button:disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
#reg-phone-status { color: #2d8858; font-size: 12px; font-weight: 550; }
.registration-otp { padding: 19px; margin: -2px 0 20px; border: 1px solid #d7e7dc; border-radius: 12px; background: #f1f7f2; }
.registration-otp .otp-inputs input { height: 47px; background: #fff; font-size: 21px; }
.registration-otp-bottom { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 15px; }
.registration-otp-bottom .field-hint { margin: 0; font-size: 12px; }
.registration-otp-bottom .btn { min-height: 38px; padding: 7px 13px; font-size: 12px; }
.registration-dialog .registration-error { color: #a34536; font-size: 12px; line-height: 1.6; margin: 12px 0 0; }
.registration-error:empty { display: none; }
.registration-url { display: flex; gap: 8px; align-items: flex-start; padding: 11px 12px; margin-top: 9px; background: #edf5ef; border: 1px solid #dce9df; border-radius: 7px; font-size: 12px; color: #708779; }
.registration-url .icon { width: 15px; height: 15px; margin-top: 2px; color: #568768; }
.registration-url > span { min-width: 0; overflow-wrap: anywhere; }
.registration-url strong { color: #315d43; font-weight: 600; }
.registration-field .field-hint { font-size: 10px; line-height: 1.7; }
.registration-submit { width: 100%; margin-top: 4px; font-size: 14px; }
.registration-dialog .registration-verification-hint { font-size: 11px; margin: 9px 0 0; text-align: center; color: #7b8b80; }
.registration-dialog .registration-demo-note { font-size: 10px; text-align: center; padding-top: 17px; margin: 20px 0 0; border-top: 1px solid #e7ece7; line-height: 1.8; }
.registration-dialog .login-success { text-align: center; padding: 15px 0; }
.registration-dialog .login-success p { font-size: 14px; margin: 14px 0 24px; }
@media(max-width:480px) { .registration-dialog { padding: 29px 21px 23px; max-height: calc(100dvh - 24px); } .registration-heading h2 { font-size: 25px; } .registration-two-columns { grid-template-columns: minmax(0,1fr); gap: 0; } .registration-phone-row { gap: 7px; } .registration-phone-row .mobile-field > span { padding-inline: 10px; font-size: 13px; } .registration-phone-row .mobile-field input { padding-inline: 8px; font-size: 14px; } .registration-phone-row .mobile-field input::placeholder { font-size: 11px; } .registration-phone-row .btn { min-width: 75px; padding-inline: 9px; font-size: 11px; } .registration-otp { padding: 14px; } .registration-otp .otp-inputs { gap: 5px; } .registration-otp .otp-inputs input { height: 42px; font-size: 18px; } }
/* Guided registration keeps one short screen visible at a time. */
.registration-dialog { max-width: 560px; padding: 28px 30px 22px; }
.registration-heading h2 { font-size: 27px; }
.registration-dialog .registration-heading p { margin: 10px 0 19px; font-size: 14px; }
.registration-progress { list-style: none; display: flex; gap: 22px; padding: 0 0 18px; margin: 0 0 21px; border-bottom: 1px solid #e5ece6; }
.registration-progress li { display: flex; align-items: center; gap: 8px; color: #8b978f; font-size: 12px; font-weight: 550; }
.registration-progress li > span { width: 23px; height: 23px; border-radius: 50%; display: grid; place-items: center; background: #f0f3f0; border: 1px solid #e2e8e2; font-size: 11px; }
.registration-progress li[aria-current] { color: #346d4b; }
.registration-progress li[aria-current] > span { color: white; background: #3c7c59; border-color: #3c7c59; }
.registration-step-actions { display: flex; gap: 12px; margin-top: 21px; }
.registration-step-actions .registration-submit { flex: 1; width: auto; margin: 0; }
.registration-step-actions .btn-outline { font-size: 14px; min-width: 83px; }
.registration-url > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#reg-edit-contact { border: 0; background: transparent; padding: 4px 0; font-size: 12px; color: #357151; }
#reg-otp-panel .registration-submit { margin-top: 25px; }
.registration-dialog .registration-demo-note { margin-top: 19px; padding-top: 14px; }
@media(max-width:480px) {
  .registration-dialog { padding: 27px 22px 20px; }
  .registration-heading h2 { font-size: 25px; }
  .registration-dialog .registration-heading p { font-size: 13px; margin-bottom: 17px; }
  .registration-progress { margin-bottom: 18px; padding-bottom: 15px; gap: 20px; }
  .registration-field { margin-bottom: 15px; }
  .registration-dialog .registration-two-columns { grid-template-columns: 1fr; }
  .registration-dialog .registration-submit { min-height: 46px; }
}
@media(max-height:650px) {
  .registration-dialog { padding: 21px 25px 17px; }
  .registration-heading .eyebrow { font-size: 9px; margin-bottom: 8px; }
  .registration-heading h2 { font-size: 24px; }
  .registration-dialog .registration-heading p { font-size: 13px; margin: 8px 0 13px; }
  .registration-progress { margin-bottom: 15px; padding-bottom: 12px; }
  .registration-field { margin-bottom: 13px; }
  .registration-field > input, .registration-field select { min-height: 42px; padding-block: 9px; }
  .registration-field label { margin-bottom: 6px; }
  .registration-dialog .registration-submit, .registration-step-actions .btn-outline { min-height: 44px; }
  .registration-dialog .registration-demo-note { font-size: 9px; margin-top: 13px; padding-top: 11px; }
  .registration-step-actions { margin-top: 16px; }
}
@media(max-width:480px) {
  .registration-step-actions { gap: 8px; }
  .registration-step-actions .btn { min-width: 0; padding-inline: 11px; font-size: 12px; gap: 8px; }
  .registration-step-actions .btn .icon { width: 16px; height: 16px; }
  .registration-step-actions .btn-outline { min-width: 54px; }
  .registration-progress { gap: 18px; }
  .registration-progress li { font-size: 11px; white-space: nowrap; gap: 6px; }
  .registration-progress li > span { width: 20px; height: 20px; }
}
@media(max-width:360px) and (max-height:650px) {
  .registration-dialog { padding: 20px 19px 15px; }
  .registration-dialog .registration-two-columns { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .registration-heading h2 { font-size: 23px; }
  .registration-heading .eyebrow { font-size: 8px; letter-spacing: 1.1px; }
  .registration-dialog .registration-heading p { font-size: 12px; }
  .registration-field label { font-size: 12px; }
  .registration-field > input { padding-inline: 9px; font-size: 13px; }
  .registration-field input::placeholder { font-size: 11px; }
  .registration-dialog .registration-verification-hint { font-size: 10px; }
  .registration-progress { gap: 16px; }
  .registration-progress li { font-size: 10px; }
  .registration-step-actions .btn { padding-inline: 9px; }
  .registration-field { margin-bottom: 10px; }
  .registration-step-actions { margin-top: 12px; }
}
.hero-pricing { display: flex; align-items: center; gap: 21px; max-width: 465px; margin-top: 24px; padding: 15px 18px; border: 1px solid #d1e4d7; border-radius: 12px; background: #edf6ef; transition: border-color .2s, background .2s; }
.hero-pricing:hover { border-color: #84b397; background: #e7f2ea; }
.hero-price-amount { flex-shrink: 0; padding-right: 20px; border-right: 1px solid #cddfd1; }
.hero-price-amount > small { display: block; color: #5e8068; font-size: 9px; font-weight: 600; letter-spacing: 1.2px; line-height: 1.5; }
.hero-price-amount strong { display: block; color: #255a3b; font-size: 32px; font-weight: 650; letter-spacing: -1.4px; line-height: 1.25; margin-top: 3px; }
.hero-price-amount strong span { color: #6a8270; font-size: 13px; font-weight: 450; letter-spacing: 0; margin-left: 3px; }
.hero-price-promise { color: #355741; font-size: 14px; font-weight: 600; line-height: 1.6; }
.hero-price-promise small { display: block; font-size: 10px; color: #6e8273; font-weight: 400; margin-top: 3px; }
.hero-pricing > .icon { margin-left: auto; width: 18px; color: #4f805e; }
@media(max-width:991px) { .hero h1 { font-size: 45px; } .hero-pricing { gap: 13px; padding: 13px; } .hero-price-amount { padding-right: 12px; } .hero-price-amount strong { font-size: 29px; } .hero-price-promise { font-size: 12px; } .hero-price-promise small { font-size: 9px; } .hero-pricing > .icon { display: none; } }
@media(max-width:767px) { .hero h1 { font-size: 58px; } .hero-pricing { text-align: left; margin-inline: auto; max-width: 420px; padding: 15px 18px; gap: 20px; } .hero-price-promise { font-size: 14px; } .hero-price-promise small { font-size: 10px; } }
@media(max-width:480px) { .hero h1 { font-size: 44px; letter-spacing: -2.2px; } .hero h1 br { display: block; } .hero-pricing { padding: 14px 13px; gap: 13px; } .hero-price-amount strong { font-size: 29px; } .hero-price-promise { font-size: 13px; } .hero-price-promise small { font-size: 9px; } }
@media(max-width:360px) { .hero h1 { font-size: 36px; letter-spacing: -1.9px; } .hero-price-amount { padding-right: 10px; } .hero-price-amount strong { font-size: 26px; } .hero-price-amount strong span { font-size: 11px; } .hero-price-promise { font-size: 12px; } .hero-price-promise small { font-size: 9px; } .hero-pricing { gap: 10px; } }
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.js .reveal{opacity:1;transform:none}}
