/* ==========================================================================
   Krignal — v6, "Paper"
   No colour at all: only paper, the shadows it casts, and graphite. The
   page is an eggshell sheet with crumples and fold creases (generated maps
   in assets/img/paper), headlines are raised out of the paper, small type
   is pressed into it, and each section is a fresh sheet laid on the last,
   torn along its top edge. Motion lives in v6.js.
   ========================================================================== */

:root {
  --paper: #f2f1ee;
  --paper-hi: #fbfbfa;
  --paper-lo: #e6e4e0;
  --graphite: #2c2b29;
  --graphite-2: #55534f;
  --graphite-3: #85827d;
  --hair: rgba(0, 0, 0, .1);
  --egg: url("../img/paper/eggshell-512.webp");
  --crumple: url("../img/paper/crumple-1600.webp");
  --display: "Fraunces", Georgia, serif;
  --text: "Newsreader", Georgia, serif;
  --type: "Courier Prime", "Courier New", monospace;
  --ui: "Inter", system-ui, sans-serif;
  --pad: clamp(20px, 5vw, 64px);
  --ease: cubic-bezier(.22, 1, .36, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; color: var(--graphite); font: 400 1.08rem/1.6 var(--text);
  background: var(--paper) var(--egg) 0 0 / 256px; overflow-x: clip;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, p, ul, ol, figure, blockquote { margin: 0; }
ul, ol { list-style: none; padding: 0; }
a { color: inherit; }
img, svg { display: block; }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.vh { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:focus-visible { outline: 2px solid var(--graphite); outline-offset: 3px; }
.skip { position: absolute; left: 16px; top: -60px; z-index: 300; padding: 10px 16px; background: var(--graphite); color: var(--paper-hi); font: 600 .8rem var(--ui); text-decoration: none; }
.skip:focus { top: 10px; }
.wrap { width: 100%; max-width: 1240px; margin-inline: auto; padding-inline: var(--pad); }

/* ---------- Relief ---------------------------------------------------------
   Raised: the letters are cut from the same eggshell sheet and lifted, lit
   from the top left. Pressed: graphite set into the paper, with the light
   catching the lower lip of the impression. */
.raised {
  display: inline; color: transparent;
  background: var(--paper) var(--egg) 0 0 / 256px;
  -webkit-background-clip: text; background-clip: text;
  filter: drop-shadow(-1px -1px 0 rgba(255, 255, 255, 1)) drop-shadow(1px 1.5px .5px rgba(0, 0, 0, .34)) drop-shadow(2px 5px 5px rgba(0, 0, 0, .14));
}
.deboss-label {
  font: 600 .68rem/1.4 var(--ui); letter-spacing: .2em; text-transform: uppercase;
  color: rgba(0, 0, 0, .44); text-shadow: 0 1px 0 rgba(255, 255, 255, .9), 0 -1px 0 rgba(0, 0, 0, .06);
}
.lede, .hero__lede, p { text-shadow: 0 1px 0 rgba(255, 255, 255, .6); }

/* buttons: a raised paper tab, and a black card for the main action */
.press {
  display: inline-flex; align-items: center; gap: 10px; padding: 14px 24px;
  font: 600 .76rem/1 var(--ui); letter-spacing: .14em; text-transform: uppercase; text-decoration: none;
  color: var(--graphite); background: var(--paper-hi) var(--egg) 0 0 / 256px; border-radius: 3px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 -1px 0 rgba(0, 0, 0, .06), 0 1px 1px rgba(0, 0, 0, .14), 0 8px 18px -10px rgba(0, 0, 0, .35);
  text-shadow: 0 1px 0 rgba(255, 255, 255, .9);
  transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.press:hover { transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 -1px 0 rgba(0, 0, 0, .06), 0 2px 2px rgba(0, 0, 0, .14), 0 14px 24px -12px rgba(0, 0, 0, .4); }
.press:active { transform: translateY(1px); box-shadow: inset 0 2px 4px rgba(0, 0, 0, .18), 0 0 0 rgba(0, 0, 0, 0); }
.press--dark {
  color: #f1efea; background: #2b2a28 var(--egg) 0 0 / 256px; background-blend-mode: multiply;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, .6);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 1px 1px rgba(0, 0, 0, .3), 0 10px 20px -10px rgba(0, 0, 0, .55);
}
.press--sm { padding: 11px 18px; font-size: .7rem; }

/* ---------- Header: pressed into the sheet ---------------------------------- */
.hd { position: fixed; inset: 0 0 auto 0; z-index: 50; transition: background-color .4s, box-shadow .4s; }
.hd.is-solid { background: rgba(242, 241, 238, .9); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); box-shadow: 0 1px 0 var(--hair), 0 6px 14px -12px rgba(0, 0, 0, .3); }
.hd__in { display: flex; align-items: center; gap: 36px; height: 72px; }
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: rgba(0, 0, 0, .62); filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .9)); }
.brand__word { font: 600 1.02rem/1 var(--display); letter-spacing: .3em; text-transform: uppercase; }
.hd__nav { display: flex; gap: 28px; }
.hd__nav a, .hd__ver { font: 600 .7rem/1 var(--ui); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; color: rgba(0, 0, 0, .5); text-shadow: 0 1px 0 rgba(255, 255, 255, .9); transition: color .2s; }
.hd__nav a:hover, .hd__ver:hover { color: var(--graphite); }
.hd__end { margin-left: auto; display: flex; align-items: center; gap: 24px; }
@media (max-width: 960px) { .hd__nav { display: none; } }
@media (max-width: 560px) { .hd__ver { display: none; } .hd__in { gap: 12px; } }

