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

:root {
  --ui-bg: #f6f7f9;
  --ui-surface: #ffffff;
  --ui-text: #17191c;
  --ui-muted: #6f7782;
  --ui-border: #e7e9ed;
  --ui-primary: #2563eb;
  --ui-primary-hover: #1d4ed8;
  --ui-success: #16803c;
  --ui-radius: 16px;
  --ui-radius-sm: 10px;
  --ui-shadow: 0 8px 30px rgba(15, 23, 42, .06);
}

* { font-family: 'Prompt', sans-serif; }
html { scroll-behavior: smooth; }
body { background: var(--ui-bg); color: var(--ui-text); font-weight: 400; line-height: 1.7; }
a { color: inherit; }

/* Navigation */
.navbar {
  z-index: 1030;
  min-height: 68px;
  padding: .7rem 0;
  background: rgba(255,255,255,.92) !important;
  border-bottom: 1px solid rgba(231,233,237,.9);
  box-shadow: 0 1px 12px rgba(15,23,42,.03);
  transition: box-shadow .2s ease, background .2s ease;
}
.navbar.glass { backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.navbar .navbar-brand { font-size: 1.02rem; letter-spacing: -.02em; color: var(--ui-text); }
.navbar .navbar-brand img { width: 34px; height: 34px; object-fit: cover; border-radius: 9px; margin-right: 10px; }
.navbar .nav-link { color: #535b66 !important; font-size: .92rem; font-weight: 500; padding: .55rem .8rem !important; border-radius: 9px; }
.navbar .nav-link:hover, .navbar .nav-link:focus { color: var(--ui-text) !important; background: #f2f4f7; }
.navbar .dropdown-menu { border: 1px solid var(--ui-border); border-radius: 12px; padding: .4rem; box-shadow: var(--ui-shadow); margin-top: .55rem; }
.dropdown-item { border-radius: 8px; padding: .55rem .7rem; color: #4b5563; font-size: .9rem; }
.dropdown-item:hover { background: #f5f7fa; color: var(--ui-text); }
.navbar-toggler { border: 1px solid var(--ui-border); border-radius: 9px; padding: .45rem .6rem; }

/* Typography */
h1,h2,h3,h4,h5,h6 { color: var(--ui-text); letter-spacing: -.025em; font-weight: 600; }
.text-muted { color: var(--ui-muted) !important; }
.lead { color: var(--ui-muted); }

/* Layout / surfaces */
.container { max-width: 1160px; }
.card, .software-item, .list-group, .modal-content {
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius) !important;
  background: var(--ui-surface) !important;
  box-shadow: none;
}
.card-header { background: transparent !important; border-bottom: 1px solid var(--ui-border) !important; padding: 1rem 1.25rem; font-weight: 600; }
.card-body { padding: 1.25rem; }
.software-item { padding: .25rem; margin-bottom: 1rem; overflow: hidden; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.software-item:hover { transform: translateY(-2px); box-shadow: var(--ui-shadow); border-color: #dfe3e8 !important; }
.software-item img { border-radius: 12px; display: block; }

/* Hero */
.jumbotron { border-radius: 20px; overflow: hidden; }
.home-hero { position: relative; min-height: 420px; display: flex; align-items: center; background-position: center; background-size: cover; }
.home-hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(255,255,255,.97) 0%, rgba(255,255,255,.88) 52%, rgba(255,255,255,.18) 100%); }
.home-hero-content { position: relative; max-width: 760px; padding: 5.5rem 4rem; text-align: left; }
.home-hero-content h1 { font-size: clamp(2.2rem, 5vw, 4rem); line-height: 1.1; margin-bottom: 1rem; }
.page-hero { background: #111827 !important; color: white; border-radius: 0; }
.page-hero h1 { color: white; font-size: clamp(2rem, 4vw, 3rem); }
.page-hero p { color: #b8c0cc !important; }

/* Buttons */
.btn { border-radius: 10px; font-weight: 500; padding: .58rem .9rem; transition: transform .15s ease, background .15s ease, border-color .15s ease; }
.btn:active { transform: translateY(1px); }
.btn-primary { background: var(--ui-primary); border-color: var(--ui-primary); }
.btn-primary:hover { background: var(--ui-primary-hover); border-color: var(--ui-primary-hover); }
.btn-outline-primary { color: var(--ui-primary); border-color: #cdd9f7; background: #fff; }
.btn-outline-primary:hover { color: #fff; background: var(--ui-primary); border-color: var(--ui-primary); }
.btn-outline-secondary { color: #4b5563; border-color: var(--ui-border); }
.btn-outline-success { color: var(--ui-success); border-color: #cce8d6; }
.btn-outline-danger { border-color: #f1c9c9; }

/* Forms */
.form-control, .form-select { min-height: 48px; border: 1px solid #dfe3e8; border-radius: 10px; background: #fff; color: var(--ui-text); }
.form-control:focus, .form-select:focus { border-color: #9db7f5; box-shadow: 0 0 0 3px rgba(37,99,235,.10); }
.form-floating > label { color: #7b8490; }

/* Tables / lists */
.table { margin-bottom: 0; background: #fff; border-color: var(--ui-border); }
.table > :not(caption) > * > * { padding: .9rem .85rem; border-bottom-color: var(--ui-border); }
.table thead th, .table tr:first-child th { color: #606976; font-size: .82rem; font-weight: 600; white-space: nowrap; background: #fafbfc; }
.table-responsive { border: 1px solid var(--ui-border); border-radius: var(--ui-radius); overflow-x: auto; }
.list-group-item { border-color: var(--ui-border); padding: .85rem 1rem; background: transparent; }
.list-group-item-action:hover { background: #f8fafc; }
.badge { border-radius: 999px; padding: .4em .7em; font-weight: 500; }

/* Product/detail */
.carousel-inner { border-radius: 14px; overflow: hidden; background: #f1f3f6; }
.modal { background: rgba(15,23,42,.32); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.modal-content { box-shadow: 0 24px 70px rgba(15,23,42,.16); }
.modal-header, .modal-footer { border-color: var(--ui-border); }

/* Utilities */
hr { border-color: var(--ui-border); opacity: 1; }
.shadow { box-shadow: var(--ui-shadow) !important; }
.bg-light { background: var(--ui-bg) !important; }
.bg-dark { background: #111827 !important; }
.text-primary { color: var(--ui-primary) !important; }

/* Legacy inline hero compatibility */
body > .jumbotron { margin-top: 0; }

@media (max-width: 991.98px) {
  .navbar .navbar-collapse { padding-top: .65rem; }
  .navbar .nav-link { padding: .65rem .75rem !important; }
  .home-hero-content { padding: 4rem 2rem; }
}

@media (max-width: 575.98px) {
  .container { padding-left: 1rem; padding-right: 1rem; }
  .home-hero { min-height: 390px; }
  .home-hero::before { background: rgba(255,255,255,.9); }
  .home-hero-content { padding: 3rem 1.25rem; }
  .software-item .row { padding: 1rem !important; }
  .card-body { padding: 1rem; }
  .display-4 { font-size: 2rem; }
}


/* UX layout refinement */
main, .page-content { min-height: 60vh; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:1rem; margin-bottom:1.25rem; }
.section-heading p { margin:0; color:var(--ui-muted); }
.feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.feature-card { padding:1.35rem 1.4rem; min-height:150px; }
.feature-card .feature-icon { width:38px; height:38px; display:grid; place-items:center; border-radius:10px; background:#eff4ff; color:var(--ui-primary); margin-bottom:.85rem; }
.feature-card h3 { font-size:1.02rem; margin-bottom:.35rem; }
.feature-card p { color:var(--ui-muted); font-size:.91rem; margin:0; }
.profile-strip { display:grid; grid-template-columns:auto 1fr auto; gap:1.25rem; align-items:center; padding:1.25rem; border:1px solid var(--ui-border); border-radius:var(--ui-radius); background:#fff; }
.profile-strip img { width:72px; height:72px; object-fit:cover; border-radius:14px; }
.profile-strip h2 { font-size:1.15rem; margin:0 0 .15rem; }
.profile-strip p { margin:0; color:var(--ui-muted); font-size:.9rem; }
.software-list { display:grid; gap:1rem; }
.software-item { padding:0; margin:0; }
.software-item .product-layout { display:grid; grid-template-columns:minmax(280px,.92fr) minmax(0,1.08fr); gap:0; align-items:stretch; }
.software-item .product-media { min-height:310px; background:#f4f6f8; overflow:hidden; }
.software-item .product-media img { width:100%; height:100%; min-height:310px; object-fit:contain; border-radius:0; }
.software-item .product-info { padding:1.65rem 1.7rem; display:flex; flex-direction:column; }
.software-item .product-info h2 { font-size:1.35rem; margin:0 0 .55rem; }
.software-item .product-info .description { color:var(--ui-muted); font-size:.94rem; margin-bottom:1.25rem; }
.product-meta { margin-top:auto; padding-top:1rem; border-top:1px solid var(--ui-border); }
.product-price { font-size:1rem; margin-bottom:.9rem; }
.product-price strong { font-size:1.12rem; }
.product-actions { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
.product-actions.single { grid-template-columns:1fr; }
.product-actions .btn { min-height:44px; }
.detail-shell { padding:2rem 0 3rem; }
.detail-top { display:flex; align-items:center; gap:.75rem; margin-bottom:1.25rem; color:var(--ui-muted); }
.detail-top a { text-decoration:none; color:inherit; }
.detail-top a:hover { color:var(--ui-text); }
.detail-grid { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr); gap:1.5rem; align-items:start; }
.detail-gallery { overflow:hidden; border:1px solid var(--ui-border); border-radius:var(--ui-radius); background:#fff; }
.detail-gallery .carousel-inner { border-radius:0; }
.detail-panel { position:sticky; top:92px; border:1px solid var(--ui-border); border-radius:var(--ui-radius); background:#fff; padding:1.5rem; }
.detail-panel h1 { font-size:clamp(1.7rem,3vw,2.35rem); line-height:1.2; margin-bottom:.65rem; }
.detail-panel .summary { color:var(--ui-muted); margin-bottom:1.25rem; }
.detail-panel .price-box { padding:1rem; border-radius:12px; background:#f7f8fa; margin-bottom:1rem; }
.detail-panel .price-box .label { color:var(--ui-muted); font-size:.82rem; }
.detail-panel .price-box .value { font-size:1.25rem; font-weight:600; }
.detail-panel .demo-box { margin-top:1rem; padding-top:1rem; border-top:1px solid var(--ui-border); font-size:.88rem; color:var(--ui-muted); }
.page-container { padding:2rem 0 3rem; }
.auth-shell { min-height:calc(100vh - 68px); display:grid; place-items:center; padding:2rem 1rem; }
.auth-card { width:min(100%,440px); }
@media (max-width: 991.98px) {
  .feature-grid { grid-template-columns:1fr; }
  .profile-strip { grid-template-columns:auto 1fr; }
  .profile-strip .profile-action { grid-column:2; }
  .software-item .product-layout { grid-template-columns:1fr; }
  .software-item .product-media, .software-item .product-media img { min-height:240px; height:240px; }
  .detail-grid { grid-template-columns:1fr; }
  .detail-panel { position:static; }
}
@media (max-width: 575.98px) {
  .section-heading { align-items:start; flex-direction:column; }
  .home-hero { border-radius:0; margin-left:-1rem; margin-right:-1rem; }
  .profile-strip { grid-template-columns:auto 1fr; }
  .profile-strip .profile-action { grid-column:1 / -1; width:100%; }
  .software-item .product-info { padding:1.2rem; }
  .product-actions { grid-template-columns:1fr; }
  .detail-shell { padding-top:1rem; }
  .detail-panel { padding:1.15rem; }
}