/* ===== Combined CSS from inline <css> tags. Generated by assistant. ===== */

/* ---- CSS Block #1 ---- */
body {
      margin: 0;
      font-family: 'Inter', sans-serif;
      background-color: #ffffff;
      color: #222;
      line-height: 1.6;
    }

    a {
      text-decoration: none;
      color: inherit;
    }

   
    /* --- NAVIGATION --- */
   /* === MODERN NAVIGATION MENU CSS === */
.main-nav {
  background: #007b8a;
  padding: 0 20px;
  position: relative;
  z-index: 10;
}

.menu-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: transparent;
  border: none;
  cursor: pointer;
  margin-left: auto;
}
.menu-toggle span {
  display: block;
  height: 4px;
  width: 28px;
  background: #fff;
  margin: 5px 0;
  border-radius: 2px;
  transition: 0.4s;
}

/* Hamburger active animation */
.menu-toggle.active span:nth-child(1) { transform: translateY(9px) rotate(45deg);}
.menu-toggle.active span:nth-child(2) { opacity: 0;}
.menu-toggle.active span:nth-child(3) { transform: translateY(-9px) rotate(-45deg);}

.nav-list {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 22px;
  margin: 0;
  padding: 0;
  transition: max-height 0.3s;
}

.nav-list li {
  position: relative;
}

.nav-list li a {
  color: #fff;
  font-weight: 500;
  padding: 16px 10px;
  font-size: 1rem;
  display: flex;
  align-items: center;
  transition: color 0.25s;
}
.nav-list li a:hover,
.nav-list li a:focus {
  color: #ffe082;
  outline: none;
}

/* Dropdowns */
.has-dropdown > a i {
  margin-left: 5px;
}
.has-dropdown .dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 190px;
  background: #008fa1;
  border-radius: 0 0 8px 8px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
  display: none;
  flex-direction: column;
  z-index: 11;
  padding: 8px 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s;
}
.has-dropdown.open .dropdown {
  display: flex;
  opacity: 1;
  pointer-events: auto;
}
.has-dropdown .dropdown li a {
  padding: 10px 18px;
  color: #fff;
  font-size: 0.98rem;
}
.has-dropdown .dropdown li a:hover {
  background: #006f81;
  color: #ffe082;
}

.cta-button {
  background: #00bfa5;
  color: #007b8a;
  padding: 8px 16px;
  border-radius: 22px;
  font-weight: 600;
  margin-left: 5px;
  transition: background 0.3s;
  border: none;
}
.cta-button:hover, .cta-button:focus {
  background: #039be5;
  color: #007b8a;
}

/* Responsive for mobile/tablet */
@media (max-width: 1024px) {
  .nav-list {
    gap: 14px;
  }
}
@media (max-width: 850px) {
  .nav-list {
    gap: 4px;
    font-size: 0.96rem;
  }
  .nav-list li a,
  .cta-button {
    padding: 14px 8px;
  }
}
@media (max-width: 768px) {
  .main-nav {
    padding: 0;
  }
  .menu-toggle {
    display: flex;
  }
  .nav-list {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100vw;
    flex-direction: column;
    background: #007b8a;
    max-height: 0;
    overflow: hidden;
    gap: 0;
    box-shadow: 0 10px 32px rgba(0,0,0,0.13);
    border-radius: 0 0 14px 14px;
    z-index: 99;
    transition: max-height 0.4s cubic-bezier(0.77,0,0.18,1);
  }
  .main-nav.active .nav-list {
    max-height: 800px;
    transition: max-height 0.6s;
  }
  .nav-list li {
    width: 100%;
  }
  .nav-list li a {
    width: 100%;
    justify-content: flex-start;
    padding: 18px 20px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
  }
  .has-dropdown .dropdown {
    position: static;
    background: #009bb0;
    border-radius: 0 0 12px 12px;
    box-shadow: none;
    min-width: unset;
    width: 100%;
    padding: 0;
  }
  .has-dropdown .dropdown li a {
    padding-left: 36px;
    font-size: 0.98rem;
  }
}

    
   
   
   
   
   
   
   
   
/* ========== WHO NEEDS CERTIFIED TRANSLATION ========== */

.who-needs {
  background: #f8f9fb;
  padding: 60px 20px;
}

.who-needs .section-header {
  text-align: center;
  margin-bottom: 40px;
}

.who-needs .section-header h2 {
  font-size: 32px;
  margin-bottom: 10px;
  color: #222;
  font-weight: 700;
}

.who-needs .section-header p {
  font-size: 18px;
  color: #555;
  max-width: 700px;
  margin: 0 auto;
}

.grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 25px;
}

.need-card {
  background: #fff;
  border-radius: 15px;
  padding: 25px 20px;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.08);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border-left: 6px solid #1976d2;
}

.need-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.12);
}

.need-card .icon {
  font-size: 36px;
  margin-bottom: 15px;
}

.need-card h3 {
  font-size: 20px;
  color: #333;
  margin-bottom: 10px;
}

.need-card p {
  font-size: 16px;
  color: #444;
  line-height: 1.5;
  margin-bottom: 10px;
}

.need-card p strong {
  font-weight: 600;
  color: #222;
}

.tick {
  color: #43a047;
  font-weight: bold;
  margin-right: 6px;
}

/* Mobile adjustments */
@media (max-width: 480px) {
  .who-needs {
    padding: 40px 15px;
  }

  .who-needs .section-header h2 {
    font-size: 26px;
  }

  .need-card {
    padding: 20px 15px;
  }

  .need-card h3 {
    font-size: 18px;
  }

  .need-card p {
    font-size: 15px;
  }
}
    
    
.need-card {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease, transform 0.8s ease;
  will-change: opacity, transform;
}

.need-card.fade-in {
  opacity: 1;
  transform: translateY(0);
}

    
  /* ========== ABOUT PROZ WORLD + WHAT SETS US APART START ========== */

.about-unique-section {
  padding: 80px 20px;
  background: #f4faff;
  font-family: 'Segoe UI', sans-serif;
}

.about-split {
  display: flex;
  flex-wrap: wrap;
  max-width: 1200px;
  margin: auto;
  gap: 40px;
  align-items: flex-start;
}

.about-left, .about-right {
  flex: 1 1 500px;
  min-width: 300px;
}

.section-title-left,
.section-title-right {
  font-size: 26px;
  margin-bottom: 20px;
  font-weight: 700;
  color: #222;
  border-left: 5px solid #1976D2;
  padding-left: 15px;
}

.about-desc {
  font-size: 16px;
  line-height: 1.8;
  color: #333;
}

.highlights-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
  margin-top: 20px;
}

.highlight-card {
  background: #fff;
  padding: 20px 25px;
  border-radius: 12px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.08);
  transition: all 0.3s ease;
  display: flex;
  align-items: flex-start;
  gap: 15px;
  opacity: 0;
  transform: translateY(30px);
}

.highlight-card .icon {
  font-size: 28px;
  line-height: 1;
}

.highlight-card p {
  margin: 0;
  font-size: 15px;
  color: #222;
}

.highlight-card:hover {
  box-shadow: 0 6px 20px rgba(0,0,0,0.12);
  transform: translateY(0px);
}

/* Fade-in on scroll */
.fade-in-left {
  opacity: 0;
  transform: translateX(-50px);
  transition: all 0.6s ease;
}
.fade-in-stagger .highlight-card {
  transition-delay: var(--delay, 0s);
}

/* Activated on scroll */
.in-view {
  opacity: 1 !important;
  transform: none !important;
}

/* Responsive stacking */
@media (max-width: 768px) {
  .about-split {
    flex-direction: column;
  }
}
  
    
    
 /* ========== HOW IT WORKS – THE PROZWORLD WAY STYLES ========== */

.how-it-works {
  background: #f7faff;
  padding: 60px 20px;
  text-align: center;
}

.how-it-works .section-header h2 {
  font-size: 32px;
  color: #1a237e;
  margin-bottom: 10px;
}

.how-it-works .section-header p {
  font-size: 18px;
  color: #455a64;
  margin-bottom: 40px;
}

.steps-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 30px;
}

.step-card {
  background: #ffffff;
  border-radius: 12px;
  padding: 25px;
  width: 220px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  transition: transform 0.3s ease;
  opacity: 0;
  transform: translateY(40px);
}

.step-card img {
  margin-bottom: 15px;
}

.step-card h3 {
  font-size: 18px;
  color: #0d47a1;
  margin-bottom: 10px;
}

.step-card p {
  font-size: 15px;
  color: #455a64;
}

.step-card:hover {
  transform: translateY(-5px);
}

.note-box {
  margin-top: 40px;
  background: #fff3e0;
  border-left: 6px solid #fb8c00;
  padding: 20px;
  font-size: 16px;
  color: #e65100;
  text-align: left;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 8px;
}

/* Fade-in animation */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
   
    
 /* ========== FINAL CALL-TO-ACTION SECTION STYLE ========== */
.final-cta {
  background: linear-gradient(135deg, #f3f3f3, #ffffff);
  padding: 60px 20px;
  text-align: center;
  border-top: 2px solid #eee;
}

.final-cta h2 {
  font-size: 30px;
  color: #222;
  margin-bottom: 20px;
  font-weight: 700;
}

.final-cta p {
  font-size: 18px;
  color: #444;
  margin-bottom: 25px;
}

.cta-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 15px;
  margin-bottom: 20px;
}

.cta-btn {
  padding: 14px 26px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  color: white;
  text-decoration: none;
  transition: 0.3s ease;
  box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.cta-btn.green {
  background: #43A047;
}

.cta-btn.green:hover {
  background: #388E3C;
}

.cta-btn.blue {
  background: #1E88E5;
}

.cta-btn.blue:hover {
  background: #1565C0;
}

.cta-btn.orange {
  background: #FB8C00;
}

.cta-btn.orange:hover {
  background: #EF6C00;
}

.final-cta .assurance {
  font-size: 16px;
  font-style: italic;
  color: #666;
  margin-top: 10px;
}
  
  
  
  
  /* ---------- PEACE OF MIND SECTION ---------- */
.peace-section {
  background: #f4f8fd;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 60px 10%;
  gap: 40px;
}

.peace-left {
  flex: 1 1 45%;
  min-width: 300px;
}

.peace-title {
  font-size: 28px;
  font-weight: 700;
  color: #222;
  margin-bottom: 20px;
}

.peace-subtext {
  font-size: 18px;
  color: #555;
  line-height: 1.6;
  margin-bottom: 30px;
}

.peace-points {
  list-style: none;
  padding: 0;
  font-size: 17px;
  color: #222;
}

.peace-points li {
  margin-bottom: 15px;
  display: flex;
  align-items: start;
  line-height: 1.5;
}

.peace-points .tick {
  color: #43a047;
  font-weight: bold;
  margin-right: 10px;
  font-size: 18px;
}

/* Right side icon cards */
.peace-icons {
  flex: 1 1 45%;
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: flex-start;
  align-items: flex-start;
}

.peace-icon-box {
  width: 120px;
  text-align: center;
  color: #333;
  font-size: 14px;
}

.peace-icon-box img {
  width: 60px;
  height: 60px;
  object-fit: contain;
  margin-bottom: 10px;
}

.peace-icon-box p {
  font-weight: 500;
  font-size: 14px;
  line-height: 1.3;
}

/* Responsive */
@media (max-width: 768px) {
  .peace-section {
    flex-direction: column;
    padding: 40px 20px;
  }

  .peace-icons {
    justify-content: center;
  }

  .peace-icon-box {
    width: 100px;
  }
}
   /* ---------- PEACE OF MIND SECTION END---------- */

 
 




/* ========== FOOTER CSS START ========== */
footer {
  background: #357888;
  color: #eee;
  padding: 40px 20px;
  font-family: 'Segoe UI', sans-serif;
}

footer h3 {
  color: #fff;
  margin-bottom: 10px;
  font-size: 18px;
  border-bottom: 1px solid rgba(255,255,255,0.3);
  padding-bottom: 5px;
}

footer p, footer li, footer a, footer select, footer option {
  font-size: 14px;
}

footer a {
  color: #eee;
  text-decoration: none;
  transition: color 0.3s ease;
}

footer a:hover {
  color: #ffd166; /* golden yellow hover */
}

footer ul {
  list-style: none;
  padding: 0;
}

footer select {
  padding: 10px;
  border: none;
  border-radius: 4px;
}

footer img {
  max-width: 150px;
}

footer button {
  background: #004e64;
  color: #fff;
  border: none;
  border-radius: 5px;
  padding: 10px 20px;
  cursor: pointer;
  transition: background 0.3s ease;
}

footer button:hover {
  background: #ffd166;
  color: #333;
}

footer div button:hover {
  transform: translateY(-2px);
}

/* Responsive Footer Columns */
@media (max-width: 768px) {
  footer div {
    flex: 1 1 100%;
  }
}

/* Social Media Links */
footer div a {
  display: inline-block;
  margin: 0 8px;
  font-size: 16px;
}

/* Footer Bottom Text */
footer > div:last-child {
  margin-top: 20px;
  font-size: 12px;
  color: #ccc;
}



/* City Select Modern Styling */
.city-select-wrapper {
  position: relative;
}

.city-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: #fff url('data:image/svg+xml;utf8,<svg fill="%23357888" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>') no-repeat right 10px center;
  background-size: 16px;
  border: 2px solid #357888;
  border-radius: 5px;
  padding: 10px 40px 10px 10px;
  width: 100%;
  font-size: 14px;
  color: #333;
  cursor: pointer;
}

