/* SuiteXray landing — builds on tokens.css + app.css (buttons, canopy, aurora, notices, inputs). */
.lp { background: var(--surface); }
.lp h2 { font-size: clamp(28px, 3.2vw, 42px); line-height: 1.12; letter-spacing: var(--tracking-display); max-width: 22ch; }
.lp h3 { font-size: var(--text-md); line-height: 1.3; }
.lp section[id], .lp main { scroll-margin-top: 84px; }

/* Header */
.lp-head { position: sticky; top: 0; z-index: 50; background: rgba(3, 10, 31, .78); backdrop-filter: saturate(160%) blur(14px); -webkit-backdrop-filter: saturate(160%) blur(14px); border-bottom: 1px solid var(--glass-line); color: #fff; }
.lp-head__row { display: flex; align-items: center; gap: var(--space-5); min-height: 68px; }
.lp-head .brand__word { height: 20px; }
.lp-nav { display: flex; gap: 4px; margin-left: var(--space-3); }
.lp-nav a { color: var(--on-canopy-2); text-decoration: none; font-weight: 600; font-size: var(--text-sm); padding: 8px 12px; border-radius: var(--radius-pill); white-space: nowrap; }
.lp-nav a:hover { color: #fff; background: var(--glass); }
.lp-head__tools { margin-left: auto; display: flex; align-items: center; gap: var(--space-3); }
.lp-language { color-scheme: dark; flex: none; max-width: 124px; min-height: 44px; padding: 8px 10px; border: 1px solid var(--glass-line); border-radius: var(--radius-sm); background: var(--canopy-1); color: #fff; font-size: var(--text-sm); cursor: pointer; }
.lp-head :focus-visible { outline-color: var(--focus-on-dark); }
.lp-signin { color: #fff; text-decoration: none; font-weight: 600; font-size: var(--text-sm); padding: 8px 10px; white-space: nowrap; }
.lp-signin:hover { color: #fff; text-decoration: underline; }
.lp-head .btn--primary { min-height: 40px; padding: 8px 16px; white-space: nowrap; }

/* Hero */
.lp-hero { padding: var(--space-8) 0 var(--space-9); overflow: hidden; }
.lp-hero > .wrap { position: relative; }
.lp-hero__grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: var(--space-7); align-items: center; }
.lp-eyebrow { display: inline-flex; font-size: var(--text-xs); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #8fe9ff; }
.lp-hero h1 { font-size: clamp(38px, 5vw, 66px); line-height: 1.04; letter-spacing: var(--tracking-display); margin-top: var(--space-4); max-width: 15ch; }
.lp-hero h1 .grad, .lp-trust h2 .grad, .lp-cta h2 .grad { background: var(--brand-gradient-on-dark); -webkit-background-clip: text; background-clip: text; color: transparent; }
.lp-hero .lead, .lp-trust .lead, .lp-cta .lead { margin-top: var(--space-5); font-size: var(--text-md); color: var(--on-canopy-2); max-width: 54ch; line-height: 1.6; }
.lp-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-6); }
.lp-checks { list-style: none; padding: 0; margin: var(--space-6) 0 0; display: flex; flex-wrap: wrap; gap: 10px 22px; color: var(--on-canopy-2); font-size: var(--text-sm); font-weight: 600; }
.lp-checks li { display: inline-flex; align-items: center; gap: 8px; }
.lp-checks .icon { width: 18px; height: 18px; color: #67e8f9; }

/* Hero visual: the mark behind a report card with an x-ray scan beam */
.lp-xray { position: relative; min-height: 500px; display: grid; align-items: end; justify-items: start; }
.lp-xray__mark { position: absolute; width: min(380px, 78%); height: auto; top: -20px; right: -20px; opacity: .95; filter: drop-shadow(0 0 40px rgba(59, 160, 255, .45)); animation: lp-float 9s ease-in-out infinite alternate; }
.lp-xray__card { position: relative; width: min(430px, 92%); margin-top: 230px; border-radius: 22px; padding: 18px; background: rgba(10, 19, 48, .72); border: 1px solid rgba(143, 233, 255, .22); box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .8), inset 0 1px 0 rgba(255,255,255,.08); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); overflow: hidden; }
.lp-xray__head { display: flex; align-items: center; gap: 6px; font-size: var(--text-sm); margin-bottom: 10px; }
.lp-xray__head strong { margin-left: 8px; }
.lp-dot { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.22); }
.lp-xray__row { display: grid; grid-template-columns: minmax(96px, max-content) minmax(0, 1fr); gap: 10px; align-items: center; padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.07); margin-top: 8px; font-size: var(--text-sm); color: #e7ecff; }
.lp-xray__row .lp-pill { max-width: 132px; white-space: normal; text-align: center; }
.lp-xray__beam { position: absolute; left: 0; right: 0; top: -30%; height: 30%; background: linear-gradient(180deg, transparent, rgba(0, 217, 249, .16) 70%, rgba(143, 233, 255, .55) 98%, transparent); mix-blend-mode: screen; animation: lp-scan 5.5s cubic-bezier(.45, 0, .55, 1) infinite; pointer-events: none; }
@keyframes lp-scan { 0% { top: -30%; } 60%, 100% { top: 105%; } }
@keyframes lp-float { from { transform: translateY(0) rotate(0deg); } to { transform: translateY(-14px) rotate(-2deg); } }
@media (prefers-reduced-motion: reduce) { .lp-xray__beam { display: none; } .lp-xray__mark { animation: none; } }

/* Pills (severity / availability) */
.lp-pill { display: inline-flex; justify-content: center; align-items: center; border-radius: 999px; padding: 3px 10px; font-size: var(--text-2xs); font-weight: 700; letter-spacing: .02em; white-space: nowrap; border: 1px solid; }
.lp-pill--high { color: #fecaca; background: rgba(239, 68, 68, .14); border-color: rgba(239, 68, 68, .45); }
.lp-pill--med { color: #fde68a; background: rgba(245, 158, 11, .14); border-color: rgba(245, 158, 11, .45); }
.lp-pill--ok { color: #bbf7d0; background: rgba(34, 197, 94, .12); border-color: rgba(34, 197, 94, .4); }
.lp-pill--nd { color: #cbd5e1; background: rgba(148, 163, 184, .12); border-color: rgba(148, 163, 184, .45); border-style: dashed; }

/* Sections */
.lp-sec { padding: var(--space-9) 0; }
.lp-sec--tint { background: var(--bg); }
.lp-kicker { display: inline-block; font-size: var(--text-xs); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; background: linear-gradient(100deg, #0e7490 0%, #2563eb 50%, #6d28d9 100%); -webkit-background-clip: text; background-clip: text; color: transparent; margin-bottom: var(--space-3); }
.lp-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-6); margin-top: var(--space-5); color: var(--ink-2); font-size: var(--text-md); line-height: 1.6; }
.lp-strong { font-weight: 700; color: var(--ink); }
.lp-sub { margin-top: var(--space-4); color: var(--ink-2); font-size: var(--text-md); max-width: 70ch; line-height: 1.6; }
.lp-grid { display: grid; gap: var(--space-5); margin-top: var(--space-7); }
.lp-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lp-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.lp-card, .lp-feat, .lp-area { position: relative; border-radius: var(--radius-lg); padding: var(--space-6); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-1); transition: transform var(--dur-2) var(--ease-out), box-shadow var(--dur-2); }
.lp-card:hover, .lp-feat:hover, .lp-area:hover { transform: translateY(-3px); box-shadow: var(--shadow-2); }
.lp-card h3, .lp-feat h3, .lp-area h3 { margin-top: var(--space-4); }
.lp-card p, .lp-feat p, .lp-area p { margin-top: 8px; color: var(--muted); line-height: 1.55; }
.lp-ico { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, #94a3b8, #64748b); box-shadow: 0 12px 24px -14px rgba(15, 23, 42, .6); }
.lp-ico .icon { width: 24px; height: 24px; }
.lp-ico--cyan { background: linear-gradient(135deg, #22d3ee, #0891b2); }
.lp-ico--blue { background: linear-gradient(135deg, #3ba0ff, #2563eb); }
.lp-ico--indigo { background: linear-gradient(135deg, #7779f9, #4f46e5); }
.lp-ico--violet { background: linear-gradient(135deg, #bd73f9, #7c3aed); }
.lp-avail { position: absolute; top: var(--space-6); right: var(--space-6); font-size: var(--text-2xs); font-weight: 700; padding: 3px 10px; border-radius: 999px; color: var(--st-neutral-fg); background: var(--st-neutral-bg); border: 1px dashed var(--st-neutral-line); }
.lp-avail--now { color: var(--st-success-fg); background: var(--st-success-bg); border: 1px solid var(--st-success-line); }
.lp-area--soon { background: var(--surface-2); }
.lp-area--soon h3, .lp-area--soon p { color: var(--muted); }
.lp-note { display: flex; gap: 10px; align-items: flex-start; margin-top: var(--space-5); color: var(--muted); font-size: var(--text-sm); max-width: 80ch; }
.lp-note .icon { width: 18px; height: 18px; flex: none; margin-top: 2px; color: var(--accent); }

/* Report */
.lp-report { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-7); margin-top: var(--space-7); align-items: start; }
.lp-parts { list-style: none; counter-reset: p; padding: 0; margin: 0; display: grid; gap: var(--space-4); }
.lp-parts li { counter-increment: p; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 4px 14px; }
.lp-parts li::before { content: counter(p); grid-row: span 2; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-weight: 700; color: #fff; background: var(--btn-gradient); }
.lp-parts strong { font-size: var(--text-md); }
.lp-parts span { color: var(--muted); line-height: 1.55; }
.lp-finding { margin: 0; }
.lp-finding__cap { font-size: var(--text-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-bottom: var(--space-3); }
.lp-finding__card { border-radius: var(--radius-lg); padding: var(--space-6); background: linear-gradient(160deg, var(--canopy-1), var(--canopy-0)); color: #fff; box-shadow: var(--shadow-3); border: 1px solid rgba(143, 233, 255, .18); position: relative; overflow: hidden; }
.lp-finding__card::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--brand-gradient); }
.lp-finding__card h3 { font-size: var(--text-lg); margin-top: var(--space-4); }
.lp-finding__card dl { margin: var(--space-4) 0 0; display: grid; gap: 6px; }
.lp-finding__card dt { font-size: var(--text-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #8fe9ff; margin-top: var(--space-3); }
.lp-finding__card dd { margin: 0; color: var(--on-canopy-2); line-height: 1.55; }
.lp-finding__note { margin-top: var(--space-3); font-size: var(--text-xs); color: var(--muted); }

/* Steps */
.lp-steps { list-style: none; padding: 0; margin: var(--space-7) 0 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-5); position: relative; }
.lp-steps::before { content: ""; position: absolute; left: 24px; right: 24px; top: 23px; height: 2px; background: var(--brand-gradient); opacity: .35; }
.lp-steps li { position: relative; }
.lp-step__n { position: relative; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; font-weight: 800; color: #fff; background: var(--btn-gradient); box-shadow: 0 0 0 6px var(--surface), var(--shadow-glow); }
.lp-steps h3 { margin-top: var(--space-4); }
.lp-steps p { margin-top: 8px; color: var(--muted); line-height: 1.55; }

/* Trust */
.lp-trust { padding: var(--space-9) 0; overflow: hidden; }
.lp-trust > .wrap, .lp-cta > .wrap { position: relative; }
.lp-trust__grid, .lp-cta__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-7); align-items: center; }
.lp-trust h2, .lp-cta h2 { margin-top: var(--space-3); color: #fff; }
.lp-badges { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-3); }
.lp-badges li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 2px 14px; padding: var(--space-4) var(--space-5); border-radius: var(--radius-md); background: var(--glass); border: 1px solid var(--glass-line); }
.lp-badges .icon { grid-row: span 2; width: 26px; height: 26px; color: #8fe9ff; margin-top: 4px; }
.lp-badges span { color: var(--on-canopy-2); font-size: var(--text-sm); }

/* FAQ */
.lp-faq { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: var(--space-7); align-items: start; }
.lp-faq__list details { border-bottom: 1px solid var(--line); }
.lp-faq__list summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: var(--space-4); padding: var(--space-5) 0; font-weight: 700; font-size: var(--text-md); }
.lp-faq__list summary::-webkit-details-marker { display: none; }
.lp-faq__list summary::after { content: "+"; flex: none; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); font-weight: 700; transition: transform var(--dur-2) var(--ease-out); }
.lp-faq__list details[open] summary::after { transform: rotate(45deg); }
.lp-faq__list p { padding: 0 0 var(--space-5); color: var(--ink-2); line-height: 1.6; max-width: 66ch; }

/* Final CTA */
.lp-cta { padding: var(--space-9) 0; overflow: hidden; }
.lp-form { color: var(--ink); padding: var(--space-6); }
.lp-form .field + .field { margin-top: var(--space-4); }
.lp-form .btn { margin-top: var(--space-5); }
.lp-form .hint a { color: var(--accent); }
.lp-form .opt { font-weight: 400; color: var(--muted); }
.lp-form textarea.input { min-height: 96px; resize: vertical; }
.lp-form .notice { margin-top: var(--space-4); }

/* Footer */
.lp-foot { background: var(--canopy-0); color: var(--on-canopy-2); padding: var(--space-8) 0 var(--space-7); }
.lp-foot__grid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-5) var(--space-7); }
.lp-foot .brand { color: #fff; }
.lp-foot p { margin-top: var(--space-3); font-size: var(--text-sm); }
.lp-foot__nav { display: flex; flex-wrap: wrap; gap: 8px 22px; align-content: start; justify-content: flex-end; }
.lp-foot__nav a { color: var(--on-canopy-2); text-decoration: none; font-size: var(--text-sm); }
.lp-foot__nav a:hover { color: #fff; }
.lp-foot__legal { grid-column: 1 / -1; border-top: 1px solid var(--glass-line); padding-top: var(--space-5); font-size: var(--text-xs) !important; color: var(--on-canopy-3); line-height: 1.7; }

/* Reveal */
.lp-reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s var(--ease-out), transform .7s var(--ease-out); }
.lp-reveal.is-in { opacity: 1; transform: none; }

/* Responsive */
@media (max-width: 1279px) {
  .lp-nav { display: none; }
}
@media (max-width: 1099px) {
  .lp-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lp-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--space-7); }
  .lp-steps::before { display: none; }
}
@media (max-width: 959px) {
  .lp-hero__grid, .lp-trust__grid, .lp-cta__grid, .lp-report, .lp-faq, .lp-intro { grid-template-columns: minmax(0, 1fr); }
  .lp-xray { min-height: 0; margin-top: var(--space-5); }
  .lp-xray__mark { width: 190px; top: -30px; right: 0; }
  .lp-xray__card { margin: 120px 0 0; width: 100%; }
  .lp-grid--3 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
  .lp-head__row { gap: var(--space-3); }
  .lp-head .brand__word { display: none; }
  .lp-head__tools { flex: 1; min-width: 0; }
  .lp-language { max-width: 104px; }
  .lp-signin { display: none; }
  .lp-head .btn--primary { flex: 1; min-width: 0; min-height: 44px; padding: 8px 10px; font-size: var(--text-sm); white-space: normal; text-align: center; }
  .lp-actions .btn, .lp-form .btn { white-space: normal; text-align: center; max-width: 100%; }
  .lp-sec, .lp-trust, .lp-cta { padding: var(--space-8) 0; }
  .lp-hero { padding: var(--space-6) 0 var(--space-8); }
  .lp-grid--4, .lp-steps { grid-template-columns: minmax(0, 1fr); }
  .lp-avail { position: static; display: inline-block; margin-left: 10px; vertical-align: middle; }
  .lp-area .lp-ico { display: inline-grid; vertical-align: middle; }
  .lp-foot__grid { grid-template-columns: minmax(0, 1fr); }
  .lp-foot__nav { justify-content: flex-start; }
  .lp-xray__row { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .lp-xray__row .lp-pill { justify-self: start; }
}

/* Secondary pages */
.lp-legal h1 { font-size: clamp(30px, 3.6vw, 44px); line-height: 1.1; letter-spacing: var(--tracking-display); max-width: 24ch; }
.lp-legal h2 { font-size: var(--text-lg); margin-top: var(--space-6); max-width: none; }
.lp-legal p, .lp-legal li { color: var(--ink-2); line-height: 1.65; max-width: 72ch; }
.lp-legal p { margin-top: var(--space-3); }
.lp-legal ul { margin-top: var(--space-3); display: grid; gap: var(--space-3); list-style: disc; padding-left: 1.2em; }
.lp-legal hr { border: 0; border-top: 1px solid var(--line); margin: var(--space-7) 0 0; }
.lp-404 { min-height: 100vh; display: grid; align-items: center; }
.lp-404 .brand { margin-bottom: var(--space-7); }
.lp-404 .brand__word { height: 22px; }
.lp-404 h1 { font-size: clamp(34px, 4.6vw, 56px); line-height: 1.08; letter-spacing: var(--tracking-display); }