/*
Theme Name: Pageking Flex (child)
Template: pk-theme
Author: Pageking
Author URI: https://www.pageking.nl/
Description: Pageking is een thema voor WordPress dat is ontworpen voor Pageking websites.
Requires at least: 5.9
Tested up to: 6.7.2
Requires PHP: 8.3
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/


* {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

:root {
  --sc-black: #212121;
  --sc-black-secondary: #171717;
  --sc-blue: #3187DD;
  --sc-blue-hover: #124ca2;
  --sc-white: #fff;
  --sc-grey-dark: #3A3A3A;
  --sc-grey-light: #BFBFBF;
}

html {
  scroll-behavior: smooth;
}

.pk-page {
  overflow: clip !important;
}

/* OPTIONAL, NO MARGIN 1 PARAGRAPH */
/* p:only-child,
p:last-child {
    margin: 0;
} */

/* OPTIONAL, NO MARGIN TOP EXEPT FIRST ROW */
/* .flex-content > .flex-layout:not(:first-child) > .pk-row {
	padding-top: 0;
} */

h1,h2 {
  text-transform: uppercase;
}

h3, h4 {
  font-family: 'Inter' !important;
  font-weight: bold !important;
  line-height: 1.2 !important;
}

p > a {
  color: inherit;
  font-weight: inherit;
  text-decoration: underline;
  text-underline-offset: 4px;
}

highlight {
  color: var(--sc-blue) !important;
}

.pk-page-content h1, .pk-page-content h2, .pk-page-content h3, .pk-page-content h4, .pk-page-content h5, .pk-page-content h6 {
  margin-bottom: 0px !important;
}

.pk-page-content .flex-content {
  background-image: url('/wp-content/uploads/2026/01/path-441.svg');
  background-size: 140%;
  background-position: center calc(var(--pk-header-height) + 200px);
  background-repeat: no-repeat;
}

h1.small-h1, .small-h1 > h1 {
  font-size: clamp(40px, 6.87vw, 88px);
}

h2.small-h2, .small-h2 > h2 {
  font-size: clamp(32px, 4.43vw, 56px);
}

[data-text-wrapper] {
    position: relative;
}

[data-text-double] {
    position: absolute;
    white-space: nowrap;
    left: 0;
}

.pk-button, .sc_primary_button, .sc_secondary_button {
  font-family: Inter;
  font-size: 20px !important;
  font-weight: 600 !important;
  display: block;
  padding: 13px 40px;
  line-height: normal;
  color: var(--sc-white);
  border-radius: 5px;
  text-decoration: none;
  width: fit-content;
  transition: .3s ease-in-out background-color, .3s ease-in-out color; 
}

.pk-button-group .pk-button:nth-child(1), .sc_primary_button {
  background-color: var(--sc-blue);
}

.pk-button-group .pk-button:nth-child(2), .sc_secondary_button {
  outline-offset: -1px;
  outline: 1px solid var(--sc-white);
}

.pk-button-group .pk-button:nth-child(1):hover, .sc_primary_button:hover {
  background-color: var(--sc-blue-hover);
}

.pk-button-group .pk-button:nth-child(2):hover, .sc_secondary_button:hover {
  background-color: rgba(255,255,255, .2);
}

.sc-arrow-button {
  font-family: Inter;
  font-size: 16px;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 24px;
  justify-content: space-between;
  padding: 8px 16px;
  color: var(--sc-grey-light);
  border: 1px solid var(--sc-grey-dark);
  text-decoration: none;
  width: fit-content;
  transition: .3s ease-in-out background-color, .3s ease-in-out color; 
}

.sc-arrow-button:hover {
  color: var(--sc-white);
}

