/* ============================================================================
   StartupCredits.org — Global Typography, Spacing & 100% Responsive Polish
   ============================================================================ */

/* 1. Fix Notification Bar Overlap & Centering on All Viewports */
html.has-notification-bar .layout-content-pane,
.layout-content-pane {
  margin-top: 0 !important;
  padding-top: 0 !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

.site-header,
.site-header[data-astro-cid-3ef6ksr2] {
  position: sticky !important;
  top: 0 !important;
  z-index: 120 !important;
  background: var(--md-sys-color-background, #0d1117) !important;
  width: 100% !important;
}

#notification-bar,
.notification-bar,
.notification-bar[data-astro-cid-3ef6ksr2] {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  border-radius: 0 !important;
  height: auto !important;
  min-height: 38px !important;
  box-sizing: border-box !important;
  z-index: 125 !important;
}

.nav-drawer,
.nav-drawer[data-astro-cid-6aabv5oc] {
  top: 0 !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
}

.drawer-header {
  padding-top: 14px !important;
}

.notification-bar-container,
.notification-bar-container[data-astro-cid-3ef6ksr2] {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  padding: 7px 40px 7px 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
}

.notification-bar-content,
.notification-bar-content[data-astro-cid-3ef6ksr2] {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px 10px !important;
  text-align: center !important;
  line-height: 1.35 !important;
}

/* 2. 100% Full-Width Standard Fluid Layout Across All Desktop & Wide Monitors */
.layout-main {
  padding: 24px 0 56px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.layout-main-wrapper {
  width: 100% !important;
  max-width: 100% !important;
}

.layout-main .container-fluid,
.container-fluid,
.site-header .container,
.site-footer .container,
.container {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding-left: 32px !important;
  padding-right: 32px !important;
  box-sizing: border-box !important;
}

.resource-list,
.smart-section,
.new-grid,
.carousel-container,
.emergent-ad-campaign,
.global-offer-banner,
.bottom-newsletter-wrapper,
.newsletter-box,
.resource-layout,
.blog-layout,
.blog-grid,
.brands-full-content,
.pagination {
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

@media (min-width: 1025px) {
  .resource-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 330px !important;
    gap: 32px !important;
  }

  .blog-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 310px !important;
    gap: 36px !important;
  }
}

@media (max-width: 1024px) {
  .resource-layout,
  .blog-layout {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 28px !important;
    width: 100% !important;
  }

  .resource-main,
  .resource-sidebar,
  .blog-layout .main-content,
  .blog-layout .sidebar {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
}

/* 3. Professional Typography & Heading Scale */
.page-header-title,
.category-title {
  font-size: 27px !important;
  font-weight: 700 !important;
  letter-spacing: -0.4px !important;
  line-height: 1.25 !important;
  margin: 0 0 8px 0 !important;
}

.resource-title {
  font-size: 26px !important;
  font-weight: 700 !important;
  letter-spacing: -0.4px !important;
  line-height: 1.25 !important;
}

/* 4. Auto-Responsive 3-Col -> 2-Col -> 1-Col Grid for New Arrivals & Deal Feeds */
.new-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

@media (max-width: 1420px) {
  .new-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

.new-card {
  padding: 15px 16px !important;
  border-radius: 14px !important;
}

.new-card-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px 8px !important;
  margin-bottom: 6px !important;
}

.new-card-title {
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  margin: 0 !important;
}

.emergent-cta-btn,
.leaderboard-btn {
  padding: 0 18px !important;
  height: 38px !important;
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
}

.workspace-ad-campaign .ad-image {
  filter: none !important;
  -webkit-filter: none !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  border-radius: 10px !important;
}

.offer-step-item .editor-link {
  color: #3b82f6 !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

html.dark .offer-step-item .editor-link {
  color: #60a5fa !important;
}

/* 5. Editorial Blog Article Hierarchy (H1, H2, H3, Paragraphs, Lists, Tables & Internal Links) */
.article-content h2,
.article-content .editor-heading-h2 {
  font-size: 22.5px !important;
  font-weight: 700 !important;
  line-height: 1.32 !important;
  margin: 40px 0 12px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  color: var(--text-heading) !important;
}

.article-content h3,
.article-content .editor-heading-h3 {
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  margin: 22px 0 10px !important;
  color: var(--text-heading) !important;
}

.article-content p,
.article-content .editor-paragraph {
  font-size: 15px !important;
  line-height: 1.75 !important;
  margin: 0 0 14px !important;
  color: var(--text) !important;
}

.article-content ul,
.article-content ol {
  margin: 12px 0 20px !important;
  padding-left: 24px !important;
  font-size: 14.5px !important;
  line-height: 1.7 !important;
}

.article-content li {
  margin-bottom: 7px !important;
}

.article-content a {
  color: #3b82f6 !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

html.dark .article-content a {
  color: #60a5fa !important;
}

/* 6. Larger Sidebar & Header Brand Logo + Polished Pagination Pills */
#header-theme-toggle .sun-icon { display: none; }
#header-theme-toggle .moon-icon { display: block; }
html.dark #header-theme-toggle .sun-icon { display: block; color: #facc15; }
html.dark #header-theme-toggle .moon-icon { display: none; }

.drawer-header .drawer-logo .site-logo,
.drawer-logo img.site-logo {
  height: 38px !important;
  width: 190px !important;
  max-width: 195px !important;
  object-fit: contain !important;
  object-position: left center !important;
}

.pagination {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 34px 0 24px !important;
  width: 100% !important;
}

.pagination-numbers {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.pagination .page-number,
.pagination .page-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 38px !important;
  height: 38px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  background: var(--md-sys-color-surface-container-low, #1b2230) !important;
  color: var(--md-sys-color-on-surface, #e2e8f0) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  text-decoration: none !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  transition: all 0.15s ease !important;
}

.pagination .page-number:hover,
.pagination .page-btn:hover,
.pagination .pagination-btn:hover {
  border-color: var(--md-sys-color-primary, #38bdf8) !important;
  transform: translateY(-1px) !important;
}

.pagination .page-number.active,
.pagination .page-btn.active {
  background: var(--md-sys-color-primary, #38bdf8) !important;
  color: var(--md-sys-color-on-primary, #061326) !important;
  border-color: transparent !important;
  font-weight: 700 !important;
}

.pagination .pagination-btn,
.pagination .pagination-btn-disabled {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 38px !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  background: var(--md-sys-color-surface-container-low, #1b2230) !important;
  color: var(--md-sys-color-on-surface, #e2e8f0) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  text-decoration: none !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
}

.pagination .pagination-btn-disabled {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
}

/* 7. Dynamic 3-Column Homepage pSEO Compact Card Boxes + Filter Tabs */
.home-pseo-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.home-pseo-eyebrow {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--md-sys-color-primary, #6366f1);
  margin-bottom: 4px;
}

.home-pseo-title {
  font-size: 21px;
  font-weight: 700;
  margin: 0;
  color: var(--text-heading, var(--md-sys-color-on-surface));
  letter-spacing: -0.3px;
}

.home-pseo-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
}

@media (max-width: 1180px) {
  .home-pseo-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 767px) {
  .home-pseo-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

.home-pseo-card {
  display: flex !important;
  align-items: center !important;
  padding: 14px 16px !important;
  border-radius: 12px !important;
  background: var(--md-sys-color-surface, #131624) !important;
  border: 1px solid rgba(148, 163, 184, 0.16) !important;
  text-decoration: none !important;
  color: inherit !important;
  transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease !important;
}

html:not(.dark) .home-pseo-card {
  background: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  box-shadow: 0 3px 12px rgba(15, 23, 42, 0.05) !important;
}

.home-pseo-card:hover {
  transform: translateY(-2px) !important;
  border-color: var(--md-sys-color-primary, #6366f1) !important;
  box-shadow: 0 8px 22px -8px rgba(99, 102, 241, 0.28) !important;
}

.home-pseo-card-row {
  display: flex;
  align-items: center;
  gap: 11px;
  width: 100%;
  min-width: 0;
}

.home-pseo-badge {
  flex-shrink: 0;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 3px 8px;
  border-radius: 6px;
  background: rgba(99, 102, 241, 0.16);
  color: #818cf8;
  border: 1px solid rgba(99, 102, 241, 0.3);
}

.home-pseo-badge.badge-for,
.home-pseo-badge.badge-stack {
  background: rgba(16, 185, 129, 0.15);
  color: #34d399;
  border-color: rgba(16, 185, 129, 0.32);
}

.home-pseo-badge.badge-alternatives {
  background: rgba(56, 189, 248, 0.15);
  color: #38bdf8;
  border-color: rgba(56, 189, 248, 0.32);
}

html:not(.dark) .home-pseo-badge {
  background: #eef2ff;
  color: #4338ca;
  border-color: #a5b4fc;
}

.home-pseo-card-title {
  flex: 1;
  min-width: 0;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  color: var(--md-sys-color-on-surface, #f8fafc) !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

html:not(.dark) .home-pseo-card-title {
  color: #0f172a !important;
}

.home-pseo-arrow {
  flex-shrink: 0;
  font-size: 14px;
  font-weight: 700;
  color: var(--md-sys-color-primary, #6366f1);
  opacity: 0.75;
  transition: transform 0.15s ease, opacity 0.15s ease;
}

.home-pseo-card:hover .home-pseo-arrow {
  transform: translateX(3px);
  opacity: 1;
}

/* 8. Single Resource Page "Deals (N) | About [Brand]" Tab Bar (Exact Reference UI) */
.res-main-tabs-bar {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22) !important;
  margin: 18px 0 22px 0 !important;
  padding: 0 !important;
}

.res-main-tab-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 11px 4px !important;
  margin-bottom: -1px !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 2.5px solid transparent !important;
  color: var(--text-muted, #94a3b8) !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: color 0.15s ease, border-color 0.15s ease !important;
}

.res-main-tab-btn:hover {
  color: var(--text-heading, #ffffff) !important;
}

.res-main-tab-btn.active {
  color: var(--text-heading, #ffffff) !important;
  border-bottom-color: var(--text-heading, #ffffff) !important;
}

html:not(.dark) .res-main-tab-btn.active {
  color: #0f172a !important;
  border-bottom-color: #0f172a !important;
}

/* 9. Complete Light Mode Box & Card Contrast Polish (Across All Pages & Themes) */
html:not(.dark),
html:not(.dark) body {
  background-color: #ffffff !important;
}

html:not(.dark) #emergent-banner-leaderboard,
html:not(.dark) .emergent-ad-campaign,
html:not(.dark) .emergent-ad-leaderboard {
  background: linear-gradient(135deg, #eef2ff 0%, #f1f5f9 100%) !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 14px !important;
  padding: 6px 8px !important;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06) !important;
}

html:not(.dark) .workspace-ad-campaign:not(.emergent-ad-leaderboard) {
  background: #f1f5f9 !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05) !important;
}

html:not(.dark) .resource-header {
  background: #f8fafc !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 16px !important;
  padding: 24px !important;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05) !important;
}

html:not(.dark) .credit-badge {
  background: #eef2ff !important;
  color: #3730a3 !important;
  border: 1px solid #c7d2fe !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  font-weight: 600 !important;
}

html:not(.dark) .discovery-card,
html:not(.dark) .fresh-deal-card,
html:not(.dark) .latest-discoveries .discovery-card,
html:not(.dark) .same-brand-section .discovery-card,
html:not(.dark) .related-deals-sidebar .discovery-card {
  background: #f1f5f9 !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 12px !important;
  padding: 14px 16px !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04) !important;
  transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.15s ease !important;
}

html:not(.dark) .discovery-card:hover,
html:not(.dark) .latest-discoveries .discovery-card:hover {
  background: #e8eef7 !important;
  border-color: #6366f1 !important;
  transform: translateY(-2px) !important;
}

html:not(.dark) .about-provider-card,
html:not(.dark) .software-overview-section,
html:not(.dark) .startup-founder-card,
html:not(.dark) .deals-filter-section,
html:not(.dark) .offer-panel,
html:not(.dark) .pseo-internal-silo,
html:not(.dark) .verification-banner,
html:not(.dark) .newsletter-widget {
  background: #f1f5f9 !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 14px !important;
  box-shadow: 0 3px 12px rgba(15, 23, 42, 0.05) !important;
}

html:not(.dark) .software-overview-section {
  padding: 18px 20px !important;
  margin-bottom: 20px !important;
}

html:not(.dark) .startup-spec-item,
html:not(.dark) .offer-how-to-claim-block,
html:not(.dark) .offer-collapsible-block,
html:not(.dark) .coupon-card {
  background: #f8fafc !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 10px !important;
}

.startup-founder-card {
  padding: 20px 22px !important;
  box-sizing: border-box !important;
}

.startup-spec-item {
  padding: 12px 16px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

.offer-how-to-claim-block,
.offer-collapsible-block {
  padding: 16px 20px !important;
  margin-bottom: 14px !important;
  box-sizing: border-box !important;
}

html:not(.dark) .tag,
html:not(.dark) .tag-link-chip,
html:not(.dark) .chip {
  background: #f1f5f9 !important;
  border: 1px solid #cbd5e1 !important;
  color: #334155 !important;
}

html:not(.dark) .chip.active {
  background: #4f46e5 !important;
  border-color: #4f46e5 !important;
  color: #ffffff !important;
}

/* ============================================================================
   11. /PRODUCTS & /PRODUCTS/:SLUG 100% RESPONSIVE GRID & MOBILE POLISH
   ============================================================================ */
/* Fix Deal Grid Card Logo + Credit Badge Spacing so they never touch */
.trending-card .card-top {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 14px !important;
}
.trending-card .card-logo {
  flex-shrink: 0 !important;
}
.trending-card .card-top-trailing {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 6px !important;
  min-width: 0 !important;
  max-width: calc(100% - 52px) !important;
  text-align: right !important;
}
.trending-card .credits-badge,
.new-card .credits-badge {
  max-width: 100% !important;
  white-space: normal !important;
  line-height: 1.3 !important;
}
.new-card-meta {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
}
.item-leading {
  gap: 14px !important;
}

/* Fix FAQ & Collapsible Summary Marker so native triangle never floats above H3 */
details.offer-collapsible-block > summary,
.offer-collapsible-summary {
  list-style: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  cursor: pointer !important;
}
details.offer-collapsible-block > summary::-webkit-details-marker,
.offer-collapsible-summary::-webkit-details-marker {
  display: none !important;
}
details.offer-collapsible-block > summary::marker,
.offer-collapsible-summary::marker {
  display: none !important;
  content: "" !important;
}
html.dark .offer-collapsible-block,
html.dark .offer-how-to-claim-block {
  background: rgba(15, 23, 42, 0.55) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-radius: 12px !important;
}
details.offer-collapsible-block[open] > summary .collapsible-icon {
  transform: rotate(180deg);
}

.prod-responsive-section {
  padding: 26px 28px !important;
  box-sizing: border-box !important;
  width: 100% !important;
}

.prod-catalog-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 20px !important;
  width: 100% !important;
}

.prod-reviews-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
  width: 100% !important;
}

.prod-catalog-card {
  padding: 22px !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
}

@media (max-width: 1180px) {
  .prod-catalog-grid,
  .prod-reviews-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 767px) {
  html .layout-main .container-fluid,
  html[data-site-theme="prostudio"] .layout-main .container-fluid,
  html[data-site-theme="neoeditorial"] .layout-main .container-fluid,
  html[data-site-theme="vercelmono"] .layout-main .container-fluid,
  html[data-site-theme="nordicminimal"] .layout-main .container-fluid,
  html[data-site-theme="royalvelvet"] .layout-main .container-fluid {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .prod-catalog-grid,
  .prod-reviews-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
  }

  .prod-responsive-section,
  .prod-catalog-card,
  .startup-founder-card {
    padding: 16px 14px !important;
    border-radius: 14px !important;
  }

  .startup-spec-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .startup-spec-item {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 4px !important;
    padding: 10px 12px !important;
  }

  #prod-catalog-search {
    max-width: 100% !important;
    flex: 1 1 100% !important;
  }
}

/* ============================================================================
   TABLET & MOBILE BREAKPOINTS (<= 991px and <= 767px)
   ============================================================================ */
@media (max-width: 991px) {
  .layout-main .container-fluid {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

@media (max-width: 767px) {
  .sidebar-wrapper {
    width: 0 !important;
  }
  .site-header .container {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  .site-header nav {
    height: 56px !important;
    gap: 8px !important;
  }
  .site-logo {
    height: 32px !important;
    width: auto !important;
    max-width: 170px !important;
  }
  .notification-bar-container,
  .notification-bar-container[data-astro-cid-3ef6ksr2] {
    padding: 6px 34px 6px 12px !important;
    font-size: 12px !important;
  }
  .layout-main {
    padding: 16px 0 40px !important;
  }
  .layout-main .container-fluid {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  .page-header-title,
  .category-title,
  .resource-title,
  .article-title {
    font-size: 21px !important;
    line-height: 1.3 !important;
  }
  .new-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
  }
  .new-card {
    padding: 13px 14px !important;
    gap: 12px !important;
  }
  .new-card-meta {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 5px !important;
  }
  .new-card-meta .credits-badge {
    font-size: 11px !important;
    padding: 2px 8px !important;
    border-radius: 6px !important;
    white-space: normal !important;
    line-height: 1.35 !important;
  }
  .new-card-title {
    font-size: 14px !important;
    line-height: 1.35 !important;
  }
  .list-item {
    padding: 14px !important;
    gap: 12px !important;
  }
  .item-leading .item-logo {
    width: 48px !important;
    height: 48px !important;
  }
  .item-title-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 6px !important;
  }
  .item-title {
    font-size: 15px !important;
    line-height: 1.35 !important;
  }
  .item-desc {
    font-size: 13px !important;
    line-height: 1.5 !important;
  }
  .startup-spec-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  .offer-panel {
    padding: 16px !important;
  }
  .offer-title {
    font-size: 17px !important;
    line-height: 1.35 !important;
  }
}
