.about-hero{padding:0;border-bottom:1px solid var(--color-border)}
.about-hero__grid{display:grid;grid-template-columns:1fr}
.about-hero__copy{padding:4rem 1.25rem}
.about-hero__copy-inner{max-width:38rem;margin-left:auto;margin-right:auto}
.about-hero h1{font-size:clamp(2.6rem,7vw,3.8rem);letter-spacing:-.04em}
.about-hero h1::after,.about-rule::after{content:"";display:block;width:34px;height:2px;margin-top:1.2rem;background:var(--color-accent)}
.about-hero p{margin-top:1.25rem;font-size:1.08rem;line-height:1.65}
.about-hero__image{min-height:280px;display:grid;place-items:center;background:linear-gradient(135deg,#eef4f8,#f7f4ef);border-top:1px solid var(--color-border);color:var(--color-text-muted)}
.placeholder{text-align:center;padding:2rem}.placeholder strong{display:block;color:var(--color-text);font-size:1rem}.placeholder span{display:block;margin-top:.4rem;font-size:.85rem}

.why{padding:3.5rem 0}.why-panel{padding:2rem;border-radius:12px;background:#f6f8fa}.why-grid{display:grid;gap:2rem;align-items:center}.why-brand{text-align:center}.why-wordmark{font-family:Georgia,serif;font-size:clamp(4.5rem,14vw,7rem);line-height:.9;color:#13283e;font-weight:700}.why-solutions{margin-top:.5rem;letter-spacing:.35em;font-weight:700}.why-tag{margin-top:.65rem;color:var(--color-accent);font-size:1.8rem;font-style:italic;font-weight:700}.why-copy{padding-top:1.5rem;border-top:1px solid var(--color-border)}.why-copy p{font-size:1.25rem;line-height:1.5}.why-copy p+p{margin-top:.85rem}.why-copy strong{color:var(--color-accent)}

.canadian{padding-bottom:2rem}.canadian-panel{position:relative;overflow:hidden;display:grid;gap:2rem;padding:2rem;border-radius:12px;background:#f8f5f1}.canadian-heading{max-width:18rem;font-size:clamp(2.2rem,6vw,3.1rem);letter-spacing:-.04em}.canadian-copy{position:relative;z-index:2}.canadian-copy p{margin-top:1rem;color:var(--color-text-muted)}.map-placeholder{min-height:220px;display:grid;place-items:center;border:1px dashed #c9ced4;border-radius:8px;background:rgba(255,255,255,.45);color:var(--color-text-muted)}

.fit{padding:3.5rem 0}.fit-grid{display:grid;gap:3rem;align-items:center}.fit-copy{max-width:30rem}.fit-copy p{margin-top:1.25rem;color:var(--color-text-muted)}.flow{display:grid;gap:1.25rem}.node{text-align:center}.circle{width:88px;height:88px;margin:0 auto .75rem;display:grid;place-items:center;border-radius:50%;background:#e7f0f7}.node:nth-child(2) .circle{background:#f7e6e4}.node:nth-child(3) .circle{background:#e8f0e5}.circle svg{width:48px;height:48px}.node h3{font-size:1rem}.node:nth-child(2) h3{color:var(--color-accent)}.node p{margin-top:.4rem;color:var(--color-text-muted);font-size:.88rem}

.beliefs{padding:1rem 0 2rem}.belief-panel{display:grid;gap:2rem;padding:2rem;border-radius:12px;background:#f8f4ef}.belief{display:grid;gap:1.25rem;align-items:start}.belief-icon{width:100px;height:100px;display:grid;place-items:center;border-radius:50%;background:#f7e6e4;color:var(--color-accent)}.belief:nth-child(2) .belief-icon{background:#e8f0e5;color:#315d38}.belief-icon svg{width:58px;height:58px}.belief h2{font-size:1.8rem}.belief p{margin-top:.8rem;color:var(--color-text-muted)}

.about-ending{padding:1rem 0 4.5rem}.ending-panel{display:grid;gap:1rem;justify-items:center;padding:2rem;border:1px solid #e7b5b6;border-radius:8px;text-align:center;background:#fffdfc}.ending-icon{width:64px;height:64px;display:grid;place-items:center;border-radius:50%;background:#f7e6e4;color:var(--color-accent)}.ending-icon svg{width:36px;height:36px}.ending-panel h2{color:var(--color-accent);font-size:2rem}.ending-panel p{font-size:1.05rem;color:var(--color-text-muted)}

@media(min-width:1024px){
.about-hero__grid{grid-template-columns:1fr 1fr;min-height:360px}.about-hero__copy{display:flex;align-items:center;padding:3.5rem 4rem}.about-hero__copy-inner{max-width:35rem;margin-right:0}.about-hero__image{border-top:0;min-height:360px}
.why-grid{grid-template-columns:.95fr 1.05fr}.why-copy{padding:1rem 0 1rem 2.5rem;border-top:0;border-left:1px solid var(--color-border)}
.canadian-panel{grid-template-columns:.7fr 1fr .9fr;align-items:center}
.fit-grid{grid-template-columns:.75fr 1.25fr}.flow{grid-template-columns:repeat(3,1fr)}.flow .node+.node{position:relative}.flow .node+.node:before{content:"→";position:absolute;left:-12px;top:36px;color:var(--color-accent)}
.belief-panel{grid-template-columns:1fr 1fr}.belief{grid-template-columns:auto 1fr}.belief+.belief{padding-left:2rem;border-left:1px solid var(--color-border)}
}

/* About-page closing mark: simplified to match the preferred mock-up. */
.ending-icon {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 4.8rem;
    font-weight: 700;
    line-height: 1;
    padding-top: .48rem;
    color: var(--color-accent);
}

@media(min-width:700px){.about-hero__copy{padding-left:2rem;padding-right:2rem}}


/* Canada background architecture
   Final assets:
   ../assets/canada-bg-mobile.svg
   ../assets/canada-bg-desktop.svg
*/
.canadian-panel{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  grid-template-columns:1fr;
}
.canadian-panel::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background-image:url("../../assets/canada-bg-mobile.svg");
  background-repeat:no-repeat;
  background-position:center 44%;
  background-size:88% auto;
  opacity:.09;
  pointer-events:none;
}
.canadian-heading,
.canadian-copy{
  position:relative;
  z-index:1;
}
@media(min-width:1024px){
  .canadian-panel{
    grid-template-columns:.8fr 1.2fr;
    gap:3rem;
    min-height:390px;
  }
  .canadian-panel::before{
    background-image:url("../../assets/canada-bg-desktop.svg");
    background-position:center right;
    background-size:94% auto;
    opacity:.09;
  }
}


/* =========================================================
   Canada background visual — actual responsive assets
   Decorative only; text remains the foreground content.
   ========================================================= */

.canadian-panel{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}

.canadian-panel::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background-image:url("../../assets/canada-bg-mobile.svg");
  background-repeat:no-repeat;
  background-position:center 43%;
  background-size:92% auto;
  opacity:.09;
  pointer-events:none;
}

.canadian-heading,
.canadian-copy{
  position:relative;
  z-index:1;
}

@media(min-width:700px) and (max-width:1023px){
  .canadian-panel::before{
    background-size:72% auto;
    background-position:78% center;
    opacity:.085;
  }
}

@media(min-width:1024px){
  .canadian-panel{
    grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
    min-height:390px;
  }

  .canadian-panel::before{
    background-image:url("../../assets/canada-bg-desktop.svg");
    background-size:92% auto;
    background-position:center center;
    opacity:.09;
  }
}


/* Canada map tuning pass
   - increase visibility
   - preserve full southern Canada on desktop
   - keep mobile composition largely unchanged
*/

.canadian-panel::before{
  opacity:.14;
}

@media(min-width:700px) and (max-width:1023px){
  .canadian-panel::before{
    background-size:72% auto;
    background-position:78% 44%;
    opacity:.13;
  }
}

@media(min-width:1024px){
  .canadian-panel::before{
    /* Slightly smaller and shifted upward so southern Canada remains visible. */
    background-size:84% auto;
    background-position:center 38%;
    opacity:.14;
  }
}


/* Canada map desktop south-priority correction:
   crop is controlled inside the SVG, not by background-position. */
@media(min-width:1024px){
  .canadian-panel::before{
    background-size:84% auto;
    background-position:center center;
    opacity:.14;
  }
}


/* Canada map desktop scale refinement */
@media(min-width:1024px){
  .canadian-panel::before{
    background-size:76% auto;
    background-position:center center;
    opacity:.14;
  }
}

/* Canada map visibility refinement: slightly stronger */
.canadian-panel::before { opacity: .17; }

@media (min-width:700px) and (max-width:1023px) {
  .canadian-panel::before { opacity: .16; }
}

@media (min-width:1024px) {
  .canadian-panel::before {
    background-size: 76% auto;
    background-position: center center;
    opacity: .17;
  }
}


/* =========================================================
   About hero: business + practical AI line illustration
   ========================================================= */

.about-hero__image{
  position:relative;
  overflow:hidden;
  min-height:390px;
  background:
    radial-gradient(circle at 58% 50%, rgba(22,43,64,.035), transparent 58%),
    linear-gradient(135deg, rgba(248,250,252,.85), rgba(255,255,255,.96));
}

.about-hero-business-visual{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  padding:1.25rem;
}

.about-hero-business-visual svg{
  width:100%;
  max-width:760px;
  height:auto;
}

.about-hero-line{
  fill:none;
  stroke:var(--ehi-navy,#162b40);
  stroke-width:2.1;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.about-hero-line--soft{
  opacity:.48;
}

.about-hero-ai{
  fill:none;
  stroke:var(--ehi-navy,#162b40);
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.about-hero-ai rect{
  fill:rgba(255,255,255,.88);
}

.about-hero-ai text{
  fill:var(--ehi-navy,#162b40);
  stroke:none;
  font-family:Arial,Helvetica,sans-serif;
  font-size:42px;
  font-weight:500;
}

.about-hero-connector{
  fill:none;
  stroke:var(--ehi-navy,#162b40);
  stroke-width:1.8;
  stroke-dasharray:5 6;
  opacity:.48;
}

.about-hero-accent{
  fill:none;
  stroke:var(--ehi-red,#b9292f);
  stroke-width:3;
  stroke-linecap:round;
  opacity:.85;
}

@media(min-width:700px) and (max-width:1023px){
  .about-hero__image{
    min-height:340px;
  }

  .about-hero-business-visual{
    padding:.75rem;
  }
}

@media(max-width:699px){
  .about-hero__image{
    min-height:235px;
  }

  .about-hero-business-visual{
    padding:.25rem .35rem;
  }

  .about-hero-business-visual svg{
    width:112%;
    max-width:none;
  }
}


/* About hero mobile refinement:
   the illustration adds useful balance on larger screens but is omitted on phones. */
@media(max-width:699px){
  .about-hero__image{
    display:none;
  }
}


/* Experience behind Ehi */
.about-experience{padding:clamp(3.75rem,7vw,6rem) 0;background:var(--surface-soft,#f6f8f9)}
.about-experience__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(2.5rem,6vw,5rem);align-items:center}
.about-experience__intro h2{max-width:680px;margin:.45rem 0 1.15rem}
.about-experience__intro p:not(.eyebrow){max-width:650px}
.about-testimonial{margin:0;padding:clamp(1.6rem,3vw,2.25rem);background:#fff;border:1px solid var(--color-border,#dde3e8);border-radius:16px;box-shadow:0 10px 28px rgba(22,43,64,.055)}
.about-testimonial blockquote{margin:0}
.about-testimonial blockquote p{margin:0;color:var(--ehi-navy,#162b40);font-size:clamp(1.08rem,1.8vw,1.3rem);line-height:1.65;font-weight:500}
.about-testimonial blockquote p+p{margin-top:1em}
.about-testimonial figcaption{display:flex;flex-direction:column;gap:.18rem;margin-top:1.4rem;padding-top:1.15rem;border-top:1px solid var(--color-border,#dde3e8)}
.about-testimonial figcaption strong{color:var(--ehi-navy,#162b40)}
.about-testimonial figcaption span{color:var(--color-text-muted,#66727d)}
.about-testimonial figcaption small{margin-top:.55rem;color:var(--color-text-muted,#66727d);font-size:.78rem;line-height:1.4}
@media(max-width:760px){.about-experience__grid{grid-template-columns:1fr;gap:2rem}}

/* About hero Canadian business-network visual */
.about-hero__network-image{display:block;width:100%;height:auto;object-fit:contain}


/* About hero network illustration colour harmonization:
   soften saturation and lift the map/overall blue tone so it sits closer
   to the page's muted icon palette while retaining navy/red/green accents. */
.about-hero__network-image{
  filter:saturate(.84) brightness(1.045) contrast(.97);
}