@import url("https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400..600;1,9..144,400..600&display=swap");
/* ==========================================================================
   RUSL · SCC — premium finish (loaded last, on every page)
   Calmer type scale, more air, hairline gold details, layered soft shadows.
   Remove this file to fall back to the base design.
   ========================================================================== */

:root {
  --pr-hair: color-mix(in srgb, var(--color-accent) 45%, transparent);
  --pr-shadow: 0 1px 1px rgba(11, 13, 36, 0.03), 0 4px 10px rgba(11, 13, 36, 0.04), 0 18px 40px -12px rgba(11, 13, 36, 0.12);
  --pr-shadow-hover: 0 1px 1px rgba(11, 13, 36, 0.04), 0 10px 24px rgba(11, 13, 36, 0.08), 0 36px 70px -20px rgba(11, 13, 36, 0.28);
  --section-y: clamp(4.5rem, 3rem + 5.5vw, 8.5rem);
}
[data-theme="dark"] {
  --pr-shadow: 0 1px 1px rgba(0, 0, 0, 0.3), 0 18px 40px -12px rgba(0, 0, 0, 0.55);
  --pr-shadow-hover: 0 36px 70px -20px rgba(0, 0, 0, 0.7);
}

/* ---------- Typography: confident, not shouting ---------- */
h1, h2, h3 { font-weight: var(--weight-bold); letter-spacing: -0.028em; }
.hm-head h2, .pg-h2, .hm-why__title, .hm-about__statement, .pg-statement, .hm-cta__copy h2 {
  font-size: clamp(1.9rem, 1.35rem + 2vw, 3.1rem);
  font-weight: var(--weight-bold);
  line-height: 1.08;
}
.hm-head p, .hm-why__lead, .hm-about__intro, .rs-page-hero__lead { font-size: clamp(1rem, 0.95rem + 0.3vw, 1.15rem); line-height: 1.7; }
.hm-index, .pg-index { font-size: 0.72rem; letter-spacing: 0.2em; }
.hm-index::before, .pg-index::before { width: 36px; background: var(--color-accent); }
body { letter-spacing: 0.002em; }

/* ---------- Home hero: wide photo, smaller type ---------- */
.rs-hero__title { font-size: clamp(2.3rem, 1.25rem + 3.4vw, 4.6rem); line-height: 1.02; letter-spacing: -0.035em; margin-bottom: var(--space-5); }
.rs-hero__lead { max-width: 44ch; font-size: clamp(0.98rem, 0.92rem + 0.3vw, 1.12rem); margin-bottom: var(--space-6); color: rgba(255, 255, 255, 0.86); }
.rs-hero__eyebrow { margin-bottom: var(--space-4); font-size: 0.72rem; letter-spacing: 0.24em; }
.rs-hero__btn { min-height: 50px; padding: 0 1.4rem; font-size: 0.95rem; }
.rs-hero__photo img { transform: scale(1.015); transition: transform 10s linear; }
.rs-hero__photo.is-active img { transform: scale(1); }
.rs-hero__shade {
  background:
    linear-gradient(180deg, rgba(11, 13, 36, 0.5) 0%, rgba(11, 13, 36, 0) 20%, rgba(11, 13, 36, 0) 50%, rgba(11, 13, 36, 0.85) 100%),
    linear-gradient(90deg, rgba(11, 13, 36, 0.55) 0%, rgba(11, 13, 36, 0.15) 45%, rgba(11, 13, 36, 0) 70%);
}
.rs-hero__body { padding-bottom: clamp(2rem, 1.4rem + 2.4vw, 3.25rem); }
.rs-hero__tab { padding: 1.05rem var(--gutter); }
.rs-hero__tab b { font-size: 0.95rem; font-weight: var(--weight-medium); }
.rs-hero__tab small { font-size: 0.66rem; letter-spacing: 0.18em; }
@media (min-width: 1600px) { .rs-hero__body .rs-container { max-width: calc(1500px + var(--gutter) * 2); } }

/* ---------- Header: slimmer once you scroll ---------- */
@media (min-width: 1200px) {
  .rs-header .rs-header__inner { transition: height var(--dur-base) var(--ease-out); }
  .rs-header.is-scrolled .rs-header__inner { height: 70px; }
  .rs-header.is-scrolled .rs-nav__link { height: 70px; }
  .rs-header.is-scrolled .rs-brand__marks img { height: 38px; }
}
.rs-header.is-scrolled { border-bottom-color: var(--pr-hair); }

/* ---------- Inner page banner ---------- */
.rs-page-hero__title { font-size: clamp(2.2rem, 1.35rem + 3vw, 4.2rem); font-weight: var(--weight-bold); }
.rs-page-hero__inner { padding-block: clamp(3.5rem, 2.5rem + 4vw, 6.5rem) clamp(2.5rem, 2rem + 2.5vw, 4rem); }
.rs-page-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--gold-400) 30%, var(--gold-400) 70%, transparent); opacity: 0.55; }
.rs-crumbs { font-size: 0.8rem; letter-spacing: 0.04em; }

