/**
 * EasyCooling — WordPress / Elementor overrides
 * Loaded after site.css to match the static example on staging.
 */

/* Elementor full-width pages: no extra theme chrome */
body.elementor-template-canvas,
body.elementor-template-full-width {
  background: var(--ec-white, #fff);
}

/* Header — match example .header-inner layout */
.ec-site-header > .elementor-container,
.elementor-page .ec-site-header > .elementor-container {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  min-height: 72px;
  max-width: var(--ec-max, 1140px);
  margin: 0 auto;
}

.ec-site-header .elementor-column:nth-child(2) {
  flex: 1 1 auto;
}

.ec-site-header .elementor-column:nth-child(2) .elementor-widget-wrap {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 20px;
}

.ec-site-header .brand-logo,
.ec-site-header .brand--logo img,
.ec-brand--logo img {
  display: block;
  height: 36px !important;
  width: auto !important;
  max-width: 220px;
}

/* Prevent WordPress scaled logo from blowing up header */
.ec-site-header img[src*="logo-horizontal"] {
  object-fit: contain;
}

/* Match example typography — ignore Elementor kit Google fonts */
.elementor-heading-title,
.elementor-widget-heading .elementor-heading-title,
.gform_wrapper h2,
.gform_wrapper h3,
.gform_wrapper .gfield_html,
.gform_wrapper .gfield_label {
  font-family: EasyCooling, Arial, Helvetica, sans-serif !important;
}

/* Hero section — two-column layout (home only) */
.ec-hero-section > .elementor-container {
  display: flex;
  align-items: center;
  gap: 48px;
  max-width: var(--ec-max, 1140px);
}

.ec-hero-section .hero-copy h1 {
  color: var(--ec-text);
  margin-bottom: 1rem;
}

.ec-hero-section .hero-copy p {
  font-size: 1.05rem;
  max-width: 540px;
  margin-bottom: 1rem;
}

.ec-hero-section .hero-copy .btn-row {
  margin-top: 8px;
  justify-content: center;
}

.ec-hero-section .elementor-image img {
  border-radius: 12px;
  box-shadow: var(--ec-shadow);
}

.elementor-page .elementor-section:first-child {
  margin-bottom: 0;
}

.ec-hero-section {
  margin-top: 0;
}

/* Section container width */
.elementor-section.elementor-section-boxed > .elementor-container {
  max-width: var(--ec-max, 1140px);
}

.elementor-widget-html .faq-preview-footer {
  text-align: center;
  max-width: none;
  width: 100%;
}

/* Quote page — match example main > section.section-muted > .container */
body.page-quote .ec-quote-section > .elementor-container,
.ec-quote-section > .elementor-container {
  max-width: none;
  padding-top: 0;
  padding-bottom: 0;
}

body.page-quote .ec-quote-section .elementor-widget-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
}

body.page-quote .ec-quote-section .elementor-widget-shortcode,
body.page-quote .ec-quote-section .elementor-shortcode {
  width: 100%;
  display: flex;
  justify-content: center;
}

body.page-quote .ec-quote-container {
  display: none;
}

/* Footer — full-width background, centered content */
.ec-site-footer,
.ec-site-footer.site-footer {
  color: #b8bec3;
  margin-top: auto;
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  box-sizing: border-box;
}

