/* ===== LANDO SYSTEM — design tokens ===== */
:root {
  --cream: #F2F0E9;
  --olive: #23261C;
  --lime: #3DA9FC;
  --green: #3A7CA5;
  --ink: #1E2018;
  --font-display: 'Anton', sans-serif;
  --font-serif: 'Fraunces', serif;
  --font-body: 'Archivo', sans-serif;
  --font-script: 'Caveat', cursive;
  --header-h: 5.5rem;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  font-family: var(--font-body);
  background: var(--cream);
  color: var(--ink);
  line-height: 1.5;
  overflow-x: hidden;
}
img { max-width: 100%; display: block; -webkit-user-drag: none; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }

/* ===== layout ===== */
.container { width: min(100% - 3rem, 1360px); margin-inline: auto; }
.section, .hero { scroll-margin-top: 6rem; } /* clear fixed header when scrolled/anchored to */
.section { position: relative; padding: clamp(4rem, 10vw, 8rem) 0; overflow: hidden; }
.section--cream { background: var(--cream); color: var(--ink); }
.section--olive { background: var(--olive); color: var(--cream); }

/* topographic texture — drifts continuously like landonorris.com */
.topo { overflow: clip; }
.topo::before {
  content: '';
  position: absolute; top: -1200px; left: -1200px; right: 0; bottom: 0;
  pointer-events: none;
  animation: topo-drift 24s linear infinite;
  will-change: transform;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='1200' viewBox='0 0 1200 1200' fill='none'%3E%3Cg stroke='%231E2018' stroke-width='2.5' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M0 105C67 103 133 203 200 223C267 243 333 239 400 227C467 215 533 159 600 152C667 144 733 168 800 183C867 197 933 251 1000 238C1067 225 1133 107 1200 105'/%3E%3Cpath d='M0 203C67 202 133 312 200 329C267 346 333 318 400 306C467 295 533 261 600 258C667 254 733 271 800 284C867 298 933 351 1000 337C1067 324 1133 204 1200 203'/%3E%3Cpath d='M0 880C80 895 160 890 240 876C320 862 400 823 480 796C560 769 640 717 720 715C800 713 880 758 960 786C1040 813 1120 865 1200 880'/%3E%3Cpath d='M0 972C80 985 160 959 240 942C320 925 400 896 480 872C560 848 640 801 720 800C800 799 880 839 960 868C1040 897 1120 960 1200 972'/%3E%3Cpath d='M582 612C581 643 534 661 505 685C477 709 440 751 410 755C381 759 358 716 328 709C298 701 252 730 228 710C205 690 190 626 188 587C185 547 191 495 213 473C234 452 280 464 317 457C354 450 401 425 434 432C466 439 488 469 512 499C537 529 583 581 582 612Z'/%3E%3Cpath d='M490 601C489 619 463 629 447 642C432 655 411 678 395 680C379 682 367 659 350 655C333 651 308 667 295 656C282 644 274 609 273 588C271 566 275 537 287 525C298 513 324 520 344 516C364 513 390 499 408 503C426 507 438 523 451 539C465 556 491 584 490 601Z'/%3E%3Cpath d='M1101 565C1097 595 1076 622 1057 639C1037 656 1015 661 986 668C956 674 910 689 879 680C847 671 804 640 797 612C790 585 819 548 837 516C855 485 880 449 907 425C934 401 969 368 998 373C1027 379 1064 427 1081 459C1099 491 1105 535 1101 565Z'/%3E%3Cpath d='M1040 561C1038 578 1026 592 1016 602C1005 611 993 614 977 617C960 621 935 630 918 624C900 619 877 602 873 587C869 572 885 552 895 534C905 517 919 497 933 484C948 471 967 453 983 456C999 459 1020 485 1029 503C1039 520 1042 545 1040 561Z'/%3E%3Cpath d='M879 1002C873 1026 824 1045 803 1072C782 1098 780 1147 754 1162C728 1177 674 1178 647 1163C620 1148 606 1103 591 1070C577 1038 548 1001 560 970C571 938 627 896 660 881C692 865 725 867 755 875C785 883 818 909 839 931C860 952 884 979 879 1002Z'/%3E%3Cpath d='M806 1006C803 1019 776 1030 765 1045C753 1059 752 1086 737 1094C723 1102 694 1103 679 1095C664 1087 656 1062 648 1044C640 1026 624 1006 631 988C637 971 668 948 686 940C703 931 721 932 738 936C754 941 773 955 784 967C796 979 809 993 806 1006Z'/%3E%3Cpath d='M1115 1055C1118 1075 1120 1100 1110 1119C1100 1138 1074 1169 1056 1171C1037 1173 1022 1140 1000 1132C978 1124 930 1135 922 1121C914 1107 951 1072 952 1049C952 1026 920 999 925 982C930 966 962 954 983 951C1005 948 1035 955 1053 963C1072 972 1083 985 1093 1001C1104 1016 1113 1036 1115 1055Z'/%3E%3Cpath d='M1077 1054C1078 1065 1079 1078 1074 1089C1068 1099 1054 1116 1044 1117C1034 1118 1026 1101 1013 1096C1001 1091 975 1098 970 1090C966 1082 987 1063 987 1050C987 1037 969 1023 972 1014C975 1005 992 998 1004 996C1016 994 1033 998 1043 1003C1053 1008 1059 1015 1065 1024C1070 1032 1075 1043 1077 1054Z'/%3E%3Cpath d='M454 1079C450 1102 422 1114 402 1130C383 1145 357 1170 338 1171C318 1173 300 1156 284 1139C269 1122 241 1088 243 1067C245 1047 279 1031 294 1015C310 998 315 973 337 970C359 967 407 978 426 996C446 1014 458 1057 454 1079Z'/%3E%3Cpath d='M405 1076C402 1088 387 1096 376 1104C365 1112 351 1126 341 1127C330 1128 320 1119 311 1109C303 1100 288 1081 289 1070C289 1058 308 1050 317 1041C325 1032 328 1018 340 1016C352 1015 378 1020 389 1030C400 1040 407 1064 405 1076Z'/%3E%3Cpath d='M722 376C725 390 712 415 701 427C690 439 673 447 656 449C638 452 611 445 596 441C582 437 577 437 568 426C559 414 547 389 543 371C539 354 533 331 544 321C554 310 591 313 607 309C624 305 632 292 644 298C657 303 670 330 683 343C696 356 719 362 722 376Z'/%3E%3Cpath d='M678 376C680 384 673 397 667 404C661 410 652 415 642 416C632 417 617 414 609 412C601 410 598 410 594 403C589 397 582 383 580 373C578 364 575 351 580 345C586 340 606 341 615 339C625 337 629 330 636 333C643 336 650 351 657 358C664 365 677 368 678 376Z'/%3E%3Cpath d='M454 110C455 124 442 139 432 152C422 165 408 188 395 189C382 190 367 168 353 159C339 150 319 147 311 133C303 120 302 93 305 77C308 62 316 49 330 40C344 30 371 17 387 22C404 27 416 52 427 67C438 82 453 96 454 110Z'/%3E%3Cpath d='M421 111C422 118 415 126 409 134C404 141 396 153 389 154C382 154 373 142 366 137C358 132 347 131 343 123C338 116 338 101 339 93C341 84 345 77 353 72C361 67 376 60 385 62C394 65 400 79 406 87C413 95 421 103 421 111Z'/%3E%3Cpath d='M995 90C995 101 992 112 989 122C985 133 984 149 975 153C966 156 951 146 936 143C922 140 897 144 889 134C881 124 888 98 888 84C889 70 884 59 891 48C899 38 920 21 933 20C946 19 960 35 969 42C979 48 984 51 989 59C993 67 995 80 995 90Z'/%3E%3Cpath d='M973 90C973 96 972 102 970 107C968 113 968 122 963 124C958 126 949 121 941 119C933 117 920 119 915 114C911 108 915 94 915 86C915 78 913 73 917 67C921 61 932 52 939 51C947 51 954 60 959 63C965 67 968 68 970 72C972 77 973 84 973 90Z'/%3E%3Cpath d='M150 724C152 736 157 759 149 768C140 777 110 778 97 778C84 777 78 771 72 763C66 754 62 738 60 725C58 713 52 698 60 689C68 679 96 666 108 668C121 670 129 689 135 699C142 708 147 713 150 724Z'/%3E%3Cpath d='M128 726C129 732 132 745 128 750C123 755 106 756 99 755C92 755 89 752 85 747C82 742 80 733 79 727C78 720 75 712 79 707C83 701 99 694 105 695C112 696 117 707 120 712C124 717 127 720 128 726Z'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 1200px 1200px;
  opacity: 0.1;
}
.section--olive.topo::before, .site-footer.topo::before { filter: invert(1); opacity: 0.13; }
/* wandering waypoints: direction and speed keep shifting, but the cycle ends one
   full tile away, so the loop restarts invisibly */
