/*------------------------------------------------------------------
 * Template Name: WebyStrata Hosting UI
 * Company: WebyStrata Cloud Technologies Private Limited
 * Website: https://www.webystrata.com

 * Description:
 * Custom-built hosting interface for WebyStrata, designed for
 * scalable cloud infrastructure, WHMCS integration, and
 * high-performance multi-tenant environments.

 * Version: 1.0
 * Last Updated: 2026

 * Notes:
 * This interface is developed and customized for internal and
 * commercial use under WebyStrata infrastructure.

 * Copyright © 2026 WebyStrata Cloud Technologies Pvt Ltd
 -------------------------------------------------------------------*/
 
 /* Base UI framework originally derived from a commercial template and fully customized */
 
.indian-flag-cursor {
  cursor: url('https://cdn.pixabay.com/animation/2022/08/21/20/03/20-03-41-348_512.gif'), auto;
}

/* Ensure consistent sizing */
* {
  box-sizing: border-box;
}

/* Restore page scrolling globally */
html, body {
  height: auto;
  min-height: 100%;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  margin: 0;
  padding: 0;
}

/* Prevent widget from causing horizontal scroll */
#thMount {
  max-width: 100vw;
  overflow: visible;
}

/* Ensure floating button doesn’t stretch layout */
#thFab {
  max-width: none;
}

/* Mobile responsiveness for review tab */
@media (max-width: 768px) {
  #thMount .th-fab,
  #thFab {
    right: -50px;
    top: 45%;
    width: 130px;
    height: 36px;
    transform: translateY(-50%) rotate(-90deg);
  }
}

/* Ensure opening the panel does NOT lock scroll */
body.th-open {
  overflow-y: auto !important;
}

/*Same Price When You Renew Section*/
.plan-highlight {
  background-color: #0052cc;
  color: #ffffff;
  font-weight: 600;
  border-radius: 6px;
  padding: 6px 12px;
  position: relative;
  overflow: hidden;
}

.plan-highlight::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 80%;
  height: 100%;
  background: linear-gradient(120deg, rgba(255,255,255,0.05), rgba(255,255,255,0.7), rgba(255,255,255,0.05));
  transform: skewX(-25deg);
  animation: shine 5s infinite;
}

@keyframes shine {
  0% { left: -100%; }
  50% { left: 100%; }
  100% { left: 100%; }
}

/*Top Header*/

.top-header-annonce {
  background-color: #0a1633;
  color: #ffffff;
  padding: 10px 0;
  text-align: center;
}

.top-header-annonce-text {
  margin: 0;
  color: #ffffff;
  font-size: 14px;
  font-weight: 500;
}

.coodiv-text-11.white-text {
  color: #ffffff;
}

.top-header-annonce a {
  color: #ffffff;
  text-decoration: underline;
}

/* Default logo styling (desktop/tablet remains same) */
.brand-logo img {
  height: auto;
  max-height: 60px; /* Adjust if needed for desktop */
}

/* Mobile-specific adjustment */
@media (max-width: 768px) {
  .brand-logo img {
    max-height: 40px; /* Reduce height for mobile */
  }
}

/*Reseller Hosting features */
.trustedhosting_resellerfeatures {
  background: #ffffff;
  padding: 80px 0;
  font-family: 'Inter', sans-serif;
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.03);
}

.trustedhosting_title {
  text-align: center;
  font-size: 34px;
  font-weight: 700;
  color: #0b0b45;
  margin-bottom: 15px;
}

.trustedhosting_desc {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 40px;
  color: #444;
  font-size: 16px;
  line-height: 1.7;
}

.trustedhosting_tabs {
  display: flex;
  justify-content: center;
  border: 1px solid #d1d5db;
  border-radius: 12px;
  overflow-x: auto;
  white-space: nowrap;
  scrollbar-width: none;
  max-width: 900px;
  margin: 0 auto 50px;
  background: #fff;
}
.trustedhosting_tabs::-webkit-scrollbar {
  display: none;
}

.trustedhosting_tab {
  flex: 1;
  min-width: 200px;
  background: transparent;
  border: none;
  color: #111;
  font-weight: 600;
  padding: 16px 26px;
  font-size: 15px;
  cursor: pointer;
  transition: all 0.3s ease;
}
.trustedhosting_tab:not(:last-child) {
  border-right: 1px solid #e5e7eb;
}

.trustedhosting_tab.active {
  background: linear-gradient(90deg, #0b57d0 0%, #57a4ff 100%);
  color: #fff;
  box-shadow: 0 0 10px rgba(11, 87, 208, 0.15);
}

.trustedhosting_tab:hover:not(.active) {
  background: #f3f7ff;
}

.trustedhosting_grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 16px 30px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.trustedhosting_grid li {
  position: relative;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 14px 18px;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.6;
  transition: all 0.25s ease;
  cursor: help;
}

.trustedhosting_grid li:hover {
  background: #f9fbff;
  border-color: #0b57d0;
  box-shadow: 0 4px 10px rgba(11, 87, 208, 0.08);
}

.trustedhosting_grid li {
  position: relative;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 14px 18px; /* You can keep this as is */
  font-size: 15px;
  font-weight: 500;
  line-height: 1.6;
  transition: all 0.25s ease;
  cursor: help;
  list-style: none; /* Add this to ensure default bullets are also hidden */
}

.trustedhosting_grid li::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 0;
  bottom: 110%;
  background: linear-gradient(180deg, #0b0b45 0%, #142468 100%);
  color: #fff;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 13px;
  width: 260px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px) scale(0.98);
  transition: opacity 0.25s ease, transform 0.25s ease;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
  z-index: 20;
  backdrop-filter: blur(2px);
}

.trustedhosting_grid li:hover::after {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}

.trustedhosting_subtitle {
  margin-top: 40px;
  font-size: 22px;
  font-weight: 600;
  color: #0b0b45;
  border-top: 1px solid #e9edf4;
  padding-top: 20px;
}

.trustedhosting_tabcontent {
  display: none;
  animation: fadeIn 0.5s ease;
}

.trustedhosting_tabcontent.active {
  display: block;
}

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

/* Tablet view (≤768px) */
@media (max-width: 768px) {
  .trustedhosting_resellerfeatures {
    padding: 60px 0;
  }
  .trustedhosting_title {
    font-size: 28px;
  }
  .trustedhosting_desc {
    font-size: 15px;
    margin-bottom: 30px;
    padding: 0 20px;
  }
  .trustedhosting_tabs {
    flex-wrap: nowrap;
    margin: 0 15px 40px;
    border-radius: 10px;
  }
  .trustedhosting_tab {
    min-width: 160px;
    padding: 12px 16px;
    font-size: 14px;
  }
  .trustedhosting_grid {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 14px 20px;
    padding: 0 20px;
  }
}

/* Mobile view (≤480px) */
@media (max-width: 480px) {
  .trustedhosting_resellerfeatures {
    padding: 50px 0;
  }
  .trustedhosting_title {
    font-size: 24px;
    margin-bottom: 10px;
  }
  .trustedhosting_desc {
    font-size: 14px;
    line-height: 1.6;
    padding: 0 16px;
  }
  .trustedhosting_tabs {
    flex-direction: row;
    overflow-x: scroll;
    border-radius: 10px;
    margin: 0 10px 30px;
  }
  .trustedhosting_tab {
    min-width: 140px;
    font-size: 13px;
    padding: 10px 14px;
  }
  .trustedhosting_grid {
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 12px 16px;
    padding: 0 12px;
  }
  .trustedhosting_grid li {
    font-size: 14px;
    padding: 12px 14px;
  }
  .trustedhosting_subtitle {
    font-size: 18px;
    padding-top: 15px;
  }
}


/*Reseller Hosting FAQ Section*/

.trustedhosting_reseller_faq_finalwhite {
  background: #ffffff;
  color: #071029;
  font-family: 'Inter', sans-serif;
  padding: 100px 18px;
}
.th_faq_inner {max-width: 1200px; margin: 0 auto;}
.th_faq_header {text-align: center; margin-bottom: 50px;}
.th_faq_title {font-size: 34px; font-weight: 700; margin-bottom: 8px;}
.th_faq_underline {width: 80px; height: 4px; margin: 0 auto 14px; border-radius: 10px; background: linear-gradient(90deg,#0066ff,#33a1ff);}
.th_faq_subtitle {color: #58606b; font-size: 16px; max-width: 760px; margin: 0 auto; line-height: 1.6;}
.th_faq_row {display: flex; gap: 30px; margin-bottom: 40px; flex-wrap: wrap;}
.th_faq_col {flex: 1; min-width: 300px; display: flex; flex-direction: column; gap: 18px;}
.th_faq_card {background: #fff; border: 1px solid rgba(0,102,255,0.1); border-radius: 12px; box-shadow: 0 8px 22px rgba(0,102,255,0.06); transition: all 0.3s ease; opacity: 0; transform: translateY(40px);}
.th_faq_card.visible {opacity: 1; transform: translateY(0);}
.th_faq_card:hover {transform: translateY(-4px); box-shadow: 0 12px 32px rgba(0,102,255,0.15); border-color: rgba(0,102,255,0.25);}
.th_faq_question {width: 100%; background: none; border: none; text-align: left; font-size: 16px; font-weight: 600; color: #071029; padding: 18px 24px; cursor: pointer; position: relative;}
.th_faq_question::after {content: '+'; position: absolute; right: 24px; top: 18px; font-size: 20px; color: #0066ff; transition: transform 0.3s ease;}
.th_faq_question.active {color: #0066ff; background: rgba(0,102,255,0.03); border-bottom: 1px solid rgba(0,102,255,0.1);}
.th_faq_question.active::after {content: '−'; transform: rotate(180deg);}
.th_faq_answer {max-height: 0; overflow: hidden; background: #f9fcff; transition: max-height 0.4s ease, opacity 0.3s ease; opacity: 0; padding: 0 24px;}
.th_faq_answer p {margin: 0; padding: 0 0 16px; color: #444; font-size: 15px; line-height: 1.7;}
.th_faq_answer.open {opacity: 1;}
.th_faq_cta {text-align: center; margin-top: 60px; background: #f9fbff; padding: 50px 20px; border-radius: 16px; box-shadow: 0 10px 40px rgba(0,102,255,0.06);}
.th_faq_cta_title {font-size: 24px; font-weight: 700; margin-bottom: 10px;}
.th_faq_cta_text {color: #58606b; font-size: 16px; margin-bottom: 20px;}
.th_faq_cta_btn {
  display: inline-block;
  padding: 12px 28px;
  border-radius: 30px;
  background: linear-gradient(90deg, #0066ff, #2e85ff);
  color: #fff !important;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 12px 36px rgba(0,102,255,0.15);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.th_faq_cta_btn:hover {
  color: #fff !important;
  transform: translateY(-3px);
  box-shadow: 0 18px 46px rgba(0,102,255,0.25);
  background: linear-gradient(90deg, #005ae0, #1e7fff);
}
.fade-in {opacity: 0; transform: translateY(30px); transition: opacity 0.8s ease, transform 0.8s ease;}
.fade-in.visible {opacity: 1; transform: translateY(0);}
@media (max-width: 768px) {.th_faq_title {font-size: 26px;}.th_faq_row {flex-direction: column;}.th_faq_cta {padding: 40px 18px;}}

/* Scoped only for #extensions */
#extensions {
  background: #ffffff;
  padding: 90px 0;
  font-family: 'Inter', sans-serif;
}

#extensions .trusted-heading {
  font-size: 36px;
  font-weight: 700;
  line-height: 1.3;
  color: #0b0c10;
  text-align: center;
  margin-bottom: 20px;
}

#extensions .trusted-desc {
  font-size: 16px;
  color: #475569;
  line-height: 1.8;
  text-align: center;
  max-width: 760px;
  margin: 0 auto 50px;
}

/* Feature Card Group */
#extensions .main-webhosting-features-group {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 26px;
  padding: 0 20px;
}

/* Individual Feature Card */
#extensions .main-webhosting-features-item {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 28px 24px;
  flex: 0 0 calc(25% - 26px);
  max-width: calc(25% - 26px);
  text-align: center;
  transition: all 0.35s cubic-bezier(0.23, 1, 0.32, 1);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
}

#extensions .main-webhosting-features-item i {
  font-size: 30px;
  color: #0070bc;
  margin-bottom: 14px;
  transition: color 0.35s ease;
}

#extensions .main-webhosting-features-item h5 {
  font-size: 17px;
  font-weight: 600;
  color: #0b0c10;
  margin-bottom: 10px;
}

#extensions .main-webhosting-features-item p {
  font-size: 14.5px;
  color: #475569;
  line-height: 1.75;
}

/* Hover (desktop only) */
#extensions .main-webhosting-features-item:hover {
  transform: translateY(-6px);
  box-shadow: 0 10px 28px rgba(0, 112, 188, 0.16);
  border-color: #00a0ff;
}

#extensions .main-webhosting-features-item:hover i {
  color: #00a0ff;
}

/* ===================== */
/* RESPONSIVE BREAKPOINTS */
/* ===================== */

/* Tablet (≤992px) */
@media (max-width: 992px) {
  #extensions {
    padding: 70px 0;
  }
  #extensions .trusted-heading {
    font-size: 30px;
  }
  #extensions .trusted-desc {
    font-size: 15px;
    margin-bottom: 40px;
  }
  #extensions .main-webhosting-features-item {
    flex: 0 0 calc(33.333% - 24px);
    max-width: calc(33.333% - 24px);
    padding: 24px 18px;
  }
  #extensions .main-webhosting-features-item i {
    font-size: 28px;
  }
}

/* Tablet (≤768px) */
@media (max-width: 768px) {
  #extensions {
    padding: 60px 0;
  }
  #extensions .trusted-heading {
    font-size: 26px;
    line-height: 1.4;
  }
  #extensions .trusted-desc {
    font-size: 14.5px;
    padding: 0 18px;
  }
  #extensions .main-webhosting-features-item {
    flex: 0 0 calc(50% - 20px);
    max-width: calc(50% - 20px);
    padding: 22px 16px;
  }
  #extensions .main-webhosting-features-item h5 {
    font-size: 15.5px;
  }
  #extensions .main-webhosting-features-item p {
    font-size: 13.5px;
  }
}

/* Mobile (≤576px) */
@media (max-width: 576px) {
  #extensions {
    padding: 50px 0;
  }
  #extensions .trusted-heading {
    font-size: 22px;
    line-height: 1.35;
  }
  #extensions .trusted-desc {
    font-size: 14px;
    padding: 0 10px;
    margin-bottom: 35px;
  }
  #extensions .main-webhosting-features-group {
    gap: 18px;
  }
  #extensions .main-webhosting-features-item {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 20px 16px;
    border-radius: 10px;
  }
  #extensions .main-webhosting-features-item i {
    font-size: 26px;
  }
  #extensions .main-webhosting-features-item h5 {
    font-size: 15px;
  }
  #extensions .main-webhosting-features-item p {
    font-size: 13.5px;
  }
}

/*TrustedHosting.in Indedx Type 1*/

