:root{
  --bg:#040814;
  --bg-2:#091120;
  --panel:rgba(11,18,34,.78);
  --panel-strong:rgba(12,19,38,.94);
  --line:rgba(146,205,255,.12);
  --line-strong:rgba(255,255,255,.10);
  --text:#eef5ff;
  --muted:#9fb1c8;
  --gold:#f6c056;
  --gold-2:#ff9542;
  --blue:#6dd9ff;
  --blue-2:#8ab7ff;
  --blue-3:#6170ff;
  --success:#76e2b9;
  --shadow:0 22px 60px rgba(0,0,0,.28);
  --shadow-soft:0 12px 30px rgba(0,0,0,.18);
  --radius:26px;
  --radius-sm:18px;
  --container:1240px;
  --ease:cubic-bezier(.2,.8,.2,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 12% 8%, rgba(246,192,86,.09), transparent 24%),
    radial-gradient(circle at 88% 10%, rgba(109,217,255,.10), transparent 26%),
    radial-gradient(circle at 50% 110%, rgba(97,112,255,.06), transparent 34%),
    linear-gradient(180deg,#02050d 0%,#07101d 42%,#040814 100%);
  min-height:100vh;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(to right, rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size:36px 36px;
  mask-image:radial-gradient(circle at center, black 35%, transparent 88%);
  opacity:.2;
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
button,input,textarea{font:inherit}

.container{width:min(var(--container),calc(100% - 36px));margin:0 auto}

.site-header{
  position:sticky;
  top:0;
  z-index:70;
  background:rgba(4,8,20,.78);
  backdrop-filter:blur(14px) saturate(125%);
  border-bottom:1px solid rgba(255,255,255,.05);
}
.navbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:84px;
}
.brand{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}
.brand img{
  width:54px;
  height:54px;
  border-radius:16px;
  object-fit:cover;
  box-shadow:0 14px 30px rgba(0,0,0,.24), inset 0 0 0 1px rgba(255,255,255,.08);
}
.brand-title{
  font-weight:800;
  letter-spacing:.07em;
}
.brand-sub{
  display:block;
  font-size:12px;
  color:var(--muted);
  letter-spacing:.02em;
  margin-top:3px;
}

.nav-shell{
  display:flex;
  align-items:center;
  gap:10px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07);
  border-radius:999px;
  padding:6px;
}
.nav-links{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
.nav-links a{
  position:relative;
  padding:12px 16px;
  border-radius:999px;
  color:#d7e6ff;
  font-size:14px;
  font-weight:500;
  transition:
    transform .22s var(--ease),
    background .22s var(--ease),
    border-color .22s var(--ease),
    color .22s var(--ease),
    box-shadow .22s var(--ease);
}
.nav-links a::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  opacity:0;
  background:linear-gradient(135deg, rgba(246,192,86,.12), rgba(109,217,255,.10));
  transition:opacity .22s var(--ease);
}
.nav-links a span{
  position:relative;
  z-index:1;
}
.nav-links a:hover,
.nav-links a.active,
.nav-links a:focus-visible{
  transform:translateY(-1px);
  color:#fff;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}
.nav-links a:hover::after,
.nav-links a.active::after,
.nav-links a:focus-visible::after{
  opacity:1;
}

.menu-toggle{
  display:none;
  width:46px;
  height:46px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.09);
  color:#fff;
  background:rgba(255,255,255,.04);
}

main{position:relative;z-index:1}
.section{padding:34px 0}
.section-lg{padding:56px 0}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:9px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.08);
  color:#c8d7ef;
  font-size:13px;
  font-weight:600;
  letter-spacing:.03em;
  text-transform:uppercase;
}
.eyebrow::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--gold),var(--blue));
}

