@import url("https://fonts.googleapis.com/css2?family=Work+Sans:wght@300;400;700&display=swap");

/*
Theme Name: Greenpeace Planet 4 Australia Pacific Theme
Theme URI: https://github.com/greenpeace/planet4-child-theme-australiapacific
Description: Planet 4 child theme for Australia Pacific
Author: Greenpeace Australia Pacific
Author URI: https://github.com/greenpeace
Template: planet4-master-theme
Version: 0.0.1
License: GNU General Public License v3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: light, accessibility-ready
Text Domain: planet4-child-theme-australiapacific
*/

/*!
Import Custom Styling
*/

:root {
  --font-family-secondary: "Work Sans";
  --font-family-tertiary: "Work Sans";
  --font-family-button: "Work Sans";
  --footer-menu--li--font-size: 15px;
  --button--line-height: 1.3em;
  --button--padding: 0.75rem 2rem;
}

/* GPAP typography style overides */

h1 {
  text-transform: uppercase;
}

h3,
h3 a,
h3 a:active,
h3 a:visited,
h3 a:hover,
h4,
h4 a,
h4 a:active,
h4 a:visited,
h4 a:hover,
h5,
h5 a,
h5 a:active,
h5 a:visited,
h5 a:hover,
h6,
h6 a,
h6 a:active,
h6 a:visited,
h6 a:hover {
  font-family: var(--font-family-secondary), sans-serif;
}

@media (min-width: 1600px) {
  .container:not(.narrow-container),
  .container-lg:not(.narrow-container),
  .container-md:not(.narrow-container),
  .container-sm:not(.narrow-container),
  .container-xl:not(.narrow-container),
  .container-xxl:not(.narrow-container) {
    max-width: 1600px;
  }
}

.has-small-font-size {
  line-height: var(--line-height-s--font-family-tertiary);
}

/* SEE: planet4/plugins/planet4-plugin-gutenberg-blocks/assets/src/styles/blocks/core-overrides/Image.scss */

.wp-block-image.is-style-rounded-180 img {
  max-width: 180px;
}

.wp-block-image.is-style-rounded-90 img {
  max-width: 90px;
}

.large-excerpt, .large-excerpt * {
  -webkit-line-clamp: 10 !important;
}

@media (max-width: 992px) {
  .wp-block-columns {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

nav * {
  font-family: var(--font-family-primary);
  text-transform: uppercase;
}

@media (min-width: 768px) {
  .footer-cta {
    margin-bottom: -100px !important;
    padding-bottom: 180px !important;
  }
}

@media (min-width: 992px) {
  header .site-logo {
    margin-left: -webkit-calc((100vw - var(--mw)) / 2 + 12px);
    margin-left: calc((100vw - var(--mw)) / 2 + 12px);
  }
}

@media (max-width: 1600px) {
  header .site-logo {
    --mw: 1140px;
  }
}

@media (min-width: 1600px) {
  header .site-logo {
    --mw: 1600px;
  }
}

@media (max-width: 1200px) {
  header .site-logo {
    --mw: 960px;
  }
}

mark[style="background-color:rgba(0, 0, 0, 0)"] {
  padding: 0 !important;
}

.home:not(.scrolled) .top-navigation .icon {
  fill: white;
}

.with-mobile-tabs ~ :not(.page-header) + .page-content {
  padding-top: 0;
}

.om-holder.om-holder {
  z-index: 99;
}

/* Styling for list card thumbnails */

.gpap-list-card-thumbnail {
  -webkit-box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.16);
          box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.16);
  padding: 1rem;
}

.top-navigation {
  font-family: var(--font-family-secondary), sans-serif;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.top-navigation .nav-menu > ul {
  gap: 1rem;
}

@media (min-width: 1200px) {
  .top-navigation .nav-search-form {
    min-width: 20%;
  }
}

.top-navigation #nav-mobile {
  display: none;
}

/* ## Header customisations:
   1. The white top navbar is transparent to start,
      and transitions to white background only on-scroll.
   2. The logo is slightly bigger to start, then goes small on scroll.
*/

.home .page-content {
  padding-top: 0; /* scoot the hero image up under the now-transparent menu */
}

.home .top-navigation {
  -webkit-transition: background-color 0.5s ease;
  transition: background-color 0.5s ease;
}

.home:not(.scrolled) .top-navigation {
  -webkit-box-shadow: none;
          box-shadow: none; /* drop default shadow because it'll look odd with transparent nav menu bar */
  --color-background-navigation_bar: transparent; /* override P4 default: var(--white); */
}

