/*
Theme Name: Blockskit Digital Agency
Theme URI: https://blockskit.com/blockskit-digital-agency/
Author: BlockskitDev
Author URI: https://blockskit.com
Description: Blockskit Digital Agency is a modern and versatile WordPress theme created especially to build versatile sites such as agency, business, company, consulting, corporate, digital agency, finance, financial, marketing and all other agency websites without a single line of coding. It offers full-site-editing, allowing easy customization of all aspects of your site. With multiple templates, patterns, and style variations, it's suitable for different aesthetics.
Template: blockskit-base
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 5.6
License: GPLv3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: blockskit-digital-agency
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, threaded-comments, translation-ready, wide-blocks, block-styles, blog, portfolio, education

Blockskit Digital Agency WordPress Theme, Copyright 2025 BlockskitDev
Blockskit Digital Agency is distributed under the terms of the GNU General Public License v3
*/

header.sticky {
  position: fixed; /* Change to fixed when sticky */
  top: 0;
  left: 0;
  right: 0;
  background: white; /* Change background when sticky */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Add shadow */
  z-index: 999;
}

.country-select.inside .flag-dropdown {
  display: none;
}

.country-select.inside .flag-dropdown + input {
  padding: 0 15px;
}

:root :where(.wp-element-button, .wp-block-button__link) {
  border-radius: 25px;
  border: 2px solid var(--wp--preset--color--primary);
  background-color: var(--wp--preset--color--primary);
  transition: all 0.5s ease-in-out 0s;
}

:root :where(.wp-element-button, .wp-block-button__link):hover {
  background-color: transparent;
  color: var(--wp--preset--color--primary);
}

.wpcf7-not-valid-tip {
  font-size: 0.7em;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
  font-size: 14px;
  color: #000;
  font-family: var(--wp--preset--font-family--body);
}

.wpcf7 textarea {
  max-height: 140px;
  resize: none;
}

.info-banner div > a {
  text-decoration: none;
  margin-right: 5px;
}

.info-banner a svg path,
.sm-block > a > svg path {
  fill: #ffcb08;
}

.info-banner div > a > svg,
.sm-block > a > svg {
  max-width: 16px;
  display: inline-block;
  vertical-align: middle;
  margin: 0 5px;
}

.info-banner a:hover {
  color: #ffcb08;
}

.info-banner {
  font-size: 14px;
  padding: 10px 0;
}

.info-banner > div {
  padding: 0;
}

.wp-block-navigation
  .wp-block-navigation-item__content.wp-block-navigation-item__content.active {
  color: #ffcb08;
}

.wrap-banner {
  position: relative;
}

.wrap-banner:after {
  /* content: ""; */
  position: absolute;
  background-image: url(assets/images/shape.png);
  background-repeat: no-repeat;
  height: 150px;
  background-size: cover;
  background-position: center top;
  width: 100%;
  bottom: 80px;
  left: 0;
  right: 0;
  z-index: 9;
}

.wrap-banner:before {
  content: "";
  background: #e8ebee;
  bottom: 0;
  left: 0;
  right: 0;
  height: 80px;
  z-index: 9;
  position: absolute;
}

.wrap-banner .wp-block-cover__inner-container {
  z-index: 10;
}

.banner-box svg {
  width: 40px;
  height: 40px;
  margin: 0 auto 10px;
}

.banner-box {
  padding: 30px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-radius: 25px;
  box-sizing: border-box;
  min-height: 160px;
  box-shadow: 0px 0px 13px 0px rgb(0 0 0 / 10%);
}

.banner-box svg path {
  fill: #ffcb08;
}

.wrap-banner .wp-block-columns {
  align-items: center !important;
}

.boc-service {
  text-align: center;
  min-height: 1px;
}
.boc-service svg {
  max-width: 80px;
  margin-bottom: 20px;
}
.boc-service svg path,
.boc-service svg circle,
.boc-service svg line,
.boc-service svg polyline,
.boc-service svg rect {
  stroke: #ffcb08;
}

.swiper-pagination-bullet {
  background: #ffcb08;
  opacity: 0.5;
}

.swiper-pagination-bullet-active {
  opacity: 1;
}

.wp-block-gutsliders-any-content .swiper-slide {
  height: 100%;
}

.boc-service .has-global-padding {
  min-height: 330px !important;
}

.contact-info svg {
  width: 22px;
  vertical-align: middle;
  margin-right: 6px;
}

.contact-info a {
  text-decoration: none;
}

.contact-info li {
  list-style: none;
  margin-bottom: 10px;
}

.contact-info ul {
  padding: 0;
  margin: 0;
}

.contact-info {
  margin-top: 30px;
  padding: 30px;
  background: #ffcb08;
  display: inline-block;
  box-shadow: 0px 0px 10px 0px #0003;
  border-radius: 25px;
}

