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

body { margin:0; background:#fff; font-family:'Inter',system-ui,sans-serif; color:#233041; }
a { color:#2f6690; text-decoration:none; }
a:hover { color:#1e3a5f; }
.au-wrap { min-height:100vh; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); }
.au-side { position:relative; overflow:hidden; background:#d6e6f3; background-image:radial-gradient(ellipse at 20% 0%, rgba(143,210,255,.75), transparent 58%), radial-gradient(ellipse at 90% 100%, rgba(47,102,144,.32), transparent 55%); color:#233041; padding:40px 48px; display:flex; flex-direction:column; }
.au-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(47,102,144,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(47,102,144,.07) 1px, transparent 1px); background-size:44px 44px; mask-image:radial-gradient(ellipse at 50% 55%, #000 30%, transparent 75%); -webkit-mask-image:radial-gradient(ellipse at 50% 55%, #000 30%, transparent 75%); pointer-events:none; }
.au-valve { position:relative; width:78%; max-width:420px; margin:0 auto; display:block; filter:drop-shadow(0 28px 40px rgba(15,36,56,.28)); animation:au-float 7s ease-in-out infinite; }
@keyframes au-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-10px); } }
.au-ring { position:absolute; left:50%; top:50%; width:118%; aspect-ratio:1; transform:translate(-50%,-50%); border-radius:999px; border:1px solid rgba(47,102,144,.16); pointer-events:none; }
.au-ring.two { width:90%; border-color:rgba(47,102,144,.1); }
.au-stage { position:relative; width:78%; max-width:420px; aspect-ratio:1; margin:0 auto; display:grid; place-items:center; }
.au-stage .au-valve { width:86%; position:relative; z-index:2; }
.au-glow { position:absolute; inset:14%; border-radius:999px; background:radial-gradient(circle, rgba(255,255,255,.95) 0%, rgba(143,210,255,.55) 45%, transparent 72%); filter:blur(6px); animation:au-breathe 5s ease-in-out infinite; }
@keyframes au-breathe { 0%,100% { transform:scale(1); opacity:.85; } 50% { transform:scale(1.06); opacity:1; } }
.au-orbit { position:absolute; inset:2%; border-radius:999px; border:1.5px dashed rgba(47,102,144,.35); animation:au-rot 40s linear infinite; }
.au-orbit.b { inset:-6%; border:1px solid rgba(47,102,144,.18); animation-duration:60s; animation-direction:reverse; }
.au-orbit::after { content:""; position:absolute; top:-5px; left:50%; width:10px; height:10px; margin-left:-5px; border-radius:999px; background:#2f6690; box-shadow:0 0 0 4px rgba(47,102,144,.18), 0 0 14px rgba(47,102,144,.6); }
.au-orbit.b::after { width:7px; height:7px; margin-left:-3.5px; top:-3.5px; background:#8fd2ff; box-shadow:0 0 12px rgba(143,210,255,.9); }
@keyframes au-rot { to { transform:rotate(360deg); } }
.au-sweep { position:absolute; inset:10%; border-radius:999px; overflow:hidden; z-index:3; pointer-events:none; mask-image:radial-gradient(circle, #000 60%, transparent 70%); -webkit-mask-image:radial-gradient(circle, #000 60%, transparent 70%); }
.au-sweep::before { content:""; position:absolute; left:0; right:0; height:22%; top:-22%; background:linear-gradient(180deg, transparent, rgba(143,210,255,.35) 70%, rgba(255,255,255,.9) 100%); border-bottom:1.5px solid #8fd2ff; box-shadow:0 2px 14px rgba(143,210,255,.8); animation:au-scan 4.5s cubic-bezier(.45,0,.55,1) infinite; }
@keyframes au-scan { 0% { top:-22%; } 55%,100% { top:100%; } }
.au-tag { position:absolute; z-index:4; display:flex; align-items:center; gap:7px; background:rgba(255,255,255,.88); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); border:1px solid rgba(47,102,144,.25); border-radius:999px; padding:6px 11px 6px 8px; font-size:12px; font-weight:600; color:#1e3a5f; white-space:nowrap; box-shadow:0 10px 22px -14px rgba(15,36,56,.5); animation:au-tagfloat 6s ease-in-out infinite; }
.au-tag b { width:8px; height:8px; border-radius:999px; background:#1f9d55; box-shadow:0 0 0 3px rgba(31,157,85,.18); flex:none; }
.au-tag.t1 { top:10%; left:-4%; }
.au-tag.t2 { top:44%; right:-8%; animation-delay:-2s; }
.au-tag.t3 { bottom:8%; left:6%; animation-delay:-4s; }
@keyframes au-tagfloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-6px); } }
.au-combo { position:relative; width:100%; max-width:520px; aspect-ratio:1.05; margin:0 auto; }
.au-combo .au-draw { position:absolute; top:0; left:0; width:52%; max-width:none; z-index:1; }
.au-combo .au-shots { position:absolute; right:0; bottom:0; width:72%; max-width:none; z-index:2; }
.au-draw { width:100%; max-width:360px; margin:0 auto; }
.au-draw svg { display:block; width:100%; height:auto; overflow:visible; }
.au-draw .dr { stroke-dasharray:1100; stroke-dashoffset:1100; animation:au-draw 2.4s cubic-bezier(.4,0,.2,1) forwards; }
.au-draw .dr.d2 { animation-delay:.4s; } .au-draw .dr.d3 { animation-delay:.8s; }
@keyframes au-draw { to { stroke-dashoffset:0; } }
.au-draw .dim { stroke-dasharray:340; stroke-dashoffset:340; animation:au-draw 1.2s ease forwards 1.6s; }
.au-draw .lbl { opacity:0; animation:au-lbl .5s ease forwards 2.3s; }
.au-draw .lbl.l2 { animation-delay:2.5s; } .au-draw .lbl.l3 { animation-delay:2.7s; }
@keyframes au-lbl { to { opacity:1; } }
.au-shots { position:relative; width:100%; max-width:480px; aspect-ratio:1.15; margin:0 auto; }
.au-shot { position:absolute; width:78%; border-radius:14px; overflow:hidden; background:#fff; border:1px solid rgba(47,102,144,.22); box-shadow:0 30px 60px -30px rgba(15,36,56,.6); animation:au-bob 8s ease-in-out infinite; }
.au-shot img { display:block; width:100%; height:auto; }
.au-shot.s1 { top:0; left:0; transform:rotate(-3deg); z-index:1; }
.au-shot.s2 { bottom:0; right:0; transform:rotate(2.5deg); z-index:2; animation-delay:-4s; }
.au-shot.s1 { animation-name:au-bob1; } .au-shot.s2 { animation-name:au-bob2; }
@keyframes au-bob1 { 0%,100% { transform:rotate(-3deg) translateY(0); } 50% { transform:rotate(-3deg) translateY(-8px); } }
@keyframes au-bob2 { 0%,100% { transform:rotate(2.5deg) translateY(0); } 50% { transform:rotate(2.5deg) translateY(-8px); } }
.au-shot-lbl { position:absolute; top:10px; left:10px; background:#1e3a5f; color:#fff; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; border-radius:999px; padding:5px 10px; box-shadow:0 6px 14px -8px rgba(15,36,56,.8); }
.au-mock { position:relative; width:100%; max-width:440px; height:360px; margin:0 auto; }
.au-card { position:absolute; background:rgba(255,255,255,.9); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border:1px solid rgba(47,102,144,.2); border-radius:18px; padding:16px 18px; display:flex; flex-direction:column; gap:11px; box-shadow:0 24px 50px -28px rgba(15,36,56,.55); animation:au-bob 7s ease-in-out infinite; }
.au-card.c1 { top:0; left:0; width:62%; }
.au-card.c2 { bottom:22px; right:0; width:64%; animation-delay:-3.5s; }
@keyframes au-bob { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-8px); } }
.au-card-k { font-size:10.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#2f6690; }
.au-mfield { display:flex; flex-direction:column; gap:2px; border:1px solid #d7dee5; border-radius:10px; padding:8px 10px; font-size:14px; font-weight:600; color:#233041; background:#fbfcfd; }
.au-mfield span { font-size:10.5px; font-weight:600; color:#8a97a5; }
.au-match { display:flex; align-items:center; gap:10px; background:#e8f6ee; border-radius:11px; padding:9px 11px; font-size:13px; animation:au-pulse 3.5s ease-in-out infinite; }
.au-match i, .au-sent i { width:22px; height:22px; border-radius:999px; background:#1f9d55; display:grid; place-items:center; flex:none; }
@keyframes au-pulse { 0%,100% { box-shadow:0 0 0 0 rgba(31,157,85,0); } 50% { box-shadow:0 0 0 5px rgba(31,157,85,.14); } }
.au-count { min-width:22px; height:22px; border-radius:999px; background:#1e3a5f; color:#fff; font-size:11.5px; font-weight:700; display:grid; place-items:center; }
.au-row { display:flex; align-items:center; gap:9px; font-size:13px; color:#233041; padding:7px 0; border-top:1px solid #eef1f4; }
.au-row b { margin-left:auto; font-weight:600; color:#5c6b7a; }
.au-dot { width:7px; height:7px; border-radius:999px; background:#2f6690; flex:none; }
.au-row.new { animation:au-newrow 5s ease-in-out infinite; border-radius:8px; }
@keyframes au-newrow { 0%,20% { background:rgba(143,210,255,0); } 35%,65% { background:rgba(143,210,255,.3); } 85%,100% { background:rgba(143,210,255,0); } }
.au-sent { position:absolute; left:10%; bottom:0; display:flex; align-items:center; gap:8px; background:#1e3a5f; color:#fff; font-size:13px; font-weight:600; border-radius:999px; padding:8px 14px 8px 8px; box-shadow:0 16px 30px -16px rgba(15,36,56,.8); animation:au-bob 6s ease-in-out infinite; animation-delay:-1.5s; }
.au-point { display:flex; align-items:center; gap:10px; font-size:14.5px; color:#3d4c5c; }
.au-mascot { display:block; flex:none; width:84px; height:84px; transform-origin:50% 90%; animation:au-hi 3.2s ease-in-out infinite; }
@keyframes au-hi { 0%,60%,100% { transform:rotate(0); } 68% { transform:rotate(-6deg); } 76% { transform:rotate(5deg); } 84% { transform:rotate(-4deg); } 92% { transform:rotate(2deg); } }
.au-point i { width:22px; height:22px; border-radius:999px; background:#fff; border:1px solid rgba(47,102,144,.3); display:grid; place-items:center; flex:none; font-style:normal; }
.au-main { display:flex; flex-direction:column; padding:28px 48px; background:#fff; }
.au-back { align-self:flex-start; display:flex; align-items:center; gap:7px; font-size:13.5px; font-weight:600; color:#5c6b7a; border:1px solid #e0e6ec; border-radius:999px; padding:8px 15px 8px 11px; transition: color .15s ease, border-color .15s ease, background .15s ease; }
.au-back:hover { color:#1e3a5f; border-color:#9fb8cc; background:#f6f8fa; }
.au-form { width:100%; max-width:400px; margin:auto; display:flex; flex-direction:column; gap:26px; padding:36px 0; }
.au-label { font-size:13px; font-weight:600; color:#5c6b7a; }
.au-field { position:relative; }
.au-field svg.lead { position:absolute; left:14px; top:50%; transform:translateY(-50%); color:#a6b0bc; pointer-events:none; transition: color .15s ease; }
.au-input { width:100%; box-sizing:border-box; padding:14px 14px 14px 42px; border-radius:12px; border:1px solid #d7dee5; font-family:'Inter',sans-serif; font-size:15px; color:#233041; background:#fbfcfd; transition: border-color .15s ease, box-shadow .15s ease, background .15s ease; }
.au-input::placeholder { color:#a6b0bc; }
.au-input:focus { outline:none; border-color:#2f6690; background:#fff; box-shadow:0 0 0 4px rgba(47,102,144,.14); }
.au-field:focus-within svg.lead { color:#2f6690; }
.au-eye { position:absolute; right:8px; top:50%; transform:translateY(-50%); width:34px; height:34px; border-radius:9px; border:none; background:transparent; color:#8a97a5; display:grid; place-items:center; cursor:pointer; }
.au-eye:hover { background:#eef1f4; color:#1e3a5f; }
.au-btn { position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center; gap:9px; width:100%; border:none; border-radius:12px; padding:15px; font-family:'Inter',sans-serif; font-size:15.5px; font-weight:600; color:#fff; cursor:pointer; background:linear-gradient(135deg,#2f6690,#153a5c); box-shadow:0 12px 26px -14px rgba(21,58,92,.9), inset 0 1px 0 rgba(255,255,255,.2); transition: transform .15s ease, box-shadow .15s ease; }
.au-btn:hover { transform:translateY(-1px); box-shadow:0 16px 30px -14px rgba(21,58,92,.95), inset 0 1px 0 rgba(255,255,255,.24); }
.au-btn:active { transform:none; }
.au-btn::after { content:""; position:absolute; top:0; bottom:0; width:40%; left:-50%; background:linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent); transform:skewX(-20deg); transition:left .6s ease; }
.au-btn:hover::after { left:120%; }
.au-spin { width:16px; height:16px; border-radius:999px; border:2px solid rgba(255,255,255,.35); border-top-color:#fff; animation:au-spin .7s linear infinite; }
@keyframes au-spin { to { transform:rotate(360deg); } }
.au-check { width:17px; height:17px; border-radius:5px; border:1.5px solid #c3ccd6; display:grid; place-items:center; background:#fff; flex:none; transition: background .15s ease, border-color .15s ease; }
.au-check.on { background:#2f6690; border-color:#2f6690; }
.au-in { animation:au-in .6s cubic-bezier(.2,.8,.2,1) both; }
.au-in.d2 { animation-delay:.08s; } .au-in.d3 { animation-delay:.16s; } .au-in.d4 { animation-delay:.24s; }
@keyframes au-in { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }
@media (max-width: 900px) {
  .au-wrap { grid-template-columns:minmax(0,1fr); }
  .au-side { padding:22px 20px 26px; }
  .au-side .au-hide { display:none; }
  .au-combo { display:none; }
  .au-side-title { font-size:24px !important; }
  .au-main { padding:0 20px 28px; }
  .au-form { padding:26px 0 8px; gap:22px; }
  .au-back-desk { display:none !important; }
  .au-mascot { width:64px; height:64px; }
}
@media (min-width: 901px) { .au-back-mob { display:none !important; } }
.au-chip { border:1px solid #d7dee5; background:#fbfcfd; border-radius:999px; padding:9px 15px; font-size:14px; font-weight:600; color:#233041; cursor:pointer; transition: border-color .15s ease, background .15s ease, color .15s ease; }
.au-chip:hover { border-color:#9fb8cc; }
.au-chip.on { background:#1e3a5f; border-color:#1e3a5f; color:#fff; }
.au-row2 { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px; }
.au-ta { padding:13px 14px !important; resize:vertical; min-height:88px; }
.au-ok { width:64px; height:64px; border-radius:999px; background:#e8f6ee; display:grid; place-items:center; animation:au-pop .5s cubic-bezier(.2,.9,.3,1.3) both; }
@keyframes au-pop { from { transform:scale(.5); opacity:0; } to { transform:none; opacity:1; } }
@media (max-width: 900px) { .au-row2 { grid-template-columns:minmax(0,1fr); } }
