@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Manrope:wght@300;400;500;600;700;800&display=swap');

:root {
    --executive-bg: #07090c;
    --executive-panel: rgba(15, 18, 24, 0.88);
    --executive-border: rgba(218, 185, 113, 0.24);
    --executive-gold: #d8b66d;
    --executive-gold-soft: #f0d99d;
    --executive-ink: #f7f1e6;
    --executive-muted: #9da6b4;
    --executive-blue: #7aa7c7;
    --executive-radius: 22px;
    --executive-pill: 999px;
    --executive-shadow: 0 28px 80px rgba(0, 0, 0, 0.46);
    --neon-cyan: var(--executive-gold);
    --neon-magenta: var(--executive-blue);
    --text-light: var(--executive-ink);
    --text-dim: var(--executive-muted);
}

html {
    background: var(--executive-bg);
}

body {
    font-family: 'Manrope', sans-serif !important;
    background:
        radial-gradient(circle at 8% 8%, rgba(216, 182, 109, 0.15), transparent 28%),
        radial-gradient(circle at 88% 12%, rgba(122, 167, 199, 0.16), transparent 30%),
        linear-gradient(145deg, #050608 0%, #0b0e13 42%, #11151d 100%) !important;
    color: var(--executive-ink) !important;
}

body::before {
    background:
        linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px) !important;
    background-size: 64px 64px !important;
    opacity: 0.5 !important;
}

body::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        linear-gradient(115deg, transparent 0%, rgba(216, 182, 109, 0.06) 28%, transparent 44%),
        radial-gradient(circle at 50% 0%, rgba(255,255,255,0.06), transparent 36%);
}

body > * {
    position: relative;
    z-index: 1;
}

h1, h2, h3, h4, h5, h6,
.logo,
.hero-title,
.page-title,
.section-title,
.footer-heading,
.filter-title,
.product-title {
    font-family: 'Cormorant Garamond', serif !important;
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    color: var(--executive-ink) !important;
    text-shadow: none !important;
    letter-spacing: -0.025em;
}

.header {
    background: rgba(7, 9, 12, 0.78) !important;
    border-bottom: 1px solid rgba(216, 182, 109, 0.18) !important;
    box-shadow: 0 18px 60px rgba(0, 0, 0, 0.28) !important;
}

.header.scrolled {
    background: rgba(7, 9, 12, 0.95) !important;
    border-bottom-color: rgba(216, 182, 109, 0.34) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.42) !important;
}

.logo {
    font-size: 2.15rem !important;
    font-weight: 700 !important;
    color: var(--executive-ink) !important;
}

.logo span {
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    color: var(--executive-gold) !important;
    margin-left: 0.22rem;
}

