/*
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 */

a, a:hover, a:focus {
	outline: none !important;
	text-decoration: none !important;
}
a:is(:hover, :focus, :active) {
	outline: none !important;
	text-decoration: none !important;
}

b, strong {font-weight: 700;}

.text-white {color: white !important}
.text-white80 {color: rgb(255 255 255 / 80%) !important}
.text-white50 {color: rgb(255 255 255 / 50%) !important}

.wp-block-button__link, #nf-field-4 {
	position: relative;
	color: white;
	font-size: 18px;
	padding: 20px 24px 18px;
	border-radius: 5px;
	border: none;
	overflow: hidden;
}
.wp-block-search__button.wp-element-button, .comment-form >.form-submit {position: relative;}

.wp-block-button__link:hover, #nf-field-4:hover, .wp-block-search__button.wp-element-button:hover, .comment-form >.form-submit:hover {
	color: #1f2839;
	background-color: #c3a26d
}
.button-mirror .nf-field-element {overflow: hidden;}
#nf-field-4 {width: 100%}

.wp-block-button__link::before, .button-mirror .nf-field-element::before, .wp-block-search__button.wp-element-button::before, .comment-form >.form-submit::before {
    content: '';
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(120deg, transparent, #fff, transparent);
    transform: skewX(-20deg);
	background: linear-gradient(85deg, transparent 40%, #fff, transparent 95%);
	background: linear-gradient(85deg, transparent 20%, rgb(255 255 255 / 80%), transparent 95%);
    transform: skewX(-40deg);
	animation: mirror-glare 3s infinite;
	z-index: 1;
}
@keyframes mirror-glare {
  0% {left: -75%;}
  50% {left: 125%;}
  100% {left: 125%;}
}

.mt20 {margin-top: 20px !important}
.mt40 {margin-top: 40px !important}
.mt60 {margin-top: 60px !important}
.mt80 {margin-top: 80px !important}
.mt100 {margin-top: 100px !important}

.mb20 {margin-bottom: 20px !important}
.mb40 {margin-bottom: 40px !important}
.mb60 {margin-bottom: 60px !important}
.mb80 {margin-bottom: 80px !important}
.mb100 {margin-bottom: 100px !important}

.move-up50 {animation: up 0.5s ease-out forwards;}
.move-up100 {animation: up 1s ease-out forwards;}
.move-up150 {animation: up 1.5s ease-out forwards;}
.move-up200 {animation: up 2s ease-out forwards;}
.move-up250 {animation: up 2.5s ease-out forwards;}
.move-up300 {animation: up 3s ease-out forwards;}
.move-up350 {animation: up 3.5s ease-out forwards;}
@keyframes up {
	0% {
		opacity: 0;
		transform: translateY(100%);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.single-post {margin-top: 50px;}

h2, h3, h4 {margin: 35px 0 10px 0}

.topbar-content {
	display: flex;
	gap: 20px;
}
.topbar-content i {
	color: #DDDDDD;
	font-size: .9em;
	vertical-align: middle;
	margin-right: 5px;
	margin-bottom: 3px;
    display: inline-block;
}
.topbar-content a:nth-child(1) i {font-size: 1.1em;}
.topbar-content p {margin: 0}

#top-bar-wrap {
    position: fixed;
	top: 0;
	width: 100%;
}
#site-header.transparent-header {
    position: fixed;
    top: 40px;
    background-color: rgb(31 40 57 / 25%);
	backdrop-filter: blur(10px);
}
#site-navigation-wrap .dropdown-menu >li >a, .oceanwp-mobile-menu-icon a, #searchform-header-replace-close {text-shadow: 1px 1px 1px #333;}

.hero-section {
	position: relative;
	height: 400px
}

.latest-posts-section.wp-block-latest-posts__list {
	margin-left: 0
}
.latest-posts-section.wp-block-latest-posts__list li a {
	display: flex;
	align-items: center;
	background-color: rgb(31 40 57 / 50%);
    backdrop-filter: blur(10px);
	border-radius: 10px;
	height: 140px;
	width: 80%;
	padding: 20px;
    text-align: center;
	text-shadow: 1px 1px 1px #333;
	margin: -50% auto 60px;
	animation: ProcHeadAnim 2s linear infinite;
}
.home .hero-section {
	position: relative;
	height: 800px
}
.hero-section h1 {font-size: 75px;}

.hero-bg_image::before {
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background-image: url(/wp-content/uploads/2025/08/law-advocat.webp);
	background-position: center 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
}
.bg-black_overlay50::after, .bg-black_overlay80::after {
	content: '';
	position: absolute;
	background-color: #000000;
    opacity: 0.5;
	height: 100%;
    width: 100%;
	top: 0;
	left: 0;
	overflow: hidden;
	width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
	z-index: -1
}

.advantages-block {
	position: relative;
	margin-top: -50px;
	gap: 20px
}
.advantages-column, .services-column, .review-column {
    color: #d3d3d3;
	background-color: #1f2839;
	padding: 20px 25px;
	border: 1px solid;
    border-image: linear-gradient(90deg, rgb(194 160 112 / 60%), #1d2327, rgb(194 160 112 / 60%)) 1;
	box-shadow: inset 0 0 25px 5px rgb(0 0 0 / 15%), 0 0 0px 4px #1f2839;
	animation: borderAnim 5s linear infinite;
}
@keyframes borderAnim {
  0% {border-image-source: linear-gradient(90deg, rgb(194 160 112 / 80%), #1d2327, rgb(194 160 112 / 80%))}
  50% {border-image-source: linear-gradient(90deg, #1d2327, rgb(194 160 112 / 60%), #1d2327);}
  100% {border-image-source: linear-gradient(90deg, rgb(194 160 112 / 80%), #1d2327, rgb(194 160 112 / 80%));}
}
.advantages-block .advantages-column:nth-child(2) {//background-color: green}
.advantages-column .wp-block-heading, .services-column .wp-block-heading {color: white}
.advantages-column .icon, .services-column .icon {
	color: #c3a26d;
	font-size: 60px;
	margin-right: 10px
}


.about-section .image-frame-anim img {
	height: 600px;
	object-fit: cover;
	object-position: top;
    //box-shadow: inset -8px -8px 8px 0px #1f2839, 8px 8px 8px 0px rgb(31 40 57 / 44%), -8px -8px 8px 0px rgb(31 40 57 / 44%), inset 8px 8px 8px 0px #1f2839;
    border: 1px solid rgb(31 40 57 / 34%);
    padding: 12px;
    border-radius: 0 90px;
	animation: BoxShadowAnim 7s linear infinite;
}
@keyframes BoxShadowAnim {
  0% {box-shadow: inset -8px -8px 8px 0px #1f2839, 8px 8px 8px 0px rgb(31 40 57 / 54%)}
  50% {box-shadow: inset 8px 8px 8px 0px #1f2839, -8px -8px 8px 0px rgb(31 40 57 / 4%)}
  100% {box-shadow: inset -8px -8px 8px 0px #1f2839, 8px 8px 8px 0px rgb(31 40 57 / 54%)}
}
@keyframes BoxShadowAnim {
  0% {box-shadow: inset -8px -8px 8px 0px rgb(31 40 57 / 34%), 8px 8px 8px 0px rgb(31 40 57 / 44%)}
	25% {box-shadow: inset -8px 0px 8px 0px rgb(31 40 57 / 34%), 0px 8px 8px 0px rgb(31 40 57 / 44%)}
  50% {box-shadow: inset 8px 8px 8px 0px rgb(31 40 57 / 34%), -8px -8px 8px 0px rgb(31 40 57 / 44%)}
	75% {box-shadow: inset 8px 0px 8px 0px rgb(31 40 57 / 34%), 0px -8px 8px 0px rgb(31 40 57 / 44%)}
  100% {box-shadow: inset -8px -8px 8px 0px rgb(31 40 57 / 34%), 8px 8px 8px 0px rgb(31 40 57 / 44%)}
}
.signature-owner {
	color: #c3a26d;
	font-family: 'Imperial Script';
	font-size: 45px;
	font-weight: 500
}


.subtitle-anim {
	align-items: baseline;
	gap: 0;
	margin: 0 0 15px -15px
}
.subtitle-anim .wp-block-image:nth-child(1) img {
	margin: 2px -15px -2px 15px;
	animation: HummerStendAnim 4s linear infinite;
	//filter: brightness(0) saturate(100%) invert(69%) sepia(46%) saturate(344%) hue-rotate(358deg) brightness(90%) contrast(83%);
}
.subtitle-anim .wp-block-image:nth-child(2) img {
	margin: 6px 20px -6px -20px;
	animation: RotateHummerAnim 4s linear infinite;
	//filter: brightness(0) saturate(100%) invert(69%) sepia(46%) saturate(344%) hue-rotate(358deg) brightness(90%) contrast(83%);
}
@keyframes RotateHummerAnim {
	0% {transform: rotate(-34deg);}
	100% {transform: rotate(0deg);}
}
@keyframes HummerStendAnim {
	0% {
		filter: brightness(0) saturate(100%) invert(69%) sepia(46%) saturate(344%) hue-rotate(358deg) brightness(90%) contrast(83%);
		//filter: drop-shadow(0px 6px 2px #c3a26d);
	}
	100% {}
}

.services-block {margin-bottom: 30px}

.services-block p {}

.services-column .wp-block-group.is-layout-flex .services-read_more {}

.services-read_more, .team-read_more-icon {position: relative;}
.services-read_more::after, .team-read_more-icon::after {
	content: "\e050";
	position: absolute;
	color: e9e9e9;
	font-family: 'simple-line-icons';
	font-size: .7em;
	font-weight: 100;
	margin-top: 5px;
	animation: ReadMoreIconMove 2s ease infinite
}
.services-read_more a, .team-read_more-icon a {
	margin-right: 5px;
}
@keyframes ReadMoreIconMove {
	0% {transform: translateX(0)}
	50% {transform: translateX(5px)}
	100% {transform: translateX(0)}
}

.processes-section .wp-block-column {
	height: 450px;
    text-align: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    display: grid;
    align-items: center;
    align-content: center;
	margin: 20px 0 0 0
}
.processes-section .wp-block-column .processes-headings {
	align-items: center;
	background-color: rgb(31 40 57 / 50%);
    backdrop-filter: blur(10px);
    padding: 50px 0;
    border-radius: 10px;
    margin: 0px auto;
    width: 80%;
	animation: ProcHeadAnim 2s linear infinite;
}
.processes-section .wp-block-column:nth-child(1) {background-image: url(/wp-content/uploads/2025/08/breach1.webp);}
.processes-section .wp-block-column:nth-child(2) {background-image: url(/wp-content/uploads/2025/08/breach2.webp);}
.processes-section .wp-block-column:nth-child(3) {background-image: url(/wp-content/uploads/2025/08/breach3.webp);}

@keyframes ProcHeadAnim {
	0% {
		//-webkit-transform: scale(1);
		//transform: scale(1);
		border: 5px solid rgb(255 255 255 / 5%);
		//opacity: 0.6;
	}
	70% {
		//-webkit-transform: scale(2);
		//transform: scale(2);
		border: 5px solid rgb(255 255 255 / 20%);
		//opacity: 0;
	}
	100% {
		//-webkit-transform: scale(2);
		//transform: scale(2);
		border: 5px solid rgb(255 255 255 / 5%);
		//opacity: 0;
	}
}

.team-section {
	
}
.team-section .wp-block-column {
	background: white;
    padding: 30px 30px 20px;
    box-shadow: 0 8px 20px rgb(0 0 0 / 10%);
    border: 1px solid rgb(31 40 57 / 34%);
    border-radius: 0 90px;
    animation: BoxShadowAnim 7s linear infinite;
	margin: 20px 0 0 0
}
.team-section .wp-block-column img {
	height: 250px;
	width: 250px;
	object-fit: cover;
	object-position: top center;
	border-radius: 1000px;
	border: 5px solid #c3a26d;
}
.team-section .wp-block-column .team-headings {
	align-items: center;
	text-align: center;
}

.faq_form-section {
	position: relative;
	padding: 80px 0
}
.faq_form-section::before {
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background-image: url(/wp-content/uploads/2025/08/bg5.webp);
	background-position: center 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
}
.bg-black_overlay80::after {
	background-color: #1f2839;
	opacity: 0.8;
}
.faq_form-section .subtitle-anim .wp-block-image img, .review-section .subtitle-anim .wp-block-image img {
    filter: brightness(0) saturate(100%) invert(93%) sepia(81%) saturate(2%) hue-rotate(152deg) brightness(106%) contrast(100%);
}

.form-width80 #nf-form-1-cont {
	width: 80%;
	margin: 0 auto
}

.experience-section {
	position: relative;
	padding: 50px 0 25px
}
.experience-section::after {
	content: '';
	position: absolute;
	background-color: #1f2839;
    //opacity: 0.5;
	height: 100%;
    width: 100%;
	top: 0;
	left: 0;
	overflow: hidden;
	width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
	z-index: -1
}
.experience-section .icon-briefcase, .experience-section .icon-people, .experience-section .icon-badge {
	text-align: center;
	color: #c3a26d;
    font-size: 60px;
}
.experience-section .wp-block-uagb-counter__title {color: rgb(255 255 255 / 80%) !important}
.experience-section .wp-block-uagb-counter__number span {color: white}

/* consultation section */
form input[type=text], form input[type=password], form input[type=email], form input[type=url], form input[type=date], form input[type=month], form input[type=time], form input[type=datetime], form input[type=datetime-local], form input[type=week], form input[type=number], form input[type=search], form input[type=tel], form input[type=color], form select, form textarea {
	font-size: 20px;
	line-height: 1.4;
    background-color: rgb(255 255 255 / 85%);
}

.review-section {
	position: relative;
	padding: 80px 0
}
.review-section::before {
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background-image: url(/wp-content/uploads/2025/08/bg5.webp);
	background-position: center 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
}
.review-column {padding-bottom: 1px}
.review-column-image img {
	border-radius: 999px;
	height: 99px;
	width: 99px
}
.review-column-name {
	text-align: center;
	margin-bottom: 5px
}
.review-column-position {
	font-size: 80%;
	text-align: center
}

@media(max-width: 480px) {
	.hero-section h1 {font-size: 40px;}
	.home .hero-section {padding-top: 75px;}
	.wp-block-latest-posts__list li {margin-right: 0 !important}
	.advantages-block {gap: 40px}
	.processes-section {gap: 5px}
	.wp-block-latest-posts__list {gap: 15px;}
	#top-bar .topbar-content {
		display: block;
		height: 100px;
	}
	.hero-section {
		height: 720px;
		padding-top: 75px;
	}
}





