/* ==========================================================================
   WRIA — Heritage Green & Brass — shared design theme
   --------------------------------------------------------------------------
   One source of truth for the whole site. Change a token in :root and it
   cascades to every page. Component classes below cover the repeated chrome
   (utility bar, nav, footer), the kicker rule, buttons, text links, section
   bands, cards and form fields. Page-specific geometry (grid columns, one-off
   paddings) stays inline in the .dc.html pages but references these tokens via
   var(), so colours and type remain centrally controlled.
   ========================================================================== */

:root {
  /* ---- Brand palette ---------------------------------------------------- */
  --surface:        #F4EFE3;   /* primary paper background + light text       */
  --surface-alt:    #E8E3D3;   /* alternate paper band                        */
  --surface-raised:  #FBF8F0;   /* form fields / inset cards                   */
  --on-brand:        #F4EFE3;   /* light text on dark bands (== paper)         */

  --brand:        #3A0D0D;   /* deep red-black (darkest brand)              */
  --brand-2:      #8A1C1C;   /* bright red (headings / mid band)            */
  --brand-3:      #B62222;   /* bright red (gradient stop)                  */

  --accent:        #D3A83F;   /* gold — brightened 2026-07-02                */
  --accent-hover:  #EBC466;   /* gold hover (brighter)                      */
  --accent-deep:   #9C7A2E;   /* dark gold (kickers on paper)              */

  --muted:        #6B5F4F;   /* muted text                                  */
  --muted-2:      #7C6F58;   /* muted text 2                                */
  --text-body:         #33231F;   /* body copy on paper (high contrast)          */

  /* ---- Light text alphas (cream over dark bands) ----------------------- */
  --on-brand-04: rgba(246,241,230,0.05);
  --on-brand-08: rgba(246,241,230,0.09);
  --on-brand-10: rgba(246,241,230,0.12);
  --on-brand-12: rgba(246,241,230,0.14);
  --on-brand-20: rgba(246,241,230,0.24);
  --on-brand-40: rgba(246,241,230,0.58);
  --on-brand-45: rgba(246,241,230,0.62);
  --on-brand-50: rgba(246,241,230,0.68);
  --on-brand-55: rgba(246,241,230,0.86);
  --on-brand-60: rgba(246,241,230,0.9);
  --on-brand-62: rgba(246,241,230,0.92);
  --on-brand-64: rgba(246,241,230,0.92);
  --on-brand-65: rgba(246,241,230,0.94);
  --on-brand-74: rgba(246,241,230,0.9);
  --on-brand-75: rgba(246,241,230,0.9);
  --on-brand-78: rgba(246,241,230,0.93);
  --on-brand-82: rgba(246,241,230,0.95);

  /* ---- Gold alphas ------------------------------------------------------ */
  --accent-04: rgba(211,168,63,0.05);
  --accent-18: rgba(211,168,63,0.2);
  --accent-25: rgba(211,168,63,0.28);
  --accent-30: rgba(211,168,63,0.34);
  --accent-50: rgba(211,168,63,0.55);
  --accent-70: rgba(211,168,63,0.72);

  /* ---- Brand red alphas (borders / overlays) ---------------------------- */
  --brand-ov-40: rgba(58,13,13,0.42);
  --brand-ov-50: rgba(58,13,13,0.52);
  --line-12: rgba(138,28,28,0.16);   /* hairline border on paper            */
  --line-16: rgba(138,28,28,0.2);
  --line-20: rgba(138,28,28,0.26);

  /* ---- Type ------------------------------------------------------------- */
  --ff-display: 'Libre Caslon Display', serif;  /* headings & numerals      */
  --ff-text:    'Libre Caslon Text', serif;     /* serif body / quotes      */
  --ff-sans:    'Libre Franklin', sans-serif;   /* sans body / labels       */

  /* ---- Layout ----------------------------------------------------------- */
  --maxw: 1320px;        /* outer content width                             */
  --maxw-narrow: 1100px; /* centred text bands                              */
  --gutter: 44px;        /* horizontal page padding                         */
  --band: 104px;         /* default vertical band padding                   */

  /* ---- Brand gradients -------------------------------------------------- */
  --hero-gradient: linear-gradient(155deg,#8A1C1C 0%,#B62222 55%,#3A0D0D 100%);
  --hero-weave: repeating-linear-gradient(135deg,var(--accent-04) 0px,var(--accent-04) 1px,transparent 1px,transparent 18px);
}

/* ==========================================================================
   Base
   ========================================================================== */
body {
  margin: 0;
  background: var(--surface);
  color: var(--brand-2);
  font-family: var(--ff-sans);
  font-weight: 500;
  -webkit-font-smoothing: antialiased;
}
@keyframes wriaFade {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}
::selection { background: var(--accent); color: var(--brand); }

/* ==========================================================================
   Layout helpers
   ========================================================================== */
.page        { background: var(--surface); }
.wrap        { max-width: var(--maxw); margin: 0 auto; }
.wrap--narrow{ max-width: var(--maxw-narrow); margin: 0 auto; }
.wrap--mid   { max-width: 860px; margin: 0 auto; }

.section            { padding: var(--band) var(--gutter); }
.section--90        { padding: 90px var(--gutter); }
.section--96        { padding: 96px var(--gutter); }
.section--110       { padding: 110px var(--gutter); }
.section--surface     { background: var(--surface);     color: var(--brand-2); }
.section--surface-alt { background: var(--surface-alt); color: var(--brand-2); }
.section--brand     { background: var(--brand);     color: var(--on-brand); }
.section--brand-2    { background: var(--brand-2);   color: var(--on-brand); }
.section--center    { text-align: center; }

/* ==========================================================================
   Kicker  —  34px brass rule + uppercase tracked label
   ========================================================================== */
.kicker        { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
.kicker--center{ justify-content: center; }
.kicker__rule  { width: 34px; height: 1px; background: var(--accent); }
.kicker__label {
  font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--accent-deep); font-weight: 600;
}
/* on dark bands the label is brass, not dark-accent */
.kicker--on-brand .kicker__label,
.kicker__label--on-brand { color: var(--accent); }

/* ==========================================================================
   Buttons
   ========================================================================== */
.btn {
  display: inline-block; text-decoration: none; text-transform: uppercase;
  font-family: var(--ff-sans); font-weight: 600; cursor: pointer; border: none;
  font-size: 13px; letter-spacing: 0.14em; padding: 17px 34px;
}
.btn--accent       { background: var(--accent); color: var(--brand); }
.btn--accent:hover { background: var(--accent-hover); }
.btn--brand       { background: var(--brand); color: var(--on-brand); font-size: 12px; letter-spacing: 0.12em; padding: 13px 24px; font-weight: 500; }
.btn--brand:hover { background: var(--brand-2); }
/* centred call-to-action button row */
.cta-row { display: flex; align-items: center; justify-content: center; gap: 28px; flex-wrap: wrap; }

/* ==========================================================================
   Photo banner band (people image with text overlaid on the white-left area)
   ========================================================================== */
.banner {
  position: relative; min-height: 460px; display: flex; align-items: center;
  isolation: isolate;
  background: #ffffff url('../assets/wria-banner.png') no-repeat right center;
  background-size: cover;
}
.banner--2 { background-image: url('../assets/wria-banner-2.png'); }
/* theme-colour wash over the photo (strong on the right, clear on the white-left) */
.banner__tint {
  position: absolute; inset: 0; z-index: 0;
  background: linear-gradient(90deg, rgba(138,28,28,0) 38%, rgba(182,34,34,0.36) 64%, rgba(58,13,13,0.58) 100%);
  mix-blend-mode: multiply;
}
.banner__overlay {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(90deg, #ffffff 0%, #ffffff 30%, rgba(255,255,255,0.85) 45%, rgba(255,255,255,0) 64%);
}
.banner__inner { position: relative; z-index: 2; max-width: var(--maxw); margin: 0 auto; padding: 56px var(--gutter); width: 100%; }
.banner__panel { max-width: 470px; }
@media (max-width: 760px) {
  .banner { min-height: 540px; background-position: 74% center; }
  .banner__overlay { background: linear-gradient(180deg, rgba(255,255,255,0.94) 0%, rgba(255,255,255,0.78) 52%, rgba(255,255,255,0.35) 100%); }
}

/* ==========================================================================
   Bespoke programme — special treatment (the custom Change Leadership offer)
   ========================================================================== */
.badge {
  display: inline-block; font-family: var(--ff-sans); font-weight: 600;
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  padding: 7px 14px;
}
.badge--accent  { background: var(--accent); color: var(--brand); }
.badge--outline { border: 1px solid var(--accent); color: var(--accent); }

/* highlighted panel that sets the bespoke programme apart in a listing */
.bespoke-card {
  display: grid; grid-template-columns: 1fr auto; gap: 48px; align-items: center;
  background: var(--brand); color: var(--on-brand);
  border: 1px solid var(--accent-30); border-left: 4px solid var(--accent);
  padding: 52px 48px; margin-top: 26px;
}
.bespoke-card__title {
  font-family: var(--ff-display); font-weight: 400; font-size: 36px; line-height: 1.1;
  color: var(--on-brand); margin: 16px 0 14px;
}
.bespoke-card__body {
  font-family: var(--ff-sans); font-weight: 500; font-size: 16px; line-height: 1.66;
  color: var(--on-brand-65); margin: 0; max-width: 62ch;
}
.bespoke-card__aside { text-align: right; }
@media (max-width: 820px) {
  .bespoke-card { grid-template-columns: 1fr; }
  .bespoke-card__aside { text-align: left; }
}

/* ==========================================================================
   Text links (small uppercase, brass underline, optional arrow)
   ========================================================================== */
.tlink {
  text-decoration: none; text-transform: uppercase;
  font-size: 12px; letter-spacing: 0.14em; padding-bottom: 3px;
  border-bottom: 1px solid var(--accent);
}
.tlink--dark        { color: var(--brand-2); }
.tlink--dark:hover  { color: var(--accent-deep); }
.tlink--accent       { font-size: 11.5px; color: var(--accent); border-bottom-color: var(--accent-50); }
.tlink--accent:hover { color: var(--accent-hover); }
/* ghost link on dark bands: light text, soft brass underline */
.tlink--on-brand       { font-size: 13px; color: var(--on-brand); border-bottom: 1px solid var(--accent-70); padding-bottom: 4px; }
.tlink--on-brand:hover { border-bottom-color: var(--accent); }

/* ==========================================================================
   Utility bar  (top strip)
   ========================================================================== */
.util-bar {
  background: var(--brand); color: var(--on-brand-75);
  font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase;
  padding: 9px var(--gutter);
  display: flex; align-items: center; justify-content: space-between;
}
.util-bar__right { display: flex; align-items: center; gap: 24px; }
.util-bar__tag   { color: var(--accent); }
.util-bar__sep   { width: 1px; height: 11px; background: var(--on-brand-20); }
.util-bar a      { text-decoration: none; color: var(--on-brand-75); }
.util-bar a:hover{ color: var(--accent); }

/* ==========================================================================
   Primary navigation
   ========================================================================== */
.nav {
  background: var(--surface); border-bottom: 1px solid var(--line-12);
  padding: 20px var(--gutter);
  display: flex; align-items: center; justify-content: space-between;
  position: sticky; top: 0; z-index: 20;
}
.nav__brand { text-decoration: none; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; }
.nav__logo { height: 30px; width: auto; display: block; }
.nav__sub  { font-size: 8.5px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--muted); }
/* legacy text lockup (kept for reference; superseded by .nav__logo) */
.nav__mark {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border: 1px solid var(--brand);
  font-family: var(--ff-display); font-size: 17px; color: var(--brand);
}
.nav__brandtext { display: flex; flex-direction: column; line-height: 1.1; }
.nav__name { font-family: var(--ff-display); font-size: 21px; letter-spacing: 0.04em; color: var(--brand); }
.nav__links{ display: flex; align-items: center; gap: 36px; }

.nav-link {
  text-decoration: none; font-size: 12.5px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--brand-2); font-weight: 500;
  padding-bottom: 2px; border-bottom: 1px solid transparent;
}
.nav-link:hover        { border-bottom: 1px solid var(--accent); color: var(--brand); }
.nav-link--active      { color: var(--brand); border-bottom: 1px solid var(--accent); }

