/*
Theme Name: Frey Child
Theme URI: https://skygravity.eu/
Description: Site-specific customizations for the Frey parent theme.
Author: SkyGravity
Template: frey
Version: 1.1.6
Text Domain: frey-child
*/

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("assets/fonts/inter/InterVariable.woff2") format("woff2");
}

@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url("assets/fonts/inter/InterVariable-Italic.woff2") format("woff2");
}

html {
  font-family: "Inter", Arial, sans-serif;
  font-optical-sizing: auto;
}

/* Keep all first-level headings aligned with the theme's primary color. */
h1 {
  color: var(--skygravity-primary-color) !important;
  font-size: 28px !important;
}

.skygravity-map {
  display: block;
  height: 500px;
  width: 100%;
  max-width: none;
  margin-right: auto;
  margin-left: auto;
  position: relative;
  z-index: 0;
  isolation: isolate;
}

/* Reserve the real header height on internal pages instead of offsetting content rows. */
body.page-header-behind:not(.home) #page-header {
  height: 100px;
}

@media (max-width: 1199px) {
  body.page-header-behind:not(.home) #page-header {
    height: 72px;
  }
}

/*
 * Contact Form 7 5.x applies submission states to the form element. Frey's
 * bundled styles target the response element classes used by older CF7
 * versions, leaving white response text on the page's white background.
 */
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
  background-color: #f0ad4e;
  color: #fff;
}

.wpcf7 form.sent .wpcf7-response-output {
  background-color: #5cb85c;
  color: #fff;
}

.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
  background-color: #d9534f;
  color: #fff;
}

.wpcf7 form.spam .wpcf7-response-output {
  background-color: #f0ad4e;
  color: #fff;
}

/* Preserve the legacy decorative heading treatment on localized homepage H1s. */
.o_sky > h1.heading {
  font-weight: 400;
  letter-spacing: -0.05em !important;
}

/* Let the following spacer fully control the mission-to-button distance. */
.skygravity-mission-copy p:last-child {
  margin-bottom: 0;
}

/* Compact, text-only introduction on localized AeroYoga homepages. */
.skygravity-home-intro {
  box-sizing: border-box;
  width: min(780px, calc(100% - 40px));
  margin: 0 auto;
  padding: 72px 0 48px;
  text-align: center;
}

.skygravity-home-intro h1 {
  color: var(--skygravity-primary-color, #cc7298) !important;
  font-size: 28px !important;
  font-weight: 400;
  margin: 0 0 28px;
}

.skygravity-home-intro p {
  margin: 0 0 16px;
}

.skygravity-home-intro p:last-child {
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .o_sky > h1.heading,
  .skygravity-mission-copy,
  .skygravity-mission-copy + .tm-spacer + .tm-button-wrapper {
    text-align: center !important;
  }

  .skygravity-mission-copy {
    margin-right: auto !important;
    margin-left: auto !important;
  }

  .skygravity-home-intro {
    width: min(calc(100% - 32px), 780px);
    padding: 48px 0 32px;
  }
}

/* The single-post sidebar widget should show article titles without dates. */
.single-post .tm-posts-widget .post-date {
  display: none;
}

/* Self-hosted Font Awesome subset: language indicator spacing. */
.skygravity-language-icon {
  margin-right: 0.45em;
}

/* Keep SmartMenus behavior but use the self-hosted SVG as the only indicator. */
.desktop-menu #page-navigation .toggle-sub-menu {
  display: inline-flex;
  align-items: center;
  margin-left: 0.45em;
  vertical-align: middle;
  font-size: 0.75em;
}

.desktop-menu #page-navigation .toggle-sub-menu .fa-angle-left {
  --fa-rotate-angle: 270deg;
}

.desktop-menu #page-navigation .sub-menu .toggle-sub-menu {
  position: absolute;
  top: 50%;
  right: 18px;
  margin-left: 0;
  transform: translateY(-50%);
}

.desktop-menu #page-navigation .sub-menu .toggle-sub-menu .fa-angle-left,
.page-mobile-main-menu .toggle-sub-menu .fa-angle-left {
  --fa-rotate-angle: 180deg;
}

.page-mobile-main-menu li.opened > a .toggle-sub-menu .fa-angle-left {
  --fa-rotate-angle: 270deg;
}

.page-mobile-main-menu .toggle-sub-menu .fa-angle-left {
  transition: transform 0.3s ease;
}

/* Keep metro gallery images inside the square tiles calculated by Frey's grid. */
.tm-gallery.style-metro .gallery-item {
  overflow: hidden;
}

.tm-gallery.style-metro .gallery-item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}