/* KES viewport contract: a navigation target occupies the usable screen, not
   the area behind the fixed header or the mobile navigation. Long details
   remain scrollable inside their section. */
html{scroll-padding-top:96px;scroll-behavior:auto}
.view-section{scroll-margin-top:0}
.hero,.feature-section,.library-section,.identity-section{height:calc(100dvh - 116px);min-height:0}
.hero-stage{min-height:0}
.feature-section{overflow:hidden}
.feature-copy{min-height:0;overflow-y:auto;overscroll-behavior:contain}
.feature-visual{min-height:0}
.library-section{display:flex;flex-direction:column;overflow:hidden}
.library-section .section-heading{flex:none;margin:20px 4px 20px}
.resource-grid{min-height:0;overflow-y:auto;overscroll-behavior:contain}
.identity-section{overflow-y:auto;overscroll-behavior:contain}

@media(max-width:900px){
  html{scroll-padding-top:76px}
  .hero,.feature-section,.library-section,.identity-section{height:calc(100dvh - 155px)}
  .hero{grid-template-rows:minmax(0,.42fr) minmax(0,.58fr)}
  .mobile-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;bottom:0;left:0;right:0;z-index:30;height:calc(67px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:#fffefef5;border-top:1px solid #e7e8ed;box-shadow:0 -9px 25px #17192712;backdrop-filter:blur(18px)}
  .mobile-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:9px;color:#828899;font-weight:700;min-width:0}
  .mobile-nav a span{font-size:20px;line-height:1}
  .mobile-nav a.active{color:var(--scarlet)}
  .workspace footer{padding-bottom:85px}
}

@media(max-width:640px){
  html{scroll-padding-top:75px}
  .hero,.feature-section,.library-section,.identity-section{height:calc(100dvh - 150px)}
  .hero{grid-template-rows:minmax(0,1fr) 245px;gap:8px}
  .hero-copy{min-height:0;overflow-y:auto;justify-content:center;padding:20px 22px 18px}
  .hero-copy .eyebrow{font-size:9px;line-height:1.3;margin:0 0 12px}
  .hero h1{font-size:clamp(35px,10vw,42px);line-height:1.01;margin:0 0 12px}
  .hero-copy>p:not(.eyebrow){font-size:12px;line-height:1.48;margin:0 0 14px}
  .hero-copy .button{padding:11px 16px;font-size:11px}
  .hero-note{font-size:9px;margin-top:7px}
  .hero-stage{min-height:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:center;gap:8px;padding:14px;background:radial-gradient(circle at center,#fff,#faf6f9)}
  .hero-stage .orbit,.hero-stage .core,.hero-stage .stage-tabs,.hero-stage .stage-foot{display:none}
  .hero-stage .orbit-card{position:static;min-width:0;min-height:58px;width:auto;transform:none;padding:8px;border-radius:12px}
  .hero-stage .orbit-card:hover{transform:none}
  .hero-stage .orbit-card strong{font-size:9px}
  .hero-stage .orbit-card small{font-size:7px}
  .hero-stage .orbit-card.c5{grid-column:1/-1}
  .hero-stage .mini-icon{width:24px;height:24px;font-size:13px;flex:none}
  .feature-section,.feature-section.reverse{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) 150px;gap:8px;margin-top:50px}
  .feature-section.reverse .feature-copy{order:0}
  .feature-copy{padding:8px 10px 4px;display:flex;flex-direction:column;align-items:flex-start;justify-content:safe center}
  .feature-copy .eyebrow{order:0;font-size:9px;margin:0 0 9px}
  .feature-copy h2{order:1;font-size:clamp(30px,8.5vw,38px);line-height:1.04;margin:0 0 10px}
  .feature-copy>a.button,.feature-copy>a.text-action{order:2;margin:0 0 12px}
  .feature-copy>a.button{padding:11px 15px;font-size:11px}
  .feature-copy>p,.feature-copy>ul,.feature-copy>.lesson-list,.feature-copy>.qr-types,.feature-copy>small{order:3}
  .feature-copy p{font-size:12px;line-height:1.5;margin:0 0 11px}
  .feature-copy ul{gap:5px;margin:0 0 9px}
  .feature-copy li{font-size:11px;line-height:1.4}
  .feature-copy>small{font-size:9px;margin-top:5px}
  .lesson-list{gap:3px;margin:0 0 9px}
  .lesson-list>div{padding:6px 0}
  .qr-types{gap:5px;margin:0 0 8px}
  .qr-types span{font-size:9px;padding:5px 8px}
  .feature-visual{height:150px;min-height:0;padding:13px 16px;border-radius:18px}
  .studio-visual{min-height:0}
  .visual-top{font-size:8px}
  .visual-big{font-size:25px;line-height:1.04;margin-top:10px}
  .visual-cards{margin-top:9px;gap:5px}
  .visual-cards div{padding:5px 8px;border-radius:8px;gap:0}
  .visual-cards b{font-size:13px}
  .visual-cards span{font-size:7px}
  .academy-disc{width:88px;height:88px;box-shadow:0 0 0 8px #fff8,0 0 0 17px #ffffff66;gap:1px}
  .academy-disc span,.academy-disc small{font-size:6px}
  .academy-disc strong{font-size:38px}
  .academy-visual p{font-size:8px}
  .qr-art{width:92px;height:92px;border-radius:12px;margin:4px auto}
  .qr-art span{font-size:11px}
  .visual-bottom{font-size:7px}
  .library-section{margin-top:50px}
  .library-section .section-heading{margin:8px 4px 12px}
  .library-section .section-heading h2{font-size:30px;margin:5px 0}
  .library-section .section-heading p{font-size:11px;line-height:1.4}
  .resource-grid{grid-template-columns:1fr;gap:8px;padding-bottom:8px}
  .resource-grid a{min-height:123px;padding:13px 16px;border-radius:15px}
  .resource-grid strong{font-size:16px;margin-top:8px}
  .resource-grid p{font-size:10px;margin:4px 0}
  .resource-grid b{font-size:10px}
  .identity-section{margin-top:50px;align-content:start;gap:8px;padding:20px}
  .identity-section .eyebrow{margin:0 0 10px}
  .identity-section h2{font-size:34px;margin:0 0 8px}
  .identity-section p{font-size:11px;line-height:1.5}
  .identity-state{padding:14px}
  .identity-state strong{font-size:19px;margin:4px 0}
  .identity-state p{margin:8px 0 0}
}

@media(max-width:900px) and (max-height:620px){
  .hero{grid-template-rows:1fr}
  .hero-stage,.feature-visual{display:none}
  .hero-copy{overflow-y:auto}
  .hero-copy{justify-content:flex-start}
  .feature-section,.feature-section.reverse{grid-template-columns:1fr;grid-template-rows:1fr}
  .feature-copy{justify-content:flex-start;overflow-y:auto}
  .feature-copy .eyebrow{margin-bottom:5px}
  .feature-copy h2{font-size:clamp(25px,5vw,33px);margin-bottom:8px}
  .feature-copy>a.button,.feature-copy>a.text-action{order:2}
  .feature-copy>p,.feature-copy>ul,.feature-copy>.lesson-list,.feature-copy>.qr-types,.feature-copy>small{order:3}
}
