/*
 * Funderground master.css
 * Network-wide design baseline loaded after the active theme CSS.
 */

@font-face {
  font-display: swap;
  font-family: "Nunito";
  font-style: normal;
  font-weight: 400 700;
  src: url("./fonts/nunito-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-display: swap;
  font-family: "Nunito";
  font-style: normal;
  font-weight: 400 700;
  src: url("./fonts/nunito-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-display: swap;
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  src: url("./fonts/poppins-400-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-display: swap;
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  src: url("./fonts/poppins-400-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-display: swap;
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  src: url("./fonts/poppins-500-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-display: swap;
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  src: url("./fonts/poppins-500-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-display: swap;
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  src: url("./fonts/poppins-600-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-display: swap;
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  src: url("./fonts/poppins-600-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-display: swap;
  font-family: "Poppins";
  font-style: normal;
  font-weight: 700;
  src: url("./fonts/poppins-700-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-display: swap;
  font-family: "Poppins";
  font-style: normal;
  font-weight: 700;
  src: url("./fonts/poppins-700-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --fg-font-body: "Nunito", sans-serif;
  --fg-font-heading: "Poppins", sans-serif;
  --fg-section-spacing-y: clamp(3rem, 6vw, 6rem);
  --fg-container-max-width: 1180px;
  --fg-content-gap: 1.5rem;
  --fg-border-radius: 0;
  --fg-button-border-radius: 0;
  --fg-color-accent: #D6DF23;
  --fg-color-blue: #1B589B;
  --fg-color-dark: #0D0D0D;
  --fg-color-surface-dark: #151515;
  --fg-color-white: #fff;

  --bs-body-font-family: var(--fg-font-body);
  --bs-border-radius: var(--fg-border-radius);
  --bs-border-radius-sm: var(--fg-border-radius);
  --bs-border-radius-lg: var(--fg-border-radius);
  --bs-border-radius-xl: var(--fg-border-radius);
}

body {
  font-family: var(--fg-font-body);
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: var(--fg-font-heading) !important;
}

:where(main section, .site-main section, .entry-content > section, .fg-section) {
  padding-block: var(--fg-section-spacing-y);
}

:where(.container, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl) {
  max-width: min(100% - 2rem, var(--fg-container-max-width));
}

:where(.row) {
  row-gap: var(--fg-content-gap);
}

:where(.card, .modal-content, .dropdown-menu, .form-control, .form-select) {
  border-radius: var(--fg-border-radius);
}

:where(.btn) {
  border-radius: var(--fg-button-border-radius);
}

:where(.btn, button, input[type="button"], input[type="submit"]) {
  font-family: var(--fg-font-body);
}

.fg-breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--fg-color-white);
  font-size: clamp(15px, 1.4vw, 18px);
  font-weight: 400;
  line-height: 1.2;
}

.fg-breadcrumb a {
  color: var(--fg-color-white);
  text-decoration: none;
}

.fg-breadcrumb a:hover {
  color: var(--fg-color-accent);
}

.fg-breadcrumb .current-item,
.fg-breadcrumb span {
  color: var(--fg-color-white);
}

.fg-breadcrumb > span:first-child a,
.fg-breadcrumb > a:first-child {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: 17px;
  height: 17px;
  margin-right: 3px;
  font-size: 0;
}

.fg-breadcrumb > span:first-child a::before,
.fg-breadcrumb > a:first-child::before {
  content: "";
  display: block;
  width: 15px;
  height: 15px;
  background-color: var(--fg-color-accent);
  mask: url("data:image/svg+xml,%3Csvg width='14' height='13' viewBox='0 0 14 13' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.969 2.2 1.998 6.226v4.128c0 .147.054.275.164.382.109.108.239.162.389.162h3.319V7.636h2.213v3.262h3.319c.15 0 .28-.054.389-.162.11-.107.165-.235.165-.382V6.277c0-.023-.003-.04-.009-.051L6.969 2.2Z'/%3E%3Cpath d='M13.841 5.309 11.948 3.763V.297c0-.079-.026-.144-.078-.195-.052-.051-.118-.076-.199-.076h-1.66c-.08 0-.147.025-.199.076-.051.051-.077.116-.077.195v1.657L7.626.221C7.441.074 7.222 0 6.969 0c-.254 0-.473.074-.657.221L.096 5.309c-.057.045-.089.106-.095.182-.005.077.015.144.061.2l.536.629c.046.051.106.082.181.093.07.006.139-.014.208-.059l5.982-4.902 5.981 4.902c.046.039.107.059.182.059h.026c.075-.011.135-.043.181-.093l.536-.629c.046-.057.067-.123.061-.2-.006-.076-.038-.137-.095-.182Z'/%3E%3C/svg%3E") center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg width='14' height='13' viewBox='0 0 14 13' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.969 2.2 1.998 6.226v4.128c0 .147.054.275.164.382.109.108.239.162.389.162h3.319V7.636h2.213v3.262h3.319c.15 0 .28-.054.389-.162.11-.107.165-.235.165-.382V6.277c0-.023-.003-.04-.009-.051L6.969 2.2Z'/%3E%3Cpath d='M13.841 5.309 11.948 3.763V.297c0-.079-.026-.144-.078-.195-.052-.051-.118-.076-.199-.076h-1.66c-.08 0-.147.025-.199.076-.051.051-.077.116-.077.195v1.657L7.626.221C7.441.074 7.222 0 6.969 0c-.254 0-.473.074-.657.221L.096 5.309c-.057.045-.089.106-.095.182-.005.077.015.144.061.2l.536.629c.046.051.106.082.181.093.07.006.139-.014.208-.059l5.982-4.902 5.981 4.902c.046.039.107.059.182.059h.026c.075-.011.135-.043.181-.093l.536-.629c.046-.057.067-.123.061-.2-.006-.076-.038-.137-.095-.182Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.fg-breadcrumb-separator {
  color: var(--fg-color-white);
  font-size: .9em;
  margin: 0 1px;
}

.wp-image-11 {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 50%;
  transform: translate(-50%, -50%);
}

.masked-image {
  display: block;
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  mask-image: url("/wp-content/themes/picostrap5-child-base/images/brille.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: cover;
  -webkit-mask-image: url("/wp-content/themes/picostrap5-child-base/images/brille.svg");
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: cover;
}

.masked-image img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

.box {
  position: relative;
}

.box .tile-link {
  z-index: 10;
}

.lasertag-modes {
  position: relative;
  overflow: hidden;
}

.lasertag-modes::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 15% 20%, rgba(214, 223, 35, .16), transparent 28%),
    radial-gradient(circle at 85% 70%, rgba(27, 88, 155, .35), transparent 30%);
  pointer-events: none;
}

.lasertag-modes .container-xl {
  position: relative;
  z-index: 2;
}

.mode-card {
  padding: 34px 28px;
  text-align: center;
  background: var(--fg-color-surface-dark);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 22px;
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.mode-card:hover {
  transform: translateY(-6px);
  border-color: var(--fg-color-accent);
  box-shadow: 0 20px 45px rgba(0, 0, 0, .35);
}

.mode-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 92px;
  height: 92px;
  margin: 0 auto 24px;
  background: var(--fg-color-accent);
  border-radius: 50%;
  box-shadow: 0 0 0 8px rgba(214, 223, 35, .12);
}

.mode-icon svg {
  width: 48px;
  height: 48px;
  fill: var(--fg-color-dark);
}

.mode-card h3 {
  margin-bottom: 14px;
  color: var(--fg-color-white);
  font-size: 22px;
  font-weight: 800;
}

.mode-card p {
  margin-bottom: 0;
  color: rgba(255, 255, 255, .78);
  font-size: 16px;
  line-height: 1.6;
}

.mode-note {
  padding: 22px 28px;
  color: rgba(255, 255, 255, .85);
  background: rgba(255, 255, 255, .06);
  border-left: 4px solid var(--fg-color-accent);
}

.video-frame {
  padding: 18px;
  overflow: hidden;
  background: var(--fg-color-white);
  border-radius: 28px;
}

.video-frame iframe {
  border-radius: 18px;
}

.video-cta-box {
  margin-top: 18px !important;
}

@media (max-width: 767px) {
  .fg-breadcrumb {
    gap: 4px;
    font-size: 14px;
  }

  .fg-breadcrumb > span:first-child a,
  .fg-breadcrumb > a:first-child {
    width: 15px;
    height: 15px;
  }

  .fg-breadcrumb > span:first-child a::before,
  .fg-breadcrumb > a:first-child::before {
    width: 13px;
    height: 13px;
  }

  .mode-card {
    padding: 28px 22px;
  }

  .mode-icon {
    width: 78px;
    height: 78px;
  }

  .mode-icon svg {
    width: 40px;
    height: 40px;
  }

  .video-frame {
    padding: 8px;
    border-radius: 16px;
  }

  .video-frame iframe {
    border-radius: 10px;
  }
}