@keyframes topo-drift {
  0%   { transform: translate3d(0, 0, 0); }
  16%  { transform: translate3d(310px, 90px, 0); }
  34%  { transform: translate3d(430px, 480px, 0); }
  52%  { transform: translate3d(790px, 620px, 0); }
  71%  { transform: translate3d(900px, 1010px, 0); }
  86%  { transform: translate3d(1130px, 1080px, 0); }
  100% { transform: translate3d(1200px, 1200px, 0); }
}

@media (prefers-reduced-motion: reduce) { .topo::before { animation: none; } }

/* ===== loader curtain — lime screen before the site shows, landonorris.com style ===== */
.loader {
  position: fixed; inset: 0; z-index: 9999;
  background: var(--lime);
  display: flex; align-items: center; justify-content: center;
  pointer-events: none;
  animation: loader-exit 0.75s cubic-bezier(0.65, 0.05, 0, 1) 1.25s forwards;
}
.loader__signature {
  font-family: var(--font-script); font-weight: 700; color: var(--ink);
  font-size: clamp(3rem, 8vw, 6.5rem); line-height: 1;
  rotate: -6deg;
  animation: loader-sig 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) 0.15s both;
}
@keyframes loader-sig { from { opacity: 0; scale: 0.55; } to { opacity: 1; scale: 1; } }
@keyframes loader-exit { to { translate: 0 -100%; visibility: hidden; } }
@media (prefers-reduced-motion: reduce) { .loader { display: none; } }

