:root { color-scheme: light; }
.account-access {
    --access-ink:#16333d; --access-muted:#60777f; --access-accent:#087c6d;
    margin:0; min-height:100vh; display:flex; flex-direction:column;
    color:var(--access-ink); font:14px/1.6 Inter,system-ui,sans-serif;
    background:#eef6f7 url('/images/cloud-infrastructure-v3.png') right center/cover no-repeat fixed;
}
.account-access * { box-sizing:border-box; letter-spacing:0; }
.account-access a { color:var(--access-accent); text-decoration:none; }
.account-access a:hover { text-decoration:underline; }
.access-nav {
    position:relative; z-index:3; display:flex; align-items:center; justify-content:space-between; gap:20px;
    min-height:74px; padding:14px 5%; border-bottom:1px solid rgba(185,210,214,.84);
    background:rgba(255,255,255,.9); backdrop-filter:blur(18px);
}
.access-brand { display:flex; align-items:center; gap:11px; min-width:0; font-size:20px; font-weight:750; color:var(--access-ink)!important; }
.access-brand span { overflow-wrap:anywhere; }
.access-brand img { width:auto; max-width:176px; height:38px; object-fit:contain; object-position:left center; flex:none; transition:transform .2s ease; }
.access-brand:hover img { transform:translateY(-1px); }
.access-brand:has(img) span { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.access-nav>a:last-child { min-height:38px; display:inline-flex; align-items:center; gap:7px; padding:0 12px; border:1px solid #cbdde0; border-radius:7px; background:#fff; color:#294b54; font-size:12px; font-weight:700; }
.access-main {
    position:relative; flex:1; display:grid; grid-template-columns:minmax(420px,680px) minmax(280px,1fr);
    align-items:center; gap:clamp(36px,7vw,110px); padding:clamp(30px,5vw,72px) 5%; overflow:hidden;
}
.access-main::before {
    position:absolute; inset:0 auto 0 0; z-index:0; width:min(58%,820px); content:"";
    background:rgba(240,248,248,.82); border-right:1px solid rgba(196,217,220,.58); pointer-events:none;
}
.access-content {
    position:relative; z-index:1; width:100%; max-width:510px; padding:30px 34px;
    border:1px solid #d5e4e6; border-top:4px solid #0b8877; border-radius:8px;
    background:rgba(255,255,255,.97); box-shadow:0 22px 56px rgba(23,65,77,.13);
}
.account-access-register .access-content { max-width:680px; }
.access-emblem {
    width:42px; height:42px; display:grid; place-items:center; margin-bottom:20px;
    border:1px solid #bfe3d9; border-radius:8px; color:#08796b; background:#e8f7f2; font-size:18px;
    box-shadow:0 8px 18px rgba(8,121,107,.1);
}
.access-heading { margin-bottom:24px; }
.access-label { display:inline-flex; align-items:center; gap:7px; color:var(--access-accent); font-size:11px; font-weight:750; overflow-wrap:anywhere; }
.access-content h1 { margin:8px 0 8px; font-size:30px; line-height:1.2; font-weight:750; color:#102e38; }
.access-heading p { margin:0; color:var(--access-muted); font-size:13px; }
.access-form { display:grid; gap:17px; }
.access-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.access-field,.access-field-wide { min-width:0; }
.access-field-wide { grid-column:1/-1; }
.access-content label { display:block; margin-bottom:6px; color:#31515a; font-size:12px; font-weight:700; }
.access-input { position:relative; }
.access-input>i:first-child {
    position:absolute; z-index:2; left:13px; top:50%; width:16px; color:#6d8b92;
    text-align:center; transform:translateY(-50%); pointer-events:none;
}
.access-content input:not([type=checkbox]):not([type=hidden]),
.access-content select {
    display:block; width:100%; height:46px; border:1px solid #c5d7da; border-radius:7px;
    padding:10px 13px 10px 40px; color:var(--access-ink); background:#fbfdfd;
    font:500 14px Inter,system-ui,sans-serif; box-shadow:none;
}
.access-content select { appearance:auto; padding-right:34px; }
.access-content :is(input,select):focus { outline:3px solid #d8eee9; outline-offset:1px; border-color:var(--access-accent); background:#fff; }
.access-password input { padding-right:48px!important; }
.access-password button {
    position:absolute; z-index:3; top:1px; right:1px; width:44px; height:44px;
    border:0; border-radius:6px; background:transparent; color:var(--access-muted); cursor:pointer; font-size:15px;
}
.access-password button:hover { color:var(--access-accent); background:#edf8f4; }
.access-country img {
    position:absolute; z-index:2; left:12px; top:50%; width:22px; height:16px;
    border-radius:3px; object-fit:cover; transform:translateY(-50%); box-shadow:0 0 0 1px rgba(45,78,86,.16);
}
.access-country select { padding-left:44px; }
.access-content input[type=checkbox] { flex:none; width:16px; height:16px; margin:3px 0 0; border:1px solid #abc2ba; border-radius:3px; accent-color:var(--access-accent); }
.access-options { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; font-size:12px; }
.access-options label { display:flex; align-items:center; gap:8px; margin:0; font-size:12px; }
.access-content .access-submit,.access-content button[type=submit] {
    position:relative; overflow:hidden; width:100%; min-height:48px; display:flex; align-items:center; justify-content:center;
    gap:16px; padding:12px 16px; border:1px solid var(--access-accent); border-radius:7px;
    background:var(--access-accent); color:#fff!important; font:700 14px Inter,system-ui,sans-serif;
    text-transform:none; text-decoration:none; cursor:pointer; box-shadow:0 10px 22px rgba(8,124,109,.2);
}
.access-content button[type=submit]:hover { background:#056759; transform:translateY(-1px); }
.access-submit span { margin-left:auto; }
.access-terms { display:flex!important; gap:10px; align-items:flex-start; margin:0!important; font-size:11px!important; line-height:1.65; }
.access-switch { padding-top:20px; border-top:1px solid #e1ebed; margin:23px 0 0; font-size:12px; text-align:center; color:var(--access-muted); }
.access-switch a { font-weight:700; }
.access-status { padding:12px; margin-bottom:18px; color:#087050; background:#eaf8f1; border:1px solid #cae9db; border-radius:6px; }
.access-content ul.text-red-600 { color:#b8324e; font-size:11px; margin:6px 0 0; padding:0; list-style:none; }
.access-content .text-sm { font-size:12px; line-height:1.7; }
.access-visual-panel {
    position:relative; z-index:1; align-self:end; max-width:470px; margin:0 0 4vh auto; padding:24px;
    border:1px solid rgba(255,255,255,.8); border-radius:8px; background:rgba(255,255,255,.84);
    box-shadow:0 20px 48px rgba(24,70,81,.12); backdrop-filter:blur(14px);
}
.access-visual-label { display:inline-flex; align-items:center; gap:7px; color:#087665; font-size:11px; font-weight:800; text-transform:uppercase; }
.access-visual-panel h2 { max-width:390px; margin:10px 0 8px; color:#15353f; font-size:24px; line-height:1.25; }
.access-visual-panel p { margin:0; color:#59717a; font-size:13px; }
.access-visual-points { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.access-visual-points span { display:inline-flex; align-items:center; gap:7px; min-height:34px; padding:0 10px; border:1px solid #d1e2e5; border-radius:6px; background:#fff; color:#35545d; font-size:11px; font-weight:700; }
.access-visual-points span:nth-child(1) i { color:#2563eb; }
.access-visual-points span:nth-child(2) i { color:#d28a0c; }
.access-visual-points span:nth-child(3) i { color:#d94670; }
.access-footer { position:relative; z-index:2; display:flex; flex-wrap:wrap; justify-content:center; gap:12px 24px; padding:18px; border-top:1px solid rgba(190,211,215,.74); background:rgba(247,251,251,.9); font-size:11px; color:var(--access-muted); }
.access-footer a { color:var(--access-muted); }
.access-honeypot { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.account-access :focus-visible { outline:3px solid #2868cf; outline-offset:3px; }
@media(max-width:1050px) {
    .access-main { grid-template-columns:minmax(0,680px); justify-content:center; }
    .access-main::before { width:100%; border:0; background:rgba(240,248,248,.76); }
    .access-visual-panel { display:none; }
}
@media(max-width:700px) {
    .access-main { padding:28px 16px; }
    .access-content,.account-access-register .access-content { max-width:540px; padding:25px 21px; }
    .access-form-grid { grid-template-columns:minmax(0,1fr); }
    .access-field-wide { grid-column:auto; }
    .access-nav { min-height:66px; padding:12px 18px; }
    .access-brand { font-size:17px; }
    .access-brand img { max-width:145px; height:33px; }
    .access-content h1 { font-size:26px; }
    .access-content input:not([type=checkbox]):not([type=hidden]),.access-content select { font-size:16px; }
}
@media(prefers-reduced-motion:no-preference) {
    .access-content { animation:access-in .45s ease-out both; }
    .access-visual-panel { animation:access-visual-in .55s .08s ease-out both; }
    .access-submit,.access-brand img { transition:transform .18s,background-color .18s; }
    @keyframes access-in { from { opacity:.2; transform:translateY(12px); } to { opacity:1; transform:none; } }
    @keyframes access-visual-in { from { opacity:.2; transform:translateX(18px); } to { opacity:1; transform:none; } }
}
@media(prefers-reduced-motion:reduce) { .account-access * { animation:none!important; transition:none!important; } }