/* Telos Nexus mobile layer — generated by tools/mobile_kit.py; edit there. */

/* ---------- touch polish (all touch devices) ---------- */
html { -webkit-tap-highlight-color: transparent; }
a, button, summary, label, [role="button"], [role="radio"], [role="tab"] { touch-action: manipulation; }
.logo { min-height: 44px; }
.sv-hero__crumb a, .crumbs a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
.lang { min-width: 44px; }
.plain-link, .foot__nav a, .foot__nav > span, .foot a[href^="mailto:"], .foot__in > a:not(.logo) { display: inline-flex; align-items: center; min-height: 44px; }
@media (hover: none) {
  a, button, summary, [role="radio"], [role="tab"] { transition: opacity .15s ease, transform .15s ease; }
  :is(.btn, .bar__cta, .top__cta):active { transform: scale(.97); }
  :is(a, button, summary, [role="radio"], [role="tab"]):active { opacity: .7; }
}

/* ---------- animation only runs where it can be seen ---------- */
.tn-off, .tn-off * { animation-play-state: paused !important; }

/* ---------- phones ---------- */
@media (max-width: 680px) {
  /* rhythm: phones don't need desktop-sized silence between chapters */
  .slide { padding-block: clamp(60px, 15vw, 76px); }
  .slide.hero, .slide.opening, .slide.c-hero, .slide.s-hero { padding-block-end: 56px; }

  /* readable minimum for small UI labels */
  :is(small, .ui__tag, .ui__row--dim, .strip__label, .logo__sub, .panel__cap, .ui__meter span, .ux-chip, .state, .foot__meta, .foot__small) { font-size: max(13px, .8125rem); }

  /* product rails: swipe instead of six stacked panels */
  .products.tn-rail { display: flex; gap: 12px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory;
    margin-inline: calc(var(--pad, 20px) * -1); padding-inline: var(--pad, 20px); scroll-padding-inline: var(--pad, 20px); scrollbar-width: none; }
  .products.tn-rail::-webkit-scrollbar { display: none; }
  .products.tn-rail > * { flex: 0 0 min(84%, 340px); scroll-snap-align: start; }
  .tn-rail-bar { display: block; height: 3px; border-radius: 2px; margin-block-start: 18px; background: rgb(0 0 0 / .1); overflow: hidden; }
  .tn-rail-bar i { display: block; height: 100%; width: var(--w, 20%); border-radius: inherit; background: #750FB7;
    transform: translateX(var(--x, 0)); transition: transform .12s linear; }
  [dir="rtl"] .tn-rail-bar i { transform: translateX(calc(var(--x, 0) * -1)); }
}
.tn-rail-bar { display: none; }

/* ---------- phone accordions: footer groups, long lists, [data-more] details ---------- */
.tn-acc__head { cursor: pointer; }
@media (max-width: 680px) {
  .tn-acc__head { display: flex !important; align-items: center; justify-content: space-between; gap: 16px; min-height: 52px; margin: 0; }
  .tn-acc__head::after { content: ""; flex: none; width: 9px; height: 9px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translate(-2px, -2px); transition: transform .3s cubic-bezier(.22,.8,.24,1); opacity: .7; }
  .tn-acc.is-open > .tn-acc__head::after { transform: rotate(-135deg) translate(-2px, -2px); }
  .tn-acc:not(.is-open) > :not(.tn-acc__head) { display: none !important; }
  .tn-acc { border-block-end: 1px solid rgb(0 0 0 / .1); }
  .foot__in:has(.tn-acc) { row-gap: 0 !important; }
  .tn-more-hidden { display: none !important; }
  .tn-more-btn { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 48px; margin-block-start: 8px;
    border-radius: 999px; border: 1px solid rgb(117 15 183 / .35); background: transparent; color: #750FB7; font: inherit; font-weight: 700; cursor: pointer; }
  /* service rows: the title already links to the page — drop the duplicate link on phones */
  .svc .svc__go { display: none !important; }
  /* closing lockup panels: a phone needs a band, not a poster */
  .close__panel { aspect-ratio: 16 / 12 !important; min-height: 0 !important; }
}
@media (min-width: 681px) { .tn-more-btn { display: none; } }
.tn-more-btn[hidden] { display: none !important; }

/* ---------- thumb-reach action dock ---------- */
.tn-dock { position: fixed; z-index: 80; inset-inline: 12px; inset-block-end: calc(12px + env(safe-area-inset-bottom, 0px));
  display: none; align-items: center; justify-content: space-between; gap: 12px;
  padding: 8px 8px 8px 18px; border-radius: 999px; background: rgb(13 13 26 / .92); color: #fff;
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 18px 40px -18px rgb(13 13 26 / .7);
  transform: translateY(calc(100% + 24px)); transition: transform .45s cubic-bezier(.22,.8,.24,1); }
[dir="rtl"] .tn-dock { padding: 8px 18px 8px 8px; }
.tn-dock__hint { font-size: .9rem; color: rgb(255 255 255 / .75); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tn-dock__cta { flex: none; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px;
  border-radius: 999px; background: #750FB7; color: #fff; font-weight: 700; text-decoration: none; }
@media (max-width: 760px) {
  .tn-dock { display: flex; }
  .tn-dock.is-shown { transform: none; }
}
@media (prefers-reduced-motion: reduce) { .tn-dock { transition: none; } }