/*
  AppForge Public Website Permanent Visual Rules
  Applies to public marketing pages only.

  Rules:
  - No aggressive oversized hero headers.
  - Smaller, softer, colored/gradient page headers.
  - Minimal navbar-to-content vertical gap.
  - Compact section spacing.
  - Avoid oversized section headers inside pages.
*/

:root {
  --appforge-public-heading-gradient:
    linear-gradient(90deg, #eaf6ff 0%, #8be4ff 34%, #a7f3d0 68%, #c4b5fd 100%);

  --appforge-public-heading-soft:
    #d9ecff;

  --appforge-public-muted:
    #aebfd8;
}

/* Reduce navbar height pressure. */
.public-nav,
.nav {
  min-height: 64px !important;
  padding-top: 9px !important;
  padding-bottom: 9px !important;
}

/* Reduce excessive top gap between navbar and first content. */
.public-main > .page-hero:first-child,
.page-hero {
  padding-top: clamp(18px, 2.4vw, 32px) !important;
  padding-bottom: clamp(20px, 3vw, 38px) !important;
}

/* Public page hero headline: smaller, colored, non-aggressive. */
.page-hero h1,
.public-main h1,
body.public-page h1,
h1 {
  max-width: 860px !important;
  margin-top: 12px !important;
  font-size: clamp(1.72rem, 3.25vw, 3.28rem) !important;
  line-height: 1.09 !important;
  letter-spacing: -0.052em !important;
  font-weight: 820 !important;
  color: transparent !important;
  background: var(--appforge-public-heading-gradient) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  text-shadow: none !important;
}

/* Handle nested span-based hero titles. */
.page-hero h1 span,
.public-main h1 span,
h1 span,
.gradient-text {
  color: transparent !important;
  background: var(--appforge-public-heading-gradient) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  text-shadow: none !important;
}

/* Public hero lead text: less large and less spread out. */
.page-hero .lead,
.public-main .lead,
.lead {
  max-width: 780px !important;
  margin-top: 12px !important;
  font-size: clamp(.90rem, 1.06vw, 1.02rem) !important;
  line-height: 1.58 !important;
  color: var(--appforge-public-muted) !important;
}

/* Eyebrow closer to header. */
.eyebrow {
  min-height: 30px !important;
  padding: 6px 10px !important;
  font-size: .68rem !important;
}

/* Reduce all section spacing. */
.section,
.appforge-public-section,
.ai-determinism-section,
.appcloud-marketplace {
  padding-top: clamp(20px, 3vw, 36px) !important;
  padding-bottom: clamp(20px, 3vw, 36px) !important;
}

/* Section header blocks should be compact. */
.section-head {
  max-width: 780px !important;
  margin-bottom: 14px !important;
}

/* Section headers: smaller and colored. */
.section-head h2,
.public-main h2,
section h2 {
  max-width: 820px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  font-size: clamp(1.22rem, 2.05vw, 2.05rem) !important;
  line-height: 1.14 !important;
  letter-spacing: -0.038em !important;
  font-weight: 780 !important;
  color: transparent !important;
  background: var(--appforge-public-heading-gradient) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  text-shadow: none !important;
}

/* Section body copy. */
.section-head p,
section p {
  font-size: .90rem !important;
  line-height: 1.55 !important;
}

/* Do not let cards create visual inflation. */
.card,
.market-card,
.appforge-info-card {
  padding: 15px !important;
  min-height: 132px !important;
  border-radius: 18px !important;
}

/* Card headings are informative, not poster-size. */
.card h3,
.market-card h3,
.appforge-info-card h3 {
  font-size: .94rem !important;
  line-height: 1.18 !important;
  letter-spacing: -0.022em !important;
}

/* Reduce grid gaps. */
.grid,
.grid.four,
.appforge-section-grid {
  gap: 11px !important;
}

/* Compact big panels. */
.big-panel,
.appcloud-feature-band {
  padding: clamp(16px, 2.2vw, 24px) !important;
  border-radius: 22px !important;
}

/* Actions closer to text. */
.actions {
  margin-top: 16px !important;
}

/* Prevent legacy huge hero styles from older one-page landing CSS. */
.hero-title,
.title-soft,
.title-gradient,
.appcloud-title,
.ai-det-title {
  font-size: clamp(1.72rem, 3.25vw, 3.28rem) !important;
  line-height: 1.09 !important;
  letter-spacing: -0.052em !important;
  font-weight: 820 !important;
  color: transparent !important;
  background: var(--appforge-public-heading-gradient) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  text-shadow: none !important;
}

/* Reduce specific animated page headers. */
.appcloud-title span,
.ai-det-title span {
  color: transparent !important;
  background: var(--appforge-public-heading-gradient) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}

/* Compact marketplace and intelligence areas. */
.appcloud-hero,
.ai-det-head {
  gap: clamp(16px, 2.6vw, 28px) !important;
  margin-bottom: 18px !important;
}

.appcloud-lead,
.ai-det-lead {
  font-size: clamp(.90rem, 1.06vw, 1.02rem) !important;
  line-height: 1.58 !important;
  margin-top: 12px !important;
}

/* Mobile protection. */
@media (max-width: 760px) {
  .public-main > .page-hero:first-child,
  .page-hero {
    padding-top: 16px !important;
    padding-bottom: 24px !important;
  }

  .page-hero h1,
  .public-main h1,
  h1 {
    font-size: clamp(1.55rem, 8vw, 2.35rem) !important;
    line-height: 1.11 !important;
  }

  .section-head h2,
  .public-main h2,
  section h2 {
    font-size: clamp(1.16rem, 6vw, 1.72rem) !important;
    line-height: 1.16 !important;
  }

  .section,
  .appforge-public-section,
  .ai-determinism-section,
  .appcloud-marketplace {
    padding-top: 18px !important;
    padding-bottom: 22px !important;
  }
}

/* APPFORGE_PUBLIC_MINIMUM_VERTICAL_SPACING_RULE_START */
@import url("./appforge-public-minimum-spacing-rules.css");
/* APPFORGE_PUBLIC_MINIMUM_VERTICAL_SPACING_RULE_END */
