@font-face {
  font-family: "Verity Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("Assets/fonts/inter/inter-latin-wght-normal.woff2") format("woff2-variations");
}

@font-face {
  font-family: "Verity Serif";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("Assets/fonts/noto-serif/noto-serif-latin-wght-normal.woff2") format("woff2-variations");
}

@font-face {
  font-family: "Verity Mono";
  font-style: normal;
  font-display: swap;
  font-weight: 100 700;
  src: url("Assets/fonts/roboto-mono/roboto-mono-latin-wght-normal.woff2") format("woff2-variations");
}

:root {
  color-scheme: dark;
  --charcoal: #20242a;
  --deep: #151c28;
  --muted: #a5abb3;
  --gold: #a98245;
  --white: #fff;
  --font-sans: "Verity Sans", sans-serif;
  --font-serif: "Verity Serif", serif;
  --font-mono: "Verity Mono", monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--deep); color: var(--white); font-family: var(--font-sans); font-synthesis: none; }
a { color: inherit; }

.hero {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  isolation: isolate;
  background: #071019;
}

.hero__scene {
  position: absolute;
  inset: 0;
  z-index: -2;
  /* Car state 1: the continuously visible dark base render. */
  background: url("Assets/verity-beacon-hero-v3.png") center bottom / cover no-repeat;
}

.hero__scene::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 76% 60%, rgba(12, 22, 32, 0) 0%, rgba(7, 16, 25, .14) 58%, rgba(3, 9, 14, .48) 100%),
    linear-gradient(90deg, rgba(4, 11, 17, .95) 0%, rgba(5, 13, 20, .87) 38%, rgba(7, 16, 25, .48) 58%, rgba(5, 13, 20, .22) 82%, rgba(3, 9, 14, .42) 100%),
    linear-gradient(180deg, rgba(4, 10, 16, .34) 0%, rgba(7, 16, 25, .03) 48%, rgba(3, 8, 13, .38) 100%);
}

.hero__scene::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0 40% 26% 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(4, 11, 17, .98) 0%, rgba(4, 11, 17, .96) 72%, rgba(4, 11, 17, .7) 88%, transparent 100%);
}

.hero__beam {
  position: absolute;
  right: auto;
  left: calc(var(--beacon-x, 98%) - var(--beam-width, 101%));
  top: calc(var(--beacon-y, 42%) - 4.75%);
  width: var(--beam-width, 101%);
  height: 9.5%;
  transform-origin: 100% 50%;
  transform: rotate(-5deg) scaleX(.35);
  clip-path: polygon(100% 46%, 100% 54%, 0 100%, 0 0);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, transparent 49%, rgba(0,0,0,.22) 56%, rgba(0,0,0,.78) 63%, #000 68%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, transparent 49%, rgba(0,0,0,.22) 56%, rgba(0,0,0,.78) 63%, #000 68%, #000 100%);
  background:
    radial-gradient(ellipse at 100% 50%, rgba(214,181,125,.28) 0%, rgba(197,158,96,.17) 24%, rgba(169,130,69,.055) 56%, transparent 82%),
    linear-gradient(90deg, transparent 0%, rgba(169,130,69,.04) 24%, rgba(197,158,96,.13) 69%, rgba(214,181,125,.26) 100%);
  filter: blur(25px);
  opacity: 0;
  will-change: transform, opacity;
  animation: beacon-sweep 8.5s cubic-bezier(.45, 0, .55, 1) infinite alternate;
}

.hero__lantern-glow {
  position: absolute;
  z-index: 2;
  left: var(--beacon-x, 98%);
  top: var(--beacon-y, 42%);
  width: 22px;
  height: 22px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(244,224,184,.95) 0%, rgba(197,158,96,.58) 22%, rgba(169,130,69,.16) 48%, transparent 72%);
  box-shadow: none;
  filter: blur(.45px);
  mix-blend-mode: screen;
  pointer-events: none;
}

.hero__car-shade {
  position: absolute;
  inset: 0;
  pointer-events: none;
  clip-path: polygon(49% 52%, 100% 38%, 100% 100%, 50% 100%);
  background:
    radial-gradient(ellipse 13% 27% at 94% 64%, rgba(1,6,10,.16) 0%, rgba(2,7,11,.11) 48%, transparent 78%),
    radial-gradient(ellipse 58% 44% at 82% 96%, rgba(2,7,11,.58) 0%, rgba(2,7,11,.3) 48%, transparent 76%),
    linear-gradient(180deg, transparent 42%, rgba(2,7,11,.08) 62%, rgba(2,7,11,.46) 100%);
  filter: blur(.35px);
}

