body { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.business-glow { position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 12% 15%,rgba(16,185,129,.13),transparent 31%),radial-gradient(circle at 85% 35%,rgba(255,138,0,.10),transparent 27%); }
.business-demo-card { box-shadow:0 38px 90px -48px rgba(15,23,42,.42),0 12px 30px -22px rgba(5,150,105,.22); }
.demo-product-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.6rem; }
.demo-product-card { min-width:0; overflow:hidden; border:1px solid rgb(228 228 231); border-radius:1rem; background:#fff; transition:transform .15s,border-color .15s,box-shadow .15s; }
.demo-product-card:hover { transform:translateY(-2px); border-color:rgb(167 243 208); box-shadow:0 15px 28px -24px rgba(5,150,105,.7); }
.demo-product-photo { position:relative; height:8.2rem; overflow:hidden; background:rgb(250 250 250); }
.demo-product-photo img { height:100%; width:100%; object-fit:cover; transition:transform .25s ease; }
.demo-product-card:hover .demo-product-photo img { transform:scale(1.025); }
.demo-product-photo span { position:absolute; right:.5rem; top:.5rem; border-radius:999px; background:rgba(255,255,255,.9); padding:.25rem .5rem; color:rgb(63 63 70); font-size:.6rem; font-weight:800; box-shadow:0 4px 12px -8px rgba(15,23,42,.5); backdrop-filter:blur(5px); }
.demo-detail-pill { display:inline-flex; align-items:center; gap:.4rem; border-radius:999px; background:rgb(244 244 245); padding:.45rem .7rem; color:rgb(82 82 91); font-size:.66rem; line-height:1rem; font-weight:700; }
.demo-social-row { display:flex; align-items:center; gap:.48rem; margin-top:1rem; }
.demo-social-label { margin-right:.12rem; color:rgb(113 113 122); font-size:.68rem; line-height:1rem; font-weight:700; }
.demo-social-icon { display:flex; height:1.8rem; width:1.8rem; flex:none; align-items:center; justify-content:center; border:1px solid rgb(228 228 231); border-radius:.62rem; background:#fff; box-shadow:0 5px 12px -10px rgba(15,23,42,.65); }
.demo-social-icon svg { height:1.18rem; width:1.18rem; }
.demo-discovery-bar { display:flex; align-items:center; gap:.7rem; border-top:1px solid rgb(228 228 231); background:linear-gradient(90deg,rgb(250 250 250),rgba(236,253,245,.65)); padding:.85rem 1.25rem; }
.onboarding-card { border:1px solid rgb(228 228 231); border-radius:1.75rem; background:#fff; padding:1.25rem; box-shadow:0 30px 80px -55px rgba(15,23,42,.45); }
.eyebrow { font-size:.72rem; line-height:1rem; font-weight:800; letter-spacing:.11em; text-transform:uppercase; color:rgb(4 120 87); }
.step-title { margin-top:.55rem; font-size:1.75rem; line-height:1.15; font-weight:750; letter-spacing:-.035em; }
.step-copy { margin-top:.75rem; max-width:38rem; color:rgb(82 82 91); line-height:1.65; }
.field-label { display:block; margin-bottom:.45rem; font-size:.82rem; line-height:1.2rem; font-weight:700; color:rgb(63 63 70); }
.field,.phone-field,.price-field { width:100%; border:1px solid rgb(212 212 216); border-radius:.85rem; background:#fff; transition:border-color .15s,box-shadow .15s; }
.field { padding:.85rem 1rem; outline:none; }
.field:focus,.phone-field:focus-within,.price-field:focus-within { border-color:rgb(16 185 129); box-shadow:0 0 0 3px rgba(16,185,129,.12); }
.social-field { display:flex; align-items:center; overflow:hidden; border:1px solid rgb(212 212 216); border-radius:.85rem; background:#fff; transition:border-color .15s,box-shadow .15s; }
.social-field:focus-within { border-color:rgb(16 185 129); box-shadow:0 0 0 3px rgba(16,185,129,.12); }
.social-field input { min-width:0; flex:1; padding:.85rem 1rem .85rem .2rem; outline:none; color:rgb(39 39 42); }
.social-icon { display:flex; height:2.45rem; width:2.7rem; flex:none; align-items:center; justify-content:center; }
.social-icon svg { height:1.22rem; width:1.22rem; fill:currentColor; }
.social-icon-facebook { color:#1877f2; }
.social-icon-instagram { color:#d62976; }
.social-icon-tiktok { color:#111827; }
.social-preview-link { display:inline-flex; align-items:center; gap:.42rem; border:1px solid rgb(228 228 231); border-radius:999px; background:#fff; padding:.48rem .72rem; color:rgb(63 63 70); font-size:.75rem; font-weight:750; transition:transform .15s,border-color .15s,box-shadow .15s; }
.social-preview-link:hover { transform:translateY(-1px); border-color:rgb(167 243 208); box-shadow:0 8px 18px -14px rgba(5,150,105,.65); }
.social-preview-link svg { height:.95rem; width:.95rem; fill:currentColor; }
.product-description-clamp { display:-webkit-box; overflow:hidden; color:rgb(113 113 122); font-size:.75rem; line-height:1.125rem; text-overflow:ellipsis; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; }
.phone-field,.price-field { display:flex; align-items:center; overflow:hidden; }
.price-field span { flex:none; padding:.85rem 0 .85rem 1rem; color:rgb(82 82 91); font-weight:650; }
.phone-field input,.price-field input { min-width:0; flex:1; padding:.85rem 1rem; outline:none; }
.price-field span { padding:.85rem 1rem .85rem 0; font-size:.78rem; }
.country-picker { position:relative; display:flex; min-height:3rem; flex:none; cursor:pointer; align-items:center; gap:.42rem; border-right:1px solid rgb(228 228 231); padding:0 .72rem 0 .85rem; color:rgb(63 63 70); font-size:.82rem; font-weight:750; }
.country-picker select { position:absolute; inset:0; height:100%; width:100%; cursor:pointer; opacity:0; }
.country-flag { font-size:1.18rem; line-height:1; }
.country-chevron { color:rgb(161 161 170); font-size:.9rem; transform:translateY(-1px); }
.primary-button,.secondary-button,.option-button,.small-button { display:inline-flex; min-height:3rem; align-items:center; justify-content:center; gap:.55rem; border-radius:.85rem; padding:.75rem 1.15rem; font-size:.92rem; font-weight:750; transition:transform .15s,background .15s,border-color .15s; }
.primary-button { background:rgb(5 150 105); color:white; box-shadow:0 14px 32px -18px rgba(5,150,105,.8); }
.primary-button:hover { background:rgb(4 120 87); transform:translateY(-1px); }
.primary-button:disabled { background:rgb(161 161 170); transform:none; box-shadow:none; }
.secondary-button { border:1px solid rgb(212 212 216); background:white; color:rgb(39 39 42); }
.secondary-button:hover,.option-button:hover { border-color:rgb(110 231 183); background:rgb(236 253 245); }
.option-button { justify-content:flex-start; border:1px solid rgb(228 228 231); background:rgb(250 250 250); color:rgb(63 63 70); }
.location-recommended-card { display:flex; width:100%; align-items:flex-start; gap:.8rem; border:1px solid rgb(110 231 183); border-radius:1rem; background:linear-gradient(135deg,rgb(236 253 245),rgba(255,255,255,.92)); padding:1rem; color:rgb(6 78 59); box-shadow:0 12px 28px -24px rgba(5,150,105,.8); transition:transform .15s,border-color .15s,box-shadow .15s; }
.location-recommended-card:hover { transform:translateY(-1px); border-color:rgb(16 185 129); box-shadow:0 16px 32px -24px rgba(5,150,105,.9); }
.location-recommended-icon { display:flex; height:2.35rem; width:2.35rem; flex:none; align-items:center; justify-content:center; border-radius:.8rem; background:#fff; color:rgb(5 150 105); font-size:1.2rem; box-shadow:0 4px 12px -10px rgba(5,150,105,.9); }
.location-recommended-icon svg { height:1.25rem; width:1.25rem; }
.recommended-pill { border-radius:999px; background:rgb(5 150 105); padding:.22rem .55rem; color:#fff; font-size:.62rem; line-height:1rem; font-weight:800; letter-spacing:.02em; text-transform:uppercase; }
.location-recommended-card.location-choice-muted { border-color:rgb(228 228 231); background:rgb(250 250 250); color:rgb(82 82 91); box-shadow:none; }
.location-recommended-card.location-choice-muted .location-recommended-icon { color:rgb(113 113 122); box-shadow:none; }
.location-recommended-card.location-choice-muted .recommended-pill { background:rgb(228 228 231); color:rgb(82 82 91); }
.location-recommended-card.location-choice-muted .text-emerald-800 { color:rgb(113 113 122); }
.location-manual-card.location-choice-selected { border-color:rgb(16 185 129); background:rgb(236 253 245); color:rgb(4 120 87); box-shadow:0 10px 22px -20px rgba(5,150,105,.9); }
.location-status { border:1px solid transparent; }
.location-status-success { border-color:rgb(167 243 208); background:rgb(236 253 245); color:rgb(6 95 70); }
.location-status-error { border-color:rgb(254 202 202); background:rgb(254 242 242); color:rgb(153 27 27); }
.city-autocomplete { position:relative; z-index:4; }
.city-suggestions { position:absolute; top:calc(100% + .35rem); left:0; right:0; z-index:30; max-height:15rem; overflow-y:auto; border:1px solid rgb(212 212 216); border-radius:.9rem; background:#fff; padding:.35rem; box-shadow:0 20px 45px -25px rgba(15,23,42,.55); }
.city-suggestion { display:flex; width:100%; align-items:center; justify-content:space-between; border-radius:.65rem; padding:.68rem .75rem; color:rgb(39 39 42); text-align:left; font-size:.86rem; font-weight:650; }
.city-suggestion:hover,.city-suggestion[aria-selected="true"] { background:rgb(236 253 245); color:rgb(4 120 87); }
.city-suggestion-mark { color:rgb(16 185 129); font-size:.72rem; }
.small-button { min-height:2.4rem; border:1px solid rgb(196 181 253); padding:.45rem .8rem; font-size:.78rem; color:rgb(91 33 182); }
.step-actions { margin-top:2rem; border-top:1px solid rgb(244 244 245); padding-top:1.25rem; }
.otp-input { min-width:0; aspect-ratio:1/1.12; border:1px solid rgb(212 212 216); border-radius:.8rem; text-align:center; font-size:1.5rem; font-weight:750; outline:none; }
.otp-input:focus { border-color:rgb(16 185 129); box-shadow:0 0 0 3px rgba(16,185,129,.12); }
@media (min-width:640px){.onboarding-card{padding:2.25rem}.step-title{font-size:2.15rem}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