/* ===== typography ===== */
.headline {
  font-family: var(--font-display);
  font-weight: 400;
  text-transform: uppercase;
  line-height: 0.98;
  letter-spacing: 0.01em;
}
.headline--xl { font-size: clamp(3rem, 9vw, 8.5rem); }
.headline--lg { font-size: clamp(2.4rem, 6.5vw, 6rem); }
.headline--md { font-size: clamp(1.8rem, 4vw, 3.5rem); }
.hl-line { display: block; }
.hl-serif {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0;
}
.section--olive .hl-serif { color: var(--green); }
.section--cream .hl-serif { color: var(--olive); }
.hl-lime { color: var(--lime); }

.label {
  font-family: var(--font-body);
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.22em;
}
.label--lime { color: var(--lime); }
.lead { font-size: clamp(1rem, 1.4vw, 1.2rem); max-width: 34em; }

/* ===== buttons ===== */
.btn-pill {
  display: inline-flex; align-items: center; gap: 0.5rem;
  background: var(--lime); color: var(--ink);
  font-family: var(--font-body); font-weight: 700; font-size: 0.8rem;
  text-transform: uppercase; letter-spacing: 0.06em;
  padding: 0.9rem 1.6rem; border-radius: 0.9rem; border: none; cursor: pointer;
  transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.btn-pill:hover { transform: scale(1.05) rotate(-1deg); }

/* ===== scribbles ===== */
.scribble { display: block; overflow: visible; }
.scribble path {
  fill: none; stroke: var(--lime); stroke-width: 7;
  stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 1; stroke-dashoffset: 0; /* JS sets 1 then animates to 0 */
}
.script-overlay {
  font-family: var(--font-script); font-weight: 700;
  color: var(--lime); line-height: 1;
  pointer-events: none;
  text-transform: none;
}

/* ===== header ===== */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.1rem clamp(1rem, 3vw, 2.5rem);
  mix-blend-mode: normal;
  background: color-mix(in srgb, var(--cream) 88%, transparent);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.site-logo {
  font-family: var(--font-display); font-size: 1.25rem; line-height: 0.95;
  text-transform: uppercase; letter-spacing: 0.02em;
}
.site-logo span { display: block; }
.site-header__actions { display: flex; gap: 0.6rem; align-items: center; }
.menu-btn {
  width: 3.1rem; height: 3.1rem; border-radius: 0.9rem;
  background: var(--cream); border: 1px solid rgba(30, 32, 24, 0.25);
  display: grid; place-items: center; cursor: pointer;
}
.menu-btn span { display: block; width: 1.1rem; height: 2px; background: var(--ink); position: relative; }
.menu-btn span::before { content: ''; position: absolute; top: -6px; right: 0; width: 0.75rem; height: 2px; background: var(--ink); }

/* header inverts on dark hero */
.header-on-dark .site-logo, .header-on-dark { color: var(--cream); }

/* ===== fullscreen menu ===== */
.menu-overlay {
  position: fixed; inset: 0; z-index: 200;
  background: var(--olive); color: var(--cream);
  display: flex; flex-direction: column; justify-content: safe center;
  overflow-y: auto;
  padding: clamp(1.5rem, 5vw, 4rem);
  visibility: hidden; opacity: 0;
  transition: opacity 0.4s ease, visibility 0s linear 0.4s;
}
.menu-overlay.open { visibility: visible; opacity: 1; transition: opacity 0.4s ease; }
.menu-overlay__close {
  position: fixed; top: 1.1rem; right: clamp(1rem, 3vw, 2.5rem);
  background: var(--lime); border: none; border-radius: 0.9rem;
  width: 3.1rem; height: 3.1rem; font-size: 1.3rem; cursor: pointer; color: var(--ink);
  font-family: var(--font-body); font-weight: 700;
}
.menu-overlay nav a {
  font-family: var(--font-display); text-transform: uppercase;
  font-size: clamp(2.6rem, min(8vw, 10vh), 6.5rem); line-height: 1.05; display: block;
  transform: translateY(30px); opacity: 0; transition: transform 0.5s ease, opacity 0.5s ease, color 0.2s;
}
.menu-overlay.open nav a { transform: none; opacity: 1; }
.menu-overlay.open nav a:nth-child(2) { transition-delay: 0.06s; }
.menu-overlay.open nav a:nth-child(3) { transition-delay: 0.12s; }
.menu-overlay.open nav a:nth-child(4) { transition-delay: 0.18s; }
.menu-overlay nav a:hover { color: var(--lime); }
.menu-overlay__socials { margin-top: 3rem; display: flex; gap: 1.6rem; }
.menu-overlay__socials a { font-size: 0.8rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; }
.menu-overlay__socials a:hover { color: var(--lime); }

/* ===== card widget (hero corner card) ===== */
.card-widget {
  border: 1px solid rgba(30, 32, 24, 0.3); border-radius: 0.8rem;
  padding: 1.1rem; width: 12rem; text-align: center;
  background: color-mix(in srgb, var(--cream) 82%, transparent);
  backdrop-filter: blur(4px);
}
.card-widget hr { border: none; border-top: 1px solid rgba(30, 32, 24, 0.3); margin: 0.7rem 0; }
.card-widget .label { font-size: 0.6rem; }
.card-widget strong { font-size: 0.75rem; letter-spacing: 0.1em; display: block; margin-top: 0.25rem; }

/* ===== marquee ===== */
.marquee { overflow-x: auto; overflow-y: hidden; white-space: nowrap; scrollbar-width: none; }
.marquee::-webkit-scrollbar { display: none; }
.marquee__track { display: inline-flex; align-items: center; gap: 4.5rem; padding-right: 4.5rem; animation: marquee 32s linear infinite; }
/* JS drives the drift so the user can scroll back; the CSS animation stays as a no-JS fallback */
.marquee.is-manual { cursor: grab; }
.marquee.is-manual:active { cursor: grabbing; }
.marquee.is-manual .marquee__track { animation: none; }
@keyframes marquee { to { transform: translateX(-100%); } }
.marquee__item {
  display: inline-flex; align-items: center; gap: 0.7rem;
  font-family: var(--font-body); font-weight: 700; font-size: 1.5rem; letter-spacing: 0.04em; opacity: 0.75;
}
.marquee__item img { height: 1.5rem; width: auto; }
@media (prefers-reduced-motion: reduce) { .marquee__track { animation: none; } }

/* ===== footer ===== */
.footer-frame { background: var(--cream); padding: clamp(0.8rem, 2vw, 1.4rem); }
.site-footer {
  background: var(--olive); color: var(--cream);
  border-radius: 1.6rem; position: relative; overflow: hidden;
  padding: clamp(3rem, 7vw, 6rem) clamp(1.5rem, 4vw, 4rem) clamp(1.5rem, 3vw, 2.5rem);
  text-align: center;
}
.site-footer .signature {
  font-family: var(--font-script); font-size: clamp(2.2rem, 4vw, 3.4rem);
  color: var(--lime); transform: rotate(-4deg); display: inline-block; margin-bottom: -1rem;
}
.site-footer__statement { font-size: clamp(2.6rem, 7vw, 6rem); }
.site-footer__cols {
  display: flex; justify-content: center; gap: clamp(3rem, 10vw, 10rem);
  margin: clamp(2.5rem, 5vw, 4rem) 0; text-align: center;
}
.site-footer__cols .label { opacity: 0.55; display: block; margin-bottom: 0.9rem; }
.site-footer__cols a {
  font-family: var(--font-display); text-transform: uppercase;
  font-size: clamp(1.2rem, 2vw, 1.7rem); display: block; line-height: 1.35;
}
.site-footer__cols a:hover { color: var(--lime); }
.site-footer__cta { margin-bottom: 3rem; }
.site-footer__legal {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 0.72rem; opacity: 0.7; margin-top: 2rem; flex-wrap: wrap; gap: 0.5rem;
}

/* ===== photo helpers ===== */
.photo-card { position: relative; }
.photo-card img { width: 100%; height: 100%; object-fit: cover; }
.photo-card .label { display: block; margin-bottom: 0.5rem; }
.img-hover { overflow: hidden; }
.img-hover img { transition: transform 0.6s ease; }
.img-hover:hover img { transform: scale(1.05); }

/* ===== home: hero ===== */
.hero {
  min-height: 100svh;
  position: relative;
}
/* subpage heroes (dev/founder/network/services) sit their content in a plain
   .container instead of the absolutely-positioned home hero__title, so they
   need real top padding to clear the fixed header */
.hero > .container { padding-top: calc(var(--header-h) + 2rem); }
.hero__stage { position: absolute; inset: 0; }
.hero__title {
  position: absolute; top: calc(var(--header-h) + 1.5svh); inset-inline: 0;
  text-align: center; z-index: 2;
}
/* landonorris.com heading treatment: heavy display serif (their Brier),
   tight negative tracking, line-height under 0.9 — Fraunces is the free stand-in */
.hero__name {
  font-family: var(--font-serif); font-style: normal;
  font-weight: 900; font-optical-sizing: auto;
  font-size: clamp(2.1rem, 5.5vw, 5rem);
  line-height: 0.85; letter-spacing: -0.03em;
}
.hero__role {
  display: inline-block;
  font-family: var(--font-body); font-weight: 700;
  font-size: clamp(0.58rem, 0.85vw, 0.72rem);
  text-transform: uppercase; letter-spacing: 0.32em; text-indent: 0.32em;
  background: var(--lime); color: var(--ink);
  padding: 0.5em 1em 0.45em; border-radius: 99px;
  margin-top: 0.9rem;
}
.hero__img {
  position: absolute; bottom: -10svh; left: 50%; translate: -50% 0;
  height: min(84svh, 115vw); width: auto; max-width: none;
  z-index: 1;
  pointer-events: none; /* decorative: a click or drag must never open the file */
  -webkit-mask-image: linear-gradient(to bottom, #000 82%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 82%, transparent 100%);
}
/* dark blotch on the wall behind the photo — JS darts it around with the mouse */
.hero__shadow {
  position: absolute; top: 16%; left: 50%; translate: -50% 0;
  width: min(62vw, 900px); aspect-ratio: 1 / 0.92;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(30, 32, 24, 0.38), rgba(30, 32, 24, 0) 68%);
  z-index: 1; /* same layer as the photo, earlier in the DOM = painted behind */
  pointer-events: none;
}
/* desktop: the photo takes nearly the whole hero, landonorris.com scale */
@media (min-width: 1024px) {
  .hero__img { height: min(94svh, 115vw); }
}
.hero__widget { position: absolute; left: clamp(1rem, 3vw, 2.5rem); bottom: 2rem; z-index: 3; }
.hero__scroll-hint { position: absolute; right: clamp(1rem, 3vw, 2.5rem); bottom: 2rem; }

/* ===== home: hero outro — photo recedes, signature pops, statement passes ===== */
.hero__signature {
  position: absolute; left: 50%; top: 33%; translate: -50% 0;
  z-index: 4; pointer-events: none; white-space: nowrap;
  font-family: var(--font-script); font-weight: 700; color: var(--lime);
  font-size: clamp(4.5rem, 12vw, 10.5rem); line-height: 1;
  opacity: 0;
}
.hero-marquee {
  position: absolute; left: 0; right: 0; top: 63%;
  z-index: 4; pointer-events: none; opacity: 0;
  overflow: hidden; white-space: nowrap;
  mix-blend-mode: difference; color: var(--cream);
}
.hero-marquee__track {
  display: inline-block;
  font-family: var(--font-display); text-transform: uppercase;
  font-size: clamp(2.4rem, 6vw, 5.5rem); line-height: 1.1;
  animation: marquee 26s linear infinite;
}
@media (prefers-reduced-motion: reduce) { .hero-marquee__track { animation: none; } }

/* circled word (lime scribble) */
.circled { position: relative; display: inline-block; }
.circled .scribble--circle { position: absolute; inset: -18% -12%; width: 124%; height: 136%; pointer-events: none; }

/* ===== home: manifesto ===== */
.manifesto { text-align: center; }
.manifesto .headline { max-width: 24ch; margin-inline: auto; }

/* ===== responsive ===== */
@media (max-width: 768px) {
  .site-footer__cols { flex-direction: column; gap: 2rem; }
  .card-widget { display: none; }
  .hero__img { height: min(80svh, 145vw); bottom: -6svh; left: 62%; }
}

/* ===== home: dev/founder split ===== */
.split { }
.split__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.split__half { position: relative; }
.split__half .headline { position: relative; display: inline-block; }
.split__half .scribble--circle { position: absolute; inset: -12% -10%; width: 120%; height: 124%; }
.split__half p { margin: 1.2rem 0 1.4rem; max-width: 30em; }
.split__link { font-weight: 700; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.12em; border-bottom: 3px solid var(--lime); padding-bottom: 0.2rem; }
@media (max-width: 768px) { .split__grid { grid-template-columns: 1fr; } }

/* ===== home: events floating right-to-left ===== */
.events-marquee { overflow: hidden; margin-top: 3.5rem; white-space: nowrap; }
.events-marquee__track {
  display: inline-flex; gap: 1.4rem; padding-right: 1.4rem;
  animation: marquee 80s linear infinite;
}
.events-marquee:hover .events-marquee__track { animation-play-state: paused; }
.event-card {
  width: clamp(230px, 21vw, 300px); flex-shrink: 0;
  display: flex; flex-direction: column; gap: 0.55rem;
  white-space: normal;
}
.event-card img {
  width: 100%; aspect-ratio: 4 / 5; object-fit: cover;
  border-radius: 0.8rem;
}
.event-card h3 { font-family: var(--font-display); font-size: 1.15rem; text-transform: uppercase; font-weight: 400; }
@media (prefers-reduced-motion: reduce) {
  .events-marquee { overflow-x: auto; }
  .events-marquee__track { animation: none; }
}

/* ===== home: partners ===== */
.partners-grid { display: flex; flex-wrap: wrap; gap: 1.2rem; margin-top: 3rem; }
.partner-card {
  position: relative;
  flex: 1 1 340px; max-width: 580px;
  display: flex; gap: 1.4rem; align-items: center;
  border: 1px solid rgba(30, 32, 24, 0.25); border-radius: 0.9rem;
  padding: 1.8rem 3rem 1.8rem 1.8rem; background: rgba(255, 255, 255, 0.35);
  transition: border-color 0.25s, transform 0.25s;
}
.partner-card:hover { border-color: var(--lime); transform: translateY(-4px); }
.partner-card::after {
  content: '↗';
  position: absolute; top: 1.1rem; right: 1.2rem;
  font-weight: 700; opacity: 0.45; transition: opacity 0.25s;
}
.partner-card:hover::after { opacity: 1; }
.partner-card img {
  width: 3rem; height: 3rem; object-fit: contain; flex-shrink: 0;
  background: #fff; border-radius: 0.6rem;
}
.partner-card h3 { font-family: var(--font-display); font-size: 1.4rem; text-transform: uppercase; font-weight: 400; }
.partner-card p { font-size: 0.9rem; opacity: 0.85; margin-top: 0.3rem; max-width: 38em; }

/* ===== home: network teaser ===== */
.teaser__grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 1rem; margin-top: 3rem; }
.teaser__grid .photo-card:nth-child(1) { grid-column: 1 / span 4; }
.teaser__grid .photo-card:nth-child(2) { grid-column: 6 / span 3; margin-top: 4rem; }
.teaser__grid .photo-card:nth-child(3) { grid-column: 10 / span 3; margin-top: 1.5rem; }
.teaser__grid img { aspect-ratio: 4 / 5; }
@media (max-width: 768px) {
  .teaser__grid { grid-template-columns: 1fr 1fr; }
  .teaser__grid .photo-card:nth-child(n) { grid-column: auto; margin-top: 0; }
}

