:root {
    --primary-color: #0d6efd;
    --primary-gradient-start: #0d6efd;
    --primary-gradient-end: #0a58ca;
    --secondary-color: #6c757d;
    --success-color: #198754;
    --dark-color: #212529;
    --light-color: #f8f9fa;
    --card-shadow: 0 4px 10px rgba(0,0,0,.08);
    --card-shadow-hover: 0 10px 28px rgba(0,0,0,.15);
    --transition: all .35s cubic-bezier(.4,0,.2,1);
    --navbar-height: 70px;
    --radius-base: 14px;
}

/* Reset / base fixes remain */
* { box-sizing: border-box; }
html { max-width:100%; overflow-x:hidden; min-height:100vh; }
body { max-width:100%; overflow-x:hidden; min-height:100vh; background-color:#fff; }

/* Navbar unchanged base + minor polish */
.landing-navbar { height:var(--navbar-height); padding:.75rem 0; transition:.3s; box-shadow:0 2px 4px rgba(0,0,0,.05); background:rgba(255,255,255,.96)!important; backdrop-filter:blur(12px); z-index:1030; }
.landing-navbar .container-fluid { max-width: 100%; overflow: visible; }
.landing-navbar.scrolled { height:62px; padding:.5rem 0; box-shadow:0 4px 18px rgba(0,0,0,.12); }
.landing-navbar .navbar-logo { height: 48px; width: auto; max-height: 48px; transition: var(--transition); object-fit: contain; }
.landing-navbar.scrolled .navbar-logo { height: 32px; max-height: 32px; }
.landing-navbar .navbar-brand { padding: 0; margin-right: 2rem; }

/* Enhanced Nav Links - Bigger and More Prominent */
.landing-navbar .nav-link { font-weight:600; font-size:1.02rem; padding:.7rem 1.15rem!important; color:var(--dark-color); border-radius:10px; position:relative; transition:var(--transition); }
.landing-navbar .nav-link:hover { color:var(--primary-color); background:rgba(13,110,253,.07); }

/* Hero */
.hero-section { background:linear-gradient(135deg,var(--primary-gradient-start) 0%,var(--primary-gradient-end) 100%); color:#fff; position:relative; overflow:hidden; margin-top:calc(-1 * var(--navbar-height)); padding-top:calc(140px + var(--navbar-height)); padding-bottom:110px; }
.hero-section.hero-gradient:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 30% 40%,rgba(255,255,255,.25),transparent 70%); mix-blend-mode:overlay; pointer-events:none; }
.hero-content { text-align:center; position:relative; z-index:2; }
.hero-title { font-size:clamp(2.2rem,5vw,3.4rem); font-weight:700; line-height:1.15; letter-spacing:.5px; }
.hero-subtitle { font-size:clamp(1.05rem,2.2vw,1.4rem); font-weight:400; opacity:.92; max-width:840px; margin-left:auto; margin-right:auto; }
.app-badge { display:inline-flex; align-items:center; gap:.4rem; background:rgba(255,255,255,.15); color:#fff; padding:.45rem .85rem; border-radius:50px; font-size:.75rem; font-weight:600; letter-spacing:.5px; backdrop-filter:blur(4px); box-shadow:0 2px 4px rgba(0,0,0,.15); }
.btn-pill { border-radius:50px; }
.hero-layer-visual { position:absolute; inset:0; pointer-events:none; }

/* Trust indicators */
.trust-indicators > div { position:relative; padding-left:1.6rem; }
.trust-indicators i { position:absolute; left:0; top:50%; transform:translateY(-50%); opacity:.6; }

/* Metrics bar */
.metrics-bar { background:#fff; border-bottom:1px solid rgba(0,0,0,.06); padding:24px 0; position:relative; margin-top:-40px; z-index:6; }
.metric-item { display:flex; flex-direction:column; gap:.35rem; }
.metric-value { font-size:1.4rem; font-weight:700; background:linear-gradient(90deg,var(--primary-gradient-start),var(--primary-gradient-end)); -webkit-background-clip:text; color:transparent; }
.metric-label { font-size:.75rem; text-transform:uppercase; letter-spacing:.7px; font-weight:600; color:var(--secondary-color); }

/* Sections */
.section-pad { padding:80px 0; }
.section-head .section-lead { max-width:760px; margin-left:auto; margin-right:auto; }
.category-title { font-size:1.25rem; font-weight:700; display:flex; align-items:center; }
.category-expand { display:inline-flex; align-items:center; gap:.35rem; color:var(--secondary-color); transition:color .25s; }
.category-expand:hover { color:var(--primary-color); }

/* Tool cards */
.tool-card { background:#fff; border-radius:var(--radius-base); padding:1.75rem 1.55rem 1.7rem; box-shadow:var(--card-shadow); transition:var(--transition); position:relative; border:2px solid transparent; display:flex; flex-direction:column; height:100%; }
.tool-card:hover { transform:translateY(-6px); box-shadow:var(--card-shadow-hover); border-color:var(--primary-color); }
.tool-card-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.1rem; }
.tool-icon { font-size:2.1rem; color:var(--primary-color); transition:var(--transition); }
.tool-card:hover .tool-icon { transform:scale(1.08) rotate(4deg); }
.tool-badge { font-size:.65rem; font-weight:700; letter-spacing:.5px; padding:.35rem .55rem; border-radius:6px; background:linear-gradient(90deg,var(--primary-gradient-start),var(--primary-gradient-end)); color:#fff; box-shadow:0 2px 4px rgba(0,0,0,.15); }
.badge-secondary { background:linear-gradient(90deg,#6610f2,#6f42c1); }
.tool-title { font-size:1.15rem; font-weight:600; margin:0 0 .6rem; }
.tool-description { flex-grow:1; font-size:.9rem; line-height:1.5; color:var(--secondary-color); }
.tool-actions { margin-top:1rem; }
.tool-link { display:inline-flex; align-items:center; gap:.45rem; font-weight:600; text-decoration:none; color:var(--primary-color); font-size:.85rem; padding:.5rem 1rem; border-radius:8px; background:rgba(13,110,253,.08); transition:var(--transition); }
.tool-link:hover { background:var(--primary-color); color:#fff; gap:.7rem; }

/* Alternate feature list */
.feature-list-alt .feature-icon-wrap { width:42px; height:42px; border-radius:12px; background:linear-gradient(135deg,var(--primary-gradient-start),var(--primary-gradient-end)); display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.3rem; box-shadow:0 4px 14px rgba(0,0,0,.2); }

.illustration-panel { position:relative; width:100%; min-height:280px; }
.floating-tile { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:94px; height:94px; background:#fff; border-radius:26px; display:flex; align-items:center; justify-content:center; font-size:2rem; color:var(--primary-color); box-shadow:0 6px 28px rgba(0,0,0,.15); animation:floating 6s ease-in-out infinite; }
.floating-tile.delay-1 { animation-delay:1s; left:30%; top:38%; }
.floating-tile.delay-2 { animation-delay:2s; left:68%; top:46%; }
.floating-tile.delay-3 { animation-delay:3s; left:45%; top:70%; }
@keyframes floating { 0%,100% { transform:translate(-50%,-50%) translateY(0); } 50% { transform:translate(-50%,-50%) translateY(-18px); } }

/* CTA */
.cta-section { background:linear-gradient(135deg,var(--primary-gradient-start),var(--primary-gradient-end)); color:#fff; position:relative; overflow:hidden; }
.cta-section:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 70% 30%,rgba(255,255,255,.15),transparent 70%); mix-blend-mode:overlay; }
.cta-section h2 { font-size:clamp(1.8rem,4vw,2.4rem); }
.cta-section .btn { box-shadow:0 4px 18px rgba(0,0,0,.25); }
.cta-section .btn:hover { transform:translateY(-3px); }

/* Reveal / animations */
.reveal { opacity:0; transform:translateY(28px); }
.revealed { opacity:1; transform:translateY(0); transition:opacity .6s ease, transform .6s ease; }
.fade-in { animation:fadeIn .75s ease-out both; }
.fade-in-left { animation:fadeInLeft .75s ease-out both; }
.fade-in-right { animation:fadeInRight .75s ease-out both; }
@keyframes fadeIn { from { opacity:0; transform:translateY(32px); } to { opacity:1; transform:translateY(0); } }
@keyframes fadeInLeft { from { opacity:0; transform:translateX(-32px); } to { opacity:1; transform:translateX(0); } }
@keyframes fadeInRight { from { opacity:0; transform:translateX(32px); } to { opacity:1; transform:translateX(0); } }

/* Responsive tweaks */
@media (max-width:992px){ 
    .metrics-bar { margin-top:0; } 
    .hero-section { padding-top:calc(120px + var(--navbar-height)); padding-bottom:90px; }
    /* Modern mobile navbar panel */
    .landing-navbar { position:relative; }
    body.nav-open { overflow:hidden; }
    .landing-navbar .navbar-collapse {
        position:absolute;
        top:var(--navbar-height);
        left:0; right:0;
        background:#fff;
        margin:0;
        padding:1.25rem 1.25rem 2.5rem;
        border-radius:0 0 var(--radius-base) var(--radius-base);
        box-shadow:0 14px 40px rgba(0,0,0,.18);
        max-height:calc(100vh - var(--navbar-height));
        overflow-y:auto; /* Allow vertical scrolling if needed */
        -webkit-overflow-scrolling:touch;
        transform-origin:top center;
        transform:translateY(-4px);
        opacity:0;
        pointer-events:none;
        will-change:transform,opacity;
        transition:opacity .14s ease-out, transform .14s cubic-bezier(.4,0,.2,1);
    }
    .landing-navbar .navbar-collapse.show {
        opacity:1;
        transform:translateY(0);
        pointer-events:auto;
    }
    /* Overlay for mobile menu */
    .mobile-nav-overlay {
        position:fixed;
        inset:0;
        background:rgba(0,0,0,.35);
        backdrop-filter:blur(4px);
        opacity:0;
        pointer-events:none;
        transition:opacity .2s ease; /* faster */
        z-index:1020;
    }
    .mobile-nav-overlay.active { opacity:1; pointer-events:auto; }
    /* Hamburger / toggler animation */
    .navbar-toggler {
        position:relative;
        width:42px; height:42px;
        border:none;
        background:rgba(13,110,253,.08);
        border-radius:12px;
        display:flex; align-items:center; justify-content:center;
        transition:background .18s ease, box-shadow .18s ease; /* limit properties */
    }
    .navbar-toggler:focus { box-shadow:0 0 0 4px rgba(13,110,253,.3); }
    .navbar-toggler .bar {
        position:absolute; left:50%; top:50%;
        width:22px; height:2px; background:var(--dark-color);
        border-radius:2px; transition:.18s cubic-bezier(.4,0,.2,1);
    }
    .navbar-toggler .bar:nth-child(1){ transform:translate(-50%, -8px); }
    .navbar-toggler .bar:nth-child(2){ transform:translate(-50%, 0); }
    .navbar-toggler .bar:nth-child(3){ transform:translate(-50%, 8px); }
    .navbar-toggler.active { background:var(--primary-color); }
    .navbar-toggler.active .bar { background:#fff; }
    .navbar-toggler.active .bar:nth-child(1){ transform:translate(-50%,0) rotate(45deg); }
    .navbar-toggler.active .bar:nth-child(2){ opacity:0; }
    .navbar-toggler.active .bar:nth-child(3){ transform:translate(-50%,0) rotate(-45deg); }
    /* Mobile nav items spacing */
    .landing-navbar .nav-item { margin-bottom:.5rem; }
    /* Mobile nav links */
    .landing-navbar .nav-link { padding:.75rem 1rem !important; border-radius:10px; }
    .landing-navbar .nav-link:active { background:rgba(13,110,253,.12); }
    /* Mobile dropdown items */
    .landing-navbar .dropdown-item { padding:.75rem 1rem; margin-bottom:.25rem; border-radius:10px; }
    /* Smooth dropdown reveal inside panel */
    .landing-navbar .dropdown-menu-modern { transition:opacity .18s ease, transform .18s ease; transform:translateY(-4px); }
    .landing-navbar .dropdown-menu-modern.show { transform:translateY(0); }
}

@media (max-width:768px){ 
    .section-pad { padding:60px 0; } 
    .tool-card { padding:1.4rem 1.2rem 1.3rem; } 
    .hero-title { font-size:2.2rem; } 
    .hero-subtitle { font-size:1.05rem; } 
    .metrics-bar { padding:18px 0; } 
}

@media (max-width:576px){ 
    .hero-title { font-size:2rem; } 
    .hero-subtitle { font-size:1rem; } 
    .floating-tile { width:70px; height:70px; font-size:1.4rem; } 
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){ 
    * { animation:none!important; transition:none!important; } 
}

/* Dropdown adjustments preserved from previous style where needed */
.landing-navbar .dropdown-menu-modern { 
    border:none; 
    border-radius:14px; 
    box-shadow:0 10px 32px rgba(0,0,0,.18); 
    padding:1rem; 
    min-width:320px; 
    display:none;
}

/* Desktop - hover and click to show dropdown */
@media (min-width: 993px) {
    .landing-navbar .dropdown-menu-modern { 
        position: absolute;
        top: 100%;
        left: 0;
        z-index: 1000;
        margin-top: 0.5rem;
        opacity:0; 
        transform:translateY(-12px); 
        transition: opacity .25s ease, transform .25s ease;
    }
    
    .landing-navbar .dropdown:hover > .dropdown-menu-modern,
    .landing-navbar .dropdown-menu-modern.show { 
        display:block; 
        opacity:1; 
        transform:translateY(0); 
    }
}

/* Mobile - instant show/hide */
@media (max-width: 992px) {
    .landing-navbar .dropdown-menu-modern {
        position: static;
        box-shadow: none;
        border: 1px solid rgba(0,0,0,.08);
        border-radius: 0 0 8px 8px;
        margin: 0 0 0.5rem 1rem;
        padding: 0.5rem;
        background: rgba(13,110,253,.03);
        display: none;
    }
    
    .landing-navbar .dropdown-menu-modern.show {
        display: block;
    }
}

.landing-navbar .dropdown-item { 
    padding:1rem 1.1rem; 
    border-radius:10px; 
    display:flex; 
    gap:1rem; 
    align-items:flex-start; 
    transition:var(--transition); 
}

.landing-navbar .dropdown-item:hover { 
    background:rgba(13,110,253,.08); 
    transform:translateX(6px); 
}

/* Dropdown item content */
.dropdown-item-content {
    flex: 1;
    min-width: 0;
}

.dropdown-item-title {
    font-weight: 600;
    display: block;
}

.dropdown-item-desc {
    font-size: 0.8rem;
    color: var(--secondary-color);
    display: block;
}