/*
Theme Name: Custom Theme
Author: Varko Technologies, LLC
Description: Starter Theme for custom websites - Elementor & Woocommerce Ready
Version: 0.4
Text Domain: custom-theme

*/
html {
  scroll-behavior: smooth;
}

:root{
  /* Brand colors */
  --brand: #0d6efd;          /* primary */
  --brand-600: #0b5ed7;      /* hover/darker */
  --accent: #6610f2;         /* optional secondary/accent */

  /* Neutrals */
  --bg: #ffffff;
  --surface: #ffffff;
  --text: #111827;
  --muted: #6b7280;
  --border: rgba(17,24,39,.14);

  /* Status */
  --success: #198754;
  --warning: #ffc107;
  --danger:  #dc3545;

  /* Typography */
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-serif: Georgia, "Times New Roman", serif;

  /* UI */
  --radius: .75rem;
  --radius-pill: 999px;
  --shadow: 0 8px 24px rgba(0,0,0,.08);
  --focus: 0 0 0 .25rem rgba(13,110,253,.25);
}

html{ scroll-behavior: smooth; }

body{
  font-size:16px;
  line-height: 1.6;
  width:100%;
}




small, .text-muted { 
  color: var(--muted) !important; 
}

a{
  text-decoration: none;
}
a:hover{
  text-decoration: underline;
}

hr{
  border: 0;
  border-top: 1px solid var(--border);
  opacity: 1;
}

/* Unified button baseline */
.btn,
button,
input[type="submit"],
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit{
  border-radius: var(--radius-pill);
  font-weight: 600;
  letter-spacing: .2px;
  padding: .7rem 1.1rem;
  line-height: 1.1;
}

/* Primary button look */
.btn-primary,
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit{
  background: var(--brand) !important;
  border-color: var(--brand) !important;
  color: #fff !important;
}

/* Hover */
.btn-primary:hover,
.wp-block-button__link:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover{
  background: var(--brand-600) !important;
  border-color: var(--brand-600) !important;
  opacity: .98;
}

/* Focus */
.btn:focus,
button:focus,
input[type="submit"]:focus,
.wp-block-button__link:focus,
.woocommerce a.button:focus,
.woocommerce button.button:focus,
.woocommerce input.button:focus{
  outline: none;
  box-shadow: var(--focus) !important;
}

/* Secondary (optional) */
.btn-outline-primary{
  border-radius: var(--radius-pill);
  border-color: var(--brand) !important;
  color: var(--brand) !important;
}
.btn-outline-primary:hover{
  background: var(--brand) !important;
  color: #fff !important;
}

/* Disabled */
.btn:disabled,
button:disabled,
input[type="submit"]:disabled,
.woocommerce button.button:disabled,
.woocommerce input.button:disabled{
  opacity: .55;
  cursor: not-allowed;
}


/* WordPress buttons -> Bootstrap look */
.wp-block-button__link,
button,
input[type="submit"] {
  border-radius: .5rem;
}

/* Prevent images from overflowing columns */
img {
  max-width: 100%;
  height: auto;
}

#site-header {
    width: 100%;
    z-index: 999;
}

/* Sticky state */
#site-header.sticky-header {
    position: sticky;
    top: 0;
}

#site-header.sticky-header {
    position: sticky;
    top: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.3s ease;
}

/* Sticky footer helper */
.site-wrapper {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.site-content {
  flex: 1 0 auto;
}
.site-footer {
  flex-shrink: 0;
}

.site-logo {
	padding:10px;
  max-width:350px;
  height: auto;
  margin-left:30px;
}

.mainnav {
	position: absolute;
  bottom: 0;
  right: 0;
	padding:10px;
	margin-right:150px;
}

/* Basic menu styling */
.menu {
    font-family: "Montserrat", sans-serif;
    font-style: normal;
    font-weight: 600;
    list-style: none;
    padding: 0;
    margin: 0;
    
}

.menu li {
    position: relative;
    display: inline-block;
}

.menu li a {
    display: block;
    padding: 10px 20px;
    color: #000;
    text-decoration: none;
}

.menu li a:hover {
  
	color: #243b62  
}

/* Dropdown styling */
.menu li ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    padding: 0;
    margin: 0;
    list-style: none;
    z-index: 1000;
}

.menu li:hover > ul {
    display: block;
}

.menu li ul li {
    width: 200px;
}

.menu li ul li a {
    padding: 10px;
}

.menu li ul li ul {
    left: 100%;
    top: 0;
}

/* Add a down arrow to dropdown parent items */
.menu li.menu-item-has-children > a::after {
    content: '\25BC'; 
    font-weight: 900; 
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    color: #333;
}

/* Adjust arrow for hover state (optional) */
.menu li.menu-item-has-children:hover > a::after {
    color: #ccc; /* Change arrow color on hover */
}

/* footer {
	height: 100px;
	padding: 10px;
	background-color: #333;
	color:#fff;
} */

/* WordPress alignment helpers */
.alignnone { margin: 0 1rem 1rem 0; }
.aligncenter { display: block; margin: 1rem auto; }
.alignright { float: right; margin: 0 0 1rem 1rem; }
.alignleft { float: left; margin: 0 1rem 1rem 0; }

/* Captions */
.wp-caption {
  max-width: 100%;
}
.wp-caption-text {
  font-size: 0.875rem;
  color: #6c757d;
  margin-top: .25rem;
}

/* Screen reader only */
.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
}
.screen-reader-text:focus {
  position: static;
  width: auto;
  height: auto;
}

.cntnt {
  max-width:75% !important;
  min-height: 500px !important;
}

.footerCntnt {
 max-width:80% !important;
}

#main {
  padding-top:20px;
}


/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  bottom: 3rem;
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel-item {
  height: 32rem;
}
.carousel-item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 32rem;
}


/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
  margin-bottom: 1.5rem;
  text-align: center;
}
.marketing h2 {
  font-weight: 400;
}
/* rtl:begin:ignore */
.marketing .col-lg-4 p {
  margin-right: .75rem;
  margin-left: .75rem;
}
/* rtl:end:ignore */


/* Featurettes
------------------------- */

.featurette-divider {
  margin: 5rem 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  /* rtl:remove */
  letter-spacing: -.05rem;
}


/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 40em) {
  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 1.25rem;
    font-size: 1.25rem;
    line-height: 1.4;
  }

  .featurette-heading {
    font-size: 50px;
  }
}

@media (min-width: 62em) {
  .featurette-heading {
    margin-top: 7rem;
  }
}