/*
Theme Name: OceanWP Child Theme
Theme URI: https://oceanwp.org/
Description: OceanWP WordPress theme. Sample child theme.
Author: OceanWP
Author URI: https://oceanwp.org/
Template: oceanwp
Version: 1.0
*/

/* Parent stylesheet should be loaded from functions.php not using @import */


/* body */
body {
	//background: url(/wp-content/uploads/2026/04/OpCritical-body-bg-compress.png) center / cover no-repeat;
	background: url(/wp-content/uploads/2026/04/OpCritical-body-bg-compress-light.png) center / cover no-repeat
}
/* home */
.home h2 {font-size: 132px}

/* scroll bar */
::-webkit-scrollbar {width: 9px}
::-webkit-scrollbar-thumb {
    background: #d01717;
    border-radius: 2px
}
::-webkit-scrollbar-track {background: rgba(26, 27, 41, 0.9)}

/* header */
#transparent-header-wrap {}
#site-header {
    position: fixed !important;
    backdrop-filter: blur(15px)
}
#site-logo a.site-logo-text {
	font-family: 'Big Shoulders Inline Text';
	font-size: 40px !important;
	line-height: 0 !important
}

/* hero block */
.home-hero {position: relative}
.home-hero::before {
	content: '';
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	background-image: url(/wp-content/uploads/2026/04/OpCritical-Music-bg-home-hero.webp);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	z-index: -1;
}
.home-hero h1 {
	color: #f1ab2c;
	display: grid;
	justify-items: start;
	font-size: 0px;
	line-height: 1;
	text-shadow: 0 2px 2px white
}
.home-hero h1 span {margin-left: 215px}
.home-hero_video-bg {
	position: relative;
	height: 100vh;
	overflow: hidden;
	justify-content: center;
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important
}
.home-hero_video-bg video {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: translate(-50%, -50%)
}


/* neon text */
.neon-header_top, .neon-header_bottom {
	position: relative;
	font-size: 150px;
	font-family: 'Big Shoulders Inline Text';
	color: #f5f0d9;
	text-shadow: 0 0 5px #fff, 0 0 10px #ff7b00, 0 0 20px #ff7b00, 0 0 40px #ff4800, 0 0 80px #ff4800;
	text-shadow: 0 0 1px #fff, 0 0 1px #f45f0b, 0 0 10px #f45f0b, 0 0 40px #f45f0b, 0 0 80px #f45f0b, 6px 6px 5px rgb(244 95 11 / 40%), 4px 4px 2px rgb(244 95 11 / 50%), 15px 15px 10px rgb(244 95 11 / 30%), 15px 15px 30px rgb(244 95 11 / 60%);
	text-shadow: 0 0 1px #fff, 0 0 1px #f45f0b, 0 0 10px #f45f0b, 0 0 40px #f45f0b, 0 0 80px #f45f0b, 6px 6px 5px rgb(244 95 11 / 40%), 4px 4px 2px rgb(244 95 11 / 50%), 15px 15px 10px rgb(244 95 11 / 30%), 15px 15px 30px rgb(244 95 11 / 60%), 2px 2px 0px rgb(0 0 0 / 50%), 0px 1px 0px rgb(244 95 11 / 40%), 6px 6px 3px rgb(244 95 11 / 45%), 0px -1px 0px rgb(244 95 11 / 40%), -6px -6px 3px rgb(244 95 11 / 25%);
	//-webkit-text-stroke: 1px #ff4800;
	font-weight: 400;
	transform: rotate(325deg);
	margin: -240px -200px 0 -80px;
	z-index: -1;
}
.neon-header_bottom {margin: 0px -265px -40px -100px;}

/* text decor */
.text-shadow {text-shadow: 0 0px 5px rgb(0 0 0 / 80%)}

/* video block */
.video-block {margin-top: -150px}

/* video frame */
.video-frame iframe {
	border-radius: 12px;
	box-shadow: 2px 2px 0px 2px rgb(0 0 0 / 80%), 0px 1px 0px 2px rgb(244 95 11 / 60%), 7px 7px 3px 2px rgb(244 95 11 / 50%);
	box-shadow: 2px 2px 0px 2px rgb(0 0 0 / 60%), 0px 1px 0px 2px rgb(244 95 11 / 30%), 7px 7px 3px 2px rgb(244 95 11 / 25%);
	box-shadow: 2px 2px 0px 3px rgb(0 0 0 / 50%), 0px 1px 0px 2px rgb(244 95 11 / 40%), 6px 6px 3px 2px rgb(244 95 11 / 45%), 0px -1px 0px 2px rgb(244 95 11 / 40%), -6px -6px 3px 2px rgb(244 95 11 / 25%);
	box-shadow: 2px 2px 0px 3px rgb(0 0 0 / 50%), 0px 1px 0px 2px rgb(208 23 23 / 40%), 6px 6px 3px 2px rgb(208 23 23 / 45%), 0px -1px 0px 2px rgb(208 23 23 / 40%), -6px -6px 3px 2px rgb(208 23 23 / 25%);
	box-shadow: 2px 4px 16px black;
}

