:root{
  --brand:#1e2a78;
  --accent-start: #3b58ff;
  --accent-end: #1e2a78;
  --deep: #0b1651;
  --deep-2: #1a1a3e;
}
body { font-family: 'Inter', sans-serif; color: #333; }

/* Global utility and homepage tweaks */
.text-brand{ color: var(--brand); }
.rounded-15{ border-radius: 15px; }
.section-title{ font-weight:800; letter-spacing:.3px; color:#0f172a; }
.section-subtitle{ color:#64748b; }
.accent-bar{ width:48px; height:4px; background:linear-gradient(90deg, var(--accent-start), var(--accent-end)); border-radius:999px; margin:.5rem auto 0; }

/* Homepage spacing consolidation (moved from inline styles) */
.hero-slider{ margin-bottom:0; }
.hero-slider .carousel-item img{ max-height:60vh; object-fit:cover; }
.hero-slider + .cta-section{ margin-top:-16px; }
.cta-section{ padding-top:16px; padding-bottom:16px; }
.about-sections, .grid-systems-section{ padding-top:24px !important; padding-bottom:24px !important; }
.cta-section .container{ padding-left:12px; padding-right:12px; }
@media (max-width: 768px){
  .hero-slider .carousel-item img{ max-height:42vh; }
  .hero-slider + .cta-section{ margin-top:-8px; }
}

/* Professional Header */
.professional-header{ border-bottom:1px solid #e5e7eb; padding:0.75rem 0; }
.professional-header .container{ max-width:1320px; }
.brand-logo{ text-decoration:none; transition:opacity 0.2s ease; }
.brand-logo:hover{ opacity:0.85; }
.logo-img{ height:45px; width:auto; max-width:200px; object-fit:contain; }
.brand-text{ font-size:1.5rem; font-weight:800; background:linear-gradient(90deg, var(--accent-start), var(--accent-end)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.professional-header .navbar-nav{ gap:0.25rem; }
.professional-header .nav-link{ color:#475569; font-size:0.95rem; padding:0.5rem 1rem; border-radius:8px; transition:all 0.2s ease; }
.professional-header .nav-link:hover{ color:var(--brand); background:#f8f9fa; }
.professional-header .dropdown-menu{ border:1px solid #e5e7eb; box-shadow:0 4px 12px rgba(0,0,0,0.08); border-radius:12px; padding:0.5rem; margin-top:0.5rem; }
.professional-header .dropdown-item{ border-radius:8px; padding:0.5rem 1rem; font-size:0.9rem; transition:all 0.2s ease; }
.professional-header .dropdown-item:hover{ background:#f8f9fa; color:var(--brand); }
.header-actions{ gap:0.75rem; }
.header-cta{ font-size:0.9rem; white-space:nowrap; background:linear-gradient(90deg, var(--accent-start), var(--accent-end)); border:0; transition:all 0.2s ease; }
.header-cta:hover{ transform:translateY(-2px); box-shadow:0 6px 20px rgba(59,88,255,0.35); }

@media (max-width: 991px) {
  .logo-img{ height:40px; }
  .professional-header .navbar-nav{ margin-top:1rem; }
  .professional-header .nav-link{ padding:0.75rem 1rem; }
  .header-actions{ margin-top:1rem; width:100%; }
  .header-cta{ width:100%; justify-content:center; }
}

/* Navbar improvements */
.navbar{ padding: 0.75rem 0; }
.navbar-brand{ letter-spacing:.3px; }
.navbar-nav .nav-link{ 
  color: #374151; 
  font-size: 0.95rem;
  transition: color 0.2s ease;
}
.navbar-nav .nav-link:hover{ 
  color: var(--brand);
}

/* Dropdown menu styling */
.dropdown-menu{
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  padding: 0.5rem 0;
  margin-top: 0.5rem;
}
.dropdown-item{
  padding: 0.5rem 1.25rem;
  font-size: 0.9rem;
  color: #374151;
  transition: all 0.2s ease;
}
.dropdown-item:hover{
  background-color: #f3f4f6;
  color: var(--brand);
  padding-left: 1.5rem;
}

/* CTA button styling to match pill gradient */
.btn-cta{
  background: linear-gradient(90deg, var(--accent-start), var(--accent-end));
  color:#fff; border:0; padding:.6rem 1.2rem; border-radius:999px; font-weight:700;
}
.btn-cta:hover{ filter:brightness(1.05); color:#fff }

/* Hero with overlay */
.hero{ min-height: 80vh; }
.hero .hero-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:brightness(.78); }
.hero:after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(11,22,81,.15) 0%, rgba(0,0,0,.35) 60%, rgba(0,0,0,.55) 100%); }
.hero .container{ text-shadow:0 4px 18px rgba(0,0,0,.45); }
.hero h1{ font-weight:800; letter-spacing:.2px }
.hero .btn{ background: linear-gradient(90deg, var(--accent-start), var(--accent-end)); border:0 }

/* Hero Slider */
.hero-slider .carousel-item{ min-height:70vh; position:relative; }
.hero-slider .carousel-caption{ text-shadow:0 2px 12px rgba(0,0,0,.8); }
.hero-slider .carousel-caption h2{ text-shadow:0 2px 12px rgba(0,0,0,.8); }

/* Solutions Section theme */
.solutions-section{ background: linear-gradient(135deg, #1a1a3e 0%, #0f0f2e 100%); }
.solution-card-img{ height:200px; object-fit:cover; }

/* CTA Section with Buttons */
.cta-section{ background:#f9fafb; border-bottom:1px solid #e5e7eb; }
.cta-section h3{ color:#111827; }
.cta-section .btn{ font-size:0.9rem; font-weight:600; transition:all 0.2s ease; letter-spacing:0.3px; }
.cta-section .btn-primary{ background:linear-gradient(90deg, var(--accent-start), var(--accent-end)); border:0; }
.cta-section .btn-primary:hover{ transform:translateY(-2px); box-shadow:0 6px 20px rgba(59,88,255,0.35); }
.cta-section .btn-outline-primary{ border:1.5px solid var(--brand); color:var(--brand); background:transparent; }
.cta-section .btn-outline-primary:hover{ background:var(--brand); color:#fff; border-color:var(--brand); transform:translateY(-2px); box-shadow:0 6px 20px rgba(30,42,120,0.25); }

/* About Sections - Compact Responsive Design */
.about-sections{ background:#fff; }
.about-section-item{ position:relative; background:#fff; border-radius:12px; overflow:hidden; box-shadow:0 2px 12px rgba(0,0,0,0.06); transition:box-shadow 0.3s ease; }
.about-section-item:hover{ box-shadow:0 4px 20px rgba(0,0,0,0.1); }
.about-sections .content-wrapper{ background:#fff; min-height:320px; }
.about-sections h3{ color:#0f172a; line-height:1.4; font-size:1.75rem; }
.about-sections .section-text{ color:#64748b !important; font-size:0.95rem; line-height:1.7; }
.about-sections .section-text p{ margin-bottom:0.75rem; }
.about-sections .image-wrapper{ min-height:320px; position:relative; }
.about-sections .image-wrapper img{ transition:transform 0.4s ease; object-position:center; }
.about-sections .image-wrapper:hover img{ transform:scale(1.03); }
.about-sections .image-overlay{ position:absolute; inset:0; background:linear-gradient(135deg, rgba(30,42,120,0.03), transparent); pointer-events:none; }
.object-fit-cover{ object-fit:cover; }

/* Responsive adjustments */
@media (max-width: 991px) {
  .about-sections .image-wrapper{ min-height:250px; }
  .about-sections .content-wrapper{ min-height:auto; }
  .about-sections h3{ font-size:1.5rem; }
  .about-sections .section-text{ font-size:0.9rem; }
}

@media (max-width: 767px) {
  .about-sections .image-wrapper{ min-height:200px; }
  .about-sections h3{ font-size:1.35rem; }
  .about-sections .section-text{ font-size:0.875rem; line-height:1.6; }
}

@media (max-width: 575px) {
  .about-sections .image-wrapper{ min-height:180px; }
  .about-section-item{ border-radius:8px; }
  .about-sections h3{ font-size:1.25rem; }
}

/* Grid Systems Section (On-Grid / Off-Grid) */
.grid-systems-section{ background:#f9fafb; }
.grid-card{ background:#fff; border-radius:16px; overflow:hidden; box-shadow:0 2px 12px rgba(0,0,0,0.08); transition:all 0.3s ease; }
.grid-card:hover{ transform:translateY(-8px); box-shadow:0 8px 30px rgba(0,0,0,0.15); }
.grid-card-image{ position:relative; height:280px; overflow:hidden; }
.grid-card-image img{ width:100%; height:100%; object-fit:cover; transition:transform 0.4s ease; }
.grid-card:hover .grid-card-image img{ transform:scale(1.1); }
.grid-card-overlay{ position:absolute; inset:0; background:linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.4) 100%); }
.grid-card-content{ padding:2rem; }
.grid-card h3{ color:#0f172a; font-size:1.5rem; }
.grid-card p{ font-size:0.95rem; line-height:1.7; }
.grid-card .btn{ font-size:0.9rem; font-weight:600; transition:all 0.2s ease; }
.grid-card .btn:hover{ transform:translateX(4px); }

@media (max-width: 767px) {
  .grid-card-image{ height:220px; }
  .grid-card-content{ padding:1.5rem; }
  .grid-card h3{ font-size:1.35rem; }
  .grid-card p{ font-size:0.9rem; }
}

@media (max-width: 575px) {
  .grid-card-image{ height:200px; }
  .grid-card-content{ padding:1.25rem; }
  .grid-card h3{ font-size:1.25rem; }
}

/* Solutions Slider */
.solutions-slider-wrapper{ overflow:hidden; }
.solutions-slider{ display:flex; gap:1.5rem; overflow-x:auto; scroll-behavior:smooth; padding-bottom:1rem; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,0.3) transparent; }
.solutions-slider::-webkit-scrollbar{ height:8px; }
.solutions-slider::-webkit-scrollbar-track{ background:rgba(255,255,255,0.1); border-radius:10px; }
.solutions-slider::-webkit-scrollbar-thumb{ background:rgba(255,255,255,0.3); border-radius:10px; }
.solutions-slider::-webkit-scrollbar-thumb:hover{ background:rgba(255,255,255,0.5); }
.solution-slide{ flex:0 0 calc(25% - 1.125rem); min-width:250px; }
.solution-slide .card{ transition:transform 0.3s ease, box-shadow 0.3s ease; }
.solution-slide .card:hover{ transform:translateY(-8px); box-shadow:0 12px 35px rgba(0,0,0,0.3) !important; }
.solutions-nav button{ transition:all 0.2s ease; border-width:2px; }
.solutions-nav button:hover{ background:rgba(255,255,255,0.2); transform:scale(1.1); }

@media (max-width: 1199px) {
  .solution-slide{ flex:0 0 calc(33.333% - 1rem); }
}

@media (max-width: 991px) {
  .solution-slide{ flex:0 0 calc(50% - 0.75rem); min-width:220px; }
}

@media (max-width: 575px) {
  .solution-slide{ flex:0 0 calc(100% - 0.5rem); min-width:200px; }
  .solutions-slider{ gap:1rem; }
}

/* Testimonials Section */
.testimonials-section{ background:#f9fafb; }
.video-wrapper{ position:relative; }
.video-wrapper .ratio{ border-radius:20px; }
.video-badge{ position:absolute; bottom:1rem; left:1rem; background:#fff; padding:0.5rem 1rem; border-radius:50px; box-shadow:0 4px 12px rgba(0,0,0,0.15); font-size:0.875rem; font-weight:600; color:#0f172a; display:flex; align-items:center; }
.video-badge svg{ color:#22c55e; }

.testimonial-carousel{ position:relative; }
.testimonial-carousel .carousel-indicators{ position:relative; bottom:auto; margin:0 0 1.5rem 0; justify-content:flex-start; }
.testimonial-carousel .carousel-indicators button{ width:12px; height:12px; border-radius:50%; background:#cbd5e1; border:0; opacity:1; margin:0 6px; transition:all 0.3s ease; }
.testimonial-carousel .carousel-indicators button.active{ background:var(--brand); width:32px; border-radius:6px; }

.testimonial-card{ background:#fff; padding:2.5rem; border-radius:20px; box-shadow:0 4px 20px rgba(0,0,0,0.08); position:relative; transition:transform 0.3s ease, box-shadow 0.3s ease; }
.testimonial-card:hover{ transform:translateY(-4px); box-shadow:0 8px 30px rgba(0,0,0,0.12); }
.testimonial-video{ border:1px solid #e5e7eb; box-shadow:0 6px 20px rgba(0,0,0,0.06); }
.testimonial-video video{ display:block; }
.quote-icon{ color:#e0e7ff; margin-bottom:1.5rem; }
.testimonial-text{ font-size:1.05rem; line-height:1.8; color:#475569; margin-bottom:2rem; font-style:italic; }
.testimonial-author{ display:flex; align-items:center; gap:1rem; }
.author-avatar{ width:48px; height:48px; background:linear-gradient(135deg, var(--accent-start), var(--accent-end)); border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; flex-shrink:0; }
.author-name{ font-weight:700; color:#0f172a; font-size:1rem; }
.author-role{ font-size:0.875rem; color:#64748b; }

@media (max-width: 991px) {
  .testimonial-card{ padding:2rem; }
  .testimonial-text{ font-size:1rem; }
  .video-wrapper{ margin-bottom:2rem; }
}

@media (max-width: 767px) {
  .testimonial-card{ padding:1.5rem; }
  .testimonial-text{ font-size:0.95rem; margin-bottom:1.5rem; }
  .quote-icon svg{ width:32px; height:32px; }
  .author-avatar{ width:40px; height:40px; }
}

/* Trusted By Section */
.trusted-by-section{ background:#fff; }
.brands-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:2rem; align-items:center; justify-items:center; }
.brand-item{ background:#fff; padding:1.5rem; border-radius:12px; border:1px solid #e5e7eb; transition:all 0.3s ease; display:flex; align-items:center; justify-content:center; min-height:100px; width:100%; }
.brand-item:hover{ border-color:#cbd5e1; box-shadow:0 4px 12px rgba(0,0,0,0.08); transform:translateY(-4px); }
.brand-item img{ max-width:100%; height:auto; max-height:60px; object-fit:contain; filter:grayscale(100%) opacity(0.7); transition:filter 0.3s ease; }
.brand-item:hover img{ filter:grayscale(0%) opacity(1); }

@media (max-width: 991px) {
  .brands-grid{ grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:1.5rem; }
  .brand-item{ padding:1.25rem; min-height:90px; }
}

@media (max-width: 575px) {
  .brands-grid{ grid-template-columns:repeat(2, 1fr); gap:1rem; }
  .brand-item{ padding:1rem; min-height:80px; }
  .brand-item img{ max-height:50px; }
}

/* FAQ Section - Simple Implementation */
.faq-section{ background:#f9fafb; }
.faq-tabs-wrapper{ max-width:800px; margin:0 auto; }
.faq-tabs .nav-link{ background:#fff; border:1px solid #e5e7eb; color:#64748b; font-weight:600; padding:0.75rem 1.5rem; border-radius:50px; transition:all 0.3s ease; font-size:0.95rem; cursor:pointer; }
.faq-tabs .nav-link:hover{ background:#f8f9fa; border-color:#cbd5e1; color:#475569; }
.faq-item-simple .faq-question{ cursor:pointer; padding:0.75rem 0; display:flex; align-items:center; justify-content:space-between; }
.faq-answer{ max-height:0; overflow:hidden; }
.faq-tabs .nav-link.active{ background:linear-gradient(90deg, var(--accent-start), var(--accent-end)); border-color:transparent; color:#fff; box-shadow:0 4px 12px rgba(59,88,255,0.3); }

.faq-content{ max-width:900px; margin:0 auto; }
.faq-item-simple{ background:#fff; border:1px solid #e5e7eb; border-radius:12px; overflow:hidden; transition:all 0.3s ease; }
.faq-item-simple:hover{ border-color:#cbd5e1; box-shadow:0 4px 12px rgba(0,0,0,0.06); }
.faq-question{ padding:1.25rem 1.5rem; font-weight:600; color:#0f172a; font-size:1rem; cursor:pointer; display:flex; align-items:center; user-select:none; }
.faq-question:hover{ background:#f8f9fa; }
.faq-question-text{ flex:1; }
.faq-icon{ color:var(--brand); flex-shrink:0; }
.faq-arrow{ color:#64748b; transition:transform 0.3s ease; flex-shrink:0; }
.faq-item-simple.active .faq-arrow{ transform:rotate(180deg); }
.faq-item-simple.active .faq-question{ background:#f8f9fa; color:var(--brand); }
.faq-answer{ max-height:0; overflow:hidden; transition:max-height 0.3s ease, padding 0.3s ease; padding:0 1.5rem 0 4rem; color:#64748b; line-height:1.8; font-size:0.95rem; }
.faq-item-simple.active .faq-answer{ max-height:500px; padding:0 1.5rem 1.5rem 4rem; }

@media (max-width: 767px) {
  .faq-tabs .nav-link{ padding:0.6rem 1.25rem; font-size:0.875rem; }
  .faq-question{ padding:1rem 1.25rem; font-size:0.95rem; }
  .faq-answer{ padding:0 1.25rem 0 3.5rem; font-size:0.9rem; }
  .faq-item-simple.active .faq-answer{ padding:0 1.25rem 1.25rem 3.5rem; }
}

@media (max-width: 575px) {
  .faq-tabs .nav-link{ padding:0.5rem 1rem; font-size:0.85rem; }
  .faq-question{ padding:0.875rem 1rem; font-size:0.9rem; }
  .faq-answer{ padding:0 1rem; font-size:0.875rem; }
  .faq-item-simple.active .faq-answer{ padding:0 1rem 1rem 1rem; }
  .faq-icon{ display:none; }
}

/* Image Frames */
.img-frame{
  border:1px solid #e5e7eb;
  border-radius:12px;
  box-shadow:0 10px 24px rgba(15,23,42,0.10);
  background-color:#fff;
}
.img-frame:hover{ box-shadow:0 12px 28px rgba(15,23,42,0.14); }
.no-frame{ border:none !important; box-shadow:none !important; background:none !important; }

/* Footer */
footer.site-footer{ background:linear-gradient(180deg, var(--deep), var(--deep-2)); color:#e7ecff; border-top:0 }
footer.site-footer a{ color:#cfe0ff }
footer.site-footer a:hover{ color:#fff }


/* Admin layout */
.admin-layout{ min-height:100vh; position:relative; }
.admin-sidebar{ width:260px; background:linear-gradient(180deg, var(--deep), var(--deep-2)); color:#e7ecff; position:sticky; top:0; height:100vh; overflow-y:auto; transition:transform 0.3s ease; z-index:1000; }
.admin-sidebar .nav-link{ color:#cfe0ff; transition:all 0.2s ease; }
.admin-sidebar .nav-link:hover{ color:#fff; background:rgba(255,255,255,.08); border-radius:.5rem; }
.admin-topbar{ position:sticky; top:0; z-index:5; background:#fff; border-bottom:1px solid #e5e7eb; padding:.75rem 1rem; }
.admin-main{ min-width:0; flex:1; }

/* Admin sidebar dropdown */
.admin-dropdown{ position:relative }
.admin-dropdown-toggle{ color:#cfe0ff; cursor:pointer; display:flex; align-items:center; justify-content:space-between; padding:0.5rem 0.75rem; border-radius:0.5rem; transition: all 0.2s ease; font-weight:500; user-select:none; }
.admin-dropdown-toggle:hover{ color:#fff; background:rgba(255,255,255,.08); }
.admin-dropdown-toggle .arrow{ transition: transform 0.2s ease; font-size: 0.75rem; margin-left:auto; }
.admin-dropdown.active .admin-dropdown-toggle{ color:#fff; background:rgba(255,255,255,.08); }
.admin-dropdown.active .admin-dropdown-toggle .arrow{ transform: rotate(180deg); }
.admin-dropdown-menu{ max-height:0; overflow:hidden; transition: max-height 0.3s ease; padding-left:0.5rem; margin-top:0.25rem; }
.admin-dropdown.active .admin-dropdown-menu{ max-height:500px; }
.admin-dropdown-menu .nav-link{ padding:0.4rem 0.75rem; font-size:0.9rem; }


/* Admin sidebar active state */
.admin-sidebar .nav-link.active{ color:#fff; background:rgba(255,255,255,.12); border-radius:.5rem }

/* Admin brand styling */
.admin-brand{ color:#e7ecff }
.admin-brand:hover{ color:#fff }

/* Admin card polish */
.admin-main .card{ border:1px solid #e5e7eb; border-radius:12px }
.admin-main .card .card-title{ font-weight:700; color:#0f172a }
.admin-main .card .card-text{ color:#64748b }

/* Admin sidebar overlay for mobile */
.admin-sidebar-overlay{ display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:999; opacity:0; transition:opacity 0.3s ease; }
.admin-sidebar-overlay.active{ display:block; opacity:1; }

/* Responsive sidebar adjustments */
@media (max-width: 991px){
  .admin-sidebar{ width:240px; }
}
@media (max-width: 767px){
  .admin-sidebar{ position:fixed; left:0; top:0; height:100vh; transform:translateX(-100%); box-shadow:2px 0 8px rgba(0,0,0,0.15); }
  .admin-sidebar.open{ transform:translateX(0); }
  .admin-topbar{ position:sticky; top:0; }
  .admin-main{ width:100%; }
}