/* stylelint-disable selector-list-comma-newline-after */

/*
 * Copyright 2020 Adobe. All rights reserved.
 * This file is licensed to you under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License. You may obtain a copy
 * of the License at http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software distributed under
 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
 * OF ANY KIND, either express or implied. See the License for the specific language
 * governing permissions and limitations under the License.
 */

@font-face {
  font-family: "fontawesome Fallback";
  font-style: normal;
  font-weight: 400;
  src: local("Arial");
  ascent-override: 93.75%;
  descent-override: 6.25%;
  /* stylelint-disable-next-line number-no-trailing-zeros */
  line-gap-override: 0.00%;
  /* stylelint-disable-next-line number-no-trailing-zeros */
  size-adjust: 100.00%;
}

:root {
  /* BASE COLORS */

  /* Primary colors */
  --primary-black: #000;
  --primary-white: #fff;
  --primary-gold: #b3976b;

  /* Secondary colors */
  --secondary-graphite: #1d1d1d;
  --secondary-steel: #a7abaf;
  --secondary-silver: #dfdfdf;
  --secondary-dark-gold: #87754e;

  /* Tertiary colors */
  --tertiary-cool-gray: #555;
  --tertiary-light-cool-gray: #e9eaec;
  --tertiary-warm-gray: #eeece7;
  --tertiary-light-warm-gray: #f7f6f3;

  /* Accent colors */
  --primary-accent-red: #cd1a0a;
  --secondary-accent-copper: #8f654d;

  /* Applied colors */
  --background-color: var(--primary-white);
  --text-color: var(--primary-black);
  --link-color: var(--primary-accent-red);
  --link-hover-color: var(--primary-black);
  --header-color: var(--primary-white);
  --header-background-color: var(--primary-black);
  --overlay-background-color: var(--secondary-silver);

  /* BUTTONS */

  /* Primary */
  --button-primary-red-enabled: var(--primary-accent-red);
  --button-primary-red-hover: #e11d0b;
  --button-primary-red-pressed: #b91709;
  --button-primary-red-disabled: #e1dfdd;

  /* Secondary */
  --button-secondary-gold-enabled: var(--secondary-accent-copper);
  --button-secondary-gold-hover: #d9b781;
  --button-secondary-gold-pressed: #a18860;
  --button-secondary-gold-disabled: #e1dfdd;

  /* Tertiary */
  --button-tertiary-white-enabled: var(--primary-white);
  --button-tertiary-white-hover: #a7a8a9;
  --button-tertiary-white-pressed: #e1dfdd;
  --button-tertiary-white-disabled: var(--primary-white);

  /* NEW fonts */

  /* Headline */
  --headline-ff-medium: "GT America Extended Medium", var(--fallback-ff-headlines);
  --headline-ff-medium-italic: "GT America Extended Medium Italic", var(--fallback-ff-headlines);

  /* Body */
  --body-ff: "Helvetica Neue LT Pro 55 Roman", var(--fallback-ff-texts);

  /* Subheadings, Emphasis & Legal Copy */
  --subheadings-ff-roman: var(--body-ff), var(--fallback-ff-texts);
  --subheadings-ff-medium: "Helvetica Neue LT Pro 65 Medium", var(--fallback-ff-texts);
  --legal-ff: var(--body-ff), var(--fallback-ff-texts);
  --emphasis-ff-bold: "Helvetica Neue LT Pro 75 Bold", var(--fallback-ff-texts);
  --emphasis-ff-heavy: "Helvetica Neue 85 Heavy", var(--fallback-ff-texts);
  --emphasis-ff-roman-italic: "Helvetica Neue LT Pro 56 Roman Italic", var(--fallback-ff-texts);
  --emphasis-ff-medium-italic: "Helvetica Neue LT Pro 66 Medium Italic", var(--fallback-ff-texts);
  --emphasis-ff-bold-italic: "Helvetica Neue LT Pro 76 Bold Italic", var(--fallback-ff-texts);

  /* Accent elements */
  --accents-ff-regular: "GT America Mono Regular", var(--fallback-ff-accents);
  --accents-ff-medium: "GT America Mono Medium", var(--fallback-ff-accents);
  --accents-ff-bold: "GT America Mono Bold", var(--fallback-ff-accents);
  --accents-ff-regular-italic: "GT America Mono Regular Italic", var(--fallback-ff-accents);
  --accents-ff-medium-italic: "GT America Mono Medium Italic", var(--fallback-ff-accents);
  --accents-ff-bold-italic: "GT America Mono Bold Italic", var(--fallback-ff-accents);

  /* Alternate fonts */
  --fallback-ff-texts: "Arial Regular Text Fallback", helvetica, sans-serif;
  --fallback-ff-headlines: "Arial Bold Headline Fallback", helvetica, sans-serif;
  --fallback-ff-accents: "Arial Regular Text Fallback", helvetica, sans-serif;

  /* Fontawesome */
  --ff-fontawesome: "fontawesome", "fontawesome Fallback";

  /* Body font sizes */
  --body-font-size-xxl: 2.4rem; /* 24px */
  --body-font-size-xl: 2.2rem; /* 22px */
  --body-font-size-l: 2rem; /* 20px */
  --body-font-size-m: 1.8rem; /* 18px */
  --body-font-size-s: 1.6rem; /* 16px */
  --body-font-size-xs: 1.4rem; /* 14px */
  --body-font-size-xxs: 1.3rem; /* 13px */

  /* Body font sizes DESKTOP */
  --body-desktop-font-size-1: var(--body-font-size-s); /* 16px */
  --body-desktop-font-size-2: var(--body-font-size-xxs); /* 13px */

  /* Body font sizes MOBILE */
  --body-mobile-font-size-1: var(--body-font-size-s); /* 16px */
  --body-mobile-font-size-2: var(--body-font-size-xxs); /* 13px */

  /* Accents font sizes DESKTOP */
  --accent-desktop-font-size-1: var(--body-font-size-m); /* 18px */
  --accent-desktop-font-size-2: var(--body-font-size-xs); /* 14px */

  /* Accents font sizes MOBILE */
  --accent-mobile-font-size-1: var(--body-font-size-m); /* 18px */
  --accent-mobile-font-size-2: var(--body-font-size-xs); /* 14px */

  /* Label font sizes DESKTOP */
  --label-desktop-font-size: var(--body-font-size-xs); /* 14px */

  /* Label font sizes MOBILE */
  --label-mobile-font-size: var(--body-font-size-xs); /* 14px */

  /* Button font sizes DESKTOP */
  --button-desktop-font-size: var(--body-font-size-xs); /* 14px */

  /* Button font sizes MOBILE */
  --button-mobile-font-size: var(--body-font-size-xs); /* 14px */

  /* Heading font sizes */
  --heading-font-size-scale: 0.5;
  --heading-font-size-xxl: calc(10rem * var(--heading-font-size-scale)); /* 50px */
  --heading-font-size-xl: calc(8rem * var(--heading-font-size-scale)); /* 40px */
  --heading-font-size-l: calc(6.4rem * var(--heading-font-size-scale)); /* 32px */
  --heading-font-size-ml: calc(6rem * var(--heading-font-size-scale)); /* 30px */
  --heading-font-size-m: calc(4rem * var(--heading-font-size-scale)); /* 20px */
  --heading-font-size-s: calc(3.6rem * var(--heading-font-size-scale)); /* 18px */
  --heading-font-size-xs: calc(3.2rem * var(--heading-font-size-scale)); /* 16px */
  --heading-font-size-xxs: calc(2rem * var(--heading-font-size-scale));  /* 10px */

  /* Heading font sizes DESKTOP */
  --heading-desktop-font-size-scale: 0.5;
  --heading-1-desktop-size-xl: calc(9rem * var(--heading-font-size-scale)); /* 45px */
  --heading-2-desktop-size-l: calc(6.4rem * var(--heading-font-size-scale)); /* 32px */
  --heading-3-desktop-size-m: calc(6.4rem * var(--heading-font-size-scale)); /* 32px */
  --heading-4-desktop-size-s: calc(4.8rem * var(--heading-font-size-scale)); /* 24px */
  --heading-5-desktop-size-xs: calc(3.6rem * var(--heading-font-size-scale)); /* 18px */

  /* Heading font sizes MOBILE */
  --heading-mobile-font-size-scale: 0.5;
  --heading-1-mobile-size-xl: calc(6.4rem * var(--heading-font-size-scale)); /* 32px */
  --heading-2-mobile-size-l: calc(5.6rem * var(--heading-font-size-scale)); /* 28px */
  --heading-3-mobile-size-m: calc(5.2rem * var(--heading-font-size-scale)); /* 26px */
  --heading-4-mobile-size-s: calc(4.8rem * var(--heading-font-size-scale)); /* 24px */
  --heading-5-mobile-size-xs: calc(3.6rem * var(--heading-font-size-scale)); /* 18px */

  /* nav sizes */
  --nav-height-m: 60px;
  --nav-height-l: 85px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-size: 10px;
}

