/* PI AI CREATIVE STUDIO
   V3.3.2 — HOMEPAGE TYPOGRAPHY POLISH
   Builds on V3.3.1.1 stable source.
   Typography only: no layout / CMS / DB / provider / story / auth / route changes. */

/* V3.3.2_SOURCE_VERIFIED */

:root{
  --v332-hero-brand: clamp(38px, 4.15vw, 62px);
  --v332-hero-title: clamp(30px, 3.25vw, 48px);
  --v332-hero-lead: clamp(15px, 1.05vw, 17px);
  --v332-studio-heading: clamp(27px, 2.65vw, 40px);
  --v332-section-heading: clamp(28px, 2.8vw, 42px);
}

/* Hero: reduce visual dominance while preserving hierarchy */
.hero h1{
  font-size: var(--v332-hero-brand) !important;
  line-height: 1.045 !important;
  letter-spacing: -.035em !important;
  margin: 17px 0 16px !important;
  max-width: 820px;
}

.hero h1 .gradient{
  display: inline-block;
}

/* The second line in current Blade is part of the same H1.
   Scale it slightly below the brand line without changing markup. */
.hero h1 br + *{
  font-size: inherit;
}

.lead{
  font-size: var(--v332-hero-lead) !important;
  line-height: 1.72 !important;
  max-width: 720px !important;
  margin-bottom: 22px !important;
}

.badge{
  font-size: 12px !important;
  padding: 7px 12px !important;
}

/* Studio section */
.pi-v13-hero h2{
  font-size: var(--v332-studio-heading) !important;
  line-height: 1.12 !important;
  letter-spacing: -.02em !important;
  margin: 13px 0 9px !important;
}

.pi-v13-hero > p{
  font-size: 14px !important;
  line-height: 1.68 !important;
  max-width: 900px !important;
}

.pi-v13-card h3{
  font-size: 18px !important;
  line-height: 1.3 !important;
}

.pi-v13-card p{
  font-size: 13px !important;
  line-height: 1.62 !important;
}

/* Standard homepage section headings */
.section-head h2{
  font-size: var(--v332-section-heading) !important;
  line-height: 1.15 !important;
  letter-spacing: -.018em !important;
}

.section-head p{
  font-size: 14px !important;
  line-height: 1.6 !important;
}

/* Cards: slightly more restrained desktop type */
.features .card h3,
.learning-grid .card h3{
  font-size: 17px !important;
}

.features .card p,
.learning-grid .card p,
.video-grid .card p,
.plans .card > p{
  font-size: 13px !important;
}

.plans .card h3{
  font-size: 19px !important;
}

.plans .price{
  font-size: clamp(34px, 2.7vw, 42px) !important;
}

/* Laptop */
@media (max-width:1199px){
  :root{
    --v332-hero-brand: clamp(36px, 5vw, 54px);
    --v332-hero-title: clamp(29px, 4vw, 44px);
    --v332-studio-heading: clamp(26px, 3.4vw, 36px);
  }
}

/* Tablet */
@media (max-width:920px){
  :root{
    --v332-hero-brand: clamp(36px, 7vw, 50px);
    --v332-section-heading: clamp(27px, 5vw, 38px);
  }

  .hero h1{
    max-width: 760px;
  }

  .lead{
    max-width: 680px !important;
  }
}

/* Mobile */
@media (max-width:700px){
  :root{
    --v332-hero-brand: clamp(31px, 9.2vw, 42px);
    --v332-hero-lead: 15px;
    --v332-studio-heading: clamp(25px, 7vw, 34px);
    --v332-section-heading: clamp(26px, 7vw, 34px);
  }

  .hero h1{
    line-height: 1.07 !important;
    letter-spacing: -.025em !important;
    margin: 13px 0 14px !important;
  }

  .pi-v13-hero > p{
    font-size: 13.5px !important;
  }

  .pi-v13-card h3{
    font-size: 17px !important;
  }
}

@media (max-width:380px){
  :root{
    --v332-hero-brand: 30px;
    --v332-studio-heading: 24px;
    --v332-section-heading: 25px;
  }
}