.nav-link {
    color: rgba(247, 241, 230, 0.74) !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.nav-link:hover {
    color: var(--executive-gold-soft) !important;
    background: rgba(216, 182, 109, 0.09) !important;
    text-shadow: none !important;
}

.product-dropdown .dropdown-toggle,
.cart-icon,
.navbar-toggler {
    background: rgba(255, 255, 255, 0.045) !important;
    border: 1px solid var(--executive-border) !important;
    color: var(--executive-ink) !important;
}

.product-dropdown .dropdown-toggle {
    padding: 0.62rem 1.05rem;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border-radius: var(--executive-pill);
}

.product-dropdown .dropdown-toggle:hover,
.cart-icon:hover {
    background: rgba(216, 182, 109, 0.14) !important;
    border-color: rgba(216, 182, 109, 0.62) !important;
    color: var(--executive-gold-soft) !important;
    box-shadow: 0 18px 46px rgba(216, 182, 109, 0.16) !important;
}

.dropdown-menu {
    background: rgba(14, 17, 24, 0.98) !important;
    border: 1px solid var(--executive-border) !important;
    box-shadow: var(--executive-shadow) !important;
    border-radius: 18px !important;
    padding: 0.7rem !important;
}

.dropdown-item {
    color: rgba(247, 241, 230, 0.78) !important;
    border-radius: 12px;
}

.dropdown-item:hover {
    background: rgba(216, 182, 109, 0.12) !important;
    color: var(--executive-gold-soft) !important;
}

.search-input,
.mobile-search-input,
.form-control,
.form-select,
textarea {
    background: rgba(255, 255, 255, 0.055) !important;
    border: 1px solid rgba(216, 182, 109, 0.2) !important;
    border-radius: 14px !important;
    color: var(--executive-ink) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

.search-input::placeholder,
.mobile-search-input::placeholder,
.form-control::placeholder,
textarea::placeholder {
    color: rgba(157, 166, 180, 0.72) !important;
}

.search-input:focus,
.mobile-search-input:focus,
.form-control:focus,
.form-select:focus,
textarea:focus {
    border-color: rgba(216, 182, 109, 0.58) !important;
    box-shadow: 0 0 0 4px rgba(216, 182, 109, 0.1) !important;
    background: rgba(13, 16, 22, 0.96) !important;
}

.search-icon,
.mobile-search-icon,
.feature-icon,
.contact-icon,
.value-icon,
.no-results-icon,
.success-icon,
.quote-success-icon,
.detail-label,
.info-label,
.price,
.product-price,
.fas[style*="cyan"],
.fas[style*="var(--neon-cyan)"] {
    color: var(--executive-gold) !important;
}

.cart-count,
.product-count-badge,
.counter {
    background: rgba(216, 182, 109, 0.14) !important;
    border: 1px solid rgba(216, 182, 109, 0.36) !important;
    color: var(--executive-gold-soft) !important;
    box-shadow: none !important;
}

.hero-section,
.page-hero,
.about-hero,
.cyber-hero {
    padding-top: 8rem !important;
}

.hero-section .container,
.page-hero .container,
.about-hero,
.data-panel,
.filter-sidebar,
.product-card,
.tracking-form-container,
.tracking-results,
.order-card,
.help-box,
.privacy-content-container,
.privacy-highlight,
.privacy-card,
.product-info-card,
.spec-card,
.pricing-card,
.gallery-card,
.product-detail-card,
.product-details,
.quote-panel,
.cart-summary,
.modal-content,
.feature-box,
.value-card,
.contact-info-card,
.no-results,
.modal-cyber,
.contact-modal,
.inquiry-modal,
.cta-section {
    background:
        linear-gradient(145deg, rgba(255,255,255,0.07), rgba(255,255,255,0.025)),
        rgba(14, 17, 24, 0.88) !important;
    border: 1px solid rgba(216, 182, 109, 0.18) !important;
    border-radius: var(--executive-radius) !important;
    box-shadow: 0 18px 54px rgba(0, 0, 0, 0.34) !important;
}

.hero-section .container,
.page-hero .container,
.about-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(2.1rem, 5vw, 4.8rem) !important;
}

.hero-title,
.page-title {
    font-size: clamp(3rem, 8vw, 6.6rem) !important;
    line-height: 0.9 !important;
    font-weight: 700 !important;
}

.hero-subtitle,
.page-subtitle,
.section-subtitle,
.feature-description,
.product-meta,
.lead,
.small,
.footer p,
.contact-info-card p,
.value-card p,
.data-panel p,
.empty-cart p {
    color: rgba(247, 241, 230, 0.68) !important;
}

.section-title {
    font-size: clamp(2rem, 4vw, 3.1rem) !important;
}

.btn-primary-custom,
.btn-secondary-custom,
.btn-cyber,
.btn-outline-custom,
.btn-submit,
.btn-modal,
.btn-quote-contact,
.btn-quote-continue,
.add-to-cart-btn {
    border-radius: var(--executive-pill) !important;
    font-size: 0.78rem !important;
    font-weight: 850 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
}

.btn-primary-custom,
.btn-submit,
.btn-modal,
.btn-quote-contact {
    background: linear-gradient(135deg, #e6ca88 0%, #b88a3a 100%) !important;
    color: #090b0f !important;
    border: 0 !important;
    box-shadow: 0 18px 38px rgba(216, 182, 109, 0.2) !important;
}

.btn-primary-custom:hover,
.btn-submit:hover,
.btn-modal:hover,
.btn-quote-contact:hover {
    background: linear-gradient(135deg, #f3dc9e 0%, #c8953f 100%) !important;
    color: #090b0f !important;
    transform: translateY(-2px);
    box-shadow: 0 24px 52px rgba(216, 182, 109, 0.28) !important;
}

.btn-secondary-custom,
.btn-cyber,
.btn-outline-custom,
.btn-quote-continue {
    background: rgba(255,255,255,0.035) !important;
    border: 1px solid rgba(216, 182, 109, 0.28) !important;
    color: var(--executive-gold-soft) !important;
}

.btn-secondary-custom:hover,
.btn-cyber:hover,
.btn-outline-custom:hover,
.btn-quote-continue:hover {
    background: rgba(216, 182, 109, 0.12) !important;
    border-color: rgba(216, 182, 109, 0.58) !important;
    color: var(--executive-gold-soft) !important;
    box-shadow: 0 18px 40px rgba(216, 182, 109, 0.14) !important;
}

.product-card:hover,
.feature-box:hover,
.value-card:hover,
.contact-info-card:hover {
    border-color: rgba(216, 182, 109, 0.42) !important;
    box-shadow: 0 32px 90px rgba(0, 0, 0, 0.5) !important;
}

.product-image,
.main-image,
.thumbnail {
    background:
        radial-gradient(circle at 50% 40%, rgba(255,255,255,0.08), transparent 52%),
        linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.01)) !important;
    border-color: rgba(216, 182, 109, 0.18) !important;
}

.product-card .product-image {
    height: 300px !important;
    padding: 0.7rem !important;
}

.product-card .product-image img {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
}

table,
.table {
    color: rgba(247, 241, 230, 0.72) !important;
}

.tracking-container,
.privacy-container {
    padding-top: 3rem !important;
}

.tracking-form,
.privacy-content {
    color: rgba(247, 241, 230, 0.72) !important;
}

.btn-track {
    background: linear-gradient(135deg, #e6ca88 0%, #b88a3a 100%) !important;
    color: #090b0f !important;
    border: 0 !important;
    border-radius: var(--executive-pill) !important;
    box-shadow: 0 18px 38px rgba(216, 182, 109, 0.2) !important;
    font-size: 0.78rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.13em !important;
    text-transform: uppercase !important;
}

.btn-track:hover {
    background: linear-gradient(135deg, #f3dc9e 0%, #c8953f 100%) !important;
    color: #090b0f !important;
}

.order-header,
.order-items,
.order-total,
.timeline,
.privacy-content h3,
.privacy-content h2 {
    border-color: rgba(216, 182, 109, 0.14) !important;
}

.order-status,
.tracking-step-icon,
.privacy-icon {
    border-color: rgba(216, 182, 109, 0.36) !important;
    color: var(--executive-gold-soft) !important;
}

.alert-message {
    border-radius: var(--executive-radius) !important;
    background: rgba(14, 17, 24, 0.92) !important;
}

.alert-success {
    border-color: rgba(216, 182, 109, 0.32) !important;
}

.alert-error {
    border-color: rgba(248, 113, 113, 0.42) !important;
}

td,
th {
    border-color: rgba(216, 182, 109, 0.14) !important;
}

.executive-shop-label,
.text-cyan {
    color: var(--executive-gold-soft) !important;
}

a.d-block.py-3.border-bottom {
    color: rgba(247, 241, 230, 0.72) !important;
    border-color: rgba(216, 182, 109, 0.18) !important;
}

a.d-block.py-3.border-bottom:hover {
    color: var(--executive-gold-soft) !important;
}

.moq-badge,
.badge,
.price-badge {
    background: rgba(122, 167, 199, 0.1) !important;
    border: 1px solid rgba(122, 167, 199, 0.26) !important;
    color: #b9d5ea !important;
}

.breadcrumb-container,
.breadcrumb,
.border-cyan,
.divider {
    border-color: rgba(216, 182, 109, 0.14) !important;
}

.breadcrumb-item a,
.breadcrumb-item.active {
    color: rgba(247, 241, 230, 0.62) !important;
}

.footer {
    background:
        linear-gradient(180deg, rgba(7, 9, 12, 0.72), rgba(4, 5, 7, 0.98)),
        radial-gradient(circle at 12% 0%, rgba(216, 182, 109, 0.1), transparent 30%) !important;
    border-top: 1px solid rgba(216, 182, 109, 0.18) !important;
}

.footer-heading {
    color: var(--executive-gold-soft) !important;
    font-size: 1.55rem !important;
}

.footer-link {
    color: rgba(247, 241, 230, 0.62) !important;
    text-shadow: none !important;
}

.footer-link:hover {
    color: var(--executive-gold-soft) !important;
}

.copyright {
    border-top-color: rgba(216, 182, 109, 0.14) !important;
    color: rgba(247, 241, 230, 0.48) !important;
}

.promo-badge {
    display: none !important;
}

@media (max-width: 768px) {
    .logo {
        font-size: 1.7rem !important;
    }

    .hero-section,
    .page-hero,
    .about-hero,
    .cyber-hero {
        padding-top: 6.5rem !important;
    }

    .hero-title,
    .page-title {
        font-size: clamp(2.7rem, 14vw, 4.5rem) !important;
    }

    .product-card .product-image {
        height: 240px !important;
        padding: 0.65rem !important;
    }
}