:root {
    --pi-yellow: #FBEF67;
    --pi-pink: #ff83db;
    --pi-green: #97cd64;
    --pi-orange: orange;
    --pi-dk-gray: #1a1a1a;
    --pi-white: #ffffff;
    --pi-black: #000000;

    --pi-sans: "Noto Sans", sans-serif;
}

/*
.noto-sans-<uniquifier> {
  font-family: "Noto Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}
*/

body.placei-theme,
.placei-theme a,
.placei-theme p,
.placei-theme ul,
.placei-theme li,
.placei-theme h1,
.placei-theme h2,
.placei-theme h3,
.placei-theme h4,
.placei-theme h5,
.placei-theme h6,
.placei-theme li.menu-item a {
    font-family: var(--pi-sans);
}

/*------------------------------
ACCESSIBILITY
------------------------------*/
.pi-screen-reader-text {
    word-wrap: normal !important;
    border: 0;
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-break: normal !important;
}

/*------------------------------
PARENT / SYSTEMS OVERRIDES
------------------------------*/

.placei-theme input[type=text]:focus,
.placei-theme input[type=email]:focus,
.placei-theme input[type=url]:focus,
.placei-theme input[type=password]:focus,
.placei-theme input[type=search]:focus,
.placei-theme input[type=number]:focus,
.placei-theme input[type=tel]:focus,
.placei-theme input[type=date]:focus,
.placei-theme input[type=month]:focus,
.placei-theme input[type=week]:focus,
.placei-theme input[type=time]:focus,
.placei-theme input[type=datetime]:focus,
.placei-theme input[type=datetime-local]:focus,
.placei-theme input[type=color]:focus, .site textarea:focus,
.placei-theme button {
    outline: none ! important;
}

/*------------------------------
HEADER - MAIN / TOP
------------------------------*/

#placei_hdr {
    width:100%;
    height: clamp(101px, calc(100vw * 0.099), 181px);
    background-color:var(--pi-black);
}
#placei_hdr .placei-container {
    display:flex;
    flex-direction:row;
    align-items:center;
    width: clamp(1024px, 100vw, 1830px);
    height:100%;
    column-gap: clamp(17px, 1.6vw, 30px);
    padding-right: clamp(22px, 2vw, 37px);
    margin:0 auto;
}
/* Logos */
#placei_hdr #placei_logo_icon {
    height:100%;
    background-color: var(--pi-yellow);
}
#placei_hdr #placei_logo_icon img {
    width:100%;
    height:100%;
}
#placei_hdr #placei_logo_text {
    width: clamp(317px, 31vw, 567px);
    display:flex;
    justify-content:center;
    align-items:center;
}
#placei_hdr #placei_logo_text img {
    width:100%;
    height:auto;
}
/* Nav Container */
#placei_nav_container {
    display:flex;
    flex-direction:column;
    flex-grow:1;
    align-items:flex-end;
    height: 100%;
    justify-content: space-between;
    padding-top: clamp(17.9px, 1.7vw, 32px);
    padding-bottom: clamp(17.9px, 1.7vw, 32px);
}
#placei_nc_top,
#placei_nc_bottom {
    display:flex;
    flex-direction:row;
    justify-content:flex-end;
    width:100%;
    column-gap: clamp(9px, 0.87vw, 16px);
}
#placei_nc_bottom {
    align-items:center;
}
#placei_main_menu {
    color:white;
}
ul#pi-main-menu-list {
    display:flex;
    flex-direction:row;
    list-style:none;
    column-gap: clamp(23px, 2.2vw, 41px);
}
ul#pi-main-menu-list li a {
    color:white;
    font-size: clamp(12px, 1.19vw, 22px);
    text-transform:uppercase;
    text-decoration:none;
    font-weight:bold;
}

/* socials */
.social-placei img {
    width:100%;
}
#placei_nc_top .social-placei {
    background-color: var(--pi-yellow);
    border-radius: 100%;
    width: clamp(23.5px, 2.3vw, 43px); /* 42px */
    height: clamp(23.5px, 2.3vw, 43px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: clamp(3.9px, 0.38vw, 7px);
}
#placei_nc_top .social-placei:last-child {
    margin-right: clamp(6px, 0.6vw, 11px);
}

/*------------------------------
MAIN MENU - SEARCH
------------------------------*/

/* site-search-toggle-wrapper */
.placei-search-toggle-wrapper {
    height: auto;
    width: clamp(30px, 2.9vw, 53px); /* width: clamp(29px, 2.8vw, 52px); */
    padding:0;
    margin:0;
}
.placei-search-toggle-wrapper button,
.placei-search-toggle-wrapper button img {
    height: auto;
    width:100%;
    background-color:transparent ! important;
    padding:0;
    margin:0;
    border:0;
}
#placei_search_form {
    display: flex;
    position: absolute;
    right: clamp(59px, 5.7vw, 105px);
    top: clamp(77px, 7.5vw, 137px);
}
#placei_search_form .search-submit {
    width: clamp(30px, 2.9vw, 53px); /* width: clamp(29px, 2.8vw, 52px); */
}
#placei_search_form label {
    display:none;
}
#placei_search_form input[type=search] {
    line-height:1;
    padding: clamp(2.8px, 0.3vw, 5px);
    margin-top:0;
    margin-right:0;
    height: clamp(31px, 3vw, 55px);
    font-size: clamp(12px, 1.16vw, 22px);
    width: clamp(205px, 20vw, 366px);
}

