/* Shared layout rhythm; functional component styles remain in landing.css. */
:root {
  --content-width: 1200px;
  --page-gutter: 32px;
  --section-space: 80px;
  --layout-gap: 24px;
  --column-gap: 64px;
}
.se-wrap { width: min(var(--content-width), calc(100% - 2 * var(--page-gutter))); }
.se-section { padding-block: var(--section-space); scroll-margin-top: 0; }
.se-heading { max-width: 760px; margin: 0 0 32px; }
.se-heading h2 { font-size: 38px; line-height: 1.22; margin-bottom: 20px; }
.se-heading > p { max-width: 680px; font-size: 17px; line-height: 1.75; }
.se-eyebrow { margin-bottom: 16px; }
.se-split, .se-demo, .se-panel { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--column-gap); }
.se-split { align-items: start; }
.se-split > *, .se-panel > *, .se-demo > * { min-width: 0; }
.se-split > .se-heading { margin: 0; }
.se-feature-grid, .se-plan-grid, .se-exam-grid, .se-article-grid { gap: var(--layout-gap); }
.se-feature, .se-exam-grid article, .se-plan { padding: 24px; }
.se-feature { padding-bottom: 56px; }
.se-plan-highlight { padding: 23px; }
.se-feature h3, .se-exam-grid h3 { font-size: 19px; }
.se-plan-top { min-height: 54px; align-items: center; }
.se-plan > p { min-height: 44px; }
.se-plan-price { min-height: 112px; }
.se-plan-price > strong { font-size: 28px; }
.se-plan-price strong small { font-size: 12px; }
.se-plan .se-button { min-height: 52px; }
.se-exam-grid article { padding-bottom: 52px; min-height: 184px; }
.se-intro-row, .se-exam-footer, .se-free-plan { gap: var(--column-gap); }
.se-intro-row > p, .se-exam-footer > div { max-width: 760px; }
.se-problems, .se-steps { gap: var(--layout-gap); }
.se-problems { margin-bottom: 40px; }
.se-trust > .se-wrap { gap: var(--layout-gap); padding-block: 22px; }
.se-trust span { justify-content: flex-start; }
.se-nav { gap: var(--layout-gap); }
.se-nav-actions { flex-shrink: 0; }