.contact-info li:last-child {
  margin-bottom: 0;
}

.contact-info a:hover {
  color: #fff;
}

.scrollToTop {
  width: 50px;
  height: 50px;
  display: inline-block;
  background: #ffcb08;
  clip: initial;
  clip-path: initial;
  margin: 0;
  z-index: 999;
  font-size: 0;
  border-radius: 50px;
  bottom: 20px;
  right: 20px;
  position: fixed !important;
}

.scrollToTop:after {
  content: "";
  position: absolute;
  width: 15px;
  height: 15px;
  border: 5px solid #fff;
  left: 0;
  right: 0;
  bottom: 0px;
  top: 10px;
  margin: auto;
  transform: rotate(45deg);
  border-bottom: 0;
  border-right: 0;
}

.success-message {
  border: 2px solid #ffcb08;
  padding: 20px;
  width: 80%;
  text-align: center;
  margin-top: 25%;
}

.wrap-banner.wp-block-cover,
.wrap-banner.wp-block-cover-image {
  overflow: inherit;
}

.align-center {
  justify-content: center;
}

.inner-banner figure {
  position: absolute;
  left: 0;
  right: 0;
  top: -50%;
  bottom: 0;
  max-width: 100%;
  margin: 0;
  z-index: -1;
}

.inner-banner figure:before {
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: #00000080;
}

.counter-div h5 {
  width: 50px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.page-template-default .wrap-process-inner {
  position: relative;
}

.page-template-default .wrap-process-inner:before {
  position: absolute;
  content: "";
  background: #e8ebee;
  left: -100%;
  right: -100%;
  top: 0;
  bottom: 0;
}

.wp-block-navigation
  .has-child
  .wp-block-navigation__submenu-container
  > .wp-block-navigation-item
  > .wp-block-navigation-item__content:hover,
.wp-block-navigation
  .has-child
  .wp-block-navigation__submenu-container
  > .wp-block-navigation-item
  > .wp-block-navigation-item__content.active,
.wp-block-navigation .has-child .current-menu-item a {
  background: #ffcb08;
  color: #fff;
}

.wp-block-navigation
  .has-child
  .wp-block-navigation__submenu-container
  > .wp-block-navigation-item
  > .wp-block-navigation-item__content {
  font-size: 15px;
  text-transform: none;
  padding: 13px;
}

.wp-block-navigation
  .has-child
  .wp-block-navigation-submenu__toggle[aria-expanded="true"]
  ~ .wp-block-navigation__submenu-container,
.wp-block-navigation
  .has-child:not(.open-on-click):hover
  > .wp-block-navigation__submenu-container,
.wp-block-navigation
  .has-child:not(.open-on-click):not(.open-on-hover-click):focus-within
  > .wp-block-navigation__submenu-container {
  z-index: 99;
  min-width: 1px;
  left: -100%;
  right: -100%;
  padding-top: 39px;
  border: 0;
  background: transparent;
}

.wp-block-navigation ul.wp-block-navigation-submenu li {
  background: #fff;
}

.slider-container {
  position: relative;
  width: 100%;
  margin: 40px 0;
}

.slider-track {
  display: flex;
  width: max-content;
  animation: scroll 30s linear infinite;
}

.slide {
  width: 180px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s;
}

.slide img {
  max-width: 100%;
  max-height: 70px;
  filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.1));
}

/* Simulated random vertical offsets */
.up1 {
  transform: translateY(-20px);
}
.up2 {
  transform: translateY(-40px);
}
.down1 {
  transform: translateY(20px);
}
.down2 {
  transform: translateY(40px);
}

@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

@keyframes bounceUpDown {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-15px);
  }
}

.wrap-tech-banner h4 {
  text-align: center;
  margin-bottom: 90px;
  text-transform: capitalize;
}

.wrap-tech-banner {
  position: relative;
  padding: 60px 0;
  margin: 0;
}

.wrap-tech-banner:before {
  position: absolute;
  content: "";
  left: -100%;
  right: -100%;
  top: 0;
  bottom: 0;
  background: #ffcb08;
  z-index: -9;
}

.sticky .info-banner,
.popup-incld .wpcf7 {
  display: none;
}

