/*
Theme Name: Breeze AI Dynamic
Theme URI: https://breezeestimator.ai
Author: Breeze AI
Author URI: https://breezeestimator.ai
Description: Fully dynamic, admin-editable WordPress theme for Breeze AI — electrical estimating and project management platform. All content managed from the WordPress admin dashboard with Custom Post Types, media upload, and per-section settings.
Version: 2.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: breeze-ai
Tags: business, technology, responsive, bootstrap, dynamic
*/

/* Base */
body, html { height: 100%; }
html { font-size: 62.5%; }

a {
    text-decoration: none;
    color: #444;
}
a:hover { color: #000000; }
body {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 1.6rem;
    line-height: 1.6;
    background-color: #fff;
    color: #09111c;
    transition: all 1s ease-in;
}
h1 { font-size: 5rem; font-weight: 600; }
h2, .section-title { font-size: 4rem; font-weight: 600; }
h3 { font-size: 3.2rem; font-weight: 600; }

.bg-white-50 {  background: rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px); }
.navbar-expand-lg .navbar-toggler { display: block; }
.navbar{
position:fixed;
top:0;
left:0;
width:100%;
z-index:9999;
background:rgba(255,255,255,.10);
backdrop-filter:blur(8px);
-webkit-backdrop-filter:blur(8px);
transition:background .35s ease,box-shadow .35s ease;
}


