/* Layout / Theme */
.ttk-wrap{padding:64px 0; color:#fff; font-family:Inter,system-ui,Segoe UI,Roboto,Arial; background:#0b0b0b;}
.ttk-wrap{
  background-image:
    radial-gradient(900px 420px at -10% -10%, rgba(255,106,0,.18), transparent 60%),
    radial-gradient(700px 380px at 110% 0%, rgba(255,45,85,.16), transparent 55%),
    radial-gradient(600px 360px at 50% 100%, rgba(0,242,234,.10), transparent 55%),
    linear-gradient(#0a0a0a,#090909);
  animation:bgshift 16s ease-in-out infinite alternate;
}
@keyframes bgshift{
  0%{background-position: 0 0, 100% 0, 50% 100%, 0 0;}
  100%{background-position: 20% -10%, 90% 10%, 60% 90%, 0 0;}
}
.ttk-container{max-width:1120px;margin:0 auto;padding:0 16px;}
.hero .title{font-size:38px;line-height:1.15;margin:0 0 10px;font-weight:900}
.hero .desc{opacity:.9;font-size:18px;margin-bottom:22px}
.ttk-grad,.ttk-grad .ttk-grad{background: linear-gradient(90deg,#FF6A00 0%, #FFAA00 35%, #FF2D55 70%, #00F2EA 100%); -webkit-background-clip:text; background-clip:text; color:transparent;}
.ttk-grad,.ttk-grad *{background:linear-gradient(90deg,#FF6A00 0%, #FFAA00 35%, #FF2D55 70%, #00F2EA 100%); -webkit-background-clip:text; background-clip:text; color:transparent;}

.grid{display:grid;grid-template-columns:1.1fr .9fr;gap:24px}
@media(max-width:900px){.grid{grid-template-columns:1fr}}

.card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:18px 18px 20px;box-shadow:0 16px 36px rgba(0,0,0,.36);backdrop-filter:blur(3px)}
.card h3{margin:0 0 12px;font-size:20px}

label{display:block;font-size:14px;margin:10px 0 6px;opacity:.9}
input[type="text"],input[type="tel"],input[type="email"]{width:100%;padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:#131313;color:#fff;outline:none}
input::placeholder{color:#aaa}
.radio{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:8px}
.radio .r-title{font-weight:800;margin-right:8px}
.radio .r{background:rgba(255,255,255,.06);padding:6px 10px;border-radius:12px;border:1px solid rgba(255,255,255,.10)}
.radio .r em{color:#FFAA00;font-style:normal;margin-left:4px}
.hp{display:none !important}

.btn{margin-top:14px;padding:12px 16px;border-radius:14px;border:none;cursor:pointer;font-weight:900;letter-spacing:.2px;background:linear-gradient(90deg,#FF6A00,#FF2D55);color:#fff;box-shadow:0 12px 26px rgba(255,106,0,.28), inset 0 0 14px rgba(255,255,255,.12);transition:transform .08s ease, filter .2s ease}
.btn:hover{transform:translateY(-1px);filter:saturate(1.2)}
.btn.glow{position:relative;overflow:hidden}
.btn.glow:before{content:'';position:absolute;inset:-2px;border-radius:16px;background:conic-gradient(from 0deg,#FF6A00,#FF2D55,#00F2EA,#FFAA00,#FF6A00);filter:blur(14px);opacity:.35;animation:spin 3.8s linear infinite;z-index:0}
.btn.glow span,.btn.glow{position:relative;z-index:1}
@keyframes spin{to{transform:rotate(360deg)}}

.hint{opacity:.8;font-size:13px;margin-top:8px}
.success{background:rgba(0,242,234,.08);border:1px solid rgba(0,242,234,.15);padding:16px;border-radius:12px}
.success .big{font-size:22px;font-weight:900;color:#00F2EA;text-shadow:0 0 16px rgba(0,242,234,.35)}
.error{background:rgba(255,45,85,.12);border:1px solid rgba(255,45,85,.25);padding:12px;border-radius:10px;margin-top:10px;color:#fff;display:none}

.disclaimer{opacity:.65;font-size:12px;margin-top:14px}

.feed-head{font-weight:800;margin-bottom:8px;opacity:.9}
.feed-list{max-height:440px;overflow:auto;display:flex;flex-direction:column;gap:10px;padding-right:6px}
.feed .item{display:flex;gap:10px;align-items:flex-start;background:rgba(17,17,17,.8);border:1px solid rgba(255,255,255,.06);padding:10px;border-radius:14px;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.feed .item .dot{width:10px;height:10px;border-radius:50%;background:#00F2EA;margin-top:6px;box-shadow:0 0 16px rgba(0,242,234,.55)}
.feed .item .msg{line-height:1.35}
.slide-up{animation:slide .35s ease-out}
@keyframes slide{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

.steps{margin:0;padding-left:18px;line-height:1.45}
.steps li{margin:6px 0}

.ft{margin-top:22px;opacity:.6;font-size:13px;text-align:center}


/* --- Round2 fixes --- */
html, body { background: #0b0b0b; }
body { 
  background-image:
    radial-gradient(900px 420px at -10% -10%, rgba(255,106,0,.18), transparent 60%),
    radial-gradient(700px 380px at 110% 0%, rgba(255,45,85,.16), transparent 55%),
    radial-gradient(600px 360px at 50% 100%, rgba(0,242,234,.10), transparent 55%),
    linear-gradient(#0a0a0a,#090909);
  background-attachment: fixed;
}

.ttk-wrap{min-height:100vh}

/* Radio group layout fix (mobile) */
.radio{display:grid; grid-template-columns: 1fr 1fr; gap:10px; align-items:center; margin-top:10px}
.radio .r-title{grid-column:1 / -1; margin:0 0 4px 0; font-weight:800}
.radio .r{display:flex; align-items:center; justify-content:center; gap:6px; padding:10px 12px; 
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); border-radius:12px}
.radio input[type="radio"]{transform:translateY(1px)}

/* Button alignment & size */
.btn{display:inline-flex; align-items:center; justify-content:center; width:100%;}

/* Feed card tighter & chat-look */
.feed .item{border-radius:16px; background:rgba(18,18,18,.92); border:1px solid rgba(255,255,255,.05)}
.feed-head{font-size:16px}


/* r3 — mobile radio chips fit + bolder labels */
.radio{display:grid; grid-template-columns: 1fr 1fr; gap:10px; align-items:stretch; margin-top:10px}
.radio .r-title{grid-column:1 / -1; margin:0 0 6px 0; font-weight:900; font-size:15px}

.radio .r{
  display:grid; grid-template-columns:auto 1fr; gap:8px;
  align-items:flex-start; justify-content:center;
  padding:12px 14px; border-radius:14px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10);
  font-weight:800; font-size:15px; line-height:1.15; text-align:left;
}
.radio .r input[type="radio"]{margin-top:2px; transform:translateY(1px)}
.radio .r em{display:block; font-size:13px; font-weight:900; color:#FFAA00; margin-top:2px;}

@media(max-width:420px){
  .radio .r{font-size:14px; padding:12px 12px;}
  .radio .r em{font-size:12.5px}
}

/* Make primary texts slightly bolder across the form */
label{font-weight:700}
input[type="text"], input[type="tel"]{font-weight:600}
.btn{font-weight:900}


/* r4 — ensure radio chips fit on very small screens */
.radio{display:grid; grid-template-columns: 1fr 1fr; gap:10px; align-items:stretch}
.radio .r{
  display:flex; flex-direction:column; align-items:flex-start; justify-content:center;
  padding:12px 12px; border-radius:14px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10);
  font-weight:800; font-size:14.5px; line-height:1.15; text-align:left; min-height:68px;
}
.radio .r em{margin-top:3px; font-size:12.5px; font-weight:900; color:#FFAA00}
.radio .r-title{grid-column:1 / -1; font-weight:900; font-size:15px; margin-bottom:6px}
.radio input[type="radio"]{margin-right:8px; transform:translateY(1px)}

/* On ultra-narrow screens stack chips vertically to avoid overflow */
@media (max-width: 380px){
  .radio{grid-template-columns:1fr}
  .radio .r{font-size:14px; min-height:64px}
  .radio .r em{font-size:12px}
}
