/* ============================================
   responsive.css - 响应式适配
   平板 (max-width: 1024px) / 移动端 (max-width: 768px)
   触摸友好目标 (min 44px)
   ============================================ */

/* ============================================
   大屏幕调整 (max-width: 1280px)
   ============================================ */
@media screen and (max-width: 1280px) {
  :root {
    --container-padding: 24px;
  }
}

/* ============================================
   平板 (max-width: 1024px)
   ============================================ */
@media screen and (max-width: 1024px) {
  :root {
    --container-padding: 20px;
    --space-section: 60px;
    --font-size-hero: 34px;
    --font-size-6xl: 30px;
    --font-size-5xl: 26px;
    --font-size-4xl: 24px;
  }

  /* ---- 全局 ---- */
  .container {
    max-width: 100%;
  }

  .grid-4 {
    grid-template-columns: repeat(3, 1fr);
  }

  /* ---- 头部 ---- */
  .header-nav__link {
    padding: 0 var(--space-3);
    font-size: var(--font-size-base);
  }

  .header-appointment-btn {
    padding: 6px 14px;
    font-size: var(--font-size-xs);
  }

  /* ---- 轮播 ---- */
  .hero-carousel {
    height: 420px;
  }

  .hero-carousel__title {
    font-size: var(--font-size-5xl);
  }

  .hero-carousel__desc {
    font-size: var(--font-size-lg);
  }

  /* ---- 快捷服务 ---- */
  .quick-services__grid {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-3);
  }

  /* ---- 医院简介 ---- */
  .hospital-intro__wrapper {
    gap: var(--space-8);
  }

  .hospital-intro__image img {
    height: 340px;
  }

  .hospital-intro__features {
    gap: var(--space-3);
  }

  /* ---- 科室网格 ---- */
  .dept-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .dept-list-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  /* ---- 专家团队 ---- */
  .expert-section__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  /* ---- 设备展示 ---- */
  .equipment-showcase__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .equipment-showcase__featured {
    grid-column: span 2;
  }

  .equipment-list-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* ---- 荣誉 ---- */
  .honors-stats {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-4);
  }

  /* ---- 新闻 ---- */
  .home-news__wrapper {
    gap: var(--space-6);
  }

  /* ---- 就医指南 ---- */
  .home-guide__grid {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-4);
  }

  /* ---- 医生 ---- */
  .doctor-list-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .doctor-profile__wrapper {
    grid-template-columns: 240px 1fr;
    gap: var(--space-8);
  }

  /* ---- 新闻 ---- */
  .news-list-wrapper {
    gap: var(--space-6);
  }

  .news-detail-wrapper {
    gap: var(--space-8);
  }

  /* ---- 就医指南页 ---- */
  .guide-page__wrapper {
    grid-template-columns: 220px 1fr;
    gap: var(--space-8);
  }

  .guide-steps-horizontal {
    flex-wrap: wrap;
    justify-content: center;
  }

  .guide-steps-horizontal::before {
    display: none;
  }

  .guide-step-h {
    flex: 0 0 calc(25% - var(--space-4));
    min-width: 120px;
  }

  .insurance-cards {
    grid-template-columns: repeat(2, 1fr);
  }

  .guide-map__info-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* ---- 科室详情 ---- */
  .dept-intro__wrapper {
    grid-template-columns: 1.5fr 1fr;
    gap: var(--space-8);
  }

  .dept-treatments__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .dept-tech__grid {
    grid-template-columns: 1fr;
  }

  .dept-doctors__grid .doctor-card {
    width: calc((100% - var(--space-6) * 2) / 3);
  }

  .dept-equipment__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* ---- 设备详情 ---- */
  .equipment-hero__wrapper {
    gap: var(--space-8);
  }

  .equipment-detail__wrapper {
    gap: var(--space-8);
  }

  /* ---- 页脚 ---- */
  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-8);
  }

  /* ---- 浮动侧栏 ---- */
  .floating-sidebar {
    display: flex;
  }
}

/* ============================================
   移动端 (max-width: 768px)
   ============================================ */
