:root{
  --bg:#140001;
  --panel:rgba(255,255,255,.06);
  --panel2:rgba(255,255,255,.08);
  --text:#F5F1E8;
  --muted:#F5F1E8;
  --stroke:rgba(255,255,255,.10);
  --red:#DE172E;
  --wrap:1180px;
}

/* Base */
.prl-home{ background:var(--bg); color:var(--text); }
.prl-wrap{ width:min(var(--wrap), calc(100% - 40px)); margin:0 auto; }

@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}

/* Shared card */
.prl-card{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  padding:16px;
}
.prl-card-title{ font-size:18px; }
.prl-card-desc{ color:var(--muted); margin-top:8px; }

/* Accent stripe */
.prl-card, .prl-popular-card, .prl-tile, .prl-step{ position:relative; }
.prl-card::before, .prl-popular-card::before, .prl-tile::before{
  content:"";
  position:absolute;
  top:0; left:0; right:0;
  height:2px;
  background:linear-gradient(90deg, rgba(225,29,46,.55), transparent);
  opacity:.35;
  pointer-events:none;
}

/* Prevent pseudo overflow */
.prl-card,
.prl-popular-card,
.prl-tile,
.prl-step{
  overflow:hidden;
  isolation:isolate;
}

/* Hero */
.prl-hero{ position:relative; padding:84px 0 64px; overflow:hidden; }
.prl-hero-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;

  background:
    radial-gradient(900px 500px at 70% 20%, rgba(225,29,46,.25), transparent 60%),
    radial-gradient(700px 420px at 20% 10%, rgba(255,255,255,.10), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.06), transparent 40%);

  filter:saturate(1.1);
  transform:translate3d(0,0,0);
  will-change: transform, filter;
}

@media (prefers-reduced-motion: no-preference){
  .prl-hero-bg{
    animation: prlHeroGlow 8s ease-in-out infinite alternate;
  }
  @keyframes prlHeroGlow{
    from{ filter: saturate(1.05) brightness(1); }
    to  { filter: saturate(1.15) brightness(1.02); }
  }
}
.prl-hero-inner{
  position:relative;
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap:40px;
  align-items:center;
}
.prl-title{ font-size:54px; line-height:1.05; margin:10px 0 8px; color:#EFD09E; }
.prl-sub{ font-size:22px; opacity:.92; margin-bottom:10px; }
.prl-line{ color:var(--muted); max-width:52ch; }

.prl-cta-row{ display:flex; flex-wrap:wrap; gap:12px; margin:22px 0 14px; }
.prl-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 16px; border-radius:30px;
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.06);
  color:var(--text); text-decoration:none;
  transition:transform .2s ease, background .2s ease, border-color .2s ease;
}
.prl-btn:hover{ transform:translateY(-2px); background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.18); }
.prl-btn-primary{ background:rgba(225,29,46,.22); border-color:rgba(225,29,46,.40); }
.prl-btn-primary:hover{ background:rgba(225,29,46,.30); border-color:rgba(225,29,46,.55); }

.prl-dash-row-3{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:14px;
}

.prl-dash-list{
  margin-top:10px;
  display:grid;
  gap:10px;
}

.prl-dash-li{
  display:grid;
  grid-template-columns: 10px auto 1fr;
  gap:10px;
  align-items:center;
  font-size:13px;
  color: rgba(235,241,255,0.88);
}

.prl-dash-li .dot{
  width:6px;height:6px;border-radius:99px;
  background: rgba(204,0,0,0.9);
  box-shadow: 0 0 0 3px rgba(204,0,0,0.12);
}

.prl-dash-li .t{
  color: rgba(235,241,255,0.92);
  font-weight: 600;
}

.prl-dash-li .m{
  color: rgba(235,241,255,0.72);
}

/* HERO SLIDER REPLACEMENT */
.prl-hero-visual{
  position: relative;
  display: flex;
  justify-content: center;
}

.prl-hero-slider{
  position: relative;
  width: min(720px, 100%);
  isolation: isolate;
}

.prl-hero-slider-stack{
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}

