/*
Theme Name:   Astra Child
Template:     astra
Version:      1.0.0
*/

:root{
    --accent:#00ff01;
    --border:#1a1e26;
    --sfondo:#0d0f14;
}

body.page-id-2709, body.page-id-2966, body.page-id-3104, body.page-id-3134, body.page-id-3100{
    background-color: var(--sfondo); 
    color: #ffff;
    margin: 0;
    padding: 0;
}

/* IL BAGLIORE VERDE SULLO SFONDO */
body.page-id-2709::after, body.page-id-2966::after, body.page-id-3134::after, body.page-id-3100::after {
    content: "";
    position: fixed;
    top: 20%; 
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80vw; 
    height: 80vw;
    /* Ho alzato leggermente l'opacità a 0.08 per renderlo visibile su WordPress */
    background: radial-gradient(circle, rgba(0, 255, 1, 0.08) 0%, transparent 70%);
    /* z-index -1 lo mette dietro ai testi e alle immagini */
    z-index: -1; 
    pointer-events: none;
    display: block;
}

/* LE SCANLINES (Sopra a tutto) */
body.page-id-2709::before, body.page-id-2966::before, body.page-id-3104::before, body.page-id-3134::before, body.page-id-3100::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, transparent 50%, rgba(0, 255, 1, 0.04) 50%);
    background-size: 100% 4px;
    z-index: 9999;
    pointer-events: none;
    display: block;
}

 .intro-image {
            flex: 1;
            min-width: 300px;
            position: relative;
}
.intro-image img {
            width: 100%;
            filter: grayscale(1) contrast(1.2);
            border: 1px solid var(--border) !important;
            transition: 0.5s;
}

/* Cornice estetica verde neon */
.intro-image::before {
            content: "";
            position: absolute;
            top: -15px; left: -15px;
            width: 50px; height: 50px;
            border-top: 2px solid var(--accent) !important;
            border-left: 2px solid var(--accent) !Important;
}
.intro-image:hover img {
            filter: grayscale(0.5) contrast(1);
            border: 1px solid var(--accent) !Important;
}

/*articoli
.blog, .ast-separate-container .ast-article-post, .sidebar-main>*{background:var(--sfondo) !important;}
.sidebar-main>*:hover{background:#12151c !important;}
.widget_search .search-form .search-field {background: var(--sfondo);}
.single, .single div#primary, .single article, .single .ast-single-related-posts-container{
background:var(--sfondo) !important;
}
.single h1, .single h3, .single h2, .single div.entry-meta, .single div.entry-meta a {color:#ffff;}

.ast-related-post-content .entry-header .ast-related-post-title a, .nav-links a{color:#ffff !important;}

.ast-related-post-content .entry-meta *{color:#ffff;}

*/

/**/
.rune {
           color: #1a1e26 !important;
            margin-bottom: 30px;
            display: block;
            transition: 0.4s;
        }
 .card-rune:hover .rune {
            color: var(--accent)!Important;
            transform: translateY(-5px);
            text-shadow: 0 0 30px rgba(0, 255, 1, 1) !important;
        }
        
 .card-rune::after {
            content: "";
            position: absolute;
            left: 0; bottom: 0; width: 0%; height: 2px;
            background: var(--accent);
            transition: 0.4s ease;
            box-shadow: 0 0 20px var(--accent);
        }

        .card-rune:hover::after {
            width: 100%;
        }
  /* La Freccia Viking e la Scritta */
        .discover-more {
            display: flex;
            align-items: center;
            gap: 15px;
            padding-bottom: 15px; /* Allineamento con il testo */
        }

        .discover-more span {
            font-family: 'Inter';
            font-size: 0.8rem;
            letter-spacing: 3px;
            text-transform: uppercase;
            color: var(--accent);
        }

        /* SVG della freccia stile runico/geometrico */
        .viking-arrow {
            width: 40px;
            fill: var(--accent);
            filter: drop-shadow(0 0 5px var(--accent));
        }
        
