@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=Open+Sans:wght@400;500;600;700&display=swap');

.eux-tyro *, .eux-tyro *::before, .eux-tyro *::after { box-sizing:border-box; }
.eux-tyro {
  --cream:#F4F0EC; --cream-50:#FAF8F5; --cream-200:#ECE6DF;
  --white:#FFFFFF; --black:#000000;
  --woo:#720EEC; --woo-50:#F1E3FE; --woo-100:#E0C4FD; --woo-200:#C58CFB; --woo-300:#A659F8; --woo-700:#5A0BBC; --woo-900:#2F0670;
  --ink-50:#F5F5F5; --ink-100:#E6E6E6; --ink-200:#CFCFCF; --ink-300:#B3B3B3; --ink-400:#8C8C8C; --ink-500:#6B6B6B; --ink-600:#4D4D4D; --ink-700:#333333; --ink-800:#1A1A1A; --ink-900:#0A0A0A;
  --fd:'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fb:'Open Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fm:ui-monospace, SFMono-Regular, 'JetBrains Mono', Menlo, monospace;
  --ease:cubic-bezier(0.22,1,0.36,1);
  font-family:var(--fb); color:var(--ink-900); background:var(--cream);
  line-height:1.55; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; font-size:16px;
}
.eux-tyro h1,.eux-tyro h2,.eux-tyro h3,.eux-tyro h4 { font-family:var(--fd); font-weight:400; color:var(--ink-900); margin:0; line-height:1.1; letter-spacing:-0.02em; }
.eux-tyro p { margin:0; color:var(--ink-700); }
.eux-tyro a { color:inherit; text-decoration:none; }
.eux-tyro .et-wrap { max-width:1200px; margin:0 auto; padding:0 40px; }
@media (max-width:760px){ .eux-tyro .et-wrap{ padding:0 22px; } }

.eux-tyro .et-eyebrow{ display:inline-flex; align-items:center; gap:12px; font-family:var(--fd); font-weight:600; font-size:12px; letter-spacing:0.16em; text-transform:uppercase; color:var(--woo); }
.eux-tyro .et-eyebrow::before{ content:""; width:26px; height:1px; background:currentColor; }
.eux-tyro .et-eyebrow--c::after{ content:""; width:26px; height:1px; background:currentColor; }

