/* =========================================================
   CONTRACT MANUFACTURING PAGE ONLY
   IMPORTANT:
   - NO .site-header rules
   - NO .navbar rules
   - NO .brand rules
   - NO .nav-links rules
   - NO .menu-toggle rules
   Header / footer remain controlled by assets/css/style.css
========================================================= */

:root{
  --cmx-white:#ffffff;
  --cmx-soft:#ecf8e7;
  --cmx-soft-2:#f6fbf3;
  --cmx-green:#2f8737;
  --cmx-green-2:#4f9847;
  --cmx-green-dark:#0d5b31;
  --cmx-green-deep:#094a29;
  --cmx-text:#152019;
  --cmx-muted:#59675f;
  --cmx-border:rgba(59,102,61,.14);
  --cmx-shadow:0 16px 42px rgba(40,75,42,.075);
}

.cmx-page{
  width:100%;
  padding:18px 22px 70px;
  overflow:hidden;
  color:var(--cmx-text);
  background:#fff;
  font-family:"DM Sans",sans-serif;
}


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

.cmx-hero{
  position:relative;
  width:min(1420px,100%);
  min-height:690px;
  margin:0 auto;
  overflow:hidden;
  border-radius:28px;
  background:
    radial-gradient(circle at 14% 30%,rgba(196,232,184,.37),transparent 36%),
    linear-gradient(120deg,#f9fcf7 0%,#fff 49%,#edf8e9 100%);
}

.cmx-hero__copy{
  position:relative;
  z-index:5;
  width:54%;
  padding:100px 48px 120px 58px;
}

.cmx-kicker{
  width:max-content;
  max-width:100%;
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:34px;
  padding:7px 15px;
  border:1px solid #dce9d9;
  border-radius:999px;
  background:rgba(255,255,255,.82);
  color:#2d8136;
  font-size:12px;
  font-weight:700;
  letter-spacing:1.15px;
}

.cmx-kicker__icon{
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  color:#2c8134;
}

.cmx-hero h1{
  max-width:610px;
  margin:36px 0 0;
  color:var(--cmx-text);
  font-size:66px;
  font-weight:700;
  line-height:.98;
  letter-spacing:-2.8px;
}

.cmx-hero h1 span{
  display:block;
  color:var(--cmx-green);
}

.cmx-title-line{
  width:48px;
  height:2px;
  margin-top:27px;
  background:#4f9847;
}

.cmx-hero__copy > p{
  max-width:550px;
  margin:27px 0 0;
  color:var(--cmx-muted);
  font-size:14px;
  line-height:1.75;
}


/* HERO FEATURE BOX */

.cmx-hero-features{
  width:min(700px,100%);
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:31px;
  overflow:hidden;
  border:1px solid #e0e9df;
  border-radius:20px;
  background:rgba(255,255,255,.92);
  box-shadow:0 15px 32px rgba(28,75,36,.065);
}

.cmx-hero-features article{
  min-height:117px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:15px 9px;
  border-right:1px solid #e2eae0;
  text-align:center;
}

.cmx-hero-features article:last-child{
  border-right:0;
}

.cmx-hero-features article > span{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#eef7ea;
  color:#2f8737;
  font-size:21px;
}

.cmx-hero-features strong{
  color:#25342b;
  font-size:12px;
  line-height:1.3;
}


/* HERO IMAGE */

.cmx-hero__media{
  position:absolute;
  z-index:2;
  top:0;
  right:0;
  width:56%;
  height:100%;
  overflow:hidden;
  clip-path:polygon(
    28% 0,
    100% 0,
    100% 100%,
    32% 100%,
    22% 88%,
    11% 70%,
    3% 51%,
    7% 30%,
    18% 11%
  );
}

.cmx-hero__media::before{
  content:"";
  position:absolute;
  z-index:3;
  left:5.5%;
  top:-2%;
  width:10px;
  height:105%;
  background:linear-gradient(#83c675,#e5f3e0,#79bd6c);
  transform:rotate(11deg);
}

.cmx-hero__media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  opacity: 0.6;
}


/* HERO BADGE */

.cmx-hero-badge{
  position:absolute;
  z-index:6;
  right:0;
  bottom:165px;
  width:410px;
  min-height:124px;
  display:grid;
  grid-template-columns:60px 1fr;
  align-items:center;
  gap:17px;
  padding:20px 62px 20px 23px;
  border-radius:24px 0 0 24px;
  background:linear-gradient(100deg,#11612c,#31913b);
  color:#fff;
  box-shadow:0 16px 34px rgba(9,74,31,.18);
}

.cmx-hero-badge__icon{
  width:56px;
  height:56px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.42);
  border-radius:16px;
  font-size:25px;
}

.cmx-hero-badge strong{
  display:block;
  font-size:15px;
  line-height:1.42;
}

.cmx-badge-dots{
  position:absolute;
  right:20px;
  top:34px;
  width:38px;
  height:45px;
  opacity:.28;
  background-image:radial-gradient(#fff 2px,transparent 2px);
  background-size:11px 11px;
}


/* DOT PATTERN */

.cmx-dot-pattern{
  position:absolute;
  z-index:4;
  top:90px;
  left:40.5%;
  width:112px;
  height:112px;
  opacity:.66;
  background-image:radial-gradient(#a9cea2 3px,transparent 3px);
  background-size:20px 20px;
}


/* BOTTOM WAVE */

.cmx-bottom-wave{
  position:absolute;
  z-index:3;
  left:-4%;
  right:-4%;
  bottom:-117px;
  height:205px;
  border-top:2px solid #76ba68;
  border-radius:50% 50% 0 0 / 55% 55% 0 0;
  background:linear-gradient(
    12deg,
    rgba(225,243,218,.97),
    rgba(142,200,123,.54)
  );
  transform:rotate(2deg);
}


/* LEAF DECOR */

.cmx-leaf-decor{
  position:absolute;
  z-index:7;
  left:20px;
  bottom:7px;
  width:85px;
  height:80px;
}

.cmx-leaf-decor span{
  position:absolute;
  bottom:0;
  width:26px;
  height:52px;
  border-radius:100% 0 100% 0;
  background:linear-gradient(145deg,#79bc61,#2e8137);
  transform-origin:bottom;
}

.cmx-leaf-decor span:nth-child(1){
  left:30px;
  transform:rotate(-7deg);
}

.cmx-leaf-decor span:nth-child(2){
  left:7px;
  transform:rotate(-52deg);
}

.cmx-leaf-decor span:nth-child(3){
  left:53px;
  transform:rotate(39deg);
}


/* =========================================================
   COMMON PAGE SECTIONS
========================================================= */

.cmx-section{
  width:min(1320px,calc(100% - 44px));
  margin:28px auto 0;
}

.cmx-section-heading{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin-bottom:24px;
}

.cmx-section-heading > span{
  width:82px;
  height:1px;
  background:#bad5b4;
}

.cmx-section-heading h2{
  margin:0;
  color:#26342c;
  font-size:25px;
  font-weight:700;
  text-align:center;
}


/* =========================================================
   HIGHLIGHTS
========================================================= */

.cmx-highlights{
  padding:27px 22px 20px;
  border:1px solid var(--cmx-border);
  border-radius:22px;
  background:#fff;
  box-shadow:0 10px 32px rgba(44,79,45,.045);
}

.cmx-highlights-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
}

.cmx-highlight{
  min-height:245px;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:17px 16px;
  border-right:1px solid rgba(63,107,64,.10);
  text-align:center;
}

.cmx-highlight:last-child{
  border-right:0;
}

.cmx-highlight__icon{
  width:63px;
  height:63px;
  display:grid;
  place-items:center;
  border:1px solid #d5e6d1;
  border-radius:50%;
  background:#eff7eb;
  color:var(--cmx-green-dark);
  font-size:24px;
}

.cmx-highlight h3{
  max-width:175px;
  margin:16px 0 0;
  color:#29372f;
  font-size:14px;
  font-weight:700;
  line-height:1.3;
}

.cmx-highlight h3::after{
  content:"";
  display:block;
  width:28px;
  height:2px;
  margin:9px auto 0;
  background:#74aa69;
}

.cmx-highlight p{
  max-width:185px;
  margin:10px 0 0;
  color:#5a6961;
  font-size:12px;
  line-height:1.6;
}


/* =========================================================
   PARTNERSHIP STRIP
========================================================= */

.cmx-partner{
  min-height:165px;
  display:grid;
  grid-template-columns:135px 1fr 430px;
  align-items:center;
  gap:22px;
  overflow:hidden;
  border:1px solid var(--cmx-border);
  border-radius:22px;
  background:
    radial-gradient(circle at 8% 50%,rgba(182,228,166,.18),transparent 28%),
    #fff;
}

.cmx-partner__icon{
  width:96px;
  height:96px;
  display:grid;
  place-items:center;
  margin-left:23px;
  border-radius:50%;
  background:linear-gradient(145deg,#196a34,#0b4f2a);
  color:#fff;
  font-size:38px;
  box-shadow:0 12px 28px rgba(14,85,41,.13);
}

.cmx-partner__copy p{
  margin:0;
  color:#536159;
  font-size:12px;
  line-height:1.7;
}

.cmx-partner__image{
  height:165px;
  overflow:hidden;
  border-radius:100px 0 0 100px;
}

.cmx-partner__image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}


/* =========================================================
   CAPACITY
========================================================= */

.cmx-capacity-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
}

.cmx-capacity-card{
  overflow:hidden;
  border:1px solid var(--cmx-border);
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 26px rgba(44,79,45,.04);
}

.cmx-capacity-head{
  min-height:45px;
  display:grid;
  grid-template-columns:1fr 180px;
  align-items:center;
  padding:0 18px;
  background:linear-gradient(90deg,#2f8436,#17632f);
  color:#fff;
  font-size:12px;
  font-weight:700;
  text-transform:uppercase;
}

.cmx-capacity-head span:last-child{
  text-align:right;
}

.cmx-capacity-row{
  min-height:46px;
  display:grid;
  grid-template-columns:1fr 145px;
  align-items:center;
  gap:10px;
  padding:0 17px;
  border-bottom:1px solid #edf1ec;
}

.cmx-capacity-row > span{
  display:flex;
  align-items:center;
  gap:10px;
  color:#37453c;
  font-size:12px;
}

.cmx-capacity-row i{
  width:18px;
  color:var(--cmx-green);
  text-align:center;
}

.cmx-capacity-row strong{
  color:#213128;
  font-size:12px;
  font-weight:600;
  text-align:right;
}

.cmx-capacity-image{
  height:190px;
  overflow:hidden;
}

.cmx-capacity-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}


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

.cmx-trust{
  min-height:105px;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  align-items:center;
  overflow:hidden;
  border:1px solid var(--cmx-border);
  border-radius:18px;
  background:linear-gradient(90deg,#fafcf8,#f0f8ed,#fafcf8);
}

.cmx-trust article{
  min-height:72px;
  display:grid;
  grid-template-columns:46px 1fr;
  align-items:center;
  gap:10px;
  padding:10px 16px;
  border-right:1px solid rgba(64,109,66,.10);
}

.cmx-trust article:last-child{
  border-right:0;
}

.cmx-trust i{
  color:var(--cmx-green-dark);
  font-size:26px;
}

.cmx-trust span{
  color:#35443a;
  font-size:12px;
  font-weight:600;
  line-height:1.4;
}


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

.cmx-cta{
  min-height:165px;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:26px;
  padding:24px 34px;
  border-radius:22px;
  background:
    radial-gradient(circle at 10% 50%,rgba(161,215,107,.14),transparent 25%),
    linear-gradient(105deg,#075b32,#0c6a38);
  color:#fff;
}

.cmx-cta__left{
  display:grid;
  grid-template-columns:90px 1fr;
  align-items:center;
  gap:19px;
}

.cmx-cta__icon{
  width:80px;
  height:80px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid rgba(255,255,255,.36);
  border-radius:50%;
  color:#b4dc80;
  font-size:20px;
}

.cmx-cta h2{
  margin:0;
  font-size:27px;
  font-weight:700;
}

.cmx-cta p{
  max-width:570px;
  margin:9px 0 0;
  color:rgba(255,255,255,.82);
  font-size:12px;
  line-height:1.6;
}

.cmx-cta__button{
  min-height:53px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:0 23px;
  border-radius:12px;
  background:#fff;
  color:var(--cmx-green-dark);
  font-size:12px;
  font-weight:700;
  text-decoration:none;
  transition:transform .25s ease,box-shadow .25s ease;
}

.cmx-cta__button:hover{
  color:var(--cmx-green-dark);
  transform:translateY(-2px);
  box-shadow:0 12px 25px rgba(0,0,0,.14);
}


/* =========================================================
   REVEAL
========================================================= */

.cmx-reveal{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .65s ease,transform .65s ease;
}

.cmx-reveal.cmx-visible{
  opacity:1;
  transform:none;
}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:1100px){

  .cmx-hero h1{
    font-size:55px;
  }

  .cmx-partner{
    grid-template-columns:125px 1fr 330px;
  }
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:900px){

  .cmx-page{
    padding:12px 12px 55px;
  }

  .cmx-hero{
    display:flex;
    flex-direction:column;
    min-height:0;
    border-radius:22px;
  }

  .cmx-hero__copy{
    width:100%;
    padding:85px 25px 30px;
    text-align:center;
  }

  .cmx-kicker{
    margin:0 auto;
  }

  .cmx-hero h1{
    max-width:650px;
    margin-left:auto;
    margin-right:auto;
  }

  .cmx-title-line{
    margin-left:auto;
    margin-right:auto;
  }

  .cmx-hero__copy > p{
    max-width:650px;
    margin-left:auto;
    margin-right:auto;
  }

  .cmx-hero__media{
    position:relative;
    order:3;
    width:100%;
    height:490px;
    clip-path:none;
  }

  .cmx-hero__media::before{
    display:none;
  }

  .cmx-hero-badge{
    z-index:7;
    bottom:28px;
    width:min(92%,410px);
  }

  .cmx-dot-pattern,
  .cmx-bottom-wave,
  .cmx-leaf-decor{
    display:none;
  }

  .cmx-section{
    width:100%;
  }

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

  .cmx-highlight:nth-child(even){
    border-right:0;
  }

  .cmx-highlight{
    border-bottom:1px solid rgba(63,107,64,.10);
  }

  .cmx-highlight:last-child{
    grid-column:1/-1;
    border-bottom:0;
  }

  .cmx-partner{
    grid-template-columns:115px 1fr;
    padding:18px;
  }

  .cmx-partner__icon{
    margin-left:0;
  }

  .cmx-partner__image{
    grid-column:1/-1;
    height:280px;
    border-radius:18px;
  }

  .cmx-capacity-grid{
    grid-template-columns:1fr;
  }

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

  .cmx-trust article:nth-child(even){
    border-right:0;
  }

  .cmx-trust article:last-child{
    grid-column:1/-1;
  }

  .cmx-cta{
    grid-template-columns:1fr;
    text-align:center;
  }

  .cmx-cta__left{
    justify-items:center;
  }

  .cmx-cta__button{
    justify-self:center;
  }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media(max-width:620px){

  .cmx-page{
    padding:8px 8px 45px;
  }

  .cmx-hero__copy{
    padding:85px 18px 28px;
  }

  .cmx-kicker{
    font-size:12px;
  }

  .cmx-hero h1{
    font-size:40px;
    line-height:1.03;
    letter-spacing:-1.4px;
  }

  .cmx-hero__copy > p{
    font-size:13px;
    line-height:1.7;
  }

  .cmx-hero-features{
    grid-template-columns:repeat(2,1fr);
  }

  .cmx-hero-features article:nth-child(2){
    border-right:0;
  }

  .cmx-hero-features article:nth-child(-n+2){
    border-bottom:1px solid #e2eae0;
  }

  .cmx-hero__media{
    height:375px;
  }

  .cmx-hero-badge{
    right:0;
    bottom:18px;
    width:94%;
    min-height:105px;
    grid-template-columns:48px 1fr;
    padding:17px 45px 17px 18px;
  }

  .cmx-hero-badge__icon{
    width:46px;
    height:46px;
    font-size:20px;
  }

  .cmx-hero-badge strong{
    font-size:12px;
  }

  .cmx-section-heading > span{
    width:35px;
  }

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

  .cmx-highlights{
    padding:24px 14px 17px;
  }

  .cmx-highlights-grid{
    grid-template-columns:1fr;
  }

  .cmx-highlight,
  .cmx-highlight:nth-child(even){
    min-height:auto;
    border-right:0;
  }

  .cmx-highlight:last-child{
    grid-column:auto;
  }

  .cmx-partner{
    grid-template-columns:1fr;
    text-align:center;
  }

  .cmx-partner__icon{
    margin:0 auto;
  }

  .cmx-capacity-head{
    grid-template-columns:1fr 108px;
    padding:0 12px;
    font-size:12px;
  }

  .cmx-capacity-row{
    grid-template-columns:1fr 92px;
    padding:0 11px;
  }

  .cmx-capacity-row > span,
  .cmx-capacity-row strong{
    font-size:12px;
  }

  .cmx-trust{
    grid-template-columns:1fr;
  }

  .cmx-trust article,
  .cmx-trust article:nth-child(even){
    border-right:0;
    border-bottom:1px solid rgba(64,109,66,.10);
  }

  .cmx-trust article:last-child{
    grid-column:auto;
    border-bottom:0;
  }

  .cmx-cta{
    padding:28px 18px;
  }

  .cmx-cta__left{
    grid-template-columns:1fr;
  }

  .cmx-cta h2{
    font-size:23px;
  }
}


/* Accessibility */
@media(prefers-reduced-motion:reduce){
  .cmx-reveal{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
}