.ec-site-footer > .elementor-container {
  max-width: var(--ec-max, 1140px);
  margin: 0 auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

.ec-site-footer .elementor-column.elementor-col-100 {
  width: 100% !important;
}

.ec-site-footer .footer-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

.ec-site-footer .site-footer h4,
.ec-site-footer h4,
.ec-site-footer h5,
.ec-site-footer .elementor-heading-title {
  color: #fff;
  margin-bottom: 12px;
}

.ec-site-footer .footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ec-site-footer .footer-links li {
  margin-bottom: 8px;
}

.ec-site-footer .footer-links a {
  color: #b8bec3;
  text-decoration: none;
}

.ec-site-footer .footer-links a:hover {
  color: #fff;
}

.ec-site-footer .footer-bottom {
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  font-size: 14px;
  text-align: center;
  color: #b8bec3;
}

.ec-site-footer .footer-certs {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 16px;
}

.ec-site-footer .footer-cert {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  padding: 8px 14px;
  font-size: 13px;
  color: #b8bec3;
}

.ec-site-footer .footer-cert strong {
  color: #fff;
}

/* Match example typography — DM Sans stack */
.elementor-heading-title,
.elementor-widget-heading .elementor-heading-title,
.gform_wrapper h2,
.gform_wrapper h3,
.gform_wrapper .gfield_html,
.gform_wrapper .gfield_label {
  font-family: "DM Sans", EasyCooling, "Segoe UI", system-ui, sans-serif !important;
}

/* Hero rating + postcode (Elementor HTML widgets) — styles in site.css */
  max-width: 520px;
  margin-top: 4px;
}

.postcode-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.postcode-row input {
  flex: 1 1 160px;
  min-height: 52px;
  padding: 12px 18px;
  border: 2px solid var(--ec-line);
  border-radius: 999px;
  font-weight: 600;
  text-transform: uppercase;
}

.postcode-row .btn {
  min-height: 52px;
}

.hero-trust-list {
  list-style: none;
  padding: 0;
  margin: 20px 0 0;
  display: grid;
  gap: 10px;
}

.section-eyebrow {
  display: block;
  margin-bottom: 10px;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ec-green);
}

/* CTA band */
.cta-band {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

/* Installer callout */
.installer-callout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
}

.installer-callout img {
  border-radius: 12px;
  box-shadow: var(--ec-shadow);
}

/* Steps list on how-it-works */
ol.steps {
  max-width: 760px;
  margin: 0 auto;
  padding-left: 1.2rem;
  line-height: 1.7;
  color: var(--ec-muted);
}

ol.steps strong {
  color: var(--ec-text);
}

