/* 
  ==============================
  North County Dental Button Styles
  ==============================
*/ 
.ncdic-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
}
.ncdic-btn .ncdic-btn-icon {
    display: flex;
    align-items: center;
    font-size: 1.25rem;
    transition: filter 0.2s;
}
.ncdic-btn .ncdic-btn-icon svg {
    width: 1em;
    height: 1em;
    display: block;
}
.ncdic-btn .ncdic-btn-icon img {
    width: 1em;
    height: 1em;
    display: block;
}
.ncdic-btn span {
    display: inline-block;
    font-size: 1rem;
    text-transform: uppercase;
}
.ncdic-btn .ncdic-btn-icon.color-white svg {
    filter: invert(1) brightness(2);
}
.ncdic-btn .ncdic-btn-icon.color-black svg,
.ncdic-btn .ncdic-btn-icon.color-blue svg,
.ncdic-btn .ncdic-btn-icon.color-pink svg {
    filter: none;
}
.ncdic-btn__icon-img--play {
    max-height: 18px;
}
.ncdic-btn__icon-img--money {
    max-height: 18px;
}
.ncdic-btn__icon-img--top_right_arrow {
    max-height: 14px;
}
@media (max-width: 600px) {
    .ncdic-btn {
        min-height: 44px;
        font-size: 1rem;
        padding: 0 1.5rem;
    }
}


/******************************************************  Button Animation Styles  ******************************************************/
.ncdic-btn-icon-wrapper,
.ncdic-btn .ncdic-btn-icon {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    font-size: 1.25rem;
    width: 1.1em;
    height: 1.1em;
    transition: filter 0.2s;
}

.ncdic-btn .ncdic-btn-icon--original,
.ncdic-btn .ncdic-btn-icon--hover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: transform 0.4s cubic-bezier(0.76, 0, 0.24, 1);
    backface-visibility: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1px;
}

/******************************************************  Animation Classes  ******************************************************/

/* --- Left to Right --- */
.ncdic-btn.anima-btn-left_to_right .ncdic-btn-icon--hover {
    transform: translateX(-105%);
}
.ncdic-btn.anima-btn-left_to_right:hover .ncdic-btn-icon--original {
    transform: translateX(105%);
}
.ncdic-btn.anima-btn-left_to_right:hover .ncdic-btn-icon--hover {
    transform: translateX(0);
}

/* --- To Top --- */
.ncdic-btn.anima-btn-bottom_to_top .ncdic-btn-icon--hover {
    transform: translateY(105%);
}
.ncdic-btn.anima-btn-bottom_to_top:hover .ncdic-btn-icon--original {
    transform: translateY(-105%);
}
.ncdic-btn.anima-btn-bottom_to_top:hover .ncdic-btn-icon--hover {
    transform: translateY(0);
}

/* --- Diagonal Top Right --- */
.ncdic-btn.anima-btn-diagonal_top_right .ncdic-btn-icon--hover {
    transform: translate(-105%, 105%);
}
.ncdic-btn.anima-btn-diagonal_top_right:hover .ncdic-btn-icon--original {
    transform: translate(105%, -105%);
}
.ncdic-btn.anima-btn-diagonal_top_right:hover .ncdic-btn-icon--hover {
    transform: translate(0, 0);
}

/******************************************************  Text Animation Styles  ******************************************************/
.anima-text {
    position: relative;
    display: inline-block;
    overflow: hidden;
}

.anima-text .text-original,
.anima-text .text-hover {
    display: inline-block;
    transition: transform 0.4s cubic-bezier(0.76, 0, 0.24, 1);
    white-space: nowrap;
}

.anima-text .text-hover {
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(100%);
}

.anima-text:hover .text-original {
    transform: translateY(-100%);
}

.anima-text:hover .text-hover {
    transform: translateY(0);
}

/* Letter by letter animation */
.anima-text-letter {
    position: relative;
    display: inline-block;
    overflow: hidden;
}

.anima-text-letter .letter-original,
.anima-text-letter .letter-hover {
    display: inline-block;
    transition: transform 0.3s cubic-bezier(0.76, 0, 0.24, 1);
}

.anima-text-letter .letter-hover {
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(100%);
}

.anima-text-letter:hover .letter-original {
    transform: translateY(-100%);
}

.anima-text-letter:hover .letter-hover {
    transform: translateY(0);
}

.anima-text-sequential {
    position: relative;
    display: inline-block;
    overflow: hidden;
}

.anima-text-sequential .text-original,
.anima-text-sequential .text-hover {
    display: inline-block;
    white-space: nowrap;
}

.anima-text-sequential .text-hover {
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(100%);
}

