/* ============================================================
   KURO CLINIC — ABOUT / RITUAL / CONTACT CSS
   ============================================================ */

/* ── ABOUT ───────────────────────────────────────────────────── */
.founders-section {
  display: grid; grid-template-columns: 1fr 1fr;
  border-bottom: 0.5px solid var(--border-dark);
  min-height: 560px;
}
.founders-img {
  position: relative; overflow: hidden;
  min-height: 480px; background: var(--bg-dark-elevated);
  border-right: 0.5px solid var(--border-dark);
}
.founders-img img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center top; display: block;
  transition: transform 6s ease;
}
.founders-img:hover img { transform: scale(1.03); }
.founders-copy {
  padding: 72px var(--inset);
  display: flex; flex-direction: column; justify-content: center;
}
.founder-h {
  font-family: var(--font-editorial); font-style: italic;
  font-size: clamp(24px, 2.5vw, 34px); font-weight: 400;
  color: var(--text-dark-primary); line-height: 1.2; margin: 20px 0;
}
.founder-body { font-size: 13px; line-height: 1.95; color: var(--text-dark-muted); margin-bottom: 16px; }
.founders-social { margin-top: 32px; padding-top: 24px; border-top: 0.5px solid var(--border-dark); }
.founders-social-label { font-size: 9px; letter-spacing: 0.32em; text-transform: uppercase; color: var(--text-dark-muted); margin-bottom: 14px; display: block; }

/* Mission */
.mission-band {
  padding: 64px var(--inset);
  border-bottom: 0.5px solid var(--border-dark);
  display: grid; grid-template-columns: 200px 1fr; gap: 72px; align-items: start;
}
.mission-label-txt { font-size: 10px; letter-spacing: 0.34em; text-transform: uppercase; color: var(--text-dark-muted); display: flex; align-items: center; gap: 12px; padding-top: 6px; }
.mission-label-txt::before { content:''; display:block; width:22px; height:0.5px; background:currentColor; flex-shrink:0; }
.mission-copy { font-family: var(--font-editorial); font-style: italic; font-size: clamp(18px,2vw,26px); color: var(--text-dark-primary); line-height: 1.55; font-weight: 400; }

/* Team grid */
.team-section { padding: 72px var(--inset); border-bottom: 0.5px solid var(--border-dark); }
.team-grid { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 40px; }
.team-card { border-right: 0.5px solid var(--border-dark); border-top: 0.5px solid var(--border-dark); overflow: hidden; }
.team-card:first-child { border-left: 0.5px solid var(--border-dark); }
.team-card:nth-child(4n+1):not(:first-child) { border-left: 0.5px solid var(--border-dark); }
.team-card-img {
  width: 100%;
  aspect-ratio: 3/4;
  overflow: hidden;
  position: relative;
  background: var(--bg-dark-elevated);
}
/* Netlify-safe portrait images */
.team-card-img img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center top; /* always show face */
  display: block;
  transition: transform 5s ease;
}
.team-card:hover .team-card-img img { transform: scale(1.05); }
.team-card-info { padding: 18px 20px 24px; }
.team-name { font-family: var(--font-editorial); font-style: italic; font-size: 16px; color: var(--text-dark-secondary); margin-bottom: 4px; }
.team-title { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-dark-muted); line-height: 1.5; }

/* ── RITUAL ──────────────────────────────────────────────────── */
.ritual-hero-split {
  display: grid; grid-template-columns: 1fr 1fr;
  border-bottom: 0.5px solid var(--border-dark); min-height: 520px;
}
.ritual-hero-img {
  position: relative; overflow: hidden;
  min-height: 460px; background: var(--bg-dark-elevated);
  border-right: 0.5px solid var(--border-dark);
}
.ritual-hero-img img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center; display: block;
  transition: transform 6s ease;
}
.ritual-hero-img:hover img { transform: scale(1.03); }
.ritual-hero-copy { padding: 72px var(--inset); display: flex; flex-direction: column; justify-content: center; }
.ritual-hero-h { font-family: var(--font-editorial); font-style: italic; font-size: clamp(26px,2.8vw,38px); color: var(--text-dark-primary); line-height: 1.2; margin: 20px 0; font-weight: 400; }
.ritual-hero-body { font-size: 13px; line-height: 1.95; color: var(--text-dark-muted); margin-bottom: 16px; }

.principles { padding: 72px var(--inset); border-bottom: 0.5px solid var(--border-dark); }
.principles-grid { display: grid; grid-template-columns: repeat(2,1fr); margin-top: 44px; }
.principle-item {
  padding: 40px 36px;
  border: 0.5px solid var(--border-dark); border-top: none; border-left: none;
}
.principle-item:nth-child(2n+1) { border-left: 0.5px solid var(--border-dark); }
.principle-item:nth-child(n+3)  { border-top: 0.5px solid var(--border-dark); }
.principle-num { font-family: var(--font-display); font-size: 9px; letter-spacing: 0.22em; color: var(--border-dark); margin-bottom: 18px; }
.principle-title { font-family: var(--font-editorial); font-style: italic; font-size: 21px; color: var(--text-dark-secondary); margin-bottom: 10px; }
.principle-body { font-size: 12.5px; line-height: 1.9; color: var(--text-dark-muted); }

