/* ==========================================================
   Talenta Pros — homepage conversion layer (Oct 2026)
   Loaded after every other homepage stylesheet. Uses the
   existing brand tokens (--gold = emerald, --navy, --ink,
   --muted, --line, --surface) so light and dark themes follow
   the rest of the site. No new colours, fonts or libraries.
   ========================================================== */

/* ---------- Hero headline (longer copy, same look) ---------- */
html body main#top > .hero h1.hero-h1{
  max-width:17ch;
  font-size:clamp(34px,3.3vw,50px) !important;
  line-height:1.08;
}
html body main#top > .hero h1.hero-h1 em{display:inline;padding:0}
@media (max-width:700px){
  html body main#top > .hero h1.hero-h1{
    max-width:none;
    font-size:clamp(32px,8.4vw,42px) !important;
  }
}

/* ---------- Proof strip (below hero) ---------- */
.proof-strip{
  background:var(--surface);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:22px 0;
}
.proof-list{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 28px;
}
.proof-list li{display:flex;align-items:center;gap:14px;min-width:0}
.proof-ico{
  flex:none;width:44px;height:44px;border-radius:12px;
  display:grid;place-items:center;
  background:rgba(18,184,134,.12);color:var(--gold);
}
.proof-ico svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.proof-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.proof-txt b{font-size:16px;font-weight:700;color:var(--ink);line-height:1.3}
.proof-txt small{font-size:14px;color:var(--muted);line-height:1.4}
@media (max-width:860px){
  .proof-list{grid-template-columns:1fr;gap:14px}
  .proof-strip{padding:20px 0}
}

/* ---------- Pricing preview (after Practice Books) ---------- */
.pp{background:var(--surface);padding:80px 0;border-top:1px solid var(--line)}
.pp-head{text-align:center;max-width:640px;margin:0 auto 36px}
.pp-head h2{font-size:var(--type-section);line-height:1.12;margin:16px auto 0;color:var(--ink);max-width:none}
.pp-head p{color:var(--muted);font-size:var(--type-lead,18px);margin:14px auto 0;line-height:1.6}
.pp-list{
  list-style:none;margin:0 auto;padding:0;max-width:1040px;
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch;
}
.pp-card{
  position:relative;display:flex;flex-direction:column;gap:8px;
  background:var(--surface);border:1px solid var(--line);border-radius:20px;
  padding:26px 24px 24px;box-shadow:var(--shadow);
}
.pp-card.pp-pop{border:2px solid var(--gold)}
.pp-badge{
  position:absolute;top:-13px;left:24px;margin:0;
  background:var(--gold);color:#fff;font-size:12.5px;font-weight:700;
  padding:5px 12px;border-radius:999px;letter-spacing:.01em;
}
.pp-name{font-size:19px;font-weight:700;margin:0;color:var(--ink);letter-spacing:-.01em}
.pp-price{margin:2px 0 0;color:var(--muted);font-size:15px}
.pp-price b{font-size:32px;font-weight:800;color:var(--ink);letter-spacing:-.02em;margin-right:4px}
.pp-note{margin:0;font-size:13.5px;color:var(--gold);font-weight:600;line-height:1.45}
.pp-for{margin:4px 0 0;font-size:15px;color:var(--muted);line-height:1.55}
.pp-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:32px}
@media (max-width:860px){
  .pp{padding:64px 0}
  .pp-list{grid-template-columns:1fr;max-width:480px;gap:22px}
  .pp-cta .btn{width:100%;justify-content:center}
}

/* ---------- Secondary text link under the Zena CTAs ---------- */
.zx-more{margin:14px 0 0;font-size:15px}
.zx-more a{color:var(--gold);font-weight:700;text-decoration:none}
.zx-more a:hover{text-decoration:underline}
.pb-fine a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* ---------- "Your first 7 days" (final CTA band) ---------- */
.d7{max-width:920px;margin:8px auto 30px;text-align:center}
.d7-title{font-size:15px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin:0 0 16px;color:#8EE6C8}
.d7-list{
  list-style:none;margin:0;padding:0;counter-reset:d7;
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;position:relative;
}
.d7-list li{
  position:relative;display:flex;flex-direction:column;gap:6px;text-align:left;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  border-radius:16px;padding:16px 16px 18px;
}
.d7-list li:not(:last-child)::after{
  content:"";position:absolute;top:50%;right:-11px;width:10px;height:2px;
  background:var(--gold);opacity:.7;
}
.d7-day{
  align-self:flex-start;flex:none;white-space:nowrap;font-size:12.5px;font-weight:700;color:#0E1B3D;
  background:var(--gold);border-radius:999px;padding:3px 10px;
}
.d7-list b{font-size:15.5px;font-weight:700;line-height:1.35;color:#fff}
@media (max-width:760px){
  .d7-list{grid-template-columns:1fr;gap:10px}
  .d7-list li{flex-direction:row;align-items:center;gap:12px;padding:12px 14px}
  .d7-list li:not(:last-child)::after{top:auto;bottom:-11px;right:auto;left:38px;width:2px;height:10px}
}

.wf-final-ctas{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
html body .wf-final .wf-final-ctas .btn-line{
  background:transparent !important;color:#fff !important;
  border:1px solid rgba(255,255,255,.4) !important;box-shadow:none !important;
}
html body .wf-final .wf-final-ctas .btn-line:hover{border-color:#fff !important;transform:translateY(-2px)}
html body main .wf-final p.wf-final-fine{font-size:14px !important;margin:16px auto 0;color:rgba(255,255,255,.72)}
@media (max-width:560px){
  .wf-final-ctas .btn{width:100%;justify-content:center}
}

/* ---------- Dark theme ---------- */
:root[data-theme="dark"] .pp-badge{color:#0E1B3D}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .pp-badge{color:#0E1B3D}
}

/* ---------- Focus visibility for new links/buttons ---------- */
.pp-cta .btn:focus-visible,.wf-final-ctas .btn:focus-visible,.zx-more a:focus-visible,.pb-fine a:focus-visible{
  outline:3px solid var(--gold);outline-offset:3px;
}