
:root{--navy:#12282d;--navy2:#0b1b21;--ink:#19343b;--muted:#51636a;--gold:#f1b476;--gold2:#e59c51;--mint:#dcebe6;--soft:#f5f8f6;--line:#dbe4e2;--max:1200px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'DM Sans',Arial,sans-serif;color:var(--ink);line-height:1.7;background:#fff;-webkit-font-smoothing:antialiased}a{color:inherit}img{display:block;max-width:100%;height:auto}h1,h2,h3,.logo{font-family:Manrope,Arial,sans-serif;letter-spacing:-.035em;line-height:1.2}h1{font-weight:800;font-size:clamp(2.1rem,4.15vw,4.1rem);margin:14px 0 20px}h2{font-size:clamp(1.6rem,2.7vw,2.65rem);margin:0 0 23px}h3{font-size:1.21rem;line-height:1.35;margin:0 0 10px}p{margin:0 0 16px}ul{padding-left:1.25rem}.wrap{width:min(var(--max),calc(100% - 48px));margin-inline:auto}.skip{position:absolute;top:-60px;left:10px;background:white;color:black;padding:8px;z-index:100}.skip:focus{top:10px}.header{position:sticky;top:0;z-index:40;background:#fff;box-shadow:0 7px 28px #11292e11}.nav{display:flex;align-items:center;gap:32px;min-height:86px}.logo{text-decoration:none;display:flex;align-items:center;gap:11px;flex-shrink:0}.logo-mark{display:grid;place-items:center;background:var(--navy);color:var(--gold);width:41px;height:41px;border-radius:11px;font-size:1.42rem;font-weight:800}.logo strong{display:block;font-size:1.1rem;color:var(--navy);white-space:nowrap;line-height:1.1}.logo small{display:block;letter-spacing:.11em;font-size:.61rem;font-weight:800;color:#5d757a;margin-top:3px}.links{display:flex;gap:25px;align-items:center;margin-left:auto}.links a{font-size:.91rem;font-weight:700;text-decoration:none;white-space:nowrap}.links a:hover{color:#9a642f}.nav-call{white-space:nowrap;background:var(--navy);color:#fff;text-decoration:none;border-radius:8px;padding:12px 17px;font-weight:800;font-size:.9rem}.nav-call span{color:var(--gold)}.hero{background:var(--navy2);color:#fff;position:relative;isolation:isolate;overflow:hidden}.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.30;object-position:center}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,#0b1e23f7 0%,#0d242aed 49%,#102b32a0 100%);z-index:-1}.hero-glow{position:absolute;right:12%;top:-120px;width:540px;height:540px;border:1px solid #ffffff25;border-radius:50%}.hero-grid{padding-block:65px 72px;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(340px,.83fr);align-items:center;gap:58px}.hero-copy{position:relative;z-index:1}.eyebrow,.kicker{display:block;font-size:.73rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--gold2);line-height:1.5}.eyebrow{color:var(--gold)}.lead{font-size:clamp(1.04rem,1.4vw,1.2rem);max-width:620px;line-height:1.77;color:#eef5f3}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:29px 0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:13px;text-align:center;border-radius:9px;padding:13px 21px;min-height:47px;font-weight:800;font-size:.95rem;border:1px solid transparent;text-decoration:none;cursor:pointer;font-family:inherit;line-height:1.35}.btn-gold{background:var(--gold);color:#162a30}.btn-gold:hover{background:#f6c48f}.btn-line{background:#ffffff07;color:#fff;border-color:#ffffff7c}.btn-line:hover{background:#ffffff1c}.btn-dark{background:var(--navy);color:#fff}.btn-dark:hover{background:#23434b}.hero-foot{font-size:.85rem;color:#d5e3df;margin:14px 0 0}.booking{background:white;color:var(--ink);border-radius:17px;padding:28px;box-shadow:0 19px 60px #00181c49;position:relative;z-index:1}.booking h2{font-size:1.55rem;margin:3px 0 7px}.form-top>span{font-weight:800;font-size:.69rem;letter-spacing:.13em;color:#a26936}.form-top>p{color:var(--muted);font-size:.91rem;margin-bottom:21px;line-height:1.5}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.booking label{font-weight:700;font-size:.78rem;display:block;min-width:0}.booking input,.booking select,.booking textarea{font-family:inherit;font-weight:500;display:block;width:100%;min-width:0;background:#fff;color:#19343b;border:1px solid #c8d7d5;border-radius:8px;padding:11px 12px;margin-top:6px;font-size:.91rem;line-height:1.4;outline:0}.booking input:focus,.booking select:focus,.booking textarea:focus{border-color:#96602c;box-shadow:0 0 0 3px #f1b47655}.booking textarea{resize:vertical}.booking button{width:100%;font-size:1rem}.form-privacy{font-size:.73rem;color:#5e6b70;margin:0;line-height:1.4}.full{grid-column:1/-1}.trap{position:absolute!important;left:-9999px!important;top:-9999px!important;visibility:hidden!important}.section{padding:72px 0}.soft{background:var(--soft)}.section-heading{max-width:760px;margin:0 0 30px}.section-heading .kicker{margin:0 0 9px}.section-heading h2{margin-bottom:13px}.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px}.service-card{background:#fff;border:1px solid var(--line);border-radius:15px;overflow:hidden;min-width:0;box-shadow:0 8px 24px #152c2910}.service-card img{height:197px;width:100%;object-fit:cover}.service-card-body{padding:23px}.service-card-body h3{margin-bottom:12px}.service-card-body p{color:#506269;font-size:.94rem;line-height:1.65;min-height:76px}.service-card-body a,.diagnostic a,.detail-panel a{color:#0b665a;text-decoration:none;font-weight:800}.service-card-body a:hover,.diagnostic a:hover{color:#084f44;text-decoration:underline}.intro-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(240px,.75fr);gap:65px;align-items:start}.intro-grid p{max-width:690px}.intro-grid h2{margin-top:12px}.detail-panel{background:#eaf4f1;border:1px solid #d7e8e3;border-radius:16px;padding:26px}.detail-panel p,.detail-panel li{font-size:.92rem}.detail-panel ul{margin:8px 0 14px}.article-width{max-width:855px}.article-width h2{max-width:780px}.article-width p{font-size:1.045rem;line-height:1.84;max-width:840px}.faq{margin-top:25px}.faq details{border-bottom:1px solid var(--line);padding:18px 0}.faq summary{font-size:1.03rem;font-weight:800;cursor:pointer;list-style:none;position:relative;padding-right:28px}.faq summary:after{content:'+';position:absolute;right:0;font-size:1.5rem;line-height:1}.faq details[open] summary:after{content:'−'}.faq details p{margin:11px 0 2px;font-size:.98rem;color:#445960;line-height:1.72}.related-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.related-links a,.area-shortcuts a{border:1px solid var(--line);border-radius:11px;padding:17px 18px;background:white;text-decoration:none;font-weight:700;display:flex;justify-content:space-between;align-items:center;gap:12px;line-height:1.45;font-size:.92rem}.related-links a:hover,.area-shortcuts a:hover{border-color:#aebfb7;box-shadow:0 7px 15px #062e2511}.related-links a span{color:#0b665a}.cta-band{background:var(--navy);color:#fff;padding:56px 0}.cta-grid{display:flex;justify-content:space-between;align-items:center;gap:28px}.cta-grid>div{max-width:740px}.cta-grid h2{margin:9px 0 13px;color:#fff}.cta-grid p{color:#d9e7e4;margin:0}.cta-grid .btn{flex-shrink:0}.tri-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.diagnostic{padding:26px;background:#f6f8f7;border-radius:15px;border:1px solid var(--line)}.diagnostic p{font-size:.94rem;color:#4a6265}.diagnostic .number{font-weight:800;color:#b17c48;font-size:1.05rem;display:block;margin-bottom:17px}.two-column{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}.two-column img{width:100%;aspect-ratio:6/5;object-fit:cover;border-radius:16px}.two-column h2{margin-top:10px}.two-column .btn{margin-top:8px}.area-shortcuts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.area-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.area-tile{border:1px solid var(--line);border-radius:14px;padding:25px;background:#f9fbfa}.area-tile h3{font-size:1.35rem}.area-tile ul{list-style:none;margin:10px 0 0;padding:0}.area-tile li{padding:6px 0;border-top:1px solid var(--line)}.area-tile a{font-size:.93rem;text-decoration:none;font-weight:700;color:#13665a}.area-tile a:hover{text-decoration:underline}.foot{background:var(--navy2);color:#e4eeee;padding:55px 0 22px}.foot .logo strong{color:white}.foot .logo-mark{background:#1e3940}.foot p{color:#bbd1d0;font-size:.92rem;max-width:415px;margin:19px 0 0}.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:48px}.foot-grid>div>strong{display:block;font-size:.97rem;margin-bottom:20px}.foot-grid>div>a:not(.logo){display:block;text-decoration:none;margin-bottom:11px;font-size:.9rem;color:#dce8e7;overflow-wrap:anywhere}.foot-grid a:hover{text-decoration:underline}.foot-bottom{border-top:1px solid #ffffff27;padding-top:20px;margin-top:46px;color:#b4c9c7;font-size:.8rem}.float{position:fixed;bottom:18px;right:18px;display:flex;gap:8px;z-index:38}.float a{width:43px;height:43px;border-radius:50%;display:grid;place-items:center;text-decoration:none;color:white;background:#176b59;font-weight:800;box-shadow:0 5px 17px #10282a43;font-size:.86rem}.float a:first-child{background:#15323a}.float a:last-child{background:#385e77}.thanks{min-height:85vh;display:grid;place-items:center;padding:40px 20px;background:#f3f7f6}.thanks-card{max-width:640px;padding:44px;background:#fff;border-radius:14px;box-shadow:0 12px 35px #10282915}.thanks h1{font-size:2.6rem}.thanks-card .btn{margin-top:18px}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #e59c51;outline-offset:3px}
@media(max-width:1050px){.nav{gap:14px}.links{gap:13px}.hero-grid{gap:32px;grid-template-columns:1fr 400px}.nav-call{padding:10px 12px}.intro-grid{gap:35px}}@media(max-width:850px){.header{position:relative}.nav{flex-wrap:wrap;min-height:0;padding-block:15px}.links{order:3;width:100%;margin:0;justify-content:space-between;border-top:1px solid var(--line);padding-top:10px}.nav-call{margin-left:auto}.hero-grid{grid-template-columns:1fr;gap:28px;padding:45px 0 54px}.hero-copy{max-width:760px}.booking{max-width:700px;width:100%;margin:auto}.intro-grid,.two-column{grid-template-columns:1fr;gap:28px}.tri-grid,.service-grid,.related-links,.area-shortcuts,.area-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.cta-grid{align-items:start;flex-direction:column}.foot-grid{grid-template-columns:1.6fr 1fr;gap:30px}}@media(max-width:580px){.wrap{width:calc(100% - 32px)}.nav{gap:9px}.logo-mark{width:35px;height:35px}.logo strong{font-size:.93rem}.logo small{font-size:.49rem}.nav-call{font-size:.76rem;padding:9px 10px}.links{overflow-x:auto;gap:17px;justify-content:flex-start;white-space:nowrap;padding-bottom:4px}.links a{font-size:.85rem}.hero-grid{padding:34px 0 42px}h1{font-size:clamp(2.05rem,8vw,2.85rem)}h2{font-size:1.78rem}.hero-actions{gap:9px}.hero-actions .btn{flex:1 1 100%;width:100%}.booking{padding:19px 16px}.form-grid{grid-template-columns:1fr;gap:11px}.section{padding:48px 0}.service-grid,.tri-grid,.related-links,.area-shortcuts,.area-tiles{grid-template-columns:1fr}.service-card img{height:210px}.service-card-body p{min-height:auto}.two-column{gap:20px}.foot{padding-top:45px}.foot-grid{grid-template-columns:1fr}.float{bottom:8px;right:8px;gap:5px}.float a{width:38px;height:38px;font-size:.75rem}.cta-band{padding:42px 0}.cta-grid .btn{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media(max-width:580px){.links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;overflow:visible;white-space:normal;align-items:center}.links a{text-align:center;font-size:.76rem;line-height:1.2;min-height:30px;display:grid;place-items:center}.float{flex-direction:column;gap:6px}.float a{width:37px;height:37px}}

/* Accessible non-obscuring mobile actions: a full-width bottom contact dock. */
.float-text{display:none}
.float-icon{display:inline-grid;place-items:center;line-height:1}
@media(max-width:580px){
 body{padding-bottom:calc(60px + env(safe-area-inset-bottom))}
 .float{left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;padding-bottom:env(safe-area-inset-bottom);background:#fff;box-shadow:0 -4px 22px #10282a38;z-index:45}
 .float a{width:100%;height:60px;border-radius:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;box-shadow:none;font-size:.8rem;min-width:0}
 .float-icon{font-size:1.08rem;font-weight:800}
 .float-text{display:block;font-size:.68rem;letter-spacing:.01em}
 .float a:focus-visible{outline:3px solid #f4bd80;outline-offset:-3px}
}

/* Batch 2 service-area breadcrumbs and compact editorial reading rhythm */
.breadcrumb-section{background:#f6f8f7;border-bottom:1px solid #dde7e3;padding:14px 0}.breadcrumbs{font-size:.81rem;display:flex;flex-wrap:wrap;gap:9px;align-items:center;color:#55656b}.breadcrumbs a{color:#0e685c;text-decoration:underline;text-underline-offset:3px}.breadcrumbs span:last-child{font-weight:700}.related-links a{min-width:0;overflow-wrap:anywhere}.diagnostic-section{padding:42px 0}.diagnostic-section .article-width h2{margin-bottom:14px}.diagnostic-section .article-width p{margin-bottom:0}@media(max-width:580px){.diagnostic-section{padding:33px 0}}
/* BATCH5 ACCESSIBLE SERVICE DIRECTORY */

.service-directory{display:grid;gap:12px;max-width:1000px;margin-inline:auto}
.service-directory-group{border:1px solid rgba(25,52,59,.17);border-radius:14px;background:#fff;overflow:hidden}
.service-directory-group>summary{cursor:pointer;font-size:1rem;font-weight:700;line-height:1.55;padding:16px 20px;list-style:revert;color:#19343b}
.service-directory-group>summary:focus-visible{outline:3px solid #127a67;outline-offset:-3px}
.service-directory-group[open]>summary{border-bottom:1px solid rgba(25,52,59,.13)}
.service-directory-group>.area-shortcuts{padding:16px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,235px),1fr));gap:8px}
.service-directory-group .area-shortcuts a{display:flex;align-items:center;min-height:45px;overflow-wrap:anywhere}
.service-guide-links{max-width:1000px;margin:24px auto 0;padding:18px 20px;border-radius:15px;border:1px solid rgba(25,52,59,.15);background:rgba(255,255,255,.8)}
.service-guide-links h3{margin:0 0 8px}.service-guide-links p{margin:0 0 15px}
@media(max-width:600px){.service-directory-group>summary{padding:15px}.service-directory-group>.area-shortcuts{padding:10px;grid-template-columns:1fr}.service-guide-links{padding:16px}}

/* Release refinements */
.form-privacy a{color:#0a6356;text-decoration:underline;text-underline-offset:2px}.foot-bottom a{color:#e9f1ee}.thanks-card .hero-actions{margin-bottom:0}.mail-error{min-height:100vh}.mail-error .thanks-card{max-width:720px}.mail-error .hero-actions .btn{flex:1}.privacy-inline{font-size:.83rem}

/* Approved Gauteng Gas Appliances Repair logo system — 2026-10-11 */
:root{--navy:#092e54;--navy2:#071f39;--ink:#15384f;--muted:#4e6372;--gold:#e62229;--gold2:#0968b5;--mint:#eaf4f0;--soft:#f6fafb}
.header{border-bottom:3px solid transparent;border-image:linear-gradient(90deg,#dc121a 0%,#dc121a 32%,#0870bd 33%,#0870bd 65%,#00954c 66%,#00954c 100%) 1}
.logo{gap:8px}.logo .brand-symbol{display:block;width:70px;height:54px;object-fit:contain;flex:0 0 auto}
.logo .brand-wordmark{display:block;min-width:0}.logo .brand-wordmark strong{color:#082e55;font-size:1.07rem;letter-spacing:-.03em}
.logo .brand-wordmark small{color:#007645;letter-spacing:.075em;font-size:.59rem;line-height:1.3}
.nav{min-height:86px;gap:20px}.nav-call{background:#073765}.nav-call:hover,.nav-call:focus-visible{background:#0a5487}.nav-call span{color:#fff}
.btn-gold{background:#d71920;color:#fff}.btn-gold:hover,.btn-gold:focus-visible{background:#ab111a;color:#fff}
.btn-dark{background:#073765}.btn-dark:hover{background:#0b5382}
.eyebrow{color:#bde0fc}.kicker{color:#0667b3}.hero .eyebrow{color:#d4eaff}
.links a:hover,.links a:focus-visible{color:#007745}.service-card-body a,.diagnostic a,.detail-panel a,.area-tile a{color:#075d9b}
.service-card-body a:hover,.diagnostic a:hover,.area-tile a:hover{color:#006b40}
.foot{background:#061e37}.foot-logo{display:inline-flex;max-width:220px;border-radius:12px;overflow:hidden;background:#fff;padding:5px;box-shadow:0 10px 26px #0000002e}
.foot .brand-full{width:100%;height:auto;display:block;object-fit:contain}
.foot .foot-logo:hover{text-decoration:none;box-shadow:0 8px 28px #0005}
.status-brand{display:flex;justify-content:center;width:100%;margin:0 auto 24px}.status-brand img{max-width:166px;height:auto;border-radius:9px}
@media(max-width:1050px){.nav{gap:11px}.links{gap:12px}.logo .brand-symbol{width:59px;height:49px}.logo .brand-wordmark strong{font-size:.99rem}}
@media(max-width:580px){.nav{gap:7px}.logo{gap:3px}.logo .brand-symbol{width:50px;height:43px}.logo .brand-wordmark strong{font-size:.86rem}.logo .brand-wordmark small{font-size:.47rem;letter-spacing:.055em}.nav-call{padding:8px 8px;font-size:.72rem}.foot-logo{max-width:185px}}
@media(max-width:370px){.logo .brand-symbol{width:43px;height:39px}.logo .brand-wordmark strong{font-size:.81rem}.logo .brand-wordmark small{font-size:.43rem}.nav-call{font-size:.67rem;padding:8px 6px}}
