/*
Theme Name: Mitch Sullivan.
Author: Steve Crofts - Glowmedia.
Description: A custom block theme for Mitch.
Version: 1.0.
Requires at least: 6.9. 
Tested up to: 7.0.
Requires PHP: 8.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mitch-sullivan.
*/


html {
  scroll-behavior: smooth;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.nameplate p {
    font-family: var(--wp--preset--font-family--sans);
    font-weight: 900;
    font-size: clamp(28px,5.4vw,60px);
    line-height: .86;
    letter-spacing: -.04em;
    text-transform: uppercase;
}

.nameplate .sub {
        display: block;
        font-family: var(--wp--preset--font-family--mono);
        font-weight: 500;
        font-size: 12px;
        letter-spacing: .12em;
        text-transform: uppercase;
        color: var(--wp--preset--color--grey);
        margin-top: 13px;
    }






.wp-block-navigation-item a {
    padding-bottom: 3px;
}
.wp-block-navigation-item a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    height:1.5px;
    width:0%;
    background:var(--wp--preset--color--red);
    transition:width .25s ease
}


.wp-block-navigation-item a:hover::after {
    width: 100%
}

.no-bullets {
    list-style-type: none;
}

.wp-block-navigation__responsive-container-open {
    border: 1px solid var(--wp--preset--color--grey);
    padding: 8px 12px;
}

.red-text {
    color: var(--wp--preset--color--red);
}


/** Animation **/

@media (prefers-reduced-motion: no-preference) {

 .reveal {
                opacity: 0;
                transform: translateY(20px);
                transition: opacity .7s ease,transform .7s ease
            }

            .reveal.in {
                opacity: 1;
                transform: none
            }

            .load {
                opacity: 0;
                transform: translateY(14px);
                animation: rise .8s cubic-bezier(.2,.7,.2,1) forwards
            }

            @keyframes rise {
                to {
                    opacity: 1;
                    transform: none
                }
            }

            .d1 {
                animation-delay: .05s
            }

            .d2 {
                animation-delay: .2s
            }

            .d3 {
                animation-delay: .36s
            }

            .d4 {
                animation-delay: .52s
            }

            .d5 {
                animation-delay: .68s
            }
}

/** Testimonials **/
.testimonial-content p{
    color: var(--wp--preset--color--grey);
    font-size: 18px;
    line-height: 1.5;
}

.testimonial-name {
    font-family: var(--wp--preset--font-family--mono);
    color: var(--wp--preset--color--greymid);
    font-size: 11px;
    line-height: 1.5;
    text-transform: uppercase;
}


/** Course Cards **/

.card {
    display: block;
    text-decoration: none;
    border: 1px solid var(--wp--preset--color--linestrong);
    padding: 22px;
    background: #fff;
    transition: transform .15s ease,box-shadow .15s ease;

    h4 {
        padding: 0;
        margin: 12px 0 0;
    }

    p{
        margin: 12px 0;
    }
}

    .card:hover {
        transform: translate(-2px,-2px);
        box-shadow: 5px 5px 0 var(--wp--preset--color--red);
    }

    .card .sm-title {
                font-family: var(--wp--preset--font-family--mono);
                font-size: 10.5px;
                letter-spacing: .1em;
                text-transform: uppercase;
                color: var(--wp--preset--color--greymid);
            }

            .card .price {
    font-family: var(--wp--preset--font-family--mono);
    font-size: 14px;
    color: var(--wp--preset--color--red);
    font-weight: 600;
}