/* ---------- Hero: the paper cut --------------------------------------------- */
.hero {
  position: relative; min-height: max(100svh, 680px); overflow: hidden; isolation: isolate;
  /* white underneath: the grain and the crumples multiply each other, not the colour as well */
  background: var(--crumple) center / cover, #fff var(--egg) 0 0 / 256px; background-blend-mode: multiply;
}
.hero__copy { position: relative; z-index: 10; padding: clamp(110px, 16vh, 170px) var(--pad) 0; max-width: 1240px; margin-inline: auto; }
.hero__h { margin-top: 22px; max-width: 11ch; font: 700 clamp(2.8rem, 7.4vw, 6.4rem)/.98 var(--display); letter-spacing: -.02em; }
.hero__h .raised { display: inline; }
.hero__lede { margin-top: 26px; max-width: 46ch; font-size: clamp(1.05rem, 1.5vw, 1.24rem); color: var(--graphite-2); }
.hero__cta { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 14px; }
.hero__note { margin-top: 16px; font: 400 .9rem var(--type); color: var(--graphite-3); }
.cut { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.cut__layer { position: absolute; inset: 0; width: 100%; height: 100%; will-change: transform; }
/* light from the top left: each layer drops its shadow down and to the right onto the one behind */
.cut__layer--far { filter: drop-shadow(3px 5px 4px rgba(0, 0, 0, .16)); }
.cut__layer--hill { filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, .09)) drop-shadow(3px -6px 9px rgba(0, 0, 0, .16)); }
.cut__layer--near { filter: drop-shadow(4px 7px 6px rgba(0, 0, 0, .2)); }
.cut__layer--hill2 { filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, .1)) drop-shadow(6px -11px 16px rgba(0, 0, 0, .24)); }
.cut__layer--front { filter: drop-shadow(0 -2px 3px rgba(0, 0, 0, .11)) drop-shadow(7px -13px 20px rgba(0, 0, 0, .26)); }
/* the trail is pencil, not paper: soft graphite dots */
.trail { fill: none; stroke: rgba(0, 0, 0, .32); stroke-width: 2.6; stroke-linecap: round; stroke-dasharray: .5 13; }
/* the plane flies well clear of the sheet, so its shadow falls far below it */
.cut__layer--plane { filter: drop-shadow(0 1px 1.2px rgba(0, 0, 0, .34)) drop-shadow(-1px -1px 0 rgba(255, 255, 255, .9)) drop-shadow(18px 42px 22px rgba(0, 0, 0, .2)); }
.plane { transform-box: fill-box; transform-origin: 60% 50%; animation: glide 6s ease-in-out infinite; }
.plane__shade { fill: #000; }
.plane__crease { fill: none; stroke: rgba(255, 255, 255, .9); stroke-width: 1.2; }
.plane__edge { fill: none; stroke: rgba(255, 255, 255, 1); stroke-width: 1.4; }
@keyframes glide {
  0%, 100% { transform: translate(0, 0) rotate(0deg); }
  50% { transform: translate(6px, -10px) rotate(-1.6deg); }
}

/* ---------- Sheets: each section is a new sheet, torn along the top -------- */
.sheet {
  position: relative; z-index: 2; padding: clamp(80px, 11vw, 140px) 0;
  background: var(--crumple) center / 2000px auto, #fff var(--egg) 0 0 / 256px; background-blend-mode: multiply;
  box-shadow: 0 -10px 24px -14px rgba(0, 0, 0, .3);
}
.sheet::before {
  content: ""; position: absolute; left: 0; right: 0; top: -26px; height: 30px; pointer-events: none;
  background: var(--paper) var(--egg) 0 0 / 256px;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 30' preserveAspectRatio='none'%3E%3Cpath d='M0 30 L0 15.5 L4 15.2 L8 14.9 L12 14.6 L16 15.1 L20 15.6 L24 16.0 L28 16.1 L32 16.2 L36 16.3 L40 15.8 L44 15.3 L48 14.8 L52 15.1 L56 15.3 L60 15.6 L64 15.3 L68 15.0 L72 14.8 L76 14.9 L80 15.0 L84 15.0 L88 14.0 L92 13.1 L96 12.3 L100 12.6 L104 12.9 L108 13.1 L112 12.2 L116 11.4 L120 10.6 L124 10.6 L128 10.5 L132 10.4 L136 9.9 L140 9.5 L144 9.4 L148 10.1 L152 10.8 L156 11.3 L160 11.1 L164 10.8 L168 10.7 L172 11.3 L176 11.9 L180 12.2 L184 11.7 L188 11.1 L192 11.1 L196 11.6 L200 12.0 L204 12.5 L208 12.9 L212 13.3 L216 13.6 L220 13.5 L224 13.5 L228 13.6 L232 14.3 L236 14.8 L240 14.9 L244 15.2 L248 15.4 L252 15.4 L256 14.7 L260 14.0 L264 13.6 L268 13.6 L272 13.6 L276 13.5 L280 13.3 L284 13.0 L288 12.8 L292 12.7 L296 12.7 L300 12.4 L304 11.9 L308 11.3 L312 10.9 L316 10.7 L320 10.6 L324 10.4 L328 10.3 L332 10.5 L336 10.9 L340 11.2 L344 11.6 L348 11.8 L352 11.8 L356 11.9 L360 12.3 L364 13.2 L368 14.1 L372 14.4 L376 14.1 L380 13.4 L384 13.0 L388 12.9 L392 12.8 L396 12.7 L400 12.6 L404 12.4 L408 12.7 L412 13.2 L416 13.8 L420 13.8 L424 13.3 L428 13.1 L432 13.0 L436 13.0 L440 12.9 L444 13.0 L448 13.1 L452 13.2 L456 13.6 L460 14.3 L464 14.9 L468 14.9 L472 14.6 L476 14.2 L480 14.1 L484 14.1 L488 14.1 L492 14.5 L496 15.1 L500 15.8 L504 15.7 L508 15.2 L512 14.8 L516 14.8 L520 15.1 L524 15.4 L528 15.5 L532 15.6 L536 15.7 L540 15.7 L544 15.6 L548 15.4 L552 15.5 L556 15.6 L560 15.7 L564 16.1 L568 16.7 L572 17.4 L576 17.4 L580 17.1 L584 16.8 L588 16.7 L592 16.8 L596 16.8 L600 16.9 L604 17.0 L608 17.1 L612 17.6 L616 18.1 L620 18.5 L624 18.5 L628 18.4 L632 18.3 L636 18.4 L640 18.5 L644 18.7 L648 18.5 L652 18.2 L656 17.9 L660 17.8 L664 17.8 L668 17.7 L672 17.6 L676 17.5 L680 17.4 L684 17.4 L688 17.4 L692 17.4 L696 17.6 L700 17.7 L704 17.9 L708 17.9 L712 17.9 L716 18.0 L720 18.3 L724 18.7 L728 19.0 L732 19.8 L736 20.5 L740 21.3 L744 21.2 L748 21.0 L752 20.7 L756 20.3 L760 19.8 L764 19.3 L768 20.3 L772 21.5 L776 22.6 L780 22.3 L784 22.0 L788 21.7 L792 21.5 L796 21.2 L800 20.9 L804 21.1 L808 21.3 L812 21.5 L816 20.8 L820 20.2 L824 19.6 L828 19.0 L832 18.4 L836 17.9 L840 17.5 L844 17.1 L848 16.9 L852 17.1 L856 17.3 L860 17.5 L864 18.1 L868 18.7 L872 19.3 L876 19.9 L880 20.5 L884 21.0 L888 20.8 L892 20.7 L896 20.5 L900 20.6 L904 20.8 L908 21.0 L912 21.3 L916 21.6 L920 21.7 L924 20.6 L928 19.4 L932 18.5 L936 18.8 L940 19.0 L944 19.3 L948 19.2 L952 19.1 L956 19.0 L960 18.9 L964 18.7 L968 18.6 L972 18.7 L976 18.7 L980 18.9 L984 19.3 L988 19.6 L992 19.6 L996 19.5 L1000 19.4 L1004 19.2 L1008 18.6 L1012 18.0 L1016 17.6 L1020 17.5 L1024 17.5 L1028 17.4 L1032 17.3 L1036 17.3 L1040 17.6 L1044 17.6 L1048 17.6 L1052 17.7 L1056 18.1 L1060 18.4 L1064 18.6 L1068 18.6 L1072 18.7 L1076 18.7 L1080 18.9 L1084 19.0 L1088 19.0 L1092 19.4 L1096 19.7 L1100 19.7 L1104 19.3 L1108 18.8 L1112 18.5 L1116 18.2 L1120 18.0 L1124 17.9 L1128 18.0 L1132 18.1 L1136 17.8 L1140 17.2 L1144 16.6 L1148 16.3 L1152 16.4 L1156 16.5 L1160 16.7 L1164 16.9 L1168 17.2 L1172 17.2 L1176 17.1 L1180 16.9 L1184 16.8 L1188 16.9 L1192 17.0 L1196 16.8 L1200 16.1 L1204 15.5 L1208 14.9 L1212 14.2 L1216 13.6 L1220 13.8 L1224 14.7 L1228 15.8 L1232 16.2 L1236 16.0 L1240 15.8 L1244 15.4 L1248 14.8 L1252 14.2 L1256 14.4 L1260 15.2 L1264 16.0 L1268 16.1 L1272 15.7 L1276 15.1 L1280 14.5 L1284 13.8 L1288 13.0 L1292 12.9 L1296 13.2 L1300 13.4 L1304 13.4 L1308 13.2 L1312 13.0 L1316 13.2 L1320 13.8 L1324 14.3 L1328 14.0 L1332 13.1 L1336 12.3 L1340 12.1 L1344 12.2 L1348 12.3 L1352 12.2 L1356 12.1 L1360 12.0 L1364 11.9 L1368 12.0 L1372 12.2 L1376 12.4 L1380 12.5 L1384 12.5 L1388 13.0 L1392 13.6 L1396 14.2 L1400 14.7 L1404 15.2 L1408 15.7 L1412 15.9 L1416 15.5 L1420 15.2 L1424 14.5 L1428 13.8 L1432 13.1 L1436 12.7 L1440 12.4 L1444 12.1 L1448 12.1 L1452 12.3 L1456 12.4 L1460 12.2 L1464 12.4 L1468 12.5 L1472 12.8 L1476 13.2 L1480 13.6 L1484 13.7 L1488 13.8 L1492 13.8 L1496 15.1 L1500 16.6 L1504 18.0 L1508 18.0 L1512 17.6 L1516 17.2 L1520 16.6 L1524 15.9 L1528 15.2 L1532 15.6 L1536 16.1 L1540 16.6 L1544 16.6 L1548 16.7 L1552 16.7 L1556 15.3 L1560 13.7 L1564 12.1 L1568 12.1 L1572 12.1 L1576 12.2 L1580 11.8 L1584 11.4 L1588 10.9 L1592 10.8 L1596 10.6 L1600 10.4 L1600 30 Z' fill='black'/%3E%3C/svg%3E") 0 0 / 1600px 30px repeat-x; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 30' preserveAspectRatio='none'%3E%3Cpath d='M0 30 L0 15.5 L4 15.2 L8 14.9 L12 14.6 L16 15.1 L20 15.6 L24 16.0 L28 16.1 L32 16.2 L36 16.3 L40 15.8 L44 15.3 L48 14.8 L52 15.1 L56 15.3 L60 15.6 L64 15.3 L68 15.0 L72 14.8 L76 14.9 L80 15.0 L84 15.0 L88 14.0 L92 13.1 L96 12.3 L100 12.6 L104 12.9 L108 13.1 L112 12.2 L116 11.4 L120 10.6 L124 10.6 L128 10.5 L132 10.4 L136 9.9 L140 9.5 L144 9.4 L148 10.1 L152 10.8 L156 11.3 L160 11.1 L164 10.8 L168 10.7 L172 11.3 L176 11.9 L180 12.2 L184 11.7 L188 11.1 L192 11.1 L196 11.6 L200 12.0 L204 12.5 L208 12.9 L212 13.3 L216 13.6 L220 13.5 L224 13.5 L228 13.6 L232 14.3 L236 14.8 L240 14.9 L244 15.2 L248 15.4 L252 15.4 L256 14.7 L260 14.0 L264 13.6 L268 13.6 L272 13.6 L276 13.5 L280 13.3 L284 13.0 L288 12.8 L292 12.7 L296 12.7 L300 12.4 L304 11.9 L308 11.3 L312 10.9 L316 10.7 L320 10.6 L324 10.4 L328 10.3 L332 10.5 L336 10.9 L340 11.2 L344 11.6 L348 11.8 L352 11.8 L356 11.9 L360 12.3 L364 13.2 L368 14.1 L372 14.4 L376 14.1 L380 13.4 L384 13.0 L388 12.9 L392 12.8 L396 12.7 L400 12.6 L404 12.4 L408 12.7 L412 13.2 L416 13.8 L420 13.8 L424 13.3 L428 13.1 L432 13.0 L436 13.0 L440 12.9 L444 13.0 L448 13.1 L452 13.2 L456 13.6 L460 14.3 L464 14.9 L468 14.9 L472 14.6 L476 14.2 L480 14.1 L484 14.1 L488 14.1 L492 14.5 L496 15.1 L500 15.8 L504 15.7 L508 15.2 L512 14.8 L516 14.8 L520 15.1 L524 15.4 L528 15.5 L532 15.6 L536 15.7 L540 15.7 L544 15.6 L548 15.4 L552 15.5 L556 15.6 L560 15.7 L564 16.1 L568 16.7 L572 17.4 L576 17.4 L580 17.1 L584 16.8 L588 16.7 L592 16.8 L596 16.8 L600 16.9 L604 17.0 L608 17.1 L612 17.6 L616 18.1 L620 18.5 L624 18.5 L628 18.4 L632 18.3 L636 18.4 L640 18.5 L644 18.7 L648 18.5 L652 18.2 L656 17.9 L660 17.8 L664 17.8 L668 17.7 L672 17.6 L676 17.5 L680 17.4 L684 17.4 L688 17.4 L692 17.4 L696 17.6 L700 17.7 L704 17.9 L708 17.9 L712 17.9 L716 18.0 L720 18.3 L724 18.7 L728 19.0 L732 19.8 L736 20.5 L740 21.3 L744 21.2 L748 21.0 L752 20.7 L756 20.3 L760 19.8 L764 19.3 L768 20.3 L772 21.5 L776 22.6 L780 22.3 L784 22.0 L788 21.7 L792 21.5 L796 21.2 L800 20.9 L804 21.1 L808 21.3 L812 21.5 L816 20.8 L820 20.2 L824 19.6 L828 19.0 L832 18.4 L836 17.9 L840 17.5 L844 17.1 L848 16.9 L852 17.1 L856 17.3 L860 17.5 L864 18.1 L868 18.7 L872 19.3 L876 19.9 L880 20.5 L884 21.0 L888 20.8 L892 20.7 L896 20.5 L900 20.6 L904 20.8 L908 21.0 L912 21.3 L916 21.6 L920 21.7 L924 20.6 L928 19.4 L932 18.5 L936 18.8 L940 19.0 L944 19.3 L948 19.2 L952 19.1 L956 19.0 L960 18.9 L964 18.7 L968 18.6 L972 18.7 L976 18.7 L980 18.9 L984 19.3 L988 19.6 L992 19.6 L996 19.5 L1000 19.4 L1004 19.2 L1008 18.6 L1012 18.0 L1016 17.6 L1020 17.5 L1024 17.5 L1028 17.4 L1032 17.3 L1036 17.3 L1040 17.6 L1044 17.6 L1048 17.6 L1052 17.7 L1056 18.1 L1060 18.4 L1064 18.6 L1068 18.6 L1072 18.7 L1076 18.7 L1080 18.9 L1084 19.0 L1088 19.0 L1092 19.4 L1096 19.7 L1100 19.7 L1104 19.3 L1108 18.8 L1112 18.5 L1116 18.2 L1120 18.0 L1124 17.9 L1128 18.0 L1132 18.1 L1136 17.8 L1140 17.2 L1144 16.6 L1148 16.3 L1152 16.4 L1156 16.5 L1160 16.7 L1164 16.9 L1168 17.2 L1172 17.2 L1176 17.1 L1180 16.9 L1184 16.8 L1188 16.9 L1192 17.0 L1196 16.8 L1200 16.1 L1204 15.5 L1208 14.9 L1212 14.2 L1216 13.6 L1220 13.8 L1224 14.7 L1228 15.8 L1232 16.2 L1236 16.0 L1240 15.8 L1244 15.4 L1248 14.8 L1252 14.2 L1256 14.4 L1260 15.2 L1264 16.0 L1268 16.1 L1272 15.7 L1276 15.1 L1280 14.5 L1284 13.8 L1288 13.0 L1292 12.9 L1296 13.2 L1300 13.4 L1304 13.4 L1308 13.2 L1312 13.0 L1316 13.2 L1320 13.8 L1324 14.3 L1328 14.0 L1332 13.1 L1336 12.3 L1340 12.1 L1344 12.2 L1348 12.3 L1352 12.2 L1356 12.1 L1360 12.0 L1364 11.9 L1368 12.0 L1372 12.2 L1376 12.4 L1380 12.5 L1384 12.5 L1388 13.0 L1392 13.6 L1396 14.2 L1400 14.7 L1404 15.2 L1408 15.7 L1412 15.9 L1416 15.5 L1420 15.2 L1424 14.5 L1428 13.8 L1432 13.1 L1436 12.7 L1440 12.4 L1444 12.1 L1448 12.1 L1452 12.3 L1456 12.4 L1460 12.2 L1464 12.4 L1468 12.5 L1472 12.8 L1476 13.2 L1480 13.6 L1484 13.7 L1488 13.8 L1492 13.8 L1496 15.1 L1500 16.6 L1504 18.0 L1508 18.0 L1512 17.6 L1516 17.2 L1520 16.6 L1524 15.9 L1528 15.2 L1532 15.6 L1536 16.1 L1540 16.6 L1544 16.6 L1548 16.7 L1552 16.7 L1556 15.3 L1560 13.7 L1564 12.1 L1568 12.1 L1572 12.1 L1576 12.2 L1580 11.8 L1584 11.4 L1588 10.9 L1592 10.8 L1596 10.6 L1600 10.4 L1600 30 Z' fill='black'/%3E%3C/svg%3E") 0 0 / 1600px 30px repeat-x;
  filter: drop-shadow(0 -3px 3px rgba(0, 0, 0, .1));
}
.sheet:nth-of-type(even) { background-position: right top, 0 0; }
.sheet__head { max-width: 760px; }
.h2 { margin-top: 18px; font: 700 clamp(2.1rem, 4.6vw, 3.8rem)/1.02 var(--display); letter-spacing: -.02em; }
.lede { margin-top: 18px; font-size: clamp(1.05rem, 1.4vw, 1.2rem); color: var(--graphite-2); max-width: 52ch; }
.lede a { color: var(--graphite); }
.js [data-rv] { opacity: 0; transform: translateY(18px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.js [data-rv].is-in { opacity: 1; transform: none; }

/* ---------- The problem: typed slips ------------------------------------------ */
.problem { overflow: hidden; }
.slips { margin-top: clamp(48px, 6vw, 72px); display: flex; flex-direction: column; gap: 26px; }
.slips__row { display: flex; gap: 26px; width: max-content; will-change: transform; padding-inline: 40px; }
.slips__row:nth-child(2) { margin-left: -200px; }
.slip {
  position: relative; width: 320px; flex: none; padding: 26px 26px 28px;
  background: var(--paper-hi) var(--egg) 0 0 / 256px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .1), 0 12px 22px -14px rgba(0, 0, 0, .35);
}
.slip:nth-child(odd) { transform: rotate(-1.2deg); }
.slip:nth-child(even) { transform: rotate(.9deg); }
/* a strip of tape */
.slip::before {
  content: ""; position: absolute; top: -10px; left: 50%; width: 90px; height: 22px; margin-left: -45px; transform: rotate(-3deg);
  background: rgba(235, 233, 228, .78) var(--egg) 0 0 / 128px; box-shadow: 0 1px 2px rgba(0, 0, 0, .12);
}
.slip figcaption { font: 600 .64rem/1 var(--ui); letter-spacing: .2em; text-transform: uppercase; color: var(--graphite-3); }
.slip blockquote { margin-top: 14px; font: 400 1.02rem/1.5 var(--type); color: var(--graphite); }

/* ---------- How it works: cards landing on the desk -------------------------- */
.how { height: 560vh; padding: 0; }
.how__stage { position: sticky; top: 0; height: 100vh; height: 100svh; display: flex; align-items: center; overflow: hidden; }
.how__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 6vw, 96px); align-items: center; padding-top: 60px; }
.steps { margin-top: 30px; counter-reset: s; }
.steps li { display: grid; grid-template-columns: 54px 1fr; padding: 14px 0; border-top: 1px solid var(--hair); opacity: .42; transition: opacity .5s var(--ease); }
.steps li:last-child { border-bottom: 1px solid var(--hair); }
.steps__n { font: 700 1.4rem/1 var(--display); color: rgba(0, 0, 0, .38); text-shadow: 0 1px 0 rgba(255, 255, 255, .9); }
.steps h3 { font: 600 1.18rem/1.3 var(--display); }
.steps p { max-height: 0; overflow: hidden; opacity: 0; color: var(--graphite-2); font-size: 1rem; transition: max-height .6s var(--ease), opacity .6s var(--ease), margin .6s var(--ease); }
.steps li.is-on { opacity: 1; }
.steps li.is-on .steps__n { color: var(--graphite); }
.steps li.is-on p { max-height: 6em; opacity: 1; margin-top: 6px; }

