 :root{
   --bg:#070b14;
   --card:#101a2d;
   --card2:#0b1324;
  --text:#ffffff;
  --muted:#ffffff;
   --line:rgba(44, 60, 93, .75);
  --brand:#12d6c8;
  --brand2:#00aaff;
   --shadow: 0 18px 55px rgba(0,0,0,.35);
  --shadow2: 0 10px 30px rgba(18,214,200,.14);
  --glow: 0 0 0 3px rgba(18,214,200,.22);
  --shadowSoft: 0 12px 34px rgba(0,0,0,.28);
  --shadowLift: 0 22px 70px rgba(0,0,0,.42);
  --rim: rgba(255,255,255,.06);
  --rim2: rgba(255,255,255,.10);
  --shine: radial-gradient(900px 260px at 18% 10%, rgba(255,255,255,.10), transparent 55%);
  --shine2: radial-gradient(860px 260px at 82% 20%, rgba(255,255,255,.08), transparent 58%);
 }
 
 *{box-sizing:border-box}
 html{scroll-behavior:smooth}
 body{
   margin:0;
   font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "PingFang SC","Microsoft YaHei", Arial;
  font-size:15px;
  line-height:1.6;
   color:var(--text);
   background:
    repeating-linear-gradient(120deg, rgba(255,255,255,.018), rgba(255,255,255,.018) 1px, transparent 1px, transparent 12px),
    repeating-linear-gradient(30deg, rgba(255,255,255,.012), rgba(255,255,255,.012) 1px, transparent 1px, transparent 18px),
     radial-gradient(1200px 600px at 12% 8%, rgba(124,77,255,.18), transparent 60%),
     radial-gradient(900px 520px at 90% 18%, rgba(79,140,255,.18), transparent 58%),
     linear-gradient(180deg, rgba(7,11,20,.92), rgba(5,8,15,.96));
 }
 a{color:inherit}
 a:focus-visible, button:focus-visible{
   outline:none;
   box-shadow: var(--glow);
 }
 
 @media (prefers-reduced-motion: reduce){
   html{scroll-behavior:auto}
   *{transition:none !important; animation:none !important}
 }

@media (hover: none){
  .metricCard:hover,
  .card:hover,
  .step:hover{
    transform: none;
    filter: none;
  }
}
 
 .skip{
   position:absolute;
   left:-999px;
   top:auto;
   width:1px;
   height:1px;
   overflow:hidden;
 }
 .skip:focus{
   left:16px;
   top:16px;
   width:auto;
   height:auto;
   padding:10px 12px;
   border-radius:12px;
   background:rgba(17,26,46,.9);
   border:1px solid var(--line);
   z-index:9999;
 }
 
 .container{
   max-width:1140px;
   margin:0 auto;
   padding:0 18px;
 }
 
.main{
  perspective: 1000px;
}

 .header{
   position:sticky;
   top:0;
   z-index:50;
   background:rgba(7,11,20,.62);
   backdrop-filter: blur(10px);
   border-bottom:1px solid rgba(44, 60, 93, .55);
 }
 .header::after{
   content:"";
   position:absolute;
   left:0;
   right:0;
   bottom:-1px;
   height:1px;
   background: linear-gradient(90deg, transparent, rgba(79,140,255,.5), rgba(124,77,255,.5), transparent);
   opacity:.55;
   pointer-events:none;
 }
.header::before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(700px 160px at 14% 10%, rgba(124,77,255,.10), transparent 60%),
    radial-gradient(700px 160px at 86% 20%, rgba(79,140,255,.10), transparent 60%);
  opacity:.9;
  pointer-events:none;
}
 .headerInner{
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap:14px;
   padding:14px 0;
 }
