/* =========================================================
   Service detail pages (MEDICAL /47, SPACE DESIGN /SpaceDesign)
   Shared "sv-" components. Identical block lives in
   pages/47-medical.css and pages/SpaceDesign.css.
   ========================================================= */
.sv { --sv-pink: #ffb5cb; --sv-rose: #e8a9bb; --sv-navy: #233056; --sv-label: #a6a6a6; }
.sv-sec { position: relative; padding: 140px 0 120px; background: var(--sv-bg, #fff); color: #212121; }
.sv-sec--flush-b { padding-bottom: 46px; }
.sv-sec--dark { color: #fff; }
.sv-sec--white { --sv-bg: #fff; }

/* hero */
.sv-hero.page-hero { min-height: 447px; padding-bottom: 59px; }
@media (min-width: 961px) { .sv-hero.page-hero { background-attachment: fixed; } }
.sv-hero .page-hero__title { font-size: clamp(44px, 6.7vw, 96px); font-weight: 700; line-height: 1.3; }
.sv-hero .page-hero__line { max-width: 480px; margin-top: 26px; background: rgba(255,255,255,.75); }

/* type */
.sv-eyebrow { font-family: var(--font-en); font-weight: 700; font-size: 24px; line-height: 1.2; color: #c6c6c6; text-transform: uppercase; }
.sv-eyebrow--white { color: #fff; }
.sv-label { font-size: clamp(15px, 1.53vw, 22px); line-height: 1.4; letter-spacing: .3em; color: var(--sv-label); margin-bottom: clamp(24px, 2.4vw, 34px); }
.sv-intro-title { margin-top: 26px; font-size: clamp(30px, 3.9vw, 56px); line-height: 1.5; font-weight: 700; letter-spacing: -.02em; }
.sv-intro-text { margin-top: 56px; font-size: clamp(17px, 1.67vw, 24px); line-height: 1.2; }
.sv-intro-text p { margin-bottom: 10px; }
.sv-intro-text p:empty, .sv-intro-text .gap { height: 1.2em; }
.sv-intro-text .sv-intro-strong { font-size: 1.21em; margin-bottom: 14px; }
.sv-title { font-size: clamp(30px, 4.2vw, 60px); line-height: 1.38; font-weight: 700; letter-spacing: -.02em; }
.sv-title--md { font-size: clamp(26px, 3.35vw, 48px); }
.sv-title .md { display: block; margin-top: 12px; font-size: clamp(26px, 3.35vw, 48px); }
.sv-title .sm { font-size: clamp(16px, 2vw, 28px); letter-spacing: 0; }
.sv-title .lg { font-size: clamp(32px, 4.45vw, 64px); }
.sv-title .en { font-family: var(--font-en); }
.sv-sub { margin-top: 26px; font-size: clamp(19px, 2.1vw, 30px); line-height: 1.5; }
.sv-sub--b { font-weight: 700; }
.sv-text { margin-top: 40px; font-size: clamp(17px, 1.67vw, 24px); line-height: 1.6; }
.sv-desc { margin-top: 28px; font-size: clamp(16px, 1.53vw, 22px); line-height: 1.75; }
.sv-desc p + p { margin-top: 2px; }
.sv-navy { color: var(--sv-navy); }
.sv-pink { color: var(--sv-pink); }
.sv-rose { color: var(--sv-rose); }

/* split: text left, cards right */
.sv-split { display: grid; grid-template-columns: minmax(0, 503fr) minmax(0, 610fr); gap: 40px 137px; align-items: start; }
.sv-split--wide { grid-template-columns: minmax(0, 610fr) minmax(0, 503fr); }
.sv-cards { display: grid; gap: 30px; }
.sv-cards--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 62px; }
.sv-card { border-radius: 20px; min-height: 122px; padding: 20px 20px 28px; background: var(--c, #888); color: #fff; font-size: clamp(17px, 1.67vw, 24px); line-height: 1.2; }
.sv-card--tall { min-height: 146px; }
.sv-card b { font-weight: 700; }

/* outlined boxes with double chevron */
.sv-boxes { display: grid; grid-template-columns: repeat(var(--cols, 2), minmax(0, 1fr)); gap: 30px; margin-top: 62px; }
.sv-box { min-height: 183px; padding: 24px 20px; border: 1px solid var(--bd, rgba(255,255,255,.75)); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: #fff; font-size: clamp(16px, 1.53vw, 22px); line-height: 1.25; }
.sv-box img { width: 34px; height: auto; margin: 4px auto 6px; }
.sv-box small { font-size: .82em; }

/* list with circle chevrons, thick top line */
.sv-list { margin-top: 60px; border-top: 2px solid currentColor; border-bottom: 1px solid currentColor; padding: 40px 0 34px; }
.sv-sec--dark .sv-list { border-color: #fff; }
.sv-list li { display: flex; align-items: center; gap: 12px; min-height: 64px; font-size: clamp(16px, 1.67vw, 24px); line-height: 1.35; font-weight: 700; }
.sv-list li::before { content: ''; flex: 0 0 30px; height: 30px; background: url('/assets/img/418e4356f3d1b.png') center / contain no-repeat; }
.sv-list--sm li { font-size: clamp(16px, 1.53vw, 22px); }
.sv-note { margin-top: 56px; font-size: clamp(18px, 2vw, 29px); line-height: 1.5; font-weight: 700; color: #ffb8d9; }

/* results grid (pink section) */
.sv-results-head { padding-bottom: 30px; border-bottom: 2px solid #fff; }
.sv-results-head .sv-title { margin-top: 30px; line-height: 1.1; color: #131313; }
.sv-results-head .sv-sub { margin-top: 26px; font-size: clamp(18px, 1.8vw, 26px); font-weight: 700; color: #131313; }
.sv-results { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 30px; padding: 32px 0 30px; border-bottom: 1px solid #fff; }
.sv-results li { position: relative; font-size: clamp(18px, 1.8vw, 26px); line-height: 1.6; font-weight: 700; color: #131313; min-height: 102px; }
.sv-results--check li { padding-left: 40px; }
.sv-results--check li::before { content: ''; position: absolute; left: 0; top: .2em; width: 34px; height: 34px; background: url('/assets/img/0a62c620108ff.png') center / contain no-repeat; }
.sv-btn-row { display: flex; justify-content: flex-end; margin-top: 78px; }
.sv-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 262px; height: 56px; padding: 0 40px; border-radius: 9999px; background: #fdfdfd; color: #e39bb1; font-family: var(--font-en); font-size: clamp(18px, 1.6vw, 23px); letter-spacing: .02em; transition: background .25s, color .25s; }
.sv-btn:hover { background: #e39bb1; color: #fff; }

/* case rows (space design) */
.sv-cases { margin-left: calc(400 / 1250 * 100%); border-top: 2px solid #212121; margin-top: 60px; }
.sv-case { padding: 30px 0 34px; border-bottom: 1px solid #212121; }
.sv-case:last-child { border-bottom-width: 2px; }
.sv-case h3 { font-size: clamp(22px, 2.1vw, 30px); line-height: 1.2; font-weight: 700; color: #131313; padding-left: 26px; }
.sv-case ul { margin-top: 30px; padding-left: 70px; list-style: disc; font-size: clamp(16px, 1.4vw, 20px); line-height: 32px; }
.sv-case li::marker { font-size: .8em; }

/* portfolio gallery */
.sv-portfolio-title { text-align: center; font-family: var(--font-en); font-weight: 700; font-size: 20px; letter-spacing: .3em; color: #212121; }
.sv-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 75px; }
.sv-gallery img { width: 100%; height: 466px; object-fit: cover; }

/* responsive */
@media (max-width: 1200px) {
  .sv-split, .sv-split--wide { gap: 40px 60px; }
}
@media (max-width: 960px) {
  .sv-sec { padding: 90px 0 80px; }
  .sv-sec--flush-b { padding-bottom: 40px; }
  .sv-split, .sv-split--wide { grid-template-columns: 1fr; }
  .sv-cases { margin-left: 0; }
  .sv-gallery img { height: auto; aspect-ratio: 4 / 3; }
  .sv-hero.page-hero { min-height: 300px; padding-bottom: 40px; }
  .sv-intro-text { margin-top: 36px; line-height: 1.45; }
  .sv-intro-text br.pc { display: none; }
}
@media (max-width: 640px) {
  .sv-sec { padding: 72px 0 64px; }
  .sv-cards--2, .sv-results { grid-template-columns: 1fr; }
  .sv-boxes { grid-template-columns: 1fr; --cols: 1 !important; gap: 16px; margin-top: 40px; }
  .sv-box { min-height: 150px; }
  .sv-card, .sv-card--tall { min-height: 0; padding: 20px 22px 24px; }
  .sv-results li { min-height: 0; }
  .sv-list { margin-top: 40px; padding: 24px 0 20px; }
  .sv-list li { align-items: flex-start; padding: 10px 0; min-height: 0; }
  .sv-list li::before { flex-basis: 24px; height: 24px; margin-top: 1px; }
  .sv-case h3 { padding-left: 0; }
  .sv-case ul { padding-left: 22px; margin-top: 18px; line-height: 1.6; }
  .sv-btn-row { justify-content: center; margin-top: 48px; }
  .sv-gallery { grid-template-columns: 1fr; margin-top: 40px; }
  .sv-title br.pc, .sv-sub br.pc, .sv-text br.pc { display: none; }
}

/* fidelity pass: original sections are ~80px taller (imweb section padding) */
@media (min-width: 961px) {
  .sv-sec { padding-top: 180px; padding-bottom: 160px; }
  .sv-sec--flush-b { padding-bottom: 46px; }
  .sv-hero + .sv-sec { padding-top: 140px; padding-bottom: 120px; }
}