/* GoldAutoTradePRO final mobile polish v2.5
   Scoped to mobile viewports. Desktop geometry and component layout remain unchanged. */

@media (max-width: 840px) {
  html { scroll-behavior: auto; }

  /* Reduce paint-heavy effects that can cause iOS/Safari scroll jitter. */
  body::before { display: none !important; }
  .site-header {
    background: rgba(5, 11, 18, .97) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  .topline { display: none !important; }
  .js .reveal,
  .reveal,
  .reveal.visible {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  /* Premium headline wrapping: never split words or auto-hyphenate. */
  h1, h2, h3,
  .hero h1, .page-hero h1,
  .section-head h2, .final-cta h2,
  .legal h1, .legal h2, .legal h3 {
    -webkit-hyphens: none !important;
    hyphens: none !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
  }
  .hero h1, .page-hero h1, .section-head h2, .final-cta h2 {
    max-width: 100% !important;
    text-wrap: balance;
  }
  .risk-title-word { white-space: nowrap; }

  /* Long single-word legal titles need a smaller mobile size rather than broken words. */
  body[data-page="privacy"] .page-hero h1,
  body[data-page="imprint"] .page-hero h1 {
    font-size: clamp(27px, 7.8vw, 36px) !important;
    letter-spacing: -.035em !important;
    line-height: 1.04 !important;
  }

  /* Mobile home: retain manual interactivity, remove decorative continuous motion. */
  body[data-page="home"] .home-hero-grid,
  body[data-page="home"] .home-hero-copy,
  body[data-page="home"] .sequence-console {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  body[data-page="home"] .sequence-console,
  body[data-page="home"] [data-decision-engine] {
    contain: layout paint;
  }
  body[data-page="home"] .stage-overlay,
  body[data-page="home"] .benefit-track,
  body[data-page="home"] .decision-beam::before,
  body[data-page="home"] .decision-beam i {
    transition: none !important;
  }
  body[data-page="home"] .stage-button.is-active::after,
  body[data-page="home"] .decision-node.is-active .decision-cog::before {
    animation: none !important;
  }
  body[data-page="home"] .system-status i {
    box-shadow: none;
  }
  body[data-page="home"] .stage-explainer,
  body[data-page="home"] .sequence-console--expanded .stage-explainer {
    grid-template-columns: minmax(0, 1fr) !important;
    min-height: 168px;
    align-content: start;
  }
  body[data-page="home"] .decision-detail {
    min-height: 268px;
    align-content: start;
  }

  /* Remove only the repeated leveraged-risk footer line on mobile. */
  .footer-risk-repeat { display: none !important; }
  .footer-bottom:has(.footer-risk-repeat) {
    justify-content: flex-start;
  }
}

@media (max-width: 760px) {
  /* Mobile replacement for the desktop orbital architecture.
     The same five interactive buttons and live description remain in use. */
  body[data-page="system"] .orbit-stage-shell {
    gap: 14px;
  }
  body[data-page="system"] .system-orbit-3d {
    min-height: 0 !important;
    padding: 16px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
    overflow: hidden !important;
    border-radius: 24px !important;
    background:
      radial-gradient(circle at 78% 4%, rgba(74,163,255,.12), transparent 34%),
      linear-gradient(150deg, rgba(13,31,47,.98), rgba(4,11,18,.995)) !important;
  }
  body[data-page="system"] .system-orbit-3d::before {
    display: block !important;
    inset: 0 !important;
    background: linear-gradient(180deg, rgba(255,191,71,.045), transparent 38%) !important;
  }
  body[data-page="system"] .system-orbit-3d::after,
  body[data-page="system"] .orbit-space,
  body[data-page="system"] .core-halo {
    display: none !important;
  }
  body[data-page="system"] .orbit-core-3d {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    width: 100% !important;
    height: auto !important;
    min-height: 112px !important;
    padding: 20px 18px !important;
    border-radius: 19px !important;
    z-index: 2 !important;
    text-align: left !important;
    place-items: center start !important;
    background:
      radial-gradient(circle at 90% 20%, rgba(255,191,71,.16), transparent 35%),
      linear-gradient(145deg, rgba(255,191,71,.11), rgba(8,20,31,.96) 64%) !important;
    box-shadow: inset 4px 0 0 rgba(255,191,71,.78), 0 14px 34px rgba(0,0,0,.25) !important;
  }
  body[data-page="system"] .orbit-core-3d strong {
    font-size: 20px !important;
  }
  body[data-page="system"] .orbit-core-3d span {
    margin-top: 7px !important;
    color: #9fb5c4 !important;
  }
  body[data-page="system"] .orbit-node-3d {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 60px !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) 26px !important;
    align-items: center !important;
    gap: 12px !important;
    text-align: left !important;
    border-radius: 15px !important;
    animation: none !important;
    z-index: 2 !important;
  }
  body[data-page="system"] .orbit-node-3d:hover,
  body[data-page="system"] .orbit-node-3d:focus-visible {
    transform: none !important;
  }
  body[data-page="system"] .orbit-node-3d i {
    width: 34px !important;
    height: 34px !important;
    margin: 0 !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 11px !important;
    color: #d8e7ef !important;
    background: rgba(74,163,255,.12) !important;
    border: 1px solid rgba(104,216,255,.25) !important;
    box-shadow: none !important;
    font-style: normal !important;
    font-size: 10px !important;
    font-weight: 950 !important;
    letter-spacing: .06em !important;
  }
  body[data-page="system"] .orbit-node-3d.signal i::after { content: "01"; }
  body[data-page="system"] .orbit-node-3d.structure i::after { content: "02"; }
  body[data-page="system"] .orbit-node-3d.quality i::after { content: "03"; }
  body[data-page="system"] .orbit-node-3d.order i::after { content: "04"; }
  body[data-page="system"] .orbit-node-3d.operation i::after { content: "05"; }
  body[data-page="system"] .orbit-node-3d span {
    font-size: 14px !important;
    font-weight: 900 !important;
  }
  body[data-page="system"] .orbit-node-3d::after {
    content: "›" !important;
    justify-self: end !important;
    color: #7891a2 !important;
    font-size: 24px !important;
    line-height: 1 !important;
  }
  body[data-page="system"] .orbit-node-3d.is-active {
    border-color: rgba(255,191,71,.62) !important;
    background: linear-gradient(145deg, rgba(255,191,71,.15), rgba(9,24,37,.98)) !important;
    box-shadow: inset 3px 0 0 rgba(255,191,71,.88), 0 10px 28px rgba(0,0,0,.22) !important;
  }
  body[data-page="system"] .orbit-node-3d.is-active i {
    color: #191104 !important;
    border-color: transparent !important;
    background: linear-gradient(135deg, var(--orange), var(--gold)) !important;
  }
  body[data-page="system"] .orbit-node-3d.is-active::after {
    color: var(--gold-2) !important;
  }
  body[data-page="system"] .orbit-description {
    grid-template-columns: 48px minmax(0, 1fr) !important;
    gap: 14px !important;
    padding: 17px !important;
    border-radius: 17px !important;
  }
  body[data-page="system"] .orbit-description-index {
    display: grid !important;
    width: 46px !important;
    height: 46px !important;
    border-radius: 13px !important;
    font-size: 14px !important;
  }
  body[data-page="system"] .orbit-description strong {
    font-size: 17px !important;
  }
  body[data-page="system"] .orbit-description p {
    font-size: 13px !important;
    line-height: 1.55 !important;
  }
}

@media (max-width: 600px) {
  .hero h1, .page-hero h1 {
    font-size: clamp(36px, 10.8vw, 43px) !important;
    line-height: 1 !important;
    letter-spacing: -.048em !important;
  }
  .section-head h2, .final-cta h2 {
    font-size: clamp(29px, 8.2vw, 39px) !important;
    line-height: 1.06 !important;
    letter-spacing: -.04em !important;
  }
  .legal h2 {
    font-size: clamp(24px, 7.1vw, 30px) !important;
  }
  body[data-page="privacy"] .page-hero h1,
  body[data-page="imprint"] .page-hero h1 {
    font-size: clamp(21px, 6vw, 25px) !important;
    letter-spacing: -.03em !important;
  }
  body[data-page="request"] .page-hero h1,
  body[data-page="faq"] .page-hero h1,
  body[data-page="results-v17"] .page-hero h1 {
    font-size: clamp(34px, 9.8vw, 40px) !important;
  }

  body[data-page="vps"] .page-hero h1 {
    font-size: clamp(34px, 9.7vw, 39px) !important;
  }
  body[data-page="risk"] .page-hero h1 {
    font-size: clamp(30px, 8.4vw, 35px) !important;
    line-height: 1.04 !important;
  }
  body[data-page="risk"] .risk-title-word {
    display: block;
    white-space: nowrap;
  }
  body[data-page="home"] .stage-explainer {
    min-height: 184px;
  }
  body[data-page="home"] .decision-detail {
    min-height: 292px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-page="home"] .stage-button.is-active::after,
  body[data-page="home"] .decision-node.is-active .decision-cog::before {
    animation: none !important;
  }
}

/* Narrow-phone hardening. These rules prevent the compact header and long
   German legal headings from creating horizontal scroll at 320–360 px. */
@media (max-width: 370px) {
  .shell {
    width: min(100% - 20px, var(--max)) !important;
  }
  .nav {
    min-height: 66px !important;
    gap: 6px !important;
  }
  .brand {
    min-width: 0 !important;
    gap: 7px !important;
  }
  .brandmark {
    width: 36px !important;
    height: 36px !important;
    flex: 0 0 36px !important;
    border-radius: 12px !important;
  }
  .brandmark svg {
    width: 25px !important;
    height: 25px !important;
  }
  .brandtext {
    min-width: 0 !important;
  }
  .brandtext strong {
    font-size: 13px !important;
    letter-spacing: -.035em !important;
    white-space: nowrap !important;
  }
  .brandtext span {
    display: none !important;
  }
  .nav-actions {
    gap: 4px !important;
    flex: 0 0 auto !important;
  }
  .lang-link,
  .menu-btn {
    padding: 7px 8px !important;
    border-radius: 9px !important;
    font-size: 12px !important;
  }

  .hero h1,
  .page-hero h1,
  .section-head h2,
  .final-cta h2 {
    text-wrap: wrap !important;
  }
  .legal {
    padding: 20px !important;
  }
  .legal h2 {
    font-size: 21px !important;
    line-height: 1.08 !important;
  }
  body[data-page="privacy"] .page-hero h1,
  body[data-page="imprint"] .page-hero h1 {
    font-size: 19px !important;
    line-height: 1.08 !important;
    letter-spacing: -.025em !important;
  }
  body[data-page="risk"] .page-hero h1 {
    font-size: 27px !important;
  }
  body[data-page="system"] .section-head h2,
  body[data-page="request"] .section-head h2 {
    font-size: 27px !important;
    line-height: 1.07 !important;
  }
  body[data-page="vps"] .page-hero h1 {
    font-size: 30px !important;
    line-height: 1.02 !important;
  }
}

@media (max-width: 370px) {
  body[data-page="home"] .benefit-slide {
    flex: 0 0 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  body[data-page="home"] .benefit-slide > * {
    min-width: 0 !important;
  }
}