.sc-arrow-button::after {
    content: '';
    transform-origin: center;
    width: .8em;
    height: .8em;
    background-color: currentColor;
    transition: transform 0.2s ease-in-out;
    mask: url("data:image/svg+xml,%3Csvg width='14' height='13' viewBox='0 0 14 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.04271 0.600586L12.5581 6.1163L7.04271 11.632M12.5588 6.1163H0.600098' stroke='%23BFBFBF' stroke-width='1.20029' stroke-linecap='round'/%3E%3C/svg%3E%0A") no-repeat center / contain;
    -webkit-mask: url("data:image/svg+xml,%3Csvg width='14' height='13' viewBox='0 0 14 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.04271 0.600586L12.5581 6.1163L7.04271 11.632M12.5588 6.1163H0.600098' stroke='%23BFBFBF' stroke-width='1.20029' stroke-linecap='round'/%3E%3C/svg%3E%0A") no-repeat center / contain;
    flex-shrink: 0;
}

.sc-arrow-button:hover::after {
    transform: translateX(2px);
}

/* general classes for styling purposes */

.content-gap {
  gap: 24px;
}

.content-gap .pk-button-group {
  margin-top: 32px;
}

.overflow-swiper {
  overflow: visible !important;
}

.pk-page .swiper-scrollbar {
    position: relative !important;
    margin-top: 80px !important;
    height: 2px !important;
    bottom: 0;
    margin-inline:auto !important;
    background: rgba(255,255,255, .15) !important;
    width: 100% !important;
    left: 0;
    right: 0
}

.pk-page .swiper-scrollbar .swiper-scrollbar-drag {
    background: var(--sc-white);
}

/* HEADER */

.pk-page header {
  background-color: var(--sc-black);
}

header .header-logo img {
    aspect-ratio: 229 / 42;
}

.pk-page header > .pk-header-wrapper {
  max-width: calc(var(--pk-container-width) + 40px);
  margin-inline: auto;
  padding-inline: var(--pk-site-gutter);
}

.pk-menu .menu .submenu-toggle {
  border: 0px;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='8' viewBox='0 0 14 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.75 0.75L6.75 6.75L12.75 0.75' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-color: transparent; background-position: center; background-size: contain; background-repeat: no-repeat;
  height: 1em;
}

.pk-page .pk-menu .menu {
  gap: 30px;
}

.pk-page header .pk-menu-item:not(.menu-button) a {
  text-decoration: none;
  color: var(--sc-white);
  transition: color 0.2s ease-in-out;
  font-size: 16px;
  font-weight: 700;
  position: relative;
}

.pk-page header .pk-menu-item:not(.menu-button) a::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    z-index: 1;
    width: 0;
    height: 1px;
    background-color: currentColor;
    translate: -50% 2px;
    transition: all 0.3s ease-in-out;
}

.pk-page header .pk-menu-item:not(.menu-button) a:hover::before {
    width: 100%;
}

.pk-page header .pk-menu-item:not(.menu-button) a:hover, .pk-page header .pk-menu-item:not(.menu-button) a:active {
  color: var(--st-rose);
}

.pk-page header .pk-menu-item.menu-button a {
  margin-left: 36px;
  padding: 13px 26px 8px 26px;
  background-color: var(--sc-blue);
  color: var(--sc-white);
  border-radius: 5px;
  font-weight: 700;
  font-size: 16px;
  font-style: normal;
  text-decoration: none;
  transition: transform .2s ease-in-out, .3s ease-in-out background-color, .3s ease-in-out color; 
}

.pk-page header .pk-menu-item.menu-button a:hover {
  background-color: var(--sc-blue-hover);
}

/* DEFAULTS PAGE-CONTENT */
.pk-page-content h1, .pk-page-content h2, .pk-page-content h3, .pk-page-content h4, .pk-page-content h5, .pk-page-content h6 {
  margin-top: 0rem;
  margin-bottom: 1rem;
}
.pk-page-content p {
  margin-top: 0;
  margin-bottom: 1.25rem;
}
.pk-page-content ul, .pk-page-content ol {
  margin-top: 0;
  margin-bottom: 1.5rem;
  padding-left: 1.1rem;
}
.pk-page-content li {
  margin-bottom: 0.5rem;
}
.pk-page-content img {
  max-width: 100%;
  height: auto;
  display: block;
}
.pk-page-content table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 2rem;
}
.pk-page-content th, .pk-page-content td {
  padding: 0.75rem 1rem;
  border: 1px solid #e0e0e0;
  text-align: left;
}
.pk-page-content blockquote {
  margin: 1.5rem 0;
  padding: 1rem 1.5rem;
}
.pk-page-content hr {
  border: none;
  border-top: 1px solid #e0e0e0;
  margin: 2rem 0;
}