/* image style */
.grafiti-img img {
	transform: rotate(-20deg);
	margin-top: 100px;
}

/* hear us block */
.hear_us-block {}
.hear_us-column {
	transform-origin: center 540px;
	transform: scale(.9)
}
.hear_us-column:hover {animation: ScaleRotate 2s cubic-bezier(0.05, 1.03, 0.06, 1.02) infinite}
.hear_us-column figure {text-align: center}
.hear_us-column figure:nth-child(2) {margin-top: -50px}

@keyframes ScaleRotate {
	0% {transform: scale(1) rotate(4deg)}
	33% {transform: scale(1) rotate(0deg)}
	66% {transform: scale(1) rotate(-6.5deg)}
	100% {transform: scale(1) rotate(4deg)}
}

/* write us */
.write-us_icon {transform: rotate(20deg)}
.write-us_button {
	position: relative;
	text-align: center;
	margin-top: -25px
}

/* news block latest posts */
.news-block .wp-block-latest-posts__featured-image img {
	height: 250px;
	width: 100%;
	object-fit: cover;
	border-radius: 12px;
	box-shadow: 2px 4px 16px black;
}
.news-block .wp-block-latest-posts__post-title {
	display: block;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none !important
}
.wp-block-latest-posts__post-title {font-family: 'Anton SC'}

/* right sidebar */
.sidebar-box .widget-title, .sidebar-box.widget_block .wp-block-heading {color: #000}
#right-sidebar-inner .wp-block-latest-posts.wp-block-latest-posts__list li {border-bottom: 1px solid #c1c1c1}

/* social icons */
.wp-block-social-link-anchor  {
	text-decoration: none !important;
	padding: 10px 15px;
}

/* button */
.wp-block-button__link {
	font-size: 22px;
	font-weight: 400;
	border-radius: 5px
}


/* spaces */
.pt20 {padding-top: 20px}
.pt40 {padding-top: 40px}
.pt60 {padding-top: 60px}
.pt80 {padding-top: 80px}
.pt100 {padding-top: 100px}
.pt120 {padding-top: 120px}
.pt160 {padding-top: 160px}
.pt200 {padding-top: 200px}
.pt220 {padding-top: 220px}

.pb20 {padding-bottom: 20px}
.pb40 {padding-bottom: 40px}
.pb60 {padding-bottom: 60px}
.pb80 {padding-bottom: 80px}
.pb100 {padding-bottom: 100px}
.pb120 {padding-bottom: 120px}
.pb160 {padding-bottom: 160px}
.pb200 {padding-bottom: 200px}
.pb240 {padding-bottom: 240px}
.pb340 {padding-bottom: 340px}

.gap40 {gap: 40px}
.gap60 {gap: 60px}
.gap80 {gap: 80px}
.gap100 {gap: 100px}




/* mobile */
@media (max-width: 820px) {
	.home-hero h1 {
		font-size: 100px;
		line-height: 1.1;
	}
	.home-hero h1 span {margin-left: 100px}
	.neon-header_top, .neon-header_bottom {font-size: 90px}
}
@media (max-width: 768px) {
	.home h2 {font-size: 55px}
}
@media (max-width: 480px) {
	.home-hero_video-bg {height: 45vh}
	.video-block {
		grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
		margin-top: 20px
	}
	.video-block figure:last-child {//margin: -20px -50% 0 50%}
	.grafiti-img img {margin: 0}
	
	.wp-block-latest-posts.wp-block-latest-posts__list {margin: 0}
	.wp-block-latest-posts.wp-block-latest-posts__list li {margin-right: 0}
	
	.ptm80 {padding-top: 80px}
	.ptm120 {padding-top: 120px}
	
	.pbm40 {padding-bottom: 40px}
	.pbm240 {padding-bottom: 240px}
	
	.gapm10 {gap: 10px}
}