/* A full-width teaching scene with copy in its deliberately empty area. */
.se-hero { height: min(680px, calc(100svh - 154px)); min-height: 570px; max-height: none; padding: 0; background: #fafaf9; }
.se-hero-visual { position: absolute; inset: 0; overflow: hidden; z-index: -1; }
.se-hero-image { position: absolute; inset: auto; top: 0; left: 50%; transform: translateX(-50%); width: min(1600px, 100%); max-width: none; height: 100%; object-fit: cover; object-position: center top; z-index: auto; background: transparent; }
.se-hero-inner { height: 100%; position: relative; display: flex; align-items: center; }
.se-hero-copy { position: static; width: 420px; max-width: 42%; padding: 32px 0; background: none; border: 0; min-height: 0; }
.se-hero-copy .se-eyebrow { font-size: 12px; margin-bottom: 20px; }
.se-hero-copy h1 { font-size: 50px; line-height: 1.1; margin-bottom: 24px; }
.se-hero-copy p { max-width: 365px; font-size: 16px; line-height: 1.7; }
.se-hero-actions { display: grid; justify-items: start; margin-top: 28px; gap: 14px; min-width: 0; }
.se-hero-actions > div { display: flex; gap: 24px; font-size: 14px; margin: 0; }
.se-hero-actions > .se-small { display: block; text-align: left; font-size: 12px; }
.se-hero-actions > .se-button { min-height: 50px; padding: 12px 22px; font-size: 15px; }
.se-hero-demo { top: auto; bottom: 24px; right: 0; box-shadow: none; font-size: 13px; border: 1px solid var(--line); padding: 10px 14px; }

.se-board img { aspect-ratio: 1672 / 941; object-fit: contain; border: 0; border-radius: 0; }
.se-board figcaption { padding: 16px 0; align-items: center; }
.se-board figcaption small { font-size: 11px; opacity: .85; margin-left: 8px; }
.se-teacher-benefits { gap: var(--layout-gap); padding: 32px 0; }
.se-demo { padding-top: 40px; }
.se-demo h3 { font-size: 28px; }
.se-demo > form { padding-top: 0; }
.se-analysis { padding-top: 24px; }
.se-dna-visual, .se-notebook { order: 0; }
.se-dna-visual, .se-learning-map { padding: 28px; }
.se-notebook { padding: 28px 0; }
.se-panel { align-items: center; padding-top: 40px; min-height: 540px; }
.se-panel > .se-phone, .se-panel > .se-panel-illustration { grid-column: 2; grid-row: 1; }
.se-panel > div:last-child { grid-column: 1; grid-row: 1; }
.se-panel h3 { font-size: 32px; }
.se-phone { width: 238px; }
.se-panel-illustration { padding: 32px; min-height: 360px; }
.se-pricing-toolbar { margin-bottom: 24px; }
.se-discount { padding: 28px; gap: 24px; }
.se-quantum { padding: 32px; gap: 48px; }
.se-institution-list li:first-child { padding-top: 0; }
.se-article-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.se-article { padding: 24px 0 0; }
.se-article h3 { font-size: 23px; }
.se-faqs { max-width: none; }
.se-faqs details > p { max-width: 900px; }
.se-contact-form label:first-child { margin-top: 0; }
.se-final { padding-block: var(--section-space); text-align: left; }
.se-final > .se-wrap { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--column-gap); align-items: center; }
.se-final .se-eyebrow, .se-final h2, .se-final p { grid-column: 1; }
.se-final h2 { font-size: 38px; margin-bottom: 20px; }
.se-final p { margin: 0; }
.se-final .se-button { grid-column: 2; grid-row: 2; }
.se-final .se-small { grid-column: 2; grid-row: 3; margin-top: 0; }
.se-footer { padding-top: 56px; }
.se-footer-grid { grid-template-columns: 1.3fr 1fr 1fr 1.2fr; gap: var(--layout-gap); }
.se-article-page { max-width: var(--content-width); }
.se-article-page > h1, .se-article-page > p, .se-article-page > section, .se-article-cta { max-width: 800px; }

