/*
Theme Name:  Core6 2.0
Description: Core6 Marketing 2.0 child theme for Hello Elementor. Target design system.
Author:      Core6 Marketing
Template:    hello-elementor
Version:     2.0.0
Text Domain: core6-v2
*/

/* ==========================================================================
   HOW THIS FILE WORKS
   --------------------------------------------------------------------------
   Every new-build block (Elementor HTML widget) starts with a wrapper:
       <div class="c62"> ... </div>
   All rules below are written as ".c62 .c62-x" so they outrank Elementor's
   kit styles (".elementor-kit-5 h1/a" set Outfit/Montserrat/cream colors)
   without !important.

   Prefix "c62" = Core6 2.0. The old site's CSS (legacy.css) uses c6-, c6tp-,
   c6pf-, c6ss-, c6cp-, so the two never collide during the build.

   Sections in this file:
     1. Tokens
     2. Elementor neutralizers
     3. Base (scoped)
     4. Layout
     5. Type
     6. Target motif
     7. Buttons and links
     8. Components
     9. Utilities
    10. Responsive
    11. Global header
    12. Global footer
    13. Page sections (pillar pages and beyond)
    14. Homepage
   ========================================================================== */


/* 1. TOKENS ================================================================ */
:root {
  /* Color */
  --c62-accent:        #B31C1C;  /* Core6 red: buttons, target motif, the red period */
  --c62-accent-hover:  #961717;
  --c62-accent-tint:   #FBF1F0;  /* highlight panels ("Includes" / "The result") */
  --c62-accent-on:     #FBE3E3;  /* muted text on red backgrounds */
  --c62-accent-dark:   #F2B8B8;  /* eyebrows on dark backgrounds */
  --c62-ink:           #16130F;  /* primary text, dark sections */
  --c62-ink-body:      #4A453F;  /* body copy */
  --c62-ink-muted:     #5A544D;  /* labels, captions (meets contrast on white) */
  --c62-ground:        #FFFFFF;
  --c62-ground-soft:   #F7F5F2;  /* alternating light sections */
  --c62-ground-hero:   #FAF8F5;  /* homepage hero */
  --c62-stone:         #EFE9E2;  /* "Who we work with", stone cards */
  --c62-border:        #E6E0D8;
  --c62-border-light:  #ECE8E3;
  --c62-dark-text:     #F4F1EC;  /* text on dark */
  --c62-dark-body:     #D6D0C8;  /* body on dark */
  --c62-dark-muted:    #C9C2B9;
  --c62-dark-line:     rgba(244, 241, 236, 0.14);
  --c62-footer:        #0E0C0A;

  /* Type */
  --c62-font-display:  'Sora', 'Helvetica Neue', Arial, sans-serif;
  --c62-font-body:     'Hanken Grotesk', 'Helvetica Neue', Arial, sans-serif;
  --c62-h1-home:       clamp(40px, 6.2vw, 68px);
  --c62-h1-home-sub:   clamp(21px, 2.6vw, 32px);
  --c62-h1:            clamp(34px, 4.8vw, 54px);
  --c62-h2:            clamp(30px, 3.8vw, 42px);
  --c62-h3:            20px;
  --c62-body:          16px;
  --c62-lead:          clamp(17px, 1.6vw, 18px);
  --c62-eyebrow:       13px;

  /* Layout */
  --c62-max:           1180px;
  --c62-max-wide:      1240px;
  --c62-gutter:        24px;
  --c62-section-pad:   clamp(64px, 8vw, 96px);
  --c62-radius-card:   10px;
  --c62-radius-btn:    6px;

  /* Target icon as a data URI (used by eyebrows, bullets, checklists) */
  --c62-target-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Ccircle cx='9' cy='9' r='7' fill='none' stroke='%23B31C1C' stroke-width='2.5'/%3E%3Ccircle cx='9' cy='9' r='2.5' fill='%23B31C1C'/%3E%3C/svg%3E");
  --c62-target-icon-white: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Ccircle cx='9' cy='9' r='7' fill='none' stroke='%23FFFFFF' stroke-width='2.5'/%3E%3Ccircle cx='9' cy='9' r='2.5' fill='%23FFFFFF'/%3E%3C/svg%3E");
}


/* 2. ELEMENTOR NEUTRALIZERS ================================================
   Elementor adds padding and gaps around containers and a 20px margin under
   every widget. Strip those wherever a new-build block lives, so sections
   sit edge to edge. In the editor, set the page container to Full Width.
   ========================================================================== */
.elementor .e-con:has(.c62) {
  --container-default-padding-top: 0px;
  --container-default-padding-right: 0px;
  --container-default-padding-bottom: 0px;
  --container-default-padding-left: 0px;
  --gap: 0px;
  --row-gap: 0px;
  --column-gap: 0px;
  --widgets-spacing: 0px;
  --widgets-spacing-row: 0px;
  --widgets-spacing-column: 0px;
}
.elementor .elementor-widget-html:has(.c62) {
  margin-block-end: 0;
}


/* 3. BASE (SCOPED) ========================================================= */
.c62 {
  font-family: var(--c62-font-body);
  font-size: var(--c62-body);
  font-weight: 400;
  line-height: 1.6;
  color: var(--c62-ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
.c62 *,
.c62 *::before,
.c62 *::after {
  box-sizing: border-box;
}
.c62 :where(h1, h2, h3, h4, h5, h6, p, ul, ol, figure, blockquote, dl, dd) {
  margin: 0;
}
/* Element resets use "html .c62 x" (0,1,2): enough to beat the kit's
   ".elementor-kit-5 h1/a" (0,1,1) whatever order the files load in, while
   staying below component rules like ".c62 .c62-btn" (0,2,0). */
html .c62 h1, html .c62 h2, html .c62 h3,
html .c62 h4, html .c62 h5, html .c62 h6 {
  font-family: var(--c62-font-display);
  font-size: inherit;
  font-weight: 600;
  color: inherit;
  text-transform: none;
}
html .c62 a,
html .c62 a:hover,
html .c62 a:active {
  font-family: inherit;
  font-weight: inherit;
  color: inherit;
}
.c62 img,
.c62 svg {
  max-width: 100%;
  height: auto;
}
.c62 :focus-visible {
  outline: 2px solid var(--c62-accent);
  outline-offset: 3px;
}


/* 4. LAYOUT ================================================================ */
.c62 .c62-wrap {
  width: 100%;
  max-width: calc(var(--c62-max) + var(--c62-gutter) * 2);
  margin-inline: auto;
  padding-inline: var(--c62-gutter);
}
.c62 .c62-wrap--wide {
  max-width: calc(var(--c62-max-wide) + 64px);
  padding-inline: 32px;
}

/* Section bands */
.c62 .c62-band {
  position: relative;
  padding-block: var(--c62-section-pad);
  background: var(--c62-ground);
}
.c62 .c62-band--soft  { background: var(--c62-ground-soft); }
.c62 .c62-band--hero  { background: var(--c62-ground-hero); }
.c62 .c62-band--stone { background: var(--c62-stone); }
.c62 .c62-band--dark  { background: var(--c62-ink); color: var(--c62-dark-text); }
.c62 .c62-band--tight { padding-block: 28px; }
.c62 .c62-band--rule  { border-bottom: 1px solid var(--c62-border-light); }

/* Split: heading block left, body right (most section intros) */
.c62 .c62-split {
  display: flex;
  flex-wrap: wrap;
  gap: 40px 80px;
}
.c62 .c62-split > * { flex: 1 1 380px; min-width: 0; }
.c62 .c62-split--end { align-items: flex-end; }
.c62 .c62-split--wide-left > :first-child { flex: 3 1 560px; }
.c62 .c62-split--wide-left > :last-child  { flex: 2 1 380px; }
.c62 .c62-split--wide-right > :first-child { flex: 1 1 320px; }
.c62 .c62-split--wide-right > :last-child  { flex: 2 1 560px; }

/* Card grids */
.c62 .c62-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
  gap: 16px;
}
.c62 .c62-grid--wide { grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr)); }
.c62 .c62-grid--4    { grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); }