.popup-incld .wpcf7 {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: #000000a6;
  height: 100vh;
  z-index: 999;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.popup-incld .wpcf7 form {
  width: 600px;
  background: #fff;
  padding: 50px;
  position: relative;
  max-width: 90%;
  max-height: 90vh;
  overflow: auto;
}

.popup-incld .wpcf7 form .close-btn {
  position: absolute;
  right: 10px;
  top: 5px;
  background: transparent;
  color: #000;
  border: 0;
  font-size: 50px;
  text-decoration: none;
}

.popup-incld .wpcf7 form .contact-form li:nth-last-child(2) {
  width: 100%;
}

.popup-incld .wpcf7 form select {
  font-size: 14px;
  color: #000;
  font-family: var(--wp--preset--font-family--body);
  border: 1px solid #e5e7eb;
  height: 45px;
}

.popup-incld .wpcf7 form ul.contact-form {
  margin: 0 -10px;
}

.popup-incld .contact-form + p {
  margin: 0;
}

.popup-incld > .success-message {
  display: none;
}
@media only screen and (min-width: 600px) {
  .sm-block {
    display: none;
  }
}

@media only screen and (max-width: 1300px) {
  .inner-banner .wp-block-post-featured-image img.attachment-post-thumbnail {
    width: auto;
    height: 100%;
  }

  .page-template-default main {
    overflow: hidden;
  }
}

@media only screen and (max-width: 1024px) {
  .banner-box {
    padding: 20px;
  }
  .wrap-banner:after {
    bottom: 74px;
  }
  header .wp-block-navigation.items-justified-center {
    gap: 20px;
  }
  .wrap-banner .wp-block-columns {
    gap: 20px;
  }
  .wrap-about
    div.wp-block-column.wp-block-column-is-layout-flow.has-surface-border-color {
    flex-basis: 110% !important;
  }
  .wrap-process
    .wp-block-columns.is-layout-flex.wp-block-columns-is-layout-flex {
    gap: 25px;
  }
  .wp-block-navigation__responsive-container-content
    .wp-block-navigation__container {
    gap: 15px;
  }
  .wrap-about .wp-block-column.is-vertically-aligned-bottom {
    display: none;
  }
  .entry-content.wp-block-post-content.is-layout-flow.wp-block-post-content-is-layout-flow {
    margin-top: 0;
  }
}

@media only screen and (max-width: 781px) {
  .wrap-banner:before,
  .wrap-banner:after,
  .sm-none {
    display: none !important;
  }

  header .mobile-header .is-content-justification-right {
    justify-content: center;
  }

  .wrap-banner {
    padding-bottom: 96px !important;
  }

  .wrap-about {
    padding: 30px 20px !important;
  }

  .wrap-about div:not(.wp-block-buttons) {
    margin-top: 0 !important;
  }

  .wrap-process
    .wp-block-columns:not(.is-not-stacked-on-mobile)
    > .wp-block-column {
    flex-basis: 40% !important;
    padding-top: 0 !important;
  }

  .boc-service .has-global-padding {
    min-height: 290px !important;
  }

  .boc-service .has-background-background-color {
    padding: 50px !important;
  }

  .wrap-contact {
    padding: 30px 20px !important;
  }

  .wrap-form {
    order: 2;
  }

  .contact-info {
    width: 100%;
    box-sizing: border-box;
  }

  .contact-info li {
    margin-bottom: 0;
  }

  .contact-info ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
  }

  footer .wp-block-columns-is-layout-flex div {
    justify-content: center;
  }
  .success-message {
    margin-top: 15px;
    width: auto;
    padding: 8px;
  }
  .wp-block-navigation
    .has-child
    .wp-block-navigation-submenu__toggle[aria-expanded="true"]
    ~ .wp-block-navigation__submenu-container,
  .wp-block-navigation
    .has-child:not(.open-on-click):hover
    > .wp-block-navigation__submenu-container,
  .wp-block-navigation
    .has-child:not(.open-on-click):not(.open-on-hover-click):focus-within
    > .wp-block-navigation__submenu-container {
    padding-top: 24px;
  }

  .entry-content.wp-block-post-content.is-layout-flow.wp-block-post-content-is-layout-flow {
    margin-top: 0;
    box-sizing: border-box;
  }

  .entry-content .alignfull {
    padding: 0 20px 30px !important;
  }

  .wrap-process-inner {
    padding: 60px 20px !important;
  }

  .wrap-process-inner
    .wp-block-columns:not(.is-not-stacked-on-mobile)
    > .wp-block-column {
    flex-basis: 47% !important;
    width: 47%;
    display: inline-block;
    margin: 0 1% 2%;
  }

  .wrap-process-inner * {
    box-sizing: border-box;
  }

  .wrap-process-inner .wp-block-columns {
    display: inline !important;
  }
}