/**/
/* --- STILE BASE BOTTONE CYBER-VIKING --- */
.btn_viking .elementor-button {
    background-color: transparent !important;
    color: #00ff01 !important;
    border: 2px solid #00ff01 !important;
    border-radius: 0px !important; /* Rimuove arrotondamenti */
    padding: 15px 40px !important;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 2px;
    position: relative;
    transition: all 0.3s ease-in-out !important;
    
    /* Taglio Cyber-angolare */
    clip-path: polygon(15% 0, 100% 0, 85% 100%, 0 100%);
    
    /* Effetto bagliore esterno */
    box-shadow: 0 0 10px rgba(0, 255, 1, 0.2);
}

/* --- EFFETTO HOVER --- */
.btn_viking .elementor-button:hover {
    background-color: #00ff01 !important;
    color: #000000 !important;
    box-shadow: 0 0 25px #00ff01 !important;
    transform: scale(1.05) skewX(-2deg);
}


.page-id-2709 .ast-primary-header-bar {background-color: transparent;}

/* --- ANIMAZIONE SCANLINE (Effetto monitor Cyber) --- */
.btn_viking .elementor-button-content-wrapper::after {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(0, 255, 1, 0.4),
        transparent
    );
    transition: 0.6s;
}

.btn_viking .elementor-button:hover .elementor-button-content-wrapper::after {
    left: 100%;
}

/* --- RIMUOVI BORDI DEFAULT CHE ELEMENTOR AGGIUNGE --- */
.btn_viking .elementor-button {
    border-style: solid !important;
}


/* 1. IL CONTENITORE (LA COLONNA) */
.video_card_viking {
    position: relative;
    padding: 25px !important;
    background: rgba(0, 0, 0, 0.4) !important;
    border: 1px solid rgba(0, 255, 1, 0.1) !important;
    transition: all 0.4s ease-in-out;
    /* Assicurati che non ci siano overflow che tagliano gli angoli */
    overflow: visible !important; 
}

/* 2. GLI ANGOLI (Punta solo a due lati per evitare l'effetto quadrato) */
.video_card_viking::before,
.video_card_viking::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    border: 2px solid #00ff01;
    background: transparent !important; /* Evita che diventi un quadrato pieno */
    pointer-events: none;
    z-index: 10;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

/* Angolo Top-Left: Solo sopra e sinistra */
.video_card_viking::before {
    top: -2px;
    left: -2px;
    border-right: none !important;
    border-bottom: none !important;
}

/* Angolo Bottom-Right: Solo sotto e destra */
.video_card_viking::after {
    bottom: -2px;
    right: -2px;
    border-left: none !important;
    border-top: none !important;
}