.c62 .c62-section-head { margin-bottom: 48px; }


/* 5. TYPE ================================================================== */
.c62 .c62-eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 16px;
  font-family: var(--c62-font-body);
  font-size: var(--c62-eyebrow);
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c62-accent);
}
.c62 .c62-eyebrow--muted { color: var(--c62-ink-muted); }
.c62 .c62-band--dark .c62-eyebrow { color: var(--c62-accent-dark); }

/* Display headings. Weight 300 Sora, tight tracking. */
.c62 .c62-h1,
.c62 .c62-h1-home,
.c62 .c62-h2 {
  font-family: var(--c62-font-display);
  font-weight: 300;
  color: inherit;
  text-wrap: balance; /* no single-word last lines */
}
.c62 .c62-h1-home {
  max-width: 760px;
  font-size: var(--c62-h1-home);
  line-height: 1.05;
  letter-spacing: -0.03em;
}
.c62 .c62-h1-home__line { display: block; }
.c62 .c62-h1-home__sub {
  display: block;
  margin-top: 16px;
  font-size: var(--c62-h1-home-sub);
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--c62-ink-body);
}
.c62 .c62-h1 {
  font-size: var(--c62-h1);
  line-height: 1.08;
  letter-spacing: -0.03em;
}
.c62 .c62-h2 {
  font-size: var(--c62-h2);
  line-height: 1.12;
  letter-spacing: -0.02em;
}
.c62 .c62-h2--narrow { max-width: 720px; }
.c62 .c62-h3 {
  font-family: var(--c62-font-display);
  font-weight: 600;
  font-size: var(--c62-h3);
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: inherit;
}
.c62 .c62-h3--lg { font-size: 21px; }
.c62 .c62-h3--sm { font-size: 18px; }

/* The red period that ends headlines */
.c62 .c62-dot { color: var(--c62-accent); }

.c62 .c62-lead {
  font-size: var(--c62-lead);
  line-height: 1.6;
  color: var(--c62-ink-body);
}
.c62 .c62-body {
  font-size: 17px;
  color: var(--c62-ink-body);
}
.c62 .c62-body > p + p { margin-top: 18px; }
.c62 .c62-small {
  font-size: 15px;
  color: var(--c62-ink-body);
}
/* Links inside running copy stay visibly links */
.c62 :is(.c62-lead, .c62-body, .c62-small, .c62-faq__item) a:not([class]) {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
.c62 .c62-band--dark .c62-lead,
.c62 .c62-band--dark .c62-body,
.c62 .c62-band--dark .c62-small { color: var(--c62-dark-body); }

.c62 .c62-num {
  font-family: var(--c62-font-display);
  font-size: 14px;
  color: var(--c62-accent);
}


/* 6. TARGET MOTIF ==========================================================
   Hero rings: inline SVG with class c62-rings, placed first inside a
   c62-band--hero. Small icon: c62-target (or the eyebrow modifier).
   ========================================================================== */
.c62 .c62-rings {
  position: absolute;
  top: 50%;
  right: -180px;
  width: 720px;
  height: 720px;
  max-width: none;
  transform: translateY(-50%);
  pointer-events: none;
  z-index: 0;
}
.c62 .c62-band--hero { overflow: hidden; }
.c62 .c62-band--hero > .c62-wrap { position: relative; z-index: 1; }

.c62 .c62-target {
  display: inline-block;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background: var(--c62-target-icon) center / contain no-repeat;
  vertical-align: middle;
}
.c62 .c62-eyebrow--target::before {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background: var(--c62-target-icon) center / contain no-repeat;
}

/* Target bullets for lists and checklists */
.c62 .c62-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 0;
  list-style: none;
}
.c62 .c62-list > li {
  position: relative;
  padding-left: 30px;
}
.c62 .c62-list > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.2em;
  width: 18px;
  height: 18px;
  background: var(--c62-target-icon) center / contain no-repeat;
}
/* On red backgrounds the red target disappears: switch it to white */
.c62 .c62-card--red .c62-list > li::before,
.c62 .c62-card--red .c62-target,
.c62 .c62-card--red .c62-eyebrow--target::before {
  background-image: var(--c62-target-icon-white);
}

/* Inline row of target-marked labels (e.g. the three pillar names) */
.c62 .c62-marks {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 36px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 15px;
  font-weight: 500;
}
.c62 .c62-marks > * {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* One partial ring tucked into a section corner. Use sparingly. */
.c62 .c62-corner-ring {
  position: absolute;
  width: 360px;
  height: 360px;
  right: -180px;
  bottom: -180px;
  border: 2px solid var(--c62-accent);
  border-radius: 50%;
  opacity: 0.14;
  pointer-events: none;
}


/* 7. BUTTONS AND LINKS ===================================================== */
.c62 .c62-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.c62 .c62-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 24px;
  border: 1.5px solid var(--c62-accent);
  border-radius: var(--c62-radius-btn);
  background: var(--c62-accent);
  color: #FFFFFF;
  font-family: var(--c62-font-body);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  box-shadow: none;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}
.c62 .c62-btn:hover,
.c62 .c62-btn:focus-visible {
  background: var(--c62-accent-hover);
  border-color: var(--c62-accent-hover);
  color: #FFFFFF;
}
.c62 .c62-btn--lg { padding: 16px 28px; font-size: 16px; }
.c62 .c62-btn--sm { padding: 12px 20px; font-size: 14px; }

.c62 .c62-btn--outline {
  background: transparent;
  border-color: var(--c62-ink);
  color: var(--c62-ink);
}
.c62 .c62-btn--outline:hover,
.c62 .c62-btn--outline:focus-visible {
  background: var(--c62-ink);
  border-color: var(--c62-ink);
  color: #FFFFFF;
}
.c62 .c62-btn--outline-red {
  background: transparent;
  border-color: var(--c62-accent);
  color: var(--c62-accent);
}
.c62 .c62-btn--outline-red:hover,
.c62 .c62-btn--outline-red:focus-visible {
  background: var(--c62-accent);
  border-color: var(--c62-accent);
  color: #FFFFFF;
}
.c62 .c62-btn--on-dark {
  background: transparent;
  border-color: var(--c62-dark-text);
  color: var(--c62-dark-text);
}
.c62 .c62-btn--on-dark:hover,
.c62 .c62-btn--on-dark:focus-visible {
  background: var(--c62-dark-text);
  border-color: var(--c62-dark-text);
  color: var(--c62-ink);
}

