:root {
    
    --p:        #5b5ce2;
    --p2:       #7c3aed;
    --b:        #2563eb;

    --s:        #0ea5e9;
    --s2:       #06b6d4;
    --s-soft:   rgba(91, 92, 226, .12);

    --bg:       #ffffff;
    --bg2:      #f6f7fb;
    --card:     rgba(255, 255, 255, .78);
    --card-solid: #ffffff;

    --text:     #0f172a;
    --muted:    #475569;
    --muted2:   #64748b;

    --line:     rgba(230, 232, 240, .85);
    --line2:    rgba(230, 232, 240, 1);

    --shadow:   0 18px 55px rgba(15, 23, 42, .10);
    --shadow2:  0 10px 28px rgba(15, 23, 42, .08);
    --shadow3:  0 6px 18px rgba(0, 0, 0, .06);

    --success:  #16a34a;
    --warning:  #f59e0b;
    --danger:   #dc2626;
    --info:     #0ea5e9;

    --r:        18px;
    --r2:       14px;
    --r3:       10px;
    --header-h: 68px;
    --maxw:     1200px;

    --logo-S:    #0F1116;
    --logo-P:    #3D404A;
    --logo-foot: #9B9EA8;
}

[data-theme="dark"] {
    --bg:       #0b0d12;
    --bg2:      #11141b;
    --card:     rgba(22, 26, 35, .72);
    --card-solid: #161a23;

    --text:     #e8eaf0;
    --muted:    #a1a8b8;
    --muted2:   #7a8194;

    --line:     rgba(255, 255, 255, .06);
    --line2:    rgba(255, 255, 255, .10);

    --shadow:   0 18px 55px rgba(0, 0, 0, .45);
    --shadow2:  0 10px 28px rgba(0, 0, 0, .35);
    --shadow3:  0 6px 18px rgba(0, 0, 0, .30);

    --logo-S:    #6B6E78;
    --logo-P:    #A6A9B2;
    --logo-foot: #FFFFFF;
}

* { box-sizing: border-box; }
html, body { margin: 0; }

html {
    min-height: 100%;
    background-color: var(--bg);
    background-image:
        radial-gradient(1200px 600px at 85% 0%,  rgba(91, 92, 226, .18), transparent 55%),
        radial-gradient(900px 600px at 20% 15%,  rgba(37, 99, 235, .12), transparent 55%);
    background-repeat: no-repeat;
    background-attachment: fixed;
}
[data-theme="dark"] html {
    background-color: #0b0d12;
    background-image:
        radial-gradient(1200px 600px at 85% 0%,  rgba(91, 92, 226, .14), transparent 55%),
        radial-gradient(900px 600px at 20% 15%,  rgba(37, 99, 235, .08), transparent 55%);
}

body {
    font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    color: var(--text);
    font-size: 15px;
    line-height: 1.6;
    background: transparent;
    min-height: 100vh;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a    { color: inherit; text-decoration: none; }
img  { max-width: 100%; display: block; }
button { font-family: inherit; cursor: pointer; }

::selection { background: rgba(91, 92, 226, .25); color: var(--text); }

.container {
    width: 100%;
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 0 24px;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: var(--card);
    backdrop-filter: saturate(160%) blur(12px);
    -webkit-backdrop-filter: saturate(160%) blur(12px);
    border-bottom: 1px solid var(--line);
}

.site-header-inner {
    height: var(--header-h);
    display: flex;
    align-items: center;
    gap: 24px;
}

.brand {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 700;
    font-size: 16px;
    letter-spacing: -.01em;
    color: var(--text);
}
.brand .logo {
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.brand .tn-logo { width: 100%; height: 100%; display: block; }
.brand .tn-logo .tn-S    { fill: var(--logo-S);    transition: fill .3s ease; }
.brand .tn-logo .tn-P    { fill: var(--logo-P);    transition: fill .3s ease; }
.brand .tn-logo .tn-foot { fill: var(--logo-foot); transition: fill .3s ease; }

.brand-mark {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    line-height: 1;
    color: var(--text);
    text-decoration: none;
}

.brand-glyph {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
}
.brand-glyph .tn-logo { width: 100%; height: 100%; display: block; }
.brand-glyph .tn-logo .tn-S    { fill: var(--logo-S);    transition: fill .3s ease; }
.brand-glyph .tn-logo .tn-P    { fill: var(--logo-P);    transition: fill .3s ease; }
.brand-glyph .tn-logo .tn-foot { fill: var(--logo-foot); transition: fill .3s ease; }

.brand-wordmark {
    display: inline-flex;
    flex-direction: column;
    align-items: stretch;
    gap: 3px;
    line-height: 1;
}

.brand-name {
    font-size: 24px;
    font-weight: 800;
    letter-spacing: .02em;
    color: var(--text);
    line-height: 1;
}

.brand-sub {
    font-size: 9.5px;
    font-weight: 600;
    letter-spacing: .34em;
    color: var(--muted2);
    text-align: right;
    
    margin-right: -.34em;
    line-height: 1;
}

.brand-mark:hover .brand-sub { color: var(--muted); }

@media (max-width: 380px) {
    .brand-name { font-size: 16px; }
    .brand-sub  { font-size: 8.5px; }
    .brand-glyph { width: 32px; height: 32px; }
}

@keyframes tn-S-inspire    { 0%, 100% { transform: translate(0, 0);  } 50% { transform: translate(40px, -40px);  } }
@keyframes tn-P-inspire    { 0%, 100% { transform: translate(0, 0);  } 50% { transform: translate(-40px, -40px); } }
@keyframes tn-foot-inspire { 0%, 100% { transform: translate(0, 0);  } 50% { transform: translate(0, 40px);       } }

.tn-logo-anim .tn-S    { animation: tn-S-inspire    5s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.tn-logo-anim .tn-P    { animation: tn-P-inspire    5s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.tn-logo-anim .tn-foot { animation: tn-foot-inspire 5s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }

.site-nav {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
}

.site-nav a {
    padding: 8px 14px;
    border-radius: var(--r3);
    font-size: 14px;
    font-weight: 500;
    color: var(--muted);
    transition: color .15s ease, background .15s ease;
}
.site-nav a:hover  { color: var(--text); background: var(--bg2); }
.site-nav a.active { color: var(--text); background: var(--bg2); }

.site-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: 8px;
}

.icon-btn {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid var(--line);
    border-radius: var(--r3);
    color: var(--muted);
    transition: color .15s ease, background .15s ease, border-color .15s ease;
}
.icon-btn:hover { color: var(--text); background: var(--bg2); border-color: var(--line2); }

.nav-toggle {
    display: none;
    width: 40px;
    height: 40px;
    background: transparent;
    border: 1px solid var(--line);
    border-radius: var(--r3);
    color: var(--text);
    margin-left: auto;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 18px;
    border: 1px solid var(--line);
    background: var(--card-solid);
    color: var(--text);
    border-radius: var(--r3);
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    transition: transform .15s ease, box-shadow .15s ease,
                background .15s ease, border-color .15s ease;
}
.btn:hover { background: var(--bg2); border-color: var(--line2); transform: translateY(-1px); }
.btn:active { transform: translateY(0); }

.btn-primary {
    background: linear-gradient(135deg, var(--p), var(--p2));
    color: #fff;
    border-color: transparent;
    box-shadow: 0 8px 24px rgba(91, 92, 226, .35);
}
.btn-primary:hover {
    background: linear-gradient(135deg, var(--p), var(--p2));
    box-shadow: 0 12px 32px rgba(91, 92, 226, .45);
    border-color: transparent;
}

.btn-ghost {
    background: transparent;
    border-color: var(--line);
}

.btn-lg { padding: 14px 22px; font-size: 15px; }

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    background: var(--card-solid);
    border: 1px solid var(--line);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    color: var(--muted);
    letter-spacing: .04em;
    text-transform: uppercase;
}
.eyebrow i { color: var(--p); }

h1, h2, h3 { letter-spacing: -.02em; }
h1 { font-size: clamp(34px, 5vw, 56px); line-height: 1.05; margin: 0 0 16px; font-weight: 700; }
h2 { font-size: clamp(26px, 3.5vw, 38px); line-height: 1.15; margin: 0 0 14px; font-weight: 700; }
h3 { font-size: 20px; line-height: 1.3; margin: 0 0 10px; font-weight: 600; }

.lead {
    font-size: clamp(16px, 1.4vw, 18px);
    color: var(--muted);
    line-height: 1.65;
    max-width: 60ch;
}

.section {
    padding: clamp(60px, 8vw, 110px) 0;
}
.section-head {
    text-align: center;
    margin-bottom: clamp(36px, 5vw, 64px);
}
.section-head .lead { margin: 0 auto; }

.site-footer {
    border-top: 1px solid var(--line);
    background: var(--card);
    backdrop-filter: saturate(160%) blur(12px);
    -webkit-backdrop-filter: saturate(160%) blur(12px);
    margin-top: 80px;
    padding: 48px 0 24px;
}
.footer-grid {
    display: grid;
    grid-template-columns: 1.6fr repeat(2, 1fr);
    gap: 32px;
    margin-bottom: 32px;
}
.footer-col h4 {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--muted2);
    margin: 0 0 14px;
}
.footer-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.footer-col a { color: var(--muted); font-size: 14px; transition: color .15s ease; }
.footer-col a:hover { color: var(--text); }

.footer-brand-block {
    max-width: 460px;
}
.footer-brand-block p {
    margin: 0;
    font-size: 13px;
    color: var(--muted);
    line-height: 1.65;
}
.footer-brand-block .footer-tagline {
    margin-bottom: 14px;
}
.footer-brand-block .footer-info {
    font-size: 11.5px;
    color: var(--muted2);
    letter-spacing: .02em;
}
.footer-brand-block .footer-registry {
    margin-top: 10px;
    font-size: 11px;
    line-height: 1.7;
    color: var(--muted2);
    opacity: .8;
}

.footer-wordmark {
    display: inline-flex;
    flex-direction: column;
    align-items: stretch;
    gap: 3px;
    line-height: 1;
}
.footer-wordmark-name {
    font-size: 20px;
    font-weight: 800;
    letter-spacing: .02em;
    color: var(--text);
    line-height: 1;
}
.footer-wordmark-sub {
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .34em;
    color: var(--muted2);
    text-align: right;
    margin-right: -.34em;
    line-height: 1;
}

.footer-bottom {
    border-top: 1px solid var(--line);
    padding-top: 20px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
    font-size: 12px;
    color: var(--muted2);
}
.footer-copy {
    justify-self: start;
}
.footer-bottom .footer-socials {
    justify-self: center;
}
.footer-bottom .footer-wordmark {
    justify-self: end;
}
@media (max-width: 720px) {
    .footer-bottom {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 18px;
    }
    .footer-copy,
    .footer-bottom .footer-socials,
    .footer-bottom .footer-wordmark {
        justify-self: center;
    }
}

.footer-socials {
    display: flex;
    gap: 8px;
}
.footer-socials a {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--line);
    border-radius: var(--r3);
    color: var(--muted);
    transition: color .15s ease, background .15s ease, border-color .15s ease;
}
.footer-socials a:hover { color: var(--text); background: var(--bg2); border-color: var(--line2); }

.page {
    animation: pageIn .35s ease;
}
@keyframes pageIn {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

.placeholder-hero {
    padding: clamp(80px, 12vw, 140px) 0;
    text-align: center;
}
.placeholder-hero .eyebrow { margin-bottom: 18px; }
.placeholder-hero h1 { max-width: 18ch; margin-left: auto; margin-right: auto; }
.placeholder-hero .lead { margin: 0 auto 28px; }
.placeholder-hero .actions {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}

.lang-switcher { position: relative; }
.lang-btn {
    height: 36px;
    padding: 0 10px;
    border-radius: var(--r3);
    border: 1px solid var(--line);
    background: transparent;
    color: var(--text);
    font-size: 13px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: color .15s ease, background .15s ease, border-color .15s ease;
}
.lang-btn:hover {
    background: var(--bg2);
    border-color: var(--line2);
}
.lang-btn .fa-chevron-down { font-size: 9px; opacity: .6; transition: transform .2s ease; }
.lang-switcher.open .lang-btn .fa-chevron-down { transform: rotate(180deg); }

.flag {
    width: 20px;
    height: 14px;
    border-radius: 2px;
    overflow: hidden;
    flex-shrink: 0;
    box-shadow: 0 0 0 1px rgba(0,0,0,.08);
    position: relative;
}

.flag-pt {
    background: #009C3B;
    position: relative;
}
.flag-pt::before {
    
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(45deg,  #009C3B 26%, transparent 27%),
        linear-gradient(-45deg, #009C3B 26%, transparent 27%),
        linear-gradient(135deg, #009C3B 26%, transparent 27%),
        linear-gradient(-135deg,#009C3B 26%, transparent 27%),
        #FFDF00;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.flag-pt::after {
    
    content: "";
    position: absolute;
    top: 50%; left: 50%;
    width: 38%; height: 54%;
    transform: translate(-50%, -50%);
    background: #002776;
    border-radius: 50%;
}
.flag-en {
    background:
        linear-gradient(to bottom,
            #b22234 0 7.7%,  #fff   7.7% 15.4%, #b22234 15.4% 23.1%,
            #fff   23.1% 30.8%, #b22234 30.8% 38.5%, #fff   38.5% 46.2%,
            #b22234 46.2% 53.9%, #fff 53.9% 61.6%, #b22234 61.6% 69.3%,
            #fff   69.3% 77%,    #b22234 77% 84.7%,  #fff 84.7% 92.4%,
            #b22234 92.4% 100%);
    position: relative;
}
.flag-en::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 40%; height: 53.9%;
    background: #3c3b6e;
}
.flag-es {
    background: linear-gradient(to bottom,
        #aa151b 0 25%, #f1bf00 25% 75%, #aa151b 75% 100%);
}

.flag-it {
    background: linear-gradient(to right,
        #009246 0 33.34%, #ffffff 33.34% 66.67%, #ce2b37 66.67% 100%);
}

.flag-fr {
    background: linear-gradient(to right,
        #0055A4 0 33.34%, #ffffff 33.34% 66.67%, #EF4135 66.67% 100%);
}

.lang-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 180px;
    background: var(--card-solid);
    border: 1px solid var(--line2);
    border-radius: var(--r2);
    box-shadow: var(--shadow);
    padding: 6px;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-4px);
    transition: opacity .15s ease, transform .15s ease;
    z-index: 100;
}
.lang-switcher.open .lang-menu {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}
.lang-menu a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: var(--r3);
    font-size: 13px;
    font-weight: 600;
    color: var(--text);
    cursor: pointer;
}
.lang-menu a:hover  { background: rgba(91, 92, 226, .08); }
.lang-menu a.active { background: rgba(91, 92, 226, .12); color: var(--p); }

.nav-dropdown { position: relative; display: inline-flex; }

.nav-dropdown-btn {
    appearance: none;
    background: transparent;
    border: 0;
    cursor: pointer;
    padding: 8px 14px;
    border-radius: var(--r3);
    font-size: 14px;
    font-weight: 500;
    color: var(--muted);
    font-family: inherit;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: color .15s ease, background .15s ease;
}
.nav-dropdown-btn:hover,
.nav-dropdown.open .nav-dropdown-btn,
.nav-dropdown.active .nav-dropdown-btn {
    color: var(--text);
    background: var(--bg2);
}
.nav-dropdown-btn i {
    font-size: 10px;
    transition: transform .2s ease;
}
.nav-dropdown.open .nav-dropdown-btn i {
    transform: rotate(180deg);
}

.nav-dropdown-menu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 280px;
    background: var(--card-solid);
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 6px;
    box-shadow: var(--shadow2);
    opacity: 0;
    transform: translateY(-6px);
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease;
    z-index: 70;
}
.nav-dropdown.open .nav-dropdown-menu {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.nav-dropdown-menu a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 10px;
    color: var(--text);
    text-decoration: none;
    transition: background .15s ease;
}
.nav-dropdown-menu a:hover { background: rgba(91, 92, 226, .08); }
.nav-dropdown-menu a > i {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(91, 92, 226, .10);
    color: var(--p);
    border-radius: 8px;
    font-size: 14px;
    flex-shrink: 0;
}
.nav-dropdown-menu a > span {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.nav-dropdown-menu a > span b  { font-size: 13.5px; font-weight: 600; color: var(--text); }
.nav-dropdown-menu a > span em { font-size: 12px; font-style: normal; color: var(--muted); }

.nav-dropdown-overview {
    
    margin-bottom: 2px;
}
.nav-dropdown-overview > i {
    background: linear-gradient(135deg, rgba(91, 92, 226, .18), rgba(124, 58, 237, .14));
}

.nav-dropdown-sep {
    height: 1px;
    background: var(--line);
    margin: 4px 8px;
}

.cookie-banner {
    position: fixed;
    left: 18px;
    bottom: 18px;
    z-index: 9999;
    max-width: 460px;
    background: var(--card-solid);
    border: 1px solid var(--line2);
    border-radius: 16px;
    box-shadow: 0 16px 48px rgba(0,0,0,.28), 0 4px 12px rgba(0,0,0,.18);
    animation: cookie-slide-in .4s cubic-bezier(.4, 0, .2, 1);
}
@keyframes cookie-slide-in {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}
.cookie-banner.hiding { animation: cookie-slide-out .3s ease forwards; }
@keyframes cookie-slide-out {
    to { opacity: 0; transform: translateY(20px); }
}

.cookie-banner-inner {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    gap: 14px;
    padding: 18px 20px;
}
.cookie-icon {
    grid-row: 1;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(245, 158, 11, .12);
    color: #f59e0b;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
}
.cookie-text { grid-row: 1; min-width: 0; }
.cookie-text b {
    display: block;
    font-size: 14px;
    font-weight: 800;
    margin-bottom: 4px;
}
.cookie-text p {
    font-size: 12.5px;
    color: var(--muted);
    margin: 0;
    line-height: 1.5;
}
.cookie-text a {
    color: var(--p);
    font-weight: 700;
    text-decoration: underline;
}
.cookie-actions {
    grid-column: 1 / -1;
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}
.cookie-actions .btn { height: 34px; font-size: 12.5px; padding: 0 14px; }

@media (max-width: 540px) {
    .cookie-banner {
        left: 12px;
        right: 12px;
        bottom: 12px;
        max-width: none;
    }
}

@media (max-width: 860px) {
    .site-nav { display: none; }
    .nav-toggle { display: inline-flex; align-items: center; justify-content: center; }

    .site-actions { gap: 6px; }
    .site-actions > #themeToggle,
    .site-actions > .btn-primary { display: none; }

    body.nav-open .site-nav {
        display: flex;
        position: absolute;
        top: var(--header-h);
        left: 0;
        right: 0;
        background: var(--card-solid);
        border-bottom: 1px solid var(--line);
        padding: 16px 24px 18px;
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
        box-shadow: var(--shadow2);
    }
    body.nav-open .site-actions > #themeToggle,
    body.nav-open .site-actions > .btn-primary {
        display: inline-flex;
        position: fixed;
        z-index: 55;
        
        bottom: auto;
    }
    
    body.nav-open .site-actions > #themeToggle,
    body.nav-open .site-actions > .btn-primary {
        position: static;
    }
    body.nav-open .site-actions { gap: 6px; }

    .lang-menu { left: auto; right: 0; }

    .footer-grid { grid-template-columns: 1fr 1fr; }
    .footer-brand-block { grid-column: 1 / -1; max-width: none; }
}

@media (max-width: 520px) {
    .footer-grid { grid-template-columns: 1fr; }
    .footer-bottom { justify-content: center; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

.section-head-left {
    text-align: left;
    margin: 0 0 28px;
    max-width: 78ch;
}

.section-head-left h2 {
    letter-spacing: -.025em;
    line-height: 1.1;
    white-space: nowrap;
}
@media (max-width: 920px) {
    .section-head-left h2 {
        white-space: normal;
        text-wrap: balance;
    }
}
.section-head-left .lead {
    margin: 14px 0 0;
    text-wrap: pretty;
}
.section-head-left .eyebrow {
    margin-bottom: 14px;
}

.products-hero {
    padding: clamp(70px, 10vw, 130px) 0 clamp(40px, 6vw, 70px);
    text-align: center;
}
.products-hero .eyebrow { margin-bottom: 18px; }
.products-hero h1       { max-width: none; margin: 0 auto; }
.products-hero .lead    { margin: 18px auto 0; max-width: 65ch; }

.products-list {
    padding: 0 0 clamp(60px, 8vw, 100px);
}

.products-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.product-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 28px 26px 26px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 18px;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    text-decoration: none;
    transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
    position: relative;
    overflow: hidden;
}
.product-card:hover {
    border-color: rgba(91, 92, 226, .35);
    transform: translateY(-3px);
    box-shadow: var(--shadow3);
}
.product-card-icon {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(91, 92, 226, .18), rgba(124, 58, 237, .14));
    color: var(--p);
    border-radius: 12px;
    font-size: 20px;
    margin-bottom: 4px;
}
.product-card-meta {
    display: flex;
    align-items: center;
    gap: 8px;
}
.product-card-tag {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--muted2);
}
.product-card h3 {
    margin: 0;
    font-size: 22px;
    letter-spacing: -.015em;
    color: var(--text);
}
.product-card p {
    margin: 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.6;
}
.product-card-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}
.chip {
    font-size: 11px;
    font-weight: 600;
    color: var(--muted);
    background: var(--bg2);
    border: 1px solid var(--line);
    padding: 4px 10px;
    border-radius: 999px;
}
.product-card-link {
    margin-top: auto;
    padding-top: 10px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--p);
}
.product-card-link i { transition: transform .2s ease; font-size: 11px; }
.product-card:hover .product-card-link i { transform: translateX(3px); }

.products-cta { padding: 0 0 clamp(60px, 8vw, 100px); }

@media (max-width: 1000px) {
    .products-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 660px) {
    .products-grid { grid-template-columns: 1fr; }
}

.licensing-section {
    padding: clamp(30px, 4vw, 55px) 0 clamp(40px, 5vw, 70px);
}

.eth-checkout {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    gap: clamp(20px, 3vw, 40px);
    margin-top: 24px;
    align-items: start;
}
@media (max-width: 880px) {
    .eth-checkout { grid-template-columns: 1fr; }
}

.eth-checkout-heading {
    margin: 0 0 12px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--muted2);
}

.eth-checkout-right .license-summary {
    grid-template-columns: 1fr;
}

.eth-license-meta {
    margin-top: 28px;
    max-width: 720px;
}

.license-summary {
    list-style: none;
    padding: 18px 22px;
    margin: 0 0 16px;
    background: var(--bg2);
    border: 1px solid var(--line);
    border-radius: 14px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 24px;
}
@media (max-width: 600px) {
    .license-summary { grid-template-columns: 1fr; }
}
.license-summary li {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--text);
    font-size: 13.5px;
    font-weight: 500;
}
.license-summary li i {
    width: 18px;
    text-align: center;
    color: var(--p);
    font-size: 13px;
}

.license-docs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}
.license-doc-btn {
    appearance: none;
    background: transparent;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 7px 14px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--muted);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-family: inherit;
    transition: border-color .15s ease, color .15s ease, background .15s ease;
}
.license-doc-btn:hover {
    border-color: rgba(91, 92, 226, .45);
    color: var(--p);
    background: rgba(91, 92, 226, .06);
}
.license-doc-btn i { font-size: 11px; }

