/* Modern Sanctuary design system: professional church administration UI. */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Baskerville:wght@400;700&display=swap');
:root { --church-navy:#172a3a; --church-blue:#245b78; --church-gold:#c6a15b; --church-ivory:#f8f6f0; --church-slate:#34424d; --church-line:#e5e8eb; --church-success:#3d8b68; --church-danger:#b95353; --church-shadow:0 12px 30px rgba(23,42,58,.08); }
.skip-link { position:fixed; left:12px; top:-60px; z-index:2000; padding:10px 14px; background:var(--church-gold); color:var(--church-navy); border-radius:7px; font-weight:700; text-decoration:none; }
.skip-link:focus { top:12px; outline:3px solid var(--church-navy); outline-offset:2px; }
:focus-visible { outline:3px solid var(--church-gold); outline-offset:2px; }
main, #main-content { scroll-margin-top:80px; }
h1, h2, h3 { text-wrap:balance; }
td, th, .amount, .stat-value { font-variant-numeric:tabular-nums; }
html { overflow-x: hidden; background: var(--church-ivory); }
body { max-width: 100%; overflow-x: hidden; background: var(--church-ivory); color:var(--church-slate); font-family:'DM Sans','Segoe UI',Arial,sans-serif; }
h1,h2,h3,h4 { color:var(--church-navy); font-family:'Libre Baskerville',Georgia,serif; letter-spacing:-.02em; }
a { transition:color .18s ease, background-color .18s ease, transform .18s ease; }
button, input, select, textarea { font-family:inherit; }
button, .btn, .btn-submit, .btn-add, .btn-primary { border-radius:8px !important; }
button:hover, .btn:hover, .btn-add:hover { transform:translateY(-1px); }
.topbar, .site-header, .site-nav { background:var(--church-navy) !important; }
.topbar a, .site-header a, .site-nav a { color:#e9dcc0; }
.form-card, .card, .panel, .section-card, .m-card, .stat-card, .content-card { border:1px solid var(--church-line); box-shadow:var(--church-shadow); }
input, select, textarea { border:1px solid #d6dde2; background:#fff; color:var(--church-slate); border-radius:8px; }
input:focus, select:focus, textarea:focus { border-color:var(--church-gold) !important; box-shadow:0 0 0 3px rgba(198,161,91,.16); }
table { border-color:var(--church-line); }
th { background:var(--church-navy) !important; color:#fff !important; font-weight:600; }
tr:nth-child(even) td { background:rgba(255,255,255,.52); }
.btn-submit, .btn-primary, .btn-add { background:var(--church-blue) !important; border-color:var(--church-blue) !important; color:#fff !important; }
.btn-gen { background:var(--church-gold) !important; color:var(--church-navy) !important; }
.btn-cancel { background:#87939a !important; }
.badge-success, .status-success { background:var(--church-success) !important; }
.section-title, .page-title { position:relative; }
.section-title::after, .page-title::after { content:''; display:block; width:42px; height:3px; margin-top:10px; background:var(--church-gold); border-radius:9px; }
.nav-menu { align-items:center; }
/* Landing page: calm editorial rhythm with a stronger ministry-first hero. */
.slider-wrap { min-height:360px; height:min(560px,62vw); }
.slide-content { max-width:760px; }
.slide-content h1, .hero-fallback h1 { font-family:'Libre Baskerville',Georgia,serif; letter-spacing:-.035em; color:#fff !important; }
.slide-content p { color:#fff !important; }
.slide-content a, .hero-fallback .btn-gold, .cta-strip .btn-gold { background:var(--church-gold) !important; color:var(--church-navy) !important; border-radius:9px; padding:12px 24px; }
.stats-bar { background:var(--church-navy); border-top:3px solid var(--church-gold); }
.stat-item .snum { color:var(--church-gold); font-variant-numeric:tabular-nums; }
.section-alt { background:var(--church-ivory) !important; }
.event-card, .sermon-card, .testi-card, .post-card { border:1px solid var(--church-line); box-shadow:var(--church-shadow); }
.event-card:hover, .post-card:hover, .sermon-card:hover { box-shadow:0 16px 30px rgba(23,42,58,.13); }
.section-line { background:var(--church-gold) !important; }
.cta-strip { background:linear-gradient(120deg,var(--church-navy),var(--church-blue)) !important; border-top:4px solid var(--church-gold); }
img, video, iframe { max-width: 100%; }
table { width: 100%; }
.table-responsive, .table-wrap, .table-container { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
input, select, textarea, button { max-width: 100%; }
button, a { touch-action: manipulation; }

@media (max-width: 768px) {
  .row-2, .grid-2, .form-grid, .stats-row, .info-grid { grid-template-columns: 1fr !important; }
  .row-2 { gap: 0 !important; }
  .form-card, .page-wrap, .container, .content, .main-content { width: auto; max-width: 100%; margin-left: 12px; margin-right: 12px; padding-left: 14px; padding-right: 14px; }
  .topbar, .site-header, .site-nav { padding-left: 14px !important; padding-right: 14px !important; }
  .topbar, .site-header { flex-wrap: wrap; gap: 8px; }
  .btn-row, .button-row, .action-row { flex-wrap: wrap; }
  .btn-row > *, .button-row > *, .action-row > * { flex: 1 1 140px; min-width: 0; }
  table { display: block; overflow-x: auto; white-space: nowrap; }
  th, td { min-width: 100px; }
  .nav-menu { flex-wrap: wrap; gap: 4px; }
  .nav-menu a { padding: 8px 7px; font-size: 13px; }
  h1 { font-size: clamp(1.45rem, 6vw, 2rem); }
  h2 { font-size: clamp(1.2rem, 5vw, 1.6rem); }
  .slider-wrap { height:460px; }
  .slide-content { padding:24px 22px; }
  .slide-content h1 { font-size:clamp(22px,7vw,32px); }
  .stats-bar .container { display:grid; grid-template-columns:1fr 1fr; }
  .stat-item { padding:12px 8px; }
  .stat-item + .stat-item::before { display:none; }
  .sambutan-grid { grid-template-columns:1fr !important; gap:24px; }
  .gallery-grid { grid-template-columns:repeat(2,1fr) !important; grid-auto-rows:130px; }
  .gallery-item:first-child { grid-column:span 2; grid-row:span 1; }
  .sermon-card { padding:14px; }
}

@media (max-width: 480px) {
  .form-card, .page-wrap, .container, .content, .main-content { margin-left: 6px; margin-right: 6px; padding: 12px; }
  .card, .m-card, .panel, .section-card { border-radius: 8px; }
  .cert-row { flex-wrap: wrap; }
  .cert-row button { width: 100%; }
  .pagination { flex-wrap: wrap; }
  .nav-menu a { font-size: 12px; }
}

/* Admin layout: keep the navigation usable without pushing the content below the fold. */
@media (max-width: 620px) {
  .layout { display:flex; flex-direction:column !important; }
  .layout > .sidebar { position:static !important; width:100% !important; max-height:170px; overflow-y:auto; overflow-x:hidden; }
  .layout > .main { width:100% !important; min-width:0; margin-left:0 !important; padding:16px 10px !important; }
  .layout > .sidebar .nav-section { margin-top:10px; }
  .layout > .sidebar .nav-link { padding:8px 14px; }
}

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