body {
  font-size: var(--body-font-size-m);
  margin: 0;
  font-family: var(--body-ff);
  line-height: 1.6;
  color: var(--text-color);
  background-color: var(--background-color);
  display: none;
}

body.appear {
  display: unset;
}

header {
  width: 100%;
  background-color: var(--header-background-color);
  color: var(--header-color);
  position: sticky;
  top: 0;
  z-index: 3;
  min-height: var(--nav-height-m);
}

@media (min-width: 1140px) {
  header {
    min-height: var(--nav-height-l);
  }
}

h1, h2, h3,
h4, h5, h6 {
  font-family: var(--headline-ff-medium);
  font-weight: 600;
  line-height: 1.25;
  margin-top: 1em;
  margin-bottom: 0.5em;
  scroll-margin: calc(var(--nav-height-m) + 1em);
}

h1, h2 {
  font-family: var(--headline-ff-medium);
}

h1 { font-size: var(--heading-font-size-xxl); }
h2 { font-size: var(--heading-font-size-xl); }
h3 { font-size: var(--heading-font-size-l); }
h4 { font-size: var(--heading-font-size-m); }
h5 { font-size: var(--heading-font-size-s); }
h6 { font-size: var(--heading-font-size-xs); }

p, dl, ol, ul, pre, blockquote {
  margin-top: 1em;
  margin-bottom: 1em;
}

