/* ============================================================
   PropertyMotion — design system
   Dark cinematic theme · electric-blue accent · film signature
   ============================================================ */

:root{
  --bg:#06070B;
  --bg2:#0A0C12;
  --ink:#F3F5F9;
  --muted:#8B90A0;
  --line:rgba(255,255,255,.08);
  --accent:#3B6EFF;      /* primary — electric blue */
  --accent2:#7A5CFF;     /* secondary — violet */
  --accent3:#00C2A8;     /* NEW — teal, from the logo */
  --accent4:#FF8A3D;     /* NEW — warm amber for highlights */
  --accent5:#FF5C9A;     /* NEW — pink for variety */
  --glow:rgba(59,110,255,.35);
  --radius:22px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* Custom scrollbar — slim + dark so it matches the theme instead of the
   pale wide OS default. Chrome/Edge/Safari use ::-webkit-scrollbar; Firefox
   uses scrollbar-width/-color. */
html{scrollbar-width:thin;scrollbar-color:#2a2f3d var(--bg)}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{
  background:#242938;border:3px solid var(--bg);border-radius:999px;
}
::-webkit-scrollbar-thumb:hover{background:#333a4d}

/* Brand logo mark (nav + footer) --------------------------- */
.pm-logo-mark{width:34px;height:34px;flex:none;display:block;
  filter:drop-shadow(0 0 4px rgba(59,110,255,.28));
  transition:transform .4s var(--ease),filter .4s}
a:hover .pm-logo-mark{transform:scale(1.06);filter:drop-shadow(0 0 8px rgba(0,194,168,.4))}

/* Pull the nav brand left so the logo sits close to the page content edge
   (where the hero headline starts) while still breathing inside the nav pill
   once its background appears on scroll. */
.pm-nav-brand{margin-left:-.5rem}
@media (min-width:768px){.pm-nav-brand{margin-left:-.65rem}}

/* Language switcher */
.pm-lang{display:inline-flex;align-items:center;gap:1px;padding:2px;border-radius:999px;
  background:rgba(255,255,255,.05);border:1px solid var(--line)}
.pm-lang-opt{font-family:"JetBrains Mono",monospace;font-size:11px;font-weight:500;letter-spacing:.06em;
  padding:.3rem .55rem;border-radius:999px;color:var(--muted);transition:color .2s,background .2s;line-height:1}
.pm-lang-opt:hover{color:var(--ink)}
.pm-lang-opt.is-active{color:#fff;background:linear-gradient(90deg,var(--accent),var(--accent2))}

*{box-sizing:border-box}
html,body{margin:0}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:"Satoshi",system-ui,sans-serif;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

/* Ambient light + film grain layered behind everything */
body::before{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(60rem 40rem at 78% -8%, rgba(59,110,255,.16), transparent 60%),
    radial-gradient(48rem 40rem at 6% 12%, rgba(122,92,255,.12), transparent 62%),
    linear-gradient(180deg,#06070B 0%,#080910 55%,#06070B 100%);
}
body::after{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

::selection{background:rgba(59,110,255,.3)}

/* Typography helpers ---------------------------------------- */
.font-display{font-family:"Clash Display",sans-serif}
.font-mono{font-family:"JetBrains Mono",monospace}

.pm-slate{
  font-family:"JetBrains Mono",monospace;
  font-size:12px;letter-spacing:.28em;text-transform:uppercase;
  color:var(--muted);display:inline-flex;align-items:center;gap:.6rem;
}
.pm-slate::before{
  content:"";width:22px;height:1px;background:var(--accent);
  box-shadow:0 0 10px var(--glow);display:inline-block;
}

/* Long-form legal / policy text */
.pm-legal h2{font-family:"Clash Display",sans-serif;font-weight:600;font-size:clamp(19px,2.4vw,23px);color:var(--ink);margin-bottom:.6rem}
.pm-legal p{color:#AEB3C2;font-size:16px;line-height:1.75}
.pm-legal a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.pm-legal a:hover{color:#6f92ff}

.pm-gradient-text{
  background:linear-gradient(120deg,#fff 0%,#dfe6ff 55%,#9db4ff 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* Hero text legibility over video: shadow keeps headline readable on any
   frame; the sub-copy is lifted from muted-grey to near-white. */
.pm-hero h1{text-shadow:0 2px 24px rgba(0,0,0,.55),0 1px 3px rgba(0,0,0,.4)}
.pm-hero .pm-gradient-text{filter:drop-shadow(0 2px 18px rgba(0,0,0,.45))}
.pm-hero-copy{color:#EAECF3!important;text-shadow:0 1px 14px rgba(0,0,0,.6),0 1px 2px rgba(0,0,0,.5)}
.pm-hud{text-shadow:0 1px 12px rgba(0,0,0,.75),0 1px 2px rgba(0,0,0,.6)}

/* Skip link ------------------------------------------------- */
.pm-skip{
  position:fixed;left:1rem;top:-4rem;z-index:100;background:var(--accent);
  color:#fff;padding:.6rem 1rem;border-radius:10px;transition:top .2s;
}
.pm-skip:focus{top:1rem}

/* Buttons --------------------------------------------------- */
.pm-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-weight:500;font-size:15px;border-radius:999px;padding:.85rem 1.5rem;
  transition:transform .25s var(--ease),box-shadow .3s var(--ease),background .25s;
  cursor:pointer;border:1px solid transparent;white-space:nowrap;
}
.pm-btn-sm{padding:.6rem 1.1rem;font-size:14px}
.pm-btn-primary{
  background:linear-gradient(120deg,var(--accent),var(--accent2));
  color:#fff;box-shadow:0 8px 30px -8px var(--glow);
}
.pm-btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 40px -10px var(--glow)}
.pm-btn-ghost{background:rgba(255,255,255,.04);color:var(--ink);border-color:var(--line)}
.pm-btn-ghost:hover{background:rgba(255,255,255,.08);transform:translateY(-2px)}
.pm-btn svg{width:18px;height:18px}
.pm-btn-primary:focus-visible,.pm-btn-ghost:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* Glass + cards --------------------------------------------- */
.pm-glass{
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));
  border:1px solid var(--line);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 30px 60px -30px rgba(0,0,0,.7);
}
.pm-card{
  position:relative;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.015));
  border:1px solid var(--line);border-radius:var(--radius);
  transition:transform .4s var(--ease),border-color .4s,box-shadow .4s;
  overflow:hidden;
}
.pm-card::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(30rem 20rem at var(--mx,50%) var(--my,0%),rgba(59,110,255,.12),transparent 40%);
  opacity:0;transition:opacity .4s;
}
.pm-card:hover{transform:translateY(-6px);border-color:rgba(59,110,255,.35);
  box-shadow:0 30px 60px -30px rgba(0,0,0,.8),0 0 0 1px rgba(59,110,255,.15)}
.pm-card:hover::after{opacity:1}

.pm-icon-badge{
  width:52px;height:52px;border-radius:15px;display:grid;place-items:center;
  color:var(--accent);background:rgba(59,110,255,.1);border:1px solid rgba(59,110,255,.25);
  transition:transform .4s var(--ease),box-shadow .4s;
}
/* Colour-cycled badges add life across grids of cards */
.pm-badge-1{color:var(--accent); background:rgba(59,110,255,.10); border-color:rgba(59,110,255,.28)}
.pm-badge-2{color:var(--accent3);background:rgba(0,194,168,.10);  border-color:rgba(0,194,168,.30)}
.pm-badge-3{color:var(--accent2);background:rgba(122,92,255,.10); border-color:rgba(122,92,255,.30)}
.pm-badge-4{color:var(--accent4);background:rgba(255,138,61,.10); border-color:rgba(255,138,61,.30)}
.pm-badge-5{color:var(--accent5);background:rgba(255,92,154,.10); border-color:rgba(255,92,154,.30)}
.pm-card:hover .pm-icon-badge{transform:translateY(-2px)}

/* "Most popular" pill — centered on the card's top edge, never overlaps text */
.pm-pop-badge{
  position:absolute;top:0;left:50%;transform:translate(-50%,-50%);
  padding:.3rem .8rem;border-radius:999px;white-space:nowrap;z-index:3;
  font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:#fff;background:linear-gradient(90deg,var(--accent),var(--accent2));
  box-shadow:0 6px 20px -6px var(--glow);
}

/* Nav ------------------------------------------------------- */
.pm-nav-shell{transition:background .3s,border-color .3s,box-shadow .3s;border:1px solid transparent}
#pm-nav.is-scrolled .pm-nav-shell{
  background:linear-gradient(180deg,rgba(12,14,20,.8),rgba(10,12,18,.65));
  border-color:var(--line);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  box-shadow:0 20px 40px -28px rgba(0,0,0,.9);
}
.pm-logo-dot{
  width:11px;height:11px;border-radius:50%;background:var(--accent);
  box-shadow:0 0 0 4px rgba(59,110,255,.18),0 0 14px var(--glow);
  animation:pm-rec 2.4s var(--ease) infinite;
}
@keyframes pm-rec{0%,100%{opacity:1}50%{opacity:.35}}

.pm-icon-btn{
  width:42px;height:42px;border-radius:12px;display:grid;place-items:center;
  color:var(--ink);background:rgba(255,255,255,.04);border:1px solid var(--line);
  transition:background .25s,transform .25s;
}

/* --- Responsive nav controls (independent of compiled Tailwind) --- */
/* Desktop-only "Request a Quote" button; mobile-only burger. These use
   !important so .pm-btn's display can never make the CTA reappear on phones. */
.pm-nav-cta{display:inline-flex!important}
.pm-burger-btn{display:none!important}
@media (max-width:767px){
  .pm-nav-cta{display:none!important}   /* hide CTA on mobile -> no logo overlap */
  .pm-burger-btn{display:grid!important} /* show burger on mobile */
}
.pm-icon-btn:hover{background:rgba(255,255,255,.09)}
.pm-burger-lines{display:block;width:18px;position:relative}
.pm-burger-lines span{display:block;height:1.6px;background:currentColor;border-radius:2px;transition:transform .3s,opacity .3s}
.pm-burger-lines span:first-child{margin-bottom:5px}
#pm-burger.is-open .pm-burger-lines span:first-child{transform:translateY(3.3px) rotate(45deg)}
#pm-burger.is-open .pm-burger-lines span:last-child{transform:translateY(-3.3px) rotate(-45deg)}

.pm-mobile-scrim{background:rgba(4,5,9,.6);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.pm-mobile-panel{
  background:linear-gradient(180deg,rgba(16,18,26,.96),rgba(10,12,18,.96));
  border:1px solid var(--line);box-shadow:0 30px 60px -20px rgba(0,0,0,.8);
}

/* Loader ---------------------------------------------------- */
#pm-loader{
  position:fixed;inset:0;z-index:200;background:#06070B;display:grid;place-items:center;
  transition:transform .8s var(--ease),opacity .5s;
}
#pm-loader.is-done{transform:translateY(-100%)}
.pm-loader-inner{display:flex;flex-direction:column;align-items:center;gap:1.2rem}
.pm-loader-logo{display:flex;flex-direction:column;align-items:center;gap:.9rem;animation:pm-logo-in .6s var(--ease) both}
.pm-loader-mark-img{width:60px;height:60px;display:block;filter:drop-shadow(0 0 18px rgba(59,110,255,.45))}
@keyframes pm-logo-in{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}
.pm-loader-mark{font-size:clamp(22px,4vw,30px);font-weight:600;letter-spacing:-.01em}
.pm-loader-bar{width:180px;height:2px;background:rgba(255,255,255,.1);border-radius:2px;overflow:hidden}
.pm-loader-bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent2));animation:pm-load 1.1s var(--ease) forwards}
@keyframes pm-load{to{width:100%}}

