/*
Theme Name: Clear Bills
Theme URI: https://example.com/clear-bills
Author: Pradeep Maurya
Author URI: https://pradeepmaurya.in
Description: A green, conversion-focused energy/NBN/insurance comparison theme for Clear Bills, built with Bootstrap 5 and Font Awesome. Hero, services, steps, features and the lead form are all editable from the WordPress admin (Customizer + custom post types).
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.6
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: clearbills
*/

:root{
  --cb-dark: #0f3d22;
  --cb-green: #1e8a3c;
  --cb-green2: #34a853;
  --cb-light: #eaf7ee;
  --cb-light2: #f3faf4;
  --cb-text: #16241c;
  --cb-muted: #5b6b62;
  --cb-yellow: #f5a623;
  --cb-blue: #2f8fd6;
}
*{box-sizing:border-box;}
body{
  font-family:'Poppins',sans-serif;
  color:var(--cb-text);
  background:#fff;
}
.script{
  font-family:'Caveat',cursive;
  font-weight:700;
}
h1,h2,h3,h4{
  font-family:'Poppins',sans-serif;
  font-weight:700;
  letter-spacing:-0.02em;
}
a{text-decoration:none;color:var(--cb-green2);}
img{max-width:100%;}

/* ===== Navbar ===== */
.navbar{padding:8px 0; background:#fff;}
.navbar-brand{display:flex; align-items:center; gap:10px;}
.navbar-brand img{height:45px; width:100%;}
.brand-text{display:flex; flex-direction:column; line-height:1.05;}
.brand-text .name{font-weight:800; font-size:1.25rem; color:var(--cb-dark);}
.brand-text .name span{color:var(--cb-green2);}
.brand-text .tag{font-size:0.58rem; letter-spacing:0.14em; color:var(--cb-muted); font-weight:600;}
.nav-link{font-weight:500; color:var(--cb-text) !important; padding:0.5rem 1rem !important;}
.nav-link.active,.current-menu-item > .nav-link{color:var(--cb-green) !important; font-weight:600;}
.btn-cb{background:var(--cb-green); color:#fff; border:none; font-weight:600; padding:0.65rem 1.4rem; border-radius:8px; transition:background .2s ease;}
.btn-cb:hover{background:var(--cb-dark); color:#fff;}
.btn-cb-outline{background:#fff; color:var(--cb-dark); border:1.5px solid #d8e6dc; font-weight:600; padding:0.65rem 1.4rem; border-radius:8px;}
.btn-cb-outline:hover{border-color:var(--cb-green); color:var(--cb-green);}

/* ===== Hero ===== */
.hero{
  background-image: var(--hero-bg-image, none);
  background-size: cover;
  background-position: center ;
  background-repeat: no-repeat;
  padding:60px 0 90px;
  position:relative;
  overflow:hidden;
}
.eyebrow-pill{display:inline-block; background:#fff; border:1px solid #d8e6dc; color:var(--cb-green); font-size:0.78rem; font-weight:600; padding:6px 16px; border-radius:30px; margin-bottom:22px;}
.hero h1{font-size:3.1rem; line-height:1.08; color:var(--cb-dark); margin-bottom:20px;}
.hero h1 .accent{color:var(--cb-green2);}
.hero p.lead{color:var(--cb-muted); font-size:1.05rem; max-width:480px; margin-bottom:28px;}
.hero-check{font-size:0.88rem; font-weight:500; color:var(--cb-text); display:flex; align-items:center; gap:8px;}
.hero-check i{color:var(--cb-green2);}

.hero-visual{position:relative;}
.hero-visual-top{text-align:right; margin-bottom:10px; padding-right:6px;}
.hero-visual-bottom{text-align:right; margin-top:18px; padding-right:20px;}
.hero-stage{display:flex; align-items:flex-start; justify-content:center; gap:22px; flex-wrap:wrap;}
.badges-col{display:flex; flex-direction:column; gap:16px; width:230px; padding-top:34px;}

.bill-card{background:#fff; border-radius:18px; box-shadow:0 25px 50px -12px rgba(15,61,34,0.18); padding:26px 24px; width:270px; position:relative; z-index:3;}
.bill-card .bill-logo{display:flex; align-items:center; gap:6px; margin-bottom:18px;}
.bill-card .bill-logo img{height:22px;width:100%;}
.bill-card .bill-logo span{font-weight:800; font-size:0.85rem; color:var(--cb-dark);}
.bill-card h5{font-weight:700; font-size:1.15rem; margin-bottom:4px;}
.bill-card small{color:var(--cb-muted);}
.bill-bolt{width:64px; height:64px; border-radius:50%; background:var(--cb-light2); display:flex; align-items:center; justify-content:center; margin:18px auto; box-shadow:0 10px 25px rgba(30,138,60,.15);}
.bill-bolt i{color:var(--cb-green2); font-size:1.6rem;}
.bill-bars{display:flex; align-items:flex-end; gap:8px; height:56px; margin-bottom:16px;}
.bill-bars .bar{width:100%; background:var(--cb-green2); border-radius:3px; opacity:.85;}
.bill-lines{display:flex; flex-direction:column; gap:7px;}
.bill-lines .ln{height:6px; background:#eef3ef; border-radius:3px;}

.float-badge{background:#fff; border-radius:12px; box-shadow:0 12px 30px rgba(15,61,34,0.12); padding:12px 16px; display:flex; align-items:center; gap:12px; width:100%; z-index:4;}
.float-badge .ic{width:36px; height:36px; border-radius:9px; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:0.95rem;}
.float-badge .ic.yellow{background:#fdeed3; color:var(--cb-yellow);}
.float-badge .ic.blue{background:#dcedfb; color:var(--cb-blue);}
.float-badge .ic.green{background:var(--cb-light); color:var(--cb-green2);}
.float-badge .label{font-size:0.78rem; font-weight:600; color:var(--cb-text);}
.float-badge .sub{font-size:0.75rem; color:var(--cb-muted);}
.float-badge .sub b{color:var(--cb-green2);}

.leaf-scatter{position:absolute; color:var(--cb-green2); opacity:.55;}
.script-note{font-family:'Caveat',cursive; color:var(--cb-dark); font-size:1.5rem; line-height:1.15; font-weight:700; text-shadow:0 1px 3px rgba(255,255,255,.85), 0 0 14px rgba(255,255,255,.6);margin-bottom:10px;}

/* ===== Service cards ===== */
.services-section{padding:90px 0 30px;}
.service-card{border-radius:16px; padding:32px 28px; height:100%; position:relative; overflow:hidden; border:1px solid #eef1ee;}
.service-card .ic-circle{width:56px; height:56px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:1.35rem; margin-bottom:20px;}
.service-card.color-green .ic-circle,.service-card.color-green2 .ic-circle{background:#e9f7ec; color:var(--cb-green2);}
.service-card.color-blue .ic-circle{background:#e4f2fb; color:var(--cb-blue);}
.service-card h4{font-size:1.2rem; margin-bottom:2px;}
.service-card .subtitle{color:var(--cb-muted); font-size:0.85rem; margin-bottom:14px;}
.service-card p{color:var(--cb-muted); font-size:0.92rem; margin-bottom:18px;}
.service-card .cta-link{font-weight:600; font-size:0.9rem;}
.service-card.color-green .cta-link,.service-card.color-green2 .cta-link{color:var(--cb-green2);}
.service-card.color-blue .cta-link{color:var(--cb-blue);}
.service-card.bg-green{background:#f4fbf5;}
.service-card.bg-blue{background:#f2f9fd;}

/* ===== How it works ===== */
.how-section{padding:90px 0;}
.section-title{font-size:2.1rem; color:var(--cb-dark); text-align:center; margin-bottom:8px;}
.section-sub{text-align:center; color:var(--cb-muted); margin-bottom:60px;}
.step-num{width:40px; height:40px; border-radius:50%; background:var(--cb-dark); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:0.95rem; margin-bottom:16px;}
.step-ic{width:56px; height:56px; border-radius:14px; background:var(--cb-light); display:flex; align-items:center; justify-content:center; color:var(--cb-green2); font-size:1.3rem; margin-bottom:14px;}
.step-arrow{color:#c9d6cd; font-size:1.4rem;}
.how-col h5{font-weight:700; margin-bottom:6px;}
.how-col p{color:var(--cb-muted); font-size:0.9rem;}

/* ===== Why choose ===== */
.why-section{background:var(--cb-light2); padding:80px 0;}
.why-item{text-align:center;}
.why-ic{width:72px; height:72px; border-radius:50%; border:1.5px solid #cfe6d6; display:flex; align-items:center; justify-content:center; color:var(--cb-green); font-size:1.5rem; margin:0 auto 16px;}
.why-item h6{font-weight:700; margin-bottom:4px;}
.why-item p{color:var(--cb-muted); font-size:0.85rem;}

/* ===== CTA form ===== */
.cta-section{background:linear-gradient(120deg,var(--cb-dark) 0%, #123f24 55%, #1c5a30 100%); border-radius:22px; margin:0 auto 90px; max-width:1200px; padding:60px 50px; color:#fff; position:relative; overflow:hidden;}
.cta-section .eyebrow{color:#8fe3a3; font-weight:700; letter-spacing:0.12em; font-size:0.78rem; margin-bottom:14px;}
.cta-section h2{font-size:2.2rem; margin-bottom:14px;}
.cta-section p{color:#cfe6d6; font-size:0.95rem; max-width:420px;}
.cta-form{background:#fff; border-radius:16px; padding:28px; color:var(--cb-text);}
.cta-form label{font-size:0.82rem; font-weight:600; margin-bottom:6px;}
.cta-form .form-control{border-radius:9px ; border:1px solid #e2e8e3 ; padding:0.6rem 0.85rem ; font-size:0.9rem ;}
.cta-form .form-control:focus{border-color:var(--cb-green2) ; box-shadow:0 0 0 3px rgba(52,168,83,.15) ;}
.form-control .input.wpforms-field-large, .input.wpforms-field-large{
    border-radius:9px !important; border:1px solid #e2e8e3 !important; padding:0.6rem 0.85rem !important; font-size:0.9rem !important;
}
.form-control .input.wpforms-field-large:focus,.input.wpforms-field-large:focus{
    border-color:var(--cb-green2) !important; box-shadow:0 0 0 3px rgba(52,168,83,.15) !important;
}

.cta-submit,.wpforms-submit{background:var(--cb-green) !important; color:#fff !important; border:none !important; border-radius:9px !important; padding:0.75rem !important; font-weight:600; width:100% !important;}
.cta-submit:hover,.lead-form div.wpforms-container-full button[type="submit"]:hover,.light-form div.wpforms-container-full button[type="submit"]:hover{background:var(--cb-dark) !important;}
div.wpforms-container-full input[type="checkbox"] + label, div.wpforms-container-full input[type="radio"] + label{
    font-size:14px !important;
}
.cta-form .note{font-size:0.75rem; color:var(--cb-muted); text-align:center; margin-top:10px;}
.cta-benefits{display:flex; flex-direction:column; gap:16px; margin-top:30px;}
.cta-benefits .b-item{display:flex; align-items:center; gap:10px; font-weight:500; font-size:0.92rem;}
.cta-benefits i{color:#8fe3a3;}
.cta-tagline{margin-top:28px;}
.cta-alert{border-radius:10px; padding:12px 16px; font-size:0.85rem; margin-bottom:16px;}

/* ===== Footer ===== */
footer.site-footer{padding:60px 0 24px; background:#f4faf4;}
footer.site-footer h6{font-weight:700; margin-bottom:16px; font-size:0.95rem;}
footer.site-footer .f-brand-text{color:var(--cb-muted); font-size:0.87rem; max-width:280px;}
footer.site-footer a.f-link{display:block; color:var(--cb-muted); font-size:0.88rem; margin-bottom:10px;}
footer.site-footer a.f-link:hover{color:var(--cb-green);}
footer.site-footer .f-contact{display:flex; gap:10px; color:var(--cb-muted); font-size:0.88rem; margin-bottom:12px; align-items:flex-start;}
footer.site-footer .f-contact i{color:var(--cb-green2); margin-top:3px;}
.f-social a{width:34px; height:34px; border-radius:50%; background:#f1f5f2; color:var(--cb-dark); display:inline-flex; align-items:center; justify-content:center; margin-right:8px; font-size:0.85rem;}
.f-social a:hover{background:var(--cb-green2); color:#fff;}
.f-bottom{border-top:1px solid #eef1ee; margin-top:40px; padding-top:20px; font-size:0.8rem; color:var(--cb-muted);}

/* ===== Widget / menu fallback niceties ===== */
.widget ul{list-style:none; padding:0; margin:0;}
.widget ul li{margin-bottom:10px;}
.widget ul li a{color:var(--cb-muted); font-size:0.88rem;}
.widget ul li a:hover{color:var(--cb-green);}

@media (max-width: 991px){
  .hero h1{font-size:2.2rem;}
  .trust-banner h3 {
  font-size: 1.05rem !important;
  line-height:25px;
  }
  .trust-banner .btn-cb{width:100% !important;display: inline-block !important;}
  .hero-visual{margin-top:50px;}
  .hero-stage{flex-direction:column; align-items:center;}
  .badges-col{width:100%; max-width:320px; padding-top:0;}
  .bill-card{margin:0 auto;}
  .cta-section{border-radius:0; margin-left:-12px; margin-right:-12px; padding:40px 22px;}
}

/* =====================================================================
   Energy landing page (template-energy.php)
   ===================================================================== */

/* ---- Sub-page hero variant ---- */
.hero.hero-subpage{padding:50px 0 70px;}
.eyebrow-crumbs{font-size:0.78rem; font-weight:700; letter-spacing:0.06em; color:var(--cb-muted); text-transform:uppercase; margin-bottom:16px;}
.eyebrow-crumbs .sep{margin:0 8px; color:#c3d3c8;}
.eyebrow-crumbs .current{color:var(--cb-green);}

.bill-card.bill-card-simple{width:250px;}
.bill-card.bill-card-simple .bill-bolt{margin-top:0;}
.bill-card.bill-card-simple h5{text-align:center; margin-top:6px;}

.float-badge.badge-arrow{justify-content:space-between;}
.float-badge .arrow-ic{color:var(--cb-muted); font-size:0.85rem; flex-shrink:0;}
.float-badge .sub b{color:var(--cb-green2);}

/* ---- Inline "Get Started" panel (light, not the dark CTA) ---- */
.get-started-panel{
  background:var(--cb-light2);
  border-radius:22px;
  padding:50px 30px;
  margin-top:-40px;
  position:relative;
  z-index:5;
}

.get-started-panel .eyebrow{color:var(--cb-green); font-weight:700; letter-spacing:0.1em; font-size:0.78rem; margin-bottom:12px; text-transform:uppercase;}
.get-started-panel h2{font-size:2rem; color:var(--cb-dark); margin-bottom:14px;}
.get-started-panel p{color:var(--cb-muted); margin-bottom:16px;}
.get-started-panel .light-form{background:#fff; border-radius:16px; padding:28px;}

@media (max-width: 991px){
  .get-started-panel{border-radius:0; margin:0 -12px; padding:36px 20px;}
}

/* ---- 4-up plain feature grid ---- */
.feature-plain-grid{padding:70px 0 20px;}
.feature-plain{text-align:left; padding:0 12px;}
.feature-plain .ic-circle-lg{
  width:64px; height:64px; border-radius:50%;
  background:var(--cb-light);
  display:flex; align-items:center; justify-content:center;
  color:var(--cb-green2); font-size:1.4rem;
  margin:16px 0px;
}
.feature-plain h5{font-weight:700; margin-bottom:6px; font-size:1.05rem;}
.feature-plain p{color:var(--cb-muted); font-size:0.88rem;}

/* ---- Split "why choose" with photo ---- */
.why-split{padding:80px 0;}
.why-split .eyebrow{color:var(--cb-green); font-weight:700; letter-spacing:0.08em; font-size:0.8rem; text-transform:uppercase; margin-bottom:14px;}
.why-split h2{font-size:2rem; color:var(--cb-dark); margin-bottom:16px;}
.why-split p.desc{color:var(--cb-muted); margin-bottom:20px;}
.why-split .point-list{list-style:none; padding:0; margin:0 0 26px;}
.why-split .point-list li{display:flex; align-items:flex-start; gap:10px; margin-bottom:12px; font-size:0.95rem;}
.why-split .point-list i{color:#fff; background:var(--cb-green2); border-radius:50%; width:20px; height:20px; min-width:20px; display:flex; align-items:center; justify-content:center; font-size:0.65rem; margin-top:3px;}
.why-photo-wrap{position:relative; border-radius:18px; overflow:hidden; box-shadow:0 20px 45px -15px rgba(15,61,34,.25);}
.why-photo-wrap img{width:100%; display:block;}

/* ---- Providers strip ---- */
.providers-section{padding:60px 0; background:var(--cb-light2);}
.providers-section .eyebrow{text-align:center; display:block; color:var(--cb-green); font-weight:700; letter-spacing:0.1em; font-size:0.78rem; text-transform:uppercase; margin-bottom:10px;}
.providers-section h2{text-align:center; font-size:1.5rem; color:var(--cb-dark); margin-bottom:34px;}
.provider-card{
  background:#fff; border-radius:12px; height:86px;
  display:flex; align-items:center; justify-content:center;
  padding:14px; box-shadow:0 6px 18px rgba(15,61,34,.06);
}
.provider-card img{max-height:36px; max-width:100%; object-fit:contain;}
.provider-card .provider-name{font-weight:700; color:var(--cb-dark); font-size:0.95rem; text-align:center;}
.provider-card.provider-more{background:transparent; border:1.5px dashed #c9d9ce; box-shadow:none; color:var(--cb-muted); flex-direction:column; gap:4px; font-size:0.82rem;}
.provider-card.provider-more i{font-size:1.1rem; color:#9fb8a8;}

/* ---- Sustainability strip ---- */
.sustain-section{padding:60px 0; background:var(--cb-light2); position:relative; overflow:hidden;}
.sustain-icon{
  width:88px; height:88px; border-radius:20px;
  background:var(--cb-dark);
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:2.1rem;
  flex-shrink:0;
}
.sustain-section h3{font-size:1.5rem; color:var(--cb-dark); margin-bottom:8px;}
.sustain-section p{color:var(--cb-muted); font-size:0.92rem; margin-bottom:0;}
.sustain-points{display:flex; flex-direction:column; gap:18px;}
.sustain-points .point{display:flex; align-items:center; gap:12px; font-weight:600; color:var(--cb-dark);}
.sustain-points .point .pt-ic{
  width:34px; height:34px; border-radius:50%;
  background:var(--cb-green2); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:0.9rem; flex-shrink:0;
}
.sustain-divider{border-left:1px solid #d3e4d8; height:100%;}

/* ---- FAQ accordion ---- */
.faq-section{padding:80px 0;}
.faq-header{display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-bottom:30px;}
.faq-header .eyebrow{color:var(--cb-green); font-weight:700; letter-spacing:0.08em; font-size:0.78rem; text-transform:uppercase; display:block; margin-bottom:8px;}
.faq-header h2{font-size:1.7rem; color:var(--cb-dark); margin:0;}
.faq-header .view-all{font-weight:600; color:var(--cb-green2); font-size:0.9rem; white-space:nowrap;}
.faq-item{background:var(--cb-light2); border-radius:12px; margin-bottom:16px; overflow:hidden;}
.faq-question{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 22px; font-weight:600; color:var(--cb-dark); cursor:pointer;
  font-size:0.95rem;
}
.faq-question .toggle-ic{color:var(--cb-green); transition:transform .2s ease; flex-shrink:0; margin-left:14px;}
.faq-question[aria-expanded="true"] .toggle-ic{transform:rotate(45deg);}
.faq-answer{padding:0 22px 18px; color:var(--cb-muted); font-size:0.9rem;}

/* =====================================================================
   Homepage v2 redesign (front-page.php)
   ===================================================================== */
:root{ --cb-navy: #16233f; }

/* ---- Hero: inline form panel ---- */
.hero-form-panel{
  background:#fff; border-radius:18px;
  box-shadow:0 25px 55px -18px rgba(15,61,34,.25);
  padding:28px 26px;
}
.hero-form-panel h3{font-size:1.2rem; color:var(--cb-navy); margin-bottom:2px;}
.hero-form-panel .sub{color:var(--cb-green2); font-weight:600; font-size:0.85rem; margin-bottom:18px;}
.hfp-field{margin-bottom:14px;}
.hfp-field label{font-size:0.8rem; font-weight:600; color:var(--cb-text); margin-bottom:5px; display:block;}
.hfp-input-wrap{position:relative;}
.hfp-input-wrap i{position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--cb-green2); font-size:0.85rem;}
.hfp-input-wrap .form-control,
.hfp-input-wrap .form-select{padding-left:36px; border-radius:9px; border:1px solid #e2e8e3; font-size:0.88rem;}
.hfp-input-wrap .form-control:focus,
.hfp-input-wrap .form-select:focus{border-color:var(--cb-green2); box-shadow:0 0 0 3px rgba(52,168,83,.15);}
.hero-form-panel .note{font-size:0.72rem; color:var(--cb-muted); display:flex; align-items:flex-start; gap:6px; margin:14px 0;}

.hero.hero-v2{padding-bottom:60px;}
.hero-v2 h1{color:var(--cb-navy); font-size:2.7rem;}
.hero-v2 .accent{color:var(--cb-green2);}

/* ---- Providers inline strip ---- */
.providers-inline{padding:26px 0; background:var(--cb-light2); border-top:1px solid #e4efe7;}
.providers-inline p{font-size:0.85rem; color:var(--cb-muted); margin-bottom:18px;}
.providers-inline-row{display:flex; flex-wrap:wrap; align-items:center; gap:34px;}
.providers-inline-row .p-logo{max-height:28px; max-width:120px; object-fit:contain; opacity:.85;}
.providers-inline-row .p-name{font-weight:700; color:var(--cb-dark); font-size:0.95rem; opacity:.8;}

/* ---- Why Switch card grid ---- */
.why-card-grid{padding:80px 0 40px;}
.why-card{
  border:1px solid #e7ede9; border-radius:14px; padding:26px 22px; height:100%;
}
.why-card .ic-circle-sm{
  width:44px; height:44px; border-radius:50%;
  background:var(--cb-green2); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.05rem;
  margin-bottom:16px;
}
.why-card h5{color:var(--cb-navy); font-weight:700; font-size:1.02rem; margin-bottom:8px;}
.why-card p{color:var(--cb-muted); font-size:0.88rem; margin-bottom:0;}

/* ---- How It Works v2 (steps left, photo right) ---- */
.how-v2{background:var(--cb-light2); padding:70px 0;}
.how-v2 h2{color:var(--cb-navy);}
.how-v2-steps{display:flex; flex-direction:column; gap:26px; margin-top:30px;}
.how-v2-step{display:flex; align-items:flex-start; gap:16px;}
.how-v2-step .step-num{background:var(--cb-green2); flex-shrink:0;}
.how-v2-step h5{color:var(--cb-navy); font-weight:700; margin-bottom:4px;}
.how-v2-step p{color:var(--cb-muted); font-size:0.88rem; margin-bottom:0;}
.how-v2-arrow{color:#b9cdc0; text-align:center; font-size:1rem; margin:-14px 0 -14px 19px;}
.how-v2-photo{position:relative; border-radius:18px; overflow:hidden; box-shadow:0 20px 45px -18px rgba(15,61,34,.25);}
.how-v2-photo img{width:100%; display:block;}

/* ---- What We Compare v2 (cards left, photo right) ---- */
.compare-v2{padding:70px 0;}
.compare-v2 h2{color:var(--cb-navy);}
.compare-card-stack{display:flex; flex-direction:column; gap:16px; margin-top:26px;}
.compare-card{
  background:var(--cb-light2); border-radius:14px; padding:22px 24px;
  display:flex; align-items:flex-start; gap:16px;
}
.compare-card .ic-circle-sm{
  width:46px; height:46px; border-radius:50%; background:#fff;
  color:var(--cb-green2); display:flex; align-items:center; justify-content:center;
  font-size:1.1rem; flex-shrink:0;
}
.compare-card h5{color:var(--cb-navy); font-weight:700; margin-bottom:4px;}
.compare-card p{color:var(--cb-muted); font-size:0.88rem; margin-bottom:10px;}
.compare-card a{color:var(--cb-green2); font-weight:600; font-size:0.87rem;}
.compare-v2-photo{border-radius:18px; overflow:hidden; box-shadow:0 20px 45px -18px rgba(15,61,34,.22);}
.compare-v2-photo img{width:100%; display:block;}

/* ---- Trust banner ---- */
.trust-banner{
  background:linear-gradient(120deg,var(--cb-dark) 0%, #123f24 60%, #1c5a30 100%);
  border-radius:20px; color:#fff; padding:34px 36px;
  margin:40px auto 50px; 
}
.trust-banner .row{align-items:center;}
.trust-banner .t-icon{
  width:48px; height:48px; border-radius:50%;
  background:rgba(255,255,255,.15); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.2rem;
  flex-shrink:0;
}
.trust-banner h3{font-size:1.35rem; margin-bottom:4px;}
.trust-banner p{color:#d7ebdc; margin-bottom:0; font-size:0.9rem;}
.trust-banner .t-right{text-align:right;}
.trust-banner .t-call{color:#d7ebdc; font-size:0.82rem; margin-top:8px;}
.trust-banner .t-call a{color:#fff; font-weight:700;}
.trust-banner .btn-cb{background:#fff; color:var(--cb-dark);}
.trust-banner .btn-cb:hover{background:var(--cb-light2);}
@media (max-width: 991px){
  .trust-banner{border-radius:0; margin-left:-12px; margin-right:-12px; max-width:none;}
  .trust-banner .t-right{text-align:left; margin-top:18px;}
}

/* ---- Testimonials ---- */
.testimonials-section{padding:20px 0 70px;}
.testimonials-section h2{color:var(--cb-navy);}
.testimonial-card{
  background:#fff; border:1px solid #eef1ee; border-radius:14px; padding:26px 24px; height:100%;
}
.testimonial-card .quote-ic{color:var(--cb-green2); font-size:1.4rem; margin-bottom:10px;}
.testimonial-card p.quote{color:var(--cb-text); font-size:0.92rem; margin-bottom:16px;}
.testimonial-card .stars{color:#f5a623; font-size:0.85rem; margin-bottom:10px;}
.testimonial-card .cust-name{font-weight:700; color:var(--cb-navy); font-size:0.92rem;}
.testimonial-card .cust-loc{color:var(--cb-muted); font-size:0.8rem;}

/* ---- Final CTA (light) ---- */
.final-cta{background:var(--cb-light2); padding:50px 0; border-radius:20px; margin:0 auto 60px; }
.final-cta h3{color:var(--cb-navy); font-size:1.5rem; margin-bottom:6px;}
.final-cta p{color:var(--cb-muted); margin-bottom:0; font-size:0.9rem;}
.final-cta .fc-right{text-align:right;}
.final-cta .fc-call{color:var(--cb-muted); font-size:0.85rem; margin-top:8px;}
.final-cta .fc-call a{color:var(--cb-dark); font-weight:700;}
@media (max-width: 991px){
  .final-cta{border-radius:0;}
  .final-cta .fc-right{text-align:left; margin-top:16px;}
}

/* ---- Footer Australia map decoration ---- */
.f-map-decor{position:relative; text-align:right;}
.f-map-svg{width:90px; height:auto; color:#d8e3db; display:inline-block;}
.f-map-caption{font-size:1.05rem; text-align:right; margin-top:6px;}

/* =====================================================================
   NBN landing page (template-nbn.php)
   ===================================================================== */

/* ---- Hero visual: house + wifi graphic ---- */
.nbn-hero-visual{position:relative; display:flex; justify-content:center;}
.nbn-house-img{
  max-width:280px; width:100%;
  border-radius:16px;
  box-shadow:0 20px 45px -15px rgba(15,61,34,.3);
}
.nbn-badges-col{display:flex; flex-direction:column; gap:14px; width:250px;}

/* ---- Get-started panel with Australia decoration ---- */
.get-started-panel .aus-decor{text-align:center;}
.get-started-panel .aus-decor svg{width:100px; height:auto; color:#cfe0d5;}
.get-started-panel .aus-decor .script-note{font-size:1.15rem; margin-top:10px;margin-bottom:10px;}

/* ---- Why-switch photo with floating use-case badges ---- */
.why-photo-wrap.has-badges{overflow:visible;}
.why-photo-wrap.has-badges img{border-radius:18px;}
.why-usecases{
  position:absolute; top:16px; right:-16px;
  display:flex; flex-direction:column; gap:12px;
  width:230px;
}
.why-usecase-badge{
  background:#fff; border-radius:12px; box-shadow:0 10px 26px rgba(15,61,34,.14);
  padding:12px 16px; display:flex; align-items:center; gap:12px;
}
.why-usecase-badge .ic{
  width:34px; height:34px; border-radius:8px;
  background:var(--cb-green2); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:0.85rem; flex-shrink:0;
}
.why-usecase-badge .label{font-size:0.82rem; font-weight:700; color:var(--cb-dark);}
.why-usecase-badge .sub{font-size:0.72rem; color:var(--cb-muted);}
@media (max-width: 991px){
  .why-usecases{position:static; width:100%; margin-top:16px;}
}

/* ---- Boxed "How it works" (NBN variant: light green box, horizontal) ---- */
.how-boxed{
  background:var(--cb-light2);
  border-radius:22px;
  padding:40px 40px 34px;
  margin:0 auto 80px;
}
.how-boxed .section-title{font-size:1.3rem; margin-bottom:2px;}
.how-boxed .section-sub{margin-bottom:26px; font-size:0.85rem;}
.how-boxed .step-num{background:var(--cb-green2); width:34px; height:34px; font-size:0.85rem; margin-bottom:0;}
.how-boxed .step-ic{background:#dcefe1; width:48px; height:48px; font-size:1.1rem; margin-bottom:0;}
.how-boxed .how-row{display:flex; align-items:center; gap:16px;}
.how-boxed .how-col{display:flex; align-items:center; gap:14px; text-align:left;}
.how-boxed .how-col h5{font-size:0.95rem; margin-bottom:2px;}
.how-boxed .how-col p{font-size:0.8rem; margin-bottom:0;}
.how-boxed .step-arrow{font-size:1.1rem;}
@media (max-width: 991px){
  .how-boxed{border-radius:0; margin-left:-12px; margin-right:-12px; padding:30px 20px;}
  .how-boxed .how-row{flex-direction:column; align-items:flex-start; gap:20px;}
}


/* =====================================================================
   Contact Us page (template-contact.php)
   ===================================================================== */

/* ---- Hero trust items (icon + 2-line label) ---- */
.contact-hero-items{display:flex; gap:30px; flex-wrap:wrap;}
.contact-hero-item{display:flex; align-items:center; gap:10px;}
.contact-hero-item .ic{
  width:40px; height:40px; border-radius:50%;
  background:var(--cb-green2); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1rem; flex-shrink:0;
}
.contact-hero-item .label{font-size:0.85rem; font-weight:600; color:var(--cb-text); line-height:1.25;}

/* ---- Form + Get in Touch split ---- */
.contact-main{padding:60px 0 40px;}
.contact-form-card{background:#fff; border:1px solid #eef1ee; border-radius:18px; padding:34px; height:100%;}
.contact-form-card h2{font-size:1.5rem; color:var(--cb-navy); margin-bottom:6px;}
.contact-form-card > p{color:var(--cb-muted); font-size:0.9rem; margin-bottom:22px;}
.contact-form-card label{font-size:0.85rem; font-weight:600; margin-bottom:6px; display:block;}
.contact-form-card .form-control,
.contact-form-card .form-select{border-radius:9px; border:1px solid #e2e8e3; font-size:0.9rem; padding:0.6rem 0.85rem;}
.contact-form-card .form-control:focus,
.contact-form-card .form-select:focus{border-color:var(--cb-green2); box-shadow:0 0 0 3px rgba(52,168,83,.15);}
.contact-form-card .note{font-size:0.75rem; color:var(--cb-muted); text-align:center; margin-top:10px;}

.contact-info-card{background:var(--cb-light2); border-radius:18px; padding:34px; height:100%; position:relative;}
.contact-info-card h2{font-size:1.5rem; color:var(--cb-navy); margin-bottom:6px;}
.contact-info-card > p{color:var(--cb-muted); font-size:0.9rem; margin-bottom:24px;}
.contact-info-row{display:flex; gap:14px; margin-bottom:22px;}
.contact-info-row .ic{
  width:38px; height:38px; border-radius:50%; background:var(--cb-green2); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:0.9rem; flex-shrink:0;
}
.contact-info-row h6{font-weight:700; color:var(--cb-navy); font-size:0.95rem; margin-bottom:2px;}
.contact-info-row p{color:var(--cb-muted); font-size:0.82rem; margin-bottom:0;}
.contact-info-row a{color:inherit;}
.contact-aus-decor{position:absolute; top:34px; right:30px; text-align:center;}
.contact-aus-decor svg{width:70px; height:auto; color:#cfe0d5;}
.contact-aus-decor .script-note{font-size:0.95rem; margin-top:6px;}
.contact-chat-box{
  background:#fff; border-radius:14px; padding:18px 20px;
  display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:10px;
}
.contact-chat-box .ic{
  width:42px; height:42px; border-radius:50%; background:var(--cb-light);
  color:var(--cb-green2); display:flex; align-items:center; justify-content:center; font-size:1.05rem; flex-shrink:0;
}
.contact-chat-box h6{font-weight:700; color:var(--cb-navy); font-size:0.9rem; margin-bottom:2px;}
.contact-chat-box p{color:var(--cb-muted); font-size:0.78rem; margin-bottom:0;}
.contact-chat-box .btn-chat{
  border:1.5px solid var(--cb-green2); color:var(--cb-green2); border-radius:8px;
  font-weight:600; font-size:0.85rem; padding:0.5rem 1rem; white-space:nowrap; margin-left:auto;
}
.contact-chat-box .btn-chat:hover{background:var(--cb-green2); color:#fff;}

/* ---- Map section ---- */
.map-section{padding:20px 0 70px;}
.map-section h2{color:var(--cb-navy); font-size:1.5rem; margin-bottom:4px;}
.map-section > .container > p{color:var(--cb-muted); font-size:0.9rem; margin-bottom:22px;}
.map-wrap{position:relative; border-radius:16px; overflow:hidden; box-shadow:0 15px 35px -15px rgba(15,61,34,.2);}
.map-wrap iframe{width:100%; height:420px; border:0; display:block;}
.map-address-card{
  position:absolute; top:20px; left:20px; z-index:2;
  background:#fff; border-radius:12px; padding:16px 18px; box-shadow:0 10px 25px rgba(15,61,34,.15);
  max-width:230px;
}
.map-address-card h6{font-weight:700; color:var(--cb-navy); font-size:0.92rem; margin-bottom:4px;}
.map-address-card p{color:var(--cb-muted); font-size:0.8rem; margin-bottom:8px;}
.map-address-card a{color:var(--cb-green2); font-weight:600; font-size:0.8rem;}
@media (max-width: 767px){
  .map-address-card{position:static; max-width:none; margin-bottom:14px; box-shadow:none; border:1px solid #eef1ee;}
}