a:any-link {
  color: var(--link-color);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
  color: var(--link-hover-color);
}

code, pre, samp {
  font-family: var(--accents-ff-medium);
  font-size: var(--body-font-size-s);
}

code, samp {
  padding: 0.125em;
}

pre {
  overflow: scroll;
}

/* buttons */

a.button:any-link, button {
  font-family: var(--body-ff);
  display: inline-block;
  box-sizing: border-box;
  text-decoration: none;
  border: 2px solid transparent;
  padding: 5px 30px;
  text-align: center;
  font-style: normal;
  font-weight: 600;
  cursor: pointer;
  color: var(--background-color);
  background-color: var(--link-color);
  margin: 16px 0;
  overflow: hidden;
  transition: all 500ms;
}

a.button:hover, a.button:focus, button:hover, button:focus {
  background-color: var(--link-hover-color);
  cursor: pointer;
}

button:disabled, button:disabled:hover {
  background-color: var(--overlay-background-color);
  cursor: unset;
}

a.button.secondary, button.secondary {
  background-color: unset;
  border: 2px solid currentcolor;
  color: var(--text-color);
}

a.button.secondary:hover, button.secondary:hover,
a.button.secondary:focus, button.secondary:focus {
  background-color: var(--button-secondary-gold-pressed);
  color: #fff;
  border-color: var(--button-secondary-gold-hover);
}

ul.button-container {
  padding: 0;
  list-style: none;
}

a.button.arrowed, button.arrowed {
  border: none;
  padding: 0;
  background-color: transparent;
  color: inherit;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
}

a.button.arrowed:hover, button.arrowed:hover,
a.button.arrowed:focus, button.arrowed:focus {
  color: #5d5d5d;
}

