/* Phone opening: readable document flow, with a single compact hero. */
@media(max-width:700px),(max-width:1000px) and (max-height:500px) and (pointer:coarse){
  .header{height:68px;padding:0 20px}
  .brand{font-size:12px}
  .header-center,.header-nav{display:none}
  .menu-button,.mobile-nav:not([hidden]){display:none}
  .journey{height:auto}
  .scene{position:relative;height:var(--mobile-scene-height,100svh);min-height:560px;--side-inset:20px;--mobile-title-size:clamp(23px,7.2vw,32px);--mobile-title-top:94px}
  .halo{top:46%;width:135vw;height:135vw;opacity:.65}
  .grain{opacity:.035}
  .scene-heading{position:absolute;display:flex;left:20px;right:20px;top:var(--mobile-title-top);justify-content:center;align-items:flex-start;gap:clamp(24px,8vw,40px);margin:0;transform:none;opacity:1}
  .heading-idea,.heading-code{position:static;flex:0 0 auto;width:max-content;font-size:var(--mobile-title-size);line-height:1.1;letter-spacing:-.045em;text-align:center;opacity:1;transform:none}
  .left-copy{left:20px;right:20px;top:calc(var(--mobile-title-top) + var(--mobile-title-size)*2.2 + 22px);bottom:auto;width:auto;text-align:center;opacity:1;transform:none}
  .course-label{font-size:15px;line-height:1.45;letter-spacing:-.02em}
  .course-label br{display:none}
  .portrait-wrap{transform:none!important;animation:none}
  .portrait{top:clamp(207px,calc(var(--mobile-scene-height,100svh)*.28),242px);bottom:auto;left:50%;height:calc(100% - clamp(207px,calc(var(--mobile-scene-height,100svh)*.28),242px) - 110px);width:auto;max-width:none;transform:translateX(-50%);transition:none;animation:none;filter:brightness(.94);mask-image:linear-gradient(to bottom,#000 72%,transparent 100%)}
  .right-stack{left:20px;right:20px;top:auto;bottom:20px;width:auto;transform:none}
  .right-stack .right-copy{padding:15px 16px 16px;border-radius:13px;background:#222124e0;backdrop-filter:blur(16px)}
  .right-stack .offer{margin:0 0 12px}
  .offer-lead{font-size:23px;line-height:1.15;margin-bottom:7px}
  .offer-detail{font-size:14px;line-height:1.4;text-wrap:pretty}
  .right-stack .enroll{height:48px;font-size:16px;border-radius:8px}
  .right-stack .enroll:after{animation:none}
  .launch-date{justify-content:center;margin:10px auto 0;font-size:15px;gap:7px;opacity:1;visibility:visible;transform:none}
  .launch-label{font-size:13px}
  .scene.is-complete .date-track{transition:none;transition-delay:0s}
  .author-fixed,.scene-bottom,.reveal-copy,.hero-particles{display:none}
  .bottom-note{padding:32px 0;min-height:0}
  .bottom-note-inner{width:calc(100% - 40px);gap:20px}
  .bottom-note p{font-size:clamp(25px,6.7vw,34px);line-height:1.2;text-wrap:balance}
  .bottom-note button{font-size:14px;min-height:44px;padding:10px 0}

  .reality-section{padding:58px 0 60px}
  .reality-container{width:calc(100% - 40px)}
  .reality-story{height:auto}
  .reality-layout{position:static;display:block;min-height:0;padding:0}
  .reality-heading{position:static;display:block;min-height:0;margin:0 0 44px;padding:0}
  .reality-heading h2{font-size:clamp(32px,9.2vw,44px);line-height:1.08;letter-spacing:-.045em;max-width:none;margin:0}
  .reality-phrases{display:none}
  .reality-problems{display:block;min-height:0;padding:0}
  .problem-row,.problem-row:first-child,.problem-row:last-child{padding:0 0 38px;margin:0 0 36px;min-height:0;border:0;border-bottom:1px solid #ffffff1c;opacity:1;visibility:visible;transform:none}
  .problem-row:last-child{padding-bottom:0;margin-bottom:0;border-bottom:0}
  .problem-row:before,.problem-row:after{display:none}
  .problem-row h3{display:block;font-size:clamp(23px,6.3vw,29px);font-weight:500;line-height:1.18;letter-spacing:-.035em;margin:0 0 19px;color:var(--paper);text-wrap:balance}
  .problem-row p:not(.reality-inline-phrase){font-size:16px;line-height:1.65;color:#bdb8b0;max-width:none}
  .problem-row p+p{margin-top:16px!important}
  .problem-row code{white-space:normal;overflow-wrap:anywhere}
  .reality-conclusion{margin-top:42px;padding-top:28px}
  .reality-conclusion>p{font-size:24px;line-height:1.4;letter-spacing:-.025em}
  .unfinished-strip{margin-top:24px}
  .reality-answer{display:block;padding-top:28px}
  .answer-label{font-size:15px;margin-bottom:16px}
  .reality-answer>p{font-size:21px;line-height:1.5}
  .mobile-card-mode .reality-heading{margin-bottom:28px}
  .mobile-card-mode .reality-problems{display:none}
  .mobile-reality-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:4px;border:1px solid #ffffff15;border-radius:11px;background:#19191b;margin-bottom:16px}
  .mobile-reality-tabs button{min-width:0;min-height:44px;padding:8px 3px;border:0;border-radius:7px;background:transparent;color:#aaa59e;font-size:12px;transition:background .2s,color .2s}
  .mobile-reality-tabs button[aria-selected=true]{color:#151515;background:var(--orange);font-weight:500;box-shadow:0 2px 9px #0003}
  .mobile-reality-deck{touch-action:pan-y pinch-zoom}
  .mobile-reality-panel{display:flex;flex-direction:column;min-height:310px;padding:22px;border:1px solid #ffffff20;border-top-color:#ff5a1f50;border-radius:18px;background:radial-gradient(ellipse at 100% 0,#ff5a1f0b,transparent 65%),#19191b;overflow:hidden}
  .mobile-reality-panel[hidden]{display:none}
  .mobile-reality-panel h3{font:500 clamp(27px,7.2vw,32px)/1.16 var(--heading);letter-spacing:-.04em;margin:0;color:var(--paper);text-wrap:balance}
  .mobile-reality-summary{font-size:16px;line-height:1.6;color:#beb9b2;margin:18px 0 0}
  .mobile-reality-details{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .35s ease,opacity .25s ease}
  .mobile-reality-details-inner{min-height:0;overflow:hidden}
  .mobile-reality-details-inner p{font-size:15px;line-height:1.7;color:#b4afa8;margin:18px 0 0}
  .mobile-reality-details-inner p:first-child{padding-top:18px;border-top:1px solid #ffffff18}
  .mobile-reality-details-inner code{font:400 .85em var(--mono);color:var(--paper);overflow-wrap:anywhere}
  .mobile-reality-panel.is-expanded .mobile-reality-details{grid-template-rows:1fr;opacity:1}
  .mobile-reality-more{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;flex-shrink:0;width:100%;padding:20px 0 0;margin-top:auto;border:0;background:transparent;color:var(--orange);font-size:15px;text-align:left}
  .mobile-reality-more i{position:relative;display:block;width:26px;height:26px;border:1px solid #ff5a1f60;border-radius:50%;transition:transform .3s}
  .mobile-reality-more i:before,.mobile-reality-more i:after{content:'';position:absolute;top:11px;left:7px;width:10px;height:1px;background:var(--orange)}
  .mobile-reality-more i:after{transform:rotate(90deg)}
  .mobile-reality-more[aria-expanded=true] i{transform:rotate(45deg)}
  .mobile-reality-hint{margin:14px 0 0;color:#8f8a83;font-size:12px;line-height:1.5;text-align:center}
  .mobile-reality-status{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}
@media(max-width:360px){.mobile-reality-panel{min-height:330px;padding:20px}.mobile-reality-tabs button{font-size:11px}.mobile-reality-summary{font-size:15px}}
@media(max-width:700px),(max-width:1000px) and (max-height:500px) and (pointer:coarse){
  .mobile-compact .header{height:60px}
  .mobile-compact .scene{--mobile-title-top:78px}
  .mobile-compact .portrait{top:210px;height:calc(100% - 345px)}
  .mobile-compact .right-stack{bottom:14px}
  .mobile-compact .right-stack .right-copy{padding:12px 14px 13px}
  .mobile-compact .offer-lead{font-size:21px;margin-bottom:5px}
  .mobile-compact .offer-detail{font-size:13px}
  .mobile-compact .right-stack .offer{margin-bottom:10px}
  .mobile-compact .right-stack .enroll{height:46px}
  .mobile-compact .launch-date{margin-top:8px;font-size:14px}
}
@media(min-width:520px) and (max-width:1000px) and (max-height:500px) and (pointer:coarse){
  .scene{min-height:390px}
  .mobile-compact .scene{--mobile-title-top:80px}
  .scene-heading{left:20px;right:auto;width:45%;gap:24px}
  .heading-idea,.heading-code{font-size:26px}
  .left-copy{top:164px;right:auto;width:47%}
  .mobile-compact .portrait{top:68px;left:76%;height:calc(100% - 68px)}
  .right-stack{top:202px;bottom:auto;right:auto;width:45%}
  .reality-container{max-width:720px}
}
@media(min-width:520px) and (max-width:700px) and (max-height:500px) and (pointer:coarse){
  .scene{min-height:430px}
  .heading-idea,.heading-code{font-size:23px}
}