.desk { position: relative; height: min(440px, 62vh); }
.card {
  position: absolute; left: 50%; top: 50%; width: min(460px, 100%); padding: 28px 30px;
  background: var(--paper-hi) var(--egg) 0 0 / 256px; color: var(--graphite);
  box-shadow: 0 1px 1px rgba(0, 0, 0, .12), 0 2px 4px rgba(0, 0, 0, .06), 0 22px 40px -22px rgba(0, 0, 0, .45);
  transform: translate(-50%, 140vh); will-change: transform;
}
.card__k { display: flex; align-items: center; justify-content: space-between; gap: 12px; font: 600 .66rem/1.4 var(--ui); letter-spacing: .2em; text-transform: uppercase; color: var(--graphite-3); }
.card__stamp {
  padding: 5px 9px; border: 1.5px solid rgba(0, 0, 0, .28); border-radius: 2px; transform: rotate(-4deg);
  color: rgba(0, 0, 0, .46); letter-spacing: .18em;
}
.card__foot { margin-top: 20px; padding-top: 14px; border-top: 1px dashed rgba(0, 0, 0, .18); font: 400 .86rem/1.5 var(--type); color: var(--graphite-2); }
.typed { margin-top: 18px; min-height: 5.4em; font: 400 1.18rem/1.55 var(--type); }
.caret { display: inline-block; width: .55em; height: 1.1em; margin-left: 2px; vertical-align: -.18em; background: rgba(0, 0, 0, .55); animation: blink 1s steps(2, start) infinite; }
@keyframes blink { to { visibility: hidden; } }
.map { margin-top: 18px; display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.map__h { font: 600 .62rem/1.4 var(--ui); letter-spacing: .18em; text-transform: uppercase; color: var(--graphite-3); margin-bottom: 8px; }
.map li { padding: 7px 0; border-bottom: 1px solid var(--hair); font-size: 1rem; }
.map li i { display: block; font: italic 400 .8rem var(--text); color: var(--graphite-3); }
.checklist { margin-top: 16px; }
.checklist li { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--hair); font-size: .98rem; color: var(--graphite-3); }
.checklist li em { margin-left: auto; font: 400 .82rem var(--type); text-decoration: line-through; }
.checklist li.is-match { color: var(--graphite); }
.checklist li.is-match em { text-decoration: none; font-weight: 700; }
.redact { width: 54px; height: 12px; flex: none; background: var(--paper-lo); box-shadow: inset 1px 1px 1px rgba(0, 0, 0, .14), inset -1px -1px 0 rgba(255, 255, 255, .9); }
.halves { margin-top: 16px; display: grid; grid-template-columns: 1fr 20px 1fr; gap: 10px; align-items: stretch; }
.halves p:not(.map__h) { font: 500 1.02rem/1.35 var(--display); }
.stitch { justify-self: center; width: 0; border-left: 2px dashed rgba(0, 0, 0, .3); }
.seals { margin-top: 18px; display: flex; justify-content: center; gap: 34px; }
.seal { position: relative; width: 120px; color: #ecebe7; filter: drop-shadow(-1px -1px 0 rgba(255, 255, 255, .95)) drop-shadow(1px 1px .5px rgba(0, 0, 0, .3)); }
.seal span { position: absolute; inset: 0; display: grid; place-items: center; padding-top: 70px; font: 700 .8rem var(--ui); letter-spacing: .3em; text-transform: uppercase; color: rgba(0, 0, 0, .5); filter: none; }
.card__note { margin-top: 16px; text-align: center; font: italic 400 1.04rem/1.5 var(--text); }

/* ---------- Privacy: a sealed envelope ---------------------------------------- */
.privacy__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 7vw, 110px); align-items: center; }
.envelope { position: relative; aspect-ratio: 1.55; max-width: 520px; width: 100%; justify-self: center; }
.envelope__body {
  position: absolute; inset: 0; background: var(--paper-hi) var(--egg) 0 0 / 256px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .12), 0 30px 50px -28px rgba(0, 0, 0, .5);
}
/* the flap: a triangle of the same paper, folded down, with the crease shaded */
.envelope__flap {
  position: absolute; left: 0; right: 0; top: 0; height: 58%;
  background: var(--paper-hi) var(--egg) 40px 20px / 256px; clip-path: polygon(0 0, 100% 0, 50% 100%);
  filter: drop-shadow(0 4px 4px rgba(0, 0, 0, .14));
}
.envelope::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 60%; background: linear-gradient(160deg, transparent 49.6%, rgba(0, 0, 0, .06) 50%, transparent 50.8%), linear-gradient(-160deg, transparent 49.6%, rgba(0, 0, 0, .06) 50%, transparent 50.8%); pointer-events: none; }
.envelope__seal { position: absolute; left: 50%; top: 58%; width: 96px; transform: translate(-50%, -50%); z-index: 2; color: #ecebe7; filter: drop-shadow(-1px -1px 0 rgba(255, 255, 255, .95)) drop-shadow(1px 1.5px .5px rgba(0, 0, 0, .3)); }
.envelope__to { position: absolute; left: 9%; bottom: 10%; z-index: 2; font: 400 .92rem var(--type); color: var(--graphite-3); }
.envelope__to span { color: var(--graphite); border-bottom: 1px solid rgba(0, 0, 0, .25); }
.pressed-list { margin-top: 28px; }
.pressed-list li { padding: 14px 0; border-top: 1px solid var(--hair); color: var(--graphite-2); font-size: 1.02rem; }
.pressed-list li:last-child { border-bottom: 1px solid var(--hair); }
.pressed-list b { color: var(--graphite); font-weight: 500; }

/* ---------- Who: tent cards with a centre fold -------------------------------- */
.tents { margin-top: clamp(40px, 5vw, 64px); display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(18px, 2.4vw, 32px); align-items: start; }
.tent {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: 34px 30px 32px;
  background: var(--paper-hi) var(--egg) 0 0 / 256px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .1), 0 24px 40px -26px rgba(0, 0, 0, .45);
}
.tent::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 46px; background: linear-gradient(180deg, rgba(0, 0, 0, .05), transparent 70%); border-bottom: 1px solid rgba(255, 255, 255, .8); box-shadow: 0 1px 0 rgba(0, 0, 0, .07); }
.tent__k { position: relative; font: 600 .66rem/1.4 var(--ui); letter-spacing: .2em; text-transform: uppercase; color: var(--graphite-3); }
.tent h3 { margin-top: 14px; font: 600 1.5rem/1.15 var(--display); }
.tent p:not(.tent__k):not(.tent__meta) { color: var(--graphite-2); font-size: 1rem; }
.tent__meta { font: 400 .8rem/1.5 var(--type); color: var(--graphite-3); }
.tent .press { margin-top: 8px; }