@media screen and (max-width: 768px) {
  :root {
    --container-padding: 16px;
    --space-section: 48px;
    --font-size-hero: 28px;
    --font-size-6xl: 26px;
    --font-size-5xl: 22px;
    --font-size-4xl: 20px;
    --font-size-3xl: 18px;
    --header-height: 60px;
  }

  /* ---- 全局 ---- */
  .grid-2,
  .grid-3,
  .grid-4 {
    grid-template-columns: 1fr;
  }

  .section {
    padding: var(--space-section) 0;
  }

  .section-title {
    margin-bottom: var(--space-8);
  }

  .section-title h2 {
    font-size: var(--font-size-3xl);
  }

  /* 页面横幅 */
  .page-banner {
    height: 200px;
  }

  .page-banner__title {
    font-size: var(--font-size-3xl);
  }

  .page-banner__subtitle {
    font-size: var(--font-size-base);
  }

  /* ---- 头部 ---- */
  .header-topbar {
    display: none;
  }

  .header-main {
    height: var(--header-height);
  }

  .header-nav {
    display: none;
  }

  .header-actions .header-search-btn {
    display: none;
  }

  .hamburger {
    display: flex;
  }

  .mobile-nav {
    display: block;
  }

  .header-logo__name {
    font-size: var(--font-size-lg);
  }

  .header-logo__slogan {
    display: none;
  }

  .header-logo__img {
    height: 36px;
  }

  .header-placeholder {
    height: var(--header-height);
  }

  .site-header.header-sticky .header-main {
    height: 56px;
  }

  .site-header.header-sticky .header-logo__img {
    height: 32px;
  }

  /* ---- 轮播 ---- */
  .hero-carousel {
    height: 300px;
  }

  .hero-carousel__title {
    font-size: var(--font-size-3xl);
  }

  .hero-carousel__desc {
    font-size: var(--font-size-base);
    margin-bottom: var(--space-5);
  }

  .hero-carousel__tag {
    font-size: var(--font-size-xs);
    margin-bottom: var(--space-3);
  }

  .hero-carousel__actions {
    flex-direction: column;
    gap: var(--space-2);
  }

  .hero-carousel__actions .btn {
    width: 100%;
  }

  .hero-carousel__arrow {
    width: 36px;
    height: 36px;
    font-size: var(--font-size-base);
  }

  .hero-carousel__arrow--prev {
    left: var(--space-3);
  }

  .hero-carousel__arrow--next {
    right: var(--space-3);
  }

  /* ---- 快捷服务 ---- */
  .quick-services {
    margin-top: -24px;
    padding: var(--space-6) 0;
  }

  .quick-services .container {
    padding: var(--space-5) var(--space-4);
  }

  .quick-services__grid {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-2);
  }

  .quick-services__icon {
    width: 44px;
    height: 44px;
  }

  .quick-services__icon i {
    font-size: 20px;
  }

  .quick-services__name {
    font-size: var(--font-size-xs);
  }

  .quick-services__desc {
    display: none;
  }

  /* ---- 医院简介 ---- */
  .hospital-intro__wrapper {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }

  .hospital-intro__image img {
    height: 240px;
  }

  .hospital-intro__features {
    grid-template-columns: 1fr;
  }

  .hospital-intro__stat-number {
    font-size: var(--font-size-xl);
  }

  /* ---- 科室网格 ---- */
  .dept-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-4);
  }

  .dept-list-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-4);
  }

  .department-card {
    padding: var(--space-5) var(--space-3);
  }

  .department-card__icon {
    width: 48px;
    height: 48px;
  }

  .department-card__name {
    font-size: var(--font-size-md);
  }

  .department-card__brief {
    display: none;
  }

  /* ---- 专家团队 ---- */
  .expert-section__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-4);
  }

  .doctor-card {
    padding: var(--space-6) var(--space-4) var(--space-4);
  }

  .doctor-card__photo {
    width: 80px;
    height: 80px;
  }

  .doctor-card__name {
    font-size: var(--font-size-lg);
  }

  .doctor-card__actions {
    flex-direction: column;
  }

  /* ---- 设备展示 ---- */
  .equipment-showcase__grid {
    grid-template-columns: 1fr;
  }

  .equipment-showcase__featured {
    grid-column: span 1;
    grid-template-columns: 1fr;
  }

  .equipment-showcase__featured-image {
    min-height: 200px;
  }

  .equipment-showcase__featured-body {
    padding: var(--space-5);
  }

  .equipment-list-grid {
    grid-template-columns: 1fr;
  }

  .eq-card__img {
    aspect-ratio: 3 / 2;
  }

  .equipment-list-item {
    flex-direction: column;
  }

  .equipment-list-item__image {
    width: 100%;
    min-width: auto;
    height: 200px;
  }

  /* ---- 荣誉 ---- */
  .honors-stats {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-3);
  }

  .honors-stats__number {
    font-size: var(--font-size-4xl);
  }

  .honors-gallery__item {
    min-width: 160px;
  }

  .honors-gallery__image {
    width: 160px;
    height: 210px;
  }

  /* ---- 新闻 ---- */
  .home-news__wrapper {
    grid-template-columns: 1fr;
  }

  .news-card {
    flex-direction: column;
  }

  .news-card__thumbnail {
    width: 100%;
    min-width: auto;
    height: 180px;
  }

  .news-list-wrapper {
    grid-template-columns: 1fr;
  }

  .news-sidebar {
    position: static;
  }

  .news-featured__image {
    height: 220px;
  }

  .news-detail-wrapper {
    grid-template-columns: 1fr;
  }

  .news-article__title {
    font-size: var(--font-size-3xl);
  }

  .news-article__nav {
    grid-template-columns: 1fr;
  }

  .related-articles__grid {
    grid-template-columns: 1fr;
  }

  /* ---- 就医指南 (首页) ---- */
  .home-guide__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-4);
  }

  .home-guide__icon {
    width: 48px;
    height: 48px;
  }

  .home-guide__name {
    font-size: var(--font-size-md);
  }

  .home-guide__desc {
    display: none;
  }

  /* ---- CTA ---- */
  .home-cta__title {
    font-size: var(--font-size-3xl);
  }

  .home-cta__desc {
    font-size: var(--font-size-base);
  }

  .home-cta__actions {
    flex-direction: column;
    align-items: center;
    gap: var(--space-3);
  }

  /* ---- 医生列表 ---- */
  .doctor-filter__row {
    flex-direction: column;
    gap: var(--space-2);
  }

  .doctor-filter__label {
    min-width: auto;
    padding-top: 0;
  }

  .doctor-list-grid {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }

  .doctor-list-grid--list {
    grid-template-columns: 1fr;
  }

  .doctor-list-card__photo {
    aspect-ratio: 4 / 3;
  }

  .doctor-toolbar {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-3);
  }

  /* ---- 医生详情 ---- */
  .doctor-profile__wrapper {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }

  .doctor-profile__sidebar {
    position: static;
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: var(--space-5);
    align-items: start;
  }

  .doctor-profile__photo {
    aspect-ratio: auto;
    height: 240px;
  }

  .doctor-profile__name {
    font-size: var(--font-size-3xl);
  }

  .related-doctors__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .doctor-schedule {
    display: block;
    overflow-x: auto;
  }

  /* ---- 科室详情 ---- */
  .dept-banner {
    height: 240px;
  }

  .dept-banner__title {
    font-size: var(--font-size-4xl);
  }

  .dept-banner__icon {
    width: 56px;
    height: 56px;
  }

  .dept-tabs .container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .dept-tabs .container::-webkit-scrollbar {
    display: none;
  }

  .dept-intro__wrapper {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }

  .dept-treatments__grid {
    grid-template-columns: 1fr;
  }

  .dept-tech__grid {
    grid-template-columns: 1fr;
  }

  .dept-tech-card {
    flex-direction: column;
  }

  .dept-tech-card__image {
    width: 100%;
    min-width: auto;
    height: 200px;
  }

  .dept-tech-card__image img {
    min-height: auto;
  }

  .dept-doctors__grid .doctor-card {
    width: calc((100% - var(--space-6)) / 2);
  }

  .dept-equipment__grid {
    grid-template-columns: 1fr;
  }

  .dept-cta__title {
    font-size: var(--font-size-3xl);
  }

  .dept-cta__actions {
    flex-direction: column;
    align-items: center;
  }

  /* ---- 设备详情 ---- */
  .equipment-hero__wrapper {
    grid-template-columns: 1fr;
  }

  .equipment-hero__main-image {
    height: 280px;
  }

  .equipment-hero__specs {
    grid-template-columns: 1fr;
  }

  .equipment-hero__actions {
    flex-direction: column;
  }

  .equipment-hero__actions .btn {
    width: 100%;
  }

  .equipment-detail__wrapper {
    grid-template-columns: 1fr;
  }

  .equipment-detail__sidebar {
    position: static;
  }

  .equipment-features {
    grid-template-columns: 1fr;
  }

  .related-equipment__grid {
    grid-template-columns: 1fr;
  }

  /* ---- 就医指南页 ---- */
  .guide-page__wrapper {
    grid-template-columns: 1fr;
  }

  .guide-sidebar-nav {
    position: static;
    margin-bottom: var(--space-6);
  }

  .guide-sidebar-nav__list {
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: var(--space-1);
    scrollbar-width: none;
  }

  .guide-sidebar-nav__list::-webkit-scrollbar {
    display: none;
  }

  .guide-sidebar-nav__link {
    white-space: nowrap;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
  }

  .guide-steps {
    padding-left: var(--space-8);
  }

  .guide-steps::before {
    left: 16px;
  }

  .guide-step__number {
    width: 32px;
    height: 32px;
    font-size: var(--font-size-base);
    left: calc(-1 * var(--space-8) - 1px);
  }

  .guide-steps-horizontal {
    flex-direction: column;
    align-items: center;
    gap: var(--space-4);
  }

  .guide-step-h {
    flex: none;
    width: 100%;
    display: flex;
    align-items: center;
    text-align: left;
    gap: var(--space-4);
  }

  .guide-step-h__circle {
    margin: 0;
    width: 48px;
    height: 48px;
    min-width: 48px;
    font-size: var(--font-size-lg);
  }

  .appointment-form {
    padding: var(--space-6);
  }

  .appointment-form__grid {
    grid-template-columns: 1fr;
  }

  .appointment-form__grid .form-group--full {
    grid-column: span 1;
  }

  .insurance-cards {
    grid-template-columns: 1fr;
  }

  .guide-map__info-grid {
    grid-template-columns: 1fr;
  }

  .transport-cards {
    grid-template-columns: 1fr;
  }

  /* ---- 页脚 ---- */
  .footer-main {
    padding: var(--space-10) 0 var(--space-8);
  }

  .footer-grid {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }

  .footer-qrcode {
    justify-content: center;
  }

  .footer-bottom .container {
    flex-direction: column;
    text-align: center;
  }

  .footer-bottom__left {
    justify-content: center;
  }

  .footer-bottom__right {
    justify-content: center;
  }

  /* ---- 浮动侧栏 -> 隐藏桌面版 ---- */
  .floating-sidebar {
    display: none;
  }

  .back-to-top {
    bottom: 72px;
    right: 16px;
  }

  /* ---- 移动端底部栏 -> 显示 ---- */
  .mobile-bottom-bar {
    display: block;
  }

  /* 为底部栏留出空间 */
  body {
    padding-bottom: 56px;
  }

  /* ---- 弹窗 ---- */
  .modal {
    width: 94%;
    max-width: none;
    margin: var(--space-4);
    border-radius: var(--radius-lg);
  }

  .modal__body {
    padding: var(--space-4);
  }

  /* ---- 触摸友好: 确保最小 44px 触摸目标 ---- */
  .btn,
  .tag,
  .pagination__item,
  .form-control,
  select.form-control,
  .breadcrumb-item a,
  .footer-links__link,
  .header-appointment-btn,
  .dept-tabs__item,
  .faq-item__header,
  .news-categories__item,
  .doctor-filter__option,
  .equipment-filter__option {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  /* ---- 按钮 ---- */
  .btn-sm {
    min-height: 44px;
    padding: 10px 16px;
  }

  /* ---- 公告栏 ---- */
  .notice-bar__label span {
    display: none;
  }
}