.prl-hero-slider-shadow{
  position: absolute;
  inset: 28px 18px -10px 18px;
  border-radius: 34px;
  filter: blur(0px);
  opacity: .95;
}

.prl-shadow-1{
  transform: translate(18px, 16px) rotate(4deg) scale(.94);
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.01)),
    radial-gradient(circle at top right, rgba(204,0,0,.20), transparent 45%),
    rgba(8,10,16,.72);
  border: 1px solid rgba(255,255,255,.08);
}

.prl-shadow-2{
  transform: translate(-10px, 24px) rotate(-5deg) scale(.90);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)),
    radial-gradient(circle at top left, rgba(255,255,255,.08), transparent 40%),
    rgba(8,10,16,.56);
  border: 1px solid rgba(255,255,255,.06);
}

.prl-hero-slider-frame{
  position: relative;
  z-index: 1;
  border: 1px solid rgba(255,255,255,.14);
  background:
    linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.03)),
    rgba(8,10,16,.70);
  border-radius: 30px;
  overflow: hidden;
  box-shadow:
    0 26px 80px rgba(0,0,0,.40),
    0 0 0 1px rgba(255,255,255,.03) inset,
    0 0 60px rgba(204,0,0,.10);
  backdrop-filter: blur(14px);
}

.prl-hero-slider-frame::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at top right, rgba(204,0,0,.18), transparent 28%),
    radial-gradient(circle at bottom left, rgba(255,255,255,.06), transparent 24%);
  z-index: 0;
}

.prl-hero-slider-stage{
  position: relative;
  min-height: 500px;
  padding: 18px;
  overflow: hidden;
}

.prl-hero-slide{
  position: absolute;
  inset: 18px;
  display: flex;
  align-items: flex-end;
  text-decoration: none;
  color: #fff;
  border-radius: 28px;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transform: scale(.94) rotate(-2deg);
  transition:
    opacity .55s ease,
    transform .75s cubic-bezier(.22,1,.36,1),
    visibility .55s ease;
  background-size: cover;
  background-position: center;
  border: 1px solid rgba(255,255,255,.10);
  clip-path: polygon(0 0, 92% 0, 100% 9%, 100% 100%, 8% 100%, 0 91%);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.03),
    0 20px 60px rgba(0,0,0,.35);
}

.prl-hero-slide.is-active{
  opacity: 1;
  visibility: visible;
  transform: scale(1) rotate(0deg);
  z-index: 2;
}

.prl-hero-slide.is-prev{
  opacity: .22;
  visibility: visible;
  transform: translateX(-28px) scale(.92) rotate(-4deg);
  z-index: 1;
}

.prl-hero-slide.is-next{
  opacity: .22;
  visibility: visible;
  transform: translateX(28px) scale(.92) rotate(4deg);
  z-index: 1;
}

.prl-hero-slide-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(5,8,14,.18) 0%, rgba(5,8,14,.34) 42%, rgba(5,8,14,.88) 100%),
    radial-gradient(circle at top right, rgba(204,0,0,.20), transparent 28%);
}

.prl-hero-slide-grid{
  position:absolute;
  inset:0;
  opacity:.22;
  background-image:
    linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,.20), rgba(0,0,0,.9));
}

.prl-hero-slide-content{
  position: relative;
  z-index: 2;
  width: 100%;
  padding: 26px;
}

.prl-hero-slide h3{
  margin:0 0 8px;
  font-size: clamp(26px, 3vw, 40px);
  line-height: 1.05;
  color:#fff;
}

.prl-hero-slide p{
  margin:0;
  color:rgba(235,241,255,.76);
  font-size:14px;
  max-width:40ch;
}

.prl-hero-slide-cta{
  margin-top:18px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.18);
  color:#fff;
  font-size:13px;
}

.prl-hero-slide-arrow{
  font-size:14px;
  opacity:.9;
}

.prl-hero-slider-scan{
  position:absolute;
  left: 18px;
  right: 18px;
  top: 0;
  height: 120px;
  pointer-events:none;
  background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.08), rgba(255,255,255,0));
  filter: blur(10px);
  opacity: .55;
  animation: prlHeroScan 5.5s linear infinite;
  z-index: 3;
}