/* ===== home: partners ===== */
.partners__head { position: relative; margin-bottom: 3.5rem; }
.partners__head .script-overlay { position: absolute; left: clamp(9rem, 24vw, 23rem); top: -28%; font-size: clamp(3.5rem, 10vw, 8rem); transform: rotate(-8deg); z-index: 2; }

/* ===== dev page ===== */
.skills-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1rem; margin-top: 3rem; }
.skill-tile {
  border: 1px solid rgba(242, 240, 233, 0.25); border-radius: 0.8rem;
  padding: 1.6rem 1.2rem; font-family: var(--font-display); text-transform: uppercase;
  font-size: 1.15rem; transition: background 0.25s, color 0.25s;
}
.skill-tile:hover { background: var(--lime); color: var(--ink); }

.xp-list { margin-top: 3rem; }
.xp-item {
  display: grid; grid-template-columns: 8rem 1fr; gap: 1.5rem;
  padding: 2rem 0; border-top: 1px solid rgba(30, 32, 24, 0.2); align-items: baseline;
}
.section--olive .xp-item { border-top-color: rgba(242, 240, 233, 0.22); }
.xp-body { display: flex; gap: 1.3rem; align-items: flex-start; }
.xp-logo {
  width: 1.75rem; height: 1.75rem; object-fit: contain; flex-shrink: 0;
  background: #fff; border-radius: 0.35rem; padding: 0.15rem;
  border: 1px solid rgba(30, 32, 24, 0.12);
  margin-top: 0.35rem;
}
.xp-item h3 { font-family: var(--font-display); font-size: clamp(1.3rem, 2.4vw, 2rem); text-transform: uppercase; }
.xp-item .xp-company { font-family: var(--font-serif); font-style: italic; font-size: 1.1rem; }
.xp-item p { margin-top: 0.6rem; max-width: 46em; }
.xp-item .xp-credential {
  display: block; width: fit-content; margin-top: 0.5rem;
  text-decoration: underline; text-underline-offset: 3px;
}
@media (max-width: 640px) { .xp-item { grid-template-columns: 1fr; gap: 0.4rem; } }

