/* Phantomexposure site styles — consolidated build.
   Dead rules from earlier dropdown/hero iterations removed
   (nav-menu / nav-dropdown / nav-trigger / nav-mega / synth-* families).
   Verified to produce identical computed styles vs the prior stylesheet
   across all pages at desktop and mobile widths. */
:root{
  --ink:#f4fbf7;
  --muted:#b5c8c2;
  --quiet:#82948f;
  --line:rgba(181,244,231,.18);
  --cyan:#a8f4e6;
  --cyan2:#7fd3ca;
  --gold:#d5b36d;
  --amber:#b8874d;
  --deep:#050b0c;
  --panel:rgba(7,16,18,.66);
  --panel2:rgba(9,18,20,.88);
  --radius:24px;
  --max:1120px;
  --display:"Geist",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --body:"Inter",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{
  box-sizing:border-box;
}
html{
  scroll-behavior:smooth;
}
body{
  margin:0;
  color:var(--ink);
  font-family:var(--body);
  line-height:1.5;
  background:radial-gradient(circle at 18% -8%,rgba(168,244,230,.18),transparent 31rem),
    radial-gradient(circle at 84% 0%,rgba(213,179,109,.12),transparent 35rem),
    radial-gradient(circle at 52% 115%,rgba(65,126,122,.18),transparent 42rem),
    linear-gradient(180deg,#061013 0%,#071214 45%,#030606 100%);
  min-height:100vh;
  overflow-x:hidden;
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-3;
  pointer-events:none;
  opacity:.23;
  background:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.017) 1px,transparent 1px);
  background-size:92px 92px;
  mask-image:linear-gradient(to bottom,black,transparent 78%);
}
body:after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.11;
  background-image:radial-gradient(circle at 14% 22%,rgba(255,255,255,.62) 0 1px,transparent 1px),
    radial-gradient(circle at 70% 38%,rgba(255,255,255,.42) 0 1px,transparent 1px);
  background-size:240px 260px,330px 310px;
  animation:grainDrift 18s steps(3,end) infinite;
}
@keyframes grainDrift{
  0%,100%{transform:translate(0,0)}
  33%{transform:translate(-16px,9px)}
  66%{transform:translate(12px,-11px)}
}
@keyframes slowLift{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(0,-10px,0) scale(1.015)}
}
@keyframes imageA{
  0%,42%{opacity:1;transform:scale(1.045) translate3d(0,0,0);filter:saturate(.92) contrast(.96) brightness(.82)}
  50%,92%{opacity:.08;transform:scale(1.08) translate3d(-10px,-4px,0);filter:saturate(.82) contrast(.9) brightness(.70)}
  100%{opacity:1;transform:scale(1.045) translate3d(0,0,0);filter:saturate(.92) contrast(.96) brightness(.82)}
}
@keyframes imageB{
  0%,42%{opacity:.04;transform:scale(1.07) translate3d(12px,0,0);filter:saturate(.82) contrast(.88) brightness(.62)}
  50%,92%{opacity:.92;transform:scale(1.045) translate3d(0,-6px,0);filter:saturate(.92) contrast(.95) brightness(.74)}
  100%{opacity:.04;transform:scale(1.07) translate3d(12px,0,0);filter:saturate(.82) contrast(.88) brightness(.62)}
}
@keyframes scanDrift{
  0%{transform:translateX(-36%)}
  100%{transform:translateX(36%)}
}
@keyframes pulseLine{
  0%,100%{opacity:.22}
  50%{opacity:.48}
}
a{
  color:inherit;
  text-decoration:none;
}
img{
  display:block;
  max-width:100%;
}
.wrap{
  width:min(var(--max),calc(100% - 32px));
  margin:0 auto;
}
.nav{
  position:sticky;
  top:0;
  z-index:40;
  background:rgba(4,9,10,.64);
  backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(255,255,255,.075);
}
.nav-inner{
  min-height:62px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.brand{
  display:flex;
  align-items:center;
  gap:11px;
  font-family:var(--display);
  font-weight:800;
  letter-spacing:-.02em;
}
.mark{
  width:31px;
  height:31px;
  border-radius:12px;
  background:radial-gradient(circle at 65% 34%,#fff 0 2px,transparent 3px),
    radial-gradient(circle at 35% 67%,rgba(168,244,230,.95) 0 3px,transparent 4px),
    linear-gradient(135deg,rgba(168,244,230,.18),rgba(213,179,109,.11));
  border:1px solid rgba(168,244,230,.30);
  box-shadow:0 0 28px rgba(168,244,230,.14),inset 0 0 20px rgba(168,244,230,.06);
}
.nav-links{
  display:flex;
  align-items:center;
  gap:6px;
  padding:5px;
  border-radius:999px;
  color:var(--muted);
  font-family:var(--display);
  font-size:13px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.07);
}
.nav-links a{
  position:relative;
  padding:9px 13px;
  border-radius:999px;
  transition:background .25s ease,color .25s ease,transform .25s ease;
}
.nav-links a:hover{
  color:var(--ink);
  background:rgba(255,255,255,.055);
  transform:translateY(-1px);
}
.nav-links a.active{
  color:#061010;
  background:linear-gradient(135deg,rgba(168,244,230,.94),rgba(230,255,248,.92));
  box-shadow:0 10px 28px rgba(168,244,230,.12);
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 16px;
  border-radius:999px;
  font-family:var(--display);
  font-weight:750;
  color:#061010;
  background:linear-gradient(135deg,var(--cyan),#e3fff9);
  border:1px solid rgba(255,255,255,.24);
  box-shadow:0 12px 28px rgba(168,244,230,.13);
  white-space:nowrap;
  transition:transform .25s ease,box-shadow .25s ease,background .25s ease,border-color .25s ease;
}
.button:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 42px rgba(168,244,230,.18);
}
.button.secondary{
  color:var(--ink);
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.13);
  box-shadow:none;
}
.home-hero{
  min-height:calc(100vh - 62px);
  position:relative;
  overflow:hidden;
  padding:34px 0 54px;
}
.home-hero:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at 50% 4%,rgba(168,244,230,.14),transparent 21rem),
    radial-gradient(circle at 50% 72%,rgba(213,179,109,.08),transparent 34rem);
  z-index:0;
}
.home-core{
  position:relative;
  z-index:2;
  text-align:center;
  width:min(920px,calc(100% - 32px));
  margin:0 auto;
}
.logo-panel{
  width:min(760px,90vw);
  margin:0 auto;
  border-radius:10px;
  overflow:hidden;
  filter:drop-shadow(0 22px 62px rgba(0,0,0,.50));
  opacity:.99;
}
.logo-panel img{
  width:100%;
  height:auto;
}
.photo-morph{
  position:relative;
  width:min(760px,90vw);
  height:clamp(230px,38vw,390px);
  margin:22px auto 0;
  border-radius:34px;
  overflow:hidden;
  background:#061012;
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 38px 110px rgba(0,0,0,.50);
  animation:slowLift 16s ease-in-out infinite;
}
.photo-morph img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
.photo-a{
  animation:imageA 18s ease-in-out infinite;
}
.photo-b{
  animation:imageB 18s ease-in-out infinite;
}
.photo-morph:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(3,8,9,.55),transparent 24%,transparent 72%,rgba(3,8,9,.52)),
    radial-gradient(circle at 50% 20%,rgba(222,255,248,.16),transparent 16rem),
    linear-gradient(180deg,rgba(0,0,0,.10),rgba(0,0,0,.42));
  mix-blend-mode:normal;
}
.photo-morph:after{
  content:"";
  position:absolute;
  z-index:4;
  left:-40%;
  top:0;
  bottom:0;
  width:70%;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(215,255,247,.18),transparent);
  filter:blur(18px);
  animation:scanDrift 8s ease-in-out infinite alternate;
}
.photo-lines{
  position:absolute;
  inset:0;
  z-index:5;
  pointer-events:none;
  opacity:.26;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.06) 0 1px,transparent 1px 5px),
    linear-gradient(90deg,transparent,rgba(168,244,230,.18),transparent);
  animation:pulseLine 4.6s ease-in-out infinite;
}
.home-tagline{
  margin:20px auto 0;
  max-width:600px;
  color:#e6f6f1;
  font-size:clamp(13px,1.32vw,17px);
  letter-spacing:.035em;
  line-height:1.55;
  text-shadow:0 1px 18px rgba(0,0,0,.45);
}
.home-tabs{
  width:min(370px,100%);
  margin:26px auto 0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  padding:6px;
  border-radius:999px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 0 28px rgba(168,244,230,.035),0 22px 70px rgba(0,0,0,.30);
}
.home-tabs .button{
  min-width:0;
  width:100%;
}
.home-tabs .button.secondary{
  background:transparent;
}
.home-tabs .button.secondary:hover{
  background:rgba(255,255,255,.06);
}
.hero{
  position:relative;
  padding:52px 0 22px;
  text-align:center;
}
.hero:before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  width:min(760px,86vw);
  height:220px;
  transform:translateX(-50%);
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(circle at 50% 0%,rgba(168,244,230,.12),transparent 18rem),
    radial-gradient(circle at 30% 40%,rgba(213,179,109,.06),transparent 18rem);
}
.eyebrow{
  display:inline-flex;
  padding:7px 11px;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--cyan);
  font-size:12px;
  background:rgba(255,255,255,.04);
  margin-bottom:14px;
  letter-spacing:.11em;
  text-transform:uppercase;
  font-weight:750;
}
h1,h2,h3{
  font-family:var(--display);
  letter-spacing:-.035em;
}
h1{
  margin:0 auto;
  max-width:800px;
  font-size:clamp(28px,4.4vw,50px);
  line-height:1.0;
}
.hero p{
  max-width:620px;
  margin:16px auto 0;
  color:#c7d4d0;
  font-size:clamp(14px,1.45vw,17px);
}
.section{
  padding:34px 0;
}
.section-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:18px;
}
.section h2{
  margin:0;
  max-width:680px;
  font-size:clamp(25px,3.6vw,42px);
  line-height:1.03;
}
.lead{
  margin:0;
  max-width:440px;
  color:var(--muted);
  font-size:15px;
}
.plugin-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
}
.plugin-grid:has(.plugin-card:nth-child(3)){
  grid-template-columns:repeat(3,1fr);
}
.plugin-card{
  overflow:hidden;
  border-radius:var(--radius);
  background:linear-gradient(180deg,rgba(255,255,255,.062),rgba(255,255,255,.025)),
    var(--panel);
  border:1px solid rgba(255,255,255,.085);
  box-shadow:0 24px 60px rgba(0,0,0,.42);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease,background .28s ease;
}
.plugin-card:hover{
  transform:translateY(-5px);
  border-color:rgba(168,244,230,.24);
  box-shadow:0 32px 82px rgba(0,0,0,.48);
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.032)),
    var(--panel);
}
.plugin-card__image{
  aspect-ratio:16/9;
  width:100%;
  object-fit:cover;
  border-bottom:1px solid rgba(255,255,255,.08);
  filter:saturate(.92) contrast(.98);
  transition:transform .65s ease,filter .4s ease;
}
.plugin-card:hover .plugin-card__image{
  transform:scale(1.035);
  filter:saturate(1.02) contrast(1.02);
}
.plugin-card__body{
  padding:17px;
}
.plugin-card__kicker{
  color:var(--cyan);
  font-family:var(--display);
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  margin-bottom:8px;
}
.plugin-card h3{
  margin:0 0 8px;
  font-size:22px;
  line-height:1.05;
}
.plugin-card p{
  margin:0;
  color:var(--muted);
  font-size:14px;
}
.card-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:15px;
}
.card-actions .button{
  min-height:36px;
  padding:0 13px;
  font-size:13px;
}
footer{
  padding:26px 0 34px;
  color:var(--quiet);
  border-top:1px solid rgba(255,255,255,.075);
  font-size:13px;
}
footer .wrap{
  display:flex;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
}
.pe-site-strip{
  border-bottom-color:rgba(168,244,230,.16) !important;
  background:rgba(4,9,10,.84) !important;
}
@media (max-width:920px){
  .plugin-grid,.plugin-grid:has(.plugin-card:nth-child(3)){
    grid-template-columns:1fr;
  }
  .section-head{
    display:block;
  }
  .lead{
    margin-top:10px;
  }
}
@media (max-width:620px){
  .nav-links > a:not(.active){
    display:none;
  }
  .brand span:last-child{
    display:none;
  }
  .button{
    width:100%;
  }
  .home-tabs{
    grid-template-columns:1fr;
    border-radius:28px;
  }
  .photo-morph{
    border-radius:26px;
  }
  .hero{
    padding-top:42px;
  }
}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{
    animation:none !important;
    transition:none !important;
  }
}
.home-portal{
  width:min(640px,100%);
  margin:26px auto 0;
}
.home-tabs{
  width:min(430px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  padding:6px;
  border-radius:999px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 0 28px rgba(168,244,230,.035),0 22px 70px rgba(0,0,0,.30);
}
.catalogue-tab{
  position:relative;
  width:100%;
  min-width:0;
  overflow:hidden;
}
.catalogue-tab::after{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:999px;
  opacity:0;
  background:linear-gradient(110deg,transparent,rgba(255,255,255,.24),transparent);
  transform:translateX(-90%);
  transition:opacity .25s ease;
}
.catalogue-tab:hover::after,
.catalogue-tab:focus-visible::after,
.catalogue-tab.is-active::after{
  opacity:.45;
  animation:tabSheen 1.5s ease-in-out infinite;
}
@keyframes tabSheen{
  from{transform:translateX(-90%)}
  to{transform:translateX(90%)}
}
.portal-preview{
  position:relative;
  min-height:104px;
  margin:14px auto 0;
  border-radius:28px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  background:radial-gradient(circle at 50% 0%,rgba(168,244,230,.11),transparent 18rem),
    linear-gradient(180deg,rgba(255,255,255,.052),rgba(255,255,255,.024));
  box-shadow:0 24px 70px rgba(0,0,0,.36), inset 0 0 40px rgba(168,244,230,.025);
}
.portal-preview::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(168,244,230,.07),transparent 34%,rgba(213,179,109,.05)),
    repeating-linear-gradient(0deg,rgba(255,255,255,.045) 0 1px,transparent 1px 6px);
  opacity:.36;
}
.portal-panel{
  position:absolute;
  inset:0;
  display:grid;
  align-content:center;
  justify-items:center;
  gap:4px;
  padding:20px;
  text-align:center;
  opacity:0;
  transform:translateY(12px) scale(.985);
  transition:opacity .45s ease,transform .45s cubic-bezier(.2,.8,.2,1),filter .45s ease;
  filter:blur(7px);
}
.portal-panel span{
  color:var(--cyan);
  font-family:var(--display);
  font-size:11px;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.portal-panel strong{
  font-family:var(--display);
  font-size:clamp(17px,2vw,22px);
  line-height:1.08;
  letter-spacing:-.025em;
  color:#f5fffb;
}
.portal-panel em{
  color:var(--muted);
  font-style:normal;
  font-size:13px;
}
.home-portal[data-active="effects"] .portal-effects,
.home-portal[data-active="instruments"] .portal-instruments{
  opacity:1;
  transform:translateY(0) scale(1);
  filter:blur(0);
}
.plugin-card{
  position:relative;
  isolation:isolate;
}
.plugin-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  opacity:0;
  background:radial-gradient(circle at var(--mx,50%) var(--my,35%),rgba(168,244,230,.16),transparent 13rem),
    linear-gradient(110deg,transparent,rgba(255,255,255,.06),transparent);
  transition:opacity .35s ease;
}
.plugin-card:hover::after,
.plugin-card:focus-within::after{
  opacity:1;
}
.plugin-card .card-actions{
  transform:translateY(4px);
  opacity:.88;
  transition:transform .28s ease,opacity .28s ease;
}
.plugin-card:hover .card-actions,
.plugin-card:focus-within .card-actions{
  transform:translateY(0);
  opacity:1;
}
.plugin-card__body{
  position:relative;
  z-index:3;
}
.plugin-card__kicker,
.plugin-card h3,
.plugin-card p{
  transition:color .28s ease,transform .28s ease;
}
.plugin-card:hover h3,
.plugin-card:focus-within h3{
  transform:translateY(-1px);
  color:#ffffff;
}
.plugin-card:hover .plugin-card__kicker,
.plugin-card:focus-within .plugin-card__kicker{
  color:#d9fff7;
}
@media (max-width:620px){
  .home-portal{
    margin-top:22px;
  }
  .home-tabs{
    grid-template-columns:1fr;
    border-radius:28px;
  }
  .catalogue-tab::after{
    border-radius:24px;
  }
  .portal-preview{
    min-height:128px;
  }
}
.hero, .plugin-grid, .home-core{
  animation:pageReveal .7s cubic-bezier(.2,.8,.2,1) both;
}
.plugin-grid{
  animation-delay:.08s;
}
@keyframes pageReveal{
  from{opacity:0;transform:translateY(12px);filter:blur(8px)}
  to{opacity:1;transform:translateY(0);filter:blur(0)}
}
.portal-links{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:8px;
}
.portal-links a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:0 11px;
  border-radius:999px;
  color:#061010;
  font-family:var(--display);
  font-size:12px;
  font-weight:760;
  background:linear-gradient(135deg,rgba(168,244,230,.94),rgba(227,255,249,.92));
  border:1px solid rgba(255,255,255,.22);
  transition:transform .22s ease,box-shadow .22s ease;
}
.portal-links a:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 32px rgba(168,244,230,.14);
}
@media (max-width:720px){
  .nav-links{
    gap:4px;
  }
}
@media (max-width:720px){
}
.nav-links{
  overflow:visible;
}
.nav-links > .home-link{
  padding:9px 13px;
  border-radius:999px;
}
.nav-products{
  position:relative;
  display:flex;
  gap:4px;
  padding:5px;
  border-radius:999px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.07);
}
.nav-product{
  position:relative;
}
.nav-product-trigger{
  appearance:none;
  border:0;
  color:var(--muted);
  background:transparent;
  font:inherit;
  font-size:13px;
  padding:9px 13px;
  border-radius:999px;
  cursor:pointer;
  white-space:nowrap;
  transition:background .18s ease,color .18s ease;
}
.nav-product-trigger:hover,
.nav-product-trigger:focus-visible,
.nav-product:hover .nav-product-trigger,
.nav-product:focus-within .nav-product-trigger{
  color:var(--ink);
  background:rgba(255,255,255,.07);
}
.nav-panel{
  position:absolute;
  top:100%;
  left:0;
  z-index:50;
  min-width:300px;
  padding-top:11px;
  opacity:0;
  transform:translateY(6px);
  pointer-events:none;
  /* Instant reveal: no transition, so the menu can't be starved by the
     heavy homepage hero animation. Matches the product-page strips. */
}
.nav-product:last-child .nav-panel{
  left:auto;
  right:0;
}
.nav-panel-card{
  display:grid;
  gap:5px;
  padding:10px;
  border-radius:20px;
  background:rgba(5,12,13,.97);
  border:1px solid rgba(169,243,230,.16);
  box-shadow:0 30px 90px rgba(0,0,0,.5), inset 0 0 42px rgba(169,243,230,.025);
  backdrop-filter:blur(20px);
}
.nav-panel-label{
  display:block;
  color:var(--cyan);
  font-family:var(--display);
  font-size:10px;
  font-weight:850;
  letter-spacing:.15em;
  text-transform:uppercase;
  padding:7px 10px 2px;
}
.nav-panel a{
  display:grid;
  gap:4px;
  min-height:54px;
  align-content:center;
  padding:11px 13px;
  border-radius:14px;
  opacity:.92;
  transition:background .18s ease,transform .18s ease,opacity .18s ease;
}
.nav-panel a:hover,
.nav-panel a:focus-visible{
  background:rgba(255,255,255,.065);
  transform:translateX(2px);
  opacity:1;
}
.nav-panel strong{
  color:#f4fbf7;
  font-size:13px;
}
.nav-panel em{
  color:#91aaa3;
  font-style:normal;
  font-size:11.5px;
  line-height:1.25;
}
.nav-product:hover .nav-panel,
.nav-product:focus-within .nav-panel{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
@media (max-width:720px){
  .nav-panel{
    min-width:240px;
  }
}
@keyframes synthLayerA{
  0%,30%{opacity:.30;transform:translate3d(-2%,0,0) scale(1.08)}
  38%,68%{opacity:.16;transform:translate3d(2%,-2%,0) scale(1.12)}
  76%,100%{opacity:.08;transform:translate3d(1%,2%,0) scale(1.10)}
}
@keyframes synthLayerB{
  0%,28%{opacity:.08;transform:translate3d(2%,0,0) scale(1.10)}
  36%,66%{opacity:.30;transform:translate3d(-1%,-2%,0) scale(1.07)}
  74%,100%{opacity:.18;transform:translate3d(-2%,1.5%,0) scale(1.11)}
}
@keyframes synthLayerC{
  0%,32%{opacity:.10;transform:translate3d(0,2%,0) scale(1.13)}
  40%,70%{opacity:.14;transform:translate3d(-2%,0,0) scale(1.09)}
  78%,100%{opacity:.28;transform:translate3d(2%,-1%,0) scale(1.07)}
}
@keyframes synthSweep{
  0%{transform:translateX(-22%)}
  100%{transform:translateX(24%)}
}
@keyframes photoCycle{
  0%,8%{opacity:0}
  10%,20%{opacity:1}
  24%,100%{opacity:0}
}
@keyframes photoDrift{
  0%,100%{transform:scale(1.045) translate3d(0,0,0)}
  50%{transform:scale(1.082) translate3d(8px,-8px,0)}
}
.home-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:calc(100vh - 62px);
  display:grid;
  place-items:center;
  padding:42px 0 54px;
}
.home-core{
  position:relative;
  z-index:2;
}
.photo-morph{
  position:relative;
  width:min(920px,calc(100vw - 36px));
  aspect-ratio:16/9;
  margin:0 auto;
  border-radius:34px;
  overflow:hidden;
  border:1px solid rgba(168,244,230,.18);
  background:radial-gradient(circle at 16% 0%,rgba(168,244,230,.08),transparent 16rem),
    linear-gradient(180deg,rgba(10,18,20,.70),rgba(6,11,12,.88));
  box-shadow:0 48px 120px rgba(0,0,0,.45),
    inset 0 0 48px rgba(255,255,255,.03),
    inset 0 0 34px rgba(168,244,230,.05);
  backdrop-filter:blur(8px);
}
.photo-morph::before{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(135deg,rgba(168,244,230,.18),transparent 34%,rgba(213,179,109,.10) 72%,transparent);
  opacity:.40;
  z-index:4;
}
.photo-stack{
  position:absolute;
  inset:0;
}
.photo-frame{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  animation:photoCycle 40s ease-in-out infinite,
    photoDrift 12s ease-in-out infinite;
  filter:saturate(.93) contrast(.96) brightness(.84);
  transform-origin:center center;
}
.frame-1{
  animation-delay:0s, 0s;
}
.frame-2{
  animation-delay:5s, .8s;
}
.frame-3{
  animation-delay:10s, 1.6s;
}
.frame-4{
  animation-delay:15s, 2.4s;
}
.frame-5{
  animation-delay:20s, 3.2s;
}
.frame-6{
  animation-delay:25s, 4s;
}
.frame-7{
  animation-delay:30s, 4.8s;
}
.frame-8{
  animation-delay:35s, 5.6s;
}
.photo-lines{
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,.06),transparent 16%,rgba(255,255,255,.05) 54%,transparent 82%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.038) 0 1px,transparent 1px 6px);
  mix-blend-mode:screen;
  opacity:.36;
}
.photo-lines::before{
  content:"";
  position:absolute;
  inset:-20% -10%;
  background:linear-gradient(90deg,transparent,rgba(218,255,248,.20),transparent);
  filter:blur(18px);
  animation:scanDrift 14s ease-in-out infinite alternate;
}
.home-tagline{
  position:relative;
  z-index:3;
  max-width:780px;
  margin:28px auto 0;
  text-align:center;
  font-family:var(--display);
  font-size:clamp(15px,2vw,20px);
  font-weight:650;
  letter-spacing:-.01em;
  color:#dfeae7;
  text-shadow:0 1px 0 rgba(0,0,0,.24);
}
@media (max-width:820px){
  .home-hero{
    min-height:auto;
    padding:30px 0 40px;
  }
  .photo-morph{
    width:min(100%,calc(100vw - 26px));
    border-radius:26px;
  }
  .home-tagline{
    margin-top:22px;
    font-size:clamp(14px,4vw,18px);
    max-width:92%;
  }
}
@keyframes logoFieldShift{
  0%,100%{
    filter:saturate(.52) hue-rotate(0deg) brightness(.82);
    opacity:.76;
    transform:scale(1);
  }
  33%{
    filter:saturate(.46) hue-rotate(-8deg) brightness(.86);
    opacity:.82;
    transform:scale(1.015);
  }
  66%{
    filter:saturate(.40) hue-rotate(9deg) brightness(.78);
    opacity:.72;
    transform:scale(1.025);
  }
}
@keyframes logoBgDrift{
  0%,100%{transform:translate3d(-1%,0,0) scale(1.06)}
  50%{transform:translate3d(1%,-1%,0) scale(1.09)}
}
@keyframes wordmarkFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-3px)}
}
.home-hero{
  min-height:calc(100vh - 62px);
  display:block;
  padding:26px 0 46px;
}
.home-core{
  width:min(1120px,calc(100% - 32px));
  margin:0 auto;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.logo-panel{
  display:none !important;
}
.logo-stage{
  position:relative;
  z-index:2;
  width:min(980px,94vw);
  min-height:clamp(180px,23vw,280px);
  margin:clamp(12px,2.5vh,30px) auto 24px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:34px;
  border:1px solid rgba(168,244,230,.16);
  background:radial-gradient(circle at 18% 0%,rgba(168,244,230,.10),transparent 18rem),
    linear-gradient(180deg,rgba(10,20,22,.72),rgba(5,10,12,.88));
  box-shadow:0 42px 112px rgba(0,0,0,.44),
    inset 0 0 60px rgba(255,255,255,.035),
    inset 0 0 44px rgba(168,244,230,.045);
}
.logo-colour-field{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:radial-gradient(circle at 50% 18%,rgba(220,255,248,.30),transparent 15rem),
    radial-gradient(circle at 16% 50%,rgba(130,206,204,.20),transparent 18rem),
    radial-gradient(circle at 84% 70%,rgba(173,140,86,.16),transparent 19rem),
    linear-gradient(120deg,rgba(96,151,154,.48),rgba(175,215,210,.24) 42%,rgba(31,61,66,.54));
  animation:logoFieldShift 20s ease-in-out infinite;
  mix-blend-mode:screen;
}
.logo-stage::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(3,8,9,.50),transparent 20%,transparent 78%,rgba(3,8,9,.45)),
    repeating-linear-gradient(0deg,rgba(255,255,255,.032) 0 1px,transparent 1px 6px);
}
.logo-stage::after{
  content:"";
  position:absolute;
  z-index:3;
  left:-42%;
  top:0;
  bottom:0;
  width:64%;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(222,255,249,.14),transparent);
  filter:blur(18px);
  animation:scanDrift 16s ease-in-out infinite alternate;
}
.wordmark,
.wordmark-glow{
  position:relative;
  z-index:4;
  width:min(860px,82vw);
  height:auto;
  pointer-events:none;
  animation:wordmarkFloat 8s ease-in-out infinite;
}
.wordmark-glow{
  position:absolute;
  opacity:.55;
  mix-blend-mode:screen;
  filter:blur(.4px);
}
.wordmark{
  filter:drop-shadow(0 10px 24px rgba(0,0,0,.46));
}
.photo-morph{
  margin-top:0;
  width:min(920px,calc(100vw - 36px));
  z-index:2;
}
.home-tagline{
  margin-top:24px;
}
@media (max-width:820px){
  .logo-stage{
    min-height:clamp(150px,28vw,220px);
    border-radius:26px;
    margin-top:14px;
  }
  .wordmark,
  .wordmark-glow{
    width:min(780px,88vw);
  }
}
.wordmark,
.wordmark-glow{
  width:min(980px,88vw);
}
.logo-stage{
  min-height:clamp(190px,25vw,300px);
}
@media (max-width:820px){
  .wordmark,
  .wordmark-glow{
    width:min(900px,92vw);
  }
  .logo-stage{
    min-height:clamp(160px,30vw,235px);
  }
}
.logo-stage{
  background:radial-gradient(circle at 18% 0%,rgba(168,244,230,.08),transparent 18rem),
    linear-gradient(180deg,rgba(10,18,20,.68),rgba(6,11,12,.84));
  box-shadow:0 34px 92px rgba(0,0,0,.38),
    inset 0 0 56px rgba(255,255,255,.028),
    inset 0 0 42px rgba(168,244,230,.04);
}
.logo-colour-field{
  background:radial-gradient(circle at 50% 18%,rgba(228,242,239,.22),transparent 14rem),
    radial-gradient(circle at 14% 54%,rgba(126,176,180,.14),transparent 18rem),
    radial-gradient(circle at 84% 68%,rgba(156,137,101,.10),transparent 18rem),
    linear-gradient(120deg,rgba(89,118,124,.20),rgba(196,210,206,.10) 40%,rgba(36,54,58,.18));
  animation:logoFieldShift 24s ease-in-out infinite;
  mix-blend-mode:screen;
  opacity:.72;
}
.wordmark-glow{
  opacity:.38;
}
.photo-morph{
  position:relative;
  width:min(940px,calc(100vw - 34px));
  aspect-ratio:16/9;
  background:radial-gradient(circle at 16% 0%,rgba(168,244,230,.045),transparent 16rem),
    linear-gradient(180deg,rgba(10,16,18,.80),rgba(6,9,10,.94));
  overflow:hidden;
}
.photo-stack{
  position:absolute;
  inset:0;
}
.photo-frame{
  opacity:0;
  filter:saturate(.72) contrast(.98) brightness(.78) sepia(.05);
  transform-origin:center center;
  mix-blend-mode:screen;
  will-change:transform, opacity, filter;
}
@keyframes photoCycleA{
  0%,6%{opacity:0}
  9%,17%{opacity:.93}
  22%,100%{opacity:0}
}
@keyframes photoCycleB{
  0%,14%{opacity:0}
  17%,26%{opacity:.88}
  31%,100%{opacity:0}
}
@keyframes photoCycleC{
  0%,26%{opacity:0}
  29%,38%{opacity:.92}
  43%,100%{opacity:0}
}
@keyframes photoCycleD{
  0%,38%{opacity:0}
  41%,50%{opacity:.86}
  55%,100%{opacity:0}
}
@keyframes photoCycleE{
  0%,50%{opacity:0}
  53%,62%{opacity:.94}
  67%,100%{opacity:0}
}
@keyframes photoCycleF{
  0%,62%{opacity:0}
  65%,74%{opacity:.84}
  79%,100%{opacity:0}
}
@keyframes photoCycleG{
  0%,74%{opacity:0}
  77%,86%{opacity:.92}
  91%,100%{opacity:0}
}
@keyframes photoCycleH{
  0%,82%{opacity:0}
  85%,95%{opacity:.86}
  100%{opacity:0}
}
@keyframes photoDriftA{
  0%{transform:scale(1.02) translate3d(-6px,3px,0) rotate(-0.6deg)}
  28%{transform:scale(1.08) translate3d(10px,-8px,0) rotate(0.2deg)}
  56%{transform:scale(1.05) translate3d(-12px,-4px,0) rotate(0.8deg)}
  100%{transform:scale(1.11) translate3d(8px,6px,0) rotate(-0.3deg)}
}
@keyframes photoDriftB{
  0%{transform:scale(1.03) translate3d(8px,-2px,0) rotate(0.5deg)}
  40%{transform:scale(1.09) translate3d(-10px,6px,0) rotate(-0.4deg)}
  68%{transform:scale(1.05) translate3d(4px,-10px,0) rotate(0.7deg)}
  100%{transform:scale(1.10) translate3d(-6px,8px,0) rotate(-0.1deg)}
}
@keyframes photoDriftC{
  0%{transform:scale(1.01) translate3d(0,6px,0) rotate(-0.5deg)}
  35%{transform:scale(1.08) translate3d(10px,-6px,0) rotate(0.3deg)}
  62%{transform:scale(1.04) translate3d(-8px,-8px,0) rotate(-0.8deg)}
  100%{transform:scale(1.12) translate3d(12px,4px,0) rotate(0.2deg)}
}
@keyframes photoFlicker{
  0%,100%{filter:saturate(.72) contrast(.98) brightness(.78) sepia(.05)}
  48%{filter:saturate(.68) contrast(1.02) brightness(.80) sepia(.04)}
  52%{filter:saturate(.76) contrast(.96) brightness(.76) sepia(.06)}
}
.frame-1{
  animation:photoCycleA 39s ease-in-out infinite, photoDriftA 14.5s ease-in-out infinite, photoFlicker 7.2s steps(2,end) infinite;
}
.frame-2{
  animation:photoCycleB 41s ease-in-out infinite, photoDriftB 13.4s ease-in-out infinite, photoFlicker 8.1s steps(2,end) infinite;
}
.frame-3{
  animation:photoCycleC 43s ease-in-out infinite, photoDriftC 15.2s ease-in-out infinite, photoFlicker 7.7s steps(2,end) infinite;
}
.frame-4{
  animation:photoCycleD 40s ease-in-out infinite, photoDriftA 12.8s ease-in-out infinite, photoFlicker 8.6s steps(2,end) infinite;
}
.frame-5{
  animation:photoCycleE 42s ease-in-out infinite, photoDriftB 15.6s ease-in-out infinite, photoFlicker 7.5s steps(2,end) infinite;
}
.frame-6{
  animation:photoCycleF 44s ease-in-out infinite, photoDriftC 13.9s ease-in-out infinite, photoFlicker 8.4s steps(2,end) infinite;
}
.frame-7{
  animation:photoCycleG 41s ease-in-out infinite, photoDriftA 16.3s ease-in-out infinite, photoFlicker 7.9s steps(2,end) infinite;
}
.frame-8{
  animation:photoCycleH 45s ease-in-out infinite, photoDriftB 14.8s ease-in-out infinite, photoFlicker 8.8s steps(2,end) infinite;
}
.photo-lines{
  opacity:.26;
  background:linear-gradient(90deg,rgba(255,255,255,.03),transparent 18%,rgba(255,255,255,.045) 50%,transparent 82%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.03) 0 1px,transparent 1px 6px);
}
.photo-lines::before{
  opacity:.66;
  background:linear-gradient(90deg,transparent,rgba(224,246,240,.12),transparent);
}
.photo-grain{
  position:absolute;
  inset:-15%;
  z-index:4;
  pointer-events:none;
  background-image:radial-gradient(circle, rgba(255,255,255,.13) 0 0.7px, transparent 0.9px),
    radial-gradient(circle, rgba(0,0,0,.14) 0 0.7px, transparent 0.9px);
  background-size:5px 5px, 7px 7px;
  background-position:0 0, 2px 3px;
  mix-blend-mode:soft-light;
  opacity:.24;
  animation:grainFloat 1.2s steps(3,end) infinite;
}
.photo-morph::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:5;
  pointer-events:none;
  background:radial-gradient(circle at 22% 16%,rgba(230,241,237,.05),transparent 16rem),
    radial-gradient(circle at 78% 72%,rgba(137,170,168,.05),transparent 18rem),
    linear-gradient(180deg,rgba(7,12,13,.05),rgba(7,12,13,.14));
}
@keyframes grainFloat{
  0%{transform:translate3d(0,0,0)}
  33%{transform:translate3d(-6px,4px,0)}
  66%{transform:translate3d(5px,-3px,0)}
  100%{transform:translate3d(0,0,0)}
}
@media (max-width:820px){
  .photo-frame{
    filter:saturate(.70) contrast(.98) brightness(.78) sepia(.05);
  }
}
.logo-stage{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  border-radius:0 !important;
  overflow:visible !important;
}
.logo-stage::before,
.logo-stage::after{
  display:none !important;
}
.logo-colour-field{
  inset:8% 2% 10% 2%;
  border-radius:36px;
  opacity:.62;
  filter:blur(0.2px);
}
.wordmark{
  filter:drop-shadow(0 10px 24px rgba(0,0,0,.34));
}
@media (max-width:820px){
  .logo-colour-field{
    border-radius:28px;
  }
}
.logo-stage{
  display:grid !important;
  place-items:center !important;
  width:min(1100px, 96vw) !important;
  min-height:auto !important;
  margin:18px auto 18px !important;
  padding:0 !important;
  border:none !important;
  outline:none !important;
  background:none !important;
  box-shadow:none !important;
  border-radius:0 !important;
  overflow:visible !important;
}
.logo-stage::before,
.logo-stage::after,
.logo-colour-field,
.wordmark-glow{
  display:none !important;
  content:none !important;
}
.wordmark{
  position:relative !important;
  z-index:2 !important;
  display:block !important;
  width:min(1020px, 92vw) !important;
  height:auto !important;
  margin:0 auto !important;
  filter:none !important;
  box-shadow:none !important;
}
.home-hero{
  padding-top:18px !important;
}
.home-core{
  gap:0 !important;
}
.photo-morph{
  margin-top:4px !important;
}
@media (max-width:820px){
  .logo-stage{
    width:min(100%, 98vw) !important;
    margin:12px auto 16px !important;
  }
  .wordmark{
    width:min(940px, 94vw) !important;
  }
}
.photo-morph{
  background:radial-gradient(circle at 16% 0%, rgba(168,244,230,.045), transparent 16rem),
    linear-gradient(180deg, rgba(10,16,18,.84), rgba(6,9,10,.96));
}
.photo-stack{
  position:absolute;
  inset:0;
  background-image:url("/assets/home_main/scene-01.webp");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.photo-frame{
  opacity:0;
  animation-name:photoPresence, photoDriftAlt, photoFlickerAlt !important;
  animation-timing-function:ease-in-out, ease-in-out, steps(2,end) !important;
  animation-iteration-count:infinite, infinite, infinite !important;
  will-change:opacity, transform, filter;
}
@keyframes photoPresence{
  0%{opacity:0}
  4%{opacity:.18}
  10%{opacity:.86}
  22%{opacity:.92}
  34%{opacity:.20}
  40%{opacity:0}
  100%{opacity:0}
}
@keyframes photoDriftAlt{
  0%{transform:scale(1.03) translate3d(-6px,4px,0) rotate(-0.4deg)}
  25%{transform:scale(1.08) translate3d(10px,-7px,0) rotate(0.25deg)}
  50%{transform:scale(1.06) translate3d(-8px,-5px,0) rotate(0.6deg)}
  75%{transform:scale(1.10) translate3d(8px,6px,0) rotate(-0.3deg)}
  100%{transform:scale(1.07) translate3d(-3px,2px,0) rotate(0.15deg)}
}
@keyframes photoFlickerAlt{
  0%,100%{filter:saturate(.70) contrast(.99) brightness(.79) sepia(.05)}
  48%{filter:saturate(.67) contrast(1.02) brightness(.81) sepia(.04)}
  52%{filter:saturate(.74) contrast(.97) brightness(.77) sepia(.06)}
}
.frame-1{
  animation-duration:40s, 15.5s, 8.1s !important;
  animation-delay:0s, 0s, 0s !important;
}
.frame-2{
  animation-duration:40s, 14.1s, 7.8s !important;
  animation-delay:5s, .6s, .2s !important;
}
.frame-3{
  animation-duration:40s, 16.2s, 8.6s !important;
  animation-delay:10s, 1.2s, .4s !important;
}
.frame-4{
  animation-duration:40s, 13.8s, 7.5s !important;
  animation-delay:15s, 1.8s, .1s !important;
}
.frame-5{
  animation-duration:40s, 15.9s, 8.3s !important;
  animation-delay:20s, 2.4s, .5s !important;
}
.frame-6{
  animation-duration:40s, 14.6s, 7.9s !important;
  animation-delay:25s, 3.0s, .3s !important;
}
.frame-7{
  animation-duration:40s, 16.4s, 8.7s !important;
  animation-delay:30s, 3.6s, .7s !important;
}
.frame-8{
  animation-duration:40s, 14.9s, 8.0s !important;
  animation-delay:35s, 4.2s, .4s !important;
}
.photo-stack::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:url("/assets/home_main/scene-02.webp");
  background-size:cover;
  background-position:center;
  opacity:.12;
  mix-blend-mode:screen;
  pointer-events:none;
}
.photo-lines{
  opacity:.22;
}
.photo-grain{
  opacity:.28;
}
.photo-stack{
  background-image:url("/assets/home_main/scene-01.webp");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.photo-stack::before{
  opacity:.16 !important;
}
.photo-frame{
  opacity:0;
  will-change:opacity, transform, filter;
  animation-duration:48s, 15s, 8s !important;
  animation-iteration-count:infinite, infinite, infinite !important;
  animation-timing-function:linear, ease-in-out, steps(2,end) !important;
  animation-fill-mode:both, both, both !important;
}
@keyframes photoDriftBurstA{
  0%{transform:scale(1.03) translate3d(-8px,3px,0) rotate(-0.5deg)}
  22%{transform:scale(1.10) translate3d(11px,-7px,0) rotate(0.3deg)}
  44%{transform:scale(1.06) translate3d(-12px,-5px,0) rotate(0.8deg)}
  68%{transform:scale(1.11) translate3d(7px,8px,0) rotate(-0.2deg)}
  100%{transform:scale(1.08) translate3d(-4px,1px,0) rotate(0.1deg)}
}
@keyframes photoDriftBurstB{
  0%{transform:scale(1.02) translate3d(7px,-2px,0) rotate(0.4deg)}
  26%{transform:scale(1.09) translate3d(-10px,6px,0) rotate(-0.5deg)}
  52%{transform:scale(1.05) translate3d(6px,-10px,0) rotate(0.6deg)}
  78%{transform:scale(1.12) translate3d(-8px,7px,0) rotate(-0.2deg)}
  100%{transform:scale(1.07) translate3d(2px,-2px,0) rotate(0.2deg)}
}
@keyframes photoDriftBurstC{
  0%{transform:scale(1.01) translate3d(0,6px,0) rotate(-0.6deg)}
  30%{transform:scale(1.08) translate3d(10px,-7px,0) rotate(0.2deg)}
  58%{transform:scale(1.06) translate3d(-7px,-8px,0) rotate(-0.7deg)}
  82%{transform:scale(1.10) translate3d(12px,4px,0) rotate(0.15deg)}
  100%{transform:scale(1.05) translate3d(-3px,2px,0) rotate(-0.15deg)}
}
@keyframes photoFlickerBurst{
  0%,100%{filter:saturate(.69) contrast(1.00) brightness(.79) sepia(.05)}
  20%{filter:saturate(.73) contrast(.97) brightness(.78) sepia(.06)}
  48%{filter:saturate(.67) contrast(1.03) brightness(.81) sepia(.04)}
  52%{filter:saturate(.75) contrast(.96) brightness(.77) sepia(.06)}
  78%{filter:saturate(.70) contrast(1.01) brightness(.80) sepia(.05)}
}
@keyframes frame1Sequence{
  0%,0.2%{opacity:.22}
  1.6%,3.2%{opacity:.98}
  4.8%,18.5%{opacity:0}
  20%,28%{opacity:.92}
  31.5%,84%{opacity:0}
  85%,86.8%{opacity:.92}
  88.2%,100%{opacity:0}
}
@keyframes frame2Sequence{
  0%,2%{opacity:0}
  3.4%,5.1%{opacity:.96}
  6.6%,26.5%{opacity:0}
  28%,36%{opacity:.90}
  39.5%,87%{opacity:0}
  88%,89.8%{opacity:.94}
  91.3%,100%{opacity:0}
}
@keyframes frame3Sequence{
  0%,4%{opacity:0}
  5.4%,7.1%{opacity:.96}
  8.6%,34.5%{opacity:0}
  36%,44%{opacity:.92}
  47.5%,89%{opacity:0}
  90%,91.8%{opacity:.92}
  93.3%,100%{opacity:0}
}
@keyframes frame4Sequence{
  0%,6%{opacity:0}
  7.4%,9.1%{opacity:.96}
  10.6%,42.5%{opacity:0}
  44%,52%{opacity:.88}
  55.5%,91%{opacity:0}
  92%,93.8%{opacity:.94}
  95.3%,100%{opacity:0}
}
@keyframes frame5Sequence{
  0%,8%{opacity:0}
  9.4%,11.1%{opacity:.96}
  12.6%,50.5%{opacity:0}
  52%,60%{opacity:.92}
  63.5%,93%{opacity:0}
  94%,95.8%{opacity:.92}
  97.3%,100%{opacity:0}
}
@keyframes frame6Sequence{
  0%,10%{opacity:0}
  11.4%,13.1%{opacity:.95}
  14.6%,58.5%{opacity:0}
  60%,68%{opacity:.90}
  71.5%,95%{opacity:0}
  96%,97.6%{opacity:.90}
  99%,100%{opacity:.18}
}
@keyframes frame7Sequence{
  0%,12%{opacity:0}
  13.4%,15.1%{opacity:.94}
  16.6%,66.5%{opacity:0}
  68%,76%{opacity:.88}
  79.5%,97%{opacity:0}
  98%,99.4%{opacity:.88}
  100%{opacity:.30}
}
@keyframes frame8Sequence{
  0%{opacity:.44}
  0.8%,14%{opacity:0}
  15.4%,17.1%{opacity:.95}
  18.6%,74.5%{opacity:0}
  76%,84%{opacity:.90}
  87.5%,98.6%{opacity:0}
  99.2%,100%{opacity:.66}
}
.frame-1{
  animation-name:frame1Sequence, photoDriftBurstA, photoFlickerBurst !important;
  animation-delay:0s,0s,0s !important;
}
.frame-2{
  animation-name:frame2Sequence, photoDriftBurstB, photoFlickerBurst !important;
  animation-delay:0s,.4s,.2s !important;
}
.frame-3{
  animation-name:frame3Sequence, photoDriftBurstC, photoFlickerBurst !important;
  animation-delay:0s,.8s,.4s !important;
}
.frame-4{
  animation-name:frame4Sequence, photoDriftBurstA, photoFlickerBurst !important;
  animation-delay:0s,1.2s,.1s !important;
}
.frame-5{
  animation-name:frame5Sequence, photoDriftBurstB, photoFlickerBurst !important;
  animation-delay:0s,1.6s,.3s !important;
}
.frame-6{
  animation-name:frame6Sequence, photoDriftBurstC, photoFlickerBurst !important;
  animation-delay:0s,2.0s,.5s !important;
}
.frame-7{
  animation-name:frame7Sequence, photoDriftBurstA, photoFlickerBurst !important;
  animation-delay:0s,2.4s,.2s !important;
}
.frame-8{
  animation-name:frame8Sequence, photoDriftBurstB, photoFlickerBurst !important;
  animation-delay:0s,2.8s,.4s !important;
}
.photo-lines{
  opacity:.20;
}
.photo-grain{
  opacity:.30;
}
.photo-stack{
  background:none !important;
  background-image:none !important;
}
.photo-stack::before{
  display:none !important;
  content:none !important;
}
.photo-frame{
  opacity:0;
  animation-duration:48s, 15.5s, 8.2s !important;
  animation-iteration-count:infinite, infinite, infinite !important;
  animation-fill-mode:both, both, both !important;
  animation-timing-function:linear, ease-in-out, steps(2,end) !important;
  will-change:opacity, transform, filter;
}
@keyframes fairBurstHoldSequence{
  /* short burst cluster */
  0%{opacity:0}
  2%{opacity:.26}
  5%{opacity:.96}
  7%{opacity:.16}
  10%{opacity:.90}
  12%{opacity:.12}
  15%{opacity:.78}

  /* transition into slower hold */
  19%{opacity:.28}
  24%{opacity:.84}
  32%{opacity:.92}
  40%{opacity:.88}
  47%{opacity:.44}
  52%{opacity:.12}
  58%{opacity:0}
  100%{opacity:0}
}
@keyframes fairDriftA{
  0%{transform:scale(1.03) translate3d(-8px,3px,0) rotate(-0.45deg)}
  24%{transform:scale(1.09) translate3d(10px,-7px,0) rotate(0.25deg)}
  52%{transform:scale(1.05) translate3d(-11px,-5px,0) rotate(0.75deg)}
  78%{transform:scale(1.10) translate3d(8px,7px,0) rotate(-0.2deg)}
  100%{transform:scale(1.07) translate3d(-3px,2px,0) rotate(0.1deg)}
}
@keyframes fairDriftB{
  0%{transform:scale(1.02) translate3d(7px,-2px,0) rotate(0.4deg)}
  25%{transform:scale(1.08) translate3d(-10px,6px,0) rotate(-0.5deg)}
  56%{transform:scale(1.05) translate3d(6px,-10px,0) rotate(0.6deg)}
  80%{transform:scale(1.11) translate3d(-8px,7px,0) rotate(-0.2deg)}
  100%{transform:scale(1.06) translate3d(2px,-2px,0) rotate(0.2deg)}
}
@keyframes fairDriftC{
  0%{transform:scale(1.01) translate3d(0,6px,0) rotate(-0.55deg)}
  28%{transform:scale(1.08) translate3d(10px,-7px,0) rotate(0.2deg)}
  54%{transform:scale(1.06) translate3d(-7px,-8px,0) rotate(-0.65deg)}
  82%{transform:scale(1.10) translate3d(12px,4px,0) rotate(0.15deg)}
  100%{transform:scale(1.05) translate3d(-3px,2px,0) rotate(-0.12deg)}
}
@keyframes fairFlicker{
  0%,100%{filter:saturate(.69) contrast(1.00) brightness(.79) sepia(.05)}
  22%{filter:saturate(.73) contrast(.97) brightness(.78) sepia(.06)}
  48%{filter:saturate(.67) contrast(1.03) brightness(.81) sepia(.04)}
  52%{filter:saturate(.75) contrast(.96) brightness(.77) sepia(.06)}
  78%{filter:saturate(.70) contrast(1.01) brightness(.80) sepia(.05)}
}
.frame-1{
  animation-name:fairBurstHoldSequence, fairDriftA, fairFlicker !important;
  animation-delay:0s,0s,0s !important;
}
.frame-2{
  animation-name:fairBurstHoldSequence, fairDriftB, fairFlicker !important;
  animation-delay:6s,.5s,.2s !important;
}
.frame-3{
  animation-name:fairBurstHoldSequence, fairDriftC, fairFlicker !important;
  animation-delay:12s,1.0s,.4s !important;
}
.frame-4{
  animation-name:fairBurstHoldSequence, fairDriftA, fairFlicker !important;
  animation-delay:18s,1.5s,.1s !important;
}
.frame-5{
  animation-name:fairBurstHoldSequence, fairDriftB, fairFlicker !important;
  animation-delay:24s,2.0s,.3s !important;
}
.frame-6{
  animation-name:fairBurstHoldSequence, fairDriftC, fairFlicker !important;
  animation-delay:30s,2.5s,.5s !important;
}
.frame-7{
  animation-name:fairBurstHoldSequence, fairDriftA, fairFlicker !important;
  animation-delay:36s,3.0s,.2s !important;
}
.frame-8{
  animation-name:fairBurstHoldSequence, fairDriftB, fairFlicker !important;
  animation-delay:42s,3.5s,.4s !important;
}
.photo-morph{
  background:radial-gradient(circle at 16% 0%, rgba(168,244,230,.04), transparent 16rem),
    linear-gradient(180deg, rgba(10,16,18,.84), rgba(6,9,10,.95));
}
.photo-lines{
  opacity:.18;
}
.photo-grain{
  opacity:.27;
}
@keyframes vhsRollTravel{
  0%{transform:translateY(-135%)}
  100%{transform:translateY(135%)}
}
@keyframes vhsRollWarp{
  0%,100%{transform:translateX(0)}
  20%{transform:translateX(-6px)}
  45%{transform:translateX(8px)}
  70%{transform:translateX(-4px)}
}
@keyframes phosphorDrift{
  0%,100%{transform:translate3d(0,0,0);opacity:.10}
  24%{transform:translate3d(1px,0,0);opacity:.14}
  52%{transform:translate3d(-1px,0,0);opacity:.08}
  78%{transform:translate3d(2px,0,0);opacity:.13}
}
@keyframes crawlShift{
  0%{transform:translateX(0)}
  100%{transform:translateX(12px)}
}
@keyframes mirrorFlutter{
  0%,100%{opacity:.04;transform:scaleX(-1) translateX(0)}
  35%{opacity:.08;transform:scaleX(-1) translateX(-6px)}
  75%{opacity:.05;transform:scaleX(-1) translateX(3px)}
}
@keyframes spiralFloat{
  0%{transform:rotate(0deg) scale(1);opacity:.05}
  50%{transform:rotate(14deg) scale(1.04);opacity:.085}
  100%{transform:rotate(28deg) scale(1.01);opacity:.05}
}
@keyframes scatterDrift{
  0%,100%{transform:translate3d(0,0,0);opacity:.10}
  33%{transform:translate3d(-5px,3px,0);opacity:.16}
  66%{transform:translate3d(5px,-2px,0);opacity:.12}
}
@keyframes bloomPulse{
  0%,100%{opacity:.13}
  50%{opacity:.20}
}
@keyframes decayBreath{
  0%,100%{filter:blur(0px);opacity:.10}
  50%{filter:blur(1.2px);opacity:.16}
}
@keyframes jitterBand{
  0%,100%{transform:translateX(0)}
  10%{transform:translateX(2px)}
  20%{transform:translateX(-1px)}
  30%{transform:translateX(5px)}
  40%{transform:translateX(-3px)}
  50%{transform:translateX(0)}
  60%{transform:translateX(2px)}
  70%{transform:translateX(-4px)}
  80%{transform:translateX(1px)}
  90%{transform:translateX(-1px)}
}
.photo-morph{
  isolation:isolate;
}
.photo-frame{
  image-rendering:auto;
}
.photo-bloom,
.photo-roll,
.photo-crawl,
.photo-phosphor,
.photo-mirror,
.photo-spiral,
.photo-scatter{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.photo-bloom{
  z-index:6;
  background:radial-gradient(circle at 18% 20%, rgba(219,245,239,.09), transparent 15rem),
    radial-gradient(circle at 72% 66%, rgba(149,203,198,.08), transparent 18rem),
    radial-gradient(circle at 50% 100%, rgba(255,239,195,.045), transparent 18rem);
  mix-blend-mode:screen;
  animation:bloomPulse 8.8s ease-in-out infinite, decayBreath 14s ease-in-out infinite;
}
.photo-roll{
  z-index:8;
  overflow:hidden;
  opacity:.30;
}
.photo-roll::before{
  content:"";
  position:absolute;
  left:-4%;
  right:-4%;
  top:0;
  height:24%;
  background:linear-gradient(180deg,
      rgba(235,250,245,.00) 0%,
      rgba(235,250,245,.05) 12%,
      rgba(235,250,245,.12) 48%,
      rgba(20,30,32,.09) 68%,
      rgba(235,250,245,.00) 100%);
  mix-blend-mode:screen;
  filter:blur(1.4px);
  animation:vhsRollTravel 14.5s linear infinite, vhsRollWarp 1.4s steps(3,end) infinite;
}
.photo-roll::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:58%;
  height:2px;
  background:linear-gradient(90deg, transparent, rgba(240,255,248,.30), transparent);
  opacity:.18;
  animation:jitterBand 6.4s steps(4,end) infinite;
}
.photo-crawl{
  z-index:7;
  mix-blend-mode:soft-light;
  opacity:.17;
  background:repeating-linear-gradient(90deg,
      rgba(255,255,255,.06) 0 1px,
      transparent 1px 4px),
    repeating-linear-gradient(0deg,
      rgba(255,255,255,.05) 0 1px,
      transparent 1px 6px),
    radial-gradient(circle at 20% 30%, rgba(255,255,255,.05) 0 .8px, transparent 1px);
  background-size:9px 100%, 100% 7px, 10px 10px;
  animation:crawlShift 1.2s linear infinite;
}
.photo-phosphor{
  z-index:5;
  inset:-1px;
  background:linear-gradient(90deg,
      rgba(104,208,208,.08) 0%,
      rgba(104,208,208,.00) 28%,
      rgba(232,150,166,.07) 65%,
      rgba(232,150,166,.00) 100%);
  mix-blend-mode:screen;
  filter:blur(1px);
  animation:phosphorDrift 5.5s ease-in-out infinite;
}
.photo-mirror{
  z-index:4;
  overflow:hidden;
  mask-image:linear-gradient(to left, rgba(0,0,0,.85), transparent 55%);
  opacity:.06;
}
.photo-mirror::before{
  content:"";
  position:absolute;
  inset:-4%;
  background:inherit;
  backdrop-filter:none;
  transform:scaleX(-1);
}
.photo-mirror{
  background:linear-gradient(90deg, rgba(255,255,255,.02), rgba(255,255,255,.00)),
    url("/assets/home_main/scene-03.webp") center/cover no-repeat;
  mix-blend-mode:screen;
  animation:mirrorFlutter 11.5s ease-in-out infinite;
}
.photo-spiral{
  z-index:6;
  inset:-8%;
  background:radial-gradient(circle at center, transparent 0 22%, rgba(255,255,255,.018) 22.2% 22.8%, transparent 23% 28%, rgba(255,255,255,.015) 28.2% 28.6%, transparent 28.8% 100%),
    conic-gradient(from 0deg at 50% 50%, rgba(170,220,214,.05), transparent 18%, rgba(219,191,142,.03) 36%, transparent 54%, rgba(170,220,214,.04) 72%, transparent 100%);
  mix-blend-mode:screen;
  filter:blur(.2px);
  mask-image:radial-gradient(circle at center, transparent 0 18%, rgba(0,0,0,.8) 42%, transparent 78%);
  animation:spiralFloat 22s linear infinite;
}
.photo-scatter{
  z-index:9;
  opacity:.12;
  mix-blend-mode:screen;
  background-image:radial-gradient(circle at 8% 22%, rgba(255,255,255,.18) 0 1px, transparent 1.1px),
    radial-gradient(circle at 28% 76%, rgba(168,244,230,.13) 0 1px, transparent 1.2px),
    radial-gradient(circle at 62% 42%, rgba(255,212,132,.12) 0 1px, transparent 1.1px),
    radial-gradient(circle at 88% 58%, rgba(255,255,255,.16) 0 1px, transparent 1.1px),
    radial-gradient(circle at 78% 12%, rgba(255,255,255,.10) 0 1px, transparent 1.2px);
  background-size:170px 130px, 220px 170px, 210px 160px, 240px 190px, 200px 180px;
  animation:scatterDrift 6.8s steps(3,end) infinite;
}
.photo-lines{
  opacity:.24;
  mix-blend-mode:screen;
}
.photo-lines::after{
  content:"";
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(180deg, rgba(255,255,255,.015) 0 1px, transparent 1px 3px);
  opacity:.25;
}
.photo-grain{
  opacity:.31;
  mix-blend-mode:soft-light;
}
@media (max-width:820px){
  .photo-bloom{
    opacity:.85;
  }
  .photo-roll{
    opacity:.24;
  }
  .photo-crawl{
    opacity:.12;
  }
  .photo-spiral{
    opacity:.75;
  }
  .photo-scatter{
    opacity:.10;
  }
}
.photo-frame{
  filter:saturate(.86) contrast(1.02) brightness(.82) sepia(.03) !important;
}
@keyframes fairFlicker{
  0%,100%{filter:saturate(.86) contrast(1.02) brightness(.82) sepia(.03)}
  18%{filter:saturate(.91) contrast(.99) brightness(.83) sepia(.02)}
  48%{filter:saturate(.80) contrast(1.06) brightness(.85) sepia(.02)}
  52%{filter:saturate(.93) contrast(.98) brightness(.80) sepia(.04)}
  78%{filter:saturate(.88) contrast(1.03) brightness(.84) sepia(.03)}
}
.photo-bloom{
  opacity:.95 !important;
}
.photo-roll{
  opacity:.46 !important;
}
.photo-roll::before{
  height:29% !important;
  background:linear-gradient(180deg,
      rgba(235,250,245,.00) 0%,
      rgba(235,250,245,.08) 10%,
      rgba(235,250,245,.18) 42%,
      rgba(96,130,132,.11) 62%,
      rgba(14,24,25,.12) 78%,
      rgba(235,250,245,.00) 100%) !important;
  filter:blur(1.9px) !important;
}
.photo-roll::after{
  opacity:.30 !important;
}
.photo-crawl{
  opacity:.28 !important;
  background:repeating-linear-gradient(90deg,
      rgba(255,255,255,.10) 0 1px,
      transparent 1px 4px),
    repeating-linear-gradient(0deg,
      rgba(255,255,255,.08) 0 1px,
      transparent 1px 6px),
    radial-gradient(circle at 20% 30%, rgba(255,255,255,.08) 0 .8px, transparent 1px) !important;
}
.photo-phosphor{
  opacity:.92;
  background:linear-gradient(90deg,
      rgba(94,214,216,.13) 0%,
      rgba(94,214,216,.01) 32%,
      rgba(246,112,150,.10) 64%,
      rgba(246,112,150,.00) 100%) !important;
  filter:blur(1.3px) !important;
}
.photo-mirror{
  opacity:.11 !important;
}
.photo-spiral{
  opacity:.95;
  filter:blur(.15px) !important;
  background:radial-gradient(circle at center, transparent 0 20%, rgba(255,255,255,.030) 20.2% 20.8%, transparent 21% 27%, rgba(255,255,255,.024) 27.2% 27.8%, transparent 28% 100%),
    conic-gradient(from 0deg at 50% 50%, rgba(170,220,214,.08), transparent 18%, rgba(219,191,142,.05) 36%, transparent 54%, rgba(170,220,214,.06) 72%, transparent 100%) !important;
}
.photo-scatter{
  opacity:.19 !important;
}
.photo-lines{
  opacity:.33 !important;
}
.photo-lines::after{
  opacity:.38 !important;
}
.photo-grain{
  opacity:.38 !important;
}
.photo-morph{
  background:radial-gradient(circle at 16% 0%, rgba(168,244,230,.06), transparent 16rem),
    radial-gradient(circle at 82% 78%, rgba(213,179,109,.045), transparent 18rem),
    linear-gradient(180deg, rgba(10,16,18,.82), rgba(6,9,10,.94)) !important;
}
@media (max-width:820px){
  .photo-roll{
    opacity:.36 !important;
  }
  .photo-crawl{
    opacity:.22 !important;
  }
  .photo-scatter{
    opacity:.15 !important;
  }
  .photo-lines{
    opacity:.27 !important;
  }
  .photo-grain{
    opacity:.31 !important;
  }
}
body{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
a,button,.nav-product-trigger,.nav-panel a{
  -webkit-tap-highlight-color:transparent;
}
.nav-inner{
  min-height:56px;
}
.home-hero{
  min-height:calc(100vh - 56px);
  min-height:calc(100dvh - 56px);
  padding:22px 0 40px;
}
.logo-stage{
  margin-top:clamp(8px,2vh,22px);
  margin-bottom:18px;
}
.home-tagline{
  margin-top:20px;
}
.nav-inner,
footer .wrap{
  padding-left:env(safe-area-inset-left);
  padding-right:env(safe-area-inset-right);
}
.photo-frame,
.wordmark,
.wordmark-glow,
.logo-colour-field{
  will-change:transform,opacity;
  transform:translateZ(0);
  backface-visibility:hidden;
}
@media (prefers-reduced-motion:no-preference){
  .home-core > *{
    animation:heroRise .85s cubic-bezier(.2,.8,.2,1) both;
  }
  .logo-stage{
    animation-delay:.04s;
  }
  .photo-morph{
    animation-delay:.15s;
  }
  .home-tagline{
    animation-delay:.27s;
  }
}
@keyframes heroRise{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:translateY(0)}
}
.nav-product.is-open .nav-panel{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.nav-product.is-open .nav-product-trigger{
  color:var(--ink);
  background:rgba(255,255,255,.07);
}
@media (max-width:620px){
  .nav-product-trigger{
    padding:11px 15px;
  }
  .nav-products{position:relative}   /* anchor panels to the pill (screen-right), not each trigger */
  .nav-product{position:static}
  .nav-panel{
    left:auto;
    right:0;
    top:100%;
    min-width:min(290px,calc(100vw - 24px));
  }
  .nav{
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    background:rgba(4,9,10,.93);
  }
}
@media (max-width:620px),(hover:none) and (pointer:coarse){
  .photo-spiral,
  .photo-mirror,
  .photo-crawl,
  .photo-phosphor,
  .photo-scatter{
    display:none;
  }
  body:after{
    animation:none;
  }
}
@media (min-width:821px) and (max-height:760px){
  .home-hero{
    min-height:auto;
    padding:30px 0 44px;
  }
  .logo-stage{
    min-height:clamp(150px,18vw,210px);
  }
}