/* --- from about-us.html --- */
:root {
      --site-bg: #F8FAFF;
      --site-surface: #EAF0FF;
      --site-text: #0F1118;
      --site-muted: #343A4B;
      --site-border: #D7DEF0;
      --site-primary: #4C68DB;
      --site-on-primary: #FFFFFF;
      --site-secondary: #A88467;
      --site-on-secondary: #000000;
      --site-accent: #75825A;
      --site-on-accent: #000000;
      --site-success: #22C55E;
      --site-warning: #F59E0B;
      --site-error: #EF4444;
      --site-info: #3B82F6;

      --color-bg: var(--site-bg);
      --color-surface: var(--site-surface);
      --color-text: var(--site-text);
      --color-muted: var(--site-muted);
      --color-border: var(--site-border);
      --color-primary: var(--site-primary);
      --color-on-primary: var(--site-on-primary);
      --color-secondary: var(--site-secondary);
      --color-on-secondary: var(--site-on-secondary);
      --color-accent: var(--site-accent);
      --color-on-accent: var(--site-on-accent);
      --color-success: var(--site-success);
      --color-warning: var(--site-warning);
      --color-error: var(--site-error);
      --color-info: var(--site-info);

      --A: #0F1118;
      --B: #F8FAFF;
      --C: #A88467;
      --D: #FFFFFF;
    }

    @media (prefers-color-scheme: dark) {
      :root {
        --site-bg: #060B20;
        --site-surface: #101830;
        --site-text: #E3E4E8;
        --site-muted: #ACB1BE;
        --site-border: #272D40;
        --site-primary: #9FB1E3;
        --site-on-primary: #000000;
        --site-secondary: #C8A486;
        --site-on-secondary: #000000;
        --site-accent: #C5D6A3;
        --site-on-accent: #000000;

        --A: #E3E4E8;
        --B: #060B20;
        --C: #C8A486;
        --D: #101830;
      }
    }

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    body {
      font-family: 'Lora', Georgia, serif;
      background: var(--site-bg);
      color: var(--site-text);
      line-height: 1.6;
    }

    .bar {
      position: sticky;
      top: 0;
      z-index: 50;
      height: 72px;
      display: flex;
      align-items: center;
      gap: 24px;
      padding: 0 32px;
      background: var(--D);
      border-bottom: 1px solid rgba(0,0,0,.12);
    }
    .bar .logo {
      font-weight: 700;
      font-size: 1.3rem;
      text-decoration: none;
      color: var(--site-primary);
      white-space: nowrap;
    }
    .bar .nav {
      display: flex;
      gap: 24px;
      list-style: none;
      margin-left: auto;
      align-items: center;
    }
    .bar .nav a {
      text-decoration: none;
      color: var(--site-text);
      font-weight: 400;
      transition: color 0.2s;
    }
    .bar .nav a:hover {
      color: var(--site-primary);
    }
    .bar .contact-info {
      display: flex;
      align-items: center;
      gap: 8px;
      color: var(--site-muted);
      font-size: 0.95rem;
    }
    .bar .contact-info i {
      font-size: 1.3rem;
      color: var(--site-primary);
    }
    .bar .cta-btn {
      display: inline-block;
      padding: 10px 24px;
      background: var(--site-primary);
      color: var(--site-on-primary);
      border-radius: 100px;
      text-decoration: none;
      font-weight: 600;
      transition: opacity 0.2s;
    }
    .bar .cta-btn:hover {
      opacity: 0.9;
    }
    .menu-toggle {
      display: none;
      background: none;
      border: none;
      cursor: pointer;
      padding: 8px;
    }
    .menu-toggle i {
      font-size: 2rem;
      color: var(--site-text);
    }
    @media (max-width: 860px) {
      .bar {
        height: 60px;
        padding: 0 16px;
        justify-content: space-between;
      }
      .bar .nav {
        display: none;
        position: absolute;
        top: 60px;
        left: 0;
        width: 100%;
        background: var(--D);
        flex-direction: column;
        padding: 16px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
      }
      .bar .nav.show {
        display: flex;
      }
      .menu-toggle {
        display: block;
      }
      .bar .contact-info,
      .bar .cta-btn {
        display: none;
      }
      .bar .logo {
        margin-right: auto;
      }
    }

