@font-face {
  font-family:Sansation;
  src:url('fonts/Sansation_Light.ttf') format('truetype');
  font-weight:300;
  font-display:swap;
}

@font-face {
  font-family:Sansation;
  src:url('fonts/Sansation_Regular.ttf') format('truetype');
  font-weight:400;
  font-display:swap;
}

@font-face {
  font-family:Sansation;
  src:url('fonts/Sansation_Bold.ttf') format('truetype');
  font-weight:700;
  font-display:swap;
}

:root {
  --font-display:Sansation,Arial,sans-serif;
  color-scheme:dark;
  --bg:#10110f;
  --text:#eeeae1;
  --muted:#a3a399;
  --gold:#c7b28c;
  --line:rgba(213,205,181,.18);
  --pad:clamp(24px,5vw,88px);
  --content-max:1440px;
  font-family:Sansation,Arial,sans-serif;
  font-weight:300;
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:100px;
}

body {
  margin:0;
  background:var(--bg);
  color:var(--text);
  overflow-x:clip;
}

body::after {
  content:'';
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:15;
  opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.7' d='M0 0h180v180H0z'/%3E%3C/svg%3E");
}

::selection {
  background:#c7b28c;
  color:#10110f;
}

a {
  color:inherit;
  text-decoration:none;
}

button,input {
  font:inherit;
}

button {
  color:inherit;
  cursor:pointer;
  background:none;
  border:0;
}

button,a,input {
  -webkit-tap-highlight-color:transparent;
}

button:focus-visible,a:focus-visible,input:focus-visible {
  outline:2px solid var(--gold);
  outline-offset:6px;
}

h1,h2,h3,p {
  margin:0;
  font-weight:300;
}

h1,h2,h3,.intro-copy p {
  font-family:var(--font-display);
  font-weight:300;
}

em {
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-style:italic;
  color:var(--gold);
}

img,svg {
  display:block;
  max-width:100%;
}

[hidden] {
  display:none!important;
}

.skip-link {
  position:fixed;
  top:10px;
  left:20px;
  z-index:100;
  background:var(--text);
  color:var(--bg);
  padding:14px;
  transform:translateY(-160%);
}

.skip-link:focus {
  transform:none;
}

.eyebrow {
  font-size:10px;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.2em;
  line-height:1.6;
}

.section-pad {
  padding:110px var(--pad);
}

.wordmark {
  width:144px;
  display:inline-flex;
  align-items:center;
  flex-shrink:0;
}

.wordmark img {
  width:100%;
  height:auto;
}

/* Display only the AVINI lettering from the original two-line brand asset. */
.wordmark img {
  aspect-ratio:512 / 96;
  object-fit:cover;
  object-position:center top;
}

.site-header {
  position:absolute;
  inset:0 0 auto;
  height:108px;
  padding:0 max(var(--pad),calc((100% - var(--content-max)) / 2));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  z-index:20;
  border-bottom:1px solid rgba(213,205,181,.09);
}

.desktop-nav {
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:35px;
  font-size:12px;
  color:#c5c4b9;
}

.desktop-nav a,.legal-footer a,.site-footer nav a {
  transition:color .25s;
}

.desktop-nav a:hover,.site-footer nav a:hover,.legal-footer a:hover {
  color:var(--gold);
}

.header-contact {
  font-size:12px;
  border-bottom:1px solid var(--gold);
  padding:10px 0;
}

.header-contact span {
  margin-left:28px;
  color:var(--gold);
}

.menu-toggle {
  display:none;
}

canvas {
  width:100%;
  height:100%;
  display:block;
  position:relative;
  z-index:1;
  opacity:0;
  transition:opacity 1.8s;
}

.webgl-ready canvas {
  opacity:1;
}

