@font-face{font-family:'Barlow';src:url('img/fonts/Barlow-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;}
  @font-face{font-family:'Barlow';src:url('img/fonts/Barlow-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap;}
  @font-face{font-family:'Barlow';src:url('img/fonts/Barlow-SemiBold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap;}
  @font-face{font-family:'Barlow';src:url('img/fonts/Barlow-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;}
  @font-face{font-family:'Inter';src:url('img/fonts/Inter.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap;}


  html{font-size:min(1px, 100vw / 1366);}

  :root{
    --bg:#161616;
    --card-teal:#003D3F;    
    --promo-bg:#1A1A1A;     
    --yellow:#FCFC42;
    --teal:#0CBEC2;
    --ink:#161616;
    --white:#FFFFFF;
    --text-soft:#FCF7FF;
    --grey60:#999999;
    --grey-ed:#EDEDED;
    --line:#262626;          
    --dark-btn:#0F0F0F;
    --chip:#D2D2D2;
    --chip-ink:#0D1225;
    --store-ink:#F6F7F9;
    --grad-border:linear-gradient(180deg, #262626 0%, #0CBEC2 100%);

    --grad-card:linear-gradient(218.727deg, rgba(12,190,194,.2) 14.044%, rgba(12,190,194,0) 74.747%);
    --grad-promo:linear-gradient(234.323deg, rgba(12,190,194,.2) 14.044%, rgba(12,190,194,0) 74.747%);

    --display:'Barlow','Inter',sans-serif;
    --body:'Barlow',sans-serif;
    --cond:'Barlow',sans-serif;
  }

  *{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--bg);
    color:var(--white);
    font-family:var(--body);
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  img{display:block;max-width:100%;}
  a{color:inherit;text-decoration:none;}
  button{font-family:inherit;}
  h1,h2,h3,.display{font-family:var(--display);font-weight:700;}

  .wrap{width:min(1366rem, 100%);margin:0 auto;}

  .btn{
    display:inline-flex;align-items:center;justify-content:center;
    background:var(--yellow);color:var(--ink);
    font-family:var(--body);font-weight:500;font-size:22rem;line-height:1.5;
    border:1.007rem solid var(--yellow);border-radius:8rem;
    padding:22.098rem 29.463rem;cursor:pointer;white-space:nowrap;
    transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
  }
  .btn:hover{transform:translateY(-2rem);box-shadow:0 10rem 28rem rgba(252,252,66,.28);filter:brightness(1.03);}
  .btn:active{transform:translateY(0) scale(.985);}
  .btn:disabled{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none;}
  .btn:focus-visible,a:focus-visible{outline:2rem solid var(--teal);outline-offset:3rem;border-radius:8rem;}
  a.promo-icon:focus-visible{outline:none;}

  .section-title{
    font-family:var(--display);font-weight:700;font-size:58rem;line-height:1.5;
    text-transform:uppercase;text-align:center;color:var(--white);width:100%;
  }
  .vezi-toate{
    font-family:var(--body);font-weight:400;font-size:30rem;line-height:1.5;
    color:var(--teal);transition:opacity .18s ease;
  }
  .vezi-toate:hover{opacity:.75;}

 
  .navbar{position:relative;z-index:6;width:min(1366rem, 100%);margin:0 auto;
           padding:26rem 47rem 0;height:auto;display:flex;align-items:center;}
  .navbar .logo{display:block;}
  .navbar .logo img{height:59rem;width:auto;filter:drop-shadow(0 2rem 10rem rgba(0,0,0,.45));}
  .mobile-bar{display:none;}

  
  .hero{position:relative;background:#0E0C08;overflow:hidden;}
  .hero-bg{
    position:absolute;inset:0;z-index:0;pointer-events:none;
    background:url("img/background-desktop.png") center top / cover no-repeat;
  }
  /* umbra pe laterale — inchide marginile imaginii spre fundalul paginii */
  .hero-bg::before{
    content:"";position:absolute;inset:0;pointer-events:none;
        background: linear-gradient(90deg, #161616 0%, rgba(22, 22, 22, .92) 12%, rgba(22, 22, 22, 0) 42%), 
        linear-gradient(270deg, #161616 0%, rgba(22, 22, 22, .92) 3%, rgba(22, 22, 22, 0) 15%);
  }
  .hero-bg::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:180rem;
    background:linear-gradient(180deg,rgba(22,22,22,0) 0%,#161616 100%);
  }
  .hero-stage{position:relative;z-index:2;width:min(1366rem, 100%);height:1010rem;margin:0 auto;}
  .hero-stage h1{
    position:absolute;left:47rem;top:34rem;width:720rem;
    font-size:70.46rem;line-height:1.2;text-transform:uppercase;color:var(--white);
    text-shadow:0 4rem 100rem #000;
  }
  .hero-stage .hero-btn{
    position:absolute;left:47rem;top:366rem;
    width:408.039rem;height:76.88rem;padding:29.146rem 34.975rem;
    font-weight:600;letter-spacing:-0.44rem;line-height:normal;
    filter:drop-shadow(0 8rem 7rem #211910);
  }
  
  :root{ --wheel:676rem; --wheel-cx:938rem; --wheel-cy:500rem; }

  .wheel-glow-img{
    position:absolute;left:50%;top:50%;
    width:200%;height:200%;max-width:none;
    transform:translate(-50%,-50%) rotate(24.62deg);
    transform-origin:50% 50%;
    mix-blend-mode:plus-lighter;opacity:.95;
    z-index:0;pointer-events:none;user-select:none;
    object-fit:contain;
    animation:glowDrift 90s linear infinite;
  }
  @keyframes glowDrift{
    from{transform:translate(-50%,-50%) rotate(24.62deg);}
    to{transform:translate(-50%,-50%) rotate(384.62deg);}
  }
  .hero-stage:has(.wheel-zone.spinning) .wheel-glow-img{animation-duration:18s;}
  .wheel-zone{
    position:absolute;z-index:2;
    width:var(--wheel);height:var(--wheel);
    left:calc(var(--wheel-cx) - var(--wheel) / 2);
    top:calc(var(--wheel-cy) - var(--wheel) / 2);
  }
  .wheel-svg,
  .wheel-png{
    position:relative;z-index:1;width:100%;height:100%;display:block;overflow:visible;
    filter:drop-shadow(0 0 14rem rgba(252,252,66,.85)) drop-shadow(0 0 42rem rgba(252,252,66,.5)) drop-shadow(0 0 105rem rgba(252,252,66,.3));
    transition:filter .6s ease;
  }
  .wheel-zone.spinning .wheel-svg,
  .wheel-zone.won .wheel-svg,
  .wheel-zone.spinning .wheel-png,
  .wheel-zone.won .wheel-png{
    filter:drop-shadow(0 0 18rem rgba(252,252,66,1)) drop-shadow(0 0 55rem rgba(252,252,66,.62)) drop-shadow(0 0 130rem rgba(252,252,66,.4));
  }
  #wheel-rotor{transform-origin:250px 250px;will-change:transform;}
  .seg-label{font-family:var(--display);font-weight:700;}
  #start-hit{cursor:pointer;outline:none;}
  #start-hit:focus{outline:none;}
  #start-hit:hover .start-face{transform:scale(1.05);}
  #start-hit:focus-visible .start-ring{stroke:var(--teal);}
  .start-face{transform-origin:250px 250px;transition:transform .18s ease;}
  #win-flash{opacity:0;pointer-events:none;}
  .wheel-zone.won #win-flash{animation:winFlash 1.9s ease-in-out;}
  @keyframes winFlash{0%,100%{opacity:0;}12%,38%,68%{opacity:.6;}25%,52%,86%{opacity:.08;}}

  .lose-toast{
    position:absolute;left:50%;bottom:-40rem;transform:translateX(-50%) translateY(8rem);
    background:#191919;border:1rem solid rgba(12,190,194,.55);color:var(--white);
    font-size:20rem;font-weight:500;white-space:nowrap;
    padding:16rem 26rem;border-radius:10rem;opacity:0;pointer-events:none;
    transition:opacity .3s ease, transform .3s ease;z-index:5;
    box-shadow:0 12rem 30rem rgba(0,0,0,.5);
  }
  .lose-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}


  .games{display:flex;flex-direction:column;gap:67rem;}
  .game-block{display:flex;flex-direction:column;align-items:center;gap:25rem;padding:0;}
 
  .row-head{width:1349rem;max-width:100%;}
  .row-head.right{text-align:right;}
  .row-head.left{text-align:left;}
  .card-row{display:flex;gap:18rem;align-items:center;}

  .feature{
    position:relative;width:607rem;height:477rem;flex:none;
    border:0;border-radius:14rem;overflow:hidden;isolation:isolate;
    background:var(--grad-card), var(--card-teal);
    transition:transform .22s ease, box-shadow .22s ease;
  }
  /* contur gradient care urmeaza exact colturile rotunjite */
  .feature::after{
    content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
    border-radius:inherit;padding:1.219rem;background:var(--grad-border);
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask-composite:exclude;
  }
  .feature img.bgart{
    position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;
    transition:transform .5s ease;
  }
  .feature:hover{transform:translateY(-4rem);box-shadow:0 18rem 42rem rgba(0,0,0,.55);}
  .feature:hover img.bgart{transform:scale(1.035);}
  .f-top{
    position:absolute;left:56.78rem;top:43.78rem;right:62.85rem;z-index:1;
    display:flex;flex-direction:column;gap:19.5rem;align-items:flex-start;
  }
  .f-icon{display:block;width:56rem;height:56rem;flex:none;}
  .f-icon png,.f-icon img{width:100%;height:100%;}
  .f-title{
    font-family:var(--display);font-weight:700;font-size:50rem;line-height:1.2;
    text-transform:uppercase;color:var(--white);display:block;
  }
  .feature .btn{
    position:absolute;left:50%;transform:translateX(-50%);top:349.78rem;
    width:498.932rem;height:76.875rem;padding:21.938rem 29.25rem;z-index:1;
  }
  .feature .btn:hover{transform:translateX(-50%) translateY(-2rem);box-shadow:0 8rem 26rem rgba(252,252,66,.35);}

  .tiles{
    display:flex;flex-wrap:wrap;align-content:flex-start;
    width:724rem;height:477rem;gap:18rem 17rem;overflow:hidden;flex:none;
  }
  .tile{
    position:relative;width:230rem;height:230rem;flex:none;
    border-radius:6rem;overflow:hidden;display:block;
    transition:transform .22s ease, box-shadow .22s ease;
  }
  .tile img{width:100%;height:100%;object-fit:cover;}
  .tile::after{
    content:"";position:absolute;inset:0;border-radius:6rem;
    box-shadow:inset 0 0 0 0 rgba(252,252,66,0);transition:box-shadow .22s ease;
  }
  .tile:hover{transform:translateY(-4rem) scale(1.02);box-shadow:0 14rem 30rem rgba(0,0,0,.55);}

 
  .deco-zone{
    position:relative;
    background-color:var(--bg);
  }
  /* patternul incepe sub butoanele cardurilor si apare cu tranzitie (mask gradient) */
  .deco-zone::before{
    content:"";position:absolute;left:0;right:0;bottom:11%;height:865rem;
    z-index:0;pointer-events:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='340' height='340' viewBox='0 0 340 340'%3E%3Cg fill='none' stroke='%230CBEC2' stroke-opacity='.13' stroke-width='2.6' stroke-linejoin='round'%3E%3Cg transform='translate%2818 10%29 rotate%28-12 50 50%29 scale%280.78%29'%3E%3Cpath d='M50 12C50 12 14 42 14 60c0 11 8 18 17 18 6 0 11-3 14-8 0 9-4 17-10 21h30c-6-4-10-12-10-21 3 5 8 8 14 8 9 0 17-7 17-18 0-18-36-48-36-48z'/%3E%3C/g%3E%3Cg transform='translate%28196 34%29 rotate%2810 50 50%29 scale%280.62%29'%3E%3Cpath d='M50 88C30 72 12 57 12 39c0-12 10-20 20-20 8 0 14 4 18 12 4-8 10-12 18-12 10 0 20 8 20 20 0 18-18 33-38 49z'/%3E%3C/g%3E%3Cg transform='translate%2868 182%29 rotate%288 50 50%29 scale%280.72%29'%3E%3Ccircle cx='50' cy='33' r='15'/%3E%3Ccircle cx='31' cy='58' r='15'/%3E%3Ccircle cx='69' cy='58' r='15'/%3E%3Cpath d='M43 68c0 10-3 18-8 23h30c-5-5-8-13-8-23'/%3E%3C/g%3E%3Cg transform='translate%28232 196%29 rotate%28-9 50 50%29 scale%280.66%29'%3E%3Cpath d='M50 10 84 50 50 90 16 50z'/%3E%3C/g%3E%3Cg transform='translate%28112 96%29 rotate%2816 50 50%29 scale%280.5%29'%3E%3Cpath d='M50 88C30 72 12 57 12 39c0-12 10-20 20-20 8 0 14 4 18 12 4-8 10-12 18-12 10 0 20 8 20 20 0 18-18 33-38 49z'/%3E%3C/g%3E%3Cg transform='translate%28274 110%29 rotate%287 50 50%29 scale%280.5%29'%3E%3Cpath d='M50 12C50 12 14 42 14 60c0 11 8 18 17 18 6 0 11-3 14-8 0 9-4 17-10 21h30c-6-4-10-12-10-21 3 5 8 8 14 8 9 0 17-7 17-18 0-18-36-48-36-48z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-repeat:repeat;
    background-size:340rem 340rem;
    background-position:center bottom;
    -webkit-mask-image:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.55) 22%, #000 44%, #000 100%);
    mask-image:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.55) 22%, #000 44%, #000 100%);
  }
  .promos,.app-band{position:relative;z-index:1;}
  .promos{display:flex;flex-direction:column;align-items:center;gap:50rem;padding:10rem;margin-top:121rem;}
  /* cadru promoții — 1366×972 în machetă desktop */
  @media (min-width:861px){ .promos{height:972rem;} }
  .promos-inner{display:flex;flex-direction:column;align-items:center;gap:25rem;width:100%;}
  /* 102 = spațiul rezervat deasupra cardurilor pentru ilustrațiile care ies în afară */
  .promo-grid{display:flex;gap:20rem;justify-content:center;padding-top:102rem;}
  /* card promoție — 433×591, radius 8.058, bordură 1.228 #262626, gap 26.19 */
  .promo{
    position:relative;width:433rem;height:591rem;flex:none;
    border-radius:8.058rem;padding-bottom:30rem;
    display:flex;flex-direction:column;align-items:center;gap:26.19rem;
    border:1.228rem solid transparent;
background:
  var(--grad-promo) padding-box,
  linear-gradient(var(--promo-bg),var(--promo-bg)) padding-box,
  var(--grad-border) border-box;
    transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease;
      justify-content: space-between;
  }
  .promo:hover{transform:translateY(-5rem);border-color:rgba(12,190,194,.6);box-shadow:0 14rem 34rem rgba(0,0,0,.45);}
  .promo-icon{
    position:relative;display:block;width:100%;height:276rem;flex:none;background:var(--bg);
    border-radius:7rem 7rem 0 0;cursor:pointer;
  }
  .promo-icon img{
    position:absolute;left:50%;max-width:none;
    filter:drop-shadow(0 16rem 26rem rgba(0,0,0,.55));
    transition:filter .25s ease;
  }
  .promo:hover .promo-icon img{filter:drop-shadow(0 16rem 30rem rgba(12,190,194,.35));}
  .promo-icon.i-crown img{width:330rem;height:330rem;top:-57rem;margin-left:-165rem;}
  .promo-icon.i-777   img{width:482.183rem;height:283.432rem;top:-55rem;margin-left:-241.09rem;transform:rotate(-7.4deg);}
  .promo-icon.i-gift img{width:300rem;height:351rem;top:-72rem;margin-left:-150rem;
    filter:drop-shadow(0 16rem 26rem rgba(0,0,0,.55));}
  .promo-text{width:315rem;min-height:119.07rem;display:flex;flex-direction:column;gap:9.066rem;text-align:center;}
  .promo-text h3{font-size:30rem;line-height:1.5;text-transform:uppercase;color:var(--teal);}
  .promo-text p{font-size:22rem;line-height:1.5;color:var(--text-soft);font-weight:400;}
  .promo .btn{width:209.518rem;}
  .promos .btn-wide{width:498.93rem;height:77rem;padding:21.938rem 29.25rem;}

  .app-band{position:relative;background:var(--yellow);color:var(--ink);height:331rem;overflow:hidden;margin-top:300rem;}
  .app-copy{
    position:absolute;left:277rem;top:49rem;width:611rem;padding:10rem;z-index:2;
    display:flex;flex-direction:column;gap:38rem;align-items:flex-start;
  }
  .app-text{display:flex;flex-direction:column;gap:5rem;color:var(--ink);}
  .app-text h2{font-size:40rem;line-height:1.5;text-transform:uppercase;}
  .app-text p{font-size:18rem;line-height:1.5;font-weight:400;}
  .store-btns{display:flex;gap:28.118rem;align-items:center;width:476.25rem;}
  .store-btn{
    display:flex;align-items:center;gap:14.059rem;
    width:224.945rem;height:70.295rem;padding:7.03rem 14.059rem;
    background:var(--dark-btn);border-radius:8rem;color:var(--store-ink);
    transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
  }
  .store-btn:hover{transform:translateY(-2rem);box-shadow:0 12rem 26rem rgba(0,0,0,.35);background:#1B1B1B;}
  .store-btn img{width:42.177rem;height:42.177rem;flex:none;}
  .store-btn .s-txt{display:flex;flex-direction:column;min-width:0;}
  .store-btn .s-txt small{font-family:var(--body);font-weight:400;font-size:17.574rem;line-height:normal;}
  .store-btn .s-txt strong{font-family:var(--cond);font-weight:700;font-size:24.603rem;line-height:normal;}

  .app-phone{
    position:absolute;left:705rem;top:0;
    width:835rem;height:331rem;max-width:none;
    z-index:1;pointer-events:none;user-select:none;
  }
  footer{
    background:var(--bg);padding:52rem 47rem 36rem;margin-bottom:0;
    display:flex;flex-direction:column;gap:30rem;height:auto;
    position:relative;z-index:0;
  }

  .foot-row{display:flex;justify-content:space-between;align-items:center;}
  .foot-legal{font-size:18rem;line-height:1.5;color:var(--grey60);font-weight:400;}
  .foot-badges{display:flex;align-items:center;gap:24rem;height:auto;padding-left:12rem;padding-right:16rem;}
  .badge-circle{
    width:64rem;height:64rem;border-radius:50%;flex:none;
    display:flex;align-items:center;justify-content:center;
    font-family:var(--display);font-weight:700;font-size:22rem;
  }

  .badge-18{border:3rem solid var(--white);color:var(--white);}
  .badge-onjn{width:65rem;background:var(--white);color:#12275C;font-size:16rem;}
  .foot-badges .b-note{font-size:14rem;line-height:18rem;letter-spacing:.28rem;color:var(--grey-ed);font-weight:400;}
  .foot-div{border:0;border-top:1rem solid var(--line);width:100%;margin:0;}
  .foot-copy{font-size:18rem;line-height:1.5;color:var(--grey60);font-weight:400;}
  .lic-chips{display:flex;gap:16rem;align-items:center;}
  .chip-app{
    display:flex;align-items:center;gap:8rem;
    width:128rem;height:40rem;padding:4rem 8rem;border-radius:8rem;
    background:var(--chip);opacity:.8;color:var(--chip-ink);
    transition:opacity .18s ease;
  }
  .chip-app:hover{opacity:1;}
  .chip-app img{width:24rem;height:24rem;flex:none;filter:brightness(0);}
  .chip-app .c-txt{display:flex;flex-direction:column;min-width:0;}
  .chip-app .c-txt small{font-family:var(--cond);font-weight:400;font-size:10rem;line-height:normal;}
  .chip-app .c-txt strong{font-family:var(--cond);font-weight:700;font-size:14rem;line-height:normal;}

  .modal-overlay{
    position:fixed;inset:0;background:rgba(8,8,8,.78);backdrop-filter:blur(4px);
    display:flex;align-items:center;justify-content:center;z-index:60;
    opacity:0;pointer-events:none;transition:opacity .3s ease;padding:20rem;
  }
  .modal-overlay.open{opacity:1;pointer-events:auto;}
  .modal{
    position:relative;width:472rem;
    background:#1C1C1C;border:1rem solid #2A2A2A;border-radius:16rem;
    padding:58rem 44rem 62rem;text-align:center;overflow:hidden;
    display:flex;flex-direction:column;align-items:center;
    transform:translateY(14rem) scale(.96);transition:transform .3s ease;
    box-shadow:0 30rem 80rem rgba(0,0,0,.7);
  }
  .modal-overlay.open .modal{transform:translateY(0) scale(1);background: linear-gradient(226deg, rgba(12, 190, 194, 0.20) -14.04%, rgba(12, 190, 194, 0.00) 74.75%), #1A1A1A;

}
  .modal .m-logo{width:150rem;height:auto;margin:0 0 62rem;}
  .modal-x{
    position:absolute;top:16rem;right:16rem;width:36rem;height:36rem;border-radius:50%;
    background:transparent;border:1rem solid #3A3A3A;color:#8A8A8A;font-size:16rem;
    cursor:pointer;transition:border-color .18s, color .18s, transform .18s;z-index:2;
  }
  .modal-x:hover{border-color:var(--teal);color:var(--white);transform:rotate(90deg);}
  .modal h3{
    color:var(--white);font-size:64rem;line-height:1.1;text-transform:uppercase;
    letter-spacing:-1rem;
  }
  .modal .m-sub{
    color:var(--yellow);font-family:var(--body);font-weight:500;
    font-size:24rem;line-height:1.5;margin-top:10rem;
  }
  .modal .btn{width:100%;margin-top:58rem;animation:btnPulse 1.5s ease-in-out infinite;}
  @keyframes btnPulse{
    0%,100%{box-shadow:0 0 0 0 rgba(252,252,66,.55);transform:scale(1);}
    50%{box-shadow:0 0 0 14rem rgba(252,252,66,0);transform:scale(1.02);}
  }
  #confetti{position:fixed;inset:0;pointer-events:none;z-index:70;}

  @media (max-width:860px){

    .foot-badges img {
        width: 40px;
    }

    html{font-size:min(1.45px, 100vw / 375);}
    .wrap{width:100%;}

    .navbar{display:none;}
    .mobile-bar{
      display:flex;align-items:center;justify-content:center;background:transparent;
      height:59rem;padding:0 16rem;position:relative;z-index:5;
    }
    /* SVG-ul are viewBox 1367x59, dar grafica ocupa doar primii ~143 —
       decupam restul ca logo-ul sa poata fi centrat efectiv */
    .mobile-bar .logo{display:block;flex:none;width:92.4rem;height:38rem;overflow:hidden;}
    .mobile-bar .logo img{height:38rem;width:880.4rem;max-width:none;}

    .hero-bg{
      background-image:url("img/background-mobile.png");

    }
    /* pe ecran ingust procentele de pe desktop ar acoperi aproape toata latimea */
    .hero-bg::before{
            background: linear-gradient(89deg, rgba(22, 22, 22, .9) 0%, rgba(22, 22, 22, 0) 8%), 
            linear-gradient(271deg, rgba(22, 22, 22, .9) 0%, rgba(22, 22, 22, 0) 8%), 
            linear-gradient(333deg, rgba(22, 22, 22, .9) 0%, rgba(22, 22, 22, 0) 30%), 
            linear-gradient(186deg, rgba(22, 22, 22, .9) 22%, rgba(22, 22, 22, 0) 57%);
    }
    .hero-stage{
      width:100%;height:auto;
      display:flex;flex-direction:column;align-items:center;
      padding:30rem 8rem 40rem;
    }
    .hero-stage h1{
      position:static;width:355rem;max-width:100%;font-size:32rem;line-height:1.2;
      text-align:center;margin-bottom:8rem;z-index: 1;
    }
    .wheel-zone{position:relative;left:auto;top:auto;width:356rem;height:356rem;margin:10rem 0 34rem;z-index:0;}
    .wheel-glow-img{width:185%;height:185%;opacity:.4;}
    .hero-stage .hero-btn{
      position:static;width:288rem;height:55.65rem;padding:16rem 20rem;
      font-size:16rem;letter-spacing:-0.32rem;
    }
    .lose-toast{bottom:-72rem;font-size:13rem;white-space:normal;text-align:center;width:300rem;}

    .games{gap:30rem;padding:0;}
    .game-block{gap:14rem;padding:0;align-items:stretch;}
    .row-head{width:100%;max-width:100%;padding:0 8rem;}
    .row-head.left{text-align:right;}
    .vezi-toate{font-size:13rem;}
    .section-title{font-size:26rem;padding:0 8rem;}
    .card-row{
      gap:10rem;overflow-x:auto;overflow-y:hidden;
      -webkit-overflow-scrolling:touch;
      touch-action:pan-x;
      overscroll-behavior-x:contain;
      scrollbar-width:none;align-items:flex-start;
      padding:0 8rem 4rem;
    }
    .card-row::-webkit-scrollbar{display:none;}
    .card-row.flip{flex-direction:row-reverse;justify-content:flex-end;}
    .feature{width:172rem;height:263rem;border-radius:8rem;}
    .f-top{left:14rem;top:16rem;right:12rem;gap:10rem;}
    .f-icon{width:26rem;height:26rem;}
    .f-title{font-size:22rem;}
    .feature .btn{top:196rem;width:144rem;height:38rem;padding:10rem 12rem;font-size:12rem;border-radius:6rem;}
    .tiles{
      display:grid;grid-auto-flow:column;
      grid-template-rows:repeat(2,126.5rem);
      grid-auto-columns:126.5rem;
      gap:10rem;width:auto;height:auto;flex:none;
      overflow:visible;
    }
    .tile{width:100%;height:100%;border-radius:6rem;}

    .promos{margin-top:44rem;gap:22rem;padding:0 8rem;}
    .deco-zone::before{height:520rem;background-size:220rem 220rem;}
    .promos-inner{gap:16rem;}
    .promo-grid{flex-direction:column;gap:78rem;width:80%;padding-top:64rem;}
    .promo{width:100%;height:auto;padding-bottom:24rem;gap:14rem;border-radius:8rem;}
    .promo-icon{height:150rem;}
    .promo-icon.i-crown img{width:180rem;height:180rem;top:-30rem;margin-left:-90rem;}
    .promo-icon.i-777   img{width:262rem;height:154rem;top:-28rem;margin-left:-131rem;}
    .promo-icon.i-gift  img{width:172rem;height:201rem;top:-46rem;margin-left:-86rem;}
    .promo-text{width:auto;min-height:0;padding:0 20rem;gap:6rem;}
    .promo-text h3{font-size:16rem;}
    .promo-text p{font-size:13rem;}
    .btn{font-size:13rem;padding:12rem 18rem;border-radius:6rem;}
    .promo-icon{border-radius:7rem 7rem 0 0;}
    .promo .btn{width:110rem;margin-bottom:0;}
    .promos .btn-wide{width:80%;height:44rem;padding:12rem 18rem;}

    .app-band{height:auto;margin-top:60rem;padding:22rem 16rem 0;}
    .app-copy{position:static;width:100%;padding:0;gap:16rem;}
    .app-text h2{font-size:18rem;}
    .app-text p{font-size:11rem;max-width:200rem;}
    .store-btns{flex-direction:column;align-items:flex-start;gap:8rem;width:auto;}
    .store-btn{width:120rem;height:36rem;gap:6rem;padding:4rem 7rem;border-radius:5rem;}
    .store-btn img{width:20rem;height:20rem;}
    .store-btn .s-txt small{font-size:8rem;}
    .store-btn .s-txt strong{font-size:12rem;}
    .app-phone{
      position: relative;
        right: auto;
        top: -20%;
        transform: rotate(2deg);
        width: 260rem;
        margin: -34rem -10rem -8rem auto;
        height: auto;
        left: 0;
    }

    footer{height:auto;padding:26rem 16rem 22rem;gap:16rem;}
    .foot-row{flex-direction:column;align-items:center;gap:14rem;width:100%;text-align:center;}
    .foot-legal{font-size:9rem;}
    .foot-copy{font-size:9rem;}
    .foot-badges{height:auto;padding:0;gap:12rem;}
    .badge-circle{width:34rem;height:34rem;font-size:12rem;}
    .badge-onjn{width:34rem;font-size:9rem;}
    .foot-badges .b-note{font-size:8rem;line-height:11rem;}
    .foot-div{width:100%;}
    .chip-app{width:82rem;height:26rem;gap:5rem;padding:3rem 5rem;border-radius:5rem;}
    .chip-app img{width:15rem;height:15rem;}
    .chip-app .c-txt small{font-size:6rem;}
    .chip-app .c-txt strong{font-size:9rem;}

    .modal{width:320rem;padding:34rem 24rem 34rem;border-radius:12rem;}
    .modal .m-logo{width:104rem;margin-bottom:32rem;}
    .modal h3{font-size:40rem;letter-spacing:-.6rem;}
    .modal .m-sub{font-size:16rem;margin-top:6rem;}
    .modal .btn{margin-top:30rem;}
    .modal-x{width:28rem;height:28rem;font-size:12rem;top:10rem;right:10rem;}
  }

  @media (prefers-reduced-motion:reduce){
    *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.15s !important;}
    .wheel-glow-img,.modal .m-glow{animation:none !important;}
  }

  @media (max-width:860px){
    .hero{height:679rem;} /* 738 - 59 bara mobilă */
    .hero-stage{height:auto;}
 
    .promos{margin-top:56rem;}
    .app-band{height:198rem;margin-top:123rem;}
  }
/* Footer information and compact regulatory marks */
.foot-main{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:28rem;}
.foot-info{display:flex;flex-direction:column;align-items:center;gap:10rem;text-align:center;}
.foot-info h2{font-family:var(--display);font-size:18rem;line-height:1.4;letter-spacing:1rem;color:var(--white);}
.foot-info a{font-size:15rem;line-height:1.5;color:var(--grey60);text-decoration:none;}
.foot-info a:hover{color:var(--white);text-decoration:underline;}
.foot-info a:focus-visible{outline:2px solid var(--teal);outline-offset:4px;}
.foot-main .foot-badges{justify-self:end;gap:14rem;padding:0;flex-wrap:wrap;justify-content:flex-end;max-width:285rem;}
.foot-badges img{width:auto;height:36rem;max-width:80rem;object-fit:contain;flex:none;}
@media(max-width:860px){
 .foot-main{display:flex;gap:22rem;}
 .foot-info{gap:8rem;}
 .foot-info h2{font-size:14rem;}
 .foot-info a{font-size:12rem;}
 .foot-main .foot-badges{justify-content:center;gap:12rem;max-width:100%;}
 .foot-badges img{height:26rem;max-width:64rem;}
}

/* Separate footer from page content. */
footer{border-top:1px solid #3d3d3d;}
