@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;500;600;700&family=Noto+Sans+JP:wght@300;400;500;700&family=Cormorant+Garamond:ital,wght@0,400;0,600;1,400&display=swap');

:root {
  --navy:        #1a2744;
  --navy-light:  #243358;
  --ivory:       #fdfaf5;
  --ivory-dark:  #f0ebe0;
  --ivory-deep:  #e4ddd0;
  --amber:       #c4832a;
  --amber-light: #e8a84a;
  --amber-pale:  #fdf4e3;
  --sea:         #3d7a8a;
  --text:        #1e1a16;
  --text-muted:  #6b6058;
  --white:       #ffffff;
  --font-ja:     'Noto Sans JP', sans-serif;
  --font-min:    'Shippori Mincho', serif;
  --font-en:     'Cormorant Garamond', serif;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family: var(--font-ja);
  background: var(--white);
  color: var(--text);
  line-height: 1.9;
  font-size: 17px;
  -webkit-font-smoothing: antialiased;
}

/* ======== NAV ======== */
nav {
  position:fixed; top:0; width:100%; z-index:200;
  background:rgba(255,255,255,0.97);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--ivory-dark);
  padding:0 5vw;
  display:flex; align-items:center; justify-content:space-between;
  height:80px;
}
.nav-logo { text-decoration:none; display:flex; flex-direction:column; line-height:1.2; }
.nav-logo-main { font-family:var(--font-en); font-size:32px; color:var(--navy); letter-spacing:0.06em; font-weight:600; }
.nav-logo-sub  { font-size:12px; letter-spacing:0.24em; color:var(--amber); font-family:var(--font-ja); font-weight:500; }

.nav-links { display:flex; gap:36px; list-style:none; }
.nav-links a { color:var(--text-muted); text-decoration:none; font-size:16px; letter-spacing:0.04em; transition:color 0.2s; font-weight:400; }
.nav-links a:hover,
.nav-links a.active { color:var(--navy); }

.nav-cta { background:var(--amber); color:var(--white); padding:12px 28px; border-radius:3px; font-size:15px; text-decoration:none; letter-spacing:0.06em; transition:background 0.2s; font-weight:500; white-space:nowrap; }
.nav-cta:hover { background:var(--amber-light); }

.nav-hamburger { display:none; flex-direction:column; gap:6px; cursor:pointer; padding:4px; }
.nav-hamburger span { display:block; width:28px; height:2px; background:var(--navy); border-radius:2px; }

/* ======== PAGE HERO (inner) ======== */
.page-hero {
  padding:148px 5vw 96px; background:var(--ivory);
  position:relative; overflow:hidden; border-bottom:1px solid var(--ivory-dark);
}
.page-hero-accent {
  position:absolute; top:0; right:0; width:42%; height:100%;
  background:linear-gradient(135deg, var(--amber-pale) 0%, var(--ivory-dark) 100%);
  clip-path:polygon(18% 0, 100% 0, 100% 100%, 0% 100%);
}
.page-hero-content { position:relative; max-width:660px; }
.page-eyebrow { font-family:var(--font-en); font-size:15px; letter-spacing:0.3em; color:var(--amber); margin-bottom:20px; display:flex; align-items:center; gap:14px; }
.page-eyebrow::before { content:''; display:block; width:36px; height:2px; background:var(--amber); }
.page-hero h1 { font-family:var(--font-min); font-size:clamp(34px,4vw,56px); color:var(--navy); line-height:1.5; margin-bottom:22px; font-weight:600; }
.page-hero h1 em { font-style:normal; color:var(--amber); }
.page-hero p { color:var(--text-muted); font-size:18px; font-weight:400; max-width:520px; line-height:2; }

/* ======== SECTIONS ======== */
section { padding:100px 5vw; }
.section-label { font-family:var(--font-en); font-size:14px; letter-spacing:0.3em; color:var(--amber); margin-bottom:18px; display:flex; align-items:center; gap:14px; }
.section-label::before { content:''; display:block; width:36px; height:2px; background:var(--amber); }
.section-title { font-family:var(--font-min); font-size:clamp(30px,3.2vw,44px); font-weight:600; line-height:1.5; color:var(--navy); margin-bottom:18px; }
.section-desc { color:var(--text-muted); font-size:18px; font-weight:400; line-height:2; max-width:600px; margin-bottom:60px; }

