/* The author, the overview and the collection share a single editorial system. */
#start, #mary { scroll-margin-top: 22px; }
.hero-description { max-width: var(--measure-card); }

.author-note {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  align-items: baseline;
  column-gap: var(--space-8);
  border-bottom: 1px solid var(--line);
}
.author-experience strong { display: block; color: var(--ink); font-variant-numeric: lining-nums; text-wrap: balance; }
.author-principle > p { max-width: var(--measure); }
.needs-intro { align-items: end; gap: 28px; }
.needs-intro .eyebrow { color: var(--muted); }
.needs-intro .text-link { flex-shrink: 0; }
.need-grid > a { min-height: 132px; padding: 23px 16px; gap: 12px; }
.need-grid small { display: block; margin-top: 10px; color: var(--muted); }
.need-grid b { top: 13px; right: 12px; }

.collection-toolbar {
  position: sticky;
  top: 10px;
  z-index: 8;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 32px;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 100px;
  background: var(--paper);
  box-shadow: var(--shadow-collection);
}
.collection-nav { display: flex; flex: 1; gap: 4px; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.collection-nav::-webkit-scrollbar { display: none; }
.collection-nav a {
  display: flex;
  flex: 1 0 auto;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 44px;
  padding: 10px 14px;
  border-radius: 100px;

  white-space: nowrap;
}

.collection-nav a:hover { background: var(--cream); }
.collection-nav [data-chapter=voiceprint][aria-current] { background: var(--world-listening); }
.collection-nav [data-chapter=pronunciation][aria-current] { background: var(--world-pronunciation); }
.collection-nav [data-chapter=speaking][aria-current] { background: var(--world-speaking); }
.collection-nav [data-chapter=steps][aria-current] { background: var(--world-steps); }
.collection-nav [data-chapter=skarb][aria-current] { background: var(--world-skarb); }
.collection-nav a:focus-visible { outline-offset: -4px; }

.author { gap: 80px; }
.author-photo img { height: 530px; }
.author-copy > .author-work { color: var(--ink); }
.author-links { display: flex; flex-wrap: wrap; gap: 4px 24px; }
.footer-contacts { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 24px; padding: 16px 0; border-top: 1px solid var(--line); }
.footer-contacts a { display: flex; align-items: center; gap: 16px; min-height: 44px; }
.footer-contacts a:hover { color: var(--blue-ink); }

/* Keep each direction's identity through the finder. */
.ewm-finder__recommendation { --finder-product-ground: var(--world-listening); }
.ewm-finder__recommendation[data-finder-recommendation=pronunciation] { --finder-product-ground: var(--world-pronunciation); }
.ewm-finder__recommendation[data-finder-recommendation=speaking] { --finder-product-ground: var(--world-speaking); }
.ewm-finder__recommendation[data-finder-recommendation=steps] { --finder-product-ground: var(--world-steps); }
.ewm-finder__recommendation[data-finder-recommendation=skarb] { --finder-product-ground: var(--world-skarb); }
.ewm-finder__primary { border-radius: 100px; padding-inline: 22px; }
.ewm-finder__overview { display: flex; justify-content: space-between; align-items: center; gap: 20px; width: 100%; min-height: 52px; padding: 13px 17px; margin-top: 24px; border: 1px solid var(--finder-overview-line); border-radius: 8px; background: var(--blue-wash); color: var(--finder-overview-ink); text-align: left; font-size: var(--fs-ui); font-weight: 650; line-height: 1.6; }
.ewm-finder__overview + .ewm-finder__choices { margin-top: 18px; }

@media (max-width: 1100px) {
  .need-grid > a { padding-inline: 12px; gap: 10px; }
  .collection-nav a { padding-inline: 12px; }
  .author { gap: 48px; }
  .author-photo img { height: 480px; }
}

@media (max-width: 800px) {
  .hero .eyebrow { align-items: start; }
  .needs-intro { align-items: start; }
  .need-grid > a { min-height: 125px; }
  .collection-toolbar { gap: 5px; }
  .collection-nav a { justify-content: flex-start; }
  .collection-nav a span { display: none; }

  .author { gap: 32px; }
  .author-photo img { height: 420px; }
}

@media (max-width: 600px) {
  .hero .eyebrow .sun-mini { width: 18px; height: 18px; margin-top: 2px; }
  .author-note { grid-template-columns: minmax(0, 1fr); row-gap: var(--space-3); }
  .needs-intro { display: block; }
  .needs-intro .text-link { max-width: none; }
  .need-grid > a { grid-template-columns: minmax(0,1fr); align-items: start; gap: 10px; padding: 18px 14px; min-height: 156px; }
  .need-grid > a:last-child { grid-template-columns: 34px minmax(0,1fr); align-items: center; min-height: 105px; gap: 16px; }
  .need-grid small { margin-top: 8px; }
  .collection-toolbar { top: 6px; margin-inline: -8px; margin-bottom: 24px; padding: 5px; border-radius: 12px; }
  .collection-nav { gap: 2px; }
  .collection-nav a { border-radius: 8px; padding-inline: 13px; }
  .author { gap: 42px; }
  .author-photo img { height: 365px; }
  .author-links { gap: 4px 18px; }
  .choose small { max-width: 270px; }
  .footer-contacts { flex-direction: column; gap: 3px; }
  .footer-contacts a { gap: 12px; }
}

@media (max-width: 359px) {
  .need-grid > a { padding-inline: 11px; }
  .collection-nav a { padding-inline: 11px; }
}

@media (max-width: 600px) and (max-height: 740px) {
  .header { height: 68px; }
  .hero-art { margin-top: 18px; }
  .portrait { height: 180px; }
  .portrait img { object-position: 50% 18%; }
  .portrait-caption { display: none; }
}

@media (forced-colors: active) {
  .collection-nav [aria-current] { outline: 2px solid Highlight; outline-offset: -3px; }

}

/* ── lane:L-GATE ── */
/* lane:L-GATE:end */

/* ── lane:L-VIS ── */
/* VISUAL-04 · Free sections sit on the wrap edge and use stack spacing · gates: design:edges */
.author-note { padding-block: var(--section-y-s); padding-inline: 0; }
.author-principle .text-link, .author-links { margin-top: var(--stack-3); }
.needs-intro .eyebrow { margin-bottom: var(--stack-1); }
@media (max-width: 600px) { .needs-intro .text-link { margin-top: var(--stack-3); } }
/* lane:L-VIS:end */

/* ── lane:L-ROUTE ── */
/* lane:L-ROUTE:end */

/* ── lane:L-NAV ── */
/* UX-04 · Якоря остаются открытыми при возврате шапки · gates: nav:header-reveal */
#start,#mary,#choose,.faq{scroll-margin-top:var(--space-2)}
#programs .product{scroll-margin-top:0}
/* MOBILE-09 · CTA героя остаётся в первом альбомном экране · gates: phones:fold */
@media (orientation:landscape) and (max-height:500px) and (pointer:coarse){
  .hero{min-height:0;padding:22px var(--space-6);grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:var(--space-5)}
  .hero-copy{display:flex;flex-direction:column;min-width:0}
  .hero .eyebrow{margin-bottom:var(--space-2)}
  .hero h1{font-size:var(--fs-title-xl)}
  .hero .hero-lead{font-size:var(--fs-name);margin-top:var(--space-2)}
  .hero-experience{margin-top:var(--space-1)}
  .hero .hero-actions{order:1;margin-top:var(--space-3);gap:var(--space-2)}
  .hero-description{order:2}
  .hero-footnote{order:3}
  .hero-art{margin:0;align-self:start}
  .portrait{height:min(62svh,240px)}
  .portrait-caption{display:none}
}
/* INNOVATION-07 · Активная глава на anchor и тихая полоса до прилипания · gates: innovation.nav, A11Y-12:R1,R2,R4 */
@media (min-width:601px){
  .collection-toolbar{background:transparent;border-color:transparent;box-shadow:none}
  .collection-nav{position:relative;isolation:isolate;border-radius:var(--r-pill);background:var(--paper);box-shadow:var(--shadow-collection);outline:1px solid var(--line);outline-offset:-1px}
  @supports (anchor-name:--chapter-current){
    .collection-nav a{position:relative;z-index:1}
    .collection-nav [aria-current]{anchor-name:--chapter-current;background:transparent}
    .collection-nav:has([aria-current])::before{content:'';position:absolute;position-anchor:--chapter-current;top:anchor(top);right:anchor(right);bottom:anchor(bottom);left:anchor(left);z-index:0;pointer-events:none;border-radius:var(--r-pill);background:var(--world-listening)}
    .collection-nav:has([data-chapter=pronunciation][aria-current])::before{background:var(--world-pronunciation)}
    .collection-nav:has([data-chapter=speaking][aria-current])::before{background:var(--world-speaking)}
    .collection-nav:has([data-chapter=steps][aria-current])::before{background:var(--world-steps)}
    .collection-nav:has([data-chapter=skarb][aria-current])::before{background:var(--world-skarb)}
    @media (forced-colors:active){.collection-nav:has([aria-current])::before{display:none}}
  }
  @supports (anchor-name:--chapter-current) and (container-type:scroll-state){
    html.js .collection-toolbar{container-type:scroll-state}
    html.js .collection-nav{background:transparent;box-shadow:none;outline:none}
    html.js .collection-nav::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line);pointer-events:none}
    html.js .collection-nav [aria-current]{background:transparent}
    html.js .collection-nav:has([aria-current])::before{opacity:0}
    html.js .collection-nav [aria-current]::after{content:'';position:absolute;left:var(--space-4);right:var(--space-4);bottom:2px;height:2px;background:var(--w-listening-ink);pointer-events:none}
    html.js .collection-nav [data-chapter=pronunciation][aria-current]::after{background:var(--w-pronunciation-ink)}
    html.js .collection-nav [data-chapter=speaking][aria-current]::after{background:var(--w-speaking-ink)}
    html.js .collection-nav [data-chapter=steps][aria-current]::after{background:var(--w-steps-ink)}
    html.js .collection-nav [data-chapter=skarb][aria-current]::after{background:var(--w-skarb-ink)}
    @container scroll-state(stuck:top){
      html.js .collection-nav{background:var(--paper);box-shadow:var(--shadow-collection);outline:1px solid var(--line)}
      html.js .collection-nav::after,html.js .collection-nav [aria-current]::after{opacity:0}
      html.js .collection-nav:has([aria-current])::before{opacity:1}
    }
    @media (prefers-reduced-motion:no-preference){
      html.js .collection-nav:has([aria-current])::before,
      html.js .collection-nav::after,
      html.js .collection-nav [aria-current]::after{transition:opacity var(--dur-hover) var(--ease-out)}
    }
  }
}
/* lane:L-NAV:end */

