/* Doc Taco Academy — utilities the block markup leans on (DTA-16).
   Kept small and token-driven; everything color/space/type comes from theme.json vars. */

/* Eyebrow / kicker label above headings */
.dta-eyebrow{
  font-family: var(--wp--preset--font-family--heading);
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-size: .8rem;
  color: var(--wp--preset--color--teal);
}
.dta-eyebrow.is-on-dark{ color: var(--wp--preset--color--gold); }

/* Gold "AI" pill used to flag AI-related content (gold = AI across both brand systems) */
.dta-ai-pill{
  display:inline-block;
  font-family: var(--wp--preset--font-family--heading);
  font-weight:600; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase;
  color: var(--wp--preset--color--ink);
  background: var(--wp--preset--gradient--gold-ai);
  padding:.2rem .6rem; border-radius:999px;
  vertical-align: middle; position: relative; top: -1px;
}

/* Section cards (differentiators, editions, pricing) */
.dta-card{
  background: var(--wp--preset--color--white);
  border: 1px solid color-mix(in srgb, var(--wp--preset--color--ink) 12%, transparent);
  border-radius: 12px;
  height: 100%;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.dta-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 12px 28px -16px color-mix(in srgb, var(--wp--preset--color--ink) 55%, transparent);
  border-color: color-mix(in srgb, var(--wp--preset--color--teal) 45%, transparent);
}
.dta-card.is-ai:hover{ border-color: var(--wp--preset--color--gold); }

/* Top accent bar echoing the print cutsheet header */
.dta-accent-bar{ height:6px; background: var(--wp--preset--gradient--gold-ai); border-radius:6px 6px 0 0; }

/* Make Navigation submenu + mobile overlay legible on cream */
.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open{
  background: var(--wp--preset--color--cream);
}
.wp-block-navigation a{ font-family: var(--wp--preset--font-family--heading); font-weight:500; }

/* Buttons: an outline variant for secondary CTAs (paired with the filled default) */
.wp-block-button.is-style-dta-outline .wp-block-button__link{
  background: transparent;
  color: var(--wp--preset--color--ink);
  box-shadow: inset 0 0 0 2px var(--wp--preset--color--ink);
}
.wp-block-button.is-style-dta-outline .wp-block-button__link:hover{
  background: var(--wp--preset--color--ink);
  color: var(--wp--preset--color--white);
}
.is-on-dark .wp-block-button.is-style-dta-outline .wp-block-button__link{
  color: var(--wp--preset--color--cream);
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--wp--preset--color--cream) 70%, transparent);
}

/* Sunburst-ish radial flourish behind the hero taco, nodding to the logo badge */
.dta-sunburst{ position:relative; }
.dta-sunburst::before{
  content:""; position:absolute; inset:-8% -8% -8% -8%; z-index:0;
  background: radial-gradient(circle at 50% 45%, color-mix(in srgb, var(--wp--preset--color--gold) 35%, transparent) 0%, transparent 60%);
  pointer-events:none;
}
.dta-sunburst > *{ position:relative; z-index:1; }

/* Footer link reset for legibility on ink */
.dta-footer a{ color: var(--wp--preset--color--cream); text-decoration:none; }
.dta-footer a:hover{ color: var(--wp--preset--color--gold); text-decoration:underline; }

/* Lead-capture form (rendered by the dta-lead-capture mu-plugin) */
.dta-lead-hp{ position:absolute !important; left:-9999px !important; height:0; overflow:hidden; }
.dta-lead-field{ display:flex; flex-direction:column; gap:.3rem; margin:0 0 1rem; }
.dta-lead-field label{ font-family: var(--wp--preset--font-family--heading); font-weight:600; font-size:.95rem; }
.dta-lead .dta-opt{ font-weight:400; color: var(--wp--preset--color--ink-soft); }
.dta-lead input[type=text], .dta-lead input[type=email]{
  font: inherit; padding:.7rem .8rem; border-radius:8px;
  border:1px solid color-mix(in srgb, var(--wp--preset--color--ink) 22%, transparent);
  background: var(--wp--preset--color--white); color: var(--wp--preset--color--ink);
}
.dta-lead input:focus{ outline:2px solid var(--wp--preset--color--teal); outline-offset:1px; border-color:transparent; }
.dta-lead-btn{ background: var(--wp--preset--color--red); color:#fff; border:0; border-radius:6px; padding:.8rem 1.6rem;
  font-family: var(--wp--preset--font-family--heading); font-weight:600; cursor:pointer; }
