/* ============================================
   biz-prestige Theme - Main Stylesheet
   ネイビー × ゴールド 高級感デザイン
============================================ */

/* ===== CSS Variables ===== */
:root {
  --navy: #0d1b2a;
  --navy-mid: #1a2e45;
  --navy-light: #243d5c;
  --gold: #b8975a;
  --gold-light: #d4b47a;
  --cream: #f5f0e8;
  --cream-dark: #e8e0d0;
  --white: #ffffff;
  --text-dark: #1a1a1a;
  --text-mid: #4a4a4a;
  --text-light: #7a7a7a;
  --border: rgba(184, 151, 90, 0.25);
  --transition: 0.3s ease;
}

/* ===== Reset & Base ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

body {
  font-family: 'Noto Sans JP', 'Yu Gothic', 'Hiragino Kaku Gothic ProN', sans-serif;
  font-weight: 300;
  background: var(--cream);
  color: var(--text-dark);
  overflow-x: hidden;
  line-height: 1.6;
}

img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; }
ul { list-style: none; }

/* ===== Typography ===== */
.font-serif { font-family: 'Noto Serif JP', 'Yu Mincho', 'Hiragino Mincho ProN', serif; }
.font-display { font-family: 'Cormorant Garamond', 'Times New Roman', serif; }

/* ===== Layout ===== */
.container { max-width: 1200px; margin: 0 auto; padding: 0 48px; }
.section-pad { padding: 100px 0; }

/* ===== Section Header ===== */
.section-header { text-align: center; margin-bottom: 64px; }

.section-eyebrow {
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  font-weight: 400;
  color: var(--gold);
  letter-spacing: 0.35em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 16px;
}

.section-title {
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(22px, 3vw, 34px);
  font-weight: 300;
  color: var(--navy);
  letter-spacing: 0.08em;
  line-height: 1.6;
}

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

.section-divider {
  width: 40px;
  height: 1px;
  background: var(--gold);
  margin: 24px auto 0;
}

/* ===== Buttons ===== */
.btn-primary {
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  font-weight: 400;
  color: var(--navy);
  background: var(--gold);
  padding: 16px 40px;
  letter-spacing: 0.12em;
  border: 1px solid var(--gold);
  display: inline-block;
  transition: all var(--transition);
  cursor: pointer;
}
.btn-primary:hover { background: var(--gold-light); border-color: var(--gold-light); color: var(--navy); }

.btn-outline {
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  font-weight: 300;
  color: rgba(255,255,255,0.85);
  background: transparent;
  padding: 16px 40px;
  letter-spacing: 0.12em;
  border: 1px solid rgba(255,255,255,0.35);
  display: inline-block;
  transition: all var(--transition);
}
.btn-outline:hover { border-color: var(--gold); color: var(--gold-light); }

.btn-ghost {
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  font-weight: 300;
  color: var(--cream);
  background: transparent;
  padding: 16px 52px;
  letter-spacing: 0.15em;
  border: 1px solid rgba(184,151,90,0.4);
  display: inline-block;
  transition: all var(--transition);
}
.btn-ghost:hover { border-color: var(--gold); color: var(--gold-light); background: rgba(184,151,90,0.07); }

/* ===== NAVIGATION ===== */
#site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: 0 48px;
  background: rgba(13,27,42,0.92);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(184,151,90,0.2);
  transition: background var(--transition);
}

.site-logo {
  flex: 0 1 260px;
  min-width: 180px;
}

.site-logo a {
  display: flex;
  flex-direction: column;
  gap: 2px;
  max-width: 260px;
}

.logo-en {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: 18px;
  color: var(--gold-light);
  letter-spacing: 0.15em;
}

.logo-jp {
  font-family: 'Noto Serif JP', serif;
  font-size: 10px;
  color: rgba(255,255,255,0.45);
  letter-spacing: 0.06em;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.main-navigation ul {
  display: flex;
  gap: clamp(20px, 2.4vw, 34px);
  align-items: center;
}

.main-navigation a {
  font-family: 'Noto Serif JP', serif;
  font-size: 12px;
  font-weight: 300;
  color: rgba(255,255,255,0.75);
  letter-spacing: 0.08em;
  transition: color var(--transition);
  position: relative;
  white-space: nowrap;
}
.main-navigation a::after {
  content: '';
  position: absolute;
  bottom: -4px; left: 0; right: 0;
  height: 1px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform var(--transition);
}
.main-navigation a:hover, .main-navigation .current-menu-item > a { color: var(--gold-light); }
.main-navigation a:hover::after, .main-navigation .current-menu-item > a::after { transform: scaleX(1); }

.header-cta {
  font-family: 'Noto Serif JP', serif;
  font-size: 12px;
  font-weight: 400;
  color: var(--navy);
  background: var(--gold);
  padding: 9px 18px;
  letter-spacing: 0.08em;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background var(--transition);
}
.header-cta:hover { background: var(--gold-light); color: var(--navy); }

/* Hamburger */
.hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 4px;
}
.hamburger span {
  display: block;
  width: 24px;
  height: 1px;
  background: var(--gold-light);
  transition: all var(--transition);
}
.hamburger.is-active span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.hamburger.is-active span:nth-child(2) { opacity: 0; }
.hamburger.is-active span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Mobile Nav */
.mobile-nav {
  display: none;
  position: fixed;
  inset: 0;
  background: var(--navy);
  z-index: 99;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 28px;
  padding: 92px 24px 40px;
}
.mobile-nav.is-open { display: flex; }
.mobile-nav-menu {
  width: min(420px, 100%);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.mobile-nav a {
  font-family: 'Noto Serif JP', serif;
  font-size: 18px;
  font-weight: 300;
  color: rgba(245,240,232,0.86);
  letter-spacing: 0.1em;
  transition: color var(--transition), background var(--transition);
  width: 100%;
}
.mobile-nav-menu a {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(184,151,90,0.18);
}
.mobile-nav-menu a:first-child {
  border-top: 1px solid rgba(184,151,90,0.18);
}
.mobile-nav-cta {
  margin-top: 8px;
  width: min(420px, 100%);
  text-align: center;
}
.mobile-nav a:hover { color: var(--gold-light); }

/* ===== HERO ===== */
.hero {
  position: relative;
  height: 100vh;
  min-height: 700px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: #0a1522;
}

.hero-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transform: scale(1.04);
  animation: heroZoom 12s ease-out forwards;
}
.hero-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(112deg, rgba(10,18,31,0.74) 0%, rgba(10,18,31,0.34) 42%, rgba(10,18,31,0.78) 100%),
    linear-gradient(to bottom, rgba(10,18,31,0.24) 0%, rgba(10,18,31,0.76) 70%, rgba(10,18,31,0.92) 100%);
}

.hero-lux-frame {
  position: absolute;
  inset: 28px;
  border: 1px solid rgba(212, 180, 122, 0.28);
  z-index: 1;
  pointer-events: none;
}

.hero-glow {
  position: absolute;
  right: -120px;
  top: -80px;
  width: 520px;
  height: 520px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(212,180,122,0.22) 0%, rgba(212,180,122,0) 72%);
  z-index: 1;
  pointer-events: none;
}

@keyframes heroZoom {
  from { transform: scale(1.08); }
  to { transform: scale(1.0); }
}

.hero-content {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 900px;
  margin-left: 0;
  padding: 0 80px 110px;
  animation: heroFadeUp 1.2s 0.4s ease both;
}
@keyframes heroFadeUp {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}

.hero-eyebrow {
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  font-weight: 400;
  color: rgba(245,240,232,0.9);
  letter-spacing: 0.34em;
  text-transform: uppercase;
  margin-bottom: 20px;
  display: block;
}

.hero-title {
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(36px, 5.4vw, 66px);
  font-weight: 300;
  color: var(--white);
  line-height: 1.42;
  letter-spacing: 0.08em;
  margin-bottom: 30px;
  text-shadow: 0 10px 30px rgba(0,0,0,0.42);
}
.hero-title em { font-style: normal; color: var(--gold-light); }

.hero-desc {
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  font-weight: 300;
  color: rgba(245,240,232,0.78);
  line-height: 2.05;
  letter-spacing: 0.05em;
  max-width: 640px;
  margin-bottom: 38px;
}

.hero-actions { display: flex; gap: 20px; flex-wrap: wrap; }

.hero-signature {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 36px;
}

.hero-signature-label {
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  color: rgba(212,180,122,0.95);
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.hero-signature-line {
  width: 72px;
  height: 1px;
  background: linear-gradient(90deg, rgba(212,180,122,0.95), rgba(212,180,122,0.1));
}

.hero-signature-copy {
  font-size: 11px;
  color: rgba(245,240,232,0.6);
  letter-spacing: 0.08em;
}

.hero-scroll {
  position: absolute;
  bottom: 36px;
  right: 80px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  z-index: 2;
}
.hero-scroll span {
  font-family: 'Cormorant Garamond', serif;
  font-size: 11px;
  color: rgba(255,255,255,0.45);
  letter-spacing: 0.3em;
  text-transform: uppercase;
  writing-mode: vertical-rl;
}
.scroll-line {
  width: 1px;
  height: 60px;
  background: linear-gradient(to bottom, rgba(184,151,90,0.8), transparent);
  animation: scrollPulse 2s ease-in-out infinite;
}
@keyframes scrollPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}

/* ===== FEATURES SECTION ===== */
.features-section { background: var(--white); padding: 100px 0; }

.features-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.feature-item {
  padding: 52px 44px;
  border-left: 1px solid var(--border);
  transition: background var(--transition);
}
.feature-item:first-child { border-left: none; }
.feature-item:hover { background: rgba(184,151,90,0.04); }

.feature-number {
  font-family: 'Cormorant Garamond', serif;
  font-size: 42px;
  font-weight: 300;
  color: rgba(184,151,90,0.25);
  line-height: 1;
  margin-bottom: 24px;
}
.feature-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 17px;
  font-weight: 400;
  color: var(--navy);
  letter-spacing: 0.08em;
  margin-bottom: 16px;
  line-height: 1.6;
}
.feature-desc {
  font-size: 13.5px;
  color: var(--text-mid);
  line-height: 2;
  letter-spacing: 0.03em;
}

/* ===== RANKING SECTION ===== */
.ranking-section { background: var(--navy); padding: 100px 0; }

.ranking-intro {
  text-align: center;
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  font-weight: 300;
  color: rgba(245,240,232,0.6);
  line-height: 2;
  letter-spacing: 0.05em;
  max-width: 600px;
  margin: 0 auto 64px;
}

.ranking-list { display: flex; flex-direction: column; gap: 24px; }

.ranking-card {
  display: grid;
  grid-template-columns: 80px 200px 1fr auto;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(184,151,90,0.15);
  overflow: hidden;
  position: relative;
  transition: border-color var(--transition), background var(--transition);
}
.ranking-card:hover { border-color: rgba(184,151,90,0.4); background: rgba(255,255,255,0.07); }
.ranking-card.rank-1 { border-color: rgba(184,151,90,0.4); }
.rank-card-link {
  position: absolute;
  inset: 0;
  z-index: 8;
}
.rank-card-link:focus-visible {
  outline: 2px solid var(--gold-light);
  outline-offset: -2px;
}

.rank-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 140px;
  background: rgba(184,151,90,0.08);
  border-right: 1px solid rgba(184,151,90,0.15);
  padding: 20px 0;
}
.rank-label {
  font-family: 'Cormorant Garamond', serif;
  font-size: 10px;
  color: var(--gold);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  margin-bottom: 6px;
  display: block;
}
.rank-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 40px;
  font-weight: 300;
  color: var(--gold-light);
  line-height: 1;
}
.rank-badge.gold .rank-num { font-size: 48px; }

.rank-thumb {
  width: 200px;
  height: 140px;
  object-fit: cover;
  background: var(--navy-light);
}
.rank-thumb-placeholder {
  width: 200px;
  height: 140px;
  background: linear-gradient(135deg, #1a2e45 0%, #243d5c 100%);
  flex-shrink: 0;
}

.rank-info { padding: 28px 36px; }

.rank-info-header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.rank-company-name {
  font-family: 'Noto Serif JP', serif;
  font-size: 19px;
  font-weight: 400;
  color: var(--cream);
  letter-spacing: 0.05em;
}

.rank-tag {
  font-size: 10px;
  font-weight: 300;
  color: var(--gold);
  border: 1px solid rgba(184,151,90,0.45);
  padding: 3px 10px;
  letter-spacing: 0.1em;
}

.rank-catchphrase {
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  font-weight: 300;
  color: rgba(245,240,232,0.55);
  letter-spacing: 0.05em;
  line-height: 1.8;
  margin-bottom: 18px;
}

.rank-chips { display: flex; gap: 10px; flex-wrap: wrap; }

.tag-chip {
  font-size: 11px;
  font-weight: 300;
  color: rgba(245,240,232,0.7);
  background: rgba(255,255,255,0.06);
  padding: 4px 12px;
  letter-spacing: 0.08em;
}

.rank-metrics {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 28px 36px;
  border-left: 1px solid rgba(184,151,90,0.12);
  min-width: 180px;
}

.metric { text-align: right; }
.metric-label {
  font-size: 10px;
  font-weight: 300;
  color: rgba(245,240,232,0.4);
  letter-spacing: 0.15em;
  margin-bottom: 4px;
}
.metric-value {
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px;
  font-weight: 300;
  color: var(--gold-light);
}
.metric-unit {
  font-size: 11px;
  color: rgba(245,240,232,0.5);
  margin-left: 2px;
}

.ranking-footer { text-align: center; margin-top: 52px; }

/* ===== CRITERIA SECTION ===== */
.criteria-section { background: var(--cream); padding: 100px 0; }

.criteria-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px;
}

.criteria-item {
  background: var(--white);
  padding: 48px 44px;
  display: flex;
  gap: 28px;
  align-items: flex-start;
  transition: box-shadow var(--transition);
}
.criteria-item:hover { box-shadow: 0 8px 40px rgba(13,27,42,0.08); z-index: 1; position: relative; }

.criteria-icon {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  border: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
}
.criteria-icon svg {
  width: 22px; height: 22px;
  stroke: var(--gold); fill: none; stroke-width: 1.5;
}

.criteria-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 16px;
  font-weight: 400;
  color: var(--navy);
  letter-spacing: 0.06em;
  margin-bottom: 12px;
}
.criteria-desc {
  font-size: 13.5px;
  color: var(--text-mid);
  line-height: 2;
  letter-spacing: 0.02em;
}

/* ===== TESTIMONIAL ===== */
.testimonial-section {
  background: var(--navy-mid);
  padding: 72px 0;
  text-align: center;
}
.testimonial-inner { max-width: 800px; margin: 0 auto; }
.quote-mark {
  font-family: 'Cormorant Garamond', serif;
  font-size: 80px;
  color: rgba(184,151,90,0.25);
  line-height: 1;
  margin-bottom: -16px;
  display: block;
}
.quote-text {
  font-family: 'Noto Serif JP', serif;
  font-size: 17px;
  font-weight: 300;
  color: rgba(245,240,232,0.85);
  line-height: 2.2;
  letter-spacing: 0.06em;
  margin-bottom: 28px;
}
.quote-attribution {
  font-size: 12px;
  color: var(--gold);
  letter-spacing: 0.2em;
}

/* ===== CTA BANNER ===== */
.cta-section { background: var(--cream-dark); padding: 100px 0; }

.cta-inner {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 60px;
}
.cta-title {
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(20px, 2.8vw, 32px);
  font-weight: 300;
  color: var(--navy);
  letter-spacing: 0.06em;
  line-height: 1.7;
  margin-bottom: 16px;
}
.cta-sub {
  font-size: 14px;
  color: var(--text-mid);
  line-height: 2;
  letter-spacing: 0.03em;
}
.cta-buttons { display: flex; flex-direction: column; gap: 14px; flex-shrink: 0; }
.cta-buttons .btn-outline { color: var(--navy); border-color: rgba(13,27,42,0.3); }
.cta-buttons .btn-outline:hover { border-color: var(--navy); }

/* ===== PAGE HERO (inner pages) ===== */
.page-hero {
  background: var(--navy);
  padding: 160px 0 80px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.page-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center top, rgba(184,151,90,0.1) 0%, transparent 70%);
}
.page-hero-eyebrow {
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  color: var(--gold);
  letter-spacing: 0.35em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 16px;
}
.page-hero-title {
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(24px, 4vw, 44px);
  font-weight: 300;
  color: var(--cream);
  letter-spacing: 0.08em;
  line-height: 1.6;
  position: relative;
}

/* ===== BREADCRUMB ===== */
.breadcrumb {
  background: var(--white);
  border-bottom: 1px solid var(--border);
  padding: 14px 0;
}
.breadcrumb-list {
  display: flex;
  gap: 8px;
  align-items: center;
  font-size: 12px;
  color: var(--text-light);
  letter-spacing: 0.05em;
}
.breadcrumb-list a { color: var(--gold); transition: color var(--transition); }
.breadcrumb-list a:hover { color: var(--navy); }
.breadcrumb-sep { color: var(--text-light); }

/* ===== SERVICE PAGE ===== */
.service-section { background: var(--white); padding: 100px 0; }

.service-plans {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  margin-bottom: 80px;
}

.plan-card {
  background: var(--cream);
  padding: 48px 36px;
  position: relative;
  transition: background var(--transition), box-shadow var(--transition);
}
.plan-card:hover { background: var(--white); box-shadow: 0 12px 48px rgba(13,27,42,0.1); z-index: 1; }
.plan-card.featured {
  background: var(--navy);
  color: var(--cream);
}
.plan-card.featured:hover { background: var(--navy-mid); }

.plan-badge {
  position: absolute;
  top: 0; right: 0;
  background: var(--gold);
  color: var(--navy);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.15em;
  padding: 6px 16px;
}

.plan-name {
  font-family: 'Noto Serif JP', serif;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0.08em;
  margin-bottom: 8px;
  color: var(--navy);
}
.plan-card.featured .plan-name { color: var(--cream); }

.plan-name-en {
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  color: var(--gold);
  letter-spacing: 0.25em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 24px;
}

.plan-price {
  margin-bottom: 32px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--border);
}
.plan-card.featured .plan-price { border-bottom-color: rgba(184,151,90,0.25); }

