/*
 * course-format.css -- the two things the course page never said.
 *
 * Standalone and path-versioned like ad-landing.css: css/styles.css is a Grunt
 * build of workspace/sass that this checkout cannot regenerate, so page-specific
 * rules ship beside it. .htaccess rewrites /css/course-format.<mtime>.css here.
 *
 * Loaded on course pages only -- every other page pays nothing for it.
 */

/* ------------------------------------------------------------ format strip
   Under the course title, above the fold, on every course page. Deliberately
   quiet: it is a fact sheet, not a sales line, and its whole job is to let a
   wrong-fit visitor leave before answering six questions. */
.enroll-card__format {
  list-style: none; margin: .55rem 0 1.1rem; padding: 0;
  display: flex; flex-wrap: wrap; align-items: center;
  gap: .3rem .55rem;
  font-size: .82rem; line-height: 1.45; color: rgba(255, 255, 255, .58);
}
.enroll-card__format li { display: inline-flex; align-items: center; white-space: nowrap; }
/* A separator drawn rather than typed, so it never wraps onto its own line. */
.enroll-card__format li + li::before {
  content: ""; width: 3px; height: 3px; border-radius: 50%;
  background: rgba(255, 255, 255, .3); margin-right: .55rem;
}
.enroll-card__format li:nth-child(2) { color: #F47923; }

/* -------------------------------------------------------------------- FAQ
   Near the bottom, after the mentors: whoever is still reading at that point
   is deciding, and this is the objection they are deciding against. */
.course-idv__faq { padding: 1rem 0 3rem; }
.course-idv__faq__section-title {
  font-size: clamp(1.5rem, 3.4vw, 2.1rem); line-height: 1.15; font-weight: 700;
  margin: 0 0 1.2rem; letter-spacing: -.015em;
}
.course-idv__faq-body { max-width: 62ch; }
.course-idv__faq-body p {
  margin: 0 0 .95rem; font-size: 1rem; line-height: 1.65; color: rgba(255, 255, 255, .72);
}
.course-idv__faq-body strong { color: #fff; font-weight: 600; }
.course-idv__faq-honest {
  border-left: 2px solid #F47923; padding-left: 1rem;
  color: rgba(255, 255, 255, .86) !important;
}
.course-idv__faq-cta {
  display: inline-flex; align-items: center; margin-top: .45rem;
  padding: .72rem 1.5rem; border-radius: 999px;
  background: #F47923; color: #0d0d0f; font-weight: 600; font-size: .96rem;
  text-decoration: none; transition: background .18s ease;
}
.course-idv__faq-cta:hover { background: #ff8a38; color: #0d0d0f; }
.course-idv__faq-cta:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

@media (max-width: 768px) {
  .enroll-card__format { font-size: .78rem; }
  .course-idv__faq { padding-bottom: 2rem; }
}


/* ---- why not Udemy ----------------------------------------------------
   Added 6 Sep 2026, above the 82 general reviews. Those answer "is it good";
   this answers "why not the free one", which is the question the ads actually
   meet and the one a reader will not scroll to find. Same three quotes the ad
   landing page shows, from src/template/course/voices.php. */
.course-idv__whynot { padding: 2rem 0 0; }
.whynot__grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr;
  margin-top: 1.25rem;
}
@media (min-width: 860px) {
  .whynot__grid { grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
}
.whynot__voice {
  margin: 0;
  padding: 1.15rem 1.25rem;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-left: 2px solid #F47923;
  border-radius: 10px;
}
.whynot__voice blockquote {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.82);
}
.whynot__voice blockquote::before { content: "\201C"; }
.whynot__voice blockquote::after { content: "\201D"; }
.whynot__voice figcaption {
  margin-top: 0.7rem;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  color: rgba(255, 255, 255, 0.45);
}