@font-face {
  font-family: AtelierSerif;
  src: local("Baskerville"), local("Palatino Linotype"), local("Georgia");
  font-display: swap;
}

@font-face {
  font-family: Cinzel;
  src: url("cinzel-400.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Cormorant Garamond";
  src: url("cormorant-400.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}

:root {
  color-scheme: dark;
  --display: Cinzel, Georgia, serif;
  --body: "Cormorant Garamond", Georgia, serif;
  --ink: #1d150e;
  --black: #14100c;
  --gold: #eac38b;
  --line: #785733;
  --ivory: #f7e9d5;
  --rivet: radial-gradient(circle, #fff0c8 4%, #d99b52 22%, #5a3317 51%, #27180d 67%, #966032 72%, transparent 75%);
}

*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  color: var(--ivory);
  background: radial-gradient(ellipse at 73% 46rem, #292016, transparent 38rem), var(--black);
  font: 1.25rem/1.36 var(--body);
}

h1, h2, h3, p { margin: 0; }
a { color: inherit; }
button { font: inherit; }
[hidden] { display: none !important; }
[id] { scroll-margin-top: 1rem; }

:focus-visible {
  outline: 2px solid #ffdfaa;
  outline-offset: 5px;
}

.visually-hidden, .skip:not(:focus) {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.skip:focus {
  position: absolute;
  z-index: 5;
  inset: .75rem auto auto .75rem;
  padding: .5rem 1rem;
  color: var(--ink);
  background: var(--ivory);
}

.wrap {
  width: min(92%, 92rem);
  margin-inline: auto;
}

.site-header {
  position: relative;
  z-index: 1;
  border-bottom: 1px solid #a8763d;
  background: radial-gradient(ellipse at 8% 40%, #28211660, transparent 35%), #100e0bf0;
  box-shadow: 0 2px #27190d, 0 7px 25px #0008;
}

.header-inner, .footer {
  min-height: 4.6rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 2rem;
}

.brand {
  display: flex;
  align-items: center;
  gap: 13px;
  flex-shrink: 0;
  width: fit-content;
  text-decoration: none;
  font-family: AtelierSerif, Georgia, "Times New Roman", serif;
  -webkit-font-smoothing: antialiased;
}

.brand-medallion {
  width: 76px;
  height: 76px;
  display: grid;
  place-items: center;
  border: 1px solid #8d673780;
  clip-path: polygon(22% 0, 78% 0, 100% 28%, 100% 72%, 78% 100%, 22% 100%, 0 72%, 0 28%);
  background: radial-gradient(#29211780, #0d0c09);
}

.brand-gear {
  display: block;
  width: 61px;
  height: 61px;
  animation: brand-counterclockwise 35s linear infinite;
  filter: drop-shadow(0 2px 2px #000);
}

@keyframes brand-counterclockwise {
  to { transform: rotate(-360deg); }
}

.brand-type {
  font-size: 27px;
  letter-spacing: .9px;
  line-height: 1.06;
  color: #f4d79d;
}

.brand-type small {
  display: block;
  margin-top: 5px;
  font-size: 11px;
  letter-spacing: 3.3px;
}

.header-inner nav {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .6rem clamp(1rem, 3.4vw, 3.25rem);
}

.header-inner nav a, .text-link {
  padding: .4rem 0;
  color: var(--ivory);
  font: .8rem/1.25 var(--display);
  text-decoration: none;
  text-underline-offset: .45em;
}

.header-inner nav a:hover, .text-link:hover { color: var(--gold); text-decoration: underline; }

.medallion {
  --size: 3.65rem;
  position: relative;
  flex: none;
  display: grid;
  place-items: center;
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  background: repeating-conic-gradient(from 0deg, #d3a16a 0deg 5deg, #704425 5deg 12deg, transparent 12deg 22.5deg);
  filter: drop-shadow(0 3px 4px #000);
}

.medallion::before {
  content: "";
  position: absolute;
  inset: 8%;
  border: 1px solid #d4a267;
  border-radius: inherit;
  background:
    radial-gradient(circle, #291d14 0 57%, #120e0b 59% 62%, transparent 64%),
    conic-gradient(from 40deg, #fbdfac, #653918, #db9853, #624222, #fff0b7, #8f4e23, #fbdfac);
  box-shadow: inset 0 0 0 2px #a77946, 0 0 0 1px #36200d;
}

.hero {
  display: grid;
  position: relative;
  isolation: isolate;
  background: #100e0d;
  min-height: clamp(28rem, 38vw, 41rem);
  border-bottom: 1px solid #bf8a4c;
  box-shadow: 0 4px 0 #291c13;
}

.hero-art {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: -1;
}

.hero-image, .hero-video {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;
}

.hero-video { opacity: 0; transition: opacity .4s ease; }
.hero-video.is-playing { opacity: 1; }

.hero-art::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, #100b08de 0%, #110c09bf 22%, #110c0959 43%, transparent 65%),
    linear-gradient(0deg, #100b08a6 0%, transparent 24%, transparent 84%, #0b09082e);
}

.hero::after {
  content: "";
  position: absolute;
  inset: .56rem;
  pointer-events: none;
  border: 1px solid #d99e594a;
  mask-image: linear-gradient(90deg, black, transparent 17% 83%, black);
}

.hero-inner {
  display: flex;
  align-items: center;
  padding: clamp(2.2rem, 5vw, 5rem) 0;
}

.hero-copy { max-width: 42rem; padding-left: clamp(0rem, 1.8vw, 1.7rem); }

.eyebrow, .section-label {
  color: var(--gold);
  font: .72rem/1.3 var(--display);
  letter-spacing: .14em;
}

.hero h1 {
  margin: .85rem 0 .65rem;
  color: #ffe2b2;
  font: 400 clamp(2.9rem, 4.75vw, 4.5rem)/.99 var(--display);
  letter-spacing: -.044em;
  text-shadow: 0 2px #38220f, 0 8px 36px #000b;
}

.engraved-rule {
  display: flex;
  align-items: center;
  gap: .6rem;
  width: 10.4rem;
  margin: 1.18rem 0 1rem;
  color: #dcb17b;
}

.engraved-rule::before, .engraved-rule::after, .section-label::after {
  content: "";
  height: 1px;
  flex: 1;
  background: linear-gradient(90deg, currentColor, transparent);
}

.engraved-rule::before { transform: rotate(180deg); }

.engraved-rule span, .section-label::before {
  width: .45rem;
  height: .45rem;
  border: 1px solid currentColor;
  transform: rotate(45deg);
}

.hero-description {
  max-width: 30rem;
  font-size: clamp(1.19rem, 1.55vw, 1.48rem);
  text-shadow: 0 2px 4px #000;
}

.plate-button, .service-plate {
  position: relative;
  color: #ffe0aa;
  border: 1px solid #a66f37;
  border-top-color: #dcaa6c;
  border-radius: .24rem;
  text-decoration: none;
  background:
    var(--rivet) left 1px top 1px / 9px 9px no-repeat,
    var(--rivet) right 1px top 1px / 9px 9px no-repeat,
    var(--rivet) left 1px bottom 1px / 9px 9px no-repeat,
    var(--rivet) right 1px bottom 1px / 9px 9px no-repeat,
    linear-gradient(158deg, #3b291a, #201810 49%, #140f0b 76%, #332214);
  box-shadow: inset 0 0 0 3px #100a07aa, inset 0 0 0 4px #a5703a5c, 0 4px 7px #000a;
  text-shadow: 0 2px 2px #100a05;
  transition: border-color .17s ease, transform .17s ease, box-shadow .17s ease;
}

.plate-button {
  display: inline-flex;
  align-items: center;
  gap: 1.5rem;
  margin-top: 1.55rem;
  padding: .92rem 1.35rem .85rem;
  font: .85rem/1.25 var(--display);
}

.plate-button:hover, .service-plate:hover {
  border-color: #f1c38a;
  box-shadow: inset 0 0 0 3px #100a07aa, inset 0 0 0 4px #c8955e7d, 0 4px 14px #000a;
}

.plate-button:active, .service-plate:active { transform: translateY(2px); }

.service-rail {
  padding: .72rem 0;
  border-block: 3px double #8c623b;
  background:
    repeating-linear-gradient(0deg, #95612e1a 0 1px, transparent 1px 5px),
    linear-gradient(#392415, #0f0c09 20% 79%, #392415);
}

.service-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .6rem;
  list-style: none;
  padding: 0;
  margin-block: 0;
}

.service-plate {
  display: flex;
  align-items: center;
  gap: clamp(.55rem, 1.05vw, 1.15rem);
  min-height: 6.05rem;
  height: 100%;
  padding: .75rem clamp(.65rem, 1.1vw, 1.2rem);
}

.service-plate .medallion { transition: transform .34s cubic-bezier(.22, 1.6, .44, 1); }
.service-plate:hover .medallion, .service-plate:focus-visible .medallion { transform: rotate(-13deg); }

.service-icon {
  position: relative;
  color: #efc68d;
  font: 1.65rem/1 Georgia, serif;
}

:root {
  --copy: #efe0c9;
  --muted: #cdbda3;
  --ui: system-ui, sans-serif;
}

h1, h2, h3 { font-weight: 400; }
h2 { font: 400 clamp(2.15rem, 4vw, 3.45rem)/.98 var(--body); letter-spacing: -.025em; }
h3 { font: 400 1.56rem/1.12 var(--body); }
p + p { margin-top: .8rem; }
.wrap { width: min(92%, 84rem); }
.header-inner { min-height: 87px; }
.footer { min-height: 4.45rem; }
.header-inner nav a { font-size: .83rem; }

.hero { min-height: clamp(33rem, 43vw, 42rem); }
.hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr);
  gap: clamp(1.8rem, 7vw, 7rem);
  align-items: center;
  padding-block: 3.6rem;
}
.hero-copy { padding: 0; }
.hero h1 { font-size: clamp(2.7rem, 5.2vw, 5.15rem); line-height: 1.02; text-wrap: balance; }
.hero-art::after {
  background: linear-gradient(90deg, #0d0b09f2 0%, #0d0b09be 34%, #0d0b092b 64%, #0d0b0977),
    linear-gradient(0deg, #100b08ad 0%, transparent 35%);
}
.hero-image, .hero-video { object-position: center 38%; }
.hero-description { max-width: 34rem; color: var(--copy); }
.hero-glow {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at 91% 32%, #ffbe526b, transparent 19%);
  mix-blend-mode: screen;
  opacity: 0;
  animation: workshop-glow 16.47s ease infinite paused;
}
.hero:has(.demo[data-playing="true"]) .hero-glow { animation-play-state: running; }
@keyframes workshop-glow { 0%, 100% { opacity: 0; } 55% { opacity: .66; } }

.demo {
  position: relative;
  min-width: 0;
  padding: clamp(.85rem, 1.9vw, 1.5rem);
  border: 1px solid #bf8b50;
  border-radius: .28rem;
  color: var(--copy);
  background: linear-gradient(148deg, #342214f7, #120e0cf5 68%);
  box-shadow: 0 0 0 .28rem #130d0ab8, inset 0 0 0 .22rem #1c130b, inset 0 0 0 .28rem #8d5d37a8, 0 16px 35px #0009;
}
.demo-head, .demo-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; }
.demo h2 { margin-top: .5rem; font-size: clamp(1.75rem, 2.6vw, 2.55rem); }
.demo-tag { color: #edcda1; font: .71rem/1.2 var(--ui); }
.pilot-light {
  display: inline-block;
  width: .45rem;
  height: .45rem;
  margin-right: .28rem;
  border-radius: 100%;
  background: #ffd398;
  box-shadow: 0 0 12px #ff9d49;
}
.demo-steps { margin: .9rem 0; padding-left: 1.1rem; }
.demo-steps button, .demo-play {
  cursor: pointer;
  color: var(--ivory);
  background: #211710;
  border: 1px solid #9a734a;
  border-radius: .22rem;
  font: .78rem/1.22 var(--ui);
}
.demo-steps button { padding: .55rem .5rem; text-align: left; }
.demo-steps button span {
  display: grid;
  place-items: center;
  width: 1.3rem;
  height: 1.3rem;
  margin-bottom: .32rem;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: .68rem;
}
.demo-steps button[aria-expanded="true"] {
  color: #271709;
  background: linear-gradient(145deg, #f9d8a4, #dca46c);
  border-color: #fee2b2;
  box-shadow: 0 0 .9rem #ffb86d4d;
}
.demo-steps button:focus-visible, .demo-play:focus-visible { outline-offset: 2px; }
.demo-pane {
  padding: .64rem .8rem;
  border-left: 2px solid #d6a16b;
  background: #100c09;
  font: .86rem/1.5 var(--ui);
  color: var(--muted);
}
.demo-pane strong { display: block; margin-bottom: .24rem; color: var(--ivory); }
.demo[data-mode="interactive"] .demo-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: auto minmax(6.7rem, auto);
  gap: .45rem;
  padding: 0;
  list-style: none;
}
.demo[data-mode="interactive"] li { display: contents; }
.demo[data-mode="interactive"] li button { grid-row: 1; }
.demo[data-mode="interactive"] .demo-pane { grid-column: 1 / -1; grid-row: 2; }
.demo[data-playing="true"] .demo-pane:not([hidden]) { animation: signal-in .32s ease both; }
@keyframes signal-in { from { opacity: .15; transform: translateY(.24rem); } to { opacity: 1; transform: none; } }
.demo-play { min-height: 2.15rem; padding: .34rem .6rem; }
.demo-play:hover { background: #3e2a1a; }
.demo-footer a { font: .8rem/1.25 var(--ui); color: var(--gold); text-underline-offset: .25em; }
.demo:not([data-mode]) .demo-steps button, .demo[data-mode="static"] .demo-steps button { display: none; }
.demo[data-mode="static"] .demo-pane, .demo:not([data-mode]) .demo-pane { margin-bottom: .4rem; }

.service-plate { font: .93rem/1.28 var(--display); }
.service-plate .medallion { --size: 2.85rem; }
.portfolio, .contact, .details { padding-block: clamp(2.6rem, 6vw, 5.4rem); }
.section-heading { margin-bottom: 1.5rem; }
.section-heading h2, .profile h2, .contact h2 { margin: .4rem 0 .75rem; }
.cards, .cases { display: grid; gap: 1rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.service-card, .case-card {
  min-width: 0;
  background: linear-gradient(148deg, #2b2016, #19120d);
  border: 1px solid #795535;
  box-shadow: inset 0 0 0 3px #100c08ad;
}
.service-card { display: flex; flex-direction: column; }
.service-card img { width: 100%; height: 9.65rem; object-fit: cover; object-position: center 52%; border-bottom: 1px solid #8a6341; }
.service-card > div { display: flex; flex: 1; flex-direction: column; align-items: start; padding: 1rem; }
.service-card h3 a { text-decoration: none; }
.service-card h3 a:hover { text-decoration: underline; }
.service-card p, .case-card p { margin: .5rem 0 .75rem; color: var(--muted); font: .93rem/1.55 var(--ui); }
.service-card .text-link, .case-card .text-link { display: inline-block; margin-top: auto; color: var(--gold); font-size: .75rem; }
.profile {
  color-scheme: light;
  color: #2b1b10;
  background: radial-gradient(ellipse at 18% 20%, #f8e5c1, #e4c298 68%, #c89b6a);
  box-shadow: inset 0 0 2rem #5f391049;
  border-block: 3px double #7d502a;
}
.profile-layout { padding-block: clamp(2.6rem, 5vw, 4.6rem); display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(1.4rem, 7vw, 7rem); }
.profile-intro { max-width: 46rem; }
.profile .eyebrow { color: #704020; }
.profile p:not(.eyebrow), .profile li { font: 1rem/1.6 var(--ui); }
.profile-process { border-left: 1px solid #996745; padding-left: clamp(1rem, 4vw, 3.5rem); }
.profile-process ol { padding-left: 1.25rem; }
.profile-process li + li { margin-top: .55rem; }
.profile-process li span { display: block; }

.breadcrumb { display: flex; align-items: center; flex-wrap: wrap; gap: .25rem .55rem; margin-bottom: 1.8rem; color: var(--muted); font: .82rem/1.4 var(--ui); }
.breadcrumb a, .mail-link, .related a, .overview a, .result a { text-underline-offset: .25em; }
.service-hero { padding: 1.5rem 0 clamp(2.4rem, 5vw, 4.25rem); border-bottom: 3px double #9e6e43; background: radial-gradient(ellipse at 70% 0%, #372618, #160f0b 70%); }
.service-hero-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); align-items: center; gap: clamp(1rem, 6vw, 6rem); }
.service-hero h1, .overview h1, .result h1 {
  font: 400 clamp(2.15rem, 4.75vw, 4.4rem)/1.03 var(--display);
  color: #ffe2b2;
  letter-spacing: -.04em;
  overflow-wrap: anywhere;
}
.service-hero p { max-width: 42rem; font-size: clamp(1.26rem, 2.2vw, 1.6rem); }
.service-hero img { width: 100%; height: clamp(13rem, 25vw, 22rem); object-fit: cover; border: 1px solid #a77244; padding: .22rem; }
.cases { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.case-card { display: flex; flex-direction: column; align-items: start; padding: clamp(1rem, 2.1vw, 1.55rem); }
.detail-section { border-block: 3px double #835a38; background: #21180f; }
.details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem clamp(2rem, 7vw, 7rem); }
.details h2 { max-width: 24rem; margin-bottom: .72rem; font-size: clamp(1.9rem, 3.4vw, 3rem); }
.details p { color: var(--copy); font: 1rem/1.68 var(--ui); }
.related { padding: 0 0 3rem; }
.related h2 { font-size: 2rem; margin-bottom: .55rem; }
.related a { display: inline-block; margin: 0 1rem .5rem 0; color: var(--gold); font: .9rem/1.4 var(--ui); }
.overview .cases { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.overview .cases h2 { font-size: 1.85rem; }
.overview li, .result p { font: .96rem/1.65 var(--ui); }

.contact { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: start; gap: 1.65rem clamp(2rem, 7.5vw, 7rem); }
.contact-intro p:not(.eyebrow) { color: var(--muted); font: 1rem/1.6 var(--ui); }
.contact .mail-link { display: inline-block; margin-top: 1.15rem; color: var(--gold); font: .92rem/1.45 var(--ui); }
.contact-intro .mail-address { margin-top: .2rem; overflow-wrap: anywhere; }
.contact-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; min-width: 0; }
.wide { grid-column: 1 / -1; }
.contact-form label { display: grid; min-width: 0; gap: .3rem; font: .86rem/1.4 var(--ui); }
.contact-form :is(input:not([type="hidden"]), select, textarea) {
  width: 100%;
  color: var(--ivory);
  background: #130e0a;
  border: 1px solid #a47b51;
  padding: .58rem .7rem;
  border-radius: .2rem;
  font: 1rem/1.4 var(--ui);
}
.contact-form textarea { resize: vertical; }
.contact-form .plate-button { margin-top: .1rem; cursor: pointer; }
.contact-form button:disabled { cursor: wait; opacity: .72; }
.trap { display: none; }
.form-note, .form-status { color: var(--muted); font: .82rem/1.45 var(--ui); }
.form-status { padding: .7rem; border-left: 2px solid #c89c62; background: #2a1c11; color: var(--ivory); }
.form-status[data-error="true"] { border-color: #ec947c; }
.result form { max-width: 35rem; margin-block: 1rem; }
.site-footer { border-top: 3px double #7d5734; background: #120d09; }
.footer { flex-wrap: wrap; color: var(--gold); font: .85rem/1.4 var(--ui); padding-block: .85rem; }
.footer a { text-underline-offset: .25em; }
.footer-brand { font: .87rem/1.4 var(--display); }

@media (max-width: 1260px) {
  .header-inner { min-height: 79px; }
  .brand-type { font-size: 23px; }
  .brand-medallion { width: 64px; height: 64px; }
  .brand-gear { width: 54px; height: 54px; }
}
@media (max-width: 62rem) {
  .hero-inner { gap: 2rem; }
  .service-grid, .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 48rem) {
  .hero-inner, .service-hero-grid, .contact, .profile-layout, .details { grid-template-columns: 1fr; }
  .hero-inner { padding-block: 2.4rem; }
  .hero-art::after { background: linear-gradient(90deg, #0d0b09e6, #0d0b0966), linear-gradient(0deg, #0d0b09cf 0%, transparent 82%); }
  .hero-image, .hero-video { object-position: center 35%; }
  .hero h1 { font-size: clamp(2.4rem, 8.5vw, 4rem); }
  .demo { max-width: 33rem; }
  .service-hero img { max-width: 35rem; }
  .profile-process { border-left: 0; border-top: 1px solid #996745; padding: 1rem 0 0; }
  .cases { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .header-inner { min-height: 77px; }
  .brand { gap: 8px; }
  .brand-medallion { width: 55px; height: 61px; }
  .brand-gear { width: 46px; height: 46px; }
  .brand-type { font-size: 21px; letter-spacing: .7px; }
  .brand-type small { font-size: 8px; letter-spacing: 2.9px; }
}
@media (max-width: 32rem) {
  .header-inner { align-items: flex-start; flex-direction: column; padding-block: .55rem; gap: .3rem; }
  .header-inner nav { justify-content: flex-start; }
  .header-inner nav a { font-size: .79rem; }
  .service-plate { min-height: 4.65rem; font-size: .79rem; }
  .service-plate .medallion { --size: 1.95rem; }
  .service-icon { font-size: 1.1rem; }
  .cards, .overview .cases, .contact-form { grid-template-columns: 1fr; }
  .demo[data-mode="interactive"] .demo-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto auto minmax(6.1rem, auto); }
  .demo[data-mode="interactive"] li:nth-child(n + 3) button { grid-row: 2; }
  .demo[data-mode="interactive"] .demo-pane { grid-row: 3; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .hero-video { display: none; }
}

.service-plate > span:last-child { min-width: 0; overflow-wrap: anywhere; hyphens: auto; }

.demo-track { display: none; }
.demo[data-mode="interactive"] .demo-track {
  display: block;
  height: .2rem;
  margin: -.2rem 0 .85rem;
  overflow: hidden;
  border-radius: 1rem;
  background: #68492e;
}
.demo-track span {
  display: block;
  width: 25%;
  height: 100%;
  background: linear-gradient(90deg, #936035, #ffdb9f);
  box-shadow: 0 0 .6rem #ffbf80;
  transition: width .5s cubic-bezier(.25, .8, .25, 1);
}
.demo[data-step="1"] .demo-track span { width: 50%; }
.demo[data-step="2"] .demo-track span { width: 75%; }
.demo[data-step="3"] .demo-track span { width: 100%; }
.demo-steps button[data-complete="true"] span { color: #ffd79a; border-color: #d4ab75; }

.footer-links { display: flex; flex-wrap: wrap; gap: .65rem 1.25rem; }
.legal { max-width: 53rem; }
.legal h1 { font: 400 clamp(2rem, 5vw, 3.6rem)/1.08 var(--display); color: var(--gold); overflow-wrap: anywhere; }
.legal section { margin-top: 2rem; }
.legal h2 { margin-bottom: .7rem; font-size: clamp(1.7rem, 3vw, 2.5rem); }
.legal p, .legal address { font: 1rem/1.65 var(--ui); }
.legal address { margin-bottom: .8rem; }
.legal a, .form-note a { color: var(--gold); text-underline-offset: .2em; overflow-wrap: anywhere; }
.media-credit, .service-illustration figcaption { padding-block: .5rem; color: var(--muted); font: .77rem/1.4 var(--ui); }
.service-illustration { margin: 0; }
.demo-disclosure { margin-bottom: .7rem; color: var(--muted); font: .75rem/1.4 var(--ui); }