:root{--bg:#0B1F3A;--bg-soft:#0f2747;--fg:#fff;--muted:#cdd7e3;--accent:#2EC4B6;--accent2:#6EE7F1;--border:#163154;--card:#0e2140;--pill:rgba(255,255,255,.1);--shadow:0 10px 30px rgba(0,0,0,.35)}
*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--fg);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,'Noto Sans',sans-serif}
a{color:inherit}img{max-width:100%;display:block}.container{max-width:1120px;margin:0 auto;padding:0 16px}
header.sticky{position:sticky;top:0;background:rgba(11,31,58,.75);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);z-index:40}
nav a{text-decoration:none;margin:0 12px;color:var(--muted);font-weight:600}nav a:hover{color:var(--fg)}
.btn{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:999px;text-decoration:none;font-weight:700;border:1px solid transparent;box-shadow:var(--shadow);transition:transform .08s ease,background .2s ease,color .2s ease}
.btn:active{transform:translateY(1px)}.btn.brand{background:var(--accent);color:#0a172b}.btn.brand:hover{background:var(--accent2)}.btn.ghost{background:transparent;border-color:rgba(255,255,255,.35);color:var(--fg)}.btn.ghost:hover{background:rgba(255,255,255,.08)}
.badge{display:inline-block;background:var(--pill);border:1px solid rgba(255,255,255,.2);padding:6px 12px;border-radius:999px;font-size:12px;margin:6px 6px 0 0;color:var(--muted)}
.card{background:var(--card);border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow)}.card .body{padding:18px; overflow:visible; max-width:100%;}
.split{display:grid;grid-template-columns:1fr;gap:24px}@media(min-width:920px){.split{grid-template-columns:1.2fr .8fr}}
.grid4{display:grid;grid-template-columns:1fr;gap:14px}@media(min-width:920px){.grid4{grid-template-columns:repeat(4,1fr)}}
.hero-logo{width:68px;height:68px;border-radius:12px;overflow:hidden;border:none;box-shadow:var(--shadow);background:#102849;display:grid;place-items:center}
h1{font-size:40px;line-height:1.12;margin:0 0 12px}h2{font-size:28px;margin:0 0 12px}p.lead{color:var(--muted);font-size:18px}.muted{color:var(--muted)}
.kbd{white-space:nowrap;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.15);padding:2px 6px;border-radius:6px}
.aspect-video{aspect-ratio:16/9;width:100%;border-radius:12px;overflow:hidden}.iframe-wrap{width:100%;height:100%;border:0}
footer{border-top:1px solid var(--border);background:#0a1d37}.mainpad{padding:54px 0 28px}.crumbs{font-size:12px;color:var(--muted);margin-bottom:10px}
.footer-wrap{padding:16px;display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.telegram-float{position:fixed;bottom:24px;left:24px;width:55px;height:55px;border-radius:50%;background-color:#229ED9;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 15px rgba(0,0,0,0.3);z-index:999;transition:transform .2s ease, box-shadow .2s ease}
.telegram-float:hover{transform:scale(1.08);box-shadow:0 0 12px #2EC4B6}.telegram-float img{width:28px;height:28px}
h1{ font-size: clamp(24px, 3.5vw, 40px); line-height: 1.2; }h2{ font-size: clamp(20px, 2.4vw, 28px); }body,p,li{ font-size: clamp(14px, 1.6vw, 16px); }
.menu-toggle{ display:none; border:1px solid rgba(255,255,255,.35); background:transparent; color:#fff; padding:10px 12px; border-radius:10px; font-weight:700; }.mobile-menu{ display:none; }
@media (max-width:768px){.menu-toggle{ display:inline-flex; align-items:center; gap:8px; }.hide-mobile{ display:none; }.mobile-menu{ display:block; position:fixed; inset:0; background:rgba(10,29,55,.96); backdrop-filter:blur(8px); z-index:50; transform:translateY(-100%); transition:transform .2s ease; border-top:1px solid var(--border); }.mobile-menu.open{ transform:none; }.mobile-menu .inner{ max-width:1120px; margin:0 auto; padding:18px 16px; }.mobile-menu a{ display:block; padding:14px 8px; border-bottom:1px solid rgba(255,255,255,.08); text-decoration:none; color:#fff; font-weight:700; }.mobile-menu .close{ display:inline-flex; margin:10px 0 6px; border:1px solid rgba(255,255,255,.35); padding:10px 12px; border-radius:10px; color:#fff; background:transparent; font-weight:700; } header .btn.brand{ white-space:nowrap; padding:10px 14px; justify-content:center; }}
@media (max-width:920px){.container{ padding-left: 28px !important; padding-right: 28px !important; max-width:100%; } header.sticky .container{ padding-left: 22px !important; padding-right: 22px !important; } .crumbs, h1, h2, p, li{ padding-left:0 !important; padding-right:0 !important; margin-left:0; margin-right:0; } .mainpad{ padding:28px 0 22px; } .card .body{ padding:16px; } .badge{ font-size:11px; padding:5px 10px; } .btn{ padding:12px 16px; } #faq-tabs .btn, #pane .btn{ width: 100% !important; max-width: 100% !important; min-height: 74px !important; height: auto !important; font-size: clamp(14px, 2.5vw, 16px) !important; white-space: normal !important; word-break: break-word !important; overflow-wrap: anywhere !important; line-height: 1.25 !important; padding: 12px !important; text-align: center !important; box-sizing: border-box !important; } #pane button.btn[style*="grid-column"]{ width:100% !important; padding:12px !important; } .aspect-video{ border-radius:10px; } .telegram-float{ bottom:16px; left:16px; }}
html{ scroll-behavior: smooth; } .answer-pop{ background: rgba(46,196,182,.08); border: 1px solid #2EC4B6; border-radius: 12px; padding: 16px; box-shadow: 0 0 0 3px rgba(46,196,182,.15); animation: answerPulse 800ms ease; } .answer-title{ display: inline-block; background: #2EC4B6; color: #0B1F3A; font-weight: 800; font-size: 12px; padding: 4px 8px; border-radius: 999px; margin-bottom: 8px; } @keyframes answerPulse{ 0%{ box-shadow: 0 0 0 0 rgba(46,196,182,0.0); } 50%{ box-shadow: 0 0 0 6px rgba(46,196,182,0.25); } 100%{ box-shadow: 0 0 0 0 rgba(46,196,182,0.0); } }

#pane .content{padding:16px;}

#pane > div{width:100%;}


/* Center text for Go Back and Send Message buttons on contact form */



/* Center text for Go Back and Send Message buttons on contact form with fixed height */


/* Responsive: shrink button height on smaller screens */



/* Strict centering for contact form primary buttons */



/* Center and balanced height for contact form buttons */


@media (max-width: 500px) {
  
}


/* Center and balanced height for contact form buttons (60px desktop) */
#sendBtn, #backBtn {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  height: 60px;
  padding: 0 1.2em;
  box-sizing: border-box;
  line-height: 1.1;
}

@media (max-width: 500px) {
  #sendBtn, #backBtn {
    height: auto;
    padding: 0.6em 1.2em;
  }
}


/* Contact choices panel */
.contact-choices { max-width: 720px; margin: 0 auto; padding: 12px; border: 0; background: transparent; }
.contact-choices__title { text-align: center; margin: 8px 0 16px; }
.contact-choices__grid { display: grid; grid-template-columns: 1fr; gap: 12px; margin-top: 8px; }
.contact-choices__btn { display:inline-flex; align-items:center; justify-content:center; height:70px; padding:0 16px; border-radius:12px; font-weight:700; text-decoration:none; text-align:center; transition: transform .05s ease, opacity .15s ease; width:100%; box-sizing:border-box; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.contact-choices__btn--primary { background:#fff; color:#14a1cc; border:1px solid #14a1cc; }
.contact-choices__btn--primary:hover { background:#14a1cc; color:#fff; }
.contact-choices__btn--outline { background:#fff; color:#14a1cc; border:1px solid #14a1cc; }
.contact-choices__btn--outline:hover { background:#14a1cc; color:#fff; }
.contact-choices__hint { text-align:center; margin-top:10px; opacity:.75; }
.contact-choices__address { text-align:center; margin-top:6px; font-size:.95rem; }
.contact-choices__back { margin-top:14px; width:100%; height:60px; border-radius:12px; border:1px solid rgba(0,0,0,.12); background:#fff; font-weight:700; cursor:pointer; }
@media (min-width: 680px) { .contact-choices__grid { grid-template-columns: 1fr 1fr; } }


/* Contact two-option panel back link */
.contact-backlink {
  display:inline-block;
  margin-bottom: 8px;
  font-weight: 600;
  text-decoration: none;
  color: #14a1cc;
}
.contact-backlink:hover { text-decoration: underline; }


/* Ensure 'Start Now' button wraps on small screens instead of pushing layout */
@media (max-width: 520px) {
  .nav .cta, .nav .start-now, .nav .btn-cta, .navbar .cta, .navbar .start-now, .navbar .btn-cta, a.start-now {
    white-space: normal !important;
    word-break: keep-all;
    overflow-wrap: anywhere;
    line-height: 1.2;
    padding-top: 10px;
    padding-bottom: 10px;
    max-width: 60vw;     /* prevent edge overflow */
    text-align: center;
  }
  /* If the button is inside a flex row, prevent it from forcing horizontal scroll */
  .nav, .navbar { flex-wrap: wrap; }
}

/* === Mobile Chrome overflow fix pack (2025-11-06) === */

/* Guard against horizontal scroll driven by any child */
html, body { overflow-x: hidden; }

/* Allow header row to wrap and prevent children from enforcing min-content width */
header .container { display: flex; flex-wrap: wrap; gap: 10px; min-width: 0; }
header nav { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; min-width: 0; }
header .hero-logo, header nav a, header .btn { min-width: 0; }

/* CRITICAL: let CTA wrap & cap width so it never stretches the viewport */
header .btn.brand {
  white-space: normal;         /* override previous nowrap */
  max-width: calc(100vw - 32px);
  overflow-wrap: anywhere;
  text-align: center;
}

/* Extra safety for very small phones */
@media (max-width: 420px) {
  header .btn.brand {
    font-size: clamp(12px, 3.5vw, 14px);
    padding: clamp(8px, 2.4vw, 10px) clamp(12px, 4.5vw, 16px);
    line-height: 1.2;
  }
}

/* Optional: icon-only variant below 360px. Comment out if not desired. */
/*
@media (max-width: 360px) {
  header .btn.brand { padding: 8px 10px; }
  header .btn.brand::before {
    content: "🚀 "; font-size: 1em;
  }
  header .btn.brand { white-space: nowrap; max-width: none; }
}
*/

/* Flex/grid children should be allowed to shrink in Chrome */
.container, .row, .grid, .grid4, nav { min-width: 0; }

/* Help long words/URLs wrap */
a, p, li { overflow-wrap: anywhere; word-break: break-word; }

/* Ensure images and embeds never overflow */
img, video, iframe { max-width: 100%; height: auto; display: block; }

/* Avoid Chrome text autosizing from breaking layout */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }