/* CTN-PROD-REFINE-001 — Products Page visual compression and layout polish.
   Scoped exclusively to .prod001-page and adjacent Products Page sections. */

.prod001-page .prod001-hero{
  min-height:430px;
  grid-template-columns:minmax(0,.9fr) minmax(430px,1.1fr);
  gap:34px;
  padding:48px clamp(24px,5.2vw,72px);
}
.prod001-page .prod001-hero-copy{max-width:620px}
.prod001-page .prod001-hero h1{
  max-width:600px;
  font-size:clamp(42px,4.6vw,64px);
  line-height:.98;
  letter-spacing:-1px;
  margin-bottom:16px;
}
.prod001-page .prod001-hero p{font-size:16.5px;line-height:1.52;max-width:610px}
.prod001-page .prod001-actions{margin-top:22px;gap:10px}
.prod001-page .prod001-actions .btn{min-height:44px;padding:12px 16px;font-size:12px}
.prod001-page .prod001-hero-mosaic{min-height:330px;gap:9px}
.prod001-page .prod001-hero-mosaic img{min-height:158px;border-radius:14px;box-shadow:0 12px 26px rgba(0,0,0,.2)}
.prod001-page .prod001-hero-mosaic img:first-child{border-radius:24px 14px 14px 14px}
.prod001-page .prod001-hero-mosaic img:last-child{border-radius:14px 14px 24px 14px}

.prod001-page + .rd-footer{margin-top:0}
.prod001-page .prod001-path-nav,
.prod001-path-nav{
  padding:12px 24px;
  gap:10px;
}
.prod001-path-nav a{min-height:36px;padding:9px 16px;font-size:11.5px}

.prod001-page .prod001-group{
  padding-top:48px!important;
  padding-bottom:50px!important;
  scroll-margin-top:118px;
}
.prod001-page .prod001-group-head{max-width:900px;margin-bottom:24px}
.prod001-page .prod001-group-head .eyebrow{margin-bottom:8px}
.prod001-page .prod001-group-head h2{
  max-width:900px;
  margin:0 auto 11px;
  font-size:clamp(30px,3.45vw,44px);
  line-height:1.02;
  letter-spacing:-.35px;
}
.prod001-page .prod001-group-head>p:not(.eyebrow){font-size:15px;line-height:1.52;max-width:820px}

.prod001-page .prod001-grid{gap:17px;max-width:1220px}
.prod001-page .prod001-card{border-radius:14px;box-shadow:0 9px 22px rgba(27,52,35,.07)}
.prod001-page .prod001-card:hover{transform:translateY(-2px);box-shadow:0 15px 30px rgba(27,52,35,.12)}
.prod001-page .prod001-card img{height:190px}
.prod001-page .prod001-card-wide img{height:225px}
.prod001-page .prod001-card-body{padding:17px 17px 18px}
.prod001-page .prod001-tag{padding:5px 8px;font-size:9px;margin-bottom:9px}
.prod001-page .prod001-card h3{
  font-size:clamp(18px,1.55vw,23px);
  line-height:1.08;
  min-height:2.16em;
  margin-bottom:8px;
}
.prod001-page .prod001-card-wide h3{font-size:25px;min-height:0}
.prod001-page .prod001-card p{font-size:13.7px;line-height:1.5;margin-bottom:15px}
.prod001-page .prod001-link{min-height:35px;padding:8px 11px;font-size:10.5px;border-radius:6px}

.prod001-page .prod001-route{
  gap:16px;
  padding:42px clamp(22px,5.5vw,72px);
}
.prod001-page .prod001-route-card{padding:24px 26px;border-radius:16px}
.prod001-page .prod001-route-card span{font-size:10px;margin-bottom:7px}
.prod001-page .prod001-route-card h2{
  font-size:clamp(24px,2.7vw,34px);
  line-height:1.03;
  margin-bottom:10px;
}
.prod001-page .prod001-route-card p{font-size:14px;line-height:1.5;margin-bottom:17px;max-width:620px}
.prod001-page .prod001-route-card .btn{min-height:42px;padding:11px 15px;font-size:11.5px}

