/* ============================================================
   THEME PAGE STYLES
   ============================================================ */
.theme-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 6vw;
  background: rgba(253,250,245,.95);
  backdrop-filter: blur(16px);
  box-shadow: 0 1px 0 rgba(26,26,46,.08);
}
.theme-nav__back {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--f-ui); font-size: .82rem; font-weight: 500;
  color: var(--c-ink-60);
  transition: color .2s;
}
.theme-nav__back:hover { color: var(--c-sky); }
.theme-nav__back svg { width: 16px; height: 16px; }
.theme-nav__logo {
  font-family: 'Syne-Logo', var(--f-ui); font-size: 1.1rem; font-weight: 800;
  color: var(--c-ink);
}
.theme-nav__logo .accent { color: var(--c-sky); }

.theme-hero {
  padding: 140px 6vw 72px;
  background: var(--c-paper);
  position: relative;
  overflow: hidden;
}
.theme-hero::before {
  content: '';
  position: absolute; inset: 0;
  background-image: repeating-linear-gradient(
    to bottom, transparent, transparent 39px,
    rgba(26,26,46,.04) 39px, rgba(26,26,46,.04) 40px
  );
  pointer-events: none;
}
.theme-hero__tag {
  display: inline-block;
  font-family: var(--f-ui); font-size: .7rem; font-weight: 600;
  letter-spacing: 2px; text-transform: uppercase;
  color: var(--c-sky); margin-bottom: 16px;
}
.theme-hero__title {
  font-family: var(--f-display);
  font-size: clamp(2.4rem, 5vw, 4.8rem);
  font-weight: 700; line-height: 1.06;
  letter-spacing: -0.5px;
  color: var(--c-ink); max-width: 16ch;
  margin-bottom: 24px;
}
.theme-hero__title em { font-style: italic; color: var(--c-sky); }
.theme-hero__intro {
  font-size: 1.1rem; line-height: 1.78; color: var(--c-ink-60);
  max-width: 600px; margin-bottom: 40px;
}
.theme-hero__pills {
  display: flex; flex-wrap: wrap; gap: 10px;
}
.theme-pill {
  font-family: var(--f-ui); font-size: .76rem; font-weight: 500;
  padding: 6px 14px; border-radius: var(--r-pill);
  background: var(--c-cream); color: var(--c-ink-80);
  border: 1px solid var(--c-ink-10);
}

.theme-body {
  padding: 72px 6vw;
  max-width: 1100px; margin: 0 auto;
}

.theme-section { margin-bottom: 80px; }
.theme-section__label {
  font-family: var(--f-ui); font-size: .7rem; font-weight: 600;
  letter-spacing: 2px; text-transform: uppercase;
  color: var(--c-sky); margin-bottom: 8px;
}
.theme-section__title {
  font-family: var(--f-display); font-size: 1.6rem; font-weight: 600;
  color: var(--c-ink); margin-bottom: 20px; line-height: 1.15; letter-spacing: -0.3px;
}
.theme-section__body {
  font-size: 1.02rem; line-height: 1.78; color: var(--c-ink-60);
  max-width: 680px;
}
.theme-section__body p { margin-bottom: 16px; }
.theme-section__body p:last-child { margin-bottom: 0; }

.theme-activities { margin-top: 48px; }
.theme-activities__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 24px;
}
.activity-card {
  background: var(--c-white);
  border-radius: var(--r-lg);
  padding: 28px;
  box-shadow: var(--shadow-soft);
  border-left: 4px solid var(--c-sky);
}
.activity-card--orange { border-color: var(--c-orange); }
.activity-card--green  { border-color: var(--c-green); }
.activity-card--violet { border-color: var(--c-violet); }
.activity-card--yellow { border-color: var(--c-yellow); }
.activity-card__tag {
  font-family: var(--f-ui); font-size: .68rem; font-weight: 600;
  letter-spacing: 1.2px; text-transform: uppercase;
  color: var(--c-sky); margin-bottom: 10px; display: block;
}
.activity-card--orange .activity-card__tag { color: var(--c-orange); }
.activity-card--green  .activity-card__tag { color: var(--c-green); }
.activity-card--violet .activity-card__tag { color: var(--c-violet); }
.activity-card--yellow .activity-card__tag { color: #b8860b; }
.activity-card h3 {
  font-family: var(--f-card); font-size: 1rem; font-weight: 700;
  color: var(--c-ink); margin-bottom: 10px;
}
.activity-card p { font-size: .92rem; color: var(--c-ink-60); line-height: 1.65; }

.theme-photo-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 40px;
}
.theme-photo-grid img {
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: var(--r-md);
  box-shadow: var(--shadow-soft);
}
.theme-photo-grid .span2 { grid-column: span 2; }

.theme-book {
  display: flex; align-items: flex-start; gap: 24px;
  background: var(--c-cream); border-radius: var(--r-lg);
  padding: 28px; margin-top: 32px;
}
.theme-book__icon {
  font-size: 2.4rem; flex-shrink: 0;
  width: 56px; height: 56px; display: flex; align-items: center; justify-content: center;
  background: var(--c-white); border-radius: var(--r-md);
}
.theme-book__title {
  font-family: var(--f-card); font-size: 1rem; font-weight: 700;
  color: var(--c-ink); margin-bottom: 4px;
}
.theme-book__author { font-size: .82rem; color: var(--c-ink-40); margin-bottom: 10px; }
.theme-book p { font-size: .92rem; color: var(--c-ink-60); line-height: 1.65; }

.theme-concepts {
  display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px;
}
.theme-concept {
  background: var(--c-white); border: 1px solid var(--c-ink-10);
  border-radius: var(--r-pill); padding: 10px 20px;
  font-family: var(--f-ui); font-size: .82rem; font-weight: 500;
  color: var(--c-ink-80);
}

.theme-back-bar {
  background: var(--c-navy); color: rgba(253,250,245,.7);
  padding: 40px 6vw;
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px;
}
.theme-back-bar a {
  font-family: var(--f-ui); font-size: .82rem; font-weight: 500;
  color: var(--c-sky);
  display: inline-flex; align-items: center; gap: 8px;
}
.theme-back-bar__brand {
  font-family: 'Syne-Logo', var(--f-ui); font-size: 1rem; font-weight: 800;
  color: rgba(253,250,245,.5);
}

@media (max-width: 700px) {
  .theme-activities__grid { grid-template-columns: 1fr; }
  .theme-photo-grid { grid-template-columns: 1fr 1fr; }
  .theme-photo-grid .span2 { grid-column: span 1; }
}

@media (max-width: 768px) {
  .theme-hero { padding: 110px 5vw 48px; }
  .theme-hero__title { font-size: clamp(2rem, 8vw, 3rem); }
  .theme-activities__grid { grid-template-columns: 1fr; }
  .theme-photo-grid { grid-template-columns: 1fr 1fr; }
  .theme-photo-grid .span2 { grid-column: span 2; }
  .theme-book { flex-direction: column; gap: 16px; }
  .theme-nav { padding: 16px 5vw; }
}
@media (max-width: 480px) {
  .theme-photo-grid { grid-template-columns: 1fr; }
  .theme-photo-grid .span2 { grid-column: span 1; }
  .theme-concepts { gap: 8px; }
  .theme-concept { font-size: .76rem; padding: 8px 14px; }
}

/* Book cover in theme pages */
.theme-book__cover {
  width: 80px;
  height: auto;
  border-radius: var(--r-sm);
  box-shadow: 0 4px 16px rgba(0,0,0,.2);
  flex-shrink: 0;
  object-fit: cover;
}