/* ---------- On the record: a clipping and a ticket ----------------------------- */
.record__grid { margin-top: clamp(40px, 5vw, 64px); display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.clipping {
  padding: 34px 34px 30px; background: #efeeea var(--egg) 0 0 / 256px; transform: rotate(-.8deg);
  clip-path: polygon(0.00% 0.03%, 1.12% 0.09%, 2.25% 0.20%, 3.37% 0.08%, 4.49% 0.02%, 5.62% 0.01%, 6.74% 0.00%, 7.87% 0.14%, 8.99% 0.21%, 10.11% 0.04%, 11.24% 0.10%, 12.36% 0.21%, 13.48% 0.27%, 14.61% 0.23%, 15.73% 0.11%, 16.85% 0.14%, 17.98% 0.24%, 19.10% 0.15%, 20.22% 0.09%, 21.35% 0.04%, 22.47% 0.17%, 23.60% 0.40%, 24.72% 0.56%, 25.84% 0.65%, 26.97% 0.76%, 28.09% 0.88%, 29.21% 0.74%, 30.34% 0.56%, 31.46% 0.69%, 32.58% 0.86%, 33.71% 0.84%, 34.83% 0.72%, 35.96% 0.46%, 37.08% 0.22%, 38.20% 0.14%, 39.33% 0.08%, 40.45% 0.13%, 41.57% 0.14%, 42.70% 0.10%, 43.82% 0.06%, 44.94% 0.04%, 46.07% 0.13%, 47.19% 0.19%, 48.31% 0.21%, 49.44% 0.15%, 50.56% 0.10%, 51.69% 0.04%, 52.81% 0.08%, 53.93% 0.26%, 55.06% 0.38%, 56.18% 0.49%, 57.30% 0.69%, 58.43% 0.91%, 59.55% 0.75%, 60.67% 0.57%, 61.80% 0.61%, 62.92% 0.69%, 64.04% 0.31%, 65.17% 0.13%, 66.29% 0.19%, 67.42% 0.11%, 68.54% 0.08%, 69.66% 0.07%, 70.79% 0.19%, 71.91% 0.27%, 73.03% 0.13%, 74.16% 0.08%, 75.28% 0.36%, 76.40% 0.49%, 77.53% 0.25%, 78.65% 0.07%, 79.78% 0.03%, 80.90% 0.02%, 82.02% 0.29%, 83.15% 0.36%, 84.27% 0.22%, 85.39% 0.04%, 86.52% 0.18%, 87.64% 0.21%, 88.76% 0.11%, 89.89% 0.04%, 91.01% 0.02%, 92.13% 0.04%, 93.26% 0.13%, 94.38% 0.15%, 95.51% 0.16%, 96.63% 0.29%, 97.75% 0.43%, 98.88% 0.44%, 100.00% 0.44%, 99.94% 0.00%, 99.90% 1.12%, 99.86% 2.25%, 99.85% 3.37%, 99.83% 4.49%, 99.82% 5.62%, 99.82% 6.74%, 99.85% 7.87%, 99.88% 8.99%, 99.90% 10.11%, 99.94% 11.24%, 100.00% 12.36%, 99.95% 13.48%, 99.93% 14.61%, 99.90% 15.73%, 99.85% 16.85%, 99.81% 17.98%, 99.80% 19.10%, 99.81% 20.22%, 99.84% 21.35%, 99.80% 22.47%, 99.74% 23.60%, 99.66% 24.72%, 99.64% 25.84%, 99.71% 26.97%, 99.79% 28.09%, 99.78% 29.21%, 99.76% 30.34%, 99.75% 31.46%, 99.75% 32.58%, 99.89% 33.71%, 100.00% 34.83%, 99.94% 35.96%, 99.92% 37.08%, 99.88% 38.20%, 99.72% 39.33%, 99.79% 40.45%, 99.83% 41.57%, 99.81% 42.70%, 99.84% 43.82%, 100.00% 44.94%, 99.96% 46.07%, 99.87% 47.19%, 99.81% 48.31%, 99.90% 49.44%, 99.99% 50.56%, 99.91% 51.69%, 99.84% 52.81%, 99.79% 53.93%, 99.76% 55.06%, 99.76% 56.18%, 99.71% 57.30%, 99.66% 58.43%, 99.67% 59.55%, 99.68% 60.67%, 99.66% 61.80%, 99.62% 62.92%, 99.77% 64.04%, 99.95% 65.17%, 99.89% 66.29%, 99.85% 67.42%, 99.90% 68.54%, 99.95% 69.66%, 100.00% 70.79%, 99.98% 71.91%, 99.91% 73.03%, 99.87% 74.16%, 99.91% 75.28%, 99.81% 76.40%, 99.88% 77.53%, 99.94% 78.65%, 99.95% 79.78%, 99.96% 80.90%, 99.96% 82.02%, 99.99% 83.15%, 99.91% 84.27%, 99.91% 85.39%, 99.99% 86.52%, 99.94% 87.64%, 99.81% 88.76%, 99.73% 89.89%, 99.68% 91.01%, 99.65% 92.13%, 99.63% 93.26%, 99.66% 94.38%, 99.70% 95.51%, 99.72% 96.63%, 99.73% 97.75%, 99.63% 98.88%, 99.52% 100.00%, 100.00% 99.27%, 98.88% 99.40%, 97.75% 99.53%, 96.63% 99.62%, 95.51% 99.72%, 94.38% 99.91%, 93.26% 99.91%, 92.13% 99.80%, 91.01% 99.83%, 89.89% 99.98%, 88.76% 99.94%, 87.64% 100.00%, 86.52% 99.89%, 85.39% 99.51%, 84.27% 99.31%, 83.15% 99.36%, 82.02% 99.68%, 80.90% 99.91%, 79.78% 99.73%, 78.65% 99.72%, 77.53% 99.67%, 76.40% 99.61%, 75.28% 99.52%, 74.16% 99.54%, 73.03% 99.51%, 71.91% 99.45%, 70.79% 99.59%, 69.66% 99.76%, 68.54% 99.86%, 67.42% 99.97%, 66.29% 99.87%, 65.17% 99.73%, 64.04% 99.80%, 62.92% 99.86%, 61.80% 99.77%, 60.67% 99.69%, 59.55% 99.66%, 58.43% 99.63%, 57.30% 99.63%, 56.18% 99.65%, 55.06% 99.72%, 53.93% 99.75%, 52.81% 99.73%, 51.69% 99.76%, 50.56% 99.87%, 49.44% 99.86%, 48.31% 99.71%, 47.19% 99.73%, 46.07% 99.89%, 44.94% 99.90%, 43.82% 99.67%, 42.70% 99.68%, 41.57% 99.79%, 40.45% 99.73%, 39.33% 99.60%, 38.20% 99.57%, 37.08% 99.56%, 35.96% 99.52%, 34.83% 99.49%, 33.71% 99.52%, 32.58% 99.60%, 31.46% 99.84%, 30.34% 99.94%, 29.21% 99.99%, 28.09% 99.98%, 26.97% 99.96%, 25.84% 99.88%, 24.72% 99.75%, 23.60% 99.75%, 22.47% 99.91%, 21.35% 100.00%, 20.22% 99.98%, 19.10% 99.98%, 17.98% 100.00%, 16.85% 99.89%, 15.73% 99.66%, 14.61% 99.55%, 13.48% 99.51%, 12.36% 99.51%, 11.24% 99.51%, 10.11% 99.49%, 8.99% 99.46%, 7.87% 99.45%, 6.74% 99.52%, 5.62% 99.62%, 4.49% 99.71%, 3.37% 99.82%, 2.25% 99.93%, 1.12% 99.99%, 0.00% 99.92%, 0.07% 100.00%, 0.05% 98.88%, 0.03% 97.75%, 0.03% 96.63%, 0.03% 95.51%, 0.04% 94.38%, 0.04% 93.26%, 0.02% 92.13%, 0.04% 91.01%, 0.11% 89.89%, 0.19% 88.76%, 0.10% 87.64%, 0.07% 86.52%, 0.15% 85.39%, 0.18% 84.27%, 0.16% 83.15%, 0.15% 82.02%, 0.15% 80.90%, 0.17% 79.78%, 0.21% 78.65%, 0.16% 77.53%, 0.06% 76.40%, 0.03% 75.28%, 0.01% 74.16%, 0.04% 73.03%, 0.11% 71.91%, 0.12% 70.79%, 0.12% 69.66%, 0.04% 68.54%, 0.06% 67.42%, 0.09% 66.29%, 0.20% 65.17%, 0.10% 64.04%, 0.01% 62.92%, 0.04% 61.80%, 0.06% 60.67%, 0.06% 59.55%, 0.06% 58.43%, 0.02% 57.30%, 0.02% 56.18%, 0.10% 55.06%, 0.11% 53.93%, 0.02% 52.81%, 0.14% 51.69%, 0.25% 50.56%, 0.22% 49.44%, 0.05% 48.31%, 0.01% 47.19%, 0.01% 46.07%, 0.02% 44.94%, 0.08% 43.82%, 0.07% 42.70%, 0.02% 41.57%, 0.07% 40.45%, 0.16% 39.33%, 0.02% 38.20%, 0.15% 37.08%, 0.06% 35.96%, 0.06% 34.83%, 0.13% 33.71%, 0.25% 32.58%, 0.12% 31.46%, 0.01% 30.34%, 0.15% 29.21%, 0.28% 28.09%, 0.39% 26.97%, 0.50% 25.84%, 0.56% 24.72%, 0.58% 23.60%, 0.65% 22.47%, 0.69% 21.35%, 0.69% 20.22%, 0.66% 19.10%, 0.61% 17.98%, 0.58% 16.85%, 0.48% 15.73%, 0.37% 14.61%, 0.27% 13.48%, 0.19% 12.36%, 0.14% 11.24%, 0.08% 10.11%, 0.02% 8.99%, 0.04% 7.87%, 0.06% 6.74%, 0.13% 5.62%, 0.21% 4.49%, 0.24% 3.37%, 0.26% 2.25%, 0.16% 1.12%, 0.04% 0.00%);
}
.clipping__mast { font: 600 .66rem/1.4 var(--ui); letter-spacing: .2em; text-transform: uppercase; color: var(--graphite-3); border-bottom: 2px solid rgba(0, 0, 0, .55); padding-bottom: 10px; }
.clipping h3 { margin-top: 16px; font: 700 clamp(1.6rem, 2.6vw, 2.2rem)/1.08 var(--display); }
.clipping__cols { margin-top: 18px; columns: 2; column-gap: 26px; column-rule: 1px solid var(--hair); font-size: .98rem; color: var(--graphite-2); text-align: justify; hyphens: auto; }
.clipping__cols p + p { margin-top: 10px; }
.clipping__link { margin-top: 20px; display: inline-flex; align-items: center; gap: 8px; font: 600 .7rem/1 var(--ui); letter-spacing: .16em; text-transform: uppercase; text-decoration: none; color: var(--graphite); border-bottom: 1px solid rgba(0, 0, 0, .3); padding-bottom: 4px; }
.record__side { display: flex; flex-direction: column; gap: 28px; }
.ticket { display: grid; grid-template-columns: 1fr 86px; background: var(--paper-hi) var(--egg) 0 0 / 256px; box-shadow: 0 1px 1px rgba(0, 0, 0, .1), 0 20px 34px -22px rgba(0, 0, 0, .45); transform: rotate(1deg); }
.ticket__main { padding: 26px 26px 24px; }
.ticket__k { font: 600 .64rem/1.4 var(--ui); letter-spacing: .2em; text-transform: uppercase; color: var(--graphite-3); }
.ticket h3 { margin-top: 10px; font: 700 1.9rem/1 var(--display); }
.ticket__main p:not(.ticket__k) { margin-top: 10px; font-size: .98rem; color: var(--graphite-2); }
.ticket__stub { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; border-left: 2px dotted rgba(0, 0, 0, .25); font: 700 .78rem var(--type); text-transform: uppercase; letter-spacing: .1em; color: var(--graphite-3); writing-mode: vertical-rl; }
.formats li { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-top: 1px solid var(--hair); font-size: 1rem; }
.formats li:last-child { border-bottom: 1px solid var(--hair); }
.formats b { font-weight: 500; }
.formats span { font: 400 .82rem var(--type); color: var(--graphite-3); }

/* ---------- Questions: folded notes -------------------------------------------- */
.faq__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 90px); }
.notes { display: flex; flex-direction: column; gap: 12px; }
.note { background: var(--paper-hi) var(--egg) 0 0 / 256px; box-shadow: 0 1px 1px rgba(0, 0, 0, .1), 0 10px 18px -14px rgba(0, 0, 0, .4); }
.note summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; font: 600 1.08rem/1.35 var(--display); }
.note summary::-webkit-details-marker { display: none; }
.note summary svg { flex: none; color: var(--graphite-3); transition: transform .3s var(--ease); }
.note[open] summary svg { transform: rotate(45deg); }
.note p { padding: 16px 22px 20px; border-top: 1px dashed rgba(0, 0, 0, .16); color: var(--graphite-2); font-size: 1rem; box-shadow: inset 0 8px 10px -10px rgba(0, 0, 0, .25); }