h1,h2,h3,h4,p{margin:0}
h1{
  font-size:clamp(40px,6vw,78px);
  line-height:.98;
  letter-spacing:-.055em;
}
h2{
  font-size:clamp(28px,4vw,48px);
  line-height:1.04;
  letter-spacing:-.04em;
}
h3{
  font-size:clamp(21px,2.2vw,28px);
  line-height:1.15;
  letter-spacing:-.02em;
}
p{
  line-height:1.75;
  color:#d8e4f6;
}
ul{
  margin:0;
  padding-left:20px;
}
li{
  line-height:1.7;
  color:#d8e4f6;
}
.small{
  font-size:13px;
  color:var(--muted);
}
.muted{
  color:var(--muted);
}
.gradient-text{
  background:linear-gradient(90deg,var(--gold),#ffe28d 26%,var(--blue) 66%,var(--blue-2));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.card{
  position:relative;
  background:linear-gradient(180deg, rgba(14,22,43,.88), rgba(8,13,28,.88));
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
  transition:
    border-color .25s var(--ease),
    transform .25s var(--ease),
    box-shadow .25s var(--ease),
    background .25s var(--ease);
}
.card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.045), transparent 26%);
  opacity:.55;
}
.card:hover{
  border-color:rgba(255,255,255,.16);
}
.card-pad{padding:28px}

.hero{
  padding:56px 0 24px;
}
.hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.18fr) minmax(360px,.82fr);
  gap:26px;
  align-items:stretch;
}
.hero-copy{
  padding:34px;
}
.hero-copy h1{
  margin-top:16px;
}
.hero-copy .lead{
  margin-top:20px;
  font-size:17px;
  max-width:780px;
  color:#dce7f7;
}
.hero-copy .hero-actions{
  margin-top:26px;
}
.hero-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin-top:26px;
}
.hero-stat{
  padding:18px;
  border-radius:20px;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.07);
}
.hero-stat strong{
  display:block;
  font-size:28px;
  margin-bottom:8px;
}
.hero-visual{
  min-height:100%;
  padding:24px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:20px;
}
.logo-frame{
  position:relative;
  padding:28px;
  border-radius:28px;
  background:
    radial-gradient(circle at 20% 20%, rgba(246,192,86,.10), transparent 30%),
    radial-gradient(circle at 80% 10%, rgba(109,217,255,.10), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
  min-height:330px;
  display:grid;
  place-items:center;
}
.logo-frame img{
  width:min(100%, 420px);
  border-radius:26px;
  box-shadow:0 20px 48px rgba(0,0,0,.30);
}
.floating-note{
  position:absolute;
  padding:12px 14px;
  border-radius:18px;
  background:rgba(6,10,22,.78);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(12px);
  font-size:13px;
  color:#dce9fa;
}
.note-left{left:18px;bottom:18px}
.note-right{right:18px;top:18px}

.visual-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.mini-panel{
  border-radius:18px;
  padding:14px;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.07);
}
.mini-panel strong{
  display:block;
  font-size:14px;
  margin-bottom:8px;
}
.mini-bars{
  display:flex;
  gap:8px;
  align-items:flex-end;
  height:44px;
}
.mini-bars span{
  flex:1;
  border-radius:12px 12px 4px 4px;
  background:linear-gradient(180deg, rgba(246,192,86,.88), rgba(109,217,255,.88));
  opacity:.78;
}
.mini-bars span:nth-child(1){height:38%}
.mini-bars span:nth-child(2){height:68%}
.mini-bars span:nth-child(3){height:100%}