.trustedhosting-in-index-type1 h1{font-size:52px;font-weight:800;line-height:1.2;color:#0a1633;margin-bottom:24px;}
.trustedhosting-in-index-type1 .capsule-wrapper{display:inline-flex;align-items:center;gap:10px;margin-bottom:28px;}
.trustedhosting-in-index-type1 .status-dot{width:12px;height:12px;border-radius:50%;background:radial-gradient(circle,#00e676 0%,#00c853 80%);box-shadow:0 0 8px #00e676aa,0 0 16px #00e67666;}
.trustedhosting-in-index-type1 .dual-capsule{display:inline-flex;align-items:center;border-radius:50px;background:rgba(255,255,255,0.7);backdrop-filter:blur(12px);box-shadow:0 4px 18px rgba(0,102,255,0.1),inset 0 0 0 1px rgba(255,255,255,0.6);}
.trustedhosting-in-index-type1 .dual-capsule span{font-weight:600;font-size:13px;padding:8px 22px;}
.trustedhosting-in-index-type1 .dual-capsule .left{background:linear-gradient(90deg,#0066ff,#1a82ff);color:#fff;}
.trustedhosting-in-index-type1 .dual-capsule .right.black{background:#000;color:#fff;}
.trustedhosting-in-index-type1 p{font-size:17px;line-height:1.7;color:#555;margin:18px 0 36px;}
.trustedhosting-in-index-type1 .shine-btn{background:linear-gradient(90deg,#0066ff,#1a82ff,#0066ff);color:#fff;padding:13px 36px;border-radius:10px;font-weight:600;text-decoration:none;font-size:15px;background-size:200% 200%;animation:shineGradientTH 3s linear infinite;box-shadow:0 4px 18px rgba(0,102,255,0.4);}
@keyframes shineGradientTH{0%{background-position:0 0;}100%{background-position:200% 0;}}
.trustedhosting-in-index-type1 .outline-btn{border:2px solid #0066ff;padding:13px 36px;border-radius:10px;font-weight:600;color:#0066ff;text-decoration:none;font-size:15px;transition:all .3s ease;}
.trustedhosting-in-index-type1 .outline-btn:hover{background:#0066ff;color:#fff;}
.trustedhosting-in-index-type1 .feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 18px;margin-top:10px;}
.trustedhosting-in-index-type1 .feature-item{display:flex;align-items:center;gap:10px;background:#f5f8ff;padding:10px 16px;border-radius:8px;box-shadow:inset 0 0 0 1px rgba(0,0,0,0.04);}
.trustedhosting-in-index-type1 .feature-item img{width:18px;height:18px;}
.trustedhosting-in-index-type1 .feature-item span{font-size:14px;font-weight:600;color:#0a1633;}
.trustedhosting-in-index-type1 .plan-box{border:1px solid rgba(0,0,0,0.07);background:linear-gradient(145deg,#ffffff 0%,#f7f9ff 100%);border-radius:16px;padding:28px 18px;max-width:260px;min-height:270px;display:flex;flex-direction:column;justify-content:space-between;transition:all .25s ease;position:relative;box-shadow:0 4px 12px rgba(0,0,0,0.03);}
.trustedhosting-in-index-type1 .plan-box:hover{transform:translateY(-6px);box-shadow:0 10px 25px rgba(0,102,255,0.25);border-color:#0066ff;}
.trustedhosting-in-index-type1 .plan-box h4{font-weight:700;color:#005ce6;margin-bottom:6px;}
.trustedhosting-in-index-type1 .plan-box p{font-size:14px;color:#555;margin-bottom:10px;}
.trustedhosting-in-index-type1 .plan-box h3{font-size:26px;font-weight:800;color:#000;margin-bottom:8px;}
.trustedhosting-in-index-type1 .plan-box a{background:#0066ff;color:#fff;padding:10px 20px;border-radius:8px;text-decoration:none;display:inline-block;font-weight:600;font-size:14px;margin-top:10px;box-shadow:0 4px 10px rgba(0,102,255,0.35);transition:all .2s ease;}
.trustedhosting-in-index-type1 .plan-box a:hover{background:#0044cc;transform:scale(1.05);box-shadow:0 6px 16px rgba(0,102,255,0.45);}
.trustedhosting-in-index-type1 .plan-box.featured{border:2px solid #0066ff;background:#f5f9ff;padding-top:40px!important;}
.trustedhosting-in-index-type1 .plan-box.featured .badge{position:absolute;top:-20px;left:50%;transform:translateX(-50%);background:linear-gradient(90deg,#0066ff,#00aaff);color:#fff;font-size:12px;font-weight:700;padding:7px 22px;border-radius:60px;letter-spacing:0.5px;box-shadow:0 0 14px rgba(0,102,255,0.45),0 2px 8px rgba(0,102,255,0.35);text-shadow:0 1px 2px rgba(0,0,0,0.25);}
.trustedhosting-in-index-type1 .trusted-note{font-size:14px;color:#666;margin-top:-4px;}
.trustedhosting-in-index-type1 .cursor{font-weight:800;color:#0066ff;animation:blinkTH 1s infinite;}
@keyframes blinkTH{0%,100%{opacity:1;}50%{opacity:0;}}
@keyframes fadeUpTH{0%{opacity:0;transform:translateY(20px);}100%{opacity:1;transform:translateY(0);}}
.trustedhosting-in-index-type1 .trusted-divider{width:100%;height:2px;margin-top:100px;background:linear-gradient(90deg,rgba(0,0,0,0) 0%,#0066ff 50%,rgba(0,0,0,0) 100%);opacity:0.2;}
.trustedhosting-in-index-type1 .button-wrap{display:flex;flex-wrap:wrap;gap:14px;margin:36px 0 16px;}
.trustedhosting-in-index-type1 .grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px;justify-items:center;align-content:center;}
@media(max-width:991px){
.trustedhosting-in-index-type1{padding:80px 0 60px;}
.trustedhosting-in-index-type1 h1{font-size:32px!important;text-align:center;}
.trustedhosting-in-index-type1 .col-lg-6{text-align:center!important;margin-bottom:40px;}
.trustedhosting-in-index-type1 .capsule-wrapper{justify-content:center;}
.trustedhosting-in-index-type1 .shine-btn,.trustedhosting-in-index-type1 .outline-btn{width:100%;text-align:center;}
.trustedhosting-in-index-type1 .feature-grid{grid-template-columns:1fr;justify-items:center;}
.trustedhosting-in-index-type1 .feature-item{width:100%;max-width:340px;justify-content:center;}
}

.menu-new-badge {
  background: #16A34A;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  border-radius: 3px;
  padding: 0px 4px 1px 4px;
  margin-left: 6px;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  line-height: 1;
  position: relative;
  top: -0.5px;
}

/* This ensures any previous pseudo-element is disabled */
.menu-new-badge::after {
  content: none !important;
}


/* =========================================
   TrustedHosting Accepted Payment Methods
   ========================================= */
.trustedhosting-accepted-payments {
  padding: 45px 0;
  background: #ffffff;
  font-family: 'Inter', sans-serif;
  position: relative;
  overflow: hidden;
}

.trustedhosting-accepted-payments .trustedhosting-container {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
  position: relative;
}

.trustedhosting-accepted-payments .trustedhosting-title {
  font-size: 24px;
  font-weight: 800;
  color: #0a1f44;
  margin-bottom: 28px;
  letter-spacing: -0.2px;
  position: relative;
  display: inline-block;
}

.trustedhosting-accepted-payments .trustedhosting-title-line {
  position: absolute;
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%);
  width: 55px;
  height: 2.5px;
  background: linear-gradient(90deg, #4f46e5 0%, #60a5fa 100%);
  border-radius: 2px;
}

/* Glacier Glass Panel */
.trustedhosting-accepted-payments .trustedhosting-panel {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 25px;
  padding: 18px 25px;
  background: linear-gradient(115deg, rgba(255,255,255,0.95) 0%, rgba(245,248,255,0.97) 50%, rgba(255,255,255,0.93) 100%);
  border-radius: 12px;
  border: 1px solid rgba(226,232,240,0.8);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.6), 0 5px 15px rgba(0,0,0,0.05);
  max-width: 620px;
  margin: 0 auto;
  overflow: hidden;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  animation: trustedhosting-panel-shine 8s ease-in-out infinite;
}

/* Moving Shine Beam */
.trustedhosting-accepted-payments .trustedhosting-beam {
  position: absolute;
  top: 0;
  left: -100%;
  width: 300%;
  height: 100%;
  background: linear-gradient(120deg, rgba(255,255,255,0) 45%, rgba(255,255,255,0.5) 50%, rgba(255,255,255,0) 55%);
  animation: trustedhosting-beam-shine 7s linear infinite;
  z-index: 1;
  pointer-events: none;
}

/* Ambient Light Reflection */
.trustedhosting-accepted-payments .trustedhosting-reflect {
  position: absolute;
  bottom: -40%;
  left: 0;
  width: 100%;
  height: 140%;
  background: radial-gradient(circle at 50% 90%, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0) 70%);
  animation: trustedhosting-reflect 10s ease-in-out infinite;
  z-index: 0;
  pointer-events: none;
}

/* Logos */
.trustedhosting-accepted-payments .trustedhosting-logos {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 25px;
}

.trustedhosting-accepted-payments .trustedhosting-logos img {
  width: 90px;
  height: auto;
  object-fit: contain;
  transition: transform 0.3s ease, filter 0.3s ease;
  filter: brightness(1);
}

.trustedhosting-accepted-payments .trustedhosting-logos img:hover {
  transform: scale(1.05);
  filter: brightness(1.1);
}

/* Supporting Text */
.trustedhosting-accepted-payments .trustedhosting-text {
  font-size: 14px;
  color: #4b5563;
  margin-top: 18px;
  line-height: 1.6;
  max-width: 650px;
  margin-left: auto;
  margin-right: auto;
}

/* Animations */
@keyframes trustedhosting-beam-shine {
  0% { transform: translateX(-50%); }
  100% { transform: translateX(50%); }
}

@keyframes trustedhosting-reflect {
  0%,100% { transform: translateY(0) scaleX(1); opacity: 0.55; }
  50% { transform: translateY(-6%) scaleX(1.05); opacity: 0.8; }
}

@keyframes trustedhosting-panel-shine {
  0% {
    background: linear-gradient(115deg, rgba(255,255,255,0.95) 0%, rgba(245,248,255,0.97) 50%, rgba(255,255,255,0.93) 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.6), 0 5px 15px rgba(0,0,0,0.05);
  }
  50% {
    background: linear-gradient(115deg, rgba(255,255,255,0.97) 0%, rgba(250,253,255,1) 50%, rgba(245,248,255,0.95) 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.8), 0 7px 18px rgba(0,0,0,0.07);
  }
  100% {
    background: linear-gradient(115deg, rgba(255,255,255,0.95) 0%, rgba(245,248,255,0.97) 50%, rgba(255,255,255,0.93) 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.6), 0 5px 15px rgba(0,0,0,0.05);
  }
}

/* Responsive */
@media (max-width: 600px) {
  .trustedhosting-accepted-payments .trustedhosting-title { font-size: 20px; }
  .trustedhosting-accepted-payments .trustedhosting-logos img { width: 70px; }
}
/* ==================================================
   TRUSTEDHOSTING BIGGEST SALE OFFER BLOCK
================================================== */

.trustedhosting_biggest_sale_offer_block {
    width: 100%;
    padding: 40px 20px;
    display: flex;
    justify-content: center;
}

/* MAIN BANNER */
.trustedhosting_biggest_sale_offer_block .promo-banner {
    width: 100%;
    max-width: 1500px;
    padding: 38px 64px;
    border-radius: 48px;
    text-align: center;
    position: relative;
    overflow: hidden;

    background:
        /* top & bottom vignette */
        linear-gradient(
            180deg,
            rgba(0,0,0,0.9) 0%,
            transparent 35%,
            transparent 65%,
            rgba(0,0,0,0.9) 100%
        ),
        /* horizontal blue streak */
        linear-gradient(
            100deg,
            rgba(20,90,255,0.0) 0%,
            rgba(20,90,255,0.55) 18%,
            rgba(20,90,255,0.95) 28%,
            rgba(20,90,255,0.55) 38%,
            rgba(20,90,255,0.15) 52%,
            rgba(0,0,0,0.0) 65%
        ),
        #000000;

    box-shadow: 0 26px 60px rgba(0,0,0,0.45);
}

/* BACKGROUND SHINE */
.trustedhosting_biggest_sale_offer_block .promo-banner::after {
    content: "";
    position: absolute;
    top: 0;
    left: -60%;
    width: 45%;
    height: 100%;
    background: linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,0.08),
        transparent
    );
    animation: trustedhosting_bg_shine 8s infinite ease-in-out;
    pointer-events: none;
}

@keyframes trustedhosting_bg_shine {
    0% { left: -60%; }
    50% { left: 120%; }
    100% { left: 120%; }
}

/* CONTENT LAYER */
.trustedhosting_biggest_sale_offer_block .promo-banner * {
    position: relative;
    z-index: 2;
}

/* BADGE */
.trustedhosting_biggest_sale_offer_block .promo-badge {
    display: block;
    margin-bottom: 10px;
    font-size: 16px;
    font-weight: 600;
    color: #2fffe6;
}

/* HEADLINE */
.trustedhosting_biggest_sale_offer_block h2 {
    font-size: 34px;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 10px;
    line-height: 1.2;
}

/* SUBTEXT */
.trustedhosting_biggest_sale_offer_block p {
    font-size: 15px;
    color: #d6deeb;
    margin-bottom: 24px;
}

/* BUTTON */
.trustedhosting_biggest_sale_offer_block .promo-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 38px;
    background: #1e73ff;
    color: #ffffff;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    overflow: hidden;

    box-shadow: 0 10px 28px rgba(30,115,255,0.45);
    transition: background 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}

.trustedhosting_biggest_sale_offer_block .promo-btn span {
    position: relative;
    z-index: 2;
}

/* BUTTON SHINE */
.trustedhosting_biggest_sale_offer_block .promo-btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 120%;
    height: 100%;
    background: linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,0.55),
        transparent
    );
    transition: left 0.6s ease;
}

/* BUTTON HOVER */
.trustedhosting_biggest_sale_offer_block .promo-btn:hover {
    background: #0b5cff;
    color: #ffffff;
    box-shadow: 0 14px 34px rgba(11,92,255,0.6);
    transform: translateY(-1px);
}

.trustedhosting_biggest_sale_offer_block .promo-btn:hover::before {
    left: 120%;
}

/* RESPONSIVE */
@media (max-width: 900px) {
    .trustedhosting_biggest_sale_offer_block .promo-banner {
        padding: 30px 24px;
        border-radius: 28px;
    }

    .trustedhosting_biggest_sale_offer_block h2 {
        font-size: 26px;
    }
}
/* ==============================
   TRUSTEDHOSTING TOOLTIP LIST
============================== */
.trustedhosting_tooltip_list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.trustedhosting_tooltip_list li {
    position: relative;
        margin-top: 14px !important;

    margin-bottom: 12px;
    font-size: 14px;
    color: #0b1126;
}
/* Small divider between feature list and extra benefits */
.pricing-feature-divider {
    width: 100%;
    height: 1px;
    margin: 12px 0 10px;
    background: linear-gradient(
        to right,
        transparent,
        rgba(16,193,190,0.6),
        transparent
    );
}

/* tooltip enabled items */
.trustedhosting_tooltip_list li[data-tooltip] {
    cursor: help;
}

/* ==============================
   TOOLTIP BOX – DESKTOP
============================== */
.trustedhosting_tooltip_list li[data-tooltip]::after {
    content: attr(data-tooltip);

    position: absolute;
    left: 0;
    top: 100%;
    margin-top: 8px;

    /* DARK + BLUE GRADIENT */
    background: linear-gradient(
        135deg,
        #050b1e 0%,
        #0b1f4a 60%,
        #0a66ff 100%
    );

    color: #ffffff;
    padding: 11px 13px;
    width: 180px;

    /* TEXT – DESKTOP */
    font-size: 13.2px;
    line-height: 1.6;
    font-weight: 500;
    letter-spacing: 0.25px;

    border-radius: 7px;

    box-shadow:
        0 16px 40px rgba(5,11,30,0.75),
        inset 0 0 0 1px rgba(255,255,255,0.08);

    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);

    transition:
        opacity .2s ease,
        transform .2s ease,
        visibility .2s ease;

    z-index: 999;
    pointer-events: none;
}

/* ==============================
   TOOLTIP ARROW
============================== */
.trustedhosting_tooltip_list li[data-tooltip]::before {
    content: "";
    position: absolute;
    top: calc(100% + 3px);
    left: 16px;

    width: 9px;
    height: 9px;

    background: linear-gradient(
        135deg,
        #050b1e 0%,
        #0b1f4a 60%,
        #0a66ff 100%
    );

    transform: rotate(45deg);

    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,0.08);

    opacity: 0;
    visibility: hidden;
    transition: opacity .2s ease;
}

/* ==============================
   SHOW ON HOVER
============================== */
.trustedhosting_tooltip_list li[data-tooltip]:hover::after,
.trustedhosting_tooltip_list li[data-tooltip]:hover::before {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* subtle brand emphasis */
.trustedhosting_tooltip_list li[data-tooltip]:hover b {
    color: #0a66ff;
}

/* ==============================
   MOBILE ADJUSTMENT
============================== */
@media (max-width: 768px) {
    .trustedhosting_tooltip_list li[data-tooltip]::after {
        width: 160px;
        font-size: 12.4px;
        line-height: 1.55;
        letter-spacing: 0.2px;
    }
}


/* Google Reviews */


.trustedhosting_google_reviews_type1.th-reviews{background:#ffffff;padding:80px 6%;font-family:Inter,Arial}
.trustedhosting_google_reviews_type1 .th-head{text-align:center;margin-bottom:40px}
.trustedhosting_google_reviews_type1 .th-google-summary{display:flex;justify-content:center;gap:12px;margin-bottom:14px}
.trustedhosting_google_reviews_type1 .th-google-summary img{height:24px}
.trustedhosting_google_reviews_type1 .th-rating-line{display:flex;align-items:center;gap:6px}
.trustedhosting_google_reviews_type1 .th-based{font-size:12px;color:#6b7280}
.trustedhosting_google_reviews_type1 .th-head h2{font-size:34px;color:#111827}
.trustedhosting_google_reviews_type1 .th-head p{font-size:14px;color:#6b7280}

.trustedhosting_google_reviews_type1 .th-slider{overflow:hidden;margin-bottom:20px}
.trustedhosting_google_reviews_type1 .th-track{display:flex;gap:16px;width:max-content;animation:trustedhosting_scroll 15s linear infinite}
.trustedhosting_google_reviews_type1 .th-track.reverse{animation-direction:reverse}
.trustedhosting_google_reviews_type1 .th-track:hover{animation-play-state:paused}

.trustedhosting_google_reviews_type1 .th-card{width:280px;background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:16px;box-shadow:0 4px 12px rgba(0,0,0,.05)}
.trustedhosting_google_reviews_type1 .th-time{font-size:12px;color:#9ca3af}
.trustedhosting_google_reviews_type1 .th-card h4{font-size:15px;margin:6px 0;color:#111827}
.trustedhosting_google_reviews_type1 .th-card p{font-size:14px;color:#374151;line-height:1.55}

.trustedhosting_google_reviews_type1 .th-user{display:flex;align-items:center;margin-top:12px}
.trustedhosting_google_reviews_type1 .th-avatar{width:34px;height:34px;border-radius:50%;background:#e5edff;color:#1e40af;display:flex;align-items:center;justify-content:center;font-weight:600;margin-right:8px}

.trustedhosting_google_reviews_type1 .th-stars{display:flex;gap:2px}
.trustedhosting_google_reviews_type1 .star{width:12px;height:12px;background:#fbbc04;clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}

@keyframes trustedhosting_scroll{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}


/* ===============================
   TrustedHosting.in FAQ – TYPE 1
   Clean Divider Accordion
   =============================== */

.th_faq_type1_wrap {
    max-width: 900px;
    margin: 60px auto;
    padding: 0 20px;
    background: #ffffff;
}

.th_faq_type1_title {
    text-align: center;
    font-size: 28px;
    font-weight: 600;
    color: #000;
    margin-bottom: 30px;
}

.th_faq_type1_item {
    border-bottom: 1px solid #e5e7eb;
}

.th_faq_type1_question {
    width: 100%;
    background: transparent;
    border: none;
    padding: 22px 40px 22px 0;
    font-size: 17px;
    font-weight: 500;
    color: #111827;
    text-align: left;
    cursor: pointer;
    position: relative;
}

/* Arrow */
.th_faq_type1_question::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    width: 10px;
    height: 10px;
    border-right: 2px solid #111827;
    border-bottom: 2px solid #111827;
    transform: translateY(-50%) rotate(45deg);
    transition: transform 0.3s ease;
}

/* Active arrow */
.th_faq_type1_item.active .th_faq_type1_question::after {
    transform: translateY(-50%) rotate(-135deg);
}

/* Answer */
.th_faq_type1_answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
}

.th_faq_type1_answer p {
    margin: 0;
    padding: 0 0 20px 0;
    font-size: 15px;
    line-height: 1.7;
    color: #4b5563;
}

/* Open state */
.th_faq_type1_item.active .th_faq_type1_answer {
    max-height: 300px;
}

/* Mobile */
@media (max-width: 600px) {
    .th_faq_type1_question {
        font-size: 16px;
        padding-right: 35px;
    }
}

/* Layout Wrapper */
.th-affiliate-wrap {
    max-width: 1200px;
    margin: 70px auto 50px;
    padding: 0 20px;
}

/* CTA Container */
.th-affiliate-cta {
    position: relative;
    padding: 80px 40px;
    background: linear-gradient(135deg, #0f62fe 0%, #1f7cff 100%);
    border-radius: 28px;
    text-align: center;
    overflow: hidden;
    box-shadow: 0 20px 40px rgba(15, 98, 254, 0.18);
}

/* Soft Glow Overlay */
.th-affiliate-cta::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
        circle at top right,
        rgba(255,255,255,0.18),
        transparent 60%
    );
    pointer-events: none;
}

/* Subtitle */
.th-affiliate-subtitle {
    color: rgba(255,255,255,0.85);
    font-size: 15px;
    font-weight: 500;
    margin-bottom: 14px;
    letter-spacing: 0.3px;
}

/* Title */
.th-affiliate-title {
    color: #ffffff;
    font-size: 38px;
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 34px;
}

/* CTA Button */
.th-affiliate-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 15px 42px;
    background: #ffffff;
    color: #0f62fe;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 12px;
    box-shadow: 0 12px 22px rgba(0,0,0,0.12);
    transition: 
        transform 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease;
}

.th-affiliate-btn:hover {
    background: #f5f8ff;
    transform: translateY(-3px);
    box-shadow: 0 16px 30px rgba(0,0,0,0.18);
}

/* Decorative Corners */
.th-affiliate-cta::before {
    content: "";
    position: absolute;
    width: 160px;
    height: 160px;
    border: 2px solid rgba(255,255,255,0.15);
    border-radius: 24px;
    top: 20px;
    left: 20px;
}

/* Responsive */
@media (max-width: 992px) {
    .th-affiliate-title {
        font-size: 30px;
    }
}

@media (max-width: 768px) {
    .th-affiliate-cta {
        padding: 60px 25px;
        border-radius: 20px;
    }

    .th-affiliate-title {
        font-size: 26px;
    }

    .th-affiliate-btn {
        padding: 14px 34px;
    }
}

/*Pricing Table Plans*/

  /* =========================================================
           SCOPED CSS - WILL NOT AFFECT YOUR EXISTING WEBSITE
           ========================================================= */
        
        .shaiksaimeera-container, 
        .shaiksaimeera-container * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: 'Roboto', sans-serif;
        }

        .shaiksaimeera-container {
            /* Background and text color restricted only to this section */
            background: #ffffff;
            color: #0f172a;
            max-width: 1400px;
            margin: 0 auto;
            padding: 60px 20px;
            /* Added to prevent list styles from external CSS bleeding in */
            text-align: left;
        }

        /* Section Header */
        .shaiksaimeera-section-header {
            text-align: center;
            margin-bottom: 50px;
        }

        .shaiksaimeera-section-subtitle {
            color: #0066cc;
            font-size: 18px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 1px;
            margin-bottom: 10px;
        }

        .shaiksaimeera-section-title {
            font-size: 42px;
            font-weight: 700;
            color: #0f172a;
            margin-bottom: 15px;
            line-height: 1.2;
        }

        .shaiksaimeera-section-title span {
            color: #0066cc;
        }

        .shaiksaimeera-section-desc {
            color: #64748b;
            font-size: 18px;
            max-width: 700px;
            margin: 0 auto;
            line-height: 1.5;
        }

        /* Billing Toggle */
        .shaiksaimeera-billing-toggle-container {
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 20px;
            margin-bottom: 40px;
            background: white;
            padding: 10px;
            border-radius: 60px;
            box-shadow: 0 4px 10px rgba(0, 102, 204, 0.08);
            width: fit-content;
            margin-left: auto;
            margin-right: auto;
        }

        .shaiksaimeera-billing-option {
            padding: 12px 30px;
            border-radius: 50px;
            font-weight: 600;
            font-size: 16px;
            cursor: pointer;
            transition: all 0.3s ease;
            background: transparent;
            color: #64748b;
        }

        .shaiksaimeera-billing-option.shaiksaimeera-active {
            background: #0066cc;
            color: white;
            box-shadow: 0 4px 15px rgba(0, 102, 204, 0.3);
        }

        .shaiksaimeera-billing-option .shaiksaimeera-save-badge {
            background: #e6f0ff;
            color: #0066cc;
            padding: 4px 10px;
            border-radius: 30px;
            font-size: 11px;
            font-weight: 600;
            margin-left: 8px;
        }

        .shaiksaimeera-billing-option.shaiksaimeera-active .shaiksaimeera-save-badge {
            background: white;
            color: #0066cc;
        }

        /* Pricing Grid */
        .shaiksaimeera-pricing-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 25px;
            margin-top: 40px;
        }

        /* Pricing Card */
        .shaiksaimeera-pricing-card {
            background: #ffffff;
            border-radius: 24px;
            padding: 30px 25px;
            position: relative;
            transition: all 0.3s ease;
            border: 1px solid #e2e8f0;
            box-shadow: 0 4px 6px rgba(0, 102, 204, 0.02);
            display: flex;
            flex-direction: column;
        }

        .shaiksaimeera-pricing-card:hover {
            transform: translateY(-8px);
            box-shadow: 0 20px 40px rgba(0, 102, 204, 0.12);
            border-color: #0066cc;
        }

        /* Badges */
        .shaiksaimeera-card-badge {
            position: absolute;
            top: -12px;
            left: 50%;
            transform: translateX(-50%);
            padding: 6px 20px;
            border-radius: 30px;
            font-size: 13px;
            font-weight: 600;
            letter-spacing: 0.5px;
            white-space: nowrap;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
            z-index: 10;
        }

        .shaiksaimeera-badge-best-deal {
            background: linear-gradient(90deg, #00c6a7, #00a3c6);
            color: white;
        }

        .shaiksaimeera-badge-popular {
            background: linear-gradient(90deg, #0066cc, #4d94ff);
            color: white;
        }

        /* Plan Name & Description */
        .shaiksaimeera-plan-name {
            font-size: 24px;
            font-weight: 700;
            margin: 15px 0 5px;
            color: #0f172a;
        }

        .shaiksaimeera-plan-desc {
            font-size: 14px;
            color: #64748b;
            margin-bottom: 20px;
            line-height: 1.6;
        }

        /* Pricing */
        .shaiksaimeera-price-wrapper {
            margin-bottom: 20px;
        }

        .shaiksaimeera-old-price {
            color: #94a3b8;
            text-decoration: line-through;
            font-size: 16px;
            margin-right: 10px;
        }

        .shaiksaimeera-save-badge {
            background: #e6f0ff;
            color: #0066cc;
            padding: 4px 12px;
            border-radius: 30px;
            font-size: 12px;
            font-weight: 600;
            display: inline-block;
        }

        .shaiksaimeera-current-price {
            font-size: 42px;
            font-weight: 700;
            color: #0f172a;
            line-height: 1.2;
            margin: 10px 0 5px;
        }

        .shaiksaimeera-current-price small {
            font-size: 16px;
            font-weight: 500;
            color: #64748b;
        }

        .shaiksaimeera-free-months {
            color: #0066cc;
            font-weight: 600;
            font-size: 14px;
            margin-bottom: 15px;
            display: block;
        }

        /* Price data for different billing cycles */
        .shaiksaimeera-price-data {
            display: none;
        }

        .shaiksaimeera-price-data.shaiksaimeera-active {
            display: block;
        }

        /* CTA Button */
        .shaiksaimeera-plan-btn {
            display: block;
            width: 100%;
            padding: 14px 20px;
            background: transparent;
            border: 2px solid #0066cc;
            color: #0066cc;
            font-weight: 600;
            border-radius: 12px;
            cursor: pointer;
            transition: all 0.3s ease;
            margin-bottom: 15px;
            font-size: 16px;
            position: relative;
            overflow: hidden;
            text-align: center;
        }

        .shaiksaimeera-plan-btn::before {
            content: "";
            position: absolute;
            top: -120%;
            left: -40%;
            width: 60%;
            height: 300%;
            background: linear-gradient(120deg, transparent 40%, rgba(255, 255, 255, 0.8) 50%, transparent 60%);
            transform: rotate(25deg);
            transition: 0.8s;
        }

        .shaiksaimeera-plan-btn:hover::before {
            left: 120%;
        }

        .shaiksaimeera-plan-btn:hover {
            background: #0066cc;
            color: white;
        }

        .shaiksaimeera-plan-btn.shaiksaimeera-primary-btn {
            background: linear-gradient(90deg, #0066cc, #4d94ff);
            color: white;
            border: none;
        }

        .shaiksaimeera-plan-btn.shaiksaimeera-primary-btn:hover {
            background: linear-gradient(90deg, #0052a3, #0066cc);
            transform: scale(1.02);
        }

        /* Renewal Note */
        .shaiksaimeera-renewal-note {
            font-size: 12px;
            color: #64748b;
            margin-bottom: 20px;
        }

        /* Divider */
        .shaiksaimeera-plan-divider {
            border: none;
            border-top: 1px dashed #e2e8f0;
            margin: 20px 0;
        }

        /* Features List */
        .shaiksaimeera-features-list {
            list-style: none !important;
            margin: 0 !important;
            padding: 0 !important;
        }

        .shaiksaimeera-feature-item {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 10px 0;
            border-bottom: 1px dashed #e2e8f0;
            font-size: 14px;
            position: relative;
            cursor: help;
        }

        .shaiksaimeera-feature-item:last-child {
            border-bottom: none;
        }

        /* Tooltip Styles */
        .shaiksaimeera-feature-item[data-tooltip] {
            position: relative;
        }

        .shaiksaimeera-feature-item[data-tooltip]:hover::after {
            content: attr(data-tooltip);
            position: absolute;
            left: 50%;
            bottom: 100%;
            transform: translateX(-50%);
            background: #1e293b;
            color: white;
            padding: 8px 12px;
            border-radius: 6px;
            font-size: 12px;
            white-space: nowrap;
            z-index: 20;
            margin-bottom: 8px;
            box-shadow: 0 4px 12px rgba(0, 102, 204, 0.15);
            pointer-events: none;
            font-weight: 400;
            letter-spacing: 0.3px;
        }

        .shaiksaimeera-feature-item[data-tooltip]:hover::before {
            content: "";
            position: absolute;
            left: 50%;
            bottom: 100%;
            transform: translateX(-50%);
            border: 6px solid transparent;
            border-top-color: #1e293b;
            margin-bottom: -4px;
            z-index: 20;
            pointer-events: none;
        }

        .shaiksaimeera-feature-check {
            color: #00c6a7;
            font-weight: 700;
            font-size: 16px;
            min-width: 20px;
        }

        .shaiksaimeera-feature-cross {
            color: #ef4444;
            font-weight: 700;
            font-size: 16px;
            min-width: 20px;
        }

        .shaiksaimeera-feature-text {
            color: #334155;
            flex: 1;
        }

        .shaiksaimeera-feature-text strong {
            color: #0f172a;
            font-weight: 600;
        }

        /* See All Features Link */
        .shaiksaimeera-see-all-link {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            color: #6b7280;
            font-size: 14px;
            font-weight: 500;
            cursor: pointer;
            transition: all 0.2s ease;
            margin-top: 20px;
            padding: 8px 0;
            border-bottom: 1px dashed transparent;
            width: fit-content;
        }

        .shaiksaimeera-see-all-link:hover {
            color: #0066cc;
            border-bottom-color: #0066cc;
        }

        .shaiksaimeera-see-all-link .shaiksaimeera-arrow-icon {
            font-size: 16px;
            transition: transform 0.3s ease;
        }

        .shaiksaimeera-see-all-link.shaiksaimeera-active .shaiksaimeera-arrow-icon {
            transform: rotate(180deg);
        }

        /* Hidden Features Container */
        .shaiksaimeera-hidden-features {
            display: none;
            margin-top: 20px;
            padding-top: 20px;
            border-top: 2px solid #e2e8f0;
            animation: slideDown 0.3s ease;
        }

        .shaiksaimeera-hidden-features.shaiksaimeera-show {
            display: block;
        }

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

        .shaiksaimeera-feature-group-title {
            font-size: 13px;
            font-weight: 600;
            color: #475569;
            margin: 20px 0 10px;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            padding-bottom: 5px;
            border-bottom: 1px solid #e2e8f0;
        }

        .shaiksaimeera-feature-group-title:first-of-type {
            margin-top: 0;
        }

        /* Footer Guarantees */
        .shaiksaimeera-guarantees {
            display: flex;
            justify-content: center;
            gap: 40px;
            margin-top: 60px;
            flex-wrap: wrap;
        }

        .shaiksaimeera-guarantee-item {
            display: flex;
            align-items: center;
            gap: 8px;
            color: #334155;
            font-weight: 500;
            position: relative;
            cursor: help;
        }

        .shaiksaimeera-guarantee-item[data-tooltip]:hover::after {
            content: attr(data-tooltip);
            position: absolute;
            left: 50%;
            bottom: 100%;
            transform: translateX(-50%);
            background: #1e293b;
            color: white;
            padding: 8px 12px;
            border-radius: 6px;
            font-size: 12px;
            white-space: nowrap;
            z-index: 20;
            margin-bottom: 8px;
            box-shadow: 0 4px 12px rgba(0, 102, 204, 0.15);
        }

        .shaiksaimeera-guarantee-item[data-tooltip]:hover::before {
            content: "";
            position: absolute;
            left: 50%;
            bottom: 100%;
            transform: translateX(-50%);
            border: 6px solid transparent;
            border-top-color: #1e293b;
            margin-bottom: -4px;
            z-index: 20;
        }

        .shaiksaimeera-guarantee-item .shaiksaimeera-check {
            color: #00c6a7;
            font-size: 18px;
        }

        /* Responsive */
        @media (max-width: 1100px) {
            .shaiksaimeera-pricing-grid {
                grid-template-columns: repeat(2, 1fr);
            }
        }

        @media (max-width: 640px) {
            .shaiksaimeera-pricing-grid {
                grid-template-columns: 1fr;
            }
            
            .shaiksaimeera-section-title {
                font-size: 32px;
            }
            
            .shaiksaimeera-billing-toggle-container {
                flex-direction: column;
                width: 100%;
                border-radius: 30px;
            }
            
            .shaiksaimeera-billing-option {
                width: 100%;
                text-align: center;
            }
            
            .shaiksaimeera-guarantees {
                gap: 20px;
                flex-direction: column;
                align-items: center;
            }
            
            .shaiksaimeera-feature-item[data-tooltip]:hover::after {
                white-space: normal;
                width: 200px;
                text-align: center;
            }
        }
.copyright-text a {
    color: rgba(255,255,255,0.7);
    text-decoration: none;
}

.copyright-text a:hover {
    color: #ffffff;
}

.copyright-text {
    font-size: 10px !important;
}


/* Registered Indian Company Block /*

/* WebyStrata Exact Brand Colors */
.webystrata-trust-container {
  --ws-dark: #131A4D;      
  --ws-light: #003BCA;     
  --ws-accent-glow: #2881FF; 
  
  --ws-text-main: #ffffff;
  --ws-text-muted: rgba(255, 255, 255, 0.75);
  --ws-glass: rgba(255, 255, 255, 0.08);
  --ws-glass-border: rgba(255, 255, 255, 0.15);
  --ws-glass-hover: rgba(255, 255, 255, 0.15);
  
  width: 100%;
  max-width: 1200px;
  margin: 40px auto; 
  box-sizing: border-box;
  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  perspective: 1000px; 
}

.webystrata-trust-container *, 
.webystrata-trust-container *::before, 
.webystrata-trust-container *::after {
  box-sizing: inherit;
}

/* Main Card */
.webystrata-card {
  background: linear-gradient(135deg, var(--ws-dark) 0%, var(--ws-light) 100%);
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 28px 36px;
  color: #ffffff !important; /* Force text color globally inside card */
  box-shadow: 0 10px 40px rgba(19, 26, 77, 0.5), inset 0 1px 1px rgba(255,255,255,0.2);
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr; 
  gap: 40px;
  align-items: center; 
  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.4s ease;
}

.webystrata-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 50px rgba(19, 26, 77, 0.7), 0 0 40px rgba(0, 59, 202, 0.5), inset 0 1px 1px rgba(255,255,255,0.3);
}

@keyframes ws-intense-sweep {
  0% { transform: translateX(-150%) skewX(-30deg); opacity: 0; }
  10% { opacity: 1; }
  25% { transform: translateX(200%) skewX(-30deg); opacity: 0; }
  100% { transform: translateX(200%) skewX(-30deg); opacity: 0; } 
}

.webystrata-card::after {
  content: "";
  position: absolute;
  top: 0; 
  left: 0; 
  width: 150%; 
  height: 100%;
  background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.2) 50%, rgba(255,255,255,0) 100%);
  transform: skewX(-30deg);
  animation: ws-intense-sweep 7s infinite ease-in-out;
  pointer-events: none;
  z-index: 10;
}

.webystrata-card > * {
  position: relative;
  z-index: 1;
}

.webystrata-info {
  display: flex;
  flex-direction: column;
  gap: 16px; 
}

.webystrata-header {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
}

.webystrata-title {
  margin: 0;
  font-size: clamp(20px, 2.5vw, 26px);
  font-weight: 700;
  letter-spacing: -0.5px;
  text-shadow: 0 2px 4px rgba(0,0,0,0.4);
  color: #ffffff !important; /* FIXED */
}

@keyframes ws-soft-shimmer {
  0% { background-position: -200% center; box-shadow: 0 0 0 rgba(40, 129, 255, 0); border-color: rgba(255, 255, 255, 0.15); }
  50% { box-shadow: 0 0 10px rgba(40, 129, 255, 0.3); border-color: rgba(40, 129, 255, 0.5); }
  100% { background-position: 200% center; box-shadow: 0 0 0 rgba(40, 129, 255, 0); border-color: rgba(255, 255, 255, 0.15); }
}

.webystrata-badge {
  background: linear-gradient(
    90deg, 
    rgba(255, 255, 255, 0.05) 0%, 
    rgba(255, 255, 255, 0.15) 50%, 
    rgba(255, 255, 255, 0.05) 100%
  );
  background-size: 200% auto;
  border: 1px solid var(--ws-glass-border);
  padding: 6px 14px; 
  border-radius: 30px;
  font-size: 12px;
  font-weight: 600; 
  color: #ffffff !important; /* FIXED */
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  animation: ws-soft-shimmer 4s infinite ease-in-out; 
}

.webystrata-desc {
  margin: 0;
  font-size: 15px;
  color: var(--ws-text-muted);
  line-height: 1.7;
}

.webystrata-desc strong {
  color: #ffffff !important; /* FIXED */
  font-weight: 600;
}

.webystrata-features {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  margin-top: 8px;
  font-size: 13px;
  color: var(--ws-text-muted);
}

.webystrata-feature {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ws-text-muted) !important; /* FIXED */
}

.webystrata-feature svg {
  color: var(--ws-accent-glow);
}

.webystrata-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr); 
  gap: 16px; 
}

.webystrata-stat-box {
  background: var(--ws-glass);
  border: 1px solid var(--ws-glass-border);
  padding: 16px; 
  border-radius: 12px; 
  display: flex;
  flex-direction: column;
  gap: 6px; 
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  position: relative;
  z-index: 2;
}

.webystrata-stat-box:hover {
  background: var(--ws-glass-hover);
  border-color: rgba(255, 255, 255, 0.3);
  box-shadow: 0 8px 25px rgba(0,0,0,0.15), 0 0 15px rgba(40, 129, 255, 0.2); 
  transform: translateY(-4px) scale(1.02);
}

.webystrata-stat-header {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: var(--ws-text-muted);
}

.webystrata-stat-header svg {
  width: 14px;
  height: 14px;
  color: rgba(255, 255, 255, 0.5); 
  transition: color 0.3s ease, transform 0.3s ease, filter 0.3s ease;
}

.webystrata-stat-box:hover .webystrata-stat-header svg {
  color: var(--ws-accent-glow);
  transform: scale(1.1);
  filter: drop-shadow(0 0 4px rgba(40, 129, 255, 0.5));
}

.webystrata-stat-box strong {
  font-size: 15px; 
  font-weight: 700;
  letter-spacing: 0.5px;
  user-select: all;
  word-break: break-word;
  color: #ffffff !important; /* FIXED */
}

@media (max-width: 850px) {
  .webystrata-card {
    grid-template-columns: 1fr; 
    gap: 32px;
    padding: 32px 24px;
  }
}

@media (max-width: 480px) {
  .webystrata-stats {
    grid-template-columns: 1fr;
  }
  .webystrata-header {
    flex-direction: column;
    align-items: flex-start;
  }
}


/*Preloader*/

    .preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #ffffff;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.preloader-container {
    text-align: center;
}

.preloader-gif {
    width: 220px; /* adjust based on your GIF */
    height: auto;
    display: block;
    margin: 0 auto 10px;
}



  /* Core WebyStrata Brand Variables */
  :root {
    --ws-primary: #2563eb;
    --ws-primary-dark: #1d4ed8;
    --ws-surface: #eff6ff;
    --ws-surface-hover: #f8fafc;
    --ws-text-bold: #0f172a;
    --ws-text-body: #475569;
    --ws-border: #e2e8f0;
  }

  .webystrata-migration-ultimate {
    display: flex;
    align-items: center;
    gap: 80px; 
    background-color: #ffffff;
    padding: 100px 40px;
    max-width: 1140px; 
    margin: 0 auto;
    font-family: 'Plus Jakarta Sans', sans-serif;
    position: relative;
    overflow: hidden;
  }

  /* --- LEFT SIDE: HERO --- */
  .ws-mig-hero {
    flex: 1.1;
    padding-right: 20px;
    position: relative;
    z-index: 2;
  }

  /* Sleek background glow instead of the dot pattern */
  .ws-mig-hero::before {
    content: '';
    position: absolute;
    top: -10%;
    left: -20%;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(37, 99, 235, 0.08) 0%, rgba(255, 255, 255, 0) 70%);
    filter: blur(40px);
    z-index: -1;
    border-radius: 50%;
  }

  .ws-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--ws-primary); 
    background-color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    padding: 8px 18px;
    border-radius: 100px;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    margin-bottom: 28px;
    border: 1px solid rgba(37, 99, 235, 0.2);
    box-shadow: 0 4px 10px rgba(37, 99, 235, 0.05);
  }

  .ws-status-dot {
    width: 6px;
    height: 6px;
    background-color: var(--ws-primary);
    border-radius: 50%;
    position: relative;
  }
  .ws-status-dot::after {
    content: '';
    position: absolute;
    top: -4px; left: -4px; right: -4px; bottom: -4px;
    border-radius: 50%;
    border: 2px solid var(--ws-primary);
    animation: wsPulse 2s infinite;
    opacity: 0.5;
  }

  @keyframes wsPulse {
    0% { transform: scale(0.5); opacity: 0.8; }
    100% { transform: scale(1.5); opacity: 0; }
  }

  .ws-mig-headline {
    font-size: 52px; 
    font-weight: 800;
    color: var(--ws-text-bold);
    margin: 0 0 24px 0;
    line-height: 1.15;
    letter-spacing: -1.5px; 
  }

  .ws-text-gradient {
    background: linear-gradient(135deg, var(--ws-primary) 0%, #06b6d4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
  }

  .ws-mig-paragraph {
    font-size: 18px; 
    color: var(--ws-text-body);
    line-height: 1.65;
    margin: 0 0 45px 0;
    max-width: 480px;
  }

  .ws-cta-wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
  }

  .ws-btn-premium {
    position: relative; 
    overflow: hidden; 
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(to right, #1d4ed8, #2563eb); 
    color: #ffffff !important; 
    font-weight: 600;
    font-size: 16px;
    padding: 18px 40px;
    border-radius: 14px; 
    text-decoration: none !important; 
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    box-shadow: 0 10px 25px rgba(37, 99, 235, 0.3); 
    border: 1px solid rgba(255,255,255,0.1);
  }

  /* The Shine Element (Waiting off-screen) */
  .ws-btn-premium::after {
    content: '';
    position: absolute;
    top: 0;
    left: -150%; /* Positioned far left */
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.4) 50%, rgba(255,255,255,0) 100%);
    transform: skewX(-25deg);
    transition: left 0.6s ease-in-out; /* Smooth transition instead of an infinite loop */
  }

  /* Keep text white on click/visit */
  .ws-btn-premium:visited,
  .ws-btn-premium:active,
  .ws-btn-premium:focus {
    color: #ffffff !important;
  }

  /* Hover State: Button floats up */
  .ws-btn-premium:hover {
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 15px 35px rgba(37, 99, 235, 0.4);
    color: #ffffff !important;
  }

  /* Hover State: Shine sweeps across exactly when the mouse touches it */
  .ws-btn-premium:hover::after {
    left: 150%; 
  }

  .ws-trust-box {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  .ws-trust-indicator {
    font-size: 14px;
    color: var(--ws-text-body);
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .ws-trust-indicator img {
    width: 18px;
    height: 18px;
  }

  .ws-stars {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #f59e0b; 
  }
  
  .ws-stars svg {
    width: 16px;
    height: 16px;
    fill: currentColor;
  }
  
  .ws-stars-text {
    font-size: 13px;
    color: var(--ws-text-body);
    font-weight: 600;
    margin-left: 6px;
  }

  /* --- RIGHT SIDE: UNIFIED DASHBOARD PANEL --- */
  .ws-features-panel {
    flex: 1.2;
    background: #ffffff;
    border: 1px solid var(--ws-border);
    border-radius: 24px;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.04);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
    z-index: 2;
  }

  .ws-panel-row {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    padding: 32px 36px;
    border-bottom: 1px solid var(--ws-border);
    transition: background-color 0.3s ease;
    position: relative;
    cursor: default;
  }

  .ws-panel-row:last-child {
    border-bottom: none;
  }

  .ws-panel-row::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--ws-primary);
    transform: scaleY(0);
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    transform-origin: center;
  }

  .ws-panel-row:hover {
    background-color: var(--ws-surface-hover);
  }

  .ws-panel-row:hover::before {
    transform: scaleY(1);
  }

  /* NEW ICON STYLES */
  .ws-icon-modern {
    width: 48px; 
    height: 48px;
    border-radius: 12px; 
    background-color: rgba(37, 99, 235, 0.06);
    color: var(--ws-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.3s ease;
  }

  .ws-icon-modern svg {
    width: 22px;
    height: 22px;
  }

  .ws-panel-row:hover .ws-icon-modern {
    background-color: var(--ws-primary);
    color: #ffffff;
    transform: scale(1.05);
    box-shadow: 0 8px 20px rgba(37, 99, 235, 0.25);
  }

  .ws-feature-text-block {
    display: flex;
    flex-direction: column;
    padding-top: 2px; 
  }

  .ws-feature-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--ws-text-bold);
    margin: 0 0 6px 0;
    transition: color 0.3s ease;
  }

  .ws-panel-row:hover .ws-feature-title {
    color: var(--ws-primary-dark);
  }

  .ws-feature-desc {
    font-size: 14.5px;
    color: var(--ws-text-body);
    line-height: 1.6;
    margin: 0;
  }

  /* Mobile responsiveness */
  @media (max-width: 950px) {
    .webystrata-migration-ultimate {
      flex-direction: column;
      padding: 60px 20px;
      gap: 50px;
    }
    .ws-mig-hero {
      padding-right: 0;
      text-align: center;
    }
    .ws-mig-headline {
      font-size: 42px;
    }
    .ws-mig-paragraph {
      margin-left: auto;
      margin-right: auto;
    }
    .ws-cta-wrapper {
      align-items: center;
    }
    .ws-trust-box {
      align-items: center;
    }
    .ws-panel-row {
      padding: 24px;
    }
  }
  
    /* Base Variables */
  :root {
    --ws-text-muted: #64748b; 
  }

  .ws-enterprise-tech-section {
    padding: 70px 20px;
    background-color: #ffffff;
    font-family: 'Plus Jakarta Sans', sans-serif;
    border-top: 1px solid #f1f5f9;
    border-bottom: 1px solid #f1f5f9;
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
  }

  .ws-enterprise-heading {
    font-size: 12px;
    font-weight: 700;
    color: var(--ws-text-muted);
    text-transform: uppercase;
    letter-spacing: 2.5px;
    margin-bottom: 40px;
    text-align: center;
  }

  /* The Marquee Window */
  .ws-enterprise-marquee {
    width: 100%;
    max-width: 1100px;
    overflow: hidden;
    position: relative;
    mask-image: linear-gradient(to right, transparent 0%, black 15%, black 85%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 15%, black 85%, transparent 100%);
  }

  /* The Moving Track */
  .ws-enterprise-track {
    display: flex;
    align-items: center;
    width: max-content;
    gap: 80px; /* Wide, breathable spacing */
    /* Increased time to 50s because the track is longer now */
    animation: wsScrollEnterprise 50s linear infinite;
  }

  /* Pause on hover so users can see the logos clearly */
  .ws-enterprise-marquee:hover .ws-enterprise-track {
    animation-play-state: paused;
  }

  @keyframes wsScrollEnterprise {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-50% - 40px)); } /* -50% width minus half the gap */
  }

  /* Universal Image Styling for all Logos */
  .ws-logo-item {
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    cursor: default;
  }

  .ws-logo-item img {
    height: 35px; /* Adjust this to make logos bigger or smaller */
    width: auto;
    max-width: 160px;
    object-fit: contain;
    /* This makes all logos gray and slightly transparent by default */
    filter: grayscale(100%) opacity(0.4);
    transition: filter 0.4s ease;
  }

  /* Hover State: Reveals the full original color of the image */
  .ws-logo-item:hover img {
    filter: grayscale(0%) opacity(1);
  }

  /* Mobile Adjustments */
  @media (max-width: 768px) {
    .ws-enterprise-tech-section {
      padding: 50px 15px;
    }
    .ws-enterprise-track {
      gap: 50px;
    }
    .ws-logo-item img {
      height: 25px; /* Slightly smaller on mobile */
    }
  }
  
/* Browser Web Toolkit*/

/* 1. Optimized width for a sleek, corporate feel */
::-webkit-scrollbar {
  width: 8px;
}

/* 2. Keep the track clean and transparent */
::-webkit-scrollbar-track {
  background: transparent;
}

/* 3. The Webystrata Gradient Thumb */
::-webkit-scrollbar-thumb {
  /* Using your brand colors: Sky Blue -> Royal Blue -> Navy Blue */
  background: linear-gradient(
    180deg, 
    #2881FF 0%,   /* Sky Blue highlight */
    #003BCA 50%,  /* Royal Blue core */
    #131A4D 100%  /* Deep Navy base */
  );
  
  /* The "Floating" Effect for a high-end UI look */
  border: 2px solid transparent;
  background-clip: padding-box;
  
  border-radius: 100vh;
  transition: all 0.3s ease;
}

/* 4. Hover Effect - Makes it look "powered on" */
::-webkit-scrollbar-thumb:hover {
  /* Shifts the gradient to look brighter when the user interacts */
  background: linear-gradient(180deg, #3a91ff 0%, #1a56ff 100%);
  border: 1px solid transparent; 
}

/* 5. Active/Click State */
::-webkit-scrollbar-thumb:active {
  background: #131A4D; /* Locks into the deep navy when dragging */
}


  
   /* =======================================================
     WEBYSTRATA GLOBAL NETWORK - HIGH-VISIBILITY MINIMALIST
  ======================================================== */
  .ws-infra-section {
    background-color: #ffffff; /* Pure white canvas */
    font-family: 'Roboto', sans-serif;
    padding: 120px 20px;
    position: relative;
    overflow: hidden;
    color: #0f172a;
    z-index: 1;
  }

  /* Very soft ambient glow in the center */
  .ws-infra-section::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1000px;
    height: 1000px;
    background: radial-gradient(circle, rgba(37, 99, 235, 0.04) 0%, rgba(255, 255, 255, 0) 60%);
    transform: translate(-50%, -50%);
    z-index: -1;
    pointer-events: none;
  }

  .ws-infra-header {
    text-align: center;
    max-width: 850px;
    margin: 0 auto 70px auto;
  }

  .ws-infra-badge {
    display: inline-block;
    padding: 8px 22px;
    background: #f8fafc;
    color: #1d4ed8; 
    font-size: 13px;
    font-weight: 800;
    border-radius: 100px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 24px;
  }

  .ws-infra-title {
    font-size: 52px;
    font-weight: 800;
    color: #0f172a;
    margin: 0 0 24px 0;
    line-height: 1.1;
    letter-spacing: -1.5px;
  }

  .ws-text-gradient {
    background: linear-gradient(135deg, #2563eb 0%, #06b6d4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  .ws-infra-desc {
    font-size: 19px;
    color: #64748b; 
    line-height: 1.6;
    margin: 0 0 40px 0;
    font-weight: 400;
  }

  /* --- FLAT GLOBAL PERKS PILLS --- */
  .ws-global-perks {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
  }

  .ws-perk-pill {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #f1f5f9; 
    padding: 12px 24px;
    border-radius: 100px;
    font-size: 15px;
    font-weight: 600;
    color: #334155;
    transition: all 0.3s ease;
  }

  .ws-perk-pill:hover {
    background: #e2e8f0;
    color: #0f172a;
  }

  .ws-perk-pill svg {
    color: #06b6d4;
  }

  /* --- SEAMLESS MAP STAGE --- */
  .ws-map-stage {
    position: relative;
    max-width: 1100px;
    height: 550px;
    margin: 0 auto;
  }

  /* Map Mask Wrapper - Fades the edges smoothly */
  .ws-map-mask-wrapper {
    position: absolute;
    inset: -30px;
    -webkit-mask-image: radial-gradient(ellipse at center, black 50%, transparent 85%);
    mask-image: radial-gradient(ellipse at center, black 50%, transparent 85%);
  }

  /* The actual map colored with a rich gradient */
  .ws-map-bg {
    position: absolute;
    inset: 0;
    /* This creates the rich slate-blue color for the continents */
    background: linear-gradient(135deg, #94a3b8 0%, #64748b 100%);
    /* This uses the map SVG to cut out the continent shapes */
    -webkit-mask-image: url('https://upload.wikimedia.org/wikipedia/commons/8/80/World_map_-_low_resolution.svg');
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-image: url('https://upload.wikimedia.org/wikipedia/commons/8/80/World_map_-_low_resolution.svg');
    mask-size: contain;
    mask-position: center;
    mask-repeat: no-repeat;
    opacity: 0.45; /* Much stronger opacity so it's highly visible */
  }

  /* --- GLOWING RADAR PING DOTS --- */
  .ws-ping {
    position: absolute;
    width: 14px;
    height: 14px;
    background-color: #2563eb; 
    border-radius: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
    /* Crisp white border makes the dot pop against the darker map */
    border: 2px solid #ffffff;
    box-shadow: 0 4px 10px rgba(37, 99, 235, 0.4);
    z-index: 10;
  }

  /* Gentle, flat pulsing ring */
  .ws-ping::after {
    content: '';
    position: absolute;
    inset: -8px;
    border-radius: 50%;
    border: 2px solid #2563eb;
    opacity: 0;
    animation: ws-radar-sweep 2.5s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  @keyframes ws-radar-sweep {
    0% { transform: scale(1); opacity: 0.8; border-width: 2px; }
    100% { transform: scale(4); opacity: 0; border-width: 0px; }
  }

  /* Primary Hub (India) */
  .ws-loc-india { 
    top: 40%; left: 67%; 
    background-color: #06b6d4; 
    width: 18px; 
    height: 18px;
  }
  .ws-loc-india::after { 
    border-color: #06b6d4; 
    animation-duration: 2s; 
  } 

  .ws-loc-germany { top: 26%; left: 50%; }
  .ws-loc-finland { top: 19%; left: 53%; }

  /* Minimalist Dark Tooltips */
  .ws-ping-tooltip {
    position: absolute;
    bottom: 28px;
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    background: #0f172a; 
    padding: 12px 20px;
    border-radius: 12px;
    color: #ffffff; 
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    z-index: 20;
    pointer-events: none;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
  }
  
  /* Tooltip Arrow */
  .ws-ping-tooltip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-width: 6px;
    border-style: solid;
    border-color: #0f172a transparent transparent transparent;
  }

  .ws-ping-tooltip span {
    display: block;
    font-size: 12px;
    color: #94a3b8; 
    font-weight: 500;
    margin-top: 4px;
  }
  
  .ws-ping:hover .ws-ping-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
    bottom: 34px;
  }

  /* Mobile Responsiveness */
  @media (max-width: 992px) {
    .ws-map-stage { height: 400px; }
    .ws-infra-title { font-size: 42px; }
  }
  @media (max-width: 768px) {
    .ws-infra-section { padding: 80px 20px; }
    .ws-infra-title { font-size: 34px; }
    .ws-map-stage { height: 280px; }
    .ws-global-perks { flex-direction: column; align-items: stretch; }
    .ws-perk-pill { justify-content: center; }
  }
  
  
    /* Trust Band Container */
  .shaiksaimeera_webystraa-trust-band {
    width: 100%;
    background: #ffffff;
    padding: 40px 0 35px 0;
    border-top: 1px solid #f1f5f9;
    border-bottom: 1px solid #f1f5f9;
    font-family: system-ui, -apple-system, sans-serif;
    overflow: hidden;
  }
  
  /* Typography with Accent Lines */
  .shaiksaimeera_webystraa-trust-label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #94a3b8;
    margin-bottom: 30px;
  }

  .shaiksaimeera_webystraa-trust-label::before,
  .shaiksaimeera_webystraa-trust-label::after {
    content: '';
    height: 1px;
    width: 40px;
    background: #e2e8f0;
  }

  /* Marquee constraints & Edge Fading */
  .shaiksaimeera_webystraa-marquee-container {
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
    /* Smooth fade-out effect on the left and right edges */
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
  }

  /* Hardware accelerated track */
  .shaiksaimeera_webystraa-marquee-track {
    display: flex;
    align-items: center;
    width: max-content;
    animation: shaiksaimeera_webystraa-scroll 40s linear infinite;
    will-change: transform;
  }

  /* Pause on hover for usability */
  .shaiksaimeera_webystraa-marquee-container:hover .shaiksaimeera_webystraa-marquee-track {
    animation-play-state: paused;
  }

  /* Individual Logo Wrappers */
  .shaiksaimeera_webystraa-logo-item {
    padding: 0 45px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  /* Advanced Logo Styling & Hover Physics */
  .shaiksaimeera_webystraa-logo-item img {
    height: 34px;
    width: auto;
    max-width: 140px;
    object-fit: contain;
    /* Start washed out so it doesn't distract from the main hero CTA */
    filter: grayscale(100%) opacity(40%);
    /* Bouncy cubic-bezier transition for a premium feel */
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    cursor: pointer;
  }

  .shaiksaimeera_webystraa-logo-item img:hover {
    transform: scale(1.15) translateY(-2px);
    /* Restores color and adds a shape-contouring shadow to the PNG */
    filter: grayscale(0%) opacity(100%) drop-shadow(0 4px 6px rgba(0,0,0,0.15));
  }

  /* Seamless Loop Keyframes */
  @keyframes shaiksaimeera_webystraa-scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
  }

  /* Mobile Adjustments */
  @media (max-width: 768px) {
    .shaiksaimeera_webystraa-trust-band {
      padding: 30px 0 25px 0;
    }
    .shaiksaimeera_webystraa-trust-label {
      font-size: 0.65rem;
      gap: 10px;
      margin-bottom: 25px;
    }
    .shaiksaimeera_webystraa-trust-label::before,
    .shaiksaimeera_webystraa-trust-label::after {
      width: 25px;
    }
    .shaiksaimeera_webystraa-logo-item {
      padding: 0 25px;
    }
    .shaiksaimeera_webystraa-logo-item img {
      height: 26px;
    }
  }
  
  
    /* --- 1. Base Section (Seamless Integration) --- */
  .shaiksaimeera_webystrata-migration-section {
    max-width: 1200px;
    margin: 80px auto;
    padding: 40px 20px; /* Reduced padding since there is no bounding box */
    font-family: system-ui, -apple-system, sans-serif;
    position: relative;
    /* Removed background, borders, and shadows to blend into the page */
  }

  /* --- 2. Header Styling --- */
  .shaiksaimeera_webystrata-migration-header {
    text-align: center;
    margin-bottom: 90px;
    position: relative;
    z-index: 2;
  }

  .shaiksaimeera_webystrata-migration-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #eff6ff, #e0e7ff);
    color: #1d4ed8;
    font-size: 0.8rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    padding: 8px 24px;
    border-radius: 40px;
    margin-bottom: 25px;
    border: 1px solid #bfdbfe;
    box-shadow: 0 4px 20px -5px rgba(37, 99, 235, 0.15);
  }

  .shaiksaimeera_webystrata-migration-badge svg {
    animation: shaiksaimeera_webystrata-bounceRight 2s infinite;
  }

  @keyframes shaiksaimeera_webystrata-bounceRight {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(4px); }
  }

  .shaiksaimeera_webystrata-migration-title {
    font-size: 2.8rem;
    font-weight: 900;
    color: #0f172a;
    margin-bottom: 18px;
    letter-spacing: -0.03em;
  }

  .shaiksaimeera_webystrata-migration-desc {
    font-size: 1.15rem;
    color: #475569;
    max-width: 650px;
    margin: 0 auto;
    line-height: 1.7;
  }

  /* --- 3. 3D Steps Container & Flowing Line --- */
  .shaiksaimeera_webystrata-steps-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    position: relative;
    z-index: 2;
    perspective: 1000px; 
  }

  .shaiksaimeera_webystrata-steps-grid::before {
    content: '';
    position: absolute;
    top: 35px;
    left: 15%;
    right: 15%;
    height: 4px;
    background: #f1f5f9;
    z-index: -1;
    border-radius: 4px;
  }

  /* The glowing data stream */
  .shaiksaimeera_webystrata-steps-grid::after {
    content: '';
    position: absolute;
    top: 35px;
    left: 15%;
    right: 15%;
    height: 4px;
    background: linear-gradient(90deg, transparent 0%, #3b82f6 50%, transparent 100%);
    background-size: 200% 100%;
    animation: shaiksaimeera_webystrata-flow 2.5s linear infinite;
    z-index: -1;
    border-radius: 4px;
    filter: drop-shadow(0 0 8px rgba(59, 130, 246, 0.4));
  }

  @keyframes shaiksaimeera_webystrata-flow {
    0% { background-position: 100% 0; }
    100% { background-position: -100% 0; }
  }

  /* --- 4. Individual Step Cards & Badges --- */
  .shaiksaimeera_webystrata-step-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    padding: 50px 30px 40px 30px;
    text-align: center;
    box-shadow: 0 4px 20px -5px rgba(0, 0, 0, 0.04);
    transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
    transform-style: preserve-3d;
  }

  .shaiksaimeera_webystrata-step-card:hover {
    transform: translateY(-12px) scale(1.02);
    box-shadow: 0 30px 60px -15px rgba(37, 99, 235, 0.12), 0 0 0 1px #bfdbfe;
    z-index: 10;
  }

  /* Time Badge */
  .shaiksaimeera_webystrata-time-badge {
    position: absolute;
    top: 20px;
    right: 20px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    color: #64748b;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    gap: 4px;
    transition: all 0.3s ease;
  }

  .shaiksaimeera_webystrata-step-card:hover .shaiksaimeera_webystrata-time-badge {
    background: #eff6ff;
    color: #2563eb;
    border-color: #bfdbfe;
  }

  /* --- 5. Radar Pulse Step Numbers --- */
  .shaiksaimeera_webystrata-step-number {
    width: 76px;
    height: 76px;
    margin: -88px auto 25px auto; 
    background: linear-gradient(135deg, #1e40af, #3b82f6);
    /* Set border to match your website's background color (default white) */
    border: 6px solid #ffffff; 
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.6rem;
    font-weight: 900;
    color: #ffffff;
    position: relative;
    box-shadow: inset 0 -3px 6px rgba(0,0,0,0.2); 
    transition: all 0.4s ease;
  }

  /* Radar Pulse Rings */
  .shaiksaimeera_webystrata-step-number::before {
    content: '';
    position: absolute;
    top: -6px; left: -6px; right: -6px; bottom: -6px;
    border-radius: 50%;
    border: 2px solid #3b82f6;
    opacity: 0;
    animation: shaiksaimeera_webystrata-radar 2.5s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;
  }

  .shaiksaimeera_webystrata-step-card:nth-child(2) .shaiksaimeera_webystrata-step-number::before { animation-delay: 0.8s; }
  .shaiksaimeera_webystrata-step-card:nth-child(3) .shaiksaimeera_webystrata-step-number::before { animation-delay: 1.6s; }

  @keyframes shaiksaimeera_webystrata-radar {
    0% { transform: scale(1); opacity: 0.8; }
    100% { transform: scale(1.6); opacity: 0; }
  }

  .shaiksaimeera_webystrata-step-card:hover .shaiksaimeera_webystrata-step-number {
    transform: scale(1.1);
  }

  /* Icon inside the card */
  .shaiksaimeera_webystrata-step-icon {
    width: 52px;
    height: 52px;
    margin: 0 auto 20px auto;
    color: #94a3b8;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  }

  .shaiksaimeera_webystrata-step-card:hover .shaiksaimeera_webystrata-step-icon {
    transform: translateY(-5px) scale(1.15);
    color: #3b82f6;
    filter: drop-shadow(0 8px 10px rgba(59, 130, 246, 0.2));
  }

  .shaiksaimeera_webystrata-step-card h3 {
    font-size: 1.35rem;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 12px;
  }

  .shaiksaimeera_webystrata-step-card p {
    color: #64748b;
    font-size: 0.95rem;
    line-height: 1.65;
    margin: 0;
  }

  /* --- 6. Glassmorphic Data Tooltips --- */
  [data-tooltip] {
    position: relative;
    cursor: help;
    border-bottom: 2px dotted #cbd5e1;
    transition: all 0.3s ease;
    font-weight: 600;
    color: #334155;
  }

  [data-tooltip]:hover {
    color: #2563eb;
    border-bottom-color: #2563eb;
  }

  [data-tooltip]::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + 14px);
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    background: rgba(15, 23, 42, 0.85);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    color: #f8fafc;
    padding: 10px 18px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 0.85rem;
    font-weight: 500;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    z-index: 100;
    pointer-events: none;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.3);
  }

  [data-tooltip]::before {
    content: '';
    position: absolute;
    bottom: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    border-width: 8px;
    border-style: solid;
    border-color: rgba(15, 23, 42, 0.85) transparent transparent transparent;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    z-index: 100;
    pointer-events: none;
  }

  [data-tooltip]:hover::after,
  [data-tooltip]:hover::before {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
  }

  /* --- 7. Footer / Trust Indicator --- */
  .shaiksaimeera_webystrata-migration-footer {
    text-align: center;
    margin-top: 60px;
    font-size: 1.05rem;
    font-weight: 700;
    color: #1e293b;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
  }

  .shaiksaimeera_webystrata-check-icon {
    color: #ffffff;
    font-size: 0.9rem;
    background: #10b981;
    border-radius: 50%;
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 10px rgba(16, 185, 129, 0.3);
  }

  /* --- 8. Mobile Responsiveness --- */
  @media (max-width: 900px) {
    .shaiksaimeera_webystrata-migration-section {
      padding: 40px 20px;
    }
    .shaiksaimeera_webystrata-migration-title {
      font-size: 2.2rem;
    }
    .shaiksaimeera_webystrata-steps-grid {
      grid-template-columns: 1fr;
      gap: 60px;
      padding-left: 20px;
      perspective: none;
    }
    
    .shaiksaimeera_webystrata-steps-grid::before {
      top: 0; bottom: 0; left: 55px; right: auto; height: auto; width: 4px;
    }
    .shaiksaimeera_webystrata-steps-grid::after {
      top: 0; bottom: 0; left: 55px; right: auto; height: auto; width: 4px;
      background: linear-gradient(180deg, transparent 0%, #3b82f6 50%, transparent 100%);
      background-size: 100% 200%;
      animation: shaiksaimeera_webystrata-flow-vertical 2.5s linear infinite;
    }

    @keyframes shaiksaimeera_webystrata-flow-vertical {
      0% { background-position: 0 100%; }
      100% { background-position: 0 -100%; }
    }

    .shaiksaimeera_webystrata-step-card {
      text-align: left;
      padding: 40px 30px 30px 85px;
    }
    
    .shaiksaimeera_webystrata-time-badge {
      top: 15px; right: 15px;
    }
    
    .shaiksaimeera_webystrata-step-icon {
      margin: 0 0 15px 0;
      width: 44px; height: 44px;
    }

    .shaiksaimeera_webystrata-step-number {
      position: absolute;
      left: -20px;
      top: 50%;
      transform: translateY(-50%);
      margin: 0;
      width: 70px;
      height: 70px;
    }
    
    .shaiksaimeera_webystrata-step-number::before {
      display: none;
    }
    
    .shaiksaimeera_webystrata-step-card:hover .shaiksaimeera_webystrata-step-number {
      transform: translateY(-50%) scale(1.08);
    }
  }
  
    .ws-slim-domain {
    background: linear-gradient(90deg, #f8fbff 0%, #ffffff 50%, #f8fbff 100%);
    padding: 24px 0;
    border-top: 1px solid #eaeff5;
    border-bottom: 1px solid #eaeff5;
  }
  
  .ws-slim-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
  }
  
  .ws-slim-text {
    font-family: 'Playfair Display', serif;
    font-size: 22px;
    font-weight: 700;
    color: #0a1633;
    margin: 0;
    white-space: nowrap;
    letter-spacing: -0.3px;
  }
  
  /* The Form Wrapper becomes the Pill */
  .ws-slim-form {
    display: flex;
    flex: 1;
    max-width: 550px;
    margin: 0;
    background: #ffffff;
    border: 1px solid #dce2e8;
    border-radius: 50px;
    box-shadow: 0 4px 15px rgba(10, 22, 51, 0.04);
    overflow: hidden;
    transition: all 0.3s ease;
  }
  
  .ws-slim-form:focus-within {
    border-color: #0056b3;
    box-shadow: 0 0 0 4px rgba(0, 86, 179, 0.08);
  }
  
  .ws-slim-input {
    flex: 1;
    border: none;
    padding: 14px 24px;
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: #0a1633;
    background: transparent;
    outline: none;
  }
  
  .ws-slim-input::placeholder {
    color: #9ba6b5;
    font-weight: 400;
  }
  
  .ws-slim-btn {
    background: #0a1633;
    color: #fff;
    border: none;
    padding: 0 32px;
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    font-size: 15px;
    cursor: pointer;
    transition: background 0.2s ease;
    white-space: nowrap;
  }
  
  .ws-slim-btn:hover { 
    background: #1a3673; 
  }
  
  /* Mini-Pill styling for the TLDs */
  .ws-slim-tlds {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    color: #555;
  }
  
  /* Added specific class so it doesn't break the HOT badge */
  .ws-tld-pill {
    background: #ffffff;
    border: 1px solid #eaeff5;
    padding: 5px 12px;
    border-radius: 20px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.01);
    display: inline-flex;
    align-items: center;
  }
  
  .ws-tld-pill strong { 
    color: #0a1633; 
    font-weight: 700;
    margin-right: 4px;
  }

  /* Fixed HOT Badge */
  .ws-tld-hot {
    background: #ef4444;
    color: #ffffff;
    font-size: 9px;
    font-weight: 700;
    padding: 3px 6px;
    border-radius: 4px;
    margin-left: 4px;
    margin-right: 4px;
    text-transform: uppercase;
    line-height: 1;
    display: inline-block;
  }
  
  /* Mobile Responsiveness */
  @media (max-width: 991px) {
    .ws-slim-domain {
      padding: 30px 15px;
    }
    .ws-slim-container { 
      flex-direction: column; 
      gap: 20px; 
      text-align: center;
    }
    .ws-slim-form { 
      width: 100%; 
      max-width: 100%; 
      flex-direction: column;
      background: transparent;
      border: none;
      box-shadow: none;
    }
    .ws-slim-form:focus-within {
      box-shadow: none;
    }
    .ws-slim-input {
      border-radius: 50px;
      border: 1px solid #dce2e8;
      background: #ffffff;
      margin-bottom: 10px;
      text-align: center;
      padding: 14px;
    }
    .ws-slim-input:focus {
      border-color: #0056b3;
    }
    .ws-slim-btn {
      border-radius: 50px;
      padding: 16px;
    }
    .ws-slim-tlds {
      flex-wrap: wrap;
      justify-content: center;
    }
  }
   /* Trust Band Container */
  .shaiksaimeera_webystraa-trust-band {
    width: 100%;
    background: #ffffff;
    padding: 40px 0 35px 0;
    border-top: 1px solid #f1f5f9;
    border-bottom: 1px solid #f1f5f9;
    font-family: system-ui, -apple-system, sans-serif;
    overflow: hidden;
  }
  
  /* Typography with Accent Lines */
  .shaiksaimeera_webystraa-trust-label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #94a3b8;
    margin-bottom: 30px;
  }

  .shaiksaimeera_webystraa-trust-label::before,
  .shaiksaimeera_webystraa-trust-label::after {
    content: '';
    height: 1px;
    width: 40px;
    background: #e2e8f0;
  }

  /* Marquee constraints & Edge Fading */
  .shaiksaimeera_webystraa-marquee-container {
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
    /* Smooth fade-out effect on the left and right edges */
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
  }

  /* Hardware accelerated track */
  .shaiksaimeera_webystraa-marquee-track {
    display: flex;
    align-items: center;
    width: max-content;
    animation: shaiksaimeera_webystraa-scroll 40s linear infinite;
    will-change: transform;
  }

  /* Pause on hover for usability */
  .shaiksaimeera_webystraa-marquee-container:hover .shaiksaimeera_webystraa-marquee-track {
    animation-play-state: paused;
  }

  /* Individual Logo Wrappers */
  .shaiksaimeera_webystraa-logo-item {
    padding: 0 45px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  /* Advanced Logo Styling & Hover Physics */
  .shaiksaimeera_webystraa-logo-item img {
    height: 34px;
    width: auto;
    max-width: 140px;
    object-fit: contain;
    /* Start washed out so it doesn't distract from the main hero CTA */
    filter: grayscale(100%) opacity(40%);
    /* Bouncy cubic-bezier transition for a premium feel */
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    cursor: pointer;
  }

  .shaiksaimeera_webystraa-logo-item img:hover {
    transform: scale(1.15) translateY(-2px);
    /* Restores color and adds a shape-contouring shadow to the PNG */
    filter: grayscale(0%) opacity(100%) drop-shadow(0 4px 6px rgba(0,0,0,0.15));
  }

  /* Seamless Loop Keyframes */
  @keyframes shaiksaimeera_webystraa-scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
  }

  /* Mobile Adjustments */
  @media (max-width: 768px) {
    .shaiksaimeera_webystraa-trust-band {
      padding: 30px 0 25px 0;
    }
    .shaiksaimeera_webystraa-trust-label {
      font-size: 0.65rem;
      gap: 10px;
      margin-bottom: 25px;
    }
    .shaiksaimeera_webystraa-trust-label::before,
    .shaiksaimeera_webystraa-trust-label::after {
      width: 25px;
    }
    .shaiksaimeera_webystraa-logo-item {
      padding: 0 25px;
    }
    .shaiksaimeera_webystraa-logo-item img {
      height: 26px;
    }
  }
  
         /* Shine Effect for Sign In Button */
.client-login-header-btn {
    position: relative;
    overflow: hidden;
    display: inline-block;
}

/* Shine Overlay */
.client-login-header-btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(
        120deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.6) 50%,
        rgba(255, 255, 255, 0) 100%
    );
    transform: skewX(-25deg);
    animation: shine 5s linear infinite;
}

/* Shine Animation */
@keyframes shine {
    0% {
        left: -75%;
    }
    20% {
        left: 125%;
    }
    100% {
        left: 125%;
    }
}

/* Optional Hover Enhancement */
.client-login-header-btn:hover {
    transform: translateY(-2px);
    transition: all 0.3s ease-in-out;
}

    .ws-safe-comparison {
        background: #ffffff;
        font-family: 'Inter', sans-serif;
        padding: 70px 0;
        overflow: hidden;
    }

    .ws-safe-container {
        width: 100%;
        max-width: 1180px;
        margin: 0 auto;
        padding: 0 20px;
        box-sizing: border-box;
    }

    .ws-safe-heading {
        max-width: 1050px;
        margin: 0 auto 34px auto;
        text-align: left;
    }

    .ws-safe-heading h2 {
        margin: 0 0 12px 0;
        font-size: 38px;
        line-height: 1.12;
        font-weight: 800;
        color: #0f172a;
        letter-spacing: -0.02em;
    }

    .ws-safe-heading p {
        margin: 0;
        font-size: 16px;
        line-height: 1.7;
        color: #64748b;
        max-width: 760px;
    }

    .ws-mobile-compare-switch {
        display: none;
        max-width: 1050px;
        margin: 0 auto 18px auto;
    }

    .ws-mobile-compare-switch label {
        display: block;
        font-size: 14px;
        font-weight: 700;
        color: #0f172a;
        margin-bottom: 10px;
    }

    .ws-mobile-tab-group {
        display: flex;
        gap: 8px;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 14px;
        padding: 6px;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.8);
    }

    .ws-mobile-tab-btn {
        appearance: none;
        border: 0;
        background: transparent;
        color: #475569;
        font-size: 14px;
        font-weight: 700;
        padding: 11px 14px;
        border-radius: 10px;
        cursor: pointer;
        flex: 1 1 0;
        transition: all 0.25s ease;
        white-space: nowrap;
    }

    .ws-mobile-tab-btn.active {
        background: linear-gradient(180deg, #0a5cff 0%, #0047ff 100%);
        color: #ffffff;
        box-shadow: 0 8px 20px rgba(0, 71, 255, 0.24);
    }

    .ws-safe-wrapper {
        position: relative;
        max-width: 1050px;
        margin: 0 auto;
        overflow-x: auto;
        box-sizing: border-box;
        -webkit-overflow-scrolling: touch;
    }

    .ws-safe-wrapper::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 25%;
        width: 28%;
        border: 3px solid #0047ff;
        border-radius: 16px;
        pointer-events: none;
        z-index: 3;
        box-sizing: border-box;
        box-shadow:
            0 0 0 1px rgba(0, 71, 255, 0.16),
            0 12px 30px rgba(0, 71, 255, 0.14);
    }

    .ws-safe-table {
        width: 100%;
        min-width: 850px;
        table-layout: fixed;
        border-collapse: separate;
        border-spacing: 0;
        background: #ffffff;
        border: 1px solid #e8eef5;
        border-radius: 16px;
        position: relative;
        z-index: 1;
        box-shadow: 0 16px 40px rgba(15, 23, 42, 0.06);
    }

    .ws-safe-table col.ws-col-feature { width: 25%; }
    .ws-safe-table col.ws-col-center { width: 28%; }
    .ws-safe-table col.ws-col-competitor { width: 23.5%; }

    .ws-safe-table th,
    .ws-safe-table td {
        padding: 22px 20px;
        text-align: center;
        vertical-align: middle;
        font-size: 15px;
        line-height: 1.5;
        color: #475569;
        border-bottom: 1px solid #edf2f7;
        box-sizing: border-box;
        background: #ffffff;
        word-wrap: break-word;
    }

    .ws-safe-table tbody tr:nth-child(even):not(.ws-last-row):not(.ws-category-row) td:not(.ws-center-col):not(.ws-center-bot) {
        background: #fcfdff;
    }

    .ws-safe-table thead th {
        font-weight: 800;
    }

    .ws-empty-head {
        background: #ffffff;
        border-right: 1px solid #edf2f7;
        border-top-left-radius: 16px;
    }

    .ws-feat-col {
        text-align: left !important;
        font-weight: 700;
        color: #1e293b !important;
        border-right: 1px solid #edf2f7;
    }

    .ws-comp-head {
        font-size: 15px;
        font-weight: 800;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.08em;
    }

    .last-head {
        border-top-right-radius: 16px;
    }

    .ws-category-row td {
        background: #ffffff !important;
    }

    .ws-cat-row {
        color: #0047ff !important;
        font-size: 17px !important;
        font-weight: 800;
        text-align: left !important;
        padding-top: 30px !important;
        padding-bottom: 12px !important;
        border-right: none !important;
        border-bottom: none !important;
        letter-spacing: -0.01em;
    }

    .ws-cat-empty {
        border-bottom: none !important;
        background: #ffffff !important;
    }

    .ws-center-col,
    .ws-center-top,
    .ws-center-bot {
        background: linear-gradient(180deg, #fbfdff 0%, #f4f8ff 100%) !important;
        color: #0f172a !important;
        font-weight: 700;
    }

    .ws-center-top {
        padding-top: 28px !important;
        padding-bottom: 22px !important;
        border-bottom: none !important;
        border-radius: 16px 16px 0 0;
        position: relative;
    }

    .ws-center-col {
        border-bottom: none !important;
    }

    .ws-center-bot {
        padding-top: 18px !important;
        padding-bottom: 28px !important;
        border-radius: 0 0 16px 16px;
    }

    .ws-last-row td {
        border-bottom: none !important;
    }

    .ws-recommended-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 14px;
        padding: 7px 14px;
        border-radius: 999px;
        background: linear-gradient(180deg, #0a5cff 0%, #0047ff 100%);
        color: #ffffff;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        box-shadow: 0 10px 24px rgba(0, 71, 255, 0.22);
        position: relative;
        z-index: 2;
    }

    .ws-logo-wrap {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        min-height: 96px;
        gap: 10px;
        position: relative;
        overflow: hidden;
    }

    .ws-logo-wrap::after {
        content: "";
        position: absolute;
        top: -20%;
        left: -80%;
        width: 40%;
        height: 140%;
        background: linear-gradient(
            120deg,
            rgba(255,255,255,0) 0%,
            rgba(255,255,255,0.25) 42%,
            rgba(255,255,255,0.72) 50%,
            rgba(255,255,255,0.25) 58%,
            rgba(255,255,255,0) 100%
        );
        transform: skewX(-22deg);
        animation: wsLogoShine 3.8s ease-in-out infinite;
        pointer-events: none;
        z-index: 1;
    }

    .ws-logo-img {
        max-height: 42px;
        width: auto;
        display: inline-block;
        vertical-align: middle;
        position: relative;
        z-index: 2;
    }

    .ws-plan-box {
        margin-top: 2px;
        padding: 10px 12px;
        border-radius: 10px;
        background: rgba(0, 71, 255, 0.04);
        position: relative;
        z-index: 2;
    }

    .ws-plan-price {
        font-size: 20px;
        font-weight: 900;
        color: #0f172a;
        line-height: 1.2;
    }

    .ws-price-big {
        font-size: 28px;
        font-weight: 900;
        color: #0f172a;
        line-height: 1.15;
        letter-spacing: -0.02em;
    }

    .ws-price-reg {
        display: block;
        font-size: 18px;
        font-weight: 800;
        color: #334155;
        line-height: 1.3;
    }

    .ws-txt-blue {
        display: block;
        font-size: 13px;
        color: #0047ff;
        font-weight: 700;
        margin-top: 7px;
        line-height: 1.45;
    }

    .ws-txt-gray {
        display: block;
        font-size: 13px;
        color: #94a3b8;
        margin-top: 7px;
        line-height: 1.45;
    }

    .ws-strike {
        text-decoration: line-through;
        color: #cbd5e1;
    }

    .ws-status-yes {
        color: #00b67a;
        font-weight: 800;
        font-size: 15px;
        text-transform: uppercase;
        letter-spacing: 0.06em;
    }

    .ws-status-no {
        color: #cbd5e1;
        font-weight: 800;
        font-size: 15px;
        text-transform: uppercase;
        letter-spacing: 0.06em;
    }

    .ws-btn-action {
        background: linear-gradient(180deg, #0a5cff 0%, #0047ff 100%);
        color: #ffffff !important;
        font-size: 15px;
        font-weight: 800;
        padding: 15px 0;
        border-radius: 999px;
        text-decoration: none;
        display: block;
        width: 86%;
        margin: 0 auto;
        transition: all 0.28s ease;
        text-align: center;
        position: relative;
        z-index: 4;
        box-shadow: 0 14px 28px rgba(0, 71, 255, 0.22);
        overflow: hidden;
    }

    .ws-btn-action::after {
        content: "";
        position: absolute;
        top: -20%;
        left: -80%;
        width: 38%;
        height: 140%;
        background: linear-gradient(
            120deg,
            rgba(255,255,255,0) 0%,
            rgba(255,255,255,0.22) 42%,
            rgba(255,255,255,0.70) 50%,
            rgba(255,255,255,0.22) 58%,
            rgba(255,255,255,0) 100%
        );
        transform: skewX(-22deg);
        animation: wsButtonShine 2.9s ease-in-out infinite;
        pointer-events: none;
    }

    .ws-btn-action:hover {
        background: linear-gradient(180deg, #0954eb 0%, #003edc 100%);
        transform: translateY(-2px);
        box-shadow: 0 18px 32px rgba(0, 71, 255, 0.28);
        color: #ffffff !important;
        text-decoration: none;
    }

    .ws-safe-note {
        max-width: 1050px;
        margin: 18px auto 0 auto;
        text-align: left;
    }

    .ws-safe-note p {
        margin: 0;
        font-size: 12px;
        line-height: 1.7;
        color: #94a3b8;
    }

    @keyframes wsLogoShine {
        0% { left: -85%; }
        55% { left: 140%; }
        100% { left: 140%; }
    }

    @keyframes wsButtonShine {
        0% { left: -85%; }
        60% { left: 145%; }
        100% { left: 145%; }
    }

    @media (max-width: 1199px) {
        .ws-safe-heading h2 {
            font-size: 34px;
        }
    }

    @media (max-width: 991px) {
        .ws-safe-comparison {
            padding: 54px 0;
        }

        .ws-safe-container {
            padding: 0 16px;
        }

        .ws-safe-heading {
            margin-bottom: 26px;
        }

        .ws-safe-heading h2 {
            font-size: 30px;
        }

        .ws-safe-heading p {
            font-size: 15px;
        }

        .ws-safe-table th,
        .ws-safe-table td {
            padding: 18px 14px;
            font-size: 14px;
        }

        .ws-price-big {
            font-size: 22px;
        }

        .ws-price-reg {
            font-size: 16px;
        }

        .ws-cat-row {
            font-size: 15px !important;
            padding-top: 22px !important;
        }

        .ws-recommended-badge {
            margin-bottom: 12px;
            font-size: 10px;
            padding: 6px 12px;
        }

        .ws-logo-wrap {
            min-height: 84px;
        }

        .ws-safe-wrapper::before {
            border-radius: 14px;
        }
    }

    @media (max-width: 767px) {
        .ws-safe-comparison {
            padding: 46px 0;
        }

        .ws-safe-heading {
            margin-bottom: 22px;
        }

        .ws-safe-heading h2 {
            font-size: 26px;
        }

        .ws-safe-heading p {
            font-size: 14px;
            line-height: 1.65;
        }

        .ws-mobile-compare-switch {
            display: block;
        }

        .ws-safe-wrapper::before {
            display: none;
        }

        .ws-safe-wrapper {
            overflow-x: visible;
        }

        .ws-safe-table {
            min-width: 100%;
            border-radius: 14px;
        }

        .ws-safe-table col.ws-col-feature { width: 38%; }
        .ws-safe-table col.ws-col-center { width: 31%; }
        .ws-safe-table col.ws-col-competitor { width: 31%; }

        .ws-safe-table th,
        .ws-safe-table td {
            padding: 13px 9px;
            font-size: 12px;
            line-height: 1.45;
        }

        .ws-feat-col,
        .ws-cat-row {
            font-size: 12px !important;
        }

        .ws-feat-col {
            padding-left: 10px !important;
            padding-right: 10px !important;
        }

        .ws-cat-row {
            padding-top: 16px !important;
            padding-bottom: 9px !important;
        }

        .ws-comp-head {
            font-size: 11px;
            letter-spacing: 0.04em;
        }

        .ws-price-big {
            font-size: 18px;
        }

        .ws-price-reg {
            font-size: 13px;
        }

        .ws-txt-blue,
        .ws-txt-gray {
            font-size: 10px;
            line-height: 1.35;
        }

        .ws-logo-img {
            max-height: 34px;
        }

        .ws-logo-wrap {
            min-height: auto;
            gap: 8px;
        }

        .ws-recommended-badge {
            font-size: 9px;
            padding: 5px 10px;
            margin-bottom: 10px;
        }

        .ws-btn-action {
            width: 100%;
            font-size: 14px;
            padding: 12px 0;
        }

        .show-resellerclub .ws-col-inmotion,
        .show-resellerclub .ws-head-inmotion,
        .show-resellerclub .ws-cell-inmotion {
            display: none;
        }

        .show-inmotion .ws-col-resellerclub,
        .show-inmotion .ws-head-resellerclub,
        .show-inmotion .ws-cell-resellerclub {
            display: none;
        }

        .ws-center-top,
        .ws-center-col,
        .ws-center-bot {
            border-left: 3px solid #0047ff !important;
            border-right: 3px solid #0047ff !important;
            background: linear-gradient(180deg, #fbfdff 0%, #f5f8ff 100%) !important;
        }

        .ws-center-top {
            border-top: 3px solid #0047ff !important;
            box-shadow: 0 -4px 14px rgba(0, 71, 255, 0.08);
        }

        .ws-center-bot {
            border-bottom: 3px solid #0047ff !important;
            box-shadow: 0 10px 22px rgba(0, 71, 255, 0.12);
        }

        .ws-safe-note p {
            font-size: 11px;
            line-height: 1.6;
        }
    }

    @media (max-width: 480px) {
        .ws-safe-container {
            padding: 0 12px;
        }

        .ws-safe-heading h2 {
            font-size: 22px;
        }

        .ws-safe-heading p {
            font-size: 13px;
        }

        .ws-mobile-tab-group {
            gap: 6px;
            padding: 5px;
            border-radius: 12px;
        }

        .ws-mobile-tab-btn {
            font-size: 12px;
            padding: 10px 10px;
        }

        .ws-safe-table col.ws-col-feature { width: 40%; }
        .ws-safe-table col.ws-col-center { width: 30%; }
        .ws-safe-table col.ws-col-competitor { width: 30%; }

        .ws-safe-table th,
        .ws-safe-table td {
            padding: 12px 8px;
            font-size: 11px;
        }

        .ws-comp-head {
            font-size: 10px;
        }

        .ws-feat-col,
        .ws-cat-row {
            font-size: 11px !important;
        }

        .ws-price-big {
            font-size: 16px;
        }

        .ws-price-reg {
            font-size: 12px;
        }

        .ws-txt-blue,
        .ws-txt-gray {
            font-size: 9px;
        }

        .ws-btn-action {
            font-size: 13px;
            padding: 11px 0;
        }

        .ws-logo-img {
            max-height: 30px;
        }

        .ws-recommended-badge {
            font-size: 8px;
            padding: 5px 8px;
        }

        .ws-plan-price {
            font-size: 16px;
        }
    }
    
        /* Scoped Variables and Base Styles */
    .webystrata {
        --clr-primary: #1b65f3;
        --clr-primary-hover: #144ecd;
        --clr-text-main: #000000;
        --clr-text-sub: #111827;
        --clr-success: #10b981;
        --clr-bg-tooltip: #ffffff;
        --clr-border-tooltip: #e5e7eb;
        --font-main: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;

        font-family: var(--font-main);
        background-color: #ffffff;
        color: var(--clr-text-main);
        line-height: 1.5;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        overflow: hidden;
        width: 100%;
    }

    /* Scoped Box Sizing Reset */
    .webystrata *,
    .webystrata *::before,
    .webystrata *::after {
        box-sizing: border-box;
    }

    /* Scoped Animations */
    @keyframes ws-slideUpFade {
        0% { opacity: 0; transform: translateY(20px); }
        100% { opacity: 1; transform: translateY(0); }
    }

    @keyframes ws-float {
        0% { transform: translateY(0px); }
        50% { transform: translateY(-10px); }
        100% { transform: translateY(0px); }
    }

    @keyframes ws-shine {
        0% { left: -100%; }
        15% { left: 200%; }
        100% { left: 200%; }
    }

    @keyframes ws-imageShine {
        0% { left: -120%; }
        18% { left: 130%; }
        100% { left: 130%; }
    }

    /* Scoped Layout Styles */
    .webystrata.hero {
        max-width: 1280px;
        margin: 0 auto;
        padding: 130px 20px 80px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 50px;
        width: 100%;
    }

    .webystrata .hero__content {
        flex: 0 1 520px;
        max-width: 560px;
        min-width: 0;
        animation: ws-slideUpFade 0.8s ease-out forwards;
        position: relative;
        z-index: 2;
    }

    .webystrata .hero__pre-headline {
        font-size: 20px;
        font-weight: 500;
        margin-bottom: 12px;
        color: var(--clr-text-main);
        letter-spacing: -0.01em;
    }

    .webystrata .hero__highlight {
        color: var(--clr-primary);
        font-weight: 600;
    }

    .webystrata .hero__headline {
        font-family: 'DM Sans', sans-serif;
        font-size: clamp(34px, 3.2vw, 38px);
        font-weight: 800;
        line-height: 1.25;
        letter-spacing: -0.015em;
        color: #000;
        margin: 0 0 16px;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        text-rendering: optimizeLegibility;
    }

    .webystrata .hero__sub-headline {
        font-size: clamp(16px, 2vw, 18px);
        color: var(--clr-text-sub);
        margin: 0 0 28px;
        font-weight: 400;
        max-width: 48ch;
    }

    .webystrata .hero__features {
        list-style: none;
        margin: 0 0 32px;
        padding: 0;
    }

    .webystrata .hero__feature-item {
        display: flex;
        align-items: center;
        font-size: 17px;
        margin-bottom: 14px;
        color: var(--clr-text-sub);
        transition: transform 0.2s ease;
        min-width: 0;
    }

    .webystrata .hero__feature-item:hover {
        transform: translateX(4px);
    }

    .webystrata .hero__feature-icon {
        width: 18px;
        height: 18px;
        fill: none;
        stroke: var(--clr-success);
        stroke-width: 2.5;
        stroke-linecap: round;
        stroke-linejoin: round;
        margin-right: 12px;
        flex-shrink: 0;
    }

    .webystrata .hero__pricing {
        display: flex;
        align-items: flex-start;
        margin-bottom: 4px;
        line-height: 1;
        flex-wrap: wrap;
    }

    .webystrata .hero__currency {
        font-size: 22px;
        font-weight: 500;
        margin-top: 10px;
        margin-right: 2px;
        color: var(--clr-text-main);
    }

    .webystrata .hero__price {
        font-size: 55px;
        font-weight: 650;
        letter-spacing: -2.5px;
        color: var(--clr-text-main);
    }

    .webystrata .hero__period {
        font-size: 22px;
        color: var(--clr-text-sub);
        margin-top: 42px;
        margin-left: 2px;
        font-weight: 400;
    }

    .webystrata .hero__renewal {
        font-size: 16px;
        font-weight: 500;
        color: var(--clr-primary);
        margin-bottom: 24px;
        letter-spacing: -0.01em;
    }

    .webystrata .hero__cta {
        display: inline-block;
        background-color: var(--clr-primary);
        color: #ffffff !important;
        text-decoration: none;
        font-size: 16px;
        font-weight: 600;
        padding: 12px 28px;
        border-radius: 8px;
        transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        margin-bottom: 20px;
        box-shadow: 0 4px 12px 0 rgba(27, 101, 243, 0.2);
        position: relative;
        overflow: hidden;
    }

    .webystrata .hero__cta::after {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 50%;
        height: 100%;
        background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.4) 50%, rgba(255,255,255,0) 100%);
        transform: skewX(-25deg);
        animation: ws-shine 5s infinite;
        pointer-events: none;
    }

    .webystrata .hero__cta:hover {
        box-shadow: 0 6px 16px rgba(27, 101, 243, 0.35);
        transform: translateY(-2px);
        background-color: var(--clr-primary-hover);
        color: #ffffff;
    }

    .webystrata .hero__cta:active {
        transform: translateY(0);
    }

    .webystrata .hero__trust {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        font-size: 15px;
        color: var(--clr-text-main);
        gap: 0;
    }

    .webystrata .hero__trust-icon {
        width: 18px;
        height: 18px;
        margin-right: 8px;
        stroke: var(--clr-success);
        fill: none;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
        flex-shrink: 0;
    }

    .webystrata .hero__trust-dot {
        margin: 0 6px;
        font-weight: bold;
    }

    .webystrata .hero__image-wrapper {
        flex: 1.55 1 620px;
        max-width: none;
        min-width: 0;
        display: flex;
        justify-content: flex-end;
        align-items: center;
        animation: ws-slideUpFade 0.8s ease-out 0.2s forwards;
        opacity: 0;
        position: relative;
        overflow: visible;
    }

    .webystrata .hero__image {
        display: block;
        width: 135%;
        max-width: 1550px;
        min-width: 760px;
        height: auto;
        max-height: none;
        object-fit: contain;
        animation: ws-float 6s ease-in-out infinite;
        filter: drop-shadow(0 15px 25px rgba(0,0,0,0.06));
        transform-origin: center right;
        position: relative;
        z-index: 2;
    }

    .webystrata .hero__image-shine {
        position: absolute;
        inset: 0;
        pointer-events: none;
        z-index: 3;
        overflow: hidden;
    }

    .webystrata .hero__image-shine::after {
        content: "";
        position: absolute;
        top: 0;
        left: -120%;
        width: 45%;
        height: 100%;
        background: linear-gradient(
            120deg,
            rgba(255,255,255,0) 0%,
            rgba(255,255,255,0.28) 50%,
            rgba(255,255,255,0) 100%
        );
        transform: skewX(-25deg);
        animation: ws-imageShine 6s infinite;
    }

    .webystrata .tooltip-trigger {
        position: relative;
        cursor: help;
        border-bottom: 1px dashed #9ca3af;
        display: inline-block;
        font-style: normal;
        transition: color 0.2s ease, border-bottom-color 0.2s ease;
        color: inherit;
    }

    .webystrata .tooltip-trigger:hover,
    .webystrata .tooltip-trigger:focus {
        color: var(--clr-primary) !important;
        border-bottom-color: var(--clr-primary);
    }

    .webystrata .tooltip-content {
        position: absolute;
        top: 50%;
        left: 100%;
        transform: translateX(18px) translateY(-50%);
        width: 370px;
        background: #ffffff;
        border: 1px solid #ececec;
        border-radius: 22px;
        padding: 22px;
        box-shadow: 0 18px 45px rgba(0, 0, 0, 0.08);
        opacity: 0;
        visibility: hidden;
        transition: all 0.28s ease;
        z-index: 100;
        font-size: 12px;
        line-height: 1.65;
        color: var(--clr-text-main);
        text-align: left;
        font-weight: normal;
        pointer-events: none;
        text-transform: none;
        letter-spacing: normal;
    }

    .webystrata .tooltip-trigger:hover .tooltip-content,
    .webystrata .tooltip-trigger:focus .tooltip-content,
    .webystrata .tooltip-trigger:focus-within .tooltip-content {
        opacity: 1;
        visibility: visible;
        transform: translateX(22px) translateY(-50%);
        pointer-events: auto;
    }

    .webystrata .tooltip-content::after {
        content: '';
        position: absolute;
        top: 50%;
        left: -10px;
        transform: translateY(-50%);
        width: 20px;
        height: 20px;
        background: #ffffff;
        border-left: 1px solid #ececec;
        border-bottom: 1px solid #ececec;
        rotate: 45deg;
    }

    .webystrata .tooltip-content::before {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: -24px;
        width: 24px;
    }

    .webystrata .tooltip-content img {
        width: 100%;
        height: auto;
        border-radius: 14px;
        margin-bottom: 16px;
        display: block;
        border: 1px solid #f3f4f6;
    }

    .webystrata .tooltip-content b {
        font-weight: 700;
        color: var(--clr-text-main);
    }

    /* Scoped Media Queries */
    @media (max-width: 1366px) {
        .webystrata.hero {
            max-width: 1240px;
            gap: 36px;
            padding: 115px 20px 72px;
        }

        .webystrata .hero__content {
            flex-basis: 500px;
            max-width: 535px;
        }

        .webystrata .hero__image-wrapper {
            flex: 1.48 1 560px;
        }

        .webystrata .hero__image {
            width: 128%;
            max-width: 1420px;
            min-width: 680px;
        }
    }

    @media (max-width: 1200px) {
        .webystrata.hero {
            gap: 28px;
            padding: 100px 20px 66px;
        }

        .webystrata .hero__content {
            flex-basis: 480px;
            max-width: 510px;
        }

        .webystrata .hero__headline {
            font-size: clamp(28px, 3vw, 34px);
        }

        .webystrata .hero__image-wrapper {
            flex: 1.42 1 520px;
        }

        .webystrata .hero__image {
            width: 122%;
            max-width: 1280px;
            min-width: 620px;
        }
    }

    @media (max-width: 992px) {
        .webystrata.hero {
            gap: 24px;
            padding: 85px 20px 58px;
            align-items: center;
        }

        .webystrata .hero__content {
            flex: 0 1 46%;
            max-width: 470px;
        }

        .webystrata .hero__headline {
            font-size: clamp(26px, 3vw, 31px);
        }

        .webystrata .hero__pre-headline {
            font-size: 18px;
        }

        .webystrata .hero__feature-item {
            font-size: 16px;
        }

        .webystrata .hero__image-wrapper {
            flex: 1 1 54%;
            justify-content: flex-end;
        }

        .webystrata .hero__image {
            width: 118%;
            max-width: 1080px;
            min-width: 520px;
        }

        .webystrata .tooltip-content {
            width: 220px;
        }
    }

    @media (max-width: 768px) {
        .webystrata.hero {
            flex-direction: column;
            text-align: center;
            padding: 70px 20px 40px;
            gap: 24px;
        }

        .webystrata .hero__content {
            max-width: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .webystrata .hero__headline {
            max-width: 100%;
            font-size: clamp(28px, 7vw, 34px);
            white-space: normal;
        }

        .webystrata .hero__sub-headline {
            max-width: 34ch;
        }

        .webystrata .hero__features,
        .webystrata .hero__pricing,
        .webystrata .hero__trust {
            justify-content: center;
            width: 100%;
        }

        .webystrata .hero__features {
            margin-bottom: 28px;
        }

        .webystrata .hero__feature-item {
            justify-content: center;
            flex-wrap: wrap;
            text-align: center;
            margin-bottom: 12px;
        }

        .webystrata .hero__image-wrapper {
            order: 2;
            width: 100%;
            max-width: 100%;
            margin-top: 8px;
            justify-content: center;
        }

        .webystrata .hero__image {
            width: 100%;
            max-width: 700px;
            min-width: 0;
            height: auto;
        }

        .webystrata .hero__image-shine {
            inset: 0;
        }

        .webystrata .tooltip-content {
            position: fixed; 
            top: auto;       
            bottom: 16px;    
            left: 50%;
            width: calc(100% - 32px); 
            max-width: 340px; 
            padding: 10px;    
            border-radius: 12px; 
            font-size: 11px;  
            line-height: 1.35; 
            transform: translateX(-50%) translateY(150%); 
            z-index: 9999;   
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25); 
            
            /* Places image and text side-by-side */
            display: flex;
            align-items: center;
            gap: 12px;
            text-align: left;
        }

        .webystrata .tooltip-content img {
            width: 75px !important; 
            height: auto;
            margin-bottom: 0;       
            border-radius: 6px;
            flex-shrink: 0;         
        }

        .webystrata .tooltip-trigger:hover .tooltip-content,
        .webystrata .tooltip-trigger:focus .tooltip-content,
        .webystrata .tooltip-trigger:focus-within .tooltip-content {
            transform: translateX(-50%) translateY(0); 
        }

        .webystrata .tooltip-content::after {
            display: none; 
        }
    }

    @media (max-width: 576px) {
        .webystrata.hero {
            padding: 56px 16px 36px;
            gap: 20px;
        }

        .webystrata .hero__pre-headline {
            font-size: 16px;
            margin-bottom: 10px;
        }

        .webystrata .hero__headline {
            font-size: clamp(24px, 8vw, 30px);
            margin-bottom: 12px;
        }

        .webystrata .hero__sub-headline {
            font-size: 15px;
            margin-bottom: 22px;
        }

        .webystrata .hero__feature-item {
            font-size: 15px;
            line-height: 1.45;
        }

        .webystrata .hero__feature-icon {
            width: 16px;
            height: 16px;
            margin-right: 10px;
        }

        .webystrata .hero__price {
            font-size: 44px;
            letter-spacing: -1.8px;
        }

        .webystrata .hero__currency {
            font-size: 18px;
            margin-top: 8px;
        }

        .webystrata .hero__renewal {
            font-size: 14px;
            margin-bottom: 20px;
        }

        .webystrata .hero__cta {
            width: 100%;
            max-width: 280px;
            text-align: center;
            padding: 12px 24px;
            margin-bottom: 16px;
        }

        .webystrata .hero__trust {
            justify-content: center;
            gap: 6px;
            line-height: 1.4;
        }

        .webystrata .hero__trust-dot {
            display: none;
        }

        .webystrata .hero__image {
            width: 100%;
            max-width: 100%;
        }
    }

    @media (max-width: 380px) {
        .webystrata.hero {
            padding-left: 14px;
            padding-right: 14px;
        }

        .webystrata .hero__headline {
            font-size: 22px;
        }

        .webystrata .hero__price {
            font-size: 38px;
        }

        .webystrata .hero__feature-item {
            font-size: 14px;
        }

        .webystrata .hero__trust {
            flex-direction: column;
            gap: 4px;
        }
    }
    
    
    .ws-premium-sales-features {
    padding: 120px 20px;
    background: #ffffff;
    font-family: var(--font-main, 'DM Sans', sans-serif);
    position: relative;
}

.ws-psf-header {
    text-align: center;
    max-width: 850px;
    margin: 0 auto 80px;
}

.ws-psf-header h2 {
    font-family: 'DM Sans', sans-serif;
    font-size: clamp(24px, 3vw, 32px);
    font-weight: 900;
    color: #0f172a;
    margin-bottom: 18px;
    letter-spacing: -0.04em;
    line-height: 1.1;
}

.ws-psf-header h2 span {
    color: var(--clr-primary, #1b65f3);
}

.ws-psf-header p {
    font-size: clamp(14px, 1.5vw, 16px);
    color: #475569;
    font-weight: 500;
    line-height: 1.6;
}

.ws-psf-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 36px;
    max-width: 1240px;
    margin: 0 auto;
}

.ws-psf-card {
    padding: 50px 36px;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 10px 15px -3px rgba(0,0,0,0.02), 0 4px 6px -2px rgba(0,0,0,0.01), 0 0 0 1px #f1f5f9;
    border-top: 4px solid var(--clr-primary, #1b65f3);
    transition: all 0.45s ease;
    position: relative;
    overflow: hidden;
}

.ws-psf-card::after {
    content: '';
    position: absolute;
    top: 0;
    left: -120%;
    width: 60%;
    height: 100%;
    background: linear-gradient(120deg, transparent 0%, rgba(27,101,243,0.06) 50%, transparent 100%);
    transform: skewX(-25deg);
    transition: left 0.6s ease;
    pointer-events: none;
}

.ws-psf-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 25px 50px -12px rgba(27,101,243,0.15);
    border-color: #0f172a;
}

.ws-psf-card:hover::after {
    left: 150%;
}

.ws-psf-icon-area {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 32px;
    position: relative;
    z-index: 2;
}

@keyframes ws-icon-pulse {
    0% { box-shadow: 0 0 0 0 rgba(27,101,243,0.18); }
    70% { box-shadow: 0 0 0 15px rgba(27,101,243,0); }
    100% { box-shadow: 0 0 0 0 rgba(27,101,243,0); }
}

.ws-psf-icon {
    width: 70px;
    height: 70px;
    background: #eaf1ff;
    border: 1px solid rgba(27,101,243,0.12);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #4b5563;
    transition: all 0.3s ease;
    animation: ws-icon-pulse 2s infinite;
}

.ws-psf-card:hover .ws-psf-icon {
    background: #dbeafe;
    color: #0f172a;
    border-color: rgba(27,101,243,0.25);
    transform: scale(1.1);
}

.ws-psf-icon svg {
    width: 32px;
    height: 32px;
    stroke: currentColor;
    stroke-width: 2.5;
}

.ws-psf-card h3 {
    font-family: 'DM Sans', sans-serif;
    font-size: 24px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 14px;
    letter-spacing: -0.02em;
    text-align: center;
    position: relative;
    z-index: 2;
}

.ws-psf-card p {
    font-size: 16px;
    color: #334155;
    line-height: 1.7;
    margin: 0;
    text-align: center;
    font-weight: 400;
    position: relative;
    z-index: 2;
}

.ws-psf-card p b {
    color: #0f172a;
    font-weight: 700;
}

.ws-psf-guarantee {
    max-width: 960px;
    margin: 80px auto 0;
    background: #1e293b;
    border-radius: 16px;
    padding: 40px;
    text-align: center;
    color: #ffffff;
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04);
    position: relative;
}

.ws-psf-guarantee::before {
    content: '✓ Risk-Free';
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
    background: #10b981;
    color: #ffffff;
    padding: 4px 16px;
    border-radius: 50px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.ws-psf-guarantee h4 {
    font-size: clamp(26px, 3vw, 38px) !important;
    font-weight: 900 !important;
    margin-bottom: 16px !important;
    letter-spacing: -0.03em;
    position: relative;
    z-index: 5;
    color: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.ws-psf-guarantee p {
    max-width: 720px;
    margin: 0 auto;
    font-size: 18px;
    color: #dbeafe !important;
    line-height: 1.7;
    position: relative;
    z-index: 5;
}

.ws-psf-guarantee::after {
    z-index: 1;
}

.ws-psf-guarantee::before {
    z-index: 2;
}
   /* 🚀 PREMIUM STATIC DOMAIN STRIP 🚀 */
    .ws-slim-strip {
        width: 100%;
        padding: 0 20px;
        position: relative; /* Normal behavior, no sticking */
        z-index: 10;
        margin-top: -24px; 
        margin-bottom: 40px;
        font-family: var(--font-main);
    }

    .ws-ss-inner {
        max-width: 1100px;
        margin: 0 auto;
        background: #ffffff;
        border: 1px solid rgba(229, 231, 235, 0.6);
        border-radius: 14px;
        box-shadow: 0 14px 40px -10px rgba(27, 101, 243, 0.12), 0 4px 6px -4px rgba(0, 0, 0, 0.05);
        display: flex;
        align-items: center;
        padding: 8px 12px; 
        gap: 16px;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .ws-ss-inner:hover {
        transform: translateY(-2px);
        box-shadow: 0 20px 40px -10px rgba(27, 101, 243, 0.18), 0 6px 10px -4px rgba(0, 0, 0, 0.05);
    }

    .ws-ss-label {
        font-size: 14px;
        font-weight: 700;
        color: #1e293b;
        display: flex;
        align-items: center;
        gap: 8px;
        padding-left: 8px;
        letter-spacing: -0.2px;
    }

    .ws-ss-icon {
        width: 20px;
        height: 20px;
        color: var(--clr-primary);
    }

    /* Recessed form area */
    .ws-ss-form {
        display: flex;
        flex: 1;
        align-items: center;
        gap: 0;
        background: #ffffff;
        border-radius: 10px;
        padding: 4px;
        border: 1px solid #cbd5e1;
        box-shadow: inset 0 2px 4px rgba(0,0,0,0.02);
        transition: all 0.2s ease;
    }

    .ws-ss-form:focus-within {
        border-color: var(--clr-primary);
        box-shadow: 0 0 0 4px rgba(27, 101, 243, 0.15), inset 0 2px 4px rgba(0,0,0,0.01);
    }

    .ws-ss-prefix {
        color: #94a3b8;
        font-weight: 500;
        padding-left: 14px;
        font-size: 15px;
        user-select: none;
    }

    .ws-ss-input {
        flex: 1;
        height: 40px;
        border: none;
        background: transparent;
        padding: 0 10px;
        font-size: 15px;
        font-weight: 500;
        font-family: var(--font-main);
        color: var(--clr-text-main);
        outline: none;
    }

    .ws-ss-input::placeholder {
        color: #cbd5e1;
        font-weight: 400;
    }

    /* 🔥 SHIMMER BUTTON 🔥 */
    .ws-ss-btn {
        position: relative;
        overflow: hidden;
        height: 40px;
        background: linear-gradient(135deg, var(--clr-primary) 0%, #0d47a1 100%);
        color: #ffffff;
        border: none;
        border-radius: 8px; 
        padding: 0 24px;
        font-size: 14px;
        font-weight: 600;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 6px;
        transition: all 0.3s ease;
        box-shadow: 0 4px 10px rgba(27, 101, 243, 0.3);
    }

    .ws-ss-btn::after {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 50%;
        height: 100%;
        background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0) 100%);
        transform: skewX(-20deg);
        animation: buttonShimmer 3.5s infinite;
    }

    @keyframes buttonShimmer {
        0% { left: -100%; }
        20% { left: 200%; }
        100% { left: 200%; }
    }

    .ws-ss-btn svg {
        width: 16px;
        height: 16px;
        stroke-width: 2.5;
        transition: transform 0.2s ease;
    }

    .ws-ss-btn:hover {
        background: linear-gradient(135deg, var(--clr-primary-hover) 0%, #0a367c 100%);
        box-shadow: 0 6px 14px rgba(27, 101, 243, 0.4);
    }

    .ws-ss-btn:hover svg {
        transform: scale(1.15) translateX(2px);
    }

    .ws-ss-btn:active {
        transform: scale(0.97);
        box-shadow: 0 2px 4px rgba(27, 101, 243, 0.2);
    }

    /* TLD CHIPS */
    .ws-ss-tlds {
        display: flex;
        align-items: center;
        gap: 12px;
        padding-right: 4px;
    }

    .ws-ss-tld-chip {
        display: flex;
        align-items: center;
        font-size: 13px;
        color: #64748b;
        background: #f8fafc;
        padding: 6px 12px;
        border-radius: 8px;
        border: 1px solid #e2e8f0;
        white-space: nowrap;
        transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
    }

    .ws-ss-tld-chip:hover {
        border-color: #cbd5e1;
        background: #ffffff;
        transform: translateY(-1px);
        box-shadow: 0 2px 6px rgba(0,0,0,0.03);
    }

    .ws-ss-tld-chip strong {
        color: #0f172a;
        font-size: 14px;
        margin-right: 5px;
    }

    /* Pulsing Notification Badge */
    @keyframes pulseRed {
        0% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4); }
        70% { box-shadow: 0 0 0 4px rgba(239, 68, 68, 0); }
        100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); }
    }

    .ws-ss-badge {
        background: #ef4444;
        color: #ffffff;
        font-size: 9px;
        font-weight: 800;
        padding: 3px 6px;
        border-radius: 4px;
        margin: 0 6px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        animation: pulseRed 2s infinite;
    }

    /* Mobile Responsiveness */
    @media (max-width: 1024px) {
        .ws-ss-inner {
            flex-wrap: wrap;
        }
        .ws-ss-tlds {
            width: 100%;
            justify-content: center;
            border-top: 1px solid #f1f5f9;
            padding-top: 12px;
            padding-bottom: 4px;
        }
    }

    @media (max-width: 576px) {
        .ws-slim-strip {
            padding: 0 16px;
        }
        .ws-ss-inner {
            padding: 12px;
            gap: 12px;
        }
        .ws-ss-label {
            display: none; 
        }
        .ws-ss-form {
            width: 100%;
            padding: 4px;
        }
        .ws-ss-prefix {
            padding-left: 10px;
        }
        .ws-ss-input {
            width: 100%;
            padding: 0 8px;
        }
        .ws-ss-tlds {
            gap: 8px;
            flex-wrap: wrap;
        }
        .ws-ss-tld-chip {
            padding: 6px 10px;
            font-size: 12px;
        }
    }
    
    .top-header-annonce {
    padding: 4px 0 !important;   /* reduce vertical padding */
    min-height: auto !important; /* remove forced height */
    height: auto !important;
}

