/* Kaolia theme — main stylesheet. */
:root{
  --white:      #ffffff;
  --ivory:      #faf7f0;
  --offwhite:   #f5f0e6;
  --beige:      #f1e8d8;
  --charcoal:   #241f19;
  --ink:        #241f19;
  --muted:      #7d7365;
  --line:       #e5dbc4;
  --gold:       #c29b6d;
  --gold-deep:  #8b7355;

  --ph-bg:      #ece4d3;
  --ph-border:  #d9cdb2;
  --ph-text:    #9c8f76;

  --serif:    "Noto Serif JP", "Shippori Mincho", "Hiragino Mincho ProN", serif;
  --en-serif: "Cormorant Garamond", "Noto Serif JP", serif;
  --sans:     "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;

  --fs-hero:    clamp(38px, 3.6vw, 52px);  
  --fs-lead:    clamp(26px, 2.4vw, 34px);  
  --fs-heading: clamp(26px, 2.6vw, 34px);  
  --fs-title:   clamp(22px, 2.1vw, 28px);  
  --fs-course:  clamp(24px, 2.3vw, 30px);  
  --fs-lesson:  clamp(18px, 1.4vw, 21px);  
  --fs-body:    clamp(16.5px, 0.9vw, 18px);
  --fs-desc:    clamp(16px, 0.95vw, 17px); 
  --fs-sub:     clamp(15.5px, 0.85vw, 17px); 
  --fs-note:    clamp(13px, 0.85vw, 14px);
  --fs-caption: clamp(13px, 0.85vw, 14px);
  --dark-brown: #4a3826; 

  --gap-section: clamp(36px, 4.4vw, 64px);
  --gap-inner:   clamp(18px, 2.6vw, 36px);
  --container:   1240px;
}

@media (max-width: 1023px){
  :root{
    --fs-hero:  clamp(34px, 5vw, 44px);
    --fs-lead:  clamp(23px, 3vw, 28px);
    --fs-title: clamp(21px, 2.6vw, 25px);
    --fs-body:  clamp(16px, 1.6vw, 17px);
    --gap-section: clamp(32px, 5vw, 48px);
  }
}
@media (max-width: 767px){
  :root{
    --fs-hero:  clamp(28px, 7vw, 36px);
    --fs-lead:  clamp(21px, 5.5vw, 25px);
    --fs-title: clamp(19px, 5vw, 22px);
    --fs-body:  clamp(16px, 4vw, 17px);
    --gap-section: clamp(28px, 8vw, 40px);
  }
}

*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
html, body{ margin:0; padding:0; }

