.horizontal-controls,.horizontal-panorama,.horizontal-timeline,.intro-brand-stage{display:none}
:root{--horizontal-panorama-image:image-set(url("../images/brand/languages/tr/superultrawidebanner.avif?v=20260902-optimized") type("image/avif"),url("../images/brand/languages/tr/superultrawidebanner.png?v=20260902-language-backgrounds") type("image/png"))}
html[lang^="en"]{--horizontal-panorama-image:image-set(url("../images/brand/languages/en/superultrawidebanner.avif?v=20260902-en-banner") type("image/avif"),url("../images/brand/languages/en/superultrawidebanner.png?v=20260902-en-banner") type("image/png"))}
html[lang^="es"]{--horizontal-panorama-image:image-set(url("../images/brand/languages/es/superultrawidebanner.avif?v=20260902-optimized") type("image/avif"),url("../images/brand/languages/es/superultrawidebanner.png?v=20260902-language-backgrounds") type("image/png"))}
html[lang^="fr"]{--horizontal-panorama-image:image-set(url("../images/brand/languages/fr/superultrawidebanner.avif?v=20260902-optimized") type("image/avif"),url("../images/brand/languages/fr/superultrawidebanner.png?v=20260902-language-backgrounds") type("image/png"))}

@media (min-width:981px){
  :root{--horizontal-trust-height:46px;--horizontal-viewport-width:100vw;--horizontal-viewport-height:100vh}
  html,body{
    width:var(--horizontal-viewport-width);
    min-width:var(--horizontal-viewport-width);
    height:var(--horizontal-viewport-height);
    min-height:var(--horizontal-viewport-height);
    max-width:none;
    max-height:none;
    margin:0;
    overflow:hidden;
  }
  body{overscroll-behavior:none}

  .site-header{right:auto;left:0;width:var(--horizontal-viewport-width);max-width:none}

  .horizontal-scroller{
    position:fixed;
    isolation:isolate;
    top:0;
    left:0;
    display:flex;
    width:var(--horizontal-viewport-width);
    min-width:var(--horizontal-viewport-width);
    max-width:none;
    height:var(--horizontal-viewport-height);
    min-height:var(--horizontal-viewport-height);
    max-height:none;
    overflow-x:auto;
    overflow-y:hidden;
    overscroll-behavior-x:contain;
    /* Panel geçişlerini JavaScript animasyonu yönetir. Buradaki smooth,
       hard refresh sırasında tarayıcının hash hedefine ayrı bir animasyon
       başlatmasına ve panelin yarım konumda kalmasına neden oluyordu. */
    scroll-behavior:auto;
    scroll-snap-type:none;
    scrollbar-width:thin;
    scrollbar-color:var(--red) #111419;
  }
  .horizontal-scroller::-webkit-scrollbar{height:7px}
  .horizontal-scroller::-webkit-scrollbar-track{background:#111419}
  .horizontal-scroller::-webkit-scrollbar-thumb{border-radius:10px;background:linear-gradient(90deg,var(--red-dark),var(--red))}
  .horizontal-scroller.is-scrubbing{scroll-behavior:auto}
  .horizontal-scroller>main{display:contents}

  .horizontal-panorama{
    position:fixed;
    z-index:0;
    top:0;
    left:0;
    display:block;
    width:var(--horizontal-viewport-width);
    min-width:var(--horizontal-viewport-width);
    max-width:none;
    height:var(--horizontal-viewport-height);
    min-height:var(--horizontal-viewport-height);
    overflow:hidden;
    contain:paint;
    pointer-events:none;
    background-color:#050607;
    opacity:1;
  }
  .horizontal-panorama::before{position:absolute;inset:-10px;content:"";background-image:var(--horizontal-panorama-image);background-repeat:no-repeat;background-position:calc(var(--panorama-x,0px) + 10px) center;background-size:1000% auto;filter:blur(0);transform:none;transition:filter .48s ease}
  .horizontal-panorama::after{position:absolute;z-index:1;inset:0;display:block;content:"";pointer-events:none;background:rgba(3,4,5,var(--panorama-shade-opacity,.48));opacity:1;transition:opacity 1.1s ease,background-color .24s ease}
  .horizontal-panorama.is-intro-active::after{background:transparent}
  .horizontal-scroller:not(.is-scrolling) .horizontal-panorama:not(.is-intro-active)::before{filter:blur(8px)}
  .horizontal-scroller.is-scrolling .horizontal-panorama::before{transition-duration:.1s}
  .horizontal-scroller.is-scrolling .horizontal-panorama::after{transition-duration:.08s}

  .intro-panel,
  .horizontal-scroller main>section,
  .horizontal-scroller>.site-footer{
    position:relative;
    z-index:1;
    flex:0 0 var(--horizontal-viewport-width);
    width:var(--horizontal-viewport-width);
    min-width:var(--horizontal-viewport-width);
    height:var(--horizontal-viewport-height);
    min-height:var(--horizontal-viewport-height);
    max-height:var(--horizontal-viewport-height);
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-width:none;
  }
  .intro-panel::-webkit-scrollbar,
  .horizontal-scroller main>section::-webkit-scrollbar,
  .horizontal-scroller>.site-footer::-webkit-scrollbar{display:none}

  .intro-panel{display:flex;flex-direction:column;padding-bottom:0;overflow:hidden;background:transparent}
  .intro-panel>.hero{display:flex;align-items:center;flex:1;min-height:0;padding-top:calc(var(--header) + clamp(36px,6vh,74px));padding-bottom:clamp(34px,5vh,68px)}
  .intro-panel .hero__grid{width:min(calc(100% - (2 * var(--gutter))),1600px);max-width:none;min-height:0;height:100%}
  .intro-panel .hero__grid{transform:translate3d(0,clamp(-82px,-7.8vh,-62px),0)}
  .site-header__inner{width:min(calc(100% - (2 * var(--gutter))),1600px);max-width:none}
  .intro-panel .hero h1{font-size:clamp(52px,5.3vw,82px)}
  .intro-panel .hero__lead{margin-top:16px}
  .intro-panel .hero .button-group{margin-top:18px}
  body>.trust-strip.horizontal-trust-fixed{position:fixed;z-index:47;right:0;bottom:0;left:0;display:block;width:100%;height:var(--horizontal-trust-height);overflow:hidden;background:rgba(9,11,13,.94);box-shadow:0 -6px 20px rgba(0,0,0,.2);backdrop-filter:blur(12px)}
  body>.trust-strip.horizontal-trust-fixed .container{width:min(calc(100% - (2 * var(--gutter))),1600px);max-width:none;height:100%}
  body>.trust-strip.horizontal-trust-fixed .trust-strip__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch}
  body>.trust-strip.horizontal-trust-fixed .trust-item{min-height:0;height:100%;padding:3px 14px;gap:10px;font-size:14px;line-height:1;letter-spacing:.04em;white-space:nowrap}
  body>.trust-strip.horizontal-trust-fixed .trust-item svg{width:24px;height:24px;flex:0 0 24px}

  .intro-panel .hero{background:transparent}
  .intro-brand-stage{
    --intro-accent:#ec1c24;
    --intro-logo-hue:0deg;
    position:absolute;
    z-index:3;
    inset:0;
    isolation:isolate;
    display:grid;
    grid-template-rows:auto auto auto auto;
    align-content:center;
    justify-items:center;
    gap:clamp(10px,1.25vh,16px);
    padding:calc(var(--header) + clamp(10px,1.5vh,18px)) clamp(36px,4vw,76px) calc(var(--horizontal-trust-height) + clamp(86px,9vh,112px));
    overflow:hidden;
    background:
      linear-gradient(180deg,rgba(0,0,0,.16),rgba(0,0,0,.05) 47%,rgba(0,0,0,.25)),
      radial-gradient(circle at 50% 34%,color-mix(in srgb,var(--intro-accent) 14%,transparent),transparent 28%),
      url("../images/brand/intro-metal-tech-bg-v1.png") center/cover no-repeat,
      #030405;
    color:#fff;
    text-align:center;
  }
  .intro-brand-stage::before{
    position:absolute;
    z-index:-1;
    inset:0;
    content:"";
    pointer-events:none;
    background:radial-gradient(ellipse at 50% 42%,transparent 0 27%,rgba(0,0,0,.08) 54%,rgba(0,0,0,.48) 100%);
    opacity:1;
  }
  .intro-brand-stage::after{
    position:absolute;
    z-index:0;
    top:34%;
    left:50%;
    width:min(58vw,1080px);
    height:min(24vw,450px);
    content:"";
    pointer-events:none;
    border-radius:50%;
    background:radial-gradient(ellipse at center,color-mix(in srgb,var(--intro-accent) 20%,transparent),color-mix(in srgb,var(--intro-accent) 7%,transparent) 36%,transparent 70%);
    filter:blur(6px) drop-shadow(0 0 24px color-mix(in srgb,var(--intro-accent) 15%,transparent));
    transform:translate(-50%,-50%) perspective(700px) rotateX(66deg);
    transition:background .65s ease,filter .65s ease;
  }
  .intro-brand-stage__identity{
    position:relative;
    z-index:1;
    display:grid;
    justify-items:center;
    gap:clamp(4px,.6vh,9px);
  }
  .intro-brand-stage__identity::before{
    position:absolute;
    z-index:-1;
    top:50%;
    left:50%;
    width:min(36vw,660px);
    height:min(12vw,220px);
    content:"";
    border-radius:50%;
    background:radial-gradient(ellipse at center,color-mix(in srgb,var(--intro-accent) 27%,transparent),color-mix(in srgb,var(--intro-accent) 9%,transparent) 43%,transparent 72%);
    filter:blur(3px) drop-shadow(0 0 18px color-mix(in srgb,var(--intro-accent) 28%,transparent));
    transform:translate(-50%,-50%) perspective(600px) rotateX(67deg);
    animation:introWarpReveal 1.7s cubic-bezier(.22,1,.36,1) .28s both;
    transition:background .65s ease,filter .65s ease;
  }
  .intro-brand-stage__emblem{
    display:block;
    width:clamp(230px,16vw,310px);
    height:auto;
    aspect-ratio:1;
    object-fit:contain;
    filter:hue-rotate(var(--intro-logo-hue)) saturate(1.08) drop-shadow(0 20px 34px rgba(0,0,0,.68)) drop-shadow(0 0 16px color-mix(in srgb,var(--intro-accent) 62%,transparent)) drop-shadow(0 0 42px color-mix(in srgb,var(--intro-accent) 34%,transparent));
    animation:introEmblemReveal 1.8s cubic-bezier(.22,1,.36,1) .2s both;
    transition:filter .65s ease;
  }
  .intro-game-lineup{
    position:relative;
    z-index:1;
    display:grid;
    width:min(68vw,1306px);
    grid-template-columns:repeat(10,minmax(0,1fr));
    align-items:start;
    gap:clamp(5px,.75vw,14px);
  }
  .intro-game-lineup__item{
    position:relative;
    display:grid;
    min-width:0;
    justify-items:center;
    gap:clamp(6px,.7vh,9px);
    color:#f5f5f4;
    text-decoration:none;
    opacity:0;
    will-change:opacity,transform;
    animation:introLogoFan 1.08s cubic-bezier(.16,1,.3,1) both;
  }
  .intro-game-lineup__item:nth-child(1){--intro-logo-delay:2.28s;--intro-logo-from:38vw}
  .intro-game-lineup__item:nth-child(2){--intro-logo-delay:2.21s;--intro-logo-from:31vw}
  .intro-game-lineup__item:nth-child(3){--intro-logo-delay:2.14s;--intro-logo-from:24vw}
  .intro-game-lineup__item:nth-child(4){--intro-logo-delay:2.07s;--intro-logo-from:17vw}
  .intro-game-lineup__item:nth-child(5){--intro-logo-delay:2s;--intro-logo-from:10vw}
  .intro-game-lineup__item:nth-child(6){--intro-logo-delay:2s;--intro-logo-from:-10vw}
  .intro-game-lineup__item:nth-child(7){--intro-logo-delay:2.07s;--intro-logo-from:-17vw}
  .intro-game-lineup__item:nth-child(8){--intro-logo-delay:2.14s;--intro-logo-from:-24vw}
  .intro-game-lineup__item:nth-child(9){--intro-logo-delay:2.21s;--intro-logo-from:-31vw}
  .intro-game-lineup__item:nth-child(10){--intro-logo-delay:2.28s;--intro-logo-from:-38vw}
  .intro-game-lineup__item{animation-delay:var(--intro-logo-delay)}
  .intro-game-lineup__item:not(:last-child)::after{
    position:absolute;
    top:12%;
    right:calc(clamp(5px,.75vw,14px) / -2);
    width:1px;
    height:66%;
    content:"";
    background:linear-gradient(transparent,rgba(255,255,255,.42),transparent);
  }
  .intro-game-lineup__item picture{display:block;width:clamp(58px,4.8vw,88px);aspect-ratio:1}
  .intro-game-lineup__item img{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    filter:drop-shadow(0 8px 13px rgba(0,0,0,.68));
    transform:translateZ(0);
    transition:filter .24s ease,transform .24s ease;
  }
  .intro-game-lineup__item span{
    max-width:100%;
    overflow:hidden;
    font-family:var(--display);
    font-size:clamp(10px,.72vw,13px);
    font-weight:750;
    line-height:1.05;
    letter-spacing:.035em;
    text-align:center;
    text-overflow:ellipsis;
    text-shadow:0 2px 8px #000;
    text-transform:uppercase;
    white-space:nowrap;
  }
  .intro-game-lineup__item:hover img,.intro-game-lineup__item:focus-visible img{filter:drop-shadow(0 10px 18px rgba(0,0,0,.72)) drop-shadow(0 0 12px color-mix(in srgb,var(--intro-accent) 56%,transparent));transform:translateY(-4px) scale(1.055)}
  .intro-game-lineup__item:focus-visible{outline:2px solid #fff;outline-offset:7px;border-radius:7px}
  .intro-slogan-rotator{
    position:relative;
    z-index:1;
    display:grid;
    width:min(58vw,920px);
    height:clamp(42px,5vh,56px);
    place-items:center;
    overflow:hidden;
    font-family:var(--display);
    text-align:center;
  }
  .intro-slogan-rotator::before,.intro-slogan-rotator::after{
    position:absolute;
    top:50%;
    width:34%;
    height:1px;
    content:"";
    background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--intro-accent) 78%,transparent));
    box-shadow:0 0 10px color-mix(in srgb,var(--intro-accent) 48%,transparent);
    transition:background .65s ease,box-shadow .65s ease;
  }
  .intro-slogan-rotator::before{left:0}
  .intro-slogan-rotator::after{right:0;background:linear-gradient(90deg,color-mix(in srgb,var(--intro-accent) 78%,transparent),transparent)}
  .intro-slogan-rotator span{
    grid-area:1/1;
    min-width:30%;
    padding:0 clamp(18px,2vw,34px);
    color:#f4f2f1;
    font-size:clamp(18px,1.45vw,28px);
    font-weight:650;
    line-height:1;
    letter-spacing:.18em;
    text-indent:.18em;
    text-shadow:0 4px 14px #000,0 0 14px color-mix(in srgb,var(--intro-accent) 30%,transparent);
    white-space:nowrap;
    opacity:0;
    filter:blur(7px);
    transform:scale(.985);
    transition:opacity .38s ease,filter .46s ease,transform .46s ease;
  }
  .intro-slogan-rotator span.is-active{opacity:1;filter:blur(0);transform:scale(1)}
  .intro-brand-stage__claim{
    position:relative;
    z-index:1;
    display:flex;
    width:min(65vw,1240px);
    align-items:center;
    gap:24px;
    margin:0;
    color:#e8e8e7;
    font-family:var(--display);
    font-size:clamp(13px,1vw,19px);
    font-weight:600;
    letter-spacing:.58em;
    text-indent:.58em;
    text-shadow:0 3px 10px #000;
    white-space:nowrap;
    animation:introTextReveal .8s ease 3.18s both;
  }
  .intro-brand-stage__claim::before,.intro-brand-stage__claim::after{height:1px;flex:1;content:"";background:linear-gradient(90deg,transparent,var(--intro-accent));box-shadow:0 0 10px color-mix(in srgb,var(--intro-accent) 82%,transparent);transition:background .65s ease,box-shadow .65s ease}
  .intro-brand-stage__claim::after{background:linear-gradient(90deg,var(--intro-accent),transparent)}

  @keyframes introEmblemReveal{
    0%{opacity:0;transform:scale(.84)}
    55%{opacity:.82;transform:scale(.985)}
    100%{opacity:1;transform:scale(1)}
  }
  @keyframes introWarpReveal{
    from{opacity:0;transform:translate(-50%,-50%) perspective(600px) rotateX(67deg) scale(.55)}
    to{opacity:1;transform:translate(-50%,-50%) perspective(600px) rotateX(67deg) scale(1)}
  }
  @keyframes introLogoFan{
    0%{opacity:0;transform:translate3d(var(--intro-logo-from),0,0) scale(.58);filter:blur(7px)}
    55%{opacity:1;filter:blur(0)}
    100%{opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0)}
  }
  @keyframes introTextReveal{
    from{opacity:0;filter:blur(5px)}
    to{opacity:1;filter:blur(0)}
  }
  .intro-panel .hero__background,.horizontal-scroller .video-feature__poster{opacity:0}
  .intro-panel .hero__veil,.horizontal-scroller .video-feature__overlay{background:transparent}
  .horizontal-scroller .games-section,
  .horizontal-scroller .video-feature,
  .horizontal-scroller .use-cases,
  .horizontal-scroller .custom-section,
  .horizontal-scroller .about-section,
  .horizontal-scroller .events-section,
  .horizontal-scroller .contact-cta,
  .horizontal-scroller>.site-footer{background:transparent!important}
  .horizontal-scroller main>section::before,.intro-panel .hero::before{display:none}

  /* V1 yalnızca giriş panelinde kalır. Transparan V2, ikinci panelden
     başlayarak her tam ekran bölümde aynı ölçüde yatay olarak devam eder. */
  .horizontal-scroller main>section,
  .horizontal-scroller>.site-footer{isolation:isolate}
  .horizontal-scroller main>section::after,
  .horizontal-scroller>.site-footer::before{
    position:absolute;
    z-index:0;
    inset:0;
    display:block;
    content:"";
    pointer-events:none;
    background-image:url("../images/brand/intro-metal-tech-bg-v2.png?v=20260903");
    background-repeat:no-repeat;
    background-position:center;
    background-size:100% 100%;
  }
  .horizontal-scroller main>section>*,
  .horizontal-scroller>.site-footer>*{position:relative;z-index:1}

  html.js .horizontal-scroller .hero__copy,
  html.js .horizontal-scroller .section-heading,
  html.js .horizontal-scroller .video-feature__content,
  html.js .horizontal-scroller .custom-section__copy{
    opacity:var(--panel-opacity,1);
    translate:var(--parallax-copy-x,0px) 0;
    transition:none;
    will-change:translate,opacity;
  }
  html.js .horizontal-scroller .hero-media,
  html.js .horizontal-scroller .game-grid,
  html.js .horizontal-scroller .use-case-grid,
  html.js .horizontal-scroller .custom-stack,
  html.js .horizontal-scroller .about-section__panel,
  html.js .horizontal-scroller .event-grid,
  html.js .horizontal-scroller .contact-cta__inner,
  html.js .horizontal-scroller .site-footer__grid,
  html.js .horizontal-scroller .site-footer__bottom{
    opacity:var(--panel-opacity,1);
    translate:var(--parallax-media-x,0px) 0;
    transition:none;
    will-change:translate,opacity;
  }
  .horizontal-scroller .intro-panel .hero__copy{opacity:var(--panel-opacity,1);transform:translate3d(var(--intro-copy-rewind-x,0px),0,0)}
  .horizontal-scroller .intro-panel .hero-media{opacity:var(--panel-opacity,1);transform:translate3d(var(--intro-media-rewind-x,0px),0,0) scale(var(--intro-media-rewind-scale,1))}
  .horizontal-panorama.is-intro-rewinding::after{transition-duration:.18s}
  html.intro-ready .intro-panel.is-rewinding .hero__copy,
  html.intro-ready .intro-panel.is-rewinding .hero-media{transition:opacity .18s ease-out,transform .18s ease-out}

  .horizontal-scroller main>.section{
    padding-top:calc(var(--header) + clamp(28px,4.5vh,52px));
    padding-bottom:clamp(38px,5vh,64px);
  }
  .horizontal-scroller main>.section .section-heading{margin-bottom:clamp(20px,3vh,34px)}
  .horizontal-scroller .eyebrow{font-size:clamp(20px,1.3vw,25px);line-height:1.22;letter-spacing:.115em}

  /* Oyunlar paneli tek viewport içinde kalır. Kart yüksekliği artık ekran
     genişliğinden değil, başlık ve sabit alt kontrollerden kalan alandan gelir. */
  .horizontal-scroller main>.section.games-section{
    --games-panel-top:calc(var(--header) + clamp(28px,4.5vh,52px));
    --games-panel-bottom:calc(var(--horizontal-trust-height) + clamp(92px,8.5vh,150px));
    overflow:hidden;
    padding-top:var(--games-panel-top);
    padding-bottom:var(--games-panel-bottom);
  }
  .horizontal-scroller .games-section>.container{
    display:grid;
    height:100%;
    min-height:0;
    grid-template-rows:auto minmax(0,1fr) auto;
    transform:none;
  }
  .horizontal-scroller .games-section .game-grid{
    min-height:0;
    grid-template-rows:repeat(2,minmax(0,1fr));
    gap:clamp(10px,1.1vh,16px) clamp(12px,1.1vw,16px);
  }
  .horizontal-scroller .games-section .game-card{min-height:0}
  .horizontal-scroller .games-section .game-card.reveal{opacity:1;transform:none}
  .horizontal-scroller .games-section .game-card__link{width:100%;height:100%;aspect-ratio:auto}
  .horizontal-scroller .games-section .game-card__body{bottom:8px}
  .horizontal-scroller .games-section .game-card__tagline{min-height:24px;margin-top:4px}
  .horizontal-scroller .games-section .game-card__action{margin-top:5px}
  .horizontal-scroller .games-section .games-collection-note{width:100%;margin-top:clamp(10px,1.5vh,20px);font-size:clamp(14px,.94vw,18px);letter-spacing:.012em}

  .horizontal-scroller .video-feature{min-height:0;padding-top:var(--header)}
  .horizontal-scroller .video-feature__content{display:grid;width:min(calc(100% - (2 * var(--gutter))),1500px);max-width:none;grid-template-columns:minmax(0,800px) auto;align-self:center;column-gap:clamp(44px,5vw,88px)}
  html.js .horizontal-scroller .video-feature__content{translate:var(--parallax-copy-x,0px) -125px}
  .horizontal-scroller .video-feature__content .eyebrow,.horizontal-scroller .video-feature__content h2,.horizontal-scroller .video-feature__content>p:last-of-type{grid-column:1}
  .horizontal-scroller .video-feature__content h2{max-width:800px;font-size:clamp(58px,5vw,80px);line-height:1.05}
  .horizontal-scroller .video-feature__content>p:last-of-type{max-width:690px;margin-top:24px;font-size:clamp(18px,1.15vw,21px);line-height:1.55}
  .horizontal-scroller .video-feature__embed{width:min(42vw,700px);margin:0;grid-column:2;grid-row:1/4;align-self:center;justify-self:end;border-color:rgba(255,255,255,.3);box-shadow:0 28px 78px rgba(0,0,0,.62),0 0 42px rgba(236,28,36,.16)}

  .horizontal-scroller .use-case-grid{grid-auto-rows:min(22vh,220px)}
  .horizontal-scroller .custom-section{display:flex;align-items:center}
  .horizontal-scroller .custom-section__grid{width:min(calc(100% - (2 * var(--gutter))),1500px);max-width:none;grid-template-columns:.78fr 1.22fr;gap:clamp(72px,6vw,112px)}
  .horizontal-scroller .custom-section__copy h2{max-width:650px;font-size:clamp(56px,4.5vw,74px);line-height:1.06}
  .horizontal-scroller .custom-section__copy>p:not(.eyebrow){max-width:620px;font-size:clamp(17px,1.05vw,20px)}
  .horizontal-scroller .custom-section .feature-list{gap:15px;margin-top:34px;font-size:clamp(16px,1vw,19px)}
  .horizontal-scroller .custom-stack{height:min(59vh,570px)}
  .horizontal-scroller .branded-screen{width:76%}
  .horizontal-scroller .branded-screen:nth-child(2){top:126px}
  .horizontal-scroller .hero-about{position:relative;z-index:2;width:min(calc(100% - (2 * var(--gutter))),1660px);max-width:none;margin:auto;grid-template-columns:1fr 1.05fr;gap:42px clamp(64px,5vw,96px);padding:clamp(62px,4.8vw,90px);transform:translate3d(0,var(--about-drag-y,0px),0);cursor:grab;touch-action:pan-x;user-select:none;will-change:transform}
  .horizontal-scroller .hero-about.is-dragging{cursor:grabbing}
  .horizontal-scroller .hero-about:focus-visible{outline:2px solid var(--red);outline-offset:5px}
  .horizontal-scroller .hero-about[hidden]{display:none!important}
  .horizontal-scroller .about-identity{gap:clamp(28px,2.8vw,48px)}
  .horizontal-scroller .about-identity__logo{width:clamp(190px,14vw,260px)}
  .horizontal-scroller .hero-about h2{font-size:clamp(58px,4.8vw,78px);line-height:1.08}
  .horizontal-scroller .hero-about>p{font-size:clamp(18px,1.18vw,21px);line-height:1.68}
  .horizontal-scroller .about-values span{padding:25px 22px;font-size:clamp(19px,1.3vw,23px);line-height:1.16}
  .horizontal-scroller .events-section .event-grid{grid-auto-rows:min(21vh,205px)}

  .horizontal-scroller .contact-cta{display:flex;align-items:center;padding-top:var(--header);padding-bottom:0}
  .horizontal-scroller .contact-cta__inner{align-content:center}

  .horizontal-scroller>.site-footer{
    flex-basis:100%;
    width:100%;
    min-width:100%;
    display:flex;
    justify-content:center;
    flex-direction:column;
    padding-top:calc(var(--header) + 35px);
    padding-bottom:40px;
    background:radial-gradient(circle at 12% 45%,rgba(47,143,214,.1),transparent 28%),#050607;
  }
  .horizontal-scroller>.site-footer .site-footer__grid,
  .horizontal-scroller>.site-footer .site-footer__bottom{width:min(calc(100% - (2 * var(--gutter))),1500px);max-width:none}
  .horizontal-scroller>.site-footer .site-footer__grid{grid-template-columns:1.2fr 1.2fr .8fr;gap:clamp(70px,6vw,112px)}
  .horizontal-scroller>.site-footer .brand-lockup--footer img{width:clamp(380px,31vw,540px);height:auto;max-width:100%}
  .horizontal-scroller>.site-footer .site-footer__brand p{max-width:440px;margin-top:28px;font-size:clamp(15px,1vw,18px);line-height:1.65}
  .horizontal-scroller>.site-footer .footer-games>strong,
  .horizontal-scroller>.site-footer .site-footer__contact>strong{margin-bottom:22px;font-size:clamp(23px,1.55vw,28px);line-height:1.12}
  .horizontal-scroller>.site-footer .footer-games>div{gap:9px 30px}
  .horizontal-scroller>.site-footer .footer-games a,
  .horizontal-scroller>.site-footer .site-footer__contact a,
  .horizontal-scroller>.site-footer .site-footer__contact address{font-size:clamp(14px,.95vw,17px);line-height:1.5}
  .horizontal-scroller>.site-footer .site-footer__contact{gap:10px}
  .horizontal-scroller>.site-footer .site-footer__bottom{margin-top:58px;padding-top:24px;font-size:clamp(12px,.8vw,14px)}

  .horizontal-controls{
    position:fixed;
    z-index:48;
    right:auto;
    left:50%;
    bottom:calc(var(--horizontal-trust-height) + 8px);
    display:grid;
    width:360px;
    overflow:visible;
    border:0;
    background:transparent;
    transform:translateX(-50%);
    transition:bottom .25s ease;
  }
  .horizontal-controls.is-intro{left:50%;bottom:calc(var(--horizontal-trust-height) + 8px)}
  .horizontal-controls__navigation{display:flex;align-items:center;gap:14px;padding:0}
  .horizontal-progress-stack{position:relative;display:block;min-width:0;height:38px;flex:1}
  .horizontal-section-name{position:absolute;right:0;bottom:calc(50% + 8px);left:0;display:flex;min-width:0;max-width:100%;height:16px;align-items:center;justify-content:center;overflow:hidden;color:#f5f6f7;font-family:var(--display);font-size:12px;font-weight:800;line-height:1;letter-spacing:.08em;text-align:center;text-overflow:ellipsis;text-shadow:0 2px 8px rgba(0,0,0,.92);text-transform:uppercase;white-space:nowrap}
  .horizontal-controls button{position:relative;isolation:isolate;display:grid;width:38px;height:38px;place-items:center;border:1px solid rgba(255,255,255,.28);border-radius:50%;background:radial-gradient(circle at 35% 28%,#252c33 0,#11161b 48%,#07090c 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 -7px 12px rgba(0,0,0,.42),0 5px 14px rgba(0,0,0,.38);color:#f5f6f7;font-size:0;cursor:pointer;transition:border-color .28s ease,box-shadow .28s ease,transform .28s cubic-bezier(.2,.75,.25,1),background .28s ease}
  .horizontal-controls button::after{position:absolute;inset:3px;border:1px solid rgba(255,255,255,.08);border-radius:inherit;content:"";pointer-events:none}
  .horizontal-controls button::before{position:absolute;top:50%;left:50%;width:8px;height:8px;border-top:2px solid currentColor;border-right:2px solid currentColor;content:"";filter:drop-shadow(0 0 4px rgba(255,255,255,.18));transform-origin:center;transition:filter .28s ease}
  .horizontal-controls button[data-horizontal-prev]::before{transform:translate(-50%,-50%) rotate(-135deg)}
  .horizontal-controls button[data-horizontal-next]::before{transform:translate(-50%,-50%) rotate(45deg)}
  .horizontal-controls button:hover{border-color:rgba(255,69,75,.92);background:radial-gradient(circle at 35% 28%,#4a2528 0,#211114 50%,#09090b 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -7px 12px rgba(0,0,0,.38),0 0 0 3px rgba(236,28,36,.1),0 7px 18px rgba(0,0,0,.48);color:#fff;transform:translateY(-1px) scale(1.045)}
  .horizontal-controls button:hover::before{filter:drop-shadow(0 0 5px rgba(255,70,76,.75))}
  .horizontal-controls button:active{transform:translateY(0) scale(.96)}
  .horizontal-controls button:focus-visible{outline:2px solid #fff;outline-offset:3px}
  .horizontal-progress{position:absolute;top:50%;right:0;left:0;min-width:0;height:3px;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.24);box-shadow:0 1px 5px rgba(0,0,0,.58);transform:translateY(-50%)}
  .horizontal-progress span{position:absolute;inset:0;width:100%;background:linear-gradient(90deg,var(--red),#ff6b38);box-shadow:0 0 10px rgba(236,28,36,.7);transform:scaleX(0);transform-origin:left center;will-change:transform}

  .horizontal-timeline{position:fixed;z-index:60;right:0;bottom:0;left:0;display:block;height:4px;overflow:hidden;background:rgba(255,255,255,.1);pointer-events:none}.horizontal-timeline span{display:block;width:100%;height:100%;border-radius:0 3px 3px 0;background:linear-gradient(90deg,#b80d13,var(--red),#ff493c);box-shadow:0 0 12px rgba(236,28,36,.92);transform:scaleX(0);transform-origin:left center;will-change:transform}

  html.intro-hold .intro-panel .hero__copy,
  html.intro-hold .intro-panel .hero-media{visibility:hidden;opacity:0;pointer-events:none}
  html.intro-hold .horizontal-panorama::before{opacity:1;filter:none;transform:none}
  html.intro-hold.intro-background-revealing .horizontal-panorama::before{opacity:1;filter:none;transform:none}
  html.intro-hold .horizontal-panorama::after{opacity:0}
  html.intro-hold .intro-panel .hero__copy{transform:translate3d(0,0,0) scale(.9)}
  html.intro-hold .intro-panel .hero-media{transform:translate3d(0,0,0) scale(.88)}
  html.intro-hold .horizontal-scroller{scrollbar-color:transparent transparent}
  html.intro-hold .horizontal-scroller::-webkit-scrollbar-track,
  html.intro-hold .horizontal-scroller::-webkit-scrollbar-thumb{background:transparent}

  html.intro-revealing .intro-panel .hero__copy{transition:visibility 0s .16s,opacity .85s ease .16s,transform 1s cubic-bezier(.2,.8,.2,1) .16s}
  html.intro-revealing .intro-panel .hero-media{transition:visibility 0s .42s,opacity .9s ease .42s,transform 1.1s cubic-bezier(.16,1,.3,1) .42s}

  .horizontal-scroller .use-cases{padding-top:calc(var(--header) + clamp(44px,6vh,62px));padding-bottom:clamp(26px,3vh,38px)}
  .horizontal-scroller .use-cases>.container{transform:translate3d(0,clamp(42px,7vh,72px),0)}
  .horizontal-scroller .use-cases .section-heading{margin-bottom:8px}
  .horizontal-scroller .use-cases .section-heading h2{font-size:clamp(36px,3.2vw,52px)}
  .horizontal-scroller .use-cases .use-case-grid{grid-auto-rows:min(18vh,176px);gap:12px}
  .horizontal-scroller .use-cases .use-case-grid--seven{grid-auto-rows:min(24vh,230px)}
  .horizontal-scroller .use-cases .media-card>div{right:18px;bottom:14px;left:18px}
  .horizontal-scroller .use-cases .media-card h3{font-size:24px}
  .horizontal-scroller .use-cases .media-card:first-child h3{font-size:34px}
  .horizontal-scroller .use-cases .use-case-grid--seven .media-card:first-child h3{font-size:24px}
  .horizontal-scroller .use-cases .media-card .media-card__label,.horizontal-scroller .use-cases .use-case-grid--seven .media-card:first-child .media-card__label{font-size:clamp(15px,1.05vw,20px)}
}

/* 2K, 4K ve 5K masaüstlerinde arayüzün 1080p ölçüsünde küçük kalmasını
   önler; sahne ve içerik gerçek viewport alanına göre birlikte büyür. */
@media (min-width:2400px) and (min-height:1200px){
  :root{
    --header:clamp(86px,5.3vh,116px);
    --horizontal-trust-height:clamp(56px,3.8vh,78px);
    --gutter:clamp(56px,4vw,128px);
  }
  .site-header__inner{width:calc(100vw - (2 * var(--gutter)));max-width:none}
  .site-header .brand-lockup--header img{height:clamp(62px,3.2vw,88px);max-width:min(27vw,460px)}
  .desktop-nav{gap:clamp(38px,2.4vw,72px)}
  .desktop-nav a{font-size:clamp(16px,.72vw,22px)}
  .language-switcher__button{min-height:clamp(40px,2.3vw,54px);font-size:clamp(13px,.62vw,18px)}

  .intro-brand-stage{
    gap:clamp(14px,1.25vh,26px);
    padding-right:var(--gutter);
    padding-left:var(--gutter);
  }
  .intro-brand-stage__identity::before{width:min(42vw,1120px);height:min(14vw,380px)}
  .intro-brand-stage__emblem{width:clamp(340px,14vw,540px)}
  .intro-game-lineup{width:min(78vw,2600px);gap:clamp(12px,.8vw,24px)}
  .intro-game-lineup__item picture{width:clamp(96px,4.6vw,156px)}
  .intro-game-lineup__item span{font-size:clamp(15px,.7vw,23px)}
  .intro-slogan-rotator{width:min(68vw,2100px);height:clamp(62px,5vh,92px)}
  .intro-slogan-rotator span{font-size:clamp(30px,1.35vw,46px)}
  .intro-brand-stage__claim{width:min(72vw,2300px);font-size:clamp(22px,.95vw,32px)}

  .horizontal-scroller main>.section>.container,
  .horizontal-scroller .contact-cta__inner{
    width:calc(100vw - (2 * var(--gutter)));
    max-width:none;
  }
  .horizontal-scroller .games-section .game-grid{gap:clamp(16px,.8vh,24px) clamp(18px,1vw,30px)}
  .horizontal-scroller .games-section .game-card h3{font-size:clamp(28px,1.12vw,40px)}
  .horizontal-scroller .games-section .game-card__tagline{font-size:clamp(14px,.58vw,20px)}
  .horizontal-scroller .use-cases .use-case-grid--seven{grid-auto-rows:min(24vh,360px);gap:clamp(16px,.9vw,28px)}
  .horizontal-scroller .use-cases .media-card .media-card__label,
  .horizontal-scroller .use-cases .use-case-grid--seven .media-card:first-child .media-card__label{font-size:clamp(22px,1.05vw,34px)}

  .horizontal-controls{width:clamp(440px,20vw,620px)}
  .horizontal-controls__navigation{gap:18px;padding:0}
  .horizontal-controls button{width:clamp(48px,2.25vw,64px);height:clamp(48px,2.25vw,64px)}
  .horizontal-section-name{bottom:calc(50% + 11px);height:22px;font-size:clamp(15px,.68vw,21px)}
  .horizontal-progress-stack{height:clamp(48px,2.25vw,64px)}
  .horizontal-progress{height:4px}
}

@media (min-width:981px) and (max-height:820px){
  .intro-panel>.hero{padding-top:calc(var(--header) + 24px);padding-bottom:24px}
  .intro-brand-stage{gap:7px;padding-top:calc(var(--header) + 6px);padding-bottom:calc(var(--horizontal-trust-height) + 48px)}
  .intro-brand-stage__emblem{width:clamp(132px,10.5vw,170px)}
  .intro-game-lineup__item picture{width:clamp(48px,4.2vw,68px)}
  .intro-slogan-rotator{height:32px}
  .intro-slogan-rotator span{font-size:15px}
  .intro-brand-stage__claim{font-size:12px}
  .horizontal-scroller main>.section{padding-top:calc(var(--header) + 20px);padding-bottom:28px}
  .horizontal-scroller main>.section .section-heading{margin-bottom:16px}
  .horizontal-scroller .games-section .game-card__link{aspect-ratio:auto}
  .horizontal-scroller .game-card__logo{top:12%;width:38%;height:38%}
  .horizontal-scroller .game-card__tagline{min-height:30px}
  .horizontal-scroller .games-section .games-collection-note{margin-top:10px;font-size:15px}
  .horizontal-scroller .use-case-grid{grid-auto-rows:19.5vh}
  .horizontal-scroller .events-section .event-grid{grid-auto-rows:18.5vh}
  .horizontal-scroller .custom-stack{height:54vh}
}

@media (min-width:981px) and (min-height:821px) and (max-height:950px){
  .horizontal-scroller main>.section{padding-top:calc(var(--header) + 24px);padding-bottom:32px}
  .horizontal-scroller main>.section .section-heading{margin-bottom:18px}
  .horizontal-scroller .use-case-grid{grid-auto-rows:19vh}
  .horizontal-scroller .events-section .event-grid{grid-auto-rows:18.5vh}
}

@media (min-width:981px) and (min-height:951px) and (max-height:1000px){
  .horizontal-scroller .games-section>.container{transform:none}
  .horizontal-scroller .use-cases>.container{transform:translate3d(0,46px,0)}
  .horizontal-scroller .events-section>.container{transform:translate3d(0,-40px,0)}
  .horizontal-scroller .events-section .event-grid{grid-auto-rows:18.5vh}
}

@media (min-width:981px) and (max-width:1100px){
  .horizontal-scroller .games-section .game-card__logo{top:10%;width:36%;height:36%}
  .horizontal-scroller .games-section .game-card h3{font-size:clamp(20px,2.05vw,23px)}
}

@media (prefers-reduced-motion:reduce){
  .horizontal-scroller{scroll-behavior:auto}
  .horizontal-progress span{transition:none}
  .intro-brand-stage__emblem,
  .intro-brand-stage__identity::before,
  .intro-game-lineup__item,
  .intro-brand-stage__claim,
  .intro-slogan-rotator span{opacity:1;animation:none;filter:none;transform:none;transition:none}
  .intro-brand-stage__identity::before{filter:drop-shadow(0 0 12px rgba(255,61,66,.38));transform:translate(-50%,-50%) perspective(600px) rotateX(67deg)}
  .intro-slogan-rotator span:not(:first-child){display:none}
}
