/* HRus interior design system 1.0.
   Load LAST on portal templates, not the homepage or standalone conference LP.
   The approved category hero is the visual and typographic reference.
   Same semantic roles use the same tokens. Dense reading pages may use the
   declared editorial H1, not ad-hoc smaller/lighter headings per template. */
body.hrus-interior {
  --interior-weight-heading: 700;
  --interior-title: clamp(40px, 4.2vw, 60px);
  --interior-title-leading: 1.15;
  --interior-editorial-title: clamp(36px, 3.4vw, 50px);
  --interior-h2: 29px;
  --interior-h3: 22px;
  --interior-h4: 19px;
  --interior-body: 18px;
  --interior-body-leading: 1.85;
  --interior-lead: 18px;
  --interior-dark: #101a22;
  --interior-accent: #9ad258;
  --interior-ink: #151a21;
  --interior-hero-height: 452px;
  --interior-hero-top: 140px;
  --interior-hero-bottom: 58px;
  --interior-crumb-size: 13.5px;
  --interior-crumb-bottom: 30px;
}
/* Shared page-title/lead roles, including existing photographic heroes. */
.hrus-interior :is(.category-hero__title, .conf-hero h1, .contact-hero h1, .content-hero h1, .interior-hero h1, .interior-title) {
  font-family:inherit;
  font-size:var(--interior-title);
  font-weight:var(--interior-weight-heading);
  line-height:var(--interior-title-leading);
  letter-spacing:0;
}
.hrus-interior :is(.category-hero__description, .conf-hero__copy p, .contact-hero__description, .content-hero__description, .interior-lead) {
  font-family:inherit;
  font-size:var(--interior-lead);
  font-weight:400;
  line-height:1.8;
  letter-spacing:0;
  margin-top:20px;
}
/* Bold subordinate headings. Navigation/newsletter/footer components are excluded. */
.hrus-interior :is(.contact-info h2, .contact-form-heading h2, .content-prose h2, .article-prose h2, .interior-section-heading) {
  font-family:inherit;
  font-size:var(--interior-h2);
  font-weight:var(--interior-weight-heading);
  line-height:1.4;
  letter-spacing:0;
  color:var(--interior-ink);
}
.hrus-interior :is(.content-prose h3, .article-prose h3, .interior-subheading) {
  font-family:inherit;
  font-size:var(--interior-h3);
  font-weight:var(--interior-weight-heading);
  line-height:1.45;
  letter-spacing:0;
  color:var(--interior-ink);
}
.hrus-interior :is(.content-prose h4, .article-prose h4) {
  font-size:var(--interior-h4);
  font-weight:var(--interior-weight-heading);
  line-height:1.5;
}
.hrus-interior :is(.content-prose, .article-prose, .interior-prose) {
  font-size:var(--interior-body);
  line-height:var(--interior-body-leading);
  color:var(--text);
}
.hrus-interior .contact-info__intro {
  font-size:var(--interior-body);
  line-height:1.7;
}
.hrus-interior :is(.content-prose .content-lead,.article-prose .article-opening) {
  font-size:20px;
  font-weight:400;
  line-height:1.8;
}
/* Notes and card titles are separate roles, not full section headings. */
.hrus-interior :is(.content-callout h2,.content-callout h3,.article-note h3) {
  font-size:21px;
  font-weight:700;
}
.hrus-interior .content-callout--preview h2 {font-size:18px}
.hrus-interior :is(.category-card__title,.conf-card__title) {font-weight:700}
/* An article is a reading layout, not another promotional banner. Its cover
   already supplies the image. Keep that hierarchy without a second hero. */
