/* Phase 43 — Visual Quality & Design Consistency
   Deliberately scoped to established page classes/components.
   Active GSC/CRO measurement pages do not load this stylesheet. */

:root {
  --lt-polish-line: #dbe3ec;
  --lt-polish-surface: #ffffff;
  --lt-polish-muted: #f7f9fc;
  --lt-polish-shadow: 0 18px 48px rgba(15, 23, 42, .08);
  --lt-polish-shadow-soft: 0 8px 24px rgba(15, 23, 42, .055);
  --lt-polish-radius: 16px;
}

/* Legacy guides: bring the older article template closer to the newer
   editorial/product system without changing content or hierarchy. */
body.lt-page-guide .page-header {
  padding-top: clamp(48px, 6vw, 68px);
  padding-bottom: clamp(92px, 9vw, 112px);
}
body.lt-page-guide .page-header h1 {
  max-width: 820px;
  margin-inline: auto;
  font-size: clamp(2rem, 4.4vw, 3.15rem);
  line-height: 1.06;
  letter-spacing: -.04em;
  text-wrap: balance;
}
body.lt-page-guide .page-header .lead {
  max-width: 720px;
  color: rgba(226,232,240,.84);
  font-size: clamp(1rem, 1.45vw, 1.12rem);
  line-height: 1.7;
  text-wrap: pretty;
}
body.lt-page-guide .main-content {
  width: min(100% - 28px, 920px);
  padding-inline: 0;
}
body.lt-page-guide .article-card {
  padding: clamp(30px, 4.3vw, 50px);
  border: 1px solid var(--lt-polish-line);
  border-radius: var(--lt-polish-radius);
  box-shadow: var(--lt-polish-shadow);
}
body.lt-page-guide .article-card h2 {
  margin-top: 46px;
  margin-bottom: 16px;
  font-size: clamp(1.5rem, 2.5vw, 1.85rem);
  line-height: 1.18;
  letter-spacing: -.025em;
  text-wrap: balance;
}
body.lt-page-guide .article-card h3 {
  margin-top: 30px;
  line-height: 1.3;
  text-wrap: balance;
}
body.lt-page-guide .article-card :where(p, li) {
  line-height: 1.75;
  text-wrap: pretty;
}
body.lt-page-guide .article-card p {
  font-size: 1.03rem;
}
body.lt-page-guide .article-card :where(ul, ol) {
  font-size: 1rem;
}

/* Information surfaces: same radius, border weight and spacing language. */
body.lt-page-guide :is(.info-box, .warn-box, .success-box, .brian-box.brian-box) {
  margin-block: 26px;
  padding: 18px 20px;
  border-top-width: 1px;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-style: solid;
  border-radius: 12px !important;
  box-shadow: none;
}
body.lt-page-guide .info-box {
  border-color: #bfdbfe;
  border-left: 4px solid #2563eb;
  background: #f4f8ff;
}
body.lt-page-guide .warn-box,
body.lt-page-guide .brian-box.brian-box {
  border-color: #fde7a9;
  border-left: 4px solid #f59e0b;
  background: #fffaf0;
}
body.lt-page-guide .success-box {
  border-color: #bbf7d0;
  border-left: 4px solid #10b981;
  background: #f4fcf7;
}
body.lt-page-guide .brian-box.brian-box > p {
  font-size: .96rem;
  line-height: 1.68;
}

/* Tables: make the scroll affordance look intentional instead of like an
   unstyled overflow container. */
body.lt-page-guide .tabel-wrap {
  margin-block: 26px;
  border: 1px solid var(--lt-polish-line);
  border-radius: 12px;
  background: var(--lt-polish-surface);
  overflow: hidden;
}
body.lt-page-guide .tabel-wrap > .lt-table-scroll {
  margin: 0;
  border-radius: 0;
}
body.lt-page-guide .tabel-wrap table {
  border: 0 !important;
  border-radius: 0 !important;
}
body.lt-page-guide .tabel-wrap tbody tr:last-child {
  border-bottom: 0;
}

/* Affiliate and related-link blocks: visually related, but affiliate actions
   remain explicit and keep their existing tracking/rel attributes. */
