:root {
      --green: #075f20;
      --green-dark: #014617;
      --green-soft: #edf5ef;
      --text: #101010;
      --muted: #4a4f4a;
      --line: #d9e0d8;
      --shadow: 0 8px 24px rgba(10, 40, 20, 0.12);
      --radius: 8px;
    }

    * {
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      margin: 0;
      color: var(--text);
      background: #fff;
      font-family: "Inter", Arial, sans-serif;
      line-height: 1.55;
      overflow-x: hidden;
    }

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

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

    .container {
      width: min(1260px, calc(100% - 42px));
      margin: 0 auto;
    }

    .icon {
      width: 32px;
      height: 32px;
      color: var(--green);
      flex: 0 0 auto;
    }

    .button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      min-height: 52px;
      padding: 0 30px;
      border: 1px solid var(--green);
      border-radius: 6px;
      font-weight: 700;
      transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    }

    .button:hover {
      transform: translateY(-1px);
      box-shadow: 0 8px 20px rgba(0, 75, 24, 0.18);
    }

    .button.primary {
      color: #fff;
      background: linear-gradient(135deg, var(--green), var(--green-dark));
    }

    .button.secondary {
      color: var(--green);
      background: rgba(255, 255, 255, 0.88);
    }

    .button.small {
      min-height: 38px;
      padding: 0 19px;
      font-size: 14px;
    }

    .button .whatsapp-icon {
      width: 22px;
      height: 22px;
      flex: 0 0 auto;
      display: block;
    }

    .section-title {
      margin: 0;
      color: var(--green);
      font-size: clamp(28px, 3vw, 36px);
      line-height: 1.15;
      text-align: center;
    }

    .section-subtitle {
      margin: 8px auto 34px;
      max-width: 660px;
      color: #1d1d1d;
      text-align: center;
      font-size: 16px;
    }

    .site-header {
      position: sticky;
      top: 0;
      z-index: 10;
      background: rgba(255, 255, 255, 0.96);
      box-shadow: 0 1px 0 rgba(0, 0, 0, 0.07);
      backdrop-filter: blur(10px);
    }

    .nav-wrap {
      display: flex;
      align-items: center;
      justify-content: space-between;
      min-height: 94px;
      gap: 24px;
    }

    .brand {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      min-width: 270px;
    }

    .brand-mark {
      width: 56px;
      height: 56px;
      object-fit: contain;
      flex: 0 0 auto;
    }

    .brand-name {
      display: block;
      color: var(--green);
      font-size: 26px;
      font-weight: 800;
      line-height: 1;
    }

    .brand-tagline {
      display: block;
      margin-top: 6px;
      font-size: 12px;
      font-weight: 600;
    }

    .nav {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: clamp(17px, 2.1vw, 34px);
      font-size: 14px;
      font-weight: 800;
      white-space: nowrap;
    }

    .nav a {
      position: relative;
      padding: 14px 0;
    }

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

    .nav a.active::after {
      position: absolute;
      right: 0;
      bottom: 7px;
      left: 0;
      height: 3px;
      border-radius: 4px;
      background: var(--green);
      content: "";
    }

    .hero {
      width: min(1260px, calc(100% - 42px));
      min-height: clamp(620px, 36vw, 680px);
      margin: 0 auto;
      background:
        linear-gradient(90deg, rgba(255,255,255,0.96) 0%, rgba(255,255,255,0.86) 32%, rgba(255,255,255,0.18) 55%, rgba(255,255,255,0) 100%),
        linear-gradient(0deg, rgba(255,255,255,0.1), rgba(255,255,255,0.1)),
        url("assets/home/banner.png") center center / cover;
      position: relative;
    }

    .hero .container {
      width: 100%;
      min-height: clamp(620px, 36vw, 680px);
      display: flex;
      align-items: center;
    }

    .hero-copy {
      width: min(620px, 100%);
      padding: 46px 0 78px;
    }

    .hero h1 {
      margin: 0 0 24px;
      font-size: clamp(34px, 3.5vw, 43px);
      line-height: 1.1;
      letter-spacing: 0;
    }

    .hero h1 span {
      display: block;
      color: var(--green);
      font-size: clamp(42px, 4.9vw, 58px);
      font-weight: 800;
    }

    .hero p {
      margin: 0 0 11px;
      max-width: 560px;
      font-size: 18px;
    }

    .hero-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 20px;
      margin-top: 34px;
    }

    .stats {
      margin-top: -160px;
      position: relative;
      z-index: 2;
    }

    .stats-panel {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      min-height: 160px;
      padding: 0 34px;
      border-radius: var(--radius);
      background: rgba(247, 250, 245, 0.94);
      box-shadow: var(--shadow);
      backdrop-filter: blur(6px);
    }

    .stat {
      display: flex;
      align-items: center;
      gap: 21px;
      padding: 26px 24px;
      border-right: 1px solid var(--line);
    }

    .stat:last-child {
      border-right: 0;
    }

    .stat h3 {
      margin: 0;
      color: var(--green);
      font-size: 16px;
      line-height: 1.35;
    }

    .stat p {
      margin: 3px 0 0;
      font-size: 13px;
      line-height: 1.45;
    }

    .products {
      padding: 34px 0 24px;
    }

    .product-grid {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 26px;
    }

    .product-carousel {
      --product-carousel-gap: 26px;
      overflow: hidden;
      margin-top: 32px;
      padding: 4px 0 16px;
    }

    .product-carousel-track {
      display: flex;
      gap: var(--product-carousel-gap);
      width: 100%;
      transform: translateX(0);
      will-change: transform;
    }

    .product-carousel.is-ready .product-carousel-track {
      animation: product-carousel-loop 28s linear infinite;
    }

    .product-carousel:hover .product-carousel-track,
    .product-carousel:focus-within .product-carousel-track {
      animation-play-state: paused;
    }

    .product-carousel-set {
      flex: 0 0 100%;
      gap: var(--product-carousel-gap);
    }

    @keyframes product-carousel-loop {
      to {
        transform: translateX(calc(-100% - var(--product-carousel-gap)));
      }
    }

    @keyframes product-carousel-loop-row {
      to {
        transform: translateX(calc(-50% - var(--product-carousel-half-gap)));
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .product-carousel.is-ready .product-carousel-track {
        animation: none;
      }
    }

    .product-card {
      display: flex;
      flex-direction: column;
      overflow: hidden;
      min-height: 382px;
      border: 1px solid #d8ddd8;
      border-radius: var(--radius);
      background: #fff;
      box-shadow: 0 7px 18px rgba(0, 0, 0, 0.06);
      text-align: center;
    }

    .product-card img {
      width: 100%;
      height: 168px;
      object-fit: cover;
    }

    .product-card h3 {
      margin: 26px 18px 14px;
      font-size: 20px;
      line-height: 1.25;
    }

    .product-card p {
      min-height: 66px;
      margin: 0 24px 18px;
      font-size: 14px;
    }

    .product-card .button {
      align-self: center;
      margin-top: auto;
      margin-bottom: 24px;
    }

    .why {
      padding: 20px 0 35px;
    }

    .benefits {
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      gap: 0;
      border-bottom: 1px solid var(--line);
      padding: 24px 0 38px;
    }

    .benefit {
      display: grid;
      grid-template-columns: 46px minmax(0, 1fr);
      align-items: center;
      gap: 12px;
      min-height: 68px;
      padding: 0 16px;
      border-right: 1px solid var(--line);
      font-size: 13px;
      font-weight: 800;
      line-height: 1.35;
    }

    .benefit:last-child {
      border-right: 0;
    }

    .benefit .icon {
      display: block;
      width: 40px;
      height: 40px;
      justify-self: center;
    }

    .benefit span {
      display: block;
      min-width: 0;
    }

    .process {
      padding: 0 0 58px;
    }

    .process-grid {
      display: grid;
      grid-template-columns: 1fr 70px 1fr 70px 1fr 70px 1fr 70px 1fr;
      align-items: start;
      gap: 10px;
      margin-top: 36px;
    }

    .step {
      display: grid;
      grid-template-rows: 76px auto auto;
      text-align: center;
    }

    .step .icon {
      display: block;
      width: 60px;
      height: 60px;
      margin: 0 auto 15px;
    }

    .step h3 {
      margin: 0 0 8px;
      font-size: 16px;
    }

    .step p {
      margin: 0 auto;
      max-width: 180px;
      font-size: 13px;
    }

    .arrow {
      width: 70px;
      height: 24px;
      margin-top: 18px;
      color: var(--green);
    }

    .sourcing {
      padding: 0 0 24px;
    }

    .sourcing-heading {
      display: flex;
      align-items: center;
      gap: 16px;
      margin-bottom: 18px;
    }

    .sourcing-badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
      width: 42px;
      height: 42px;
      border-radius: 50%;
      color: #fff;
      background: linear-gradient(135deg, var(--green), var(--green-dark));
      box-shadow: 0 8px 20px rgba(7, 95, 32, 0.2);
      font-size: 22px;
      font-weight: 800;
      line-height: 1;
    }

    .sourcing-heading h2 {
      margin: 0;
      color: var(--green);
      font-size: clamp(27px, 3vw, 34px);
      line-height: 1.15;
    }

    .sourcing-panel {
      position: relative;
      overflow: hidden;
      min-height: 430px;
      border: 1px solid #dfe6dc;
      border-radius: 10px;
      background:
        linear-gradient(90deg, rgba(255,255,255,0.99) 0%, rgba(255,255,255,0.96) 29%, rgba(255,255,255,0.76) 41%, rgba(255,255,255,0.12) 58%, rgba(255,255,255,0) 100%),
        url("assets/home/custom-sourcing-map.png") center / cover no-repeat;
      box-shadow: 0 16px 38px rgba(10, 40, 20, 0.09);
    }

    .sourcing-panel::after {
      content: "";
      position: absolute;
      right: -8%;
      bottom: -34%;
      width: 74%;
      height: 42%;
      border-radius: 50% 50% 0 0;
      background: linear-gradient(180deg, rgba(7,95,32,0.05), rgba(7,95,32,0));
      pointer-events: none;
    }

    .sourcing-copy {
      position: relative;
      z-index: 1;
      max-width: 570px;
      padding: 38px 30px 34px 46px;
    }

    .sourcing-eyebrow {
      margin: 0 0 18px;
      color: var(--green);
      font-size: 18px;
      font-weight: 800;
      letter-spacing: 0;
      line-height: 1.25;
      text-transform: uppercase;
    }

    .sourcing-copy h3 {
      margin: 0 0 20px;
      color: #16202c;
      font-size: clamp(28px, 2.6vw, 34px);
      line-height: 1.16;
    }

    .sourcing-copy h3 span {
      color: var(--green);
    }

    .sourcing-copy h3 .sourcing-title-main {
      color: #16202c;
      white-space: nowrap;
    }

    .check-list {
      display: grid;
      gap: 8px;
      margin: 0 0 22px;
      padding: 0;
      list-style: none;
      color: #17242d;
      font-size: 16px;
    }

    .check-list li {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .check-list svg {
      width: 21px;
      height: 21px;
      padding: 4px;
      flex: 0 0 auto;
      border-radius: 50%;
      color: #fff;
      background: var(--green);
    }

    .sourcing-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 20px;
    }

    .sourcing-actions .button {
      min-width: 178px;
    }

    .sourcing-actions .button.secondary {
      min-width: 210px;
      background: rgba(255, 255, 255, 0.82);
    }

    .sourcing-map {
      display: none;
    }

    .sourcing-map svg {
      width: min(100%, 760px);
      height: auto;
      overflow: visible;
      transform: translateY(-18px);
    }

    .map-land {
      fill: #e6eee4;
      opacity: 0.92;
    }

    .map-lines {
      fill: none;
      stroke: var(--green);
      stroke-width: 2;
      stroke-linecap: round;
      opacity: 0.72;
    }

    .india-shape {
      fill: url(#indiaGradient);
      stroke: #fff;
      stroke-width: 2;
      filter: drop-shadow(0 8px 10px rgba(7, 95, 32, 0.18));
    }

    .india-dot {
      fill: #fff;
      stroke: var(--green);
      stroke-width: 3;
    }

    .map-pins {
      fill: #369b34;
      stroke: #fff;
      stroke-width: 1.4;
    }

    .footer {
      margin: 0 auto 10px;
      width: min(1280px, calc(100% - 20px));
      overflow: hidden;
      border-radius: 12px;
      color: #fff;
      background:
        radial-gradient(circle at 35% 70%, rgba(0, 110, 39, 0.6), rgba(0, 62, 19, 0) 34%),
        linear-gradient(135deg, #073b18, #006322 58%, #003910);
    }

    .footer-cta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 22px;
      min-height: 124px;
      padding: 28px 60px;
      border-bottom: 1px solid rgba(255,255,255,0.5);
    }

    .footer-cta h2 {
      margin: 0 0 4px;
      font-size: clamp(25px, 3.5vw, 34px);
      line-height: 1.2;
    }

    .footer-cta p {
      margin: 0;
      font-size: 17px;
    }

    .footer-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 22px;
    }

    .footer-actions .button.secondary {
      min-width: 150px;
      background: #fff;
      color: var(--green);
    }

    .footer-actions .button.outline {
      min-width: 220px;
      color: #fff;
      border-color: rgba(255,255,255,0.6);
      background: transparent;
    }

    .footer-main {
      display: grid;
      grid-template-columns: 1.5fr 0.78fr 0.78fr 1.18fr 1fr;
      gap: 0;
      padding: 50px 45px 28px;
    }

    .footer-col {
      min-height: 188px;
      padding: 0 24px;
      border-right: 1px solid rgba(255,255,255,0.2);
    }

    .footer-col:last-child {
      border-right: 0;
    }

    .footer .brand {
      display: block;
      min-width: auto;
      margin-bottom: 22px;
      color: #fff;
    }

    .footer .brand-mark {
      width: 44px;
      height: 44px;
    }

    .footer .brand-name {
      color: #fff;
    }

    .footer .brand-name {
      font-size: 22px;
      white-space: nowrap;
    }

    .footer .brand-tagline {
      color: #fff;
      font-size: 11px;
    }

    .footer p,
    .footer li,
    .footer a {
      color: rgba(255,255,255,0.96);
      font-size: 15px;
    }

    .footer h3 {
      margin: 0 0 17px;
      font-size: 18px;
    }

    .footer ul {
      display: grid;
      gap: 4px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .contact-list {
      gap: 16px !important;
    }

    .contact-list li {
      display: flex;
      align-items: flex-start;
      gap: 14px;
    }

    .contact-list svg {
      width: 17px;
      height: 17px;
      margin-top: 3px;
      color: #fff;
      flex: 0 0 auto;
    }

    .contact-list a,
    .contact-items a {
      color: inherit;
      text-decoration: none;
    }

    .map-link {
      display: inline-block;
      border-radius: 4px;
    }

    .contact-list a:hover,
    .contact-list a:focus-visible,
    .contact-items a:not(.contact-whatsapp-link):hover,
    .contact-items a:not(.contact-whatsapp-link):focus-visible {
      text-decoration: underline;
    }

    .contact-lines {
      display: block;
      min-width: 0;
      line-height: 1.45;
    }

    .socials {
      display: flex;
      gap: 16px;
      margin-top: 0;
    }

    .socials a {
      display: grid;
      width: 40px;
      height: 40px;
      place-items: center;
      border-radius: 50%;
      color: #fff;
      font-size: 0;
      font-weight: 800;
      background-position: center;
      background-repeat: no-repeat;
      background-size: 21px 21px;
      transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
    }

    .socials a:hover,
    .socials a:focus-visible {
      transform: translateY(-1px);
      box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
      outline: 0;
    }

    .fb { background: #4267b2; }
    .ig {
      background-color: #cf3c8e;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M17.5 6.5h.01'/%3E%3C/svg%3E");
    }
    .in { background: #2877b5; }
    .wa {
      background-color: #25d366;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23fff' d='M16.04 3C8.86 3 3 8.78 3 15.88c0 2.28.61 4.5 1.78 6.45L3.6 29l6.9-1.8a13.13 13.13 0 0 0 5.54 1.23h.01C23.24 28.43 29 22.66 29 15.56 29 8.48 23.22 3 16.04 3Zm0 23.18c-1.86 0-3.68-.5-5.27-1.44l-.38-.22-4.1 1.07 1.09-3.98-.25-.41a10.58 10.58 0 0 1-1.63-5.62c0-5.71 4.73-10.36 10.55-10.36 2.82 0 5.47 1.08 7.46 3.04a10.21 10.21 0 0 1 3.09 7.3c0 5.86-4.74 10.62-10.56 10.62Z'/%3E%3Cpath fill='%23fff' d='M21.83 18.45c-.32-.16-1.87-.92-2.16-1.03-.29-.11-.5-.16-.71.16-.21.32-.82 1.03-1 1.24-.18.21-.37.24-.69.08-.32-.16-1.35-.5-2.57-1.59-.95-.85-1.59-1.9-1.78-2.22-.18-.32-.02-.49.14-.65.14-.14.32-.37.48-.55.16-.18.21-.32.32-.53.11-.21.05-.4-.03-.55-.08-.16-.71-1.72-.98-2.35-.26-.62-.52-.53-.71-.54h-.61c-.21 0-.55.08-.84.4-.29.32-1.11 1.08-1.11 2.64s1.14 3.07 1.3 3.28c.16.21 2.24 3.42 5.43 4.79.76.33 1.35.52 1.81.67.76.24 1.45.21 2 .13.61-.09 1.87-.77 2.14-1.51.26-.74.26-1.37.18-1.51-.08-.13-.29-.21-.61-.37Z'/%3E%3C/svg%3E");
    }

    .copyright {
      margin: 0;
      padding: 0 0 24px;
      text-align: center;
      color: rgba(255,255,255,0.96);
      font-size: 14px;
    }

    .about-hero {
      width: min(1260px, calc(100% - 42px));
      min-height: 520px;
      margin: 0 auto;
      background:
        linear-gradient(90deg, rgba(255,255,255,0.98) 0%, rgba(255,255,255,0.92) 34%, rgba(255,255,255,0.28) 61%, rgba(255,255,255,0) 100%),
        url("assets/about/about-banner.png") center right / cover;
    }

    .about-hero .container {
      width: 100%;
      min-height: 520px;
      display: flex;
      align-items: center;
    }

    .about-copy {
      width: min(560px, 100%);
      padding: 48px 0;
    }

    .about-copy h1 {
      margin: 0 0 16px;
      font-size: clamp(42px, 5vw, 54px);
      line-height: 1.08;
    }

    .about-copy h2 {
      margin: 0 0 24px;
      color: var(--green);
      font-size: clamp(26px, 3vw, 32px);
      line-height: 1.18;
    }

    .about-copy p {
      margin: 0;
      font-size: 17px;
      line-height: 1.75;
    }

    .about-story {
      padding: 40px 0 18px;
    }

    .about-story-grid {
      display: grid;
      grid-template-columns: minmax(0, 470px) minmax(0, 1fr);
      gap: 72px;
      align-items: center;
    }

    .about-story-visual {
      position: relative;
      width: min(100%, 470px);
    }

    .about-story-visual img {
      display: block;
      width: 100%;
      border-radius: 28px;
      box-shadow: 0 18px 42px rgba(0,0,0,0.1);
    }

    .about-story-badge {
      position: absolute;
      top: 22px;
      right: -56px;
      display: flex;
      min-width: 124px;
      padding: 24px 22px;
      border-radius: 18px;
      background: #2f8a3b;
      color: #fff;
      box-shadow: 0 16px 34px rgba(47,138,59,0.22);
      text-align: center;
      align-items: center;
      flex-direction: column;
      justify-content: center;
      gap: 8px;
    }

    .about-story-badge strong {
      display: block;
      font-size: 42px;
      line-height: 1;
      font-weight: 800;
    }

    .about-story-badge span {
      font-size: 14px;
      line-height: 1.5;
      font-weight: 600;
    }

    .about-story-title {
      margin: 0 0 22px;
      color: #111;
      font-family: Georgia, "Times New Roman", serif;
      font-size: clamp(32px, 3.2vw, 44px);
      font-weight: 700;
      line-height: 1.1;
    }

    .about-story-title span {
      color: var(--green);
    }

    .about-story-copy p {
      margin: 0;
      color: #4f4f4f;
      font-size: 17px;
      line-height: 1.75;
    }

    .about-story-list {
      display: grid;
      gap: 16px;
      margin: 28px 0 0;
      padding: 0;
      list-style: none;
    }

    .about-story-list li {
      display: flex;
      align-items: center;
      gap: 12px;
      color: #1e1e1e;
      font-size: 16px;
      line-height: 1.4;
    }

    .about-story-list svg {
      width: 18px;
      height: 18px;
      color: #2f8a3b;
      flex: 0 0 auto;
    }

    .about-facts {
      display: grid;
      grid-template-columns: repeat(2, max-content);
      gap: 34px;
      margin-top: 32px;
    }

    .about-fact {
      display: flex;
      align-items: center;
      gap: 16px;
      min-width: 150px;
    }

    .about-fact + .about-fact {
      padding-left: 28px;
      border-left: 1px solid var(--line);
    }

    .about-fact strong {
      display: block;
      color: var(--green);
      font-size: 24px;
      line-height: 1;
    }

    .about-section {
      padding: 30px 0;
    }

    .about-section .section-title {
      color: #111;
      font-size: clamp(25px, 2.6vw, 32px);
    }

    .about-section .section-title::after {
      display: block;
      width: 42px;
      height: 2px;
      margin: 12px auto 0;
      background: var(--green);
      content: "";
    }

    .strength-grid {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 20px;
      margin-top: 28px;
    }

    .strength-card {
      min-height: 205px;
      padding: 28px 24px;
      border: 1px solid #dfe4df;
      border-radius: var(--radius);
      background: #fff;
      box-shadow: 0 8px 24px rgba(0,0,0,0.08);
      text-align: center;
    }

    .strength-card .icon {
      width: 62px;
      height: 62px;
      margin: 0 auto 18px;
      padding: 11px;
      border-radius: 50%;
      background: #eef8f0;
      box-shadow: inset 0 0 0 1px #d7eadb;
      color: var(--green);
    }

    .strength-card h3 {
      margin: 0 0 12px;
      font-size: 17px;
    }

    .strength-card p {
      margin: 0;
      font-size: 14px;
      line-height: 1.65;
    }

    .operations-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 20px;
      margin-top: 28px;
    }

    .operation-card {
      overflow: hidden;
      border: 1px solid #dfe4df;
      border-radius: var(--radius);
      background: #fff;
      box-shadow: 0 8px 22px rgba(0,0,0,0.08);
    }

    .operation-card img {
      width: 100%;
      height: 186px;
      object-fit: cover;
    }

    .operation-card div {
      padding: 20px 28px 26px;
    }

    .operation-card h3 {
      margin: 0 0 10px;
      font-size: 17px;
    }

    .operation-card p {
      margin: 0;
      font-size: 14px;
      line-height: 1.65;
    }

    .mission {
      padding: 0 0 28px;
    }

    .mission-grid {
      display: grid;
      grid-template-columns: 1fr 0.95fr;
      align-items: center;
      gap: 56px;
    }

    .mission-image {
      overflow: hidden;
      border-radius: var(--radius);
      box-shadow: 0 7px 20px rgba(0,0,0,0.07);
    }

    .mission-image img {
      width: 100%;
      min-height: 266px;
      object-fit: cover;
    }

    .mission-copy h2 {
      margin: 0 0 22px;
      font-size: clamp(28px, 3vw, 34px);
      line-height: 1.1;
    }

    .mission-copy h2::after {
      display: block;
      width: 54px;
      height: 2px;
      margin-top: 14px;
      background: var(--green);
      content: "";
    }

    .mission-copy p {
      margin: 0 0 24px;
      max-width: 520px;
      font-size: 16px;
      line-height: 1.75;
    }

    .mission-list {
      display: grid;
      gap: 12px;
      margin: 0;
      padding: 0;
      list-style: none;
      font-size: 15px;
    }

    .mission-list li {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .mission-list svg {
      width: 20px;
      height: 20px;
      color: var(--green);
      flex: 0 0 auto;
    }

    .relationship-cta {
      width: min(1260px, calc(100% - 42px));
      margin: 0 auto 12px;
      overflow: hidden;
      border: 1px solid #dbe8d4;
      border-radius: 16px;
      color: var(--green-dark);
      box-shadow: 0 12px 30px rgba(7, 95, 32, 0.08);
      background: #f1f7e8;
    }

    .relationship-inner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      min-height: 116px;
      padding: 28px 40px;
    }

    .relationship-inner h2 {
      margin: 0 0 8px;
      color: var(--green-dark);
      font-size: 24px;
      line-height: 1.2;
    }

    .relationship-inner p {
      margin: 0;
      max-width: 530px;
      color: #28432e;
      font-size: 16px;
    }

    .relationship-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 28px;
    }

    .relationship-actions .button.secondary {
      min-width: 140px;
      color: #fff;
      border-color: transparent;
      background: linear-gradient(135deg, var(--green), var(--green-dark));
    }

    .relationship-actions .button.outline {
      min-width: 180px;
      color: var(--green-dark);
      border-color: rgba(7, 95, 32, 0.24);
      background: rgba(255, 255, 255, 0.7);
    }

    .page-hero {
      width: min(1260px, calc(100% - 42px));
      margin: 0 auto;
      padding: 58px 0;
      background: linear-gradient(110deg, #fff 0%, #fff 45%, #f4f8f4 100%);
    }

    .page-hero.no-background {
      background: transparent;
    }

    .page-hero.with-image {
      min-height: 520px;
      padding: 0;
      background:
        linear-gradient(90deg, rgba(255,255,255,0.98) 0%, rgba(255,255,255,0.92) 34%, rgba(255,255,255,0.28) 61%, rgba(255,255,255,0) 100%),
        url("assets/service/services-banner.png") center right / cover;
    }

    .page-hero.with-image .container {
      min-height: 520px;
      display: flex;
      align-items: center;
    }

    .page-hero h1 {
      margin: 0 0 8px;
      font-size: clamp(36px, 4vw, 46px);
      line-height: 1.08;
    }

    .page-hero h1 span {
      color: var(--green);
    }

    .page-hero p {
      max-width: 520px;
      margin: 18px 0 0;
      font-size: 16px;
      line-height: 1.75;
    }

    .breadcrumb {
      display: flex;
      align-items: center;
      gap: 10px;
      margin: 0;
      padding: 0;
      list-style: none;
      font-size: 14px;
      font-weight: 600;
    }

    .breadcrumb li + li::before {
      display: inline-block;
      width: 7px;
      height: 7px;
      margin-right: 10px;
      border-top: 2px solid var(--green);
      border-right: 2px solid var(--green);
      content: "";
      transform: rotate(45deg) translateY(-1px);
    }

    .services-products {
      padding: 24px 0 36px;
    }

    .services-products .product-grid {
      grid-template-columns: repeat(4, 1fr);
    }

    .services-products .service-product-carousel {
      --service-product-carousel-gap: 26px;
      position: relative;
    }

    .services-products .service-product-carousel.is-enabled {
      padding: 4px 54px 16px;
    }

    .services-products .service-product-carousel.is-enabled .service-product-carousel-track {
      display: flex;
      grid-template-columns: none;
      gap: var(--service-product-carousel-gap);
      overflow-x: auto;
      scroll-behavior: smooth;
      scroll-padding-inline: 2px;
      scroll-snap-type: x mandatory;
      scrollbar-width: none;
      overscroll-behavior-inline: contain;
      cursor: grab;
      touch-action: pan-y;
    }

    .services-products .service-product-carousel.is-enabled .service-product-carousel-track::-webkit-scrollbar {
      display: none;
    }

    .services-products .service-product-carousel.is-enabled .product-card {
      flex: 0 0 calc(25% - 19.5px);
      max-width: calc(25% - 19.5px);
      scroll-snap-align: start;
    }

    .services-products .service-product-carousel.is-dragging .service-product-carousel-track {
      scroll-behavior: auto;
      scroll-snap-type: none;
      cursor: grabbing;
      user-select: none;
    }

    .services-products .service-product-carousel-button {
      position: absolute;
      top: 50%;
      z-index: 2;
      display: none;
      align-items: center;
      justify-content: center;
      width: 42px;
      height: 42px;
      border: 1px solid #d9e4da;
      border-radius: 50%;
      background: #fff;
      color: var(--green);
      box-shadow: 0 10px 24px rgba(0,0,0,0.12);
      cursor: pointer;
      transform: translateY(-50%);
      transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease;
    }

    .services-products .service-product-carousel.is-enabled .service-product-carousel-button {
      display: inline-flex;
    }

    .services-products .service-product-carousel-button.previous {
      left: 0;
    }

    .services-products .service-product-carousel-button.next {
      right: 0;
    }

    .services-products .service-product-carousel-button:hover:not(:disabled),
    .services-products .service-product-carousel-button:focus-visible {
      background: var(--green);
      color: #fff;
    }

    .services-products .service-product-carousel-button:disabled {
      opacity: 0.4;
      cursor: default;
    }

    .services-products .service-product-carousel-button svg {
      width: 22px;
      height: 22px;
    }

    .request-panel {
      display: grid;
      grid-template-columns: 1fr 1.2fr;
      gap: 28px;
      margin-top: 28px;
      padding: 16px;
      border-radius: var(--radius);
      background: #f8faf8;
      box-shadow: 0 6px 18px rgba(0,0,0,0.06);
    }

    .request-panel img {
      width: 100%;
      height: 205px;
      object-fit: cover;
      border-radius: 6px;
    }

    .request-panel div {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
      padding: 12px 12px 12px 0;
    }

    .request-panel h2 {
      margin: 0 0 8px;
      color: var(--green);
      font-size: 22px;
    }

    .request-panel p {
      margin: 0 0 18px;
      max-width: 650px;
      font-size: 15px;
    }

    .export-services {
      padding: 0 0 34px;
    }

    .service-list {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 20px;
      margin-top: 28px;
    }

    .service-item {
      min-height: 205px;
      padding: 28px 24px;
      border: 1px solid #dfe4df;
      border-radius: var(--radius);
      background: #fff;
      box-shadow: 0 8px 24px rgba(0,0,0,0.08);
      text-align: center;
    }

    .service-item .icon {
      width: 62px;
      height: 62px;
      margin: 0 auto 18px;
      padding: 11px;
      border-radius: 50%;
      background: #eef8f0;
      box-shadow: inset 0 0 0 1px #d7eadb;
      color: var(--green);
    }

    .service-item h3 {
      margin: 0 0 12px;
      font-size: 17px;
    }

    .service-item p {
      margin: 0;
      font-size: 14px;
      line-height: 1.65;
    }

    .faq {
      padding-bottom: 28px;
    }

    .faq-list {
      overflow: hidden;
      border: 1px solid #dfe4df;
      border-radius: var(--radius);
      background: #fff;
    }

    .faq-list details {
      border-bottom: 1px solid #e7ece7;
    }

    .faq-list details:last-child {
      border-bottom: 0;
    }

    .faq-list summary {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      padding: 13px 18px;
      cursor: pointer;
      font-weight: 700;
      list-style: none;
    }

    .faq-list summary::after {
      color: var(--green);
      content: "+";
    }

    .faq-list details[open] summary::after {
      content: "-";
    }

    .faq-list p {
      margin: 0;
      padding: 0 18px 14px;
      color: var(--muted);
      font-size: 14px;
    }

    .gallery-section {
      padding: 24px 0 34px;
    }

    .gallery-filters,
    .gallery-subfilters {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 22px;
      margin-bottom: 28px;
    }

    .gallery-subfilters {
      gap: 18px;
      margin-top: -4px;
    }

    .gallery-subfilters[hidden] {
      display: none;
    }

    .filter-button {
      min-width: 86px;
      min-height: 40px;
      padding: 0 22px;
      border: 1px solid #d6ddd6;
      border-radius: 6px;
      background: #fff;
      color: #1c1c1c;
      font-weight: 600;
      cursor: pointer;
    }

    .filter-button.active {
      border-color: var(--green);
      background: var(--green);
      color: #fff;
    }

    .gallery-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
    }

    .gallery-grid img {
      width: 100%;
      aspect-ratio: 1.18 / 1;
      object-fit: cover;
      border-radius: 7px;
      box-shadow: 0 7px 18px rgba(0,0,0,0.08);
    }

    .gallery-grid img[hidden] {
      display: none !important;
    }

    body.gallery-viewer-open {
      overflow: hidden;
    }

    .gallery-viewer[hidden] {
      display: none;
    }

    .gallery-viewer {
      position: fixed;
      inset: 0;
      z-index: 1000;
      background: #fff;
    }

    .gallery-viewer-panel {
      position: relative;
      display: grid;
      grid-template-rows: 84px minmax(0, 1fr);
      grid-template-columns: 132px minmax(0, 1fr);
      height: 100dvh;
      min-height: 100dvh;
      overflow: hidden;
      background: #fff;
    }

    .gallery-viewer-header {
      grid-column: 1 / -1;
      display: flex;
      align-items: center;
      justify-content: space-between;
      min-width: 0;
      padding: 0 26px 0 34px;
      border-bottom: 1px solid #ecefec;
      background: #fff;
    }

    .gallery-viewer-header h2 {
      margin: 0;
      color: #111;
      font-size: 24px;
      font-weight: 500;
      line-height: 1.2;
    }

    .gallery-viewer-close {
      display: grid;
      place-items: center;
      flex: 0 0 auto;
      width: 44px;
      height: 44px;
      border: 0;
      border-radius: 50%;
      background: transparent;
      color: #1c1c1c;
      font-size: 30px;
      line-height: 1;
      cursor: pointer;
    }

    .gallery-viewer-close:hover,
    .gallery-viewer-close:focus-visible {
      background: #f3f6f3;
    }

    .gallery-viewer-thumbs {
      grid-row: 2;
      grid-column: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 14px;
      min-height: 0;
      overflow-y: auto;
      overscroll-behavior: contain;
      padding: 30px 20px 30px;
      scrollbar-width: none;
    }

    .gallery-viewer-thumbs::-webkit-scrollbar {
      display: none;
    }

    .gallery-viewer-thumb {
      flex: 0 0 auto;
      width: 78px;
      height: 78px;
      padding: 0;
      overflow: hidden;
      border: 1px solid #e0e5e0;
      border-radius: 8px;
      background: #fff;
      opacity: 0.34;
      cursor: pointer;
      transform: scale(0.9);
      transition: border-color 160ms ease, box-shadow 160ms ease, opacity 160ms ease, transform 160ms ease;
    }

    .gallery-viewer-thumb.active {
      border-color: #cdd6cd;
      box-shadow: 0 6px 16px rgba(0,0,0,0.14);
      opacity: 1;
      transform: scale(1);
    }

    .gallery-viewer-thumb:focus-visible {
      outline: 2px solid var(--green);
      outline-offset: 3px;
    }

    .gallery-viewer-thumb img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .gallery-viewer-main {
      grid-row: 2;
      grid-column: 2;
      display: flex;
      align-items: center;
      justify-content: center;
      min-width: 0;
      min-height: 0;
      height: calc(100dvh - 84px);
      padding: 38px 68px 56px;
    }

    .gallery-viewer-main img {
      display: block;
      max-width: min(100%, 1120px);
      max-height: calc(100dvh - 178px);
      object-fit: contain;
      border-radius: 4px;
      box-shadow: 0 14px 34px rgba(0,0,0,0.14);
    }

    @media (min-width: 768px) {
      .gallery-grid img {
        cursor: zoom-in;
      }
    }

    @media (max-width: 767px) {
      .gallery-viewer {
        display: none !important;
      }
    }

    .contact-section {
      padding: 32px 0;
    }

    .contact-grid {
      display: grid;
      grid-template-columns: 0.85fr 1.15fr;
      gap: 62px;
    }

    @media (min-width: 821px) {
      .page-hero.no-background {
        padding-bottom: 18px;
      }

      .gallery-section {
        padding-top: 10px;
      }

      .contact-section {
        padding-top: 12px;
      }
    }

    .contact-info h2,
    .contact-form h2 {
      margin: 0 0 18px;
      font-size: 22px;
    }

    .contact-info > p {
      margin: 0 0 28px;
      max-width: 390px;
      font-size: 14px;
      line-height: 1.7;
    }

    .contact-items {
      display: grid;
      gap: 25px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .contact-items li {
      display: grid;
      grid-template-columns: 28px 1fr;
      gap: 16px;
      align-items: start;
      font-size: 14px;
    }

    .contact-items .contact-whatsapp-link {
      display: contents;
      color: inherit;
      text-decoration: none;
    }

    .contact-items svg {
      width: 24px;
      height: 24px;
      color: var(--green);
      margin-top: 2px;
      flex: 0 0 auto;
    }

    .contact-items .contact-whatsapp-icon {
      width: 25px;
      height: 25px;
      margin-top: 0;
    }

    .contact-items strong {
      display: block;
      margin-bottom: 4px;
    }

    .contact-form {
      padding-left: 28px;
      border-left: 1px solid var(--line);
    }

    .contact-form form {
      display: grid;
      gap: 17px;
    }

    .contact-form .form-field {
      display: grid;
      gap: 7px;
    }

    .contact-form input,
    .contact-form textarea {
      width: 100%;
      border: 1px solid #d8ddd8;
      border-radius: 6px;
      padding: 14px 17px;
      font: inherit;
      font-size: 14px;
    }

    .contact-form input:focus,
    .contact-form textarea:focus {
      border-color: var(--green);
      outline: 0;
      box-shadow: 0 0 0 3px rgba(7, 95, 32, 0.12);
    }

    .contact-form input.is-invalid,
    .contact-form textarea.is-invalid {
      border-color: #d6445a;
      box-shadow: 0 0 0 1px rgba(214, 68, 90, 0.08);
    }

    .contact-form input.is-invalid:focus,
    .contact-form textarea.is-invalid:focus {
      border-color: #d6445a;
      box-shadow: 0 0 0 3px rgba(214, 68, 90, 0.13);
    }

    .contact-form textarea {
      min-height: 178px;
      resize: vertical;
    }

    .field-error {
      display: none;
      color: #d6445a;
      font-size: 13px;
      line-height: 1.35;
    }

    .field-error.is-visible {
      display: block;
    }

    .contact-popup {
      position: fixed;
      inset: 0;
      z-index: 1000;
      display: grid;
      place-items: center;
      padding: 26px;
      background: rgba(63, 82, 120, 0.94);
    }

    .contact-popup[hidden] {
      display: none;
    }

    body.contact-popup-open {
      overflow: hidden;
    }

    .contact-popup__dialog {
      position: relative;
      width: min(100%, 352px);
      margin-top: 38px;
      padding: 78px 28px 28px;
      border-radius: 7px;
      background: #fff;
      text-align: center;
      box-shadow: 0 18px 45px rgba(15, 24, 44, 0.22);
    }

    .contact-popup__icon {
      position: absolute;
      top: 0;
      left: 50%;
      display: grid;
      width: 80px;
      height: 80px;
      place-items: center;
      border-radius: 50%;
      color: #fff;
      transform: translate(-50%, -50%);
      box-shadow: 0 6px 14px rgba(15, 24, 44, 0.24);
    }

    .contact-popup__icon svg {
      width: 48px;
      height: 48px;
    }

    .contact-popup__icon-error {
      display: none;
    }

    .contact-popup.is-success .contact-popup__icon,
    .contact-popup.is-success .contact-popup__button {
      background: #65d64b;
    }

    .contact-popup.is-error .contact-popup__icon,
    .contact-popup.is-error .contact-popup__button {
      background: #df4c4c;
    }

    .contact-popup.is-error .contact-popup__icon-success {
      display: none;
    }

    .contact-popup.is-error .contact-popup__icon-error {
      display: block;
    }

    .contact-popup h2 {
      margin: 0 0 9px;
      color: #161616;
      font-size: 23px;
      line-height: 1.2;
      font-weight: 700;
    }

    .contact-popup p {
      max-width: 260px;
      margin: 0 auto 34px;
      color: #222;
      font-size: 13px;
      line-height: 1.45;
    }

    .contact-popup__button {
      display: inline-flex;
      width: min(100%, 260px);
      min-height: 44px;
      align-items: center;
      justify-content: center;
      border: 0;
      border-radius: 4px;
      color: #fff;
      font: inherit;
      font-size: 14px;
      font-weight: 700;
      cursor: pointer;
      box-shadow: 0 6px 12px rgba(15, 24, 44, 0.16);
      transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

    .contact-popup__button:hover {
      transform: translateY(-1px);
      box-shadow: 0 8px 16px rgba(15, 24, 44, 0.2);
    }

    .contact-popup__button:focus-visible {
      outline: 3px solid rgba(255, 255, 255, 0.95);
      outline-offset: 3px;
    }

    .map-section {
      width: min(1260px, calc(100% - 42px));
      margin: 0 auto 28px;
      min-height: 320px;
      overflow: hidden;
      border-radius: var(--radius);
      background: transparent;
    }

    .map-section iframe {
      width: 100%;
      min-height: 320px;
      border: 0;
      display: block;
      border-radius: var(--radius);
    }

    .contact-features {
      padding: 0 0 28px;
    }

    .contact-feature-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      border-radius: var(--radius);
      background: #f7faf7;
      box-shadow: 0 6px 18px rgba(0,0,0,0.06);
    }

    .contact-feature {
      min-height: 140px;
      padding: 24px;
      border-right: 1px solid var(--line);
      text-align: center;
    }

    .contact-feature:last-child {
      border-right: 0;
    }

    .contact-feature .icon {
      width: 42px;
      height: 42px;
      margin: 0 auto 10px;
    }

    .contact-feature h3 {
      margin: 0 0 8px;
      color: var(--green);
      font-size: 15px;
    }

    .contact-feature p {
      margin: 0;
      font-size: 13px;
      line-height: 1.5;
    }

    .product-detail {
      padding: 26px 0 34px;
    }

    .product-detail .breadcrumb {
      margin-bottom: 18px;
    }

    .product-detail-grid {
      display: grid;
      grid-template-columns: 0.94fr 1fr;
      gap: 58px;
      align-items: start;
    }

    .product-gallery-main {
      overflow: hidden;
      border-radius: var(--radius);
      box-shadow: 0 8px 24px rgba(0,0,0,0.1);
    }

    .product-gallery-main img {
      width: 100%;
      aspect-ratio: 1.64 / 1;
      object-fit: cover;
    }

    .product-info h1 {
      margin: 0 0 2px;
      font-size: clamp(42px, 5vw, 54px);
      line-height: 1.05;
    }

    .product-info h2 {
      margin: 0 0 20px;
      color: var(--green);
      font-size: 20px;
      line-height: 1.25;
    }

    .product-info > p {
      margin: 0 0 22px;
      max-width: 620px;
      font-size: 16px;
      line-height: 1.75;
    }

    .detail-benefits {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      margin-bottom: 28px;
      padding: 18px 12px;
      border-radius: var(--radius);
      background: #f4f7f3;
      box-shadow: 0 7px 20px rgba(0,0,0,0.06);
    }

    .detail-benefit {
      min-height: 104px;
      padding: 0 16px;
      border-right: 1px solid var(--line);
      text-align: center;
    }

    .detail-benefit:last-child {
      border-right: 0;
    }

    .detail-benefit .icon {
      width: 34px;
      height: 34px;
      margin: 0 auto 8px;
    }

    .detail-benefit h3 {
      margin: 0 0 4px;
      color: var(--green);
      font-size: 13px;
    }

    .detail-benefit p {
      margin: 0;
      font-size: 11px;
      line-height: 1.45;
    }

    .product-detail-lower {
      display: grid;
      grid-template-columns: 0.8fr 1.15fr;
      gap: 38px;
    }

    .product-detail-lower h3 {
      margin: 0 0 12px;
      color: var(--green);
      font-size: 18px;
    }

    .feature-list {
      display: grid;
      gap: 10px;
      margin: 0;
      padding: 0;
      list-style: none;
      font-size: 14px;
    }

    .feature-list li {
      display: grid;
      grid-template-columns: 18px 1fr;
      gap: 8px;
      align-items: start;
    }

    .feature-list svg {
      width: 17px;
      height: 17px;
      margin-top: 2px;
      color: var(--green);
    }

    .spec-table {
      overflow: hidden;
      border: 1px solid #d9dfd9;
      border-radius: 6px;
    }

    .spec-table table {
      width: 100%;
      border-collapse: collapse;
      font-size: 14px;
    }

    .spec-table th,
    .spec-table td {
      padding: 11px 16px;
      border-bottom: 1px solid #e3e8e3;
      text-align: left;
    }

    .spec-table tr:last-child th,
    .spec-table tr:last-child td {
      border-bottom: 0;
    }

    .spec-table th {
      width: 36%;
      background: #f7faf7;
      font-weight: 800;
    }

    @media (max-width: 1366px) {
      .container {
        width: 100%;
        padding-right: 21px;
        padding-left: 21px;
      }

      .hero,
      .about-hero,
      .relationship-cta,
      .page-hero,
      .map-section,
      .footer {
        width: 100%;
      }

      .footer {
        margin-bottom: 0;
        border-radius: 0;
      }
    }

    @media (max-width: 1120px) {
      .nav-wrap {
        padding: 14px 21px 18px;
      }

      .brand {
        min-width: auto;
      }

      .nav {
        order: 0;
        width: auto;
        justify-content: center;
        overflow-x: visible;
        padding-bottom: 0;
      }

      .stats-panel,
      .product-grid,
      .benefits,
      .strength-grid,
      .operations-grid,
      .service-list,
      .gallery-grid,
      .contact-feature-grid {
        grid-template-columns: repeat(2, 1fr);
      }


      .product-carousel {
        --product-carousel-gap: 22px;
        --product-carousel-half-gap: 11px;
        --product-carousel-card-width: calc((100vw - 42px - var(--product-carousel-gap)) / 2);
      }

      .product-carousel-track {
        width: max-content;
      }

      .product-carousel.is-ready .product-carousel-track {
        animation-name: product-carousel-loop-row;
      }

      .product-carousel-set {
        display: flex;
        flex: 0 0 auto;
        grid-template-columns: none;
        flex-wrap: nowrap;
      }

      .product-carousel .product-card {
        flex: 0 0 var(--product-carousel-card-width);
        max-width: var(--product-carousel-card-width);
      }

      .services-products .product-grid {
        grid-template-columns: 1fr;
        max-width: none;
        margin-right: auto;
        margin-left: auto;
      }

      .services-products .service-product-carousel {
        --service-product-carousel-gap: 22px;
      }

      .services-products .service-product-carousel.is-enabled {
        padding-right: 48px;
        padding-left: 48px;
      }

      .services-products .service-product-carousel.is-enabled .product-card {
        flex-basis: calc(50% - 11px);
        max-width: calc(50% - 11px);
      }

      .contact-grid,
      .product-detail-grid,
      .product-detail-lower {
        grid-template-columns: 1fr;
        gap: 34px;
      }

      .detail-benefits {
        grid-template-columns: repeat(2, 1fr);
      }

      .detail-benefit:nth-child(2n) {
        border-right: 0;
      }

      .detail-benefit:nth-child(-n + 2) {
        border-bottom: 1px solid var(--line);
        padding-bottom: 16px;
        margin-bottom: 16px;
      }

      .contact-form {
        padding-left: 0;
        border-left: 0;
      }

      .stats {
        margin-top: -70px;
      }

      .benefit {
        min-height: 72px;
        padding: 18px 22px;
        border-bottom: 1px solid var(--line);
      }

      .stat:nth-child(2n),
      .benefit:nth-child(2n) {
        border-right: 0;
      }

      .benefit:nth-child(n + 5) {
        border-bottom: 0;
      }

      .benefit:last-child {
        grid-column: auto;
        border-top: 0;
      }

      .footer-main {
        grid-template-columns: repeat(2, 1fr);
        padding: 34px 30px 10px;
      }

      .footer-col {
        min-height: 0;
        border-right: 0;
        border-bottom: 1px solid rgba(255,255,255,0.2);
        padding: 0 18px 20px;
        margin-bottom: 20px;
      }

      .footer .brand {
        margin-bottom: 20px;
      }

      .footer ul {
        gap: 3px;
      }

      .contact-list {
        gap: 12px !important;
      }

      .footer-col:last-child {
        border-bottom: 0;
      }

      .copyright {
        padding-bottom: 18px;
      }
    }

    @media (max-width: 740px) {
      .nav-wrap {
        flex-wrap: wrap;
      }

      .nav {
        order: 3;
        width: 100%;
        justify-content: safe center;
        overflow-x: auto;
        padding-bottom: 2px;
      }
    }

    @media (max-width: 820px) {
      .container {
        width: 100%;
        padding-right: 14px;
        padding-left: 14px;
      }

      .hero,
      .about-hero,
      .relationship-cta,
      .page-hero,
      .map-section {
        width: 100%;
      }

      .page-hero {
        padding: 42px 0;
        background: linear-gradient(110deg, #fff 0%, #fff 45%, #f4f8f4 100%);
      }

      .page-hero.with-image {
        padding: 42px 0;
        background:
          linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(255,255,255,0.9) 60%, rgba(255,255,255,0.58) 100%),
          url("assets/service/services-banner.png") center right / cover;
      }

      .page-hero.with-image .container {
        min-height: 476px;
        align-items: flex-start;
      }

      .about-hero {
        min-height: auto;
        background:
          linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0.58) 100%),
          url("assets/about/about-banner.png") center right / cover;
      }

      .about-hero .container {
        width: 100%;
        min-height: 600px;
        align-items: flex-start;
      }

      .about-copy {
        padding: 48px 0 220px;
      }

      .about-facts {
        grid-template-columns: 1fr;
        gap: 16px;
      }

      .about-fact + .about-fact {
        padding-left: 0;
        border-left: 0;
      }

      .mission-grid,
      .about-story-grid,
      .relationship-inner {
        grid-template-columns: 1fr;
      }

      .about-story {
        padding-top: 28px;
      }

      .about-story-grid {
        gap: 34px;
      }

      .about-story-visual {
        width: min(100%, 470px);
        margin-right: auto;
        margin-left: auto;
      }

      .about-story-badge {
        top: 18px;
        right: 18px;
        min-width: 112px;
        padding: 20px 18px;
      }

      .mission-grid {
        gap: 28px;
      }

      .relationship-inner {
        align-items: flex-start;
        flex-direction: column;
        padding: 28px 24px;
      }

      .relationship-actions {
        gap: 28px;
      }

      .hero {
        min-height: auto;
        background:
          linear-gradient(180deg, rgba(255,255,255,0.96) 0%, rgba(255,255,255,0.9) 44%, rgba(255,255,255,0.42) 100%),
          url("assets/home/banner.png") 58% center / auto 100%;
      }

      .hero .container {
        min-height: 560px;
        align-items: flex-start;
      }

      .hero-copy {
        padding: 54px 0 220px;
      }

      .hero p {
        font-size: 16px;
      }

      .stats {
        margin-top: 18px;
      }

      .product-carousel {
        --product-carousel-gap: 18px;
        --product-carousel-half-gap: 9px;
        --product-carousel-card-width: calc((100vw - 28px - var(--product-carousel-gap)) / 2);
        margin-top: 24px;
      }

      .product-carousel .product-card {
        flex-basis: var(--product-carousel-card-width);
        max-width: var(--product-carousel-card-width);
      }

      .services-products .service-product-carousel {
        --service-product-carousel-gap: 18px;
        margin-top: 24px;
      }

      .services-products .service-product-carousel.is-enabled {
        padding-right: 44px;
        padding-left: 44px;
      }

      .services-products .service-product-carousel.is-enabled .product-card {
        flex-basis: 100%;
        max-width: 100%;
      }

      .services-products .service-product-carousel-button {
        width: 38px;
        height: 38px;
      }

      .stats-panel,
      .product-grid,
      .benefits,
      .strength-grid,
      .operations-grid,
      .service-list,
      .gallery-grid,
      .contact-feature-grid,
      .detail-benefits,
      .sourcing-panel {
        grid-template-columns: 1fr;
      }

      .detail-benefit,
      .detail-benefit:nth-child(2n),
      .detail-benefit:nth-child(-n + 2) {
        border-right: 0;
        border-bottom: 1px solid var(--line);
        margin-bottom: 0;
        padding: 16px;
      }

      .detail-benefit:last-child {
        border-bottom: 0;
      }

      .request-panel,
      .contact-grid {
        grid-template-columns: 1fr;
      }

      .request-panel div {
        padding: 0 6px 8px;
      }

      .contact-feature {
        border-right: 0;
        border-bottom: 1px solid var(--line);
      }

      .contact-feature:last-child {
        border-bottom: 0;
      }

      .stats-panel {
        padding: 0;
      }

      .stat,
      .benefit {
        border-right: 0;
        border-bottom: 1px solid var(--line);
      }

      .benefit:nth-child(n + 5) {
        border-bottom: 1px solid var(--line);
      }

      .stat:last-child,
      .benefit:last-child {
        grid-column: auto;
        border-top: 0;
        border-bottom: 0;
        justify-content: flex-start;
      }

      .process-grid {
        grid-template-columns: 1fr;
        gap: 0;
      }

      .about-story-title {
        font-size: 32px;
      }

      .about-story-copy p {
        font-size: 16px;
      }

      .arrow {
        width: 60px;
        height: 22px;
        margin: 34px auto 34px;
        transform: rotate(90deg);
      }

      .sourcing-heading {
        margin-bottom: 16px;
      }

      .sourcing-panel {
        min-height: auto;
      }

      .sourcing-copy {
        max-width: none;
        padding: 36px 28px 22px;
      }

      .sourcing-copy h3 {
        font-size: 31px;
      }

      .sourcing-map {
        min-height: 340px;
        padding: 0 26px 38px;
      }

      .footer-cta,
      .footer-main {
        padding-right: 24px;
        padding-left: 24px;
      }

      .footer-main {
        padding-top: 26px;
        padding-bottom: 6px;
      }

      .footer-col {
        padding: 0 0 16px;
        margin-bottom: 16px;
      }

      .footer .brand {
        margin-bottom: 14px;
      }

      .footer h3 {
        margin-bottom: 10px;
      }

      .socials {
        margin-top: 12px;
      }

      .copyright {
        padding-bottom: 14px;
      }

      .footer-cta {
        align-items: flex-start;
        flex-direction: column;
      }

    }

    @media (max-width: 640px) {
      .products {
        padding: 28px 0 20px;
      }

      .product-carousel {
        overflow: visible;
        margin-top: 22px;
        padding: 0;
      }

      .product-carousel-track {
        display: block;
        width: 100%;
        transform: none !important;
        will-change: auto;
      }

      .product-carousel.is-ready .product-carousel-track {
        animation: none;
      }

      .product-carousel-set {
        display: grid;
        width: 100%;
        grid-template-columns: 1fr;
        gap: 18px;
      }

      .product-carousel [data-product-carousel-clone] {
        display: none;
      }

      .product-carousel .product-card {
        max-width: none;
        flex-basis: auto;
      }

      .product-carousel .product-card,
      .services-products .product-card {
        min-height: 0;
      }

      .product-carousel .product-card img,
      .services-products .product-card img {
        height: 190px;
      }

      .product-carousel .product-card h3,
      .services-products .product-card h3 {
        margin: 20px 16px 10px;
      }

      .product-carousel .product-card p,
      .services-products .product-card p {
        min-height: 0;
        margin: 0 18px 18px;
      }

      .footer-main {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 18px;
      }

      .footer-col:first-child,
      .footer-col:nth-child(4),
      .footer-col:nth-child(5) {
        grid-column: 1 / -1;
      }

      .footer-col {
        padding-bottom: 12px;
        margin-bottom: 12px;
      }

      .footer .brand {
        margin-bottom: 10px;
      }

      .footer h3 {
        margin-bottom: 8px;
        font-size: 16px;
      }

      .contact-list {
        gap: 8px !important;
      }

      .socials {
        margin-top: 8px;
      }
    }

    @media (max-width: 520px) {
      .brand-name {
        font-size: 21px;
      }

      .brand-mark {
        width: 46px;
        height: 46px;
      }

      .hero .container {
        min-height: 650px;
      }

      .hero-copy {
        max-width: 100%;
        padding: 48px 0 128px;
      }

      .hero h1 {
        font-size: 30px;
        line-height: 1.12;
      }

      .hero h1 span {
        max-width: 340px;
        font-size: 36px;
        line-height: 1.08;
      }

      .hero p {
        max-width: 340px;
        font-size: 15px;
      }

      .hero-actions,
      .footer-actions,
      .sourcing-actions {
        width: 100%;
      }

      .button {
        width: 100%;
      }

      .sourcing {
        padding-bottom: 24px;
      }

      .sourcing-heading {
        gap: 12px;
      }

      .sourcing-badge {
        width: 38px;
        height: 38px;
        font-size: 20px;
      }

      .sourcing-heading h2 {
        font-size: 25px;
      }

      .sourcing-copy {
        padding: 30px 20px 18px;
      }

      .sourcing-eyebrow {
        margin-bottom: 14px;
        font-size: 15px;
      }

      .sourcing-copy h3 {
        font-size: 26px;
      }

      .sourcing-copy h3 .sourcing-title-main {
        white-space: normal;
      }

      .check-list {
        font-size: 15px;
      }

      .sourcing-map {
        min-height: 260px;
        padding: 0 16px 30px;
      }

      .footer {
        width: 100%;
      }

      .footer-main {
        padding: 24px 18px 4px;
      }

      .footer-col {
        padding-bottom: 14px;
        margin-bottom: 14px;
      }

      .footer p,
      .footer li,
      .footer a {
        font-size: 14px;
      }

      .footer .socials a {
        width: 40px;
        height: 40px;
        font-size: 0;
        background-position: center;
        background-repeat: no-repeat;
        background-size: 21px 21px;
      }

      .footer .socials .ig {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M17.5 6.5h.01'/%3E%3C/svg%3E");
      }

      .footer .socials .wa {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23fff' d='M16.04 3C8.86 3 3 8.78 3 15.88c0 2.28.61 4.5 1.78 6.45L3.6 29l6.9-1.8a13.13 13.13 0 0 0 5.54 1.23h.01C23.24 28.43 29 22.66 29 15.56 29 8.48 23.22 3 16.04 3Zm0 23.18c-1.86 0-3.68-.5-5.27-1.44l-.38-.22-4.1 1.07 1.09-3.98-.25-.41a10.58 10.58 0 0 1-1.63-5.62c0-5.71 4.73-10.36 10.55-10.36 2.82 0 5.47 1.08 7.46 3.04a10.21 10.21 0 0 1 3.09 7.3c0 5.86-4.74 10.62-10.56 10.62Z'/%3E%3Cpath fill='%23fff' d='M21.83 18.45c-.32-.16-1.87-.92-2.16-1.03-.29-.11-.5-.16-.71.16-.21.32-.82 1.03-1 1.24-.18.21-.37.24-.69.08-.32-.16-1.35-.5-2.57-1.59-.95-.85-1.59-1.9-1.78-2.22-.18-.32-.02-.49.14-.65.14-.14.32-.37.48-.55.16-.18.21-.32.32-.53.11-.21.05-.4-.03-.55-.08-.16-.71-1.72-.98-2.35-.26-.62-.52-.53-.71-.54h-.61c-.21 0-.55.08-.84.4-.29.32-1.11 1.08-1.11 2.64s1.14 3.07 1.3 3.28c.16.21 2.24 3.42 5.43 4.79.76.33 1.35.52 1.81.67.76.24 1.45.21 2 .13.61-.09 1.87-.77 2.14-1.51.26-.74.26-1.37.18-1.51-.08-.13-.29-.21-.61-.37Z'/%3E%3C/svg%3E");
      }

      .about-copy h1 {
        font-size: 38px;
      }

      .about-copy h2 {
        font-size: 25px;
      }
    }

    @media (max-width: 389px) {
      .site-header .nav a[href="/about"],
      .site-header .nav a[href="/contact"] {
        font-size: 0;
      }

      .site-header .nav a[href="/about"]::before,
      .site-header .nav a[href="/contact"]::before {
        font-size: 14px;
      }

      .site-header .nav a[href="/about"]::before {
        content: "About";
      }

      .site-header .nav a[href="/contact"]::before {
        content: "Contact";
      }
    }