/* Responsive finishing rules for service pages not covered by tool-polish. */
.site-main .quiz-pages h1,
.site-main .blog-index :is(.blog-lead, .blog-empty-state) h1,
.site-main .blog-editor-header h1,
.site-main .blog-write-page > .container > .card:first-child h1,
.site-main .blog-my-posts-container > .container-xl h1,
.site-main .blog-detail .blog-post-header h1,
.site-main .blog-detail .blog-empty-state h1 {
  font-size: clamp(1.45rem, 2.7vw, 2rem) !important;
  line-height: 1.18;
}

.site-main :is(.ai-tutor-page, .ai-tutor-page-header, .ai-tutor-chat-page,
  .ai-examiner-page, .ai-examiner-page-header, .ai-examiner-chat-page) h1 {
  font-size: clamp(1.45rem, 2.7vw, 2rem) !important;
  line-height: 1.18;
}

.site-main :is(.ai-tutor-home, .ai-examiner-home) h1 {
  font-size: clamp(1.8rem, 4vw, 3rem) !important;
  line-height: 1.1;
}

.site-main .gpt-chat-page > .gpt-workspace-heading h1,
.site-main .gpt-chat-home .gpt-home-hero h1 {
  font-size: clamp(1.45rem, 2.7vw, 2rem) !important;
  line-height: 1.18;
}

@media (max-width: 767.98px) {
  .site-main :is(
    .quiz-pages,
    .ai-tutor-page,
    .ai-tutor-page-header,
    .ai-tutor-chat-page,
    .ai-examiner-page,
    .ai-examiner-page-header,
    .ai-examiner-chat-page,
    .gpt-chat-page,
    .gpt-chat-home
  ) {
    padding-inline: max(8px, env(safe-area-inset-left)) max(8px, env(safe-area-inset-right));
  }

  /* Only known page action groups are centered; form rows and content stay put. */
  .site-main .quiz-pages :is(.actions, .my-quizzes-actions, .incorrect-modal-footer),
  .site-main .ai-tutor-page-header > .d-flex:has(> .btn),
  .site-main .ai-tutor-home-content .d-flex.gap-2:has(> .btn),
  .site-main .ai-tutor-page > .d-flex.justify-content-between.align-items-start.flex-wrap.gap-2.mb-3:has(> .d-flex.gap-2),
  .site-main .ai-tutor-page > .d-flex.justify-content-between.align-items-start.flex-wrap.gap-2.mb-3:has(> .btn),
  .site-main .ai-tutor-page > .d-flex.justify-content-between.align-items-start.flex-wrap.gap-2.mb-3 > .d-flex.gap-2,
  .site-main .ai-tutor-page > .mb-3 > .d-flex.gap-2:has(> .btn),
  .site-main .ai-tutor-page form .d-flex.justify-content-between.align-items-center.mt-4.gap-2:has(> .d-flex.gap-2),
  .site-main .ai-examiner-page-header > .d-flex:has(> .btn),
  .site-main .ai-examiner-home-content .d-flex.gap-2:has(> .btn),
  .site-main .ai-examiner-page > .d-flex.justify-content-between.align-items-start.flex-wrap.gap-2.mb-3:has(> .d-flex.gap-2),
  .site-main .ai-examiner-page > .d-flex.justify-content-between.align-items-start.flex-wrap.gap-2.mb-3:has(> .btn),
  .site-main .ai-examiner-page > .d-flex.justify-content-between.align-items-start.flex-wrap.gap-2.mb-3 > .d-flex.gap-2,
  .site-main .ai-examiner-page > .mb-3 > .d-flex.gap-2:has(> .btn),
  .site-main .ai-examiner-page form .d-flex.justify-content-between.align-items-center.mt-4.gap-2:has(> .d-flex.gap-2),
  .site-main .ai-tutor-chat-page .chat-command-buttons,
  .site-main .ai-examiner-chat-page .chat-command-buttons,
  .site-main .gpt-chat-page .gpt-workspace-heading > .d-flex,
  .site-main .gpt-chat-page .gpt-export-actions,
  .site-main .blog-site .blog-author-links,
  .site-main .blog-site .blog-story-actions,
  .site-main .blog-site .blog-post-actions-section,
  .site-main .blog-site .blog-post-actions-section > .d-flex,
  .site-main .blog-site .blog-post-author-actions > .d-flex,
  .site-main .blog-write-page > .container > .card:first-child .card-body > .d-flex.gap-2,
  .site-main .blog-editor-container .blog-editor-header .d-flex > .d-flex.gap-2,
  .site-main .blog-my-posts-container > .container-xl > .d-flex.justify-content-between.align-items-center.mb-5.pt-5,
  .site-main .blog-detail > .blog-frame > .mt-5 {
    display: flex;
    justify-content: center;
  }

  .site-main .quiz-pages .my-quizzes-actions,
  .site-main .gpt-chat-page .gpt-export-actions,
  .site-main .blog-site .blog-author-links {
    text-align: center;
  }

  .site-main :is(.ai-tutor-chat-page, .ai-examiner-chat-page) .chat-command-buttons {
    flex-wrap: wrap;
  }

  .site-main .gpt-chat-page .gpt-workspace-heading > .d-flex {
    width: 100%;
  }
}

@media (max-width: 720px) {
  .site-main :is(.blog-index, .blog-editor-container,
    .blog-my-posts-container, .blog-detail) .blog-frame {
    width: min(100% - 1rem, 1120px);
  }

  .site-main .blog-detail .blog-post-container {
    padding-inline: 0;
  }

  .site-main .blog-detail .blog-post-header h1,
  .site-main .blog-index .blog-lead h1 {
    font-size: clamp(1.45rem, 6vw, 2rem) !important;
  }

  .site-main .blog-my-posts-container > .container-xl > .d-flex.justify-content-between.align-items-center.mb-5.pt-5 {
    align-items: center !important;
    flex-direction: column;
    text-align: center;
  }
}