body.lt-page-guide :is(.aff-box, .related-links) {
  border: 1px solid var(--lt-polish-line);
  border-radius: 14px;
  background: var(--lt-polish-muted);
  box-shadow: none;
}
body.lt-page-guide .aff-btn,
body.lt-page-guide .related-links a {
  min-height: 48px;
  border-color: #d7e0ea;
  border-radius: 10px;
  background: #fff;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
}
body.lt-page-guide .aff-btn:hover,
body.lt-page-guide .related-links a:hover {
  border-color: #93b4ef;
  background: #fff;
  box-shadow: var(--lt-polish-shadow-soft);
  transform: translateY(-1px);
}
body.lt-page-guide .aff-btn:focus-visible,
body.lt-page-guide .related-links a:focus-visible {
  border-color: #2563eb;
}
body.lt-page-guide .affiliate-note {
  color: #64748b;
}

/* Existing editorial/product pages already use the newer template; only a
   very small surface polish is needed. */
body.editorial-page :is(.editorial-panel, .editorial-sidebar__card) {
  border-color: var(--lt-polish-line);
  box-shadow: var(--lt-polish-shadow-soft);
}
body.editorial-page .editorial-panel {
  border-radius: 14px;
}
body.editorial-page .editorial-sidebar__card {
  border-radius: 12px;
}

@media (max-width: 768px) {
  body.lt-page-guide .page-header {
    padding: 44px 16px 92px;
  }
  body.lt-page-guide .page-header h1 {
    font-size: clamp(1.9rem, 8.2vw, 2.45rem);
    line-height: 1.08;
  }
  body.lt-page-guide .main-content {
    width: min(100% - 24px, 920px);
    margin-top: -64px;
  }
  body.lt-page-guide .article-card {
    padding: 26px 21px;
    border-radius: 15px;
    box-shadow: 0 14px 36px rgba(15, 23, 42, .075);
  }
  body.lt-page-guide .article-card h2 {
    margin-top: 36px;
    font-size: clamp(1.38rem, 6vw, 1.65rem);
  }
  body.lt-page-guide .article-card p {
    font-size: 1rem;
  }
  body.lt-page-guide :is(.info-box, .warn-box, .success-box, .brian-box.brian-box) {
    padding: 16px 17px;
  }
  body.lt-page-guide :is(.aff-box, .related-links) {
    padding: 19px 17px;
  }
}

@media (max-width: 480px) {
  body.lt-page-guide .main-content { width: min(100% - 20px, 920px); }
  body.lt-page-guide .article-card { padding: 24px 18px; }
}

@media (prefers-reduced-motion: reduce) {
  body.lt-page-guide .aff-btn,
  body.lt-page-guide .related-links a { transition: none; }
}

/* Phase 44 — Mobile UX Deep Audit
   Applies only through the existing polish layer, so active GSC/CRO
   measurement pages remain visually frozen until their measurement window ends. */
@media (max-width: 768px) {
  /* Prevent iOS/Safari form zoom and make data-entry controls comfortable to tap. */
  body :where(
    input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not(.lt-honeypot),
    select,
    textarea
  ) {
    min-height: 44px;
    font-size: 16px !important;
  }

  /* Range controls keep their visual track but receive a proper touch box. */
  body input[type="range"] {
    min-height: 44px;
    touch-action: pan-x;
  }

  /* Native toggles are still backed by their clickable labels; make the
     visible control easier to acquire without inflating the surrounding UI. */
  body :where(input[type="checkbox"], input[type="radio"]) {
    min-width: 20px;
    min-height: 20px;
  }

  /* Footer cookie settings was only text-height on mobile. */
  body .lt-footer__column .lt-cookie-settings {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    padding-block: 8px;
    touch-action: manipulation;
  }

  /* Keep dense form/toggle rows as useful touch targets. */
  body :where(.install-extra-grid label, .install-price-form__confirm, .rute-toggle, .rute-country) {
    min-height: 44px;
  }

  /* Mobile tables are intentionally scrollable, never allowed to widen the page. */
  body .lt-table-scroll {
    max-width: 100%;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  /* Defensive sizing for nested cards/panels and unusually long URLs/terms. */
  body :where(.article-card, .editorial-panel, .editorial-sidebar__card, .block, .rute-panel, .main-content) {
    min-width: 0;
    overflow-wrap: break-word;
  }
}