/* CloudyBoost shared refinements */
html, body { max-width:100%; overflow-x:hidden; }
*, *::before, *::after { box-sizing:border-box; }
img, svg, video, iframe { max-width:100%; }
.container, .nav-container { width:100%; max-width:1200px; }

/* Shared authentication card inspired by the supplied reference */
.auth-modal { padding:16px; overflow-y:auto; }
.auth-card {
  max-width:560px;
  width:min(100%, 560px);
  padding:0 28px 26px;
  background:#fff;
  color:#171717;
  border:none;
  border-radius:30px;
  overflow:hidden;
  box-shadow:0 28px 80px rgba(0,0,0,.35);
}
.auth-image { display:none !important; }
.auth-card > .close-modal { z-index:5; top:14px; right:14px; background:rgba(255,255,255,.22); color:#fff; }
.auth-card > div[id$="View"] .auth-header {
  margin:0 -28px 0;
  padding:36px 28px 82px;
  background:linear-gradient(135deg,#ff704f 0%,#f45b3d 55%,#ff7654 100%);
  color:#fff;
  position:relative;
  overflow:hidden;
}
.auth-card > div[id$="View"] .auth-header::before,
.auth-card > div[id$="View"] .auth-header::after {
  content:""; position:absolute; border-radius:50%; pointer-events:none;
}
.auth-card > div[id$="View"] .auth-header::before { width:180px;height:180px;left:-90px;bottom:-95px;background:rgba(255,214,70,.38); }
.auth-card > div[id$="View"] .auth-header::after { width:190px;height:190px;right:-100px;bottom:-95px;background:rgba(45,211,140,.42); }
.auth-header h2 { font-size:28px; line-height:1.15; position:relative; z-index:1; color:#fff; }
.auth-header h2 i { display:none; }
.auth-header p { color:rgba(255,255,255,.9); position:relative; z-index:1; }
.auth-card > div[id$="View"] form,
.auth-card > div[id$="View"] .switch-form,
.auth-card > div[id$="View"] .auth-error,
.auth-card > div[id$="View"] .auth-success {
  position:relative; z-index:2;
}
.auth-card > div[id$="View"] form {
  background:#fff;
  margin:-48px 0 0;
  padding:28px 0 0;
  border-radius:30px 30px 0 0;
}
.auth-input {
  background:#f4f4f5;
  border:1px solid transparent;
  color:#222;
  border-radius:14px;
  padding:14px 16px;
  min-height:52px;
  font-size:15px;
}
.auth-input:focus { background:#fff; border-color:#bdbdbd; box-shadow:0 0 0 3px rgba(124,58,237,.08); }
.auth-input::placeholder { color:#8b8b8b; }
.auth-submit { background:#111; color:#fff; border-radius:16px; min-height:54px; }
.auth-submit:hover { background:#000; box-shadow:0 8px 22px rgba(0,0,0,.16); }
.social-btn { min-height:52px; border:1px solid #ddd; background:#fff; color:#222; border-radius:16px; }
.social-btn:hover { background:#fafafa; border-color:#bbb; }
.divider { color:#777; margin:18px 0; }
.divider::before,.divider::after { background:#e5e5e5; }
.switch-form { color:#666; margin-bottom:0; }
.switch-form a { color:#222; }
.forgot-password a { color:#666; }
.password-field { margin-bottom:12px; }
.toggle-password { color:#777; }
.auth-error { background:#fff0f0; border-color:#ffd2d2; }
.auth-success { background:#effcf4; border-color:#c7f0d6; }
.auth-card .social-login { gap:10px; }

/* Testimonial carousel */
.testimonials { overflow:hidden; }
.testi-viewport { max-width:1200px; margin:0 auto; overflow:hidden; }
.testi-track { display:flex; gap:16px; will-change:transform; transition:transform .6s ease; }
.testi-card {
  flex:0 0 calc((100% - 32px)/3);
  min-width:0;
  aspect-ratio:1/1;
  padding:0;
  overflow:hidden;
  border:1px solid rgba(124,58,237,.45);
  border-radius:24px;
  background:#17131f;
  color:#fff;
  justify-content:flex-start;
  position:relative;
  transform:none !important;
}
.testi-card:hover { border-color:#8b5cf6; }
.testi-photo { height:52%; min-height:180px; position:relative; overflow:hidden; background:#242026; }
.testi-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.testi-photo::after { content:""; position:absolute; inset:0; border:3px solid #7c3aed; border-radius:20px 20px 0 0; pointer-events:none; }
.testi-stars { position:absolute; right:12px; bottom:12px; z-index:2; background:#b6ff00; color:#5d22b7; border-radius:14px; padding:7px 12px; font-size:14px; letter-spacing:2px; }
.testi-quote { background:linear-gradient(135deg,#7416ef,#8b00ff); flex:1; padding:20px 18px 18px; display:flex; flex-direction:column; justify-content:center; text-align:center; }
.testi-quote p { color:#fff; font-size:15px; line-height:1.45; margin:0 0 12px; }
.testi-quote h4 { color:#fff; font-size:14px; font-weight:500; margin:0; }

@media (max-width: 991px) {
  .nav-menu { display:none !important; }
  .nav-actions { display:none !important; }
  .hamburger { display:block !important; }
  .nav-container { padding-left:14px !important; padding-right:14px !important; }
  .hero, .services, .testimonials, .faq-section, section { max-width:100%; }
  .testi-card { flex-basis:100%; }
  .testi-photo { min-height:160px; }
}
@media (max-width: 560px) {
  .auth-modal { align-items:flex-start; padding:10px; }
  .auth-card { width:100%; max-height:calc(100vh - 20px); border-radius:24px; padding:0 18px 20px; }
  .auth-card > div[id$="View"] .auth-header { margin:0 -18px; padding:34px 22px 74px; }
  .auth-card > div[id$="View"] form { margin:-42px 0 0; padding-top:22px; }
  .auth-header h2 { font-size:25px; }
  .testimonials { padding-left:12px !important; padding-right:12px !important; }
  .testi-card { border-radius:20px; }
  .testi-quote p { font-size:14px; }
}
