.gl-page {
    --gl-night:#06152f;
    --gl-navy:#0b2954;
    --gl-blue:#184d87;
    --gl-gold:#e8bc5d;
    --gl-paper:#f8fbff;
    min-height:100vh;
    min-height:100svh;
    display:flex;
    flex-direction:column;
    color:#fff;
    background:
        radial-gradient(ellipse at 86% 6%,#245c96 0,transparent 44%),
        radial-gradient(ellipse at 12% 88%,#153b68 0,transparent 42%),
        var(--gl-night);
}
.gl-layout {
    position:relative;
    isolation:isolate;
    flex:1;
    width:min(100%,1480px);
    margin-inline:auto;
    padding:clamp(26px,4vw,64px);
    display:grid;
    grid-template-columns:minmax(340px,.84fr) minmax(0,1.16fr);
    align-items:center;
    gap:clamp(30px,6vw,95px);
    overflow:hidden;
}
.gl-layout::before {
    content:"";
    position:absolute;
    z-index:-1;
    width:110%;
    height:75%;
    inset:-51% 8% auto auto;
    border:clamp(5px,1vw,13px) solid var(--gl-gold);
    border-radius:0 0 50% 50%;
    transform:rotate(-11deg);
    box-shadow:0 0 0 23px #4d88c82a,0 0 45px #e8bc5d22;
}
.gl-layout::after {
    content:"";
    position:absolute;
    z-index:-1;
    inset:auto auto 0 0;
    width:56%;
    height:48%;
    background:linear-gradient(152deg,transparent 35%,#4d88c833 35% 36%,transparent 36% 51%,#4d88c833 51% 52%,transparent 52%);
    pointer-events:none;
}
.gl-intro {
    display:grid;
    justify-items:center;
    align-content:center;
    gap:clamp(21px,3.3vw,46px);
    text-align:center;
    min-width:0;
}
.gl-brand-row {
    display:flex;
    justify-content:center;
    align-items:stretch;
    gap:clamp(15px,3vw,40px);
}
.gl-brand {
    display:grid;
    justify-items:center;
    align-content:start;
    gap:8px;
    color:#f5f8ff;
    font-weight:700;
    font-size:clamp(12px,1.35vw,17px);
}
.gl-brand + .gl-brand {border-inline-start:1px solid #ffffff60;padding-inline-start:clamp(15px,3vw,40px)}
.gl-brand img,.gl-card-mark img {
    display:block;
    width:auto;
    height:clamp(64px,7vw,102px);
    max-width:100%;
    object-fit:contain;
    background:#fff;
    border-radius:11px;
    padding:7px;
}
.gl-message h1 {
    font-size:clamp(31px,4vw,57px);
    line-height:1.18;
    letter-spacing:normal;
    margin:0 0 8px;
    color:#fff;
    font-weight:850;
}
.gl-english {font:650 clamp(18px,2.45vw,34px)/1.25 'Segoe UI',sans-serif;margin:0;color:#edf3ff}
.gl-description {max-width:460px;margin:0 auto;font-size:clamp(15px,1.65vw,21px);color:#e3edff}
.gl-description::before,.gl-card-heading::after {
    display:block;
    content:"";
    width:70px;
    height:4px;
    border-radius:5px;
    margin:17px auto;
    background:linear-gradient(90deg,#c18c30,#f6d68a);
}
.gl-features {
    width:min(100%,540px);
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:0;
    margin:0;
    list-style:none;
}
.gl-features li {
    display:grid;
    justify-items:center;
    gap:5px;
    padding:11px 5px;
    border:1px solid #c4dbff65;
    border-radius:12px;
    background:#102c50c9;
    font-weight:700;
    line-height:1.45;
}
.gl-features svg {width:25px;height:25px;color:var(--gl-gold)}
.gl-credit {
    display:flex;
    align-items:center;
    gap:13px;
    text-align:start;
    padding:13px clamp(12px,2.3vw,27px);
    border:1px solid var(--gl-gold);
    border-inline-start-width:5px;
    border-radius:13px;
    background:#071d3b;
    font-size:clamp(14px,1.55vw,21px);
    line-height:1.6;
}
.gl-credit svg {width:30px;height:30px;color:var(--gl-gold);flex:none}
.gl-card {
    overflow:hidden;
    position:relative;
    min-width:0;
    border:2px solid #fff;
    border-radius:26px;
    color:var(--gl-night);
    background:linear-gradient(180deg,#d6e9ff 0%,var(--gl-paper) 35%,#fff 73%,#eaf4ff 100%);
    box-shadow:0 25px 60px #030c2150;
}
.gl-factory {display:block;width:100%;height:clamp(76px,9vw,132px)}
.gl-factory-fill {fill:#a6ccf3;opacity:.46}
.gl-factory-line {fill:none;stroke:#437db5;stroke-width:1.8;opacity:.64}
.gl-factory-windows {fill:#659bce;opacity:.5}
.gl-card-body {padding:0 clamp(22px,3vw,48px);position:relative}
.gl-card-heading {text-align:center}
.gl-card-heading h2 {font-size:clamp(28px,3vw,43px);font-weight:850;line-height:1.15;margin:5px 0 8px}
.gl-card-heading p {margin:0;font-weight:700;color:#234776}
.gl-card-heading::after {margin:12px auto 17px;width:56px}
.gl-card form {display:grid;gap:13px}
.gl-field {font-size:15px;gap:5px;color:var(--gl-navy)}
.gl-input {position:relative;display:block}
.gl-input input {
    color:var(--gl-night);
    border-color:#93b1d2;
    background:#ffffffb0;
    min-height:48px;
    padding:9px 12px;
}
.gl-input input[dir=ltr] {padding-left:43px}
.gl-input input::placeholder {direction:rtl;text-align:right;color:#486285}
.gl-input svg {position:absolute;pointer-events:none;left:13px;top:50%;transform:translateY(-50%);width:20px;height:20px}
.gl-submit {
    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;
    background:linear-gradient(115deg,var(--gl-blue),var(--gl-night));
    min-height:48px;
    font-size:17px;
    margin-top:3px;
}
.gl-submit svg {width:22px;height:22px}
.gl-page :is(button,input):focus-visible {outline:3px solid #3b75b9;outline-offset:3px}
.gl-error {font-size:14px;color:#9e2c23;font-weight:700}
.gl-error:empty {display:none}
.gl-help {text-align:center;font-size:13px;color:#3e5678;margin:12px 0}
.gl-card-mark {
    display:grid;
    place-items:center;
    position:relative;
    isolation:isolate;
    padding:8px 0 14px;
    overflow:hidden;
}
.gl-card-mark::before,.gl-card-mark::after {
    position:absolute;
    content:"";
    z-index:-1;
    width:80%;
    height:105px;
    inset:auto -20% -65px auto;
    border-top:9px solid #dbab49;
    border-radius:50%;
    transform:rotate(-9deg);
    background:#bcd8f5;
    box-shadow:0 -8px #d8e8fa;
}
.gl-card-mark::after {inset:auto auto -73px -20%;transform:rotate(10deg);border-color:#a3c9ef}
.gl-card-mark img {height:clamp(47px,5.2vw,73px);background:transparent;padding:0}
.gl-footer {
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    gap:8px 20px;
    padding:13px clamp(22px,4vw,64px);
    border-top:1px solid #b9d2f26a;
    background:#112f55;
    color:#eef5ff;
    font-size:13px;
}
.gl-status {display:inline-flex;align-items:center;gap:8px}
.gl-status i {width:9px;height:9px;border-radius:50%;background:#e8bc5d}
.gl-status[data-state=online] i {background:#7ce0a0}
.gl-status[data-state=offline] i {background:#ff9c93}
@media(max-width:760px) {
    .gl-layout {display:flex;flex-direction:column;gap:27px;padding:24px 15px 30px}
    .gl-card,.gl-intro {width:min(100%,465px)}
    .gl-intro {gap:18px}
    .gl-brand img {height:66px}
    .gl-layout::before {display:none}
    .gl-footer {justify-content:center;text-align:center}
}
@media(max-width:340px) {
    .gl-features {grid-template-columns:repeat(2,minmax(0,1fr))}
    .gl-card-body {padding-inline:16px}
}
