

    /* =========================================================
       RESET
    ========================================================= */

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

    html {
      scroll-behavior: smooth;
      scroll-padding-top: 90px;
    }

    body {
      font-family:
        "Manrope",
        "Noto Sans Malayalam",
        Arial,
        sans-serif;

      background: #fbfcfa;
      color: #14211b;

      line-height: 1.6;

      overflow-x: hidden;

      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
    }

    img {
      display: block;
      width: 100%;
      max-width: 100%;
    }

    a {
      color: inherit;
      text-decoration: none;
    }

    button,
    a {
      -webkit-tap-highlight-color: transparent;
    }

    button {
      font-family: inherit;
    }

    ::selection {
      background: #087443;
      color: #fff;
    }

    :root {
      --green-950: #063d25;
      --green-900: #075631;
      --green-800: #08683a;
      --green-700: #087443;
      --green-600: #0b8750;
      --green-500: #14965c;

      --green-100: #e8f6ee;
      --green-50: #f2faf5;

      --dark: #14211b;
      --text: #53615a;
      --muted: #6e7973;

      --white: #ffffff;
      --cream: #fbfcfa;
      --light: #f5f8f5;

      --border: #e4ebe6;

      --shadow-sm:
        0 8px 30px rgba(12, 43, 27, 0.06);

      --shadow-md:
        0 18px 55px rgba(12, 43, 27, 0.10);

      --shadow-lg:
        0 30px 90px rgba(12, 43, 27, 0.15);

      --container: 1180px;

      --radius-sm: 12px;
      --radius-md: 20px;
      --radius-lg: 30px;
      --radius-xl: 40px;
    }

    .container {
      width: min(
        calc(100% - 40px),
        var(--container)
      );

      margin: 0 auto;
    }

    .section {
      padding: 110px 0;
    }

    .section-light {
      background: var(--light);
    }

    .section-eyebrow {
      display: inline-block;

      margin-bottom: 14px;

      color: var(--green-700);

      font-size: 10px;
      font-weight: 800;

      letter-spacing: .18em;

      text-transform: uppercase;
    }

    .section-heading {
      max-width: 720px;

      margin-bottom: 52px;
    }

    .section-heading h2 {
      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      color: var(--green-950);

      font-size: clamp(30px, 4vw, 45px);

      line-height: 1.3;

      letter-spacing: -.04em;

      margin-bottom: 14px;
    }

    .section-heading p {
      max-width: 650px;

      color: var(--text);

      font-size: 14px;

      line-height: 1.9;
    }

    /* =========================================================
       BUTTONS
    ========================================================= */

    .btn {
      min-height: 50px;

      display: inline-flex;
      align-items: center;
      justify-content: center;

      gap: 9px;

      padding: 0 20px;

      border-radius: 999px;

      font-size: 12px;
      font-weight: 800;

      cursor: pointer;

      transition:
        transform .2s ease,
        box-shadow .2s ease,
        background .2s ease,
        border-color .2s ease;
    }

    .btn:hover {
      transform: translateY(-2px);
    }

    .btn-primary {
      background: var(--green-700);
      color: #fff;

      box-shadow:
        0 12px 28px
        rgba(8,116,67,.20);
    }

    .btn-primary:hover {
      background: var(--green-800);
    }

    .btn-secondary {
      background: #fff;

      border: 1px solid var(--border);

      color: var(--dark);
    }

    .btn-secondary:hover {
      border-color: #cad8d0;

      box-shadow: var(--shadow-sm);
    }

    .btn-white {
      background: #fff;

      color: var(--green-800);

      box-shadow:
        0 14px 32px
        rgba(0,0,0,.14);
    }

    .btn-outline {
      background: #fff;

      border: 1px solid var(--border);

      color: var(--dark);
    }

    .btn-outline:hover {
      color: var(--green-700);

      border-color: var(--green-500);
    }

    a:focus-visible,
    button:focus-visible {
      outline: 3px solid
        rgba(8,116,67,.28);

      outline-offset: 3px;
    }

    /* =========================================================
       HEADER
    ========================================================= */

    .header {
      position: fixed;

      z-index: 1000;

      top: 0;
      left: 0;
      right: 0;

      height: 78px;

      background:
        rgba(255,255,255,.86);

      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);

      border-bottom:
        1px solid
        rgba(228,235,230,.65);

      transition:
        box-shadow .25s ease,
        background .25s ease;
    }

    .header.scrolled {
      background:
        rgba(255,255,255,.97);

      box-shadow: var(--shadow-sm);
    }

    .header-inner {
      height: 100%;

      display: flex;
      align-items: center;
      justify-content: space-between;

      gap: 25px;
    }

    .logo {
      display: flex;
      align-items: center;

      gap: 10px;

      flex-shrink: 0;
    }

    .logo-mark {
      width: 60px;
      height: 60px;

      display: grid;
      place-items: center;

      border-radius: 13px;

      background:
        linear-gradient(
          145deg,
          var(--green-700),
          var(--green-900)
        );

      color: #fff;

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      font-size: 17px;
      font-weight: 800;

      box-shadow:
        0 8px 18px
        rgba(8,116,67,.18);
    }

    .logo-text {
      display: flex;
      flex-direction: column;

      line-height: 1.1;
    }

    .logo-text strong {
      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      font-size: 18px;
      font-weight: 800;
    }

    .logo-text small {
      margin-top: 4px;

      color: var(--muted);

      font-size: 9px;
      font-weight: 700;

      letter-spacing: .13em;

      text-transform: uppercase;
    }

    .nav {
      display: flex;
      align-items: center;

      gap: 24px;
    }

    .nav a {
      position: relative;

      color: #4e5b54;

      font-size: 11px;
      font-weight: 700;

      transition: color .2s ease;
    }

    .nav a::after {
      content: "";

      position: absolute;

      left: 0;
      right: 0;
      bottom: -8px;

      height: 2px;

      border-radius: 5px;

      background: var(--green-600);

      transform: scaleX(0);

      transition:
        transform .2s ease;
    }

    .nav a:hover {
      color: var(--green-700);
    }

    .nav a:hover::after {
      transform: scaleX(1);
    }

    .header-whatsapp {
      display: inline-flex;
      align-items: center;

      gap: 8px;

      padding: 11px 16px;

      border-radius: 999px;

      background: var(--green-700);
      color: #fff;

      font-size: 11px;
      font-weight: 800;

      box-shadow:
        0 8px 22px
        rgba(8,116,67,.18);

      transition:
        transform .2s ease,
        background .2s ease;
    }

    .header-whatsapp:hover {
      background: var(--green-800);

      transform: translateY(-1px);
    }

    .menu-button {
      display: none;

      width: 42px;
      height: 42px;

      border: 0;

      border-radius: 12px;

      background: transparent;

      color: var(--dark);

      font-size: 23px;

      cursor: pointer;
    }

    .mobile-menu {
      display: none;
    }

    /* =========================================================
       HERO
    ========================================================= */

    .hero {
      position: relative;

      min-height: 760px;

      display: flex;
      align-items: center;

      padding-top: 110px;

      overflow: hidden;

      background:
        radial-gradient(
          circle at 8% 20%,
          rgba(20,150,92,.09),
          transparent 32%
        ),
        linear-gradient(
          180deg,
          #f7fbf8 0%,
          #fbfcfa 100%
        );
    }

    .hero-pattern {
      position: absolute;

      inset: 0;

      opacity: .35;

      pointer-events: none;

      background-image:
        linear-gradient(
          rgba(8,116,67,.04) 1px,
          transparent 1px
        ),
        linear-gradient(
          90deg,
          rgba(8,116,67,.04) 1px,
          transparent 1px
        );

      background-size: 55px 55px;

      mask-image:
        linear-gradient(
          to bottom,
          black,
          transparent 80%
        );
    }

    .hero-grid {
      position: relative;

      z-index: 1;

      display: grid;

      grid-template-columns:
        1.03fr
        .97fr;

      align-items: center;

      gap: 65px;

      padding-bottom: 70px;
    }

    .hero-content {
      animation:
        heroEnter .8s ease both;
    }

    @keyframes heroEnter {
      from {
        opacity: 0;
        transform: translateY(18px);
      }

      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    .hero-badge {
      width: fit-content;

      display: flex;
      align-items: center;

      gap: 8px;

      padding: 7px 11px;

      margin-bottom: 21px;

      border:
        1px solid
        rgba(8,116,67,.12);

      border-radius: 999px;

      background:
        rgba(255,255,255,.72);

      color: var(--green-800);

      font-size: 10px;
      font-weight: 800;

      letter-spacing: .09em;

      text-transform: uppercase;
    }

    .badge-dot {
      width: 7px;
      height: 7px;

      border-radius: 50%;

      background: var(--green-600);

      box-shadow:
        0 0 0 5px
        rgba(20,150,92,.10);
    }

    .hero h1 {
      max-width: 720px;

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      color: var(--green-950);

      font-size:
        clamp(38px, 5vw, 64px);

      font-weight: 800;

      line-height: 1.17;

      letter-spacing: -.045em;
    }

    .hero h1 span {
      display: block;

      color: var(--green-700);
    }

    .hero-description {
      max-width: 570px;

      margin-top: 23px;

      color: var(--text);

      font-size: 14px;

      line-height: 1.9;
    }

    .hero-actions {
      display: flex;
      align-items: center;

      flex-wrap: wrap;

      gap: 11px;

      margin-top: 30px;
    }

    .trust-row {
      display: flex;
      flex-wrap: wrap;

      gap: 10px 18px;

      margin-top: 29px;
    }

    .trust-row span {
      display: inline-flex;
      align-items: center;

      gap: 6px;

      color: #5a6861;

      font-size: 10px;
      font-weight: 700;
    }

    .trust-row span::before {
      content: "✓";

      width: 17px;
      height: 17px;

      display: grid;
      place-items: center;

      border-radius: 50%;

      background: var(--green-100);

      color: var(--green-700);

      font-size: 10px;
      font-weight: 900;
    }

    .hero-visual {
      position: relative;

      min-height: 560px;

      display: flex;
      align-items: center;
      justify-content: center;
    }

    .hero-image-card {
      position: relative;

      width: min(100%, 520px);

      aspect-ratio: .87;

      overflow: hidden;

      border-radius: 34px;

      box-shadow: var(--shadow-lg);

      transform: rotate(1deg);

      animation:
        visualEnter .9s .1s ease both;
    }

    @keyframes visualEnter {
      from {
        opacity: 0;
        transform:
          translateY(25px)
          rotate(3deg);
      }

      to {
        opacity: 1;
        transform:
          translateY(0)
          rotate(1deg);
      }
    }

    .hero-image-card img {
      width: 100%;
      height: 100%;

      object-fit: cover;
    }

    .hero-image-overlay {
      position: absolute;

      z-index: 1;

      inset: 0;

      background:
        linear-gradient(
          180deg,
          rgba(5,44,27,.02),
          rgba(5,44,27,.28)
        );
    }

    .hero-floating-card {
      position: absolute;

      z-index: 2;

      display: flex;
      align-items: center;

      gap: 10px;

      border-radius: 17px;

      background:
        rgba(255,255,255,.95);

      box-shadow:
        0 18px 45px
        rgba(9,45,28,.18);

      backdrop-filter: blur(12px);
    }

    .hero-card-one {
      left: -47px;
      bottom: 54px;

      min-width: 225px;

      padding: 14px 17px;
    }

    .hero-card-one strong {
      display: block;

      font-size: 11px;
    }

    .hero-card-one small {
      display: block;

      margin-top: 3px;

      color: var(--muted);

      font-size: 9px;
    }

    .hero-card-icon {
      width: 38px;
      height: 38px;

      display: grid;
      place-items: center;

      flex-shrink: 0;

      border-radius: 12px;

      background: var(--green-100);

      color: var(--green-700);

      font-size: 18px;
    }

    .hero-card-two {
      top: 70px;
      right: -25px;

      padding: 10px 13px;

      font-size: 10px;
      font-weight: 800;
    }

    .mini-check {
      width: 27px;
      height: 27px;

      display: grid;
      place-items: center;

      border-radius: 50%;

      background: var(--green-700);

      color: #fff;

      font-size: 12px;
    }

    .hero-orbit {
      position: absolute;

      border:
        1px solid
        rgba(8,116,67,.10);

      border-radius: 50%;

      pointer-events: none;
    }

    .orbit-one {
      width: 570px;
      height: 570px;

      top: -5px;
      right: -30px;
    }

    .orbit-two {
      width: 680px;
      height: 680px;

      top: -60px;
      right: -85px;

      border-style: dashed;

      opacity: .5;
    }

    .hero-bottom {
      position: absolute;

      bottom: 0;
      left: 0;
      right: 0;

      border-top:
        1px solid var(--border);

      background:
        rgba(255,255,255,.45);
    }

    .hero-bottom-inner {
      min-height: 55px;

      display: flex;
      align-items: center;

      gap: 16px;

      color: #69766f;

      font-size: 9px;
      font-weight: 800;

      letter-spacing: .09em;

      text-transform: uppercase;
    }

    .hero-line {
      width: 55px;
      height: 1px;

      background: #bfcac3;
    }

    /* =========================================================
       TRUST
    ========================================================= */

    .trust-grid {
      display: grid;

      grid-template-columns:
        1fr
        .9fr;

      gap: 90px;

      align-items: center;
    }

    .trust-visual {
      position: relative;

      min-height: 540px;
    }

    .trust-main-image {
      position: absolute;

      top: 0;
      left: 0;

      width: 76%;
      height: 80%;

      overflow: hidden;

      border-radius: 30px;

      box-shadow: var(--shadow-md);
    }

    .trust-main-image img {
      height: 100%;

      object-fit: cover;
    }

    .trust-small-image {
      position: absolute;

      right: 0;
      bottom: 0;

      width: 43%;
      height: 42%;

      padding: 7px;

      border-radius: 25px;

      background: var(--cream);

      box-shadow: var(--shadow-md);
    }

    .trust-small-image img {
      height: 100%;

      object-fit: cover;

      border-radius: 18px;
    }

    .trust-stat {
      position: absolute;

      left: 35px;
      bottom: 40px;

      display: flex;
      align-items: center;

      gap: 11px;

      padding: 14px 17px;

      border-radius: 17px;

      background: #fff;

      box-shadow:
        0 15px 45px
        rgba(12,43,27,.14);
    }

    .trust-stat-icon {
      width: 40px;
      height: 40px;

      display: grid;
      place-items: center;

      border-radius: 13px;

      background: var(--green-100);

      color: var(--green-700);

      font-size: 19px;
    }

    .trust-stat strong {
      display: block;

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      color: var(--green-900);

      font-size: 12px;

      line-height: 1.4;
    }

    .trust-stat small {
      display: block;

      margin-top: 3px;

      color: var(--muted);

      font-size: 8px;
    }

    .trust-content {
      max-width: 540px;
    }

    .trust-content h2 {
      margin-bottom: 22px;

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      color: var(--green-950);

      font-size:
        clamp(31px, 4vw, 45px);

      line-height: 1.3;

      letter-spacing: -.04em;
    }

    .trust-content p {
      margin-bottom: 14px;

      color: var(--text);

      font-size: 13px;

      line-height: 1.95;
    }

    .trust-content strong {
      color: var(--green-700);
    }

    .trust-pills {
      display: flex;
      flex-wrap: wrap;

      gap: 8px;

      margin: 26px 0;
    }

    .trust-pills span {
      display: inline-flex;
      align-items: center;

      gap: 6px;

      padding: 8px 11px;

      border-radius: 999px;

      background: var(--green-50);

      color: var(--green-900);

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      font-size: 10px;
      font-weight: 700;
    }

    .trust-pills span::before {
      content: "✓";

      width: 19px;
      height: 19px;

      display: grid;
      place-items: center;

      border-radius: 50%;

      background: var(--green-700);

      color: #fff;

      font-family: Arial, sans-serif;

      font-size: 10px;
    }

    .text-link {
      display: inline-flex;
      align-items: center;

      gap: 7px;

      color: var(--green-700);

      font-size: 10px;
      font-weight: 800;
    }

    /* =========================================================
       SERVICES
    ========================================================= */

    .services-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 24px;
      width: 100%;
      align-items: stretch;
    }

    .services-grid > a {
      display: flex;
      flex-direction: column;
      width: 100%;
      min-width: 0;
      height: 100%;
      box-sizing: border-box;
    }

    .service-card {
      min-height: 355px;
      cursor: pointer;
      text-decoration: none;

      display: flex;
      flex-direction: column;

      padding: 22px;

      border: none;

    box-shadow: var(--shadow-md);

      border-radius: 23px;

      background: linear-gradient(
        135deg,
        var(--green-900),
        var(--green-600)
    );

    color: var(--white);


      transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;
    }

    .service-card:hover {
      transform: translateY(-6px);

      border-color:
        rgba(8,116,67,.20);

      box-shadow: var(--shadow-md);
    }

    .service-top {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;

      margin-bottom: 32px;
    }

    .service-number {
      color: #a6b0aa;

      font-size: 10px;
      font-weight: 800;

      letter-spacing: .14em;
    }

    .service-icon {
      width: 51px;
      height: 51px;

      display: grid;
      place-items: center;

      border-radius: 15px;

      background: var(--green-50);

      color: var(--green-700);

      font-size: 24px;
    }

    .service-mal {
      margin-bottom: 6px;

     color: var(--white);

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      font-size: 10px;
      font-weight: 700;
    }

    .service-card h3 {
      color: var(--white);

      font-size: 16px;

      line-height: 1.4;

      letter-spacing: -.03em;
    }

    .service-card p {
      margin-top: 12px;

      color: rgba(255, 255, 255, 0.82);

      font-size: 9.5px;

      line-height: 1.75;
    }

    @media (max-width: 600px) {
      .services-grid {
          grid-template-columns: repeat(2, minmax(0, 1fr));
          gap: 12px;
      }

      .services-grid > a {
          min-height: 0;
          padding: 16px;
          border-radius: 20px;
      }

      .services-grid h3 {
          font-size: 16px;
          line-height: 1.3;
      }

      .services-grid p {
          font-size: 12px;
          line-height: 1.5;
      }
    }

    /* =========================================================
       NRI
    ========================================================= */

    .nri-section {
      background: var(--green-950);
    }

    .nri-card {
      position: relative;

      overflow: hidden;

      display: grid;

      grid-template-columns:
        .9fr
        1.1fr;

      gap: 70px;

      padding: 70px;

      border-radius: 38px;

      background:
        radial-gradient(
          circle at 90% 0%,
          rgba(35,159,100,.28),
          transparent 38%
        ),
        linear-gradient(
          135deg,
          #063d25,
          #075631
        );

      color: #fff;
    }

    .nri-content {
      position: relative;

      z-index: 1;
    }

    .nri-content .section-eyebrow {
      color: #87d9ac;
    }

    .nri-content h2 {
      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      font-size:
        clamp(34px, 4vw, 51px);

      line-height: 1.25;

      letter-spacing: -.04em;
    }

    .nri-content h3 {
      margin-top: 7px;

      color: #a6e1bf;

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      font-size:
        clamp(21px, 2.7vw, 32px);

      line-height: 1.4;
    }

    .nri-content .english {
      margin-top: 19px;

      color: #fff;

      font-size: 14px;

      font-weight: 700;
    }

    .nri-content > p:not(.english) {
      max-width: 530px;

      margin-top: 13px;

      color:
        rgba(255,255,255,.70);

      font-size: 11px;

      line-height: 1.9;
    }

    .nri-content .btn {
      margin-top: 23px;
    }

    .nri-right {
      display: grid;

      grid-template-columns:
        1.05fr
        .95fr;

      gap: 20px;

      align-items: center;
    }

    .nri-image {
      position: relative;

      height: 380px;

      overflow: hidden;

      border-radius: 25px;
    }

    .nri-image::after {
      content: "";

      position: absolute;

      inset: 0;

      background:
        linear-gradient(
          to top,
          rgba(4,37,23,.65),
          transparent 55%
        );
    }

    .nri-image img {
      width: 100%;
      height: 100%;

      object-fit: cover;
    }

    .nri-image-label {
      position: absolute;

      z-index: 2;

      left: 18px;
      bottom: 18px;

      color: #fff;

      font-size: 10px;
      font-weight: 800;
    }

    .nri-list {
      display: grid;

      gap: 8px;
    }

    .nri-list div {
      padding: 10px 11px;

      border:
        1px solid
        rgba(255,255,255,.09);

      border-radius: 11px;

      background:
        rgba(255,255,255,.045);

      color:
        rgba(255,255,255,.85);

      font-size: 9px;
      font-weight: 700;
    }

    .nri-list div::before {
      content: "✓";

      margin-right: 7px;

      color: #7bd5a6;

      font-weight: 900;
    }

    /* =========================================================
       WHY US
    ========================================================= */

    .why-grid {
      display: grid;

      grid-template-columns:
        repeat(3, 1fr);

      gap: 14px;
    }

    .why-card {
      position: relative;

      min-height: 220px;

      padding: 27px;

      overflow: hidden;

      border:
        1px solid var(--border);

      border-radius: 22px;

      background: #fff;

      border-color: #075631;

      transition:
        transform .25s ease,
        box-shadow .25s ease;
    }

    .why-card:hover {
      transform: translateY(-4px);

      box-shadow: var(--shadow-sm);
    }

    .why-number {
      position: absolute;

      top: 20px;
      right: 23px;

      color: #d8e2dc;

      font-size: 10px;
      font-weight: 800;
    }

    .why-icon {
      width: 46px;
      height: 46px;

      display: grid;
      place-items: center;

      margin-bottom: 27px;

      border-radius: 14px;

      background: var(--green-50);

      color: var(--green-700);

      font-size: 20px;
    }

    .why-card h3 {
      margin-bottom: 7px;

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      font-size: 15px;
    }

    .why-card p {
      color: var(--muted);

      font-size: 10px;

      line-height: 1.7;
    }

    /* =========================================================
       HOW IT WORKS
    ========================================================= */

    .steps {
      display: grid;

      grid-template-columns:
        repeat(4, 1fr);

      gap: 15px;
    }

    .step-wrap {
      position: relative;
    }

    .step {
      height: 100%;

      padding: 25px;

      border:
        1px solid var(--border);

      border-radius: 22px;

      background: #fff;
    }

    .step-top {
      display: flex;
      align-items: center;
      justify-content: space-between;

      margin-bottom: 40px;
    }

    .step-number {
      color: #b0bbb5;

      font-size: 10px;
      font-weight: 800;

      letter-spacing: .12em;
    }

    .step-icon {
      width: 43px;
      height: 43px;

      display: grid;
      place-items: center;

      border-radius: 13px;

      background: var(--green-700);

      color: #fff;

      font-size: 17px;
    }

    .step h3 {
      margin-bottom: 8px;

      font-size: 14px;
    }

    .step p {
      color: var(--muted);

      font-size: 10px;

      line-height: 1.75;
    }

    .step-arrow {
      position: absolute;

      z-index: 2;

      top: 52px;
      right: -20px;

      color: #a5b1aa;

      font-size: 22px;
    }

    /* Step card hover effect */
    .step {
        position: relative;
        height: 100%;
        padding: 25px;
        border: 1px solid var(--border);
        border-radius: 22px;
        background: #fff;

        transition:
            transform 0.3s ease,
            box-shadow 0.3s ease,
            border-color 0.3s ease,
            background 0.3s ease;
    }

    /* Hover interaction */
    .step-wrap:hover .step {
        transform: translateY(-8px);
        border-color: var(--green-700);
        background: #f7fbf8;
        box-shadow: 0 14px 30px rgba(0, 80, 45, 0.12);
    }

    /* Icon animation */
    .step-icon {
        transition:
            transform 0.3s ease,
            background 0.3s ease;
    }

    .step-wrap:hover .step-icon {
        transform: scale(1.1) rotate(-5deg);
        background: #064e32;
    }

    /* Step number highlight */
    .step-number {
        transition: color 0.3s ease;
    }

    .step-wrap:hover .step-number {
        color: var(--green-700);
    }

    /* Arrow animation */
    .step-arrow {
        transition:
            transform 0.3s ease,
            color 0.3s ease;
    }

    .step-wrap:hover .step-arrow {
        transform: translateX(5px);
        color: var(--green-700);
    }

    /* Keyboard accessibility */
    .step-wrap:focus-within .step {
        outline: 2px solid var(--green-700);
        outline-offset: 4px;
    }

    /* Respect reduced-motion preferences */
    @media (prefers-reduced-motion: reduce) {
        .step,
        .step-icon,
        .step-number,
        .step-arrow {
            transition: none;
        }

        .step-wrap:hover .step {
            transform: none;
        }
    }

    /* =========================================================
       AREAS
    ========================================================= */

    .areas {
      background:
        linear-gradient(
          135deg,
          #edf7f1,
          #f7faf8
        );
    }

    .areas-inner {
      min-height: 420px;

      display: grid;

      grid-template-columns:
        1fr
        .9fr;

      align-items: center;

      gap: 80px;
    }

    .areas-content {
      max-width: 570px;
    }

    .areas-content h2 {
      margin-bottom: 16px;

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      color: var(--green-950);

      font-size:
        clamp(30px, 4vw, 43px);

      line-height: 1.3;

      letter-spacing: -.04em;
    }

    .areas-content p {
      color: var(--text);

      font-size: 11px;

      line-height: 1.8;
    }

    .area-tags {
      display: flex;
      flex-wrap: wrap;

      gap: 8px;

      margin-top: 24px;
    }

    .area-tags span {
      padding: 8px 10px;

      border:
        1px solid
        rgba(8,116,67,.12);

      border-radius: 999px;

      background:
        rgba(255,255,255,.8);

      color: var(--green-900);

      font-size: 9px;
      font-weight: 800;
    }

    .areas-map {
      position: relative;

      height: 340px;

      display: grid;
      place-items: center;

      border-left:
        1px solid
        rgba(8,116,67,.09);
    }

    .map-circle {
      position: absolute;

      border:
        1px solid
        rgba(8,116,67,.12);

      border-radius: 50%;
    }

    .map-circle.one {
      width: 130px;
      height: 130px;
    }

    .map-circle.two {
      width: 230px;
      height: 230px;
    }

    .map-circle.three {
      width: 340px;
      height: 340px;

      border-style: dashed;

      opacity: .6;
    }

    .map-pin {
      position: relative;

      z-index: 2;

      width: 72px;
      height: 72px;

      display: grid;
      place-items: center;

      border-radius: 24px;

      background: var(--green-700);

      color: #fff;

      box-shadow:
        0 18px 38px
        rgba(8,116,67,.25);

      font-size: 27px;
    }

    .map-label {
      position: absolute;

      margin-top: 160px;

      display: flex;
      flex-direction: column;

      align-items: center;
    }

    .map-label strong {
      color: var(--green-900);

      font-size: 13px;
    }

    .map-label span {
      color: var(--muted);

      font-size: 9px;
    }

    /* =========================================================
       ABOUT
    ========================================================= */

    .about-grid {
      display: grid;

      grid-template-columns:
        1fr
        .9fr;

      gap: 90px;

      align-items: center;
    }

    .about-images {
      position: relative;

      min-height: 500px;
    }

    .about-main {
      position: absolute;

      top: 0;
      left: 0;

      width: 79%;
      height: 82%;

      overflow: hidden;

      border-radius: 30px;

      box-shadow: var(--shadow-md);
    }

    .about-main img {
      height: 100%;

      object-fit: cover;
    }

    .about-small {
      position: absolute;

      right: 0;
      bottom: 0;

      width: 45%;
      height: 43%;

      padding: 7px;

      border-radius: 25px;

      background: var(--cream);

      box-shadow: var(--shadow-md);
    }

    .about-small img {
      height: 100%;

      object-fit: cover;

      border-radius: 18px;
    }

    .about-content {
      max-width: 560px;
    }

    .about-content h2 {
      margin-bottom: 20px;

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      color: var(--green-950);

      font-size:
        clamp(32px, 4vw, 45px);

      line-height: 1.3;
    }

    .about-content p {
      margin-bottom: 15px;

      color: var(--text);

      font-size: 12px;

      line-height: 1.9;
    }

    .about-content .lead {
      color: #35443c;

      font-size: 13px;
    }

    .about-values {
      display: grid;

      grid-template-columns:
        repeat(2, 1fr);

      gap: 10px;

      margin-top: 29px;
    }

    .about-value {
      display: flex;

      gap: 10px;

      padding: 14px;

      border:
        1px solid var(--border);

      border-radius: 16px;

      background: #fff;
    }

    .about-value-icon {
      width: 34px;
      height: 34px;

      display: grid;
      place-items: center;

      flex-shrink: 0;

      border-radius: 10px;

      background: var(--green-50);

      color: var(--green-700);
    }

    .about-value strong {
      display: block;

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      font-size: 10px;
    }

    .about-value small {
      display: block;

      margin-top: 3px;

      color: var(--muted);

      font-size: 8px;

      line-height: 1.5;
    }

    /* =========================================================
       EMOTIONAL CTA
    ========================================================= */

    .emotional {
      position: relative;

      overflow: hidden;

      background:
        radial-gradient(
          circle at 50% 100%,
          rgba(41,173,111,.26),
          transparent 45%
        ),
        linear-gradient(
          135deg,
          #075631,
          #063d25
        );

      color: #fff;
    }

    .emotional-inner {
      min-height: 440px;

      display: flex;
      align-items: center;
      justify-content: center;

      text-align: center;
    }

    .emotional-content {
      position: relative;

      z-index: 2;
    }

    .emotional-content > span {
      display: block;

      margin-bottom: 16px;

      color: #8fe0b4;

      font-size: 10px;
      font-weight: 800;

      letter-spacing: .22em;
    }

    .emotional-content h2 {
      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      font-size:
        clamp(34px, 5vw, 58px);

      line-height: 1.3;

      letter-spacing: -.04em;
    }

    .emotional-content p {
      margin: 18px 0 25px;

      color:
        rgba(255,255,255,.74);

      font-size: 12px;
    }

    .emotional-decoration {
      position: absolute;

      width: 85px;
      height: 85px;

      display: grid;
      place-items: center;

      border:
        1px solid
        rgba(255,255,255,.10);

      border-radius: 28px;

      color:
        rgba(255,255,255,.25);

      font-size: 27px;
    }

    .emotional-decoration.left {
      left: 7%;
      top: 22%;

      transform: rotate(-12deg);
    }

    .emotional-decoration.right {
      right: 7%;
      bottom: 18%;

      transform: rotate(12deg);
    }

    /* =========================================================
       FAQ
    ========================================================= */

    .faq-grid {
      display: grid;

      grid-template-columns:
        .75fr
        1.25fr;

      gap: 90px;

      align-items: start;
    }

    .faq-intro {
      position: sticky;

      top: 110px;
    }

    .faq-intro h2 {
      margin-bottom: 17px;

      font-size:
        clamp(30px, 4vw, 43px);

      line-height: 1.25;

      letter-spacing: -.04em;
    }

    .faq-intro > p {
      color: var(--text);

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      font-size: 12px;

      line-height: 1.9;
    }

    .faq-contact {
      display: flex;
      align-items: center;

      gap: 10px;

      margin-top: 29px;

      padding: 14px;

      border:
        1px solid var(--border);

      border-radius: 17px;

      background: var(--green-50);
    }

    .faq-contact-icon {
      width: 39px;
      height: 39px;

      display: grid;
      place-items: center;

      flex-shrink: 0;

      border-radius: 12px;

      background: var(--green-700);

      color: #fff;
    }

    .faq-contact strong {
      display: block;

      font-size: 10px;
    }

    .faq-contact small {
      display: block;

      margin-top: 3px;

      color: var(--muted);

      font-size: 8px;
    }

    .faq-contact a {
      margin-left: auto;

      width: 32px;
      height: 32px;

      display: grid;
      place-items: center;

      border-radius: 50%;

      background: #fff;

      color: var(--green-700);
    }

    .faq-list {
      display: grid;

      gap: 9px;
    }

    .faq-item {
      overflow: hidden;

      border:
        1px solid var(--border);

      border-radius: 17px;

      background: #fff;

      transition:
        border-color .2s ease,
        box-shadow .2s ease;
    }

    .faq-item.open {
      border-color:
        rgba(8,116,67,.20);

      box-shadow:
        0 10px 35px
        rgba(12,43,27,.06);
    }

    .faq-question {
      width: 100%;

      display: flex;
      align-items: center;
      justify-content: space-between;

      gap: 20px;

      padding: 18px 19px;

      border: 0;

      background: transparent;

      color: var(--dark);

      text-align: left;

      cursor: pointer;

      font-size: 10px;
      font-weight: 800;
    }

    .faq-icon {
      flex-shrink: 0;

      color: #839089;

      font-size: 18px;

      transition:
        transform .25s ease;
    }

    .faq-item.open
      .faq-icon {
      transform: rotate(180deg);

      color: var(--green-700);
    }

    .faq-answer {
      display: grid;

      grid-template-rows: 0fr;

      transition:
        grid-template-rows .25s ease;
    }

    .faq-answer-inner {
      overflow: hidden;
    }

    .faq-answer p {
      padding: 0 19px;

      color: var(--muted);

      font-size: 10px;

      line-height: 1.8;
    }

    .faq-item.open
      .faq-answer {
      grid-template-rows: 1fr;
    }

    .faq-item.open
      .faq-answer p {
      padding:
        0 19px 18px;
    }

    /* =========================================================
       CONTACT
    ========================================================= */

    .contact-section {
      background: var(--light);
    }

    .contact-card {
      display: grid;

      grid-template-columns:
        1.05fr
        .95fr;

      gap: 50px;

      padding: 55px;

      border:
        1px solid var(--border);

      border-radius: 32px;

      background: #fff;

      box-shadow: var(--shadow-sm);
    }

    .contact-intro h2 {
      margin-bottom: 12px;

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      color: var(--green-950);

      font-size:
        clamp(31px, 4vw, 46px);

      line-height: 1.3;
    }

    .contact-intro p {
      max-width: 450px;

      color: var(--text);

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      font-size: 12px;

      line-height: 1.8;
    }

    .contact-buttons {
      display: flex;
      flex-wrap: wrap;

      gap: 10px;

      margin-top: 25px;
    }

    .contact-details {
      display: grid;

      gap: 10px;
    }

    .contact-detail {
      display: flex;
      align-items: center;

      gap: 13px;

      padding: 15px;

      border:
        1px solid var(--border);

      border-radius: 16px;

      transition:
        transform .2s ease,
        border-color .2s ease;
    }

    .contact-detail:hover {
      transform: translateX(3px);

      border-color:
        rgba(8,116,67,.22);
    }

    .contact-icon {
      width: 41px;
      height: 41px;

      display: grid;
      place-items: center;

      flex-shrink: 0;

      border-radius: 12px;

      background: var(--green-50);

      color: var(--green-700);

      font-size: 18px;
    }

    .contact-detail span {
      display: block;

      color: var(--muted);

      font-size: 8px;
      font-weight: 700;

      letter-spacing: .08em;

      text-transform: uppercase;
    }

    .contact-detail strong {
      display: block;

      margin-top: 4px;

      color: var(--dark);

      font-size: 10px;

      line-height: 1.4;

      word-break: break-word;
    }

    /* =========================================================
       FOOTER
    ========================================================= */

    footer {
      padding: 65px 0 25px;

      background: #052f1d;

      color: #fff;
    }

    .footer-grid {
      display: grid;

      grid-template-columns:
        1.5fr
        .8fr
        1fr
        1fr;

      gap: 55px;

      padding-bottom: 45px;

      border-bottom:
        1px solid
        rgba(255,255,255,.09);
    }

    .footer-brand p {
      max-width: 300px;

      margin: 20px 0;

      color:
        rgba(255,255,255,.56);

      font-family:
        "Noto Sans Malayalam",
        sans-serif;

      font-size: 15px;

      line-height: 1.8;
    }

    .footer-logo .logo-mark {
      width: 100px;
      height: 100px;

      background:
        rgba(255,255,255,.12);

      box-shadow: none;
    }

    .footer-logo .logo-text strong {
      font-size: 26px;
      color: #fff;
    }

    .footer-logo .logo-text small {
      color:
        rgba(255,255,255,.5);
    }

    .footer-whatsapp {
      display: inline-flex;
      align-items: center;

      gap: 7px;

      padding: 10px 14px;

      border:
        1px solid
        rgba(255,255,255,.12);

      border-radius: 999px;

      background:
        rgba(255,255,255,.05);

      font-size: 9px;
      font-weight: 800;
    }

    .footer-column {
      display: flex;
      flex-direction: column;

      align-items: flex-start;

      gap: 10px;
    }

    .footer-column h3 {
      margin-bottom: 7px;

      font-size: 16px;

      letter-spacing: .10em;

      text-transform: uppercase;
    }

    .footer-column a,
    .footer-column span {
      color:
        rgba(255,255,255,.53);

      font-size: 12px;

      line-height: 1.5;

      transition: color .2s ease;
    }

    .footer-column a:hover {
      color: #fff;
    }

    .footer-bottom {
      display: flex;
      align-items: center;
      justify-content: space-between;

      gap: 20px;

      padding-top: 23px;

      color:
        rgba(255,255,255,.38);

      font-size: 10px;
    }

    /* =========================================================
       FLOATING WHATSAPP
    ========================================================= */

    .floating-whatsapp {
      position: fixed;

      z-index: 1200;

      right: 24px;
      bottom: 24px;

      width: 57px;
      height: 57px;

      display: grid;
      place-items: center;

      border-radius: 50%;

      background: #18a861;

      color: #fff;

      font-size: 25px;

      box-shadow:
        0 13px 35px
        rgba(8,116,67,.28);

      animation:
        whatsappPulse 3s
        ease-in-out infinite;
    }

    @keyframes whatsappPulse {
      0%,
      100% {
        box-shadow:
          0 13px 35px
          rgba(8,116,67,.28);
      }

      50% {
        box-shadow:
          0 13px 35px
          rgba(8,116,67,.28),
          0 0 0 9px
          rgba(24,168,97,.08);
      }
    }

    .whatsapp-tooltip {
      position: absolute;

      right: 68px;

      white-space: nowrap;

      padding: 8px 11px;

      border-radius: 8px;

      background: #10241a;

      color: #fff;

      font-size: 9px;
      font-weight: 700;

      opacity: 0;

      pointer-events: none;

      transform: translateX(5px);

      transition:
        opacity .2s ease,
        transform .2s ease;
    }

    .floating-whatsapp:hover
      .whatsapp-tooltip {
      opacity: 1;

      transform:
        translateX(0);
    }

    .mobile-whatsapp {
      display: none;
    }

    /* =========================================================
       RESPONSIVE
    ========================================================= */

    @media (max-width: 1120px) {

      .nav {
        gap: 15px;
      }

      .nav a {
        font-size: 10px;
      }

      .services-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
      }

      .service-card {
        min-height: 320px;
      }

      .nri-card {
        gap: 45px;

        padding: 50px;
      }
    }

    @media (max-width: 950px) {

      .nav,
      .header-whatsapp {
        display: none;
      }

      .menu-button {
        display: grid;

        place-items: center;
      }

      .mobile-menu {
        display: flex;

        flex-direction: column;

        max-height: 0;

        overflow: hidden;

        padding: 0 20px;

        background: #fff;

        transition:
          max-height .3s ease,
          padding .3s ease;
      }

      .mobile-menu.active {
        max-height: 600px;

        padding:
          10px 20px 20px;

        border-top:
          1px solid var(--border);
      }

      .mobile-menu a {
        padding: 12px 0;

        border-bottom:
          1px solid var(--border);

        font-size: 11px;
        font-weight: 700;
      }

      .mobile-menu .mobile-wa {
        display: flex;

        align-items: center;
        justify-content: center;

        gap: 7px;

        margin-top: 10px;

        padding: 13px;

        border: 0;

        border-radius: 12px;

        background: var(--green-700);

        color: #fff;
      }

      .hero {
        min-height: auto;
      }

      .hero-grid {
        grid-template-columns: 1fr;

        padding-top: 55px;
        padding-bottom: 100px;

        gap: 30px;
      }

      .hero-visual {
        min-height: 520px;
      }

      .hero-image-card {
        width: min(100%, 600px);
      }

      .trust-grid,
      .about-grid {
        grid-template-columns: 1fr;

        gap: 55px;
      }

      .trust-content,
      .about-content {
        max-width: 700px;
      }

      .nri-card {
        grid-template-columns: 1fr;

        gap: 45px;
      }

      .nri-right {
        max-width: 850px;
      }

      .areas-inner {
        grid-template-columns: 1fr;

        gap: 20px;

        padding:
          70px 0;
      }

      .areas-map {
        border-left: 0;
      }

      .faq-grid {
        grid-template-columns: 1fr;

        gap: 45px;
      }

      .faq-intro {
        position: static;

        max-width: 650px;
      }

      .contact-card {
        grid-template-columns: 1fr;
      }

      .footer-grid {
        grid-template-columns:
          1.5fr
          1fr
          1fr;
      }
    }

    @media (max-width: 700px) {

      .container {
        width:
          min(
            calc(100% - 30px),
            var(--container)
          );
      }

      .header {
        height: 70px;
      }

      .logo-mark {
        width: 39px;
        height: 39px;
      }

      .logo-text strong {
        font-size: 16px;
      }

      .hero {
        padding-top: 80px;
      }

      .hero h1 {
        font-size:
          clamp(34px, 9vw, 48px);
      }

      .hero-description {
        font-size: 12px;
      }

      .hero-actions {
        flex-direction: column;

        align-items: stretch;
      }

      .hero-actions .btn {
        width: 100%;
      }

      .trust-row {
        gap: 8px 12px;
      }

      .trust-row span {
        font-size: 8px;
      }

      .hero-visual {
        min-height: 420px;
      }

      .hero-image-card {
        width: 88%;

        border-radius: 25px;
      }

      .hero-card-one {
        left: -3px;
        bottom: 27px;

        min-width: auto;

        padding: 10px;
      }

      .hero-card-two {
        right: -2px;
        top: 30px;
      }

      .hero-orbit {
        display: none;
      }

      .hero-bottom-inner {
        min-height: 48px;

        justify-content: center;

        font-size: 7px;

        text-align: center;
      }

      .hero-bottom-inner
        span:last-child,
      .hero-line {
        display: none;
      }

      .section {
        padding: 78px 0;
      }

      .section-heading {
        margin-bottom: 38px;
      }

      .section-heading h2 {
        font-size: 31px;
      }

      .trust-visual,
      .about-images {
        min-height: 390px;
      }

      .trust-main-image,
      .about-main {
        width: 82%;
        height: 82%;
      }

      .trust-small-image,
      .about-small {
        width: 48%;
        height: 43%;
      }

      .trust-stat {
        left: 10px;
        bottom: 25px;
      }

      .services-grid {
        grid-template-columns: 1fr;
      }

      .service-card {
        min-height: 290px;
      }

      .nri-card {
        padding: 30px 22px;

        border-radius: 26px;
      }

      .nri-right {
        grid-template-columns: 1fr;
      }

      .nri-image {
        height: 290px;
      }

      .why-grid {
        grid-template-columns: 1fr;
      }

      .why-card {
        min-height: 190px;
      }

      .steps {
        grid-template-columns: 1fr;
      }

      .step-arrow {
        display: none;
      }

      .areas-map {
        height: 280px;
      }

      .map-circle.three {
        width: 280px;
        height: 280px;
      }

      .about-values {
        grid-template-columns: 1fr;
      }

      .emotional-inner {
        min-height: 390px;
      }

      .emotional-content h2 {
        font-size: 35px;
      }

      .emotional-decoration {
        width: 60px;
        height: 60px;
      }

      .faq-question {
        padding: 16px;
      }

      .faq-answer p {
        padding-left: 16px;
        padding-right: 16px;
      }

      .faq-item.open
        .faq-answer p {
        padding:
          0 16px 17px;
      }

      .contact-card {
        padding: 30px 22px;

        border-radius: 25px;
      }

      .contact-buttons {
        flex-direction: column;
      }

      .contact-buttons .btn {
        width: 100%;
      }

      footer {
        padding-bottom: 85px;
      }

      .footer-grid {
        grid-template-columns:
          1fr
          1fr;

        gap: 40px 25px;
      }

      .footer-brand {
        grid-column: 1 / -1;
      }

      .footer-bottom {
        align-items: flex-start;

        flex-direction: column;

        gap: 7px;
      }

      .floating-whatsapp {
        display: none;
      }

      .mobile-whatsapp {
        position: fixed;

        z-index: 1200;

        left: 15px;
        right: 15px;
        bottom: 14px;

        height: 51px;

        display: flex;

        align-items: center;
        justify-content: center;

        gap: 8px;

        border-radius: 15px;

        background: var(--green-700);

        color: #fff;

        box-shadow:
          0 15px 35px
          rgba(8,65,38,.28);

        font-size: 11px;
        font-weight: 800;
      }
    }

    @media (max-width: 400px) {

      .container {
        width:
          calc(100% - 24px);
      }

      .hero h1 {
        font-size: 32px;
      }

      .hero-visual {
        min-height: 360px;
      }

      .hero-image-card {
        width: 91%;
      }

      .hero-card-one {
        bottom: 17px;
      }

      .hero-card-two {
        top: 18px;
      }

      .trust-visual,
      .about-images {
        min-height: 330px;
      }

      .trust-stat {
        left: 4px;
        bottom: 14px;

        padding: 9px;
      }

      .trust-stat-icon {
        width: 33px;
        height: 33px;
      }

      .trust-stat strong {
        font-size: 10px;
      }

      .emotional-content h2 {
        font-size: 30px;
      }

      .emotional-decoration {
        display: none;
      }
    }

    /* =========================================================
       REDUCED MOTION
    ========================================================= */

    @media (prefers-reduced-motion: reduce) {

      html {
        scroll-behavior: auto;
      }

      *,
      *::before,
      *::after {
        animation-duration: .01ms !important;

        animation-iteration-count: 1 !important;

        transition-duration: .01ms !important;

        scroll-behavior: auto !important;
      }
    }

  