/* Text link with red color (card footers, "Explore Demand Capture") */
.c62 .c62-link {
  font-size: 14px;
  font-weight: 600;
  color: var(--c62-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
.c62 .c62-link:hover,
.c62 .c62-link:focus-visible {
  color: var(--c62-accent-hover);
  text-decoration-thickness: 2px;
}
.c62 .c62-link--on-dark { color: var(--c62-accent-dark); }
.c62 .c62-link--on-dark:hover,
.c62 .c62-link--on-dark:focus-visible { color: #FFFFFF; }


/* 8. COMPONENTS ============================================================ */

/* Breadcrumbs (pillar pages) */
.c62 .c62-crumbs {
  padding-top: 20px;
  font-size: 13px;
  color: var(--c62-ink-muted);
}
.c62 .c62-crumbs a {
  color: var(--c62-ink-muted);
  text-decoration: none;
}
.c62 .c62-crumbs a:hover { color: var(--c62-ink); text-decoration: underline; }
.c62 .c62-crumbs [aria-current] { color: var(--c62-ink); }
.c62 .c62-crumbs__sep { margin-inline: 6px; }

/* Cards */
.c62 .c62-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 32px;
  border: 1px solid var(--c62-border);
  border-radius: var(--c62-radius-card);
  background: var(--c62-ground);
}
.c62 .c62-card--plain { border-color: transparent; }
.c62 .c62-card--stone { border-color: transparent; background: var(--c62-stone); }
.c62 .c62-card--dark  { border-color: transparent; background: var(--c62-ink); color: var(--c62-dark-text); }
.c62 .c62-card--red   { border-color: transparent; background: var(--c62-accent); color: #FFFFFF; }
.c62 .c62-card--dark .c62-small { color: var(--c62-dark-body); }
.c62 .c62-card--red .c62-small  { color: var(--c62-accent-on); }
.c62 .c62-card__foot { margin-top: auto; padding-top: 8px; }

/* Tinted highlight panel inside cards ("Includes", "The result") */
.c62 .c62-panel {
  padding: 16px 18px;
  border-radius: 8px;
  background: var(--c62-accent-tint);
  font-size: 14px;
  color: var(--c62-ink-body);
}
.c62 .c62-panel__label {
  display: block;
  margin-bottom: 6px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c62-accent);
}

/* Row list: title left, description middle, link right ("What's included") */
.c62 .c62-rows {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.c62 .c62-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(0, 2.4fr) 190px;
  align-items: baseline;
  gap: 12px 40px;
  padding: 28px 32px;
  border-radius: var(--c62-radius-card);
  background: var(--c62-ground);
}
.c62 .c62-row > .c62-link { justify-self: end; }
/* Lists where no row has a link: give the text the link column too */
.c62 .c62-rows:not(:has(.c62-link)) .c62-row { grid-template-columns: minmax(180px, 1fr) minmax(0, 2.4fr); }
@media (max-width: 900px) {
  .c62 .c62-row { grid-template-columns: 1fr; gap: 8px; }
  .c62 .c62-row > .c62-link { justify-self: start; margin-top: 6px; }
}

/* Stack with dividers ("Our approach") */
.c62 .c62-stack {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.c62 .c62-stack > * {
  padding-bottom: 24px;
  border-bottom: 1px solid var(--c62-border-light);
}
.c62 .c62-stack > :last-child {
  padding-bottom: 0;
  border-bottom: 0;
}
.c62 .c62-stack .c62-h3 { margin-bottom: 8px; }
.c62 .c62-band--dark .c62-stack > * { border-bottom-color: var(--c62-dark-line); }

/* Testimonials */
.c62 .c62-quote {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 32px;
  border-radius: var(--c62-radius-card);
  background: var(--c62-ground);
}
/* On white sections the white quote card needs an outline */
.c62 .c62-band:not(.c62-band--soft):not(.c62-band--stone):not(.c62-band--dark) .c62-quote { border: 1px solid var(--c62-border); }
.c62 .c62-quote__mark {
  font-family: var(--c62-font-display);
  font-weight: 300;
  font-size: 44px;
  line-height: 0.6;
  color: var(--c62-accent);
}
.c62 .c62-quote__text {
  flex: 1;
  font-size: 15px;
  color: var(--c62-ink-body);
}
.c62 .c62-quote__by {
  padding-top: 16px;
  border-top: 1px solid var(--c62-border-light);
  /* Hello's reset makes figcaption italic, #333, 16px */
  font-size: inherit;
  font-style: normal;
  line-height: inherit;
  color: var(--c62-ink);
}
.c62 .c62-quote__name { font-size: 14px; font-weight: 600; }
.c62 .c62-quote__role { margin: 2px 0 10px; font-size: 13px; color: var(--c62-ink-muted); }
.c62 .c62-quote__result { font-size: 13px; font-weight: 600; color: var(--c62-accent); }

/* Stats row */
.c62 .c62-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
  gap: 32px;
}
.c62 .c62-stat__value {
  font-family: var(--c62-font-display);
  font-weight: 300;
  font-size: clamp(30px, 3.4vw, 40px);
  line-height: 1.1;
  letter-spacing: -0.02em;
}
.c62 .c62-stat__label {
  margin-top: 6px;
  font-size: 14px;
  color: var(--c62-ink-muted);
}
.c62 .c62-band--dark .c62-stat__label { color: var(--c62-dark-muted); }

/* FAQ (static, always open: keeps answers visible for search and FAQ schema) */
.c62 .c62-faq {
  display: flex;
  flex-direction: column;
}
.c62 .c62-faq__item {
  padding: 24px 0;
  border-top: 1px solid var(--c62-border-light);
}
.c62 .c62-faq__item:last-child { border-bottom: 1px solid var(--c62-border-light); }
.c62 .c62-faq__q { margin-bottom: 8px; }

/* "How it connects" link cards to the other pillars */
.c62 .c62-connect {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 28px 32px;
  border: 1px solid var(--c62-border);
  border-radius: var(--c62-radius-card);
  background: var(--c62-ground);
  color: var(--c62-ink);
  text-decoration: none;
  transition: border-color 0.18s ease;
}
.c62 .c62-connect:hover,
.c62 .c62-connect:focus-visible { border-color: var(--c62-accent); }
.c62 .c62-connect__label {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c62-accent);
}

/* Trade chips ("Built for the trades...") */
.c62 .c62-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 28px;
  padding: 0;
  list-style: none;
  font-size: 15px;
  font-weight: 500;
}

/* Placeholder content still waiting on real data. Delete before launch. */
.c62 .c62-placeholder {
  padding: 32px;
  border: 2px dashed var(--c62-accent);
  border-radius: var(--c62-radius-card);
  color: var(--c62-accent);
}


/* 9. UTILITIES ============================================================= */
.c62 .c62-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.c62 .c62-center { text-align: center; }
.c62 .c62-mt-0  { margin-top: 0; }
.c62 .c62-mt-16 { margin-top: 16px; }
.c62 .c62-mt-24 { margin-top: 24px; }
.c62 .c62-mt-36 { margin-top: 36px; }
.c62 .c62-mt-48 { margin-top: 48px; }
.c62 .c62-mb-20 { margin-bottom: 20px; }
.c62 .c62-mb-28 { margin-bottom: 28px; }
.c62 .c62-mb-48 { margin-bottom: 48px; }
.c62 .c62-max-580 { max-width: 580px; }
.c62 .c62-max-720 { max-width: 720px; }


/* 10. RESPONSIVE =========================================================== */

/* Hero rings: keep the bullseye clear of the headline as the screen narrows */
@media (max-width: 1200px) {
  .c62 .c62-rings { right: -280px; }
}
@media (max-width: 960px) {
  .c62 .c62-rings {
    top: 0;
    right: -260px;
    width: 520px;
    height: 520px;
    transform: none;
    opacity: 0.5;
  }
}
@media (max-width: 767px) {
  :root { --c62-gutter: 16px; }
  .c62 .c62-wrap--wide { padding-inline: 16px; }
  /* Quarter target tucked into the top-right corner, clear of the text */
  .c62 .c62-rings {
    top: -150px;
    right: -150px;
    width: 300px;
    height: 300px;
    opacity: 0.6;
  }
  .c62 .c62-card,
  .c62 .c62-quote { padding: 24px; }
  .c62 .c62-row,
  .c62 .c62-connect { padding: 24px; }
  .c62 .c62-section-head { margin-bottom: 32px; }
  .c62 .c62-actions > .c62-btn { flex: 1 1 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .c62 *,
  .c62 *::before,
  .c62 *::after {
    transition: none !important;
    animation: none !important;
  }
}


/* 11. GLOBAL HEADER ========================================================
   Markup: Core6 2-0 website/elementor/global-header.html, pasted into one
   HTML widget in the Elementor Pro Theme Builder header template.
   Desktop: hover or click opens dropdowns. 1080px and below: the menu
   button opens a full-width panel with accordions.
   ========================================================================== */

/* Sticky header. Targets the Theme Builder wrapper only when it holds the
   new header, so the old header template is unaffected. */
.elementor-location-header:has(.c62-header) {
  position: sticky;
  top: 0;
  z-index: 1000;
}
.admin-bar .elementor-location-header:has(.c62-header) { top: 32px; }
@media (max-width: 782px) {
  .admin-bar .elementor-location-header:has(.c62-header) { top: 0; }
}

.c62 .c62-header {
  position: relative;
  background: var(--c62-ground);
  border-bottom: 1px solid var(--c62-border-light);
  color: var(--c62-ink);
}
.c62 .c62-header__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 82px;
}