.hero-actions,
.button-row,
.store-badges,
.inline-list{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.btn{
  --btn-bg:rgba(255,255,255,.05);
  --btn-line:rgba(255,255,255,.1);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:54px;
  padding:0 20px;
  border-radius:18px;
  border:1px solid var(--btn-line);
  background:var(--btn-bg);
  color:#fff;
  transition:
    transform .22s var(--ease),
    box-shadow .22s var(--ease),
    border-color .22s var(--ease),
    background .22s var(--ease),
    opacity .22s var(--ease);
}
.btn:hover,
.btn:focus-visible{
  transform:translateY(-1px);
  box-shadow:0 10px 20px rgba(0,0,0,.20);
}
.btn-primary{
  --btn-bg:linear-gradient(90deg,#ffd56f,#f2ae49 42%,#8de7ff);
  color:#05101f;
  border-color:transparent;
  font-weight:700;
}
.btn-secondary{
  --btn-bg:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
}
.btn-ghost{
  --btn-bg:transparent;
}
.btn-store{
  min-height:58px;
  padding:0 18px;
  justify-content:flex-start;
}
.btn-store em{
  font-style:normal;
  font-size:12px;
  color:#b6c7df;
}
.btn-store strong{
  display:block;
}
.btn.disabled{
  pointer-events:none;
  opacity:.55;
}

.store-inner{
  display:flex;
  align-items:center;
  gap:12px;
}
.store-icon{
  font-size:22px;
  width:40px;
  height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  background:rgba(255,255,255,.08);
  flex-shrink:0;
}

.section-head{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:end;
  margin-bottom:20px;
}
.section-head p{
  max-width:680px;
}

.grid-3,
.feature-grid,
.info-grid,
.legal-grid,
.footer-grid,
.timeline,
.app-grid,
.showcase-details,
.shot-grid,
.capsules{
  display:grid;
  gap:18px;
}

.feature-grid{
  grid-template-columns:repeat(3,1fr);
}
.feature-card,
.section-card,
.info-card,
.legal-link-card,
.shot,
.timeline-step,
.detail-card,
.showcase-card{
  padding:24px;
}
.feature-card h3,
.showcase-card h3,
.detail-card h3,
.timeline-step h3{
  margin:14px 0 10px;
}
.icon-chip{
  width:46px;
  height:46px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, rgba(246,192,86,.14), rgba(109,217,255,.14));
  border:1px solid rgba(255,255,255,.08);
  font-weight:800;
}

.app-grid{
  grid-template-columns:repeat(2,1fr);
}
.showcase-card{
  display:flex;
  flex-direction:column;
  gap:14px;
  min-height:290px;
}
.showcase-card:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.16);
  box-shadow:0 16px 36px rgba(0,0,0,.22);
}
.app-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  width:max-content;
  padding:8px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.pill-stuckmap{
  background:rgba(255,142,82,.12);
  color:#ffb07e;
  border:1px solid rgba(255,142,82,.25);
}
.pill-pawwise{
  background:rgba(135,124,255,.12);
  color:#c8c1ff;
  border:1px solid rgba(135,124,255,.22);
}
.pill-subhawk{
  background:rgba(100,220,170,.12);
  color:#9ff3ce;
  border:1px solid rgba(100,220,170,.22);
}
.pill-vasttrail{
  background:rgba(102,205,255,.12);
  color:#9ce9ff;
  border:1px solid rgba(102,205,255,.22);
}

.showcase-meta{
  margin-top:auto;
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
  color:var(--muted);
  font-size:14px;
}
.arrow-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.arrow-link::after{
  content:"↗";
  font-size:16px;
}

.cta-banner{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:18px;
  padding:28px 30px;
}
.cta-banner h3{
  margin:12px 0 10px;
}

.site-footer{
  padding:28px 0 46px;
  margin-top:24px;
  border-top:1px solid rgba(255,255,255,.05);
  background:linear-gradient(180deg, rgba(255,255,255,.01), transparent);
}
.footer-grid{
  grid-template-columns:1.2fr .8fr .9fr;
  align-items:start;
}
.footer-links{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:12px;
}
.footer-links a{
  color:#d6e4fa;
}
.footer-links a:hover{
  color:#fff;
}
.footer-base{
  margin-top:26px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.06);
  display:flex;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:13px;
}

