/* ── Base Reset ── */
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }
    body {
      font-family: 'Inter', sans-serif;
      background: #fff;
      color: #1c1917;
      min-width: 320px;
    }
    * { word-break: break-word; overflow-wrap: break-word; }
    img { max-width: 100%; height: auto; display: block; }

    .site-wrapper {
      width: 100%;
      max-width: 1440px;
      margin: 0 auto;
    }

    /* ── Navbar ── */
    #navbar {
      position: fixed;
      top: 0; left: 0; right: 0;
      z-index: 100;
      transition: background 0.4s ease, box-shadow 0.4s ease;
    }
    .nav-inner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 20px 120px;
    }
    .nav-links-desktop {
      display: flex;
      align-items: center;
      gap: 40px;
    }
    #navbar.scrolled {
      background: rgba(255,255,255,0.97);
      box-shadow: 0 2px 24px rgba(0,0,0,0.08);
    }
    .nav-logo-text { color: #fff; }
    #navbar.scrolled .nav-logo-text { color: #1e4d17; }
    #navbar.scrolled .nav-link { color: #292524; }
    #navbar.scrolled .nav-link:hover { color: #2d7a23; }
    #navbar.scrolled .nav-cta { background: #2d7a23; color: #fff; }

    .nav-link {
      color: rgba(255,255,255,0.92);
      font-size: 16px;
      font-weight: 600;
      letter-spacing: 0.02em;
      text-decoration: none;
      padding: 6px 2px;
      position: relative;
      transition: color 0.25s;
    }
    .nav-link::after {
      content: '';
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 2px;
      background: #5fb550;
      transform: scaleX(0);
      transition: transform 0.25s ease;
    }
    .nav-link:hover::after { transform: scaleX(1); }
    .nav-link.active { color: #8fd07f; }
    #navbar.scrolled .nav-link.active { color: #2d7a23; }

    .nav-cta {
      background: rgba(255,255,255,0.18);
      border: 1.5px solid rgba(255,255,255,0.5);
      color: #fff;
      padding: 10px 28px;
      border-radius: 6px;
      font-size: 16px;
      font-weight: 600;
      letter-spacing: 0.02em;
      cursor: pointer;
      transition: all 0.25s;
      backdrop-filter: blur(6px);
      text-decoration: none;
    }
    .nav-cta:hover { background: rgba(255,255,255,0.30); border-color: rgba(255,255,255,0.8); }

    /* ── Mobile Menu Button ── */
    #mobile-menu-btn {
      display: none;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 5px;
      width: 40px; height: 40px;
      cursor: pointer;
      z-index: 200;
      background: transparent;
      border: none;
      padding: 4px;
    }
    #mobile-menu-btn .bar {
      display: block;
      width: 24px; height: 2px;
      background: #fff;
      border-radius: 2px;
      transition: all 0.3s ease;
      transform-origin: center;
    }
    #navbar.scrolled #mobile-menu-btn .bar { background: #292524; }
    #mobile-menu-btn.open .bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
    #mobile-menu-btn.open .bar:nth-child(2) { opacity: 0; transform: scaleX(0); }
    #mobile-menu-btn.open .bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

    #mobile-nav {
      display: none;
      position: fixed;
      top: 0; left: 0; right: 0; bottom: 0;
      z-index: 150;
      background: rgba(15, 42, 11, 0.97);
      backdrop-filter: blur(16px);
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 8px;
      opacity: 0;
      transition: opacity 0.3s ease;
      padding: 40px 32px;
    }
    #mobile-nav.open { display: flex; opacity: 1; }
    .mobile-nav-link {
      font-family: 'Outfit', sans-serif;
      font-size: 28px;
      font-weight: 700;
      color: rgba(255,255,255,0.85);
      text-decoration: none;
      padding: 12px 0;
      letter-spacing: -0.01em;
      transition: color 0.2s;
      text-align: center;
    }
    .mobile-nav-link:hover { color: #8fd07f; }
    .mobile-nav-cta {
      margin-top: 20px;
      background: #3d9930;
      color: #fff;
      padding: 14px 40px;
      border-radius: 8px;
      font-size: 16px;
      font-weight: 700;
      text-decoration: none;
      transition: background 0.25s;
    }
    .mobile-nav-cta:hover { background: #2d7a23; }

    /* ── Shared Typography ── */
    .section-label {
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: #3d9930;
      margin-bottom: 16px;
    }
    .section-label-light { color: #8fd07f; }
    .section-title {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(26px, 3.5vw, 44px);
      font-weight: 800;
      line-height: 1.2;
      color: #183f12;
      letter-spacing: -0.02em;
    }
    .section-title-light { color: #fff; }
    .section-body {
      font-size: 16px;
      line-height: 1.8;
      color: #57534e;
    }
    .divider-accent {
      width: 56px;
      height: 4px;
      background: linear-gradient(90deg, #3d9930, #8fd07f);
      border-radius: 2px;
      margin: 0 auto 24px;
    }
    .btn-green {
      background: linear-gradient(135deg, #3d9930, #24611c);
      color: #fff;
      padding: 14px 36px;
      border-radius: 8px;
      font-weight: 600;
      font-size: 15px;
      cursor: pointer;
      border: none;
      transition: all 0.25s;
      box-shadow: 0 4px 20px rgba(61,153,48,0.35);
      text-decoration: none;
      display: inline-block;
      letter-spacing: 0.01em;
    }
    .btn-green:hover {
      transform: translateY(-2px);
      box-shadow: 0 8px 32px rgba(61,153,48,0.45);
    }

    /* ── Fade-up Animations ── */
    .fade-up {
      opacity: 0;
      transform: translateY(30px);
      transition: opacity 0.7s ease, transform 0.7s ease;
    }
    .fade-up.visible { opacity: 1; transform: translateY(0); }
    .fade-up-delay-1 { transition-delay: 0.1s; }
    .fade-up-delay-2 { transition-delay: 0.2s; }
    .fade-up-delay-3 { transition-delay: 0.3s; }
    .fade-up-delay-4 { transition-delay: 0.4s; }
    .fade-up-delay-5 { transition-delay: 0.5s; }

    /* ══════════════════════════════════════
       HERO — PAGE BANNER
    ══════════════════════════════════════ */
    #page-hero {
      position: relative;
      width: 100%;
      height: 580px;
      min-height: 460px;
      overflow: hidden;
    }
    .page-hero-bg {
      position: absolute;
      inset: 0;
      background-image: url('../images/integrated-hero.webp');
      background-size: cover;
      background-position: center 50%;
      transform: scale(1.04);
      transition: transform 8s ease;
    }
    #page-hero.loaded .page-hero-bg { transform: scale(1); }
    .page-hero-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(
        135deg,
        rgba(15,42,11,0.82) 0%,
        rgba(24,63,18,0.60) 50%,
        rgba(0,0,0,0.25) 100%
      );
    }
    .page-hero-content {
      position: relative;
      z-index: 2;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      height: 100%;
      padding: 0 120px 96px;
    }
    .breadcrumb {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 20px;
      font-size: 13px;
      font-weight: 600;
      color: rgba(255,255,255,0.6);
      letter-spacing: 0.05em;
      text-transform: uppercase;
    }
    .breadcrumb a { color: rgba(255,255,255,0.6); text-decoration: none; transition: color 0.2s; }
    .breadcrumb a:hover { color: #8fd07f; }
    .breadcrumb span { color: #8fd07f; }
    .page-hero-title {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(36px, 5vw, 76px);
      font-weight: 900;
      color: #fff;
      letter-spacing: -0.03em;
      line-height: 1.08;
      text-shadow: 0 4px 32px rgba(0,0,0,0.25);
    }
    .page-hero-title span { color: #8fd07f; }
    .page-hero-sub-wrap {
      margin-top: 32px;
      max-width: min(680px, 100%);
      position: relative;
    }
    .page-hero-sub-wrap::before {
      content: '';
      position: absolute;
      left: 0; top: 0; bottom: 0;
      width: 3px;
      background: linear-gradient(180deg, #8fd07f 0%, rgba(143,208,127,0) 100%);
      border-radius: 2px;
    }
    .page-hero-sub {
      padding-left: 22px;
      font-size: clamp(14px, 1.35vw, 17px);
      color: rgba(255,255,255,0.82);
      line-height: 1.85;
      font-weight: 700;
      letter-spacing: 0.01em;
    }
    .page-hero-sub strong {
      color: #fff;
      font-weight: 700;
    }
    .page-hero-sub-divider {
      padding-left: 22px;
      display: flex;
      align-items: center;
      gap: 10px;
      margin: 14px 0 12px;
    }
    .page-hero-sub-divider span {
      display: block;
      height: 1px;
      width: 32px;
      background: rgba(143,208,127,0.45);
      border-radius: 1px;
    }
    .page-hero-sub-cta {
      padding-left: 22px;
      font-size: clamp(13px, 1.1vw, 15px);
      color: #8fd07f;
      font-weight: 600;
      letter-spacing: 0.03em;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .page-hero-sub-cta::after {
      content: '→';
      font-size: 16px;
      transition: transform 0.25s ease;
    }
    /* Hero stat badges */
    .hero-badges {
      display: flex;
      gap: 16px;
      margin-top: 40px;
      flex-wrap: wrap;
    }
    .hero-badge {
      display: flex;
      align-items: center;
      gap: 10px;
      background: rgba(255,255,255,0.12);
      border: 1px solid rgba(255,255,255,0.22);
      backdrop-filter: blur(10px);
      border-radius: 100px;
      padding: 10px 20px;
      color: #fff;
      font-size: 14px;
      font-weight: 600;
    }
    .hero-badge-dot {
      width: 8px; height: 8px;
      border-radius: 50%;
      background: #5fb550;
      flex-shrink: 0;
    }

    /* ══════════════════════════════════════
       SECTION A — COMMITMENT INTRO
    ══════════════════════════════════════ */
    #commitment {
      padding: 100px 120px;
      background: #fff;
    }
    .commitment-layout {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 80px;
      align-items: center;
    }
    .commitment-text h2 {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(24px, 2.8vw, 40px);
      font-weight: 800;
      color: #183f12;
      letter-spacing: -0.02em;
      line-height: 1.2;
      margin-bottom: 28px;
    }
    .commitment-text h2 span { color: #3d9930; }
    .commitment-text p {
      font-size: 15.5px;
      line-height: 1.85;
      color: #57534e;
      margin-bottom: 20px;
    }
    .commitment-quote {
      margin-top: 32px;
      padding: 28px 36px;
      background: linear-gradient(135deg, #f2f9f0, #e0f2d8);
      border-left: 4px solid #3d9930;
      border-radius: 0 16px 16px 0;
    }
    .commitment-quote p {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(15px, 1.4vw, 18px);
      font-weight: 600;
      color: #1e4d17;
      line-height: 1.7;
      font-style: italic;
      margin-bottom: 0;
    }
    /* Right: visual block */
    .commitment-visual {
      position: relative;
    }
    .commitment-img-main {
      width: 100%;
      border-radius: 24px;
      overflow: hidden;
      aspect-ratio: 4/3;
      box-shadow: 0 32px 80px rgba(24,63,18,0.18);
      position: relative;
    }
    .commitment-img-main img {
      width: 100%; height: 100%;
      object-fit: cover;
      transition: transform 0.6s ease;
    }
    .commitment-img-main:hover img { transform: scale(1.05); }
    .commitment-img-main::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(24,63,18,0.30) 0%, transparent 55%);
      border-radius: inherit;
      pointer-events: none;
    }
    /* Floating card on image */
    .commitment-float-card {
      position: absolute;
      bottom: -28px;
      left: -28px;
      background: #fff;
      border-radius: 20px;
      padding: 24px 28px;
      box-shadow: 0 24px 64px rgba(24,63,18,0.16);
      border: 1.5px solid #e0f2d8;
      min-width: 200px;
    }
    .commitment-float-card .cf-num {
      font-family: 'Outfit', sans-serif;
      font-size: 40px;
      font-weight: 900;
      background: linear-gradient(135deg, #3d9930, #24611c);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      line-height: 1;
    }
    .commitment-float-card .cf-label {
      font-size: 13px;
      font-weight: 600;
      color: #57534e;
      margin-top: 6px;
      line-height: 1.4;
    }
    /* Stats row */
    .commitment-stats {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
      margin-top: 80px;
      padding-top: 64px;
      border-top: 1px solid #e0f2d8;
    }
    .c-stat {
      text-align: center;
      padding: 32px 20px;
      background: #f2f9f0;
      border-radius: 20px;
      border: 1.5px solid #e0f2d8;
      transition: all 0.3s;
    }
    .c-stat:hover {
      border-color: #8fd07f;
      box-shadow: 0 16px 48px rgba(30,77,23,0.10);
      transform: translateY(-4px);
    }
    .c-stat-num {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(32px, 3.5vw, 52px);
      font-weight: 900;
      background: linear-gradient(135deg, #3d9930, #24611c);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      line-height: 1;
    }
    .c-stat-label {
      margin-top: 10px;
      font-size: 14px;
      color: #57534e;
      font-weight: 500;
      line-height: 1.5;
    }

    /* ══════════════════════════════════════
       SECTION C — INITIATIVES (alternating) — kept for fallback ref
    ══════════════════════════════════════ */
    #initiatives {
      padding: 100px 120px;
      background: #fff;
    }
    .initiatives-header {
      text-align: center;
      margin-bottom: 80px;
    }
    .initiative-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 72px;
      align-items: center;
      margin-bottom: 100px;
    }
    .initiative-row:last-child { margin-bottom: 0; }
    .initiative-row.reverse .init-text { order: 2; }
    .initiative-row.reverse .init-visual { order: 1; }
    .init-text .init-label {
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: #3d9930;
      margin-bottom: 12px;
    }
    .init-text h3 {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(22px, 2.4vw, 34px);
      font-weight: 800;
      color: #183f12;
      letter-spacing: -0.02em;
      line-height: 1.22;
      margin-bottom: 20px;
    }
    .init-text p {
      font-size: 15px;
      line-height: 1.85;
      color: #57534e;
      margin-bottom: 16px;
    }
    .init-bullets {
      margin-top: 20px;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .init-bullet {
      display: flex;
      align-items: flex-start;
      gap: 12px;
    }
    .init-bullet-dot {
      width: 20px; height: 20px;
      background: linear-gradient(135deg, #3d9930, #24611c);
      border-radius: 50%;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-top: 2px;
    }
    .init-bullet-dot svg { color: #fff; }
    .init-bullet span {
      font-size: 14.5px;
      color: #44403c;
      line-height: 1.65;
    }
    .init-visual {
      position: relative;
    }
    .init-img {
      width: 100%;
      border-radius: 24px;
      overflow: hidden;
      aspect-ratio: 5/4;
      box-shadow: 0 28px 72px rgba(24,63,18,0.15);
      position: relative;
    }
    .init-img img {
      width: 100%; height: 100%;
      object-fit: cover;
      transition: transform 0.6s ease;
    }
    .init-img:hover img { transform: scale(1.05); }
    .init-img::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(24,63,18,0.28) 0%, transparent 55%);
      border-radius: inherit;
      pointer-events: none;
    }
    /* Badge overlay on image */
    .init-img-badge {
      position: absolute;
      top: 20px; right: 20px;
      background: rgba(255,255,255,0.95);
      border-radius: 14px;
      padding: 14px 18px;
      box-shadow: 0 8px 32px rgba(24,63,18,0.15);
      z-index: 2;
      text-align: center;
    }
    .init-img-badge .ib-num {
      font-family: 'Outfit', sans-serif;
      font-size: 26px;
      font-weight: 900;
      color: #2d7a23;
      line-height: 1;
    }
    .init-img-badge .ib-label {
      font-size: 11px;
      font-weight: 600;
      color: #78716c;
      margin-top: 4px;
    }

    /* ══════════════════════════════════════
       SECTION — PILLARS 01–06 (Full-width alternating)
    ══════════════════════════════════════ */
    #masonry-section {
      background: #fff;
      position: relative;
    }
    #masonry-section::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 1px;
      background: linear-gradient(90deg, transparent, #bde5b0 30%, #bde5b0 70%, transparent);
    }

    /* Section header */
    .masonry-section-header {
      text-align: center;
      padding: 100px 120px 72px;
    }
    .masonry-section-header .section-label { margin-bottom: 14px; }
    .masonry-section-header h2 {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(28px, 3.5vw, 48px);
      font-weight: 900;
      color: #183f12;
      letter-spacing: -0.03em;
      line-height: 1.15;
      margin-bottom: 18px;
    }
    .masonry-section-header p {
      font-size: 16px;
      color: #78716c;
      line-height: 1.75;
      max-width: 480px;
      margin: 0 auto;
    }

    /* ── Pillar row: full-width image background, text on 30% side ── */
    .pillar-row {
      position: relative;
      width: 100%;
      min-height: 620px;
      overflow: hidden;
      display: flex;
      align-items: stretch;
    }
    /* Background image fills entire row */
    .pillar-bg {
      position: absolute;
      inset: 0;
      background-size: cover;
      background-repeat: no-repeat;
      transition: transform 0.7s ease;
    }
    .pillar-row:hover .pillar-bg { transform: scale(1.04); }

    /* Text panel — 30% wide, positioned left or right */
    .pillar-text-panel {
      position: relative;
      z-index: 3;
      width: 32%;
      min-width: 320px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 72px 56px;
    }
    /* When text is on the RIGHT (odd: 01,03,05) */
    .pillar-row.text-right .pillar-text-panel {
      margin-left: auto;
    }
    /* When text is on the LEFT (even: 02,04,06) */
    .pillar-row.text-left .pillar-text-panel {
      margin-right: auto;
    }

    /* Frosted glass mask behind text */
    .pillar-text-panel::before {
      content: '';
      position: absolute;
      inset: 0;
      background: rgba(10, 30, 8, 0.42);
      backdrop-filter: blur(18px) saturate(1.4);
      -webkit-backdrop-filter: blur(18px) saturate(1.4);
    }
    /* Green edge accent removed for seamless blend */
    .pillar-row.text-right .pillar-text-panel::after,
    .pillar-row.text-left .pillar-text-panel::after {
      content: none;
    }

    /* All children of text panel appear above the ::before overlay */
    .pillar-text-panel > * { position: relative; z-index: 1; }

    /* Number badge */
    .pillar-num {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      font-family: 'Outfit', sans-serif;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: #8fd07f;
      background: rgba(143, 208, 127, 0.12);
      border: 1px solid rgba(143, 208, 127, 0.30);
      padding: 6px 18px 6px 14px;
      border-radius: 100px;
      margin-bottom: 28px;
      width: fit-content;
    }
    .pillar-num-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: #8fd07f;
      flex-shrink: 0;
    }
    /* Title */
    .pillar-title {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(22px, 2.2vw, 32px);
      font-weight: 900;
      color: #fff;
      letter-spacing: -0.025em;
      line-height: 1.2;
      margin-bottom: 20px;
    }
    /* Body text */
    .pillar-body {
      font-size: 14.5px;
      color: rgba(255,255,255,0.72);
      line-height: 1.85;
      margin-bottom: 28px;
    }
    /* Stat row inside panel */
    .pillar-stats {
      display: flex;
      gap: 28px;
      padding-top: 24px;
      border-top: 1px solid rgba(255,255,255,0.10);
      flex-wrap: wrap;
    }
    .pillar-stat-item {}
    .pillar-stat-val {
      font-family: 'Outfit', sans-serif;
      font-size: 28px;
      font-weight: 900;
      background: linear-gradient(135deg, #8fd07f, #5fb550);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      line-height: 1;
    }
    .pillar-stat-lbl {
      font-size: 12px;
      color: rgba(255,255,255,0.45);
      font-weight: 500;
      margin-top: 5px;
      line-height: 1.4;
    }
    /* Tag pill */
    .pillar-pill {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: #8fd07f;
      background: rgba(143,208,127,0.10);
      border: 1px solid rgba(143,208,127,0.25);
      padding: 5px 13px;
      border-radius: 100px;
      margin-top: 0;
    }

    /* ── CTA strip at bottom ── */
    .mc-cta-card {
      padding: 72px 120px;
      background: linear-gradient(135deg, #3d9930 0%, #1e4d17 100%);
      position: relative;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 48px;
    }
    .mc-cta-card::before {
      content: '';
      position: absolute;
      bottom: -120px; right: -120px;
      width: 400px; height: 400px;
      background: radial-gradient(circle, rgba(255,255,255,0.08) 0%, transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
    .mc-cta-card::after {
      content: '';
      position: absolute;
      top: -80px; left: 30%;
      width: 260px; height: 260px;
      background: radial-gradient(circle, rgba(143,208,127,0.10) 0%, transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
    .mc-cta-text { position: relative; z-index: 1; }
    .mc-cta-text h3 {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(22px, 2.2vw, 32px);
      font-weight: 800;
      color: #fff;
      letter-spacing: -0.02em;
      line-height: 1.2;
      margin-bottom: 12px;
    }
    .mc-cta-text p {
      font-size: 15px;
      color: rgba(255,255,255,0.68);
      line-height: 1.75;
      max-width: 520px;
    }
    .mc-cta-action { position: relative; z-index: 1; flex-shrink: 0; }
    .mc-cta-btn {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      background: #fff;
      color: #1e4d17;
      padding: 16px 36px;
      border-radius: 10px;
      font-size: 15px;
      font-weight: 700;
      text-decoration: none;
      transition: all 0.25s;
      letter-spacing: 0.01em;
      white-space: nowrap;
    }
    .mc-cta-btn:hover {
      background: #f2f9f0;
      transform: translateY(-3px);
      box-shadow: 0 12px 40px rgba(0,0,0,0.22);
    }

    /* ══════════════════════════════════════
       SECTION D/E — kept selectors (unused body)
    ══════════════════════════════════════ */
    #certifications { display: none; }
    #progress {
      padding: 100px 120px;
      background: #fff;
    }
    .progress-header {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 80px;
      align-items: start;
      margin-bottom: 72px;
    }
    .progress-header-right p {
      font-size: 16px;
      line-height: 1.85;
      color: #57534e;
    }
    .goals-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 28px;
    }
    .goal-card {
      background: #fff;
      border: 1.5px solid #e0f2d8;
      border-radius: 24px;
      padding: 40px 36px;
      position: relative;
      overflow: hidden;
      transition: all 0.35s;
    }
    .goal-card::after {
      content: '';
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 4px;
      background: linear-gradient(90deg, #3d9930, #8fd07f);
      border-radius: 0 0 24px 24px;
    }
    .goal-card:hover {
      border-color: #bde5b0;
      box-shadow: 0 28px 72px rgba(30,77,23,0.10);
      transform: translateY(-5px);
    }
    .goal-year {
      font-family: 'Outfit', sans-serif;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: #3d9930;
      margin-bottom: 12px;
    }
    .goal-card h3 {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(17px, 1.7vw, 22px);
      font-weight: 800;
      color: #183f12;
      margin-bottom: 14px;
      letter-spacing: -0.01em;
      line-height: 1.25;
    }
    .goal-card p {
      font-size: 14.5px;
      color: #57534e;
      line-height: 1.8;
    }
    /* Progress bar */
    .goal-progress {
      margin-top: 24px;
    }
    .goal-progress-top {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 8px;
    }
    .goal-progress-label {
      font-size: 12px;
      font-weight: 600;
      color: #78716c;
    }
    .goal-progress-pct {
      font-size: 13px;
      font-weight: 700;
      color: #2d7a23;
    }
    .goal-bar-track {
      height: 6px;
      background: #e0f2d8;
      border-radius: 3px;
      overflow: hidden;
    }
    .goal-bar-fill {
      height: 100%;
      background: linear-gradient(90deg, #3d9930, #8fd07f);
      border-radius: 3px;
      width: 0;
      transition: width 1.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }
    .goal-bar-fill.animate { width: var(--pct); }

    /* ══════════════════════════════════════
       SDG layout kept for reference (unused)
    ══════════════════════════════════════ */
    .sdg-layout { display: none; }

    /* ══════════════════════════════════════
       SECTION 01 — MISSION INTRO
    ══════════════════════════════════════ */
    #mission-intro {
      background: #fff;
      padding: 100px 0 112px;
      overflow: hidden;
    }
    .mission-layout {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      padding-left: 120px;
      padding-right: 120px;
    }

    /* Header block */
    .mission-header { max-width: 760px; margin-bottom: 64px; }
    .mission-heading {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(26px, 3vw, 42px);
      font-weight: 900;
      color: #183f12;
      letter-spacing: -0.025em;
      line-height: 1.15;
      margin-bottom: 28px;
    }
    .mission-heading span {
      background: linear-gradient(135deg, #3d9930, #24611c);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .mission-body {
      font-size: 17px;
      line-height: 1.85;
      color: #57534e;
    }

    /* Category cards row */
    .mission-cards {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 20px;
      width: 100%;
    }
    .mission-card {
      border-radius: 20px;
      overflow: hidden;
      position: relative;
      aspect-ratio: 3/4;
      box-shadow: 0 8px 32px rgba(24,63,18,0.13);
      cursor: default;
      transition: transform 0.32s ease, box-shadow 0.32s ease;
    }
    .mission-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 20px 56px rgba(24,63,18,0.22);
    }
    .mission-card img {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 0.5s ease;
    }
    .mission-card:hover img { transform: scale(1.06); }
    .mission-card-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, transparent 40%, rgba(10,32,8,0.72) 100%);
      pointer-events: none;
    }
    .mission-card-label {
      position: absolute;
      bottom: 0; left: 0; right: 0;
      padding: 20px 16px 18px;
      font-family: 'Outfit', sans-serif;
      font-size: 15px;
      font-weight: 800;
      color: #fff;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      text-align: center;
    }

    /* ── Responsive: mission-intro ── */
    @media (max-width: 1439px) {
      .mission-layout { padding-left: 60px; padding-right: 60px; }
    }
    @media (max-width: 1023px) {
      .mission-layout { padding-left: 40px; padding-right: 40px; }
      .mission-cards { grid-template-columns: repeat(3, 1fr); gap: 16px; }
    }
    @media (max-width: 767px) {
      #mission-intro { padding: 72px 0 80px; }
      .mission-layout { padding-left: 20px; padding-right: 20px; }
      .mission-cards { grid-template-columns: repeat(2, 1fr); gap: 14px; }
    }

    /* ══════════════════════════════════════
       SECTION 02 — CATEGORY SPOTLIGHT
    ══════════════════════════════════════ */
    #category-spotlight {
      background: #f8faf7;
      padding: 112px 0 120px;
      position: relative;
      overflow: hidden;
    }
    #category-spotlight::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 1px;
      background: linear-gradient(90deg, transparent, #bde5b0 30%, #bde5b0 70%, transparent);
    }
    /* Decorative blobs */
    #category-spotlight::after {
      content: '';
      position: absolute;
      top: -180px; right: -180px;
      width: 520px; height: 520px;
      background: radial-gradient(circle, rgba(143,208,127,0.10) 0%, transparent 68%);
      border-radius: 50%;
      pointer-events: none;
    }
    .cs-blob-bottom {
      position: absolute;
      bottom: -200px; left: -160px;
      width: 480px; height: 480px;
      background: radial-gradient(circle, rgba(61,153,48,0.07) 0%, transparent 68%);
      border-radius: 50%;
      pointer-events: none;
    }

    /* Section header */
    .cs-header {
      text-align: center;
      padding: 0 120px 72px;
      position: relative;
      z-index: 1;
    }
    .cs-header .section-label { margin-bottom: 14px; }
    .cs-header .divider-accent,
    .gn-header .divider-accent {
      margin-left: auto;
      margin-right: auto;
    }
    .cs-header h2 {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(28px, 3.5vw, 46px);
      font-weight: 900;
      color: #183f12;
      letter-spacing: -0.03em;
      line-height: 1.12;
      margin-bottom: 20px;
    }
    .cs-header h2 em {
      font-style: normal;
      background: linear-gradient(135deg, #3d9930, #24611c);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .cs-header p {
      font-size: clamp(15px, 1.3vw, 17px);
      color: #78716c;
      line-height: 1.8;
      max-width: 580px;
      margin: 0 auto;
    }

    /* Category grid */
    .cs-grid {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 0;
      padding: 0 120px;
      position: relative;
      z-index: 1;
    }
    /* Each card */
    .cs-card {
      position: relative;
      overflow: hidden;
      cursor: pointer;
      border-radius: 0;
    }
    .cs-card:first-child { border-radius: 24px 0 0 24px; }
    .cs-card:last-child  { border-radius: 0 24px 24px 0; }
    .cs-card-inner {
      position: relative;
      aspect-ratio: 2/3;
      overflow: hidden;
    }
    .cs-card-img {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 0.55s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }
    .cs-card:hover .cs-card-img { transform: scale(1.08); }

    /* Dark gradient overlay */
    .cs-card-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(
        180deg,
        transparent 30%,
        rgba(8,24,6,0.55) 62%,
        rgba(8,24,6,0.88) 100%
      );
      transition: background 0.4s ease;
      pointer-events: none;
    }
    .cs-card:hover .cs-card-overlay {
      background: linear-gradient(
        180deg,
        transparent 10%,
        rgba(8,24,6,0.50) 52%,
        rgba(8,24,6,0.92) 100%
      );
    }

    /* Green accent bar at top of each card */
    .cs-card-accent {
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 3px;
      background: linear-gradient(90deg, #3d9930, #8fd07f);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.4s ease;
      z-index: 3;
    }
    .cs-card:hover .cs-card-accent { transform: scaleX(1); }

    /* Text content at bottom */
    .cs-card-body {
      position: absolute;
      bottom: 0; left: 0; right: 0;
      padding: 28px 22px 26px;
      z-index: 2;
    }

    /* Category number */
    .cs-card-num {
      font-family: 'Outfit', sans-serif;
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: #8fd07f;
      margin-bottom: 8px;
      opacity: 0.8;
    }

    /* Category title */
    .cs-card-title {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(15px, 1.4vw, 19px);
      font-weight: 900;
      color: #fff;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      line-height: 1.18;
      margin-bottom: 10px;
    }

    /* Sub-descriptor — hidden by default, slides up on hover */
    .cs-card-desc {
      font-size: 13px;
      color: rgba(255,255,255,0.68);
      line-height: 1.65;
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.4s ease, opacity 0.4s ease;
      opacity: 0;
    }
    .cs-card:hover .cs-card-desc {
      max-height: 120px;
      opacity: 1;
    }

    /* Divider line between title and desc */
    .cs-card-divider {
      width: 28px; height: 2px;
      background: linear-gradient(90deg, #5fb550, #8fd07f);
      border-radius: 1px;
      margin-bottom: 10px;
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.35s ease 0.05s;
    }
    .cs-card:hover .cs-card-divider { transform: scaleX(1); }

    /* Pill tag */
    .cs-card-tag {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      margin-top: 12px;
      background: rgba(95,181,80,0.18);
      border: 1px solid rgba(95,181,80,0.35);
      border-radius: 100px;
      padding: 4px 12px;
      font-size: 11px;
      font-weight: 700;
      color: #8fd07f;
      letter-spacing: 0.07em;
      text-transform: uppercase;
      opacity: 0;
      transform: translateY(8px);
      transition: opacity 0.35s ease 0.12s, transform 0.35s ease 0.12s;
    }
    .cs-card:hover .cs-card-tag {
      opacity: 1;
      transform: translateY(0);
    }
    .cs-card:nth-child(5) .cs-card-body {
      padding-bottom: 61px;
    }

    /* Vertical separator lines between cards */
    .cs-card:not(:last-child)::after {
      content: '';
      position: absolute;
      top: 10%; bottom: 10%;
      right: 0;
      width: 1px;
      background: rgba(255,255,255,0.10);
      z-index: 4;
      pointer-events: none;
    }

    /* ── Feature strip below cards ── */
    .cs-strip {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 0;
      margin: 40px 120px 0;
      border: 1.5px solid #e0f2d8;
      border-radius: 20px;
      overflow: hidden;
      background: #fff;
      box-shadow: 0 8px 40px rgba(24,63,18,0.06);
      position: relative;
      z-index: 1;
    }
    .cs-strip-item {
      display: flex;
      align-items: center;
      gap: 16px;
      padding: 28px 28px;
      transition: background 0.25s;
      position: relative;
    }
    .cs-strip-item:not(:last-child)::after {
      content: '';
      position: absolute;
      top: 20%; bottom: 20%;
      right: 0;
      width: 1px;
      background: #e0f2d8;
    }
    .cs-strip-item:hover { background: #f2f9f0; }
    .cs-strip-icon {
      width: 44px; height: 44px;
      background: linear-gradient(135deg, #f2f9f0, #e0f2d8);
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      border: 1.5px solid #bde5b0;
    }
    .cs-strip-icon svg { color: #2d7a23; }
    .cs-strip-text {}
    .cs-strip-title {
      font-size: 14px;
      font-weight: 700;
      color: #183f12;
      margin-bottom: 3px;
      line-height: 1.3;
    }
    .cs-strip-sub {
      font-size: 12.5px;
      color: #78716c;
      line-height: 1.5;
    }

    /* Responsive: category spotlight */
    @media (max-width: 1439px) {
      .cs-header { padding: 0 60px 64px; }
      .cs-grid { padding: 0 60px; }
      .cs-strip { margin: 36px 60px 0; }
    }
    @media (max-width: 1200px) {
      .cs-grid { gap: 0; }
    }
    @media (max-width: 1023px) {
      .cs-header { padding: 0 40px 52px; }
      .cs-grid {
        padding: 0 40px;
        grid-template-columns: repeat(3, 1fr);
      }
      .cs-card:first-child { border-radius: 24px 0 0 0; }
      .cs-card:last-child  { border-radius: 0 0 24px 0; }
      .cs-card:nth-child(3) { border-radius: 0 24px 0 0; }
      .cs-card:nth-child(4) { border-radius: 0 0 0 24px; }
      .cs-card:not(:last-child)::after { display: none; }
      .cs-strip { margin: 28px 40px 0; grid-template-columns: repeat(2, 1fr); }
      .cs-strip-item:nth-child(2)::after { display: none; }
    }
    @media (max-width: 767px) {
      #category-spotlight { padding: 72px 0 80px; }
      .cs-header { padding: 0 20px 44px; }
      .cs-grid {
        padding: 0 20px;
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
      }
      .cs-card:first-child,
      .cs-card:nth-child(3),
      .cs-card:nth-child(4) { border-radius: 0; }
      .cs-card:first-child  { border-radius: 16px 0 0 0; }
      .cs-card:nth-child(2) { border-radius: 0 16px 0 0; }
      .cs-card:nth-child(4) { border-radius: 0 0 0 16px; }
      .cs-card:nth-child(5) { border-radius: 0 0 16px 16px; grid-column: span 2; }
      .cs-card:nth-child(5) .cs-card-inner { aspect-ratio: 3/1.4; }
      .cs-card-title { font-size: 14px; }
      .cs-strip { margin: 20px 20px 0; grid-template-columns: 1fr 1fr; }
      .cs-strip-item { padding: 20px 18px; gap: 12px; }
      .cs-strip-item:nth-child(2)::after,
      .cs-strip-item:nth-child(4)::after { display: none; }
    }

    /* ══════════════════════════════════════
       SECTION — GLOBAL NETWORK MAP
    ══════════════════════════════════════ */
    #global-network {
      background: #0d2409;
      position: relative;
      overflow: hidden;
      padding: 120px 0 0;
    }
    /* Top separator — hidden: same background as cold-chain for seamless transition */
    #global-network::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 1px;
      background: transparent;
    }
    /* Ambient glow blobs */
    .gn-blob-tl {
      position: absolute;
      top: -200px; left: -200px;
      width: 600px; height: 600px;
      background: radial-gradient(circle, rgba(95,181,80,0.05) 0%, transparent 65%);
      border-radius: 50%;
      pointer-events: none;
    }
    .gn-blob-br {
      position: absolute;
      bottom: -180px; right: -180px;
      width: 560px; height: 560px;
      background: radial-gradient(circle, rgba(95,181,80,0.04) 0%, transparent 65%);
      border-radius: 50%;
      pointer-events: none;
    }

    /* ── Section header ── */
    .gn-header {
      text-align: center;
      padding: 0 120px 72px;
      position: relative;
      z-index: 2;
    }
    .gn-header .section-label-light {
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: #8fd07f;
      margin-bottom: 16px;
    }
    .gn-title {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(32px, 4.5vw, 64px);
      font-weight: 900;
      color: #fff;
      letter-spacing: -0.03em;
      line-height: 1.08;
      margin-bottom: 28px;
    }
    .gn-title span {
      background: linear-gradient(135deg, #8fd07f, #5fb550);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .gn-subtitle {
      font-size: clamp(15px, 1.3vw, 17px);
      color: rgba(255,255,255,0.55);
      line-height: 1.85;
      max-width: 600px;
      margin: 0 auto;
    }

    /* ── Map container ── */
    .gn-map-wrap {
      position: relative;
      width: 100%;
      z-index: 2;
      /* subtle grid overlay */
      background-image:
        linear-gradient(rgba(143,208,127,0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(143,208,127,0.03) 1px, transparent 1px);
      background-size: 60px 60px;
    }
    .gn-map-wrap svg.world-map {
      width: 100%;
      height: auto;
      display: block;
      opacity: 0.22;
      fill: rgba(143,208,127,0.9);
    }
    .gn-map-wrap svg.world-map path { display: none; }
    .gn-map-wrap svg.world-map .gn-continent {
      display: block;
      fill: rgba(143,208,127,0.9);
    }
    .gn-map-wrap svg.world-map .gn-island {
      display: block;
      fill: rgba(143,208,127,0.75);
    }
    .gn-map-wrap svg.world-map-fixed {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      display: block;
      opacity: 0.22;
      fill: rgba(143,208,127,0.9);
      pointer-events: none;
      z-index: 1;
    }
    .gn-map-wrap svg.world-map-fixed .gn-island { fill: rgba(143,208,127,0.75); }

    /* ── Node markers ── */
    .gn-node {
      position: absolute;
      transform: translate(-50%, -50%);
      z-index: 5;
      cursor: default;
    }
    .c21074{left:35.6%;top:55.6%;}
    .c21132{left:34.4%;top:68.3%;}
    .c21186{left:32.2%;top:68.9%;}
    .c21240{left:30.3%;top:66.7%;}
    .c21294{left:28.3%;top:50.8%;}
    .c21348{left:32.2%;top:59.4%;}
    .c21402{left:22.8%;top:28.3%;}
    .c21456{left:49%;top:27.8%;}
    .c21510{left:51.5%;top:21.1%;}
    .c21564{left:52.8%;top:18.9%;}
    .c21618{left:78.9%;top:30.6%;}
    .c21672{left:87.2%;top:63.9%;}
    .c21726{left:96.2%;top:72.8%;}
    /* Pulse ring */
    .gn-node-pulse {
      position: absolute;
      top: 50%; left: 50%;
      transform: translate(-50%, -50%);
      width: 40px; height: 40px;
      border-radius: 50%;
      background: rgba(95,181,80,0.15);
      border: 1px solid rgba(95,181,80,0.30);
      animation: gnPulse 2.4s ease-out infinite;
    }
    .gn-node:nth-child(2n) .gn-node-pulse   { animation-delay: 0.4s; }
    .gn-node:nth-child(3n) .gn-node-pulse   { animation-delay: 0.8s; }
    .gn-node:nth-child(4n) .gn-node-pulse   { animation-delay: 1.2s; }
    .gn-node:nth-child(5n) .gn-node-pulse   { animation-delay: 1.6s; }
    .gn-node:nth-child(6n) .gn-node-pulse   { animation-delay: 2.0s; }
    @keyframes gnPulse {
      0%   { transform: translate(-50%,-50%) scale(1);   opacity: 0.80; }
      100% { transform: translate(-50%,-50%) scale(2.6); opacity: 0; }
    }
    /* Dot */
    .gn-node-dot {
      position: relative;
      z-index: 2;
      width: 12px; height: 12px;
      border-radius: 50%;
      background: linear-gradient(135deg, #8fd07f, #3d9930);
      border: 2px solid rgba(255,255,255,0.55);
      box-shadow: 0 0 12px rgba(95,181,80,0.55);
      transition: transform 0.3s ease, box-shadow 0.3s ease;
    }
    .gn-node:hover .gn-node-dot {
      transform: scale(1.5);
      box-shadow: 0 0 24px rgba(95,181,80,0.80);
    }
    /* Label */
    .gn-node-label {
      position: absolute;
      top: calc(100% + 8px);
      left: 50%;
      transform: translateX(-50%);
      background: rgba(15,42,11,0.90);
      border: 1px solid rgba(143,208,127,0.30);
      backdrop-filter: blur(10px);
      border-radius: 6px;
      padding: 5px 11px;
      font-size: 11px;
      font-weight: 700;
      color: #c2f0b8;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      white-space: nowrap;
      pointer-events: none;
      transition: opacity 0.3s, transform 0.3s;
    }
    /* Label always visible */
    .gn-node-label { opacity: 1; }
    .c21132 .gn-node-label {
      top: 50%;
      left: calc(100% + 14px);
      transform: translateY(-50%);
    }
    .c21564 .gn-node-label {
      top: auto;
      bottom: calc(100% + 10px);
      left: calc(100% + 8px);
      transform: none;
    }

    /* Connection lines SVG overlay */
    .gn-lines-svg {
      position: absolute;
      inset: 0;
      width: 100%; height: 100%;
      pointer-events: none;
      z-index: 3;
    }
    .gn-conn-line {
      stroke: rgba(95,181,80,0.18);
      stroke-width: 1;
      stroke-dasharray: 4 6;
      fill: none;
      animation: gnLineDash 3s linear infinite;
    }
    @keyframes gnLineDash {
      to { stroke-dashoffset: -40; }
    }

    /* ── Stats row at bottom of map ── */
    .gn-stats-bar {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 0;
      margin: 0 120px;
      border: 1.5px solid rgba(143,208,127,0.14);
      border-radius: 20px 20px 0 0;
      overflow: hidden;
      background: rgba(255,255,255,0.03);
      backdrop-filter: blur(10px);
      position: relative;
      z-index: 10;
    }
    .gn-stat {
      padding: 36px 32px;
      position: relative;
      text-align: center;
      transition: background 0.25s;
    }
    .gn-stat:hover { background: rgba(143,208,127,0.05); }
    .gn-stat:not(:last-child)::after {
      content: '';
      position: absolute;
      top: 20%; bottom: 20%; right: 0;
      width: 1px;
      background: rgba(143,208,127,0.12);
    }
    .gn-stat-num {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(34px, 3.5vw, 52px);
      font-weight: 900;
      background: linear-gradient(135deg, #8fd07f, #5fb550);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      line-height: 1;
      margin-bottom: 8px;
    }
    .gn-stat-label {
      font-size: 13px;
      color: rgba(255,255,255,0.42);
      font-weight: 500;
      line-height: 1.5;
      letter-spacing: 0.02em;
    }

    /* Responsive: Global Network */
    @media (max-width: 1439px) {
      .gn-header { padding: 0 60px 64px; }
      .gn-stats-bar { margin: 0 60px; }
    }
    @media (max-width: 1023px) {
      #global-network { padding: 80px 0 0; }
      .gn-header { padding: 0 40px 52px; }
      .gn-stats-bar { margin: 0 40px; grid-template-columns: repeat(2, 1fr); }
      .gn-stat:nth-child(2)::after { display: none; }
    }
    @media (max-width: 767px) {
      #global-network { padding: 60px 0 0; }
      .gn-header { padding: 0 20px 40px; }
      .gn-stats-bar { margin: 0 20px; grid-template-columns: repeat(2, 1fr); border-radius: 16px 16px 0 0; }
      .gn-stat { padding: 24px 16px; }
      .gn-node-label { display: none; }
    }

    /* ══════════════════════════════════════
       SECTION — COLD-CHAIN & LOGISTICS
    ══════════════════════════════════════ */
    #cold-chain {
      background: #0d2409;
      position: relative;
      overflow: hidden;
    }
    /* Top hairline separator */
    #cold-chain::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.07) 30%, rgba(255,255,255,0.07) 70%, transparent);
      z-index: 2;
    }
    /* Bottom fade-out transition toward #global-network */
    #cold-chain::after {
      content: '';
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 160px;
      background: linear-gradient(to bottom, transparent, #0d2409);
      pointer-events: none;
      z-index: 3;
    }
    /* Ambient glow — subtle teal/green accent only */
    .cc-glow-tr {
      position: absolute;
      top: -160px; right: -160px;
      width: 520px; height: 520px;
      background: radial-gradient(circle, rgba(95,181,80,0.06) 0%, transparent 65%);
      border-radius: 50%;
      pointer-events: none;
    }
    .cc-glow-bl {
      position: absolute;
      bottom: -140px; left: -140px;
      width: 480px; height: 480px;
      background: radial-gradient(circle, rgba(95,181,80,0.04) 0%, transparent 65%);
      border-radius: 50%;
      pointer-events: none;
    }

    /* ── Simplified cold-chain layout ── */
    .cc-layout {
      max-width: 1200px;
      margin: 0 auto;
      padding: 96px 60px;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 64px;
      align-items: center;
      position: relative;
      z-index: 2;
    }

    /* Left: rounded image */
    .cc-image-panel {
      position: relative;
      border-radius: 24px;
      overflow: hidden;
      aspect-ratio: 4/3;
      box-shadow: 0 32px 80px rgba(0,0,0,0.45);
    }
    .cc-image-panel img {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 0.7s ease;
    }
    .cc-image-panel:hover img { transform: scale(1.05); }
    .cc-image-panel::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(8,24,6,0.50) 0%, transparent 55%);
      pointer-events: none;
    }
    /* Temperature badge */
    .cc-temp-badge {
      position: absolute;
      bottom: 20px;
      left: 20px;
      z-index: 3;
      background: rgba(13,15,20,0.82);
      border: 1px solid rgba(255,255,255,0.10);
      backdrop-filter: blur(12px);
      border-radius: 12px;
      padding: 12px 18px;
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .cc-temp-icon {
      width: 36px; height: 36px;
      border-radius: 8px;
      background: rgba(95,181,80,0.15);
      border: 1px solid rgba(143,208,127,0.22);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }
    .cc-temp-icon svg { color: #8fd07f; }
    .cc-temp-val {
      font-family: 'Outfit', sans-serif;
      font-size: 18px;
      font-weight: 900;
      color: #a5e89a;
      line-height: 1;
    }
    .cc-temp-lbl {
      font-size: 11px;
      color: rgba(255,255,255,0.42);
      font-weight: 500;
      margin-top: 3px;
    }

    /* Right: text panel — no background box, reads directly on dark section bg */
    .cc-text-panel {
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    /* Eyebrow label */
    .cc-label {
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: #8fd07f;
      margin-bottom: 10px;
    }
    /* Divider */
    .cc-divider {
      width: 36px;
      height: 2px;
      background: linear-gradient(90deg, #5fb550, #8fd07f);
      border-radius: 2px;
      margin-bottom: 20px;
    }
    /* Heading */
    .cc-heading {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(24px, 2.6vw, 36px);
      font-weight: 900;
      color: #fff;
      letter-spacing: -0.025em;
      line-height: 1.18;
      margin-bottom: 16px;
    }
    .cc-heading span {
      background: linear-gradient(135deg, #8fd07f, #5fb550);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    /* Body text */
    .cc-body {
      font-size: 15px;
      color: rgba(255,255,255,0.50);
      line-height: 1.85;
      margin-bottom: 32px;
    }

    /* Simplified feature list — compact 2-column tag grid */
    .cc-features {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
      margin-bottom: 36px;
    }
    .cc-feature-item {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 14px 16px;
      border-radius: 12px;
      background: rgba(255,255,255,0.04);
      border: 1px solid rgba(255,255,255,0.07);
      transition: background 0.22s, border-color 0.22s;
    }
    .cc-feature-item:hover {
      background: rgba(95,181,80,0.08);
      border-color: rgba(95,181,80,0.22);
    }
    .cc-feature-icon {
      width: 32px; height: 32px;
      border-radius: 8px;
      background: rgba(95,181,80,0.10);
      border: 1px solid rgba(95,181,80,0.18);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }
    .cc-feature-icon svg { color: #8fd07f; }
    .cc-feature-title {
      font-size: 13px;
      font-weight: 600;
      color: rgba(255,255,255,0.80);
      line-height: 1.35;
    }
    /* Hide desc in simplified layout */
    .cc-feature-desc { display: none; }
    .cc-feature-text {}

    /* CTA row */
    .cc-cta-row {
      display: flex;
      align-items: center;
      gap: 16px;
      flex-wrap: wrap;
    }
    .cc-btn-primary {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: linear-gradient(135deg, #3d9930, #24611c);
      color: #fff;
      padding: 12px 26px;
      border-radius: 8px;
      font-size: 14px;
      font-weight: 700;
      text-decoration: none;
      letter-spacing: 0.01em;
      transition: all 0.25s;
      box-shadow: 0 4px 20px rgba(61,153,48,0.30);
      border: none;
      cursor: pointer;
      white-space: nowrap;
    }
    .cc-btn-primary:hover {
      transform: translateY(-2px);
      box-shadow: 0 8px 28px rgba(61,153,48,0.45);
    }
    .cc-btn-primary svg { color: #fff; flex-shrink: 0; }
    .cc-btn-ghost {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      color: rgba(255,255,255,0.45);
      font-size: 13.5px;
      font-weight: 600;
      text-decoration: none;
      transition: color 0.22s;
      cursor: pointer;
      border: none;
      background: transparent;
      white-space: nowrap;
    }
    .cc-btn-ghost:hover { color: #8fd07f; }
    .cc-btn-ghost svg { color: inherit; flex-shrink: 0; }

    /* Responsive: cold-chain */
    @media (max-width: 1023px) {
      .cc-layout { grid-template-columns: 1fr; gap: 40px; padding: 72px 40px; }
    }
    @media (max-width: 767px) {
      .cc-layout { padding: 56px 24px; }
      .cc-features { grid-template-columns: 1fr; }
    }

    /* ══════════════════════════════════════
       SECTION — PRODUCT CUSTOMIZATION
    ══════════════════════════════════════ */
    #product-customization {
      background: #f7f5f2;
      position: relative;
      overflow: hidden;
      padding: 0 0 120px;
    }

    /* Smooth wave transition from dark section above */
    .pc-wave-transition {
      position: relative;
      width: 100%;
      height: 100px;
      background: #0d0f14;
      flex-shrink: 0;
    }
    .pc-wave-transition::after {
      content: '';
      position: absolute;
      bottom: -1px; left: 0; right: 0;
      height: 100px;
      background: #f7f5f2;
      clip-path: ellipse(56% 100% at 50% 100%);
    }

    /* Subtle decorative elements */
    .pc-blob-tr {
      position: absolute;
      top: 60px; right: -140px;
      width: 480px; height: 480px;
      background: radial-gradient(circle, rgba(201,127,40,0.06) 0%, transparent 68%);
      border-radius: 50%;
      pointer-events: none;
    }
    .pc-blob-bl {
      position: absolute;
      bottom: 0; left: -120px;
      width: 420px; height: 420px;
      background: radial-gradient(circle, rgba(61,153,48,0.05) 0%, transparent 68%);
      border-radius: 50%;
      pointer-events: none;
    }

    /* Section header */
    .pc-header {
      text-align: center;
      padding: 96px 120px 72px;
      position: relative;
      z-index: 2;
    }
    .pc-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: #c97f28;
      margin-bottom: 20px;
    }
    .pc-eyebrow-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: #c97f28;
      flex-shrink: 0;
    }
    .pc-title {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(30px, 4vw, 54px);
      font-weight: 900;
      color: #1c1917;
      letter-spacing: -0.03em;
      line-height: 1.1;
      margin-bottom: 28px;
    }
    .pc-title span {
      background: linear-gradient(135deg, #c97f28, #a8641d);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .pc-divider {
      width: 56px;
      height: 4px;
      background: linear-gradient(90deg, #c97f28, #d99a47);
      border-radius: 2px;
      margin: 0 auto 28px;
    }
    .pc-subtitle {
      font-size: clamp(15px, 1.3vw, 17px);
      color: #78716c;
      line-height: 1.85;
      max-width: 640px;
      margin: 0 auto;
    }

    /* ── Cards grid layout ── */
    .pc-grid {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 20px;
      padding: 0 120px;
      position: relative;
      z-index: 2;
    }

    /* Each capability card */
    .pc-card {
      background: #fff;
      border-radius: 24px;
      border: 1.5px solid #ede8e1;
      padding: 36px 28px 32px;
      position: relative;
      overflow: hidden;
      transition: all 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
      cursor: default;
      display: flex;
      flex-direction: column;
      gap: 0;
    }
    .pc-card::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 3px;
      background: linear-gradient(90deg, #c97f28, #d99a47);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.4s ease;
      border-radius: 24px 24px 0 0;
    }
    .pc-card:hover {
      border-color: #d99a47;
      box-shadow: 0 24px 64px rgba(168,100,29,0.12);
      transform: translateY(-6px);
    }
    .pc-card:hover::before { transform: scaleX(1); }

    /* Icon box */
    .pc-card-icon {
      width: 52px; height: 52px;
      border-radius: 16px;
      background: linear-gradient(135deg, #fdf8f0, #f9edda);
      border: 1.5px solid #f2d8b0;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 22px;
      flex-shrink: 0;
      transition: all 0.35s ease;
    }
    .pc-card-icon svg { color: #c97f28; }
    .pc-card:hover .pc-card-icon {
      background: linear-gradient(135deg, #c97f28, #a8641d);
      border-color: transparent;
    }
    .pc-card:hover .pc-card-icon svg { color: #fff; }

    /* Card number */
    .pc-card-num {
      font-family: 'Outfit', sans-serif;
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #2d7a23;
      margin-bottom: 10px;
      opacity: 0.65;
    }

    /* Card title */
    .pc-card-title {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(16px, 1.4vw, 18px);
      font-weight: 800;
      color: #1c1917;
      letter-spacing: -0.01em;
      line-height: 1.25;
      margin-bottom: 12px;
    }

    /* Thin rule */
    .pc-card-rule {
      width: 28px;
      height: 2px;
      background: linear-gradient(90deg, #3d9930, #8fd07f);
      border-radius: 1px;
      margin-bottom: 14px;
      transition: width 0.35s ease;
    }
    .pc-card:hover .pc-card-rule { width: 44px; }

    /* Card description */
    .pc-card-desc {
      font-size: 13.5px;
      color: #78716c;
      line-height: 1.75;
      flex: 1;
    }

    /* Bottom tag chip */
    .pc-card-chip {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      margin-top: 20px;
      background: #fdf8f0;
      border: 1px solid #f2d8b0;
      border-radius: 100px;
      padding: 5px 13px;
      font-size: 11px;
      font-weight: 700;
      color: #a8641d;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      align-self: flex-start;
      transition: all 0.25s ease;
    }
    .pc-card:hover .pc-card-chip {
      background: linear-gradient(135deg, #fdf8f0, #f9edda);
      border-color: #d99a47;
    }

    /* ── Bottom feature band ── */
    .pc-band {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 0;
      margin: 48px 120px 0;
      background: #fff;
      border-radius: 24px;
      border: 1.5px solid #ede8e1;
      overflow: hidden;
      box-shadow: 0 8px 48px rgba(28,25,23,0.05);
      position: relative;
      z-index: 2;
    }
    .pc-band-item {
      display: flex;
      align-items: flex-start;
      gap: 20px;
      padding: 36px 36px;
      position: relative;
      transition: background 0.25s;
    }
    .pc-band-item:hover { background: #fdf8f0; }
    .pc-band-item:not(:last-child)::after {
      content: '';
      position: absolute;
      top: 20%; bottom: 20%; right: 0;
      width: 1px;
      background: #ede8e1;
    }
    .pc-band-icon {
      width: 48px; height: 48px;
      border-radius: 14px;
      background: linear-gradient(135deg, #fdf8f0, #f9edda);
      border: 1.5px solid #f2d8b0;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      transition: all 0.25s;
    }
    .pc-band-item:hover .pc-band-icon {
      background: linear-gradient(135deg, #c97f28, #a8641d);
      border-color: transparent;
    }
    .pc-band-icon svg { color: #c97f28; transition: color 0.25s; }
    .pc-band-item:hover .pc-band-icon svg { color: #fff; }
    .pc-band-body {}
    .pc-band-title {
      font-size: 15px;
      font-weight: 700;
      color: #1c1917;
      line-height: 1.3;
      margin-bottom: 5px;
    }
    .pc-band-sub {
      font-size: 13px;
      color: #a8a29e;
      line-height: 1.6;
    }

    /* Responsive: product customization */
    @media (max-width: 1439px) {
      .pc-header { padding: 88px 60px 64px; }
      .pc-grid { padding: 0 60px; }
      .pc-band { margin: 40px 60px 0; }
    }
    @media (max-width: 1200px) {
      .pc-grid { grid-template-columns: repeat(3, 1fr); }
    }
    @media (max-width: 1023px) {
      .pc-header { padding: 72px 40px 52px; }
      .pc-grid { padding: 0 40px; grid-template-columns: repeat(2, 1fr); gap: 16px; }
      .pc-band { margin: 32px 40px 0; grid-template-columns: 1fr; }
      .pc-band-item:not(:last-child)::after { top: auto; bottom: 0; left: 20px; right: 20px; width: auto; height: 1px; }
    }
    @media (max-width: 767px) {
      #product-customization { padding: 0 0 80px; }
      .pc-wave-transition { height: 72px; }
      .pc-wave-transition::after { height: 72px; }
      .pc-header { padding: 60px 20px 44px; }
      .pc-grid { padding: 0 20px; grid-template-columns: 1fr 1fr; gap: 14px; }
      .pc-card { padding: 28px 22px 26px; }
      .pc-band { margin: 24px 20px 0; }
      .pc-band-item { padding: 28px 24px; }
    }
    @media (max-width: 480px) {
      .pc-grid { grid-template-columns: 1fr; }
    }

    /* ══════════════════════════════════════
       SECTION — PROCESSING CAPABILITIES (new dark panel)
    ══════════════════════════════════════ */
    #processing-capabilities {
      background: #eaf7e4;
      position: relative;
      overflow: hidden;
    }

    /* Smooth angled transition from warm #f7f5f2 above */
    .procap-transition {
      position: relative;
      width: 100%;
      height: 88px;
      background: #f7f5f2;
      flex-shrink: 0;
    }
    .procap-transition::after {
      content: '';
      position: absolute;
      bottom: -1px; left: 0; right: 0;
      height: 88px;
      background: #eaf7e4;
      clip-path: polygon(0 100%, 100% 0, 100% 100%);
    }

    /* Ambient glow orbs */
    .procap-glow-tl {
      position: absolute;
      top: -120px; left: -120px;
      width: 560px; height: 560px;
      background: radial-gradient(circle, rgba(143,208,127,0.24) 0%, transparent 65%);
      border-radius: 50%;
      pointer-events: none;
    }
    .procap-glow-br {
      position: absolute;
      bottom: -100px; right: -100px;
      width: 500px; height: 500px;
      background: radial-gradient(circle, rgba(61,153,48,0.16) 0%, transparent 65%);
      border-radius: 50%;
      pointer-events: none;
    }
    /* Subtle dot-grid texture */
    #processing-capabilities::before {
      content: '';
      position: absolute;
      inset: 0;
      background-image: radial-gradient(rgba(45,122,35,0.08) 1px, transparent 1px);
      background-size: 32px 32px;
      pointer-events: none;
      z-index: 0;
    }

    /* ── Inner wrapper ── */
    .procap-inner {
      position: relative;
      z-index: 1;
      max-width: 1320px;
      margin: 0 auto;
      padding: 0 80px 120px;
    }

    /* ── Section header: centered single-column ── */
    .procap-header {
      display: grid;
      grid-template-columns: minmax(0, 0.95fr) minmax(360px, 1.05fr);
      gap: 72px;
      align-items: center;
      text-align: left;
      padding-top: 100px;
      padding-bottom: 120px;
      min-height: 560px;
    }
    .procap-header-left { width: 100%; max-width: 560px; }
    .procap-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.20em;
      text-transform: uppercase;
      color: #2d7a23;
      margin-bottom: 24px;
    }
    .procap-eyebrow-line {
      width: 28px;
      height: 2px;
      background: linear-gradient(90deg, #3d9930, #8fd07f);
      border-radius: 1px;
      flex-shrink: 0;
    }
    .procap-h1 {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(36px, 4.5vw, 64px);
      font-weight: 900;
      color: #183f12;
      letter-spacing: -0.035em;
      line-height: 1.05;
      margin-bottom: 28px;
    }
    .procap-h1 span {
      background: linear-gradient(135deg, #3d9930, #24611c);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .procap-header-right {
      width: 100%;
      min-height: 390px;
      position: relative;
    }
    .procap-h2 {
      font-size: clamp(15px, 1.3vw, 17px);
      color: #4b6047;
      line-height: 1.9;
      max-width: 620px;
    }
    .procap-service-bubbles {
      position: relative;
      width: 100%;
      min-height: 390px;
    }
    .procap-bubble {
      position: absolute;
      display: inline-flex;
      align-items: center;
      gap: 11px;
      min-height: 56px;
      padding: 11px 18px 11px 12px;
      background: rgba(255,255,255,0.86);
      border: 1px solid rgba(45,122,35,0.14);
      border-radius: 999px;
      box-shadow: 0 18px 42px rgba(30,77,23,0.12);
      color: #183f12;
      font-family: 'Outfit', sans-serif;
      font-size: clamp(13px, 1.1vw, 16px);
      font-weight: 800;
      line-height: 1.2;
      white-space: nowrap;
      animation: procapBubbleFloat 7s ease-in-out infinite;
      transition: box-shadow 0.28s ease, border-color 0.28s ease;
    }
    .procap-bubble:hover {
      border-color: rgba(61,153,48,0.34);
      box-shadow: 0 22px 54px rgba(30,77,23,0.16);
      animation-play-state: paused;
    }
    .procap-bubble-icon {
      width: 38px;
      height: 38px;
      border-radius: 50%;
      background: linear-gradient(135deg, #3d9930, #24611c);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      box-shadow: 0 8px 22px rgba(61,153,48,0.24);
    }
    .procap-bubble-icon svg {
      width: 19px;
      height: 19px;
      color: #fff;
    }
    .procap-bubble:nth-child(1) { top: 8px; left: 7%; }
    .procap-bubble:nth-child(2) { top: 70px; right: 5%; animation-delay: -1.2s; }
    .procap-bubble:nth-child(3) { top: 153px; left: 0; animation-delay: -2.4s; }
    .procap-bubble:nth-child(4) { top: 210px; right: 0; animation-delay: -3.1s; }
    .procap-bubble:nth-child(5) { bottom: 30px; left: 13%; animation-delay: -4.3s; }
    .procap-bubble:nth-child(6) { bottom: 0; right: 11%; animation-delay: -5.2s; }
    @keyframes procapBubbleFloat {
      0%, 100% { transform: translate3d(0, 0, 0); }
      35% { transform: translate3d(8px, -9px, 0); }
      70% { transform: translate3d(-5px, 6px, 0); }
    }
    /* Stats pills row in header */
    .procap-stats-row {
      display: none;
      gap: 10px;
      flex-wrap: wrap;
      justify-content: center;
    }
    .procap-stat-pill {
      display: flex;
      align-items: center;
      gap: 8px;
      background: rgba(255,255,255,0.05);
      border: 1px solid rgba(255,255,255,0.09);
      border-radius: 100px;
      padding: 8px 16px;
      font-size: 12.5px;
      font-weight: 600;
      color: rgba(255,255,255,0.68);
      white-space: nowrap;
    }
    .procap-stat-pill-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: #c97f28;
      flex-shrink: 0;
    }

    /* ── Cards layout ── */
    /* Row 1: featured card full-width horizontal */
    .procap-cards-top {
      display: block;
      margin-bottom: 18px;
    }
    /* Row 2: 02–05 four-column grid */
    .procap-cards-middle {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 18px;
      margin-bottom: 18px;
    }
    /* Row 3: promise card full-width horizontal */
    .procap-cards-bottom {
      display: block;
    }
    .procap-right-stack {
      display: flex;
      flex-direction: column;
      gap: 18px;
    }
    /* Promise card horizontal layout */
    .procap-card.is-promise {
      display: flex;
      flex-direction: row;
    }
    .procap-card.is-promise .procap-promise-img {
      position: relative;
      width: 38%;
      flex-shrink: 0;
      overflow: hidden;
      border-radius: 18px 0 0 18px;
    }
    .procap-card.is-promise .procap-promise-img img {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 0.6s ease;
    }
    .procap-card.is-promise:hover .procap-promise-img img { transform: scale(1.05); }
    .procap-card.is-promise .procap-promise-img::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(to right, transparent 50%, rgba(17,24,39,0.55) 100%);
      border-radius: inherit;
      pointer-events: none;
    }
    .procap-card.is-promise .procap-promise-body {
      flex: 1;
      padding: 36px 40px;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }
    .procap-card.is-promise .procap-promise-stats {
      margin-top: 24px;
      display: flex;
      flex-direction: row;
      gap: 14px;
    }
    .procap-card.is-promise .procap-promise-stats > div {
      flex: 1;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 11px 14px;
      background: rgba(255,255,255,0.04);
      border: 1px solid rgba(255,255,255,0.07);
      border-radius: 10px;
    }

    /* ── Base card styles ── */
    .procap-card {
      background: rgba(255,255,255,0.76);
      border: 1px solid rgba(45,122,35,0.12);
      border-radius: 20px;
      position: relative;
      overflow: hidden;
      transition: all 0.38s cubic-bezier(0.25, 0.46, 0.45, 0.94);
      cursor: default;
    }
    .procap-card::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 2px;
      background: linear-gradient(90deg, #c97f28, #d99a47, transparent);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.45s ease;
      border-radius: 20px 20px 0 0;
    }
    .procap-card:hover {
      background: rgba(255,255,255,0.92);
      border-color: rgba(61,153,48,0.24);
      box-shadow: 0 24px 60px rgba(30,77,23,0.13), 0 0 0 1px rgba(61,153,48,0.10);
      transform: translateY(-4px);
    }
    .procap-card:hover::before { transform: scaleX(1); }

    /* Featured card (large, top-left) */
    .procap-card.is-featured {
      display: flex;
      flex-direction: row;
    }
    .procap-card.is-featured .procap-card-img-wrap {
      position: relative;
      width: 46%;
      flex-shrink: 0;
      overflow: hidden;
      border-radius: 18px 0 0 18px;
    }
    .procap-card.is-featured .procap-card-img-wrap img {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 0.6s ease;
    }
    .procap-card.is-featured:hover .procap-card-img-wrap img { transform: scale(1.05); }
    .procap-card.is-featured .procap-card-img-wrap::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(to right, transparent 50%, rgba(17,24,39,0.55) 100%);
      border-radius: inherit;
      pointer-events: none;
    }
    .procap-card.is-featured .procap-card-body {
      padding: 32px 32px 32px;
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    /* Small image card: vertical layout (image top, content below) */
    .procap-card.is-small-img {
      display: flex;
      flex-direction: column;
      flex: 1;
    }
    .procap-card.is-small-img .procap-card-img-wrap {
      width: 100%;
      aspect-ratio: 16/7;
      flex-shrink: 0;
      position: relative;
      overflow: hidden;
      border-radius: 18px 18px 0 0;
    }
    .procap-card.is-small-img .procap-card-img-wrap img {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 0.6s ease;
    }
    .procap-card.is-small-img:hover .procap-card-img-wrap img { transform: scale(1.06); }
    .procap-card.is-small-img .procap-card-img-wrap::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(to bottom, transparent 40%, rgba(17,24,39,0.60) 100%);
      border-radius: inherit;
      pointer-events: none;
    }
    .procap-card.is-small-img .procap-card-body {
      padding: 22px 24px 24px;
      display: flex;
      flex-direction: column;
      flex: 1;
    }

    /* Bottom plain cards */
    .procap-card.is-plain .procap-card-body {
      padding: 28px 28px 28px;
      display: flex;
      flex-direction: column;
      gap: 0;
      height: 100%;
    }

    /* ── Card body internals ── */
    .procap-card-icon-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 16px;
    }
    .procap-card-icon {
      width: 44px; height: 44px;
      border-radius: 12px;
      background: rgba(201,127,40,0.12);
      border: 1px solid rgba(201,127,40,0.22);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      transition: all 0.35s ease;
    }
    .procap-card-icon svg { color: #d99a47; }
    .procap-card:hover .procap-card-icon {
      background: linear-gradient(135deg, #c97f28, #a8641d);
      border-color: transparent;
      box-shadow: 0 6px 20px rgba(201,127,40,0.32);
    }
    .procap-card:hover .procap-card-icon svg { color: #fff; }
    .procap-card-num {
      font-family: 'Outfit', sans-serif;
      font-size: 10.5px;
      font-weight: 800;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: rgba(217,154,71,0.40);
    }
    .procap-card-title {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(16px, 1.4vw, 20px);
      font-weight: 800;
      color: #183f12;
      letter-spacing: -0.015em;
      line-height: 1.22;
      margin-bottom: 10px;
    }
    .procap-card-rule {
      width: 24px;
      height: 2px;
      background: linear-gradient(90deg, #c97f28, #d99a47);
      border-radius: 1px;
      margin-bottom: 12px;
      transition: width 0.35s ease;
    }
    .procap-card:hover .procap-card-rule { width: 48px; }
    .procap-card-desc {
      font-size: 13px;
      color: #4b6047;
      line-height: 1.80;
      flex: 1;
    }
    .procap-card-chip {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      margin-top: 16px;
      background: rgba(201,127,40,0.10);
      border: 1px solid rgba(201,127,40,0.20);
      border-radius: 100px;
      padding: 5px 12px;
      font-size: 10.5px;
      font-weight: 700;
      color: #d99a47;
      letter-spacing: 0.07em;
      text-transform: uppercase;
      align-self: flex-start;
      transition: all 0.25s ease;
    }
    .procap-card:hover .procap-card-chip {
      background: rgba(201,127,40,0.18);
      border-color: rgba(201,127,40,0.38);
    }

    /* Small card compact adjustments */
    .is-small-img .procap-card-icon-row { margin-bottom: 10px; }
    .is-small-img .procap-card-title { font-size: clamp(14px, 1.2vw, 16px); margin-bottom: 6px; }
    .is-small-img .procap-card-desc { font-size: 12.5px; }
    .is-small-img .procap-card-chip { margin-top: 12px; padding: 4px 11px; font-size: 10px; }

    /* ── Bottom CTA strip ── */
    .procap-cta-strip {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 40px;
      margin-top: 56px;
      padding: 40px 48px;
      background: rgba(201,127,40,0.07);
      border: 1px solid rgba(201,127,40,0.16);
      border-radius: 24px;
      position: relative;
      overflow: hidden;
    }
    .procap-cta-strip::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 2px;
      background: linear-gradient(90deg, #c97f28, #d99a47, transparent);
      border-radius: 24px 24px 0 0;
    }
    .procap-cta-glow {
      position: absolute;
      right: -80px; top: -80px;
      width: 260px; height: 260px;
      background: radial-gradient(circle, rgba(201,127,40,0.10) 0%, transparent 65%);
      border-radius: 50%;
      pointer-events: none;
    }
    .procap-cta-text { position: relative; z-index: 1; }
    .procap-cta-text h4 {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(18px, 1.7vw, 24px);
      font-weight: 800;
      color: #fff;
      letter-spacing: -0.015em;
      line-height: 1.2;
      margin-bottom: 8px;
    }
    .procap-cta-text p {
      font-size: 14px;
      color: rgba(255,255,255,0.45);
      line-height: 1.7;
      max-width: 560px;
    }
    .procap-cta-actions {
      display: flex;
      align-items: center;
      gap: 16px;
      flex-shrink: 0;
      position: relative;
      z-index: 1;
      flex-wrap: wrap;
    }
    .procap-btn-primary {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      background: linear-gradient(135deg, #c97f28, #a8641d);
      color: #fff;
      padding: 14px 30px;
      border-radius: 10px;
      font-size: 14.5px;
      font-weight: 700;
      text-decoration: none;
      letter-spacing: 0.01em;
      transition: all 0.25s;
      box-shadow: 0 4px 20px rgba(201,127,40,0.40);
      white-space: nowrap;
    }
    .procap-btn-primary:hover {
      transform: translateY(-2px);
      box-shadow: 0 10px 36px rgba(201,127,40,0.55);
    }
    .procap-btn-ghost {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      color: rgba(255,255,255,0.50);
      font-size: 13.5px;
      font-weight: 600;
      text-decoration: none;
      transition: color 0.25s;
      white-space: nowrap;
    }
    .procap-btn-ghost:hover { color: #d99a47; }

    /* ══════════════════════════════════════
       SECTION — MARKET-READY SUPPLY SOLUTIONS
    ══════════════════════════════════════ */
    #market-ready {
      background: #ffffff;
      position: relative;
      overflow: hidden;
    }

    /* Clean top border transition from light green section above */
    .mr-top-bridge {
      width: 100%;
      height: 80px;
      background: #eaf7e4;
      position: relative;
    }
    .mr-top-bridge::after {
      content: '';
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 80px;
      background: #ffffff;
      clip-path: ellipse(56% 100% at 50% 100%);
    }

    /* ── Main container ── */
    .mr-inner {
      position: relative;
      z-index: 1;
      max-width: 1320px;
      margin: 0 auto;
      padding: 0 80px 120px;
      display: grid;
      grid-template-columns: minmax(420px, 0.95fr) minmax(0, 1fr);
      grid-template-rows: auto 1fr;
      column-gap: 76px;
      align-items: center;
    }

    /* ── Minimal section label ── */
    .mr-label {
      display: flex;
      align-items: center;
      gap: 14px;
      padding-top: 80px;
      margin-bottom: 52px;
      grid-column: 2;
      grid-row: 1;
    }
    .mr-label-line {
      width: 28px;
      height: 1px;
      background: #3d9930;
    }
    .mr-label-text {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: #3d9930;
    }

    /* ── Hero text block ── */
    .mr-showcase {
      display: grid;
      grid-template-columns: minmax(420px, 0.95fr) minmax(0, 1fr);
      gap: 76px;
      align-items: center;
      min-height: 600px;
    }
    .mr-copy {
      max-width: 560px;
    }
    .mr-headline-block {
      margin-bottom: 0;
      grid-column: 2;
      grid-row: 2;
      align-self: start;
    }
    .mr-headline {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(36px, 4vw, 60px);
      font-weight: 800;
      color: #111;
      letter-spacing: -0.04em;
      line-height: 1.06;
    }
    .mr-headline em {
      font-style: normal;
      color: #3d9930;
    }
    .mr-subline {
      font-size: clamp(15px, 1.2vw, 17px);
      color: #6b7280;
      line-height: 1.85;
      max-width: 560px;
      margin-top: 28px;
    }

    /* ── Full-width hero image ── */
    .mr-hero-img-wrap {
      position: relative;
      width: 100%;
      height: clamp(320px, 40vw, 560px);
      border-radius: 20px;
      overflow: hidden;
      margin-bottom: 100px;
    }
    .mr-hero-img-wrap img {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }
    .mr-hero-img-wrap:hover img { transform: scale(1.03); }
    /* Minimal left-edge gradient overlay for text legibility */
    .mr-hero-img-wrap::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(to right, rgba(10,20,8,0.55) 0%, rgba(10,20,8,0.10) 55%, transparent 100%);
      border-radius: inherit;
      pointer-events: none;
    }
    /* Floating text on image */
    .mr-hero-caption {
      position: absolute;
      bottom: 48px;
      left: 56px;
      z-index: 2;
    }
    .mr-hero-caption-label {
      font-size: 10.5px;
      font-weight: 700;
      letter-spacing: 0.20em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.65);
      margin-bottom: 10px;
    }
    .mr-hero-caption-title {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(22px, 2.4vw, 34px);
      font-weight: 800;
      color: #fff;
      letter-spacing: -0.025em;
      line-height: 1.18;
    }

    /* ── Five-channel list ── */
    .mr-channels {
      position: relative;
      min-height: 560px;
      margin: 0;
      overflow: visible;
      grid-column: 1;
      grid-row: 1 / span 2;
      align-self: center;
    }
    .mr-channel-item {
      position: absolute;
      top: 0;
      left: 0;
      width: clamp(156px, 13.5vw, 210px);
      aspect-ratio: 1;
      cursor: default;
      border-radius: 50%;
      overflow: hidden;
      box-shadow: none;
      will-change: transform;
      animation: mrBubbleOrbit 18s linear infinite;
    }
    .mr-channel-item:hover {
      animation-play-state: paused;
    }
    .mr-channel-item:nth-child(1) { top: 150px; left: 2%; animation-delay: 0s; }
    .mr-channel-item:nth-child(2) { top: 0; left: 36%; animation-delay: -3.6s; }
    .mr-channel-item:nth-child(3) { top: 170px; right: 0; left: auto; animation-delay: -7.2s; }
    .mr-channel-item:nth-child(4) { top: 340px; left: 3%; animation-delay: -10.8s; }
    .mr-channel-item:nth-child(5) { top: 346px; left: 43%; animation-delay: -14.4s; }
    @keyframes mrBubbleOrbit {
      0% { transform: translate3d(0, -18px, 0); }
      25% { transform: translate3d(18px, 0, 0); }
      50% { transform: translate3d(0, 18px, 0); }
      75% { transform: translate3d(-18px, 0, 0); }
      100% { transform: translate3d(0, -18px, 0); }
    }

    .mr-channel-num {
      font-family: 'Outfit', sans-serif;
      font-size: 10.5px;
      font-weight: 700;
      letter-spacing: 0.16em;
      color: rgba(255,255,255,0.55);
      position: absolute;
      top: 20px;
      left: 50%;
      transform: translateX(-50%);
      z-index: 3;
    }
    /* Portrait image card — full bleed */
    .mr-channel-img {
      width: 100%;
      height: 100%;
      overflow: hidden;
      position: relative;
      border-radius: 50%;
    }
    .mr-channel-img img {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 0.60s ease;
      filter: saturate(0.78) brightness(0.95);
    }
    .mr-channel-item:hover .mr-channel-img img {
      transform: scale(1.08);
      filter: saturate(1.05) brightness(1);
    }
    /* Gradient overlay — deeper for legibility */
    .mr-channel-img::after {
      content: '';
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at 35% 25%, rgba(255,255,255,0.22), transparent 28%),
        linear-gradient(to top, rgba(5,22,4,0.78) 0%, rgba(5,22,4,0.20) 54%, transparent 78%);
      pointer-events: none;
    }
    /* Title + tag bar pinned to image bottom */
    .mr-channel-name {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(13px, 1.0vw, 15px);
      font-weight: 800;
      color: #fff;
      letter-spacing: -0.01em;
      line-height: 1.2;
      position: absolute;
      bottom: 16px; left: 12px; right: 12px;
      z-index: 2;
      padding: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 7px;
      text-align: center;
      transition: padding-bottom 0.30s ease;
    }
    .mr-channel-item:hover .mr-channel-name { padding-bottom: 4px; }
    .mr-channel-name::after {
      content: '';
      display: block;
      width: 22px;
      height: 2px;
      background: #3d9930;
      border-radius: 2px;
      transition: width 0.35s ease;
    }
    .mr-channel-item:hover .mr-channel-name::after { width: 44px; }

    /* ── Bottom CTA strip ── */
    .mr-cta-strip {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding-top: 40px;
      border-top: 1px solid #e5e7eb;
      gap: 40px;
      flex-wrap: wrap;
    }
    .mr-cta-copy {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(18px, 1.8vw, 24px);
      font-weight: 700;
      color: #111;
      letter-spacing: -0.02em;
      line-height: 1.35;
    }
    .mr-cta-copy span { color: #3d9930; }
    .mr-cta-btn {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      background: #111;
      color: #fff;
      border: none;
      padding: 15px 32px;
      border-radius: 9px;
      font-size: 14px;
      font-weight: 600;
      text-decoration: none;
      letter-spacing: 0.01em;
      transition: all 0.25s ease;
      white-space: nowrap;
      flex-shrink: 0;
    }
    .mr-cta-btn:hover {
      background: #3d9930;
      transform: translateY(-2px);
      box-shadow: 0 12px 32px rgba(61,153,48,0.22);
    }
    .mr-cta-btn svg { flex-shrink: 0; }


    /* ══════════════════════════════════════
       SECTION — PARTNERSHIP VALUE (Less is More)
    ══════════════════════════════════════ */
    #partnership-value {
      background: #f2f9f0 url('../images/integrated-cold-chain.webp') center/cover no-repeat;
      position: relative;
      padding: 160px 20px;
      display: flex;
      justify-content: center;
      align-items: center;
      text-align: center;
      margin-top: -1px;
    }
    #partnership-value::after {
      content: '';
      position: absolute;
      inset: 0;
      background: rgba(242, 249, 240, 0.82);
      z-index: 0;
    }
    .pv-content {
      max-width: 900px;
      position: relative;
      z-index: 1;
    }
    /* Elegant line visual anchor */
    .pv-decorator {
      width: 1px;
      height: 80px;
      background: linear-gradient(to bottom, transparent, #3d9930, transparent);
      margin: 0 auto 40px;
    }
    .pv-title {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(32px, 4vw, 60px);
      font-weight: 900;
      color: #183f12;
      letter-spacing: -0.03em;
      line-height: 1.12;
      margin-bottom: 32px;
    }
    .pv-title span {
      background: linear-gradient(135deg, #3d9930, #24611c);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .pv-subtitle {
      font-size: clamp(16px, 1.4vw, 20px);
      color: #57534e;
      line-height: 1.85;
      font-weight: 700;
      max-width: 680px;
      margin: 0 auto;
    }

    /* Responsive: market-ready */
    @media (max-width: 1439px) {
      .mr-inner { padding: 0 60px 100px; }
    }
    @media (max-width: 1023px) {
      .mr-inner { padding: 0 40px 80px; }
      .mr-inner {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        row-gap: 32px;
      }
      .mr-label {
        grid-column: 1;
        grid-row: 1;
        margin-bottom: 0;
      }
      .mr-headline-block {
        grid-column: 1;
        grid-row: 2;
      }
      .mr-channels {
        grid-column: 1;
        grid-row: 3;
        min-height: 500px;
      }
      .mr-channel-item:nth-child(1) { top: 130px; left: 5%; }
      .mr-channel-item:nth-child(2) { top: 0; left: 38%; }
      .mr-channel-item:nth-child(3) { top: 148px; right: 4%; left: auto; }
      .mr-channel-item:nth-child(4) { top: 300px; left: 8%; }
      .mr-channel-item:nth-child(5) { top: 310px; left: 50%; }
    }
    @media (max-width: 767px) {
      .mr-top-bridge { height: 56px; }
      .mr-top-bridge::after { height: 56px; }
      .mr-inner { padding: 0 24px 64px; }
      .mr-label { padding-top: 52px; margin-bottom: 32px; }
      .mr-channels { min-height: 450px; }
      .mr-channel-item { width: clamp(132px, 38vw, 170px); }
      .mr-channel-item:nth-child(1) { top: 118px; left: 0; }
      .mr-channel-item:nth-child(2) { top: 0; left: 34%; }
      .mr-channel-item:nth-child(3) { top: 126px; right: 0; left: auto; }
      .mr-channel-item:nth-child(4) { top: 266px; left: 3%; }
      .mr-channel-item:nth-child(5) { top: 276px; left: 44%; }
      .mr-cta-strip { flex-direction: column; align-items: flex-start; }

      /* Responsive: Partnership Value */
      #partnership-value { padding: 100px 24px; }
      .pv-decorator { height: 50px; margin-bottom: 28px; }
    }
    @media (max-width: 480px) {
      .mr-channels { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    }

    /* Responsive: processing capabilities */
    @media (max-width: 1439px) {
      .procap-inner { padding: 0 60px 100px; }
    }
    @media (max-width: 1200px) {
      .procap-header {
        grid-template-columns: minmax(0, 1fr) minmax(330px, 0.95fr);
        gap: 48px;
      }
    }
    @media (max-width: 1023px) {
      .procap-inner { padding: 0 40px 80px; }
      .procap-header {
        grid-template-columns: 1fr;
        gap: 40px;
        padding-top: 72px;
        padding-bottom: 72px;
        min-height: 0;
      }
      .procap-header-left { max-width: 680px; }
      .procap-header-right { min-height: 0; }
      .procap-service-bubbles {
        min-height: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 14px;
      }
      .procap-bubble {
        position: static;
        animation: none;
      }
    }
    @media (max-width: 767px) {
      .procap-transition { height: 60px; }
      .procap-transition::after { height: 60px; }
      .procap-inner { padding: 0 20px 72px; }
      .procap-header {
        padding-top: 56px;
        padding-bottom: 20px;
      }
      .procap-bubble {
        width: 100%;
        white-space: normal;
      }
    }

    /* Scale thumbnail images inside plain cards on hover */
    .procap-card.is-plain:hover .procap-card-body > div > img { transform: scale(1.06); }
    @media (max-width: 1200px) {
      .cc-text-panel { padding: 64px 48px; }
    }
    @media (max-width: 1023px) {
      .cc-layout { grid-template-columns: 1fr; }
      .cc-image-panel { min-height: 360px; }
      .cc-text-panel { padding: 64px 40px; }
      .cc-body { max-width: 100%; }
    }
    @media (max-width: 767px) {
      .cc-image-panel { min-height: 280px; }
      .cc-text-panel { padding: 52px 24px; }
      .cc-temp-badge { left: 20px; bottom: 20px; padding: 16px 20px; gap: 12px; }
    }

    /* ══════════════════════════════════════
       SECTION — BUILT FOR GLOBAL PARTNERSHIP
    ══════════════════════════════════════ */
    #global-partnership {
      background: #ffffff url('../images/integrated-partnership-bg.webp') center/cover no-repeat;
      position: relative;
      overflow: hidden;
    }

    /* Dark overlay over background image */
    #global-partnership::before {
      content: '';
      position: absolute;
      inset: 0;
      background: rgba(8, 28, 6, 0.62);
      z-index: 0;
    }

    /* Inner container */
    .gp-inner {
      max-width: 1320px;
      margin: 0 auto;
      padding: 120px 80px 128px;
      position: relative;
      z-index: 1;
    }

    /* ── Top: eyebrow + headline side by side ── */
    .gp-header {
      display: grid;
      grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
      gap: 56px;
      align-items: end;
      padding-bottom: 0;
      border-bottom: none;
      margin-bottom: 0;
    }

    /* Left: eyebrow + H1 */
    .gp-header-left {}
    .gp-eyebrow {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 28px;
    }
    .gp-eyebrow-line {
      width: 24px;
      height: 1px;
      background: #8fd07f;
      flex-shrink: 0;
    }
    .gp-eyebrow-text {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: #8fd07f;
    }
    .gp-h1 {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(36px, 4.5vw, 68px);
      font-weight: 900;
      color: #fff;
      letter-spacing: -0.04em;
      line-height: 1.05;
    }

    /* Right: H2 body copy */
    .gp-header-right {}
    .gp-h2-primary {
      font-size: clamp(15px, 1.25vw, 17px);
      color: rgba(255,255,255,0.82);
      line-height: 1.9;
      margin-bottom: 28px;
      font-weight: 400;
      max-width: 820px;
    }
    .gp-h2-secondary {
      font-size: clamp(14px, 1.1vw, 15.5px);
      color: rgba(255,255,255,0.52);
      line-height: 1.85;
      font-weight: 400;
      padding-top: 24px;
      border-top: 1px solid rgba(255,255,255,0.12);
    }

    /* ── Partner role strip ── */
    .gp-roles {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 0;
      border: 1px solid #e9edef;
      border-radius: 16px;
      overflow: hidden;
      background: #fff;
      margin-bottom: 72px;
    }
    .gp-role-item {
      padding: 36px 32px;
      position: relative;
      transition: background 0.25s ease;
      cursor: default;
    }
    .gp-role-item:hover { background: #f7faf6; }
    .gp-role-item:not(:last-child)::after {
      content: '';
      position: absolute;
      top: 20%; bottom: 20%; right: 0;
      width: 1px;
      background: #e9edef;
    }
    /* Green top accent on hover */
    .gp-role-item::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 2px;
      background: linear-gradient(90deg, #3d9930, #8fd07f);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.35s ease;
      border-radius: 16px 16px 0 0;
    }
    .gp-role-item:hover::before { transform: scaleX(1); }

    .gp-role-icon {
      width: 44px; height: 44px;
      border-radius: 12px;
      background: #f2f9f0;
      border: 1.5px solid #e0f2d8;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 18px;
      transition: all 0.25s ease;
    }
    .gp-role-icon svg { color: #3d9930; }
    .gp-role-item:hover .gp-role-icon {
      background: #3d9930;
      border-color: transparent;
    }
    .gp-role-item:hover .gp-role-icon svg { color: #fff; }
    .gp-role-title {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(15px, 1.2vw, 17px);
      font-weight: 800;
      color: #111;
      letter-spacing: -0.01em;
      line-height: 1.25;
      margin-bottom: 10px;
    }
    .gp-role-desc {
      font-size: 13px;
      color: #9ca3af;
      line-height: 1.7;
    }

    /* ── Bottom: 5 capability tags in a minimal horizontal row ── */
    .gp-capabilities {
      display: flex;
      align-items: center;
      gap: 0;
      border-top: 1px solid #e9edef;
      padding-top: 40px;
      flex-wrap: wrap;
    }
    .gp-cap-item {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 0 28px 0 0;
      margin-right: 28px;
      border-right: 1px solid #e9edef;
      flex-shrink: 0;
    }
    .gp-cap-item:last-child {
      border-right: none;
      padding-right: 0;
      margin-right: 0;
    }
    .gp-cap-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: #3d9930;
      flex-shrink: 0;
    }
    .gp-cap-label {
      font-size: 13px;
      font-weight: 600;
      color: #6b7280;
      letter-spacing: 0.01em;
      white-space: nowrap;
    }

    /* ── CTA Block inside global-partnership ── */
    .gp-cta-block {
      margin-top: 80px;
      padding: 64px 72px;
      background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.14);
      border-radius: 24px;
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 56px;
      position: relative;
      overflow: hidden;
    }
    .gp-cta-block::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 2px;
      background: linear-gradient(90deg, #5fb550, #8fd07f, transparent);
      border-radius: 24px 24px 0 0;
    }
    .gp-cta-block::after {
      content: '';
      position: absolute;
      right: -100px; bottom: -100px;
      width: 320px; height: 320px;
      background: radial-gradient(circle, rgba(143,208,127,0.08) 0%, transparent 65%);
      border-radius: 50%;
      pointer-events: none;
    }
    .gp-cta-text { position: relative; z-index: 1; flex: 1; min-width: 0; }
    .gp-cta-h1 {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(22px, 2.2vw, 32px);
      font-weight: 900;
      color: #fff;
      letter-spacing: -0.025em;
      line-height: 1.18;
      margin-bottom: 16px;
    }
    .gp-cta-h2 {
      font-size: clamp(14px, 1.15vw, 16px);
      color: rgba(255,255,255,0.58);
      line-height: 1.85;
      max-width: 560px;
    }
    .gp-cta-actions {
      display: flex;
      align-items: center;
      gap: 14px;
      flex-shrink: 0;
      flex-wrap: wrap;
      position: relative;
      z-index: 1;
    }
    .gp-cta-btn-primary {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      background: linear-gradient(135deg, #3d9930, #24611c);
      color: #fff;
      padding: 14px 30px;
      border-radius: 10px;
      font-size: 14.5px;
      font-weight: 700;
      text-decoration: none;
      letter-spacing: 0.01em;
      transition: all 0.25s;
      box-shadow: 0 4px 24px rgba(61,153,48,0.38);
      white-space: nowrap;
    }
    .gp-cta-btn-primary:hover {
      transform: translateY(-2px);
      box-shadow: 0 10px 36px rgba(61,153,48,0.52);
    }
    .gp-cta-btn-secondary {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: rgba(255,255,255,0.08);
      border: 1.5px solid rgba(255,255,255,0.20);
      color: rgba(255,255,255,0.82);
      padding: 13px 28px;
      border-radius: 10px;
      font-size: 14.5px;
      font-weight: 600;
      text-decoration: none;
      letter-spacing: 0.01em;
      transition: all 0.25s;
      white-space: nowrap;
    }
    .gp-cta-btn-secondary:hover {
      background: rgba(255,255,255,0.14);
      border-color: rgba(255,255,255,0.38);
      transform: translateY(-2px);
    }

    /* Responsive: global partnership */
    @media (max-width: 1439px) {
      .gp-inner { padding: 100px 60px 110px; }
    }
    @media (max-width: 1023px) {
      .gp-inner { padding: 80px 40px 90px; }
      .gp-header { grid-template-columns: 1fr; gap: 32px; }
      .gp-cta-block { flex-direction: column; align-items: flex-start; gap: 36px; padding: 48px 44px; }
    }
    @media (max-width: 767px) {
      .gp-inner { padding: 64px 24px 72px; }
      .gp-cta-block { padding: 36px 28px; margin-top: 56px; }
      .gp-cta-actions { flex-direction: column; align-items: stretch; width: 100%; }
      .gp-cta-btn-primary, .gp-cta-btn-secondary { justify-content: center; }
    }

    /* ══════════════════════════════════════
       FOOTER
    ══════════════════════════════════════ */
    #footer {
      background: #0f2a0b;
      padding: 80px 120px 40px;
    }
    .footer-grid {
      display: grid;
      grid-template-columns: 2fr 1fr 1fr 1.5fr;
      gap: 60px;
      margin-bottom: 60px;
      border-bottom: 1px solid rgba(255,255,255,0.08);
      padding-bottom: 60px;
    }
    .footer-brand h2 {
      font-family: 'Outfit', sans-serif;
      font-size: 24px;
      font-weight: 800;
      color: #fff;
      letter-spacing: -0.01em;
    }
    .footer-brand h2 span { color: #5fb550; }
    .footer-brand p {
      margin-top: 16px;
      font-size: 14px;
      color: rgba(255,255,255,0.5);
      line-height: 1.8;
      max-width: min(300px, 100%);
    }
    .footer-socials { display: flex; gap: 12px; margin-top: 28px; }
    .social-btn {
      width: 40px; height: 40px;
      background: rgba(255,255,255,0.08);
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: rgba(255,255,255,0.6);
      cursor: pointer;
      transition: all 0.25s;
      border: 1px solid rgba(255,255,255,0.1);
    }
    .social-btn:hover {
      background: #3d9930;
      color: #fff;
      border-color: #3d9930;
      transform: translateY(-2px);
    }
    .footer-col h4 {
      font-size: 13px;
      font-weight: 700;
      color: rgba(255,255,255,0.9);
      letter-spacing: 0.08em;
      text-transform: uppercase;
      margin-bottom: 20px;
    }
    .footer-col ul { list-style: none; }
    .footer-col ul li { margin-bottom: 12px; }
    .footer-col ul li a {
      font-size: 14px;
      color: rgba(255,255,255,0.45);
      text-decoration: none;
      transition: color 0.2s;
    }
    .footer-col ul li a:hover { color: #5fb550; }
    .footer-contact-item {
      display: flex;
      gap: 12px;
      align-items: flex-start;
      margin-bottom: 16px;
    }
    .footer-contact-item .icon { color: #5fb550; flex-shrink: 0; margin-top: 2px; }
    .footer-contact-item span { font-size: 14px; color: rgba(255,255,255,0.45); line-height: 1.6; }
    .footer-bottom { display: flex; justify-content: space-between; align-items: center; }
    .footer-bottom p { font-size: 13px; color: rgba(255,255,255,0.3); }
    .footer-bottom a {
      font-size: 13px;
      color: rgba(255,255,255,0.3);
      text-decoration: none;
      margin-left: 24px;
      transition: color 0.2s;
    }
    .footer-bottom a:hover { color: rgba(255,255,255,0.7); }

    /* ══════════════════════════════════════
       RESPONSIVE
    ══════════════════════════════════════ */
    @media (max-width: 1439px) {
      .nav-inner { padding: 20px 60px; }
      #page-hero .page-hero-content { padding: 0 60px 80px; }
      .masonry-section-header { padding: 80px 60px 60px; }
      .mc-cta-card { padding: 60px 60px; }
      #footer { padding: 72px 60px 36px; }
    }
    @media (max-width: 1200px) {
      .pillar-text-panel { width: 38%; padding: 56px 44px; }
    }
    @media (max-width: 1023px) {
      .nav-inner { padding: 16px 40px; }
      .nav-links-desktop { display: none; }
      #mobile-menu-btn { display: flex; }
      #page-hero .page-hero-content { padding: 0 40px 64px; }
      .masonry-section-header { padding: 64px 40px 52px; }
      .pillar-text-panel { width: 46%; padding: 48px 36px; min-width: 280px; }
      .mc-cta-card { padding: 52px 40px; flex-direction: column; align-items: flex-start; gap: 32px; }
      #footer { padding: 64px 40px 32px; }
      .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
    }
    @media (max-width: 767px) {
      .nav-inner { padding: 14px 20px; }
      #page-hero { height: 420px; }
      #page-hero .page-hero-content { padding: 0 20px 52px; }
      .masonry-section-header { padding: 52px 20px 44px; }
      /* Stack pillar rows on mobile: text panel becomes full-width overlay at bottom */
      .pillar-row { min-height: 520px; align-items: flex-end; }
      .pillar-text-panel {
        width: 100% !important;
        min-width: 0;
        margin: 0 !important;
        padding: 36px 24px 44px;
      }
      .pillar-row.text-right .pillar-text-panel::after,
      .pillar-row.text-left .pillar-text-panel::after {
        top: 0; bottom: auto; left: 0; right: 0;
        width: auto; height: 3px;
      }
      .mc-cta-card { padding: 44px 24px; flex-direction: column; align-items: flex-start; gap: 28px; }
      .hero-badges { gap: 10px; }
      #footer { padding: 56px 20px 28px; }
      .footer-grid { grid-template-columns: 1fr; gap: 36px; }
      .footer-bottom { flex-direction: column; gap: 16px; text-align: center; }
      .footer-bottom div { display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; }
      .footer-bottom a { margin-left: 0; }
    }

    /* CMS port: the exported Our Platform section has no card grid, so remove the empty bottom area. */
    #category-spotlight {
      padding-bottom: 72px;
    }
    #category-spotlight .cs-header {
      padding-bottom: 0;
    }
    #category-spotlight .cs-blob-bottom {
      display: none;
    }