.wpcf7 .screen-reader-response {
position: absolute;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
width: 1px;
margin: -1px;
padding: 0;
border: 0;
word-wrap: normal !important;
}
.wpcf7 form .wpcf7-response-output {
margin: 2em 0.5em 1em;
padding: 0.2em 1em;
border: 2px solid #00a0d2; }
.wpcf7 form.init .wpcf7-response-output,
.wpcf7 form.resetting .wpcf7-response-output,
.wpcf7 form.submitting .wpcf7-response-output {
display: none;
}
.wpcf7 form.sent .wpcf7-response-output {
border-color: #46b450; }
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
border-color: #dc3232; }
.wpcf7 form.spam .wpcf7-response-output {
border-color: #f56e28; }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
border-color: #ffb900; }
.wpcf7-form-control-wrap {
position: relative;
}
.wpcf7-not-valid-tip {
color: #dc3232; font-size: 1em;
font-weight: normal;
display: block;
}
.use-floating-validation-tip .wpcf7-not-valid-tip {
position: relative;
top: -2ex;
left: 1em;
z-index: 100;
border: 1px solid #dc3232;
background: #fff;
padding: .2em .8em;
width: 24em;
}
.wpcf7-list-item {
display: inline-block;
margin: 0 0 0 1em;
}
.wpcf7-list-item-label::before,
.wpcf7-list-item-label::after {
content: " ";
}
.wpcf7-spinner {
visibility: hidden;
display: inline-block;
background-color: #23282d; opacity: 0.75;
width: 24px;
height: 24px;
border: none;
border-radius: 100%;
padding: 0;
margin: 0 24px;
position: relative;
}
form.submitting .wpcf7-spinner {
visibility: visible;
}
.wpcf7-spinner::before {
content: '';
position: absolute;
background-color: #fbfbfc; top: 4px;
left: 4px;
width: 6px;
height: 6px;
border: none;
border-radius: 100%;
transform-origin: 8px 8px;
animation-name: spin;
animation-duration: 1000ms;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
@media (prefers-reduced-motion: reduce) {
.wpcf7-spinner::before {
animation-name: blink;
animation-duration: 2000ms;
}
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes blink {
from {
opacity: 0;
}
50% {
opacity: 1;
}
to {
opacity: 0;
}
}
.wpcf7 [inert] {
opacity: 0.5;
}
.wpcf7 input[type="file"] {
cursor: pointer;
}
.wpcf7 input[type="file"]:disabled {
cursor: default;
}
.wpcf7 .wpcf7-submit:disabled {
cursor: not-allowed;
}
.wpcf7 input[type="url"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"] {
direction: ltr;
}
.wpcf7-reflection > output {
display: list-item;
list-style: none;
}
.wpcf7-reflection > output[hidden] {
display: none;
}@import url("https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");
:root {
--primary-color: #8dc63f;
--dark-color: #333132;
--text-color: #666;
--border-color: #e5e5e5;
--nav-dark: #1B3444;
--dayk-light: #f8f9fa;
--dayk-white: #ffffff; --section-padding-desktop: 100px;
--section-padding-tablet: 80px;
--section-padding-mobile: 60px;
--grid-gap-desktop: 50px;
--grid-gap-tablet: 30px;
--grid-gap-mobile: 20px;
--active-image: url(http://localhost/dayk/wp-content/uploads/faaliyet-3.jpg);
}
@media (min-width: 576px) {
.container {
max-width: 540px;
}
}
@media (min-width: 768px) {
.container {
max-width: 720px;
}
}
@media (min-width: 992px) {
.container {
max-width: 960px;
}
}
@media (min-width: 1200px) {
.container {
max-width: 1140px;
}
}
html {
scroll-behavior: smooth;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
html {
scroll-behavior: smooth;
}
}
body {
font-family: "Roboto", sans-serif;
font-weight: normal;
font-style: normal;
color: #333132 !important;
overflow-x: hidden;
margin: 0;
padding: 0;
}
h1, h2, h3, h4, h5, h6 {
color: #333132 !important;
}
img {
max-width: 100%;
height: auto;
} .navbar {
position: absolute !important;
top: 0;
left: 0;
right: 0;
z-index: 1050;
padding: 20px 0;
background: transparent;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.navbar.mega-open {
background: #fff !important;
}
.navbar .container {
position: relative;
padding-left: 0;
padding-right: 0;
}
.navbar .container::after {
content: '';
position: absolute;
left: 0;
right: 0;
top: 60px;
height: 1px;
margin-top: 5px;
background-color: rgba(255, 255, 255, 0.5);
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.navbar .container-content {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
} .navbar-brand {
position: relative;
padding: 0;
margin-right: 2rem;
}
.navbar-brand img {
height: 50px;
width: auto;
}
.logo-light {
opacity: 1;
}
.logo-dark {
position: absolute;
left: 0;
opacity: 0;
} .navbar.mega-open .logo-light {
opacity: 0;
}
.navbar.mega-open .logo-dark {
opacity: 1;
} .navbar-collapse {
justify-content: space-between;
align-items: center;
}
.navbar-nav {
margin: 0 auto;
}
.navbar-nav .nav-link {
color: #fff !important;
font-weight: 400;
padding: 0.5rem 1rem !important;
padding-bottom: 0 !important;
margin-bottom: 0 !important;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.navbar-nav .nav-link:hover {
color: var(--primary-color) !important;
} .nav-item {
padding: 0 10px;
}
.nav-item.dropdown {
position: static;
padding-bottom: 10px;
}
.nav-item.dropdown .nav-link{
cursor: default;
}
.mega-menu {
position: absolute;
width: 100vw;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;
top: calc(100%);
background: #fff;
opacity: 0;
visibility: hidden;
transform: translateY(-20px);
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
z-index: 1010;
pointer-events: none;
border-bottom: 1px solid grey;
} .mega-menu-active .mega-menu {
pointer-events: auto;
}
.mega-menu::before {
content: '';
position: absolute;
top: -10px; left: 0;
width: 100%;
height: 10px;
background: transparent;
} .navbar.mega-open {
background: #fff !important;
}
.navbar.mega-open .container::after {
opacity: 0;
}
.navbar.mega-open .nav-link {
color: var(--dark-color) !important;
}
.navbar.mega-open .nav-link:hover {
color: var(--primary-color) !important;
} .mega-menu-content {
max-width: 1140px;
margin: 0 auto;
padding: 60px 15px;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 60px;
position: relative;  
} .overview-content {
font-size: 1rem;
line-height: 1.6;
color: var(--text-color);
}
.overview-content p {
margin-bottom: 20px;
}
.overview-link {
color: var(--primary-color);
text-decoration: none;
font-weight: 500;
display: inline-flex;
align-items: center;
gap: 8px;
transition: all 0.3s ease;
}
.overview-link:hover {
gap: 12px;
}
.overview-link::after {
content: '→';
transition: transform 0.3s ease;
}
.overview-link:hover::after {
transform: translateX(3px);
} .menu-section {
position: relative;
}
.menu-title {
font-size: 1.2rem;
font-weight: 500;
color: var(--dark-color);
margin-bottom: 25px;
padding-bottom: 15px;
border-bottom: 1px solid var(--border-color);
position: relative;
}
.menu-title::after {
content: '';
position: absolute;
left: 0;
bottom: -1px;
width: 40px;
height: 2px;
background: var(--primary-color);
} .menu-links {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 5px;
}
.menu-links a {
color: var(--text-color);
text-decoration: none;
font-size: 1.5rem;
padding: 0 0 20px 0;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 12px;
border-bottom: 1px solid transparent;
}
.menu-links a::before {
content: '';
width: 6px;
height: 6px;
border-radius: 50%;
background: var(--primary-color);
opacity: 0;
transform: scale(0);
transition: all 0.3s ease;
}
.menu-links a:hover {
color: var(--primary-color);
padding-left: 8px;
}
.menu-links a:hover::before {
opacity: 1;
transform: scale(1);
}
.featured-section {
align-content: start;
background: transparent;
padding: 0;
margin-top: 50px;
}
.featured-content {
display: block;
text-decoration: none;
position: relative;
}
.featured-card {
position: relative;
background: #fff;
overflow: hidden;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}
.featured-image {
position: relative;
aspect-ratio: 16/9;
overflow: hidden;
}
.featured-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.6s ease;
}
.featured-content:hover .featured-image img {
transform: scale(1.08);
}
.featured-overlay {
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: auto;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 100%);
padding: 50px 0 0;
}
.featured-info {
padding: 20px;
transform: translateY(0);
transition: transform 0.4s ease;
}
.featured-title {
font-size: 16px;
font-weight: 500;
line-height: 1.4;
margin: 0;
color: #fff !important;
text-overflow: ellipsis " ...";
} @media (max-width: 991px) {
.featured-info {
padding: 16px;
}
.featured-title {
font-size: 15px;
}
} @media (max-width: 991.98px) {
.mega-menu {
position: static;
width: 100%;
margin: 0;
background: transparent;
border-top: none;
}
.mega-menu-content {
grid-template-columns: 1fr;
gap: 30px;
padding: 30px 15px;
}
.menu-section {
background: rgba(255, 255, 255, 0.05);
padding: 20px;
border-radius: 8px;
}
.menu-title {
color: #fff;
border-bottom-color: rgba(255, 255, 255, 0.1);
}
.menu-links a {
color: rgba(255, 255, 255, 0.8);
}
.menu-links a:hover {
color: #fff;
}
}
@media (max-width: 991.98px) {
.navbar .container-content {
padding: 0 16px;
}
.info-image {
display: none;
}
} .navbar-right {
display: flex;
align-items: center;
gap: 1.5rem;
} .search-button {
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
}
.nav-search-btn {
background: none;
border: none;
padding: 0;
color: #fff;
cursor: pointer;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.nav-search-btn i {
font-size: 20px;
}
.navbar.mega-open .nav-search-btn,
.nav-item.dropdown:hover~.navbar-right .nav-search-btn {
color: var(--dark-color);
} .social-icons {
display: flex;
gap: 0.75rem;
}
.social-icon {
width: 30px;
height: 30px;
border-radius: 50%;
background: #f5f5f5;
display: flex;
align-items: center;
justify-content: center;
color: var(--dark-color);
text-decoration: none;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.social-icon:hover {
background: var(--primary-color);
color: #fff;
}
.navbar.mega-open .social-icon,
.nav-item.dropdown:hover~.navbar-right .social-icon {
background: var(--border-color);
color: var(--dark-color);
} .lang-selector .dropdown-toggle {
background: transparent;
border: 1px solid var(--border-color);
color: #fff !important;
border-radius: 3px;
font-weight: 500;
font-size: 1rem;
display: flex;
align-items: center;
gap: 0.5rem;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.navbar.mega-open .lang-selector .dropdown-toggle,
.nav-item.dropdown:hover~.navbar-right .lang-selector .dropdown-toggle {
background: var(--primary-color);
color: #fff;
}
.dropdown-item.active {
background-color: var(--nav-dark) !important;
}
.active-lang {
color: var(--border-color) !important;
}
.dropdown-toggle::after {
color: var(--border-color) !important;
}
@media (max-width: 991.98px) { .navbar-collapse {
position: fixed;
top: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100vh;
padding: 20px;
background: var(--nav-dark);
transform: translateX(100%);
transition: transform 0.3s ease-in-out;
overflow-y: auto;
z-index: 1050;
display: flex !important;
flex-direction: column;
justify-content: flex-start;
will-change: transform;
}
.navbar-collapse.show {
transform: translateX(0);
}
.collapse:not(.show) {
display: block !important;
height: 100vh !important;
visibility: hidden;
transform: translateX(100%);
} .mobile-menu-header {
display: flex;
justify-content: end;
align-items: center;
margin-bottom: 20px;
padding-bottom: 15px;
width: 100%;
}
.mobile-close-btn {
background: none;
border: none;
color: #fff;
font-size: 24px;
cursor: pointer;
} .navbar-nav {
flex: 1 0 auto;
margin: 0;
padding: 20px 0;
width: 100%;
}
.nav-item {
width: 100%;
}
.nav-link {
padding: 15px 0;
color: #fff !important;
font-size: 1.1rem;
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
}
.navbar-nav .nav-link {
justify-content: space-between;
display: flex;
font-size: 1.3rem;
} .nav-item.dropdown .nav-link::after {
content: '\25BC';
font-size: 0.8em;
transition: transform 0.3s ease;
}
.nav-item.dropdown.show .nav-link::after {
transform: rotate(180deg);
}
.navbar-collapse {
display: block !important;
opacity: 1 !important;
height: 100vh !important;
} .mega-menu {
position: static;
width: 100%;
margin: 0;
background: transparent;
opacity: 1;
visibility: visible;
transform: none;
pointer-events: auto;
display: none;
}
.nav-item.dropdown.show .mega-menu {
display: block;
}
.mega-menu-content {
grid-template-columns: 1fr;
padding: 0;
gap: 20px;
}
.menu-section {
background: rgba(255, 255, 255, 0.05);
padding: 15px;
border-radius: 8px;
margin-bottom: 10px;
width: 100%;
}
.menu-title {
color: rgba(255, 255, 255, 0.9) !important;
font-size: 1rem;
padding-bottom: 10px;
margin-bottom: 10px;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.overview-content p {
color: var(--border-color);
}
.menu-links {
width: 100%;
}
.menu-links a {
color: var(--primary-color) !important;
font-size: 1rem;
padding: 8px 0;
display: block;
width: 100%;
} .featured-section {
display: none;
} .navbar-right {
margin-top: auto;
padding-top: 20px;
border-top: 1px solid rgba(255, 255, 255, 0.1);
display: flex;
flex-direction: column;
align-items: center;
gap: 20px;
width: 100%;
} .search-button {
width: 100%;
}
.active-lang {
color: var(--border-color) !important;
}
.dropdown-toggle::after {
color: var(--border-color) !important;
}
.nav-search-btn {
padding: 10px;
border: none;
color: #fff;
text-align: left;
} .social-icons {
display: flex;
justify-content: center;
gap: 15px;
width: 100%;
}
.social-icon {
width: 40px;
height: 40px;
background: rgba(255, 255, 255, 0.1);
color: #fff;
} .lang-selector {
width: 100%;
}
.lang-selector .dropdown-toggle {
width: 100%;
justify-content: center;
padding: 10px;
background: rgba(255, 255, 255, 0.1);
border: none;
color: #fff;
}
.dropdown-menu {
width: 100%;
background: rgba(255, 255, 255, 0.1);
border: none;
}
.dropdown-item {
color: #fff;
text-align: center;
padding: 10px;
}
.dropdown-item:hover {
background: rgba(255, 255, 255, 0.2);
}
} .page-nav {
background-color: #fff;
width: 100%;
z-index: 1040; position: relative;
padding: 0;
transition: all 0.3s ease;
} .page-nav .container {
position: relative;
padding: 0;
} .page-nav .page-nav-list {
display: flex;
gap: 30px;
margin: 0;
padding: 0;
list-style: none;
} .page-nav .page-nav-item {
position: relative;
} .page-nav .page-nav-link {
padding: 20px 0;
color: #333132;
font-size: 15px;
font-weight: 500;
text-decoration: none;
transition: all 0.3s ease;
position: relative;
display: block;
} .page-nav .container::after {
content: '';
position: absolute;
bottom: -1px;
left: 0;
width: 100%;
height: 2px;
background-color: var(--border-color);
} .page-nav .page-nav-link:hover {
color: #8dc63f;
}
.page-nav .page-nav-link.active {
color: #8dc63f;
} .page-nav .page-nav-link::after {
content: '';
position: absolute;
bottom: -2px;
left: 0;
width: 100%;
height: 4px;
z-index: 10;
background-color: #8dc63f;
transform: scaleX(0);
transition: transform 0.3s ease;
}
.page-nav .page-nav-link:hover::after,
.page-nav .page-nav-link.active::after {
transform: scaleX(1);
} .page-nav.is-sticky {
position: fixed;
top: 0;
left: 0;
right: 0;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
animation: slideDown 0.3s ease-out forwards;
} .page-nav.is-sticky .container::after {
opacity: 0;
} @keyframes slideDown {
from {
transform: translateY(-100%);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
} @media (max-width: 991.98px) {
.page-nav .page-nav-list {
flex-wrap: nowrap;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
padding: 10px 0;
gap: 20px;
}
.page-nav .page-nav-link {
white-space: nowrap;
padding: 10px 0;
}
.page-nav.is-sticky {
position: fixed;
top: 0;
}
}
@media (max-width: 768px) {
.page-nav {
display: none;
}
} .page-nav-wrapper {
position: relative;
width: 100%;
height: auto;
}
.video-play-button {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 80px;
height: 80px;
border-radius: 50%;
background: rgba(141, 198, 63, 0.9);
border: none;
color: white;
cursor: pointer;
z-index: 10;
transition: all 0.3s ease;
}
.video-play-button:hover {
background: rgba(141, 198, 63, 1);
transform: translate(-50%, -50%) scale(1.1);
}
.video-play-button i {
font-size: 24px;
} .hero-container {
position: relative;
width: 100%;
height: 100vh;
overflow: hidden;
} .desktop-video-container {
display: none;
position: relative;
width: 100%;
height: 100%;
}
@media (min-width: 992px) {
.desktop-video-container {
display: block;
}
.mobile-only {
display: none;
}
}
.video-container {
position: relative;
width: 100%;
height: 100%;
}
.video-container video {
width: 100%;
height: 100%;
object-fit: cover;
}
.video-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.3);
} @media (max-width: 991px) {
.hero-container {
height: 50vh; }
.expertise-section .section-header{
align-items: start !important;
}
}
@media (max-width: 576px) {
.hero-container {
height: 40vh;
}
}
.hero-video {
width: 100%;
height: 100%;
object-fit: cover;
}
.video-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.3);
} .swiper-slide {
opacity: 0;
transition: opacity 1s ease-in-out;
}
.swiper-slide-active {
opacity: 1;
}
.slide-image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
.slide-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 20s ease-out;
}
.swiper-slide-active .slide-image img {
transform: scale(1.1);
} .swiper-fade .swiper-slide {
pointer-events: none;
transition-property: opacity;
}
.swiper-fade .swiper-slide-active {
pointer-events: auto;
} .slide-overlay::before,
.slide-overlay::after {
transition: opacity 1.5s ease-in-out;
} .slide-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
}
.slide-overlay::before,
.slide-overlay::after {
content: '';
position: absolute;
left: 0;
width: 100%;
}
.slide-overlay::before {
top: 0;
height: 30%;
background: linear-gradient(to bottom,
rgba(0, 0, 0, 0.8) 0%,
rgba(0, 0, 0, 0.6) 20%,
rgba(0, 0, 0, 0) 100%);
}
.slide-overlay::after {
bottom: 0;
height: 30%;
background: linear-gradient(to top,
rgba(0, 0, 0, 0.8) 0%,
rgba(0, 0, 0, 0.6) 20%,
rgba(0, 0, 0, 0) 100%);
}
.slide-content {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
color: #fff;
z-index: 2;
width: 100%;
}
.slide-title {
font-size: 3.5rem;
font-weight: 700;
margin-bottom: 1rem;
transform: translateY(40px);
opacity: 0;
transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1) 0.3s;
}
.swiper-slide-active .slide-title {
transform: translateY(0);
opacity: 1;
} .slider-custom-nav {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
z-index: 10;
}
.slider-custom-nav .container {
padding: 0;
}
.slider-nav-content {
display: flex;
justify-content: space-between;
align-items: flex-end;
padding-bottom: 0;
} .slider-buttons {
display: flex;
position: relative;
overflow: visible;
isolation: isolate;
} .slider-buttons::before {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(10deg,
rgba(255, 255, 255, 0.5) 0%,
rgba(27, 52, 68, 0.5) 50%,
rgba(27, 52, 68, 0.7) 100%);
z-index: -1;
} .slider-nav-button {
border: none;
padding: 25px 35px;
min-width: 200px;
color: #fff;
cursor: pointer;
display: flex;
align-items: center;
position: relative;
background: transparent;
opacity: 0.85;
transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
overflow: hidden;
z-index: 1;
}
.slider-nav-button:hover {
background-color: rgba(212, 231, 243, 0.7);
} .slider-nav-button::before {
content: '';
position: absolute;
inset: 0;
background: rgba(27, 52, 68, 0.8);
z-index: -2;
transition: opacity 0.5s ease;
} .slider-nav-button::after {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(135deg,
rgba(141, 198, 63, 0.95) 0%,
rgba(141, 198, 63, 0.85) 100%);
z-index: -1;
transition: left 0.5s cubic-bezier(0.4, 0, 0.2, 1);
} .slider-nav-button.active {
opacity: 1;
}
.slider-nav-button.active::before {
opacity: 0;
}
.slider-nav-button.active::after {
left: 0;
} .slider-nav-button .nav-icon {
width: 70px;
height: 40px;
position: relative;
z-index: 2;
} .slider-nav-button:not(.active):hover {
opacity: 0.95;
}
.slider-nav-button:not(.active):hover .nav-icon {
transform: scale(1.05);
} .slider-nav-button .nav-icon,
.slider-nav-button .nav-text-primary,
.slider-nav-button .nav-text-secondary {
position: relative;
z-index: 2;
transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
.nav-text-container {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 4px;
}
.nav-text-primary {
font-weight: 600;
font-size: 16px;
text-transform: uppercase;
line-height: 1;
}
.nav-text-secondary {
font-weight: 300;
font-size: 16px;
text-transform: uppercase;
line-height: 1;
} .slider-info {
color: #fff;
text-align: right;
display: flex;
align-items: flex-start;
gap: 20px;
padding-bottom: 25px;
}
.slider-text-container {
display: flex;
flex-direction: column;
text-align: right;
}
.slider-tagline {
font-size: 1.1rem;
color: #8dc63f;
letter-spacing: 1.2px;
line-height: 1;
font-weight: 500;
}
.slider-current-title {
font-size: 1.7rem;
font-weight: bold;
position: relative;
display: inline-block;
}
.text-animate {
animation: textChange 0.5s ease forwards;
}
.char {
display: inline-block;
opacity: 0;
transform: translateX(-20px);
filter: blur(10px);
animation: charReveal 0.3s ease forwards;
}
@keyframes textChange {
0% {
opacity: 1;
filter: blur(0);
transform: translateX(0);
}
100% {
opacity: 0;
filter: blur(10px);
transform: translateX(20px);
}
}
@keyframes charReveal {
0% {
opacity: 0;
transform: translateX(-20px);
filter: blur(10px);
}
100% {
opacity: 1;
transform: translateX(0);
filter: blur(0);
}
}
.vertical-line {
width: 2px;
height: 60px;
background: rgba(255, 255, 255, 0.7);
} @keyframes textChange {
0% {
opacity: 1;
filter: blur(0);
transform: translateX(0);
}
100% {
opacity: 0;
filter: blur(10px);
transform: translateX(20px);
}
}
@keyframes charReveal {
0% {
opacity: 0;
transform: translateX(-20px);
filter: blur(10px);
}
100% {
opacity: 1;
transform: translateX(0);
filter: blur(0);
}
} @media (max-width: 1024px) {
.slider-info {
padding-bottom: 0;
}
}
@media (max-width: 991.98px) {
.main-slider {
height: 50vh !important;
}
.slider-nav-content {
flex-direction: column;
align-items: stretch;
}
.slider-buttons {
display: none;
}
.slider-nav-button {
padding: 15px 20px;
}
.slider-info {
padding: 20px;
justify-content: center;
}
.slider-text-container {
text-align: center;
}
.vertical-line {
display: none;
}
} .what-we-do-section {
padding: 70px 0;
background-color: #fff;
}
.what-we-do-section .section-title-col {
align-content: center;
}
.what-we-do-section .section-title {
font-size: 2rem;
font-weight: 600;
margin-bottom: 30px;
position: relative;
}
.what-we-do-section .content-wrapper {
padding-left: 30px;
}
.what-we-do-section .main-description {
font-size: 1rem;
line-height: 1.6;
color: #333132;
margin-bottom: 30px;
font-weight: 400;
}
.what-we-do-section .read-more {
display: inline-block;
color: #8dc63f;
text-decoration: none;
font-weight: 500;
font-size: 1rem;
transition: all 0.3s ease;
}
.what-we-do-section .read-more:hover {
color: #7ab800;
padding-left: 5px;
} @media (max-width: 991.98px) {
.what-we-do-section {
padding: 60px 0;
}
.what-we-do-section .content-wrapper {
padding-left: 0;
margin-top: 30px;
}
.section-title {
font-size: 1.5rem !important;
}
}
@media (max-width: 767.98px) {
.what-we-do-section .main-description {
font-size: 1.1rem;
}
} .activities-section {
padding: 70px 0;
background-color: #fff;
}
.activities-section .section-title {
font-size: 2rem;
font-weight: 500;
color: #333132;
margin-bottom: 50px;
} .activities-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 50px;
align-items: flex-start;
} .activities-left {
display: flex;
flex-direction: column;
gap: 2px;
background: #fff;
overflow: hidden;
height: 810px;
}
.activities-left .activity-image {
width: 100%;
height: calc((100% - 4px) / 3);
overflow: hidden;
position: relative;
} .activity-column {
display: flex;
flex-direction: column;
gap: 50px;
}
.activity-column .activity-item {
display: flex;
flex-direction: column;
}
.activity-column .activity-image {
height: 270px;
overflow: hidden;
position: relative;
} .activity-image {
position: relative;
}
.activity-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.6s ease;
}
.activity-image a {
display: block;
width: 100%;
height: 100%;
} .activity-image:hover img {
transform: scale(1.05);
} .activity-content {
padding: 20px 0;
}
.activity-content a {
text-decoration: none;
}
.activity-content h3 {
font-size: 1.5rem;
font-weight: 500;
color: #333132;
margin-bottom: 15px;
transition: color 0.3s ease;
}
.activity-content h3:hover {
color: #8dc63f;
}
.activity-content p {
font-size: 1rem;
color: #666;
line-height: 1.6;
margin: 0;
} .container {
max-width: 1140px;
margin: 0 auto;
padding: 0 15px;
} @media (max-width: 1200px) {
.container {
max-width: 960px;
}
}
@media (max-width: 991.98px) {
.container {
max-width: 720px;
}
.activities-grid {
grid-template-columns: 1fr;
gap: 30px;
}
.activities-left {
height: auto;
gap: 2px;
}
.activities-left .activity-image {
height: 200px;
}
.activity-column {
gap: 30px;
}
.activity-column .activity-image {
height: 200px;
}
.activity-content {
padding: 15px 0;
}
}
@media (max-width: 768px) {
.container {
max-width: 540px;
}
.activities-section {
padding: 50px 0;
}
.activities-section .section-title {
font-size: 1.8rem;
margin-bottom: 30px;
}
.activities-left .activity-image,
.activity-column .activity-image {
height: 180px;
}
.activity-content h3 {
font-size: 1.3rem;
margin-bottom: 10px;
}
.activity-content p {
font-size: 0.95rem;
}
}
@media (max-width: 576px) {
.container {
width: 100%;
padding: 0 15px;
}
.activities-section {
padding: 40px 0;
}
.activities-left .activity-image,
.activity-column .activity-image {
height: 160px;
}
.activity-content {
padding: 12px 0;
}
.activity-content h3 {
font-size: 1.2rem;
}
.activities-grid {
gap: 50px;
}
.activity-column {
gap: 50px;
}
} @keyframes fadeIn {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.activities-grid {
animation: fadeIn 0.6s ease-out forwards;
} .expertise-section {
padding: 70px 0;
background-color: #fff;
}
.expertise-section .section-header {
margin-bottom: 50px;
}
.expertise-section .section-title {
font-size: 2rem;
font-weight: 500;
d-color: #333132;
margin: 0;
}
.view-all-link {
color: #8dc63f;
text-decoration: none;
font-weight: 500;
display: flex;
align-items: center;
gap: 5px;
transition: all 0.3s ease;
}
.view-all-link:hover {
color: #7ab800;
}
.expertise-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 50px;
}
.expertise-item {
display: flex;
flex-direction: column;
transition: transform 0.3s ease;
}
.expertise-item::after {
content: '';
margin-top: 10px;
border-bottom: 1px solid #727272;
}
.expertise-item:hover {
transform: translateY(-5px);
}
.expertise-image {
width: 100%;
height: 370px;
overflow: hidden;
margin-bottom: 20px;
}
.expertise-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.3s ease;
}
.expertise-item:hover .expertise-image img {
transform: scale(1.05);
}
.expertise-content {
padding: 0;
}
.expertise-category {
d-color: #333132;
font-size: 0.9rem;
margin-bottom: 10px;
}
.expertise-content a {
text-decoration: none !important;
}
.expertise-title {
font-size: 1.4rem;
font-weight: bold;
d-color: #333132;
margin-bottom: 15px;
line-height: 1.4;
}
.expertise-title:hover {
color: #679800 !important;
}
.expertise-location {
color: #666;
font-size: 0.9rem;
} @media (max-width: 991.98px) {
.expertise-section {
padding: 60px 0;
}
.expertise-grid {
grid-template-columns: repeat(2, 1fr);
gap: 20px;
}
}
@media (max-width: 767.98px) {
.expertise-grid {
grid-template-columns: 1fr;
}
.section-header {
flex-direction: column;
gap: 15px;
align-items: flex-start;
}
} .organization-section {
padding: 70px 0;
background-color: #fff;
}
.organization-section .section-title {
font-size: 2rem;
font-weight: 500;
d-color: #333132;
} .feature-box {
display: grid;
grid-template-columns: 1.4fr 1fr;
margin-bottom: 50px;
}
.feature-content {
background-color: #8dc63f;
padding: 50px 20px 20px 20px;
display: flex;
flex-direction: column;
}
.feature-title {
font-size: 2rem;
font-weight: 500;
margin-bottom: 30px;
}
.feature-text {
font-size: 1.1rem;
line-height: 1.6;
margin-bottom: 20px;
}
.feature-content .read-more {
text-decoration: none;
color: #333132;
margin-top: auto;
align-self: flex-end;
font-weight: 500;
display: flex;
align-items: center;
gap: 5px;
transition: transform 0.3s ease;
}
.feature-content .read-more:hover {
transform: translateX(5px);
color: #333132 !important;
}
.feature-image {
width: 100%;
height: 100%;
overflow: hidden;
}
.feature-image img {
width: 100%;
height: 100%;
object-fit: cover;
} .info-cards {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 30px;
margin-top: 50px;
}
.info-card {
border: 2px solid #e5e5e5;
padding: 40px;
display: flex;
flex-direction: column;
transition: all 0.3s ease;
}
.info-card:hover {
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
transform: translateY(-5px);
}
.info-title {
font-size: 1.5rem;
font-weight: 500;
d-color: #333132;
margin-bottom: 15px;
}
.info-text {
color: #666;
margin-bottom: 20px;
}
.info-card .read-more {
color: #333132;
text-decoration: none;
font-weight: 500;
margin-top: auto;
align-self: flex-end;
display: flex;
align-items: center;
gap: 5px;
transition: transform 0.3s ease;
}
.info-card .read-more:hover {
transform: translateX(5px);
} @media (max-width: 991.98px) {
.organization-section {
padding: 60px 0;
}
.feature-box {
grid-template-columns: 1fr;
}
.feature-content {
padding: 40px;
}
.info-cards {
grid-template-columns: 1fr;
gap: 20px;
}
}
@media (max-width: 767.98px) {
.feature-title {
font-size: 1.3rem;
}
.feature-text {
font-size: 1rem;
}
.info-card {
padding: 30px;
}
} .career-section {
padding: 70px 0;
background-color: #fff;
}
.career-section .section-title {
font-size: 2rem;
font-weight: 500;
color: var(--bs-heading-color);
} .career-card {
display: grid;
grid-template-columns: 1fr 1fr;
margin-bottom: 50px;
}
.career-image {
width: 100%;
height: 100%;
border: 1px solid var(--primary-color);
overflow: hidden;
}
.career-image img {
width: 100%;
height: 100%;
max-height: 300px;
object-fit: cover;
}
.career-content {
background-color: #8dc63f;
padding: 20px;
display: flex;
flex-direction: column;
}
.career-title {
font-size: 2rem;
font-weight: 500;
margin-bottom: 30px;
}
.career-text {
font-size: 1.1rem;
line-height: 1.6;
margin-bottom: 30px;
}
.career-content .read-more {
color: #333132;
text-decoration: none;
margin-top: auto;
align-self: flex-end;
font-weight: 500;
display: flex;
align-items: center;
gap: 5px;
transition: transform 0.3s ease;
}
.career-content .read-more:hover {
color: #333132;
transform: translateX(5px);
} .career-info-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 30px;
}
.career-info-card {
border: 2px solid #e5e5e5;
padding: 20px;
display: flex;
flex-direction: column;
transition: all 0.3s ease;
}
.career-info-card:hover {
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
transform: translateY(-5px);
}
.info-title {
font-size: 1.5rem;
font-weight: 500;
color: #333;
margin-bottom: 15px;
}
.info-text {
color: #666;
margin-bottom: 20px;
}
.form-link {
display: flex;
align-items: center;
gap: 8px;
color: #333132;
text-decoration: none;
font-weight: 500;
margin-top: auto;
align-self: flex-end;
transition: transform 0.3s ease;
}
.fa-arrow-right-long {
padding-top: 3px;
}
.form-link:hover {
transform: translateX(5px);
}
.career-image-card {
overflow: hidden;
}
.career-image-card img {
width: 100%;
height: 100%;
max-height: 170px;
object-fit: cover;
transition: transform 0.3s ease;
}
.career-image-card:hover img {
transform: scale(1.05);
} @media (max-width: 991.98px) {
.career-section {
padding: 60px 0;
}
.career-card {
grid-template-columns: 1fr;
}
.career-content {
padding: 40px;
}
.career-info-grid {
grid-template-columns: 1fr;
gap: 20px;
}
.career-image-card img {
height: 300px;
}
}
@media (max-width: 767.98px) {
.career-title {
font-size: 1.75rem;
}
.career-text {
font-size: 1rem;
}
.career-info-card {
padding: 30px;
}
} .parallax-section {
position: relative;
height: 300px;
background-attachment: fixed;
background-position: center !important;
background-repeat: no-repeat;
background-size: cover;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
}
.parallax-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0; background: rgba(0, 0, 0, 0.4);
}
.parallax-content {
position: relative;
z-index: 2;
text-align: center;
width: 100%;
}
.quote-text {
color: #8dc63f !important;
font-size: 2.5rem;
font-weight: 500;
margin: 0;
padding: 0 20px;
letter-spacing: 1px;
line-height: 1.4;
} @media (max-width: 991.98px) {
.parallax-section {
background-attachment: scroll;
background-position: center center;
}
.quote-text {
font-size: 2rem;
}
}
@media (max-width: 767.98px) {
.parallax-section {
height: 200px;
}
.quote-text {
font-size: 1.5rem;
}
} @supports (-webkit-overflow-scrolling: touch) {
.parallax-section {
background-attachment: scroll;
}
} .ind-hero {
position: relative;
height: 60vh;
min-height: 500px;
display: flex;
align-items: center;
}
.ind-hero-image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
}
.ind-hero-image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.ind-hero-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(to bottom,
rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 20%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.5) 100%); z-index: 2;
}
.ind-hero .container {
height: 100%;
align-content: end;
}
.ind-hero-content {
position: absolute;
bottom: 50px; z-index: 3;
color: #fff;
max-width: 900px;
}
.ind-hero-title {
font-size: 2.7rem;
font-weight: 500;
margin-bottom: 5rem;
color: #fff !important;
}
.ind-hero-text {
font-size: 1.4rem;
line-height: 1.6;
opacity: 0.9;
} .ind-nav {
background: #fff;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
position: sticky;
top: 0;
z-index: 1000;
}
.ind-nav-list {
list-style: none;
display: flex;
gap: 40px;
margin: 0;
padding: 0;
height: 60px;
}
.ind-nav-item {
position: relative;
}
.ind-nav-link {
color: var(--dark-color);
padding: 20px 0;
font-size: 0.95rem;
font-weight: 500;
text-decoration: none;
transition: all 0.3s ease;
position: relative;
height: 100%;
display: flex;
align-items: center;
}
.ind-nav-link::after {
content: '';
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 3px;
background: var(--primary-color);
transform: scaleX(0);
transition: transform 0.3s ease;
}
.ind-nav-link:hover,
.ind-nav-link.active {
color: var(--primary-color);
}
.ind-nav-link:hover::after,
.ind-nav-link.active::after {
transform: scaleX(1);
} .ind-overview {
padding: 70px 0;
}
.ind-section-col {
align-content: center;
}
.ind-section-title {
font-size: 2rem;
font-weight: 500;
color: var(--dark-color);
margin-bottom: 30px;
}
.ind-overview-text {
color: var(--text-color);
font-size: 1rem;
line-height: 1.8;
margin-bottom: 30px;
}
.ind-overview-link {
display: inline-flex;
align-items: center;
gap: 8px;
color: var(--primary-color);
text-decoration: none;
font-weight: 500;
transition: all 0.3s ease;
}
.ind-overview-link:hover {
gap: 12px;
}
.ind-overview-link .arrow {
transition: transform 0.3s ease;
}
.ind-overview-link:hover .arrow {
transform: translateX(3px);
} @media (max-width: 991.98px) {
.ind-overview {
padding: 60px 0;
}
.ind-section-title {
margin-bottom: 20px;
font-size: 1.7rem;
}
.ind-hero-title {
font-size: 2rem;
}
}
@media (max-width: 767.98px) {
.ind-overview-text {
font-size: 0.95rem;
}
} .ind-projects {
padding: 70px 0;
}
.ind-projects .row {
--bs-gutter-x: 50px;
}
.ind-projects .col-lg-6:last-child {
display: flex;
flex-direction: column;
padding-left: 40px;
justify-content: space-between; }
.project-content-top {
margin-bottom: 40px; } .project-image {
width: 100%;
aspect-ratio: 636/656;
overflow: hidden;
}
.project-image img {
width: 100%;
height: 100%;
object-fit: cover;
} .project-tags {
margin-bottom: 15px;
}
.project-tag {
display: inline-block;
color: var(--text-color);
font-size: 0.9rem;
margin-right: 15px;
} .industries-project-title {
font-size: 1.5rem;
font-weight: 500;
line-height: 1.2;
color: var(--dark-color);
margin-bottom: 20px;
} .project-location {
padding-bottom: 15px;
border-bottom: 1px solid #e5e5e5;
margin-bottom: 40px;
}
.project-location span {
color: var(--text-color);
font-size: 0.9rem;
} .project-video {
margin-top: auto;
width: 100%;
aspect-ratio: 656/400;
overflow: hidden;
position: relative;
}
.project-video img {
width: 100%;
height: 100%;
object-fit: cover;
}
.video-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
padding: 30px 30px 10px 30px;
background: linear-gradient(to top, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.5) 100%);
color: #fff;
}
.video-text {
display: block;
font-size: 1rem;
margin-bottom: 15px;
line-height: 1.4;
opacity: 0.9;
}
.video-play {
border-top: 2px solid #ffffff7e;
display: flex;
align-items: center;
justify-content: end;
gap: 10px;
color: #fff;
text-decoration: none;
transition: opacity 0.3s ease;
}
.video-play:hover {
opacity: 0.8;
}
.video-play img {
width: 3rem;
height: auto;
} @media (max-width: 767.98px) {
.video-text {
font-size: 0.9rem;
}
.video-play img {
width: 80px; }
.video-overlay {
padding: 20px;
}
.ind-projects .col-lg-6:last-child {
padding-left: 0;
}
.ind-projects .row {
--bs-gutter-x: 0;
}
} .ind-section {
padding: 80px 0;
background-color: #fff;
}
.container {
max-width: 1140px;
margin: 0 auto;
padding: 0 15px;
} .ind-section {
padding: 80px 0;
background-color: #fff;
}
.container {
max-width: 1140px;
margin: 0 auto;
padding: 0 15px;
} .info-section {
padding: 80px 0;
background-color: #fff;
}
.info-container {
position: relative;
background-color: #8dc63f;
width: 100%;
height: auto; overflow: visible; }
.info-content {
display: flex;
width: 100%;
flex: 1;
opacity: 0;
visibility: hidden;
pointer-events: none;
height: auto; position: relative; transition: opacity 1.2s cubic-bezier(0.4, 0, 0.2, 1),
transform 1.2s cubic-bezier(0.4, 0, 0.2, 1);
} .info-content.active {
opacity: 1;
visibility: visible;
pointer-events: auto;
height: auto;
transition: opacity 1.2s cubic-bezier(0.4, 0, 0.2, 1),
transform 1.2s cubic-bezier(0.4, 0, 0.2, 1);
} .info-text-box {
flex: 1.5;
padding: 40px;
transform: translateX(-100%);
transition: transform 1.2s cubic-bezier(0.4, 0, 0.2, 1);
color: #333132;
}
.info-tag {
display: block;
font-size: 14px;
text-transform: uppercase;
margin-bottom: 20px;
font-weight: 500;
color: #333132;
}
.info-title {
font-size: 28px;
font-weight: 500;
margin-bottom: 25px;
line-height: 1.3;
color: #333132 !important;
}
.info-description {
font-size: 16px;
line-height: 1.6;
margin-bottom: 25px;
opacity: 0.9;
}
.info-subtitle {
font-size: 22px;
font-weight: 500;
margin: 30px 0 20px;
color: #333132 !important;
}
.info-items {
color: #fff;
}
.info-items p {
margin-bottom: 15px;
font-size: 16px;
line-height: 1.6;
opacity: 0.9;
}
.info-items strong {
display: block;
margin-bottom: 5px;
font-weight: 500;
} .info-image {
flex: 1;
transform: translateX(100%);
transition: transform 1.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.info-image img {
width: 100%;
height: 100%;
object-fit: cover;
} .info-content.active .info-text-box,
.info-content.active .info-image {
transform: translateX(0);
} .info-content.leaving {
opacity: 0;
visibility: hidden;
pointer-events: none;
}
.info-content.leaving .info-text-box {
transform: translateX(-100%);
}
.info-content.leaving .info-image {
transform: translateX(100%);
} .info-navigation {
display: flex;
justify-content: flex-end;
align-items: center;
gap: 20px;
margin-top: 20px;
}
.page-count {
font-size: 16px;
color: #333;
}
.nav-buttons {
display: flex;
gap: 10px;
}
.nav-prev,
.nav-next {
width: 50px;
height: 50px;
border: 1px solid #ddd;
background: transparent;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s ease;
}
.nav-prev:disabled,
.nav-next:disabled {
cursor: not-allowed;
opacity: 0.5;
}
.nav-prev svg,
.nav-next svg {
color: #727272;
}
.nav-prev:hover:not(:disabled),
.nav-next:hover:not(:disabled) {
background: #f5f5f5;
} .info-text-box h1,
.info-text-box h2,
.info-text-box h3,
.info-text-box h4,
.info-text-box h5,
.info-text-box h6 {
color: #333132 !important;
margin-bottom: 20px;
font-weight: 500;
}
.info-text-box p {
color: #333132;
margin-bottom: 15px;
line-height: 1.6;
}
.info-text-box ul,
.info-text-box ol {
color: #fff;
margin-bottom: 15px;
padding-left: 20px;
}
.info-text-box li {
margin-bottom: 8px;
}
.info-text-box a {
color: #fff;
text-decoration: underline;
transition: opacity 0.3s ease;
}
.info-text-box a:hover {
opacity: 0.8;
} .container {
max-width: 1140px;
margin: 0 auto;
padding: 0 15px;
} @media (max-width: 1200px) {
.container {
max-width: 960px;
}
}
@media (max-width: 991px) {
.container {
max-width: 720px;
}
.info-content {
flex-direction: column;
}
.info-text-box,
.info-image {
width: 100%;
}
.info-image {
height: 400px;
}
.info-text-box {
padding: 30px;
}
.info-title {
font-size: 24px;
}
}
@media (max-width: 767px) {
.container {
max-width: 540px;
}
.ind-section {
padding: 40px 0;
}
.info-text-box {
padding: 25px;
}
.info-title {
font-size: 22px;
}
.info-subtitle {
font-size: 20px;
}
.info-image {
height: 300px;
}
.nav-prev,
.nav-next {
width: 40px;
height: 40px;
}
}
@media (max-width: 576px) {
.container {
width: 100%;
padding: 0 15px;
}
.info-text-box {
padding: 20px;
}
.info-title {
font-size: 20px;
}
.info-description {
font-size: 15px;
}
.info-image {
height: 250px;
}
.info-navigation {
flex-direction: column;
align-items: center;
gap: 15px;
}
} .services-section {
padding: 80px 0;
background: #fff;
}
.services-wrapper {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 60px;
min-height: 600px;
}
.service-categories {
margin-top: 15px;
}
.service-category {
display: inline-block;
padding: 6px 15px;
background: rgba(141, 198, 63, 0.2);
color: #fff;
border-radius: 20px;
font-size: 0.9rem;
margin-right: 10px;
margin-bottom: 10px;
} .service-preview {
position: sticky;
top: 100px;
height: 600px;
overflow: hidden;
}
.preview-image {
width: 100%;
height: 100%;
object-fit: cover;
transition: 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}
.preview-image.changing {
opacity: 0;
transform: scale(1.1);
} .services-list-wrapper {
height: 600px;
overflow: hidden;
padding-right: 30px;
}
.services-list {
height: 100%;
overflow-y: auto;
overflow-x: hidden;
display: flex;
flex-direction: column;
gap: 25px;
padding-right: 15px;
margin-right: -15px;
} .service-item-container {
width: 100%;
display: grid;
gap: 20px;
padding-right: 40px;
margin-right: -40px;
} .service-item {
background: #fff;
padding: 25px 30px;
border-radius: 8px;
cursor: pointer;
position: relative;
transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
display: flex;
align-items: center;
gap: 20px;
border: 2px solid #eee;
overflow: hidden;
max-height: 70px;
width: 100%;
} .item-content {
flex: 1;
display: flex;
align-items: center;
gap: 20px;
} .item-number {
font-size: 42px;
font-weight: 600;
color: rgba(141, 198, 63, 0.2);
transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
min-width: 60px;
line-height: 1;
} .service-item h3 {
font-size: 17px;
font-weight: 500;
margin: 0;
position: relative;
z-index: 2;
transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
flex: 1;
color: var(--dark-color);
} .item-action {
display: flex;
align-items: center;
opacity: 0;
transform: translateX(20px);
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
margin-left: auto;
z-index: 100;
}
.item-action-link {
text-decoration: none;
display: flex;
align-items: center;
gap: 8px;
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
padding: 6px 16px;
border: 1px solid transparent;
border-radius: 40px;
}
.action-text {
font-size: 14px;
font-weight: 500;
color: var(--primary-color);
white-space: nowrap;
transition: all 0.3s ease;
}
.action-arrow {
position: relative;
display: flex;
align-items: center;
color: var(--primary-color);
transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
background: transparent !important;
}
.action-arrow i {
font-size: 14px;
transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
background: transparent;
} .service-item:hover:not(.active) {
transform: translateX(10px) scale(1.02);
border-color: var(--primary-color);
background: rgba(141, 198, 63, 0.05);
}
.service-item:hover .item-number {
color: rgba(141, 198, 63, 0.4);
}
.service-item:hover .item-action {
opacity: 1;
transform: translateX(0);
} .service-item:not(.active) .item-action-link:hover {
border-color: var(--primary-color);
}
.service-item:not(.active) .item-action-link:hover .action-text {
transform: translateX(-4px);
}
.service-item:not(.active) .item-action-link:hover .action-arrow {
transform: translateX(4px);
background: transparent !important;
} .service-item.active .item-action {
opacity: 1;
transform: translateX(0);
}
.service-item.active .item-action-link:hover {
border-color: white !important;
}
.service-item.active .action-text {
color: #fff;
}
.service-item.active .action-arrow {
color: #fff;
background: transparent !important;
} .service-item.active .item-action-link:hover .action-text {
opacity: 1;
transform: translateX(-4px);
}
.service-item.active .item-action-link:hover .action-arrow {
transform: translateX(4px);
background: transparent !important;
} .service-item .item-action-link:hover .action-arrow,
.service-item.active .item-action-link:hover .action-arrow,
.item-action-link:hover .action-arrow {
background: transparent !important;
} .service-item.active {
padding: 35px 40px;
min-height: 120px;
border-radius: 0;
background: var(--primary-color);
border-color: var(--primary-color);
transform: translateX(10px) scale(1.05);
z-index: 2;
}
.service-item.active::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: var(--active-image);
background-size: cover;
background-position: center;
opacity: 0.1;
z-index: 1;
}
.service-item.active .item-number {
font-size: 52px;
color: rgba(255, 255, 255, 0.3);
}
.service-item.active h3 {
font-size: 20px;
color: #fff !important;
}
.service-item.active .item-action {
opacity: 1;
transform: translateX(0);
}
.service-item.active .action-text {
color: #fff;
}
.service-item.active .action-arrow {
color: #fff;
}
.service-item.active .item-action-link:hover .action-arrow {
transform: scale(1.1);
background: #f0f0f0;
} .services-list::-webkit-scrollbar {
width: 6px;
}
.services-list::-webkit-scrollbar-track {
background: #f5f5f5;
border-radius: 10px;
}
.services-list::-webkit-scrollbar-thumb {
background: rgba(141, 198, 63, 0.3);
border-radius: 10px;
transition: all 0.3s ease;
}
.services-list:hover::-webkit-scrollbar-thumb {
background: rgba(141, 198, 63, 0.5);
} .container {
max-width: 1140px;
margin: 0 auto;
padding: 0 15px;
} @media (max-width: 1200px) {
.container {
max-width: 960px;
}
.service-item {
padding: 20px 25px;
}
.item-number {
font-size: 36px;
min-width: 50px;
}
.service-item.active {
padding: 30px 35px;
}
.service-item.active .item-number {
font-size: 46px;
}
}
@media (max-width: 991px) {
.container {
max-width: 720px;
}
.services-wrapper {
grid-template-columns: 1fr;
gap: 40px;
}
.service-preview {
position: relative;
top: 0;
height: 400px;
}
.services-list-wrapper {
height: auto;
max-height: 350px;
}
}
@media (max-width: 768px) {
.container {
max-width: 540px;
}
.services-list-wrapper {
padding-right: 15px;
}
.service-item {
padding: 15px 20px;
min-height: 70px;
}
.item-number {
font-size: 28px;
min-width: 40px;
}
.service-item h3 {
font-size: 16px;
}
.service-item.active {
padding: 25px 30px;
min-height: 90px;
}
.service-item.active .item-number {
font-size: 38px;
}
.service-item.active h3 {
font-size: 18px;
}
.action-text {
display: none;
}
.action-arrow {
width: 30px;
height: 30px;
}
}
@media (max-width: 576px) {
.container {
width: 100%;
padding: 0 15px;
}
.services-section {
padding: 40px 0;
}
.service-preview {
height: 300px;
}
.services-list {
gap: 15px;
}
}
.service-preview {
height: 600px; }
.preview-gallery {
height: 100%;
display: flex;
flex-direction: column;
}
.preview-main {
width: 100%;
flex: 1;
margin-bottom: 20px;
}
.preview-main.single-image {
height: 100%;
margin-bottom: 0;
}
.preview-main img {
width: 100%;
height: 100%;
min-height: 470px !important;
object-fit: cover;
transition: opacity 0.3s ease;
}
.preview-thumbs-container {
height: 160px;
display: flex;
align-items: center;
gap: 15px;
position: relative;
margin-top: auto;
}
.preview-thumbs {
flex: 1;
overflow: hidden;
position: relative;
width: calc(100% - 80px);
margin: 0 auto;
height: 100%;
}
.thumbs-track {
display: flex;
gap: 15px;
transition: transform 0.3s ease;
height: 100%;
}
.thumb-item {
flex: 0 0 calc(33.333% - 10px);
height: 100%;
cursor: pointer;
opacity: 0.6;
transition: opacity 0.3s ease;
border-radius: 4px;
overflow: hidden;
}
.thumb-item.active {
opacity: 1;
}
.thumb-item img {
width: 100%;
height: 100%;
object-fit: cover;
}
.thumb-nav {
width: 32px;
height: 32px;
border: none;
background: rgba(255, 255, 255, 0.8);
border-radius: 50%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: opacity 0.3s ease;
}
.thumb-nav:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.thumb-nav svg {
width: 20px;
height: 20px;
} .krnl-single-service-hero {
position: relative;
height: 400px;
background-color: var(--nav-dark);
margin-top: -100px;
display: flex;
align-items: center;
}
.krnl-single-service-hero-overlay {
position: absolute;
inset: 0;
background: linear-gradient(to bottom,
rgba(27, 52, 68, 0.9) 0%,
rgba(27, 52, 68, 0.8) 100%);
}
.krnl-single-service-hero-content {
position: relative;
z-index: 2;
text-align: center;
padding-top: 150px;
}
.krnl-single-service-categories {
margin-bottom: 20px;
}
.krnl-single-service-category {
display: inline-block;
padding: 6px 15px;
background: rgba(141, 198, 63, 0.1);
color: #fff;
border-radius: 20px;
font-size: 0.9rem;
font-weight: 500;
margin: 0 5px;
border: 1px solid rgba(255, 255, 255, 0.2);
}
.krnl-single-service-title {
font-size: 2.5rem;
color: #fff !important;
margin: 0;
font-weight: 500;
} .krnl-single-service-wrapper {
padding: 80px 0;
background: #fff;
}
.krnl-single-service-content {
position: relative;
}
.krnl-single-service-image {
margin-bottom: 30px;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}
.krnl-single-service-image img {
width: 100%;
height: auto;
display: block;
transition: transform 0.6s ease;
}
.krnl-single-service-image:hover img {
transform: scale(1.05);
}
.krnl-single-service-description {
color: var(--text-color);
font-size: 1.1rem;
line-height: 1.8;
}
.krnl-single-service-description p {
margin-bottom: 20px;
} .krnl-single-service-sidebar {
position: sticky;
top: 100px;
}
.krnl-single-service-info-box {
background: var(--dayk-light);
padding: 30px;
border-radius: 12px;
margin-bottom: 30px;
transition: all 0.3s ease;
}
.krnl-single-service-info-box:hover {
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}
.krnl-single-service-info-box h3 {
font-size: 1.2rem;
color: var(--dark-color);
margin-bottom: 20px;
padding-bottom: 15px;
border-bottom: 1px solid var(--border-color);
} .krnl-single-service-related {
list-style: none;
padding: 0;
margin: 0;
}
.krnl-single-service-related li {
padding: 12px 0;
border-bottom: 1px solid var(--border-color);
transition: all 0.3s ease;
}
.krnl-single-service-related li:last-child {
border-bottom: none;
}
.krnl-single-service-related li:hover {
padding-left: 10px;
}
.krnl-single-service-related a {
color: var(--dark-color);
text-decoration: none;
transition: color 0.3s ease;
display: block;
}
.krnl-single-service-related a:hover {
color: var(--primary-color);
} @media (max-width: 991px) {
.krnl-single-service-hero {
height: 300px;
}
.krnl-single-service-title {
font-size: 2rem;
}
.krnl-single-service-wrapper {
padding: 60px 0;
}
.krnl-single-service-sidebar {
margin-top: 40px;
position: static;
}
}
@media (max-width: 768px) {
.krnl-single-service-hero {
height: 250px;
}
.krnl-single-service-hero-content {
padding-top: 80px;
}
.krnl-single-service-title {
font-size: 1.8rem;
}
.krnl-single-service-wrapper {
padding: 40px 0;
}
.krnl-single-service-description {
font-size: 1rem;
}
}
@media (max-width: 576px) {
.krnl-single-service-hero {
height: 220px;
}
.krnl-single-service-category {
display: inline-block;
margin-bottom: 10px;
font-size: 0.8rem;
}
.krnl-single-service-title {
font-size: 1.5rem;
}
} .gallery-section {
background: #fff;
}
.gallery-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
}
.gallery-item {
position: relative;
aspect-ratio: 4/3;
border-radius: 12px;
overflow: hidden;
cursor: pointer;
}
.gallery-item img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.5s ease;
}
.gallery-overlay {
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
transition: opacity 0.3s ease;
}
.gallery-zoom {
color: #fff;
font-size: 24px;
transform: scale(0);
transition: transform 0.3s ease;
} .gallery-item:hover img {
transform: scale(1.1);
}
.gallery-item:hover .gallery-overlay {
opacity: 1;
}
.gallery-item:hover .gallery-zoom {
transform: scale(1);
} .gallery-popup {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.9);
display: flex;
align-items: center;
justify-content: center;
z-index: 9999;
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
}
.gallery-popup.active {
opacity: 1;
visibility: visible;
}
.popup-content {
position: relative;
max-width: 90%;
max-height: 90vh;
}
.popup-image {
max-width: 100%;
max-height: 90vh;
object-fit: contain;
}
.popup-close {
position: absolute;
top: -40px;
right: -40px;
width: 40px;
height: 40px;
border: none;
background: transparent;
color: #fff;
font-size: 32px;
cursor: pointer;
}
.popup-nav {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 50px;
height: 50px;
border: none;
background: rgba(255, 255, 255, 0.1);
color: #fff;
font-size: 24px;
cursor: pointer;
transition: background 0.3s ease;
}
.popup-nav:hover {
background: rgba(255, 255, 255, 0.2);
}
.popup-prev {
left: -60px;
}
.popup-next {
right: -60px;
} @media (max-width: 991px) {
.gallery-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 576px) {
.gallery-grid {
grid-template-columns: 1fr;
}
} .news-page {
padding: var(--section-padding-desktop) 0;
background-color: #fff;
} .news-filters {
margin-bottom: 40px;
text-align: right;
}
.filter-select {
padding: 12px 20px;
border: 1px solid var(--border-color);
border-radius: 8px;
min-width: 200px;
font-size: 0.95rem;
color: var(--dark-color);
cursor: pointer;
transition: all 0.3s ease;
background: #fff;
}
.filter-select:hover {
border-color: var(--primary-color);
} .news-list {
display: flex;
flex-direction: column;
gap: 30px;
margin-bottom: 50px;
} .news-card {
display: flex;
background: #fff;
border-radius: 12px;
overflow: hidden;
transition: all 0.3s ease;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}
.news-card:hover {
transform: translateY(-5px);
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
} .post-image {
flex: 0 0 400px;
position: relative;
overflow: hidden;
}
.post-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.5s ease;
}
.news-card:hover .post-image img {
transform: scale(1.05);
} .post-content {
flex: 1;
padding: 30px 40px;
display: flex;
flex-direction: column;
}
.post-meta {
display: flex;
align-items: center;
gap: 15px;
margin-bottom: 20px;
}
.post-category {
background: rgba(141, 198, 63, 0.1);
color: var(--primary-color);
padding: 6px 15px;
border-radius: 20px;
font-size: 0.85rem;
font-weight: 500;
transition: all 0.3s ease;
}
.news-card:hover .post-category {
background: var(--primary-color);
color: #fff;
}
.post-date {
color: var(--text-color);
font-size: 0.9rem;
display: flex;
align-items: center;
gap: 5px;
}
.post-title {
font-size: 1.5rem;
margin-bottom: 15px;
line-height: 1.4;
}
.post-title a {
color: var(--dark-color);
text-decoration: none;
transition: color 0.3s ease;
}
.post-title a:hover {
color: var(--primary-color);
}
.post-excerpt {
color: var(--text-color);
font-size: 1rem;
line-height: 1.7;
margin-bottom: auto;
}
.post-footer {
padding-top: 20px;
margin-top: auto;
border-top: 1px solid var(--border-color);
}
.read-more {
display: inline-flex;
align-items: center;
gap: 8px;
color: var(--dark-color);
text-decoration: none;
font-weight: 500;
transition: all 0.3s ease;
}
.read-more i {
font-size: 14px;
transition: transform 0.3s ease;
}
.read-more:hover {
color: var(--primary-color);
}
.read-more:hover i {
transform: translateX(5px);
} .news-list.loading {
position: relative;
min-height: 400px;
opacity: 0.5;
pointer-events: none;
}
.news-list.loading::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 50px;
height: 50px;
margin: -25px 0 0 -25px;
border: 3px solid var(--border-color);
border-top-color: var(--primary-color);
border-radius: 50%;
animation: spin 1s linear infinite;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
} .no-posts {
text-align: center;
padding: 60px 20px;
background: #f8f9fa;
border-radius: 12px;
}
.no-posts-icon {
font-size: 3rem;
color: var(--border-color);
margin-bottom: 20px;
}
.no-posts h3 {
font-size: 1.5rem;
color: var(--dark-color);
margin-bottom: 10px;
}
.no-posts p {
color: var(--text-color);
max-width: 500px;
margin: 0 auto;
} .pagination {
margin-top: 50px;
display: flex;
justify-content: center;
}
.pagination ul {
display: flex;
align-items: center;
gap: 10px;
list-style: none;
padding: 0;
margin: 0;
}
.pagination .page-numbers {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border-radius: 8px;
background: #f8f9fa;
color: var(--dark-color);
text-decoration: none;
transition: all 0.3s ease;
}
.pagination .page-numbers.current {
background: var(--primary-color);
color: #fff;
}
.pagination .page-numbers:hover:not(.current) {
background: var(--border-color);
} @media (max-width: 991px) {
.news-page {
padding: var(--section-padding-tablet) 0;
}
.news-card {
flex-direction: column;
}
.post-image {
flex: 0 0 250px;
}
.post-content {
padding: 25px;
}
.post-title {
font-size: 1.3rem;
}
}
@media (max-width: 768px) {
.news-filters {
text-align: left;
}
.filter-select {
width: 100%;
}
.post-meta {
flex-wrap: wrap;
}
.post-excerpt {
font-size: 0.95rem;
}
}
@media (max-width: 576px) {
.news-page {
padding: var(--section-padding-mobile) 0;
}
.post-image {
flex: 0 0 200px;
}
.post-content {
padding: 20px;
}
.post-title {
font-size: 1.2rem;
}
} .loading-indicator {
text-align: center;
padding: 30px 0;
color: var(--text-color);
}
.loading-spinner {
display: inline-block;
width: 40px;
height: 40px;
margin-bottom: 10px;
border: 3px solid rgba(141, 198, 63, 0.2);
border-top-color: var(--primary-color);
border-radius: 50%;
animation: spin 1s linear infinite;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
} .news-list.loading {
opacity: 0.5;
pointer-events: none;
transition: opacity 0.3s ease;
} .news-card {
animation: fadeIn 0.5s ease forwards;
}
@keyframes fadeIn {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
} .news-hero {
position: relative;
height: 600px;
margin-top: -100px;
display: flex;
align-items: flex-end;
}
.hero-image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.hero-image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.hero-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(to bottom,
rgba(0, 0, 0, 0.6) 0%,
rgba(0, 0, 0, 0.4) 100%);
}
.news-hero .container {
position: relative;
z-index: 2;
margin-bottom: 60px;
}
.news-hero-content {
position: relative;
color: #fff;
}
.news-date {
color: #fff;
display: inline-block;
font-size: 1.1rem;
margin-bottom: 1rem;
}
.news-title {
font-size: 3rem;
font-weight: 600;
line-height: 1.2;
color: #fff !important;
} .news-content {
padding: 20px 0;
background: #fff;
}
.content-wrapper {
max-width: 900px;
margin: 0 auto;
}
.main-content {
font-size: 1.1rem;
line-height: 1.8;
color: var(--text-color);
}
.main-content p {
margin-bottom: 1.5rem;
}
.main-content img {
max-width: 100%;
height: auto;
margin: 2rem 0;
} .share-label {
font-size: 0.9rem;
color: var(--text-color);
}
.share-button {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 10px 20px;
background: #fff;
border: 1px solid #e5e5e5;
border-radius: 6px;
color: #333132;
font-size: 0.95rem;
font-weight: 500;
cursor: pointer;
transition: all 0.3s ease;
}
.share-button:hover {
background: #f5f5f5;
} .related-news {
padding: 80px 0;
background: #f8f9fa;
}
.section-title {
font-size: 2rem;
font-weight: 600;
margin-bottom: 40px;
color: var(--dark-color);
}
.news-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
}
.news-card {
background: #fff;
border-radius: 4px;
overflow: hidden;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
transition: transform 0.3s ease;
}
.news-card:hover {
transform: translateY(-5px);
}
.news-card a {
text-decoration: none;
color: inherit;
}
.card-image {
width: 100%;
height: 220px;
overflow: hidden;
}
.card-image img {
height: 100%; object-fit: cover; transition: transform 0.3s ease; }
.card-content {
padding: 25px;
}
.card-date {
font-size: 0.9rem;
color: var(--text-color);
display: block;
margin-bottom: 10px;
}
.card-title {
font-size: 1.2rem;
color: var(--dark-color);
margin-bottom: 15px;
line-height: 1.4;
}
.read-more {
color: var(--primary-color);
font-weight: 500;
} @media (max-width: 991px) {
.news-hero {
height: 500px;
}
.hero-content {
padding-top: 150px;
}
.news-title {
font-size: 2.5rem;
}
.news-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 767px) {
.news-hero {
height: 400px;
}
.hero-content {
padding-top: 120px;
}
.news-title {
font-size: 2rem;
}
.news-content {
padding: 40px 0;
}
.news-grid {
grid-template-columns: 1fr;
}
.main-content {
font-size: 1rem;
}
} .category-hero {
position: relative;
height: 500px;
margin-top: -100px;
}
.category-hero-image {
position: absolute;
inset: 0;
z-index: 1;
}
.category-hero-image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.category-hero-overlay {
position: absolute;
inset: 0;
background: linear-gradient(to bottom,
rgba(0, 0, 0, 0.8) 0%,
rgba(0, 0, 0, 0.6) 50%,
rgba(0, 0, 0, 0.7) 100%);
z-index: 2;
}
.category-hero .container {
position: relative;
height: 100%;
display: flex;
align-items: flex-end;
z-index: 3;
}
.hero-content {
padding-bottom: 60px;
}
.category-meta {
display: flex;
align-items: center;
gap: 15px;
margin-bottom: 20px;
}
.post-count {
background: var(--primary-color);
color: #fff;
padding: 6px 12px;
border-radius: 4px;
font-size: 0.9rem;
font-weight: 500;
}
.category-name {
color: rgba(255, 255, 255, 0.9);
font-size: 0.9rem;
text-transform: uppercase;
letter-spacing: 1px;
}
.category-hero h1 {
color: #fff !important;
font-size: 3.5rem;
font-weight: 600;
margin-bottom: 20px;
line-height: 1.2;
}
.category-description {
color: rgba(255, 255, 255, 0.9);
font-size: 1.1rem;
line-height: 1.6;
max-width: 700px;
} .category-main {
padding: 80px 0;
background: #fff;
} .category-filters {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 40px;
padding-bottom: 20px;
border-bottom: 1px solid var(--border-color);
}
.filter-group {
display: flex;
align-items: center;
gap: 15px;
}
.filter-group label {
color: var(--text-color);
font-size: 0.95rem;
}
.sort-select {
padding: 8px 15px;
border: 1px solid var(--border-color);
border-radius: 6px;
background: #fff;
color: var(--dark-color);
font-size: 0.95rem;
cursor: pointer;
transition: all 0.3s ease;
}
.sort-select:hover {
border-color: var(--primary-color);
}
.posts-count {
color: var(--text-color);
font-size: 0.95rem;
} .category-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
}
.category-post {
background: #fff;
border-radius: 12px;
overflow: hidden;
transition: all 0.3s ease;
border: 1px solid rgba(0, 0, 0, 0.08);
}
.category-post:hover {
transform: translateY(-5px);
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
}
.post-image {
position: relative;
width: 100%;
aspect-ratio: 16/10;
overflow: hidden;
}
.post-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.5s ease;
}
.category-post:hover .post-image img {
transform: scale(1.05);
}
.image-overlay {
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.1);
opacity: 0;
transition: opacity 0.3s ease;
}
.category-post:hover .image-overlay {
opacity: 1;
}
.post-content {
padding: 25px;
}
.post-meta {
display: flex;
align-items: center;
margin-bottom: 15px;
}
.meta-left {
display: flex;
align-items: center;
gap: 15px;
}
.post-date {
color: var(--text-color);
font-size: 0.9rem;
}
.post-category {
color: var(--primary-color);
font-size: 0.85rem;
font-weight: 500;
padding: 4px 12px;
border: 1px solid var(--primary-color);
border-radius: 4px;
transition: all 0.3s ease;
}
.category-post:hover .post-category {
background: var(--primary-color);
color: #fff;
}
.category-post h2 {
font-size: 1.4rem;
font-weight: 500;
line-height: 1.4;
margin-bottom: 15px;
}
.category-post h2 a {
color: var(--dark-color);
text-decoration: none;
transition: color 0.3s ease;
}
.category-post h2 a:hover {
color: var(--primary-color);
}
.post-excerpt {
color: var(--text-color);
font-size: 0.95rem;
line-height: 1.6;
margin-bottom: 20px;
}
.post-footer {
padding-top: 20px;
border-top: 1px solid var(--border-color);
}
.read-more {
display: flex;
align-items: center;
gap: 8px;
color: var(--dark-color);
text-decoration: none;
font-size: 0.95rem;
font-weight: 500;
transition: all 0.3s ease;
}
.read-more i {
font-size: 0.8rem;
transition: transform 0.3s ease;
}
.read-more:hover {
color: var(--primary-color);
}
.read-more:hover i {
transform: translateX(3px);
} .no-posts {
grid-column: 1 / -1;
text-align: center;
padding: 60px 20px;
background: #f8f9fa;
border-radius: 12px;
}
.no-posts-icon {
font-size: 3rem;
color: var(--border-color);
margin-bottom: 20px;
}
.no-posts h3 {
font-size: 1.5rem;
color: var(--dark-color);
margin-bottom: 10px;
}
.no-posts p {
color: var(--text-color);
font-size: 1rem;
max-width: 500px;
margin: 0 auto;
} .pagination {
margin-top: 60px;
display: flex;
justify-content: center;
}
.pagination ul {
display: flex;
align-items: center;
gap: 10px;
list-style: none;
padding: 0;
margin: 0;
}
.pagination li {
margin: 0;
}
.pagination .page-numbers {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border-radius: 8px;
background: #f8f9fa;
color: var(--dark-color);
text-decoration: none;
transition: all 0.3s ease;
}
.pagination .page-numbers.current {
background: var(--primary-color);
color: #fff;
}
.pagination .page-numbers:hover:not(.current) {
background: var(--border-color);
}
.pagination .prev,
.pagination .next {
width: auto;
padding: 0 15px;
gap: 8px;
} @media (max-width: 1200px) {
.category-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 991px) {
.category-hero {
height: 400px;
}
.category-hero h1 {
font-size: 2.8rem;
}
.hero-content {
padding-bottom: 40px;
}
}
@media (max-width: 767px) {
.category-grid {
grid-template-columns: 1fr;
}
.category-hero {
height: 350px;
}
.category-hero h1 {
font-size: 2.2rem;
}
.category-description {
font-size: 1rem;
}
.category-filters {
flex-direction: column;
gap: 15px;
align-items: flex-start;
}
.category-main {
padding: 40px 0;
}
.post-meta {
flex-direction: column;
align-items: flex-start;
gap: 10px;
}
}
@media (max-width: 576px) {
.category-hero {
height: 300px;
}
.category-hero h1 {
font-size: 1.8rem;
}
.post-content {
padding: 20px;
}
.category-post h2 {
font-size: 1.2rem;
}
} @keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.category-post {
animation: fadeInUp 0.6s ease forwards;
}
.category-post:nth-child(2) {
animation-delay: 0.2s;
}
.category-post:nth-child(3) {
animation-delay: 0.4s;
} .application-form-container {
padding: var(--section-padding-desktop);
border-radius: 8px;
max-width: 1000px !important;
margin: 0 auto;
} .form-header {
text-align: center;
margin-bottom: 50px;
}
.form-title {
font-size: 2.5rem;
color: var(--primary-color);
font-weight: bold;
margin-bottom: 15px;
}
.form-header p {
font-size: 1.2rem;
color: var(--text-color);
} .form-tabs {
display: flex;
justify-content: center;
gap: 20px;
margin-bottom: 40px;
}
.tab-button {
padding: 15px 30px;
font-size: 1.1rem;
font-weight: 500;
color: var(--dark-color);
background: transparent;
border: 2px solid var(--border-color);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
}
.tab-button:hover {
border-color: var(--primary-color);
color: var(--primary-color);
}
.tab-button.active {
background: var(--primary-color);
color: #fff;
border-color: var(--primary-color);
} .form-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
margin-bottom: 30px;
} .application-form {
display: none;
background: #fff;
padding: 40px;
border-radius: 8px;
border: 1px solid var(--border-color);
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
transition: all 0.3s ease;
}
.application-form.active {
display: block;
animation: fadeIn 0.5s ease forwards;
}
.application-form:hover {
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
} .form-group {
margin-bottom: 20px;
}
.form-group label {
display: block;
font-weight: bold;
margin-bottom: 10px;
color: var(--dark-color);
}
.form-group input:not([type="file"]),
.form-group textarea,
.form-group select {
width: 100%;
padding: 12px 20px;
border: 1px solid var(--border-color);
border-radius: 4px;
font-size: 1rem;
color: var(--dark-color);
background-color: #fff;
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
transition: all 0.3s
} .form-group input:not([type="file"]):focus,
.form-group textarea:focus,
.form-group select:focus {
border-color: var(--primary-color);
box-shadow: 0 0 0 3px rgba(141, 198, 63, 0.2);
outline: none;
}
.form-group input:not([type="file"]):hover,
.form-group textarea:hover,
.form-group select:hover {
border-color: var(--primary-color);
} .form-group input::placeholder,
.form-group textarea::placeholder {
color: var(--text-color);
opacity: 0.7;
} .form-group input[type="file"] {
width: 100%;
padding: 10px;
border: 2px dashed var(--border-color);
border-radius: 4px;
background: #f8f9fa;
cursor: pointer;
transition: all 0.3s ease;
}
.form-group input[type="file"]:hover {
border-color: var(--primary-color);
background: #f0f7e6;
}
.form-group input[type="file"]::file-selector-button {
padding: 8px 16px;
margin-right: 15px;
background: var(--primary-color);
color: #fff;
border: none;
border-radius: 4px;
cursor: pointer;
transition: background 0.3s ease;
}
.form-group input[type="file"]::file-selector-button:hover {
background: #7ab800;
} .form-group select {
appearance: none;
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
background-repeat: no-repeat;
background-position: right 15px center;
background-size: 15px;
padding-right: 45px;
} .btn {
display: block;
width: 100%;
max-width: 300px;
margin: 40px auto 0;
padding: 15px 30px;
font-size: 1.1rem;
font-weight: bold;
color: #fff;
background: var(--primary-color);
border: none;
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn:hover {
background: #7ab800;
transform: translateY(-2px);
}
.btn:active {
transform: translateY(0);
} @keyframes fadeIn {
from {
opacity: 0;
transform: translateY(10px);
}
to {
opacity: 1;
transform: translateY(0);
}
} .form-group label.required::after {
content: "*";
color: #dc3545;
margin-left: 4px;
} .form-group.error input,
.form-group.error textarea,
.form-group.error select {
border-color: #dc3545;
}
.form-group.error .error-message {
color: #dc3545;
font-size: 0.875rem;
margin-top: 5px;
} .form-group.success input,
.form-group.success textarea,
.form-group.success select {
border-color: #28a745;
} .btn.loading {
position: relative;
color: transparent;
}
.btn.loading::after {
content: "";
position: absolute;
left: 50%;
top: 50%;
width: 20px;
height: 20px;
margin: -10px 0 0 -10px;
border: 2px solid #fff;
border-top-color: transparent;
border-radius: 50%;
animation: button-loading 0.8s infinite linear;
}
@keyframes button-loading {
to {
transform: rotate(360deg);
}
} @media (max-width: 991px) {
.application-form-container {
padding: var(--section-padding-tablet);
}
.form-grid {
grid-template-columns: 1fr;
}
.form-tabs {
flex-direction: column;
gap: 10px;
}
.tab-button {
width: 100%;
}
}
@media (max-width: 768px) {
.application-form-container {
padding: var(--section-padding-mobile);
}
.form-title {
font-size: 2rem;
}
.application-form {
padding: 20px;
}
.btn {
width: 100%;
max-width: none;
}
}
@media (max-width: 576px) {
.form-header p {
font-size: 1rem;
}
.tab-button {
font-size: 1rem;
padding: 12px 20px;
}
.form-group label {
font-size: 0.95rem;
}
} .pdm-hero {
position: relative;
height: 70vh;
min-height: 600px;
color: #fff;
overflow: hidden;
}
.pdm-hero__media {
position: absolute;
inset: 0;
z-index: 1;
}
.pdm-hero__media img {
width: 100%;
height: 100%;
object-fit: cover;
}
.pdm-hero__overlay {
position: absolute;
inset: 0;
background: linear-gradient(to bottom,
rgba(0, 0, 0, 0.4) 0%,
rgba(0, 0, 0, 0.6) 100%);
}
.pdm-hero__content {
position: relative;
z-index: 2;
height: 100%;
display: flex;
align-items: center;
}
.pdm-hero__content .container {
margin-top: auto;
margin-bottom: 100px;
}
.pdm-hero__title {
font-size: 3.5rem;
font-weight: 600;
line-height: 1.2;
color: #fff !important;
max-width: 900px;
opacity: 0;
transform: translateY(30px);
animation: fadeIn 1s ease forwards;
}
.pdm-hero__meta {
margin-top: 20px;
display: flex;
gap: 10px;
}
.pdm-hero__date {
display: flex;
align-items: center;
gap: 10px;
color: #fff;
font-size: 1.2rem;
opacity: 0.9;
}
.pdm-hero__date i {
font-size: 1rem;
opacity: 0.8;
} .pdm-meta {
padding: 60px 0;
background: #fff;
border-bottom: 1px solid var(--border-color);
}
.pdm-meta__grid {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 30px;
}
.pdm-meta__item {
display: flex;
align-items: center;
gap: 20px;
padding: 20px;
background: #f8f9fa;
transition: all 0.3s ease;
min-width: 0;
flex: 0 1 300px;
max-width: 300px;
}
.pdm-meta__item:hover {
transform: translateY(-5px);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
.pdm-meta__icon {
width: 60px;
height: 60px;
background: var(--primary-color);
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
font-size: 1.5rem;
}
.pdm-meta__content {
display: flex;
flex-direction: column;
gap: 5px;
min-width: 0;
}
.pdm-meta__label {
font-size: 0.9rem;
color: var(--text-color);
}
.pdm-meta__value {
font-size: 1.2rem;
font-weight: 500;
color: var(--dark-color);
white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .pdm-overview {
padding: 100px 0;
background-color: #fff;
}
.pdm-overview__content {
max-width: 1200px;
margin: 0 auto;
}
.pdm-overview__title {
font-size: 2.5rem;
font-weight: 500;
color: var(--dark-color);
margin-bottom: 30px;
position: relative;
padding-bottom: 20px;
}
.pdm-overview__title::after {
content: '';
position: absolute;
left: 0;
bottom: 0;
width: 60px;
height: 3px;
background: var(--primary-color);
}
.pdm-overview__text {
font-size: 1.1rem;
line-height: 1.8;
color: var(--text-color);
} @media (max-width: 991px) {
.pdm-overview {
padding: 80px 0;
}
.pdm-overview__title {
font-size: 2.2rem;
}
}
@media (max-width: 768px) {
.pdm-overview {
padding: 60px 0;
}
.pdm-overview__title {
font-size: 2rem;
margin-bottom: 25px;
padding-bottom: 15px;
}
.pdm-overview__text {
font-size: 1rem;
}
} .pdm-process {
padding: 80px 0;
background: #f8f9fa;
}
.pdm-section__title {
text-align: center;
font-size: 2.5rem;
font-weight: 500;
color: var(--dark-color);
margin-bottom: 50px;
}
.pdm-timeline {
max-width: 800px;
margin: 0 auto;
position: relative;
}
.pdm-timeline::before {
content: '';
position: absolute;
left: 29px;
top: 0;
height: 100%;
width: 2px;
background: var(--border-color);
}
.pdm-timeline__item {
display: flex;
gap: 30px;
position: relative;
padding-bottom: 40px;
}
.pdm-timeline__item:last-child {
padding-bottom: 0;
}
.pdm-timeline__marker {
flex-shrink: 0;
width: 60px;
height: 60px;
background: #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
z-index: 1;
}
.pdm-timeline__dot {
width: 30px;
height: 30px;
border-radius: 50%;
background: #fff;
border: 2px solid var(--border-color);
display: flex;
align-items: center;
justify-content: center;
}
.pdm-timeline__item.completed .pdm-timeline__dot {
background: var(--primary-color);
border-color: var(--primary-color);
color: #fff;
}
.pdm-timeline__item.active .pdm-timeline__dot {
background: #fff;
border-color: var(--primary-color);
color: var(--primary-color);
}
.pdm-timeline__content {
flex: 1;
background: #fff;
padding: 25px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
transition: transform 0.3s ease;
}
.pdm-timeline__content:hover {
transform: translateX(10px);
}
.pdm-timeline__date {
display: inline-block;
font-size: 0.9rem;
color: var(--primary-color);
font-weight: 500;
margin-bottom: 10px;
}
.pdm-timeline__title {
font-size: 1.2rem;
color: var(--dark-color);
margin-bottom: 10px;
font-weight: 500;
}
.pdm-timeline__text {
font-size: 1rem;
color: var(--text-color);
line-height: 1.6;
margin: 0;
} @media (max-width: 768px) {
.pdm-process {
padding: 60px 0;
}
.pdm-section__title {
font-size: 2rem;
margin-bottom: 40px;
}
.pdm-timeline__item {
gap: 20px;
}
.pdm-timeline__marker {
width: 50px;
height: 50px;
}
.pdm-timeline::before {
left: 24px;
}
.pdm-timeline__content {
padding: 20px;
}
}
@media (max-width: 576px) {
.pdm-section__title {
font-size: 1.8rem;
}
.pdm-timeline__title {
font-size: 1.1rem;
}
.pdm-timeline__text {
font-size: 0.95rem;
}
} @media (max-width: 991px) {
.pdm-hero__title {
font-size: 2.8rem;
}
.pdm-meta__grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 768px) {
.pdm-hero__title {
font-size: 2.2rem;
}
.pdm-meta__grid {
grid-template-columns: 1fr;
}
.pdm-meta {
padding: 40px 0;
}
.pdm-meta__item {
padding: 15px;
}
.pdm-meta__icon {
width: 50px;
height: 50px;
font-size: 1.2rem;
}
.pdm-timeline {
margin-top: 40px;
gap: 30px;
}
.pdm-timeline__content {
padding: 20px;
}
.pdm-timeline__content:hover {
transform: none;
}
.pdm-timeline__head {
gap: 10px;
margin-bottom: 15px;
}
.pdm-timeline__status {
width: 35px;
height: 35px;
font-size: 0.9rem;
}
}
@media (max-width: 576px) {
.pdm-hero {
height: 60vh;
min-height: 400px;
}
.pdm-hero__title {
font-size: 1.8rem;
}
.pdm-meta__item {
flex-direction: column;
text-align: center;
gap: 10px;
}
.pdm-process {
padding: 60px 0;
}
.pdm-section__title {
font-size: 1.8rem;
}
.pdm-timeline__body h3 {
font-size: 1.1rem;
}
} @keyframes fadeIn {
from {
opacity: 0;
transform: translateY(30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.pdm-timeline__item {
opacity: 0;
transform: translateY(30px);
animation: fadeIn 0.6s ease forwards;
}
.pdm-timeline__item:nth-child(2) {
animation-delay: 0.2s;
}
.pdm-timeline__item:nth-child(3) {
animation-delay: 0.4s;
} .project-gallery {
padding: 100px 0;
background: #fff;
}
.gallery-header {
text-align: center;
margin-bottom: 60px;
}
.gallery-header h2 {
font-size: 2.5rem;
font-weight: 500;
color: var(--dark-color);
}
.gallery-wrapper {
max-width: 1200px;
margin: 0 auto;
}
.gallery-main {
position: relative;
margin-bottom: 30px;
}
.gallery-showcase {
width: 100%;
aspect-ratio: 16/9;
overflow: hidden;
}
.showcase-image {
width: 100%;
height: 100%;
object-fit: cover;
transition: all 0.5s ease;
}
.gallery-controls {
position: absolute;
bottom: 30px;
right: 30px;
display: flex;
gap: 15px;
}
.gallery-navigation {
position: relative;
display: flex;
align-items: center;
gap: 20px;
}
.gallery-thumbs {
flex: 1;
overflow: hidden;
}
.thumb-track {
display: flex;
gap: 20px;
transform: translateX(0);
transition: transform 0.5s ease;
}
.thumb-item {
flex: 0 0 180px;
aspect-ratio: 16/9;
overflow: hidden;
cursor: pointer;
opacity: 0.6;
transition: all 0.3s ease;
}
.thumb-item.active {
opacity: 1;
transform: scale(1.05);
}
.thumb-item img {
width: 100%;
height: 100%;
object-fit: cover;
}
.gallery-prev,
.gallery-next,
.project-nav-prev,
.project-nav-next {
width: 50px;
height: 50px;
border: none;
border-radius: 50%;
background: rgba(225, 225, 225, 0.7);
color: var(--dark-color);
font-size: 1.2rem;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
}
.gallery-prev:hover,
.gallery-next:hover,
.project-nav-prev:hover,
.project-nav-next:hover {
background: var(--primary-color);
color: #fff;
} @media (max-width: 991px) {
.project-gallery {
padding: 60px 0;
}
.gallery-header h2 {
font-size: 2rem;
}
.thumb-item {
flex: 0 0 150px;
}
}
@media (max-width: 768px) {
.thumb-item {
flex: 0 0 120px;
}
.gallery-controls {
bottom: 15px;
right: 15px;
}
.gallery-prev,
.gallery-next,
.project-nav-prev,
.project-nav-next {
width: 40px;
height: 40px;
font-size: 1rem;
}
}
@media (max-width: 576px) {
.gallery-navigation {
gap: 10px;
}
.thumb-item {
flex: 0 0 100px;
}
} .pdm-projects {
padding: 80px 0;
background: #fff;
}
.pdm-projects__list {
display: flex;
flex-direction: column;
gap: 30px;
} .pdm-projects__card {
display: flex;
background: #fff;
overflow: hidden;
transition: all 0.3s ease;
border: 1px solid #eee;
}
.pdm-projects__card:hover {
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
} .pdm-projects__image {
width: 380px;
flex-shrink: 0;
position: relative;
overflow: hidden;
}
.pdm-projects__image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.6s ease;
}
.pdm-projects__card:hover .pdm-projects__image img {
transform: scale(1.05);
} .pdm-projects__content {
flex: 1;
padding: 30px;
display: flex;
flex-direction: column;
}
.pdm-projects__meta {
display: flex;
gap: 20px;
margin-bottom: 15px;
}
.pdm-projects__location,
.pdm-projects__duration {
display: flex;
align-items: center;
gap: 8px;
color: var(--text-color);
font-size: 0.9rem;
}
.pdm-projects__location i,
.pdm-projects__duration i {
color: var(--primary-color);
}
.pdm-projects__title {
font-size: 1.5rem;
margin-bottom: 15px;
line-height: 1.4;
}
.pdm-projects__title a {
color: var(--dark-color);
text-decoration: none;
transition: color 0.3s ease;
}
.pdm-projects__title a:hover {
color: var(--primary-color);
}
.pdm-projects__excerpt {
font-size: 1rem;
line-height: 1.7;
color: var(--text-color);
margin-bottom: 20px;
flex-grow: 1;
}
.pdm-projects__link {
align-self: flex-start;
display: inline-flex;
align-items: center;
gap: 8px;
color: var(--dark-color);
text-decoration: none;
font-weight: 500;
margin-top: auto;
padding-top: 20px;
border-top: 1px solid var(--border-color);
transition: all 0.3s ease;
}
.pdm-projects__link:hover {
color: var(--primary-color);
}
.pdm-projects__link i {
transition: transform 0.3s ease;
}
.pdm-projects__link:hover i {
transform: translateX(5px);
} @media (max-width: 768px) {
.pdm-projects {
padding: 40px 0;
}
.pdm-projects__card {
flex-direction: column;
}
.pdm-projects__image {
width: 100%;
height: 250px;
}
.pdm-projects__content {
padding: 20px;
}
.pdm-projects__title {
font-size: 1.3rem;
}
.pdm-projects__meta {
flex-wrap: wrap;
}
}  .about-intro {
padding: 100px 0;
background: #fff;
}
.intro-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 60px;
align-items: center;
}
.intro-content h1 {
font-size: 3rem;
font-weight: 600;
color: var(--dark-color);
margin-bottom: 40px;
position: relative;
padding-bottom: 20px;
}
.intro-content h1::after {
content: '';
position: absolute;
left: 0;
bottom: 0;
width: 80px;
height: 4px;
background: var(--primary-color);
}
.intro-text {
font-size: 1.1rem;
line-height: 1.8;
color: var(--text-color);
}
.intro-text p {
margin-bottom: 20px;
}
.intro-image {
position: relative;
border-radius: 20px;
overflow: hidden;
}
.intro-image img {
width: 100%;
height: auto;
border-radius: 20px;
} .vision-mission {
padding: 100px 0;
background: #f8f9fa;
}
.vision-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 40px;
}
.vision-card {
background: #fff;
padding: 40px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
transition: all 0.3s ease;
}
.vision-card:hover {
transform: translateY(-10px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}
.vision-icon {
width: 80px;
height: 80px;
background: var(--primary-color);
border-radius: 20px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 30px;
color: #fff;
font-size: 2rem;
}
.vision-card h2 {
font-size: 1.8rem;
color: var(--dark-color);
margin-bottom: 20px;
}
.vision-card p {
font-size: 1.1rem;
line-height: 1.8;
color: var(--text-color);
} .activities {
padding: 100px 0;
background: #fff;
} .dayk-split {
display: grid;
grid-template-columns: 1fr 1fr;
min-height: 500px;
margin-top: 100px
}
.dayk-split__media {
position: relative;
background: var(--nav-dark);
height: 80%;
}
.dayk-split__image {
position: absolute;
inset: 0;
overflow: hidden;
height: 100%;
}
.dayk-split__image img {
width: 100%;
height: 100%;
object-fit: cover;
opacity: 0.9;
}
.dayk-split__content {
padding: 0 40px 60px 80px;
display: flex;
align-items: center;
}
.dayk-split__text {
max-width: 600px;
}
.section-badge {
display: inline-block;
color: var(--primary-color);
font-size: 0.9rem;
font-weight: 500;
text-transform: uppercase;
letter-spacing: 2px;
margin-bottom: 1rem;
}
.section-title {
font-size: 3rem;
color: var(--nav-dark);
margin-bottom: 2rem;
}
.dayk-split__description {
color: var(--text-color);
font-size: 1.1rem;
line-height: 1.8;
margin-bottom: 3rem;
} .dayk-mission {
padding: 120px 0;
background: var(--dayk-light);
}
.dayk-mission__cards {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 40px;
}
.mission-card {
position: relative;
background: var(--dayk-white);
overflow: hidden;
padding: 60px 40px;
height: 100%;
transition: all 0.3s ease;
}
.mission-card:hover {
transform: translateY(-10px);
}
.mission-card__content {
position: relative;
z-index: 2;
}
.mission-card__bg {
position: absolute;
inset: 0;
background: linear-gradient(45deg, var(--nav-dark), transparent);
opacity: 0;
transition: opacity 0.3s ease;
}
.mission-card:hover .mission-card__bg {
opacity: 0.03;
}
.mission-card__icon {
width: 80px;
height: 80px;
background: rgba(141, 198, 63, 0.1);
border-radius: 20px;
display: flex;
align-items: center;
justify-content: center;
color: var(--primary-color);
font-size: 2rem;
margin-bottom: 30px;
transition: all 0.3s ease;
}
.mission-card:hover .mission-card__icon {
background: var(--primary-color);
color: var(--dayk-white);
transform: scale(1.1);
}
.mission-card__title {
font-size: 1.8rem;
color: var(--nav-dark);
margin-bottom: 20px;
}
.mission-card__text {
color: var(--text-color);
font-size: 1.1rem;
line-height: 1.8;
} .dayk-global-presence {
padding: 100px 0;
background: #fff;
overflow: hidden;
}
.gp-container {
max-width: 1800px;
margin: 0 auto;
padding: 0 15px;
}
.gp-section-header {
text-align: center;
margin-bottom: 60px;
}
.gp-section-header h2 {
font-size: 2.5rem;
color: var(--dark-color);
margin-bottom: 15px;
}
.gp-section-header p {
font-size: 1.1rem;
color: var(--text-color);
} .gp-map-wrapper {
position: relative;
width: 100%;
max-width: 1800px;
height: auto;
margin: 0 auto;
} .gp-world-svg {
width: 100%;
height: auto;
display: block;
}
.gp-world-svg path {
fill: #E8E8E8;
stroke: #D0D0D0;
stroke-width: 0.5;
transition: all 0.3s ease;
}
.gp-world-svg path.is-active {
fill: rgba(141, 198, 63, 0.2);
stroke: #8dc63f;
stroke-width: 1;
} .location-markers {
pointer-events: all;
}
.gp-country-btn {
cursor: pointer;
}
.gp-marker-dot {
fill: var(--primary-color) !important;
stroke: #fff;
stroke-width: 2;
transition: all 0.3s ease;
}
.gp-btn-label {
fill: #333132;
font-size: 14px;
font-family: 'Roboto', sans-serif;
opacity: 0;
transform: translateX(-10px);
transition: all 0.3s ease;
pointer-events: none;
} .gp-country-btn:hover .marker-dot {
fill: var(--primary-color);
r: 8;
}
.gp-country-btn:hover .gp-btn-label {
opacity: 1;
transform: translateX(0);
}
.gp-country-btn.is-active .marker-dot {
fill: #fff !important;
stroke: var(--primary-color);
r: 8;
}
.gp-country-btn.is-active .gp-btn-label {
opacity: 1;
transform: translateX(0);
fill: var(--primary-color);
} .gp-map-buttons {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 15px;
margin: 30px 0;
}
.map-button {
display: flex;
align-items: center;
gap: 10px;
padding: 12px 24px;
background: #fff;
border: 1px solid rgba(141, 198, 63, 0.3);
border-radius: 50px;
color: #333132;
font-size: 0.95rem;
font-weight: 500;
cursor: pointer;
transition: all 0.3s ease;
box-shadow: 0 2px 6px rgba(141, 198, 63, 0.1);
}
.button-icon {
font-size: 1.2rem;
opacity: 0.9;
}
.button-text {
position: relative;
}
.button-text::after {
content: '';
position: absolute;
bottom: -2px;
left: 0;
width: 0;
height: 2px;
background: var(--primary-color);
transition: width 0.3s ease;
}
.map-button:hover {
background: rgba(141, 198, 63, 0.1);
border-color: var(--primary-color);
transform: translateY(-2px);
}
.map-button:hover .button-text::after {
width: 100%;
}
.map-button.active {
background: rgba(141, 198, 63, 0.1);
border-color: var(--primary-color);
} .gp-country-cards {
position: absolute;
inset: 0;
pointer-events: none;
}
.gp-country-card {
position: absolute;
visibility: hidden;
opacity: 0;
transform: translateY(10px);
transition: all 0.3s ease;
pointer-events: auto;
}
.gp-country-card.is-active {
visibility: visible;
opacity: 1;
transform: translateY(0);
}
.gp-card-content {
background: #fff;
padding: 20px;
border-radius: 8px;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
border-left: 4px solid var(--primary-color);
width: 300px;
}
.gp-card-content h4 {
color: var(--dark-color);
font-size: 1.1rem;
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid var(--border-color);
}
.gp-card-activities {
display: flex;
flex-direction: column;
gap: 15px;
}
.gp-activity-item h5 {
color: var(--primary-color);
font-size: 0.9rem;
margin-bottom: 5px;
font-weight: 500;
}
.gp-activity-item p {
color: var(--text-color);
font-size: 0.8rem;
line-height: 1.5;
margin: 0;
} .gp-mobile-list {
display: none;
padding: 40px 20px;
max-width: 800px;
margin: 0 auto;
}
.gp-mobile-card {
background: #fff;
border-radius: 8px;
padding: 25px;
margin-bottom: 25px;
border-left: 4px solid var(--primary-color);
box-shadow: 0 2px 15px rgba(0, 0, 0, 0.05);
}
.gp-mobile-card h3 {
font-size: 1.4rem;
color: var(--dark-color);
margin-bottom: 20px;
padding-bottom: 15px;
border-bottom: 1px solid var(--border-color);
}
.gp-mobile-activities {
display: flex;
flex-direction: column;
gap: 20px;
}
.gp-mobile-card .gp-activity-item h4 {
color: var(--primary-color);
font-size: 1.1rem;
margin-bottom: 8px;
font-weight: 500;
}
.gp-mobile-card .gp-activity-item p {
color: var(--text-color);
font-size: 0.95rem;
line-height: 1.6;
margin: 0;
} @media (max-width: 1600px) {
.gp-card-content {
width: 260px;
}
.gp-card-content h4 {
font-size: 1rem;
}
}
@media (max-width: 1200px) {
.gp-section-header h2 {
font-size: 2.2rem;
}
}
@media (max-width: 991px) {
.dayk-global-presence {
padding: 60px 0;
}
.gp-map-wrapper,
.gp-map-buttons {
display: none;
}
.gp-mobile-list {
display: block;
}
}
@media (max-width: 768px) {
.gp-section-header h2 {
font-size: 1.8rem;
}
.gp-mobile-card {
padding: 20px;
}
.gp-mobile-card h3 {
font-size: 1.2rem;
}
}
@media (max-width: 576px) {
.dayk-global-presence {
padding: 40px 0;
}
} .abt-activities {
padding: 120px 0;
background: #fff;
position: relative;
}
.abt-activities::before {
content: '';
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: linear-gradient(135deg, rgba(27, 52, 68, 0.02) 0%, rgba(141, 198, 63, 0.02) 100%);
pointer-events: none;
} .abt-activities__header {
text-align: center;
max-width: 900px;
margin: 0 auto 80px;
position: relative;
}
.abt-activities__subtitle {
font-size: 1.1rem;
color: #8dc63f;
text-transform: uppercase;
letter-spacing: 2px;
margin-bottom: 20px;
display: block;
}
.abt-activities__title {
font-size: 3rem;
color: #1B3444;
margin-bottom: 30px;
position: relative;
padding-bottom: 30px;
}
.abt-activities__title::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 80px;
height: 4px;
background: #8dc63f;
}
.abt-activities__description {
font-size: 1.1rem;
line-height: 1.8;
color: #666;
} .abt-activities__grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 30px;
} .abt-activity-card {
position: relative;
background: #fff;
overflow: hidden;
transition: all 0.4s ease;
}
.abt-activity-card:hover {
transform: translateY(-10px);
}
.abt-activity-card__inner {
padding: 50px 30px;
text-align: center;
position: relative;
background: #fff;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
border: 1px solid rgba(141, 198, 63, 0.1);
transition: all 0.4s ease;
}
.abt-activity-card:hover .abt-activity-card__inner {
border-color: #8dc63f;
box-shadow: 0 20px 40px rgba(141, 198, 63, 0.1);
}
.abt-activity-card__icon {
width: 80px;
height: 80px;
background: rgba(141, 198, 63, 0.1);
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 25px;
font-size: 2rem;
color: #8dc63f;
transition: all 0.4s ease;
}
.abt-activity-card:hover .abt-activity-card__icon {
background: #8dc63f;
color: #fff;
transform: rotateY(180deg);
}
.abt-activity-card__title {
font-size: 1.2rem;
color: #1B3444;
margin-bottom: 15px;
font-weight: 500;
}
.abt-activity-card__hover {
opacity: 0;
transform: translateY(20px);
transition: all 0.4s ease;
}
.abt-activity-card:hover .abt-activity-card__hover {
opacity: 1;
transform: translateY(0);
}
.abt-activity-card__more {
color: #8dc63f;
font-size: 0.9rem;
font-weight: 500;
display: inline-flex;
align-items: center;
gap: 8px;
} .abt-activity-card:hover .abt-activity-card__more::after {
transform: translateX(5px);
} @media (max-width: 1200px) {
.abt-activities__grid {
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 991px) {
.abt-activities {
padding: 80px 0;
}
.abt-activities__title {
font-size: 2.5rem;
}
.abt-activities__grid {
grid-template-columns: repeat(2, 1fr);
gap: 20px;
}
.dayk-split__media {
display: none;
}
.dayk-split__content {
padding: 20px;
display: flex;
align-items: center;
}
.dayk-mission__cards {
grid-template-columns: repeat(1, 1fr);
}
.dayk-mission {
padding: 0;
}
.dayk-split {
display: block;
}
}
@media (max-width: 768px) {
.mission-card {
padding: 40px 10px;
}
.mission-card__icon {
display: none;
}
.abt-activities__title {
font-size: 2rem;
}
.abt-activities__description {
font-size: 1rem;
}
.abt-activity-card__inner {
padding: 30px 20px;
}
.abt-activity-card__icon {
width: 60px;
height: 60px;
font-size: 1.5rem;
}
}
@media (max-width: 576px) {
.abt-activities__grid {
grid-template-columns: 1fr;
}
.abt-activity-card__inner {
padding: 30px 20px;
}
} @keyframes iconRotate {
from {
transform: rotateY(0deg);
}
to {
transform: rotateY(180deg);
}
}
.abt-activities {
opacity: 0;
transform: translateY(30px);
animation: fadeInUp 0.8s ease forwards;
}
@keyframes fadeInUp {
to {
opacity: 1;
transform: translateY(0);
}
} .dayk-partners {
padding: 100px 0;
background: var(--dayk-light);
}
.text-center {
text-align: center;
} .dayk-partners {
padding: 100px 0;
background: var(--dayk-light);
}
.text-center {
text-align: center;
}
.dayk-partners__slider {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 40px;
margin-top: 60px;
}
.partner-logo {
width: 100%; height: 150px; background: var(--dayk-white);
padding: 20px;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s ease;
overflow: hidden;
box-sizing: border-box; border: 1px solid #e5e5e5; }
.partner-logo img {
max-width: 100%;
max-height: 70px; object-fit: contain; transition: all 0.3s ease;
}
.partner-logo:hover {
transform: translateY(-10px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}
.partner-logo:hover img {
filter: grayscale(0%);
opacity: 1;
} @media (max-width: 1200px) {
.dayk-partners__slider {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 768px) {
.dayk-partners__slider {
grid-template-columns: 1fr;
}
.partner-logo {
height: 120px; }
} @keyframes slideInLeft {
from {
opacity: 0;
transform: translateX(-50px);
}
to {
opacity: 1;
transform: translateX(0);
}
}
@keyframes slideInRight {
from {
opacity: 0;
transform: translateX(50px);
}
to {
opacity: 1;
transform: translateX(0);
}
}
.dayk-split__text {
animation: slideInRight 1s ease forwards;
}
.mission-card:nth-child(1) {
animation: slideInLeft 1s ease forwards;
}
.mission-card:nth-child(2) {
animation: slideInRight 1s ease forwards;
} .dayk-split__text p {
position: relative;
} .specialties-section {
padding: 120px 0;
background: #fff;
} .specialties-page .specialty-block {
scroll-margin-top: 50px; } .specialty-block {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 80px;
margin-bottom: 120px;
align-items: center;
}
.specialty-block:last-child {
margin-bottom: 0;
}
.specialty-block.reverse {
direction: rtl;
}
.specialty-block.reverse>* {
direction: ltr;
} .specialty-header {
margin-bottom: 40px;
}
.specialty-number {
font-size: 1rem;
font-weight: 500;
color: #333;
margin-bottom: 10px;
display: flex;
align-items: center;
gap: 15px;
}
.specialty-number::after {
content: '';
height: 1px;
width: 60px;
background: #333;
}
.specialty-header h2 {
font-size: 2.5rem;
font-weight: 500;
color: var(--dark-color);
margin: 0;
} .specialty-list {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 15px;
}
.specialty-list li {
color: var(--text-color);
font-size: 1.1rem;
line-height: 1.6;
padding-left: 25px;
position: relative;
}
.specialty-list li::before {
content: '';
position: absolute;
left: 0;
top: 12px;
width: 6px;
height: 6px;
background: var(--dark-color);
border-radius: 50%;
} .specialty-media {
position: relative;
overflow: hidden;
}
.specialty-media img {
width: 100%;
height: 400px;
object-fit: cover;
transition: transform 0.6s ease;
}
.specialty-block:hover .specialty-media img {
transform: scale(1.05);
} .specialty-block {
opacity: 0;
transform: translateY(30px);
animation: fadeInUp 0.8s ease forwards;
}
@keyframes fadeInUp {
to {
opacity: 1;
transform: translateY(0);
}
} @media (max-width: 1200px) {
.specialties-section {
padding: 100px 0;
}
.specialty-block {
gap: 60px;
margin-bottom: 100px;
}
.specialty-media img {
height: 500px;
}
.specialty-header h2 {
font-size: 2.2rem;
}
}
@media (max-width: 991px) {
.specialties-hero {
height: 60vh;
min-height: 500px;
}
.specialty-block {
grid-template-columns: 1fr;
gap: 40px;
margin-bottom: 80px;
direction: ltr;
}
.specialty-block.reverse {
direction: ltr;
}
.specialty-media {
order: -1; }
.specialty-media img {
height: 400px;
}
.specialty-header {
margin-bottom: 30px;
}
.specialty-header h2 {
font-size: 2rem;
}
.specialty-list li {
font-size: 1rem;
}
}
@media (max-width: 768px) {
.specialties-hero {
height: 50vh;
min-height: 400px;
}
.hero-content h1 {
font-size: 2.5rem;
}
.hero-content p {
font-size: 1.1rem;
}
.specialties-section {
padding: 60px 0;
}
.specialty-block {
margin-bottom: 60px;
}
.specialty-media img {
height: 350px;
}
}
@media (max-width: 576px) {
.specialties-hero {
height: 40vh;
min-height: 300px;
}
.hero-content h1 {
font-size: 2rem;
}
.hero-content p {
font-size: 1rem;
}
.specialty-header h2 {
font-size: 1.8rem;
}
.specialty-number {
font-size: 0.9rem;
}
.specialty-media img {
height: 250px;
}
.specialty-list li {
font-size: 0.95rem;
}
} .specialty-block:hover .specialty-number::after {
width: 80px;
transition: width 0.3s ease;
}
.specialty-list li::before {
transition: transform 0.3s ease;
}
.specialty-list li:hover::before {
transform: scale(1.5);
} .specialty-block:nth-child(2) {
animation-delay: 0.2s;
}
.specialty-block:nth-child(3) {
animation-delay: 0.4s;
}
.specialty-block:nth-child(4) {
animation-delay: 0.6s;
}
.specialty-block:nth-child(5) {
animation-delay: 0.8s;
}
.specialty-block:nth-child(6) {
animation-delay: 1s;
}
.specialty-block:nth-child(7) {
animation-delay: 1.2s;
} @keyframes loading {
to {
transform: translateX(100%);
}
} .krnl-search-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: rgba(255, 255, 255, 0.98);
z-index: 9999;
opacity: 0;
visibility: hidden;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.krnl-search-overlay.active {
opacity: 1;
visibility: visible;
}
.krnl-search-overlay__content {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -55%);
width: 100%;
max-width: 800px;
padding: 0 20px;
transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.krnl-search-overlay.active .krnl-search-overlay__content {
transform: translate(-50%, -50%);
}
.krnl-search-overlay__form {
position: relative;
width: 100%;
}
.krnl-search-overlay__input {
width: 100%;
height: 70px;
padding: 0 60px 0 0;
border: none;
border-bottom: 2px solid #e5e5e5;
background: none;
font-size: 2rem;
color: #333132;
transition: all 0.3s ease;
font-family: "Roboto", sans-serif;
}
.krnl-search-overlay__input:focus {
outline: none;
border-color: #8dc63f;
}
.krnl-search-overlay__input::placeholder {
color: #999;
font-weight: 300;
}
.krnl-search-overlay__submit {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
background: none;
border: none;
color: #333132;
font-size: 1.5rem;
cursor: pointer;
padding: 0;
width: 50px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s ease;
}
.krnl-search-overlay__submit:hover {
color: #8dc63f;
}
.krnl-search-overlay__close {
position: absolute;
top: 40px;
right: 40px;
width: 40px;
height: 40px;
background: none;
border: none;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
color: #333132;
font-size: 1.5rem;
transition: all 0.3s ease;
}
.krnl-search-overlay__close:hover {
color: #8dc63f;
transform: rotate(90deg);
} @media (max-width: 991px) {
.krnl-search-overlay__close {
top: 20px;
right: 20px;
}
.krnl-search-overlay__input {
font-size: 1.5rem;
height: 60px;
}
}
@media (max-width: 576px) {
.krnl-search-overlay__input {
font-size: 1.2rem;
height: 50px;
}
} .search-results {
background: #fff;
} .search-header {
padding: 80px 0;
text-align: center;
margin-bottom: 60px;
}
.search-title {
font-size: 2.5rem;
font-weight: 500;
color: #333132;
margin-bottom: 15px;
}
.search-query {
color: #8dc63f;
}
.search-stats {
color: #666;
font-size: 1.1rem;
margin-bottom: 30px;
} .search-form {
max-width: 600px;
margin: 0 auto;
}
.search-form__wrapper {
position: relative;
}
.search-form__input {
width: 100%;
height: 60px;
padding: 0 60px 0 25px;
border: 1px solid #e5e5e5;
border-radius: 30px;
font-size: 1.1rem;
color: #333132;
background: #f8f9fa;
transition: all 0.3s ease;
}
.search-form__input:focus {
outline: none;
border-color: #8dc63f;
background: #fff;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}
.search-form__button {
position: absolute;
right: 8px;
top: 50%;
transform: translateY(-50%);
width: 44px;
height: 44px;
border: none;
border-radius: 50%;
background: #8dc63f;
color: #fff;
cursor: pointer;
transition: all 0.3s ease;
}
.search-form__button:hover {
background: #7ab800;
} .search-results__list {
display: flex;
flex-direction: column;
gap: 30px;
margin-top: 50px;
} .search-item {
background: #fff;
border: 1px solid #e5e5e5;
border-radius: 12px;
padding: 30px;
transition: all 0.3s ease;
}
.search-item:hover {
transform: translateY(-5px);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}
.search-item__category {
display: inline-block;
padding: 6px 15px;
background: rgba(141, 198, 63, 0.1);
color: #8dc63f;
border-radius: 20px;
font-size: 0.9rem;
font-weight: 500;
margin-bottom: 15px;
}
.search-item__title {
font-size: 1.5rem;
margin-bottom: 15px;
}
.search-item__title a {
color: #333132;
text-decoration: none;
transition: color 0.3s ease;
}
.search-item__title a:hover {
color: #8dc63f;
}
.search-item__excerpt {
color: #666;
font-size: 1rem;
line-height: 1.7;
margin-bottom: 20px;
}
.search-highlight {
background: rgba(141, 198, 63, 0.2);
padding: 0 3px;
border-radius: 3px;
}
.search-item__meta {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 20px;
color: #666;
font-size: 0.9rem;
}
.search-item__meta span {
display: flex;
align-items: center;
gap: 8px;
}
.search-item__meta i {
color: #8dc63f;
font-size: 1rem;
} .pagination {
margin-top: 50px;
display: flex;
justify-content: center;
align-items: center;
gap: 10px;
}
.page-numbers {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border-radius: 8px;
background: #f8f9fa;
color: #333132;
text-decoration: none;
transition: all 0.3s ease;
font-size: 0.95rem;
}
.page-numbers.current {
background: #8dc63f;
color: #fff;
}
.page-numbers:hover:not(.current) {
background: #e5e5e5;
} .no-results {
text-align: center;
padding: 60px 30px;
background: #f8f9fa;
border-radius: 12px;
}
.no-results__icon {
font-size: 3rem;
color: #e5e5e5;
margin-bottom: 20px;
}
.no-results__title {
font-size: 1.5rem;
color: #333132;
margin-bottom: 15px;
}
.no-results__text {
color: #666;
max-width: 500px;
margin: 0 auto 30px;
}
.no-results__suggestions {
max-width: 500px;
margin: 0 auto;
text-align: left;
}
.no-results__suggestions h3 {
font-size: 1.1rem;
color: #333132;
margin-bottom: 15px;
}
.no-results__suggestions ul {
list-style: none;
padding: 0;
margin: 0;
}
.no-results__suggestions li {
color: #666;
padding-left: 20px;
position: relative;
margin-bottom: 10px;
}
.no-results__suggestions li::before {
content: '•';
color: #8dc63f;
position: absolute;
left: 0;
} @media (max-width: 991px) {
.search-results {
padding: 60px 0;
}
.search-title {
font-size: 2rem;
}
}
@media (max-width: 768px) {
.search-header {
margin-bottom: 40px;
}
.search-form__input {
height: 50px;
font-size: 1rem;
}
.search-form__button {
width: 38px;
height: 38px;
}
.search-item {
padding: 20px;
}
.search-item__title {
font-size: 1.3rem;
}
}
@media (max-width: 576px) {
.search-title {
font-size: 1.7rem;
}
.search-stats {
font-size: 1rem;
}
.search-item__meta {
flex-direction: column;
align-items: flex-start;
gap: 10px;
}
.page-numbers {
width: 35px;
height: 35px;
}
}
.dayk-offices {
padding: 100px 0 0 0;
background: #fff;
overflow: hidden;
}
.offices-header {
text-align: center;
margin-bottom: 60px;
}
.offices-header h2 {
font-size: 2.5rem;
color: var(--dark-color);
margin-bottom: 15px;
}
.offices-header p {
font-size: 1.1rem;
color: var(--text-color);
}
.world-map {
position: relative;
width: 100%;
max-width: 1800px;
height: auto;
overflow: visible;
}
.worldmap-container {
max-width: 1800px;
margin: 0 auto;
padding: 0 15px;
}
.world-svg {
width: 100%;
height: auto;
display: block;
} .world-svg path {
fill: #E8E8E8;
stroke: #D0D0D0;
stroke-width: 0.5;
transition: all 0.3s ease;
}
.world-svg path.highlighted {
fill: rgba(141, 198, 63, 0.2);
stroke: #8dc63f;
stroke-width: 1;
} .location-marker {
cursor: pointer;
}
.marker-dot {
fill: #1B3444;
transition: all 0.3s ease;
} .location-marker.main-office .marker-dot {
fill: #8dc63f;
stroke: #fff;
stroke-width: 2;
r: 10 } .location-marker .marker-dot {
r: 6; } .sonar-wave {
fill: none;
stroke: #1B3444;
stroke-width: 2;
opacity: 0;
animation: sonarWave 2s linear infinite;
transform-origin: center;
}
.sonar-wave:nth-child(2) {
animation-delay: 0.5s;
}
.sonar-wave:nth-child(3) {
animation-delay: 1s;
}
@keyframes sonarWave {
0% {
r: 4;
opacity: 0.8;
}
100% {
r: 16;
opacity: 0;
}
} .tooltip {
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
pointer-events: none;
height: 1000px;
}
.location-marker:hover .tooltip {
opacity: 1;
visibility: visible;
pointer-events: auto;
}
.tooltip-content {
background: #fff;
padding: 24px;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
border: 1px solid #eee;
width: 100%;
pointer-events: auto;
z-index: 100;
}
.office-tag {
display: inline-block;
font-size: 13px;
color: #8dc63f;
font-weight: 500;
margin-bottom: 10px;
padding: 4px 12px;
background: rgba(141, 198, 63, 0.1);
border-radius: 5px;
}
.office-tag.main {
background: #8dc63f;
color: #fff;
}
.tooltip-content h4 {
font-size: 18px;
margin: 0 0 15px 0;
font-weight: 500;
color: var(--dark-color);
}
.tooltip-details {
display: flex;
flex-direction: column;
gap: 12px;
}
.detail-item {
display: flex;
gap: 10px;
align-items: flex-start;
}
.detail-item i {
color: #8dc63f;
font-size: 14px;
margin-top: 4px;
flex-shrink: 0;
}
.detail-item p {
margin: 0;
font-size: 14px;
line-height: 1.5;
color: var(--text-color);
} @media (max-width: 1200px) {
.offices-header h2 {
font-size: 2.2rem;
}
}
@media (max-width: 991px) {
.dayk-offices {
padding: 60px 0;
}
.offices-header h2 {
font-size: 2rem;
}
}
@media (max-width: 768px) {
.offices-header h2 {
font-size: 1.8rem;
}
.tooltip-content {
padding: 20px;
}
.tooltip-content h4 {
font-size: 16px;
}
} @media (min-width: 992px) { .mobile-offices {
padding: 80px 0;
background: #fff;
max-width: 1400px;
justify-self: center;
}
.mobile-offices__grid {
display: grid;
grid-template-columns: repeat(6, 1fr);
gap: 30px;
max-width: 1200px;
margin: 0 auto;
}
.office-card {
background: #fff;
border: 1px solid #eee;
padding: 24px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
transition: transform 0.3s ease;
width: 100%;
} .office-card:nth-child(1) {
grid-column: 2 / span 4;
} .office-card:nth-child(2) {
grid-column: 1 / span 3;
}
.office-card:nth-child(3) {
grid-column: 4 / span 3;
} .office-card:nth-child(4) {
grid-column: 1 / span 2;
}
.office-card:nth-child(5) {
grid-column: 3 / span 2;
}
.office-card:nth-child(6) {
grid-column: 5 / span 2;
}
.office-card:nth-child(n+7) {
grid-column: span 2;
}
.office-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}
.office-card.main-office {
border-color: var(--primary-color);
background: rgba(141, 198, 63, 0.05);
}
.office-card__header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
.office-card__header h3 {
font-size: 1.3rem;
color: var(--dark-color);
margin: 0;
}
.office-tag {
background: var(--primary-color);
color: #fff;
padding: 6px 12px;
border-radius: 20px;
font-size: 0.8rem;
font-weight: 500;
}
.office-card__content {
display: flex;
flex-direction: column;
gap: 15px;
}
.info-item {
display: flex;
gap: 12px;
align-items: flex-start;
}
.info-item i {
color: var(--primary-color);
font-size: 1rem;
margin-top: 4px;
}
.info-item p,
.info-item a {
color: var(--text-color);
font-size: 0.95rem;
line-height: 1.5;
margin: 0;
text-decoration: none;
}
.info-item a:hover {
color: var(--primary-color);
}
}
@media (max-width: 991px) {
.desktop-only {
display: none;
} .mobile-offices {
padding: 40px 20px;
background: #fff;
}
.mobile-offices__grid {
display: flex;
flex-direction: column;
gap: 20px;
} .office-card {
background: #fff;
border: 1px solid #eee;
border-radius: 12px;
padding: 24px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
transition: transform 0.3s ease;
}
.office-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}
.office-card.main-office {
border-color: var(--primary-color);
background: rgba(141, 198, 63, 0.05);
}
.office-card__header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
.office-card__header h3 {
font-size: 1.3rem;
color: var(--dark-color);
margin: 0;
}
.office-tag {
background: var(--primary-color);
color: #fff;
padding: 6px 12px;
border-radius: 20px;
font-size: 0.8rem;
font-weight: 500;
}
.office-card__content {
display: flex;
flex-direction: column;
gap: 15px;
}
.info-item {
display: flex;
gap: 12px;
align-items: flex-start;
}
.info-item i {
color: var(--primary-color);
font-size: 1rem;
margin-top: 4px;
}
.info-item p,
.info-item a {
color: var(--text-color);
font-size: 0.95rem;
line-height: 1.5;
margin: 0;
text-decoration: none;
}
.info-item a:hover {
color: var(--primary-color);
}
} @media (max-width: 576px) {
.mobile-offices {
padding: 30px 15px;
}
.office-card {
padding: 20px;
}
.office-card__header h3 {
font-size: 1.2rem;
}
} @keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.office-card {
animation: fadeInUp 0.5s ease forwards;
} .krnl-contact-form {
padding: 80px 0;
background: var(--dayk-light);
}
.krnl-contact-form__wrapper {
max-width: 800px;
margin: 0 auto;
background: #fff;
padding: 40px;
border-radius: 12px;
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
}
.krnl-contact-form__header {
text-align: center;
margin-bottom: 40px;
}
.krnl-contact-form__header h2 {
font-size: 2rem;
margin-bottom: 15px;
color: var(--dark-color);
}
.krnl-contact-form__header p {
color: var(--text-color);
}
.krnl-contact-form__grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
margin-bottom: 20px;
}
.krnl-contact-form__group {
margin-bottom: 20px;
}
.krnl-contact-form__group--full {
grid-column: 1 / -1;
}
.krnl-contact-form__group label {
display: block;
margin-bottom: 8px;
color: var(--dark-color);
font-weight: 500;
}
.krnl-contact-form__group input,
.krnl-contact-form__group select,
.krnl-contact-form__group textarea {
width: 100%;
padding: 12px 15px;
border: 1px solid #ddd;
border-radius: 6px;
font-size: 1rem;
transition: all 0.3s ease;
}
.krnl-contact-form__group input:focus,
.krnl-contact-form__group select:focus,
.krnl-contact-form__group textarea:focus {
outline: none;
border-color: var(--primary-color);
box-shadow: 0 0 0 3px rgba(141, 198, 63, 0.1);
}
.krnl-contact-form__submit {
text-align: center;
margin-top: 30px;
}
.krnl-contact-form__button {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 12px 30px;
background: var(--primary-color);
color: #fff;
border: none;
border-radius: 6px;
font-size: 1rem;
font-weight: 500;
cursor: pointer;
transition: all 0.3s ease;
}
.krnl-contact-form__button:hover {
background: #7ab800;
transform: translateY(-2px);
} @media (max-width: 991px) {
.krnl-contact-offices__grid {
grid-template-columns: repeat(2, 1fr);
}
.krnl-contact-form__wrapper {
padding: 30px;
}
}
@media (max-width: 768px) {
.krnl-contact-offices__grid {
grid-template-columns: 1fr;
}
.krnl-contact-form__grid {
grid-template-columns: 1fr;
}
.krnl-contact-form__wrapper {
padding: 20px;
}
} .technical-articles {
padding: var(--section-padding-desktop) 0;
background-color: #fff;
} .technical-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
padding: 80px 0;
} .technical-card {
background: #fff;
border: 1px solid var(--border-color);
border-radius: 12px;
overflow: hidden;
transition: all 0.3s ease;
}
.technical-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
.technical-image {
position: relative;
aspect-ratio: 16/9;
overflow: hidden;
}
.technical-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.6s ease;
}
.technical-card:hover .technical-image img {
transform: scale(1.05);
}
.technical-content {
padding: 25px;
}
.technical-date {
color: var(--text-color);
font-size: 0.9rem;
margin-bottom: 15px;
display: flex;
align-items: center;
gap: 8px;
}
.technical-date i {
color: var(--primary-color);
}
.technical-title {
font-size: 1.4rem;
font-weight: 500;
line-height: 1.4;
margin-bottom: 15px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.technical-title a {
color: var(--dark-color);
text-decoration: none;
transition: color 0.3s ease;
}
.technical-title a:hover {
color: var(--primary-color);
}
.technical-excerpt {
color: var(--text-color);
font-size: 0.95rem;
line-height: 1.6;
margin-bottom: 20px;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
.technical-link {
display: inline-flex;
align-items: center;
gap: 8px;
color: var(--dark-color);
text-decoration: none;
font-weight: 500;
font-size: 0.95rem;
transition: all 0.3s ease;
padding-top: 15px;
border-top: 1px solid var(--border-color);
}
.technical-link i {
font-size: 0.8rem;
transition: transform 0.3s ease;
}
.technical-link:hover {
color: var(--primary-color);
gap: 12px;
}
.technical-link:hover i {
transform: translateX(3px);
} .technical-pagination {
display: flex;
justify-content: center;
margin-top: 50px;
gap: 10px;
}
.technical-pagination .page-numbers {
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
background: var(--dayk-light);
color: var(--dark-color);
text-decoration: none;
transition: all 0.3s ease;
}
.technical-pagination .current {
background: var(--primary-color);
color: #fff;
}
.technical-pagination a.page-numbers:hover {
background: var(--border-color);
} .no-technical-articles {
text-align: center;
padding: 60px 20px;
background: var(--dayk-light);
border-radius: 12px;
grid-column: 1 / -1;
}
.no-technical-articles i {
font-size: 3rem;
color: var(--border-color);
margin-bottom: 20px;
}
.no-technical-articles h3 {
font-size: 1.5rem;
color: var(--dark-color);
margin-bottom: 10px;
}
.no-technical-articles p {
color: var(--text-color);
max-width: 500px;
margin: 0 auto;
} @media (max-width: 1200px) {
.technical-grid {
grid-template-columns: repeat(2, 1fr);
gap: 25px;
}
}
@media (max-width: 991px) {
.technical-hero {
height: 400px;
}
.technical-hero-title {
font-size: 2.5rem;
}
.technical-hero-description {
font-size: 1rem;
}
}
@media (max-width: 768px) {
.technical-grid {
grid-template-columns: 1fr;
gap: 20px;
padding: 40px 0;
}
.technical-hero {
height: 350px;
}
.technical-hero-content {
padding-bottom: 40px;
}
.technical-hero-title {
font-size: 2rem;
}
.technical-title {
font-size: 1.3rem;
}
}
@media (max-width: 576px) {
.technical-hero {
height: 300px;
}
.technical-hero-title {
font-size: 1.8rem;
}
.technical-content {
padding: 20px;
}
.technical-title {
font-size: 1.2rem;
}
.technical-link {
font-size: 0.9rem;
}
} .technical-card {
opacity: 0;
transform: translateY(20px);
animation: fadeInUp 0.6s ease forwards;
}
.technical-card:nth-child(2) {
animation-delay: 0.2s;
}
.technical-card:nth-child(3) {
animation-delay: 0.4s;
}
@keyframes fadeInUp {
to {
opacity: 1;
transform: translateY(0);
}
} .site-footer {
padding: 60px 0 30px;
background: #fff;
font-size: 20px;
} .footer-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 30px;
padding-bottom: 60px;
border-bottom: 1px solid #e5e5e5;
}
.footer-brand {
flex: auto;
border-right: 1px solid #b2b2b2;
} .footer-brand-section {
border-right: 1px solid #b2b2b2;
padding-right: 50px;
}
.footer-brand-wrapper {
display: flex;
flex-direction: row;
gap: 30px;
height: 100%;
}
.footer-brand img {
height: 60px;
width: auto;
} .brand-menu {
flex: auto;
}
.brand-menu ul {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 15px;
}
.brand-menu a {
color: #333132;
text-decoration: none;
font-size: 1.3rem;
transition: color 0.3s ease;
}
.brand-menu a:hover {
color: #8dc63f;
} .footer-content-section {
display: flex;
flex-direction: column;
gap: 40px;
} .footer-news {
padding-bottom: 15px;
border-bottom: 1px solid #b2b2b2;
display: flex;
justify-content: space-between;
flex-direction: column;
}
.footer-news p {
margin: 0;
font-size: 1.1rem;
}
.footer-news a {
font-size: 16px;
color: #8dc63f;
text-decoration: none;
transition: color 0.3s ease;
}
.footer-news a:hover {
color: #7ab800;
} .footer-bottom-content {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 30px;
} .footer-social {
border-right: 1px solid #b2b2b2;
padding-right: 30px;
}
.site-footer h4 {
font-size: 20px;
font-weight: 500;
color: #333132;
margin-bottom: 20px;
} .social-links {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 10px;
}
.social-links a {
color: #333132;
text-decoration: none;
transition: color 0.3s ease;
}
.social-links a:hover {
color: #8dc63f;
} .social-icons-mobile {
gap: 15px;
margin-top: 15px;
display: none;
}
.social-icon-mobile {
width: 40px;
height: 40px;
border-radius: 50%;
background: #f5f5f5;
display: flex;
align-items: center;
justify-content: center;
color: #333132;
text-decoration: none;
transition: all 0.3s ease;
}
.social-icon:hover {
background: #8dc63f;
color: #fff;
}
.social-icon i {
font-size: 14px;
} .contact-links {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 10px;
}
.contact-links a {
color: #333132;
text-decoration: none;
transition: color 0.3s ease;
}
.contact-links a:hover {
color: #8dc63f;
} .footer-bottom {
display: flex;
justify-content: space-between;
padding-top: 15px;
font-size: 1rem;
}
.footer-links {
display: flex;
gap: 30px;
}
.footer-links a {
color: #333132;
text-decoration: none;
transition: color 0.3s ease;
}
.footer-links a:hover {
color: #8dc63f;
}
.copyright-section {
text-align: right;
}
.korenel-logo img {
height: 12px;
width: auto;
} @media (max-width: 1200px) {
.footer-grid {
gap: 30px;
}
.footer-news {
display: none;
}
.footer-brand-section {
padding-right: 30px;
}
}
@media (max-width: 991px) {
.site-footer {
padding: 40px 0;
}
.footer-grid {
grid-template-columns: 1fr;
gap: 40px;
}
.footer-brand-section {
border-right: none;
padding-right: 0;
border-bottom: 1px solid #b2b2b2;
padding-bottom: 40px;
}
.brand-menu {
display: none; }
.footer-brand {
text-align: center;
border-right: none;
}
.footer-brand img {
height: 50px;
}
.footer-content-section {
gap: 30px;
} .social-links {
display: none;
}
.social-icons-mobile {
display: flex;
}
.social-icons {
display: flex;
justify-content: flex-start;
}
.footer-social {
border-right: none;
padding-right: 0;
}
.footer-bottom {
align-items: start;
}
.footer-bottom-content {
grid-template-columns: 1fr;
gap: 30px;
align-self: center;
text-align: center;
}
.site-footer h4 {
font-size: 18px;
}
}
@media (max-width: 767px) {
.site-footer {
padding: 30px 0;
}
.footer-news {
display: none;
flex-direction: column;
gap: 10px;
align-items: flex-start;
}
.footer-news p {
font-size: 1rem;
}
.footer-news a {
font-size: 0.9rem;
}
.footer-bottom {
flex-direction: column;
gap: 20px;
text-align: center;
align-items: center;
}
.footer-links {
flex-wrap: wrap;
justify-content: center;
gap: 15px;
}
.copyright-section {
text-align: center;
}
.korenel-logo {
margin-top: 10px;
}
}
@media (max-width: 480px) {
.site-footer {
font-size: 16px;
}
.footer-links {
flex-direction: column;
align-items: center;
gap: 10px;
}
.social-icons {
justify-content: center;
}
.footer-social h4,
.footer-contact h4 {
text-align: center;
}
.contact-links {
text-align: center;
}
.footer-links a {
font-size: 0.9rem;
}
.copyright-section {
font-size: 0.8rem;
}
.korenel-logo img {
height: 10px;
}
} .error-hero {
position: relative;
min-height: 100vh;
background-color: var(--nav-dark);
display: flex;
align-items: center;
justify-content: center;
padding: 120px 0;
}
.error-hero-overlay {
position: absolute;
inset: 0;
background: linear-gradient(45deg, rgba(27, 52, 68, 0.98) 0%, rgba(27, 52, 68, 0.95) 100%);
z-index: 1;
}
.error-content {
position: relative;
z-index: 2;
text-align: center;
max-width: 600px;
margin: 0 auto;
}
.error-title {
font-size: 12rem;
font-weight: 700;
color: #fff !important;
line-height: 1;
margin-bottom: 20px;
background: linear-gradient(45deg, #fff, rgba(255, 255, 255, 0.7));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
animation: titleFloat 3s ease-in-out infinite;
}
.error-subtitle {
font-size: 2rem;
color: var(--primary-color);
margin-bottom: 30px;
font-weight: 500;
}
.error-text {
color: rgba(255, 255, 255, 0.8);
font-size: 1.1rem;
line-height: 1.6;
margin-bottom: 40px;
}
.error-actions {
display: flex;
gap: 20px;
justify-content: center;
}
.btn-primary,
.btn-secondary {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 15px 30px;
border-radius: 8px;
font-weight: 500;
transition: all 0.3s ease;
text-decoration: none;
}
.btn-primary {
background: var(--primary-color);
color: #fff;
}
.btn-primary:hover {
background: #7ab800;
transform: translateY(-2px);
}
.btn-secondary {
background: rgba(255, 255, 255, 0.1);
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.2);
}
.btn-secondary:hover {
background: rgba(255, 255, 255, 0.2);
transform: translateY(-2px);
}
@keyframes titleFloat {
0%, 100% {
transform: translateY(0);
}
50% {
transform: translateY(-10px);
}
} @media (max-width: 768px) {
.error-title {
font-size: 8rem;
}
.error-subtitle {
font-size: 1.5rem;
}
.error-text {
font-size: 1rem;
padding: 0 20px;
}
.error-actions {
flex-direction: column;
padding: 0 20px;
}
.btn-primary,
.btn-secondary {
width: 100%;
justify-content: center;
}
}
@media (max-width: 480px) {
.error-title {
font-size: 6rem;
}
.error-subtitle {
font-size: 1.3rem;
}
} .dayk-section__header {
text-align: center;
margin-bottom: 60px;
}
.dayk-section__badge {
display: inline-block;
color: #8dc63f;
font-size: 0.9rem;
font-weight: 500;
text-transform: uppercase;
letter-spacing: 2px;
margin-bottom: 1rem;
}
.dayk-section__title {
font-size: 2.5rem;
color: #1B3444;
margin-bottom: 20px;
font-weight: 500;
}
.dayk-section__description {
max-width: 800px;
margin: 0 auto;
color: #666;
font-size: 1.1rem;
line-height: 1.6;
} .dayk-social-impact {
padding: 100px 0;
background: #fff;
}
.dayk-impact__grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 60px;
align-items: center;
}
.dayk-impact__text {
font-size: 1.1rem;
line-height: 1.8;
color: #666;
margin-bottom: 30px;
}
.dayk-impact__list {
list-style: none;
padding: 0;
margin: 0 0 40px 0;
}
.dayk-impact__list li {
padding-left: 30px;
position: relative;
margin-bottom: 15px;
color: #333;
font-size: 1.05rem;
}
.dayk-impact__list li::before {
content: '';
position: absolute;
left: 0;
top: 8px;
width: 6px;
height: 6px;
background: #8dc63f;
border-radius: 50%;
}
.dayk-impact__stats {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
margin-top: 40px;
}
.dayk-stat__box {
text-align: center;
}
.dayk-stat__number {
font-size: 2.5rem;
color: #8dc63f;
font-weight: 600;
margin-bottom: 10px;
}
.dayk-stat__label {
color: #666;
font-size: 0.9rem;
font-weight: 500;
}
.dayk-gallery__grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
}
.dayk-gallery__item {
overflow: hidden;
}
.dayk-gallery__item img {
width: 100%;
height: 250px;
object-fit: cover;
transition: transform 0.6s ease;
}
.dayk-gallery__item:hover img {
transform: scale(1.05);
} .dayk-youth {
padding: 100px 0;
background: #f8f9fa;
}
.dayk-youth__grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 30px;
}
.dayk-youth__card {
background: #fff;
padding: 40px 30px;
text-align: center;
transition: transform 0.3s ease;
}
.dayk-youth__card:hover {
transform: translateY(-10px);
}
.dayk-youth__icon {
font-size: 2.5rem;
color: #8dc63f;
margin-bottom: 20px;
}
.dayk-youth__card h3 {
color: #1B3444;
font-size: 1.2rem;
margin-bottom: 15px;
font-weight: 500;
}
.dayk-youth__card p {
color: #666;
font-size: 0.95rem;
line-height: 1.6;
} .dayk-scholarship {
padding: 100px 0;
background: #fff;
}
.dayk-form__wrapper {
max-width: 800px;
margin: 0 auto;
} @media (max-width: 1200px) {
.dayk-youth__grid {
grid-template-columns: repeat(2, 1fr);
gap: 20px;
}
}
@media (max-width: 991px) {
.dayk-impact__grid {
grid-template-columns: 1fr;
}
.dayk-impact__stats {
grid-template-columns: repeat(3, 1fr);
}
.dayk-gallery__grid {
grid-template-columns: repeat(2, 1fr);
}
.dayk-section__title {
font-size: 2rem;
}
}
@media (max-width: 768px) {
.dayk-social-impact,
.dayk-youth,
.dayk-scholarship {
padding: 60px 0;
}
.dayk-youth__grid {
grid-template-columns: 1fr;
}
.dayk-impact__stats {
grid-template-columns: 1fr;
}
.dayk-gallery__grid {
grid-template-columns: 1fr;
}
.dayk-section__title {
font-size: 1.8rem;
}
.dayk-form__wrapper {
padding: 0 20px;
}
} .dayk-announcements {
padding: 80px 0;
background: #fff;
}
.dayk-announcements__grid {
display: flex;
flex-direction: column;
gap: 30px;
max-width: 900px;
margin: 0 auto;
} .announcement-card {
background: #fff;
padding: 30px;
border-left: 4px solid #8dc63f;
box-shadow: 0 2px 15px rgba(0, 0, 0, 0.05);
transition: all 0.3s ease;
}
.announcement-card:hover {
transform: translateX(10px);
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
}
.announcement-card__meta {
margin-bottom: 15px;
}
.announcement-date {
display: flex;
align-items: center;
gap: 8px;
color: #666;
font-size: 0.9rem;
}
.announcement-date i {
color: #8dc63f;
}
.announcement-card__title {
font-size: 1.4rem;
margin-bottom: 15px;
line-height: 1.4;
}
.announcement-card__title a {
color: #1B3444;
text-decoration: none;
transition: color 0.3s ease;
}
.announcement-card__title a:hover {
color: #8dc63f;
}
.announcement-card__excerpt {
color: #666;
font-size: 1rem;
line-height: 1.7;
margin-bottom: 20px;
}
.announcement-card__link {
display: inline-flex;
align-items: center;
gap: 8px;
color: #8dc63f;
text-decoration: none;
font-weight: 500;
font-size: 0.95rem;
transition: all 0.3s ease;
}
.announcement-card__link:hover {
gap: 12px;
}
.announcement-card__link i {
font-size: 0.8rem;
transition: transform 0.3s ease;
}
.announcement-card__link:hover i {
transform: translateX(3px);
} .dayk-pagination {
margin-top: 50px;
display: flex;
justify-content: center;
}
.dayk-pagination ul {
display: flex;
gap: 10px;
list-style: none;
padding: 0;
margin: 0;
}
.dayk-pagination .page-numbers {
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
background: #f5f5f5;
color: #333;
text-decoration: none;
transition: all 0.3s ease;
}
.dayk-pagination .current {
background: #8dc63f;
color: #fff;
}
.dayk-pagination a.page-numbers:hover {
background: #e5e5e5;
} .no-announcements {
text-align: center;
padding: 60px 20px;
background: #f8f9fa;
border-radius: 4px;
}
.no-announcements__icon {
font-size: 3rem;
color: #ccc;
margin-bottom: 20px;
}
.no-announcements h3 {
font-size: 1.5rem;
color: #333;
margin-bottom: 10px;
}
.no-announcements p {
color: #666;
max-width: 400px;
margin: 0 auto;
} @media (max-width: 991px) {
.dayk-announcements {
padding: 60px 0;
}
.announcement-card__title {
font-size: 1.3rem;
}
}
@media (max-width: 768px) {
.dayk-announcements {
padding: 40px 0;
}
.announcement-card {
padding: 20px;
}
.announcement-card__title {
font-size: 1.2rem;
}
.announcement-card__excerpt {
font-size: 0.95rem;
}
}
@media (max-width: 576px) {
.announcement-card {
border-left-width: 3px;
}
} .dayk-organizations {
padding: 80px 0;
background: #fff;
} .org-month-section {
margin-bottom: 60px;
}
.org-month-section:last-child {
margin-bottom: 0;
}
.org-month-title {
font-size: 2rem;
color: var(--dark-color);
margin-bottom: 30px;
padding-bottom: 15px;
border-bottom: 1px solid var(--border-color);
position: relative;
}
.org-month-title::after {
content: '';
position: absolute;
left: 0;
bottom: -1px;
width: 80px;
height: 3px;
background: var(--primary-color);
} .org-month-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
} .org-card {
background: #fff;
border: 1px solid var(--border-color);
border-radius: 12px;
overflow: hidden;
transition: all 0.3s ease;
}
.org-card:hover {
transform: translateY(-5px);
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
} .org-card__image {
position: relative;
width: 100%;
height: 220px;
overflow: hidden;
}
.org-card__image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.6s ease;
}
.org-card:hover .org-card__image img {
transform: scale(1.05);
}
.org-card__overlay {
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 50%;
background: linear-gradient(to top, rgba(0, 0, 0, 0.3), transparent);
pointer-events: none;
} .org-card__content {
padding: 25px;
display: flex;
flex-direction: column;
}
.org-card__date {
display: flex;
align-items: center;
gap: 8px;
color: var(--primary-color);
font-size: 0.9rem;
font-weight: 500;
margin-bottom: 15px;
}
.org-card__date i {
font-size: 1rem;
}
.org-card__title {
font-size: 1.3rem;
margin-bottom: 15px;
line-height: 1.4;
}
.org-card__title a {
color: var(--dark-color);
text-decoration: none;
transition: color 0.3s ease;
}
.org-card__title a:hover {
color: var(--primary-color);
}
.org-card__location {
display: flex;
align-items: center;
gap: 8px;
color: var(--text-color);
font-size: 0.9rem;
margin-bottom: 15px;
}
.org-card__location i {
color: var(--primary-color);
}
.org-card__excerpt {
color: var(--text-color);
font-size: 0.95rem;
line-height: 1.6;
margin-bottom: 20px;
flex-grow: 1;
}
.org-card__link {
display: inline-flex;
align-items: center;
gap: 8px;
color: var(--dark-color);
text-decoration: none;
font-weight: 500;
font-size: 0.95rem;
transition: all 0.3s ease;
margin-top: auto;
padding-top: 20px;
border-top: 1px solid var(--border-color);
}
.org-card__link:hover {
color: var(--primary-color);
gap: 12px;
}
.org-card__link i {
font-size: 0.8rem;
transition: transform 0.3s ease;
}
.org-card__link:hover i {
transform: translateX(3px);
} .org-empty {
text-align: center;
padding: 60px 20px;
background: var(--dayk-light);
border-radius: 12px;
}
.org-empty i {
font-size: 3rem;
color: var(--border-color);
margin-bottom: 20px;
}
.org-empty h3 {
font-size: 1.5rem;
color: var(--dark-color);
margin-bottom: 10px;
}
.org-empty p {
color: var(--text-color);
} .org-card {
opacity: 0;
transform: translateY(20px);
animation: fadeInUp 0.6s ease forwards;
}
.org-month-grid .org-card:nth-child(2) {
animation-delay: 0.2s;
}
.org-month-grid .org-card:nth-child(3) {
animation-delay: 0.4s;
}
@keyframes fadeInUp {
to {
opacity: 1;
transform: translateY(0);
}
} @media (max-width: 1200px) {
.org-month-grid {
grid-template-columns: repeat(2, 1fr);
gap: 25px;
}
}
@media (max-width: 991px) {
.dayk-organizations {
padding: 60px 0;
}
.org-month-title {
font-size: 1.8rem;
}
}
@media (max-width: 768px) {
.org-month-grid {
grid-template-columns: 1fr;
max-width: 500px;
margin: 0 auto;
}
.org-month-section {
margin-bottom: 40px;
}
.org-card__image {
height: 200px;
}
.org-card__content {
padding: 20px;
}
.org-card__title {
font-size: 1.2rem;
}
}
@media (max-width: 576px) {
.dayk-organizations {
padding: 40px 0;
}
.org-month-title {
font-size: 1.5rem;
}
.org-card__excerpt {
font-size: 0.9rem;
}
}  .edu-hero {
position: relative;
height: 60vh;
min-height: 500px;
display: flex;
align-items: center;
color: #fff;
margin-top: -100px;
}
.edu-hero__media {
position: absolute;
inset: 0;
z-index: 1;
}
.edu-hero__media img {
width: 100%;
height: 100%;
object-fit: cover;
}
.edu-hero__overlay {
position: absolute;
inset: 0;
background: linear-gradient(to bottom,
rgba(27, 52, 68, 0.8),
rgba(27, 52, 68, 0.6));
z-index: 2;
}
.edu-hero__content {
position: relative;
z-index: 3;
max-width: 800px;
}
.edu-hero__content h1 {
font-size: 3.5rem;
font-weight: 600;
margin-bottom: 20px;
color: #fff !important;
}
.edu-hero__content p {
font-size: 1.2rem;
line-height: 1.6;
opacity: 0.9;
} .edu-programs {
padding: 100px 0;
background: var(--dayk-light);
}
.edu-programs__header {
text-align: center;
max-width: 700px;
margin: 0 auto 60px;
}
.edu-programs__grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 30px;
}
.edu-program {
background: #fff;
border-radius: 12px;
overflow: hidden;
transition: all 0.3s ease;
}
.edu-program:hover {
transform: translateY(-10px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}
.edu-program__icon {
width: 60px;
height: 60px;
background: var(--primary-color);
color: #fff;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5rem;
position: absolute;
top: 20px;
right: 20px;
z-index: 2;
}
.edu-program__image {
position: relative;
height: 200px;
overflow: hidden;
}
.edu-program__image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.6s ease;
}
.edu-program:hover .edu-program__image img {
transform: scale(1.1);
}
.edu-program h3 {
padding: 20px;
margin: 0;
font-size: 1.3rem;
color: var(--dark-color);
border-bottom: 1px solid var(--border-color);
}
.edu-program__list {
list-style: none;
padding: 20px;
margin: 0;
}
.edu-program__list li {
color: var(--text-color);
padding: 10px 0;
border-bottom: 1px dashed var(--border-color);
font-size: 0.95rem;
}
.edu-program__list li:last-child {
border-bottom: none;
} .edu-development {
padding: 100px 0;
background: #fff;
}
.edu-development__grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 60px;
align-items: center;
}
.edu-development__image {
border-radius: 12px;
overflow: hidden;
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}
.edu-development__image img {
width: 100%;
height: auto;
display: block;
}
.edu-program__item {
margin-bottom: 30px;
padding: 25px;
background: var(--dayk-light);
border-radius: 12px;
transition: all 0.3s ease;
}
.edu-program__item:hover {
transform: translateX(10px);
background: rgba(141, 198, 63, 0.1);
}
.edu-program__item h3 {
display: flex;
align-items: center;
gap: 10px;
color: var(--dark-color);
font-size: 1.2rem;
margin-bottom: 10px;
}
.edu-program__item h3 i {
color: var(--primary-color);
}
.edu-program__item p {
color: var(--text-color);
font-size: 0.95rem;
line-height: 1.6;
margin: 0;
} .edu-cta {
padding: 100px 0;
background: var(--nav-dark);
color: #fff;
position: relative;
overflow: hidden;
}
.edu-cta::before {
content: '';
position: absolute;
top: -10%;
left: -10%;
width: 120%;
height: 120%;
background: linear-gradient(45deg, var(--primary-color) 0%, transparent 70%);
opacity: 0.1;
transform: rotate(-3deg);
}
.edu-cta__content {
position: relative;
text-align: center;
max-width: 700px;
margin: 0 auto;
}
.edu-cta__content h2 {
font-size: 2.5rem;
color: #fff !important;
margin-bottom: 20px;
}
.edu-cta__content p {
font-size: 1.1rem;
margin-bottom: 30px;
opacity: 0.9;
}
.edu-cta__button {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 15px 40px;
background: var(--primary-color);
color: #fff !important;
text-decoration: none;
border-radius: 8px;
font-weight: 500;
transition: all 0.3s ease;
}
.edu-cta__button:hover {
background: #fff;
color: var(--primary-color) !important;
transform: translateY(-3px);
}
.edu-cta__button i {
transition: transform 0.3s ease;
}
.edu-cta__button:hover i {
transform: translateX(5px);
} @keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.edu-program,
.edu-program__item {
animation: fadeInUp 0.6s ease forwards;
}
.edu-program:nth-child(2) {
animation-delay: 0.2s;
}
.edu-program:nth-child(3) {
animation-delay: 0.4s;
}
.edu-program:nth-child(4) {
animation-delay: 0.6s;
}
.edu-program__item:nth-child(2) {
animation-delay: 0.2s;
}
.edu-program__item:nth-child(3) {
animation-delay: 0.4s;
} @media (max-width: 1200px) {
.edu-programs__grid {
grid-template-columns: repeat(2, 1fr);
gap: 25px;
}
}
@media (max-width: 991px) {
.edu-hero {
height: 50vh;
}
.edu-hero__content h1 {
font-size: 2.8rem;
}
.edu-development__grid {
grid-template-columns: 1fr;
gap: 40px;
}
.edu-development__image {
order: -1;
}
}
@media (max-width: 768px) {
.edu-hero {
height: 40vh;
}
.edu-hero__content h1 {
font-size: 2.2rem;
}
.edu-hero__content p {
font-size: 1.1rem;
}
.edu-programs__grid {
grid-template-columns: 1fr;
max-width: 500px;
margin: 0 auto;
}
.edu-program__item {
padding: 20px;
}
.edu-program__item h3 {
font-size: 1.1rem;
}
.edu-cta {
padding: 60px 0;
}
.edu-cta__content h2 {
font-size: 2rem;
}
}
@media (max-width: 576px) {
.edu-hero__content h1 {
font-size: 1.8rem;
}
.edu-hero__content p {
font-size: 1rem;
}
.edu-program__icon {
width: 50px;
height: 50px;
font-size: 1.2rem;
}
.edu-cta__button {
width: 100%;
justify-content: center;
}
.edu-program__image {
height: 180px;
}
} .section-badge {
display: inline-block;
color: var(--primary-color);
font-size: 0.9rem;
font-weight: 500;
text-transform: uppercase;
letter-spacing: 2px;
margin-bottom: 1rem;
}
.section-title {
font-size: 2.5rem;
color: var(--dark-color);
margin-bottom: 1.5rem;
font-weight: 500;
}
.edu-overview {
background: #fff;
padding: 100px 0;
} .edu-overview__grid {
display: grid;
grid-template-columns: 1.5fr 1fr;
gap: 60px;
align-items: center;
}
.edu-overview__content p {
font-size: 1.1rem;
line-height: 1.8;
color: var(--text-color);
}
.edu-overview__stats {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
}
.edu-stat {
background: var(--dayk-light);
padding: 30px;
text-align: center;
border-radius: 12px;
transition: all 0.3s ease;
}
.edu-stat:hover {
transform: translateY(-10px);
background: rgba(141, 198, 63, 0.1);
}
.edu-stat__number {
font-size: 2.5rem;
font-weight: 600;
color: var(--primary-color);
margin-bottom: 10px;
}
.edu-stat__label {
font-size: 0.9rem;
color: var(--text-color);
font-weight: 500;
} .service-gallery-container {
display: flex;
gap: 20px;
margin-bottom: 30px;
}
.service-main-image {
flex: 1;
height: 500px;
}
.service-main-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: opacity 0.3s ease;
}
.service-thumbnails {
width: 120px;
display: flex;
flex-direction: column;
gap: 10px;
overflow-y: auto;
max-height: 500px;
padding-right: 10px;
}
.service-thumbnails::-webkit-scrollbar {
width: 6px;
}
.service-thumbnails::-webkit-scrollbar-track {
background: #f1f1f1;
}
.service-thumbnails::-webkit-scrollbar-thumb {
background: #888;
border-radius: 3px;
}
.thumb-item {
width: 100%;
height: 90px;
cursor: pointer;
opacity: 0.6;
transition: opacity 0.3s ease;
border-radius: 4px;
overflow: hidden;
}
.thumb-item:hover {
opacity: 0.8;
}
.thumb-item.active {
opacity: 1;
}
.thumb-item img {
width: 100%;
height: 100%;
object-fit: cover;
}
@media (max-width: 768px) {
.service-gallery-container {
flex-direction: column;
}
.service-main-image {
height: 350px;
}
.service-thumbnails {
width: 100%;
flex-direction: row;
max-height: none;
overflow-x: auto;
padding-bottom: 10px;
}
.thumb-item {
flex: 0 0 120px;
}
}