/* ---------- The invitation: deckled card, blind-embossed ------------------------ */
.invite { display: grid; }
.invitation {
  position: relative; max-width: 760px; margin-inline: auto; padding: clamp(48px, 7vw, 80px) clamp(28px, 6vw, 72px);
  text-align: center; display: flex; flex-direction: column; align-items: center;
  background: var(--paper-hi) var(--egg) 0 0 / 256px; clip-path: polygon(0.00% 0.03%, 1.12% 0.09%, 2.25% 0.20%, 3.37% 0.08%, 4.49% 0.02%, 5.62% 0.01%, 6.74% 0.00%, 7.87% 0.14%, 8.99% 0.21%, 10.11% 0.04%, 11.24% 0.10%, 12.36% 0.21%, 13.48% 0.27%, 14.61% 0.23%, 15.73% 0.11%, 16.85% 0.14%, 17.98% 0.24%, 19.10% 0.15%, 20.22% 0.09%, 21.35% 0.04%, 22.47% 0.17%, 23.60% 0.40%, 24.72% 0.56%, 25.84% 0.65%, 26.97% 0.76%, 28.09% 0.88%, 29.21% 0.74%, 30.34% 0.56%, 31.46% 0.69%, 32.58% 0.86%, 33.71% 0.84%, 34.83% 0.72%, 35.96% 0.46%, 37.08% 0.22%, 38.20% 0.14%, 39.33% 0.08%, 40.45% 0.13%, 41.57% 0.14%, 42.70% 0.10%, 43.82% 0.06%, 44.94% 0.04%, 46.07% 0.13%, 47.19% 0.19%, 48.31% 0.21%, 49.44% 0.15%, 50.56% 0.10%, 51.69% 0.04%, 52.81% 0.08%, 53.93% 0.26%, 55.06% 0.38%, 56.18% 0.49%, 57.30% 0.69%, 58.43% 0.91%, 59.55% 0.75%, 60.67% 0.57%, 61.80% 0.61%, 62.92% 0.69%, 64.04% 0.31%, 65.17% 0.13%, 66.29% 0.19%, 67.42% 0.11%, 68.54% 0.08%, 69.66% 0.07%, 70.79% 0.19%, 71.91% 0.27%, 73.03% 0.13%, 74.16% 0.08%, 75.28% 0.36%, 76.40% 0.49%, 77.53% 0.25%, 78.65% 0.07%, 79.78% 0.03%, 80.90% 0.02%, 82.02% 0.29%, 83.15% 0.36%, 84.27% 0.22%, 85.39% 0.04%, 86.52% 0.18%, 87.64% 0.21%, 88.76% 0.11%, 89.89% 0.04%, 91.01% 0.02%, 92.13% 0.04%, 93.26% 0.13%, 94.38% 0.15%, 95.51% 0.16%, 96.63% 0.29%, 97.75% 0.43%, 98.88% 0.44%, 100.00% 0.44%, 99.94% 0.00%, 99.90% 1.12%, 99.86% 2.25%, 99.85% 3.37%, 99.83% 4.49%, 99.82% 5.62%, 99.82% 6.74%, 99.85% 7.87%, 99.88% 8.99%, 99.90% 10.11%, 99.94% 11.24%, 100.00% 12.36%, 99.95% 13.48%, 99.93% 14.61%, 99.90% 15.73%, 99.85% 16.85%, 99.81% 17.98%, 99.80% 19.10%, 99.81% 20.22%, 99.84% 21.35%, 99.80% 22.47%, 99.74% 23.60%, 99.66% 24.72%, 99.64% 25.84%, 99.71% 26.97%, 99.79% 28.09%, 99.78% 29.21%, 99.76% 30.34%, 99.75% 31.46%, 99.75% 32.58%, 99.89% 33.71%, 100.00% 34.83%, 99.94% 35.96%, 99.92% 37.08%, 99.88% 38.20%, 99.72% 39.33%, 99.79% 40.45%, 99.83% 41.57%, 99.81% 42.70%, 99.84% 43.82%, 100.00% 44.94%, 99.96% 46.07%, 99.87% 47.19%, 99.81% 48.31%, 99.90% 49.44%, 99.99% 50.56%, 99.91% 51.69%, 99.84% 52.81%, 99.79% 53.93%, 99.76% 55.06%, 99.76% 56.18%, 99.71% 57.30%, 99.66% 58.43%, 99.67% 59.55%, 99.68% 60.67%, 99.66% 61.80%, 99.62% 62.92%, 99.77% 64.04%, 99.95% 65.17%, 99.89% 66.29%, 99.85% 67.42%, 99.90% 68.54%, 99.95% 69.66%, 100.00% 70.79%, 99.98% 71.91%, 99.91% 73.03%, 99.87% 74.16%, 99.91% 75.28%, 99.81% 76.40%, 99.88% 77.53%, 99.94% 78.65%, 99.95% 79.78%, 99.96% 80.90%, 99.96% 82.02%, 99.99% 83.15%, 99.91% 84.27%, 99.91% 85.39%, 99.99% 86.52%, 99.94% 87.64%, 99.81% 88.76%, 99.73% 89.89%, 99.68% 91.01%, 99.65% 92.13%, 99.63% 93.26%, 99.66% 94.38%, 99.70% 95.51%, 99.72% 96.63%, 99.73% 97.75%, 99.63% 98.88%, 99.52% 100.00%, 100.00% 99.27%, 98.88% 99.40%, 97.75% 99.53%, 96.63% 99.62%, 95.51% 99.72%, 94.38% 99.91%, 93.26% 99.91%, 92.13% 99.80%, 91.01% 99.83%, 89.89% 99.98%, 88.76% 99.94%, 87.64% 100.00%, 86.52% 99.89%, 85.39% 99.51%, 84.27% 99.31%, 83.15% 99.36%, 82.02% 99.68%, 80.90% 99.91%, 79.78% 99.73%, 78.65% 99.72%, 77.53% 99.67%, 76.40% 99.61%, 75.28% 99.52%, 74.16% 99.54%, 73.03% 99.51%, 71.91% 99.45%, 70.79% 99.59%, 69.66% 99.76%, 68.54% 99.86%, 67.42% 99.97%, 66.29% 99.87%, 65.17% 99.73%, 64.04% 99.80%, 62.92% 99.86%, 61.80% 99.77%, 60.67% 99.69%, 59.55% 99.66%, 58.43% 99.63%, 57.30% 99.63%, 56.18% 99.65%, 55.06% 99.72%, 53.93% 99.75%, 52.81% 99.73%, 51.69% 99.76%, 50.56% 99.87%, 49.44% 99.86%, 48.31% 99.71%, 47.19% 99.73%, 46.07% 99.89%, 44.94% 99.90%, 43.82% 99.67%, 42.70% 99.68%, 41.57% 99.79%, 40.45% 99.73%, 39.33% 99.60%, 38.20% 99.57%, 37.08% 99.56%, 35.96% 99.52%, 34.83% 99.49%, 33.71% 99.52%, 32.58% 99.60%, 31.46% 99.84%, 30.34% 99.94%, 29.21% 99.99%, 28.09% 99.98%, 26.97% 99.96%, 25.84% 99.88%, 24.72% 99.75%, 23.60% 99.75%, 22.47% 99.91%, 21.35% 100.00%, 20.22% 99.98%, 19.10% 99.98%, 17.98% 100.00%, 16.85% 99.89%, 15.73% 99.66%, 14.61% 99.55%, 13.48% 99.51%, 12.36% 99.51%, 11.24% 99.51%, 10.11% 99.49%, 8.99% 99.46%, 7.87% 99.45%, 6.74% 99.52%, 5.62% 99.62%, 4.49% 99.71%, 3.37% 99.82%, 2.25% 99.93%, 1.12% 99.99%, 0.00% 99.92%, 0.07% 100.00%, 0.05% 98.88%, 0.03% 97.75%, 0.03% 96.63%, 0.03% 95.51%, 0.04% 94.38%, 0.04% 93.26%, 0.02% 92.13%, 0.04% 91.01%, 0.11% 89.89%, 0.19% 88.76%, 0.10% 87.64%, 0.07% 86.52%, 0.15% 85.39%, 0.18% 84.27%, 0.16% 83.15%, 0.15% 82.02%, 0.15% 80.90%, 0.17% 79.78%, 0.21% 78.65%, 0.16% 77.53%, 0.06% 76.40%, 0.03% 75.28%, 0.01% 74.16%, 0.04% 73.03%, 0.11% 71.91%, 0.12% 70.79%, 0.12% 69.66%, 0.04% 68.54%, 0.06% 67.42%, 0.09% 66.29%, 0.20% 65.17%, 0.10% 64.04%, 0.01% 62.92%, 0.04% 61.80%, 0.06% 60.67%, 0.06% 59.55%, 0.06% 58.43%, 0.02% 57.30%, 0.02% 56.18%, 0.10% 55.06%, 0.11% 53.93%, 0.02% 52.81%, 0.14% 51.69%, 0.25% 50.56%, 0.22% 49.44%, 0.05% 48.31%, 0.01% 47.19%, 0.01% 46.07%, 0.02% 44.94%, 0.08% 43.82%, 0.07% 42.70%, 0.02% 41.57%, 0.07% 40.45%, 0.16% 39.33%, 0.02% 38.20%, 0.15% 37.08%, 0.06% 35.96%, 0.06% 34.83%, 0.13% 33.71%, 0.25% 32.58%, 0.12% 31.46%, 0.01% 30.34%, 0.15% 29.21%, 0.28% 28.09%, 0.39% 26.97%, 0.50% 25.84%, 0.56% 24.72%, 0.58% 23.60%, 0.65% 22.47%, 0.69% 21.35%, 0.69% 20.22%, 0.66% 19.10%, 0.61% 17.98%, 0.58% 16.85%, 0.48% 15.73%, 0.37% 14.61%, 0.27% 13.48%, 0.19% 12.36%, 0.14% 11.24%, 0.08% 10.11%, 0.02% 8.99%, 0.04% 7.87%, 0.06% 6.74%, 0.13% 5.62%, 0.21% 4.49%, 0.24% 3.37%, 0.26% 2.25%, 0.16% 1.12%, 0.04% 0.00%);
}
.invitation__seal { width: 96px; color: #ecebe7; margin-bottom: 20px; filter: drop-shadow(-1px -1px 0 rgba(255, 255, 255, .95)) drop-shadow(1px 1.5px .5px rgba(0, 0, 0, .3)); }
.invitation__h { margin-top: 16px; font: 700 clamp(2.3rem, 5.4vw, 4.2rem)/1.02 var(--display); letter-spacing: -.02em; }
.invitation__lede { margin-top: 18px; max-width: 46ch; color: var(--graphite-2); }
.invitation__cta { margin-top: 28px; display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
.invitation__fine { margin-top: 20px; font: 400 .82rem var(--type); color: var(--graphite-3); }

/* a clipped shape loses its box-shadow, so deckled sheets are lifted by their wrapper */
.lift { filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .12)) drop-shadow(0 18px 22px rgba(0, 0, 0, .18)); }