@media (max-width: 720px){
  .container{padding:0 14px}
  .headerInner{
    flex-wrap:wrap;
    gap:10px;
    padding:10px 0;
  }
  .brand{
    flex:0 1 auto;
    order:1;
    min-width:0;
  }
  .nav{
    width:100%;
    order:3;
    gap:8px;
    padding-bottom:2px;
  }
  .actions{
    width:auto;
    order:2;
    margin-left:auto;
    justify-content:flex-end;
  }
}
@media (max-width: 520px){
  .headerInner{gap:8px}
  .brandSub{display:block}
  .brand{max-width:none}
  .actions{flex:1 1 auto; min-width:0}
  .brandLogo{height:54px; width:180px}
  .brandTitle{
    font-size:24px;
    line-height:1.2;
    letter-spacing:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .brandSub{font-size:10px}
  .navLink{font-size:12px; padding:8px 10px}
  .langbtn{padding:7px 9px; border-radius:12px}
  .actions{gap:8px}
  .actions .btn{padding:9px 10px}
}
 .brand{
   display:flex;
   flex-direction:column;
   align-items:flex-start;
  gap:4px;
   text-decoration:none;
  flex:0 0 auto;
 }
.brandLogo{
  display:block;
  height:72px;
  width:240px;
  max-width:100%;
  flex:0 0 auto;
}
 .brandLogo img{
   width:100%;
   height:100%;
   display:block;
   object-fit:contain;
   object-position:left center;
   padding:0;
   filter:none;
 }
 .brandText{
  display:flex;
  flex-direction:column;
  gap:2px;
  line-height:1.2;
 }
 .brandTitle{
   font-weight:900;
   letter-spacing:.2px;
   font-size:34px;
 }
 .brandSub{
   color:var(--muted);
   font-size:12px;
 }

@keyframes ambientSweep{
  0%{transform:translate3d(-12%, -10%, 0) rotate(0deg); opacity:.50}
  50%{transform:translate3d(10%, 6%, 0) rotate(16deg); opacity:.72}
  100%{transform:translate3d(-12%, -10%, 0) rotate(0deg); opacity:.50}
}

@keyframes sheen{
  0%{transform:translateX(-140%)}
  100%{transform:translateX(140%)}
}
 
 .nav{
   display:flex;
   align-items:center;
   gap:12px;
   overflow:auto;
   scrollbar-width:none;
 }
 .nav::-webkit-scrollbar{display:none}
 .navLink{
   text-decoration:none;
   font-size:12px;
   color:var(--muted);
   padding:8px 10px;
   border-radius:999px;
   border:1px solid transparent;
   white-space:nowrap;
   transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
 }
 .navLink:hover{
   color:var(--text);
   border-color:rgba(44, 60, 93, .6);
   background:rgba(16,26,45,.55);
 }
 .navLink.active{
   color:var(--text);
   border-color:rgba(79,140,255,.55);
   background: linear-gradient(135deg, rgba(79,140,255,.16), rgba(124,77,255,.14));
 }
 
 .actions{
   display:flex;
   align-items:center;
   gap:10px;
   flex-wrap:wrap;
   justify-content:flex-end;
 }
 .langbar{
   display:flex;
   gap:8px;
 }
 .langbtn{
   border:1px solid rgba(44, 60, 93, .7);
   background:rgba(16,26,45,.55);
   color:var(--text);
   padding:8px 10px;
   border-radius:12px;
   cursor:pointer;
   font-weight:800;
   font-size:12px;
   transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
 }
 .langbtn[aria-pressed="true"]{
   border-color:rgba(79,140,255,.95);
   box-shadow:0 0 0 3px rgba(79,140,255,.18);
 }
 .langbtn:hover{transform: translateY(-1px)}
 
 .btn{
   display:inline-flex;
   align-items:center;
   justify-content:center;
   gap:8px;
   padding:10px 14px;
   border-radius:12px;
   font-weight:900;
   font-size:12px;
   text-decoration:none;
   border:1px solid rgba(44, 60, 93, .75);
   transition: transform .18s ease, box-shadow .18s ease, filter .18s ease, background .18s ease;
 }
 .btn.primary{
   border:none;
   background: linear-gradient(135deg, var(--brand), var(--brand2));
   color:white;
   box-shadow: 0 14px 45px rgba(124,77,255,.22);
  position:relative;
  overflow:hidden;
 }
.btn.primary::after{
  content:"";
  position:absolute;
  inset:-2px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent);
  transform: translateX(-140%);
  animation: sheen 2.8s ease-in-out infinite;
  opacity:.55;
  pointer-events:none;
}
 .btn.primary:hover{
   transform: translateY(-1px);
   filter: brightness(1.06);
   box-shadow: 0 18px 55px rgba(124,77,255,.22), var(--shadow2);
 }
