@import url('/faq.css?v=57');
.topbar { height:auto; min-height:42px; padding-right:0; gap:20px; }
.contact-banner { margin-left:auto; background:transparent; color:#fff; display:flex; align-items:center; justify-content:flex-end; gap:16px; padding:10px 20px; flex-wrap:wrap; font-size:12px; }
.contact-banner>a { display:flex; align-items:center; gap:7px; white-space:nowrap; }
.contact-banner svg { width:16px; height:16px; }
.contact-banner .social { gap:14px; }
.contact-banner .social a { border:0; width:20px; height:20px; }
.hero-description { max-width:560px; }
@media(min-width:641px) { .hero { height:auto; min-height:31.3cqw; } .hero-copy { padding-bottom:5cqw; } }
.hero-benefits { gap:10px 16px; flex-wrap:wrap; }
.hero-benefits span { white-space:nowrap; }
.hero-benefits svg { display:block; flex:0 0 24px; align-self:center; color:#fff; background:none; padding:0; filter:none; width:24px; height:24px; border-radius:0; overflow:visible; }
.footer-grid .quick-links { display:flex; flex-direction:column; gap:7px; }
.always { overflow:visible; }
#support-launch { display:grid; place-items:center; width:64px; height:64px; max-width:none; padding:0; margin:22px 0 16px auto; border:0; border-radius:50%; background:#F26522; color:#fff; box-shadow:0 8px 30px #f2652255; }
#support-launch svg { width:28px; height:28px; position:relative; z-index:2; }
#support-launch::before,#support-launch::after { content:''; position:absolute; inset:0; border:0; border-radius:50%; background:#f26522; z-index:-1; pointer-events:none; animation:contact-halo 2.4s ease-out infinite; }
#support-launch::after { animation-delay:1.2s; }
@keyframes contact-halo { 0% { transform:scale(1); opacity:.45; } 75%,100% { transform:scale(2.1); opacity:0; } }
#contact-form { width:calc(100% - 40px); max-width:1400px; max-height:92dvh; padding:18px; border:0; border-radius:0; overflow:auto; background:#fff; color:#00213b; }
#contact-form .contact-close { z-index:4; right:20px; top:20px; }
.contact-layout { background:#ecf9fc; border-radius:42px; padding:32px; display:grid; grid-template-columns:1fr 1.05fr 1.05fr; gap:24px; }
.contact-details { padding:25px 0; }
#contact-form h2 { font-size:clamp(24px,2.2vw,34px); line-height:1.3; margin:0 0 24px; letter-spacing:-.02em; }
.contact-details>div { position:relative; padding-left:38px; margin-top:30px; }
.contact-details svg { position:absolute; left:0; top:0; width:27px; height:27px; color:#38b5d9; }
#contact-form h3 { font-size:22px; line-height:1.4; }
#contact-form .contact-details a { font-size:18px; overflow-wrap:anywhere; }
.contact-whatsapp,.contact-entry { background:#fff; border-radius:42px; padding:30px; min-width:0; }
.contact-whatsapp { position:relative; overflow:hidden; min-height:520px; display:flex; flex-direction:column; }
#contact-form .contact-whatsapp h2 { color:#37c658; }
.contact-whatsapp-art { flex:1; margin:24px -30px -30px; display:flex; align-items:flex-end; min-height:240px; }
.contact-whatsapp-art>img { display:block; width:100%; height:auto; object-fit:contain; }
.contact-chat-now { position:absolute; left:30px; bottom:28px; background:#fff; padding:13px 24px; border-radius:12px; font-size:14px; z-index:2; }
#contact-form .contact-entry h2 { color:#38b5d9; }
#contact-form input:not([type=radio]),#contact-form textarea { width:100%; border:0; border-bottom:1px solid #a4a9ad; border-radius:0; background:#fff; padding:14px 10px; margin:0 0 10px; font-size:15px; }
#contact-form textarea { min-height:110px; }
#contact-form fieldset { border:0; padding:0; margin:12px 0; display:flex; flex-wrap:wrap; gap:7px 14px; }
#contact-form legend { font-size:16px; font-weight:600; margin-bottom:8px; }
#contact-form fieldset label { display:flex; align-items:center; gap:5px; margin:0; }
#contact-form input[type=radio] { display:inline-block; width:auto; margin:0; accent-color:#38b5d9; }
#contact-form .contact-entry .button { width:auto; min-width:120px; background:#38b5d9; box-shadow:none; margin:0; }
#contact-form [hidden] { display:none!important; }
@media(max-width:1100px) { .topbar {flex-wrap:wrap;gap:0;padding:0;} .topbar>span{padding:9px 16px;} .contact-banner{width:100%;justify-content:center;flex-wrap:wrap;gap:10px 20px;} .contact-layout{grid-template-columns:1fr 1fr;} .contact-details{grid-column:1/-1;display:flex;gap:22px;flex-wrap:wrap;padding:0;} .contact-details h2{width:100%;} .contact-details>div{flex:1 1 200px;margin-top:0;} }
@media(max-width:640px) { .contact-banner {padding:10px 12px;font-size:11px;} .contact-banner .social{display:flex;} .hero-benefits{display:grid;grid-template-columns:1fr 1fr;gap:12px;} .hero-benefits span{white-space:normal;padding:6px 0;} #contact-form{width:calc(100% - 16px);padding:8px;} .contact-layout{grid-template-columns:1fr;padding:22px 16px;gap:20px;border-radius:24px;} .contact-whatsapp,.contact-entry{border-radius:24px;padding:24px;} .contact-whatsapp{min-height:410px;} .contact-whatsapp-art{margin:15px -24px -24px;} }
@media(prefers-reduced-motion:reduce) { #support-launch::before,#support-launch::after{animation:none;opacity:0;} }
/* Compact contact surface, keeping every field and contact method. */
#contact-form { max-width:1050px; padding:12px; }
#contact-form, #contact-form * { font-family:'Plus Jakarta Sans'!important; font-size:13px!important; }
#contact-form .contact-layout { padding:24px; gap:18px; border-radius:28px; }
#contact-form .contact-whatsapp, #contact-form .contact-entry { padding:22px; border-radius:26px; }
#contact-form h2 { font-weight:700; line-height:1.5; margin-bottom:16px; }
#contact-form h3 { font-weight:700; }
#contact-form .contact-details { padding:16px 0; }
#contact-form .contact-details>div { margin-top:22px; padding-left:30px; }
#contact-form .contact-details svg { width:21px; height:21px; }
#contact-form .contact-whatsapp { min-height:390px; }
#contact-form .contact-whatsapp-art { margin:16px -22px -22px; min-height:200px; }
#contact-form .contact-whatsapp-art img { height:100%; min-height:235px; max-height:290px; object-fit:cover; object-position:30% center; }
#contact-form input:not([type=radio]), #contact-form textarea { padding:10px 6px; margin-bottom:7px; }
#contact-form textarea { min-height:75px; }
#contact-form .contact-chat-now { left:22px; bottom:22px; padding:10px 18px; }
#contact-form .contact-close { display:grid; place-items:center; width:30px; height:30px; }
@media(max-width:640px) { #contact-form .contact-layout { padding:18px 14px; } }

/* Footer directory and opposite-end contact actions. */
#contact .footer-grid{grid-template-columns:1.25fr repeat(4,1fr);gap:20px}
#contact .footer-links a{display:block;margin:0 0 10px;line-height:1.5}
.footer-actions{display:flex;align-items:center;justify-content:space-between;padding:8px 2.9cqw 28px;gap:24px}
.footer-actions #support-launch{position:relative;isolation:isolate;flex-shrink:0;margin:0 0 0 auto}
.footer-whatsapp{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#25d366;color:white;transition:transform .25s,box-shadow .25s}
.footer-whatsapp svg{width:30px;height:30px;stroke-width:1.7}
.footer-whatsapp:hover{transform:translateY(-3px);box-shadow:0 5px 20px #25d36644}
.service-grid .service-card:nth-child(n+7){grid-column:span 4}
@media(max-width:800px){#contact .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#contact .footer-brand{grid-column:1/-1}.footer-actions{padding:12px 22px 28px}}
@media(prefers-reduced-motion:reduce){.footer-whatsapp{transition:none}.footer-whatsapp:hover{transform:none}}

/* Explicit full-width placement keeps the two launchers on opposite sides. */
#contact .footer-actions{width:100%;display:grid;grid-template-columns:56px minmax(0,1fr) 64px;align-items:center;box-sizing:border-box}
#contact .footer-actions>.footer-whatsapp{grid-column:1;justify-self:start;margin:0;position:relative;left:auto;right:auto}
#contact .footer-actions>#support-launch{grid-column:3;justify-self:end;margin:0;position:relative;left:auto;right:auto}
#contact .social-heading{font:500 14px 'Plus Jakarta Sans';color:inherit;margin:18px 0 10px}
.footer-contact-info{padding:20px 2.9cqw;border-top:1px solid #ffffff1c}
.footer-contact-info h3{font-size:14px;margin:0 0 14px;color:#fff}
.footer-contact-info>div{display:grid;grid-template-columns:1.5fr 1fr 1.3fr 1fr;gap:20px}
.footer-contact-info p{font-size:12px;line-height:1.65;overflow-wrap:anywhere}
.plan h3{white-space:normal;min-height:3.8em;line-height:1.3;overflow-wrap:anywhere}
@media(max-width:700px){.footer-contact-info>div{grid-template-columns:1fr 1fr}}
@media(max-width:380px){.footer-contact-info>div{grid-template-columns:1fr}}

#plans{grid-template-columns:repeat(5,minmax(0,1fr))}
#plans .plan{display:flex;flex-direction:column;min-width:0}
#plans .plan h3{min-height:2.6em}
#plans .plan .speed{font-size:12px;font-weight:500;line-height:1.5;min-height:3em;margin:0 0 12px}
#plans .plan ul{flex:1}
#plans .plan li{white-space:normal;line-height:1.5}
@media(max-width:800px){#plans{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px){#plans{grid-template-columns:1fr}}

#contact .footer-links:last-child{position:relative;padding-right:85px}
#contact .footer-links>#support-launch{position:absolute;right:0;top:62px;margin:0;width:56px;height:56px;isolation:isolate}
@media(max-width:800px){#contact .footer-links:last-child{padding-right:75px}}

#contact .footer-grid{grid-template-columns:1.15fr .9fr 1fr 1fr 1.25fr 1.15fr;gap:16px}
#contact .footer-grid>.footer-contact-info{padding-top:0;padding-bottom:0;padding-right:0;border-top:0}
#contact .footer-contact-info>div{display:flex;flex-direction:column;gap:12px}
#contact .footer-contact-info h3{margin:0 0 12px}
@media(max-width:1000px){#contact .footer-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){#contact .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#contact .footer-brand{grid-column:1/-1}}

#contact .footer-actions[hidden]{display:none}
.topbar>.contact-banner:only-child{margin-left:auto}

/* CodeFronts-inspired 3D pricing interaction, scoped to the existing Kade plans. */
#plans .plan{transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transform-style:preserve-3d;transition:transform .5s cubic-bezier(.2,.9,.3,1.1),box-shadow .45s ease,border-color .35s ease;will-change:transform}
#plans .plan::after{content:'';position:absolute;inset:1px;border-radius:inherit;pointer-events:none;background:radial-gradient(circle at var(--glow-x,50%) var(--glow-y,35%),rgba(255,255,255,.82),transparent 36%);opacity:0;transition:opacity .3s ease}
#plans .plan.tilting{transition:transform .08s linear,box-shadow .3s ease;box-shadow:0 26px 54px rgba(9,51,130,.22),inset 0 1px #fff;border-color:color-mix(in srgb,var(--accent) 60%,#fff)}
#plans .plan.tilting::after{opacity:.7}#plans .plan.featured.tilting{box-shadow:0 30px 64px color-mix(in srgb,var(--accent) 38%,transparent),0 16px 42px rgba(9,51,130,.16)}
#plans .plan.tilting{transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) scale(1.025);will-change:transform}
#plans .plan.featured::after{mask:none;padding:0}
@media(prefers-reduced-motion:reduce){#plans .plan,#plans .plan.tilting{transform:none!important;transition:none;will-change:auto}}