/* ---------- Cards: one family everywhere ---------- */
.pg-card, .rs-card, .hm-mv__card, .hm-steps li, .hm-why__list li, .hm-about__company, .hm-exp__panel, .pg-client, .hm-logo {
  border-color: color-mix(in srgb, var(--color-border) 80%, transparent);
  box-shadow: var(--pr-shadow);
}
.pg-proj, .pg-person, .pg-cert, .pg-strength, .pg-pillar, .hm-steps li, .pg-next a, .pg-client {
  transition: transform 0.45s var(--ease-out), box-shadow 0.45s var(--ease-out), border-color 0.45s var(--ease-out);
}
.pg-proj:hover, a.pg-person:hover, .pg-cert:hover, .pg-strength:hover, .pg-pillar:hover, .hm-steps li:hover, .pg-next a:hover, .pg-client:hover {
  transform: translateY(-6px);
  box-shadow: var(--pr-shadow-hover);
  border-color: var(--pr-hair);
}
/* Gold hairline that draws across the top of a card on hover */
.pg-proj, .pg-person, .pg-cert, .pg-client, .hm-steps li { position: relative; }
.pg-proj::before, a.pg-person::before, .pg-cert::before, .pg-client::before, .hm-steps li::before {
  content: ""; position: absolute; z-index: 3; left: 0; top: 0; height: 2px; width: 0;
  background: linear-gradient(90deg, var(--gold-300), var(--gold-500));
  transition: width 0.6s var(--ease-out);
}
.pg-proj:hover::before, a.pg-person:hover::before, .pg-cert:hover::before, .pg-client:hover::before, .hm-steps li:hover::before { width: 100%; }

/* Photos inside cards: gentle zoom, never jumpy */
.pg-proj__media img, .pg-person__photo img, .hm-card img, .pg-shot img, .pg-cap__media img { transition: transform 1.2s var(--ease-out); }
.pg-proj:hover .pg-proj__media img, a.pg-person:hover .pg-person__photo img { transform: scale(1.035); }

/* ---------- Buttons: one shape, one rhythm ---------- */
.rs-btn, .hm-cta__btn, .rs-hero__btn, .hm-trust__cta, .rs-header__cta { border-radius: 6px; letter-spacing: 0.01em; }
.rs-btn--primary, .hm-why__btn { box-shadow: 0 8px 20px -8px rgba(40, 48, 144, 0.6); }
.rs-btn--accent { box-shadow: 0 8px 20px -8px rgba(168, 131, 74, 0.7); }
.hm-link, .pg-link { border-bottom-color: var(--pr-hair); }

/* ---------- Sections: quiet separators ---------- */
.pg-section--alt, .hm-process, .hm-expertise { position: relative; }
.pg-section--alt::before, .hm-process::before { content: ""; position: absolute; left: 50%; top: 0; width: min(1200px, 90%); height: 1px; transform: translateX(-50%); background: linear-gradient(90deg, transparent, var(--color-border), transparent); }
.hm-trust { border-top: 1px solid var(--pr-hair); }
.hm-trust__item i { font-size: 1.35rem; }

/* Numbers feel engineered */
.rs-stat__value, .pg-kpi-tile b, .pg-kpis b, .rs-map__stat b { font-variant-numeric: tabular-nums lining-nums; letter-spacing: -0.035em; }

/* ---------- Footer ---------- */
.rs-footer { border-top: 1px solid var(--pr-hair); background-image: radial-gradient(60% 50% at 100% 0%, rgba(58, 66, 174, 0.18), transparent 70%); }

/* ---------- Gentle page fade-in ---------- */
@media (prefers-reduced-motion: no-preference) {
  main { animation: pr-in 0.6s var(--ease-out) both; }
  @keyframes pr-in { from { opacity: 0; } to { opacity: 1; } }
}

/* ==========================================================================
   Premium typography: Fraunces (display serif) for headlines,
   Plus Jakarta Sans stays for menus, buttons and labels, Inter for reading.
   ========================================================================== */
:root { --font-display: "Fraunces", "Iowan Old Style", Georgia, serif; }

h1, h2,
.rs-hero__title, .rs-page-hero__title, .hm-head h2, .pg-h2, .hm-why__title, .hm-about__statement,
.pg-statement, .hm-cta__copy h2, .hm-svc__name, .pg-cap h2, .pg-mv__block h2, .pg-callout h2,
.rs-dropdown__intro b, .pg-form h2, .pg-policy__statement {
  font-family: var(--font-display);
  font-weight: 500;
  font-optical-sizing: auto;
  font-variation-settings: "SOFT" 30, "WONK" 0;
  letter-spacing: -0.022em;
}
.rs-hero__title { font-weight: 450; letter-spacing: -0.03em; line-height: 1.0; }
.rs-page-hero__title { font-weight: 450; letter-spacing: -0.028em; }
.rs-page-hero__title--long, .rs-page-hero__title--mid { letter-spacing: -0.015em; }

/* Gold highlight words become italic serif — the signature detail */
.rs-hero__title span, .hm-head h2 span, .pg-h2 span, .hm-why__title span, .hm-about__statement span,
.pg-statement span, .hm-cta__copy h2 span {
  font-style: italic;
  font-weight: 400;
  letter-spacing: -0.01em;
}

/* Big numbers in the display face */
.rs-stat__value, .pg-kpi-tile b, .pg-kpis b, .rs-map__stat b, .hm-collage__badge b, .pg-notice__date b {
  font-family: var(--font-display);
  font-weight: 500;
  font-variant-numeric: lining-nums tabular-nums;
}

/* Section list titles that read better in the serif */
.hm-svc__name { font-weight: 450; }
.pg-cap h2, .pg-mv__block h2 { font-weight: 500; }

/* Card titles and small headings stay sans for clarity */
h3, h4, h5, h6, .pg-proj__body h3, .rs-card__title, .hm-steps h3 { font-family: var(--font-heading); }
.rs-hero__title { font-size: clamp(2.6rem, 1.4rem + 3.8vw, 5.2rem); }