.plan-price-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 48px;
  font-weight: 300;
  color: var(--gold);
  line-height: 1;
}
.plan-price-unit { font-size: 14px; color: var(--text-mid); margin-top: 6px; }
.plan-card.featured .plan-price-unit { color: rgba(245,240,232,0.6); }

.plan-features { display: flex; flex-direction: column; gap: 14px; margin-bottom: 36px; }

.plan-feature {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 13.5px;
  color: var(--text-mid);
  line-height: 1.7;
}
.plan-card.featured .plan-feature { color: rgba(245,240,232,0.75); }
.plan-feature-check {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  border: 1px solid var(--gold);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
}
.plan-feature-check::after {
  content: '';
  width: 6px;
  height: 4px;
  border-left: 1px solid var(--gold);
  border-bottom: 1px solid var(--gold);
  transform: rotate(-45deg) translate(1px, -1px);
}

/* ===== ABOUT PAGE ===== */
.about-section { background: var(--white); padding: 100px 0; }

.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  margin-bottom: 80px;
}
.about-grid.reverse { direction: rtl; }
.about-grid.reverse > * { direction: ltr; }

.about-img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  background: var(--cream-dark);
}
.about-img-placeholder {
  width: 100%;
  aspect-ratio: 4/3;
  background: linear-gradient(135deg, var(--navy-mid), var(--navy-light));
}

.about-eyebrow {
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  color: var(--gold);
  letter-spacing: 0.3em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 16px;
}
.about-title {
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(20px, 2.5vw, 28px);
  font-weight: 300;
  color: var(--navy);
  letter-spacing: 0.08em;
  line-height: 1.7;
  margin-bottom: 24px;
}
.about-body {
  font-size: 14px;
  color: var(--text-mid);
  line-height: 2.2;
  letter-spacing: 0.03em;
}

/* Team */
.team-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  margin-top: 64px;
}
.team-card { text-align: center; }
.team-photo {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  background: var(--cream-dark);
  margin-bottom: 20px;
}
.team-photo-placeholder {
  width: 100%;
  aspect-ratio: 1;
  background: linear-gradient(135deg, var(--navy-mid), var(--navy-light));
  margin-bottom: 20px;
}
.team-name {
  font-family: 'Noto Serif JP', serif;
  font-size: 16px;
  font-weight: 400;
  color: var(--navy);
  letter-spacing: 0.08em;
  margin-bottom: 4px;
}
.team-role {
  font-size: 12px;
  color: var(--gold);
  letter-spacing: 0.15em;
  margin-bottom: 16px;
}
.team-bio { font-size: 13px; color: var(--text-mid); line-height: 1.9; }

/* ===== ACCESS PAGE ===== */
.access-section { background: var(--white); padding: 100px 0; }

.access-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: start;
}
.access-map-embed {
  width: 100%;
  aspect-ratio: 4/3;
  background: var(--cream-dark);
  border: 1px solid var(--border);
  overflow: hidden;
}
.access-map-embed iframe { width: 100%; height: 100%; border: none; display: block; }

.access-info { display: flex; flex-direction: column; gap: 36px; }

.info-label {
  font-family: 'Cormorant Garamond', serif;
  font-size: 11px;
  color: var(--gold);
  letter-spacing: 0.3em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
}
.info-body {
  font-family: 'Noto Serif JP', serif;
  font-size: 15px;
  font-weight: 300;
  color: var(--navy);
  line-height: 1.9;
  letter-spacing: 0.05em;
}
.info-note {
  font-size: 12px;
  color: var(--text-light);
  margin-top: 8px;
  line-height: 1.7;
}

.hours-table { width: 100%; border-collapse: collapse; margin-top: 12px; }
.hours-table td {
  padding: 8px 0;
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  font-weight: 300;
  color: var(--text-mid);
  border-bottom: 1px solid rgba(184,151,90,0.1);
}
.hours-table td:first-child { color: var(--navy); letter-spacing: 0.05em; width: 40%; }
.hours-table .closed { color: var(--text-light); }

/* ===== CONTACT PAGE ===== */
.contact-section { background: var(--cream); padding: 100px 0; }

/* ===== COMPARE PAGE ===== */
.compare-section { background: var(--cream); }

.compare-intro {
  max-width: 780px;
  margin: 0 auto 56px;
  text-align: center;
  font-size: 14px;
  color: var(--text-mid);
  line-height: 2;
  letter-spacing: 0.04em;
}

.compare-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  align-items: stretch;
}

.compare-type-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: 42px 34px;
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.24);
  box-shadow: 0 18px 50px rgba(13,27,42,0.08);
}

.compare-card-number {
  display: block;
  margin-bottom: 18px;
  color: rgba(184,151,90,0.38);
  font-family: 'Cormorant Garamond', serif;
  font-size: 42px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: 0.06em;
}

.compare-card-title {
  margin: 0 0 16px;
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: 22px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.08em;
}

.compare-card-summary {
  margin: 0 0 28px;
  padding-bottom: 24px;
  color: var(--text-mid);
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  line-height: 1.9;
  letter-spacing: 0.04em;
  border-bottom: 1px solid rgba(184,151,90,0.18);
}

.compare-detail-list {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.compare-detail-item {
  display: block;
}

.compare-detail-label {
  margin: 0 0 6px;
  color: var(--gold);
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: 0.12em;
}

.compare-detail-text {
  margin: 0;
  color: var(--text-mid);
  font-size: 13px;
  line-height: 1.85;
  letter-spacing: 0.03em;
}

.compare-summary-card {
  max-width: 900px;
  margin: 42px auto 0;
  padding: 42px 48px;
  text-align: center;
  background: var(--navy);
  border: 1px solid rgba(184,151,90,0.38);
  box-shadow: 0 18px 50px rgba(13,27,42,0.12);
}

.compare-summary-card h3 {
  margin: 0 0 16px;
  color: var(--cream);
  font-family: 'Noto Serif JP', serif;
  font-size: 22px;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0.08em;
}

.compare-summary-card p {
  max-width: 720px;
  margin: 0 auto;
  color: rgba(245,240,232,0.78);
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}

@media (max-width: 1080px) {
  .compare-card-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .compare-type-card {
    padding: 36px 28px;
  }

  .compare-summary-card {
    padding: 36px 28px;
  }
}

@media (max-width: 640px) {
  .compare-card-grid {
    gap: 20px;
  }

  .compare-type-card,
  .compare-summary-card {
    padding: 30px 22px;
  }

  .compare-card-title,
  .compare-summary-card h3 {
    font-size: 19px;
  }
}

.compare-table-wrap {
  border: 1px solid rgba(184,151,90,0.28);
  background: var(--white);
  box-shadow: 0 18px 50px rgba(13,27,42,0.08);
  overflow-x: auto;
}

.compare-table {
  width: 100%;
  min-width: 1040px;
  border-collapse: collapse;
}

.compare-table th,
.compare-table td {
  border-bottom: 1px solid rgba(184,151,90,0.18);
  padding: 16px 14px;
  vertical-align: top;
}

.compare-table thead th {
  background: var(--navy);
  color: rgba(245,240,232,0.88);
  font-family: 'Noto Serif JP', serif;
  font-size: 12px;
  font-weight: 300;
  letter-spacing: 0.12em;
  white-space: nowrap;
}

.compare-table tbody tr:hover { background: rgba(184,151,90,0.05); }

.compare-company {
  font-family: 'Noto Serif JP', serif;
  font-size: 15px;
  color: var(--navy);
  letter-spacing: 0.04em;
  margin-bottom: 8px;
}

.compare-tag {
  display: inline-block;
  font-size: 10px;
  color: var(--gold);
  border: 1px solid rgba(184,151,90,0.45);
  padding: 3px 8px;
  letter-spacing: 0.08em;
}

.compare-highlight {
  font-family: 'Noto Serif JP', serif;
  color: var(--navy);
  font-size: 13px;
  line-height: 1.8;
}

.compare-cell {
  font-size: 13px;
  color: var(--text-mid);
  line-height: 1.8;
  letter-spacing: 0.02em;
}

.compare-link {
  display: inline-block;
  font-size: 12px;
  color: var(--gold);
  border: 1px solid rgba(184,151,90,0.45);
  padding: 8px 14px;
  letter-spacing: 0.08em;
  transition: all var(--transition);
}

.compare-link:hover {
  background: rgba(184,151,90,0.08);
  border-color: var(--gold);
}

.compare-note {
  margin-top: 20px;
  font-size: 12px;
  color: var(--text-light);
  letter-spacing: 0.04em;
  line-height: 1.7;
}

/* ===== COMPANY DETAIL PAGE ===== */
.company-detail-section {
  background: var(--cream);
}

.company-detail-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.company-detail-card {
  background: var(--navy);
  border: 1px solid rgba(184,151,90,0.24);
  display: grid;
  grid-template-columns: 1fr;
  grid-template-areas:
    "rank"
    "body"
    "footer";
  gap: 0;
  overflow: hidden;
}

.company-rank-badge {
  grid-area: rank;
  background: rgba(184,151,90,0.1);
  border-right: 1px solid rgba(184,151,90,0.22);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100%;
  padding: 22px 8px;
}

.company-rank-label {
  font-family: 'Cormorant Garamond', serif;
  font-size: 10px;
  color: var(--gold);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  margin-bottom: 6px;
}

.company-rank-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 42px;
  line-height: 1;
  color: var(--gold-light);
}

.company-detail-body {
  grid-area: body;
  display: grid;
  grid-template-columns: clamp(300px, 38%, 400px) minmax(0, 1fr);
  align-items: stretch;
  min-width: 0;
}

.company-detail-media {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px 24px 28px 32px;
  min-width: 0;
  border-right: 1px solid rgba(184,151,90,0.14);
}

.company-detail-main {
  padding: 28px 36px 28px 28px;
  min-width: 0;
}

.company-detail-footer {
  grid-area: footer;
  padding: 0 32px 30px;
  border-top: 1px solid rgba(184,151,90,0.18);
  background: rgba(13,27,42,0.22);
}

.company-detail-footer .company-detail-cta,
.company-detail-footer .btn-primary {
  display: block;
  width: 100%;
  box-sizing: border-box;
  text-align: center;
  padding: 18px 28px;
  font-size: 14px;
  letter-spacing: 0.14em;
}

.company-detail-name {
  font-family: 'Noto Serif JP', serif;
  font-size: 24px;
  font-weight: 400;
  color: var(--cream);
  letter-spacing: 0.05em;
  margin-bottom: 12px;
}

.company-detail-catch {
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  color: rgba(245,240,232,0.72);
  letter-spacing: 0.04em;
  line-height: 1.9;
  margin-bottom: 22px;
}

.company-detail-metrics {
  display: flex;
  gap: 24px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.company-detail-metric {
  display: flex;
  align-items: baseline;
  gap: 10px;
}

.metric-head {
  font-size: 11px;
  color: rgba(245,240,232,0.5);
  letter-spacing: 0.12em;
}

.metric-body {
  font-family: 'Cormorant Garamond', serif;
  font-size: 24px;
  color: var(--gold-light);
}

.company-detail-specs {
  display: grid;
  gap: 10px;
}

.company-spec-row {
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 12px;
  border-top: 1px solid rgba(184,151,90,0.14);
  padding-top: 10px;
}

.company-spec-row dt {
  font-size: 11px;
  color: rgba(245,240,232,0.52);
  letter-spacing: 0.1em;
}

.company-spec-row dd {
  font-size: 13px;
  color: rgba(245,240,232,0.82);
  letter-spacing: 0.03em;
  line-height: 1.8;
}

.company-card-screenshot {
  position: relative;
  flex: 0 0 auto;
  margin: 0;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid rgba(184,151,90,0.28);
  background: linear-gradient(145deg, rgba(13,27,42,0.08), rgba(184,151,90,0.08));
  aspect-ratio: 16 / 9;
  height: auto;
  box-shadow: 0 14px 36px rgba(13,27,42,0.14);
}

.company-card-screenshot.is-fallback::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 55%, rgba(13,27,42,0.18));
}

.company-card-screenshot-image {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
  object-position: top;
  transition: transform 0.45s ease;
}

.company-detail-card:hover .company-card-screenshot-image:not(.is-fallback) {
  transform: scale(1.03);
}

/* Legacy alias: action column removed; footer hosts CTA */
.company-detail-action {
  display: contents;
}

.company-cta-banner {
  margin-top: 52px;
  background: linear-gradient(135deg, rgba(13,27,42,0.95), rgba(26,46,69,0.95));
  border: 1px solid rgba(184,151,90,0.24);
  padding: 36px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}

.company-cta-text {
  font-family: 'Noto Serif JP', serif;
  font-size: 22px;
  color: var(--cream);
  letter-spacing: 0.05em;
  line-height: 1.6;
}

.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 80px;
  align-items: start;
}

.contact-info { display: flex; flex-direction: column; gap: 32px; }

.contact-info-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 22px;
  font-weight: 300;
  color: var(--navy);
  letter-spacing: 0.08em;
  line-height: 1.6;
  margin-bottom: 8px;
}
.contact-info-desc { font-size: 14px; color: var(--text-mid); line-height: 2; }

.contact-detail {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding-top: 20px;
  border-top: 1px solid var(--border);
}
.contact-detail-icon {
  width: 40px;
  height: 40px;
  border: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.contact-detail-icon svg { width: 18px; height: 18px; stroke: var(--gold); fill: none; stroke-width: 1.5; }
.contact-detail-label { font-size: 10px; color: var(--gold); letter-spacing: 0.2em; display: block; margin-bottom: 4px; }
.contact-detail-value { font-family: 'Noto Serif JP', serif; font-size: 16px; color: var(--navy); letter-spacing: 0.05em; }

/* CF7 Form Overrides */
.wpcf7-form { display: flex; flex-direction: column; gap: 20px; }
.contact-form-group { display: flex; flex-direction: column; gap: 8px; }
.contact-form-group label {
  font-family: 'Noto Serif JP', serif;
  font-size: 12px;
  font-weight: 400;
  color: var(--navy);
  letter-spacing: 0.15em;
}
.contact-form-group label .required {
  color: var(--gold);
  margin-left: 6px;
  font-size: 10px;
}
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form textarea,
.contact-field {
  width: 100%;
  background: var(--white);
  border: 1px solid var(--border);
  padding: 14px 18px;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 14px;
  font-weight: 300;
  color: var(--text-dark);
  outline: none;
  transition: border-color var(--transition);
  border-radius: 0;
  appearance: none;
}
.wpcf7-form input:focus,
.wpcf7-form textarea:focus,
.contact-field:focus { border-color: var(--gold); }
.wpcf7-form textarea { min-height: 160px; resize: vertical; }
.wpcf7-submit,
.contact-submit {
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  font-weight: 400;
  color: var(--navy);
  background: var(--gold);
  border: none;
  padding: 18px 60px;
  letter-spacing: 0.15em;
  cursor: pointer;
  transition: background var(--transition);
  align-self: flex-start;
}
.wpcf7-submit:hover, .contact-submit:hover { background: var(--gold-light); }

/* ===== FOOTER ===== */
#site-footer { background: var(--navy); padding: 60px 0 36px; }

.footer-inner {
  display: grid;
  grid-template-columns: 1.4fr repeat(3, 1fr);
  gap: 48px;
  margin-bottom: 52px;
}

.footer-logo-en {
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px;
  font-weight: 400;
  color: var(--gold-light);
  letter-spacing: 0.15em;
  display: block;
  margin-bottom: 4px;
}
.footer-logo-jp {
  font-family: 'Noto Serif JP', serif;
  font-size: 10px;
  color: rgba(255,255,255,0.3);
  letter-spacing: 0.2em;
  display: block;
  margin-bottom: 20px;
}
.footer-tagline {
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  font-weight: 300;
  color: rgba(245,240,232,0.45);
  line-height: 1.9;
  letter-spacing: 0.04em;
}

.footer-col-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 12px;
  font-weight: 400;
  color: var(--gold);
  letter-spacing: 0.2em;
  margin-bottom: 20px;
}

.footer-menu { display: flex; flex-direction: column; gap: 12px; }
.footer-menu a {
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  font-weight: 300;
  color: rgba(245,240,232,0.5);
  letter-spacing: 0.05em;
  transition: color var(--transition);
}
.footer-menu a:hover { color: var(--gold-light); }

.footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: 28px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.footer-copy { font-size: 11px; color: rgba(255,255,255,0.25); letter-spacing: 0.08em; }
.footer-note { font-size: 11px; color: rgba(255,255,255,0.2); letter-spacing: 0.05em; }

/* ===== AREA HUB PAGE ===== */
.area-hub-section {
  background: var(--cream);
}

.area-hub-lead {
  max-width: 820px;
  margin: 0 auto 56px;
  text-align: center;
  color: var(--text-mid);
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  line-height: 2.1;
  letter-spacing: 0.04em;
}

.area-hub-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
}

.area-hub-card {
  position: relative;
  display: flex;
  min-height: 280px;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(13,27,42,0.94), rgba(26,46,69,0.9)),
    linear-gradient(135deg, rgba(184,151,90,0.22), transparent);
  border: 1px solid rgba(184,151,90,0.28);
  box-shadow: 0 18px 50px rgba(13,27,42,0.1);
  transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}

.area-hub-card__media {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.area-hub-card__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}

.area-hub-card:hover .area-hub-card__image {
  transform: scale(1.05);
}

.area-hub-card__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(13,27,42,0.15) 0%, rgba(13,27,42,0.55) 45%, rgba(13,27,42,0.92) 100%),
    linear-gradient(135deg, rgba(184,151,90,0.12), transparent);
  pointer-events: none;
}

.area-hub-card__body {
  position: relative;
  z-index: 1;
  display: flex;
  min-height: 280px;
  flex-direction: column;
  justify-content: flex-end;
  padding: 34px 32px;
}

.area-hub-card::before {
  content: '';
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(184,151,90,0.16);
  pointer-events: none;
}

.area-hub-card:hover {
  transform: translateY(-8px);
  border-color: rgba(184,151,90,0.48);
  box-shadow: 0 26px 70px rgba(13,27,42,0.16);
}