.hero__car-illuminated {
  /* Car state 2: enabled only with a separately rendered illuminated pass. */
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-position: center bottom;
  background-size: cover;
  background-repeat: no-repeat;
  clip-path: polygon(45% 94%, 50% 78%, 59% 69%, 71% 64%, 95% 65%, 95% 75%, 84% 76%, 73% 75%, 63% 80%, 54% 91%, 49% 96%);
  -webkit-mask-image: linear-gradient(168deg, transparent 0%, transparent 57%, rgba(0,0,0,.28) 60%, #000 63%, #000 70%, rgba(0,0,0,.42) 73%, transparent 76%);
  mask-image: linear-gradient(168deg, transparent 0%, transparent 57%, rgba(0,0,0,.28) 60%, #000 63%, #000 70%, rgba(0,0,0,.42) 73%, transparent 76%);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 130% 100%;
  mask-size: 130% 100%;
  -webkit-mask-position: 100% 0;
  mask-position: 100% 0;
  opacity: 0;
  will-change: opacity, -webkit-mask-position, mask-position;
}

.hero__car-illuminated.is-ready {
  animation: illuminated-car-pass 8.5s cubic-bezier(.45, 0, .55, 1) infinite alternate;
}

@keyframes beacon-sweep {
  0% { opacity: .18; transform: rotate(-5deg) scaleX(.92); }
  100% { opacity: .34; transform: rotate(-20deg) scaleX(1.02); }
}
@keyframes illuminated-car-pass {
  0%, 70% {
    opacity: 0;
    -webkit-mask-position: 100% 0;
    mask-position: 100% 0;
  }
  80% {
    opacity: .74;
    -webkit-mask-position: 82% 0;
    mask-position: 82% 0;
  }
  90% {
    opacity: .82;
    -webkit-mask-position: 68% 0;
    mask-position: 68% 0;
  }
  100% {
    opacity: .82;
    -webkit-mask-position: 56% 0;
    mask-position: 56% 0;
  }
}

.site-header {
  position: relative;
  width: min(1280px, calc(100% - 64px));
  margin: 0 auto;
  min-height: 104px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.brand { display: inline-flex; width: 250px; padding: 6px 0; text-decoration: none; }
.brand img { display: block; width: 100%; height: auto; object-fit: contain; object-position: left center; }
.desktop-nav { display: flex; align-items: center; gap: clamp(16px, 2vw, 32px); }
.desktop-nav a { position: relative; isolation: isolate; padding: 10px 12px; margin: -10px -12px; color: rgba(255,255,255,.76); font-size: .84rem; letter-spacing: .055em; text-decoration: none; transition: color .25s ease, text-shadow .25s ease; }
.language-switcher { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 2px; padding: 3px; border: 1px solid rgba(255,255,255,.2); border-radius: 2px; background: rgba(6,14,22,.38); }
.language-switcher a { min-width: 29px; padding: 6px 7px; color: rgba(245,240,228,.62); font-family: var(--font-mono); font-size: .62rem; font-weight: 700; letter-spacing: .1em; line-height: 1; text-align: center; text-decoration: none; }
.language-switcher a:hover, .language-switcher a:focus-visible { color: #fff; }
.language-switcher a[aria-current="page"] { color: #161f25; background: #d1a462; }
.desktop-nav a:hover, .desktop-nav a:focus-visible { color: var(--white); text-shadow: 0 0 12px rgba(230,194,132,.34); }
.desktop-nav .desktop-nav__cta { min-height: 42px; margin: 0 0 0 7px; padding: 0 16px; border: 1px solid rgba(197, 150, 76, .7); color: #f7f0df; font-size: .72rem; font-weight: 700; letter-spacing: .11em; line-height: 40px; text-transform: uppercase; }
.desktop-nav__cta span { color: #c7964c; transition: transform .3s ease; }
.desktop-nav__cta:hover span, .desktop-nav__cta:focus-visible span { display: inline-block; transform: translateX(3px); }
.desktop-nav__withdrawal,
.mobile-nav__withdrawal { color: #edcf99 !important; font-size: .68rem !important; font-weight: 700; letter-spacing: .085em !important; text-decoration: underline !important; text-decoration-thickness: 1px; text-underline-offset: 4px; text-transform: uppercase; }
.menu-button { display: none; position: relative; overflow: hidden; isolation: isolate; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.2); background: rgba(21,28,40,.4); border-radius: 50%; cursor: pointer; }
.menu-button span { position: relative; z-index: 1; display: block; width: 17px; height: 1px; margin: 5px auto; background: #fff; }
.mobile-nav { display: none; }

.hero__content {
  position: relative;
  width: min(1280px, calc(100% - 64px));
  margin: 0 auto;
  padding: clamp(54px, 7vh, 84px) 0 104px;
}

.hero__content > * { max-width: 640px; }
.hero__eyebrow { margin: 0 0 20px; color: #c1a16e; font-size: .72rem; font-weight: 650; letter-spacing: .22em; text-transform: uppercase; }
h1 { margin: 0; font-family: var(--font-serif); font-size: clamp(3rem, 4.75vw, 4.7rem); font-weight: 400; line-height: 1.04; letter-spacing: -.045em; text-wrap: balance; }
.hero__description { margin: 30px 0 0; max-width: 600px; color: rgba(255,255,255,.7); font-size: clamp(1rem, 1.3vw, 1.18rem); line-height: 1.75; }
.hero__actions { display: flex; gap: 14px; margin-top: 38px; }

.button,
.menu-button,
.desktop-nav a,
.scroll-cue { --spotlight-x: 50%; --spotlight-y: 50%; }
.button { position: relative; overflow: hidden; isolation: isolate; display: inline-flex; min-height: 54px; align-items: center; justify-content: center; padding: 0 25px; border: 1px solid; border-radius: 2px; font-size: .88rem; font-weight: 600; letter-spacing: .025em; text-decoration: none; transition: background-color .35s ease, border-color .35s ease, color .35s ease, box-shadow .35s ease; }
.button span { position: relative; z-index: 1; }
.button::before,
.menu-button::before { content: ""; position: absolute; z-index: 0; inset: -1px; pointer-events: none; background: radial-gradient(105px circle at var(--spotlight-x) var(--spotlight-y), rgba(255,247,226,.7) 0%, rgba(210,165,92,.28) 34%, transparent 70%); opacity: 0; transition: opacity .22s ease; }
.button:hover::before, .button:focus-visible::before, .button:active::before,
.menu-button:hover::before, .menu-button:focus-visible::before, .menu-button:active::before,
.button.is-spotlit::before, .menu-button.is-spotlit::before { opacity: 1; }
.button--primary { background: rgba(12,19,27,.84); border-color: #9f7c46; color: #f4f1ea; backdrop-filter: blur(5px); }
.button--primary::before { background: radial-gradient(105px circle at var(--spotlight-x) var(--spotlight-y), rgba(237,211,164,.62) 0%, rgba(184,140,75,.34) 38%, transparent 72%); }
.button--primary:hover, .button--primary:focus-visible { background: rgba(31,33,31,.92); border-color: #d0a96a; color: #fff; box-shadow: 0 0 22px rgba(195,154,90,.16); }
.button--secondary { background: rgba(19,26,36,.36); border-color: rgba(255,255,255,.32); color: #fff; backdrop-filter: blur(5px); }
.button--secondary:hover, .button--secondary:focus-visible { background: rgba(19,26,36,.54); border-color: #b68d50; box-shadow: 0 0 24px rgba(182,141,80,.12); }
.menu-button::before { background: radial-gradient(36px circle at var(--spotlight-x) var(--spotlight-y), rgba(255,247,226,.65) 0%, rgba(199,153,82,.25) 42%, transparent 76%); }
.menu-button:hover, .menu-button:focus-visible { border-color: #b68d50; }
.button:focus-visible, .desktop-nav a:focus-visible, .brand:focus-visible, .scroll-cue:focus-visible, .menu-button:focus-visible { outline: 2px solid #d4b279; outline-offset: 4px; }

.desktop-nav a::before,
.scroll-cue::before { content: ""; position: absolute; z-index: -1; inset: 0; pointer-events: none; border-radius: 3px; background: radial-gradient(92px circle at var(--spotlight-x) var(--spotlight-y), rgba(255,247,226,.38) 0%, rgba(204,157,85,.18) 38%, transparent 72%); opacity: 0; transition: opacity .22s ease; }
.desktop-nav a:hover::before, .desktop-nav a:focus-visible::before, .desktop-nav a:active::before,
.scroll-cue:hover::before, .scroll-cue:focus-visible::before, .scroll-cue:active::before,
.desktop-nav a.is-spotlit::before, .scroll-cue.is-spotlit::before { opacity: 1; }
.scroll-cue { position: absolute; isolation: isolate; left: 50%; bottom: 26px; display: flex; flex-direction: column; align-items: center; gap: 7px; min-width: 250px; padding: 9px 18px; transform: translateX(-50%); color: rgba(255,255,255,.58); font-size: .76rem; letter-spacing: .06em; text-decoration: none; transition: color .3s ease, text-shadow .3s ease; }
.scroll-cue:hover, .scroll-cue:focus-visible { color: #e2c99d; text-shadow: 0 0 14px rgba(226,201,157,.3); }
.scroll-cue__arrow { color: #c29a5d; font-size: 1.05rem; animation: scroll-drift 3.8s ease-in-out infinite; }
@keyframes scroll-drift { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(4px); } }

@media (max-width: 900px) {
  .site-header, .hero__content { width: min(100% - 40px, 720px); }
  .site-header { min-height: 86px; }
  .brand { width: 190px; }
  .desktop-nav { display: none; }
  .site-header .language-switcher { margin-left: auto; margin-right: 10px; }
  .menu-button { display: block; }
  .mobile-nav { position: absolute; z-index: 8; top: calc(100% - 7px); right: 0; display: grid; width: min(320px, calc(100vw - 40px)); padding: 14px; border: 1px solid rgba(218, 224, 223, .16); background: rgba(7, 16, 25, .98); box-shadow: 0 20px 48px rgba(0, 0, 0, .42); opacity: 0; pointer-events: none; transform: translateY(-7px); transition: opacity .22s ease, transform .22s ease; }
  .mobile-nav a { padding: 13px 12px; color: rgba(245, 240, 228, .78); font-size: .88rem; text-decoration: none; }
  .mobile-nav .mobile-nav__cta { margin-top: 8px; border: 1px solid rgba(197, 150, 76, .66); color: #fff7e7; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
  .site-header.is-mobile-nav-open .mobile-nav { opacity: 1; pointer-events: auto; transform: translateY(0); }
  .hero__scene { background-position: 64% bottom; }
  .hero__car-illuminated { background-position: 64% bottom; }
  .hero__scene::before { background: linear-gradient(90deg, rgba(4,11,17,.99) 0%, rgba(5,13,20,.95) 58%, rgba(4,11,17,.55) 100%), linear-gradient(180deg, rgba(4,10,16,.45), transparent 48%, rgba(3,8,13,.62)); }
  .hero__beam {
    right: auto;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, transparent 55%, rgba(0,0,0,.18) 62%, rgba(0,0,0,.7) 70%, #000 76%, #000 100%);
    mask-image: linear-gradient(90deg, transparent 0%, transparent 55%, rgba(0,0,0,.18) 62%, rgba(0,0,0,.7) 70%, #000 76%, #000 100%);
  }
  .hero__lantern-glow { width: 19px; height: 19px; }
  .hero__content { padding-top: clamp(72px, 10vh, 104px); }
  .hero__content > * { max-width: 610px; }
}

@media (max-width: 560px) {
  .site-header, .hero__content { width: calc(100% - 36px); }
  .site-header { min-height: 76px; }
  .brand { width: 194px; }
  .site-header .brand { width: 165px; }
  .hero__scene { background-position: 61% bottom; }
  .hero__car-illuminated { background-position: 61% bottom; }
  .hero__scene::before { background: linear-gradient(180deg, rgba(4,11,17,.98) 0%, rgba(5,13,20,.91) 58%, rgba(3,9,14,.58) 100%); }
  .hero__content { padding: clamp(60px, 9vh, 92px) 0 160px; }
  .hero__eyebrow { font-size: .64rem; margin-bottom: 16px; }
  h1 { font-size: clamp(2.52rem, 12vw, 3.35rem); line-height: 1.06; }
  .hero__description { margin-top: 24px; font-size: .98rem; line-height: 1.65; }
  .hero__actions { flex-direction: column; margin-top: 30px; }
  .button { width: 100%; }
  .hero__beam {
    right: auto;
    filter: blur(20px);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, transparent 62%, rgba(0,0,0,.16) 69%, rgba(0,0,0,.65) 77%, #000 83%, #000 100%);
    mask-image: linear-gradient(90deg, transparent 0%, transparent 62%, rgba(0,0,0,.16) 69%, rgba(0,0,0,.65) 77%, #000 83%, #000 100%);
  }
  .hero__lantern-glow { width: 16px; height: 16px; }
  .hero__car-shade { clip-path: polygon(36% 58%, 100% 48%, 100% 100%, 38% 100%); }
  .hero__car-illuminated {
    clip-path: polygon(24% 94%, 29% 82%, 44% 75%, 72% 73%, 87% 77%, 85% 84%, 74% 87%, 50% 87%, 34% 91%, 28% 96%);
    -webkit-mask-image: linear-gradient(165deg, transparent 0%, transparent 67%, rgba(0,0,0,.28) 70%, #000 73%, #000 80%, rgba(0,0,0,.42) 83%, transparent 86%);
    mask-image: linear-gradient(165deg, transparent 0%, transparent 67%, rgba(0,0,0,.28) 70%, #000 73%, #000 80%, rgba(0,0,0,.42) 83%, transparent 86%);
  }
  .scroll-cue { bottom: 20px; width: 100%; }
}

@media (hover: none) {
  .button:hover::before, .menu-button:hover::before, .desktop-nav a:hover::before, .scroll-cue:hover::before { opacity: 0; }
  .button:active::before, .button:focus-visible::before,
  .menu-button:active::before, .menu-button:focus-visible::before,
  .desktop-nav a:active::before, .desktop-nav a:focus-visible::before,
  .scroll-cue:active::before, .scroll-cue:focus-visible::before { opacity: 1; transition: none; }
  .button--primary:hover { background: rgba(12,19,27,.84); border-color: #9f7c46; color: #f4f1ea; box-shadow: none; }
  .button--secondary:hover { background: rgba(19,26,36,.36); border-color: rgba(255,255,255,.32); box-shadow: none; }
  .menu-button:hover { border-color: rgba(255,255,255,.2); }
  .desktop-nav a:hover { color: rgba(255,255,255,.76); text-shadow: none; }
  .scroll-cue:hover { color: rgba(255,255,255,.58); text-shadow: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .hero__beam { opacity: .26; animation: none; transform: rotate(-11deg) scaleX(.95); }
  .hero__car-illuminated.is-ready {
    opacity: .72;
    animation: none;
    -webkit-mask-position: 64% 0;
    mask-position: 64% 0;
  }
  .scroll-cue__arrow { animation: none; }
  .button::before, .menu-button::before, .desktop-nav a::before, .scroll-cue::before { display: none; }
  .button { transition-duration: .15s; }
}

/* How Verity Beacon works */
.how-it-works {
  --chart-paper: #dde1dd;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  scroll-margin-top: 0;
  color: #20242a;
  background: linear-gradient(180deg, #dce1df 0%, #e2e1db 48%, #d8ddda 100%);
}

.how-it-works::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 auto;
  height: 148px;
  background: linear-gradient(180deg, #071019 0%, #303941 22%, #c7cbce 67%, var(--chart-paper) 100%);
  pointer-events: none;
}

.how-it-works::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 148px 0 0;
  background-image:
    radial-gradient(circle, rgba(52, 60, 58, .78) 0 .42px, transparent .58px),
    radial-gradient(circle, rgba(74, 78, 73, .58) 0 .36px, transparent .52px),
    repeating-linear-gradient(96deg, rgba(67, 74, 71, .34) 0 1px, transparent 1px 8px);
  background-position: 0 0, 3px 4px, 0 0;
  background-size: 9px 9px, 13px 13px, 180px 100%;
  opacity: .02;
  mix-blend-mode: multiply;
  pointer-events: none;
}

.how-it-works__container {
  width: min(1200px, calc(100% - 64px));
  margin: 0 auto;
  padding: clamp(210px, 17vw, 248px) 0 clamp(124px, 11vw, 156px);
}

.how-it-works__header {
  max-width: 820px;
}

.how-it-works__eyebrow {
  margin: 0 0 20px;
  color: #a98245;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .19em;
}

.how-it-works h2 {
  max-width: 760px;
  margin: 0;
  color: #20242a;
  font-size: clamp(2.35rem, 4.3vw, 4rem);
  font-weight: 480;
  line-height: 1.06;
  letter-spacing: -.038em;
  text-wrap: balance;
}

.how-it-works__intro {
  max-width: 760px;
  margin: 30px 0 0;
  color: #59616b;
  font-size: clamp(1rem, 1.35vw, 1.16rem);
  line-height: 1.75;
}

.process {
  position: relative;
  margin-top: clamp(82px, 8vw, 112px);
}

.process__track {
  position: absolute;
  z-index: 0;
  top: 91px;
  left: calc(100% / 6);
  right: calc(100% / 6);
  height: 1px;
  background: #d9dde1;
}

.process__light {
  position: absolute;
  inset: -1px 0 auto;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, #8e6b35 0%, #a98245 68%, #d8bd87 92%, #f0dfbb 100%);
  box-shadow: 0 0 7px rgba(169, 130, 69, .18);
  transform: scaleX(1);
  transform-origin: 0 50%;
}

.process__list {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(44px, 6vw, 92px);
  margin: 0;
  padding: 0;
  list-style: none;
}

.process-step {
  position: relative;
  min-width: 0;
  text-align: center;
}

.process-step::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 90px;
  left: 12%;
  right: 12%;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(169, 130, 69, .74), transparent);
  opacity: 0;
  transition: opacity .35s ease;
}

.process-step__number {
  display: block;
  color: #68717a;
  font-size: clamp(3rem, 5vw, 4.7rem);
  font-weight: 340;
  line-height: 1;
  letter-spacing: -.06em;
  transition: color .35s ease;
}

.process-step__marker {
  display: block;
  width: 13px;
  height: 13px;
  margin: 28px auto 0;
  border: 2px solid #c6cbd0;
  border-radius: 50%;
  background: var(--chart-paper);
  box-shadow: 0 0 0 5px var(--chart-paper);
  transition: border-color .35s ease, background-color .35s ease, box-shadow .35s ease;
}

.process-step__content {
  margin-top: 40px;
}

.process-step h3 {
  margin: 0;
  color: #30363d;
  font-size: clamp(1.2rem, 1.7vw, 1.48rem);
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: -.018em;
  transition: color .35s ease;
}

.process-step p {
  margin: 18px auto 0;
  color: #59616b;
  font-size: .98rem;
  line-height: 1.72;
}

.process-step:hover::after { opacity: .7; }
.process-step:hover .process-step__number { color: #343a41; }
.process-step:hover .process-step__marker {
  border-color: #a98245;
  background: #e1c99a;
  box-shadow: 0 0 0 5px var(--chart-paper), 0 0 12px rgba(169, 130, 69, .18);
}
.process-step:hover h3 { color: #171b20; }

.how-it-works.is-animation-ready .process__light {
  transform: scaleX(0);
}

.how-it-works.is-animation-ready.is-illuminated .process__light {
  animation: process-light-travel 3.45s cubic-bezier(.45, 0, .55, 1) forwards;
}

.how-it-works.is-animation-ready.is-illuminated .process-step__number {
  animation: process-number-light .62s ease forwards;
  animation-delay: calc(.2s + var(--step-index) * 1.35s);
}

.how-it-works.is-animation-ready.is-illuminated .process-step__marker {
  animation: process-marker-light .7s ease forwards;
  animation-delay: calc(.2s + var(--step-index) * 1.35s);
}

.how-it-works.is-animation-ready.is-illuminated .process-step h3 {
  animation: process-title-light .62s ease forwards;
  animation-delay: calc(.2s + var(--step-index) * 1.35s);
}

@keyframes process-light-travel {
  0%, 9% { transform: scaleX(0); }
  18%, 25% { transform: scaleX(.04); }
  47%, 57% { transform: scaleX(.5); }
  88%, 100% { transform: scaleX(1); }
}

@keyframes process-number-light {
  0% { color: #68717a; }
  55% { color: #20242a; }
  100% { color: #3a4148; }
}

@keyframes process-marker-light {
  0% { border-color: #c6cbd0; background: var(--chart-paper); }
  52% { border-color: #a98245; background: #ecd5a6; box-shadow: 0 0 0 5px var(--chart-paper), 0 0 12px rgba(169, 130, 69, .2); }
  100% { border-color: #a98245; background: #caa96a; box-shadow: 0 0 0 5px var(--chart-paper), 0 0 7px rgba(169, 130, 69, .14); }
}

@keyframes process-title-light {
  0% { color: #30363d; }
  55% { color: #11151a; }
  100% { color: #20242a; }
}

@media (max-width: 820px) {
  .how-it-works::before { height: 124px; }
  .how-it-works::after { inset-block-start: 124px; }
  .how-it-works__container {
    width: min(100% - 48px, 680px);
    padding: 174px 0 120px;
  }
  .how-it-works h2 { font-size: clamp(2.3rem, 7vw, 3.25rem); }
  .process { margin-top: 76px; }
  .process__track {
    top: 58px;
    bottom: 60px;
    left: 80px;
    right: auto;
    width: 1px;
    height: auto;
  }
  .process__light {
    inset: 0 auto 0 -1px;
    width: 3px;
    height: auto;
    transform: scaleY(1);
    transform-origin: 50% 0;
    background: linear-gradient(180deg, #8e6b35 0%, #a98245 68%, #d8bd87 92%, #f0dfbb 100%);
  }
  .process__list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 72px;
  }
  .process-step {
    display: block;
    padding-left: 102px;
    min-height: 142px;
    text-align: left;
  }
  .process-step::after {
    top: 50px;
    bottom: -72px;
    left: 79px;
    right: auto;
    width: 3px;
    height: auto;
    background: linear-gradient(180deg, transparent, rgba(169, 130, 69, .74), transparent);
  }
  .process-step:last-child::after { bottom: 0; }
  .process-step__number {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 3rem;
  }
  .process-step__marker {
    position: absolute;
    top: 52px;
    left: 74px;
    width: 13px;
    height: 13px;
    margin: 0;
  }
  .process-step__content {
    margin: 2px 0 0;
  }
  .process-step h3 { font-size: 1.35rem; }
  .process-step p { margin-top: 14px; max-width: 540px; }
  .how-it-works.is-animation-ready .process__light { transform: scaleY(0); }
  .how-it-works.is-animation-ready.is-illuminated .process__light {
    animation-name: process-light-travel-mobile;
  }
  @keyframes process-light-travel-mobile {
    0%, 9% { transform: scaleY(0); }
    18%, 25% { transform: scaleY(.04); }
    47%, 57% { transform: scaleY(.5); }
    88%, 100% { transform: scaleY(1); }
  }
}

/* Approved workbench scene: micro-interaction pass */
.process__route-extension {
  stroke-width: 1.45;
  stroke-linecap: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 0;
}

.process__route-extension--desktop { stroke: url(#route-tail-desktop); }
.process__route-extension--mobile { stroke: url(#route-tail-mobile); }

.how-it-works.is-animation-ready .process__route-extension {
  stroke-dashoffset: 1;
}

.how-it-works.is-animation-ready.is-illuminated .process__route-extension {
  animation: nautical-route-extension 520ms cubic-bezier(.42, 0, .58, 1) 2.96s forwards;
}

.process__route-point {
  opacity: 0;
  pointer-events: none;
}

.process__route-reveal {
  mix-blend-mode: screen;
}

.process__route-point-halo {
  fill: rgba(204, 164, 98, .15);
}

.process__route-point-core {
  fill: #d6b77e;
  filter: drop-shadow(0 0 3px rgba(205, 157, 83, .42));
}

.how-it-works.is-animation-ready.is-illuminated .process__route-point {
  animation: route-point-visibility 3.34s cubic-bezier(.42, 0, .58, 1) .28s both;
}

.process-step {
  isolation: isolate;
  --arrival-delay: .28s;
  --arrival-bloom-alpha: .3;
}

.process-step:nth-child(2) { --arrival-delay: 1.66s; }
.process-step:nth-child(3) {
  --arrival-delay: 3.3s;
  --arrival-bloom-alpha: .33;
}

.process-step::after {
  content: "";
  z-index: -1;
  top: 20px;
  left: 50%;
  right: auto;
  width: 190px;
  height: 150px;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(205, 154, 77, .2) 0%, rgba(174, 155, 113, .1) 31%, rgba(151, 166, 164, .06) 48%, transparent 74%);
  opacity: 0;
  transform: translateX(-50%);
  transition: opacity .55s cubic-bezier(.42, 0, .58, 1);
}

.how-it-works.is-animation-ready.is-illuminated .process-step::after {
  animation: stage-map-halo .9s cubic-bezier(.42, 0, .58, 1) forwards;
  animation-delay: calc(.38s + var(--step-index) * 1.05s);
}

.how-it-works.is-animation-ready.is-illuminated .process-step__number {
  animation: nautical-number-light .76s cubic-bezier(.42, 0, .58, 1) forwards;
}

.how-it-works.is-animation-ready.is-illuminated .process-step__marker {
  animation: nautical-marker-light .82s cubic-bezier(.42, 0, .58, 1) forwards;
}

.how-it-works.is-animation-ready.is-illuminated .process-step h3 {
  animation: nautical-title-light .76s cubic-bezier(.42, 0, .58, 1) forwards;
}

.how-it-works.is-animation-ready.is-illuminated .nautical-chart::after {
  animation:
    workbench-light-reveal 1.8s ease-out .12s forwards,
    lantern-light-breathe 7.7s linear 1.92s infinite;
}

.process-step:hover::after { opacity: .16; }
.process-step:hover .process-step__number { color: #d8b47a; }
.process-step:hover .process-step__marker {
  border-color: #d8ae6e;
  background: #242018;
  box-shadow:
    0 0 0 5px rgba(13, 20, 26, .82),
    inset 0 0 0 3px #e4c385,
    0 0 15px rgba(196, 145, 69, .24);
}
.process-step:hover h3 { color: #fffaf1; }

@keyframes nautical-route-extension {
  from { stroke-dashoffset: 1; }
  to { stroke-dashoffset: 0; }
}

@keyframes route-point-visibility {
  0% { opacity: 0; }
  5% { opacity: 1; }
  90% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes stage-map-halo {
  0% { opacity: 0; }
  48% { opacity: .18; }
  100% { opacity: .055; }
}

@keyframes nautical-number-light {
  0% { color: rgba(190, 148, 83, .52); text-shadow: 0 1px 18px rgba(181, 132, 65, .1); }
  55% { color: #edcb91; text-shadow: 0 0 22px rgba(211, 164, 93, .26); }
  100% { color: #d1aa6d; text-shadow: 0 1px 18px rgba(181, 132, 65, .17); }
}

@keyframes nautical-marker-light {
  0% {
    border-color: rgba(181, 138, 75, .55);
    background: #161b1d;
    box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px rgba(202, 168, 109, .62);
  }
  55% {
    border-color: #e0b878;
    background: #2d2519;
    box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #efd095, 0 0 18px rgba(205, 153, 77, .3);
  }
  100% {
    border-color: #c49a59;
    background: #1b1b18;
    box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #d2ae70, 0 0 10px rgba(190, 139, 66, .14);
  }
}

@keyframes nautical-title-light {
  0% { color: rgba(222, 224, 220, .58); text-shadow: none; }
  55% { color: #fffaf0; text-shadow: 0 0 18px rgba(222, 180, 112, .11); }
  100% { color: rgba(252, 248, 239, .94); text-shadow: 0 0 14px rgba(211, 169, 99, .06); }
}

@keyframes lantern-light-breathe {
  0% { opacity: .24; }
  14% { opacity: .235; }
  37% { opacity: .24; }
  53% { opacity: .2424; }
  71% { opacity: .2376; }
  86% { opacity: .241; }
  100% { opacity: .24; }
}

@media (max-width: 820px) {
  .process-step::after {
    top: -18px;
    left: 58px;
    width: 150px;
    height: 132px;
  }
}

@media (hover: none) {
  .process-step:hover::after { opacity: .055; }
}

@media (prefers-reduced-motion: reduce) {
  .process__route-point { display: none; }
  .process__route-extension {
    stroke-dashoffset: 0 !important;
    animation: none !important;
  }
  .process-step::after {
    opacity: .055;
    animation: none !important;
  }
  .how-it-works.is-illuminated .nautical-chart::after,
  .how-it-works.is-animation-ready.is-illuminated .nautical-chart::after {
    opacity: .2;
    animation: none !important;
  }
  .how-it-works.is-illuminated .process-step__number,
  .how-it-works.is-animation-ready.is-illuminated .process-step__number {
    color: #d1aa6d;
    animation: none !important;
  }
  .how-it-works.is-illuminated .process-step__marker,
  .how-it-works.is-animation-ready.is-illuminated .process-step__marker {
    border-color: #c49a59;
    background: #1b1b18;
    box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #d2ae70;
    animation: none !important;
  }
  .how-it-works.is-illuminated .process-step h3,
  .how-it-works.is-animation-ready.is-illuminated .process-step h3 {
    color: rgba(252, 248, 239, .94);
    animation: none !important;
  }
}

@media (max-width: 560px) {
  .how-it-works::before { height: 106px; }
  .how-it-works::after { inset-block-start: 106px; }
  .how-it-works__container {
    width: calc(100% - 36px);
    padding: 148px 0 96px;
  }
  .how-it-works__eyebrow { margin-bottom: 17px; font-size: .67rem; }
  .how-it-works h2 { font-size: clamp(2.18rem, 10.7vw, 2.8rem); line-height: 1.08; }
  .how-it-works__intro { margin-top: 24px; font-size: .98rem; line-height: 1.68; }
  .process { margin-top: 62px; }
  .process__track { left: 60px; }
  .process__list { gap: 62px; }
  .process-step {
    padding-left: 72px;
    min-height: 164px;
  }
  .process-step::after { left: 59px; bottom: -62px; }
  .process-step__number { font-size: 2.65rem; }
  .process-step__marker { left: 54px; }
  .process-step h3 { font-size: 1.22rem; }
  .process-step p { font-size: .94rem; line-height: 1.66; }
}

@media (hover: none) {
  .process-step:hover::after { opacity: 0; }
  .process-step:hover .process-step__number { color: #3a4148; }
  .process-step:hover .process-step__marker {
    border-color: #a98245;
    background: #caa96a;
    box-shadow: 0 0 0 5px var(--chart-paper), 0 0 7px rgba(169, 130, 69, .14);
  }
  .process-step:hover h3 { color: #20242a; }
}

@media (prefers-reduced-motion: reduce) {
  .process__light { transform: none; }
  .process-step__number,
  .process-step__marker,
  .process-step h3 { animation: none !important; }
  .process-step__marker {
    border-color: #a98245;
    background: #caa96a;
  }
}

/* Nautical chart identity for the process section */
.nautical-chart {
  position: absolute;
  z-index: -1;
  inset: 132px 0 0;
  overflow: hidden;
  opacity: 1;
  pointer-events: none;
}

.nautical-chart::before {
  content: "";
  position: absolute;
  inset: 5% -3% -4%;
  background-image:
    linear-gradient(rgba(126, 135, 137, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(126, 135, 137, .045) 1px, transparent 1px);
  background-size: 104px 104px;
  -webkit-mask-image: linear-gradient(105deg, transparent 0%, #000 18%, #000 78%, transparent 100%);
  mask-image: linear-gradient(105deg, transparent 0%, #000 18%, #000 78%, transparent 100%);
}

.nautical-chart__contour {
  position: absolute;
  display: block;
  border: 1px solid rgba(115, 125, 128, .095);
}

.nautical-chart__contour::before,
.nautical-chart__contour::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(126, 135, 137, .052);
  border-radius: inherit;
}

.nautical-chart__contour::before { inset: -18px; }
.nautical-chart__contour::after { inset: -36px; }

.nautical-chart__contour--four::before,
.nautical-chart__contour--four::after { border-style: dashed; }

.nautical-chart__contour--one {
  top: 7%;
  right: 2%;
  width: 58%;
  height: 27%;
  border-color: rgba(115, 125, 128, .075);
  border-radius: 61% 39% 54% 46% / 44% 58% 42% 56%;
  transform: rotate(-8deg);
}

.nautical-chart__contour--two {
  top: 43%;
  left: -4%;
  width: 48%;
  height: 36%;
  border-radius: 46% 54% 39% 61% / 58% 43% 57% 42%;
  transform: rotate(12deg);
}

.nautical-chart__contour--three {
  right: 9%;
  bottom: -8%;
  width: 44%;
  height: 33%;
  border-radius: 55% 45% 63% 37% / 39% 56% 44% 61%;
  transform: rotate(19deg);
}

.nautical-chart__contour--four {
  top: 30%;
  left: 27%;
  width: 42%;
  height: 18%;
  border-color: rgba(126, 135, 137, .055);
  border-radius: 37% 63% 47% 53% / 58% 35% 65% 42%;
  transform: rotate(-21deg);
  border-style: dashed;
}

.nautical-chart__compass {
  position: absolute;
  top: 8%;
  right: -72px;
  width: 264px;
  height: 264px;
  border: 1px solid rgba(169, 130, 69, .075);
  border-radius: 50%;
  box-shadow: inset 0 0 0 46px rgba(115, 125, 128, .018), inset 0 0 0 47px rgba(115, 125, 128, .06);
}

.nautical-chart__compass::before,
.nautical-chart__compass::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: rgba(115, 125, 128, .065);
  transform: translate(-50%, -50%) rotate(18deg);
}

.nautical-chart__compass::before { width: 1px; height: 138%; }
.nautical-chart__compass::after { width: 138%; height: 1px; }

.nautical-chart__coordinate,
.nautical-chart__depth {
  position: absolute;
  color: rgba(115, 125, 128, .06);
  font-size: .64rem;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.nautical-chart__coordinate--north { top: 18%; left: 5%; transform: rotate(-90deg); }
.nautical-chart__coordinate--east { right: 19%; bottom: 8%; }
.nautical-chart__depth { left: 24%; bottom: 25%; }

/* Rebuilt chart: coast, archipelago, soundings and navigational marks */
.nautical-chart { color: #737d80; }

.nautical-chart::before {
  inset: 7% 4% 3% 5%;
  background-image:
    linear-gradient(rgba(90, 104, 107, .09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(90, 104, 107, .09) 1px, transparent 1px),
    linear-gradient(rgba(90, 104, 107, .032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(90, 104, 107, .032) 1px, transparent 1px);
  background-size: 162px 126px, 162px 126px, 40.5px 31.5px, 40.5px 31.5px;
  -webkit-mask-image: radial-gradient(ellipse at 60% 52%, #000 0%, rgba(0, 0, 0, .88) 42%, rgba(0, 0, 0, .28) 68%, transparent 86%);
  mask-image: radial-gradient(ellipse at 60% 52%, #000 0%, rgba(0, 0, 0, .88) 42%, rgba(0, 0, 0, .28) 68%, transparent 86%);
}

.nautical-chart__coast {
  position: absolute;
  inset: 0;
}

.nautical-chart__land {
  position: absolute;
  left: -22%;
  bottom: -26%;
  width: 74%;
  height: 76%;
  background: rgba(70, 84, 85, .07);
  filter: drop-shadow(1px -1px .2px rgba(64, 78, 81, .19));
  -webkit-mask-image:
    radial-gradient(ellipse 52% 72% at 18% 84%, #000 98%, transparent 100%),
    radial-gradient(ellipse 30% 24% at 54% 66%, #000 98%, transparent 100%),
    radial-gradient(ellipse 22% 17% at 68% 56%, #000 98%, transparent 100%),
    radial-gradient(ellipse 29% 20% at 76% 42%, #000 98%, transparent 100%),
    radial-gradient(ellipse 17% 13% at 88% 31%, #000 98%, transparent 100%),
    radial-gradient(ellipse 13% 9% at 95% 21%, #000 98%, transparent 100%);
  mask-image:
    radial-gradient(ellipse 52% 72% at 18% 84%, #000 98%, transparent 100%),
    radial-gradient(ellipse 30% 24% at 54% 66%, #000 98%, transparent 100%),
    radial-gradient(ellipse 22% 17% at 68% 56%, #000 98%, transparent 100%),
    radial-gradient(ellipse 29% 20% at 76% 42%, #000 98%, transparent 100%),
    radial-gradient(ellipse 17% 13% at 88% 31%, #000 98%, transparent 100%),
    radial-gradient(ellipse 13% 9% at 95% 21%, #000 98%, transparent 100%);
}

.nautical-chart__land::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(18deg, transparent 0 9px, rgba(60, 74, 76, .065) 9px 10px);
}

.nautical-chart__depth-line {
  position: absolute;
  display: block;
  border: 1px solid rgba(70, 85, 88, .155);
  border-radius: 56% 44% 61% 39% / 48% 58% 42% 52%;
  transform: rotate(-11deg);
}

.nautical-chart__depth-line--one { left: -12%; bottom: -15%; width: 61%; height: 61%; }
.nautical-chart__depth-line--two { left: -8%; bottom: -9%; width: 66%; height: 67%; border-color: rgba(70, 85, 88, .13); }
.nautical-chart__depth-line--three { left: -4%; bottom: -3%; width: 71%; height: 73%; border-color: rgba(70, 85, 88, .105); }

.nautical-chart__shore-hatches {
  position: absolute;
  inset: 0;
}

.nautical-chart__shore-hatches i {
  position: absolute;
  width: 26px;
  border-top: 1px solid rgba(64, 78, 81, .09);
  transform: rotate(-34deg);
}

.nautical-chart__shore-hatches i:nth-child(1) { top: 63%; left: 10%; }
.nautical-chart__shore-hatches i:nth-child(2) { top: 59%; left: 17%; }
.nautical-chart__shore-hatches i:nth-child(3) { top: 55%; left: 24%; }
.nautical-chart__shore-hatches i:nth-child(4) { top: 50%; left: 31%; }
.nautical-chart__shore-hatches i:nth-child(5) { top: 44%; left: 38%; }
.nautical-chart__shore-hatches i:nth-child(6) { top: 38%; left: 45%; }

.nautical-chart__island {
  position: absolute;
  display: block;
  border: 1px solid rgba(64, 78, 81, .16);
  border-radius: 58% 42% 63% 37% / 47% 61% 39% 53%;
  background: rgba(70, 84, 85, .065);
  transform: rotate(-13deg);
}

.nautical-chart__island::before,
.nautical-chart__island::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(82, 95, 98, .075);
  border-radius: inherit;
}

.nautical-chart__island::before { inset: -12px; }
.nautical-chart__island::after { inset: -24px; border-color: rgba(70, 85, 88, .06); }
.nautical-chart__island--one { top: 8%; right: 10%; width: 15%; height: 9%; border-radius: 64% 36% 52% 48% / 41% 58% 42% 59%; }
.nautical-chart__island--two { top: 25%; right: 28%; width: 7%; height: 4%; border-radius: 46% 54% 68% 32% / 62% 39% 61% 38%; transform: rotate(22deg); }
.nautical-chart__island--three { top: 31%; right: 18%; width: 4.5%; height: 2.8%; border-radius: 69% 31% 43% 57% / 38% 66% 34% 62%; transform: rotate(-28deg); }

.nautical-chart__planned-leg {
  position: absolute;
  height: 1px;
  border-top: 1px dashed rgba(82, 95, 98, .055);
  transform-origin: 0 50%;
}

.nautical-chart__planned-leg--one { top: 42%; left: 47%; width: 17%; transform: rotate(-14deg); }
.nautical-chart__planned-leg--two { top: 38%; left: 63%; width: 14%; transform: rotate(-31deg); }

.nautical-chart__nav-point {
  position: absolute;
  width: 17px;
  height: 17px;
  border: 1px solid rgba(82, 95, 98, .095);
  transform: rotate(45deg);
}

.nautical-chart__nav-point::before,
.nautical-chart__nav-point::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: rgba(82, 95, 98, .08);
  transform: translate(-50%, -50%);
}

.nautical-chart__nav-point::before { width: 29px; height: 1px; }
.nautical-chart__nav-point::after { width: 1px; height: 29px; }
.nautical-chart__nav-point i { position: absolute; inset: 5px; border-radius: 50%; background: rgba(169, 130, 69, .1); }
.nautical-chart__nav-point--beacon { top: 41%; left: 46.5%; }
.nautical-chart__nav-point--buoy { top: 26%; left: 76%; border-radius: 50%; }

.nautical-chart__reef {
  position: absolute;
  width: 13px;
  height: 13px;
  border: 1px solid rgba(64, 78, 81, .08);
  border-radius: 50%;
}

.nautical-chart__reef::before,
.nautical-chart__reef::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 19px;
  height: 1px;
  background: rgba(64, 78, 81, .075);
}

.nautical-chart__reef::before { transform: translate(-50%, -50%) rotate(45deg); }
.nautical-chart__reef::after { transform: translate(-50%, -50%) rotate(-45deg); }
.nautical-chart__reef--one { top: 18%; left: 53%; }
.nautical-chart__reef--two { top: 57%; right: 16%; }
.nautical-chart__reef--three { bottom: 14%; left: 44%; }

.nautical-chart__scale {
  position: absolute;
  opacity: .72;
}

.nautical-chart__scale--top {
  top: 5%;
  left: 29%;
  width: 39%;
  height: 10px;
  border-top: 1px solid rgba(64, 78, 81, .08);
  background: repeating-linear-gradient(90deg, rgba(64, 78, 81, .09) 0 1px, transparent 1px 52px);
}

.nautical-chart__scale--right {
  top: 36%;
  right: 3%;
  width: 10px;
  height: 37%;
  border-right: 1px solid rgba(64, 78, 81, .08);
  background: repeating-linear-gradient(180deg, rgba(64, 78, 81, .09) 0 1px, transparent 1px 47px);
}

.nautical-chart__compass {
  top: 4%;
  right: -88px;
  width: 248px;
  height: 248px;
  border-color: rgba(74, 86, 89, .14);
  background: radial-gradient(circle, transparent 0 64%, rgba(74, 86, 89, .075) 64.5% 65%, transparent 65.5%);
  box-shadow: none;
}

.nautical-chart__compass::before,
.nautical-chart__compass::after {
  background: rgba(74, 86, 89, .11);
}

.nautical-chart__compass::before { width: 1px; height: 84%; }
.nautical-chart__compass::after { width: 84%; height: 1px; }

.nautical-chart__compass-center {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  border: 1px solid rgba(169, 130, 69, .15);
  border-radius: 50%;
  background: var(--chart-paper);
  transform: translate(-50%, -50%);
}

.nautical-chart__compass-needle {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  width: 13px;
  height: 82px;
  clip-path: polygon(50% 0, 100% 100%, 50% 82%, 0 100%);
  background: rgba(74, 86, 89, .14);
  transform: translate(-50%, -100%) rotate(18deg);
  transform-origin: 50% 100%;
}

.nautical-chart__compass b {
  position: absolute;
  top: 17px;
  left: 50%;
  color: rgba(169, 130, 69, .15);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .12em;
  transform: translateX(-50%);
}

.nautical-chart__coordinate,
.nautical-chart__depth,
.nautical-chart__bearing {
  color: rgba(58, 72, 75, .06);
}

.nautical-chart__coordinate--east { right: 21%; bottom: 8%; }
.nautical-chart__depth { left: auto; bottom: auto; font-size: .57rem; letter-spacing: .08em; }
.nautical-chart__depth--one { left: 34%; bottom: 23%; }
.nautical-chart__depth--two { left: 19%; bottom: 10%; }
.nautical-chart__depth--three { right: 34%; top: 48%; }
.nautical-chart__depth--four { left: 48%; top: 18%; }
.nautical-chart__depth--five { right: 15%; top: 42%; }
.nautical-chart__depth--six { left: 57%; bottom: 12%; }
.nautical-chart__bearing {
  position: absolute;
  top: 43%;
  left: 60%;
  color: rgba(74, 86, 89, .052);
  font-size: .58rem;
  font-weight: 600;
  letter-spacing: .14em;
  transform: rotate(-14deg);
}

.how-it-works__header {
  position: relative;
  isolation: isolate;
}

.how-it-works__header::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -42px -84px -48px -58px;
  background: radial-gradient(ellipse at 38% 48%, rgba(221, 225, 221, .96) 0%, rgba(221, 225, 221, .9) 48%, rgba(221, 225, 221, .48) 66%, transparent 82%);
  pointer-events: none;
}

.process-step__content {
  position: relative;
  isolation: isolate;
}

.process-step__content::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -22px -28px;
  background: radial-gradient(ellipse, rgba(220, 223, 219, .92) 0%, rgba(220, 223, 219, .72) 56%, transparent 82%);
  pointer-events: none;
}

.process-step__marker {
  position: relative;
  isolation: isolate;
  overflow: visible;
}

.process-step__marker::before,
.process-step__marker::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  background: rgba(74, 86, 89, .085);
  transform: translate(-50%, -50%);
}

.process-step__marker::before { width: 39px; height: 1px; }
.process-step__marker::after { width: 1px; height: 39px; }

.how-it-works__container {
  width: min(1300px, calc(100% - 64px));
  padding: clamp(184px, 14vw, 216px) 0 clamp(106px, 9vw, 128px);
}

.process {
  min-height: 318px;
  margin-top: clamp(66px, 6.5vw, 88px);
}

.process__route {
  position: absolute;
  z-index: 0;
  inset: 0 0 auto;
  width: 100%;
  height: 230px;
  overflow: visible;
  pointer-events: none;
}

.process__route--mobile { display: none; }

.process__route path {
  fill: none;
  vector-effect: non-scaling-stroke;
}

.process__route-base {
  stroke: rgba(93, 108, 118, .23);
  stroke-width: 1;
  stroke-dasharray: 2 7;
  stroke-linecap: round;
}

.process__route-light {
  stroke: #a98245;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-dasharray: 1000;
  stroke-dashoffset: 0;
}

.process__route-hover {
  stroke: #c3a064;
  stroke-width: 3;
  stroke-linecap: round;
  opacity: 0;
  transition: opacity .35s ease;
}

.process__list {
  gap: clamp(52px, 6vw, 104px);
}

.process-step {
  text-align: center;
}

.process-step:nth-child(2) {
  transform: translateY(43px);
}

.process-step::after { content: none; }

.process-step__number {
  color: #a98245;
  font-size: clamp(4rem, 6vw, 5.7rem);
  font-weight: 290;
  letter-spacing: -.07em;
}

.process-step__marker {
  width: 15px;
  height: 15px;
  margin-top: 19px;
  border-color: #a98245;
  background: #c8a66a;
  box-shadow: 0 0 0 6px var(--chart-paper);
}

.process-step__content {
  max-width: 360px;
  margin: 31px auto 0;
  text-align: left;
}

.process-step h3 {
  color: #20242a;
  font-size: clamp(1.3rem, 1.75vw, 1.58rem);
  font-weight: 500;
}

.process-step p {
  max-width: 350px;
  margin: 16px 0 0;
}

.process:has(.process-step:nth-child(1):hover) .process__route-hover--one,
.process:has(.process-step:nth-child(2):hover) .process__route-hover--two,
.process:has(.process-step:nth-child(3):hover) .process__route-hover--three {
  opacity: .62;
}

.process-step:hover .process-step__number { color: #c09a5c; }
.process-step:hover .process-step__marker {
  border-color: #9c7438;
  background: #e0c790;
  box-shadow: 0 0 0 6px var(--chart-paper);
}
.process-step:hover h3 { color: #11161b; }

.how-it-works.is-animation-ready .how-it-works__header,
.how-it-works.is-animation-ready .nautical-chart {
  opacity: 0;
}

.how-it-works.is-animation-ready .process__route-light {
  stroke-dashoffset: 1000;
}

.how-it-works.is-animation-ready .process-step__number {
  color: rgba(169, 130, 69, .48);
}

.how-it-works.is-animation-ready.is-illuminated .how-it-works__header {
  animation: chart-content-reveal .9s ease .05s forwards;
}

.how-it-works.is-animation-ready.is-illuminated .nautical-chart {
  animation: nautical-chart-reveal 1.35s ease .28s forwards;
}

.how-it-works.is-animation-ready.is-illuminated .process__route-light {
  animation: nautical-route-draw 3.85s cubic-bezier(.45, 0, .55, 1) .48s forwards;
}

.how-it-works.is-animation-ready.is-illuminated .process-step__number {
  animation: nautical-number-light .68s ease forwards;
  animation-delay: calc(.7s + var(--step-index) * 1.35s);
}

.how-it-works.is-animation-ready.is-illuminated .process-step__marker {
  animation: nautical-marker-light .72s ease forwards;
  animation-delay: calc(.7s + var(--step-index) * 1.35s);
}

.how-it-works.is-animation-ready.is-illuminated .process-step h3 {
  animation: nautical-title-light .62s ease forwards;
  animation-delay: calc(.7s + var(--step-index) * 1.35s);
}

@keyframes chart-content-reveal {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes nautical-chart-reveal {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes nautical-route-draw {
  0%, 8% { stroke-dashoffset: 1000; }
  21%, 28% { stroke-dashoffset: 960; }
  50%, 59% { stroke-dashoffset: 500; }
  91%, 100% { stroke-dashoffset: 0; }
}

@keyframes nautical-number-light {
  0% { color: rgba(169, 130, 69, .48); }
  58% { color: #d0ad70; }
  100% { color: #a98245; }
}

@keyframes nautical-marker-light {
  0% { border-color: #c6cbd0; background: var(--chart-paper); box-shadow: 0 0 0 6px var(--chart-paper); }
  55% { border-color: #a98245; background: #e2cc9a; box-shadow: 0 0 0 6px var(--chart-paper); }
  100% { border-color: #a98245; background: #c8a66a; box-shadow: 0 0 0 6px var(--chart-paper); }
}

@keyframes nautical-title-light {
  0% { color: #3c444c; }
  58% { color: #0f1419; }
  100% { color: #20242a; }
}

@media (max-width: 820px) {
  .nautical-chart {
    top: 112px;
  }
  .nautical-chart::before {
    background-size: 124px 112px;
    opacity: .52;
  }
  .nautical-chart__contour { opacity: .72; }
  .nautical-chart__contour--four { display: none; }
  .nautical-chart__compass { right: -136px; width: 230px; height: 230px; }
  .nautical-chart__land { left: -38%; bottom: -18%; width: 94%; height: 72%; }
  .nautical-chart__depth-line--one { left: -24%; bottom: -9%; width: 72%; height: 53%; }
  .nautical-chart__depth-line--two { left: -18%; bottom: -4%; width: 78%; height: 59%; }
  .nautical-chart__depth-line--three { left: -12%; bottom: 1%; width: 84%; height: 65%; }
  .nautical-chart__island--three,
  .nautical-chart__planned-leg--two { display: none; }
  .how-it-works__container {
    width: min(100% - 48px, 720px);
    padding: 160px 0 106px;
  }
  .process {
    min-height: 0;
    margin-top: 64px;
  }
  .process__route--desktop { display: none; }
  .process__route--mobile {
    display: block;
    inset: 0 auto 0 0;
    width: 160px;
    height: 100%;
  }
  .process__list { gap: 64px; }
  .process-step,
  .process-step:nth-child(2) {
    min-height: 142px;
    padding-left: 112px;
    transform: none;
    text-align: left;
  }
  .process-step__number {
    top: -7px;
    font-size: 3.65rem;
  }
  .process-step__marker {
    top: 52px;
    left: 73px;
    margin: 0;
  }
  .process-step__content {
    max-width: 550px;
    margin: 0;
  }
  .process-step p { max-width: 540px; }
}

@media (max-width: 560px) {
  .nautical-chart {
    inset: 96px 0 0;
    opacity: .72;
  }
  .nautical-chart::before {
    inset: 8% 3% 4% 7%;
    background-size: 132px 114px;
    opacity: .42;
    -webkit-mask-image: radial-gradient(ellipse at 48% 58%, #000 0%, rgba(0, 0, 0, .58) 46%, transparent 78%);
    mask-image: radial-gradient(ellipse at 48% 58%, #000 0%, rgba(0, 0, 0, .58) 46%, transparent 78%);
  }
  .nautical-chart__coordinate,
  .nautical-chart__depth { opacity: .6; }
  .nautical-chart__contour--three { right: -12%; bottom: 2%; width: 60%; }
  .nautical-chart__coast { inset: 24% 0 0; }
  .nautical-chart__land { left: -58%; bottom: -4%; width: 122%; height: 70%; }
  .nautical-chart__depth-line--one { left: -42%; bottom: 3%; width: 102%; height: 55%; }
  .nautical-chart__depth-line--two { left: -34%; bottom: 8%; width: 108%; height: 61%; }
  .nautical-chart__depth-line--three { left: -26%; bottom: 13%; width: 114%; height: 67%; }
  .nautical-chart__island--one { top: 9%; right: 7%; width: 25%; height: 5.5%; }
  .nautical-chart__island--two,
  .nautical-chart__island--three,
  .nautical-chart__planned-leg,
  .nautical-chart__nav-point--buoy,
  .nautical-chart__coordinate--east,
  .nautical-chart__depth--two,
  .nautical-chart__depth--three,
  .nautical-chart__depth--four,
  .nautical-chart__depth--five,
  .nautical-chart__depth--six,
  .nautical-chart__reef--two,
  .nautical-chart__reef--three,
  .nautical-chart__scale--right,
  .nautical-chart__bearing { display: none; }
  .nautical-chart__scale--top { top: 15%; left: 14%; width: 58%; opacity: .48; }
  .nautical-chart__shore-hatches i:nth-child(n+4) { display: none; }
  .nautical-chart__reef--one { top: 27%; left: 70%; }
  .nautical-chart__nav-point--beacon { top: 38%; left: 20%; }
  .nautical-chart__depth--one { left: 22%; bottom: 18%; }
  .nautical-chart__compass { top: auto; right: -128px; bottom: -72px; width: 214px; height: 214px; }
  .nautical-chart__compass-needle { height: 66px; }
  .how-it-works__header::before { inset: -30px -24px -40px -24px; }
  .process-step__content::before { inset: -18px -14px; }
  .process-step__marker::before { width: 31px; }
  .process-step__marker::after { height: 31px; }
  .how-it-works__container {
    width: calc(100% - 36px);
    padding: 140px 0 90px;
  }
  .process { margin-top: 54px; }
  .process__route--mobile { width: 120px; }
  .process__list { gap: 54px; }
  .process-step,
  .process-step:nth-child(2) {
    min-height: 166px;
    padding-left: 84px;
  }
  .process-step__number { top: -5px; font-size: 3.15rem; }
  .process-step__marker { top: 51px; left: 53px; }
  .process-step__content { padding-top: 1px; }
  .process-step h3 { font-size: 1.24rem; }
}

@media (hover: none) {
  .process__route-hover { opacity: 0 !important; }
  .process-step:hover .process-step__number { color: #a98245; }
  .process-step:hover .process-step__marker {
    border-color: #a98245;
    background: #c8a66a;
    box-shadow: 0 0 0 6px var(--chart-paper);
  }
}

@media (prefers-reduced-motion: reduce) {
  .how-it-works.is-animation-ready .how-it-works__header,
  .how-it-works.is-animation-ready .nautical-chart { opacity: 1; }
  .how-it-works.is-animation-ready .process__route-light {
    stroke-dashoffset: 0;
    animation: none;
  }
  .how-it-works.is-animation-ready .process-step__number { color: #a98245; }
}

/* Delivered nautical chart image */
.how-it-works {
  --chart-paper: #e9e6de;
  background: #e9e6de;
}

.how-it-works::after {
  opacity: .024;
}

.nautical-chart::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("Assets/verity-beacon-analysis-workbench.png");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  opacity: .7;
  filter: none;
}

.how-it-works__header::before {
  background: radial-gradient(ellipse at 38% 48%, rgba(225, 221, 211, .97) 0%, rgba(225, 221, 211, .91) 48%, rgba(225, 221, 211, .5) 66%, transparent 82%);
}

.process-step__content::before {
  background: radial-gradient(ellipse, rgba(223, 219, 210, .93) 0%, rgba(223, 219, 210, .74) 56%, transparent 82%);
}

@media (max-width: 820px) {
  .nautical-chart { opacity: 1; }
  .nautical-chart::before {
    background-position: 40% center;
    opacity: .68;
  }
}

@media (max-width: 560px) {
  .nautical-chart { opacity: 1; }
  .nautical-chart::before {
    background-position: 24% center;
    opacity: .62;
  }
}

/* Analysis workbench scene */
.how-it-works {
  --chart-paper: #0d141a;
  min-height: clamp(880px, 70vw, 1100px);
  color: #f3eee5;
  background: #0b1117;
}

.how-it-works::before {
  z-index: 0;
  height: 150px;
  background: linear-gradient(180deg, #071019 0%, rgba(7, 16, 25, .86) 38%, transparent 100%);
}

.how-it-works::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(5, 11, 17, .62) 0%, rgba(6, 12, 18, .3) 38%, transparent 66%),
    linear-gradient(180deg, rgba(5, 10, 15, .2) 0%, transparent 42%, rgba(5, 10, 15, .42) 100%);
  opacity: 1;
  mix-blend-mode: normal;
  pointer-events: none;
}

.nautical-chart {
  z-index: -2;
  inset: 0;
  background: #0b1117;
}

.nautical-chart::before {
  inset: 0;
  background-image: url("Assets/verity-beacon-analysis-workbench.png");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  opacity: .92;
  filter: brightness(.84) saturate(.9);
  -webkit-mask-image: none;
  mask-image: none;
}

.nautical-chart::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 84% 29%, rgba(255, 220, 154, .46) 0%, rgba(237, 176, 90, .24) 7%, transparent 16%),
    radial-gradient(circle at 84% 29%, rgba(219, 157, 75, .24) 0%, rgba(190, 125, 51, .11) 19%, transparent 39%);
  opacity: .08;
  mix-blend-mode: screen;
  pointer-events: none;
}

.how-it-works__container {
  position: relative;
  z-index: 1;
  width: min(1300px, calc(100% - 64px));
  padding: clamp(168px, 13vw, 206px) 0 clamp(110px, 9vw, 140px);
}

.how-it-works__header {
  max-width: 690px;
}

.how-it-works__header::before {
  inset: -48px -110px -58px -70px;
  background: radial-gradient(ellipse at 34% 46%, rgba(5, 11, 17, .9) 0%, rgba(6, 12, 18, .74) 48%, rgba(6, 12, 18, .3) 66%, transparent 82%);
}

.how-it-works__eyebrow { color: #c29b61; }

.how-it-works h2 {
  max-width: 690px;
  color: #f5f1e9;
  font-size: clamp(2.5rem, 4.1vw, 3.9rem);
  font-weight: 450;
  text-shadow: 0 2px 24px rgba(0, 0, 0, .24);
}

.how-it-works__intro {
  max-width: 650px;
  color: rgba(236, 237, 234, .7);
}

.process {
  min-height: 300px;
  margin-top: clamp(118px, 10vw, 158px);
}

.process__route-base {
  stroke: rgba(152, 164, 166, .28);
  stroke-width: .9;
  stroke-dasharray: 2 8;
}

.process__route-light {
  stroke: #b58a4b;
  stroke-width: 1.45;
}

.process__route-hover {
  stroke: #d2a969;
  stroke-width: 2.4;
  filter: drop-shadow(0 0 4px rgba(190, 139, 66, .24));
}

.process-step__number {
  color: rgba(190, 148, 83, .72);
  font-size: clamp(2.6rem, 4vw, 3.65rem);
  font-weight: 300;
  text-shadow: 0 1px 18px rgba(181, 132, 65, .14);
}

.process-step__marker {
  width: 13px;
  height: 13px;
  margin-top: 18px;
  border-color: #b58a4b;
  background: #161b1d;
  box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #caa86d;
}

.process-step__marker::before,
.process-step__marker::after {
  background: rgba(185, 154, 105, .2);
}

.process-step__marker::before { width: 33px; }
.process-step__marker::after { height: 33px; }

.process-step__content {
  max-width: 340px;
  margin-top: 29px;
}

.process-step__content::before {
  inset: -26px -34px;
  background: radial-gradient(ellipse, rgba(5, 11, 17, .88) 0%, rgba(6, 12, 18, .65) 56%, transparent 84%);
  opacity: .78;
  transition: opacity .35s ease;
}

.process-step h3 {
  color: rgba(247, 243, 235, .88);
  font-size: clamp(1.18rem, 1.55vw, 1.42rem);
  font-weight: 500;
}

.process-step p {
  color: rgba(222, 227, 226, .63);
  font-size: .94rem;
  line-height: 1.7;
}

.process-step:hover .process-step__number { color: #d0aa70; }
.process-step:hover .process-step__marker {
  border-color: #d2a969;
  background: #201d17;
  box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #e0be82, 0 0 12px rgba(190, 139, 66, .2);
}
.process-step:hover .process-step__content::before { opacity: 1; }
.process-step:hover h3 { color: #fffaf0; }

.how-it-works.is-animation-ready .nautical-chart { opacity: 1; }
.how-it-works.is-animation-ready .nautical-chart::before {
  opacity: .82;
  filter: brightness(.78) saturate(.84);
}
.how-it-works.is-animation-ready.is-illuminated .nautical-chart { animation: none; }
.how-it-works.is-animation-ready.is-illuminated .nautical-chart::before {
  animation: workbench-map-reveal 1.65s ease-out .08s forwards;
}
.how-it-works.is-animation-ready.is-illuminated .nautical-chart::after {
  animation: workbench-light-reveal 1.8s ease-out .12s forwards;
}

.how-it-works.is-animation-ready.is-illuminated .process__route-light {
  animation: nautical-route-draw 3.2s cubic-bezier(.45, 0, .55, 1) .28s forwards;
}

.how-it-works.is-animation-ready.is-illuminated .process-step__number,
.how-it-works.is-animation-ready.is-illuminated .process-step__marker,
.how-it-works.is-animation-ready.is-illuminated .process-step h3 {
  animation-delay: calc(.38s + var(--step-index) * 1.05s);
}

@keyframes workbench-map-reveal {
  from { opacity: .82; filter: brightness(.78) saturate(.84); }
  to { opacity: .94; filter: brightness(.92) saturate(.94); }
}

@keyframes workbench-light-reveal {
  from { opacity: .08; }
  to { opacity: .32; }
}

@keyframes nautical-number-light {
  0% { color: rgba(190, 148, 83, .42); }
  58% { color: #e0bb7d; }
  100% { color: #c39a5e; }
}

@keyframes nautical-marker-light {
  0% { border-color: rgba(164, 137, 95, .45); background: #151a1d; box-shadow: 0 0 0 5px rgba(13, 20, 26, .82); }
  55% { border-color: #d4ab6c; background: #2a2218; box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #e1bd7e; }
  100% { border-color: #b58a4b; background: #18191a; box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #caa86d; }
}

@keyframes nautical-title-light {
  0% { color: rgba(222, 224, 220, .5); }
  58% { color: #fffaf0; }
  100% { color: rgba(247, 243, 235, .9); }
}

@media (max-width: 820px) {
  .how-it-works { min-height: 1220px; }
  .how-it-works::before { height: 126px; }
  .how-it-works__container {
    width: min(100% - 48px, 720px);
    padding: 142px 0 100px;
  }
  .how-it-works__header { max-width: 620px; }
  .how-it-works h2 { font-size: clamp(2.35rem, 7vw, 3.25rem); }
  .nautical-chart { inset: 0; }
  .nautical-chart::before {
    inset: 0;
    background-image:
      linear-gradient(180deg, #0b1117 0%, rgba(11, 17, 23, .96) 24%, transparent 46%),
      url("Assets/verity-beacon-analysis-workbench.png");
    background-size: 100% 100%, auto 76%;
    background-position: center, 62% 100%;
    background-repeat: no-repeat;
    opacity: .92;
    filter: brightness(.86) saturate(.9);
  }
  .nautical-chart::after {
    background: radial-gradient(circle at 76% 55%, rgba(219, 157, 75, .18) 0%, rgba(190, 125, 51, .06) 18%, transparent 35%);
  }
  .process { margin-top: 142px; }
  .process-step__number { font-size: 2.65rem; }
  .process-step__content::before { inset: -22px -24px; }
}

@media (max-width: 560px) {
  .how-it-works { min-height: 1420px; }
  .how-it-works::before { height: 108px; }
  .how-it-works__container {
    width: calc(100% - 36px);
    padding: 126px 0 88px;
  }
  .how-it-works__header::before { inset: -30px -24px -40px; }
  .how-it-works h2 { font-size: clamp(2.12rem, 10.4vw, 2.72rem); }
  .how-it-works__intro { color: rgba(236, 237, 234, .68); }
  .nautical-chart::before {
    background-image:
      linear-gradient(180deg, #0b1117 0%, rgba(11, 17, 23, .98) 29%, transparent 51%),
      url("Assets/verity-beacon-analysis-workbench.png");
    background-size: 100% 100%, auto 68%;
    background-position: center, 64% 100%;
    opacity: .94;
  }
  .nautical-chart::after {
    background: radial-gradient(circle at 70% 62%, rgba(219, 157, 75, .17) 0%, rgba(190, 125, 51, .05) 17%, transparent 34%);
  }
  .process { margin-top: 172px; }
  .process-step,
  .process-step:nth-child(2) {
    min-height: 172px;
    padding-left: 82px;
  }
  .process-step__number { top: -3px; font-size: 2.35rem; }
  .process-step__marker { top: 49px; left: 52px; }
  .process-step h3 { font-size: 1.18rem; }
  .process-step p { font-size: .92rem; line-height: 1.64; }
}

@media (hover: none) {
  .process-step:hover .process-step__number { color: #c39a5e; }
  .process-step:hover .process-step__marker {
    border-color: #b58a4b;
    background: #18191a;
    box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #caa86d;
  }
  .process-step:hover h3 { color: rgba(247, 243, 235, .9); }
}

@media (prefers-reduced-motion: reduce) {
  .nautical-chart::before,
  .how-it-works.is-animation-ready .nautical-chart::before {
    opacity: .94;
    filter: brightness(.9) saturate(.92);
    animation: none;
  }
  .nautical-chart::after,
  .how-it-works.is-animation-ready .nautical-chart::after {
    opacity: .2;
    animation: none;
  }
  .how-it-works.is-animation-ready .process-step h3 { color: rgba(247, 243, 235, .9); }
  .how-it-works.is-animation-ready .process-step__marker {
    border-color: #b58a4b;
    background: #18191a;
    box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #caa86d;
  }
}

/* Final micro-interaction authority for the approved workbench scene */
.process-step {
  isolation: isolate;
}

.process-step::after {
  content: "";
  z-index: -1;
  top: 20px;
  left: 50%;
  right: auto;
  width: 190px;
  height: 150px;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(194, 143, 70, .15) 0%, rgba(151, 166, 164, .055) 42%, transparent 74%);
  opacity: 0;
  transform: translateX(-50%);
  transition: opacity .55s cubic-bezier(.42, 0, .58, 1);
}

.how-it-works.is-animation-ready.is-illuminated .process-step::after {
  animation: vb-stage-map-halo .72s cubic-bezier(.42, 0, .58, 1) forwards;
  animation-delay: var(--arrival-delay);
}

.how-it-works.is-animation-ready.is-illuminated .process-step__number {
  animation: vb-number-light .76s cubic-bezier(.42, 0, .58, 1) forwards;
  animation-delay: calc(.38s + var(--step-index) * 1.05s);
}

.how-it-works.is-animation-ready.is-illuminated .process-step__marker {
  animation:
    vb-marker-light .46s cubic-bezier(.42, 0, .58, 1) calc(.38s + var(--step-index) * 1.05s) forwards,
    vb-arrival-marker .46s cubic-bezier(.42, 0, .58, 1) var(--arrival-delay) both;
}

.how-it-works.is-animation-ready.is-illuminated .process-step h3 {
  animation: vb-title-light .76s cubic-bezier(.42, 0, .58, 1) forwards;
  animation-delay: calc(.38s + var(--step-index) * 1.05s);
}

.how-it-works.is-animation-ready.is-illuminated .nautical-chart::after {
  transform-origin: 84% 29%;
  animation:
    workbench-light-reveal 1.8s ease-out .12s forwards,
    vb-lantern-breathe 4.6s linear 1.92s infinite;
}

.process-step:nth-child(3)::after {
  width: 205px;
  height: 162px;
}

.process-step:hover::after { opacity: .16; }
.process-step:hover .process-step__number { color: #d8b47a; }
.process-step:hover .process-step__marker {
  border-color: #d8ae6e;
  background: #242018;
  box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #e4c385, 0 0 15px rgba(196, 145, 69, .24);
}
.process-step:hover .process-step__content::before { opacity: .9; }
.process-step:hover h3 { color: #fffaf1; }

@keyframes vb-stage-map-halo {
  0% { opacity: 0; filter: brightness(1); }
  34% { opacity: .27; filter: brightness(1.035); }
  58% { opacity: .16; filter: brightness(1.018); }
  100% { opacity: .045; filter: brightness(1); }
}

@keyframes vb-number-light {
  0% { color: rgba(190, 148, 83, .52); text-shadow: 0 1px 18px rgba(181, 132, 65, .1); }
  55% { color: #edcb91; text-shadow: 0 0 22px rgba(211, 164, 93, .26); }
  100% { color: #d1aa6d; text-shadow: 0 1px 18px rgba(181, 132, 65, .17); }
}

@keyframes vb-marker-light {
  0% { border-color: rgba(181, 138, 75, .55); background: #161b1d; box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px rgba(202, 168, 109, .62); }
  43% { border-color: #e4bd7d; background: #2d2519; box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #f0d198, 0 0 20px rgba(205, 153, 77, .34); }
  72% { border-color: #d1a561; background: #211e18; box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #ddba7b, 0 0 13px rgba(198, 145, 68, .2); }
  100% { border-color: #c49a59; background: #1b1b18; box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #d2ae70, 0 0 10px rgba(190, 139, 66, .14); }
}

@keyframes vb-arrival-marker {
  0% { filter: drop-shadow(0 0 0 rgba(211, 161, 84, 0)); }
  42% { filter: drop-shadow(0 0 11px rgba(211, 161, 84, var(--arrival-bloom-alpha))); }
  100% { filter: drop-shadow(0 0 0 rgba(211, 161, 84, 0)); }
}

@keyframes vb-title-light {
  0% { color: rgba(222, 224, 220, .58); text-shadow: none; }
  55% { color: #fffaf0; text-shadow: 0 0 18px rgba(222, 180, 112, .11); }
  100% { color: rgba(252, 248, 239, .94); text-shadow: 0 0 14px rgba(211, 169, 99, .06); }
}

@keyframes vb-lantern-breathe {
  0% { opacity: .32; transform: scale(1); filter: brightness(1); }
  12% { opacity: .202; transform: scale(.933); filter: brightness(.765); }
  29% { opacity: .387; transform: scale(1.04); filter: brightness(1.135); }
  43% { opacity: .253; transform: scale(.966); filter: brightness(.9); }
  61% { opacity: .488; transform: scale(1.094); filter: brightness(1.336); }
  75% { opacity: .27; transform: scale(.95); filter: brightness(.933); }
  90% { opacity: .421; transform: scale(1.054); filter: brightness(1.185); }
  100% { opacity: .32; transform: scale(1); filter: brightness(1); }
}

@media (max-width: 820px) {
  .process-step::after {
    top: -18px;
    left: 58px;
    width: 150px;
    height: 132px;
  }
  .process-step:nth-child(3)::after {
    width: 162px;
    height: 142px;
  }
}

@media (hover: none) {
  .process-step:hover::after { opacity: .055; }
  .process-step:hover .process-step__number { color: #d1aa6d; }
  .process-step:hover .process-step__marker {
    border-color: #c49a59;
    background: #1b1b18;
    box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #d2ae70;
  }
  .process-step:hover h3 { color: rgba(252, 248, 239, .94); }
}

@media (prefers-reduced-motion: reduce) {
  .process__route-point { display: none; }
  .process__route-extension { stroke-dashoffset: 0 !important; animation: none !important; }
  .process-step::after { opacity: 0; animation: none !important; }
  .how-it-works.is-illuminated .nautical-chart::after,
  .how-it-works.is-animation-ready.is-illuminated .nautical-chart::after { opacity: .2; animation: none !important; }
  .how-it-works.is-illuminated .process-step__number,
  .how-it-works.is-animation-ready.is-illuminated .process-step__number { color: #d1aa6d; animation: none !important; }
  .how-it-works.is-illuminated .process-step__marker,
  .how-it-works.is-animation-ready.is-illuminated .process-step__marker {
    border-color: #c49a59;
    background: #1b1b18;
    box-shadow: 0 0 0 5px rgba(13, 20, 26, .82), inset 0 0 0 3px #d2ae70;
    animation: none !important;
  }
  .how-it-works.is-illuminated .process-step h3,
  .how-it-works.is-animation-ready.is-illuminated .process-step h3 { color: rgba(252, 248, 239, .94); animation: none !important; }
}

/* Why Verity Beacon */
.why-verity {
  position: relative;
  isolation: isolate;
  min-height: 1080px;
  overflow: hidden;
  background: #121a22;
  color: #f4f1ea;
  --reveal-x: 68%;
  --reveal-y: 48%;
  --closing-progress: .42;
}

.why-verity::before {
  content: "";
  position: absolute;
  z-index: 3;
  inset: 0 0 auto;
  height: 120px;
  background: linear-gradient(180deg, #071019 0%, rgba(11, 17, 23, .72) 40%, transparent 100%);
  pointer-events: none;
}

.why-verity__technical,
.why-verity__base-layer,
.why-verity__reveal-layer,
.why-verity__technical-shade {
  position: absolute;
  inset: 0;
}

.why-verity__technical {
  z-index: 0;
  overflow: hidden;
  background: #111a22;
  --blueprint-size: 100% auto;
  --blueprint-position: center 54%;
  pointer-events: none;
}

.why-verity__base-layer,
.why-verity__reveal-layer {
  background-size: var(--blueprint-size);
  background-position: var(--blueprint-position);
  background-repeat: no-repeat;
  transform: translateZ(0);
}

.why-verity__base-layer {
  background-image: url("Assets/why-verity-blueprint-base.png");
  opacity: .84;
  filter: brightness(.94) contrast(.98);
}

.why-verity__reveal-layer {
  background-image: url("Assets/why-verity-blueprint-reveal.png");
  opacity: 1;
  filter: brightness(1.07) contrast(1.04);
  -webkit-mask-image: radial-gradient(ellipse clamp(180px, 13.5vw, 260px) clamp(150px, 11.5vw, 220px) at var(--reveal-x) var(--reveal-y), #000 0%, rgba(0, 0, 0, .98) 30%, rgba(0, 0, 0, .82) 50%, rgba(0, 0, 0, .42) 67%, transparent 82%);
  mask-image: radial-gradient(ellipse clamp(180px, 13.5vw, 260px) clamp(150px, 11.5vw, 220px) at var(--reveal-x) var(--reveal-y), #000 0%, rgba(0, 0, 0, .98) 30%, rgba(0, 0, 0, .82) 50%, rgba(0, 0, 0, .42) 67%, transparent 82%);
}

.why-verity__technical::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 310px 245px at var(--reveal-x) var(--reveal-y), rgba(221, 224, 218, .065) 0%, rgba(169, 130, 69, .035) 43%, transparent 75%);
  mix-blend-mode: screen;
}

.why-verity__technical-shade {
  background:
    radial-gradient(ellipse at 25% 26%, rgba(13, 20, 27, .38) 0%, rgba(13, 20, 27, .76) 48%, transparent 75%),
    linear-gradient(180deg, rgba(12, 19, 26, .12) 0%, rgba(12, 19, 26, .08) 52%, rgba(8, 14, 19, .64) 100%),
    linear-gradient(90deg, rgba(9, 15, 21, .44) 0%, transparent 48%, rgba(8, 14, 20, .18) 100%);
}

.why-verity__container {
  position: relative;
  z-index: 2;
  width: min(1300px, calc(100% - 64px));
  margin: 0 auto;
  padding: clamp(154px, 12vw, 188px) 0 118px;
}

.why-verity__header {
  max-width: 850px;
}

.why-verity__eyebrow {
  margin: 0 0 22px;
  color: #bd965a;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .19em;
}

.why-verity h2 {
  max-width: 840px;
  margin: 0;
  color: #f5f1e9;
  font-size: clamp(2.55rem, 4.2vw, 4rem);
  font-weight: 450;
  line-height: 1.07;
  letter-spacing: -.04em;
  text-wrap: balance;
}

.why-verity__intro {
  max-width: 720px;
  margin: 44px 0 0;
  color: rgba(225, 229, 228, .69);
  font-size: clamp(1rem, 1.25vw, 1.12rem);
  line-height: 1.75;
}

.why-verity__themes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(54px, 6vw, 96px);
  margin-top: clamp(132px, 11vw, 168px);
}

.why-theme {
  position: relative;
  min-width: 0;
  padding-top: 30px;
}

.why-theme::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background: linear-gradient(90deg, rgba(165, 177, 182, .36), rgba(165, 177, 182, .09) 70%, transparent);
  transition: background .55s ease;
}

.why-theme__signal {
  position: absolute;
  top: -3px;
  left: 0;
  width: 7px;
  height: 7px;
  border: 1px solid rgba(169, 130, 69, .72);
  border-radius: 50%;
  background: #141c23;
  box-shadow: 0 0 0 4px rgba(18, 26, 34, .88);
  transition: border-color .45s ease, background-color .45s ease, box-shadow .45s ease;
}

.why-theme__signal span {
  position: absolute;
  top: 2px;
  left: 12px;
  width: 28px;
  height: 1px;
  background: rgba(169, 130, 69, .38);
  transition: width .55s ease, background-color .45s ease;
}

.why-theme__number {
  margin: 0 0 18px;
  color: rgba(184, 146, 87, .67);
  font-size: .74rem;
  font-weight: 650;
  letter-spacing: .16em;
}

.why-theme h3 {
  margin: 0;
  color: rgba(246, 243, 236, .88);
  font-size: clamp(1.22rem, 1.55vw, 1.48rem);
  font-weight: 500;
  line-height: 1.28;
  letter-spacing: -.018em;
  transition: color .45s ease, text-shadow .45s ease;
}

.why-theme > p:last-child {
  max-width: 355px;
  margin: 18px 0 0;
  color: rgba(211, 218, 218, .63);
  font-size: .95rem;
  line-height: 1.72;
}

.why-theme:hover::before,
.why-theme.is-mobile-active::before {
  background: linear-gradient(90deg, rgba(192, 150, 84, .76), rgba(165, 177, 182, .16) 72%, transparent);
}

.why-theme:hover .why-theme__signal,
.why-theme.is-mobile-active .why-theme__signal {
  border-color: #d2aa6b;
  background: #b58a4b;
  box-shadow: 0 0 0 4px rgba(18, 26, 34, .88), 0 0 13px rgba(185, 137, 65, .2);
}

.why-theme:hover .why-theme__signal span,
.why-theme.is-mobile-active .why-theme__signal span {
  width: 42px;
  background: rgba(204, 161, 94, .7);
}

.why-theme:hover h3,
.why-theme.is-mobile-active h3 {
  color: #fffaf0;
  text-shadow: 0 0 16px rgba(210, 168, 100, .08);
}

.why-verity__closing {
  position: relative;
  z-index: 0;
  margin-top: clamp(128px, 10vw, 164px);
  padding: clamp(72px, 6vw, 96px) 0 clamp(54px, 4vw, 72px);
}

.why-verity__closing::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: -96px;
  bottom: -118px;
  left: 50%;
  width: 100vw;
  background: linear-gradient(180deg, transparent 0%, rgba(8, 14, 19, .52) 32%, rgba(8, 14, 19, .9) 76%, #081017 100%);
  opacity: var(--closing-progress);
  transform: translateX(-50%);
  pointer-events: none;
}

.why-verity__statement {
  position: relative;
  z-index: 1;
  max-width: 900px;
  margin: 0;
  padding: 0;
  color: rgba(239, 237, 231, .72);
  font-size: clamp(1.78rem, 2.35vw, 2.35rem);
  font-weight: 390;
  line-height: 1.48;
  letter-spacing: -.022em;
  text-align: left;
}

.why-verity__statement-label {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 22px;
  color: rgba(194, 153, 91, .78);
  font-family: var(--font-mono);
  font-size: .66rem;
  font-weight: 650;
  line-height: 1;
  letter-spacing: .18em;
}

.why-verity__statement-label::before {
  content: "";
  width: 44px;
  height: 3px;
  flex: 0 0 44px;
  background:
    radial-gradient(circle at 1.5px 1.5px, #c89a54 0 1.5px, transparent 1.8px),
    linear-gradient(90deg, transparent 0 8px, rgba(190, 145, 75, .84) 8px 100%) center / 100% 1px no-repeat;
  transform-origin: left center;
}

.why-verity__statement p { margin: 0; }
.why-verity__statement p span { color: rgba(239, 237, 231, .92); }

.why-verity.is-animation-ready .why-verity__header,
.why-verity.is-animation-ready .why-theme {
  opacity: 0;
  transform: translateY(14px);
}

.why-verity.is-animation-ready .why-verity__reveal-layer { opacity: 0; }

.why-verity.is-animation-ready.is-visible .why-verity__header {
  animation: why-content-arrive .9s cubic-bezier(.22, 1, .36, 1) .12s forwards;
}

.why-verity.is-animation-ready.is-visible .why-verity__reveal-layer {
  animation: why-reveal-arrive 1.9s cubic-bezier(.22, 1, .36, 1) .48s forwards;
}

.why-verity.is-animation-ready.is-visible .why-theme {
  animation: why-content-arrive .82s cubic-bezier(.22, 1, .36, 1) forwards;
  animation-delay: calc(.88s + var(--theme-index) * .22s);
}

.why-verity.is-animation-ready .why-verity__closing:not(.is-principle-visible) .why-verity__statement-label::before {
  opacity: 0;
  transform: scaleX(.18);
}

.why-verity.is-animation-ready .why-verity__closing:not(.is-principle-visible) .why-verity__statement-label,
.why-verity.is-animation-ready .why-verity__closing:not(.is-principle-visible) .why-verity__statement p {
  opacity: 0;
  transform: translateY(10px);
}

.why-verity__statement-label::before {
  transition: opacity .42s ease-out, transform .42s ease-out;
}

.why-verity__statement-label {
  transition: opacity .56s ease-out .06s, transform .56s cubic-bezier(.22, 1, .36, 1) .06s;
}

.why-verity__statement p {
  transition: opacity .72s ease-out .14s, transform .72s cubic-bezier(.22, 1, .36, 1) .14s;
}

@keyframes why-content-arrive {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes why-reveal-arrive {
  0% { opacity: 0; filter: brightness(.78); }
  55% { opacity: .96; filter: brightness(1.08); }
  100% { opacity: .9; filter: brightness(1); }
}

@media (max-width: 820px) {
  .why-verity { min-height: 1380px; }
  .why-verity::before { height: 94px; }
  .why-verity__container {
    width: min(100% - 48px, 720px);
    padding: 128px 0 96px;
  }
  .why-verity h2 { font-size: clamp(2.3rem, 7vw, 3.25rem); }
  .why-verity__themes {
    grid-template-columns: 1fr;
    gap: 62px;
    margin-top: 104px;
  }
  .why-theme { max-width: 590px; }
  .why-theme > p:last-child { max-width: 540px; }
  .why-verity__closing {
    max-width: 620px;
    margin-top: 112px;
    padding-top: 70px;
  }
  .why-verity__technical {
    --blueprint-size: auto 36%;
    --blueprint-position: center 58%;
  }
  .why-verity__reveal-layer {
    -webkit-mask-image: radial-gradient(ellipse 210px 190px at var(--reveal-x) var(--reveal-y), #000 0%, rgba(0, 0, 0, .92) 34%, rgba(0, 0, 0, .62) 52%, transparent 80%);
    mask-image: radial-gradient(ellipse 210px 190px at var(--reveal-x) var(--reveal-y), #000 0%, rgba(0, 0, 0, .92) 34%, rgba(0, 0, 0, .62) 52%, transparent 80%);
  }
}

@media (max-width: 560px) {
  .why-verity { min-height: 1580px; }
  .why-verity__container {
    width: calc(100% - 36px);
    padding: 112px 0 82px;
  }
  .why-verity h2 { font-size: clamp(2.08rem, 10.2vw, 2.7rem); }
  .why-verity__intro { margin-top: 34px; font-size: .98rem; line-height: 1.68; }
  .why-verity__themes { margin-top: 92px; gap: 58px; }
  .why-theme { padding-top: 27px; }
  .why-theme h3 { font-size: 1.22rem; }
  .why-theme > p:last-child { font-size: .92rem; line-height: 1.66; }
  .why-verity__statement {
    font-size: clamp(1.5rem, 6.8vw, 1.82rem);
    line-height: 1.5;
  }
  .why-verity__closing { margin-top: 100px; padding: 66px 0 42px; }
  .why-verity__closing::before { top: -70px; bottom: -82px; }
  .why-verity__statement-label { margin-bottom: 18px; }
}

@media (hover: none) {
  .why-theme:hover::before { background: linear-gradient(90deg, rgba(165, 177, 182, .36), rgba(165, 177, 182, .09) 70%, transparent); }
  .why-theme:hover .why-theme__signal {
    border-color: rgba(169, 130, 69, .72);
    background: #141c23;
    box-shadow: 0 0 0 4px rgba(18, 26, 34, .88);
  }
  .why-theme:hover .why-theme__signal span { width: 28px; background: rgba(169, 130, 69, .38); }
  .why-theme:hover h3 { color: rgba(246, 243, 236, .88); text-shadow: none; }
}

@media (prefers-reduced-motion: reduce) {
  .why-verity,
  .why-verity__technical,
  .why-verity__reveal-layer { --reveal-x: 68%; --reveal-y: 48%; }
  .why-verity.is-animation-ready .why-verity__header,
  .why-verity.is-animation-ready .why-theme,
  .why-verity.is-animation-ready .why-verity__reveal-layer {
    opacity: 1;
    transform: none;
    animation: none;
  }
  .why-verity.is-animation-ready .why-verity__statement p,
  .why-verity.is-animation-ready .why-verity__statement-label::before,
  .why-verity.is-animation-ready .why-verity__statement-label {
    opacity: 1;
    transform: none;
    animation: none;
  }
  .why-verity__closing::before { opacity: .82; }
  .why-verity__reveal-layer { opacity: .3 !important; }
}

/* Services — analysis desk */
.services {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 1180px;
  background: #090f14;
  color: #f4f1ea;
}

.services::before {
  content: "";
  position: absolute;
  z-index: 3;
  inset: 0 0 auto;
  height: 150px;
  background: linear-gradient(180deg, #081017 0%, rgba(8, 16, 23, .84) 38%, transparent 100%);
  pointer-events: none;
}

.services__desk {
  position: absolute;
  z-index: 0;
  inset: 0;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 50% 34%, rgba(99, 79, 54, .105) 0%, transparent 43%),
    linear-gradient(115deg, transparent 0 27%, rgba(135, 149, 151, .025) 27.15% 27.25%, transparent 27.4% 67%, rgba(135, 149, 151, .018) 67.15% 67.25%, transparent 67.4%),
    repeating-linear-gradient(0deg, rgba(173, 180, 176, .018) 0 1px, transparent 1px 54px),
    repeating-linear-gradient(90deg, rgba(173, 180, 176, .015) 0 1px, transparent 1px 54px),
    linear-gradient(180deg, #101820 0%, #0b131a 48%, #080f14 100%);
}

.services__desk::before,
.services__desk::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.services__desk::before {
  opacity: .56;
  background:
    repeating-linear-gradient(13deg, rgba(223, 219, 204, .014) 0 1px, transparent 1px 4px),
    repeating-linear-gradient(97deg, transparent 0 118px, rgba(206, 213, 208, .025) 119px 120px, transparent 121px 246px),
    repeating-linear-gradient(177deg, transparent 0 72px, rgba(44, 28, 18, .07) 73px 74px, transparent 75px 156px);
  mix-blend-mode: screen;
}

.services__desk::after {
  background:
    linear-gradient(90deg, rgba(3, 7, 10, .64), transparent 18%, transparent 82%, rgba(3, 7, 10, .64)),
    linear-gradient(180deg, transparent 58%, rgba(2, 6, 9, .58) 100%);
}

.services__drafting-details {
  position: absolute;
  z-index: 1;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.services__drafting-sheet {
  position: absolute;
  top: 48%;
  left: -15%;
  width: 48%;
  height: 38%;
  opacity: .115;
  border: 1px solid rgba(153, 170, 172, .24);
  background:
    linear-gradient(90deg, rgba(8, 15, 20, .2), transparent 28%),
    url("Assets/why-verity-blueprint-reveal.png") 47% 42% / auto 112% no-repeat,
    #101920;
  box-shadow: 18px 22px 46px rgba(0, 0, 0, .22);
  transform: rotate(-2.4deg);
}

.services__drafting-ruler {
  position: absolute;
  right: -21%;
  bottom: 5.5%;
  width: 27%;
  height: 34px;
  opacity: .32;
  border: 1px solid rgba(157, 169, 170, .2);
  background:
    repeating-linear-gradient(90deg, transparent 0 11px, rgba(188, 196, 193, .32) 11px 12px, transparent 12px 22px) top / 100% 10px no-repeat,
    repeating-linear-gradient(90deg, transparent 0 54px, rgba(210, 214, 207, .42) 54px 55px) top / 100% 17px no-repeat,
    linear-gradient(180deg, #343c40 0%, #20282d 47%, #11191f 100%);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .3), inset 0 1px rgba(231, 230, 217, .07);
  transform: rotate(-1.2deg);
}

.services__drafting-mark {
  position: absolute;
  color: rgba(160, 176, 178, .16);
  font-family: var(--font-mono);
  font-size: .55rem;
  letter-spacing: .18em;
}

.services__drafting-mark::before,
.services__drafting-mark::after {
  content: "";
  position: absolute;
  background: rgba(160, 176, 178, .18);
}

.services__drafting-mark::before { top: -16px; left: -18px; width: 34px; height: 1px; }
.services__drafting-mark::after { top: -32px; left: -2px; width: 1px; height: 34px; }
.services__drafting-mark--a { top: 37%; right: 3.5%; }
.services__drafting-mark--b { bottom: 18%; left: 3%; }

.services__container {
  position: relative;
  z-index: 2;
  width: min(1400px, calc(100% - 64px));
  margin: 0 auto;
  padding: clamp(150px, 11vw, 188px) 0 150px;
}

.services__header { max-width: 900px; }

.services__eyebrow {
  margin: 0 0 30px;
  color: #c7964c;
  font-size: .76rem;
  font-weight: 680;
  letter-spacing: .17em;
}

.services h2 {
  max-width: 870px;
  margin: 0;
  color: #f6f2e9;
  font-size: clamp(2.6rem, 4.7vw, 4.75rem);
  font-weight: 380;
  line-height: 1.07;
  letter-spacing: -.046em;
}

.services__header > p:last-child {
  max-width: 680px;
  margin: 34px 0 0;
  color: rgba(218, 224, 223, .7);
  font-size: 1.02rem;
  line-height: 1.75;
}

.services__scale {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: min(900px, 72%);
  margin: 104px auto 0;
  padding-top: 23px;
}

.services__scale-track {
  position: absolute;
  top: 27px;
  right: 16.666%;
  left: 16.666%;
  height: 1px;
  overflow: hidden;
  background: rgba(155, 169, 171, .25);
}

.services__scale-track::after {
  content: "";
  position: absolute;
  inset: -4px 0;
  background: repeating-linear-gradient(90deg, transparent 0 21px, rgba(173, 185, 185, .2) 21px 22px);
}

.services__scale-track span {
  position: absolute;
  z-index: 1;
  inset: 0 auto 0 0;
  width: 0;
  background: linear-gradient(90deg, #9f753b, #c69a58);
  box-shadow: 0 0 10px rgba(188, 140, 70, .16);
  transition: width .44s cubic-bezier(.22, 1, .36, 1);
}

.services[data-active-level="1"] .services__scale-track span { width: 0; }
.services[data-active-level="2"] .services__scale-track span { width: 50%; }
.services[data-active-level="3"] .services__scale-track span { width: 100%; }

.services__scale-node {
  position: relative;
  z-index: 2;
  display: grid;
  justify-items: center;
  gap: 18px;
  color: rgba(166, 177, 179, .46);
  text-align: center;
  transition: color .4s ease, text-shadow .4s ease;
}

.services__scale-node::before {
  content: "";
  width: 8px;
  height: 8px;
  border: 1px solid rgba(166, 177, 179, .42);
  border-radius: 50%;
  background: #101820;
  box-shadow: 0 0 0 5px rgba(10, 17, 23, .9);
  transition: border-color .4s ease, background-color .4s ease, box-shadow .4s ease;
}

.services__scale-node span {
  position: absolute;
  top: -22px;
  color: rgba(166, 177, 179, .34);
  font-family: var(--font-mono);
  font-size: .58rem;
  letter-spacing: .14em;
}

.services__scale-node strong {
  font-size: .7rem;
  font-weight: 650;
  letter-spacing: .16em;
}

.services[data-active-level="1"] .services__scale-node[data-level="1"],
.services[data-active-level="2"] .services__scale-node[data-level="1"],
.services[data-active-level="2"] .services__scale-node[data-level="2"],
.services[data-active-level="3"] .services__scale-node {
  color: rgba(219, 179, 113, .9);
  text-shadow: 0 0 12px rgba(190, 143, 70, .14);
}

.services[data-active-level="1"] .services__scale-node[data-level="1"]::before,
.services[data-active-level="2"] .services__scale-node[data-level="1"]::before,
.services[data-active-level="2"] .services__scale-node[data-level="2"]::before,
.services[data-active-level="3"] .services__scale-node::before {
  border-color: #c69a58;
  background: #b48645;
  box-shadow: 0 0 0 5px rgba(10, 17, 23, .9), 0 0 13px rgba(190, 142, 69, .2);
}

.services__dossiers {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: start;
  gap: clamp(14px, 1.8vw, 28px);
  margin-top: 76px;
  padding: 0 6px;
}

.services__dossiers::before,
.services__dossiers::after {
  content: "DATUM B-07  /  SCALE 1:10";
  content: "";
  position: absolute;
  z-index: 0;
  border: 1px solid rgba(137, 153, 156, .13);
  background:
    linear-gradient(rgba(154, 171, 173, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(154, 171, 173, .03) 1px, transparent 1px),
    repeating-linear-gradient(167deg, transparent 0 46px, rgba(177, 190, 190, .055) 47px 48px, transparent 49px 94px),
    #101920;
  background-size: 30px 30px, 30px 30px, 100% 100%, 100% 100%;
  box-shadow: 8px 12px 28px rgba(0, 0, 0, .16);
  pointer-events: none;
}

.services__dossiers::before {
  top: 36px;
  bottom: 2%;
  left: -34px;
  width: 43%;
  transform: rotate(-1.8deg);
}

.services__dossiers::after {
  top: 58px;
  right: -30px;
  width: 35%;
  height: 76%;
  padding: 15px 18px;
  color: rgba(157, 174, 176, .17);
  font-family: var(--font-mono);
  font-size: .56rem;
  letter-spacing: .15em;
  transform: rotate(1.6deg);
}

.service-dossier {
  position: relative;
  z-index: 1;
  min-height: 760px;
  outline: none;
  color: rgba(225, 226, 220, .82);
  background:
    linear-gradient(rgba(168, 178, 178, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(168, 178, 178, .02) 1px, transparent 1px),
    linear-gradient(153deg, rgba(38, 49, 57, .96), rgba(19, 28, 35, .98) 54%, rgba(15, 23, 29, .99));
  background-size: 36px 36px, 36px 36px, 100% 100%;
  border: 1px solid rgba(151, 165, 167, .19);
  box-shadow: 0 26px 56px rgba(0, 0, 0, .22);
  transition: border-color .42s ease, box-shadow .42s ease;
}

.service-dossier:nth-child(1) { margin-top: 24px; }
.service-dossier:nth-child(2) { margin-top: 8px; }

.service-dossier__paper-edge {
  position: absolute;
  z-index: -1;
  inset: 9px -5px -7px 7px;
  border: 1px solid rgba(144, 158, 160, .11);
  background: #101820;
  box-shadow: 6px 8px 18px rgba(0, 0, 0, .16);
}

.service-dossier:nth-child(1) .service-dossier__paper-edge { transform: rotate(-.42deg); }
.service-dossier:nth-child(2) .service-dossier__paper-edge { transform: rotate(.32deg); }
.service-dossier:nth-child(3) .service-dossier__paper-edge { transform: rotate(-.16deg); }

.service-dossier__illumination {
  position: absolute;
  z-index: 0;
  inset: 0;
  opacity: 0;
  background:
    radial-gradient(ellipse at 54% 20%, rgba(215, 177, 117, .12) 0%, rgba(169, 126, 65, .05) 34%, transparent 68%),
    linear-gradient(180deg, rgba(232, 224, 203, .035), transparent 48%);
  mix-blend-mode: normal;
  transition: opacity .44s ease;
  pointer-events: none;
}

.service-dossier__content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-height: 760px;
  padding: clamp(34px, 3vw, 46px) clamp(28px, 2.7vw, 42px) 34px;
}

.service-dossier__header {
  position: relative;
  min-height: 142px;
  padding-bottom: 27px;
  border-bottom: 1px solid rgba(153, 168, 169, .18);
}

.service-dossier__index {
  margin: 0 0 26px;
  color: rgba(161, 174, 176, .48);
  font-family: var(--font-mono);
  font-size: .62rem;
  letter-spacing: .14em;
}

.service-dossier__index span { color: rgba(199, 153, 83, .86); }

.service-dossier h3 {
  margin: 0;
  color: rgba(250, 246, 237, .94);
  font-size: clamp(1.55rem, 2.1vw, 2.2rem);
  font-weight: 480;
  line-height: 1.08;
  letter-spacing: -.03em;
}

.service-dossier__descriptor {
  margin: 13px 0 0;
  color: rgba(198, 157, 94, .76);
  font-size: .68rem;
  font-weight: 650;
  letter-spacing: .13em;
}

.service-dossier__feature {
  position: absolute;
  top: -4px;
  right: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  color: rgba(196, 152, 84, .66);
  font-size: .68rem;
  font-weight: 650;
  letter-spacing: .13em;
}

.service-beacon {
  position: relative;
  display: block;
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  opacity: .62;
  background: url("Assets/verity-beacon-symbol-mark.png") center / contain no-repeat;
  filter: saturate(.72) brightness(.84);
  transition: opacity .42s ease, filter .42s ease;
}

.service-beacon::before {
  content: "";
  position: absolute;
  top: 6px;
  left: 38%;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  opacity: 0;
  background: #e4b66f;
  box-shadow: 0 0 8px rgba(225, 171, 88, .5);
  transform: translateX(-50%);
  transition: opacity .42s ease;
}

.service-beacon i { display: none; }

.service-dossier__analysis-lines {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5px 12px;
  min-height: 24px;
  margin: 22px 0 20px;
}

.service-dossier__analysis-lines span {
  height: 1px;
  opacity: .22;
  background: linear-gradient(90deg, rgba(175, 189, 188, .55), transparent 82%);
  transform: scaleX(.48);
  transform-origin: left;
  transition: opacity .42s ease, transform .48s cubic-bezier(.22, 1, .36, 1);
}

.service-dossier__promise {
  margin: 0;
  color: rgba(247, 242, 231, .92);
  font-size: 1.3rem;
  font-weight: 520;
  line-height: 1.5;
}

.service-dossier__description {
  margin: 17px 0 0;
  color: rgba(210, 218, 218, .62);
  font-size: 1rem;
  line-height: 1.72;
}

.service-dossier ul {
  display: grid;
  gap: 10px;
  margin: 25px 0 32px;
  padding: 0;
  list-style: none;
}

.service-dossier li {
  position: relative;
  padding-left: 17px;
  color: rgba(214, 220, 219, .65);
  font-size: .9rem;
  line-height: 1.54;
}

.service-dossier li::before {
  content: "";
  position: absolute;
  top: .62em;
  left: 0;
  width: 7px;
  height: 1px;
  background: rgba(190, 145, 75, .58);
}

.service-dossier__footer {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin-top: auto;
  padding-top: 25px;
  border-top: 1px solid rgba(153, 168, 169, .16);
}

.service-dossier__price { display: grid; grid-template-columns: auto auto; gap: 4px 10px; margin: 0; }
.service-dossier__price span { grid-column: 1 / -1; color: rgba(199, 153, 83, .74); font-size: .63rem; font-weight: 700; letter-spacing: .16em; }
.service-dossier__price strong { color: rgba(247, 243, 234, .94); font-size: 1.48rem; font-weight: 520; letter-spacing: -.03em; }
.service-dossier__price del { align-self: end; padding-bottom: 2px; color: rgba(181, 190, 190, .42); font-size: .77rem; text-decoration-color: rgba(181, 190, 190, .38); }
.service-dossier__actions { display: grid; justify-items: end; gap: 2px; }
.service-dossier__details { padding: 5px 0; border-bottom: 1px solid rgba(199, 153, 83, .42); color: rgba(224, 226, 220, .58); font-size: .7rem; text-decoration: none; }
.service-dossier__details:hover, .service-dossier__details:focus-visible { color: #fff8ea; border-color: rgba(199, 153, 83, .86); }

.service-dossier__cta {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 8px 0;
  color: rgba(231, 228, 219, .76);
  font-size: .78rem;
  font-weight: 620;
  text-decoration: none;
  transition: color .38s ease;
}

.service-dossier__cta span { color: rgba(199, 153, 83, .78); transition: transform .38s ease; }
.service-dossier__cta:hover,
.service-dossier__cta:focus-visible { color: #fff8ea; }
.service-dossier__cta:hover span,
.service-dossier__cta:focus-visible span { transform: translateX(3px); }
#palvelut,
#malliraportti,
#ukk { scroll-margin-top: 24px; }

.mobile-nav a:focus-visible,
.service-dossier__cta:focus-visible,
.service-dossier__details:focus-visible,
.faq__more:focus-visible,
.final-cta__link:focus-visible,
.site-footer a:focus-visible,
.floating-order-cta:focus-visible,
.inner-nav a:focus-visible,
.inner-header__mobile-cta:focus-visible {
  outline: 2px solid #d4b279;
  outline-offset: 4px;
}

.service-dossier.is-active,
.service-dossier:hover,
.service-dossier:focus-within {
  border-color: rgba(194, 155, 95, .4);
  box-shadow: 0 28px 62px rgba(0, 0, 0, .3), inset 0 1px rgba(239, 220, 185, .035);
}

.service-dossier.is-active .service-dossier__illumination,
.service-dossier:hover .service-dossier__illumination,
.service-dossier:focus-within .service-dossier__illumination { opacity: 1; }

.service-dossier.is-active .service-dossier__analysis-lines span,
.service-dossier:hover .service-dossier__analysis-lines span,
.service-dossier:focus-within .service-dossier__analysis-lines span {
  opacity: .64;
  transform: scaleX(1);
}

.service-dossier--featured.is-active .service-beacon::before,
.service-dossier--featured:hover .service-beacon::before,
.service-dossier--featured:focus-within .service-beacon::before {
  opacity: 1;
}

.service-dossier--featured.is-active .service-beacon,
.service-dossier--featured:hover .service-beacon,
.service-dossier--featured:focus-within .service-beacon {
  opacity: .94;
  filter: saturate(.92) brightness(1.06);
}

@media (max-width: 1120px) {
  .services__dossiers { gap: 12px; }
  .service-dossier__content { padding-right: 25px; padding-left: 25px; }
  .service-dossier__footer { align-items: start; flex-direction: column; }
  .service-dossier { min-height: 800px; }
  .service-dossier__content { min-height: 800px; }
}

@media (max-width: 820px) {
  .services { min-height: auto; }
  .services__container { width: min(100% - 42px, 620px); padding: 128px 0 112px; }
  .services h2 { font-size: clamp(2.35rem, 10.5vw, 3.5rem); }
  .services__header > p:last-child { font-size: .96rem; line-height: 1.68; }
  .services__scale { width: 100%; margin-top: 78px; }
  .services__drafting-sheet { top: 36%; left: -48%; width: 100%; height: 38%; opacity: .09; }
  .services__drafting-ruler { right: -47%; bottom: 3%; width: 66%; opacity: .24; }
  .services__drafting-mark--a { top: 29%; right: 4%; }
  .services__drafting-mark--b { bottom: 9%; left: 4%; }
  .services__dossiers { grid-template-columns: 1fr; gap: 42px; margin-top: 64px; padding: 0; }
  .services__dossiers::before { top: 22px; bottom: 2%; left: -16px; width: 92%; }
  .services__dossiers::after { top: 47%; right: -14px; width: 72%; height: 42%; }
  .service-dossier,
  .service-dossier:nth-child(1),
  .service-dossier:nth-child(2),
  .service-dossier:nth-child(3) { min-height: 0; margin-top: 0; transform: none; }
  .service-dossier__content { min-height: 0; padding: 34px 28px 30px; }
  .service-dossier__footer { align-items: end; flex-direction: row; }
}

@media (max-width: 480px) {
  .services__container { width: calc(100% - 32px); }
  .services__scale-node strong { font-size: .59rem; letter-spacing: .1em; }
  .services__scale-node span { font-size: .52rem; }
  .service-dossier__feature { position: static; margin: -6px 0 20px; font-size: .65rem; }
  .service-dossier__header { min-height: 0; }
  .service-dossier h3 { font-size: 1.72rem; }
  .service-dossier__promise { font-size: 1.2rem; }
  .service-dossier__footer { align-items: start; flex-direction: column; }
}

@media (hover: none) {
  .service-dossier:hover { border-color: rgba(151, 165, 167, .19); box-shadow: 0 26px 56px rgba(0, 0, 0, .22); }
  .service-dossier:hover .service-dossier__illumination { opacity: 0; }
  .service-dossier:hover .service-dossier__analysis-lines span { opacity: .22; transform: scaleX(.48); }
  .service-dossier.is-active { border-color: rgba(194, 155, 95, .4); box-shadow: 0 28px 62px rgba(0, 0, 0, .3); }
  .service-dossier.is-active .service-dossier__illumination { opacity: 1; }
  .service-dossier.is-active .service-dossier__analysis-lines span { opacity: .64; transform: scaleX(1); }
}

@media (prefers-reduced-motion: reduce) {
  .services *,
  .services *::before,
  .services *::after { transition: none !important; animation: none !important; }
  .service-dossier__illumination { opacity: .34; }
  .service-dossier__analysis-lines span { opacity: .5; transform: scaleX(1); }
  .service-beacon { opacity: .8; filter: saturate(.8) brightness(.94); }
  .service-beacon::before { opacity: .72; box-shadow: none; }
}

/* Verity Beacon report preview */
.report-preview {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  min-height: 1420px;
  color: #edf0ed;
  background: #091116;
}

.report-preview__desk {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, transparent 0 8%, rgba(186, 148, 91, .045) 8.08%, transparent 8.16% 91.8%, rgba(186, 148, 91, .035) 91.88%, transparent 92%),
    linear-gradient(rgba(117, 139, 144, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(117, 139, 144, .03) 1px, transparent 1px),
    radial-gradient(ellipse at 51% 54%, rgba(48, 62, 64, .34), transparent 54%),
    linear-gradient(118deg, #0d171c 0%, #071015 52%, #0b1418 100%);
  background-size: auto, 42px 42px, 42px 42px, auto, auto;
  box-shadow: inset 0 0 150px rgba(1, 7, 10, .46), inset 0 1px rgba(195, 178, 144, .025);
}

.report-preview__desk::before,
.report-preview__desk::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.report-preview__desk::before {
  inset: 0;
  opacity: .4;
  background:
    repeating-linear-gradient(8deg, transparent 0 64px, rgba(216, 197, 161, .026) 65px, transparent 66px 114px),
    repeating-linear-gradient(94deg, transparent 0 3px, rgba(205, 218, 211, .008) 4px, transparent 5px 11px),
    radial-gradient(circle at 17% 28%, rgba(204, 174, 124, .07), transparent 1.5px),
    radial-gradient(circle at 82% 74%, rgba(204, 174, 124, .05), transparent 1.2px);
  background-size: auto, auto, 83px 79px, 101px 97px;
  mix-blend-mode: screen;
}

.report-preview__desk::after {
  inset: 0;
  background:
    linear-gradient(180deg, rgba(3, 9, 12, .25), transparent 22%, transparent 77%, rgba(2, 7, 10, .52)),
    linear-gradient(90deg, rgba(2, 7, 10, .5), transparent 19%, transparent 81%, rgba(2, 7, 10, .48));
}

.report-preview__container {
  width: min(100% - 96px, 1500px);
  margin: 0 auto;
  padding: 150px 0 120px;
}

.report-preview__header {
  position: relative;
  z-index: 12;
  display: grid;
  grid-template-columns: minmax(0, 760px) minmax(240px, 1fr);
  align-items: end;
  gap: 88px;
}

.report-preview__eyebrow {
  margin: 0 0 22px;
  color: #bd9557;
  font-size: .72rem;
  font-weight: 720;
  letter-spacing: .23em;
}

.report-preview h2 {
  max-width: 780px;
  margin: 0;
  color: #f4f2eb;
  font-size: clamp(3rem, 4.4vw, 5.25rem);
  font-weight: 440;
  letter-spacing: -.055em;
  line-height: .98;
}

.report-preview__intro {
  max-width: 650px;
  margin: 32px 0 0;
  color: rgba(214, 221, 219, .68);
  font-size: 1.08rem;
  line-height: 1.72;
}

.report-preview__sample {
  justify-self: end;
  width: min(100%, 390px);
  padding: 0 0 13px 24px;
  border-left: 1px solid rgba(188, 148, 87, .55);
}

.report-preview__sample p {
  margin: 0 0 9px;
  color: rgba(210, 172, 113, .88);
  font-family: var(--font-mono);
  font-size: .7rem;
  letter-spacing: .15em;
}

.report-preview__sample span {
  display: block;
  color: rgba(207, 215, 213, .52);
  font-size: .78rem;
  line-height: 1.48;
}

.report-preview__stage {
  position: relative;
  z-index: 2;
  height: 870px;
  margin-top: 96px;
  perspective: 1500px;
}

.report-preview__stage::before {
  content: "";
  position: absolute;
  top: 49%;
  left: 50%;
  width: 78%;
  height: 64%;
  border-radius: 50%;
  opacity: .46;
  background: radial-gradient(ellipse, rgba(0, 0, 0, .55), rgba(0, 0, 0, .14) 54%, transparent 76%);
  transform: translate(-50%, -50%);
}

.report-preview__stage::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 104px;
  left: 50%;
  width: min(78%, 980px);
  height: 570px;
  border: 1px solid rgba(139, 158, 159, .09);
  opacity: .72;
  background:
    linear-gradient(rgba(139, 158, 159, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(139, 158, 159, .04) 1px, transparent 1px),
    linear-gradient(135deg, rgba(181, 150, 103, .026), transparent 40%);
  background-size: 24px 24px, 24px 24px, auto;
  box-shadow: 0 28px 62px rgba(0, 0, 0, .17);
  transform: translateX(-50%) rotate(-1.1deg);
}

.report-preview__sweep {
  position: absolute;
  z-index: 9;
  top: 5%;
  left: -24%;
  width: 42%;
  height: 88%;
  opacity: 0;
  pointer-events: none;
  background: linear-gradient(104deg, transparent 5%, rgba(209, 173, 111, .025) 29%, rgba(224, 190, 131, .18) 49%, rgba(209, 173, 111, .03) 67%, transparent 92%);
  transform: skewX(-8deg);
  mix-blend-mode: screen;
}

.report-preview.is-visible .report-preview__sweep {
  animation: report-sweep 3.25s cubic-bezier(.4, 0, .2, 1) .18s 1 both;
}

.report-preview__ambient-shadow {
  position: absolute;
  z-index: 7;
  top: 68px;
  left: 50%;
  width: min(76%, 940px);
  height: 650px;
  border-radius: 44% 48% 42% 46%;
  opacity: .68;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 50% 45%, transparent 0%, rgba(9, 16, 18, .015) 43%, rgba(8, 14, 16, .085) 72%, rgba(5, 11, 13, .16) 100%),
    linear-gradient(116deg, rgba(14, 22, 23, .035), transparent 31%, rgba(6, 13, 15, .055) 77%, rgba(5, 11, 13, .09));
  transform: translateX(-50%) rotate(-.4deg);
  mix-blend-mode: multiply;
}

.source-pile {
  position: absolute;
  z-index: 0;
  inset: 0;
  pointer-events: none;
}

.source-sheet {
  --source-paper: #b7bbb5;
  --source-ink: rgba(27, 42, 44, .48);
  position: absolute;
  z-index: var(--source-z, 1);
  overflow: hidden;
  border: 1px solid rgba(158, 172, 170, .2);
  opacity: .58;
  color: var(--source-ink);
  background:
    linear-gradient(rgba(78, 101, 104, .075) 1px, transparent 1px),
    linear-gradient(90deg, rgba(78, 101, 104, .065) 1px, transparent 1px),
    linear-gradient(137deg, rgba(255, 255, 255, .1), transparent 42%),
    var(--source-paper);
  background-size: 16px 16px, 16px 16px, auto, auto;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .38), 0 8px 17px rgba(0, 0, 0, .18), inset 0 0 38px rgba(35, 50, 51, .1);
}

.source-sheet::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(96deg, transparent 0 68%, rgba(24, 36, 38, .08) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, .035), transparent 24%, rgba(26, 37, 39, .09));
}

.source-sheet__code {
  position: absolute;
  top: 17px;
  left: 19px;
  z-index: 2;
  font-family: var(--font-mono);
  font-size: .46rem;
  font-weight: 720;
  letter-spacing: .145em;
}

.source-sheet--technical {
  --source-z: 6;
  --source-paper: #929d9c;
  top: 150px;
  left: calc(50% - 700px);
  width: 520px;
  height: 330px;
  background-size: 14px 14px, 14px 14px, auto, auto;
  transform: rotate(-4.8deg);
}

.source-sheet__diagram {
  position: absolute;
  top: 67px;
  left: 107px;
  width: 262px;
  height: 158px;
  border: 1px solid rgba(28, 44, 46, .42);
  border-radius: 42% 34% 47% 31%;
  box-shadow: inset 0 0 0 8px rgba(30, 46, 48, .025);
}

.source-sheet__diagram::before,
.source-sheet__diagram::after { content: ""; position: absolute; background: rgba(28, 44, 46, .34); }
.source-sheet__diagram::before { top: 50%; right: -37px; left: -37px; height: 1px; }
.source-sheet__diagram::after { top: -27px; bottom: -27px; left: 50%; width: 1px; }
.source-sheet__diagram i { position: absolute; width: 32px; height: 32px; border: 1px solid rgba(28, 44, 46, .42); border-radius: 50%; box-shadow: inset 0 0 0 6px rgba(31, 48, 49, .05); }
.source-sheet__diagram i:nth-child(1) { top: 16px; left: 20px; }
.source-sheet__diagram i:nth-child(2) { top: 18px; right: 22px; }
.source-sheet__diagram i:nth-child(3) { bottom: 13px; left: 45px; }
.source-sheet__diagram i:nth-child(4) { right: 43px; bottom: 15px; }
.source-sheet__diagram i:nth-child(5) { top: 54px; left: 93px; width: 39px; height: 29px; border-radius: 4px; transform: rotate(-12deg); }
.source-sheet__diagram i:nth-child(6) { top: 54px; right: -17px; width: 23px; height: 23px; box-shadow: 0 0 0 6px rgba(31, 48, 49, .035); }
.source-sheet__diagram i:nth-child(7) { bottom: -15px; left: 106px; width: 24px; height: 24px; }
.source-sheet__diagram i:nth-child(8) { top: -15px; left: 112px; width: 21px; height: 21px; }
.source-sheet__callouts { position: absolute; inset: 46px 24px 62px 24px; counter-reset: tech-callout; }
.source-sheet__callouts span { position: absolute; width: 58px; height: 1px; background: rgba(27, 43, 44, .35); counter-increment: tech-callout; transform-origin: left; }
.source-sheet__callouts span::before { content: counter(tech-callout, decimal-leading-zero); position: absolute; top: -5px; left: -18px; font: 6px/1 ui-monospace, monospace; color: rgba(24, 40, 42, .64); }
.source-sheet__callouts span:nth-child(1) { top: 26px; left: 56px; transform: rotate(17deg); }
.source-sheet__callouts span:nth-child(2) { top: 82px; left: 18px; width: 74px; transform: rotate(-9deg); }
.source-sheet__callouts span:nth-child(3) { top: 151px; left: 62px; width: 66px; transform: rotate(12deg); }
.source-sheet__callouts span:nth-child(4) { top: 35px; right: 21px; transform: rotate(162deg); }
.source-sheet__callouts span:nth-child(5) { top: 117px; right: 7px; width: 78px; transform: rotate(188deg); }
.source-sheet__callouts span:nth-child(6) { right: 58px; bottom: 7px; transform: rotate(201deg); }
.source-sheet__measure { position: absolute; right: 176px; bottom: 22px; left: 22px; display: grid; grid-template-columns: 1fr 1.35fr .7fr .45fr .85fr; gap: 7px; }
.source-sheet__measure span { position: relative; height: 1px; background: rgba(29, 45, 47, .34); }
.source-sheet__measure span::before,
.source-sheet__measure span::after { content: ""; position: absolute; top: -2px; width: 1px; height: 5px; background: inherit; }
.source-sheet__measure span::before { left: 0; }
.source-sheet__measure span::after { right: 0; }
.source-sheet__spec { position: absolute; right: 22px; bottom: 51px; display: grid; grid-template-columns: repeat(4, 25px); gap: 1px; padding: 4px; border: 1px solid rgba(27, 43, 44, .23); }
.source-sheet__spec i { height: 8px; background: rgba(31, 47, 49, .17); }
.source-sheet__revision { position: absolute; right: 22px; bottom: 17px; display: grid; grid-template-columns: repeat(3, 34px); gap: 1px; padding: 3px; border: 1px solid rgba(27, 43, 44, .28); }
.source-sheet__revision i { height: 7px; background: rgba(28, 44, 45, .15); }

.source-sheet--service {
  --source-z: 1;
  --source-paper: #c5c1b7;
  top: 24px;
  left: calc(50% - 550px);
  width: 410px;
  height: 330px;
  transform: rotate(-.7deg);
}

.source-sheet__timeline { position: absolute; top: 66px; bottom: 27px; left: 30px; width: 1px; border-left: 1px solid rgba(37, 50, 50, .34); }
.source-sheet__timeline i { position: absolute; left: -4px; width: 7px; height: 7px; border: 1px solid rgba(35, 49, 49, .52); border-radius: 50%; background: var(--source-paper); }
.source-sheet__timeline i:nth-child(1) { top: 2%; }
.source-sheet__timeline i:nth-child(2) { top: 24%; }
.source-sheet__timeline i:nth-child(3) { top: 48%; }
.source-sheet__timeline i:nth-child(4) { top: 71%; border-color: rgba(137, 93, 39, .72); }
.source-sheet__timeline i:nth-child(5) { top: 95%; }
.source-sheet__table { position: absolute; top: 62px; right: 22px; bottom: 29px; left: 50px; display: grid; grid-template-rows: repeat(22, 1fr); gap: 1px; padding-top: 12px; border-top: 6px solid rgba(35, 50, 51, .15); }
.source-sheet__table i { position: relative; min-height: 5px; border-top: 1px solid rgba(37, 52, 52, .21); background: linear-gradient(90deg, rgba(45, 61, 61, .12) 0 17%, transparent 17% 20%, rgba(45, 61, 61, .08) 20% 44%, transparent 44% 47%, rgba(45, 61, 61, .12) 47% 77%, transparent 77% 80%, rgba(45, 61, 61, .1) 80%); }
.source-sheet__table i:nth-child(6),
.source-sheet__table i:nth-child(14),
.source-sheet__table i:nth-child(20) { background-color: rgba(155, 122, 72, .15); }
.source-sheet__table i:nth-child(10)::after,
.source-sheet__table i:nth-child(18)::after { content: ""; position: absolute; top: 1px; right: 5px; width: 4px; height: 4px; border: 1px solid rgba(133, 88, 35, .6); border-radius: 50%; }
.source-sheet__service-status { position: absolute; right: 22px; bottom: 15px; display: flex; gap: 7px; }
.source-sheet__service-status span { width: 19px; height: 3px; background: rgba(36, 51, 52, .24); }
.source-sheet__service-status span:nth-child(3) { background: rgba(136, 91, 37, .48); }

.source-sheet--market {
  --source-z: 3;
  --source-paper: #afb5b2;
  top: 294px;
  right: calc(50% - 650px);
  width: 310px;
  height: 300px;
  transform: rotate(4.2deg);
}

.source-sheet__chart { position: absolute; top: 54px; right: 27px; left: 29px; height: 102px; border-bottom: 1px solid rgba(31, 47, 49, .37); border-left: 1px solid rgba(31, 47, 49, .31); background: repeating-linear-gradient(0deg, transparent 0 24px, rgba(38, 53, 54, .08) 25px), repeating-linear-gradient(90deg, transparent 0 42px, rgba(38, 53, 54, .07) 43px); }
.source-sheet__chart::before { content: ""; position: absolute; top: 42%; right: 0; left: 0; border-top: 1px dashed rgba(31, 47, 49, .31); }
.source-sheet__chart i { position: absolute; width: 6px; height: 6px; border: 1px solid rgba(38, 53, 54, .62); border-radius: 50%; }
.source-sheet__chart i:nth-child(1) { bottom: 14%; left: 6%; }
.source-sheet__chart i:nth-child(2) { bottom: 38%; left: 19%; }
.source-sheet__chart i:nth-child(3) { bottom: 29%; left: 32%; }
.source-sheet__chart i:nth-child(4) { bottom: 62%; left: 44%; }
.source-sheet__chart i:nth-child(5) { bottom: 47%; left: 57%; }
.source-sheet__chart i:nth-child(6) { bottom: 76%; left: 68%; }
.source-sheet__chart i:nth-child(7) { bottom: 55%; left: 81%; }
.source-sheet__chart i:nth-child(8) { bottom: 69%; left: 93%; border-color: rgba(137, 93, 39, .78); }
.source-sheet__chart i:nth-child(9) { bottom: 25%; left: 73%; }
.source-sheet__chart i:nth-child(10) { bottom: 84%; left: 36%; }
.source-sheet__bars { position: absolute; top: 166px; left: 27px; width: 122px; display: grid; gap: 5px; }
.source-sheet__bars i { height: 3px; background: rgba(37, 52, 53, .31); }
.source-sheet__bars i:nth-child(1) { width: 72%; }
.source-sheet__bars i:nth-child(2) { width: 94%; }
.source-sheet__bars i:nth-child(3) { width: 58%; }
.source-sheet__bars i:nth-child(4) { width: 82%; background: rgba(139, 96, 41, .43); }
.source-sheet__bars i:nth-child(5) { width: 66%; }
.source-sheet__bars i:nth-child(6) { width: 88%; }
.source-sheet__bars i:nth-child(7) { width: 53%; }
.source-sheet__bars i:nth-child(8) { width: 76%; }
.source-sheet__bars i:nth-child(9) { width: 92%; background: rgba(139, 96, 41, .3); }
.source-sheet__bars i:nth-child(10) { width: 61%; }
.source-sheet__data { position: absolute; right: 24px; bottom: 38px; left: 174px; display: grid; gap: 7px; }
.source-sheet__data span { height: 4px; background: repeating-linear-gradient(90deg, rgba(31, 47, 49, .29) 0 23px, transparent 23px 30px); }
.source-sheet__distribution { position: absolute; right: 24px; bottom: 17px; left: 174px; display: flex; align-items: end; gap: 3px; height: 13px; border-bottom: 1px solid rgba(32, 48, 49, .28); }
.source-sheet__distribution i { flex: 1; height: 28%; background: rgba(34, 50, 51, .28); }
.source-sheet__distribution i:nth-child(3n) { height: 72%; }
.source-sheet__distribution i:nth-child(4n) { height: 100%; background: rgba(131, 89, 38, .36); }

.source-sheet--inspection {
  --source-z: 7;
  --source-paper: #c3c1b8;
  right: auto;
  bottom: 40px;
  left: calc(50% - 650px);
  width: 330px;
  height: 360px;
  transform: rotate(5.9deg);
}

.source-sheet__checks { position: absolute; top: 58px; right: 24px; left: 24px; display: grid; gap: 18px; }
.source-sheet__checks i { position: relative; height: 5px; margin-left: 24px; border-top: 1px solid rgba(31, 47, 49, .3); background: linear-gradient(90deg, rgba(31, 47, 49, .15) 0 30%, transparent 30% 34%, rgba(31, 47, 49, .1) 34% 57%, transparent 57% 61%, rgba(31, 47, 49, .13) 61% 83%, transparent 83%); }
.source-sheet__checks i::before { content: ""; position: absolute; top: -6px; left: -24px; width: 10px; height: 10px; border: 1px solid rgba(31, 47, 49, .48); }
.source-sheet__checks i:nth-child(3)::after,
.source-sheet__checks i:nth-child(6)::after,
.source-sheet__checks i:nth-child(9)::after { content: ""; position: absolute; top: -4px; left: -21px; width: 7px; height: 4px; border-bottom: 1px solid rgba(132, 91, 39, .8); border-left: 1px solid rgba(132, 91, 39, .8); transform: rotate(-45deg); }
.source-sheet__checks i:nth-child(4),
.source-sheet__checks i:nth-child(8) { margin-top: 5px; border-top: 1px solid rgba(31, 47, 49, .22); }
.source-sheet__inspection-scale { position: absolute; right: 24px; bottom: 21px; left: 48px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.source-sheet__inspection-scale span { height: 6px; border: 1px solid rgba(31, 47, 49, .25); background: rgba(42, 57, 57, .08); }
.source-sheet__inspection-scale span:nth-child(3) { border-color: rgba(132, 89, 36, .53); background: rgba(132, 89, 36, .18); }

.source-sheet--vehicle {
  --source-z: 4;
  --source-paper: #939d9a;
  bottom: 80px;
  left: calc(50% - 520px);
  width: 300px;
  height: 220px;
  transform: rotate(-2.2deg);
}

.source-sheet__vehicle-diagram { position: absolute; top: 68px; left: 35px; width: 205px; height: 72px; border: 1px solid rgba(28, 44, 46, .4); border-radius: 47% 56% 18% 15% / 64% 67% 24% 20%; }
.source-sheet__vehicle-diagram::before { content: ""; position: absolute; right: 18px; bottom: -12px; left: 15px; height: 1px; border-top: 1px dashed rgba(30, 46, 47, .4); }
.source-sheet__vehicle-diagram i { position: absolute; bottom: -12px; width: 26px; height: 26px; border: 1px solid rgba(28, 44, 46, .46); border-radius: 50%; background: var(--source-paper); box-shadow: inset 0 0 0 6px rgba(29, 46, 47, .06); }
.source-sheet__vehicle-diagram i:nth-child(1) { left: 28px; }
.source-sheet__vehicle-diagram i:nth-child(2) { right: 27px; }
.source-sheet__vehicle-diagram i:nth-child(3) { top: 18px; left: 82px; width: 55px; height: 25px; border-radius: 8px; }
.source-sheet__spec--vehicle { right: 28px; bottom: 28px; left: 28px; grid-template-columns: repeat(3, 1fr); }

.source-sheet--history {
  --source-z: 5;
  --source-paper: #b8b5ad;
  top: 360px;
  left: calc(50% - 580px);
  width: 285px;
  height: 390px;
  transform: rotate(-7.3deg);
}

.source-sheet__history-line { position: absolute; top: 68px; bottom: 30px; left: 56px; width: 1px; background: rgba(34, 49, 50, .36); }
.source-sheet__history-line i { position: absolute; left: -4px; width: 7px; height: 7px; border: 1px solid rgba(33, 48, 49, .54); border-radius: 50%; background: var(--source-paper); }
.source-sheet__history-line i:nth-child(1) { top: 0; }
.source-sheet__history-line i:nth-child(2) { top: 19%; }
.source-sheet__history-line i:nth-child(3) { top: 39%; border-color: rgba(136, 93, 38, .74); }
.source-sheet__history-line i:nth-child(4) { top: 59%; }
.source-sheet__history-line i:nth-child(5) { top: 78%; }
.source-sheet__history-line i:nth-child(6) { bottom: 0; }
.source-sheet__history-rows { position: absolute; top: 66px; right: 24px; left: 76px; display: grid; gap: 28px; }
.source-sheet__history-rows span { height: 10px; border-top: 1px solid rgba(34, 49, 50, .28); border-bottom: 3px solid rgba(34, 49, 50, .1); }

.source-sheet--risk {
  --source-z: 8;
  --source-paper: #7f8b8b;
  bottom: 35px;
  left: calc(50% - 350px);
  width: 320px;
  height: 225px;
  transform: rotate(1.1deg);
}

.source-sheet__matrix { position: absolute; top: 58px; left: 30px; display: grid; grid-template-columns: repeat(4, 31px); gap: 2px; padding: 9px; border: 1px solid rgba(25, 41, 42, .29); }
.source-sheet__matrix i { height: 25px; background: rgba(40, 57, 58, .14); }
.source-sheet__matrix i:nth-child(4n),
.source-sheet__matrix i:nth-child(4n - 1) { background: rgba(123, 87, 43, .2); }
.source-sheet__matrix i:nth-child(4),
.source-sheet__matrix i:nth-child(8) { background: rgba(139, 91, 39, .35); }
.source-sheet__risk-scale { position: absolute; top: 67px; right: 28px; width: 95px; display: grid; gap: 18px; }
.source-sheet__risk-scale span { height: 5px; background: rgba(27, 43, 44, .3); }
.source-sheet__risk-scale span:nth-child(1) { width: 56%; }
.source-sheet__risk-scale span:nth-child(2) { width: 92%; background: rgba(129, 88, 39, .38); }
.source-sheet__risk-scale span:nth-child(3) { width: 72%; }

.source-sheet--index {
  --source-z: 2;
  --source-paper: #bdc0b8;
  top: 340px;
  right: calc(50% - 540px);
  width: 250px;
  height: 340px;
  transform: rotate(6.6deg);
}

.source-sheet__index-rows { position: absolute; top: 61px; right: 24px; left: 24px; display: grid; gap: 17px; counter-reset: source-row; }
.source-sheet__index-rows i { position: relative; height: 7px; margin-left: 27px; border-top: 1px solid rgba(31, 47, 49, .31); border-bottom: 2px solid rgba(31, 47, 49, .09); counter-increment: source-row; }
.source-sheet__index-rows i::before { content: counter(source-row, decimal-leading-zero); position: absolute; top: -5px; left: -27px; font: 6px/1 ui-monospace, monospace; color: rgba(28, 44, 45, .5); }
.source-sheet__index-rows i:nth-child(5) { border-top-color: rgba(137, 93, 38, .72); }
.source-sheet__links { position: absolute; top: 72px; right: 21px; bottom: 29px; width: 28px; }
.source-sheet__links span { position: absolute; right: 0; width: 22px; height: 1px; background: rgba(31, 47, 49, .25); transform-origin: right; }
.source-sheet__links span:nth-child(1) { top: 10%; transform: rotate(-22deg); }
.source-sheet__links span:nth-child(2) { top: 34%; transform: rotate(18deg); }
.source-sheet__links span:nth-child(3) { top: 59%; transform: rotate(-31deg); }
.source-sheet__links span:nth-child(4) { top: 82%; transform: rotate(24deg); }

.source-sheet--diagnostic {
  --source-z: 0;
  --source-paper: #727f80;
  top: 100px;
  left: calc(50% - 430px);
  width: 250px;
  height: 430px;
  transform: rotate(-1.2deg);
}

.source-sheet__signals { position: absolute; top: 58px; right: 20px; left: 21px; display: grid; gap: 9px; }
.source-sheet__signals > div { position: relative; height: 45px; border-top: 1px solid rgba(29, 45, 47, .2); border-bottom: 1px solid rgba(29, 45, 47, .2); background: repeating-linear-gradient(90deg, transparent 0 25px, rgba(27, 43, 45, .075) 26px); }
.source-sheet__signals i { position: absolute; height: 1px; width: 23%; background: rgba(23, 39, 41, .56); transform-origin: left; }
.source-sheet__signals i:nth-child(1) { top: 27px; left: 0; transform: rotate(-13deg); }
.source-sheet__signals i:nth-child(2) { top: 16px; left: 20%; transform: rotate(21deg); }
.source-sheet__signals i:nth-child(3) { top: 27px; left: 40%; transform: rotate(-25deg); }
.source-sheet__signals i:nth-child(4) { top: 16px; left: 60%; transform: rotate(15deg); }
.source-sheet__signals i:nth-child(5) { top: 24px; left: 80%; transform: rotate(-8deg); }
.source-sheet__signals > div:nth-child(2) { transform: scaleY(.72); }
.source-sheet__signals > div:nth-child(3) { transform: scaleY(1.14); }
.source-sheet__channel-rows { position: absolute; top: 226px; right: 21px; left: 21px; display: grid; gap: 7px; }
.source-sheet__channel-rows i { height: 5px; border-top: 1px solid rgba(24, 41, 42, .25); background: repeating-linear-gradient(90deg, rgba(24, 41, 42, .15) 0 20px, transparent 20px 27px); }
.source-sheet__channel-rows i:nth-child(3),
.source-sheet__channel-rows i:nth-child(7) { background-color: rgba(130, 87, 34, .17); }
.source-sheet__trace-data { position: absolute; right: 21px; bottom: 24px; left: 21px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 7px; }
.source-sheet__trace-data span { height: 31px; border: 1px solid rgba(29, 45, 47, .27); background: repeating-linear-gradient(0deg, transparent 0 6px, rgba(29, 45, 47, .12) 7px); }

.report-dossier {
  position: absolute;
  z-index: 1;
  top: 70px;
  left: 50%;
  width: min(75%, 1020px);
  height: 670px;
  overflow: hidden;
  clip-path: polygon(0 6.5%, 70% 6.5%, 74.5% 0, 95% 0, 100% 6.5%, 100% 100%, 0 100%);
  border: 1px solid rgba(126, 143, 144, .2);
  background:
    radial-gradient(circle at 17% 28%, rgba(204, 178, 132, .06), transparent 1.1px),
    radial-gradient(circle at 73% 61%, rgba(184, 198, 196, .035), transparent 1px),
    repeating-linear-gradient(102deg, transparent 0 5px, rgba(218, 224, 216, .012) 6px, transparent 7px 13px),
    linear-gradient(128deg, #192226 0%, #11191d 48%, #172024 100%);
  background-size: 53px 47px, 61px 57px, auto, auto;
  box-shadow: 0 34px 72px rgba(0, 0, 0, .48), inset 0 1px rgba(232, 220, 194, .035), inset 0 -1px rgba(0, 0, 0, .48);
  transform: translateX(-50%) rotate(1.15deg);
}

.report-dossier::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .018), transparent 18%, transparent 78%, rgba(0, 0, 0, .11)),
    radial-gradient(ellipse at 44% 34%, rgba(199, 162, 105, .035), transparent 54%);
}

.report-dossier::after {
  content: "";
  position: absolute;
  right: 4.5%;
  bottom: 13px;
  left: 4.5%;
  height: 1px;
  opacity: .38;
  background: repeating-linear-gradient(90deg, rgba(156, 174, 173, .42) 0 1px, transparent 1px 24px);
}

.report-dossier__spine {
  position: absolute;
  z-index: 2;
  top: 6.5%;
  bottom: 0;
  left: 0;
  width: 29px;
  border-right: 1px solid rgba(159, 173, 171, .13);
  background: linear-gradient(90deg, rgba(3, 8, 10, .34), rgba(198, 210, 201, .025) 58%, rgba(0, 0, 0, .15));
  box-shadow: 8px 0 18px rgba(0, 0, 0, .16);
}

.report-dossier__identity {
  position: absolute;
  bottom: 22px;
  left: 32px;
  display: flex;
  align-items: center;
  gap: 11px;
  color: rgba(187, 151, 96, .42);
  text-shadow: 0 1px rgba(0, 0, 0, .42);
}

.report-dossier__identity img {
  width: 19px;
  height: auto;
  opacity: .42;
  filter: saturate(.58) brightness(.76);
}

.report-dossier__identity div { display: grid; gap: 4px; }
.report-dossier__identity strong { font-size: .61rem; font-weight: 690; letter-spacing: .18em; }
.report-dossier__identity span { color: rgba(169, 184, 182, .28); font-family: var(--font-mono); font-size: .49rem; letter-spacing: .16em; }

.report-dossier__system,
.report-dossier__micro,
.report-dossier__registration {
  position: absolute;
  color: rgba(167, 182, 181, .24);
  font-family: var(--font-mono);
  font-size: .51rem;
  letter-spacing: .15em;
}

.report-dossier__system { right: 34px; bottom: 28px; }
.report-dossier__micro { top: 16px; right: 8.5%; color: rgba(190, 151, 92, .33); }
.report-dossier__registration { top: 58px; left: 28px; line-height: 1.72; }


.report-preview__analysis-light {
  position: absolute;
  z-index: 8;
  top: var(--desk-light-y, 42%);
  left: var(--desk-light-x, 50%);
  width: 540px;
  height: 500px;
  border-radius: 50%;
  opacity: .5;
  pointer-events: none;
  background: radial-gradient(ellipse at 50% 50%, rgba(255, 232, 190, .16) 0%, rgba(228, 192, 132, .105) 22%, rgba(207, 166, 101, .052) 46%, rgba(190, 145, 78, .016) 64%, transparent 78%);
  transform: translate(-50%, -50%);
  mix-blend-mode: screen;
  transition: left .7s cubic-bezier(.22, 1, .36, 1), top .7s cubic-bezier(.22, 1, .36, 1), opacity .28s ease;
}

.report-preview[data-active-phase="0"] { --desk-light-x: 50%; --desk-light-y: 42%; }
.report-preview[data-active-phase="1"] { --desk-light-x: 34%; --desk-light-y: 39%; }
.report-preview[data-active-phase="2"] { --desk-light-x: 50%; --desk-light-y: 50%; }
.report-preview[data-active-phase="3"] { --desk-light-x: 66%; --desk-light-y: 39%; }
.report-preview.is-pointer-light .report-preview__analysis-light { opacity: .62; transition: opacity .18s ease; }

@keyframes report-sweep {
  0% { left: -24%; opacity: 0; }
  12% { opacity: .72; }
  78% { opacity: .62; }
  100% { left: 91%; opacity: 0; }
}

.report-page {
  position: absolute;
  z-index: var(--page-z, 2);
  width: var(--page-width, 330px);
  margin: 0;
  overflow: hidden;
  outline: 1px solid rgba(233, 222, 202, .14);
  opacity: 1;
  background: #e7e3d9;
  box-shadow: 0 26px 52px rgba(0, 0, 0, .42), 0 4px 12px rgba(0, 0, 0, .28);
  transform: var(--page-transform);
  transform-origin: center 62%;
}

.report-page::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  opacity: .12;
  background:
    linear-gradient(135deg, rgba(17, 24, 25, .12), rgba(12, 19, 21, .2) 58%, rgba(8, 15, 17, .26)),
    rgba(17, 25, 27, .08);
  mix-blend-mode: multiply;
}

.report-page img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  image-rendering: auto;
  pointer-events: none;
  user-select: none;
}

.report-page > span {
  position: absolute;
  right: 12px;
  bottom: 10px;
  z-index: 3;
  padding: 4px 7px;
  color: rgba(226, 215, 194, .68);
  background: rgba(7, 14, 17, .72);
  font-family: var(--font-mono);
  font-size: .54rem;
  letter-spacing: .12em;
}

.report-page--summary {
  --page-width: 382px;
  --page-z: 6;
  top: 124px;
  left: 50%;
  --page-transform: translateX(-50%) rotate(-.6deg);
}

.report-page--technical {
  --page-width: 326px;
  --page-z: 2;
  top: 88px;
  left: 22%;
  --page-transform: rotate(-6.2deg);
}

.report-page--service {
  --page-width: 330px;
  --page-z: 4;
  top: 218px;
  left: 31%;
  --page-transform: rotate(-3.15deg);
}

.report-page--value {
  --page-width: 322px;
  --page-z: 3;
  top: 232px;
  right: 31%;
  --page-transform: rotate(3.5deg);
}

.report-page--personal {
  --page-width: 334px;
  --page-z: 5;
  top: 90px;
  right: 21.5%;
  --page-transform: rotate(6deg);
}


.report-annotation {
  position: absolute;
  z-index: 11;
  width: 235px;
  opacity: .48;
  color: rgba(197, 208, 206, .72);
  font-family: var(--font-mono);
  transition: opacity .5s ease, color .5s ease;
}

.report-annotation::before {
  content: "";
  display: block;
  width: 74px;
  height: 1px;
  margin-bottom: 12px;
  background: linear-gradient(90deg, rgba(195, 150, 83, .9), rgba(195, 150, 83, .08));
  transform: scaleX(.62);
  transform-origin: left;
  transition: transform .5s ease;
}

.report-annotation::after {
  content: "";
  position: absolute;
  top: 17px;
  height: 1px;
  opacity: .46;
  background: linear-gradient(90deg, rgba(151, 169, 168, .12), rgba(151, 169, 168, .58));
  transition: opacity .5s ease, background .5s ease;
}

.report-annotation span {
  color: rgba(205, 164, 101, .88);
  font-size: .67rem;
  font-weight: 700;
  letter-spacing: .14em;
}

.report-annotation p {
  margin: 8px 0 0;
  font-family: var(--font-sans);
  font-size: .77rem;
  line-height: 1.45;
}

.report-annotation.is-phase-active {
  opacity: .96;
  color: rgba(230, 235, 232, .88);
}

.report-annotation.is-phase-active::before { transform: scaleX(1); }
.report-annotation.is-phase-active::after {
  opacity: .92;
  background: linear-gradient(90deg, rgba(192, 149, 84, .18), rgba(210, 166, 99, .86));
}
.report-annotation--model { top: 158px; left: 3%; }
.report-annotation--model::after { left: 100%; width: 96px; }
.report-annotation--individual { top: 602px; left: 5%; width: 280px; }
.report-annotation--individual::after { left: 100%; width: 122px; }
.report-annotation--personal { top: 164px; right: 3%; text-align: right; }
.report-annotation--personal::after { right: 100%; width: 92px; background: linear-gradient(90deg, rgba(151, 169, 168, .58), rgba(151, 169, 168, .12)); }
.report-annotation--personal.is-phase-active::after { background: linear-gradient(90deg, rgba(210, 166, 99, .86), rgba(192, 149, 84, .18)); }
.report-annotation--personal::before { margin-left: auto; background: linear-gradient(90deg, rgba(195, 150, 83, .08), rgba(195, 150, 83, .9)); transform-origin: right; }

.report-preview__registration {
  position: absolute;
  bottom: 12px;
  left: 4%;
  color: rgba(159, 177, 178, .28);
  font-family: var(--font-mono);
  font-size: .58rem;
  letter-spacing: .14em;
  line-height: 1.7;
}

.report-preview__footer {
  position: relative;
  z-index: 12;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 60px;
  margin-top: 30px;
  padding-top: 54px;
  border-top: 1px solid rgba(143, 161, 161, .16);
}

.report-preview__footer::before {
  content: "ANALYSIS LOGIC / 001";
  position: absolute;
  top: 13px;
  left: 0;
  color: rgba(184, 145, 84, .5);
  font-family: var(--font-mono);
  font-size: .55rem;
  letter-spacing: .16em;
}

.report-preview__footer p {
  max-width: 680px;
  margin: 0;
  color: rgba(210, 218, 216, .58);
  font-size: 1.02rem;
  line-height: 1.76;
}

.report-preview__footer p span { color: rgba(245, 240, 228, .92); }

.report-preview__footer a {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 10px;
  padding: 13px 0 10px;
  color: rgba(240, 238, 230, .84);
  border-bottom: 1px solid rgba(190, 148, 84, .56);
  font-size: .82rem;
  font-weight: 650;
  text-decoration: none;
  transition: color .35s ease, border-color .35s ease;
}

.report-preview__footer a span { color: #c6954f; transition: transform .35s ease; }
.report-preview__footer a:hover,
.report-preview__footer a:focus-visible { color: #fff9ec; border-color: rgba(223, 181, 114, .94); }
.report-preview__footer a:hover span,
.report-preview__footer a:focus-visible span { transform: translateX(4px); }

@media (max-width: 1180px) {
  .report-preview__container { width: min(100% - 56px, 1120px); }
  .report-preview__header { grid-template-columns: minmax(0, 680px) minmax(230px, 1fr); gap: 50px; }
  .report-page--technical { left: 16%; }
  .report-page--service { left: 27%; }
  .report-page--value { right: 27%; }
  .report-page--personal { right: 15.5%; }
  .report-dossier { width: 88%; }
  .source-sheet--technical { top: 160px; left: -160px; }
  .source-sheet--service { top: 30px; left: -35px; }
  .source-sheet--market { top: 310px; right: -85px; }
  .source-sheet--inspection { right: auto; bottom: 45px; left: -55px; }
  .source-sheet--vehicle { bottom: 80px; left: 15%; }
  .source-sheet--history { top: 400px; left: -70px; }
  .source-sheet--risk { bottom: 30px; left: 30%; }
  .source-sheet--index { top: 380px; right: -70px; }
  .source-sheet--diagnostic { top: 115px; left: 10%; }
  .report-annotation--model { left: 1%; }
  .report-annotation--model::after { width: 58px; }
  .report-annotation--individual { left: 2%; }
  .report-annotation--individual::after { width: 66px; }
  .report-annotation--personal { right: 1%; }
  .report-annotation--personal::after { width: 56px; }
}

@media (max-width: 820px) {
  .report-preview { min-height: auto; }
  .report-preview__container { width: min(100% - 36px, 620px); padding: 126px 0 104px; }
  .report-preview__header { grid-template-columns: 1fr; gap: 42px; }
  .report-preview h2 { font-size: clamp(2.6rem, 12vw, 4.15rem); line-height: 1.02; }
  .report-preview__intro { margin-top: 26px; font-size: .97rem; }
  .report-preview__sample { justify-self: start; width: min(100%, 350px); }
  .report-preview__stage { display: grid; height: auto; margin-top: 82px; padding: 28px 0 62px; perspective: none; }
  .report-preview__stage::before { top: 48%; width: 112%; height: 92%; }
  .report-preview__stage::after { top: 70px; width: 94%; height: 72%; }
  .report-preview__sweep { display: none; }
  .report-preview__ambient-shadow { top: 120px; width: 96%; height: 78%; opacity: .56; }
  .report-dossier { top: 76px; width: 96%; height: 80%; transform: translateX(-50%) rotate(.8deg); }
  .report-dossier__identity { bottom: 20px; left: 22px; }
  .report-dossier__system { right: 22px; bottom: 26px; }
  .report-dossier__registration { top: 55px; left: 20px; }
  .source-sheet { opacity: .34; }
  .source-sheet--technical { top: 190px; left: -155px; width: 320px; height: 220px; }
  .source-sheet--service { top: 100px; right: auto; left: -70px; width: 280px; height: 220px; }
  .source-sheet--market { top: 650px; right: -100px; width: 210px; height: 240px; }
  .source-sheet--inspection { right: auto; bottom: 170px; left: -90px; width: 250px; height: 290px; }
  .source-sheet--vehicle { bottom: 430px; left: -35px; width: 220px; height: 160px; }
  .source-sheet--history { top: 900px; left: -100px; width: 230px; height: 300px; }
  .source-sheet--risk { bottom: 60px; left: 5%; width: 250px; height: 170px; }
  .source-sheet--index { top: 1120px; right: -110px; width: 190px; height: 260px; }
  .source-sheet--diagnostic { top: 330px; left: -25px; width: 180px; height: 300px; }
  .report-preview__analysis-light { width: 92vw; height: 620px; opacity: .46; transition-duration: 1.4s; }
  .report-preview[data-active-phase="0"] { --desk-light-x: 50%; --desk-light-y: 14%; }
  .report-preview[data-active-phase="1"] { --desk-light-x: 44%; --desk-light-y: 31%; }
  .report-preview[data-active-phase="2"] { --desk-light-x: 54%; --desk-light-y: 54%; }
  .report-preview[data-active-phase="3"] { --desk-light-x: 48%; --desk-light-y: 76%; }
  .report-page,
  .report-page--summary,
  .report-page--technical,
  .report-page--service,
  .report-page--value,
  .report-page--personal {
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    grid-column: 1;
    width: min(82vw, 370px);
    opacity: 1;
    filter: none;
  }
  .report-page--summary { justify-self: center; z-index: 5; margin: 0 0 28px; transform: rotate(-.5deg); }
  .report-page--technical { justify-self: start; z-index: 2; margin-top: -26px; transform: rotate(-2.2deg); }
  .report-page--service { justify-self: end; z-index: 3; margin-top: -188px; transform: rotate(1.7deg); }
  .report-page--value { justify-self: start; z-index: 3; margin-top: -174px; transform: rotate(-1.4deg); }
  .report-page--personal { justify-self: end; z-index: 4; margin-top: -190px; transform: rotate(2deg); }
  .report-annotation {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    z-index: 10;
    width: min(78%, 300px);
    margin: 22px 0 54px;
    text-align: left;
  }
  .report-annotation::after { top: 17px; left: 100%; right: auto; width: 48px; background: linear-gradient(90deg, rgba(151, 169, 168, .14), rgba(151, 169, 168, .54)); }
  .report-annotation.is-phase-active::after,
  .report-annotation--personal.is-phase-active::after { background: linear-gradient(90deg, rgba(192, 149, 84, .18), rgba(210, 166, 99, .82)); }
  .report-annotation::before,
  .report-annotation--personal::before { margin-left: 0; background: linear-gradient(90deg, rgba(195, 150, 83, .9), rgba(195, 150, 83, .08)); transform-origin: left; }
  .report-annotation--model { justify-self: start; }
  .report-annotation--individual { justify-self: end; }
  .report-annotation--individual::after { right: 100%; left: auto; background: linear-gradient(90deg, rgba(151, 169, 168, .54), rgba(151, 169, 168, .14)); }
  .report-annotation--individual.is-phase-active::after { background: linear-gradient(90deg, rgba(210, 166, 99, .82), rgba(192, 149, 84, .18)); }
  .report-annotation--individual,
  .report-annotation--individual.is-phase-active { transform: none; }
  .report-annotation--personal { justify-self: start; }
  .report-preview__registration { display: none; }
  .report-preview__footer { align-items: start; flex-direction: column; gap: 31px; padding-top: 52px; }
  .report-preview__footer p { font-size: .94rem; }
}

@media (max-width: 480px) {
  .report-preview__container { width: calc(100% - 30px); }
  .report-preview__stage { margin-top: 66px; }
  .report-page,
  .report-page--summary,
  .report-page--technical,
  .report-page--service,
  .report-page--value,
  .report-page--personal { width: min(84vw, 340px); }
  .report-page--service { margin-top: -128px; }
  .report-page--value { margin-top: -108px; }
  .report-page--personal { margin-top: -118px; }
}

@media (prefers-reduced-motion: reduce) {
  .report-preview *,
  .report-preview *::before,
  .report-preview *::after { animation: none !important; transition: none !important; }
  .report-preview__sweep { display: none; }
  .report-preview.is-reduced-motion { --desk-light-x: 50%; --desk-light-y: 45%; }
  .report-preview.is-reduced-motion .report-preview__analysis-light { opacity: .46; }
  .report-preview.is-reduced-motion .report-page { opacity: 1; filter: none; }
  .report-preview.is-reduced-motion .report-page::after { opacity: .12; }
  .report-preview.is-reduced-motion .report-annotation { opacity: .78; transform: none; }
  .report-preview.is-reduced-motion .report-annotation::before { transform: scaleX(1); }
}

/* Report reveal concept — first composition */
.report-reveal {
  --report-light-x: 40%;
  --report-light-y: 40%;
  min-height: 1420px;
  background: #050a0d;
}

.report-reveal .report-preview__space {
  position: absolute;
  z-index: -2;
  inset: 0;
  overflow: hidden;
  background:
    linear-gradient(rgba(103, 128, 132, .024) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 128, 132, .02) 1px, transparent 1px),
    linear-gradient(128deg, rgba(25, 39, 43, .42), transparent 34%, transparent 68%, rgba(22, 34, 38, .24)),
    linear-gradient(180deg, #071015 0%, #04090c 54%, #071014 100%);
  background-size: 58px 58px, 58px 58px, auto, auto;
  box-shadow: inset 0 0 190px rgba(0, 3, 5, .74);
}

.report-reveal .report-preview__space::before,
.report-reveal .report-preview__space::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.report-reveal .report-preview__space::before {
  inset: 7% 5%;
  opacity: .48;
  background:
    linear-gradient(90deg, transparent 0 12%, rgba(139, 158, 160, .045) 12.08%, transparent 12.16% 84%, rgba(139, 158, 160, .035) 84.08%, transparent 84.16%),
    linear-gradient(180deg, transparent 0 20%, rgba(139, 158, 160, .038) 20.08%, transparent 20.16% 76%, rgba(139, 158, 160, .03) 76.08%, transparent 76.16%),
    repeating-linear-gradient(90deg, transparent 0 119px, rgba(170, 187, 186, .018) 120px, transparent 121px 239px);
}

.report-reveal .report-preview__space::after {
  inset: 0;
  background:
    linear-gradient(180deg, rgba(1, 5, 7, .28), transparent 22%, transparent 77%, rgba(1, 5, 7, .5)),
    linear-gradient(90deg, rgba(1, 5, 7, .58), transparent 22%, transparent 78%, rgba(1, 5, 7, .58));
}

.report-reveal .report-preview__container {
  width: min(100% - 96px, 1500px);
  padding: 150px 0 118px;
}

.report-reveal .report-preview__stage {
  position: relative;
  height: 880px;
  margin-top: 88px;
  perspective: 1800px;
}

.report-reveal .report-preview__stage::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 4% 3% 5%;
  width: auto;
  height: auto;
  border-radius: 0;
  opacity: 1;
  background:
    linear-gradient(90deg, transparent 49.94%, rgba(149, 170, 172, .06) 50%, transparent 50.06%),
    linear-gradient(180deg, transparent 51.94%, rgba(149, 170, 172, .045) 52%, transparent 52.06%),
    linear-gradient(121deg, transparent 22%, rgba(188, 150, 93, .018) 47%, transparent 69%);
  transform: none;
}

.report-reveal .report-preview__stage::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 56px;
  left: 50%;
  width: min(72%, 870px);
  height: 720px;
  border: 1px solid rgba(125, 148, 151, .07);
  opacity: .78;
  background:
    linear-gradient(rgba(123, 146, 149, .028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(123, 146, 149, .024) 1px, transparent 1px),
    linear-gradient(135deg, rgba(187, 147, 88, .012), transparent 42%);
  background-size: 38px 38px, 38px 38px, auto;
  box-shadow: none;
  clip-path: polygon(0 5%, 4% 5%, 4% 0, 96% 0, 96% 5%, 100% 5%, 100% 95%, 96% 95%, 96% 100%, 4% 100%, 4% 95%, 0 95%);
  transform: translateX(-50%);
}

.report-analysis-space {
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
}

.report-analysis-space__axis {
  position: absolute;
  top: 111px;
  left: 50%;
  width: min(68%, 820px);
  height: 640px;
  border: 1px solid rgba(129, 153, 155, .075);
  transform: translateX(-50%);
}

.report-analysis-space__axis::before,
.report-analysis-space__axis::after {
  content: "";
  position: absolute;
  background: rgba(137, 160, 162, .08);
}

.report-analysis-space__axis::before { top: 50%; right: -42px; left: -42px; height: 1px; }
.report-analysis-space__axis::after { top: -34px; bottom: -34px; left: 50%; width: 1px; }
.report-analysis-space__axis i { position: absolute; width: 7px; height: 7px; border: 1px solid rgba(157, 177, 177, .15); border-radius: 50%; }
.report-analysis-space__axis i:nth-child(1) { top: -4px; left: 18%; }
.report-analysis-space__axis i:nth-child(2) { top: 28%; right: -4px; }
.report-analysis-space__axis i:nth-child(3) { right: 21%; bottom: -4px; }
.report-analysis-space__axis i:nth-child(4) { bottom: 23%; left: -4px; }
.report-analysis-space__axis i:nth-child(5) { top: calc(50% - 4px); left: calc(50% - 4px); border-color: rgba(191, 148, 84, .3); }

.report-analysis-space__measure {
  position: absolute;
  right: 9%;
  bottom: 76px;
  left: 9%;
  display: grid;
  grid-template-columns: 1fr .65fr 1.4fr .82fr;
  gap: 24px;
}

.report-analysis-space__measure span { position: relative; height: 1px; background: rgba(131, 154, 156, .07); }
.report-analysis-space__measure span::before,
.report-analysis-space__measure span::after { content: ""; position: absolute; top: -3px; width: 1px; height: 7px; background: rgba(131, 154, 156, .11); }
.report-analysis-space__measure span::before { left: 0; }
.report-analysis-space__measure span::after { right: 0; }

.report-signal {
  position: absolute;
  z-index: 2;
  opacity: .075;
  color: rgba(172, 190, 189, .78);
  font-family: var(--font-mono);
  font-size: .56rem;
  letter-spacing: .16em;
  line-height: 1.8;
  transition: opacity 1s ease, color 1s ease, transform 1.2s cubic-bezier(.22, 1, .36, 1);
}

.report-signal::before { content: ""; display: block; width: 62px; height: 1px; margin-bottom: 10px; background: rgba(145, 167, 168, .24); }
.report-signal.is-phase-active { opacity: .48; color: rgba(208, 214, 207, .74); transform: translateY(-3px); }
.report-signal.is-phase-active::before { background: linear-gradient(90deg, rgba(197, 151, 83, .72), rgba(197, 151, 83, .04)); }
.report-signal--risk { top: 148px; left: 4%; }
.report-signal--history { bottom: 220px; left: 7%; }
.report-signal--personal { top: 190px; right: 4%; text-align: right; }
.report-signal--personal::before { margin-left: auto; background: linear-gradient(90deg, rgba(145, 167, 168, .04), rgba(145, 167, 168, .24)); }

.report-object {
  position: absolute;
  z-index: 3;
  top: 50px;
  left: 50%;
  width: 900px;
  height: 760px;
  transform: translateX(-50%);
  transform-style: preserve-3d;
}

.report-reveal .report-dossier {
  position: absolute;
  z-index: 1;
  top: 22px;
  left: 50%;
  width: 610px;
  height: 720px;
  clip-path: polygon(0 3%, 7% 3%, 7% 0, 93% 0, 93% 3%, 100% 3%, 100% 97%, 93% 97%, 93% 100%, 7% 100%, 7% 97%, 0 97%);
  border: 1px solid rgba(127, 148, 150, .2);
  background:
    linear-gradient(rgba(151, 172, 172, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(151, 172, 172, .021) 1px, transparent 1px),
    linear-gradient(132deg, rgba(198, 160, 101, .052), transparent 34%, rgba(2, 8, 11, .2) 78%),
    linear-gradient(128deg, #182227, #0e171b 52%, #172126);
  background-size: 34px 34px, 34px 34px, auto, auto;
  box-shadow: 0 38px 80px rgba(0, 0, 0, .5), inset 0 1px rgba(219, 220, 207, .035), inset 0 -1px rgba(0, 0, 0, .5);
  transform: translateX(-50%) rotate(.35deg) translateZ(-28px);
}

.report-reveal .report-dossier::before {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .012), transparent 18%, transparent 82%, rgba(0, 0, 0, .15)),
    linear-gradient(180deg, transparent 0 78%, rgba(193, 155, 96, .025));
}

.report-reveal .report-dossier::after { right: 7%; bottom: 20px; left: 7%; opacity: .32; }
.report-reveal .report-dossier__spine { top: 3%; width: 24px; }
.report-reveal .report-dossier__identity { top: 45px; bottom: auto; left: 43px; color: rgba(199, 158, 96, .58); }
.report-reveal .report-dossier__identity img { width: 20px; opacity: .6; filter: saturate(.62) brightness(.84); }
.report-reveal .report-dossier__identity strong { font-size: .64rem; }
.report-reveal .report-dossier__identity span { color: rgba(171, 187, 185, .36); }
.report-reveal .report-dossier__system { right: 40px; bottom: 32px; color: rgba(171, 188, 187, .3); }
.report-reveal .report-dossier__micro { top: 22px; right: 9%; color: rgba(202, 158, 92, .5); }
.report-reveal .report-dossier__registration { top: auto; bottom: 68px; left: 43px; color: rgba(168, 185, 184, .24); }

.report-reveal .report-page {
  position: absolute;
  top: 82px;
  left: 50%;
  right: auto;
  width: var(--page-width, 340px);
  margin: 0;
  overflow: hidden;
  outline: 1px solid rgba(231, 220, 198, .18);
  opacity: 1;
  background: #e8e4da;
  box-shadow: 0 24px 50px rgba(0, 0, 0, .46), 0 4px 10px rgba(0, 0, 0, .28);
  filter: none;
  transform: var(--report-transform);
  transform-origin: center 62%;
  transition: transform 1.25s cubic-bezier(.22, 1, .36, 1), box-shadow 1.1s ease;
}

.report-reveal .report-page::after {
  opacity: .24;
  background: linear-gradient(128deg, rgba(7, 13, 15, .1), rgba(5, 11, 14, .3) 78%);
  mix-blend-mode: multiply;
  transition: opacity 1.1s ease;
}

.report-reveal .report-page.is-phase-active::after { opacity: .055; }
.report-reveal .report-page img { filter: none; opacity: 1; }
.report-reveal .report-page > span { color: rgba(228, 218, 198, .7); background: rgba(7, 13, 16, .76); }

.report-reveal .report-page--summary {
  --page-width: 390px;
  z-index: 7;
  top: 86px;
  --report-transform: translateX(-50%) rotate(-.25deg) translateZ(32px);
}

.report-reveal .report-page--technical {
  --page-width: 342px;
  z-index: 3;
  --report-transform: translateX(calc(-50% - 58px)) translateY(9px) rotate(-2.1deg) translateZ(2px);
}

.report-reveal .report-page--service {
  --page-width: 344px;
  z-index: 5;
  --report-transform: translateX(calc(-50% - 28px)) translateY(18px) rotate(-1.05deg) translateZ(14px);
}

.report-reveal .report-page--value {
  --page-width: 340px;
  z-index: 2;
  --report-transform: translateX(calc(-50% + 26px)) translateY(12px) rotate(.9deg) translateZ(-4px);
}

.report-reveal .report-page--personal {
  --page-width: 346px;
  z-index: 6;
  --report-transform: translateX(calc(-50% + 54px)) translateY(8px) rotate(1.8deg) translateZ(20px);
}

.report-reveal[data-active-phase="1"] .report-page--technical {
  --report-transform: translateX(calc(-50% - 112px)) translateY(5px) rotate(-3.1deg) translateZ(10px);
  box-shadow: 0 29px 58px rgba(0, 0, 0, .48), 0 4px 10px rgba(0, 0, 0, .28);
}

.report-reveal[data-active-phase="2"] .report-page--technical,
.report-reveal[data-active-phase="3"] .report-page--technical { --report-transform: translateX(calc(-50% - 82px)) translateY(6px) rotate(-2.6deg) translateZ(8px); }
.report-reveal[data-active-phase="2"] .report-page--service,
.report-reveal[data-active-phase="3"] .report-page--service { --report-transform: translateX(calc(-50% - 94px)) translateY(31px) rotate(-2.25deg) translateZ(15px); }
.report-reveal[data-active-phase="2"] .report-page--value,
.report-reveal[data-active-phase="3"] .report-page--value { --report-transform: translateX(calc(-50% + 87px)) translateY(34px) rotate(2.1deg) translateZ(1px); }
.report-reveal[data-active-phase="3"] .report-page--personal {
  --report-transform: translateX(calc(-50% + 122px)) translateY(7px) rotate(3.15deg) translateZ(22px);
  box-shadow: 0 31px 62px rgba(0, 0, 0, .5), 0 4px 10px rgba(0, 0, 0, .28);
}

.report-reveal[data-active-phase="1"] { --report-light-x: 42%; --report-light-y: 40%; }
.report-reveal[data-active-phase="2"] { --report-light-x: 50%; --report-light-y: 48%; }
.report-reveal[data-active-phase="3"] { --report-light-x: 60%; --report-light-y: 40%; }

.report-reveal__light {
  position: absolute;
  z-index: 9;
  top: var(--report-light-y);
  left: var(--report-light-x);
  width: 760px;
  height: 310px;
  opacity: .56;
  pointer-events: none;
  background: linear-gradient(102deg, transparent 7%, rgba(214, 173, 106, .018) 25%, rgba(235, 198, 135, .13) 43%, rgba(249, 219, 161, .27) 51%, rgba(218, 174, 104, .075) 62%, transparent 83%);
  clip-path: polygon(0 43%, 100% 6%, 100% 58%, 0 96%);
  transform: translate(-50%, -50%) rotate(-7deg);
  mix-blend-mode: normal;
  transition: left 1.35s cubic-bezier(.22, 1, .36, 1), top 1.35s cubic-bezier(.22, 1, .36, 1), opacity .55s ease;
}

.report-reveal__light::after {
  content: "";
  position: absolute;
  inset: 39% 13% 40%;
  opacity: .58;
  background: linear-gradient(90deg, transparent, rgba(252, 224, 174, .2) 48%, transparent);
}

.report-reveal__light::before {
  content: "";
  position: absolute;
  top: 51%;
  right: 17%;
  left: 17%;
  height: 1px;
  opacity: .68;
  background: linear-gradient(90deg, transparent, rgba(252, 221, 166, .48) 48%, transparent);
  box-shadow: 0 0 14px rgba(225, 181, 109, .13);
}

.report-reveal.is-visible .report-reveal__light { animation: report-reveal-breathe 5.5s ease-in-out .15s 1 both; }
.report-reveal.is-pointer-light .report-reveal__light { opacity: .62; animation: none; }

@keyframes report-reveal-breathe {
  0% { opacity: .14; }
  16% { opacity: .34; }
  48% { opacity: .5; }
  74% { opacity: .42; }
  100% { opacity: .46; }
}

.report-reveal .report-annotation {
  z-index: 11;
  width: 235px;
  opacity: .18;
  transition: opacity .8s ease, color .8s ease, transform 1.1s cubic-bezier(.22, 1, .36, 1);
}

.report-reveal .report-annotation::before { width: 66px; transform: scaleX(.54); }
.report-reveal .report-annotation::after { opacity: .22; }
.report-reveal .report-annotation.is-phase-active { opacity: .96; transform: translateY(-4px); }
.report-reveal .report-annotation--model { top: 185px; left: -92px; }
.report-reveal .report-annotation--model::after { left: 100%; width: 88px; }
.report-reveal .report-annotation--individual { top: auto; bottom: 140px; left: -52px; width: 285px; }
.report-reveal .report-annotation--individual::after { left: 100%; width: 108px; }
.report-reveal .report-annotation--personal { top: 203px; right: -100px; }
.report-reveal .report-annotation--personal::after { right: 100%; width: 88px; }

.report-object__signature {
  position: absolute;
  z-index: 12;
  right: 168px;
  bottom: 27px;
  color: rgba(201, 158, 94, .58);
  font-family: var(--font-mono);
  font-size: .52rem;
  letter-spacing: .16em;
}

.report-object__signature span { margin-left: 12px; color: rgba(165, 183, 182, .31); }

.report-reveal .report-preview__footer { margin-top: 20px; }

@media (max-width: 1180px) {
  .report-reveal .report-preview__container { width: min(100% - 56px, 1120px); }
  .report-reveal .report-object { width: 820px; }
  .report-reveal .report-annotation--model { left: -50px; }
  .report-reveal .report-annotation--individual { left: -18px; }
  .report-reveal .report-annotation--personal { right: -52px; }
  .report-signal--risk { left: 1%; }
  .report-signal--history { left: 2%; }
  .report-signal--personal { right: 1%; }
}

@media (max-width: 820px) {
  .report-reveal { min-height: auto; }
  .report-reveal .report-preview__container { width: min(100% - 36px, 620px); padding: 126px 0 104px; }
  .report-reveal .report-preview__stage { display: block; height: auto; min-height: 1280px; margin-top: 74px; padding: 28px 0 54px; perspective: none; }
  .report-reveal .report-preview__stage::before { inset: 0 -8%; }
  .report-reveal .report-preview__stage::after { top: 30px; width: 94%; height: calc(100% - 64px); }
  .report-analysis-space__axis { top: 70px; width: 88%; height: calc(100% - 150px); }
  .report-analysis-space__measure { right: 2%; bottom: 38px; left: 2%; gap: 12px; }
  .report-signal { font-size: .48rem; }
  .report-signal--risk { top: 220px; left: 0; }
  .report-signal--history { bottom: 330px; left: 0; }
  .report-signal--personal { top: auto; right: 0; bottom: 118px; }
  .report-object { position: relative; top: auto; left: auto; display: grid; width: 100%; height: auto; min-height: 1210px; padding-top: 78px; transform: none; }
  .report-reveal .report-dossier { top: 18px; width: min(96%, 430px); height: calc(100% - 42px); transform: translateX(-50%) rotate(.25deg); }
  .report-reveal .report-dossier__identity { top: 38px; left: 28px; }
  .report-reveal .report-dossier__registration { bottom: 72px; left: 28px; }
  .report-reveal .report-dossier__system { right: 28px; bottom: 31px; }
  .report-reveal .report-page,
  .report-reveal .report-page--summary,
  .report-reveal .report-page--technical,
  .report-reveal .report-page--service,
  .report-reveal .report-page--value,
  .report-reveal .report-page--personal {
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    grid-column: 1;
    justify-self: center;
    width: min(78vw, 350px);
    opacity: 1;
    filter: none;
    transform: rotate(var(--mobile-rotate, 0deg));
  }
  .report-reveal .report-page--summary { z-index: 7; margin: 0; --mobile-rotate: -.25deg; }
  .report-reveal .report-page--technical { z-index: 3; margin-top: -355px; margin-left: -20px; --mobile-rotate: -1.8deg; }
  .report-reveal .report-page--service { z-index: 5; margin-top: -350px; margin-left: 18px; --mobile-rotate: 1.1deg; }
  .report-reveal .report-page--value { z-index: 2; margin-top: -350px; margin-left: -14px; --mobile-rotate: -.8deg; }
  .report-reveal .report-page--personal { z-index: 6; margin-top: -350px; margin-left: 20px; --mobile-rotate: 1.55deg; }
  .report-reveal .report-page.is-phase-active { transform: translateY(-8px) rotate(var(--mobile-rotate, 0deg)); }
  .report-reveal .report-annotation {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    grid-column: 1;
    z-index: 11;
    width: min(82%, 300px);
    margin: 22px 0 44px;
    text-align: left;
  }
  .report-reveal .report-annotation--model { justify-self: start; margin-top: -8px; }
  .report-reveal .report-annotation--individual { justify-self: end; margin-top: -4px; }
  .report-reveal .report-annotation--personal { justify-self: start; margin-top: 6px; }
  .report-reveal .report-annotation::after { top: 17px; right: auto; left: 100%; width: 42px; }
  .report-reveal .report-annotation--individual::after { right: 100%; left: auto; }
  .report-reveal .report-annotation--personal::before { margin-left: 0; background: linear-gradient(90deg, rgba(195, 150, 83, .9), rgba(195, 150, 83, .08)); transform-origin: left; }
  .report-reveal .report-annotation--personal::after { right: auto; left: 100%; background: linear-gradient(90deg, rgba(151, 169, 168, .14), rgba(151, 169, 168, .54)); }
  .report-object__signature { right: 28px; bottom: 28px; }
  .report-reveal__light { width: 128vw; height: 300px; opacity: .36; }
  .report-reveal[data-active-phase="0"] { --report-light-x: 50%; --report-light-y: 18%; }
  .report-reveal[data-active-phase="1"] { --report-light-x: 45%; --report-light-y: 35%; }
  .report-reveal[data-active-phase="2"] { --report-light-x: 54%; --report-light-y: 59%; }
  .report-reveal[data-active-phase="3"] { --report-light-x: 50%; --report-light-y: 81%; }
}

@media (max-width: 480px) {
  .report-reveal .report-preview__container { width: calc(100% - 30px); }
  .report-reveal .report-preview__stage { min-height: 1135px; margin-top: 62px; }
  .report-object { min-height: 1080px; }
  .report-reveal .report-page,
  .report-reveal .report-page--summary,
  .report-reveal .report-page--technical,
  .report-reveal .report-page--service,
  .report-reveal .report-page--value,
  .report-reveal .report-page--personal { width: min(81vw, 330px); }
  .report-reveal .report-page--technical,
  .report-reveal .report-page--service,
  .report-reveal .report-page--value,
  .report-reveal .report-page--personal { margin-top: -330px; }
}

@media (prefers-reduced-motion: reduce) {
  .report-reveal { --report-light-x: 53%; --report-light-y: 46%; }
  .report-reveal .report-reveal__light { opacity: .38; animation: none !important; }
  .report-reveal .report-page { opacity: 1; filter: none; }
  .report-reveal .report-page::after { opacity: .1; }
  .report-reveal .report-annotation { opacity: .76; transform: none; }
  .report-reveal .report-signal { opacity: .2; transform: none; }
}

/* Report showcase — illuminated fan composition */
.report-showcase {
  --report-light-x: 50%;
  --report-light-y: 44%;
  --report-beam-shift-x: 0px;
  --report-beam-shift-y: 0px;
  min-height: 1420px;
  overflow: hidden;
  background: #090f14;
}

.report-showcase .report-preview__space {
  position: absolute;
  z-index: -2;
  inset: 0;
  overflow: hidden;
  background:
    linear-gradient(rgba(173, 180, 176, .018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(173, 180, 176, .015) 1px, transparent 1px),
    radial-gradient(ellipse at 48% 45%, rgba(16, 24, 32, .3), transparent 55%),
    linear-gradient(180deg, #101820 0%, #0b131a 48%, #080f14 100%);
  background-size: 56px 56px, 56px 56px, auto, auto;
  box-shadow: inset 0 0 220px rgba(0, 3, 5, .72);
}

.report-showcase .report-preview__space::before,
.report-showcase .report-preview__space::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.report-showcase .report-preview__space::before {
  inset: 0;
  opacity: .3;
  background:
    radial-gradient(circle at 13% 42%, rgba(160, 176, 178, .18) 0 1px, transparent 2px),
    radial-gradient(circle at 75% 19%, rgba(169, 130, 69, .38) 0 1px, transparent 2px),
    radial-gradient(circle at 85% 67%, rgba(160, 176, 178, .18) 0 1px, transparent 2px),
    linear-gradient(142deg, transparent 0 18%, rgba(160, 176, 178, .055) 18.06%, transparent 18.13% 67%, rgba(160, 176, 178, .04) 67.06%, transparent 67.13%),
    linear-gradient(9deg, transparent 0 35%, rgba(160, 176, 178, .04) 35.07%, transparent 35.14% 74%, rgba(160, 176, 178, .03) 74.07%, transparent 74.14%);
}

.report-showcase .report-preview__space::after {
  inset: 0;
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .16), transparent 24%, transparent 76%, rgba(0, 0, 0, .58)),
    linear-gradient(90deg, rgba(0, 0, 0, .5), transparent 19%, transparent 84%, rgba(0, 0, 0, .5));
}

.report-showcase .report-preview__container {
  width: min(100% - 96px, 1500px);
  padding: 176px 0 104px;
}

.report-showcase .report-preview__intro {
  margin-top: 22px;
  line-height: 1.65;
}

.report-showcase .report-preview__stage {
  position: relative;
  height: 770px;
  margin-top: 24px;
  perspective: none;
}

.report-showcase .report-preview__stage::before {
  top: 50%;
  left: 54%;
  width: min(83%, 1120px);
  height: 64%;
  opacity: .68;
  background: radial-gradient(ellipse, rgba(0, 0, 0, .73), rgba(0, 0, 0, .26) 58%, transparent 76%);
  transform: translate(-50%, -50%);
}

.report-showcase .report-preview__stage::after {
  display: none;
}

.report-showcase__geometry,
.report-showcase__signals {
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
}

.report-showcase__geometry::before,
.report-showcase__geometry::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(160, 176, 178, .07);
  border-radius: 50%;
}

.report-showcase__geometry::before {
  top: 58px;
  left: 4%;
  width: 74%;
  height: 720px;
  clip-path: inset(0 0 18% 0);
}

.report-showcase__geometry::after {
  top: 205px;
  left: 15%;
  width: 52%;
  height: 510px;
  opacity: .38;
}

.report-showcase__geometry i {
  position: absolute;
  width: 1px;
  height: 76%;
  opacity: .12;
  background: linear-gradient(transparent, rgba(160, 176, 178, .18), transparent);
  transform-origin: 50% 50%;
}

.report-showcase__geometry i::after {
  content: "";
  position: absolute;
  top: 26%;
  left: -2px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(160, 176, 178, .34);
  box-shadow: none;
}

.report-showcase__geometry i:nth-child(1) { top: 7%; left: 17%; transform: rotate(72deg); }
.report-showcase__geometry i:nth-child(2) { top: -2%; left: 38%; transform: rotate(91deg); }
.report-showcase__geometry i:nth-child(3) { top: 9%; left: 62%; transform: rotate(48deg); }
.report-showcase__geometry i:nth-child(4) { top: 26%; left: 78%; transform: rotate(104deg); }
.report-showcase__geometry i:nth-child(5) { top: 32%; left: 28%; transform: rotate(125deg); }
.report-showcase__geometry i:nth-child(6) { top: 40%; left: 54%; transform: rotate(63deg); }

.report-showcase .report-signal {
  position: absolute;
  z-index: 2;
  opacity: .15;
  color: rgba(160, 176, 178, .68);
  font-family: var(--font-mono);
  font-size: .56rem;
  letter-spacing: .17em;
  line-height: 1.75;
  transition: opacity .8s ease, color .8s ease, transform .9s ease;
}

.report-showcase .report-signal::before {
  content: "";
  display: block;
  width: 54px;
  height: 1px;
  margin-bottom: 9px;
  background: linear-gradient(90deg, rgba(160, 176, 178, .18), transparent);
}

.report-showcase .report-signal--source { top: 74px; left: 49%; }
.report-showcase .report-signal--risk { top: 130px; right: 9%; left: auto; }
.report-showcase .report-signal--market { top: 348px; right: 1%; bottom: auto; left: auto; text-align: right; }
.report-showcase .report-signal--market::before { margin-left: auto; background: linear-gradient(90deg, transparent, rgba(160, 176, 178, .18)); }
.report-showcase .report-signal--fit { bottom: 74px; left: 31%; }

.report-showcase__beam {
  position: absolute;
  z-index: 8;
  top: -214px;
  left: -212px;
  width: 1120px;
  height: 430px;
  opacity: .58;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 0%, rgba(169, 130, 69, .014) 18%, rgba(197, 158, 96, .05) 35%, rgba(214, 181, 125, .105) 46%, rgba(244, 224, 184, .14) 50%, rgba(214, 181, 125, .09) 59%, rgba(169, 130, 69, .03) 75%, transparent 100%);
  clip-path: polygon(0 43%, 100% 4%, 100% 96%, 0 57%);
  -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, .32) 0%, #000 10%, #000 45%, rgba(0, 0, 0, .76) 61%, rgba(0, 0, 0, .34) 79%, transparent 100%);
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, .32) 0%, #000 10%, #000 45%, rgba(0, 0, 0, .76) 61%, rgba(0, 0, 0, .34) 79%, transparent 100%);
  transform: translate3d(var(--report-beam-shift-x), var(--report-beam-shift-y), 0) rotate(31deg);
  transform-origin: 0 50%;
  transition: opacity .8s ease;
  will-change: transform;
}

.report-showcase__beam::before,
.report-showcase__beam::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.report-showcase__beam::before {
  top: 38%;
  right: 4%;
  left: 1%;
  height: 24%;
  opacity: .58;
  background: linear-gradient(180deg, transparent 0%, rgba(214, 181, 125, .08) 25%, rgba(244, 224, 184, .31) 47%, rgba(214, 181, 125, .27) 54%, rgba(197, 158, 96, .065) 76%, transparent 100%);
  clip-path: polygon(0 45%, 100% 13%, 100% 87%, 0 55%);
  -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 39%, rgba(0, 0, 0, .68) 59%, rgba(0, 0, 0, .22) 80%, transparent 100%);
  mask-image: linear-gradient(90deg, #000 0%, #000 39%, rgba(0, 0, 0, .68) 59%, rgba(0, 0, 0, .22) 80%, transparent 100%);
}

.report-showcase__beam::after {
  inset: 16% 7% 16% 3%;
  opacity: .16;
  background-image:
    radial-gradient(circle at 8% 46%, rgba(244, 224, 184, .58) 0 .9px, transparent 1.15px),
    radial-gradient(circle at 19% 63%, rgba(214, 181, 125, .46) 0 .7px, transparent 1px),
    radial-gradient(circle at 31% 32%, rgba(244, 224, 184, .52) 0 .8px, transparent 1.1px),
    radial-gradient(circle at 43% 57%, rgba(214, 181, 125, .44) 0 .65px, transparent .95px),
    radial-gradient(circle at 56% 27%, rgba(244, 224, 184, .4) 0 .7px, transparent 1px),
    radial-gradient(circle at 66% 69%, rgba(214, 181, 125, .36) 0 .75px, transparent 1px),
    radial-gradient(circle at 74% 42%, rgba(244, 224, 184, .34) 0 .6px, transparent .9px),
    radial-gradient(circle at 84% 59%, rgba(214, 181, 125, .28) 0 .65px, transparent .95px);
  background-repeat: no-repeat;
  -webkit-mask-image: linear-gradient(90deg, #000, rgba(0, 0, 0, .62) 58%, transparent 100%);
  mask-image: linear-gradient(90deg, #000, rgba(0, 0, 0, .62) 58%, transparent 100%);
}

.report-showcase.is-visible .report-showcase__beam {
  animation: report-showcase-light 1.4s cubic-bezier(.22, 1, .36, 1) .15s 1 both;
}

@keyframes report-showcase-light {
  0% { opacity: .36; }
  42% { opacity: .72; }
  100% { opacity: .56; }
}

.report-showcase.is-sequence-complete .report-showcase__beam {
  opacity: .56;
  animation: none;
}

.report-showcase.is-pointer-light .report-showcase__beam {
  opacity: .61;
  animation: none;
  transform: translate3d(var(--report-beam-shift-x), var(--report-beam-shift-y), 0) rotate(31deg);
}

.report-showcase .report-object {
  position: absolute;
  z-index: 4;
  top: -6px;
  left: calc(50% - 599px);
  width: 1110px;
  height: 730px;
  transform: none;
  transform-style: flat;
}

.report-showcase .report-object::after {
  content: "";
  position: absolute;
  z-index: 10;
  inset: -7% -8%;
  opacity: .13;
  pointer-events: none;
  background:
    radial-gradient(ellipse 38% 32% at var(--report-light-x) var(--report-light-y), rgba(214, 181, 125, .27), rgba(197, 158, 96, .075) 43%, transparent 73%),
    linear-gradient(132deg, rgba(244, 224, 184, .035), transparent 34%);
  mix-blend-mode: screen;
  transition: opacity .7s ease;
}

.report-showcase.is-pointer-light .report-object::after { opacity: .2; }

.report-showcase .report-dossier {
  position: absolute;
  z-index: 1;
  top: 83px;
  left: 84px;
  width: 425px;
  height: 604px;
  overflow: hidden;
  clip-path: none;
  border: 1px solid rgba(160, 176, 178, .18);
  border-radius: 1px;
  background:
    linear-gradient(108deg, rgba(218, 224, 223, .025), transparent 21%, transparent 74%, rgba(0, 0, 0, .25)),
    repeating-linear-gradient(87deg, rgba(255, 255, 255, .012) 0 1px, transparent 1px 4px),
    linear-gradient(135deg, #20282d, #101820 58%, #11191f);
  box-shadow: 0 34px 70px rgba(0, 0, 0, .66), inset 1px 0 rgba(236, 193, 121, .08), inset -9px 0 20px rgba(0, 0, 0, .26);
  transform: rotate(-6.7deg);
  transition: none;
}

.report-showcase .report-dossier::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .58;
  background:
    radial-gradient(ellipse 74% 44% at var(--report-light-x) var(--report-light-y), rgba(214, 181, 125, .15), rgba(169, 130, 69, .035) 46%, transparent 74%),
    linear-gradient(134deg, rgba(218, 224, 223, .035), transparent 42%);
}

.report-showcase .report-dossier::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 42px;
  width: 1px;
  background: rgba(197, 154, 90, .24);
  box-shadow: 8px 0 18px rgba(0, 0, 0, .55);
}

.report-showcase .report-dossier__identity {
  position: absolute;
  z-index: 2;
  top: 188px;
  left: 94px;
  display: grid;
  width: 190px;
  gap: 18px;
  color: rgba(206, 164, 100, .82);
  transform: rotate(.5deg);
}

.report-showcase .report-dossier__identity img {
  width: 188px;
  height: auto;
  opacity: .88;
  filter: none;
}

.report-showcase .report-dossier__identity span {
  padding-left: 42px;
  font-family: var(--font-mono);
  font-size: .54rem;
  letter-spacing: .2em;
}

.report-showcase .report-dossier__system,
.report-showcase .report-dossier__micro {
  position: absolute;
  z-index: 2;
  color: rgba(205, 157, 87, .7);
  font-family: var(--font-mono);
  font-size: .52rem;
  letter-spacing: .18em;
  line-height: 1.8;
}

.report-showcase .report-dossier__system { right: 65px; bottom: 76px; }
.report-showcase .report-dossier__micro { top: auto; right: auto; bottom: 45px; left: 21px; writing-mode: vertical-rl; }

.report-showcase .report-page {
  position: absolute;
  top: 92px;
  left: 245px;
  right: auto;
  width: 402px;
  margin: 0;
  overflow: hidden;
  outline: 1px solid rgba(218, 224, 223, .2);
  background: #f2f1ed;
  box-shadow: 0 28px 62px rgba(0, 0, 0, .6), 0 4px 12px rgba(0, 0, 0, .34);
  transform: var(--showcase-page-transform);
  transform-origin: 50% 92%;
}

.report-showcase .report-page::after { display: none; }

.report-showcase .report-page img {
  display: block;
  width: 100%;
  height: auto;
}

.report-showcase .report-page > span {
  right: 13px;
  bottom: 12px;
  color: rgba(218, 224, 223, .7);
  background: rgba(8, 15, 20, .78);
}

.report-showcase .report-page--summary {
  z-index: 7;
  --showcase-page-transform: translateX(0) rotate(-.5deg);
}

.report-showcase .report-page--technical {
  z-index: 6;
  --showcase-page-transform: translateX(96px) translateY(16px) rotate(1.05deg);
}

.report-showcase .report-page--service {
  z-index: 5;
  --showcase-page-transform: translateX(247px) translateY(36px) rotate(3.82deg);
}

.report-showcase .report-page--value {
  z-index: 4;
  --showcase-page-transform: translateX(307px) translateY(21px) rotate(2.48deg);
}

.report-showcase .report-page--personal {
  z-index: 3;
  --showcase-page-transform: translateX(426px) translateY(65px) rotate(6.08deg);
}

.report-showcase .report-page__brand {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 11px;
  display: grid;
  place-items: center;
  width: 147px;
  min-height: 46px;
  padding: 5px 9px 4px;
  border: 1px solid rgba(169, 130, 69, .24);
  background: rgba(9, 15, 20, .985);
  box-shadow: 0 4px 12px rgba(0, 0, 0, .18);
}

.report-showcase .report-page__brand img {
  width: auto;
  max-width: 100%;
  height: 34px;
  object-fit: contain;
}

.report-showcase .report-page__brand::after {
  content: "SAMPLE / 001";
  justify-self: end;
  padding-right: 2px;
  color: rgba(199, 150, 76, .76);
  font-family: var(--font-mono);
  font-size: .39rem;
  letter-spacing: .17em;
  line-height: 1;
}

.report-showcase .report-object__signature {
  position: absolute;
  z-index: 12;
  right: 40px;
  bottom: 1px;
  color: rgba(203, 153, 80, .52);
  font-family: var(--font-mono);
  font-size: .52rem;
  letter-spacing: .18em;
}

.report-showcase__annotations {
  position: absolute;
  z-index: 12;
  right: 2%;
  bottom: 12px;
  left: 2%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 42px;
  pointer-events: none;
}

.report-showcase .report-annotation {
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  width: auto;
  opacity: .44;
  color: rgba(218, 224, 223, .7);
  text-align: left;
  transform: none;
  transition: opacity .8s ease, transform .8s ease;
}

.report-showcase .report-annotation::before {
  width: 56px;
  background: linear-gradient(90deg, rgba(160, 176, 178, .18), rgba(160, 176, 178, .02));
  transform: scaleX(.55);
}

.report-showcase .report-annotation::after {
  display: none;
}

.report-showcase .report-annotation span { color: rgba(160, 176, 178, .72); }

.report-showcase .report-preview__footer {
  margin-top: 10px;
  border-top-color: rgba(160, 176, 178, .18);
}

.report-showcase .report-preview__eyebrow,
.report-showcase .report-preview__sample p { color: #c7964c; }
.report-showcase h2 { color: #f6f2e9; }
.report-showcase .report-preview__intro,
.report-showcase .report-preview__sample span,
.report-showcase .report-preview__footer p { color: rgba(218, 224, 223, .7); }
.report-showcase .report-preview__sample { border-left-color: rgba(169, 130, 69, .38); }
.report-showcase .report-preview__footer::before { color: rgba(160, 176, 178, .5); }
.report-showcase .report-preview__footer p span { color: #f4f1ea; }
.report-showcase .report-preview__footer a { color: #f4f1ea; border-bottom-color: #a98245; }
.report-showcase .report-preview__footer a span { color: #c7964c; }

@media (max-width: 1220px) {
  .report-showcase .report-preview__container { width: min(100% - 56px, 1120px); }
  .report-showcase .report-object { left: calc(50% - 551px); width: 1020px; }
  .report-showcase .report-signal--risk { right: 4%; }
  .report-showcase .report-signal--logic { right: 2%; }
}

@media (max-width: 820px) {
  .report-showcase { min-height: auto; }
  .report-showcase .report-preview__container { width: min(100% - 36px, 620px); padding: 126px 0 104px; }
  .report-showcase .report-preview__stage { height: 880px; margin-top: 54px; perspective: none; }
  .report-showcase__geometry::before { top: 75px; left: -20%; width: 130%; height: 620px; }
  .report-showcase__geometry::after { top: 190px; left: -5%; width: 86%; height: 440px; }
  .report-showcase__signals .report-signal { font-size: .47rem; }
  .report-showcase .report-signal--source { top: 48px; right: 0; left: auto; text-align: right; }
  .report-showcase .report-signal--risk { top: 167px; right: 0; }
  .report-showcase .report-signal--market { top: auto; right: 0; bottom: 184px; }
  .report-showcase .report-signal--fit { display: none; }
  .report-showcase__beam { top: -105px; left: -260px; width: 760px; height: 310px; opacity: .56; }
  .report-showcase .report-object { top: 82px; left: calc(50% - 210px); width: 420px; height: 585px; transform: none; }
  .report-showcase .report-dossier { top: 59px; left: 22px; width: 272px; height: 430px; transform: rotate(-6deg); }
  .report-showcase .report-dossier__identity { top: 143px; left: 61px; width: 128px; gap: 12px; }
  .report-showcase .report-dossier__identity img { width: 128px; }
  .report-showcase .report-dossier__identity span { padding-left: 26px; font-size: .42rem; }
  .report-showcase .report-dossier__system { right: 38px; bottom: 45px; font-size: .42rem; }
  .report-showcase .report-dossier__micro { display: none; }
  .report-showcase .report-page { top: 72px; left: 83px; width: min(66vw, 280px); }
  .report-showcase .report-page--summary { --showcase-page-transform: translateX(0) rotate(-.6deg); }
  .report-showcase .report-page--technical { --showcase-page-transform: translateX(27px) translateY(7px) rotate(1.6deg); }
  .report-showcase .report-page--service { --showcase-page-transform: translateX(53px) translateY(14px) rotate(3deg); }
  .report-showcase .report-page--value { --showcase-page-transform: translateX(78px) translateY(23px) rotate(4.4deg); }
  .report-showcase .report-page--personal { --showcase-page-transform: translateX(101px) translateY(34px) rotate(5.6deg); }
  .report-showcase .report-page__brand { top: 0; left: 7px; width: 101px; min-height: 33px; padding: 3px 6px 2px; }
  .report-showcase .report-page__brand::after { font-size: .28rem; }
  .report-showcase .report-object__signature { right: 4px; bottom: 28px; }
  .report-showcase__annotations { right: 0; bottom: 8px; left: 0; grid-template-columns: 1fr; gap: 20px; }
  .report-showcase .report-annotation { width: min(78%, 300px); }
  .report-showcase .report-annotation:nth-child(2) { justify-self: end; }
  .report-showcase .report-preview__footer { margin-top: 40px; }
}

@media (max-width: 480px) {
  .report-showcase .report-preview__container { width: calc(100% - 30px); }
  .report-showcase .report-preview__stage { height: 820px; }
  .report-showcase .report-object { left: calc(50% - 185px); width: 370px; height: 530px; }
  .report-showcase .report-dossier { left: 25px; width: 245px; height: 385px; }
  .report-showcase .report-dossier__identity { top: 126px; left: 53px; }
  .report-showcase .report-page { top: 69px; left: 72px; width: min(64vw, 250px); }
  .report-showcase .report-page--technical { --showcase-page-transform: translateX(22px) translateY(6px) rotate(1.5deg); }
  .report-showcase .report-page--service { --showcase-page-transform: translateX(43px) translateY(12px) rotate(2.9deg); }
  .report-showcase .report-page--value { --showcase-page-transform: translateX(63px) translateY(19px) rotate(4.1deg); }
  .report-showcase .report-page--personal { --showcase-page-transform: translateX(81px) translateY(28px) rotate(5.3deg); }
  .report-showcase .report-page__brand { width: 87px; }
  .report-showcase .report-object__signature { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .report-showcase *,
  .report-showcase *::before,
  .report-showcase *::after { animation: none !important; transition: none !important; }
  .report-showcase .report-showcase__beam { opacity: .58; }
  .report-showcase .report-object::after { opacity: .14; }
  .report-showcase .report-annotation { opacity: .76; transform: none; }
  .report-showcase .report-signal { opacity: .34; transform: none; }
}

/* Homepage conversion close: process, FAQ, CTA and footer */
.faq { position: relative; overflow: hidden; color: #edf0ea; background: linear-gradient(90deg, rgba(169, 130, 69, .09) 1px, transparent 1px) 0 0 / 88px 88px, linear-gradient(rgba(160, 176, 178, .055) 1px, transparent 1px) 0 0 / 88px 88px, #101820; }
.faq::before { content: ""; position: absolute; top: 0; right: 9%; left: 9%; height: 1px; background: rgba(218, 224, 223, .16); }
.faq__container { width: min(1040px, calc(100% - 64px)); margin: 0 auto; padding: clamp(104px, 11vw, 158px) 0; }
.faq__header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, .7fr); gap: 24px 80px; align-items: end; margin-bottom: 64px; }
.faq__eyebrow, .final-cta__eyebrow { margin: 0 0 17px; color: #a98245; font-size: .7rem; font-weight: 750; letter-spacing: .19em; }
.faq h2 { grid-column: 1; margin: 0; max-width: 610px; color: #f6f2e9; font-family: var(--font-serif); font-size: clamp(2.3rem, 4.25vw, 4rem); font-weight: 400; line-height: 1.06; letter-spacing: -.045em; }
.faq__header > p:last-child { grid-column: 2; margin: 0 0 4px; color: rgba(218, 224, 223, .68); font-size: 1rem; line-height: 1.72; }
.faq__list { border-top: 1px solid rgba(218, 224, 223, .2); }
.faq__item { border-bottom: 1px solid rgba(218, 224, 223, .2); }
.faq__item summary { position: relative; display: grid; grid-template-columns: 48px 1fr 24px; gap: 16px; align-items: center; padding: 24px 8px; color: #f6f2e9; cursor: pointer; font-size: clamp(1.02rem, 1.6vw, 1.22rem); font-weight: 500; line-height: 1.42; list-style: none; }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary > span { color: #a98245; font-family: var(--font-mono); font-size: .67rem; letter-spacing: .12em; }
.faq__item summary i, .faq__item summary i::after { position: absolute; right: 8px; width: 13px; height: 1px; background: #a98245; content: ""; transition: transform .28s ease; }
.faq__item summary i::after { right: 0; transform: rotate(90deg); }
.faq__item[open] summary i::after { transform: rotate(0); }
.faq__item > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .68fr); padding: 0 48px 27px 64px; }
.faq__item p { grid-column: 2; margin: 0; color: rgba(218, 224, 223, .68); font-size: .98rem; line-height: 1.76; }
.faq__more { display: inline-flex; gap: 9px; margin-top: 35px; padding-bottom: 4px; border-bottom: 1px solid #a98245; color: #f5f0e4; font-size: .85rem; font-weight: 700; letter-spacing: .04em; text-decoration: none; }
.faq__links { display: flex; flex-wrap: wrap; gap: 24px 38px; }
.faq__more span, .final-cta__link span { color: #a98245; transition: transform .28s ease; }
.faq__more:hover span, .faq__more:focus-visible span, .final-cta__link:hover span, .final-cta__link:focus-visible span { transform: translateX(4px); }

.final-cta { position: relative; overflow: hidden; color: #f6f2e9; background: #0a1117; }
.final-cta::before { content: ""; position: absolute; inset: 0; background: linear-gradient(122deg, rgba(169, 130, 69, .13), transparent 36%), linear-gradient(90deg, rgba(218, 224, 223, .055) 1px, transparent 1px) 0 0 / 108px 108px; opacity: .72; pointer-events: none; }
.final-cta__container { position: relative; width: min(1040px, calc(100% - 64px)); margin: 0 auto; padding: clamp(110px, 12vw, 168px) 0; }
.final-cta h2 { max-width: 710px; margin: 0; font-family: var(--font-serif); font-size: clamp(2.7rem, 5.2vw, 5rem); font-weight: 400; line-height: 1; letter-spacing: -.055em; }
.final-cta__container > p:not(.final-cta__eyebrow) { max-width: 595px; margin: 29px 0 0; color: rgba(218, 224, 223, .73); font-size: 1.07rem; line-height: 1.75; }
.final-cta__actions { display: flex; align-items: center; gap: 32px; margin-top: 41px; }
.final-cta__link { display: inline-flex; gap: 10px; color: rgba(245, 240, 228, .82); font-size: .86rem; text-decoration: none; }

.floating-order-cta { position: fixed; z-index: 30; right: clamp(18px, 3vw, 46px); bottom: clamp(18px, 3vw, 36px); display: inline-flex; align-items: center; gap: 10px; min-height: 49px; padding: 0 17px; border: 1px solid rgba(197, 150, 76, .78); color: #fbf2df; background: rgba(8, 15, 20, .93); box-shadow: 0 12px 28px rgba(0, 0, 0, .26); font-size: .72rem; font-weight: 750; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }
.floating-order-cta[hidden] { display: none; }
.floating-order-cta i { color: #c7964c; font-size: 1rem; font-style: normal; transition: transform .26s ease; }
.floating-order-cta:hover, .floating-order-cta:focus-visible { border-color: #d6ad6a; color: #fffaf0; }
.floating-order-cta:hover i, .floating-order-cta:focus-visible i { transform: translateX(3px); }

.site-footer { color: rgba(218, 224, 223, .7); background: #060b0f; }
.site-footer__container { display: grid; grid-template-columns: minmax(260px, 1.2fr) minmax(450px, 1fr); gap: 92px; width: min(1180px, calc(100% - 64px)); margin: 0 auto; padding: 74px 0 60px; }
.site-footer__brand img { display: block; width: min(250px, 100%); height: auto; max-height: 90px; object-fit: contain; object-position: left center; }
.site-footer__brand p { max-width: 280px; margin: 22px 0 0; font-size: .89rem; line-height: 1.65; }
.site-footer__social { display: grid; justify-items: start; gap: 9px; margin-top: 28px; }
.site-footer__social .site-footer__social-label { margin: 0; color: rgba(218, 224, 223, .84); font-size: .78rem; font-weight: 650; line-height: 1.4; }
.site-footer__instagram { display: inline-flex; align-items: center; gap: 9px; color: #d8b06d; font-size: .8rem; text-decoration: none; }
.site-footer__instagram-icon { width: 19px; height: 19px; flex: 0 0 auto; }
.site-footer__links { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.site-footer__links div { display: grid; align-content: start; gap: 13px; }
.site-footer__links p { margin: 0 0 3px; color: #a98245; font-family: var(--font-mono); font-size: .62rem; font-weight: 700; letter-spacing: .16em; }
.site-footer__links a { color: rgba(218, 224, 223, .67); font-size: .8rem; text-decoration: none; transition: color .2s ease; }
.site-footer__links a:hover, .site-footer__links a:focus-visible { color: #f8f1e3; }
.site-footer__base { display: flex; justify-content: space-between; width: min(1180px, calc(100% - 64px)); margin: 0 auto; padding: 22px 0 28px; border-top: 1px solid rgba(218, 224, 223, .11); color: rgba(160, 176, 178, .55); font-family: var(--font-mono); font-size: .59rem; letter-spacing: .13em; }

.cookie-notice { box-sizing: border-box; position: fixed; z-index: 100; left: 18px; bottom: max(18px, env(safe-area-inset-bottom, 0px)); display: grid; gap: 16px; width: min(390px, calc(100% - 36px)); padding: 21px 23px; border: 1px solid rgba(197, 150, 76, .7); color: #f3efe7; background: #0a141b; box-shadow: 0 16px 42px rgba(0, 0, 0, .35); }
.cookie-notice__message { margin: 0; font-size: .88rem; line-height: 1.6; }
.cookie-notice__message strong { display: block; margin-bottom: 5px; color: #fff9ec; font-weight: 700; }
.cookie-notice__actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.cookie-notice__actions a { color: #d8b06d; font-size: .8rem; text-underline-offset: 3px; }
.cookie-notice__button { min-width: 72px; min-height: 40px; padding: 8px 16px; border: 1px solid #c7964c; color: #0a141b; background: #d8b06d; font: inherit; font-size: .8rem; font-weight: 750; cursor: pointer; }
.cookie-notice__button:hover { background: #f1ca88; }
.cookie-notice__actions a:focus-visible, .cookie-notice__button:focus-visible { outline: 2px solid #fff9ec; outline-offset: 3px; }

@media (max-width: 600px) {
  body:not([data-page]) .cookie-notice { bottom: calc(82px + env(safe-area-inset-bottom, 0px)); }
}

/* Supporting routes and order-flow foundation */
.inner-header { display: flex; align-items: center; justify-content: space-between; gap: 32px; width: min(1180px, calc(100% - 64px)); min-height: 104px; margin: 0 auto; }
.inner-nav { display: flex; align-items: center; gap: clamp(16px, 2vw, 32px); }
.inner-header .language-switcher { margin-left: auto; }
.inner-nav a { color: rgba(245, 240, 228, .74); font-size: .79rem; letter-spacing: .045em; text-decoration: none; }
.inner-nav a:hover, .inner-nav a:focus-visible { color: #fff; }
.inner-nav .inner-nav__cta { padding: 13px 16px; border: 1px solid rgba(197, 150, 76, .68); color: #f8f0df; font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.inner-nav__cta span { color: #c7964c; }
.inner-header__mobile-cta { display: none; }
.inner-page { min-height: calc(100svh - 104px); color: #263037; background: #e8e7e1; }
.inner-page__header { position: relative; display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(260px, .72fr); gap: 25px 90px; width: min(1120px, calc(100% - 64px)); margin: 0 auto; padding: clamp(86px, 11vw, 150px) 0 clamp(78px, 9vw, 120px); }
.inner-page__header::after { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 1px; background: rgba(70, 76, 77, .25); }
.inner-page__header > p { grid-column: 1 / -1; margin: 0; color: #a98245; font-size: .7rem; font-weight: 750; letter-spacing: .18em; }
.inner-page__header h1 { grid-column: 1; margin: 0; color: #263037; font-family: var(--font-serif); font-size: clamp(2.7rem, 5.3vw, 5rem); font-weight: 400; line-height: 1.02; letter-spacing: -.055em; }
.inner-page__header > div { align-self: end; padding-bottom: 6px; color: #5e6665; font-size: 1rem; line-height: 1.75; }
.inner-page__header > div p { margin: 0; }
.principles { display: grid; grid-template-columns: minmax(250px, .7fr) minmax(0, 1.55fr); gap: 78px; width: min(1120px, calc(100% - 64px)); margin: 0 auto; padding: clamp(86px, 10vw, 136px) 0; }
.principles__intro > p, .contact-panel__intro > p:first-child, .legal-note > p { margin: 0 0 15px; color: #a98245; font-size: .68rem; font-weight: 750; letter-spacing: .16em; }
.principles h2, .contact-panel h2, .legal-note h2 { margin: 0; color: #2a3034; font-family: var(--font-serif); font-size: clamp(2rem, 3.2vw, 3.15rem); font-weight: 400; line-height: 1.08; letter-spacing: -.04em; }
.principles__grid { display: grid; gap: 0; border-top: 1px solid rgba(70, 76, 77, .25); }
.principles__grid article { display: grid; grid-template-columns: 56px minmax(130px, .55fr) minmax(0, 1fr); gap: 18px; align-items: baseline; padding: 27px 0; border-bottom: 1px solid rgba(70, 76, 77, .25); }
.principles__grid span { color: #a98245; font-family: var(--font-mono); font-size: .68rem; }
.principles__grid h3 { margin: 0; font-size: 1rem; }
.principles__grid p { margin: 0; color: #616864; font-size: .93rem; line-height: 1.65; }
.about-story { display: grid; grid-template-columns: minmax(250px, .7fr) minmax(0, 1.55fr); gap: 78px; width: min(1120px, calc(100% - 64px)); margin: 0 auto; padding: clamp(86px, 10vw, 136px) 0; border-bottom: 1px solid rgba(70, 76, 77, .25); }
.about-story__intro > p:first-child { margin: 0 0 15px; color: #a98245; font-size: .68rem; font-weight: 750; letter-spacing: .16em; }
.about-story h2 { margin: 0; color: #2a3034; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 3.2vw, 3.15rem); font-weight: 400; line-height: 1.08; letter-spacing: -.04em; }
.about-story__lead { max-width: 360px; margin: 26px 0 0; color: #5d6661; font-size: 1rem; line-height: 1.75; }
.about-story__beacon { position: relative; width: clamp(126px, 13vw, 168px); margin: clamp(42px, 5vw, 68px) 0 0 3px; }
.about-story__beacon::before { content: ""; position: absolute; z-index: -1; inset: 22% 16% 26%; border-radius: 50%; background: radial-gradient(circle, rgba(234, 193, 113, .34) 0%, rgba(190, 137, 62, .14) 43%, transparent 74%); filter: blur(12px); animation: about-beacon-light 8s ease-in-out infinite; }
.about-story__beacon img { display: block; width: 100%; height: auto; filter: drop-shadow(0 0 8px rgba(213, 165, 83, .14)); animation: about-beacon-mark 8s ease-in-out infinite; }
@keyframes about-beacon-light { 0%, 100% { opacity: .48; transform: scale(.92); } 50% { opacity: .96; transform: scale(1.09); } }
@keyframes about-beacon-mark { 0%, 100% { filter: drop-shadow(0 0 8px rgba(213, 165, 83, .14)); transform: translateY(0); } 50% { filter: drop-shadow(0 0 16px rgba(236, 188, 103, .35)); transform: translateY(-2px); } }
.about-story__content { display: grid; gap: 23px; align-content: start; max-width: 620px; }
.about-story__content > p { margin: 0; color: #616864; font-size: 1rem; line-height: 1.75; }
.about-story__turn { padding: 20px 0 21px; border-top: 1px solid rgba(70, 76, 77, .25); border-bottom: 1px solid rgba(70, 76, 77, .25); color: #2a3034 !important; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.3rem, 2.1vw, 1.7rem) !important; line-height: 1.25 !important; }
.about-story__principle { display: grid; gap: 13px; padding: 28px 30px; border-left: 2px solid #a98245; background: rgba(169, 130, 69, .08); }
.about-story__principle p { margin: 0; color: #616864; font-size: .97rem; line-height: 1.7; }
.about-story__principle p:first-child { color: #2a3034; font-weight: 750; }
.about-story blockquote { margin: 9px 0 5px; padding: 27px 0 3px; border-top: 1px solid rgba(70, 76, 77, .25); color: #2a3034; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.55rem, 2.8vw, 2.35rem); font-weight: 400; line-height: 1.2; letter-spacing: -.03em; }
.about-story__contact { display: grid; gap: 16px; margin-top: 13px; padding-top: 29px; border-top: 1px solid rgba(70, 76, 77, .25); }
.about-story__contact p { margin: 0; color: #616864; font-size: 1rem; line-height: 1.75; }
.about-story__contact strong { color: #2a3034; font-family: Georgia, "Times New Roman", serif; font-size: 1.4rem; font-weight: 400; line-height: 1.3; }
.about-story__contact span { color: #a98245; font-size: .82rem; font-weight: 750; letter-spacing: .08em; }
.inner-page__closing { padding: clamp(86px, 10vw, 140px) max(32px, calc((100vw - 1120px) / 2)); color: #f3eee5; background: #0a1117; }
.inner-page__closing > p { margin: 0 0 19px; color: #c7964c; font-family: var(--font-mono); font-size: .65rem; letter-spacing: .15em; }
.inner-page__closing h2 { max-width: 850px; margin: 0; font-family: var(--font-serif); font-size: clamp(2rem, 3.6vw, 3.6rem); font-weight: 400; line-height: 1.14; letter-spacing: -.035em; }
.inner-page__closing a { display: inline-flex; gap: 9px; margin-top: 30px; padding-bottom: 5px; border-bottom: 1px solid #a98245; color: #f3eee5; font-size: .84rem; text-decoration: none; }
.inner-page__closing a span { color: #c7964c; }
.contact-panel { display: grid; grid-template-columns: minmax(250px, .75fr) minmax(0, 1.1fr); gap: 88px; width: min(1040px, calc(100% - 64px)); margin: 0 auto; padding: clamp(82px, 10vw, 136px) 0; }
.contact-panel__intro > p:last-child { max-width: 390px; margin: 25px 0 0; color: #606864; font-size: 1rem; font-weight: 400; letter-spacing: normal; line-height: 1.75; }
.contact-details { align-self: start; border-top: 1px solid rgba(70, 76, 77, .25); }
.contact-details__item { padding: 24px 0 28px; border-bottom: 1px solid rgba(70, 76, 77, .25); }
.contact-details__item p { margin: 0 0 13px; color: #a98245; font-size: .68rem; font-weight: 750; letter-spacing: .16em; }
.contact-details__item a { display: inline-block; color: #263037; font-size: clamp(1.25rem, 2.2vw, 1.8rem); line-height: 1.3; text-decoration: none; overflow-wrap: anywhere; }
.contact-details__item a:hover, .contact-details__item a:focus-visible { color: #a98245; text-decoration: underline; text-underline-offset: 5px; }
.contact-details__item small { display: block; max-width: 430px; margin-top: 14px; color: #606864; font-size: .78rem; line-height: 1.6; }
.order-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 21px; }
.order-fields label { display: grid; gap: 8px; color: #3c4545; font-size: .78rem; font-weight: 700; letter-spacing: .02em; }
.order-fields input, .order-fields textarea { width: 100%; padding: 12px 0; border: 0; border-bottom: 1px solid rgba(63, 70, 69, .4); border-radius: 0; outline: 0; color: #252d31; background: transparent; font: inherit; font-weight: 400; transition: border-color .2s ease; }
.order-fields input:focus, .order-fields textarea:focus { border-color: #a98245; }
.order-fields textarea { resize: vertical; line-height: 1.55; }
.faq--inner { margin: 0; background: transparent; }
.faq--inner::before { display: none; }
.faq--inner .faq__list { width: min(1040px, calc(100% - 64px)); margin: 0 auto; padding: 0 0 clamp(96px, 11vw, 150px); }
.legal-note { width: min(1040px, calc(100% - 64px)); margin: 0 auto; padding: clamp(92px, 11vw, 150px) 0; }
.legal-note h2 { max-width: 760px; }
.legal-document { width: min(1040px, calc(100% - 64px)); margin: 0 auto; padding: 0 0 clamp(92px, 11vw, 150px); }
.legal-document__updated { margin: 0; padding: 0 0 26px; color: #a98245; font-size: .74rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.legal-document__content { border-top: 1px solid rgba(70, 76, 77, .26); }
.legal-document__section { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 22px; padding: 34px 0 37px; border-bottom: 1px solid rgba(70, 76, 77, .26); }
.legal-document__section > span { padding-top: 6px; color: #a98245; font-family: var(--font-mono); font-size: .68rem; letter-spacing: .06em; }
.legal-document__section h2 { margin: 0 0 13px; color: #2a3034; font-family: var(--font-serif); font-size: clamp(1.55rem, 2.6vw, 2.15rem); font-weight: 400; line-height: 1.1; letter-spacing: -.03em; }
.legal-document__section p { max-width: 810px; margin: 0 0 14px; color: #5e6665; font-size: 1rem; line-height: 1.75; }
.legal-document__section p:last-child { margin-bottom: 0; }
.legal-document__section strong { color: #2a3034; }
.legal-document__section ul { max-width: 790px; margin: 0 0 14px; padding-left: 1.25em; color: #5e6665; line-height: 1.75; }
.legal-document__section li + li { margin-top: 5px; }
.legal-document__section a { color: #755520; font-weight: 700; text-decoration-color: rgba(117, 85, 32, .52); text-underline-offset: 3px; }
.legal-document__section a:hover, .legal-document__section a:focus-visible { color: #2a3034; text-decoration-color: currentColor; }
.privacy-notice { width: min(1040px, calc(100% - 64px)); margin: 0 auto; padding: 0 0 clamp(92px, 11vw, 150px); }
.privacy-notice__status { display: grid; grid-template-columns: minmax(180px, .52fr) minmax(0, 1fr); gap: 18px 52px; margin-bottom: 46px; padding: 28px 0; border-top: 1px solid rgba(70, 76, 77, .26); border-bottom: 1px solid rgba(70, 76, 77, .26); }
.privacy-notice__status > p:first-child { grid-row: 1 / span 2; margin: 6px 0 0; color: #a98245; font-size: .68rem; font-weight: 750; letter-spacing: .15em; line-height: 1.4; }
.privacy-notice__status h2 { margin: 0; color: #2a3034; font-family: var(--font-serif); font-size: clamp(1.7rem, 2.8vw, 2.55rem); font-weight: 400; line-height: 1.12; letter-spacing: -.035em; }
.privacy-notice__status > p:last-child { grid-column: 2; margin: 0; color: #5e6665; line-height: 1.7; }
.privacy-notice__content { border-top: 1px solid rgba(70, 76, 77, .26); }
.privacy-notice__content section { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 22px; padding: 34px 0 37px; border-bottom: 1px solid rgba(70, 76, 77, .26); }
.privacy-notice__content section > span { padding-top: 6px; color: #a98245; font-family: var(--font-mono); font-size: .68rem; letter-spacing: .06em; }
.privacy-notice__content h2 { margin: 0 0 13px; color: #2a3034; font-family: var(--font-serif); font-size: clamp(1.55rem, 2.6vw, 2.15rem); font-weight: 400; line-height: 1.1; letter-spacing: -.03em; }
.privacy-notice__content p { max-width: 810px; margin: 0 0 12px; color: #5e6665; font-size: 1rem; line-height: 1.75; }
.privacy-notice__content p:last-child { margin-bottom: 0; }
.privacy-notice__content a { color: #755520; font-weight: 700; text-decoration-color: rgba(117, 85, 32, .52); text-underline-offset: 3px; }
.privacy-notice__content a:hover, .privacy-notice__content a:focus-visible { color: #2a3034; text-decoration-color: currentColor; }
.privacy-notice__content ul { max-width: 790px; margin: 0 0 14px; padding-left: 1.25em; color: #5e6665; line-height: 1.75; }
.privacy-notice__content li + li { margin-top: 4px; }

.order-page { min-height: 100svh; color: #273034; background: #e8e7e1; }
.order-page__header { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 22px; width: min(1060px, calc(100% - 64px)); margin: 0 auto; padding: 75px 0 39px; border-bottom: 1px solid rgba(63, 70, 69, .24); }
.order-page__header p { grid-column: 1 / -1; margin: 0; color: #a98245; font-size: .68rem; font-weight: 750; letter-spacing: .18em; }
.order-page__header h1 { margin: 0; font-family: var(--font-serif); font-size: clamp(2.2rem, 4.2vw, 4.1rem); font-weight: 400; letter-spacing: -.05em; }
.order-page__header span { align-self: end; color: #737977; font-family: var(--font-mono); font-size: .72rem; letter-spacing: .13em; }
.order-progress { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; width: min(1060px, calc(100% - 64px)); margin: 28px auto 0; }
.order-progress span { padding-bottom: 11px; border-bottom: 1px solid rgba(63, 70, 69, .22); color: #7c817d; font-family: var(--font-mono); font-size: .63rem; letter-spacing: .09em; text-transform: uppercase; }
.order-progress .is-current { border-color: #a98245; color: #8e6e3d; }
.order-flow { width: min(1060px, calc(100% - 64px)); margin: 0 auto; padding: 35px 0 120px; }
.order-step { display: grid; grid-template-columns: minmax(220px, .62fr) minmax(0, 1.25fr); gap: 72px; padding: 53px 0; border-bottom: 1px solid rgba(63, 70, 69, .2); }
.order-step__intro > p { margin: 0 0 14px; color: #a98245; font-family: var(--font-mono); font-size: .65rem; letter-spacing: .14em; }
.order-step__intro h2 { margin: 0; font-family: var(--font-serif); font-size: clamp(1.75rem, 2.8vw, 2.7rem); font-weight: 400; letter-spacing: -.04em; }
.order-step__intro > p:last-child { margin: 18px 0 0; color: #68706c; font-size: .9rem; line-height: 1.65; }
.package-options { display: grid; gap: 12px; }
.package-option { position: relative; display: grid; grid-template-columns: minmax(130px, .7fr) auto; gap: 5px 20px; padding: 19px 21px; border: 1px solid rgba(63, 70, 69, .25); cursor: pointer; transition: border-color .2s ease, background-color .2s ease; }
.package-option input { position: absolute; opacity: 0; }
.package-option span { color: #30373b; font-size: 1.02rem; font-weight: 750; }
.package-option strong { color: #8e6e3d; font-size: .95rem; }
.package-option small { grid-column: 1 / -1; color: #68706c; font-size: .83rem; line-height: 1.5; }
.package-option.is-selected { border-color: #a98245; background: rgba(169, 130, 69, .075); }
.order-fields__wide { grid-column: 1 / -1; }
.order-fields small { color: #757b78; font-size: .69rem; font-weight: 400; }
.order-needs-extra { display: none !important; }
.order-needs-extra.is-required { display: grid !important; }
.order-summary__card { align-self: start; padding: 29px; border: 1px solid rgba(63, 70, 69, .28); background: rgba(245, 242, 234, .5); }
.order-summary__card > span { display: block; color: #30373b; font-size: 1.08rem; font-weight: 750; }
.order-summary__card > strong { display: block; margin-top: 8px; color: #a98245; font-size: 1.5rem; }
.order-summary__card > p { margin: 20px 0 25px; color: #68706c; font-size: .9rem; line-height: 1.6; }
.order-summary__card .button { width: 100%; }

/* Service detail pages and step-by-step checkout */
.service-page { color: #273034; background: #e8e7e1; }
.service-page__header { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 25px; width: min(1080px, calc(100% - 64px)); margin: 0 auto; padding: clamp(88px, 11vw, 150px) 0 clamp(76px, 9vw, 118px); }
.service-page__header > p { margin: 0; color: #a98245; font-size: .69rem; font-weight: 750; letter-spacing: .17em; }
.service-page__header > span { align-self: start; color: #8e6e3d; font-family: var(--font-mono); font-size: .92rem; font-weight: 700; letter-spacing: .1em; }
.service-page__header h1 { grid-column: 1 / -1; max-width: 850px; margin: 20px 0 0; font-family: var(--font-serif); font-size: clamp(3rem, 6.3vw, 6.2rem); font-weight: 400; line-height: .98; letter-spacing: -.065em; }
.service-page__header > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-column: 1 / -1; gap: 50px; align-items: end; margin-top: 20px; padding-top: 29px; border-top: 1px solid rgba(63, 70, 69, .25); }
.service-page__header > div p { max-width: 580px; margin: 0; color: #5f6866; font-size: 1.04rem; line-height: 1.75; }
.service-page__header .button { white-space: nowrap; }
.service-page__body { display: grid; grid-template-columns: minmax(220px, .58fr) minmax(0, 1.15fr); gap: 82px; width: min(1080px, calc(100% - 64px)); margin: 0 auto; padding: clamp(82px, 10vw, 132px) 0; border-top: 1px solid rgba(63, 70, 69, .25); }
.service-page__side { display: grid; align-content: start; gap: 15px; }
.service-page__side p, .service-page__note p { margin: 0; color: #a98245; font-family: var(--font-mono); font-size: .64rem; letter-spacing: .14em; }
.service-page__side strong { font-size: 1.3rem; }
.service-page__side span { max-width: 240px; color: #626a67; font-size: .9rem; line-height: 1.65; }
.service-page__scope-note { max-width: 280px; margin-top: 8px; padding: 17px 18px; border: 1px solid rgba(198, 154, 88, .35); border-left: 3px solid var(--vb-gold); color: rgba(229, 234, 230, .74); background: rgba(198, 154, 88, .075); font-size: .78rem; line-height: 1.65; }
.service-page__content h2 { margin: 0 0 33px; font-family: var(--font-serif); font-size: clamp(2rem, 3.3vw, 3.3rem); font-weight: 400; letter-spacing: -.045em; }
.service-page__content ul { margin: 0; padding: 0; border-top: 1px solid rgba(63, 70, 69, .25); list-style: none; }
.service-page__content li { display: grid; grid-template-columns: 45px 1fr; gap: 16px; padding: 18px 0; border-bottom: 1px solid rgba(63, 70, 69, .25); font-size: 1rem; }
.service-page__content li span { color: #a98245; font-family: var(--font-mono); font-size: .68rem; }
.service-page__note { display: grid; gap: 12px; margin-top: 44px; padding: 20px 22px; border-left: 1px solid #a98245; background: rgba(169, 130, 69, .06); }
.service-page__note span { color: #626a67; font-size: .89rem; line-height: 1.65; }
.service-page__closing { padding: clamp(86px, 10vw, 140px) max(32px, calc((100vw - 1080px) / 2)); color: #f5f0e5; background: #0a1117; }
.service-page__closing > p { margin: 0 0 18px; color: #c7964c; font-size: .68rem; font-weight: 700; letter-spacing: .16em; }
.service-page__closing h2 { max-width: 700px; margin: 0 0 35px; font-family: var(--font-serif); font-size: clamp(2rem, 3.9vw, 3.9rem); font-weight: 400; line-height: 1.06; letter-spacing: -.05em; }

.start-page { min-height: calc(100svh - 104px); color: #263037; background: #e8e7e1; }
.start-page__header { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; width: min(1060px, calc(100% - 64px)); margin: 0 auto; padding: 78px 0 48px; border-bottom: 1px solid rgba(63, 70, 69, .24); }
.start-page__header p { grid-column: 1 / -1; margin: 0; color: #a98245; font-size: .68rem; font-weight: 750; letter-spacing: .18em; }
.start-page__header h1 { max-width: 760px; margin: 0; font-family: var(--font-serif); font-size: clamp(2.3rem, 4.8vw, 4.7rem); font-weight: 400; line-height: 1.02; letter-spacing: -.06em; }
.start-page__header > span { align-self: end; color: #737977; font-family: var(--font-mono); font-size: .7rem; letter-spacing: .14em; }
.start-packages { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; width: min(1060px, calc(100% - 64px)); margin: 0 auto; padding: 54px 0 120px; }
.start-package { position: relative; display: grid; align-content: start; min-height: 370px; padding: 24px; border: 1px solid rgba(63, 70, 69, .25); color: #2c3438; background: rgba(245, 242, 234, .34); text-decoration: none; transition: border-color .25s ease, background-color .25s ease, transform .25s ease; }
.start-package:hover, .start-package:focus-visible, .start-package.is-selected { border-color: #a98245; background: rgba(169, 130, 69, .075); transform: translateY(-3px); }
.start-package > span { color: #a98245; font-family: var(--font-mono); font-size: .59rem; letter-spacing: .12em; }
.start-package h2 { margin: 30px 0 15px; font-family: var(--font-serif); font-size: clamp(1.75rem, 2.6vw, 2.55rem); font-weight: 400; letter-spacing: -.04em; }
.start-package p { margin: 0; color: #626a67; font-size: .9rem; line-height: 1.65; }
.start-package strong { align-self: end; margin-top: 25px; color: #8e6e3d; font-size: 1.2rem; }
.start-package i { position: absolute; right: 23px; bottom: 21px; color: #a98245; font-size: 1.25rem; font-style: normal; }
.order-step__intro a, .order-flow__actions > a, .order-review__actions a, .payment-card > a { color: #7b5d31; font-size: .82rem; text-decoration: none; }
.order-step__intro a { display: inline-block; margin-top: 18px; padding-bottom: 3px; border-bottom: 1px solid #a98245; }
.order-selected-package { display: grid; align-content: start; gap: 9px; padding: 24px; border: 1px solid rgba(63, 70, 69, .25); background: rgba(245, 242, 234, .42); }
.order-selected-package span { color: #31393d; font-size: 1.06rem; font-weight: 750; }
.order-selected-package strong { color: #8e6e3d; font-size: 1.45rem; }
.is-optional-detail { opacity: .8; }
.order-flow__actions { display: flex; justify-content: space-between; align-items: center; gap: 26px; padding-top: 38px; }
.order-review { display: grid; grid-template-columns: minmax(250px, .72fr) minmax(0, 1fr); gap: 78px; width: min(1060px, calc(100% - 64px)); margin: 0 auto; padding: 72px 0 126px; }
.order-review__intro > p:first-child { margin: 0 0 16px; color: #a98245; font-family: var(--font-mono); font-size: .65rem; letter-spacing: .14em; }
.order-review__intro h2 { margin: 0; font-family: var(--font-serif); font-size: clamp(2rem, 3.5vw, 3.4rem); font-weight: 400; letter-spacing: -.045em; }
.order-review__intro > span { display: block; margin-top: 13px; color: #8e6e3d; font-size: 1.5rem; font-weight: 700; }
.order-review__intro > p:last-child { margin: 24px 0 0; color: #65706b; font-size: .92rem; line-height: 1.7; }
.order-review dl { margin: 0; border-top: 1px solid rgba(63, 70, 69, .25); }
.order-review dl div { display: grid; grid-template-columns: 150px 1fr; gap: 20px; padding: 17px 0; border-bottom: 1px solid rgba(63, 70, 69, .25); }
.order-review dt { color: #8e6e3d; font-family: var(--font-mono); font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; }
.order-review dd { margin: 0; color: #384145; font-size: .92rem; line-height: 1.58; white-space: pre-line; }
.order-review__actions { grid-column: 2; display: grid; gap: 24px; padding-top: 8px; }
.order-review__actions > label { color: #5f6964; font-size: .78rem; line-height: 1.55; }
.order-review__actions > label a { color: #76582e; text-decoration: underline; }
.order-review__actions > div { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.payment-page { display: grid; min-height: calc(100svh - 104px); place-items: center; padding: 70px 32px; color: #263037; background: #e8e7e1; }
.payment-card { display: grid; width: min(100%, 560px); gap: 22px; padding: clamp(30px, 5vw, 54px); border: 1px solid rgba(63, 70, 69, .26); background: rgba(245, 242, 234, .46); }
.payment-card > p:first-child { margin: 0; color: #a98245; font-family: var(--font-mono); font-size: .65rem; letter-spacing: .14em; }
.payment-card h1 { margin: 0; font-family: var(--font-serif); font-size: clamp(2.2rem, 4vw, 3.8rem); font-weight: 400; line-height: 1.02; letter-spacing: -.055em; }
.payment-card__summary { display: grid; grid-template-columns: 1fr auto; gap: 7px 18px; padding: 20px 0; border-top: 1px solid rgba(63, 70, 69, .22); border-bottom: 1px solid rgba(63, 70, 69, .22); }
.payment-card__summary span { font-size: 1.04rem; font-weight: 750; }
.payment-card__summary strong { color: #8e6e3d; font-size: 1.1rem; }
.payment-card__summary small { grid-column: 1 / -1; color: #68716d; font-size: .83rem; }
.payment-card > p { margin: 0; color: #65706b; font-size: .9rem; line-height: 1.7; }
.payment-card .form-status { min-height: 20px; }

@media (max-width: 900px) {
  .floating-order-cta { display: none; }
  .faq__header, .inner-page__header, .principles, .about-story, .contact-panel, .order-step { grid-template-columns: 1fr; gap: 25px; }
  .faq h2, .faq__header > p:last-child, .inner-page__header h1 { grid-column: 1; }
  .site-footer__container { grid-template-columns: 1fr; gap: 46px; }
  .inner-nav { display: none; }
  .inner-header { min-height: 86px; }
  .inner-header .language-switcher { margin-left: auto; margin-right: -12px; }
  .inner-header__mobile-cta { display: inline-flex; gap: 8px; padding: 11px 13px; border: 1px solid rgba(197, 150, 76, .68); color: #f8f0df; font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
  .inner-header__mobile-cta span { color: #c7964c; }
  .principles__grid article { grid-template-columns: 44px 1fr; }
  .principles__grid p { grid-column: 2; }
  .order-fields { grid-template-columns: 1fr; }
  .order-progress { overflow: auto; grid-template-columns: repeat(4, minmax(100px, 1fr)); }
  .service-page__header > div, .service-page__body, .order-review { grid-template-columns: 1fr; gap: 32px; }
  .service-page__header > div .button { justify-self: start; }
  .order-review__actions { grid-column: 1; }
  .start-packages { grid-template-columns: 1fr; }
  .start-package { min-height: 230px; }
}

@media (max-width: 560px) {
  .faq__container, .final-cta__container, .site-footer__container, .site-footer__base, .inner-header, .inner-page__header, .principles, .about-story, .contact-panel, .faq--inner .faq__list, .legal-note, .order-page__header, .order-progress, .order-flow { width: calc(100% - 36px); }
  .privacy-notice { width: calc(100% - 36px); }
  .legal-document { width: calc(100% - 36px); }
  .privacy-notice__status { grid-template-columns: 1fr; gap: 14px; padding: 23px 0; }
  .privacy-notice__status > p:first-child, .privacy-notice__status > p:last-child { grid-column: auto; grid-row: auto; }
  .privacy-notice__status > p:first-child { margin: 0; }
  .privacy-notice__content section { grid-template-columns: 38px minmax(0, 1fr); gap: 12px; padding: 27px 0 30px; }
  .legal-document__section { grid-template-columns: 38px minmax(0, 1fr); gap: 12px; padding: 27px 0 30px; }
  .inner-page__header h1 { min-width: 0; font-size: clamp(2.35rem, 12vw, 2.7rem); }
  .inner-header { gap: 12px; }
  .inner-header .brand { width: 156px; }
  .inner-header .language-switcher { margin-right: -8px; }
  .inner-header__mobile-cta { padding-right: 9px; padding-left: 9px; }
  .faq__header { margin-bottom: 42px; }
  .faq__item summary { grid-template-columns: 34px 1fr 18px; gap: 10px; padding: 20px 0; font-size: 1rem; }
  .faq__item > div { display: block; padding: 0 0 22px 44px; }
  .site-footer__links { grid-template-columns: 1fr 1fr; }
  .site-footer__links div:last-child { grid-column: 1 / -1; }
  .site-footer__base { align-items: start; flex-direction: column; gap: 9px; }
  .final-cta__actions { align-items: start; flex-direction: column; gap: 22px; }
  .inner-page__header { padding-top: 68px; }
  .principles__grid article { gap: 10px; }
  .about-story__content { gap: 21px; }
  .about-story__principle { padding: 23px 21px; }
  .about-story__beacon { width: 132px; margin-top: 38px; }
  .contact-panel { padding-top: 66px; }
  .order-page__header { padding-top: 50px; }
  .order-step { gap: 31px; padding: 43px 0; }
  .package-option { grid-template-columns: 1fr auto; }
  .service-page__header, .service-page__body, .start-page__header, .start-packages, .order-review { width: calc(100% - 36px); }
  .service-page__header { padding-top: 68px; }
  .service-page__header > div { margin-top: 8px; }
  .service-page__closing { padding-right: 18px; padding-left: 18px; }
  .order-review dl div { grid-template-columns: 1fr; gap: 8px; }
  .order-review__actions > div { align-items: start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .mobile-nav, .faq__item summary i, .faq__item summary i::after, .desktop-nav__cta span, .faq__more span, .final-cta__link span { transition: none; }
  .about-story__beacon::before, .about-story__beacon img { animation: none; transform: none; }
}

/* 2026-08-14: brand-consistent supporting pages and purchase flow */
:root {
  --vb-night: #071019;
  --vb-panel: #0c1720;
  --vb-panel-soft: #101d27;
  --vb-line: rgba(203, 216, 214, .16);
  --vb-copy: rgba(229, 234, 230, .74);
  --vb-paper: #f0ece2;
  --vb-gold: #c69a58;
}

.inner-header {
  position: relative;
  z-index: 2;
}

.inner-page,
.service-page,
.start-page,
.order-page,
.payment-page {
  color: #f3efe7;
  background:
    radial-gradient(circle at 84% 12%, rgba(169, 130, 69, .11), transparent 30%),
    linear-gradient(135deg, rgba(255, 255, 255, .025), transparent 42%),
    var(--vb-night);
}

.inner-page__header,
.service-page__header,
.start-page__header,
.order-page__header {
  border-color: var(--vb-line);
}

.inner-page__header::after { background: var(--vb-line); }
.inner-page__header h1,
.principles h2,
.about-story h2,
.contact-panel h2,
.legal-note h2,
.service-page__header h1,
.service-page__content h2,
.start-page__header h1,
.start-package h2,
.order-page__header h1,
.order-step__intro h2,
.order-review__intro h2,
.payment-card h1 { color: #f3efe7; }

.inner-page__header > div,
.principles__grid p,
.about-story__lead,
.about-story__content > p,
.about-story__principle p,
.about-story__contact p,
.contact-panel__intro > p:last-child,
.contact-details__item small,
.service-page__header > div p,
.service-page__side span,
.service-page__note span,
.start-package > p,
.order-step__intro > p:last-child,
.order-review__intro > p:last-child,
.payment-card > p,
.legal-note { color: var(--vb-copy); }

.about-story__turn,
.about-story__principle p:first-child,
.about-story blockquote,
.about-story__contact strong { color: #f3efe7 !important; }

.principles__grid,
.principles__grid article,
.about-story,
.about-story__turn,
.about-story blockquote,
.about-story__contact,
.service-page__header > div,
.service-page__body,
.service-page__content ul,
.service-page__content li,
.order-step,
.order-page__header,
.order-review dl,
.order-review dl div,
.payment-card__summary { border-color: var(--vb-line); }

.inner-page__closing,
.service-page__closing {
  background:
    linear-gradient(112deg, rgba(169, 130, 69, .14), transparent 38%),
    #050b10;
}

.order-fields label { color: rgba(244, 239, 229, .85); }
.order-fields input,
.order-fields textarea {
  border-color: rgba(219, 225, 220, .28);
  color: #fffaf0;
  caret-color: var(--vb-gold);
}
.order-fields input::placeholder,
.order-fields textarea::placeholder { color: rgba(220, 226, 222, .42); }
.order-fields input:focus,
.order-fields textarea:focus { border-color: var(--vb-gold); }
.contact-details { border-color: var(--vb-line); }
.contact-details__item { border-color: var(--vb-line); }
.contact-details__item a { color: #f3efe7; }

.service-page__header > div > div { display: grid; gap: 18px; }
.service-page__best-for {
  padding-left: 17px;
  border-left: 1px solid var(--vb-gold);
  color: rgba(234, 230, 219, .78) !important;
  font-size: .92rem !important;
  line-height: 1.6 !important;
}
.service-page__best-for strong { display: block; color: #e1bf86; font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; }
.service-page__side strong { color: #f3efe7; }
.service-page__content li { color: rgba(245, 242, 233, .9); }
.service-page__note {
  border: 1px solid rgba(198, 154, 88, .35);
  border-left: 3px solid var(--vb-gold);
  background: rgba(198, 154, 88, .075);
}
.service-page__compare {
  display: inline-flex;
  gap: 9px;
  margin-left: 24px;
  color: rgba(245, 240, 228, .78);
  font-size: .84rem;
  text-decoration: none;
}
.service-page__compare span { color: var(--vb-gold); }

.start-packages {
  align-items: stretch;
  padding-bottom: 44px;
}
.start-package {
  min-height: 560px;
  border-color: var(--vb-line);
  color: #f4f0e7;
  background: linear-gradient(155deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .015));
}
.start-package:hover,
.start-package:focus-within,
.start-package.is-selected {
  border-color: rgba(198, 154, 88, .82);
  background: linear-gradient(155deg, rgba(198, 154, 88, .105), rgba(255, 255, 255, .02));
  transform: translateY(-3px);
}
.start-package--featured {
  border-top: 3px solid var(--vb-gold);
  background: linear-gradient(155deg, rgba(198, 154, 88, .12), rgba(255, 255, 255, .025));
}
.start-package__badge {
  position: absolute;
  top: -13px;
  right: 18px;
  padding: 6px 9px;
  color: #071019;
  background: #d6b16f;
  font-size: .58rem;
  letter-spacing: .12em;
}
.start-package > p { min-height: 72px; }
.start-package__fit {
  min-height: 118px !important;
  margin: 23px -24px 0 !important;
  padding: 20px 24px;
  border-top: 1px solid var(--vb-line);
  border-bottom: 1px solid var(--vb-line);
  color: rgba(235, 232, 223, .74) !important;
}
.start-package__fit strong { display: block; margin-bottom: 8px; color: #ddb978; font-size: .65rem; letter-spacing: .1em; text-transform: uppercase; }
.start-package ul { display: grid; gap: 10px; margin: 22px 0 28px; padding: 0; list-style: none; }
.start-package li { position: relative; padding-left: 17px; color: rgba(232, 236, 232, .73); font-size: .79rem; line-height: 1.42; }
.start-package li::before { position: absolute; left: 0; color: var(--vb-gold); content: "✓"; }
.start-package footer { display: grid; gap: 16px; align-self: end; margin-top: auto; }
.start-package footer > strong { color: #e0bd84; font-size: 1.35rem; }
.start-package .button { width: 100%; }
.start-page__disclaimer {
  width: min(900px, calc(100% - 64px));
  margin: 0 auto;
  padding: 0 0 100px;
  color: rgba(229, 234, 230, .6);
  font-size: .78rem;
  line-height: 1.65;
  text-align: center;
}

.order-progress span { border-color: var(--vb-line); color: rgba(229, 234, 230, .48); }
.order-progress .is-current { border-color: var(--vb-gold); color: #e1bd7f; }
.order-progress .is-complete { color: rgba(229, 234, 230, .75); }
.order-selected-package,
.payment-card {
  border-color: rgba(198, 154, 88, .3);
  background: linear-gradient(145deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .018));
}
.order-selected-package span { color: #f3efe7; }
.order-selected-package strong,
.order-review__intro > span,
.payment-card__summary strong { color: #ddb978; }
.order-selected-package small { color: var(--vb-copy); font-size: .78rem; line-height: 1.5; }
.order-review dt { color: #d2aa69; }
.order-review dd { color: rgba(246, 242, 233, .86); }
.order-review__actions > label { color: rgba(229, 234, 230, .72); }
.order-review__actions > label a,
.order-step__intro a,
.order-flow__actions > a,
.order-review__actions a,
.payment-card > a { color: #e1bd7f; }
.order-review__disclaimer { display: grid; gap: 8px; margin-top: 28px; padding: 18px; border-left: 2px solid var(--vb-gold); background: rgba(198, 154, 88, .07); }
.order-review__disclaimer strong { color: #ddb978; font-size: .67rem; letter-spacing: .1em; text-transform: uppercase; }
.order-review__disclaimer span { color: rgba(229, 234, 230, .65); font-size: .78rem; line-height: 1.6; }
.payment-card { width: min(100%, 620px); }
.payment-card .order-progress { width: 100%; margin-top: 0; }
.payment-card .button[disabled] { cursor: not-allowed; opacity: .55; filter: grayscale(.3); }
.payment-card--success { text-align: center; }
.payment-card--success .button { justify-self: center; }

.button:focus-visible,
.inner-nav a:focus-visible,
.inner-header__mobile-cta:focus-visible,
.start-package a:focus-visible,
.service-page__compare:focus-visible,
.order-step__intro a:focus-visible,
.order-flow__actions a:focus-visible,
.order-review__actions a:focus-visible,
.payment-card > a:focus-visible {
  outline: 2px solid #e0bd84;
  outline-offset: 4px;
}

@media (max-width: 900px) {
  .start-package { min-height: auto; }
  .start-package > p,
  .start-package__fit { min-height: 0 !important; }
}

@media (max-width: 560px) {
  .start-page__disclaimer { width: calc(100% - 36px); text-align: left; }
  .start-page__header,
  .order-page__header { grid-template-columns: 1fr; }
  .start-page__header > span,
  .order-page__header > span { justify-self: start; }
  .service-page__compare { display: flex; margin: 22px 0 0; }
  .payment-page { padding: 42px 18px; }
  .payment-card { padding: 28px 20px; }
  .order-progress,
  .payment-card .order-progress { overflow: visible; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
  .order-progress span { overflow: hidden; font-size: .52rem; letter-spacing: .04em; text-overflow: ellipsis; }
}

/* Order flow v1.0 — functional fields, conditions, summary and payment states */
.order-progress { grid-template-columns: repeat(var(--order-step-count, 4), minmax(0, 1fr)); }
.order-progress span[aria-current="step"] { font-weight: 750; }
.order-step--active { min-height: 440px; }

.order-fields > .conditional-section {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 21px;
  padding: 26px 0 6px;
  border-top: 1px solid var(--vb-line);
}
.order-fields > .conditional-section[hidden],
.conditional-section > .conditional-section[hidden] { display: none; }
.conditional-section > .conditional-section {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-column: 1 / -1;
  gap: 21px;
  padding: 18px;
  border-left: 1px solid rgba(198, 154, 88, .42);
  background: rgba(198, 154, 88, .045);
}
.conditional-section__header { grid-column: 1 / -1; margin: 4px 0 8px; }
.conditional-section__header p { margin: 0 0 8px; color: #d2aa69; font-family: var(--font-mono); font-size: .62rem; letter-spacing: .14em; }
.conditional-section__header h3 { margin: 0; color: #f3efe7; font-family: var(--font-serif); font-size: clamp(1.35rem, 2.1vw, 2rem); font-weight: 400; }

.order-fields label > span:first-child { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; }
.order-fields select { width: 100%; min-height: 46px; padding: 10px 28px 10px 0; border: 0; border-bottom: 1px solid rgba(219, 225, 220, .28); border-radius: 0; outline: 0; color: #fffaf0; background: transparent; font: inherit; }
.order-fields select:focus { border-color: var(--vb-gold); }
.order-fields select option { color: #f4efe5; background: var(--vb-panel); }
.field-help { color: rgba(229, 234, 230, .55); font-size: .69rem; font-style: normal; font-weight: 400; line-height: 1.5; }

.choice-group { display: grid; gap: 13px; min-width: 0; margin: 0; padding: 0; border: 0; }
.choice-group legend { width: 100%; margin-bottom: 11px; color: rgba(244, 239, 229, .85); font-size: .78rem; font-weight: 700; }
.choice-group legend small { margin-left: 9px; color: rgba(229, 234, 230, .5); font-weight: 400; }
.choice-group > div { display: flex; flex-wrap: wrap; gap: 9px; }
.choice-group label { display: inline-flex; grid-template-columns: none; align-items: center; gap: 9px; min-height: 42px; padding: 8px 12px; border: 1px solid rgba(219, 225, 220, .2); color: rgba(244, 239, 229, .76); background: rgba(255, 255, 255, .018); cursor: pointer; }
.choice-group label:has(input:checked) { border-color: rgba(198, 154, 88, .72); color: #fff7e8; background: rgba(198, 154, 88, .09); }
.choice-group input, .order-toggle > input, .terms-choice > input { width: 17px; height: 17px; flex: 0 0 auto; accent-color: var(--vb-gold); }

.order-toggle { display: grid !important; grid-template-columns: auto minmax(0, 1fr); gap: 13px !important; align-items: start; padding: 19px; border: 1px solid rgba(219, 225, 220, .2); background: rgba(255, 255, 255, .018); cursor: pointer; }
.order-toggle > input { margin-top: 3px; }
.order-toggle > span { display: grid !important; justify-content: initial !important; gap: 5px !important; }
.order-toggle strong { color: #f5f0e6; font-size: .86rem; }
.order-toggle small { color: rgba(229, 234, 230, .55); font-weight: 400; line-height: 1.5; }

.order-file-field { display: grid; grid-column: 1 / -1; gap: 13px; }
.order-file-field input[type="file"] { padding: 14px 0; }
.order-file-field input[type="file"]::file-selector-button { margin-right: 13px; padding: 9px 12px; border: 1px solid rgba(198, 154, 88, .65); color: #f5efe2; background: rgba(198, 154, 88, .08); cursor: pointer; }
.order-file-list { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.order-file-list li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--vb-line); }
.order-file-list li span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.order-file-list li small { color: rgba(229, 234, 230, .55); }
.order-file-list button, .payment-dev button { padding: 7px 9px; border: 1px solid rgba(198, 154, 88, .42); color: #e7c78f; background: transparent; cursor: pointer; }

.field-error { display: block; color: #f0be8d; font-size: .7rem; font-weight: 650; line-height: 1.45; }
[aria-invalid="true"] { border-color: #d99b66 !important; }
.order-flow__actions .button[disabled], .order-review__actions .button[disabled] { cursor: not-allowed; opacity: .48; }

.order-review__content { display: grid; gap: 32px; min-width: 0; }
.order-review__section { display: grid; gap: 0; }
.order-review__section > header { display: flex; justify-content: space-between; gap: 20px; align-items: baseline; padding-bottom: 12px; border-bottom: 1px solid rgba(198, 154, 88, .45); }
.order-review__section > header p { margin: 0; color: #d2aa69; font-family: var(--font-mono); font-size: .64rem; letter-spacing: .12em; }
.order-review__section > header a { color: #e1bd7f; font-size: .72rem; }
.order-review__section dl { border-top: 0; }
.order-review__section dl div { grid-template-columns: minmax(140px, .42fr) minmax(0, 1fr); }
.order-review__blocking { padding: 18px; border: 1px solid rgba(217, 155, 102, .45); border-left: 3px solid #d99b66; background: rgba(217, 155, 102, .07); }
.order-review__blocking strong { color: #f0be8d; }
.order-review__blocking p { color: rgba(244, 239, 229, .72); line-height: 1.55; }
.order-review__blocking a { color: #e1bd7f; }

.order-pricing { display: grid; gap: 9px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--vb-line); }
.order-pricing > div { display: flex; justify-content: space-between; gap: 20px; color: rgba(229, 234, 230, .62); font-size: .78rem; }
.order-pricing del { color: rgba(229, 234, 230, .5); }
.order-pricing strong { color: #e0bd84; font-size: 1rem; }
.order-pricing .order-pricing__total { margin-top: 5px; padding-top: 13px; border-top: 1px solid rgba(198, 154, 88, .35); color: #f4efe6; }
.order-pricing .order-pricing__total strong { font-size: 1.3rem; }
.order-review__section--order .order-pricing { margin-top: 23px; }
.order-review__actions { grid-column: auto; }
.terms-choice { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 11px; align-items: start; }
.terms-choice > input { margin-top: 2px; }

.payment-dev { display: grid; gap: 9px; margin-top: 10px; padding: 18px; border: 1px dashed rgba(198, 154, 88, .42); text-align: left; }
.payment-dev[hidden] { display: none; }
.payment-dev > p:first-child { margin: 0; color: #d2aa69; font-size: .62rem; letter-spacing: .12em; }
.payment-dev h2 { margin: 0; font-size: 1.15rem; }
.payment-dev p { margin: 0; font-size: .76rem; }
.payment-dev > div { display: flex; flex-wrap: wrap; gap: 8px; }
.payment-card--success .payment-card__summary { text-align: left; }
.email-previews { display: grid; gap: 10px; text-align: left; }
.email-previews details { border: 1px solid var(--vb-line); }
.email-previews summary { padding: 12px; color: #e1bd7f; cursor: pointer; }
.email-previews pre { overflow: auto; max-height: 380px; margin: 0; padding: 14px; color: rgba(244, 239, 229, .76); background: rgba(0, 0, 0, .18); font: .7rem/1.55 ui-monospace, SFMono-Regular, Consolas, monospace; white-space: pre-wrap; }

/* Statutory online withdrawal function */
.inner-nav .inner-nav__withdrawal { color: #edcf99; font-size: .68rem; font-weight: 700; letter-spacing: .085em; text-transform: uppercase; }
.withdrawal-page { min-height: calc(100svh - 104px); padding: 0 0 104px; color: #f3efe7; background: radial-gradient(circle at 84% 12%, rgba(169, 130, 69, .11), transparent 30%), linear-gradient(135deg, rgba(255, 255, 255, .025), transparent 42%), var(--vb-night); }
.withdrawal-page__header { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(260px, .72fr); gap: 25px 90px; width: min(1040px, calc(100% - 64px)); margin: 0 auto; padding: clamp(86px, 11vw, 132px) 0 clamp(54px, 7vw, 84px); border-bottom: 1px solid var(--vb-line); }
.withdrawal-page__header > p { grid-column: 1 / -1; margin: 0; color: #d2aa69; font-family: var(--font-mono); font-size: .66rem; font-weight: 700; letter-spacing: .16em; }
.withdrawal-page__header h1 { margin: 0; color: #f3efe7; font-family: var(--font-serif); font-size: clamp(2.7rem, 5.3vw, 4.8rem); font-weight: 400; line-height: 1.02; letter-spacing: -.055em; }
.withdrawal-page__header > span { align-self: end; justify-self: end; color: rgba(229, 234, 230, .56); font-family: var(--font-mono); font-size: .62rem; letter-spacing: .14em; text-align: right; }
.withdrawal-card { display: grid; grid-template-columns: minmax(230px, .72fr) minmax(0, 1fr); gap: clamp(36px, 7vw, 92px); width: min(1040px, calc(100% - 64px)); margin: 0 auto; padding: clamp(54px, 8vw, 96px) 0; }
.withdrawal-card__intro > p:first-child { margin: 0 0 14px; color: #d2aa69; font-family: var(--font-mono); font-size: .64rem; font-weight: 700; letter-spacing: .15em; }
.withdrawal-card__intro h2 { margin: 0 0 22px; color: #f3efe7; font-family: var(--font-serif); font-size: clamp(1.9rem, 3.2vw, 3rem); font-weight: 400; line-height: 1.08; letter-spacing: -.04em; }
.withdrawal-card__intro > p:not(:first-child), .withdrawal-card__notice p { margin: 0 0 16px; color: rgba(229, 234, 230, .68); font-size: .91rem; line-height: 1.7; }
.withdrawal-card__intro a { color: #e1bd7f; font-weight: 700; text-decoration-color: rgba(225, 189, 127, .6); text-underline-offset: 4px; overflow-wrap: anywhere; }
.withdrawal-form { display: grid; gap: 22px; padding: clamp(26px, 4vw, 42px); border: 1px solid rgba(198, 154, 88, .34); background: linear-gradient(145deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .018)); }
.withdrawal-form > label:not(.terms-choice) { display: grid; gap: 8px; color: rgba(244, 239, 229, .88); font-size: .79rem; font-weight: 700; letter-spacing: .02em; }
.withdrawal-form input:not([type="checkbox"]) { width: 100%; padding: 12px 0; border: 0; border-bottom: 1px solid rgba(219, 225, 220, .3); border-radius: 0; outline: 0; color: #f8f3ea; background: transparent; font: inherit; }
.withdrawal-form input:not([type="checkbox"]):focus { border-color: var(--vb-gold); }
.withdrawal-form__statement { padding: 17px 18px; border-left: 2px solid var(--vb-gold); background: rgba(198, 154, 88, .075); }
.withdrawal-form__statement strong, .withdrawal-card__notice strong, .withdrawal-form__success strong { color: #e0bd84; font-size: .72rem; letter-spacing: .09em; text-transform: uppercase; }
.withdrawal-form__statement p, .withdrawal-form__success p { margin: 9px 0 0; color: rgba(229, 234, 230, .77); font-size: .88rem; line-height: 1.6; }
.withdrawal-form .button { justify-self: start; }
.withdrawal-form__success { display: grid; gap: 4px; padding: 8px 0; }
.withdrawal-card__notice { grid-column: 2; padding: 22px; border-top: 1px solid var(--vb-line); border-bottom: 1px solid var(--vb-line); }
.payment-card__withdrawal { justify-self: center; color: #e1bd7f; font-size: .78rem; text-decoration: underline; text-underline-offset: 4px; }
.terms-choice--early-start { padding: 15px; border: 1px solid rgba(219, 225, 220, .18); background: rgba(255, 255, 255, .018); }
.terms-choice--early-start > span { display: grid; gap: 5px; }
.terms-choice--early-start strong { color: #f5f0e6; font-size: .8rem; }
.terms-choice--early-start small { color: rgba(229, 234, 230, .58); font-size: .72rem; font-weight: 400; line-height: 1.5; }
.terms-choice--early-start-ack { margin-left: 18px; }
.inner-header__mobile-withdrawal { display: none; }

@media (max-width: 900px) {
  .order-progress,
  .payment-card .order-progress { grid-template-columns: repeat(var(--order-step-count, 4), minmax(118px, 1fr)); }
  .order-fields > .conditional-section, .conditional-section > .conditional-section { grid-template-columns: 1fr; }
  .order-review__section dl div { grid-template-columns: 1fr; gap: 8px; }
  .withdrawal-page__header, .withdrawal-card { grid-template-columns: 1fr; gap: 28px; }
  .withdrawal-page__header > span { justify-self: start; text-align: left; }
  .withdrawal-card__notice { grid-column: auto; }
  .inner-header__mobile-withdrawal { display: inline-flex; margin-left: auto; color: #edcf99; font-size: .66rem; font-weight: 700; letter-spacing: .07em; text-decoration: underline; text-underline-offset: 4px; text-transform: uppercase; }
  .inner-header .language-switcher { margin-left: 0; }
}

@media (max-width: 560px) {
  .order-progress,
  .payment-card .order-progress {
    overflow-x: auto;
    padding-bottom: 6px;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  .order-progress::-webkit-scrollbar,
  .payment-card .order-progress::-webkit-scrollbar { display: none; }
  .order-flow__actions { align-items: stretch; flex-direction: column-reverse; }
  .order-flow__actions .button { width: 100%; }
  .choice-group > div { display: grid; grid-template-columns: 1fr; }
  .choice-group label { width: 100%; }
  .conditional-section > .conditional-section { padding: 15px 12px; }
  .order-file-list li { grid-template-columns: minmax(0, 1fr) auto; }
  .order-file-list li button { grid-column: 1 / -1; justify-self: start; }
  .payment-page { padding-right: 18px; padding-left: 18px; }
  .withdrawal-page__header, .withdrawal-card { width: calc(100% - 36px); }
  .withdrawal-page__header { padding-top: 68px; }
  .withdrawal-form { padding: 25px 20px; }
  .terms-choice--early-start-ack { margin-left: 0; }
}