main input {
  font-size: 1.25rem;
  width: 100%;
  max-width: 50rem;
  display: block;
  margin-bottom: 1rem;
  padding: 0.75rem 0.6rem;
  border-radius: 0.25rem;
  box-sizing: border-box;
  border: 1px solid var(--text-color);
  color: var(--text-color);
  background-color: var(--background-color);
}

main input:hover {
  border: 1px solid var(--text-color);
}

main .section {
  padding: 64px 16px;
}

main .section:empty {
  display: none;
}

main .section.background {
  position: relative;
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: center;
}

main .section.background-top {
  background-position: top;
}

main .section.text-black {
  color: var(--primary-black);
}

main .section.text-white {
  color: var(--primary-white);
}

main .section.text-white,
main .section.black-background {
  background-color: var(--primary-black);
}

main .section.dark-background {
  background-color: var(--secondary-graphite);
}

main .section.center {
  text-align: center;
}

main .section.flex-center > div {
  display: flex;
  justify-content: center;
}

main .section.gap > div {
  gap: 3rem;
}

/* top line over section or block */
main .section.title-line > div > :is(h2, h3, h4) {
  border-block-start: 3px solid var(--primary-black);
  padding-block-start: 1rem;
}

main .section.no-first-line.title-line > div:first-child > :is(h2, h3, h4) {
  border-block-start: none;
  padding-block-start: 0;
}

main .block.line-separator {
  border-block-start: 3px solid var(--primary-black);
  padding-block-start: 5rem;
}

/* less padding in sections */
main .section.padding-0 {
  padding: 0 16px;
}

main .section.padding-16 {
  padding: 16px;
}

main .section.padding-32 {
  padding: 32px 16px;
}

@media (min-width: 600px) {
  main .section.padding-0 {
    padding: 0 32px;
  }

  main .section.padding-16 {
    padding: 16px 32px;
  }

  main .section.padding-32 {
    padding: 32px;
  }
}

main pre {
  background-color: var(--overlay-background-color);
  padding: 1em;
  border-radius: 0.25em;
  overflow-x: auto;
  white-space: pre;
}

main blockquote {
  font-style: italic;
  margin: 3rem;
  text-indent: -1rem;
  hanging-punctuation: first;
}

main blockquote p::before {
  content: "“";
  line-height: 0;
}

main blockquote p::after {
  content: "”";
  line-height: 0;
}

hr {
  margin-top: 1.5em;
  margin-bottom: 1.5em;
  border: 0;
  border-bottom: 1px solid var(--overlay-background-color);
}

main img {
  max-width: 100%;
  width: auto;
  height: auto;
}

@media (min-width: 600px) {
  main .section {
    padding: 64px 32px;
  }
}

@media (min-width: 900px) {
  .section > div {
    max-width: 1200px;
    margin: auto;
  }

  main .section.background {
    background-size: cover;
    min-height: 100vh;
  }
}

/* progressive section appearance */
main .section[data-section-status="loading"],
main .section[data-section-status="initialized"] {
  display: none;
}

main .section.highlight {
  background-color: var(--highlight-background-color);
}

body.disable-scroll,
body.disable-scroll main {
  overflow: hidden;
}

.low-resolution-banner {
  margin-bottom: 20px;
}

.low-resolution-banner-cookie-settings {
  background: transparent;
  padding: 0;
  margin: 0;
  text-decoration: underline;
  font-size: 16px;
  font-weight: 400;
}

.low-resolution-banner-cookie-settings:hover,
.low-resolution-banner-cookie-settings:active {
  background-color: transparent;
}

.link-with-video {
  position: relative;
  display: inline-flex;
}

.link-with-video::after {
  content: "";
  top: 0;
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, rgb(255 255 255 / 0%) 0, #000 100%);
  opacity: 0;
  transition: all 0.5s ease-in-out;
}

.link-with-video:hover::after {
  opacity: 0.5;
}

.video-icon-wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 20px;
  width: 60px;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  color: white;
  background: #474747;
  z-index: 1;
  transition: all 0.5s ease-in-out;
}

@media (min-width: 480px) {
  .video-icon-wrapper {
    width: 90px;
    height: 90px;
    font-size: 30px;
  }
}