.area-hub-label {
  position: relative;
  z-index: 1;
  margin-bottom: 18px;
  color: var(--gold-light);
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.area-hub-card h2 {
  position: relative;
  z-index: 1;
  margin: 0 0 16px;
  color: var(--cream);
  font-family: 'Noto Serif JP', serif;
  font-size: 21px;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0.07em;
}

.area-hub-card p {
  position: relative;
  z-index: 1;
  margin: 0 0 24px;
  color: rgba(245,240,232,0.72);
  font-size: 13px;
  line-height: 1.9;
  letter-spacing: 0.03em;
}

.area-hub-link {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-self: flex-start;
  color: var(--gold-light);
  font-family: 'Noto Serif JP', serif;
  font-size: 12px;
  letter-spacing: 0.1em;
  border-bottom: 1px solid rgba(212,180,122,0.48);
  padding-bottom: 6px;
}

.partner-type-section {
  margin-top: 96px;
}

.partner-type-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2px;
  background: rgba(184,151,90,0.16);
  border: 1px solid rgba(184,151,90,0.18);
}

.partner-type-card {
  background: var(--white);
  padding: 38px 32px;
}

.partner-type-card h3 {
  margin: 0 0 16px;
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.06em;
}

.partner-type-card p {
  margin: 0;
  color: var(--text-mid);
  font-size: 13px;
  line-height: 2;
  letter-spacing: 0.03em;
}

@media (max-width: 1024px) {
  .area-hub-grid,
  .partner-type-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .area-hub-lead {
    text-align: left;
    margin-bottom: 36px;
  }

  .area-hub-grid,
  .partner-type-grid {
    grid-template-columns: 1fr;
  }

  .area-hub-card {
    min-height: 240px;
  }

  .area-hub-card__body {
    min-height: 240px;
    padding: 30px 24px;
  }

  .partner-type-section {
    margin-top: 72px;
  }

  .partner-type-card {
    padding: 30px 24px;
  }
}

/* ===== SCROLL REVEAL ===== */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.is-visible { opacity: 1; transform: translateY(0); }

/* ===== WORDPRESS CORE ===== */
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: 12px; color: var(--text-light); margin-top: 8px; }
.aligncenter { display: block; margin: 0 auto; }
.alignright { float: right; margin-left: 24px; }
.alignleft { float: left; margin-right: 24px; }
.entry-content p { margin-bottom: 1.5em; line-height: 1.9; }
.entry-content h2 { font-family: 'Noto Serif JP', serif; font-size: 22px; color: var(--navy); margin: 2em 0 1em; }
.entry-content h3 { font-family: 'Noto Serif JP', serif; font-size: 18px; color: var(--navy); margin: 1.5em 0 0.75em; }

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
  .service-plans { grid-template-columns: 1fr; }
  .about-grid { grid-template-columns: 1fr; gap: 40px; }
  .about-grid.reverse { direction: ltr; }
  .team-grid { grid-template-columns: repeat(2, 1fr); }
  .access-grid { grid-template-columns: 1fr; }
  .contact-grid { grid-template-columns: 1fr; }
}

@media (max-width: 960px) {
  #site-header { padding: 0 24px; }
  .main-navigation, .header-cta { display: none; }
  .hamburger { display: flex; }

  .hero { min-height: 620px; }
  .hero-content { padding: 0 24px 80px; }
  .hero-scroll { right: 24px; }
  .hero-lux-frame { inset: 18px; }
  .hero-signature {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
  .hero-signature-line { width: 56px; }
  .container { padding: 0 24px; }
  .section-pad { padding: 72px 0; }

  .features-grid { grid-template-columns: 1fr; }
  .feature-item { border-left: none; border-top: 1px solid var(--border); padding: 40px 0; }
  .feature-item:first-child { border-top: none; }

  .ranking-card { grid-template-columns: 60px 1fr; grid-template-rows: auto auto; }
  .rank-thumb, .rank-thumb-placeholder { display: none; }
  .rank-info { padding: 20px; }
  .rank-metrics {
    grid-column: 2;
    border-left: none;
    border-top: 1px solid rgba(184,151,90,0.12);
    padding: 16px 20px;
    flex-direction: row;
    gap: 24px;
  }
  .metric { text-align: left; }
  .rank-badge { min-height: auto; }

  .criteria-grid { grid-template-columns: 1fr; gap: 1px; }
  .criteria-item { padding: 36px 24px; }
  .compare-table th,
  .compare-table td { padding: 12px 10px; }
  .compare-company { font-size: 14px; }
  .compare-cell, .compare-highlight { font-size: 12px; }
  .company-detail-card {
    grid-template-columns: 1fr;
  }
  .company-rank-badge {
    border-right: none;
    border-bottom: 1px solid rgba(184,151,90,0.22);
    flex-direction: row;
    gap: 10px;
    justify-content: flex-start;
    padding: 12px 18px;
  }
  .company-rank-label { margin-bottom: 0; }
  .company-rank-num { font-size: 30px; }
  .company-detail-main { padding: 22px 20px; }
  .company-detail-name { font-size: 20px; }
  .company-spec-row {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .company-detail-footer {
    padding: 0 20px 22px;
  }
  .company-cta-text { font-size: 18px; }

  .cta-inner { grid-template-columns: 1fr; gap: 36px; }
  .cta-buttons { flex-direction: row; flex-wrap: wrap; }

  .footer-inner { grid-template-columns: 1fr; gap: 40px; }
  .footer-bottom { flex-direction: column; gap: 12px; text-align: center; }
}

@media (max-width: 480px) {
  .hero-title { font-size: 30px; }
  .hero-desc { font-size: 13px; line-height: 1.9; }
  .hero-lux-frame { inset: 12px; }
  .hero-actions { flex-direction: column; }
  .hero-actions a { text-align: center; }
  .team-grid { grid-template-columns: 1fr; }
  .about-grid { gap: 28px; }
}

/* ===== AREA PAGE: PURCHASE VS BUILD ===== */
.area-comparison-section {
  --comparison-text: rgba(245, 240, 232, 0.9);
  --comparison-text-muted: rgba(245, 240, 232, 0.78);
  background: var(--navy);
  color: var(--comparison-text);
  border-top: 1px solid rgba(184,151,90,0.2);
  border-bottom: 1px solid rgba(184,151,90,0.2);
}

.area-comparison-section .section-title {
  color: var(--cream);
  margin-bottom: 28px;
}

.area-comparison-title {
  text-align: center;
  line-height: 1.65;
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
}

.area-comparison-title-choice {
  display: inline-block;
  margin-top: 4px;
}

.area-comparison-title-purchase,
.area-comparison-title-build {
  font-weight: 400;
  padding: 0 2px;
  border-bottom: 1px solid transparent;
}

.area-comparison-title-purchase {
  color: rgba(232, 224, 208, 0.88);
  border-bottom-color: rgba(232, 224, 208, 0.35);
}

.area-comparison-title-build {
  color: var(--gold-light);
  border-bottom-color: rgba(212, 180, 122, 0.55);
}

.area-comparison-title-join {
  color: rgba(245, 240, 232, 0.72);
  font-weight: 300;
}

.area-comparison-lead {
  max-width: 820px;
  margin: 0 auto 24px;
  font-family: 'Noto Serif JP', serif;
  font-size: 16px;
  font-weight: 300;
  color: var(--comparison-text);
  line-height: 1.95;
  letter-spacing: 0.04em;
}

.area-comparison-risks {
  max-width: 820px;
  margin: 0 auto 52px;
  padding: 28px 32px;
  border: 1px solid rgba(184,151,90,0.28);
  background: rgba(255,255,255,0.04);
}

.area-comparison-risks-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  font-weight: 400;
  color: var(--gold-light);
  letter-spacing: 0.18em;
  margin: 0 0 16px;
}

.area-comparison-risks ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.area-comparison-risks li {
  position: relative;
  padding-left: 18px;
  font-family: 'Noto Serif JP', serif;
  font-size: 15px;
  font-weight: 300;
  color: var(--comparison-text);
  line-height: 1.9;
  letter-spacing: 0.04em;
}

.area-comparison-risks li + li { margin-top: 12px; }

.area-comparison-risks li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.72em;
  width: 6px;
  height: 1px;
  background: var(--gold);
}

.area-comparison-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  margin-bottom: 44px;
}

.area-comparison-card {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(245,240,232,0.14);
  padding: 36px 32px;
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.area-comparison-card--build {
  border: 1px solid var(--gold);
  background: rgba(184,151,90,0.12);
  box-shadow:
    0 0 0 1px rgba(184,151,90,0.15),
    0 12px 40px rgba(0,0,0,0.2);
  position: relative;
}

.area-comparison-card--build::before {
  content: 'Recommended';
  position: absolute;
  top: 0;
  right: 28px;
  transform: translateY(-50%);
  font-family: 'Cormorant Garamond', serif;
  font-size: 11px;
  letter-spacing: 0.2em;
  color: var(--navy);
  background: var(--gold);
  padding: 6px 14px;
}

.area-comparison-card-label {
  font-family: 'Cormorant Garamond', serif;
  font-size: 14px;
  letter-spacing: 0.22em;
  color: var(--gold-light);
  margin: 0;
}

.area-comparison-card-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 21px;
  font-weight: 400;
  color: var(--cream);
  letter-spacing: 0.06em;
  margin: 0;
  line-height: 1.55;
}

.area-comparison-card-sub {
  display: block;
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  font-weight: 300;
  color: var(--comparison-text-muted);
  letter-spacing: 0.06em;
  margin-top: 6px;
  line-height: 1.8;
}

.area-comparison-list {
  margin: 0;
  padding: 0;
  list-style: none;
  flex: 1;
}

.area-comparison-list li {
  position: relative;
  padding-left: 16px;
  font-family: 'Noto Serif JP', serif;
  font-size: 15px;
  font-weight: 300;
  line-height: 1.9;
  letter-spacing: 0.03em;
  color: var(--comparison-text-muted);
}

.area-comparison-list li + li { margin-top: 12px; }

.area-comparison-list li::before {
  content: '—';
  position: absolute;
  left: 0;
  color: rgba(184,151,90,0.75);
  font-size: 12px;
}

.area-comparison-card--build .area-comparison-list li {
  color: var(--comparison-text);
}

.area-comparison-verdict {
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  font-weight: 400;
  color: var(--gold-light);
  letter-spacing: 0.08em;
  margin: 0;
  padding-top: 18px;
  line-height: 1.85;
  border-top: 1px solid rgba(184,151,90,0.25);
}

.area-comparison-conclusion {
  max-width: 820px;
  margin: 0 auto;
  padding: 32px 36px;
  border-left: 3px solid var(--gold);
  background: rgba(255,255,255,0.05);
  font-family: 'Noto Serif JP', serif;
  font-size: 16px;
  font-weight: 300;
  color: var(--comparison-text);
  line-height: 1.95;
  letter-spacing: 0.04em;
}

.area-comparison-conclusion strong {
  font-weight: 400;
  color: var(--gold-light);
}

.area-comparison-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 16px 20px;
  margin-top: 44px;
  padding-top: 8px;
}

.area-comparison-btn {
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.1em;
  padding: 16px 36px;
  min-width: 220px;
  text-align: center;
  transition: background var(--transition), color var(--transition), border-color var(--transition), box-shadow var(--transition);
}

.area-comparison-btn--primary {
  color: var(--navy);
  background: var(--gold);
  border: 1px solid var(--gold);
  box-shadow: 0 6px 24px rgba(184,151,90,0.35);
}

.area-comparison-btn--primary:hover {
  background: var(--gold-light);
  border-color: var(--gold-light);
  color: var(--navy);
  box-shadow: 0 8px 28px rgba(184,151,90,0.45);
}

.area-comparison-btn--secondary {
  color: var(--cream);
  background: transparent;
  border: 1px solid rgba(245,240,232,0.55);
}

.area-comparison-btn--secondary:hover {
  border-color: var(--gold-light);
  color: var(--gold-light);
  background: rgba(184,151,90,0.08);
}

@media (max-width: 768px) {
  .area-comparison-lead {
    font-size: 15px;
    line-height: 1.9;
  }

  .area-comparison-risks {
    margin-bottom: 44px;
    padding: 22px 20px;
  }

  .area-comparison-risks li {
    font-size: 14px;
    line-height: 1.9;
  }

  .area-comparison-cards {
    grid-template-columns: 1fr;
    gap: 48px;
    margin-bottom: 40px;
  }

  .area-comparison-card {
    padding: 30px 24px;
  }

  .area-comparison-card--build {
    order: -1;
    margin-bottom: 4px;
  }

  .area-comparison-card--build::before {
    right: 22px;
  }

  .area-comparison-card-title {
    font-size: 19px;
  }

  .area-comparison-list li {
    font-size: 14px;
    line-height: 1.9;
  }

  .area-comparison-verdict {
    font-size: 14px;
  }

  .area-comparison-conclusion {
    padding: 24px 22px;
    font-size: 15px;
    line-height: 1.9;
  }

  .area-comparison-actions {
    flex-direction: column;
    gap: 14px;
    margin-top: 36px;
  }

  .area-comparison-btn {
    width: 100%;
    max-width: 320px;
    min-width: 0;
    padding: 15px 24px;
  }
}

/* ===== AREA PAGE FAQ ===== */
.area-faq-section {
  background: var(--white);
  border-top: 1px solid rgba(184,151,90,0.15);
}

.area-faq-lead {
  max-width: 720px;
  margin: 20px 0 48px;
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  font-weight: 300;
  color: var(--text-mid);
  line-height: 2;
  letter-spacing: 0.04em;
}

.area-faq-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 900px;
}

.area-faq-item {
  border: 1px solid rgba(184,151,90,0.22);
  background: var(--cream);
  transition: border-color var(--transition), box-shadow var(--transition);
}

.area-faq-item[open] {
  border-color: rgba(184,151,90,0.45);
  box-shadow: 0 4px 24px rgba(13,27,42,0.06);
}

.area-faq-question {
  list-style: none;
  cursor: pointer;
  padding: 22px 56px 22px 28px;
  font-family: 'Noto Serif JP', serif;
  font-size: 15px;
  font-weight: 400;
  color: var(--navy);
  letter-spacing: 0.04em;
  line-height: 1.7;
  position: relative;
}

.area-faq-question::-webkit-details-marker { display: none; }

.area-faq-question::marker { content: ''; }

.area-faq-question::after {
  content: '';
  position: absolute;
  right: 28px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-right: 1px solid var(--gold);
  border-bottom: 1px solid var(--gold);
  transform: translateY(-65%) rotate(45deg);
  transition: transform var(--transition);
}

.area-faq-item[open] .area-faq-question::after {
  transform: translateY(-35%) rotate(-135deg);
}

.area-faq-answer {
  padding: 0 28px 24px;
}

.area-faq-answer p {
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  font-weight: 300;
  color: var(--text-mid);
  line-height: 2;
  letter-spacing: 0.04em;
  margin: 0;
  padding-top: 20px;
  border-top: 1px solid rgba(184,151,90,0.12);
}

@media (max-width: 768px) {
  .area-faq-question {
    font-size: 14px;
    padding: 20px 48px 20px 20px;
  }

  .area-faq-question::after { right: 20px; }

  .area-faq-answer { padding: 0 20px 20px; }
}

/* ===== COMPANY DETAIL PAGE ===== */
.company-detail-section { background: var(--cream); }

.company-detail-list { display: flex; flex-direction: column; gap: 32px; }

.company-detail-card {
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.28);
  box-shadow: 0 4px 24px rgba(13,27,42,0.06);
  display: grid;
  grid-template-columns: 1fr;
  grid-template-areas:
    "rank"
    "body"
    "footer";
  overflow: hidden;
  transition: box-shadow 0.3s ease, border-color 0.3s ease;
}
.company-detail-card:hover {
  box-shadow: 0 12px 48px rgba(13,27,42,0.12);
  border-color: rgba(184,151,90,0.5);
}

.company-rank-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--navy);
  height: 100%;
  min-height: 220px;
  padding: 24px 0;
}
.company-rank-label {
  font-family: 'Noto Serif JP', serif;
  font-size: 11px;
  color: var(--gold);
  letter-spacing: 0.08em;
  display: block;
  margin-bottom: 10px;
}
.company-rank-num {
  font-family: 'Noto Serif JP', serif;
  font-size: 32px;
  font-weight: 300;
  color: var(--gold-light);
  line-height: 1;
  letter-spacing: 0.02em;
}

.company-detail-main { padding: 36px 44px; }

.company-detail-name {
  font-family: 'Noto Serif JP', serif;
  font-size: 22px;
  font-weight: 400;
  color: var(--navy);
  letter-spacing: 0.06em;
  margin-bottom: 8px;
}

.company-detail-catch {
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  font-weight: 300;
  color: var(--text-mid);
  letter-spacing: 0.05em;
  line-height: 1.8;
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--border);
}

.company-detail-metrics {
  display: flex;
  gap: 40px;
  margin-bottom: 24px;
}
.metric-head {
  font-family: 'Cormorant Garamond', serif;
  font-size: 14px !important;
  color: var(--gold);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 6px;
}
.metric-body {
  font-family: 'Noto Serif JP', serif;
  font-size: 16px;
  font-weight: 300;
  color: var(--navy);
  letter-spacing: 0.05em;
}

.metric-stars {
  display: inline-block;
  margin-left: 8px;
  color: var(--gold);
  font-size: 13px;
  letter-spacing: 0.08em;
  white-space: nowrap;
}

.company-detail-specs { display: flex; flex-direction: column; }
.company-spec-row {
  display: grid;
  grid-template-columns: 150px 1fr;
  padding: 11px 0;
  border-bottom: 1px solid rgba(184,151,90,0.1);
  font-size: 14px;
  line-height: 1.8;
}
.company-spec-row:last-child { border-bottom: none; }
.company-spec-row dt {
  font-family: 'Noto Serif JP', serif;
  font-weight: 400;
  color: var(--navy);
  letter-spacing: 0.04em;
  font-size: 14px;
}
.company-spec-row dd { color: var(--text-mid); letter-spacing: 0.02em; }

.company-cta-banner {
  margin-top: 64px;
  background: var(--navy);
  padding: 52px 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  border: 1px solid rgba(184,151,90,0.2);
}
.company-cta-text {
  font-family: 'Noto Serif JP', serif;
  font-size: 20px;
  font-weight: 300;
  color: var(--cream);
  letter-spacing: 0.08em;
  line-height: 1.6;
}

@media (max-width: 960px) {
  .company-rank-badge { min-height: auto; padding: 20px 0; }
  .company-detail-main { padding: 20px 24px; }
  .company-detail-metrics { flex-direction: column; gap: 12px; }
  .company-cta-banner {
    flex-direction: column;
    padding: 36px 24px;
    text-align: center;
  }
}

