/* Train With Okey — About Polish v1.1 */

/* Scope: only About pages (class added via JS) */
body.two-about-page {
  --two-text: #e6e9ec;
  --two-muted: #c2c8cf;
  --two-bg: rgba(14, 17, 22, 0.6);
  --two-card-bg: rgba(22, 26, 33, 0.4);
  --two-border: rgba(255,255,255,0.08);
}

/* Typography upgrades */
body.two-about-page h1 {
  font-size: clamp(36px, 5vw, 64px);
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: -0.01em;
}
body.two-about-page h2 {
  font-size: clamp(24px, 3vw, 32px);
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -0.005em;
  margin-top: 24px;
}
body.two-about-page p, 
body.two-about-page li {
  font-size: clamp(18px, 2vw, 20px);
  line-height: 1.7;
}

/* Hero: keep your current cover but pin the headline top-left */
body.two-about-page .wp-block-cover {
  min-height: 62vh;
}
body.two-about-page .wp-block-cover .wp-block-cover__inner-container {
  display: flex;
  justify-content: flex-start !important;   /* left */
  align-items: flex-start !important;       /* top */
  text-align: left !important;
  padding: clamp(16px, 4vw, 48px) !important;
  max-width: 1200px;
}
/* Only the bold headline should show in the hero area */
body.two-about-page .wp-block-cover .wp-block-cover__inner-container > p {
  display: none !important;
}
body.two-about-page .wp-block-cover .wp-block-cover__inner-container h1 {
  margin: 0 !important;
  max-width: 22ch;
  color: #ffffff !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.55);
}

/* Subtle overlay to ensure readability regardless of image */
body.two-about-page .wp-block-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.38) 0%, rgba(0,0,0,.25) 45%, rgba(0,0,0,.35) 100%);
  pointer-events: none;
}

/* Optional: modern card for the first content section after hero */
body.two-about-page main .entry-content > *:first-child {
  background: var(--two-card-bg);
  border: 1px solid var(--two-border);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-radius: 16px;
  padding: clamp(16px, 3.5vw, 32px);
}

/* Respect theme spacing */
@media (max-width: 640px) {
  body.two-about-page .wp-block-cover { min-height: 56vh; }
  body.two-about-page h1 { font-size: clamp(32px, 8vw, 48px); }
}