/* RT Webinar Popup - Enhanced UI */
*{margin:0;padding:0;box-sizing:border-box}

.rtwpop-overlay{
  position:fixed;inset:0;
  background:rgba(15, 23, 42, 0.6);
  backdrop-filter: blur(4px); /* Modern glass effect */
  display:none;align-items:center;justify-content:center;
  z-index:99999;
  padding:16px;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.rtwpop-overlay.active{
  display:flex;
  opacity: 1;
}

/* Container: added smooth animation and softer shadows */
.rtwpop-container{
  width:100%;
  max-width:440px;
  max-height:90vh;
  display:flex;
  flex-direction:column;
  background:#ffffff;
  border:1px solid rgba(0,0,0,0.05);
  border-radius:24px; /* Slightly rounder */
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  position:relative;
  z-index:0;
  transform: scale(0.95) translateY(10px);
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.rtwpop-overlay.active .rtwpop-container {
  transform: scale(1) translateY(0);
}

/* Close button */
.rtwpop-close{
  position:absolute;top:-14px;right:-14px;
  width:40px;height:40px;              /* Apple/Google 44px min touch target relaxed slightly to match ref design */
  border:1px solid #eef0f3;background:#ffffff;
  border-radius:50%;
  font-size:16px;line-height:1;font-weight:700;
  color:#1f2937;cursor:pointer;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.15);
  transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index:3;
  touch-action: manipulation;          /* removes mobile tap delay / double-tap-to-hover quirk */
  -webkit-tap-highlight-color: transparent;
}
.rtwpop-close:hover{
  background:#f8fafc;
  color:#0f172a;
  transform: rotate(90deg);
}
.rtwpop-close:active{
  background:#f1f5f9;
  color:#0f172a;
  transform: scale(0.92);
}

.rtwpop-content{
  padding:40px 32px 32px;
  text-align:center;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  position:relative;
  z-index:1;
}

/* Typography Enhancements */
.rtwpop-brand-badge {
  display: inline-block;
  background: #e0e7ff;
  color: #4338ca;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 4px 12px;
  border-radius: 20px;
  margin-bottom: 16px;
}

.rtwpop-greeting{
  font-family: system-ui, -apple-system, sans-serif;
  font-weight: 800;
  font-size: clamp(28px, 7vw, 36px);
  line-height: 1.2;
  margin: 0 0 10px;
}

.rtwpop-headline{
  font-family: system-ui, -apple-system, sans-serif;
  font-weight: 800;
  color:#1e293b;
  margin:0 0 14px;
  line-height:1.2;
  font-size:clamp(26px, 6.5vw, 34px);
}

.rtwpop-subheadline{
  font-family: system-ui, -apple-system, sans-serif;
  font-weight:700;
  color:#334155;
  margin:0 0 24px;
  line-height:1.4;
  font-size:clamp(16px, 4.2vw, 19px);
}

/* Inputs */
.rtwpop-field{margin:16px 0}
.rtwpop-field input{
  box-sizing:border-box;
  width:100%;
  padding:18px;
  font-size:16px;
  border-radius:14px;
  border:1.5px solid #e5e1ee;
  background:#f4f2f9;
  outline:none;
  color:#0f172a;
  transition: all 0.2s ease;
}
.rtwpop-field input::placeholder {
  color: #94a3b8;
}
.rtwpop-field input:focus{
  background:#fff;
  border-color:#6366f1;
  box-shadow:0 0 0 4px rgba(99, 102, 241, 0.15);
}

/* Button */
.rtwpop-submit{
  -webkit-appearance:none;
  appearance:none;
  box-sizing:border-box;
  display:block;
  width:100%;
  margin-top:8px;
  padding:18px;
  border:none;
  border-radius:14px;
  background:#3b82f6;
  color:#fff;
  font-size:16px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:0.6px;
  cursor:pointer;
  transition: all 0.2s ease;
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.25);
}
.rtwpop-submit:hover{
  background:#2563eb;
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(37, 99, 235, 0.35);
}

.rtwpop-submit--small{
  padding:12px;
  font-size:14px;
  background: #f1f5f9;
  color: #0f172a;
  box-shadow: none;
}
.rtwpop-submit--small:hover {
  background: #e2e8f0;
  box-shadow: none;
}

.rtwpop-privacy{
  font-size:12px;
  color:#94a3b8;
  margin-top:16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.rtwpop-error{
  display:none;
  margin-top:16px;
  padding:12px;
  border-radius:8px;
  background:#fef2f2;
  border:1px solid #fecaca;
  color:#ef4444;
  font-size:14px;
  font-weight: 500;
}

.rtwpop-success{
  display:none;
  padding:20px 0 10px;
}
.rtwpop-success.active{
  display:block;
  animation: fadeUp 0.4s ease forwards;
}
.rtwpop-success-title{
  font-size:24px;
  font-weight:800;
  color:#10b981;
  margin-bottom:8px;
}
.rtwpop-success-text{
  font-size:15px;
  color:#475569;
  margin-bottom:24px;
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width:480px){
  .rtwpop-content{padding:32px 20px 24px}
  .rtwpop-close{top:8px;right:8px;}
  .rtwpop-field input{padding:14px}
}

/* Short viewports (landscape phones, small browser windows, split-screen)
   — independent of width, since a wide-but-short window wouldn't trigger
   the max-width rule above but has the exact same "not enough room"
   problem. Tightens vertical rhythm so the button never gets clipped by
   the 90vh cap without the visitor realizing the modal scrolls. */
@media (max-height:750px){
  .rtwpop-content{padding:24px 28px 20px}
  .rtwpop-greeting{font-size:clamp(22px, 6vw, 28px); margin-bottom:6px;}
  .rtwpop-headline{font-size:clamp(20px, 5vw, 26px); margin-bottom:8px;}
  .rtwpop-subheadline{font-size:clamp(14px, 3.5vw, 16px); margin-bottom:14px;}
  .rtwpop-field{margin:10px 0}
  .rtwpop-field input{padding:13px}
  .rtwpop-submit{padding:13px; margin-top:6px;}
}
@media (max-height:600px){
  .rtwpop-greeting{font-size:20px; margin-bottom:4px;}
  .rtwpop-headline{font-size:18px; margin-bottom:6px;}
  .rtwpop-subheadline{font-size:13px; margin-bottom:10px;}
  .rtwpop-content{padding:18px 24px 16px}
}