.top-header-annonce-text {
    margin: 0 !important;
    line-height: 1.2 !important; /* reduce text height */
    font-size: 12px; /* adjust as needed */
}

.top-header-annonce p {
    margin: 0 !important;
    padding: 0 !important;
}
.hero {
    padding-top: 110px;
}

@media (max-width: 1200px) {
    .hero {
        padding-top: 90px;
    }
}

@media (max-width: 768px) {
    .hero {
        padding-top: 70px;
    }
}

@media (max-width: 480px) {
    .hero {
        padding-top: 55px;
    }
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  overflow-x: hidden;
}

body {
  font-family: "DM Sans", "Inter", Arial, sans-serif;
  background: #ffffff;
  color: #0f172a;
}

img {
  user-select: none;
  -webkit-user-drag: none;
}

.ws-apps-section {
  width: 100%;
  overflow: hidden;
  background: #ffffff;
  padding: clamp(60px, 8vw, 110px) 0;
}

.ws-apps-header {
  max-width: 900px;
  margin: 0 auto clamp(42px, 5vw, 64px);
  text-align: center;
  padding: 0 20px;
}

.ws-apps-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
  padding: 9px 18px;
  border-radius: 999px;
  background: #eef4ff;
  border: 1px solid #dbe7ff;
  color: #155eef;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.6px;
  text-transform: uppercase;
}