/* ── lane:L-DLG ── */
/* WOW-07 · живой экран в существующей кнопке · gates: wow:peeks, axe, copy-guard; A11Y-12:R1,R2,R9,R10 */
.product-body .has-peek { gap: 14px; min-height: 60px; max-width: 100%; text-align: left; }
.product-body .peek { flex: 0 0 auto; width: 84px; height: 52px; overflow: hidden; border-radius: 7px; background: color-mix(in oklab, var(--chapter-bg), var(--paper) 30%); box-shadow: var(--shadow-1); transform: rotate(-2deg); }
.product-body .peek img { display: block; width: 100%; height: 100%; object-fit: cover; }
.listening .product-body .peek img { object-position: 62% 50%; }
.pronunciation .product-body .peek img { object-position: 50% 35%; }
.skarb .product-body .peek img { object-position: 50% 20%; }
@media (max-width: 600px) { .product-body .peek { width: 76px; height: 48px; } }
@media (prefers-reduced-motion: no-preference) {
  .product-body .peek { transition: transform var(--dur-hover) var(--ease-out); }
  @media (hover: hover) { .product-body .has-peek:hover .peek { transform: translateY(-2px) rotate(0); } }
  .product-body .has-peek:active .peek { transform: scale(.97) rotate(-2deg); }
  @supports (animation-timeline: view()) {
    .product-body .peek img { animation: wow-peek-in linear both; animation-timeline: view(); animation-range: entry 20% entry 80%; }
    @keyframes wow-peek-in { from { transform: translate(-6px, 4px) rotate(-2deg); opacity: 0; } to { transform: none; opacity: 1; } }
  }
}
/* lane:L-DLG:end */

