.profile-v3 { background: #050607; }
.profile-skip { position: fixed; z-index: 100; top: -90px; left: 16px; padding: 12px 16px; border-radius: 10px; background: #fff; color: #050607; font-weight: 700; text-decoration: none; }
.profile-skip:focus { top: 14px; }
.profile-current-strip { border-bottom: 1px solid rgba(0,185,255,.18); background: linear-gradient(90deg, rgba(0,185,255,.075), rgba(255,255,255,.018) 54%, rgba(0,185,255,.035)); }
.profile-current-strip .shop-shell { min-height: 54px; display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.profile-current-strip span { display: inline-flex; align-items: center; gap: 10px; color: #d7e0e6; font-size: 14px; line-height: 1.45; }
.profile-current-strip span i { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 13px rgba(0,185,255,.86); }
.profile-current-strip a { color: #fff; font-size: 14px; font-weight: 700; text-align: right; text-decoration: none; }
.profile-current-strip a strong { color: var(--cyan); font-weight: 800; }
.profile-current-strip a:hover, .profile-current-strip a:focus-visible { color: var(--cyan); outline: none; }
.profile-main { padding: clamp(30px, 5vw, 72px) 0 clamp(76px, 9vw, 124px); }
.profile-layout { display: grid; grid-template-columns: minmax(330px, .78fr) minmax(560px, 1.22fr); gap: clamp(24px, 4vw, 54px); align-items: start; }
.profile-visual { position: sticky; top: 24px; min-height: 680px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: #090b0e; box-shadow: var(--shadow); }
.profile-visual > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 56%; filter: saturate(.84) contrast(1.08) brightness(.72); }
.profile-visual__scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(4,6,8,.08), rgba(4,6,8,.31) 42%, rgba(4,6,8,.98)); }
.profile-visual::after { position: absolute; inset: 0; content: ""; pointer-events: none; background: linear-gradient(90deg, transparent 48%, rgba(0,185,255,.09)), linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px); background-size: auto, 100% 4px; mix-blend-mode: screen; }
.profile-visual__copy { position: absolute; z-index: 2; left: clamp(26px, 4vw, 54px); right: clamp(26px, 4vw, 54px); bottom: clamp(28px, 5vw, 58px); }
.profile-visual h1 { margin: 0; font-family: var(--hero-face); font-size: clamp(52px, 5.7vw, 82px); font-weight: 600; line-height: .9; letter-spacing: -.045em; }
.profile-visual h1 em { color: var(--cyan); font-style: normal; text-shadow: 0 0 38px rgba(0,185,255,.45); }
.profile-visual p { max-width: 570px; margin: 22px 0 0; color: #eef3f7; font-size: 18px; line-height: 1.55; }
.profile-visual__copy > span { margin-top: 22px; display: inline-flex; color: #c6d0d7; font: 700 12px/1.45 var(--mono); letter-spacing: .055em; text-transform: uppercase; }
.profile-panel { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: linear-gradient(165deg, rgba(16,20,26,.97), rgba(8,10,13,.99)); box-shadow: var(--shadow); }
.profile-panel__heading { padding: clamp(25px, 3vw, 40px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, .72fr); gap: 26px; align-items: end; border-bottom: 1px solid var(--line-soft); }
.profile-panel__heading small { color: var(--cyan); font: 800 12px/1.3 var(--mono); letter-spacing: .1em; }
.profile-panel h2 { margin: 12px 0 0; font-family: var(--headline); font-size: clamp(35px, 3.7vw, 54px); font-weight: 600; line-height: .98; letter-spacing: -.04em; }
.profile-panel__heading p { margin: 0; color: #d2dae0; font-size: 16px; line-height: 1.58; }
.profile-status { min-height: 52px; padding: 14px clamp(20px, 3vw, 31px); display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid rgba(255,255,255,.08); background: #090c10; color: #e6edf2; font: 650 12px/1.4 var(--mono); letter-spacing: .045em; text-transform: uppercase; }
.profile-status span { display: inline-flex; align-items: center; gap: 9px; }
.profile-status i { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 14px rgba(0,185,255,.9); }
.profile-status strong { color: var(--cyan); font-weight: 700; text-align: right; }
.profile-form { position: relative; min-height: 820px; overflow: hidden; background: #080b0f; }
.profile-form iframe { width: 100% !important; min-height: 820px; display: block; border: 0; }
.profile-form[data-form-state="unavailable"] { min-height: 0; }
.profile-form[data-form-state="unavailable"] iframe { display: none !important; }
.profile-unavailable { display: none; margin: 0; padding: 26px clamp(22px, 3vw, 32px); color: #c7d4dc; font-size: 15px; line-height: 1.6; }
.profile-form[data-form-state="unavailable"] .profile-unavailable { display: block; }
.profile-form-help { padding: 18px clamp(22px, 3vw, 32px); border-bottom: 1px solid var(--line-soft); background: rgba(0,185,255,.04); }
.profile-form-help summary { width: fit-content; color: #d9effa; font-size: 14px; font-weight: 700; line-height: 1.5; cursor: pointer; }
.profile-form-help summary span { color: var(--cyan); }
.profile-form-help__content { max-width: 580px; padding: 18px 0 4px; display: grid; gap: 14px; }
.profile-form-help__content p { margin: 0; color: #c3ced6; font-size: 14px; line-height: 1.55; }
.profile-form-help__direct, .profile-form-help__continue { width: fit-content; min-height: 44px; padding: 10px 14px; display: inline-flex; align-items: center; gap: 8px; border: 1px solid rgba(0,185,255,.38); border-radius: 10px; color: #fff; font-size: 14px; font-weight: 700; line-height: 1.4; text-decoration: none; }
.profile-form-help__direct { background: rgba(0,185,255,.14); }
.profile-form-help__continue { background: rgba(255,255,255,.04); }
.profile-form-help__direct:hover, .profile-form-help__continue:hover { background: rgba(0,185,255,.22); }
.profile-form-help__support a { color: #8edaff; text-underline-offset: 3px; }
.profile-loading { position: absolute; z-index: 3; inset: 0; min-height: 420px; display: grid; place-content: center; justify-items: center; gap: 14px; background: #0d1116; color: #dfe7ec; font: 650 12px/1.45 var(--mono); letter-spacing: .075em; text-align: center; text-transform: uppercase; transition: opacity 220ms ease, visibility 220ms ease; }
.profile-loading i { width: 34px; height: 34px; border: 2px solid rgba(0,185,255,.2); border-top-color: var(--cyan); border-radius: 50%; animation: profile-spin 800ms linear infinite; }
.profile-form[data-form-state="ready"] .profile-loading,.profile-form[data-form-state="unavailable"] .profile-loading { opacity: 0; visibility: hidden; }
.profile-after { padding: 20px clamp(22px, 3vw, 32px); display: flex; align-items: center; justify-content: space-between; gap: 18px; border-top: 1px solid var(--line-soft); background: rgba(255,255,255,.025); }
.profile-after p { margin: 0; color: #bdc7cf; font-size: 14px; line-height: 1.5; }
.profile-after a { color: #fff; font-size: 14px; font-weight: 700; text-align: right; text-decoration: underline; text-decoration-color: rgba(0,185,255,.62); text-underline-offset: 4px; }
.profile-after a:hover, .profile-after a:focus-visible { color: var(--cyan); outline: none; }
.profile-privacy { margin: 0; padding: 17px clamp(22px, 3vw, 32px) 21px; border-top: 1px solid var(--line-soft); color: #aeb9c2; font-size: 13px; line-height: 1.55; }
@keyframes profile-spin { to { transform: rotate(360deg); } }
@media (max-width: 980px) { .profile-layout { grid-template-columns: 1fr; } .profile-visual { position: relative; top: auto; min-height: 560px; } }
@media (max-width: 680px) { .profile-current-strip .shop-shell { min-height: 72px; padding: 12px 0; align-items: flex-start; flex-direction: column; gap: 5px; } .profile-current-strip a { text-align: left; } .profile-main { padding-top: 20px; } .profile-layout { width: min(100% - 28px, 1180px); } .profile-visual { min-height: 500px; border-radius: 24px; } .profile-panel { border-radius: 24px; } .profile-panel__heading { grid-template-columns: 1fr; gap: 14px; } .profile-status, .profile-after { align-items: flex-start; flex-direction: column; } .profile-status strong, .profile-after a { text-align: left; } }
@media (prefers-reduced-motion: reduce) { .profile-loading i { animation: none; } }
