/* A single compact navigation pattern across CUPEC. */
.menu-toggle { display: none; }
@media (max-width: 767px), (max-width: 960px) and (max-height: 500px) and (pointer: coarse) {
  .navigation-shell {
    position: sticky; top: 0; z-index: 30; width: 100%; max-width: none;
    margin: 0; padding: 12px 5%; min-height: 72px;
    display: flex; flex-wrap: wrap; flex-direction: row; align-items: center;
    justify-content: space-between; gap: 0;
    background: rgba(255,255,255,.97); border: 0; border-bottom: 1px solid #e6e6e0;
    -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  }
  .navigation-shell .brand, .navigation-shell .club-brand { margin: 0; gap: 10px; font-size: 21px; }
  .navigation-shell .brand img, .navigation-shell .club-brand img, .event-header img { width: 42px; height: 42px; object-fit: contain; }
  .navigation-shell .brand small { font-size: 7px; letter-spacing: .08em; }
  .navigation-shell .club-brand small { font-size: 9px; }
  .menu-toggle {
    display: flex; flex-direction: column; justify-content: center; align-items: center;
    gap: 6px; width: 48px; height: 48px; padding: 10px; margin-left: auto;
    border: 0; border-radius: 50%; background: transparent; color: #252525; cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .menu-toggle span { display: block; width: 23px; height: 1.5px; background: currentColor; transition: transform .2s ease; }
  .menu-open .menu-toggle span:first-child { transform: translateY(3.75px) rotate(45deg); }
  .menu-open .menu-toggle span:last-child { transform: translateY(-3.75px) rotate(-45deg); }
  .navigation-shell nav {
    display: none; width: 100%; margin: 0; padding: 12px 0 8px; overflow: visible;
    flex-direction: column; align-items: stretch; gap: 0; font-size: 16px;
  }
  .navigation-shell.menu-open nav { display: flex; animation: menu-reveal .18s ease-out; }
  .navigation-shell nav a, .navigation-shell nav a:first-child, .navigation-shell nav a:nth-child(2) {
    display: flex; align-items: center; gap: 12px; min-height: 52px;
    padding: 13px 4px; border: 0; border-top: 1px solid #e8e8e3;
    background: transparent; color: #252525 !important; font-size: 16px;
    font-weight: normal; text-decoration: none; white-space: normal; line-height: 1.4;
  }
  .navigation-shell nav a[aria-current="page"] { font-weight: bold; text-decoration: none; }
  .navigation-shell nav a span { display: none; }
  .challenge-sidebar > .eyebrow, .challenge-sidebar > .sidebar-bottom { display: none; }
  .challenge-site main { width: 100%; margin-left: 0; padding: 0 5%; }
  .challenge-site footer { width: 90%; margin: 28px 5%; }
  @keyframes menu-reveal { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: translateY(0); } }
}
@media (max-width: 620px) {
  body, .entry-page { font-size: 15px; line-height: 1.65; }
  main, .event-overview, .entry-layout { width: auto; margin-left: 6%; margin-right: 6%; }
  .home-hero { padding: 34px 0 38px; gap: 34px; }
  h1, .entry-page h1, .challenge-site h1 { font-size: clamp(38px, 10.5vw, 54px); line-height: 1.08; letter-spacing: -.045em; overflow-wrap: break-word; }
  h2, .entry-page h2 { font-size: clamp(28px, 8vw, 36px); line-height: 1.15; }
  h3 { font-size: 27px; line-height: 1.18; }
  .eyebrow, .entry-page .eyebrow { font-size: 9px; line-height: 1.6; letter-spacing: .09em; margin-bottom: 18px; }
  .lede, .entry-page .lead, .intro { font-size: 16px; line-height: 1.7; margin: 22px 0 25px; }
  .actions, .hero-actions { align-items: stretch; flex-direction: column; gap: 14px; font-size: 14px; }
  .actions > a, .hero-actions > a { min-height: 46px; display: flex; align-items: center; justify-content: center; text-align: center; }
  .button, .entry-button, .passcode-card button { min-height: 48px; padding: 13px 20px; font-size: 14px; border-radius: 4px; text-align: center; }
  .upcoming-poster-only { padding-top: 25px; }
  .upcoming-poster-only .upcoming-poster { max-width: 100%; }
  .upcoming-poster-only .upcoming-poster img { max-height: none; }
  .upcoming-poster-only .upcoming-link { flex-direction: column; gap: 3px; font-size: 14px; margin-top: 14px; }
  .upcoming-poster-only .upcoming-link span { font-size: 12px; }
  .up-next { padding: 22px 0; gap: 18px; }
  .up-next a { grid-template-columns: 55px minmax(0,1fr); }
  .section-heading { margin: 42px 0 22px; }
  .section-heading p:not(.eyebrow) { font-size: 14px; }
  .text-card { padding: 24px 0; }
  .text-card > span { margin-bottom: 14px; font-size: 9px; }
  .text-card p { font-size: 14px; line-height: 1.7; }
  .text-card b { font-size: 13px; }
  .media-grid { gap: 25px; }
  .media-card .cover { height: auto; aspect-ratio: 4 / 5; padding: 12px; }
  .media-card h3 { font-size: 27px; }
  .media-card span { font-size: 9px; line-height: 1.7; }
  .page-heading { padding: 34px 0 25px; }
  .event-list > a { grid-template-columns: 48px minmax(0,1fr); gap: 15px; padding: 26px 0; }
  .event-list h3 { font-size: 26px; }
  .event-list .tag { font-size: 9px; letter-spacing: .06em; line-height: 1.6; }
  .date { font-size: 36px; }
  .date small { font-size: 8px; line-height: 1.5; }
  .event-poster-thumbs { gap: 8px; }
  .event-poster-thumbs img { width: calc(50% - 4px); height: auto; align-self: start; }
  .past-event, .project-feature, .callout { padding: 24px; gap: 24px; }
  .past-event h3 { font-size: 34px; }
  .event-detail { padding-top: 24px; }
  .project-number { font-size: 84px; }
  input, select, textarea { min-width: 0; max-width: 100%; font-size: 16px; border-radius: 4px; min-height: 48px; }
  .join-grid article { padding: 25px; }
  footer { margin-top: 48px; padding: 30px 6%; display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
  footer a { padding: 5px 0; }
  .jade-info h2 { font-size: 28px; }
  .jade-posters figcaption { gap: 15px; flex-wrap: wrap; }
  dialog { padding: 20px; border-radius: 8px; width: calc(100vw - 20px); max-height: 92dvh; }
  .reader-controls { gap: 8px; align-items: center; }
  .reader-controls button { min-height: 44px; }
  .reader-layout { gap: 26px; }
  #reader-caption { font-size: 14px; line-height: 1.7; }
  .event-header > a:last-child { max-width: 45%; font-size: 12px; text-align: right; }
  .event-hero, .entry-layout { padding-top: 34px; }
  .event-steps { gap: 24px; }
  .event-summary { display: grid; grid-template-columns: 65px minmax(0,1fr); gap: 0 16px; }
  .event-summary .large-number { font-size: 70px; }
  .event-summary > .eyebrow { align-self: center; margin: 0; }
  .event-summary > div, .event-summary dl { grid-column: 1 / -1; }
  .event-summary > div { margin-top: 22px; }
  .event-footer { display: flex; padding: 20px 0; }
  .passcode-card { padding: 24px; }
  .passcode-card h2 { font-size: 30px; }
  .entry-preview { gap: 10px; }
  .challenge-site main > section:not(.hero) { padding: 34px 0; }
  .challenge-site .hero { padding: 34px 0; }
  .challenge-site .hero-aside { gap: 16px; }
  .challenge-site .big-ten { font-size: 84px; }
  .challenge-site .steps { display: flex; overflow-x: auto; gap: 16px; padding-bottom: 8px; }
  .challenge-site .steps button { flex: 0 0 100px; min-height: 48px; }
  .challenge-site .workspace { grid-template-columns: minmax(0, 1fr); }
  .challenge-site .workspace > aside { padding: 20px; min-width: 0; }
  .challenge-site .draft-tools { flex-wrap: wrap; }
  .challenge-site #proposal-form { padding: 20px; }
  .challenge-site .draft-dashboard { padding: 18px 20px; }
  .challenge-site .company-links { flex-wrap: wrap; gap: 14px; }
  .challenge-site .company-links button { margin-left: 0; min-height: 44px; }
  .challenge-site .toolbar { align-items: stretch; }
  .challenge-site .metrics { gap: 20px; }
  .challenge-site .metrics strong { font-size: 25px; }
  .challenge-site .table-wrap { max-width: 100%; overscroll-behavior-x: contain; }
  .challenge-site footer { display: flex; padding: 0; gap: 15px; flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  .menu-toggle span, .navigation-shell.menu-open nav { transition: none; animation: none; }
}

/* Width profiles cover mini, standard/Pro and Plus/Pro Max CSS viewports.
   Fluid gutters also accommodate Display Zoom and intermediate widths. */
@media (max-width: 767px), (max-width: 960px) and (max-height: 500px) and (pointer: coarse) {
  .mobile-decoration { display: none !important; }
  .navigation-shell { padding-top: max(10px, env(safe-area-inset-top)); padding-left: max(6%, env(safe-area-inset-left)); padding-right: max(6%, env(safe-area-inset-right)); }
}
@media (max-width: 380px) {
  .home-hero h1 { font-size: 38px; }
  .entry-page h1, .challenge-site h1 { font-size: 38px; }
  .navigation-shell .club-brand small { max-width: 155px; }
}
@media (min-width: 381px) and (max-width: 409px) {
  .home-hero h1 { font-size: 41px; }
}
@media (min-width: 410px) and (max-width: 449px) {
  .home-hero h1 { font-size: 45px; }
}
@media (max-width: 960px) and (max-height: 500px) and (pointer: coarse) {
  .navigation-shell { position: relative; }
  .navigation-shell.menu-open nav { max-height: 65dvh; overflow-y: auto; }
}
@media print { .menu-toggle { display: none !important; } }