:root {
    color-scheme:dark;
    --bg:#101310;
    --panel:#191e19;
    --line:#30382f;
    --muted:#a7b0a4;
    --ink:#edf0e8;
    --accent:#d4ed98;
    --max:1180px
}
* {
    box-sizing:border-box
}
html {
    scroll-behavior:smooth;
    scroll-padding-top:90px
}
body {
    margin:0;
    background:var(--bg);
    color:var(--ink);
    font:16px/1.65 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif
}
a {
    color:inherit;
    text-decoration:none
}
a:hover {
    color:var(--accent)
}
button,input,select,textarea {
    font:inherit
}
button,a,input,summary,select,textarea {
    outline-offset:5px
}
button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible {
    outline:2px solid var(--accent)
}
button {
    cursor:pointer
}
.wrap {
    max-width:var(--max);
    margin:auto;
    padding:0 30px
}
.skip {
    position:absolute;
    left:20px;
    top:-100px;
    background:var(--accent);
    color:var(--bg);
    padding:10px;
    z-index:5
}
.skip:focus {
    top:10px
}
.topbar {
    border-bottom:1px solid var(--line);
    background:var(--bg)
}
.header {
    display:flex;
    align-items:center;
    min-height:88px;
    gap:36px
}
.brand {
    font-weight:800;
    letter-spacing:.08em;
    font-size:19px;
    white-space:nowrap;
    display:flex;
    align-items:center;
    gap:11px
}
.brand-mark {
    height:28px;
    width:32px;
    border:1.5px solid var(--accent);
    display:inline-grid;
    place-items:center;
    color:var(--accent);
    border-radius:5px;
    font-size:21px;
    font-weight:400
}
.nav {
    display:flex;
    gap:26px;
    align-items:center;
    margin-left:auto;
    font-size:14px
}
.nav a[aria-current=page] {
    color:var(--accent)
}
.nav .nav-register {
    border:1px solid var(--line);
    padding:9px 15px;
    border-radius:6px
}
.menu {
    display:none;
    border:1px solid var(--line);
    background:none;
    color:var(--ink);
    padding:7px 12px;
    border-radius:5px
}
.eyebrow {
    text-transform:uppercase;
    letter-spacing:.16em;
    font-size:11px;
    font-weight:700;
    color:var(--accent);
    display:flex;
    align-items:center;
    gap:10px
}
.eyebrow:before {
    content:"";
    width:6px;
    height:6px;
    background:var(--accent);
    border-radius:50%
}
h1,h2,h3,p {
    margin-top:0
}
h1 {
    font-size:clamp(42px,5.5vw,74px);
    line-height:1.05;
    letter-spacing:-.055em;
    font-weight:550;
    margin:25px 0
}
h2 {
    font-size:clamp(28px,3vw,40px);
    line-height:1.2;
    letter-spacing:-.035em;
    font-weight:550
}
h3 {
    font-size:21px;
    line-height:1.3;
    font-weight:550
}
p {
    color:var(--muted)
}
.hero {
    display:grid;
    grid-template-columns:1.2fr 1fr;
    align-items:center;
    gap:85px;
    padding-top:85px;
    padding-bottom:85px
}
.hero h1 em {
    color:var(--accent);
    font-style:normal
}
.lead {
    font-size:18px;
    max-width:580px;
    line-height:1.7
}
.actions {
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    align-items:center;
    margin-top:30px
}
.button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:25px;
    background:var(--accent);
    color:#1a2413;
    border:1px solid var(--accent);
    padding:12px 21px;
    border-radius:6px;
    font-weight:600;
    font-size:14px
}
.button:hover {
    background:#e0f5b2;
    color:#16200f
}
.button.secondary {
    background:transparent;
    color:var(--ink);
    border-color:var(--line)
}
.small {
    font-size:12px;
    color:var(--muted)
}
.hero-note {
    margin:20px 0 0
}
.address-art {
    border:1px solid #414b3a;
    border-radius:10px;
    overflow:hidden;
    background:linear-gradient(145deg,#232c20,#171d17);
    box-shadow:0 25px 80px #0003;
    transform:rotate(-2deg)
}
.art-head {
    display:flex;
    justify-content:space-between;
    padding:17px 23px;
    border-bottom:1px solid #414b3a;
    font:11px ui-monospace,monospace;
    letter-spacing:.06em;
    color:var(--muted)
}
.art-main {
    padding:40px 28px
}
.envelope {
    width:68px;
    height:48px;
    border:1px solid var(--accent);
    border-radius:5px;
    position:relative;
    margin-bottom:34px;
    overflow:hidden
}
.envelope:after {
    content:"";
    position:absolute;
    width:48px;
    height:48px;
    border:1px solid var(--accent);
    transform:rotate(45deg);
    left:9px;
    top:-27px
}
.address {
    font:clamp(17px,2vw,25px) ui-monospace,monospace;
    color:var(--accent);
    letter-spacing:-.04em;
    overflow-wrap:anywhere
}
.art-bottom {
    border-top:1px solid #414b3a;
    display:flex;
    gap:24px;
    padding:17px 23px;
    font:11px ui-monospace,monospace;
    color:var(--muted)
}
.values {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    padding:32px 0;
    gap:45px
}
.values h3 {
    font-size:16px;
    margin-bottom:8px
}
.values p {
    font-size:13px;
    margin-bottom:0
}
.section {
    padding:75px 0
}
.section-heading {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:30px;
    margin-bottom:35px
}
.section-heading h2 {
    margin-bottom:0
}
.section-heading p {
    max-width:330px;
    font-size:14px;
    margin:0
}
.plans {
    display:grid;
    grid-template-columns:repeat(5,1fr);
    border:1px solid var(--line);
    border-radius:8px;
    overflow:hidden
}
.plan {
    padding:25px 20px;
    border-right:1px solid var(--line);
    display:flex;
    flex-direction:column;
    background:#141914
}
.plan:last-child {
    border:0
}
.plan.featured {
    background:#222c1e
}
.plan h3 {
    margin:18px 0 5px;
    font-size:23px
}
.plan .tag {
    font-size:10px;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:var(--muted)
}
.plan.featured .tag {
    color:var(--accent)
}
.plan .caption {
    font-size:12px;
    min-height:42px
}
.plan .capacity {
    font-size:28px;
    letter-spacing:-.04em;
    margin:18px 0;
    color:var(--ink)
}
.plan ul {
    list-style:none;
    padding:0;
    font-size:12px;
    color:var(--muted);
    line-height:2.2;
    margin:0 0 25px
}
.plan .price {
    font-size:12px;
    margin-top:auto;
    color:var(--ink);
    padding-top:18px;
    border-top:1px solid var(--line)
}
.plan a {
    font-size:13px;
    margin-top:10px;
    color:var(--accent)
}
.note {
    font-size:12px;
    margin-top:20px;
    max-width:900px
}
.split {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:90px
}
.steps {
    list-style:none;
    counter-reset:step;
    padding:0;
    margin:0
}
.steps li {
    counter-increment:step;
    border-top:1px solid var(--line);
    padding:22px 0 22px 49px;
    position:relative
}
.steps li:before {
    content:"0" counter(step);
    position:absolute;
    left:0;
    top:24px;
    color:var(--accent);
    font:12px ui-monospace,monospace
}
.steps h3 {
    font-size:17px;
    margin-bottom:8px
}
.steps p {
    font-size:14px;
    margin:0
}
.callout {
    border:1px solid #414c37;
    background:#20291c;
    padding:35px;
    border-radius:8px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px
}
.callout h2 {
    font-size:27px;
    margin-bottom:10px
}
.callout p {
    margin:0;
    max-width:650px;
    font-size:14px
}
.footer {
    border-top:1px solid var(--line);
    padding:40px 0 25px;
    margin-top:50px
}
.footer-top {
    display:flex;
    justify-content:space-between;
    gap:40px
}
.footer-links {
    display:flex;
    gap:25px;
    flex-wrap:wrap;
    font-size:13px
}
.footer-bottom {
    display:flex;
    justify-content:space-between;
    gap:25px;
    border-top:1px solid var(--line);
    padding-top:20px;
    margin-top:30px;
    font-size:11px;
    color:var(--muted)
}
.page-head {
    padding:65px 0 40px;
    max-width:800px
}
.page-head h1 {
    font-size:clamp(38px,5vw,58px)
}
.content {
    max-width:800px
}
.content h2 {
    font-size:28px;
    margin-top:40px
}
.content p,.content li {
    color:var(--muted)
}
.content strong {
    color:var(--ink)
}
.notice {
    border-left:2px solid var(--accent);
    background:var(--panel);
    padding:18px 22px;
    margin:22px 0;
    font-size:14px;
    color:var(--muted)
}
.notice strong {
    color:var(--ink)
}
.faq-tools {
    max-width:800px;
    margin:0 0 25px
}
.field {
    display:flex;
    flex-direction:column;
    gap:7px;
    font-size:13px;
    margin-bottom:18px
}
.field input,.field textarea,.field select,.search {
    width:100%;
    padding:12px 14px;
    background:#171c17;
    color:var(--ink);
    border:1px solid #424b3e;
    border-radius:5px
}
.field small {
    color:var(--muted)
}
details {
    border-bottom:1px solid var(--line);
    padding:22px 0
}
summary {
    cursor:pointer;
    font-size:17px;
    padding-right:15px
}
details p {
    margin:16px 0 0;
    font-size:14px
}
details[open] summary {
    color:var(--accent)
}
.guide-grid {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
    margin-top:35px
}
.guide {
    border:1px solid var(--line);
    padding:24px;
    border-radius:7px
}
.guide .eyebrow {
    font-size:10px
}
.guide h3 {
    margin:15px 0 8px
}
.guide p {
    font-size:13px;
    margin:0
}
.table-wrap {
    overflow:auto;
    border:1px solid var(--line);
    border-radius:7px
}
table {
    width:100%;
    border-collapse:collapse;
    text-align:left;
    font-size:14px
}
th,td {
    padding:16px 20px;
    border-bottom:1px solid var(--line)
}
th {
    font-size:12px;
    color:var(--muted);
    font-weight:500
}
tr:last-child td {
    border-bottom:0
}
code {
    font-family:ui-monospace,monospace;
    color:var(--accent);
    font-size:.92em;
    overflow-wrap:anywhere
}
.form-panel {
    padding:30px;
    border:1px solid var(--line);
    border-radius:8px;
    max-width:540px;
    background:#141914
}
.form-panel fieldset {
    margin:0;
    border:0;
    padding:0
}
.form-panel legend {
    font-size:18px;
    margin-bottom:20px
}
.form-panel :disabled {
    cursor:not-allowed;
    opacity:.6
}
.two-cols {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px
}
.form-panel .button {
    width:100%
}
.side-note {
    padding-top:15px
}
.side-note h3 {
    margin-top:25px
}
.side-note p {
    font-size:14px
}
.empty {
    border:1px dashed #44513e;
    padding:30px;
    border-radius:7px;
    color:var(--muted);
    font-size:14px
}
.segmented {
    display:inline-flex;
    border:1px solid var(--line);
    border-radius:6px;
    padding:4px;
    margin-bottom:20px;
    gap:4px
}
.segmented button {
    border:0;
    background:none;
    padding:7px 20px;
    color:var(--muted);
    border-radius:4px;
    font-size:13px
}
.segmented button[aria-pressed=true] {
    background:var(--accent);
    color:#1a2413
}
.wallet {
    border:1px solid var(--line);
    padding:25px;
    margin-bottom:15px;
    border-radius:7px
}
.wallet code {
    display:block;
    margin:12px 0;
    word-break:break-all
}
.wallet button {
    padding:7px 13px
}
.hidden,[hidden] {
    display:none!important
}
.link {
    color:var(--accent);
    text-decoration:underline;
    text-underline-offset:4px
}
.status-line {
    font-size:12px;
    color:var(--accent)
}
@media(max-width:1000px) {
    .header {
        gap:20px
    }
    .nav {
        gap:16px
    }
    .hero {
        gap:35px
    }
    .plans {
        grid-template-columns:repeat(3,1fr);
        border:0;
        gap:12px
    }
    .plan {
        border:1px solid var(--line)!important;
        border-radius:7px
    }
    .split {
        gap:40px
    }
}
@media(max-width:740px) {
    .wrap {
        padding:0 20px
    }
    .header {
        min-height:72px;
        flex-wrap:wrap;
        padding-top:15px;
        padding-bottom:15px
    }
    .menu {
        display:block;
        margin-left:auto
    }
    .nav {
        display:none;
        flex-basis:100%;
        margin:0;
        flex-direction:column;
        align-items:stretch;
        gap:0
    }
    .nav.open {
        display:flex
    }
    .nav a {
        padding:12px 0
    }
    .nav .nav-register {
        margin-top:8px;
        text-align:center
    }
    .hero {
        grid-template-columns:1fr;
        gap:40px;
        padding-top:48px;
        padding-bottom:48px
    }
    .hero h1 {
        font-size:53px
    }
    .lead {
        font-size:16px
    }
    .address-art {
        max-width:450px;
        transform:none
    }
    .values {
        grid-template-columns:1fr;
        gap:24px
    }
    .section {
        padding:48px 0
    }
    .section-heading {
        display:block
    }
    .section-heading p {
        margin-top:17px
    }
    .plans {
        grid-template-columns:repeat(2,1fr)
    }
    .plan:last-child {
        grid-column:1/-1
    }
    .split {
        grid-template-columns:1fr;
        gap:25px
    }
    .callout {
        display:block;
        padding:25px
    }
    .callout .button {
        margin-top:20px
    }
    .footer-top,.footer-bottom {
        flex-direction:column;
        gap:22px
    }
    .guide-grid {
        grid-template-columns:1fr
    }
    .page-head {
        padding:42px 0 25px
    }
    .form-panel {
        padding:22px
    }
    .two-cols {
        grid-template-columns:1fr
    }
    .section-heading .segmented {
        margin-top:20px
    }
}
@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior:auto
    }
}
@media(max-width:390px) {
    .plans {
        grid-template-columns:1fr
    }
    .hero h1 {
        font-size:45px
    }
    .plan .caption {
        min-height:0
    }
}
/* Functional contact forms */
.contact-form .field input,.contact-form .field textarea,.contact-form .field select {
    width:100%;
    max-width:100%
}
.captcha-row {
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:wrap;
    margin:20px 0
}
.captcha-row img {
    border-radius:6px;
    max-width:100%;
    height:auto
}
.consent {
    display:block;
    font-size:13px;
    color:var(--muted);
    margin:20px 0
}
.consent input {
    width:auto;
    display:inline
}
.consent a,.content a,.notice a {
    color:var(--accent);
    text-decoration:underline
}
.form-error {
    border-color:#d78b78
}
.contact-form button[type=submit] {
    margin-top:10px
}
.wallet code {
    display:block;
    overflow-wrap:anywhere;
    margin:15px 0
}
.wallet {
    padding:22px;
    border:1px solid var(--line);
    border-radius:8px;
    margin-bottom:15px
}
.wallets {
    display:grid;
    gap:20px
}
.content table {
    width:100%;
    border-collapse:collapse
}
.content td,.content th {
    padding:10px;
    text-align:left;
    border-bottom:1px solid var(--line);
    overflow-wrap:anywhere
}
.content {
    overflow-wrap:anywhere
}
.nav {
    gap:19px
}

/* The language switch remains visible when the mobile menu is closed. */
.language-switch {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
    font-size: 13px;
}
.language-switch a {
    padding: 5px 7px;
    border: 1px solid var(--line);
    border-radius: 5px;
}
.language-switch a[aria-current="true"] {
    color: var(--bg);
    background: var(--accent);
}
@media (max-width: 760px) {
    .header { gap: 12px; flex-wrap: wrap; }
    .language-switch { margin-left: auto; }
    .nav { order: 5; width: 100%; }
}