/* Logo */
.c62 .c62-header__logo {
  display: block;
  flex-shrink: 0;
  line-height: 0;
}
.c62 .c62-header__logo img {
  display: block;
  width: auto;
  height: 46px;
}

/* Primary nav (desktop) */
.c62 .c62-nav { display: flex; align-items: center; }
.c62 .c62-nav__list {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.c62 .c62-nav__item { position: relative; }

.c62 .c62-nav__link,
.c62 .c62-nav__toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 10px 13px;
  border: 0;
  border-radius: var(--c62-radius-btn);
  background: transparent;
  box-shadow: none;
  color: var(--c62-ink);
  font-family: var(--c62-font-body);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0;
  text-decoration: none;
  text-transform: none;
  cursor: pointer;
  transition: color 0.15s ease, background-color 0.15s ease;
}
.c62 .c62-nav__link:hover,
.c62 .c62-nav__link:focus-visible,
.c62 .c62-nav__toggle:hover,
.c62 .c62-nav__toggle:focus-visible,
.c62 .c62-nav__toggle[aria-expanded="true"] {
  background: var(--c62-ground-soft);
  color: var(--c62-accent);
  box-shadow: none;
}
.c62 .c62-nav__chev {
  width: 10px;
  height: 10px;
  flex-shrink: 0;
  transition: transform 0.18s ease;
}
.c62 .c62-nav__toggle[aria-expanded="true"] .c62-nav__chev { transform: rotate(180deg); }

/* Active section: a small target before the label */
.c62 .c62-nav__item.is-current > .c62-nav__link::before,
.c62 .c62-nav__item.is-current > .c62-nav__toggle::before {
  content: "";
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  background: var(--c62-target-icon) center / contain no-repeat;
}

/* Dropdown panels */
.c62 .c62-drop {
  position: absolute;
  top: 100%;
  left: 50%;
  z-index: 20;
  padding-top: 12px; /* hover bridge between the label and the panel */
  transform: translate(-50%, 6px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.16s ease, transform 0.16s ease, visibility 0s linear 0.16s;
}
.c62 .c62-drop--left { left: 0; transform: translate(0, 6px); }
.c62 .c62-drop__panel {
  padding: 28px;
  border: 1px solid var(--c62-border);
  border-radius: var(--c62-radius-card);
  background: var(--c62-ground);
  box-shadow: 0 18px 40px -18px rgba(22, 19, 15, 0.28);
}
.c62 .c62-nav__item.is-open > .c62-drop {
  transform: translate(-50%, 0);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity 0.16s ease, transform 0.16s ease, visibility 0s;
}
.c62 .c62-nav__item.is-open > .c62-drop--left { transform: translate(0, 0); }

.c62 .c62-drop__label {
  margin: 0 0 14px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c62-ink-muted);
}
.c62 .c62-drop__links {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.c62 .c62-drop__link {
  display: block;
  margin: 0 -10px;
  padding: 8px 10px;
  border-radius: var(--c62-radius-btn);
  color: var(--c62-ink);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.35;
  text-decoration: none;
}
.c62 .c62-drop__link:hover,
.c62 .c62-drop__link:focus-visible,
.c62 .c62-drop__link[aria-current="page"] {
  background: var(--c62-ground-soft);
  color: var(--c62-accent);
}

/* Solutions mega panel: three pillars + services */
.c62 .c62-drop--solutions .c62-drop__panel {
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: 32px;
  width: min(760px, calc(100vw - 48px));
}
.c62 .c62-drop__services {
  padding-left: 32px;
  border-left: 1px solid var(--c62-border-light);
}
.c62 .c62-pillar-link {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 2px 12px;
  margin: 0 -12px;
  padding: 12px;
  border-radius: var(--c62-radius-btn);
  color: var(--c62-ink);
  text-decoration: none;
}
.c62 .c62-pillar-link + .c62-pillar-link { margin-top: 4px; }
.c62 .c62-pillar-link::before {
  content: "";
  grid-row: 1 / 3;
  width: 18px;
  height: 18px;
  margin-top: 2px;
  background: var(--c62-target-icon) center / contain no-repeat;
}
.c62 .c62-pillar-link__name {
  font-family: var(--c62-font-display);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
}
.c62 .c62-pillar-link__desc {
  font-size: 14px;
  line-height: 1.45;
  color: var(--c62-ink-body);
}
.c62 .c62-pillar-link:hover,
.c62 .c62-pillar-link:focus-visible,
.c62 .c62-pillar-link[aria-current="page"] { background: var(--c62-ground-soft); }
.c62 .c62-pillar-link:hover .c62-pillar-link__name,
.c62 .c62-pillar-link:focus-visible .c62-pillar-link__name,
.c62 .c62-pillar-link[aria-current="page"] .c62-pillar-link__name { color: var(--c62-accent); }

/* Who We Serve panel: trades in columns */
.c62 .c62-drop--trades .c62-drop__panel { width: min(560px, calc(100vw - 48px)); }
.c62 .c62-drop--trades .c62-drop__links {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px 20px;
}

/* Small panels (About) */
.c62 .c62-drop--small .c62-drop__panel {
  width: 240px;
  padding: 16px 20px;
}

/* Right side: CTA + menu button */
.c62 .c62-header__actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.c62 .c62-menu-btn {
  display: none;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 1.5px solid var(--c62-border);
  border-radius: var(--c62-radius-btn);
  background: transparent;
  box-shadow: none;
  color: var(--c62-ink);
  cursor: pointer;
}
.c62 .c62-menu-btn:hover,
.c62 .c62-menu-btn:focus-visible {
  border-color: var(--c62-ink);
  background: transparent;
  color: var(--c62-ink);
}
.c62 .c62-menu-btn__bars,
.c62 .c62-menu-btn__bars::before,
.c62 .c62-menu-btn__bars::after {
  display: block;
  width: 18px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  transition: transform 0.2s ease, background-color 0.2s ease;
}
.c62 .c62-menu-btn__bars { position: relative; }
.c62 .c62-menu-btn__bars::before,
.c62 .c62-menu-btn__bars::after {
  content: "";
  position: absolute;
  left: 0;
}
.c62 .c62-menu-btn__bars::before { top: -6px; }
.c62 .c62-menu-btn__bars::after  { top: 6px; }
.c62 .c62-menu-btn[aria-expanded="true"] .c62-menu-btn__bars { background: transparent; }
.c62 .c62-menu-btn[aria-expanded="true"] .c62-menu-btn__bars::before { transform: translateY(6px) rotate(45deg); }
.c62 .c62-menu-btn[aria-expanded="true"] .c62-menu-btn__bars::after  { transform: translateY(-6px) rotate(-45deg); }

/* Mobile panel CTA (hidden on desktop) */
.c62 .c62-nav__cta { display: none; }

/* Tablet and phone */
@media (max-width: 1080px) {
  .c62 .c62-header__bar { min-height: 70px; }
  .c62 .c62-header__logo img { height: 40px; }
  .c62 .c62-menu-btn { display: inline-flex; }

  .c62 .c62-nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: none;
    flex-direction: column;
    align-items: stretch;
    max-height: calc(100vh - 70px);
    max-height: calc(100dvh - 70px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 8px var(--c62-gutter) 24px;
    border-bottom: 1px solid var(--c62-border-light);
    background: var(--c62-ground);
    box-shadow: 0 24px 40px -24px rgba(22, 19, 15, 0.3);
  }
  .c62 .c62-header.is-menu-open .c62-nav { display: flex; }

  .c62 .c62-nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }
  .c62 .c62-nav__item { border-bottom: 1px solid var(--c62-border-light); }
  .c62 .c62-nav__link,
  .c62 .c62-nav__toggle {
    justify-content: flex-start;
    width: 100%;
    padding: 16px 0;
    border-radius: 0;
    font-size: 17px;
  }
  .c62 .c62-nav__link:hover,
  .c62 .c62-nav__link:focus-visible,
  .c62 .c62-nav__toggle:hover,
  .c62 .c62-nav__toggle:focus-visible,
  .c62 .c62-nav__toggle[aria-expanded="true"] { background: transparent; }
  .c62 .c62-nav__chev { margin-left: auto; }

  /* Dropdowns become accordions */
  .c62 .c62-drop,
  .c62 .c62-drop--left {
    position: static;
    display: none;
    padding: 0 0 16px;
    transform: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: none;
  }
  .c62 .c62-nav__item.is-open > .c62-drop,
  .c62 .c62-nav__item.is-open > .c62-drop--left { display: block; transform: none; }
  .c62 .c62-drop__panel,
  .c62 .c62-drop--solutions .c62-drop__panel,
  .c62 .c62-drop--trades .c62-drop__panel,
  .c62 .c62-drop--small .c62-drop__panel {
    display: block;
    width: auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
  .c62 .c62-drop__services {
    margin-top: 16px;
    padding: 16px 0 0;
    border-left: 0;
    border-top: 1px solid var(--c62-border-light);
  }
  .c62 .c62-pillar-link,
  .c62 .c62-drop__link { margin: 0; padding-inline: 8px; }
  .c62 .c62-drop--trades .c62-drop__links { grid-template-columns: repeat(2, 1fr); }

  .c62 .c62-header__cta { display: none; }
  .c62 .c62-nav__cta {
    display: block;
    margin-top: 20px;
  }
  .c62 .c62-nav__cta .c62-btn { width: 100%; }
}

@media (max-width: 767px) {
  .c62 .c62-header__logo img { height: 36px; }
  .c62 .c62-nav { padding-inline: 16px; }
}

/* Lock page scroll while the mobile menu is open. html only: also setting
   body would make body the scroll box and unstick the sticky header. */
html.c62-menu-locked { overflow: hidden; }


/* 12. GLOBAL FOOTER ========================================================
   Markup: Core6 2-0 website/elementor/global-footer.html, pasted into one
   HTML widget in the Elementor Pro Theme Builder footer template.
   A white badge strip (memberships and accreditations) sits on top of the
   dark footer, so the official seals show on the white they were made for.
   ========================================================================== */

/* Badge strip */
.c62 .c62-badges {
  padding-block: 36px;
  border-top: 1px solid var(--c62-border-light);
  background: var(--c62-ground);
}
.c62 .c62-badges__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px 40px;
}
.c62 .c62-badges__label {
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c62-ink-muted);
}
.c62 .c62-badges__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 20px 36px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.c62 .c62-badges__list a {
  display: block;
  line-height: 0;
  border-radius: 4px;
  transition: opacity 0.15s ease;
}
.c62 .c62-badges__list a:hover { opacity: 0.8; }
.c62 .c62-badges__list img {
  display: block;
  width: auto;
  height: 64px;
  max-width: none;
}
.c62 .c62-badges__list .c62-badge--wide img { height: 54px; }

