/* HomeBillLab Global Market Shell v0.1.1 */
:root{
  --hbl-primary:#0F5B4F;
  --hbl-primary-dark:#0B493F;
  --hbl-text:#172033;
  --hbl-muted:#657089;
  --hbl-bg:#F5F7FB;
  --hbl-surface:#FFFFFF;
  --hbl-accent:#D6A642;
  --hbl-border:#DDE3EC;
}

/* Keep the shared visual language consistent across the newer U.S. foundation pages. */
body .hbl-us-foundation{
  --hbl-green:#0F5B4F;
  --hbl-green-dark:#0B493F;
  --hbl-soft:#F5F7FB;
  --hbl-line:#DDE3EC;
  --hbl-ink:#172033;
  --hbl-muted:#657089;
}
body .hbl-us-foundation .hbl-card{border-radius:14px;box-shadow:0 8px 24px rgba(23,32,51,.05)}

/* The front page is a global market selector. Its WordPress entry title should not duplicate the content H1. */
body.page-id-33 .entry-header{display:none}
body.page-id-33 .site-content{padding-top:34px}

.hbl-global-home{max-width:1180px;margin:0 auto}
.hbl-global-hero{padding:18px 0 34px}
.hbl-global-kicker{margin:0 0 12px;color:var(--hbl-primary);font-size:13px;font-weight:800;letter-spacing:.075em;text-transform:uppercase}
.hbl-global-hero h1{max-width:900px;margin:0 0 18px;font-size:clamp(42px,5.6vw,64px);line-height:1.04;letter-spacing:-.035em}
.hbl-global-lead{max-width:900px;margin:0 0 24px;color:#455268;font-size:clamp(19px,2vw,24px);line-height:1.55}
.hbl-global-actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0 10px}
.hbl-global-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:11px 18px;border-radius:10px;background:var(--hbl-primary);color:#fff!important;font-weight:750;text-decoration:none!important}
.hbl-global-actions a:hover,.hbl-global-actions a:focus{background:var(--hbl-primary-dark)}
.hbl-global-actions a.is-secondary{background:#fff;color:var(--hbl-primary)!important;border:1px solid var(--hbl-primary)}
.hbl-global-actions a.is-secondary:hover,.hbl-global-actions a.is-secondary:focus{background:#F0F6F4}
.hbl-global-note{max-width:820px;margin:10px 0 0;color:var(--hbl-muted);font-size:.92rem}

.hbl-global-section{margin:clamp(2.5rem,6vw,5rem) 0}
.hbl-global-section>h2{margin-bottom:.55rem}
.hbl-global-section-intro{max-width:850px;margin:0 0 1.5rem;color:#526078}

.hbl-country-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.hbl-country-card{position:relative;display:flex;flex-direction:column;min-height:250px;padding:26px;border:1px solid var(--hbl-border);border-radius:18px;background:#fff;box-shadow:0 12px 30px rgba(23,32,51,.055)}
.hbl-country-code{display:inline-flex;align-items:center;justify-content:center;width:46px;height:32px;margin-bottom:18px;border-radius:999px;background:#EDF5F3;color:var(--hbl-primary);font-size:.82rem;font-weight:850;letter-spacing:.08em}
.hbl-country-card h3{margin:0 0 10px;font-size:clamp(25px,2.7vw,31px)}
.hbl-country-card p{color:#536174}
.hbl-country-meta{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 18px;padding:0;list-style:none}
.hbl-country-meta li{padding:5px 9px;border:1px solid var(--hbl-border);border-radius:999px;background:#FAFBFD;color:#566175;font-size:.79rem;font-weight:650}
.hbl-country-card .hbl-country-link{margin-top:auto;color:var(--hbl-primary);font-weight:800;text-decoration:none}
.hbl-country-card .hbl-country-link:hover{text-decoration:underline}

.hbl-topic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.hbl-topic-card{padding:20px;border:1px solid var(--hbl-border);border-radius:14px;background:#fff}
.hbl-topic-card h3{margin:.05rem 0 .45rem;font-size:1.16rem}
.hbl-topic-card p{margin:.35rem 0 .75rem;color:#5A667A;font-size:.94rem}
.hbl-topic-links{display:flex;gap:10px;flex-wrap:wrap}
.hbl-topic-links a{font-size:.88rem;font-weight:750;text-decoration:none}
.hbl-topic-links a:hover{text-decoration:underline}

.hbl-why-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.hbl-why-card{padding:18px;border-top:3px solid var(--hbl-primary);border-radius:10px;background:#F8FAFC}
.hbl-why-card strong{display:block;margin-bottom:6px;color:var(--hbl-text)}
.hbl-why-card span{color:#59667A;font-size:.92rem;line-height:1.55}

.hbl-global-trust{padding:26px;border:1px solid var(--hbl-border);border-radius:16px;background:#F5F7FB}
.hbl-global-trust h2{margin-top:0}
.hbl-global-trust-links{display:flex;flex-wrap:wrap;gap:14px;margin-top:14px}
.hbl-global-trust-links a{font-weight:750}

/* Improve clarity of the static Country/Calculators/Energy Guides dropdowns created by the migration. */
.main-navigation .main-nav ul li.hbl-global-nav-parent>a{font-weight:750}
.main-navigation ul ul .hbl-global-nav-market>a{font-size:.94rem}

@media(max-width:1024px){
  .hbl-topic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hbl-why-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  body.page-id-33 .site-content{padding-top:24px}
  .hbl-global-hero h1{font-size:clamp(38px,11vw,50px)}
  .hbl-global-actions{display:grid;grid-template-columns:1fr}
  .hbl-global-actions a{width:100%}
  .hbl-country-grid,.hbl-topic-grid,.hbl-why-grid{grid-template-columns:1fr}
  .hbl-country-card{min-height:0;padding:21px}
  .hbl-global-trust{padding:21px}
}


/* v0.1.1 — GeneratePress desktop third-level navigation fix.
   Keep country-level submenu toggles on the same row as their label instead of
   rendering the arrow as a separate blank row. This changes presentation only. */
@media (min-width:769px){
  .main-navigation:not(.toggled) .main-nav ul ul li.menu-item-has-children{
    position:relative;
  }
  .main-navigation:not(.toggled) .main-nav ul ul li.menu-item-has-children > a{
    position:relative;
    display:block;
    padding-right:46px;
    white-space:nowrap;
  }
  .main-navigation:not(.toggled) .main-nav ul ul li.menu-item-has-children > a .dropdown-menu-toggle{
    position:absolute;
    right:0;
    top:0;
    bottom:0;
    width:42px;
    padding:0;
    margin:0;
    display:flex;
    align-items:center;
    justify-content:center;
    float:none;
    line-height:1;
  }
  .main-navigation:not(.toggled) .main-nav ul ul li.menu-item-has-children > a .dropdown-menu-toggle .gp-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    line-height:1;
  }
  .main-navigation:not(.toggled) .main-nav ul ul li.menu-item-has-children > a .dropdown-menu-toggle .gp-icon svg{
    width:1em;
    height:1em;
  }
  /* Third-level flyouts belong beside the country row on desktop. */
  .dropdown-hover .main-navigation:not(.toggled) .main-nav ul ul li.menu-item-has-children:hover > ul,
  .dropdown-hover .main-navigation:not(.toggled) .main-nav ul ul li.menu-item-has-children.sfHover > ul{
    left:100%;
    right:auto;
    top:0;
  }
}

/* v0.1.2 — deterministic third-level arrow rendering on desktop.
   GeneratePress can render/rotate the nested SVG inconsistently on the first
   second-level row. Hide only that desktop visual toggle and draw one stable
   right-facing indicator on every country row that actually has children.
   Mobile keeps the native GeneratePress toggle for tap/expand behaviour. */
@media (min-width:769px){
  .main-navigation:not(.toggled) .main-nav > ul > li > ul > li.menu-item-has-children > a{
    position:relative;
    padding-right:42px !important;
  }
  .main-navigation:not(.toggled) .main-nav > ul > li > ul > li.menu-item-has-children > a > .dropdown-menu-toggle{
    display:none !important;
  }
  .main-navigation:not(.toggled) .main-nav > ul > li > ul > li.menu-item-has-children > a::after{
    content:"›";
    position:absolute;
    right:15px;
    top:50%;
    transform:translateY(-52%);
    font-size:20px;
    font-weight:500;
    line-height:1;
    color:currentColor;
    pointer-events:none;
  }
}

/* v0.1.3 — GeneratePress mobile nested-menu toggle fix.
   Keep the country-level toggle inside the same row as the country label and
   suppress any duplicate standalone toggle rendered as an empty row. */
@media (max-width:768px){
  .main-navigation.toggled .main-nav > ul > li > ul > li.menu-item-has-children{
    position:relative;
  }

  .main-navigation.toggled .main-nav > ul > li > ul > li.menu-item-has-children > a{
    position:relative;
    display:flex !important;
    align-items:center;
    justify-content:space-between;
    width:100%;
    box-sizing:border-box;
    padding-right:52px !important;
  }

  .main-navigation.toggled .main-nav > ul > li > ul > li.menu-item-has-children > a > .dropdown-menu-toggle{
    position:absolute !important;
    right:0;
    top:0;
    bottom:0;
    width:48px;
    height:auto;
    margin:0 !important;
    padding:0 !important;
    display:flex !important;
    align-items:center;
    justify-content:center;
    float:none !important;
    line-height:1 !important;
  }

  .main-navigation.toggled .main-nav > ul > li > ul > li.menu-item-has-children > a > .dropdown-menu-toggle .gp-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    line-height:1;
  }

  /* Some GeneratePress/mobile combinations output a second toggle as a direct
     child of the LI. The anchor already contains the functional toggle, so the
     standalone copy is visual duplication and can be hidden safely. */
  .main-navigation.toggled .main-nav > ul > li > ul > li.menu-item-has-children > .dropdown-menu-toggle,
  .main-navigation.toggled .main-nav > ul > li > ul > li.menu-item-has-children > button.dropdown-menu-toggle{
    display:none !important;
  }
}