/*
Theme Name: Jean-Appolon-Theme
Theme URI: https://36.agency
Author: 36creative     
Author URI: https://36.agency
Description: Block theme designed to provide a flexible and easy to use editing experience.
Version: 3.2
Requires at least: 6.5.5
Tested up to: 6.5.5
Requires PHP: 8.1.23
Text Domain: blueprint
*/

* {
    box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
    overflow-x: hidden;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased; 
    font-family: var(--wp--preset--font-family--gelica);   
    padding: 0;
    margin: 0;
}

img {
    max-width: 100%;
    height: auto;    
}

:where(.wp-site-blocks) > * {
    margin-block-start: 0 !important;
}
:root :where(.is-layout-constrained) > * {
    margin-block-start: 0;
}

#wp--skip-link--target {
    margin: 0;
}


@media screen and (min-width: 1025px) {
    body:not(.wp-admin) .visible-desktop-false {
        display: none;
    }
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    body:not(.wp-admin) .visible-tablet-false {
        display: none;
    }
}

@media screen and (max-width: 767px) {
    body:not(.wp-admin) .visible-mobile-false {
        display: none;
    }
}


/*=========== header ==============*/

header.wp-block-template-part{
    position: fixed;
    width: 100%;
    z-index: 100;
    top: 0;
    left: 0;
    transition: background-color 0.3s ease-in-out 0s, backdrop-filter 0.3s ease-in-out 0s;
}

header.wp-block-template-part::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(24, 18, 32, 0.48);
    backdrop-filter: blur(24px);
    transition: opacity 0.3s ease-in-out 0s;
    opacity: 0;
}

.fixed header.wp-block-template-part::before{
    opacity: 1;
}   

.header-inn {
    overflow: visible;
    position: relative;
}

.header-inn .header-logo {
    position: relative;
    z-index: 4;
}

.header-inn .header-main-nav {
    z-index: 3;
}

.header-inn .header-right {
    z-index: initial;
}

.header-inn .header-right .wp-block-blueprint-buttons {
    position: relative;
    z-index: 3;
}

@media screen and (min-width: 1050px) and (max-width: 1310px) {
    .header-inn .header-logo {
        width: 14% !important;
    }

    .header-inn .header-main-nav {
        width: 63% !important;
    }

    .header-inn .header-right {
        width: 23% !important;
    }
}

@media screen and (min-width: 1050px) and (max-width: 1109px) {
    .header-inn .header-right {
        width: 20% !important;
    }
    .header-inn .header-right .wp-block-blueprint-button a {
        padding: 10px 15px;
    }
}

@media screen and (max-width: 1049px) {
    .header-inn .header-logo {
        width: 126px !important;
    }

    .header-inn .header-main-nav {
        width: 125px !important;
    }

    .header-inn .header-right {
        display: none;
    }
}

/*=========== footer ==============*/

.footertop-border-tab-mobile{
    @media screen and (max-width: 1024px) {
        border-top: 1px solid var(--wp--preset--color--brand-accent-purple);
    }
}

.footer-inn {
    position: relative;
    background: linear-gradient(145deg, rgba(53, 11, 102, 1) 3%, rgba(36, 13, 64, 1) 56%, rgba(20, 15, 26, 1) 100%);
}

.footer-inn::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(194deg, rgba(54, 147, 217, 0.4) 0%, rgba(53, 11, 102, 0) 23%);
}

.footer-inn::after{
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: var(--icon-texture) repeat top left;
    opacity: 0.1;
    mix-blend-mode: soft-light;
    width: 100%;
    height: 100%;
}

.footer-inn > .container{
    position: relative;
    z-index: 2;
}

.footer-inn .footer-testi > .container > .wp-block-blueprint-column{
    border-top: 1px solid var(--wp--preset--color--brand-accent-purple);
}

.footer-inn .footer-menu > .container .footer-menu-top {
    border-top: 1px solid var(--wp--preset--color--brand-accent-purple);
}

.footer-inn .footer-menu > .container .footer-menu-top .menu-footer-link .footer-main-menu-wrap .footer-main-menu .wp-block-group {
    gap: 30px 24px;
    width: 48.092%;
}

.footer-inn .footer-menu > .container .footer-menu-top .menu-footer-link .footer-main-menu-wrap .footer-main-menu .wp-block-blueprint-maximum-width .wp-block-navigation ul {
    gap: 8px;
}

.footer-inn .footer-menu > .container .footer-menu-top .menu-footer-link .footer-main-menu-wrap .footer-main-menu .wp-block-blueprint-maximum-width .wp-block-navigation ul li a {
    transition: all 0.3s ease-in-out 0s;
}

.footer-inn .footer-menu > .container .footer-menu-top .menu-footer-link .footer-main-menu-wrap .footer-main-menu .wp-block-blueprint-maximum-width .wp-block-navigation ul li a:hover {
    color: var(--wp--preset--color--brand-primary);
}