.prod001-page .prod001-role{
  max-width:none;
  padding:38px clamp(24px,8vw,120px)!important;
  border-top:1px solid rgba(97,70,28,.1);
}
.prod001-page .prod001-role>div{max-width:980px;margin:0 auto;padding:25px 28px;border-radius:16px;background:#fffaf0;border:1px solid rgba(97,70,28,.14);box-shadow:0 8px 22px rgba(27,52,35,.055)}
.prod001-page .prod001-role .eyebrow{margin-bottom:7px}
.prod001-page .prod001-role h2{font-size:clamp(28px,3vw,40px);line-height:1.04;margin-bottom:10px}
.prod001-page .prod001-role p{font-size:14.5px;line-height:1.55;max-width:900px}

@media(max-width:1100px){
  .prod001-page .prod001-hero{grid-template-columns:1fr 1fr;min-height:390px;padding-top:44px;padding-bottom:44px}
  .prod001-page .prod001-hero h1{font-size:clamp(40px,5.2vw,55px)}
  .prod001-page .prod001-hero-mosaic{min-height:300px}
  .prod001-page .prod001-card img{height:185px}
}

@media(max-width:880px){
  .prod001-page .prod001-hero{grid-template-columns:1fr;gap:24px}
  .prod001-page .prod001-hero-copy{max-width:760px}
  .prod001-page .prod001-hero h1{max-width:760px}
  .prod001-page .prod001-hero-mosaic{min-height:310px}
  .prod001-page .prod001-group{padding-left:24px!important;padding-right:24px!important}
}

@media(max-width:620px){
  .prod001-page .prod001-hero{padding:34px 17px;gap:20px}
  .prod001-page .prod001-hero h1{font-size:35px;line-height:1.01;margin-bottom:12px}
  .prod001-page .prod001-hero p{font-size:15px;line-height:1.48}
  .prod001-page .prod001-actions{margin-top:17px}
  .prod001-page .prod001-hero-mosaic{min-height:250px}
  .prod001-page .prod001-hero-mosaic img{min-height:120px}
  .prod001-path-nav{padding:9px 12px}
  .prod001-path-nav a{min-height:34px;padding:8px 13px;font-size:10.5px}
  .prod001-page .prod001-group{padding:36px 16px!important}
  .prod001-page .prod001-group-head{margin-bottom:19px;text-align:left}
  .prod001-page .prod001-group-head h2{font-size:28px;margin-bottom:9px}
  .prod001-page .prod001-group-head>p:not(.eyebrow){font-size:14px}
  .prod001-page .prod001-grid{gap:14px}
  .prod001-page .prod001-card img,.prod001-page .prod001-card-wide img{height:190px}
  .prod001-page .prod001-card-body{padding:16px}
  .prod001-page .prod001-card h3,.prod001-page .prod001-card-wide h3{font-size:21px;min-height:0}
  .prod001-page .prod001-card p{font-size:13.5px;margin-bottom:13px}
  .prod001-page .prod001-route{padding:34px 16px;gap:13px}
  .prod001-page .prod001-route-card{padding:20px 18px}
  .prod001-page .prod001-route-card h2{font-size:26px}
  .prod001-page .prod001-role{padding:32px 16px!important;text-align:left}
  .prod001-page .prod001-role>div{padding:21px 18px}
  .prod001-page .prod001-role h2{font-size:28px}
}

/* CTN-PROD-REFINE-v02 — controlled final polish.
   No structure, content, routes, shared components, or protected systems changed. */
@media (min-width:881px){
  .prod001-page .prod001-hero{
    min-height:410px;
    grid-template-columns:minmax(0,.86fr) minmax(450px,1.14fr);
    gap:32px;
    padding-top:44px;
    padding-bottom:44px;
  }
  .prod001-page .prod001-hero h1{
    max-width:560px;
    font-size:clamp(40px,4.25vw,59px);
    line-height:1;
    letter-spacing:-.8px;
  }
  .prod001-page .prod001-hero-mosaic{min-height:318px}
  .prod001-page .prod001-hero-mosaic img{min-height:152px}
}

.prod001-path-nav a{
  font-size:12px;
  font-weight:750;
  letter-spacing:.045em;
  color:#164b33;
  border-color:rgba(22,75,51,.25);
  background:rgba(255,255,255,.92);
}
.prod001-path-nav a:hover,
.prod001-path-nav a:focus-visible{
  border-color:#17613f;
  background:#fff;
}

.prod001-page .prod001-card-body{
  display:flex;
  flex-direction:column;
  height:100%;
}
.prod001-page .prod001-card p{
  font-size:14.15px;
  line-height:1.52;
}
.prod001-page .prod001-link{margin-top:auto;align-self:flex-start}

.prod001-page #agriculture-pathway{
  padding-left:clamp(20px,4vw,48px)!important;
  padding-right:clamp(20px,4vw,48px)!important;
}
.prod001-page #agriculture-pathway .prod001-grid{max-width:1140px}

.prod001-page #carbon-pathway .prod001-group-head{margin-bottom:21px}

.prod001-page .prod001-route{align-items:stretch}
.prod001-page .prod001-route-card{display:flex}
.prod001-page .prod001-route-card>div{
  display:flex;
  flex-direction:column;
  width:100%;
}
.prod001-page .prod001-route-card .btn{margin-top:auto;align-self:flex-start}

@media(max-width:620px){
  .prod001-path-nav a{font-size:10.8px;letter-spacing:.03em}
  .prod001-page .prod001-card p{font-size:13.8px}
  .prod001-page #agriculture-pathway{padding-left:16px!important;padding-right:16px!important}
}

/* CTN-PROD-REFINE-v03 — bilingual route-card visibility correction.
   Preserve a flex layout only for the currently active language block. */
.prod001-page .prod001-route-card > .lang-id-content{
  display:none;
}
.prod001-page .prod001-route-card > .lang-en-content{
  display:flex;
}
html[lang="id"] .prod001-page .prod001-route-card > .lang-en-content{
  display:none!important;
}
html[lang="id"] .prod001-page .prod001-route-card > .lang-id-content{
  display:flex!important;
}
/* Cocopot public card — real, buyer-safe product visual */
.cocopot-product-card{border-color:rgba(23,75,45,.28);box-shadow:0 20px 46px rgba(23,61,39,.12)}
.cocopot-product-card .prod001-image-link{background:#0b3b27;position:relative}
.cocopot-product-card .prod001-image-link:after{content:"CURRENT OPPORTUNITY";position:absolute;left:18px;top:18px;background:#0b3b27;color:#f0bd4e;border:1px solid rgba(240,189,78,.35);font-size:10px;font-weight:900;letter-spacing:.12em;padding:8px 10px;border-radius:999px}
.cocopot-product-card .prod001-image-link img{object-position:center 30%}