/* INFO BOXES (FAQ) */

.sc_info_boxes {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sc_info_box {
  width: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 12px 0px 24px 0px;
  cursor: pointer;
  border-bottom: 2px solid #DBDED8;
  transition: .3s ease-in-out padding;
}

.sc_info_box.open {
  padding: 12px 0px 32px 0px;
}

.sc_info_box .box_title,
.sc_info_box .sc_info_inner * {
  color: var(--cdc-darkblue);
}

.sc_info_box ol {
  padding-left: 20px;
}

.sc_info_box .box_title {
  width: 100%;
  margin: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}

.sc_info_box .box_title span {
  font-size: clamp(18px, 1.87vw, 24px);
  line-height: 1.5;
}

.sc_info_box .sc_info_inner {
  display: grid;
  grid-template-rows: 0fr;
  transition: all 0.3s ease-in-out; 
  -moz-transition: all 0.3s ease-in-out; 
  -webkit-transition: all 0.3s ease-in-out;
}

.sc_info_box .sc_info_inner .sc_info_content {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sc_info_box .sc_info_content p:last-of-type {
  margin-bottom: 0;
}

.sc_info_box.open .sc_info_inner {
  grid-template-rows: 1fr;
  padding-top: 20px;
}

.sc_info_box a {
  transition: color 0.2s ease-in-out;
  -moz-transition: color 0.2s ease-in-out;
  -webkit-transition: color 0.2s ease-in-out;
  color: rgba(27, 32, 60, .7);
  font-size: 16px;
  font-weight: 300;
  line-height: 1.6;
  text-decoration: none;
}

.sc_info_box a:hover {
  text-decoration: none;
  color: rgba(27, 32, 60, 1);
}

.sc_info_box .icon {
  width: 40px; 
  height: auto;
  aspect-ratio: 1;
  position: relative;
}

.sc_info_box .icon span {
  display: block;
  position: absolute;
  width: 3px; 
  height: 1em;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  background-color: var(--sc-white);
  transform-origin: center;
  transition: transform 300ms ease-in-out, background-color 300ms ease-in-out;
}

.sc_info_box .icon span:nth-child(2) {
  transform: rotate(90deg);
}

.sc_info_box.open .icon span {
  transform: rotate(270deg);
  background-color: var(--sc-blue);
}



/* FOOTER */

footer {
  background-color: var(--sc-black-secondary);
  padding-inline: var(--pk-site-gutter);
}

footer > .pk-row {
  padding-block: 80px;
}

footer > .pk-row .pk-row-content {
  row-gap: 80px;
}

footer .newsletter-col {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 40px;
}

footer .newsletter-col img {
  width: 220px;
  height: auto;
  aspect-ratio: 228/41;
}

footer .newsletter-col .newsletter-wrapper {
  max-width: 600px;
}

footer .newsletter-col .newsletter-wrapper .gform_wrapper .gform_heading, footer .newsletter-col .newsletter-wrapper .gform_wrapper .gfield_label {
  display: none;
}

footer .newsletter-col .newsletter-wrapper .gform_wrapper .gform_fields input[type="text"] {
  background-color: transparent !important;
  border: none;
  border-radius: 0px;
  border-bottom: 1px solid #747474;
  font-size: 16px;
  color: white;
  padding: 0px 30px 16px 0px;
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_194_1033' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='18' height='18'%3E%3Crect width='17.28' height='17.28' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_194_1033)'%3E%3Cpath d='M2.88019 14.3995C2.48419 14.3995 2.14519 14.2585 1.86319 13.9765C1.58119 13.6945 1.44019 13.3555 1.44019 12.9595V4.31945C1.44019 3.92345 1.58119 3.58445 1.86319 3.30245C2.14519 3.02045 2.48419 2.87945 2.88019 2.87945H10.1522C10.1042 3.11945 10.0802 3.35945 10.0802 3.59945C10.0802 3.83945 10.1042 4.07945 10.1522 4.31945H2.88019L8.64019 7.91945L11.2682 6.28145C11.4362 6.43745 11.6192 6.57245 11.8172 6.68645C12.0152 6.80045 12.2222 6.89945 12.4382 6.98345L8.64019 9.35945L2.88019 5.75945V12.9595H14.4002V7.12745C14.6762 7.06745 14.9342 6.98345 15.1742 6.87545C15.4142 6.76745 15.6362 6.63545 15.8402 6.47945V12.9595C15.8402 13.3555 15.6992 13.6945 15.4172 13.9765C15.1352 14.2585 14.7962 14.3995 14.4002 14.3995H2.88019ZM13.6802 5.75945C13.0802 5.75945 12.5702 5.54945 12.1502 5.12945C11.7302 4.70945 11.5202 4.19945 11.5202 3.59945C11.5202 2.99945 11.7302 2.48945 12.1502 2.06945C12.5702 1.64945 13.0802 1.43945 13.6802 1.43945C14.2802 1.43945 14.7902 1.64945 15.2102 2.06945C15.6302 2.48945 15.8402 2.99945 15.8402 3.59945C15.8402 4.19945 15.6302 4.70945 15.2102 5.12945C14.7902 5.54945 14.2802 5.75945 13.6802 5.75945Z' fill='white'/%3E%3C/g%3E%3C/svg%3E%0A");  background-repeat: no-repeat;
  background-size: 17px;
  background-position: 100% 4px;
}

footer .newsletter-col .newsletter-wrapper .gform_wrapper .gform_fields input[type="text"]:focus, footer .newsletter-col .newsletter-wrapper .gform_wrapper input[type=submit]#gform_submit_button_1:focus {
  outline: none;
}

footer .newsletter-col .newsletter-wrapper .gform_wrapper .gform_fields input[type="text"]::placeholder {
    color: #747474 !important;
}

footer .newsletter-col .newsletter-wrapper .gform_wrapper input[type=submit]#gform_submit_button_1 {
    font-size: 18px;
    font-weight: 600;
    padding: 14px 40px;
    border-radius: 5px;
    width: fit-content;
    transition: background-color 0.3s ease-in-out;
    text-decoration: none;
    background-color: var(--sc-blue) !important;
    color: var(--sc-white) !important;
    border: none !important;
}