.sculpture-fallback {
  position:absolute;
  left:50%;
  top:50%;
  width:55%;
  aspect-ratio:1;
  border-radius:50%;
  transform:translate(-50%,-50%) rotate(-24deg);
  border:1px solid #b4a279;
  box-shadow:0 0 80px #c4aa6220,inset 0 0 90px #c4aa6220;
  background:repeating-radial-gradient(ellipse at 40% 50%,transparent 0 9px,#b9a36e33 10px,transparent 11px 17px);
  mask-image:radial-gradient(ellipse,#0000 19%,#000 37%,#000 65%,#0000 74%);
  transition:opacity 1s;
}

.webgl-ready .sculpture-fallback {
  opacity:0;
}

.hero h1 {
  font-size:clamp(72px,7.5vw,128px);
  line-height:.94;
  letter-spacing:-.015em;
}

.hero h1 em {
  display:block;
  font-weight:400;
  letter-spacing:-.015em;
}

.hero-title-lead {
  display:block;
  font-size:clamp(40px,4.6vw,72px);
  line-height:1.15;
  margin-bottom:8px;
}

.hero-description {
  max-width:365px;
  font-size:16px;
  line-height:1.6;
  margin-top:32px;
  color:#bbbeb2;
}

.hero-explore-wrap {
  position:absolute;
  z-index:3;
  left:0;
  right:0;
  bottom:24px;
  display:flex;
  justify-content:center;
}

.hero-explore {
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  font-size:12px;
  letter-spacing:.04em;
  min-height:44px;
  padding:8px 0;
}

.explore-arrow {
  width:24px;
  height:14px;
  color:var(--gold);
  transition:transform .3s ease;
}

.hero-explore:hover .explore-arrow,.hero-explore:focus-visible .explore-arrow {
  transform:translateY(5px);
}

.philosophy {
  background:#191b16;
}

.philosophy-grid {
  display:grid;
  grid-template-columns:1.25fr 1fr;
  gap:clamp(40px,6vw,96px);
  align-items:center;
}

.statement {
  font-size:clamp(36px,4.2vw,64px);
  line-height:1.2;
  letter-spacing:-.01em;
  color:#a8aa9d;
}

.statement>span {
  color:var(--text);
}

.statement em {
  color:var(--text);
}

.statement .vibrating-word {
  display:inline-block;
  transform-origin:center;
}

.statement.is-visible .vibrating-word {
  animation:feel-vibration .43s steps(1,end) infinite;
}

@keyframes feel-vibration {
  0%,100% {transform:translate(.2px,-.15px);}
  9% {transform:translate(-.35px,.1px);}
  21% {transform:translate(.1px,.3px);}
  30% {transform:translate(-.15px,-.25px);}
  43% {transform:translate(.4px,.05px);}
  52% {transform:translate(-.25px,.2px);}
  64% {transform:translate(.15px,-.35px);}
  73% {transform:translate(-.4px,-.1px);}
  86% {transform:translate(.3px,.25px);}
  94% {transform:translate(-.1px,.05px);}
}

.body-copy {
  max-width:500px;
  font-size:16px;
  line-height:1.8;
  color:#b7baac;
}

.body-copy p+p {
  margin-top:20px;
}

@media(max-width:960px) {
  .philosophy-grid {
    grid-template-columns:1fr;
    gap:32px;
  }
  .philosophy-grid .body-copy {
    max-width:600px;
  }
}

.experience {
  padding:100px var(--pad);
  background:#10120f;
}

.experience-grid {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:70px;
  align-items:center;
}

.experience h2,.applications h2 {
  font-size:clamp(45px,5.3vw,78px);
  line-height:1.04;
  letter-spacing:-.01em;
}

.signal-selector {margin-top:30px;display:flex;flex-direction:column;}
.signal-selector button {display:grid;grid-template-columns:24px 1fr;gap:14px;text-align:left;padding:19px 0;border-bottom:1px solid var(--line);color:var(--muted);}
.signal-selector button:first-child {border-top:1px solid var(--line);}
.signal-step {font-size:9px;padding-top:4px;color:#777e6f;}
.signal-selector strong {display:block;font-size:18px;font-weight:300;color:#c9c9bb;transition:color .3s;}
.signal-selector button.is-active strong,.signal-selector button.is-active .signal-step {color:var(--gold);}
.signal-lab {min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.signal-description {display:flex;align-items:center;justify-content:center;text-align:center;width:100%;font-size:16px;line-height:1.8;color:#d0cfc3;max-width:520px;min-height:3.6em;margin:16px 0 0;}
.signal-art {position:relative;width:100%;aspect-ratio:2.4;min-height:180px;}
.signal-fallback {position:absolute;inset:0;width:100%;height:100%;opacity:.6;}
.signal-art.webgl-ready .signal-fallback {opacity:0;}
@media(max-width:760px) {
  .signal-description {font-size:14px;min-height:5.4em;}
  .signal-selector button {padding:17px 0;}
}
.applications {
  background:#090909;
  color:var(--text);
}

.applications-heading {
  display:flex;
  justify-content:space-between;
  gap:70px;
  align-items:end;
  margin-bottom:65px;
}

.applications h2 {
  font-size:clamp(38px,4.6vw,67px);
}

.applications h2 em {
  color:var(--gold);
}

.application-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:28px;
}

.application-card {
  background:#111;
  border:1px solid rgba(255,255,255,.08);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}

.application-art {
  height:290px;
  position:relative;
  container-type:size;
  overflow:hidden;
  background:radial-gradient(ellipse at 50% 55%,#161616,#0b0b0b 72%);
}

.application-art svg {
  width:100%;
  height:100%;
}

.application-art-title {
  position:absolute;
  left:28px;
  right:28px;
  /* Half the gap to the SVG's y=60 frame, including aspect-ratio padding. */
  top:calc(25cqh - min(11.6667cqw,17.5cqh));
  transform:translateY(-50%);
  text-align:left;
  margin:0;
  font-size:10px;
  line-height:1.5;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#d9d7c5;
}

.circuit-marker {
  offset-path:path("M146.125 317.230 C48.299 306.491 95.689 203.951 212.909 159.905 L400.880 83.002 Q478.722 53.774 473.126 105.130 L446.643 156.284 Q437.826 175.819 399.895 179.133 L315.621 184.078 Q289.913 185.344 282.233 217.268 L273.046 265.472 Q259.952 314.737 187.900 317.633 Z");
  offset-anchor:0px 0px;
  offset-rotate:0deg;
  animation:circuit-lap 9s linear -2s infinite;
  animation-play-state:paused;
}

.circuit-trail {
  animation:circuit-highlight 9s linear -1.28s infinite;
  animation-play-state:paused;
}

.sound-wave {
  transform-box:view-box;
  transform-origin:50% 25%;
  animation:sound-propagation 6s linear infinite;
  animation-play-state:paused;
}

.wave-near {transform:scale(.7);}
.wave-middle {transform:scale(1);animation-delay:-2s;}
.wave-far {transform:scale(1.3);animation-delay:-4s;}

.radar-sweep {
  transform-origin:0 0;
  animation:radar-scan 9s linear infinite;
  animation-play-state:paused;
}

.source-pulse {
  transform-box:fill-box;
  transform-origin:center;
  animation:source-pulse 3.6s ease-out infinite;
  animation-play-state:paused;
}

.application-card.is-visible :is(.circuit-marker,.circuit-trail,.sound-wave,.radar-sweep,.source-pulse) {
  animation-play-state:running;
}

@keyframes circuit-lap {
  from {offset-distance:0%;}
  to {offset-distance:100%;}
}

@keyframes circuit-highlight {
  from {stroke-dashoffset:0;}
  to {stroke-dashoffset:-100;}
}

@keyframes sound-propagation {
  0% {transform:scale(.55);opacity:0;}
  33.333%,66.667% {opacity:.65;}
  100% {transform:scale(1.4);opacity:0;}
}

@keyframes radar-scan {
  from {transform:rotate(0deg);}
  to {transform:rotate(360deg);}
}

@keyframes source-pulse {
  0% {transform:scale(.8);opacity:.75;}
  100% {transform:scale(1.8);opacity:0;}
}

.application-info {
  padding:32px;
  display:flex;
  flex:1;
  flex-direction:column;
}

.application-info p {
  flex:1;
  font-size:13px;
  line-height:1.8;
  color:#ccc;
  max-width:350px;
  margin-top:0;
}

.contact {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:center;
  gap:clamp(32px,5vw,80px);
  padding-bottom:100px;
  background:radial-gradient(ellipse at 75% 100%,#2b2b1b70,transparent 65%);
}

.contact h2 {
  font-size:clamp(64px,7.5vw,118px);
  line-height:.98;
  letter-spacing:-.01em;
}

.contact-bottom {
  width:100%;
  max-width:100%;
  margin:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:24px;
}

.contact-bottom p {
  max-width:380px;
  font-size:14px;
  line-height:1.8;
  color:#aeb2a2;
}

.contact-email {
  font-size:clamp(18px,2.2vw,32px);
  border-bottom:1px solid #8c8063;
  padding-bottom:16px;
  letter-spacing:-.03em;
}

.contact-email span {
  display:inline-block;
  margin-left:45px;
  color:var(--gold);
  transition:transform .3s;
}

.contact-email:hover span {
  transform:translate(4px,-4px);
}

.site-footer {
  margin:0 max(var(--pad),calc((100% - var(--content-max)) / 2));
  padding:50px 0 100px;
  border-top:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
}

.site-footer>.wordmark {
  width:126px;
}

.footer-message {
  font-size:11px;
  color:#8f9384;
}

.site-footer>div {
  font-size:9px;
  line-height:2;
  color:#9a9e8f;
  text-align:right;
}

.site-footer nav {
  display:flex;
  gap:22px;
  margin-top:5px;
}

/* Full-screen cinematic opening, with a live sound field and staged titles. */
body.is-loading {
  overflow:hidden;
}

.intro {
  position:fixed;
  inset:0;
  z-index:60;
  overflow:hidden;
  display:grid;
  place-items:center;
  padding:var(--pad);
  background:#0c0f0b;
  isolation:isolate;
  transition:opacity 1.1s ease,visibility 1.1s;
}

.intro:focus {
  outline:none;
}

.intro.is-leaving {
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.intro-art {
  position:absolute;
  inset:-12%;
  opacity:.48;
  animation:intro-field-in 2.4s cubic-bezier(.16,.6,.3,1) both;
  transition:transform 1.2s ease;
}

.intro.is-leaving .intro-art {
  transform:scale(1.12);
}

.intro-veil {
  position:absolute;
  inset:0;
  background:radial-gradient(ellipse at 50% 50%,#0c0f0b20 0%,#0c0f0b50 40%,#0c0f0be8 78%),linear-gradient(0deg,#0c0f0b 3%,transparent 30%,transparent 70%,#0c0f0b 97%);
}

.intro-brand {
  width:clamp(110px,12vw,144px);
  margin:24px auto 0;
}

.intro-brand img {
  width:100%;
  height:auto;
  aspect-ratio:512 / 96;
  object-fit:cover;
  object-position:center top;
}

.intro-copy {
  position:relative;
  z-index:3;
  width:100%;
  max-width:1100px;
  text-align:center;
  padding-bottom:35px;
  transition:opacity .6s,transform .9s;
}

.intro.is-leaving .intro-copy {
  opacity:0;
  transform:translateY(-18px);
}

.intro-copy p {
  font-size:clamp(34px,7.2vw,112px);
  line-height:1.04;
  letter-spacing:-.015em;
  text-shadow:0 4px 50px #0009;
}

.intro-first,.intro-second {
  display:block;
}

.intro-first {
  animation:intro-title-in 1.05s .25s both;
}

.intro-second {
  animation:intro-title-in 1.15s 1s both;
}

.intro-bottom {
  position:absolute;
  z-index:3;
  bottom:clamp(70px,11vh,116px);
  left:50%;
  transform:translateX(-50%);
  width:min(520px,calc(100% - var(--pad) * 2));
}

.intro-loader {
  height:1px;
  margin-top:16px;
  background:rgba(199,178,140,.2);
}

.intro-loader>span {
  display:block;
  height:100%;
  width:100%;
  background:var(--gold);
  box-shadow:0 0 12px #c7b28c90;
  transform:scaleX(var(--load-progress,0));
  transform-origin:left;
  transition:transform .12s linear;
}

@keyframes intro-title-in {
  from { opacity:0; transform:translateY(18px); filter:blur(8px); }
  to { opacity:1; transform:none; filter:blur(0); }
}

@keyframes intro-field-in {
  from { opacity:.12; scale:1.15; }
  to { opacity:.48; scale:1; }
}

.js-reveal .reveal {
  opacity:0;
  transform:translateY(25px);
  transition:opacity 1s ease,transform 1s cubic-bezier(.2,.7,.2,1);
}

.js-reveal .reveal.is-visible {
  opacity:1;
  transform:none;
}

.is-entered .entrance {
  animation:intro-enter 1.2s both;
}

.is-entered .entrance:nth-child(2) {
  animation-delay:.1s;
}

@keyframes intro-enter {
  from {
    opacity:0;
    transform:translateY(22px);
  }
  to {
    opacity:1;
    transform:none;
  }
}

/* Shared legal pages */
.site-header--legal {
  position:relative;
}

.site-header__inner {
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
}

.button {
  font-size:12px;
  border-bottom:1px solid var(--gold);
  padding:12px 0;
}

.legal-page {
  padding:80px var(--pad) 100px;
}

.legal-document {
  max-width:800px;
  margin:auto;
}

.legal-document__header {
  border-bottom:1px solid var(--line);
  padding-bottom:35px;
  margin-bottom:45px;
}

.legal-document h1 {
  font-size:clamp(45px,6vw,80px);
  letter-spacing:-.01em;
  margin:20px 0;
}

.legal-document__header>p:last-child {
  font-size:12px;
  color:var(--muted);
}

.legal-document__body {
  font-size:15px;
  color:#b5baab;
  line-height:1.85;
}

.legal-document__body section {
  margin-bottom:34px;
}

.legal-document h2 {
  font-size:22px;
  color:var(--text);
  margin-bottom:14px;
}

.legal-document p+p {
  margin-top:16px;
}

.legal-document ul {
  padding-left:22px;
}

.legal-document__body a {
  text-decoration:underline;
  text-underline-offset:4px;
  overflow-wrap:anywhere;
}

.legal-footer {
  padding:35px var(--pad);
  border-top:1px solid var(--line);
  font-size:11px;
  color:var(--muted);
}

.legal-footer>div {
  display:flex;
  justify-content:space-between;
  gap:25px;
}

.legal-footer nav {
  display:flex;
  gap:25px;
}

@media(max-width:1000px) {
  .application-grid {
    grid-template-columns:1fr;
  }
  .application-card {
    display:grid;
    grid-template-columns:1fr 1fr;
  }
  .application-card .application-art {
    height:100%;
    min-height:280px;
  }
  .desktop-nav {
    gap:20px;
  }
  .experience-grid {
    gap:35px;
    grid-template-columns:1fr 1.1fr;
  }
  .application-art {
    height:240px;
  }
  .applications-heading {
    gap:40px;
  }
  .contact-email span {
    margin-left:20px;
  }
}

@media(max-width:760px) {
  .intro-copy {
    padding-bottom:25px;
  }
  .hero-title-lead {
    font-size:clamp(27px,7.8vw,42px);
  }
  .application-card {
    display:flex;
  }
  .application-card .application-art {
    height:260px;
    min-height:0;
  }
  .site-header {
    height:86px;
  }
  .wordmark {
    width:126px;
  }
  .desktop-nav,.header-contact {
    display:none;
  }
  .menu-toggle {
    display:flex;
    flex-direction:column;
    gap:6px;
    justify-content:center;
    width:44px;
    height:44px;
    padding:10px;
  }
  .menu-toggle span {
    height:1px;
    background:var(--text);
    width:24px;
    transition:transform .3s;
  }
  .menu-toggle[aria-expanded=true] span:first-child {
    transform:translateY(3.5px) rotate(45deg);
  }
  .menu-toggle[aria-expanded=true] span:last-child {
    transform:translateY(-3.5px) rotate(-45deg);
  }
  .mobile-nav {
    position:absolute;
    top:86px;
    left:0;
    right:0;
    padding:30px var(--pad) 40px;
    background:#101010;
    color:var(--text);
    z-index:35;
    border-bottom:1px solid rgba(255,255,255,.08);
    display:flex;
    flex-direction:column;
    gap:25px;
    font-size:22px;
  }
  .mobile-nav a {
    transition:color .25s;
  }
  .mobile-nav a:hover,.mobile-nav a:focus-visible {
    color:var(--gold);
  }
  .hero h1 {
    font-size:clamp(54px,13vw,90px);
  }
  .hero-description {
    font-size:15px;
    margin-top:29px;
  }
  .section-pad {
    padding:75px var(--pad);
  }
  .eyebrow {
    font-size:9px;
  }
  .statement {
    font-size:clamp(31px,6.6vw,49px);
    line-height:1.25;
  }
  .body-copy {
    font-size:14px;
    max-width:none;
  }
  .experience {
    padding:70px var(--pad);
  }
  .experience-grid {
    grid-template-columns:1fr;
    gap:30px;
  }
  .experience h2 {
    font-size:58px;
  }
  .experience h2 em::before {
    content:' ';
  }
  .applications-heading {
    display:block;
    margin-bottom:35px;
  }
  .applications h2 {
    font-size:42px;
  }
  .application-grid {
    grid-template-columns:1fr;
    gap:25px;
  }
  .application-art {
    height:260px;
  }
  .application-info {
    padding:27px;
  }
  .contact {
    grid-template-columns:minmax(0,1fr);
    gap:32px;
  }
  .contact h2 {
    font-size:clamp(40px,10vw,75px);
  }
  .contact-bottom {
    width:100%;
    margin:0;
  }
  .contact-email {
    font-size:clamp(17px,4.5vw,26px);
    display:flex;
    justify-content:space-between;
    width:100%;
    margin-top:0;
    gap:10px;
  }
  .contact-email span {
    margin:0;
  }
  .site-footer {
    padding:35px 0 100px;
    flex-wrap:wrap;
    gap:35px;
  }
  .footer-message {
    font-size:10px;
  }
  .site-footer>div {
    width:100%;
    text-align:left;
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:8px;
  }
  .site-footer nav {
    margin:0;
    gap:16px;
  }
  .intro-copy p {
    font-size:clamp(32px,8vw,56px);
  }
  .legal-footer>div {
    flex-direction:column;
  }
  .legal-page {
    padding-top:55px;
  }
}

.hero {
  position:relative;
  height:100svh;
  min-height:680px;
  max-height:1180px;
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  grid-template-rows:minmax(0,1fr);
  gap:clamp(8px,1.5vw,24px);
  padding:100px max(var(--pad),calc((100% - var(--content-max)) / 2));
  overflow:hidden;
  background:radial-gradient(ellipse at 77% 50%,#24261b 0,transparent 55%);
}

.hero-copy {
  position:relative;
  grid-row:1;
  grid-column:1;
  align-self:center;
  z-index:3;
  width:100%;
  margin:0;
  text-align:left;
}

.hero-description {
  max-width:365px;
  margin:32px 0 0;
}

.hero-art {
  position:relative;
  grid-row:1;
  grid-column:2;
  width:100%;
  height:100%;
  min-height:0;
  margin:0 auto;
  overflow:hidden;
}

@media(min-width:761px) and (max-width:1000px) {
  .hero {
    grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  }
}

@media(max-width:760px) {
  .hero {
    min-height:720px;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto minmax(0,1fr);
    gap:16px;
    padding:130px var(--pad) 100px;
  }
  .hero-copy {
    text-align:center;
  }
  .hero-description {
    margin:24px auto 0;
  }
  .hero-art {
    grid-row:2;
    grid-column:1;
  }
}

#main-content:focus {
  outline:none;
}

.philosophy,.experience,.applications,.contact {
  padding-inline:max(var(--pad),calc((100% - var(--content-max)) / 2));
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important;
  }
  .js-reveal .reveal {
    opacity:1;
    transform:none;
  }
}