.hrus-interior .article-intro {background:#fff}
.hrus-interior .article-intro h1 {
  font-size:var(--interior-editorial-title);
  font-weight:700;
  line-height:1.24;
  letter-spacing:0;
  color:var(--interior-ink);
}
.hrus-interior .article-standfirst {font-size:20px;line-height:1.8;color:var(--text)}
/* GRAPHIC HERO: a second mode in the category-hero family, not a pale UI panel.
   Header/nav markup is unchanged. The zero-height masthead lets the fixed shared
   nav sit above the same surface, exactly as on the photographic category page. */
.hrus-interior :is(.contact-masthead,.content-masthead) {height:0;background:none}
.hrus-interior .interior-hero {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:var(--interior-hero-height);
  padding:var(--interior-hero-top) 0 var(--interior-hero-bottom);
  border:0;
  background:
    radial-gradient(ellipse 64% 130% at 1% 95%,rgba(73,111,73,.34),transparent 75%),
    radial-gradient(ellipse 65% 150% at 34% 25%,rgba(31,68,67,.35),transparent 72%),
    var(--interior-dark);
  color:#fff;
}
.hrus-interior .interior-hero::after {
  content:"";
  position:absolute;
  inset-inline:0;
  bottom:0;
  height:3px;
  z-index:2;
  background:linear-gradient(90deg,transparent 3%,rgba(116,183,46,.2) 28%,var(--green) 72%,var(--green));
  pointer-events:none;
}
.hrus-interior .interior-hero > :is(.container,.content-shell) {
  position:relative;
  z-index:1;
  width:100%;
  max-width:var(--max,1240px);
  padding-inline:32px;
  margin-inline:auto;
}
.hrus-interior .interior-hero h1 {
  max-width:650px;
  margin:0;
  color:#fff;
  text-wrap:balance;
}
.hrus-interior .interior-hero h1 :is(span,bdi.interior-accent) {color:var(--interior-accent)}
.hrus-interior .interior-hero :is(.contact-hero__description,.content-hero__description) {
  max-width:570px;
  color:#d4dede;
  text-wrap:pretty;
}
.hrus-interior .interior-hero :is(.contact-breadcrumbs,.content-breadcrumbs,.interior-breadcrumbs) {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  font-size:var(--interior-crumb-size);
  line-height:1.6;
  color:#bdc9cc;
  margin:0 0 var(--interior-crumb-bottom);
}
.hrus-interior .interior-hero :is(.contact-breadcrumbs,.content-breadcrumbs,.interior-breadcrumbs) a {color:inherit}
.hrus-interior .interior-hero :is(.contact-breadcrumbs,.content-breadcrumbs,.interior-breadcrumbs) a:hover {color:#fff}
.hrus-interior .interior-hero :is(.contact-breadcrumbs,.content-breadcrumbs,.interior-breadcrumbs) [aria-current] {color:#fff}
.hrus-interior .interior-hero :is(.contact-breadcrumbs svg,.content-breadcrumbs i) {color:#91a7a2}
.hrus-interior .interior-hero a:focus-visible {outline:2px solid #b8de92;outline-offset:5px;border-radius:2px}
.hrus-interior .interior-hero .content-updated {color:#b5c5c8;font-size:13px}
.hrus-interior .interior-hero__art {
  position:absolute;
  z-index:0;
  width:min(45vw,600px);
  height:400px;
  left:max(0px,calc((100vw - 1400px)/2));
  top:30px;
  opacity:1;
  pointer-events:none;
  user-select:none;
}
.hrus-interior .interior-hero__art img {width:100%;height:100%;object-fit:contain}
.hrus-interior .interior-hero--document .interior-hero__art {top:30px;opacity:.78}
/* Information-dense legal pages deliberately use a compact mode, same type. */
.hrus-interior .interior-hero--compact {
  --interior-hero-height:360px;
  --interior-hero-bottom:48px;
}
.hrus-interior .interior-hero--compact .interior-hero__art {height:340px;top:48px;opacity:.55}
/* Ensure the two equally ranked contact headings actually match. */
.hrus-interior .contact-info {padding-top:0}
.hrus-interior .contact-form-heading {align-items:baseline}
.hrus-interior .contact-section {padding-block:62px 79px}
@media(max-width:1200px) {
  body.hrus-interior {--interior-hero-top:124px}
}
@media(max-width:1023px) {
  .hrus-interior .interior-hero h1 {max-width:560px}
  .hrus-interior .interior-hero :is(.contact-hero__description,.content-hero__description) {max-width:490px}
  .hrus-interior .interior-hero__art {width:48vw;left:-30px;opacity:.8;top:67px}
}
@media(max-width:820px) {
  .hrus-interior .contact-info {padding-top:32px}
}
@media(max-width:767px) {
  body.hrus-interior {
    --interior-title:40px;
    --interior-editorial-title:36px;
    --interior-title-leading:1.2;
    --interior-h2:25px;
    --interior-h3:21px;
    --interior-h4:18px;
    --interior-body:17px;
    --interior-lead:17px;
    --interior-hero-top:110px;
    --interior-hero-height:392px;
    --interior-hero-bottom:48px;
    --interior-crumb-size:12px;
    --interior-crumb-bottom:27px;
  }
  .hrus-interior .interior-hero > :is(.container,.content-shell) {padding-inline:24px}
  .hrus-interior .interior-hero h1 {max-width:100%}
  .hrus-interior .interior-hero :is(.contact-hero__description,.content-hero__description) {max-width:440px;margin-top:18px}
  .hrus-interior .interior-hero__art {width:280px;height:193px;top:auto;bottom:14px;left:-40px;opacity:.28}
  .hrus-interior .interior-hero--document .interior-hero__art {top:auto;bottom:14px;opacity:.25}
  .hrus-interior .interior-hero--compact {--interior-hero-height:314px;--interior-hero-bottom:42px}
  .hrus-interior .interior-hero--compact .interior-hero__art {height:193px;bottom:6px;top:auto;opacity:.2}
  .hrus-interior .article-standfirst {font-size:18px}
  .hrus-interior .contact-section {padding-block:40px 56px}
  .hrus-interior :is(.content-callout h2,.content-callout h3,.article-note h3) {font-size:20px}
  .hrus-interior .content-callout--preview h2 {font-size:18px}
}
@media(max-width:359px) {
  body.hrus-interior {--interior-title:34px;--interior-editorial-title:32px}
  .hrus-interior .interior-hero > :is(.container,.content-shell) {padding-inline:18px}
}
@media(forced-colors:active) {
  .hrus-interior .interior-hero__art {display:none}
  .hrus-interior .interior-hero::after {background:Highlight}
}
@media print {
  body.hrus-interior {--interior-title:28pt;--interior-editorial-title:28pt;--interior-h2:17pt;--interior-h3:14pt;--interior-body:11pt}
  .hrus-interior .interior-hero {min-height:0;padding:0 0 20px;background:none;color:#111}
  .hrus-interior .interior-hero__art,.hrus-interior .interior-hero::after {display:none}
  .hrus-interior .interior-hero :is(h1,p,span,bdi,a,.content-breadcrumbs,.contact-breadcrumbs) {color:#111}
  .hrus-interior .interior-hero > :is(.container,.content-shell) {padding-inline:0}
}
