/**
* Theme Name:        Queen Bee
* Theme URI:         https://techdongle.com/
* Template:          avanam
* Author:            TechDongle Inc.
* Author URI:        #
* Description:       Queen Bee Child theme by TechDongle Inc.
* Version:           1.0.2
* License:           GNU General Public License v3.0 (or later)
* License URI:       https://www.gnu.org/licenses/gpl-3.0.html
* Text Domain:       queen-bee
* Requires at least: 6.2
* Tested up to:      6.6
* Requires PHP:      7.4
* Tags: translation-ready, two-columns, right-sidebar, left-sidebar, footer-widgets, blog, custom-logo, custom-background, custom-menu, rtl-language-support, editor-style, threaded-comments, custom-colors, featured-images, wide-blocks, full-width-template, theme-options, e-commerce

*/

:root {
  /* Color Palette */
  --color-posh-moss: #5c6a52;
  --color-wooded-rose: #8c3b51;
  --color-diva-girl: #c59fb2;
  --color-warm-cream: #f6f0eb;
  --color-black-raspberry: #19120c;

  /* Typography */
  --font-body: 'Karla', sans-serif;
  --font-heading: 'EB Garamond', serif;

  /* Font Sizes (scalable ranges) */
  --font-body-size: 16px;
  --font-body-size-lg: 22px;
  --font-heading-size: 42px;
  --font-heading-size-lg: 72px;
}

body {
  font-family: var(--font-body);
  font-size: var(--font-body-size);
  background-color: var(--color-warm-cream);
  color: var(--color-black-raspberry);
}

h1, h2, h3 {
  font-family: var(--font-heading);
  font-size: var(--font-heading-size);
  color: var(--color-posh-moss);
}

/*
.section-btn {
  background-color: var(--color-wooded-rose);
  color: var(--color-warm-cream);
  font-family: var(--font-body);
}

.section-btn:hover {
  background-color: var(--color-diva-girl);
} */

.hero-lk a {
  color: var(--color-warm-cream);
  text-decoration: none;
  position: relative; /* needed for pseudo-element positioning */
}

.hero-lk a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px; /* adjust to sit just below text */
  width: 100%;
  height: 2px;
  background-color: #fff;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease;
}

.hero-lk a:hover {
  color: #fff;
}

.hero-lk a:hover::after {
  transform: scaleX(1);
}

.ls-custom-overlay {
  position: absolute;   /* make sure it covers the whole slider */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none; /* overlay won’t block slider interaction */
  background: linear-gradient(
    to right,
    rgba(0,0,0,0.7) 0%,   /* dark left */
    rgba(0,0,0,0.3) 40%,  /* fade toward center */
    rgba(0,0,0,0.0) 100%  /* fully transparent right */
  ) !important;
  z-index: 1; /* sits above slide background but below text/buttons */
}