.home:not(.scrolled) .top-navigation .nav-menu {
  --color-text-nav_link: var(
    --wp--preset--color--white
  ); /* override P4 default: var(--grey-900); */
}

.home:not(.scrolled) .top-navigation .nav-submenu {
  --submenu-nav-link--color: var(--grey-900);
  --submenu-nav-link--hover--color: var(--submenu-nav-link--color);
}

@media (min-width: 1200px) {
  .home:not(.scrolled) .top-navigation #search_form #search_input::-webkit-input-placeholder {
    color: var(--wp--preset--color--white);
  }
  .home:not(.scrolled) .top-navigation #search_form #search_input::-moz-placeholder {
    color: var(--wp--preset--color--white);
  }
  .home:not(.scrolled) .top-navigation #search_form #search_input:-ms-input-placeholder {
    color: var(--wp--preset--color--white);
  }
  .home:not(.scrolled) .top-navigation #search_form #search_input::-ms-input-placeholder {
    color: var(--wp--preset--color--white);
  }
  .home:not(.scrolled) .top-navigation #search_form #search_input,
  .home:not(.scrolled) .top-navigation #search_form #search_input::placeholder {
    color: var(--wp--preset--color--white);
  }
}

.home:not(.scrolled) .top-navigation #search_form button .icon {
  fill: var(--wp--preset--color--white);
}

.home .site-logo img {
  -webkit-transition: height 0.4s;
  transition: height 0.4s;
  /* bump height to get big logo (bumped up by fraction of golden ratio) */
  height: 34.03439px;
}

body.scrolled.home .site-logo img {
  height: 26px; /* default P4 value */
}

.nav-search-toggle {
  --top-navigation--search-toggle--background: var(--grey-800);
}

#footer {
  background-repeat-x: no-repeat;
  background-repeat-y: repeat;
  background-size: cover;
  background-position: top center;
  padding-top: 5rem;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

@media (min-width: 768px) {
  #footer {
    background-image: url(img/footer-bg.svg);
    background-color: transparent;
  }
}

@media (min-width: 1200px) {
  #footer {
    -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
  }
}

#footer h3 {
  font-size: 1rem;
  text-align: left;
  color: var(--wp--preset--color--white);
  font-weight: bold;
}

#footer p {
  font-size: 0.875rem;
  line-height: 1.4;
  text-align: left;
  margin-bottom: 0;
}

#footer .company-message {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 1rem;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}

#footer .company-message .primary-message,
#footer .company-message .secondary-message {
  -webkit-flex-basis: 50%;
      -ms-flex-preferred-size: 50%;
          flex-basis: 50%;
  margin-bottom: 1rem;
  max-width: 600px;
}

@media (min-width: 1200px) {
  #footer .footer-menu,
  #footer .primary-message {
    min-width: 350px;
    max-width: 500px;
  }
}

#footer .content-row {
  gap: 2rem;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

#footer #footer-logo {
  text-align: left;
  margin-bottom: 2.5rem;
}

#footer #footer-logo img {
  max-width: 160px;
}

#footer .footer-info .address,
#footer .footer-info .info {
  margin-bottom: 2rem;
}

#footer .copyright .container {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#footer .copyright span:not(:last-of-type):after {
  display: none !important;
}

@media (min-width: 768px) {
  .home .articles-block .article-list-section {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 1rem;
  }

  .home .articles-block .article-list-section .article-list-item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-top: 0;
  }
}

.wp-block-media-text .wp-block-media-text__content {
  padding: 0;
}

#comments {
  margin-top: 50px;
}

/** This file brings over the adhoc styles from the dev site */

.carousel-caption h2 {
  text-transform: uppercase;
}

.block {
  margin-bottom: 0;
  margin-top: 0;
}

#footer.footer {
  margin-top: 0px !important;
}

.wp-element-caption {
  position: relative;
  padding-left: 27px;
  text-align: left !important;
  font-weight: bold;
}

.wp-element-caption:before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
}

.wp-element-caption:before {
  width: 4px;
  height: 13px;
  background: #000;
}

blockquote,
blockquote > p {
  max-width: 100% !important;
}

/* Social Block Styles */

a.wp-block-social-link-anchor::after {
  display: none;
}

.wp-block-social-links.is-style-logos-only .wp-social-link svg {
  height: 1.7em;
  width: 1.7em;
}

/* New Styles */

.column-padding {
  padding: 20px;
}

/* Featured Images in article blocks */

.featured-image-rounded-180 img {
  border-radius: 50%;
  width: 180px;
  height: 180px;
}

.full-excerpt .posts-list-query .wp-block-post-excerpt__excerpt {
  -webkit-line-clamp: 10 !important;
}