.btn.primary:active{
  transform: translateY(1px) scale(.99);
}
 .btn.ghost{
   background:rgba(16,26,45,.35);
   color:var(--text);
   box-shadow: none;
 }
 .btn.ghost:hover{
   transform: translateY(-1px);
   background:rgba(16,26,45,.55);
 }
 .btn:active{transform:translateY(1px)}
 
 .main{padding-bottom:60px}
 
 .hero{
   padding:40px 0 18px;
 }
@media (max-width: 520px){
  .hero{padding:22px 0 12px}
  .heroCopy{padding:18px 16px}
  .heroPanel{padding:14px}
  .heroCta{flex-direction:column; align-items:stretch}
  .heroCta .btn{width:100%}
}
 .heroGrid{
   display:grid;
   grid-template-columns: 1.1fr .9fr;
   gap:16px;
   align-items:stretch;
 }
 @media (max-width: 980px){
   .heroGrid{grid-template-columns:1fr}
 }
 .heroCopy{
   border:1px solid var(--line);
   background: linear-gradient(180deg, rgba(16,26,45,.82), rgba(11,19,36,.74));
   border-radius:18px;
   padding:22px 20px;
  box-shadow: var(--shadow), inset 0 1px 0 var(--rim);
   position:relative;
   overflow:hidden;
 }
 .heroCopy::before{
   content:"";
   position:absolute;
   inset:-1px;
   background: radial-gradient(900px 340px at 8% 10%, rgba(79,140,255,.20), transparent 55%),
     radial-gradient(760px 320px at 90% 30%, rgba(124,77,255,.18), transparent 58%);
   opacity:.8;
   pointer-events:none;
  animation: ambientSweep 12s ease-in-out infinite;
 }
.heroCopy::after{
  content:"";
  position:absolute;
  inset:-1px;
  background: var(--shine), var(--shine2);
  opacity:.35;
  pointer-events:none;
}
 .pill{
   display:inline-flex;
   align-items:center;
   padding:8px 10px;
   border-radius:999px;
   border:1px solid rgba(44, 60, 93, .7);
   background:rgba(11,19,36,.5);
  color:#ffffff;
   font-weight:800;
   font-size:12px;
 }
 .heroTitle{
   margin:12px 0 10px;
   font-size:32px;
   letter-spacing:.2px;
 }
 @media (max-width: 520px){
   .heroTitle{font-size:26px}
 }
 .heroDesc{
   margin:0 0 16px;
   color:var(--muted);
   font-size:12px;
   line-height:1.75;
 }
 .heroCta{
   display:flex;
   gap:10px;
   flex-wrap:wrap;
   margin-top:8px;
 }
 .fineprint{
   margin-top:14px;
  color:var(--muted);
   font-size:12px;
   line-height:1.65;
 }
 
 .heroPanel{
   border:1px solid var(--line);
   background: rgba(16,26,45,.62);
   border-radius:18px;
   padding:18px;
  box-shadow: var(--shadow), inset 0 1px 0 var(--rim);
   position:relative;
   overflow:hidden;
 }
 .heroPanel::before{
   content:"";
   position:absolute;
   top:-120px;
   right:-140px;
   width:360px;
   height:360px;
   border-radius:999px;
   background: radial-gradient(circle at 30% 30%, rgba(79,140,255,.26), transparent 60%);
   filter: blur(0px);
   opacity:.75;
   pointer-events:none;
  animation: ambientSweep 14s ease-in-out infinite;
 }
 .metricGrid{
   display:grid;
   grid-template-columns:1fr 1fr;
   gap:12px;
 }
 @media (max-width: 520px){
   .metricGrid{grid-template-columns:1fr}
 }
 .metricCard{
   border:1px solid rgba(44, 60, 93, .75);
   background: rgba(11,19,36,.6);
   border-radius:16px;
   padding:12px 12px;
  box-shadow: inset 0 1px 0 var(--rim);
  transform: translateZ(0);
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
 }
 .metricCard:hover{
  transform: translateY(-3px) rotateX(1.2deg);
   border-color:rgba(79,140,255,.35);
   background: rgba(11,19,36,.75);
  box-shadow: var(--shadowSoft), inset 0 1px 0 var(--rim2);
 }
 .metricCardPrimary{
   border-color:rgba(79,140,255,.45);
   background: linear-gradient(135deg, rgba(79,140,255,.18), rgba(124,77,255,.14));
 }
 .metricLabel{
  color:#ffffff;
   font-size:12px;
   font-weight:900;
 }
 .metricValue{
   margin-top:6px;
   font-size:20px;
   font-weight:950;
   letter-spacing:.2px;
 }
 .metricSub{
   margin-top:6px;
   color:var(--muted);
   font-size:12px;
   line-height:1.55;
 }
 
 .trust{
   padding:10px 0 6px;
 }
 .trustRow{
   display:flex;
   flex-wrap:wrap;
   gap:10px;
 }
 .trustBadge{
   border:1px solid rgba(44, 60, 93, .65);
   background: rgba(11,19,36,.35);
   color:var(--muted);
   font-size:12px;
   padding:8px 10px;
   border-radius:999px;
   transition: transform .18s ease, background .18s ease, border-color .18s ease, color .18s ease;
 }
 .trustBadge:hover{
   transform: translateY(-1px);
   border-color:rgba(79,140,255,.35);
   background: rgba(11,19,36,.55);
   color: var(--text);
 }
 
 .section{
   padding:26px 0;
   scroll-margin-top: 84px;
 }