.prl-hero-slider-bottom{
  position: relative;
  z-index: 2;
  padding: 0 18px 18px;
}

.prl-hero-slider-dots{
  display:flex;
  flex-wrap:nowrap;
  gap:10px;
  margin-bottom:14px;
}

.prl-hero-dot{
  appearance:none;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.72);
  border-radius:999px;
  padding:9px 12px;
  cursor:pointer;
  transition:
    background .25s ease,
    border-color .25s ease,
    color .25s ease,
    transform .25s ease;
}

.prl-hero-dot:hover{
  transform: translateY(-1px);
  background:rgba(255,255,255,.08);
}

.prl-hero-dot.is-active{
  color:#fff;
  background:rgba(204,0,0,.18);
  border-color:rgba(204,0,0,.36);
  box-shadow: 0 0 18px rgba(204,0,0,.10);
}

.prl-hero-dot-label{
  font-size:12px;
  white-space:nowrap;
}

.prl-hero-slider-progress{
  height: 6px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255,255,255,.08);
}

.prl-hero-slider-progress-bar{
  display:block;
  height:100%;
  width:0%;
  border-radius:inherit;
  background: linear-gradient(90deg, rgba(204,0,0,.85), rgba(255,255,255,.55));
  transform-origin:left center;
}

@keyframes prlHeroScan{
  0%   { transform: translateY(-20%); opacity: 0; }
  15%  { opacity: .50; }
  50%  { opacity: .65; }
  100% { transform: translateY(430px); opacity: 0; }
}

@media (max-width: 980px){
  .prl-hero-slider-stage{
    min-height: 400px;
  }

  .prl-hero-slide{
    inset: 14px;
  }

  .prl-hero-slide-content{
    padding: 20px;
  }

  .prl-hero-slide h3{
    font-size: 28px;
  }
}

@media (max-width: 640px){
  .prl-shadow-1,
  .prl-shadow-2{
    display:none;
  }

  .prl-hero-slider-frame{
    border-radius: 22px;
  }

  .prl-hero-slider-stage{
    min-height: 340px;
    padding: 12px;
  }

  .prl-hero-slide{
    inset: 12px;
    clip-path: polygon(0 0, 94% 0, 100% 8%, 100% 100%, 6% 100%, 0 92%);
  }

  .prl-hero-slider-dots{
    gap:8px;
  }

  .prl-hero-dot{
    padding:8px 10px;
  }

  .prl-hero-dot-label{
    font-size:11px;
  }
}

/* Mobile 1 column */
@media (max-width: 980px){
  .prl-dash-row-3{ grid-template-columns: 1fr; }
}


/* Ghost / support button */
.prl-btn-ghost{ background:rgba(0,0,0,.18); }
.prl-btn-ghost:hover{ background:rgba(0,0,0,.28); }

.prl-micro{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.prl-pill{
  font-size:12px; color:rgba(255,255,255,.82);
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.05);
  padding:7px 10px; border-radius:999px;
}

.prl-pill-link{ display:inline-flex; align-items:center; gap:6px; text-decoration:none; }
.prl-pill-link:hover{ background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.18); }

/* Hero preview glass */
.prl-hero-visual .prl-glass{
  border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04));
  border-radius:18px;
  overflow:hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
}
.prl-glass-top{
  display:flex; align-items:center; gap:8px;
  padding:12px 14px;
  border-bottom:1px solid rgba(255,255,255,.10);
}
.dot{ width:10px; height:10px; border-radius:999px; background:rgba(255,255,255,.20); }
.label{ margin-left:10px; font-size:12px; color:rgba(255,255,255,.72); }
.prl-glass-body{ padding:16px; display:grid; gap:10px; }
.bar{ height:12px; border-radius:999px; background:rgba(255,255,255,.10); }
.bar.wide{ height:14px; background:rgba(225,29,46,.20); }