.ws-apps-header h2 {
  max-width: 820px;
  margin: 0 auto 16px;
  font-size: clamp(26px, 3.4vw, 40px);
  line-height: 1.12;
  font-weight: 950;
  letter-spacing: -0.8px;
  color: #0b1220;
}

.ws-apps-header h2 span {
  position: relative;
  display: inline-block;
  color: #155eef;
}

.ws-apps-header h2 span::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;
  width: 100%;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, #155eef, #60a5fa, #155eef);
  background-size: 200% 100%;
  animation: wsUnderline 2.4s ease-in-out infinite;
}

.ws-apps-header p {
  max-width: 760px;
  margin: 0 auto;
  font-size: clamp(14.5px, 1.5vw, 18px);
  line-height: 1.7;
  color: #526173;
  font-weight: 500;
}

.ws-apps-tags {
  max-width: 920px;
  margin: 26px auto 0;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}

.ws-apps-tags span {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 8px 14px;
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  background: #ffffff;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
  transition: border-color 0.22s ease, color 0.22s ease, transform 0.22s ease;
}

.ws-apps-tags span:hover {
  border-color: #155eef;
  color: #155eef;
  transform: translateY(-2px);
}

.ws-marquee-area {
  position: relative;
  width: 100%;
  padding: 2px 0;
}