/* ==========================================================================
   Hero  (deep-brand gradient header)
   ========================================================================== */
.hero {
  position: relative; background: var(--hero-gradient);
  color: var(--on-brand); overflow: hidden;
}
.hero__weave { position: absolute; inset: 0; background: var(--hero-weave); }
.hero__inner { position: relative; max-width: var(--maxw); margin: 0 auto; padding: 104px var(--gutter) 96px; z-index: 2; }
.hero__kicker { display: flex; align-items: center; gap: 16px; margin-bottom: 30px; animation: wriaFade 0.8s ease both; }
.hero__kicker-rule { width: 46px; height: 1px; background: var(--accent); }
.hero__kicker-label { font-size: 12px; letter-spacing: 0.28em; text-transform: uppercase; color: var(--accent); font-weight: 600; }
.hero__title {
  font-family: var(--ff-display); font-weight: 400; font-size: 66px;
  line-height: 1.05; letter-spacing: -0.015em; margin: 0 0 28px;
  animation: wriaFade 0.9s ease 0.05s both;
}
.hero__lead {
  font-family: var(--ff-sans); font-weight: 500; font-size: 19px; line-height: 1.62;
  color: var(--on-brand-74); margin: 0 0 40px; animation: wriaFade 1s ease 0.1s both;
}
/* hero action row + corner placeholder badge */
.hero__actions { display: flex; align-items: center; gap: 30px; animation: wriaFade 1.05s ease 0.15s both; }
.hero__badge {
  position: absolute; top: 24px; right: var(--gutter);
  font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--on-brand-40); z-index: 3;
}

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer { background: var(--brand); color: var(--on-brand); }
.site-footer__top {
  max-width: var(--maxw); margin: 0 auto; padding: 74px var(--gutter) 40px;
  display: grid; grid-template-columns: 1.4fr 0.9fr 0.9fr 1.05fr; gap: 44px;
}
.site-footer__brand { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
.site-footer__mark {
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; border: 1px solid var(--accent);
  font-family: var(--ff-display); font-size: 18px; color: var(--accent);
}
.site-footer__name { font-family: var(--ff-display); font-size: 24px; letter-spacing: 0.04em; }
/* footer wordmark — same logo as the nav, rendered all-white for the dark band */
.site-footer__logo { height: 34px; width: auto; display: block; filter: brightness(0) invert(1); }
.site-footer__about{ font-size: 14px; line-height: 1.65; color: var(--on-brand-60); font-weight: 300; max-width: 36ch; margin: 0 0 22px; }
.site-footer__tag  { font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent); }
.site-footer__head { font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--on-brand-45); margin-bottom: 20px; }
.site-footer__addr { font-size: 14px; line-height: 1.6; color: var(--on-brand-60); font-weight: 300; margin: 8px 0 16px; max-width: 24ch; }