.prl-link{
  color:rgba(225,29,46,.90);
  text-decoration:none;
  border-bottom:1px solid rgba(225,29,46,.35);
}
.prl-link:hover{ border-bottom-color:rgba(225,29,46,.70); }
.prl-sep{ opacity:.35; }

/* Story / Scroller */
.prl-story{
  padding:70px 0;
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.prl-story-grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap:34px;
  align-items:start;
}
.prl-h2{ font-size:34px; margin:0 0 8px; color:white; }
.prl-muted{ color:var(--muted); margin:0 0 18px; max-width:60ch; }

.prl-steps{ display:grid; gap:12px; }
.prl-step{
  padding:14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  transition:transform .25s ease, background .25s ease, border-color .25s ease;
}
.prl-step.active{
  background:rgba(255,255,255,.08);
  border-color:rgba(225,29,46,.35);
  transform:translateY(-2px);
}
.prl-step-tag{ font-size:12px; letter-spacing:.12em; opacity:.75; }
.prl-step-title{ font-size:18px; margin-top:6px; }
.prl-step-desc{ color:var(--muted); margin-top:6px; }

/* Visual box (right side) */
.prl-visual{
  position:relative;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(500px 260px at 30% 10%, rgba(225,29,46,.25), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  height:420px;
  overflow:hidden;
  isolation:isolate;

  /* Center the inner card */
  display:flex;
  align-items:center;
  justify-content:center;
  padding:28px;
}

/* Media layer */
.prl-step-media{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  transform:scale(1.02);
  filter:saturate(1.05);
  opacity:1;
  z-index:0;
  will-change:opacity, filter, transform;
}

/* Contrast overlay */
.prl-visual::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,.55));
  z-index:1;
  pointer-events:none;
}

/* UI card */
.prl-visual-card{
  position:relative;
  z-index:2;
  width:min(560px, 92%);
  margin:0;

  border-radius:18px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.35);
  padding:16px;
  backdrop-filter: blur(10px);
  transform: translateY(-6px);
}
.prl-visual-kicker{ font-size:12px; letter-spacing:.12em; opacity:.75; }
.prl-visual-title{ font-size:20px; margin-top:8px; }
.prl-visual-desc{ color:var(--muted); margin-top:8px; }

.prl-visual-kpis{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.prl-kpi{
  font-size:11px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.80);
  white-space:nowrap;
}

.prl-visual-meter{ display:grid; gap:8px; margin-top:14px; }
.meter-bar{ height:10px; border-radius:999px; background:rgba(255,255,255,.12); }
.meter-bar:nth-child(2){ background:rgba(225,29,46,.25); }
.prl-note{ color:rgba(255,255,255,.60); font-size:12px; margin-top:10px; }

/* Our process */
.prl-process{ padding:70px 0; border-top:1px solid rgba(255,255,255,.06); }
.prl-process-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }


/* Media strip */
.prl-media-strip{ padding:56px 0; border-top:1px solid rgba(255,255,255,.06); }
.prl-media-card{
  position:relative;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  overflow:hidden;
}
.prl-media-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.16;
  filter:saturate(1.05) contrast(1.02);
  transform:scale(1.04);
}
.prl-media-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(5,5,7,.92), rgba(5,5,7,.55));
  pointer-events:none;
}
.prl-media-content{ position:relative; z-index:2; padding:22px; display:grid; gap:14px; }
.prl-media-title{ font-size:18px; }
.prl-media-text{ color:var(--muted); max-width:70ch; }
.prl-media-stats{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; margin-top:8px; }
.prl-media-stat{ border:1px solid rgba(255,255,255,.10); background:rgba(0,0,0,.22); border-radius:16px; padding:14px; }
.prl-media-stat .k{ font-size:12px; letter-spacing:.12em; opacity:.75; }
.prl-media-stat .v{ font-size:16px; margin-top:8px; }
.prl-media-stat .d{ color:var(--muted); margin-top:8px; }

