.px-menu-open { display: none; }
.px-mobile-menu:not([open]), .px-web-app [hidden] { display: none; }

.px-web-app { padding: clamp(2.5rem, 8vw, 6rem) 0; background: #f8fafc; }
.px-web-app-title { display: grid; justify-items: start; gap: .6rem; margin-bottom: 1.5rem; }
.px-web-app-title img { border-radius: 1rem; }
.px-web-app-title h1 { font-size: clamp(2rem, 6vw, 3.5rem); line-height: 1.08; font-weight: 700; }
.px-web-app-title p, .px-web-app-card p { color: #475569; line-height: 1.6; }
.px-web-app-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.px-web-app-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 1.2rem; padding: clamp(1rem, 4vw, 1.75rem); }
.px-web-app-card h2 { font-size: 1.25rem; font-weight: 700; margin-bottom: .45rem; }
.px-web-app-card p + p:not(:empty) { margin-top: .65rem; }
.px-web-app-card button, .px-web-app-card a { margin-top: .9rem; margin-inline-end: .5rem; }
.px-primary, .px-secondary {
    display: inline-flex; align-items: center; justify-content: center; min-height: 44px;
    padding: .55rem .95rem; border: 1px solid #dddfee; border-radius: .7rem;
    font-weight: 650; line-height: 1.25; text-align: center;
}
.px-primary { color: #fff; background: #4f46e5; border-color: #4f46e5; }
.px-primary:hover { color: #fff; background: #4338ca; }
.px-primary:disabled { opacity: .62; cursor: wait; }
.px-secondary { color: #312e81; background: #fff; }
.px-secondary:hover { background: #f5f3ff; }
.px-icon-button:focus-visible, .px-mobile-menu a:focus-visible, .px-web-app a:focus-visible, .px-web-app button:focus-visible {
    outline: 2px solid #4338ca; outline-offset: 2px;
}

@media (max-width: 1199px) {
    .px-header-row { padding-block: .6rem; padding-top: max(.6rem, env(safe-area-inset-top)); gap: .5rem; }
    .px-header-logo-wrap { margin-inline-end: 0; }
    .px-header-logo { display: block; height: auto; width: min(39vw, 154px); max-height: 44px; object-fit: contain; object-position: left; }
    .site-header .px-desktop-only { display: none; }
    .px-header-row .px-language-button { min-height: 44px; padding-inline: .5rem; }
    .px-icon-button {
        display: inline-grid; place-items: center; width: 44px; height: 44px; flex: none;
        border-radius: .75rem; background: #fff; color: #312e81; border: 1px solid #dddfee;
        cursor: pointer;
    }
    .px-mobile-menu[open] {
        display: flex; flex-direction: column; position: fixed; inset: 0 0 auto;
        margin: 0 auto; width: min(100%, 32rem); max-width: 100%;
        max-height: calc(100dvh - 12px); border: 0; border-radius: 0 0 1.25rem 1.25rem;
        background: #fff; color: #111827; box-shadow: 0 20px 50px #0f172a33;
        padding: 0; overflow: auto; overscroll-behavior: contain;
    }
    .px-mobile-menu::backdrop { background: rgba(15, 23, 42, .52); }
    html:has(.px-mobile-menu[open]) { overflow: hidden; }
    .px-menu-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: max(12px, env(safe-area-inset-top)) 16px 12px; border-bottom: 1px solid #e2e8f0; }
    .px-menu-top img { width: 126px; max-height: 40px; object-fit: contain; }
    .px-menu-links { display: grid; gap: 2px; padding: 10px 12px; margin: 0; list-style: none; }
    .px-menu-links a { display: flex; align-items: center; gap: .8rem; min-height: 44px; padding: .45rem .75rem; border-radius: .65rem; font-size: 1rem; font-weight: 600; }
    .px-menu-links i { width: 20px; text-align: center; color: #4f46e5; }
    .px-menu-links a:hover, .px-menu-links a[aria-current="page"] { background: #f0efff; color: #3730a3; }
    .px-menu-actions { display: flex; gap: 8px; border-top: 1px solid #e2e8f0; padding: 12px 16px max(14px, env(safe-area-inset-bottom)); }
    .px-menu-actions a { flex: 1; }
}
@media (min-width: 1200px) {
    .px-mobile-menu[open] { display: none; }
    .px-header-logo { height: 4rem; width: auto; }
}
@media (max-width: 767px) {
    .px-web-app-grid { grid-template-columns: minmax(0, 1fr); }
    .px-public :is(a, button, summary) { touch-action: manipulation; }
    .px-home > section { padding-top: 2.75rem; padding-bottom: 2.75rem; }
    .px-home .px-hero { padding: 0; z-index: auto; }
    .px-hero .px-hero-inner { padding: 1.6rem 0 2.3rem; }
    .px-hero .px-hero-columns { margin: 0; gap: 1.3rem; }
    .px-hero .px-hero-column { padding: 0; }
    .px-hero h1 { font-size: clamp(2rem, 8.2vw, 3.25rem); line-height: 1.07; letter-spacing: -.035em; margin-bottom: 12px; }
    .px-hero-copy { font-size: 1rem; line-height: 1.55; margin-bottom: 1.1rem; }
    .px-hero-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; }
    .px-hero-actions > div { padding: 0; }
    .px-hero-actions a { display: flex; align-items: center; justify-content: center; min-height: 48px; height: 100%; padding: .55rem .45rem; font-size: .9rem; text-align: center; line-height: 1.25; }
    .px-hero-ornament { display: none; }
    .px-hero-image { width: 100%; height: auto; display: block; border-radius: 1.05rem; }
    .px-home h2 { font-size: clamp(1.7rem, 7.3vw, 2.6rem); line-height: 1.12; margin-bottom: 1rem; overflow-wrap: anywhere; }
    .px-home #features > .container > p { margin-bottom: 1.4rem; font-size: 1rem; }
    .px-feature-row { margin: 0; display: grid; gap: .8rem; }
    .px-feature-row > div { padding: 0; }
    .px-feature-card { display: grid; justify-items: start; text-align: start; height: auto; padding: 1rem; border-radius: 1rem; overflow: hidden; }
    .px-feature-card p { margin-bottom: .85rem; }
    .px-feature-card img { height: 155px; width: 100%; object-fit: contain; }
    .px-home .px-feature-visual img { max-width: 100%; height: auto; }
    .px-home .px-feature-visual img[aria-hidden="true"] { display: none; }
    .px-login-screen { width: 100%; min-height: 100dvh; background: #f8fafc; }
    .px-login-screen .px-login-panel {
        justify-content: start; width: 100%; min-width: 0; padding: max(18px, env(safe-area-inset-top)) 16px max(20px, env(safe-area-inset-bottom));
        background: #f8fafc !important;
    }
    .px-login-form {
        padding: clamp(16px, 5vw, 24px); background: #fff; border: 1px solid #e2e8f0;
        border-radius: 1.1rem; box-shadow: 0 8px 26px #0f172a0a;
    }
    .px-login-mobile-head { margin-bottom: 1rem; }
    .px-login-mobile-head > a { display: inline-flex; align-items: center; min-height: 44px; }
    .px-login-mobile-head img { width: 126px; max-height: 44px; object-fit: contain; }
    .px-login-mobile-head h1 { font-size: clamp(1.65rem, 7vw, 2.15rem); font-weight: 700; line-height: 1.12; margin-top: .65rem; }
    .px-login-form input:is([type=text], [type=email], [type=password]) { font-size: 16px; color: #0f172a; min-height: 46px; }
    .px-login-options { gap: 8px; flex-wrap: wrap; font-size: .9rem; }
    .px-login-options label, .px-login-options a { min-height: 44px; display: inline-flex; align-items: center; }
    .px-login-form button[type=submit] { margin-bottom: 1rem; }
    .px-login-social { display: grid; gap: .5rem; margin: 0; }
    .px-login-social a { min-height: 44px; margin: 0; padding: .55rem; font-size: .94rem; }
    .px-public .cookie-policy-bar > div { padding: 14px 16px max(14px, env(safe-area-inset-bottom)); }
    .px-public .cookie-policy-bar .md\:w-1\/2 { margin-bottom: 0; }
    .px-public .cookie-policy-bar h3 { margin-bottom: .25rem; }
    .px-public .cookie-policy-bar .flex.flex-wrap.justify-end { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: .35rem; }
}
@media (min-width: 768px) { .px-login-mobile-head { display: none; } }

@media (max-width: 375px) {
    .px-login-screen .px-login-panel { padding-inline: 9px; }
    .px-login-form { border: 0; padding-inline: 0; background: transparent; box-shadow: none; }
}