.payment-buttons {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}
@media (max-width: 720px) {
    .payment-buttons { grid-template-columns: 1fr; }
}
.payment-btn {
    appearance: none;
    border: 0;
    border-radius: 12px;
    padding: 14px 16px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-family: inherit;
    color: #fff;
    transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}
.payment-btn:hover { transform: translateY(-1px); box-shadow: var(--shadow3); }
.payment-btn:active { transform: translateY(0); }
.payment-btn i { font-size: 18px; }
.payment-stripe { background: linear-gradient(135deg, #635BFF, #5046E4); }
.payment-paypal { background: linear-gradient(135deg, #003087, #009CDE); }
.payment-ebanx  { background: linear-gradient(135deg, #00A887, #007D62); }

.license-inline-link {
    appearance: none;
    background: transparent;
    border: 0;
    padding: 0;
    color: var(--p);
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    font-size: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.license-inline-link:hover { color: var(--p2); }
.license-note {
    margin: 12px 0 0;
    font-size: 12.5px;
    color: var(--muted);
    line-height: 1.6;
}
.license-note a { color: var(--p); font-weight: 600; }

.license-note-strong {
    color: var(--text);
    font-size: 13px;
    font-weight: 500;
    padding: 12px 14px;
    background: rgba(91, 92, 226, .06);
    border-left: 3px solid var(--p);
    border-radius: 4px;
    margin-top: 14px;
}
.license-note-strong strong {
    color: var(--p);
    font-weight: 700;
}

.license-note-secondary {
    margin-top: 8px;
    font-size: 12px;
}

.tn-purpose {
    padding: clamp(50px, 7vw, 80px) 0;
    border-top: 1px solid var(--line);
}

.tn-purpose-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: clamp(32px, 5vw, 56px);
    align-items: start;
    margin-top: 22px;
}

.tn-purpose-prose p {
    margin: 0 0 16px;
    font-size: 15.5px;
    line-height: 1.75;
    color: var(--muted);
    text-wrap: pretty;
}
.tn-purpose-prose p:first-child {
    font-size: 17px;
    color: var(--text);
    line-height: 1.6;
    letter-spacing: -.005em;
}
.tn-purpose-prose p:last-child {
    margin-bottom: 0;
}

.tn-purpose-highlights {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.tn-hl {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 18px 20px;
    background: var(--bg2);
    border: 1px solid var(--line);
    border-radius: 12px;
    transition: border-color .25s ease, transform .25s ease;
}
.tn-hl:hover {
    border-color: var(--p);
    transform: translateY(-1px);
}

.tn-hl-icon {
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(91, 92, 226, .10);
    color: var(--p);
    border: 1px solid rgba(91, 92, 226, .30);
    font-size: 16px;
}

.tn-hl b {
    display: block;
    font-size: 14.5px;
    color: var(--text);
    margin-bottom: 4px;
    letter-spacing: -.005em;
    line-height: 1.3;
}
.tn-hl span {
    display: block;
    font-size: 13.5px;
    color: var(--muted);
    line-height: 1.55;
    text-wrap: pretty;
}

@media (max-width: 920px) {
    .tn-purpose-grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }
}

.eth-hero { padding: clamp(50px, 7vw, 90px) 0 clamp(30px, 4vw, 50px); }
.eth-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
    gap: clamp(36px, 6vw, 70px);
    align-items: center;
}
.eth-hero-text h1 {
    font-size: clamp(28px, 3.6vw, 44px);
    line-height: 1.1;
    letter-spacing: -.02em;
    margin: 16px 0 22px;
    color: var(--text);
    white-space: nowrap;
}
@media (max-width: 920px) {
    .eth-hero-text h1 {
        white-space: normal;
        text-wrap: balance;
        font-size: clamp(28px, 6vw, 44px);
    }
}
.eth-hero-text .lead {
    color: var(--muted);
    font-size: 16px;
    line-height: 1.7;
    max-width: 56ch;
    margin: 0 0 28px;
}
.eth-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; }

.eth-stack-visual {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}
.eth-stack-orbit {
    position: relative;
    width: 100%;
    max-width: 460px;
    aspect-ratio: 1 / 1;
    color: var(--p);
}

.eth-stack-lines {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.eth-core {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 138px;
    height: 138px;
    z-index: 4;
}
.eth-core-inner {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    background: var(--card-solid);
    border: 1.5px solid rgba(91, 92, 226, .45);
    border-radius: 50%;
    box-shadow: 0 0 0 6px rgba(91, 92, 226, .08),
                0 18px 48px rgba(91, 92, 226, .25);
    z-index: 2;
}
.eth-core-inner i {
    font-size: 30px;
    color: var(--p);
    margin-bottom: 6px;
}
.eth-core-inner strong {
    font-size: 17px;
    color: var(--text);
    font-weight: 800;
    letter-spacing: -.01em;
}
.eth-core-pulse {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid rgba(91, 92, 226, .4);
    animation: eth-pulse 2.6s ease-out infinite;
    z-index: 1;
}
@keyframes eth-pulse {
    0%   { transform: scale(1);    opacity: .8; }
    100% { transform: scale(1.55); opacity: 0; }
}

.eth-lang {
    position: absolute;
    transform: translate(-50%, -50%);
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 13px;
    background: var(--card-solid);
    border: 1px solid var(--line);
    border-radius: 999px;
    box-shadow: var(--shadow3);
    font-size: 12.5px;
    font-weight: 700;
    color: var(--text);
    z-index: 3;
    white-space: nowrap;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.eth-lang i {
    color: var(--p);
    font-size: 13px;
    flex-shrink: 0;
}
.eth-lang:hover {
    border-color: rgba(91, 92, 226, .45);
    box-shadow: 0 0 0 3px rgba(91, 92, 226, .08), var(--shadow3);
}
.eth-stack-caption {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--muted2);
    text-align: center;
}

@media (max-width: 920px) {
    .eth-hero-grid { grid-template-columns: 1fr; gap: 30px; }
    .eth-stack-orbit { max-width: 360px; }
    .eth-core { width: 110px; height: 110px; }
    .eth-core-inner i { font-size: 22px; }
    .eth-core-inner strong { font-size: 14px; }
    .eth-lang { font-size: 12px; padding: 6px 11px; }
}

.eth-compat { padding: clamp(30px, 4vw, 55px) 0; }
.eth-compat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-top: 28px;
}
@media (max-width: 920px) { .eth-compat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .eth-compat-grid { grid-template-columns: 1fr; } }

.eth-compat-card {
    padding: 22px 22px 20px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 14px;
    transition: border-color .2s ease, transform .2s ease;
}
.eth-compat-card:hover {
    border-color: rgba(91, 92, 226, .35);
    transform: translateY(-2px);
}
.eth-compat-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 12px;
    margin-bottom: 12px;
    border-bottom: 1px solid var(--line);
}
.eth-compat-head i {
    width: 32px; height: 32px;
    display: inline-flex;
    align-items: center; justify-content: center;
    background: rgba(91, 92, 226, .10);
    color: var(--p);
    border-radius: 8px;
    font-size: 14px;
}
.eth-compat-head h3 {
    margin: 0;
    font-size: 15px;
    color: var(--text);
    letter-spacing: -.01em;
}

.eth-spec {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
}
.eth-spec > div {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2px;
    padding: 5px 0;
}
.eth-spec dt {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--muted2);
}
.eth-spec dd {
    margin: 0;
    font-family: ui-monospace, "SF Mono", Menlo, monospace;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--text);
    line-height: 1.4;
}

.eth-modulemap { padding: clamp(30px, 4vw, 55px) 0; }
.eth-categories {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 32px;
}
@media (max-width: 980px) { .eth-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .eth-categories { grid-template-columns: 1fr; } }

.eth-category {
    padding: 22px 22px 20px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 16px;
    transition: border-color .2s ease, transform .2s ease;
}
.eth-category:hover {
    border-color: rgba(91, 92, 226, .35);
    transform: translateY(-2px);
}
.eth-cat-head {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    column-gap: 12px;
    padding-bottom: 14px;
    margin-bottom: 12px;
    border-bottom: 1px solid var(--line);
    align-items: center;
}
.eth-cat-head i {
    grid-row: 1 / 3;
    width: 36px; height: 36px;
    display: inline-flex;
    align-items: center; justify-content: center;
    background: rgba(91, 92, 226, .10);
    color: var(--p);
    border-radius: 10px;
    font-size: 16px;
}
.eth-cat-head h3 {
    margin: 0;
    font-size: 15px;
    color: var(--text);
    letter-spacing: -.01em;
}

.eth-cat-head h3 .eth-cat-role {
    font-size: 12px;
    font-weight: 500;
    color: var(--muted);
    letter-spacing: 0;
    text-transform: none;
    white-space: nowrap;
}
.eth-cat-head span {
    font-size: 11.5px;
    color: var(--muted);
    line-height: 1.3;
}

.eth-mods {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.eth-mod {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 8px 12px;
    background: var(--bg2);
    border: 1px solid transparent;
    border-radius: 8px;
    transition: border-color .15s ease;
}
.eth-mod:hover { border-color: rgba(91, 92, 226, .25); }
.eth-mod b {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--text);
}
.eth-mod em {
    font-style: normal;
    font-size: 11px;
    color: var(--muted);
    line-height: 1.4;
}
.eth-mod-future {
    opacity: .65;
    border: 1px dashed var(--line);
    background: transparent;
}
.eth-mod-future b::after {
    content: " · soon";
    font-weight: 500;
    color: var(--muted2);
    font-size: 10px;
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-left: 4px;
}

.eth-cat-future {
    position: relative;
    border-style: dashed;
    background: repeating-linear-gradient(
        135deg,
        transparent 0,
        transparent 14px,
        rgba(91, 92, 226, .03) 14px,
        rgba(91, 92, 226, .03) 28px
    );
    opacity: .82;
    overflow: hidden;
}

.eth-cat-banner {
    position: absolute;
    top: 14px;
    right: 16px;
    color: var(--muted2);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    z-index: 2;
}
.eth-cat-future:hover {
    opacity: 1;
    border-color: rgba(91, 92, 226, .35);
}
.eth-cat-future .eth-cat-head h3 {
    color: var(--muted);
}
.eth-cat-future .eth-mod-future {
    opacity: .9;
    border-style: solid;
    background: var(--bg2);
}
.eth-cat-future .eth-mod-future b::after { content: ""; }
.eth-cat-future .eth-mod-future b {
    color: var(--muted);
}
.eth-cat-soon {
    display: inline-block;
    margin-left: 8px;
    padding: 3px 9px;
    background: rgba(91, 92, 226, .12);
    border: 1px solid rgba(91, 92, 226, .35);
    border-radius: 999px;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--p);
    vertical-align: middle;
}

.eth-dist { padding: clamp(30px, 4vw, 55px) 0; }
.eth-dist-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 32px;
}
@media (max-width: 920px) { .eth-dist-grid { grid-template-columns: 1fr; } }

.eth-dist-card {
    padding: 26px 24px 24px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 16px;
    transition: border-color .2s ease, transform .2s ease;
}
.eth-dist-card:hover {
    border-color: rgba(91, 92, 226, .35);
    transform: translateY(-2px);
}
.eth-dist-tag {
    display: inline-block;
    padding: 4px 10px;
    background: rgba(91, 92, 226, .10);
    border: 1px solid rgba(91, 92, 226, .25);
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--p);
    margin-bottom: 12px;
}
.eth-dist-card h3 {
    margin: 0 0 10px;
    font-size: 18px;
    color: var(--text);
    letter-spacing: -.015em;
    line-height: 1.25;
    text-wrap: balance;
}
.eth-dist-card p {
    margin: 0 0 16px;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.65;
    text-wrap: pretty;
}
.eth-dist-card code {
    font-family: ui-monospace, "SF Mono", Menlo, monospace;
    font-size: 12px;
    background: var(--bg2);
    padding: 1px 6px;
    border-radius: 4px;
    color: var(--p);
}
.eth-dist-list {
    list-style: none;
    padding-top: 14px;
    margin: 0;
    border-top: 1px dashed var(--line);
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.eth-dist-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 12.5px;
    color: var(--text);
    line-height: 1.5;
}
.eth-dist-list li i {
    flex-shrink: 0;
    width: 14px;
    color: var(--p);
    font-size: 11px;
    padding-top: 4px;
}

.eth-tier-builder {
    display: flex;
    flex-direction: column;
    gap: 22px;
    margin: 28px 0 22px;
}
.eth-tier-group { display: flex; flex-direction: column; gap: 10px; }
.eth-tier-group-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--muted2);
}
.eth-tier-group-grid {
    display: grid;
    gap: 10px;
}
.eth-tier-group-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.eth-tier-group-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 720px) {
    .eth-tier-group-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 420px) {
    .eth-tier-group-grid-4 { grid-template-columns: 1fr; }
    .eth-tier-group-grid-2 { grid-template-columns: 1fr; }
}

.eth-tier-opt {
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    user-select: none;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 16px 14px;
    background: var(--card);
    border: 1.5px solid var(--line);
    border-radius: 12px;
    color: var(--text);
    font-family: inherit;
    transition: border-color .15s ease, background .15s ease, transform .15s ease, box-shadow .15s ease;
}
.eth-tier-opt:hover {
    border-color: rgba(91, 92, 226, .45);
    transform: translateY(-2px);
}
.eth-tier-opt.selected {
    border-color: var(--p);
    background: linear-gradient(135deg, var(--card), rgba(91, 92, 226, .10));
    box-shadow: 0 0 0 3px rgba(91, 92, 226, .15);
}
.eth-tier-opt-label {
    font-size: 13.5px;
    font-weight: 700;
}
.eth-tier-opt.selected .eth-tier-opt-label {
    color: var(--p);
}

.eth-tier-selected {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 22px;
    background: var(--bg2);
    border: 1px dashed var(--line);
    border-radius: 12px;
    margin-bottom: 14px;
    transition: border-color .25s ease, background .25s ease;
}
.eth-tier-selected.active {
    border-style: solid;
    border-color: rgba(91, 92, 226, .35);
    background: linear-gradient(135deg, var(--bg2), rgba(91, 92, 226, .05));
}
.eth-tier-selected-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.eth-tier-selected-label {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--muted2);
}
.eth-tier-selected-name {
    font-size: 14px;
    color: var(--text);
    font-weight: 600;
}
.eth-tier-selected-price {
    font-size: 22px;
    font-weight: 800;
    color: var(--p);
    letter-spacing: -.01em;
    font-variant-numeric: tabular-nums;
}

.payment-btn[disabled] {
    opacity: .45;
    cursor: not-allowed;
    transform: none !important;
    pointer-events: none;
}

.page-praetor {
    --prt-accent:        var(--p);
    --prt-accent-2:      var(--p2);
    --prt-accent-soft:   rgba(91, 92, 226, .12);
    --prt-accent-line:   rgba(91, 92, 226, .35);
    --prt-warden:        var(--p);
    --prt-warden-soft:   rgba(91, 92, 226, .10);
    --prt-warden-line:   rgba(91, 92, 226, .35);
}

.prt-hero {
    padding: clamp(60px, 9vw, 110px) 0 clamp(40px, 6vw, 70px);
}
.prt-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    gap: clamp(36px, 6vw, 70px);
    align-items: center;
}
.prt-hero-text h1 {
    font-size: clamp(28px, 3.6vw, 44px);
    line-height: 1.1;
    letter-spacing: -.02em;
    margin: 16px 0 22px;
    color: var(--text);
    white-space: nowrap;
}
@media (max-width: 920px) {
    .prt-hero-text h1 {
        white-space: normal;
        text-wrap: balance;
        font-size: clamp(28px, 6vw, 42px);
    }
}
.prt-hero-text .lead {
    color: var(--muted);
    font-size: 16px;
    line-height: 1.7;
    max-width: 60ch;
    margin: 0 0 28px;
    text-wrap: pretty;
}
.prt-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.prt-hero-caption {
    margin-top: 22px;
    font-size: 12px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--muted2);
    font-weight: 600;
}

.prt-hero-visual {
    display: flex;
    align-items: center;
    justify-content: center;
}
.prt-dataflow {
    width: 100%;
    max-width: 420px;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 28px;
    background: linear-gradient(180deg, var(--bg2), var(--bg));
    border: 1px solid var(--line);
    border-radius: 18px;
    box-shadow: 0 20px 50px -25px rgba(0, 0, 0, .25);
    position: relative;
    overflow: hidden;
}

.prt-dataflow::before {
    content: "";
    position: absolute;
    inset: -50%;
    background: conic-gradient(
        from 0deg,
        transparent 0deg,
        var(--prt-accent-soft) 45deg,
        transparent 90deg,
        transparent 180deg,
        var(--prt-warden-soft) 225deg,
        transparent 270deg
    );
    animation: prt-bg-rotate 18s linear infinite;
    opacity: .4;
    z-index: 0;
}
@keyframes prt-bg-rotate {
    to { transform: rotate(360deg); }
}
.prt-df-node {
    position: relative;
    z-index: 1;
    padding: 16px 18px;
    border-radius: 12px;
    background: var(--bg);
    border: 1px solid var(--line);
    display: flex;
    align-items: center;
    gap: 14px;
}
.prt-df-game {
    border-color: var(--prt-accent-line);
}
.prt-df-praetor {
    border-color: var(--prt-warden-line);
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
}
.prt-df-node > i {
    width: 42px; height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    font-size: 18px;
    flex-shrink: 0;
}
.prt-df-game > i {
    background: var(--prt-accent-soft);
    color: var(--prt-accent);
    border: 1px solid var(--prt-accent-line);
}
.prt-df-praetor > i {
    background: var(--prt-warden-soft);
    color: var(--prt-warden);
    border: 1px solid var(--prt-warden-line);
    align-self: flex-start;
}
.prt-df-node-info b {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: var(--text);
    line-height: 1.2;
}
.prt-df-node-info em {
    display: block;
    margin-top: 3px;
    font-style: normal;
    font-size: 11px;
    color: var(--muted2);
    letter-spacing: .04em;
}
.prt-df-praetor .prt-df-node-info {
    
    display: flex;
    flex-direction: column;
}
.prt-df-praetor > i {
    position: absolute;
    top: 16px;
    left: 18px;
}
.prt-df-praetor .prt-df-node-info {
    margin-left: 56px;
}

.prt-df-pipe {
    position: relative;
    z-index: 1;
    height: 110px;
    margin: 4px 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
}
.prt-df-rail {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
}
.prt-df-rail-up {
    background: linear-gradient(180deg, transparent, var(--prt-accent-soft));
    border-left: 1px dashed var(--prt-accent-line);
}
.prt-df-rail-down {
    background: linear-gradient(180deg, var(--prt-warden-soft), transparent);
    border-right: 1px dashed var(--prt-warden-line);
}
.prt-df-rail-label {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--muted2);
    white-space: nowrap;
    pointer-events: none;
    z-index: 2;
}
.prt-df-rail-up .prt-df-rail-label  { color: var(--prt-accent); }
.prt-df-rail-down .prt-df-rail-label { color: var(--prt-warden); }

.prt-df-pulse {
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    left: 50%;
    margin-left: -4px;
    opacity: 0;
}
.prt-df-pulse-up {
    background: var(--prt-accent);
    box-shadow: 0 0 10px var(--prt-accent);
    animation: prt-pulse-up 3s ease-in-out infinite;
}
.prt-df-pulse-down {
    background: var(--prt-warden);
    box-shadow: 0 0 10px var(--prt-warden);
    animation: prt-pulse-down 3.6s ease-in-out infinite;
}
.prt-df-pulse-up.p1  { animation-delay: 0s; }
.prt-df-pulse-up.p2  { animation-delay: 1s; }
.prt-df-pulse-up.p3  { animation-delay: 2s; }
.prt-df-pulse-down.d1 { animation-delay: .8s; }
.prt-df-pulse-down.d2 { animation-delay: 2.4s; }

@keyframes prt-pulse-up {
    0%   { top: 100%; opacity: 0; }
    20%  { opacity: 1; }
    80%  { opacity: 1; }
    100% { top: -10%; opacity: 0; }
}
@keyframes prt-pulse-down {
    0%   { top: -10%; opacity: 0; }
    20%  { opacity: 1; }
    80%  { opacity: 1; }
    100% { top: 100%; opacity: 0; }
}

.prt-df-modules {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
    padding-top: 12px;
    border-top: 1px dashed var(--line);
}
.prt-df-mod {
    aspect-ratio: 1 / 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: var(--bg2);
    border: 1px solid var(--line);
    color: var(--muted2);
    font-size: 11px;
    transition: all .3s ease;
    animation: prt-mod-glow 4s ease-in-out infinite;
}
.prt-df-mod:nth-child(1) { animation-delay: 0s; }
.prt-df-mod:nth-child(2) { animation-delay: .5s; }
.prt-df-mod:nth-child(3) { animation-delay: 1s; }
.prt-df-mod:nth-child(4) { animation-delay: 1.5s; }
.prt-df-mod:nth-child(5) { animation-delay: 2s; }
.prt-df-mod:nth-child(6) { animation-delay: 2.5s; }
.prt-df-mod:nth-child(7) { animation-delay: 3s; }
.prt-df-mod:nth-child(8) { animation-delay: 3.5s; }
@keyframes prt-mod-glow {
    0%, 80%, 100% {
        background: var(--bg2);
        color: var(--muted2);
        border-color: var(--line);
    }
    40% {
        background: var(--prt-accent-soft);
        color: var(--prt-accent);
        border-color: var(--prt-accent-line);
        box-shadow: 0 0 12px var(--prt-accent-soft);
    }
}

@media (prefers-reduced-motion: reduce) {
    .prt-dataflow::before,
    .prt-df-pulse,
    .prt-df-mod { animation: none; }
    .prt-df-pulse { display: none; }
}

.prt-stats {
    padding: clamp(20px, 3vw, 40px) 0;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: var(--bg2);
}
.prt-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: clamp(16px, 3vw, 40px);
    text-align: center;
}
.prt-stat-value {
    font-size: clamp(28px, 4vw, 42px);
    font-weight: 800;
    color: var(--prt-accent);
    line-height: 1;
    letter-spacing: -.02em;
}
.prt-stat-label {
    margin-top: 8px;
    font-size: 12px;
    color: var(--muted2);
    letter-spacing: .04em;
    text-wrap: balance;
}