/* ===== Mobile Optimization Patch ===== */
.breadcrumb-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.breadcrumb-item,
.breadcrumb-sep {
  line-height: 1.4;
}
.breadcrumb-current {
  color: var(--navy);
}

@media (max-width: 960px) {
  .container {
    padding-left: 20px;
    padding-right: 20px;
  }

  .section-header {
    margin-bottom: 44px;
  }

  .section-title {
    font-size: clamp(20px, 5.5vw, 30px);
    line-height: 1.45;
    letter-spacing: 0.05em;
  }

  .ranking-list {
    gap: 16px;
  }

  .ranking-card {
    grid-template-columns: 54px 1fr;
    border-color: rgba(184,151,90,0.2);
  }

  .rank-info {
    padding: 16px;
  }

  .rank-company-name {
    font-size: 16px;
  }

  .rank-catchphrase {
    font-size: 12px;
    line-height: 1.7;
    margin-bottom: 12px;
  }

  .rank-metrics {
    padding: 14px 16px;
    gap: 12px;
  }

  .metric-value {
    font-size: 18px;
  }

  .compare-table-wrap {
    border-radius: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .compare-table {
    min-width: 820px;
  }

  .compare-intro {
    margin-bottom: 32px;
    font-size: 13px;
    line-height: 1.9;
  }

  .company-detail-list {
    gap: 18px;
  }

  .company-detail-main {
    padding: 18px 18px 16px;
  }

  .company-detail-name {
    font-size: 18px;
    margin-bottom: 8px;
    line-height: 1.45;
  }

  .company-detail-catch {
    font-size: 12px;
    line-height: 1.8;
    margin-bottom: 16px;
    padding-bottom: 14px;
  }

  .company-spec-row dt,
  .company-spec-row dd {
    font-size: 12px;
    line-height: 1.7;
  }

  .company-cta-banner {
    margin-top: 40px;
  }

  .company-cta-text {
    font-size: 17px;
    line-height: 1.55;
    letter-spacing: 0.05em;
  }
}

@media (max-width: 480px) {
  .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .page-hero {
    padding: 128px 0 62px;
  }

  .page-hero-title {
    font-size: 22px;
    line-height: 1.5;
  }

  .breadcrumb {
    padding: 10px 0;
  }

  .breadcrumb-list {
    font-size: 11px;
    gap: 6px;
    flex-wrap: wrap;
  }

  .rank-info {
    padding: 14px;
  }

  .rank-company-name {
    font-size: 15px;
  }

  .rank-chips {
    gap: 8px;
  }

  .tag-chip {
    font-size: 10px;
    padding: 3px 8px;
  }

  .compare-intro {
    font-size: 12px;
    margin-bottom: 24px;
  }

  .compare-table {
    min-width: 720px;
  }

  .company-rank-badge {
    min-height: auto;
    padding: 10px 14px;
    flex-direction: row;
    justify-content: flex-start;
    gap: 8px;
  }

  .company-rank-label {
    margin-bottom: 0;
  }

  .company-rank-num {
    font-size: 24px;
  }

  .company-detail-main {
    padding: 16px;
  }

  .company-detail-footer {
    padding: 0 16px 18px;
  }

  .company-detail-footer .company-detail-cta,
  .company-detail-footer .btn-primary {
    width: 100%;
    text-align: center;
  }

  .company-cta-banner {
    padding: 28px 18px;
  }

  .company-cta-text {
    font-size: 15px;
  }
}

/* ===== Search First View / Site Foundation ===== */
.search-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 120px 24px 80px;
  overflow: hidden;
  background: var(--navy);
}

.search-hero-bg,
.search-hero-overlay {
  position: absolute;
  inset: 0;
}

.search-hero-bg {
  background-size: cover;
  background-position: center;
  transform: scale(1.04);
}

.search-hero-overlay {
  background:
    linear-gradient(120deg, rgba(13,27,42,0.72), rgba(13,27,42,0.28)),
    linear-gradient(to bottom, rgba(13,27,42,0.2), rgba(13,27,42,0.86));
}

.search-hero-panel {
  position: relative;
  z-index: 2;
  width: min(980px, 100%);
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(212,180,122,0.45);
  box-shadow: 0 28px 80px rgba(0,0,0,0.28);
  padding: 44px;
  backdrop-filter: blur(14px);
}

.search-hero-eyebrow {
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  color: var(--gold);
  letter-spacing: 0.32em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 14px;
  text-align: center;
}

.search-hero-title {
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(28px, 4vw, 46px);
  font-weight: 300;
  color: var(--navy);
  letter-spacing: 0.07em;
  line-height: 1.45;
  text-align: center;
  margin-bottom: 16px;
}

.search-hero-lead {
  max-width: 720px;
  margin: 0 auto 30px;
  color: var(--text-mid);
  font-size: 14px;
  line-height: 1.9;
  letter-spacing: 0.04em;
  text-align: center;
}

.villa-search-form {
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.22);
  padding: 24px;
}

.search-panel-tab {
  display: inline-block;
  background: var(--navy);
  color: var(--gold-light);
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  letter-spacing: 0.12em;
  padding: 9px 18px;
  margin-bottom: 20px;
}

.search-select-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 18px;
}

.search-select-field span {
  display: block;
  font-size: 11px;
  color: var(--gold);
  letter-spacing: 0.14em;
  margin-bottom: 7px;
}

.search-select-field select {
  width: 100%;
  border: 1px solid var(--border);
  background: var(--cream);
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  padding: 14px 16px;
  border-radius: 0;
  appearance: none;
}

.search-submit {
  width: 100%;
  border: none;
  background: var(--gold);
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: 15px;
  letter-spacing: 0.12em;
  padding: 18px 24px;
  cursor: pointer;
  transition: background var(--transition);
}

.search-submit:hover {
  background: var(--gold-light);
}

.matrix-section,
.selection-guide-section {
  background: var(--cream);
  padding: 100px 0;
}

.matrix-note,
.detail-ranking-note {
  max-width: 720px;
  margin: -34px auto 44px;
  text-align: center;
  color: var(--text-light);
  font-size: 12px;
  line-height: 1.8;
  letter-spacing: 0.04em;
}

.matrix-table-wrap {
  overflow-x: auto;
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.28);
  box-shadow: 0 18px 50px rgba(13,27,42,0.07);
}

.matrix-table {
  width: 100%;
  min-width: 820px;
  border-collapse: collapse;
}

.matrix-table th {
  background: var(--navy);
  color: rgba(245,240,232,0.9);
  font-family: 'Noto Serif JP', serif;
  font-weight: 300;
  font-size: 12px;
  letter-spacing: 0.12em;
  padding: 16px;
}

.matrix-table td {
  border-bottom: 1px solid rgba(184,151,90,0.14);
  padding: 18px 16px;
  color: var(--text-mid);
  font-size: 13px;
  line-height: 1.7;
}

.matrix-tag {
  display: inline-block;
  color: var(--gold);
  border: 1px solid rgba(184,151,90,0.45);
  padding: 4px 10px;
  font-size: 11px;
  letter-spacing: 0.08em;
}

.selection-guide-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.selection-guide-card {
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.24);
  padding: 38px 32px;
}

.selection-guide-icon {
  font-family: 'Cormorant Garamond', serif;
  font-size: 40px;
  color: rgba(184,151,90,0.34);
  margin-bottom: 18px;
}

.selection-guide-card h3 {
  font-family: 'Noto Serif JP', serif;
  color: var(--navy);
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.08em;
  margin-bottom: 14px;
}

.selection-guide-card p {
  color: var(--text-mid);
  font-size: 13px;
  line-height: 1.9;
  letter-spacing: 0.03em;
}

.detail-ranking-section {
  background: var(--navy);
  padding: 100px 0;
}

.detail-ranking-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.detail-ranking-card {
  display: grid;
  grid-template-columns: 320px 1fr;
  background: rgba(255,255,255,0.045);
  border: 1px solid rgba(184,151,90,0.2);
  overflow: hidden;
}

.detail-ranking-image {
  min-height: 260px;
  background:
    linear-gradient(135deg, rgba(13,27,42,0.16), rgba(184,151,90,0.18)),
    linear-gradient(135deg, var(--navy-mid), var(--navy-light));
}

.detail-ranking-body {
  padding: 34px 40px;
}

.detail-ranking-badge {
  color: var(--gold);
  border: 1px solid rgba(184,151,90,0.45);
  font-size: 12px;
  padding: 4px 12px;
  letter-spacing: 0.12em;
}

.detail-ranking-body h3 {
  font-family: 'Noto Serif JP', serif;
  color: var(--cream);
  font-size: 24px;
  font-weight: 400;
  letter-spacing: 0.06em;
  margin: 18px 0 12px;
}

.detail-ranking-catch {
  font-family: 'Noto Serif JP', serif;
  color: rgba(245,240,232,0.82);
  font-size: 15px;
  line-height: 1.8;
  margin-bottom: 14px;
}

.detail-ranking-reason {
  color: rgba(245,240,232,0.58);
  font-size: 13px;
  line-height: 1.9;
  letter-spacing: 0.03em;
  margin-bottom: 24px;
}

/* ===== Concierge Contact Form ===== */
.contact-concierge-section {
  background: var(--cream);
}

.contact-concierge-lead {
  max-width: 780px;
  margin: 0 auto 46px;
  text-align: center;
}

.concierge-form-wrap {
  max-width: 920px;
  margin: 0 auto;
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.28);
  box-shadow: 0 18px 55px rgba(13,27,42,0.08);
  padding: 42px;
}

.listing-form-wrap {
  max-width: 800px;
  margin: 96px auto 0;
  background: #f9f9f9;
  border: 1px solid rgba(184,151,90,0.26);
  box-shadow: 0 22px 60px rgba(13,27,42,0.08);
  padding: 48px;
}

.listing-form-heading {
  margin-bottom: 40px;
  text-align: center;
}

.contact-form-title-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.contact-form-title-en {
  color: var(--gold);
  font-family: 'Cormorant Garamond', serif;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.28em;
  line-height: 1;
}

.contact-form-title-wrapper::after {
  content: '';
  display: block;
  width: 32px;
  height: 1px;
  margin-top: 18px;
  background: var(--gold);
}

.contact-form-title-jp {
  margin: 0;
  margin-top: 14px;
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: 0.1em;
}

.contact-form-container {
  max-width: 100%;
}

.concierge-form-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 22px;
}

.concierge-form .contact-field {
  background: var(--cream);
}

.concierge-checks {
  border: 1px solid rgba(184,151,90,0.22);
  padding: 20px 22px;
  margin: 24px 0;
}

.concierge-checks legend {
  font-family: 'Noto Serif JP', serif;
  color: var(--navy);
  font-size: 13px;
  letter-spacing: 0.12em;
  padding: 0 8px;
}

.concierge-checks label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 8px 22px 8px 0;
  color: var(--text-mid);
  font-size: 13px;
  letter-spacing: 0.03em;
}

.concierge-form-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 24px;
}

.concierge-form-footer p {
  color: var(--text-light);
  font-size: 12px;
  line-height: 1.7;
  letter-spacing: 0.04em;
}

@media (max-width: 960px) {
  .search-hero {
    min-height: auto;
    padding: 112px 20px 64px;
  }

  .search-hero-panel {
    padding: 30px 22px;
  }

  .search-select-grid,
  .selection-guide-grid,
  .concierge-form-grid {
    grid-template-columns: 1fr;
  }

  .detail-ranking-card {
    grid-template-columns: 1fr;
  }

  .detail-ranking-image {
    min-height: 190px;
  }

  .detail-ranking-body {
    padding: 26px 22px;
  }

  .concierge-form-wrap {
    padding: 28px 22px;
  }

  .listing-form-wrap {
    margin-top: 80px;
    padding: 34px 24px;
  }

  .concierge-form-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .concierge-form-footer .contact-submit {
    width: 100%;
    text-align: center;
  }
}

@media (max-width: 480px) {
  .search-hero-title {
    font-size: 24px;
  }

  .search-hero-lead {
    font-size: 12px;
    text-align: left;
  }

  .villa-search-form {
    padding: 18px;
  }

  .matrix-section,
  .selection-guide-section,
  .detail-ranking-section {
    padding: 72px 0;
  }

  .matrix-table {
    min-width: 680px;
  }

  .selection-guide-card {
    padding: 28px 22px;
  }

  .detail-ranking-body h3 {
    font-size: 20px;
  }

  .contact-concierge-lead {
    text-align: left;
  }

  .concierge-form-wrap {
    padding: 22px 16px;
  }

  .listing-form-wrap {
    margin-top: 72px;
    padding: 28px 18px;
  }

  .contact-form-title-jp {
    font-size: 22px;
  }

  .concierge-checks label {
    display: flex;
    margin-right: 0;
  }
}

/* ===== Front Page Final Layout Fix ===== */
.search-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 120px 24px 80px;
  background: var(--navy);
  overflow: hidden;
}

.search-hero-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transform: scale(1.03);
}

.search-hero-overlay {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 50% 42%, rgba(184,151,90,0.22), transparent 34%),
    linear-gradient(120deg, rgba(13,27,42,0.76), rgba(13,27,42,0.3) 46%, rgba(13,27,42,0.78));
}

.search-hero-panel {
  position: relative;
  z-index: 2;
  width: min(1040px, 100%);
  background: rgba(255,255,255,0.94);
  border: 1px solid rgba(212,180,122,0.5);
  box-shadow: 0 30px 90px rgba(0,0,0,0.34);
  padding: 48px;
  backdrop-filter: blur(16px);
}

.search-hero-eyebrow,
.search-panel-tab,
.search-select-field span {
  text-transform: uppercase;
}

.search-hero-eyebrow {
  display: block;
  text-align: center;
  font-family: 'Cormorant Garamond', serif;
  color: var(--gold);
  font-size: 12px;
  letter-spacing: 0.32em;
  margin-bottom: 14px;
}

.search-hero-title {
  text-align: center;
  font-family: 'Noto Serif JP', serif;
  color: var(--navy);
  font-size: clamp(30px, 4vw, 48px);
  font-weight: 300;
  letter-spacing: 0.07em;
  line-height: 1.45;
  margin-bottom: 16px;
}

.search-hero-lead {
  max-width: 760px;
  margin: 0 auto 32px;
  text-align: center;
  color: var(--text-mid);
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}

.villa-search-form {
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.24);
  padding: 26px;
}

.search-panel-tab {
  display: inline-block;
  background: var(--navy);
  color: var(--gold-light);
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  letter-spacing: 0.12em;
  padding: 10px 18px;
  margin-bottom: 20px;
}

.search-select-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 18px;
}

.search-select-field {
  display: block;
}

.search-select-field span {
  display: block;
  color: var(--gold);
  font-size: 11px;
  letter-spacing: 0.14em;
  margin-bottom: 8px;
}

.search-select-field select {
  width: 100%;
  height: 54px;
  border: 1px solid rgba(184,151,90,0.34);
  background:
    linear-gradient(45deg, transparent 50%, var(--gold) 50%) right 18px center / 7px 7px no-repeat,
    linear-gradient(135deg, var(--gold) 50%, transparent 50%) right 13px center / 7px 7px no-repeat,
    var(--cream);
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  letter-spacing: 0.04em;
  padding: 0 42px 0 16px;
  border-radius: 0;
  appearance: none;
  outline: none;
}

.search-select-field select:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(184,151,90,0.14);
}

.search-submit {
  width: 100%;
  min-height: 58px;
  border: 1px solid var(--gold);
  background: var(--gold);
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: 15px;
  letter-spacing: 0.13em;
  cursor: pointer;
  transition: background var(--transition), border-color var(--transition), transform var(--transition);
}

.search-submit:hover {
  background: var(--gold-light);
  border-color: var(--gold-light);
  transform: translateY(-1px);
}

.matrix-section,
.selection-guide-section {
  padding: 100px 0;
  background: var(--cream);
}

.matrix-table-wrap {
  overflow-x: auto;
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.28);
  box-shadow: 0 18px 50px rgba(13,27,42,0.08);
}

.matrix-table {
  width: 100%;
  min-width: 900px;
  border-collapse: collapse;
}

.matrix-table th {
  background: var(--navy);
  color: rgba(245,240,232,0.9);
  font-family: 'Noto Serif JP', serif;
  font-size: 12px;
  font-weight: 300;
  letter-spacing: 0.12em;
  padding: 17px 18px;
  text-align: left;
}

.matrix-table td {
  border-bottom: 1px solid rgba(184,151,90,0.14);
  color: var(--text-mid);
  font-size: 13px;
  line-height: 1.8;
  letter-spacing: 0.03em;
  padding: 18px;
  vertical-align: top;
}

.matrix-table tbody tr:hover {
  background: rgba(184,151,90,0.05);
}

.matrix-company-name {
  font-family: 'Noto Serif JP', serif;
  color: var(--navy);
  font-weight: 400;
}

.matrix-tag {
  display: inline-block;
  color: var(--gold);
  border: 1px solid rgba(184,151,90,0.45);
  background: rgba(184,151,90,0.06);
  padding: 5px 11px;
  font-size: 11px;
  line-height: 1.6;
  letter-spacing: 0.08em;
}

.selection-guide-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.selection-guide-card {
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.24);
  padding: 38px 32px;
  box-shadow: 0 12px 38px rgba(13,27,42,0.05);
}

.selection-guide-icon {
  font-family: 'Cormorant Garamond', serif;
  color: rgba(184,151,90,0.34);
  font-size: 42px;
  line-height: 1;
  margin-bottom: 20px;
}

.selection-guide-card h3 {
  font-family: 'Noto Serif JP', serif;
  color: var(--navy);
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.08em;
  margin-bottom: 14px;
}

.selection-guide-card p {
  color: var(--text-mid);
  font-size: 13px;
  line-height: 1.95;
  letter-spacing: 0.03em;
}

.detail-ranking-section {
  background: var(--navy);
  padding: 100px 0;
}

.detail-ranking-list {
  display: flex;
  flex-direction: column;
  gap: 26px;
}

.detail-ranking-card {
  display: grid;
  grid-template-columns: 320px 1fr;
  background: rgba(255,255,255,0.045);
  border: 1px solid rgba(184,151,90,0.22);
  overflow: hidden;
}

