/*
 * Komoda Bright — ティファニーブルー基調
 * uploads/komoda/komoda-bright-custom.css へ同期
 */

:root {
  --color-navy: #007a74;
  --color-navy-light: #00a396;
  --color-navy-dark: #00635e;
  --color-white: #ffffff;
  --color-off-white: #f0faf9;
  --color-cream: #f5fffe;
  --color-sky-soft: #e6f7f6;
  --color-gray-100: #dff3f1;
  --color-gray-200: #c5e8e5;
  --color-gray-400: #5a9e98;
  --color-gray-600: #3d7a74;
  --color-gray-800: #0f524e;
  --color-text: #0b524e;
  --color-text-light: #2d7a74;
  --color-accent: #00b8ad;
  --color-accent-hover: #009a90;
  --color-gold: #d4a853;
  --color-surface: #f0faf9;
  --radius-md: 16px;
  --radius-lg: 24px;
  --shadow-soft: 0 8px 32px rgba(10, 186, 181, 0.1);
}

body.komoda-bright-theme {
  background: linear-gradient(180deg, #ffffff 0%, var(--color-sky-soft) 100%);
  color: var(--color-text);
}

.site-header {
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(16px);
  box-shadow: 0 1px 0 rgba(10, 186, 181, 0.08);
}

.site-header .nav-contact,
.site-header.scrolled .nav-contact,
.nav-contact {
  background: var(--color-accent);
  border-color: var(--color-accent);
  color: #fff;
  border-radius: 999px;
  box-shadow: 0 4px 16px rgba(10, 186, 181, 0.3);
}

.nav-contact:hover {
  background: var(--color-accent-hover);
  border-color: var(--color-accent-hover);
}

.nav-list a:hover,
.logo-en {
  color: var(--color-navy);
}

.logo-en {
  font-weight: 700;
}

.hero-overlay {
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.12) 0%,
    rgba(255, 255, 255, 0.05) 40%,
    rgba(31, 122, 118, 0.2) 75%,
    rgba(31, 122, 118, 0.36) 100%
  );
}

.hero-slide {
  filter: brightness(1.08) saturate(1.04);
}

.hero-text-panel {
  display: inline-block;
  max-width: min(100%, 640px);
  padding: 24px 32px 28px;
  margin-bottom: 28px;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(197, 232, 229, 0.9);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-soft);
}

.hero-text-panel .hero-department {
  color: var(--color-accent);
  font-weight: 700;
}

.hero-text-panel .hero-title {
  color: var(--color-navy);
  font-weight: 700;
}

.hero-scroll {
  background: rgba(255, 255, 255, 0.96);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-soft);
}

.hero-scroll-text {
  color: var(--color-accent);
}

.section-label {
  color: var(--color-accent);
  font-weight: 700;
}

.section-title {
  color: var(--color-navy);
  font-weight: 700;
}

.news-section {
  background: var(--color-white);
  border-radius: var(--radius-lg);
  margin: 0 20px;
  max-width: calc(var(--container) + 40px);
  margin-left: auto;
  margin-right: auto;
  box-shadow: var(--shadow-soft);
}

.message-section {
  background: var(--color-cream) !important;
  border-radius: var(--radius-lg);
  margin: 48px 20px;
  max-width: calc(var(--container) + 40px);
  margin-left: auto;
  margin-right: auto;
}

.message-lead,
.message-body .message-lead {
  color: var(--color-navy) !important;
}

.message-body strong {
  color: var(--color-accent) !important;
}

.creed-overlay {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(230, 247, 246, 0.94)) !important;
}

.creed-section .section-title.light {
  color: var(--color-navy);
}

.creed-card {
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid var(--color-gray-200) !important;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-soft);
}

.creed-card h3 { color: var(--color-navy); }
.creed-num { color: var(--color-accent) !important; }

.service-section { background: transparent; }

.service-card {
  border-radius: var(--radius-md);
  background: var(--color-white);
  box-shadow: var(--shadow-soft);
  border: 1px solid var(--color-gray-200);
}

.service-card-image::after {
  background: linear-gradient(to bottom, transparent 60%, rgba(31, 122, 118, 0.12)) !important;
}

.service-num { color: var(--color-accent); opacity: 0.55; }

.ec-flow-board {
  border-radius: var(--radius-lg);
  background: var(--color-white) !important;
  border: 1px solid var(--color-gray-200);
  box-shadow: var(--shadow-soft);
  color: var(--color-text);
}

.ec-flow-board::before { display: none; }

.ec-flow-node {
  background: var(--color-sky-soft);
  border: 1px solid var(--color-gray-200);
  border-radius: var(--radius-md);
}

.ec-flow-node.is-komoda {
  background: linear-gradient(180deg, #fff, var(--color-sky-soft));
  border-color: var(--color-accent);
}

.ec-flow-icon {
  background: var(--color-white);
  border: 2px solid var(--color-accent);
  color: var(--color-accent);
}

.strength-overlay {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(230, 247, 246, 0.92)) !important;
}

.strength-section .section-title.light { color: var(--color-navy); }

.strength-item {
  background: rgba(255, 255, 255, 0.92);
  border-radius: var(--radius-md);
  padding: 28px 24px;
  border-top: 3px solid var(--color-accent) !important;
  box-shadow: var(--shadow-soft);
}

.strength-item h3 { color: var(--color-navy) !important; }
.strength-num { color: var(--color-accent) !important; }

.company-section {
  background: var(--color-white);
  border-radius: var(--radius-lg);
  margin: 0 20px;
  box-shadow: var(--shadow-soft);
}

.contact-section {
  background: linear-gradient(135deg, #d4f5f3, #ecfbf9) !important;
  color: var(--color-text);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}

.contact-info .section-title { color: var(--color-navy); }
.contact-tel { color: var(--color-navy) !important; }

.contact-form-wrap {
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-soft);
}

.btn-submit {
  background: var(--color-accent);
  border-radius: 999px;
}

.btn-submit:hover { background: var(--color-accent-hover); }

.site-footer {
  background: linear-gradient(180deg, #ecfbf9, #dff5f3);
  color: var(--color-text-light);
  border-top: 1px solid var(--color-gray-200);
}

.footer-logo .logo-en { color: var(--color-navy); }

.footer-nav-col h4,
.footer-contact-col h4,
.external-links-heading {
  color: var(--color-accent);
}

.footer-external-wrap {
  border-top-color: var(--color-gray-200);
}

.external-link-card {
  background: var(--color-white);
  border-radius: 14px;
  box-shadow: var(--shadow-soft);
}

.external-link-card:hover {
  border-color: rgba(10, 186, 181, 0.45);
}

.external-link-card--store .external-link-icon {
  background: #007a74;
}

.link-more {
  color: var(--color-accent);
  font-weight: 600;
}

@media (max-width: 1024px) {
  .external-links--footer {
    grid-template-columns: 1fr;
  }

  .external-links--footer .external-links-group:first-child .external-links-list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .hero-text-panel {
    padding: 18px 20px 22px;
  }

  .news-section,
  .message-section,
  .company-section {
    margin-left: 12px;
    margin-right: 12px;
  }

  .site-nav {
    background: var(--color-white);
    box-shadow: -4px 0 24px rgba(10, 186, 181, 0.14);
  }
}