@media (min-width: 768px) {
  .video-icon-wrapper {
    width: 120px;
    height: 120px;
    font-size: 50px;
  }
}

.link-with-video:hover .video-icon-wrapper {
  transform: translate(-50%, -50%) scale(0.95);
  background: #7a7a7a;
}

/* background classes */
.bg-white-paper {
  background: url("../../media/bg-explore.webp");
  background-size: cover;
}

/* Magazine listing default content metadata style */
main .section.magazine-listing-content {
  padding: 0 16px;
}

main .section.magazine-listing-content p {
  font-family: var(--subheadings-ff-medium);
  font-size: var(--body-font-size-xs);
}

main .section.magazine-listing-content p:first-of-type {
  margin: 0 0 15px;
}

main .section.magazine-listing-content h3 {
  font-family: var(--emphasis-ff-bold);
  font-size: var(--heading-font-size-s);
  background-color: var(--primary-black);
  color: var(--primary-white);
  width: 100%;
  line-height: 38px;
  padding: 5px 0 0 5px;
  margin: 0 0 13px;
}

main sup {
  font-size: clamp(var(--body-font-size-xxs), 12px, 1em);
}

@media (min-width: 768px) {
  main .section.magazine-listing-content {
    max-width: calc(960px + 16px + 16px);
    padding-top: 50px;
    margin: 0 auto;
  }

  main .section.magazine-listing-content h3 {
    font-size: var(--heading-font-size-ml);
    margin: 0 0 17px;
  }

  main .section.magazine-listing-content p {
    font-size: var(--body-font-size-s);
  }

  main .section.magazine-listing-content p:first-of-type {
    margin: 0 0 22px;
  }
}

/* Theme icon button for contact-us page */
.icon-button .default-content-wrapper ul {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.icon-button ul .icon svg {
  width: 150px;
  height: 40px;
}

@media (min-width: 480px) {
  .icon-button .default-content-wrapper ul {
    flex-direction: row;
    justify-content: center;
  }
}

/* Section medatada styling */
main .section.font-xxl {
  font-size: var(--body-font-size-xxl);
}

main .section.font-xl {
  font-size: var(--body-font-size-xl);
}

main .section.font-l {
  font-size: var(--body-font-size-l);
}

main .section.font-m {
  font-size: var(--body-font-size-m);
}

main .section.font-s {
  font-size: var(--body-font-size-s);
}

main .section.font-xs {
  font-size: var(--body-font-size-xs);
}

main .section.font-xxs {
  font-size: var(--body-font-size-xxs);
}

main .section.bg-paper {
  background: url("../media/bg-paper.webp");
}

main .section.section-width {
  max-width: 960px;
  margin: 0 auto;
}

/* quick fix to align #community title with the cards below */
.section.bg-white-paper.cards-container > .default-content-wrapper > h2 {
  text-align: center;
}

@media (min-width: 669px) {
  .section.bg-white-paper.cards-container > .default-content-wrapper > h2 {
    margin-inline: auto;
    max-width: 590px;
    text-align: start;
  }
}

@media (min-width: 989px) {
  .section.bg-white-paper.cards-container > .default-content-wrapper > h2 {
    margin-inline: auto;
    max-width: 910px;
  }
}

main .section.helvetica-55 {
  font-family: var(--subheadings-ff-roman);
}

main .section.helvetica-65 {
  font-family: var(--subheadings-ff-medium);
}

main .section.helvetica-75 {
  font-family: var(--emphasis-ff-bold);
}

main .section.helvetica-56 {
  font-family: var(--emphasis-ff-roman-italic);
}

main .section.helvetica-66 {
  font-family: var(--emphasis-ff-medium-italic);
}

main .section.helvetica-76 {
  font-family: var(--emphasis-ff-bold-italic);
}

main .section.responsive-title h1 {
  font-family: var(--emphasis-ff-heavy);
  font-size: var(--heading-2-mobile-size-l);
}

@media (min-width: 768px) {
  main .section.responsive-title h1 {
    font-size: var(--heading-font-size-xxl);
  }
}