/* =========================================================
   LINTEL — base system
   rem scale: 1rem = 10px at a 1728px-wide viewport
   ========================================================= */
:root {
  --bg: #f3f2ec;
  --bg-2: #ecebe4;
  --ink: #282828;
  --ink-2: #414140;
  --ink-3: rgba(40, 40, 40, .72);
  --muted: #72726f;
  --dim: #b4b4b0;
  --line: #b3b3af;
  --line-soft: rgba(40, 40, 40, .14);
  --brand: #f8410f;
  --brand-2: #ff6b3d;
  --white: #fff;
  --dark: #232323;
  --b: max(1px, .1rem);
  --gut: 1.6rem;
  --frame: .8rem;
  --header-h: 6.4rem;
  --ease-out: cubic-bezier(.23, 1, .32, 1);
  --ease-io: cubic-bezier(.65, 0, .35, 1);
  --ease-draw: cubic-bezier(.22, 1, .36, 1);
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .16 0 0 0 0 .16 0 0 0 0 .14 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  --grid-bg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64'%3E%3Cpath d='M64 0H0v64' fill='none' stroke='%23282828' stroke-opacity='.07'/%3E%3C/svg%3E");
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html {
  font-size: .5787037037vw;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  overscroll-behavior: none;
  background: var(--bg);
}
@media (max-width: 991px) { html { font-size: 1.1990407674vw; } }
@media (max-width: 767px) { html { font-size: 2.5445292621vw; } }
html::selection, ::selection { background: var(--brand); color: #fff; }

body {
  font-family: 'Geist', 'Helvetica Neue', Arial, sans-serif;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -.02em;
  color: var(--ink-3);
  background-color: var(--bg);
  background-image: var(--grain);
  min-height: 100vh;
  overflow-x: hidden;
}
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }
html.is-loading, html.is-loading body { overflow: hidden; }

a { color: inherit; text-decoration: none; }
button { font: inherit; letter-spacing: inherit; color: inherit; background: none; border: 0; cursor: pointer; text-align: inherit; }
input, textarea, select { font: inherit; letter-spacing: inherit; color: inherit; }
img, svg, canvas { display: block; max-width: 100%; }
ul { list-style: none; }

.paper { background-color: var(--bg); background-image: var(--grain); }

/* ---------- type ---------- */
.mono { font-family: 'Geist Mono', ui-monospace, monospace; font-weight: 500; text-transform: uppercase; letter-spacing: 0; }
.t10 { font-size: 1rem; line-height: 1.3; }
.t12 { font-size: 1.2rem; line-height: 1.3; }
.t14 { font-size: 1.4rem; line-height: 1.3; }
.t16 { font-size: 1.6rem; line-height: 1.35; }
.t18 { font-size: 1.8rem; line-height: 1.35; }
.t20 { font-size: 2rem; line-height: 1.3; }
.h { color: var(--ink); text-transform: uppercase; letter-spacing: -.02em; font-weight: 600; line-height: 1; }
.h1 { font-size: 5.6rem; font-weight: 700; letter-spacing: -.04em; }
.h2 { font-size: 4.8rem; }
.h3 { font-size: 4rem; }
.h4 { font-size: 3.2rem; }
.h5 { font-size: 2.8rem; }
.h6 { font-size: 2.4rem; line-height: 1.1; }
.hxl { font-size: 8rem; font-weight: 700; letter-spacing: -.045em; line-height: .95; }
.c-ink { color: var(--ink); }
.c-muted { color: var(--muted); }
.c-dim { color: var(--dim); }
.c-brand { color: var(--brand); }
@media (max-width: 767px) {
  .h1 { font-size: 4rem; } .h2 { font-size: 3.6rem; } .h3 { font-size: 3.2rem; } .h4 { font-size: 2.8rem; } .hxl { font-size: 4.4rem; }
}

/* split-text helpers */
.split-line { overflow: hidden; display: block; padding-bottom: .08em; margin-bottom: -.08em; }
.split-line > * { display: block; }

/* ---------- layout ---------- */
.wrap { padding: 0 var(--gut); position: relative; }
.container { padding: 0 var(--gut); position: relative; }
.grid12 { display: grid; grid-template-columns: repeat(12, minmax(1px, 1fr)); column-gap: 2rem; }
.page { position: relative; padding: var(--frame); }
.page-inner { position: relative; }

/* ---------- hairlines ---------- */
.ln { position: absolute; background: var(--line); pointer-events: none; z-index: 2; }
.ln.h { left: 0; right: 0; height: var(--b); transform-origin: left center; }
.ln.v { top: 0; bottom: 0; width: var(--b); transform-origin: center top; }
.ln.t { top: 0; } .ln.b { bottom: 0; } .ln.l { left: 0; } .ln.r { right: 0; }
.ln.dash { background: none; }
.ln.h.dash { background-image: linear-gradient(90deg, var(--line) 50%, transparent 0); background-size: .8rem var(--b); }
.ln.v.dash { background-image: linear-gradient(180deg, var(--line) 50%, transparent 0); background-size: var(--b) .8rem; }
.ln.ink { background-color: var(--ink); }
.bx { position: relative; }

/* ruler (tick) edges used around image frames */
.ruler { position: absolute; pointer-events: none; z-index: 3; }
.ruler.top, .ruler.bot { left: 1.6rem; right: 1.6rem; height: .8rem; background-image: linear-gradient(90deg, var(--line) var(--b), transparent 0); background-size: .8rem 100%; opacity: .9; }
.ruler.top { top: .8rem; } .ruler.bot { bottom: .8rem; }
.ruler.left, .ruler.right { top: 1.6rem; bottom: 1.6rem; width: .8rem; background-image: linear-gradient(180deg, var(--line) var(--b), transparent 0); background-size: 100% .8rem; }
.ruler.left { left: .8rem; } .ruler.right { right: .8rem; }
.plus { position: absolute; width: 1.1rem; height: 1.1rem; z-index: 4; pointer-events: none; }
.plus::before, .plus::after { content: ''; position: absolute; background: var(--ink-2); }
.plus::before { left: 50%; top: 0; bottom: 0; width: var(--b); transform: translateX(-50%); }
.plus::after { top: 50%; left: 0; right: 0; height: var(--b); transform: translateY(-50%); }
.plus.tl { top: .6rem; left: .6rem; } .plus.tr { top: .6rem; right: .6rem; }
.plus.bl { bottom: .6rem; left: .6rem; } .plus.br { bottom: .6rem; right: .6rem; }

/* fixed page frame */
.frame { position: fixed; inset: var(--frame); pointer-events: none; z-index: 60; }
.frame i { position: absolute; background: var(--line); }
.frame i:nth-child(1) { left: 0; right: 0; top: 0; height: var(--b); transform-origin: left; }
.frame i:nth-child(2) { left: 0; right: 0; bottom: 0; height: var(--b); transform-origin: right; }
.frame i:nth-child(3) { top: 0; bottom: 0; left: 0; width: var(--b); transform-origin: bottom; }
.frame i:nth-child(4) { top: 0; bottom: 0; right: 0; width: var(--b); transform-origin: top; }
.frame-mask { position: fixed; z-index: 59; pointer-events: none; inset: 0; border: var(--frame) solid var(--bg); }

/* ---------- buttons ---------- */
/* btn-fill: label roll + diagonal icon roll + fill from bottom */
.btn {
  --bf: var(--ink); --bc: var(--ink); --bt: var(--bg);
  position: relative; display: inline-flex; align-items: stretch; height: 4rem; cursor: pointer;
  color: var(--ink); isolation: isolate; user-select: none;
}
.btn-label { position: relative; overflow: hidden; display: flex; align-items: center; padding: 0 1.6rem; }
.btn-label span { display: block; transition: transform .6s var(--ease-out); }
.btn-label span + span { position: absolute; left: 1.6rem; top: 50%; transform: translateY(100%) translateY(-50%); margin-top: 0; }
.btn-label span:first-child { transform: translateY(0); }
.btn-ic { position: relative; overflow: hidden; width: 4rem; display: grid; place-items: center; border-left: var(--b) solid currentColor; }
.btn-ic svg { width: 1.4rem; height: 1.4rem; transition: transform .6s var(--ease-out); }
.btn-ic svg + svg { position: absolute; transform: translate(-200%, 200%); }
.btn::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--bf); transform: scaleY(0); transform-origin: bottom; transition: transform .5s var(--ease-out); }
.btn:hover::before, .btn.is-hover::before { transform: scaleY(1); }
.btn:hover, .btn.is-hover { color: var(--bt); }
.btn:hover .btn-label span:first-child { transform: translateY(-120%); }
.btn:hover .btn-label span + span { transform: translateY(-50%); }
.btn:hover .btn-ic svg:first-child { transform: translate(200%, -200%); }
.btn:hover .btn-ic svg + svg { transform: translate(0, 0); }
.btn.outline { border: var(--b) solid var(--ink); }
.btn.brand { background: var(--brand); color: #fff; --bf: var(--ink); --bt: #fff; }
.btn.brand .btn-ic { border-left-color: rgba(255, 255, 255, .5); }
.btn.dark { background: var(--ink); color: var(--bg); --bf: var(--brand); --bt: #fff; }
.btn.ghost { --bf: transparent; --bt: var(--brand); color: var(--brand); height: auto; }
.btn.ghost .btn-label { padding: 0; }
.btn.ghost .btn-label span + span { left: 0; }
.btn.ghost::before { display: none; }
.btn.sm { height: 3.2rem; }
.btn.sm .btn-ic { width: 3.2rem; }
.btn.block { display: flex; width: 100%; justify-content: space-between; }

/* ink underline link */
.ul { position: relative; display: inline-block; }
.ul::after { content: ''; position: absolute; left: 0; right: 0; bottom: -.1em; height: var(--b); background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .6s var(--ease-out); }
.ul:hover::after, .ul.on::after { transform: scaleX(1); transform-origin: left; }

/* arrow square control */
.ctl { position: relative; width: 4rem; height: 4rem; display: grid; place-items: center; overflow: hidden; color: var(--ink); }
.ctl::after { content: ''; position: absolute; inset: 0; background: var(--brand); transform: translateX(-102%); transition: transform .5s var(--ease-out); z-index: 0; }
.ctl.next::after { transform: translateX(102%); }
.ctl:hover::after { transform: translateX(0); }
.ctl:hover { color: #fff; }
.ctl svg { position: relative; z-index: 1; width: 1.4rem; height: 1.4rem; transition: transform .5s var(--ease-out); }
.ctl:disabled { opacity: .35; pointer-events: none; }

/* ---------- header ---------- */
.header { position: fixed; top: var(--frame); left: var(--frame); right: var(--frame); z-index: 50; height: var(--header-h); pointer-events: none; transition: transform .7s var(--ease-out); }
.header.is-hidden { transform: translateY(calc(-100% - var(--frame) - 2px)); }
.header-inner { position: relative; height: 100%; display: flex; justify-content: space-between; pointer-events: auto; background-color: var(--bg); background-image: var(--grain); }
.header-logo { display: flex; align-items: center; gap: 1rem; padding: 0 2.4rem; color: var(--ink); }
.header-logo .mark { width: 3.4rem; height: 3.4rem; }
.header-logo .word { height: 1.9rem; width: auto; }
.nav { display: flex; height: 100%; }
.nav-item { position: relative; width: 13.6rem; height: 100%; }
.nav-item > .ln.v { left: 0; }
.nav-btn { position: relative; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; width: 100%; height: 100%; padding: 1.4rem 1.4rem; color: var(--ink-2); overflow: hidden; isolation: isolate; }
.nav-btn::before { content: ''; position: absolute; inset: 0; background: var(--ink); transform: scaleY(0); transform-origin: bottom; transition: transform .5s var(--ease-out); z-index: -1; }
.nav-btn:hover::before, .nav-item.open .nav-btn::before { transform: scaleY(1); }
.nav-btn:hover, .nav-item.open .nav-btn { color: var(--bg); }
.nav-btn .roll { position: relative; display: block; overflow: hidden; height: 1.3em; }
.nav-btn .roll span { display: block; transition: transform .6s var(--ease-out); }
.nav-btn .roll span + span { position: absolute; top: 100%; left: 0; }
.nav-btn:hover .roll span { transform: translateY(-100%); }
.nav-btn .corner { position: absolute; right: .6rem; bottom: .6rem; width: .7rem; height: .7rem; transition: transform .4s var(--ease-out); }
.nav-item.open .nav-btn .corner { transform: rotate(180deg); }
.nav-btn.is-current::after { content: ''; position: absolute; width: .6rem; height: .6rem; background: currentColor; right: 1.2rem; top: 1.6rem; }
.nav-btn.cta { color: var(--brand); }
.nav-btn.cta::before { background: var(--brand); }
.nav-btn.cta:hover { color: #fff; }
.nav-btn .arrow { position: absolute; right: 1.2rem; bottom: 1rem; width: 1.4rem; height: 1.4rem; overflow: hidden; }
.nav-btn .arrow svg { position: absolute; inset: 0; width: 100%; height: 100%; transition: transform .6s var(--ease-out); }
.nav-btn .arrow svg + svg { transform: translateX(-120%); }
.nav-btn:hover .arrow svg:first-child { transform: translateX(120%); }
.nav-btn:hover .arrow svg + svg { transform: translateX(0); }
.dropdown { position: absolute; top: 100%; left: 0; width: 100%; min-width: 22rem; clip-path: inset(0 0 100% 0); transition: clip-path .6s var(--ease-out); background-color: var(--bg); background-image: var(--grain); border: var(--b) solid var(--line); border-top: 0; }
.nav-item.open .dropdown { clip-path: inset(0 0 0 0); }
.dropdown a { position: relative; display: block; padding: 1.4rem; color: var(--ink-2); overflow: hidden; isolation: isolate; border-top: var(--b) solid var(--line); }
.dropdown a::before { content: ''; position: absolute; inset: 0; background: var(--ink); transform: scaleY(0); transform-origin: bottom; transition: transform .5s var(--ease-out); z-index: -1; }
.dropdown a:hover::before { transform: scaleY(1); }
.dropdown a:hover { color: var(--bg); }
.dropdown a .roll { position: relative; display: block; overflow: hidden; height: 1.3em; }
.dropdown a .roll span { display: block; transition: transform .6s var(--ease-out); }
.dropdown a .roll span + span { position: absolute; top: 100%; left: 0; }
.dropdown a:hover .roll span { transform: translateY(-100%); }
.dropdown a.is-current::after { content: ''; position: absolute; width: .6rem; height: .6rem; background: currentColor; right: 1.2rem; top: 50%; transform: translateY(-50%); }
.menu-btn { display: none; }

@media (max-width: 991px) {
  :root { --header-h: 5.6rem; }
  .nav { position: fixed; top: calc(var(--frame) + var(--header-h)); left: var(--frame); right: var(--frame); height: auto; flex-direction: column; background-color: var(--bg); background-image: var(--grain); clip-path: inset(0 0 100% 0); transition: clip-path .7s var(--ease-out); border: var(--b) solid var(--line); border-top: 0; }
  .header.menu-open .nav { clip-path: inset(0 0 0 0); }
  .nav-item { width: 100%; height: auto; border-top: var(--b) solid var(--line); }
  .nav-item > .ln.v { display: none; }
  .nav-btn { padding: 2rem 1.6rem; font-size: 1.6rem; }
  .dropdown { position: static; clip-path: none; display: none; border: 0; }
  .nav-item.open .dropdown { display: block; }
  .menu-btn { display: flex; align-items: center; gap: 1.2rem; padding: 0 1.6rem; color: var(--ink); position: relative; }
  .menu-btn .bars { width: 1.8rem; height: 1.2rem; position: relative; }
  .menu-btn .bars i { position: absolute; left: 0; right: 0; height: var(--b); background: currentColor; transition: transform .5s var(--ease-out), opacity .3s; }
  .menu-btn .bars i:nth-child(1) { top: 0; } .menu-btn .bars i:nth-child(2) { top: 50%; } .menu-btn .bars i:nth-child(3) { bottom: 0; }
  .header.menu-open .menu-btn .bars i:nth-child(1) { transform: translateY(.55rem) rotate(45deg); }
  .header.menu-open .menu-btn .bars i:nth-child(2) { opacity: 0; }
  .header.menu-open .menu-btn .bars i:nth-child(3) { transform: translateY(-.55rem) rotate(-45deg); }
}

/* ---------- cursor ---------- */
.cursor { position: fixed; left: 0; top: 0; z-index: 9998; pointer-events: none; mix-blend-mode: normal; }
.cursor-dot { position: absolute; width: .8rem; height: .8rem; margin: -.4rem 0 0 -.4rem; background: var(--brand); transition: transform .35s var(--ease-out), opacity .3s; }
.cursor-ring { position: absolute; width: 3.6rem; height: 3.6rem; margin: -1.8rem 0 0 -1.8rem; transition: transform .45s var(--ease-out), opacity .3s; opacity: 0; }
.cursor-ring i { position: absolute; width: .8rem; height: .8rem; border-color: var(--ink); border-style: solid; border-width: 0; }
.cursor-ring i:nth-child(1) { left: 0; top: 0; border-left-width: var(--b); border-top-width: var(--b); }
.cursor-ring i:nth-child(2) { right: 0; top: 0; border-right-width: var(--b); border-top-width: var(--b); }
.cursor-ring i:nth-child(3) { left: 0; bottom: 0; border-left-width: var(--b); border-bottom-width: var(--b); }
.cursor-ring i:nth-child(4) { right: 0; bottom: 0; border-right-width: var(--b); border-bottom-width: var(--b); }
.cursor.is-link .cursor-dot { transform: scale(.5); }
.cursor.is-link .cursor-ring { opacity: 1; }
.cursor.is-hidden .cursor-dot, .cursor.is-hidden .cursor-ring { opacity: 0; }
.cursor-label { position: absolute; left: 1.4rem; top: 1.2rem; white-space: nowrap; background: var(--ink); color: var(--bg); padding: .4rem .6rem; opacity: 0; transform: translateY(.4rem); transition: opacity .3s, transform .4s var(--ease-out); }
.cursor.has-label .cursor-label { opacity: 1; transform: none; }
@media (hover: none), (max-width: 991px) { .cursor { display: none; } }

/* ---------- cookie ---------- */
.cookie { position: fixed; right: calc(var(--frame) + 0rem); bottom: var(--frame); z-index: 70; width: 60rem; max-width: calc(100vw - 2 * var(--frame)); background-color: var(--bg); background-image: var(--grain); border: var(--b) solid var(--ink); display: flex; align-items: center; justify-content: space-between; padding: .8rem .8rem .8rem 1.2rem; gap: 1.2rem; transform: translateY(calc(100% + 2rem)); transition: transform .8s var(--ease-out); }
.cookie.show { transform: none; }
.cookie p { color: var(--ink); font-size: 1.4rem; }
.cookie p a { color: var(--brand); }
.cookie .acts { display: flex; gap: .4rem; }

/* ---------- page transition ---------- */
.px-cover { position: fixed; inset: 0; z-index: 9990; pointer-events: none; }
.px-cover.on { pointer-events: all; }

/* ---------- loader ---------- */
.loader { position: fixed; inset: 0; z-index: 9000; background-color: var(--bg); background-image: var(--grain); overflow: hidden; }
.loader.done { display: none; }
.loader-frame { position: absolute; inset: var(--frame); border: var(--b) solid var(--line); }
.loader-art { position: absolute; left: 50%; top: 46%; width: 76vw; max-width: 132rem; transform: translate(-50%, -50%); aspect-ratio: 2.2 / 1; }
.loader-art svg, .loader-art canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.loader-art canvas { opacity: 0; }
.loader-progress { position: absolute; left: var(--frame); right: 42%; top: 0; height: var(--b); background: var(--brand); transform-origin: left; }
.loader-pct { position: absolute; left: calc(var(--frame) + 2.4rem); top: 0; color: var(--brand); transform: translateY(-140%); }
.loader-ruler { position: absolute; inset: var(--frame); pointer-events: none; }
.loader-ruler .rx { position: absolute; left: 0; right: 0; height: var(--b); background: var(--line-soft); }
.loader-ruler .ry { position: absolute; top: 0; bottom: 0; width: var(--b); background: var(--line-soft); }
.loader-ruler .coords { position: absolute; color: var(--muted); display: flex; flex-direction: column; gap: .2rem; padding: .6rem; }
.loader-title { position: absolute; left: calc(var(--frame) + 2.4rem); bottom: calc(var(--frame) + 2.4rem); }
.loader-spec { position: absolute; right: calc(var(--frame) + 24rem); bottom: calc(var(--frame) + 2.4rem); width: 32rem; color: var(--ink-2); }
.loader-spec .row { display: grid; grid-template-columns: 9rem 1.6rem 1fr; margin-top: .4rem; }
.loader-spec .dash { border-top: var(--b) dashed var(--ink-2); margin: .6rem 0 .8rem; opacity: .6; }
.loader-boot { position: absolute; right: calc(var(--frame) + 2.4rem); bottom: calc(var(--frame) + 2.4rem); width: 19rem; color: var(--ink-2); height: 11.2rem; display: flex; flex-direction: column; justify-content: flex-start; }
.loader-boot div { opacity: 0; }
@media (max-width: 767px) {
  .loader-art { width: 120vw; top: 38%; }
  .loader-spec, .loader-boot { display: none; }
  .loader-title { bottom: 4rem; }
}

/* ---------- footer ---------- */
.footer { position: relative; margin-top: 0; }
.footer-art { position: relative; height: 30rem; overflow: hidden; }
.footer-art canvas { position: absolute; left: 50%; bottom: -1.2rem; height: 104%; width: auto; transform: translateX(-50%); z-index: 1; }
.footer-main { position: relative; display: grid; grid-template-columns: 3fr 2fr 2fr 2fr 3fr; }
.footer-cell { position: relative; padding: 1.6rem 1.6rem 2rem; min-height: 15rem; }
.footer-cell .lbl { color: var(--muted); margin-bottom: 1.6rem; }
.footer-cell .links a { display: table; color: var(--ink); margin-bottom: .6rem; font-size: 1.5rem; }
.footer-cell .links a.is-current { color: var(--brand); }
.footer-cell .links a:hover { color: var(--brand); }
.footer-title { color: var(--ink); }
.footer-logo { grid-row: span 2; display: grid; place-items: center; }
.footer-logo svg { width: 60%; height: auto; color: var(--ink); }
.footer-form { position: absolute; left: 0; right: 0; bottom: 0; display: flex; border-top: var(--b) solid var(--line); height: 4.4rem; }
.footer-form input { flex: 1; border: 0; background: transparent; padding: 0 1.6rem; outline: 0; color: var(--ink); font-size: 1.4rem; }
.footer-form input::placeholder { color: var(--dim); }
.footer-form .ctl { height: 100%; width: 4.4rem; border-left: var(--b) solid var(--line); }
.footer-form-msg { position: absolute; left: 1.6rem; bottom: 5.2rem; color: var(--brand); opacity: 0; transition: opacity .4s; }
.footer-form-msg.show { opacity: 1; }
.footer-social { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem 1rem; }
.footer-word { position: relative; padding: 4rem 3.2rem; }
.footer-word svg { width: 100%; height: auto; color: var(--ink); overflow: visible; }
.footer-copy { position: relative; display: flex; justify-content: space-between; align-items: stretch; height: 4.4rem; }
.footer-copy .fc-l { display: flex; align-items: center; padding: 0 1.6rem; color: var(--ink-2); }
.footer-copy .fc-r { display: flex; }
.footer-copy .fc-r a { position: relative; display: flex; align-items: center; padding: 0 1.6rem; color: var(--ink); font-size: 1.4rem; }
.footer-copy .fc-r a:hover { color: var(--brand); }
@media (max-width: 991px) {
  .footer-main { grid-template-columns: 1fr 1fr; }
  .footer-logo { display: none; }
  .footer-cell { min-height: 12rem; }
  .footer-cell.span2 { grid-column: span 2; }
  .footer-copy { flex-direction: column; height: auto; }
  .footer-copy .fc-l { padding: 1.4rem 1.6rem; }
  .footer-copy .fc-r a { padding: 1.4rem 1.6rem; }
  .footer-art { height: 18rem; }
}

/* ---------- shared CTA ---------- */
.cta { position: relative; }
.cta-grid { position: relative; display: grid; grid-template-columns: 1fr 1.6fr 1fr 1fr 1fr; }
.cta-head { height: 10.4rem; }
.cta-cell { position: relative; padding: .8rem 1rem; color: var(--muted); }
.cta-main { position: relative; text-align: center; padding: 6rem 1.6rem 2.4rem; }
.cta-main .h2 { max-width: 64rem; margin: 0 auto; }
.cta-main p { margin: 1.6rem auto 2.4rem; color: var(--ink-2); max-width: 46rem; }
.cta-art { position: relative; height: 42rem; }
.cta-art .ink-wrap { position: absolute; left: 50%; bottom: 0; width: 64rem; height: 100%; transform: translateX(-50%); }
@media (max-width: 767px) {
  .cta-grid { grid-template-columns: 1fr 1fr; }
  .cta-art .ink-wrap { width: 100%; }
}

/* ---------- ink mask element ---------- */
.ink-wrap { position: relative; overflow: hidden; }
.ink-wrap > svg { position: absolute; inset: 0; width: 100%; height: 100%; }

/* ---------- reveal helpers ---------- */
[data-reveal] { will-change: transform, opacity; }
.no-js [data-reveal] { opacity: 1 !important; transform: none !important; }

/* ---------- misc ---------- */
.sq { display: inline-block; width: .6rem; height: .6rem; background: var(--brand); vertical-align: middle; }
.tag-dark { background: var(--ink); color: var(--bg); }
.vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.marquee { position: relative; overflow: hidden; white-space: nowrap; }
.marquee-track { display: inline-flex; animation: mq 30s linear infinite; }
.marquee-track > * { flex: none; }
@keyframes mq { to { transform: translateX(-50%); } }
@keyframes fadeLoop { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }
@keyframes blink { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .marquee-track { animation: none; }
}

/* ---------- toast ---------- */
.toast { position: fixed; left: 50%; bottom: 2.4rem; transform: translate(-50%, 2rem); z-index: 9500; background: var(--ink); color: var(--bg); padding: .9rem 1.2rem; opacity: 0; transition: opacity .3s, transform .5s var(--ease-out); pointer-events: none; }
.toast.show { opacity: 1; transform: translate(-50%, 0); }