.ws-marquee-area::before,
.ws-marquee-area::after {
  content: "";
  position: absolute;
  top: 0;
  width: clamp(55px, 10vw, 150px);
  height: 100%;
  z-index: 10;
  pointer-events: none;
}

.ws-marquee-area::before {
  left: 0;
  background: linear-gradient(90deg, #ffffff 0%, rgba(255,255,255,0) 100%);
}

.ws-marquee-area::after {
  right: 0;
  background: linear-gradient(270deg, #ffffff 0%, rgba(255,255,255,0) 100%);
}

/* IMPORTANT FIX: vertical padding prevents hover border from getting cut */
.ws-marquee-row {
  width: 100%;
  overflow: hidden;
  padding: 8px 0;
  margin-bottom: clamp(8px, 1.4vw, 12px);
}

.ws-marquee-row:last-child {
  margin-bottom: 0;
}

.ws-marquee-track {
  display: flex;
  gap: clamp(14px, 2vw, 22px);
  width: max-content;
  animation: wsScrollLeft 34s linear infinite;
}

.ws-marquee-track.reverse {
  animation: wsScrollRight 38s linear infinite;
}

.ws-logo-card {
  position: relative;
  width: clamp(140px, 15vw, 198px);
  height: clamp(68px, 7vw, 86px);
  flex: 0 0 clamp(140px, 15vw, 198px);
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  border: 1.5px solid #d9e2ef;
  border-radius: clamp(13px, 1.4vw, 18px);
  overflow: hidden;
  cursor: pointer;
  outline: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent;
  transition:
    transform 0.24s ease,
    border-color 0.24s ease,
    background-color 0.24s ease;
}

.ws-logo-card,
.ws-logo-card:hover,
.ws-logo-card:focus,
.ws-logo-card:focus-visible,
.ws-logo-card:active {
  outline: none !important;
  box-shadow: none !important;
}

.ws-logo-card::before {
  content: "";
  position: absolute;
  top: -55%;
  left: -90%;
  width: 60%;
  height: 210%;
  background: linear-gradient(
    115deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0.92) 42%,
    rgba(21,94,239,0.18) 50%,
    rgba(255,255,255,0.92) 58%,
    rgba(255,255,255,0) 100%
  );
  transform: rotate(16deg);
  opacity: 0;
  pointer-events: none;
}

.ws-logo-card:hover::before {
  animation: wsHoverShine 0.75s ease forwards;
}

/* Hover border now fully visible */
.ws-logo-card:hover {
  transform: translateY(-4px);
  border-color: #155eef;
  background: #ffffff;
}

.ws-logo-card img {
  position: relative;
  z-index: 2;
  display: block;
  max-width: clamp(90px, 10vw, 132px);
  max-height: clamp(30px, 4vw, 44px);
  object-fit: contain;
  filter: saturate(1.12) contrast(1.06);
  transition: transform 0.24s ease, filter 0.24s ease;
}

.ws-logo-card:hover img {
  transform: scale(1.06);
  filter: saturate(1.25) contrast(1.1);
}

.ws-marquee-row:hover .ws-marquee-track {
  animation-play-state: paused;
}

@keyframes wsScrollLeft {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@keyframes wsScrollRight {
  from { transform: translateX(-50%); }
  to { transform: translateX(0); }
}

@keyframes wsHoverShine {
  0% { left: -90%; opacity: 0; }
  18% { opacity: 1; }
  100% { left: 135%; opacity: 0; }
}

@keyframes wsUnderline {
  0% {
    background-position: 0% 50%;
    transform: scaleX(0.92);
  }
  50% {
    background-position: 100% 50%;
    transform: scaleX(1);
  }
  100% {
    background-position: 0% 50%;
    transform: scaleX(0.92);
  }
}

@media (max-width: 768px) {
  .ws-apps-section {
    padding: 64px 0 72px;
  }

  .ws-apps-header {
    margin-bottom: 40px;
  }

  .ws-apps-tags {
    margin-top: 22px;
    gap: 8px;
  }

  .ws-apps-tags span {
    min-height: 32px;
    padding: 7px 11px;
    font-size: 11px;
  }

  .ws-marquee-row {
    padding: 7px 0;
  }

  .ws-marquee-track {
    animation-duration: 28s;
  }

  .ws-marquee-track.reverse {
    animation-duration: 31s;
  }
}

@media (min-width: 1440px) {
  .ws-logo-card {
    width: 210px;
    height: 90px;
    flex-basis: 210px;
  }

  .ws-logo-card img {
    max-width: 142px;
    max-height: 48px;
  }
}

 /* 1. Component Container & Layout */
  .guarantee-block-wrapper {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    padding: 20px 0; /* Adjust or remove depending on where you place it */
    display: flex;
    justify-content: center;
    width: 100%;
  }

  .guarantee-card {
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
    border-radius: 16px;
    box-shadow: 0 10px 35px rgba(15, 23, 42, 0.08), 0 2px 5px rgba(15, 23, 42, 0.03);
    max-width: 850px;
    width: 100%;
    border: 1px solid rgba(226, 232, 240, 0.9);
    padding: 40px 45px;
    display: flex;
    align-items: center;
    gap: 45px;
    box-sizing: border-box;
  }

  /* 2. Text & Content Styles */
  .guarantee-content {
    flex: 1;
  }

  .guarantee-desc {
    margin: 0 0 20px 0;
    font-size: 14px;
    color: #475569;
    line-height: 1.6;
  }

  .guarantee-desc a {
    color: #2563eb;
    text-decoration: none;
    font-weight: 600;
    border-bottom: 1px solid rgba(37, 99, 235, 0.3);
    padding-bottom: 1px;
  }

  .guarantee-divider {
    border: none;
    border-top: 1px dashed #cbd5e1;
    margin: 0 0 20px 0;
  }

  /* 3. Footer / Signature Section */
  .guarantee-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
  }

  .guarantee-profile {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .guarantee-avatar {
    border-radius: 50%;
    border: 2px solid #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    width: 42px;
    height: 42px;
  }

  /* 4. Animations & Effects */
  .animate-entrance {
    animation: fadeUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }
  @keyframes fadeUp {
    from { opacity: 0; transform: translateY(15px); }
    to { opacity: 1; transform: translateY(0); }
  }

  .image-shine {
    position: relative;
    display: inline-block;
    overflow: hidden;
    border-radius: 8px;
    flex-shrink: 0;
  }
  
  .image-shine img {
    display: block;
    width: 100%;
    max-width: 170px;
    height: auto;
    filter: drop-shadow(0 6px 12px rgba(32, 178, 170, 0.15));
  }

  .image-shine::after {
    content: '';
    position: absolute;
    top: 0;
    left: -150%;
    width: 60%;
    height: 100%;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0) 100%);
    transform: skewX(-25deg);
    animation: imageShineSweep 4.5s infinite cubic-bezier(0.4, 0, 0.2, 1);
  }
  @keyframes imageShineSweep {
    0% { left: -150%; }
    15% { left: 250%; }
    100% { left: 250%; }
  }

  .text-shine {
    margin: 0 0 10px 0;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -0.5px;
    background: linear-gradient(90deg, #0f172a 0%, #0f172a 40%, #38bdf8 50%, #0f172a 60%, #0f172a 100%);
    background-size: 200% auto;
    color: #0f172a;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: textShineSweep 4s linear infinite;
    display: inline-block;
  }
  @keyframes textShineSweep {
    to { background-position: 200% center; }
  }

  .pulse-wrapper {
    border-radius: 8px;
    animation: pulse 2s infinite;
    background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
    display: inline-block;
  }
  @keyframes pulse {
    0% { box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.3); }
    70% { box-shadow: 0 0 0 8px rgba(37, 99, 235, 0); }
    100% { box-shadow: 0 0 0 0 rgba(37, 99, 235, 0); }
  }

  .shine-button {
    position: relative;
    overflow: hidden;
    display: inline-block;
    padding: 12px 24px;
    font-size: 14px;
    color: #ffffff;
    text-decoration: none;
    font-weight: 600;
    letter-spacing: 0.3px;
    border-radius: 8px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 4px 12px rgba(37, 99, 235, 0.25);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
  }
  .shine-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(37, 99, 235, 0.3) !important;
  }
  .shine-button::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0) 100%);
    transform: skewX(-25deg);
    animation: buttonShine 3.5s infinite cubic-bezier(0.4, 0, 0.2, 1);
  }
  @keyframes buttonShine {
    0% { left: -100%; }
    20% { left: 200%; }
    100% { left: 200%; }
  }

  /* 5. Mobile Responsive Styles */
  @media screen and (max-width: 650px) {
    .guarantee-card {
      flex-direction: column;
      padding: 25px 20px;
      gap: 20px;
      text-align: center;
    }
    .guarantee-footer {
      flex-direction: column;
      justify-content: center;
    }
    .guarantee-profile {
      justify-content: center;
    }
    .guarantee-profile-text {
      text-align: left;
    }
  }
  
    body {
    font-family: "DM Sans", "Inter", Arial, sans-serif;
    background: #ffffff;
    color: #0f172a;
  }

  .webystrata_moneyback_mini,
  .webystrata_moneyback_mini * {
    box-sizing: border-box;
  }

  .webystrata_moneyback_mini {
    width: 100%;
    background: #ffffff;
    padding: 46px 54px;
    font-family: "DM Sans", "Inter", Arial, sans-serif;
    color: #0f172a;
  }

  .webystrata_moneyback_mini_inner {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 32px;
    align-items: center;
    padding: 32px;
    border-radius: 30px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 18px 54px rgba(15, 23, 42, 0.055);
  }

  .webystrata_moneyback_mini_badge {
    width: fit-content;
    min-height: 38px;
    padding: 0 18px;
    margin-bottom: 16px;
    border-radius: 999px;
    background: rgba(7, 91, 216, 0.08);
    border: 1px solid rgba(7, 91, 216, 0.14);
    color: #075bd8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12.5px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0.55px;
    text-transform: uppercase;
  }

  .webystrata_moneyback_mini_content h2 {
    max-width: 820px;
    margin: 0;
    color: #0f172a;
    font-size: clamp(32px, 3.2vw, 52px);
    line-height: 1.02;
    font-weight: 900;
    letter-spacing: -1.9px;
  }

  .webystrata_moneyback_mini_content p {
    max-width: 850px;
    margin: 16px 0 0;
    color: #53627a;
    font-size: 16.5px;
    line-height: 1.68;
    font-weight: 500;
  }

  .webystrata_moneyback_mini_action {
    width: 100%;
    min-height: 168px;
    padding: 22px;
    border-radius: 24px;
    background: linear-gradient(135deg, #050914 0%, #071326 52%, #0b1f3a 100%);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow:
      0 24px 58px rgba(5, 9, 20, 0.22),
      inset 0 1px 0 rgba(255, 255, 255, 0.08);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .webystrata_moneyback_mini_founder span {
    display: block;
    margin-bottom: 10px;
    color: rgba(255, 255, 255, 0.62);
    font-size: 12px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0.75px;
    text-transform: uppercase;
  }

  .webystrata_moneyback_mini_founder strong {
    display: block;
    color: #ffffff;
    font-size: 21px;
    line-height: 1.15;
    font-weight: 900;
    letter-spacing: -0.65px;
  }

  .webystrata_moneyback_mini_founder p {
    margin: 6px 0 0;
    color: rgba(255, 255, 255, 0.68);
    font-size: 14.5px;
    line-height: 1.45;
    font-weight: 600;
  }

  .webystrata_moneyback_mini_btn {
    width: 100%;
    min-height: 50px;
    padding: 0 20px;
    margin-top: 22px;
    border-radius: 16px;
    background: #ffffff;
    color: #071326;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: -0.15px;
    transition: transform 0.24s ease, box-shadow 0.24s ease, background 0.24s ease;
  }

  .webystrata_moneyback_mini_btn:hover {
    transform: translateY(-3px);
    background: #f8fafc;
    color: #071326;
    box-shadow: 0 16px 34px rgba(255, 255, 255, 0.14);
  }

  @media (max-width: 980px) {
    .webystrata_moneyback_mini {
      padding: 40px 28px;
    }

    .webystrata_moneyback_mini_inner {
      grid-template-columns: 1fr;
    }

    .webystrata_moneyback_mini_action {
      max-width: 420px;
    }
  }

  @media (max-width: 640px) {
    .webystrata_moneyback_mini {
      padding: 32px 16px;
    }

    .webystrata_moneyback_mini_inner {
      padding: 24px;
      border-radius: 24px;
      gap: 24px;
    }

    .webystrata_moneyback_mini_content h2 {
      font-size: clamp(30px, 9vw, 42px);
      letter-spacing: -1.3px;
    }

    .webystrata_moneyback_mini_content p {
      font-size: 15.5px;
      line-height: 1.62;
    }

    .webystrata_moneyback_mini_action {
      max-width: none;
      min-height: auto;
      padding: 20px;
      border-radius: 20px;
    }
  }
   body {
    font-family: "DM Sans", "Inter", Arial, sans-serif;
    background: #ffffff;
    color: #0f172a;
  }

  .webystrata_migration_section,
  .webystrata_migration_section * {
    box-sizing: border-box;
  }

  .webystrata_migration_section {
    width: 100%;
    background: #ffffff;
    padding: 54px;
    font-family: "DM Sans", "Inter", Arial, sans-serif;
    color: #0f172a;
  }

  .webystrata_migration_inner {
    width: 100%;
    display: grid;
    grid-template-columns: 430px minmax(0, 1fr);
    gap: 32px;
    align-items: stretch;
  }

  .webystrata_migration_panel {
    padding: 26px;
    border-radius: 34px;
    background:
      radial-gradient(circle at top left, rgba(255, 255, 255, 0.28), transparent 34%),
      linear-gradient(135deg, #075bd8 0%, #0b72ff 52%, #004fc4 100%);
    border: 1px solid rgba(255, 255, 255, 0.22);
    box-shadow:
      0 28px 76px rgba(7, 91, 216, 0.26),
      inset 0 1px 0 rgba(255, 255, 255, 0.18);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .webystrata_migration_panel_top {
    padding: 8px 4px 22px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.22);
  }

  .webystrata_migration_panel_top span {
    display: block;
    margin-bottom: 10px;
    color: rgba(255, 255, 255, 0.76);
    font-size: 12px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0.85px;
    text-transform: uppercase;
  }

  .webystrata_migration_panel_top strong {
    display: block;
    max-width: 340px;
    color: #ffffff;
    font-size: 27px;
    line-height: 1.12;
    font-weight: 900;
    letter-spacing: -0.95px;
  }

  .webystrata_migration_features {
    display: grid;
    gap: 16px;
    margin-top: 22px;
  }

  .webystrata_migration_feature {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
    padding: 18px;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.13);
    border: 1px solid rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    transition: transform 0.24s ease, background 0.24s ease, border-color 0.24s ease;
  }

  .webystrata_migration_feature:hover {
    transform: translateY(-4px);
    background: rgba(255, 255, 255, 0.18);
    border-color: rgba(255, 255, 255, 0.28);
  }

  .webystrata_migration_icon {
    width: 54px;
    height: 54px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.24);
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .webystrata_migration_icon svg {
    width: 27px;
    height: 27px;
    fill: none;
    stroke: #ffffff;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .webystrata_migration_feature h3 {
    margin: 0 0 8px;
    color: #ffffff;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 900;
    letter-spacing: -0.45px;
  }

  .webystrata_migration_feature p {
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 14.5px;
    line-height: 1.58;
    font-weight: 500;
  }

  .webystrata_migration_content {
    min-height: 420px;
    padding: 54px;
    border-radius: 34px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 22px 70px rgba(15, 23, 42, 0.055);
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .webystrata_migration_badge {
    width: fit-content;
    min-height: 40px;
    padding: 0 18px;
    margin-bottom: 22px;
    border-radius: 999px;
    background: rgba(7, 91, 216, 0.08);
    border: 1px solid rgba(7, 91, 216, 0.14);
    color: #075bd8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12.5px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0.6px;
    text-transform: uppercase;
  }

  .webystrata_migration_content h2 {
    max-width: 900px;
    margin: 0;
    color: #0f172a;
    font-size: clamp(40px, 4.4vw, 72px);
    line-height: 0.96;
    font-weight: 900;
    letter-spacing: -2.7px;
  }

  .webystrata_migration_content p {
    max-width: 880px;
    margin: 24px 0 0;
    color: #53627a;
    font-size: 18px;
    line-height: 1.72;
    font-weight: 500;
  }

  .webystrata_migration_actions {
    margin-top: 34px;
    padding-top: 28px;
    border-top: 1px solid #e2e8f0;
    display: flex;
    align-items: center;
    gap: 26px;
    flex-wrap: wrap;
  }

  .webystrata_migration_button {
    min-height: 58px;
    padding: 0 30px;
    border-radius: 18px;
    background: #075bd8;
    color: #ffffff;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: -0.15px;
    white-space: nowrap;
    box-shadow: 0 18px 44px rgba(7, 91, 216, 0.22);
    transition: transform 0.24s ease, box-shadow 0.24s ease, background 0.24s ease;
  }

  .webystrata_migration_button:hover {
    transform: translateY(-3px);
    background: #004fc4;
    color: #ffffff;
    box-shadow: 0 22px 52px rgba(7, 91, 216, 0.3);
  }

  .webystrata_migration_timeline strong {
    display: block;
    color: #0f172a;
    font-size: 16px;
    line-height: 1.25;
    font-weight: 900;
    letter-spacing: -0.35px;
  }

  .webystrata_migration_timeline span {
    display: block;
    margin-top: 5px;
    color: #64748b;
    font-size: 14.5px;
    line-height: 1.45;
    font-weight: 600;
  }

  @media (max-width: 1080px) {
    .webystrata_migration_section {
      padding: 42px 28px;
    }

    .webystrata_migration_inner {
      grid-template-columns: 1fr;
    }

    .webystrata_migration_panel {
      order: 1;
      max-width: none;
    }

    .webystrata_migration_content {
      order: 2;
      min-height: auto;
      padding: 40px;
    }
  }

  @media (max-width: 640px) {
    .webystrata_migration_section {
      padding: 32px 16px;
    }

    .webystrata_migration_content,
    .webystrata_migration_panel {
      border-radius: 26px;
      padding: 24px;
    }

    .webystrata_migration_content h2 {
      font-size: clamp(34px, 10vw, 46px);
      line-height: 1;
      letter-spacing: -1.5px;
    }

    .webystrata_migration_content p {
      font-size: 15.8px;
      line-height: 1.66;
    }

    .webystrata_migration_actions {
      flex-direction: column;
      align-items: stretch;
      gap: 18px;
    }

    .webystrata_migration_button {
      width: 100%;
    }

    .webystrata_migration_panel_top strong {
      font-size: 23px;
    }

    .webystrata_migration_feature {
      grid-template-columns: 1fr;
      gap: 14px;
      padding: 18px;
    }

    .webystrata_migration_icon {
      width: 50px;
      height: 50px;
      border-radius: 16px;
    }
  }
  
   body {
    font-family: "DM Sans", "Inter", Arial, sans-serif;
    background: #ffffff;
    color: #0f172a;
  }

  .webystrata_cpanel_demo_section,
  .webystrata_cpanel_demo_section * {
    box-sizing: border-box;
  }

  .webystrata_cpanel_demo_section {
    width: 100%;
    background: #ffffff;
    padding: 86px 0;
    font-family: "DM Sans", "Inter", Arial, sans-serif;
    color: #0f172a;
    overflow: hidden;
  }

  .webystrata_cpanel_demo_wrap {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(560px, 0.95fr) minmax(500px, 1.05fr);
    gap: 54px;
    align-items: center;
    background: #ffffff;
  }

  .webystrata_cpanel_demo_content {
    width: 100%;
    max-width: 640px;
    background: #ffffff;
  }

  .webystrata_cpanel_demo_badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 17px;
    margin-bottom: 22px;
    border-radius: 999px;
    background: #eef5ff;
    border: 1px solid #cfe0ff;
    color: #075bd8;
    font-size: 12px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0.65px;
    text-transform: uppercase;
  }

  .webystrata_cpanel_demo_content h1 {
    margin: 0;
    max-width: 640px;
    color: #0f172a;
    font-size: clamp(40px, 3vw, 50px);
    line-height: 1.06;
    font-weight: 900;
    letter-spacing: -1.75px;
  }

  .webystrata_cpanel_demo_content h1 span {
    display: block;
    white-space: nowrap;
  }

  .webystrata_cpanel_demo_intro {
    max-width: 600px;
    margin: 22px 0 0;
    color: #53627a;
    font-size: 17px;
    line-height: 1.72;
    font-weight: 500;
    letter-spacing: -0.12px;
  }

  .webystrata_cpanel_demo_checks {
    margin-top: 28px;
    display: grid;
    gap: 13px;
  }

  .webystrata_cpanel_demo_check {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
  }

  .webystrata_cpanel_demo_check_icon {
    width: 24px;
    height: 24px;
    margin-top: 2px;
    border-radius: 50%;
    background: #eef5ff;
    border: 1px solid #cfe0ff;
    position: relative;
  }

  .webystrata_cpanel_demo_check_icon::after {
    content: "";
    position: absolute;
    left: 7px;
    top: 4px;
    width: 7px;
    height: 11px;
    border-right: 2px solid #075bd8;
    border-bottom: 2px solid #075bd8;
    transform: rotate(45deg);
  }

  .webystrata_cpanel_demo_check p {
    margin: 0;
    color: #1e293b;
    font-size: 15.8px;
    line-height: 1.55;
    font-weight: 700;
    letter-spacing: -0.12px;
  }

  .webystrata_cpanel_demo_actions {
    margin-top: 34px;
    padding-top: 28px;
    border-top: 1px solid #e2e8f0;
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
  }

  .webystrata_cpanel_demo_btn {
    min-height: 56px;
    padding: 0 30px;
    border-radius: 16px;
    background: #075bd8;
    border: 1px solid #075bd8;
    color: #ffffff;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 15.8px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: -0.12px;
    transition: background 0.22s ease, border-color 0.22s ease;
  }

  .webystrata_cpanel_demo_btn:hover {
    background: #004fc4;
    border-color: #004fc4;
    color: #ffffff;
    text-decoration: none;
  }

  .webystrata_cpanel_demo_support_note {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }

  .webystrata_cpanel_demo_support_note strong {
    color: #0f172a;
    font-size: 15px;
    line-height: 1.25;
    font-weight: 900;
    letter-spacing: -0.25px;
  }

  .webystrata_cpanel_demo_support_note span {
    color: #64748b;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 600;
  }

  .webystrata_cpanel_demo_visual {
    background: #ffffff;
    min-height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .webystrata_cpanel_demo_img {
    width: 100%;
    max-width: 850px;
    display: block;
    object-fit: contain;
    background: transparent;
    filter: none;
    box-shadow: none;
    transform: none;
    transition: none;
  }

  @media (max-width: 1200px) {
    .webystrata_cpanel_demo_wrap {
      grid-template-columns: minmax(500px, 0.9fr) minmax(460px, 1.1fr);
      gap: 42px;
    }

    .webystrata_cpanel_demo_content h1 {
      font-size: clamp(38px, 3vw, 46px);
    }
  }

  @media (max-width: 991px) {
    .webystrata_cpanel_demo_section {
      padding: 70px 0;
    }

    .webystrata_cpanel_demo_wrap {
      grid-template-columns: 1fr;
      gap: 42px;
    }

    .webystrata_cpanel_demo_content {
      max-width: 720px;
      margin: 0 auto;
      text-align: center;
    }

    .webystrata_cpanel_demo_badge,
    .webystrata_cpanel_demo_content h1,
    .webystrata_cpanel_demo_intro,
    .webystrata_cpanel_demo_checks {
      margin-left: auto;
      margin-right: auto;
    }

    .webystrata_cpanel_demo_content h1 span {
      white-space: normal;
    }

    .webystrata_cpanel_demo_check {
      text-align: left;
    }

    .webystrata_cpanel_demo_actions {
      justify-content: center;
    }

    .webystrata_cpanel_demo_visual {
      min-height: auto;
    }
  }

  @media (max-width: 640px) {
    .webystrata_cpanel_demo_section {
      padding: 54px 0;
    }

    .webystrata_cpanel_demo_content h1 {
      max-width: 100%;
      font-size: clamp(32px, 10vw, 44px);
      line-height: 1.06;
      letter-spacing: -1.4px;
    }

    .webystrata_cpanel_demo_intro {
      font-size: 15.8px;
      line-height: 1.68;
    }

    .webystrata_cpanel_demo_check p {
      font-size: 15px;
      line-height: 1.5;
    }

    .webystrata_cpanel_demo_actions {
      align-items: stretch;
      flex-direction: column;
      gap: 16px;
    }

    .webystrata_cpanel_demo_btn {
      width: 100%;
    }

    .webystrata_cpanel_demo_support_note {
      text-align: center;
    }

    .webystrata_cpanel_demo_img {
      max-width: 100%;
    }
  }
  
  html,
body,
.site-wrapper,
.coodiv-clouds-theme {
    overflow-x: clip !important;
    overflow-y: visible !important;
}

:root {
    --ws-primary: #0b63ff;
    --ws-primary-dark: #0647bf;
    --ws-cyan: #06b6d4;
    --ws-bg-main: #ffffff;
    --ws-bg-soft: #f6f9ff;
    --ws-text-ink: #07111f;
    --ws-text-slate: #5c6b82;
    --ws-text-muted: #7b8aa1;
    --ws-border: rgba(15, 23, 42, 0.10);
    --ws-card: #ffffff;
}

.ws-sticky-section,
.ws-sticky-section * {
    box-sizing: border-box;
}

.ws-sticky-section {
    position: relative;
    z-index: 5;
    padding: 110px 20px;
    background: #ffffff !important;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    overflow: visible !important;
}

.ws-sticky-section::before,
.ws-sticky-section::after {
    display: none !important;
}

.ws-sticky-main-header {
    max-width: 850px;
    margin: 0 auto 72px;
    text-align: center;
}

.ws-main-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 16px;
    margin-bottom: 20px;
    border-radius: 999px;
    background: rgba(11, 99, 255, 0.08);
    border: 1px solid rgba(11, 99, 255, 0.14);
    color: var(--ws-primary);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.8px;
}

.ws-main-title {
    margin: 0 0 18px;
    color: var(--ws-text-ink);
    font-size: 50px;
    line-height: 1.08;
    font-weight: 950;
    letter-spacing: -1.5px;
}

.ws-text-gradient {
    background: linear-gradient(135deg, var(--ws-primary) 0%, var(--ws-cyan) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.ws-main-subtitle {
    max-width: 760px;
    margin: 0 auto;
    color: var(--ws-text-slate);
    font-size: 18px;
    line-height: 1.75;
    font-weight: 500;
}

.ws-sticky-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    display: grid !important;
    grid-template-columns: minmax(360px, 0.95fr) minmax(0, 1.05fr);
    gap: 70px;
    align-items: flex-start !important;
    position: relative;
    overflow: visible !important;
}

.ws-sticky-visuals {
    position: sticky !important;
    top: 110px !important;
    align-self: flex-start !important;
    height: calc(100vh - 150px);
    max-height: 620px;
    min-height: 520px;
    border-radius: 30px;
    background: #07111f;
    border: 1px solid rgba(11, 99, 255, 0.16);
    box-shadow: 0 30px 80px rgba(11, 28, 61, 0.16);
    overflow: hidden;
    z-index: 10;
}

.ws-visual-glow {
    position: absolute;
    inset: auto -90px -90px auto;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: rgba(11, 99, 255, 0.28);
    filter: blur(22px);
    z-index: 2;
    pointer-events: none;
}

.ws-sticky-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    opacity: 0.96;
    transform: scale(1.01);
    transition: transform 0.8s ease, opacity 0.4s ease;
}

.ws-sticky-visuals:hover .ws-sticky-image {
    transform: scale(1.05);
    opacity: 1;
}

.ws-sticky-visuals::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(7, 17, 31, 0.02) 0%, rgba(7, 17, 31, 0.34) 100%),
        radial-gradient(circle at 30% 10%, rgba(11, 99, 255, 0.10), transparent 34%);
    pointer-events: none;
    z-index: 1;
}