.prt-why {
    padding: clamp(40px, 6vw, 70px) 0;
}
.prt-why-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 22px;
    margin-top: 12px;
}
.prt-why-card {
    padding: 28px;
    border-radius: var(--r);
    background: var(--bg2);
    border: 1px solid var(--line);
}
.prt-why-them {
    border-color: rgba(232, 93, 74, .25);
    background: linear-gradient(180deg, rgba(232, 93, 74, .04), var(--bg2));
}
.prt-why-us {
    border-color: var(--prt-accent-line);
    background: linear-gradient(180deg, rgba(91, 92, 226, .04), var(--bg2));
}
.prt-why-card-tag {
    display: inline-block;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 999px;
    margin-bottom: 14px;
}
.prt-why-them .prt-why-card-tag {
    background: rgba(232, 93, 74, .12);
    color: #c8513f;
    border: 1px solid rgba(232, 93, 74, .35);
}
.prt-why-us .prt-why-card-tag {
    background: var(--prt-accent-soft);
    color: var(--prt-accent);
    border: 1px solid var(--prt-accent-line);
}
.prt-why-card-head h3 {
    margin: 0 0 14px;
    font-size: 19px;
    color: var(--text);
    letter-spacing: -.015em;
    line-height: 1.3;
    text-wrap: balance;
}
.prt-why-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.prt-why-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13.5px;
    color: var(--text);
    line-height: 1.55;
}
.prt-why-list li i {
    flex-shrink: 0;
    width: 14px;
    font-size: 11px;
    padding-top: 4px;
}
.prt-why-them .prt-why-list li i { color: #c8513f; }
.prt-why-us .prt-why-list li i { color: var(--prt-accent); }

.prt-platform {
    padding: clamp(40px, 6vw, 70px) 0;
}
.prt-mods-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 12px;
}
@media (max-width: 1300px) {
    .prt-mods-grid { grid-template-columns: repeat(3, 1fr); }
}
.prt-mod-card {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 26px 24px;
    border-radius: var(--r);
    background: var(--bg2);
    border: 1px solid var(--line);
    text-decoration: none;
    color: inherit;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.prt-mod-card:hover {
    transform: translateY(-3px);
    border-color: var(--prt-accent-line);
    box-shadow: 0 16px 40px -20px rgba(91, 92, 226, .25);
}
.prt-mod-card-num {
    position: absolute;
    top: 18px;
    right: 22px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .14em;
    color: var(--muted2);
    font-family: ui-monospace, "SF Mono", Menlo, monospace;
}

.prt-mod-gamelink   { --prt-mod: #06b6d4; --prt-mod-soft: rgba(124, 58, 237, .12);  --prt-mod-line: rgba(124, 58, 237, .35); }
.prt-mod-warden     { --prt-mod: #5b5ce2; --prt-mod-soft: rgba(91, 92, 226, .12);  --prt-mod-line: rgba(91, 92, 226, .35); }
.prt-mod-fairmatch  { --prt-mod: #14b8a6; --prt-mod-soft: rgba(20, 184, 166, .12); --prt-mod-line: rgba(20, 184, 166, .35); }
.prt-mod-watchtower { --prt-mod: #f59e0b; --prt-mod-soft: rgba(245, 158, 11, .12); --prt-mod-line: rgba(245, 158, 11, .35); }
.prt-mod-playerhub  { --prt-mod: #3b82f6; --prt-mod-soft: rgba(59, 130, 246, .12); --prt-mod-line: rgba(59, 130, 246, .35); }
.prt-mod-datastream { --prt-mod: #ec4899; --prt-mod-soft: rgba(236, 72, 153, .12); --prt-mod-line: rgba(236, 72, 153, .35); }
.prt-mod-persona    { --prt-mod: #a855f7; --prt-mod-soft: rgba(168, 85, 247, .12); --prt-mod-line: rgba(168, 85, 247, .35); }
.prt-mod-hindsight  { --prt-mod: #ef4444; --prt-mod-soft: rgba(239, 68, 68, .12);  --prt-mod-line: rgba(239, 68, 68, .35); }

.prt-mod-card-icon {
    width: 52px; height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: var(--prt-mod-soft, var(--prt-accent-soft));
    color: var(--prt-mod, var(--prt-accent));
    border: 1px solid var(--prt-mod-line, var(--prt-accent-line));
    margin-bottom: 16px;
    transition: transform .25s ease, box-shadow .25s ease;
}

.prt-mod-card-icon .prt-icon {
    width: 32px;
    height: 32px;
}
.prt-mod-card:hover .prt-mod-card-icon {
    transform: scale(1.06);
    box-shadow: 0 8px 22px -10px var(--prt-mod-line, var(--prt-accent-line));
}

.prt-mod-card:hover {
    border-color: var(--prt-mod-line, var(--prt-accent-line)) !important;
    box-shadow: 0 16px 40px -20px var(--prt-mod-line, var(--prt-accent-line)) !important;
}
.prt-mod-card-cta {
    color: var(--prt-mod, var(--prt-accent)) !important;
}
.prt-mod-card-role {
    color: var(--prt-mod, var(--muted2));
    opacity: .85;
}

.prt-df-mod .prt-icon-sm {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
}
.prt-df-mod-warden .prt-icon-sm {
    
    fill: currentColor;
    stroke: none;
}
.prt-df-mod-gamelink   { color: #06b6d4 !important; }
.prt-df-mod-warden     { color: #5b5ce2 !important; }
.prt-df-mod-fairmatch  { color: #14b8a6 !important; }
.prt-df-mod-watchtower { color: #f59e0b !important; }
.prt-df-mod-playerhub  { color: #3b82f6 !important; }
.prt-df-mod-datastream { color: #ec4899 !important; }
.prt-df-mod-persona    { color: #a855f7 !important; }
.prt-df-mod-hindsight  { color: #ef4444 !important; }
.prt-mod-card h3 {
    margin: 0 0 4px;
    font-size: 22px;
    color: var(--text);
    letter-spacing: -.015em;
}
.prt-mod-card-role {
    display: block;
    font-size: 11px;
    color: var(--muted2);
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-bottom: 12px;
}
.prt-mod-card p {
    margin: 0 0 18px;
    color: var(--muted);
    font-size: 13.5px;
    line-height: 1.6;
    flex-grow: 1;
    text-wrap: pretty;
}
.prt-mod-card-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--prt-accent);
}
.prt-mod-card-cta i {
    transition: transform .25s ease;
}
.prt-mod-card:hover .prt-mod-card-cta i {
    transform: translateY(2px);
}

.prt-mod-free {
    border-color: var(--prt-accent);
    background: linear-gradient(180deg, var(--prt-accent-soft), var(--bg2));
}
.prt-mod-card-flag {
    position: absolute;
    top: -10px;
    left: 22px;
    background: var(--prt-accent);
    color: #fff;
    padding: 4px 12px;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    border-radius: 999px;
    box-shadow: 0 4px 12px rgba(91, 92, 226, .35);
}

.prt-deepdives { padding: 0; }
.prt-mod-section {
    padding: clamp(50px, 7vw, 80px) 0;
    border-top: 1px solid var(--line);
}
.prt-mod-section:nth-child(even) {
    background: var(--bg2);
}
.prt-mod-section-free {
    background: linear-gradient(180deg, var(--prt-accent-soft), var(--bg2)) !important;
    border-top-color: var(--prt-accent-line);
}
.prt-mod-section-head {
    margin-bottom: 32px;
}
.prt-mod-section-num {
    display: inline-block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--prt-accent);
    margin-bottom: 12px;
    font-family: ui-monospace, "SF Mono", Menlo, monospace;
}
.prt-mod-section-head h2 {
    margin: 0 0 14px;
    font-size: clamp(28px, 4vw, 44px);
    letter-spacing: -.025em;
    line-height: 1.05;
    color: var(--text);
}
.prt-mod-section-lead {
    color: var(--muted);
    font-size: 16px;
    line-height: 1.7;
    max-width: 72ch;
    text-wrap: pretty;
    margin: 0;
}

.prt-mod-cols-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 22px;
    margin-bottom: 24px;
}
.prt-mod-cols-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-bottom: 24px;
}
.prt-mod-cols-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 18px;
}
.prt-mod-section h4 {
    margin: 0 0 12px;
    font-size: 13px;
    color: var(--muted);
    letter-spacing: .14em;
    text-transform: uppercase;
    font-weight: 700;
}
.prt-mod-subhead {
    margin: 32px 0 14px !important;
}

.prt-mod-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 9px;
}
.prt-mod-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13.5px;
    color: var(--text);
    line-height: 1.55;
}
.prt-mod-list li i {
    flex-shrink: 0;
    width: 14px;
    font-size: 11px;
    padding-top: 4px;
    color: var(--prt-accent);
}
.prt-mod-list-compact {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.prt-mod-list-compact li {
    font-size: 13px;
    color: var(--text);
    line-height: 1.5;
    padding-left: 16px;
    position: relative;
}
.prt-mod-list-compact li::before {
    content: "•";
    position: absolute;
    left: 4px;
    color: var(--prt-accent);
    font-weight: 800;
}

.prt-mod-callout {
    margin-top: 24px;
    padding: 20px 22px;
    background: var(--bg);
    border: 1px solid var(--prt-accent-line);
    border-left: 3px solid var(--prt-accent);
    border-radius: 10px;
    display: flex;
    align-items: flex-start;
    gap: 14px;
}
.prt-mod-callout > i {
    flex-shrink: 0;
    width: 36px; height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--prt-accent-soft);
    color: var(--prt-accent);
    border-radius: 8px;
    font-size: 16px;
}
.prt-mod-callout b {
    display: block;
    font-size: 14px;
    color: var(--text);
    margin-bottom: 4px;
}
.prt-mod-callout span {
    display: block;
    font-size: 13.5px;
    color: var(--muted);
    line-height: 1.6;
}

.prt-warden-modes-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 24px;
}
.prt-warden-mode-card {
    padding: 16px 14px;
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: 10px;
}
.prt-warden-mode-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}
.prt-warden-mode-head b {
    font-size: 13px;
    color: var(--text);
}
.prt-warden-mode-card p {
    margin: 0;
    font-size: 12px;
    color: var(--muted);
    line-height: 1.5;
}
.prt-mode-badge {
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding: 2px 7px;
    border-radius: 999px;
}
.prt-mode-core {
    background: var(--prt-warden-soft);
    color: var(--prt-warden);
    border: 1px solid var(--prt-warden-line);
}
.prt-mode-addon {
    background: var(--prt-accent-soft);
    color: var(--prt-accent);
    border: 1px solid var(--prt-accent-line);
}

.prt-coverage-card {
    padding: 18px 18px 20px;
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: 10px;
}
.prt-coverage-card h5 {
    margin: 0 0 12px;
    font-size: 13px;
    color: var(--prt-accent);
    letter-spacing: .04em;
}

.prt-feature-block {
    padding: 22px;
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: 10px;
}
.prt-feature-block h4 {
    margin: 0 0 10px !important;
    font-size: 15px !important;
    color: var(--text) !important;
    letter-spacing: -.005em !important;
    text-transform: none !important;
}
.prt-feature-block p {
    margin: 0;
    font-size: 13.5px;
    color: var(--muted);
    line-height: 1.65;
    text-wrap: pretty;
}
.prt-feature-roadmap {
    border-style: dashed;
    background: transparent;
    position: relative;
}
.prt-tag-roadmap {
    display: inline-block;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 999px;
    background: var(--bg);
    color: var(--muted2);
    border: 1px solid var(--line);
    margin-bottom: 8px;
}

.prt-events-card {
    padding: 16px;
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.prt-events-card b {
    font-size: 12px;
    color: var(--prt-accent);
    letter-spacing: .04em;
    margin-bottom: 4px;
}
.prt-events-card code {
    font-family: ui-monospace, "SF Mono", Menlo, monospace;
    font-size: 11.5px;
    background: var(--bg2);
    color: var(--text);
    padding: 4px 8px;
    border-radius: 4px;
    border: 1px solid var(--line);
}
.prt-mod-note {
    font-size: 12.5px;
    color: var(--muted2);
    font-style: italic;
    margin: 0 0 24px;
    text-wrap: pretty;
}

.prt-integrations {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 12px;
}
.prt-integration {
    padding: 14px 8px;
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: 10px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    transition: border-color .25s ease, color .25s ease;
}
.prt-integration:hover {
    border-color: var(--prt-accent-line);
    color: var(--prt-accent);
}
.prt-integration i {
    font-size: 18px;
    color: var(--muted);
}
.prt-integration:hover i { color: var(--prt-accent); }
.prt-integration span {
    font-size: 11px;
    color: var(--text);
    letter-spacing: .02em;
}

.prt-tag-free {
    display: inline-block;
    margin-left: 10px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--prt-accent);
    color: #fff;
    vertical-align: middle;
}

.prt-pricing {
    padding: clamp(50px, 7vw, 80px) 0;
}
.prt-pricing-subhead {
    margin: 32px 0 8px !important;
    font-size: 16px !important;
    color: var(--text) !important;
    letter-spacing: -.005em !important;
    text-transform: none !important;
    font-weight: 700 !important;
}
.prt-pricing-note {
    margin: 0 0 18px;
    font-size: 13.5px;
    color: var(--muted);
    line-height: 1.6;
    max-width: 72ch;
    text-wrap: pretty;
}

.prt-pricing-table-wrap {
    overflow-x: auto;
    border-radius: var(--r);
    border: 1px solid var(--line);
    background: var(--bg2);
}
.prt-pricing-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}
.prt-pricing-table th,
.prt-pricing-table td {
    padding: 14px 18px;
    text-align: left;
    border-bottom: 1px solid var(--line);
}
.prt-pricing-table thead th {
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--muted2);
    background: var(--bg);
    font-weight: 700;
}
.prt-pricing-table tbody tr:last-child td { border-bottom: none; }
.prt-pricing-table tbody tr {
    transition: background .2s ease;
}
.prt-pricing-table tbody tr:hover {
    background: var(--bg);
}
.prt-pricing-table b {
    color: var(--text);
    font-weight: 700;
}
.prt-tier-row-flag {
    display: inline-block;
    margin-left: 8px;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--bg);
    color: var(--muted2);
    border: 1px solid var(--line);
    vertical-align: middle;
}
.prt-tier-row-flag-popular {
    background: var(--prt-accent);
    color: #fff;
    border-color: var(--prt-accent);
}
.prt-tier-row-soft b { color: var(--prt-accent); }
.prt-tier-row-featured {
    background: var(--prt-accent-soft) !important;
}
.prt-tier-row-enterprise b { color: var(--prt-warden); }
.prt-price {
    font-weight: 700;
    color: var(--text);
}
.prt-price-brl {
    color: var(--muted);
    font-size: 13px;
}
.prt-price-add {
    color: var(--prt-accent);
    font-weight: 700;
}
.prt-contact-link {
    color: var(--prt-warden);
    font-weight: 700;
    text-decoration: none;
    border-bottom: 1px dashed var(--prt-warden);
    padding-bottom: 1px;
}
.prt-contact-link:hover {
    border-bottom-style: solid;
}

.prt-pricing-table-addons tbody tr td:first-child {
    color: var(--text);
}

.prt-bundles-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin: 14px 0 28px;
}
.prt-bundle {
    padding: 18px 22px;
    background: var(--bg2);
    border: 1px solid var(--line);
    border-radius: 12px;
    display: flex;
    align-items: flex-start;
    gap: 14px;
}
.prt-bundle-wide {
    grid-column: 1 / -1;
}
.prt-bundle-icon {
    flex-shrink: 0;
    width: 40px; height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--prt-accent-soft);
    color: var(--prt-accent);
    border: 1px solid var(--prt-accent-line);
    border-radius: 10px;
    font-size: 16px;
}
.prt-bundle b {
    display: block;
    font-size: 14px;
    color: var(--text);
    margin-bottom: 4px;
}
.prt-bundle span {
    display: block;
    font-size: 13px;
    color: var(--muted);
    line-height: 1.6;
    text-wrap: pretty;
}

.prt-promise {
    margin: 28px 0 36px;
    padding: 24px 28px;
    background: linear-gradient(135deg, var(--prt-warden-soft), var(--prt-accent-soft));
    border: 1px solid var(--prt-warden-line);
    border-left: 3px solid var(--prt-warden);
    border-radius: 12px;
    display: flex;
    align-items: flex-start;
    gap: 16px;
}
.prt-promise-icon {
    flex-shrink: 0;
    width: 44px; height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--bg);
    color: var(--prt-warden);
    border: 1px solid var(--prt-warden-line);
    border-radius: 10px;
    font-size: 18px;
}
.prt-promise b {
    display: block;
    font-size: 16px;
    color: var(--text);
    margin-bottom: 8px;
    letter-spacing: -.01em;
}
.prt-promise span {
    display: block;
    font-size: 14px;
    color: var(--muted);
    line-height: 1.7;
    text-wrap: pretty;
}

.prt-cap-explainer {
    margin: 14px 0 36px;
    padding: 22px 26px;
    background: var(--bg2);
    border: 1px solid var(--line);
    border-radius: 12px;
}
.prt-cap-explainer h4 {
    margin: 0 0 12px !important;
    font-size: 14px !important;
    color: var(--text) !important;
    letter-spacing: -.005em !important;
    text-transform: none !important;
    font-weight: 700 !important;
}

.prt-pricing-anchor {
    margin-top: 28px;
    padding: 24px 28px;
    background: linear-gradient(135deg, var(--prt-warden-soft), var(--prt-accent-soft));
    border: 1px solid var(--prt-warden-line);
    border-radius: 12px;
    display: flex;
    align-items: flex-start;
    gap: 16px;
}
.prt-pricing-anchor-icon {
    flex-shrink: 0;
    width: 40px; height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: var(--prt-warden);
    border-radius: 10px;
    font-size: 18px;
}
.prt-pricing-anchor b {
    display: block;
    font-size: 15px;
    color: var(--text);
    margin-bottom: 6px;
    letter-spacing: -.005em;
}
.prt-pricing-anchor span {
    display: block;
    font-size: 13.5px;
    color: var(--muted);
    line-height: 1.65;
    text-wrap: pretty;
}

.prt-faq {
    padding: clamp(40px, 6vw, 70px) 0 clamp(60px, 8vw, 100px);
}
.prt-faq-list {
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.prt-faq-item {
    background: var(--bg2);
    border: 1px solid var(--line);
    border-radius: 12px;
    transition: border-color .25s ease;
}
.prt-faq-item[open] {
    border-color: var(--prt-accent-line);
    background: var(--bg);
}
.prt-faq-item summary {
    padding: 18px 22px;
    cursor: pointer;
    font-size: 15px;
    font-weight: 600;
    color: var(--text);
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    transition: color .2s ease;
}
.prt-faq-item summary::-webkit-details-marker { display: none; }
.prt-faq-item summary::marker { content: ""; }
.prt-faq-item summary:hover {
    color: var(--prt-accent);
}
.prt-faq-item summary > i {
    flex-shrink: 0;
    color: var(--muted2);
    font-size: 12px;
    transition: transform .25s ease;
}
.prt-faq-item[open] summary > i {
    transform: rotate(180deg);
    color: var(--prt-accent);
}
.prt-faq-item p {
    margin: 0;
    padding: 0 22px 22px;
    font-size: 14px;
    color: var(--muted);
    line-height: 1.7;
    text-wrap: pretty;
}

@media (max-width: 1100px) {
    .prt-mods-grid       { grid-template-columns: repeat(2, 1fr); }
    .prt-warden-modes-grid { grid-template-columns: repeat(3, 1fr); }
    .prt-mod-cols-4      { grid-template-columns: repeat(2, 1fr); }
    .prt-integrations    { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 920px) {
    .prt-hero-grid       { grid-template-columns: 1fr; gap: 30px; }
    .prt-hero-visual     { order: -1; }
    .prt-stats-grid      { grid-template-columns: repeat(2, 1fr); }
    .prt-why-grid        { grid-template-columns: 1fr; }
    .prt-mod-cols-2      { grid-template-columns: 1fr; }
    .prt-mod-cols-3      { grid-template-columns: 1fr; }
    .prt-bundles-grid    { grid-template-columns: 1fr; }
    .prt-warden-modes-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 620px) {
    .prt-mods-grid       { grid-template-columns: 1fr; }
    .prt-warden-modes-grid { grid-template-columns: 1fr; }
    .prt-mod-cols-4      { grid-template-columns: 1fr; }
    .prt-integrations    { grid-template-columns: repeat(2, 1fr); }
}

.about-page { position: relative; }

.about-mark { position: relative; }

.about-rail {
    position: absolute;
    top: 0;
    height: 0;
    left: 50%;
    width: 2px;
    transform: translateX(-50%);
    pointer-events: none;
    z-index: 0;
    background: linear-gradient(to bottom,
        transparent 0%,
        rgba(91, 92, 226, .08) 6%,
        rgba(91, 92, 226, .08) 94%,
        transparent 100%);
}
.about-rail-fill {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transform-origin: top center;
    transform: scaleY(0);
    background: linear-gradient(to bottom,
        transparent 0%,
        var(--p) 6%,
        var(--p2) 50%,
        var(--p) 94%,
        transparent 100%);
    box-shadow: 0 0 12px rgba(91, 92, 226, .4);
    will-change: transform;
}

.about-mark > .container { position: relative; z-index: 1; }

[data-reveal] {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s cubic-bezier(.4, 0, .2, 1),
                transform .7s cubic-bezier(.4, 0, .2, 1);
}
[data-reveal].in-view {
    opacity: 1;
    transform: translateY(0);
}

.about-principles .principle {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .55s cubic-bezier(.4, 0, .2, 1),
                transform .55s cubic-bezier(.4, 0, .2, 1);
}
.about-principles.in-view .principle {
    opacity: 1;
    transform: translateY(0);
}
.about-principles.in-view .principle:nth-child(1) { transition-delay: .05s; }
.about-principles.in-view .principle:nth-child(2) { transition-delay: .12s; }
.about-principles.in-view .principle:nth-child(3) { transition-delay: .19s; }
.about-principles.in-view .principle:nth-child(4) { transition-delay: .26s; }
.about-principles.in-view .principle:nth-child(5) { transition-delay: .33s; }
.about-principles.in-view .principle:nth-child(6) { transition-delay: .40s; }

.about-hero,
.about-studio-intro {
    text-align: center;
}
.about-hero {
    padding: clamp(70px, 10vw, 130px) 0 clamp(40px, 6vw, 70px);
}
.about-studio-intro {
    margin: 0 auto clamp(40px, 6vw, 60px);
    max-width: 760px;
}
.about-hero .eyebrow,
.about-studio-intro .eyebrow { margin-bottom: 18px; }
.about-hero h1,
.about-studio-intro h1 {
    max-width: 38ch;
    margin-left: auto;
    margin-right: auto;
    white-space: nowrap;
}
@media (max-width: 920px) {
    .about-hero h1,
    .about-studio-intro h1 {
        white-space: normal;
        text-wrap: balance;
        max-width: 30ch;
    }
}
.about-hero .lead,
.about-studio-intro .lead {
    margin: 18px auto 0;
    max-width: 65ch;
    text-wrap: pretty;
}

.about-intro-divider {
    width: 100%;
    max-width: 90px;
    height: 1px;
    background: linear-gradient(to right, transparent, var(--line2), transparent);
    margin: clamp(36px, 5vw, 60px) auto;
}

.about-mark {
    padding: clamp(70px, 10vw, 130px) 0 clamp(30px, 4vw, 50px);
}
.about-mark-intro {
    text-align: center;
    margin: 0 auto clamp(40px, 6vw, 70px);
    max-width: 720px;
}
.about-mark-intro .eyebrow { margin-bottom: 16px; }
.about-mark-intro h2 { letter-spacing: -.02em; }
.about-mark-intro .lead { margin: 12px auto 0; max-width: 60ch; }

.about-mark-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
    gap: clamp(40px, 6vw, 80px);
    align-items: start;
}

.about-mark-figure {
    position: sticky;
    top: calc(var(--header-h) + 10px);
    align-self: start;
}

.about-mark-stage {
    position: relative;
    aspect-ratio: 1 / 1;
    max-width: 700px;
    margin-top: -40px;
    margin-bottom: 0;
    margin-left: 40px;
    margin-right: -40px;
    padding: clamp(20px, 3vw, 32px);
    overflow: visible;
    transition: filter .6s ease, transform .8s cubic-bezier(.4, 0, .2, 1);
    transform: translateY(0);
}
.about-mark-stage[data-active="foot"] {
    transform: translateY(10%);
}
.about-mark-stage::before {
    content: "";
    position: absolute;
    inset: 8%;
    background: radial-gradient(50% 50% at 50% 50%, rgba(91, 92, 226, .14), transparent 70%);
    pointer-events: none;
    opacity: 0;
    transition: opacity .6s ease;
    filter: blur(20px);
}
.about-mark-stage[data-active]::before {
    opacity: 1;
}

.about-tn-logo {
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
}

.tn-part path {
    transition: fill .55s cubic-bezier(.4, 0, .2, 1), opacity .45s ease;
}
.tn-part {
    transition: filter .55s cubic-bezier(.4, 0, .2, 1);
}

.about-tn-logo .tn-S,
.about-tn-logo .tn-P,
.about-tn-logo .tn-foot {
    fill: #9aa0ad;
}
[data-theme="dark"] .about-tn-logo .tn-S,
[data-theme="dark"] .about-tn-logo .tn-P,
[data-theme="dark"] .about-tn-logo .tn-foot {
    fill: #8a91a0;
}

.about-mark-stage[data-active="S"]    .tn-part-S    path,
.about-mark-stage[data-active="P"]    .tn-part-P    path,
.about-mark-stage[data-active="foot"] .tn-part-foot path {
    fill: var(--p);
}
.about-mark-stage[data-active="S"]    .tn-part-S,
.about-mark-stage[data-active="P"]    .tn-part-P,
.about-mark-stage[data-active="foot"] .tn-part-foot {
    filter: drop-shadow(0 0 24px rgba(91, 92, 226, .55));
}

.about-mark-stage[data-active="S"]    .tn-part-S,
.about-mark-stage[data-active="P"]    .tn-part-P,
.about-mark-stage[data-active="foot"] .tn-part-foot {
    cursor: default !important;
}

.about-tn-logo .tn-part path { transition: fill .25s ease, opacity .25s ease; }
.about-tn-logo .tn-part:hover path,
.about-tn-logo .tn-part:focus-visible path {
    fill: #1a1d28;
}
[data-theme="dark"] .about-tn-logo .tn-part:hover path,
[data-theme="dark"] .about-tn-logo .tn-part:focus-visible path {
    fill: #f0f2f7;
}

.about-mark-stage[data-active="S"]    .tn-part-S:hover    path,
.about-mark-stage[data-active="P"]    .tn-part-P:hover    path,
.about-mark-stage[data-active="foot"] .tn-part-foot:hover path,
.about-mark-stage[data-active="S"]    .tn-part-S:focus-visible    path,
.about-mark-stage[data-active="P"]    .tn-part-P:focus-visible    path,
.about-mark-stage[data-active="foot"] .tn-part-foot:focus-visible path {
    fill: var(--p);
}

.about-tn-logo .tn-part:focus-visible {
    filter: drop-shadow(0 0 8px rgba(91, 92, 226, .4));
}

.about-mark-meanings {
    display: flex;
    flex-direction: column;
    gap: clamp(80px, 14vh, 180px);
    padding-bottom: 8vh;
}

.meaning-block.in-view {
    transition: opacity .35s ease;
}
.about-mark-grid:has(.about-mark-stage[data-active="S"])    .meaning-block.in-view[data-meaning="P"],
.about-mark-grid:has(.about-mark-stage[data-active="S"])    .meaning-block.in-view[data-meaning="foot"],
.about-mark-grid:has(.about-mark-stage[data-active="P"])    .meaning-block.in-view[data-meaning="S"],
.about-mark-grid:has(.about-mark-stage[data-active="P"])    .meaning-block.in-view[data-meaning="foot"],
.about-mark-grid:has(.about-mark-stage[data-active="foot"]) .meaning-block.in-view[data-meaning="S"],
.about-mark-grid:has(.about-mark-stage[data-active="foot"]) .meaning-block.in-view[data-meaning="P"] {
    opacity: .55;
}

.meaning-num {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .18em;
    color: var(--muted2);
    margin-bottom: 18px;
}

.meaning-head {
    margin: 0 0 14px;
}

.meaning-kicker {
    display: inline-block;
    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--p);
    margin-bottom: 10px;
}

.meaning-block h3 {
    font-size: clamp(18px, 1.9vw, 23px);
    margin: 0;
    letter-spacing: -.02em;
    line-height: 1.2;
    color: var(--text);
    white-space: nowrap;
}
@media (max-width: 1100px) {
    .meaning-block h3 {
        white-space: normal;
        text-wrap: balance;
        font-size: clamp(18px, 2.4vw, 22px);
    }
}
.meaning-block p {
    margin: 0 0 20px;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.7;
    max-width: 52ch;
}
.meaning-block p strong { color: var(--text); font-weight: 700; }

.meaning-bullets {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    border-left: 2px solid rgba(91, 92, 226, .25);
    padding-left: 16px;
}
.meaning-bullets li {
    font-size: 14px;
    color: var(--muted);
    display: flex;
    align-items: flex-start;
    gap: 10px;
    line-height: 1.55;
}
.meaning-bullets li i {
    color: var(--p);
    font-size: 11px;
    margin-top: 5px;
    flex-shrink: 0;
}

@media (max-width: 880px) {
    .about-mark-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .about-mark-figure { position: static; }
    .about-mark-stage {
        max-width: 420px;
        aspect-ratio: 1 / 1;
        margin: 0 auto;
    }
    
    .about-mark-stage[data-active="foot"] { transform: none; }
    .about-mark-meanings {
        gap: 50px;
        padding-bottom: 0;
    }
}

.about-principles {
    padding: clamp(20px, 3vw, 40px) 0 clamp(60px, 8vw, 100px);
}
.principles-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}
.principle {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 26px 26px 28px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    overflow: hidden;
    transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.principle:hover {
    border-color: rgba(91, 92, 226, .35);
    transform: translateY(-2px);
    box-shadow: var(--shadow3);
}

.principle-ico {
    position: absolute;
    top: -8px;
    right: -10px;
    width: auto;
    height: auto;
    display: block;
    background: transparent;
    color: var(--p);
    border-radius: 0;
    font-size: 100px;
    margin: 0;
    opacity: .07;
    pointer-events: none;
    transition: opacity .25s ease, transform .25s ease;
    line-height: 1;
}
.principle:hover .principle-ico {
    opacity: .12;
    transform: scale(1.05) rotate(-3deg);
}
.principle-ico i { display: block; }
.principle b {
    position: relative;
    z-index: 1;
    font-size: 16px;
    color: var(--text);
    font-weight: 700;
    letter-spacing: -.005em;
}
.principle span {
    position: relative;
    z-index: 1;
    font-size: 13.5px;
    color: var(--muted);
    line-height: 1.6;
}

@media (max-width: 920px) {
    .principles-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
    .principles-grid { grid-template-columns: 1fr; }
}

.about-cta-section {
    padding: 0 0 clamp(40px, 5vw, 70px);
}
.card.cta {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 24px;
    padding: clamp(24px, 4vw, 40px);
    background: linear-gradient(135deg, rgba(91, 92, 226, .08), rgba(124, 58, 237, .06));
    border: 1px solid rgba(91, 92, 226, .25);
    border-radius: var(--r);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.card.cta h3 {
    font-size: clamp(20px, 2.5vw, 26px);
    margin: 0 0 6px;
    letter-spacing: -.015em;
    white-space: nowrap;
}
.card.cta p {
    margin: 0;
    color: var(--muted);
    font-size: 14.5px;
    white-space: nowrap;
}
@media (max-width: 920px) {
    .card.cta h3,
    .card.cta p {
        white-space: normal;
        text-wrap: balance;
    }
    .card.cta p { text-wrap: pretty; }
}
@media (max-width: 700px) {
    .card.cta { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .about-mark-figure { position: static; }
    .meaning-block, [data-reveal], .about-principles .principle {
        opacity: 1;
        transform: none;
        transition: none;
    }
    .about-principles.in-view .principle { transition-delay: 0s; }
    .tn-part path, .tn-part { transition: none; }
    .about-rail { display: none; }
}

.modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 200;
    background: rgba(8, 10, 16, .55);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    opacity: 0;
    transition: opacity .2s ease;
}
.modal-backdrop.open {
    display: flex;
    opacity: 1;
}

.modal {
    width: 100%;
    max-width: 920px;
    max-height: 90vh;
    background: var(--card-solid);
    border: 1px solid var(--line2);
    border-radius: 18px;
    box-shadow: 0 32px 80px rgba(0, 0, 0, .35);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateY(12px);
    transition: transform .25s cubic-bezier(.4, 0, .2, 1);
}
.modal-backdrop.open .modal { transform: translateY(0); }

.modal-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 22px;
    border-bottom: 1px solid var(--line);
    flex-shrink: 0;
}
.modal-head .modal-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: rgba(91, 92, 226, .10);
    color: var(--p);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    flex-shrink: 0;
}
.modal-title {
    font-size: 16px;
    font-weight: 700;
    margin: 0;
    flex: 1;
    min-width: 0;
}
.modal-subtitle {
    font-size: 12px;
    color: var(--muted);
    margin: 2px 0 0;
}
.modal-close {
    width: 32px;
    height: 32px;
    background: transparent;
    border: 1px solid var(--line);
    border-radius: var(--r3);
    color: var(--muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: color .15s ease, background .15s ease, border-color .15s ease;
    flex-shrink: 0;
}
.modal-close:hover {
    color: var(--text);
    background: var(--bg2);
    border-color: var(--line2);
}

.modal-body {
    flex: 1;
    min-height: 0;
    overflow: auto;
    background: var(--bg2);
}
.modal-body iframe {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 60vh;
    border: 0;
    background: var(--bg);
}

.modal-foot {
    padding: 14px 22px;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-shrink: 0;
}
.modal-foot small {
    color: var(--muted2);
    font-size: 12px;
}

@media (max-width: 600px) {
    .modal {
        max-height: 95vh;
        border-radius: 14px;
    }
    .modal-head { padding: 14px 16px; }
    .modal-foot { padding: 12px 16px; flex-wrap: wrap; }
}

@keyframes prt-pulse-soft { 0%,100% { opacity:.5 } 50% { opacity:1 } }
@keyframes prt-rot-slow { from { transform:rotate(0) } to { transform:rotate(360deg) } }
@keyframes prt-progress { 0% { width:0% } 100% { width:100% } }

.prt-hero-v32 {
    padding: clamp(60px, 8vw, 100px) 0 clamp(40px, 5vw, 60px);
}
.prt-hero-v32-grid {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 56px;
    align-items: center;
}
.prt-hero-v32-text h1 {
    font-size: clamp(36px, 4.4vw, 52px);
    line-height: 1.08;
    letter-spacing: -.025em;
    color: var(--text);
    font-weight: 800;
    margin: 0 0 20px;
    text-wrap: balance;
}
.prt-hero-v32-text h1 em {
    color: var(--p);
    font-style: normal;
}
.prt-hero-v32-text .lead {
    font-size: 16.5px;
    color: var(--muted);
    line-height: 1.7;
    max-width: 54ch;
    margin-bottom: 32px;
}
.prt-hero-v32-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}
.prt-hero-cta-primary,
.prt-hero-cta-secondary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 24px;
    font-size: 14px;
    font-weight: 700;
    border-radius: 10px;
    text-decoration: none;
    transition: .2s ease;
    border: 1.5px solid;
}
.prt-hero-cta-primary {
    background: var(--p);
    color: #fff !important;
    border-color: var(--p);
}
.prt-hero-cta-primary:hover {
    background: #7878e8;
    transform: translateY(-1px);
    box-shadow: 0 8px 22px -8px var(--p);
}
.prt-hero-cta-secondary {
    background: transparent;
    color: var(--text);
    border-color: var(--line2);
}
.prt-hero-cta-secondary:hover {
    border-color: var(--p);
    color: var(--p);
    background: rgba(91,92,226,.06);
}

