:root{--bg:#FAFCFC;--ink:#0E2F2D;--muted:#4B6462;--line:#C5E3E0;--card:#fff;--soft:#D9F0EE;--accent:#3CABA5;--accent-dark:#2A8580;--accent-hover:#247670;--accent-deep:#1F5F5B;--warn-bg:#FFF7ED;--warn-line:#FDBA74;--radius:18px;--shadow:0 12px 30px rgba(60,171,165,.15)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);line-height:1.65;-webkit-font-smoothing:antialiased}
body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif}h1,h2,h3,.brand{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:800;letter-spacing:-.025em}
a{color:var(--accent-dark);text-decoration:none}a:hover{color:var(--accent-hover);text-decoration:underline}
.wrap{max-width:1080px;margin:0 auto;padding:0 18px}
header.site{background:var(--card);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:64px;gap:12px;flex-wrap:wrap}
.brand{font-weight:700;color:var(--ink);text-decoration:none;font-size:1.15rem}
.navlinks{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.navlinks a{color:var(--muted);font-weight:600;font-size:.92rem}
footer{background:var(--accent-deep);color:#d7efed;padding:32px 0;margin-top:40px;font-size:.92rem}
footer a{color:#fff}.footgrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:16px}

@media(max-width:720px){.footgrid{grid-template-columns:1fr}}

/* SPEC2 widgets + 7 distinct hero/header variants on #3CABA5 */
.breadcrumbs{font-size:.88rem;color:var(--muted);margin:0 0 14px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.breadcrumbs a{color:var(--accent-dark);text-decoration:none}.bc-sep{opacity:.5}
.btn{display:inline-block;background:linear-gradient(180deg,var(--accent),var(--accent-dark));color:#fff!important;padding:12px 20px;border-radius:var(--radius);font-weight:700;text-decoration:none!important;border:0;box-shadow:var(--shadow);transition:transform .15s ease,filter .15s}
.btn:hover{filter:brightness(1.06);transform:translateY(-2px);text-decoration:none!important}
.btn-ghost{background:transparent;color:var(--accent-dark)!important;border:2px solid var(--line);box-shadow:none}
.btn-light{background:#fff;color:var(--accent-deep)!important;box-shadow:0 8px 22px rgba(0,0,0,.18)}
.btn-dark{background:var(--accent-deep);color:#E9F7F6!important}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0 8px;align-items:center}
.icon-badge,.app-badge{width:76px;height:76px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(145deg,var(--accent),var(--accent-deep));color:#fff;font-weight:800;font-size:1.2rem;box-shadow:var(--shadow);margin-bottom:14px}
.chip{display:inline-block;background:rgba(60,171,165,.16);color:var(--accent-deep);border:1px solid rgba(60,171,165,.35);padding:5px 14px;border-radius:999px;font-size:.85rem;font-weight:700}
.chip-light{background:rgba(255,255,255,.14);color:#E9F7F6;border-color:rgba(255,255,255,.3)}

/* ---- Hero A: gradient + phone (gbwhatsapp.pro) ---- */
.hero-a{background:radial-gradient(1000px 420px at 90% -20%,#3CABA5 0,transparent 55%),linear-gradient(155deg,#0E2F2D 0%,#1F5F5B 48%,#2A8580 100%);color:#E9F7F6;padding:52px 0 60px;position:relative;overflow:hidden}
.hero-a .wrap-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:36px;align-items:center;max-width:1080px;margin:0 auto;padding:0 18px}
.hero-a h1{font-size:clamp(1.9rem,4vw,2.9rem);margin:.25em 0 .4em;color:#fff;line-height:1.15}
.hero-a .lead{color:#CDE9E6;max-width:56ch;font-size:1.06rem}
.hero-a .btn-ghost{color:#E9F7F6!important;border-color:rgba(233,247,246,.45)}
.hero-a .stat-inline{display:flex;gap:22px;flex-wrap:wrap;margin-top:22px}
.hero-a .stat-inline b{display:block;font-size:1.35rem;color:#3CABA5;font-family:inherit}
.hero-a .stat-inline span{font-size:.84rem;color:#A8C9C6}
.phone-mock{background:linear-gradient(180deg,#163532,#0A2422);border-radius:32px;padding:16px 12px;color:#fff;min-height:280px;box-shadow:0 28px 56px rgba(0,0,0,.4);border:2px solid #2A8580;max-width:280px;margin:0 auto}
.pm-notch{width:38%;height:10px;background:#334946;border-radius:8px;margin:0 auto 14px}
.pm-row{background:#1F5F5B;border-radius:12px;padding:11px 12px;margin:0 0 8px;font-size:.9rem}

/* ---- Hero B: centered icon + stat strip (gb-whatapp.site) ---- */
.hero-b{background:var(--bg);padding:42px 0 28px;text-align:center;border-bottom:1px solid var(--line)}
.hero-b .wrap{max-width:760px}
.hero-b .app-badge{margin:0 auto 16px}
.hero-b h1{font-size:clamp(1.75rem,3.6vw,2.55rem);margin:.2em 0 .45em;line-height:1.18}
.hero-b .lead{color:var(--muted);margin:0 auto 18px;max-width:58ch}
.hero-b .hero-actions{justify-content:center}
.stat-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:720px;margin:26px auto 0}
.stat-strip>div{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 10px;box-shadow:var(--shadow)}
.stat-strip b{display:block;font-size:1.2rem;color:var(--accent-deep)}.stat-strip span{font-size:.8rem;color:var(--muted)}

/* ---- Hero C: dark + white info card (gbappapk.net) ---- */
.hero-c{background:linear-gradient(160deg,#0A2422,#163532 55%,#1F5F5B);color:#E9F7F6;padding:48px 0 56px}
.hero-c .wrap-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:32px;align-items:center;max-width:1080px;margin:0 auto;padding:0 18px}
.hero-c h1{font-size:clamp(1.85rem,3.8vw,2.7rem);margin:.3em 0 .4em;color:#fff}
.hero-c .lead{color:#B7D9D5}
.hero-c .checklist{list-style:none;padding:0;margin:16px 0 0}
.hero-c .checklist li{padding:7px 0 7px 28px;position:relative;color:#D7EFED}
.hero-c .checklist li:before{content:"";position:absolute;left:0;top:12px;width:14px;height:14px;border-radius:50%;background:var(--accent);box-shadow:inset 0 0 0 3px #0E2F2D}
.info-card{background:#fff;color:#0E2F2D;border-radius:var(--radius);padding:20px 22px;box-shadow:var(--shadow)}
.info-card h2{margin:0 0 12px;font-size:1.15rem;color:#1F5F5B}
.info-card table{width:100%;border-collapse:collapse}
.info-card th,.info-card td{padding:9px 4px;border-bottom:1px solid #D3ECEA;font-size:.92rem;text-align:left}
.info-card th{color:#4B6462;font-weight:600;width:42%}.info-card td{font-weight:700}
.info-card .btn{width:100%;text-align:center;margin-top:14px}

/* ---- Hero D: serif centered elegant (gbplus.pro) ---- */
.hero-d{background:radial-gradient(800px 360px at 50% -40%,rgba(60,171,165,.35),transparent 70%),linear-gradient(180deg,#E6F5F4,#F4FAFA);padding:48px 0 36px;text-align:center;border-bottom:1px solid var(--line)}
.hero-d .wrap{max-width:820px}
.hero-d .app-badge{margin:0 auto 14px;border-radius:50%;width:88px;height:88px}
.hero-d h1{font-size:clamp(2rem,4.2vw,3rem);margin:.2em 0 .35em;color:var(--accent-deep)}
.hero-d .lead{color:var(--muted);max-width:56ch;margin:0 auto 16px}
.hero-d .hero-actions{justify-content:center}
.hero-d .spec-line{margin-top:22px;display:flex;justify-content:center;gap:18px;flex-wrap:wrap;font-size:.95rem;color:var(--muted)}
.hero-d .spec-line b{color:var(--accent-deep)}

/* ---- Hero E: gradient + quick info card (gbwhatsappplus.pro) ---- */
.hero-e{background:linear-gradient(125deg,#123B39 0%,#1F6B67 55%,#2B8F89 100%);color:#E9F7F6;padding:50px 0 58px;position:relative;overflow:hidden}
.hero-e:after{content:"";position:absolute;right:-120px;top:-120px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,#3CABA5 0,transparent 70%);opacity:.5}
.hero-e .wrap-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:36px;align-items:center;max-width:1080px;margin:0 auto;padding:0 18px;position:relative;z-index:1}
.hero-e h1{font-size:clamp(1.9rem,4vw,2.85rem);margin:.25em 0 .4em;color:#fff}
.hero-e .lead{color:#D4EFEC}
.hero-e .btn-ghost{color:#E9F7F6!important;border-color:rgba(233,247,246,.5)}
.hero-e .btn{background:#3CABA5;color:#0B2E2C!important}
.quick-card{background:#fff;color:#10302E;border-radius:18px;padding:18px 20px;box-shadow:0 22px 48px rgba(0,0,0,.28)}
.quick-card h2{margin:0 0 10px;font-size:1.1rem;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.quick-card .row{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid #D3ECEA;font-size:.93rem}
.quick-card .row:last-child{border:0}.quick-card .row span{color:#4B6462}.quick-card .row b{color:#1F6B67}

/* ---- Hero F: version panel (gbwhatsap.co.za) ---- */
.hero-f{background:#163532;color:#E9F7F6;padding:0}
.hero-f .band{background:var(--accent-deep);padding:10px 0;font-size:.85rem;text-align:center;color:#CDE9E6}
.hero-f .wrap-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;max-width:1080px;margin:0 auto;padding:40px 18px 48px}
.hero-f h1{font-size:clamp(1.8rem,3.6vw,2.6rem);margin:.2em 0 .35em;color:#fff}
.hero-f .lead{color:#B7D9D5}
.ver-panel{background:#fff;color:#0E2F2D;border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.ver-panel .ver{font-size:2.4rem;font-weight:800;color:var(--accent-deep);line-height:1;margin:0 0 6px}
.ver-panel .sub{color:var(--muted);margin:0 0 14px;font-size:.92rem}
.ver-panel table{width:100%;border-collapse:collapse}
.ver-panel th,.ver-panel td{padding:8px 0;border-bottom:1px solid var(--line);font-size:.9rem;text-align:left}
.ver-panel th{color:var(--muted);font-weight:600;width:40%}

/* ---- Hero G: bright solid + stat cards (gbapps.com.ru) ---- */
.hero-g{background:linear-gradient(180deg,#2A8580,#3CABA5);color:#fff;padding:48px 0 42px}
.hero-g .wrap{max-width:920px;margin:0 auto;padding:0 18px;text-align:center}
.hero-g .app-badge{margin:0 auto 14px;background:linear-gradient(145deg,#0E2F2D,#1F5F5B)}
.hero-g h1{font-size:clamp(1.85rem,3.8vw,2.7rem);margin:.2em 0 .4em;color:#fff}
.hero-g .lead{color:#E9F7F6;max-width:58ch;margin:0 auto}
.hero-g .hero-actions{justify-content:center}
.hero-g .btn{background:#0E2F2D;color:#E9F7F6!important}
.hero-g .btn-ghost{color:#fff!important;border-color:rgba(255,255,255,.55)}
.stat-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:880px;margin:28px auto 0}
.stat-cards>div{background:rgba(255,255,255,.95);color:#0E2F2D;border-radius:var(--radius);padding:16px 12px;box-shadow:0 10px 28px rgba(14,47,45,.2)}
.stat-cards b{display:block;font-size:1.25rem;color:#1F5F5B}.stat-cards span{font-size:.8rem;color:#4B6462}

/* Shared content widgets */
.app-info,.toc,.whats-new,.compare-wrap,.related,.safety,.author-box{margin:22px 0}
.app-info{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow)}
.app-info h2{margin:0 0 12px}
.info-table,.hist-table,.compare{width:100%;border-collapse:separate;border-spacing:0;background:var(--card);border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);box-shadow:0 4px 18px -12px rgba(14,47,45,.25)}
.info-table th,.info-table td,.hist-table th,.hist-table td,.compare th,.compare td{border-bottom:1px solid var(--line);padding:11px 13px;text-align:left;font-size:.92rem}
.info-table tr:last-child td,.info-table tr:last-child th,.hist-table tr:last-child td,.compare tr:last-child td{border-bottom:0}
.info-table th,.hist-table th,.compare th{background:color-mix(in srgb,var(--accent) 12%,var(--card));font-weight:700;color:var(--ink)}
.compare th{background:var(--accent-deep);color:#E9F7F6}
.compare tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--accent) 6%,transparent)}
.toc{background:var(--soft);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;box-shadow:0 1px 0 var(--line)}
.toc ol{margin:8px 0 0;padding-left:18px;columns:2}.toc a{color:var(--accent-dark);text-decoration:none}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:14px 0}
.fcard{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);transition:transform .15s}
.fcard:hover{transform:translateY(-3px)}
.fcard h3{margin:0 0 6px;font-size:1.02rem}.fcard p{margin:0;color:var(--muted);font-size:.92rem}
.ficon{width:40px;height:40px;border-radius:12px;background:linear-gradient(145deg,var(--accent),var(--accent-dark));margin-bottom:10px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:.85rem}
.steps{counter-reset:st;list-style:none;padding:0;margin:0}
.steps li{position:relative;padding:14px 14px 14px 56px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);margin:0 0 10px;box-shadow:0 1px 0 var(--line)}
.steps li:before{counter-increment:st;content:counter(st);position:absolute;left:12px;top:14px;width:30px;height:30px;border-radius:50%;background:var(--accent-dark);color:#fff;display:grid;place-items:center;font-weight:700;font-size:.85rem}
.proscons{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pros,.cons{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px}
.pros h3{color:#15803d}.cons h3{color:#b91c1c}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;margin:0 0 8px}
.faq summary{font-weight:700;cursor:pointer}
.rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.rel{display:block;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px;text-decoration:none;color:inherit;box-shadow:0 1px 0 var(--line);transition:transform .15s}
.rel:hover{transform:translateY(-3px)}.rel strong{display:block;margin-bottom:4px;color:var(--accent-dark)}.rel span{color:var(--muted);font-size:.9rem}
.author-box{display:flex;gap:12px;align-items:flex-start;background:var(--soft);border:1px solid var(--line);border-radius:var(--radius);padding:16px}
.avatar{width:48px;height:48px;border-radius:50%;background:linear-gradient(145deg,var(--accent),var(--accent-deep))}
.updated{font-size:.85rem;color:var(--muted);margin:6px 0 0}
.safety{background:var(--warn-bg);border:1px solid var(--warn-line);border-radius:var(--radius);padding:16px}
.sticky-dl{position:fixed;left:0;right:0;bottom:0;background:var(--card);border-top:1px solid var(--line);padding:10px 14px;display:none;justify-content:center;z-index:40;box-shadow:0 -6px 20px rgba(0,0,0,.08)}
.back-top{position:fixed;right:14px;bottom:72px;background:var(--accent-dark);color:#fff;text-decoration:none;padding:10px 12px;border-radius:999px;font-size:.8rem;font-weight:700;z-index:41}
.sec{padding:26px 0}.sec h2{font-size:1.35rem;margin:0 0 10px}

/* Header variants extras */
.topbar{background:var(--accent-deep);color:#dff5f3;text-align:center;padding:8px;font-size:.85rem}
.util{background:var(--accent-dark);color:#fff;font-size:.82rem;padding:6px 16px}
.util .wrap{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;max-width:1080px;margin:0 auto}
.mega{display:flex;flex-wrap:wrap;gap:10px 14px;font-size:.9rem}.mega a{color:var(--muted);font-weight:600}
header.site.dark-bar{background:var(--accent-deep);border-bottom:0}
header.site.dark-bar .brand,header.site.dark-bar .navlinks a{color:#E9F7F6}
header.site.band{border-bottom:3px solid var(--accent)}
header.site.split-pill .navlinks a{padding:6px 12px;border-radius:999px}
header.site.split-pill .navlinks a:hover{background:var(--soft)}
header.site.sticky-light{position:sticky;top:0;z-index:30;backdrop-filter:saturate(1.1) blur(6px);background:linear-gradient(180deg,var(--card),var(--soft))}

@media(max-width:860px){
  .hero-a .wrap-grid,.hero-c .wrap-grid,.hero-e .wrap-grid,.hero-f .wrap-grid{grid-template-columns:1fr}
  .phone-mock{display:none}
  .feature-grid,.rel-grid,.proscons,.stat-strip,.stat-cards{grid-template-columns:1fr 1fr}
  .toc ol{columns:1}
  .sticky-dl{display:flex}
  .navlinks,.mega{display:none}
}
@media(max-width:520px){.stat-strip,.stat-cards,.feature-grid,.rel-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.hero-a .breadcrumbs,.hero-c .breadcrumbs,.hero-e .breadcrumbs,.hero-f .breadcrumbs,.hero-g .breadcrumbs{color:rgba(233,247,246,.8)}
.hero-a .breadcrumbs a,.hero-c .breadcrumbs a,.hero-e .breadcrumbs a,.hero-f .breadcrumbs a,.hero-g .breadcrumbs a{color:#E9F7F6}
.hero-b .breadcrumbs{justify-content:center}
.hero-d .breadcrumbs{justify-content:center}