:root{
  --bg:#062826; --bg2:#08302d; --card:#0a3634; --line:rgba(46,214,193,.18);
  --ink:#f0ede2; --muted:#9fb4b0; --accent:#2ed6c1; --accent2:#22c3af;
  --field:#08302e; --ok:#37d67a;
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  font-family:var(--font); color:var(--ink);
  background:
    linear-gradient(rgba(46,214,193,.035) 1px, transparent 1px) 0 0/46px 46px,
    linear-gradient(90deg, rgba(46,214,193,.035) 1px, transparent 1px) 0 0/46px 46px,
    radial-gradient(1200px 700px at 72% -8%, #0f4b46 0%, var(--bg) 52%) no-repeat,
    var(--bg);
  -webkit-font-smoothing:antialiased; line-height:1.5;
}
.wrap{max-width:760px; margin:0 auto; padding:32px 20px 56px}

/* Brand */
.brand{display:flex; align-items:center; margin-bottom:24px}
.logo-mrads{height:70px; width:auto; display:block}
.logo-clout{height:24px; width:auto; display:block; opacity:.92}

/* Card */
.card{
  background:linear-gradient(180deg, var(--card), var(--bg2));
  border:1px solid var(--line); border-radius:20px;
  padding:34px 30px; box-shadow:0 30px 80px -40px rgba(0,0,0,.8);
}
.intro{margin-bottom:26px}
.pill{
  display:inline-flex; align-items:center; gap:8px; font-size:11.5px; font-weight:600;
  letter-spacing:1px; text-transform:uppercase; color:var(--accent);
  background:rgba(46,214,193,.06); border:1px solid rgba(46,214,193,.35);
  padding:7px 14px; border-radius:999px; margin-bottom:16px;
}
.pill::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 8px var(--accent)}
h1{font-size:32px; line-height:1.12; margin:.1em 0 .35em; letter-spacing:-.5px; color:var(--ink)}
.intro p{color:var(--muted); margin:0; max-width:60ch}

/* Fields */
.grid{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.field{display:flex; flex-direction:column; gap:7px}
.field.full{grid-column:1 / -1}
.field span{font-size:13.5px; color:#cfe0dc; font-weight:500}
.field b{color:var(--accent); font-weight:700}
input,select,textarea{
  font:inherit; color:var(--ink); background:var(--field);
  border:1px solid var(--line); border-radius:11px; padding:12px 13px; width:100%;
  transition:border-color .15s, box-shadow .15s;
}
textarea{resize:vertical}
input::placeholder,textarea::placeholder{color:#5c7370}
input:focus,select:focus,textarea:focus{
  outline:none; border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(46,214,193,.18);
}
select{appearance:none; background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' stroke='%239fb4b0' stroke-width='1.6' fill='none' stroke-linecap='round'/></svg>"); background-repeat:no-repeat; background-position:right 14px center; padding-right:34px}
.hp{position:absolute; left:-9999px; width:1px; height:1px; opacity:0}
.chks{display:flex; flex-wrap:wrap; gap:10px}
.chk{display:inline-flex; align-items:center; gap:9px; padding:11px 15px; border-radius:11px;
  border:1px solid var(--line); background:var(--field); color:var(--ink); font-size:14px;
  cursor:pointer; user-select:none; transition:border-color .15s, background .15s, color .15s}
.chk input{accent-color:var(--accent); width:16px; height:16px; cursor:pointer}
.chk:has(input:checked){border-color:var(--accent); background:rgba(46,214,193,.12); color:var(--accent)}

/* Button */
button{
  margin-top:24px; width:100%; cursor:pointer; border:0;
  font-size:16px; font-weight:700; color:#04231f; letter-spacing:.2px;
  background:linear-gradient(90deg,var(--accent),var(--accent2));
  padding:15px 18px; border-radius:12px;
  transition:transform .08s, filter .15s;
}
button:hover{filter:brightness(1.05)}
button:active{transform:translateY(1px)}
button:disabled{opacity:.6; cursor:progress}
.fine{font-size:12px; color:var(--muted); text-align:center; margin:12px 0 0}

/* Success */
.done{text-align:center; padding:20px 6px}
.check{width:64px; height:64px; margin:0 auto 12px; border-radius:50%;
  background:rgba(55,214,122,.12); color:var(--ok); font-size:34px; font-weight:700;
  display:flex; align-items:center; justify-content:center; border:1px solid rgba(55,214,122,.4)}
.done h2{margin:.2em 0; font-size:24px}
.done p{color:var(--muted); max-width:46ch; margin:0 auto}
.wa{display:inline-block; margin-top:18px; background:#25d366; color:#04210f; font-weight:700;
  text-decoration:none; padding:13px 20px; border-radius:11px}
.wa:hover{filter:brightness(1.05)}

.foot{display:flex; flex-direction:column; align-items:center; gap:9px; margin-top:28px}
.foot .pb{color:var(--muted); font-size:11px; letter-spacing:1.6px; text-transform:uppercase; font-weight:600}

@media (max-width:560px){
  .card{padding:26px 20px; border-radius:16px}
  h1{font-size:25px}
  .grid{grid-template-columns:1fr}
}