footer .newsletter-col .newsletter-wrapper .gform_wrapper input[type=submit]#gform_submit_button_1:hover {
  background-color: var(--sc-blue-hover) !important;
}

footer .columns-wrapper {
  display: flex;
  justify-content: space-around;
}

footer .section-block {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

footer .section-block .section-title {
  font-size: 22px;
  font-weight: 700;
}

footer .section-block p, footer .section-block .faq-links a {
  font-size: 16px;
  text-decoration: none;
  color: var(--sc-white);
  margin: 0;
}

footer .section-block .faq-links {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

footer .section-block .faq-links a {
  text-decoration: none;
  line-height: 1.2;
  position: relative;
}

footer .section-block .faq-links a::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    z-index: 1;
    width: 0;
    height: 1px;
    background-color: currentColor;
    translate: -50% 2px;
    transition: all 0.3s ease-in-out;
}

footer .section-block .faq-links a:hover::before {
    width: 100%;
}

footer .section-block .button-wrapper {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

footer .section-block .button-wrapper .sc-arrow-button {
  width: 100%;
  max-width: 190px;
}

footer .section-block .footer-socials {
    display: flex;
    justify-content: start;
    flex-direction: row;
    gap: 8px;
}

footer .section-block .footer-socials a {
    width: fit-content;
    display: block;
    height: auto;
    width: 40px;
    aspect-ratio: 1;
    border-radius: 50%;
    background-color: var(--sc-grey-dark);
    background-size: 35%;
    background-repeat: no-repeat;
    background-position: center;
    transition: background-color 0.2s ease-in-out;
}

footer .section-block .footer-socials a:hover {
    text-decoration: none;
    background-color: rgba(58,58,58, .6);
}

footer .bottom-footer-content {
  display: flex;
  justify-content: space-between;
}

footer .bottom-footer-content * {
  font-size: 16px;
  text-decoration: none;
  color: #5B5B5B;
  margin: 0;
  transition: color .2s ease-in-out;
}

footer .bottom-footer-content .footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 80px;
}

footer .bottom-footer-content .footer-links a {
  position: relative;
}

footer .bottom-footer-content .footer-links a:hover {
  color: var(--sc-white);
}

@media screen and (max-width: 1200px) {
  
  .pk-page .pk-menu .menu {
    gap: 24px;
  }
  
  .pk-page header .pk-menu-item.menu-button a {
    margin-left: 24px;
  }
  
  .pk-page header .header-logo img {
    max-width: 200px;
  }
  
}


@media screen and (max-width: 992px) {
  
  .pk-page header .pk-menu .hamburger {
      position: relative;
      background: none;
      width: 32px;
      padding: 4px;
      border: none;
  }
  
  .pk-page header .pk-menu .hamburger span {
      background-color: var(--sc-white) !important;
  }
  
  .pk-page header .pk-menu-item.menu-button {
    width: 100%;
    margin-top: auto;
  }
  
  .pk-page header .pk-menu-item.menu-button a {
    text-align: center;
    margin-left: unset;
  }
  
  .pk-page .swiper-scrollbar {
    margin-top: 60px !important;
  }
    
  /* FOOTER */
  
  footer > .pk-row {
      padding-block: 60px;
  }
  
  footer > .pk-row .pk-row-content {
      row-gap: 60px;
  }
  
  footer .newsletter-col .newsletter-wrapper {
    max-width: unset;
  }
  
  footer .columns-wrapper {
    justify-content: space-between;
  }
  
  footer .bottom-footer-content .footer-links {
    gap: 24px;
  }
  
}

@media screen and (max-width: 767px) {
  
  .pk-row {
    padding-block: 20px !important;
  }

  .flex-layout {
    padding-block: 20px !important;
  }
  
  .pk-button-group {
    width: 100%;
  }
  
  [data-text-double] {
      left: 50%;
      transform: translateX(-50%);
  }
  
  .pk-button, .sc_primary_button, .sc_secondary_button {
    width: 100%;
    text-align: center;
    padding: 16px 20px;
    font-size: 16px !important;
  }
  
  .sc-arrow-button {
    max-width: unset !important;
  }
  
  .pk-page .swiper-scrollbar {
    margin-top: 40px !important;
  }
  
  /* FOOTER */
  
  footer > .pk-row {
      padding-block: 40px;
  }
  
  footer > .pk-row .pk-row-content {
      row-gap: 40px;
  }

  footer .columns-wrapper {
    flex-direction: column;
    justify-content: start;
    gap: 24px;
  }
  
  footer .bottom-footer-content {
    flex-direction: column;
    gap: 16px;
  }
  
  footer .section-block .section-title {
    font-size: 18px;
  }
  
  footer .newsletter-col .newsletter-wrapper .gform_wrapper .gform_fields input[type="text"] {
    font-size: 14px;
  }
  
  footer .newsletter-col .newsletter-wrapper .gform_wrapper input[type=submit]#gform_submit_button_1 {
    font-size: 16px;
    padding: 8px 24px;
  }
  
  footer .bottom-footer-content .footer-links {
    flex-direction: column;
    gap: 16px;
  }
  
}