.city-select:focus {
  outline: none;
  border-color: #ffd166; /* golden yellow focus */
}

.city-select option {
  background: #fff;
  color: #333;
}

/* ========== FOOTER CSS END ========== */

/* ========== THE EXPERTISE BEHIND PROZWORLD CSS START ========== */

section h2 {
  font-family: 'Segoe UI', sans-serif;
}

section div p {
  font-family: 'Segoe UI', sans-serif;
}

/* Grid Card Hover Animation */
section div div div:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 16px rgba(0,0,0,0.2);
}

/* Smooth fade-in animation */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

section {
  animation: fadeInUp 1s ease both;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  section div {
    flex: 1 1 100%;
  }
  section h2 {
    text-align: center;
  }
  section div a {
    display: block;
    text-align: center;
  }
}

/* Button hover effect */
section a:hover {
  background: #fcca46; /* slightly lighter golden yellow on hover */
}

/* ========== THE EXPERTISE BEHIND PROZWORLD CSS END ========== */
/* ---- End Block #{i} ---- */

/* ---- CSS Block #2 ---- */
@keyframes fadeSlideUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
  }
  @keyframes pulse {
    0% { box-shadow: 0 0 0 0 rgba(0,191,165, 0.7); }
    70% { box-shadow: 0 0 0 10px rgba(0,191,165, 0); }
    100% { box-shadow: 0 0 0 0 rgba(0,191,165, 0); }
  }
/* ---- End Block #{i} ---- */