.detail-ranking-image {
  min-height: 280px;
  background:
    linear-gradient(135deg, rgba(13,27,42,0.1), rgba(184,151,90,0.2)),
    linear-gradient(135deg, var(--navy-mid), var(--navy-light));
}

.detail-ranking-body {
  padding: 38px 42px;
}

.detail-ranking-badge {
  display: inline-block;
  color: var(--gold);
  border: 1px solid rgba(184,151,90,0.46);
  padding: 5px 13px;
  font-size: 12px;
  letter-spacing: 0.13em;
}

.detail-ranking-body h3 {
  font-family: 'Noto Serif JP', serif;
  color: var(--cream);
  font-size: 25px;
  font-weight: 400;
  letter-spacing: 0.06em;
  margin: 18px 0 12px;
}

.detail-ranking-catch {
  font-family: 'Noto Serif JP', serif;
  color: rgba(245,240,232,0.84);
  font-size: 15px;
  line-height: 1.85;
  margin-bottom: 14px;
}

.detail-ranking-reason {
  color: rgba(245,240,232,0.62);
  font-size: 13px;
  line-height: 1.95;
  letter-spacing: 0.03em;
  margin-bottom: 24px;
}

@media (max-width: 960px) {
  .search-hero {
    min-height: auto;
    padding: 110px 20px 64px;
  }

  .search-hero-panel {
    padding: 30px 22px;
  }

  .search-select-grid,
  .selection-guide-grid {
    grid-template-columns: 1fr;
  }

  .detail-ranking-card {
    grid-template-columns: 1fr;
  }

  .detail-ranking-image {
    min-height: 190px;
  }
}

@media (max-width: 480px) {
  .search-hero {
    padding: 96px 14px 48px;
  }

  .search-hero-panel {
    padding: 24px 16px;
  }

  .search-hero-title {
    font-size: 24px;
  }

  .search-hero-lead {
    text-align: left;
    font-size: 12px;
  }

  .villa-search-form {
    padding: 18px;
  }

  .matrix-section,
  .selection-guide-section,
  .detail-ranking-section {
    padding: 72px 0;
  }

  .matrix-table {
    min-width: 760px;
  }

  .selection-guide-card {
    padding: 28px 22px;
  }

  .detail-ranking-body {
    padding: 26px 22px;
  }

  .detail-ranking-body h3 {
    font-size: 20px;
  }
}

/* ===== Emergency Front Page Design Restore ===== */
.hero-section {
  position: relative;
  min-height: 80vh;
  padding: 120px 24px 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url("https://images.unsplash.com/photo-1600596542815-ffad4c1539a9?w=1600&q=80");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
}

.hero-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at center, rgba(184,151,90,0.2), transparent 38%),
    linear-gradient(120deg, rgba(13,27,42,0.76), rgba(13,27,42,0.28) 50%, rgba(13,27,42,0.8));
  z-index: 0;
}

.hero-section .search-hero-bg,
.hero-section .search-hero-overlay {
  display: none;
}

.search-panel {
  position: relative;
  z-index: 2;
  width: min(1040px, 100%);
  margin: 0 auto;
  padding: 40px;
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(184,151,90,0.42);
  border-radius: 10px;
  box-shadow: 0 28px 80px rgba(0,0,0,0.32);
  backdrop-filter: blur(12px);
}

.search-panel .search-hero-title {
  margin: 0 0 16px;
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(28px, 4vw, 46px);
  font-weight: 300;
  line-height: 1.45;
  letter-spacing: 0.07em;
  text-align: center;
}

.search-panel .search-hero-lead {
  max-width: 760px;
  margin: 0 auto 30px;
  color: var(--text-mid);
  font-size: 14px;
  line-height: 1.9;
  letter-spacing: 0.04em;
  text-align: center;
}

.search-panel .villa-search-form {
  padding: 24px;
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.24);
  border-radius: 4px;
}

.search-panel .search-select-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 18px;
}

.search-panel .search-select-field select {
  width: 100%;
  height: 56px;
  padding: 0 44px 0 16px;
  border: 1px solid rgba(184,151,90,0.36);
  border-radius: 4px;
  background:
    linear-gradient(45deg, transparent 50%, var(--gold) 50%) right 18px center / 7px 7px no-repeat,
    linear-gradient(135deg, var(--gold) 50%, transparent 50%) right 13px center / 7px 7px no-repeat,
    var(--cream);
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  letter-spacing: 0.04em;
  appearance: none;
  -webkit-appearance: none;
  outline: none;
}

.search-panel .search-select-field select:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(184,151,90,0.16);
}

.search-panel .search-submit {
  width: 100%;
  height: 60px;
  border: 1px solid var(--gold);
  border-radius: 4px;
  background: var(--gold);
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: 15px;
  letter-spacing: 0.13em;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}

.search-panel .search-submit:hover {
  background: var(--gold-light);
  border-color: var(--gold-light);
}

.matrix-table {
  width: 100%;
  min-width: 900px;
  border-collapse: collapse;
  background: var(--white);
}

.matrix-table th,
.matrix-table td {
  border: 1px solid rgba(184,151,90,0.18);
}

.matrix-table th {
  background: var(--navy);
  color: var(--cream);
  padding: 18px;
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.1em;
  text-align: left;
}

.matrix-table td {
  padding: 18px;
  color: var(--text-mid);
  font-size: 13px;
  line-height: 1.8;
  vertical-align: top;
}

.matrix-table-wrap {
  overflow-x: auto;
  border: 1px solid rgba(184,151,90,0.28);
  box-shadow: 0 18px 50px rgba(13,27,42,0.08);
  background: var(--white);
}

.matrix-company-name {
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-weight: 400;
}

.matrix-tag {
  display: inline-block;
  padding: 5px 12px;
  border: 1px solid rgba(184,151,90,0.48);
  background: rgba(184,151,90,0.08);
  color: var(--gold);
  font-size: 12px;
  line-height: 1.6;
}

.selection-guide-card,
.detail-ranking-card {
  box-shadow: 0 14px 45px rgba(13,27,42,0.08);
}

@media (max-width: 960px) {
  .hero-section {
    min-height: auto;
    padding: 108px 20px 64px;
  }

  .search-panel {
    padding: 28px 22px;
  }

  .search-panel .search-select-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .hero-section {
    padding: 96px 14px 48px;
  }

  .search-panel {
    padding: 24px 16px;
    border-radius: 6px;
  }

  .search-panel .search-hero-title {
    font-size: 24px;
  }

  .search-panel .search-hero-lead {
    text-align: left;
    font-size: 12px;
  }

  .search-panel .villa-search-form {
    padding: 16px;
  }

  .matrix-table {
    min-width: 760px;
  }
}

/* ===== Advanced Search Filters ===== */
#toggle-advanced-filters.search-panel-tab {
  border: none;
  cursor: pointer;
}

.advanced-filters-panel {
  margin: 4px 0 18px;
  padding: 24px;
  background: #fbf8f1;
  border: 1px solid rgba(184,151,90,0.24);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
}

.advanced-filter-group {
  padding: 18px 0;
  border-top: 1px solid rgba(184,151,90,0.18);
}

.advanced-filter-group:first-child {
  padding-top: 0;
  border-top: none;
}

.advanced-filter-group:last-child {
  padding-bottom: 0;
}

.advanced-filter-group h4 {
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  font-weight: 400;
  color: var(--navy);
  letter-spacing: 0.1em;
  margin-bottom: 12px;
}

.advanced-filter-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px 14px;
}

.advanced-filter-options label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 9px 12px;
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.16);
  color: var(--text-mid);
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  cursor: pointer;
  transition: border-color var(--transition), background var(--transition);
}

.advanced-filter-options label:hover {
  border-color: rgba(184,151,90,0.42);
  background: rgba(184,151,90,0.06);
}

.advanced-filter-options input[type="checkbox"] {
  width: 15px;
  height: 15px;
  accent-color: var(--gold);
  flex-shrink: 0;
}

@media (max-width: 960px) {
  .advanced-filter-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 480px) {
  .advanced-filters-panel {
    padding: 18px 14px;
  }

  .advanced-filter-options {
    grid-template-columns: 1fr;
  }

  .advanced-filter-options label {
    min-height: 44px;
  }
}

/* ===== Advanced Filters Luxury UI Override ===== */
.advanced-filters-panel {
  margin: 8px 0 22px;
  padding: 30px;
  background: #faf8f3;
  border: 1px solid rgba(184,151,90,0.28);
  box-shadow: 0 14px 38px rgba(13,27,42,0.08);
}

.advanced-filter-group {
  margin-bottom: 26px;
  padding: 0;
  border-top: none;
}

.advanced-filter-group:last-child {
  margin-bottom: 0;
}

.advanced-filter-group h4 {
  position: relative;
  margin: 0 0 18px;
  padding-bottom: 12px;
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.14em;
}

.advanced-filter-group h4::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, rgba(184,151,90,0.55), rgba(184,151,90,0.08));
}

.advanced-filter-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 15px;
}

.advanced-filter-options label {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 50px;
  padding: 13px 14px 13px 44px;
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.2);
  color: var(--text-mid);
  font-size: 13px;
  line-height: 1.5;
  letter-spacing: 0.03em;
  cursor: pointer;
  transition: border-color var(--transition), background var(--transition), color var(--transition), box-shadow var(--transition);
}

.advanced-filter-options label:hover {
  border-color: rgba(184,151,90,0.52);
  background: rgba(184,151,90,0.06);
  box-shadow: 0 8px 20px rgba(13,27,42,0.05);
}

.advanced-filter-options label::before {
  content: '';
  position: absolute;
  left: 15px;
  top: 50%;
  width: 18px;
  height: 18px;
  border: 1px solid rgba(184,151,90,0.58);
  background: #fff;
  transform: translateY(-50%);
  transition: background var(--transition), border-color var(--transition), box-shadow var(--transition);
}

.advanced-filter-options label::after {
  content: '';
  position: absolute;
  left: 21px;
  top: 50%;
  width: 5px;
  height: 9px;
  border-right: 2px solid var(--navy);
  border-bottom: 2px solid var(--navy);
  opacity: 0;
  transform: translateY(-62%) rotate(45deg) scale(0.8);
  transition: opacity var(--transition), transform var(--transition);
}

.advanced-filter-options input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.advanced-filter-options label:has(input[type="checkbox"]:checked) {
  border-color: var(--gold);
  background: rgba(184,151,90,0.11);
  color: var(--navy);
}

.advanced-filter-options label:has(input[type="checkbox"]:checked)::before {
  border-color: var(--gold);
  background: var(--gold);
  box-shadow: 0 0 0 3px rgba(184,151,90,0.16);
}

.advanced-filter-options label:has(input[type="checkbox"]:checked)::after {
  opacity: 1;
  transform: translateY(-62%) rotate(45deg) scale(1);
}

@media (max-width: 960px) {
  .advanced-filter-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 480px) {
  .advanced-filters-panel {
    padding: 22px 16px;
  }

  .advanced-filter-options {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .advanced-filter-options label {
    min-height: 52px;
    padding-top: 14px;
    padding-bottom: 14px;
  }
}

/* ===== Expanded Villa Builder Guide ===== */
.selection-guide-section {
  background:
    linear-gradient(180deg, rgba(245,240,232,1), rgba(255,255,255,0.96));
  padding: 110px 0;
}

.selection-guide-lead {
  max-width: 760px;
  margin: 24px auto 0;
  color: var(--text-mid);
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}

.selection-guide-grid {
  display: flex;
  flex-direction: column;
  gap: 28px;
  max-width: 980px;
  margin: 0 auto;
}

.selection-guide-card {
  position: relative;
  display: grid;
  grid-template-columns: 116px 1fr;
  gap: 34px;
  align-items: start;
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.26);
  box-shadow: 0 18px 54px rgba(13,27,42,0.07);
  padding: 42px 46px;
}

.selection-guide-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(180deg, var(--gold), rgba(184,151,90,0.12));
}

.selection-guide-icon {
  font-family: 'Cormorant Garamond', serif;
  font-size: 56px;
  font-weight: 300;
  color: rgba(184,151,90,0.42);
  line-height: 1;
  letter-spacing: 0.04em;
}

.selection-guide-card h3 {
  font-family: 'Noto Serif JP', serif;
  color: var(--navy);
  font-size: clamp(19px, 2.2vw, 24px);
  font-weight: 400;
  letter-spacing: 0.07em;
  line-height: 1.6;
  margin-bottom: 18px;
}

.selection-guide-card p {
  color: var(--text-mid);
  font-size: 14px;
  line-height: 2.15;
  letter-spacing: 0.035em;
}

@media (max-width: 960px) {
  .selection-guide-section {
    padding: 82px 0;
  }

  .selection-guide-card {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 34px 28px;
  }

  .selection-guide-icon {
    font-size: 44px;
  }
}

@media (max-width: 480px) {
  .selection-guide-lead {
    text-align: left;
    font-size: 13px;
  }

  .selection-guide-card {
    padding: 28px 22px;
  }

  .selection-guide-card p {
    font-size: 13px;
    line-height: 2;
  }
}

/* ===== Fullscreen Visual Selection Guide ===== */
.selection-guide-intro {
  background: var(--cream);
  padding: 96px 0 72px;
}

.selection-guide-intro .section-header {
  margin-bottom: 0;
}

.selection-guide-section {
  position: relative;
  min-height: 90vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 96px 24px;
  background-size: cover;
  background-position: center;
  isolation: isolate;
}

.selection-guide-section .section-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(120deg, rgba(13,27,42,0.78), rgba(13,27,42,0.48));
}

#guide-01 {
  background-image: url("https://images.unsplash.com/photo-1518780664697-55e3ad937233?w=1800&q=80");
}

#guide-02 {
  background-image: url("https://images.unsplash.com/photo-1556761175-b413da4baf72?w=1800&q=80");
}

#guide-03 {
  background-image: url("https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?w=1800&q=80");
}

#guide-04 {
  background-image: url("https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=1800&q=80");
}

#guide-01 .section-overlay {
  background:
    linear-gradient(120deg, rgba(13,27,42,0.82), rgba(13,27,42,0.52)),
    radial-gradient(circle at 30% 40%, rgba(184,151,90,0.18), transparent 34%);
}

#guide-02 .section-overlay {
  background:
    linear-gradient(120deg, rgba(13,27,42,0.78), rgba(13,27,42,0.5)),
    radial-gradient(circle at 70% 42%, rgba(184,151,90,0.16), transparent 36%);
}

#guide-03 .section-overlay {
  background:
    linear-gradient(120deg, rgba(13,27,42,0.76), rgba(13,27,42,0.42)),
    radial-gradient(circle at 50% 50%, rgba(184,151,90,0.2), transparent 38%);
}

#guide-04 .section-overlay {
  background:
    linear-gradient(120deg, rgba(13,27,42,0.8), rgba(13,27,42,0.5)),
    radial-gradient(circle at 64% 36%, rgba(184,151,90,0.16), transparent 34%);
}

.section-content-wrap {
  position: relative;
  z-index: 2;
  max-width: 820px;
  color: #fff;
  text-align: center;
}

.guide-number {
  display: block;
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(72px, 13vw, 160px);
  font-weight: 300;
  line-height: 0.82;
  color: rgba(212,180,122,0.26);
  letter-spacing: 0.04em;
  margin-bottom: 22px;
}

.guide-title {
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(24px, 4vw, 42px);
  font-weight: 300;
  color: var(--cream);
  letter-spacing: 0.08em;
  line-height: 1.55;
  margin-bottom: 28px;
  text-shadow: 0 8px 26px rgba(0,0,0,0.35);
}

.guide-text {
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(14px, 1.45vw, 17px);
  color: rgba(245,240,232,0.86);
  line-height: 2.2;
  letter-spacing: 0.05em;
  text-shadow: 0 6px 20px rgba(0,0,0,0.28);
}

.guide-animate-ready {
  opacity: 0;
  transition: opacity 1s ease, transform 1s ease;
}

#guide-01.guide-animate-ready,
#guide-03.guide-animate-ready {
  transform: translateX(-50px);
}

#guide-02.guide-animate-ready,
#guide-04.guide-animate-ready {
  transform: translateX(50px);
}

.guide-animate-active {
  opacity: 1;
  transform: translateX(0) !important;
}

@media (max-width: 960px) {
  .selection-guide-intro {
    padding: 76px 0 52px;
  }

  .selection-guide-section {
    min-height: 82vh;
    padding: 82px 22px;
  }

  .guide-text {
    line-height: 2;
  }
}

@media (max-width: 480px) {
  .selection-guide-section {
    min-height: 78vh;
    padding: 70px 18px;
  }

  .section-content-wrap {
    text-align: left;
  }

  .guide-number {
    margin-bottom: 18px;
  }

  .guide-title {
    letter-spacing: 0.05em;
    margin-bottom: 20px;
  }

  .guide-text {
    font-size: 13px;
    line-height: 1.95;
  }
}

/* ===== Stacked Visual Guide Cards ===== */
.selection-guide-section {
  position: relative;
  min-height: 70vh;
  padding: 60px 0;
  display: flex;
  align-items: center;
  overflow: hidden;
  background-image: none !important;
  background-color: var(--cream);
}

.selection-guide-section + .selection-guide-section {
  margin-top: -80px;
}

#guide-01 { z-index: 1; }
#guide-02 { z-index: 2; }
#guide-03 { z-index: 3; }
#guide-04 { z-index: 4; }

.selection-guide-section::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(120deg, rgba(13,27,42,0.48), rgba(245,240,232,0.72));
  pointer-events: none;
}

.selection-guide-section .section-overlay {
  position: absolute;
  inset: -12px;
  z-index: 0;
  background-size: cover;
  background-position: center;
  opacity: 0.4;
  filter: blur(2px) grayscale(20%);
  transform: scale(1.04);
}

#guide-01 .section-overlay {
  background-image: url("https://images.unsplash.com/photo-1518780664697-55e3ad937233?w=1800&q=80");
}

#guide-02 .section-overlay {
  background-image: url("https://images.unsplash.com/photo-1556761175-b413da4baf72?w=1800&q=80");
}

#guide-03 .section-overlay {
  background-image: url("https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?w=1800&q=80");
}

#guide-04 .section-overlay {
  background-image: url("https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=1800&q=80");
}

.selection-guide-section.align-left {
  justify-content: flex-start;
}

.selection-guide-section.align-right {
  justify-content: flex-end;
}

