/* Mobile layout v9: compact cards, fluid sections and touch-friendly controls. */

@media (max-width: 980px) {
    :root {
        --mobile-page-padding: 14px;
        --mobile-card-radius: 26px;
        --mobile-shadow: 0 14px 34px rgba(46, 62, 96, 0.13);
    }

    html {
        scroll-behavior: smooth;
        scroll-padding-top: 82px;
    }

    body {
        min-width: 320px;
    }

    img,
    iframe {
        max-width: 100%;
    }

    .header__shell {
        min-height: 72px !important;
        padding: 6px 16px !important;
    }

    .header__mobile-bar {
        min-height: 60px !important;
    }

    .header__mobile-logo {
        width: 102px !important;
        height: 58px !important;
    }

    .header__mobile-burger {
        width: 48px !important;
        height: 48px !important;
        border-radius: 15px !important;
    }

    .mobile-menu__panel {
        padding-top: calc(16px + env(safe-area-inset-top)) !important;
    }

    .mobile-menu__nav {
        gap: 18px !important;
        margin-top: 24px !important;
    }

    .mobile-menu__link {
        font-size: clamp(28px, 8vw, 38px) !important;
    }

    .hero {
        min-height: calc(100svh - 72px) !important;
        max-height: 760px;
        padding: 54px 18px 46px !important;
        background-position: center !important;
    }

    .hero__content {
        width: min(100%, 520px);
        margin: 0 auto !important;
    }

    .hero__label {
        margin-bottom: 14px !important;
        font-size: clamp(17px, 4.6vw, 22px) !important;
    }

    .hero__title {
        margin-bottom: 24px !important;
        font-size: clamp(42px, 12vw, 62px) !important;
        line-height: 0.98 !important;
    }

    .hero__subtitle {
        max-width: 520px;
        margin-bottom: 34px !important;
        font-size: clamp(27px, 7.5vw, 38px) !important;
        line-height: 1.18 !important;
    }

    .hero__button {
        width: min(100%, 330px) !important;
        min-height: 68px !important;
        padding: 12px 22px !important;
        border-radius: 24px !important;
        font-size: clamp(21px, 5.7vw, 27px) !important;
        line-height: 1.18 !important;
    }

    .hero .hero__arrow {
        display: flex !important;
        width: 42px !important;
        height: 42px !important;
        font-size: 36px !important;
        opacity: 0.78;
    }

    .hero .hero__arrow--left {
        left: 8px !important;
    }

    .hero .hero__arrow--right {
        right: 8px !important;
    }

    .hero__dots {
        bottom: 18px !important;
        gap: 9px !important;
    }

    .hero__dot {
        width: 13px !important;
        height: 13px !important;
    }

    .services {
        min-height: 0 !important;
        padding: 56px var(--mobile-page-padding) 74px !important;
    }

    .services__container {
        max-width: 680px !important;
    }

    .services__title {
        margin-bottom: 34px !important;
        font-size: clamp(36px, 10vw, 48px) !important;
    }

    .services__title::after {
        bottom: -12px !important;
        width: 150px !important;
    }

    .services__list {
        gap: 18px !important;
    }

    .service-row,
    .service-row--cat,
    .service-row--dog,
    .service-row--bird {
        display: grid !important;
        grid-template-columns: 94px minmax(0, 1fr) !important;
        grid-template-areas:
            "image title"
            "chips chips"
            "all all" !important;
        align-items: center !important;
        width: 100% !important;
        max-width: 680px !important;
        min-height: 0 !important;
        margin: 0 auto !important;
        padding: 18px 14px 16px !important;
        gap: 14px 12px !important;
        border-radius: var(--mobile-card-radius) !important;
        overflow: hidden !important;
        box-shadow: var(--mobile-shadow) !important;
    }

    .service-row__content,
    .service-row--cat .service-row__content,
    .service-row--dog .service-row__content,
    .service-row--bird .service-row__content {
        display: contents !important;
        max-width: none !important;
        margin: 0 !important;
        overflow: visible !important;
    }

    .service-row__image,
    .service-row__image--cat,
    .service-row__image--dog,
    .service-row__image--bird,
    .service-row--dog .service-row__image {
        grid-area: image !important;
        align-self: center !important;
        justify-self: center !important;
        order: initial !important;
        width: 90px !important;
        height: 108px !important;
        max-width: 90px !important;
        object-fit: contain !important;
    }

    .service-row__title {
        grid-area: title !important;
        align-self: center !important;
        justify-self: stretch !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        padding-bottom: 13px !important;
        font-size: clamp(27px, 7.7vw, 35px) !important;
        line-height: 1.04 !important;
        text-align: left !important;
    }

    .service-row__title::after {
        left: 0 !important;
        bottom: 0 !important;
        width: 96px !important;
        transform: none !important;
    }

    .service-row__chips,
    .service-row--cat .service-row__chips,
    .service-row--dog .service-row__chips,
    .service-row--bird .service-row__chips {
        grid-area: chips !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 8px !important;
    }

    .service-row__chips .service-chip:nth-child(n),
    .service-row--cat .service-row__chips .service-chip:nth-child(n),
    .service-row--dog .service-row__chips .service-chip:nth-child(n),
    .service-row--bird .service-row__chips .service-chip:nth-child(n),
    .service-chip,
    .service-chip--wide,
    .service-chip--small,
    .service-chip--medium,
    .service-chip--large,
    .service-chip--xlarge {
        grid-column: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        min-height: 52px !important;
        padding: 8px 9px 8px 11px !important;
        border-width: 1.5px !important;
        border-radius: 13px !important;
        font-size: clamp(13px, 3.65vw, 16px) !important;
        line-height: 1.14 !important;
        text-align: left !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
    }

    .service-chip span {
        margin-left: 6px !important;
        border-top-width: 6px !important;
        border-bottom-width: 6px !important;
        border-left-width: 8px !important;
    }

    .service-row__all {
        grid-area: all !important;
        width: 100% !important;
        min-height: 46px;
        margin: 2px 0 0 !important;
        padding: 12px 40px 10px 14px !important;
        border: 0 !important;
        border-radius: 14px !important;
        background: rgba(148, 64, 213, 0.08);
        color: #7830aa !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        text-align: left !important;
    }

    .service-row__all::after {
        left: auto !important;
        right: 16px !important;
        bottom: 50% !important;
        border: 0 !important;
        content: "→" !important;
        transform: translateY(50%) !important;
        color: #9440d5;
        font-size: 24px;
        line-height: 1;
    }

    .exotic-service {
        width: 100% !important;
        margin: 18px auto 0 !important;
        padding: 28px 18px !important;
        border-radius: var(--mobile-card-radius) !important;
    }

    .exotic-service__label {
        margin-bottom: 12px !important;
        padding: 7px 13px !important;
        font-size: 13px !important;
    }

    .exotic-service__title {
        width: auto !important;
        margin-bottom: 27px !important;
        font-size: 30px !important;
        line-height: 1.08 !important;
    }

    .exotic-service__text {
        margin-bottom: 20px !important;
        font-size: 16px !important;
        line-height: 1.48 !important;
    }

    .exotic-service__tags {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px !important;
        margin-bottom: 22px !important;
    }

    .exotic-service__tags span {
        min-height: 42px !important;
        padding: 7px 9px !important;
        font-size: 13px !important;
        line-height: 1.15;
        white-space: normal !important;
    }

    .exotic-service__button {
        width: 100% !important;
        min-height: 54px !important;
        padding: 10px 16px !important;
        border-radius: 16px !important;
        font-size: 17px !important;
    }

    .articles {
        padding: 62px var(--mobile-page-padding) 72px !important;
    }

    .articles__title {
        margin-bottom: 38px !important;
        font-size: clamp(38px, 10vw, 50px) !important;
    }

    .articles__title::after {
        bottom: -12px !important;
        width: 150px !important;
    }

    .articles__stack {
        min-height: 0 !important;
        padding: 0 42px !important;
    }

    .articles__cards {
        min-height: 0 !important;
    }

    .article-card,
    .article-card.is-active,
    .article-card.is-prev-1,
    .article-card.is-prev-2,
    .article-card.is-next-1,
    .article-card.is-next-2 {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        display: none;
        width: 100% !important;
        max-width: none !important;
        min-height: 0 !important;
        padding: 20px 18px 22px !important;
        border-radius: 22px !important;
        opacity: 1 !important;
        transform: none !important;
    }

    .article-card.is-active {
        display: block !important;
    }

    .article-card__top {
        margin-bottom: 14px !important;
        font-size: 13px !important;
    }

    .article-card h3 {
        margin-bottom: 14px !important;
        font-size: clamp(23px, 6.5vw, 29px) !important;
        line-height: 1.15 !important;
    }

    .article-card p {
        display: -webkit-box;
        overflow: hidden;
        font-size: 15px !important;
        line-height: 1.48 !important;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 5;
    }

    .article-card__bottom {
        margin-top: 18px !important;
    }

    .articles__arrow {
        top: 50% !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 38px !important;
        height: 48px !important;
        font-size: 46px !important;
        color: rgba(70, 70, 70, 0.58) !important;
    }

    .articles__footer {
        margin-top: 22px !important;
    }

    .articles__footer a {
        min-height: 54px !important;
        padding: 10px 18px !important;
        border-radius: 16px !important;
        font-size: 18px !important;
    }

    .contact-banner {
        min-height: 470px !important;
        padding: 62px 18px 120px !important;
    }

    .contact-banner__content h2 {
        font-size: clamp(40px, 11vw, 54px) !important;
        line-height: 1.05;
    }

    .contact-banner__content p {
        margin: 8px 0 34px !important;
        font-size: 25px !important;
    }

    .contact-banner__content a {
        width: min(100%, 320px) !important;
        min-height: 82px !important;
        padding: 14px 20px !important;
        border-radius: 26px !important;
        font-size: 22px !important;
        line-height: 1.2;
    }

    .contacts {
        margin-top: -76px !important;
        background: linear-gradient(to bottom, transparent 0, transparent 76px, #f0f5ff 76px) !important;
    }

    .contacts__card {
        grid-template-columns: 1fr !important;
        gap: 28px !important;
        min-height: 0 !important;
        padding: 28px 18px 16px !important;
        border-radius: 30px 30px 0 0 !important;
    }

    .contacts__info {
        padding: 0 !important;
    }

    .contacts__info h2 {
        margin-bottom: 4px !important;
        font-size: 38px !important;
    }

    .contacts__address {
        margin-bottom: 24px !important;
        font-size: 16px !important;
        line-height: 1.4;
    }

    .contacts__info h3 {
        margin: 24px 0 6px !important;
        font-size: 22px !important;
    }

    .contacts__info p,
    .contacts__phones a,
    .contacts__mail {
        font-size: 17px !important;
        line-height: 1.45;
    }

    .contacts__socials a {
        width: 58px !important;
        height: 58px !important;
    }

    .contacts__map-frame {
        min-height: 285px !important;
        border-radius: 18px !important;
    }

    .contacts__copy {
        padding: 12px 0 18px !important;
        font-size: 16px !important;
    }

    .service-modal {
        padding: 14px !important;
    }

    .service-modal__window {
        padding: 30px 16px 20px !important;
        border-radius: 24px !important;
    }

    .service-modal__title {
        font-size: 24px !important;
    }

    .service-modal__price {
        font-size: 20px !important;
    }

    .service-modal__phone {
        font-size: 21px !important;
    }

    .service-modal__btn {
        min-width: 100% !important;
        min-height: 52px !important;
    }

    /* Services catalog page */
    .services-main {
        padding-top: 0 !important;
    }

    .services-hero {
        min-height: clamp(350px, 52svh, 480px) !important;
        padding: 54px 18px !important;
        background-position: center !important;
    }

    .services-hero__content h1 {
        font-size: clamp(44px, 12vw, 60px) !important;
    }

    .services-hero__content p {
        font-size: clamp(18px, 5vw, 23px) !important;
    }

    .price-list {
        padding: 46px var(--mobile-page-padding) 70px !important;
        background: linear-gradient(180deg, #f7faff 0%, #e6efff 100%) !important;
    }

    .price-list__container {
        max-width: 680px !important;
    }

    .animal-section {
        min-height: 0 !important;
        margin: 0 0 18px !important;
        padding: 24px 14px 20px !important;
        border: 1px solid rgba(77, 100, 138, 0.1) !important;
        border-radius: 28px !important;
        background: rgba(255, 255, 255, 0.95);
        box-shadow: var(--mobile-shadow);
        overflow: hidden !important;
    }

    .animal-section + .animal-section {
        margin-top: 18px !important;
        padding-top: 24px !important;
        border-top: 1px solid rgba(77, 100, 138, 0.1) !important;
    }

    .animal-section__title {
        width: auto !important;
        margin: 0 0 30px !important;
        padding-right: 72px;
        font-size: clamp(27px, 7.6vw, 36px) !important;
        line-height: 1.12 !important;
        text-align: left !important;
    }

    .animal-section__title::after {
        left: 0 !important;
        bottom: -12px !important;
        width: 118px !important;
        height: 3px !important;
        transform: none !important;
    }

    .animal-section__bg,
    .animal-section__bg--cat,
    .animal-section__bg--dog,
    .animal-section__bg--bird {
        top: 14px !important;
        right: 10px !important;
        left: auto !important;
        width: 76px !important;
        max-width: 76px !important;
        height: 92px;
        opacity: 0.13 !important;
        object-fit: contain;
        transform: none !important;
    }

    .animal-section__grid {
        display: grid !important;
        grid-template-columns: 1fr !important;
        max-width: none !important;
        margin: 0 !important;
        gap: 24px !important;
    }

    .price-category,
    .price-category--surgery,
    .price-category--therapy,
    .price-category--care,
    .price-category--vaccine {
        grid-column: auto !important;
        grid-row: auto !important;
    }

    .price-category__title {
        justify-content: flex-start !important;
        margin-bottom: 12px !important;
        font-size: 22px !important;
        line-height: 1.15 !important;
        text-align: left !important;
    }

    .price-category__list,
    .price-category--surgery .price-category__list {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .price-item {
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: center !important;
        min-width: 0 !important;
        min-height: 72px !important;
        padding: 9px 25px 9px 10px !important;
        border-width: 1.5px !important;
        border-radius: 13px !important;
        font-size: clamp(12px, 3.25vw, 14px) !important;
        line-height: 1.18 !important;
        text-align: left !important;
        overflow-wrap: anywhere;
    }

    .price-item::after {
        position: absolute;
        top: 50%;
        right: 8px;
        margin: 0 !important;
        border-top-width: 6px !important;
        border-bottom-width: 6px !important;
        border-left-width: 8px !important;
        transform: translateY(-50%);
    }

    .price-item strong {
        margin: 5px 0 0 !important;
        font-size: 12px;
        white-space: normal !important;
    }

    .animal-section--exotic {
        padding-bottom: 20px !important;
    }

    .exotic-card {
        padding: 26px 14px !important;
        border-radius: 22px !important;
    }

    .exotic-card__badge {
        min-height: 34px !important;
        margin-bottom: 12px !important;
        padding: 5px 12px !important;
        font-size: 13px !important;
    }

    .exotic-card__title {
        width: auto !important;
        margin-bottom: 24px !important;
        font-size: 27px !important;
    }

    .exotic-card__text {
        margin-bottom: 20px !important;
        font-size: 15px !important;
        line-height: 1.48 !important;
    }

    .exotic-card__animals {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px !important;
        margin-bottom: 22px !important;
    }

    .exotic-card__animals span {
        min-height: 42px !important;
        padding: 7px 8px !important;
        font-size: 13px !important;
        line-height: 1.15;
    }

    .exotic-card__button {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 54px !important;
        padding: 10px 14px !important;
        border-radius: 16px !important;
        font-size: 16px !important;
    }

    .services-bottom {
        padding: 42px var(--mobile-page-padding) 64px !important;
    }

    .services-bottom__card {
        padding: 28px 18px !important;
        border-radius: 26px !important;
    }

    .services-bottom__card h2 {
        font-size: 29px !important;
    }

    .services-bottom__card p {
        margin-bottom: 22px !important;
        font-size: 16px !important;
    }

    .services-bottom__card a {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 56px !important;
        padding: 10px 16px !important;
        border-radius: 17px !important;
        font-size: 18px !important;
    }

    /* Articles page */
    .articles-page {
        padding-top: 0 !important;
    }

    .articles-hero {
        min-height: clamp(350px, 52svh, 480px) !important;
        padding: 54px 18px !important;
    }

    .articles-hero__content {
        margin-top: 0 !important;
    }

    .articles-hero h1 {
        font-size: clamp(44px, 12vw, 60px) !important;
    }

    .articles-hero p {
        font-size: clamp(18px, 5vw, 22px) !important;
    }

    .articles-catalog {
        padding: 48px var(--mobile-page-padding) 70px !important;
    }

    .articles-catalog__head {
        margin-bottom: 26px !important;
    }

    .articles-catalog__head h2 {
        font-size: clamp(34px, 9vw, 44px) !important;
    }

    .articles-catalog__head h2::after {
        width: 150px !important;
    }

    .articles-search {
        margin-bottom: 16px !important;
    }

    .articles-search__input {
        min-height: 52px !important;
        padding: 10px 16px !important;
        border-radius: 16px !important;
        font-size: 16px !important;
    }

    .articles-filters {
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
        margin: 0 calc(-1 * var(--mobile-page-padding)) 24px !important;
        padding: 0 var(--mobile-page-padding) 5px !important;
        gap: 8px !important;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scrollbar-width: none;
    }

    .articles-filters::-webkit-scrollbar {
        display: none;
    }

    .articles-filter {
        flex: 0 0 auto;
        min-height: 44px !important;
        padding: 8px 15px !important;
        font-size: 14px !important;
        white-space: nowrap;
    }

    .articles-list {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    .post-card,
    .post-card--expanded {
        height: auto !important;
        min-height: 0 !important;
        padding: 20px 17px !important;
        border-radius: 22px !important;
    }

    .post-card__top {
        margin-bottom: 12px !important;
        font-size: 13px !important;
    }

    .post-card__image {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 16 / 9;
        margin-bottom: 14px !important;
        border-radius: 16px !important;
        object-fit: cover;
    }

    .post-card h3 {
        margin-bottom: 14px !important;
        font-size: 24px !important;
        line-height: 1.18 !important;
    }

    .post-card__content {
        display: -webkit-box !important;
        overflow: hidden !important;
        font-size: 15px !important;
        line-height: 1.48 !important;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 6;
    }

    .post-card--expanded .post-card__content {
        display: block !important;
        overflow: visible !important;
        -webkit-line-clamp: initial;
    }

    .post-card__bottom {
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        margin-top: 18px !important;
        gap: 10px !important;
    }

    .post-card__expand,
    .post-card__additional-link {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        font-size: 14px !important;
    }

    /* About page */
    .about-hero {
        min-height: clamp(370px, 55svh, 500px) !important;
        padding: 54px 18px !important;
    }

    .about-hero__content {
        margin-top: 0 !important;
    }

    .about-hero__label {
        margin-bottom: 14px !important;
        font-size: 19px !important;
    }

    .about-hero__title {
        margin-bottom: 20px !important;
        font-size: clamp(43px, 12vw, 60px) !important;
    }

    .about-hero__text {
        font-size: 17px !important;
        line-height: 1.45 !important;
    }

    .about-clinic {
        padding: 54px var(--mobile-page-padding) 64px !important;
    }

    .about-clinic__head {
        margin-bottom: 32px !important;
    }

    .about-clinic__head h2 {
        width: auto !important;
        margin-bottom: 26px !important;
        font-size: 38px !important;
        line-height: 1.06 !important;
    }

    .about-clinic__head h2::after {
        bottom: -12px !important;
        width: 150px !important;
    }

    .about-clinic__head p {
        font-size: 16px !important;
    }

    .about-clinic__grid {
        gap: 14px !important;
    }

    .about-card,
    .about-card--large {
        min-height: 0 !important;
        padding: 22px 18px !important;
        border-radius: 22px !important;
    }

    .about-card h3 {
        margin-bottom: 10px !important;
        font-size: 25px !important;
    }

    .about-card p {
        font-size: 15px !important;
        line-height: 1.5 !important;
    }

    .chief {
        padding: 58px var(--mobile-page-padding) 66px !important;
    }

    .chief__container {
        gap: 30px !important;
    }

    .chief__photo {
        width: min(100%, 340px) !important;
        border-radius: 26px !important;
    }

    .chief__photo img {
        height: 360px !important;
    }

    .chief__label {
        margin-bottom: 13px !important;
        padding: 8px 14px !important;
        font-size: 14px !important;
    }

    .chief__content h2 {
        margin-bottom: 16px !important;
        font-size: 35px !important;
        line-height: 1.08 !important;
    }

    .chief__lead {
        margin-bottom: 26px !important;
        font-size: 18px !important;
    }

    .chief__blocks {
        gap: 12px !important;
    }

    .chief-info,
    .chief-info--wide {
        padding: 20px 17px !important;
        border-radius: 21px !important;
    }

    .chief-info h3 {
        margin-bottom: 10px !important;
        font-size: 23px !important;
    }

    .chief-info p,
    .chief-info li {
        font-size: 15px !important;
        line-height: 1.5 !important;
    }

    .about-values {
        padding: 54px var(--mobile-page-padding) 66px !important;
    }

    .about-values h2 {
        margin-bottom: 32px !important;
        font-size: 37px !important;
    }

    .about-values__grid {
        gap: 14px !important;
    }

    .value-card {
        padding: 21px 18px !important;
        border-radius: 22px !important;
    }

    .value-card span {
        margin-bottom: 10px !important;
        font-size: 17px !important;
    }

    .value-card h3 {
        margin-bottom: 9px !important;
        font-size: 24px !important;
    }

    .value-card p {
        font-size: 15px !important;
        line-height: 1.5 !important;
    }
}

@media (max-width: 370px) {
    :root {
        --mobile-page-padding: 10px;
    }

    .service-row,
    .service-row--cat,
    .service-row--dog,
    .service-row--bird {
        grid-template-columns: 82px minmax(0, 1fr) !important;
        padding-right: 11px !important;
        padding-left: 11px !important;
    }

    .service-row__image,
    .service-row__image--cat,
    .service-row__image--dog,
    .service-row__image--bird,
    .service-row--dog .service-row__image {
        width: 78px !important;
        height: 98px !important;
        max-width: 78px !important;
    }

    .service-chip,
    .service-chip--wide,
    .service-chip--small,
    .service-chip--medium,
    .service-chip--large,
    .service-chip--xlarge {
        font-size: 12px !important;
    }

    .price-item {
        font-size: 11.5px !important;
    }
}

@media (max-width: 980px) {
    .price-category__toggle {
        justify-content: space-between !important;
        min-height: 48px;
        padding: 8px 10px !important;
        border-radius: 14px;
        background: rgba(148, 64, 213, 0.08);
        cursor: pointer;
        touch-action: manipulation;
    }

    .price-category__meta {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        flex: 0 0 auto;
    }

    .price-category__count {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 28px;
        height: 28px;
        padding: 0 7px;
        border-radius: 999px;
        background: #ffffff;
        color: #7830aa;
        font-size: 12px;
        font-weight: 700;
    }

    .price-category__chevron {
        color: #7830aa;
        font-size: 24px;
        line-height: 1;
        transform: rotate(180deg);
        transition: transform 0.2s ease;
    }

    .price-category.is-collapsed .price-category__chevron {
        transform: rotate(0deg);
    }

    .price-category.is-collapsed .price-category__list {
        display: none !important;
    }
}

@media (max-width: 980px) {
    .hero {
        display: flex !important;
        align-items: center !important;
    }

    .hero .hero__arrow {
        display: none !important;
    }
}