/* ============================================
   小屏幕手机 (max-width: 480px)
   ============================================ */
@media screen and (max-width: 480px) {
  :root {
    --font-size-hero: 24px;
    --font-size-6xl: 24px;
    --font-size-5xl: 20px;
    --font-size-4xl: 18px;
    --font-size-3xl: 17px;
    --space-section: 40px;
  }

  .hero-carousel {
    height: 240px;
  }

  .hero-carousel__title {
    font-size: var(--font-size-2xl);
  }

  .hero-carousel__desc {
    font-size: var(--font-size-sm);
    display: none;
  }

  .hero-carousel__arrow {
    display: none;
  }

  .quick-services__grid {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-1);
  }

  .quick-services__item {
    padding: var(--space-3) var(--space-1);
  }

  .quick-services__icon {
    width: 40px;
    height: 40px;
    margin-bottom: var(--space-2);
  }

  .quick-services__icon i {
    font-size: 18px;
  }

  .quick-services__name {
    font-size: 11px;
  }

  .dept-grid {
    gap: var(--space-3);
  }

  .expert-section__grid {
    gap: var(--space-3);
  }

  .doctor-list-grid {
    grid-template-columns: 1fr;
  }

  .doctor-profile__sidebar {
    grid-template-columns: 1fr;
  }

  .doctor-profile__photo {
    max-width: 200px;
    margin: 0 auto;
  }

  .home-guide__grid {
    gap: var(--space-3);
  }

  .home-guide__item {
    padding: var(--space-5) var(--space-3);
  }

  .honors-stats__item {
    padding: var(--space-4);
  }

  .honors-stats__number {
    font-size: var(--font-size-3xl);
  }

  .dept-banner {
    height: 200px;
  }

  .dept-banner__title {
    font-size: var(--font-size-3xl);
  }

  .dept-banner__icon {
    width: 48px;
    height: 48px;
  }

  .dept-banner__icon i {
    font-size: 24px;
  }

  .dept-doctors__grid .doctor-card {
    width: 100%;
  }

  .equipment-hero__main-image {
    height: 220px;
  }

  .equipment-hero__thumbnails {
    flex-wrap: wrap;
  }

  .equipment-hero__thumb {
    width: 60px;
    height: 60px;
  }

  .guide-step {
    padding: var(--space-4);
  }

  .faq-item__header {
    padding: var(--space-4);
  }

  .faq-item__answer {
    padding-left: var(--space-4);
  }

  .faq-item__question::before {
    width: 24px;
    height: 24px;
    font-size: var(--font-size-xs);
  }

  .appointment-form {
    padding: var(--space-4);
  }

  .news-article__content h2 {
    font-size: var(--font-size-2xl);
  }

  .news-article__meta {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2);
  }

  .footer-col__title {
    font-size: var(--font-size-lg);
  }
}

