/* ═══════════════════════════════════════════════════════════
   WORLD FOCUS 1724CC — CUSTOM THEME STYLESHEET
   Design language: Dark sections, navy + gold, Montserrat + Inter
   Inspired by hbxg.co.za design system
═══════════════════════════════════════════════════════════ */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
    --navy:#0d2740;
    --navy-dk:#081d30;
    --navy-lt:#1a3a5c;
    --gold:#c5a028;
    --gold-lt:#e0b840;
    --gold-dk:#a08018;
    --black:#0a0a0a;
    --dark:#141414;
    --char:#1e1e1e;
    --mid:#2a2a2a;
    --white:#fff;
    --light:#f7f7f7;
    --lighter:#fafafa;
    --border:#e4e4e4;
    --border-dk:#333;
    --text:#1a1a1a;
    --muted:#6b6b6b;
    --muted-lt:#999;
}

html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;color:var(--text);background:var(--white);overflow-x:hidden;font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto;display:block}
ul{list-style:none}

/* ── CONTAINER ── */
.wrap{max-width:1400px;margin:0 auto;padding:0 24px}

/* ── SECTIONS ── */
.sec{padding:72px 0}
.sec-sm{padding:48px 0}
.sec-light{background:var(--white)}
.sec-dark{background:var(--navy)}

/* ── TYPOGRAPHY ── */
.h1{font-family:'Montserrat',sans-serif;font-size:clamp(32px,5vw,56px);font-weight:900;line-height:1.05;letter-spacing:-1px}
.h2{font-family:'Montserrat',sans-serif;font-size:clamp(24px,3vw,38px);font-weight:900;line-height:1.1;letter-spacing:-.5px}
.h3{font-family:'Montserrat',sans-serif;font-size:clamp(18px,2vw,24px);font-weight:800;line-height:1.2}
.h-center{text-align:center}
.lead{font-size:16px;color:var(--muted);line-height:1.75;max-width:680px;margin-bottom:16px}

/* ── TAG/EYEBROW ── */
.tag{font-family:'Montserrat',sans-serif;font-size:10px;font-weight:800;letter-spacing:3px;text-transform:uppercase;color:var(--gold);display:flex;align-items:center;gap:8px;margin-bottom:14px}
.tag::before{content:'';width:20px;height:2px;background:var(--gold);flex-shrink:0}
.tag-center{justify-content:center}
.tag-center::after{content:'';width:20px;height:2px;background:var(--gold);flex-shrink:0}
.sec-dark .tag{color:var(--gold)}