.footer-inn .footer-menu > .container .footer-menu-top .menu-footer-link .footer-main-menu-wrap .footer-main-menu .wp-block-blueprint-paragraph p a{
    text-decoration: none;
}

.footer-inn .footer-menu > .container .footer-menu-top .menu-footer-link .footer-main-menu-wrap .footer-contact-info p a {
    color: var(--wp--preset--color--jae-white);
    transition: all 0.3s ease-in-out 0s;
}

.footer-inn .footer-menu > .container .footer-menu-top .menu-footer-link .footer-main-menu-wrap .footer-contact-info p a:hover {
    color: var(--wp--preset--color--brand-primary);
}

.footer-inn .footer-menu > .container .footer-menu-bottom .legal-foot-menu {
    border-top: 1px solid var(--wp--preset--color--brand-accent-purple);
}

.footer-inn .footer-menu > .container .footer-menu-bottom .legal-foot-menu .wp-block-navigation .wp-block-navigation li a {
    transition: all 0.3s ease-in-out 0s;
}

.footer-inn .footer-menu > .container .footer-menu-bottom .legal-foot-menu .wp-block-navigation .wp-block-navigation li a:hover {
    color: var(--wp--preset--color--brand-primary);
}

@media screen and (max-width: 1024px) {
    .footer-inn .footer-menu > .container .footer-menu-top .menu-footer-link .footer-main-menu-wrap .footer-main-menu .wp-block-group {
        width: 100%;
    }

    .footer-inn .footer-menu > .container .footer-menu-top .menu-footer-link .footer-main-menu-wrap .footer-main-menu .wp-block-blueprint-maximum-width .footer-accordion-trigger {
        cursor: pointer;
        position: relative;
        padding-right: 24px;
    }

    .footer-inn .footer-menu > .container .footer-menu-top .menu-footer-link .footer-main-menu-wrap .footer-main-menu .wp-block-blueprint-maximum-width .footer-accordion-trigger::after {
        content: "";
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 16px;
        height: 8px;
        background-image: var(--icon-down-arrow-footer-orang);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        transition: all 0.3s ease-in-out 0s;
    }

    .footer-inn .footer-menu > .container .footer-menu-top .menu-footer-link .footer-main-menu-wrap .footer-main-menu .wp-block-blueprint-maximum-width .footer-accordion-trigger[aria-expanded="true"]::after {
        transform: translateY(-50%) rotate(180deg);
    }

    .footer-inn .footer-menu > .container .footer-menu-top .menu-footer-link .footer-main-menu-wrap .footer-main-menu .wp-block-blueprint-maximum-width .wp-block-navigation[hidden] {
        display: none !important;
    }

    .footer-inn .footer-menu > .container .footer-menu-top .menu-footer-link .footer-main-menu-wrap .footer-main-menu .wp-block-blueprint-maximum-width .wp-block-navigation {
        will-change: height, opacity;
    }
}

@media screen and (max-width: 767px) {
    .footer-inn .footer-menu > .container .footer-menu-bottom .legal-foot-menu .wp-block-navigation .wp-block-navigation {
        justify-content: flex-start;
    }
}


/*=============================================*/
.support-jae{
    height: 1180px;
}

@media screen and (max-width: 767px) {
    .support-jae{
        height: 1080px;
    }
}

.error404{
    .wp-block-blueprint-paragraph{
        p{
            a{
                color: var(--wp--preset--color--white);
            }
        }
    }
    .wp-block-blueprint-list{
        margin-left: 13px;
    }
    @media screen and (max-width: 767px) {
        .wp-block-blueprint-list ul li + li {
            margin-top: 5px;
        }
    }
}

.gradient-banner-1{
    background: radial-gradient(ellipse 80% 60% at 90% 0%, rgba(62, 95, 172, 0.8) 0%, rgba(62, 95, 172, 0.35) 30%, transparent 70%), radial-gradient(ellipse 70% 60% at 0% 0%, rgba(110, 52, 190, 0.6) 0%, rgba(110, 52, 190, 0.2) 40%, transparent 75%), linear-gradient(180deg, #24184f 0%, #160a32 55%, #0c0618 100%);
}
.gradient-banner-2{
    background: radial-gradient(ellipse 100% 80% at 100% 0%, rgba(176, 113, 67, 0.85) 0%, rgba(176, 113, 67, 0.35) 35%, rgba(176, 113, 67, 0) 75%), linear-gradient(180deg, #311c3c 0%, #180028 50%, #0d0018 100%);
}
.gradient-banner-3{
    background: radial-gradient(ellipse 90% 70% at 85% 0%, #355d9c 0%, rgba(53, 93, 156, 0.45) 30%, rgba(53, 93, 156, 0) 70%), linear-gradient(180deg, #1d153f 0%, #120026 55%, #0c0018 100%);
}

.wp-block-blueprint-column > .container > .wp-block-blueprint-columns.not-full-height{
    height: auto;
}



.artists-main-area{
    overflow: visible;
}
.artists-main-area .artists-main-area-title{
    position: sticky;
    top: 100px;
}