.section-content-card {
  position: relative;
  z-index: 2;
  width: 85%;
  max-width: 700px;
  background: #ffffff;
  box-shadow: 0 20px 40px rgba(0,0,0,0.08);
  padding: 50px 60px;
  color: #222;
}

.align-left .section-content-card {
  margin-left: 10%;
}

.align-right .section-content-card {
  margin-right: 10%;
}

.section-content-card .guide-number {
  position: absolute;
  top: 28px;
  right: 34px;
  display: block;
  margin: 0;
  color: #C5A059;
  font-family: 'Cormorant Garamond', serif;
  font-size: 48px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: 0.04em;
  opacity: 0.62;
}

.section-content-card .guide-title {
  max-width: 520px;
  margin: 0 0 20px;
  color: #222;
  font-family: 'Noto Serif JP', serif;
  font-size: 26px;
  font-weight: 600;
  line-height: 1.55;
  letter-spacing: 0.05em;
  text-shadow: none;
}

.section-content-card .guide-text {
  margin: 0;
  color: #555;
  font-family: 'Noto Serif JP', serif;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.03em;
  text-shadow: none;
}

.section-content-card.guide-animate-ready {
  opacity: 0;
  transition: opacity 1s ease, transform 1s ease;
}

.align-left .section-content-card.guide-animate-ready {
  transform: translateX(-50px);
}

.align-right .section-content-card.guide-animate-ready {
  transform: translateX(50px);
}

.section-content-card.guide-animate-active {
  opacity: 1;
  transform: translateX(0);
}

@media (max-width: 960px) {
  .selection-guide-section {
    min-height: auto;
    padding: 80px 0;
  }

  .selection-guide-section + .selection-guide-section {
    margin-top: -48px;
  }

  .align-left .section-content-card,
  .align-right .section-content-card {
    margin-left: auto;
    margin-right: auto;
  }

  .section-content-card {
    width: calc(100% - 40px);
    padding: 42px 34px;
  }
}

@media (max-width: 480px) {
  .selection-guide-section {
    padding: 64px 0;
  }

  .selection-guide-section + .selection-guide-section {
    margin-top: -34px;
  }

  .section-content-card {
    width: calc(100% - 28px);
    padding: 36px 22px 30px;
  }

  .section-content-card .guide-number {
    top: 20px;
    right: 22px;
    font-size: 40px;
  }

  .section-content-card .guide-title {
    padding-right: 48px;
    font-size: 20px;
    line-height: 1.55;
  }

  .section-content-card .guide-text {
    font-size: 13px;
    line-height: 1.9;
  }
}

/* ===== Emergency Simple Selection Guide Reset ===== */
.selection-guide-simple {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
  position: relative !important;
  z-index: 1 !important;
  background: #ffffff !important;
  color: #222222 !important;
  padding: 80px 0 !important;
  margin: 0 !important;
}

.selection-guide-simple *,
.selection-guide-simple .container {
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
}

.selection-guide-simple .container {
  max-width: 900px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
}

.selection-guide-simple h2 {
  display: block !important;
  color: #222222 !important;
  font-family: 'Noto Serif JP', serif !important;
  font-size: 30px !important;
  font-weight: 500 !important;
  line-height: 1.6 !important;
  letter-spacing: 0.04em !important;
  margin: 0 0 24px !important;
}

.selection-guide-simple h3 {
  display: block !important;
  color: #222222 !important;
  font-family: 'Noto Serif JP', serif !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 1.7 !important;
  letter-spacing: 0.03em !important;
  margin: 42px 0 14px !important;
  padding-left: 16px !important;
  border-left: 3px solid #C5A059 !important;
}

.selection-guide-simple p {
  display: block !important;
  color: #333333 !important;
  font-family: 'Noto Serif JP', serif !important;
  font-size: 15px !important;
  line-height: 1.9 !important;
  letter-spacing: 0.02em !important;
  margin: 0 0 18px !important;
}

@media (max-width: 480px) {
  .selection-guide-simple {
    padding: 56px 0 !important;
  }

  .selection-guide-simple h2 {
    font-size: 24px !important;
  }

  .selection-guide-simple h3 {
    font-size: 18px !important;
  }

  .selection-guide-simple p {
    font-size: 14px !important;
  }
}

/* ===== Polished Static Selection Guide ===== */
.selection-guide-simple {
  background: #fafafa !important;
  padding: 112px 0 !important;
  color: #222 !important;
}

.selection-guide-simple .container {
  max-width: 800px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
}

.selection-guide-simple h2 {
  max-width: 760px !important;
  margin: 0 auto 24px !important;
  color: #222 !important;
  font-family: 'Noto Serif JP', serif !important;
  font-size: clamp(26px, 3vw, 34px) !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
  letter-spacing: 0.06em !important;
  text-align: center !important;
}

.selection-guide-simple h2 + p {
  max-width: 720px !important;
  margin: 0 auto 56px !important;
  color: #666 !important;
  font-size: 15px !important;
  line-height: 1.9 !important;
  letter-spacing: 0.03em !important;
  text-align: center !important;
}

.selection-guide-simple h3 {
  position: relative !important;
  margin: 0 !important;
  padding: 50px 50px 18px 70px !important;
  background: #ffffff !important;
  color: #222 !important;
  border-left: none !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.03) !important;
  font-family: 'Noto Serif JP', serif !important;
  font-size: clamp(22px, 2.3vw, 24px) !important;
  font-weight: 600 !important;
  line-height: 1.6 !important;
  letter-spacing: 0.045em !important;
}

.selection-guide-simple h3::before {
  content: '' !important;
  position: absolute !important;
  left: 50px !important;
  top: 54px !important;
  width: 2px !important;
  height: calc(100% - 72px) !important;
  min-height: 34px !important;
  background: linear-gradient(180deg, #C5A059, rgba(197,160,89,0.24)) !important;
}

.selection-guide-simple h3::after {
  position: absolute !important;
  top: 30px !important;
  right: 42px !important;
  color: rgba(197,160,89,0.16) !important;
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 58px !important;
  font-weight: 300 !important;
  line-height: 1 !important;
  letter-spacing: 0.04em !important;
}

.selection-guide-simple h3:nth-of-type(1)::after { content: '01' !important; }
.selection-guide-simple h3:nth-of-type(2)::after { content: '02' !important; }
.selection-guide-simple h3:nth-of-type(3)::after { content: '03' !important; }
.selection-guide-simple h3:nth-of-type(4)::after { content: '04' !important; }

.selection-guide-simple h3 + p {
  margin: 0 0 40px !important;
  padding: 0 50px 50px 70px !important;
  background: #ffffff !important;
  color: #555 !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.03) !important;
  font-family: 'Noto Serif JP', serif !important;
  font-size: 15px !important;
  line-height: 1.85 !important;
  letter-spacing: 0.03em !important;
}

.selection-guide-simple h3 + p:last-child {
  margin-bottom: 0 !important;
}

@media (max-width: 480px) {
  .selection-guide-simple {
    padding: 72px 0 !important;
  }

  .selection-guide-simple .container {
    padding: 0 18px !important;
  }

  .selection-guide-simple h2 {
    text-align: left !important;
    font-size: 24px !important;
  }

  .selection-guide-simple h2 + p {
    text-align: left !important;
    margin-bottom: 40px !important;
    font-size: 14px !important;
  }

  .selection-guide-simple h3 {
    padding: 38px 24px 16px 42px !important;
    font-size: 19px !important;
  }

  .selection-guide-simple h3::before {
    left: 24px !important;
    top: 42px !important;
  }

  .selection-guide-simple h3::after {
    top: 24px !important;
    right: 22px !important;
    font-size: 44px !important;
  }

  .selection-guide-simple h3 + p {
    padding: 0 24px 34px 42px !important;
    margin-bottom: 28px !important;
    font-size: 14px !important;
    line-height: 1.9 !important;
  }
}

/* ===== Area Resort Section ===== */
.area-section {
  display: block;
  background: #ffffff;
  padding: 108px 0;
  color: #222;
}

.area-section .container {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 24px;
}

.area-header {
  max-width: 780px;
  margin: 0 auto 58px;
  text-align: center;
}

.area-header h2 {
  margin: 0 0 18px;
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(26px, 3vw, 36px);
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0.07em;
}

.area-header p {
  margin: 0;
  color: #555;
  font-size: 15px;
  line-height: 1.9;
  letter-spacing: 0.03em;
}

.area-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 32px;
}

.area-card {
  overflow: hidden;
  background: #ffffff;
  border: 1px solid rgba(184,151,90,0.18);
  box-shadow: 0 12px 34px rgba(0,0,0,0.04);
}

.area-card-image {
  width: 100%;
  min-height: 250px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.area-card-body {
  padding: 32px 34px 36px;
}

.area-label {
  display: block;
  margin-bottom: 12px;
  color: #C5A059;
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
}

.area-card h3 {
  margin: 0 0 16px;
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: 0.06em;
}

.area-card p {
  margin: 0;
  color: #555;
  font-size: 14px;
  line-height: 1.9;
  letter-spacing: 0.03em;
}

@media (max-width: 960px) {
  .area-section {
    padding: 84px 0;
  }

  .area-grid {
    gap: 24px;
  }

  .area-card-image {
    min-height: 220px;
  }
}

@media (max-width: 720px) {
  .area-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .area-section {
    padding: 68px 0;
  }

  .area-section .container {
    padding: 0 18px;
  }

  .area-header {
    text-align: left;
    margin-bottom: 38px;
  }

  .area-header p {
    font-size: 14px;
  }

  .area-card-image {
    min-height: 190px;
  }

  .area-card-body {
    padding: 26px 22px 30px;
  }

  .area-card h3 {
    font-size: 20px;
  }

  .area-card p {
    font-size: 13px;
  }
}

/* ===== Flow Section ===== */
.flow-section {
  display: block;
  background: #fafafa;
  padding: 104px 0;
  color: #222;
}

.flow-section .container {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 24px;
}

.flow-header {
  max-width: 780px;
  margin: 0 auto 58px;
  text-align: center;
}

.flow-header h2 {
  margin: 0 0 18px;
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(26px, 3vw, 36px);
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0.07em;
}

.flow-header p {
  margin: 0;
  color: #555;
  font-size: 15px;
  line-height: 1.9;
  letter-spacing: 0.03em;
}

.flow-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
  counter-reset: flow;
}

.flow-step {
  position: relative;
  background: #ffffff;
  border: 1px solid rgba(184,151,90,0.2);
  box-shadow: 0 10px 30px rgba(0,0,0,0.03);
  padding: 34px 28px 36px;
  min-height: 250px;
}

.flow-step:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 50%;
  right: -18px;
  width: 30px;
  height: 1px;
  background: rgba(197,160,89,0.5);
  transform: translateY(-50%);
  z-index: 2;
}

.flow-step:not(:last-child)::before {
  content: '';
  position: absolute;
  top: 50%;
  right: -20px;
  width: 8px;
  height: 8px;
  border-top: 1px solid rgba(197,160,89,0.7);
  border-right: 1px solid rgba(197,160,89,0.7);
  transform: translateY(-50%) rotate(45deg);
  z-index: 3;
}

.flow-number {
  display: block;
  margin-bottom: 18px;
  color: #C5A059;
  font-family: 'Cormorant Garamond', serif;
  font-size: 14px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.flow-step h3 {
  margin: 0 0 16px;
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: 19px;
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: 0.05em;
}

.flow-step p {
  margin: 0;
  color: #555;
  font-size: 13px;
  line-height: 1.85;
  letter-spacing: 0.03em;
}

@media (max-width: 1080px) {
  .flow-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
  }

  .flow-step:not(:last-child)::before,
  .flow-step:not(:last-child)::after {
    display: none;
  }
}

@media (max-width: 640px) {
  .flow-steps {
    grid-template-columns: 1fr;
  }

  .flow-step {
    min-height: auto;
  }
}

@media (max-width: 480px) {
  .flow-section {
    padding: 68px 0;
  }

  .flow-section .container {
    padding: 0 18px;
  }

  .flow-header {
    text-align: left;
    margin-bottom: 38px;
  }

  .flow-header p {
    font-size: 14px;
  }

  .flow-step {
    padding: 30px 22px;
  }

  .flow-step h3 {
    font-size: 18px;
  }
}

/* ===== Selection Guide Visibility Safety Fix ===== */
.section-content-card.guide-animate-ready {
  opacity: 1;
  transform: translateX(0);
}

.js-enabled .section-content-card.guide-animate-ready {
  opacity: 0;
  transition: opacity 1s ease, transform 1s ease;
}

.js-enabled .align-left .section-content-card.guide-animate-ready {
  transform: translateX(-50px);
}

.js-enabled .align-right .section-content-card.guide-animate-ready {
  transform: translateX(50px);
}

.js-enabled .section-content-card.guide-animate-active,
.section-content-card.guide-animate-active {
  opacity: 1;
  transform: translateX(0);
}

.selection-guide-section {
  overflow: visible;
}

.selection-guide-section .section-overlay {
  pointer-events: none;
}

/* ===== Refined Static Selection Guide Stack ===== */
.selection-guide-wrapper,
.selection-guide-intro {
  background: #fcfcfc;
}

.selection-guide-intro {
  display: block;
  padding: 100px 0 72px;
}

.selection-guide-section {
  position: relative;
  min-height: 68vh;
  padding: 90px 0;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: #fcfcfc;
}

.selection-guide-section + .selection-guide-section {
  margin-top: -60px;
}

.selection-guide-section.align-left {
  justify-content: flex-start;
}

.selection-guide-section.align-right {
  justify-content: flex-end;
}

.selection-guide-section .section-overlay {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  opacity: 0.38;
  filter: grayscale(20%);
  background-size: cover;
  background-position: center;
}

.selection-guide-section::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(252,252,252,0.92), rgba(252,252,252,0.42) 46%, rgba(252,252,252,0.9)),
    linear-gradient(180deg, rgba(252,252,252,0.88), rgba(252,252,252,0.62));
  pointer-events: none;
}

.section-content-card,
.section-content-card.guide-animate-ready,
.js-enabled .section-content-card.guide-animate-ready,
.section-content-card.guide-animate-active,
.js-enabled .section-content-card.guide-animate-active {
  position: relative;
  z-index: 2;
  display: block;
  width: 75%;
  max-width: 780px;
  padding: 60px;
  background: #ffffff;
  color: #222;
  box-shadow: 0 20px 50px rgba(0,0,0,0.05);
  opacity: 1;
  transform: none;
  transition: none;
}

.align-left .section-content-card {
  margin-left: 10%;
  margin-right: auto;
}

.align-right .section-content-card {
  margin-left: auto;
  margin-right: 10%;
}

.section-content-card .guide-number {
  position: absolute;
  top: 34px;
  right: 42px;
  margin: 0;
  color: #C5A059;
  font-family: 'Cormorant Garamond', serif;
  font-size: 74px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: 0.03em;
  opacity: 0.15;
}

.section-content-card .guide-title {
  position: relative;
  margin: 0 0 24px;
  padding-left: 22px;
  color: #222;
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(24px, 2.5vw, 26px);
  font-weight: 600;
  line-height: 1.55;
  letter-spacing: 0.05em;
  text-shadow: none;
}

.section-content-card .guide-title::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.18em;
  width: 2px;
  height: calc(100% - 0.36em);
  background: linear-gradient(180deg, #C5A059, rgba(197,160,89,0.25));
}

.section-content-card .guide-text {
  margin: 0;
  color: #555;
  font-family: 'Noto Serif JP', serif;
  font-size: 15px;
  line-height: 1.85;
  letter-spacing: 0.03em;
  text-shadow: none;
}

@media (max-width: 960px) {
  .selection-guide-intro {
    padding: 82px 0 56px;
  }

  .selection-guide-section {
    min-height: auto;
    padding: 72px 0;
  }

  .selection-guide-section + .selection-guide-section {
    margin-top: -36px;
  }

  .align-left .section-content-card,
  .align-right .section-content-card {
    margin-left: auto;
    margin-right: auto;
  }

  .section-content-card,
  .section-content-card.guide-animate-ready,
  .js-enabled .section-content-card.guide-animate-ready,
  .section-content-card.guide-animate-active,
  .js-enabled .section-content-card.guide-animate-active {
    width: calc(100% - 40px);
    padding: 44px 34px;
  }
}

@media (max-width: 480px) {
  .selection-guide-section {
    padding: 56px 0;
  }

  .selection-guide-section + .selection-guide-section {
    margin-top: -24px;
  }

  .section-content-card,
  .section-content-card.guide-animate-ready,
  .js-enabled .section-content-card.guide-animate-ready,
  .section-content-card.guide-animate-active,
  .js-enabled .section-content-card.guide-animate-active {
    width: calc(100% - 28px);
    padding: 36px 22px 30px;
  }

  .section-content-card .guide-number {
    top: 24px;
    right: 24px;
    font-size: 52px;
  }

  .section-content-card .guide-title {
    padding-left: 16px;
    padding-right: 42px;
    font-size: 20px;
    line-height: 1.55;
  }

  .section-content-card .guide-text {
    font-size: 13px;
    line-height: 1.9;
  }
}

/* ===== Stable Static Selection Guide Layout ===== */
.selection-guide-section {
  position: relative;
  display: block;
  min-height: 0;
  padding: 100px 0;
  margin: 0;
  overflow: visible;
  background: #fcfcfc;
}

.selection-guide-section + .selection-guide-section {
  margin-top: 0;
}

.selection-guide-section::after,
.selection-guide-section .section-overlay {
  display: none;
  content: none;
}

.selection-guide-section .section-header {
  margin-bottom: 56px;
}

.selection-guide-section .selection-guide-lead {
  max-width: 760px;
  margin: 24px auto 0;
  color: var(--text-mid);
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}

.selection-guide-list {
  display: flex;
  flex-direction: column;
  gap: 28px;
  max-width: 800px;
  margin: 0 auto;
}

.selection-guide-card {
  position: relative;
  display: block;
  width: 100%;
  padding: 44px 48px;
  background: #ffffff;
  border: 1px solid rgba(184,151,90,0.22);
  box-shadow: 0 14px 38px rgba(13,27,42,0.06);
  opacity: 1;
  transform: none;
}

.selection-guide-card .guide-number {
  display: block;
  margin-bottom: 16px;
  color: #C5A059;
  font-family: 'Cormorant Garamond', serif;
  font-size: 44px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: 0.04em;
  opacity: 0.34;
}

