/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */
:root {
	--color-purple: #7A50F2;
	--color-white: #ffffff;
	--button-outline: #ffffff1a;
	--badge-outline: #ffffff0d;
	--opaque-button-border-intensity: 9;
	--elevate-1: #ffffff0a;
	--elevate-2: #ffffff17;
	--background: 0 0% 0%;
	--background-purple:#7954f233;
	--foreground: 0 0% 100%;
	--border: 0 0% 15%;
	--card: 0 0% 5%;
	--card-foreground: 0 0% 100%;
	--card-border: 0 0% 15%;
	--sidebar: 0 0% 5%;
	--sidebar-foreground: 0 0% 100%;
	--sidebar-border: 0 0% 15%;
	--sidebar-primary: 254 86% 64%;
	--sidebar-primary-foreground: 0 0% 100%;
	--sidebar-accent: 0 0% 10%;
	--sidebar-accent-foreground: 0 0% 100%;
	--sidebar-ring: 254 86% 64%;
	--popover: 0 0% 5%;
	--popover-foreground: 0 0% 100%;
	--popover-border: 0 0% 15%;
	--primary: 254 86% 64%;
	--primary-foreground: 0 0% 100%;
	--secondary: 354 70% 53%;
	--secondary-foreground: 0 0% 100%;
	--muted: 0 0% 10%;
	--muted-foreground: 0 0% 60%;
	--accent: 254 86% 64%;
	--accent-foreground: 0 0% 100%;
	--destructive: 0 84% 60%;
	--destructive-foreground: 0 0% 100%;
	--input: 0 0% 15%;
	--ring: 254 86% 64%;
	--chart-1: 254 86% 64%;
	--chart-2: 354 70% 53%;
	--chart-3: 254 86% 84%;
	--chart-4: 0 0% 80%;
	--chart-5: 0 0% 60%;
	--app-font-sans: "DM Sans", sans-serif;
	--app-font-display: "Bebas Neue", sans-serif;
	--app-font-serif: Georgia, serif;
	--app-font-mono: Menlo, monospace;
	--radius: 5px;
	--shadow-2xs: 0px 2px 0px 0px #00000080;
	--shadow-xs: 0px 2px 0px 0px #00000080;
	--shadow-sm: 0px 2px 0px 0px #00000080, 0px 1px 2px -1px #00000080;
	--shadow: 0px 2px 0px 0px #00000080, 0px 1px 2px -1px #00000080;
	--shadow-md: 0px 2px 0px 0px #00000080, 0px 2px 4px -1px #00000080;
	--shadow-lg: 0px 2px 0px 0px #00000080, 0px 4px 6px -1px #00000080;
	--shadow-xl: 0px 2px 0px 0px #00000080, 0px 8px 10px -1px #00000080;
	--shadow-2xl: 0px 2px 0px 0px #00000080;
	--tracking-normal: 0em;
	--spacing: .25rem;
	--sidebar-primary-border: hsl(from hsl(var(--sidebar-primary)) h s calc(l + var(--opaque-button-border-intensity)) / alpha);
	--sidebar-accent-border: hsl(from hsl(var(--sidebar-accent)) h s calc(l + var(--opaque-button-border-intensity)) / alpha);
	--primary-border: hsl(from hsl(var(--primary)) h s calc(l + var(--opaque-button-border-intensity)) / alpha);
	--secondary-border: hsl(from hsl(var(--secondary)) h s calc(l + var(--opaque-button-border-intensity)) / alpha);
	--muted-border: hsl(from hsl(var(--muted)) h s calc(l + var(--opaque-button-border-intensity)) / alpha);
	--accent-border: hsl(from hsl(var(--accent)) h s calc(l + var(--opaque-button-border-intensity)) / alpha);
	--destructive-border: hsl(from hsl(var(--destructive)) h s calc(l + var(--opaque-button-border-intensity)) / alpha);
	--fa-font-solid:"Font Awesome 6 Free Solid";
}
.page-header .entry-title, .site-footer .footer-inner, .site-footer:not(.dynamic-footer), .site-header .header-inner, .site-header:not(.dynamic-header), body:not([class*=elementor-page-]) .site-main {max-width: 1250px;}
body:not([class*=elementor-page-]) .site-main {padding:10px}
.highlight {color:var(--purple)}
.gradient-text {
    background: linear-gradient(45deg, var(--color-purple), var(--color-white));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
/* Icons */
.elementor-icon-list-icon {padding: 7px;background: var(--background-purple); border-radius: 50px;align-items: center;justify-content: center;aspect-ratio: 1 / 1;margin-right:10px}


/* Cards */
.card .icon {transform:scale(1);transition:0.2s ease all; transform-origin:bottom left}
.card:hover .icon {transform:scale(1.1)}
.card .learn-more, .card .arrow-right {transform:translatex(0);transition:0.2s ease all}
.card:hover .learn-more, .card:hover .arrow-right {transform:translatex(10px)}
.card .arrow-right {fill:#999999}
.card:hover .arrow-right {fill:var(--purple)}
.card .card-icon {transform:scale(1);transition:0.2s ease transform;}
.card:hover .card-icon {transform:scale(1.1)}
.card h2, .card h3 {transition:0.2s ease color;}
.card:hover h2, .card:hover h3 {color:var(--purple)}

/* Buttons */
.button-no-bg {}

/* Footer Menu */
.footer-menu li:before { font-family: var(--fa-font-solid);
  content: '\f105';
  display: inline-block;
	transition:0.2s ease all;
	width:0!important;
	overflow:hidden;
	transform:scale(0);
	transform-origin:left;
  height: 12px;
    
	  -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20320%20512%22%3E%3Cpath%20d%3D%22M311.1%20233.4c12.5%2012.5%2012.5%2032.8%200%2045.3l-192%20192c-12.5%2012.5-32.8%2012.5-45.3%200s-12.5-32.8%200-45.3L243.2%20256%2073.9%2086.6c-12.5-12.5-12.5-32.8%200-45.3s32.8-12.5%2045.3%200l192%20192z%22%2F%3E%3C%2Fsvg%3E");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;

  mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20320%20512%22%3E%3Cpath%20d%3D%22M311.1%20233.4c12.5%2012.5%2012.5%2032.8%200%2045.3l-192%20192c-12.5%2012.5-32.8%2012.5-45.3%200s-12.5-32.8%200-45.3L243.2%20256%2073.9%2086.6c-12.5-12.5-12.5-32.8%200-45.3s32.8-12.5%2045.3%200l192%20192z%22%2F%3E%3C%2Fsvg%3E");
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;

	background-color:currentcolor;
}
.footer-menu li:hover:before {
	width: 16px!important;
	transform:scale(1);
}
.footer-menu li a {display:inline-block}

/* Blog Posts */
.post {line-height:1.7}
.post blockquote {color:var(--color-purple); border-left:5px solid var(--color-purple);padding-left:20px;margin-left:0; font-weight:600 }
.post table {border-radius:10px!important; border-collapse:separate!important;border:1px solid rgba(255,255,255,0.2)}
.post table tbody, .post table thead {border-style:none!important; border-collapse:collapse!important; border-width:0!important}
.post td, .post th {border:none!important}
.post table tbody tr:not(:last-child) td{border-block-start:none!important;border-block-end: 1px solid rgba(255, 255, 255, 0.2) !important; border: none;}
.post table thead td{border-block-start:none!important;border-block-end: 1px solid rgba(255, 255, 255, 0.2) !important;}
.post table thead {background:rgba(255, 255, 255, 0.1)}
ul.wp-block-list, ol.wp-block-list {margin-block-end: .9rem;}
.schema-faq-section {padding: 2rem;
    border-radius: var(--radius-xl);
    background-color: var(--med-grey);
    filter: blur(0px);
    border-width: 1px;
    border-color: var(--border-dark);
    border-style: solid;
    flex-direction: column;
    gap: 0.9em;
margin-bottom:0.9em;}
.schema-faq-section .schema-faq-question {text-transform:uppercase; color:#ffffff; margin-bottom: 0.6em;display: block;font-family:var(--secondary-font); font-weight: 300; letter-spacing: 0.9px;}
.schema-faq-section .schema-faq-answer {margin-bottom:0;font-size:1rem}
.post .elementor-icon-list-icon, .archive .elementor-icon-list-icon {background:unset;padding:0}
.coloured-post-category {
    color: var(--category-colour);
    background-color: color-mix(
        in srgb,
        var(--category-colour) 10%,
        transparent
    );
	border: 1px solid color-mix(
        in srgb,
        var(--category-colour) 20%,
        transparent
    );
    display: inline-flex;
    padding: 6px 16px;
    border-radius: var(--radius-xl);
    text-decoration: none;
	font-size:0.9rem;
	align-items:center;}
.coloured-post-categories {display:flex;gap:10px}
.coloured-post-category .elementor-icon-list-icon {color: var(--category-colour);}
.coloured-post-category .elementor-icon-list-icon svg{fill: var(--category-colour)!important;}