:root{
  --sh-primary: #B3001B;
  --sh-ink: #1F2937;
  --sh-muted: #6B7280;
  --sh-paper: #FBFBFD;
  --sh-surface: #FFFFFF;
  --sh-line: #E6E7EB;
  --sh-shadow: rgba(15,15,20,0.08);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--sh-paper);color:var(--sh-ink);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; line-height:1.8}
img{max-width:100%;height:auto;display:block}
a{color:var(--sh-primary);text-decoration:none} a:hover{text-decoration:underline}
.sh-header{position:sticky;top:0;z-index:40;background:var(--sh-surface);border-bottom:1px solid var(--sh-line)}
.sh-brand{display:flex;align-items:center;gap:10px;padding:10px 16px}
.sh-brand img{width:200px;height:auto}
.sh-nav{display:flex;gap:12px;align-items:center;justify-content:flex-end;padding:10px 16px;border-top:1px solid var(--sh-line)}
.sh-nav a{padding:8px 10px;border-radius:4px;position:relative}
.sh-nav a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:transparent;transition:background .2s ease}
.sh-nav a:hover::after{background:var(--sh-primary)} .sh-nav a.sh-active::after{background:var(--sh-primary)}
.sh-container{max-width:1200px;margin:0 auto;padding:24px 20px}
.sh-layout{display:grid;grid-template-columns:280px 1fr;gap:22px}
@media (max-width: 920px){ .sh-layout{grid-template-columns:1fr} }
.sh-sidebar{border-right:1px solid var(--sh-line);padding-right:18px}
.sh-sidebar h2{font-size:1rem;margin:8px 0;color:var(--sh-muted)}
.sh-sidebar ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.sh-sidebar li{border-bottom:1px solid var(--sh-line);padding:6px 0}
h1{font-size:2.2rem;margin:14px 0 6px 0;letter-spacing:.2px}
.dek{font-size:1.05rem;color:var(--sh-muted);margin:0 0 14px 0}
.sh-banner{border:1px solid var(--sh-line);border-radius:6px;overflow:hidden;box-shadow:0 6px 20px -12px var(--sh-shadow);margin:10px 0 16px 0}
.sh-banner figcaption{font-size:.92rem;color:var(--sh-muted);padding:8px 12px;background:#FCFCFE}
.sh-card{background:var(--sh-surface);border:1px solid var(--sh-line);border-radius:6px;padding:18px;margin:16px 0;box-shadow:0 8px 24px -20px var(--sh-shadow)}
.sh-card h2{font-size:1.25rem;margin:4px 0}
.sh-card h3{font-size:1.02rem;margin:2px 0;color:var(--sh-muted)}
.sh-footer{border-top:1px solid var(--sh-line);color:var(--sh-muted);text-align:center;padding:22px;margin-top:22px}
article p, section p, main p, p { text-align: justify !important; text-justify: inter-word !important; -webkit-hyphens: auto !important; -ms-hyphens: auto !important; hyphens: auto !important; }

/* =========================
   MEDIA PROTECTION ADD-ONS
   ========================= */
img, picture, svg, canvas, video{
  -webkit-user-drag:none !important;
  user-drag:none !important;
  -webkit-touch-callout:none !important;  /* iOS long-press save menu */
  -webkit-user-select:none !important;
  -moz-user-select:none !important;
  -ms-user-select:none !important;
  user-select:none !important;
  -webkit-tap-highlight-color:transparent;
}
/* Reduce touch callout on media wrappers as well */
figure, .sh-banner{ -webkit-touch-callout:none }

/* --- Final Footer Refinement (SilverHaven / StageCraft Harmonization) --- */

/* Override global justification */
.sh-footer,
.sh-footer * {
  text-align: center !important;
}

/* Footer layout: refined daylight balance */
.sh-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-top: 26px;
  padding-bottom: 26px;
  background: var(--sh-surface);
  border-top: 1px solid var(--sh-line);
  color: var(--sh-muted);
  box-shadow: 0 -4px 24px rgba(15,15,20,0.05) inset;
}

/* Metrolagu Network (SilverHaven / StageCraft palette) */
.metrolagu-network {
  background: none;
  color: var(--sh-ink);
  padding: 20px 0;
}

.network-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.metrolagu-network h3 {
  font-size: 1.15em;
  margin-bottom: 10px;
  color: #C23D4B; /* warm red accent */
  font-weight: 600;
  text-align: center;
  text-shadow: 0 0 3px rgba(194,61,75,0.18);
}

.metrolagu-network p {
  color: var(--sh-muted);
  margin-bottom: 10px;
  line-height: 1.7;
  text-align: center;
}

/* Network links */
.network-links {
  text-align: center;
}

.network-links a {
  color: #1F2937;
  text-decoration: none;
  border-bottom: 1px solid rgba(179,0,27,0.25);
  transition: color 0.3s ease, border-color 0.3s ease, opacity 0.3s ease;
}

.network-links a:hover {
  color: #C23D4B;
  border-bottom-color: #C23D4B;
  opacity: 0.85;
}

/* Copyright pill refinement */
.sh-footer .copyright,
.site-footer .copyright {
  display: inline-block;
  margin: 18px auto 6px auto;
  font-weight: 600;
  font-size: 0.95rem;
  letter-spacing: 0.4px;
  color: var(--sh-ink);
  background: rgba(251,251,253,0.9);
  padding: 8px 22px;
  border: 1.5px solid rgba(15,15,20,0.1);
  border-radius: 999px;
  box-shadow: 0 2px 12px rgba(15,15,20,0.08);
  transition: all 0.3s ease;
}

/* Hover tone: subtle daylight flare */
.sh-footer .copyright:hover {
  background: #fff;
  color: var(--sh-primary);
  border-color: rgba(179,0,27,0.35);
  box-shadow: 0 3px 14px rgba(179,0,27,0.15);
  transform: translateY(-1px);
}

/* Embedded link inherits tone */
.sh-footer .copyright a {
  color: inherit !important;
  text-decoration: none !important;
  transition: opacity 0.3s ease;
}