@media only screen and (max-width: 600px) {
  .info-banner div > a {
    font-size: 0;
    vertical-align: middle;
  }

  .info-banner div > a > svg,
  .sm-block > a > svg {
    max-width: 20px;
  }

  .info-banner div {
    font-size: 0;
  }

  .info-banner {
    padding: 10px 15px;
  }

  body
    .info-banner
    .wp-block-columns.is-not-stacked-on-mobile
    > .wp-block-column[style*="flex-basis"] {
    flex-basis: 60% !important;
  }

  body .info-banner .wp-block-columns.is-not-stacked-on-mobile > div {
    flex-basis: 40% !important;
  }

  header
    .wp-block-columns:not(.is-not-stacked-on-mobile)
    > .wp-block-column.mobile-header {
    justify-content: right !important;
  }

  header .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
    flex-basis: 40% !important;
    display: flex;
    justify-content: left !important;
  }

  header .mobile-header .is-content-justification-right {
    justify-content: right;
    margin: 0;
  }
  .wrap-banner {
    padding: 20px 15px !important;
    min-height: 340px;
  }

  .wrap-banner h2 {
    font-size: 30px !important;
    line-height: 1.2 !important;
  }

  .wrap-banner p {
    font-size: 14px !important;
  }

  .wrap-about div.wp-block-column.wp-block-column-is-layout-flow,
  .wrap-about
    div.wp-block-column.wp-block-column-is-layout-flow.has-surface-border-color {
    flex-basis: 100% !important;
  }

  .wrap-about .wp-block-column.is-vertically-aligned-bottom {
    display: none;
  }

  .wrap-about .wp-container-core-columns-is-layout-5 {
    gap: 30px;
  }

  .wrap-process {
    padding: 50px 20px !important;
  }

  .wrap-process p br {
    display: none;
  }

  .wrap-process .is-layout-flow > .aligncenter {
    width: 50%;
  }

  .wrap-process h5 {
    margin-top: 10px !important;
  }

  .contact-info li {
    margin-bottom: 15px;
    width: 100%;
    text-align: left;
  }

  .contact-form li {
    width: 100%;
    padding: 0;
  }

  .wpcf7 {
    padding: 0;
  }
  footer > div {
    padding: 30px 20px !important;
  }

  .wrap-services,
  .wrap-testimonial {
    padding: 50px 20px !important;
  }

  .title-box {
    justify-content: center;
  }

  .title-box hr {
    display: none;
  }

  .has-text-align-left {
    text-align: center;
  }

  header .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
    text-align: center;
  }

  .title-box h6 {
    font-size: 16px !important;
  }

  .wp-block-contact-form-7-contact-form-selector {
    text-align: left;
  }

  .contact-form + p {
    margin: 0;
  }

  .sm-block a {
    width: 40px;
    display: inline-block;
    vertical-align: middle;
    margin: 0 !important;
  }

  .wp-block-group.sm-block.is-layout-flow.wp-block-group-is-layout-flow {
    justify-content: center;
    align-items: center;
  }

  .wrap-about .wp-block-buttons {
    justify-content: center;
  }
  footer > div .wp-block-group {
    flex-wrap: wrap !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__responsive-container-content
    .wp-block-navigation__container,
  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__responsive-container-content
    .wp-block-navigation__submenu-container {
    width: 100%;
  }

  li.has-x-small-font-size.wp-block-navigation-item.has-child.open-on-hover-click.wp-block-navigation-submenu {
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__responsive-container-content
    li.wp-block-navigation-item {
    width: 100%;
    flex-direction: row;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container.wp-block-navigation__submenu-container.wp-block-navigation__submenu-container {
    left: inherit;
    right: inherit;
    opacity: 0;
    visibility: hidden;
    min-width: 1px;
    padding: 0;
    height: 0;
    width: 100%;
    display: flex;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__responsive-container-content
    .wp-block-navigation__submenu-icon {
    display: block;
    font-size: 22px;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__responsive-container-content
    .wp-block-navigation__submenu-icon[aria-expanded="true"]
    + .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container.wp-block-navigation__submenu-container.wp-block-navigation__submenu-container {
    left: 0;
    right: 0;
    height: auto;
    opacity: 1;
    visibility: visible;
    padding-top: 10px;
  }
  .wp-block-navigation
    .has-child
    .wp-block-navigation__submenu-container
    > .wp-block-navigation-item
    > .wp-block-navigation-item__content {
    font-size: var(--wp--preset--font-size--x-small) !important;
    padding: 10px;
  }

  .wrap-process-inner
    .wp-block-columns:not(.is-not-stacked-on-mobile)
    > .wp-block-column {
    width: 100%;
    margin: 0 0 20px;
  }

  .page-template-default .wp-block-columns.is-not-stacked-on-mobile > div {
    flex-basis: 100% !important;
  }

  .page-template-default .wp-block-columns.is-not-stacked-on-mobile {
    display: flex;
    flex-wrap: wrap !important;
  }

  .page-template-default
    .info-banner
    .wp-block-columns.is-not-stacked-on-mobile {
    flex-wrap: nowrap !important;
  }
}