/*
Theme Name: Twenty Twenty-One Child
Theme URI: https://wordpress.org/themes/twentytwentyone/
Author: Vladimir Obuchov
Author URI: obuchov.com
Version: 1.0.11
Template: twentytwentyone
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyone-child

Tags: one-column, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready
*/
/* Variables */
:root {
  /* Font Family */
  --global--font-primary: var(--font-headings, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif);
  --global--font-secondary: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif);
  /* Font Size */
  --global--font-size-base: 1.25rem;
  --global--font-size-xs: 1rem;
  --global--font-size-sm: 1.125rem;
  --global--font-size-md: 1.25rem;
  --global--font-size-lg: 1.5rem;
  --global--font-size-xl: 2.25rem;
  --global--font-size-xxl: 4rem;
  --global--font-size-xxxl: 5rem;
  --global--font-size-page-title: var(--global--font-size-xxl);
  --global--letter-spacing: normal;
  /* Line Height */
  --global--line-height-body: 1.7;
  --global--line-height-heading: 1.3;
  --global--line-height-page-title: 1.1;
  /* Headings */
  --heading--font-family: var(--global--font-primary);
  --heading--font-size-h6: var(--global--font-size-xs);
  --heading--font-size-h5: var(--global--font-size-sm);
  --heading--font-size-h4: var(--global--font-size-lg);
  --heading--font-size-h3: calc(1.25 * var(--global--font-size-lg));
  --heading--font-size-h2: var(--global--font-size-xl);
  --heading--font-size-h1: var(--global--font-size-page-title);
  --heading--letter-spacing-h6: 0.05em;
  --heading--letter-spacing-h5: 0.05em;
  --heading--letter-spacing-h4: var(--global--letter-spacing);
  --heading--letter-spacing-h3: var(--global--letter-spacing);
  --heading--letter-spacing-h2: var(--global--letter-spacing);
  --heading--letter-spacing-h1: var(--global--letter-spacing);
  --heading--line-height-h6: var(--global--line-height-heading);
  --heading--line-height-h5: var(--global--line-height-heading);
  --heading--line-height-h4: var(--global--line-height-heading);
  --heading--line-height-h3: var(--global--line-height-heading);
  --heading--line-height-h2: var(--global--line-height-heading);
  --heading--line-height-h1: var(--global--line-height-page-title);
  --heading--font-weight: normal;
  --heading--font-weight-page-title: 300;
  --heading--font-weight-strong: 600;
  /* Block: Latest posts */
  --latest-posts--title-font-family: var(--heading--font-family);
  --latest-posts--title-font-size: var(--heading--font-size-h3);
  --latest-posts--description-font-family: var(--global--font-secondary);
  --latest-posts--description-font-size: var(--global--font-size-sm);
  --list--font-family: var(--global--font-secondary);
  --definition-term--font-family: var(--global--font-primary);
  /* Colors */
  --global--color-black: #000;
  --global--color-dark-gray: #28303d;
  --global--color-gray: #39414d;
  --global--color-light-gray: #f0f0f0;
  --global--color-green: #d1e4dd;
  --global--color-blue: #d1dfe4;
  --global--color-purple: #d1d1e4;
  --global--color-red: #e4d1d1;
  --global--color-orange: #e4dad1;
  --global--color-yellow: #eeeadd;
  --global--color-white: #fff;
  --global--color-white-50: rgba(255, 255, 255, 0.5);
  --global--color-white-90: rgba(255, 255, 255, 0.9);
  --global--color-primary: var(--global--color-dark-gray);
  /* Body text color, site title, footer text color. */
  --global--color-secondary: var(--global--color-gray);
  /* Headings */
  --global--color-primary-hover: var(--global--color-primary);
  --global--color-background: var(--global--color-green);
  /* Mint, default body background */
  --global--color-border: var(--global--color-primary);
  /* Used for borders (separators) */
  /* Spacing */
  --global--spacing-unit: 20px;
  --global--spacing-measure: unset;
  --global--spacing-horizontal: 30px;
  --global--spacing-vertical: 30px;
  /* Elevation */
  --global--elevation: 1px 1px 3px 0 rgba(0, 0, 0, 0.2);
  /* Forms */
  --form--font-family: var(--global--font-secondary);
  --form--font-size: var(--global--font-size-sm);
  --form--line-height: var(--global--line-height-body);
  --form--color-text: var(--global--color-dark-gray);
  --form--color-ranged: var(--global--color-secondary);
  --form--label-weight: 500;
  --form--border-color: var(--global--color-secondary);
  --form--border-width: 3px;
  --form--border-radius: 0;
  --form--spacing-unit: calc(0.5 * var(--global--spacing-unit));
  /* Cover block */
  --cover--height: calc(15 * var(--global--spacing-vertical));
  --cover--color-foreground: var(--global--color-white);
  --cover--color-background: var(--global--color-black);
  /* Buttons */
  --button--color-text: var(--global--color-background);
  --button--color-text-hover: var(--global--color-secondary);
  --button--color-text-active: var(--global--color-secondary);
  --button--color-background: var(--global--color-secondary);
  --button--color-background-active: var(--global--color-background);
  --button--font-family: var(--global--font-primary);
  --button--font-size: var(--global--font-size-base);
  --button--font-weight: 500;
  --button--line-height: 1.5;
  --button--border-width: 3px;
  --button--border-radius: 0;
  --button--padding-vertical: 15px;
  --button--padding-horizontal: calc(2 * var(--button--padding-vertical));
  /* entry */
  --entry-header--color: var(--global--color-primary);
  --entry-header--color-link: currentColor;
  --entry-header--color-hover: var(--global--color-primary-hover);
  --entry-header--color-focus: var(--global--color-secondary);
  --entry-header--font-size: var(--heading--font-size-h2);
  --entry-content--font-family: var(--global--font-secondary);
  --entry-author-bio--font-family: var(--heading--font-family);
  --entry-author-bio--font-size: var(--heading--font-size-h4);
  /* Header */
  --branding--color-text: var(--global--color-primary);
  --branding--color-link: var(--global--color-primary);
  --branding--color-link-hover: var(--global--color-secondary);
  --branding--title--font-family: var(--global--font-primary);
  --branding--title--font-size: var(--global--font-size-lg);
  --branding--title--font-size-mobile: var(--heading--font-size-h4);
  --branding--title--font-weight: normal;
  --branding--title--text-transform: uppercase;
  --branding--description--font-family: var(--global--font-secondary);
  --branding--description--font-size: var(--global--font-size-sm);
  --branding--description--font-family: var(--global--font-secondary);
  --branding--logo--max-width: 300px;
  --branding--logo--max-height: 100px;
  --branding--logo--max-width-mobile: 96px;
  --branding--logo--max-height-mobile: 96px;
  /* Main navigation */
  --primary-nav--font-family: var(--global--font-secondary);
  --primary-nav--font-family-mobile: var(--global--font-primary);
  --primary-nav--font-size: var(--global--font-size-md);
  --primary-nav--font-size-sub-menu: var(--global--font-size-xs);
  --primary-nav--font-size-mobile: var(--global--font-size-sm);
  --primary-nav--font-size-sub-menu-mobile: var(--global--font-size-sm);
  --primary-nav--font-size-button: var(--global--font-size-xs);
  --primary-nav--font-style: normal;
  --primary-nav--font-style-sub-menu-mobile: normal;
  --primary-nav--font-weight: 200;
  --primary-nav--font-weight-button: 300;
  --primary-nav--color-link: var(--global--color-primary);
  --primary-nav--color-link-hover: var(--global--color-primary-hover);
  --primary-nav--color-text: var(--global--color-primary);
  --primary-nav--padding: calc(0.66 * var(--global--spacing-unit));
  --primary-nav--border-color: var(--global--color-primary);
  /* Pagination */
  --pagination--color-text: var(--global--color-primary);
  --pagination--color-link-hover: var(--global--color-primary-hover);
  --pagination--font-family: var(--global--font-secondary);
  --pagination--font-size: var(--global--font-size-lg);
  --pagination--font-weight: normal;
  --pagination--font-weight-strong: 600;
  /* Footer */
  --footer--color-text: var(--global--color-primary);
  --footer--color-link: var(--global--color-primary);
  --footer--color-link-hover: var(--global--color-primary-hover);
  --footer--font-family: var(--global--font-primary);
  --footer--font-size: var(--global--font-size-sm);
  /* Block: Pull quote */
  --pullquote--font-family: var(--global--font-primary);
  --pullquote--font-size: var(--heading--font-size-h3);
  --pullquote--font-style: normal;
  --pullquote--letter-spacing: var(--heading--letter-spacing-h4);
  --pullquote--line-height: var(--global--line-height-heading);
  --pullquote--border-width: 3px;
  --pullquote--border-color: var(--global--color-primary);
  --pullquote--color-foreground: var(--global--color-primary);
  --pullquote--color-background: var(--global--color-background);
  --quote--font-family: var(--global--font-secondary);
  --quote--font-size: var(--global--font-size-md);
  --quote--font-size-large: var(--global--font-size-xl);
  --quote--font-style: normal;
  --quote--font-weight: 700;
  --quote--font-weight-strong: bolder;
  --quote--font-style-large: normal;
  --quote--font-style-cite: normal;
  --quote--line-height: var(--global--line-height-body);
  --quote--line-height-large: 1.35;
  --separator--border-color: var(--global--color-border);
  --separator--height: 1px;
  /* Block: Table */
  --table--stripes-border-color: var(--global--color-light-gray);
  --table--stripes-background-color: var(--global--color-light-gray);
  --table--has-background-text-color: var(--global--color-dark-gray);
  /* Widgets */
  --widget--line-height-list: 1.9;
  --widget--line-height-title: 1.4;
  --widget--font-weight-title: 700;
  --widget--spacing-menu: calc(0.66 * var(--global--spacing-unit));
  /* Admin-bar height */
  --global--admin-bar--height: 0;
  --responsive--spacing-horizontal: calc(2 * var(--global--spacing-horizontal));
}