/* 3. EFFETTO HOVER */
/* Quando passi il mouse, gli angoli si allungano ma rimangono "L" */
.video_card_viking:hover::before,
.video_card_viking:hover::after {
    width: 100%;
    height: 100%;
    filter: drop-shadow(0 0 8px #00ff01); /* Bagliore invece di ombra pesante */
}

/* Effetto bagliore sul bordo principale della card */
.video_card_viking:hover {
    border-color: rgba(0, 255, 1, 0.5) !important;
    background: rgba(0, 255, 1, 0.03) !important;
    box-shadow: inset 0 0 20px rgba(0, 255, 1, 0.1);
}



.video_card_viking:hover .elementor-widget-heading:nth-child(3) .elementor-heading-title {
    text-shadow: 0 0 15px rgba(255,255,255,0.4);
}

/*FORM*/
.cf7-row label, .cf7-full-width label {
    font-family: inherit;
    font-size: 14px;
    font-weight: 400 !important;
    color: #01fe02;
    text-transform: uppercase;
    letter-spacing: 4px;
    margin-bottom: 10px;
}
/* Layout a due colonne */
.cf7-row {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

.cf7-column {
    flex: 1;
}

.cf7-full-width {
    margin-bottom: 15px;
}

/* Stile etichette e input */
.cf7-custom-form label {
    font-weight: bold;
    display: block;
    margin-bottom: 5px;
}

.cf7-custom-form label span {
    color: red;
}

.cf7-custom-form input[type="text"],
.cf7-custom-form input[type="email"],
.cf7-custom-form input[type="tel"],
.cf7-custom-form textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    background-color: #f7f7f7;
    box-sizing: border-box;
}
textarea.wpcf7-form-control.wpcf7-textarea {
    height: 6em;
}
.btn_viking.wpcf7-submit {
    background-color: transparent !important;
    color: #00ff01 !important;
    border: 2px solid #00ff01 !important;
    border-radius: 0px !important;
    padding: 15px 40px !important;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 2px;
    position: relative;
    transition: all 0.3s ease-in-out !important;
    clip-path: polygon(15% 0, 100% 0, 85% 100%, 0 100%);
    box-shadow: 0 0 10px rgba(0, 255, 1, 0.2);
    cursor: pointer;
	left:10%;
}

.btn_viking.wpcf7-submit:hover {
    background-color: #00ff01 !important;
    color: #000000 !important;
    box-shadow: 0 0 25px #00ff01 !important;
    transform: scale(1.05) skewX(-2deg);
}
.button-form{text-align:center;}
/* Mobile: torna a una colonna */
@media (max-width: 600px) {
    .cf7-row {
        flex-direction: column;
        gap: 10px;
    }
	.btn_viking.wpcf7-submit{left:0;}
}

/*BLOG*/
.page-id-3100 aside#recent-posts-2>*, .page-id-3100 aside#archives-2 h2,.page-id-3100 aside#categories-2 h2,.page-id-3100 nav ul li a{color: white;}
.page-id-3100 aside#recent-post-2>a{text-transform:uppercase;}
.page-id-3100 nav ul li a:hover{text-decoration:underline; text-decoration-color:#24e81c;}

.page-id-3100{
/* 1. IL CONTENITORE (LA COLONNA) */
article,aside {
    position: relative;
    padding: 25px !important;
    background: rgba(0, 0, 0, 0.4) !important;
    border: 1px solid rgba(0, 255, 1, 0.1) !important;
    transition: all 0.4s ease-in-out;
    overflow: visible !important; 
}
/* 2. GLI ANGOLI (Punta solo a due lati per evitare l'effetto quadrato) */
article::before,
article::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    border: 2px solid #00ff01;
    background: transparent !important;
    pointer-events: none;
    z-index: 10;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}
/* Angolo Top-Left: Solo sopra e sinistra */
article::before {
    top: -2px;
    left: -2px;
    border-right: none !important;
    border-bottom: none !important;
}
/* Angolo Bottom-Right: Solo sotto e destra */
article::after {
    bottom: -2px;
    right: -2px;
    border-left: none !important;
    border-top: none !important;
}
/* 3. EFFETTO HOVER */
article:hover::before,
article:hover::after {
    width: 100%;
    height: 100%;
    filter: drop-shadow(0 0 8px #00ff01);
}
article:hover {
    border-color: rgba(0, 255, 1, 0.5) !important;
    background: rgba(0, 255, 1, 0.03) !important;
    box-shadow: inset 0 0 20px rgba(0, 255, 1, 0.1);
}
article:hover .elementor-widget-heading:nth-child(3) .elementor-heading-title {
    text-shadow: 0 0 15px rgba(255,255,255,0.4);
}
}
.post-thumb-img-content.post-thumb {
    display: none;
}
.page-id-3100 aside#recent-posts-2 a::before{content:"- "!important;}
.page-id-3100 a.article__link.article__read-more.main-link.read-more{
background-color: transparent !important;
    color: #00ff01 !important;
    border: 2px solid #00ff01 !important;
    border-radius: 0px !important;
    padding: 15px 20px !important;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 2px;
    position: relative;
    transition: all 0.3s ease-in-out !important;
    clip-path: polygon(15% 0, 100% 0, 85% 100%, 0 100%);
    box-shadow: 0 0 10px rgba(0, 255, 1, 0.2);
    cursor: pointer;
	text-align:center;
	font-size:11px !important;
}
.page-id-3100 a.article__link.article__read-more.main-link.read-more:hover{
	  background-color: #00ff01 !important;
    color: #000000 !important;
    box-shadow: 0 0 25px #00ff01 !important;
    transform: scale(1.05) skewX(-2deg);
}

.carosello-strongercaoch .eicon-chevron-right:hover::before{
text-shadow: 0 0 8px rgba(57,255,20,1);
}
.carosello-strongercaoch .eicon-chevron-left:hover::before{
text-shadow: 0 0 8px rgba(57,255,20,1);
}