.ws-image-clean-badge {
    position: absolute;
    left: 24px;
    bottom: 24px;
    z-index: 4;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 38px;
    padding: 0 15px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.22);
    color: #ffffff;
    font-size: 12.5px;
    font-weight: 850;
    letter-spacing: 0.2px;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.ws-image-clean-badge span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 0 6px rgba(34, 197, 94, 0.16);
}

.ws-scrolling-content {
    display: flex;
    flex-direction: column;
    gap: 22px;
    padding-bottom: 12vh;
}

.ws-scroll-item {
    position: relative;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 22px;
    padding: 34px 0 38px;
    border-bottom: 1px solid rgba(15, 23, 42, 0.10);
    transition: transform 0.28s ease, opacity 0.28s ease;
}

.ws-scroll-item:first-child {
    padding-top: 8px;
}

.ws-scroll-item:last-child {
    border-bottom: none;
}

.ws-scroll-item:hover {
    transform: translateX(8px);
}

.ws-item-number {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    background: #eef5ff;
    border: 1px solid rgba(11, 99, 255, 0.12);
    color: var(--ws-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 950;
    transition: all 0.25s ease;
}

.ws-scroll-item:hover .ws-item-number {
    background: var(--ws-primary);
    color: #ffffff;
    box-shadow: 0 14px 28px rgba(11, 99, 255, 0.20);
}

.ws-item-title {
    position: relative;
    display: inline-block;
    margin: 0 0 16px;
    padding-bottom: 13px;
    color: var(--ws-text-ink);
    font-size: 34px;
    line-height: 1.16;
    font-weight: 950;
    letter-spacing: -0.8px;
}

.ws-item-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 58px;
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--ws-primary), var(--ws-cyan));
    transition: width 0.35s ease;
}