/* experience: horizontal timeline */
.timeline { margin-top: 3.5rem; overflow-x: auto; scrollbar-width: none; cursor: grab; }
.timeline:active { cursor: grabbing; }
.timeline::-webkit-scrollbar { display: none; }
.timeline__track { display: flex; min-width: max-content; }
.tl-item {
  position: relative;
  flex: 1 0 clamp(300px, 27vw, 420px); max-width: 440px;
  padding: 2.2rem 2.2rem 0 0;
}
.tl-badge {
  position: absolute; top: 0; left: 0;
  display: inline-block; background: var(--lime); color: var(--ink);
  font-family: var(--font-body); font-size: 0.6rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.16em;
  padding: 0.4em 1em; border-radius: 99px;
  transform: rotate(-3deg); transform-origin: left center;
}
.tl-item .label { display: block; }
.tl-item::before {
  content: ''; position: absolute; left: 0; right: 0; top: 4.3rem;
  height: 2px; background: rgba(30, 32, 24, 0.15);
}
.tl-item:last-child::before { right: 2.2rem; }
.tl-item::after {
  content: ''; position: absolute; left: 0; top: calc(4.3rem - 5px);
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--lime); border: 2px solid var(--ink);
}
.tl-item__body { margin-top: 3.1rem; display: flex; gap: 0.9rem; align-items: flex-start; }
.tl-item h3 { font-family: var(--font-display); font-size: 1.35rem; text-transform: uppercase; font-weight: 400; line-height: 1.15; }
.tl-item .xp-company { font-family: var(--font-serif); font-style: italic; font-size: 1rem; display: block; margin-top: 0.2rem; }
.tl-item p { font-size: 0.88rem; opacity: 0.85; margin-top: 0.6rem; max-width: 30em; }