/* ============================================
   横屏 (landscape) 手机调整
   ============================================ */
@media screen and (max-width: 768px) and (orientation: landscape) {
  .hero-carousel {
    height: 260px;
  }

  .page-banner {
    height: 160px;
  }

  .dept-banner {
    height: 180px;
  }
}

/* ============================================
   打印样式
   ============================================ */
@media print {
  .site-header,
  .site-footer,
  .floating-sidebar,
  .mobile-bottom-bar,
  .back-to-top,
  .header-search,
  .btn-appointment,
  .header-appointment-btn,
  .dept-cta,
  .home-cta {
    display: none !important;
  }

  body {
    background: var(--white);
    color: var(--black);
    font-size: 12pt;
    padding: 0;
  }

  .container {
    max-width: 100%;
    padding: 0;
  }

  .section {
    padding: 20px 0;
  }

  a {
    color: var(--black);
    text-decoration: underline;
  }

  .card,
  .news-card,
  .doctor-card,
  .equipment-card,
  .department-card {
    box-shadow: none;
    border: 1px solid #ddd;
    break-inside: avoid;
  }

  img {
    max-width: 100% !important;
  }
}

/* ============================================
   高对比度 / 减少动画偏好
   ============================================ */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .hero-carousel__slide {
    transition: none;
  }
}

@media (prefers-contrast: high) {
  :root {
    --text-primary: #000000;
    --text-secondary: #333333;
    --text-muted: #555555;
    --border-color: #999999;
    --shadow-card: none;
    --shadow-card-hover: 0 0 0 2px var(--primary-blue);
  }
}
