/* Selected component styles adapted from the reference design system globals.css */

.action-primary,
.action-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-pill);
  padding: 0.8rem 1.3rem;
  font-size: 0.95rem;
  font-weight: 700;
  transition: transform var(--motion-gentle) ease, border-color var(--motion-fast) ease, background-color var(--motion-fast) ease, color var(--motion-fast) ease;
}
.action-primary { background: var(--ink-strong); color: white; }
.action-secondary { border: 1px solid var(--border-strong); background: rgba(255,255,255,0.7); color: var(--ink-strong); }
.action-primary:hover, .action-secondary:hover { transform: translateY(-1px); }

.panel-shell { border: 1px solid var(--border-neutral); border-radius: var(--radius-panel); box-shadow: var(--shadow-panel); transition: border-color var(--motion-fast) ease, transform var(--motion-gentle) ease, box-shadow var(--motion-gentle) ease; }
.card-shell { border-radius: var(--radius-card); box-shadow: var(--shadow-card); }

.atlas-image { display:block; width:100%; height:auto; border-radius:1.3rem; border:1px solid rgba(45,53,45,0.12); box-shadow:0 18px 44px rgba(44,52,43,0.09); }
.atlas-image--portrait { aspect-ratio:1/1; object-fit:cover; }
.atlas-card-image { display:block; width:100%; aspect-ratio:16/10; object-fit:cover; border-bottom: 1px solid rgba(45,53,45,0.12); }

.atlas-figure { position:relative; align-self:stretch; }
.atlas-figure-caption { position:absolute; right:1rem; bottom:1rem; max-width:20rem; border:1px solid rgba(255,255,255,0.24); border-radius:1rem; background: rgba(15,20,17,0.74); color: rgba(255,255,255,0.92); padding:0.9rem 1rem; font-size:0.85rem; line-height:1.45; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }

.hero-example { position:relative; display:flex; min-height:31rem; flex-direction:column; justify-content:flex-end; gap:1rem; overflow:hidden; border-radius:1.5rem; padding:1.6rem; box-shadow:0 20px 52px rgba(44,52,43,0.12); }
.hero-example__eyebrow { margin:0; font-size:0.72rem; font-weight:800; letter-spacing:0.24em; text-transform:uppercase; }
.hero-example__headline { margin:0; max-width:12ch; font-size:clamp(2rem,3vw,3.4rem); line-height:0.95; letter-spacing:-0.05em; }
.hero-example__deck { margin:0; max-width:36rem; font-size:1rem; line-height:1.65; }
.hero-example__proof { width:fit-content; max-width:34rem; border-radius:999px; padding:0.55rem 0.9rem; font-size:0.8rem; font-weight:800; line-height:1.35; }
.hero-example__cta { width:fit-content; border:0; border-radius:999px; padding:0.85rem 1.2rem; font-size:0.92rem; font-weight:800; cursor:default; }

.hero-example--sage-swiss { background: linear-gradient(135deg, rgba(248,245,238,0.98), rgba(232,235,238,0.96)); color:#10263b; font-family: "Avenir Next", "Helvetica Neue", sans-serif; border:1px solid rgba(17,42,70,0.14); }
.hero-example--sage-swiss .hero-example__proof { background: rgba(16,38,59,0.08); color:#16324d; }
.hero-example--sage-swiss .hero-example__cta { background:#10263b; color:white; }

/* small utility */
.eyebrow { font-size:0.72rem; font-weight:800; text-transform:uppercase; letter-spacing:0.18em; color:var(--ink-muted); }