/* Lionheart v3.1 (intense load + ambient motion) — NO cursor-driven motion */
:root{
  --bg: #040404;
  --panel: rgba(0,0,0,.38);
  --gold-1: #d7b25a;
  --gold-2: #f3dd95;
  --gold-3: #b48a2c;
  --text: rgba(255,255,255,.90);
  --muted: rgba(255,255,255,.72);
  --ring: rgba(215,178,90,.40);
}
*{ box-sizing: border-box; }
html,body{ height: 100%; }
body{
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
  letter-spacing: .2px;
  overflow-x: hidden;
}
.hero{
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 54px 18px;
  position: relative;
  overflow: hidden;
}
.hero__bg{
  position:absolute; inset: -24px;
  background:
    radial-gradient(900px 420px at 50% 35%, rgba(215,178,90,.14), transparent 64%),
    radial-gradient(1200px 600px at 50% 30%, rgba(215,178,90,.08), transparent 74%),
    url("assets/hero-bg.jpg");
  background-size: cover;
  background-position: center;
  filter: saturate(.95) contrast(1.08);
  transform: scale(1.10);
  opacity: .98;
  animation: bgCinematic 14s cubic-bezier(.2,.8,.2,1) infinite alternate;
  will-change: transform;
}
.hero__bg::after{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(900px 520px at 50% 34%, rgba(0,0,0,.10), rgba(0,0,0,.66)),
    linear-gradient(to bottom, rgba(0,0,0,.18), rgba(0,0,0,.86));
}
@keyframes bgCinematic{
  0%   { transform: scale(1.10) translate3d(0px, 0px, 0) rotate(0.001deg); }
  40%  { transform: scale(1.14) translate3d(16px, -10px, 0) rotate(0.001deg); }
  70%  { transform: scale(1.12) translate3d(-14px, -18px, 0) rotate(0.001deg); }
  100% { transform: scale(1.16) translate3d(10px, -26px, 0) rotate(0.001deg); }
}
.particles{
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 20% 30%, rgba(243,221,149,.08) 0 2px, transparent 3px),
    radial-gradient(circle at 70% 40%, rgba(215,178,90,.07) 0 2px, transparent 3px),
    radial-gradient(circle at 40% 70%, rgba(243,221,149,.06) 0 2px, transparent 3px),
    radial-gradient(circle at 80% 75%, rgba(215,178,90,.05) 0 2px, transparent 3px),
    radial-gradient(circle at 55% 20%, rgba(243,221,149,.05) 0 2px, transparent 3px);
  opacity: .55;
  filter: blur(.2px);
  animation: particleDrift 9s ease-in-out infinite alternate;
  pointer-events:none;
}
@keyframes particleDrift{
  from{ transform: translate3d(0,0,0); opacity: .42; }
  to  { transform: translate3d(0,-22px,0); opacity: .62; }
}
.card{
  position: relative;
  z-index: 2;
  width: min(1040px, 94vw);
  padding: 52px 28px 30px;
  border-radius: 26px;
  background: var(--panel);
  border: 1px solid rgba(255,255,255,.09);
  box-shadow:
    0 22px 62px rgba(0,0,0,.62),
    inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  text-align: center;
}
.spotlight{
  position:absolute;
  inset:-60px;
  background: radial-gradient(520px 220px at 50% 30%, rgba(215,178,90,.18), transparent 65%);
  opacity: .8;
  filter: blur(10px);
  animation: spotMove 6.2s ease-in-out infinite alternate;
  pointer-events:none;
  z-index:0;
}
@keyframes spotMove{
  from{ transform: translate3d(-40px, -10px, 0); opacity:.55; }
  to  { transform: translate3d(40px, -20px, 0); opacity:.85; }
}
.logo{
  width: min(820px, 82vw);
  height: auto;
  display:block;
  margin: 0 auto 18px;
  user-select: none;
  -webkit-user-drag: none;
  filter:
    drop-shadow(0 18px 48px rgba(0,0,0,.60))
    drop-shadow(0 0 34px rgba(215,178,90,.10));
  transform-origin: 50% 60%;
  animation: logoPulseFloat 4.8s ease-in-out infinite;
  will-change: transform, filter;
  position: relative;
  z-index: 1;
}
@keyframes logoPulseFloat{
  0%,100%{ transform: translateY(0px) scale(1); filter: drop-shadow(0 18px 48px rgba(0,0,0,.60)) drop-shadow(0 0 30px rgba(215,178,90,.10)); }
  50%    { transform: translateY(-10px) scale(1.01); filter: drop-shadow(0 22px 62px rgba(0,0,0,.62)) drop-shadow(0 0 44px rgba(215,178,90,.16)); }
}
.descriptor{
  font-size: 14px;
  letter-spacing: 3.0px;
  color: var(--muted);
  margin-top: 6px;
  position: relative;
  z-index: 1;
}
.statement{
  margin-top: 10px;
  font-size: 18px;
  letter-spacing: 1.1px;
  color: rgba(243,221,149,.94);
  position: relative;
  z-index: 1;
}
.contact{
  margin-top: 28px;
  display: grid;
  gap: 12px;
  justify-content: center;
  position: relative;
  z-index: 1;
}
.contact__row{
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  border-radius: 14px;
  text-decoration: none;
  color: var(--text);
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.18);
  transition: transform .20s ease, border-color .20s ease, box-shadow .20s ease;
  outline: none;
  overflow: hidden;
}
.contact__row:focus-visible{
  box-shadow: 0 0 0 3px var(--ring);
  border-color: rgba(215,178,90,.42);
}
.contact__row:hover{
  transform: translateY(-3px) scale(1.01);
  border-color: rgba(215,178,90,.34);
  box-shadow: 0 18px 34px rgba(0,0,0,.44);
}
.icon{
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  font-size: 18px;
  color: rgba(243,221,149,.92);
}
.text{
  font-size: 18px;
  letter-spacing: .4px;
}
.shine::before{
  content:"";
  position:absolute;
  inset:-40px;
  background: linear-gradient(120deg, transparent 30%, rgba(243,221,149,.18) 45%, transparent 60%);
  transform: translateX(-140%) rotate(8deg);
  opacity: 0;
}
.shine:hover::before{
  opacity: 1;
  animation: sweep 900ms ease forwards;
}
@keyframes sweep{
  to{ transform: translateX(140%) rotate(8deg); }
}
.shimmer .text{
  background: linear-gradient(90deg, var(--gold-1), var(--gold-2), var(--gold-3), var(--gold-2), var(--gold-1));
  background-size: 260% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.contact__row:hover .text{
  animation: goldShift 900ms ease-in-out infinite;
  filter: drop-shadow(0 0 12px rgba(215,178,90,.18));
}
@keyframes goldShift{
  0%  { background-position: 0% 50%; }
  100%{ background-position: 100% 50%; }
}
.footer{
  margin-top: 26px;
  font-size: 12px;
  letter-spacing: .6px;
  color: rgba(255,255,255,.66);
  position: relative;
  z-index: 1;
}
.enter{
  opacity: 0;
  transform: translateY(30px) scale(.985);
  filter: blur(10px);
  animation: enter 1.25s cubic-bezier(.12, 1, .22, 1) forwards;
}
.enter--1{ animation-delay: 120ms; }
.enter--2{ animation-delay: 360ms; }
.enter--3{ animation-delay: 520ms; }
.enter--4{ animation-delay: 690ms; }
.enter--5{ animation-delay: 860ms; }
@keyframes enter{
  60%{ filter: blur(3px); }
  to{
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}
@media (max-width: 640px){
  .card{ padding: 40px 18px 22px; }
  .text{ font-size: 16px; }
  .statement{ font-size: 16px; }
}
@media (prefers-reduced-motion: reduce){
  .hero__bg, .particles, .logo, .spotlight{ animation: none !important; }
  .enter{ animation: none !important; opacity: 1; transform: none; filter: none; }
  .contact__row:hover .text{ animation: none !important; }
  .shine:hover::before{ animation: none !important; }
}


/* === v3.3 REFINED TEXT SCALE (25% REDUCTION) === */

.card,
.descriptor,
.statement,
.footer{
  text-align: center;
}

.descriptor{
  font-size: 21px; /* down from 28 */
  letter-spacing: 3px;
}

.statement{
  font-size: 27px; /* down from 36 */
  letter-spacing: 1.2px;
}

.contact{
  justify-items: center;
}

.contact__row{
  justify-content: center;
  text-align: center;
}

.text{
  font-size: 24px; /* down from 32 */
}

.icon{
  font-size: 22px;
}

.footer{
  font-size: 14px;
}