/* Readability theme: light "parchment" reading sections on all screen sizes
   (phones since 2026-10-03; desktop added by owner request).
   Loaded after each page's own styles.
   The photo banners at the top of pages, the menu bar and the red call-to-action
   band stay dark; the reading sections switch to dark text on warm parchment. */
@media all {
  body { background: #f4eee1; color: #241c13; }
  body::before { opacity: .12 !important; }

  /* Reading sections become light */
  .about, .arts, .contact, .bio-section, .teachers-nav, #gallery,
  section[style*="#0d0804"], .quote, blockquote.quote-section {
    background: #f4eee1 !important;
    --parchment: #241c13;
    --ink: #f4eee1;
    --gold: #85540f;
    --gold-light: #7a4a0c;
    color: #241c13;
  }
  section[style*="#0d0804"], .teachers-nav { background: #ece4d2 !important; }

  /* Body text: dark and solid */
  :is(.about, .arts, .contact, .bio-section, .teachers-nav, #gallery, section[style*="#0d0804"])
    :is(p, li, blockquote, label, figcaption, em, small, .pull, .art-desc, .fact span,
        .portrait-caption span, .form-note) {
    color: #33291d !important;
  }
  :is(.about, .arts, .contact, .bio-section, .teachers-nav, #gallery, section[style*="#0d0804"])
    :is(h1, h2, h3, h4, .section-title, .art-name, .fact strong) {
    color: #1c150d !important;
  }
  .bio-content h3, .art-num, .portrait-caption strong { color: #7a4a0c !important; }

  /* Small gold labels: darker and fully opaque so they can be read */
  .section-label, .eyebrow, .teachers-nav-label,
  :is(.about, .arts, .contact, .bio-section, section[style*="#0d0804"]) [style*="opacity:0.5"],
  :is(.about, .arts, .contact, .bio-section, section[style*="#0d0804"]) [style*="opacity:.5"] {
    opacity: 1 !important;
  }
  :is(.about, .arts, .contact, .bio-section, .teachers-nav, section[style*="#0d0804"])
    :is(.section-label, .eyebrow, .teachers-nav-label) {
    color: #85540f !important;
  }

  /* Lineage teacher cards on the homepage (inline dark backgrounds) */
  :is(.about, .arts, .contact, section, .bio-section) a[style*="#0d0804"],
  :is(.about, .arts, .contact, section, .bio-section) div[style*="#0d0804"] {
    background: #fffaf0 !important;
  }
  :is(.about, .arts, .contact, section, .bio-section) a[style*="#0d0804"] h3 { color: #1c150d !important; }
  :is(.about, .arts, .contact, section, .bio-section) a[style*="#0d0804"] p { color: #4a3a26 !important; }
  :is(.about, .arts, .contact, section, .bio-section) a[style*="#0d0804"] p:first-child { color: #85540f !important; }

  /* Filled red buttons keep white text */
  .btn-primary, button[type="submit"] { color: #fff !important; }

  /* Cards and fact boxes */
  .art-card, .fact, .portrait-frame, .post-card {
    background: #fffaf0 !important;
    border-color: rgba(133, 84, 15, .28) !important;
  }
  .facts-grid, .post-list { background: rgba(133, 84, 15, .2) !important; }
  .facts-grid { background: transparent !important; border: 0 !important; gap: 0 !important; }
  .facts-grid .fact { border: 1px solid rgba(133, 84, 15, .22) !important; margin: 0 -1px -1px 0; }
  .post-card h3 { color: #1c150d !important; }
  .post-card .post-meta { color: #85540f !important; }
  .post-card .post-more { color: #7a1a1a !important; }
  .teachers-nav-grid a { color: #4a3a26 !important; border-color: rgba(133, 84, 15, .35) !important; }
  .teachers-nav-grid a.current { color: #85540f !important; }
  :is(.about, .arts, .contact, .bio-section) a:not(.btn) { color: #85540f; }

  /* Outline buttons in light sections */
  :is(.about, .arts, .contact, .bio-section) .btn:not(.btn-light):not(.btn-primary),
  :is(.about, .arts, .contact) a[class*="btn"]:not(.btn-primary) {
    color: #7a1a1a !important; border-color: #7a1a1a !important;
  }

  /* Contact form fields */
  .field input, .field select, .field textarea {
    background: #fffdf8 !important; color: #241c13 !important;
    border-color: rgba(60, 45, 25, .35) !important;
  }
  .field input::placeholder, .field textarea::placeholder { color: #7b6c58 !important; }
  .field select option { color: #241c13; background: #fffdf8; }

  /* Dark areas that stay dark: make their text brighter */
  .hero-sub, .hero-tagline, .page-hero .subtitle { color: rgba(247, 243, 234, .92) !important; }
  .hero-eyebrow, .page-hero .eyebrow { color: #f2d488 !important; opacity: 1 !important; }
  .page-hero-photo, .page-hero-video { opacity: .32 !important; }
  nav { background: rgba(14, 10, 6, .96) !important; }
  footer { background: #1a140d; }
  footer p, .footer-links a, footer a { color: rgba(247, 243, 234, .82) !important; }

}

/* Slightly larger small text on phones */
@media (max-width: 760px) {
  .footer-links a, footer p { font-size: .68rem !important; }
  .section-label, .eyebrow { font-size: .72rem !important; }
  .teachers-nav-grid a { font-size: .7rem !important; }
}

/* ---------- Tap-to-open menu (phones) ---------- */
.menu-toggle { display: none; }
@media (max-width: 760px) {
  nav { padding: 1rem 1.25rem !important; }
  .menu-toggle {
    display: flex; flex-direction: column; justify-content: center; gap: 5px;
    width: 44px; height: 44px; margin: -6px -10px -6px 0; padding: 10px;
    background: none; border: 0; cursor: pointer; position: relative; z-index: 2;
  }
  .menu-toggle span { display: block; height: 2px; background: #f2d488; transition: transform .25s, opacity .25s; }
  nav.menu-open .menu-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  nav.menu-open .menu-toggle span:nth-child(2) { opacity: 0; }
  nav.menu-open .menu-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  nav.menu-open { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; transform: none !important; filter: none !important; }
  nav .nav-links { display: none !important; }
  nav.menu-open .nav-links {
    display: flex !important; flex-direction: column; gap: 0 !important;
    position: fixed; top: 64px; left: 0; right: 0; bottom: 0;
    overflow-y: auto; -webkit-overflow-scrolling: touch;
    background: #120d08; padding: .5rem 1.5rem 3rem; margin: 0; z-index: 150;
    border-top: 1px solid rgba(201,151,43,.3);
  }
  nav.menu-open .nav-links li { padding: 0 !important; margin: 0 !important; border-bottom: 1px solid rgba(201,151,43,.16); }
  nav.menu-open .nav-links > li > a {
    display: block; padding: 1rem 0; font-size: .82rem !important; letter-spacing: .2em;
    color: #f7f3ea !important;
  }
  nav.menu-open .nav-links li .dropdown {
    visibility: visible !important; opacity: 1 !important; pointer-events: auto !important;
    position: static !important; transform: none !important; background: none !important;
    border: 0 !important; min-width: 0 !important; padding: 0 0 .9rem .9rem !important;
  }
  nav.menu-open .nav-links .dropdown a {
    padding: .6rem 0 !important; font-size: .74rem !important; white-space: normal !important;
    color: rgba(247,243,234,.82) !important; border-left: 0 !important;
  }
  nav.menu-open .nav-links li.lang-item { border-bottom: 0; padding: 1.2rem 0 !important; }
  nav.menu-open .lang-select { font-size: 1rem; padding: .5rem .8rem; }
  body.menu-lock { overflow: hidden; }
}