/* Cacheable styles extracted from inline front-end blocks */

.home-front-hero-extras .hero-feature-grid {
      position: relative;
      margin-top: 3rem;
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: clamp(0.95rem, 1.4vw, 1.25rem);
      isolation: isolate;
    }

    .home-front-hero-extras .hero-feature-pill {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0.95rem;
      height: 100%;
      min-height: clamp(13rem, 27vw, 15.5rem);
      padding: clamp(1.2rem, 1.9vw, 1.55rem) clamp(1rem, 1.35vw, 1.35rem);
      border-radius: calc(var(--radius-card) - 4px);
      border: 1px solid rgb(170 188 216 / 0.56);
      background: linear-gradient(180deg, rgb(255 255 255 / 0.62) 0%, rgb(247 250 255 / 0.5) 100%);
      backdrop-filter: blur(72px) saturate(124%);
      -webkit-backdrop-filter: blur(72px) saturate(124%);
      box-shadow:
        0 10px 20px -16px rgba(15, 23, 42, 0.22),
        inset 0 1px 0 rgb(255 255 255 / 0.76);
      overflow: hidden;
      isolation: isolate;
      transition: transform 230ms ease, border-color 230ms ease, box-shadow 230ms ease;
    }

    .home-front-hero-extras .hero-feature-pill::after {
      content: none;
      position: absolute;
      top: -42%;
      right: -28%;
      width: 86%;
      height: 180%;
      transform: rotate(24deg);
      pointer-events: none;
      background: none;
      opacity: 0;
    }

    .home-front-hero-extras .hero-feature-pill > * {
      position: relative;
      z-index: 1;
    }

    .home-front-hero-extras .hero-feature-pill:hover {
      transform: translateY(-3px);
      border-color: rgb(124 153 201 / 0.75);
      box-shadow:
        0 16px 30px -18px rgba(15, 23, 42, 0.26),
        0 0 0 1px rgb(255 255 255 / 0.24);
    }

    .home-front-hero-extras .hero-feature-pill__meta {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 0.45rem;
      margin-top: 0.15rem;
    }

    .home-front-hero-extras .hero-feature-pill__icon {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
      width: clamp(3.15rem, 3.9vw, 3.55rem);
      height: clamp(3.15rem, 3.9vw, 3.55rem);
      margin-top: 0.12rem;
      border-radius: 1rem;
      border: 1px solid rgb(181 198 223 / 0.68);
      background: linear-gradient(180deg, rgb(255 255 255 / 0.7) 0%, rgb(247 251 255 / 0.58) 100%);
      backdrop-filter: blur(42px) saturate(122%);
      -webkit-backdrop-filter: blur(42px) saturate(122%);
      box-shadow:
        0 8px 16px -14px rgba(15, 23, 42, 0.2),
        inset 0 1px 0 rgb(255 255 255 / 0.82);
    }

    .home-front-hero-extras .hero-feature-pill__glyph {
      font-size: clamp(1.48rem, 1.85vw, 1.7rem);
      line-height: 1;
      font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', sans-serif;
    }

    .home-front-hero-extras .hero-feature-pill__content {
      min-width: 0;
      text-align: center;
      margin-top: 0.2rem;
    }

    .home-front-hero-extras .hero-feature-pill__kicker {
      margin: 0;
      font-size: 0.62rem;
      line-height: 1;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      font-weight: 700;
      color: rgb(30 41 59 / 0.7);
      margin-top: 0.15rem;
    }

.home-front-hero-extras .hero-feature-pill__meta::before,
.home-front-hero-extras .hero-feature-pill__meta::after {
      content: '';
      width: 1.6rem;
      height: 1px;
      background: linear-gradient(90deg, rgb(148 163 184 / 0.5) 0%, rgb(255 255 255 / 0.2) 100%);
      opacity: 0.9;
    }

    .home-front-hero-extras .hero-feature-pill__index {
      display: none;
    }

    .home-front-hero-extras .hero-feature-pill__title {
      margin: 0;
      margin-top: 0.6rem;
      font-size: clamp(1.15rem, 1.35vw, 1.55rem);
      line-height: 1.18;
      font-weight: 700;
      color: rgb(10 18 37 / 0.98);
      text-wrap: balance;
    }

    .home-front-hero-extras .hero-feature-pill__description {
      margin-top: 0.65rem;
      font-size: clamp(0.94rem, 0.96vw, 1rem);
      line-height: 1.44;
      color: rgb(30 41 59 / 0.84);
      text-wrap: pretty;
    }

    @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
      .home-front-hero-extras .hero-feature-pill {
        background: rgb(255 255 255 / 0.84);
      }
    }

    @media (min-width: 768px) {
      .home-front-hero-extras .hero-feature-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
    }

    @media (max-width: 767px) {
      .home-front-hero-extras .hero-feature-grid {
        margin-top: 2.1rem;
      }

      .home-front-hero-extras .hero-feature-pill {
        min-height: 0;
      }
    }