.service-page{padding:132px 0 90px}.service-breadcrumbs{margin-bottom:24px;color:var(--muted);font-size:12px}.service-breadcrumbs a{color:var(--green-700);text-decoration:underline}.service-page h1{max-width:850px;margin:0 0 20px;color:var(--green-950);font-size:clamp(34px,5vw,56px);line-height:1.2}.service-lead{max-width:760px;margin-bottom:36px;color:var(--text);font-size:17px;line-height:1.85}.service-copy{max-width:820px;padding:clamp(24px,5vw,48px);border:1px solid var(--border);border-radius:var(--radius-lg);background:#fff;box-shadow:var(--shadow-sm)}.service-copy h2{margin:30px 0 10px;color:var(--green-950);font-size:clamp(22px,3vw,30px)}.service-copy p{color:var(--text);font-size:14px;line-height:1.9}.service-page-links{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:22px}.service-page-links a{color:var(--green-700);font-size:12px;font-weight:800;text-decoration:underline}.service-cta{margin-top:32px;padding:28px;border-radius:var(--radius-md);background:var(--green-50)}.service-cta h2{margin:0 0 8px}.service-cta p{margin-bottom:18px}@media(max-width:700px){.service-page{padding-top:112px}}

.service-card:focus-visible {
  outline: 3px solid #b7f0ce;
  outline-offset: 4px;
  transform: translateY(-3px);
  box-shadow: 0 0 0 2px var(--green-900), var(--shadow-md);
}