.prt-diagram {
    position: relative;
    width: 100%;
    aspect-ratio: 1.05 / 1;
    background: var(--bg2);
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
}
[data-theme="light"] .prt-diagram {
    background: linear-gradient(135deg, #f7f7fb, #ececf2);
    border-color: rgba(0,0,0,.08);
}
.prt-diagram::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at center, rgba(91,92,226,.06), transparent 70%);
    pointer-events: none;
}

.prt-diagram-svg {
    position: absolute;
    inset: 24px;
    width: calc(100% - 48px);
    height: calc(100% - 48px);
}

@media (max-width: 920px) {
    .prt-hero-v32-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .prt-hero-v32-visual {
        max-width: 480px;
        margin: 0 auto;
        width: 100%;
    }
}

.prt-platform-v2 {
    padding: clamp(50px, 7vw, 80px) 0;
    border-top: 1px solid var(--line);
}

.prt-carousel {
    position: relative;
    margin-top: 36px;
    overflow: hidden;
    border-radius: 18px;
    background: var(--bg2);
    border: 1px solid var(--line);
    outline: none;
}
.prt-carousel-track {
    display: flex;
    width: 100%;
    transition: transform .6s cubic-bezier(.4, .1, .3, 1);
}
.prt-slide {
    flex: 0 0 100%;
    min-width: 100%;
    padding: clamp(32px, 5vw, 56px);
    position: relative;
}
.prt-slide-grid {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 48px;
    align-items: start;
}