.ws-scroll-item:hover .ws-item-title::after {
    width: 100%;
}

.ws-item-desc {
    max-width: 620px;
    margin: 0 0 24px;
    color: var(--ws-text-slate);
    font-size: 16px;
    line-height: 1.76;
    font-weight: 500;
}

.ws-item-features {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 13px;
}

.ws-item-features li {
    display: flex;
    align-items: center;
    gap: 13px;
    color: var(--ws-text-ink);
    font-size: 15.5px;
    line-height: 1.45;
    font-weight: 750;
}

.ws-item-check {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    border-radius: 50%;
    background: #eef5ff;
    color: var(--ws-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.25s ease;
}

.ws-item-check svg {
    width: 15px;
    height: 15px;
    stroke: currentColor;
    stroke-width: 3;
    fill: none;
}

.ws-scroll-item:hover .ws-item-check {
    background: var(--ws-primary);
    color: #ffffff;
    box-shadow: 0 10px 22px rgba(11, 99, 255, 0.18);
}

@media (max-width: 1199px) {
    .ws-sticky-container {
        gap: 44px;
        grid-template-columns: minmax(330px, 0.9fr) minmax(0, 1.1fr);
    }

    .ws-main-title {
        font-size: 42px;
    }

    .ws-item-title {
        font-size: 30px;
    }
}

@media (max-width: 992px) {
    .ws-sticky-section {
        padding: 82px 18px;
    }

    .ws-sticky-main-header {
        margin-bottom: 42px;
    }

    .ws-main-title {
        font-size: 36px;
    }

    .ws-main-subtitle {
        font-size: 16px;
    }

    .ws-sticky-container {
        display: grid !important;
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .ws-sticky-visuals {
        position: relative !important;
        top: auto !important;
        width: 100%;
        height: 430px;
        min-height: auto;
        max-height: none;
    }

    .ws-scrolling-content {
        padding-bottom: 0;
        gap: 16px;
    }

    .ws-scroll-item {
        padding: 26px 0;
    }

    .ws-scroll-item:first-child {
        padding-top: 0;
    }

    .ws-scroll-item:hover {
        transform: none;
    }
}

@media (max-width: 767px) {
    .ws-sticky-section {
        padding: 68px 16px;
    }

    .ws-sticky-main-header {
        text-align: left;
        margin-bottom: 32px;
    }

    .ws-main-badge {
        font-size: 11px;
        min-height: 32px;
        padding: 0 13px;
    }

    .ws-main-title {
        font-size: 31px;
        line-height: 1.14;
        letter-spacing: -0.8px;
    }

    .ws-main-subtitle {
        font-size: 15px;
        line-height: 1.7;
    }

    .ws-sticky-visuals {
        height: 390px;
        border-radius: 24px;
    }

    .ws-image-clean-badge {
        left: 18px;
        bottom: 18px;
        min-height: 36px;
        padding: 0 13px;
        font-size: 12px;
    }

    .ws-scroll-item {
        grid-template-columns: 1fr;
        gap: 14px;
        padding: 24px 0;
    }

    .ws-item-number {
        width: 42px;
        height: 42px;
        border-radius: 14px;
    }

    .ws-item-title {
        font-size: 25px;
        margin-bottom: 14px;
    }

    .ws-item-desc {
        font-size: 14.5px;
        line-height: 1.7;
        margin-bottom: 20px;
    }

    .ws-item-features li {
        font-size: 14.2px;
    }
}

@media (max-width: 420px) {
    .ws-sticky-section {
        padding-left: 14px;
        padding-right: 14px;
    }

    .ws-sticky-visuals {
        height: 360px;
    }
}
.ws-secure-hosting-block,
.ws-secure-hosting-block * {
    box-sizing: border-box;
}

.ws-secure-hosting-block {
    position: relative;
    padding: 90px 18px;
    background: #ffffff !important;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    overflow: hidden;
}

.ws-secure-hosting-wrap {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
}

.ws-secure-hosting-header {
    max-width: 820px;
    margin: 0 auto 46px;
    text-align: center;
}

.ws-secure-hosting-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 14px;
    margin-bottom: 16px;
    border-radius: 999px;
    background: rgba(11, 99, 255, 0.08);
    border: 1px solid rgba(11, 99, 255, 0.14);
    color: #0b63ff;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.7px;
}

.ws-secure-hosting-header h2 {
    margin: 0 0 16px;
    color: #07111f;
    font-size: 42px;
    line-height: 1.15;
    font-weight: 900;
    letter-spacing: -1px;
}

.ws-secure-hosting-header p {
    margin: 0;
    color: #52627a;
    font-size: 17px;
    line-height: 1.75;
    font-weight: 500;
}

.ws-secure-hosting-layout {
    display: grid;
    grid-template-columns: 0.95fr 1.55fr;
    gap: 24px;
    align-items: stretch;
}

.ws-secure-hosting-main-card {
    height: 100%;
    min-height: 500px;
    padding: 38px;
    border-radius: 30px;
    background:
        radial-gradient(circle at top right, rgba(62, 139, 255, 0.24), transparent 35%),
        linear-gradient(145deg, #07111f 0%, #0b1730 100%);
    color: #ffffff;
    position: relative;
    overflow: hidden;
    box-shadow: 0 24px 70px rgba(9, 22, 43, 0.18);
}

.ws-secure-hosting-main-card::after {
    content: "";
    position: absolute;
    right: -120px;
    bottom: -120px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: rgba(11, 99, 255, 0.22);
}

.ws-main-icon {
    width: 68px;
    height: 68px;
    border-radius: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0b63ff;
    color: #ffffff;
    margin-bottom: 28px;
    box-shadow: 0 18px 36px rgba(11, 99, 255, 0.28);
    position: relative;
    z-index: 2;
}

.ws-main-icon svg {
    width: 34px;
    height: 34px;
}

.ws-secure-hosting-main-card h3 {
    position: relative;
    z-index: 2;
    margin: 0 0 16px;
    color: #ffffff;
    font-size: 32px;
    line-height: 1.22;
    font-weight: 900;
    letter-spacing: -0.6px;
}

.ws-secure-hosting-main-card p {
    position: relative;
    z-index: 2;
    margin: 0;
    color: rgba(226, 236, 250, 0.82);
    font-size: 16px;
    line-height: 1.78;
    font-weight: 500;
}

.ws-main-points {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}

.ws-main-points span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.09);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.88);
    font-size: 12.5px;
    font-weight: 700;
}

