/* MzansiHub v4 — compact desktop sizing for genuine browser zoom 100%.
   This changes layout dimensions, never browser zoom or transform:scale(). */
:root { --radius: 16px; }
body { font-size: 14px; }
.topbar { height: 68px; padding: 0 clamp(15px,2.1vw,32px); gap: 16px; }
.topbar nav { gap: 10px; font-size: 11px; }
.brand { gap: 7px; }
.brand-logo { width: 39px; height: 40px; }
.brand b { font-size: 19px; }
.brand small { font-size: 7px; }
.navcta,.startup-nav { padding: 8px 10px; }
.hero { min-height: 424px; padding: 49px max(24px,calc((100vw - 1180px)/2)) 43px; gap: 30px; grid-template-columns: minmax(0,1.4fr) minmax(290px,350px); }
.hero h1 { font-size: clamp(37px,4.2vw,57px); line-height:1.09; margin-bottom: 14px; }
.hero-copy>p { font-size: 14px; line-height:1.6; max-width: 700px; }
.hero .searchbar { margin-top: 22px; }
.hero .command-card { max-width: 350px; }
.hero .command-card a { padding-top: 11px; padding-bottom: 11px; }
.hero-stats { margin-top: 16px; }
.hero-start-link { margin-top: 12px; }
.section { max-width: 1220px; padding: 33px 24px; }
.section-head { margin-bottom: 16px; }
.section h2,.section-head h2 { font-size: clamp(22px,2.1vw,28px); }
.store-card { border-radius: 15px; }
.store-image { height: 158px; }
.card-body { padding: 16px; }
.card-body h3 { font-size: 16px; line-height: 1.32; }
.card-body>p { font-size: 12px; }
.launch-ribbon { max-width:1172px; padding:18px 22px; margin-top: 23px; }
.launch-ribbon h2 { font-size: 19px; }
.growth-strip { padding-top: 30px; padding-bottom: 30px; }
.store-hero { max-width: 1220px; grid-template-columns: minmax(260px,360px) 1fr; padding: 38px 24px 22px; gap: 32px; }
.store-visual { min-height: 240px; }
.store-info h1 { font-size: clamp(30px,3.4vw,45px); }
.page-hero { max-width:1220px; padding:44px 24px 24px; }
.page-hero h1 { font-size:clamp(30px,3.6vw,46px); }
.startup-hero { min-height:340px; padding: 48px max(22px,calc((100vw - 1120px)/2)); gap: 28px; }
.startup-hero h1 { font-size:clamp(34px,4.3vw,53px); }
.startup-hero p {font-size:14px;}
.startup-content { max-width:1180px; padding-top:46px; padding-bottom:48px; }
.startup-card { padding:19px; }
.startup-card h3 { font-size:17px; }
.startup-enquiry { padding:48px max(22px,calc((100vw - 1120px)/2)); }
.startup-side h2 { font-size:clamp(28px,3.5vw,41px); }