/* Founder */
.prl-founder{ padding:70px 0; border-top:1px solid rgba(255,255,255,.06); }
.prl-founder-grid{ display:grid; grid-template-columns:.8fr 1.2fr; gap:24px; align-items:center; }
.prl-founder-photo img{
  width:100%; height:auto; display:block;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.12);
}
.prl-founder-name{ font-size:20px; margin-top:10px; }
.prl-founder-role{ color:var(--muted); margin-top:4px; }
.prl-founder-text{ color:var(--muted); margin-top:12px; max-width:70ch; }

/* Facts */
.prl-facts{ padding:70px 0; border-top:1px solid rgba(255,255,255,.06); }
.prl-facts-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.prl-fact{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  padding:18px;
}
.prl-fact-num{ font-size:34px; font-weight:700; letter-spacing:.01em; }
.prl-fact-label{ color:var(--muted); margin-top:6px; }

.prl-facts-note{ margin-top:14px; font-size:12px; color:rgba(243,244,246,.58); }

.prl-footer-cta{ margin-top:22px; display:flex; flex-wrap:wrap; gap:12px; }

/* Responsive */
@media (max-width: 980px){
  .prl-hero-inner{ grid-template-columns: 1fr; }
  .prl-title{ font-size:40px; color:#EFD09E; }

  .prl-value-grid{ grid-template-columns: 1fr; }

  .prl-story-grid{ grid-template-columns: 1fr; }
  .prl-visual{ height:360px; }

  .prl-tile-grid{ grid-template-columns: 1fr 1fr; }
  .prl-tile-grid-4{ grid-template-columns: 1fr 1fr; }
  .prl-media-stats{ grid-template-columns: 1fr; }

  .prl-process-grid{ grid-template-columns:1fr 1fr; }
  .prl-popular-grid{ grid-template-columns:1fr; }
  .prl-founder-grid{ grid-template-columns:1fr; }
  .prl-facts-grid{ grid-template-columns:1fr 1fr; }

  .prl-story-left{ order: 2; }
  .prl-story-right{ order: 1; }

  .prl-fact-num{ font-size:19px; font-weight:700; letter-spacing:.01em; }
  .prl-card-title{ font-size:16px; }
}

/* Dashboard micro-UI */
.prl-dash{ position:relative; width: min(720px, 100%); }
.prl-dash .prl-glass-top{ justify-content:flex-start; }
.prl-live{
  margin-left:auto;
  display:inline-flex; align-items:center; gap:8px;
  font-size:12px; color:rgba(255,255,255,.78);
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.20);
  padding:6px 10px; border-radius:999px;
}
.prl-live-dot{
  width:8px; height:8px; border-radius:999px;
  background:rgba(225,29,46,.85);
  box-shadow:0 0 0 rgba(225,29,46,.0);
  animation:prlPulse 1.6s ease-in-out infinite;
}

.prl-dash-body{ padding:14px; display:grid; gap:12px; }
.prl-dash-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.prl-dash-wide{ grid-column: 1 / -1; }

.prl-dash-card{
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.22);
  padding:14px;
  position:relative;
  overflow:hidden;
}
.prl-dash-card::after{
  content:"";
  position:absolute; inset:-2px;
  background:radial-gradient(520px 240px at 80% 0%, rgba(225,29,46,.18), transparent 55%);
  pointer-events:none;
  opacity:.9;
}

.prl-dash-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; position:relative; z-index:1; }
.prl-dash-k{ font-size:12px; letter-spacing:.12em; opacity:.75; }
.prl-dash-v{ font-size:13px; color:rgba(255,255,255,.86); display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; text-align:right; }

.prl-status{ display:inline-flex; align-items:center; gap:8px; }
.prl-status-dot{
  width:8px; height:8px; border-radius:999px;
  background:rgba(46,213,115,.90);
  box-shadow:0 0 16px rgba(46,213,115,.18);
}
.prl-status.ok{ color:rgba(255,255,255,.88); }

.prl-dash-foot{ margin-top:10px; font-size:12px; color:rgba(243,244,246,.62); position:relative; z-index:1; }

