:root{
    --accent: #ffd24a;
    --glass: rgba(255,255,255,0.06);
    --text: #f8f9fb;
    --muted: rgba(255,255,255,0.75);
  }
  *{box-sizing:border-box}
  body{
    margin:0;
    font-family: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
    background:#08080a;
    color:var(--text);
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
  }

  /* Container */
  .hero-wrap{
    width:100%;
    max-width:1600px;
    margin:28px auto;
    padding:0 20px;
  }

  h1,h2,p{margin:0;padding:0}

  /* ===== Revo-style Hero Slider ===== */
  .revo {
    width:100%;
    height:720px;
    border-radius:14px;
    overflow:hidden;
    position:relative;
    box-shadow:0 30px 80px rgba(2,6,23,0.7);
    background:linear-gradient(180deg,#070709 0%, #0b0b0c 100%);
  }

  /* Swiper wrapper fills container */
  .revo .swiper-wrapper,
  .revo .swiper-slide { height:100%; }

  /* Slide base */
  .revo .slide {
    position:relative;
    height:100%;
    width:100%;
    overflow:hidden;
    display:flex;
    align-items:center;
  }

  /* Background layers (ken burns applied) */
  .bg-layer {
    position:absolute;
    inset:0;
    background-position:center;
    background-size:cover;
    transform-origin:center center;
    will-change:transform, filter;
  }

  /* mid layer for depth */
  .mid-layer {
    position:absolute;
    inset:0;
    background-position:center;
    background-size:cover;
    opacity:0.25;
    mix-blend-mode:overlay;
    pointer-events:none;
  }

  /* dark overlay for legibility */
  .dark-overlay {
    position:absolute;
    inset:0;
    background:linear-gradient(90deg, rgba(212, 211, 211, 0.78) 0%, rgba(202, 200, 200, 0.42) 60%);
    z-index:3;
    pointer-events:none;
    backdrop-filter: blur(2px) saturate(1.05);
  }

  /* Content column */
  .slide-content {
    position:relative;
    z-index:5;
    width:55%;
    padding-left:6%;
    max-width:820px;
    color:var(--text);
    transform:translateY(0);
  }

  .eyebrow{
    display:inline-block;
    background:rgba(255,255,255,0.04);
    color:var(--muted);
    padding:8px 12px;
    border-radius:999px;
    font-size:13px;
    margin-bottom:18px;
    backdrop-filter: blur(6px);
  }

  .title {
    font-size:64px;
    line-height:1.02;
    font-weight:800;
    letter-spacing:-1px;
    margin-bottom:14px;
    color:var(--text);
    word-wrap:break-word;
  }

  .subtitle{
    font-size:20px;
    color:rgba(255,255,255,0.85);
    margin-bottom:22px;
    max-width:680px;
  }

  .cta-row{
    display:flex;
    gap:16px;
    align-items:center;
  }

  .btn-primary{
    background:linear-gradient(90deg,var(--accent), #f4b400);
    color:#0b0b0b;
    padding:14px 26px;
    border-radius:8px;
    font-weight:700;
    text-decoration:none;
    box-shadow:0 8px 30px rgba(255,210,74,0.15);
    transform:translateZ(0);
  }

  .btn-ghost{
    border:1px solid rgba(255,255,255,0.14);
    color:var(--text);
    padding:12px 22px;
    border-radius:8px;
    text-decoration:none;
    backdrop-filter: blur(6px);
    background:linear-gradient(180deg, rgba(255,255,255,0.02), transparent);
  }

  /* Foreground glass shapes (parallax) */
  .fg-shape{
    position:absolute;
    z-index:6;
    pointer-events:none;
    filter: blur(10px) saturate(1.2);
    opacity:0.85;
    mix-blend-mode:screen;
  }
  .shape-1{
    width:220px;height:220px;border-radius:36px;
    right:6%; top:12%;
    background:linear-gradient(180deg, rgba(255,214,74,0.14), rgba(255,214,74,0.06));
    box-shadow:0 40px 120px rgba(255,214,74,0.08);
  }
  .shape-2{
    width:160px;height:160px;border-radius:40px;
    left:8%; bottom:12%;
    background:linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));
    box-shadow:0 20px 80px rgba(0,0,0,0.45);
  }

  /* Pagination and nav */
  .swiper-pagination{
    position:absolute;
    z-index:20;
    left:24px;
    bottom:22px;
    display:flex;
    gap:8px;
    align-items:center;
  }
  .swiper-pagination-bullet{
    width:10px;height:10px;border-radius:999px;background:rgba(255,255,255,0.12);
    transition:all .3s ease;
    border:1px solid rgba(255,255,255,0.06);
  }
  .swiper-pagination-bullet-active{
    width:44px;
    border-radius:22px;
    background:linear-gradient(90deg,var(--accent), #f4b400);
    box-shadow:0 8px 30px rgba(255,210,74,0.12);
  }

  /* Navigation arrows */
  .swiper-button-next, .swiper-button-prev {
    color:var(--text);
    width:48px;height:48px;border-radius:12px;background:rgba(0,0,0,0.35);
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 10px 30px rgba(2,6,23,0.6);
  }
  .swiper-button-next:after, .swiper-button-prev:after { font-size:18px;opacity:0.95 }

  /* Responsive */
  @media (max-width:1100px){
    .revo{height:640px}
    .title{font-size:46px}
    .slide-content{width:62%}
  }
  @media (max-width:800px){
    .revo{height:620px;border-radius:0}
    .slide-content{width:86%;left:6%;padding-left:0}
    .title{font-size:34px}
    .subtitle{font-size:16px}
    .shape-1{display:none}
  }
  @media (max-width:480px){
    .revo{height:560px}
    .title{font-size:28px}
    .subtitle{font-size:14px}
  }