/* ===== FONTS =====
     If Google Fonts (Unbounded, Manrope, Space Mono) aren't loaded on this project yet,
     add these lines under Site Settings -> More -> "Custom Fonts", or
     into the page Head via a T123 block:
     
     
     
     Fonts are NOT loaded here — to avoid duplicates and conflicts with Tilda.
  */
  :root{
    --bz-deep:#0b1442;
    --bz-deep2:#121d5c;
    --bz-gold:#ffc93c;
    --bz-gold-dark:#d99a12;
    --bz-pink:#ff3d8a;
    --bz-orange:#ff7a1a;
    --bz-green:#7ed321;
    --bz-cyan:#2fa8e0;
    --bz-purple:#8a4fff;
    --bz-teal:#14b8a6;
    --bz-coral:#ff5470;
    --bz-indigo:#5b6ee1;
    --bz-lime:#9ccc1f;
    --bz-slate:#64748b;
    --bz-ink:#0a0f2e;
    --bz-paper:#fffaf0;
    --bz-paper-soft:#e8e2cf;
    --bz-text:#3a3a4a;
  }
  .bz-page,
  .bz-page * { box-sizing: border-box; }
  .bz-page input,
  .bz-page textarea,
  .bz-page select { font: inherit; }
  .bz-page{
    font-family:'Manrope', var(--t-text-font, system-ui, sans-serif);
    background:var(--bz-paper);
    color:var(--bz-ink);
    -webkit-font-smoothing:antialiased;
    line-height:1.5;
  }
  .bz-page img{ max-width:100%; display:block; }

  .bz-shell{
    display:grid;
    grid-template-columns: 1fr min(1180px, 100%) 1fr;
    overflow-x:hidden;
  }
  .bz-shell > .bz-center{
    grid-column: 2;
    min-width:0;
  }
  .bz-eyebrow{
    font-family:'Space Mono', ui-monospace, monospace;
    font-size:13px;
    letter-spacing:.14em;
    text-transform:uppercase;
    opacity:.8;
  }

  /* ---------- HEADER ---------- */
  .bz-header{
    background:var(--bz-deep);
    color:var(--bz-paper);
  }
  .bz-banner{
    position:relative;
    width:100%;
    line-height:0;
  }
  .bz-banner img{
    width:100%;
    height:auto;
    display:block;
  }
  .bz-banner__tag{
    position:absolute;
    top:16px;
    left:50%;
    transform:translateX(-50%);
    background:rgba(10,15,46,.78);
    border:1px solid rgba(255,201,60,.35);
    border-radius:999px;
    padding:7px 14px;
    max-width:calc(100% - 24px);
    display:flex;
    flex-direction:row;
    align-items:center;
    gap:6px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .bz-banner__tag .bz-eyebrow{
    color:var(--bz-gold);
    line-height:1.4;
    font-size:9.5px;
    letter-spacing:.06em;
  }
  @media (min-width:480px){
    .bz-banner__tag .bz-eyebrow{ font-size:13px; letter-spacing:.14em; }
  }
  .bz-hero-strip{
    max-width:1080px;
    margin:0 auto;
    padding:22px 24px 30px;
    display:flex;
    justify-content:center;
  }
  .bz-pills{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    justify-content:center;
  }
.bz-pill{
  font-family:'Space Mono', ui-monospace, monospace;
  font-size:12px;
  border:1px solid rgba(255,201,60,.4);
  border-radius:999px;
  padding:6px 14px;
  color:var(--bz-gold);
  display:inline-flex;
  align-items:center;
}

  /* ---------- ROUTE ---------- */
  .bz-route{
    max-width:1100px;
    margin:0 auto;
    padding:60px 24px 80px;
  }
  .bz-route__head{
    text-align:center;
    margin-bottom:48px;
  }
  .bz-route__head .bz-eyebrow{
    color:var(--bz-pink);
    font-size:20px;
    font-weight:700;
  }
  .bz-route__head h2{
    font-family:'Unbounded', var(--t-headline-font, system-ui, sans-serif);
    font-weight:700;
    font-size:clamp(16px,2.2vw,20px);
    margin-top:10px;
    color:var(--bz-deep);
    text-wrap:balance;
  }
  .bz-route__hint-wrap{
    display:flex;
    justify-content:center;
    margin-top:20px;
  }
  .bz-route__hint{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 18px;
    background:var(--bz-pink);
    color:var(--bz-paper);
    border-radius:999px;
    font-family:'Space Mono', ui-monospace, monospace;
    font-size:13px;
    font-weight:700;
    line-height:1.3;
    transform:rotate(-2deg);
    text-align:left;
  }
  @media (min-width:860px){
    .bz-route__hint-wrap{ justify-content:center; }
  }
  .bz-track{
    display:flex;
    flex-direction:column;
    gap:0;
    position:relative;
  }
  .bz-stop{
    display:flex;
    align-items:flex-start;
    gap:28px;
    position:relative;
    padding:22px 0;
  }
  .bz-stop:not(:first-child)::before{
    content:"";
    position:absolute;
    z-index:0;
    left:65px;
    top:0;
    width:2px;
    height:22px; /* exactly the row's padding-top — connects to the circle above */
    background-image:linear-gradient(var(--bz-deep2) 55%, rgba(0,0,0,0) 0%);
    background-size:2px 12px;
    background-repeat:repeat-y;
    opacity:.3;
  }
  .bz-stop:not(:last-child)::after{
    content:"";
    position:absolute;
    z-index:0;
    left:65px;
    top:154px; /* bottom of the circle: 22px padding-top + 132px circle height */
    width:2px;
    height:calc(100% - 154px);
    background-image:linear-gradient(var(--bz-deep2) 55%, rgba(0,0,0,0) 0%);
    background-size:2px 12px;
    background-repeat:repeat-y;
    opacity:.3;
  }
  .bz-blob{
    position:relative;
    z-index:1;
    flex:none;
    width:132px;
    height:132px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    font-family:'Unbounded', var(--t-headline-font, system-ui, sans-serif);
    font-weight:700;
    font-size:16px;
    line-height:1.18;
    transition:transform .35s ease;
    cursor:pointer;
    outline:none;
  }
  a.bz-blob{
    text-decoration:none;
    color:inherit;
  }
  .bz-blob:focus-visible{
    filter:drop-shadow(0 0 0 2px var(--bz-deep)) drop-shadow(0 0 0 4px var(--bz-gold));
  }
  .bz-stop:hover .bz-blob{ transform:scale(1.06) rotate(-2deg); }
  .bz-blob__shape{
    position:absolute;
    inset:0;
    z-index:0;
  }
  .bz-blob__label{
    position:relative;
    z-index:1;
    padding:0 10px;
  }
  .bz-blob__sub{
    display:block;
    font-family:'Space Mono', ui-monospace, monospace;
    font-weight:400;
    font-size:11px;
    letter-spacing:.08em;
    opacity:.85;
    margin-top:4px;
  }
  .bz-blob__check{
    position:absolute;
    top:6px;
    right:6px;
    z-index:2;
    width:30px;
    height:30px;
    border-radius:50%;
    background:var(--bz-green);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:'Space Mono', ui-monospace, monospace;
    font-size:16px;
    font-weight:700;
    box-shadow:0 2px 6px rgba(0,0,0,.25);
    opacity:0;
    transform:scale(.4);
    transition:opacity .25s ease, transform .25s cubic-bezier(.34,1.56,.64,1);
    pointer-events:none;
  }
  .bz-stop.is-done .bz-blob__check{
    opacity:1;
    transform:scale(1);
  }
  .bz-stop.is-done .bz-blob{
    opacity:.55;
    filter:grayscale(.35);
  }
  .bz-stop.is-done .bz-stop__body h3{
    text-decoration:line-through;
    text-decoration-color:var(--bz-green);
    text-decoration-thickness:2px;
  }

  .bz-stop--1{ color:var(--bz-deep); } .bz-stop--1 .bz-blob__shape path{ fill:var(--bz-gold); }
  .bz-stop--2{ color:var(--bz-paper); } .bz-stop--2 .bz-blob__shape path{ fill:var(--bz-pink); }
  .bz-stop--3{ color:var(--bz-paper); } .bz-stop--3 .bz-blob__shape path{ fill:var(--bz-orange); }
  .bz-stop--4{ color:var(--bz-paper); } .bz-stop--4 .bz-blob__shape path{ fill:var(--bz-cyan); }
  .bz-stop--5{ color:var(--bz-paper); } .bz-stop--5 .bz-blob__shape path{ fill:var(--bz-purple); }
  .bz-stop--6{ color:var(--bz-paper); } .bz-stop--6 .bz-blob__shape path{ fill:var(--bz-teal); }
  .bz-stop--7{ color:var(--bz-paper); } .bz-stop--7 .bz-blob__shape path{ fill:var(--bz-coral); }
  .bz-stop--8{ color:var(--bz-paper); } .bz-stop--8 .bz-blob__shape path{ fill:var(--bz-indigo); }
  .bz-stop--9{ color:var(--bz-deep); } .bz-stop--9 .bz-blob__shape path{ fill:var(--bz-lime); }
  .bz-stop--10{ color:var(--bz-paper); } .bz-stop--10 .bz-blob__shape path{ fill:var(--bz-slate); }

  .bz-stop__body{ max-width:420px; }
  .bz-stop__no{
    font-family:'Space Mono', ui-monospace, monospace;
    font-size:12px;
    color:var(--bz-deep2);
    opacity:.6;
    display:block;
    margin-bottom:4px;
  }
  .bz-stop__body h3{
    font-family:'Unbounded', var(--t-headline-font, system-ui, sans-serif);
    font-size:20px;
    margin-bottom:6px;
    color:var(--bz-deep);
    text-wrap:balance;
  }
  .bz-stop__body p{
    font-size:15px;
    line-height:1.6;
    color:var(--bz-text);
  }
  .bz-cta-row{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-top:14px;
  }
  .bz-cta{
    display:inline-flex;
    align-items:center;
    gap:6px;
    font-family:'Space Mono', ui-monospace, monospace;
    font-size:12px;
    letter-spacing:.02em;
    text-decoration:none;
    padding:8px 14px;
    border-radius:999px;
    border:1.5px solid transparent;
    transition:transform .2s ease, background .2s ease, color .2s ease;
    white-space:nowrap;
  }
  .bz-cta:hover{ transform:translateY(-1px); }
  .bz-cta::after{ content:"→"; }
  .bz-stop--1 .bz-cta{ border-color:var(--bz-gold-dark); color:var(--bz-gold-dark); background:rgba(255,201,60,.12); }
  .bz-stop--1 .bz-cta:hover{ background:var(--bz-gold); color:var(--bz-deep); }
  .bz-stop--2 .bz-cta{ border-color:var(--bz-pink); color:var(--bz-pink); background:rgba(255,61,138,.08); }
  .bz-stop--2 .bz-cta:hover{ background:var(--bz-pink); color:var(--bz-paper); }
  .bz-stop--3 .bz-cta{ border-color:var(--bz-orange); color:#c85c10; background:rgba(255,122,26,.1); }
  .bz-stop--3 .bz-cta:hover{ background:var(--bz-orange); color:var(--bz-paper); }
  .bz-stop--4 .bz-cta{ border-color:var(--bz-cyan); color:#1a7ba8; background:rgba(47,168,224,.1); }
  .bz-stop--4 .bz-cta:hover{ background:var(--bz-cyan); color:var(--bz-paper); }
  .bz-stop--5 .bz-cta{ border-color:var(--bz-purple); color:#6b21d8; background:rgba(138,79,255,.1); }
  .bz-stop--5 .bz-cta:hover{ background:var(--bz-purple); color:var(--bz-paper); }
  .bz-stop--6 .bz-cta{ border-color:var(--bz-teal); color:#0d7d70; background:rgba(20,184,166,.1); }
  .bz-stop--6 .bz-cta:hover{ background:var(--bz-teal); color:var(--bz-paper); }
  .bz-stop--7 .bz-cta{ border-color:var(--bz-coral); color:#c22c46; background:rgba(255,84,112,.1); }
  .bz-stop--7 .bz-cta:hover{ background:var(--bz-coral); color:var(--bz-paper); }
  .bz-stop--8 .bz-cta{ border-color:var(--bz-indigo); color:#3d4dc4; background:rgba(91,110,225,.1); }
  .bz-stop--8 .bz-cta:hover{ background:var(--bz-indigo); color:var(--bz-paper); }
  .bz-stop--9 .bz-cta{ border-color:#7ba30f; color:#5e7d0c; background:rgba(156,204,31,.12); }
  .bz-stop--9 .bz-cta:hover{ background:var(--bz-lime); color:var(--bz-deep); }
  .bz-stop--10 .bz-cta{ border-color:var(--bz-slate); color:#475569; background:rgba(100,116,139,.1); }
  .bz-stop--10 .bz-cta:hover{ background:var(--bz-slate); color:var(--bz-paper); }

  @media (min-width:860px){
    .bz-track{
      display:grid;
      grid-template-columns:repeat(4, 1fr);
      gap:48px 24px;
    }
    .bz-stop{ flex-direction:column; align-items:center; text-align:center; width:auto; padding:0; }
    .bz-stop__body{ max-width:none; }
    .bz-cta-row{ justify-content:center; }
    .bz-stop::after,
    .bz-stop::before{ display:none; } /* connector line not needed in the 4-per-row grid */
  }
  @media (max-width:480px){
    .bz-route{ padding:48px 16px 56px; }
    .bz-blob{ width:96px; height:96px; font-size:14px; }
    .bz-stop{ gap:18px; }
    .bz-stop:not(:first-child)::before{ left:46px; }
    .bz-stop:not(:last-child)::after{ left:46px; top:118px; height:calc(100% - 118px); } /* bottom of the circle: 22px + 96px */
    .bz-banner__tag{ font-size:11px; padding:6px 12px; }
    .bz-pill{ font-size:11px; padding:5px 10px; }
  }

  /* ---------- FOOTER ---------- */
  .bz-footer{
    background:var(--bz-deep);
    color:#b9c2e8;
    padding:52px 24px 28px;
  }
  .bz-footer__inner{
    max-width:1080px;
    margin:0 auto;
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    gap:32px;
  }
  .bz-footer__brand{
    font-family:'Unbounded', var(--t-headline-font, system-ui, sans-serif);
    font-weight:700;
    font-size:20px;
    color:var(--bz-gold);
  }
  .bz-footer__brand p{
    font-family:'Manrope', var(--t-text-font, system-ui, sans-serif);
    font-weight:400;
    font-size:13px;
    color:#8b95c9;
    margin-top:8px;
    max-width:260px;
    line-height:1.5;
  }
  .bz-footer__cols{
    display:flex;
    gap:56px;
    flex-wrap:wrap;
  }
  .bz-footer__col h4{
    font-family:'Space Mono', ui-monospace, monospace;
    font-size:12px;
    letter-spacing:.1em;
    text-transform:uppercase;
    color:var(--bz-pink);
    margin-bottom:12px;
  }
  .bz-footer__col a{
    display:block;
    color:#b9c2e8;
    text-decoration:none;
    font-size:14px;
    margin-bottom:8px;
    opacity:.9;
    transition:opacity .2s ease;
  }
  .bz-footer__col a:hover{ opacity:1; text-decoration:underline; }
  .bz-footer__bottom{
    max-width:1080px;
    margin:40px auto 0;
    padding-top:20px;
    border-top:1px solid rgba(255,255,255,.1);
    font-size:12px;
    color:#7480b0;
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    gap:8px;
  }

  @media (prefers-reduced-motion: reduce){
    .bz-page *,
    .bz-page *::before,
    .bz-page *::after{
      animation-duration:.001ms !important;
      animation-iteration-count:1 !important;
      transition-duration:.001ms !important;
    }
  }
  
  .bz-pill-button > .bz-get-guide-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Space Mono', ui-monospace, monospace;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .02em;
    color: var(--bz-deep);
    background: var(--bz-gold);
    border: 1.5px solid var(--bz-gold-dark);
    border-radius: 999px;
    padding: 12px 28px;
    text-decoration: none;
    transition: transform .2s ease, background .2s ease, color .2s ease;
  }
</style>