.navbar-nav li { margin-right: 16px; }
.navbar-nav .nav-link, .login-link {
    font-size: 1.6rem;
    font-weight: 500;
    color: #fff;
    position: relative;
    display: block;
    white-space: nowrap;
}
.navbar-nav .nav-link:focus-visible { outline: none; }
.navbar-nav .nav-link.active,
.navbar-nav .nav-link:hover,
.login-link:hover,
.news-box:hover { color: #33E3FF; }

.text20 { font-size: 2rem; }
.fw-medium { font-weight: 500; }
.text28 { font-size: 2.8rem; }
.fw-semi-bold { font-weight: 600; }

.btn-primary {
    background-color: #33E3FF;
    border-color: #33E3FF;
    color: #fff;
}
.btn-primary:hover {
    background-color: #fff;
    border-color: #33E3FF;
    color: #33E3FF;
}

.section { padding: 100px 0; }

.footer {
    background-color: #141847;
    color: #fff;
    padding: 50px 0 10px;
    font-size: 1.6rem;
}
.footer h6 { font-weight: 600; font-size: 2rem; margin-bottom: 15px; }
.footer a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin-bottom: 15px;
}
.footer a:hover { color: #33E3FF; }
.ftbottom-links a { display: inline-block !important; margin-right: 30px; }
.ftbottom-links a:last-of-type { margin-right: 0; }

.text-blue { color: #0E1A2A; }
.btn-blue { background: #0E1A2A; border-color: #0E1A2A; color: #fff; }
.btn-blue:hover { background: #fff; border-color: #0E1A2A; color: #0E1A2A; }

.btn { font-size: 1.8rem; padding: 12px 30px; font-weight: 500; }
.btn-outline-primary { border-color: #33E3FF; color: #33E3FF; }
.btn-outline-primary:hover { border-color: #33E3FF; background: #33E3FF; color: #fff; }
.btn-outline-white { border-color: #fff; color: #fff; }
.btn-outline-white:hover { border-color: #fff; background: #fff; color: #369492; }

.home-banner{
    margin-top:-80px;
    padding-top:80px;
}

.banner-overlay {
    position: absolute;
    left: 0; top: 0; right: 0; bottom: 0;
}

.icon-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 65px;
    height: 65px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
}
.zoom-img { overflow: hidden; display: block; }
.zoom-img img { transition: transform 0.2s; cursor: pointer; }
.zoom-img img:hover { transform: scale(1.03) !important; }

.dropdown-menu { background: #369492; font-size: 1.6rem; }
.dropdown-menu li { margin: 0; }
.dropdown-menu li a { color: #fff; display: block; }

.social-links a:hover svg circle { fill: #33E3FF; }

.bg-blue { background: #2A53A2; }
#header.scrolled-fixed-top{
background:#2A53A2 !important;
box-shadow:0 4px 15px rgba(0,0,0,.18);
}
.border-blue { border-color: #2680EB !important; }

.btn-outline-blue { border-color: #2A53A2; color: #2A53A2; }
.btn-outline-blue:hover { border-color: #2A53A2; color: #fff; background: #2A53A2; }

.text22 { font-size: 2.2rem; }

.bg-img {
    background: url('images/section-bg.jpg') no-repeat top center;
    background-size: cover;
    background-attachment: fixed;
}
.bg-blue-50 { background: rgba(41, 77, 177, 0.75); }

.nav-pills .nav-link {
    color: #2A53A2;
    border: 1px solid #2A53A2;
    padding: 5px 15px;
}
.nav-pills .nav-item { margin: 5px 10px; }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    background: #2A53A2;
    border: 1px solid #2A53A2;
    color: #fff;
}

.bg-gray { background: #F6F6F6; }
.text-gray { color: #7E6D6D; }

.form-control { font-size: 1.8rem; padding: 10px; }
.accordion-button { font-size: 2rem; font-weight: 500; padding: 20px 15px; }
.accordion-item { margin-bottom: 20px; }

.text-blue-light { color: #06F2AA; }

.alert { font-size: 1.6rem; }

/* Inner banner */
.inner-banner img { max-height: 400px; object-fit: cover; width: 100%; }

/* Footer bottom */
.ft-bottom { color: rgba(255,255,255,0.7); font-size: 1.4rem; }

/* ---- Navbar overlap fix ---- */
/* Keep navbar above all page content including banners and AOS-animated elements */
#header {
    z-index: 1050;
}

/* Isolate banner stacking contexts so they never escape above the navbar */
.home-banner,
.inner-banner {
    position: relative;
    z-index: 0;
}

/* Desktop: body top-padding offsets the fixed navbar so content is never hidden behind it */
@media (min-width: 1024px) {
    body { padding-top: 80px; }
    /* Hero banner on front page pulls back up so it still extends behind the transparent navbar */
    .home-banner { margin-top: -80px; }
}

/* Responsive */
@media (max-width: 1225px) {
    h1 { font-size: 4rem; }
    h2 { font-size: 3.2rem; }
    .navbar-nav li { margin-right: 5px; }
    .navbar-nav .nav-link, .login-link { font-size: 1.6rem; }
    header .btn { padding: 5px 10px; font-size: 1.6rem; }
}
@media (max-width: 1023px) {
    body { padding-top: 55px; }
    .navbar-brand img { height: 40px; }
    .why-check img { width: 40px; }
    .first-sextion .text20 { font-size: 1.4rem; }
    .first-sextion svg { width: 20px; }
}
@media (max-width: 767px) {
    header .btn { padding: 10px 15px; }
    .home-banner { height: 500px; margin-top: 0; }
    .home-banner img { opacity: 0; }
    h1 { font-size: 3rem; }
    h2 { font-size: 2.8rem; }
    .section { padding: 50px 0; }
    h3 { font-size: 2.4rem; }
    .footer { text-align: center; }
}

/*================ HERO FIX =================*/

.home-banner{
    position:relative;
    min-height:100vh;
    display:flex;
    align-items:center;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

.home-banner img{
    display:none;
}

.banner-overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.25);
    z-index:1;
}

.home-banner .container{
    padding-top: 90px !important;
    position:relative;
    z-index:2;
}

.banner-overlay h1{
    color:#fff;
    font-size: 5rem;
    font-weight: 600;
    line-height:1.2;
}

.banner-overlay .text20{
    color:#fff;
    font-size:22px;
    margin-bottom:35px;
}

.banner-overlay .btn{
    margin-right:15px;
}

@media(max-width:991px){

.home-banner{
min-height:550px;
}

.banner-overlay h1{
font-size:42px;
}

}

@media(max-width:767px){

.home-banner{
min-height:500px;
}

.banner-overlay h1{
font-size:32px;
}

.banner-overlay .text20{
font-size:18px;
}

}

/* Fix AOS hidden elements */

[data-aos]{

    opacity:1;

    visibility:visible;

}

html:not(.aos-init) [data-aos]{

    opacity:1;

    transform:none;

}

.inner-banner{
    height:650px !important;
    min-height:650px !important;
}

.inner-banner .banner-overlay{
    height:650px !important;
}

.inner-banner img{
    height:650px !important;
    object-fit:cover;
}
/* ══════════════════════════════════════════════════════════════
   Pricing Page (page-pricing.php)
   ══════════════════════════════════════════════════════════════ */

/* ── Pricing Cards ─────────────────────────────────── */
.pricing-card {
    background: #fff;
    border: 2px solid #e8edf5;
    border-radius: 16px;
    padding: 40px 36px;
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    position: relative;
}
.pricing-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 50px rgba(42,83,162,0.12);
}
.pricing-card.featured {
    background: #2A53A2;
    border-color: #2A53A2;
    color: #fff;
    transform: translateY(-8px);
    box-shadow: 0 24px 60px rgba(42,83,162,0.28);
}
.pricing-card.featured:hover { transform: translateY(-14px); }
.badge-featured {
    position: absolute;
    top: -16px;
    left: 50%;
    transform: translateX(-50%);
    background: #06F2AA;
    color: #0E1A2A;
    font-size: 1.2rem;
    font-weight: 700;
    padding: 4px 18px;
    border-radius: 20px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: nowrap;
}
.pricing-card .plan-name {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 8px;
    color: #0E1A2A;
}
.pricing-card.featured .plan-name { color: #fff; }
.pricing-card .plan-price {
    font-size: 4.8rem;
    font-weight: 700;
    line-height: 1;
    color: #2A53A2;
    margin-bottom: 4px;
}
.pricing-card.featured .plan-price { color: #06F2AA; }
.pricing-card .plan-price sup {
    font-size: 2.4rem;
    vertical-align: super;
    font-weight: 600;
}
.pricing-card .plan-period {
    font-size: 1.5rem;
    color: #7a8898;
    margin-bottom: 28px;
}
.pricing-card.featured .plan-period { color: rgba(255,255,255,0.7); }
.pricing-divider {
    border: none;
    border-top: 1px solid #e8edf5;
    margin: 0 0 24px;
}
.pricing-card.featured .pricing-divider { border-color: rgba(255,255,255,0.2); }
.feature-list { list-style: none; padding: 0; margin: 0 0 32px; flex: 1; }
.feature-list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 14px;
    font-size: 1.6rem;
    color: #444;
}
.pricing-card.featured .feature-list li { color: rgba(255,255,255,0.9); }
.feature-list .check-icon {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    background: #06F2AA;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 2px;
}
.pricing-card.featured .feature-list .check-icon { background: rgba(255,255,255,0.2); }
.pricing-card .btn-plan {
    display: block;
    text-align: center;
    padding: 13px 24px;
    border-radius: 8px;
    font-size: 1.6rem;
    font-weight: 600;
    transition: all 0.2s ease;
    text-decoration: none;
}
.btn-plan-outline {
    border: 2px solid #2A53A2;
    color: #2A53A2;
    background: transparent;
}
.btn-plan-outline:hover { background: #2A53A2; color: #fff; }
.btn-plan-featured {
    background: #06F2AA;
    color: #0E1A2A;
    border: 2px solid #06F2AA;
}
.btn-plan-featured:hover { background: transparent; color: #06F2AA; }

/* ── Add-on callout ─────────────────────────────────── */
.addon-callout {
    background: #fff;
    border-radius: 12px;
    border: 2px dashed #2A53A2;
    padding: 24px 32px;
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}

/* ── Section headings ──────────────────────────────── */
.section-label {
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #33E3FF;
    margin-bottom: 10px;
}
.table-section-title {
    font-size: 2.6rem;
    font-weight: 700;
    color: #0E1A2A;
    margin-bottom: 6px;
}

/* ── Styled Tables ─────────────────────────────────── */
.styled-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(42,83,162,0.08);
    font-size: 1.5rem;
}
.styled-table thead tr { background: #2A53A2; color: #fff; }
.styled-table thead th {
    padding: 16px 20px;
    font-weight: 600;
    font-size: 1.45rem;
    border: none;
    white-space: nowrap;
}
.styled-table thead th:first-child { border-radius: 12px 0 0 0; }
.styled-table thead th:last-child  { border-radius: 0 12px 0 0; }
.styled-table tbody tr { background: #fff; transition: background 0.15s ease; }
.styled-table tbody tr:nth-child(even) { background: #f4f7fc; }
.styled-table tbody tr:hover { background: #e8f0fc; }
.styled-table tbody td {
    padding: 15px 20px;
    border-bottom: 1px solid #e8edf5;
    color: #333;
    vertical-align: middle;
}
.styled-table tbody tr:last-child td { border-bottom: none; }
.styled-table tbody td:first-child { font-weight: 500; color: #0E1A2A; }
.styled-table .cell-sub { font-size: 1.3rem; color: #6c757d; }
.styled-table .highlight-row {
    background: linear-gradient(90deg, rgba(42,83,162,0.07) 0%, rgba(6,242,170,0.05) 100%);
}
.styled-table .highlight-row:hover {
    background: linear-gradient(90deg, rgba(42,83,162,0.13) 0%, rgba(6,242,170,0.1) 100%);
}
.tag-per-user {
    display: inline-block;
    background: rgba(42,83,162,0.1);
    color: #2A53A2;
    font-size: 1.2rem;
    font-weight: 600;
    padding: 2px 10px;
    border-radius: 20px;
}
.discount-pill {
    color: #06F2AA;
    font-weight: 700;
    background: #0E1A2A;
    padding: 2px 10px;
    border-radius: 20px;
    font-size: 1.3rem;
}
.table-card {
    background: #fff;
    border-radius: 16px;
    padding: 36px;
    box-shadow: 0 4px 24px rgba(42,83,162,0.07);
    margin-bottom: 36px;
}
.table-card-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 24px;
}
.table-card-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: #2A53A2;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* ── Discount Banner ───────────────────────────────── */
.discount-banner {
    background: linear-gradient(135deg, #2A53A2 0%, #1a3a7a 100%);
    border-radius: 16px;
    padding: 40px;
    color: #fff;
    margin-bottom: 36px;
}
.discount-banner .discount-badge {
    display: inline-block;
    background: #06F2AA;
    color: #0E1A2A;
    font-size: 1.4rem;
    font-weight: 800;
    padding: 6px 20px;
    border-radius: 30px;
    margin-bottom: 16px;
}

/* ── Help resource cards ───────────────────────────── */
.help-card {
    background: #fff;
    border: 2px solid #e8edf5;
    border-radius: 16px;
    padding: 32px 28px;
    height: 100%;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    text-align: center;
}
.help-card:hover {
    border-color: #2A53A2;
    box-shadow: 0 8px 28px rgba(42,83,162,0.1);
}

/* ══════════════════════════════════════════════════════════════
   Homepage — How It Works step cards
   ══════════════════════════════════════════════════════════════ */
.step-card { position: relative; overflow: visible; }
.step-num {
    position: absolute;
    top: -18px;
    left: 50%;
    transform: translateX(-50%);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #06F2AA;
    color: #0E1A2A;
    font-size: 1.6rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ══════════════════════════════════════════════════════════════
   Homepage — Software Showcase feature grid
   ══════════════════════════════════════════════════════════════ */
.showcase-card {
    background: #fff;
    border: 2px solid #e8edf5;
    border-radius: 16px;
    padding: 32px 28px;
    height: 100%;
    text-align: center;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.showcase-card:hover {
    border-color: #2A53A2;
    box-shadow: 0 8px 28px rgba(42,83,162,0.1);
    transform: translateY(-4px);
}
.feat-icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: #2A53A2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

/* ══════════════════════════════════════════════════════════════
   About Page — Intro pills
   ══════════════════════════════════════════════════════════════ */
.hero-pill {
    display: inline-block;
    padding: 8px 20px;
    border-radius: 30px;
    border: 1px solid #d6e2f5;
    background: #eef3fb;
    color: #0E1A2A;
    font-size: 1.4rem;
    font-weight: 600;
}

/* ══════════════════════════════════════════════════════════════
   Homepage — Comparison Table (Breeze AI vs. the Competition)
   ══════════════════════════════════════════════════════════════ */
.styled-table.comparison-table thead th:nth-child(2),
.styled-table.comparison-table tbody td:nth-child(2) {
    background: rgba(6,242,170,0.1);
}
.styled-table.comparison-table tbody tr:nth-child(even) td:nth-child(2) {
    background: rgba(6,242,170,0.16);
}
.cmp-yes {
    color: #0a8f5c;
    font-weight: 700;
}
.cmp-no {
    color: #c0392b;
    font-weight: 500;
}
.cmp-mut {
    color: #8a94a3;
}

/* ══════════════════════════════════════════════════════════════
   Homepage — Stats Counters ("Proof That It Works")
   ══════════════════════════════════════════════════════════════ */
.stats-section {
    background: linear-gradient(135deg, #2A53A2 0%, #16224a 100%);
}
.stat-card {
    text-align: center;
    padding: 0 20px;
    position: relative;
}
.stat-divider::before {
    content: '';
    position: absolute;
    left: 0;
    top: 10px;
    bottom: 10px;
    width: 1px;
    background: rgba(255,255,255,0.15);
}
.stat-number {
    font-size: 5.2rem;
    font-weight: 700;
    color: #33E3FF;
    line-height: 1;
    margin-bottom: 12px;
}
.stat-number span { font-size: 3rem; }
.stat-title {
    font-size: 2rem;
    font-weight: 600;
    color: #fff;
    margin-bottom: 12px;
}
.stat-desc {
    font-size: 1.5rem;
    color: rgba(255,255,255,0.65);
    margin: 0;
}
@media (max-width: 767px) {
    .stat-divider::before { display: none; }
}

/* ══════════════════════════════════════════════════════════════
   Homepage — Pricing Teaser Grid
   ══════════════════════════════════════════════════════════════ */
.price-teaser {
    background: #fff;
    border: 2px solid #e8edf5;
    border-radius: 16px;
    padding: 40px 36px;
    height: 100%;
    text-align: center;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.price-teaser:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 50px rgba(42,83,162,0.12);
}
.price-teaser.featured {
    background: #2A53A2;
    border-color: #2A53A2;
    color: #fff;
}
.pt-name {
    font-size: 2rem;
    font-weight: 700;
    color: #0E1A2A;
    margin-bottom: 8px;
}
.price-teaser.featured .pt-name { color: #fff; }
.pt-price {
    font-size: 4.4rem;
    font-weight: 700;
    color: #2A53A2;
    line-height: 1;
}
.price-teaser.featured .pt-price { color: #06F2AA; }
.pt-price sup {
    font-size: 2.2rem;
    vertical-align: super;
    font-weight: 600;
}
.pt-period {
    font-size: 1.4rem;
    color: #7a8898;
    margin-bottom: 20px;
}
.price-teaser.featured .pt-period { color: rgba(255,255,255,0.7); }
.pt-desc {
    font-size: 1.5rem;
    color: #555;
    margin-bottom: 28px;
}
.price-teaser.featured .pt-desc { color: rgba(255,255,255,0.85); }

/* ── Brand prominence (Sept 2026 adjustments) ───────── */
/* Larger header logo on desktop; mobile sizes stay in css/responsive.css */
@media (min-width: 992px) {
    #header .navbar-brand .header-logo { height: 62px; width: auto; }
}
/* Home hero eyebrow "AI Electrical Takeoff & Estimating" — larger and more dominant */
.home-banner .section-label.hero-label { font-size: 2.2rem; font-weight: 800; letter-spacing: 0.08em; margin-bottom: 14px; }
@media (max-width: 767px) { .home-banner .section-label.hero-label { font-size: 1.6rem; } }

/* Keep Log In + Request Demo on one line at every width (was wrapping in Firefox once the nav grew to 9 items). */
.header-cta-group { white-space: nowrap; }

/* Logo must never shrink away — it was getting squeezed out once the desktop nav row ran tight on space. */
.navbar-brand { flex-shrink: 0; }

/* Smaller Log In / Request Demo buttons in the header only — full .btn size was crowding the row and getting clipped by the scrollbar on the right. */
.header-cta-group .btn { font-size: 1.4rem; padding: 9px 18px; }
