/* SHOPFUMOT ECO HUB V1 */
.sf-eco-hub-v1 {
  background: #F6F8F5;
  color: #203024;
  padding: 0 0 72px;
}
.sf-eco-hub-v1 * { box-sizing: border-box; }
.sf-eco-container {
  width: min(1180px, calc(100% - 36px));
  margin: 0 auto;
}
.sf-eco-breadcrumb {
  display: flex;
  gap: 10px;
  padding: 20px 0;
  color: #728074;
  font-size: 12px;
}
.sf-eco-breadcrumb a {
  color: inherit;
  text-decoration: none;
}
.sf-eco-hero {
  padding: clamp(38px, 6vw, 76px);
  border-radius: 18px;
  background: linear-gradient(125deg, #151A1E, #2B412C);
  color: #FFFFFF;
}
.sf-eco-eyebrow,
.sf-eco-kicker {
  margin: 0 0 12px;
  color: #719A31;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .15em;
}
.sf-eco-hero .sf-eco-eyebrow { color: #D7F352; }
.sf-eco-hero h1 {
  margin: 0 0 17px;
  max-width: 800px;
  color: #FFFFFF;
  font-size: clamp(34px, 5vw, 57px);
  line-height: 1.1;
  letter-spacing: -.04em;
}
.sf-eco-hero > p:not(.sf-eco-eyebrow) {
  max-width: 700px;
  margin: 0 0 25px;
  color: #D8DFD7;
  font-size: 16px;
  line-height: 1.75;
}
.sf-eco-main-link,
.sf-eco-card-button {
  display: inline-flex;
  padding: 12px 17px;
  border-radius: 8px;
  background: #D7F352;
  color: #151A1E !important;
  font-weight: 800;
  text-decoration: none !important;
}
.sf-eco-section { margin-top: 60px; }
.sf-eco-section h2 {
  margin: 0 0 16px;
  color: #1E3023;
  font-size: clamp(25px, 3vw, 34px);
  line-height: 1.22;
}
.sf-eco-section-intro {
  max-width: 760px;
  margin-bottom: 22px;
  color: #617266;
  line-height: 1.75;
}
.sf-eco-model-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}
.sf-eco-model-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #DFE7DC;
  border-radius: 16px;
  background: #FFFFFF;
}
.sf-eco-model-image {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 315px;
  padding: 18px;
  background: #EEF3EB;
}
.sf-eco-model-image img {
  width: auto;
  max-width: 100%;
  height: 100%;
  object-fit: contain;
}
.sf-eco-model-body { padding: 24px; }
.sf-eco-card-label {
  margin: 0 0 8px;
  color: #66892E;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .11em;
}
.sf-eco-model-body h3 {
  margin: 0 0 13px;
  color: #1F3024;
  font-size: 24px;
}
.sf-eco-model-body > p:not(.sf-eco-card-label) {
  min-height: 72px;
  color: #647468;
  line-height: 1.75;
}
.sf-eco-stat-row {
  display: flex;
  gap: 10px;
  margin: 18px 0 22px;
}
.sf-eco-stat-row span {
  flex: 1;
  padding: 13px;
  border-radius: 9px;
  background: #F4F7F1;
  color: #627366;
  font-size: 12px;
}
.sf-eco-stat-row strong {
  display: block;
  color: #213D28;
  font-size: 25px;
}
.sf-eco-table-wrap {
  overflow-x: auto;
  background: #FFFFFF;
  border: 1px solid #E0E8DE;
  border-radius: 12px;
}
.sf-eco-table-wrap table {
  width: 100%;
  min-width: 490px;
  border-collapse: collapse;
}
.sf-eco-table-wrap th,
.sf-eco-table-wrap td {
  padding: 16px;
  border-bottom: 1px solid #E7EDE4;
  text-align: left;
}
.sf-eco-table-wrap thead th {
  background: #EEF3EB;
  color: #2A402E;
}
.sf-eco-table-wrap tbody th {
  color: #324637;
}
.sf-eco-table-wrap a {
  color: #456E23;
  font-weight: 750;
}
.sf-eco-table-note {
  margin-top: 13px;
  color: #768578;
  font-size: 13px;
  line-height: 1.75;
}
.sf-eco-guide {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.sf-eco-guide > div {
  min-width: 0;
  padding: 22px;
  border: 1px solid #E0E8DE;
  border-radius: 12px;
  background: #FFFFFF;
}
.sf-eco-guide-number {
  color: #739B30;
  font-size: 12px;
  font-weight: 800;
}
.sf-eco-guide h3 {
  margin: 10px 0;
  font-size: 17px;
  color: #243B29;
}
.sf-eco-guide p {
  margin: 0;
  color: #657469;
  font-size: 14px;
  line-height: 1.75;
}
.sf-eco-faq details {
  margin-bottom: 9px;
  border: 1px solid #E0E8DC;
  border-radius: 10px;
  background: #FFFFFF;
}
.sf-eco-faq summary {
  cursor: pointer;
  padding: 18px;
  color: #223728;
  font-weight: 750;
}
.sf-eco-faq details p {
  margin: 0;
  padding: 0 18px 18px;
  color: #647469;
  line-height: 1.75;
}
@media (max-width: 760px) {
  .sf-eco-container { width: calc(100% - 28px); }
  .sf-eco-hero { padding: 30px 22px; border-radius: 12px; }
  .sf-eco-hero > p:not(.sf-eco-eyebrow) { font-size: 14px; }
  .sf-eco-section { margin-top: 42px; }
  .sf-eco-model-grid { grid-template-columns: 1fr; gap: 14px; }
  .sf-eco-model-image { height: 235px; }
  .sf-eco-model-body { padding: 18px; }
  .sf-eco-model-body > p:not(.sf-eco-card-label) { min-height: 0; }
  .sf-eco-stat-row { flex-wrap: wrap; }
  .sf-eco-guide { grid-template-columns: 1fr; }
  .sf-eco-table-wrap th,
  .sf-eco-table-wrap td { padding: 12px; font-size: 13px; }
}
