.act1{
  margin-top: 30px;
  margin-bottom: 30px;
}
:root{
      --teal:#058f96;
      --teal-dark:#00536a;
      --teal-deep:#00475c;
      --cyan:#62d0dc;
      --orange:#e79a20;
      --yellow:#ffc74b;
      --green:#348f47;
      --blue:#2389e9;
      --purple:#8242ca;
      --ink:#083d58;
      --body:#314d5e;
      --vision-bg:#fff3df;
      --mission-bg:#eaf7ff;
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      overflow-x:hidden;
      font-family:"Google Sans","Product Sans","DM Sans",Arial,sans-serif;
      color:var(--body);
      background:#f5fcfd;
    }

    .trust-section{
      position:relative;
      overflow:hidden;
      isolation:isolate;
      background:
        radial-gradient(circle at 6% 10%, rgba(84,206,222,.17) 0 22px, transparent 23px),
        radial-gradient(circle at 36% 12%, rgba(82,187,212,.12) 0 18px, transparent 19px),
        linear-gradient(135deg,#f7feff 0%,#ffffff 42%,#eefbfd 100%);
    }

    .trust-section::before,
    .trust-section::after{
      content:"";
      position:absolute;
      z-index:-1;
      border-radius:50%;
      filter:blur(4px);
      animation:floatOrb 9s ease-in-out infinite;
    }
    .trust-section::before{
      width:260px;height:260px;left:-130px;top:360px;
      background:radial-gradient(circle,rgba(73,209,219,.22),rgba(73,209,219,0) 68%);
    }
    .trust-section::after{
      width:340px;height:340px;right:-120px;top:100px;
      background:radial-gradient(circle,rgba(85,208,223,.24),rgba(85,208,223,0) 68%);
      animation-delay:-3s;
    }

    @keyframes floatOrb{
      0%,100%{transform:translate3d(0,0,0)}
      50%{transform:translate3d(0,-18px,0)}
    }

    .shape-dot{
      position:absolute;
      width:54px;height:54px;border-radius:50%;
      background:rgba(123,211,229,.11);
      pointer-events:none;
      animation:softFloat 8s ease-in-out infinite;
    }
    .shape-dot.dot-1{left:-20px;top:95px}
    .shape-dot.dot-2{left:28%;top:20px;width:34px;height:34px;animation-delay:-2s}
    .shape-dot.dot-3{right:5%;top:360px;width:36px;height:36px;animation-delay:-4s}
    @keyframes softFloat{
      0%,100%{transform:translateY(0) scale(1)}
      50%{transform:translateY(-14px) scale(1.04)}
    }

    .leaf{
      position:absolute;
      width:22px;height:58px;
      border-radius:100% 0 100% 0;
      background:linear-gradient(135deg,#1d936e,#7ecf9a);
      opacity:.85;
      pointer-events:none;
    }
    .leaf::after{
      content:"";
      position:absolute;
      left:11px;top:7px;bottom:7px;width:1px;
      background:rgba(255,255,255,.75);
      transform:rotate(-25deg);
    }
    .leaf.leaf-1{right:49%;top:37px;transform:rotate(24deg)}
    .leaf.leaf-2{right:47.5%;top:88px;transform:rotate(55deg) scale(.8)}
    .leaf.leaf-3{right:17px;top:510px;transform:rotate(75deg) scale(.8)}
    .leaf.leaf-4{right:42px;top:540px;transform:rotate(115deg) scale(.7)}

    .hero-wrap{padding:58px 0 28px}
    .eyebrow{
      display:flex;
      align-items:center;
      gap:14px;
      color:#0d5471;
      text-transform:uppercase;
      letter-spacing:.26em;
      font-weight:800;
      font-size:.78rem;
      margin-bottom:20px;
    }
    .eyebrow .lines{
      width:34px;height:10px;position:relative;
    }
    .eyebrow .lines::before,.eyebrow .lines::after{
      content:"";position:absolute;left:0;right:0;height:2px;background:#0b617c;border-radius:20px;
    }
    .eyebrow .lines::before{top:2px}
    .eyebrow .lines::after{bottom:2px}

    .display-title{
      font-size:clamp(3rem,5.2vw,5.9rem);
      line-height:.97;
      font-weight:800;
      letter-spacing:-.055em;
      margin:0;
      color:#034c66;
    }
    .display-title .accent{
      color:var(--orange);
      background:linear-gradient(135deg,#f2b238,#d67b11);
      -webkit-background-clip:text;
      -webkit-text-fill-color:transparent;
    }
    .sub-title{
      font-size:clamp(1.28rem,2vw,2rem);
      line-height:1.2;
      font-weight:700;
      color:#075277;
      margin-top:14px;
    }
    .lead-copy{
      margin-top:18px;
      max-width:680px;
      font-size:1.08rem;
      line-height:1.65;
      color:#3f5260;
    }

    .hero-actions{
      display:flex;
      align-items:center;
      gap:22px;
      margin-top:26px;
      flex-wrap:wrap;
    }
    .btn-trust{
      border:0;
      border-radius:999px;
      padding:13px 20px 13px 24px;
      background:linear-gradient(135deg,#048b92,#00677b);
      color:#fff;
      font-weight:700;
      box-shadow:0 12px 24px rgba(0,111,126,.18);
      display:inline-flex;
      align-items:center;
      gap:14px;
      transition:.3s ease;
    }
    .btn-trust:hover{transform:translateY(-3px);color:#fff;box-shadow:0 18px 32px rgba(0,111,126,.24)}
    .btn-trust .circle{
      width:30px;height:30px;border-radius:50%;
      background:#fff;color:#0a6b80;
      display:grid;place-items:center;
    }

    .watch-btn{
      display:inline-flex;
      align-items:center;
      gap:12px;
      color:#0a5776;
      font-weight:700;
      text-decoration:none;
    }
    .watch-btn .play{
      width:52px;height:52px;border-radius:50%;
      border:7px solid #98deee;
      background:linear-gradient(145deg,#089aaa,#0b6b8a);
      display:grid;place-items:center;
      color:#fff;
      box-shadow:0 8px 18px rgba(0,111,126,.14);
      transition:.3s ease;
    }
    .watch-btn:hover .play{transform:scale(1.06) rotate(4deg)}

    .stats-row{
      display:flex;
      align-items:stretch;
      margin-top:34px;
      max-width:740px;
    }
    .stat{
      position:relative;
      text-align:center;
      padding:0 28px;
      min-width:155px;
    }
    .stat:first-child{padding-left:0}
    .stat:not(:last-child)::after{
      content:"";position:absolute;right:0;top:10px;bottom:4px;width:1px;background:#a8cfd8;
    }
    .stat i{
      font-size:2.4rem;
      display:block;
      margin-bottom:8px;
      filter:drop-shadow(0 4px 8px rgba(0,0,0,.08));
    }
    .stat:nth-child(1) i{color:#198ee6}
    .stat:nth-child(2) i{color:#07909a}
    .stat:nth-child(3) i{color:#008091}
    .stat:nth-child(4) i{color:#e8a01d}
    .stat strong{display:block;font-size:1.65rem;color:#073f59;line-height:1}
    .stat span{font-size:.92rem;color:#155b78;display:block;margin-top:5px}

    .photo-stage{
      position:relative;
      min-height:610px;
      display:flex;
      align-items:center;
      justify-content:center;
    }
    .photo-shell{
      position:relative;
      width:min(100%,700px);
      aspect-ratio:1.12/1;
      margin-left:auto;
      border-radius:42% 33% 33% 35% / 24% 24% 37% 30%;
      padding:9px;
      background:linear-gradient(130deg,#fff5c8,#f4b84d 20%,#ffefc8 40%,#fff 60%,#f1cb7a 83%,#fff2ce);
      box-shadow:0 28px 52px rgba(0,102,111,.20);
      transform:rotate(1.5deg);
      animation:heroBob 7s ease-in-out infinite;
    }
    .photo-shell::before{
      content:"";position:absolute;inset:26px -28px -25px 14px;z-index:-1;
      border-radius:inherit;
      background:linear-gradient(145deg,#00939a,#58d0d0 60%,#7bc7ef);
      filter:saturate(1.1);
    }
    .photo-shell img{
      width:100%;height:100%;object-fit:cover;
      border-radius:inherit;
      display:block;
      border:5px solid rgba(255,255,255,.88);
    }
    @keyframes heroBob{
      0%,100%{transform:rotate(1.5deg) translateY(0)}
      50%{transform:rotate(.5deg) translateY(-10px)}
    }

    .overlay-message{
      position:absolute;left:90px;top:46px;
      color:#fff;
      font-family:"DM Sans",sans-serif;
      font-size:clamp(1.55rem,2.2vw,2.25rem);
      line-height:1.03;
      text-align:center;
      max-width:210px;
      transform:rotate(-7deg);
      text-shadow:0 2px 10px rgba(0,0,0,.4);
    }
    .overlay-heart{display:block;color:#ffc749;font-size:2.2rem;margin-top:10px}

    .side-badge{
      position:absolute;right:-25px;top:40px;
      width:120px;min-height:168px;border-radius:60px 0 0 60px;
      background:linear-gradient(165deg,#12a8a3,#00838e);
      color:#fff;
      display:flex;flex-direction:column;align-items:center;justify-content:center;
      gap:4px;text-align:center;
      box-shadow:0 20px 35px rgba(0,120,130,.16);
    }
    .side-badge i{font-size:2rem}
    .side-badge span{font-size:1rem;line-height:1.2}

    .round-note{
      position:absolute;right:-5px;bottom:80px;
      width:150px;height:150px;border-radius:50%;
      background:#fffef9;
      border:1px solid #f2bd67;
      box-shadow:0 16px 32px rgba(0,84,100,.16);
      display:flex;align-items:center;justify-content:center;
      text-align:center;
      color:#0f5871;
      font-weight:600;
      line-height:1.05;
      padding:26px;
    }
    .round-note b{display:block;font-size:1.6rem;font-family:Georgia,serif}

    .mini-leaf{
      position:absolute;right:45px;bottom:210px;
      width:56px;height:26px;
      border-radius:100% 0 100% 0;
      background:linear-gradient(135deg,#2aa59e,#9de0cf);
      transform:rotate(18deg);
      box-shadow:0 7px 12px rgba(0,100,100,.12);
    }

    .vm-wrap{padding:10px 0 20px}
    .vm-card{
      display:grid;
      grid-template-columns:34% 66%;
      border-radius:18px;
      overflow:hidden;
      min-height:255px;
      border:1px solid rgba(255,255,255,.9);
      box-shadow:0 8px 24px rgba(0,78,96,.10);
      position:relative;
      isolation:isolate;
      transition:.35s ease;
    }
    .vm-card:hover{transform:translateY(-6px);box-shadow:0 16px 32px rgba(0,78,96,.14)}
    .vm-card.vision{background:linear-gradient(135deg,var(--vision-bg),#fffaf2 65%,#fff)}
    .vm-card.mission{background:linear-gradient(135deg,var(--mission-bg),#f7fcff 70%,#fff)}
    .vm-card::after{
      content:"";position:absolute;width:140px;height:140px;border-radius:50%;
      right:-45px;bottom:-55px;border:18px solid rgba(0,130,160,.05);z-index:-1;
    }
    .vm-img{width:100%;height:100%;object-fit:cover}
    .vm-content{
      padding:26px 28px;
      display:flex;flex-direction:column;justify-content:center;
    }
    .vm-head{display:flex;align-items:center;gap:16px;margin-bottom:18px}
    .vm-icon{
      width:64px;height:64px;border-radius:50%;
      display:grid;place-items:center;font-size:1.7rem;
      flex:0 0 64px;
    }
    .vision .vm-icon{background:#d8f4c7;color:#146c32}
    .mission .vm-icon{background:#c9edff;color:#0d80d7}
    .vm-head h3{margin:0;font-size:1.75rem;font-weight:800}
    .vision .vm-head h3{color:#17652e}
    .mission .vm-head h3{color:#1475c8}
    .vm-content p{font-size:1rem;line-height:1.55;margin:0;color:#42525f}
    .mini-divider{width:52px;height:4px;background:var(--orange);border-radius:20px;margin:18px 0}
    .keywords{font-size:.87rem;color:#12618a;font-weight:600;display:flex;gap:9px;flex-wrap:wrap}
    .keywords span:not(:last-child)::after{content:"|";margin-left:9px;color:#9cbac6}

    .values{padding:18px 0 28px}
    .values-title-row{
      display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:28px;
    }
    .values-title{
      font-size:2.65rem;font-weight:800;color:#0b4c68;margin:0;position:relative;
    }
    .values-title::after{
      content:"";position:absolute;left:30px;bottom:-13px;width:85px;height:5px;
      background:#f1b33a;border-radius:20px;
    }
    .values-intro{max-width:510px;font-size:1rem;line-height:1.45;color:#526574;margin:0}
    .values-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:0}
    .value-item{
      text-align:center;padding:0 16px;position:relative;
    }
    .value-item:not(:last-child)::after{
      content:"";position:absolute;right:0;top:22px;bottom:4px;width:1px;background:#bfd7dd;
    }
    .value-icon{
      width:82px;height:82px;border-radius:50%;margin:0 auto 12px;
      display:grid;place-items:center;color:#fff;font-size:2.35rem;
      border:4px solid rgba(255,255,255,.92);
      box-shadow:0 0 0 1px rgba(3,83,106,.15),0 8px 16px rgba(0,0,0,.08);
      transition:.3s ease;
    }
    .value-item:hover .value-icon{transform:translateY(-6px) rotate(-4deg)}
    .v1{background:linear-gradient(145deg,#f24d58,#d93645)}
    .v2{background:linear-gradient(145deg,#6caf58,#3d8b3f)}
    .v3{background:linear-gradient(145deg,#2f9bf0,#1973cf)}
    .v4{background:linear-gradient(145deg,#f79b29,#e36e0c)}
    .v5{background:linear-gradient(145deg,#914ed3,#6f2dba)}
    .v6{background:linear-gradient(145deg,#1ab3b6,#008e95)}
    .value-item h4{font-size:1rem;font-weight:800;color:#094663;margin-bottom:5px}
    .value-item p{font-size:.87rem;line-height:1.35;color:#376274;margin:0}

    .quote-band{
      position:relative;
      overflow:hidden;
      margin-top:18px;
      background:
        linear-gradient(95deg,rgba(0,82,95,.98),rgba(0,106,118,.96)),
        url("https://images.unsplash.com/photo-1489493585363-d69421e0edd3?auto=format&fit=crop&w=1600&q=80") center/cover;
      color:#fff;
      padding:54px 0 50px;
      clip-path:polygon(0 8%,23% 0,47% 8%,69% 0,100% 5%,100% 100%,0 100%);
    }
    .quote-band::before{
      content:"";position:absolute;inset:0;
      background:radial-gradient(circle at 70% 50%,rgba(255,255,255,.08),transparent 36%);
    }
    .quote-copy{position:relative;z-index:2}
    .quote-title{
      font-family:Georgia,serif;
      font-size:clamp(1.9rem,3vw,3.25rem);
      line-height:1.15;font-style:italic;margin:0;
    }
    .quote-title .gold{color:#ffc647}
    .quote-kicker{
      margin-top:24px;letter-spacing:.24em;text-transform:uppercase;font-size:.78rem;
    }
    .heart-line{
      width:130px;height:1px;background:#f2b22e;position:relative;margin:18px 0 0 auto;
    }
    .heart-line::before{content:"♡";position:absolute;left:-30px;top:-17px;font-size:2rem;color:#f7b41e}
    .cta-button{
      border:0;border-radius:999px;
      background:linear-gradient(135deg,#ffd460,#f7b52e);
      color:#0a4d61;
      padding:14px 24px;font-weight:800;
      display:inline-flex;align-items:center;gap:14px;text-decoration:none;
      box-shadow:0 12px 24px rgba(0,0,0,.12);
      transition:.3s ease;
    }
    .cta-button:hover{transform:translateY(-3px);color:#0a4d61}
    .quote-photo{
      position:absolute;right:0;top:0;width:43%;height:100%;
      opacity:.18;mix-blend-mode:screen;
      background:url("https://images.unsplash.com/photo-1488521787991-ed7bbaae773c?auto=format&fit=crop&w=1000&q=80") center/cover;
    }

    @media (max-width:1199.98px){
      .photo-stage{min-height:520px}
      .stats-row{flex-wrap:wrap;row-gap:22px}
      .stat{min-width:25%}
      .values-grid{grid-template-columns:repeat(3,1fr);row-gap:30px}
      .value-item:nth-child(3)::after{display:none}
    }

    @media (max-width:991.98px){
      .hero-wrap{padding-top:38px}
      .photo-stage{min-height:auto;margin-top:30px;padding:10px 20px 55px}
      .photo-shell{margin:auto;max-width:680px}
      .side-badge{right:0}
      .round-note{right:20px;bottom:20px}
      .values-title-row{align-items:flex-start;flex-direction:column}
      .quote-band{clip-path:none}
    }

    @media (max-width:767.98px){
      .display-title{font-size:3.2rem}
      .lead-copy{font-size:1rem}
      .stats-row{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
      .stat{min-width:0;padding:0 10px}
      .stat:nth-child(2)::after{display:none}
      .stat:nth-child(3)::after{display:block}
      .vm-card{grid-template-columns:1fr;min-height:auto}
      .vm-img{}
      .values-grid{grid-template-columns:repeat(2,1fr)}
      .value-item:nth-child(odd)::after{display:block}
      .value-item:nth-child(even)::after{display:none}
      .photo-shell{aspect-ratio:1/1.08}
      .overlay-message{left:48px;top:36px;max-width:160px}
      .side-badge{width:92px;min-height:145px}
      .round-note{width:118px;height:118px;padding:18px;font-size:.78rem}
      .round-note b{font-size:1.2rem}
    }

    @media (max-width:575.98px){
      .hero-wrap{padding-top:28px}
      .eyebrow{font-size:.68rem;letter-spacing:.18em}
      .display-title{font-size:2.72rem}
      .sub-title{font-size:1.18rem}
      .hero-actions{gap:14px}
      .watch-btn .play{width:46px;height:46px}
      .photo-stage{padding-left:0;padding-right:0}
      .photo-shell{border-radius:30% 24% 28% 30% / 22% 22% 28% 26%}
      .side-badge{display:none}
      .round-note{right:0;bottom:8px}
      .overlay-message{font-size:1.2rem;left:30px;top:28px;max-width:135px}
      .values-title{font-size:2rem}
      .values-grid{grid-template-columns:1fr 1fr}
      .value-item{padding:0 10px}
      .value-icon{width:70px;height:70px;font-size:1.9rem}
      .quote-title{font-size:1.9rem}
    }
  
    /* Responsive alignment fix: consistent left/right gutters on every device */
    .trust-section > .container,
    .trust-section .quote-band > .container{
      width:100%;
      max-width:1320px;
      margin-left:auto;
      margin-right:auto;
      padding-left:clamp(16px, 3vw, 28px);
      padding-right:clamp(16px, 3vw, 28px);
    }

    @media (max-width:575.98px){
      .trust-section > .container,
      .trust-section .quote-band > .container{
        padding-left:18px !important;
        padding-right:18px !important;
      }
      .hero-wrap .row, .vm-wrap .row, .quote-band .row{
        margin-left:0;
        margin-right:0;
      }
      .hero-wrap .row > *, .vm-wrap .row > *, .quote-band .row > *{
        padding-left:0;
        padding-right:0;
      }
      .photo-stage{
        width:100%;
        padding-left:6px;
        padding-right:6px;
      }
      .photo-shell{
        width:calc(100% - 8px);
        margin-left:auto;
        margin-right:auto;
      }
      .round-note{right:4px;}
      .vm-content{padding:22px 20px;}
      .values{padding-left:0;padding-right:0;}
      .values-title-row{gap:18px;}
    }

    @media (max-width:359.98px){
      .trust-section > .container,
      .trust-section .quote-band > .container{
        padding-left:14px !important;
        padding-right:14px !important;
      }
      .display-title{font-size:2.35rem;}
      .vm-content{padding:20px 16px;}
      .value-item{padding-left:6px;padding-right:6px;}
    }

/* Mobile Core Values alignment fix */
@media (max-width: 575.98px){
  .values-title-row{
    display:block;
    margin-bottom:30px;
  }
  .values-title{
    width:100%;
    margin-bottom:26px;
  }
  .values-intro{
    width:100%;
    max-width:none;
    margin:0;
  }
  .values-grid{
    width:100%;
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:30px 10px;
    clear:both;
  }
  .value-item{
    width:100%;
    min-width:0;
    padding:0 8px;
  }
  .value-item::after{
    display:none !important;
  }
  .value-icon{
    margin-left:auto;
    margin-right:auto;
  }
}

@media (max-width: 359.98px){
  .values-grid{grid-template-columns:1fr;}
}

/* =========================================================
   OUR CORE VALUES - MOBILE LAYOUT FIX
   Title + intro full width, then 2 values per row
   ========================================================= */
@media (max-width: 767.98px){
  .values-title-row{
    display:block !important;
    width:100% !important;
    margin-bottom:32px !important;
  }

  .values-title,
  .values-intro{
    width:100% !important;
    max-width:none !important;
  }

  .values-title{
    display:block !important;
    margin-bottom:28px !important;
  }

  .values-intro{
    display:block !important;
    margin:0 !important;
  }

  .values-grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    width:100% !important;
    gap:30px 0 !important;
  }

  .value-item{
    width:100% !important;
    min-width:0 !important;
    padding:0 10px !important;
  }

  .value-item:nth-child(odd)::after{
    display:block !important;
  }

  .value-item:nth-child(even)::after{
    display:none !important;
  }
}

@media (max-width: 359.98px){
  .values-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}


/* FINAL MOBILE CORE VALUES LAYOUT
   Row 1: title + intro full width
   Row 2: LOVE | PEOPLE
   Row 3: INTEGRITY | SERVICE
   Row 4: EMPOWERMENT | SUSTAINABILITY
*/
@media (max-width: 767.98px){
  .values-title-row{
    display:block !important;
    width:100% !important;
    margin-bottom:32px !important;
  }
  .values-title,
  .values-intro{
    display:block !important;
    width:100% !important;
    max-width:none !important;
  }
  .values-title{ margin:0 0 28px 0 !important; }
  .values-intro{ margin:0 !important; }

  .values-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    width:100% !important;
    gap:30px 0 !important;
  }
  .value-item{
    width:100% !important;
    min-width:0 !important;
    padding:0 10px !important;
  }
  .value-item:nth-child(odd)::after{ display:block !important; }
  .value-item:nth-child(even)::after{ display:none !important; }
}

/* Keep two items per row even on very small phones */
@media (max-width:359.98px){
  .values-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}