:root {
  --pk-primary: #1a73e8;
  --pk-primary-dark: #1557b0;
  --pk-green: #0d9488;
  --pk-green-light: #f0fdfa;
  --pk-dark: #1e293b;
  --pk-gray: #64748b;
  --pk-light: #f8fafc;
  --pk-white: #ffffff;
  --pk-border: #e2e8f0;
  --pk-red: #dc2626;
}

html { scroll-behavior: smooth; scroll-padding-top: 64px; }

body { font-family: 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; color: var(--pk-dark); line-height: 1.7; }

.navbar { box-shadow: 0 1px 4px rgba(0,0,0,0.08); }

.hero.is-primary { background: linear-gradient(135deg, var(--pk-primary) 0%, var(--pk-green) 100%); }

.hero-body img.hero-img { max-width: 100%; height: auto; border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.15); }

.section-alt { background-color: var(--pk-light); }

.service-card { border-radius: 12px; border: 1px solid var(--pk-border); transition: transform 0.2s ease, box-shadow 0.2s ease; height: 100%; }
.service-card:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(0,0,0,0.1); }
.service-card .icon { color: var(--pk-primary); }

.info-box { background: var(--pk-green-light); border-left: 4px solid var(--pk-green); border-radius: 8px; padding: 1.5rem; }

.cta-box { background: linear-gradient(135deg, var(--pk-primary) 0%, var(--pk-green) 100%); border-radius: 12px; color: #fff; padding: 2.5rem; }
.cta-box a { color: #fff; text-decoration: underline; }

.footer { background-color: var(--pk-dark); color: #cbd5e1; padding: 2.5rem 1.5rem; }
.footer a { color: #94a3b8; }
.footer a:hover { color: #fff; }
.footer strong { color: #f1f5f9; }

.section.is-medium { padding: 4rem 1.5rem; }

.tag-hours { font-size: 0.95rem; }

.hotline-btn { font-size: 1.1rem; font-weight: 700; letter-spacing: 0.5px; }

@media screen and (max-width: 768px) {
  .hero-body img.hero-img { max-width: 100%; }
  .section.is-medium { padding: 2.5rem 1rem; }
}
