/* ============================================================
   CHAKRA GLASS — Sub-page styles (course / session / contact)
   ============================================================ */

/* page banner */
.page-hero {
  padding: clamp(140px,18vh,210px) var(--gutter) clamp(56px,8vw,96px);
  background: var(--bg-alt);
  text-align: center;
  border-bottom: 1px solid var(--line);
}
.page-hero .kicker { margin-bottom: 1.4em; }
.page-hero h1 {
  font-size: clamp(1.9rem,5vw,3.2rem); font-weight: 600; line-height: 1.4; letter-spacing: .08em;
}
.page-hero .en-title { font-family: var(--serif-en); font-style: italic; color: var(--clay); font-size: clamp(1.1rem,2.4vw,1.5rem); display:block; margin-bottom:.5em; }
.page-hero p { max-width: 52ch; margin: 1.6em auto 0; color: var(--ink-soft); line-height: 2.1; }

.breadcrumb { margin-bottom: 2em; font-size: .76rem; letter-spacing:.12em; color: var(--ink-faint); }
.breadcrumb a:hover { color: var(--clay); }

/* course blocks */
.course { display: grid; grid-template-columns: auto 1fr; gap: clamp(20px,3vw,48px); padding: clamp(30px,4vw,52px) 0; border-top: 1px solid var(--line); }
.course:last-child { border-bottom: 1px solid var(--line); }
.course .c-no { font-family: var(--serif-en); font-style: italic; font-size: clamp(1.4rem,3vw,2rem); color: var(--clay); line-height: 1; }
.course h3 { font-size: clamp(1.2rem,2.4vw,1.6rem); font-weight: 600; line-height: 1.6; letter-spacing:.06em; }
.course .meta { font-size: .82rem; letter-spacing:.12em; color: var(--ink-faint); margin: .8em 0 1.4em; }
.course p { font-size: .96rem; line-height: 2.05; color: var(--ink-soft); margin: 0 0 1.4em; max-width: 62ch; }
.course .pricelines { display: grid; gap: .5em; margin-top: 1.2em; }
.course .pl { display: flex; justify-content: space-between; gap: 1.4em; padding: .7em 0; border-bottom: 1px dashed var(--line); font-size: .95rem; }
.course .pl .pl-name { color: var(--ink-soft); }
.course .pl .pl-amt { font-family: var(--serif-en); font-size: 1.15rem; font-weight: 600; white-space: nowrap; }
.course .pl.total .pl-amt { color: var(--clay-deep); }
@media (max-width: 680px){ .course { grid-template-columns: 1fr; } }

.note-box { background: var(--bg-alt); border-left: 4px solid var(--clay); padding: clamp(22px,3vw,32px); margin-top: clamp(40px,5vw,60px); }
.note-box h4 { font-size: 1rem; letter-spacing:.1em; margin:0 0 .8em; }
.note-box p, .note-box li { font-size: .9rem; line-height: 1.95; color: var(--ink-soft); margin:.2em 0; }
.note-box ul { padding-left: 1.2em; margin:.4em 0; }

/* therapy ticket grid */
.ticket-grid { display:grid; grid-template-columns: repeat(auto-fit,minmax(160px,1fr)); gap: 14px; margin-top: clamp(28px,4vw,40px); }
.ticket { background: var(--paper); border: 1px solid var(--line); padding: clamp(22px,2.6vw,30px); text-align:center; }
.ticket .t-label { font-size: .82rem; letter-spacing:.12em; color: var(--ink-soft); }
.ticket .t-amt { font-family: var(--serif-en); font-size: clamp(1.5rem,3vw,2rem); font-weight: 600; margin: .4em 0 .2em; }
.ticket .t-sub { font-size: .74rem; color: var(--ink-faint); letter-spacing:.1em; }

/* tag chips */
.chips { display:flex; flex-wrap:wrap; gap:10px; margin-top: clamp(24px,3vw,36px); }
.chip { font-size:.82rem; letter-spacing:.08em; padding:.55em 1.2em; border:1px solid var(--line); border-radius:999px; color:var(--ink-soft); background:var(--paper); }

/* schedule */
.schedule { background: var(--bg-alt); }
.booking-panel {
  background: var(--paper);
  border: 1px solid var(--line);
  padding: clamp(28px,4vw,48px);
  margin-top: clamp(32px,5vw,52px);
  text-align: center;
}
.booking-panel p {
  max-width: 48ch;
  margin: 0 auto 1.8em;
  color: var(--ink-soft);
  line-height: 2;
}
.booking-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
}
.sched-grid { display:grid; grid-template-columns: repeat(auto-fill,minmax(150px,1fr)); gap:12px; margin-top: clamp(28px,4vw,40px); }
.sched-day { background: var(--paper); border:1px solid var(--line); padding: 1.1em 1.2em; }
.sched-day .d { font-family: var(--serif-en); font-size: 1.3rem; font-weight:600; }
.sched-day .d small { font-size:.6em; color: var(--ink-faint); margin-left:.4em; letter-spacing:.1em; }
.sched-day .times { font-size:.82rem; color:var(--ink-soft); letter-spacing:.08em; margin-top:.4em; line-height:1.8; }

/* contact form */
.form-card { background: var(--paper); border:1px solid var(--line); padding: clamp(28px,4vw,56px); }
.field { margin-bottom: 1.6em; }
.field label { display:block; font-size:.84rem; letter-spacing:.1em; margin-bottom:.7em; color:var(--ink); }
.field label .req { color: var(--c-red); font-size:.7em; margin-left:.5em; letter-spacing:.1em; }
.field .row2 { display:grid; grid-template-columns:1fr 1fr; gap:1em; }
.field input, .field select, .field textarea {
  width:100%; font-family: var(--serif-jp); font-size:1rem; color:var(--ink);
  background: var(--bg); border:1px solid var(--line); border-radius: var(--radius);
  padding: .9em 1em; transition: border-color .3s, background .3s; letter-spacing:.04em;
}
.field input:focus, .field select:focus, .field textarea:focus { outline:0; border-color: var(--clay); background: var(--paper); }
.field textarea { resize: vertical; min-height: 140px; line-height:1.9; }
.radio-row { display:flex; gap: 1.4em; }
.radio-row label { display:inline-flex; align-items:center; gap:.5em; font-size:.95rem; letter-spacing:.04em; cursor:pointer; }
.form-foot { display:flex; flex-direction:column; align-items:center; gap:1.2em; margin-top: 1em; }
.form-foot .agree { font-size:.78rem; color:var(--ink-faint); letter-spacing:.06em; }
@media (max-width: 560px){ .field .row2 { grid-template-columns:1fr; } }

/* split contact intro */
.contact-grid { display:grid; grid-template-columns: .9fr 1.2fr; gap: clamp(32px,5vw,72px); align-items:start; }
.contact-aside .line { display:flex; gap:1em; padding:1.1em 0; border-bottom:1px solid var(--line); }
.contact-aside .line .ic { width:36px;height:36px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;flex:none; }
.contact-aside .line .ic svg{width:16px;height:16px;stroke:var(--clay);}
.contact-aside .line .t .k { font-size:.74rem; letter-spacing:.14em; color:var(--ink-faint); }
.contact-aside .line .t .v { font-size:.98rem; }
@media (max-width: 820px){ .contact-grid { grid-template-columns:1fr; } }