.ritual-steps { padding: 72px var(--inset); border-bottom: 0.5px solid var(--border-dark); }
.ritual-step-row {
  display: grid; grid-template-columns: 72px 1fr; gap: 28px;
  padding: 36px 0; border-bottom: 0.5px solid var(--border-dark); align-items: start;
}
.ritual-step-row:first-of-type { border-top: 0.5px solid var(--border-dark); margin-top: 40px; }
.ritual-step-num { font-family: var(--font-display); font-size: 9px; letter-spacing: 0.22em; color: var(--border-dark); padding-top: 6px; }
.ritual-step-title { font-family: var(--font-editorial); font-style: italic; font-size: 24px; color: var(--text-dark-secondary); margin-bottom: 10px; }
.ritual-step-body { font-size: 13px; line-height: 1.95; color: var(--text-dark-muted); max-width: 600px; }

/* ── CONTACT ─────────────────────────────────────────────────── */
.contact-layout {
  display: grid; grid-template-columns: 1fr 1fr;
  border-bottom: 0.5px solid var(--border-dark); min-height: 75vh;
}
.contact-copy {
  background: var(--bg-dark-surface);
  padding: 72px var(--inset);
  display: flex; flex-direction: column; justify-content: space-between;
  border-right: 0.5px solid var(--border-dark);
}
.contact-form-col {
  background: var(--bg-light);
  padding: 72px var(--inset);
}
.contact-h {
  font-family: var(--font-editorial); font-style: italic;
  font-size: clamp(24px,2.5vw,36px); font-weight: 400;
  color: var(--text-dark-primary); line-height: 1.2; margin: 20px 0;
}
.contact-body { font-size: 13px; line-height: 1.95; color: var(--text-dark-muted); margin-bottom: 20px; }
.contact-details { margin-top: auto; }
.contact-detail-item { padding: 18px 0; border-top: 0.5px solid var(--border-dark); }
.contact-detail-item:last-child { border-bottom: 0.5px solid var(--border-dark); }
.detail-label { font-size: 9px; letter-spacing: 0.32em; text-transform: uppercase; color: var(--text-dark-muted); margin-bottom: 5px; display: block; }
.detail-value { font-size: 13px; color: var(--text-dark-secondary); }

.contact-form-title { font-family: var(--font-editorial); font-style: italic; font-size: 20px; color: var(--text-light-secondary); margin-bottom: 36px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.form-submit-btn {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--font-body); font-size: 10px;
  letter-spacing: var(--ls-wide); text-transform: uppercase;
  color: var(--text-light-primary); background: transparent; border: none;
  border-bottom: 0.5px solid var(--accent-muted); padding: 0 0 5px 0;
  cursor: pointer; margin-top: 8px;
  transition: border-color var(--t-slow), gap var(--t-base);
}
.form-submit-btn:hover { border-color: var(--text-light-primary); gap: 14px; }
.form-note { font-size: 11px; color: var(--text-light-muted); opacity: 0.6; margin-top: 20px; line-height: 1.7; }
.form-success { display: none; text-align: center; padding: 48px 0; }
.form-success.visible { display: block; }
.form-success-h { font-family: var(--font-editorial); font-style: italic; font-size: 24px; color: var(--text-light-secondary); margin-bottom: 12px; }
.form-success-body { font-size: 13px; color: var(--text-light-muted); }

.contact-info-strip { padding: 56px var(--inset); display: grid; grid-template-columns: repeat(3,1fr); gap: 0; border-bottom: 0.5px solid var(--border-dark); }
.info-col { padding-right: 36px; border-right: 0.5px solid var(--border-dark); margin-right: 36px; }
.info-col:last-child { border-right: none; margin-right: 0; padding-right: 0; }
.info-col-label { font-size: 9px; letter-spacing: 0.32em; text-transform: uppercase; color: var(--text-dark-muted); margin-bottom: 12px; display: block; }
.info-col-value { font-size: 13px; color: var(--text-dark-secondary); line-height: 1.8; }

/* ── RESPONSIVE (all inner pages) ───────────────────────────── */
@media (max-width: 1024px) {
  .team-grid { grid-template-columns: repeat(2, 1fr); }
  .team-card:nth-child(2n+1) { border-left: 0.5px solid var(--border-dark); }
}
@media (max-width: 900px) {
  .founders-section { grid-template-columns: 1fr; }
  .founders-img { border-right: none; border-bottom: 0.5px solid var(--border-dark); min-height: 300px; }
  .founders-copy { padding: 48px var(--inset); }
  .mission-band { grid-template-columns: 1fr; gap: 20px; }
  .principles-grid { grid-template-columns: 1fr; }
  .principle-item:nth-child(n+1) { border-left: 0.5px solid var(--border-dark); border-top: 0.5px solid var(--border-dark); }
  .ritual-hero-split { grid-template-columns: 1fr; }
  .ritual-hero-img { border-right: none; border-bottom: 0.5px solid var(--border-dark); min-height: 300px; }
  .ritual-hero-copy { padding: 48px var(--inset); }
  .ritual-step-row { grid-template-columns: 1fr; gap: 8px; }
  .contact-layout { grid-template-columns: 1fr; }
  .contact-copy { border-right: none; border-bottom: 0.5px solid var(--border-dark); }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  .contact-info-strip { grid-template-columns: 1fr; gap: 0; }
  .info-col { border-right: none; margin-right: 0; padding-right: 0; padding-bottom: 28px; border-bottom: 0.5px solid var(--border-dark); }
  .info-col:last-child { border-bottom: none; padding-bottom: 0; }
}
@media (max-width: 600px) {
  .team-grid { grid-template-columns: 1fr 1fr; }
  .team-card:nth-child(2n+1) { border-left: 0.5px solid var(--border-dark); }
}
@media (max-width: 420px) {
  .team-grid { grid-template-columns: 1fr; }
}