@media (max-width: 520px){
  .section{
    padding:18px 0;
    scroll-margin-top: 110px;
  }
  .sectionTitle{font-size:17px}
  .sectionDesc{font-size:12px}
}
 .sectionAlt{
   position:relative;
 }
 .sectionAlt::before{
   content:"";
   position:absolute;
   left:0;
   right:0;
   top:0;
   bottom:0;
   background: linear-gradient(180deg, rgba(16,26,45,.18), rgba(16,26,45,0));
   border-top:1px solid rgba(44, 60, 93, .42);
   border-bottom:1px solid rgba(44, 60, 93, .28);
   pointer-events:none;
 }
 .sectionHead{
   margin-bottom:14px;
 }
 .sectionTitle{
   margin:0 0 8px;
   font-size:18px;
 }
 .sectionDesc{
   margin:0;
   color:var(--muted);
   font-size:12px;
   line-height:1.75;
 }
 
 .cardGrid{
   display:grid;
   grid-template-columns:repeat(3, 1fr);
   gap:12px;
   margin-top:14px;
 }
 @media (max-width: 980px){
   .cardGrid{grid-template-columns:1fr}
 }
 .card{
   border:1px solid rgba(44, 60, 93, .75);
   background: rgba(16,26,45,.55);
   border-radius:16px;
   padding:14px 14px;
  position:relative;
  overflow:hidden;
  box-shadow: inset 0 1px 0 var(--rim);
  transform: translateZ(0);
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease, filter .18s ease;
 }
.card::before{
  content:"";
  position:absolute;
  inset:-1px;
  background: radial-gradient(600px 200px at 18% 12%, rgba(255,255,255,.10), transparent 60%),
    radial-gradient(560px 180px at 82% 22%, rgba(79,140,255,.10), transparent 62%);
  opacity:.28;
  pointer-events:none;
}
 .card:hover{
  transform: translateY(-4px) rotateX(1.4deg) rotateY(-1deg);
   border-color:rgba(79,140,255,.35);
   background: rgba(16,26,45,.72);
  box-shadow: var(--shadowSoft), inset 0 1px 0 var(--rim2);
  filter: saturate(1.05);
 }
 .cardTitle{
   font-weight:950;
   font-size:13px;
  color:#ffffff;
   margin-bottom:8px;
 }
 .cardText{
   color:var(--muted);
   font-size:12px;
   line-height:1.7;
 }
 .cardKicker{
   display:flex;
   gap:12px;
   align-items:flex-start;
 }
@media (max-width: 520px){
  .card{padding:14px 14px}
  .cardKicker{gap:12px; align-items:center}
}
 .cardIcon{
   width:96px;
   height:96px;
   border-radius:22px;
   flex:0 0 auto;
   display:grid;
   place-items:center;
   font-weight:950;
   color:#ffffff;
   background: linear-gradient(135deg, var(--brand), var(--brand2));
   box-shadow: 0 10px 26px rgba(0,0,0,.28);
   overflow:hidden;
 }
 .cardIcon img{
   width:100%;
   height:100%;
   display:block;
   object-fit:cover;
 }
 .cardBody{min-width:0}
 @media (max-width: 520px){
   .cardIcon{
     width:88px;
     height:88px;
     border-radius:20px;
   }
 }