/* projects: pinned horizontal gallery on the home */
.projects {
  min-height: 100svh; display: flex; flex-direction: column; justify-content: center;
  padding: calc(var(--header-h) + 2rem) 0 2.5rem;
}
.projects__hint { display: block; margin-top: 1.2rem; }
.projects-viewport { overflow-x: auto; margin-top: 2.5rem; scrollbar-width: none; }
.projects-viewport::-webkit-scrollbar { display: none; }
.projects-track {
  display: flex; gap: 1.4rem; width: max-content;
  padding-left: max(1.5rem, calc((100vw - 1360px) / 2));
  padding-right: clamp(1.5rem, 4vw, 4rem);
  counter-reset: proj;
  will-change: transform;
}
.projects-track .project-card {
  width: clamp(300px, 34vw, 480px); flex-shrink: 0;
  position: relative; padding: 2.4rem 2rem;
  counter-increment: proj;
}
.projects-track .project-card::after {
  content: "0" counter(proj);
  position: absolute; top: 1.3rem; right: 1.5rem;
  font-family: var(--font-display); font-size: 2.4rem; line-height: 1;
  opacity: 0.18;
}

.projects-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 1.2rem; margin-top: 3rem; }
.project-card {
  border: 1px solid rgba(242, 240, 233, 0.2); border-radius: 0.9rem;
  padding: 1.8rem 1.5rem; display: flex; flex-direction: column; gap: 0.8rem;
  transition: border-color 0.25s, transform 0.25s;
}
.project-card:hover { border-color: var(--lime); transform: translateY(-4px); }
.project-card h3 { font-family: var(--font-display); font-size: 1.5rem; text-transform: uppercase; }
.project-card .label { color: var(--lime); }
.project-card p { font-size: 0.9rem; opacity: 0.85; flex: 1; }
.project-card .tags { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.project-card .tags span {
  font-size: 0.62rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em;
  border: 1px solid rgba(242, 240, 233, 0.35); border-radius: 99px; padding: 0.25rem 0.6rem;
}
.project-card__logo {
  width: 3rem; height: 3rem; object-fit: cover; border-radius: 50%;
  background: var(--cream); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  margin-bottom: 0.3rem;
}

/* ===== certifications: horizontal drag-open card deck ===== */
.cert-deck {
  position: relative; margin-top: 3rem; overflow: hidden;
  min-height: clamp(200px, 30vw, 230px);
  cursor: grab; touch-action: pan-y; user-select: none;
}
.cert-deck:active { cursor: grabbing; }
.cert-card {
  position: absolute; top: 50%; left: 0;
  width: clamp(170px, 22vw, 210px);
  background: var(--ink); color: var(--cream);
  border-radius: 0.9rem; padding: 1.5rem 1.3rem;
  border-top: 4px solid var(--brand, var(--lime));
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.35);
  will-change: transform;
}
.cert-card .label { color: var(--brand, var(--lime)); display: block; }
.cert-card h3 { font-family: var(--font-display); text-transform: uppercase; font-size: 1.05rem; line-height: 1.15; margin: 0.55rem 0 0.25rem; padding-right: 2.2rem; }
.cert-card .xp-company { font-family: var(--font-serif); font-style: italic; font-size: 0.85rem; opacity: 0.9; display: block; }
.cert-card .xp-credential {
  display: block; width: fit-content; margin-top: 0.6rem;
  font-size: 0.72rem; text-decoration: underline; text-underline-offset: 3px;
}
.cert-card__logo {
  position: absolute; top: 1.1rem; right: 1.1rem;
  width: 1.9rem; height: 1.9rem; object-fit: contain;
  background: #fff; border-radius: 0.4rem; padding: 0.25rem;
}
.cert-deck__hint { display: block; margin-top: 1.2rem; }