.anima-text-sequential .text-original span,
.anima-text-sequential .text-hover span {
    display: inline-block;
    transition: transform 0.3s cubic-bezier(0.76, 0, 0.24, 1);
}

.anima-text-sequential .text-hover span {
    transform: translateY(100%);
}

.anima-text-sequential:hover .text-original span {
    transform: translateY(-100%);
}

.anima-text-sequential:hover .text-hover span {
    transform: translateY(0);
}

.ncdic-btn.anima-text-btn {
    position: relative;
    overflow: hidden;
}

.ncdic-btn.anima-text-btn span {
    position: relative;
    display: inline-block;
    overflow: hidden;
    width: 100%;
    height: 1.5em;
    min-height: 1.5em;
}

.ncdic-btn.anima-text-btn .text-original,
.ncdic-btn.anima-text-btn .text-hover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    pointer-events: none;
}

.ncdic-btn.anima-text-btn .text-original {
    position: relative;
    transform: translateY(0);
    z-index: 2;
}

.ncdic-btn.anima-text-btn .text-hover {
    transform: translateY(100%);
    z-index: 1;
}

.ncdic-btn.anima-text-btn .text-hover .char {
    transform: translateY(100%);
    opacity: 0;
}

.ncdic-btn.anima-text-btn .char {
    display: inline-table;
    transition: all 0.4s cubic-bezier(0.76, 0, 0.24, 1);
    transform: translateY(0);
    opacity: 1;
}

/* Hover states */
.ncdic-btn.anima-text-btn:hover .text-original .char {
    transform: translateY(-100%);
    opacity: 0;
}

.ncdic-btn.anima-text-btn:hover .text-hover .char {
    transform: translateY(-200%);
    opacity: 1;
}

.ncdic-btn.anima-text-btn:hover .text-original {
    z-index: 1;
}

.ncdic-btn.anima-text-btn:hover .text-hover {
    z-index: 2;
}

.ncdic-btn.anima-text-btn .text-original .char {
    transform: translateY(0);
    opacity: 1;
}


/* Generate delays for each letter (up to 40 letters) */
.anima-text-sequential:hover .text-original span:nth-child(1),
.anima-text-sequential:hover .text-hover span:nth-child(1) { transition-delay: 0s; }

.anima-text-sequential:hover .text-original span:nth-child(2),
.anima-text-sequential:hover .text-hover span:nth-child(2) { transition-delay: 0.05s; }

.anima-text-sequential:hover .text-original span:nth-child(3),
.anima-text-sequential:hover .text-hover span:nth-child(3) { transition-delay: 0.1s; }

.anima-text-sequential:hover .text-original span:nth-child(4),
.anima-text-sequential:hover .text-hover span:nth-child(4) { transition-delay: 0.15s; }

.anima-text-sequential:hover .text-original span:nth-child(5),
.anima-text-sequential:hover .text-hover span:nth-child(5) { transition-delay: 0.2s; }

.anima-text-sequential:hover .text-original span:nth-child(6),
.anima-text-sequential:hover .text-hover span:nth-child(6) { transition-delay: 0.25s; }

.anima-text-sequential:hover .text-original span:nth-child(7),
.anima-text-sequential:hover .text-hover span:nth-child(7) { transition-delay: 0.3s; }

.anima-text-sequential:hover .text-original span:nth-child(8),
.anima-text-sequential:hover .text-hover span:nth-child(8) { transition-delay: 0.35s; }

.anima-text-sequential:hover .text-original span:nth-child(9),
.anima-text-sequential:hover .text-hover span:nth-child(9) { transition-delay: 0.4s; }

.anima-text-sequential:hover .text-original span:nth-child(10),
.anima-text-sequential:hover .text-hover span:nth-child(10) { transition-delay: 0.45s; }

.anima-text-sequential:hover .text-original span:nth-child(11),
.anima-text-sequential:hover .text-hover span:nth-child(11) { transition-delay: 0.5s; }

.anima-text-sequential:hover .text-original span:nth-child(12),
.anima-text-sequential:hover .text-hover span:nth-child(12) { transition-delay: 0.55s; }

.anima-text-sequential:hover .text-original span:nth-child(13),
.anima-text-sequential:hover .text-hover span:nth-child(13) { transition-delay: 0.6s; }

.anima-text-sequential:hover .text-original span:nth-child(14),
.anima-text-sequential:hover .text-hover span:nth-child(14) { transition-delay: 0.65s; }

.anima-text-sequential:hover .text-original span:nth-child(15),
.anima-text-sequential:hover .text-hover span:nth-child(15) { transition-delay: 0.7s; }