.prt-slide-visual {
    position: relative;  
    width: 100%;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
.prt-slide-num {
    position: absolute;
    top: 0;
    left: 0;
    font-family: ui-monospace, monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .18em;
    color: var(--muted2, #6b7280);
    z-index: 3;
}
.prt-slide-coming {
    position: absolute;
    top: 0;
    right: 0;
    background: #ef4444;
    color: #fff;
    padding: 4px 12px;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    border-radius: 999px;
    z-index: 3;
}
.prt-slide-icon {
    position: relative;
    width: 78%;
    height: 78%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}
.prt-slide-icon svg {
    width: 100%;
    height: 100%;
    color: var(--c, var(--p));
    filter: drop-shadow(0 8px 32px color-mix(in srgb, var(--c, var(--p)) 50%, transparent));
    transition: transform .3s ease;
}
.prt-slide:hover .prt-slide-icon svg {
    transform: scale(1.04);
}
.prt-slide-aura {
    position: absolute;
    inset: 10%;
    border-radius: 50%;
    background: radial-gradient(circle at center,
                color-mix(in srgb, var(--c, var(--p)) 18%, transparent),
                transparent 70%);
    z-index: 1;
    animation: prt-pulse-soft 4s ease infinite;
}

.prt-slide[data-mod="gamelink"]   { --c: #06b6d4 }
.prt-slide[data-mod="persona"]    { --c: #a855f7 }
.prt-slide[data-mod="warden"]     { --c: #5b5ce2 }
.prt-slide[data-mod="fairmatch"]  { --c: #14b8a6 }
.prt-slide[data-mod="watchtower"] { --c: #f59e0b }
.prt-slide[data-mod="playerhub"]  { --c: #3b82f6 }
.prt-slide[data-mod="hindsight"]  { --c: #ef4444 }
.prt-slide[data-mod="datastream"] { --c: #ec4899 }

.prt-slide-content {
    padding-top: 8px;
}
.prt-slide-role {
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--c, var(--p));
    margin-bottom: 10px;
}
.prt-slide-name {
    font-size: clamp(28px, 3vw, 38px);
    font-weight: 800;
    letter-spacing: -.025em;
    color: var(--text);
    margin: 0 0 12px;
    line-height: 1.1;
}
.prt-slide-short {
    font-size: 16px;
    color: var(--muted);
    line-height: 1.6;
    margin: 0 0 28px;
    max-width: 60ch;
}
.prt-slide-details {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 22px;
}
.prt-slide-detail {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 16px;
    background: rgba(91,92,226,.04);
    border: 1px solid var(--line);
    border-left: 3px solid var(--c, var(--p));
    border-radius: 8px;
}
[data-theme="light"] .prt-slide-detail {
    background: rgba(91,92,226,.04);
}
.prt-slide-detail b {
    font-size: 13.5px;
    color: var(--text);
    font-weight: 700;
    line-height: 1.3;
}
.prt-slide-detail span {
    font-size: 13px;
    color: var(--muted);
    line-height: 1.55;
}

.prt-carousel-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg);
    color: var(--text);
    border: 1px solid var(--line);
    border-radius: 50%;
    cursor: pointer;
    z-index: 10;
    transition: .2s ease;
    font-size: 16px;
}
.prt-carousel-arrow:hover:not(:disabled) {
    background: var(--p);
    color: #fff;
    border-color: var(--p);
    transform: translateY(-50%) scale(1.06);
    box-shadow: 0 8px 20px -8px var(--p);
}
.prt-carousel-arrow:disabled {
    opacity: .3;
    cursor: not-allowed;
}
.prt-carousel-arrow-prev { left: 16px }
.prt-carousel-arrow-next { right: 16px }

.prt-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 8px 0 24px;
}
.prt-carousel-dot {
    width: 8px;
    height: 8px;
    background: var(--line2, #2a2a35);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    transition: .2s ease;
    padding: 0;
}
.prt-carousel-dot:hover {
    background: var(--muted);
}
.prt-carousel-dot-active {
    background: var(--p);
    width: 24px;
    border-radius: 4px;
}

.prt-carousel-progress {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 2px;
    width: 0;
    background: var(--p);
    box-shadow: 0 0 8px var(--p);
    pointer-events: none;
}

@media (max-width: 920px) {
    .prt-slide-grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }
    .prt-slide-visual {
        width: 180px;
        margin: 0 auto;
    }
    .prt-slide-details {
        grid-template-columns: 1fr;
    }
    .prt-carousel-arrow {
        width: 38px;
        height: 38px;
    }
}

.prt-code-sec {
    padding: clamp(50px, 7vw, 80px) 0;
    border-top: 1px solid var(--line);
}
.prt-code-steps {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-top: 36px;
}
.prt-code-step {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 28px;
    align-items: start;
}
.prt-code-step-num {
    position: sticky;
    top: 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}
.prt-code-step-circle {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--bg2);
    border: 2px solid var(--p);
    color: var(--p);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: ui-monospace, monospace;
    font-weight: 800;
    font-size: 16px;
}
.prt-code-step-label {
    font-family: ui-monospace, monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: .18em;
    color: var(--muted2, #6b7280);
    text-transform: uppercase;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
}
.prt-code-step-content {
    padding-top: 6px;
}
.prt-code-step-content h3 {
    font-size: 17px;
    color: var(--text);
    font-weight: 700;
    margin: 0 0 8px;
    letter-spacing: -.005em;
}
.prt-code-step-desc {
    font-size: 14px;
    color: var(--muted);
    margin: 0 0 16px;
    line-height: 1.6;
    max-width: 60ch;
}
.prt-code-block {
    background: #08080d;
    border: 1px solid var(--line);
    border-radius: 12px;
    overflow: hidden;
}
[data-theme="light"] .prt-code-block {
    background: #f6f6f9;
    border-color: rgba(0,0,0,.08);
}
.prt-code-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 18px;
    background: var(--bg2);
    border-bottom: 1px solid var(--line);
    font-family: ui-monospace, monospace;
    font-size: 12px;
    color: var(--muted);
}
.prt-code-header::before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #ef4444;
}
.prt-code-block pre {
    padding: 22px;
    margin: 0;
    font-family: ui-monospace, monospace;
    font-size: 13.5px;
    color: #e5e7eb;
    line-height: 1.65;
    overflow-x: auto;
}
[data-theme="light"] .prt-code-block pre { color: #1f2937 }
.prt-code-com   { color: #6b7280; font-style: italic }
.prt-code-kw    { color: #a78bfa }
.prt-code-str   { color: #10b981 }
.prt-code-fn    { color: #06b6d4 }
.prt-code-var   { color: #f59e0b }
.prt-code-macro { color: #fb923c }

@media (max-width: 720px) {
    .prt-code-step {
        grid-template-columns: 1fr;
        gap: 14px;
    }
    .prt-code-step-num {
        position: static;
        flex-direction: row;
        gap: 14px;
    }
    .prt-code-step-label {
        writing-mode: horizontal-tb;
        transform: none;
    }
}

.prt-pricing-v2 {
    padding: clamp(50px, 7vw, 80px) 0;
    border-top: 1px solid var(--line);
}

.prt-promise {
    margin: 28px 0 36px;
    padding: 24px 28px;
    background: linear-gradient(135deg, rgba(91,92,226,.12), rgba(91,92,226,.04));
    border: 1px solid rgba(91,92,226,.35);
    border-left: 3px solid var(--p);
    border-radius: 12px;
    display: flex;
    align-items: flex-start;
    gap: 16px;
}
.prt-promise-icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--bg);
    color: var(--p);
    border: 1px solid rgba(91,92,226,.35);
    border-radius: 10px;
    font-size: 18px;
}
.prt-promise b { display: block; font-size: 16px; color: var(--text); margin-bottom: 8px }
.prt-promise span { display: block; font-size: 14px; color: var(--muted); line-height: 1.7 }

.prt-tier-picker { margin-top: 12px }
.prt-tier-picker-label {
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--muted2, #6b7280);
    margin-bottom: 12px;
}
.prt-tier-picker-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
}

.prt-tier-card {
    position: relative;
    padding: 22px 18px 18px;
    background: var(--bg2);
    border: 1.5px solid var(--line);
    border-radius: 14px;
    text-align: left;
    cursor: pointer;
    transition: .2s ease;
    font-family: inherit;
    color: inherit;
    display: flex;
    flex-direction: column;
    gap: 10px;
    
    -webkit-appearance: none;
    appearance: none;
}
.prt-tier-card:hover {
    border-color: rgba(91,92,226,.5);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px -12px rgba(91,92,226,.4);
}
.prt-tier-card-selected {
    border-color: var(--p) !important;
    background: linear-gradient(180deg, rgba(91,92,226,.12), var(--bg2)) !important;
    box-shadow: 0 0 0 1px var(--p), 0 8px 28px -10px rgba(91,92,226,.5);
}

.prt-tier-card-badge {
    position: absolute;
    top: -10px;
    left: 50%;
    transform: translateX(-50%);
    padding: 4px 10px;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    border-radius: 999px;
    white-space: nowrap;
}
.prt-tier-card-badge-early {
    background: #10b981;
    color: #fff;
}

.prt-tier-card-name {
    font-size: 18px;
    font-weight: 800;
    color: var(--text);
    letter-spacing: -.005em;
    line-height: 1.1;
}
.prt-tier-card-sub {
    font-size: 11.5px;
    color: var(--muted);
    font-weight: 500;
    letter-spacing: .02em;
}
.prt-tier-card-price {
    display: flex;
    align-items: baseline;
    gap: 2px;
    margin-top: 6px;
    flex-wrap: wrap;
}
.prt-tier-card-currency {
    font-size: 13px;
    font-weight: 600;
    color: var(--muted);
    font-family: ui-monospace, monospace;
}
.prt-tier-card-amount {
    font-size: 26px;
    font-weight: 800;
    color: var(--text);
    font-family: ui-monospace, monospace;
    letter-spacing: -.02em;
    margin-left: 2px;
}
.prt-tier-card-period {
    font-size: 11.5px;
    color: var(--muted);
    margin-left: 4px;
}
.prt-tier-card-caps {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 8px;
    padding-top: 12px;
    border-top: 1px dashed var(--line);
}
.prt-tier-card-cap {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.prt-tier-card-cap-label {
    color: var(--muted2, #6b7280);
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    font-size: 10px;
}
.prt-tier-card-cap-value {
    color: var(--text);
    font-weight: 700;
    font-family: ui-monospace, monospace;
    font-size: 11.5px;
}

@media (max-width: 920px) {
    .prt-tier-picker-grid { grid-template-columns: repeat(2, 1fr) }
}
@media (max-width: 540px) {
    .prt-tier-picker-grid { grid-template-columns: 1fr }
}

.prt-checkout {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 28px;
    margin-top: 36px;
    align-items: start;
}
.prt-checkout-left {
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.prt-checkout-summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    padding: 24px 28px;
    background: var(--bg2);
    border: 1.5px solid var(--line);
    border-radius: 14px;
    transition: .25s ease;
    flex-wrap: wrap;
}
.prt-checkout-summary-filled {
    border-color: var(--p);
    background: linear-gradient(180deg, rgba(91,92,226,.12), var(--bg2));
}
.prt-checkout-summary-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 200px;
}
.prt-checkout-summary-label {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--muted2, #6b7280);
}
.prt-checkout-summary-name {
    font-size: 22px;
    font-weight: 700;
    color: var(--text);
    letter-spacing: -.015em;
}
.prt-checkout-summary-caps {
    font-size: 12px;
    color: var(--muted);
    margin-top: 4px;
    font-family: ui-monospace, monospace;
}
.prt-checkout-summary-price {
    font-size: 24px;
    font-weight: 800;
    color: var(--text);
    font-family: ui-monospace, monospace;
    letter-spacing: -.02em;
}
.prt-checkout-summary-price small {
    font-size: 13px;
    color: var(--muted);
    font-weight: 500;
    font-family: Inter, sans-serif;
    margin-left: 4px;
    letter-spacing: 0;
}

.prt-checkout-payment {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.prt-checkout-payment[hidden] { display: none }
.prt-checkout-apply {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.prt-checkout-apply[hidden] { display: none }

.prt-apply-btn,
.prt-learn-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 22px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 700;
    transition: .2s ease;
    cursor: pointer;
    font-family: inherit;
    text-decoration: none;
    border: 1.5px solid;
}
.prt-apply-btn {
    background: var(--p);
    color: #fff !important;
    border-color: var(--p);
}
.prt-apply-btn:hover {
    background: #7878e8;
    transform: translateY(-1px);
    box-shadow: 0 8px 20px -8px var(--p);
}
.prt-learn-btn {
    background: transparent;
    color: var(--text);
    border-color: var(--line);
}
.prt-learn-btn:hover {
    border-color: var(--p);
    background: rgba(91,92,226,.08);
}

.prt-checkout-right {
    padding: 24px 28px;
    background: var(--bg2);
    border: 1px solid var(--line);
    border-radius: 14px;
}
.prt-checkout-heading {
    margin: 0 0 14px;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .04em;
    color: var(--text);
}
.prt-checkout-docs {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed var(--line);
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.prt-checkout-docs a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--p);
    font-weight: 600;
    text-decoration: none;
    padding: 6px 0;
    transition: .2s ease;
}
.prt-checkout-docs a:hover { color: #7878e8 }

@media (max-width: 920px) {
    .prt-checkout { grid-template-columns: 1fr }
}

.prt-enterprise-bar {
    margin-top: 28px;
    padding: 22px 28px;
    background: linear-gradient(135deg, var(--bg2), var(--bg));
    border: 1px dashed var(--line);
    border-radius: 14px;
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}
.prt-enterprise-icon {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: var(--bg2);
    color: var(--muted);
    border: 1px solid var(--line);
    font-size: 18px;
}
.prt-enterprise-text { flex: 1; min-width: 260px }
.prt-enterprise-text b {
    display: block;
    font-size: 15px;
    color: var(--text);
    margin-bottom: 4px;
}
.prt-enterprise-text span {
    font-size: 13.5px;
    color: var(--muted);
    line-height: 1.55;
}
.prt-enterprise-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 11px 20px;
    background: var(--p);
    color: #fff !important;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 700;
    transition: .2s ease;
    text-decoration: none;
}
.prt-enterprise-cta:hover {
    background: #7878e8;
    transform: translateY(-1px);
    box-shadow: 0 8px 20px -8px var(--p);
}

.prt-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.prt-modal[hidden] { display: none }
.prt-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.7);
    backdrop-filter: blur(4px);
    opacity: 0;
    transition: opacity .3s ease;
}
.prt-modal-visible .prt-modal-backdrop { opacity: 1 }
.prt-modal-content {
    position: relative;
    max-width: 720px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    padding: 36px 36px 32px;
    background: linear-gradient(135deg, #1a1d3a, #0f1124);
    border: 1px solid rgba(91,92,226,.35);
    border-radius: 18px;
    box-shadow: 0 30px 90px -20px rgba(0,0,0,.8);
    transform: translateY(20px);
    opacity: 0;
    transition: opacity .3s ease, transform .3s ease;
}
[data-theme="light"] .prt-modal-content {
    background: linear-gradient(135deg, #f7f7fb, #ececf2);
    color: var(--text);
}
.prt-modal-visible .prt-modal-content {
    opacity: 1;
    transform: translateY(0);
}
.prt-modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 8px;
    color: var(--muted);
    cursor: pointer;
    transition: .2s ease;
    z-index: 2;
}
.prt-modal-close:hover { color: #fff; background: rgba(255,255,255,.12) }
.prt-modal-badge {
    display: inline-block;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--p);
    background: rgba(91,92,226,.12);
    border: 1px solid rgba(91,92,226,.35);
    padding: 5px 12px;
    border-radius: 999px;
    margin-bottom: 16px;
}
.prt-modal-title {
    font-size: clamp(22px, 2.5vw, 30px);
    font-weight: 700;
    letter-spacing: -.015em;
    color: #fff;
    margin: 0 0 14px;
    line-height: 1.2;
    max-width: 32ch;
}
[data-theme="light"] .prt-modal-title { color: var(--text) }
.prt-modal-lead {
    font-size: 15px;
    color: var(--muted);
    line-height: 1.7;
    max-width: 64ch;
    margin-bottom: 28px;
}
.prt-modal-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-bottom: 24px;
}
.prt-modal-cell {
    padding: 18px 20px;
    background: rgba(255,255,255,.025);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px;
}
[data-theme="light"] .prt-modal-cell {
    background: rgba(0,0,0,.03);
    border-color: rgba(0,0,0,.1);
}
.prt-modal-cell-eyebrow {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--muted2, #6b7280);
    margin-bottom: 8px;
}
.prt-modal-cell-value {
    font-size: 26px;
    font-weight: 800;
    letter-spacing: -.02em;
    color: #fff;
    font-family: ui-monospace, monospace;
    margin-bottom: 6px;
    line-height: 1;
}
[data-theme="light"] .prt-modal-cell-value { color: var(--text) }
.prt-modal-cell-value small {
    font-size: 12px;
    font-weight: 500;
    color: var(--muted);
    font-family: Inter, sans-serif;
    letter-spacing: 0;
    margin-left: 4px;
}
.prt-modal-cell-note {
    font-size: 12.5px;
    color: var(--muted);
    line-height: 1.55;
    margin-top: 10px;
}
.prt-modal-benefits {
    padding: 18px 22px;
    background: rgba(0,0,0,.25);
    border-radius: 12px;
    margin-bottom: 24px;
}
[data-theme="light"] .prt-modal-benefits { background: rgba(0,0,0,.04) }
.prt-modal-benefits h4 {
    margin: 0 0 12px;
    color: #fff;
    font-size: 13.5px;
    letter-spacing: .04em;
    font-weight: 700;
}
[data-theme="light"] .prt-modal-benefits h4 { color: var(--text) }
.prt-modal-benefits ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
    padding: 0;
}
.prt-modal-benefits li {
    font-size: 13.5px;
    color: var(--muted);
    display: flex;
    gap: 10px;
    align-items: flex-start;
    line-height: 1.5;
}
.prt-modal-benefits li i {
    color: var(--p);
    font-size: 11px;
    margin-top: 6px;
    flex-shrink: 0;
}
.prt-modal-cta {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: center;
}
.prt-modal-cta-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 22px;
    background: var(--p);
    color: #fff !important;
    border-radius: 10px;
    font-size: 14.5px;
    font-weight: 700;
    transition: .2s ease;
    text-decoration: none;
}
.prt-modal-cta-primary:hover {
    background: #7878e8;
    transform: translateY(-1px);
    box-shadow: 0 8px 22px -8px var(--p);
}
.prt-modal-cta-secondary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 22px;
    background: transparent;
    color: var(--text);
    border: 1px solid var(--line);
    border-radius: 10px;
    font-size: 14.5px;
    font-weight: 600;
    font-family: inherit;
    transition: .2s ease;
    cursor: pointer;
}
.prt-modal-cta-secondary:hover {
    border-color: var(--p);
    background: rgba(91,92,226,.12);
}
@media (max-width: 720px) {
    .prt-modal-grid { grid-template-columns: 1fr }
    .prt-modal-content { padding: 24px 20px }
}

[data-theme="light"] .prt-code-kw    { color: #7c3aed }
[data-theme="light"] .prt-code-str   { color: #059669 }
[data-theme="light"] .prt-code-fn    { color: #0891b2 }
[data-theme="light"] .prt-code-var   { color: #d97706 }
[data-theme="light"] .prt-code-macro { color: #ea580c }
[data-theme="light"] .prt-code-com   { color: #94a3b8 }
[data-theme="light"] .prt-code-header { background: #ececf2; color: #475569 }
[data-theme="light"] .prt-code-header::before { background: #f87171 }

[data-theme="light"] .payment-btn[disabled] {
    background: #e5e7eb !important;
    color: #6b7280 !important;
    border: 1px solid #d1d5db !important;
    box-shadow: none !important;
}
[data-theme="light"] .payment-btn:not([disabled]) {
    background: var(--p) !important;
    color: #fff !important;
}

[data-theme="light"] .prt-tier-card-amount,
[data-theme="light"] .prt-checkout-summary-name,
[data-theme="light"] .prt-checkout-summary-price {
    color: var(--text);
}

[data-theme="light"] .prt-carousel-arrow {
    background: #fff;
    color: var(--text);
    border-color: rgba(0,0,0,.12);
    box-shadow: 0 4px 12px rgba(0,0,0,.08);
}

[data-theme="light"] .prt-slide-aura {
    opacity: .5;
}

[data-theme="light"] .prt-carousel-dot {
    background: rgba(0,0,0,.15);
}
[data-theme="light"] .prt-carousel-dot-active {
    background: var(--p);
}

[data-theme="light"] .prt-modal-close {
    background: rgba(0,0,0,.05);
    border-color: rgba(0,0,0,.08);
    color: var(--muted);
}
[data-theme="light"] .prt-modal-close:hover {
    background: rgba(0,0,0,.1);
    color: var(--text);
}

[data-theme="light"] .prt-promise {
    background: linear-gradient(135deg, rgba(91,92,226,.08), rgba(91,92,226,.02));
}
[data-theme="light"] .prt-enterprise-bar {
    background: linear-gradient(135deg, #fafafa, #f5f5f7);
}

.sol-page .eyebrow i { color: var(--p); }

.sol-hero {
    padding: clamp(70px, 10vw, 130px) 0 clamp(36px, 6vw, 64px);
    text-align: center;
}

.sol-caps { padding: clamp(20px, 3vw, 40px) 0 clamp(48px, 7vw, 80px); }

.sol-caps-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}
.sol-cap {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 26px 26px 28px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.sol-cap:hover {
    border-color: rgba(91, 92, 226, .35);
    transform: translateY(-2px);
    box-shadow: var(--shadow3);
}
.sol-cap-ico {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(91, 92, 226, .16), rgba(124, 58, 237, .12));
    color: var(--p);
    border-radius: 12px;
    font-size: 20px;
    margin-bottom: 4px;
}
.sol-cap h3 { margin: 0; }
.sol-cap p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: var(--muted);
}

.sol-process { padding: 0 0 clamp(48px, 7vw, 80px); }

.sol-steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}
.sol-step {
    position: relative;
    padding: 24px 22px 26px;
    background: var(--bg2);
    border: 1px solid var(--line);
    border-radius: var(--r);
    overflow: hidden;
}
.sol-step-num {
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .1em;
    color: var(--p);
    margin-bottom: 12px;
}
.sol-step::before {
    content: "";
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, var(--p), var(--p2));
    opacity: .9;
}
.sol-step h3 { margin: 0 0 8px; font-size: 17px; }
.sol-step p {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--muted);
}

.sol-models { padding: 0 0 clamp(48px, 7vw, 80px); }

.sol-models-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}
.sol-model {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 28px 26px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.sol-model:hover {
    border-color: rgba(91, 92, 226, .35);
    transform: translateY(-2px);
    box-shadow: var(--shadow3);
}
.sol-model-badge {
    align-self: flex-start;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--p);
    background: rgba(91, 92, 226, .10);
    border: 1px solid rgba(91, 92, 226, .25);
    padding: 4px 10px;
    border-radius: 999px;
}
.sol-model h3 { margin: 0; }
.sol-model p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: var(--muted);
}

.sol-stack { padding: 0 0 clamp(48px, 7vw, 80px); }

.sol-stack-inner {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    align-items: center;
    gap: 28px;
    padding: clamp(24px, 4vw, 38px);
    background: linear-gradient(135deg, rgba(91, 92, 226, .07), rgba(124, 58, 237, .05));
    border: 1px solid rgba(91, 92, 226, .22);
    border-radius: var(--r);
}
.sol-stack-label p {
    margin: 12px 0 0;
    font-size: 14px;
    line-height: 1.6;
    color: var(--muted);
    max-width: 40ch;
}
.sol-stack-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.sol-stack-chips .chip {
    font-size: 12px;
    padding: 6px 12px;
}

.sol-cta-section { padding: 0 0 clamp(48px, 7vw, 90px); }
.card.cta.sol-cta {
    background: linear-gradient(135deg, rgba(91, 92, 226, .09), rgba(124, 58, 237, .06));
    border-color: rgba(91, 92, 226, .25);
}

@media (max-width: 1000px) {
    .sol-caps-grid   { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sol-models-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .sol-steps       { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
    .sol-stack-inner { grid-template-columns: 1fr; gap: 18px; }
}
@media (max-width: 680px) {
    .sol-caps-grid   { grid-template-columns: 1fr; }
    .sol-models-grid { grid-template-columns: 1fr; }
    .sol-steps       { grid-template-columns: 1fr; }
}

.ct-hero {
    padding: clamp(70px, 10vw, 120px) 0 clamp(28px, 5vw, 48px);
    text-align: center;
}
.ct-body { padding: 0 0 clamp(60px, 8vw, 100px); }

.ct-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, .9fr);
    gap: 28px;
    align-items: stretch;
}

.ct-form-wrap {
    padding: clamp(24px, 3vw, 34px);
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    display: flex;
    flex-direction: column;
}
.ct-form { display: flex; flex-direction: column; gap: 18px; flex: 1; }
.ct-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.ct-field { display: flex; flex-direction: column; gap: 7px; }
.ct-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--text);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.ct-opt {
    font-size: 11px;
    font-weight: 600;
    color: var(--muted2);
    text-transform: uppercase;
    letter-spacing: .06em;
}
.ct-input {
    width: 100%;
    padding: 11px 14px;
    font-family: inherit;
    font-size: 14.5px;
    color: var(--text);
    background: var(--bg2);
    border: 1px solid var(--line);
    border-radius: var(--r3);
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.ct-input::placeholder { color: var(--muted2); }
.ct-input:focus {
    outline: none;
    border-color: var(--p);
    box-shadow: 0 0 0 3px rgba(91, 92, 226, .18);
    background: var(--card-solid);
}
.ct-input:-webkit-autofill,
.ct-input:-webkit-autofill:hover,
.ct-input:-webkit-autofill:active {
    -webkit-text-fill-color: var(--text);
    -webkit-box-shadow: 0 0 0 1000px var(--bg2) inset;
    box-shadow: 0 0 0 1000px var(--bg2) inset;
    caret-color: var(--text);
    transition: background-color 9999s ease 0s;
}
.ct-input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px var(--card-solid) inset;
    box-shadow: 0 0 0 1000px var(--card-solid) inset;
}
.ct-consent {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    font-size: 13px;
    color: var(--muted);
    line-height: 1.5;
}
.ct-consent input {
    margin-top: 2px;
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    accent-color: var(--p);
    cursor: pointer;
}
.ct-consent a { color: var(--p); text-decoration: underline; }
.ct-textarea { resize: vertical; min-height: 130px; line-height: 1.55; }
.ct-select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2364748b' d='M6 8 0 0h12z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    padding-right: 38px;
    cursor: pointer;
}
.ct-hp {
    position: absolute !important;
    left: -9999px;
    opacity: 0;
    height: 0;
    width: 0;
    overflow: hidden;
}
.ct-actions {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}
.ct-submit.is-loading { opacity: .7; cursor: progress; }
.ct-status {
    margin: 0;
    font-size: 13.5px;
    font-weight: 600;
}
.ct-status-ok      { color: var(--success); }
.ct-status-err     { color: var(--danger); }
.ct-status-pending { color: var(--muted); }

.ct-aside {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.ct-aside-head h2 { font-size: clamp(20px, 2.4vw, 24px); margin: 0 0 6px; }
.ct-aside-head p { margin: 0; font-size: 14px; line-height: 1.6; color: var(--muted); }

.ct-entity {
    display: flex;
    gap: 14px;
    padding: 18px;
    background: var(--bg2);
    border: 1px solid var(--line);
    border-radius: var(--r2);
}
.ct-entity-ico {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(91, 92, 226, .16), rgba(124, 58, 237, .12));
    color: var(--p);
    border-radius: 11px;
    font-size: 17px;
}
.ct-entity-text { min-width: 0; }
.ct-entity-text b { display: block; font-size: 15px; color: var(--text); }
.ct-entity-meta {
    display: block;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--muted2);
    margin: 2px 0 8px;
}
.ct-entity-text p { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--muted); }

.ct-note {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13.5px;
    color: var(--muted);
    padding: 2px 2px;
}
.ct-note i { color: var(--p); }

.ct-channels {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    margin-top: 4px;
}
.ct-channel-btn { white-space: nowrap; }
.ct-socials { display: inline-flex; gap: 8px; }
.ct-socials a {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--muted);
    background: var(--card-solid);
    border: 1px solid var(--line);
    border-radius: 10px;
    transition: color .15s ease, border-color .15s ease, transform .15s ease;
}
.ct-socials a:hover {
    color: var(--p);
    border-color: rgba(91, 92, 226, .4);
    transform: translateY(-2px);
}

@media (max-width: 920px) {
    .ct-grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
    .ct-row { grid-template-columns: 1fr; }
}

.home-hero .lead,
.sol-hero .lead,
.ct-hero .lead { margin-left: auto; margin-right: auto; }

.home-hero {
    padding: clamp(80px, 11vw, 150px) 0 clamp(36px, 6vw, 64px);
    text-align: center;
}
.home-actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.home-pillars { padding: clamp(20px, 3vw, 40px) 0 clamp(48px, 7vw, 80px); }

.home-pillars-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}
.home-pillar {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 28px 26px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    text-decoration: none;
    transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.home-pillar:hover {
    border-color: rgba(91, 92, 226, .35);
    transform: translateY(-3px);
    box-shadow: var(--shadow3);
}
.home-pillar-ico {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(91, 92, 226, .18), rgba(124, 58, 237, .14));
    color: var(--p);
    border-radius: 12px;
    font-size: 20px;
    margin-bottom: 2px;
}
.home-pillar h3 { margin: 0; color: var(--text); }
.home-pillar p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: var(--muted);
}
.home-pillar-link {
    margin-top: auto;
    padding-top: 10px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--p);
}
.home-pillar-tag {
    position: absolute;
    top: 16px;
    right: 16px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--muted2);
    background: var(--bg2);
    border: 1px solid var(--line);
    padding: 4px 9px;
    border-radius: 999px;
}
.home-cta-section { padding: 0 0 clamp(48px, 7vw, 90px); }

@media (max-width: 920px) {
    .home-pillars-grid { grid-template-columns: 1fr; }
}

.product-soon {
    cursor: default;
    opacity: .78;
}
.product-soon:hover {
    transform: none;
    box-shadow: none;
    border-color: var(--line);
}
.product-soon .product-card-icon {
    background: linear-gradient(135deg, rgba(100, 116, 139, .16), rgba(100, 116, 139, .10));
    color: var(--muted2);
}
.product-soon h3 { color: var(--muted); }
.product-soon-badge {
    position: absolute;
    top: 16px;
    right: 16px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--muted2);
    background: var(--bg2);
    border: 1px solid var(--line);
    padding: 5px 11px;
    border-radius: 999px;
}
.product-soon-badge i { font-size: 11px; }

.products-soon-note {
    margin: 28px 0 0;
    text-align: center;
    font-size: 14px;
    color: var(--muted);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
}
.products-soon-note i { color: var(--p); }
.products-soon-note a {
    font-weight: 600;
    color: var(--p);
    text-decoration: none;
}
.products-soon-note a:hover { text-decoration: underline; }

.eyebrow + h1,
.eyebrow + h2,
.eyebrow + h3 { margin-top: 18px; }

.ct-dropdown { position: relative; }
.ct-dropdown-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    text-align: left;
    cursor: pointer;
}
.ct-dropdown-btn i {
    color: var(--muted2);
    font-size: 12px;
    transition: transform .18s ease;
}
.ct-dropdown.open .ct-dropdown-btn {
    border-color: var(--p);
    box-shadow: 0 0 0 3px rgba(91, 92, 226, .18);
    background: var(--card-solid);
}
.ct-dropdown.open .ct-dropdown-btn i { transform: rotate(180deg); }
.ct-dropdown-value { color: var(--text); }
.ct-dropdown-value[data-placeholder] { color: var(--muted2); }

.ct-dropdown-menu {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 40;
    list-style: none;
    margin: 0;
    padding: 6px;
    max-height: 290px;
    overflow-y: auto;
    background: var(--card-solid);
    border: 1px solid var(--line);
    border-radius: var(--r2);
    box-shadow: var(--shadow);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
}
.ct-dropdown.open .ct-dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.ct-dropdown-menu li {
    padding: 9px 12px;
    border-radius: 8px;
    font-size: 14px;
    color: var(--text);
    cursor: pointer;
    transition: background .12s ease, color .12s ease;
}
.ct-dropdown-menu li:hover { background: var(--bg2); }
.ct-dropdown-menu li[aria-selected="true"] {
    background: rgba(91, 92, 226, .10);
    color: var(--p);
    font-weight: 600;
}

.ct-turnstile { margin: 2px 0; min-height: 65px; }

.product-soon { opacity: 1; cursor: default; }
.product-soon:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow3);
    border-color: rgba(91, 92, 226, .30);
}
.product-soon .product-card-icon {
    background: linear-gradient(135deg, rgba(91, 92, 226, .18), rgba(124, 58, 237, .14));
    color: var(--p);
}
.product-soon h3 { color: var(--text); }

.product-soon-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 2px;
}
.product-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--p);
    background: rgba(91, 92, 226, .10);
    border: 1px solid rgba(91, 92, 226, .22);
    padding: 5px 11px;
    border-radius: 999px;
    white-space: nowrap;
}
.product-status-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--p);
    animation: pulseDot 1.8s ease-out infinite;
}
@keyframes pulseDot {
    0%   { box-shadow: 0 0 0 0 rgba(91, 92, 226, .45); }
    70%  { box-shadow: 0 0 0 7px rgba(91, 92, 226, 0); }
    100% { box-shadow: 0 0 0 0 rgba(91, 92, 226, 0); }
}

.products-cta-strip { margin-top: 30px; }
.products-cta-card {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 24px;
    padding: clamp(24px, 4vw, 36px);
    background: linear-gradient(135deg, rgba(91, 92, 226, .08), rgba(124, 58, 237, .06));
    border: 1px solid rgba(91, 92, 226, .22);
    border-radius: var(--r);
}
.products-cta-card h3 { margin: 0 0 6px; font-size: clamp(19px, 2.4vw, 24px); }
.products-cta-card p { margin: 0; color: var(--muted); font-size: 14.5px; max-width: 58ch; line-height: 1.6; }
.products-cta-actions { display: flex; gap: 10px; flex-wrap: wrap; }

