﻿/* Main site refresh: shop-style light conversion theme */
:root {
    --primary: #2563eb;
    --primary-2: #06b6d4;
    --accent: #f97316;
    --accent-2: #a855f7;
    --dark: #0f172a;
    --light-dark: #f8fafc;
    --white: #ffffff;
    --gio-text: #0f172a;
    --gio-muted: #526071;
    --gio-border: #bfdbfe;
    --gio-soft: #f8fbff;
    --gio-card: rgba(255,255,255,0.9);
    --gio-shadow: 0 24px 60px rgba(37,99,235,0.14);
    --gio-gradient: linear-gradient(135deg, #2563eb 0%, #06b6d4 55%, #14b8a6 100%);
    --gio-warm-gradient: linear-gradient(135deg, #f97316 0%, #ec4899 50%, #8b5cf6 100%);
}

html,
body {
    background: linear-gradient(135deg, #ecfeff 0%, #eff6ff 43%, #faf5ff 72%, #fff7ed 100%) !important;
    color: var(--gio-text) !important;
}

body,
p,
li,
label,
input,
select,
textarea {
    color: var(--gio-text);
}

a {
    color: #2563eb;
}

.giocondo-header {
    background: rgba(255,255,255,0.94) !important;
    border-bottom: 1px solid #dbeafe !important;
    box-shadow: 0 10px 30px rgba(15,23,42,0.07) !important;
    backdrop-filter: blur(18px);
}

.top-bar {
    background: linear-gradient(90deg, #2563eb, #06b6d4, #f97316) !important;
    border: 0 !important;
    color: #fff !important;
}

.top-bar a,
.top-bar span,
.contact-info span,
.command-menu span {
    color: #fff !important;
}

.cmd-link {
    background: rgba(255,255,255,0.2) !important;
    border: 1px solid rgba(255,255,255,0.36) !important;
    color: #fff !important;
}

.brand-bar {
    background: rgba(255,255,255,0.96) !important;
}

.logo,
.footer-logo {
    color: var(--gio-text) !important;
    letter-spacing: 0.12em;
}

.logo span,
.footer-logo span {
    color: #06b6d4 !important;
}

.trust-item,
.trust-item span {
    color: #334155 !important;
}

.trust-item i {
    color: #2563eb !important;
}

.main-nav {
    background: rgba(248,250,252,0.96) !important;
    border-top: 1px solid #e0f2fe !important;
    border-bottom: 1px solid #bfdbfe !important;
}

.nav-menu > li > a,
.nav-menu > li > button:not(.quote-btn),
.nav-menu li a {
    color: #0f172a !important;
}

.nav-menu > li > a:hover,
.nav-menu > li > button:hover:not(.quote-btn),
.nav-menu li a:hover,
.nav-menu li.active > a {
    color: #2563eb !important;
    background: #eff6ff !important;
}

.nav-menu li a::after {
    background: linear-gradient(90deg, #2563eb, #06b6d4) !important;
}

.dropdown-menu,
.mega-menu,
.mega-dropdown,
.submenu {
    background: rgba(255,255,255,0.98) !important;
    border: 1px solid #bfdbfe !important;
    box-shadow: var(--gio-shadow) !important;
}

.dropdown-menu a,
.mega-menu a,
.mega-dropdown a,
.submenu a {
    color: #0f172a !important;
    background: transparent !important;
}

.dropdown-menu a:hover,
.mega-menu a:hover,
.mega-dropdown a:hover,
.submenu a:hover {
    background: #eff6ff !important;
    color: #2563eb !important;
}

.ai-btn,
.quote-btn,
.btn-primary,
.btn-gold,
.btn-site-visit,
.btn-calc-trigger,
.reviews-btn,
.track-btn,
.submit-btn,
.modal-content button,
button[type="submit"] {
    background: var(--gio-gradient) !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 14px !important;
    box-shadow: 0 14px 30px rgba(37,99,235,0.22) !important;
}

.btn-primary:hover,
.btn-gold:hover,
.quote-btn:hover,
.ai-btn:hover,
.submit-btn:hover,
button[type="submit"]:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 40px rgba(6,182,212,0.24) !important;
}

.btn-outline,
.btn-outline-white,
.btn-secondary {
    background: #fff !important;
    border: 1px solid #bfdbfe !important;
    color: #2563eb !important;
    border-radius: 14px !important;
}

.hero-slider-enhanced,
.hero-section,
.page-hero,
.service-hero,
.portfolio-hero,
.contact-hero,
.about-hero {
    background: linear-gradient(135deg, #cffafe 0%, #eff6ff 48%, #fdf2f8 100%) !important;
    color: var(--gio-text) !important;
}

.slide-overlay {
    background: linear-gradient(90deg, rgba(15,23,42,0.58), rgba(15,23,42,0.12)) !important;
}

.slide .hero-content h1,
.slide .hero-content p,
.slide .hero-content .hero-subtitle {
    color: #fff !important;
}

.hero-content h1,
.section-title,
.page-title,
h1,
h2,
h3 {
    color: var(--gio-text) !important;
}

.hero-content h1 span,
.section-title span,
.hero-subtitle,
.eyebrow,
.pretitle,
.section-kicker {
    color: #2563eb !important;
}

.section-title::after,
.page-title::after,
.section-heading::after {
    background: var(--gio-gradient) !important;
}

.stats-bar,
.tech-lab,
.calculator-section,
.reviews-section,
.tracker-section,
.shop-promo-banner,
.ai-recommender-section,
.services-section,
.portfolio-section,
.process-section,
.clients-section,
.blog-section,
.contact-section,
.about-section {
    background: transparent !important;
    color: var(--gio-text) !important;
}

.stat-item,
.tech-card,
.calc-card,
.review-card,
.tracker-card,
.ai-card,
.service-card,
.portfolio-card,
.project-card,
.blog-card,
.client-card,
.process-card,
.feature-card,
.info-card,
.contact-card,
.form-card,
.project-detail-grid,
.service-form-container,
.modal-content,
.filter-card,
.quote-card,
.why-card {
    background: var(--gio-card) !important;
    color: var(--gio-text) !important;
    border: 1px solid var(--gio-border) !important;
    border-radius: 24px !important;
    box-shadow: var(--gio-shadow) !important;
}

.tech-card:hover,
.service-card:hover,
.portfolio-card:hover,
.project-card:hover,
.blog-card:hover,
.feature-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 30px 70px rgba(37,99,235,0.2) !important;
}

.tech-card h3,
.service-card h3,
.portfolio-card h3,
.tracker-card h3,
.review-card h3,
.footer-col h4,
.info-card h3,
.contact-card h3,
.blog-card h3 {
    color: #0f172a !important;
}

.tech-card p,
.service-card p,
.portfolio-card p,
.tracker-card p,
.review-card p,
.section-subtitle,
.section-header p,
.footer-desc,
.muted,
.text-muted {
    color: var(--gio-muted) !important;
}

.icon-box,
.service-icon,
.feature-icon,
.stat-icon,
.calc-icon {
    background: var(--gio-gradient) !important;
    color: #fff !important;
    border-radius: 16px !important;
}

input,
select,
textarea,
.modal-content input,
.modal-content select,
.modal-content textarea {
    background: #fff !important;
    color: #0f172a !important;
    border: 1px solid #bfdbfe !important;
    border-radius: 14px !important;
}

input:focus,
select:focus,
textarea:focus {
    border-color: #06b6d4 !important;
    box-shadow: 0 0 0 4px rgba(6,182,212,0.14) !important;
}

table,
.table,
.admin-table {
    background: #fff !important;
    color: #0f172a !important;
    border-color: #dbeafe !important;
}

th {
    background: #eff6ff !important;
    color: #0f172a !important;
}

td {
    color: #334155 !important;
}

.giocondo-footer {
    background: linear-gradient(135deg, #f8fbff 0%, #ecfeff 55%, #fff7ed 100%) !important;
    color: var(--gio-text) !important;
    border-top: 1px solid #bfdbfe !important;
}

.footer-col ul li a,
.footer-contact li,
.footer-contact li a,
.footer-bottom p {
    color: #334155 !important;
}

.footer-social a,
.scroll-to-top,
.chatbot-toggle-icon,
.send-btn,
.wa-sticky-cta {
    background: var(--gio-gradient) !important;
    color: #fff !important;
}

.chatbot-widget,
.email-modal-content {
    background: #fff !important;
    color: #0f172a !important;
    border: 1px solid #bfdbfe !important;
    box-shadow: var(--gio-shadow) !important;
}

.chatbot-header {
    background: var(--gio-gradient) !important;
    color: #fff !important;
}

.chatbot-toggle-bubble,
.wa-sticky-bar {
    background: rgba(255,255,255,0.96) !important;
    color: #0f172a !important;
    border: 1px solid #bfdbfe !important;
    box-shadow: var(--gio-shadow) !important;
}

.message-bubble.bot {
    background: #eff6ff !important;
    color: #0f172a !important;
}

.message-bubble.user {
    background: var(--gio-gradient) !important;
    color: #fff !important;
}

.chatbot-input input {
    background: #fff !important;
    color: #0f172a !important;
}

.badge,
.tag,
.pill,
.category-tag {
    background: #eff6ff !important;
    color: #2563eb !important;
    border: 1px solid #bfdbfe !important;
}

@media (max-width: 992px) {
    .top-bar {
        display: none !important;
    }

    .brand-bar-inner {
        align-items: center !important;
    }

    .trust-badges {
        display: none !important;
    }

    .menu-toggle {
        background: #eff6ff !important;
        color: #2563eb !important;
        border: 1px solid #bfdbfe !important;
        border-radius: 12px !important;
        padding: 10px 12px !important;
    }

    .nav-menu {
        background: #fff !important;
        border-left: 1px solid #bfdbfe !important;
        box-shadow: -20px 0 60px rgba(37,99,235,0.14) !important;
    }

    .nav-menu li a,
    .nav-menu li button {
        background: #f8fbff !important;
        border: 1px solid #dbeafe !important;
        border-radius: 14px !important;
        color: #0f172a !important;
        margin-bottom: 8px !important;
    }

    .dropdown-menu,
    .mega-menu,
    .mega-dropdown,
    .submenu {
        background: #f8fbff !important;
        box-shadow: none !important;
        border: 1px solid #dbeafe !important;
    }

    .hero-content h1,
    h1 {
        font-size: clamp(36px, 12vw, 58px) !important;
        line-height: 1.02 !important;
    }
}

/* v20260626-main-refresh-2: late overrides for legacy black/gold page templates */
.about-page-compact,
.contact-page-compact,
.industries-page,
.industry-page,
.service-page,
.portfolio-page,
.clients-page,
.tracker-page,
.brochure-page,
.blog-post-wrapper,
.about-page-compact section,
.contact-page-compact section,
.industry-hub-grid,
.mission-section-compact,
.about-journey-compact,
.contact-info-compact,
.map-compact,
.cta-banner,
.reviews-section,
.faq-section {
    background: transparent !important;
    color: var(--gio-text) !important;
}

.about-hero-compact,
.contact-hero-compact,
.industries-hero,
.education-hero,
.healthcare-hero,
.corporate-hero,
.retail-hero,
.hospitality-hero,
.industrial-hero,
.events-hero,
.banking-hero,
.logistics-hero,
.government-hero,
.automotive-hero,
.service-hero,
.page-hero {
    background:
        radial-gradient(circle at 12% 18%, rgba(6,182,212,0.22), transparent 28%),
        radial-gradient(circle at 88% 12%, rgba(236,72,153,0.18), transparent 30%),
        linear-gradient(135deg, #ecfeff 0%, #eff6ff 48%, #fdf2f8 100%) !important;
    color: var(--gio-text) !important;
    border-bottom: 1px solid #bfdbfe !important;
}

.about-hero-compact h1,
.contact-hero-compact h1,
.industries-hero h1,
.education-hero h1,
.healthcare-hero h1,
.corporate-hero h1,
.retail-hero h1,
.hospitality-hero h1,
.industrial-hero h1,
.events-hero h1,
.banking-hero h1,
.logistics-hero h1,
.government-hero h1,
.automotive-hero h1,
.service-hero h1,
.page-hero h1,
.journey-content h2,
.contact-details h2,
.cta-banner h2 {
    color: #0f172a !important;
    text-shadow: none !important;
}

.gold-text,
.gold,
.industries-hero h1 .gold-text,
.about-hero-compact .gold-text,
.contact-hero-compact .gold-text,
.journey-content .gold-text,
.contact-details .gold-text,
h1 .gold-text,
h2 .gold-text,
h3 .gold-text {
    color: #2563eb !important;
    background: linear-gradient(135deg, #2563eb 0%, #06b6d4 55%, #ec4899 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.hero-badge,
.badge-gold,
.pre-title,
.section-badge,
.eyebrow {
    background: rgba(37,99,235,0.1) !important;
    color: #2563eb !important;
    border: 1px solid #bfdbfe !important;
    border-radius: 999px !important;
}

.about-hero-compact p,
.contact-hero-compact p,
.industries-hero p,
.journey-content p,
.contact-details p,
.cta-banner p,
.card-content p,
.mission-card p,
.info-item p,
.info-item span,
.industry-hub-card p {
    color: #526071 !important;
}

.journey-image img,
.card-image img,
.portfolio-card img,
.project-card img,
.service-image img {
    border-color: #bfdbfe !important;
    box-shadow: 0 24px 60px rgba(37,99,235,0.16) !important;
}

.mission-card,
.industry-hub-card,
.contact-form-container,
.info-item,
.map-wrapper,
.blog-post-content,
.post-cta-box,
.industry-card,
.solution-card,
.benefit-card,
.project-showcase-card,
.testimonial-card,
.process-step,
.feature-box {
    background: rgba(255,255,255,0.92) !important;
    color: #0f172a !important;
    border: 1px solid #bfdbfe !important;
    border-radius: 24px !important;
    box-shadow: 0 24px 60px rgba(37,99,235,0.13) !important;
}

.mission-card:hover,
.industry-hub-card:hover,
.info-item:hover,
.industry-card:hover,
.solution-card:hover,
.benefit-card:hover {
    border-color: #06b6d4 !important;
    box-shadow: 0 30px 70px rgba(6,182,212,0.2) !important;
}

.mission-card i,
.info-item i,
.card-btn,
.journey-stats .stat strong,
.contact-details i,
.industry-hub-card .card-btn {
    color: #2563eb !important;
}

.social-links-large a,
.footer-social a,
.contact-social a {
    background: var(--gio-gradient) !important;
    color: #fff !important;
    border: 0 !important;
}

.contact-form-modern,
.contact-form,
.quote-form,
.lead-form {
    background: rgba(255,255,255,0.92) !important;
    color: #0f172a !important;
}

.contact-form-modern input,
.contact-form-modern select,
.contact-form-modern textarea,
.contact-form input,
.contact-form select,
.contact-form textarea {
    background: #fff !important;
    color: #0f172a !important;
    border: 1px solid #bfdbfe !important;
}

.btn-gold,
.btn-primary,
.contact-form-modern .btn-primary,
.cta-banner .btn-gold,
.post-cta-box .btn-primary {
    background: var(--gio-gradient) !important;
    color: #fff !important;
    border: 0 !important;
}

.btn-gold:hover,
.btn-primary:hover,
.contact-form-modern .btn-primary:hover,
.cta-banner .btn-gold:hover {
    background: linear-gradient(135deg, #1d4ed8 0%, #0891b2 55%, #0d9488 100%) !important;
    color: #fff !important;
}

.page-dark,
.dark-section,
section[style*="background: #050505"],
section[style*="background:#050505"],
section[style*="background: #000"],
section[style*="background:#000"],
div[style*="background: #050505"],
div[style*="background:#050505"],
div[style*="background: #000"],
div[style*="background:#000"] {
    background: transparent !important;
    color: #0f172a !important;
}

.nav-menu .nav-highlight a {
    background: linear-gradient(135deg, rgba(37,99,235,0.08), rgba(6,182,212,0.1)) !important;
    border-color: #bfdbfe !important;
    color: #0f172a !important;
}

.nav-menu .nav-highlight a:hover {
    background: var(--gio-gradient) !important;
    color: #fff !important;
    border-color: transparent !important;
}

@media (max-width: 768px) {
    .about-hero-compact,
    .contact-hero-compact,
    .industries-hero,
    .service-hero,
    .page-hero {
        padding: 48px 0 38px !important;
    }

    .journey-grid,
    .contact-grid,
    .mission-grid,
    .grid-container {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    .mission-card,
    .industry-hub-card,
    .contact-form-container,
    .info-item {
        border-radius: 18px !important;
    }
}

/* v20260627-main-refresh-5: complete public page color unification */
:root {
    --gio-primary: #2563eb;
    --gio-cyan: #06b6d4;
    --gio-teal: #14b8a6;
    --gio-pink: #ec4899;
    --gio-violet: #8b5cf6;
    --gio-ink: #0f172a;
    --gio-soft-bg: linear-gradient(135deg, #ecfeff 0%, #eff6ff 46%, #fdf2f8 76%, #fff7ed 100%);
    --gio-button: linear-gradient(135deg, #2563eb 0%, #06b6d4 52%, #14b8a6 100%);
    --gio-accent: linear-gradient(135deg, #2563eb 0%, #06b6d4 48%, #ec4899 100%);
}

html body {
    background: var(--gio-soft-bg) !important;
}

/* cover all service, portfolio, clients and industry templates named in the menu */
body:has(a[href="/led-signs.php"]),
.led-page,
.metal-page,
.industrial-page,
.interior-page,
.acp-page,
.clients-page,
.portfolio-page,
.industry-page,
.industry-detail-page,
.service-detail-page {
    color: var(--gio-ink) !important;
}

.led-hero,
.metal-hero,
.fabrication-hero,
.interior-hero,
.acp-hero,
.portfolio-hero,
.clients-hero,
.industry-hero,
.industry-detail-hero,
.education-hero,
.healthcare-hero,
.corporate-hero,
.retail-hero,
.hospitality-hero,
.industrial-hero,
.realestate-hero,
.events-hero,
.banking-hero,
.logistics-hero,
.government-hero,
.automotive-hero,
[class*="-hero"] {
    background:
        radial-gradient(circle at 15% 18%, rgba(6,182,212,0.22), transparent 28%),
        radial-gradient(circle at 85% 10%, rgba(236,72,153,0.16), transparent 30%),
        linear-gradient(135deg, #ecfeff 0%, #eff6ff 48%, #fdf2f8 100%) !important;
    color: var(--gio-ink) !important;
    border-bottom: 1px solid #bfdbfe !important;
}

[class*="-hero"] h1,
[class*="-hero"] h2,
[class*="-hero"] p,
.page-hero h1,
.page-hero p {
    color: var(--gio-ink) !important;
    text-shadow: none !important;
}

/* remove visible gold/yellow from public UI accents */
.gold,
.gold-text,
.badge-gold,
.yellow,
[class*="gold"],
[style*="#FFD700"],
[style*="#ffd700"],
[style*="color: #FFD700"],
[style*="color:#FFD700"],
[style*="color: var(--primary)"] {
    color: var(--gio-primary) !important;
    border-color: #bfdbfe !important;
    -webkit-text-fill-color: currentColor !important;
}

[style*="background:#FFD700"],
[style*="background: #FFD700"],
[style*="background:#ffd700"],
[style*="background: #ffd700"],
[style*="background: var(--primary)"] {
    background: var(--gio-button) !important;
    color: #fff !important;
}

/* homepage shop catalogue, tick icons and feature icons */
.shop-promo-banner span i,
.shop-promo-banner .fa-check-circle,
.fa-check-circle,
.fa-star,
.stars,
.review-stars,
.rating-stars,
.tech-icon i,
.tech-icon,
.tech-card i,
.feature-icon i {
    color: var(--gio-primary) !important;
}

.shop-promo-banner span,
.shop-promo-banner,
.legacy-shop-promo,
.online-store-section {
    background: transparent !important;
    color: var(--gio-ink) !important;
}

.tech-icon,
.icon-circle,
.service-icon,
.feature-icon,
.card-icon,
.industry-icon {
    background: var(--gio-accent) !important;
    color: #fff !important;
    border: 0 !important;
    box-shadow: 0 18px 42px rgba(37,99,235,0.18) !important;
}

.tech-icon i,
.icon-circle i,
.service-icon i,
.feature-icon i,
.card-icon i,
.industry-icon i {
    color: #fff !important;
}

/* AI recommender and calculator: no dark panels */
.ai-recommender-section,
.calculator-section,
.reviews-section,
.tracker-section,
.tech-lab,
.smart-tools-section,
.cost-calculator-section {
    background: transparent !important;
    color: var(--gio-ink) !important;
    border-color: #bfdbfe !important;
}

.ai-card,
.calc-card,
.ai-inputs,
.ai-result,
.calc-inputs,
.calc-result,
.review-card,
.tracker-card,
.tool-card,
.tech-card,
.ai-result-card {
    background: rgba(255,255,255,0.92) !important;
    color: var(--gio-ink) !important;
    border: 1px solid #bfdbfe !important;
    border-radius: 24px !important;
    box-shadow: 0 24px 60px rgba(37,99,235,0.14) !important;
}

.ai-result-card i {
    color: var(--gio-primary, #2563eb) !important;
}

.ai-card label,
.calc-card label,
.res-label,
.ai-progress-text,
.calc-note,
.review-text,
.review-author,
.ai-result-card h4,
.ai-result-card p {
    color: var(--gio-ink) !important;
}

.ai-progress-bar {
    background: #dbeafe !important;
}

.ai-progress-fill,
.ai-dots span {
    background: var(--gio-button) !important;
}

.ai-option,
.calc-card select,
.calc-card input,
.calc-card textarea,
.calculator-section select,
.calculator-section input {
    background: #fff !important;
    color: var(--gio-ink) !important;
    border: 1px solid #bfdbfe !important;
    border-radius: 14px !important;
}

.ai-option:hover,
.ai-option.selected {
    background: linear-gradient(135deg, rgba(37,99,235,0.1), rgba(6,182,212,0.12)) !important;
    color: var(--gio-primary) !important;
    border-color: var(--gio-cyan) !important;
}

#totalPrice,
.calc-result h2,
.ai-price {
    color: var(--gio-primary) !important;
}

/* service pages and industry pages cards */
.service-card,
.service-block,
.service-feature,
.portfolio-card,
.client-card,
.industry-card,
.industry-hub-card,
.solution-card,
.material-card,
.process-card,
.why-card,
.benefit-card,
.case-card,
.project-card,
.gallery-card,
.testimonial-card,
.stat-card,
.value-card,
.mission-card,
.vision-card {
    background: rgba(255,255,255,0.92) !important;
    color: var(--gio-ink) !important;
    border: 1px solid #bfdbfe !important;
    border-radius: 24px !important;
    box-shadow: 0 24px 60px rgba(37,99,235,0.12) !important;
}

.service-card h3,
.service-block h3,
.portfolio-card h3,
.client-card h3,
.industry-card h3,
.solution-card h3,
.material-card h3,
.process-card h3,
.why-card h3,
.benefit-card h3,
.case-card h3,
.project-card h3,
.testimonial-card h3,
.stat-card h3 {
    color: var(--gio-ink) !important;
}

.service-card p,
.service-block p,
.portfolio-card p,
.client-card p,
.industry-card p,
.solution-card p,
.material-card p,
.process-card p,
.why-card p,
.benefit-card p,
.case-card p,
.project-card p,
.testimonial-card p,
.stat-card p {
    color: #526071 !important;
}

/* review stars use blue/pink instead of yellow */
.stars i,
.review-stars i,
.rating-stars i,
.fa-star,
.fa-star-half-alt {
    color: var(--gio-violet) !important;
    text-shadow: none !important;
}

/* dark legacy sections from individual pages */
.hero-dark,
.section-dark,
.black-section,
.dark-band,
.premium-dark,
.about-page-compact,
.contact-page-compact,
.industry-hub-grid,
.cta-banner,
.blog-post-wrapper,
section[style*="#050505"],
section[style*="#000"],
div[style*="#050505"],
div[style*="#000"] {
    background: transparent !important;
    color: var(--gio-ink) !important;
}

.btn-primary,
.btn-gold,
.btn-site-visit,
.btn-calc-trigger,
.reviews-btn,
.track-btn,
.quote-btn,
.submit-btn,
.shimmer-btn,
.ai-wa-btn,
button[type="submit"] {
    background: var(--gio-button) !important;
    color: #fff !important;
    border: 0 !important;
}

.btn-outline,
.btn-outline-white,
.btn-secondary {
    background: #fff !important;
    color: var(--gio-primary) !important;
    border: 1px solid #bfdbfe !important;
}

/* make embedded dark forms readable */
form input,
form select,
form textarea {
    background: #fff !important;
    color: var(--gio-ink) !important;
    border-color: #bfdbfe !important;
}

@media (max-width: 768px) {
    .ai-card,
    .calc-card,
    .reviews-container,
    .service-card,
    .industry-card,
    .portfolio-card,
    .client-card {
        border-radius: 18px !important;
    }
}

/* v13: hard theme reset loaded from the real stylesheet, not only footer */
:root {
    --gio-ink: #071226;
    --gio-muted: #506078;
    --gio-blue: #2563eb;
    --gio-sky: #06b6d4;
    --gio-teal: #14b8a6;
    --gio-pink: #db5eb7;
    --gio-line: rgba(37, 99, 235, 0.18);
    --gio-card-shadow: 0 26px 80px rgba(37, 99, 235, 0.12);
    --gio-bright-bg:
        radial-gradient(circle at 8% 12%, rgba(20,184,166,0.18), transparent 34%),
        radial-gradient(circle at 86% 18%, rgba(219,94,183,0.16), transparent 34%),
        linear-gradient(135deg, #f8fffe 0%, #e9fbff 48%, #fff7f1 100%);
    --gio-bright-section:
        radial-gradient(circle at 12% 16%, rgba(6,182,212,0.16), transparent 34%),
        radial-gradient(circle at 88% 14%, rgba(219,94,183,0.14), transparent 32%),
        linear-gradient(135deg, rgba(239,253,255,0.96), rgba(255,247,252,0.9));
}

html,
body,
main,
.main,
.page,
.page-wrapper,
.site-main,
.content-wrapper,
.page-content {
    background: var(--gio-bright-bg) !important;
    color: var(--gio-ink) !important;
}

.hero-dark,
.section-dark,
.dark-section,
.black-section,
.dark-band,
.premium-dark,
.service-hero,
.service-section,
.industry-hero,
.industry-section,
.page-hero,
.portfolio-hero,
.clients-hero,
.blog-hero,
.contact-hero,
.about-hero,
.masterpiece-hero,
.calculator-section,
.reviews-section,
.tracker-section,
.ai-recommender-section,
.ai-recommender-sec,
.stats-bar,
.tech-lab,
.story-section,
.why-section,
.solutions-section,
.industries-section,
.legacy-section,
.about-page-compact,
.contact-page-compact,
.industry-hub-grid,
.cta-banner,
.blog-post-wrapper,
section[style*="background:#000"],
section[style*="background: #000"],
section[style*="background:#050505"],
section[style*="background: #050505"],
section[style*="background:#060606"],
section[style*="background: #060606"],
section[style*="background:#080808"],
section[style*="background: #080808"],
section[style*="background:#0a0a0a"],
section[style*="background: #0a0a0a"],
section[style*="background:#111"],
section[style*="background: #111"],
div[style*="background:#000"],
div[style*="background: #000"],
div[style*="background:#050505"],
div[style*="background: #050505"],
div[style*="background:#060606"],
div[style*="background: #060606"],
div[style*="background:#080808"],
div[style*="background: #080808"],
div[style*="background:#0a0a0a"],
div[style*="background: #0a0a0a"],
div[style*="background:#111"],
div[style*="background: #111"] {
    background: var(--gio-bright-section) !important;
    color: var(--gio-ink) !important;
}

.service-hero,
.industry-hero,
.page-hero,
.portfolio-hero,
.clients-hero,
.blog-hero,
.contact-hero,
.about-hero,
.masterpiece-hero {
    min-height: auto !important;
    padding: clamp(70px, 10vw, 120px) 20px !important;
}

.service-hero::before,
.industry-hero::before,
.page-hero::before,
.portfolio-hero::before,
.clients-hero::before,
.blog-hero::before,
.contact-hero::before,
.about-hero::before,
.masterpiece-hero::before,
.hero-dark::before,
.section-dark::before,
.dark-section::before,
.black-section::before {
    background: linear-gradient(135deg, rgba(255,255,255,0.86), rgba(238,249,255,0.94)) !important;
    opacity: .94 !important;
}

.service-hero img,
.industry-hero img,
.page-hero img,
.portfolio-hero img,
.clients-hero img,
.blog-hero img,
.masterpiece-hero img,
.hero-bg,
.hero-bg-img,
.bg-image {
    opacity: .22 !important;
    filter: saturate(1.12) contrast(.98) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.section-title,
.hero-title,
.page-title,
.service-title,
.industry-title,
.clients-title,
.portfolio-title,
.blog-title,
.counter,
.stat-number,
.metric-number {
    color: var(--gio-ink) !important;
    text-shadow: none !important;
}

h1 span,
h2 span,
.section-title span,
.hero-title span,
.gradient-text,
.text-gradient,
.gold-text,
.highlight,
[style*="color:#FFD700"],
[style*="color: #FFD700"],
[style*="color:gold"],
[style*="color: gold"] {
    background: linear-gradient(90deg, #2563eb, #06b6d4 50%, #db5eb7) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
}

p,
li,
.subtitle,
.section-subtitle,
.hero-subtitle,
.page-subtitle,
.service-description,
.industry-description,
.card-text,
.description,
.lead {
    color: var(--gio-muted) !important;
    text-shadow: none !important;
}

.service-card,
.industry-card,
.portfolio-card,
.portfolio-item,
.client-card,
.client-logo-card,
.logo-card,
.partner-card,
.blog-card,
.blog-post-card,
.feature-card,
.benefit-card,
.reason-card,
.solution-card,
.process-card,
.stat-item,
.stats-card,
.masterpiece-card,
.gallery-card,
.case-card,
.testimonial-card,
.contact-card,
.info-card,
.calculator-card,
.ai-card,
.tool-card,
.review-card,
.tracker-card,
.value-card {
    background: rgba(255,255,255,.94) !important;
    color: var(--gio-ink) !important;
    border: 1px solid var(--gio-line) !important;
    border-radius: 22px !important;
    box-shadow: var(--gio-card-shadow) !important;
    overflow: hidden !important;
}

.service-card img,
.industry-card img,
.portfolio-card img,
.portfolio-item img,
.blog-card img,
.blog-post-card img,
.feature-card img,
.benefit-card img,
.reason-card img,
.solution-card img,
.masterpiece-card img,
.gallery-card img,
.case-card img,
.client-card img,
.client-logo-card img,
.logo-card img,
.partner-card img {
    opacity: 1 !important;
    filter: none !important;
}

.client-card img,
.client-logo-card img,
.logo-card img,
.partner-card img {
    background: #fff !important;
    border-radius: 14px !important;
    padding: 10px !important;
    object-fit: contain !important;
}

.btn,
button,
input[type="submit"],
.cta-button,
.primary-btn,
.quote-btn,
.submit-btn,
.filter-btn.active,
.nav-menu .nav-highlight a,
.cmd-link {
    background: linear-gradient(135deg, #2563eb, #06b6d4 52%, #14b8a6) !important;
    color: #fff !important;
    border-color: transparent !important;
    box-shadow: 0 16px 36px rgba(37,99,235,.2) !important;
}

.btn.secondary,
.secondary-btn,
.outline-btn,
.filter-btn,
.tab-btn,
.chip,
.pill {
    background: rgba(255,255,255,.88) !important;
    color: #1d4ed8 !important;
    border: 1px solid var(--gio-line) !important;
    box-shadow: none !important;
}

.giocondo-header,
.main-header,
.brand-bar,
.nav-bar {
    background: rgba(255,255,255,.94) !important;
    color: var(--gio-ink) !important;
}

.nav-menu a,
.dropdown-toggle,
.nav-link {
    color: var(--gio-ink) !important;
}

.nav-menu a:hover,
.dropdown-toggle:hover,
.nav-link:hover {
    color: #2563eb !important;
    background: rgba(37,99,235,.08) !important;
}

.dropdown-menu,
.submenu,
.mega-menu {
    background: rgba(255,255,255,.98) !important;
    color: var(--gio-ink) !important;
    border: 1px solid var(--gio-line) !important;
    box-shadow: 0 28px 70px rgba(15,23,42,.14) !important;
}

.dropdown-menu a,
.submenu a,
.mega-menu a {
    color: var(--gio-ink) !important;
    background: transparent !important;
}

.dropdown-menu a:hover,
.submenu a:hover,
.mega-menu a:hover {
    background: linear-gradient(90deg, rgba(37,99,235,.1), rgba(20,184,166,.12)) !important;
    color: #1d4ed8 !important;
}

@media (max-width: 992px) {
    .hero-dark,
    .section-dark,
    .dark-section,
    .black-section,
    .service-hero,
    .industry-hero,
    .page-hero {
        padding: 58px 16px !important;
    }
}

/* ============================================
   GIOCONDO v14 fix: "GET A QUOTE" nav button
   ------------------------------------------
   The generic ".nav-menu > li > button:hover" rule was also
   matching this button (it's a <button> inside an <li>), which
   swapped its background/text to a near-white combo on hover and
   made the label unreadable. Lock this button's colors with an
   ID selector so nothing else can win the cascade against it.
   ============================================ */
#openQuoteBtn,
#openQuoteBtn:hover,
#openQuoteBtn:focus,
#openQuoteBtn:active {
    background: var(--gio-gradient, linear-gradient(135deg, #2563eb 0%, #06b6d4 52%, #14b8a6 100%)) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 0 !important;
}
#openQuoteBtn:hover {
    filter: brightness(1.08);
    transform: translateY(-2px);
    box-shadow: 0 18px 40px rgba(6, 182, 212, 0.28) !important;
}