/* Dark footer */
.c62 .c62-footer {
  background: var(--c62-footer);
  color: var(--c62-dark-muted);
  font-size: 14px;
  line-height: 1.6;
}
.c62 .c62-footer__top {
  display: grid;
  grid-template-columns: minmax(250px, 1.2fr) repeat(3, minmax(0, 1fr)) minmax(250px, 1.15fr);
  gap: 40px 32px;
  padding-block: 72px 56px;
}

/* Brand column */
.c62 .c62-footer__logo {
  display: inline-block;
  line-height: 0;
}
.c62 .c62-footer__logo img {
  display: block;
  width: auto;
  height: 50px;
}
.c62 .c62-footer__line {
  margin-top: 20px;
  font-family: var(--c62-font-display);
  font-size: 18px;
  font-weight: 300;
  line-height: 1.35;
  letter-spacing: -0.01em;
  color: var(--c62-dark-text);
}
.c62 .c62-footer__sub {
  margin-top: 6px;
  max-width: 300px;
  color: var(--c62-dark-muted);
}

/* Social icons */
.c62 .c62-social {
  display: flex;
  gap: 10px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}
.c62 .c62-social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--c62-dark-line);
  border-radius: 50%;
  color: var(--c62-dark-text);
  transition: background-color 0.15s ease, border-color 0.15s ease;
}
.c62 .c62-social a:hover,
.c62 .c62-social a:focus-visible {
  border-color: var(--c62-accent);
  background: var(--c62-accent);
  color: #FFFFFF;
}
.c62 .c62-social svg {
  width: 17px;
  height: 17px;
  fill: currentColor;
}