@media (max-width: 760px) {
    .products-cta-card { grid-template-columns: 1fr; }
}

.legal-doc {
    max-width: 820px;
    padding: clamp(50px, 8vw, 100px) 24px;
}
.legal-head { margin-bottom: 40px; }
.legal-updated {
    color: var(--muted2);
    font-size: 13px;
    margin: 14px 0 18px;
}
.legal-head .lead { margin: 0; }
.legal-body {
    display: flex;
    flex-direction: column;
    gap: 28px;
}
.legal-section h2 {
    font-size: clamp(18px, 2.4vw, 21px);
    margin: 0 0 8px;
}
.legal-section p {
    margin: 0;
    color: var(--muted);
    line-height: 1.7;
    font-size: 15px;
}
.legal-section p + p { margin-top: 12px; }
.legal-section strong { color: var(--text); font-weight: 600; }
.legal-section ul {
    margin: 12px 0 0;
    padding-left: 20px;
    display: flex;
    flex-direction: column;
    gap: 7px;
    color: var(--muted);
    line-height: 1.65;
    font-size: 15px;
}
.legal-section li { padding-left: 4px; }
.legal-body .lead { margin: 0; }
.legal-disclaimer {
    margin-top: 40px;
    padding: 16px 18px;
    border: 1px dashed var(--line);
    border-radius: var(--r3);
    background: var(--bg2);
    color: var(--muted2);
    font-size: 13px;
    line-height: 1.6;
}

.legal-hub { padding: clamp(50px, 8vw, 100px) 0; }
.legal-hub .legal-head {
    text-align: center;
    max-width: 640px;
    margin: 0 auto 40px;
}
.legal-hub-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
.legal-hub-card {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 26px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r);
    text-decoration: none;
    color: var(--text);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.legal-hub-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow2);
    border-color: rgba(91, 92, 226, .30);
}
.legal-hub-ico {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, rgba(91, 92, 226, .16), rgba(124, 58, 237, .12));
    color: var(--p);
    font-size: 18px;
}
.legal-hub-card h3 { margin: 6px 0 0; font-size: 18px; }
.legal-hub-card p { margin: 0; color: var(--muted); font-size: 14px; flex: 1; }
.legal-hub-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 6px;
    color: var(--p);
    font-weight: 600;
    font-size: 14px;
}
.legal-hub-link i { transition: transform .18s ease; }
.legal-hub-card:hover .legal-hub-link i { transform: translateX(3px); }

@media (max-width: 760px) {
    .legal-hub-grid { grid-template-columns: 1fr; }
}

.products-vision { padding: clamp(18px, 3vw, 28px) 0 clamp(30px, 5vw, 50px); }
.products-vision-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: clamp(28px, 5vw, 56px);
    align-items: start;
}
.products-vision-intro h2 {
    font-size: clamp(24px, 3.2vw, 34px);
    line-height: 1.2;
    margin: 0 0 16px;
}
.products-vision-intro p {
    color: var(--muted);
    line-height: 1.7;
    margin: 0 0 14px;
    max-width: 56ch;
}
.products-vision-points {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.products-vision-points li { display: flex; gap: 14px; align-items: flex-start; }
.pvp-ico {
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    border-radius: 11px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, rgba(91, 92, 226, .16), rgba(124, 58, 237, .12));
    color: var(--p);
    font-size: 16px;
}
.products-vision-points b { display: block; font-size: 15px; margin-bottom: 3px; color: var(--text); }
.products-vision-points span { display: block; color: var(--muted); font-size: 13.5px; line-height: 1.6; }

.prod-spotlights { display: flex; flex-direction: column; gap: clamp(24px, 4vw, 44px); }
.prod-spot {
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    gap: clamp(24px, 4vw, 48px);
    align-items: center;
}
.prod-spot:nth-child(even) .prod-spot-visual { order: 2; }
.prod-spot-visual {
    position: relative;
    min-height: 300px;
    border-radius: var(--r);
    background: linear-gradient(150deg, #5b5ce2, #7c3aed);
    display: grid;
    place-items: center;
    overflow: hidden;
    box-shadow: var(--shadow2);
}
.prod-spot-visual::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: radial-gradient(120% 120% at 30% 18%, rgba(255, 255, 255, .28), transparent 55%);
}
.prod-spot-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, .08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .08) 1px, transparent 1px);
    background-size: 30px 30px;
    -webkit-mask-image: radial-gradient(80% 80% at 50% 50%, #000, transparent);
            mask-image: radial-gradient(80% 80% at 50% 50%, #000, transparent);
}
.prod-spot-ico {
    position: relative;
    z-index: 1;
    font-size: clamp(72px, 9vw, 116px);
    color: #fff;
    filter: drop-shadow(0 8px 24px rgba(0, 0, 0, .25));
}
.prod-spot-status {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #fff;
    background: rgba(255, 255, 255, .15);
    border: 1px solid rgba(255, 255, 255, .30);
    padding: 6px 12px;
    border-radius: 999px;
    -webkit-backdrop-filter: blur(4px);
            backdrop-filter: blur(4px);
}
.prod-spot-status .product-status-dot { background: #fff; }
.prod-spot-tag {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--p);
}
.prod-spot-body h2 { font-size: clamp(28px, 4vw, 40px); line-height: 1.1; margin: 8px 0 14px; }
.prod-spot-desc { color: var(--muted); line-height: 1.7; font-size: 15.5px; margin: 0 0 20px; max-width: 54ch; }
.prod-spot-features {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px 18px;
}
.prod-spot-features li { display: flex; align-items: center; gap: 9px; font-size: 14px; color: var(--text); }
.prod-spot-features i { color: var(--success); font-size: 12px; flex-shrink: 0; }
.prod-launch {
    margin: 20px 0 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13.5px;
    color: var(--muted);
    background: var(--bg2);
    border: 1px solid var(--line);
    padding: 8px 14px;
    border-radius: 999px;
}
.prod-launch i { color: var(--p); }
.prod-launch b { color: var(--text); }

@media (max-width: 860px) {
    .products-vision-grid { grid-template-columns: 1fr; }
    .prod-spot { grid-template-columns: 1fr; }
    .prod-spot:nth-child(even) .prod-spot-visual { order: 0; }
    .prod-spot-visual { min-height: 220px; }
    .prod-spot-features { grid-template-columns: 1fr; }
}

.ct-hero-chips {
    list-style: none;
    margin: 22px 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
}
.ct-hero-chips li {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13.5px;
    font-weight: 500;
    color: var(--muted);
}
.ct-hero-chips i { color: var(--success); font-size: 13px; }

.ct-nocommit {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: 14px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--muted2);
}
.ct-nocommit i { color: var(--success); margin-top: 2px; }

.ct-notes {
    list-style: none;
    margin: 4px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 11px;
}
.ct-notes li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    color: var(--muted);
}
.ct-notes li i {
    color: var(--p);
    margin-top: 2px;
    width: 16px;
    text-align: center;
    flex-shrink: 0;
}
.ct-channels-label { display: block; font-size: 13px; color: var(--muted2); margin-bottom: 10px; }

.ct-faq { padding-top: clamp(20px, 4vw, 40px); }
.ct-faq-list {
    max-width: 760px;
    margin: 28px auto 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.ct-faq-item {
    border: 1px solid var(--line);
    border-radius: var(--r2);
    background: var(--card);
    overflow: hidden;
    transition: border-color .15s ease;
}
.ct-faq-item[open] { border-color: rgba(91, 92, 226, .30); }
.ct-faq-item summary {
    list-style: none;
    cursor: pointer;
    padding: 16px 20px;
    font-weight: 600;
    font-size: 15px;
    color: var(--text);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.ct-faq-item summary::-webkit-details-marker { display: none; }
.ct-faq-item summary::after {
    content: "\f078";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 12px;
    color: var(--muted2);
    transition: transform .2s ease, color .2s ease;
    flex-shrink: 0;
}
.ct-faq-item[open] summary::after { transform: rotate(180deg); color: var(--p); }
.ct-faq-item p {
    margin: 0;
    padding: 0 20px 18px;
    color: var(--muted);
    line-height: 1.7;
    font-size: 14.5px;
}

.prod-spot-visual {
    background: linear-gradient(150deg, rgba(91, 92, 226, .10), rgba(124, 58, 237, .055));
    border: 1px solid var(--line);
    box-shadow: none;
}
.prod-spot-visual::before {
    background: radial-gradient(120% 120% at 30% 18%, rgba(91, 92, 226, .14), transparent 58%);
}
.prod-spot-visual::after {
    background-image:
        linear-gradient(rgba(91, 92, 226, .07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(91, 92, 226, .07) 1px, transparent 1px);
}
.prod-spot-ico { color: var(--p); filter: none; }
.prod-spot-mark { position: relative; z-index: 1; display: inline-flex; }
.prod-spot-mark svg { width: clamp(74px, 9vw, 116px); height: auto; color: var(--p); }
.prod-spot-status {
    color: var(--p);
    background: var(--card-solid);
    border: 1px solid rgba(91, 92, 226, .22);
    -webkit-backdrop-filter: none;
            backdrop-filter: none;
}
.prod-spot-status .product-status-dot { background: var(--p); }

.products-pitch { padding: clamp(30px, 5vw, 56px) 0; }
.pitch-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(28px, 5vw, 56px);
    align-items: center;
    padding: clamp(28px, 4vw, 44px);
    border: 1px solid rgba(91, 92, 226, .22);
    border-radius: var(--r);
    background: linear-gradient(135deg, rgba(91, 92, 226, .07), rgba(124, 58, 237, .05));
}
.pitch-intro h2 { font-size: clamp(24px, 3.2vw, 32px); line-height: 1.15; margin: 10px 0 14px; }
.pitch-intro p { color: var(--muted); line-height: 1.7; margin: 0; max-width: 46ch; }
.pitch-form { display: flex; flex-direction: column; gap: 14px; }

@media (max-width: 860px) {
    .pitch-card { grid-template-columns: 1fr; }
}

.ct-lead2 {
    margin: 4px auto 0;
    max-width: 60ch;
    color: var(--muted);
    font-size: clamp(16px, 1.4vw, 18px);
    line-height: 1.65;
}

.faq-hero { padding: clamp(50px, 8vw, 90px) 0 clamp(18px, 4vw, 32px); }
.faq-body { padding-bottom: clamp(40px, 7vw, 80px); }
.faq-group { max-width: 820px; margin: 0 auto clamp(28px, 4vw, 44px); }
.faq-group-title {
    font-size: clamp(18px, 2.6vw, 22px);
    margin: 0 0 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line);
}
.faq-group .ct-faq-list { max-width: none; margin-top: 0; }
.faq-cta {
    max-width: 820px;
    margin: clamp(20px, 4vw, 40px) auto 0;
    padding-top: clamp(20px, 4vw, 32px);
    border-top: 1px solid var(--line);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    text-align: center;
}
.faq-cta p { margin: 0; font-size: 17px; font-weight: 600; color: var(--text); }

.ct-hero .lead { margin-left: auto; margin-right: auto; }
.ct-actions .ct-turnstile { margin-left: auto; margin-bottom: 0; }
.ct-actions + .ct-status { margin-top: 12px; }

.term-title::after {
    content: "";
    display: inline-block;
    width: 3px;
    height: 0.95em;
    margin-left: 8px;
    border-radius: 1px;
    background: var(--p);
    vertical-align: -0.08em;
    animation: caretBlink 1.1s steps(1) infinite;
}
@keyframes caretBlink {
    0%, 50%      { opacity: 1; }
    50.01%, 100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .term-title::after { animation: none; }
}

@media (max-width: 560px) {
    .ct-actions .ct-turnstile { margin-left: 0; }
}

.products-hero h1,
.products-vision-intro h2,
.ppc-text h2 { text-wrap: balance; }

.prod-spot-name {
    letter-spacing: -.01em;
    background: linear-gradient(92deg, var(--text) 35%, var(--p));
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.products-pitch-cta { padding: clamp(20px, 4vw, 40px) 0; }
.ppc-card {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: clamp(20px, 4vw, 40px);
    padding: clamp(26px, 4vw, 40px);
    border: 1px solid rgba(91, 92, 226, .22);
    border-radius: var(--r);
    background: linear-gradient(135deg, rgba(91, 92, 226, .07), rgba(124, 58, 237, .05));
}
.ppc-text h2 { font-size: clamp(22px, 3vw, 30px); line-height: 1.15; margin: 10px 0 10px; }
.ppc-text p { margin: 0; color: var(--muted); line-height: 1.7; max-width: 60ch; }
.ppc-card .btn { white-space: nowrap; }
@media (max-width: 760px) { .ppc-card { grid-template-columns: 1fr; } }

.pm-overlay {
    position: fixed;
    inset: 0;
    z-index: 200;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(15, 23, 42, .55);
    -webkit-backdrop-filter: blur(4px);
            backdrop-filter: blur(4px);
    opacity: 0;
    transition: opacity .22s ease;
}
.pm-overlay.open { opacity: 1; }
.pm-overlay[hidden] { display: none; }
.pm-dialog {
    position: relative;
    width: min(560px, 100%);
    max-height: 90vh;
    overflow-y: auto;
    background: var(--card-solid);
    border: 1px solid var(--line);
    border-radius: var(--r);
    box-shadow: var(--shadow3);
    padding: clamp(26px, 4vw, 40px);
    transform: translateY(14px) scale(.97);
    opacity: 0;
    transition: transform .26s cubic-bezier(.2, .8, .2, 1), opacity .26s ease;
}
.pm-overlay.open .pm-dialog { transform: none; opacity: 1; }
.pm-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    background: transparent;
    border: 1px solid var(--line);
    color: var(--muted);
    cursor: pointer;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.pm-close:hover { background: var(--bg2); color: var(--text); }
.pm-head { margin-bottom: 20px; padding-right: 40px; }
.pm-head h2 { font-size: clamp(20px, 3vw, 26px); line-height: 1.2; margin: 10px 0 10px; }
.pm-head p { margin: 0; color: var(--muted); line-height: 1.65; font-size: 14.5px; }

@media (prefers-reduced-motion: reduce) {
    .pm-overlay, .pm-dialog { transition: none; }
}

@media (min-width: 768px) {
    .home-hero h1,
    .about-studio-intro h1,
    .sol-hero h1,
    .products-hero h1,
    .ct-hero h1,
    .faq-hero h1 { white-space: nowrap; }
}

@keyframes prodFloat {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-7px); }
}
@keyframes prodGlow {
    0%, 100% { opacity: .65; }
    50%      { opacity: 1; }
}
.prod-spot-ico {
    animation: prodFloat 3.6s ease-in-out infinite;
    will-change: transform;
}
.prod-anim-et { animation-delay: 0s; }
.prod-anim-pr { animation-delay: .6s; }
.prod-anim-wh { animation-delay: 1.1s; }
.prod-spot-visual::before { animation: prodGlow 4.5s ease-in-out infinite; }

@media (prefers-reduced-motion: reduce) {
    .prod-spot-ico { animation: none; }
    .prod-spot-visual::before { animation: none; }
}

.ct-abbr {
    text-decoration: underline dotted;
    text-underline-offset: 3px;
    cursor: help;
}

.faq-hero { text-align: center; }
.faq-hero-inner { max-width: 720px; margin: 0 auto; }
.faq-hero .lead { margin-left: auto; margin-right: auto; }

.faq-tabs {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 auto clamp(24px, 4vw, 36px);
}
.faq-tab {
    padding: 10px 18px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: var(--card);
    color: var(--muted);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.faq-tab:hover { color: var(--text); border-color: rgba(91, 92, 226, .30); }
.faq-tab.is-active {
    background: linear-gradient(135deg, var(--p), var(--p2));
    border-color: transparent;
    color: #fff;
    box-shadow: 0 6px 16px rgba(91, 92, 226, .25);
}
.faq-panels { max-width: 760px; margin: 0 auto; }
.faq-panel { display: none; }
.faq-panel.is-active { display: block; animation: faqFade .25s ease; }
.faq-panel .ct-faq-list { max-width: none; margin-top: 0; }
@keyframes faqFade {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: none; }
}

img.prod-spot-mark {
    width: clamp(74px, 9vw, 116px);
    height: auto;
    display: block;
}

.ct-field-grow { flex: 1; display: flex; flex-direction: column; }
.ct-field-grow .ct-textarea { flex: 1; min-height: 160px; }

.sol-cta {
    background: linear-gradient(135deg, var(--p), var(--p2));
    border-color: transparent;
    box-shadow: 0 18px 40px -18px rgba(91, 92, 226, .55);
}
.sol-cta h3 { color: #fff; }
.sol-cta p  { color: rgba(255, 255, 255, .85); }
.sol-cta .btn-primary {
    background: #fff;
    color: var(--p);
    border-color: #fff;
}
.sol-cta .btn-primary:hover {
    background: #f1f1ff;
    transform: translateY(-1px);
    box-shadow: 0 10px 24px -10px rgba(0, 0, 0, .35);
}

.sol-est { padding: clamp(40px, 6vw, 80px) 0; }
.est-card {
    max-width: 860px;
    margin: clamp(24px, 4vw, 40px) auto 0;
    padding: clamp(22px, 3vw, 34px);
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r);
    box-shadow: var(--shadow);
}

.est-modes {
    display: inline-flex;
    padding: 4px;
    gap: 4px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--bg2);
    margin-bottom: 22px;
}
.est-mode {
    padding: 9px 20px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--muted);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: color .15s ease, background .15s ease;
}
.est-mode.is-active {
    background: linear-gradient(135deg, var(--p), var(--p2));
    color: #fff;
    box-shadow: 0 4px 12px rgba(91, 92, 226, .25);
}

.est-panel[hidden] { display: none; }
.est-hint { color: var(--muted); font-size: 14px; margin: 0 0 18px; }
.est-q { margin-bottom: 22px; }
.est-q h4, .est-sub {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--muted2);
    margin: 0 0 12px;
}
.est-sub { margin-top: 24px; }
.est-sub:first-of-type { margin-top: 0; }

.est-opts { display: flex; flex-wrap: wrap; gap: 10px; }
.est-chip {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--card-solid);
    font-size: 14px;
    font-weight: 500;
    color: var(--text);
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.est-chip input { position: absolute; opacity: 0; pointer-events: none; }
.est-chip:hover { border-color: rgba(91, 92, 226, .35); }
.est-chip:has(input:checked) {
    border-color: var(--p);
    background: rgba(91, 92, 226, .10);
    color: var(--p);
}
.est-see { margin-top: 6px; }

.est-svc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 10px;
}
.est-svc {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: var(--r3);
    background: var(--card-solid);
    text-align: left;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.est-svc:hover { border-color: rgba(91, 92, 226, .35); }
.est-svc.is-on {
    border-color: var(--p);
    background: rgba(91, 92, 226, .07);
    box-shadow: inset 0 0 0 1px var(--p);
}
.est-svc-name { font-size: 14.5px; font-weight: 600; color: var(--text); }
.est-svc-price { font-size: 12.5px; color: var(--muted2); }
.est-svc.is-on .est-svc-price { color: var(--p); }

.est-mods-row { display: flex; flex-wrap: wrap; gap: 10px; }
.est-mod {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 16px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--card-solid);
    font-size: 14px;
    font-weight: 500;
    color: var(--text);
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.est-mod i { font-size: 11px; color: var(--muted2); transition: color .15s ease; }
.est-mod:hover { border-color: rgba(91, 92, 226, .35); }
.est-mod.is-on { border-color: var(--p); background: rgba(91, 92, 226, .10); color: var(--p); }
.est-mod.is-on i { color: var(--p); }

.est-summary {
    margin-top: 26px;
    padding: clamp(18px, 2.5vw, 26px);
    border: 1px solid rgba(91, 92, 226, .22);
    border-radius: var(--r2);
    background: linear-gradient(135deg, rgba(91, 92, 226, .06), rgba(124, 58, 237, .04));
}
.est-summary > h3 {
    font-size: 16px;
    margin: 0 0 14px;
    letter-spacing: -.01em;
}
.est-none { color: var(--muted); font-size: 14px; margin: 0; }
.est-lines { list-style: none; margin: 0 0 16px; padding: 0; }
.est-lines li {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 0;
    border-bottom: 1px dashed var(--line);
    font-size: 14.5px;
}
.est-lines li b { white-space: nowrap; color: var(--text); font-weight: 600; }
.est-line-note span, .est-line-note b { color: var(--muted2); font-style: italic; font-weight: 500; }

.est-total {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 4px;
}
.est-total-label { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--muted2); }
.est-total-vals { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.est-total-vals b:first-child { font-size: 20px; color: var(--p); letter-spacing: -.01em; }
.est-total-vals b:last-child { font-size: 14px; color: var(--muted); font-weight: 600; }
.est-timeline { margin-top: 12px; font-size: 14px; color: var(--muted); }
.est-timeline i { color: var(--p); margin-right: 4px; }
.est-timeline b { color: var(--text); }
.est-disclaimer { margin: 16px 0 0; font-size: 12.5px; line-height: 1.5; color: var(--muted2); }

.est-form { margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--line); }
.est-form-intro { margin: 0 0 16px; font-size: 14px; color: var(--muted); }
.est-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.est-form .ct-turnstile { margin-bottom: 16px; }

@media (max-width: 620px) {
    .est-form-row { grid-template-columns: 1fr; }
    .est-modes { width: 100%; }
    .est-mode { flex: 1; text-align: center; }
}

.home-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 28px; }
.home-chip {
    padding: 6px 14px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--card-solid);
    font-size: 13px;
    font-weight: 600;
    color: var(--muted);
    letter-spacing: .01em;
}

.home-caps { padding: clamp(40px, 7vw, 90px) 0 clamp(20px, 3vw, 40px); }
.home-caps-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 16px;
}
.home-cap {
    padding: clamp(20px, 2.4vw, 28px);
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r);
    transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.home-cap:hover { border-color: rgba(91, 92, 226, .30); transform: translateY(-3px); box-shadow: var(--shadow2); }
.home-cap-ico {
    width: 46px; height: 46px;
    display: grid; place-items: center;
    border-radius: 12px;
    background: rgba(91, 92, 226, .10);
    color: var(--p);
    font-size: 19px;
    margin-bottom: 16px;
}
.home-cap h3 { font-size: 16.5px; margin: 0 0 8px; letter-spacing: -.01em; }
.home-cap p { margin: 0; font-size: 14px; line-height: 1.6; color: var(--muted); }
.home-caps-foot { margin-top: 26px; }
.home-textlink {
    display: inline-flex; align-items: center; gap: 8px;
    font-weight: 600; font-size: 15px; color: var(--p); text-decoration: none;
}
.home-textlink i { transition: transform .18s ease; }
.home-textlink:hover i { transform: translateX(4px); }