/* --- from about-us.html --- */
.aboutPage {
      background: var(--color-bg);
      color: var(--color-text);
    }

    .aboutPage *,
    .aboutPage *::before,
    .aboutPage *::after {
      box-sizing: border-box;
    }

    .band {
      width: 100%;
      margin: 0;
      border: 0;
      padding: 56px 0;
    }

    .bandWrap {
      max-width: 1160px;
      margin: 0 auto;
      padding: 0 32px;
    }

    .bandA {
      background: var(--color-text);
      color: var(--color-on-primary);
    }

    .bandB {
      background: var(--color-bg);
      color: var(--color-text);
    }

    .bandC {
      background: var(--color-secondary);
      color: var(--color-on-secondary);
    }

    .bandD {
      background: var(--color-surface);
      color: var(--color-text);
    }

    .heroBand {
      min-height: 480px;
      display: flex;
      align-items: center;
      padding: 72px 0;
    }

    .splitLayout {
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 56px;
      align-items: center;
    }

    .heroCopy h1 {
      max-width: 620px;
      margin: 14px 0 18px;
      font-size: clamp(2.5rem, 6vw, 5rem);
      font-weight: 700;
      letter-spacing: -0.04em;
      line-height: 1.04;
    }

    .eyebrow {
      color: var(--color-accent);
      font-size: 0.78rem;
      font-weight: 700;
      letter-spacing: 0.16em;
      text-transform: uppercase;
    }

    .heroCopy p {
      max-width: 560px;
      margin: 0;
      color: rgba(255, 255, 255, 0.82);
      font-size: 1.08rem;
      font-weight: 300;
    }

    .buttonRow {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 28px;
    }

    .pillButton {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      min-height: 46px;
      padding: 11px 21px;
      border: 1px solid transparent;
      border-radius: 999px;
      font-weight: 700;
      text-decoration: none;
      transition: transform 0.2s ease, opacity 0.2s ease;
    }

    .pillButton:hover {
      transform: translateY(-4px);
      opacity: 0.9;
    }

    .primaryButton {
      background: var(--color-primary);
      color: var(--color-on-primary);
    }

    .outlineButton {
      border-color: rgba(255, 255, 255, 0.55);
      color: var(--color-on-primary);
    }

    .heroImage {
      width: 100%;
      height: auto;
      aspect-ratio: 4 / 3;
      display: block;
      object-fit: cover;
      border-radius: 0;
      filter: saturate(0.82);
    }

    .sectionIntro {
      display: flex;
      justify-content: space-between;
      gap: 32px;
      align-items: end;
      margin-bottom: 30px;
    }

    .sectionIntro h2 {
      max-width: 620px;
      margin: 8px 0 0;
      font-size: clamp(2rem, 4vw, 3.25rem);
      font-weight: 700;
      letter-spacing: -0.03em;
      line-height: 1.1;
    }

    .sectionIntro p {
      max-width: 380px;
      margin: 0;
      color: var(--color-muted);
      font-weight: 300;
    }

    .valueGrid,
    .impactGrid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 20px;
    }

    .valueTile,
    .impactTile {
      min-height: 180px;
      padding: 22px 0;
      border-top: 2px solid currentColor;
    }

    .valueTile h3,
    .impactTile h3 {
      margin: 18px 0 8px;
      font-size: 1.2rem;
      font-weight: 700;
    }

    .valueTile p,
    .impactTile p {
      margin: 0;
      color: var(--color-muted);
      font-size: 0.96rem;
      font-weight: 300;
    }

    .iconCircle {
      width: 52px;
      height: 52px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: 2px solid var(--color-accent);
      border-radius: 50%;
      color: var(--color-accent);
    }

    .statsBand {
      padding: 34px 0;
    }

    .statsRow {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 24px;
    }

    .statItem {
      padding: 8px 18px;
      border-left: 1px solid rgba(0, 0, 0, 0.28);
    }

    .statItem:first-child {
      border-left: 0;
    }

    .statNumber {
      display: block;
      font-size: clamp(2.3rem, 5vw, 4rem);
      font-weight: 700;
      line-height: 1;
    }

    .statLabel {
      display: block;
      margin-top: 9px;
      font-size: 0.94rem;
      font-weight: 600;
    }

    .storyCopy h2 {
      margin: 8px 0 22px;
      font-size: clamp(2rem, 4vw, 3.2rem);
      font-weight: 700;
      line-height: 1.1;
    }

    .storyCopy p {
      max-width: 600px;
      margin: 0 0 18px;
      color: var(--color-muted);
      font-weight: 300;
    }

    .storyNote {
      margin-top: 24px;
      padding-left: 18px;
      border-left: 3px solid var(--color-secondary);
      color: var(--color-text);
      font-weight: 600;
    }

    .branchImage {
      width: 100%;
      height: auto;
      display: block;
      object-fit: cover;
      border-radius: 24px;
    }

    .impactTile {
      padding-right: 10px;
    }

    .impactTile p {
      color: var(--color-on-primary);
      opacity: 0.82;
    }

    .impactTile h3 {
      color: var(--color-on-primary);
    }

    .leadershipIntro {
      max-width: 700px;
      margin-bottom: 28px;
    }

    .leadershipIntro h2 {
      margin: 8px 0 12px;
      font-size: clamp(2rem, 4vw, 3.2rem);
      font-weight: 700;
      line-height: 1.1;
    }

    .leadershipIntro p {
      margin: 0;
      color: var(--color-muted);
      font-weight: 300;
    }

    .leadershipGrid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 18px;
    }

    .leaderCard {
      display: grid;
      grid-template-columns: 112px 1fr;
      gap: 20px;
      align-items: center;
      padding: 18px;
      border: 1px solid var(--color-border);
      border-radius: 24px;
      background: linear-gradient(135deg, var(--color-bg), var(--color-surface));
      transition: transform 0.2s ease;
    }

    .leaderCard:hover {
      transform: translateY(-4px);
    }

    .leaderPhoto {
      width: 112px;
      height: 112px;
      object-fit: cover;
      border-radius: 50%;
    }

    .leaderCard h3 {
      margin: 0 0 4px;
      font-size: 1.18rem;
      font-weight: 700;
    }

    .leaderRole {
      display: block;
      margin-bottom: 9px;
      color: var(--color-primary);
      font-size: 0.82rem;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
    }

    .leaderCard p {
      margin: 0;
      color: var(--color-muted);
      font-size: 0.9rem;
      font-weight: 300;
    }

    .contactBand {
      padding: 48px 0;
    }

    .contactLayout {
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 56px;
      align-items: start;
    }

    .contactBand h2 {
      margin: 8px 0 14px;
      font-size: clamp(2rem, 4vw, 3rem);
      font-weight: 700;
      line-height: 1.1;
    }

    .contactBand p {
      max-width: 520px;
      margin: 0 0 20px;
      font-weight: 300;
    }

    .contactList {
      display: grid;
      gap: 12px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .contactList li {
      display: flex;
      gap: 12px;
      align-items: center;
      font-weight: 600;
    }

    .contactList i {
      font-size: 1.25rem;
    }

    .hoursTable {
      width: 100%;
      border-collapse: collapse;
      font-size: 0.94rem;
    }

    .hoursTable caption {
      margin-bottom: 12px;
      text-align: left;
      font-size: 1.1rem;
      font-weight: 700;
    }

    .hoursTable td {
      padding: 10px 0;
      border-bottom: 1px solid rgba(0, 0, 0, 0.26);
    }

    .hoursTable td:last-child {
      text-align: right;
      font-weight: 700;
    }

    @media (max-width: 860px) {
      .band {
        padding: 40px 0;
      }

      .bandWrap {
        padding: 0 20px;
      }

      .heroBand {
        min-height: 0;
        padding: 52px 0;
      }

      .splitLayout,
      .contactLayout {
        grid-template-columns: 1fr;
        gap: 28px;
      }

      .heroImage {
        max-width: 680px;
      }

      .sectionIntro {
        display: block;
        margin-bottom: 20px;
      }

      .sectionIntro p {
        margin-top: 14px;
      }

      .valueGrid,
      .impactGrid {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
      }

      .statsRow {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px 10px;
      }

      .statItem:nth-child(3) {
        border-left: 0;
      }

      .leadershipGrid {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 520px) {
      .heroCopy h1 {
        font-size: 2.55rem;
      }

      .valueGrid,
      .impactGrid,
      .statsRow {
        grid-template-columns: 1fr;
      }

      .statItem,
      .statItem:nth-child(3) {
        border-left: 0;
        border-top: 1px solid rgba(0, 0, 0, 0.28);
        padding: 16px 0 0;
      }

      .statItem:first-child {
        border-top: 0;
        padding-top: 0;
      }

      .leaderCard {
        grid-template-columns: 80px 1fr;
        gap: 14px;
        padding: 14px;
      }

      .leaderPhoto {
        width: 80px;
        height: 80px;
      }

      .buttonRow {
        align-items: stretch;
        flex-direction: column;
      }

      .pillButton {
        justify-content: center;
      }
    }

/* --- from about-us.html --- */
.site-footer .wrap {
      max-width: 1160px;
      margin: 0 auto;
      padding: 0 32px;
    }
    .footer-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 40px;
      margin-bottom: 32px;
    }
    .footer-col h4 {
      font-weight: 700;
      margin-bottom: 16px;
      font-size: 1.1rem;
      color: #fff;
    }
    .footer-col ul {
      list-style: none;
    }
    .footer-col li {
      margin-bottom: 8px;
    }
    .footer-col a {
      color: rgba(255,255,255,0.85);
      text-decoration: none;
      font-weight: 300;
    }
    .footer-col a:hover {
      text-decoration: underline;
    }
    .footer-col p {
      color: rgba(255,255,255,0.8);
      font-weight: 300;
      line-height: 1.8;
    }
    .footer-bottom {
      border-top: 1px solid rgba(255,255,255,0.2);
      padding-top: 24px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      font-size: 0.9rem;
      color: rgba(255,255,255,0.7);
    }
    .footer-bottom a {
      color: rgba(255,255,255,0.7);
      text-decoration: none;
    }
    .footer-bottom a:hover {
      color: #fff;
    }
    @media (max-width: 860px) {
      .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px;
      }
    }
    @media (max-width: 480px) {
      .footer-grid {
        grid-template-columns: 1fr;
      }
      .footer-bottom {
        flex-direction: column;
        gap: 8px;
        text-align: center;
      }
    }

    /* Cookie Banner */
    .cookie-banner {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      background: var(--D);
      color: var(--site-text);
      padding: 16px 32px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: 16px;
      box-shadow: 0 -2px 12px rgba(0,0,0,0.1);
      z-index: 1000;
      font-size: 0.95rem;
      border-top: 1px solid var(--site-border);
    }
    .cookie-banner button {
      background: var(--site-primary);
      color: var(--site-on-primary);
      border: none;
      padding: 10px 24px;
      border-radius: 100px;
      cursor: pointer;
      font-weight: 600;
      font-family: inherit;
    }
    .cookie-banner.hidden {
      display: none;
    }