/* Link columns */
.c62 .c62-footer__head {
  margin: 0 0 16px;
  font-family: var(--c62-font-body);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c62-dark-text);
}
.c62 .c62-footer__links {
  display: flex;
  flex-direction: column;
  gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.c62 .c62-footer__links a,
.c62 .c62-footer__contact a {
  color: var(--c62-dark-muted);
  text-decoration: none;
  transition: color 0.15s ease;
}
.c62 .c62-footer__links a:hover,
.c62 .c62-footer__links a:focus-visible,
.c62 .c62-footer__contact a:hover,
.c62 .c62-footer__contact a:focus-visible {
  color: var(--c62-dark-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Contact column */
.c62 .c62-footer__contact {
  display: flex;
  flex-direction: column;
  gap: 14px;
  font-style: normal;
}
.c62 .c62-footer__contact strong {
  display: block;
  margin-bottom: 2px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--c62-dark-text);
}
.c62 .c62-footer__cta { margin-top: 6px; }
.c62 .c62-footer__cta .c62-btn { white-space: nowrap; }

/* Who We Serve: full-width row of trades */
.c62 .c62-footer__trades {
  padding-block: 28px;
  border-top: 1px solid var(--c62-dark-line);
}
.c62 .c62-footer__trades .c62-footer__links {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px 28px;
}

/* Bottom bar */
.c62 .c62-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 24px;
  padding-block: 22px 28px;
  border-top: 1px solid var(--c62-dark-line);
  font-size: 13px;
}
.c62 .c62-footer__legal {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 20px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.c62 .c62-footer__legal a {
  color: var(--c62-dark-muted);
  text-decoration: none;
}
.c62 .c62-footer__legal a:hover,
.c62 .c62-footer__legal a:focus-visible {
  color: var(--c62-dark-text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 1080px) {
  .c62 .c62-footer__top { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .c62 .c62-footer__brand { grid-column: 1 / 3; }
  .c62 .c62-footer__contact-col { grid-column: 3; grid-row: 1; }
}
@media (max-width: 767px) {
  .c62 .c62-badges__inner { justify-content: center; text-align: center; }
  .c62 .c62-badges__list { justify-content: center; gap: 20px 28px; }
  .c62 .c62-badges__list img { height: 54px; }
  .c62 .c62-badges__list .c62-badge--wide img { height: 44px; }
  .c62 .c62-footer__top {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 36px 24px;
    padding-block: 56px 40px;
  }
  .c62 .c62-footer__brand,
  .c62 .c62-footer__contact-col { grid-column: 1 / -1; grid-row: auto; }
  .c62 .c62-footer__bottom { flex-direction: column; align-items: flex-start; }
}


/* 13. PAGE SECTIONS ========================================================
   Shared by the pillar pages (Demand Capture first) and later pages.
   ========================================================================== */

/* Anchor targets clear the sticky header */
.c62 [id] { scroll-margin-top: 104px; }

/* Interior page hero: breadcrumb, then H1 left and lead + buttons right */
.c62 .c62-band--page-hero {
  overflow: hidden;
  padding-block: 0 clamp(56px, 7vw, 72px);
}
.c62 .c62-band--page-hero > .c62-wrap { position: relative; z-index: 1; }
.c62 .c62-page-hero {
  padding-top: clamp(56px, 7vw, 88px);
}
.c62 .c62-page-hero .c62-h1 { max-width: 720px; }
.c62 .c62-corner-ring--top {
  top: -210px;
  bottom: auto;
  right: -210px;
  width: 340px;
  height: 340px;
  opacity: 0.12;
  z-index: 0;
}

/* Smaller H2 for "How it connects" */
.c62 .c62-h2--sm {
  font-size: clamp(28px, 3.2vw, 36px);
  line-height: 1.15;
}

/* Closing CTA headline */
.c62 .c62-h2--cta {
  max-width: 820px;
  font-size: clamp(34px, 4.6vw, 50px);
  line-height: 1.08;
  letter-spacing: -0.03em;
}
.c62 .c62-band--cta { padding-block: clamp(72px, 9vw, 104px); }

/* Row links with an arrow */
.c62 .c62-row .c62-link { white-space: nowrap; }
.c62 .c62-arrow {
  display: inline-block;
  margin-left: 4px;
  transition: transform 0.18s ease;
}
.c62 a:hover .c62-arrow,
.c62 a:focus-visible .c62-arrow { transform: translateX(3px); }

/* "How it connects" cards: red for the next pillar, dark for the other */
.c62 .c62-connect--red,
.c62 .c62-connect--dark {
  gap: 0;
  padding: 32px;
  border-color: transparent;
}
.c62 .c62-connect--red  { background: var(--c62-accent); color: #FFFFFF; }
.c62 .c62-connect--dark { background: var(--c62-ink); color: var(--c62-dark-text); }
.c62 .c62-connect--red:hover,
.c62 .c62-connect--red:focus-visible  { border-color: transparent; background: var(--c62-accent-hover); color: #FFFFFF; }
.c62 .c62-connect--dark:hover,
.c62 .c62-connect--dark:focus-visible { border-color: transparent; background: #24201B; color: var(--c62-dark-text); }
.c62 .c62-connect--red .c62-connect__label  { color: var(--c62-accent-on); }
.c62 .c62-connect--dark .c62-connect__label { color: var(--c62-dark-muted); }
.c62 .c62-connect__label { margin-bottom: 8px; }
.c62 .c62-connect__name {
  margin-bottom: 10px;
  font-family: var(--c62-font-display);
  font-size: 24px;
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: -0.01em;
}
.c62 .c62-connect__desc {
  font-size: 15px;
  line-height: 1.55;
  opacity: 0.88;
}
.c62 .c62-connect__go {
  margin-top: 20px;
  font-size: 14px;
  font-weight: 600;
}
.c62 .c62-connect--stone { gap: 0; padding: 32px; border-color: transparent; background: var(--c62-stone); color: var(--c62-ink); }
.c62 .c62-connect--stone:hover,
.c62 .c62-connect--stone:focus-visible { border-color: transparent; background: #E6DED4; color: var(--c62-ink); }
.c62 .c62-connect--stone .c62-connect__label { color: var(--c62-accent); }
.c62 .c62-connect--stone .c62-connect__desc { color: var(--c62-ink-body); opacity: 1; }

/* Red band ("The hidden gap") */
.c62 .c62-band--red { background: var(--c62-accent); color: #FFFFFF; }
.c62 .c62-band--red .c62-eyebrow { color: var(--c62-accent-on); }
.c62 .c62-band--red .c62-eyebrow--target::before { background-image: var(--c62-target-icon-white); }
.c62 .c62-band--red .c62-body,
.c62 .c62-band--red .c62-lead { color: #FDEDED; }

/* Steps with a display word (See / Shape / Sharpen) */
.c62 .c62-steps { display: flex; flex-direction: column; }
.c62 .c62-step {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  align-items: baseline;
  gap: 8px 24px;
  padding: 24px 0;
  border-top: 1px solid var(--c62-border-light);
}
.c62 .c62-step:last-child { border-bottom: 1px solid var(--c62-border-light); }
.c62 .c62-step__word {
  font-family: var(--c62-font-display);
  font-size: 28px;
  font-weight: 300;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--c62-accent);
}
.c62 .c62-band--dark .c62-step { border-color: #3A352F; }
.c62 .c62-band--dark .c62-step__word { color: var(--c62-accent-dark); }
@media (max-width: 480px) {
  .c62 .c62-step { grid-template-columns: 1fr; }
}

/* Result card: one big number, what changed, who */
.c62 .c62-split--center { align-items: center; }
.c62 .c62-result {
  padding: 40px 32px;
  border-radius: var(--c62-radius-card);
  background: var(--c62-ground-soft);
}
.c62 .c62-result__value {
  font-family: var(--c62-font-display);
  font-size: clamp(40px, 5vw, 52px);
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--c62-accent);
}
.c62 .c62-result__what { margin: 12px 0 20px; }
.c62 .c62-result__who { font-size: 14px; font-weight: 600; }
/* Until a real result is supplied. Delete the modifier with the placeholder text. */
.c62 .c62-result--placeholder { border: 1.5px dashed var(--c62-dark-muted); }

/* Proof card: a featured client quote with real supporting stats */
.c62 .c62-proof {
  position: relative;
  overflow: hidden;
  margin: 0;
  padding: clamp(32px, 4vw, 44px);
  border-radius: var(--c62-radius-card);
  background: var(--c62-ink);
  color: var(--c62-dark-text);
}
.c62 .c62-proof__mark {
  font-family: var(--c62-font-display);
  font-size: 72px;
  font-weight: 300;
  line-height: 0.6;
  color: var(--c62-accent);
}
.c62 .c62-proof__quote {
  margin: 20px 0 0;
  font-family: var(--c62-font-display);
  font-size: clamp(21px, 2.2vw, 26px);
  font-weight: 300;
  line-height: 1.35;
  letter-spacing: -0.01em;
  text-wrap: pretty;
}
.c62 .c62-proof__quote p + p { margin-top: 12px; }
.c62 .c62-proof__by {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
  font-size: 14px;
  font-style: normal;
  line-height: 1.45;
  color: var(--c62-dark-body);
}
.c62 .c62-proof__by strong { display: block; font-weight: 600; color: var(--c62-dark-text); }
.c62 .c62-proof__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin: 28px 0 0;
  padding: 24px 0 0;
  border-top: 1px solid var(--c62-dark-line);
  list-style: none;
}
.c62 .c62-proof__value {
  display: block;
  font-family: var(--c62-font-display);
  font-size: clamp(28px, 3vw, 34px);
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--c62-accent-dark);
}
.c62 .c62-proof__label {
  display: block;
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--c62-dark-muted);
}
.c62 .c62-proof__note {
  margin-top: 16px;
  font-size: 12px;
  color: var(--c62-dark-muted);
}
@media (max-width: 520px) {
  .c62 .c62-proof__stats { grid-template-columns: 1fr; }
}

/* Two back-to-back white sections: drop the second one's top padding */
.c62 .c62-band--flush-top { padding-top: 0; }

/* Lens cards (Market Intelligence: stone + dark pair) */
.c62 .c62-lens {
  display: flex;
  flex-direction: column;
  padding: clamp(28px, 4vw, 40px);
  border-radius: var(--c62-radius-card);
  background: var(--c62-stone);
  color: var(--c62-ink);
}
.c62 .c62-lens--dark { background: var(--c62-ink); color: var(--c62-dark-text); }
.c62 .c62-lens__label {
  margin-bottom: 12px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--c62-ink-muted);
}
.c62 .c62-lens--dark .c62-lens__label { color: var(--c62-dark-muted); }
.c62 .c62-lens__title {
  margin-bottom: 16px;
  font-family: var(--c62-font-display);
  font-size: clamp(24px, 2.4vw, 28px);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -0.01em;
}
.c62 .c62-lens .c62-small { margin-bottom: 24px; }
.c62 .c62-lens--dark .c62-small { color: var(--c62-dark-body); }

/* List divided by hairlines */
.c62 .c62-divlist {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 15px;
}
.c62 .c62-divlist > li {
  padding-top: 12px;
  border-top: 1px solid rgba(22, 19, 15, 0.12);
}
.c62 .c62-lens--dark .c62-divlist > li,
.c62 .c62-band--dark .c62-divlist > li { border-top-color: var(--c62-dark-line); }
.c62 .c62-divlist strong { font-weight: 600; }
.c62 .c62-divlist--roomy { gap: 14px; }
.c62 .c62-divlist--roomy > li { padding-top: 14px; }

/* Sample artifact frame (redacted report page, screenshot) */
.c62 .c62-sample {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 420px;
  padding: 40px;
  border-radius: var(--c62-radius-card);
  background: var(--c62-ground);
  text-align: center;
}
.c62 .c62-sample img { display: block; width: 100%; height: auto; border-radius: 6px; }
.c62 .c62-sample--placeholder { border: 1.5px dashed var(--c62-dark-muted); }
.c62 .c62-sample__title {
  font-family: var(--c62-font-display);
  font-size: 28px;
  font-weight: 300;
}
.c62 .c62-sample__note {
  max-width: 320px;
  font-size: 14px;
  color: var(--c62-ink-muted);
}

/* White button for red bands */
.c62 .c62-btn--white {
  border-color: #FFFFFF;
  background: #FFFFFF;
  color: var(--c62-ink);
}
.c62 .c62-btn--white:hover,
.c62 .c62-btn--white:focus-visible {
  border-color: var(--c62-ink);
  background: var(--c62-ink);
  color: #FFFFFF;
}
.c62 .c62-band--red :focus-visible { outline-color: #FFFFFF; }


/* 14. HOMEPAGE =============================================================
   Markup: Core6 2-0 website/elementor/homepage.html
   ========================================================================== */

/* Shared helpers used first on the homepage */
.c62 .c62-band--snug { padding-block: clamp(48px, 6vw, 72px); }
.c62 .c62-reset-list { margin: 0; padding: 0; list-style: none; }
.c62 .c62-body--lg { font-size: var(--c62-lead); }
.c62 .c62-actions--center { align-items: center; }

/* Hero (Target theme): left-aligned headline, rings cropped off the right */
.c62 .c62-band--home-hero {
  padding-block: clamp(80px, 10vw, 120px) clamp(88px, 10vw, 128px);
  border-bottom: 1px solid var(--c62-border-light);
}
.c62 .c62-band--home-hero .c62-lead { max-width: 580px; }

/* Three pillar cards (dark / red / stone), each a link to its pillar page */
.c62 .c62-pillar-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
  gap: 12px;
}
.c62 .c62-pillar-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 32px;
  min-height: 240px;
  padding: 36px 32px;
  border-radius: var(--c62-radius-card);
  background: var(--c62-ink);
  color: var(--c62-dark-text);
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.c62 .c62-pillar-card:hover,
.c62 .c62-pillar-card:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 18px 36px -22px rgba(22, 19, 15, 0.55);
  color: var(--c62-dark-text);
}
.c62 .c62-pillar-card--red   { background: var(--c62-accent); color: #FFFFFF; }
.c62 .c62-pillar-card--red:hover,
.c62 .c62-pillar-card--red:focus-visible { color: #FFFFFF; }
.c62 .c62-pillar-card--stone { background: var(--c62-stone); color: var(--c62-ink); }
.c62 .c62-pillar-card--stone:hover,
.c62 .c62-pillar-card--stone:focus-visible { color: var(--c62-ink); }
.c62 .c62-pillar-card__label {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--c62-dark-muted);
}
.c62 .c62-pillar-card--red .c62-pillar-card__label   { color: var(--c62-accent-on); }
.c62 .c62-pillar-card--stone .c62-pillar-card__label { color: var(--c62-ink-muted); }
.c62 .c62-pillar-card--red .c62-target { background-image: var(--c62-target-icon-white); }
.c62 .c62-pillar-card__line {
  font-family: var(--c62-font-display);
  font-size: clamp(24px, 2.4vw, 28px);
  font-weight: 300;
  line-height: 1.2;
  letter-spacing: -0.01em;
}
.c62 .c62-pillar-card__go {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.c62 .c62-pillar-card__go .c62-arrow { font-size: 22px; line-height: 1; }

/* Trades strip */
.c62 .c62-trades {
  padding-block: 28px;
  border-top: 1px solid var(--c62-border-light);
  border-bottom: 1px solid var(--c62-border-light);
}
.c62 .c62-trades__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 40px;
}
.c62 .c62-trades__label {
  flex: 0 0 auto;
  max-width: 220px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.c62 .c62-trades__list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 28px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--c62-font-display);
  font-size: 17px;
  color: var(--c62-ink-body);
}
.c62 .c62-trades__list a { color: var(--c62-ink-body); text-decoration: none; }
.c62 .c62-trades__list a:hover,
.c62 .c62-trades__list a:focus-visible {
  color: var(--c62-accent);
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* Trades marquee: one continuous row that scrolls sideways.
   The list is written twice; the copy is aria-hidden and untabbable. */
.c62 .c62-marquee {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.c62 .c62-marquee__track {
  display: flex;
  width: max-content;
  animation: c62-marquee 48s linear infinite;
}
.c62 .c62-marquee:hover .c62-marquee__track,
.c62 .c62-marquee:focus-within .c62-marquee__track { animation-play-state: paused; }
.c62 .c62-marquee .c62-trades__list {
  flex-wrap: nowrap;
  padding-right: 28px;
  white-space: nowrap;
}
@keyframes c62-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .c62 .c62-marquee { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
  .c62 .c62-marquee__track { animation: none; }
  .c62 .c62-marquee__dupe { display: none; }
}

/* Client logo marquee (service pages). Logos are white-background JPGs,
   so the strip stays on white. Reuses .c62-marquee for the motion. */
.c62 .c62-logos {
  padding-block: 40px 44px;
  border-bottom: 1px solid var(--c62-border-light);
  background: var(--c62-ground);
}
.c62 .c62-logos__label {
  margin-bottom: 20px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-align: center;
  color: var(--c62-ink-muted);
}
.c62 .c62-logo-list {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 40px;
  margin: 0;
  padding: 0 40px 0 0;
  list-style: none;
}
.c62 .c62-logo-list img {
  display: block;
  width: auto;
  height: 76px;
  max-width: none;
}

/* Plan cards (Hosting and Care Plans). Featured plan uses the dark card. */
.c62 .c62-plans {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
  gap: 16px;
  align-items: stretch;
}
.c62 .c62-plan {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 32px;
  border: 1px solid var(--c62-border);
  border-radius: var(--c62-radius-card);
  background: var(--c62-ground);
}
.c62 .c62-plan--featured {
  border-color: transparent;
  background: var(--c62-ink);
  color: var(--c62-dark-text);
}
.c62 .c62-plan__badge {
  position: absolute;
  top: 20px;
  right: 20px;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--c62-accent);
  color: #FFFFFF;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.c62 .c62-plan__name {
  font-family: var(--c62-font-display);
  font-size: 22px;
  font-weight: 600;
}
.c62 .c62-plan__price {
  margin-top: 14px;
  font-family: var(--c62-font-display);
  font-size: clamp(38px, 4vw, 46px);
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.02em;
}
.c62 .c62-plan__period {
  margin-left: 4px;
  font-family: var(--c62-font-body);
  font-size: 15px;
  letter-spacing: 0;
  color: var(--c62-ink-muted);
}
.c62 .c62-plan--featured .c62-plan__period { color: var(--c62-dark-muted); }
.c62 .c62-plan__desc { min-height: 4.8em; margin: 16px 0 20px; }
.c62 .c62-plan--featured .c62-small { color: var(--c62-dark-body); }
.c62 .c62-plan .c62-list {
  padding-top: 20px;
  border-top: 1px solid var(--c62-border-light);
  font-size: 15px;
}
.c62 .c62-plan--featured .c62-list { border-top-color: var(--c62-dark-line); color: var(--c62-dark-body); }
.c62 .c62-plans-note { margin-top: 20px; font-size: 14px; color: var(--c62-ink-muted); }

/* Latest Insights posts */
.c62 .c62-post { gap: 10px; }
.c62 .c62-post__date {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--c62-ink-muted);
}
.c62 .c62-post__title a { text-decoration: none; }
.c62 .c62-post__title a:hover,
.c62 .c62-post__title a:focus-visible { color: var(--c62-accent); text-decoration: underline; text-underline-offset: 3px; }

/* Questions homeowners ask, set as quotes */
.c62 .c62-asks {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
}
.c62 .c62-asks > li {
  padding: 16px 0;
  border-top: 1px solid var(--c62-border-light);
  font-family: var(--c62-font-display);
  font-size: clamp(18px, 1.8vw, 20px);
  font-weight: 300;
  line-height: 1.4;
}
.c62 .c62-asks > li:last-child { border-bottom: 1px solid var(--c62-border-light); }
.c62 .c62-band--dark .c62-asks > li { border-color: var(--c62-dark-line); }

/* Checklist in two columns */
.c62 .c62-list--2col {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 40px;
}
@media (max-width: 767px) {
  .c62 .c62-list--2col { grid-template-columns: 1fr; }
}

/* Founder section: photo + first-person note */
.c62 .c62-founder {
  display: grid;
  grid-template-columns: minmax(0, 340px) minmax(0, 1fr);
  align-items: center;
  gap: 40px 64px;
}
.c62 .c62-founder__photo img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: var(--c62-radius-card);
}
@media (max-width: 767px) {
  .c62 .c62-founder { grid-template-columns: 1fr; }
  .c62 .c62-founder__photo { max-width: 240px; }
}

/* Founder note (first person, signed) */
.c62 .c62-note {
  max-width: 820px;
  padding-left: 24px;
  border-left: 3px solid var(--c62-accent);
}
.c62 .c62-note__text {
  text-wrap: pretty;
  font-family: var(--c62-font-display);
  font-size: clamp(19px, 2vw, 22px);
  font-weight: 300;
  line-height: 1.5;
}
.c62 .c62-note__text p + p { margin-top: 14px; }
.c62 .c62-note__sign { margin-top: 18px; font-size: 14px; color: var(--c62-ink-muted); }
.c62 .c62-note__sign strong { color: var(--c62-ink); font-weight: 600; }

/* "How we work": three pillars in a row, core services in their own row */
.c62 .c62-services-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 40px;
  margin-top: 16px;
  padding: 24px 32px;
  border-radius: var(--c62-radius-card);
  background: var(--c62-ink);
  color: var(--c62-dark-text);
}
.c62 .c62-services-row__label {
  font-family: var(--c62-font-display);
  font-size: 18px;
  font-weight: 600;
}
.c62 .c62-services-row .c62-linklist {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px 28px;
}

/* "Who we work with": criteria as a calm checklist */
.c62 .c62-criteria {
  margin: 0;
  padding: 8px 32px;
  border-radius: var(--c62-radius-card);
  background: var(--c62-ground);
  list-style: none;
}
.c62 .c62-criteria__item {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 4px 16px;
  padding: 22px 0;
  border-bottom: 1px solid var(--c62-border-light);
}
.c62 .c62-criteria__item:last-child { border-bottom: 0; }
.c62 .c62-criteria__item::before {
  content: "";
  grid-row: 1 / 3;
  width: 18px;
  height: 18px;
  margin-top: 3px;
  background: var(--c62-target-icon) center / contain no-repeat;
}

/* "How we work": intro left, 2 x 2 card grid right */
.c62 .c62-card--compact { gap: 0; padding: 28px; }
.c62 .c62-card--compact > .c62-h3 { margin-bottom: 12px; }
.c62 .c62-card--compact > .c62-small { margin-bottom: 16px; }
.c62 .c62-card--compact > .c62-panel { margin-bottom: 20px; }
.c62 .c62-panel__text {
  font-family: var(--c62-font-display);
  font-size: 13px;
  line-height: 1.45;
  color: var(--c62-ink);
}
.c62 .c62-linklist {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 15px;
}
.c62 .c62-linklist a {
  color: var(--c62-dark-text);
  text-decoration: underline;
  text-decoration-color: rgba(244, 241, 236, 0.35);
  text-underline-offset: 4px;
}
.c62 .c62-linklist a:hover,
.c62 .c62-linklist a:focus-visible {
  color: #FFFFFF;
  text-decoration-color: var(--c62-accent);
}

/* "Who we work with" note under the criteria */
.c62 .c62-fit-note {
  font-size: 14px;
  color: var(--c62-ink-muted);
}

/* "One program": three step cards and the exclusivity bar */
.c62 .c62-step-card { gap: 10px; }
.c62 .c62-exclusive {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 20px 40px;
  margin-top: 16px;
  padding: 32px;
  border-radius: var(--c62-radius-card);
  background: var(--c62-ink);
  color: var(--c62-dark-text);
}
.c62 .c62-exclusive__text {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  max-width: 720px;
  font-family: var(--c62-font-display);
  font-size: clamp(19px, 2vw, 22px);
  font-weight: 300;
  line-height: 1.4;
}
.c62 .c62-exclusive__text .c62-target { margin-top: 5px; }

/* Testimonial section: stats under the quotes */
.c62 .c62-stats--rule {
  margin-top: 56px;
  padding-top: 32px;
  border-top: 1px solid #E0D9D0;
}

/* Closing CTA: side note and "what to expect" checklist */
.c62 .c62-cta-note {
  font-size: 15px;
  color: var(--c62-dark-muted);
}
.c62 .c62-expect {
  margin-top: 56px;
  padding-top: 32px;
  border-top: 1px solid var(--c62-dark-line);
}
.c62 .c62-expect__label {
  margin-bottom: 20px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c62-dark-text);
}
.c62 .c62-expect .c62-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 40px;
  font-size: 15px;
  color: var(--c62-dark-body);
}

@media (max-width: 767px) {
  .c62 .c62-expect .c62-list { grid-template-columns: 1fr; }
  .c62 .c62-pillar-card { min-height: 0; }
  .c62 .c62-exclusive { padding: 24px; }
  .c62 .c62-trades__label { flex: 1 1 100%; max-width: none; }
  .c62 .c62-marquee { flex-basis: 100%; }
}