/* =========================================================
   SECURETECH — RTL STYLES
   All html[dir="rtl"] rules for every page.
   Loaded after style.css and dark-mode.css.
   ========================================================= */


/* =========================================================
   SHARED STYLES (used by several pages)
   ========================================================= */


/* =========================================================
   RTL
========================================================= */

html[dir="rtl"]:where(:not([data-page="contact"], [data-page="products"], [data-page="login"])) .nav-list {
  direction: rtl;
}

html[dir="rtl"] .header-container {
  direction: rtl;
}
/* =========================================================
   PRODUCTS PAGE (products.html)
   ========================================================= */


html[dir="rtl"]:where([data-page="products"]) .nav-list {
  direction: rtl;
}
/* =========================================================
   SHARED STYLES (used by several pages)
   ========================================================= */


html[dir="rtl"] .header-actions {
  direction: rtl;
}
/* =========================================================
   CONTACT PAGE (contact.html)
   ========================================================= */


html[dir="rtl"]:where([data-page="contact"]) .nav-list {
  direction: rtl;
}

html[dir="rtl"]:where([data-page="contact"]) .mobile-navigation {
  direction: rtl;
}
/* =========================================================
   PRODUCTS PAGE (products.html)
   ========================================================= */


html[dir="rtl"]:where([data-page="products"]) .mobile-menu {
  direction: rtl;
}
/* =========================================================
   SHARED STYLES (used by several pages)
   ========================================================= */


html[dir="rtl"]:where(:not([data-page="contact"], [data-page="login"])) .dropdown {
  transform: translateX(-50%) translateY(-8px);
}

html[dir="rtl"]:where(:not([data-page="contact"], [data-page="login"])) .dropdown.open,
html[dir="rtl"]:where(:not([data-page="contact"], [data-page="login"])) .home-nav-item:hover .dropdown,
html[dir="rtl"]:where(:not([data-page="contact"], [data-page="login"])) .home-nav-item:focus-within .dropdown {
  transform: translateX(-50%) translateY(0);
}

html[dir="rtl"]:where(:not([data-page="products"], [data-page="login"])) .mobile-menu {
  direction: rtl;
}
/* =========================================================
   HOME PAGE (index.html)
   ========================================================= */


/* =========================================================
   RTL
========================================================= */

html[dir="rtl"] .security-trust {
  text-align: right;
}

html[dir="rtl"] .security-trust-item::before {
  left: auto;
  right: 0;

  border-radius: 4px 0 0 4px;
}

html[dir="rtl"] .security-trust-arrow {
  transform: scaleX(-1);
}

html[dir="rtl"] .security-trust-item:hover .security-trust-arrow {
  transform: scaleX(-1) translateX(4px);
}

html[dir="rtl"] .security-trust-image-main {
  left: auto;
  right: 0;
}

html[dir="rtl"] .security-trust-image-two {
  right: auto;
  left: 0;
}

html[dir="rtl"] .security-trust-image-three {
  right: auto;
  left: 4%;
}

html[dir="rtl"] .security-trust-frame {
  left: auto;
  right: 18px;

  transform: rotate(2deg);
}

html[dir="rtl"] .security-trust-accent.accent-one {
  left: auto;
  right: -2%;
}

html[dir="rtl"] .security-trust-accent.accent-two {
  right: auto;
  left: -2%;
}

/* =========================================================
   RTL
========================================================= */

html[dir="rtl"] .wcu-command {
  text-align: start;
}

/* =========================================================
   RTL
========================================================= */

html[dir="rtl"] .security-solutions {
  text-align: start;
}

html[dir="rtl"] .security-solutions-eyebrow-line {
  background: linear-gradient(90deg, var(--solutions-accent), transparent);
}

html[dir="rtl"] .security-solutions-eyebrow-line:last-child {
  background: linear-gradient(90deg, transparent, var(--solutions-accent));
}

html[dir="rtl"] .security-solution-card:hover .security-solution-arrow {
  transform: translateX(-4px);
}