.ws-secure-hosting-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.ws-secure-hosting-item {
    display: flex;
    gap: 18px;
    align-items: flex-start;
    min-height: 154px;
    padding: 24px;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 12px 34px rgba(15, 23, 42, 0.045);
    transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.ws-secure-hosting-item:hover {
    transform: translateY(-4px);
    border-color: rgba(11, 99, 255, 0.22);
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.085);
}

.ws-item-icon {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #eef5ff;
    color: #0b63ff;
}

.ws-item-icon svg {
    width: 25px;
    height: 25px;
}

.ws-secure-hosting-item h3 {
    margin: 0 0 8px;
    color: #07111f;
    font-size: 19px;
    line-height: 1.25;
    font-weight: 850;
    letter-spacing: -0.2px;
}

.ws-secure-hosting-item p {
    margin: 0;
    color: #53637a;
    font-size: 14.5px;
    line-height: 1.65;
    font-weight: 500;
}

@media (max-width: 1199px) {
    .ws-secure-hosting-layout {
        grid-template-columns: 1fr;
    }

    .ws-secure-hosting-main-card {
        min-height: auto;
    }

    .ws-secure-hosting-header h2 {
        font-size: 36px;
    }
}

@media (max-width: 767px) {
    .ws-secure-hosting-block {
        padding: 68px 16px;
    }

    .ws-secure-hosting-header {
        margin-bottom: 32px;
        text-align: left;
    }

    .ws-secure-hosting-header h2 {
        font-size: 30px;
        line-height: 1.18;
        letter-spacing: -0.5px;
    }

    .ws-secure-hosting-header p {
        font-size: 15px;
        line-height: 1.7;
    }

    .ws-secure-hosting-main-card {
        padding: 28px 22px;
        border-radius: 24px;
    }

    .ws-main-icon {
        width: 58px;
        height: 58px;
        border-radius: 18px;
        margin-bottom: 22px;
    }

    .ws-main-icon svg {
        width: 29px;
        height: 29px;
    }

    .ws-secure-hosting-main-card h3 {
        font-size: 25px;
    }

    .ws-secure-hosting-main-card p {
        font-size: 14.5px;
        line-height: 1.7;
    }

    .ws-secure-hosting-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .ws-secure-hosting-item {
        min-height: auto;
        padding: 20px;
        border-radius: 20px;
        gap: 14px;
    }

    .ws-item-icon {
        width: 44px;
        height: 44px;
        flex-basis: 44px;
        border-radius: 14px;
    }

    .ws-item-icon svg {
        width: 23px;
        height: 23px;
    }

    .ws-secure-hosting-item h3 {
        font-size: 17px;
    }

    .ws-secure-hosting-item p {
        font-size: 13.8px;
    }
}

@media (max-width: 420px) {
    .ws-secure-hosting-block {
        padding-left: 14px;
        padding-right: 14px;
    }

    .ws-secure-hosting-main-card {
        padding: 24px 20px;
    }

    .ws-main-points {
        gap: 8px;
    }

    .ws-main-points span {
        font-size: 12px;
    }
}
  body {
    font-family: "DM Sans", "Inter", Arial, sans-serif;
    background: #ffffff;
    color: #0f172a;
  }

  .webystrata_homecare_section,
  .webystrata_homecare_section * {
    box-sizing: border-box;
  }

  .webystrata_homecare_section {
    width: 100%;
    background: #ffffff;
    padding: 82px 0;
    font-family: "DM Sans", "Inter", Arial, sans-serif;
    color: #0f172a;
    overflow: hidden;
  }

  .webystrata_homecare_container {
    width: 100%;
    max-width: 1420px;
    margin: 0 auto;
    padding: 0 42px;
  }

  .webystrata_homecare_wrap {
    display: grid;
    grid-template-columns: minmax(360px, 0.78fr) minmax(0, 1.22fr);
    gap: 32px;
    align-items: stretch;
  }

  .webystrata_homecare_panel {
    min-height: 620px;
    padding: 46px;
    border-radius: 36px;
    background: #075bd8;
    color: #ffffff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    overflow: hidden;
  }

  .webystrata_homecare_panel::before {
    content: "";
    position: absolute;
    width: 340px;
    height: 340px;
    right: -150px;
    top: -130px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.16);
  }

  .webystrata_homecare_panel::after {
    content: "";
    position: absolute;
    width: 240px;
    height: 240px;
    left: -120px;
    bottom: -120px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.10);
  }

  .webystrata_homecare_badge {
    position: relative;
    z-index: 2;
    width: fit-content;
    min-height: 40px;
    padding: 0 18px;
    margin-bottom: 28px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.28);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12.5px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0.65px;
    text-transform: uppercase;
  }

  .webystrata_homecare_panel h2 {
    position: relative;
    z-index: 2;
    max-width: 520px;
    margin: 0;
    color: #ffffff;
    font-size: clamp(42px, 4vw, 66px);
    line-height: 0.98;
    font-weight: 900;
    letter-spacing: -2.65px;
  }

  .webystrata_homecare_panel p {
    position: relative;
    z-index: 2;
    max-width: 500px;
    margin: 24px 0 0;
    color: rgba(255, 255, 255, 0.84);
    font-size: 17px;
    line-height: 1.72;
    font-weight: 500;
    letter-spacing: -0.12px;
  }

  .webystrata_homecare_status {
    position: relative;
    z-index: 2;
    margin-top: 38px;
    padding-top: 30px;
    border-top: 1px solid rgba(255, 255, 255, 0.24);
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  .webystrata_homecare_status div {
    padding: 22px;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.22);
  }

  .webystrata_homecare_status span {
    display: block;
    color: rgba(255, 255, 255, 0.72);
    font-size: 13.5px;
    line-height: 1.2;
    font-weight: 800;
    margin-bottom: 9px;
  }

  .webystrata_homecare_status strong {
    display: block;
    color: #ffffff;
    font-size: 29px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: -0.9px;
  }

  .webystrata_homecare_services {
    display: grid;
    gap: 18px;
  }

  .webystrata_homecare_service {
    min-height: 194px;
    padding: 32px;
    border-radius: 30px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 18px 54px rgba(15, 23, 42, 0.06);
    display: grid;
    grid-template-columns: 84px minmax(0, 1fr);
    gap: 26px;
    align-items: start;
    transition: border-color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
  }

  .webystrata_homecare_service:hover {
    transform: translateY(-3px);
    border-color: #cfe0ff;
    box-shadow: 0 24px 64px rgba(15, 23, 42, 0.09);
  }

  .webystrata_homecare_number {
    width: 64px;
    height: 64px;
    border-radius: 22px;
    background: #eef5ff;
    border: 1px solid #cfe0ff;
    color: #075bd8;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: -0.65px;
  }

  .webystrata_homecare_content h3 {
    margin: 0;
    color: #0f172a;
    font-size: clamp(26px, 2vw, 34px);
    line-height: 1.12;
    font-weight: 900;
    letter-spacing: -1.05px;
  }

  .webystrata_homecare_content p {
    max-width: 790px;
    margin: 14px 0 0;
    color: #53627a;
    font-size: 16.2px;
    line-height: 1.68;
    font-weight: 500;
    letter-spacing: -0.12px;
  }

  @media (max-width: 1080px) {
    .webystrata_homecare_section {
      padding: 70px 0;
    }

    .webystrata_homecare_container {
      padding: 0 28px;
    }

    .webystrata_homecare_wrap {
      grid-template-columns: 1fr;
    }

    .webystrata_homecare_panel {
      min-height: auto;
    }
  }

  @media (max-width: 640px) {
    .webystrata_homecare_section {
      padding: 54px 0;
    }

    .webystrata_homecare_container {
      padding: 0 16px;
    }

    .webystrata_homecare_panel {
      padding: 28px;
      border-radius: 26px;
    }

    .webystrata_homecare_panel h2 {
      font-size: clamp(36px, 11vw, 50px);
      line-height: 1.02;
      letter-spacing: -1.8px;
    }

    .webystrata_homecare_panel p {
      font-size: 15.6px;
      line-height: 1.66;
    }

    .webystrata_homecare_status {
      grid-template-columns: 1fr;
      gap: 12px;
    }

    .webystrata_homecare_service {
      grid-template-columns: 1fr;
      padding: 26px;
      border-radius: 24px;
      gap: 20px;
    }

    .webystrata_homecare_number {
      width: 58px;
      height: 58px;
      border-radius: 20px;
      font-size: 21px;
    }

    .webystrata_homecare_content h3 {
      font-size: 24px;
      line-height: 1.15;
      letter-spacing: -0.75px;
    }

    .webystrata_homecare_content p {
      font-size: 15.3px;
      line-height: 1.62;
    }
  }