.page-hero{
  padding:28px 0 8px;
}
.page-hero-wrap{
  padding:28px 30px;
  display:grid;
  gap:20px;
  grid-template-columns:1.2fr .8fr;
}
.badge-stack{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.text-stack > * + *{
  margin-top:14px;
}

.contact-grid,
.about-grid,
.app-layout{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);
  gap:22px;
}
.contact-card ul,
.legal-doc ul{
  padding-left:18px;
}
.contact-card li,
.legal-doc li{
  margin-bottom:10px;
  color:#d8e4f6;
}

.info-card,
.contact-card,
.legal-card,
.app-hero,
.side-panel,
.feature-card,
.showcase-card,
.timeline-step,
.detail-card,
.shot{
  position:relative;
}
.panel-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.kicker{
  font-size:13px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.05em;
}
.notice{
  margin-top:18px;
  padding:16px 18px;
  border-radius:18px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07);
  color:#dbe7f8;
}

.timeline{
  grid-template-columns:repeat(3,1fr);
}
.timeline-step{
  min-height:100%;
}
.step-no{
  width:36px;
  height:36px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, rgba(246,192,86,.15), rgba(109,217,255,.15));
  border:1px solid rgba(255,255,255,.08);
  font-weight:800;
}

.app-page{
  --accent:var(--blue);
  --accent-soft:rgba(109,217,255,.12);
}
.app-theme-stuckmap{--accent:#ff8b5f;--accent-soft:rgba(255,139,95,.14)}
.app-theme-pawwise{--accent:#9b8fff;--accent-soft:rgba(155,143,255,.14)}
.app-theme-subhawk{--accent:#76e2b9;--accent-soft:rgba(118,226,185,.14)}
.app-theme-vasttrail{--accent:#67d4ff;--accent-soft:rgba(103,212,255,.14)}

.app-shell{
  padding-top:20px;
}
.app-hero{
  padding:30px;
  background:
    radial-gradient(circle at 12% 12%, var(--accent-soft), transparent 28%),
    linear-gradient(180deg, rgba(14,22,43,.92), rgba(8,13,28,.92));
}
.app-hero h1{
  margin:16px 0 10px;
}
.app-hero .lead{
  font-size:17px;
  max-width:780px;
}
.inline-list span{
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  font-size:14px;
  color:#dce7f7;
}
.store-note{
  margin-top:12px;
  color:var(--muted);
}

.showcase-details{
  grid-template-columns:repeat(3,1fr);
}
.detail-card{
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
  border:1px solid rgba(255,255,255,.08);
  border-radius:22px;
}
.detail-card ul{
  padding-left:18px;
  margin:12px 0 0;
}
.detail-card li{
  margin-bottom:8px;
  color:#d7e2f5;
}

.shot-grid{
  grid-template-columns:repeat(3,1fr);
}
.shot{
  border-radius:24px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.014));
  border:1px solid rgba(255,255,255,.08);
  min-height:300px;
}
.device-mock{
  height:100%;
  border-radius:20px;
  padding:18px;
  background:
    radial-gradient(circle at 50% 0%, var(--accent-soft), transparent 32%),
    linear-gradient(180deg, rgba(9,14,28,.95), rgba(5,9,19,.98));
  border:1px solid rgba(255,255,255,.06);
}
.device-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:16px;
  color:#bdd0e9;
  font-size:12px;
}
.phone-notch{
  width:88px;
  height:16px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  margin:0 auto 18px;
}
.mock-headline{
  height:16px;
  border-radius:999px;
  width:72%;
  background:linear-gradient(90deg,var(--accent), rgba(255,255,255,.12));
}
.mock-line{
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,.1);
  margin-top:12px;
}
.mock-line.short{width:68%}
.mock-line.mid{width:82%}
.mock-card{
  margin-top:18px;
  padding:14px;
  border-radius:18px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.06);
}
.mock-map{
  height:92px;
  border-radius:16px;
  margin-top:14px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.06), transparent),
    radial-gradient(circle at 18% 25%, rgba(255,255,255,.1), transparent 12%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
}
.mock-dots{
  display:flex;
  gap:8px;
  margin-top:12px;
}
.mock-dots span{
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--accent);
}
.metric-inline{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.06);
}
.metric-inline strong{
  font-size:24px;
}