/* Hero (cinematic frame) ------------------------------------ */
.pm-hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden}
.pm-hero-media{position:absolute;inset:0;z-index:0}
.pm-hero-media video,.pm-hero-media img{width:100%;height:100%;object-fit:cover;opacity:1;
  filter:brightness(1.18) contrast(1.05) saturate(1.08)}
/* Two light overlays: a left-to-right wash so the headline stays readable,
   and a soft bottom fade into the page. The video stays clearly visible. */
.pm-hero-media::after{content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(6,7,11,.72) 0%,rgba(6,7,11,.45) 35%,rgba(6,7,11,.12) 65%,rgba(6,7,11,.05) 100%),
    linear-gradient(180deg,rgba(6,7,11,.15) 0%,rgba(6,7,11,.10) 55%,var(--bg) 100%)}
.pm-letterbox{position:absolute;left:0;right:0;height:8vh;max-height:70px;background:#06070B;z-index:5;transition:transform 1s var(--ease) .3s}
.pm-letterbox.top{top:0;transform:translateY(-100%)}
.pm-letterbox.bot{bottom:0;transform:translateY(100%)}
body.pm-ready .pm-letterbox.top{transform:translateY(0)}
body.pm-ready .pm-letterbox.bot{transform:translateY(0)}
.pm-scanline{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:.4;
  background:repeating-linear-gradient(180deg,transparent 0 3px,rgba(0,0,0,.25) 3px 4px)}
.pm-hud{font-family:"JetBrains Mono",monospace;font-size:12.5px;letter-spacing:.1em;color:#fff;font-weight:500}
.pm-hud-chip{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .75rem;border-radius:8px;
  background:rgba(6,7,11,.5);border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  white-space:nowrap}
.pm-hud .dot{color:var(--accent);animation:pm-rec 1.4s infinite}

.pm-play{
  width:74px;height:74px;border-radius:50%;display:grid;place-items:center;color:#fff;
  background:linear-gradient(120deg,var(--accent),var(--accent2));border:none;cursor:pointer;
  box-shadow:0 0 0 0 var(--glow);animation:pm-pulse 2.6s var(--ease) infinite;transition:transform .3s}
.pm-play:hover{transform:scale(1.06)}
.pm-play svg{width:26px;height:26px;margin-left:3px}
@keyframes pm-pulse{0%{box-shadow:0 0 0 0 rgba(59,110,255,.4)}70%{box-shadow:0 0 0 22px rgba(59,110,255,0)}100%{box-shadow:0 0 0 0 rgba(59,110,255,0)}}

/* Portfolio ------------------------------------------------- */
.pm-poster{position:relative;aspect-ratio:16/10;border-radius:var(--radius);overflow:hidden;isolation:isolate}
.pm-poster::before{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(6,7,11,0) 40%,rgba(6,7,11,.85) 100%)}
.pm-poster .grade{position:absolute;inset:0;transition:transform .7s var(--ease),filter .5s}
.pm-poster:hover .grade{transform:scale(1.07)}
/* Cinematic colour grades used as poster placeholders */
.grad-a{background:radial-gradient(120% 90% at 20% 10%,#2b3a7a,#0a0c18 70%),linear-gradient(120deg,#1a2a6b,#0a0c18)}
.grad-b{background:radial-gradient(120% 90% at 80% 15%,#0f5d6b,#07101a 70%),linear-gradient(120deg,#0d3b52,#07101a)}
.grad-c{background:radial-gradient(120% 90% at 30% 90%,#5a2f7a,#0c0a18 70%),linear-gradient(120deg,#3a1f6b,#0c0a18)}
.grad-d{background:radial-gradient(120% 90% at 70% 10%,#7a4a2f,#180f0a 70%),linear-gradient(120deg,#6b3a1f,#180f0a)}
.grad-e{background:radial-gradient(120% 90% at 25% 20%,#2f7a63,#0a1814 70%),linear-gradient(120deg,#1f6b52,#0a1814)}
.grad-f{background:radial-gradient(120% 90% at 75% 80%,#7a2f4a,#180a0f 70%),linear-gradient(120deg,#6b1f3a,#180a0f)}

.pm-scrub{position:absolute;left:1rem;right:1rem;bottom:1rem;z-index:2;height:3px;border-radius:3px;background:rgba(255,255,255,.2);overflow:hidden;opacity:0;transition:opacity .4s}
.pm-scrub span{position:absolute;inset:0;width:30%;background:var(--accent);border-radius:3px;transition:width .1s}
.pm-poster-wrap:hover .pm-scrub{opacity:1}
.pm-poster-wrap:hover .pm-scrub span{animation:pm-scrub 2.4s linear infinite}
@keyframes pm-scrub{0%{width:8%}100%{width:100%}}

.pm-play-mini{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);color:#fff;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  opacity:0;transform:scale(.85);transition:opacity .35s,transform .35s}
.pm-poster-wrap:hover .pm-play-mini{opacity:1;transform:scale(1)}

.pm-chip{padding:.5rem 1.1rem;border-radius:999px;font-size:13px;color:var(--muted);
  border:1px solid var(--line);background:rgba(255,255,255,.03);cursor:pointer;transition:all .25s}
.pm-chip:hover{color:var(--ink)}
.pm-chip.is-active{color:#fff;background:linear-gradient(120deg,var(--accent),var(--accent2));border-color:transparent}

/* Modal ----------------------------------------------------- */
#pm-modal{position:fixed;inset:0;z-index:120;display:none;place-items:center;padding:1.25rem}
#pm-modal.is-open{display:grid}
.pm-modal-scrim{position:absolute;inset:0;background:rgba(4,5,9,.8);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.pm-modal-box{position:relative;width:min(920px,100%);border-radius:var(--radius)}

/* Stats ----------------------------------------------------- */
.pm-stat-val{font-family:"Clash Display",sans-serif;font-weight:600;font-size:clamp(38px,6vw,58px);line-height:1;
  background:linear-gradient(120deg,#fff,var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}
/* Each stat gets its own colour for a livelier band */
.pm-stat-val.s1{background:linear-gradient(120deg,#fff,var(--accent)); -webkit-background-clip:text;background-clip:text}
.pm-stat-val.s2{background:linear-gradient(120deg,#fff,var(--accent3));-webkit-background-clip:text;background-clip:text}
.pm-stat-val.s3{background:linear-gradient(120deg,#fff,var(--accent4));-webkit-background-clip:text;background-clip:text}
.pm-stat-val.s4{background:linear-gradient(120deg,#fff,var(--accent5));-webkit-background-clip:text;background-clip:text}

/* FAQ ------------------------------------------------------- */
.pm-faq{border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:border-color .3s}
.pm-faq.is-open{border-color:rgba(59,110,255,.35)}
.pm-faq button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.25rem 1.4rem;text-align:left;font-size:16px;color:var(--ink);background:none;border:none;cursor:pointer}
.pm-faq .plus{flex:none;width:22px;height:22px;position:relative;transition:transform .3s}
.pm-faq .plus::before,.pm-faq .plus::after{content:"";position:absolute;background:var(--accent);border-radius:2px}
.pm-faq .plus::before{left:0;right:0;top:50%;height:1.6px;transform:translateY(-50%)}
.pm-faq .plus::after{top:0;bottom:0;left:50%;width:1.6px;transform:translateX(-50%);transition:transform .3s}
.pm-faq.is-open .plus::after{transform:translateX(-50%) scaleY(0)}
.pm-faq .ans{max-height:0;overflow:hidden;transition:max-height .35s var(--ease)}
.pm-faq .ans p{padding:0 1.4rem 1.3rem;color:var(--muted);line-height:1.7}

/* Forms ----------------------------------------------------- */
.pm-field{display:flex;flex-direction:column;gap:.5rem}
.pm-field label{font-size:13px;color:var(--muted);font-weight:500}
.pm-input,.pm-textarea,.pm-select{
  width:100%;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:14px;
  padding:.9rem 1rem;color:var(--ink);font-size:15px;font-family:inherit;transition:border-color .25s,box-shadow .25s,background .25s}
.pm-input::placeholder,.pm-textarea::placeholder{color:#585d6b}
.pm-input:focus,.pm-textarea:focus,.pm-select:focus{outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(59,110,255,.18);background:rgba(255,255,255,.05)}
.pm-textarea{resize:vertical;min-height:140px}
.pm-hp{position:absolute;left:-9999px;opacity:0;pointer-events:none}

.pm-note{border-radius:14px;padding:.9rem 1.1rem;font-size:14px;display:none}
.pm-note.ok{display:block;background:rgba(59,110,255,.1);border:1px solid rgba(59,110,255,.35);color:#cdd8ff}
.pm-note.err{display:block;background:rgba(255,90,90,.08);border:1px solid rgba(255,90,90,.3);color:#ffc9c9}

/* Social / footer ------------------------------------------- */
.pm-social{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:var(--muted);
  border:1px solid var(--line);background:rgba(255,255,255,.03);transition:all .25s}
.pm-social:hover{color:#fff;border-color:rgba(59,110,255,.4);background:rgba(59,110,255,.1)}

/* Back to top / cookie fade --------------------------------- */
#pm-top{transition:opacity .3s,transform .3s}
#pm-top.is-visible{opacity:1;pointer-events:auto}
#pm-cookie{transition:opacity .4s,transform .4s}

/* Reveal on scroll ------------------------------------------ */
.pm-reveal{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.pm-reveal.is-visible{opacity:1;transform:none}

/* Divider marquee ------------------------------------------- */
.pm-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.pm-marquee-track{display:flex;gap:4rem;width:max-content;animation:pm-marquee 26s linear infinite}
@keyframes pm-marquee{to{transform:translateX(-50%)}}
.pm-marquee-track span{font-family:"JetBrains Mono",monospace;font-size:13px;letter-spacing:.2em;color:var(--muted);text-transform:uppercase;white-space:nowrap}

/* Reduced motion -------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .pm-reveal{opacity:1;transform:none}
  #pm-loader{display:none}
  .pm-letterbox{display:none}
}