body{
  font-family: var(--serif);
  font-weight: 400;
  color: var(--ink);
  background: var(--white);
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img{ max-width:100%; display:block; height:auto; }
a{ color: inherit; }
ul{ margin:0; padding:0; list-style:none; }

.section{
  padding-top: var(--gap-section);
  padding-bottom: var(--gap-section);
  padding-left: clamp(20px, 4vw, 56px);
  padding-right: clamp(20px, 4vw, 56px);
}
.inner{ max-width: var(--container); margin: 0 auto; }

.bg-white   { background: var(--white); }
.bg-offwhite{ background: var(--offwhite); }
.bg-beige   { background: var(--beige); }
.bg-charcoal{ background: var(--charcoal); color: #f2ede3; }
.bg-charcoal .body-text{ color:#cfc7ba; }
.bg-charcoal .section-label{ color:#faf7f2; }

.bg-camel{ background:#C29B6D; color:#2b2318; }
.bg-camel .section-label{ color:#2b2318; }
.bg-camel .section-heading-mark{ background:#2b2318; }
.bg-camel .body-text{ color:#3a2f1f; }

/* FOR BUSINESS: deep brown band with ivory text */
.bg-brown-fb{ background: var(--dark-brown); color: #f5f0e6; }
.fb-frame{
  border: 1px solid rgba(245,240,230,.32);
  padding: clamp(32px,5vw,64px) clamp(24px,4.5vw,64px);
}
.fb-frame .section-label{ color: #faf7f0; }
.fb-frame .section-heading-mark{ background: var(--gold); }
.fb-frame .body-text{ color: #ece4d6; }

.section-top{ display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; margin-bottom: var(--gap-inner); }

.section-heading-mark{ width:32px; height:1px; background:var(--gold); margin-bottom:16px; }
.section-label{
  font-family: var(--serif); font-weight:500; font-size: var(--fs-heading); line-height:1.25;
  letter-spacing:.02em; margin:0;
}
.section-caption{
  font-family: var(--en-serif); font-style:italic; font-weight:500; font-size: var(--fs-caption);
  color: var(--gold-deep); text-align:right; line-height:1.55; max-width:230px;
}
.bg-charcoal .section-caption{ color: var(--gold); }
.section-more{
  font-family: var(--serif); font-size: var(--fs-note); font-weight:700; color: var(--gold-deep);
  text-decoration:none; border-bottom:1px solid transparent; white-space:nowrap; align-self:flex-end;
}
.section-more:hover{ border-color: var(--gold-deep); }

.eyebrow-sm{
  display:block; font-family: var(--en-serif); font-style:italic; font-weight:600;
  font-size: 12.5px; letter-spacing:.08em; text-transform:uppercase; color: var(--gold-deep); margin-bottom:6px;
}

.heading-lg{ font-family: var(--serif); font-weight:700; font-size: var(--fs-title); line-height:1.4; margin:0 0 12px; }
.bg-charcoal .heading-lg{ color:#faf7f2; }

.lead-text{ font-family: var(--serif); font-weight:700; font-size: var(--fs-lead); line-height:1.6; margin:0 0 14px; }

.body-text{ font-family: var(--serif); font-size: var(--fs-body); line-height: 1.85; color: #362f27; max-width: 38em; }
.support-text{ font-family: var(--serif); font-size: var(--fs-note); line-height:1.75; color: var(--muted); }

.hairline{ border:none; border-top:1px solid var(--line); }
.bg-charcoal .hairline{ border-top-color:#463f34; }

.link{
  display:inline-block; font-family: var(--serif); font-size: var(--fs-note); font-weight:700;
  color: var(--gold-deep); text-decoration:none; border-bottom:1px solid transparent; transition: border-color .25s ease;
}
.link:hover{ border-color: var(--gold-deep); }
.bg-charcoal .link{ color: var(--gold); }

.kaolia-media{ position:relative; overflow:hidden; background: var(--ph-bg); }
.kaolia-media img, .kaolia-media video{ width:100%; height:100%; object-fit:cover; display:block; }
.kaolia-placeholder{ background: var(--ph-bg); border: 1px solid var(--ph-border); display:flex; align-items:flex-end; justify-content:flex-start; }
.ratio-1x1{ aspect-ratio: 1/1; }
.ratio-4x3{ aspect-ratio: 4/3; }
.ratio-3x4{ aspect-ratio: 3/4; }
.ratio-16x9{ aspect-ratio: 16/9; }
.ratio-4x5{ aspect-ratio: 4/5; }

.kaolia-media--video-thumb{ max-width: 180px; }
.kaolia-media--video-thumb .play-glyph{ position:absolute; inset:0; margin:auto; width:26px; height:26px; display:flex; align-items:center; justify-content:center; }
.kaolia-media--video-thumb .play-glyph::after{ content:""; width:0; height:0; margin-left:2px; border-top:7px solid transparent; border-bottom:7px solid transparent; border-left:11px solid var(--ph-text); }

.site-header{
  position:sticky; top:0; width:100%; z-index:500;
  background: rgba(255,255,255,.94);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.site-header-inner{ max-width: var(--container); margin:0 auto; padding: 10px clamp(20px,4vw,56px); display:flex; align-items:center; justify-content:space-between; gap: 20px; }
.site-logo{ display:inline-block; line-height:1.1; flex:0 0 auto; font-family: var(--en-serif); }
.site-logo img{ display:block; width: clamp(135px, 10vw, 158px); height:auto; }

.site-nav ul{ display:flex; align-items:center; flex-wrap:wrap; gap: clamp(14px,1.6vw,26px); }
.site-nav a{
  
  font-family: var(--serif); font-weight:400; font-size:13.5px; letter-spacing:.02em; color: var(--ink);
  text-decoration:none; border-bottom:1px solid transparent;
  transition: border-color .25s ease, color .25s ease; white-space:nowrap;
}
.site-nav a:hover{ border-color: var(--gold); color: var(--gold-deep); }

.header-right{ display:flex; align-items:center; gap:14px; flex:0 0 auto; }

.nav-toggle{ display:none; flex-direction:column; justify-content:center; gap:4px; width:20px; height:15px; cursor:pointer; background:none; border:none; padding:0; }
.nav-toggle span{ display:block; width:100%; height:1px; background:var(--ink); }

@media (max-width: 980px){
  .site-logo img{ width:110px; }
  .nav-toggle{ display:flex; }
  .site-nav{
    position:fixed; top:52px; left:0; right:0; bottom:0; background:var(--white);
    padding: 24px clamp(20px,5vw,56px); transform: translateY(-8px); opacity:0; pointer-events:none;
    transition: opacity .25s ease, transform .25s ease; overflow-y:auto;
    z-index: 600; 
    height: calc(100vh - 52px); 
  }
  .site-nav.is-open{ opacity:1; transform:translateY(0); pointer-events:auto; }
  .site-nav ul{ flex-direction:column; gap:0; }
  .site-nav li{ width:100%; border-bottom:1px solid var(--line); }
  .site-nav a{ display:block; padding:14px 0; font-size:13px; }
  body.nav-open{ overflow:hidden; }
}

.hero{ position:relative; min-height: clamp(360px, 34vw, 520px); display:flex; align-items:center; }
.hero .kaolia-media, .media-band .kaolia-media{ position:absolute; inset:0; z-index:0; }
.hero-inner{
  position:relative; z-index:1; width:100%; max-width: var(--container); margin:0 auto;
  padding: clamp(28px,4vw,48px) clamp(20px,4vw,56px);
  display:grid; grid-template-columns: 1.4fr 0.6fr; align-items:center; gap: var(--gap-inner);
}
.hero-copy{ font-family: var(--serif); font-weight:700; color:var(--ink); font-size: var(--fs-hero); line-height:1.45; margin:0 0 14px; }
.hero-sub{ font-family: var(--serif); font-size: var(--fs-body); color:#4a4238; max-width: 30em; }
.hero-pause{
  position:absolute; z-index:1; bottom:14px; right: clamp(20px,4vw,56px); display:flex; align-items:center; gap:8px;
  font-family: var(--sans); font-size:11px; letter-spacing:.12em; color: var(--muted); text-transform:uppercase;
}

@media (max-width: 900px){
  .hero{ min-height: 58vh; }
  .hero-inner{ grid-template-columns: 1fr; text-align:left; }
  .hero-pause{ display:none; }
}

.about-grid{ display:grid; grid-template-columns: minmax(0,1.5fr) minmax(0,1fr); gap: clamp(28px,4vw,64px); align-items:center; }
.about-text .body-text:last-child{ margin-bottom:0; }
.about-text .lead-text{ line-break: strict; word-break: auto-phrase; }
/* the frame follows the image's own aspect ratio (set inline from its size) */
.about-image{ margin:0; width:100%; }
.about-image img{ width:100%; height:100%; object-fit:cover; }
/* brand statement: Kaolia = kaori × Qualia */
.about-statement{
  margin-top: clamp(32px,4vw,56px); background: var(--beige); border-left: 2px solid var(--gold);
  padding: clamp(24px,3.2vw,44px) clamp(22px,4vw,56px);
}
.about-statement__text{ max-width:none; margin:0; font-size: clamp(16.5px,1.2vw,19px); line-height:2; color:#3a2f1f; }

@media (max-width: 1023px){
  .about-grid{ grid-template-columns:1fr; }
  .about-image{ order:-1; max-width:560px; }
}

.academy-intro{ max-width: 40em; margin: 0 0 clamp(22px,2.6vw,32px); line-break: strict; word-break: auto-phrase; text-wrap: pretty; }
.academy-intro .nobr{ white-space: nowrap; }
/* wide screens: two lines, broken after the first sentence */
@media (min-width: 1140px){ .academy-intro{ max-width: 62em; } }

.academy-courses{ display:grid; grid-template-columns: repeat(3, 1fr); align-items:start; }
.academy-course{ padding: 0 clamp(16px,2vw,28px); }
.academy-course:first-child{ padding-left:0; }
.academy-course:last-child{ padding-right:0; }
.academy-course + .academy-course{ border-left: 1px solid var(--line); }
.academy-course-name{ font-family: var(--serif); font-weight:700; font-size: 19px; margin: 4px 0 12px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.academy-course-desc{ font-family: var(--serif); font-size: 14.5px; line-height:1.9; color:#3a332b; margin:0 0 16px; }
.academy-course-link{ font-family: var(--serif); font-size:13px; font-weight:700; color: var(--gold-deep); text-decoration:none; border-bottom:1px solid transparent; }
.academy-course-link:hover{ border-color: var(--gold-deep); }

.academy-course-image{ margin:0 0 14px; }

@media (min-width: 1024px){
  .academy-courses{ --ac-gap: clamp(32px,4vw,56px); column-gap: var(--ac-gap); }
  .academy-course, .academy-course:first-child, .academy-course:last-child{ padding:0; }
  .academy-course + .academy-course{ border-left:none; position:relative; }
  .academy-course + .academy-course::before{ content:""; position:absolute; top:0; bottom:0; left: calc(var(--ac-gap) / -2); border-left:1px solid var(--line); }
}
.academy-note{ font-family: var(--serif); font-size:13px; padding-top:8px; border-top:1px solid var(--line); }

@media (max-width: 1023px){
  .academy-course-name{ font-size:18px; }
}

@media (max-width: 1023px){
  .academy-courses{ grid-template-columns:1fr; gap:28px; }
  .academy-course{ padding:0 !important; border-left:none !important; padding-top:22px !important; border-top:1px solid var(--line); }
  .academy-course:first-child{ border-top:none; padding-top:0 !important; }
}

.fields-grid{ display:grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: clamp(8px,1vw,14px); }
.field-item{ display:flex; flex-direction:column; }
/* Fields of Study: plain square in a Kaolia colour (an approved image can take its place later) */
.field-tile{ display:block; width:100%; aspect-ratio: 1 / 1; margin:0; background: var(--line); }
.field-tile img{ width:100%; height:100%; object-fit:cover; display:block; }
.field-en{ font-family: var(--en-serif); font-style:italic; font-weight:600; letter-spacing:.01em; font-size:12px; color: var(--gold-deep); margin-top:9px; line-height:1.3; }
.field-ja{ font-family: var(--serif); font-size:11px; color: var(--muted); margin-top:1px; }

@media (max-width: 1023px){ .fields-grid{ grid-template-columns: repeat(4, 1fr); gap:16px 12px; } }
@media (max-width: 600px){ .fields-grid{ grid-template-columns: repeat(4, minmax(0,1fr)); gap:14px 8px; } .field-en{ font-size:11.5px; } }

.phi-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap: clamp(20px,2.4vw,32px); align-items:start; }
.phi-item-image{ margin-bottom: 14px; }
.phi-item-textonly{ padding-top: clamp(120px, 14vw, 200px); } 

@media (max-width: 900px){ .phi-grid{ grid-template-columns: repeat(2, 1fr); row-gap:32px; } }
@media (max-width: 560px){ .phi-grid{ grid-template-columns: 1fr; } }

.people-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: clamp(24px,3vw,40px); align-items:start; }
.person-photo{ margin-bottom: 16px; }
.person-name{ font-family: var(--serif); font-weight:700; font-size:20px; margin:0 0 5px; }
.person-role{ font-family: var(--sans); font-size:12.5px; color: var(--muted); margin:0 0 12px; letter-spacing:.02em; min-height:1.4em; }
.person-bio{ font-size:16px; line-height:1.85; color:#3a3733; margin:0 0 11px; }

.person-subhead{ font-family: var(--serif); font-weight:700; font-size:14.5px; letter-spacing:.04em; color:#4a3c28; margin:20px 0 6px; padding-top:12px; border-top:1px solid var(--line); }
.faculty-sub{ display:block; font-family: var(--en-serif); font-style:italic; font-size:13px; color: var(--muted); margin-top:4px; }
.person-rule{ width:20px; height:1px; background:var(--gold); border:none; margin-bottom:10px; }

@media (max-width: 900px){ .people-grid{ grid-template-columns:1fr; gap:36px; } .person-photo{ max-width: 320px; margin-left:auto; margin-right:auto; } }

.business-grid{ display:grid; grid-template-columns: repeat(5, 1fr); align-items:start; }
.business-item{ padding: 0 clamp(10px,1.2vw,16px); display:flex; flex-direction:column; }
.business-item:first-child{ padding-left:0; }
.business-item:last-child{ padding-right:0; }
.business-item + .business-item{ border-left:1px solid rgba(245,240,230,.24); }
.business-num{ font-family: var(--en-serif); font-style:italic; color: var(--gold); font-size:13px; display:block; margin-bottom:9px; } 

.business-ja{ font-family: var(--serif); font-weight:700; font-size:15px; line-height:1.5; letter-spacing:.02em; color: #faf7f0; display:block; text-wrap: balance; line-break: strict; word-break: auto-phrase; } 

.business-desc{ font-family: var(--serif); font-size:13px; line-height:1.8; color: #e6ddcd; margin:10px 0 0; text-wrap: balance; line-break: strict; }

@media (max-width: 1023px){
  .business-grid{ grid-template-columns: repeat(2, 1fr); gap: 22px 0; }
  .business-item{ padding:0 16px !important; border-left:none !important; }
  .business-item:nth-child(odd){ border-right:1px solid rgba(245,240,230,.24) !important; }
}
@media (max-width: 600px){
  .business-grid{ grid-template-columns: 1fr; }
  .business-item{ padding:14px 0 !important; border-top:1px solid rgba(245,240,230,.24); }
  .business-item:nth-child(odd){ border-right:none !important; }
  .business-item:first-child{ border-top:none; }
}

.news-contact-grid{ display:grid; grid-template-columns: 1.1fr 1fr; gap: clamp(32px,5vw,72px); align-items:start; }
.news-list li{ display:flex; gap:16px; align-items:baseline; padding:11px 0; border-top:1px solid var(--line); }
.news-list li:last-child{ border-bottom:1px solid var(--line); }
.news-date{ font-family: var(--en-serif); font-style:italic; color: var(--muted); font-size:12px; flex:0 0 auto; }
.news-cat{ font-family: var(--sans); font-size:10.5px; color: var(--gold-deep); flex:0 0 auto; }
.news-title{ font-family: var(--serif); font-size:13.5px; color: var(--ink); }

.contact-body{ max-width: 36em; margin-bottom: 16px; }
.contact-ctas{ display:grid; grid-template-columns: 1fr 1fr; gap: clamp(16px,2vw,28px); }
.contact-cta{ padding-top: 12px; border-top:1px solid var(--gold); }
.contact-cta-label{ font-family: var(--en-serif); font-style:italic; font-size:12px; letter-spacing:.04em; color: var(--gold-deep); display:block; margin-bottom:5px; }
.contact-cta-title{ font-family: var(--serif); font-size:14px; margin:0 0 9px; }

@media (max-width: 900px){
  .news-contact-grid{ grid-template-columns:1fr; gap:36px; }
  .contact-ctas{ grid-template-columns:1fr; }
}

.site-footer{ width:100%; background: var(--white); border-top:1px solid var(--line); }
.site-footer-inner{
  max-width: var(--container); margin:0 auto; padding: 20px clamp(20px,4vw,56px);
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.footer-logo{ height:20px; width:auto; }
.footer-legal{ display:flex; gap:18px; flex-wrap:wrap; }
.footer-legal a{ font-family: var(--serif); font-size:12px; color:var(--muted); text-decoration:none; border-bottom:1px solid transparent; }
.footer-legal a:hover{ border-color: var(--gold); color: var(--gold-deep); }
.footer-copy{ font-family: var(--en-serif); font-size:11px; color:var(--muted); letter-spacing:.02em; margin:0; white-space:nowrap; }

@media (max-width: 700px){ .site-footer-inner{ flex-direction:column; align-items:flex-start; } }

.bg-ivory-plain{ background: var(--ivory); }
.back-link{ margin:0; }
.back-link a{ font-family: var(--sans); font-size:12px; letter-spacing:.05em; color: var(--muted); text-decoration:none; }
.back-link a:hover{ color: var(--gold-deep); }

/* Academy course blocks (Première Classe / PROPOS 第1期 / 第2期 share one structure):
   title and summary left, intro video right, then the curriculum across the full width */
.course-head{ display:grid; grid-template-columns: minmax(0,1fr) minmax(0,460px); gap: clamp(24px,4vw,64px); align-items:center; margin-bottom: clamp(24px,3vw,40px); }
.course-head--no-media{ grid-template-columns: minmax(0,1fr); }
.course-intro .course-support{ margin-bottom:0; }
.course-intro .course-meta{ margin: 18px 0 0; }
.course-head-media{ width:100%; }
.course-term{ margin-top: clamp(28px,3.6vw,48px); }
.course-term-head{ display:flex; align-items:center; flex-wrap:wrap; gap: 10px 20px; margin-bottom: 16px; }
.course-term-head .eyebrow-sm{ margin-bottom:0; }
.course-term-head .propos-terms{ margin:0; }
.course-term > .course-meta{ margin: 0 0 16px; }
.curriculum-label{ display:block; margin-bottom:10px; }
@media (max-width: 900px){
  .course-head{ grid-template-columns: minmax(0,1fr); gap:18px; }
  .course-head-media{ max-width:460px; }
}

.lesson-detail-list{ margin:0; padding:0; list-style:none; }
/* Lectures: number, title, points (or overview) and sample video on the top row;
   the full detail text below across the width. Alternate rows carry a faint tint. */
.lesson-chapter{ padding: 16px clamp(14px,1.8vw,24px); border-top:1px solid var(--line); }
.lesson-chapter:nth-child(odd){ background: rgba(194,155,109,.07); }
.lesson-chapter:last-child{ border-bottom:1px solid var(--line); }
.lesson-num{
  display:block; font-family: var(--en-serif); font-style:italic; font-weight:600; color: var(--gold-deep);
  font-size:20px; line-height:1.2; margin-bottom:4px;
}
.lesson-title{ font-family: var(--serif); font-weight:700; font-size: clamp(16.5px,1.2vw,18.5px); line-height:1.45; margin:0 0 8px; }
.lesson-points{ margin:0 0 6px; padding:0; list-style:none; }
.lesson-points li{ font-family: var(--serif); font-size:15px; color:#3a332b; line-height:1.8; }
.lesson-desc{
  font-family: var(--serif); font-size:15px; line-height:1.9; color:#362f27;
  margin:12px 0 0; padding-top:12px; border-top:1px solid rgba(194,155,109,.28);
}
.lesson-watch-row{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.lesson-watch{ font-family: var(--en-serif); font-style:italic; font-size:14px; color: var(--gold-deep); text-decoration:none; border-bottom:1px solid transparent; white-space:nowrap; }
.lesson-watch:hover{ border-color: var(--gold-deep); }
@media (min-width: 768px){
  .lesson-head{ display:grid; grid-template-columns: 2.6em minmax(0,15em) minmax(0,1fr) auto; column-gap: clamp(14px,2vw,32px); align-items:baseline; }
  .lesson-head .lesson-num, .lesson-head .lesson-title, .lesson-head .lesson-points, .lesson-head .lesson-overview{ margin:0; }
  .lesson-desc{ margin-left: calc(2.6em + clamp(14px,2vw,32px)); }
}
@media (max-width: 1023px) and (min-width: 768px){
  .lesson-head{ grid-template-columns: 2.2em minmax(0,11em) minmax(0,1fr) auto; }
  .lesson-desc{ margin-left: calc(2.2em + clamp(14px,2vw,32px)); }
}

.propos-terms{
  display:inline-flex; align-items:center; gap:14px; flex-wrap:wrap;
  background: var(--ivory); border:1px solid var(--gold-deep);
  padding:11px 22px; margin: 4px 0 clamp(24px,3vw,36px);
  font-family: var(--serif); font-size:16px; color:#3a2f1f;
}
.propos-terms .divider{ color: var(--line); }

.youtube-block{ display:grid; grid-template-columns: 200px 1fr; gap: var(--gap-inner); align-items:center; }
.youtube-thumb{ max-width:200px; }
@media (max-width: 600px){ .youtube-block{ grid-template-columns:1fr; } .youtube-thumb{ max-width:220px; } }

.overview-source-tag{ display:block; font-size:11px; color:#9c8f76; font-family: var(--sans); margin-top:10px; }

.badge-tentative{
  display:inline-block; font-family: var(--sans); font-size:11px; letter-spacing:.05em;
  color: var(--gold-deep); border:1px solid var(--gold); padding:2px 9px; line-height:1.6;
}

.overview-hairline{ width:48px; height:1px; background:var(--gold); border:none; margin: clamp(24px,3vw,40px) 0 0; }

/* ==========================================================================
   Theme additions (WordPress templates)
   - Classes replacing the inline styles of the static preview
   - Elements added for WordPress: contact form, news links, video tiles,
     course meta (eligibility / price / application), LINE link
   ========================================================================== */
.section-heading{ margin-bottom: var(--gap-inner); }
.academy-hero-heading{ margin: 14px 0 var(--gap-inner); }
/* Academy HERO: same background video as the TOP page */
.academy-hero{ min-height: clamp(320px, 30vw, 460px); display:flex; align-items:center; }
.academy-hero > .inner{ position:relative; z-index:1; width:100%; }
.academy-hero .lead-text{ margin-bottom:0; }
.phi-title{ font-size:17px; }
.business-intro{ max-width:40em; margin-bottom: clamp(24px,3vw,40px); }
.academy-more{ margin-top: clamp(28px,3.4vw,44px); display:flex; flex-wrap:wrap; gap: 12px 28px; align-items:baseline; }
.overview-lead{ margin:10px 0 22px; }
.course-name{ font-size: var(--fs-course); margin-bottom:6px; }
.course-support{ margin-bottom: var(--gap-inner); }
.propos-term-lessons{ margin-bottom: var(--gap-inner); }
.propos-2-head{ margin-bottom:10px; }
.propos-2-head .eyebrow-sm{ margin-bottom:0; }
.academy-contact-title{ font-size: var(--fs-title); }
.academy-contact-body{ margin-bottom: var(--gap-inner); }
.bg-charcoal .contact-cta-title{ color:#f2ede3; }
#academy-contact .contact-ctas{ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }

/* HERO without video: quiet tinted band, no label */
.hero-bg{ border:none; }
button.hero-pause{ background:none; border:none; padding:0; cursor:pointer; }
.media-band .hero-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
/* HERO media: still poster first, video fades in once playing; the ripple centre sits low in the frame */
.media-band{ position:relative; }
.media-band.has-media{ background: var(--ph-bg); overflow:hidden; }
/* scale(1.012) keeps the light 1-2px rim at the right edge of the bundled footage out of view */
.media-band .hero-poster, .media-band .hero-video{ object-fit:cover; object-position: 50% 65%; transform: scale(1.012); }
.media-band .hero-poster{ width:100%; height:100%; }
.media-band .hero-video{ opacity:0; transition: opacity 1.2s ease; }
.media-band.is-playing .hero-video{ opacity:1; }
.media-band.has-media::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background: linear-gradient(90deg, rgba(250,247,240,.72) 0%, rgba(250,247,240,.5) 38%, rgba(250,247,240,0) 68%);
}
.hero-pause[hidden]{ display:none; }
@media (max-width: 900px){
  .media-band.has-media::after{ background: linear-gradient(180deg, rgba(250,247,240,.15) 0%, rgba(250,247,240,.6) 30%, rgba(250,247,240,.6) 62%, rgba(250,247,240,0) 85%); }
}
@media (prefers-reduced-motion: reduce){
  .media-band .hero-video{ transition:none; }
}

/* Placeholders never show IDs; keep them quiet */
.kaolia-placeholder{ border-color: transparent; }

/* Academy: intro video tile (links to YouTube) */
.course-video-tile{ position:relative; display:flex; align-items:flex-end; text-decoration:none; color: var(--ink); }
.course-video-tile .play-glyph{ position:absolute; inset:0; margin:auto; width:46px; height:46px; border-radius:50%; background: rgba(255,255,255,.75); display:flex; align-items:center; justify-content:center; }
.course-video-tile .play-glyph::after{ content:""; width:0; height:0; margin-left:4px; border-top:9px solid transparent; border-bottom:9px solid transparent; border-left:14px solid var(--gold-deep); }
.course-video-tile__label{ position:relative; font-family: var(--serif); font-size:13px; padding:10px 12px; }
.course-video-tile:hover .play-glyph{ background:#fff; }

/* Academy: per-course meta (only rendered when set) */
.course-meta{ margin: 0 0 var(--gap-inner); padding: 12px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.course-meta__row{ font-family: var(--serif); font-size:14px; margin:0 0 6px; }
.course-meta__label{ display:inline-block; min-width:5.5em; color: var(--muted); font-size:12.5px; }
.course-meta__apply{ display:flex; flex-wrap:wrap; gap: 8px 24px; margin:6px 0 0; }

/* News */
.news-list a.news-title{ text-decoration:none; }
.news-list a.news-title:hover{ color: var(--gold-deep); }
.page-plain{ min-height: 50vh; }
.news-article__title{ margin: 6px 0 8px; }
.news-article__image{ margin: 24px 0; }
.news-article__image img{ width:100%; height:auto; }
.news-article__body{ max-width: 40em; margin-top: 24px; }
.page-plain .back-link{ margin-top: var(--gap-inner); }

/* Contact form */
.contact-form{ margin-top: clamp(28px,3.4vw,40px); }
.contact-form__row{ margin: 0 0 16px; }
.contact-form__row > label{ display:block; font-family: var(--serif); font-size:13.5px; margin-bottom:6px; color: var(--ink); }
.contact-form .req{ font-family: var(--sans); font-size:10.5px; color: var(--gold-deep); margin-left:6px; }
.contact-form input[type="text"], .contact-form input[type="email"], .contact-form select, .contact-form textarea{
  width:100%; box-sizing:border-box; font: 15px/1.6 var(--serif); color: var(--ink);
  background:#fff; border:1px solid var(--line); border-radius:0; padding:10px 12px;
}
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus{ outline: 2px solid var(--gold); outline-offset:1px; }
.contact-form__consent label{ font-family: var(--serif); font-size:13.5px; display:flex; gap:8px; align-items:flex-start; }
.contact-form__consent a{ color: var(--gold-deep); }
.contact-form__submit button{
  font-family: var(--serif); font-size:14px; letter-spacing:.06em; color:#fff; background: var(--dark-brown);
  border:none; border-radius:0; padding:12px 36px; cursor:pointer;
}
.contact-form__submit button:hover{ background: var(--gold-deep); }
.contact-form__error{ font-family: var(--sans); font-size:12px; color:#9b3b2b; margin:6px 0 0; }
.contact-form__notice{ font-family: var(--serif); font-size:14px; padding:12px 14px; margin:0 0 18px; border:1px solid var(--line); }
.contact-form__notice.is-success{ border-color: var(--gold); background:#fffaf0; }
.contact-form__notice.is-error{ border-color:#c99a8e; background:#fdf3f0; color:#7c2e22; }
.contact-form__hp{ position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }

/* ==========================================================================
   English pages (/en/, /en/takashi-suzuki/) and the JP / EN switch
   ========================================================================== */
.lang-switch{ font-family: var(--sans); font-size:11.5px; letter-spacing:.14em; color: var(--gold-deep); text-decoration:none; border:1px solid var(--line); padding:4px 9px; line-height:1; }
.lang-switch:hover{ border-color: var(--gold); color: var(--ink); }

body.kaolia-en{ --serif: "Noto Serif", "Noto Serif JP", "Hiragino Mincho ProN", serif; }
.kaolia-en [lang="ja"]{ font-family: "Noto Serif JP", "Hiragino Mincho ProN", serif; }
.kaolia-en .hero-copy{ font-weight:500; font-size: clamp(28px, 3vw, 44px); line-height:1.3; letter-spacing:.005em; max-width: 16em; }
.kaolia-en .hero-sub{ max-width: 34em; }
.kaolia-en .lead-text{ font-weight:500; line-height:1.45; }
.kaolia-en .body-text{ max-width: 44em; line-height:1.8; }
.kaolia-en .about-text .lead-text{ font-size: clamp(22px, 2vw, 28px); }
.en-block{ margin-top: clamp(32px,4vw,56px); max-width: 52em; }

/* Fields of Study: image, English name and a one-line description */
.en-fields-grid{ display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: clamp(20px,2.4vw,32px) clamp(16px,2vw,28px); margin-top: clamp(20px,2.4vw,32px); }
.en-field{ display:grid; grid-template-columns: 64px minmax(0,1fr); gap:14px; align-items:start; }
.en-field figure, .en-field .field-tile{ margin:0; }
.en-field-name{ font-family: var(--en-serif); font-style:italic; font-weight:600; font-size:18px; color: var(--gold-deep); margin:0 0 4px; line-height:1.25; }
.en-field-desc{ font-family: var(--serif); font-size:14px; line-height:1.7; color:#3a332b; margin:0; }
@media (max-width: 1023px){ .en-fields-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 560px){ .en-fields-grid{ grid-template-columns: minmax(0,1fr); } }

/* Academy courses */
.en-course{ margin-top: clamp(36px,4.4vw,64px); padding-top: clamp(28px,3.4vw,44px); border-top:1px solid var(--line); }
.en-course-intro{ margin-top:14px; }
.en-term-title{ font-family: var(--serif); font-weight:700; font-size:18px; margin:0; }
.en-term-note{ margin:0 0 16px; }
.lesson-overview{ font-family: var(--serif); font-size:15px; color:#3a332b; line-height:1.8; margin:0 0 6px; }

/* Faculty */
.en-credentials{ list-style:none; margin:4px 0 0; padding:0; }
.en-credentials li{ font-family: var(--serif); font-size:14px; line-height:1.75; color:#3a3733; padding-left:1em; text-indent:-1em; }
.en-credentials li::before{ content:"・"; }

/* Research & Cultural Exchange (deep brown band) */
.en-dark-lead{ font-family: var(--serif); font-size: clamp(19px,1.6vw,23px); color:#faf7f0; margin:0 0 14px; }
.en-research-grid{ display:grid; grid-template-columns: minmax(0,1.4fr) minmax(0,1fr); gap: clamp(28px,4vw,56px); margin-top: clamp(24px,3vw,36px); }
.en-dark-h3{ font-family: var(--en-serif); font-style:italic; font-weight:600; font-size:18px; color: var(--gold); margin:0 0 10px; }
.en-research-list{ margin:0; padding:0; list-style:none; }
.en-research-list li{ font-family: var(--serif); font-size:15px; line-height:1.8; color:#ece4d6; padding:10px 0; border-top:1px solid rgba(245,240,230,.24); }
.en-research-list strong{ color:#faf7f0; }
.bg-brown-fb .link, .en-dark-link{ color: var(--gold); }
@media (max-width: 900px){ .en-research-grid{ grid-template-columns: minmax(0,1fr); } }

/* International Enquiries */
.en-enquiries{ display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(32px,5vw,72px); align-items:start; }
.en-enquiries .contact-form{ margin-top:0; }
@media (max-width: 900px){ .en-enquiries{ grid-template-columns: minmax(0,1fr); } }

/* Takashi Suzuki profile */
.en-profile-head{ display:grid; grid-template-columns: minmax(0,300px) minmax(0,1fr); gap: clamp(28px,4vw,64px); align-items:start; margin-top: clamp(18px,2.4vw,28px); }
.en-profile-head .person-photo{ margin:0; width:100%; }
.en-profile-name{ font-size: clamp(30px,3vw,42px); margin:0 0 8px; }
.en-profile-role{ font-family: var(--en-serif); font-style:italic; font-size:17px; color: var(--gold-deep); margin:0 0 clamp(20px,2.4vw,30px); }
.en-profile-h2{ font-family: var(--en-serif); font-style:italic; font-weight:600; font-size:13px; letter-spacing:.08em; text-transform:uppercase; color: var(--gold-deep); margin:0 0 8px; }
.en-timeline{ margin:0; }
.en-timeline-row{ display:grid; grid-template-columns: 9em minmax(0,1fr); gap: 20px; padding: 14px 0; border-top:1px solid var(--line); }
.en-timeline-row:last-child{ border-bottom:1px solid var(--line); }
.en-timeline dt{ font-family: var(--en-serif); font-weight:600; font-size:17px; color: var(--gold-deep); }
.en-timeline dd{ margin:0; font-family: var(--serif); font-size: var(--fs-sub); line-height:1.8; color:#362f27; max-width:46em; }
.en-memberships{ font-family: var(--serif); font-size:14px; color: var(--muted); margin: 18px 0 0; }
.en-expertise-grid{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: clamp(20px,2.6vw,36px); }
.en-expertise-item{ border-top:1px solid var(--gold); padding-top:14px; }
.en-expertise-title{ font-family: var(--serif); font-weight:700; font-size:17px; margin:0 0 8px; }
.en-expertise-item .body-text{ font-size:15px; }
.en-contrib-grid{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: clamp(24px,3.2vw,48px); }
.en-contrib .heading-lg{ font-size:20px; }
.en-entries{ list-style:none; margin:0; padding:0; }
.en-entry{ padding: 18px 0; border-top:1px solid var(--line); }
.en-entry:last-child{ border-bottom:1px solid var(--line); }
.en-entry.is-grasse{ border-left:2px solid var(--gold); padding-left: clamp(14px,1.8vw,22px); background: rgba(194,155,109,.07); }
.en-entry-title{ font-family: var(--serif); font-weight:600; font-size:17px; line-height:1.55; margin:0 0 6px; }
.en-entry-meta{ font-family: var(--sans); font-size:12.5px; letter-spacing:.02em; color: var(--gold-deep); margin:0 0 6px; }
.en-entry-text{ font-family: var(--serif); font-size:15px; line-height:1.8; color:#3a332b; margin:0 0 4px; max-width:50em; }
.en-pub-note{ margin:0 0 16px; }
.en-other-work{ margin-top: clamp(24px,3vw,36px); }
@media (max-width: 1023px){ .en-expertise-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 767px){
  .en-profile-head{ grid-template-columns: minmax(0,1fr); }
  .en-profile-head .person-photo{ max-width:260px; }
  .en-timeline-row{ grid-template-columns: minmax(0,1fr); gap:4px; }
  .en-expertise-grid, .en-contrib-grid{ grid-template-columns: minmax(0,1fr); }
}

/* FIELDS OF STUDY: approved design image (whole on wide screens, eight cards on narrow screens) */
.kaolia-sr-only{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.fields-figure{ margin:0; }
.fields-wide img{ display:block; width:100%; height:auto; }
.fields-cards{ list-style:none; margin:0; padding:0; display:none; }
.fields-cards img{ display:block; width:100%; height:auto; }
@media (min-width: 1100px){
  /* the image carries the heading: keep the h2 for structure and screen readers only */
  .fields-heading{ position:absolute !important; width:1px; height:1px; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
}
@media (max-width: 1099px){
  .fields-wide{ display:none; }
  .fields-cards{ display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
}
@media (max-width: 599px){
  .fields-cards{ grid-template-columns: minmax(0, 1fr); gap: 14px; max-width: 420px; margin: 0 auto; }
}

/* Navigation sub-menu (ACADEMY > アカデミー詳細) */
.site-nav .has-sub{ position:relative; display:flex; align-items:center; gap:2px; }
.sub-toggle{ background:none; border:none; padding:4px; margin:0; cursor:pointer; line-height:0; color: var(--ink); }
.sub-toggle span{ display:inline-block; width:6px; height:6px; border-right:1px solid currentColor; border-bottom:1px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .2s ease; }
.has-sub.is-open .sub-toggle span{ transform: translateY(1px) rotate(225deg); }
.sub-toggle:focus-visible{ outline: 2px solid var(--gold); outline-offset: 2px; }
.site-nav .sub-menu{ display:none; }
.site-nav .sub-menu a{ font-size:13px; }
@media (min-width: 981px){
  .site-nav .has-sub{ padding: 10px 0; margin: -10px 0; }
  .site-nav .sub-menu{ position:absolute; top:100%; left:-16px; z-index:20; min-width: 11em; padding: 10px 16px; background: var(--white); border:1px solid var(--line); box-shadow: 0 8px 24px rgba(36,31,25,.08); flex-direction:column; align-items:flex-start; gap:8px; }
  .site-nav .has-sub:hover .sub-menu, .site-nav .has-sub.is-open .sub-menu{ display:flex; }
}
@media (max-width: 980px){
  .site-nav .has-sub{ flex-wrap:wrap; }
  .site-nav .has-sub > a{ flex:1 1 auto; }
  .sub-toggle{ width:44px; height:44px; display:flex; align-items:center; justify-content:center; }
  .site-nav .sub-menu{ width:100%; padding: 0 0 8px 16px; }
  .site-nav .has-sub.is-open .sub-menu{ display:block; }
  .site-nav .sub-menu li{ border-bottom:none; }
  .site-nav .sub-menu a{ padding:10px 0; }
}

/* TOP: stronger links in Academy and Faculty (brand brown) */
.academy-course-link{ color: var(--dark-brown); border-bottom:1px solid var(--dark-brown); padding-bottom:1px; }
.academy-course-link:hover{ color: var(--gold-deep); border-color: var(--gold-deep); }
.academy-more{ align-items:center; gap: 12px 16px; }
.academy-more .link{ display:inline-block; background: var(--dark-brown); color:#fff; border:1px solid var(--dark-brown); padding: 11px 22px; font-size:13.5px; letter-spacing:.03em; line-height:1.5; }
.academy-more .link:hover{ background: var(--gold-deep); border-color: var(--gold-deep); color:#fff; }
.academy-more .link:focus-visible, .profile-link:focus-visible, .academy-course-link:focus-visible{ outline: 2px solid var(--gold); outline-offset: 3px; }
.profile-link{ color: var(--dark-brown); font-size:14px; border-bottom:1px solid var(--dark-brown); padding-bottom:1px; }
.profile-link:hover{ color: var(--gold-deep); border-color: var(--gold-deep); }

/* Academy Overview: lead on the left, text on the right (wide screens); natural Japanese line breaks */
#overview{ padding-top: clamp(28px,3.4vw,48px); padding-bottom: clamp(28px,3.4vw,48px); }
.overview-grid .lead-text, .overview-grid .body-text{ line-break: strict; word-break: auto-phrase; text-wrap: pretty; }
.overview-grid .overview-lead{ margin: 8px 0 0; }
.overview-body .body-text{ max-width:none; margin:0 0 10px; }
.overview-body .body-text:last-child{ margin-bottom:0; }
@media (min-width: 1024px){
  .overview-grid{ display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1.45fr); gap: clamp(32px,5vw,80px); align-items:end; }
}
@media (max-width: 1023px){ .overview-body{ margin-top:16px; } }

/* Japanese profile page */
.jp-expertise{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:10px 12px; }
.jp-expertise li{ font-family: var(--serif); font-size:15px; color: var(--dark-brown); border:1px solid var(--line); background: var(--ivory); padding: 8px 16px; }
.jp-en-note{ margin: 18px 0 0; }

/* Japanese profile: full profile text and brief lists */
.jp-profile-name{ font-size: clamp(22px,2.2vw,30px); line-height:1.5; margin-bottom: clamp(16px,2vw,24px); }
.jp-profile-text .body-text{ max-width:none; }
.jp-more{ margin-top: clamp(28px,3.4vw,44px); }
.jp-more .heading-lg{ font-size:18px; margin-bottom:10px; }
.jp-more-grid{ display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1.6fr); gap: 0 clamp(28px,4vw,56px); }
.jp-brief-list{ list-style:none; margin:0; padding:0; }
.jp-brief-list li{ padding: 9px 0; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap: 2px 14px; align-items:baseline; }
.jp-brief-list li:last-child{ border-bottom:1px solid var(--line); }
.jp-brief-title{ font-family: var(--serif); font-size:15px; color:#2f2922; }
.jp-brief-meta{ font-family: var(--sans); font-size:12.5px; color: var(--muted); }
@media (max-width: 900px){ .jp-more-grid{ grid-template-columns: minmax(0,1fr); } }

/* Course cards on TOP: approved images inside <picture> fill the 4:3 frame */
.kaolia-media picture{ display:block; width:100%; height:100%; }

/* ==========================================================================
   Japanese Academy page only (.academy-page): white ground, deep brown for course
   headings and dividers, gold kept to numbers, small labels and thin rules.
   ========================================================================== */
.academy-page .course-section{ border-top: 4px solid var(--dark-brown); }
.academy-page .course-name{ color: var(--dark-brown); }
.academy-page .course-head{ margin-bottom: clamp(20px,2.6vw,32px); }
.academy-page .course-term{ margin-top: clamp(32px,4vw,52px); }
.academy-page .course-term-head{ background: var(--dark-brown); padding: 12px clamp(14px,1.8vw,22px); margin-bottom: 14px; }
.academy-page .course-term-head .eyebrow-sm{ color:#f1e6d2; font-size:13.5px; }
.academy-page .course-term-head .badge-tentative{ color:#f1e6d2; border-color: rgba(241,230,210,.6); }
.academy-page .course-term-head .propos-terms{ background: var(--white); border-color: var(--white); color: var(--dark-brown); padding: 6px 16px; font-size:15px; }
.academy-page .curriculum-label{ color: var(--gold-deep); }
.academy-page .lesson-chapter{ background: var(--white); padding: 22px 0; border-top:1px solid #e6dccb; }
.academy-page .lesson-chapter:nth-child(odd){ background: var(--white); }
.academy-page .lesson-chapter:last-child{ border-bottom:1px solid #e6dccb; }
.academy-page .lesson-title{ color: var(--dark-brown); }
.academy-page .lesson-points li{ font-size:15.5px; }
.academy-page .lesson-desc{ font-size:16px; line-height:1.95; border-top:1px solid #efe8dc; }
.academy-page .course-meta{ border-color:#e6dccb; }

/* ===== STEP 4M ===== */
/* About / Philosophy images (pictures fill their frames) */
.phi-item-image{ aspect-ratio: 416 / 455; }
/* FIELDS OF STUDY: eight photos with HTML names and descriptions */
.fields-heading{ position:static !important; width:auto; height:auto; margin:0 0 var(--gap-inner); overflow:visible; clip:auto; white-space:normal; }
.fields-lead{ margin-bottom: clamp(18px,2.4vw,28px); }
.fields-photo-grid{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: clamp(22px,2.6vw,34px) clamp(16px,2vw,26px); }
.fields-photo{ margin:0 0 12px; aspect-ratio: 436 / 439; }
.fields-photo-name{ font-family: var(--serif); font-weight:700; font-size:17px; color: var(--dark-brown); margin:0 0 6px; display:flex; align-items:baseline; gap:10px; }
.fields-photo-num{ font-family: var(--en-serif); font-style:italic; font-weight:500; font-size:18px; color: var(--gold-deep); }
.fields-photo-desc{ font-family: var(--serif); font-size:14.5px; line-height:1.8; color:#3a332b; margin:0; }
@media (max-width: 1023px){ .fields-photo-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 599px){ .fields-photo-grid{ grid-template-columns: minmax(0,1fr); max-width:420px; margin:0 auto; } }

/* TOP Faculty: profile links as brown buttons */
#people .profile-link{ display:inline-block; background: var(--dark-brown); color:#fff; border:1px solid var(--dark-brown); padding: 10px 20px; font-size:13.5px; margin-top:6px; }
#people .profile-link:hover{ background: var(--gold-deep); border-color: var(--gold-deep); color:#fff; }

/* Japanese Academy page: one framed box per course, heading band, application buttons */
.academy-page .course-section{ border-top:none; }
.academy-page .course-box{ border:1px solid var(--dark-brown); background: var(--white); padding: clamp(18px,3vw,40px); }
.academy-page #propos .course-box{ margin-top: clamp(36px,4.6vw,64px); }
.academy-page .course-band{ background: var(--dark-brown); color:#fff; font-family: var(--serif); font-weight:700; font-size: clamp(15px,1.3vw,18px); letter-spacing:.04em; margin: calc(-1 * clamp(18px,3vw,40px)) calc(-1 * clamp(18px,3vw,40px)) clamp(20px,2.6vw,32px); padding: 14px clamp(18px,3vw,40px); }
.academy-page .course-box > .course-term-head:first-child{ margin: calc(-1 * clamp(18px,3vw,40px)) calc(-1 * clamp(18px,3vw,40px)) 16px; padding: 14px clamp(18px,3vw,40px); }
.apply-row{ margin: 16px 0 0; }
.apply-btn{ display:inline-block; background: var(--dark-brown); color:#fff; border:1px solid var(--dark-brown); font-family: var(--serif); font-weight:700; font-size:14px; letter-spacing:.04em; padding: 12px 26px; text-decoration:none; }
a.apply-btn:hover{ background: var(--gold-deep); border-color: var(--gold-deep); }
.apply-btn.is-disabled{ opacity:.55; cursor:not-allowed; }
.apply-btn__note{ font-weight:400; font-size:12.5px; margin-left:4px; }
.course-term > .apply-row{ margin: 0 0 18px; }

/* English pages: leads and the Suzuki profile head in dark brown */
.kaolia-en main .lead-text{ color: var(--dark-brown); border-left:3px solid var(--dark-brown); padding-left: clamp(12px,1.4vw,18px); }
.kaolia-en .fields-lead{ border-left:3px solid var(--dark-brown); }
.kaolia-en .en-profile-hero{ border-top: 4px solid var(--dark-brown); }
.kaolia-en .en-profile-name{ color: var(--dark-brown); }
.kaolia-en .en-profile-role{ display:inline-block; background: var(--dark-brown); color:#fff; font-style:normal; font-size:14.5px; padding: 6px 14px; }
.kaolia-en .en-profile-head .body-text{ border-left:3px solid var(--dark-brown); padding-left: clamp(12px,1.4vw,18px); }

/* ===== STEP 4P-2: きわめる／うみだす (Deepen / Create) and fragrance literacy ===== */
.principles-grid{ display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap:0; }
.principle{ padding: clamp(8px,1vw,12px) clamp(20px,3.6vw,56px); }
.principle:first-child{ padding-left:0; }
.principle + .principle{ border-left:1px solid var(--gold); padding-right:0; }
.principle-title{ font-family: var(--serif); font-weight:700; font-size: clamp(22px,2vw,28px); color: var(--dark-brown); margin:0 0 6px; letter-spacing:.03em; }
.principle-num{ font-family: var(--en-serif); font-style:italic; font-weight:500; color: var(--gold-deep); margin-right:4px; }
.principle-sub{ font-family: var(--serif); font-size:15px; color: var(--gold-deep); margin:0 0 18px; padding-bottom:14px; border-bottom:1px solid var(--gold); }
.principle-text{ font-family: var(--serif); font-size: var(--fs-body); line-height:1.95; color:#362f27; margin:0 0 14px; }
.principle-text:last-child{ margin-bottom:0; }
@media (max-width: 767px){
  .principles-grid{ grid-template-columns: minmax(0,1fr); }
  .principle, .principle:first-child{ padding: 0; }
  .principle + .principle{ border-left:none; border-top:1px solid var(--gold); margin-top: 28px; padding-top: 28px; }
  .principle-text br{ display:none; }
}
.literacy-block{ background: var(--ivory); border-left:2px solid var(--gold); padding: clamp(18px,2.4vw,30px) clamp(20px,3vw,40px); margin: 0 0 clamp(24px,3vw,36px); max-width: 52em; }
.literacy-title{ font-family: var(--serif); font-weight:700; font-size: clamp(19px,1.6vw,23px); color: var(--dark-brown); margin:0 0 12px; }
.literacy-text p{ font-family: var(--serif); font-size: var(--fs-body); line-height:1.9; color: var(--dark-brown); margin:0 0 8px; line-break: strict; word-break: auto-phrase; text-wrap: pretty; }
.literacy-text p:last-child{ margin-bottom:0; }
.kaolia-en .literacy-text p{ word-break: normal; }

/* ===== STEP 4P-3: For Business (JP and EN) — regular 3 + 2 grid of ivory cards ===== */
.business-cards .business-grid{ display:grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap: clamp(16px,1.8vw,24px); align-items:stretch; }
.business-cards .business-item{ grid-column: span 2; background: var(--ivory); border:1px solid var(--gold) !important; padding: clamp(20px,2vw,28px) !important; }
.business-cards .business-item:nth-child(4), .business-cards .business-item:nth-child(5){ grid-column: span 3; }
.business-cards .business-ja{ font-size:17px; line-height:1.45; color: var(--dark-brown); padding-bottom:10px; border-bottom:1px solid var(--gold); text-wrap: balance; }
.business-cards .business-desc{ font-size:15px; line-height:1.8; color: var(--dark-brown); margin-top:12px; text-wrap: pretty; }
@media (max-width: 1023px){
  .business-cards .business-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .business-cards .business-item, .business-cards .business-item:nth-child(4), .business-cards .business-item:nth-child(5){ grid-column: span 1; }
}
@media (max-width: 600px){
  .business-cards .business-grid{ grid-template-columns: minmax(0,1fr); gap:14px; }
}

/* ===== STEP 4R: visual hierarchy ===== */
/* For Business cards (JP and EN share the rules above) */
.business-cards .business-intro{ margin-bottom: clamp(22px,2.6vw,32px); }

/* きわめる / うみだす (Deepen / Create): two paired cards of equal height */
#principles.principles-section{ background: var(--white); }
.principles-grid{ gap: clamp(18px,2.4vw,32px); align-items:stretch; }
.principle, .principle:first-child, .principle + .principle{ padding: clamp(26px,3vw,44px) clamp(22px,3vw,44px); border-left:none; }
.principle--deepen{ background: var(--ph-bg); }
.principle--create{ background: var(--ivory); border:1px solid var(--gold) !important; }
@media (max-width: 767px){
  .principle + .principle{ margin-top:0; border-top:none; padding-top: clamp(26px,3vw,44px); }
  .principles-grid{ gap:16px; }
}

/* 香りをことばにする力 / Giving fragrance a language: the key message */
.literacy-block{ background:#fffdf8; border:2px solid var(--gold); padding: clamp(24px,3vw,44px) clamp(22px,3.4vw,52px); max-width: 56em; }
.literacy-title{ font-size: clamp(22px,2vw,29px); margin:0 0 16px; }
.literacy-title::after{ content:""; display:block; width:44px; height:2px; background: var(--gold); margin-top:12px; }
.literacy-text p{ line-height:2; }

/* Academy course cards (TOP): short course label */
.course-label{ display:inline-block; font-family: var(--serif); font-size:12.5px; letter-spacing:.06em; color: var(--dark-brown); border:1px solid var(--gold); background: var(--white); padding:3px 10px; margin: 0 0 12px; }
/* English About: the existing course descriptors shown as the same labels */
.kaolia-en .en-course .course-support, .kaolia-en .course-term-head .eyebrow-sm{ display:inline-block; font-family: var(--serif); font-style:normal; font-size:12.5px; letter-spacing:.06em; text-transform:none; color: var(--dark-brown); border:1px solid var(--gold); background: var(--white); padding:3px 10px; }

/* FIELDS OF STUDY: what you learn — clear names under each photo */
.fields-photo{ margin-bottom:14px; }
.fields-photo-name{ font-size:18px; padding-bottom:8px; margin-bottom:10px; border-bottom:1px solid var(--gold); }
.fields-photo-desc{ font-size:14px; color:#4a4238; }

/* PHILOSOPHY: four viewpoints — each with its own gold rule beside the text */
.phi-grid > div > .eyebrow-sm, .phi-grid > div > .phi-title, .phi-grid > div > .body-text{ border-left:2px solid var(--gold); padding-left:14px; margin-left:0; }
.phi-grid > div > .eyebrow-sm{ margin-bottom:0; padding-top:2px; letter-spacing:.12em; }
.phi-title{ font-size:19px; color: var(--dark-brown); margin:0; padding-top:6px; padding-bottom:10px; }
.phi-grid > div > .body-text{ margin-top:0; padding-bottom:4px; font-size:15px; }
.phi-item-image{ margin:0 0 16px; }

/* ===== STEP 4S: the literacy message as a dark band, then clear space before the courses =====
   Colour, border and spacing only; font family, size, weight, line height and letter spacing unchanged. */
.literacy-block{ background: var(--dark-brown); border:1px solid var(--gold); padding: clamp(28px,3.4vw,48px) clamp(24px,3.8vw,56px); margin-bottom: 72px; }
.literacy-title{ color:#faf7f0; }
.literacy-text p{ color:#ece4d6; }
@media (max-width: 1023px){ .literacy-block{ margin-bottom: 56px; } }
@media (max-width: 600px){ .literacy-block{ margin-bottom: 40px; } }