/* Page-specific mobile Price/Features presentation. Protected global CSS is unchanged. */
.mobile-features, .mobile-plan-details, .mobile-plan-symbol { display: none; }
@media (max-width: 760px) {
  /* Feature catalog: tap to read the exact original description. */
  .feat-page .feat-top { text-align: left; margin-bottom: 20px; }
  .feat-page .feat-top h1 { font-size: 2.7rem; line-height: 1.05; }
  .feat-page:has(.mobile-features) .cinema { display: none; }
  .mobile-features { display: block; }
  .mobile-feature { margin: 10px 0; background: rgba(255,255,255,.62); border: 1px solid rgba(16,40,40,.1); border-radius: 16px; overflow: hidden; }
  .mobile-feature summary { display: grid; grid-template-columns: 70px minmax(0,1fr) 16px; align-items: center; gap: 12px; padding: 10px; cursor: pointer; list-style: none; min-height: 90px; }
  .mobile-feature summary::-webkit-details-marker { display: none; }
  .mobile-feature summary::after { content: '›'; font-size: 28px; color: #9b6518; transition: transform 180ms ease; }
  .mobile-feature[open] summary::after { transform: rotate(90deg); }
  .mobile-feature summary img { width: 70px; height: 70px; object-fit: cover; object-position: top left; border-radius: 10px; }
  .mobile-feature-kicker { display: block; font-family: var(--font-mono); color: #9b6518; font-size: 9px; letter-spacing: .05em; }
  .mobile-feature h2 { font-family: var(--font-display); font-weight: 600; font-size: 1.35rem; line-height: 1.15; margin: 4px 0 0; }
  .mobile-feature > p { margin: 0; padding: 4px 16px 18px; font-size: .93rem; line-height: 1.6; color: var(--muted); }
  .mobile-feature summary:focus-visible, .mobile-plan-details summary:focus-visible { outline: 2px solid var(--accent); outline-offset: -3px; }
  /* Pricing: compact plans with the same full comparison, one plan at a time. */
  .price-stage .wrap { width: 100%; }
  .price-stage .section-h { font-size: 2.7rem; line-height: 1.03; }
  .price-stage .section-p { font-size: .98rem; line-height: 1.55; }
  .price-stage .audience { margin-top: 18px; }
  .price-stage .price-grid { gap: 14px; margin-top: 22px; }
  .price-stage .plan { padding: 18px !important; border-radius: 20px !important; }
  .mobile-plan-symbol { display: grid; place-items: center; position: absolute; top: 56px; left: 18px; width: 56px; height: 56px; border-radius: 50%; background: #bdf1dc; color: #136c57; }
  .mobile-plan-symbol svg { width: 34px; height: 34px; }
  .mobile-plan-symbol.symbol-1 { background: #ffdb95; color: #8e5606; }
  .mobile-plan-symbol.symbol-2 { background: #daceff; color: #5a3996; }
  .price-stage .plan h2, .price-stage .plan .amt { margin-left: 72px !important; }
  .price-stage .plan h2 { font-size: 1.8rem; margin: 5px 0; }
  .price-stage .plan .amt { font-size: 2.3rem; margin: 8px 0; }
  .price-stage .plan > p:last-of-type { font-size: .91rem; line-height: 1.55; margin-bottom: 16px; }
  .price-stage:has(.mobile-plan-details) .matrix { display: none; }
  .mobile-plan-details { display: block; border-top: 1px solid rgba(16,40,40,.12); }
  .mobile-plan-details summary { cursor: pointer; padding: 12px 2px 0; font-size: .84rem; font-family: var(--font-mono); list-style: none; display: flex; justify-content: space-between; align-items: center; min-height: 44px; }
  .mobile-plan-details summary::-webkit-details-marker { display: none; }
  .mobile-plan-details summary::after { content: '+'; font-size: 1.4rem; }
  .mobile-plan-details[open] summary::after { content: '−'; }
  .mobile-plan-details dl { margin: 12px 0 0; font-size: .85rem; }
  .mobile-plan-details dl > div { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 12px; padding: 10px 0; border-top: 1px solid rgba(16,40,40,.12); }
  .mobile-plan-details dt, .mobile-plan-details dd { margin: 0; overflow-wrap: anywhere; }
  .mobile-plan-details dd { text-align: right; font-weight: 500; }
  .price-stage .cap-row { gap: 10px; }
  .price-stage .cap { padding: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .mobile-feature summary::after { transition: none; }
}