/* Mobile nav — from example site.css */
@media (max-width: 900px) {
  .ec-hero-section > .elementor-container {
    flex-direction: column;
  }

  .nav-toggle {
    display: block;
    margin-left: auto;
  }

  .ec-site-header .elementor-column:nth-child(2) .elementor-widget-wrap {
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .site-nav {
    display: none;
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    padding: 12px 0 0;
    border-top: 1px solid var(--ec-line);
    margin-top: 12px;
  }

  .site-nav.open {
    display: flex;
  }

  .split-grid,
  .installer-callout {
    grid-template-columns: 1fr;
  }

  .testimonials-grid,
  .grid-3,
  .how-pillars-grid,
  .service-tiles,
  .trust-strip-grid,
  .usp-grid,
  .trust-badges-grid {
    grid-template-columns: 1fr;
  }

  .cta-band {
    flex-direction: column;
    align-items: flex-start;
  }

  .postcode-row .btn {
    width: 100%;
  }

  .ec-site-footer .footer-grid {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 901px) {
  .nav-toggle {
    display: none;
  }
}

/* Legal pages — centred 760px column, justified body copy */
.ec-legal-section > .elementor-container,
body.ec-legal-page .ec-legal-section > .elementor-container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  max-width: var(--ec-max, 1140px);
  margin-left: auto !important;
  margin-right: auto !important;
}

.ec-legal-section .elementor-column,
.ec-legal-section .elementor-column > .elementor-widget-wrap,
.ec-legal-section .elementor-widget-html,
.ec-legal-section .elementor-widget-html .elementor-widget-container,
body.ec-legal-page .ec-legal-section .elementor-column,
body.ec-legal-page .ec-legal-section .elementor-column > .elementor-widget-wrap,
body.ec-legal-page .ec-legal-section .elementor-widget-html,
body.ec-legal-page .ec-legal-section .elementor-widget-html .elementor-widget-container {
  width: 760px !important;
  max-width: 760px !important;
}

.ec-legal-section .legal-content,
body.ec-legal-page .ec-legal-section .legal-content {
  box-sizing: border-box;
  width: 760px !important;
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  color: var(--ec-muted, #52575c);
  font-size: 1rem;
  line-height: 1.6;
}

.ec-legal-section .legal-content > p,
.ec-legal-section .legal-content > ul,
.ec-legal-section .legal-content > ol,
.ec-legal-section .legal-content > h3,
.ec-legal-section .legal-content > h4,
.ec-legal-section .legal-content > table,
body.ec-legal-page .ec-legal-section .legal-content > p,
body.ec-legal-page .ec-legal-section .legal-content > ul,
body.ec-legal-page .ec-legal-section .legal-content > ol,
body.ec-legal-page .ec-legal-section .legal-content > h3,
body.ec-legal-page .ec-legal-section .legal-content > h4,
body.ec-legal-page .ec-legal-section .legal-content > table {
  max-width: none !important;
  width: 100% !important;
}

.ec-legal-section .legal-content h1,
.ec-legal-section .legal-content h3,
.ec-legal-section .legal-content h4,
body.ec-legal-page .ec-legal-section .legal-content h1,
body.ec-legal-page .ec-legal-section .legal-content h3,
body.ec-legal-page .ec-legal-section .legal-content h4 {
  color: var(--ec-text, #18181b);
  text-align: left !important;
}

.ec-legal-section .legal-content h3 {
  margin-top: 1.5rem;
  margin-bottom: 0.75rem;
}

.ec-legal-section .legal-content h4 {
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  font-size: 1rem;
}

.ec-legal-section .legal-content p,
.ec-legal-section .legal-content li,
.ec-legal-section .legal-content ul,
.ec-legal-section .legal-content ol,
body.ec-legal-page .ec-legal-section .legal-content p,
body.ec-legal-page .ec-legal-section .legal-content li,
body.ec-legal-page .ec-legal-section .legal-content ul,
body.ec-legal-page .ec-legal-section .legal-content ol {
  text-align: justify !important;
  text-justify: inter-word;
}

.ec-legal-section .legal-content td,
body.ec-legal-page .ec-legal-section .legal-content td {
  text-align: justify !important;
  text-justify: inter-word;
}

.ec-legal-section .legal-content ul,
.ec-legal-section .legal-content ol {
  margin: 0.75rem 0;
  padding-left: 1.25rem;
  list-style-position: outside;
  width: 100%;
}

.ec-legal-section .legal-content li {
  margin-bottom: 0.35rem;
}

.ec-legal-section .legal-content table {
  display: table !important;
  width: 100%;
  table-layout: auto;
  border-collapse: collapse;
  margin: 1rem 0;
  font-size: 0.9375rem;
}

.ec-legal-section .legal-content thead,
body.ec-legal-page .ec-legal-section .legal-content thead {
  display: table-header-group !important;
}

.ec-legal-section .legal-content tbody,
body.ec-legal-page .ec-legal-section .legal-content tbody {
  display: table-row-group !important;
}

.ec-legal-section .legal-content tr,
body.ec-legal-page .ec-legal-section .legal-content tr {
  display: table-row !important;
}

.ec-legal-section .legal-content th,
.ec-legal-section .legal-content td {
  display: table-cell !important;
  width: auto !important;
  max-width: none !important;
  border: 1px solid var(--ec-border, #dce8f4);
  padding: 0.625rem 0.75rem;
  vertical-align: top;
}

.ec-legal-section .legal-content th {
  background: var(--ec-bg, #f4f8fc);
  font-weight: 600;
  text-align: left !important;
}

@media (max-width: 820px) {
  .ec-legal-section .elementor-column,
  .ec-legal-section .elementor-column > .elementor-widget-wrap,
  .ec-legal-section .elementor-widget-html,
  .ec-legal-section .elementor-widget-html .elementor-widget-container,
  .ec-legal-section .legal-content,
  body.ec-legal-page .ec-legal-section .elementor-column,
  body.ec-legal-page .ec-legal-section .elementor-column > .elementor-widget-wrap,
  body.ec-legal-page .ec-legal-section .legal-content {
    width: 100% !important;
    max-width: 100% !important;
  }
}