.inlineLink{
  color:#ffffff;
  text-decoration:none;
  font-weight:900;
}
.inlineLink:hover{
  color:var(--text);
  text-decoration:underline;
}
 
 .steps{
   display:grid;
   gap:12px;
   margin-top:14px;
 }
 .step{
   display:flex;
   gap:12px;
   border:1px solid rgba(44, 60, 93, .75);
   background: rgba(16,26,45,.45);
   border-radius:16px;
   padding:12px 12px;
  box-shadow: inset 0 1px 0 var(--rim);
  transform: translateZ(0);
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
 }
 .step:hover{
  transform: translateY(-3px) rotateX(1.2deg);
   border-color:rgba(79,140,255,.35);
   background: rgba(16,26,45,.60);
  box-shadow: var(--shadowSoft), inset 0 1px 0 var(--rim2);
 }
 .stepNum{
   width:32px;
   height:32px;
   border-radius:12px;
   background: linear-gradient(135deg, var(--brand), var(--brand2));
   display:grid;
   place-items:center;
   font-weight:950;
 }
 .stepTitle{
   font-weight:950;
   font-size:13px;
  color:#ffffff;
 }
 .stepText{
   margin-top:4px;
   color:var(--muted);
   font-size:12px;
   line-height:1.7;
 }
 
 .ctaStrip{
   margin-top:14px;
   border:1px solid rgba(44, 60, 93, .75);
   background: linear-gradient(135deg, rgba(79,140,255,.14), rgba(124,77,255,.12));
   border-radius:18px;
   padding:14px 14px;
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap:12px;
   flex-wrap:wrap;
   box-shadow: var(--shadow2);
 }
 .ctaStripTitle{
   font-weight:950;
   margin-bottom:4px;
   font-size:14px;
 }
 .ctaStripText{
   color:var(--muted);
   font-size:12px;
   line-height:1.7;
 }
 
 .split{
   display:grid;
   grid-template-columns:1fr 1fr;
   gap:12px;
   margin-top:14px;
 }
 @media (max-width: 980px){
   .split{grid-template-columns:1fr}
 }
 
 .list{
   margin-top:14px;
   display:grid;
   gap:10px;
 }
 .listItem{
   border:1px solid rgba(44, 60, 93, .75);
   background: rgba(16,26,45,.45);
   border-radius:14px;
   padding:10px 12px;
   color:var(--muted);
   font-size:12px;
   line-height:1.7;
 }
 
 .faq{
   display:grid;
   gap:10px;
   margin-top:14px;
 }
 .faqItem{
   border:1px solid rgba(44, 60, 93, .75);
   background: rgba(16,26,45,.45);
   border-radius:14px;
   padding:10px 12px;
   transition: border-color .18s ease, background .18s ease, transform .18s ease;
 }
 .faqItem:hover{
   border-color:rgba(79,140,255,.32);
 }
 .faqItem summary{
   cursor:pointer;
   font-weight:950;
  color:#ffffff;
   list-style:none;
 }
 .faqItem summary::-webkit-details-marker{display:none}
 .faqItem[open]{
   background: rgba(16,26,45,.66);
   border-color:rgba(79,140,255,.40);
 }
 .faqBody{
   margin-top:10px;
   color:var(--muted);
   font-size:12px;
   line-height:1.75;
 }
 
 .heroPanelArt{
   margin-top:14px;
   border:1px solid rgba(44, 60, 93, .65);
   background: rgba(11,19,36,.40);
   border-radius:16px;
   overflow:hidden;
 }
 .heroPanelArt img{
   display:block;
   width:100%;
   height:190px;
   object-fit:cover;
   object-position:center;
  opacity:1;
 }
 @media (max-width: 520px){
   .heroPanelArt img{height:160px}
 }
 
 details{
   user-select:none;
 }
 details > *{
   user-select:text;
 }
 details[open] .faqBody{
   animation: fadeUp .18s ease-out;
 }
 @keyframes fadeUp{
   from{opacity:0; transform: translateY(-2px)}
   to{opacity:1; transform: translateY(0)}
 }
 
 .floatTop{
   position:fixed;
   right:18px;
   bottom:18px;
   width:44px;
   height:44px;
   border-radius:16px;
   display:grid;
   place-items:center;
   text-decoration:none;
   color:var(--text);
   border:1px solid rgba(44, 60, 93, .75);
   background: rgba(16,26,45,.65);
   backdrop-filter: blur(10px);
   box-shadow: var(--shadow2);
   transition: transform .18s ease, background .18s ease, border-color .18s ease, opacity .18s ease;
 }
 .floatTop:hover{
   transform: translateY(-2px);
   border-color:rgba(79,140,255,.45);
   background: rgba(16,26,45,.85);
 }
 
 .risk{
   padding-bottom:0;
 }
 .riskBox{
   border:1px solid rgba(44, 60, 93, .85);
   background: rgba(11,19,36,.62);
   border-radius:18px;
   padding:18px;
 }
 .riskText{
  color:var(--muted);
   font-size:12px;
   line-height:1.8;
 }
 
 .footer{
   margin-top:14px;
   padding:14px 0 8px;
   border-top:1px solid rgba(44, 60, 93, .55);
   color:var(--muted);
 }
 .footerRow{
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap:12px;
   flex-wrap:wrap;
 }
 .footerBrand{
   font-weight:950;
  color:#ffffff;
 }
 .footerLinks{
   margin-top:10px;
   display:flex;
   gap:12px;
   flex-wrap:wrap;
 }
 .footerLink{
   color:var(--muted);
   text-decoration:none;
   font-size:12px;
 }
 .footerLink:hover{color:var(--text)}