.selection-guide-card .guide-title {
  position: relative;
  margin: 0 0 20px;
  padding-left: 20px;
  color: #222;
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(21px, 2.2vw, 25px);
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: 0.05em;
  text-shadow: none;
}

.selection-guide-card .guide-title::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.22em;
  width: 2px;
  height: calc(100% - 0.44em);
  background: linear-gradient(180deg, #C5A059, rgba(197,160,89,0.22));
}

.selection-guide-card .guide-text {
  margin: 0;
  color: #555;
  font-family: 'Noto Serif JP', serif;
  font-size: 15px;
  line-height: 1.9;
  letter-spacing: 0.03em;
  text-shadow: none;
}

.selection-guide-grid,
.section-content-card,
.guide-animate-ready,
.guide-animate-active {
  transform: none;
}

@media (max-width: 960px) {
  .selection-guide-section {
    padding: 80px 0;
  }

  .selection-guide-list {
    max-width: none;
  }

  .selection-guide-card {
    padding: 38px 30px;
  }
}

@media (max-width: 480px) {
  .selection-guide-section {
    padding: 64px 0;
  }

  .selection-guide-section .section-header {
    margin-bottom: 38px;
  }

  .selection-guide-section .selection-guide-lead {
    text-align: left;
    font-size: 13px;
  }

  .selection-guide-list {
    gap: 20px;
  }

  .selection-guide-card {
    padding: 30px 22px;
  }

  .selection-guide-card .guide-number {
    font-size: 36px;
  }

  .selection-guide-card .guide-title {
    padding-left: 16px;
    font-size: 19px;
  }

  .selection-guide-card .guide-text {
    font-size: 13px;
    line-height: 1.9;
  }
}

/* ===== Area Company Rank Top Band Refinement ===== */
.company-rank-badge {
  grid-area: rank;
  width: 100%;
  height: auto;
  min-height: 0;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0;
  padding: 22px 36px !important;
  background: linear-gradient(135deg, var(--navy), var(--navy-mid));
  border-right: none;
  border-bottom: 1px solid rgba(184,151,90,0.28);
}

.bp-rank-highlight {
  color: #dcb871;
  font-family: 'Urbanist', 'Cormorant Garamond', serif;
  font-size: 46px !important;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.03em;
}

.bp-rank-unit {
  margin-left: 2px;
  font-family: 'Noto Serif JP', serif;
  font-size: 24px !important;
  font-weight: 500;
}

.bp-rank-divider {
  display: inline-block;
  width: 1px;
  height: 30px;
  margin: 0 16px;
  background: rgba(255,255,255,0.3);
}

.bp-rank-area-name {
  color: rgba(255,255,255,0.86);
  font-family: 'Noto Serif JP', serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.08em;
}

.company-rank-title {
  color: var(--gold-light);
  font-family: 'Noto Serif JP', serif;
  font-size: 23px;
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: 0.08em;
}

.company-rank-label {
  margin-bottom: 0;
  color: rgba(245,240,232,0.78);
  font-size: 13px;
  line-height: 1.4;
  letter-spacing: 0.12em;
}

.company-rank-num {
  color: var(--gold-light);
  font-size: 30px;
  line-height: 1;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.company-detail-list .company-detail-card .company-detail-body {
  grid-template-columns: clamp(300px, 38%, 400px) minmax(0, 1fr);
}

.company-detail-list .company-detail-card .company-detail-main {
  padding: 34px 40px;
  min-width: 0;
}

.company-detail-list .company-detail-card .company-detail-media {
  padding: 32px 28px 32px 36px;
  border-right: 1px solid var(--border);
}

.company-detail-list .company-detail-card .company-detail-footer {
  padding: 0 36px 34px;
  border-top: 1px solid var(--border);
  background: rgba(184,151,90,0.04);
}

.company-detail-list .company-detail-card .company-detail-footer .company-detail-cta {
  max-width: none;
}

@media (max-width: 960px) {
  .company-rank-badge {
    padding: 18px 24px !important;
  }

  .bp-rank-highlight {
    font-size: 42px !important;
  }

  .bp-rank-unit {
    font-size: 22px !important;
  }

  .bp-rank-area-name {
    font-size: 16px;
  }

  .company-rank-label {
    font-size: 12px;
  }

  .company-rank-title {
    font-size: 21px;
  }

  .company-rank-num {
    font-size: 26px;
  }
}

@media (max-width: 768px) {
  .company-detail-body,
  .company-detail-list .company-detail-card .company-detail-body,
  .diagnosis-company-card .company-detail-body,
  .villa-search-result-section .company-detail-card .company-detail-body {
    grid-template-columns: 1fr;
  }

  .company-detail-media,
  .company-detail-list .company-detail-card .company-detail-media {
    padding: 20px 20px 0;
    border-right: none;
    border-bottom: none;
  }

  .company-detail-main,
  .company-detail-list .company-detail-card .company-detail-main {
    padding: 22px 20px;
  }

  .company-detail-footer,
  .company-detail-list .company-detail-card .company-detail-footer {
    padding: 0 20px 24px;
  }
}

@media (max-width: 480px) {
  .company-rank-badge {
    align-items: flex-start !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    gap: 8px;
  }

  .bp-rank-highlight {
    font-size: 38px !important;
  }

  .bp-rank-unit {
    font-size: 20px !important;
  }

  .bp-rank-divider {
    height: 26px;
    margin: 0 10px;
  }

  .bp-rank-area-name {
    font-size: 15px;
  }

  .company-rank-num {
    font-size: 24px;
  }

  .company-rank-title {
    font-size: 19px;
  }
}

/* Final guard for area-page rank ribbons. */
.company-detail-list .company-detail-card .company-rank-badge {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: 18px 32px !important;
}

.company-detail-list .company-detail-card .company-rank-badge > .bp-rank-highlight {
  font-size: 32px !important;
  line-height: 1 !important;
}

.company-detail-list .company-detail-card .company-rank-badge > .bp-rank-highlight .bp-rank-unit {
  font-size: 18px !important;
  line-height: 1 !important;
}

/* ===== Partner Diagnosis Result ===== */
.diagnosis-result-section {
  background:
    radial-gradient(circle at top left, rgba(184,151,90,0.12), transparent 34%),
    var(--cream);
}

.diagnosis-result-heading {
  max-width: 920px;
  margin: 0 auto 42px;
  padding: 42px;
  text-align: center;
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.28);
  box-shadow: 0 22px 60px rgba(13,27,42,0.08);
}

.diagnosis-result-title {
  margin: 12px 0 14px;
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(26px, 4vw, 38px);
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: 0.08em;
}

.diagnosis-result-lead {
  max-width: 680px;
  margin: 0 auto;
  color: var(--text-mid);
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}

.diagnosis-condition-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 24px;
}

.diagnosis-condition-chips span {
  padding: 8px 14px;
  color: var(--navy);
  font-size: 12px;
  letter-spacing: 0.08em;
  background: rgba(184,151,90,0.12);
  border: 1px solid rgba(184,151,90,0.24);
}

.diagnosis-fallback-note {
  margin: 0 0 28px;
  padding: 30px 34px;
  background: linear-gradient(135deg, var(--navy), var(--navy-mid));
  border: 1px solid rgba(184,151,90,0.34);
  box-shadow: 0 20px 54px rgba(13,27,42,0.12);
}

.diagnosis-fallback-note h2 {
  margin: 10px 0 10px;
  color: var(--white);
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 400;
  letter-spacing: 0.08em;
}

.diagnosis-fallback-note p {
  margin: 0;
  color: rgba(255,255,255,0.78);
  font-size: 13px;
  line-height: 1.9;
  letter-spacing: 0.04em;
}

.diagnosis-company-card .company-rank-badge,
.villa-search-result-section .company-detail-card .company-rank-badge {
  grid-area: rank;
}

.diagnosis-company-card .company-detail-body,
.villa-search-result-section .company-detail-card .company-detail-body {
  grid-template-columns: clamp(300px, 38%, 400px) minmax(0, 1fr);
}

.diagnosis-company-card .company-detail-media,
.villa-search-result-section .company-detail-card .company-detail-media {
  padding: 30px 26px 30px 34px;
  border-right: 1px solid var(--border);
}

.diagnosis-company-card .company-detail-main,
.villa-search-result-section .company-detail-card .company-detail-main {
  padding: 30px 36px 30px 28px;
  min-width: 0;
}

.diagnosis-company-card .company-detail-footer,
.villa-search-result-section .company-detail-card .company-detail-footer {
  padding: 0 34px 32px;
  border-top: 1px solid var(--border);
  background: rgba(184,151,90,0.05);
}

@media (max-width: 760px) {
  .diagnosis-result-heading {
    padding: 30px 22px;
    text-align: left;
  }

  .diagnosis-condition-chips {
    justify-content: flex-start;
  }

  .company-card-screenshot {
    border-radius: 8px;
    aspect-ratio: 16 / 9;
  }
}

/* ===== Ranking Portal Page ===== */
.ranking-portal-page {
  background: var(--cream);
}

.ranking-portal-section {
  position: relative;
}

.ranking-portal-header {
  max-width: 760px;
  margin: 0 auto 56px;
  text-align: center;
}

.ranking-portal-lead {
  margin: 16px auto 0;
  max-width: 680px;
  color: var(--text-mid);
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}

.ranking-portal-lead--light {
  color: rgba(245,240,232,0.72);
}

.ranking-portal-themes {
  background:
    radial-gradient(circle at 12% 0%, rgba(184,151,90,0.14), transparent 42%),
    linear-gradient(180deg, var(--cream) 0%, var(--white) 100%);
}

.ranking-theme-list {
  display: flex;
  flex-direction: column;
  gap: 36px;
}

.ranking-theme-card {
  display: grid;
  grid-template-columns: minmax(320px, 42%) minmax(0, 1fr);
  gap: 0;
  overflow: hidden;
  background: var(--white);
  border: 1px solid rgba(184,151,90,0.28);
  box-shadow: 0 18px 50px rgba(13,27,42,0.08);
  transition: transform 0.45s ease, box-shadow 0.45s ease, border-color 0.45s ease;
}

.ranking-theme-card:hover {
  transform: translateY(-4px);
  border-color: rgba(184,151,90,0.5);
  box-shadow: 0 28px 70px rgba(13,27,42,0.14);
}

.ranking-theme-card--featured {
  border-color: rgba(184,151,90,0.45);
  box-shadow: 0 24px 64px rgba(13,27,42,0.12);
}

.ranking-theme-card__media {
  position: relative;
  min-height: 100%;
  overflow: hidden;
  background: var(--navy);
}

.ranking-theme-card__image {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 280px;
  object-fit: cover;
  object-position: center;
  aspect-ratio: 16 / 9;
  transition: transform 0.6s ease;
}

.ranking-theme-card:hover .ranking-theme-card__image {
  transform: scale(1.05);
}

.ranking-theme-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(13,27,42,0.15), rgba(13,27,42,0.45));
  pointer-events: none;
}

.ranking-theme-card__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 18px;
  padding: 40px 44px;
  min-width: 0;
}

.ranking-theme-card__eyebrow {
  color: var(--gold);
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
}

.ranking-theme-card__title {
  margin: 0;
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: 0.08em;
}

.ranking-theme-card__desc {
  margin: 0;
  color: var(--text-mid);
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}

.ranking-theme-companies {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}

.ranking-theme-company {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  background: rgba(184,151,90,0.06);
  border: 1px solid rgba(184,151,90,0.18);
  transition: background 0.3s ease, border-color 0.3s ease;
}

.ranking-theme-company:hover {
  background: rgba(184,151,90,0.12);
  border-color: rgba(184,151,90,0.34);
}

.ranking-theme-company__link {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}

.ranking-theme-company__name {
  color: var(--navy);
  font-family: 'Noto Serif JP', serif;
  font-size: 15px;
  letter-spacing: 0.06em;
}

.ranking-theme-company__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 11px;
  letter-spacing: 0.08em;
}

.ranking-theme-company__area {
  color: var(--gold);
}

.ranking-theme-company__tag {
  color: var(--text-mid);
}

.ranking-theme-company__area-link {
  flex-shrink: 0;
  color: var(--navy);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 1px solid rgba(184,151,90,0.45);
  padding-bottom: 2px;
}

.ranking-theme-company__area-link:hover {
  color: var(--gold);
}

.ranking-portal-national {
  background: var(--navy);
}

.ranking-portal-national .section-title {
  color: var(--cream);
}

.ranking-portal-national-list .ranking-portal-national-card {
  position: relative;
}

.ranking-portal-areas {
  background: linear-gradient(180deg, var(--navy) 0%, var(--navy-mid) 100%);
}

.ranking-portal-areas .section-title {
  color: var(--cream);
}

.ranking-portal-area-grid .ranking-portal-area-card {
  border-color: rgba(184,151,90,0.24);
  transition: transform 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
}

.ranking-portal-area-grid .ranking-portal-area-card:hover {
  transform: translateY(-6px);
  border-color: rgba(184,151,90,0.5);
  box-shadow: 0 20px 48px rgba(0,0,0,0.28);
}

.ranking-portal-area-card__cta {
  display: inline-block;
  margin-top: 14px;
  color: var(--gold-light);
  font-size: 11px;
  letter-spacing: 0.14em;
}

.ranking-portal-cta {
  background: var(--cream);
}

@media (max-width: 1024px) {
  .ranking-theme-card {
    grid-template-columns: 1fr;
  }

  .ranking-theme-card__image {
    min-height: 220px;
  }

  .ranking-theme-card__body {
    padding: 28px 24px 32px;
  }

  .ranking-portal-national-list .ranking-card {
    grid-template-columns: 72px 1fr;
    grid-template-rows: auto auto;
  }

  .ranking-portal-national-list .rank-thumb,
  .ranking-portal-national-list .rank-thumb-placeholder {
    width: 100%;
    height: 180px;
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .ranking-portal-national-list .rank-metrics {
    grid-column: 1 / -1;
    flex-direction: row;
    justify-content: flex-start;
    border-left: none;
    border-top: 1px solid rgba(184,151,90,0.15);
    padding: 16px 20px;
  }
}

@media (max-width: 768px) {
  .ranking-theme-company {
    grid-template-columns: 1fr;
  }

  .ranking-theme-company__area-link {
    justify-self: flex-start;
  }

  .ranking-portal-national-list .ranking-card {
    grid-template-columns: 60px 1fr;
  }
}

/* ===== Listing disclaimer (footer前) ===== */
.bp-listing-disclaimer {
  padding: 28px 0 36px;
  background: var(--cream);
  border-top: 1px solid rgba(13, 27, 42, 0.06);
}

.bp-listing-disclaimer__text {
  margin: 0 auto;
  max-width: 920px;
  font-size: 11px;
  line-height: 1.85;
  color: #888888;
  letter-spacing: 0.02em;
  text-align: center;
}

@media (min-width: 768px) {
  .bp-listing-disclaimer__text {
    font-size: 12px;
  }
}

/* ============================================
   Single Company (CPT) - 企業詳細ページ
   ネイビー × ゴールド / 高級感 / 流麗
============================================ */
.bp-single-company {
  --sc-navy:        #0c1624;
  --sc-navy-mid:    #14233a;
  --sc-navy-soft:   #1b2c46;
  --sc-gold:        #c4a661;
  --sc-gold-light:  #d9bf80;
  --sc-cream:       #f5f0e8;
  --sc-white:       #ffffff;
  --sc-bg:          #fbfaf7;
  --sc-surface:     #ffffff;
  --sc-text-dark:   #1a1a1a;
  --sc-text-mid:    #4a4a4a;
  --sc-text-light:  #888;
  --sc-line:        rgba(12, 22, 36, 0.08);
  --sc-line-soft:   rgba(12, 22, 36, 0.05);
  --sc-border:      rgba(196, 166, 97, 0.25);
  --sc-shadow:      0 22px 56px rgba(12, 22, 36, 0.10);
  --sc-shadow-soft: 0 10px 28px rgba(12, 22, 36, 0.06);
  --sc-shadow-card: 0 6px 18px rgba(12, 22, 36, 0.05);

  background: var(--sc-bg);
  color: var(--sc-text-dark);
  font-family: 'Noto Sans JP', 'Yu Gothic', 'Hiragino Kaku Gothic ProN', sans-serif;
}

.bp-single-company .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 48px;
}

.bp-single-company .section-header { text-align: center; margin-bottom: 56px; }
.bp-single-company .section-eyebrow {
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  color: var(--sc-gold);
  letter-spacing: 0.35em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 14px;
}
.bp-single-company .section-title {
  font-family: 'Noto Serif JP', 'Yu Mincho', 'Hiragino Mincho ProN', serif;
  font-size: clamp(22px, 2.6vw, 32px);
  font-weight: 300;
  letter-spacing: 0.1em;
  color: var(--sc-navy);
  line-height: 1.55;
}
.bp-single-company .section-title--light { color: var(--sc-navy); }
.bp-single-company .section-divider {
  width: 36px; height: 1px;
  background: var(--sc-gold);
  margin: 22px auto 0;
}

/* --- Stars (共通) --- */
.bp-stars { display: inline-flex; align-items: center; gap: 2px; }
.bp-star {
  font-size: 16px;
  line-height: 1;
  letter-spacing: 0.04em;
}
.bp-star--full  { color: var(--sc-gold); }
.bp-star--empty { color: rgba(196, 166, 97, 0.28); }
.bp-star--half {
  background: linear-gradient(90deg, var(--sc-gold) 50%, rgba(196,166,97,0.28) 50%);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
          color: transparent;
}

/* ============================================
   1) Upper Part - Hero (Mentor-site style)
   構成: タイトル＋タグ → 画像(60%) + COMPANY INFO(40%)
============================================ */
.bp-sc-hero {
  padding: 96px 0 96px;
  background: var(--sc-bg);
  position: relative;
  overflow: hidden;
}
.bp-sc-hero::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 50% 0%, rgba(196,166,97,0.07) 0%, transparent 65%);
  pointer-events: none;
}
.bp-sc-hero > .container { position: relative; }

