/*
Theme Name: Baniakas & Associates
Theme URI: https://jsmcorp.com/
Author: Jump Start Marketing, Inc.
Author URI: https://jsmcorp.com
Description: This theme was developed for Baniakas & Associates, LLC and provides custom functionality and design for their needs. 
Version: 0.1

*/


:root {
	
  /* Brand */
  --color-primary:   #123729;  
  --color-primary-bg:   #123729; 
  --color-primary-text:   #ffffff; 
	
  --color-secondary: #a6ad72;  
  --color-secondary-bg:   #a6ad72; 
  --color-secondary-text:   #ffffff; 
	
  --color-dark-1: #123729;
  --color-dark-2: #333333;	
  --color-dark-3: #355449;

  --color-light-1: #ffffff;
  --color-light-2: var(--color-secondary);
	
  --color-accent:    #ffc107; /* highlight */

  /* Neutrals */
  --color-bg:        #ffffff; /* page background */
  --color-surface:   #f8f9fa; /* cards/sections */
  --color-border:    #dee2e6; /* borders/dividers */
  --color-text:      #212529; /* main text */
  --color-muted:     #6c757d; /* muted text */

  /* Status (match Bootstrap palette names for convenience) */
  --color-success:   #198754;
  --color-danger:    #dc3545;
  --color-warning:   #ffc107;
  --color-info:      #0dcaf0;
}

/*  Bootstrap 5.3+ variable bridge =====
   This makes Bootstrap components inherit your tokens automatically. */
:root {
  --bs-body-bg:           var(--color-bg);
  --bs-body-color:        var(--color-text);
  --bs-border-color:      var(--color-border);

  --bs-primary:           var(--color-primary);
  --bs-secondary:         var(--color-secondary);
  --bs-success:           var(--color-success);
  --bs-danger:            var(--color-danger);
  --bs-warning:           var(--color-warning);
  --bs-info:              var(--color-info);

  --bs-link-color:        var(--color-primary);
  --bs-link-hover-color:  var(--color-accent);

  /* Buttons pick up from these when not set per-variant */
  --bs-btn-color:         #ffffff;
  --bs-btn-bg:            var(--color-primary);
  --bs-btn-border-color:  var(--color-primary);
}

/* Base elements (optional but useful) ===== */
html, body {
  background-color: var(--color-bg);
  color: var(--color-text);
}

a { color: var(--color-primary); }
a:hover { color: var(--color-accent); }

hr { color: var(--color-border); opacity: 1; }

:focus-visible {
  outline: 3px solid var(--color-accent);
  outline-offset: 2px;
}

#jsm-header-3c .dropdown-hover > .nav-link:focus, #jsm-header-3c .dropdown-hover:hover > .nav-link{color: var(--color-dark-2) !important;}

.dropdown-item.active, .dropdown-item:active {
    color: var(--color-primary-text) !important;
    text-decoration: none;
    background-color: var(--color-secondary-bg) !important;
}

/* Utilities you’ll reuse in sections ===== */
.text-muted      { color: var(--color-muted) !important; }
.bg-surface      { background-color: var(--color-surface) !important; }
.border-default  { border-color: var(--color-border) !important; }
.text-on-primary { color: #ffffff !important; }
.bg-primary-ink  { background-color: var(--color-primary) !important; color:#fff !important; }

.btn-jsm-1 {background-color: var(--color-primary) !important; color: var(--color-primary-text) !important; }
.btn-jsm-2 {background-color: var(--color-secondary) !important; color: var(--color-secondary-text) !important;}
 

/* Optional dark mode (toggle with [data-theme="dark"]) ===== */
[data-theme="dark"] {
  --color-bg:       #121212;
  --color-surface:  #1e1e1e;
  --color-text:     #e9ecef;
  --color-border:   #2c2c2c;
  --color-muted:    #adb5bd;

  --color-primary:  #66b2ff;
  --color-accent:   #ffd166;
}

/* per-section theming (great for reusable sections) =====
   Wrap any section with data-brand="teal" (or "rose", etc.) to swap brand quickly. */
[data-brand="teal"] { --color-primary: #14b8a6; }
[data-brand="rose"] { --color-primary: #e11d48; }
[data-brand="amber"]{ --color-primary: #f59e0b; }


 

/* *********************************** */
#jsm-header-3c .navbar-toggler {
    border-color: rgba(0,0,0,.2);
    margin-left: auto !important;
    margin-right: auto !important;
}


.btn-primary {
  color: #ffffff;
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}
.card {
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  color: var(--color-text);
}


#jsm-section-6 h2 {text-transform: uppercase;margin-top: 15px; margin-bottom: 15px;}
#jsm-section-6 strong {font-weight: 600;}

button#wpforms-submit-173 {background-color: #123729 !important;  }
button#wpforms-submit-173:hover {background-color: var(--color-light-2) !important;}

.pagetitle, .wp-block-heading  {text-align:center;}




#jsm-header-3c .tax-toggle {
  background: none;
  border: 0;
  color: inherit;
  padding: 0;
  margin-left: .25rem;
  cursor: pointer;
}
#jsm-header-3c .tax-toggle:focus { outline: none; box-shadow: none; }
	
#jsm-header-3c .navbar {
    background: rgba(255,255,255,.96);
    border-bottom: 3px solid rgb(18 55 41);
}
#jsm-header-3c .btn-jsm-1 {
    background-color: var(--color-primary-bg) !important;  
    color: var(--color-primary-text) !important; 
}

#jsm-header-3c .navbar-nav .nav-link {
  padding: .8rem 1rem;
  font-weight: 600;
  color: #222;
  font-size: 1.2rem;
}
#jsm-header-3c .navbar-nav .nav-link:hover,
#jsm-header-3c .navbar-nav .nav-link:focus {
  color: var(--color-secondary-bg) !important;
}

