/* Root-level breakpoint variable */
:root {
  --breakpoint-mobile: 1024px;
}

html,
body {
  margin: 0;
  padding: 0;
  min-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
  max-width: 100vw;
}
* {
  box-sizing: border-box;
  font-family: "Inter", sans-serif;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
html {
  color: var(--wp--preset--color--neutral-dark);
}

html.smooth-scroll {
  scroll-behavior: smooth;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

input,
button,
textarea,
select {
  font: inherit;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}

#root,
#__next {
  isolation: isolate;
}

/* general theme layout */
body {
  z-index: 0;

  & .wp-site-blocks {
    min-height: 100vh;
    max-width: 100vw;
    display: flex;
    flex-direction: column;
    position: relative;
    z-index: 0;

    & > header.wp-block-template-part,
    & > .wp-block-template-part:has(.header) {
      z-index: 50;
      position: sticky;
      top: calc(0px + var(--wp-admin--admin-bar--height, 0px));
    }

    & > main {
      flex: 1;
    }

    & > footer {
      margin-top: auto;
      padding-top: 40px;

      @media (min-width: 1024px) {
        padding-top: 64px;
      }
    }
  }

  &.admin-bar .wp-site-blocks {
    min-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
  }

  /* reset default margin */
  & :where(.wp-site-blocks) > *,
  & :where(.is-layout-flow) > * {
    margin-block-start: 0 !important;
  }
}

/* Responsive heading styles */
h1 {
  font-size: 56px;
  line-height: 120%;
  font-weight: 400;
  color: var(--wp--preset--color--cannon-pink-darker);
}
@media (max-width: 1024px) {
  h1 {
    font-size: 40px;
  }
}

h2 {
  font-size: 48px;
  line-height: 120%;
  font-weight: 400;
  color: var(--wp--preset--color--cannon-pink-darker);
}
@media (max-width: 1024px) {
  h2 {
    font-size: 36px;
  }
}

h3 {
  font-size: 40px;
  line-height: 120%;
  font-weight: 400;
  color: var(--wp--preset--color--cannon-pink-darker);
}
@media (max-width: 1024px) {
  h3 {
    font-size: 32px;
  }
}

h4 {
  font-size: 32px;
  line-height: 140%;
  font-weight: 400;
  color: var(--wp--preset--color--cannon-pink-darker);
}
@media (max-width: 1024px) {
  h4 {
    font-size: 20px;
  }
}

h5 {
  font-size: 24px;
  line-height: 140%;
  font-weight: 400;
  color: var(--wp--preset--color--cannon-pink-darker);
}
@media (max-width: 1024px) {
  h5 {
    font-size: 18px;
  }
}

h6 {
  font-size: 20px;
  line-height: 140%;
  font-weight: 400;
  color: var(--wp--preset--color--cannon-pink-darker);
}
@media (max-width: 1024px) {
  h6 {
    font-size: 16px;
  }
}

/* Utility weight classes */
.has-font-weight-700 {
  font-weight: 700;
}
.has-font-weight-600 {
  font-weight: 600;
}
.has-font-weight-500 {
  font-weight: 500;
}
.has-font-weight-400 {
  font-weight: 400;
}

/* Color scheme classes */
.scheme-cannon {
  color: var(--wp--preset--color--neutral-darkest);
  background-color: var(--wp--preset--color--neutral-white);
  border-color: var(--wp--preset--color--neutral-darkest);
}
.scheme-cannon a {
  color: var(--wp--preset--color--cannon-pink);
}

.scheme-cannon-inverse {
  color: var(--wp--preset--color--neutral-darkest);
  background-color: var(--wp--preset--color--cannon-pink-lighter);
  border-color: var(--wp--preset--color--neutral-darkest);
}
.scheme-cannon-inverse a {
  color: var(--wp--preset--color--cannon-pink);
}

.scheme-science {
  color: var(--wp--preset--color--neutral-darkest);
  background-color: var(--wp--preset--color--tan-lightest);
  border-color: var(--wp--preset--color--neutral-darkest);
}
.scheme-science a {
  color: var(--wp--preset--color--cannon-pink);
}

/* Base styles for all text controls */
input:not([type="checkbox"]),
textarea,
select {
  font-family: inherit;
  line-height: 1.5;
  color: var(--wp--preset--color--neutral-darkest);
  border: 1px solid var(--wp--preset--color--neutral-light);
  border-radius: var(--wp--custom--border-radius--sm--value);
  background: var(--wp--preset--color--neutral-white);
  transition: border-color 0.2s ease;
}

/* Input fields */
input:not([type="checkbox"]) {
  display: flex;
  width: 560px;
  padding: var(--wp--custom--border-radius--sm--value) 12px; /* 4px 12px */
  align-items: center;
  gap: 8px;
}

/* Textareas */
textarea {
  display: flex;
  width: 560px;
  height: 180px;
  padding: 12px;
  align-items: flex-start;
  flex-shrink: 0;
}

/* Select dropdowns */
select {
  display: flex;
  width: 560px;
  padding: 8px 12px;
  align-items: center;
  gap: 16px;
}

/* Checkbox + label wrapper */
.checkbox-field {
  display: flex;
  width: 156px;
  align-items: center;
  gap: 8px;
}

/* Checkbox itself uses accent-color for the tick */
.checkbox-field input[type="checkbox"] {
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: var(--wp--preset--color--cannon-pink);
}

/* header */
header {
  border-bottom: 1px solid var(--wp--preset--color--tan, #c8af7b);
  background: var(--wp--preset--color--white, #fff);

  & .header__content {
    padding: 22px 12px 8px 22px;

    @media (min-width: 1024px) {
      max-width: 1640px;
      margin-left: auto !important;
      margin-right: auto !important;
      padding: 22px 32px 12px 32px;
    }
  }

  & .headeder__go-to-home-img {
    display: none;
    @media (min-width: 1024px) {
      display: block;
    }

    & img {
      padding-top: 5px;
    }
  }
}

.no-scroll-on-mobile {
  @media (max-width: 1023px) {
    overflow: hidden;
  }
}

.no-x-scroll-on-desktop {
  @media (min-width: 1024px) {
    overflow-x: hidden;
  }
}

a {
  color: var(--wp--preset--color--cannon-pink-dark, #7b3e67);
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: none;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}

a:hover {
  color: var(--wp--preset--color--cannon-pink, #b95f8d);
  text-decoration-color: var(--wp--preset--color--cannon-pink, #b95f8d);
}

p {
  color: var(--wp--preset--color--neutral-dark, #4c4c4c);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;

  @media (min-width: 1024px) {
    font-size: 18px;
  }
}

.footer__group {
  background: var(--wp--preset--color--cannon-pink-lightest, #f4edf2);
  padding: 48px 20px 60px 20px;

  @media (min-width: 1024px) {
    padding: 80px 20px 80px 20px;
  }

  & .footer__top-part {
    width: 100%;

    & .footer__contact-information {
      width: 100%;
      padding-top: 60px;
      padding-bottom: 48px;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 40px;

      @media (min-width: 1024px) {
        & > div {
          width: 48%;
        }
      }

      & .footer__contact-block {
        & h4 {
          font-size: 24px;
          font-style: normal;
          font-weight: 400;
          line-height: 130%; /* 31.2px */
          letter-spacing: -0.24px;
        }
      }
    }
  }

  & .footer__bottom-part {
    padding-top: 24px;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column-reverse;
    align-items: start;
    gap: 32px;

    @media (min-width: 1024px) {
      padding-top: 32px;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
    }

    & .footer__linklist {
      display: flex;
      flex-direction: column;
      gap: 16px;
      align-items: start;

      @media (min-width: 1024px) {
        flex-direction: row;
        gap: 24px;
        align-items: center;
      }
    }
  }
}

/* Team member card */
.team-member {
  width: 100%;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  gap: 24px;

  & .team-member__image {
    overflow: hidden;
    border-radius: 8px;
    width: 100%;
    & img {
      width: 100%;
      height: auto;
      object-fit: cover;
    }
  }

  & .team-member__content {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
}

/* END: Team member card */

/* TWO COLUMN IMAGE TEXT BLOCK */
.two-col-pic-text {
  display: flex;
  flex-direction: column;
  gap: 56px;
  align-items: center;

  @media (min-width: 1024px) {
    flex-direction: row;
    gap: 40px;
    flex-wrap: nowrap;
  }
  @media (min-width: 1280px) {
    gap: 80px;
  }

  & .two-col-pic-text__text-block {
    width: 100%;
    max-width: 560px;

    @media (max-width: 1023px) {
      order: -1;
    }

    @media (min-width: 1024px) {
      max-width: 50%;
    }
  }
  & .two-col-pic-text__image-block {
    width: 100%;
    height: 335px;
    max-width: 560px;

    @media (min-width: 1024px) {
      max-width: 50%;
      height: 500px;
    }

    & img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
}
/* END: TWO COLUMN IMAGE TEXT BLOCK */

/* COOP PARTNERS GRID */
.coop-partners-grid {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 24px;

  @media (min-width: 768px) {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}

.coop-partner-card {
  width: 100%;
  @media (min-width: 768px) {
    max-width: 560px;
    grid-column: unset !important;
    grid-row: unset !important;
  }

  & figure {
    width: 100%;
    & img {
      width: 100%;
      height: auto;
      object-fit: cover;
    }
  }

  & .coop-partner-card__links {
    gap: 16px;

    a[href^="tel:"] {
      text-decoration: none;
      position: relative;
      padding-left: 32px;

      &::before {
        content: "";
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 24px;
        height: 25px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath d='M17.7073 12.6868C17.6145 12.5938 17.5043 12.5201 17.383 12.4698C17.2617 12.4195 17.1317 12.3936 17.0003 12.3936C16.869 12.3936 16.739 12.4195 16.6176 12.4698C16.4963 12.5201 16.3861 12.5938 16.2933 12.6868L14.6993 14.2808C13.9603 14.0608 12.5813 13.5608 11.7073 12.6868C10.8333 11.8128 10.3333 10.4338 10.1133 9.69476L11.7073 8.10076C11.8003 8.00797 11.874 7.89776 11.9243 7.77645C11.9746 7.65513 12.0005 7.52509 12.0005 7.39376C12.0005 7.26242 11.9746 7.13238 11.9243 7.01106C11.874 6.88975 11.8003 6.77954 11.7073 6.68676L7.70733 2.68676C7.61455 2.59381 7.50434 2.52007 7.38303 2.46976C7.26171 2.41945 7.13167 2.39355 7.00033 2.39355C6.869 2.39355 6.73896 2.41945 6.61764 2.46976C6.49633 2.52007 6.38612 2.59381 6.29333 2.68676L3.58133 5.39876C3.20133 5.77876 2.98733 6.30076 2.99533 6.83376C3.01833 8.25776 3.39533 13.2038 7.29333 17.1018C11.1913 20.9998 16.1373 21.3758 17.5623 21.3998H17.5903C18.1183 21.3998 18.6173 21.1918 18.9953 20.8138L21.7073 18.1018C21.8003 18.009 21.874 17.8988 21.9243 17.7774C21.9746 17.6561 22.0005 17.5261 22.0005 17.3948C22.0005 17.2634 21.9746 17.1334 21.9243 17.0121C21.874 16.8907 21.8003 16.7805 21.7073 16.6878L17.7073 12.6868ZM17.5803 19.3988C16.3323 19.3778 12.0623 19.0428 8.70733 15.6868C5.34133 12.3208 5.01533 8.03576 4.99533 6.81276L7.00033 4.80776L9.58633 7.39376L8.29333 8.68676C8.1758 8.80421 8.08938 8.94909 8.04189 9.10832C7.9944 9.26755 7.98733 9.43611 8.02133 9.59876C8.04533 9.71376 8.63233 12.4408 10.2923 14.1008C11.9523 15.7608 14.6793 16.3478 14.7943 16.3718C14.9569 16.4067 15.1256 16.4002 15.285 16.3529C15.4444 16.3055 15.5893 16.2188 15.7063 16.1008L17.0003 14.8078L19.5863 17.3938L17.5803 19.3988Z' fill='%23036BC2'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
      }
    }

    a:not([href^="tel:"]):not([href^="mailto:"]) {
      position: relative;
      padding-left: 32px;

      &::before {
        content: "";
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 24px;
        height: 25px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath d='M13 3.39355L16.293 6.68655L9.29303 13.6866L10.707 15.1006L17.707 8.10055L21 11.3936V3.39355H13Z' fill='%23036BC2'/%3E%3Cpath d='M19 19.3936H5V5.39355H12L10 3.39355H5C3.897 3.39355 3 4.29055 3 5.39355V19.3936C3 20.4966 3.897 21.3936 5 21.3936H19C20.103 21.3936 21 20.4966 21 19.3936V14.3936L19 12.3936V19.3936Z' fill='%23036BC2'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
      }
    }
  }
}
/* END: COOP PARTNERS GRID */


.contact-columns {
  & .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
   margin-left: 0 !important;
   margin-right: 0 !important;
  }
}