.degree-card {
  position: relative;
  margin-top: 2.5rem; max-width: 42rem;
  border: 1px solid rgba(30, 32, 24, 0.2); border-radius: 1rem;
  padding: 2.2rem 2rem;
}
.section--olive .degree-card { border-color: rgba(242, 240, 233, 0.22); }
.degree-card .cert-card__logo { top: 2rem; right: 2rem; width: 2.8rem; height: 2.8rem; }
.degree-card h3 { font-family: var(--font-display); text-transform: uppercase; font-size: clamp(1.4rem, 2.6vw, 2.1rem); }
.degree-card .xp-company { font-family: var(--font-serif); font-style: italic; font-size: 1.15rem; display: block; margin-top: 0.3rem; }

/* ===== founder page ===== */
.story { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; margin-top: 3rem; }
.story__img { border-radius: 1rem; overflow: hidden; }
.story__img img { aspect-ratio: 4 / 3; width: 100%; object-fit: cover; }
@media (max-width: 768px) { .story { grid-template-columns: 1fr; } }

.venture-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.2rem; margin-top: 3rem; }
.venture-card {
  border: 1px solid rgba(30, 32, 24, 0.25); border-radius: 0.9rem; padding: 1.8rem 1.5rem;
  display: flex; flex-direction: column; gap: 0.8rem; background: rgba(255, 255, 255, 0.35);
}
.venture-card h3 { font-family: var(--font-display); font-size: 1.5rem; text-transform: uppercase; }
.venture-card .label { color: var(--olive); opacity: 0.7; }
.venture-card .tags { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.venture-card .tags span {
  font-size: 0.62rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em;
  border: 1px solid rgba(30, 32, 24, 0.35); border-radius: 99px; padding: 0.25rem 0.6rem;
}

/* ===== services page ===== */
.service-card {
  border: 1px solid rgba(30, 32, 24, 0.25); border-radius: 0.9rem; padding: 1.8rem 1.5rem;
  display: flex; flex-direction: column; gap: 0.8rem; background: rgba(255, 255, 255, 0.35);
}
.service-card h3 { font-family: var(--font-display); font-size: 1.5rem; text-transform: uppercase; }
.service-card .label { color: var(--olive); opacity: 0.7; }
.service-card__price {
  font-family: var(--font-serif); font-style: italic; font-size: 1.15rem;
  margin-top: auto; padding-top: 0.4rem;
}
.service-card__price strong { font-style: normal; font-family: var(--font-display); }
.service-card .btn-pill { align-self: flex-start; padding: 0.7rem 1.3rem; font-size: 0.72rem; }

/* ===== network page ===== */
.net-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 1.2rem; margin-top: 4rem; }
.net-item { display: flex; flex-direction: column; gap: 0.6rem; }
.net-item img { aspect-ratio: 4 / 5; border-radius: 0.6rem; }
.net-item h3 { font-family: var(--font-display); font-size: 1.3rem; text-transform: uppercase; }
.net-item p { font-size: 0.85rem; opacity: 0.85; max-width: 30em; }
.net-item:nth-child(8n+1) { grid-column: 1 / span 4; }
.net-item:nth-child(8n+2) { grid-column: 7 / span 3; margin-top: 6rem; }
.net-item:nth-child(8n+3) { grid-column: 10 / span 3; margin-top: 2rem; }
.net-item:nth-child(8n+4) { grid-column: 2 / span 3; margin-top: 3rem; }
.net-item:nth-child(8n+5) { grid-column: 6 / span 4; margin-top: 7rem; }
.net-item:nth-child(8n+6) { grid-column: 1 / span 3; margin-top: 2rem; }
.net-item:nth-child(8n+7) { grid-column: 5 / span 3; margin-top: 5rem; }
.net-item:nth-child(8n+8) { grid-column: 9 / span 4; margin-top: 1rem; }
@media (max-width: 768px) {
  .net-grid { grid-template-columns: 1fr 1fr; gap: 1.5rem 1rem; }
  .net-item:nth-child(n) { grid-column: auto; margin-top: 0; }
}