/* Small meter */
.prl-meter{ margin-top:12px; display:grid; gap:8px; position:relative; z-index:1; }
.prl-meter-bar{
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,.10);
  position:relative;
  overflow:hidden;
}
.prl-meter-bar span{
  display:block;
  height:100%;
  width:64%;
  background:rgba(225,29,46,.22);
  border-radius:inherit;
  box-shadow:0 0 18px rgba(225,29,46,.10);
  animation:prlFill 2.4s ease-in-out infinite;
}
.prl-meter-bar:nth-child(2) span{ width:78%; animation-delay:.25s; background:rgba(255,255,255,.12); }
.prl-meter-bar:nth-child(3) span{ width:70%; animation-delay:.40s; background:rgba(225,29,46,.16); }

/* Split + progress */
.prl-split{ margin-top:12px; display:grid; grid-template-columns:1fr 1fr; gap:10px; position:relative; z-index:1; }
.prl-split .l{ font-size:12px; color:rgba(255,255,255,.76); }
.prl-split .r{ font-size:12px; color:rgba(243,244,246,.62); text-align:right; }
.prl-progress{ margin-top:10px; height:10px; border-radius:999px; background:rgba(255,255,255,.10); overflow:hidden; position:relative; z-index:1; }
.prl-progress-fill{
  height:100%;
  width:0%;
  border-radius:inherit;
  background:linear-gradient(90deg, rgba(225,29,46,.35), rgba(255,255,255,.12));
  animation:prlProgress 2.6s ease-in-out infinite;
}

.prl-dash-disclaimer{ margin-top:10px; font-size:11px; color:rgba(243,244,246,.52); position:relative; z-index:1; }

/* Mini bars */
.prl-mini{ margin-top:10px; display:grid; gap:8px; position:relative; z-index:1; }
.prl-mini-bar{
  height:10px; border-radius:999px;
  background:rgba(255,255,255,.10);
  position:relative;
  overflow:hidden;
}
.prl-mini-bar::before{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.16), transparent);
  transform:translateX(-60%);
  animation:prlShimmer 1.8s ease-in-out infinite;
}
.prl-mini-bar:nth-child(2){ background:rgba(225,29,46,.18); }
.prl-mini-bar:nth-child(2)::before{ animation-duration:2.2s; }
.prl-mini-bar:nth-child(3)::before{ animation-duration:2.0s; }

/* Spark */
.prl-spark{
  margin-top:12px;
  height:34px;
  display:flex; align-items:flex-end; gap:6px;
  position:relative; z-index:1;
}
.prl-spark span{
  width:10px; border-radius:10px;
  background:rgba(255,255,255,.12);
  height:12px;
  animation:prlBeat 1.6s ease-in-out infinite;
}
.prl-spark span:nth-child(2){ animation-delay:.12s; height:18px; background:rgba(225,29,46,.18); }
.prl-spark span:nth-child(3){ animation-delay:.24s; height:26px; }
.prl-spark span:nth-child(4){ animation-delay:.36s; height:16px; }
.prl-spark span:nth-child(5){ animation-delay:.48s; height:22px; background:rgba(225,29,46,.14); }
.prl-spark span:nth-child(6){ animation-delay:.60s; height:14px; }

/* Chips */
.prl-chip{
  font-size:11px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.80);
}

/* Timeline */
.prl-timeline{ margin-top:12px; display:grid; gap:8px; position:relative; z-index:1; }
.prl-tl-item{
  display:grid;
  grid-template-columns:12px 1fr auto;
  align-items:center;
  gap:10px;
  padding:10px 10px;
  border-radius:12px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
}
.prl-tl-dot{
  width:8px; height:8px; border-radius:999px;
  background:rgba(225,29,46,.65);
  box-shadow:0 0 14px rgba(225,29,46,.16);
}
.prl-tl-text{ font-size:12px; color:rgba(255,255,255,.82); }
.prl-tl-meta{ font-size:11px; color:rgba(243,244,246,.60); }

/* Scan line overlay */
.prl-scan{
  position:absolute; inset:0;
  pointer-events:none;
  opacity:.65;
}
.prl-scan-line{
  position:absolute;
  left:-20%; right:-20%;
  top:18%;
  height:2px;
  background:linear-gradient(90deg, transparent, rgba(225,29,46,.28), transparent);
  filter:blur(.2px);
  animation:prlScan 3.2s ease-in-out infinite;
}