#jsm-header-3c .dropdown-menu {
  border: 1px solid rgba(0,0,0,.1);
  border-radius: .35rem;
  min-width: 260px;
}

#jsm-header-3c .dropdown-submenu {
  position: relative;
}
#jsm-header-3c .dropdown-submenu > .dropdown-menu {
  top: 0;
  left: 100%;
  margin-top: -0.25rem;
  margin-left: .1rem;
}

@media (min-width: 992px) {
  #jsm-header-3c .dropdown-hover:hover > .dropdown-menu { display: block; }
  #jsm-header-3c .dropdown-submenu:hover > .dropdown-menu { display: block; }
  #jsm-header-3c .dropdown-hover > .nav-link:focus,
  #jsm-header-3c .dropdown-hover:hover > .nav-link {color: #0d6efd;}
 
}

#jsm-header-3c .dropdown-toggle::after {
  display: none !important;
}

#jsm-header-3c .navbar-toggler {
  border-color: rgba(0,0,0,.2);
}
#jsm-header-3c .navbar-toggler:focus { box-shadow: none; }

#jsm-header-3c .navbar,
#jsm-header-3c .container-fluid,
#jsm-header-3c .collapse {
  overflow: visible !important;
}

/* 2) Ensure the dropdown sits above other elements (z-index) */
#jsm-header-3c .dropdown-menu {
  z-index: 2000 !important;
  /* position is handled by Bootstrap; don't force absolute unless you need to */
}

/* 3) Style the inline caret so it matches the nav text */
#jsm-header-3c .nav-caret { display:inline-block; vertical-align:middle; color:inherit; }
#jsm-header-3c .nav-caret path { stroke: currentColor; }












