:root {
  --ink: #071a2b;
  --paper: #f3f8f9;
  --line: #cddcdf;
  --red: #ef3b55;
  --red-soft: #ffe7eb;
  --cyan: #0eb5c7;
  --cyan-soft: #dff8fa;
  --muted: #566b74;
}

body {
  background:
    radial-gradient(circle at 84% 8%, rgba(14, 181, 199, .1), transparent 24rem),
    linear-gradient(rgba(7, 26, 43, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(7, 26, 43, .025) 1px, transparent 1px),
    var(--paper);
  background-size: auto, 34px 34px, 34px 34px, auto;
  font-family: "IBM Plex Sans", system-ui, sans-serif;
}

.site-header {
  background: rgba(247, 251, 251, .9);
  border-color: rgba(7, 26, 43, .12);
  backdrop-filter: blur(18px);
}

.brand { gap: 12px; }
.brand-logo { width: 54px; height: 54px; }
.brand-wordmark { display: flex; flex-direction: column; line-height: 1; }
.brand-wordmark strong { font-size: 16px; letter-spacing: .16em; }
.brand-wordmark small {
  margin-top: 5px;
  color: var(--cyan);
  font-family: "IBM Plex Mono", monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .36em;
}

.eyebrow, .tag, .card-index, .segment-grid span {
  font-family: "IBM Plex Mono", monospace;
}

.eyebrow { color: #087f8e; }
.principles .eyebrow, .cta .eyebrow { color: #7ce4ee; }
.hero h1, .detail-hero h1, .section-heading h2, .principles h2, .cta h2 {
  color: var(--ink);
  font-weight: 600;
}
.principles h2, .cta h2 { color: #fff; }

.button {
  background: linear-gradient(135deg, var(--ink), #123b55);
  box-shadow: 0 12px 30px rgba(7, 26, 43, .2);
  transition: transform .2s ease, box-shadow .2s ease;
}
.button:hover { transform: translateY(-2px); box-shadow: 0 18px 34px rgba(7, 26, 43, .26); }

.pulse {
  background: linear-gradient(145deg, #0c2a41, var(--cyan));
  box-shadow: 0 0 0 28px rgba(14, 181, 199, .1), 0 24px 70px rgba(14, 181, 199, .22);
}
.orbit { border-color: rgba(14, 181, 199, .42); }

.cards { gap: 24px; }
.product-card {
  position: relative;
  overflow: hidden;
  border-radius: 26px;
  border-color: rgba(7, 26, 43, .1);
  box-shadow: 0 18px 50px rgba(7, 26, 43, .1);
  transition: transform .25s ease, box-shadow .25s ease;
}
.product-card::before {
  content: "";
  position: absolute;
  width: 190px;
  height: 190px;
  right: -75px;
  top: -75px;
  border: 1px solid currentColor;
  border-radius: 50%;
  opacity: .14;
  box-shadow: 0 0 0 26px currentColor, 0 0 0 52px currentColor;
}
.product-card:hover { transform: translateY(-8px); box-shadow: 0 28px 70px rgba(7, 26, 43, .16); }
.product-card.admission { background: linear-gradient(155deg, #0a3048, #096f7a); }
.product-card.fitness { background: linear-gradient(155deg, #fff, var(--cyan-soft)); border-color: rgba(14, 181, 199, .38); }
.product-card.kinesio { background: linear-gradient(155deg, #141f2b, #321d32); }
.product-card h3 { font-weight: 600; }

.admission-detail { background: linear-gradient(135deg, var(--paper) 55%, var(--cyan-soft) 55%); }
.fitness-detail { background: linear-gradient(135deg, var(--paper) 55%, var(--cyan-soft) 55%); }
.metric-panel { border-radius: 24px; box-shadow: 0 22px 60px rgba(7, 26, 43, .12); }
.principles { background: linear-gradient(135deg, #061725, #0b3449); }

.admission-referral, .segment-section {
  margin: 80px clamp(22px, 5vw, 76px);
  padding: clamp(34px, 5vw, 68px);
  border: 1px solid rgba(14, 181, 199, .25);
  border-radius: 28px;
  background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(223,248,250,.92));
  box-shadow: 0 22px 70px rgba(7, 26, 43, .1);
}
.admission-referral { display: flex; align-items: end; justify-content: space-between; gap: 40px; }
.admission-referral div { max-width: 850px; }
.admission-referral h2, .segment-section h2 { margin: 0; font-size: clamp(32px, 4vw, 58px); line-height: 1.08; }
.admission-referral p:not(.eyebrow) { color: var(--muted); font-size: 18px; line-height: 1.6; }

.segment-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.segment-grid article {
  min-height: 300px;
  padding: 34px;
  border: 1px solid rgba(7, 26, 43, .11);
  border-radius: 22px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 12px 34px rgba(7, 26, 43, .07);
  display: flex;
  flex-direction: column;
  transition: transform .2s ease, border-color .2s ease;
}
.segment-grid article:hover { transform: translateY(-5px); border-color: var(--cyan); }
.segment-grid span { color: #087f8e; font-size: 12px; font-weight: 600; letter-spacing: .12em; }
.segment-grid h3 { margin: 54px 0 12px; font-size: 27px; }
.segment-grid p { color: var(--muted); line-height: 1.55; }
.segment-grid a { margin-top: auto; padding-top: 22px; border-top: 1px solid var(--line); color: var(--ink); font-weight: 700; text-decoration: none; }
.segment-grid a:hover { color: #087f8e; }

@media (max-width: 800px) {
  .segment-grid { grid-template-columns: 1fr; }
  .admission-referral { display: block; }
  .admission-referral .button { margin-top: 18px; }
}

@media (max-width: 620px) {
  .brand-logo { width: 44px; height: 44px; }
  .brand-wordmark strong { font-size: 14px; }
  .brand-wordmark small { font-size: 9px; }
  .admission-referral, .segment-section { margin: 44px 18px; padding: 30px 22px; border-radius: 22px; }
  .product-card { border-radius: 22px; }
}