/* Mobile UX layer: loaded after the legacy public and admin styles. */
:root { --tap-size: 44px; }
html { -webkit-text-size-adjust: 100%; }
body { overflow-x: hidden; overflow-x: clip; }
body.has-mobile-nav { overflow: hidden; }
a, button, input, select, textarea { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid rgba(0,117,53,.38); outline-offset: 3px; }
.skip-link { position: fixed; left: 16px; top: -64px; z-index: 200; padding: 12px 16px; border-radius: 10px; background: #04301c; color: #fff; font: 600 14px/1 'Outfit', sans-serif; transition: top .18s ease; }
.skip-link:focus { top: 16px; color: #fff; }

/* Public site */
.mobile-collab-cta { display: none; }
.hamburger { min-width: var(--tap-size); min-height: var(--tap-size); border-radius: 10px; align-items: center; justify-content: center; }
.hamburger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.hamburger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.mobile-nav { max-height: calc(100dvh - 78px); overflow-y: auto; padding-bottom: max(24px, env(safe-area-inset-bottom)); }
.mobile-nav a { min-height: var(--tap-size); display: flex; align-items: center; }
.collab-modal__close { min-width: var(--tap-size); min-height: var(--tap-size); }
.collab-modal__body .collab-modal__title { padding-right: 48px; }
.collab-modal__submit:disabled { opacity: .72; cursor: wait; }

/* Admin */
.admin-bottom-nav { display: none; }
.admin-dashboard__intro { display:flex; justify-content:space-between; gap:16px; align-items:flex-end; margin-bottom:18px; }
.admin-dashboard__intro h2 { margin:0; font:600 24px/1.08 'Bricolage Grotesque', serif; letter-spacing:-.025em; }
.admin-dashboard__intro p { margin:7px 0 0; max-width:55ch; color:var(--muted); font:400 13px/1.5 'Outfit',sans-serif; }
.admin-dashboard__actions { display:flex; gap:8px; flex-wrap:wrap; }
.recent-articles .table-wrap { border:0; box-shadow:none; }

@media (max-width: 767px) {
  body { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  .site-header { position: sticky; }
  .site-header__inner { min-height: 68px; padding-left: 16px; padding-right: 16px; }
  .brand { gap:9px; min-width:0; }
  .brand img { width:32px; height:32px; }
  .brand__text { font-size:13px; white-space:nowrap; }
  .mobile-nav { inset:68px 0 auto; gap:4px; padding:12px 16px 20px; box-shadow:0 18px 36px rgba(4,48,28,.14); }
  .mobile-nav a { padding:11px 10px; font-size:13px; letter-spacing:.05em; border-bottom:1px solid rgba(13,31,22,.07); }
  .mobile-nav a:last-child { border:0; margin-top:8px; justify-content:center; }
  .hero { padding:34px 20px 42px; }
  .hero__grid { gap:32px; }
  .hero__eyebrow { margin-bottom:18px; }
  .hero h1 { font-size:clamp(38px,11vw,50px); max-width:12ch; text-wrap:balance; }
  .hero__desc { margin-top:20px; font-size:16px; line-height:1.62; }
  .hero__actions { margin-top:28px; display:grid; grid-template-columns:1fr; gap:10px; }
  .hero__actions .btn { justify-content:center; min-height:50px; padding:15px 20px; }
  .hero__meta { margin-top:30px; padding-top:18px; display:grid; gap:6px; }
  .hero__visual { margin:0 auto; width:min(100%, 360px); }
  .hero__photo { max-width:310px; }
  .hero__card { bottom:12px; left:0; padding:12px 14px; }
  .section { padding-top:56px; padding-bottom:60px; }
  .h2 { margin-top:16px; font-size:clamp(29px,8.5vw,38px); text-wrap:balance; }
  .lead { margin-top:14px; font-size:16px; }
  .split { gap:24px; }
  .split__quote { margin-top:28px; padding:22px 20px; }
  .split__quote blockquote { font-size:20px; }
  .founder-tags { margin-top:24px; }
  .founder-tags div { padding:13px 14px; font-size:13px; }
  .news-grid, .values-grid, .focus-grid, .programs-grid { margin-top:32px; }
  .news-featured { min-height:360px; border-radius:16px; }
  .news-featured__content { padding:24px 20px; }
  .news-list a { grid-template-columns:72px 1fr; gap:12px; padding:14px; }
  .news-list img { width:72px; height:72px; }
  .news-list h4 { font-size:14px; }
  .timeline { margin-top:38px; }
  .timeline__row { grid-template-columns:42px 1fr; }
  .timeline__content { padding:0 0 32px 4px; }
  .timeline__content p { font-size:15px; }
  .values-card, .program-card, .program-dashed { min-height:0; padding:28px 22px; }
  .focus-card { padding:26px 22px; }
  .philosophy, .quote-section, .cta-section { padding:70px 20px; }
  .philosophy h2 { font-size:clamp(34px,10vw,44px); }
  .philosophy p, .cta-inner p { font-size:16px; }
  .philosophy__pills span { padding:11px 16px; }
  .gallery-slider { margin-top:30px; }
  .gallery-slider__viewport { gap:10px; }
  .gallery-slider__controls { margin-top:14px; gap:10px; }
  .insight-cats { flex-wrap:nowrap; overflow-x:auto; margin:30px -20px 0; padding:0 20px 5px; scrollbar-width:none; }
  .insight-cat { flex:0 0 auto; min-height:var(--tap-size); padding:11px 15px; }
  .insight-list { margin-top:26px; }
  .insight-row { padding:20px 4px; }
  .insight-row__title { font-size:19px; }
  .article-page { padding:22px 20px 48px; }
  .article-title { font-size:clamp(30px,9vw,38px); text-wrap:balance; }
  .article-excerpt { font-size:17px; padding-left:15px; }
  .article-body { font-size:16px; line-height:1.76; overflow-wrap:break-word; }
  .article-body img, .article-body iframe, .article-body video { max-width:100%; height:auto; }
  .article-body pre { max-width:100%; overflow-x:auto; }
  .article-body table { display:block; max-width:100%; overflow-x:auto; }
  .article-cover { margin-top:24px; border-radius:14px; }
  .archive-header { padding-top:44px; padding-bottom:32px; }
  .archive-grid { padding:28px 20px 40px; gap:16px; }
  .footer-bottom { margin-top:36px; padding-top:20px; }
  .footer-col a { min-height:var(--tap-size); display:flex; align-items:center; }
  .mobile-collab-cta { display:inline-flex; position:fixed; right:16px; bottom:max(14px, env(safe-area-inset-bottom)); z-index:45; min-height:48px; align-items:center; justify-content:center; gap:8px; padding:0 18px; border:0; border-radius:999px; color:#fff; background:#007535; box-shadow:0 10px 26px rgba(4,48,28,.26); font:600 14px/1 'Outfit',sans-serif; }
  .collab-modal.open ~ .mobile-collab-cta,
  body.has-mobile-nav .mobile-collab-cta { display:none; }
  .mobile-nav__overlay { display:none; }
  .mobile-nav__overlay.open { display:block; position:fixed; inset:68px 0 0; background:rgba(4,48,28,.4); backdrop-filter:blur(2px); z-index:48; }
  .sticky-actions { bottom:calc(68px + env(safe-area-inset-bottom)); z-index:30; }
  .collab-modal__body, .collab-modal__success { padding:28px 20px 24px; max-height:88dvh; }

  /* Admin switches from a desktop sidebar to a thumb-friendly task bar. */
  .admin-layout { min-height:100dvh; }
  .admin-layout .topbar { padding:12px 16px; min-height:64px; }
  .admin-layout .content { padding:16px 16px 96px; }
  .admin-layout .topbar__eyebrow { font-size:9px; }
  .admin-layout .topbar h1 { font-size:17px; }
  .admin-dashboard__intro { display:block; margin-bottom:16px; }
  .admin-dashboard__intro h2 { font-size:22px; }
  .admin-dashboard__actions { margin-top:14px; display:grid; grid-template-columns:1fr 1fr; }
  .admin-dashboard__actions .btn { min-height:44px; padding:10px; }
  .admin-layout .stats-grid { grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; }
  .admin-layout .stat { padding:14px; border-radius:14px; }
  .admin-layout .stat__value { font-size:24px; }
  .admin-layout .stat:last-child { grid-column:1 / -1; display:flex; align-items:baseline; justify-content:space-between; }
  .admin-layout .card { padding:16px; border-radius:14px; }
  .recent-articles .table-wrap { overflow:visible; background:transparent; }
  .recent-articles table, .recent-articles tbody, .recent-articles tr, .recent-articles td { display:block; width:100%; min-width:0; }
  .recent-articles thead { display:none; }
  .recent-articles tr { padding:14px 0; border-bottom:1px solid var(--border); }
  .recent-articles tr:last-child { border-bottom:0; padding-bottom:0; }
  .recent-articles td { border:0; padding:0; max-width:none !important; white-space:normal !important; overflow:visible !important; text-overflow:clip !important; }
  .recent-articles td:first-child { margin-bottom:8px; font:600 15px/1.42 'Outfit',sans-serif; }
  .recent-articles td:not(:first-child) { display:inline-flex; width:auto; align-items:center; gap:5px; margin:3px 12px 0 0; color:var(--muted); font-size:12px; }
  .recent-articles td[data-label]::before { content:attr(data-label) ': '; color:var(--muted-2); }
  .admin-bottom-nav { position:fixed; inset:auto 0 0; z-index:35; display:grid; grid-template-columns:repeat(4, 1fr); padding:8px max(12px, env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); background:rgba(255,255,255,.96); backdrop-filter:blur(14px); border-top:1px solid var(--border); }
  .admin-bottom-nav.admin-bottom-nav--5 { grid-template-columns:repeat(5, 1fr); }
  .admin-bottom-nav a { min-height:52px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; color:var(--muted); font:600 10px/1 'Outfit',sans-serif; }
  .admin-bottom-nav a.active { color:var(--primary); }
  .admin-bottom-nav svg { width:19px; height:19px; }
}

/* Narrow phones: keep the brand from shoving the hamburger off-screen. */
@media (max-width: 360px) {
  .site-header__inner { gap:10px; }
  .brand__text { display:block; max-width:52vw; overflow:hidden; text-overflow:ellipsis; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; animation-duration:.01ms !important; transition-duration:.01ms !important; }
}
