.elementor-1915 .elementor-element.elementor-element-1ed03a6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1915 .elementor-element.elementor-element-834cdb4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1915 .elementor-element.elementor-element-e5722ee{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1915 .elementor-element.elementor-element-c1f063a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1915 .elementor-element.elementor-element-ac76803{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1915 .elementor-element.elementor-element-9b19a32{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS *//* ==========================================================================
   ABOUT US — PAGE-SPECIFIC STYLES
   Additive only — assumes the global styles.css (colors, fonts, spacing
   tokens, .wrap, .full-bleed, .head-block, .eyebrow, .lead, .img-ph,
   .cert-row/.cert-item/.cert-mark) is already loaded site-wide from the
   homepage build. Paste this into the same Custom CSS field, appended
   after the existing content — do not duplicate the :root tokens.
   ========================================================================== */

/* ===== 01-about-hero.html ===== */
.about-hero{
  background:var(--blue);
  padding-top:calc(var(--sp-2xl) + var(--header-height));
  padding-bottom:var(--sp-2xl);
}
.about-hero-inner{ max-width:760px; }
.about-hero h1{ color:#fff; font-size:var(--f-display); line-height:1.15; margin-top:0.75rem; }
.about-hero p.lead{ color:rgba(255,255,255,0.78); margin-top:1.5rem; max-width:56ch; }


/* ===== 02-founder-story.html ===== */
.founder-story{ padding-top:var(--sp-3xl); padding-bottom:var(--sp-3xl); }
.founder-grid{ display:grid; grid-template-columns:0.75fr 1.25fr; gap:var(--sp-2xl); align-items:center; }
.founder-photo{ height:clamp(320px, 30vw, 440px); border-radius:var(--radius-md); box-shadow:var(--shadow-lg); }
.founder-copy h2{ margin-top:0.5rem; }
.founder-copy p.lead{ margin-top:1.25rem; }
.founder-copy p:not(.lead){ margin-top:1rem; font-size:var(--f-body); color:var(--body); max-width:60ch; }
@media (max-width:800px){ .founder-grid{ grid-template-columns:1fr; } }


/* ===== 03-vision-mission-aim.html ===== */
.vma{ background:var(--dark); padding-top:var(--sp-2xl); padding-bottom:var(--sp-2xl); }
.vma-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:rgba(255,255,255,0.1);
}
.vma-item{ background:var(--dark); padding:var(--sp-lg) var(--sp-md); }
.vma-label{
  font-weight:800;
  font-size:var(--f-h4); color:var(--blue-tint-2);
  margin-bottom:1rem;
  text-transform:uppercase; letter-spacing:0.04em;
}
.vma-item p{ font-size:var(--f-small); color:rgba(255,255,255,0.75); line-height:1.7; }
@media (max-width:800px){
  .vma-grid{ grid-template-columns:1fr; }
}


/* ===== 04-milestones.html =====
   Dark full-bleed band, alternating 2-column timeline. */
.milestones{ background:var(--dark); padding-top:var(--sp-3xl); padding-bottom:var(--sp-3xl); }

.tl2{
  position:relative;
  max-width:820px;
  margin:var(--sp-2xl) auto 0;
}
.tl2::before{
  content:"";
  position:absolute; left:50%; top:0; bottom:0;
  width:2px; background:rgba(255,255,255,0.12);
  transform:translateX(-50%);
}
.tl2-item{
  position:relative;
  width:50%;
  padding-bottom:var(--sp-md);
}
.tl2-item.left{ left:0; padding-right:2.5rem; text-align:right; }
.tl2-item.right{ left:50%; padding-left:2.5rem; text-align:left; }
.tl2-item::after{
  content:"";
  position:absolute; top:0.4rem;
  width:12px; height:12px; border-radius:50%;
  background:var(--blue);
  border:3px solid var(--dark);
  box-shadow:0 0 0 2px rgba(255,255,255,0.15);
}
.tl2-item.left::after{ right:-7px; }
.tl2-item.right::after{ left:-7px; }

.tl2-card{
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:var(--radius-md);
  padding:1.25rem 1.5rem;
  display:inline-block;
  transition:background 0.25s ease, transform 0.25s ease;
}
.tl2-card:hover{ background:rgba(255,255,255,0.08); transform:translateY(-2px); }
.tl2-year{
  font-weight:800;
  font-size:var(--f-h4); color:var(--blue-tint-2);
  margin-bottom:0.4rem;
}
.tl2-card p{ font-size:var(--f-small); color:rgba(255,255,255,0.7); line-height:1.6; }

@media (max-width:700px){
  .tl2::before{ left:12px; }
  .tl2-item, .tl2-item.left, .tl2-item.right{
    width:100%; left:0; text-align:left; padding-left:2.25rem; padding-right:0;
  }
  .tl2-item.left::after, .tl2-item.right::after{ left:6px; }
}


/* ===== 05-divisions.html =====
   Five cards: 3 on the first row, the remaining 2 centred beneath.
   Flex (not grid) so the leftover cards centre instead of hugging the left.
   Rows stretch, so cards in the same row are always equal height. */
.divisions{ padding-top:var(--sp-3xl); padding-bottom:var(--sp-3xl); }
.div-grid{
  --div-gap:var(--sp-md);          /* ← one value controls spacing AND card widths */
  margin-top:var(--sp-xl);
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:var(--div-gap);
}
.div-card{
  flex:0 0 calc((100% - 2 * var(--div-gap)) / 3);
  min-width:0;
  background:var(--paper-alt);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:var(--sp-lg) 1.75rem;
  transition:transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}
.div-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); background:#fff; }
.div-mark{
  font-weight:800;
  font-size:1.75rem; color:var(--blue-tint-2);
  margin-bottom:0.75rem;
}
.div-year{
  font-weight:700; font-size:0.72rem;
  letter-spacing:0.04em; text-transform:uppercase; color:var(--blue);
  margin-bottom:0.5rem;
}
.div-card h3{ font-size:var(--f-h3); }
.div-card p{ margin-top:0.6rem; font-size:var(--f-small); color:var(--muted); }

@media (max-width:1000px){
  .div-card{ flex-basis:calc((100% - var(--div-gap)) / 2); }   /* 2 + 2 + 1 centred */
}
@media (max-width:640px){
  .div-card{ flex-basis:100%; }
}/* End custom CSS */