/* --- 上段: タイトルブロック --- */
.bp-sc-hero__head {
  text-align: center;
  max-width: 880px;
  margin: 0 auto 64px;
}
.bp-sc-hero__eyebrow {
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--sc-gold);
  display: block;
  margin-bottom: 18px;
}
.bp-sc-hero__title {
  font-family: 'Noto Serif JP', 'Yu Mincho', 'Hiragino Mincho ProN', serif;
  font-size: clamp(28px, 3.6vw, 42px);
  font-weight: 400;
  color: var(--sc-navy);
  letter-spacing: 0.08em;
  line-height: 1.4;
  margin: 0 0 18px;
}
.bp-sc-hero__catch {
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(14px, 1.4vw, 17px);
  color: var(--sc-text-mid);
  line-height: 2;
  letter-spacing: 0.05em;
  margin: 0 0 28px;
}

/* --- 特徴タグ（白背景 / 薄ゴールド枠 / ✓ チェック） --- */
.bp-sc-tags {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 12px;
}
.bp-sc-tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 18px;
  background: var(--sc-surface);
  border: 1px solid rgba(196, 166, 97, 0.45);
  border-radius: 999px;
  font-family: 'Noto Serif JP', serif;
  font-size: 12.5px;
  color: var(--sc-navy);
  letter-spacing: 0.05em;
  line-height: 1.4;
  box-shadow: 0 2px 8px rgba(12, 22, 36, 0.04);
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.bp-sc-tag:hover {
  transform: translateY(-1px);
  border-color: var(--sc-gold);
  box-shadow: 0 6px 14px rgba(196, 166, 97, 0.18);
}
.bp-sc-tag__check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--sc-gold);
  color: var(--sc-white);
  flex-shrink: 0;
}
.bp-sc-tag__label { white-space: nowrap; }

/* --- 下段: 画像 + 会社情報 (60/40) --- */
.bp-sc-hero__grid {
  display: grid;
  grid-template-columns: 6fr 4fr;
  gap: 40px;
  align-items: start;
}

.bp-sc-hero__media {
  position: relative;
  margin: 0;
  background: var(--sc-surface);
  border-radius: 4px;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  box-shadow: var(--sc-shadow);
}
.bp-sc-hero__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.bp-sc-hero__image--placeholder {
  background: linear-gradient(135deg, #f1ede5 0%, #e6e1d6 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #b8a87f;
  font-family: 'Cormorant Garamond', serif;
  letter-spacing: 0.3em;
  font-size: 14px;
}

/* --- 会社情報リスト（メンターサイト風の罫線リスト） --- */
.bp-sc-info {
  position: relative;
}
.bp-sc-info__head {
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--sc-navy);
  display: flex;
  align-items: baseline;
  gap: 14px;
  flex-wrap: wrap;
}
.bp-sc-info__eyebrow {
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--sc-gold);
  white-space: nowrap;
}
.bp-sc-info__title {
  font-family: 'Noto Serif JP', serif;
  font-size: 20px;
  font-weight: 400;
  color: var(--sc-navy);
  letter-spacing: 0.1em;
  line-height: 1.4;
  margin: 0;
}

.bp-sc-info__list {
  margin: 0;
  display: grid;
  border-top: 1px solid rgba(196, 166, 97, 0.3);
}
.bp-sc-info__row {
  display: grid;
  grid-template-columns: 138px 1fr;
  gap: 14px;
  align-items: center;
  padding: 16px 4px;
  border-bottom: 1px solid rgba(196, 166, 97, 0.3);
  min-height: 56px;
}
.bp-sc-info__label {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  color: var(--sc-text-mid);
  letter-spacing: 0.1em;
  margin: 0;
}
.bp-sc-info__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(196, 166, 97, 0.10);
  color: var(--sc-gold);
  flex-shrink: 0;
}
.bp-sc-info__value {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.7;
  color: var(--sc-navy);
  letter-spacing: 0.03em;
  word-break: break-word;
}
.bp-sc-info__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--sc-navy);
  border-bottom: 1px solid var(--sc-gold);
  padding-bottom: 1px;
  transition: color 0.3s ease, border-color 0.3s ease;
  word-break: break-all;
}
.bp-sc-info__link:hover {
  color: var(--sc-gold);
  border-color: var(--sc-gold-light);
}
.bp-sc-info__link-icon { flex-shrink: 0; opacity: 0.8; }

/* ============================================
   2) About Section
============================================ */
.bp-sc-about {
  padding: 96px 0;
  background: var(--sc-cream);
}
.bp-sc-about__body {
  max-width: 820px;
  margin: 0 auto;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 16px;
  line-height: 2.05;
  letter-spacing: 0.04em;
  color: var(--sc-text-dark);
}
.bp-sc-about__body p { margin: 0 0 1.4em; }
.bp-sc-about__body h2,
.bp-sc-about__body h3 {
  font-family: 'Noto Serif JP', serif;
  font-weight: 400;
  color: var(--sc-navy);
  letter-spacing: 0.08em;
  margin: 2em 0 0.8em;
  line-height: 1.55;
}
.bp-sc-about__body h2 {
  font-size: 22px;
  border-left: 3px solid var(--sc-gold);
  padding-left: 16px;
}
.bp-sc-about__body h3 { font-size: 18px; color: var(--sc-gold); }
.bp-sc-about__body a {
  color: var(--sc-navy);
  border-bottom: 1px solid var(--sc-gold);
  transition: color 0.3s ease;
}
.bp-sc-about__body a:hover { color: var(--sc-gold); }
.bp-sc-about__body blockquote {
  margin: 1.4em 0;
  padding: 16px 22px;
  border-left: 3px solid var(--sc-gold);
  background: rgba(196,166,97,0.06);
  font-style: italic;
  color: var(--sc-text-mid);
}

/* ============================================
   3) Rating Section
============================================ */
.bp-sc-rating {
  padding: 100px 0;
  background: var(--sc-bg);
  color: var(--sc-navy);
  position: relative;
}
.bp-sc-rating::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 20% 30%, rgba(196,166,97,0.06), transparent 60%),
    radial-gradient(ellipse at 80% 70%, rgba(196,166,97,0.04), transparent 65%);
  pointer-events: none;
}
.bp-sc-rating > .container { position: relative; }

.bp-sc-rating__grid {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 56px;
  align-items: center;
}

/* --- レーダーチャート ---
   viewBox に左右 100/100、上下 20/20 の余白を持たせ、
   さらに overflow:visible でラベル切れを完全に防止。
*/
.bp-sc-rating__chart {
  background: var(--sc-surface);
  border: 1px solid var(--sc-line-soft);
  border-radius: 6px;
  padding: 28px 18px 24px;
  box-shadow: var(--sc-shadow);
  overflow: visible;
}
.bp-radar {
  width: 100%;
  height: auto;
  display: block;
  overflow: visible;
}
.bp-radar text {
  font-family: 'Noto Serif JP', 'Yu Mincho', 'Hiragino Mincho ProN', serif;
  font-feature-settings: "palt";
  paint-order: stroke fill;
}
.bp-radar__data {
  filter: drop-shadow(0 4px 10px rgba(196,166,97,0.32));
}

/* --- 右側: 総合評価 + 分布バー --- */
.bp-sc-rating__side {
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.bp-sc-rating__total {
  background: var(--sc-surface);
  border: 1px solid var(--sc-line-soft);
  padding: 32px 36px;
  border-radius: 6px;
  text-align: center;
  box-shadow: var(--sc-shadow-soft);
}
.bp-sc-rating__total-label {
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--sc-gold);
  display: block;
  margin-bottom: 14px;
}
.bp-sc-rating__total-score {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 8px;
}
.bp-sc-rating__total-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 64px;
  font-weight: 400;
  color: var(--sc-navy);
  line-height: 1;
}
.bp-sc-rating__total-out {
  font-size: 13px;
  color: var(--sc-text-light);
  letter-spacing: 0.15em;
}
.bp-sc-rating__total-stars { margin-top: 14px; }
.bp-sc-rating__total-stars .bp-star--full  { color: var(--sc-gold); }
.bp-sc-rating__total-stars .bp-star--empty { color: rgba(196, 166, 97, 0.22); }
.bp-sc-rating__total-stars .bp-star { font-size: 22px; }
.bp-sc-rating__total-meta {
  font-size: 12px;
  color: var(--sc-text-mid);
  letter-spacing: 0.08em;
  margin: 14px 0 0;
}
.bp-sc-rating__total-count { color: var(--sc-gold); margin: 0 4px; font-weight: 500; }

.bp-sc-rating__distribution {
  background: var(--sc-surface);
  border: 1px solid var(--sc-line-soft);
  padding: 26px 30px;
  border-radius: 6px;
  box-shadow: var(--sc-shadow-soft);
}
.bp-sc-rating__dist-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  letter-spacing: 0.15em;
  color: var(--sc-navy);
  margin: 0 0 16px;
}
.bp-sc-rating__dist-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.bp-sc-rating__dist-row {
  display: grid;
  grid-template-columns: 56px 1fr 56px;
  gap: 12px;
  align-items: center;
}
.bp-sc-rating__dist-star {
  font-size: 12px;
  color: var(--sc-gold);
  letter-spacing: 0.06em;
}
.bp-sc-rating__dist-bar {
  position: relative;
  display: block;
  height: 8px;
  background: rgba(12, 22, 36, 0.06);
  border-radius: 999px;
  overflow: hidden;
}
.bp-sc-rating__dist-bar-fill {
  position: absolute;
  inset: 0 auto 0 0;
  height: 100%;
  background: linear-gradient(90deg, var(--sc-gold) 0%, var(--sc-gold-light) 100%);
  border-radius: 999px;
  transition: width 0.6s ease;
}
.bp-sc-rating__dist-count {
  font-size: 11px;
  color: var(--sc-text-mid);
  letter-spacing: 0.08em;
  text-align: right;
}

/* ============================================
   4) Reviews Section
============================================ */
.bp-sc-reviews {
  padding: 100px 0;
  background: var(--sc-cream);
}
.bp-sc-reviews__empty {
  text-align: center;
  color: var(--sc-text-light);
  font-size: 14px;
  letter-spacing: 0.05em;
  max-width: 640px;
  margin: 0 auto;
  line-height: 1.9;
}

.bp-sc-reviews__list {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  max-width: 920px;
  display: grid;
  gap: 24px;
}
.bp-sc-review {
  background: #ffffff;
  border: 1px solid rgba(12,22,36,0.06);
  border-left: 3px solid var(--sc-gold);
  padding: 26px 30px;
  border-radius: 3px;
  box-shadow: 0 8px 28px rgba(12,22,36,0.04);
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}
.bp-sc-review:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 36px rgba(12,22,36,0.08);
}
.bp-sc-review__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px dashed rgba(12,22,36,0.08);
  flex-wrap: wrap;
}
.bp-sc-review__name {
  font-family: 'Noto Serif JP', serif;
  font-size: 15px;
  color: var(--sc-navy);
  letter-spacing: 0.06em;
  margin: 0;
}
.bp-sc-review__meta {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.bp-sc-review__stars .bp-star { font-size: 14px; }
.bp-sc-review__date {
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  color: var(--sc-text-light);
  letter-spacing: 0.1em;
}
.bp-sc-review__comment {
  margin: 0;
  font-size: 14px;
  line-height: 1.95;
  color: var(--sc-text-mid);
  letter-spacing: 0.03em;
}

/* ============================================
   5) CTA Button + Disclaimer
============================================ */
.bp-sc-cta {
  padding: 96px 0 110px;
  background: var(--sc-cream);
  text-align: center;
}
.bp-sc-cta__btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  font-family: 'Noto Serif JP', serif;
  font-size: 16px;
  font-weight: 400;
  color: var(--sc-navy);
  background: linear-gradient(135deg, var(--sc-gold-light) 0%, var(--sc-gold) 60%, #b59149 100%);
  padding: 22px 56px;
  letter-spacing: 0.12em;
  border: 1px solid var(--sc-gold);
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 0 14px 32px rgba(196, 166, 97, 0.28), inset 0 1px 0 rgba(255,255,255,0.4);
  transition: transform 0.4s cubic-bezier(.2,.7,.2,1),
              box-shadow 0.4s ease,
              background 0.4s ease;
  isolation: isolate;
  cursor: pointer;
}
.bp-sc-cta__btn-arrow {
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px;
  transition: transform 0.4s ease;
}
.bp-sc-cta__btn-shine {
  position: absolute;
  top: 0; left: -120%;
  width: 80%;
  height: 100%;
  background: linear-gradient(
    100deg,
    transparent 0%,
    rgba(255,255,255,0.55) 50%,
    transparent 100%
  );
  transform: skewX(-22deg);
  transition: left 0.85s cubic-bezier(.2,.7,.2,1);
  pointer-events: none;
  z-index: 1;
}
.bp-sc-cta__btn-label,
.bp-sc-cta__btn-arrow { position: relative; z-index: 2; }
.bp-sc-cta__btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 22px 44px rgba(196, 166, 97, 0.38), inset 0 1px 0 rgba(255,255,255,0.55);
  background: linear-gradient(135deg, #e6cf94 0%, var(--sc-gold-light) 60%, var(--sc-gold) 100%);
}
.bp-sc-cta__btn:hover .bp-sc-cta__btn-arrow { transform: translateX(4px); }
.bp-sc-cta__btn:hover .bp-sc-cta__btn-shine { left: 120%; }
.bp-sc-cta__btn:focus-visible {
  outline: 2px solid var(--sc-gold);
  outline-offset: 4px;
}

.bp-sc-cta__disclaimer {
  margin: 28px auto 0;
  max-width: 720px;
  font-size: 11.5px;
  line-height: 1.85;
  color: #8a8a8a;
  letter-spacing: 0.04em;
}

/* ============================================
   Responsive (tablet)
============================================ */
@media (max-width: 1024px) {
  .bp-single-company .container { padding: 0 32px; }
  .bp-sc-hero { padding: 84px 0 80px; }
  .bp-sc-hero__head { margin-bottom: 52px; }
  .bp-sc-hero__grid { gap: 32px; }
  .bp-sc-info__row { grid-template-columns: 124px 1fr; padding: 14px 4px; }
  .bp-sc-rating { padding: 84px 0; }
  .bp-sc-rating__grid { gap: 40px; }
}

@media (max-width: 860px) {
  .bp-single-company .container { padding: 0 24px; }

  .bp-sc-hero { padding: 72px 0 72px; }
  .bp-sc-hero__head { margin-bottom: 42px; }
  .bp-sc-hero__grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .bp-sc-hero__media { aspect-ratio: 16 / 9; }
  .bp-sc-info__head { padding-bottom: 12px; }
  .bp-sc-info__title { font-size: 18px; }

  .bp-sc-about { padding: 72px 0; }
  .bp-sc-about__body { font-size: 15px; line-height: 2; }

  .bp-sc-rating { padding: 72px 0; }
  .bp-sc-rating__grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .bp-sc-rating__chart { padding: 24px 12px 22px; }

  .bp-sc-reviews { padding: 72px 0; }
  .bp-sc-cta { padding: 72px 0 92px; }
}

@media (max-width: 560px) {
  .bp-single-company .container { padding: 0 18px; }
  .bp-single-company .section-header { margin-bottom: 40px; }
  .bp-single-company .section-eyebrow { font-size: 11px; letter-spacing: 0.3em; }

  .bp-sc-hero { padding: 56px 0 64px; }
  .bp-sc-hero__head { margin-bottom: 36px; }
  .bp-sc-hero__title { font-size: 24px; letter-spacing: 0.04em; }
  .bp-sc-hero__catch { font-size: 13px; line-height: 1.95; margin-bottom: 22px; }

  .bp-sc-tags { gap: 8px 8px; }
  .bp-sc-tag {
    font-size: 11.5px;
    padding: 7px 14px;
    gap: 6px;
  }
  .bp-sc-tag__check { width: 18px; height: 18px; }

  .bp-sc-hero__grid { gap: 28px; }

  /* COMPANY INFO: スマホでは縦並びリストに */
  .bp-sc-info__head { padding-bottom: 10px; border-bottom-width: 2px; }
  .bp-sc-info__eyebrow { font-size: 11px; letter-spacing: 0.25em; }
  .bp-sc-info__title { font-size: 17px; }
  .bp-sc-info__row {
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 14px 2px;
    min-height: 0;
    align-items: flex-start;
  }
  .bp-sc-info__label { font-size: 12px; letter-spacing: 0.12em; }
  .bp-sc-info__icon { width: 24px; height: 24px; }
  .bp-sc-info__value { font-size: 13.5px; padding-left: 34px; }

  .bp-sc-about { padding: 56px 0; }
  .bp-sc-about__body { font-size: 14px; line-height: 1.95; }
  .bp-sc-about__body h2 { font-size: 18px; }
  .bp-sc-about__body h3 { font-size: 16px; }

  .bp-sc-rating { padding: 60px 0; }
  .bp-sc-rating__chart { padding: 20px 6px 16px; }
  .bp-sc-rating__total { padding: 24px 22px; }
  .bp-sc-rating__total-num { font-size: 50px; }
  .bp-sc-rating__total-stars .bp-star { font-size: 18px; }
  .bp-sc-rating__distribution { padding: 18px 18px; }
  .bp-sc-rating__dist-row { grid-template-columns: 44px 1fr 44px; gap: 8px; }
  .bp-sc-rating__dist-star { font-size: 11px; }
  .bp-sc-rating__dist-count { font-size: 10.5px; }

  .bp-sc-reviews { padding: 56px 0; }
  .bp-sc-reviews__list { gap: 16px; }
  .bp-sc-review { padding: 20px 20px; }
  .bp-sc-review__head {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
  .bp-sc-review__name { font-size: 14px; }
  .bp-sc-review__comment { font-size: 13.5px; line-height: 1.9; }

  .bp-sc-cta { padding: 60px 0 76px; }
  .bp-sc-cta__btn {
    font-size: 14px;
    padding: 18px 36px;
    width: 100%;
    max-width: 360px;
    gap: 12px;
    letter-spacing: 0.08em;
  }
  .bp-sc-cta__btn-arrow { font-size: 18px; }
  .bp-sc-cta__disclaimer {
    font-size: 11px;
    line-height: 1.8;
    margin-top: 22px;
    padding: 0 6px;
  }
}

/* prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .bp-sc-review,
  .bp-sc-cta__btn,
  .bp-sc-cta__btn-arrow,
  .bp-sc-cta__btn-shine,
  .bp-sc-rating__dist-bar-fill { transition: none !important; }
  .bp-sc-cta__btn:hover { transform: none; }
}