/* Guest layout styles extracted from resources/views/desktop/layouts/guest.blade.php. */

         html, body {
            overflow-x: hidden;
            width: 100%;
            position: relative;
         }
         .hnum {
             width: 40px; height: 40px; border-radius: 50%;
             background: rgba(139, 92, 246, 0.15);
             color: var(--pur); font-weight: bold;
             display: flex; align-items: center; justify-content: center;
             margin: 0 auto 15px; font-size: 1.2rem;
          }

          .tech-icons a {
             color: inherit;
             text-decoration: none;
             display: flex;
             align-items: center;
             transition: transform 0.2s ease, color 0.2s ease;
          }

          .tech-icons a:hover {
             transform: translateY(-3px) scale(1.1);
             color: var(--hero-tech-color, #000000);
          }

          #heroInstallBtn.is-disabled {
             cursor: not-allowed;
             opacity: 0.72;
          }

         #developers.sp {
            --developers-card-bg: rgba(255, 255, 255, 0.96);
            --developers-card-border: rgba(37, 99, 235, 0.14);
            --developers-card-shadow: 0 20px 48px rgba(15, 23, 42, 0.1);
            --developers-text: #0f172a;
            --developers-muted: #475569;
            --developers-kicker: #2563eb;
            --developers-photo-shadow: 0 16px 32px rgba(15, 23, 42, 0.16);
         }

         html:not(.lm) #developers.sp {
            --developers-card-bg: rgba(15, 23, 42, 0.82);
            --developers-card-border: rgba(96, 165, 250, 0.24);
            --developers-card-shadow: 0 22px 54px rgba(0, 0, 0, 0.32);
            --developers-text: #f8fafc;
            --developers-muted: #cbd5e1;
            --developers-kicker: #60a5fa;
            --developers-photo-shadow: 0 18px 36px rgba(0, 0, 0, 0.38);
         }

         @media (min-width: 992px) {
            #developers.sp {
               padding: 86px 0 96px;
            }

            #developers .container {
               max-width: 1220px;
            }

            #developers .text-center.mb-5 {
               margin-bottom: 46px !important;
            }

            #developers .slbl {
               color: var(--developers-kicker) !important;
               font-size: 0.83rem;
               font-weight: 900;
               letter-spacing: 0;
            }

            #developers .stitle {
               color: var(--developers-text);
               line-height: 1.02;
               margin-top: 16px;
               text-shadow: 0 10px 18px rgba(15, 23, 42, 0.12);
            }

            html:not(.lm) #developers .stitle {
               text-shadow: 0 12px 22px rgba(0, 0, 0, 0.28);
            }

            #developers .developers-grid {
               display: grid;
               grid-template-columns: repeat(3, minmax(0, 1fr));
               gap: 18px;
               align-items: stretch;
            }
         }

         #developers .developers-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 18px;
         }

         #developers .developer-card-wrap,
         #developers .developer-card {
            min-width: 0;
         }

         #developers .developer-card {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            text-align: center;
            background: var(--developers-card-bg) !important;
            border: 1px solid var(--developers-card-border) !important;
            border-radius: 8px !important;
            box-shadow: var(--developers-card-shadow);
            transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
         }

         @media (min-width: 992px) {
            #developers .developer-card {
               min-height: 352px;
               padding: 30px 30px 28px !important;
            }

            #developers .developer-card:hover {
               transform: translateY(-6px);
               border-color: rgba(37, 99, 235, 0.32) !important;
               box-shadow: 0 28px 62px rgba(15, 23, 42, 0.16);
            }

            html:not(.lm) #developers .developer-card:hover {
               border-color: rgba(96, 165, 250, 0.42) !important;
               box-shadow: 0 28px 62px rgba(0, 0, 0, 0.42);
            }
         }

         #developers .developer-photo {
            width: 150px;
            height: 150px;
            object-fit: cover;
            background: #ffffff;
            box-shadow: var(--developers-photo-shadow);
         }

         @media (min-width: 992px) {
            #developers .developer-photo {
               width: 142px;
               height: 142px;
               margin-bottom: 22px !important;
            }
         }

         #developers .developer-card h6,
         #developers .developer-card p {
            max-width: 100%;
            overflow-wrap: anywhere;
         }

         #developers .developer-card h6 {
            color: var(--developers-text);
            font-size: 1.03rem;
            line-height: 1.25;
         }

         #developers .developer-role {
            color: var(--developers-muted) !important;
            font-weight: 700;
            letter-spacing: 0;
         }

         #developers .developer-bio {
            color: var(--developers-muted) !important;
            max-width: 360px;
            margin-bottom: 0;
         }

         @media (max-width: 767.98px) {
            #developers .developers-grid {
               gap: 8px;
            }

            #developers .developer-card {
               padding: 14px 8px !important;
            }

            #developers .developer-photo {
               width: clamp(72px, 24vw, 96px);
               height: clamp(72px, 24vw, 96px);
               margin-bottom: 10px !important;
               border-width: 3px !important;
            }

            #developers .developer-card h6 {
               font-size: clamp(0.66rem, 2.4vw, 0.78rem);
               line-height: 1.18;
            }

            #developers .developer-role {
               font-size: clamp(0.6rem, 2.2vw, 0.72rem) !important;
               line-height: 1.2;
               margin-bottom: 8px !important;
            }

            #developers .developer-bio {
               font-size: clamp(0.58rem, 2vw, 0.68rem) !important;
               line-height: 1.35 !important;
               margin-bottom: 0 !important;
            }
         }

         @media (max-width: 380px) {
            #developers .developers-grid {
               gap: 6px;
            }

            #developers .developer-card {
               padding: 10px 5px !important;
            }
         }

         #landing #faq {
            --faq-section-bg: #eef4fb;
            --faq-card-bg: rgba(255, 255, 255, 0.96);
            --faq-card-border: rgba(37, 99, 235, 0.14);
            --faq-active-bg: rgba(37, 99, 235, 0.1);
            --faq-heading: #0f172a;
            --faq-body: #334155;
            --faq-shadow: 0 18px 44px rgba(15, 23, 42, 0.09);
         }

         html.lm #landing #faq {
            --faq-section-bg: #eef4fb;
            --faq-card-bg: rgba(255, 255, 255, 0.98);
            --faq-card-border: rgba(37, 99, 235, 0.16);
            --faq-active-bg: rgba(37, 99, 235, 0.11);
            --faq-heading: #0f172a;
            --faq-body: #334155;
            --faq-shadow: 0 18px 44px rgba(15, 23, 42, 0.09);
         }

         html:not(.lm) #landing #faq {
            --faq-section-bg: #020617;
            --faq-card-bg: rgba(15, 23, 42, 0.86);
            --faq-card-border: rgba(96, 165, 250, 0.24);
            --faq-active-bg: rgba(96, 165, 250, 0.16);
            --faq-heading: #f8fafc;
            --faq-body: #cbd5e1;
            --faq-shadow: 0 22px 54px rgba(0, 0, 0, 0.32);
         }

         #landing #faq.sp {
            background: var(--faq-section-bg) !important;
         }

         @media (min-width: 992px) {
            #landing #faq.sp {
               padding: 78px 0 86px;
            }

            #landing #faq .container {
               max-width: 1120px;
            }

            #landing #faq .text-center.mb-5 {
               margin-bottom: 42px !important;
            }

            #landing #faq .stitle {
               color: var(--faq-heading) !important;
               -webkit-text-fill-color: var(--faq-heading) !important;
               line-height: 1.04;
               text-shadow: 0 10px 18px rgba(15, 23, 42, 0.12);
            }

            #landing #faq .stitle .gt {
               -webkit-text-fill-color: transparent !important;
            }

            #landing #faq .slbl {
               color: #2563eb !important;
               -webkit-text-fill-color: #2563eb !important;
               font-weight: 900;
            }

            html:not(.lm) #landing #faq .slbl {
               color: #93c5fd !important;
               -webkit-text-fill-color: #93c5fd !important;
            }

            #landing #faq .col-lg-8 {
               width: 100%;
               max-width: 1040px;
            }
         }

         #landing #faq .acco {
            display: grid;
            gap: 12px;
         }

         #landing #faq .acco .accordion-item {
            margin-bottom: 0;
            overflow: hidden;
            background: var(--faq-card-bg);
            border: 1px solid var(--faq-card-border);
            border-radius: 8px !important;
            box-shadow: var(--faq-shadow);
         }

         #landing #faq .acco .accordion-header {
            margin: 0;
         }

         #landing #faq .acco .accordion-button {
            min-height: 52px;
            padding: 16px 18px;
            gap: 12px;
            color: var(--faq-heading) !important;
            background: var(--faq-card-bg) !important;
            border: 0;
            border-radius: 8px !important;
            font-size: 0.94rem;
            font-weight: 900;
            line-height: 1.25;
            letter-spacing: 0;
            box-shadow: none !important;
         }

         #landing #faq .acco .accordion-button:not(.collapsed) {
            color: var(--faq-heading) !important;
            background: var(--faq-active-bg) !important;
            border-bottom: 1px solid var(--faq-card-border);
            border-radius: 8px 8px 0 0 !important;
         }

         #landing #faq .acco .accordion-button::after {
            width: 0.9rem;
            height: 0.9rem;
            flex: 0 0 0.9rem;
            margin-left: auto;
            background-size: 0.9rem;
         }

         #landing #faq .acco .accordion-body {
            padding: 16px 18px 18px;
            color: var(--faq-body) !important;
            background: var(--faq-card-bg) !important;
            border-top: 0;
            font-size: 0.95rem;
            line-height: 1.68;
            text-align: justify;
            text-align-last: left;
         }

         html.lm #landing #faq .acco .accordion-item,
         html.lm #landing #faq .acco .accordion-body,
         html.lm #landing #faq .acco .accordion-button {
            background: var(--faq-card-bg) !important;
         }

         html.lm #landing #faq .acco .accordion-button:not(.collapsed) {
            background: var(--faq-active-bg) !important;
         }

         @media (max-width: 575.98px) {
            #landing #faq .row {
               --bs-gutter-x: 0;
            }

            #landing #faq .text-center.mb-5 {
               margin-bottom: 18px !important;
            }

            #landing #faq .acco {
               gap: 8px;
            }

            #landing #faq .acco .accordion-item {
               border-radius: 8px !important;
               box-shadow: 0 10px 22px rgba(15, 23, 42, 0.07);
            }

            #landing #faq .acco .accordion-button {
               min-height: 46px;
               padding: 12px 14px;
               font-size: 0.78rem;
               line-height: 1.2;
            }

            #landing #faq .acco .accordion-body {
               padding: 10px 14px 14px;
               font-size: 0.76rem;
               line-height: 1.55;
            }
         }

         .back-to-top-btn {
            position: fixed;
            right: max(18px, env(safe-area-inset-right));
            bottom: max(22px, env(safe-area-inset-bottom));
            z-index: 1060;
            width: 48px;
            height: 48px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #ffffff;
            background: linear-gradient(135deg, var(--pur), #06b6d4);
            border: 0;
            border-radius: 8px;
            box-shadow: 0 16px 34px rgba(37, 99, 235, 0.3);
            cursor: grab;
            opacity: 0;
            visibility: hidden;
            transform: translateY(14px) scale(0.92);
            pointer-events: none;
            touch-action: none;
            transition: opacity 0.22s ease, visibility 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
            user-select: none;
         }

         .back-to-top-btn i {
            font-size: 1rem;
            line-height: 1;
         }

         .back-to-top-btn.is-visible {
            opacity: 1;
            visibility: visible;
            transform: translateY(0) scale(1);
            pointer-events: auto;
            animation: backToTopFloat 2.4s ease-in-out infinite;
         }

         .back-to-top-btn:hover,
         .back-to-top-btn:focus-visible {
            color: #ffffff;
            transform: translateY(-3px) scale(1.03);
            box-shadow: 0 20px 42px rgba(37, 99, 235, 0.38);
            outline: 0;
         }

         .back-to-top-btn:focus-visible {
            box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.22), 0 20px 42px rgba(37, 99, 235, 0.38);
         }

         .back-to-top-btn.is-dragging,
         .back-to-top-btn.is-dragging:hover,
         .back-to-top-btn.is-dragging:focus-visible {
            animation: none !important;
            cursor: grabbing;
            transform: translateY(0) scale(1);
            box-shadow: 0 22px 48px rgba(37, 99, 235, 0.42);
         }

         @keyframes backToTopFloat {
            0%, 100% {
               translate: 0 0;
            }
            50% {
               translate: 0 -6px;
            }
         }

         @media (max-width: 575.98px) {
            .back-to-top-btn {
               right: max(14px, env(safe-area-inset-right));
               bottom: max(78px, calc(env(safe-area-inset-bottom) + 70px));
               width: 42px;
               height: 42px;
            }
         }

         @media (prefers-reduced-motion: reduce) {
            .back-to-top-btn,
            .back-to-top-btn.is-visible {
               animation: none !important;
               transition: opacity 0.01ms linear, visibility 0.01ms linear;
            }
         }

         .guest-brand,
         .guest-brand-copy {
            min-width: 0;
         }

         .guest-brand {
            flex: 0 0 auto;
            width: max-content;
            max-width: none;
            text-decoration: none;
         }

         .guest-brand-copy {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            line-height: 1.05;
         }

         .guest-brand-name {
            display: block;
            max-width: none;
            overflow: visible;
            text-overflow: clip;
            white-space: nowrap;
         }

         .guest-header-clock {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            max-width: 100%;
            margin-top: 4px;
            overflow: hidden;
            color: var(--tx3);
            font-size: 0.58rem;
            font-weight: 600;
            line-height: 1.2;
            letter-spacing: 0.015em;
            white-space: nowrap;
            font-variant-numeric: tabular-nums;
         }

         .guest-header-clock-separator {
            opacity: 0.55;
         }

         .modal-backdrop.show {
            opacity: 1;
            background: rgba(15, 23, 42, 0.42);
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
         }

         @media (max-width: 575.98px) {
            .guest-header-clock { font-size: 0.53rem; }
         }

         @media (max-width: 360px) {
            .guest-header-clock {
               gap: 3px;
               font-size: 0.49rem;
            }
         }

         @media (max-width: 767px) {
            :root {
               --nav: 64px;
            }

            body {
               background:
                  radial-gradient(circle at 20% 0%, rgba(20, 184, 166, 0.12), transparent 32%),
                  radial-gradient(circle at 88% 8%, rgba(59, 130, 246, 0.14), transparent 30%),
                  var(--bg);
            }

            #nbar {
               height: calc(var(--nav) + env(safe-area-inset-top, 0px));
               padding-top: env(safe-area-inset-top, 0px);
               background: rgba(255, 255, 255, 0.82);
               border-bottom: 1px solid rgba(37, 99, 235, 0.13);
               box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
               backdrop-filter: blur(20px) saturate(1.18);
               -webkit-backdrop-filter: blur(20px) saturate(1.18);
            }

            html:not(.lm) #nbar {
               background: rgba(8, 13, 26, 0.86);
               border-bottom-color: rgba(96, 165, 250, 0.18);
               box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28);
            }

            #nbar .container {
               padding-left: 14px;
               padding-right: 14px;
            }

            .guest-brand {
               max-width: none !important;
               gap: 8px !important;
               font-size: 0.92rem !important;
            }

            .guest-brand .logo-i {
               width: 34px !important;
               height: 34px !important;
               border-radius: 16%;
               background: #ffffff !important;
               border: 2px solid #ffffff;
               box-shadow: none;
               object-fit: contain;
               filter: drop-shadow(0 8px 14px rgba(37, 99, 235, 0.18));
            }

            .guest-brand-name {
               font-size: 0.9rem;
               font-weight: 800;
               letter-spacing: 0;
            }

            #thbtn,
            #mbtog {
               width: 36px !important;
               height: 36px !important;
               border-radius: 10px !important;
               background: rgba(255, 255, 255, 0.72);
               border-color: rgba(37, 99, 235, 0.14);
               box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
            }

            html:not(.lm) #thbtn,
            html:not(.lm) #mbtog {
               background: rgba(15, 23, 42, 0.72);
               border-color: rgba(148, 163, 184, 0.16);
            }

            #hero {
               min-height: auto;
               padding-top: calc(var(--nav) + env(safe-area-inset-top, 0px) + 28px);
               padding-bottom: 20px;
               justify-content: flex-start;
               background:
                  linear-gradient(180deg, rgba(248, 250, 252, 0.82) 0%, rgba(239, 246, 255, 0.36) 54%, transparent 100%);
            }

            html:not(.lm) #hero {
               background:
                  linear-gradient(180deg, rgba(15, 23, 42, 0.44) 0%, rgba(8, 8, 15, 0) 72%);
            }

            #hero .container {
               max-width: 100%;
               padding-left: 16px;
               padding-right: 16px;
            }

            #hero .text-center.mt-3.pt-3 {
               margin-top: 14px !important;
               padding-top: 0 !important;
            }

            #hero .hbadge {
               display: inline-flex !important;
               align-items: center;
               justify-content: center;
               gap: 7px;
               max-width: min(100%, 320px);
               margin-bottom: 14px;
               padding: 7px 11px;
               border-radius: 999px;
               background: rgba(59, 130, 246, 0.09);
               border: 1px solid rgba(59, 130, 246, 0.18);
               white-space: normal;
               text-align: center;
               line-height: 1.25;
               font-size: 0.66rem;
               font-weight: 800;
               letter-spacing: 0;
               color: #2563eb;
            }

            #hero .hbadge::before {
               content: "";
               width: 7px;
               height: 7px;
               border-radius: 999px;
               background: #14b8a6;
               box-shadow: 0 0 0 4px rgba(20, 184, 166, 0.12);
               flex: 0 0 auto;
            }

            #hero .h1 {
               max-width: 350px;
               margin-left: auto;
               margin-right: auto;
               font-size: clamp(2rem, 8.4vw, 2.35rem) !important;
               line-height: 1.04;
               letter-spacing: 0;
            }

            #hero .h1 span {
               display: inline-block;
            }

            #hero p.mx-auto {
               max-width: 352px !important;
               margin-bottom: 18px !important;
               font-size: 0.9rem !important;
               line-height: 1.5;
            }

            #hero .d-flex.align-items-center.justify-content-center.gap-3.flex-wrap.hero-cta-row {
               display: grid !important;
               grid-template-columns: repeat(3, minmax(0, 1fr));
               align-items: stretch !important;
               justify-content: center !important;
               gap: 6px !important;
               width: min(100%, 390px);
               margin-left: auto;
               margin-right: auto;
               margin-bottom: 14px;
               flex-wrap: nowrap !important;
            }

            #hero .d-flex.align-items-center.justify-content-center.gap-3.flex-wrap.hero-cta-row > .btn {
               width: 100% !important;
               max-width: none !important;
               min-width: 0;
               min-height: 40px;
               padding: 8px 5px !important;
               border-radius: 8px;
               display: inline-flex;
               align-items: center;
               justify-content: center;
               gap: 3px;
               font-size: 0.68rem !important;
               line-height: 1.1;
               white-space: nowrap;
            }

            #hero .d-flex.align-items-center.justify-content-center.gap-3.flex-wrap.hero-cta-row > .btn:first-child {
               grid-column: auto;
            }

            #hero .d-flex.align-items-center.justify-content-center.gap-3.flex-wrap.hero-cta-row i {
               margin-right: 0 !important;
               font-size: 0.62rem;
               flex: 0 0 auto;
            }

            #hero .row.align-items-center.mt-4 {
               margin-top: 0 !important;
            }

            #hero .col-lg-5 img {
               max-height: 210px !important;
               margin-top: 0;
               margin-bottom: 4px;
               filter: drop-shadow(0 18px 28px rgba(37, 99, 235, 0.16));
            }

            #hero .col-lg-5 {
               margin-bottom: 6px !important;
            }

            #hero .hero-tech-card {
               --hero-tech-color: #000000;
               width: 100%;
               margin: 12px auto 10px !important;
               padding: 10px 0;
               border-radius: 0;
               background: transparent;
               border: 0;
               box-shadow: none;
            }

            html:not(.lm) #hero .hero-tech-card {
               --hero-tech-color: #ffffff;
               background: transparent;
               border-color: transparent;
            }

            #hero .hero-tech-title {
               color: var(--hero-tech-color) !important;
               margin-bottom: 8px !important;
               font-size: 0.58rem !important;
               letter-spacing: 0.09em !important;
            }

            #hero .tech-icons {
               gap: 18px !important;
               font-size: 1.12rem !important;
            }

            #hero .row.justify-content-center.mt-3.mb-3 {
               margin-top: 12px !important;
               margin-bottom: 6px !important;
            }

            #landing .sp {
               padding: 54px 0;
            }

            .landing-section-heading {
               align-items: flex-start;
               text-align: left;
            }

         .landing-section-heading .slbl {
            justify-content: flex-start;
         }

            .slbl {
               margin-bottom: 10px;
               font-size: 0.66rem;
               letter-spacing: 0.1em;
            }

            .stitle {
               font-size: 1.7rem;
               line-height: 1.12;
               margin-bottom: 10px;
            }

            #about .landing-section-heading {
               align-items: center;
               text-align: center;
            }

            #about .landing-section-heading .slbl {
               justify-content: center;
            }

            #about .landing-section-heading .stitle {
               max-width: 340px;
               margin-left: auto;
               margin-right: auto;
               text-align: center;
            }

            #how .landing-section-heading {
               align-items: center;
               text-align: center;
            }

            #how .landing-section-heading .slbl {
               justify-content: center;
            }

            #how .landing-section-heading .stitle {
               max-width: 340px;
               margin-left: auto;
               margin-right: auto;
               text-align: center;
            }

            #contact .landing-section-heading {
               align-items: center;
               text-align: center;
            }

            #contact .landing-section-heading .slbl {
               justify-content: center;
            }

            #contact .landing-section-heading .stitle {
               max-width: 340px;
               margin-left: auto;
               margin-right: auto;
               text-align: center;
            }

            #about .about-system-copy {
               text-align: justify;
               text-indent: 3.00rem;
               text-align-last: left;
               line-height: 1.62;
            }

            #about .target-users-grid {
               display: grid !important;
               grid-template-columns: repeat(3, minmax(0, 1fr));
               gap: 8px !important;
            }

            #about .target-users-grid .ftag {
               width: 100%;
               min-width: 0;
               margin-top: 0;
               padding: 7px 5px !important;
               display: inline-flex;
               align-items: center;
               justify-content: center;
               gap: 4px;
               font-size: 0.58rem;
               line-height: 1.1;
               text-align: center;
               white-space: nowrap;
            }

            #about .target-users-grid .ftag i {
               margin-right: 0 !important;
               font-size: 0.58rem;
               flex: 0 0 auto;
            }

            .gc {
               border-radius: 10px;
               box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
            }

            .gc.p-4 {
               padding: 17px !important;
            }
         }

         @media (min-width: 992px) {
            #about.sp {
               --about-heading: #0f172a;
               --about-muted: #334155;
               --about-card-bg: rgba(255, 255, 255, 0.9);
               --about-card-border: rgba(37, 99, 235, 0.12);
               --about-pill-bg: rgba(255, 255, 255, 0.82);
               --about-pill-border: rgba(37, 99, 235, 0.18);
               --about-pill-text: #0f172a;
               padding-top: clamp(72px, 5.2vw, 92px);
               padding-bottom: clamp(84px, 6vw, 112px);
            }

            html:not(.lm) #about.sp {
               --about-heading: #f8fafc;
               --about-muted: #cbd5e1;
               --about-card-bg: rgba(15, 23, 42, 0.86);
               --about-card-border: rgba(148, 163, 184, 0.28);
               --about-pill-bg: rgba(15, 23, 42, 0.72);
               --about-pill-border: rgba(148, 163, 184, 0.28);
               --about-pill-text: #f8fafc;
               background:
                  linear-gradient(180deg, rgba(15, 23, 42, 0.88), rgba(8, 13, 28, 0.94)) !important;
            }

            #about .container {
               max-width: min(1320px, calc(100vw - 64px));
            }

            #about .landing-section-heading {
               align-items: center;
               max-width: 980px;
               margin-left: auto;
               margin-right: auto;
               margin-bottom: 28px !important;
               text-align: center;
            }

            #about .landing-section-heading .slbl {
               justify-content: center;
            }

            #about .landing-section-heading .stitle {
               max-width: 1120px;
               margin-left: auto;
               margin-right: auto;
               color: var(--about-heading) !important;
               -webkit-text-fill-color: var(--about-heading) !important;
               font-size: clamp(2.55rem, 3.5vw, 3.75rem);
               line-height: 1.04;
               letter-spacing: -0.035em;
               text-align: center;
               text-wrap: balance;
               text-shadow: 0 12px 22px rgba(15, 23, 42, 0.12);
            }

            #about .landing-section-heading .stitle .gt {
               display: inline-block;
               white-space: nowrap;
               -webkit-text-fill-color: transparent !important;
            }

            #about .landing-section-heading .slbl {
               color: #2563eb !important;
               -webkit-text-fill-color: #2563eb !important;
            }

            html:not(.lm) #about .landing-section-heading .slbl {
               color: #93c5fd !important;
               -webkit-text-fill-color: #93c5fd !important;
            }

            #about .row.justify-content-center.g-5 {
               --bs-gutter-x: 3.2rem;
               --bs-gutter-y: 0;
               align-items: stretch !important;
            }

            #about .row.justify-content-center.g-5 > .about-system-content {
               display: flex;
               flex-direction: column;
               justify-content: center;
               align-items: center;
            }

            #about .about-system-content {
               width: 100%;
               max-width: 1040px;
               margin-left: auto;
               margin-right: auto;
               text-align: center;
            }

            #about .about-system-copy {
               max-width: 1000px;
               margin-bottom: 30px !important;
               color: var(--about-muted) !important;
               -webkit-text-fill-color: var(--about-muted) !important;
               font-size: clamp(1.08rem, 1.15vw, 1.24rem) !important;
               line-height: 1.68;
               letter-spacing: 0.005em;
               text-align: center;
               text-align-last: center;
               text-indent: 0;
            }

            #about h4.fs-5 {
               margin-top: 0 !important;
               margin-bottom: 16px !important;
               color: var(--about-heading) !important;
               -webkit-text-fill-color: var(--about-heading) !important;
               font-size: clamp(1.18rem, 1.2vw, 1.36rem) !important;
               font-weight: 900;
               letter-spacing: 0;
               text-align: center;
            }

            #about .target-users-grid {
               display: grid !important;
               grid-template-columns: repeat(5, minmax(0, 1fr));
               gap: 12px !important;
               max-width: 1020px;
               margin: 0 auto !important;
            }

            #about .target-users-grid .ftag {
               width: 100%;
               min-height: 50px;
               padding: 10px 14px !important;
               display: inline-flex;
               align-items: center;
               justify-content: center;
               gap: 8px;
               border-radius: 999px;
               background: var(--about-pill-bg) !important;
               border-color: var(--about-pill-border) !important;
               color: var(--about-pill-text) !important;
               -webkit-text-fill-color: var(--about-pill-text) !important;
               font-size: 0.86rem;
               font-weight: 800;
               line-height: 1.15;
               text-align: center;
               white-space: nowrap;
            }

            #about .target-users-grid .ftag i {
               margin-right: 0 !important;
               color: #2563eb;
               font-size: 0.88rem;
            }

            html:not(.lm) #about .target-users-grid .ftag i {
               color: #60a5fa;
            }
         }

         @media (min-width: 992px) {
            #how.sp {
               --how-heading: #0f172a;
               --how-muted: #334155;
               --how-card-bg: rgba(255, 255, 255, 0.9);
               --how-card-border: rgba(37, 99, 235, 0.13);
               --how-number-bg: linear-gradient(135deg, rgba(37, 99, 235, 0.12), rgba(14, 165, 233, 0.16));
               --how-number-text: #0f172a;
               padding-top: 72px;
               padding-bottom: 82px;
            }

            html:not(.lm) #how.sp {
               --how-heading: #f8fafc;
               --how-muted: #cbd5e1;
               --how-card-bg: rgba(15, 23, 42, 0.86);
               --how-card-border: rgba(148, 163, 184, 0.26);
               --how-number-bg: linear-gradient(135deg, rgba(96, 165, 250, 0.28), rgba(34, 211, 238, 0.22));
               --how-number-text: #f8fafc;
               background:
                  linear-gradient(180deg, rgba(8, 13, 28, 0.96), rgba(15, 23, 42, 0.9)) !important;
            }

            #how .container {
               max-width: min(1360px, calc(100vw - 64px));
            }

            #how .landing-section-heading {
               align-items: center;
               max-width: 1120px;
               margin-left: auto;
               margin-right: auto;
               margin-bottom: 46px !important;
               text-align: center;
            }

            #how .landing-section-heading .slbl {
               justify-content: center;
               color: #2563eb !important;
               -webkit-text-fill-color: #2563eb !important;
            }

            html:not(.lm) #how .landing-section-heading .slbl {
               color: #93c5fd !important;
               -webkit-text-fill-color: #93c5fd !important;
            }

            #how .landing-section-heading .stitle {
               max-width: 100%;
               margin-left: auto;
               margin-right: auto;
               color: var(--how-heading) !important;
               -webkit-text-fill-color: var(--how-heading) !important;
               font-size: clamp(2.3rem, 3.4vw, 3.45rem);
               line-height: 1.05;
               text-align: center;
               text-shadow: 0 12px 22px rgba(15, 23, 42, 0.12);
            }

            #how .landing-section-heading .stitle .gt {
               -webkit-text-fill-color: transparent !important;
            }

            #how .row.g-4.justify-content-center {
               --bs-gutter-x: 0;
               --bs-gutter-y: 0;
               display: grid !important;
               grid-template-columns: repeat(3, minmax(0, 1fr));
               gap: 18px;
               margin-left: 0;
               margin-right: 0;
            }

            #how .row.g-4.justify-content-center > [class*="col-"] {
               width: auto;
               max-width: none;
               padding-left: 0;
               padding-right: 0;
            }

            #how .gc {
               min-height: 210px;
               padding: 30px 28px !important;
               display: flex;
               flex-direction: column;
               align-items: center;
               justify-content: center;
               border-radius: 8px;
               border-color: var(--how-card-border) !important;
               background: var(--how-card-bg) !important;
               box-shadow: 0 24px 54px rgba(15, 23, 42, 0.08);
               transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
            }

            html:not(.lm) #how .gc {
               box-shadow: 0 24px 56px rgba(0, 0, 0, 0.28);
            }

            #how .gc:hover {
               transform: translateY(-4px);
               border-color: rgba(37, 99, 235, 0.32) !important;
               box-shadow: 0 30px 64px rgba(15, 23, 42, 0.12);
            }

            html:not(.lm) #how .gc:hover {
               border-color: rgba(147, 197, 253, 0.46) !important;
               box-shadow: 0 32px 72px rgba(0, 0, 0, 0.38);
            }

            #how .hnum {
               width: 48px;
               height: 48px;
               margin-bottom: 20px;
               background: var(--how-number-bg);
               color: var(--how-number-text);
               font-size: 1rem;
               font-weight: 950;
               box-shadow: 0 16px 32px rgba(37, 99, 235, 0.12);
            }

            #how h3 {
               max-width: 100%;
               margin-bottom: 10px !important;
               color: var(--how-heading) !important;
               -webkit-text-fill-color: var(--how-heading) !important;
               font-size: 1.08rem !important;
               font-weight: 900 !important;
               line-height: 1.22;
               letter-spacing: 0;
            }

            #how p {
               max-width: 360px;
               margin: 0 auto;
               color: var(--how-muted) !important;
               -webkit-text-fill-color: var(--how-muted) !important;
               font-size: 0.9rem !important;
               line-height: 1.55;
            }
         }


          #landing #hero {
             position: relative;
             isolation: isolate;
             overflow: hidden;
             background:
                radial-gradient(circle at 14% 22%, rgba(6, 182, 212, 0.16), transparent 34%),
                radial-gradient(circle at 86% 18%, rgba(37, 99, 235, 0.18), transparent 36%),
                linear-gradient(rgba(14, 165, 233, 0.075) 1px, transparent 1px) 0 0 / 100% 42px,
                linear-gradient(90deg, rgba(14, 165, 233, 0.075) 1px, transparent 1px) 0 0 / 48px 100%,
                linear-gradient(120deg, #f8fcff 0%, #edfaff 46%, #dff5ff 100%) !important;
          }

          #landing #hero::after {
             content: "";
             position: absolute;
             z-index: 0;
             inset: 0;
             pointer-events: none;
             background: radial-gradient(ellipse at 50% 42%, transparent 0 38%, rgba(248, 252, 255, 0.12) 72%, rgba(248, 252, 255, 0.68) 100%);
          }

          html:not(.lm) #landing #hero {
             background:
                radial-gradient(circle at 14% 20%, rgba(34, 211, 238, 0.16), transparent 34%),
                radial-gradient(circle at 84% 18%, rgba(37, 99, 235, 0.22), transparent 36%),
                linear-gradient(rgba(56, 189, 248, 0.08) 1px, transparent 1px) 0 0 / 100% 42px,
                linear-gradient(90deg, rgba(56, 189, 248, 0.08) 1px, transparent 1px) 0 0 / 48px 100%,
                linear-gradient(120deg, #020617 0%, #071b2f 48%, #063044 100%) !important;
          }

          html:not(.lm) #landing #hero::after {
             background: radial-gradient(ellipse at 50% 42%, transparent 0 38%, rgba(2, 6, 23, 0.08) 72%, rgba(2, 6, 23, 0.55) 100%);
          }

          #hero .hero-home-container {
             width: 100%;
             max-width: min(1500px, calc(100vw - 32px));
          }

          #hero .hero-home-layout {
             min-height: calc(100vh - var(--nav) - 10px);
             min-height: calc(100svh - var(--nav) - 10px);
             justify-content: space-between;
             padding-top: clamp(14px, 2.4vh, 34px);
             padding-bottom: clamp(12px, 2.2vh, 28px);
          }

          #hero .hero-home-copy,
          #hero .hero-image-col {
             min-width: 0;
          }

          #hero .hero-home-copy .h1 {
             max-width: 620px;
             margin-left: auto;
             margin-right: auto;
             font-size: clamp(2.85rem, 4.25vw, 4.75rem) !important;
             line-height: 1.04;
             text-align: center;
             white-space: normal;
          }

          #hero .hero-home-copy-text {
             max-width: 600px;
             margin-left: auto;
             margin-right: auto;
             line-height: 1.58;
             text-align: center;
             margin-bottom: 24px !important;
          }

          #hero .hero-tech-card {
             --hero-tech-color: #111827;
             max-width: 540px;
             margin-left: auto;
             margin-right: auto;
             margin-top: 16px !important;
             text-align: center !important;
          }

          html:not(.lm) #hero .hero-tech-card {
             --hero-tech-color: #f8fafc;
          }

          #hero .hero-tech-card .tech-icons {
             justify-content: center !important;
          }

          #hero .hero-tech-title,
          #hero .hero-tech-card .tech-icons a,
          #hero .hero-tech-card .tech-icons i {
             color: var(--hero-tech-color) !important;
             -webkit-text-fill-color: var(--hero-tech-color) !important;
          }

          #hero .hero-badge-wrap {
             display: flex;
             justify-content: center;
             width: 100%;
             max-width: 640px;
             margin-left: auto;
             margin-right: auto;
          }

          #hero .hero-cta-row {
             display: grid !important;
             grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 1fr);
             width: min(100%, 580px);
             margin-left: auto;
             margin-right: auto;
             gap: 10px !important;
          }

          #hero .hero-cta-row > .btn {
             min-width: 0;
             width: 100% !important;
             min-height: 48px;
             padding: 10px 14px !important;
             white-space: nowrap;
          }

          #hero .hero-image-col {
             --hero-preview-max-width: clamp(660px, 47vw, 900px);
             --hero-preview-side-gap: clamp(12px, 1vw, 22px);
             --hero-context-card-width: clamp(148px, 10.5vw, 188px);
             overflow: visible;
          }

          #hero .desktop-hero-image-row {
             width: min(100%, calc(var(--hero-preview-max-width) + 176px));
             min-width: 0;
             margin-left: auto;
             margin-right: -8px;
             position: relative;
             z-index: 2;
          }

          #landing #hero .desktop-hero-image-frame {
             position: relative;
             box-sizing: border-box;
             width: 100%;
             padding: clamp(42px, 4vw, 66px) clamp(64px, 5vw, 96px);
             line-height: normal;
          }

          #landing #hero .desktop-hero-image {
             display: block;
             width: 100%;
             max-width: 100%;
             height: auto;
             max-height: clamp(330px, 46vh, 500px);
             object-fit: contain;
             user-select: none;
             border-radius: 10px;
             background: #0b172a;
             filter: drop-shadow(0 28px 42px rgba(15, 23, 42, 0.2));
             animation: none;
             will-change: auto;
          }

          html:not(.lm) #landing #hero .desktop-hero-image {
             filter: drop-shadow(0 30px 48px rgba(0, 0, 0, 0.46));
          }

          #landing #hero .hero-video-showcase {
             position: relative;
             z-index: 1;
             display: flex;
             flex-direction: column;
             gap: 12px;
             width: 100%;
             max-width: 960px;
             margin: 0 auto;
             isolation: isolate;
          }

          #landing #hero .hero-video-kicker {
             display: flex;
             align-items: center;
             justify-content: space-between;
             gap: 16px;
             padding: 0 4px;
             color: var(--tx2);
             font-size: 0.68rem;
             font-weight: 800;
             letter-spacing: 0.08em;
             line-height: 1.2;
             text-transform: uppercase;
          }

          #landing #hero .hero-video-kicker-title {
             display: inline-flex;
             align-items: center;
             gap: 8px;
          }

          #landing #hero .hero-video-kicker-title i {
             color: var(--pur, #2563eb);
             font-size: 0.7rem;
          }

          #landing #hero .hero-video-kicker-meta {
             color: var(--tx3);
             font-size: 0.61rem;
             font-weight: 700;
             letter-spacing: 0.1em;
             white-space: nowrap;
          }

          #landing #hero .hero-video-shell {
             position: relative;
             padding: 10px 10px 12px;
             border: 1px solid rgba(37, 99, 235, 0.18);
             border-radius: 18px;
             background: linear-gradient(145deg, rgba(255, 255, 255, 0.9), rgba(239, 246, 255, 0.92));
             box-shadow: 0 26px 58px rgba(15, 23, 42, 0.18), 0 2px 0 rgba(255, 255, 255, 0.78) inset;
             transform-origin: 50% 52%;
             animation: srHeroImageFloat 7.2s ease-in-out infinite;
             will-change: transform;
          }

          #landing #hero .hero-video-shell::before {
             content: "";
             position: absolute;
             z-index: -1;
             inset: 14% -8% -10%;
             border-radius: 40%;
             background: radial-gradient(circle, rgba(37, 99, 235, 0.24), rgba(6, 182, 212, 0.08) 42%, transparent 72%);
             filter: blur(24px);
             opacity: 0.9;
             pointer-events: none;
          }

          html:not(.lm) #landing #hero .hero-video-shell {
             border-color: rgba(96, 165, 250, 0.32);
             background: linear-gradient(145deg, rgba(15, 23, 42, 0.94), rgba(8, 47, 73, 0.92));
             box-shadow: 0 30px 64px rgba(0, 0, 0, 0.42), 0 2px 0 rgba(148, 163, 184, 0.16) inset;
          }

          #landing #hero .hero-video-chrome {
             position: relative;
             display: flex;
             align-items: center;
             height: 25px;
             padding: 0 4px 8px;
             color: var(--tx3);
          }

          #landing #hero .hero-video-chrome-dots {
             display: inline-flex;
             align-items: center;
             gap: 6px;
          }

          #landing #hero .hero-video-chrome-dots i {
             display: block;
             width: 7px;
             height: 7px;
             border-radius: 50%;
             background: #f87171;
          }

          #landing #hero .hero-video-chrome-dots i:nth-child(2) { background: #fbbf24; }
          #landing #hero .hero-video-chrome-dots i:nth-child(3) { background: #34d399; }

          #landing #hero .hero-video-chrome-label {
             position: absolute;
             left: 50%;
             transform: translateX(-50%);
             color: var(--tx3);
             font-size: 0.61rem;
             font-weight: 700;
             letter-spacing: 0.08em;
             white-space: nowrap;
          }

          #landing #hero .hero-video-caption {
             max-width: 580px;
             margin: 0 auto;
             color: var(--tx3);
             font-size: 0.78rem;
             font-weight: 600;
             line-height: 1.45;
             text-align: center;
          }

          #landing #hero .hero-benefit-row {
             display: flex;
             flex-wrap: wrap;
             align-items: center;
             justify-content: center;
             gap: 7px;
             width: min(100%, 760px);
             margin: 0 auto;
          }

          #landing #hero .hero-benefit-item {
             display: inline-flex;
             align-items: center;
             justify-content: center;
             gap: 7px;
             min-width: 0;
             padding: 7px 10px;
             border: 1px solid rgba(37, 99, 235, 0.32);
             border-radius: 999px;
             background: rgba(255, 255, 255, 0.68);
             color: var(--tx2);
             font-size: 0.66rem;
             font-weight: 700;
             line-height: 1.2;
             text-align: center;
          }

          #landing #hero .hero-benefit-item i {
             color: var(--pur, #2563eb);
             font-size: 0.66rem;
             flex: 0 0 auto;
          }

          html:not(.lm) #landing #hero .hero-benefit-item {
             border-color: rgba(96, 165, 250, 0.5);
             background: rgba(15, 23, 42, 0.5);
          }

          #landing #hero .hero-context-card {
             position: absolute;
             z-index: 4;
             width: var(--hero-context-card-width);
             display: grid;
             gap: 5px;
             padding: 11px 13px 12px;
             border: 1px solid rgba(15, 23, 42, 0.08);
             border-radius: 8px;
             background: rgba(255, 255, 255, 0.92);
             box-shadow: 0 20px 42px rgba(15, 23, 42, 0.12);
             backdrop-filter: blur(16px);
             -webkit-backdrop-filter: blur(16px);
             line-height: 1.2;
             text-align: left;
             box-sizing: border-box;
             --hero-card-anchor-y: 0px;
             --hero-card-float-x: 0px;
             --hero-card-float-y: -8px;
             --hero-card-rotate-start: 0deg;
             --hero-card-rotate-mid: 0.7deg;
             --hero-card-duration: 6.4s;
             --hero-card-float-delay: 0s;
             transform: translate3d(0, var(--hero-card-anchor-y), 0) rotate(var(--hero-card-rotate-start));
             animation: srHeroContextCardFloat var(--hero-card-duration) ease-in-out var(--hero-card-float-delay) infinite;
             will-change: transform;
          }

          html:not(.lm) #landing #hero .hero-context-card {
             border-color: rgba(148, 163, 184, 0.32);
             background: rgba(15, 23, 42, 0.84);
             box-shadow: 0 22px 48px rgba(0, 0, 0, 0.36);
          }

          #landing #hero .hero-context-card::after {
             content: "";
             position: absolute;
             width: 8px;
             height: 8px;
             top: 13px;
             right: 13px;
             border-radius: 50%;
             background: currentColor;
             opacity: 0.55;
             animation: srHeroContextDotPulse 2.8s ease-in-out infinite;
          }

          #landing #hero .hero-context-kicker {
             display: inline-flex;
             align-items: center;
             gap: 6px;
             color: currentColor;
             font-size: 0.68rem;
             font-weight: 900;
             letter-spacing: 0;
             line-height: 1.2;
             text-transform: uppercase;
          }

          #landing #hero .hero-context-kicker-icon {
             width: 1em;
             min-width: 1em;
             display: inline-flex;
             align-items: center;
             justify-content: center;
             line-height: 1;
          }

          #landing #hero .hero-context-card strong {
             display: block;
             color: var(--tx, #0f172a);
             font-size: clamp(0.78rem, 0.95vw, 0.94rem);
             font-weight: 900;
             letter-spacing: 0;
             line-height: 1.18;
          }

          #landing #hero .hero-context-card span:last-child {
             display: block;
             color: var(--tx3, #64748b);
             font-size: 0.64rem;
             font-weight: 700;
             letter-spacing: 0;
             line-height: 1.3;
          }

          html:not(.lm) #landing #hero .hero-context-card strong {
             color: #f8fafc;
          }

          html:not(.lm) #landing #hero .hero-context-card span:last-child {
             color: #cbd5e1;
          }

          #landing #hero .hero-context-card--top-left {
             top: clamp(26px, 3vw, 44px);
             left: clamp(42px, 4.6vw, 78px);
             color: #0284c7;
             --hero-card-float-x: 3px;
             --hero-card-float-y: -7px;
             --hero-card-rotate-mid: -0.8deg;
             --hero-card-duration: 6.1s;
             --hero-card-float-delay: -0.3s;
          }

          #landing #hero .hero-context-card--middle-left {
             top: 50%;
             left: clamp(20px, 3.2vw, 56px);
             color: #06b6d4;
             --hero-card-anchor-y: -50%;
             --hero-card-float-x: -3px;
             --hero-card-float-y: -5px;
             --hero-card-rotate-mid: 0.9deg;
             --hero-card-duration: 6.8s;
             --hero-card-float-delay: -1.1s;
          }

          #landing #hero .hero-context-card--bottom-left {
             left: clamp(52px, 5vw, 84px);
             bottom: clamp(20px, 2.4vw, 34px);
             color: #34d399;
             --hero-card-float-x: 2px;
             --hero-card-float-y: 6px;
             --hero-card-rotate-mid: 0.7deg;
             --hero-card-duration: 7s;
             --hero-card-float-delay: -2.2s;
          }

          #landing #hero .hero-context-card--top-right {
             top: clamp(26px, 3vw, 44px);
             right: clamp(42px, 4.6vw, 78px);
             color: #34d399;
             --hero-card-float-x: -3px;
             --hero-card-float-y: -7px;
             --hero-card-rotate-mid: 0.8deg;
             --hero-card-duration: 6.3s;
             --hero-card-float-delay: -1.7s;
          }

          #landing #hero .hero-context-card--middle-right {
             top: 50%;
             right: clamp(20px, 3.2vw, 56px);
             color: #0ea5e9;
             --hero-card-anchor-y: -50%;
             --hero-card-float-x: 3px;
             --hero-card-float-y: -5px;
             --hero-card-rotate-mid: -0.9deg;
             --hero-card-duration: 6.6s;
             --hero-card-float-delay: -0.8s;
          }

          #landing #hero .hero-context-card--bottom-right {
             right: clamp(52px, 5vw, 84px);
             bottom: clamp(20px, 2.4vw, 34px);
             color: #06b6d4;
             --hero-card-float-x: -2px;
             --hero-card-float-y: 6px;
             --hero-card-rotate-mid: -0.7deg;
             --hero-card-duration: 7.1s;
             --hero-card-float-delay: -2.8s;
          }

          @keyframes srHeroImageFloat {
             0%,
             100% {
                transform: translate3d(0, 0, 0) rotate(-0.12deg) scale(1);
             }

             50% {
                transform: translate3d(0, -10px, 0) rotate(0.16deg) scale(1.008);
             }
          }

          @keyframes srHeroContextCardFloat {
             0%,
             100% {
                transform: translate3d(0, var(--hero-card-anchor-y), 0) rotate(var(--hero-card-rotate-start));
             }

             50% {
                transform: translate3d(
                   var(--hero-card-float-x),
                   calc(var(--hero-card-anchor-y) + var(--hero-card-float-y)),
                   0
                ) rotate(var(--hero-card-rotate-mid));
             }
          }

          @keyframes srHeroContextDotPulse {
             0%,
             100% {
                opacity: 0.45;
                transform: scale(0.88);
             }

             50% {
                opacity: 0.82;
                transform: scale(1.15);
             }
          }

          @media (min-width: 992px) and (max-width: 1199.98px) {
             #hero .hero-image-col {
                --hero-preview-max-width: clamp(600px, 53vw, 680px);
                --hero-preview-side-gap: clamp(8px, 1vw, 12px);
                --hero-context-card-width: clamp(150px, 14vw, 176px);
             }

             #hero .hero-home-container {
                max-width: min(1120px, calc(100vw - 28px));
             }

             #hero .hero-home-layout {
                --bs-gutter-x: 1.25rem;
             }

             #hero .hero-home-copy .h1 {
                font-size: clamp(2.35rem, 4.4vw, 3.1rem) !important;
             }

             #hero .hero-home-copy-text {
                font-size: 0.98rem !important;
             }

             #landing #hero .desktop-hero-image {
                max-height: clamp(238px, 35vh, 330px);
             }

             #landing #hero .desktop-hero-image-frame {
                padding: 48px 52px;
             }

             #landing #hero .hero-context-card {
                padding: 11px 12px 13px;
             }

             #landing #hero .hero-context-card strong {
                font-size: 0.82rem;
             }

             #landing #hero .hero-context-card span:last-child {
                font-size: 0.64rem;
             }
          }

          @media (max-width: 991.98px) {
             #hero .hero-image-col {
                --hero-context-card-width: 1fr;
             }

             #hero .hero-home-layout {
                min-height: auto;
                padding-top: 22px;
                padding-bottom: 18px;
             }

             #hero .hero-home-copy {
                margin-left: auto;
                margin-right: auto;
             }

             #hero .hero-home-copy .h1,
             #hero .hero-home-copy-text,
             #hero .hero-tech-card,
             #hero .hero-cta-row {
                margin-left: auto;
                margin-right: auto;
             }

             #hero .hero-home-copy .h1,
             #hero .hero-home-copy-text {
                text-align: center;
             }

             #hero .hero-badge-wrap {
                justify-content: center;
                margin-left: auto;
                margin-right: auto;
             }

             #hero .hero-tech-card {
                text-align: center !important;
             }

             #hero .hero-tech-card .tech-icons {
                justify-content: center !important;
             }

             #hero .hero-cta-row {
                grid-template-columns: repeat(3, minmax(0, 1fr));
                width: min(100%, 560px);
             }

             #hero .desktop-hero-image-row {
                width: min(100%, 760px);
                margin-left: auto;
                margin-right: auto;
             }

             #landing #hero .desktop-hero-image {
                max-height: clamp(240px, 42vh, 380px);
             }

             #landing #hero .desktop-hero-image-frame {
                display: block;
                padding: 0;
                line-height: normal;
             }
          }

          @media (max-width: 767.98px) {
             #hero .hero-home-container {
                max-width: 100%;
             }

             #hero .hero-home-layout {
                --bs-gutter-x: 0;
                margin-left: 0;
                margin-right: 0;
                padding-top: 0;
                padding-bottom: 0;
             }

             #hero .hero-home-copy,
             #hero .hero-image-col {
                width: 100%;
                max-width: 100%;
             }

             #hero .hero-badge-wrap {
                margin-top: 14px;
             }

             #hero .hero-home-copy .h1 {
                max-width: min(100%, 300px);
                font-size: clamp(1.8rem, 7.4vw, 2.1rem) !important;
             }

             #hero .hero-home-copy-text {
                max-width: min(100%, 320px) !important;
                margin-bottom: 18px !important;
                font-size: 0.9rem !important;
                line-height: 1.5;
             }

             #hero .d-flex.align-items-center.justify-content-center.gap-3.flex-wrap.hero-cta-row {
                width: min(100%, 320px);
                margin-bottom: 18px;
             }

             #hero .hero-image-col {
                padding-left: 0;
                padding-right: 0;
             }

             #hero .desktop-hero-image-row {
                width: 100%;
             }

             #landing #hero .desktop-hero-image {
                max-height: clamp(190px, 38vh, 300px);
                padding-left: 8px;
                padding-right: 8px;
             }

             #landing #hero .desktop-hero-image-frame {
                display: block;
                padding: 0;
             }
          }

          @media (max-width: 575.98px) {
             #hero .d-flex.align-items-center.justify-content-center.gap-3.flex-wrap.hero-cta-row {
                grid-template-columns: 1fr;
                width: min(100%, 270px);
                gap: 8px !important;
             }

             #hero .d-flex.align-items-center.justify-content-center.gap-3.flex-wrap.hero-cta-row > .btn {
                min-height: 42px;
                padding: 10px 12px !important;
                font-size: 0.78rem !important;
             }

          }

          @media (prefers-reduced-motion: reduce) {
             #landing #hero .desktop-hero-image,
             #landing #hero .hero-video-shell {
                animation: none !important;
             }

             #landing #hero .desktop-hero-image,
             #landing #hero .hero-video-shell {
                transform: none !important;
             }
          }


         @media (max-width: 360px) {
            #hero .d-flex.align-items-center.justify-content-center.gap-3.flex-wrap.hero-cta-row {
               gap: 5px !important;
               grid-template-columns: repeat(3, minmax(0, 1fr));
            }

            #hero .d-flex.align-items-center.justify-content-center.gap-3.flex-wrap.hero-cta-row > .btn {
               min-height: 38px;
               padding-left: 4px !important;
               padding-right: 4px !important;
               font-size: 0.62rem !important;
            }
         }

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

            #foot {
                --footer-bg-start: #eef4fb;
                --footer-bg-end: #f8fbff;
                --footer-panel-bg: rgba(255, 255, 255, 0.96);
                --footer-panel-border: rgba(37, 99, 235, 0.14);
                --footer-action-bg: rgba(248, 250, 252, 0.92);
                --footer-action-border: rgba(37, 99, 235, 0.16);
                --footer-heading: #0f172a;
                --footer-copy: #334155;
                --footer-link: #334155;
                --footer-muted: #475569;
                --footer-input-bg: #ffffff;
                --footer-icon-bg: rgba(239, 246, 255, 0.96);
                --footer-shadow: 0 22px 54px rgba(15, 23, 42, 0.1);
                background: linear-gradient(180deg, var(--footer-bg-start) 0%, var(--footer-bg-end) 100%);
                position: relative;
                overflow: hidden;
                border-top: 1px solid var(--footer-panel-border);
            }

            html:not(.lm) #foot {
                --footer-bg-start: #070d1d;
                --footer-bg-end: #0f172a;
                --footer-panel-bg: rgba(15, 23, 42, 0.9);
                --footer-panel-border: rgba(96, 165, 250, 0.24);
                --footer-action-bg: rgba(2, 6, 23, 0.42);
                --footer-action-border: rgba(96, 165, 250, 0.24);
                --footer-heading: #f8fafc;
                --footer-copy: #cbd5e1;
                --footer-link: #dbeafe;
                --footer-muted: #cbd5e1;
                --footer-input-bg: rgba(15, 23, 42, 0.92);
                --footer-icon-bg: rgba(30, 41, 59, 0.9);
                --footer-shadow: 0 26px 62px rgba(0, 0, 0, 0.36);
            }

            #foot::before {
                content: '';
                position: absolute;
                top: 0;
                left: 50%;
                width: min(620px, 82vw);
                height: 2px;
                transform: translateX(-50%);
                background: linear-gradient(90deg, transparent, var(--pur), #06b6d4, transparent);
                opacity: 0.55;
            }

            #foot .footer-shell {
                padding: 34px 0 18px;
            }

            #foot .footer-panel {
                display: grid;
                grid-template-columns: minmax(270px, 1.05fr) minmax(300px, 1.2fr) minmax(320px, 0.95fr);
                align-items: stretch;
                gap: 28px;
                padding: 26px;
                background: var(--footer-panel-bg);
                border: 1px solid var(--footer-panel-border);
                border-radius: 8px;
                box-shadow: var(--footer-shadow);
            }

            html.lm #foot .footer-panel {
                background: var(--footer-panel-bg);
                box-shadow: var(--footer-shadow);
            }

            .footer-brand,
            .footer-action {
                min-width: 0;
            }

            .footer-brand-link {
                display: inline-flex;
                align-items: center;
                gap: 10px;
                margin-bottom: 12px;
                color: var(--footer-heading);
                text-decoration: none;
            }

            .footer-brand-link span {
                font-size: 1.18rem;
                font-weight: 800;
                line-height: 1;
                letter-spacing: 0;
                color: var(--footer-heading);
            }

            .footer-logo {
                width: 34px !important;
                height: 34px !important;
                background: #ffffff !important;
                padding: 0 !important;
            }

            .footer-copy {
                max-width: 380px;
                margin: 0;
                color: var(--footer-copy);
                font-size: 0.88rem;
                line-height: 1.62;
            }

            .footer-nav-grid {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 26px;
                min-width: 0;
            }
            .footer-heading {
                font-size: 0.76rem;
                font-weight: 800;
                color: var(--footer-heading);
                margin-bottom: 0.72rem;
                letter-spacing: 0.08em;
                text-transform: uppercase;
            }

            .footer-links {
                margin: 0;
                padding: 0;
            }

            .footer-links li {
                margin-bottom: 0.48rem;
            }

            .footer-links a {
                color: var(--footer-link);
                text-decoration: none;
                font-size: 0.84rem;
                line-height: 1.35;
                transition: color 0.2s ease, transform 0.2s ease;
                display: inline-block;
            }

            .footer-links a:hover {
                color: var(--pur);
                transform: translateX(3px);
            }

            .footer-action {
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                gap: 14px;
                padding: 18px;
                background: var(--footer-action-bg);
                border: 1px solid var(--footer-action-border);
                border-radius: 8px;
            }

            .footer-action p {
                color: var(--footer-copy);
                font-size: 0.84rem;
                line-height: 1.55;
                margin: 0;
            }

            .footer-newsletter {
                display: grid !important;
                grid-template-columns: minmax(0, 1fr) 42px;
                gap: 8px !important;
                margin: 0;
            }

            .footer-newsletter input {
                min-width: 0;
                height: 42px;
                background: var(--footer-input-bg) !important;
                border: 1px solid var(--footer-action-border) !important;
                color: var(--footer-heading) !important;
                padding: 0 12px !important;
                border-radius: 8px !important;
                font-size: 0.84rem !important;
                box-shadow: none !important;
            }

            .footer-newsletter input:focus {
                border-color: var(--pur) !important;
                box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.16) !important;
            }

            .footer-newsletter-btn {
                width: 42px;
                height: 42px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                padding: 0 !important;
                background: linear-gradient(135deg, var(--pur), #06b6d4);
                color: #fff;
                border: none;
                border-radius: 8px;
                transition: transform 0.2s, box-shadow 0.2s;
            }

            .footer-newsletter-btn:hover {
                transform: translateY(-1px);
                box-shadow: 0 10px 24px rgba(59, 130, 246, 0.28);
                color: #fff;
            }

            .footer-socials {
                display: flex;
                flex-wrap: wrap;
                gap: 8px;
            }

            .footer-social-link {
                display: flex;
                align-items: center;
                justify-content: center;
                width: 36px;
                height: 36px;
                background: var(--footer-icon-bg);
                border: 1px solid var(--footer-action-border);
                border-radius: 8px;
                color: var(--footer-link);
                transition: transform 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
                text-decoration: none;
                font-size: 0.9rem;
            }

            .footer-social-link:hover {
                background: var(--pur);
                color: #fff;
                border-color: var(--pur);
                transform: translateY(-2px);
                box-shadow: 0 10px 22px rgba(59, 130, 246, 0.24);
            }

            .footer-bottom {
                display: flex;
                align-items: center;
                justify-content: space-between;
                flex-wrap: wrap;
                gap: 12px;
                border-top: 1px solid var(--footer-panel-border);
                padding: 16px 2px 0;
                margin-top: 18px;
            }

            .footer-bottom p {
                color: var(--footer-muted);
                margin: 0;
                font-size: 0.8rem;
            }

            .footer-legal {
                display: flex;
                align-items: center;
                flex-wrap: wrap;
                gap: 9px;
                font-size: 0.8rem;
            }

            .footer-legal-link {
                color: var(--footer-muted);
                text-decoration: none;
                transition: color 0.2s ease;
            }

            .footer-legal-link:hover {
                color: var(--pur);
            }

            .footer-dot {
                width: 4px;
                height: 4px;
                border-radius: 50%;
                background: var(--footer-panel-border);
            }

            @media (max-width: 991.98px) {
                #foot .footer-panel {
                    grid-template-columns: 1fr;
                    gap: 16px;
                    padding: 18px;
                }

                .footer-copy {
                    max-width: none;
                }
            }

            @media (max-width: 575.98px) {
                #foot .footer-shell {
                    padding: 18px 0 12px;
                }

                #foot .footer-panel {
                    gap: 13px;
                    padding: 14px;
                }

                .footer-brand-link {
                    width: 100%;
                    justify-content: center;
                    margin-bottom: 10px;
                }

                .footer-copy {
                    text-align: justify;
                    text-align-last: center;
                    font-size: 0.8rem;
                    line-height: 1.5;
                }

                .footer-nav-grid {
                    grid-template-columns: repeat(2, minmax(0, 1fr));
                    gap: 12px;
                }

                .footer-heading {
                    margin-bottom: 0.55rem;
                    font-size: 0.66rem;
                }

                .footer-links li {
                    margin-bottom: 0.36rem;
                }

                .footer-links a {
                    font-size: 0.72rem;
                }

                .footer-action {
                    gap: 10px;
                    padding: 12px;
                }

                .footer-action p {
                    font-size: 0.76rem;
                }

                .footer-socials {
                    justify-content: center;
                }

                .footer-bottom {
                    justify-content: center;
                    text-align: center;
                    padding-top: 12px;
                    margin-top: 12px;
                }

                .footer-legal {
                    justify-content: center;
                    gap: 8px;
                }
            }

         /* Guest contrast guard: keeps landing, auth, splash, and mobile UI readable in both themes. */
         #landing,
         #landing :where(section, footer, .gc, .accordion-item),
         #pwa-install-prompt {
            color: var(--tx);
         }

         #landing :where(h1, h2, h3, h4, h5, h6, .stitle, .footer-heading) {
            color: var(--tx) !important;
            -webkit-text-fill-color: var(--tx) !important;
         }

         #landing :where(p, .ssub, .footer-links a),
         #landing :where([style*="color:var(--tx2)"], [style*="color: var(--tx2)"]) {
            color: var(--tx2) !important;
            -webkit-text-fill-color: var(--tx2) !important;
         }

         #landing :where(.guest-header-clock, [style*="color:var(--tx3)"], [style*="color: var(--tx3)"]) {
            color: var(--tx3) !important;
            -webkit-text-fill-color: var(--tx3) !important;
         }

         #landing .gt,
         #landing .slbl,
         #landing .slbl *,
         #landing .hbadge,
         #landing :where(.ftico, .ftico i, .tech-icons a:hover) {
            -webkit-text-fill-color: initial !important;
         }

         #landing .hbadge {
            color: var(--pur) !important;
            -webkit-text-fill-color: var(--pur) !important;
         }

         #landing .gt {
            background: linear-gradient(135deg, #2563eb, #06b6d4);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent !important;
         }

         #landing :where(.gc, .accordion-item) {
            background: var(--sf) !important;
            border-color: var(--bd) !important;
            box-shadow: 0 14px 34px rgba(2, 6, 23, 0.12);
         }

         html:not(.lm) #landing :where(.gc, .accordion-item) {
            background: rgba(18, 18, 31, 0.96) !important;
            border-color: rgba(148, 163, 184, 0.18) !important;
            box-shadow: 0 18px 48px rgba(0, 0, 0, 0.32);
         }

         html.lm #landing :where(.gc, .accordion-item) {
            background: #ffffff !important;
            border-color: rgba(37, 99, 235, 0.14) !important;
         }

         #landing .ftag,
         #landing .hnum,
         #landing .ftico,
         #landing .footer-social-link,
         #landing .contact-card {
            background: var(--bg3) !important;
            border-color: var(--bd) !important;
            color: var(--tx) !important;
         }

         html:not(.lm) #landing :where(.ftag, .hnum, .ftico, .footer-social-link) {
            background: rgba(30, 41, 59, 0.74) !important;
            border-color: rgba(148, 163, 184, 0.18) !important;
         }

         html.lm #landing :where(.ftag, .hnum, .ftico, .footer-social-link) {
            background: #f8fafc !important;
            border-color: #dbeafe !important;
         }

         #landing #foot .footer-panel {
            background: var(--footer-panel-bg) !important;
            border-color: var(--footer-panel-border) !important;
            box-shadow: var(--footer-shadow) !important;
         }

         #landing #foot .footer-action {
            background: var(--footer-action-bg) !important;
            border-color: var(--footer-action-border) !important;
         }

         #landing #foot :where(.footer-brand-link, .footer-brand-link span, .footer-heading) {
            color: var(--footer-heading) !important;
            -webkit-text-fill-color: var(--footer-heading) !important;
         }

         #landing #foot :where(.footer-copy, .footer-action p) {
            color: var(--footer-copy) !important;
            -webkit-text-fill-color: var(--footer-copy) !important;
         }

         #landing #foot .footer-links a {
            color: var(--footer-link) !important;
            -webkit-text-fill-color: var(--footer-link) !important;
         }

         #landing #foot :where(.footer-bottom p, .footer-legal-link) {
            color: var(--footer-muted) !important;
            -webkit-text-fill-color: var(--footer-muted) !important;
         }

         #landing #foot .footer-newsletter input {
            background: var(--footer-input-bg) !important;
            border-color: var(--footer-action-border) !important;
            color: var(--footer-heading) !important;
            -webkit-text-fill-color: var(--footer-heading) !important;
         }

         #landing #foot .footer-social-link {
            background: var(--footer-icon-bg) !important;
            border-color: var(--footer-action-border) !important;
            color: var(--footer-link) !important;
            -webkit-text-fill-color: var(--footer-link) !important;
         }

         #landing :where(.boc, #thbtn, #mbtog, .nav-link),
         #pwa-install-prompt .pwa-btn-no {
            color: var(--tx) !important;
            border-color: var(--bd2) !important;
         }

         #landing :where(.boc, #thbtn, #mbtog):hover,
         #landing .nav-link.active,
         #landing .nav-link:hover,
         #pwa-install-prompt .pwa-btn-no:hover {
            background: rgba(59, 130, 246, 0.12) !important;
            color: var(--tx) !important;
            border-color: rgba(59, 130, 246, 0.38) !important;
         }

         #landing :where(.bgrd, .footer-newsletter-btn),
         #pwa-install-prompt .pwa-btn-yes {
            color: #ffffff !important;
            -webkit-text-fill-color: #ffffff !important;
         }

         #landing :where(.form-control, .form-select, textarea) {
            background: var(--bg) !important;
            border-color: var(--bd) !important;
            color: var(--tx) !important;
            caret-color: var(--pur);
         }

         html.lm #landing :where(.form-control, .form-select, textarea) {
            background: #ffffff !important;
            border-color: #cbd5e1 !important;
         }

         #landing :where(.form-control, .form-select, textarea)::placeholder {
            color: var(--tx3) !important;
            font-weight: 400 !important;
            opacity: 1;
         }

         #landing :where(.form-control, .form-select, textarea):focus {
            border-color: var(--pur) !important;
            box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.18) !important;
         }

         #landing .acco .accordion-button {
            background: var(--sf) !important;
            color: var(--tx) !important;
            -webkit-text-fill-color: var(--tx) !important;
            border-color: var(--bd) !important;
            box-shadow: none !important;
         }

         #landing .acco .accordion-button:not(.collapsed) {
            background: rgba(59, 130, 246, 0.14) !important;
            color: var(--tx) !important;
         }

         #landing .acco .accordion-body {
            background: var(--bg3) !important;
            color: var(--tx2) !important;
            -webkit-text-fill-color: var(--tx2) !important;
            border-top: 1px solid var(--bd);
         }

         html.lm #landing .acco .accordion-body {
            background: #f8fafc !important;
         }

         #landing #faq .acco .accordion-item,
         #landing #faq .acco .accordion-button,
         #landing #faq .acco .accordion-body {
            background: var(--faq-card-bg) !important;
            border-color: var(--faq-card-border) !important;
         }

         #landing #faq .acco .accordion-button {
            color: var(--faq-heading) !important;
            -webkit-text-fill-color: var(--faq-heading) !important;
         }

         #landing #faq .acco .accordion-button:not(.collapsed) {
            background: var(--faq-active-bg) !important;
            color: var(--faq-heading) !important;
            -webkit-text-fill-color: var(--faq-heading) !important;
         }

         #landing #faq .acco .accordion-body {
            color: var(--faq-body) !important;
            -webkit-text-fill-color: var(--faq-body) !important;
         }

         #landing .accordion-button::after {
            filter: none;
         }

         html:not(.lm) #landing .accordion-button::after {
            filter: invert(1) grayscale(1) brightness(1.7);
         }

         #landing .tech-icons a,
         #landing .footer-social-link {
            color: var(--tx2) !important;
            -webkit-text-fill-color: var(--tx2) !important;
         }

         #landing .hero-tech-title,
         #landing .hero-tech-card .tech-icons a {
            color: var(--hero-tech-color, #000000) !important;
            -webkit-text-fill-color: var(--hero-tech-color, #000000) !important;
         }

         #landing .footer-social-link:hover,
         #landing .footer-social-link:hover i {
            color: #ffffff !important;
            -webkit-text-fill-color: #ffffff !important;
         }

         #pwa-install-prompt .pwa-install-dialog {
            background: color-mix(in srgb, var(--sf) 94%, transparent) !important;
            border-color: var(--bd) !important;
         }

         html.lm #landing #hero .hero-cta-row > .boc.btn {
            color: #0f172a !important;
            -webkit-text-fill-color: #0f172a !important;
            background: rgba(255, 255, 255, 0.74) !important;
            border-color: rgba(37, 99, 235, 0.24) !important;
         }

         html:not(.lm) #landing #hero .hero-cta-row > .boc.btn {
            color: #f8fafc !important;
            -webkit-text-fill-color: #f8fafc !important;
            background: rgba(15, 23, 42, 0.68) !important;
            border-color: rgba(248, 250, 252, 0.28) !important;
         }

         #landing #hero .hero-cta-row > .bgrd.btn {
            color: #ffffff !important;
            -webkit-text-fill-color: #ffffff !important;
            background: linear-gradient(135deg, #2563eb, #0284c7) !important;
            border-color: transparent !important;
         }

         #landing #hero .hero-cta-row > .btn i {
            color: #2563eb !important;
            -webkit-text-fill-color: #2563eb !important;
         }

         html:not(.lm) #landing #hero .hero-cta-row > .btn i {
            color: #60a5fa !important;
            -webkit-text-fill-color: #60a5fa !important;
         }

         @supports not (background: color-mix(in srgb, #fff 50%, transparent)) {
            #pwa-install-prompt .pwa-install-dialog {
               background: var(--sf) !important;
            }
         }

      /* Developers section contrast: keep headings and cards readable in day and night themes. */
      #developers.sp {
          --developers-section-bg: #eef4fb;
          --developers-heading: #0f172a;
          --developers-copy: #334155;
          --developers-muted-strong: #475569;
          --developers-card-bg: rgba(255, 255, 255, 0.97);
          --developers-card-border: rgba(37, 99, 235, 0.16);
          --developers-card-shadow: 0 20px 48px rgba(15, 23, 42, 0.1);
          background: var(--developers-section-bg) !important;
      }

      html:not(.lm) #developers.sp {
          --developers-section-bg: #020617;
          --developers-heading: #f8fafc;
          --developers-copy: #dbeafe;
          --developers-muted-strong: #cbd5e1;
          --developers-card-bg: rgba(15, 23, 42, 0.88);
          --developers-card-border: rgba(96, 165, 250, 0.26);
          --developers-card-shadow: 0 22px 54px rgba(0, 0, 0, 0.34);
      }

      #developers .slbl {
          color: #2563eb !important;
          -webkit-text-fill-color: #2563eb !important;
      }

      html:not(.lm) #developers .slbl {
          color: #93c5fd !important;
          -webkit-text-fill-color: #93c5fd !important;
      }

      #developers .stitle {
          color: var(--developers-heading) !important;
          -webkit-text-fill-color: var(--developers-heading) !important;
          text-shadow: 0 12px 22px rgba(15, 23, 42, 0.12);
      }

      html:not(.lm) #developers .stitle {
          text-shadow: 0 12px 24px rgba(0, 0, 0, 0.34);
      }

      #developers .stitle .gt {
          -webkit-text-fill-color: transparent !important;
      }

      #developers .developer-card {
          background: var(--developers-card-bg) !important;
          border-color: var(--developers-card-border) !important;
          box-shadow: var(--developers-card-shadow) !important;
      }

      #developers .developer-card h6 {
          color: var(--developers-heading) !important;
          -webkit-text-fill-color: var(--developers-heading) !important;
      }

      #developers .developer-role {
          color: var(--developers-muted-strong) !important;
          -webkit-text-fill-color: var(--developers-muted-strong) !important;
      }

      #developers .developer-bio {
          color: var(--developers-copy) !important;
          -webkit-text-fill-color: var(--developers-copy) !important;
      }

      /* Guest landing speed pass: remove artificial waits while keeping motion readable. */

      body.guest-shell #landing .afu,
      body.guest-shell #landing .rv {
          animation-delay: 0s !important;
          transition-delay: 0s !important;
      }

      body.guest-shell #landing .afu {
          animation-duration: 0.24s !important;
      }

      body.guest-shell #landing .rv {
          transition-duration: 0.22s !important;
      }

      body.guest-desktop-shell #landing .desktop-hero-image {
          transition-duration: 160ms !important;
      }