.home-estimate-section { padding: clamp(20px, 3vw, 40px) 0; }
.home-estimate {
    display: flex; align-items: center; justify-content: space-between;
    gap: 24px; flex-wrap: wrap;
    padding: clamp(26px, 3.5vw, 40px);
    border-radius: var(--r);
    background: linear-gradient(135deg, var(--p), var(--p2));
    box-shadow: 0 20px 44px -20px rgba(91, 92, 226, .6);
}
.home-estimate-text { max-width: 60ch; }
.home-estimate h3 { font-size: clamp(20px, 2.4vw, 26px); margin: 0 0 8px; color: #fff; letter-spacing: -.015em; }
.home-estimate p { margin: 0; font-size: 15px; line-height: 1.55; color: rgba(255, 255, 255, .9); }
.home-estimate .btn-primary { background: #fff; color: var(--p); border-color: #fff; flex-shrink: 0; }
.home-estimate .btn-primary:hover { background: #f1f1ff; transform: translateY(-1px); box-shadow: 0 10px 24px -10px rgba(0, 0, 0, .35); }

.home-prod-section { padding: clamp(40px, 7vw, 90px) 0 clamp(20px, 3vw, 40px); }
.home-prod {
    display: grid;
    grid-template-columns: 1.3fr .9fr;
    align-items: center;
    gap: clamp(24px, 4vw, 48px);
}
.home-prod-text h2 { font-size: clamp(24px, 3vw, 34px); margin: 12px 0 14px; letter-spacing: -.02em; }
.home-prod-text p { margin: 0 0 22px; font-size: 15.5px; line-height: 1.65; color: var(--muted); max-width: 54ch; }
.home-prod-marks { display: flex; flex-direction: column; gap: 12px; }
.home-prod-marks span {
    padding: 18px 24px;
    border: 1px solid var(--line);
    border-radius: var(--r2);
    background: var(--card);
    font-size: 19px;
    font-weight: 700;
    letter-spacing: -.01em;
    color: var(--text);
    text-align: center;
    transition: border-color .18s ease, color .18s ease;
}
.home-prod-marks span:hover { border-color: rgba(91, 92, 226, .35); color: var(--p); }

@media (max-width: 820px) {
    .home-prod { grid-template-columns: 1fr; }
    .home-prod-marks { flex-direction: row; flex-wrap: wrap; }
    .home-prod-marks span { flex: 1; min-width: 120px; font-size: 16px; padding: 14px 16px; }
}
@media (max-width: 640px) {
    .home-estimate { flex-direction: column; align-items: flex-start; }
}

.products-hero { text-align: center; }
.products-hero .lead { margin-left: auto; margin-right: auto; }

.sol-hero-actions {
    display: flex; gap: 12px; justify-content: center; flex-wrap: wrap;
    margin-top: clamp(24px, 3.5vw, 36px);
}

.sol-build { padding: 0 0 clamp(40px, 6vw, 80px); }
.sb-card {
    max-width: 820px;
    margin: clamp(24px, 4vw, 40px) auto 0;
    padding: clamp(24px, 3vw, 38px);
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r);
    box-shadow: var(--shadow);
}

.sb-progress { display: flex; align-items: flex-start; justify-content: center; margin-bottom: 30px; }
.sb-dot { position: relative; flex: 1; max-width: 150px; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.sb-dot-n {
    width: 34px; height: 34px; border-radius: 50%;
    display: grid; place-items: center;
    background: var(--bg2); border: 1px solid var(--line);
    font-weight: 700; font-size: 14px; color: var(--muted); z-index: 1;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.sb-dot.is-active .sb-dot-n { background: linear-gradient(135deg, var(--p), var(--p2)); color: #fff; border-color: transparent; }
.sb-dot.is-done .sb-dot-n { background: rgba(91, 92, 226, .15); color: var(--p); border-color: transparent; }
.sb-dot-l { font-size: 12.5px; color: var(--muted); font-weight: 600; text-align: center; }
.sb-dot.is-active .sb-dot-l { color: var(--text); }
.sb-dot:not(:last-child)::after {
    content: ""; position: absolute; top: 17px; left: 50%;
    width: 100%; height: 2px; background: var(--line); z-index: 0;
}
.sb-dot.is-done:not(:last-child)::after { background: var(--p); }

.sb-step[hidden] { display: none; }
.sb-q { font-size: 16px; font-weight: 700; margin: 0 0 16px; letter-spacing: -.01em; }
.sb-block { margin-bottom: 26px; }
.sb-block:last-child { margin-bottom: 0; }

.sb-cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.sb-cat {
    display: flex; flex-direction: column; gap: 5px;
    padding: 16px;
    border: 1px solid var(--line); border-radius: var(--r3);
    background: var(--card-solid); text-align: left; cursor: pointer;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.sb-cat:hover { border-color: rgba(91, 92, 226, .35); }
.sb-cat.is-on { border-color: var(--p); background: rgba(91, 92, 226, .07); box-shadow: inset 0 0 0 1px var(--p); }
.sb-cat-name { font-size: 15px; font-weight: 600; color: var(--text); }
.sb-cat-desc { font-size: 13px; color: var(--muted); line-height: 1.5; }

.sb-opts { display: flex; flex-wrap: wrap; gap: 10px; }

.sb-review-wrap { margin-bottom: 24px; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.sb-sub { font-size: 13px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--muted2); margin: 0 0 12px; }
.sb-review ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.sb-review li { padding: 6px 13px; border-radius: 999px; background: rgba(91, 92, 226, .10); color: var(--p); font-size: 13px; font-weight: 600; }
.sb-review-empty { color: var(--muted); font-size: 14px; margin: 0; }

.sb-form-intro { margin: 0 0 16px; font-size: 14px; color: var(--muted); }
.sb-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.sb-form .ct-field { margin-bottom: 16px; }
.sb-form .ct-turnstile { margin-bottom: 16px; }

.sb-nav { display: flex; gap: 12px; margin-top: 28px; align-items: center; }
.sb-next { margin-left: auto; }
.sb-nav-note { margin-left: auto; display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--muted); }
.sb-nav-note i { color: var(--p); }
.sb-next:disabled, .sb-next.is-disabled {
    opacity: .5;
    cursor: not-allowed;
    box-shadow: none;
    transform: none;
}

@media (max-width: 600px) {
    .sb-form-row { grid-template-columns: 1fr; }
    .sb-dot-l { font-size: 11px; }
}

.home-hero { padding: clamp(62px, 10vw, 124px) 0 clamp(28px, 4vw, 52px); }
.home-caps { padding: clamp(22px, 3.5vw, 46px) 0 clamp(14px, 2vw, 26px); }
.home-caps .section-head { margin-bottom: clamp(20px, 3vw, 32px); }
.home-cap { padding: clamp(16px, 2vw, 22px); }
.home-cap-ico { width: 42px; height: 42px; font-size: 17px; margin-bottom: 12px; }
.home-cap h3 { font-size: 15.5px; }
.home-cap p { font-size: 13.5px; }
.home-prod-section { padding: clamp(28px, 4vw, 58px) 0; }
.home-cta-section { padding-bottom: clamp(50px, 7vw, 90px); }

.home-hero-grid {
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    gap: clamp(32px, 5vw, 64px);
    align-items: center;
}
.home-hero-text { min-width: 0; }
.home-hero h1 { white-space: normal; }           
.home-hero-text .lead { max-width: 52ch; }

.home-hero-visual {
    position: relative;
    min-height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.hv-main {
    position: relative;
    width: min(100%, 330px);
    background: #11131a;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 16px;
    box-shadow: 0 34px 64px -26px rgba(15, 17, 26, .55), 0 0 0 1px rgba(91, 92, 226, .14);
    overflow: hidden;
    animation: hvFloat 6s ease-in-out infinite;
}
.hv-titlebar { display: flex; gap: 7px; padding: 14px 16px; border-bottom: 1px solid rgba(255, 255, 255, .06); }
.hv-titlebar span { width: 11px; height: 11px; border-radius: 50%; background: rgba(255, 255, 255, .16); }
.hv-main-body { padding: 22px 20px 24px; }
.hv-chart { display: flex; align-items: flex-end; gap: 9px; height: 116px; margin-bottom: 18px; }
.hv-chart span {
    flex: 1; height: var(--h);
    background: linear-gradient(180deg, #7c7dff, #5b5ce2);
    border-radius: 6px 6px 3px 3px;
    transform-origin: bottom;
    animation: hvBar 3.2s ease-in-out infinite;
}
.hv-chart span:nth-child(2) { animation-delay: .25s; }
.hv-chart span:nth-child(3) { animation-delay: .5s; }
.hv-chart span:nth-child(4) { animation-delay: .75s; }
.hv-chart span:nth-child(5) { animation-delay: 1s; }
.hv-chart span:nth-child(6) { animation-delay: 1.25s; }
.hv-rows { display: flex; flex-direction: column; gap: 9px; }
.hv-rows span { height: 9px; border-radius: 5px; background: rgba(255, 255, 255, .08); }
.hv-rows span:nth-child(1) { width: 92%; }
.hv-rows span:nth-child(2) { width: 68%; }
.hv-rows span:nth-child(3) { width: 50%; }

.hv-float {
    position: absolute;
    background: var(--card-solid);
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: var(--shadow2);
}
.hv-browser { top: 2px; right: -8px; width: 152px; overflow: hidden; animation: hvFloat 5.4s ease-in-out infinite .4s; }
.hv-browser-bar { display: flex; align-items: center; gap: 5px; padding: 8px 10px; border-bottom: 1px solid var(--line); }
.hv-browser-bar i { width: 7px; height: 7px; border-radius: 50%; background: var(--line); }
.hv-url { flex: 1; height: 7px; margin-left: 6px; border-radius: 4px; background: rgba(91, 92, 226, .20); }
.hv-browser-body { padding: 12px; display: flex; flex-direction: column; gap: 7px; }
.hv-browser-body span { height: 8px; border-radius: 4px; background: var(--line); }
.hv-browser-body span.short { width: 52%; background: rgba(91, 92, 226, .28); }

.hv-term {
    bottom: 12px; left: -12px; width: 184px; padding: 13px 14px;
    background: #0d0f15; color: #cdd2e0;
    font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 12px;
    display: flex; flex-direction: column; gap: 6px;
    animation: hvFloat 6.6s ease-in-out infinite .8s;
}
.hv-term-line b { color: #9b9cff; }
.hv-ok { color: #4ade80; }

.hv-badge {
    position: absolute;
    display: inline-flex; align-items: center; gap: 6px;
    padding: 7px 13px; border-radius: 999px;
    background: var(--card-solid); border: 1px solid var(--line);
    font-size: 12.5px; font-weight: 700; color: var(--p);
    box-shadow: var(--shadow2);
}
.hv-badge i { font-size: 11px; }
.hv-badge-api { top: 38%; left: -20px; animation: hvFloat 5s ease-in-out infinite .2s; }
.hv-badge-db { bottom: 26%; right: -16px; animation: hvFloat 5.8s ease-in-out infinite .6s; }

@keyframes hvFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes hvBar  { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(.82); } }

@media (max-width: 940px) {
    .home-hero-grid { grid-template-columns: 1fr; }
    .home-hero-visual { min-height: 340px; margin-top: 8px; }
}
@media (max-width: 560px) {
    .home-hero-visual { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .hv-main, .hv-float, .hv-badge, .hv-chart span { animation: none; }
}

@media (min-width: 920px) { .home-caps-4 { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 919px) and (min-width: 560px) { .home-caps-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 559px) { .home-caps-4 { grid-template-columns: 1fr; } }

.hv-badge-db { top: 40%; right: -20px; bottom: auto; animation: hvFloat 5.8s ease-in-out infinite .6s; }

.hv-sys {
    top: 6px; left: -16px;
    display: flex; align-items: center; gap: 9px;
    padding: 9px 13px;
    animation: hvFloat 5.6s ease-in-out infinite .3s;
}
.hv-sys-dot {
    width: 9px; height: 9px; border-radius: 50%;
    background: #34d27b;
    box-shadow: 0 0 0 4px rgba(52, 210, 123, .16);
    animation: hvPulse 2s ease-in-out infinite;
}
.hv-sys-txt { display: flex; flex-direction: column; line-height: 1.15; }
.hv-sys-txt b { font-size: 12px; font-weight: 700; color: var(--text); }
.hv-sys-txt span { font-size: 10.5px; color: var(--muted2); }

.hv-perf {
    bottom: 16px; right: -14px;
    display: flex; align-items: center; gap: 10px;
    padding: 9px 13px;
    animation: hvFloat 6.2s ease-in-out infinite 1s;
}
.hv-perf i { color: var(--p); font-size: 15px; }
.hv-perf-txt { display: flex; flex-direction: column; line-height: 1.15; }
.hv-perf-txt b { font-size: 13.5px; font-weight: 800; color: var(--text); letter-spacing: -.01em; }
.hv-perf-txt span { font-size: 10.5px; color: var(--muted2); }

@keyframes hvPulse { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }

@media (prefers-reduced-motion: reduce) {
    .hv-sys, .hv-perf, .hv-sys-dot { animation: none; }
}

.home-hero-text .home-actions { margin-top: 26px; }

.home-prod-marks { display: flex; flex-direction: column; gap: 12px; }
.home-prod-mark {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    column-gap: 14px;
    align-items: center;
    padding: 15px 18px;
    border: 1px solid var(--line);
    border-radius: var(--r2);
    background: var(--card);
    text-decoration: none;
    transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.home-prod-mark:hover { border-color: rgba(91, 92, 226, .35); transform: translateY(-2px); box-shadow: var(--shadow2); }
.home-prod-marks .hpm-ico {
    grid-row: 1 / 3;
    width: 42px; height: 42px;
    display: grid; place-items: center;
    border-radius: 11px;
    background: rgba(91, 92, 226, .10);
    color: var(--p);
    font-size: 18px;
    padding: 0; border: 0; text-align: center;
}
.home-prod-marks .hpm-name {
    align-self: end;
    font-size: 16px; font-weight: 700; color: var(--text);
    padding: 0; border: 0; background: none; text-align: left;
}
.home-prod-marks .hpm-desc {
    align-self: start;
    font-size: 12.5px; font-weight: 500; color: var(--muted);
    padding: 0; border: 0; background: none; text-align: left;
}
.home-prod-marks .hpm-name:hover,
.home-prod-marks .hpm-desc:hover,
.home-prod-marks .hpm-ico:hover { border-color: transparent; transform: none; }
@media (max-width: 820px) { .home-prod-marks { flex-direction: column; } }

.hv-browser { width: 170px; }
.hv-browser-body { padding: 12px; display: flex; flex-direction: column; gap: 7px; }
.hv-browser-body .hv-b-hero {
    height: 30px; border-radius: 6px;
    background: linear-gradient(135deg, rgba(91, 92, 226, .32), rgba(124, 58, 237, .20));
}
.hv-browser-body .hv-b-line { height: 7px; border-radius: 4px; background: var(--line); width: 100%; }
.hv-browser-body .hv-b-line.short { width: 62%; }
.hv-browser-body .hv-b-btn {
    height: 13px; width: 46px; border-radius: 4px;
    background: var(--p); margin-top: 3px;
}

.about-mark-figure { position: static; }
.about-mark-grid { align-items: center; }

.about-mark-meanings {
    display: block;
    gap: 0;
    padding-bottom: 0;
}

.meaning-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 28px;
}
.meaning-tab {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--card);
    color: var(--muted);
    font: inherit;
    font-size: .9rem;
    font-weight: 600;
    letter-spacing: .01em;
    cursor: pointer;
    transition: color .2s, border-color .2s, background .2s;
}
.meaning-tab .mt-n {
    font-variant-numeric: tabular-nums;
    font-size: .72rem;
    opacity: .55;
}
.meaning-tab:hover { color: var(--text); border-color: var(--p); }
.meaning-tab.is-active { color: #fff; background: var(--p); border-color: var(--p); }
.meaning-tab.is-active .mt-n { opacity: .8; }
.meaning-tab:focus-visible { outline: 2px solid var(--p); outline-offset: 2px; }

.meaning-panels { position: relative; }
.meaning-block { display: none; }
.meaning-block.is-active { display: block; animation: mbFade .35s ease both; }
.meaning-block .meaning-num { display: none; } 
@keyframes mbFade {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: none; }
}

.about-story-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    gap: clamp(32px, 5vw, 64px);
    align-items: start;
    margin-top: 6px;
}
.about-story-text p {
    margin: 0 0 18px;
    font-size: 17px;
    line-height: 1.7;
    color: var(--muted);
}
.about-story-text p:last-child { margin-bottom: 0; }
.about-story-facts { display: flex; flex-direction: column; gap: 14px; }
.story-fact {
    border: 1px solid var(--line);
    border-left: 3px solid var(--p);
    border-radius: var(--r2);
    background: var(--card);
    padding: 16px 18px;
}
.story-fact b { display: block; color: var(--text); font-size: 15px; margin-bottom: 4px; }
.story-fact span { display: block; color: var(--muted); font-size: 14px; line-height: 1.5; }
@media (max-width: 760px) { .about-story-grid { grid-template-columns: 1fr; } }

.about-mark-grid { align-items: start; }
.about-mark-figure { position: static; }
.about-mark-stage,
.about-mark-stage[data-active],
.about-mark-stage[data-active="foot"] { transform: none; }

.meaning-panels { display: grid; }
.meaning-block {
    grid-column: 1;
    grid-row: 1;
    display: block;
    visibility: hidden;
    opacity: 0;
    transition: opacity .35s ease;
}
.meaning-block.is-active {
    visibility: visible;
    opacity: 1;
    animation: mbFade .35s ease both;
}

.home-prod-marks .hpm-ico .hpm-ico-img { width: 22px; height: 22px; display: block; }

.about-studio-intro .about-name-p {
    margin: 16px auto 0;
    max-width: 70ch;
    font-size: 16px;
    line-height: 1.7;
    color: var(--muted);
    text-wrap: pretty;
}
.about-studio-intro .about-name-bridge {
    color: var(--text);
    font-weight: 600;
}
.about-name-close {
    max-width: 72ch;
    margin: clamp(36px, 5vh, 56px) auto 0;
    text-align: center;
    font-size: 17px;
    line-height: 1.65;
    color: var(--text);
    text-wrap: pretty;
}

.about-name-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    gap: clamp(36px, 5vw, 72px);
    align-items: center;
}
.about-name-left { text-align: left; }
.about-name-left .lead { margin: 16px 0 0; max-width: none; }
.about-name-left .about-name-p {
    margin: 14px 0 0;
    max-width: none;
    font-size: 16px;
    line-height: 1.7;
    color: var(--muted);
    text-wrap: pretty;
}
.about-name-left .about-name-bridge { color: var(--text); font-weight: 600; }
.about-name-left .about-name-close {
    margin: 20px 0 0;
    max-width: none;
    text-align: left;
    font-size: 16px;
    line-height: 1.65;
    color: var(--text);
}

.about-name-right { display: flex; flex-direction: column; gap: clamp(20px, 3vw, 32px); }
.about-name-right .about-mark-figure { position: static; width: 100%; }
.about-name-right .about-mark-stage {
    max-width: 300px;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
}
.about-name-right .about-mark-meanings { width: 100%; }

@media (max-width: 860px) {
    .about-name-grid { grid-template-columns: 1fr; gap: 36px; }
    .about-name-right .about-mark-stage { max-width: 240px; }
}

.about-name-left .about-mark-meanings { margin-top: 26px; }

.about-name-right { justify-content: center; }
.about-name-right .about-mark-figure { width: 100%; }
.about-name-right .about-mark-stage {
    max-width: 480px;
    width: 100%;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
}
@media (max-width: 860px) {
    .about-name-right .about-mark-stage { max-width: 320px; }
}

.about-id-head { text-align: center; max-width: 760px; margin: 0 auto; }
.about-id-head .lead { margin: 16px auto 0; max-width: 64ch; }
.about-id-sub {
    margin: 14px auto 0;
    max-width: 66ch;
    font-size: 16px;
    line-height: 1.7;
    color: var(--muted);
    text-wrap: pretty;
}
.about-id-code {
    display: inline-block;
    margin-top: 22px;
    font-family: ui-monospace, "JetBrains Mono", "Cascadia Code", Menlo, Consolas, monospace;
    font-size: 14px;
    padding: 9px 16px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--card);
    color: var(--muted2);
}
.about-id-code .tok-k { color: var(--p); font-weight: 600; }
.about-id-code .tok-n { color: var(--text); }

.about-id-stage-wrap {
    display: flex;
    justify-content: center;
    margin: clamp(20px, 4vw, 44px) 0 clamp(10px, 2vw, 22px);
}
.about-id-stage-wrap .about-mark-stage {
    max-width: 460px;
    width: 100%;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
}

.about-id-caption {
    text-align: center;
    margin: 0 auto clamp(26px, 4vw, 42px);
    max-width: 54ch;
    font-size: 14px;
    color: var(--muted2);
}

.about-id-fronts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    align-items: stretch;
}
.id-front {
    position: relative;
    border: 1px solid var(--line);
    border-radius: var(--r2);
    background: var(--card);
    padding: 22px 22px 24px;
    cursor: pointer;
    transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.id-front-n {
    display: block;
    font-variant-numeric: tabular-nums;
    font-size: 13px;
    color: var(--muted2);
    margin-bottom: 10px;
}
.id-front-kicker {
    display: block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--p);
    margin-bottom: 6px;
}
.id-front h3 { font-size: 17px; line-height: 1.3; margin: 0 0 10px; color: var(--text); }
.id-front p { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--muted); }
.id-front.is-active {
    border-color: var(--p);
    box-shadow: inset 0 0 0 1px var(--p), var(--shadow);
    transform: translateY(-4px);
}
@media (max-width: 760px) {
    .about-id-fronts { grid-template-columns: 1fr; }
    .about-id-stage-wrap .about-mark-stage { max-width: 320px; }
}

.about-id-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    gap: clamp(40px, 5vw, 72px);
    align-items: center;
}
.about-id-left { text-align: left; }
.about-id-left .lead { margin: 16px 0 0; max-width: none; }
.about-id-sub {
    margin: 14px 0 0;
    max-width: none;
    font-size: 16px;
    line-height: 1.7;
    color: var(--muted);
    text-wrap: pretty;
}
.about-id-code {
    display: inline-block;
    margin-top: 20px;
    font-family: ui-monospace, "JetBrains Mono", "Cascadia Code", Menlo, Consolas, monospace;
    font-size: 14px;
    padding: 9px 16px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--card);
    color: var(--muted2);
}
.about-id-code .tok-k { color: var(--p); font-weight: 600; }
.about-id-code .tok-n { color: var(--text); }

.about-id-fronts { display: flex; flex-direction: column; margin-top: 28px; }
.id-front-row {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 16px;
    align-items: start;
    width: 100%;
    text-align: left;
    background: transparent;
    border: 0;
    border-left: 2px solid var(--line);
    padding: 16px 0 16px 18px;
    cursor: pointer;
    font: inherit;
    transition: border-color .25s ease;
}
.id-front-row + .id-front-row { margin-top: 2px; }
.ifr-num {
    font-variant-numeric: tabular-nums;
    font-size: 13px;
    font-weight: 600;
    color: var(--muted2);
    padding-top: 2px;
    transition: color .25s ease;
}
.ifr-text { display: block; }
.ifr-kicker {
    display: block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--p);
    margin-bottom: 4px;
}
.ifr-title { display: block; font-size: 16px; font-weight: 600; color: var(--text); line-height: 1.3; margin-bottom: 6px; }
.ifr-body { display: block; font-size: 14.5px; line-height: 1.6; color: var(--muted); }
.id-front-row.is-active { border-left-color: var(--p); }
.id-front-row.is-active .ifr-num { color: var(--p); }

.about-id-right { display: flex; justify-content: center; }
.about-id-right .about-mark-figure { width: 100%; }
.about-id-right .about-mark-stage {
    max-width: 440px;
    width: 100%;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
}

@media (max-width: 860px) {
    .about-id-grid { grid-template-columns: 1fr; gap: 36px; }
    .about-id-right { order: -1; }
    .about-id-right .about-mark-stage { max-width: 300px; }
}

.aid-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    gap: clamp(40px, 5vw, 72px);
    align-items: center;
}
.aid-text { text-align: left; }
.aid-text .lead { margin: 16px 0 0; max-width: none; }
.aid-sub {
    margin: 14px 0 0;
    font-size: 16px;
    line-height: 1.7;
    color: var(--muted);
    max-width: none;
    text-wrap: pretty;
}
.aid-visual { display: flex; justify-content: center; }

