/* Landing-page refinements; the shared brand system remains unchanged. */
.landing { --ink-faint: #a0a6b0; --ink-ghost: #a0a6b0; }
.landing [hidden] { display: none !important; }
.landing :is(a, button, select, summary):focus-visible { outline: 2px solid var(--app-blue); outline-offset: 5px; }
.landing :is(section, details, article, h2)[id] { scroll-margin-top: 96px; }
.landing .skip-link { position: fixed; top: 12px; left: 20px; z-index: 200; padding: 12px 20px; background: var(--ink); color: var(--bg); transform: translateY(-150%); }
.landing .skip-link:focus { transform: none; }
.landing .logo-badge { font-size: 12px; letter-spacing: .04em; }
.landing .menu-button { display: none; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 10px; border: 1px solid var(--line-strong); border-radius: 12px; background: var(--surface); color: var(--ink); cursor: pointer; }
.landing .menu-button svg { width: 24px; height: 24px; }
.landing .menu-button .menu-close, .landing .menu-button[aria-expanded="true"] .menu-open { display: none; }
.landing .menu-button[aria-expanded="true"] .menu-close { display: block; }
.landing .v2-hero { min-height: min(780px, calc(100svh - 70px)); }
.landing .v2-hero .hero-content { justify-content: center; padding: 100px 0 70px; }
.landing .v2-hero h1 { font-size: clamp(44px, 6.6vw, 84px); max-width: 15ch; }
.landing .hero-sub { max-width: 46ch; color: #d0d3da; }
.landing .hero-meta { flex-basis: 100%; margin: 2px 0 0; font-family: var(--font-body); font-size: 15px; color: #c0c6d0; }
.landing .hero-fade { background: linear-gradient(90deg, rgba(10,11,13,.94), rgba(10,11,13,.65) 48%, rgba(10,11,13,.08)), linear-gradient(0deg, var(--bg), transparent 30%); }
.landing .hero-hint { font-size: 13px; letter-spacing: 0; }
.landing .hero-readout small { display: block; font-size: 12px; color: var(--ink-dim); margin-bottom: 4px; }
.landing .v2-matrix-playground { padding: 88px 0; }
.landing .v2-matrix-grid { grid-template-columns: 1fr 1.1fr; gap: 28px 64px; align-items: start; }
.landing .v2-matrix-copy h2 { max-width: 14ch; margin: 0; }
.landing .v2-matrix-copy .lead { max-width: 40ch; font-size: 18px; }
.landing .workflow { margin: 32px 0 0; padding: 0; list-style: none; counter-reset: steps; }
.landing .workflow li { counter-increment: steps; display: grid; grid-template-columns: 28px 1fr; gap: 14px; margin-top: 20px; color: var(--ink-dim); font-size: 16px; }
.landing .workflow li::before { content: counter(steps); font-family: var(--font-mono); color: var(--app-blue); }
.landing .workflow strong { display: block; color: var(--ink); font-size: 18px; }
.landing .demo-panel { grid-column: 2; grid-row: 1 / span 2; min-width: 0; scroll-margin-top: 96px; text-align: center; }
.landing .demo-panel:focus { outline: none; }
.landing .demo-feedback { grid-column: 1; grid-row: 2; min-width: 0; align-self: start; }
.landing :is(.demo-panel, .demo-feedback) h3 { font-size: clamp(23px, 2.5vw, 30px); line-height: 1.15; }
.landing .demo-note { font-size: 14px; color: var(--ink-dim); margin: 10px auto 22px; max-width: 38ch; }
.landing .demo-cell { padding: 0; background: transparent; border: 1px solid transparent; border-radius: 7px; appearance: none; }
.landing .demo-cell[aria-pressed="true"] { border-color: var(--app-blue); background: rgba(150,212,243,.08); }
.landing .demo-cell:hover { border-color: var(--ink-dim); }
.landing .demo-cell:focus-visible { outline-offset: -3px; }
.landing .matrix-image-wrapper { container-type: inline-size; }
.landing :is(.demo-screen-analysis, .demo-screen-unlock) { position: absolute; z-index: 2; background: #212121; color: #858585; line-height: 1.2; pointer-events: none; }
.landing .demo-screen-analysis { top: 12.1%; left: 36%; width: 28%; font: 3.6cqw/1.2 Arial, sans-serif; text-align: center; }
.landing .demo-screen-unlock { top: 83.2%; left: 9%; width: 70%; height: 2.8%; display: flex; align-items: center; font: 3.2cqw/1.2 Arial, sans-serif; text-align: left; }
.landing .demo-status { margin-top: 18px; font-size: 16px; font-weight: 600; min-height: 26px; }
.landing .demo-reset { padding: 10px 12px; min-height: 44px; border: 1px solid var(--line-strong); border-radius: 8px; background: transparent; color: var(--ink); font: inherit; font-size: 14px; cursor: pointer; }
.landing .demo-result { margin-top: 12px; font-size: 17px; color: var(--app-blue); }
.landing .demo-help { margin-top: 12px; font-size: 14px; color: var(--ink-dim); }
.landing .demo-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; list-style: none; padding: 0; margin: 14px 0 0; font-size: 13px; color: var(--ink-dim); }
.landing .benefits-section, .landing .pricing-section, .landing .details-section { max-width: 1240px; margin: 0 auto; padding: 88px 32px; }
.landing .benefits-section > h2, .landing .pricing-section > h2, .landing .details-section > h2 { max-width: 20ch; margin-bottom: 40px; }
.landing .benefits-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: center; }
.landing .product-preview { margin: 0; text-align: center; }
.landing figcaption { margin-top: 18px; font-size: 14px; color: var(--ink-dim); }
.landing .benefit { padding: 26px 0; border-bottom: 1px solid var(--line-strong); }
.landing .benefit:first-child { padding-top: 0; }
.landing .benefit h3 { font-size: 28px; margin-bottom: 12px; }
.landing .benefit p { color: var(--ink-dim); max-width: 52ch; }
.landing .benefit small { display: block; color: var(--app-blue); margin-top: 10px; font-size: 14px; }
.landing #pro.pricing-section { border-top: 1px solid var(--line); text-align: left; }
.landing .pricing-intro { color: var(--ink-dim); margin: -18px 0 32px; max-width: 64ch; }
.landing .plan-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 24px; }
.landing .plan { padding: 30px; border: 1px solid var(--line-strong); border-radius: 16px; background: var(--surface); min-width: 0; }
.landing .plan h3 { font-size: 26px; margin-bottom: 20px; }
.landing .plan-pro { border-color: rgba(150,212,243,.5); }
.landing .plan-price { font-family: var(--font-display); font-size: 38px; font-weight: 800; line-height: 1.2; }
.landing .plan-price small { font: 400 16px var(--font-body); color: var(--ink-dim); }
.landing .plan p { font-size: 16px; color: var(--ink-dim); margin-top: 12px; }
.landing .plan ul { padding-left: 20px; margin: 24px 0 0; color: var(--ink-dim); font-size: 16px; }
.landing .plan li { margin: 9px 0; padding-left: 4px; }
.landing .plan li::marker { color: var(--app-blue); }
.landing .purchase-options { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.landing .purchase-options dt { color: var(--ink-dim); font-size: 15px; margin-bottom: 6px; }
.landing .purchase-options dd { margin: 0; }
.landing .purchase-options .plan-price { font-size: 32px; }
.landing .purchase-options .plan-price small { display: block; margin-top: 4px; }
.landing .plan .price-note { font-size: 14px; }
.landing .purchase-terms { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--line-strong); color: var(--ink-dim); font-size: 15px; }
.landing .purchase-terms summary { color: var(--ink); min-height: 44px; padding: 10px 0; cursor: pointer; }
.landing .purchase-terms p { line-height: 1.7; max-width: 75ch; font-size: 15px; }
.landing .purchase-summary { max-width: 75ch; margin-bottom: 8px; }
.landing .pricing-store-actions { justify-content: flex-start; margin-top: 28px; }
.landing .details-section { padding-top: 32px; }
.landing .feature-detail { border-top: 1px solid var(--line-strong); padding: 8px 0; }
.landing .feature-detail > summary { padding: 20px 0; cursor: pointer; font-family: var(--font-display); font-size: 22px; font-weight: 600; }
.landing .feature-detail > summary::marker { color: var(--app-blue); }
.landing .detail-content { padding: 4px 0 24px; max-width: 70ch; color: var(--ink-dim); }
.landing .detail-content p { margin-bottom: 16px; }
.landing .detail-content a { text-decoration: underline; text-underline-offset: 4px; color: var(--ink); display: inline-block; padding: 8px 0; }
.landing .detail-content iframe { display: block; width: min(100%, 390px); height: 600px; border: 1px solid var(--line-strong); border-radius: 16px; margin-top: 20px; }
.landing .detail-content img { max-height: 420px; width: auto; border-radius: 20px; margin: 20px 0; }
.landing .detail-content.detail-showcase { max-width: none; padding: 32px 0 64px; }
.landing .detail-showcase .device-screen img { width: 100%; height: 100%; max-height: none; margin: 0; border-radius: 0; }
.landing .detail-showcase .threed-demo-frame { width: 100%; height: auto; margin: 0; border: 0; border-radius: var(--mockup-screen-radius); }
.landing .detail-showcase .detail-link { margin: 24px 0 0; }
.landing .detail-showcase :is(h2, strong, .feat-title, .scene-chip) { color: var(--ink); }
.landing .detail-showcase .all-lenses-block { max-width: 1036px; margin-inline: auto; }
.landing .lightroom-section { max-width: 1240px; margin: 0 auto; padding: 88px 32px; border-top: 1px solid var(--line); }
.landing .lightroom-section > h2 { max-width: 20ch; margin-bottom: 40px; }
.landing .lightroom-layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 56px; align-items: start; }
.landing .lightroom-kicker { margin: 0 0 14px; font-family: var(--font-mono); font-size: 14px; color: var(--app-blue); }
.landing .lightroom-copy .lead { max-width: 44ch; margin: 0; font-size: 18px; color: var(--ink-dim); }
.landing .lightroom-copy > small { display: block; margin-top: 28px; font-size: 14px; color: var(--app-blue); }
.landing .lightroom-video { margin: 0; }
.landing .lightroom-video video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 1px solid var(--line-strong); border-radius: 16px; background: #0a0a0a; }
.landing .lightroom-video .lightroom-video-tall { display: none; aspect-ratio: 9 / 16; }
.landing .foot-col h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; letter-spacing: 0; color: var(--ink); margin-bottom: 14px; }
.landing .foot-col a { min-height: 36px; }
.landing .foot-brand p, .landing .foot-bottom { font-size: 14px; }
@media (max-width: 900px) {
  .landing.menu-ready .menu-button { display: inline-flex; }
  .landing .nav-links { display: flex; }
  .landing.menu-ready .nav-links { display: none; max-height: calc(100dvh - 70px); overflow-y: auto; }
  .landing.menu-ready .nav-links.is-open { display: flex; }
  .landing:not(.menu-ready) .nav { height: auto; flex-wrap: wrap; padding-top: 16px; }
  .landing:not(.menu-ready) .nav-links { position: static; width: 100%; }
  .landing .nav-links a { min-height: 44px; }
  .landing .v2-matrix-grid { grid-template-columns: 1fr; gap: 36px; }
  .landing .v2-matrix-copy h2 { max-width: 20ch; }
  .landing .demo-panel, .landing .demo-feedback { grid-column: 1; grid-row: auto; width: 100%; max-width: 560px; margin-inline: auto; }
  .landing .benefits-layout { gap: 40px; }
  .landing .lightroom-layout { grid-template-columns: 1fr; gap: 36px; }
}
@media (max-width: 600px) {
  .landing .v2-hero { min-height: auto; }
  .landing .v2-hero .hero-content { padding: 62px 0 30px; }
  .landing .v2-hero h1 { font-size: clamp(38px, 10vw, 56px); }
  .landing .hero-sub { font-size: 18px; margin-top: 22px; }
  .landing .hero-cta { gap: 12px; margin-top: 26px; }
  .landing .hero-cta .btn { font-size: 15px; padding: 13px 18px; }
  .landing .hero-meta { font-size: 14px; margin-top: 4px; }
  .landing .hero-hint { padding: 10px 20px 24px; text-align: left; font-size: 12px; }
  .landing .hero-fade { background: linear-gradient(90deg, rgba(10,11,13,.88), rgba(10,11,13,.62)), linear-gradient(0deg, var(--bg), transparent); }
  .landing #terrain { pointer-events: none; touch-action: auto; }
  .landing .v2-matrix-playground { padding: 60px 0; }
  .landing .benefits-section, .landing .pricing-section, .landing .details-section, .landing .lightroom-section { padding: 60px 20px; }
  .landing .lightroom-video .lightroom-video-wide { display: none; }
  .landing .lightroom-video .lightroom-video-tall { display: block; width: min(100%, calc(85svh * 9 / 16)); margin-inline: auto; }
  .landing .benefits-layout { display: flex; flex-direction: column-reverse; gap: 32px; }
  .landing .plan-grid { grid-template-columns: 1fr; }
  .landing .plan { padding: 24px; }
  .landing .purchase-options { gap: 16px; }
  .landing .purchase-options .plan-price { font-size: 27px; }
  .landing .pricing-store-actions .btn { white-space: normal; text-align: center; }
  .landing .details-section { padding-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .landing *, .landing *::before, .landing *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