/* Animations */
@keyframes prlPulse{
  0%{ box-shadow:0 0 0 rgba(225,29,46,0); }
  50%{ box-shadow:0 0 18px rgba(225,29,46,.22); }
  100%{ box-shadow:0 0 0 rgba(225,29,46,0); }
}

@keyframes prlFill{
  0%, 100%{ filter:saturate(1); transform:translateZ(0); }
  50%{ filter:saturate(1.08); }
}

@keyframes prlProgress{
  0%{ width:18%; opacity:.55; }
  50%{ width:82%; opacity:1; }
  100%{ width:18%; opacity:.55; }
}
@keyframes prlShimmer{
  0%{ transform:translateX(-70%); opacity:.0; }
  20%{ opacity:1; }
  50%{ transform:translateX(70%); opacity:1; }
  100%{ opacity:0; transform:translateX(70%); }
}
@keyframes prlBeat{
  0%, 100%{ transform:translateY(0); filter:saturate(1); }
  50%{ transform:translateY(-3px); filter:saturate(1.05); }
}
@keyframes prlScan{
  0%{ top:18%; opacity:.0; }
  15%{ opacity:.9; }
  55%{ top:72%; opacity:.9; }
  100%{ top:72%; opacity:0; }
}

/* Mobile dashboard below */
@media (max-width: 720px){
  .prl-dash-row{ grid-template-columns: 1fr !important; }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .prl-live-dot,
  .prl-mini-bar::before,
  .prl-spark span,
  .prl-scan-line{
    animation:none !important;
  }
}

/* Glass surface apply broadly */
.prl-home :is(
  .prl-card,
  .prl-step,
  .prl-tile,
  .prl-popular-card,
  .prl-fact,
  .prl-media-stat,
  .prl-badge-inner,
  .prl-visual-card
){
  border-color: rgba(255,255,255,.12);
  background:
     radial-gradient(120% 140% at var(--mx, 50%) var(--my, 20%), rgba(255,255,255,.12), transparent 58%),
     radial-gradient(120% 120% at 90% 110%, rgba(225,29,46,.07), transparent 66%),
     linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.03));    
  backdrop-filter: blur(14px) saturate(1.25);
  -webkit-backdrop-filter: blur(14px) saturate(1.25);
  box-shadow:
    0 18px 55px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.10);
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

/* Keep content above the glass overlays */
.prl-home :is(
  .prl-card,
  .prl-step,
  .prl-tile,
  .prl-popular-card,
  .prl-fact,
  .prl-media-stat,
  .prl-badge-inner,
  .prl-visual-card
) > *{
  position: relative;
  z-index: 1;
}

/* Grain */
.prl-home :is(
  .prl-card,
  .prl-step,
  .prl-tile,
  .prl-popular-card,
  .prl-fact,
  .prl-media-stat,
  .prl-badge-inner,
  .prl-visual-card
)::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.07;
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,.06) 0 1px, rgba(0,0,0,0) 1px 3px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, rgba(0,0,0,0) 1px 4px);
  mix-blend-mode: overlay;
}

/* Specular sheen (hover + on-enter) */
.prl-home :is(
  .prl-card,
  .prl-step,
  .prl-tile,
  .prl-popular-card,
  .prl-fact,
  .prl-media-stat,
  .prl-badge-inner,
  .prl-visual-card
)::after{
  content:"";
  position:absolute;
  inset:-40%;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(115deg, transparent 32%, rgba(255,255,255,.12) 46%, transparent 62%);
  transform:translateX(-45%) rotate(8deg);
  transition: opacity .35s ease, transform .45s ease;
  will-change: opacity, transform;
}