.singular .entry-header {
  border-bottom: 1px solid var(--global--color-border);
  padding-bottom: calc(1.5 * var(--global--spacing-vertical));
  margin-bottom: calc(2 * var(--global--spacing-vertical));
}

body {
  font-size: var(--global--font-size-base);
  font-weight: 200;
  color: var(--global--color-primary);
  text-align: left;
  background-color: var(--global--color-background);
}

ul li {
  line-height: var(--global--spacing-vertical);
}

.ref-link {
  font-size: 50%;
  color: lightblue;
}

.vp-portfolio__item-img-wrap {
  box-shadow: rgba(0, 0, 0, 0.2) 1px 1px 5px;
  /* border: 1px solid hsl(0, 0%, 80%); */
}

.vp-portfolio__item-img-wrap:hover {
  box-shadow: rgba(0, 0, 0, 0.2) 1px 1px 20px;
}

.logo a {
  width: 50px;
  height: 50px;
  display: block;
}
.logo a svg {
  fill: var(--global--color-primary);
}

.about-block img {
  border-radius: 50%;
}

#menu-legal {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  max-width: none;
  padding-left: 0;
  position: relative;
  margin-right: calc(0px - var(--primary-nav--padding));
  margin-left: calc(0px - var(--primary-nav--padding));
}
#menu-legal a {
  padding-left: var(--primary-nav--padding);
  padding-right: var(--primary-nav--padding);
}

.primary-navigation a:hover {
  text-decoration: underline;
  text-decoration-style: dotted;
  text-decoration-thickness: from-font;
}

.primary-navigation .current-menu-item > a:first-child,
.primary-navigation .current_page_item > a:first-child {
  text-decoration: underline;
  text-decoration-style: solid;
  text-decoration-thickness: from-font;
}
.primary-navigation .current-menu-item > a:first-child:hover,
.primary-navigation .current_page_item > a:first-child:hover {
  text-decoration-thickness: from-font;
}

.block-competitor {
  padding: calc(2 * var(--primary-nav--padding));
  border-radius: 10px;
  background-color: var(--global--color-light-gray);
}
.block-competitor .name {
  font-weight: 400;
}
.block-competitor .name a {
  font-weight: var(--heading--font-weight-strong);
}
.block-competitor .thumbnail {
  width: 72px;
  min-height: 72px;
  float: left;
}
.block-competitor .body {
  margin-left: 82px;
  min-height: 72px;
}

mark {
  margin: 0px 3px;
  font-weight: 400;
  padding: 2px 5px;
  background-color: rgba(255, 255, 0, 0.75);
}

.hyper-minheight400 {
  height: 400px;
}

@media only screen and (max-width: 481px) {
  blockquote {
    padding: 0;
    position: relative;
    margin: calc(0.5 * var(--global--spacing-vertical)) 0 calc(0.5 * var(--global--spacing-vertical)) calc(0.5 * var(--global--spacing-vertical));
  }
  blockquote p {
    text-align: left;
    font-family: var(--pullquote--font-family);
    font-size: 24px !important;
    font-style: var(--pullquote--font-style);
    font-weight: 700;
    margin: 0;
  }
}
h1,
h2,
h3,
h4,
h5 {
  margin-top: var(--global--spacing-vertical);
  margin-bottom: var(--global--spacing-vertical);
}

ul,
ol {
  padding-left: var(--global--font-size-base);
}

.wp-block-group.has-background {
  padding: var(--global--spacing-vertical);
}

/*
 * Block & non-gutenberg content wrapper children
 * - Sets spacing-vertical margin logic
 */
.site-main > article > *,
.site-main > .not-found > *,
.entry-content > *,
[class*=inner-container] > *,
.wp-block-template-part > * {
  margin-top: var(--global--spacing-vertical);
  margin-bottom: var(--global--spacing-vertical);
}

.has-gray-background-color ol.is-style-styled > li::before,
.has-gray-background-color .is-style-styled ol > li::before {
  background-color: var(--global--color-white-90);
  color: var(--global--color-gray);
}

/* Media Text customisation */
.wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content {
  padding: 0 var(--global--spacing-horizontal);
  margin-top: -10px;
}

@media (max-width: 900px) {
  .wp-block-media-text.is-stacked-on-mobile {
    -ms-grid-columns: 100% !important;
    grid-template-columns: 100% !important;
  }

  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media {
    -ms-grid-column: 1;
    grid-column: 1;
    -ms-grid-row: 1;
    grid-row: 1;
  }

  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content {
    padding: var(--global--spacing-horizontal) 0;
    margin-top: 0;
    -ms-grid-column: 1;
    grid-column: 1;
    -ms-grid-row: 2;
    grid-row: 2;
  }
}
@media (min-width: 782px) {
  .edit-post-fullscreen-mode-close.components-button.has-icon {
    background: none !important;
  }
}