/* --- from financial-planning.html --- */
.financialPlanningPage {
      background: var(--color-bg);
      color: var(--color-text);
      font-family: 'Lora', Georgia, serif;
    }

    .band {
      border: 0;
      margin: 0;
      padding: 3.5rem 0;
      width: 100%;
    }

    .bandWrap {
      margin: 0 auto;
      max-width: 1160px;
      padding: 0 2rem;
    }

    .bandA {
      background: var(--color-text);
      color: var(--color-bg);
    }

    .bandB {
      background: var(--color-bg);
      color: var(--color-text);
    }

    .bandC {
      background: var(--color-secondary);
      color: var(--color-on-secondary);
    }

    .bandD {
      background: var(--color-surface);
      color: var(--color-text);
    }

    .heroBand {
      min-height: 30rem;
      padding: 4.5rem 0;
    }

    .splitLayout {
      align-items: center;
      display: grid;
      gap: 3.5rem;
      grid-template-columns: 1.1fr 0.9fr;
    }

    .heroCopy {
      max-width: 37rem;
    }

    .eyebrow {
      color: var(--color-accent);
      font-size: 0.78rem;
      font-weight: 700;
      letter-spacing: 0.14em;
      margin: 0 0 1rem;
      text-transform: uppercase;
    }

    .bandC .eyebrow {
      color: var(--color-on-secondary);
      opacity: 0.7;
    }

    h1,
    h2,
    h3 {
      font-weight: 700;
      line-height: 1.15;
      margin: 0;
    }

    h1 {
      font-size: clamp(2.5rem, 5vw, 4.8rem);
      letter-spacing: -0.04em;
    }

    h2 {
      font-size: clamp(2rem, 3.5vw, 3rem);
      letter-spacing: -0.025em;
    }

    h3 {
      font-size: 1.3rem;
    }

    p {
      font-weight: 300;
    }

    .heroCopy > p {
      font-size: 1.12rem;
      line-height: 1.8;
      margin: 1.5rem 0 0;
      max-width: 34rem;
    }

    .heroActions {
      align-items: center;
      display: flex;
      flex-wrap: wrap;
      gap: 0.8rem;
      margin-top: 2rem;
    }

    .primaryButton,
    .secondaryButton {
      border: 2px solid transparent;
      border-radius: 999px;
      display: inline-flex;
      font-size: 0.95rem;
      font-weight: 700;
      padding: 0.8rem 1.35rem;
      text-decoration: none;
      transition: transform 0.2s ease, opacity 0.2s ease;
    }

    .primaryButton {
      background: var(--color-primary);
      color: var(--color-on-primary);
    }

    .secondaryButton {
      background: transparent;
      border-color: var(--color-accent);
      color: var(--color-bg);
    }

    .primaryButton:hover,
    .secondaryButton:hover {
      transform: translateY(-4px);
    }

    .heroImage {
      display: block;
      height: auto;
      object-fit: cover;
      width: 100%;
    }

    .sectionIntro {
      align-items: end;
      display: flex;
      gap: 2rem;
      justify-content: space-between;
      margin-bottom: 2rem;
    }

    .sectionIntro p {
      color: var(--color-muted);
      line-height: 1.7;
      margin: 0;
      max-width: 28rem;
    }

    .serviceGrid {
      display: grid;
      gap: 2.5rem;
      grid-auto-rows: minmax(11rem, auto);
      grid-template-columns: repeat(3, 1fr);
    }

    .serviceTile {
      border-top: 2px solid currentColor;
      padding: 1.25rem 0 0;
      transition: transform 0.2s ease;
    }

    .serviceTile:hover {
      transform: translateY(-4px);
    }

    .iconCircle {
      align-items: center;
      border: 2px solid var(--color-accent);
      border-radius: 50%;
      display: inline-flex;
      height: 3rem;
      justify-content: center;
      margin-bottom: 1rem;
      width: 3rem;
    }

    .serviceTile p {
      color: var(--color-muted);
      line-height: 1.65;
      margin: 0.65rem 0 0;
    }

    .statsBand {
      padding: 2.75rem 0;
    }

    .statsRow {
      display: grid;
      gap: 1.5rem;
      grid-template-columns: repeat(4, 1fr);
    }

    .statItem {
      border-left: 1px solid currentColor;
      padding-left: 1.25rem;
    }

    .statNumber {
      display: block;
      font-size: clamp(2rem, 4vw, 3.2rem);
      font-weight: 700;
      line-height: 1;
    }

    .statLabel {
      display: block;
      font-size: 0.95rem;
      line-height: 1.45;
      margin-top: 0.6rem;
    }

    .storyLayout {
      align-items: start;
      display: grid;
      gap: 3.5rem;
      grid-template-columns: 1.1fr 0.9fr;
    }

    .storyCopy p {
      color: var(--color-muted);
      font-size: 1.05rem;
      line-height: 1.8;
      margin: 1rem 0 0;
      max-width: 40rem;
    }

    .storyCopy p:first-of-type {
      margin-top: 1.5rem;
    }

    .storyImage {
      display: block;
      height: auto;
      object-fit: cover;
      width: 100%;
    }

    .teamGrid {
      display: grid;
      gap: 2rem;
      grid-template-columns: repeat(2, 1fr);
      margin-top: 2rem;
    }

    .teamProfile {
      background: linear-gradient(135deg, rgba(117, 130, 90, 0.16), rgba(15, 17, 24, 0.2));
      border: 1px solid rgba(117, 130, 90, 0.55);
      border-radius: 24px;
      display: grid;
      gap: 1.25rem;
      grid-template-columns: 7rem 1fr;
      padding: 1.25rem;
      transition: transform 0.2s ease;
    }

    .teamProfile:hover {
      transform: translateY(-4px);
    }

    .teamPhoto {
      border-radius: 50%;
      height: 7rem;
      object-fit: cover;
      width: 7rem;
    }

    .teamProfile h3 {
      color: var(--color-bg);
    }

    .teamRole {
      color: var(--color-accent);
      font-size: 0.86rem;
      font-weight: 700;
      margin: 0.3rem 0 0;
    }

    .teamProfile p {
      color: var(--color-muted);
      font-size: 0.92rem;
      line-height: 1.6;
      margin: 0.7rem 0 0;
    }

    .quoteGrid {
      display: grid;
      gap: 3rem;
      grid-template-columns: repeat(2, 1fr);
    }

    .quoteBlock {
      position: relative;
    }

    .quoteMark {
      color: var(--color-accent);
      display: block;
      font-size: 4rem;
      font-weight: 700;
      height: 2.5rem;
      line-height: 1;
    }

    blockquote {
      font-size: 1.18rem;
      line-height: 1.75;
      margin: 0;
    }

    .quoteAttribution {
      color: var(--color-muted);
      font-size: 0.9rem;
      margin-top: 1rem;
    }

    .planningTable {
      border-collapse: collapse;
      margin-top: 1.75rem;
      width: 100%;
    }

    .planningTable th,
    .planningTable td {
      border-bottom: 1px solid var(--color-border);
      padding: 1rem 0.8rem;
      text-align: left;
      vertical-align: top;
    }

    .planningTable th {
      color: var(--color-muted);
      font-size: 0.8rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .planningTable td {
      font-weight: 300;
    }

    .planningTable td:first-child {
      font-weight: 700;
    }

    .contactLayout {
      align-items: start;
      display: grid;
      gap: 3.5rem;
      grid-template-columns: 1.1fr 0.9fr;
    }

    .contactDetails p {
      line-height: 1.7;
      margin: 1rem 0 0;
    }

    .contactList {
      list-style: none;
      margin: 1.5rem 0 0;
      padding: 0;
    }

    .contactList li {
      align-items: center;
      display: flex;
      gap: 0.75rem;
      margin-top: 0.9rem;
    }

    .contactList i {
      font-size: 1.35rem;
    }

    .hoursTable {
      border-collapse: collapse;
      width: 100%;
    }

    .hoursTable td {
      border-bottom: 1px solid rgba(0, 0, 0, 0.25);
      padding: 0.7rem 0;
    }

    .hoursTable td:last-child {
      text-align: right;
    }

    .contactButton {
      background: var(--color-text);
      color: var(--color-bg);
      margin-top: 1.5rem;
    }

    @media (max-width: 860px) {
      .band {
        padding: 3.5rem 0;
      }

      .bandWrap {
        padding: 0 1.25rem;
      }

      .heroBand {
        min-height: 0;
        padding: 3.75rem 0;
      }

      .splitLayout,
      .storyLayout,
      .contactLayout {
        grid-template-columns: 1fr;
      }

      .heroImage {
        margin-top: 0.5rem;
      }

      .sectionIntro {
        align-items: start;
        flex-direction: column;
        gap: 1rem;
      }

      .serviceGrid,
      .statsRow {
        grid-template-columns: 1fr;
      }

      .statsRow {
        gap: 1.5rem;
      }

      .teamGrid,
      .quoteGrid {
        grid-template-columns: 1fr;
      }

      .planningTable {
        font-size: 0.88rem;
      }

      .planningTable th,
      .planningTable td {
        padding: 0.8rem 0.35rem;
      }
    }

    @media (max-width: 520px) {
      .teamProfile {
        grid-template-columns: 1fr;
      }

      .teamPhoto {
        height: 6rem;
        width: 6rem;
      }
    }

/* --- from loans-mortgages.html --- */
main {
      background: var(--color-bg);
      color: var(--color-text);
      font-family: "Lora", Georgia, serif;
      line-height: 1.6;
    }

    main *,
    main *::before,
    main *::after {
      box-sizing: border-box;
    }

    .band {
      width: 100%;
      margin: 0;
      border: 0;
      padding: 64px 0;
    }

    .band > .wrap {
      max-width: 1160px;
      margin: 0 auto;
      padding: 0 32px;
    }

    .navyBand {
      background: var(--A);
      color: var(--B);
    }

    .creamBand {
      background: var(--B);
      color: var(--A);
    }

    .orangeBand {
      background: var(--C);
      color: var(--D);
    }

    .whiteBand {
      background: var(--D);
      color: var(--A);
    }

    .splitLayout {
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 56px;
      align-items: center;
    }

    .heroBand {
      min-height: 480px;
      padding: 76px 0;
    }

    .eyebrow {
      margin-bottom: 14px;
      color: var(--color-accent);
      font-size: 0.78rem;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
    }

    .heroBand h1,
    .bandHeading h2 {
      margin: 0;
      font-weight: 700;
      letter-spacing: -0.035em;
    }

    .heroBand h1 {
      max-width: 620px;
      font-size: clamp(2.65rem, 6vw, 5rem);
      line-height: 1.05;
    }

    .heroCopy {
      max-width: 580px;
      margin: 22px 0 28px;
      color: var(--B);
      font-size: 1.08rem;
      font-weight: 300;
    }

    .buttonRow {
      display: flex;
      flex-wrap: wrap;
      gap: 14px;
    }

    .pillButton {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 48px;
      padding: 11px 24px;
      border: 1px solid transparent;
      border-radius: 999px;
      font-weight: 700;
      text-decoration: none;
      transition: transform 0.2s ease, opacity 0.2s ease;
    }

    .pillButton:hover,
    .pillButton:focus-visible {
      transform: translateY(-4px);
      opacity: 0.9;
    }

    .primaryButton {
      background: var(--color-primary);
      color: var(--color-on-primary);
    }

    .lightButton {
      border-color: var(--B);
      color: var(--B);
    }

    .heroImage {
      display: block;
      width: 100%;
      height: auto;
      aspect-ratio: 4 / 3;
      object-fit: cover;
      border-radius: 0;
    }

    .bandHeading {
      max-width: 700px;
      margin-bottom: 30px;
    }

    .bandHeading h2 {
      font-size: clamp(2rem, 4vw, 3.25rem);
      line-height: 1.12;
    }

    .bandHeading p {
      max-width: 620px;
      margin: 12px 0 0;
      font-weight: 300;
    }

    .serviceGrid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 34px 40px;
    }

    .serviceTile {
      min-height: 180px;
      padding: 22px 0 0;
      border-top: 2px solid currentColor;
      transition: transform 0.2s ease;
    }

    .serviceTile:hover {
      transform: translateY(-4px);
    }

    .iconCircle {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 42px;
      height: 42px;
      margin-bottom: 16px;
      border: 2px solid var(--color-accent);
      border-radius: 50%;
      background: transparent;
      color: var(--color-accent);
      font-size: 1.25rem;
    }

    .serviceTile h3,
    .step h3,
    .contactPanel h3 {
      margin: 0 0 8px;
      font-size: 1.25rem;
      font-weight: 700;
    }

    .serviceTile p,
    .step p,
    .contactPanel p {
      margin: 0;
      font-weight: 300;
    }

    .statsBand {
      padding: 42px 0;
    }

    .statsRow {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 28px;
    }

    .statBlock {
      padding: 10px 0;
      color: var(--D);
      text-align: center;
    }

    .statNumber {
      display: block;
      margin-bottom: 4px;
      color: var(--D);
      font-size: clamp(2rem, 5vw, 3.6rem);
      font-weight: 700;
      line-height: 1;
    }

    .statLabel {
      font-size: 0.92rem;
      font-weight: 300;
    }

    .storyLayout {
      grid-template-columns: 1fr 0.9fr;
    }

    .storyText p {
      max-width: 620px;
      margin: 0 0 18px;
      font-weight: 300;
    }

    .storyText p:last-child {
      margin-bottom: 0;
    }

    .branchImage {
      display: block;
      width: 100%;
      height: auto;
      aspect-ratio: 4 / 3;
      object-fit: cover;
      border-radius: 24px;
    }

    .quoteGrid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 50px;
    }

    .quoteBlock {
      position: relative;
      padding-top: 32px;
    }

    .quoteMark {
      position: absolute;
      top: -8px;
      left: 0;
      color: var(--color-accent);
      font-size: 4.5rem;
      line-height: 1;
    }

    .quoteBlock blockquote {
      margin: 0 0 14px;
      font-size: 1.28rem;
      font-weight: 400;
    }

    .quoteBlock cite {
      color: var(--B);
      font-size: 0.9rem;
      font-style: normal;
      font-weight: 300;
    }

    .rateTable {
      width: 100%;
      border-collapse: collapse;
      font-size: 0.98rem;
    }

    .rateTable caption {
      margin-bottom: 18px;
      text-align: left;
      font-size: 1rem;
      font-weight: 300;
    }

    .rateTable th,
    .rateTable td {
      padding: 17px 14px;
      border-bottom: 1px solid var(--color-border);
      text-align: left;
    }

    .rateTable th {
      color: var(--color-muted);
      font-size: 0.78rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .rateCards {
      display: none;
    }

    .disclosure {
      margin: 18px 0 0;
      color: var(--color-muted);
      font-size: 0.86rem;
      font-weight: 300;
    }

    .processGrid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 28px;
      margin-top: 36px;
    }

    .step {
      position: relative;
      padding-top: 14px;
      border-top: 2px solid currentColor;
    }

    .stepNumber {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 38px;
      height: 38px;
      margin-bottom: 16px;
      border: 2px solid var(--color-accent);
      border-radius: 50%;
      background: transparent;
      color: var(--color-accent);
      font-weight: 700;
    }

    .contactLayout {
      align-items: start;
    }

    .contactPanel {
      padding: 24px;
      border-radius: 24px;
      background: linear-gradient(135deg, rgba(255,255,255,0.12), rgba(0,0,0,0.08));
      color: var(--D);
    }

    .contactPanel h2 {
      margin: 0 0 18px;
      font-size: 2rem;
      font-weight: 700;
    }

    .contactList {
      display: grid;
      gap: 14px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .contactList li {
      display: flex;
      gap: 12px;
      align-items: flex-start;
      font-weight: 300;
    }

    .contactList i {
      flex: 0 0 auto;
      margin-top: 4px;
      color: var(--color-accent);
      font-size: 1.2rem;
    }

    .hoursTable {
      width: 100%;
      border-collapse: collapse;
      color: var(--D);
    }

    .hoursTable th,
    .hoursTable td {
      padding: 12px 0;
      border-bottom: 1px solid rgba(255,255,255,0.35);
      text-align: left;
      font-weight: 300;
    }

    .hoursTable th {
      font-weight: 700;
    }

    @media (max-width: 860px) {
      .band {
        padding: 56px 0;
      }

      .band > .wrap {
        padding: 0 20px;
      }

      .heroBand {
        min-height: 0;
        padding: 56px 0;
      }

      .splitLayout,
      .storyLayout {
        grid-template-columns: 1fr;
        gap: 32px;
      }

      .heroBand .buttonRow {
        display: grid;
        grid-template-columns: 1fr;
      }

      .pillButton {
        width: 100%;
      }

      .serviceGrid,
      .statsRow,
      .quoteGrid,
      .processGrid {
        grid-template-columns: 1fr;
      }

      .serviceTile {
        min-height: 0;
      }

      .statsRow {
        gap: 22px;
      }

      .statBlock {
        display: flex;
        align-items: baseline;
        justify-content: center;
        gap: 12px;
        text-align: left;
      }

      .statNumber {
        margin: 0;
      }

      .quoteGrid {
        gap: 34px;
      }

      .rateTable {
        display: none;
      }

      .rateCards {
        display: grid;
        gap: 14px;
      }

      .rateCard {
        padding: 20px;
        border: 1px solid var(--color-border);
        border-radius: 24px;
        background: linear-gradient(135deg, var(--color-bg), var(--color-surface));
        color: var(--color-text);
        transition: transform 0.2s ease;
      }

      .rateCard:hover {
        transform: translateY(-4px);
      }

      .rateCard h3 {
        margin: 0 0 12px;
        font-size: 1.2rem;
      }

      .rateDetails {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
      }

      .rateDetails span {
        display: block;
        color: var(--color-muted);
        font-size: 0.78rem;
      }

      .rateDetails strong {
        display: block;
        color: var(--color-text);
        font-size: 1.05rem;
      }

      .contactLayout {
        gap: 24px;
      }
    }

/* --- from personal-banking.html --- */
.personalBankingPage {
      background: var(--color-bg);
      color: var(--color-text);
    }

    .personalBankingPage *,
    .personalBankingPage *::before,
    .personalBankingPage *::after {
      box-sizing: border-box;
    }

    .band {
      width: 100%;
      margin: 0;
      border: 0;
      padding: 88px 0;
    }

    .band > .wrap {
      max-width: 1160px;
      margin: 0 auto;
      padding: 0 32px;
    }

    .bandA {
      background: var(--color-text);
      color: var(--color-bg);
    }

    .bandB {
      background: var(--color-bg);
      color: var(--color-text);
    }

    .bandC {
      background: var(--color-secondary);
      color: var(--color-on-secondary);
    }

    .bandD {
      background: var(--D);
      color: var(--color-text);
    }

    .split {
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 56px;
      align-items: start;
    }

    .hero {
      min-height: 480px;
      display: flex;
      align-items: center;
    }

    .eyebrow {
      margin-bottom: 18px;
      color: var(--color-accent);
      font-size: 0.78rem;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
    }

    .hero h1 {
      max-width: 650px;
      margin: 0 0 22px;
      font-size: clamp(2.5rem, 6vw, 5.2rem);
      font-weight: 700;
      line-height: 1.05;
      letter-spacing: -0.04em;
    }

    .heroCopy {
      max-width: 590px;
      margin-bottom: 30px;
      color: var(--color-muted);
      font-size: 1.08rem;
      font-weight: 300;
    }

    .heroCopy strong {
      color: var(--color-bg);
      font-weight: 600;
    }

    .buttonRow {
      display: flex;
      flex-wrap: wrap;
      gap: 14px;
    }

    .pillButton {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      min-height: 46px;
      padding: 11px 22px;
      border: 1px solid transparent;
      border-radius: 999px;
      font-weight: 700;
      text-decoration: none;
      transition: transform 0.2s ease, opacity 0.2s ease;
    }

    .pillButton:hover {
      transform: translateY(-4px);
      opacity: 0.9;
    }

    .primaryButton {
      background: var(--color-primary);
      color: var(--color-on-primary);
    }

    .outlineButton {
      border-color: var(--color-accent);
      color: var(--color-bg);
    }

    .heroImage {
      width: 100%;
      height: auto;
      aspect-ratio: 4 / 3;
      border-radius: 0;
      object-fit: cover;
    }

    .sectionHeading {
      max-width: 680px;
      margin-bottom: 42px;
    }

    .sectionHeading h2 {
      margin: 0 0 12px;
      font-size: clamp(2rem, 4vw, 3.15rem);
      font-weight: 700;
      line-height: 1.12;
      letter-spacing: -0.03em;
    }

    .sectionHeading p {
      max-width: 600px;
      margin: 0;
      color: var(--color-muted);
      font-weight: 300;
    }

    .grid3 {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 40px;
      grid-auto-rows: minmax(180px, auto);
    }

    .accountTile {
      height: auto;
      padding: 25px 0 8px;
      border-top: 2px solid currentColor;
      border-radius: 24px;
      transition: transform 0.2s ease;
    }

    .accountTile:hover {
      transform: translateY(-4px);
    }

    .iconCircle {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 48px;
      height: 48px;
      margin-bottom: 18px;
      border: 2px solid var(--color-primary);
      border-radius: 50%;
      background: transparent;
      color: var(--color-primary);
      font-size: 1.45rem;
    }

    .accountTile h3,
    .savingsTile h3 {
      margin: 0 0 9px;
      font-size: 1.35rem;
      font-weight: 700;
    }

    .accountTile p,
    .savingsTile p {
      margin: 0 0 13px;
      color: var(--color-muted);
      font-size: 0.96rem;
      font-weight: 300;
    }

    .featureList {
      padding: 0;
      margin: 0;
      list-style: none;
      color: var(--color-muted);
      font-size: 0.91rem;
      font-weight: 300;
    }

    .featureList li {
      padding: 5px 0;
    }

    .featureList li::before {
      margin-right: 8px;
      color: var(--color-accent);
      content: "✓";
      font-weight: 700;
    }

    .statsBand {
      padding: 56px 0;
    }

    .statsRow {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 26px;
    }

    .statItem {
      height: auto;
      padding-left: 18px;
      border-left: 1px solid currentColor;
    }

    .statNumber {
      display: block;
      margin-bottom: 4px;
      font-size: clamp(2rem, 4vw, 3.4rem);
      font-weight: 700;
      line-height: 1;
    }

    .statLabel {
      font-size: 0.93rem;
      font-weight: 400;
    }

    .storyCopy {
      max-width: 620px;
    }

    .storyCopy h2 {
      margin: 0 0 19px;
      font-size: clamp(2rem, 4vw, 3.2rem);
      font-weight: 700;
      line-height: 1.12;
    }

    .storyCopy p {
      margin: 0 0 18px;
      color: var(--color-muted);
      font-weight: 300;
    }

    .storyCopy p:last-child {
      margin-bottom: 0;
    }

    .branchImage {
      width: 100%;
      height: auto;
      aspect-ratio: 4 / 3;
      object-fit: cover;
    }

    .quoteGrid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 56px;
    }

    .quote {
      height: auto;
      position: relative;
      padding: 12px 0 0 42px;
    }

    .quote::before {
      position: absolute;
      top: -18px;
      left: 0;
      color: var(--color-accent);
      content: "“";
      font-size: 5rem;
      font-weight: 700;
      line-height: 1;
    }

    .quote p {
      margin: 0 0 19px;
      color: var(--color-muted);
      font-size: 1.15rem;
      font-weight: 300;
    }

    .quote cite {
      color: var(--color-bg);
      font-size: 0.9rem;
      font-style: normal;
      font-weight: 700;
    }

    .tableWrap {
      overflow-x: auto;
    }

    .accountTable {
      width: 100%;
      min-width: 680px;
      border-collapse: collapse;
      font-size: 0.95rem;
    }

    .accountTable caption {
      margin-bottom: 24px;
      text-align: left;
      font-size: clamp(2rem, 4vw, 3rem);
      font-weight: 700;
    }

    .accountTable th,
    .accountTable td {
      padding: 17px 14px;
      border-bottom: 1px solid var(--color-border);
      text-align: left;
      vertical-align: middle;
    }

    .accountTable thead th {
      border-bottom: 2px solid var(--color-primary);
      color: var(--color-primary);
      font-weight: 700;
    }

    .accountTable th:first-child,
    .accountTable td:first-child {
      position: sticky;
      left: 0;
      background: var(--D);
      font-weight: 700;
    }

    .checkMark {
      color: var(--color-success);
      font-size: 1.25rem;
      font-weight: 700;
    }

    .contactSplit {
      grid-template-columns: 1.1fr 0.9fr;
    }

    .contactBlock h2 {
      margin: 0 0 14px;
      font-size: clamp(2rem, 4vw, 3rem);
      font-weight: 700;
      line-height: 1.12;
    }

    .contactBlock > p {
      max-width: 520px;
      margin: 0 0 24px;
      font-weight: 300;
    }

    .contactDetails,
    .hoursTable {
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .contactDetails li {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      padding: 9px 0;
      font-weight: 400;
    }

    .contactDetails i {
      min-width: 22px;
      margin-top: 4px;
      font-size: 1.2rem;
    }

    .hoursTable {
      border-top: 1px solid currentColor;
    }

    .hoursTable li {
      display: flex;
      justify-content: space-between;
      gap: 20px;
      padding: 13px 0;
      border-bottom: 1px solid currentColor;
      font-size: 0.94rem;
    }

    .hoursTable span:last-child {
      font-weight: 700;
      text-align: right;
    }

    @media (max-width: 860px) {
      .band {
        padding: 56px 0;
      }

      .band > .wrap {
        padding: 0 20px;
      }

      .split,
      .contactSplit,
      .quoteGrid {
        grid-template-columns: 1fr;
        gap: 34px;
      }

      .grid3 {
        grid-template-columns: 1fr;
        gap: 25px;
      }

      .hero {
        min-height: 0;
      }

      .hero h1 {
        font-size: clamp(2.5rem, 12vw, 4rem);
      }

      .heroImage {
        margin-top: 6px;
      }

      .statsBand {
        padding: 42px 0;
      }

      .statsRow {
        grid-template-columns: repeat(2, 1fr);
        gap: 28px 18px;
      }

      .statItem {
        padding-left: 13px;
      }
    }

    @media (max-width: 480px) {
      .statsRow {
        grid-template-columns: 1fr;
      }

      .buttonRow {
        align-items: stretch;
        flex-direction: column;
      }

      .pillButton {
        justify-content: center;
      }
    }

/* --- from privacy-policy.html --- */
.privacyPage {
      background: var(--color-bg);
      color: var(--color-text);
      font-family: "Lora", Georgia, serif;
    }

    .privacyPage * {
      box-sizing: border-box;
    }

    .band {
      width: 100%;
      margin: 0;
      border: 0;
      padding: 24px 0;
    }

    .band > .wrap {
      width: min(1160px, calc(100% - 48px));
      margin: 0 auto;
    }

    .bandA {
      background: var(--A);
      color: var(--B);
    }

    .bandB {
      background: var(--color-bg);
      color: var(--color-text);
    }

    .bandC {
      background: var(--color-secondary);
      color: var(--color-on-secondary);
    }

    .hero {
      min-height: 480px;
      padding: 48px 0;
      display: flex;
      align-items: center;
    }

    .split {
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 48px;
      align-items: start;
    }

    .heroCopy {
      align-self: center;
    }

    .eyebrow {
      margin-bottom: 12px;
      color: var(--color-accent);
      font-size: 0.8rem;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
    }

    .hero h1,
    .sectionHeading,
    .contactHeading {
      margin: 0;
      font-weight: 700;
      line-height: 1.08;
    }

    .hero h1 {
      max-width: 620px;
      font-size: clamp(2.5rem, 6vw, 5rem);
    }

    .heroLead {
      max-width: 620px;
      margin: 20px 0 24px;
      color: var(--color-muted);
      font-size: 1.08rem;
      font-weight: 300;
    }

    .hero .heroLead {
      color: var(--B);
      opacity: 0.86;
    }

    .buttonRow {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
    }

    .pillButton {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      min-height: 44px;
      padding: 10px 20px;
      border: 1px solid transparent;
      border-radius: 999px;
      font-weight: 600;
      text-decoration: none;
      transition: transform 0.2s ease, opacity 0.2s ease;
    }

    .pillButton:hover {
      transform: translateY(-4px);
      opacity: 0.9;
    }

    .primaryButton {
      background: var(--color-primary);
      color: var(--color-on-primary);
    }

    .outlineButton {
      border-color: var(--color-accent);
      color: var(--B);
    }

    .heroImage {
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: cover;
      border-radius: 0;
    }

    .sectionHeading {
      margin-bottom: 8px;
      font-size: clamp(1.8rem, 3vw, 2.8rem);
    }

    .sectionIntro {
      max-width: 720px;
      margin: 0 0 20px;
      color: var(--color-muted);
      font-weight: 300;
    }

    .grid3 {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 28px;
    }

    .serviceTile {
      min-height: 180px;
      padding: 18px 0;
      border-top: 2px solid currentColor;
    }

    .serviceTile h3,
    .quote h3 {
      margin: 12px 0 8px;
      font-size: 1.2rem;
      font-weight: 700;
    }

    .serviceTile p,
    .quote p,
    .story p,
    .contactPanel p {
      margin: 0;
      font-weight: 300;
    }

    .iconCircle {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 44px;
      height: 44px;
      border: 2px solid var(--color-primary);
      border-radius: 50%;
      background: transparent;
      color: var(--color-primary);
      font-size: 1.3rem;
    }

    .statsBand {
      padding: 28px 0;
    }

    .statsRow {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 20px;
    }

    .stat {
      padding: 8px 0;
      text-align: center;
    }

    .stat strong {
      display: block;
      font-size: clamp(2rem, 5vw, 3.5rem);
      font-weight: 700;
      line-height: 1;
    }

    .stat span {
      display: block;
      margin-top: 8px;
      font-size: 0.92rem;
      font-weight: 500;
    }

    .story {
      max-width: 680px;
    }

    .story p + p {
      margin-top: 16px;
    }

    .storyImage {
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: cover;
      border-radius: 24px;
    }

    .quoteGrid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 44px;
    }

    .quote {
      position: relative;
      padding: 8px 0 8px 44px;
    }

    .quote::before {
      position: absolute;
      top: -18px;
      left: 0;
      color: var(--color-accent);
      content: "\201C";
      font-size: 5rem;
      line-height: 1;
    }

    .quote p {
      font-size: 1.1rem;
    }

    .quote cite {
      display: block;
      margin-top: 16px;
      color: var(--color-accent);
      font-size: 0.9rem;
      font-style: normal;
      font-weight: 600;
    }

    .tableWrap {
      overflow-x: auto;
    }

    .privacyTable {
      width: 100%;
      border-collapse: collapse;
      font-size: 0.94rem;
    }

    .privacyTable th,
    .privacyTable td {
      padding: 14px 16px;
      border-bottom: 1px solid var(--color-border);
      text-align: left;
      vertical-align: top;
    }

    .privacyTable th {
      color: var(--color-primary);
      font-weight: 700;
    }

    .contactHeading {
      margin-bottom: 12px;
      font-size: clamp(1.8rem, 3vw, 2.6rem);
    }

    .contactList {
      display: grid;
      gap: 12px;
      margin: 18px 0 0;
      padding: 0;
      list-style: none;
    }

    .contactList li {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      font-weight: 300;
    }

    .contactList i {
      flex: 0 0 auto;
      margin-top: 3px;
      font-size: 1.25rem;
    }

    .hoursTable {
      width: 100%;
      border-collapse: collapse;
    }

    .hoursTable td {
      padding: 10px 0;
      border-bottom: 1px solid rgba(0, 0, 0, 0.28);
      font-weight: 300;
    }

    .hoursTable td:last-child {
      text-align: right;
      font-weight: 600;
    }

    @media (max-width: 860px) {
      .band {
        padding: 24px 0;
      }

      .band > .wrap {
        width: min(100% - 32px, 680px);
      }

      .hero {
        min-height: 0;
        padding: 40px 0;
      }

      .split,
      .grid3,
      .quoteGrid,
      .statsRow {
        grid-template-columns: 1fr;
      }

      .heroImage,
      .storyImage {
        border-radius: 24px;
      }

      .statsRow {
        gap: 12px;
      }

      .stat {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        border-bottom: 1px solid rgba(0, 0, 0, 0.24);
        text-align: left;
      }

      .stat strong {
        font-size: 2.4rem;
      }

      .stat span {
        margin-top: 0;
      }

      .privacyTable {
        min-width: 620px;
      }
    }