.home-money-cards .money-feature-grid {
      display: grid;
      gap: clamp(1rem, 1.5vw, 1.6rem);
      grid-template-columns: minmax(0, 1fr);
    }

    .home-money-cards .card-apple {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      gap: 0;
      min-height: clamp(18.5rem, 31vw, 21.25rem);
      padding: clamp(1.35rem, 2.15vw, 1.95rem) clamp(1.05rem, 1.6vw, 1.6rem);
      border-radius: calc(var(--radius-card) - 2px);
      border: 1px solid rgb(170 188 216 / 0.56);
      background: linear-gradient(180deg, rgb(255 255 255 / 0.62) 0%, rgb(247 250 255 / 0.5) 100%);
      backdrop-filter: blur(72px) saturate(124%);
      -webkit-backdrop-filter: blur(72px) saturate(124%);
      box-shadow:
        0 10px 20px -16px rgba(15, 23, 42, 0.22),
        inset 0 1px 0 rgb(255 255 255 / 0.76);
      overflow: hidden;
      isolation: isolate;
      text-decoration: none;
      transition: transform 230ms ease, border-color 230ms ease, box-shadow 230ms ease;
    }

    .home-money-cards .card-apple::after {
      content: none;
      position: absolute;
      top: -42%;
      right: -28%;
      width: 86%;
      height: 180%;
      transform: rotate(24deg);
      pointer-events: none;
      background: none;
      opacity: 0;
    }

    .home-money-cards .card-apple:hover {
      transform: translateY(-3px);
      border-color: rgb(124 153 201 / 0.75);
      box-shadow:
        0 16px 30px -18px rgba(15, 23, 42, 0.26),
        0 0 0 1px rgb(255 255 255 / 0.24);
    }

    .home-money-cards .card-apple > * {
      position: relative;
      z-index: 1;
    }

    .home-money-cards .card-apple > div:first-of-type {
      display: flex;
      align-items: center;
      justify-content: center;
      width: clamp(3.15rem, 3.9vw, 3.55rem);
      height: clamp(3.15rem, 3.9vw, 3.55rem);
      margin-top: 0.12rem;
      margin-bottom: 0;
      border-radius: 1rem;
      border: 1px solid rgb(181 198 223 / 0.68);
      background: linear-gradient(180deg, rgb(255 255 255 / 0.7) 0%, rgb(247 251 255 / 0.58) 100%);
      backdrop-filter: blur(42px) saturate(122%);
      -webkit-backdrop-filter: blur(42px) saturate(122%);
      box-shadow:
        0 8px 16px -14px rgba(15, 23, 42, 0.2),
        inset 0 1px 0 rgb(255 255 255 / 0.82);
    }

    .home-money-cards .card-apple > div:first-of-type > * {
      font-size: clamp(1.48rem, 1.85vw, 1.7rem) !important;
      line-height: 1;
      font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', sans-serif;
    }

    .home-money-cards .card-apple > h3 {
      margin-top: clamp(1rem, 1.4vw, 1.35rem);
      margin-bottom: 0;
      width: 100%;
      font-size: clamp(1.25rem, 1.55vw, 1.75rem) !important;
      line-height: 1.1;
      font-weight: 700;
      letter-spacing: -0.015em;
      color: rgb(10 18 37 / 0.98);
      white-space: nowrap;
    }

    .home-money-cards .card-apple > p {
      margin-top: 0.78rem;
      margin-bottom: 0;
      max-width: 32ch;
      font-size: clamp(1rem, 1.04vw, 1.08rem);
      line-height: 1.5;
      color: rgb(30 41 59 / 0.84);
      text-wrap: pretty;
    }

    .home-money-cards .card-apple > span:last-child {
      margin-top: auto;
      padding-top: clamp(1.15rem, 1.7vw, 1.5rem);
      display: inline-flex;
      align-items: center;
      gap: 0.35rem;
      font-size: 1.03rem;
      line-height: 1;
      font-weight: 600;
      letter-spacing: 0.01em;
      color: rgb(var(--token-brand));
      transition: gap 180ms ease, color 180ms ease;
    }

    .home-money-cards .card-apple:hover > span:last-child {
      gap: 0.6rem;
      color: rgb(var(--token-brand-hover));
    }

    @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
      .home-money-cards .card-apple {
        background: rgb(255 255 255 / 0.84);
      }
    }

    @media (min-width: 768px) {
      .home-money-cards .money-feature-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
    }