/* ======== BUTTONS ======== */
.btn-primary { background:var(--amber); color:var(--white); padding:16px 40px; border-radius:3px; font-size:16px; text-decoration:none; font-weight:500; letter-spacing:0.06em; transition:background 0.2s, transform 0.15s; display:inline-block; }
.btn-primary:hover { background:var(--amber-light); transform:translateY(-2px); }
.btn-outline { border:2px solid var(--navy); color:var(--navy); padding:14px 36px; border-radius:3px; font-size:16px; text-decoration:none; font-weight:500; letter-spacing:0.06em; transition:background 0.2s, color 0.2s; display:inline-block; }
.btn-outline:hover { background:var(--navy); color:var(--white); }
.btn-white { border:2px solid rgba(255,255,255,0.55); color:var(--white); padding:14px 36px; border-radius:3px; font-size:16px; text-decoration:none; font-weight:500; letter-spacing:0.06em; transition:background 0.2s; display:inline-block; }
.btn-white:hover { background:rgba(255,255,255,0.12); }

/* ======== TEACHER — 丸写真（小）＋右テキスト ======== */
.teacher-section { background:var(--ivory); }
.teacher-profile {
  display:flex; flex-direction:row; align-items:flex-start; gap:48px;
  background:var(--white); border:1px solid var(--ivory-dark); border-radius:10px;
  padding:52px 56px; margin-bottom:24px;
  transition:box-shadow 0.25s;
}
.teacher-profile:hover { box-shadow:0 8px 40px rgba(0,0,0,0.09); }
.teacher-profile-img {
  width:200px; height:200px; flex-shrink:0;
  object-fit:cover; object-position:center top;
  border-radius:50%;
  display:block;
}
.teacher-profile-body {
  flex:1; min-width:0;
  display:flex; flex-direction:column; justify-content:flex-start;
}
.teacher-tag {
  font-family:var(--font-en); font-size:13px; letter-spacing:0.22em;
  color:var(--amber); border:1.5px solid var(--amber);
  padding:5px 16px; border-radius:2px; display:inline-block; margin-bottom:16px;
  width:fit-content;
}
.teacher-name { font-family:var(--font-min); font-size:34px; font-weight:600; color:var(--navy); margin-bottom:4px; line-height:1.3; }
.teacher-name-en { font-family:var(--font-en); font-size:16px; color:var(--text-muted); letter-spacing:0.1em; margin-bottom:20px; }
.teacher-bio { font-size:16px; color:var(--text-muted); font-weight:400; line-height:2.1; margin-bottom:22px; }
.teacher-career { list-style:none; display:flex; flex-direction:column; gap:9px; }
.teacher-career li { font-size:15px; color:var(--text-muted); padding-left:22px; position:relative; line-height:1.8; }
.teacher-career li::before { content:'—'; position:absolute; left:0; color:var(--amber); font-size:14px; }

/* ======== CTA BAND ======== */
.cta-band { background:var(--navy); padding:100px 5vw; text-align:center; }
.cta-band .section-label { justify-content:center; }
.cta-band .section-label::before { display:none; }
.cta-band .section-title { color:var(--white); }
.cta-band-desc { color:rgba(255,255,255,0.68); font-size:18px; font-weight:400; margin-bottom:48px; line-height:2; }
.cta-buttons { display:flex; gap:18px; justify-content:center; flex-wrap:wrap; }

/* ======== FOOTER ======== */
footer { background:#111827; padding:60px 5vw; display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:28px; }
.footer-logo-main { font-family:var(--font-en); font-size:26px; color:rgba(255,255,255,0.65); letter-spacing:0.08em; display:block; text-decoration:none; margin-bottom:6px; }
.footer-logo-sub { font-size:13px; color:rgba(255,255,255,0.3); letter-spacing:0.18em; }
.footer-copy { font-size:13px; color:rgba(255,255,255,0.2); margin-top:10px; }
.footer-links { display:flex; gap:28px; flex-wrap:wrap; align-items:center; }
.footer-links a { font-size:15px; color:rgba(255,255,255,0.45); text-decoration:none; font-weight:400; transition:color 0.2s; }
.footer-links a:hover { color:var(--amber-light); }

/* ======== REVEAL ======== */
.reveal { opacity:0; transform:translateY(32px); transition:opacity 0.75s ease, transform 0.75s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.d1 { transition-delay:0.1s; } .d2 { transition-delay:0.2s; }

/* ======== RESPONSIVE ======== */
@media (max-width:900px) {
  nav { padding:0 20px; height:72px; }
  .nav-links, .nav-cta { display:none; }
  .nav-hamburger { display:flex; }
  nav.open .nav-links { display:flex; flex-direction:column; position:fixed; top:72px; left:0; right:0; background:var(--white); border-bottom:1px solid var(--ivory-dark); padding:28px 20px; gap:22px; }
  nav.open .nav-cta { display:block; margin:0 20px 20px; text-align:center; }
  section { padding:68px 20px; }
  .page-hero { padding:118px 20px 68px; }
  .page-hero-accent { display:none; }
  .teacher-profile { flex-direction:column; align-items:center; padding:36px 24px; }
  .teacher-profile-img { width:160px; height:160px; }
  .teacher-profile-body { width:100%; }
  footer { flex-direction:column; align-items:flex-start; }
  .nav-logo-main { font-size:26px; }
}