{% extends "base.html" %}

{#
  OpenAfterHours — Zensical landing page override.
  On "/" (page.url empty) we render a full-viewport constellation hero
  and hide Material's header, sidebar, main container, and footer so the
  hero owns the screen. Every other page gets the stock Material layout.
#}

{% block extrahead %}
  {{ super() }}
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
{% endblock %}

{% block header %}
  {% if not page.url %}
  {% else %}
    {{ super() }}
  {% endif %}
{% endblock %}

{% block hero %}
  {% if not page.url %}
    <section class="landing-hero" data-screen-label="01 Hero">
      <div class="constellation-bg" aria-hidden="true">
        <svg class="constellation-svg" viewBox="0 0 200 100" preserveAspectRatio="xMidYMid slice">
          <g class="constellation-spin">
            {# Cluster A — left bleed (visible on wider screens) #}
            <line class="constellation-line" x1="22" y1="36" x2="30" y2="28" />
            <line class="constellation-line" x1="30" y1="28" x2="40" y2="30" />
            <line class="constellation-line" x1="40" y1="30" x2="44" y2="42" />
            <line class="constellation-line" x1="44" y1="42" x2="28" y2="46" />
            <line class="constellation-line" x1="28" y1="46" x2="22" y2="36" />
            <line class="constellation-line" x1="30" y1="28" x2="28" y2="46" />

            {# Cluster B — Standardised Approach (safe zone) #}
            <line class="constellation-line" x1="80" y1="28" x2="86" y2="22" />
            <line class="constellation-line" x1="86" y1="22" x2="94" y2="26" />
            <line class="constellation-line" x1="94" y1="26" x2="96" y2="36" />
            <line class="constellation-line" x1="96" y1="36" x2="84" y2="38" />
            <line class="constellation-line" x1="84" y1="38" x2="80" y2="28" />
            <line class="constellation-line" x1="86" y1="22" x2="84" y2="38" />

            {# Cluster C — Foundation IRB (safe zone) #}
            <line class="constellation-line" x1="108" y1="58" x2="116" y2="54" />
            <line class="constellation-line" x1="116" y1="54" x2="124" y2="58" />
            <line class="constellation-line" x1="124" y1="58" x2="122" y2="68" />
            <line class="constellation-line" x1="122" y1="68" x2="110" y2="70" />
            <line class="constellation-line" x1="110" y1="70" x2="108" y2="58" />
            <line class="constellation-line" x1="116" y1="54" x2="110" y2="70" />

            {# Cluster D — right bleed (visible on wider screens) #}
            <line class="constellation-line" x1="158" y1="34" x2="166" y2="28" />
            <line class="constellation-line" x1="166" y1="28" x2="176" y2="32" />
            <line class="constellation-line" x1="176" y1="32" x2="178" y2="44" />
            <line class="constellation-line" x1="178" y1="44" x2="164" y2="46" />
            <line class="constellation-line" x1="164" y1="46" x2="158" y2="34" />
            <line class="constellation-line" x1="158" y1="34" x2="176" y2="32" />

            {# Cluster E — CRR · Basel 3.1 anchor (safe zone) #}
            <line class="constellation-line" x1="90" y1="82" x2="98" y2="78" />
            <line class="constellation-line" x1="98" y1="78" x2="106" y2="82" />
            <line class="constellation-line" x1="106" y1="82" x2="100" y2="88" />
            <line class="constellation-line" x1="100" y1="88" x2="90" y2="82" />
            <line class="constellation-line" x1="98" y1="78" x2="100" y2="88" />

            {# Warm cluster stars #}
            <circle class="constellation-star-warm" cx="22"  cy="36" r="0.432"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="30"  cy="28" r="0.360"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="40"  cy="30" r="0.396"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="44"  cy="42" r="0.324"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="28"  cy="46" r="0.396"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="7s" repeatCount="indefinite" /></circle>

            <circle class="constellation-star-warm" cx="80"  cy="28" r="0.468"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="86"  cy="22" r="0.360"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="94"  cy="26" r="0.324"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="96"  cy="36" r="0.396"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="84"  cy="38" r="0.288"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="7s" repeatCount="indefinite" /></circle>

            <circle class="constellation-star-warm" cx="108" cy="58" r="0.432"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="116" cy="54" r="0.324"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="124" cy="58" r="0.396"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="122" cy="68" r="0.360"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="110" cy="70" r="0.288"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="7s" repeatCount="indefinite" /></circle>

            <circle class="constellation-star-warm" cx="158" cy="34" r="0.396"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="166" cy="28" r="0.468"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="176" cy="32" r="0.324"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="178" cy="44" r="0.360"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="164" cy="46" r="0.288"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="7s" repeatCount="indefinite" /></circle>

            <circle class="constellation-star-warm" cx="90"  cy="82" r="0.396"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="98"  cy="78" r="0.324"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="106" cy="82" r="0.432"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-warm" cx="100" cy="88" r="0.360"><animate attributeName="opacity" values="0.4;0.95;0.4" dur="6s" repeatCount="indefinite" /></circle>

            {# Cool filler stars — left bleed #}
            <circle class="constellation-star-cool" cx="5"   cy="18" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="12"  cy="60" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="18"  cy="72" r="0.252"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="50"  cy="12" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="8"   cy="88" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="55"  cy="88" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="15"  cy="8"  r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="65"  cy="50" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="48"  cy="60" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="40"  cy="80" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="35"  cy="14" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="60"  cy="70" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="4s" repeatCount="indefinite" /></circle>

            {# Cool filler stars — safe zone (mobile-visible) #}
            <circle class="constellation-star-cool" cx="75"  cy="12" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="92"  cy="10" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="108" cy="8"  r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="125" cy="14" r="0.252"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="78"  cy="50" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="85"  cy="66" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="120" cy="32" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="104" cy="48" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="118" cy="78" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="82"  cy="76" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="4s" repeatCount="indefinite" /></circle>

            {# Cool filler stars — right bleed #}
            <circle class="constellation-star-cool" cx="140" cy="12" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="150" cy="74" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="190" cy="22" r="0.252"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="195" cy="62" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="145" cy="88" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="182" cy="82" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="140" cy="50" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="190" cy="92" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="155" cy="18" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="170" cy="16" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="168" cy="90" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="175" cy="55" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="135" cy="60" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>

            {# Envelope stars — placed outside the 200×100 viewBox so rotation never leaves the sides bare #}
            <circle class="constellation-star-cool" cx="-8"  cy="30"  r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="0"   cy="70"  r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="15"  cy="-10" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="40"  cy="-25" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="75"  cy="-15" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="100" cy="-40" r="0.252"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="125" cy="-20" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="160" cy="-25" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="195" cy="-15" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="208" cy="20"  r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="210" cy="55"  r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="205" cy="80"  r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="198" cy="108" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="170" cy="120" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="135" cy="135" r="0.252"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="100" cy="130" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="65"  cy="138" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="30"  cy="125" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="2"   cy="110" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="-5"  cy="85"  r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="-10" cy="20"  r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="215" cy="30"  r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="218" cy="75"  r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="88"  cy="-45" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="105" cy="148" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="4s" repeatCount="indefinite" /></circle>

            {# Densifying feeder strips (x=50..150, y<0 or y>100) — these swing into the L/R bands at 90°/270° rotation #}
            <circle class="constellation-star-cool" cx="55"  cy="-8"  r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="70"  cy="-30" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="85"  cy="-12" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="112" cy="-30" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="130" cy="-8"  r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="145" cy="-32" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="58"  cy="-32" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>

            <circle class="constellation-star-cool" cx="55"  cy="112" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="72"  cy="128" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="88"  cy="115" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="4s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="115" cy="118" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="5s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="125" cy="132" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="6s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="148" cy="115" r="0.180"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="7s" repeatCount="indefinite" /></circle>
            <circle class="constellation-star-cool" cx="80"  cy="110" r="0.216"><animate attributeName="opacity" values="0.4;0.7;0.4" dur="3s" repeatCount="indefinite" /></circle>

            {# Labels — kept within safe zone so they remain visible on mobile #}
            <text class="constellation-svg-label" x="88"  y="44" text-anchor="middle">Standardised Approach</text>
            <text class="constellation-svg-label" x="116" y="76" text-anchor="middle">Foundation IRB</text>
            <text class="constellation-svg-label" x="100" y="94" text-anchor="middle">CRR &middot; Basel 3.1</text>
          </g>
        </svg>
      </div>

      <div class="landing-scrim" aria-hidden="true"></div>

      <div class="hero">
        <header class="hero-nav">
          <a class="brand" href="./">
            <img src="assets/openafterhours_icon_512.png" alt="" class="brand-icon">
            <div class="brand-text">
              <div class="brand-name">OpenAfterHours</div>
              <div class="brand-tag">UK Credit Risk RWA Calculator</div>
            </div>
          </a>
          <nav class="nav-links">
            <a href="overview/">Docs</a>
            <a href="user-guide/interactive-ui/">Calculator</a>
            <a href="framework-comparison/technical-reference/">Reference</a>
            <a href="https://github.com/OpenAfterHours/rwa_calculator" class="github-link" target="_blank" rel="noopener">
              <svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 .5C5.65.5.5 5.65.5 12c0 5.08 3.29 9.39 7.86 10.91.58.1.79-.25.79-.55v-2.13c-3.2.7-3.87-1.36-3.87-1.36-.52-1.32-1.27-1.67-1.27-1.67-1.04-.71.08-.7.08-.7 1.15.08 1.76 1.18 1.76 1.18 1.02 1.75 2.69 1.24 3.34.95.1-.74.4-1.25.73-1.54-2.55-.29-5.24-1.28-5.24-5.69 0-1.26.45-2.29 1.18-3.1-.12-.29-.51-1.46.11-3.04 0 0 .96-.31 3.15 1.18a10.93 10.93 0 0 1 5.74 0c2.19-1.49 3.15-1.18 3.15-1.18.62 1.58.23 2.75.11 3.04.74.81 1.18 1.84 1.18 3.1 0 4.42-2.69 5.39-5.26 5.68.41.36.78 1.06.78 2.15v3.18c0 .31.21.66.8.55C20.21 21.39 23.5 17.08 23.5 12 23.5 5.65 18.35.5 12 .5Z"/></svg>
              <span>GitHub</span>
            </a>
          </nav>
        </header>

        <div class="hero-body">
          <div class="eyebrow">
            <span class="prompt">$</span>
            <span>OPEN SOURCE &middot; BUILT AFTER HOURS</span>
          </div>

          <h1 class="title">
            Risk-Weighted Assets,<br>
            <span class="title-accent">computed at the speed of polars.</span>
          </h1>

          <p class="lede">
            A high-performance Python engine for CRR (Basel 3.0) and Basel 3.1
            (PRA PS1/26) &mdash; Standardised, F-IRB and A-IRB approaches.
            Millions of exposures in seconds, audited across
            <span class="num">~5,300 tests</span>.
          </p>

          <div class="cta-row">
            <a href="overview/" class="btn btn-primary">
              Read the Docs
              <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
            </a>
            <a href="user-guide/interactive-ui/" class="btn btn-ghost">
              Open Calculator <span class="ext">&#8599;</span>
            </a>
          </div>

          <div class="install">
            <span class="prompt">$</span>
            <code>pip install rwa-calculator</code>
            <button
              class="copy-btn"
              type="button"
              aria-label="Copy install command"
              onclick="var b=this;navigator.clipboard&amp;&amp;navigator.clipboard.writeText('pip install rwa-calculator').then(function(){b.classList.add('is-copied');setTimeout(function(){b.classList.remove('is-copied');},1400);});">
              <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>
            </button>
          </div>

          <div class="meta-row">
            <div class="meta">
              <div class="meta-num">50&ndash;100&times;</div>
              <div class="meta-lbl">Faster than reference impl.</div>
            </div>
            <div class="meta-divider"></div>
            <div class="meta">
              <div class="meta-num">~5,300</div>
              <div class="meta-lbl">Regulatory test cases</div>
            </div>
            <div class="meta-divider"></div>
            <div class="meta">
              <div class="meta-num">2 frameworks</div>
              <div class="meta-lbl">CRR &middot; Basel 3.1</div>
            </div>
            <div class="meta-divider"></div>
            <div class="meta status">
              <div class="meta-num"><span class="status-dot"></span> Active dev</div>
              <div class="meta-lbl">Pre-1.0 &middot; not production-ready</div>
            </div>
          </div>
        </div>

        <footer class="hero-footer">
          <div>OpenAfterHours &middot; Open source regulatory tools</div>
          <div class="footer-meta">v0.2.3 &middot; Apache-2.0 licensed &middot; github.com/OpenAfterHours</div>
        </footer>
      </div>
    </section>
  {% endif %}
{% endblock %}

{% block site_nav %}
  {% if not page.url %}
  {% else %}
    {{ super() }}
  {% endif %}
{% endblock %}

{% block container %}
  {% if not page.url %}
  {% else %}
    {{ super() }}
  {% endif %}
{% endblock %}

{% block footer %}
  {% if not page.url %}
  {% else %}
    {{ super() }}
  {% endif %}
{% endblock %}