.footer-link        { text-decoration: none; display: block; font-size: 14px; color: var(--on-brand-78); padding: 7px 0; font-weight: 300; }
.footer-link:hover  { color: var(--accent); }
.footer-link--accent {
  text-decoration: none; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--accent); border-bottom: 1px solid var(--accent-50); padding-bottom: 3px; display: inline-block;
}
.footer-link--accent:hover { color: var(--accent-hover); }

.site-footer__strip { border-top: 1px solid var(--on-brand-12); }
.site-footer__ack   { max-width: var(--maxw); margin: 0 auto; padding: 22px var(--gutter); font-size: 12px; line-height: 1.6; color: var(--on-brand-45); font-weight: 300; }
.site-footer__legal { max-width: var(--maxw); margin: 0 auto; padding: 20px var(--gutter); display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.site-footer__copy  { font-size: 12px; letter-spacing: 0.04em; color: var(--on-brand-40); }
.site-footer__legal-links { display: flex; gap: 28px; }
.footer-legal-link       { text-decoration: none; font-size: 12px; letter-spacing: 0.06em; color: var(--on-brand-50); }
.footer-legal-link:hover { color: var(--accent); }

/* ==========================================================================
   Form fields  (enquiry / contact)
   ========================================================================== */
.wria-field {
  width: 100%; box-sizing: border-box; background: var(--surface-raised);
  border: 1px solid var(--line-20); color: var(--brand-2);
  font-family: var(--ff-sans); font-weight: 300; font-size: 15px;
  padding: 14px 16px; outline: none;
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.wria-field::placeholder { color: var(--muted-2); }
.wria-field:focus { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
select.wria-field {
  -webkit-appearance: none; appearance: none;
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'12'%20height%3D'8'%20viewBox%3D'0%200%2012%208'%3E%3Cpath%20d%3D'M1%201l5%205%205-5'%20stroke%3D'%23876B38'%20stroke-width%3D'1.5'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat; background-position: right 16px center; padding-right: 40px;
}
.wria-label {
  display: block; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--accent-deep); font-weight: 600; margin-bottom: 9px;
}


/* WRIA — generated utility layer (one class per declaration).
   Exact values, token-driven. Edit tokens in wria-theme.css to retheme.
   Regenerate with .build/extract-classes.py. */

.ai-baseline{align-items:baseline;}
.ai-center{align-items:center;}
.ai-end{align-items:end;}
.ai-flex-end{align-items:flex-end;}
.ai-start{align-items:start;}

.anim-wriafade-0_8s-ease-both{animation:wriaFade 0.8s ease both;}
.anim-wriafade-0_9s-ease-0_05s-both{animation:wriaFade 0.9s ease 0.05s both;}
.anim-wriafade-1s-ease-0_1s-both{animation:wriaFade 1s ease 0.1s both;}

.ar-1-0_72{aspect-ratio:1 / 0.72;}
.ar-820-440{aspect-ratio:820 / 440;}

.bb-1px-solid-accent{border-bottom:1px solid var(--accent);}
.bb-1px-solid-accent-70{border-bottom:1px solid var(--accent-70);}
.bb-1px-solid-line-12{border-bottom:1px solid var(--line-12);}
.bb-1px-solid-line-16{border-bottom:1px solid var(--line-16);}
.bb-1px-solid-on-brand-08{border-bottom:1px solid var(--on-brand-08);}
.bb-1px-solid-on-brand-10{border-bottom:1px solid var(--on-brand-10);}

.bd-1px-solid-accent-30{border:1px solid var(--accent-30);}
.bd-1px-solid-line-16{border:1px solid var(--line-16);}
.bd-1px-solid-rgba-167_134_74_0_6{border:1px solid rgba(194,160,89,0.6);}

.bg-accent{background:var(--accent);}
.bg-accent-30{background:var(--accent-30);}
.bg-brand{background:var(--brand);}
.bg-brand-2{background:var(--brand-2);}
.bg-brand-ov-40{background:var(--brand-ov-40);}
.bg-h339128{background:linear-gradient(180deg,rgba(18,39,30,0) 0%,var(--brand-ov-50) 100%);}
.bg-surface-alt{background:var(--surface-alt);}
.bg-surface-raised{background:var(--surface-raised);}

.bl-1px-solid-accent-18{border-left:1px solid var(--accent-18);}
.bl-1px-solid-on-brand-10{border-left:1px solid var(--on-brand-10);}
.bl-1px-solid-on-brand-12{border-left:1px solid var(--on-brand-12);}

.bottom-0{bottom:0;}

.br-1px-solid-on-brand-10{border-right:1px solid var(--on-brand-10);}

.bt-1px-solid-accent-25{border-top:1px solid var(--accent-25);}
.bt-1px-solid-accent-30{border-top:1px solid var(--accent-30);}
.bt-1px-solid-line-12{border-top:1px solid var(--line-12);}
.bt-1px-solid-line-16{border-top:1px solid var(--line-16);}
.bt-1px-solid-on-brand-12{border-top:1px solid var(--on-brand-12);}
.bt-2px-solid-brand{border-top:2px solid var(--brand);}
.bt-3px-solid-accent{border-top:3px solid var(--accent);}

.bx-border-box{box-sizing:border-box;}

.c-text-body{color:var(--text-body);}
.c-accent{color:var(--accent);}
.c-accent-30{color:var(--accent-30);}
.c-accent-deep{color:var(--accent-deep);}
.c-accent-hover{color:var(--accent-hover);}
.c-brand{color:var(--brand);}
.c-brand-2{color:var(--brand-2);}
.c-on-brand-50{color:var(--on-brand-50);}
.c-on-brand-55{color:var(--on-brand-55);}
.c-on-brand-60{color:var(--on-brand-60);}
.c-on-brand-62{color:var(--on-brand-62);}
.c-on-brand-64{color:var(--on-brand-64);}
.c-on-brand-65{color:var(--on-brand-65);}
.c-on-brand-74{color:var(--on-brand-74);}
.c-on-brand-78{color:var(--on-brand-78);}
.c-on-brand-82{color:var(--on-brand-82);}
.c-muted{color:var(--muted);}
.c-muted-2{color:var(--muted-2);}
.c-surface{color:var(--surface);}
.c-rgba-244_239_227_0_66{color:rgba(244,239,227,0.66);}
.c-rgba-244_239_227_0_7{color:rgba(244,239,227,0.7);}
.c-rgba-244_239_227_0_72{color:rgba(244,239,227,0.72);}
.c-rgba-244_239_227_0_8{color:rgba(244,239,227,0.8);}

.d-flex{display:flex;}
.d-grid{display:grid;}
.d-inline-block{display:inline-block;}

.fd-column{flex-direction:column;}

.ff-ff-display{font-family:var(--ff-display);}
.ff-ff-sans{font-family:var(--ff-sans);}
.ff-ff-text{font-family:var(--ff-text);}

.fs-0_55em{font-size:0.55em;}
.fs-0_5em{font-size:0.5em;}
.fs-10_5px{font-size:10.5px;}
.fs-10px{font-size:10px;}
.fs-110px{font-size:110px;}
.fs-11px{font-size:11px;}
.fs-12_5px{font-size:12.5px;}
.fs-12px{font-size:12px;}
.fs-13_5px{font-size:13.5px;}
.fs-13px{font-size:13px;}
.fs-14_5px{font-size:14.5px;}
.fs-14px{font-size:14px;}
.fs-15_5px{font-size:15.5px;}
.fs-15px{font-size:15px;}
.fs-16_5px{font-size:16.5px;}
.fs-16px{font-size:16px;}
.fs-17px{font-size:17px;}
.fs-18px{font-size:18px;}
.fs-19px{font-size:19px;}
.fs-20px{font-size:20px;}
.fs-21px{font-size:21px;}
.fs-22px{font-size:22px;}
.fs-23px{font-size:23px;}
.fs-24px{font-size:24px;}
.fs-25px{font-size:25px;}
.fs-26px{font-size:26px;}
.fs-27px{font-size:27px;}
.fs-28px{font-size:28px;}
.fs-30px{font-size:30px;}
.fs-31px{font-size:31px;}
.fs-33px{font-size:33px;}
.fs-34px{font-size:34px;}
.fs-38px{font-size:38px;}
.fs-40px{font-size:40px;}
.fs-42px{font-size:42px;}
.fs-44px{font-size:44px;}
.fs-46px{font-size:46px;}
.fs-48px{font-size:48px;}
.fs-50px{font-size:50px;}
.fs-60px{font-size:60px;}
.fs-72px{font-size:72px;}
.fs-78px{font-size:78px;}
.fs-80px{font-size:80px;}

.fst-italic{font-style:italic;}

.fw-300{font-weight:500;}
.fw-400{font-weight:400;}
.fw-500{font-weight:500;}
.fw-600{font-weight:600;}
.fw-700{font-weight:700;}

.fxw-wrap{flex-wrap:wrap;}

.gap-0{gap:0;}
.gap-0-64px{gap:0 64px;}
.gap-10px{gap:10px;}
.gap-12px{gap:12px;}
.gap-13px{gap:13px;}
.gap-14px{gap:14px;}
.gap-16px{gap:16px;}
.gap-18px{gap:18px;}
.gap-1px{gap:1px;}
.gap-20px{gap:20px;}
.gap-22px{gap:22px;}
.gap-24px{gap:24px;}
.gap-26px-28px{gap:26px 28px;}
.gap-28px{gap:28px;}
.gap-32px{gap:32px;}
.gap-36px{gap:36px;}
.gap-48px{gap:48px;}
.gap-64px{gap:64px;}
.gap-72px{gap:72px;}
.gap-80px{gap:80px;}

.gcol-1-1{grid-column:1 / -1;}

.gtc-0_85fr-1_15fr{grid-template-columns:0.85fr 1.15fr;}
.gtc-0_95fr-1_05fr{grid-template-columns:0.95fr 1.05fr;}
.gtc-0_9fr-1_1fr{grid-template-columns:0.9fr 1.1fr;}
.gtc-118px-1fr-220px-40px{grid-template-columns:118px 1fr 220px 40px;}
.gtc-148px-1fr-248px-40px{grid-template-columns:148px 1fr 248px 40px;}
.gtc-1_15fr-0_85fr{grid-template-columns:1.15fr 0.85fr;}
.gtc-1fr-0_8fr{grid-template-columns:1fr 0.8fr;}
.gtc-1fr-1_1fr{grid-template-columns:1fr 1.1fr;}
.gtc-1fr-1fr{grid-template-columns:1fr 1fr;}
.gtc-44px-1fr{grid-template-columns:44px 1fr;}
.gtc-64px-1fr{grid-template-columns:64px 1fr;}
.gtc-96px-1fr{grid-template-columns:96px 1fr;}
.gtc-repeat-2_1fr{grid-template-columns:repeat(2,1fr);}
.gtc-repeat-3_1fr{grid-template-columns:repeat(3,1fr);}
.gtc-repeat-4_1fr{grid-template-columns:repeat(4,1fr);}
.gtc-repeat-5_1fr{grid-template-columns:repeat(5,1fr);}

.h-100pct{height:100%;}

.inset-0{inset:0;}

.jc-center{justify-content:center;}
.jc-space-between{justify-content:space-between;}

.left-1_2pct{left:1.2%;}
.left-50pct{left:50%;}
.left-68_3pct{left:68.3%;}

.lh-0_6{line-height:0.6;}
.lh-0_8{line-height:0.8;}
.lh-1{line-height:1;}
.lh-1_04{line-height:1.04;}
.lh-1_06{line-height:1.06;}
.lh-1_08{line-height:1.08;}
.lh-1_1{line-height:1.1;}
.lh-1_12{line-height:1.12;}
.lh-1_14{line-height:1.14;}
.lh-1_15{line-height:1.15;}
.lh-1_2{line-height:1.2;}
.lh-1_22{line-height:1.22;}
.lh-1_25{line-height:1.25;}
.lh-1_4{line-height:1.4;}
.lh-1_42{line-height:1.42;}
.lh-1_44{line-height:1.44;}
.lh-1_46{line-height:1.46;}
.lh-1_5{line-height:1.5;}
.lh-1_55{line-height:1.55;}
.lh-1_58{line-height:1.58;}
.lh-1_6{line-height:1.6;}
.lh-1_62{line-height:1.62;}
.lh-1_64{line-height:1.64;}
.lh-1_65{line-height:1.65;}
.lh-1_66{line-height:1.66;}
.lh-1_68{line-height:1.68;}
.lh-1_7{line-height:1.7;}
.lh-1_72{line-height:1.72;}
.lh-1_74{line-height:1.74;}

.ls-0_005em{letter-spacing:-0.005em;}
.ls-0_015em{letter-spacing:-0.015em;}
.ls-0_02em{letter-spacing:0.02em;}
.ls-0_04em{letter-spacing:0.04em;}
.ls-0_06em{letter-spacing:0.06em;}
.ls-0_14em{letter-spacing:0.14em;}
.ls-0_16em{letter-spacing:0.16em;}
.ls-0_18em{letter-spacing:0.18em;}
.ls-0_2em{letter-spacing:0.2em;}

.m-0{margin:0;}
.m-0-0-10px{margin:0 0 10px;}
.m-0-0-12px{margin:0 0 12px;}
.m-0-0-13px{margin:0 0 13px;}
.m-0-0-14px{margin:0 0 14px;}
.m-0-0-16px{margin:0 0 16px;}
.m-0-0-18px{margin:0 0 18px;}
.m-0-0-20px{margin:0 0 20px;}
.m-0-0-22px{margin:0 0 22px;}
.m-0-0-24px{margin:0 0 24px;}
.m-0-0-28px{margin:0 0 28px;}
.m-0-0-30px{margin:0 0 30px;}
.m-0-0-32px{margin:0 0 32px;}
.m-0-0-36px{margin:0 0 36px;}
.m-0-0-40px{margin:0 0 40px;}
.m-0-0-44px{margin:0 0 44px;}
.m-0-0-56px{margin:0 0 56px;}
.m-0-0-7px{margin:0 0 7px;}
.m-0-0-8px{margin:0 0 8px;}
.m-0-auto{margin:0 auto;}
.m-0-auto-36px{margin:0 auto 36px;}
.m-24px-0-0{margin:24px 0 0;}
.m-26px-0-0{margin:26px 0 0;}
.m-48px-auto-0{margin:48px auto 0;}

.mb-10px{margin-bottom:10px;}
.mb-14px{margin-bottom:14px;}
.mb-16px{margin-bottom:16px;}
.mb-18px{margin-bottom:18px;}
.mb-20px{margin-bottom:20px;}
.mb-22px{margin-bottom:22px;}
.mb-24px{margin-bottom:24px;}
.mb-26px{margin-bottom:26px;}
.mb-28px{margin-bottom:28px;}
.mb-30px{margin-bottom:30px;}
.mb-32px{margin-bottom:32px;}
.mb-40px{margin-bottom:40px;}
.mb-54px{margin-bottom:54px;}
.mb-56px{margin-bottom:56px;}
.mb-58px{margin-bottom:58px;}
.mb-5px{margin-bottom:5px;}
.mb-60px{margin-bottom:60px;}
.mb-64px{margin-bottom:64px;}
.mb-7px{margin-bottom:7px;}
.mb-8px{margin-bottom:8px;}
.mb-9px{margin-bottom:9px;}

.mt-24px{margin-top:24px;}
.mt-30px{margin-top:30px;}
.mt-34px{margin-top:34px;}
.mt-36px{margin-top:36px;}
.mt-38px{margin-top:38px;}
.mt-40px{margin-top:40px;}
.mt-46px{margin-top:46px;}
.mt-6px{margin-top:6px;}

.mw-1100px{max-width:1100px;}
.mw-1320px{max-width:1320px;}
.mw-14ch{max-width:14ch;}
.mw-15ch{max-width:15ch;}
.mw-16ch{max-width:16ch;}
.mw-17ch{max-width:17ch;}
.mw-18ch{max-width:18ch;}
.mw-20ch{max-width:20ch;}
.mw-22ch{max-width:22ch;}
.mw-34ch{max-width:34ch;}
.mw-38ch{max-width:38ch;}
.mw-40ch{max-width:40ch;}
.mw-42ch{max-width:42ch;}
.mw-44ch{max-width:44ch;}
.mw-46ch{max-width:46ch;}
.mw-48ch{max-width:48ch;}
.mw-50ch{max-width:50ch;}
.mw-520px{max-width:520px;}
.mw-52ch{max-width:52ch;}
.mw-54ch{max-width:54ch;}
.mw-56ch{max-width:56ch;}
.mw-60ch{max-width:60ch;}
.mw-62ch{max-width:62ch;}
.mw-64ch{max-width:64ch;}
.mw-820px{max-width:820px;}
.mw-900px{max-width:900px;}

.ov-visible{overflow:visible;}

.overflow-x-hidden{overflow-x:hidden;}

.p-0-44px{padding:0 44px;}
.p-104px-44px{padding:104px 44px;}
.p-10px-0{padding:10px 0;}
.p-110px-44px{padding:110px 44px;}
.p-118px-44px-104px{padding:118px 44px 104px;}
.p-13px-0{padding:13px 0;}
.p-16px-32px{padding:16px 32px;}
.p-17px-38px{padding:17px 38px;}
.p-18px-0{padding:18px 0;}
.p-20px-0{padding:20px 0;}
.p-20px-22px{padding:20px 22px;}
.p-22px-0{padding:22px 0;}
.p-26px-0{padding:26px 0;}
.p-28px-22px-6px{padding:28px 22px 6px;}
.p-28px-30px-30px{padding:28px 30px 30px;}
.p-32px-0{padding:32px 0;}
.p-34px-0{padding:34px 0;}
.p-34px-26px-34px{padding:34px 26px 34px;}
.p-36px-0{padding:36px 0;}
.p-36px-22px-12px{padding:36px 22px 12px;}
.p-36px-26px-8px{padding:36px 26px 8px;}
.p-36px-28px-10px{padding:36px 28px 10px;}
.p-36px-28px-36px{padding:36px 28px 36px;}
.p-38px-28px-30px{padding:38px 28px 30px;}
.p-38px-8px-38px-0{padding:38px 8px 38px 0;}
.p-40px-30px-34px{padding:40px 30px 34px;}
.p-40px-36px-38px{padding:40px 36px 38px;}
.p-40px-38px{padding:40px 38px;}
.p-46px-8px-46px-0{padding:46px 8px 46px 0;}
.p-48px{padding:48px;}
.p-56px-56px-50px{padding:56px 56px 50px;}
.p-5px-12px{padding:5px 12px;}

.pb-3px{padding-bottom:3px;}
.pb-4px{padding-bottom:4px;}

.pos-absolute{position:absolute;}
.pos-relative{position:relative;}
.pos-sticky{position:sticky;}

.pt-6px{padding-top:6px;}

.right-0{right:0;}

.ta-center{text-align:center;}
.ta-right{text-align:right;}

.text-decoration-none{text-decoration:none;}

.tf-translatex-50pct{transform:translateX(-50%);}

.top-0{top:0;}
.top-4_5pct{top:4.5%;}
.top-71_5pct{top:71.5%;}
.top-90px{top:90px;}

.tr-background-0_3s-ease{transition:background 0.3s ease;}

.tt-none{text-transform:none;}
.tt-uppercase{text-transform:uppercase;}

.tw-pretty{text-wrap:pretty;}

.va-sub{vertical-align:sub;}

.w-100pct{width:100%;}
.w-30_5pct{width:30.5%;}
.w-38pct{width:38%;}

.ws-nowrap{white-space:nowrap;}

.z-2{z-index:2;}