/* ---------- Footer ---------------------------------------------------------------- */
.ft { padding: 56px 0 40px; }
.ft__in { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; }
.ft nav { display: flex; flex-wrap: wrap; gap: 10px 24px; }
.ft nav a { font: 600 .7rem/1 var(--ui); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; color: rgba(0, 0, 0, .5); text-shadow: 0 1px 0 rgba(255, 255, 255, .9); }
.ft nav a:hover { color: var(--graphite); }
.ft p { font: 400 .82rem var(--type); color: var(--graphite-3); }

/* ---------- Narrow screens ----------------------------------------------------------- */
@media (max-width: 760px) {
  /* on a phone the paper cut sits in the lower half, under the copy */
  .hero { min-height: max(100svh, 960px); }
  .cut { top: auto; height: 44%; }
}
@media (max-width: 860px) {
  .how { height: 520vh; }
  .how__grid { grid-template-columns: 1fr; gap: 18px; padding-top: 70px; align-content: center; }
  .how__text .deboss-label, .how__text .h2 { display: none; }
  .steps { margin-top: 0; }
  .steps li { display: none; border: 0 !important; padding: 0; opacity: 1; }
  .steps li.is-on { display: grid; }
  .desk { height: min(420px, 56vh); }
  .card { padding: 22px 22px; }
  .typed { font-size: 1.02rem; min-height: 6em; }
  .privacy__grid, .faq__grid, .record__grid { grid-template-columns: 1fr; }
  .tents { grid-template-columns: 1fr; }
  .clipping__cols { columns: 1; }
}
@media (max-width: 560px) {
  .slip { width: 268px; padding: 22px; }
  .slip blockquote { font-size: .94rem; }
  .map { grid-template-columns: 1fr; gap: 10px; }
  .map li { padding: 4px 0; font-size: .92rem; }
  .halves { grid-template-columns: 1fr; }
  .stitch { height: 16px; }
  .seal { width: 92px; }
  .seals { gap: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
  .js [data-rv] { opacity: 1; transform: none; }
}