/* Flip directional arrow itself */

html[dir="rtl"] .security-solution-arrow svg {
  transform: scaleX(-1);
}

html[dir="rtl"] .sp-nav-item.active::before {
  left: auto;

  right: -1px;

  border-radius: 4px 0 0 4px;
}

html[dir="rtl"] .sp-nav-item.active .sp-nav-arrow {
  transform: translateX(-3px);
}

html[dir="rtl"] .chip-camera {
  left: auto;
  right: 30px;
}

html[dir="rtl"] .chip-alert {
  right: auto;
  left: 28px;
}

html[dir="rtl"] .chip-mobile {
  left: auto;
  right: 48px;
}

html[dir="rtl"] .sp-main-button svg {
  transform: scaleX(-1);
}

html[dir="rtl"] .sp-main-button:hover svg {
  transform: scaleX(-1) translateX(4px);
}

@media (max-width: 640px) {

  html[dir="rtl"] .chip-camera {
    left: auto;

    right: 14px;
  }

  html[dir="rtl"] .chip-alert {
    right: auto;

    left: 13px;
  }

  html[dir="rtl"] .chip-mobile {
    left: auto;

    right: 25px;
  }
}

/* =========================================================
   RTL
========================================================= */

html[dir="rtl"] .sp-control {
  text-align: right;
}

html[dir="rtl"] .sp-package-nav {
  text-align: right;
}

html[dir="rtl"] .sp-nav-item {
  text-align: right;
}

html[dir="rtl"] .sp-nav-arrow {
  transform: scaleX(-1);
}

html[dir="rtl"] .sp-info-heading {
  direction: rtl;
}

html[dir="rtl"] .sp-price {
  text-align: left;
}

html[dir="rtl"] .sp-info-footer {
  direction: rtl;
}

/* =========================================================
   RTL
========================================================= */

html[dir="rtl"] .st-trust-feature-content {
  padding-right: 0;
  padding-left: 50px;
}

html[dir="rtl"] .st-trust-giant-quote {
  left: auto;
  right: 40px;
}

html[dir="rtl"] .st-trust-check {
  margin-left: 0;
  margin-right: 20px;
}

html[dir="rtl"] .st-trust-seal {
  margin-left: 0;
  margin-right: auto;
}

html[dir="rtl"] .st-trust-mini-index,
html[dir="rtl"] .st-trust-statement-number {
  right: auto;
  left: 20px;
}

@media (max-width: 1024px) {

  html[dir="rtl"] .st-trust-feature-content {
    padding-left: 30px;
  }
}

@media (max-width: 700px) {

  html[dir="rtl"] .st-trust-feature-content {
    padding: 0;
  }

  html[dir="rtl"] .st-trust-check {
    margin: 5px 56px 0 0;
  }
}

@media (max-width: 420px) {

  html[dir="rtl"] .st-trust-giant-quote {
    left: auto;
    right: 20px;
  }
}

/* =========================================================
   RTL
========================================================= */

html[dir="rtl"] .st-cta-container {
  direction: rtl;
}

html[dir="rtl"] .st-cta-panel {
  margin-left: 0;

  margin-right: -70px;
}

html[dir="rtl"] .st-cta-visual-bottom {
  right: 35px;
  left: 35px;
}

html[dir="rtl"] .st-cta-panel-footer {
  right: 65px;
  left: 65px;
}

html[dir="rtl"] .st-cta-geometry {
  right: auto;

  left: -85px;
}

html[dir="rtl"] .st-cta-arrow {
  transform: scaleX(-1);
}

html[dir="rtl"] .st-cta-primary:hover .st-cta-arrow {
  transform: scaleX(-1) translateX(3px);
}

@media (max-width: 1050px) {

  html[dir="rtl"] .st-cta-panel {
    margin-right: -45px;

    margin-left: 0;
  }
}

@media (max-width: 820px) {

  html[dir="rtl"] .st-cta-panel {
    margin-right: 0;
  }
}

