/* The product tour is one complete screen; its chrome and content share one budget. */
.official-home{scroll-snap-type:y proximity}
#product{
  height:100svh;
  padding:112px 0 24px;
  scroll-snap-align:start;
  scroll-margin-top:-112px;
}
#product .story-frame{
  height:100%;
  min-height:0;
  display:grid;
  grid-template-rows:auto auto 2px minmax(0,1fr) auto;
  gap:16px;
}
#product .story-header,#product .story-intro,#product .story-meter,#product .story-controls{margin:0}
#product .story-intro{font-size:clamp(27px,3vw,40px);line-height:1.25}
#product .story-viewport{min-height:0;height:100%}
#product .story-slide{height:100%;min-height:0;grid-template-rows:minmax(0,1fr)}
#product .story-stage{height:100%;min-height:0;align-self:stretch}
#product .device-wrap{height:85%}
#product .story-step-inner{padding-block:8px}
#product .story-slide h3{font-size:clamp(29px,3.1vw,42px)}
#product .story-slide p{font-size:13px;margin-top:18px}
#product .story-tags{margin-top:20px}
#product .story-page{min-height:44px}

@media(max-width:800px){
  #product .story-slide{gap:30px}
  #product .story-slide h3{font-size:30px}
  #product .story-slide p{font-size:12px}
  #product .story-tags{gap:6px}
  #product .story-tags span{padding:5px 7px;font-size:9px}
}
@media(max-width:600px){
  #product{padding:96px 0 18px;scroll-margin-top:-96px}
  #product .story-frame{gap:12px}
  #product .story-header{align-items:center}
  #product .story-header p{font-size:9px;max-width:none;line-height:1.5}
  #product .story-header #storyHint{max-width:120px}
  #product .story-intro{font-size:25px;line-height:1.3}
  #product .story-slide{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:14px}
  #product .story-step-inner{padding:0 2px}
  #product .story-num{font-size:9px;margin-bottom:8px}
  #product .story-slide h3{font-size:25px;line-height:1.3}
  #product .story-slide p{font-size:12px;line-height:1.75;margin-top:10px}
  #product .story-tags{display:none}
  #product .story-stage{border-radius:16px}
  #product .device-wrap{height:88%;width:70%}
  #product .device-wrap img{border-width:4px;border-radius:20px}
  #product .stage-index{top:13px;left:15px;font-size:9px}
  #product .stage-caption{right:14px;bottom:12px}
  #product .story-controls{gap:8px}
  #product .story-pagination{width:auto;flex:1;gap:10px}
  #product .story-page{font-size:10px;min-height:44px;display:block;text-align:left;line-height:1.5}
  #product .story-page span{display:block;font-size:9px}
  #product .story-arrows{gap:6px}
  #product .story-arrow{width:38px;height:44px;font-size:17px}
}
/* Preserve reading at high zoom and on short landscape screens. */
@media(max-height:620px){
  #product{height:auto;min-height:100svh;scroll-snap-align:none}
  #product .story-frame{height:auto;grid-template-rows:auto auto 2px auto auto}
  #product .story-viewport{height:auto}
  #product .story-slide{height:auto;grid-template-rows:auto}
  #product .story-stage{height:340px}
}
@media(max-height:620px) and (max-width:600px){
  #product .story-slide{grid-template-rows:auto 280px}
  #product .story-stage{height:280px}
}