.modalOverlay{
  position:fixed;
  inset:0;
  background: rgba(5,8,15,.72);
  backdrop-filter: blur(10px);
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  z-index:200;
}
.modalOverlay:target{
  display:flex;
}
.modalOverlay[data-open="true"]{
  display:flex;
}
.modal{
  width:min(720px, 100%);
  border-radius:18px;
  border:1px solid rgba(44, 60, 93, .85);
  background: linear-gradient(180deg, rgba(16,26,45,.92), rgba(11,19,36,.92));
  box-shadow: var(--shadow);
  overflow:hidden;
}
.modalHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 14px;
  border-bottom:1px solid rgba(44, 60, 93, .55);
}
.modalTitle{
  font-weight:950;
  font-size:13px;
  color:#ffffff;
}
.modalClose{
  width:34px;
  height:34px;
  border-radius:12px;
  border:1px solid rgba(44, 60, 93, .75);
  background: rgba(16,26,45,.45);
  color:var(--text);
  cursor:pointer;
  font-size:18px;
  line-height:1;
  display:grid;
  place-items:center;
}
.modalClose:hover{
  background: rgba(16,26,45,.70);
}
.modalBody{
  padding:14px 14px;
}
.formGrid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
}
@media (max-width: 720px){
  .formGrid{grid-template-columns:1fr}
}
.field{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.input{
  width:100%;
  border-radius:12px;
  border:1px solid rgba(44, 60, 93, .75);
  background: rgba(11,19,36,.45);
  color:var(--text);
  padding:10px 12px;
  font-size:12px;
}
.input::placeholder{
  color: rgba(159, 176, 198, .78);
}
.formHint{
  margin-top:12px;
  color:var(--muted);
  font-size:12px;
  line-height:1.65;
  min-height:18px;
}
.modalActions{
  margin-top:12px;
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
}
@media (max-width: 520px){
  .modalOverlay{padding:12px}
  .modalActions{
    justify-content:stretch;
    gap:10px;
  }
  .modalActions .btn{
    width:100%;
    justify-content:center;
  }
  .input{font-size:14px; padding:12px 14px}
}
.btn.whatsapp{
  border:1px solid rgba(18, 214, 200, .55);
  background: linear-gradient(135deg, rgba(18,214,200,.24), rgba(0,170,255,.12));
  color:var(--text);
}
.btn.whatsapp:hover{
  transform: translateY(-1px);
  filter: brightness(1.06);
}

.waFloat{
  position:fixed;
  right:16px;
  bottom:92px;
  z-index:190;
  touch-action:none;
  display:none;
}
.waFloatBtn{
  width:72px;
  height:72px;
  border-radius:20px;
  background:transparent;
  color:#ffffff;
  display:grid;
  place-items:center;
  text-decoration:none;
  box-shadow: var(--shadowLift);
  border:1px solid rgba(255,255,255,.12);
  overflow:hidden;
}
.waFloatImg{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.waFloatBtn:active{
  transform: translateY(1px);
}
@media (max-width: 520px){
  .waFloat{bottom:86px}
  .waFloatBtn{
    width:66px;
    height:66px;
    border-radius:18px;
  }
}