/* ===== Home  ===== */

  #jsm-hero-7-carousel .hero-card{
    background: rgba(255,255,255,0.92);
    backdrop-filter: saturate(120%);
    max-width: 720px;
    padding: 2.25rem 2.5rem;
    box-shadow: 0 1rem 2rem rgba(0,0,0,.15);
    border-radius: .25rem;
    z-index: 2;
  }

  #jsm-hero-7-carousel .hero-kicker{
    font-size:1.15rem;
    line-height:1.3;
    color:#111;
    font-weight:400;
    font-family: Georgia, "Times New Roman", Times, serif;
  }
  #jsm-hero-7-carousel .hero-title{
    font-size: clamp(2.0rem, 5.5vw, 3.6rem);
    line-height:1.05;
    color:#111;
    font-weight:600;
    font-family: Georgia, "Times New Roman", Times, serif;
    margin-top:.25rem;
  }

  #jsm-hero-7-carousel .btn-jsm-2{
    background:#1eb4d6;
    border:0;
    color:#fff;
    text-transform:uppercase;
    font-weight:700;
    letter-spacing:.5px;
    padding:.75rem 1.4rem;
  }
  #jsm-hero-7-carousel .btn-jsm-2:hover{ background:#149ab7; color:#fff; }
  #jsm-hero-7-carousel .carousel-item { position: relative; }
  #jsm-hero-7-carousel .carousel-item > .container { position: relative; z-index: 1; }

  #jsm-hero-7-carousel .carousel-indicators [data-bs-target] {
    width: 10px; height: 10px; border-radius: 50%;
    background: rgba(255,255,255,0.6);
    border: none;
  }
  #jsm-hero-7-carousel .carousel-indicators .active {
    background: #1eb4d6;
  }

  @media (max-width:575.98px){
    #jsm-hero-7-carousel .hero-card { padding: 1.25rem; max-width: 92%; }
    #jsm-hero-7-carousel { min-height: 420px; }
  }



  /* Styles to mirror original look and modernize it slightly */
  #jsm-section-col-links-1 {
    background-color: var(--color-primary-bg) !important;  
    color: var(--color-primary-text) !important; 
  }
  #jsm-section-col-links-1 .hover-highlight:hover {
    background-color: var(--color-secondary) !important; 
    color: #fff;
    transition: all 0.3s ease;
  }
  #jsm-section-col-links-1 i {
    color: #fff;
  }
  #jsm-section-col-links-1 a {color: #fff;}
  @media (max-width: 575.98px) {
    /*#jsm-section-col-links-1 {display: none; }*/
  }



  /* ---------- QUICK TUNING (edit these first) ---------- */
  #jsm-sections-58{
    --maxw: 1280px;          /* page width */
    --padY: 5.5rem;          /* section vertical padding */
    --titleSize: clamp(2rem, 4.2vw, 3rem);     /* big heading */
    --leadSize: clamp(1.05rem, 1.2vw, 1.2rem); /* intro paragraph */
    --bodySize: clamp(1rem, 1.05vw, 1.1rem);   /* body paragraphs */
    --mediaMinH: 520px;      /* image panel height (desktop) */
    --mediaMinHsm: 380px;    /* image panel height (mobile) */
    --radius: .75rem;        /* corners */
    --brand: #1a53ff;        /* button color */
  }

  /* ---------- SHELL ---------- */
  #jsm-sections-58 { background:#fff; color:#0e1220; padding: var(--padY) 1rem; }
  #jsm-sections-58 .jsm58-container{
    max-width: var(--maxw); margin: 0 auto;
  }
  #jsm-sections-58 .jsm58-grid{
    display:grid; grid-template-columns: 1.1fr 0.9fr;
    gap: clamp(1.25rem, 3.2vw, 3rem);
    align-items: center;
  }

  /* ---------- CONTENT ---------- */
  #jsm-sections-58 .jsm58-title, #jsm-blog-1 .jsm58-title, #jsm-sections-57 .jsm58-title {
    margin: 0 0 1rem;
    font-size: 2.5rem;
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: .005em;
    color: var(--color-primary-bg);
  }
  #jsm-sections-58 .jsm58-lead{
    margin: 0 0 1rem;
    font-size: var(--leadSize);
    color:#273142;
    line-height:1.65;
  }
  #jsm-sections-58 p{
    margin:.5rem 0 0;
    font-size: var(--bodySize);
    color:#3b4150;
    line-height:1.7;
  }

  /* ---------- CTA BUTTON ---------- */
  #jsm-sections-58 .jsm58-btn{
    display:inline-flex; align-items:center; gap:.65rem; margin-top:1.5rem;
    background: var(--color-secondary-bg); color:#fff; text-decoration:none;
    padding: 1rem 1.15rem; border-radius: .55rem; font-weight: 800;
    text-transform: uppercase; letter-spacing: .02em;
    box-shadow: 0 1rem 2rem var('--') !important;
    transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
  }
  #jsm-sections-58 .jsm58-btn:hover{
    background: var(--color-secondary-bg) !important; transform: translateY(-2px);
    box-shadow: 0 1.25rem 2.25rem var(--color-secondary-bg);
  }

  /* ---------- MEDIA PANEL ---------- */
  #jsm-sections-58 .jsm58-media{
    min-height: var(--mediaMinH);
    border-radius: var(--radius);
    box-shadow: 0 .9rem 1.8rem rgba(0,0,0,.08);
    background:
      linear-gradient(rgba(0,0,0,.08), rgba(0,0,0,.08)),
      url('/wp-content/uploads/2025/10/BaniakasAndAssociates-office.jpg') center/cover no-repeat;
  }
 
 

  /* ---------- RESPONSIVE / REVERSE LIKE ELEMENTOR ---------- */
  @media (max-width: 1199.98px){
    #jsm-sections-58 { --mediaMinH: 480px; }
  }
  @media (max-width: 991.98px){
    #jsm-sections-58 .jsm58-grid{ grid-template-columns: 1fr; }
    #jsm-sections-58 .jsm58-media{ order: -1; min-height: var(--mediaMinHsm); }
    #jsm-sections-58 { --titleSize: clamp(2rem, 6vw, 2.6rem); --padY: 4.5rem; }
    
  }
  @media (max-width: 575.98px){
    #jsm-sections-58 { --padY: 3.75rem; }
  }



  #jsm-sections-57 {
    background-color: #FFFFFF;
    background-image: url(/wp-content/uploads/2025/10/bg-beach-brown.webp);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
  }
