:root {
  --pion-text: #f5f2eb;
  --pion-muted: #c7c9d8;
  --pion-accent: #b9b0ff;
  --pion-ink: #252b40;
  --pion-paper: #f4f0e6;
  --pion-heading: clamp(2rem, 3vw, 2.75rem);
}
html { scroll-padding-top: 0; }
.layout-navbar .nav-link.active { color: var(--pion-accent) !important; }
section[id] { scroll-margin-top: 100px; }
/* These sections already reserve navbar space inside their viewport layout. */
@media (min-width: 992px) {
  #hero-animation, #program, #galeri-preview, #landingTeam { scroll-margin-top: 0; }
}
#hero-animation .hero-title { background: none !important; color: var(--pion-text) !important; -webkit-text-fill-color: var(--pion-text); }
#hero-animation h2 .text-primary { color: var(--pion-accent) !important; }
#hero-animation p { font-size: 1rem; line-height: 1.65; }
#tentang .lead, #landingReviews .text-muted, #landingFAQ .text-muted { color: var(--pion-muted) !important; }
#tentang .pc-about-principles p { color: #f0eef7; }
#tentang .pc-about-principles h3 { color: var(--pion-text); font-size: 1.125rem; margin: 8px 0 10px; }
#programTitle, #tentang h2, #homepageGalleryTitle, #landingReviews h2, #landingFAQ > .container > h2, .pc-team-heading h2, .pc-team-group--staff .pc-team-heading h2 { font-size: var(--pion-heading); line-height: 1.15; }
#landingReviews p, #landingFAQ p, .pc-team-description { font-size: 1rem; line-height: 1.6; }
.pc-team .pc-team-name, .pc-team-grid--staff .pc-team-name { font-size: 1rem; line-height: 1.4; }
.pc-team .pc-team-role, .pc-team-grid--staff .pc-team-role { font-size: 0.875rem; line-height: 1.5; }
#landingReviews .small { font-size: 0.875rem; }
#landingFAQ .accordion-header { font-size: 1.125rem; }
#landingFAQ .accordion-button { font-size: 1rem; line-height: 1.5; }
.pc-auth-field label, .pc-auth-options, .pc-auth-check, .pc-auth-terms { font-size: 0.875rem; line-height: 1.5; }
.pc-auth-field label span { font-size: 0.8125rem; }
.pc-auth-field input { font-size: 1rem; }
.pc-auth-switch { font-size: 0.9375rem; }
.pc-auth-options > a, .pc-auth-switch > a { display: inline-flex; align-items: center; min-height: 32px; }
.pc-auth-terms a { color: #4c42bf; text-decoration: underline; text-underline-offset: 3px; }
.pc-auth-terms label { font-size: 0.875rem; line-height: 1.5; margin: 0; }
.pc-auth-section button:focus-visible, .layout-navbar a:focus-visible, .landing-footer a:focus-visible { outline: 2px solid var(--pion-accent); outline-offset: 4px; }
.landing-footer .footer-logo-description { max-width: 35ch; }
.landing-footer .footer-link { display: inline-flex; align-items: center; min-height: 32px; }
.pc-auth-section { padding-bottom: max(3rem, calc(100svh - 104px - var(--auth-card-height, 560px))); }
@media (min-width: 992px) and (min-height: 640px) {
  .pc-auth-section { padding-top: 20px; }
}
@media (min-width: 992px) and (min-height: 640px) {
  .pc-learning-reason p { font-size: 1rem; }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .pc-learning { height: auto; }
  .pc-learning-layout { height: auto; grid-template-rows: auto auto auto; gap: 28px; }
  .pc-learning-reasons { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 32px; }
  .pc-learning-reason:nth-child(3) { border-left: 0; padding-left: 0; }
  .pc-learning-reason:nth-child(2) { padding-right: 0; }
  .pc-learning-reason-art { flex-basis: 100px; height: 100px; margin-top: 16px; }
}
@media (max-width: 991px) {
  :root { --pion-heading: clamp(1.75rem, 6.5vw, 2rem); }
  html { scroll-padding-top: 0; }
  section[id], .pc-team, .pc-auth-section, .pc-auth-book, .pc-auth-face { scroll-margin-top: 84px; }
  #program { min-height: calc(100svh - 84px); padding-top: 24px; }
  #tentang, #galeri-preview, #landingReviews, #landingFAQ { padding-top: 24px; }
  .pc-auth-section { padding-bottom: max(3rem, calc(100svh - 84px - var(--auth-card-height, 560px))); }
  .layout-navbar .landing-navbar { flex-wrap: nowrap; gap: 10px; padding: 12px !important; }
  .layout-navbar .navbar-brand { flex: 1; min-width: 0; margin-right: 0 !important; }
  .layout-navbar .navbar-brand .navbar-toggler { margin-right: 8px !important; min-width: 32px; min-height: 40px; }
  .layout-navbar .app-brand-logo { width: 30px; }
  .layout-navbar .app-brand-text { font-size: 1.125rem !important; white-space: nowrap; }
  .layout-navbar .navbar-nav.flex-row { flex: 0 0 auto; }
  .layout-navbar .navbar-nav.flex-row .btn { padding: 9px 12px; font-size: 0.875rem; }
  .layout-navbar .navbar-nav.flex-row .btn i { display: none; }
  .pc-auth-field label, .pc-auth-terms { font-size: 0.875rem; }
  .pc-team-grid--founders, .pc-team-grid--staff { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
  .pc-team-grid--founders .pc-team-card + .pc-team-card::before { display: none; }
  .pc-team-grid .pc-team-portrait { width: 100%; max-width: 220px; aspect-ratio: 1; margin-inline: auto; }
  .pc-team-grid .pc-team-identity { width: 100%; margin-inline: auto; }
  .pc-team-grid .pc-team-name { font-size: 0.9375rem; }
  .pc-team-grid .pc-team-role { font-size: 0.875rem; }
  .pc-team-group--staff { margin-top: 28px; padding-top: 28px; }
  .pc-gallery-page .pc-gallery-filter-bar { flex-wrap: wrap; gap: 8px; overflow: visible; }
  .pc-gallery-page .pc-gallery-filter { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  .hero-title, .hero-text, .hero-buttons, .hero-dashboard-img { animation: none !important; opacity: 1 !important; }
}