/* Experience R4: panoramic editorial media and calmer product screens. */

#solutions .feature-page { max-width: 1328px; }
#solutions .feature-intro { gap: clamp(32px, 5vw, 68px); }
#solutions .feature-intro-visual {
  width: 100%; max-width: none; min-height: 0; aspect-ratio: 3 / 1;
  justify-self: stretch; border: 0; border-radius: 30px;
  background: var(--panel-subtle); box-shadow: 0 24px 64px rgba(30, 68, 128, .12);
}
#solutions .feature-intro-visual .editorial-image,
#payment .plans-intro-visual .editorial-image { object-fit: contain; object-position: center; }
#solutions .feature-intro-note { left: clamp(14px, 2.2vw, 30px); bottom: clamp(14px, 2.2vw, 30px); }
#payment .plans-intro { grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr); align-items: center; }
#payment .plans-intro-visual { min-height: 0; aspect-ratio: 3 / 1; border-radius: 24px; }

/* Reduce stacked outlines: hierarchy now comes from spacing, type and surface tone. */
#record .recording-console,
#account .account-panel,
#activate .activate-wrap,
#import .import-wrap { border: 0; background: var(--landing-surface); box-shadow: 0 20px 60px rgba(31, 65, 118, .09); }
#record .recording-console { border-radius: 24px; }
#record .source-options.visually-hidden[aria-hidden="true"] { display: none !important; }
#history .history-screen { border: 0; background: transparent; box-shadow: none; }
#history .history-controls input,
#history .history-controls select { border-color: transparent; background: var(--panel-subtle); }
#history .background-panel,
#history .history-import-link { border: 0; border-radius: 16px; background: var(--panel-subtle); }
#account .account-panel { border-radius: 22px; }
#account .account-secondary,
#account .account-device { box-shadow: none; background: var(--panel-subtle); }
#account .account-route + .account-route { border-top-color: var(--line); }
#activate .activate-wrap,
#import .import-wrap { border-radius: 28px; }
html[data-theme="dark"] #solutions .feature-intro-visual,
html[data-theme="dark"] #record .recording-console,
html[data-theme="dark"] #account .account-panel,
html[data-theme="dark"] #activate .activate-wrap,
html[data-theme="dark"] #import .import-wrap { box-shadow: 0 24px 70px rgba(0, 0, 0, .28); }

@media (max-width: 980px) {
  #payment .plans-intro { grid-template-columns: 1fr; }
  #payment .plans-intro-copy { order: -1; }
}
@media (max-width: 700px) {
  #solutions .feature-intro { gap: 26px; }
  #solutions .feature-intro-visual,
  #payment .plans-intro-visual { width: 100%; aspect-ratio: 3 / 1; border-radius: 20px; }
  #solutions .feature-intro-note { display: none; }
  #payment .plans-intro { gap: 6px; }
  #record .recording-console,
  #history .history-screen,
  #account .account-panel,
  #activate .activate-wrap,
  #import .import-wrap { box-shadow: none; }
}