:root {
  --brand-a: #3b1d60;  /* deep purple */
  --brand-b: #4f46e5;  /* indigo */
}
html { scroll-behavior: smooth; }
body {
  font-family: "Inter", "Noto Sans JP", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  line-height: 1.6;
}
.bg-gradient {
  background: linear-gradient(135deg, var(--brand-a), var(--brand-b));
}

.hero{
  padding-top: 6rem;
  min-height: 70vh;
  color: #fff;
  background-image:
    linear-gradient(135deg, rgba(0,0,0,.35), rgba(0,0,0,.35)),
    var(--hero-img, linear-gradient(135deg, var(--brand-a), var(--brand-b)));
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center calc(50% + var(--shift, 0px));
}

@media (max-width: 576px){
  .hero{ min-height: 60vh; }
}

.section-pad { padding: 5rem 0; }
.logo.ph { height: 48px; background: #e9ecef; border-radius: .5rem; }
#backToTop {
  right: 1rem; bottom: 1rem; z-index: 1040; opacity: 0; pointer-events: none; transition: opacity .2s ease;
}
#backToTop.show { opacity: 1; pointer-events: auto; }
.navbar .nav-link.active { font-weight: 700; }