/* buttons */
.eux-tyro .et-btn{ display:inline-flex; align-items:center; gap:9px; font-family:var(--fd); font-weight:600; font-size:15px; letter-spacing:-0.005em; padding:15px 26px; border-radius:999px; border:0; cursor:pointer; transition:background .16s var(--ease), transform .16s var(--ease), border-color .16s var(--ease); }
.eux-tyro .et-btn .et-arr{ font-family:var(--fm); transition:transform .2s var(--ease); }
.eux-tyro .et-btn:hover .et-arr{ transform:translateX(3px); }
.eux-tyro .et-btn--primary{ background:var(--woo); color:#fff; }
.eux-tyro .et-btn--primary:hover{ background:var(--woo-700); transform:translateY(-1px); }
.eux-tyro .et-btn--ghost{ background:transparent; color:var(--ink-900); border:1px solid var(--ink-300); }
.eux-tyro .et-btn--ghost:hover{ border-color:var(--ink-900); }
.eux-tyro .et-btn--lite{ background:var(--cream); color:var(--ink-900); }
.eux-tyro .et-btn--lite:hover{ background:#fff; }
.eux-tyro .et-btn--outline-d{ background:transparent; color:var(--cream); border:1px solid rgba(255,255,255,.34); }
.eux-tyro .et-btn--outline-d:hover{ border-color:var(--cream); }

/* =========================================================================
   HERO - editorial, two-column on cream
   ========================================================================= */
.eux-tyro .et-hero{ padding:84px 0 76px; position:relative; }
.eux-tyro .et-hero::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--ink-100); }
.eux-tyro .et-hero-grid{ display:grid; grid-template-columns:1.02fr 1fr; gap:64px; align-items:center; }
@media (max-width:920px){ .eux-tyro .et-hero-grid{ grid-template-columns:1fr; gap:44px; } .eux-tyro .et-hero{ padding:60px 0 56px; } }
.eux-tyro .et-h1{ font-size:clamp(40px,5vw,64px); line-height:1.02; letter-spacing:-0.03em; margin:22px 0 22px; max-width:15ch; }
.eux-tyro .et-h1 em{ font-style:italic; font-weight:300; color:var(--woo); }
.eux-tyro .et-lede{ font-size:18px; line-height:1.6; color:var(--ink-700); max-width:50ch; margin-bottom:30px; }
.eux-tyro .et-cta-row{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.eux-tyro .et-cta-note{ font-size:13px; color:var(--ink-500); margin-top:16px; display:flex; align-items:center; gap:7px; }
.eux-tyro .et-cta-note svg{ width:14px; height:14px; color:var(--woo); }

/* checkout mockup (light) */
.eux-tyro .et-mock-stage{ position:relative; }
.eux-tyro .et-ck{ background:var(--white); border:1px solid var(--ink-100); border-radius:20px; box-shadow:0 1px 2px rgba(0,0,0,.04), 0 30px 70px rgba(0,0,0,.10); padding:22px; max-width:420px; margin-left:auto; position:relative; }
.eux-tyro .et-ck__head{ display:flex; align-items:center; justify-content:space-between; padding-bottom:16px; border-bottom:1px solid var(--ink-100); }
.eux-tyro .et-ck__shop{ font-family:var(--fd); font-weight:600; font-size:13px; color:var(--ink-800); }
.eux-tyro .et-ck__lock{ display:inline-flex; align-items:center; gap:6px; font-size:11px; color:var(--ink-500); font-family:var(--fm); letter-spacing:.04em; }
.eux-tyro .et-ck__lock svg{ width:12px; height:12px; }
.eux-tyro .et-ck__sum{ padding:16px 0; display:flex; flex-direction:column; gap:9px; }
.eux-tyro .et-ck__line{ display:flex; justify-content:space-between; font-size:13.5px; color:var(--ink-600); }
.eux-tyro .et-ck__line--total{ color:var(--ink-900); font-weight:700; font-family:var(--fd); font-size:15px; padding-top:9px; border-top:1px dashed var(--ink-200); }
.eux-tyro .et-ck__pay{ background:var(--cream-50); border:1px solid var(--ink-100); border-radius:14px; padding:14px; }
.eux-tyro .et-ck__payhead{ display:flex; align-items:center; gap:10px; margin-bottom:13px; }
.eux-tyro .et-ck__radio{ width:16px; height:16px; border-radius:50%; border:5px solid var(--woo); background:#fff; flex:0 0 auto; }
.eux-tyro .et-ck__payname{ font-family:var(--fd); font-weight:600; font-size:13.5px; color:var(--ink-900); }
.eux-tyro .et-ck__cards{ margin-left:auto; display:flex; gap:5px; }
.eux-tyro .et-ck__cards span{ font-family:var(--fd); font-weight:700; font-size:8.5px; letter-spacing:.04em; color:var(--ink-500); background:#fff; border:1px solid var(--ink-200); border-radius:4px; padding:3px 5px; }
.eux-tyro .et-ck__field-wrap{ position:relative; border:1.5px dashed var(--woo-200); border-radius:11px; padding:11px; background:#fff; }
.eux-tyro .et-ck__tag{ position:absolute; top:-9px; left:12px; white-space:nowrap; background:var(--white); padding:0 7px; font-family:var(--fm); font-size:9px; letter-spacing:.08em; text-transform:uppercase; color:var(--woo); display:inline-flex; align-items:center; gap:4px; }
.eux-tyro .et-ck__tag svg{ width:9px; height:9px; }
.eux-tyro .et-ck__lbl{ font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-500); font-family:var(--fd); font-weight:600; margin-bottom:5px; display:block; }
.eux-tyro .et-ck__inp{ display:flex; align-items:center; justify-content:space-between; background:var(--cream-50); border:1px solid var(--ink-100); border-radius:8px; padding:9px 11px; font-family:var(--fm); font-size:13px; color:var(--ink-800); letter-spacing:.04em; }
.eux-tyro .et-ck__inp .et-ck__caret{ width:1.5px; height:15px; background:var(--woo); display:inline-block; animation:etblink 1.1s steps(1) infinite; }
@keyframes etblink{ 50%{ opacity:0; } }
.eux-tyro .et-ck__inp small{ font-family:var(--fd); font-weight:700; font-size:9px; color:var(--ink-400); }
.eux-tyro .et-ck__two{ display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:9px; }
.eux-tyro .et-ck__place{ width:100%; margin-top:13px; background:var(--ink-900); color:var(--cream); font-family:var(--fd); font-weight:600; font-size:14px; border:0; border-radius:10px; padding:13px; cursor:default; }
.eux-tyro .et-anno{ position:absolute; left:-30px; top:206px; background:var(--woo); color:#fff; font-family:var(--fd); font-weight:600; font-size:11.5px; padding:8px 12px; border-radius:9px; box-shadow:0 10px 26px rgba(114,14,236,.28); display:flex; align-items:center; gap:7px; max-width:160px; line-height:1.25; }
.eux-tyro .et-anno svg{ width:14px; height:14px; flex:0 0 auto; }
@media (max-width:920px){ .eux-tyro .et-ck{ margin:0 auto; } .eux-tyro .et-anno{ left:0; } }
@media (max-width:480px){ .eux-tyro .et-anno{ display:none; } }

/* trust band (dark) */
.eux-tyro .et-trust{ background:var(--ink-900); }
.eux-tyro .et-trust .et-wrap{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:14px 40px; padding-top:22px; padding-bottom:22px; }
.eux-tyro .et-trust-item{ display:flex; align-items:center; gap:9px; color:var(--cream); font-family:var(--fd); font-weight:500; font-size:13.5px; }
.eux-tyro .et-trust-item svg{ width:17px; height:17px; color:var(--woo-300); flex:0 0 auto; }
.eux-tyro .et-trust-sep{ width:1px; height:20px; background:rgba(255,255,255,.16); }
@media (max-width:760px){ .eux-tyro .et-trust-sep{ display:none; } }

/* =========================================================================
   SECTION SCAFFOLD (centered headers - bold style)
   ========================================================================= */
.eux-tyro .et-sec{ padding:96px 0; }
.eux-tyro .et-sec--white{ background:var(--white); }
.eux-tyro .et-sec--cream{ background:var(--cream); }
@media (max-width:760px){ .eux-tyro .et-sec{ padding:62px 0; } }
.eux-tyro .et-sechead{ text-align:center; max-width:720px; margin:0 auto 52px; }
.eux-tyro .et-sechead h2{ font-size:clamp(32px,4vw,52px); letter-spacing:-0.03em; margin:18px 0 16px; }
.eux-tyro .et-sechead p{ font-size:18px; color:var(--ink-600); }

/* =========================================================================
   BENTO FEATURES
   ========================================================================= */
.eux-tyro .et-bento{ display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:1fr; gap:16px; grid-template-areas:"a a b" "a a c" "d e f"; }
@media (max-width:860px){ .eux-tyro .et-bento{ grid-template-columns:1fr 1fr; grid-template-areas:"a a" "b c" "d e" "f f"; } }
@media (max-width:560px){ .eux-tyro .et-bento{ grid-template-columns:1fr; grid-template-areas:"a" "b" "c" "d" "e" "f"; } }
.eux-tyro .et-bt{ background:var(--white); border:1px solid var(--ink-100); border-radius:18px; padding:26px; display:flex; flex-direction:column; transition:transform .25s var(--ease), box-shadow .25s var(--ease); }
.eux-tyro .et-bt:hover{ transform:translateY(-3px); box-shadow:0 2px 4px rgba(0,0,0,.05),0 18px 40px rgba(0,0,0,.07); }
.eux-tyro .et-bt .et-ic{ width:42px; height:42px; border-radius:11px; background:var(--woo-50); color:var(--woo); display:grid; place-items:center; margin-bottom:16px; }
.eux-tyro .et-bt .et-ic svg{ width:21px; height:21px; }
.eux-tyro .et-bt h4{ font-size:17px; font-weight:600; letter-spacing:-0.01em; margin-bottom:8px; }
.eux-tyro .et-bt p{ font-size:14px; line-height:1.55; color:var(--ink-600); }
.eux-tyro .et-bt--hero{ grid-area:a; background:var(--ink-900); border-color:var(--ink-900); color:var(--cream); justify-content:center; gap:26px; padding:32px; }
.eux-tyro .et-bt--hero h4{ color:var(--cream); font-size:24px; font-weight:400; letter-spacing:-0.02em; }
.eux-tyro .et-bt--hero h4 em{ font-style:italic; font-weight:300; color:var(--woo-300); }
.eux-tyro .et-bt--hero p{ color:rgba(244,240,236,.7); font-size:15px; }
.eux-tyro .et-bt--hero .et-ic{ background:rgba(114,14,236,.2); color:var(--woo-300); }
.eux-tyro .et-mini{ margin-top:0; background:var(--white); border:1px solid var(--ink-100); border-radius:14px; padding:14px; }
.eux-tyro .et-mini-row{ display:flex; align-items:center; gap:10px; }
.eux-tyro .et-mini-dot{ width:14px; height:14px; border-radius:50%; border:4px solid var(--woo); flex:0 0 auto; }
.eux-tyro .et-mini-lbl{ font-family:var(--fd); font-weight:600; font-size:12px; color:var(--ink-900); }
.eux-tyro .et-mini-cards{ margin-left:auto; display:flex; gap:4px; }
.eux-tyro .et-mini-cards span{ font-family:var(--fd); font-weight:700; font-size:8px; color:var(--ink-500); background:#fff; border:1px solid var(--ink-200); border-radius:3px; padding:2px 4px; }
.eux-tyro .et-mini-field{ margin-top:11px; display:flex; align-items:center; justify-content:space-between; background:var(--cream-50); border:1px dashed var(--woo-200); border-radius:8px; padding:9px 11px; font-family:var(--fm); font-size:12px; color:var(--ink-800); letter-spacing:.04em; }
.eux-tyro .et-bt--b{ grid-area:b; } .eux-tyro .et-bt--c{ grid-area:c; }
.eux-tyro .et-bt--d{ grid-area:d; } .eux-tyro .et-bt--e{ grid-area:e; } .eux-tyro .et-bt--f{ grid-area:f; }

/* =========================================================================
   CERTIFICATION moment (centered)
   ========================================================================= */
.eux-tyro .et-cert{ text-align:center; }
.eux-tyro .et-cert__badge{ width:128px; height:128px; border-radius:50%; margin:0 auto 30px; display:grid; place-items:center; border:2px solid var(--woo-200); background:radial-gradient(circle at 50% 30%, var(--woo-50), #fff 72%); position:relative; }
.eux-tyro .et-cert__badge svg{ width:54px; height:54px; color:var(--woo); }
.eux-tyro .et-cert__badge::after{ content:""; position:absolute; inset:-12px; border-radius:50%; border:1px dashed var(--ink-200); }
.eux-tyro .et-cert__badge::before{ content:""; position:absolute; inset:-12px; border-radius:50%; border:1.5px solid var(--woo-300); opacity:0; }
@media (prefers-reduced-motion: no-preference){
  .eux-tyro .et-cert__badge{ animation:etCertGlow 2.8s var(--ease) infinite; }
  .eux-tyro .et-cert__badge::before{ animation:etCertRing 2.8s var(--ease) infinite; }
}
@keyframes etCertGlow{ 0%,100%{ box-shadow:0 0 0 0 rgba(114,14,236,0); } 50%{ box-shadow:0 0 0 8px rgba(114,14,236,.07); } }
@keyframes etCertRing{ 0%{ transform:scale(1); opacity:.55; } 70%{ transform:scale(1.32); opacity:0; } 100%{ transform:scale(1.32); opacity:0; } }
.eux-tyro .et-cert h2{ font-size:clamp(30px,3.8vw,48px); letter-spacing:-0.03em; margin-bottom:16px; }
.eux-tyro .et-cert h2 em{ font-style:italic; font-weight:300; color:var(--woo); }
.eux-tyro .et-tyro-logo{ height:0.74em; width:auto; vertical-align:-0.06em; margin-left:0.18em; }
.eux-tyro .et-h1 .et-tyro-logo{ height:0.62em; vertical-align:-0.02em; margin:0 0.06em; }
.eux-tyro .et-cert > p{ font-size:18px; color:var(--ink-600); max-width:56ch; margin:0 auto 52px; }
.eux-tyro .et-pillars{ display:grid; grid-template-columns:repeat(3,1fr); gap:40px; max-width:960px; margin:0 auto; text-align:left; }
@media (max-width:760px){ .eux-tyro .et-pillars{ grid-template-columns:1fr; gap:28px; max-width:480px; } }
.eux-tyro .et-pillar{ padding-top:24px; border-top:2px solid var(--ink-900); }
.eux-tyro .et-pillar .et-pic{ width:36px; height:36px; color:var(--woo); margin-bottom:14px; }
.eux-tyro .et-pillar .et-pic svg{ width:30px; height:30px; }
.eux-tyro .et-pillar h4{ font-size:18px; font-weight:600; margin-bottom:8px; }
.eux-tyro .et-pillar p{ font-size:14.5px; color:var(--ink-600); }

/* =========================================================================
   OUTCOMES (numbered)
   ========================================================================= */
.eux-tyro .et-out{ display:grid; grid-template-columns:repeat(2,1fr); gap:2px; background:var(--ink-100); border:1px solid var(--ink-100); border-radius:20px; overflow:hidden; }
@media (max-width:760px){ .eux-tyro .et-out{ grid-template-columns:1fr; } }
.eux-tyro .et-out-cell{ background:var(--cream-50); padding:36px; }
.eux-tyro .et-out-cell .et-num{ font-family:var(--fd); font-weight:300; font-size:15px; color:var(--woo); letter-spacing:.1em; margin-bottom:18px; display:block; }
.eux-tyro .et-out-cell h3{ font-size:23px; font-weight:500; letter-spacing:-0.018em; margin-bottom:10px; }
.eux-tyro .et-out-cell p{ font-size:14.5px; color:var(--ink-600); }
.eux-tyro .et-callout{ margin-top:16px; background:var(--woo); border-radius:20px; padding:44px 48px; color:#fff; display:grid; grid-template-columns:1.2fr 1fr; gap:40px; align-items:center; }
@media (max-width:840px){ .eux-tyro .et-callout{ grid-template-columns:1fr; gap:24px; padding:34px; } }
.eux-tyro .et-callout h3{ color:#fff; font-size:clamp(24px,2.6vw,32px); letter-spacing:-0.02em; line-height:1.14; }
.eux-tyro .et-callout p{ color:rgba(255,255,255,.82); font-size:15px; margin-top:14px; }
.eux-tyro .et-callout ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:13px; }
.eux-tyro .et-callout li{ display:grid; grid-template-columns:auto 1fr; gap:11px; font-size:14px; color:#fff; align-items:start; }
.eux-tyro .et-callout li svg{ width:17px; height:17px; color:#fff; margin-top:1px; }

/* =========================================================================
   FAQ - single wide column
   ========================================================================= */
.eux-tyro .et-faq{ max-width:840px; margin:0 auto; }
.eux-tyro .et-q{ border-bottom:1px solid var(--ink-200); }
.eux-tyro .et-q summary{ list-style:none; cursor:pointer; padding:24px 0; display:flex; align-items:center; gap:16px; font-family:var(--fd); font-weight:500; font-size:19px; color:var(--ink-900); letter-spacing:-0.01em; }
.eux-tyro .et-q summary::-webkit-details-marker{ display:none; }
.eux-tyro .et-q .et-pm{ margin-left:auto; width:20px; height:20px; flex:0 0 auto; position:relative; }
.eux-tyro .et-q .et-pm::before,.eux-tyro .et-q .et-pm::after{ content:""; position:absolute; background:var(--woo); border-radius:2px; transition:transform .25s var(--ease); }
.eux-tyro .et-q .et-pm::before{ left:0; top:9px; width:20px; height:2px; }
.eux-tyro .et-q .et-pm::after{ left:9px; top:0; width:2px; height:20px; }
.eux-tyro .et-q[open] .et-pm::after{ transform:scaleY(0); }
.eux-tyro .et-q .et-a{ padding:0 36px 24px 0; }
.eux-tyro .et-q .et-a p{ font-size:15px; color:var(--ink-600); line-height:1.6; max-width:72ch; }

/* =========================================================================
   FINAL CTA - purple band
   ========================================================================= */
.eux-tyro .et-final{ background:var(--woo); }
.eux-tyro .et-final .et-wrap{ padding-top:84px; padding-bottom:84px; text-align:center; }
.eux-tyro .et-final .et-eyebrow{ color:#fff; }
.eux-tyro .et-final .et-eyebrow::before, .eux-tyro .et-final .et-eyebrow--c::after{ background:#fff; }
.eux-tyro .et-final h2{ color:#fff; font-size:clamp(34px,4.4vw,58px); letter-spacing:-0.03em; max-width:18ch; margin:18px auto 18px; }
.eux-tyro .et-final p{ color:rgba(255,255,255,.86); font-size:18px; max-width:46ch; margin:0 auto 32px; }
.eux-tyro .et-final .et-cta-row{ justify-content:center; }
.eux-tyro .et-final .et-fineprint{ margin-top:24px; font-size:13px; color:rgba(255,255,255,.66); font-family:var(--fm); letter-spacing:.03em; }


/* ============================================================================
   WordPress / Salient coexistence layer (scoped to .eux-tyro)
   ============================================================================ */

/* Full-bleed breakout so the section backgrounds (ink, cream, white, woo) span
   edge to edge on the page template. The horizontal-overflow clip lives on BODY
   using `clip` (not `hidden`) so it never becomes a scroll container. */
.eux-tyro {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}
body:has(.eux-tyro) { overflow-x: clip; }

/* Salient adds a border-bottom underline to every content <a>; the CTAs here are
   anchors styled as buttons, so strip it. */
.eux-tyro a,
.eux-tyro a:hover { border-bottom: 0; box-shadow: none; text-decoration: none; }

/* Inline Tyro logo. Salient's img { height: auto !important } (and its
   ID-scoped #ajax-content-wrap variant, which out-specifies any class rule)
   would blow the logo up to full size instead of the em-height that sits it
   inline in the headings. Match the ID to win, preserving both contexts. */
.eux-tyro .et-tyro-logo,
#ajax-content-wrap .eux-tyro .et-tyro-logo {
    height: 0.74em !important;
    width: auto !important;
    max-width: none !important;
}
.eux-tyro .et-h1 .et-tyro-logo,
#ajax-content-wrap .eux-tyro .et-h1 .et-tyro-logo {
    height: 0.62em !important;
}

/* Salient: body[data-button-style^="rounded"] button { border-radius:200px }.
   The CTAs are anchors so they're usually safe, but lock the intended pill in
   case a theme rule targets anchor-buttons. */
.eux-tyro .et-btn { border-radius: 999px !important; }

/* Salient may re-add a default disclosure marker on the FAQ <summary>. */
.eux-tyro summary { list-style: none; }
.eux-tyro summary::-webkit-details-marker { display: none; }

/* Salient: word-break: break-word on columns splits compound words */
.eux-tyro h1, .eux-tyro h2, .eux-tyro h3, .eux-tyro h4 {
    word-break: normal !important;
    overflow-wrap: normal !important;
}