/*------------------------------
PAGE
------------------------------*/

.placei-theme #page {
    min-height: clamp(calc(100vh - 101px), calc(100vh - calc(100vw * 0.099)), calc(100vh - 181px));
    display:flex;
    flex-direction:column;
    background-color:var(--pi-white);
}
/* temporary paragraph styling */
.placei-theme .wp-block-paragraph {
    width: 90%;
    max-width:90%;
    min-width:90%;
    margin: 20px auto;
}

/*------------------------------
FOOTER
------------------------------*/

#placei_ftr {
    width:100%;
    background-color: var(--pi-dk-gray);
    display:flex;
    flex-direction:column;
    justify-content: center;
    align-items: center;
    padding-top: clamp(59px, 5.8vw, 106px);
    padding-bottom: clamp(32px, 3vw, 57px);
    color: var(--pi-white);
}
#placei_ftr .placei-container {
    width: clamp(912px, 89vw, 1630px);
    display:flex;
    flex-direction:row;
    column-gap: clamp(53px, 5vw, 94px);
    justify-content: space-between;
    margin:0 auto;
}
.placei-ftr-contact {
    width: clamp(218px, 21vw, 391px);
}
.placei-ftr-social {
    width: clamp(106px, 10vw, 190px);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    flex-wrap: wrap;
    align-content: center;
}
.placei-ftr-menu {
    width: clamp(208px, 20vw, 372px);
}
.placei-ftr-brand {
    width: clamp(218px, 21vw, 391px);
}
.placei-ftr-brand img {
    width:100%;
}
.pi-footer-heading {
    color: var(--pi-white);
    font-size: clamp(15px, 1.5vw, 32px); /* 32px isn't correct in terms of percentages; but it is the font size in Miro */
    font-weight:bold;
    margin-bottom: clamp(22px, 2.2vw, 40px);
}
.pi-footer-address {
    font-size: clamp(15px, 1.5vw, 32px); /* 32px isn't correct in terms of percentages; but it is the font size in Miro */
}
.pi-footer-sub-heading,
.placei-ftr-menu {
    padding-top: clamp(3.7px, 0.36vw, 6.5px)
}
.pi-footer-sub-heading {
    color: var(--pi-white);
    font-weight:bold;
    font-size: clamp(13px, 1.3vw, 30px);
    margin-bottom: clamp(26px, 2.56vw, 47px);
}
.placei-ftr-social .pi-footer-sub-heading {
    text-align:center;
}
.placei-ftr-social,
.placei-ftr-menu,
.placei-ftr-brand {
    font-size: clamp(13px, 1.3vw, 30px);
}
.pi-footer-socials {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 2 equal-width columns */
  grid-template-rows: clamp(38px, 3.7vw, 68px) clamp(38px, 3.7vw, 68px); /* 2 rows */
  width:100%;
  row-gap: clamp(27px, 2.6vw, 48px);
}
.pi-footer-socials a:nth-child(odd) {
  justify-self: start;
  text-align: left;
}
.pi-footer-socials a:nth-child(even) {
  justify-self: end;
  text-align: right;
}
.pi-footer-socials .social-placei {
    background-color: var(--pi-yellow);
    border-radius: 100%;
    width: clamp(39px, 3.9vw, 70px);
    height: clamp(39px, 3.9vw, 70px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: clamp(6px, 0.6vw, 11px);
}
/* footer menu */
#placei_footer_menu {
    color:white;
}
ul#pi-footer-menu-list {
    display:flex;
    flex-direction:column;
    list-style:none;
    row-gap: clamp(26px, 2.56vw, 47px);
    justify-content: flex-start;
    align-items: center;
}
ul#pi-footer-menu-list li a {
    color:white;
    font-size: clamp(13px, 1.3vw, 30px);
    text-transform:uppercase;
    text-decoration:none;
    font-weight:bold;
    text-align:center;
}


/*------------------------------
BUTTONS
------------------------------*/

a.button-placei {
    color:var(--pi-black);
    text-transform: uppercase;
    font-size: clamp(11px, 1.1vw, 20px);
    font-weight:bold;
    border-radius: clamp(22px, 2.1vw, 38px);
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    height: clamp(23.5px, 2.3vw, 43px);
    text-decoration:none;
}
a.button-placei-yellow-sm {
    background-color: var(--pi-yellow);
}
a.button-placei-pink-sm {
    background-color: var(--pi-pink);
}
a.button-placei-pink-sm.placei-donate,
a.button-placei-yellow-sm.placei-subscribe {
    width: clamp(86.7px, 8.6vw, 155px);
}

