/* Mobile typography audit — 2026 */
:root{
  --type-body:15px;
  --type-secondary:13px;
  --type-caption:11px;
  --leading-body:1.55;
}

html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-size:var(--type-body);line-height:var(--leading-body)}
.content{padding-left:22px;padding-right:22px}

/* Titles */
.welcome h1{font-size:clamp(38px,10.5vw,44px);line-height:1.06}
.page-title h1,.quiz-copy h1,.result-screen>h1{font-size:clamp(30px,8.5vw,36px);line-height:1.12}
.section-title h2,.club-teaser h2,.proof h2,.preview h2,.mid-cta h2,.faq h2,.final-cta h2,.learn-section>h2,.self-select h2,.reputation h2,.reviews h2{font-size:clamp(24px,7vw,29px);line-height:1.16}
.main-offer h2{font-size:29px;line-height:1.1}
h3,.course-card h3,.mini-card h3{line-height:1.3}

/* Body copy */
.welcome>p:not(.overline),.page-title p,.quiz-copy p,.result-lead,.reputation>p,.reviews>p{font-size:15px;line-height:1.6}
.main-offer>p,.club-offer>p,.mini-card>p,.preview>p,.case-card>p,.self-select>p,.learn-lead,.learning-help p,.why p,.recommended>p{font-size:13px;line-height:1.55}
.club-teaser p,.next-event p,.bundle p{font-size:13px;line-height:1.55}

/* Supporting text — never below 11px */
.section-kicker,.overline,.result-label,.live,.offer-badge,.mini-head small,.main-offer>span,.club-price>span{font-size:11px;line-height:1.35;letter-spacing:.1em}
small,.cta-note,.safe-pay,.renewal,.swipe-note{font-size:11px;line-height:1.45}
.course-card p,.active-course p,.materials small,.week-plan p,.benefits span,.program-list small,.mini-card details ul,.faq details p,.lead-gift p,.mini-case span,.result-options small{font-size:12px;line-height:1.5}
.course-card small,.reputation-stats span,.education-stats span,.trust-strip span,.case-person small,.case-result small,.case-result span,.offer-metrics span,.bonus-line small,.offer-price small,.club-offer-price small,.club-offer-price>span,.mini-tags span{font-size:11px;line-height:1.4}
.continue p,.social-proof,.quiz-foot{font-size:12px;line-height:1.5}

/* Controls */
button,.cta,.question-link,.bottom-nav button,.answers button,.materials>button,.profile-list button{min-height:44px}
.cta{font-size:14px;line-height:1.3;padding:16px 18px}
.answers button{font-size:15px;line-height:1.4;min-height:64px}
.bottom-nav{height:82px;padding-top:8px}
.bottom-nav button{font-size:11px;line-height:1.2}
.bottom-nav i{font-size:22px}
.bottom-nav i {
  width: 26px;
  height: 28px;
  display: grid;
  place-items: center;
}
.bottom-nav i svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .22s ease, filter .22s ease;
}
.bottom-nav .active i svg {
  transform: translateY(-1px);
  filter: drop-shadow(0 3px 7px rgba(231, 141, 88, .28));
}
.app-shell{padding-bottom:98px}

/* Cards and readable spacing */
.course-card{padding:16px;gap:14px}
.course-card h3{font-size:15px}.course-card p{margin-bottom:8px}
.main-offer,.club-offer,.recommended{padding:22px}
.offer-list li{font-size:13px;line-height:1.45;padding-top:10px;padding-bottom:10px}
.program-list b,.mini-card summary,.course-details summary{font-size:13px;line-height:1.4}
.program-list>div{padding:13px 0}
.mini-card{padding:18px}.mini-card h3{font-size:19px}
.mini-buy button,.club-offer>button,.bundle button{font-size:13px;min-height:44px}
.result-options b{font-size:13px;line-height:1.35}.result-options strong{font-size:12px}
.faq summary{font-size:14px;line-height:1.4;min-height:50px;align-items:center}
.profile-list button{font-size:14px}

/* Comfortable vertical rhythm */
.page-title{padding-top:38px;padding-bottom:32px}
.page-title h1{margin-top:12px;margin-bottom:14px}
.learn-section,.reputation,.reviews,.preview{margin-bottom:52px}
.section-title{margin-bottom:18px}

@media(max-width:360px){
  .content{padding-left:18px;padding-right:18px}
  .welcome h1{font-size:36px}
  .result-options>button{grid-template-columns:40px 1fr 12px}
  .result-options strong{grid-column:2;justify-self:start}
}
.legal-links {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 8px 12px 24px;
  color: rgba(255, 255, 255, .38);
  font-size: 12px;
  line-height: 1.45;
  text-align: center;
}

.legal-links a {
  color: inherit;
  display: block;
  text-decoration: underline;
  text-decoration-color: rgba(255, 255, 255, .2);
  text-underline-offset: 3px;
}

.legal-links a:active { color: #e6935f; }