iframe {
    border: solid 5px #fff;
}
  #jsm-sections-57 h2 {
    font-size: 2.5rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #fff;
  }

  #jsm-sections-57 h3 {
   font-size: 1.5rem;
    max-width: 900px;
    margin: 0 auto 2rem;
    color: #e4e4e4;
    line-height: 1.6;
  }
  #jsm-sections-57 .btn {
    background-color: #1a53ff;
    border: none;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    transition: all 0.25s ease;
  }

  #jsm-sections-57 .btn:hover {
    background-color: #003ccc;
    transform: translateY(-2px);
  }

  #jsm-sections-57 .btn i {
    font-size: 1rem;
  }



  #jsm-cards-2-a .icon-circle {
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: #fff;
    color: #fff;
    font-size: 2.2rem;
    box-shadow: 0 .75rem 1.5rem rgba(0,0,0,.1);
    transition: all 0.4s ease;
  }

  /* --- Pulse Glow Animation (hover effect) --- */
  #jsm-cards-2-a .icon-circle:hover {
    transform: scale(1.1);
    box-shadow: 0 0 25px #a6ad72;
  }

  #jsm-cards-2-a .icon-circle:hover i {
    animation: pulseGlow 1.2s infinite alternate;
  }

  @keyframes pulseGlow {
    from { text-shadow: 0 0 4px rgba(255,255,255,.3); }
    to   { text-shadow: 0 0 12px rgba(255,255,255,.9); }
  }

  /* Typography */
  #jsm-cards-2-a h5 {
    color: #212529;
    font-size: 1.7rem;
  }

  #jsm-cards-2-a p.lead {
    font-size: 1.3rem;
    color: #555;
    line-height: 1.6;
  }

  /* Responsive tweak */
  @media (max-width: 767.98px) {
    #jsm-cards-2-a .icon-circle {
      width: 80px;
      height: 80px;
      font-size: 1.8rem;
    }
  }








/* ===== Footer  ===== */
  #jsm-footer-1{
    background: var(--color-primary-bg);             
    color: var(--color-primary-text); ;
    line-height:1.6;
  }
  #jsm-footer-1 .footer-main{
    background:linear-gradient(0deg, rgba(255,255,255,0.02), rgba(255,255,255,0.02));
  }
  #jsm-footer-1 .container{max-width:1200px;}

  /* Headings + divider */
  #jsm-footer-1 h3{ font-size:1.15rem; letter-spacing:.02em; }
  #jsm-footer-1 .divider{
    width:75%; height:3px; background:var(--color-secondary-bg); border-radius:2px;
  }

  /* Links */
  #jsm-footer-1 a{ color:#e8ecf4; text-decoration:none; }
  #jsm-footer-1 a:hover{ color: var(--color-secondary-bg); text-decoration:underline; }
  #jsm-footer-1 .footer-links li + li{ margin-top:.35rem; }

  /* Social buttons */
  #jsm-footer-1 .social-btn{
    width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center;
    border-radius:50%; background: var(--color-secondary-bg); color:#fff; transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
    box-shadow:0 .5rem 1rem rgba(0,0,0,.2);
  }
  #jsm-footer-1 .social-btn:hover{ transform:translateY(-2px); background:var(--color-secondary-bg); }

  /* Contact list icons align nicely */
  #jsm-footer-1 .contact li{ margin-bottom:.4rem; }
  #jsm-footer-1 .contact i{ width:1.1rem; text-align:center; }

  /* CTA buttons */
  #jsm-footer-1 .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:.25rem;
    padding:.6rem 1rem; border-radius:.35rem; font-weight:700; text-transform:uppercase; letter-spacing:.02em;
  }
  #jsm-footer-1 .btn-cta{
    background:var(--color-secondary-bg); color:var(--color-secondary-text); border:1px solid var(--color-primary-bg);
  }
  #jsm-footer-1 .btn-cta:hover{ background:#1747d9; border-color:#1747d9; color:#fff; }
  #jsm-footer-1 .btn-outline-cta{
    background:transparent; color:#e8ecf4; border:1px solid rgba(255,255,255,.25);
  }
  #jsm-footer-1 .btn-outline-cta:hover{
    background:rgba(255,255,255,.06); color:#fff; border-color:rgba(255,255,255,.4);
  }

  /* Bottom bar */
  #jsm-footer-1 .footer-bottom{
    background:#0b0f1a; border-top:1px solid rgba(255,255,255,.06);
  }
  #jsm-footer-1 .footer-bottom a{ color: var(--color-secondary-bg); }
  #jsm-footer-1 .footer-bottom a:hover{ color: var(--color-secondary-bg); }

  /* Responsive tweaks */
  @media (max-width: 575.98px){
    #jsm-footer-1 h3{ margin-top:.5rem; }
  }