.dta-lead-btn:hover{ background: var(--wp--preset--color--ink); }
.dta-lead-fine{ font-size:.82rem; color: var(--wp--preset--color--ink-soft); margin-top:.4rem; }
.dta-lead-success{ background: var(--wp--preset--color--cream-deep); border-left:4px solid var(--wp--preset--color--teal);
  padding:1rem 1.2rem; border-radius:8px; }
.dta-lead-error{ color: var(--wp--preset--color--red); font-weight:600; }

/* ---- Edition detail pages (sub-courses, cutsheet downloads, stats) ---- */
.dta-code{ font-family: var(--wp--preset--font-family--heading); font-weight:600; font-size:.8rem;
  letter-spacing:.06em; text-transform:uppercase; color: var(--wp--preset--color--teal); }
.dta-meta{ font-size:.85rem; color: var(--wp--preset--color--ink-soft); font-weight:600; letter-spacing:.02em; }
.dta-verb{ font-family: var(--wp--preset--font-family--heading); font-weight:600; color: var(--wp--preset--color--teal); }
.dta-verb.is-ai{ color: #9A7B1E; }

/* topic chips */
.dta-chips{ list-style:none; margin:.6rem 0 0; padding:0; display:flex; flex-wrap:wrap; gap:.4rem; }
.dta-chips li{ font-size:.78rem; line-height:1; padding:.34rem .6rem; border-radius:999px;
  background: var(--wp--preset--color--cream); color: var(--wp--preset--color--ink-soft);
  border:1px solid color-mix(in srgb, var(--wp--preset--color--ink) 10%, transparent); }

/* cutsheet download card: thumbnail + label */
.dta-cutsheet{ display:flex; flex-direction:column; text-decoration:none !important; color:inherit; height:100%; }
.dta-cutsheet .dta-cutsheet-thumb{ border-radius:10px 10px 0 0; overflow:hidden; border:1px solid color-mix(in srgb, var(--wp--preset--color--ink) 12%, transparent); border-bottom:0; }
.dta-cutsheet img{ display:block; width:100%; height:auto; }
.dta-cutsheet .dta-cutsheet-foot{ display:flex; align-items:center; gap:.5rem; padding:.7rem .85rem;
  background: var(--wp--preset--color--white); border:1px solid color-mix(in srgb, var(--wp--preset--color--ink) 12%, transparent);
  border-radius:0 0 10px 10px; font-family: var(--wp--preset--font-family--heading); font-weight:600; font-size:.92rem; }
.dta-cutsheet .dta-cutsheet-foot::before{ content:"PDF"; font-size:.62rem; letter-spacing:.06em; color:#fff;
  background: var(--wp--preset--color--red); padding:.16rem .4rem; border-radius:4px; }
.dta-cutsheet:hover .dta-cutsheet-foot{ color: var(--wp--preset--color--red); }
.dta-cutsheet:hover .dta-cutsheet-thumb{ box-shadow:0 10px 24px -14px color-mix(in srgb, var(--wp--preset--color--ink) 60%, transparent); }

/* inline "download cutsheet" link inside a sub-course card */
.dta-dl{ font-family: var(--wp--preset--font-family--heading); font-weight:600; font-size:.9rem; text-decoration:none; }
.dta-dl::after{ content:" ↓"; }

/* responsive downloads grid */
.dta-dl-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; }
@media (max-width:781px){ .dta-dl-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px){ .dta-dl-grid{ grid-template-columns:1fr; } }

/* outcome stat tiles */
.dta-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background: color-mix(in srgb, var(--wp--preset--color--ink) 14%, transparent);
  border:1px solid color-mix(in srgb, var(--wp--preset--color--ink) 14%, transparent); border-radius:12px; overflow:hidden; }
.dta-stats .dta-stat{ background: var(--wp--preset--color--white); padding:1.4rem 1rem; text-align:center; }
.dta-stat .n{ font-family: var(--wp--preset--font-family--heading); font-weight:700; font-size:1.9rem; color: var(--wp--preset--color--navy); line-height:1; }
.dta-stat .l{ display:block; margin-top:.35rem; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color: var(--wp--preset--color--ink-soft); }
@media (max-width:781px){ .dta-stats{ grid-template-columns:repeat(2,1fr); } }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .dta-card{ transition:none; }
  .dta-card:hover{ transform:none; }
}