/* ── lane:L-FILM ── */
/* WOW-06 · предметы пяти миров в указателе · gates: no-preference, view-timeline, hover */
.need-grid > a { grid-template-columns:56px minmax(0,1fr); }
.need-icon { width:56px; height:56px; overflow:hidden; box-shadow:var(--shadow-need-icon); }
.need-icon img { display:block; width:100%; height:100%; object-fit:cover; border-radius:50%; }
@media (min-width:601px) and (max-width:1100px) {
 .need-grid > a { grid-template-columns:48px minmax(0,1fr); }
 .need-icon { width:48px; height:48px; }
}
@media (max-width:600px) {
 .need-grid > a { grid-template-columns:minmax(0,1fr); }
 .need-icon { width:60px; height:60px; }
 .need-grid > a:last-child { grid-template-columns:52px minmax(0,1fr); }
 .need-grid > a:last-child .need-icon { width:52px; height:52px; }
}
@media (max-width:359px) { .need-grid > a:last-child { gap:var(--space-2); } }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
 .need-icon img { transition:transform var(--dur-reveal) var(--ease-out); }
 .need-grid > a:hover .need-icon img { transform:scale(1.04); }
}
@media (prefers-reduced-motion:no-preference) {
 @supports (animation-timeline:view()) {
  .need-icon { animation:world-peek linear both; animation-timeline:view(); animation-range:entry 10% entry 90%; }
  @keyframes world-peek { from { transform:scale(.96); opacity:0; } }
 }
}
/* lane:L-FILM:end */

/* ── lane:L-MOT ── */
/* WOW-09 · записка под приглашением · gates: mobile, no-preference + @supports animation-timeline */
@media (max-width: 800px) {
 .choose-doodle { display: block; position: static; width: fit-content; margin: var(--space-5) auto 0; transform: rotate(-2deg); font-family: var(--font-display); font-size: var(--fs-lead); line-height: var(--lh-lead); font-style: italic; text-align: center; color: var(--ink); }
}
@media (prefers-reduced-motion: no-preference) {
 @supports (animation-timeline: view()) {
  .choose { view-timeline: --mot-choose block; }
  .choose-doodle { animation: mot-choose-write linear both; animation-timeline: --mot-choose; animation-range: entry 50% entry 100%; }
  @keyframes mot-choose-write { from { clip-path: inset(-20% 100% -20% 0); } to { clip-path: inset(-20% -4% -20% 0); } }
 }
}
/* lane:L-MOT:end */

/* ── lane:L-PERF ── */
/* lane:L-PERF:end */
