/*
CTC Separate Stylesheet
Updated: 2026-02-18 20:26:14
*/


.site-title {
    position:absolute;
    top:-100rem;
    left:-100rem;
}

 p {
    font-size: clamp(1.1rem, -1.2rem + 4vw, 1.4rem);
}

.invert-x {
    transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
}


.wrapper {

    background-size: 1140px;
}

.hp-hero-title {
    font-size: clamp(2.25rem, -1.2rem + 8vw, 3.25rem);
    
}

.hp-hero-title span {
    text-transform: uppercase;
}

 .hp-hero-text p {
    font-size: clamp(1.1rem, -1.2rem + 4vw, 1.4rem);
}




.section-wrap {
    margin-block: 4rem;
    padding-block: 4rem;
}

.section-heading {
    font-size: clamp(2.0rem, -1.2rem + 8vw, 3.5rem);
}

.section-heading-pre {
    font-size: clamp(1.125rem, -1rem + 6vw, 1.5rem);
    text-transform: capitalize!important;
}

ul.hp-help-list {
   
}

.hp-help-list li {
display:inline;
padding-right:clamp(0.75rem, -1.5rem + 8vw, 0.75rem);
padding-left:clamp(1.75rem, -1.25rem + 8vw, 2.75rem);
    font-size: clamp(1.75rem, -1.5rem + 8vw, 2.5rem);
    line-height: clamp(1.85rem, -1.1rem + 8vw, 3rem);
    background: url("https://jamesfcarr.me/wp-content/uploads/2026/02/Base_Orange-1.svg") no-repeat;
mask: url(/wp-content/uploads/2026/02/JFCME_ELEMENTS_Asterisk_01.svg) no-repeat;

}



.section-divider {

}




/* START Section Images */

.img-float {
    aspect-ratio: 1/1;
}

.img-round {
   
    /* border-width: .25rem .25rem .25rem .25rem; */
    border-width: 0;
    border-color: #ECA543;
    border-style: solid;
    border-radius:100rem;
    aspect-ratio: 1/1;
    overflow: hidden;
    
}

.img-round:first-child {
    box-shadow: .25rem .25rem .125rem #0000007f;
}

.img-round:nth-child(2n) {
    box-shadow: .5rem .5rem .25rem #0000007f;
}

.img-round:nth-child(3n) {
    box-shadow: .75rem .75rem .5rem #0000007f;
}


@media screen and (max-width:1023px) {

    .img-round,
    .img-float {
        width: calc(40% - 0.25rem);
    }

    .img-round:nth-child(1n),
    .img-float:nth-child(1n) {
    }

    .img-round:nth-child(2n),
    .img-float:nth-child(2n) {
        margin-block-end: -3rem;
        margin-inline-start: -10%;
    }

    .img-round:nth-child(3n),
    .img-float:nth-child(3n) {
        margin-inline-start: -10%;
    }

}



@media screen and (min-width:1024px) {

    .img-round,
    .img-float {
        max-width: 80%;
    }

    .img-round:nth-child(1n),
    .img-float:nth-child(1n) {
        margin-inline-start: 20%;
    }

    .img-round:nth-child(2n),
    .img-float:nth-child(2n) {
        margin-block-start: -3rem;
        margin-inline-start: -20%;
        margin-block-end: -3rem;
    }

    .img-round:nth-child(3n),
    .img-float:nth-child(3n) {
        margin-inline-start: 20%;
    }


}


/* END Section Images */




@media(prefers-reduced-motion: no-preference){

    /* Homepage Hero Animation */

    @keyframes fadeIn {
    0% {
        opacity: 0; 
        transform: translatey(400px);
    }
    100% {
        opacity: 1;
        transform: translatey(00px);
    }
    }

    .animate-on-load-1 {
        opacity: 0;
        animation-name: fadeIn;
        animation-duration: 1s;
        animation-fill-mode: forwards;
        animation-delay: 0.25s;
    }

    .animate-on-load-2 {
        opacity: 0;
        animation-name: fadeIn;
        animation-duration: 1s;
        animation-fill-mode: forwards;
        animation-delay: 0.5s;
    }

    .animate-on-load-3 {
        opacity: 0;
        animation-name: fadeIn;
        animation-duration: 1s;
        animation-fill-mode: forwards;
        animation-delay: 0.75s;
    }

    .animate-on-load-4 {
        opacity: 0;
        animation-name: fadeIn;
        animation-duration: 1s;
        animation-fill-mode: forwards;
        animation-delay: 1.0s;
    }


    .more {
        animation-duration: 1.5s;
        animation-iteration-count: infinite;
        transform-origin: bottom;
    }

    .more-bounce {
        animation-name: more-bounce;
        animation-timing-function: linear;
    }

    @keyframes more-bounce {
        0%   { transform: translateY(0); }
        50%  { transform: translateY(-25px); }
        100% { transform: translateY(0); }
    }



    /* Section Animation */

    .section-fade-in {
        animation:section-fade-in linear forwards;
        animation-timeline: view();
        animation-range:entry;
    }

    @keyframes section-fade-in {

        0% {
            opacity: 0;
            transform: translatey(400px);
        }

        50% {
            opacity: 0;
        }

        100% {
            opacity: 1;
            transform: translatey(00px);
        }

   }



   /* Section Divider Animation */

   .section-divider img {
        opacity: 0;
        animation:section-div-unsquish ease forwards;
        animation-timeline: view();
        animation-range: contain; 
   }


    @keyframes section-div-unsquish {

        0% {
            opacity: 0;
            transform: translatey(400px);
            transform: scaleX(0);
            transform: scaleY(0);
        }

        /* 50% {
            opacity: 0;
            transform: scaleX(0.5);
            transform: scaleY(0.5);
        } */

        100% {
            opacity: 1;
            transform: translatey(0px);
            transform: scaleX(1);
            transform: scaleY(1);
        }

   }

}

ul.page-list { 
    list-style: none;
}

ul.page-list li {
    padding-left: clamp(1.75rem, -1rem + 8vw, 2.0rem);
    font-size: clamp(1.3rem, -1.2rem + 8vw, 1.5rem);
    background-image: url('/wp-content/uploads/2026/02/Base_Grey-01_Asterisk.svg');
    background-repeat: no-repeat;
    background-size: clamp(1.5rem, -1.2rem + 8vw, 1.85rem);
}

ul.page-list li.orange {
     background-image: url('/wp-content/uploads/2026/02/Base_Orange_Asterisk.svg');
}

ul.page-list li.arrow-orange {
     background-image: url('/wp-content/uploads/2026/02/Base_Orange_Arrow-1.svg');
}

ul.page-list li.ban {
     background-image: url('/wp-content/uploads/2026/02/Base_Orange_Ban.svg');
}


ul.page-list-feature { 
    list-style: none;
}

ul.page-list-feature li {
    //display: inline;
    margin-bottom: clamp(1.0rem, -1.2rem + 8vw, 1.25rem)!important;
    padding-left: clamp(1.5rem, -1.2rem + 8vw, 2.25rem);
    padding-right: clamp(0.5rem, -1.2rem + 8vw, 0.75rem);
    font-size: clamp(1.5rem, -1.2rem + 8vw, 2rem);
    line-height: clamp(1.75rem, -1.2rem + 8vw, 2.25rem);
    background-image: url('/wp-content/uploads/2026/02/Base_Orange_Asterisk.svg');
    background-repeat: no-repeat;
    background-size: clamp(1.5rem, -1.2rem + 8vw, 1.85rem);
}