/* Tablet layouts are isolated so phone and desktop presentation stay intact. */
@media (min-width: 768px) and (max-width: 1199px) {
  #main-content .site-container { max-width: calc(100% - 48px); }
  #main-content .site-container > .layout-row > .layout-col-10 { width: 100%; }
  #main-content :is(h3, h4, h5, p) { line-height: 1.5; }
  #main-content h3 { font-size: 22px; }
  #main-content :is(h4, h5, p) { font-size: 18px; }
  #main-content p:has(small), #main-content p > small { font-size: 16px; }
  #main-content .trading-notice p { font-size: 18px; }
  #extended-trading .trading-table-wrap .session-cell > span { font-size: 14px; letter-spacing: 1px; }
  #main-content .section-text-heading { font-size: 32px; }

  /* Give the illustration and its answer independent, content-sized columns. */
  #pills-ct3-tabContent .pc { display: grid; grid-template-columns: 42% minmax(0, 1fr); align-items: center; gap: 16px; }
  #pills-ct3-tabContent .pc > .left { width: 100%; }
  #pills-ct3-tabContent .pc > .right {
    position: relative !important;
    inset: auto !important;
    width: 100%;
    transform: none;
    animation: none;
    background: #fbf2e9;
    padding: 24px;
  }
  #pills-ct3-tabContent .pc > .right > img { display: none; }
  #pills-ct3-tabContent .pc > .right > .text {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    padding: 0;
    transform: none;
  }
  #pills-ct3-tabContent .pc .text :is(.tw-w-3\/4, .w-90) { width: 100% !important; min-width: 0; }
  #pills-ct3-tabContent .pc .text .icon { flex-shrink: 0; }
  #main-content #pills-ct3-tab .nav-link { flex: 1 0 0; width: auto; min-width: 0; }

  /* Two readable columns, with cards tall enough for the longest fund name. */
  #main-content .ct4 .swiper-slide-card {
    height: auto !important;
    min-height: 380px;
    padding: 24px;
    gap: 12px;
    overflow-wrap: anywhere;
    background: #fbf2e9;
    border-radius: 8px;
  }
  #main-content .ct4 .swiper-slide-card .card-title { width: 100% !important; margin: 0; }
  #main-content .ct4 .swiper-slide-card .info { flex: 1; }
  #main-content .ct4 .swiper-slide-card .txt { min-width: 0; }
  #main-content .ct4 .swiper-slide-card .spaceline { margin: 0; }
  #main-content .ct4 .swiper-slide-card .price h3 { font-size: 22px; }

  .iphone-copy { width: 72%; gap: 16px; }
  #main-content .iphone-copy p { font-size: 20px; white-space: normal; }
  .iphone-card { height: auto; min-height: 260px; }
  #main-content .iphone-cta { width: auto; padding: 10px 28px; font-size: 20px; }

  .feature-content > .layout-row { width: 100%; min-width: 0; }
  #pills-ct5-tabContent .pc { width: 100%; gap: 20px; }
  #pills-ct5-tabContent .pc .tagimg1 { width: calc(50% - 10px) !important; max-width: 390px; object-fit: contain; }
  #pills-ct5-tabContent > .tab-pane > .tagimg1 { width: min(100%, 390px) !important; }
  #pills-tabContent .accordion-body { padding: 24px 32px; }
  .investment-ticket { padding-inline: 40px; }
  .investment-card-title-copy { white-space: normal; }
}