.anima-text-sequential:hover .text-original span:nth-child(16),
.anima-text-sequential:hover .text-hover span:nth-child(16) { transition-delay: 0.75s; }

.anima-text-sequential:hover .text-original span:nth-child(17),
.anima-text-sequential:hover .text-hover span:nth-child(17) { transition-delay: 0.8s; }

.anima-text-sequential:hover .text-original span:nth-child(18),
.anima-text-sequential:hover .text-hover span:nth-child(18) { transition-delay: 0.85s; }

.anima-text-sequential:hover .text-original span:nth-child(19),
.anima-text-sequential:hover .text-hover span:nth-child(19) { transition-delay: 0.9s; }

.anima-text-sequential:hover .text-original span:nth-child(20),
.anima-text-sequential:hover .text-hover span:nth-child(20) { transition-delay: 0.95s; }

.anima-text-sequential:hover .text-original span:nth-child(21),
.anima-text-sequential:hover .text-hover span:nth-child(21) { transition-delay: 1s; }

.anima-text-sequential:hover .text-original span:nth-child(22),
.anima-text-sequential:hover .text-hover span:nth-child(22) { transition-delay: 1.05s; }

.anima-text-sequential:hover .text-original span:nth-child(23),
.anima-text-sequential:hover .text-hover span:nth-child(23) { transition-delay: 1.1s; }

.anima-text-sequential:hover .text-original span:nth-child(24),
.anima-text-sequential:hover .text-hover span:nth-child(24) { transition-delay: 1.15s; }

.anima-text-sequential:hover .text-original span:nth-child(25),
.anima-text-sequential:hover .text-hover span:nth-child(25) { transition-delay: 1.2s; }

.anima-text-sequential:hover .text-original span:nth-child(26),
.anima-text-sequential:hover .text-hover span:nth-child(26) { transition-delay: 1.25s; }

.anima-text-sequential:hover .text-original span:nth-child(27),
.anima-text-sequential:hover .text-hover span:nth-child(27) { transition-delay: 1.3s; }

.anima-text-sequential:hover .text-original span:nth-child(28),
.anima-text-sequential:hover .text-hover span:nth-child(28) { transition-delay: 1.35s; }

.anima-text-sequential:hover .text-original span:nth-child(29),
.anima-text-sequential:hover .text-hover span:nth-child(29) { transition-delay: 1.4s; }

.anima-text-sequential:hover .text-original span:nth-child(30),
.anima-text-sequential:hover .text-hover span:nth-child(30) { transition-delay: 1.45s; }

.anima-text-sequential:hover .text-original span:nth-child(31),
.anima-text-sequential:hover .text-hover span:nth-child(31) { transition-delay: 1.5s; }

.anima-text-sequential:hover .text-original span:nth-child(32),
.anima-text-sequential:hover .text-hover span:nth-child(32) { transition-delay: 1.55s; }

.anima-text-sequential:hover .text-original span:nth-child(33),
.anima-text-sequential:hover .text-hover span:nth-child(33) { transition-delay: 1.6s; }

.anima-text-sequential:hover .text-original span:nth-child(34),
.anima-text-sequential:hover .text-hover span:nth-child(34) { transition-delay: 1.65s; }

.anima-text-sequential:hover .text-original span:nth-child(35),
.anima-text-sequential:hover .text-hover span:nth-child(35) { transition-delay: 1.7s; }

.anima-text-sequential:hover .text-original span:nth-child(36),
.anima-text-sequential:hover .text-hover span:nth-child(36) { transition-delay: 1.75s; }

.anima-text-sequential:hover .text-original span:nth-child(37),
.anima-text-sequential:hover .text-hover span:nth-child(37) { transition-delay: 1.8s; }

.anima-text-sequential:hover .text-original span:nth-child(38),
.anima-text-sequential:hover .text-hover span:nth-child(38) { transition-delay: 1.85s; }

.anima-text-sequential:hover .text-original span:nth-child(39),
.anima-text-sequential:hover .text-hover span:nth-child(39) { transition-delay: 1.9s; }

.anima-text-sequential:hover .text-original span:nth-child(40),
.anima-text-sequential:hover .text-hover span:nth-child(40) { transition-delay: 1.95s; }



/* Simple Text Link */

.ncdic-pre-text {
    font-size: 1.6rem;
    line-height: 1.15;
    margin-bottom: 2rem;
    color: var(--prussian_blue);
}

.hero-button-wrapper .ncdic-pre-text + a {
    font-size: 1.6rem;
    line-height: 1.15;
    display: inline-block;
    margin-bottom: 2rem;
    color: var(--prussian_blue);
    font-weight: 600;
}