/* Functional tool hierarchy; intentionally no glass/blur treatment. */
.home {
  background: #f7f9f9;
}
.home header.site {
  background: #fff;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.home .brand-descriptor span,
.home .header-cta {
  display: none;
}
.home header.site .wrap {
  gap: 20px;
}
.home header.site nav {
  display: flex;
  gap: 22px;
  flex-wrap: nowrap;
  align-items: center;
}
.home .nav-group {
  position: relative;
}
.home .nav-group summary {
  cursor: pointer;
  font: 600 12px/1.4 var(--font-ui);
  list-style: none;
  white-space: nowrap;
  padding: 12px 0;
}
.home .nav-group summary::after {
  content: "⌄";
  padding-left: 6px;
}
.home .nav-group > div {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 30;
  min-width: 190px;
  padding: 10px;
  background: white;
  border: 1px solid #cdd8d5;
  border-radius: 8px;
  box-shadow: 0 6px 16px #17352d12;
}
.home .nav-group > div a {
  display: block;
  padding: 9px;
  white-space: nowrap;
}
.home .hero-composition {
  margin-block: 22px;
  gap: 38px;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
}
.home .hero-composition .hero h1 {
  font-size: clamp(29px, 3.1vw, 44px);
  max-width: 650px;
}
.home .hero-composition .hero p.sub {
  max-width: 570px;
  font-size: 14px;
}
.home .hero-eyebrow {
  color: #315f54;
}
.home .tibo-watch {
  background: linear-gradient(105deg, #dff4ea, #e1f5f5);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
  border: 1px solid #c2ded5;
  border-radius: 12px;
}
.home .tibo-watch::before {
  display: none;
}
.home .calc,
.home .inputs,
.home .results {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
  background: #fff;
}
.home .model,
.home .model.active {
  box-shadow: none;
}
.home .model.active {
  background: #e9f8f1;
  border-color: #397f65;
}
.home .block {
  margin-top: 28px;
}
.home #pricing > h2,
.home .more-tools > h2 {
  font: 700 19px/1.4 var(--font-display);
  letter-spacing: -0.4px;
  margin-bottom: 12px;
}
.home .current-model-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}
.home .current-model-card {
  padding: 18px;
  border: 1px solid #d3deda;
  border-radius: 10px;
  background: white;
  display: grid;
  gap: 12px;
  color: #1d3830;
  text-decoration: none;
}
.home .current-model-card:hover {
  border-color: #397f65;
  background: #f3fbf7;
}
.home .current-model-card h3 {
  font: 650 15px/1.4 var(--font-display);
  margin: 0;
}
.home .current-model-card .model-rates {
  display: grid;
  grid-template-columns: 1fr;
  gap: 5px;
  font-size: 12px;
}
.home .current-model-card .model-rate {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.home .current-model-card small {
  font: 400 10px/1.5 var(--font-ui);
  color: #486057;
}
.home .more-tools-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.home .more-tools-grid a {
  padding: 15px;
  background: white;
  border: 1px solid #d3deda;
  border-radius: 8px;
  color: #203c33;
  display: grid;
  grid-template-columns: 20px 1fr 12px;
  gap: 8px;
  text-decoration: none;
  align-content: start;
}
.home .more-tools-grid strong {
  font-size: 12px;
}
.home .more-tools-grid small {
  grid-column: 2/-1;
  font-size: 11px;
  line-height: 1.5;
  color: #50675e;
}
.home .utility-row {
  display: block;
  margin-top: 28px;
}
.home .utility-disclosures {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.home #compare,
.home #models {
  margin-top: 14px;
}
.home #pricing > details,
.home #compare > details,
.home #models > details {
  border: 1px solid #d3deda;
  background: white;
  border-radius: 8px;
  padding: 12px 16px;
}
.home #pricing > details > summary,
.home #compare > details > summary,
.home #models > details > summary {
  cursor: pointer;
  font-size: 12px;
}
.home #compare h2,
.home #models h2 {
  font: 600 14px/1.4 var(--font-display);
  display: inline;
}
.home .trustline {
  font-size: 11px;
  color: #466257;
}
.home .summary-percent {
  white-space: normal;
}
@media (max-width: 1100px) {
  .home header.site .wrap {
    gap: 16px;
  }
  .home .brand-descriptor,
  .home .header-verified {
    display: none;
  }
  .home header.site nav {
    margin-left: auto;
  }
  .home .hero-composition {
    gap: 20px;
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 760px) {
  .home header.site .wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 0 16px;
    padding-block: 10px;
  }
  .home header.site nav {
    order: 3;
    flex-basis: 100%;
    justify-content: space-between;
    gap: 16px;
    margin-top: 3px;
  }
  .home .header-search {
    margin-left: auto;
  }
  .home .nav-group:last-child > div {
    left: auto;
    right: 0;
  }
  .home .hero-composition {
    grid-template-columns: 1fr;
    gap: 14px;
    margin-top: 18px;
  }
  .home .hero-composition .hero h1 {
    font-size: 30px;
  }
  .home .hero-composition .hero p.sub {
    font-size: 13px;
  }
  .home .tibo-watch {
    max-width: none;
  }
  .home .current-model-cards {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .home .current-model-card {
    grid-template-columns: 1fr 1fr;
    padding: 14px;
    gap: 8px;
    align-items: center;
  }
  .home .current-model-card h3 {
    font-size: 13px;
  }
  .home .current-model-card .model-rates {
    grid-column: 2;
    grid-row: 1/3;
    font-size: 11px;
  }
  .home .current-model-card small {
    grid-column: 1;
    grid-row: 2;
  }
  .home .more-tools-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .home .more-tools-grid a {
    padding: 12px;
    gap: 5px;
    grid-template-columns: 14px 1fr 8px;
  }
  .home .more-tools-grid strong {
    font-size: 11px;
  }
  .home .more-tools-grid small {
    font-size: 10px;
  }
  .home .utility-disclosures {
    grid-template-columns: 1fr;
    gap: 8px;
  }
}
.home .nav-group:last-child > div {
  left: auto;
  right: 0;
}
.home .model.active {
  background: #174f3b;
  border-color: #174f3b;
}
.home footer.site {
  color: #4d5f68;
}
.home footer.site a {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.home header.site nav > * {
  order: 0;
}
.home .header-search {
  display: block;
}
.home header.site nav > a {
  order: 0 !important;
}