.codecard {
    width: 100%;
    max-width: 440px;
    border-radius: 14px;
    overflow: hidden;
    background: #0e1117;
    border: 1px solid #1e2430;
    box-shadow: var(--shadow2);
}
.codecard-bar {
    display: flex;
    gap: 7px;
    padding: 13px 16px;
    background: #161b22;
    border-bottom: 1px solid #1e2430;
}
.codecard-bar span { width: 11px; height: 11px; border-radius: 50%; background: #2c333f; }
.codecard-bar span:nth-child(1) { background: #ff5f56; }
.codecard-bar span:nth-child(2) { background: #ffbd2e; }
.codecard-bar span:nth-child(3) { background: #27c93f; }
.codecard-body {
    margin: 0;
    padding: 20px 22px;
    font-family: ui-monospace, "JetBrains Mono", "Cascadia Code", Menlo, Consolas, monospace;
    font-size: 14px;
    line-height: 1.85;
    color: #c9d1d9;
    white-space: pre;
    overflow-x: auto;
}
.codecard .cc-com { color: #6b7689; font-style: italic; }
.codecard .cc-key { color: #c792ea; }
.codecard .cc-type { color: #82aaff; }
.codecard .cc-hl {
    background: rgba(124, 58, 237, .28);
    border-radius: 4px;
    padding: 1px 4px;
    color: #d9c2ff;
    font-weight: 600;
}

.amk-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: clamp(36px, 5vw, 64px);
    align-items: center;
    margin-top: clamp(28px, 4vw, 48px);
}
.amk-figure { display: flex; justify-content: center; }
.amk-figure .about-mark-stage {
    max-width: 400px;
    width: 100%;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
}
.amk-list { display: flex; flex-direction: column; }

@media (max-width: 860px) {
    .aid-grid { grid-template-columns: 1fr; gap: 32px; }
    .amk-grid { grid-template-columns: 1fr; gap: 28px; }
    .amk-figure { order: -1; }
    .amk-figure .about-mark-stage { max-width: 280px; }
}

.about-name { padding: clamp(70px, 10vw, 120px) 0 clamp(30px, 5vw, 56px); }
.about-mark { padding: clamp(36px, 6vw, 72px) 0; }

.amk-grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
.amk-figure .about-mark-stage { max-width: 520px; }

@media (max-width: 860px) {
    .amk-grid { grid-template-columns: 1fr; }
    .amk-figure .about-mark-stage { max-width: 300px; }
}

.about-name {
    padding: clamp(80px, 11vw, 150px) 0 clamp(36px, 6vw, 64px);
    text-align: center;
}
.aid-grid {
    grid-template-columns: 1.05fr .95fr;
    gap: clamp(32px, 5vw, 64px);
    align-items: center;
}
.aid-text { text-align: center; min-width: 0; }
.aid-text .lead { max-width: 52ch; margin: 16px auto 0; }
.aid-sub { max-width: 56ch; margin: 14px auto 0; }
.aid-visual { align-items: center; min-height: 0; }

.ccd {
    width: 100%;
    max-width: 460px;
    border-radius: 16px;
    overflow: hidden;
    background: #0d1117;
    border: 1px solid #1f2632;
    box-shadow: 0 24px 60px -24px rgba(0, 0, 0, .65);
}
.ccd-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: #11161f;
    border-bottom: 1px solid #1f2632;
}
.ccd-dots { display: flex; gap: 7px; }
.ccd-dots i { width: 11px; height: 11px; border-radius: 50%; background: #2c333f; }
.ccd-dots i:nth-child(1) { background: #ff5f56; }
.ccd-dots i:nth-child(2) { background: #ffbd2e; }
.ccd-dots i:nth-child(3) { background: #27c93f; }
.ccd-file {
    font-family: ui-monospace, "JetBrains Mono", "Cascadia Code", Menlo, Consolas, monospace;
    font-size: 12.5px;
    color: #6b7689;
    letter-spacing: .02em;
}
.ccd-code {
    counter-reset: ln;
    list-style: none;
    margin: 0;
    padding: 18px 18px 20px;
    font-family: ui-monospace, "JetBrains Mono", "Cascadia Code", Menlo, Consolas, monospace;
    font-size: 13.5px;
    line-height: 2;
    color: #c9d1d9;
    overflow-x: auto;
}
.ccd-code li {
    counter-increment: ln;
    position: relative;
    padding-left: 40px;
    white-space: pre;
}
.ccd-code li::before {
    content: counter(ln);
    position: absolute;
    left: 0;
    width: 24px;
    text-align: right;
    color: #3b4452;
    font-variant-numeric: tabular-nums;
}
.ccd .cc-com { color: #6b7689; font-style: italic; }
.ccd .cc-key { color: #c792ea; }
.ccd .cc-type { color: #82aaff; }
.ccd .cc-hl {
    background: rgba(124, 58, 237, .28);
    border-radius: 4px;
    padding: 1px 5px;
    color: #d9c2ff;
    font-weight: 600;
}

.amk-grid { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); }
.amk-figure .about-mark-stage { max-width: 600px; }
@media (max-width: 860px) {
    .amk-grid { grid-template-columns: 1fr; }
    .amk-figure .about-mark-stage { max-width: 320px; }
}

.sol-caps-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 720px) { .sol-caps-grid { grid-template-columns: 1fr; } }

.sol-timeline {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 28px;
}
.sol-tl-item { position: relative; }
.sol-tl-marker {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: var(--card-solid);
    border: 1px solid var(--line);
    color: var(--p);
    font-weight: 800;
    font-size: 14px;
    letter-spacing: .04em;
    position: relative;
    z-index: 1;
    margin-bottom: 18px;
}
.sol-tl-item:not(:last-child) .sol-tl-marker::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 100%;
    width: calc(100% + 28px);
    height: 2px;
    background: var(--line);
    transform: translateY(-50%);
}
.sol-tl-body h3 { font-size: 16px; margin: 0 0 8px; color: var(--text); }
.sol-tl-body p { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--muted); }
@media (max-width: 760px) {
    .sol-timeline { grid-template-columns: 1fr; gap: 0; }
    .sol-tl-item { display: grid; grid-template-columns: 46px 1fr; gap: 18px; padding-bottom: 26px; }
    .sol-tl-marker { margin-bottom: 0; }
    .sol-tl-item:not(:last-child) .sol-tl-marker::after {
        top: 100%; left: 50%; width: 2px; height: calc(100% - 46px + 26px);
        transform: translateX(-50%);
    }
    .sol-tl-body { padding-top: 10px; }
}

.sb-hint {
    margin: 18px 0 0;
    padding: 10px 14px;
    border-radius: var(--r3);
    background: rgba(91, 92, 226, .08);
    border: 1px solid rgba(91, 92, 226, .28);
    color: var(--p);
    font-size: 14px;
    font-weight: 500;
}

.sb-form .ct-textarea { min-height: 184px; }

.sol-cta h3 { color: #fff; }
.sol-cta p { color: rgba(255, 255, 255, .9); }
.sol-cta .btn {
    background: #fff;
    color: var(--p);
    border-color: #fff;
}
.sol-cta .btn:hover { background: #f1f0ff; border-color: #f1f0ff; }

.sol-cap {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 18px;
    row-gap: 8px;
    align-items: start;
    flex-direction: initial;
    padding: 26px;
}
.sol-cap-ico {
    grid-row: 1 / span 2;
    align-self: start;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 13px;
    background: linear-gradient(135deg, rgba(91, 92, 226, .16), rgba(124, 58, 237, .10));
    border: 1px solid rgba(124, 58, 237, .25);
    color: var(--p);
    font-size: 20px;
    flex-shrink: 0;
}
.sol-cap h3 { grid-column: 2; margin: 0; font-size: 17px; line-height: 1.3; }
.sol-cap p { grid-column: 2; margin: 0; color: var(--muted); font-size: 14.5px; line-height: 1.6; }

.sb-mode { margin-bottom: 28px; }
.sb-mode-q {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: var(--muted2);
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: .07em;
}
.sb-mode-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sb-mode-opt {
    text-align: left;
    cursor: pointer;
    padding: 16px 18px;
    border: 1px solid var(--line);
    border-radius: var(--r3);
    background: var(--card-solid);
    display: flex;
    flex-direction: column;
    gap: 5px;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.sb-mode-opt:hover { border-color: var(--p); }
.sb-mode-opt.is-on { border-color: var(--p); box-shadow: inset 0 0 0 1px var(--p); background: rgba(91, 92, 226, .06); }
.sb-mode-name { font-weight: 700; font-size: 15px; color: var(--text); }
.sb-mode-name::before {
    content: "";
    display: inline-block;
    width: 9px; height: 9px;
    border-radius: 50%;
    border: 2px solid var(--line);
    margin-right: 9px;
    vertical-align: middle;
}
.sb-mode-opt.is-on .sb-mode-name::before { border-color: var(--p); background: var(--p); }
.sb-mode-desc { font-size: 13px; color: var(--muted); line-height: 1.5; }
@media (max-width: 560px) { .sb-mode-opts { grid-template-columns: 1fr; } }

.sb-note { font-size: 13px; color: var(--muted2); margin: 0 0 12px; }
.sb-tech-opts { display: flex; flex-wrap: wrap; gap: 8px; }
.sb-tech-chip {
    cursor: pointer;
    padding: 8px 14px;
    font-size: 13.5px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--card-solid);
    color: var(--text);
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.sb-tech-chip:hover { border-color: var(--p); }
.sb-tech-chip.is-on { border-color: var(--p); background: rgba(91, 92, 226, .10); color: var(--p); font-weight: 600; }
.sb-date { margin-top: 12px; max-width: 260px; }

.sol-final {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    flex-wrap: wrap;
    padding: clamp(28px, 4vw, 44px);
    border-radius: var(--r);
    background: linear-gradient(135deg, var(--p), var(--p2));
    box-shadow: 0 20px 45px -20px rgba(91, 92, 226, .5);
}
.sol-final-text { min-width: 240px; flex: 1 1 auto; }
.sol-final h3 { color: #fff; margin: 0 0 8px; font-size: clamp(20px, 2.4vw, 26px); }
.sol-final p { color: rgba(255, 255, 255, .92); margin: 0; max-width: 60ch; line-height: 1.6; }
.sol-final-btn {
    flex: 0 0 auto;
    background: #fff;
    color: var(--p);
    border: 1px solid #fff;
    font-weight: 600;
    white-space: nowrap;
}
.sol-final-btn:hover { background: #f1f0ff; border-color: #f1f0ff; }
@media (max-width: 600px) { .sol-final { flex-direction: column; align-items: flex-start; } }

.pg-arrow {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 66px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--line);
    background: var(--card);
    color: var(--muted);
    cursor: pointer;
    z-index: 45;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.pg-arrow-left { left: 0; border-left: 0; border-radius: 0 14px 14px 0; }
.pg-arrow-right { right: 0; border-right: 0; border-radius: 14px 0 0 14px; }
.pg-arrow:hover { color: var(--p); border-color: var(--p); }
.pg-arrow[hidden] { display: none; }
@media (max-width: 640px) { .pg-arrow { width: 32px; height: 56px; opacity: .6; } }

.scroll-hint {
    position: fixed;
    left: 50%;
    bottom: 22px;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    gap: 10px;
    max-width: min(90vw, 360px);
    padding: 10px 16px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--card);
    color: var(--text);
    box-shadow: var(--shadow2);
    cursor: pointer;
    z-index: 44;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    font-size: 13.5px;
    animation: shRise .4s ease;
    transition: transform .2s ease, border-color .2s ease;
}
.scroll-hint:hover { border-color: var(--p); transform: translateX(-50%) translateY(-2px); }
.scroll-hint[hidden] { display: none; }
.scroll-hint .sh-kicker { color: var(--muted2); text-transform: uppercase; letter-spacing: .06em; font-size: 11px; font-weight: 700; flex-shrink: 0; }
.scroll-hint .sh-label { color: var(--text); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.scroll-hint .fa-chevron-down { color: var(--p); flex-shrink: 0; animation: shBob 1.6s ease-in-out infinite; }
@keyframes shRise { from { opacity: 0; transform: translateX(-50%) translateY(10px); } to { opacity: 1; transform: translateX(-50%); } }
@keyframes shBob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(3px); } }

.page-enter { animation: pgFade .3s ease; }
.page-enter-right { animation: pgInRight .34s cubic-bezier(.22, .61, .36, 1); }
.page-enter-left  { animation: pgInLeft .34s cubic-bezier(.22, .61, .36, 1); }
@keyframes pgFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes pgInRight { from { opacity: 0; transform: translateX(46px); } to { opacity: 1; transform: none; } }
@keyframes pgInLeft  { from { opacity: 0; transform: translateX(-46px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
    .page-enter, .page-enter-right, .page-enter-left { animation: none; }
    .scroll-hint, .scroll-hint .fa-chevron-down { animation: none; }
}

.sb-launcher {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 47;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 16px 9px;
    background: linear-gradient(160deg, var(--p), var(--p2));
    color: #fff;
    border: 0;
    cursor: pointer;
    border-radius: 12px 0 0 12px;
    box-shadow: -8px 0 26px -12px rgba(91, 92, 226, .6);
    opacity: .92;
    transition: transform .25s ease, opacity .2s ease, box-shadow .25s ease;
}
.sb-launcher i { font-size: 15px; }
.sb-launcher .sb-launcher-l {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font-weight: 700;
    font-size: 12.5px;
    letter-spacing: .02em;
}
.sb-launcher:hover { opacity: 1; transform: translateY(-50%) translateX(-3px); box-shadow: -10px 0 30px -8px rgba(91, 92, 226, .75); }
.sb-launcher[hidden] { display: none; }
@media (max-width: 600px) { .sb-launcher { padding: 13px 7px; } .sb-launcher .sb-launcher-l { font-size: 11.5px; } }

.sb-overlay {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 22px;
    background: rgba(10, 12, 22, .55);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    opacity: 0;
    transition: opacity .25s ease;
}
.sb-overlay.open { opacity: 1; }
.sb-overlay[hidden] { display: none; }
.sb-modal {
    width: min(920px, 100%);
    height: min(580px, 90vh);
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    background: var(--card-solid);
    border: 1px solid var(--line);
    border-radius: var(--r);
    overflow: hidden;
    box-shadow: var(--shadow3);
    transform: translateY(18px) scale(.98);
    opacity: 0;
    transition: transform .3s cubic-bezier(.22, .61, .36, 1), opacity .3s ease;
}
.sb-overlay.open .sb-modal { transform: none; opacity: 1; }
.sb-modal-head {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 22px 24px 16px;
    border-bottom: 1px solid var(--line);
}
.sb-modal-title { margin: 0; font-size: 20px; letter-spacing: -.01em; }
.sb-modal-sub { margin: 5px 0 0; color: var(--muted); font-size: 14px; }
.sb-modal-close {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    border: 1px solid var(--line);
    background: var(--card);
    color: var(--muted);
    cursor: pointer;
    transition: color .2s ease, border-color .2s ease;
}
.sb-modal-close:hover { color: var(--p); border-color: var(--p); }
.sb-modal-body { padding: 22px 24px 24px; overflow-y: auto; }
.sb-modal-body .sb-card { border: 0; padding: 0; background: transparent; box-shadow: none; }
@media (prefers-reduced-motion: reduce) {
    .sb-overlay, .sb-modal { transition: none; }
    .sb-modal { transform: none; }
}

.fb-overlay {
    position: absolute;
    inset: 0;
    z-index: 30;
    border-radius: inherit;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px;
    text-align: center;
    background: rgba(12, 14, 24, .82);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    opacity: 0;
    pointer-events: none;
    transition: opacity .28s ease;
}
.fb-overlay.fb-fixed { position: fixed; z-index: 200; border-radius: 0; }
.fb-overlay.is-on { opacity: 1; pointer-events: auto; }
.fb-card {
    max-width: 380px;
    transform: translateY(12px) scale(.96);
    transition: transform .32s cubic-bezier(.22, .61, .36, 1);
}
.fb-overlay.is-on .fb-card { transform: none; }
.fb-icon { font-size: 50px; line-height: 1; margin-bottom: 16px; }
.fb-overlay[data-state="pending"] .fb-icon { color: var(--p); }
.fb-overlay[data-state="ok"] .fb-icon { color: #34d399; }
.fb-overlay[data-state="err"] .fb-icon { color: #f87171; }
.fb-msg { margin: 0; font-size: 16px; line-height: 1.5; color: #f4f5fb; }
.fb-close { margin-top: 20px; }
.fb-spin {
    display: inline-block;
    width: 46px;
    height: 46px;
    border: 3px solid rgba(255, 255, 255, .22);
    border-top-color: var(--p);
    border-radius: 50%;
    animation: fb-spin .8s linear infinite;
}
@keyframes fb-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .fb-overlay, .fb-card { transition: none; }
    .fb-card { transform: none; }
    .fb-spin { animation-duration: 1.4s; }
}

.sb-assure {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 18px;
    margin: 2px 0 18px;
    padding: 16px 18px;
    border: 1px solid var(--line);
    border-radius: var(--r2);
    background: var(--card);
}
.sb-assure-item { display: flex; align-items: flex-start; gap: 9px; font-size: 13.5px; color: var(--muted); line-height: 1.45; }
.sb-assure-item i { color: var(--p); margin-top: 3px; flex-shrink: 0; width: 16px; text-align: center; }
.sb-assure-item abbr, .sb-assure-item .ct-abbr { color: var(--text); text-decoration: underline dotted; cursor: help; }
@media (max-width: 560px) { .sb-assure { grid-template-columns: 1fr; gap: 10px; } }

.sb-launcher { top: 72%; }
@media (max-height: 620px) { .sb-launcher { top: auto; bottom: 76px; transform: none; } }

/* Rail (coluna lateral com as etapas) */
.sb-rail {
    flex: 0 0 200px;
    background: var(--bg2);
    border-right: 1px solid var(--line);
    padding: 26px 16px;
    overflow-y: auto;
}
.sb-rail .sb-progress {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 4px;
    margin: 0;
}
.sb-rail .sb-dot {
    flex: none;
    max-width: none;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    padding: 10px;
    border-radius: 10px;
    text-align: left;
    transition: background .2s ease;
}
.sb-rail .sb-dot.is-active { background: rgba(91, 92, 226, .1); }
.sb-rail .sb-dot-l { text-align: left; font-size: 13px; }
.sb-rail .sb-dot:not(:last-child)::after { display: none; }

.sb-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; padding: 24px 30px 28px; overflow: hidden; }
.sb-main .sb-form { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
.sb-main .sb-steps { flex: 1 1 auto; min-height: 0; overflow-y: auto; position: relative; }
.sb-main .sb-hint { flex-shrink: 0; }
.sb-main .sb-nav { flex-shrink: 0; margin-top: 16px; }

.sb-step.sb-in-next { animation: sbInNext .3s ease; }
.sb-step.sb-in-prev { animation: sbInPrev .3s ease; }
@keyframes sbInNext { from { opacity: 0; transform: translateX(30px); } to { opacity: 1; transform: none; } }
@keyframes sbInPrev { from { opacity: 0; transform: translateX(-30px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
    .sb-step.sb-in-next, .sb-step.sb-in-prev { animation: none; }
}

/* Mobile: rail vira barra horizontal no topo */
@media (max-width: 640px) {
    .sb-modal-body { flex-direction: column; }
    .sb-rail { flex: none; border-right: 0; border-bottom: 1px solid var(--line); padding: 12px 14px; }
    .sb-rail .sb-progress { flex-direction: row; gap: 4px; overflow-x: auto; }
    .sb-rail .sb-dot { flex-direction: column; gap: 6px; padding: 6px 8px; min-width: 64px; }
    .sb-rail .sb-dot-l { font-size: 11px; text-align: center; }
    .sb-main { padding: 18px 18px 22px; }
}
.sb-form .sb-summary-box {
    min-height: 0;
    height: 104px;
    background: var(--bg2);
    color: var(--muted);
    cursor: default;
    resize: none;
    font-size: 13px;
    line-height: 1.55;
    white-space: pre-wrap;
    overflow-y: auto;
}
.sb-form .sb-summary-box:focus { outline: none; border-color: var(--line); box-shadow: none; }
.sb-form #sbDetails { min-height: 78px; }
.sb-form .sb-assure { margin-top: 14px; }
.sb-form .ct-turnstile { margin-bottom: 4px; }
.sb-modal-body { padding: 0; overflow: hidden; display: flex; flex-direction: row; flex: 1 1 auto; min-height: 0; }
.sb-modal-body .sb-card { display: flex; flex-direction: column; width: 100%; min-height: 0; }
.sb-modal-body .sb-card .sb-progress { flex-shrink: 0; }
.sb-modal-body .sb-card .sb-nav { flex-shrink: 0; margin-top: 16px; }

.sb-steps {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding-right: 8px;
    scrollbar-width: thin;
    scrollbar-color: var(--line) transparent;
}
.sb-steps::-webkit-scrollbar { width: 8px; }
.sb-steps::-webkit-scrollbar-track { background: transparent; }
.sb-steps::-webkit-scrollbar-thumb { background: var(--line); border-radius: 999px; }
.sb-steps::-webkit-scrollbar-thumb:hover { background: var(--muted2); }

.sb-modal .sb-form .ct-textarea { min-height: 110px; }
.sb-modal .sb-assure { margin: 2px 0 14px; padding: 14px 16px; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
* { -webkit-tap-highlight-color: rgba(91, 92, 226, .18); }

@media (max-width: 760px) {
    /* Prevent iOS auto-zoom on input focus: needs >= 16px */
    .ct-input,
    input, select, textarea { font-size: 16px; }

    /* Long words, URLs and emails wrap instead of overflowing */
    p, li, h1, h2, h3, .lead, .legal-section li { overflow-wrap: break-word; }

    /* Fixed backgrounds jank on mobile: use scroll for smoothness */
    html { background-attachment: scroll; }

    /* Comfortable tap targets inside the open mobile menu */
    body.nav-open .site-nav a { padding: 12px 14px; }
    body.nav-open .site-nav { gap: 2px; }
}

@media (max-width: 860px) {
    .aid-grid { grid-template-columns: 1fr; gap: 32px; }
}

@media (max-width: 640px) {
    .sb-modal-body { flex-direction: column; }
    .sb-rail { flex: none; width: auto; }
    .sb-main { width: 100%; min-width: 0; }
}

@media (max-width: 640px) {
    /* Response note on its own line ABOVE the buttons (was crammed
       between Back and Next, pushing Next out of the modal) */
    .sb-nav { flex-wrap: wrap; row-gap: 14px; }
    .sb-nav-note {
        order: -1;
        flex-basis: 100%;
        margin: 0;
        justify-content: center;
    }
    .sb-back { margin-right: auto; }
    .sb-next { margin-left: auto; }

    /* Center the Cloudflare captcha inside the wizard */
    .sb-form .ct-turnstile { display: flex; justify-content: center; }
}

#cookieBanner:not([hidden]) { display: block !important; }