/* V30.178 · remove subscription accordions and rebuild the annual scene on mobile. */

/* The extra plan accordions introduced with the annual examples are intentionally removed. */
.m-card .cb-plan-uses {
  display: none !important;
}

@media (max-width: 700px) {
  #home-page #year-proof {
    min-height: 0 !important;
    padding: 52px 20px 22px !important;
    background:
      radial-gradient(ellipse at 50% 0%, rgba(195, 146, 67, .06), transparent 28%),
      radial-gradient(ellipse at 100% 100%, rgba(98, 39, 17, .12), transparent 24%),
      #030302 !important;
  }

  #home-page #year-proof .cb-year-stage-beams {
    opacity: .72;
  }

  #home-page #year-proof .cb-year-beam {
    top: 0 !important;
    bottom: auto !important;
    width: 72% !important;
    height: 100% !important;
    background: url('/cb-stage-gold-beam-v30175.png') center / 100% 100% no-repeat !important;
    filter: none !important;
    clip-path: none !important;
    opacity: .66 !important;
  }

  #home-page #year-proof .cb-year-beam.beam-left {
    left: -10% !important;
  }

  #home-page #year-proof .cb-year-beam.beam-right {
    left: 45% !important;
  }

  #home-page #year-proof .year-head {
    width: 100% !important;
    max-width: 350px !important;
    margin: 0 auto 24px !important;
  }

  #home-page #year-proof .year-kicker {
    margin-bottom: 11px !important;
    font-size: 10px !important;
    letter-spacing: .14em !important;
  }

  #home-page #year-proof .year-head h2 {
    max-width: 350px !important;
    font-size: clamp(32px, 9vw, 38px) !important;
    line-height: .96 !important;
    letter-spacing: -.04em !important;
  }

  #home-page #year-proof .year-grid {
    display: grid !important;
    gap: 0 !important;
  }

  #home-page #year-proof .year-card,
  #home-page #year-proof .year-card.creator,
  #home-page #year-proof .year-card.access,
  #home-page #year-proof .year-card.signature {
    min-height: 0 !important;
    overflow: hidden !important;
    border-top: 1px solid rgba(247, 243, 235, .12) !important;
  }

  #home-page #year-proof .year-card:last-child {
    border-bottom: 1px solid rgba(247, 243, 235, .12) !important;
  }

  #home-page #year-proof .year-card-content,
  #home-page #year-proof .year-card.access .year-card-content,
  #home-page #year-proof .year-card.creator .year-card-content,
  #home-page #year-proof .year-card.signature .year-card-content {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 34px 0 52px !important;
    text-align: left !important;
  }

  #home-page #year-proof .year-card.creator .year-card-content {
    padding-left: 8% !important;
  }

  #home-page #year-proof .year-card.signature .year-card-content {
    padding-left: 16% !important;
  }

  #home-page #year-proof .year-plan {
    margin-bottom: 17px !important;
    font-size: clamp(42px, 12.5vw, 52px) !important;
    line-height: .79 !important;
    letter-spacing: -.05em !important;
  }

  #home-page #year-proof .year-total {
    font-size: clamp(23px, 6.4vw, 27px) !important;
    line-height: 1 !important;
  }

  #home-page #year-proof .year-example {
    width: min(300px, 92%) !important;
    margin-top: 17px !important;
    gap: 5px !important;
  }

  #home-page #year-proof .year-example-label {
    font-size: 8px !important;
  }

  #home-page #year-proof .year-example strong {
    font-size: 15px !important;
  }

  #home-page #year-proof .year-example-services {
    font-size: 10px !important;
    line-height: 1.4 !important;
  }

  #home-page #year-proof .year-example small {
    font-size: 8px !important;
  }

  #home-page #year-proof .year-card::before {
    right: 0 !important;
    bottom: 6px !important;
    left: auto !important;
    color: rgba(220, 218, 213, .08) !important;
    font-size: 104px !important;
    transform: none !important;
  }
}

@media (max-width: 390px) {
  #home-page #year-proof .year-card.creator .year-card-content {
    padding-left: 5% !important;
  }

  #home-page #year-proof .year-card.signature .year-card-content {
    padding-left: 10% !important;
  }

  #home-page #year-proof .year-plan {
    font-size: clamp(40px, 12vw, 47px) !important;
  }
}
