/*
 * FoodX / Shaktisarvo "Grown in Nalanda" credentials section.
 * Rendered by the foodx/credentials block in templates/front-page.html.
 * fx-cred- prefix throughout: .fx-trust-* belongs to the hero strip and
 * .fx-stat / .fx-panel to the split section.
 */

.fx-cred{
  box-sizing:border-box;
  font-family:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  padding:8px 0 64px;
}
/* The theme doesn't set a global border-box, so padding was being added on
 * top of width:calc(100% - 40px) and pushing the card past the viewport. */
.fx-cred *{ box-sizing:border-box; }
.fx-cred-in{
  box-sizing:border-box;
  max-width:1360px; width:calc(100% - 40px); margin:0 auto;
  position:relative; overflow:hidden;
  background:linear-gradient(150deg,#1B4D3E 0%,#20563F 40%,#2E7350 100%);
  border-radius:28px; padding:60px 60px 56px;
}
/* Soft light from the top-right, matching the other dark panels. */
.fx-cred-in::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(70% 60% at 92% 4%,rgba(159,232,112,.18) 0%,rgba(159,232,112,0) 60%);
}
.fx-cred-in > *{ position:relative; }

/* ---------------- top row ---------------- */
.fx-cred-top{
  display:grid; grid-template-columns:1fr 1fr; gap:48px;
  align-items:start; margin-bottom:40px;
}

.fx-cred-pill{
  display:inline-flex; align-items:center; gap:7px; margin:0 0 20px;
  background:rgba(255,255,255,.1); color:#9FE870;
  border:1px solid rgba(159,232,112,.35); border-radius:999px;
  padding:7px 14px; font-size:11px; font-weight:800; letter-spacing:.1em;
}

.fx-cred-title{
  margin:0 0 16px;
  font-family:'Bricolage Grotesque',-apple-system,BlinkMacSystemFont,sans-serif;
  font-weight:800; font-size:34px; line-height:1.15; color:#fff;
}
.fx-cred-title span{ display:block; }

.fx-cred-lede{
  margin:0 0 24px; font-size:14.5px; line-height:1.7;
  color:rgba(255,255,255,.78); max-width:480px;
}

.fx-cred-licence{
  display:inline-flex; align-items:center; gap:12px; margin:0;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16);
  border-radius:14px; padding:12px 18px 12px 12px;
}
.fx-cred-licence-icon{
  width:38px; height:38px; border-radius:10px; flex:none;
  background:rgba(159,232,112,.14);
  display:flex; align-items:center; justify-content:center;
}
.fx-cred-licence-text{ display:flex; flex-direction:column; gap:1px; }
.fx-cred-licence-label{
  font-size:10px; font-weight:700; letter-spacing:.1em;
  color:rgba(255,255,255,.55);
}
.fx-cred-licence-no{ font-size:14px; font-weight:800; color:#fff; }

/* ---------------- stats ---------------- */
.fx-cred-stats{
  display:grid; grid-template-columns:1fr 1fr; gap:30px 36px;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12);
  border-radius:20px; padding:36px 40px;
}
.fx-cred-stat-value{
  margin:0 0 4px;
  font-family:'Bricolage Grotesque',-apple-system,BlinkMacSystemFont,sans-serif;
  font-weight:800; font-size:32px; line-height:1; color:#9FE870;
}
.fx-cred-stat-unit{ font-size:17px; margin-left:3px; }
.fx-cred-stat-label{ margin:0; font-size:12.5px; color:rgba(255,255,255,.72); }

/* ---------------- pillars ---------------- */
.fx-cred-pillars{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px;
  margin-bottom:36px;
}
.fx-cred-pillar{
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12);
  border-radius:18px; padding:26px 26px 28px;
}
.fx-cred-pillar-icon{
  width:38px; height:38px; border-radius:10px; margin-bottom:26px;
  background:rgba(159,232,112,.14);
  display:flex; align-items:center; justify-content:center;
}
.fx-cred-pillar-title{
  margin:0 0 9px; font-size:15px; font-weight:800; line-height:1.25; color:#fff;
}
.fx-cred-pillar-text{ margin:0; font-size:12.5px; line-height:1.6; color:rgba(255,255,255,.68); }

/* ---------------- compliance marks ---------------- */
.fx-cred-marks{
  display:flex; align-items:center; gap:26px; flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,.14); padding-top:28px;
}
.fx-cred-marks-label{
  margin:0; flex:none; max-width:120px;
  font-size:12px; font-weight:800; letter-spacing:.12em;
  line-height:1.4; color:#9FE870;
}
.fx-cred-badges{
  list-style:none; margin:0; padding:0; flex:1;
  display:flex; flex-wrap:wrap; gap:12px;
}
.fx-cred-badge{
  display:inline-flex; align-items:center; gap:10px;
  background:#fff; border-radius:999px; padding:10px 20px 10px 14px;
  box-shadow:0 10px 22px -16px rgba(0,0,0,.5);
}
.fx-cred-badge-icon{ flex:none; display:flex; align-items:center; }
.fx-cred-badge-text{ display:flex; flex-direction:column; line-height:1.15; }
.fx-cred-badge-name{ font-size:14px; font-weight:800; }
.fx-cred-badge-meta{ font-size:9.5px; font-weight:700; letter-spacing:.08em; color:#8A9691; }

/* ======================= RESPONSIVE ======================= */
@media (max-width:1100px){
  .fx-cred-pillars{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .fx-cred-pillar-icon{ margin-bottom:18px; }
}

@media (max-width:900px){
  .fx-cred-in{ padding:42px 34px 38px; }
  .fx-cred-top{ grid-template-columns:1fr; gap:30px; margin-bottom:30px; }
  .fx-cred-lede{ max-width:none; }
  .fx-cred-title{ font-size:29px; }
  .fx-cred-marks{ flex-direction:column; align-items:flex-start; gap:16px; }
  .fx-cred-marks-label{ max-width:none; }
}

@media (max-width:560px){
  .fx-cred{ padding-bottom:48px; }
  .fx-cred-in{ width:calc(100% - 28px); padding:34px 24px 30px; border-radius:22px; }
  .fx-cred-title{ font-size:25px; }
  .fx-cred-stats{ padding:26px 22px; gap:24px 18px; }
  .fx-cred-stat-value{ font-size:27px; }
  .fx-cred-pillars{ grid-template-columns:1fr; }
  .fx-cred-pillar{ padding:22px; }
  .fx-cred-badges{ gap:9px; }
  .fx-cred-badge{ padding:9px 16px 9px 12px; }
}