/* =========================================================
   Global responsive base (loaded LAST)
   Goal: stable layout across mobile/tablet/desktop
   ========================================================= */

:root{
  --container-max: 1320px;
  --gutter: clamp(16px, 4vw, 28px);
  --nav-offset: 90px;

  --text-1: clamp(0.95rem, 0.55vw + 0.82rem, 1.05rem);
  --text-2: clamp(1.05rem, 0.75vw + 0.86rem, 1.18rem);
  --h1: clamp(2.1rem, 2.6vw + 1.2rem, 3.8rem);
  --h2: clamp(1.7rem, 1.9vw + 1.05rem, 2.8rem);
  --h3: clamp(1.25rem, 1.25vw + 0.9rem, 1.8rem);
}

html{ text-size-adjust: 100%; }
*,*::before,*::after{ box-sizing: border-box; }

body{
  min-width: 320px;
  overflow-x: clip;
}

img, video, canvas, svg{
  max-width: 100%;
  height: auto;
}

/* Some sections use absolute decorations; avoid accidental horizontal scrollbars */
.container, section, nav, footer{
  max-width: 100%;
}

/* Unify container behavior (some theme files override it) */
.container{
  width: min(100%, var(--container-max)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--gutter) !important;
  padding-right: var(--gutter) !important;
}

/* Headings: keep beautiful on desktop, safe on mobile */
.hero-main-title{ font-size: var(--h1) !important; }
.gen-title-simple{ font-size: var(--h2) !important; }
.page-title{ font-size: clamp(2.2rem, 4.2vw + 0.9rem, 4rem) !important; }
.section-title-tech{ font-size: var(--h2) !important; }

/* Paragraphs: keep readable; avoid too-wide lines on big screens */
p{ max-width: 75ch; }
.hero-description, .page-description, .section-subtitle{ font-size: var(--text-2) !important; }

/* Fixed navbar: ensure content starts below it (override inline styles) */
.intro-section-new,
.training-section-new,
.direction-section-new,
.works-showcase-section,
.awards-section-new,
.projects-marquee-section,
.mechanism-section-new,
.members-detail-grid{
  padding-top: calc(var(--nav-offset, 90px) + 48px) !important;
}

/* Members pages sometimes set large fixed paddings inline */
.members-detail-grid{
  padding-left: 0 !important;
  padding-right: 0 !important;
  position: relative;
  overflow-x: clip;
}

.members-detail-grid > .container{
  position: relative;
  z-index: 1;
  max-width: 1320px;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Hero media blocks */
.premium-photo-frame img,
.member-image-box img,
.intro-main-image img{
  display: block;
}

/* Navbar: 平板/手机（含 iPad）使用折叠菜单，避免横向溢出裁切 */
@media (max-width: 1199.98px){
  .navbar-tech{
    padding: 0.85rem 0 !important;
  }

  .navbar-tech .container{
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0.5rem 0.75rem !important;
  }

  .navbar-tech .navbar-brand{
    flex: 1 1 auto;
    min-width: 0;
    max-width: calc(100% - 3.25rem);
    margin-right: 0 !important;
  }

  .brand-logo-wrapper{
    width: 40px !important;
    height: 40px !important;
    flex-shrink: 0;
  }

  .brand-logo-img{
    width: 32px !important;
    height: 32px !important;
  }

  .brand-text-wrapper{
    min-width: 0;
    overflow: hidden;
  }

  .brand-text-new{
    font-size: clamp(0.92rem, 2.8vw, 1.2rem) !important;
    letter-spacing: 0.04em !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .brand-tag{
    font-size: clamp(0.55rem, 1.6vw, 0.68rem) !important;
    letter-spacing: 0.12em !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .navbar-tech .navbar-toggler{
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-left: auto;
    border: 1px solid rgba(255, 255, 255, 0.45);
    padding: 0.35rem 0.55rem;
  }

  .navbar-tech .navbar-toggler-icon{
    width: 1.35rem;
    height: 1.35rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 0.95)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  }

  .navbar-tech.scrolled .navbar-toggler{
    border-color: rgba(255, 255, 255, 0.35);
  }

  .navbar-tech .navbar-collapse{
    flex-basis: 100%;
    width: 100%;
    margin-top: 0.35rem;
  }

  .navbar-tech .navbar-nav{
    width: 100%;
    border-radius: 18px !important;
    padding: 10px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 8px !important;
  }

  .navbar-tech .nav-link{
    font-size: 0.92rem !important;
    min-height: 36px !important;
    padding: 8px 12px !important;
    white-space: nowrap;
  }
}

/* 大屏：导航项过多时允许轻微换行，防止 1200px 边缘裁切 */
@media (min-width: 1200px) and (max-width: 1399.98px){
  .navbar-tech .container{
    flex-wrap: wrap;
    justify-content: center !important;
    row-gap: 0.5rem;
  }

  .navbar-tech .navbar-collapse{
    flex-basis: 100%;
    flex-grow: 1 !important;
    display: flex !important;
    justify-content: center;
  }

  .navbar-tech .navbar-nav{
    flex-wrap: wrap !important;
    justify-content: center !important;
    max-width: 100%;
  }

  .navbar-tech .nav-link{
    font-size: 0.95rem !important;
    padding: 8px 14px !important;
  }

  .brand-text-new{
    font-size: 1.25rem !important;
  }
}

/* Grid fallbacks: keep cards from becoming too narrow */
@media (max-width: 420px){
  .members-grid{
    grid-template-columns: 1fr !important;
  }
}

/* 作品弹窗：手机端确保列表区域可滚动可见 */
@media (max-width: 768px){
  .works-modal.active{
    display: flex !important;
  }

  #worksModal .works-modal-content{
    min-height: 0 !important;
  }

  #worksModal .works-modal-body-v2{
    flex: 1 1 0 !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }
}

/* Respect accessibility: reduce motion */
@media (prefers-reduced-motion: reduce){
  *{
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}