/* Responsive page composition with a viewport-height laptop introduction. */
@font-face {
  font-family:'Gita Heading Jakarta'; font-style:normal; font-weight:700;
  font-display:swap; src:url('assets/fonts/plus-jakarta-sans-700.ttf') format('truetype');
}
@font-face {
  font-family:'Gita Heading Jakarta'; font-style:normal; font-weight:800;
  font-display:swap; src:url('assets/fonts/plus-jakarta-sans-800.ttf') format('truetype');
}
body.gita-landing :is(h1,h2,h3) { font-family:'Gita Heading Jakarta','Plus Jakarta Sans',Arial,sans-serif; }
body.gita-landing h1 { font-weight:800; }
body.gita-landing h2 { font-weight:700; }
body.gita-landing h3 { font-weight:700; }
body.gita-landing #modul.modules-reference :is(h2,h3) { font-weight:700; }
body.gita-landing .portal-header nav { font-size:15px; line-height:1.5; }
/* Keep the navigation above scrolling content with a light glass surface. */
body.gita-landing { overflow-x:clip; }
body.gita-landing .portal-header-band {
  position:sticky; top:0; z-index:90;
  background:rgba(255,255,255,.78);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  backdrop-filter:blur(18px) saturate(150%);
  border-bottom:1px solid rgba(7,59,119,.12);
  box-shadow:0 4px 20px rgba(7,59,119,.045);
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  body.gita-landing .portal-header-band { background:rgba(255,255,255,.96); }
}
body.gita-landing .hero-rotating-title { display:grid; }
body.gita-landing .hero-title-slide { grid-area:1/1; min-width:0; animation:gita-title-fade 12s ease-in-out infinite; }
body.gita-landing .hero-title-slide + .hero-title-slide { animation-delay:-6s; }
@keyframes gita-title-fade {
  0%,40% { opacity:1; visibility:visible; }
  50%,90% { opacity:0; visibility:hidden; }
  100% { opacity:1; visibility:visible; }
}
@media(prefers-reduced-motion:reduce) {
  body.gita-landing .hero-title-slide { animation:none; }
  body.gita-landing .hero-title-slide + .hero-title-slide { visibility:hidden; }
}
@media(max-width:600px) {
  body.gita-landing .portal-header nav { font-size:14px; }
}
body.gita-landing { --landing-max:1760px; --landing-gutter:clamp(48px,4vw,80px); --intro-chrome:122px; }
body.gita-landing :is(.portal-header,.hero,#modul.modules-reference,#tentang.about,.portal-footer),
body.gita-landing #statistik-singkat .gs-stats-container {
  box-sizing:border-box; width:100%; max-width:var(--landing-max) !important;
  margin-inline:auto; padding-inline:var(--landing-gutter) !important;
}
body.gita-landing #statistik-singkat { padding-inline:0 !important; }
body.gita-landing .hero-copy > p,
body.gita-landing #tentang > div > p { max-width:620px; }
body.gita-landing .hero-band { min-height:calc(100svh - var(--intro-chrome)); display:flex; }
body.gita-landing .hero {
  flex:1; min-height:inherit; grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);
  gap:clamp(32px,5vw,96px); padding-block:clamp(28px,4.5svh,56px);
  align-items:center;
}
body.gita-landing .hero h1 { font-size:clamp(40px,4vw,72px); line-height:1.13; letter-spacing:-2px; }
body.gita-landing .hero-copy > p { font-size:clamp(14px,1.05vw,17px); line-height:1.85; }
body.gita-landing .hero-visual {
  width:100%; max-width:min(760px,calc((100svh - var(--intro-chrome) - 174px)*1.25));
  justify-self:end;
}
body.gita-landing .about-band { background:#fff; }
body.gita-landing .about-band::before,
body.gita-landing .about-band::after { content:none; }
body.gita-landing .portal-footer-band { background:#073b77; border:0; box-shadow:none; }
@media(min-width:1200px) {
 body.gita-landing #modul.modules-reference { padding-block:64px 76px; }
 body.gita-landing #modul.modules-reference .module { padding:32px 34px 24px; }
 body.gita-landing #modul.modules-reference .module h3 { font-size:clamp(28px,2vw,34px); }
 body.gita-landing #modul.modules-reference .module p { font-size:15px; max-width:620px; }
 body.gita-landing #modul.modules-reference .tags span { font-size:12px; }
 body.gita-landing #tentang.about { padding-block:76px; }
 body.gita-landing #tentang p { font-size:15px; }
 body.gita-landing #tentang summary { font-size:14px; }
}
@media(min-width:901px) and (max-height:700px) {
 body.gita-landing .hero { padding-block:20px; gap:32px; }
 body.gita-landing .hero h1 { font-size:clamp(36px,3.6vw,54px); margin-block:18px; }
 body.gita-landing .hero .actions { margin-block:22px; }
}
@media(max-width:900px) { body.gita-landing { --landing-gutter:32px; } body.gita-landing .hero { gap:28px; } }
@media(max-width:600px) {
 body.gita-landing { --landing-gutter:24px; }
 body.gita-landing .hero-band { min-height:0; display:block; }
 body.gita-landing .hero { min-height:0; grid-template-columns:1fr; padding-block:36px 42px; gap:30px; }
 body.gita-landing .hero h1 { font-size:clamp(35px,9.5vw,46px); letter-spacing:-1.5px; }
 body.gita-landing .hero-visual { max-width:100%; justify-self:center; }
}

/* Admin access link — compact, consistent with public navigation */
body.gita-landing .portal-header-actions .gs-admin-login{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;padding:10px 14px;border:1px solid #b8d2e9;color:#09518c;border-radius:12px;background:#fff;font-weight:800;font-size:12px;line-height:1.2;transition:background .2s,border-color .2s}
body.gita-landing .portal-header-actions .gs-admin-login:hover{background:#ebf5ff;border-color:#4d9edc}
@media(max-width:650px){body.gita-landing .portal-header-actions .gs-admin-login{padding:9px 10px;font-size:11px}}