@media (max-width: 600px) {

  html[dir="rtl"] .st-cta-panel {
    margin-right: 0;
  }

  html[dir="rtl"] .st-cta-geometry {
    right: auto;
    left: -55px;
  }
}

@media (max-width: 600px) {

  html[dir="rtl"] .st-cta-panel {
    margin-right: 0;
    margin-left: 0;
  }
}
/* =========================================================
   HOME PAGE 2 (index1.html)
   ========================================================= */


/* =========================================================
   RTL OVERLAY
========================================================= */

html[dir="rtl"] .st-hero-overlay {
  background: linear-gradient(
    270deg,
    rgba(5, 12, 24, 0.96) 0%,
    rgba(5, 12, 24, 0.84) 36%,
    rgba(5, 12, 24, 0.58) 65%,
    rgba(5, 12, 24, 0.78) 100%
  );
}

html[dir="rtl"]:not([data-theme="dark"]) .st-hero-overlay {
  background: linear-gradient(
    270deg,
    rgba(245, 248, 252, 0.94) 0%,
    rgba(245, 248, 252, 0.83) 38%,
    rgba(245, 248, 252, 0.5) 66%,
    rgba(15, 23, 42, 0.35) 100%
  );
}

/* =========================================================
   RTL
========================================================= */

html[dir="rtl"] .fp-feature-card:hover .fp-feature-image::before,
html[dir="rtl"] .fp-product-card:hover .fp-card-image::before {
  transform: scale(1.07);
}

/* =========================================================
   RTL
========================================================= */

html[dir="rtl"] .sib-intro,
html[dir="rtl"] .sib-flow,
html[dir="rtl"] .sib-bottom {
  direction: rtl;
}

html[dir="rtl"] .sib-benefit {
  direction: rtl;
}

html[dir="rtl"] .sib-benefit:hover .sib-benefit-arrow {
  transform: translateX(-4px);
}

html[dir="rtl"] .sib-cta:hover svg {
  transform: translateX(-4px);
}

/* =========================================================
   RTL
========================================================= */

html[dir="rtl"] .pi-header,
html[dir="rtl"] .pi-main,
html[dir="rtl"] .pi-footer {
  direction: rtl;
}

html[dir="rtl"] .pi-step {
  direction: rtl;
}

/* Step heading/description are English sentences — isolate them as
   an LTR run so trailing punctuation doesn't flip to the front,
   while keeping them visually right-aligned to match the RTL layout. */
html[dir="rtl"] .pi-step-content h3,
html[dir="rtl"] .pi-step-content p {
  direction: ltr;
  text-align: right;
}

/* Same fix for the "From survey to secure." process heading — only
   isolate direction, don't force text-align since the mobile
   breakpoint already centers this element and its parent. */
html[dir="rtl"] .pi-process-heading strong {
  direction: ltr;
}

html[dir="rtl"] .pi-cta:hover svg {
  transform: translateX(-4px);
}

/* =========================================================
   RTL
========================================================= */

html[dir="rtl"] .st-client {
  text-align: end;
}

html[dir="rtl"] .st-testi-heading {
  text-align: center;
}

/* =========================================================
   RTL
   GLOBAL HTML DIR
========================================================= */

html[dir="rtl"] .st-center-cta-label {
  flex-direction: row-reverse;
}

html[dir="rtl"] .st-center-cta-primary svg {
  transform: scaleX(-1);
}

html[dir="rtl"] .st-center-cta-secondary svg {
  transform: scaleX(-1);
}

html[dir="rtl"] .st-center-cta-secondary:hover svg {
  transform: scaleX(-1) translateX(4px);
}
/* =========================================================
   CONTACT PAGE (contact.html)
   ========================================================= */

