/*
Theme Name: Hub Child
Theme URI: http://hub.liquid-themes.com/
Author: Liquid Themes
Author URI: https://themeforest.net/user/liquidthemes
Template: hub
Description: Smart, Powerful and Unlimited Customizable WordPress Theme.
Version: 1.0
License: GNU General Public License
License URI: license.txt
Text Domain: hub-child
Tags: responsive, retina, rtl-language-support, blog, portfolio, custom-colors, live-editor
*/

/* =============================================================
   Outline-headings
   Zet "backgroud_heading" en/of "heading_outline" in het veld
   "Extra class name" van een heading-element in WPBakery.

   Eigen familienaam zodat dit niet botst met een Poppins die Hub
   zelf (bv. via Google Fonts) laadt. Bron: wp-content/fonts/poppins.
   ============================================================= */
@font-face{
  font-family:"Poppins Outline";
  src:url("../../fonts/poppins/Poppins-Regular.woff2") format("woff2");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Poppins Outline";
  src:url("../../fonts/poppins/Poppins-Bold.woff2") format("woff2");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}

/* Eén stijl voor alle outline-teksten op de site (headings met de class
   hieronder, zo_about_stack en zo_project_scroll). Per element te
   overschrijven door de variabele op dat element te zetten. */
:root{
  --zo-outline-font:"Poppins Outline","Poppins",sans-serif;
  --zo-outline-weight:700;
  --zo-outline-size:clamp(4rem,10vw,13.5rem);
  --zo-outline-tracking:-.02em;
  --zo-outline-leading:.35;
  --zo-outline-color:#c9c9d3;
  --zo-outline-width:1.5px;
}

/* Hub zet de kleur van een heading via eigen (dynamische) CSS op het
   binnenste element; daarom ook de kop-elementen en spans binnen de class,
   en !important op fill/stroke om die kleur te overrulen. */
.backgroud_heading,
.backgroud_heading :is(h1,h2,h3,h4,h5,h6,p,span,a),
.background_heading,
.background_heading :is(h1,h2,h3,h4,h5,h6,p,span,a),
.heading_outline,
.heading_outline :is(h1,h2,h3,h4,h5,h6,p,span,a){
  font-family:var(--zo-outline-font) !important;
  font-weight:var(--zo-outline-weight) !important;
  font-size:var(--zo-outline-size) !important;
  letter-spacing:var(--zo-outline-tracking) !important;
  line-height:var(--zo-outline-leading) !important;
  color:transparent !important;
  -webkit-text-fill-color:transparent !important;
  -webkit-text-stroke:var(--zo-outline-width) var(--zo-outline-color) !important;
  /* niet selecteerbaar: anders overlapt de selectie met die van de titel */
  -webkit-user-select:none;
  user-select:none;
}

.backgroud_heading,
.background_heading{
  left:-8px;
  opacity:.8;
}

/* =============================================================
   Copyrightregel (WPBakery-element zo_copyright)
   Lettertype en grootte erven van de footer (Hub); kleuren via het
   element (--zo-copyright-color / -link / -link-hover), anders erven.
   ============================================================= */
.zo-copyright{
  margin:0;
  color:var(--zo-copyright-color, inherit);
  line-height:1.5;   /* Hubs body-line-height erft als px mee */
}
.zo-copyright--left  { text-align:left; }
.zo-copyright--center{ text-align:center; }
.zo-copyright--right { text-align:right; }

.zo-copyright__sep{ margin:0 .35em; }

.zo-copyright__link{
  color:var(--zo-copyright-link, inherit);
  text-decoration:none;
}
.zo-copyright__link:hover,
.zo-copyright__link:focus-visible{
  color:var(--zo-copyright-link-hover, var(--zo-copyright-link, inherit));
  text-decoration:underline;
}