/* ── TOPBAR ── */
.topbar{background:var(--black);padding:7px 24px;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#999;flex-wrap:wrap;gap:6px}
.topbar-in{max-width:1400px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;width:100%;flex-wrap:wrap;gap:6px}
.topbar-left{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.topbar-right{display:flex;align-items:center;gap:12px}
.tb-item{display:flex;align-items:center;gap:6px;color:#999}
.tb-item a{color:#bbb;transition:color .2s}
.tb-item a:hover{color:var(--gold)}
.tb-item strong{color:var(--gold)}
.tb-item svg{opacity:.5}
.tb-loc{display:flex;align-items:center;gap:6px;color:#777;font-size:11px}
.tb-loc svg{color:var(--gold);opacity:.7}

/* ── HEADER ── */
header{background:#fff;border-bottom:3px solid var(--gold);position:-webkit-sticky;position:sticky;top:0;z-index:1000;box-shadow:0 2px 20px rgba(0,0,0,.08)}
.hdr{max-width:1400px;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;height:68px}
.logo{display:flex;align-items:center;flex-shrink:0}
.logo img{display:none!important}


/* ── NAV ── */
#main-nav{display:flex;align-items:center;gap:2px}
#main-nav a{font-family:'Montserrat',sans-serif;font-weight:700;font-size:11.5px;color:var(--text);padding:8px 12px;border-radius:4px;transition:all .2s;text-transform:uppercase;letter-spacing:.4px;white-space:nowrap}
#main-nav a:hover,#main-nav a.active{color:var(--gold)}
.nav-cta{background:var(--gold)!important;color:#000!important;padding:9px 18px!important;border-radius:5px;font-weight:800!important}
.nav-cta:hover{background:var(--gold-dk)!important;color:#000!important}

/* ── HAMBURGER ── */
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:6px;background:none;border:none}
.hamburger span{width:24px;height:2px;background:var(--text);border-radius:2px;transition:all .3s}
.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* ── MOBILE NAV ── */
.mob-nav{display:none;background:#fff;border-top:2px solid var(--gold);padding:16px 24px;flex-direction:column;gap:4px}
.mob-nav.open{display:flex}
.mob-nav a{font-family:'Montserrat',sans-serif;font-weight:700;font-size:13px;color:var(--text);padding:12px 0;border-bottom:1px solid var(--border);text-transform:uppercase;letter-spacing:.4px}
.mob-nav a:last-child{border:none}
.mob-nav a:hover{color:var(--gold)}
.m-cta{background:var(--gold);color:#000;padding:12px 20px;border-radius:5px;text-align:center;margin-top:8px;border:none;font-weight:800}

/* ── BUTTONS ── */
.btn-g{background:var(--gold);color:#000;font-family:'Montserrat',sans-serif;font-weight:800;font-size:12.5px;letter-spacing:.4px;text-transform:uppercase;padding:13px 28px;border-radius:5px;display:inline-flex;align-items:center;gap:8px;transition:all .2s;border:none;cursor:pointer}
.btn-g:hover{background:var(--gold-dk);transform:translateY(-1px)}
.btn-full{width:100%;justify-content:center;margin-top:16px}
.btn-ol{border:2px solid rgba(255,255,255,.8);color:#fff;font-family:'Montserrat',sans-serif;font-weight:800;font-size:12.5px;letter-spacing:.4px;text-transform:uppercase;padding:13px 28px;border-radius:5px;display:inline-flex;align-items:center;gap:8px;transition:all .2s}
.btn-ol:hover{border-color:var(--gold);color:var(--gold)}
.btn-dk{background:var(--black);color:#fff;font-family:'Montserrat',sans-serif;font-weight:800;font-size:12.5px;letter-spacing:.4px;text-transform:uppercase;padding:13px 28px;border-radius:5px;display:inline-flex;align-items:center;gap:8px;transition:all .2s}
.btn-dk:hover{background:var(--char)}
.btn-ol-dk{border:2px solid var(--border);color:var(--text);font-family:'Montserrat',sans-serif;font-weight:700;font-size:12.5px;text-transform:uppercase;padding:13px 28px;border-radius:5px;display:inline-flex;align-items:center;gap:8px;transition:all .2s}
.btn-ol-dk:hover{border-color:var(--gold);color:var(--gold)}

/* ════════════════════════════════
   HERO
══════════════════════════════ */
.hero{position:relative;min-height:88vh;background:var(--navy);display:flex;align-items:center;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:radial-gradient(ellipse at 70% 30%,var(--navy-lt) 0%,var(--navy) 40%,var(--navy-dk) 100%)}
.hero-bg::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:50px 50px;opacity:.5}
.hero-ov{position:absolute;inset:0;background:linear-gradient(110deg,rgba(8,29,48,.95) 0%,rgba(13,39,64,.65) 50%,rgba(13,39,64,.2) 100%)}
.hero-stripe{position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--gold);z-index:2}
.hero-ct{position:relative;z-index:2;padding:80px 24px 80px 48px;max-width:820px}
.hero-pill{display:inline-flex;align-items:center;gap:8px;background:rgba(197,160,40,.12);border:1px solid rgba(197,160,40,.3);border-radius:30px;padding:7px 16px;margin-bottom:22px}
.hero-pill span{font-family:'Montserrat',sans-serif;font-size:10px;font-weight:800;color:var(--gold);letter-spacing:2.5px;text-transform:uppercase}
.hero .h1{color:#fff;margin-bottom:20px}
.hero .h1 .gld{color:var(--gold)}
.hero-desc{font-size:16px;color:#bbb;line-height:1.75;max-width:560px;margin-bottom:32px}
.hero-btns{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:56px}
.hero-stats{display:flex;gap:36px;flex-wrap:wrap;padding-top:28px;border-top:1px solid rgba(255,255,255,.08)}
.hstat-n{font-family:'Montserrat',sans-serif;font-size:32px;font-weight:900;color:var(--gold);line-height:1}
.hstat-l{font-size:11px;color:#777;text-transform:uppercase;letter-spacing:.8px;margin-top:4px}

/* ── TRUST BAR ── */
.tbar{background:var(--char);border-bottom:1px solid rgba(255,255,255,.04);padding:16px 24px}
.tbar-in{max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:36px;flex-wrap:wrap}
.ti{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#bbb;font-family:'Montserrat',sans-serif;font-weight:600}
.ti-ic{color:var(--gold);font-size:15px}
.ti-sep{width:1px;height:24px;background:rgba(255,255,255,.08)}

/* ════════════════════════════════
   TWO COLUMN
══════════════════════════════ */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.process-box{background:var(--lighter);border:1px solid var(--border);border-radius:12px;padding:32px;border-top:4px solid var(--gold)}
.process-flow{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}
.pf-step{display:flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--border);border-radius:6px;padding:6px 12px}
.pf-num{width:22px;height:22px;background:var(--navy);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Montserrat',sans-serif;font-size:11px;font-weight:800}
.pf-label{font-family:'Montserrat',sans-serif;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text)}
.pf-desc{font-size:13px;color:var(--muted);line-height:1.6;margin-top:12px}

/* ════════════════════════════════
   PATHS (Two Business Paths)
══════════════════════════════ */
.paths-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.path-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:36px;transition:all .25s}
.path-card:hover{border-color:rgba(197,160,40,.3);background:rgba(255,255,255,.06)}
.path-card-gold{border-color:rgba(197,160,40,.15)}
.path-icon{margin-bottom:20px;opacity:.9}
.path-badge{display:inline-block;background:var(--gold);color:#000;font-family:'Montserrat',sans-serif;font-size:9px;font-weight:800;letter-spacing:2px;text-transform:uppercase;padding:4px 10px;border-radius:3px;margin-bottom:16px}
.path-sub{font-size:13px;color:var(--muted-lt);margin-bottom:20px;line-height:1.5}
.path-list{margin-bottom:8px}
.path-list li{font-size:14px;color:#ccc;padding:7px 0;padding-left:24px;position:relative;line-height:1.5}
.path-list li::before{content:'\2713';position:absolute;left:0;color:var(--gold);font-weight:700}

/* ════════════════════════════════
   INDUSTRIES GRID
══════════════════════════════ */
.ind-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ind-card{position:relative;height:280px;overflow:hidden;border-radius:10px;cursor:pointer;background:var(--navy);border:1px solid var(--border)}
.ind-card:hover{transform:translateY(-3px);box-shadow:0 14px 44px rgba(0,0,0,.12)}
.ind-emoji{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:80px;opacity:.15;transition:transform .5s}
.ind-card:hover .ind-emoji{transform:scale(1.1)}
.ind-ov{position:absolute;inset:0;background:linear-gradient(to top,var(--navy) 0%,rgba(13,39,64,.3) 70%,transparent)}
.ind-ct{position:absolute;bottom:0;left:0;right:0;padding:24px;z-index:2}
.ind-badge{display:inline-block;background:var(--gold);color:#000;font-family:'Montserrat',sans-serif;font-size:9px;font-weight:800;letter-spacing:2px;text-transform:uppercase;padding:4px 10px;border-radius:3px;margin-bottom:10px}
.ind-ct h3{font-family:'Montserrat',sans-serif;font-size:17px;font-weight:800;color:#fff;line-height:1.25;margin-bottom:6px}
.ind-ct p{font-size:12.5px;color:#aaa;line-height:1.55}

/* ════════════════════════════════
   TRUST GRID
══════════════════════════════ */
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.trust-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:10px;padding:28px;transition:all .25s}
.trust-card:hover{border-color:rgba(197,160,40,.2);background:rgba(255,255,255,.06)}
.trust-ic{font-size:32px;margin-bottom:14px}
.trust-card h3{font-family:'Montserrat',sans-serif;font-size:16px;font-weight:800;color:#fff;margin-bottom:8px}
.trust-card p{font-size:13.5px;color:#aaa;line-height:1.6}

/* ════════════════════════════════
   CTA BAR
══════════════════════════════ */
.cta-bar{background:var(--gold);padding:56px 24px}
.cta-in{max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap}
.cta-t h2{font-family:'Montserrat',sans-serif;font-size:clamp(22px,2.5vw,32px);font-weight:900;color:#000;line-height:1.2}
.cta-t p{font-size:14px;color:rgba(0,0,0,.55);margin-top:6px}
.cta-btns{display:flex;gap:12px;flex-wrap:wrap}

/* ════════════════════════════════
   PAGE HEADER (inner pages)
══════════════════════════════ */
.pg-hero{background:var(--navy);padding:64px 24px 48px;position:relative;overflow:hidden;border-bottom:3px solid var(--gold)}
.pg-hero::after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at 80% 20%,rgba(26,58,92,.5) 0%,transparent 60%)}
.pg-hero .wrap{position:relative;z-index:2}
.breadcrumb{display:flex;align-items:center;gap:7px;font-size:11.5px;color:#666;font-family:'Montserrat',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.4px;margin-bottom:16px}
.breadcrumb a{color:var(--gold);transition:color .2s}
.breadcrumb a:hover{color:var(--gold-lt)}
.bc-sep{color:#444}
.bc-current{color:#888}
.pg-hero .h1{color:#fff}

/* ════════════════════════════════
   PAGE CONTENT (inner pages)
══════════════════════════════ */
.page-content{max-width:900px;margin:0 auto}
.page-content h2{font-family:'Montserrat',sans-serif;font-size:28px;font-weight:900;color:var(--navy);margin:36px 0 16px;line-height:1.2}
.page-content h3{font-family:'Montserrat',sans-serif;font-size:20px;font-weight:800;color:var(--navy);margin:28px 0 12px;line-height:1.3}
.page-content h4{font-family:'Montserrat',sans-serif;font-size:17px;font-weight:700;color:var(--navy-lt);margin:24px 0 10px}
.page-content p{font-size:15px;color:var(--text);line-height:1.75;margin-bottom:16px}
.page-content ul{margin:16px 0 16px 20px;padding-left:20px}
.page-content ul li{font-size:15px;color:var(--text);line-height:1.75;margin-bottom:8px;list-style:disc}
.page-content ol{margin:16px 0 16px 20px;padding-left:20px}
.page-content ol li{font-size:15px;color:var(--text);line-height:1.75;margin-bottom:8px;list-style:decimal}
.page-content strong{font-weight:700;color:var(--navy)}
.page-content a{color:var(--gold-dk);text-decoration:underline}
.page-content blockquote{border-left:4px solid var(--gold);padding:16px 24px;margin:24px 0;background:var(--lighter);border-radius:0 8px 8px 0;font-style:italic;color:var(--muted)}
.page-content table{width:100%;border-collapse:collapse;margin:24px 0}
.page-content table th{background:var(--navy);color:#fff;padding:12px 16px;text-align:left;font-family:'Montserrat',sans-serif;font-size:13px;font-weight:700}
.page-content table td{padding:12px 16px;border-bottom:1px solid var(--border);font-size:14px}
.page-content table tr:nth-child(even){background:var(--lighter)}
.page-content hr{border:none;border-top:2px solid var(--border);margin:36px 0}
.page-content code{background:var(--light);padding:2px 6px;border-radius:3px;font-size:13px}

/* ── Contact form styling ── */
.page-content form{margin:24px 0}
.page-content label{display:block;font-family:'Montserrat',sans-serif;font-size:12px;font-weight:700;color:var(--navy);margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}
.page-content input[type=text],
.page-content input[type=email],
.page-content input[type=tel],
.page-content input[type=url],
.page-content textarea,
.page-content select{width:100%;padding:12px 16px;border:2px solid var(--border);border-radius:6px;font-family:'Inter',sans-serif;font-size:14px;color:var(--text);transition:border-color .2s;margin-bottom:16px}
.page-content input:focus,
.page-content textarea:focus,
.page-content select:focus{border-color:var(--gold);outline:none}
.page-content textarea{min-height:120px;resize:vertical}
.page-content button[type=submit],
.page-content input[type=submit]{background:var(--gold);color:#000;font-family:'Montserrat',sans-serif;font-weight:800;font-size:13px;letter-spacing:.5px;text-transform:uppercase;padding:14px 32px;border-radius:6px;border:none;cursor:pointer;transition:all .2s}
.page-content button[type=submit]:hover,
.page-content input[type=submit]:hover{background:var(--gold-dk);transform:translateY(-1px)}

/* ════════════════════════════════
   FOOTER
══════════════════════════════ */
.site-footer{background:var(--black);color:#ccc;width:100%}
.ft-top{padding:60px 0 44px}
.ft-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:44px}
.ft-brand .ft-logo{margin-bottom:16px}
.ft-brand 
.ft-desc{font-size:13.5px;color:#888;line-height:1.65;margin-bottom:20px}
.ft-contact p{font-size:13px;color:#999;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.ft-contact a{color:#bbb;transition:color .2s}
.ft-contact a:hover{color:var(--gold)}
.ft-head{font-family:'Montserrat',sans-serif;font-size:10px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-bottom:18px}
.ft-links li{margin-bottom:11px}
.ft-links a{font-size:13.5px;color:#888;transition:color .2s}
.ft-links a:hover{color:var(--gold)}
.ft-bot{border-top:1px solid rgba(255,255,255,.07);padding:20px 0}
.ft-bot-in{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.ft-bot p{font-size:12px;color:#666}

/* ════════════════════════════════
   FLOATING BUTTONS
══════════════════════════════ */
.floats{position:fixed;bottom:24px;right:20px;display:flex;flex-direction:column;gap:10px;z-index:9999}
.fl-btn{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 16px rgba(0,0,0,.3);transition:transform .2s}
.fl-btn:hover{transform:scale(1.1)}
.fl-wa{background:#25D366;color:#fff}
.fl-ph{background:var(--gold);color:#000}

/* ── WordPress core overrides ── */
.wp-block-button__link{background:var(--gold)!important;color:#000!important;border-radius:5px!important;font-family:'Montserrat',sans-serif!important;font-weight:800!important}
.site-content{display:none}
/* Hide Astra remnants */
.ast-container,.ast-site-header-cart,.astra-advanced-hook{display:none!important}

/* ── Utility ── */
.text-center{text-align:center}
.mt-0{margin-top:0}
.mb-0{margin-bottom:0}


/* ── CSS TEXT LOGO (replaces image logo) ── */
.logo-text{display:flex;align-items:baseline;gap:3px;text-decoration:none;flex-shrink:0}
.logo-wf{font-family:"Montserrat",sans-serif;font-weight:900;font-size:18px;color:var(--navy);letter-spacing:-.5px;text-transform:uppercase}
.logo-cc{font-family:"Montserrat",sans-serif;font-weight:800;font-size:13px;color:var(--gold);letter-spacing:.5px}

/* Footer text logo */
.ft-logo-text{display:flex;align-items:baseline;gap:3px;margin-bottom:16px}
.ft-logo-wf{font-family:"Montserrat",sans-serif;font-weight:900;font-size:18px;color:#fff;letter-spacing:-.5px;text-transform:uppercase}
.ft-logo-cc{font-family:"Montserrat",sans-serif;font-weight:800;font-size:13px;color:var(--gold);letter-spacing:.5px}

/* Hide any image logo remnants */
.custom-logo{display:none!important}
.wp-custom-logo .logo img{display:none!important}


/* ── WP MENU FIX v1.0.2 ── */
#main-nav{display:flex!important;align-items:center;gap:0!important}
#main-nav ul{display:flex!important;align-items:center;gap:0!important;list-style:none;padding:0!important;margin:0!important}
#main-nav ul li{position:relative;list-style:none}
#main-nav ul li a{font-family:"Montserrat",sans-serif!important;font-weight:700;font-size:11.5px;color:#1a1a1a!important;padding:10px 14px!important;border-radius:4px;transition:all .2s;text-transform:uppercase;letter-spacing:.4px;white-space:nowrap;display:block}
#main-nav ul li a:hover,#main-nav ul li.current-menu-item > a{color:#c5a028!important;font-weight:800}
#main-nav .nav-cta{background:#c5a028!important;color:#000!important;padding:10px 18px!important;border-radius:5px;font-weight:800!important;margin-left:8px}
#main-nav .nav-cta:hover{background:#a08018!important;color:#000!important}

.mob-nav ul{list-style:none;padding:0!important;margin:0!important}
.mob-nav ul li a{font-family:"Montserrat",sans-serif;font-weight:700;font-size:13px;color:#1a1a1a!important;padding:12px 0!important;border-bottom:1px solid #e4e4e4;text-transform:uppercase;letter-spacing:.4px;display:block}
.mob-nav ul li a:hover{color:#c5a028!important}
