*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
      --navy:    #1b2a4a;
      --sand:    #F6F6F4;
      --coral:   #854f3c;
      --purple:  #9a88d6;
      --mint:    #6bd1c5;
      --peach:   #e29574;
      --text:    #2c3e50;
      --muted:   #4c5f86;
      --white:   #ffffff;
        --lavender-bg: #dfd9f5;
            --lavender-mid: #8f84cf;
             --green:        #3dbf82;
    }

    body {
      font-family: 'DM Sans', sans-serif;
      background: var(--sand);
      color: var(--text);
      overflow-x: hidden;
    }

    /* ── NAVBAR ─────────────────────────────────────────── */
    .navbar {
      background: var(--sand);
      padding: 18px 0;
      border-bottom: 1px solid rgba(0,0,0,0.06);
      position: sticky;
      top: 0;
      z-index: 1000;
    }

    .navbar-brand {
      display: flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
    }

    .navbar-brand img{
      width: 250px;
      height: auto;
      display: block;
    }

    @media (max-width: 575px) {
      .navbar-brand img { width: 150px; }
    } 

    /* Logo mark – three overlapping arches */
    .logo-icon {
      width: 52px;
      height: 40px;
      position: relative;
      flex-shrink: 0;
    }
    .logo-icon span {
      position: absolute;
      width: 28px;
      height: 28px;
      border-radius: 50% 50% 0 0;
      border: 5px solid transparent;
      border-top-color: currentColor;
      border-left-color: currentColor;
      bottom: 0;
    }
    .logo-icon span:nth-child(1) { color: #f0b8a0; left: 0;   transform: rotate(-10deg); }
    .logo-icon span:nth-child(2) { color: #9b8ec4; left: 10px; transform: rotate(0deg);   }
    .logo-icon span:nth-child(3) { color: #7ecec4; left: 20px; transform: rotate(10deg);  }

    .brand-text .top    { font-family: 'DM Sans', sans-serif; font-weight: 700; font-size: 16px; letter-spacing: .08em; color: var(--navy); line-height: 1; }
    .brand-text .bottom { font-family: 'DM Sans', sans-serif; font-weight: 400; font-size: 13px; letter-spacing: .18em; color: var(--navy); line-height: 1; margin-top: 2px; }

    .navbar-nav .nav-link {
      font-size: 20px;
      font-weight: 400;
      color: var(--navy) !important;
      padding: 6px 14px !important;
      transition: color .2s;
    }
    .navbar-nav .nav-link:hover { color: var(--coral) !important; }

    .btn-quote {
      background: var(--navy);
      color: var(--white) !important;
      font-size: 14px;
      font-weight: 500;
      border: none;
      border-radius: 6px;
      padding: 12px 24px;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      transition: background .2s, transform .15s;
      white-space: nowrap;
    }
    .btn-quote:hover { background: #253560; transform: translateX(2px); }
    .btn-quote svg   { width: 16px; height: 16px; }

    /* ── home-hero wrapper ── */
    .home-hero {
      position: relative;
      min-height: 120vh;
      display: flex;
      align-items: center;
      overflow: hidden;
      background: url("../img/hero-banner.png") no-repeat center left;
      background-size: cover;
    }

    /* ── Left photo panel ── */
    .home-hero-photo {
      position: absolute;
      inset: 0 45% 0 0;
      z-index: 1;
    }
    .home-hero-photo img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
      display: block;
    }
    

    /* ── Decorative blobs ── */
    .blob {
      position: absolute;
      border-radius: 50%;
      z-index: 2;
    }
    .blob-mint {
      width: 180px; height: 180px;
      background: var(--mint);
      bottom: -30px; left: -30px;
      border-radius: 50% 50% 50% 0;
    }
    .blob-coral {
      width: 100px; height: 100px;
      background: var(--coral);
      bottom: 80px; left: 120px;
      border-radius: 50% 0 50% 50%;
    }

    /* ── Vertical label (left edge) ── */
    .vertical-label {
      position: absolute;
      left: -160px;
      top: 50%;
      transform: translateY(-50%) rotate(-90deg);
      font-size: 15px;
      font-weight: 500;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: var(--white);
      white-space: nowrap;
      z-index: 10;
      opacity: .85;
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .vertical-label span { opacity: .5; }

    /* ── Right content ── */
    .home-hero-content {
      position: relative;
      z-index: 5;
      margin-left: 50%;
      padding: 0 3vw 0 8vw;
      max-width: 680px;
    }

    /* open-quote decoration */
    .open-quote {
      font-family: 'DM Serif Display', serif;
      font-size: 90px;
      line-height: 0.6;
      color: var(--coral);
      display: block;
      margin-bottom: 10px;
      user-select: none;
    }

    .home-hero-quote {
      font-family: 'DM Serif Display', serif;
      font-style: italic;
      font-size: clamp(38px, 4.8vw, 54px);
      line-height: 1.12;
      color: var(--navy);
      position: relative;
      margin-bottom: 0;
      font-weight: 400;
    }
    /* close-quote */
    /* .home-hero-quote::after {
      content: '\201D';
      font-family: 'DM Serif Display', serif;
      font-size: 80px;
      line-height: 0;
      color: var(--coral);
      position: absolute;
      bottom: -30px;
      right: -20px;
    } */

    /* mint rule */
    .rule {
      width: 38px;
      height: 3px;
      background: var(--mint);
      border-radius: 2px;
      margin: 44px 0 20px;
    }

    /* subtext */
    .home-hero-sub {
      font-size: 22px;
      line-height: 1.6;
      color: var(--text);
      max-width: 380px;
    }
    .home-hero-sub .accent {
      color: var(--mint);
    }

    /* CTA button */
    .btn-cta {
      display: inline-flex;
      align-items: center;
      gap: 14px;
      border: 1.5px solid var(--navy);
      border-radius: 50px;
      padding: 13px 28px;
      font-family: 'DM Sans', sans-serif;
      font-size: 15px;
      font-weight: 600;
      color: var(--navy);
      background: transparent;
      text-decoration: none;
      transition: background .22s, color .22s;
      margin-top: 28px;
    }
    .btn-cta:hover {
      background: var(--navy);
      color: var(--white);
    }
    .btn-cta .arrow {
      width: 26px; height: 26px;
      border-radius: 50%;
      border: 1.5px solid currentColor;
      display: flex; align-items: center; justify-content: center;
      font-size: 13px;
    }

    /* disclaimer */
    .home-hero-disclaimer {
      font-size: 12px;
      font-style: italic;
      color: var(--muted);
      margin-top: 14px;
    }

    /* ── Responsive ── */
    @media (max-width: 900px) {
      .home-hero { flex-direction: column; min-height: auto; }
      .home-hero-photo { position: relative; inset: auto; width: 100%; height: 55vw; max-height: 380px; }
      .home-hero-photo::after { background: linear-gradient(to bottom, transparent 60%, var(--sand) 100%); }
      .home-hero-content { margin-left: 0; padding: 32px 24px 48px; max-width: 100%; background: rgba(255, 255, 255, 0.2);
border-radius: 16px;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
border: 1px solid rgba(255, 255, 255, 0.3);}
      .home-hero-quote { font-size: clamp(28px, 8vw, 44px); }
      .vertical-label { display: none; }
      .blob-mint { width: 120px; height: 120px; }
      .blob-coral { width: 70px; height: 70px; left: 80px; bottom: 60px; }
    }



    /* ── HERO ────────────────────────────────────────────── */
    .hero {
      min-height: calc(100vh - 81px);
      display: flex;
      align-items: stretch;
      background: var(--sand);
      overflow: hidden;
    }

    /* Left column */
    .hero-left {
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 80px 60px 80px 80px;
      max-width: 50%;
    }

    .eyebrow {
      font-size: 14px;
      font-weight: 600;
      letter-spacing: .2em;
      color: var(--purple);
      text-transform: uppercase;
      margin-bottom: 24px;
    }

    .hero-heading {
      font-family: 'Playfair Display', serif;
      font-weight: 400;
      font-size: clamp(40px, 5vw, 62px);
      line-height: 1.1;
      color: var(--navy);
      margin-bottom: 4px;
    }
    .hero-heading .dot { color: var(--coral); }

    .hero-body {
      font-size: 16px;
      line-height: 1.75;
      color: var(--muted);
      margin-top: 24px;
      margin-bottom: 40px;
      max-width: 85%;
      font-weight: 600;
    }

    .hero-ctas {
      display: flex;
      gap: 16px;
      flex-wrap: wrap;
    }

    .btn-primary-hero {
      background: var(--navy);
      color: var(--white);
      font-size: 14.5px;
      font-weight: 500;
      border: none;
      border-radius: 7px;
      padding: 14px 28px;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
      transition: background .2s, transform .15s;
    }
    .btn-primary-hero:hover { background: #253560; transform: translateX(3px); color: var(--white); }

    .btn-outline-hero {
      background: transparent;
      color: var(--navy);
      font-size: 14.5px;
      font-weight: 500;
      border: 1.5px solid var(--navy);
      border-radius: 7px;
      padding: 14px 28px;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
      transition: background .2s, color .2s;
    }
    .btn-outline-hero:hover { background: var(--navy); color: var(--white); }

    /* Right column */
    .hero-right {
      flex: 1;
      position: relative;
      background: #eae4dd;
      display: flex;
      align-items: flex-end;
      justify-content: center;
      min-height: 500px;
      overflow: hidden;
    }

    /* Decorative blobs */
    .blob {
      position: absolute;
      border-radius: 50%;
      opacity: .55;
      filter: blur(2px);
    }
    .blob-purple { width: 200px; height: 200px; background: #c5b9e8; top: 60px;  left: 100px; }
    .blob-peach  { width: 130px; height: 130px; background: #f0b8a0; top: 40px;  right: 160px; }
    .blob-mint   { width: 170px; height: 170px; background: #a8e2dc; bottom: 120px; right: 60px; }
    .blob-peach2 { width: 90px;  height: 90px;  background: #f0c8a8; bottom: 60px; left: 80px; opacity:.3; }

    /* The man photo – using an SVG illustration placeholder that mirrors the layout */
    .hero-photo {
      position: relative;
      z-index: 2;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: top center;
    }

    /* Floating cards */
    .float-cards {
      position: absolute;
      right: 24px;
      top: 40%;
      transform: translateY(-50%);
      display: flex;
      flex-direction: column;
      gap: 38px;
      z-index: 10;
    }

    .fcard {
      background: var(--white);
      border-radius: 14px;
      padding: 18px;
      display: flex;
      align-items: center;
      gap: 14px;
      box-shadow: 0 4px 24px rgba(0,0,0,.08);
      min-width: 210px;
      animation: floatUp .6s ease both;
    }
    .fcard:nth-child(1) { animation-delay: .1s; }
    .fcard:nth-child(2) { animation-delay: .25s; }
    .fcard:nth-child(3) { animation-delay: .4s; }

    @keyframes floatUp {
      from { opacity:0; transform: translateY(20px); }
      to   { opacity:1; transform: translateY(0); }
    }

    .fcard-icon {
      width: 42px; height: 42px;
      border-radius: 10px;
      background: #f0edf8;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .fcard-icon svg { width: 22px; height: 22px; }
    .fcard-icon.mint-bg  { background: #e4f6f4; }
    .fcard-icon.ai-bg    { background: #eef0fb; }

    .fcard-title { font-size: 15px; font-weight: 600; color: var(--navy); line-height: 1.3; }
    .fcard-sub   { font-size: 12px; color: var(--muted); line-height: 1.5; margin-top: 2px; }

    /* Connector dots */
    .connector {
      width: 1.5px;
      height: 20px;
      background: #d1cde8;
      margin: 0 auto;
      margin-left: 35px;
    }

    /* ── RESPONSIVE ──────────────────────────────────────── */
    @media (max-width: 991px) {
      .hero { flex-direction: column; min-height: auto; }
      .hero-left { padding: 60px 40px; max-width: 100%; }
      .hero-right { min-height: 420px; }
      .float-cards { right: 12px; }
    }

    @media (max-width: 767px) {
      .hero-left { padding: 40px 24px; }
      .hero-heading { font-size: 36px; }
      .float-cards { display: none; }
      .hero-ctas { gap: 12px; }
      .btn-primary-hero, .btn-outline-hero { font-size: 13.5px; padding: 12px 20px; }
    }

    @media (max-width: 575px) {
      .navbar-nav { padding: 12px 0; }
    }

     /* ── WHY WE EXIST ───────────────────────────────────── */
  .why-section {
    background: url("../img/abt-exist-bg.png") no-repeat center center;
    background-size: cover;
    padding: 40px 0;
    position: relative;
    overflow: hidden;
    text-align: center;
  }
 
  .why-eyebrow {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .22em;
    color: var(--purple);
    text-transform: uppercase;
    margin-bottom: 28px;
  }
 
  .why-heading {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
    font-size: clamp(36px, 5.5vw, 68px);
    line-height: 1.12;
    color: var(--navy);
    margin-bottom: 32px;
  }
  .why-heading .dot { color: var(--coral); }
 
  .why-body {
    font-size: 16px;
    line-height: 1.85;
    color: var(--muted);
    max-width: 680px;
    margin: 0 auto 72px;
  }
 
  /* ── Cards grid ──────────────────────────────────────── */
  .why-grid {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1.12fr 1fr;
    grid-template-rows: auto auto;
    gap: 0;
    max-width: 1100px;
    margin: 0 auto;
    align-items: center;
  }
 
  /* Small cards (left & right columns) */
  .wcard {
    background: #fff;
    border-radius: 18px;
    padding: 22px 24px;
    display: flex;
    align-items: flex-start;
    gap: 16px;
    box-shadow: 0 2px 20px rgba(0,0,0,.06);
    text-align: left;
    max-width: 260px;
    min-width: 250px;
  }
  .wcard:nth-child(1) { grid-column: 1; grid-row: 1; justify-self: start;   margin-right: -10px; z-index: 2; }
  .wcard:nth-child(2) { grid-column: 3; grid-row: 1; justify-self: end; margin-left: -10px;  z-index: 2; }
  .wcard:nth-child(4) { grid-column: 1; grid-row: 2; justify-self: start;   margin-right: -10px; z-index: 2; margin-top: 20px; }
  .wcard:nth-child(5) { grid-column: 3; grid-row: 2; justify-self: end; margin-left: -10px;  z-index: 2; margin-top: 20px; }
 
  .wcard-icon {
    width: 44px; height: 44px;
    flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    border-radius: 10px;
  }
  .wcard-icon svg { width: 26px; height: 26px; }
  .wcard-icon.purple-bg { background: #f0edf8; }
  .wcard-icon.mint-bg   { background: #e4f6f4; }
  .wcard-icon.coral-bg  { background: #fdf0eb; }
  .wcard-icon.teal-bg   { background: #e3f3f2; }
 
  .wcard-title { font-size: 13.5px; font-weight: 600; color: var(--navy); margin-bottom: 4px; }
  .wcard-sub   { font-size: 12.5px; color: var(--muted); line-height: 1.55; }
 
  /* Centre card */
  .wcenter {
    grid-column: 2;
    grid-row: 1 / span 2;
    background: #fff;
    border-radius: 22px;
    padding: 48px 36px 40px;
    box-shadow: 0 4px 32px rgba(0,0,0,.08);
    text-align: center;
    z-index: 3;
    position: relative;
  }
 
  .wcenter-icon {
    width: 110px;
    height: 90px;
    margin: 0 auto 28px;
  }
 
  /* Three-person group icon SVG */
  .wcenter-title {
    font-family: 'Playfair Display', serif;
    font-size: 22px;
    font-weight: 700;
    color: var(--navy);
    margin-bottom: 12px;
  }
  .wcenter-sub {
    font-size: 14.5px;
    color: var(--muted);
    line-height: 1.65;
    margin-bottom: 22px;
  }
  .wcenter-line {
    width: 44px;
    height: 3px;
    background: var(--coral);
    border-radius: 2px;
    margin: 0 auto;
  }
 
 
  /* ── Responsive ──────────────────────── */
  @media (max-width: 991px) {
    .why-grid {
      grid-template-columns: 1fr;
      grid-template-rows: auto;
      gap: 16px;
      padding: 0 20px;
    }
    .wcard, .wcenter {
      max-width: 100%;
      grid-column: 1 !important;
      grid-row: auto !important;
      margin: 0 !important;
      justify-self: stretch !important;
    }
    .wcenter { order: -1; }
  }
 
  @media (max-width: 575px) {
    .why-section { padding: 60px 0 80px; }
    .why-heading  { font-size: 32px; }
    .why-body     { font-size: 14.5px; }
  }

/* WHAT MAKES US DIFFERENT  */

  .diff-section {
    background: url("../img/abt-different-bg.png") no-repeat center center;
    padding: 90px 0 110px;
    position: relative;
    overflow: hidden;
    background-size: cover;
  }
 
  /* ── Header ─────────────────────────────── */
  .diff-eyebrow {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .22em;
    color: var(--purple);
    text-transform: uppercase;
    margin-bottom: 20px;
  }
 
  .diff-heading {
    font-family: 'Playfair Display', serif;
    font-weight: 800;
    font-size: clamp(34px, 5vw, 58px);
    line-height: 1.1;
    color: var(--navy);
    margin-bottom: 18px;
  }
  .diff-heading .dot { color: var(--coral); }
 
  .diff-line {
    width: 44px;
    height: 3.5px;
    background: var(--mint);
    border-radius: 2px;
    margin-bottom: 0;
  }
 
  /* ── Floating decorative icons (top-right) */
  .diff-floats {
    position: absolute;
    top: 30px;
    right: 60px;
    width: 260px;
    height: 220px;
    pointer-events: none;
  }
  .diff-float-item {
    position: absolute;
    width: 76px; height: 76px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    border: 1.5px solid rgba(0,0,0,0.08);
    background: rgba(255,255,255,0.7);
  }
  .diff-float-item svg { width: 26px; height: 26px; }
  .dfi-1 { top: 40px;   right: 120px; }
  .dfi-2 { top: 110px; right: 280px; width: 70px; height: 70px; background: rgba(255,255,255,0.85); }
  .dfi-3 { top: 180px; right: 160px; width: 64px; height: 64px; }
 
  /* dashed connector lines between floats */
  .diff-floats svg.connectors {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
  }
 
  /* ── Cards ───────────────────────────────── */
  .diff-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 52px;
  }
 
  .dcard {
    background: #fff;
    border-radius: 20px;
    padding: 36px 32px 40px;
    box-shadow: 0 2px 18px rgba(0,0,0,.05);
  }
 
  .dcard-icon-wrap {
    width: 68px; height: 68px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 30px;
  }
  .dcard-icon-wrap svg { width: 32px; height: 32px; }
  .bg-purple-soft { background: #ede9f7; }
  .bg-peach-soft  { background: #fde8e0; }
  .bg-mint-soft   { background: #e2f5f3; }
 
  .dcard-title {
    font-family: 'Playfair Display', serif;
    font-size: 26px;
    font-weight: 700;
    color: var(--navy);
    margin-bottom: 14px;
  }
 
  .dcard-body {
    font-size: 16px;
    line-height: 1.8;
    color: var(--muted);
  }
 

  /* Floating small icons bottom-left */
  .diff-bottom-floats {
    position: absolute;
    bottom: 24px;
    left: 140px;
    display: flex;
    gap: 40px;
    pointer-events: none;
  }
  .dbf-item {
    width: 72px; height: 72px;
    border-radius: 50%;
    background: rgba(255,255,255,0.5);
    border: 1.5px solid rgba(0,0,0,0.07);
    display: flex; align-items: center; justify-content: center;
  }
  .dbf-item svg { width: 22px; height: 22px; }
 
  /* ── Responsive ──────────────────────── */
  @media (max-width: 991px) {
    .diff-cards { grid-template-columns: 1fr; gap: 16px; }
    .diff-floats { display: none; }
  }
  @media (max-width: 575px) {
    .diff-section { padding: 60px 0 80px; }
    .diff-heading  { font-size: 30px; }
  }

/* WHO WE'RE FOR – STYLES */

  .who-section {
    background: var(--sand);
    padding: 30px 0;
    position: relative;
    overflow: hidden;
    text-align: center;
  }
 
  .who-eyebrow {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .22em;
    color: var(--purple);
    text-transform: uppercase;
    margin-bottom: 22px;
  }
 
  .who-heading {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
    font-size: clamp(36px, 5vw, 64px);
    line-height: 1.12;
    color: var(--navy);
    margin-bottom: 52px;
  }
  .who-heading .dot { color: var(--coral); }
 
  /* ── Two panel cards ─────────────────────── */
  .who-panels {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
    text-align: left;
  }
 
  .wpanel {
    background: #fff;
    border-radius: 22px;
    padding: 38px 36px 40px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 2px 20px rgba(0,0,0,.05);
  }
 
  /* coloured wave blob inside each card */
  .wpanel-blob {
    position: absolute;
    bottom: -40px;
    right: -40px;
    width: 260px;
    height: 220px;
    border-radius: 50% 40% 55% 45%;
    opacity: .18;
    pointer-events: none;
  }
  .wpanel-blob.purple { background: #9b8ec4; }
  .wpanel-blob.mint   { background: #7ecec4; }
 
  /* illustration top-right of each panel */
  .wpanel-illustration {
    position: absolute;
    top: 30px;
    right: 20px;
    opacity: .92;
    pointer-events: none;
  }

  .wpanel-illustration-bg {
    position: absolute;
    bottom: 0px;
    right: 0px;
    opacity: .92;
    pointer-events: none;
  }
 
  /* panel header */
  .wpanel-header {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 14px;
  }
 
  .wpanel-icon-circle {
    width: 66px; height: 66px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
  }
  .wpanel-icon-circle svg { width: 30px; height: 30px; }
  .bg-purple-pale { background: #ede9f7; }
  .bg-mint-pale   { background: #e2f5f3; }
 
  .wpanel-title {
    font-family: 'Playfair Display', serif;
    font-size: 32px;
    font-weight: 700;
    color: var(--navy);
  }
 
  .wpanel-sub {
    font-size: 15px;
    line-height: 1.7;
    color: var(--muted);
    margin-bottom: 28px;
    max-width: 280px;
    font-weight: 500;
  }
 
  /* feature list */
  .wfeature-list {
    list-style: none;
    padding: 0;
    margin: 0 0 36px;
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
 
  .wfeature-list li {
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 16px;
    font-weight: 500;
    color: var(--navy);
  }
 
  .wf-icon {
    width: 36px; height: 36px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
  }
  .wf-icon svg { width: 17px; height: 17px; }
  .wf-icon.purple-ring { border: 1.5px solid #c5b9e8; background: transparent; }
  .wf-icon.mint-ring   { border: 1.5px solid #7ecec4; background: transparent; }
 
  /* CTA button */
  .btn-wpanel {
    background: var(--navy);
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    border: none;
    border-radius: 8px;
    padding: 15px 30px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    transition: background .2s, transform .15s;
  }
  .btn-wpanel:hover { background: #253560; color: #fff; transform: translateX(3px); }
  .btn-wpanel svg { width: 16px; height: 16px; }
 
  /* ── Responsive ──────────────────────── */
  @media (max-width: 991px) {
    .who-panels { grid-template-columns: 1fr; }
    .wpanel-illustration { display: none; }
  }
  @media (max-width: 575px) {
    .who-section { padding: 60px 0 80px; }
    .who-heading  { font-size: 30px; }
    .wpanel       { padding: 28px 22px 32px; }
  }

     /* OUR APPROACH – STYLES */
  .approach-section {
    background: url("../img/abt-approuch.png") no-repeat center center;
    padding: 30px 0;
    position: relative;
    overflow: hidden;
    background-size: cover;
  }
 
  /* ── Left copy ───────────────────────── */
  .approach-left {
    padding-right: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
  }
 
  .approach-eyebrow {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: .22em;
    color: var(--purple);
    text-transform: uppercase;
    margin-bottom: 22px;
  }
 
  .approach-heading {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
    font-size: clamp(34px, 4.5vw, 56px);
    line-height: 1.2;
    color: var(--navy);
    margin-bottom: 20px;
  }
  .approach-heading .dot { color: var(--coral); }
 
  .approach-line {
    width: 44px;
    height: 3.5px;
    background: var(--mint);
    border-radius: 2px;
    margin-bottom: 28px;
  }
 
  .approach-body {
    font-size: 18px;
    line-height: 1.8;
    color: var(--muted);
    max-width: 360px;
    font-weight: 500;
  }
 
  /* ── Right 2×2 grid ──────────────────── */
  .approach-right {
    position: relative;
  }
 
  .approach-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
  }
 
  .acard {
    background: #fff;
    border-radius: 20px;
    padding: 34px 28px 32px;
    box-shadow: 0 2px 18px rgba(0,0,0,.05);
    text-align: center;
  }
 
  .acard-icon-circle {
    width: 80px; height: 80px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 22px;
  }
  .acard-icon-circle svg { width: 36px; height: 36px; }
  .aic-purple { background: #ede9f7; }
  .aic-mint   { background: #e2f5f3; }
  .aic-peach  { background: #fde8e0; }
  .aic-lilac  { background: #edeaf8; }
 
  .acard-title {
    font-family: 'Playfair Display', serif;
    font-size: 24px;
    font-weight: 700;
    color: var(--navy);
    margin-bottom: 12px;
  }
 
  .acard-body {
    font-size: 18px;
    line-height: 1.75;
    color: var(--muted);
  }
 
  /* ── Decorative blobs ──────────────────── */
  .approach-blob {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(2px);
  }
  .ab-teal  { width: 220px; height: 180px; background: #b0d8d5; opacity: .3; top: 20px;  right: -60px; border-radius: 55% 45% 50% 60%; }
  .ab-peach { width: 140px; height: 140px; background: #f4b49a; opacity: .45; bottom: 20px; right: -20px; border-radius: 50%; }
 
  /* ── Responsive ──────────────────────── */
  @media (max-width: 991px) {
    .approach-left { padding-right: 0; margin-bottom: 48px; }
    .approach-body  { max-width: 100%; }
  }
  @media (max-width: 575px) {
    .approach-section { padding: 60px 0 80px; }
    .approach-heading  { font-size: 30px; }
    .approach-grid     { grid-template-columns: 1fr; }
  }

     /* SMARTER QUOTES – STYLES */
  .sq-section {
    background: url("../img/abt-quotes.png") no-repeat center center;
    background-size: cover;
    padding: 30px 0 ;
    position: relative;
    overflow: hidden;
  }
 
  /* ── Left copy ───────────────────────── */
  .sq-left {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-right: 40px;
  }
 
  .sq-eyebrow {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .22em;
    color: var(--purple);
    text-transform: uppercase;
    margin-bottom: 20px;
  }
 
  .sq-heading {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
    font-size: clamp(36px, 4.4vw, 46px);
    line-height: 1.2;
    color: var(--navy);
    margin-bottom: 28px;
  }
  .sq-heading .dot { color: var(--coral); }
 
  .sq-body {
    font-size: 18px;
    line-height: 1.8;
    color: var(--muted);
    margin-bottom: 16px;
    max-width: 460px;
  }
  .sq-body:last-of-type { margin-bottom: 32px; }
 
  /* time callout box */
  .sq-callout {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(155,142,196,.1);
    border-radius: 14px;
    padding: 18px 22px;
    margin-bottom: 36px;
    max-width: 460px;
  }
  .sq-callout svg { width: 30px; height: 30px; flex-shrink: 0; }
  .sq-callout-text { font-size: 18px; color: var(--navy); line-height: 1.5; }
  .sq-callout-text span { color: var(--purple); font-weight: 600; }
 
  /* buttons */
  .sq-ctas { display: flex; gap: 16px; flex-wrap: wrap; }
  .btn-sq-solid {
    background: var(--navy); color: #fff;
    font-size: 15px; font-weight: 500;
    border: none; border-radius: 8px;
    padding: 15px 28px;
    display: inline-flex; align-items: center; gap: 10px;
    text-decoration: none;
    transition: background .2s, transform .15s;
  }
  .btn-sq-solid:hover { background: #253560; color: #fff; transform: translateX(3px); }
  .btn-sq-outline {
    background: transparent; color: var(--navy);
    font-size: 15px; font-weight: 500;
    border: 1.5px solid var(--navy); border-radius: 8px;
    padding: 15px 28px;
    display: inline-flex; align-items: center; gap: 10px;
    text-decoration: none;
    transition: background .2s, color .2s;
  }
  .btn-sq-outline:hover { background: var(--navy); color: #fff; }
  .btn-sq-solid svg, .btn-sq-outline svg { width: 16px; height: 16px; }
 
  /* ── Right: step cards staircase ──────── */
  .sq-right {
    position: relative;
    min-height: 580px;
  }
 
  /* large gradient blob behind the steps */
  .sq-bg-blob {
    position: absolute;
    top: -20px; right: -80px;
    width: 480px; height: 420px;
    border-radius: 50% 45% 55% 40%;
    background: linear-gradient(135deg, #d8d0f0 0%, #f0d8d0 40%, #c8e8e4 80%);
    opacity: .45;
    filter: blur(3px);
    pointer-events: none;
  }
 
  /* step cards */
  .sq-steps {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding-top: 10px;
  }
 
  .sq-step {
    background: #fff;
    border-radius: 18px;
    padding: 20px 24px;
    display: flex;
    align-items: flex-start;
    gap: 16px;
    box-shadow: 0 2px 16px rgba(0,0,0,.06);
    min-width: 260px;
    max-width: 300px;
    margin-bottom: 14px;
    position: relative;
  }
  /* staircase offsets */
  .sq-step:nth-child(1) { position: absolute;
    top: 0px;
    right: 100px; }
  .sq-step:nth-child(3) { position: absolute;
    top: 240px;
    right: 100px; }
  .sq-step:nth-child(2) { position: absolute;
    top: 120px;
    right: 240px;}
  .sq-step:nth-child(4) { position: absolute;
    top: 360px;
    right: 250px;}
 
  /* dashed connector line between steps */
  .sq-connector {
    width: 2px;
    height: 16px;
    border-left: 2px dashed #c5b9e8;
    margin-left: 130px;
    margin-bottom: 0;
  }
 
  .sq-step-icon {
    width: 52px; height: 52px;
    border-radius: 14px;
    background: #f0edf8;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
  }
  .sq-step-icon svg { width: 26px; height: 26px; }
  .ssi-purple { background: #ede9f7; }
  .ssi-mint   { background: #e2f5f3; }
  .ssi-peach  { background: #fde8e0; }
  .ssi-lilac  { background: #edeaf8; }
 
  .sq-step-title { font-size: 16px; font-weight: 600; color: var(--navy); margin-bottom: 6px; line-height: 1.3; }
  .sq-step-lines { display: flex; flex-direction: column; gap: 5px; }
  .sq-step-line  { height: 5px; border-radius: 3px; background: #e8e4f0; }
  .sq-step-line:first-child { width: 90px; }
  .sq-step-line:last-child  { width: 60px; }
 
  /* floating decorative circles */
  .sq-float {
    position: absolute;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    border: 1.5px solid rgba(0,0,0,.08);
    background: rgba(255,255,255,.75);
    z-index: 3;
  }
  .sq-float svg { width: 22px; height: 22px; }
  .sqf-chat  { width: 54px; height: 54px; top:  30px; left: 100px; }
  .sqf-spark { width: 60px; height: 60px; top: 200px; right: -10px; }
  .sqf-shield{ width: 54px; height: 54px; bottom: 160px; left: 150px; }
  .sqf-person{ width: 50px; height: 50px; bottom: 30px;  right: 100px; }
 
  /* bottom support card */
  .sq-support-card {
    position: absolute;
    bottom: 0px;
    left: 0;
    background: rgba(255,255,255,.92);
    border-radius: 16px;
    padding: 14px 20px;
    display: flex;
    align-items: center;
    gap: 14px;
    box-shadow: 0 2px 16px rgba(0,0,0,.07);
    z-index: 4;
    backdrop-filter: blur(4px);
    max-width: 300px;
  }
  .sq-support-card svg { width: 34px; height: 34px; flex-shrink: 0; }
  .sq-sc-title { font-size: 16px; font-weight: 700; color: var(--navy); margin-bottom: 2px; }
  .sq-sc-sub   { font-size: 12px; color: var(--muted); line-height: 1.45; }
 
  /* ── Responsive ──────────────────────── */
  @media (max-width: 991px) {
    .sq-left { padding-right: 0; margin-bottom: 48px; }
    .sq-right { min-height: auto; }
    .sq-step  { margin-left: 0 !important; max-width: 100%; }
    .sq-connector { margin-left: 40px; }
    .sq-bg-blob { width: 300px; height: 300px; right: -40px; }
    .sq-support-card { position: static; margin-top: 16px; max-width: 100%; }
  }
  @media (max-width: 575px) {
    .sq-section { padding: 60px 0 80px; }
    .sq-heading  { font-size: 32px; }
    .sq-ctas     { gap: 12px; }
    .btn-sq-solid, .btn-sq-outline { font-size: 14px; padding: 13px 22px; }
    .sq-float { display: none; }
  }

     /* WHAT WE COVER – STYLES */
  .cover-section {
    background: var(--sand);
    padding: 40px 0 ;
    text-align: center;
  }
 
  .cover-eyebrow {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .22em;
    color: var(--purple);
    text-transform: uppercase;
    margin-bottom: 20px;
  }
 
  .cover-heading {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
    font-size: clamp(38px, 5.5vw, 70px);
    line-height: 1.08;
    color: var(--navy);
    margin-bottom: 22px;
  }
  .cover-heading .dot { color: var(--coral); }
 
  .cover-sub {
    font-size: 18px;
    line-height: 1.7;
    color: var(--muted);
    margin-bottom: 56px;
  }
 
  /* ── 4×2 product grid ────────────────── */
  .cover-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    margin-bottom: 52px;
    text-align: left;
  }
 
  .pcard {
    background: #fff;
    border-radius: 18px;
    padding: 32px 28px 34px;
    box-shadow: 0 1px 14px rgba(0,0,0,.05);
    transition: box-shadow .2s, transform .2s;
  }
  .pcard:hover {
    box-shadow: 0 6px 28px rgba(0,0,0,.1);
    transform: translateY(-3px);
  }
 
  .pcard-icon {
    margin-bottom: 20px;
  }
  .pcard-icon svg { width: 64px; height: 64px; }
 
  .pcard-title {
    font-family: 'Playfair Display', serif;
    font-size: 24px;
    font-weight: 700;
    color: var(--navy);
    margin-bottom: 10px;
  }
 
  .pcard-body {
    font-size: 16px;
    line-height: 1.65;
    color: var(--muted);
  }
 
  /* View All button */
  .btn-view-all {
    background: transparent;
    color: var(--navy);
    font-size: 15px;
    font-weight: 500;
    border: 1.5px solid var(--navy);
    border-radius: 50px;
    padding: 15px 42px;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    transition: background .2s, color .2s;
  }
  .btn-view-all:hover { background: var(--navy); color: #fff; }
  .btn-view-all svg { width: 16px; height: 16px; }
 
  /* ── Responsive ──────────────────────── */
  @media (max-width: 1199px) { .cover-grid { grid-template-columns: repeat(4, 1fr); } }
  @media (max-width: 991px)  { .cover-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 575px)  {
    .cover-section { padding: 60px 0 80px; }
    .cover-heading { font-size: 34px; }
    .cover-grid    { grid-template-columns: 1fr 1fr; gap: 12px; }
    .pcard         { padding: 22px 18px 24px; }
    .pcard-title   { font-size: 17px; }
  }
  @media (max-width: 400px)  { .cover-grid { grid-template-columns: 1fr; } }

  /* ── CTA BANNER ──────────────────────── */
  .cta-section {
    background: var(--sand);
    padding: 20px 20px;
  }
 
  .cta-banner {
    background: #fff;
    border-radius: 24px;
    padding: 64px 72px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 400px;
  }
 
  /* left copy */
  .cta-left {
    position: relative;
    z-index: 2;
    max-width: 560px;
  }
 
  .cta-eyebrow {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .22em;
    color: var(--purple);
    text-transform: uppercase;
    margin-bottom: 22px;
  }
 
  .cta-heading {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
    font-size: clamp(36px, 4.8vw, 68px);
    line-height: 1.1;
    color: var(--navy);
    margin-bottom: 24px;
  }
  .cta-heading .dot { color: var(--coral); }
 
  .cta-body {
    font-size: 18px;
    line-height: 1.75;
    color: var(--muted);
    margin-bottom: 40px;
    max-width: 520px;
  }
 
  .cta-btns { display: flex; gap: 16px; flex-wrap: wrap; }
 
  .btn-cta-solid {
    background: var(--navy); color: #fff;
    font-size: 15px; font-weight: 500;
    border: none; border-radius: 8px;
    padding: 16px 30px;
    display: inline-flex; align-items: center; gap: 10px;
    text-decoration: none;
    transition: background .2s, transform .15s;
  }
  .btn-cta-solid:hover { background: #253560; color: #fff; transform: translateX(3px); }
 
  .btn-cta-outline {
    background: transparent; color: var(--navy);
    font-size: 15px; font-weight: 500;
    border: 1.5px solid var(--navy); border-radius: 8px;
    padding: 16px 30px;
    display: inline-flex; align-items: center; gap: 10px;
    text-decoration: none;
    transition: background .2s, color .2s;
  }
  .btn-cta-outline:hover { background: var(--navy); color: #fff; }
  .btn-cta-solid svg, .btn-cta-outline svg { width: 16px; height: 16px; }
 
  /* abstract ribbon illustration – pure CSS SVG */
  .cta-illustration {
    position: absolute;
    right: 0; top: 0;
    width: 55%;
    height: 100%;
    pointer-events: none;
    z-index: 1;
  }
 
  /* ── FOOTER ──────────────────────────── */
  .site-footer {
    background: var(--sand);
    padding: 56px 0 40px;
    border-top: 1px solid rgba(0,0,0,.07);
  }
 
  /* logo + socials column */
  .footer-brand { display: flex; flex-direction: column; gap: 24px; }
 
  .footer-logo {
    display: flex; align-items: center; gap: 10px; text-decoration: none;
  }
  .footer-logo .logo-icon { width: 52px; height: 40px; position: relative; flex-shrink: 0; }
  .footer-logo .logo-icon span {
    position: absolute; width: 28px; height: 28px;
    border-radius: 50% 50% 0 0;
    border: 5px solid transparent;
    border-top-color: currentColor; border-left-color: currentColor;
    bottom: 0;
  }
  .footer-logo .logo-icon span:nth-child(1) { color: #f0b8a0; left: 0;   transform: rotate(-10deg); }
  .footer-logo .logo-icon span:nth-child(2) { color: #9b8ec4; left: 10px; transform: rotate(0deg); }
  .footer-logo .logo-icon span:nth-child(3) { color: #7ecec4; left: 20px; transform: rotate(10deg); }
 
  .footer-logo .brand-text .top    { font-weight: 700; font-size: 16px; letter-spacing: .08em; color: var(--navy); line-height: 1; }
  .footer-logo .brand-text .bottom { font-weight: 400; font-size: 13px; letter-spacing: .18em; color: var(--navy); line-height: 1; margin-top: 2px; }
 
  .footer-socials { display: flex; gap: 10px; }
  .social-btn {
    width: 38px; height: 38px;
    border-radius: 50%;
    border: 1.5px solid rgba(0,0,0,.15);
    display: flex; align-items: center; justify-content: center;
    text-decoration: none;
    transition: border-color .2s, background .2s;
  }
  .social-btn:hover { border-color: var(--navy); background: var(--navy); }
  .social-btn:hover svg { stroke: #fff; }
  .social-btn svg { width: 16px; height: 16px; stroke: var(--navy); }
 
  /* link columns */
  .footer-col-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--navy);
    margin-bottom: 20px;
  }
 
  .footer-links {
    list-style: none; padding: 0; margin: 0;
    display: flex; flex-direction: column; gap: 12px;
  }
  .footer-links a {
    font-size: 14px;
    color: var(--muted);
    text-decoration: none;
    transition: color .2s;
  }
  .footer-links a:hover { color: var(--navy); }
 
  /* bottom bar */
  .footer-bottom {
    border-top: 1px solid rgba(0,0,0,.07);
    margin-top: 48px;
    padding-top: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
  }
  .footer-bottom p {
    font-size: 13px; color: var(--muted); margin: 0;
  }
 
  /* ── Responsive ──────────────────────── */
  @media (max-width: 991px) {
    .cta-banner    { padding: 48px 40px; flex-direction: column; }
    .cta-illustration { width: 100%; height: 260px; position: relative; right: auto; top: auto; margin-top: 24px; }
    .cta-left      { max-width: 100%; }
  }
  @media (max-width: 767px) {
    .footer-brand  { margin-bottom: 36px; }
  }
  @media (max-width: 575px) {
    .cta-banner    { padding: 36px 24px; border-radius: 18px; }
    .cta-heading   { font-size: 30px; }
    .cta-btns      { gap: 12px; }
    .btn-cta-solid, .btn-cta-outline { font-size: 14px; padding: 13px 20px; }
  }
 
  /* ── Section ── */
    .home-cover-section {
      padding: 80px 24px 90px;
      background: var(--sand);
      text-align: center;
    }
 
    /* ── Header ── */
    .home-cover-eyebrow {
      font-size: 16px;
      font-weight: 600;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: var(--muted);
      margin-bottom: 18px;
    }
 
    .home-cover-heading {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(36px, 5vw, 64px);
      font-weight: 500;
      color: var(--navy);
      line-height: 1.1;
      margin-bottom: 18px;
    }
 
    .home-cover-heading .home-cover-dot {
      color: var(--coral);
    }
 
    .home-cover-subtext {
      font-size: 22px;
      color: var(--muted);
      margin-bottom: 48px;
    }
 
    /* ── Grid ── */
    .home-cover-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 16px;
      max-width: 1160px;
      margin: 0 auto 48px;
    }
 
    /* ── Card ── */
    .home-cover-card {
      background: var(--white);
      border: 1px solid #e8e2dc;
      border-radius: 16px;
      padding: 32px 28px 28px;
      text-align: left;
      transition: box-shadow .2s;
    }
    .home-cover-card:hover {
      box-shadow: 0 8px 28px rgba(27,42,74,.08);
    }
 
    /* ── Icon ── */
    .home-cover-icon {
      width: 72px;
      height: 72px;
      margin-bottom: 24px;
    }
 
    /* ── Card text ── */
    .home-cover-card-title {
      font-family: 'DM Serif Display', serif;
      font-size: 26px;
      font-weight: 400;
      color: var(--navy);
      margin-bottom: 6px;
    }
 
    .home-cover-card-desc {
      font-size: 18px;
      color: var(--muted);
      margin-bottom: 22px;
    }
 
    /* ── Quote link ── */
    .home-cover-quote-link {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 18px;
      font-weight: 700;
      color: var(--navy);
      text-decoration: none;
      border-bottom: 2px solid transparent;
      padding-bottom: 2px;
      transition: border-color .2s;
    }
 
    /* each card's underline colour matches its icon accent */
    .home-cover-card:nth-child(1) .home-cover-quote-link { border-color: var(--coral); }
    .home-cover-card:nth-child(2) .home-cover-quote-link { border-color: var(--purple); }
    .home-cover-card:nth-child(3) .home-cover-quote-link { border-color: var(--mint); }
    .home-cover-card:nth-child(4) .home-cover-quote-link { border-color: var(--coral); }
    .home-cover-card:nth-child(5) .home-cover-quote-link { border-color: var(--purple); }
    .home-cover-card:nth-child(6) .home-cover-quote-link { border-color: var(--mint); }
    .home-cover-card:nth-child(7) .home-cover-quote-link { border-color: var(--coral); }
    .home-cover-card:nth-child(8) .home-cover-quote-link { border-color: var(--purple); }
 
    .home-cover-quote-link:hover { color: var(--navy); opacity: .75; }
 
    /* ── CTA button ── */
    .home-cover-cta-wrap {
      text-align: center;
    }
 
    .home-cover-btn {
      display: inline-flex;
      align-items: center;
      gap: 18px;
      border: 1.5px solid var(--navy);
      border-radius: 50px;
      padding: 16px 36px;
      font-family: 'DM Sans', sans-serif;
      font-size: 16px;
      font-weight: 500;
      color: var(--navy);
      background: transparent;
      text-decoration: none;
      transition: background .22s, color .22s;
      cursor: pointer;
    }
    .home-cover-btn:hover {
      background: var(--navy);
      color: var(--white);
    }
    .home-cover-btn svg { transition: transform .2s; }
    .home-cover-btn:hover svg { transform: translateX(3px); }
 
    /* ── Responsive ── */
    @media (max-width: 992px) {
      .home-cover-grid { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 540px) {
      .home-cover-grid { grid-template-columns: 1fr; }
    }

    /* ── Section ── */
    .home-why-section {
      background: var(--sand);
      overflow: hidden;
    }
 
    .home-why-inner {
      display: flex;
      align-items: stretch;
      min-height: 600px;
    }
 
    /* ── Left photo panel ── */
    .home-why-photo-wrap {
      flex: 0 0 50%;
      max-width: 50%;
      position: relative;
      background: #e8e2dc;
      border-radius: 0 24px 24px 0;
      overflow: hidden;
    }
 
    .home-why-photo-wrap img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
      display: block;
    }
 
    /* ── Right content panel ── */
    .home-why-content {
      flex: 0 0 50%;
      max-width: 50%;
      padding: 20px 56px 20px 64px;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }
 
    /* eyebrow */
    .home-why-eyebrow {
      font-size: 18px;
      font-weight: 600;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: var(--muted);
      margin-bottom: 12px;
    }
 
    /* short rule under eyebrow */
    .home-why-rule {
      width: 28px;
      height: 2px;
      background: var(--navy);
      margin-bottom: 20px;
      border-radius: 2px;
    }
 
    /* heading */
    .home-why-heading {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(42px, 5.5vw, 72px);
      font-weight: 600;
      color: var(--navy);
      line-height: 1.08;
      margin-bottom: 30px;
    }
 
    .home-why-heading .home-why-dot {
      color: var(--coral);
    }
 
    /* ── Feature list ── */
    .home-why-list {
      list-style: none;
      padding: 0;
      margin: 0 0 20px;
      display: flex;
      flex-direction: column;
      gap: 20px;
    }
 
    .home-why-item {
      display: flex;
      align-items: center;
      gap: 22px;
    }
 
    /* icon circle */
    .home-why-icon-circle {
      flex-shrink: 0;
      width: 72px;
      height: 72px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
    }
 
    .home-why-icon-circle.peach  { background: #f8ddd3; }
    .home-why-icon-circle.purple { background: #e8e4f4; }
    .home-why-icon-circle.mint   { background: #d6f0ed; }
    .home-why-icon-circle.pink   { background: #fbe8e4; }
    .home-why-icon-circle.lavender { background: #e4e0f2; }
 
    .home-why-item-text {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(17px, 2.0vw, 26px);
      font-weight: 500;
      color: var(--navy);
      line-height: 1.3;
    }
 
    /* ── CTA button ── */
    .home-why-btn {
      display: flex;
      align-items: center;
      justify-content: space-between;
      background: var(--navy);
      color: var(--white);
      border: none;
      border-radius: 10px;
      padding: 18px 22px;
      font-family: 'DM Sans', sans-serif;
      font-size: 18px;
      font-weight: 500;
      text-decoration: none;
      cursor: pointer;
      transition: background .22s;
      max-width: 460px;
    }
    .home-why-btn:hover {
      background: #152240;
      color: var(--white);
    }
    .home-why-btn svg { transition: transform .2s; }
    .home-why-btn:hover svg { transform: translateX(4px); }
 
    /* ── Responsive ── */
    @media (max-width: 900px) {
      .home-why-inner { flex-direction: column; }
      .home-why-photo-wrap {
        flex: none; max-width: 100%;
        height: 55vw; max-height: 380px;
        border-radius: 0 0 24px 24px;
      }
      .home-why-content {
        flex: none; max-width: 100%;
        padding: 40px 24px 48px;
      }
    }

    .home-hiw-section {
    background: var(--sand);
    padding: 72px 40px 20px;
}

/* ── Header ── */
.home-hiw-header {
    text-align: center;
    margin-bottom: 56px;
}

.home-hiw-title {
    font-family: 'DM Serif Display', serif;
    font-size: clamp(52px, 6vw, 84px);
    font-weight: 400;
    color: var(--navy);
    line-height: 1;
    margin-bottom: 14px;
}

.home-hiw-subtitle {
    font-family: 'DM Serif Display', serif;
    font-size: clamp(18px, 2vw, 24px);
    font-weight: 400;
    color: var(--navy);
    margin-bottom: 6px;
}

.home-hiw-tagline {
    font-size: 15px;
    color: var(--muted);
}

/* ── Steps row ── */
/* ── Steps row ── */
.home-hiw-steps {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    gap: 0;
    margin-bottom: 40px;
    flex-wrap: nowrap;
}

.home-hiw-step {
    display: contents;
    flex-direction: column;
    align-items: flex-start;
    flex: 0 0 auto;
    width: 200px;
}
@media (max-width: 700px) {
    .home-hiw-steps {
        flex-wrap: wrap;
        justify-content: center;
    }
    .home-hiw-step {
        width: 240px;
    }
    .hiw-wid{
      min-width: 40%;
    }
}
.home-hiw-step-num {
    font-family: 'DM Serif Display', serif;
    font-size: 64px;
    font-weight: 400;
    color: var(--navy);
    line-height: 1;
    margin-bottom: 10px;
}

.home-hiw-step-title {
    font-family: 'DM Serif Display', serif;
    font-size: 22px;
    color: var(--navy);
    line-height: 1.2;
    margin-bottom: 8px;
}

.home-hiw-step-desc {
    font-size: 14px;
    color: var(--muted);
    line-height: 1.5;
}

.home-hiw-arrow {
    flex-shrink: 0;
    margin: 0 10px;
    color: var(--navy);
    opacity: .45;
    font-size: 22px;
    margin-bottom: 80px;
}

/* ── Uniform mockup card base ── */
.home-hiw-mock {
    background: var(--white);
    border: 1.5px solid var(--lavender-mid);
    border-radius: 16px;
    padding: 18px;
    width: 200px;
    min-height: 210px;
    box-sizing: border-box;
    margin-bottom: 24px;
    flex-shrink: 0;
}

/* ── Step 1 — Browser mockup ── */
.home-hiw-mock-browser {
    position: relative;
}

.home-hiw-mock-dots {
    display: flex;
    gap: 5px;
    margin-bottom: 14px;
}

.home-hiw-mock-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--lavender-mid);
}

.home-hiw-mock-bar {
    height: 8px;
    border-radius: 4px;
    background: var(--lavender-bg);
    margin-bottom: 14px;
}

.home-hiw-mock-bar.short { width: 60%; }
.home-hiw-mock-bar.med   { width: 80%; }

.home-hiw-mock-avatar-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.home-hiw-mock-avatar-circle {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: var(--lavender-bg);
    border: 1.5px solid var(--lavender-mid);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.home-hiw-mock-lines {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.home-hiw-mock-line {
    height: 7px;
    border-radius: 4px;
    background: var(--lavender-bg);
}

.home-hiw-mock-line.w100 { width: 100%; }
.home-hiw-mock-line.w70  { width: 70%; }

.home-hiw-mock-btn-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 6px;
}

.home-hiw-mock-purple-btn {
    background: var(--purple);
    color: var(--white);
    font-size: 11px;
    font-weight: 600;
    padding: 8px 12px;
    border-radius: 8px;
    white-space: nowrap;
}

.home-hiw-mock-bank-icon {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1.5px solid var(--lavender-mid);
    background: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ── Step 2 — Phone mockup ── */
.home-hiw-mock-phone-progress {
    display: flex;
    gap: 6px;
    justify-content: center;
    margin-bottom: 14px;
}

.home-hiw-mock-phone-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--lavender-bg);
}

.home-hiw-mock-phone-dot.active {
    background: var(--purple);
}

.home-hiw-mock-phone-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0;
    border-bottom: 1px solid var(--lavender-bg);
}

.home-hiw-mock-phone-row:last-of-type {
    border-bottom: none;
}

.home-hiw-mock-phone-icon {
    color: var(--navy);
    opacity: .6;
}

.home-hiw-mock-phone-line {
    flex: 1;
    height: 7px;
    background: var(--lavender-bg);
    border-radius: 4px;
    margin: 0 10px;
}

.home-hiw-mock-phone-check {
    color: var(--mint);
    font-size: 13px;
    font-weight: 700;
}

.home-hiw-mock-phone-cta {
    background: var(--purple);
    color: var(--white);
    font-size: 11px;
    font-weight: 600;
    text-align: center;
    padding: 9px;
    border-radius: 8px;
    margin-top: 12px;
}

/* ── Step 3 — Quote card ── */
.home-hiw-mock-quote-label {
    font-size: 10px;
    color: var(--muted);
    margin-bottom: 4px;
}

.home-hiw-mock-quote-price {
    font-family: 'DM Serif Display', serif;
    font-size: 22px;
    color: var(--navy);
    margin-bottom: 5px;
}

.home-hiw-mock-quote-price span {
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    color: var(--muted);
    font-weight: 400;
}

.home-hiw-mock-quote-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
    font-size: 11px;
    color: var(--navy);
}

.home-hiw-mock-quote-row .check-green {
    color: var(--mint);
    font-weight: 700;
    font-size: 12px;
}

.home-hiw-mock-quote-row .tick-left {
    color: var(--purple);
    margin-right: 4px;
    font-size: 11px;
}

.home-hiw-mock-quote-actions {
    margin-top: 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.home-hiw-mock-quote-btn-primary {
    background: var(--navy);
    color: var(--white);
    font-size: 11px;
    font-weight: 600;
    padding: 8px;
    border-radius: 6px;
    text-align: center;
}

.home-hiw-mock-quote-btn-secondary {
    border: 1px solid var(--navy);
    color: var(--navy);
    font-size: 11px;
    font-weight: 500;
    padding: 8px;
    border-radius: 6px;
    text-align: center;
}

/* ── Step 4 — Insurer card ── */
.home-hiw-mock-insurer {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.home-hiw-mock-ins-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 4px;
}

.home-hiw-mock-ins-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--lavender-bg);
    border: 1.5px solid var(--lavender-mid);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.home-hiw-mock-ins-title {
    font-family: 'DM Serif Display', serif;
    font-size: 13px;
    color: var(--navy);
    line-height: 1.3;
    margin: 0;
}

.home-hiw-mock-ins-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--lavender-bg);
    border-radius: 8px;
    padding: 7px 10px;
}

.home-hiw-mock-ins-row.selected {
    background: var(--purple);
}

.home-hiw-mock-ins-name {
    font-size: 11px;
    color: var(--navy);
    font-weight: 500;
}

.home-hiw-mock-ins-price {
    font-size: 11px;
    color: var(--purple);
    font-weight: 600;
}

.home-hiw-mock-ins-row.selected .home-hiw-mock-ins-name {
    color: var(--white);
}

.home-hiw-mock-ins-row.selected .home-hiw-mock-ins-price {
    color: rgba(255, 255, 255, 0.75);
}

.home-hiw-mock-ins-confirm {
    background: var(--navy);
    color: var(--white);
    font-size: 11px;
    font-weight: 600;
    padding: 9px;
    border-radius: 8px;
    text-align: center;
    margin-top: 2px;
}
        /* ────────────────────────────────
       INCLUDED IN EVERY QUOTE BAR
    ──────────────────────────────── */
        .home-hiw-included {
            display: flex;
            align-items: stretch;
            background: var(--white);
            border: 1px solid #e8e2dc;
            border-radius: 16px;
            margin-bottom: 44px;
            overflow: hidden;
        }

        .home-hiw-included-label {
            flex: 0 0 auto;
            padding: 28px 36px;
            border-right: 1px solid #e8e2dc;
            display: flex;
            flex-direction: column;
            justify-content: center;
            min-width: 180px;
        }

        .home-hiw-included-label h3 {
            font-family: 'DM Serif Display', serif;
            font-size: 22px;
            color: var(--navy);
            line-height: 1.2;
            margin-bottom: 10px;
        }

        .home-hiw-included-rule {
            width: 32px;
            height: 2.5px;
            background: var(--coral);
            border-radius: 2px;
        }

        .home-hiw-included-items {
            display: flex;
            flex: 1;
            align-items: center;
        }

        .home-hiw-included-item {
            flex: 1;
            display: flex;
            align-items: center;
            gap: 16px;
            padding: 28px 28px;
            border-right: 1px solid #e8e2dc;
        }

        .home-hiw-included-item:last-child {
            border-right: none;
        }

        .home-hiw-included-icon-circle {
            flex-shrink: 0;
            width: 52px;
            height: 52px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .home-hiw-included-icon-circle.lavender {
            background: #e8e4f4;
        }

        .home-hiw-included-icon-circle.peach {
            background: #fde8de;
        }

        .home-hiw-included-icon-circle.mint {
            background: #d4f0ec;
        }

        .home-hiw-included-icon-circle.purple2 {
            background: #edeaf8;
        }

        .home-hiw-included-item-title {
            font-size: 14px;
            font-weight: 700;
            color: var(--navy);
            margin-bottom: 3px;
        }

        .home-hiw-included-item-desc {
            font-size: 13px;
            color: var(--muted);
            line-height: 1.4;
        }

        /* ────────────────────────────────
       BOTTOM CTA BUTTONS
    ──────────────────────────────── */
        .home-hiw-cta-row {
            display: flex;
            justify-content: center;
            gap: 20px;
        }

        .home-hiw-btn-primary {
            display: inline-flex;
            align-items: center;
            gap: 14px;
            background: var(--navy);
            color: var(--white);
            border: none;
            border-radius: 50px;
            padding: 18px 40px;
            font-size: 16px;
            font-weight: 500;
            text-decoration: none;
            transition: background .2s;
        }

        .home-hiw-btn-primary:hover {
            background: #152240;
            color: var(--white);
        }

        .home-hiw-btn-secondary {
            display: inline-flex;
            align-items: center;
            gap: 14px;
            background: transparent;
            color: var(--navy);
            border: 1.5px solid var(--navy);
            border-radius: 50px;
            padding: 18px 40px;
            font-size: 16px;
            font-weight: 500;
            text-decoration: none;
            transition: background .2s, color .2s;
        }

        .home-hiw-btn-secondary:hover {
            background: var(--navy);
            color: var(--white);
        }

        /* ── Responsive ── */
        @media (max-width: 992px) {
            .home-hiw-steps {
                flex-wrap: wrap;
                gap: 32px;
                justify-content: flex-start;
            }

            .home-hiw-arrow {
                display: none;
            }

            .home-hiw-step {
                width: 45%;
            }

            .home-hiw-included {
                flex-direction: column;
            }

            .home-hiw-included-label {
                border-right: none;
                border-bottom: 1px solid #e8e2dc;
            }

            .home-hiw-included-items {
                flex-wrap: wrap;
            }

            .home-hiw-included-item {
                flex: 1 1 50%;
                border-right: none;
                border-bottom: 1px solid #e8e2dc;
            }
        }

        @media (max-width: 600px) {
            .home-hiw-section {
                padding: 48px 20px 0px;
            }

            .home-hiw-step {
                width: 100%;
                display: -webkit-box;
            }

            .home-hiw-cta-row {
                flex-direction: column;
                align-items: center;
            }

            .home-hiw-included-item {
                flex: 1 1 100%;
            }

            .home-hiw-mock-quote-floats {
                display: none;
            }
        }

        /* ── partner SECTION ── */
    .home-partner {
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: center;
      gap: 2rem;
      padding: 4rem 5rem 3rem;
      min-height: 520px;
      position: relative;
    }

    /* ── LEFT COPY ── */
    .home-partner__copy {}

    .home-partner__heading {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(2.6rem, 6vw, 5rem);
      color: var(--navy);
      line-height: 1.05;
      letter-spacing: -0.01em;
      margin-bottom: 1.2rem;
      font-weight: 500;
    }

    .home-partner__heading .home-partner__dot {
      color: var(--coral);
    }

    .home-partner__tagline {
      font-size: 1.3rem;
      font-weight: 600;
      color: var(--navy);
      margin-bottom: 0.4rem;
    }

    .home-partner__sub {
      font-size: 1.2rem;
      color: var(--muted);
    }

    /* ── RIGHT NETWORK DIAGRAM ── */
    .home-partner__network {
      position: relative;
      height: 360px;
    }

    .home-network__card {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -52%);
      background: var(--white);
      border-radius: 16px;
      padding: 1.4rem 1.8rem;
      box-shadow: 0 4px 24px rgba(0,0,0,0.08);
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 0.6rem;
      z-index: 2;
      width: 220px;
    }

    .home-network__logo {
      display: flex;
      align-items: center;
      gap: 0.5rem;
    }

    .home-network__logo-mark {
      width: 28px;
      height: 28px;
      flex-shrink: 0;
    }

    .home-network__logo-text {
      display: flex;
      flex-direction: column;
      line-height: 1.1;
    }

    .home-network__logo-text strong {
      font-size: 0.72rem;
      font-weight: 700;
      color: var(--navy);
      letter-spacing: 0.05em;
      text-transform: uppercase;
    }

    .home-network__logo-text span {
      font-size: 0.62rem;
      letter-spacing: 0.08em;
      color: var(--muted);
      text-transform: uppercase;
    }

    .home-network__badge {
      font-size: 0.6rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--muted);
      font-weight: 600;
      border-top: 1px solid #eee;
      padding-top: 0.5rem;
      width: 100%;
    }

    .home-network__icons {
      display: flex;
      gap: 0.8rem;
      margin-top: 0.2rem;
    }

    .home-network__icon {
      width: 22px;
      height: 22px;
      color: var(--muted);
    }

    /* Member avatars */
    .home-network__member {
      position: absolute;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      z-index: 3;
    }

    .home-network__avatar {
      width: 60px;
      height: 60px;
      border-radius: 50%;
      overflow: hidden;
      border: 2px solid var(--white);
      box-shadow: 0 2px 10px rgba(0,0,0,0.12);
      background: #f0eaf7;
      display: flex;
      align-items: flex-end;
      justify-content: center;
    }

    .home-network__avatar svg {
      width: 42px;
      height: 50px;
    }

    .home-network__member-label {
      font-size: 0.55rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--muted);
      font-weight: 600;
    }

    /* Member positions */
    .home-network__member--tl { top: 4%;  left: 10%; }
    .home-network__member--tc { top: 0%;  left: 48%; transform: translateX(-50%); }
    .home-network__member--tr { top: 10%; right: 2%; }
    .home-network__member--ml { top: 48%; left: 0%;  transform: translateY(-50%); }
    .home-network__member--bc { bottom: 2%; left: 44%; transform: translateX(-50%); }
    .home-network__member--br { bottom: 8%; right: 0%; }

    /* Connector dots */
    .home-network__dot {
      position: absolute;
      border-radius: 50%;
      z-index: 1;
    }
    .home-network__dot--coral  { background: var(--coral);  width: 9px; height: 9px; }
    .home-network__dot--purple { background: var(--purple); width: 7px; height: 7px; }
    .home-network__dot--mint   { background: var(--mint);   width: 7px; height: 7px; }

    /* SVG connector lines */
    .home-network__lines {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      z-index: 1;
      pointer-events: none;
    }

    /* Flowing wave background */
    .home-network__wave {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      z-index: 0;
      pointer-events: none;
    }

    /* ── FEATURE CARDS ── */
    .home-features {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1.5rem;
      padding: 0 5rem 2.5rem;
    }

    .home-feature-card {
      background: var(--white);
      border-radius: 16px;
      padding: 2rem 2.2rem;
      display: flex;
      gap: 1.4rem;
      align-items: flex-start;
      position: relative;
      overflow: hidden;
    }

    .home-feature-card--members {
      background: #f8f6ff;
    }

    .home-feature-card--assoc {
      background: #f2fbfa;
    }

    .home-feature-card--ai {
      background: #f8ece8;
    }
    /* Decorative wave inside card */
    .home-feature-card__deco {
      position: absolute;
      right: -20px;
      top: 0;
      bottom: 0;
      width: 55%;
      pointer-events: none;
      opacity: 0.55;
    }

    .home-feature-card__icon-wrap {
      flex-shrink: 0;
      width: 54px;
      height: 54px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .home-feature-card--members .home-feature-card__icon-wrap {
      background: var(--purple);
    }

    .home-feature-card--assoc .home-feature-card__icon-wrap {
      background: var(--mint);
    }
    .home-feature-card--ai .home-feature-card__icon-wrap {
      background: var(--peach);
    }

    .home-feature-card__icon-wrap svg {
      width: 26px;
      height: 26px;
      color: var(--white);
    }

    .home-feature-card__body {}

    .home-feature-card__title {
      font-family: 'DM Serif Display', serif;
      font-size: 1.6rem;
      color: var(--navy);
      margin-bottom: 0.9rem;
    }

    .home-feature-card__list {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 0.45rem;
      padding-left: 0;
    }

    .home-feature-card__list li {
      display: flex;
      align-items: center;
      gap: 0.55rem;
      font-size: 1rem;
      color: var(--text);
    }

    .home-feature-card__check {
      width: 18px;
      height: 18px;
      flex-shrink: 0;
    }

    .home-feature-card--members .home-feature-card__check { color: var(--purple); }
    .home-feature-card--assoc  .home-feature-card__check { color: var(--mint); }
    .home-feature-card--ai     .home-feature-card__check { color: var(--peach); }

    /* Responsive tweaks for feature, partner and how-it-works header */
    @media (max-width: 992px) {
      .home-features {
        grid-template-columns: repeat(2, 1fr);
        padding: 0 2rem 2rem;
        gap: 1rem;
      }
      .home-feature-card {
        padding: 1.2rem 1rem;
        gap: 1rem;
      }
      .home-feature-card__deco {
        width: 70%;
        right: -30px;
        opacity: 0.35;
      }
      .home-feature-card__icon-wrap { width:48px; height:48px; }
      .home-feature-card__title { font-size: 1.35rem; }
    }

    @media (max-width: 600px) {
      .home-features {
        grid-template-columns: 1fr;
        padding: 0 1rem 1.25rem;
        gap: 0.9rem;
      }
      .home-feature-card {
        padding: 0.9rem 0.9rem;
        gap: 0.8rem;
        align-items: flex-start;
      }
      .home-feature-card__deco { display: none; }
      .home-feature-card__icon-wrap { width:44px; height:44px; }
      .home-feature-card__title { font-size: 1.1rem; }
      .home-feature-card__list li { font-size: 0.98rem; }
    }

    /* Partner section: stack on small screens and simplify network visuals */
    @media (max-width: 900px) {
      .home-partner {
        grid-template-columns: 1fr;
        padding: 2rem 1.25rem;
        gap: 1.5rem;
        min-height: auto;
      }
      .home-partner__network { height: 320px; }
      .home-network__card {
        position: static;
        transform: none;
        margin: 0 auto;
        width: 260px;
      }
      .home-network__member { display: none; }
    }

    /* How-it-works header: tighten sizing on small screens */
    @media (max-width: 700px) {
      .home-hiw-header { margin-bottom: 28px; padding: 0 1rem; }
      .home-hiw-title { font-size: clamp(28px, 6vw, 44px); }
      .home-hiw-subtitle { font-size: clamp(14px, 2.2vw, 18px); }
      .home-hiw-tagline { font-size: 0.95rem; }
    }

    /* ── STEPS ── */
    .home-steps {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 0;
      padding: 1.5rem 5rem 2.5rem;
    }

    .home-step {
      display: flex;
      align-items: center;
      gap: 1rem;
    }

    .home-step__icon-wrap {
      width: 52px;
      height: 52px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .home-step--1 .home-step__icon-wrap { background: #fde8df; }
    .home-step--2 .home-step__icon-wrap { background: var(--lavender-bg); }
    .home-step--3 .home-step__icon-wrap { background: #d9f5f2; }

    .home-step__icon-wrap svg {
      width: 26px;
      height: 26px;
    }

    .home-step--1 .home-step__icon-wrap svg { color: var(--coral); }
    .home-step--2 .home-step__icon-wrap svg { color: var(--purple); }
    .home-step--3 .home-step__icon-wrap svg { color: var(--mint); }

    .home-step__text {
      display: flex;
      align-items: center;
      gap: 0.5rem;
    }

    .home-step__num {
      font-size: 0.8rem;
      font-weight: 700;
      color: var(--coral);
    }

    .home-step--2 .home-step__num { color: var(--purple); }
    .home-step--3 .home-step__num { color: var(--mint); }

    .home-step__label {
      font-size: 1.1rem;
      font-weight: 500;
      color: var(--navy);
    }

    .home-steps__arrow {
      display: flex;
      align-items: center;
      padding: 0 2.6rem;
      color: var(--muted);
    }

    .home-steps__arrow svg {
      width: 36px;
      height: 16px;
    }

    /* ── CTA BUTTONS ── */
    .home-cta {
      display: flex;
      justify-content: center;
      gap: 1rem;
      padding: 0 5rem 4rem;
    }

    .home-cta__btn {
      display: inline-flex;
      align-items: center;
      gap: 0.6rem;
      padding: 0.85rem 2rem;
      border-radius: 8px;
      font-size: 0.97rem;
      font-weight: 500;
      font-family: 'DM Sans', sans-serif;
      cursor: pointer;
      transition: opacity 0.2s, transform 0.15s;
      text-decoration: none;
      border: none;
    }

    .home-cta__btn:hover { opacity: 0.88; transform: translateY(-1px); }

    .home-cta__btn--primary {
      background: var(--navy);
      color: var(--white);
    }

    .home-cta__btn--secondary {
      background: transparent;
      color: var(--navy);
      border: 1.5px solid var(--navy);
    }

    .home-cta__btn svg {
      width: 16px;
      height: 16px;
    }

    /* ══════════════════════════════
       ABOUT SECTION
    ══════════════════════════════ */
    .home-about {
      padding: 4rem 5rem 4rem;
      background: #FEFDFD;
    }
 
    /* ── Page title ── */
    .home-about__title {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(2.4rem, 5vw, 4.6rem);
      color: var(--navy);
      text-align: center;
      margin-bottom: 2.8rem;
      letter-spacing: -0.01em;
      font-weight: 500;
    }
 
    /* ── Why we exist block ── */
    .home-about__why {
      margin-bottom: 2.8rem;
    }
 
    .home-about__why-label {
      font-family: 'DM Serif Display', serif;
      font-size: 1.8rem;
      color: var(--navy);
      font-style: italic;
      margin-bottom: 0.6rem;
    }
 
    .home-about__why-grid {
      display: grid;
      grid-template-columns: auto 1fr;
      align-items: center;
      gap: 3rem;
    }
 
    .home-about__why-headline {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(2rem, 3.5vw, 3rem);
      color: var(--navy);
      line-height: 1.1;
      max-width: 380px;
      font-weight: 500;
    }
 
    .home-about__why-body {
      font-size: 1.2rem;
      color: var(--muted);
      line-height: 1.65;
      max-width: 340px;
    }
 
    /* ── Pillars (3 cards) ── */
    .home-about__pillars {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      margin-bottom: 2.8rem;
    }
 
    .home-about__pillar {
      display: flex;
      align-items: center;
      gap: 1.4rem;
      padding: 2rem 1.6rem;
      border-right: 1px solid #e5ddd6;
    }
 
    .home-about__pillar:last-child {
      border-right: none;
    }
 
    .home-about__pillar-illo {
      flex-shrink: 0;
      width: 180px;
      height: 180px;
      position: relative;
    }

    .home-about__pillar-img {
      width: 100%;
      height: 100%;
      object-fit: contain;
    }

    .home-about__who-img{
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
 
    .home-about__pillar-body {}
 
    .home-about__pillar-title {
      font-family: 'DM Serif Display', serif;
      font-size: 1.8rem;
      color: var(--navy);
      margin-bottom: 0.5rem;
      font-weight: 500;
    }
 
    .home-about__pillar-desc {
      font-size: 1.2rem;
      color: var(--muted);
      line-height: 1.6;
    }
 
    /* ── Who we're for ── */
    .home-about__who {
      display: grid;
      grid-template-columns: auto 1fr 1fr;
      align-items: center;
      gap: 2rem;
      border-top: 1px solid #e5ddd6;
      padding-top: 2.5rem;
    }
 
    .home-about__who-label {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(1.8rem, 3vw, 2.4rem);
      color: var(--navy);
      line-height: 1.1;
      white-space: nowrap;
    }
 
    .home-about__who-card {
      display: flex;
      align-items: center;
      gap: 1.4rem;
    }
 
    .home-about__who-illo {
      flex-shrink: 0;
      width: 200px;
      height: 200px;
      position: relative;
    }
 
    .home-about__who-body {}
 
    .home-about__who-name {
      font-family: 'DM Serif Display', serif;
      font-size: 1.6rem;
      color: var(--navy);
      margin-bottom: 0.75rem;
    }
 
    .home-about__who-btn {
      display: inline-flex;
      align-items: center;
      gap: 0.55rem;
      padding: 0.72rem 1.5rem;
      border-radius: 7px;
      font-size: 0.92rem;
      font-weight: 500;
      font-family: 'DM Sans', sans-serif;
      cursor: pointer;
      text-decoration: none;
      transition: opacity 0.2s, transform 0.15s;
      white-space: nowrap;
    }
 
    .home-about__who-btn:hover { opacity: 0.85; transform: translateY(-1px); }
 
    .home-about__who-btn--primary {
      background: var(--navy);
      color: var(--white);
      border: none;
    }
 
    .home-about__who-btn--secondary {
      background: transparent;
      color: var(--navy);
      border: 1.5px solid var(--navy);
    }
 
    .home-about__who-btn svg {
      width: 14px;
      height: 14px;
    }

    .faq-section{
            background: url("../img/faq bg.png") no-repeat center center;
            padding: 40px 20px;
        }

        .faq-main-container {
            
            max-width: 900px;
            margin: 0 auto;
            position: relative;
        }

        /* ===== FAQ HEADER ===== */
        .faq-header-section {
            text-align: center;
            margin-bottom: 20px;
            animation: fadeInDown 0.8s ease-out;
        }

        .faq-header-section h1 {
            font-size: 4rem;
            font-weight: 400;
            color: #1e3a8a;
            margin-bottom: 20px;
            letter-spacing: 0px;
            font-family: 'Georgia', 'Garamond', serif;
        }

        .faq-header-section p {
            font-size: 1.05rem;
            color: #8fa3b8;
            font-weight: 400;
            font-family: 'Georgia', 'Garamond', serif;
        }

        /* ===== FAQ ACCORDION (CORE FAQ) ===== */
        .faq-accordion-wrapper {
            background: white;
            border-radius: 12px;
            margin-bottom: 40px;
            overflow: hidden;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
        }

        .faq-accordion-item {
            border: none;
            border-bottom: 1px solid #e8e4df;
        }

        .faq-accordion-item:last-child {
            border-bottom: none;
        }

        .faq-question-btn {
            background-color: white;
            color: #1e3a8a;
            font-size: 1.02rem;
            font-weight: 500;
            padding: 20px 30px;
            border: none;
            box-shadow: none;
            transition: all 0.3s ease;
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
        }

        .faq-question-btn:not(.collapsed) {
            background-color: #f8f6f4;
            color: #1e3a8a;
            box-shadow: none;
        }

        .faq-question-btn:hover {
            background-color: #f8f6f4;
            color: #1e3a8a;
        }

        .faq-question-btn::after {
            background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%231e3a8a'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
            transform: rotate(-90deg);
            transition: transform 0.3s ease;
        }

        .faq-question-btn:not(.collapsed)::after {
            transform: rotate(0deg);
        }

        .faq-answer-body {
            padding: 20px 30px;
            background-color: white;
            color: #666;
            border: none;
            font-size: 0.98rem;
            line-height: 1.6;
        }

        /* ===== FAQ CONTACT FORM (FOR FOLLOW-UP QUESTIONS) ===== */
        .faq-contact-wrapper {
            background: white;
            border-radius: 12px;
            padding: 20px;
            margin-bottom: 20px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
        }

        .faq-contact-title {
            font-size: 1.4rem;
            color: #1e3a8a;
            font-weight: 500;
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
        }

        .faq-form-group {
            margin-bottom: 10px;
        }

        .faq-form-control {
            border: 1px solid #e8e4df;
            border-radius: 6px;
            padding: 12px 15px;
            font-size: 0.93rem;
            width: 100%;
            background-color: #fafaf9;
            color: #555;
            transition: all 0.3s ease;
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
        }

        .faq-form-control::placeholder {
            color: #b5a9a0;
            font-size: 0.93rem;
        }

        .faq-form-control:focus {
            background-color: white;
            border-color: #7b9bc4;
            box-shadow: 0 0 0 0.2rem rgba(123, 155, 196, 0.15);
            color: #333;
        }

        .faq-form-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 20px;
        }

        @media (max-width: 768px) {
            .faq-form-row {
                grid-template-columns: 1fr;
            }
        }

        .faq-form-group-full {
            grid-column: 1 / -1;
        }

        textarea.faq-form-control {
            resize: vertical;
            min-height: 120px;
            font-family: inherit;
        }

        .faq-submit-btn {
            background-color: #1e3a8a;
            color: white;
            border: none;
            padding: 11px 28px;
            border-radius: 6px;
            font-weight: 500;
            font-size: 0.92rem;
            cursor: pointer;
            display: flex;
            align-items: center;
            gap: 8px;
            transition: all 0.3s ease;
            margin-left: auto;
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
        }

        .faq-submit-btn:hover {
            background-color: #162e6f;
            transform: translateX(4px);
            color: white;
            text-decoration: none;
        }

        /* ===== FAQ PARTNERSHIP SECTION (RELATED TO PARTNER FAQ) ===== */
        .faq-partnership-card {
            background: linear-gradient(135deg, #fdf2f0 0%, #f5eef9 100%);
            border-radius: 12px;
            padding: 30px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
        }

        .faq-partnership-content {
            display: flex;
            align-items: center;
            gap: 20px;
            flex: 1;
        }

        .faq-partnership-icon {
            width: 50px;
            height: 50px;
            background: white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem;
            flex-shrink: 0;
        }

        .faq-partnership-text h3 {
            font-size: 1.8rem;
            color: #1e3a8a;
            font-weight: 500;
            margin: 0 0 5px 0;
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
        }

        .faq-partnership-text p {
            color: #8fa3b8;
            margin: 0;
            font-size: 0.93rem;
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
        }

        .faq-partnership-btn {
            background-color: white;
            color: #1e3a8a;
            border: 2px solid #1e3a8a;
            padding: 9px 22px;
            border-radius: 6px;
            font-weight: 500;
            font-size: 0.92rem;
            cursor: pointer;
            display: flex;
            align-items: center;
            gap: 8px;
            transition: all 0.3s ease;
            white-space: nowrap;
            margin-left: 20px;
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
        }

        .faq-partnership-btn:hover {
            background-color: #1e3a8a;
            color: white;
            text-decoration: none;
        }

        @media (max-width: 768px) {
            .faq-partnership-card {
                flex-direction: column;
                text-align: center;
            }

            .faq-partnership-content {
                flex-direction: column;
                text-align: center;
            }

            .faq-partnership-btn {
                margin-left: 0;
                margin-top: 15px;
            }

            .faq-header-section h1 {
                font-size: 2.5rem;
            }

            .faq-contact-wrapper {
                padding: 30px 20px;
            }
        }

        /* ===== ANIMATIONS ===== */
        @keyframes fadeInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .faq-accordion-wrapper {
            animation: fadeInUp 0.8s ease-out 0.2s both;
        }

        .faq-contact-wrapper {
            animation: fadeInUp 0.8s ease-out 0.4s both;
        }

        .faq-partnership-card {
            animation: fadeInUp 0.8s ease-out 0.6s both;
        }

        /* decorative svg styling */
        svg.faq-svg-bg {
            opacity: 0.6;
        }

        /* ── PARTNERS ── */
    .insurers-section { background: var(--white); padding: 20px 0; }
      
    .insurers-section h2{
      font-family: 'DM Serif Display', serif;
      font-size: clamp(2.4rem, 5vw, 4.6rem);
      color: var(--navy);
      text-align: center;
      margin-bottom: 0.8rem;
      letter-spacing: -0.01em;
      font-weight: 500;
    }

    .insurer-logo {
      display: flex; align-items: center; justify-content: center;
      padding: 22px 32px;
      filter: grayscale(30%); opacity: .8; transition: all .2s;
    }
    .insurer-logo:hover { filter: grayscale(0%); opacity: 1; }
    .insurer-logo span {
      font-weight: 900; font-size: 24px; letter-spacing: -1px;
    }
    .logo-qbe    { color: #003087; }
    .logo-hollard { color: #e4002b; }
    .logo-battle  { color: #1a1a2e; }
    .logo-chubb   { color: #c8102e; }


    /* ─── BLOB HELPERS ─────────────────────────────────────────── */
    .ctn-blob {
      position: absolute;
      border-radius: 50%;
      filter: blur(0px);
      pointer-events: none;
      z-index: 0;
    }
 
    /* ══════════════════════════════════════════════════════════════
       SECTION 1 — HERO BANNER
    ══════════════════════════════════════════════════════════════ */
    .ctn-hero {
      position: relative;
      background: url("../img/cta-banner.png") no-repeat center center;
      background-size: cover;
      overflow: hidden;
      min-height: 550px;
      display: flex;
      align-items: center;
    }
 
    /* wavy blobs top-right */
    .ctn-hero-blob-1 {
      width: 200px; height: 180px;
      top: -40px; right: 60px;
      background: var(--lavender-bg);
      border-radius: 60% 40% 55% 45% / 50% 60% 40% 50%;
    }
    .ctn-hero-blob-2 {
      width: 140px; height: 130px;
      top: 10px; right: 0;
      background: #e8f4f3;
      border-radius: 50% 60% 40% 55% / 45% 55% 60% 40%;
    }
    .ctn-hero-blob-3 {
      width: 110px; height: 100px;
      top: 60px; right: 100px;
      background: #fde8e0;
      border-radius: 55% 45% 60% 40% / 60% 40% 55% 45%;
      opacity: 0.6;
    }
 
    .ctn-hero-content { position: relative; z-index: 1; padding-left: 100px; }
 
    @media (max-width: 575px) {
      .ctn-hero-content { padding-left: 20px; }
    }

    .ctn-hero-label {
      font-size: 18px;
      font-weight: 700;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: var(--purple);
      margin-bottom: 10px;
    }
 
    .ctn-hero-title {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(36px, 5vw, 56px);
      font-weight: 600;
      color: var(--navy);
      line-height: 1.1;
      margin-bottom: 8px;
    }
 
    .ctn-hero-title span { color: var(--coral); }
 
    .ctn-hero-divider {
      display: flex;
      align-items: center;
      gap: 6px;
      margin-bottom: 20px;
    }
    .ctn-hero-divider-line {
      width: 40px; height: 2px;
      background: var(--purple);
      border-radius: 2px;
    }
    .ctn-hero-divider-dot {
      width: 6px; height: 6px;
      background: var(--coral);
      border-radius: 50%;
    }
 
    .ctn-hero-subtitle {
      color: var(--text);
      font-size: 18px;
      line-height: 1.6;
      margin-bottom: 28px;
      max-width: 340px;
      font-weight: 500;
    }
 
    .ctn-btn-primary {
      background: var(--navy);
      color: var(--white);
      border: none;
      padding: 13px 28px;
      border-radius: 6px;
      font-family: 'DM Sans', sans-serif;
      font-size: 14px;
      font-weight: 600;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
      transition: background 0.2s;
    }
    .ctn-btn-primary:hover { background: #243660; color: var(--white); }
 
    .ctn-btn-secondary {
      background: transparent;
      color: var(--navy);
      border: 1.5px solid var(--navy);
      padding: 12px 24px;
      border-radius: 6px;
      font-family: 'DM Sans', sans-serif;
      font-size: 14px;
      font-weight: 600;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      transition: all 0.2s;
    }
    .ctn-btn-secondary:hover { background: var(--navy); color: var(--white); }
 
    /* agent image circle */
    .ctn-hero-img-wrap {
      position: relative;
      z-index: 1;
      display: flex;
      justify-content: center;
      align-items: flex-end;
    }
 
    .ctn-hero-img-circle {
      width: clamp(220px, 30vw, 360px);
      height: clamp(220px, 30vw, 360px);
      border-radius: 50%;
      background: var(--lavender-bg);
      overflow: hidden;
      display: flex;
      align-items: flex-end;
      justify-content: center;
    }
 
    /* SVG illustration of agent */
    .ctn-agent-svg {
      width: 100%;
      height: 100%;
    }
 
    /* ══════════════════════════════════════════════════════════════
       SECTION 2 — CONTACT FORM
    ══════════════════════════════════════════════════════════════ */
    .ctn-form-section {
      position: relative;
      background: var(--sand);
      padding: 70px 20px;
      overflow: hidden;
    }
 
    /* blobs */
    .ctn-form-blob-tl {
      width: 220px; height: 200px;
      top: -30px; left: -60px;
      background: var(--lavender-bg);
      border-radius: 55% 45% 60% 40% / 50% 60% 45% 55%;
    }
    .ctn-form-blob-br {
      width: 160px; height: 150px;
      bottom: 20px; right: -40px;
      background: #fde8e0;
      border-radius: 45% 55% 40% 60% / 60% 40% 55% 45%;
      opacity: 0.7;
    }
 
    .ctn-form-title {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(32px, 4vw, 56px);
      color: var(--navy);
      text-align: center;
      margin-bottom: 6px;
      font-weight: 600;
    }
    .ctn-form-title span { color: var(--coral); }
 
    .ctn-form-divider {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      margin-bottom: 40px;
    }
 
    .ctn-form-card {
      background: var(--white);
      border-radius: 16px;
      padding: 40px;
      position: relative;
      z-index: 1;
      box-shadow: 0 2px 20px rgba(0,0,0,0.04);
    }

    @media (max-width: 575px) {
      .ctn-form-card { padding: 30px 10px; }
      .border-end { display: none;}
      .ctn-form-left{ padding-right: 0; margin-bottom: 30px;}
    }
    /* left panel */
    .ctn-form-left { padding-right: 20px; }
 
    .ctn-form-icon-wrap {
      width: 70px; height: 70px;
      border-radius: 50%;
      background: var(--lavender-bg);
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 20px;
    }
    .ctn-form-icon-wrap i { font-size: 26px; color: var(--purple); }
 
    .ctn-form-left-title {
      font-family: 'DM Serif Display', serif;
      font-size: 42px;
      color: var(--navy);
      margin-bottom: 4px;
      font-weight: 600;
    }
    .ctn-form-left-title span { color: var(--coral); }
 
    .ctn-form-left-divider {
      display: flex; align-items: center; gap: 6px;
      margin-bottom: 14px;
    }
 
    .ctn-form-left-desc {
      font-size: 16px;
      color: var(--text);
      line-height: 1.65;
      margin-bottom: 28px;
      max-width: 300px;
      font-weight: 500;
    }
 
    .ctn-info-item {
      display: flex;
      align-items: flex-start;
      gap: 14px;
      margin-bottom: 20px;
    }
    .ctn-info-icon {
      width: 44px; height: 44px;
      border-radius: 50%;
      background: var(--lavender-bg);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .ctn-info-icon i { color: var(--purple); font-size: 22px; }
    .ctn-info-body h6 {
      font-weight: 700;
      font-size: 18px;
      color: var(--navy);
      margin-bottom: 2px;
    }
    .ctn-info-body p {
      font-size: 17px;
      color: var(--muted);
      margin: 0;
      line-height: 1.5;
    }
 
    /* form fields */
    .ctn-field-label {
      font-size: 16px;
      font-weight: 700;
      color: var(--navy);
      margin-bottom: 6px;
      display: block;
    }
 
    .ctn-field {
      width: 100%;
      border: 1.5px solid #e5e7eb;
      border-radius: 8px;
      padding: 12px 14px;
      font-family: 'DM Sans', sans-serif;
      font-size: 14px;
      color: var(--text);
      background: var(--white);
      outline: none;
      transition: border-color 0.2s;
      margin-bottom: 18px;
    }
    .ctn-field::placeholder { color: #b0b7c3; }
    .ctn-field:focus { border-color: var(--purple); }
 
    .ctn-select {
      appearance: none;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236b7280' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 14px center;
    }
 
    .ctn-textarea {
      resize: vertical;
      min-height: 130px;
    }
 
    .ctn-checkbox-wrap {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      margin-bottom: 24px;
    }
    .ctn-checkbox-wrap input[type="checkbox"] {
      width: 16px; height: 16px;
      margin-top: 2px;
      accent-color: var(--purple);
      flex-shrink: 0;
    }
    .ctn-checkbox-wrap label {
      font-size: 13px;
      color: var(--muted);
      line-height: 1.5;
    }
    .ctn-checkbox-wrap a { color: var(--purple); text-decoration: none; font-weight: 600; }
 
    /* ══════════════════════════════════════════════════════════════
       SECTION 3 — GET IN TOUCH
    ══════════════════════════════════════════════════════════════ */
    .ctn-touch-section {
      background: var(--sand);
      padding: 60px 20px 0;
      position: relative;
      overflow: hidden;
    }
 
    .ctn-touch-blob-tl {
      width: 180px; height: 160px;
      top: -20px; left: -50px;
      background: var(--lavender-bg);
      border-radius: 55% 45% 60% 40% / 50% 55% 45% 60%;
    }
    .ctn-touch-blob-br {
      width: 150px; height: 140px;
      top: 10px; right: -30px;
      background: #fde8e0;
      border-radius: 45% 55% 40% 60% / 60% 40% 55% 45%;
      opacity: 0.65;
    }
 
    .ctn-touch-title {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(30px, 4vw, 56px);
      color: var(--navy);
      text-align: center;
      margin-bottom: 6px;
      font-weight: 600;
    }
    .ctn-touch-title span { color: var(--coral); }
 
    .ctn-touch-divider {
      display: flex; align-items: center; justify-content: center;
      gap: 6px; margin-bottom: 36px;
    }
 
    /* info cards row */
    .ctn-contact-card {
      background: var(--white);
      border-radius: 12px;
      padding: 22px 24px;
      display: flex;
      align-items: center;
      gap: 18px;
      position: relative;
      z-index: 1;
      box-shadow: 0 2px 12px rgba(0,0,0,0.04);
      height: 100%;
    }
 
    .ctn-contact-card-icon {
      width: 52px; height: 52px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .ctn-contact-card-icon.purple { background: var(--lavender-bg); }
    .ctn-contact-card-icon.purple i { color: var(--purple); font-size: 22px; }
    .ctn-contact-card-icon.mint   { background: #e6f8f6; }
    .ctn-contact-card-icon.mint i { color: var(--mint); font-size: 22px; }
    .ctn-contact-card-icon.peach  { background: #fdeee8; }
    .ctn-contact-card-icon.peach i { color: var(--coral); font-size: 22px; }
 
    .ctn-contact-card-body h6 {
      font-weight: 700; font-size: 18px;
      color: var(--navy); margin-bottom: 3px;
    }
    .ctn-contact-card-body p {
      font-size: 16px; color: var(--muted); margin: 0; line-height: 1.5;
    }
 
    /* social strip */
    .ctn-social-strip {
      background: var(--lavender-bg);
      border-radius: 14px;
      padding: 30px 36px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 20px;
      margin-top: 28px;
      margin-bottom: 60px;
      position: relative;
      z-index: 1;
    }
 
    .ctn-social-blob-tl {
      width: 100px; height: 90px;
      top: -20px; left: -20px;
      background: var(--lavender-mid);
      opacity: 0.35;
      border-radius: 55% 45% 60% 40% / 50% 60% 45% 55%;
    }
 
    .ctn-social-left {
      display: flex; align-items: center; gap: 18px;
    }
    .ctn-social-avatar {
      width: 66px; height: 66px;
      border-radius: 50%;
      background: var(--white);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .ctn-social-avatar i { font-size: 28px; color: var(--purple); }
 
    .ctn-social-text h5 {
      font-family: 'DM Serif Display', serif;
      font-size: 32px;
      color: var(--navy);
      margin-bottom: 2px;
      font-weight: 600;
    }
    .ctn-social-text h5 span { color: var(--coral); }
    .ctn-social-text p {
      font-size: 18px; color: var(--muted); margin: 0;
    }
 
    .ctn-social-icons {
      display: flex; align-items: center; gap: 4px;
    }
    .ctn-social-divider {
      width: 1px; height: 36px;
      background: #d1cbe8;
      margin: 0 8px;
    }
    .ctn-social-btn {
      width: 66px; height: 66px;
      border-radius: 50%;
      background: var(--white);
      display: flex; align-items: center; justify-content: center;
      text-decoration: none;
      transition: transform 0.2s, box-shadow 0.2s;
      box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    }
    .ctn-social-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,0.12); }
    .ctn-social-btn i { font-size: 26px; }
    .ctn-social-btn .bi-instagram { color: #e1306c; }
    .ctn-social-btn .bi-facebook  { color: #1877f2; }
    .ctn-social-btn .bi-linkedin  { color: #0a66c2; }


      /* ── BLOB ── */
    .prod-blob {
      position: absolute;
      pointer-events: none;
      z-index: 0;
    }
 
    /* ══════════════════════════════════════════════════════════
       SECTION 1 — HERO + PRODUCT GRID
    ══════════════════════════════════════════════════════════ */
    .prod-hero {
      position: relative;
      background: #faf8ff;
      overflow: hidden;
      padding: 60px 20px 80px;
    }
 
    /* blobs */
    .prod-blob-tl {
      width: 320px; height: 280px;
      bottom: -60px; left: -80px;
      background: var(--lavender-bg);
      border-radius: 55% 45% 60% 40% / 50% 60% 45% 55%;
    }
    .prod-blob-tr {
      width: 200px; height: 180px;
      top: -20px; right: 0;
      background: #fde8e0;
      border-radius: 45% 55% 40% 60% / 60% 40% 55% 45%;
      opacity: 0.7;
    }
    .prod-blob-tr2 {
      width: 130px; height: 120px;
      top: 60px; right: 80px;
      background: var(--lavender-bg);
      border-radius: 55% 45% 60% 40% / 45% 55% 50% 50%;
      opacity: 0.5;
    }
    .prod-blob-dot-mint {
      width: 70px; height: 70px;
      bottom: 60px; left: 38%;
      background: #b8ece8;
      border-radius: 50%;
    }
    .prod-blob-dot-peach {
      width: 90px; height: 90px;
      bottom: 40px; left: 48%;
      background: var(--peach);
      border-radius: 50%;
      opacity: 0.75;
    }
    .prod-blob-dot-mint2 {
      width: 80px; height: 80px;
      bottom: 50px; right: 6%;
      background: #b8ece8;
      border-radius: 50%;
      opacity: 0.65;
    }
 
    .prod-hero-label {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 2.5px;
      text-transform: uppercase;
      color: var(--purple);
      margin-bottom: 14px;
    }
 
    .prod-hero-title {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(38px, 5vw, 66px);
      color: var(--navy);
      line-height: 1.1;
      margin-bottom: 6px;
      font-weight: 600;
    }
    .prod-hero-title span { color: var(--coral); }
 
    .prod-hero-subtitle {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(26px, 3.5vw, 40px);
      color: var(--purple);
      font-style: italic;
      line-height: 1.2;
      margin-bottom: 22px;
      font-weight: 600;
    }
 
    .prod-hero-desc {
      font-size: 18px;
      color: var(--text);
      line-height: 1.7;
      max-width: 400px;
      margin-bottom: 34px;
    }
 
    .prod-btn-primary {
      background: var(--navy);
      color: var(--white);
      border: none;
      padding: 14px 28px;
      border-radius: 8px;
      font-family: 'DM Sans', sans-serif;
      font-size: 15px;
      font-weight: 600;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
      transition: background 0.2s;
    }
    .prod-btn-primary:hover { background: #243660; color: var(--white); }
    .prod-btn-primary svg { width: 18px; height: 18px; }
 
    .prod-btn-secondary {
      background: transparent;
      color: var(--navy);
      border: 1.5px solid var(--navy);
      padding: 13px 22px;
      border-radius: 8px;
      font-family: 'DM Sans', sans-serif;
      font-size: 15px;
      font-weight: 600;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
      transition: all 0.2s;
    }
    .prod-btn-secondary:hover { background: var(--navy); color: var(--white); }
    .prod-btn-secondary svg { width: 18px; height: 18px; }
 
    /* right panel card */
    .prod-panel-card {
      background: var(--white);
      border-radius: 20px;
      padding: 28px;
      position: relative;
      z-index: 1;
      box-shadow: 0 4px 24px rgba(0,0,0,0.05);
    }
 
    .prod-panel-label {
      font-size: 18px;
      font-weight: 700;
      letter-spacing: 2.5px;
      text-transform: uppercase;
      color: var(--purple);
      margin-bottom: 20px;
    }
 
    .prod-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 10px;
    }
 
    .prod-grid-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-end;
      padding: 16px 8px 14px;
      border: 1.5px solid #f0eef8;
      border-radius: 12px;
      text-align: center;
      cursor: pointer;
      transition: border-color 0.2s, box-shadow 0.2s;
      gap: 10px;
    }
    .prod-grid-item:hover {
      border-color: var(--lavender-mid);
      box-shadow: 0 4px 16px rgba(155,142,196,0.12);
    }
 
    .prod-grid-icon {
      width: 64px; height: 64px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
 
    .prod-grid-name {
      font-size: 18px;
      font-weight: 700;
      color: var(--navy);
      line-height: 1.3;
    }
 
    /* icon bg colours */
    .bg-lavender { background: var(--lavender-bg); }
    .bg-mint      { background: #e0f5f3; }
    .bg-peach     { background: #fdeee8; }
    .bg-lilac     { background: #ece8f8; }
 
    /* ══════════════════════════════════════════════════════════
       SECTION 2 — EXPLORE ALL EIGHT
    ══════════════════════════════════════════════════════════ */
    .prod-explore {
      position: relative;
      background: var(--sand);
      padding: 70px 20px 80px;
      overflow: hidden;
    }
 
    .prod-explore-blob-tr {
      width: 180px; height: 160px;
      top: -20px; right: -30px;
      background: #fde8e0;
      border-radius: 45% 55% 40% 60% / 60% 40% 55% 45%;
      opacity: 0.6;
    }
    .prod-explore-blob-bl {
      width: 160px; height: 140px;
      bottom: 0; left: -30px;
      background: #e0f5f3;
      border-radius: 55% 45% 60% 40% / 50% 60% 45% 55%;
      opacity: 0.55;
    }
 
    .prod-explore-title {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(30px, 4vw, 55px);
      color: var(--navy);
      text-align: center;
      margin-bottom: 8px;
      font-weight: 600;
    }
    .prod-explore-title span { color: var(--coral); }
 
    .prod-explore-divider {
      display: flex; align-items: center; justify-content: center;
      gap: 6px; margin-bottom: 44px;
    }
    .prod-divider-line {
      width: 40px; height: 2px;
      background: var(--purple); border-radius: 2px;
    }
    .prod-divider-dot {
      width: 7px; height: 7px;
      background: var(--coral); border-radius: 50%;
    }
 
    /* product cards */
    .prod-card {
      background: var(--white);
      border-radius: 14px;
      padding: 24px 22px 20px;
      position: relative;
      height: 100%;
      box-shadow: 0 2px 12px rgba(0,0,0,0.04);
      border: 1.5px solid #f0eef8;
      transition: box-shadow 0.2s;
    }
    .prod-card:hover { box-shadow: 0 8px 28px rgba(0,0,0,0.08); }
 
    .prod-card-num {
      position: absolute;
      top: 16px; left: 16px;
      width: 28px; height: 28px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-size: 13px; font-weight: 700;
      color: var(--white);
    }
    .num-purple { background: var(--purple); }
    .num-mint   { background: var(--mint); }
    .num-coral  { background: var(--coral); }
 
    .prod-card-icon-wrap {
      width: 80px; height: 80px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      margin: 8px auto 16px;
    }
 
    .prod-card-title {
      font-family: 'DM Serif Display', serif;
      font-size: 26px;
      color: var(--navy);
      margin-bottom: 10px;
      text-align: center;
      font-weight: 600;
    }
 
    .prod-card-desc {
      font-size: 14px;
      color: var(--muted);
      line-height: 1.65;
      margin-bottom: 18px;
    }
 
    .prod-card-link {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 14px;
      font-weight: 600;
      color: var(--purple);
      text-decoration: none;
      transition: gap 0.2s;
    }
    .prod-card-link:hover { gap: 10px; color: var(--purple); }
    .prod-card-link svg { width: 16px; height: 16px; }
 
    /* explore bottom row — icon left layout */
    .prod-card-row {
      display: flex;
      align-items: flex-start;
      gap: 18px;
    }
    .prod-card-row .prod-card-icon-wrap {
      width: 64px; height: 64px;
      margin: 0;
      flex-shrink: 0;
    }
    .prod-card-row-body .prod-card-title {
      text-align: left;
      font-size: 18px;
      margin-bottom: 8px;
    }


    /* ══════════════════════════════════════════════════════════
       CLAIMS HERO SECTION
    ══════════════════════════════════════════════════════════ */
    .claim-hero {
      position: relative;
      background: #FEFEFE;
      overflow: hidden;
      padding: 60px 20px 70px;
      min-height: 520px;
    }
 
    /* ── blobs ── */
    .claim-blob {
      position: absolute;
      pointer-events: none;
      z-index: 0;
    }
 
    /* bottom-left lavender wave */
    .claim-blob-bl {
      width: 340px; height: 280px;
      bottom: -80px; left: -80px;
      background: var(--lavender-bg);
      border-radius: 55% 45% 60% 40% / 50% 60% 45% 55%;
    }
    /* top-right peach */
    .claim-blob-tr {
      width: 200px; height: 180px;
      top: -30px; right: 0;
      background: #fde8e0;
      border-radius: 45% 55% 40% 60% / 60% 40% 55% 45%;
      opacity: 0.7;
    }
    /* top-right secondary lavender */
    .claim-blob-tr2 {
      width: 130px; height: 120px;
      top: 50px; right: 100px;
      background: var(--lavender-bg);
      border-radius: 55% 45% 60% 40% / 45% 55% 50% 50%;
      opacity: 0.45;
    }
    /* bottom center mint */
    .claim-blob-bc-mint {
      width: 80px; height: 80px;
      bottom: 30px; left: 44%;
      background: #b8ece8;
      border-radius: 50%;
      opacity: 0.7;
    }
    /* bottom center peach dot */
    .claim-blob-bc-peach {
      width: 100px; height: 100px;
      bottom: 10px; left: 52%;
      background: var(--peach);
      border-radius: 50%;
      opacity: 0.65;
    }
    /* bottom right mint */
    .claim-blob-br-mint {
      width: 160px; height: 140px;
      bottom: -30px; right: -20px;
      background: #c8eeea;
      border-radius: 55% 45% 50% 55% / 45% 60% 40% 55%;
      opacity: 0.55;
    }
    /* agent photo circle bg */
    .claim-photo-circle {
      position: absolute;
      width: 380px; height: 380px;
      border-radius: 50%;
      background: var(--lavender-bg);
      bottom: -30px;
      left: 50%;
      transform: translateX(-50%);
      z-index: 1;
      overflow: hidden;
    }
    /* override for right column positioning */
    .claim-photo-wrap {
      position: relative;
      display: flex;
      justify-content: center;
      align-items: flex-end;
      z-index: 1;
    }
    .claim-photo-bg {
      width: clamp(260px, 34vw, 400px);
      height: clamp(260px, 34vw, 400px);
      border-radius: 50%;
      background: var(--lavender-bg);
      overflow: hidden;
      display: flex;
      align-items: flex-end;
      justify-content: center;
      flex-shrink: 0;
    }
    .claim-agent-svg { width: 100%; height: 100%; }
 
    /* ── LEFT TEXT ── */
    .claim-content { position: relative; z-index: 1; }
 
    .claim-label {
      font-size: 18px;
      font-weight: 700;
      letter-spacing: 2.5px;
      text-transform: uppercase;
      color: var(--purple);
      margin-bottom: 14px;
    }
 
    .claim-title {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(38px, 5vw, 66px);
      color: var(--navy);
      line-height: 1.1;
      margin-bottom: 4px;
      font-weight: 600;
    }
    .claim-title span { color: var(--coral); }
 
    .claim-subtitle {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(20px, 2.8vw, 34px);
      color: var(--purple);
      font-style: italic;
      line-height: 1.3;
      margin-bottom: 10px;
    }
 
    .claim-divider {
      display: flex;
      align-items: center;
      gap: 6px;
      margin-bottom: 22px;
    }
    .claim-divider-line {
      width: 38px; height: 2px;
      background: var(--purple);
      border-radius: 2px;
    }
    .claim-divider-dot {
      width: 7px; height: 7px;
      background: var(--coral);
      border-radius: 50%;
    }
 
    .claim-desc {
      font-size: 18px;
      color: var(--text);
      line-height: 1.7;
      max-width: 420px;
      margin-bottom: 34px;
    }
 
    .claim-btn-primary {
      background: var(--navy);
      color: var(--white);
      border: none;
      padding: 14px 28px;
      border-radius: 8px;
      font-family: 'DM Sans', sans-serif;
      font-size: 15px;
      font-weight: 600;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
      transition: background 0.2s;
    }
    .claim-btn-primary:hover { background: #243660; color: var(--white); }
 
    .claim-btn-secondary {
      background: transparent;
      color: var(--navy);
      border: 1.5px solid var(--navy);
      padding: 13px 22px;
      border-radius: 8px;
      font-family: 'DM Sans', sans-serif;
      font-size: 15px;
      font-weight: 600;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
      transition: all 0.2s;
    }
    .claim-btn-secondary:hover { background: var(--navy); color: var(--white); }
 
    /* ── RIGHT COLUMN ── */
    .claim-right {
      position: relative;
      z-index: 1;
      display: flex;
      align-items: center;
      justify-content: center;
    }
 
    /* floating cards container */
    .claim-cards-wrap {
      position: relative;
      width: 100%;
      max-width: 520px;
      min-height: 460px;
    }
 
    /* status card */
    .claim-status-card {
      background: var(--white);
      border-radius: 16px;
      padding: 22px 26px;
      box-shadow: 0 8px 32px rgba(0,0,0,0.08);
      position: absolute;
      top: 10px;
      right: -100px;
      width: 260px;
      z-index: 3;
    }
 
    .claim-status-title {
      font-family: 'DM Serif Display', serif;
      font-size: 18px;
      color: var(--navy);
      font-weight: 700;
      margin-bottom: 6px;
    }
 
    .claim-status-divider {
      display: flex; align-items: center; gap: 5px;
      margin-bottom: 18px;
    }
    .claim-status-divider-line {
      width: 28px; height: 2px;
      background: var(--purple); border-radius: 2px;
    }
    .claim-status-divider-dot {
      width: 5px; height: 5px;
      background: var(--coral); border-radius: 50%;
    }
 
    /* timeline steps */
    .claim-step {
      display: flex;
      align-items: center;
      gap: 14px;
      position: relative;
    }
    .claim-step + .claim-step { margin-top: 0; }
 
    .claim-step-left {
      display: flex;
      flex-direction: column;
      align-items: center;
      width: 24px;
      flex-shrink: 0;
    }
 
    .claim-step-icon {
      width: 24px; height: 24px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
      z-index: 1;
    }
    .claim-step-icon.done    { background: var(--green); }
    .claim-step-icon.active  {
      background: var(--white);
      border: 2px solid var(--purple);
      position: relative;
    }
    .claim-step-icon.active::after {
      content: '';
      width: 8px; height: 8px;
      background: var(--purple);
      border-radius: 50%;
      position: absolute;
    }
    .claim-step-icon.pending {
      background: var(--white);
      border: 2px solid #d1d5db;
    }
 
    .claim-step-line {
      width: 2px;
      height: 20px;
      background: #e5e7eb;
      margin: 2px 0;
    }
    .claim-step-line.done { background: var(--green); }
 
    .claim-step-label {
      font-size: 14px;
      color: var(--text);
      font-weight: 500;
      padding: 10px 0;
    }
    .claim-step-label.muted { color: var(--muted); }
 
    /* team card */
    .claim-team-card {
      background: var(--white);
      border-radius: 16px;
      padding: 18px 22px;
      box-shadow: 0 8px 32px rgba(0,0,0,0.07);
      position: absolute;
      bottom: 10px;
      right: 0;
      width: 280px;
      z-index: 3;
      display: flex;
      align-items: center;
      gap: 16px;
    }
 
    .claim-team-icon {
      width: 58px; height: 58px;
      border-radius: 50%;
      background: var(--lavender-bg);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
 
    .claim-team-text {
      font-family: 'DM Serif Display', serif;
      font-size: 16px;
      color: var(--navy);
      line-height: 1.4;
    }

    /* shared heading */
    .claim-section-title {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(30px, 4vw, 56px);
      color: var(--navy);
      text-align: center;
      margin-bottom: 8px;
    }
    .claim-section-title span { color: var(--coral); }

    .claim-divider {
      display: flex; align-items: center; justify-content: center;
      gap: 6px; margin-bottom: 44px;
    }
    .claim-divider-line {
      width: 40px; height: 2.5px;
      background: var(--purple); border-radius: 2px;
    }
    .claim-divider-dot {
      width: 7px; height: 7px;
      background: var(--coral); border-radius: 50%;
    }

    .claim-blob {
      position: absolute;
      pointer-events: none;
      z-index: 0;
    }

    /* ══════════════════════════════════════════════════════════
       SECTION 1 — THREE WAYS TO LODGE
    ══════════════════════════════════════════════════════════ */
    .claim-lodge {
      position: relative;
      background: #faf8ff;
      padding: 70px 20px 80px;
      overflow: hidden;
    }

    .claim-lodge-blob-tl {
      width: 260px; height: 220px;
      top: -40px; left: -60px;
      background: var(--lavender-bg);
      border-radius: 55% 45% 60% 40% / 50% 60% 45% 55%;
    }
    .claim-lodge-blob-tr {
      width: 180px; height: 160px;
      top: -20px; right: -20px;
      background: #fde8e0;
      border-radius: 45% 55% 40% 60% / 60% 40% 55% 45%;
      opacity: 0.65;
    }

    .claim-lodge-card {
      background: var(--white);
      border-radius: 18px;
      padding: 40px 28px 36px;
      text-align: center;
      height: 100%;
      box-shadow: 0 2px 14px rgba(0,0,0,0.04);
      border: 1.5px solid #f0eef8;
      transition: box-shadow 0.2s;
    }
    .claim-lodge-card:hover { box-shadow: 0 8px 28px rgba(0,0,0,0.08); }

    .claim-lodge-icon {
      width: 96px; height: 96px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto 26px;
    }

    .claim-lodge-name {
      font-family: 'DM Serif Display', serif;
      font-size: 32px;
      color: var(--navy);
      margin-bottom: 14px;
    }
    .claim-lodge-name span { color: var(--coral); }
    .claim-lodge-name.mint-dot span  { color: var(--green); }

    .claim-lodge-desc {
      font-size: 18px;
      color: var(--muted);
      line-height: 1.7;
      max-width: 260px;
      margin: 0 auto;
    }


    /* ══════════════════════════════════════════════════════════
       SECTION 2 — WHAT YOU'LL NEED
    ══════════════════════════════════════════════════════════ */
    .claim-need {
      position: relative;
      background: var(--sand);
      padding: 70px 20px 80px;
      overflow: hidden;
    }

    .claim-need-blob-bl {
      width: 180px; height: 160px;
      bottom: 0; left: -40px;
      background: #fde8e0;
      border-radius: 55% 45% 60% 40% / 50% 60% 45% 55%;
      opacity: 0.5;
    }
    .claim-need-blob-tr {
      width: 200px; height: 180px;
      top: -30px; right: -30px;
      background: var(--lavender-bg);
      border-radius: 45% 55% 40% 60% / 60% 40% 55% 45%;
      opacity: 0.55;
    }

    .claim-need-card {
      background: var(--white);
      border-radius: 16px;
      padding: 28px 24px;
      display: flex;
      align-items: center;
      gap: 20px;
      height: 100%;
      box-shadow: 0 2px 12px rgba(0,0,0,0.04);
      border: 1.5px solid #f0eef8;
      transition: box-shadow 0.2s;
    }
    .claim-need-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.07); }

    .claim-need-icon {
      width: 90px; height: 90px;
      border-radius: 50%;
      background: #e6f8f5;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }

    .claim-need-text {
      font-size: 18px;
      font-weight: 600;
      color: var(--navy);
      line-height: 1.5;
    }


    /* ══════════════════════════════════════════════════════════
       SECTION 3 — WHAT HAPPENS NEXT
    ══════════════════════════════════════════════════════════ */
    .claim-next {
      position: relative;
      background: #faf8ff;
      padding: 70px 20px 80px;
      overflow: hidden;
    }

    .claim-next-blob-tl {
      width: 180px; height: 160px;
      top: -20px; left: -30px;
      background: #fde8e0;
      border-radius: 55% 45% 60% 40% / 50% 60% 45% 55%;
      opacity: 0.55;
    }
    .claim-next-blob-tr {
      width: 200px; height: 180px;
      top: -20px; right: -30px;
      background: #e0f5f3;
      border-radius: 45% 55% 40% 60% / 60% 40% 55% 45%;
      opacity: 0.55;
    }
    .claim-next-blob-br {
      width: 200px; height: 170px;
      bottom: -20px; right: -30px;
      background: #fde8e0;
      border-radius: 55% 45% 60% 40% / 45% 60% 40% 55%;
      opacity: 0.5;
    }

    /* timeline connector */
    .claim-next-timeline {
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
      margin-bottom: 32px;
      z-index: 1;
    }

    .claim-next-steps-row {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 0;
      width: 100%;
      max-width: 700px;
    }

    .claim-step-num {
      width: 44px; height: 44px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-size: 18px; font-weight: 700;
      color: var(--white);
      flex-shrink: 0;
      z-index: 1;
    }
    .claim-step-num.purple { background: var(--purple); }
    .claim-step-num.mint   { background: var(--green); }
    .claim-step-num.peach  { background: var(--peach); }

    .claim-next-dot-line {
      flex: 1;
      height: 2px;
      border-top: 2.5px dashed;
      margin: 0 6px;
    }
    .claim-next-dot-line.purple { border-color: var(--purple); }
    .claim-next-dot-line.mint   { border-color: var(--green); }
    .claim-next-dot-line.peach  { border-color: var(--peach); }

    .claim-next-col {
      text-align: center;
      position: relative;
      z-index: 1;
    }

    .claim-next-icon {
      width: 100px; height: 100px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto 22px;
    }

    .claim-next-name {
      font-family: 'DM Serif Display', serif;
      font-size: 32px;
      color: var(--navy);
      margin-bottom: 12px;
    }
    .claim-next-name span.coral  { color: var(--coral); }
    .claim-next-name span.mint   { color: var(--green); }
    .claim-next-name span.peach  { color: var(--peach); }

    .claim-next-desc {
      font-size: 18px;
      color: var(--muted);
      line-height: 1.7;
      max-width: 280px;
      margin: 0 auto;
    }

     .claim-blob {
      position: absolute;
      pointer-events: none;
      z-index: 0;
    }

    /* shared divider */
    .claim-divider {
      display: flex; align-items: center; justify-content: center;
      gap: 6px; margin-bottom: 44px;
    }
    .claim-divider-line {
      width: 40px; height: 2.5px;
      background: var(--purple); border-radius: 2px;
    }
    .claim-divider-dot {
      width: 7px; height: 7px;
      background: var(--coral); border-radius: 50%;
    }

    /* left-aligned divider variant */
    .claim-divider-left {
      display: flex; align-items: center;
      gap: 6px; margin-bottom: 22px;
    }


    /* ══════════════════════════════════════════════════════════
       SECTION 1 — FAQ
    ══════════════════════════════════════════════════════════ */
    .claim-faq {
      position: relative;
      background: #faf8ff;
      padding: 70px 20px 80px;
      overflow: hidden;
    }

    .claim-faq-blob-tl {
      width: 220px; height: 200px;
      top: -30px; left: -50px;
      background: var(--lavender-bg);
      border-radius: 55% 45% 60% 40% / 50% 60% 45% 55%;
      opacity: 0.7;
    }
    .claim-faq-blob-br {
      width: 200px; height: 180px;
      bottom: -30px; right: -30px;
      background: #fde8e0;
      border-radius: 45% 55% 40% 60% / 60% 40% 55% 45%;
      opacity: 0.55;
    }

    .claim-faq-title {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(28px, 4vw, 46px);
      color: var(--navy);
      text-align: center;
      margin-bottom: 8px;
    }
    .claim-faq-title span { color: var(--coral); }

    /* FAQ group card */
    .claim-faq-group {
      background: var(--white);
      border-radius: 16px;
      overflow: hidden;
      box-shadow: 0 2px 12px rgba(0,0,0,0.04);
      border: 1.5px solid #f0eef8;
      margin-bottom: 24px;
    }

    /* group header */
    .claim-faq-group-header {
      display: flex;
      align-items: center;
      gap: 16px;
      padding: 20px 24px;
      cursor: pointer;
      border-bottom: 1.5px solid #f0eef8;
    }

    .claim-faq-group-icon {
      width: 56px; height: 56px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }

    .claim-faq-group-info { flex: 1; }
    .claim-faq-group-info h3 {
      font-family: 'DM Serif Display', serif;
      font-size: 32px;
      color: var(--navy);
      margin-bottom: 2px;
    }
    .claim-faq-group-info p {
      font-size: 16px;
      color: var(--muted);
      margin: 0;
    }

    .claim-faq-group-chevron {
      color: var(--navy);
      flex-shrink: 0;
      transition: transform 0.3s;
    }
    .claim-faq-group-chevron.open { transform: rotate(180deg); }

    /* accordion items inside group */
    .claim-faq-item {
      border-bottom: 1.5px solid #f4f3fa;
    }
    .claim-faq-item:last-child { border-bottom: none; }

    .claim-faq-question {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 16px 24px;
      cursor: pointer;
      font-size: 15px;
      font-weight: 500;
      color: var(--navy);
      gap: 12px;
      transition: background 0.15s;
    }
    .claim-faq-question:hover { background: #faf9ff; }

    .claim-faq-chevron {
      color: var(--navy);
      flex-shrink: 0;
      transition: transform 0.3s;
    }
    .claim-faq-chevron.open { transform: rotate(180deg); }

    .claim-faq-answer {
      display: none;
      padding: 0 24px 16px;
      font-size: 14px;
      color: var(--muted);
      line-height: 1.7;
    }
    .claim-faq-answer.open { display: block; }


    /* ══════════════════════════════════════════════════════════
       SECTION 2 — NOT HAPPY WITH A DECISION
    ══════════════════════════════════════════════════════════ */
    .claim-review {
      position: relative;
      background: #FCFAFB;
      padding: 70px 20px 80px;
      overflow: hidden;
    }

    .claim-review-blob-tr {
      width: 200px; height: 180px;
      top: 20px; right: -30px;
      background: #fde8e0;
      border-radius: 45% 55% 40% 60% / 60% 40% 55% 45%;
      opacity: 0.65;
    }
    .claim-review-blob-br {
      width: 240px; height: 200px;
      bottom: -40px; right: -40px;
      background: #fde8e0;
      border-radius: 55% 45% 60% 40% / 50% 60% 45% 55%;
      opacity: 0.45;
    }

    .claim-review-photo {
      width: clamp(240px, 30vw, 360px);
      height: clamp(240px, 30vw, 360px);
      border-radius: 50%;
      background: #f0eef8;
      overflow: hidden;
      display: flex;
      align-items: flex-end;
      justify-content: center;
    }

    .claim-review-title {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(28px, 4vw, 44px);
      color: var(--navy);
      line-height: 1.15;
      margin-bottom: 6px;
    }
    .claim-review-title span { color: var(--coral); }

    .claim-review-desc {
      font-size: 16px;
      color: var(--navy);
      line-height: 1.75;
      margin-bottom: 32px;
      max-width: 560px;
    }

    .claim-btn-primary {
      background: var(--navy);
      color: var(--white);
      border: none;
      padding: 15px 32px;
      border-radius: 10px;
      font-family: 'DM Sans', sans-serif;
      font-size: 15px;
      font-weight: 600;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
      transition: background 0.2s;
    }
    .claim-btn-primary:hover { background: #243660; color: var(--white); }

    .claim-btn-secondary {
      background: transparent;
      color: var(--navy);
      border: 1.5px solid var(--navy);
      padding: 14px 26px;
      border-radius: 10px;
      font-family: 'DM Sans', sans-serif;
      font-size: 15px;
      font-weight: 600;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
      transition: all 0.2s;
    }
    .claim-btn-secondary:hover { background: var(--navy); color: var(--white); }


    /* ══════════════════════════════════════════════════════════
       SECTION 3 — NEED TO LODGE A CLAIM
    ══════════════════════════════════════════════════════════ */
    .claim-lodge-cta {
      position: relative;
      background: #FCF7FD;
      padding: 60px 20px 0;
      overflow: hidden;
    }

    .claim-lodge-cta-blob-tl {
      width: 220px; height: 200px;
      top: -30px; left: -50px;
      background: var(--lavender-mid);
      border-radius: 55% 45% 60% 40% / 50% 60% 45% 55%;
      opacity: 0.35;
    }
    .claim-lodge-cta-blob-br {
      width: 200px; height: 180px;
      bottom: 0; right: -30px;
      background: #fde8e0;
      border-radius: 45% 55% 40% 60% / 60% 40% 55% 45%;
      opacity: 0.8;
      z-index: 5;
    }

    .claim-lodge-cta-title {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(30px, 4.5vw, 64px);
      color: var(--navy);
      line-height: 1.1;
      margin-bottom: 6px;
    }
    .claim-lodge-cta-title span { color: var(--coral); }

    .claim-lodge-cta-desc {
      font-size: 22px;
      color: var(--navy);
      line-height: 1.65;
      margin-bottom: 32px;
      max-width: 400px;
    }

    /* agent circle */
    .claim-lodge-cta-img {
      width: clamp(260px, 36vw, 440px);
      height: clamp(260px, 36vw, 440px);
      border-radius: 50%;
      background: var(--lavender-mid);
      overflow: hidden;
      display: flex;
      align-items: flex-end;
      justify-content: center;
      margin-left: auto;
    }

     /* =============================================
       SECTION 1 — HERO / PARTNER
    ============================================= */
    .ass-hero {
      background: url("../img/ass-banner.png") no-repeat center center;
      background-size: cover;
      padding: 60px 80px;
      position: relative;
      overflow: hidden;
      min-height: 480px;
      display: flex;
      align-items: center;
    }

    

    .ass-hero__content {
      position: relative; z-index: 2;
      max-width: 540px;
    }

    .ass-hero__eyebrow {
      font-size: 16px;
      font-weight: 600;
      letter-spacing: 0.15em;
      color: var(--lavender-mid);
      text-transform: uppercase;
      margin-bottom: 16px;
    }

    .ass-hero__headline {
      font-size: 56px;
      font-weight: 800;
      line-height: 1.1;
      color: var(--navy);
      margin-bottom: 0;
    }
    .ass-hero__headline--purple {
      color: var(--purple);
      display: block;
    }

    .ass-hero__divider {
      border: none;
      border-top: 1px solid #d0d0d0;
      margin: 28px 0 24px;
      width: 100%;
    }

    .ass-hero__body {
      font-size: 18px;
      line-height: 1.65;
      color: var(--text);
      margin-bottom: 28px;
      font-weight: 600;
    }

    .ass-hero__check-row {
      display: flex;
      gap: 14px;
      align-items: flex-start;
      margin-bottom: 36px;
    }
    .ass-hero__check-icon {
      flex-shrink: 0;
      width: 32px; height: 32px;
      border: 1.5px solid var(--purple);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      margin-top: 2px;
    }
    .ass-hero__check-icon i {
      font-size: 25px;
      color: var(--purple);
    }
    .ass-hero__check-text {
      font-size: 18px;
      line-height: 1.55;
      color: var(--text);
      font-weight: 600;
    }

    .ass-hero__ctas {
      display: flex;
      gap: 16px;
      flex-wrap: wrap;
    }

    .ass-btn-primary {
      background: var(--navy);
      color: var(--white);
      border: none;
      border-radius: 50px;
      padding: 14px 28px;
      font-size: 15px;
      font-weight: 600;
      font-family: 'DM Sans', sans-serif;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      cursor: pointer;
      text-decoration: none;
    }
    .ass-btn-primary:hover { background: #243560; color: var(--white); }

    .ass-btn-outline {
      background: transparent;
      color: var(--navy);
      border: 1.5px solid var(--navy);
      border-radius: 50px;
      padding: 13px 24px;
      font-size: 15px;
      font-weight: 500;
      font-family: 'DM Sans', sans-serif;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      cursor: pointer;
      text-decoration: none;
    }
    .ass-btn-outline:hover { background: var(--navy); color: var(--white); }

    /* Hero image side */
    .ass-hero__img-col {
      position: relative; z-index: 2;
      display: flex;
      justify-content: flex-end;
      align-items: flex-end;
    }

    .ass-hero__photo {
      width: 480px;
      max-width: 100%;
      border-radius: 16px;
      object-fit: cover;
      position: relative;
      z-index: 2;
    }

    .ass-hero__badge {
      position: absolute;
      top: 100px;
      right: 0;
      background: var(--white);
      border-radius: 16px;
      padding: 18px 22px;
      display: flex;
      align-items: center;
      gap: 14px;
      box-shadow: 0 4px 24px rgba(0,0,0,0.08);
      z-index: 3;
      min-width: 260px;
    }
    .ass-hero__badge-icon {
      width: 52px; height: 52px;
      background: var(--lavender-bg);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .ass-hero__badge-icon i {
      font-size: 22px;
      color: var(--purple);
    }
    .ass-hero__badge-text {
      font-size: 20px;
      font-weight: 700;
      line-height: 1.4;
      color: var(--navy);
    }

    /* =============================================
       SECTION 2 — WHAT YOUR MEMBERS GET
    ============================================= */
    .ass-members {
      background: linear-gradient(160deg, #f0ecff 0%, #f8f4ff 40%, #fce9e0 100%);
      padding: 80px 60px;
      position: relative;
      overflow: hidden;
    }

    /* Decorative blob shapes */
    .ass-members::before {
      content: '';
      position: absolute;
      width: 320px; height: 320px;
      background: #e8e2fa;
      border-radius: 50%;
      top: -80px; left: -80px;
      z-index: 0;
    }
    .ass-members::after {
      content: '';
      position: absolute;
      width: 180px; height: 260px;
      background: #f5cfc0;
      border-radius: 50% 0 0 50%;
      top: -20px; right: -40px;
      z-index: 0;
    }

    /* Dot grid top-left */
    .ass-members__dots {
      position: absolute;
      top: 40px; left: 60px;
      z-index: 1;
      display: grid;
      grid-template-columns: repeat(4, 8px);
      gap: 6px;
    }
    .ass-members__dots span {
      width: 4px; height: 4px;
      background: #b0a8d4;
      border-radius: 50%;
      display: block;
    }

    /* Bottom right decorative blobs */
    .ass-members__blob-br {
      position: absolute;
      bottom: -30px; right: 120px;
      width: 120px; height: 120px;
      background: #c8ede9;
      border-radius: 50%;
      z-index: 0;
    }

    .ass-members__inner {
      position: relative; z-index: 2;
    }

    .ass-section-eyebrow {
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      text-align: center;
      margin-bottom: 12px;
    }
    .ass-section-eyebrow--purple { color: var(--purple); }
    .ass-section-eyebrow--green  { color: var(--green); }

    .ass-section-title {
      font-size: 44px;
      font-weight: 800;
      text-align: center;
      color: var(--navy);
      margin-bottom: 16px;
      line-height: 1.1;
    }
    .ass-section-title .ass-dot--coral { color: var(--coral); }
    .ass-section-title .ass-dot--green { color: var(--green); }

    .ass-section-rule {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      margin-bottom: 52px;
    }
    .ass-section-rule__bar {
      height: 3px;
      border-radius: 2px;
    }
    .ass-section-rule__bar--purple { width: 36px; background: var(--purple); }
    .ass-section-rule__bar--green  { width: 36px; background: var(--green); }
    .ass-section-rule__dot {
      width: 6px; height: 6px;
      border-radius: 50%;
    }
    .ass-section-rule__dot--coral { background: var(--coral); }
    .ass-section-rule__dot--green { background: var(--green); }

    /* Feature Cards */
    .ass-card {
      background: var(--white);
      border-radius: 20px;
      padding: 36px 28px 32px;
      text-align: center;
      box-shadow: 0 2px 20px rgba(0,0,0,0.05);
      height: 100%;
    }

    .ass-card__icon-wrap {
      width: 80px; height: 80px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 24px;
    }
    .ass-card__icon-wrap--lavender { background: #e8e3f8; }
    .ass-card__icon-wrap--mint     { background: #d4f4f0; }
    .ass-card__icon-wrap--peach    { background: #fce8de; }
    .ass-card__icon-wrap--purple2  { background: #ede9fa; }

    .ass-card__icon-wrap i {
      font-size: 30px;
    }
    .ass-card__icon-wrap--lavender i { color: #8b78d4; }
    .ass-card__icon-wrap--mint     i { color: #3dbf82; }
    .ass-card__icon-wrap--peach    i { color: var(--coral); }
    .ass-card__icon-wrap--purple2  i { color: var(--purple); }

    .ass-card__rule {
      height: 3px;
      width: 32px;
      border-radius: 2px;
      margin: 14px auto 18px;
    }
    .ass-card__rule--purple { background: var(--purple); }
    .ass-card__rule--green  { background: var(--green); }
    .ass-card__rule--coral  { background: var(--coral); }

    .ass-card__title {
      font-size: 18px;
      font-weight: 800;
      color: var(--navy);
      line-height: 1.35;
      margin-bottom: 0;
    }

    .ass-card__body {
      font-size: 17px;
      line-height: 1.6;
      color: var(--text);
      margin-top: 14px;
      text-align: center;
    }

    /* =============================================
       SECTION 3 — WHAT YOUR ASSOCIATION GETS
    ============================================= */
    .ass-assoc {
      background: #f4faf8;
      padding: 80px 60px;
      position: relative;
      overflow: hidden;
    }

    .ass-assoc::before {
      content: '';
      position: absolute;
      width: 280px; height: 320px;
      background: #c8ede9;
      border-radius: 0 50% 50% 0;
      top: -60px; left: -60px;
      z-index: 0;
    }
    .ass-assoc::after {
      content: '';
      position: absolute;
      width: 200px; height: 200px;
      background: #dfd9f5;
      border-radius: 50%;
      bottom: -50px; right: -30px;
      z-index: 0;
    }

    .ass-assoc__dots {
      position: absolute;
      top: 50px; left: 50px;
      z-index: 1;
      display: grid;
      grid-template-columns: repeat(3, 8px);
      gap: 6px;
    }
    .ass-assoc__dots span {
      width: 4px; height: 4px;
      background: #9ad5cb;
      border-radius: 50%;
      display: block;
    }

    .ass-assoc__inner { position: relative; z-index: 2; }

    /* Assoc cards — 5 columns */
    .ass-assoc-card {
      background: var(--white);
      border-radius: 20px;
      padding: 32px 20px 28px;
      text-align: center;
      box-shadow: 0 2px 16px rgba(0,0,0,0.05);
      height: 100%;
    }

    .ass-assoc-card__icon-wrap {
      width: 76px; height: 76px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 22px;
    }
    .ass-assoc-card__icon-wrap--teal   { background: #d4f0eb; }
    .ass-assoc-card__icon-wrap--mint2  { background: #c5ebe0; }
    .ass-assoc-card__icon-wrap--lavender{ background: #e5e0f8; }
    .ass-assoc-card__icon-wrap--peach2 { background: #fde7db; }
    .ass-assoc-card__icon-wrap--sand2  { background: #f0f0ec; }

    .ass-assoc-card__icon-wrap i { font-size: 28px; }
    .ass-assoc-card__icon-wrap--teal    i { color: #3dbf82; }
    .ass-assoc-card__icon-wrap--mint2   i { color: #3dbf82; }
    .ass-assoc-card__icon-wrap--lavender i { color: var(--purple); }
    .ass-assoc-card__icon-wrap--peach2  i { color: var(--coral); }
    .ass-assoc-card__icon-wrap--sand2   i { color: var(--muted); }

    .ass-assoc-card__rule {
      height: 3px;
      width: 32px;
      border-radius: 2px;
      background: var(--green);
      margin: 12px auto 16px;
    }

    .ass-assoc-card__title {
      font-size: 18px;
      font-weight: 800;
      color: var(--navy);
      line-height: 1.35;
      margin-bottom: 0;
    }

    .ass-assoc-card__body {
      font-size: 17px;
      line-height: 1.6;
      color: var(--text);
      margin-top: 12px;
    }

    /* Responsive tweaks */
    @media (max-width: 991px) {
      .ass-hero { padding: 40px 30px; }
      .ass-hero__headline { font-size: 36px; }
      .ass-hero__photo { width: 100%; }
      .ass-hero__badge { min-width: 200px; }
      .ass-members, .ass-assoc { padding: 60px 24px; }
      .ass-section-title { font-size: 34px; }
    }
    @media (max-width: 767px) {
      .ass-hero__badge { position: static; margin-top: 20px; }
      .ass-hero__img-col { flex-direction: column; }
    }

     /* ============================================================
       SHARED SECTION HEADER
    ============================================================ */
    .ass-section-eyebrow {
      font-size: 16px;
      font-weight: 600;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      text-align: center;
      margin-bottom: 12px;
    }
    .ass-section-eyebrow--purple { color: var(--purple); }
    .ass-section-eyebrow--green  { color: var(--green); }
    .ass-section-eyebrow--coral  { color: var(--coral); }
 
    .ass-section-title {
      font-size: 56px;
      font-weight: 800;
      text-align: center;
      color: var(--navy);
      line-height: 1.1;
      margin-bottom: 16px;
    }
    .ass-dot--coral { color: var(--coral); }
    .ass-dot--green { color: var(--green); }
 
    .ass-section-subtitle {
      text-align: center;
      font-size: 20px;
      line-height: 1.65;
      color: var(--muted);
      max-width: 620px;
      margin: 0 auto;
    }
 
    /* Shared dot grid decoration */
    .ass-dots-grid {
      display: grid;
      gap: 5px;
    }
    .ass-dots-grid span {
      width: 4px; height: 4px;
      background: #b0a8d4;
      border-radius: 50%;
      display: block;
    }
    .ass-dots-grid--teal span { background: #9ad5cb; }
 
    /* ============================================================
       SECTION 4 — HOW PARTNERING WORKS
    ============================================================ */
    .ass-how {
      background: linear-gradient(155deg, #ede8fb 0%, #f5f3ff 45%, #e8f7f5 100%);
      padding: 80px 60px;
      position: relative;
      overflow: hidden;
    }
 
    /* Blobs */
    .ass-how__blob-lavender {
      position: absolute;
      width: 280px; height: 280px;
      background: #ddd6f5;
      border-radius: 50%;
      bottom: -60px; left: -80px;
      z-index: 0;
    }
    .ass-how__blob-peach {
      position: absolute;
      width: 140px; height: 140px;
      background: #f5cfc0;
      border-radius: 50%;
      top: -30px; right: 60px;
      z-index: 0;
    }
    .ass-how__blob-teal {
      position: absolute;
      width: 100px; height: 100px;
      background: #c4ece8;
      border-radius: 50%;
      bottom: 40px; right: 20px;
      z-index: 0;
    }
    .ass-how__dots {
      position: absolute;
      top: 40px; left: 60px;
      z-index: 1;
      grid-template-columns: repeat(3, 8px);
    }
 
    .ass-how__inner { position: relative; z-index: 2; }
 
    /* Step cards */
    .ass-step-card {
      background: var(--white);
      border-radius: 20px;
      padding: 40px 32px 36px;
      text-align: center;
      box-shadow: 0 2px 20px rgba(0,0,0,0.05);
      position: relative;
      height: 100%;
    }
 
    .ass-step-number {
      position: absolute;
      top: -16px; left: 24px;
      font-size: 42px;
      font-weight: 800;
      line-height: 1;
    }
    .ass-step-number--purple { color: var(--purple); background: #eae5f8; padding: 20px; border-radius: 50%; }
    .ass-step-number--green  { color: var(--green); background: #d4f4f0; padding: 20px; border-radius: 50%; }
    .ass-step-number--coral  { color: var(--coral); background: #fce8de; padding: 20px; border-radius: 50%; }

    .ass-step-icon-wrap {
      width: 90px; height: 90px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      margin: 24px auto 28px;
    }
    .ass-step-icon-wrap--lavender { background: #eae5f8; }
    .ass-step-icon-wrap--mint     { background: #d4f4f0; }
    .ass-step-icon-wrap--peach    { background: #fce8de; }
 
    .ass-step-icon-wrap i { font-size: 34px; }
    .ass-step-icon-wrap--lavender i { color: var(--purple); }
    .ass-step-icon-wrap--mint     i { color: var(--green); }
    .ass-step-icon-wrap--peach    i { color: var(--coral); }
 
    .ass-step-rule {
      height: 3px; width: 32px;
      border-radius: 2px;
      margin: 10px auto 18px;
    }
    .ass-step-rule--purple { background: var(--purple); }
    .ass-step-rule--green  { background: var(--green); }
    .ass-step-rule--coral  { background: var(--coral); }
 
    .ass-step-title {
      font-size: 20px;
      font-weight: 800;
      color: var(--navy);
      margin-bottom: 0;
    }
 
    .ass-step-body {
      font-size: 18px;
      line-height: 1.65;
      color: var(--text);
      margin-top: 16px;
      text-align: center;
    }
 
    /* Dotted connector between steps */
    .ass-step-connector {
      display: flex;
      align-items: center;
      justify-content: center;
      padding-top: 80px;
    }
    .ass-step-connector__line {
      width: 60px;
      border-top: 2.5px dotted var(--purple);
    }
 
    /* ============================================================
       SECTION 5 — PRODUCT SUITE
    ============================================================ */
    .ass-products {
      background: linear-gradient(160deg, #f0ecff 0%, #f9f6ff 40%, #fce9e0 100%);
      padding: 80px 60px;
      position: relative;
      overflow: hidden;
    }
 
    .ass-products__blob-left {
      position: absolute;
      width: 300px; height: 380px;
      background: #ddd8f5;
      border-radius: 0 60% 60% 0;
      top: 60px; left: -80px;
      z-index: 0;
    }
    .ass-products__blob-peach {
      position: absolute;
      width: 110px; height: 110px;
      background: #f5cfc0;
      border-radius: 50%;
      top: 160px; left: 60px;
      z-index: 0;
    }
    .ass-products__blob-tr {
      position: absolute;
      width: 160px; height: 200px;
      background: #f5cfc0;
      border-radius: 50% 50% 0 0;
      top: -40px; right: -20px;
      z-index: 0;
    }
    .ass-products__blob-teal {
      position: absolute;
      width: 140px; height: 180px;
      background: #c4ece8;
      border-radius: 50%;
      bottom: 40px; right: 60px;
      z-index: 0;
    }
    .ass-products__dots-tr {
      position: absolute;
      top: 60px; right: 200px;
      z-index: 1;
      grid-template-columns: repeat(4, 8px);
    }
    .ass-products__dots-tr span { background: #9ad5cb; }
    .ass-products__dots-tl {
      position: absolute;
      top: 50px; left: 50px;
      z-index: 1;
      grid-template-columns: repeat(3, 8px);
    }
 
    .ass-products__inner { position: relative; z-index: 2; }
 
    /* Insurance product cards */
    .ass-prod-card {
      background: rgba(255,255,255,0.85);
      border-radius: 16px;
      padding: 36px 20px;
      text-align: center;
      box-shadow: 0 2px 16px rgba(0,0,0,0.05);
      height: 100%;
    }
 
    .ass-prod-card__icon-wrap {
      width: 80px; height: 80px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto 22px;
    }
    .ass-prod-card__icon-wrap--lavender { background: #e8e3f8; }
    .ass-prod-card__icon-wrap--mint     { background: #d4f4f0; }
    .ass-prod-card__icon-wrap--peach    { background: #fce8de; }
    .ass-prod-card__icon-wrap--purple2  { background: #ede9fa; }
 
    .ass-prod-card__icon-wrap i { font-size: 30px; }
    .ass-prod-card__icon-wrap--lavender i { color: var(--purple); }
    .ass-prod-card__icon-wrap--mint     i { color: var(--green); }
    .ass-prod-card__icon-wrap--peach    i { color: var(--coral); }
    .ass-prod-card__icon-wrap--purple2  i { color: var(--purple); }
 
    .ass-prod-card__title {
      font-size: 18px;
      font-weight: 800;
      color: var(--navy);
      margin-bottom: 0;
    }
 
    .ass-prod-card__rule {
      height: 3px; width: 32px;
      border-radius: 2px;
      margin: 12px auto 0;
    }
    .ass-prod-card__rule--purple { background: var(--purple); }
    .ass-prod-card__rule--green  { background: var(--green); }
    .ass-prod-card__rule--coral  { background: var(--coral); }
 
    /* ============================================================
       SECTION 6 — CTA / READY TO GIVE
    ============================================================ */
    .ass-cta {
      background: linear-gradient(160deg, #edeafa 0%, #f6f3ff 50%, #e8f0fa 100%);
      padding: 70px 60px 50px;
      position: relative;
      overflow: hidden;
    }
 
    .ass-cta__blob-left {
      position: absolute;
      width: 340px; height: 400px;
      background: #ddd8f4;
      border-radius: 0 60% 60% 0;
      bottom: -60px; left: -80px;
      z-index: 0;
    }
    .ass-cta__blob-peach-tr {
      position: absolute;
      width: 200px; height: 200px;
      background: #f5cfc0;
      border-radius: 50%;
      top: -50px; right: 200px;
      z-index: 0;
    }
    .ass-cta__blob-teal-br {
      position: absolute;
      width: 150px; height: 150px;
      background: #c4ece8;
      border-radius: 50%;
      bottom: 60px; right: 60px;
      z-index: 0;
    }
    .ass-cta__dots {
      position: absolute;
      top: 50px; left: 50px;
      z-index: 1;
      grid-template-columns: repeat(4, 8px);
    }
    .ass-cta__dots-right {
      position: absolute;
      bottom: 80px; right: 240px;
      z-index: 1;
      grid-template-columns: repeat(4, 8px);
    }
    .ass-cta__dots span,
    .ass-cta__dots-right span { background: #b0a8d4; }
 
    .ass-cta__inner { position: relative; z-index: 2; }
 
    /* Left column headline */
    .ass-cta__headline {
      font-size: 60px;
      font-weight: 800;
      color: var(--navy);
      line-height: 1.1;
      margin-bottom: 16px;
    }
 
    .ass-cta__rule-row {
      display: flex;
      gap: 6px;
      align-items: center;
      margin-bottom: 24px;
    }
    .ass-cta__rule-purple {
      width: 36px; height: 3px;
      background: var(--purple);
      border-radius: 2px;
    }
    .ass-cta__rule-coral {
      width: 20px; height: 3px;
      background: var(--coral);
      border-radius: 2px;
    }
 
    .ass-cta__body {
      font-size: 20px;
      line-height: 1.65;
      color: var(--text);
      max-width: 450px;
      margin-bottom: 36px;
    }
 
    .ass-cta__ctas {
      display: flex;
      gap: 16px;
      flex-wrap: wrap;
    }
 
    .ass-btn-primary {
      background: var(--navy);
      color: var(--white);
      border: none;
      border-radius: 8px;
      padding: 15px 28px;
      font-size: 15px;
      font-weight: 600;
      font-family: 'DM Sans', sans-serif;
      display: inline-flex; align-items: center; gap: 10px;
      cursor: pointer; text-decoration: none;
    }
    .ass-btn-primary:hover { background: #243560; color: var(--white); }
 
    .ass-btn-outline {
      background: transparent;
      color: var(--navy);
      border: 1.5px solid var(--navy);
      border-radius: 8px;
      padding: 14px 24px;
      font-size: 15px;
      font-weight: 500;
      font-family: 'DM Sans', sans-serif;
      display: inline-flex; align-items: center; gap: 8px;
      cursor: pointer; text-decoration: none;
    }
    .ass-btn-outline:hover { background: var(--navy); color: var(--white); }
 
    /* Right side — mock UI card */
    .ass-cta__mock-wrap {
      position: relative;
      display: flex;
      align-items: flex-start;
      justify-content: center;
    }
 
    /* Person circle images */
    .ass-cta__person {
      position: absolute;
      border-radius: 50%;
      overflow: hidden;
      border: 4px solid var(--white);
      box-shadow: 0 4px 20px rgba(0,0,0,0.12);
      object-fit: cover;
    }
    .ass-cta__person--tr {
      width: 100px; height: 100px;
      top: -80px; right: -10px;
    }
    .ass-cta__person--bl {
      width: 110px; height: 110px;
      bottom: -100px; left: 150px;
    }
 
    /* Shield badge */
    .ass-cta__shield {
      position: absolute;
      bottom: 50px; right: -10px;
      width: 70px; height: 70px;
      background: var(--lavender-bg);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      box-shadow: 0 4px 16px rgba(0,0,0,0.1);
    }
    .ass-cta__shield i { font-size: 32px; color: var(--purple); }
 
    /* Mock portal card */
    .ass-mock-card {
      background: var(--white);
      border-radius: 20px;
      box-shadow: 0 8px 40px rgba(0,0,0,0.1);
      padding: 0;
      overflow: hidden;
      width: 600px;
      max-width: 100%;
      position: relative;
      z-index: 2;
    }
 
    .ass-mock-card__header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 18px 24px;
      border-bottom: 1px solid #f0f0f0;
    }
    .ass-mock-card__logo {
      display: flex; align-items: center; gap: 8px;
    }
    .ass-mock-card__logo-icon {
      width: 28px; height: 28px;
      background: var(--navy);
      border-radius: 6px;
      display: flex; align-items: center; justify-content: center;
    }
    .ass-mock-card__logo-icon i { font-size: 14px; color: var(--white); }
    .ass-mock-card__logo-text {
      font-size: 13px;
      font-weight: 700;
      color: var(--navy);
      letter-spacing: 0.03em;
    }
    .ass-mock-card__powered {
      font-size: 11px;
      color: #999;
      display: flex; align-items: center; gap: 6px;
    }
    .ass-mock-card__powered span {
      font-weight: 700; color: var(--navy);
    }
 
    .ass-mock-card__body {
      display: flex;
      gap: 0;
    }
 
    /* Left panel */
    .ass-mock-card__left {
      padding: 24px;
      flex: 1;
      border-right: 1px solid #f0f0f0;
    }
    .ass-mock-card__left-title {
      font-size: 16px;
      font-weight: 700;
      color: var(--navy);
      margin-bottom: 16px;
    }
    .ass-mock-checklist {
      list-style: none;
      padding: 0; margin: 0 0 24px;
    }
    .ass-mock-checklist li {
      font-size: 13px;
      color: var(--text);
      display: flex; align-items: center; gap: 8px;
      margin-bottom: 10px;
    }
    .ass-mock-checklist li i {
      font-size: 13px;
      color: var(--purple);
      flex-shrink: 0;
    }
    .ass-mock-btn {
      background: var(--purple);
      color: var(--white);
      border: none;
      border-radius: 8px;
      padding: 12px 20px;
      font-size: 13px;
      font-weight: 600;
      font-family: 'DM Sans', sans-serif;
      width: 100%;
      cursor: pointer;
    }
 
    /* Right panel */
    .ass-mock-card__right {
      padding: 20px;
      width: 300px;
      flex-shrink: 0;
    }
    .ass-mock-card__right-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 16px;
    }
    .ass-mock-card__right-title {
      font-size: 12px;
      font-weight: 600;
      color: var(--navy);
    }
    .ass-mock-card__ai-badge {
      font-size: 10px;
      font-weight: 700;
      color: var(--purple);
      background: var(--lavender-bg);
      border-radius: 4px;
      padding: 2px 6px;
    }
 
    .ass-mock-quote-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 10px 0;
      border-bottom: 1px solid #f5f5f5;
    }
    .ass-mock-quote-row:last-child { border-bottom: none; }
    .ass-mock-quote-left {
      display: flex; align-items: center; gap: 8px;
    }
    .ass-mock-quote-icon {
      width: 28px; height: 28px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .ass-mock-quote-icon--lavender { background: #eae5f8; }
    .ass-mock-quote-icon--peach    { background: #fce8de; }
    .ass-mock-quote-icon--mint     { background: #d4f4f0; }
    .ass-mock-quote-icon--purple2  { background: #ede9fa; }
 
    .ass-mock-quote-icon i { font-size: 13px; }
    .ass-mock-quote-icon--lavender i { color: var(--purple); }
    .ass-mock-quote-icon--peach    i { color: var(--coral); }
    .ass-mock-quote-icon--mint     i { color: var(--green); }
    .ass-mock-quote-icon--purple2  i { color: var(--purple); }
 
    .ass-mock-quote-name {
      font-size: 12px;
      font-weight: 500;
      color: var(--navy);
    }
    .ass-mock-view-link {
      font-size: 11px;
      color: var(--muted);
      text-decoration: none;
      display: flex; align-items: center; gap: 3px;
      white-space: nowrap;
    }
    .ass-mock-view-link i { font-size: 10px; }
 
    /* Bottom stats bar */
    .ass-cta__stats {
      border-top: 1px solid rgba(0,0,0,0.06);
      padding-top: 32px;
      margin-top: 48px;
    }
 
    .ass-stat-item {
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .ass-stat-item__icon {
      width: 48px; height: 48px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .ass-stat-item__icon--lavender { background: #eae5f8; }
    .ass-stat-item__icon--mint     { background: #d4f4f0; }
    .ass-stat-item__icon--peach    { background: #fce8de; }
    .ass-stat-item__icon--purple2  { background: #ede9fa; }
 
    .ass-stat-item__icon i { font-size: 20px; }
    .ass-stat-item__icon--lavender i { color: var(--purple); }
    .ass-stat-item__icon--mint     i { color: var(--green); }
    .ass-stat-item__icon--peach    i { color: var(--coral); }
    .ass-stat-item__icon--purple2  i { color: var(--purple); }
 
    .ass-stat-item__text {
      font-size: 18px;
      font-weight: 500;
      color: var(--navy);
      line-height: 1.35;
    }
 
    /* Responsive */
    @media (max-width: 991px) {
      .ass-how, .ass-products, .ass-cta { padding: 60px 24px; }
      .ass-section-title { font-size: 34px; }
      .ass-cta__headline { font-size: 36px; }
      .ass-step-connector { display: none; }
      .ass-mock-card__right { display: none; }
      .ass-cta__person { display: none; }
      .ass-cta__shield { display: none; }
    }

     /* ─────────────────────────────────────────
       SHARED UTILITIES
    ───────────────────────────────────────── */
    .how-label {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .15em;
      color: var(--purple);
      text-transform: uppercase;
      margin-bottom: 14px;
    }
    .how-headline {
      font-size: 70px;
      font-weight: 700;
      line-height: 1.2;
      color: var(--navy);
    }
    .how-dot { color: var(--coral); }
    .how-divider {
      width: 36px; height: 3px;
      background: var(--green);
      border-radius: 2px;
      margin: 18px 0;
    }
    .how-body {
      font-size: 18px;
      color: var(--muted);
      line-height: 1.7;
    }
    .how-body a { color: var(--purple); text-decoration: none; }
    .how-btn-primary {
      background: var(--navy); color: #fff;
      border: none; border-radius: 8px;
      padding: 13px 22px; font-size: 15px; font-weight: 600;
      font-family: 'DM Sans', sans-serif;
      display: inline-flex; align-items: center; gap: 8px;
      cursor: pointer;
    }
    .how-btn-outline {
      background: transparent; color: var(--navy);
      border: 1.5px solid var(--navy); border-radius: 8px;
      padding: 12px 22px; font-size: 15px; font-weight: 600;
      font-family: 'DM Sans', sans-serif;
      display: inline-flex; align-items: center; gap: 8px;
      cursor: pointer;
    }
    .how-btn-purple {
      background: var(--purple); color: #fff;
      border: none; border-radius: 8px;
      padding: 11px 16px; font-size: 13px; font-weight: 600;
      font-family: 'DM Sans', sans-serif;
      display: inline-flex; align-items: center; gap: 6px;
      cursor: pointer; flex: 1; justify-content: center;
    }
    .how-btn-sm-outline {
      background: #fff; color: var(--navy);
      border: 1.5px solid #d0cce8; border-radius: 8px;
      padding: 11px 14px; font-size: 13px; font-weight: 600;
      font-family: 'DM Sans', sans-serif; cursor: pointer;
    }

    /* blobs */
    .how-blob {
      position: absolute;
      border-radius: 50%;
      pointer-events: none;
    }

    /* ─────────────────────────────────────────
       SECTION 1 — HOW IT WORKS
    ───────────────────────────────────────── */
    .how-s1 {
      position: relative;
      padding: 80px 64px;
      overflow: hidden;
      background: url("../img/how-it-works-banner.png") no-repeat center center;
      background-size: cover;
    }
    
    .how-s1 .how-dashed {
      position: absolute; top:30%; right:27%;
      width:200px; height:200px;
      border: 1.5px dashed #c8c0e0;
      border-radius: 50%; opacity:.5; pointer-events:none; z-index:0;
    }
    .how-s1 > .row { position: relative; z-index: 1; }

    /* Quote card */
    .how-quote-card {
      background: #fff;
      border-radius: 20px;
      padding: 28px;
      box-shadow: 0 8px 40px rgba(27,42,74,.09);
      position: relative;
    }
    .how-ai-badge {
      position: absolute; top:24px; right:24px;
      width:60px; height:60px; border-radius:50%;
      background: var(--lavender-bg);
      display:flex; align-items:center; justify-content:center;
      font-weight:700; color:var(--purple); font-size:13px;
    }
    .how-card-label {
      font-size:18px; font-weight:700; letter-spacing:.12em;
      color:var(--muted); text-transform:uppercase; margin-bottom:4px;
    }
    .how-card-title { font-size:28px; font-weight:700; color:var(--navy); margin-bottom:6px; }
    .how-card-sub {
      font-size:13px; color:var(--muted);
      display:flex; align-items:center; gap:6px; margin-bottom:18px;
    }
    .how-card-body {
      display:flex; gap:0;
      border:1px solid #ebe8f5; border-radius:14px; overflow:hidden;
    }
    .how-tabs { width:155px; padding:10px 0; border-right:1px solid #ebe8f5; flex-shrink:0; }
    .how-tab {
      padding:10px 13px; font-size:13px; color:var(--muted);
      display:flex; align-items:center; gap:7px;
      border-left:3px solid transparent; cursor:pointer;
    }
    .how-tab.how-tab-active {
      color:var(--navy); font-weight:600;
      border-left:3px solid var(--purple); background:#f9f8fe;
    }
    .how-tab-content { flex:1; padding:16px 16px; background: url("../img/bg-dashboard.png") no-repeat center center; background-size: cover; }
    .how-price-big { font-size:26px; font-weight:700; color:var(--navy); margin-bottom:2px; }
    .how-check-list { list-style:none; display:flex; flex-direction:column; gap:12px; margin-bottom:14px;padding: 0; }
    .how-check-list li { font-size:13px; color:var(--text); display:flex; align-items:center; gap:7px; }
    .how-check-list .bi { color:var(--green); font-size:15px; }
    .how-card-actions { display:flex; gap:10px; }

    /* Stats row */
    .how-stat-card {
      background:#fff; border-radius:14px;
      padding:18px 12px; text-align:center;
      box-shadow:0 2px 12px rgba(27,42,74,.07);
    }
    .how-stat-icon {
      width:40px; height:40px; border-radius:50%;
      margin:0 auto 10px;
      display:flex; align-items:center; justify-content:center; font-size:18px;
    }
    .how-stat-icon.purple { background:var(--lavender-bg); color:var(--purple); }
    .how-stat-icon.green  { background:#d4f5ec; color:var(--green); }
    .how-stat-icon.peach  { background:#fde8de; color:var(--peach); }
    .how-stat-icon.lavender { background:var(--lavender-bg); color:var(--lavender-mid); }
    .how-stat-title { font-size:18px; font-weight:700; color:var(--navy); margin-bottom:3px; }
    .how-stat-sub   { font-size:14px; color:var(--muted); line-height:1.4; }

    /* ─────────────────────────────────────────
       SECTION 2 — THREE STEPS
    ───────────────────────────────────────── */
    .how-s2 {
      position: relative;
      padding: 80px 64px;
      overflow: hidden;
      text-align: center;
    }
    .how-s2 .how-blob-5 { width:180px; height:180px; background:#fde3d4; top:20px; left:-40px; opacity:.45; }
    .how-s2 .how-blob-6 { width:140px; height:140px; background:var(--lavender-bg); top:10px; right:-20px; opacity:.5; }
    .how-s2 > * { position: relative; z-index:1; }
    .how-s2-title { font-size:56px; font-weight:700; color:var(--navy); margin-bottom:12px; }
    .how-s2-sub   { font-size:20px; color:var(--muted); }

    .how-step-card {
      background:#fff; border-radius:20px;
      padding:32px 28px; text-align:left;
      position:relative; overflow:hidden; height:100%;
    }
    .how-step-num { font-size:48px; font-weight:700; color:var(--purple); opacity:.55; line-height:1; margin-bottom:50px; }
    .how-step-title { font-size:32px; font-weight:700; color:var(--navy); line-height:1.25; margin-bottom:4px; max-width: 75%; }
    .how-step-accent { width:28px; height:3px; background:var(--green); border-radius:2px; margin:10px 0 14px; }
    .how-step-body { font-size:20px; color:var(--muted); line-height:1.7; max-width: 90%; }

    /* step illustration floats */
    .how-step-illo { position:absolute; right:18px; top:26px; }
    .how-step-illo .how-illo-box {
      width:120px; height:120px; background:var(--lavender-bg);
      border-radius:16px; display:flex; align-items:center; justify-content:center;
    }
    .how-step-illo .how-illo-box .bi { font-size:64px; color:var(--purple); }
    .how-step-illo .how-illo-badge {
      width:40px; height:40px; background:#d4f5ec; border-radius:50%;
      display:flex; align-items:center; justify-content:center;
      margin-top:-10px; margin-left:auto;
    }
    .how-step-illo .how-illo-badge .bi { font-size:20px; color:var(--green); }

    .how-mock-ai {
      display:flex; flex-direction:column; gap:5px; width:120px;
    }
    .how-mock-ai .how-ai-chip {
      background:var(--purple); border-radius:10px;
      padding:7px 10px; font-size:13px; font-weight:700; color:#fff; text-align:center;
    }
    .how-mock-row { display:flex; align-items:center; gap:5px; }
    .how-mock-row .bi { color:var(--muted); font-size:12px; }
    .how-mock-row .bi-check2 { color:var(--green); font-size:12px; }
    .how-mock-line { height:7px; border-radius:3px; background:#e8e6f5; flex:1; }
    .how-mock-btn  {
      margin-top:6px; background:var(--purple); border-radius:6px;
      height:24px; width:60px;
      display:flex; align-items:center; justify-content:center;
    }
    .how-mock-btn .bi { color:#fff; font-size:13px; }

    .how-mock-receipt { display:flex; flex-direction:column; gap:4px; width:120px; }
    .how-mock-receipt .how-price { font-size:12px; font-weight:700; color:var(--navy); }
    .how-mock-receipt .how-price-small { font-size:9px; color:var(--muted); }
    .how-mock-receipt .how-r-row { display:flex; align-items:center; gap:4px; }
    .how-mock-receipt .how-r-row .bi { color:var(--green); font-size:11px; }
    .how-mock-receipt .how-r-line { height:6px; border-radius:3px; background:#e8e6f5; flex:1; }
    .how-mock-receipt .how-shield-sm {
      width:32px; height:32px; background:var(--lavender-bg); border-radius:8px;
      display:flex; align-items:center; justify-content:center; margin-top:4px; margin-left:auto;
    }
    .how-mock-receipt .how-shield-sm .bi { color:var(--purple); font-size:16px; }

    /* ─────────────────────────────────────────
       SECTION 3 — PROMISE
    ───────────────────────────────────────── */
    .how-s3 {
      position: relative;
      padding: 80px 64px;
      overflow: hidden;
      text-align: center;
    }
    .how-s3 .how-blob-7 { width:200px; height:200px; background:var(--lavender-bg); top:40px; left:-50px; opacity:.5; }
    .how-s3 .how-blob-8 { width:160px; height:160px; background:#fde3d4; bottom:40px; right:-30px; opacity:.4; }
    .how-s3 > * { position:relative; z-index:1; }
    .how-s3-title { font-size:56px; font-weight:700; color:var(--navy); margin-bottom:10px; }
    .how-s3-sub   { font-size:20px; color:var(--muted); max-width:640px; margin:0 auto; }

    .how-promise-card {
      background:#fff; border-radius:20px;
      padding:32px 28px; text-align:left;
      position:relative; overflow:hidden; height:100%;
    }
    .how-promise-tag { font-size:18px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; margin-bottom:8px; }
    .how-promise-tag.green { color:var(--green); }
    .how-promise-tag.coral { color:var(--coral); }
    .how-promise-title { font-size:52px; font-weight:700; color:var(--navy); line-height:1.25; margin-bottom:4px;max-width: 80%; }
    .how-promise-accent { width:28px; height:3px; border-radius:2px; margin:12px 0 20px; }
    .how-promise-accent.green { background:var(--green); }
    .how-promise-accent.coral { background:var(--coral); }

    .how-promise-list { list-style:none; display:flex; flex-direction:column; gap:30px; padding: 0; }
    .how-promise-list li {
      font-size:20px; color:var(--text);
      display:flex; align-items:flex-start; gap:10px; line-height:1.5; max-width: 75%;
    }
    .how-ci {
      width:48px; height:48px; border-radius:50%;
      display:flex; align-items:center; justify-content:center;
      flex-shrink:0; margin-top:1px;
    }
    .how-ci.green { background:#d4f5ec; }
    .how-ci.coral { background:#fde8de; }
    .how-ci.green .bi { color:var(--green); font-size:32px; }
    .how-ci.coral .bi { color:var(--coral); font-size:32px; }

    .how-promise-badge {
      position:absolute; top:28px; right:28px;
      width:100px; height:100px; border-radius:50%;
      display:flex; align-items:center; justify-content:center;
    }
    .how-promise-badge.green-bg { background:#d4f5ec; }
    .how-promise-badge.coral-bg { background:#fde8de; }
    .how-promise-badge.green-bg .bi { color:var(--green); font-size:54px; }
    .how-promise-badge.coral-bg .bi { color:var(--coral); font-size:54px; }

    /* ─────────────────────────────────────────
       SHARED
    ───────────────────────────────────────── */
    .how-label {
      font-size: 18px;
      font-weight: 700;
      letter-spacing: .15em;
      color: var(--purple);
      text-transform: uppercase;
      margin-bottom: 14px;
    }
    .how-dot { color: var(--coral); }
    .how-divider {
      width: 36px; height: 3px;
      background: var(--green);
      border-radius: 2px;
      margin: 20px 0;
    }
    .how-blob {
      position: absolute;
      border-radius: 50%;
      pointer-events: none;
    }
    .how-btn-primary {
      background: var(--navy); color: #fff;
      border: none; border-radius: 8px;
      padding: 13px 22px; font-size: 15px; font-weight: 600;
      font-family: 'DM Sans', sans-serif;
      display: inline-flex; align-items: center; gap: 8px;
      cursor: pointer;
    }
    .how-btn-outline {
      background: transparent; color: var(--navy);
      border: 1.5px solid var(--navy); border-radius: 8px;
      padding: 12px 22px; font-size: 15px; font-weight: 600;
      font-family: 'DM Sans', sans-serif;
      display: inline-flex; align-items: center; gap: 8px;
      cursor: pointer;
    }
 
    /* ─────────────────────────────────────────
       SECTION 4 — AI QUOTE TOOL
    ───────────────────────────────────────── */
    .how-s4 {
      position: relative;
      padding: 80px 64px;
      overflow: hidden;
    }
    .how-s4 .how-b1 { width:280px; height:280px; background:var(--lavender-bg); top:-60px; right:-60px; opacity:.55; z-index:0; }
    .how-s4 .how-b2 { width:200px; height:200px; background:#fde3d4; bottom:-20px; right:200px; opacity:.45; z-index:0; }
    .how-s4 .how-b3 { width:90px;  height:90px;  background:var(--mint); bottom:60px; left:38%; opacity:.4; z-index:0; }
    .how-s4 .how-b4 { width:160px; height:160px; background:var(--lavender-bg); bottom:30px; left:-40px; opacity:.45; z-index:0; }
    .how-s4 .how-b5 { width:60px;  height:60px;  background:var(--purple); bottom:160px; left:46%; opacity:.18; z-index:0; }
    .how-s4 .how-dashed {
      position:absolute; top:20%; right:26%;
      width:220px; height:220px;
      border:1.5px dashed #c8c0e0; border-radius:50%;
      opacity:.45; pointer-events:none; z-index:0;
    }
    .how-s4 > .row { position: relative; z-index: 1; }
 
    /* Headline */
    .how-s4-headline {
      font-family: 'DM Serif Display', serif;
      font-size: 84px;
      font-weight: 400;
      line-height: 1.1;
      color: var(--navy);
      margin-bottom: 8px;
    }
    .how-s4-body {
      font-size: 20px;
      color: var(--muted);
      line-height: 1.75;
      margin-bottom: 28px;
    }
    .how-s4-body a { color: var(--purple); text-decoration: none; }
 
    /* FAQ Cards */
    .how-faq-card {
      background: #fff;
      border-radius: 16px;
      padding: 22px 24px;
      display: flex;
      align-items: flex-start;
      gap: 20px;
      box-shadow: 0 2px 14px rgba(27,42,74,.07);
    }
    .how-faq-icon {
      width: 64px; height: 64px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .how-faq-icon.purple { background: var(--lavender-bg); }
    .how-faq-icon.green  { background: #d4f5ec; }
    .how-faq-icon.peach  { background: #fde8de; }
    .how-faq-icon .bi { font-size: 26px; }
    .how-faq-icon.purple .bi { color: var(--purple); }
    .how-faq-icon.green  .bi { color: var(--green); }
    .how-faq-icon.peach  .bi { color: var(--peach); }
    .how-faq-title {
      font-size: 24px; font-weight: 700;
      color: var(--navy); margin-bottom: 5px;
    }
    .how-faq-body { font-size: 18px; color: var(--muted); line-height: 1.6; }
 
    /* ─────────────────────────────────────────
       SECTION 5 — HERO / CTA
    ───────────────────────────────────────── */
    .how-s5 {
      position: relative;
      padding: 60px 48px 0;
      overflow: hidden;
    }
    /* outer rounded card */
    .how-s5-wrap {
      background: #fff;
      border-radius: 28px;
      padding: 64px 56px 0;
      position: relative;
      overflow: hidden;
    }
    .how-s5 .how-b6  { width:240px; height:240px; background:var(--lavender-bg); top:-40px; right:120px; opacity:.55; z-index:0; }
    .how-s5 .how-b7  { width:200px; height:200px; background:#fde3d4;            top:-20px; right:-30px; opacity:.45; z-index:0; }
    .how-s5 .how-b8  { width:160px; height:160px; background:var(--lavender-bg); bottom:80px; left:-40px; opacity:.45; z-index:0; }
    .how-s5 .how-b9  { width:180px; height:180px; background:var(--mint);        bottom:60px; right:-30px; opacity:.3; z-index:0; }
    .how-s5 .how-dashed2 {
      position:absolute; bottom:60px; left:30px;
      width:160px; height:160px;
      border:1.5px dashed #c8c0e0; border-radius:50%;
      opacity:.4; pointer-events:none; z-index:0;
    }
    .how-s5-wrap > .row { position: relative; z-index: 1; }
 
    /* Left */
    .how-s5-headline {
      font-family: 'DM Serif Display', serif;
      font-size: 76px;
      font-weight: 500;
      line-height: 1.1;
      color: var(--navy);
      margin-bottom: 20px;
    }
    .how-s5-body {
      font-size: 20px;
      color: var(--muted);
      line-height: 1.75;
      margin-bottom: 32px;
    }
 
    /* Quote preview card */
    .how-preview-card {
      background: url("../img/bg-dashboard.png") no-repeat center center;
      background-size: cover;
      border-radius: 20px;
      padding: 50px 28px 0;
      box-shadow: 0 8px 40px rgba(27,42,74,.09);
      position: relative;
      overflow: hidden;
      height: 100%;
    }
    .how-preview-ai-badge {
      position: absolute; top: 22px; right: 22px;
      width: 80px; height: 80px; border-radius: 50%;
      background: var(--lavender-bg);
      display: flex; align-items: center; justify-content: center;
      font-weight: 700; color: var(--purple); font-size: 32px;
    }
    .how-preview-label {
      font-size: 16px; font-weight: 700; letter-spacing: .12em;
      color: var(--muted); text-transform: uppercase; margin-bottom: 16px;
    }
    .how-preview-title {
      font-family: 'DM Serif Display', serif;
      font-size: 44px; color: var(--navy); margin-bottom: 50px;
    }
    .how-preview-list { list-style: none; display: flex; flex-direction: column; gap: 22px; margin-bottom: 100px; }
    .how-preview-list li {
      font-size: 20px; color: var(--text);
      display: flex; align-items: center; gap: 20px;
    }
    .how-preview-list .bi { color: var(--green); font-size: 24px; }
 
    /* shield illustration area */
    .how-preview-bottom {
      position: relative;
      height: 120px;
      margin: 0 -28px;
    }
    .how-preview-blob-g {
      position: absolute; bottom: 0; left: 0; right: 0; top: 0;
      background: linear-gradient(135deg, #e8f5ef 0%, #ddf5f0 50%, #d8e8f5 100%);
      border-radius: 0 0 20px 20px;
    }
    .how-preview-blob-p {
      position: absolute; width: 100px; height: 100px;
      border-radius: 50%; background: var(--lavender-bg);
      right: 20px; top: -10px; opacity: .7;
    }
    .how-preview-shield {
      position: absolute; right: 28px; top: 10px;
      width: 80px; height: 90px;
      background: var(--purple);
      border-radius: 50% 50% 45% 45% / 55% 55% 45% 45%;
      display: flex; align-items: center; justify-content: center;
      box-shadow: 0 8px 24px rgba(154,136,214,.4);
    }
    .how-preview-shield .bi { font-size: 36px; color: #fff; }
 
    /* Bottom stats bar */
    .how-s5-stats {
      border-top: 1px solid #ebe8f5;
      padding: 24px 0 28px;
      margin-top: 32px;
    }
    .how-s5-stat {
      display: flex; align-items: center; gap: 16px; justify-content: center;
    }
    .how-s5-stat-icon {
      width: 64px; height: 64px; border-radius: 50%;
      display: flex; align-items: center; justify-content: center; flex-shrink: 0;
    }
    .how-s5-stat-icon.purple { background: var(--lavender-bg); }
    .how-s5-stat-icon.green  { background: #d4f5ec; }
    .how-s5-stat-icon.peach  { background: #fde8de; }
    .how-s5-stat-icon .bi { font-size: 28px; }
    .how-s5-stat-icon.purple .bi { color: var(--purple); }
    .how-s5-stat-icon.green  .bi { color: var(--green); }
    .how-s5-stat-icon.peach  .bi { color: var(--peach); }
    .how-s5-stat-title { font-size: 20px; font-weight: 700; color: var(--navy); margin-bottom: 2px; }
    .how-s5-stat-sub   { font-size: 18px; color: var(--muted); line-height: 1.4; }
    .how-s5-divider    { width: 1px; background: #e0ddf0; align-self: stretch; flex-shrink: 0; }

    /* ══════════════════════════════════════════════════════════
   SECTION 1 — WHO WE ARE (HERO)
══════════════════════════════════════════════════════════ */
.nabt-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: stretch;
  overflow: hidden;
  background: url("../img/abt-banner-new.png") no-repeat center top/cover;
}

/* Left photo half */
.nabt-hero__photo-col {
  position: relative;
  flex: 0 0 48%;
  max-width: 48%;
  overflow: hidden;
}

.nabt-hero__photo-col img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}

/* Gradient overlay on photo */
.nabt-hero__photo-col::after {
  content: '';
  position: absolute;
  inset: 0;
  
}

/* Decorative blobs on photo */
.nabt-hero__blob {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: 3;
}
.nabt-hero__blob--mint {
  width: 160px; height: 160px;
  background: var(--mint);
  bottom: -20px; left: -20px;
  border-radius: 50% 50% 50% 0;
  opacity: .75;
}
.nabt-hero__blob--coral {
  width: 90px; height: 90px;
  background: var(--coral);
  bottom: 90px; left: 110px;
  border-radius: 50% 0 50% 50%;
  opacity: .85;
}
.nabt-hero__blob--lavender {
  width: 120px; height: 100px;
  background: var(--lavender-bg);
  top: 30px; right: -20px;
  border-radius: 55% 45% 60% 40% / 45% 55% 50% 50%;
  opacity: .6;
}

/* Right content col */
.nabt-hero__content-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 60px 72px 60px 80px;
  position: relative;
  z-index: 2;
}

/* Background blob top right of content */
.nabt-hero__content-col::before {
  content: '';
  position: absolute;
  width: 280px; height: 260px;
  background: var(--lavender-bg);
  border-radius: 55% 45% 60% 40% / 50% 60% 45% 55%;
  top: -40px; right: -40px;
  opacity: .4;
  pointer-events: none;
}

.nabt-hero__eyebrow {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--purple);
  margin-bottom: 22px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.nabt-hero__eyebrow::before {
  content: '';
  display: inline-block;
  width: 28px; height: 2px;
  background: var(--purple);
  border-radius: 2px;
}

.nabt-hero__heading {
  font-family: 'Playfair Display', serif;
  font-weight: 400;
  font-size: clamp(44px, 5.5vw, 72px);
  line-height: 1.08;
  color: var(--navy);
  margin-bottom: 10px;
}
.nabt-hero__heading .nabt-dot { color: var(--coral); }

.nabt-hero__rule {
  width: 44px; height: 3px;
  background: var(--mint);
  border-radius: 2px;
  margin: 28px 0 26px;
}

.nabt-hero__body {
  font-size: 18px;
  line-height: 1.8;
  color: var(--muted);
  max-width: 460px;
  margin-bottom: 40px;
  font-weight: 400;
}
.nabt-hero__body strong { color: var(--navy); font-weight: 600; }

/* Floating stat pills */
.nabt-hero__stats {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 40px;
}
.nabt-hero__stat-pill {
  background: var(--white);
  border-radius: 50px;
  padding: 12px 22px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0 2px 16px rgba(27,42,74,.07);
}
.nabt-hero__stat-icon {
  width: 38px; height: 38px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.nabt-hero__stat-icon--purple { background: var(--lavender-bg); }
.nabt-hero__stat-icon--mint   { background: #d4f5ec; }
.nabt-hero__stat-icon--peach  { background: #fde8de; }
.nabt-hero__stat-icon svg { width: 18px; height: 18px; }
.nabt-hero__stat-text {
  font-size: 13px;
  font-weight: 600;
  color: var(--navy);
  line-height: 1.3;
}
.nabt-hero__stat-text span { display: block; font-size: 11px; color: var(--muted); font-weight: 400; }

/* CTA */
.nabt-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: var(--navy);
  color: var(--white);
  border: none;
  border-radius: 8px;
  padding: 15px 30px;
  font-family: 'DM Sans', sans-serif;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
  transition: background .2s, transform .15s;
}
.nabt-btn-primary:hover { background: #253560; color: var(--white); transform: translateX(3px); }
.nabt-btn-primary svg { width: 16px; height: 16px; }

.nabt-btn-outline {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: transparent;
  color: var(--navy);
  border: 1.5px solid var(--navy);
  border-radius: 8px;
  padding: 14px 28px;
  font-family: 'DM Sans', sans-serif;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
  transition: background .2s, color .2s;
}
.nabt-btn-outline:hover { background: var(--navy); color: var(--white); }

/* Vertical label */
.nabt-hero__vert-label {
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%) rotate(-90deg);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--muted);
  white-space: nowrap;
  z-index: 5;
  opacity: .6;
}

/* ══════════════════════════════════════════════════════════
   SECTION 2 — WHY WE BUILT MEMBERS CHOICE
══════════════════════════════════════════════════════════ */
.nabt-why {
  position: relative;
  padding: 100px 0 110px;
  overflow: hidden;
  background: var(--white);
}

/* Large decorative blob top left */
.nabt-why::before {
  content: '';
  position: absolute;
  width: 400px; height: 360px;
  background: var(--lavender-bg);
  border-radius: 55% 45% 60% 40% / 50% 60% 45% 55%;
  top: -80px; left: -80px;
  opacity: .35;
  pointer-events: none;
}

/* Bottom right peach blob */
.nabt-why::after {
  content: '';
  position: absolute;
  width: 260px; height: 240px;
  background: #fde8de;
  border-radius: 45% 55% 40% 60% / 60% 40% 55% 45%;
  bottom: -40px; right: -40px;
  opacity: .45;
  pointer-events: none;
}

.nabt-why__eyebrow {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--purple);
  margin-bottom: 18px;
}

.nabt-why__heading {
  font-family: 'Playfair Display', serif;
  font-weight: 400;
  font-size: clamp(36px, 4.8vw, 58px);
  line-height: 1.12;
  color: var(--navy);
  margin-bottom: 10px;
}
.nabt-why__heading .nabt-dot { color: var(--coral); }

.nabt-why__rule {
  width: 44px; height: 3px;
  background: var(--mint);
  border-radius: 2px;
  margin-bottom: 28px;
}

.nabt-why__body {
  font-size: 18px;
  line-height: 1.85;
  color: var(--muted);
  margin-bottom: 44px;
  max-width: 520px;
}

/* Belief quote block */
.nabt-why__quote {
  position: relative;
  background: var(--sand);
  border-radius: 20px;
  padding: 36px 40px 36px 52px;
  max-width: 540px;
  margin-bottom: 40px;
}
.nabt-why__quote::before {
  content: '\201C';
  font-family: 'Playfair Display', serif;
  font-size: 80px;
  line-height: 0.7;
  color: var(--coral);
  position: absolute;
  top: 28px; left: 18px;
  user-select: none;
}
.nabt-why__quote-text {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: 20px;
  line-height: 1.6;
  color: var(--navy);
}
.nabt-why__quote-rule {
  width: 32px; height: 2.5px;
  background: var(--mint);
  border-radius: 2px;
  margin-top: 18px;
}

/* Right column — two card stack */
.nabt-why__cards {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-left: 20px;
}

.nabt-why-card {
  background: var(--sand);
  border-radius: 20px;
  padding: 32px 28px;
  display: flex;
  align-items: flex-start;
  gap: 20px;
  position: relative;
  overflow: hidden;
  transition: box-shadow .2s;
}
.nabt-why-card:hover { box-shadow: 0 8px 28px rgba(27,42,74,.09); }

.nabt-why-card__accent {
  position: absolute;
  top: 0; left: 0;
  width: 4px; height: 100%;
  border-radius: 20px 0 0 20px;
}
.nabt-why-card__accent--purple { background: var(--purple); }
.nabt-why-card__accent--mint   { background: var(--mint); }
.nabt-why-card__accent--coral  { background: var(--coral); }

.nabt-why-card__icon {
  width: 56px; height: 56px;
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.nabt-why-card__icon--purple { background: var(--lavender-bg); }
.nabt-why-card__icon--mint   { background: #d4f5ec; }
.nabt-why-card__icon--coral  { background: #fde8de; }
.nabt-why-card__icon svg { width: 28px; height: 28px; }

.nabt-why-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 8px;
}
.nabt-why-card__body {
  font-size: 15px;
  line-height: 1.7;
  color: var(--muted);
}

/* ══════════════════════════════════════════════════════════
   SECTION 3 — SHAPED BY EXPERIENCE
══════════════════════════════════════════════════════════ */
.nabt-exp {
  position: relative;
  padding: 100px 0 0;
  overflow: hidden;
  background: var(--sand);
}

/* Blobs */
.nabt-exp__blob-tr {
  position: absolute;
  width: 220px; height: 200px;
  background: var(--lavender-bg);
  top: -20px; right: -30px;
  border-radius: 45% 55% 40% 60% / 60% 40% 55% 45%;
  opacity: .5;
  pointer-events: none;
}
.nabt-exp__blob-bl {
  position: absolute;
  width: 180px; height: 160px;
  background: #fde8de;
  bottom: 0; left: -30px;
  border-radius: 55% 45% 60% 40% / 50% 60% 45% 55%;
  opacity: .45;
  pointer-events: none;
}

.nabt-exp__eyebrow {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--purple);
  margin-bottom: 18px;
  text-align: center;
}

.nabt-exp__heading {
  font-family: 'Playfair Display', serif;
  font-weight: 400;
  font-size: clamp(36px, 4.5vw, 58px);
  line-height: 1.12;
  color: var(--navy);
  margin-bottom: 10px;
  text-align: center;
}
.nabt-exp__heading .nabt-dot { color: var(--coral); }

.nabt-exp__rule {
  width: 44px; height: 3px;
  background: var(--mint);
  border-radius: 2px;
  margin: 0 auto 26px;
}

.nabt-exp__intro {
  font-size: 18px;
  line-height: 1.8;
  color: var(--muted);
  max-width: 640px;
  margin: 0 auto 70px;
  text-align: center;
}

  /* ── Outer card (NABT prefix) ── */
    .nabt-shaped-card {
      background: #faf9f7;
      border-radius: 24px;
      width: 100%;
      padding: 60px 64px 40px;
      position: relative;
      overflow: hidden;
      box-shadow: 0 8px 40px rgba(27,42,74,.07);
    }

    /* Lavender blob top-left (decorative) */
    .nabt-shaped-card::before {
      content: '';
      position: absolute;
      top: -60px; left: -80px;
      width: 260px; height: 260px;
      background: #e8e4f5;
      border-radius: 50%;
      opacity: .7;
      pointer-events: none;
    }

    /* ── Australia dot map (pure CSS, NABT namespace) ── */
    .nabt-aus-map {
      position: absolute;
      top: 40px; right: 100px;
      width: 200px; height: 160px;
      pointer-events: none;
      opacity: .22;
    }
    .nabt-aus-map svg { width: 100%; height: 100%; }

    /* ── Top section: heading + body ── */
    .nabt-shaped-top {
      position: relative;
      z-index: 2;
      padding-bottom: 40px;
    }

    .nabt-shaped-heading {
      font-family: 'Cormorant Garamond', Georgia, serif;
      font-size: clamp(2.8rem, 5.5vw, 4.4rem);
      font-weight: 600;
      color: #1a1a1a;
      line-height: 1.1;
      margin-bottom: 28px;
      letter-spacing: -.01em;
    }
    .nabt-shaped-heading .nabt-dot {
      color: var(--nabt-coral);
    }

    .nabt-shaped-body {
      font-size: 18px;
      font-weight: 300;
      line-height: 1.85;
      color: #555f6e;
      max-width: 720px;
    }

    /* ── Bottom strip (NABT) ── */
    .nabt-shaped-strip {
      background: #ece9f4;
      border-radius: 16px;
      padding: 0 64px;
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      position: relative;
      z-index: 2;
    }

    .nabt-strip-item {
      display: flex;
      align-items: center;
      gap: 20px;
      padding: 28px 0;
    }
    .nabt-strip-item + .nabt-strip-item {
      border-left: 1px solid rgba(154,136,214,.25);
      padding-left: 40px;
    }

    /* Icon circles */
    .nabt-strip-icon {
      width: 60px; height: 60px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .nabt-ic-mint   { background: #d4f2ee; }
    .nabt-ic-purple { background: #ddd8f5; }
    .nabt-ic-teal   { background: #d4f2ee; }

    .nabt-strip-icon svg {
      width: 26px; height: 26px;
      stroke-width: 1.5;
    }

    .nabt-strip-label {
      font-size: 22px;
      font-weight: 500;
      color: #2c2c3a;
      letter-spacing: -.01em;
    }

    /* Responsive adjustments */
    @media (max-width: 767px) {
      .nabt-shaped-card { padding: 44px 28px 0; }
      .nabt-shaped-strip { margin: 0 -28px; padding: 0 28px; grid-template-columns: 1fr; }
      .nabt-strip-item + .nabt-strip-item { border-left: none; border-top: 1px solid rgba(154,136,214,.25); padding-left: 0; }
      .nabt-aus-map { width: 130px; height: 104px; top: 24px; right: 24px; }
    }

    /* accessibility focus hint */
    .nabt-strip-item:focus-within {
      outline: 2px solid var(--nabt-coral);
      outline-offset: 2px;
      border-radius: 28px;
    }
/* ── Responsive ── */
@media (max-width: 991px) {
  .nabt-hero { flex-direction: column; }
  .nabt-hero__photo-col { display: none; max-width: 100%; height: 55vw; max-height: 380px; }
  .nabt-hero__photo-col::after { background: linear-gradient(to bottom, transparent 60%, var(--sand) 100%); }
  .nabt-hero__content-col { padding: 40px 28px 60px; }
  .nabt-hero__vert-label { display: none; }
  .nabt-why__cards { padding-left: 0; margin-top: 40px; }
  .nabt-exp__pillars { grid-template-columns: 1fr; }
  .nabt-exp__pillar { border-right: none; border-bottom: 1px solid rgba(0,0,0,.07); padding: 44px 28px; }
  .nabt-exp__pillar:last-child { border-bottom: none; }
  .nabt-exp__cta-strip { padding: 44px 32px; flex-direction: column; align-items: flex-start; }
}

@media (max-width: 575px) {
  .nabt-hero__stats { flex-direction: column; }
  .nabt-why { padding: 72px 0 80px; }
  .nabt-exp { padding: 72px 0 0; }
  .nabt-hero__photo-col {display: none;}
}

 /* ── Main Card (NABT prefix) ── */

 .nabt-partner{
   min-height: 80vh;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 40px 16px;
      background: #faf9f7;
 }
    .nabt-partner-card {
      max-width: 1100px;
      width: 100%;
      border-radius: 28px;
      background: var(--navy);
      position: relative;
      overflow: hidden;
      padding: 96px 40px;
      text-align: center;
    }

    /* ── decorative abstract blob (left) using NABT namespace ── */
    .nabt-blob-deco {
      position: absolute;
      top: -30%;
      left: -15%;
      width: 340px;
      height: 340px;
      background: rgba(154,136,214,0.12);
      border-radius: 50%;
      filter: blur(70px);
      pointer-events: none;
      z-index: 0;
    }
    /* right side accent blob */
    .nabt-blob-deco-right {
      position: absolute;
      bottom: -25%;
      right: -10%;
      width: 280px;
      height: 280px;
      background: rgba(107,209,197,0.1);
      border-radius: 50%;
      filter: blur(65px);
      pointer-events: none;
      z-index: 0;
    }

    /* subtle dot-grid pattern overlay */
    .nabt-dot-overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-image: radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1px);
      background-size: 28px 28px;
      pointer-events: none;
      z-index: 0;
    }

    /* ── Content (all custom classes) ── */
    .nabt-partner-content {
      position: relative;
      z-index: 2;
    }

    .nabt-partner-heading {
      font-family: 'Cormorant Garamond', Georgia, serif;
      font-size: clamp(2.8rem, 6vw, 5.2rem);
      font-weight: 600;
      color: var(--white);
      line-height: 1.1;
      letter-spacing: -.01em;
      margin-bottom: 20px;
    }
    .nabt-partner-heading .nabt-dot { 
      color: var(--nabt-coral); 
    }

    .nabt-partner-sub {
      font-size: 18px;
      font-weight: 300;
      color: rgba(255,255,255,.65);
      max-width: 520px;
      margin: 0 auto 40px;
      line-height: 1.7;
    }

    /* ── CTA Button (NABT prefix) ── */
    .nabt-btn-partner {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      background: var(--coral);
      color: var(--white);
      font-family: 'DM Sans', sans-serif;
      font-size: 16px;
      font-weight: 500;
      padding: 18px 44px;
      border-radius: 60px;
      border: none;
      cursor: pointer;
      text-decoration: none;
      transition: background .22s ease, transform .22s ease, box-shadow .22s ease;
    }
    .nabt-btn-partner:hover {
      background: var(--peach);
      color: var(--white);
      transform: translateY(-2px);
      box-shadow: 0 12px 32px rgba(230,110,67,.4);
    }
    .nabt-btn-arrow {
      font-size: 18px;
      transition: transform .22s ease;
    }
    .nabt-btn-partner:hover .nabt-btn-arrow { 
      transform: translateX(4px); 
    }

    /* focus accessibility */
    .nabt-btn-partner:focus-visible {
      outline: 3px solid var(--white);
      outline-offset: 3px;
      border-radius: 60px;
    }

    /* responsive adjustments */
    @media (max-width: 575px) {
      .nabt-partner-card { padding: 72px 24px; }
      .nabt-blob-deco { width: 220px; height: 220px; top: -15%; left: -25%; }
      .nabt-blob-deco-right { width: 180px; height: 180px; }
    }