:root {
  --bg-primary: #fdfcf0;       /* 米白暖基底 */
  --theme-teal: #008B9B;       /* Logo 湖水青綠 */
  --theme-teal-dark: #006874;
  --theme-accent-red: #d63031; /* Logo 心意紅 */
  --text-dark: #2c3437;
}

body {
  background-color: var(--bg-primary);
  color: var(--text-dark);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang TC", "Microsoft JhengHei", sans-serif;
  font-size: 1.15rem;
  line-height: 1.85;
}

.navbar-isenai {
  background-color: #ffffff;
  border-bottom: 2px solid rgba(0, 139, 155, 0.15);
}

.brand-title {
  color: var(--theme-teal);
  font-weight: 800;
  font-size: 1.5rem;
}

.btn-teal {
  background-color: var(--theme-teal);
  color: #fff;
  border: none;
  font-weight: 600;
  padding: 12px 28px;
  border-radius: 8px;
  transition: 0.2s ease-in-out;
}
.btn-teal:hover {
  background-color: var(--theme-teal-dark);
  color: #fff;
}

.hero-banner-container {
  background: linear-gradient(180deg, rgba(0, 139, 155, 0.08) 0%, rgba(253, 252, 240, 1) 100%);
  padding: 40px 0;
}

.content-card {
  background: #ffffff;
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 16px;
  padding: 40px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
}

.about-img-frame {
  border-radius: 12px;
  overflow: hidden;
  max-height: 380px;
  border: 4px solid #fff;
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}

footer {
  background-color: #1e272e;
  color: #cad3c8;
  padding: 50px 0 25px 0;
}