/* Serensic Africa — shared styles for service & location subpages */
:root {
  --red:          #C8232A;
  --red-light:    #E03030;
  --red-glow:     rgba(200,35,42,0.5);
  --grey:         #6B7280;
  --grey-light:   #9CA3AF;
  --white:        #FFFFFF;
  --off-white:    #F4F5F7;
  --black:        #0A0A0C;
  --black-mid:    #111316;
  --black-deep:   #070709;
  --text-dark:    #0D0D0F;
  --text-muted:   rgba(200,205,215,0.55);
  --text-light:   #E8EAF0;
  --border-dark:  rgba(255,255,255,0.07);
  --border-grey:  rgba(107,114,128,0.3);
  --border-red:   rgba(200,35,42,0.35);
}
*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { font-family:'Rajdhani',sans-serif; background:var(--black); color:var(--text-light); min-height:100vh;
  background-image:linear-gradient(rgba(200,35,42,0.025) 1px,transparent 1px),linear-gradient(90deg,rgba(200,35,42,0.025) 1px,transparent 1px);
  background-size:44px 44px; }

.scanlines { position:fixed; inset:0; z-index:1; pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,0.055) 2px,rgba(0,0,0,0.055) 4px); }

nav { position:fixed; top:0; left:0; right:0; z-index:1000; padding:0 36px; height:70px; display:flex; align-items:center; justify-content:space-between; background:rgba(7,7,9,0.94); backdrop-filter:blur(20px); border-bottom:1px solid var(--border-dark); }
.nav-logo { display:inline-block; background:var(--white); padding:8px 18px; clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%); box-shadow:0 0 18px rgba(255,255,255,0.12); }
.nav-logo img { height:44px; width:auto; display:block; }
.nav-back { font-family:'Orbitron',monospace; font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--grey-light); text-decoration:none; border:1px solid var(--border-grey); padding:10px 22px; clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%); transition:all .3s; }
.nav-back:hover { color:var(--white); border-color:var(--white); }

.page { position:relative; z-index:2; max-width:880px; margin:0 auto; padding:130px 28px 80px; }

.breadcrumb { font-family:'Share Tech Mono',monospace; font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--grey); margin-bottom:26px; }
.breadcrumb a { color:var(--grey-light); text-decoration:none; transition:color .3s; }
.breadcrumb a:hover { color:var(--red); }
.breadcrumb .sep { color:var(--red); margin:0 8px; }

.page-tag { font-family:'Share Tech Mono',monospace; font-size:11px; letter-spacing:4px; text-transform:uppercase; color:var(--red); display:block; margin-bottom:14px; }
h1 { font-family:'Orbitron',monospace; font-size:clamp(24px,4.5vw,40px); font-weight:900; letter-spacing:1px; line-height:1.2; margin-bottom:18px; color:var(--white); }
h1 .accent { color:var(--red); text-shadow:0 0 36px var(--red-glow); }
.lead { font-size:17px; color:var(--grey-light); line-height:1.8; margin-bottom:40px; border-left:3px solid var(--red); padding-left:18px; }

h2 { font-family:'Orbitron',monospace; font-size:16px; font-weight:700; letter-spacing:1.5px; color:var(--white); margin:42px 0 16px; padding-bottom:10px; border-bottom:1px solid var(--border-dark); }
h2 .hash { color:var(--red); }
p { font-size:15px; color:var(--grey-light); line-height:1.85; margin-bottom:14px; }
strong { color:var(--text-light); }

.check-list { list-style:none; margin:18px 0; }
.check-list li { font-size:14.5px; color:var(--grey-light); padding:10px 0; border-bottom:1px solid var(--border-dark); display:flex; align-items:baseline; gap:12px; line-height:1.6; }
.check-list li::before { content:'▸'; color:var(--red); flex-shrink:0; }

.stat-strip { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:2px; background:rgba(255,255,255,0.04); margin:30px 0; }
.stat-cell { background:var(--black-mid); padding:20px 18px; text-align:center; }
.stat-cell .num { font-family:'Orbitron',monospace; font-size:24px; font-weight:900; color:var(--red); display:block; }
.stat-cell .lbl { font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--grey); margin-top:5px; display:block; }

.cta-panel { margin-top:52px; border:1px solid var(--border-red); background:linear-gradient(160deg,#0E0F12,#0A0A0C); padding:36px 38px; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
  box-shadow:0 0 40px rgba(200,35,42,0.1); }
.cta-panel h3 { font-family:'Orbitron',monospace; font-size:16px; font-weight:900; color:var(--white); letter-spacing:1px; margin-bottom:6px; }
.cta-panel p { font-size:13.5px; margin-bottom:0; }
.btn-red { font-family:'Orbitron',monospace; font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase; padding:15px 32px; background:var(--red); color:var(--white); border:none; cursor:pointer; text-decoration:none; clip-path:polygon(10px 0%,100% 0%,calc(100% - 10px) 100%,0% 100%); transition:all .3s; white-space:nowrap; }
.btn-red:hover { background:var(--red-light); box-shadow:0 4px 20px rgba(200,35,42,0.35); }

.related { margin-top:46px; }
.related-links { display:flex; flex-wrap:wrap; gap:10px; }
.related-links a { font-family:'Share Tech Mono',monospace; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--grey-light); text-decoration:none; border:1px solid var(--border-grey); padding:9px 16px; transition:all .3s; }
.related-links a:hover { color:var(--red); border-color:var(--red); }

/* Article body */
.article-meta { font-family:'Share Tech Mono',monospace; font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--grey); margin-bottom:30px; display:flex; flex-wrap:wrap; gap:8px 18px; }
.article-meta .tag-pill { color:var(--red); }
.article-body h2 { margin-top:40px; }
.article-body h3 { font-family:'Orbitron',monospace; font-size:14px; font-weight:700; color:var(--white); letter-spacing:.5px; margin:28px 0 12px; }
.article-body ul { margin:14px 0; }
.callout { border:1px solid var(--border-red); background:rgba(200,35,42,0.05); padding:22px 26px; margin:28px 0; }
.callout strong { color:var(--red); display:block; font-family:'Orbitron',monospace; font-size:12px; letter-spacing:1px; margin-bottom:8px; }
.callout p { margin-bottom:0; font-size:14px; }

/* WhatsApp */
.wa-btn { position:fixed; right:22px; bottom:22px; z-index:4000; width:58px; height:58px; border-radius:50%; background:#25D366; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 24px rgba(37,211,102,0.4); transition:transform .25s; }
.wa-btn:hover { transform:scale(1.12); }
.wa-btn svg { width:30px; height:30px; fill:#fff; }
.wa-btn::before { content:''; position:absolute; inset:0; border-radius:50%; border:2px solid rgba(37,211,102,0.55); animation:wa-pulse 2.2s ease-out infinite; }
@keyframes wa-pulse { 0%{transform:scale(1);opacity:1} 100%{transform:scale(1.65);opacity:0} }

footer { position:relative; z-index:2; border-top:1px solid var(--border-dark); padding:22px 0; text-align:center; margin-top:40px; }
.footer-copy { font-family:'Share Tech Mono',monospace; font-size:11px; color:var(--grey); letter-spacing:1px; }
.footer-copy .hl { color:var(--red); }
.footer-copy a { color:var(--grey-light); text-decoration:none; }
.footer-copy a:hover { color:var(--red); }

@media(max-width:640px){
  nav { padding:0 18px; }
  .nav-logo img { height:34px; }
  .page { padding:115px 18px 56px; }
  .cta-panel { padding:26px 22px; }
}
