/* ITPD — Cursos e Treinamentos section styles (hub + Presencial/Online, In Company).
   Shared across all pages in this section — enqueued together via functions.php.
   Tokens/buttons/section shells/tiles/cards/modalities/CTA/breadcrumb/subhero/subnav
   all live in itpd-base.css now (promoted there since O Instituto needed the same chrome). */

/* ---- Section heading accent line — short accent-colored underline below h2s,
   e.g. "Cursos disponíveis". Scoped to .itpd-cursos specifically so it doesn't
   affect the same h2 styling shared with O Instituto/blog pages via base.css. ---- */
.itpd-cursos h2{ position:relative; padding-bottom:14px; }
.itpd-cursos h2::after{ content:''; position:absolute; left:0; bottom:0; width:40px; height:3px; border-radius:2px; background:var(--accent); }

/* ---- Course list state (placeholder until real courses are registered) ---- */
.itpd-empty{ border:1px dashed var(--line); padding:40px; text-align:center; color:var(--slate); font-size:14px; border-radius:2px; margin-top:8px; }

/* ---- Facts on Cursos pages — a single composed "spotlight panel" instead of
   three repeated items (every uniform-stack attempt was rejected): one navy
   gradient monolith with the cyan hero-glow, lifted from the client's In
   Company PDF cover panel. Foco renders as a large white display statement
   (no box at all); Como funciona / Ideal para sit beneath it as two
   frosted-glass panes. Loads only on cursos pages via functions.php. ---- */
.itpd-cursos .itpd-facts{ position:relative; overflow:hidden; grid-template-columns:1fr 1fr; gap:16px; margin:0px 0 32px; border-radius:18px; background:linear-gradient(135deg,#0A1D4C 0%,#01092D 55%,#0E255C 100%); padding:34px 34px 30px; }
.itpd-cursos .itpd-facts::before{ content:''; position:absolute; top:-90px; right:-60px; width:300px; height:300px; background:radial-gradient(circle, rgba(1,189,235,.25), transparent 70%); pointer-events:none; }
.itpd-cursos .itpd-fact,
.itpd-cursos .itpd-fact:first-child{ background:transparent; border:none; border-radius:0; box-shadow:none; overflow:visible; padding:0; }
.itpd-cursos .itpd-fact:hover,
.itpd-cursos .itpd-fact:first-child:hover{ transform:none; box-shadow:none; }
.itpd-cursos .itpd-fact::before,
.itpd-cursos .itpd-fact::after,
.itpd-cursos .itpd-fact:first-child::before,
.itpd-cursos .itpd-fact:first-child::after{ content:none; }

/* Foco — pure display statement, no container */
.itpd-cursos .itpd-fact:first-child{ grid-column:1 / -1; margin-bottom:10px; }
.itpd-cursos .itpd-fact:first-child .itpd-fact__label{ background:none; padding:0; border-radius:0; display:block; color:var(--accent); font-size:11px; letter-spacing:.1em; margin:0 0 12px; }
.itpd-cursos .itpd-fact:first-child .itpd-fact__text{ font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:clamp(19px,2.4vw,24px); line-height:1.4; color:#fff; max-width:600px; }

/* Como funciona / Ideal para — frosted-glass panes */
.itpd-cursos .itpd-fact:not(:first-child){ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius:12px; padding:20px 22px; }
.itpd-cursos .itpd-fact:not(:first-child) .itpd-fact__label{ background:none; padding:0; border-radius:0; display:block; color:var(--accent); font-size:11px; letter-spacing:.08em; margin:0 0 10px; }
.itpd-cursos .itpd-fact:not(:first-child) .itpd-fact__text{ color:#C9D2E0; font-size:14px; line-height:1.75; max-width:none; }

@media (max-width:700px){
  .itpd-cursos .itpd-facts{ grid-template-columns:1fr; padding:26px 22px 22px; }
}