/* ---- CSS Block #3 ---- */
.prozcall-modal-overlay {
  display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  z-index: 40000; background: rgba(8,34,58,0.38);
  align-items: center; justify-content: center;
}
.prozcall-modal-overlay.open {display: flex;}
.prozcall-modal {
  background: #fff;
  border-radius: 18px;
  width: 98vw;
  max-width: 410px;
  min-width: 0;
  padding: 30px 7px 22px 7px;
  box-shadow: 0 12px 48px 0 rgba(43,166,184,0.16), 0 2px 14px 0 rgba(23,199,184,0.10);
  position: relative;
  margin: 0 auto;
  max-height: 92vh;       /* NEW: prevents overflow */
  display: flex;          /* NEW: allows content to scroll */
  flex-direction: column; /* NEW: vertical stacking */
}
.prozcall-modal-content {
  overflow-y: auto;
  overflow-x: hidden;
  flex: 1 1 auto;
  padding-bottom: 10px;
}
.prozcall-close {position:absolute;top:13px;right:16px;font-size:2rem;background:none;border:none;color:#1976d2;cursor:pointer;z-index:2;}
.prozcall-modal h2 {font-size:1.32rem;font-weight:800;color:#183d5e;text-align:center;margin-bottom:16px;}
.prozcall-group {margin-bottom: 13px; width: 100%;}
.prozcall-group label {font-weight: 600; font-size: 1rem; color: #1976d2; margin-bottom: 6px; display: block;}
.prozcall-group input,
.prozcall-group select,
.prozcall-group textarea {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 12px 13px; border: 1.2px solid #d0f4ff; border-radius: 8px;
  font-size: 1rem; background: #f8fdff; color: #20303c; transition: border .22s;
  outline: none; font-weight: 500; display: block; margin: 0;
}
.prozcall-group input:focus,
.prozcall-group select:focus,
.prozcall-group textarea:focus {border-color: #00bfa5; background: #f4fdfb;}
.prozcall-group textarea {
  min-height: 68px;
  max-height: 120px;
  resize: vertical;
  overflow-y: auto;
}
.prozcall-flex {display: flex; gap: 7px;}
.prozcall-flex > div {flex: 1;}
.prozcall-submit {
  width:100%;padding:13px 0;border-radius:9px;border:none;
  background:linear-gradient(90deg,#00bfa5 90%,#008fa1 100%);
  color:#fff;font-size:1.08rem;font-weight:700;cursor:pointer;transition:background .2s, transform .16s;
  box-shadow:0 3px 12px rgba(0,191,165,0.07);
  margin-bottom: 4px;
}
.prozcall-submit:hover,.prozcall-submit:focus{
  background:linear-gradient(90deg,#008fa1 90%,#00bfa5 100%);
  transform:translateY(-2px) scale(1.03);
}
.prozcall-success {
  background: #e0fce7; color: #14813e; padding: 12px 7px; border-radius: 8px;
  font-weight: 700; text-align: center; font-size: 1rem; margin-top: 12px;
}
@media (max-width: 480px) {
  .prozcall-modal {padding: 10px 2vw 8px 2vw; width: 99vw; max-width: 99vw; min-width: 0;}
  .prozcall-modal h2 { font-size: 1.07rem;}
  .prozcall-submit { font-size: .98rem;}
  .prozcall-group input, .prozcall-group select, .prozcall-group textarea { font-size: .97rem;}
  .prozcall-flex {flex-direction: column; gap: 0;}
}
/* ---- End Block #{i} ---- */

/* ---- CSS Block #4 ---- */
.corporate-top-bar {
  position: sticky;
  top: 0;
  z-index: 9999;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 20px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.08);
  border-bottom: 1px solid #eaeaea;
  gap: 12px;
}
.corporate-top-bar img {
  height: 34px;
  flex-shrink: 0;
}
.top-right {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  margin-left: auto;
}
/* Rectangular Buttons */
.cta-btn {
  padding: 12px 22px;
  border-radius: 8px;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  color: #fff;
  box-shadow: inset 0 -3px 7px rgba(0,0,0,0.12), 0 4px 12px rgba(0,0,0,0.07);
  transition: all 0.3s ease;
  white-space: nowrap;
}
.teal-call { background: #008fa1; }
.teal-call:hover { background: #007b8a; }
.teal-blue { background: #039be5; }
.teal-blue:hover { background: #0288d1; }
.teal-green { background: #00c9a7; }
.teal-green:hover { background: #00bfa5; }
.quote-yellow {
  background: #f9a825;
  color: #1b4663 !important;
  font-weight: 700;
  border: none;
  box-shadow: 0 5px 22px rgba(249,168,37,0.09), 0 2px 12px rgba(246,176,60,0.08);
}
.quote-yellow:hover, .quote-yellow:focus {
  background: #ffd600;
  color: #bf7100 !important;
  box-shadow: 0 7px 20px rgba(249,168,37,0.17);
}

/* ---------- 2x2 grid on small screens ---------- */
@media (max-width: 700px) {
  .corporate-top-bar {
    padding: 8px 4px;
    gap: 6px;
  }
  .corporate-top-bar img { height: 25px; }
  .top-right {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 14px;   /* 12px vertical, 14px horizontal gap */
    justify-items: stretch;
    align-items: stretch;
    width: 100%;
    max-width: 370px;
    margin-left: auto;
  }
  .cta-btn {
    font-size: 13px;
    padding: 13px 6px;
    min-width: 0;
    width: 93%;
    text-align: center;
    margin: 0;    /* removes any conflicting margins */
    border-radius: 10px !important;
  }
}
/* ---- End Block #{i} ---- */

/* ---- CSS Block #5 ---- */
#hero-slider, .hero-slider-large, .hero-slide, .hero-slide-content, .hero-ctas, .hero-cta-btn, .hero-dot {
  font-family: 'Segoe UI', sans-serif !important;
}
.hero-slider-large {
  position: relative;
  width: 100%;
  min-height: 95vh;
  height: 95vh;
  max-height: 1100px;
  background: #eaf9fd;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hero-slide {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  opacity: 0; z-index: 0;
  display: flex;
  align-items: stretch;
  justify-content: center;
  pointer-events: none;
  transition: opacity 0.6s;
}
.hero-slide.active {
  opacity: 1;
  z-index: 2;
  pointer-events: auto;
}
.hero-slide-bg {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 1;
  opacity: 0.92;
  filter: brightness(0.84) blur(0px);
  transition: filter 0.5s;
  animation-duration: 1.10s;
  opacity: 0;
}
.hero-slide-glass {
  z-index: 3;
  position: relative;
  width: 100%;
  max-width: 780px;
  margin: auto;
  background: rgba(255,255,255,0.38);
  backdrop-filter: blur(13.5px) saturate(118%) brightness(1.08);
  -webkit-backdrop-filter: blur(13.5px) saturate(118%) brightness(1.08);
  border-radius: 38px;
  box-shadow: 0 12px 72px 0 rgba(43,166,184,0.23), 0 2px 12px 0 rgba(23,199,184,0.08);
  padding: 36px 36px 28px 36px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 180px;
  border: 1.5px solid rgba(208,244,255,0.17);
  margin-top: 2.5vh;
  margin-bottom: 4.5vh;
  opacity: 0;
}
.hero-slide-content {
  width: 100%;
}
.hero-slide .hero-title {
  font-size: 2.70rem;
  font-weight: 900;
  color: #183d5e;
  margin-bottom: 22px;
  line-height: 1.13;
  letter-spacing: -1.2px;
  text-shadow: 0 2px 22px rgba(29,125,176,0.06);
  font-family: 'Segoe UI', sans-serif !important;
  opacity: 0;
  filter: drop-shadow(0 2px 6px rgba(43,166,184,0.10));
}
.hero-slide .hero-subtitle {
  font-size: 1.30rem;
  font-weight: 500;
  color: #000;
  margin-bottom: 42px;
  line-height: 1.34;
  letter-spacing: 0.01em;
  font-family: 'Segoe UI', sans-serif !important;
  opacity: 0;
  filter: drop-shadow(0 1.5px 2px rgba(0,175,181,0.07));
}
.hero-ctas {
  display: flex;
  gap: 26px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 8px;
}
.hero-cta-btn {
  padding: 18px 42px;
  border-radius: 12px;
  font-size: 1.25rem;
  font-weight: 700;
  background: linear-gradient(90deg, #00bfa5 82%, #008fa1 100%);
  color: #fff;
  border: none;
  box-shadow: 0 5px 22px rgba(24, 176, 194, 0.17), 0 2px 12px rgba(23,199,184,0.08);
  cursor: pointer;
  transition: background 0.22s, transform 0.19s, box-shadow 0.21s;
  outline: none;
  text-decoration: none;
  margin: 0 3px;
  opacity: 0;
  filter: drop-shadow(0 2px 12px rgba(0,191,165,0.13));
}
.hero-cta-btn.secondary {
  background: linear-gradient(90deg, #fbc02d 64%, #f9a825 100%);
  color: #1b4663;
  box-shadow: 0 2px 10px rgba(246, 176, 60, 0.15);
}
.hero-cta-btn:hover, .hero-cta-btn:focus {
  background: linear-gradient(90deg, #007b8a 90%, #00bfa5 100%);
  color: #fff;
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 9px 34px rgba(23,199,184,0.15), 0 4px 18px rgba(24, 176, 194, 0.13);
}
.hero-cta-btn.secondary:hover, .hero-cta-btn.secondary:focus {
  background: linear-gradient(90deg, #f9a825 74%, #fbc02d 100%);
  color: #16667a;
}
.hero-slider-controls {
  position: absolute;
  bottom: 14px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 18px;
  z-index: 7;
  user-select: none;
}
.hero-dots {
  display: flex;
  gap: 8px;
}
.hero-dot {
  width: 14px; height: 14px;
  background: #e3f7fa;
  border-radius: 50%;
  cursor: pointer;
  border: 2.5px solid #b2f3fb;
  transition: background 0.17s, border 0.14s, transform 0.18s;
}
.hero-dot.active {
  background: #00bfa5;
  border: 2.5px solid #009ca9;
  transform: scale(1.22);
}
@media (max-width: 900px) {
  .hero-slider-large {min-height: 73vh; height: 73vh;}
  .hero-slide-glass {
    max-width: 99vw;
    padding: 28px 10px 18px 10px;  /* more padding */
    border-radius: 19px;
    min-height: 130px;             /* higher min-height */
  }
}

@media (max-width: 600px) {
  .hero-slider-large {min-height: 73vh; height: 73vh;}
  .hero-slide-bg {
    object-fit: cover;
    object-position: center top; /* or center center */
  }
}

@keyframes hero-imgWipeInLeft {
  0% { opacity: 0; clip-path: inset(0 100% 0 0);}
  100% { opacity: 0.92; clip-path: inset(0 0 0 0);}
}
@keyframes hero-imgWipeOut {
  0% { opacity: 0.92; clip-path: inset(0 0 0 0);}
  100% { opacity: 0; clip-path: inset(0 100% 0 0);}
}
@keyframes hero-fadeInGlass {
  0% { opacity:0; }
  100% { opacity:1; }
}
@keyframes hero-fadeOutGlass {
  0% { opacity:1; }
  100% { opacity:0; }
}
@keyframes hero-wipeInLeft {
  0% { opacity:0; clip-path:inset(0 100% 0 0);}
  100% { opacity:1; clip-path:inset(0 0 0 0);}
}
@keyframes hero-wipeOutRight {
  0% { opacity:1; clip-path:inset(0 0 0 0);}
  100% { opacity:0; clip-path:inset(0 0 0 100%);}
}
@keyframes hero-bounceIn {
  0% { opacity:0; transform:scale(0.3);}
  50% { opacity:1; transform:scale(1.05);}
  70% { transform:scale(0.98);}
  100% { transform:scale(1);}
}
@keyframes hero-fadeOutDown {
  from { opacity: 1; transform: translateY(0);}
  to   { opacity: 0; transform: translateY(24px);}
}
/* ---- End Block #{i} ---- */

/* ---- CSS Block #6 ---- */
/* ================== CHOOSE CITY SECTION CSS ================== */

/* Layout */
.modern-city-selector {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  align-items: center;
}

/* Dropdown Container */
.dropdown-wrap {
  position: relative;
  width: 260px;
}

/* Modern 3D Dropdown Styling */
.city-select-modern {
  width: 100%;
  padding: 14px 16px 14px 44px;
  font-size: 1rem;
  font-weight: 600;
  color: #003e52;
  background: #ffffff;
  border: 2px solid #00bfa5;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0, 191, 165, 0.14), inset 0 1px 3px rgba(0, 191, 165, 0.08);
  appearance: none;
  cursor: pointer;
  background-image: url('data:image/svg+xml;utf8,<svg fill="%2300bfa5" height="20" viewBox="0 0 24 24" width="20" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 14px;
  transition: border 0.3s, box-shadow 0.3s;
}

.city-select-modern:focus {
  border-color: #00838f;
  outline: none;
  box-shadow: 0 0 0 2px rgba(0, 191, 165, 0.2);
}

/* CTA Button Base */
.city-cta-btn {
  display: inline-block;
  padding: 14px 28px;
  font-size: 1rem;
  font-weight: 800;
  border-radius: 12px;
  text-decoration: none;
  cursor: pointer;
  text-align: center;
  min-width: 180px;
  transition: all 0.25s ease;
  box-shadow: inset 0 -4px 8px rgba(0,0,0,0.12), 0 6px 20px rgba(0,0,0,0.10);
}

/* CTA: Write to Us (Green Solid) */
.cta-outline {
  background: #00bfa5;
  color: #fff;
  box-shadow:
    inset 0 -3px 7px rgba(0,0,0,0.15),
    0 6px 14px rgba(0,191,165,0.25);
}

.cta-outline:hover {
  background: #009b87;
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(0,191,165,0.3);
}

/* CTA: Request a Quote (Yellow Solid) */
.cta-solid {
  background: #f9a825;
  color: #1b4663;
  box-shadow:
    inset 0 -3px 7px rgba(0,0,0,0.14),
    0 6px 18px rgba(255,168,0,0.25);
}

.cta-solid:hover {
  background: #ffc107;
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(255,168,0,0.35);
}

/* Responsive layout */
@media (max-width: 600px) {
  .modern-city-selector {
    flex-direction: column;
  }

  .dropdown-wrap {
    width: 100%;
    max-width: 320px;
  }

  .city-cta-btn {
    width: 90%;
    font-size: 1rem;
  }
}

/* ================== FIX FOR FONT-WEIGHT ISSUE IN PARAGRAPH ================== */
.choosecity-description {
  font-size: 1.05rem;
  color: #333;
  max-width: 680px;
  margin: 0 auto 25px;
  font-weight: 400 !important;
  line-height: 1.6;
  font-family: inherit;
}

.choosecity-description .choosecity-bold {
  font-weight: 700 !important;
}
.choosecity-paragraph {
  font-weight: 400 !important;
  font-size: 1.05rem;
  color: #333;
  line-height: 1.6;
  max-width: 680px;
  margin: 0 auto 25px;
  font-family: 'Segoe UI', 'Inter', Arial, sans-serif;
}

.choosecity-paragraph .choosecity-highlight {
  font-weight: 700 !important;
  color: inherit;
}
/* ---- End Block #{i} ---- */

/* ---- CSS Block #7 ---- */
/* ULTIMATE FIX for all-bold issue inside the modal form */
#goaQuoteModal input,
#goaQuoteModal select,
#goaQuoteModal textarea,
#goaQuoteModal label,
#goaQuoteModal option {
  font-weight: 400 !important;
}

#goaQuoteModal h2,
#goaQuoteModal h3,
#goaQuoteModal .goa-quote-title {
  font-weight: 800 !important;
  color: #00838f !important;
}


.goa-quote-title-wrap { text-align: center; margin-bottom: 18px; padding-top: 38px;}
.goa-quote-title { color: #00838f; font-size: 2rem; font-weight: 800; letter-spacing: 0.5px; margin-bottom: 7px;}
.goa-quote-desc { color: #444; font-size: 1.13rem; font-weight: 500; max-width: 540px; margin: 0 auto;}
.goa-quote-btn { margin-top: 22px; padding: 15px 42px; background: #00bfa5; color: #fff; font-weight: 700; font-size: 1.19rem; border: none; border-radius: 12px; box-shadow: 0 2px 12px #fff; cursor: pointer; transition: background 0.17s, color 0.17s, box-shadow 0.19s;}
.goa-quote-btn:hover { background: #00838f; color: #fff; box-shadow: 0 7px 18px #00838f33;}
.goa-modal-overlay { display: none; position: fixed; z-index: 999999; left: 0; top: 0; width: 100vw; height: 100vh; background: rgba(12,24,44,0.17); align-items: center; justify-content: center; transition: background 0.16s;}
.goa-modal-content { background: #fff; padding: 34px 28px 18px 28px; border-radius: 19px; width: 100%; max-width: 500px; box-shadow: 0 12px 40px #00838f1a, 0 2px 18px #00bfa519; position: relative; animation: fadeInUp 0.32s; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column;}
@keyframes fadeInUp { 0% { opacity:0; transform: translateY(64px);} 100% {opacity:1; transform: none;}}
.goa-modal-close { position: absolute; right: 18px; top: 14px; font-size: 2.2rem; color: #00bfa5; cursor: pointer; font-weight: 700; opacity: 0.78; transition: color 0.13s;}
.goa-modal-close:hover { color: #d03232; }
.goa-quote-form { overflow-y: auto; max-height: 72vh; padding-right: 2px; display: flex; flex-direction: column;}
.goa-quote-form h3 { text-align: center; font-size: 1.38rem; color: #00838f; margin-bottom: 13px; font-weight: 800; letter-spacing: 0.4px;}
.goa-form-row { display: flex; gap: 16px; margin-bottom: 13px;}
.goa-form-row input, .goa-form-row select, .goa-form-row textarea { flex: 1; padding: 11px 12px; border-radius: 8px; border: 1.7px solid #00bfa543; font-size: 1.06rem; font-family: inherit; font-weight: 500; background: #f6fefd; color: #00838f; transition: border 0.16s, background 0.15s;}
.goa-form-row input:focus, .goa-form-row select:focus, .goa-form-row textarea:focus { border: 1.7px solid #00bfa5; outline: none; background: #e0f7fa;}
.goa-upload-label { display: flex; align-items: center; gap: 8px; color: #00838f; background: #e0f7fa; border-radius: 7px; padding: 8px 14px; font-weight: 700; font-size: 1.05rem; cursor: pointer; border: 1.5px dashed #00bfa5; width: 100%;}
.goa-upload-label input[type="file"] { display: none;}
.goa-quote-form textarea { min-height: 49px; max-height: 160px; resize: vertical;}
.goa-submit-btn { background: #00bfa5; color: #fff; font-weight: 800; font-size: 1.17rem; padding: 13px 0; border: none; border-radius: 11px; box-shadow: 0 2px 12px #fff; cursor: pointer; width: 100%; margin-top: 6px; transition: background 0.17s, box-shadow 0.17s;}
.goa-submit-btn:hover { background: #00838f; box-shadow: 0 7px 16px #00bfa533; }
.goa-confirm-row label { font-size: 0.98rem; color: #444; font-weight: 500; gap:7px; display:flex; align-items:center;}
.goa-form-row input[type="checkbox"] { width: 18px; height: 18px;}
.goa-modal-content::-webkit-scrollbar, .goa-quote-form::-webkit-scrollbar { width: 6px; background: #e0f7fa;}
.goa-modal-content::-webkit-scrollbar-thumb, .goa-quote-form::-webkit-scrollbar-thumb { background: #00bfa544; border-radius: 3px;}
@media (max-width: 600px) {
  .goa-modal-content { padding: 19px 2vw 11px 2vw; max-width: 97vw;}
  .goa-quote-form h3 { font-size: 1.09rem; }
  .goa-form-row { flex-direction: column; gap: 7px; }
  .goa-modal-close { right: 8px; top: 7px; font-size: 1.6rem;}
  .goa-quote-title { font-size: 1.18rem;}
}
/* ---- End Block #{i} ---- */

/* ---- CSS Block #8 ---- */
#proz-accepted-india {
  background: #fff;
  border-radius: 28px;
  border: 1.5px solid #e3e9ef;
  box-shadow: 0 2px 14px 0 rgba(36, 56, 89, 0.06);
  max-width: 1040px;
  margin: 48px auto 32px auto;
  position: relative;
  overflow: hidden;
  padding: 48px 0 30px 0;
  font-family: 'Inter', Arial, sans-serif;
}
#proz-accepted-india .proz-accepted-header {
  text-align: center;
  max-width: 860px;
  margin: 0 auto 32px auto;
}
#proz-accepted-india .proz-trust-badge {
  display: inline-block;
  background: #14c9c1;
  color: #fff;
  font-weight: 800;
  font-size: 1rem;
  letter-spacing: 0.2px;
  padding: 9px 32px 9px 32px;
  border-radius: 100px;
  margin-bottom: 18px;
  margin-top: -16px;
  border: 2.5px solid #2ed6cb;
  text-shadow:
    0 2px 8px rgba(0,0,0,0.10),
    0 1px 0 rgba(255,255,255,0.33);
  /* Soft 3D Embossed Effect */
  box-shadow:
    0 6px 24px 0 rgba(20,201,193,0.23),  /* Outer glow */
    0 2px 7px 0 rgba(16,56,74,0.11),      /* Bottom shadow */
    inset 0 4px 14px 0 rgba(255,255,255,0.15), /* Top inner highlight */
    inset 0 -3px 12px 0 rgba(17,113,109,0.17); /* Bottom inner shadow */
  transition: box-shadow .3s;
}
#proz-accepted-india h2 {
  font-size: 2.0rem;
  font-weight: 800;
  color: #20303c;
  margin-bottom: 0.2rem;
  letter-spacing: -0.5px;
}
#proz-accepted-india .proz-headline-accent {
  width: 58px;
  height: 3px;
  background: #139aa9;
  border-radius: 5px;
  margin: 14px auto 9px auto;
}
#proz-accepted-india .proz-accepted-header p {
  color: #355362;
  font-size: 1.07rem;
  font-weight: 500;
  margin-bottom: 0;
  margin-top: 12px;
}
#proz-accepted-india .proz-acc-slider-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 740px;
  margin: 0 auto 50px auto;
}
#proz-accepted-india #prozAccTrackIndia {
  position: relative;
  width: 480px;
  height: 390px;
  margin: 0 auto;
}
#proz-accepted-india #prozAccTrackIndia .proz-acc-slide {
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  padding: 0;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 3px 18px 0 rgba(36,56,89,0.08);
  border: 1.4px solid #e3e9ef;
  transition: box-shadow .3s, border .3s;
  overflow: hidden;
}
#proz-accepted-india #prozAccTrackIndia .proz-acc-slide.active {
  display: flex;
  box-shadow: 0 7px 30px 0 rgba(36,56,89,0.11);
  border: 1.6px solid #139aa9;
  z-index: 2;
}
#proz-accepted-india .proz-acc-illust {
  width: 105px;
  height: 105px;
  margin: 44px 0 0 0;
  object-fit: contain;
  display: block;
  border-radius: 14px;
  background: #fff;
  box-shadow: none;
  border: 1.2px solid #fff;
  padding: 2px;
}
.proz-acc-text-area {
  width: 100%;
  margin-top: 34px;
  padding: 30px 20px 22px 20px;
  background: #14c9c1;
  border-bottom-left-radius: 18px;
  border-bottom-right-radius: 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 130px;
  box-sizing: border-box;
  /* Claymorphism / soft 3D style */
  box-shadow:
    0 8px 24px 0 rgba(20,201,193,0.18),     /* strong but soft drop shadow */
    0 1.5px 7px 0 rgba(21, 74, 86, 0.09),   /* soft color depth */
    inset 0 4px 20px 0 rgba(0,0,0,0.11),    /* bottom inside shadow */
    inset 0 -8px 14px 0 rgba(255,255,255,0.13); /* top inside highlight */
  border-top: 1.2px solid #36e0d7;
  border-bottom: 2.2px solid #139aa9;
  /* Optional for stronger 3D: slight blur backdrop */
  /* backdrop-filter: blur(0.5px); */
}

.proz-acc-text-area h3 {
  font-size: 1.10rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.14em;
  text-align: center;
  letter-spacing: 0.02em;
  text-shadow: 0 2px 7px rgba(0,0,0,0.10);
}
.proz-acc-text-area p {
  color: #e5fcf8;
  font-size: 0.98rem;
  text-align: center;
  font-weight: 500;
  line-height: 1.48;
  margin: 7px 0 0 0;
  text-shadow: 0 2px 6px rgba(0,0,0,0.08);
}
#proz-accepted-india .proz-acc-dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin: 55px auto 0 auto;
}
#proz-accepted-india .proz-acc-dot {
  width: 13px;
  height: 13px;
  background: #e3e9ef;
  border-radius: 50%;
  cursor: pointer;
  transition: background 0.17s, transform 0.17s, box-shadow .2s;
  border: 2px solid #c7e3ea;
  box-shadow: none;
  outline: none;
}
#proz-accepted-india .proz-acc-dot.active {
  background: #139aa9;
  transform: scale(1.19);
  border: 2px solid #139aa9;
  box-shadow: none;
}
#proz-accepted-india .proz-accepted-disclaimer {
  text-align: center;
  margin: 28px auto 0 auto;
  font-size: 0.97rem;
  color: #5d646e;
  max-width: 700px;
  background: #f7fafc;
  border-radius: 8px;
  padding: 11px 15px 10px 15px;
  border: 1.1px dashed #c7e3ea;
  box-shadow: none;
  font-weight: 500;
  letter-spacing: 0.01em;
}
@media (max-width: 700px) {
  #proz-accepted-india #prozAccTrackIndia {width:97vw !important;min-width:0;max-width:97vw;height:320px;margin:0 auto !important;}
  #proz-accepted-india #prozAccTrackIndia .proz-acc-slide {padding:0;min-width:0;max-width:95vw;}
  #proz-accepted-india .proz-acc-illust {width:62px;height:62px;margin-top:24px;}
  .proz-acc-text-area {padding:20px 6vw 16px 6vw;min-height: 84px;}
  #proz-accepted-india h2 {font-size:1.2rem;}
}
@media (max-width: 440px) {
  #proz-accepted-india #prozAccTrackIndia {height:250px;}
  .proz-acc-text-area {padding:10px 4vw 8px 4vw;min-height:56px;}
  #proz-accepted-india #prozAccTrackIndia .proz-acc-slide h3 {font-size:0.98rem;}
  #proz-accepted-india #prozAccTrackIndia .proz-acc-slide p {font-size:0.87rem;}
  #proz-accepted-india .proz-acc-illust {width:44px;height:44px;}
}
/* ==== KEYFRAME ANIMATIONS ==== */
@keyframes bounceInDown {0%{opacity:0;transform:translateY(-2000px);}60%{opacity:1;transform:translateY(30px);}80%{transform:translateY(-10px);}100%{transform:translateY(0);}}
@keyframes bounceOutUp {20%{transform:translateY(-10px);}100%{opacity:0;transform:translateY(-2000px);}}
@keyframes fadeIn {from{opacity:0;}to{opacity:1;}}
@keyframes fadeOut {from{opacity:1;}to{opacity:0;}}
@keyframes zoomIn {from{opacity:0;transform:scale(0.3);}50%{opacity:1;}to{transform:scale(1);}}
@keyframes zoomOut {from{opacity:1;}to{transform:scale(0.3);}}
@keyframes flipInLeft {from{transform:perspective(400px) rotateY(90deg);opacity:0;}100%{transform:perspective(400px) rotateY(0);opacity:1;}}
@keyframes flipOutRight {from{transform:perspective(400px) rotateY(0);opacity:1;}100%{transform:perspective(400px) rotateY(90deg);opacity:0;}}
@keyframes flipInTop {from{transform:perspective(400px) rotateX(-90deg);opacity:0;}100%{transform:perspective(400px) rotateX(0);opacity:1;}}
@keyframes flipOutDown {from{transform:perspective(400px) rotateX(0);opacity:1;}100%{transform:perspective(400px) rotateX(90deg);opacity:0;}}
@keyframes flipInBottom {from{transform:perspective(400px) rotateX(90deg);opacity:0;}100%{transform:perspective(400px) rotateX(0);opacity:1;}}
@keyframes flipOutUp {from{transform:perspective(400px) rotateX(0);opacity:1;}100%{transform:perspective(400px) rotateX(-90deg);opacity:0;}}
@keyframes slideInRight {from{transform:translateX(100%);opacity:0;}to{transform:translateX(0);opacity:1;}}
@keyframes slideOutLeft {from{transform:translateX(0);opacity:1;}to{transform:translateX(-100%);opacity:0;}}
@keyframes slideInLeft {from{transform:translateX(-100%);opacity:0;}to{transform:translateX(0);opacity:1;}}
@keyframes slideOutRight {from{transform:translateX(0);opacity:1;}to{transform:translateX(100%);opacity:0;}}
@keyframes verticalFlipIn {from{transform:rotateX(180deg);opacity:0;}to{transform:rotateX(0);opacity:1;}}
@keyframes verticalFlipOut {from{transform:rotateX(0);opacity:1;}to{transform:rotateX(180deg);opacity:0;}}
@keyframes flyIn {from{transform:translateY(-200px) scale(0.3);opacity:0;}to{transform:translateY(0) scale(1);opacity:1;}}
@keyframes flyOut {from{transform:translateY(0) scale(1);opacity:1;}to{transform:translateY(200px) scale(0.3);opacity:0;}}
@keyframes blurrIn {from{filter:blur(18px);opacity:0;}to{filter:blur(0);opacity:1;}}
@keyframes blurrOut {from{filter:blur(0);opacity:1;}to{filter:blur(22px);opacity:0;}}
@keyframes fadeInUp {from{opacity:0;transform:translateY(100px);}to{opacity:1;transform:translateY(0);}}
@keyframes fadeOutDown {from{opacity:1;transform:translateY(0);}to{opacity:0;transform:translateY(100px);}}
@keyframes rotateIn {from{transform:rotate(-200deg);opacity:0;}to{transform:rotate(0);opacity:1;}}
@keyframes rotateOut {from{transform:rotate(0);opacity:1;}to{transform:rotate(200deg);opacity:0;}}
@keyframes zoomInUp {from{transform:scale(0.2) translateY(100px);opacity:0;}to{transform:scale(1) translateY(0);opacity:1;}}
@keyframes zoomOutDown {from{transform:scale(1) translateY(0);opacity:1;}to{transform:scale(0.2) translateY(100px);opacity:0;}}
@keyframes flipInRight {from{transform:perspective(400px) rotateY(-90deg);opacity:0;}100%{transform:perspective(400px) rotateY(0);opacity:1;}}
@keyframes flipOutLeft {from{transform:perspective(400px) rotateY(0);opacity:1;}100%{transform:perspective(400px) rotateY(-90deg);opacity:0;}}
@keyframes rubberBand {from{transform:scale3d(1,1,1);}30%{transform:scale3d(1.25,0.75,1);}40%{transform:scale3d(0.75,1.25,1);}50%{transform:scale3d(1.15,0.85,1);}65%{transform:scale3d(.95,1.05,1);}75%{transform:scale3d(1.05,.95,1);}100%{transform:scale3d(1,1,1);}}
@keyframes hinge {0%{transform:rotate(0);opacity:1;}20%,60%{transform:rotate(80deg);opacity:1;}100%{transform:translateY(700px);opacity:0;}}
@keyframes lightSpeedIn {from{transform:translate3d(100%,0,0) skewX(-30deg);opacity:0;}60%{transform:skewX(20deg);}80%{transform:skewX(-5deg);}100%{transform:translate3d(0,0,0);opacity:1;}}
@keyframes lightSpeedOut {from{opacity:1;}to{transform:translate3d(100%,0,0) skewX(30deg);opacity:0;}}
@keyframes wobble {0%,100%{transform:none;}15%{transform:translateX(-25%) rotate(-5deg);}30%{transform:translateX(20%) rotate(3deg);}45%{transform:translateX(-15%) rotate(-3deg);}60%{transform:translateX(10%) rotate(2deg);}75%{transform:translateX(-5%) rotate(-1deg);}}
@keyframes slideInUp {from{transform:translateY(100%);opacity:0;}to{transform:translateY(0);opacity:1;}}
@keyframes slideOutDown {from{transform:translateY(0);opacity:1;}to{transform:translateY(100px);opacity:0;}}
@keyframes flipInY {from{transform:perspective(400px) rotateY(90deg);opacity:0;}100%{transform:perspective(400px) rotateY(0);opacity:1;}}
@keyframes flipOutY {from{transform:perspective(400px) rotateY(0);opacity:1;}100%{transform:perspective(400px) rotateY(90deg);opacity:0;}}
@keyframes jackInTheBox {from{opacity:0;transform:scale(0.1) rotate(30deg);}50%{transform:rotate(-10deg);}70%{transform:rotate(3deg);}100%{opacity:1;transform:scale(1) rotate(0);}}
@keyframes zoomOutUp {from{opacity:1;}to{opacity:0;transform:scale(0.2) translateY(-100px);}}
@keyframes bounceInLeft {from,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1);}from{opacity:0;transform:translateX(-3000px);}60%{opacity:1;transform:translateX(25px);}75%{transform:translateX(-10px);}90%{transform:translateX(5px);}to{transform:translateX(0);}}
/* ---- End Block #{i} ---- */

/* ---- CSS Block #9 ---- */
body { font-family: 'Poppins', Arial, sans-serif; }
.proz-hero-wrap {
  width: 100vw; max-width: 700px;
  margin: 36px auto 22px auto;
  display: flex; flex-direction: column; align-items: center;
  background: #fff;
  /* Prevent size jumping */
  min-height: 260px;
  transition: min-height 0.2s;
}
.proz-logo-3d-hero {
  width: 100%;
  height: 142px;
  display: flex; justify-content: center; align-items: flex-end;
  perspective: 1100px;
}
.proz-logo-img {
  height: 88px;
  opacity: 0;
  will-change: transform, opacity;
  pointer-events: none;
}
/* Logo Animations */
@keyframes logoAppear {
  0%   { opacity: 0; transform: scale(0.72) rotateY(-140deg);}
  55%  { opacity: 1; transform: scale(1.11) rotateY(20deg);}
  75%  { transform: scale(0.95) rotateY(-7deg);}
  100% { opacity: 1; transform: scale(1) rotateY(0);}
}
@keyframes logoTwist {
  0%   { opacity: 0; transform: rotateZ(0deg) rotateY(-120deg) scale(0.8);}
  35%  { opacity: 1; transform: rotateZ(22deg) rotateY(8deg) scale(1.10);}
  70%  { transform: rotateZ(-16deg) rotateY(-8deg) scale(0.93);}
  100% { opacity: 1; transform: rotateZ(0) rotateY(0) scale(1);}
}
@keyframes logoBounce {
  0%   { opacity: 0; transform: scale(0.7) translateY(32px);}
  44%  { opacity: 1; transform: scale(1.17) translateY(-25px);}
  68%  { transform: scale(0.95) translateY(10px);}
  100% { opacity: 1; transform: scale(1) translateY(0);}
}
@keyframes logoSwing {
  0%   { opacity: 0; transform: rotateZ(0deg);}
  28%  { opacity: 1; transform: rotateZ(16deg);}
  64%  { transform: rotateZ(-16deg);}
  100% { opacity: 1; transform: rotateZ(0);}
}
@keyframes logoPop {
  0%   { opacity: 0; transform: scale(0.7);}
  30%  { opacity: 1; transform: scale(1.19);}
  70%  { transform: scale(0.92);}
  100% { opacity: 1; transform: scale(1);}
}

.proz-questions-wrap {
  width: 100%;
  min-height: 90px;
  margin-top: 0;
  display: flex; 
  justify-content: center; 
  align-items: flex-start;
  position: relative;
  font-size: 1.42rem; font-weight: 900;
  font-family: 'Poppins', Arial, sans-serif;
  background: none !important;
}
.proz-question-set {
  display: none;
  opacity: 0;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 18px;
  padding: 0 18px;
  will-change: opacity, transform;
  pointer-events: none;
  font-family: 'Poppins', Arial, sans-serif;
  font-weight: 900;
  letter-spacing: 0.01em;
  border-radius: 0;
  background: none !important;
  box-shadow: none !important;
  margin: 0 auto;
  margin-bottom: 0;
  max-width: 650px;
  padding: 30px 3vw 30px 3vw;
  min-width: 220px;
  text-align: center;
  transition: opacity 0.25s;
}
@keyframes questionIn {
  0%   { opacity: 0; transform: translateY(42px) scale(0.97);}
  86%  { opacity: 1; transform: translateY(-4px) scale(1.07);}
  100% { opacity: 1; transform: translateY(0) scale(1);}
}
@keyframes questionOut {
  0%   { opacity: 1; transform: translateY(0);}
  100% { opacity: 0; transform: translateY(-30px);}
}
.pq-color1, .pq-txt1 { color: #246cf0; }
.pq-color2, .pq-txt2 { color: #18ad6b; }
.pq-color3, .pq-txt3 { color: #fc326a; }
.pq-color4, .pq-txt4 { color: #ffac26; }
.pq-color5, .pq-txt5 { color: #9f4aff; }

.pq-txt {
  font-size: 1.18em;
  font-weight: 900;
  line-height: 1.28;
  letter-spacing: 0.01em;
  font-family: 'Poppins', Arial, sans-serif;
  display: block;
  background: none !important;
  text-align: center;
  margin: 0 auto;
  opacity: 0;
  will-change: opacity, transform;
}
.pq-strong {
  background: none !important;
  color: inherit;
  font-weight: 900;

  padding: 0 1.5px;
}
.pq-icon {
  font-size: 5.2em;
  display: block;
  margin: 0 auto 2px auto;
  line-height: 1;
  opacity: 0;
  will-change: opacity, transform;
  background: none !important;
}
/* Animations as before (kept for completeness) */
@keyframes iconBounceIn {
  0%   { opacity: 0; transform: scale(0.1) translateY(120px);}
  50%  { opacity: 1; transform: scale(1.15) translateY(-14px);}
  80%  { opacity: 1; transform: scale(0.92) translateY(6px);}
  100% { opacity: 1; transform: scale(1) translateY(0);}
}
@keyframes iconBounceOut {
  0%   { opacity: 1; transform: scale(1) translateY(0);}
  45%  { opacity: 1; transform: scale(0.85) translateY(8px);}
  100% { opacity: 0; transform: scale(0.1) translateY(-90px);}
}
@keyframes iconPopIn {
  0%   { opacity: 0; transform: scale(0);}
  60%  { opacity: 1; transform: scale(1.2);}
  80%  { transform: scale(0.9);}
  100% { opacity: 1; transform: scale(1);}
}
@keyframes iconPopOut {
  0%   { opacity: 1; transform: scale(1);}
  30%  { opacity: 1; transform: scale(1.1);}
  100% { opacity: 0; transform: scale(0);}
}
@keyframes iconSpinIn {
  0%   { opacity: 0; transform: rotateZ(-360deg) scale(0);}
  60%  { opacity: 1; transform: rotateZ(20deg) scale(1.13);}
  90%  { transform: rotateZ(-8deg) scale(0.95);}
  100% { opacity: 1; transform: rotateZ(0) scale(1);}
}
@keyframes iconSpinOut {
  0%   { opacity: 1; transform: rotateZ(0) scale(1);}
  45%  { opacity: 1; transform: rotateZ(12deg) scale(0.92);}
  100% { opacity: 0; transform: rotateZ(320deg) scale(0);}
}
@keyframes iconSwingIn {
  0%   { opacity: 0; transform: rotateZ(-80deg) scale(0);}
  40%  { opacity: 1; transform: rotateZ(24deg) scale(1.05);}
  80%  { transform: rotateZ(-12deg) scale(0.95);}
  100% { opacity: 1; transform: rotateZ(0) scale(1);}
}
@keyframes iconSwingOut {
  0%   { opacity: 1; transform: rotateZ(0) scale(1);}
  50%  { opacity: 1; transform: rotateZ(-18deg) scale(0.97);}
  100% { opacity: 0; transform: rotateZ(90deg) scale(0);}
}
@keyframes iconDropIn {
  0%   { opacity: 0; transform: translateY(-160px) scale(0.1);}
  65%  { opacity: 1; transform: translateY(16px) scale(1.08);}
  100% { opacity: 1; transform: translateY(0) scale(1);}
}
@keyframes iconDropOut {
  0%   { opacity: 1; transform: translateY(0) scale(1);}
  55%  { opacity: 1; transform: translateY(-10px) scale(0.93);}
  100% { opacity: 0; transform: translateY(160px) scale(0.1);}
}
/* --- ROCKET custom in/out --- */
@keyframes rocketFlyIn {
  0%   { opacity: 0; transform: translateY(260px) scale(0.5) rotate(-17deg);}
  20%  { opacity: 1; }
  55%  { transform: translateY(-18px) scale(1.18) rotate(5deg);}
  80%  { transform: translateY(5px) scale(0.93) rotate(-8deg);}
  100% { opacity: 1; transform: translateY(0) scale(1) rotate(0);}
}
@keyframes rocketFlyOut {
  0%   { opacity: 1; transform: translateY(0) translateX(0) scale(1) rotate(0);}
  10%  { opacity: 1; }
  70%  { transform: translateY(-120px) translateX(120px) scale(1.09) rotate(-21deg);}
  100% { opacity: 0; transform: translateY(-330px) translateX(400px) scale(0.5) rotate(-38deg);}
}
/* Contact CTA styles and animations */
.proz-contact-cta {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto 12px auto;
  min-height: 74px;
  animation: contactFadeIn 0.9s;
  background: none !important;
  box-shadow: none !important;
}
@keyframes contactFadeIn {
  0% { opacity: 0; transform: scale(0.7) translateY(40px);}
  70% { opacity: 1; transform: scale(1.1) translateY(-10px);}
  100% { opacity: 1; transform: scale(1) translateY(0);}
}
@keyframes contactFadeOut {
  0% { opacity: 1; transform: scale(1) translateY(0);}
  100% { opacity: 0; transform: scale(0.7) translateY(-40px);}
}
/* CTA Color Gradients */
.proz-contact-btn.cta1 { background: linear-gradient(90deg,#246cf0 60%,#18ad6b 100%);}
.proz-contact-btn.cta2 { background: linear-gradient(90deg,#18ad6b 60%,#246cf0 100%);}
.proz-contact-btn.cta3 { background: linear-gradient(90deg,#32cd32 60%,#90ee90 100%);}
.proz-contact-btn.cta4 { background: linear-gradient(90deg,#ffac26 60%,#ffe17a 100%);}
.proz-contact-btn.cta5 { background: linear-gradient(90deg,#9f4aff 60%,#fc326a 100%);}
.proz-contact-btn {
  font-family: 'Poppins', Arial, sans-serif;
  font-size: 1.4em;
  font-weight: 900;
  color: #fff;
  border: none;
  border-radius: 14px;
  box-shadow: none !important;
  padding: 18px 42px;
  margin: 0 auto;
  cursor: pointer;
  transition: background 0.2s, transform 0.15s;
  outline: none;
  text-decoration: none;
  display: inline-block;
  background: none !important;
}
.proz-contact-btn.cta1, .proz-contact-btn.cta2, .proz-contact-btn.cta3, .proz-contact-btn.cta4, .proz-contact-btn.cta5 {
  background: var(--btn-gradient, #246cf0) !important;
}
.proz-contact-btn:hover {
  filter: brightness(1.09);
  transform: scale(1.07);
}
@media (max-width: 700px) {
  .proz-logo-img { height: 48px; }
  .proz-hero-wrap { max-width: 99vw; min-height: 180px;}
  .proz-questions-wrap { font-size: 1.03rem; min-height: 60px;}
  .proz-logo-3d-hero { height: 66px; }
  .proz-question-set { padding: 12px 0 12px 0; max-width: 99vw; }
  .pq-txt { font-size: 1em; }
  .pq-icon { font-size: 2.5em; }
  .proz-contact-btn { font-size: 1em; padding: 11px 20px; }
}
/* ---- End Block #{i} ---- */

/* ---- CSS Block #10 ---- */
.proz-tabcompare-section {
  background: #fff !important;
  padding: 62px 0 48px 0;
  border-radius: 0 0 32px 32px;
  box-sizing: border-box;
}
.proz-tabcompare-head {
  text-align: center;
  margin-bottom: 33px;
}
.proz-tabcompare-head h2 {
  font-size: 1.6rem;
  font-weight: 900;
  color: #22216a;
  margin-bottom: 7px;
}
.proz-tabcompare-head p {
  font-size: 1.12rem;
  color: #43405c;
  margin: 0 auto;
  max-width: 680px;
  line-height: 1.7;
}
.proz-tabcompare-tabs {
  display: flex;
  justify-content: center;
  margin-bottom: 25px;
  gap: 0;
}
.tab-btn {
  background: #f2f2f2;
  border: none;
  outline: none;
  color: #5e5ee6;
  font-size: 1.13rem;
  font-weight: 700;
  padding: 14px 48px;
  border-radius: 15px 15px 0 0;
  margin: 0 2px;
  cursor: pointer;
  transition: background .12s, color .12s;
  position: relative;
  z-index: 1;
  letter-spacing: .02em;
}
.tab-btn.active,
.tab-btn:hover {
  background: #684fff;
  color: #fff;
  z-index: 2;
}
.proz-tabcompare-body {
  background: #fff;
  max-width: 750px;
  margin: 0 auto 0 auto;
  border-radius: 0 0 16px 16px;
  box-shadow: 0 4px 22px #e2e2fa2b;
  padding: 36px 32px 32px 32px;
  min-height: 410px;
  position: relative;
}
.tab-content {
  display: none;
  animation: fadeIn .35s;
}
.tab-content.active { display: block; }
@keyframes fadeIn { from {opacity:0;transform:translateY(12px);} to{opacity:1;transform:none;} }
.proz-tabcompare-list {
  list-style: none;
  margin: 0 0 33px 0;
  padding: 0;
}
.proz-tabcompare-list li {
  display: flex;
  align-items: flex-start;
  font-size: 1.13rem;
  margin-bottom: 14px;
  color: #22224a;
  font-weight: 500;
  line-height: 1.52;
  gap: 13px;
}
.proz-tabcompare-list li span {
  font-size: 1.26rem;
  min-width: 31px;
  text-align: center;
  margin-right: 2px;
  margin-top: 2px;
}
.tab-content#certified .proz-tabcompare-list li { color: #31419b; }
.tab-content#certified .proz-tabcompare-list li span { color: #684fff; }
.tab-content#standard .proz-tabcompare-list li { color: #b82c42; }
.tab-content#standard .proz-tabcompare-list li span { color: #db3d5a; }
.proz-tabcompare-cta {
  display: block;
  width: 100%;
  max-width: 350px;
  margin: 0 auto;
  padding: 15px 0;
  font-size: 1.18rem;
  font-weight: 800;
  text-align: center;
  border-radius: 10px;
  text-decoration: none;
  border: none;
  outline: none;
  box-shadow: 0 2px 9px #eae5ff19;
  transition: background .13s;
  letter-spacing: .01em;
}
.proz-tabcompare-cta.cert { background: #684fff; color: #fff; }
.proz-tabcompare-cta.cert:hover { background: #3d2cf8; }
.proz-tabcompare-cta.std { background: #db3d5a; color: #fff;}
.proz-tabcompare-cta.std:hover { background: #a01e31; }

/* Responsive */
@media (max-width: 700px) {
  .proz-tabcompare-body { padding: 15px 2vw 14px 2vw;}
  .proz-tabcompare-head h2 { font-size: 1.05rem; }
  .tab-btn { font-size: 1.01rem; padding: 12px 10px;}
  .proz-tabcompare-body { min-height: 0; }
  .proz-tabcompare-list li { font-size: 1.01rem; }
}
.proz-tabcompare-introbox {
  background: #fafdff;
  border-radius: 18px;
  max-width: 690px;
  margin: 25px auto 0 auto;
  padding: 28px 28px 23px 28px;
  box-shadow: 0 4px 36px #dde7fa19, 0 1px 1px #e2f1fd12;
  font-size: 1.12rem;
  color: #1a1c39;
  line-height: 1.8;
  animation: fadeInIntro 1.3s cubic-bezier(.6,.11,.28,.96);
  font-family: inherit;
}
@media (max-width:700px){
  .proz-tabcompare-introbox {
    font-size: 1.02rem;
    padding: 15px 4vw 14px 4vw;
  }
}
@keyframes fadeInIntro {
  0% { opacity: 0; transform: translateY(24px);}
  100% { opacity: 1; transform: none;}
}
/* Optional: slight fade on first sentence */
.proz-intro-fade {
  animation: introPulse 1.2s cubic-bezier(.7,.08,.49,.99);
}
@keyframes introPulse {
  0% { opacity: 0; letter-spacing: 0.01em;}
  70% { opacity: 1; letter-spacing: 0.09em;}
  100% { opacity: 1; letter-spacing: 0.01em;}
}
/* ---- End Block #{i} ---- */

/* ---- CSS Block #11 ---- */
.docs-langs-section {
  background: #f8faff;
  padding: 30px 12px 18px 12px;
  border-radius: 24px;
  max-width: 900px;
  margin: 36px auto 40px auto;
  box-shadow: 0 3px 20px rgba(36,108,240,0.09);
}
.dl-section-header { text-align:center; margin-bottom:18px;}
.dl-section-header h2 {
  font-size: 2em;
  font-weight: 800;
  letter-spacing: -0.5px;
  color: #263282;
  margin-bottom: 6px;
}
.dl-section-header .dl-section-desc {
  color: #4950b2;
  font-size: 1.12em;
  font-weight: 500;
}
.tabs {
  display: flex;
  justify-content: center;
  margin-bottom: 18px;
  gap: 9px;
}
.tab-btn {
  padding: 13px 26px;
  background: #fff;
  color: #2365c4;
  font-weight: bold;
  border: 2px solid #2365c4;
  border-bottom: none;
  border-radius: 11px 11px 0 0;
  font-size: 1.11em;
  cursor: pointer;
  transition: all 0.18s;
  box-shadow: 0 2px 5px rgba(37,69,156,0.06);
}
.tab-btn.active, .tab-btn:hover {
  background: #2365c4;
  color: #fff;
}
.dl-tab-content {
  background: #fff;
  border-radius: 0 0 13px 13px;
  padding: 19px 10px 10px 10px;
  box-shadow: 0 1px 6px rgba(25,118,210,0.05);
}
.dl-search, .lang-search {
  width: 100%;
  margin-bottom: 10px;
  border: 1.3px solid #e0e0e0;
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 15px;
  outline: none;
  background: #f8faff;
  font-weight: 500;
}
.compact-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
@media (min-width: 600px) {
  .compact-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 900px) {
  .compact-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}
.dl-item, .lang-item {
  font-size: 1.08em;
  padding: 11px 7px;
  border-radius: 8px;
  text-align: left;
  font-weight: 700;
  background: #f4f8fd;
  box-shadow: 0 1px 3px rgba(36,108,240,0.05);
  cursor: pointer;
  border: 1.5px solid #e3eaff;
  display: flex;
  align-items: center;
  gap: 10px;
  transition: background 0.15s, border 0.16s;
}
.dl-item:hover, .lang-item:hover {
  background: #e7ecff;
  border: 1.5px solid #2365c4;
}
.flag-icon {
  width: 23px; height: 15px;
  object-fit: cover;
  border-radius: 3px;
  margin-right: 5px;
  vertical-align: middle;
  box-shadow: 0 1px 2px #b2b2b2;
  border: 1px solid #ddd;
}
.doc-icon {
  width: 24px;
  height: 24px;
  margin-right: 9px;
  object-fit: contain;
  vertical-align: middle;
  flex-shrink: 0;
  background: #fff;
  border-radius: 5px;
  border: 1px solid #eee;
  box-shadow: 0 1px 2px rgba(100,100,140,0.08);
}
.lang-subtabs {
  display: flex;
  justify-content: center;
  gap: 11px;
  margin-bottom: 12px;
}
.subtab-btn {
  padding: 10px 21px;
  background: #f4f8fd;
  color: #6f48e4;
  font-weight: bold;
  border: 1.5px solid #c9d6ff;
  border-radius: 7px 7px 0 0;
  cursor: pointer;
  transition: all 0.14s;
  font-size: 1.07em;
}
.subtab-btn.active, .subtab-btn:hover {
  background: #6f48e4;
  color: #fff;
  border: 1.5px solid #6f48e4;
}
.lang-subtab-content { display: none; }
.lang-subtab-content.active { display: block; }
.see-all-btn {
  background: #e3ecfc;
  color: #2365c4;
  border: none;
  border-radius: 7px;
  padding: 10px 0;
  margin: 10px 0 0 0;
  width: 100%;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 0.5px 2px rgba(36,108,240,0.07);
  transition: background 0.16s;
}
.see-all-btn:hover {
  background: #d6e3fc;
}
/* Modal styles */
.lang-modal-overlay {
  display: none;
  position: fixed;
  z-index: 9999;
  left: 0; top: 0; right: 0; bottom: 0;
  background: rgba(50,40,100,0.22);
  justify-content: center;
  align-items: center;
}
.lang-modal-overlay.active { display: flex; }
.lang-modal-box {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 38px #8c8cce32;
  max-width: 95vw;
  width: 390px;
  padding: 28px 16px 20px 16px;
  position: relative;
  text-align: center;
  animation: modalShow .33s cubic-bezier(.61,1.6,.51,.8);
}
@keyframes modalShow {
  0% { opacity: 0; transform: translateY(60px) scale(.94);}
  100% { opacity: 1; transform: translateY(0) scale(1);}
}
.lang-modal-close {
  position: absolute;
  right: 13px; top: 10px;
  background: none; border: none; font-size: 2.2em; color: #c3b2f7; cursor: pointer;
}
.lang-modal-close:hover { color: #7564c2;}
.lang-modal-box h3 {
  color: #6f48e4;
  font-weight: 900;
  margin-bottom: 16px;
  font-size: 1.22em;
}
.lang-modal-pair {
  background: #f4ebff;
  margin: 0 0 13px 0;
  border-radius: 12px;
  padding: 13px 7px 9px 7px;
  font-size: 1.08em;
  font-weight: 700;
  color: #38306f;
}
.lang-modal-pair strong { color: #2a2a40; font-weight: 900;}
.lang-modal-tag {
  color: #8c6ec7;
  font-size: 0.97em;
  font-weight: 600;
  margin-bottom: 8px;
}
.lang-modal-footer {
  margin-top: 10px;
  font-size: 1.03em;
  color: #7e5ef5;
}
.lang-modal-footer a {
  color: #3965e4;
  font-weight: 700;
  text-decoration: underline;
  margin-left: 7px;
}
@media (max-width: 600px) {
  .docs-langs-section { padding: 11px 1px 12px 1px; }
  .compact-grid { grid-template-columns: repeat(2, 1fr); }
  .dl-section-header h2 { font-size: 1.2em; }
  .lang-modal-box { width:98vw; padding:17px 6px 14px 6px;}
}
/* ---- End Block #{i} ---- */

/* ---- CSS Block #12 ---- */
.video-tabs-section {
  background: #f9fbff;
  padding: 60px 20px;
  text-align: center;
}
.video-tabs-section .section-header h2 {
  font-size: 30px;
  margin-bottom: 10px;
}
.video-tabs-section .section-header p {
  font-size: 16px;
  color: #555;
  margin-bottom: 30px;
}
.video-tab-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-bottom: 30px;
}
.tab-btn {
  padding: 10px 20px;
  background-color: #007bff;
  color: #fff;
  border: none;
  font-size: 15px;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
  min-width: 140px;
}
.tab-btn:hover {
  background-color: #0056b3;
}
.tab-btn.active {
  background-color: #28a745;
  color: #fff;
}
.video-tab-content {
  max-width: 900px;
  margin: 0 auto;
  position: relative;
}
.tab-content {
  display: none;
  animation: fadeIn 0.6s ease-in-out;
}
.tab-content.active {
  display: block;
}
.tab-content iframe {
  width: 100%;
  height: 460px;
  border: none;
  border-radius: 12px;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
}
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* ---- End Block #{i} ---- */

/* ---- CSS Block #13 ---- */
.proz-faq-section-clean {
  background: #fafdff;
  padding: 74px 12px 68px 12px;
  border-radius: 28px;
  max-width: 1300px;
  margin: 60px auto 44px auto;
  box-shadow: 0 6px 32px 0 rgba(23,199,184,0.10),0 2px 8px 0 rgba(59,123,134,0.04);
}
.faq-header {
  text-align: center;
  margin-bottom: 40px;
}
.faq-header h2 {
  font-size: 2.1rem;
  font-weight: 900;
  color: #184a6c;
  margin-bottom: 10px;
  letter-spacing: -0.5px;
}
.faq-header p {
  color: #184a6c;
  font-size: 1.13rem;
  font-weight: 500;
  margin-bottom: 0;
}
.faq-header a {
  color: #00bfa5;
  text-decoration: underline;
}
.faq-columns {
  display: flex;
  gap: 38px;
  justify-content: center;
}
.faq-col {
  flex: 1;
  min-width: 310px;
  max-width: 470px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.faq-card {
  background: #fff;
  border-radius: 17px;
  box-shadow: 0 4px 18px rgba(0,191,165,0.10),0 1px 3px rgba(32,153,184,0.05);
  overflow: hidden;
  transition: box-shadow 0.20s, transform 0.12s;
  margin-bottom: 0;
  border: none;
}
.faq-card:hover, .faq-card.active {
  box-shadow: 0 9px 36px rgba(32,153,184,0.17),0 4px 12px rgba(246,176,60,0.07);
  transform: translateY(-2px) scale(1.016);
}
.faq-q {
  background: none;
  border: none;
  width: 100%;
  padding: 22px 20px 20px 18px;
  text-align: left;
  font-size: 1.11rem;
  font-weight: 700;
  color: #107175;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  cursor: pointer;
  outline: none;
  border-radius: 12px 12px 0 0;
  transition: background 0.11s;
  position: relative;
  z-index: 1;
}
.faq-q span i {
  margin-right: 11px;
  font-size: 1.12em;
}
.faq-q i.fa-plus, .faq-q i.fa-minus {
  font-size: 1.13rem;
  margin-left: 8px;
  color: #00bfa5;
  transition: transform 0.14s;
}
.faq-q[aria-expanded="true"] i.fa-plus {
  display: none;
}
.faq-q[aria-expanded="true"] i.fa-minus {
  display: inline-block;
  color: #fa8901;
  font-weight: bold;
}
.faq-q i.fa-minus {
  display: none;
}
.faq-a {
  background: #fafdff;
  padding: 0 20px 17px 23px;
  color: #24292f;
  font-size: 1.03rem;
  line-height: 1.54;
  display: none;
  animation: faqFadeIn 0.31s;
  border-radius: 0 0 14px 14px;
  box-shadow: 0 1.5px 7px 0 rgba(32,153,184,0.03);
  margin-top: -2px;
  border: none;
}
@keyframes faqFadeIn {
  from { opacity: 0; transform: translateY(-12px);}
  to { opacity: 1; transform: translateY(0);}
}
/* Responsive: 1 column on mobile */
@media (max-width: 900px) {
  .faq-columns {
    flex-direction: column;
    gap: 16px;
    align-items: stretch;
  }
  .faq-col {
    max-width: 100%;
  }
}
/* ---- End Block #{i} ---- */

/* ---- CSS Block #14 ---- */
.proz-dir-section-title {
  text-align: center;
  margin-bottom: 28px;
}
.proz-dir-section-title .main-title {
  font-size: 1.45rem;
  font-weight: 800;
  color: #645fff;
  letter-spacing: 0.5px;
}
.proz-dir-section-title .sub-title {
  font-size: 1.07rem;
  color: #db2b6f;
  margin-top: 6px;
  font-weight: 600;
}
.proz-dir-clean-wrap { padding:60px 0 60px 0; background:#fafdff; }
.proz-dir-clean-main {
  max-width:1080px; margin:0 auto;
  display: flex; gap:40px; align-items:stretch; justify-content:center;
  flex-wrap:wrap;
}
.proz-dir-clean-profile, .proz-dir-clean-contact {
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 2px 16px #ece1f422;
  padding: 34px 32px;
  flex:1 1 340px; min-width:300px; max-width:420px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.proz-dir-clean-profile {
  align-items: center; justify-content: center;
}
.proz-dir-clean-photo {
  width: 102px; height: 102px; border-radius:50%; object-fit:cover;
  border: 3px solid #ede0fa; box-shadow: 0 1.5px 8px #dabdfb2e;
  margin-bottom: 18px;
}
.proz-dir-clean-name { font-size:1.17rem; font-weight:700; color:#645fff; }
.proz-dir-clean-title { font-size:1rem; color:#b49bff; margin-bottom:12px;}
.proz-dir-clean-promise {
  font-size:1.03rem; color:#574b7d; margin-top:9px; text-align:center;
}
.proz-dir-clean-sign { font-family:'Brush Script MT',cursive; color:#db2b6f; font-size:1.08rem; margin-top:5px; }
.proz-dir-clean-contact { align-items:center; }
.proz-dir-clean-title2 {
  font-size:1.13rem; font-weight:800; color:#26223e; text-align:center; margin-bottom:18px; letter-spacing:0.5px;
}
.proz-dir-clean-title2 span { color:#645fff; font-weight:900; }
.proz-dir-clean-actions {
  display:flex; flex-wrap:wrap; gap:13px; margin-bottom:18px; justify-content:center;
}
.proz-dir-clean-btn {
  display:flex; align-items:center; gap:7px; font-weight:700; font-size:1.01rem; border-radius:10px; border:none; outline:none;
  padding:12px 20px; cursor:pointer; box-shadow:0 2px 9px #eee4fd18;
  background:#e4e4e4; color:#272142; transition:background .14s,color .14s;
  text-decoration:none; min-width:140px; justify-content:center;
}
.proz-dir-clean-btn i { font-size:1.28rem; }
.proz-dir-clean-btn.call     { background: #f5e6ee; color: #db2b6f; }
.proz-dir-clean-btn.wa-chat  { background: #e2f7ec; color: #15b67c; }
.proz-dir-clean-btn.callback { background: #fdf6d3; color: #e1a013; }
.proz-dir-clean-btn.email    { background: #e4e8fc; color: #2563eb; }
.proz-dir-clean-btn:hover    { filter: brightness(0.97) contrast(1.04) drop-shadow(0 2px 6px #cfc6ed13);}
.proz-dir-clean-btn:active   { transform: scale(0.98);}
.proz-dir-clean-microcopy {
  font-size:.97rem; color:#615a7a; text-align:center; margin-top:6px; line-height:1.5;
}
@media (max-width:900px) {
  .proz-dir-clean-main { flex-direction:column; gap:30px;}
  .proz-dir-clean-profile, .proz-dir-clean-contact {max-width: 99vw;}
}
.proz-dir-callback-modal {
  display:none; position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:99;
  background:rgba(37,24,68,0.12);align-items:center;justify-content:center;
}
.proz-dir-callback-form {
  background:#fff; border-radius:13px; padding:22px 24px; box-shadow:0 6px 26px #b6a7ff19;
  display:flex;flex-direction:column;gap:10px;min-width:230px;max-width:95vw;
  animation:dirmodalin .32s;
}
@keyframes dirmodalin {0%{transform:translateY(65px);opacity:0;}100%{transform:translateY(0);opacity:1;}}
.proz-dir-callback-form input, .proz-dir-callback-form textarea {
  border:1.2px solid #d6ccf6; border-radius:8px; padding:9px 11px; font-size:1rem; width:100%;
}
.proz-dir-callback-form textarea{min-height:38px;max-height:120px;}
.proz-dir-callback-form button {
  background:#db2b6f; color:#fff;border:none;border-radius:8px; font-size:1.06rem; font-weight:700;
  padding:9px 0;margin-top:3px; cursor:pointer; transition:.13s;
}
.proz-dir-callback-form button:hover{background:#645fff;}
/* ---- End Block #{i} ---- */

/* ---- CSS Block #15 ---- */
.proz-t-head { text-align:center; margin-bottom:38px;}
.proz-t-filterbar { display:flex; gap:11px; justify-content:center; margin-bottom:0px; flex-wrap:wrap;}
.proz-t-filterbar button {
  border:none;outline:none; background:#f3f1fb;color:#655fff;font-weight:600;
  padding:7px 22px; border-radius:19px; font-size:1.0rem; transition:.15s; cursor:pointer;
  box-shadow:0 1px 6px #ece6ff44;
}
.proz-t-filterbar button.active,
.proz-t-filterbar button:hover {
  background:#645fff;color:#fff; box-shadow:0 3px 12px #645fff29; font-weight:700;
}
.proz-t-carousel-wrap {
  position:relative;
  max-width:860px;
  margin:0 auto 35px auto;
  display:flex;align-items:center;justify-content:center;
}
.proz-t-carousel-viewport {
  overflow:visible;
  width:760px;
  max-width:97vw;
  display:flex; justify-content:center; align-items:center;
}
.proz-t-carousel {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
  gap: 0;
}
.proz-t-card {
  background: #fff; border-radius:17px; box-shadow:0 5px 28px #b4a7ef18;
  border:1.1px solid #ece4f9; padding:29px 26px 20px 26px;
  display:flex; flex-direction:column; align-items:flex-start;
  min-width:340px; max-width:370px; width:100%; margin:0 10px;
  min-height:260px; position:relative;
  opacity:1;
  transform: perspective(800px) rotateY(0deg);
  transition: transform 0.7s cubic-bezier(.8,.2,.22,1), opacity 0.4s cubic-bezier(.67,0,.22,1);
  z-index:1;
  backface-visibility: hidden;
  will-change: transform, opacity;
}
.proz-t-card.flip-out-left {
  transform: perspective(800px) rotateY(90deg);
  opacity: 0.4;
  z-index:0;
}
.proz-t-card.flip-out-right {
  transform: perspective(800px) rotateY(-90deg);
  opacity: 0.4;
  z-index:0;
}
.proz-t-card.flip-in {
  transform: perspective(800px) rotateY(0deg) scale(1.01);
  opacity: 1;
  z-index:2;
}
@media (max-width: 800px) {
  .proz-t-carousel-wrap { max-width:99vw;}
  .proz-t-carousel-viewport { width:98vw; max-width:99vw;}
  .proz-t-card { min-width:97vw; max-width:99vw; margin:0 0; padding:18px 4vw 15px 4vw;}
}
.proz-t-avatar {
  width:54px; height:54px; border-radius:50%;
  object-fit:cover; margin-bottom:13px; box-shadow:0 1.5px 6px #ece1fb44;
  border:2px solid #f3f1fa;
}
.proz-t-meta { margin-bottom:7px; font-size:.97rem;}
.proz-t-name { font-weight:700; color:#332a55; margin-right:7px;}
.proz-t-city { color:#856dff; margin-right:7px; font-weight:500;}
.proz-t-flag {font-size:1.08rem;}
.proz-t-badge {
  display:inline-block; background:#f5f4ff; color:#735fff;
  font-size:.85rem; padding:2.5px 9px; border-radius:11px;
  margin-left:2px; font-weight:600; vertical-align:middle;
  margin-bottom:3px; border:1px solid #ede5fa;
}
.proz-t-quote {
  font-size:1.05rem; color:#555275; margin-bottom:12px; line-height:1.5; margin-top:2px;
}
.proz-t-verified {
  font-size:.97rem; color:#22be82; font-weight:600;
  display:flex;align-items:center;gap:3px;
}
.proz-t-verified i {color:#18d993;margin-right:2px;}
/* ---- End Block #{i} ---- */

/* ---- CSS Block #16 ---- */
.proz-blog-slider-section {
  background: #fff;
  padding: 64px 0 48px 0;
  border-radius: 0 0 32px 32px;
}
.proz-blog-slider-header {
  text-align: center;
  margin-bottom: 36px;
}
.proz-blog-slider-header h2 {
  font-size: 1.45rem;
  font-weight: 900;
  color: #22216a;
  margin-bottom: 8px;
}
.proz-blog-slider-header p {
  font-size: 1.09rem;
  color: #454273;
  max-width: 680px;
  margin: 0 auto;
  line-height: 1.6;
}
.proz-blog-slider-container {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  max-width: 1290px;
  margin: 0 auto;
}
.proz-blog-arrow {
  background: #efeeff;
  border: none;
  border-radius: 50%;
  color: #684fff;
  font-size: 1.8rem;
  width: 47px;
  height: 47px;
  margin: 0 12px;
  box-shadow: 0 2px 10px #ecebfa30;
  cursor: pointer;
  transition: background .15s, color .13s, transform .13s;
  z-index: 2;
}
.proz-blog-arrow:hover { background: #684fff; color: #fff; transform: scale(1.08);}
.proz-blog-slider-track {
  display: flex;
  overflow: hidden;
  flex: 1 1 auto;
  min-width: 0;
  scroll-behavior: smooth;
}
.proz-blog-card {
  background: #fafdff;
  border-radius: 19px;
  box-shadow: 0 3px 13px #e3e2fa33;
  width: 300px;
  min-width: 300px;
  margin: 0 14px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: box-shadow .13s, transform .13s;
  position: relative;
}
.proz-blog-card:hover {
  box-shadow: 0 8px 32px #cecfff38;
  transform: translateY(-4px) scale(1.04);
}
.proz-blog-card img {
  width: 100%;
  height: 132px;
  object-fit: cover;
}
.proz-blog-card-body {
  padding: 19px 18px 13px 18px;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}
.proz-blog-card-title {
  font-size: 1.04rem;
  color: #343299;
  font-weight: 800;
  margin-bottom: 10px;
  min-height: 42px;
}
.proz-blog-card-desc {
  color: #4f4976;
  font-size: 0.97rem;
  margin-bottom: 13px;
  flex: 1 1 auto;
}
.proz-blog-readmore {
  color: #684fff;
  font-weight: 700;
  font-size: 1.01rem;
  text-decoration: none;
  margin-top: auto;
  transition: color .13s;
  cursor: pointer;
  display: inline-block;
}
.proz-blog-readmore:hover { color: #db3d5a; }
.proz-blog-dots {
  display: flex;
  gap: 7px;
  justify-content: center;
  margin: 17px 0 0 0;
}
.proz-blog-dot {
  width: 12px; height: 12px;
  border-radius: 50%;
  background: #e6e4fd;
  border: none;
  outline: none;
  cursor: pointer;
  transition: background .15s, box-shadow .13s;
}
.proz-blog-dot.active {
  background: #684fff;
  box-shadow: 0 2px 7px #684fff33;
}
@media (max-width: 1250px) {
  .proz-blog-card,
  .proz-blog-card { width: 240px; min-width: 240px;}
  .proz-blog-slider-container { max-width: 990px;}
}
@media (max-width: 900px) {
  .proz-blog-slider-container { max-width: 720px;}
  .proz-blog-card,
  .proz-blog-card { width: 180px; min-width: 180px;}
  .proz-blog-card img { height: 90px;}
}
@media (max-width: 700px) {
  .proz-blog-slider-section { padding: 24px 0 22px 0;}
  .proz-blog-card { margin: 0 7px; }
  .proz-blog-arrow { width: 38px; height: 38px; font-size: 1.25rem;}
}
@media (max-width: 600px) {
  .proz-blog-slider-header h2 { font-size: 1.09rem; }
  .proz-blog-slider-container { max-width: 96vw;}
  .proz-blog-card,
  .proz-blog-card { width: 93vw; min-width: 93vw;}
  .proz-blog-card img { height: 80px;}
}

/* MODAL STYLES */
.proz-blog-modal {
  display: none;
  position: fixed;
  z-index: 99999;
  left: 0; top: 0;
  width: 100vw; height: 100vh;
  background: rgba(44,45,73,0.54);
  justify-content: center;
  align-items: center;
  animation: fadeInBg .2s;
  /* Allow scrolling inside modal content */
  overflow-y: auto;
}

.proz-blog-modal-content {
  background: #fff;
  border-radius: 19px;
  box-shadow: 0 14px 60px #594fd79b;
  max-width: 540px;
  width: 96vw;
  max-height: 90vh;        /* Key: Limit modal height */
  overflow-y: auto;        /* Key: Enable scrolling */
  padding: 37px 25px 25px 25px;
  position: relative;
  animation: slideInModal .23s;
  /* For small screens: */
  box-sizing: border-box;
}

.proz-blog-modal-close {
  position: absolute;
  top: 14px; right: 18px;
  font-size: 1.8rem;
  background: none;
  border: none;
  color: #db3d5a;
  cursor: pointer;
  transition: color .13s;
  z-index: 10;      /* Keep above scrollable area */
}

.proz-blog-modal-close:hover { color: #684fff; }
.proz-blog-modal-title {
  font-size: 1.25rem;
  font-weight: 900;
  color: #312080;
  margin-bottom: 8px;
}
.proz-blog-modal-img {
  width: 100%;
  border-radius: 11px;
  margin-bottom: 13px;
  object-fit: cover;
  max-height: 180px;
}
.proz-blog-modal-desc {
  color: #44436c;
  font-size: 1.07rem;
  margin-bottom: 13px;
  line-height: 1.7;
}
/* VERTICAL FLIP ANIMATION FOR BLOG SLIDER */
.proz-blog-slider-track {
  perspective: 1200px;
  position: relative;
}
.proz-blog-card {
  transition: transform .52s cubic-bezier(.55,.12,.47,1.19), opacity .31s;
}
.proz-flip-out-up {
  transform: rotateX(90deg);
  opacity: 0;
}
.proz-flip-in-down {
  transform: rotateX(-90deg);
  opacity: 0;
  animation: flipInDownAnim .52s forwards;
}
@keyframes flipInDownAnim {
  0% { transform: rotateX(-90deg); opacity:0; }
  90% { opacity:1; }
  100% { transform: rotateX(0deg); opacity:1; }
}
.proz-blog-cta-block {
  margin: 28px 0 0 0;
  padding: 18px 0 4px 0;
  text-align: center;
}
.proz-blog-cta-block h4 {
  font-size: 1.11rem;
  margin-bottom: 15px;
  color: #684fff;
  font-weight: 800;
}
.proz-blog-cta-block .proz-btn {
  margin: 0 7px 13px 7px;
  display: inline-block;
  min-width: 140px;
}
@media (max-width:600px) {
  .proz-blog-cta-block .proz-btn { min-width: 100px; font-size: 0.92em; }
}

@media (max-width:600px) {
  .proz-blog-modal-close {
    position: sticky;
    top: 8px;
    background: #fff;
    border-radius: 50%;
    z-index: 99;
    float: right;
  }
}
/* ---- End Block #{i} ---- */

/* ---- CSS Block #17 ---- */
/* ==== FORCE NORMAL WEIGHT FOR MODAL FORM FIELDS ==== */
#goaQuoteModal input,
#goaQuoteModal select,
#goaQuoteModal textarea,
#goaQuoteModal label,
#goaQuoteModal option {
  font-weight: 400 !important;
  font-family: 'Inter', Arial, sans-serif !important;
}

/* Modal headings remain bold */
#goaQuoteModal h2,
#goaQuoteModal h3,
#goaQuoteModal .goa-quote-title {
  font-weight: 800 !important;
  color: #00838f !important;
}

/* Fixes for option/optgroup rendering in Chrome/Edge */
#goaQuoteModal select option, 
#goaQuoteModal select optgroup {
  font-weight: 400 !important;
  font-family: 'Inter', Arial, sans-serif !important;
  color: #00838f !important;
}
/* ---- End Block #{i} ---- */