.prl-home :is(
  .prl-card,
  .prl-step,
  .prl-tile,
  .prl-popular-card,
  .prl-fact,
  .prl-media-stat,
  .prl-badge-inner,
  .prl-visual-card
):hover::after,
.prl-home :is(
  .prl-card,
  .prl-step,
  .prl-tile,
  .prl-popular-card,
  .prl-fact,
  .prl-media-stat,
  .prl-badge-inner,
  .prl-visual-card
).prl-glint::after{
  opacity:.55;
  animation: prlSheen 1.15s ease-out;
}

@keyframes prlSheen{
  from{ transform:translateX(-55%) rotate(8deg); }
  to  { transform:translateX(55%) rotate(8deg); }
}

/* Active story step slightly stronger edge */
.prl-step.active{
  border-color: rgba(225,29,46,.40);
  box-shadow:
    0 18px 55px rgba(0,0,0,.30),
    0 0 0 1px rgba(225,29,46,.10) inset,
    inset 0 1px 0 rgba(255,255,255,.12);
}

/* Respect reduced motion (disable sheen) */
@media (prefers-reduced-motion: reduce){
  .prl-home :is(
    .prl-card,
    .prl-step,
    .prl-tile,
    .prl-popular-card,
    .prl-fact,
    .prl-media-stat,
    .prl-badge-inner,
    .prl-visual-card
  )::after{
    animation:none !important;
    opacity:0 !important;
  }
}

/* Global spotlights overlay (fixed, always visible) */
.prl-spotlights{
  position: fixed;
  inset: -240px;
  z-index: 0;
  pointer-events: none;

  /* red + white feel */
  background:
    radial-gradient(900px 520px at 78% 18%, rgba(204,0,0,.35), rgba(0,0,0,0) 60%),
    radial-gradient(700px 460px at 20% 12%, rgba(235,241,255,.14), rgba(0,0,0,0) 62%),
    radial-gradient(900px 700px at 50% 85%, rgba(204,0,0,.18), rgba(0,0,0,0) 65%);
  opacity: .95;
  transform: translate3d(0,0,0) scale(1.28);
  transform-origin: 50% 40%;
  will-change: transform, filter;
}

/* Page-content on top of spotlights */
.prl-home, .prl-hero, main, header, footer{
  position: relative;
  z-index: 1;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .prl-spotlights{ display:none; }
}

/* Mobile KPI chips can not change visual-card lenght */
@media (max-width: 980px) {

  .prl-visual{
    height: 360px;
    padding: 18px 16px;
    align-items: flex-end;
  }

  /* Inner card always within the visual */
  .prl-visual-card{
    width: 100%;
    max-width: 100%;
    transform: none;
  }

  /* KPI chips no wrap */
  .prl-visual-kpis{
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    gap: 8px;
    min-height: 34px;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
    scrollbar-width: none;
  }
  .prl-visual-kpis::-webkit-scrollbar{ display:none; }

  .prl-visual-kpis .prl-kpi{
    flex: 0 0 auto;
    white-space: nowrap;
  }
}

/* Mobile horizontal overflow + centered visual card */
@media (max-width: 980px) {

  /* Kill horizontal overflow for the story section */
  [data-story],
  [data-story] * {
    box-sizing: border-box;
    max-width: 100%;
  }

  /* Clip anything that still tries to exceed viewport */
  [data-story] {
    overflow-x: clip;
  }
  /* fallback for browsers without overflow-x= clip */
  @supports not (overflow-x: clip) {
    [data-story] { overflow-x: hidden; }
  }

  /* Make the visual wrapper fully viewport-safe */
  .prl-visual {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;

    /* Center horizontally, keep it bottom aligned */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
  }

  /* Step-media element visual background container */
  [data-step-media] {
    width: 100%;
    max-width: 100%;
  }

  /* Force the inner glass card to center properly */
  .prl-visual-card {
    margin-left: auto;
    margin-right: auto;
  }
}

/* Story grid prevent children expand grid (min-width:auto -> overflow) */
.prl-story-grid > *{
  min-width: 0;
}

/* Steps and text may always wrap */
.prl-steps,
.prl-step,
.prl-step-title,
h2.prl-h2{
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  color: #EFD09E;
}

.prl-step-desc{
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  color: #F5F1E8;
}

.prl-muted{
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  color: #F5F1E8;
}