/* -------------------------------------------------------
   Amen Clinics vs. Standard Psychiatry — comparison table
   Everything is scoped under .amen-compare so this can be
   dropped into an existing page without leaking styles
   into (or being affected by) that page's own CSS.
------------------------------------------------------- */
.amen-compare {
  /* tokens */
  --teal-border: #0A91B4;
  --teal-bg: #EFFBFC;
  --row-divider: #0a91b480;
  --check-fill: #2FA6B4;
  --check-stroke: #008699;
  --text-title: #14181f;
  --box-bg: #ffffff;

  --box-radius: 37px;
  --pill-radius: 37px;
  --thead-h: 92px;      /* fixed header row height, used to align the decorative box/pill */
  --pill-overhang-top: 8px;    /* how far the pill sticks out above the header */
  --pill-overhang-bottom: 40px; /* how far the pill sticks out below the box */
  --cell-pad-x: 24px;    /* horizontal cell padding, shared with the divider inset so they line up with the copy */

  padding: 48px 24px 96px;
  font-size: 16px;
  font-family: "Raleway", "Helvetica Neue", Helvetica, Arial, "Segoe UI", sans-serif;
  color: var(--text-title);
  -webkit-font-smoothing: antialiased;
}

.amen-compare,
.amen-compare *,
.amen-compare *::before,
.amen-compare *::after {
  box-sizing: border-box;
}

.amen-compare__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* -------------------------------------------------------
   Comparison wrapper + decorative layers
------------------------------------------------------- */
.amen-compare__frame {
  position: relative;
  isolation: isolate;       /* new stacking context so decorative layers stay contained */
  max-width: 1240px;
  margin: 0 auto;
}

.amen-compare__box-bg {
  position: absolute;
  top: var(--thead-h);
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--box-bg);
  border: 1px solid var(--teal-border);
  border-radius: var(--box-radius);
  z-index: 1;
}

.amen-compare__pill-bg {
  position: absolute;
  top: calc(-1 * var(--pill-overhang-top));
  bottom: calc(-1 * var(--pill-overhang-bottom));
  left: 60%;
  width: 20%;
  z-index: 2;
  display: flex;
  justify-content: center;
}

.amen-compare__pill-shape {
  width: 100%;
  height: 100%;
  background: var(--teal-bg);
  border: 1px solid var(--teal-border);
  border-radius: var(--pill-radius);
}

/* -------------------------------------------------------
   Table
------------------------------------------------------- */
.amen-compare__table {
  position: relative;
  z-index: 3;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

.amen-compare__col-feature { width: 60%; }
.amen-compare__col-amen    { width: 20%; }
.amen-compare__col-standard{ width: 20%; }

/* -- head -- */
.amen-compare__table thead th {
  height: var(--thead-h);
  padding: 0 18px;
  background: transparent;
  border: none;
  text-align: center;
  vertical-align: middle;
}

.amen-compare__table thead th:first-child {
  text-align: left;
}

.amen-compare__col-amen-heading,
.amen-compare__col-standard-heading {
  font-size: 1.3em;
  font-style: normal;
}

.amen-compare__col-amen-heading {
  font-weight: 700;
  color: #008699;
}

.amen-compare__col-standard-heading {
  font-weight: 500;
  color: #000000;
}

/* -- body -- */
.amen-compare__table tbody th,
.amen-compare__table tbody td {
  position: relative;
  background: transparent;
  padding: 28px var(--cell-pad-x);
}

/* row divider: inset on the outer edge to line up with the copy's own
   padding, but flush against the amen column so it still meets the pill.
   the amen column itself is skipped since the pill replaces its divider. */
.amen-compare__table tbody tr:not(:last-child) th::after,
.amen-compare__table tbody tr:not(:last-child) td:not(.amen-compare__cell-amen)::after {
  content: "";
  position: absolute;
  bottom: 0;
  height: 1px;
  background: var(--row-divider);
}

.amen-compare__table tbody tr:not(:last-child) th::after {
  left: var(--cell-pad-x);
  right: 0;
}

.amen-compare__table tbody tr:not(:last-child) td.amen-compare__cell-standard::after {
  left: 0;
  right: var(--cell-pad-x);
}

.amen-compare__table tbody th {
  text-align: left;
  font-weight: 400;
  vertical-align: top;
}

.amen-compare__feature-title {
  max-width: 400px;
  margin: 0 0 8px;
  font-size: 1.25em;
  font-style: normal;
  font-weight: 500;
  line-height: 1.2;
  text-transform: capitalize;
  color: var(--text-title);
  overflow-wrap: break-word;
}

.amen-compare__feature-title strong {
  font-weight: 700;
}

.amen-compare__feature-desc {
  max-width: 400px;
  margin: 0;
  font-size: 0.9em;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
  text-transform: capitalize;
  color: #000000;
  overflow-wrap: break-word;
}

.amen-compare__table tbody td {
  text-align: center;
  vertical-align: middle;
}

.amen-compare__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.amen-compare__icon-check svg { display: block; }
.amen-compare__icon-x svg { display: block; }

#aboutPageHeading  mark{
  background: linear-gradient(90deg, #3cc1f3, #69e4e4);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* -------------------------------------------------------
   Responsive: same 3-column layout, compressed
------------------------------------------------------- */

@media screen and (max-width: 768px){
  .about-page-icon-check .icon-container{
    width: 24px !important;
  }

  .about-page-icon-x .icon-container{
    width: 15px !important;
  }

  .page-id-9128 main{
    font-size: 13px;
  }

  #aboutPageHeading{
    font-size: 2.5em !important;
    max-width: unset !important;
    letter-spacing: -2px !important;
  }
}

@media (max-width: 760px) {
  .amen-compare {
    --box-radius: 15px;
    --pill-radius: 15px;
    --thead-h: 82px;
    --pill-overhang-top: 6px;
    --pill-overhang-bottom: 22px;
    --cell-pad-x: 20px;
    font-size: 12px;
    padding: 0;
    margin-top: 3rem;
    margin-bottom: 3rem;
  }

  .amen-compare__table thead th {
    padding: 0 8px;
    text-align: center;
  }

  .amen-compare__col-amen-heading,
  .amen-compare__col-standard-heading {
    font-size: 12px;
  }

  .amen-compare__table tbody th,
  .amen-compare__table tbody td {
    padding-top: 16px;
    padding-bottom: 16px;
  }

  .amen-compare__feature-title {
    margin: 0 0 6px;
    font-size: 15px;
  }

  .amen-compare__feature-desc {
    font-size: 10px;
  }

  .amen-compare__icon-check svg { width: 30px; height: 30px; }
  .amen-compare__icon-x svg { width: 13px; height: 13px; }
}


@media (max-width: 420px) {
  .amen-compare {
    --thead-h: 68px;
    --pill-overhang-top: 4px;
    --pill-overhang-bottom: 16px;
    --cell-pad-x: 14px;
  }

  .amen-compare__table tbody th,
  .amen-compare__table tbody td {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .amen-compare__icon-check svg { width: 24px; height: 24px; }
  .amen-compare__icon-x svg { width: 11px; height: 11px; }
}



