/* Shared PRIMATE finish: retain composition and hero dimensions on all pages. */
:root {
  --gray-50: #f5f7fc;
  --gray-200: #dce3ef;
  --gray-600: #596271;
  --sage-50: #f5f7fc;
  --radius: 10px;
  --button-radius: 8px;
  --shadow-soft: 0 5px 18px rgba(26, 61, 125, .045);
}
.button {
  border-radius: var(--button-radius);
  box-shadow: 0 3px 9px rgba(0, 87, 255, .14);
  transition: background-color var(--duration), box-shadow var(--duration);
}
.button:hover {box-shadow: 0 4px 12px rgba(0, 87, 255, .2)}
.hero-visual {border-radius: 12px 0 0 12px;overflow: hidden}
.hero-visual > img {border-radius: inherit}
.method-image {border-radius: 12px;overflow: hidden}
.course, .interior-card {
  border: 0;
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
}
.course.featured, .interior-card--featured {
  background: var(--color-accent);
  border-color: var(--color-accent);
  color: white;
}
.course.featured p, .interior-card--featured p,
.interior-card--featured > .eyebrow, .interior-card--featured ul {color: white}
.course-time, .interior--formations .interior-card > .eyebrow {
  align-self: flex-start;
  display: inline-block;
  padding: 5px 10px;
  border-radius: 4px;
  color: #0045cc;
  background: #edf3ff;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: normal;
  line-height: 1.5;
  text-transform: none;
}
.course.featured .course-time,
.interior--formations .interior-card--featured > .eyebrow {background: #ffffff24;color: white}
.course.featured .course-cta, .interior-card--featured .course-cta {
  border-radius: 8px;
  color: #0045cc;
}
.course.featured .course-cta svg, .interior-card--featured .course-cta svg {color: #0057ff}
.interior-card--featured details, .interior-card--featured .interior-result {border-color: #ffffff55}
.interior-card--featured li::marker {color: white}
.interior-index a {display: flex;align-items: center;justify-content: space-between;gap: 14px}
.interior-index a::after {content: '→';color: var(--color-accent);font-family: var(--font-body);font-size: 21px;font-weight: 400}
.expertise-strip h2 {color: var(--color-accent)}
.expertise-strip a:hover h2 {color: var(--blue-700)}
.usecase-panels {background: white;border: 0;border-radius: var(--radius);box-shadow: var(--shadow-soft)}
.usecase-tabs button[aria-selected=true] {background: var(--blue-50);color: var(--blue-700);border-color: var(--color-accent);border-radius: 8px}
.safety {background: var(--color-surface);border-radius: var(--radius)}
.contact .button {color: var(--blue-700);box-shadow: none}
.text-link svg, .course-cta svg {color: var(--color-accent)}
#contact-dialog {border: 0;border-radius: 12px}
@media(max-width:760px) {
  .hero-visual {border-radius: 0}
  .interior-index a {gap: 8px}
  .interior-index a::after {font-size: 18px}
}
@media(prefers-reduced-motion:reduce){.button{transition:none}}

/* Semibold subtitles use the real Inter 600 face, keeping existing spacing. */
.eyebrow, .hero-copy .eyebrow, .course-time,
.interior--formations .interior-card > .eyebrow {font-weight: 600}

/* Quiet feedback, with no layout shifts or motion on touch-only devices. */
@media(prefers-reduced-motion:no-preference) {
  .button {transition: background-color 180ms, box-shadow 180ms, transform 180ms}
  .button svg, .text-link svg, .course-cta svg {transition: transform 180ms}
  .course, .interior-card {transition: translate 220ms cubic-bezier(.22,1,.36,1)}
  dialog[open] {animation: contact-enter 200ms ease-out}
  @keyframes contact-enter {from {opacity:0;transform:translateY(8px)} to {opacity:1;transform:translateY(0)}}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .button:hover {transform:translateY(-2px)}
  .button:hover svg, .text-link:hover svg, .course-cta:hover svg {transform:translateX(3px)}
  .course:hover, .interior-card:hover {translate:0 -3px}
}
@media(prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto}
  .button, .button svg, .text-link svg, .course-cta svg, .course, .interior-card, dialog[open] {animation:none;transition:none;transform:none;translate:none}
}