@media (max-width: 1150px) {
  :root { --page-gutter: 24px; --column-gap: 40px; --section-space: 64px; }
  .se-hero-copy { max-width: 40%; }
  .se-hero-copy h1 { font-size: 44px; }
  .se-hero-copy p { font-size: 15px; }
  .se-hero-copy .se-eyebrow { font-size: 11px; }
  .se-plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .se-plan-price > strong { font-size: 32px; }
  .se-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .se-heading h2, .se-final h2 { font-size: 34px; }
  .se-nav { gap: 16px; }
  .se-desktop-nav { gap: 12px; }
  .se-final > .se-wrap { grid-template-columns: minmax(0, 1fr) 250px; }
}
@media (max-width: 900px) {
  .se-hero { height: auto; min-height: 0; display: flex; flex-direction: column; }
  .se-hero-visual { position: relative; inset: auto; aspect-ratio: 1.5; max-height: 390px; z-index: 0; order: 0; }
  .se-hero-image { left: auto; right: 0; top: 0; width: 160%; height: auto; transform: none; object-fit: contain; }
  .se-hero-inner { display: block; height: auto; padding-block: 32px; }
  .se-hero-copy { width: 100%; max-width: 600px; padding: 0; }
  .se-hero-copy h1 { font-size: 38px; line-height: 1.15; }
  .se-hero-copy p { max-width: 540px; }
  .se-hero-actions { margin-top: 24px; }
  .se-hero-demo { position: static; display: inline-flex; margin-top: 20px; }
  .se-split, .se-demo, .se-panel { gap: 32px; }
  .se-heading h2 { font-size: 30px; }
  .se-heading > p { font-size: 16px; }
  .se-article-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .se-exam-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .se-final > .se-wrap { display: block; }
  .se-final p { margin-bottom: 24px; }
  .se-final .se-small { margin-top: 12px; }
  .se-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
  :root { --page-gutter: 20px; --section-space: 48px; --layout-gap: 16px; --column-gap: 28px; }
  .se-hero-visual { aspect-ratio: 1.65; max-height: none; }
  .se-hero-image { width: 177%; }
  .se-hero-inner { padding-block: 24px; }
  .se-hero-copy .se-eyebrow { font-size: 10px; margin-bottom: 14px; }
  .se-hero-copy h1 { font-size: 32px; line-height: 1.16; margin-bottom: 16px; }
  .se-hero-copy p { font-size: 14px; line-height: 1.65; }
  .se-hero-actions { gap: 8px; margin-top: 20px; width: 100%; }
  .se-hero-actions > .se-button { width: 100%; }
  .se-hero-actions > div { justify-content: flex-start; font-size: 13px; gap: 24px; }
  .se-hero-actions > .se-small { font-size: 11px; }
  .se-hero-demo { display: none; }
  .se-heading { margin-bottom: 28px; }
  .se-heading h2, .se-final h2 { font-size: 28px; line-height: 1.23; margin-bottom: 16px; }
  .se-heading > p { font-size: 15px; }
  .se-split, .se-demo, .se-panel { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .se-feature { padding: 20px 16px 48px; }
  .se-feature h3 { font-size: 16px; }
  .se-feature-icon { margin-bottom: 20px; }
  .se-feature p { font-size: 13px; }
  .se-exam-grid article { padding: 20px 16px 48px; min-height: 176px; }
  .se-exam-grid h3 { font-size: 17px; }
  .se-steps { padding-top: 28px; }
  .se-board figcaption { align-items: start; font-size: 11px; gap: 16px; }
  .se-board figcaption > span { display: block; }
  .se-board figcaption small { display: block; margin: 6px 0 0; font-size: 10px; }
  .se-teacher-benefits { padding: 24px 0; }
  .se-demo { padding-top: 28px; }
  .se-demo h3 { font-size: 25px; }
  .se-dna-visual, .se-learning-map { padding: 24px; }
  .se-panel { min-height: 0; padding-top: 28px; }
  .se-panel > div:last-child { grid-column: 1; grid-row: 1; }
  .se-panel > .se-phone, .se-panel > .se-panel-illustration { grid-column: 1; grid-row: 2; }
  .se-panel h3 { font-size: 27px; }
  .se-panel-illustration { padding: 24px; min-height: 280px; }
  .se-phone { width: 220px; }
  .se-plan-grid { grid-template-columns: minmax(0, 1fr); }
  .se-plan { padding: 24px; }
  .se-plan-highlight { padding: 23px; }
  .se-plan-top { min-height: 32px; }
  .se-plan > p { min-height: 0; }
  .se-plan-price { min-height: 0; }
  .se-plan-price > strong { font-size: 34px; }
  .se-pricing-toolbar, .se-free-plan { gap: 16px; }
  .se-discount, .se-quantum { padding: 24px; gap: 20px; }
  .se-discount > div { flex-basis: 100%; }
  .se-discount > a { margin-left: 0; }
  .se-discount > i { display: none; }
  .se-article-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .se-final .se-button { width: 100%; }
  .se-final .se-small { font-size: 12px; }
  .se-article-page { padding-block: 40px; }
  .se-article-page h1 { font-size: 30px; }
}
@media (max-width: 359px) {
  :root { --page-gutter: 16px; --layout-gap: 12px; }
  .se-hero-copy h1 { font-size: 30px; }
  .se-feature { padding-inline: 14px; }
  .se-feature h3 { font-size: 15px; }
  .se-tabs button { padding-inline: 16px; }
}