/* --- from terms-and-conditions.html --- */
.termsPage {
      background: var(--color-bg);
      color: var(--color-text);
      font-family: "Lora", Georgia, serif;
    }

    .band {
      width: 100%;
      margin: 0;
      border: 0;
      padding: 32px 0;
    }

    .band > .wrap {
      width: min(1160px, 100%);
      margin: 0 auto;
      padding: 0 32px;
    }

    .band.a {
      background: var(--A);
      color: var(--B);
    }

    .band.b {
      background: var(--B);
      color: var(--color-text);
    }

    .band.c {
      background: var(--C);
      color: var(--color-on-secondary);
    }

    .band.d {
      background: var(--D);
      color: var(--color-text);
    }

    .hero {
      min-height: 480px;
      display: flex;
      align-items: center;
      padding: 56px 0;
    }

    .split {
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 56px;
      align-items: start;
    }

    .heroCopy {
      align-self: center;
      max-width: 620px;
    }

    .eyebrow {
      margin-bottom: 16px;
      color: var(--color-secondary);
      font-size: 0.78rem;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
    }

    .hero h1 {
      max-width: 600px;
      margin: 0 0 18px;
      color: var(--B);
      font-size: clamp(2.5rem, 6vw, 5rem);
      font-weight: 700;
      line-height: 1.04;
    }

    .heroIntro {
      max-width: 570px;
      margin: 0 0 24px;
      color: var(--B);
      font-size: 1.08rem;
      font-weight: 300;
      line-height: 1.75;
    }

    .buttonRow {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
    }

    .pillButton {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      border: 1px solid transparent;
      border-radius: 999px;
      padding: 12px 20px;
      color: var(--color-on-primary);
      background: var(--color-primary);
      font-weight: 700;
      text-decoration: none;
      transition: transform 0.2s ease, opacity 0.2s ease;
    }

    .pillButton:hover {
      transform: translateY(-4px);
      opacity: 0.9;
    }

    .pillButton.secondaryButton {
      border-color: var(--color-secondary);
      color: var(--color-secondary);
      background: transparent;
    }

    .heroImage {
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: cover;
      border-radius: 0;
    }

    .sectionHeading {
      max-width: 680px;
      margin-bottom: 24px;
    }

    .sectionHeading h2 {
      margin: 0 0 8px;
      font-size: clamp(1.8rem, 4vw, 2.8rem);
      font-weight: 700;
      line-height: 1.15;
    }

    .sectionHeading p {
      margin: 0;
      color: var(--color-muted);
      font-size: 1rem;
      font-weight: 300;
      line-height: 1.65;
    }

    .grid3 {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px 40px;
    }

    .legalTile {
      height: auto;
      border-top: 2px solid currentColor;
      padding: 18px 0 4px;
    }

    .legalTile h3 {
      margin: 0 0 8px;
      font-size: 1.25rem;
      font-weight: 700;
    }

    .legalTile p {
      margin: 0;
      color: var(--color-muted);
      font-size: 0.95rem;
      font-weight: 300;
      line-height: 1.65;
    }

    .iconCircle {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 42px;
      height: 42px;
      margin-bottom: 12px;
      border: 2px solid var(--color-accent);
      border-radius: 50%;
      background: transparent;
      color: var(--color-accent);
    }

    .statsBand {
      padding: 28px 0;
    }

    .statsRow {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 24px;
    }

    .statBlock {
      height: auto;
      padding: 4px 0;
    }

    .statBlock strong {
      display: block;
      margin-bottom: 4px;
      font-size: clamp(1.8rem, 4vw, 3rem);
      font-weight: 700;
      line-height: 1;
    }

    .statBlock span {
      display: block;
      font-size: 0.92rem;
      font-weight: 300;
      line-height: 1.4;
    }

    .storyCopy {
      height: auto;
    }

    .storyCopy h2 {
      margin: 0 0 16px;
      font-size: clamp(1.8rem, 4vw, 2.8rem);
      font-weight: 700;
      line-height: 1.15;
    }

    .storyCopy p {
      margin: 0 0 16px;
      color: var(--color-muted);
      font-size: 1rem;
      font-weight: 300;
      line-height: 1.75;
    }

    .storyCopy p:last-child {
      margin-bottom: 0;
    }

    .storyImage {
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: cover;
      border-radius: 0;
    }

    .questionGrid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 40px;
    }

    .questionQuote {
      height: auto;
      margin: 0;
      padding: 0;
    }

    .questionQuote::before {
      display: block;
      margin-bottom: 8px;
      color: var(--color-secondary);
      content: "\"";
      font-size: 5rem;
      font-weight: 700;
      line-height: 0.7;
    }

    .questionQuote p {
      margin: 0 0 12px;
      font-size: 1.18rem;
      font-weight: 300;
      line-height: 1.65;
    }

    .questionQuote cite {
      color: var(--color-secondary);
      font-size: 0.9rem;
      font-style: normal;
      font-weight: 700;
    }

    .tableShell {
      overflow-x: auto;
      border: 1px solid var(--color-border);
      border-radius: 24px;
      background: linear-gradient(135deg, var(--color-bg), var(--color-surface));
    }

    .termsTable {
      width: 100%;
      border-collapse: collapse;
      min-width: 620px;
    }

    .termsTable th,
    .termsTable td {
      padding: 16px 18px;
      border-bottom: 1px solid var(--color-border);
      text-align: left;
      vertical-align: top;
    }

    .termsTable th {
      color: var(--color-muted);
      font-size: 0.78rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .termsTable td {
      font-size: 0.96rem;
      font-weight: 300;
      line-height: 1.5;
    }

    .termsTable tr:last-child td {
      border-bottom: 0;
    }

    .contactGrid {
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 56px;
    }

    .contactGrid h2 {
      margin: 0 0 12px;
      font-size: clamp(1.8rem, 4vw, 2.6rem);
      font-weight: 700;
      line-height: 1.15;
    }

    .contactGrid p {
      max-width: 520px;
      margin: 0 0 18px;
      font-weight: 300;
      line-height: 1.65;
    }

    .contactList {
      display: grid;
      gap: 12px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .contactList li {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      font-weight: 300;
    }

    .contactList i {
      flex: 0 0 auto;
      margin-top: 3px;
      color: var(--color-on-secondary);
      font-size: 1.25rem;
    }

    .hoursTable {
      width: 100%;
      border-collapse: collapse;
    }

    .hoursTable th,
    .hoursTable td {
      padding: 10px 0;
      border-bottom: 1px solid rgba(0, 0, 0, 0.22);
      text-align: left;
      font-size: 0.92rem;
      font-weight: 300;
    }

    .hoursTable th {
      font-weight: 700;
    }

    @media (max-width: 860px) {
      .band {
        padding: 28px 0;
      }

      .band > .wrap {
        padding: 0 20px;
      }

      .hero {
        min-height: 0;
        padding: 44px 0;
      }

      .split,
      .contactGrid,
      .questionGrid {
        grid-template-columns: 1fr;
        gap: 28px;
      }

      .grid3 {
        grid-template-columns: 1fr;
        gap: 20px;
      }

      .statsRow {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
      }

      .hero h1 {
        font-size: clamp(2.35rem, 12vw, 4rem);
      }
    }

    @media (max-width: 480px) {
      .statsRow {
        grid-template-columns: 1fr 1fr;
      }

      .heroImage,
      .storyImage {
        aspect-ratio: 16 / 10;
      }
    }

/* --- from index.php --- */
.bankPage {
      background: var(--color-bg);
      color: var(--color-text);
      font-family: 'Lora', Georgia, serif;
    }

    .band {
      width: 100%;
      margin: 0;
      border: 0;
      padding: 88px 0;
    }

    .bandWrap {
      max-width: 1160px;
      margin: 0 auto;
      padding: 0 32px;
    }

    .bandA {
      background: var(--A);
      color: var(--B);
    }

    .bandB {
      background: var(--B);
      color: var(--A);
    }

    .bandC {
      background: var(--C);
      color: var(--site-on-secondary);
    }

    .heroLayout,
    .storyLayout {
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 56px;
      align-items: center;
      min-height: 480px;
    }

    .heroCopy h1,
    .sectionHeading {
      margin: 0 0 18px;
      font-size: clamp(2.2rem, 5vw, 4.5rem);
      font-weight: 700;
      letter-spacing: -0.04em;
      line-height: 1.08;
    }

    .sectionHeading {
      font-size: clamp(2rem, 4vw, 3.25rem);
    }

    .heroCopy p,
    .storyCopy p {
      max-width: 620px;
      margin: 0 0 14px;
      font-size: 1.08rem;
      font-weight: 300;
      line-height: 1.7;
    }

    .heroActions {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 28px;
    }

    .primaryButton,
    .secondaryButton {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 48px;
      padding: 12px 24px;
      border: 1px solid transparent;
      border-radius: 999px;
      font-weight: 600;
      text-decoration: none;
      transition: transform 0.2s ease, opacity 0.2s ease;
    }

    .primaryButton {
      background: var(--color-primary);
      color: var(--color-on-primary);
    }

    .secondaryButton {
      border-color: currentColor;
      color: inherit;
      background: transparent;
    }

    .primaryButton:hover,
    .secondaryButton:hover {
      transform: translateY(-4px);
      opacity: 0.9;
    }

    .photoFrame {
      overflow: hidden;
      aspect-ratio: 4 / 3;
      border-radius: 0;
    }

    .photoFrame img,
    .storyImage img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .sectionIntro {
      max-width: 680px;
      margin-bottom: 34px;
    }

    .sectionIntro p {
      margin: 0;
      font-size: 1.05rem;
      font-weight: 300;
      line-height: 1.7;
    }

    .serviceGrid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 40px;
      grid-auto-rows: minmax(180px, auto);
    }

    .serviceTile {
      height: auto;
      padding: 22px 0 12px;
      border-top: 2px solid currentColor;
      transition: transform 0.2s ease;
    }

    .serviceTile:hover {
      transform: translateY(-4px);
    }

    .iconCircle {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 44px;
      height: 44px;
      margin-bottom: 18px;
      border: 2px solid currentColor;
      border-radius: 50%;
      background: transparent;
      font-size: 1.35rem;
    }

    .serviceTile h3 {
      margin: 0 0 9px;
      font-size: 1.25rem;
      font-weight: 700;
    }

    .serviceTile p {
      margin: 0;
      font-size: 0.98rem;
      font-weight: 300;
      line-height: 1.6;
    }

    .statsBand {
      padding: 56px 0;
    }

    .statsGrid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 28px;
      text-align: center;
    }

    .statItem {
      height: auto;
      padding: 8px 12px;
    }

    .statItem .iconCircle {
      margin-bottom: 12px;
      font-size: 1.1rem;
    }

    .statNumber {
      display: block;
      font-size: clamp(2rem, 4vw, 3.3rem);
      font-weight: 700;
      line-height: 1.1;
    }

    .statLabel {
      display: block;
      margin-top: 8px;
      font-size: 0.96rem;
      font-weight: 300;
    }

    .storyLayout {
      align-items: start;
      min-height: 0;
    }

    .storyCopy p {
      max-width: none;
      margin-bottom: 20px;
    }

    .storyCopy p:last-child {
      margin-bottom: 0;
    }

    .storyImage {
      overflow: hidden;
      min-height: 360px;
      border-radius: 0;
    }

    .storyImage img {
      min-height: 360px;
    }

    .quoteGrid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 46px 64px;
    }

    .quoteItem {
      height: auto;
      position: relative;
      padding: 8px 0 8px 34px;
    }

    .quoteItem::before {
      content: '“';
      position: absolute;
      top: -18px;
      left: 0;
      font-size: 5rem;
      font-weight: 700;
      line-height: 1;
      opacity: 0.6;
    }

    .quoteItem blockquote {
      margin: 0 0 14px;
      font-size: 1.18rem;
      font-weight: 300;
      line-height: 1.65;
    }

    .quoteItem cite {
      font-size: 0.94rem;
      font-style: normal;
      font-weight: 600;
    }

    .ratesBand {
      background: var(--D);
      color: var(--color-text);
    }

    .ratesTableWrap {
      overflow-x: auto;
      border: 1px solid var(--color-border);
      border-radius: 24px;
      background: linear-gradient(135deg, var(--color-bg), var(--color-surface));
    }

    .ratesTable {
      width: 100%;
      min-width: 680px;
      border-collapse: collapse;
      text-align: left;
    }

    .ratesTable th,
    .ratesTable td {
      padding: 19px 22px;
      border-bottom: 1px solid var(--color-border);
      vertical-align: top;
    }

    .ratesTable th {
      color: var(--color-muted);
      font-size: 0.82rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .ratesTable td {
      font-size: 0.98rem;
      font-weight: 300;
    }

    .ratesTable tr:last-child td {
      border-bottom: 0;
    }

    .rateValue {
      color: var(--color-primary);
      font-size: 1.2rem;
      font-weight: 700;
    }

    .disclosure {
      margin: 16px 0 0;
      color: var(--color-muted);
      font-size: 0.82rem;
      font-weight: 300;
      line-height: 1.6;
    }

    .contactLayout {
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 56px;
      align-items: start;
    }

    .contactDetails {
      display: grid;
      gap: 16px;
    }

    .contactLine {
      display: flex;
      align-items: flex-start;
      gap: 14px;
      font-size: 1.05rem;
      font-weight: 300;
    }

    .contactLine .iconCircle {
      flex: 0 0 40px;
      width: 40px;
      height: 40px;
      margin: 0;
      font-size: 1.1rem;
    }

    .contactLine a {
      color: inherit;
      font-weight: 600;
      text-decoration-thickness: 1px;
      text-underline-offset: 4px;
    }

    .hoursTable {
      width: 100%;
      border-collapse: collapse;
      font-size: 1rem;
    }

    .hoursTable caption {
      margin-bottom: 14px;
      text-align: left;
      font-size: 1.3rem;
      font-weight: 700;
    }

    .hoursTable td {
      padding: 12px 0;
      border-bottom: 1px solid currentColor;
      font-weight: 300;
    }

    .hoursTable td:last-child {
      text-align: right;
      font-weight: 600;
    }

    @media (max-width: 860px) {
      .band {
        padding: 56px 0;
      }

      .bandWrap {
        padding: 0 20px;
      }

      .heroLayout,
      .storyLayout,
      .contactLayout,
      .quoteGrid {
        grid-template-columns: 1fr;
        gap: 32px;
      }

      .heroLayout {
        min-height: 0;
      }

      .heroCopy {
        order: 1;
      }

      .photoFrame {
        order: 2;
      }

      .heroActions {
        display: grid;
        grid-template-columns: 1fr;
      }

      .primaryButton,
      .secondaryButton {
        width: 100%;
      }

      .serviceGrid {
        grid-template-columns: 1fr;
        gap: 0;
      }

      .serviceTile {
        min-height: 0;
        padding: 24px 0;
      }

      .statsBand {
        padding: 56px 0;
      }

      .statsGrid {
        grid-template-columns: repeat(2, 1fr);
        gap: 28px 12px;
      }

      .storyImage,
      .storyImage img {
        min-height: 0;
      }

      .quoteGrid {
        gap: 30px;
      }

      .ratesTableWrap {
        border-radius: 24px;
      }
    }

    @media (max-width: 460px) {
      .statsGrid {
        grid-template-columns: 1fr 1fr;
      }

      .ratesTable th,
      .ratesTable td {
        padding: 15px 16px;
      }
    }