/* Genuine visual star rating: grey base + partial gold fill. */
.stars { position:relative; display:inline-block; font-size: 19px; line-height:1; letter-spacing:1px; color:#d3dae3; white-space:nowrap; vertical-align:middle; }
.stars .stars-filled { position:absolute; inset:0 auto auto 0; overflow:hidden; color:#f3ac13; white-space:nowrap; display:block; }
.small-stars { font-size: 13px; letter-spacing:0; }
.card-review-badge { display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
.card-review-badge strong { font-size: 12px; color:var(--text); }
.card-review-source { display:flex; align-items:center; gap:8px; font-size: 10px; color:var(--muted); margin:4px 0 5px; }
.card-review-source a { color:var(--brand); font-weight:750; }
.external-score { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin: 10px 0 18px; }
.external-score .score-number { font-weight:850; font-size:22px; }
.external-score .review-total { color:var(--muted); font-size: 12px; }
.external-score a { color:var(--brand); font-size:12px; font-weight:750; }
.reviews-section { padding-top: 12px; padding-bottom:58px; }
.review-caption { max-width:660px; color:var(--muted); font-size:12px; margin:7px 0 0; }
.review-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.review-card { min-width:0; background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:19px; box-shadow:0 5px 22px rgba(10,30,50,.035); }
.review-author { display:flex; gap:10px; align-items:center; }
.review-author-text { min-width:0; display:grid; gap:2px; font-size:12px; }
.review-author-text b {overflow-wrap:anywhere;}
.review-author-text small { color:var(--muted); font-size:11px; }
.review-avatar,.review-avatar-fallback { flex:none; width:37px; height:37px; object-fit:cover; border-radius:50%; }
.review-avatar-fallback {display:grid;place-items:center;background:var(--surface2); color:var(--brand);font-size:18px;}
.review-stars { display:flex; align-items:center; gap:9px; margin:10px 0 6px; }
.review-stars strong { color:var(--muted); font-size:11px; }
.review-card>p { margin:9px 0 0; font-size:12px; line-height:1.6; overflow-wrap:anywhere; white-space:pre-line; }
.reviews-disclaimer { margin-top:13px; font-size:11px; color:var(--muted); }
@media(max-width:1100px){
 .topbar {height:68px;}
 .topbar nav.open {top:68px;}
 .hero {grid-template-columns:1fr;padding:48px 24px;min-height:auto;}
 .hero .command-card {max-width:580px;}
 .review-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:760px){
 body {font-size:14px;}
 .topbar {padding:0 15px;}
 .hero {padding:42px 18px;}
 .hero h1 {font-size:clamp(34px,9.5vw,48px);}
 .section {padding:30px 18px;}
 .store-hero {grid-template-columns:1fr;padding:25px 18px;gap:17px;}
 .store-visual {min-height:190px;}
 .store-info h1 {font-size:clamp(30px,7vw,41px);}
 .review-grid {grid-template-columns:1fr;}
 .review-card {padding:16px;}
 .startup-hero {padding:38px 18px;}
 .startup-hero h1 {font-size:clamp(34px,8vw,45px);}
}


/* MzansiHub v5: ACTUAL COMPACT DESIGN AT 100% BROWSER ZOOM.
   Keep actual viewport responsive, never use zoom: or transform:scale(). */
.rating-stars { display:inline-block; white-space:nowrap; font-size:17px; font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif; letter-spacing:-1.4px; line-height:1.2; font-weight:400; font-variant-ligatures:none; }
.rating-stars-small { font-size:12px; letter-spacing:-1.1px; }
.card-review-badge {gap:5px; flex:0 0 auto;}
.microline { flex-wrap:wrap; align-items:center; column-gap:8px; row-gap:3px; }
.review-stars { gap:8px; }

@media (min-width:761px) {
 body {font-size:13px;line-height:1.46;}
 .topbar {height:58px; padding:0 22px; gap:10px;}
 .topbar nav {gap:9px; font-size:11px;}
 .brand-logo {width:31px;height:33px;}
 .brand b {font-size:17px;}
 .brand small {font-size:6.5px; margin-top:3px;letter-spacing:.1em;}
 .topbar .navcta,.topbar .startup-nav {padding:6px 9px;border-radius:7px;}
 .theme-toggle {height:30px;width:30px;border-radius:8px;}
 .hero {max-width:1190px;min-height:unset; padding:27px 18px 28px;gap:24px;grid-template-columns:minmax(0,1.5fr) minmax(250px,295px);}
 .hero h1 {font-size:clamp(33px,3.45vw,46px);line-height:1.08;letter-spacing:-.048em;margin:9px 0 10px;}
 .hero-copy>p {font-size:13px;line-height:1.48;margin:8px 0;max-width:640px;}
 .hero .searchbar {margin-top:15px; grid-template-columns:minmax(160px,1fr) 130px 145px auto;padding:4px;border-radius:11px;}
 .searchbar input,.searchbar select {font-size:12px; padding:9px 10px; min-width:0;}
 .searchbar button {padding:8px 11px;border-radius:8px;font-size:12px;}
 .hero-stats {margin-top:11px;gap:14px;font-size:10px;}
 .hero-start-link {margin-top:10px; padding:6px 9px;font-size:11px;}
 .hero .command-card {max-width:none; padding:10px;border-radius:15px;}
 .hero .command-head {padding:4px 6px 6px;font-size:8px;}
 .hero .command-card>a {grid-template-columns:29px 1fr auto;gap:8px;padding:8px 10px;margin-top:5px;border-radius:9px;}
 .hero .command-card .ico {width:27px;height:27px;font-size:15px;border-radius:7px;}
 .hero .command-card b {font-size:11px;}
 .hero .command-card small {font-size:9px;line-height:1.3;}
 .hero .command-card em {font-size:14px;}
 .launch-ribbon {max-width:1154px;margin:15px auto 0;padding:12px 15px;border-radius:13px;gap:13px;}
 .launch-ribbon-icon {width:34px;height:34px;font-size:20px;}
 .launch-ribbon h2 {font-size:16px;margin:2px 0 2px;}
 .launch-ribbon p {font-size:11px;margin:0;}
 .launch-ribbon .btn {padding:8px 11px;font-size:11px;white-space:nowrap;}
 .section {max-width:1190px;padding:22px 18px;}
 .section-head {margin-bottom:13px;}
 .section h2,.section-head h2 {font-size:22px;}
 .section-head .eyebrow {font-size:9px;}
 .cards {grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
 .store-card {border-radius:11px;}
 .store-image {height:122px;}
 .card-body {padding:11px;}
 .card-body h3 {font-size:14px;margin:6px 0;line-height:1.24;}
 .card-body>p {font-size:11px;line-height:1.4;}
 .microline {font-size:9px;letter-spacing:.025em;}
 .card-review-source {font-size:9px;margin:2px 0 4px;}
 .card-review-badge strong {font-size:11px;}
 .card-actions,.quick-actions {margin-top:9px;gap:6px;}
 .card-actions .btn {padding:7px 8px;font-size:11px;}
 .chip {padding:5px 7px;font-size:9px;}
 .badge,.verified {font-size:9px;top:8px;left:8px;padding:4px 6px;}
 .verified {left:auto;right:8px;}
 .growth-strip {max-width:1154px;margin:20px auto 38px;padding:23px 24px;border-radius:17px;}
 .growth-strip h2 {font-size:23px;}
 .site-footer {padding-top:25px;padding-bottom:25px;}
 .page-hero {padding:26px 20px 19px;}
 .page-hero h1 {font-size:clamp(29px,3vw,39px);line-height:1.12;}
 .page-hero p {font-size:13px;}
 .store-hero {max-width:1190px;grid-template-columns:minmax(230px,310px) 1fr;padding:25px 18px 18px;gap:22px;}
 .store-visual {min-height:185px;}
 .store-info h1 {font-size:clamp(26px,3vw,36px);line-height:1.1;}
 .external-score {margin:7px 0 11px;}
 .external-score .score-number {font-size:17px;}
 .review-grid {gap:11px;}
 .review-card {padding:13px;}
 .startup-hero {min-height:unset;padding:30px max(20px,calc((100vw - 1100px)/2));gap:28px;}
 .startup-hero h1 {font-size:clamp(30px,3.5vw,44px);}
 .startup-hero p {font-size:13px;}
 .startup-content {padding-top:29px;padding-bottom:31px;max-width:1120px;}
 .startup-card {padding:15px;}
 .startup-card h3 {font-size:15px;}
 .startup-enquiry {padding:30px max(22px,calc((100vw - 1100px)/2));gap:34px;}
 .startup-side h2 {font-size:clamp(26px,3vw,35px);}
 .startup-form {padding:22px;}
 .authcopy h1,.formintro h1,.dashhead h1,.services-hero h1 {font-size:clamp(29px,3.2vw,43px);}
 input,select,textarea {padding:10px 11px;}
 }
@media (min-width:761px) and (max-width:1100px) {
 .hero {grid-template-columns:1fr;gap:15px;}
 .hero .command-card {max-width:100%;display:none;}
 .hero .searchbar {max-width:100%;}
 .cards {grid-template-columns:repeat(3,minmax(0,1fr));}
 .launch-ribbon {margin-left:18px;margin-right:18px;}
 }
@media (max-width:760px) {
 .rating-stars {font-size:16px;letter-spacing:-1.3px;}
 .rating-stars-small {font-size:12px;}
 .card-review-badge{max-width:100%;}
 }