.legal-grid{
  grid-template-columns:repeat(2,1fr);
}
.legal-link-card{
  display:block;
  transition:
    transform .22s var(--ease),
    border-color .22s var(--ease),
    box-shadow .22s var(--ease);
}
.legal-link-card:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.15);
  box-shadow:var(--shadow-soft);
}

.legal-doc{
  display:grid;
  gap:20px;
}
.legal-card h1{
  margin:16px 0 8px;
}
.legal-card h2{
  margin-top:28px;
  margin-bottom:12px;
  font-size:28px;
}
.legal-card p + p{
  margin-top:12px;
}
.legal-card .updated{
  margin-top:18px;
  color:var(--muted);
  font-size:14px;
}
.legal-card .legal-links-inline{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:20px;
}

.app-anchor-nav{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:18px;
}
.app-anchor-nav a{
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  font-size:14px;
}
.app-anchor-nav a:hover{
  border-color:rgba(255,255,255,.16);
}

.reveal{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .6s var(--ease), transform .6s var(--ease);
}
.reveal.in{
  opacity:1;
  transform:none;
}

/* Premium extras */
.contact-highlight{
  display:grid;
  gap:16px;
}
.contact-item{
  padding:18px 20px;
  border-radius:20px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07);
}
.contact-item strong{
  display:block;
  margin-bottom:6px;
  font-size:15px;
  color:#fff;
}
.contact-item span,
.contact-item a{
  color:#d9e5f6;
}

.about-points{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
  margin-top:18px;
}
.about-point{
  padding:18px;
  border-radius:18px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07);
}
.about-point strong{
  display:block;
  margin-bottom:8px;
}

@media (max-width: 1080px){
  .hero-grid,
  .page-hero-wrap,
  .contact-grid,
  .about-grid,
  .app-layout,
  .cta-banner{
    grid-template-columns:1fr;
  }

  .feature-grid,
  .timeline,
  .showcase-details,
  .shot-grid,
  .footer-grid,
  .legal-grid,
  .app-grid,
  .about-points{
    grid-template-columns:1fr 1fr;
  }
}

@media (max-width: 820px){
  .menu-toggle{
    display:grid;
    place-items:center;
  }

  .nav-shell{
    padding:0;
    background:transparent;
    border:none;
  }

  .nav-links{
    position:absolute;
    right:18px;
    top:78px;
    left:18px;
    flex-direction:column;
    align-items:stretch;
    padding:14px;
    border-radius:22px;
    background:rgba(8,13,28,.97);
    border:1px solid rgba(255,255,255,.08);
    box-shadow:0 26px 60px rgba(0,0,0,.32);
    opacity:0;
    pointer-events:none;
    transform:translateY(-8px);
    transition:.22s var(--ease);
  }

  .nav-links.open{
    opacity:1;
    pointer-events:auto;
    transform:none;
  }

  .nav-links a{
    padding:14px 16px;
  }

  .hero-stats,
  .feature-grid,
  .timeline,
  .showcase-details,
  .shot-grid,
  .footer-grid,
  .legal-grid,
  .app-grid,
  .about-points{
    grid-template-columns:1fr;
  }

  .section{
    padding:26px 0;
  }

  .hero-copy,
  .hero-visual,
  .page-hero-wrap,
  .app-hero,
  .cta-banner,
  .contact-card,
  .legal-card,
  .feature-card,
  .showcase-card,
  .detail-card,
  .timeline-step{
    padding:22px;
  }

  .container{
    width:min(var(--container),calc(100% - 20px));
  }
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .reveal,
  .btn,
  .nav-links a,
  .showcase-card,
  .legal-link-card,
  .card{
    transition:none;
  }
}