/**
 * Grupo FAM - Features, Process Steps, Coverage Table, AMC Platform & Demo Banner
 */

/* 1. FEATURES GRID */
.feature-grid,
.fam-feature-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px 30px;
  margin-top: 35px;
}

.feature-grid.grid-five,
.fam-feature-grid.grid-five {
  grid-template-columns: repeat(5, 1fr);
  gap: 25px;
}

.feature-grid article,
.fam-feature-grid article {
  border-top: 1px solid var(--fam-ink, #171717);
  padding-top: 22px;
  display: flex;
  flex-direction: column;
}

.feature-num,
.fam-feature-num {
  display: block;
  font-size: 13px;
  color: var(--fam-muted, #62625d);
  margin-bottom: 25px;
}

.feature-grid h3,
.fam-feature-grid h3 {
  font-size: 24px;
  line-height: 1.18;
  letter-spacing: -0.035em;
  margin-bottom: 16px;
  color: var(--fam-ink, #171717);
  font-weight: 500;
}

.feature-grid p,
.fam-feature-grid p {
  font-size: 15px;
  line-height: 1.6;
  color: var(--fam-muted, #62625d);
  margin: 0;
}

@media (max-width: 900px) {
  .feature-grid,
  .fam-feature-grid,
  .feature-grid.grid-five,
  .fam-feature-grid.grid-five {
    grid-template-columns: 1fr 1fr;
    gap: 30px 22px;
  }
}

@media (max-width: 600px) {
  .feature-grid,
  .fam-feature-grid,
  .feature-grid.grid-five,
  .fam-feature-grid.grid-five {
    grid-template-columns: 1fr;
  }
}

/* 2. PROCESS STEPS */
.process-grid,
.fam-process-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
  margin-top: 50px;
}

.process-grid.process-five,
.fam-process-grid.process-five {
  grid-template-columns: repeat(5, 1fr);
}

.process-grid article,
.fam-process-grid article {
  border-top: 1px solid var(--fam-ink, #171717);
  padding-top: 25px;
  display: flex;
  flex-direction: column;
}

.process-grid .feature-num,
.fam-process-grid .fam-feature-num {
  font-size: 40px;
  letter-spacing: -0.055em;
  color: var(--fam-ink, #171717);
  margin-bottom: 25px;
  font-weight: 500;
  line-height: 1;
}

.process-grid h3,
.fam-process-grid h3 {
  font-size: 22px;
  line-height: 1.2;
  margin-bottom: 14px;
  color: var(--fam-ink, #171717);
  font-weight: 500;
}

.process-grid p,
.fam-process-grid p {
  font-size: 15px;
  line-height: 1.6;
  color: var(--fam-muted, #62625d);
  margin: 0;
}

@media (max-width: 1024px) {
  .process-grid,
  .fam-process-grid,
  .process-grid.process-five,
  .fam-process-grid.process-five {
    grid-template-columns: 1fr 1fr;
    gap: 35px 25px;
  }
}

@media (max-width: 600px) {
  .process-grid,
  .fam-process-grid,
  .process-grid.process-five,
  .fam-process-grid.process-five {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

/* 3. COVERAGE TABLE */
.coverage-table,
.fam-coverage-table {
  overflow-x: auto;
  margin-top: 30px;
  margin-bottom: 25px;
}

.coverage-table table,
.fam-coverage-table table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  font-size: 15px;
  line-height: 1.6;
}

.coverage-table caption,
.fam-coverage-table caption {
  text-align: left;
  font-size: 13px;
  color: var(--fam-muted, #62625d);
  padding-bottom: 18px;
}

.coverage-table th,
.coverage-table td,
.fam-coverage-table th,
.fam-coverage-table td {
  border-bottom: 1px solid var(--fam-line, #d6d6d0);
  padding: 18px 18px 18px 0;
  vertical-align: top;
}

.coverage-table thead th,
.fam-coverage-table thead th {
  font-size: 13px;
  font-weight: 600;
  background: #efefeb;
  padding: 14px 16px;
  color: var(--fam-ink, #171717);
}

.coverage-table tbody th,
.fam-coverage-table tbody th {
  min-width: 180px;
  font-weight: 600;
}

.coverage-table a,
.fam-coverage-table a {
  color: var(--fam-accent, #212c5d);
  text-decoration: underline;
  transition: opacity 0.2s ease;
}

.coverage-table a:hover,
.fam-coverage-table a:hover {
  opacity: 0.8;
}

/* 4. AMC PLATFORM */
.amc-section,
.fam-amc-section {
  background: var(--fam-accent, #212c5d);
  color: #ffffff;
  padding-block: 112px;
}

.amc-section .section-label > span,
.fam-amc-section .fam-section-label > span,
.amc-section .section-heading p,
.fam-amc-section .fam-section-heading p {
  color: #d7dced;
}

.amc-diagram,
.fam-amc-diagram {
  display: grid;
  grid-template-columns: 1fr 1.7fr;
  gap: 70px;
  align-items: center;
  margin-top: 40px;
}

.amc-center,
.fam-amc-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  border: 1px solid #8290b8;
  padding: 70px 25px;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 4px;
}

.amc-center strong,
.fam-amc-center strong {
  font-size: 90px;
  color: #ffffff;
  letter-spacing: -0.07em;
  line-height: 1;
  font-weight: 600;
}

.amc-center span,
.fam-amc-center span {
  font-size: 16px;
  line-height: 1.4;
  max-width: 240px;
  margin-top: 20px;
  color: #d7dced;
}

.amc-modules,
.fam-amc-modules {
  display: flex;
  flex-direction: column;
  border-top: 1px solid #8290b8;
}

.amc-modules .module,
.fam-amc-modules .module {
  border-bottom: 1px solid #8290b8;
}

.amc-modules .module summary,
.fam-amc-modules .module summary {
  display: grid;
  grid-template-columns: 30px 1fr 40px;
  gap: 18px;
  align-items: center;
  padding: 22px 0;
  color: #ffffff;
  cursor: pointer;
}

.amc-modules .module summary > span:first-child,
.fam-amc-modules .module summary > span:first-child {
  font-size: 13px;
  color: #d7dced;
}

.amc-modules .module h3,
.fam-amc-modules .module h3 {
  font-size: 20px;
  line-height: 1.25;
  color: #ffffff;
  margin: 0;
  font-weight: 500;
}

.amc-modules .module .plus,
.fam-amc-modules .module .plus {
  border-color: #8290b8;
  color: #ffffff;
  width: 36px;
  height: 36px;
  border: 1px solid #8290b8;
  border-radius: 50%;
  position: relative;
  display: inline-block;
  transition: background 0.25s ease;
}

.amc-modules .module .plus:before,
.amc-modules .module .plus:after,
.fam-amc-modules .module .plus:before,
.fam-amc-modules .module .plus:after {
  content: '';
  position: absolute;
  background: #ffffff;
  width: 14px;
  height: 1px;
  top: 17px;
  left: 10px;
}

.amc-modules .module .plus:after,
.fam-amc-modules .module .plus:after {
  transform: rotate(90deg);
  transition: transform 0.25s ease;
}

.amc-modules .module[open] .plus:after,
.fam-amc-modules .module[open] .plus:after {
  transform: rotate(0);
}

.amc-modules .module .accordion-body p,
.fam-amc-modules .module .accordion-body p {
  font-size: 15px;
  line-height: 1.6;
  color: #e3e7f3;
  padding: 0 10px 24px 48px;
  margin: 0;
}

@media (max-width: 900px) {
  .amc-diagram,
  .fam-amc-diagram {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .amc-center,
  .fam-amc-center {
    padding: 40px 20px;
  }
  .amc-center strong,
  .fam-amc-center strong {
    font-size: 64px;
  }
}

/* 5. DEMOSTRACIÓN */
.demo-placeholder,
.fam-demo-placeholder {
  background: #efefeb;
  min-height: 330px;
  padding: 55px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  border: 1px solid var(--fam-line, #d6d6d0);
  border-radius: 4px;
  margin-top: 30px;
}

.demo-placeholder > span,
.fam-demo-placeholder > span {
  font-size: 12px;
  letter-spacing: 0.06em;
  margin-bottom: 24px;
  color: var(--fam-accent, #212c5d);
  font-weight: 750;
}

.demo-placeholder h3,
.fam-demo-placeholder h3 {
  font-size: clamp(1.8rem, 3.2vw, 3rem);
  line-height: 1.15;
  margin-bottom: 18px;
  color: var(--fam-ink, #171717);
  font-weight: 500;
}

.demo-placeholder p,
.fam-demo-placeholder p {
  font-size: 16px;
  color: var(--fam-muted, #62625d);
  margin-bottom: 28px;
  max-width: 600px;
  line-height: 1.5;
}

@media (max-width: 768px) {
  .demo-placeholder,
  .fam-demo-placeholder {
    padding: 30px 20px;
  }
}