html[dir="rtl"] .st-contact-kicker-line {
  background: linear-gradient(90deg, #06b6d4, transparent);
}
html[dir="rtl"] .st-contact-eyebrow-line {
  background: linear-gradient(90deg, #2563eb, transparent);
}
html[dir="rtl"] .st-contact-submit:hover svg {
  transform: translateX(-4px);
}
/* =========================================================
   INSTALLATION PAGE (installation.html)
   ========================================================= */
 /* ========================================================= RTL KICKER LINE ========================================================= */
html[dir="rtl"] .st-installation-kicker-line {
  background: linear-gradient(90deg, #06b6d4, transparent);
} /* ========================================================= RTL SUPPORT Global direction comes from <html dir=""> ========================================================= */
html[dir="rtl"] .st-setup-card-content {
  text-align: start;
}
html[dir="rtl"] .st-setup-trust-item {
  text-align: start;
}

/* =========================================================
   RTL
========================================================= */

html[dir="rtl"] .st-install-command-visual[data-install-reveal] {
  transform: translateX(35px);
}

html[dir="rtl"] .st-install-command-content[data-install-reveal] {
  transform: translateX(-35px);
}

html[dir="rtl"]:where([data-page="installation"]) [data-install-reveal].is-visible {
  transform: translate(0);
}

html[dir="rtl"] .st-install-command-process::before {
  inset-inline-start: auto;

  inset-inline-end: 24px;
}

@media (max-width: 600px) {

  /* -------------------------------------------------------
     RTL PROCESS LINE
  ------------------------------------------------------- */

  html[dir="rtl"] .st-install-command-process::before {
    inset-inline-start: auto;

    inset-inline-end: 23px;
  }

  html[dir="rtl"] .st-install-command-visual[data-install-reveal],
  html[dir="rtl"] .st-install-command-content[data-install-reveal] {
    transform: translateY(25px);
  }

  /* FIX: revealed state must reset the RTL mobile offset */
  html[dir="rtl"] .st-install-command-visual[data-install-reveal].is-visible,
  html[dir="rtl"] .st-install-command-content[data-install-reveal].is-visible {
    transform: translateY(0);
  }
}

/* =========================================================
RTL
========================================================= */

html[dir="rtl"] .st-install-faq-eyebrow {
  direction: rtl;
}

html[dir="rtl"] .st-install-faq-heading-row,
html[dir="rtl"] .st-install-faq-layout {
  direction: rtl;
}

html[dir="rtl"] .st-install-faq-question-left {
  direction: rtl;
}

html[dir="rtl"] .st-install-faq-answer-inner {
  text-align: start;
} /* ========================================================= RTL BUTTON ICON ========================================================= */
html[dir="rtl"] .st-install-cta__button:hover .st-install-cta__button-icon {
  transform: translateX(-3px);
} /* ========================================================= RTL SUPPORT No section-specific JavaScript required ========================================================= */
html[dir="rtl"] .st-install-cta__content {
  text-align: center;
}
html[dir="rtl"] .st-install-cta__title,
html[dir="rtl"] .st-install-cta__description {
  text-align: center;
}
/* =========================================================
   PACKAGES PAGE (packages.html)
   ========================================================= */
 /* ========================================================= RTL ========================================================= */
html[dir="rtl"] .st-packages-hero-content {
  direction: rtl;
}
html[dir="rtl"] .st-packages-breadcrumb {
  direction: rtl;
} /* ========================================================= RTL Global html[dir] controls the entire section. ========================================================= */
html[dir="rtl"] .st-package-button:hover .st-package-arrow {
  transform: translate(-3px, -3px);
}
html[dir="rtl"] .st-package-card-link:hover span {
  transform: translateX(-4px);
}

html[dir="rtl"] .st-matrix-link:hover svg {
  transform: scaleX(-1) translateX(4px);
}

html[dir="rtl"] .st-matrix-cta:hover svg {
  transform: scaleX(-1) translateX(4px);
}

/* =========================================================
   RTL
========================================================= */

html[dir="rtl"] .st-matrix-card {
  text-align: right;
}

html[dir="rtl"] .st-matrix-header {
  text-align: center;
}

html[dir="rtl"] .st-matrix-link svg,
html[dir="rtl"] .st-matrix-cta svg {
  transform: scaleX(-1);
}

html[dir="rtl"] .st-featured-badge {
  border-end-end-radius: 0;
  border-end-start-radius: 10px;
} /* ========================================================= RTL ========================================================= */
html[dir="rtl"] .st-included {
  text-align: right;
}
html[dir="rtl"] .st-included-header {
  text-align: center;
}
html[dir="rtl"] .st-item-text p {
  margin-inline-start: 0;
}
html[dir="rtl"] .st-included-button svg {
  transform: scaleX(-1);
}
html[dir="rtl"] .st-included-button:hover svg {
  transform: scaleX(-1) translateX(4px);
} /* ========================================================= GLOBAL RTL ========================================================= */
html[dir="rtl"] .st-ready-btn-primary svg {
  transform: rotate(180deg);
}
html[dir="rtl"] .st-ready-btn-primary:hover svg {
  transform: rotate(180deg) translateX(4px);
}
/* =========================================================
   PRODUCTS PAGE (products.html)
   ========================================================= */


/* RTL kicker line */

html[dir="rtl"] .st-products-kicker-line {
  background: linear-gradient(90deg, #06b6d4, transparent);
}
html[dir="rtl"] .st-fp-command-mini:hover {
  transform: translateX(4px);
}
html[dir="rtl"] .st-fp-mini-content a:hover span {
  transform: translateX(-4px);
}
html[dir="rtl"]:where([data-page="products"]) [data-reveal="left"] {
  transform: translateX(-35px);
}
html[dir="rtl"]:where([data-page="products"]) [data-reveal="right"] {
  transform: translateX(35px);
}
html[dir="rtl"]:where([data-page="products"]) [data-reveal="left"] {
  transform: translateX(-45px);
}
html[dir="rtl"]:where([data-page="products"]) [data-reveal="right"] {
  transform: translateX(45px);
} /* ========================================================= RTL — VISUAL BALANCE ========================================================= */
html[dir="rtl"] .st-why-image-small-one {
  transform: rotate(2deg);
}
html[dir="rtl"] .st-why-image-small-one:hover {
  transform: rotate(0deg) translateY(-5px);
}
html[dir="rtl"] .st-why-image-small-two {
  transform: rotate(-2deg);
}
html[dir="rtl"] .st-why-image-small-two:hover {
  transform: rotate(0deg) translateY(-5px);
}
html[dir="rtl"]:where([data-page="products"]) [data-reveal="left"] {
  transform: translateX(-40px);
}
html[dir="rtl"]:where([data-page="products"]) [data-reveal="right"] {
  transform: translateX(40px);
} /* ========================================================= RTL MICRO ADJUSTMENTS ========================================================= */
html[dir="rtl"] .st-compare-product-head {
  text-align: right;
}
html[dir="rtl"] .st-compare-bottom-status {
  text-align: right;
}
html[dir="rtl"]:where([data-page="products"]) [data-reveal="left"] {
  transform: translateX(-40px);
} /* ========================================================= RTL ========================================================= */
html[dir="rtl"] .st-faq-question {
  text-align: right;
}
html[dir="rtl"] .st-faq-system {
  direction: rtl;
}
html[dir="rtl"] .st-faq-bottom-content {
  text-align: right;
} /* ========================================================= RTL MOBILE ========================================================= */
@media (max-width: 700px) {
  html[dir="rtl"] .st-faq-bottom-content {
    text-align: center;
  }
}
html[dir="rtl"]:where([data-page="products"]) [data-reveal="left"] {
  transform: translateX(-45px);
}
html[dir="rtl"]:where([data-page="products"]) [data-reveal="right"] {
  transform: translateX(45px);
} /* ========================================================= RTL ========================================================= */
html[dir="rtl"] .st-call-content {
  text-align: start;
}
@media (max-width: 700px) {
  html[dir="rtl"] .st-call-content {
    text-align: center;
  }
  html[dir="rtl"] .st-call-features {
    text-align: right;
  }
}

/* FIX: revealed elements must return to their final position in RTL
   (the RTL start offsets above were overriding the .is-visible state) */
html[dir="rtl"]:where([data-page="products"]) [data-reveal]:where(.is-visible) {
  transform: translate3d(0, 0, 0);
}
/* =========================================================
   SHARED STYLES (used by several pages)
   ========================================================= */
 /* ========================================================= RTL BUTTON ARROW ========================================================= */
html[dir="rtl"] .site-footer .footer-button-arrow {
  display: inline-block;
  transform: scaleX(-1);
}

html[dir="rtl"] .site-footer .footer-survey-button:hover .footer-button-arrow {
  transform: scaleX(-1) translateX(4px);
} /* ========================================================= RTL LINK HOVER ========================================================= */
html[dir="rtl"] .site-footer .footer-links a:hover {
  transform: translateX(-3px);
}
html[dir="rtl"] .site-footer .footer-links a::before {
  content: "‹";
  transform: translateX(4px);
}
html[dir="rtl"] .site-footer .footer-links a:hover::before {
  transform: translateX(0);
}
/* =========================================================
   LOGIN PAGE (login.html)
   ========================================================= */


/* =========================================================
   RTL
   ========================================================= */

html[dir="rtl"] .visual-content,
html[dir="rtl"] .login-heading,
html[dir="rtl"] .login-form {
  text-align: right;
}

html[dir="rtl"] .login-submit {
  flex-direction: row-reverse;
}

@media (max-width: 600px) {
  html[dir="rtl"] .visual-content {
    text-align: center;
  }

  html[dir="rtl"] .login-heading {
    text-align: center;
  }

  html[dir="rtl"] .login-heading p {
    margin-inline: auto;
  }
}

/* =========================================================
   RTL — LOGIN / REGISTER / NEW PAGES
   ========================================================= */

/* Input text must clear the icon, which sits on the right in RTL */
html[dir="rtl"] .input-wrap input {
  padding: 0 48px 0 52px;
}

/* Keep the natural RTL order (text first, arrow at the end)
   and point the arrow the right way */
html[dir="rtl"] .login-submit {
  flex-direction: row;
}

html[dir="rtl"] .login-submit .button-arrow,
html[dir="rtl"] .st-flip-rtl,
html[dir="rtl"] .st-pd-nav svg {
  transform: scaleX(-1);
}

html[dir="rtl"] .st-pd-spec-list dd {
  text-align: start;
}

html[dir="rtl"] .st-soon-form input {
  text-align: right;
}

/* =========================================================
   RTL — HOMEPAGE HERO (index.html)
   Previously had zero RTL coverage at all.
   ========================================================= */

html[dir="rtl"] .shield-bg-light {
  right: auto;
  left: -180px;
}

html[dir="rtl"] .shield-hero-overlay {
  background: linear-gradient(
    270deg,
    rgba(5, 15, 24, 0.94) 0%,
    rgba(5, 15, 24, 0.82) 38%,
    rgba(5, 15, 24, 0.58) 68%,
    rgba(5, 15, 24, 0.78) 100%
  );
}

html[dir="rtl"][data-theme="dark"] .shield-hero-overlay {
  background: linear-gradient(
    270deg,
    rgba(2, 8, 14, 0.97) 0%,
    rgba(2, 8, 14, 0.88) 42%,
    rgba(2, 8, 14, 0.68) 72%,
    rgba(2, 8, 14, 0.86) 100%
  );
}

html[dir="rtl"] .shield-image-carousel {
  margin-left: 0;
  margin-right: auto;
}

html[dir="rtl"] .carousel-prev {
  left: auto;
  right: 20px;
}

html[dir="rtl"] .carousel-next {
  right: auto;
  left: 20px;
}

html[dir="rtl"] .carousel-arrow svg {
  transform: scaleX(-1);
}

@media (max-width: 600px) {
  html[dir="rtl"] .carousel-prev {
    left: auto;
    right: 13px;
  }

  html[dir="rtl"] .carousel-next {
    right: auto;
    left: 13px;
  }
}