
@font-face {
  font-family: 'PoppinsLocal';
  src: url('fonts/Poppins-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'PoppinsLocal';
  src: url('fonts/Poppins-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'PoppinsLocal';
  src: url('fonts/Poppins-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'PoppinsLocal';
  src: url('fonts/Poppins-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'PoppinsLocal';
  src: url('fonts/Poppins-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}



:root{
  --s:1;
  --green:#9abd35;
}

*{box-sizing:border-box}

html,body{
  margin:0;
  width:100%;
  height:100%;
  background:#000;
  color:#fff;
  overflow:hidden;
  font-family:'PoppinsLocal','Poppins',Arial,sans-serif;
}

.scene{
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  overflow:hidden;
  background:#000;
}

/* Left side */
.rail{
  position:absolute;
  left:0;
  top:0;
  width:calc(238px * var(--s));
  height:100vh;
  z-index:10;
  background:#000;
}

.rna-logo{
  position:absolute;
  left:calc(68px * var(--s));
  top:calc(69px * var(--s));
  width:calc(72px * var(--s));
  height:auto;
  display:block;
}

.contact-trigger{
  position:absolute;
  left:calc(68px * var(--s));
  top:calc(405px * var(--s));
  width:calc(80px * var(--s));
  height:calc(28px * var(--s));
  border:0;
  padding:0;
  background:transparent;
  cursor:pointer;
  display:flex;
  align-items:center;
  font-family:inherit;
}

.contact-fill{
  position:absolute;
  left:0;
  top:0;
  width:calc(7px * var(--s));
  height:calc(28px * var(--s));
  background:linear-gradient(90deg,#b6f36b 0%,#98ba25 100%);
  transition:width .28s ease;
}

.contact-line{
  position:relative;
  z-index:1;
  display:block;
  width:calc(7px * var(--s));
  height:calc(28px * var(--s));
  flex:0 0 calc(7px * var(--s));
}

.contact-label{
  position:relative;
  z-index:1;
  margin-left:calc(10px * var(--s));
  color:#fff;
  font-size:calc(10px * var(--s));
  font-weight:400;
  transition:color .2s ease, transform .28s ease;
}

.contact-trigger:hover .contact-fill{width:calc(80px * var(--s))}
.contact-trigger:hover .contact-label{color:#000;transform:translateX(calc(3px * var(--s)))}

/* Cards */
.card-window{
  position:absolute;
  inset:0;
  overflow:hidden;
  z-index:1;
}

.card-track{
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:calc(2700px * var(--s));
  animation:moveUp 72s linear infinite;
  will-change:transform;
}

.card-window:hover .card-track{animation-play-state:paused}

.card{
  position:absolute;
  left:calc(var(--x) * 1px * var(--s));
  top:calc(var(--y) * 1px * var(--s));
  width:calc(var(--w) * 1px * var(--s));
  height:calc(var(--h) * 1px * var(--s));
  display:block;
  border:0;
  padding:0;
  margin:0;
  overflow:hidden;
  background:#111;
  cursor:pointer;
  transition:opacity .28s ease, transform .28s ease, filter .28s ease;
}



.card img.cover{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.card-window:has(.card:hover) .card{
  opacity:.42;
  filter:saturate(.75);
}

.card-window:has(.card:hover) .card:hover{
  opacity:1;
  filter:saturate(1);
  transform:translateY(calc(-4px * var(--s)));
  z-index:5;
}

.play{
  position:absolute;
  left:50%;
  top:50%;
  width:calc(30px * var(--s));
  height:calc(30px * var(--s));
  transform:translate(-50%,-50%);
  z-index:2;
  pointer-events:none;
  transition:transform .28s ease, filter .28s ease;
}

.play img{width:100%;height:100%;display:block}

.card:hover .play{
  transform:translate(-50%,-50%) scale(1.12);
  filter:drop-shadow(0 0 calc(8px * var(--s)) rgba(255,255,255,.42));
}

.card:hover .play::after{
  content:"";
  position:absolute;
  inset:calc(-8px * var(--s));
  border:calc(1px * var(--s)) solid rgba(255,255,255,.42);
  border-radius:50%;
  animation:playPulse 1.25s ease-out infinite;
}

@keyframes playPulse{
  0%{transform:scale(.75);opacity:.75}
  100%{transform:scale(1.25);opacity:0}
}

@keyframes moveUp{
  0%{transform:translateY(0)}
  100%{transform:translateY(calc(-1410px * var(--s)))}
}

/* Overlay */
.dim{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.62);
  z-index:20;
  display:none;
}

.dim.open{display:block}

.modal-layer{
  position:absolute;
  inset:0;
  z-index:30;
  display:none;
  pointer-events:none;
}

.modal-layer.open{
  display:block;
  pointer-events:auto;
}

/* Film popup */
.film-box{
  position:absolute;
  left:calc(238px * var(--s));
  top:calc(52px * var(--s));
  width:calc(545px * var(--s));
  min-height:calc(374px * var(--s));
  background:#000;
  border-radius:calc(10px * var(--s)) calc(10px * var(--s)) 0 0;
  padding:calc(16px * var(--s)) calc(17px * var(--s));
  box-shadow:0 calc(22px * var(--s)) calc(70px * var(--s)) rgba(0,0,0,.7);
}

.film-box h2{
  margin:0 0 calc(14px * var(--s));
  font-size:calc(16px * var(--s));
  line-height:1;
  font-weight:600;
}

.film-player{
  width:calc(511px * var(--s));
  height:calc(286px * var(--s));
  border-radius:calc(8px * var(--s));
  overflow:hidden;
  background:#111;
}

.film-player iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
}

.film-tags{
  margin-top:calc(12px * var(--s));
  display:flex;
  gap:calc(10px * var(--s));
  flex-wrap:wrap;
  text-transform:uppercase;
  font-size:calc(7px * var(--s));
  font-weight:500;
}

.film-tags span::before{content:'+ '}

.close-button{
  position:absolute;
  right:calc(20px * var(--s));
  top:calc(14px * var(--s));
  width:calc(20px * var(--s));
  height:calc(20px * var(--s));
  border:0;
  padding:0;
  background:transparent;
  cursor:pointer;
  z-index:4;
}

.close-button img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
}

.close-after{display:none}
.close-button:hover .close-before{display:none}
.close-button:hover .close-after{display:block}

/* Contact popup - clean component */
.contact-box{
  position:absolute;
  left:calc(238px * var(--s));
  top:calc(34px * var(--s));
  width:calc(545px * var(--s));
  height:calc(430px * var(--s));
  background:#000;
  overflow:hidden;
  border-radius:calc(12px * var(--s)) calc(12px * var(--s)) 0 0;
  box-shadow:0 calc(22px * var(--s)) calc(70px * var(--s)) rgba(0,0,0,.7);
}

.contact-box::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,#020302 0%,#14210d 42%,#9dbc35 100%);
  z-index:0;
}

.contact-content{
  position:relative;
  z-index:1;
  height:100%;
  padding:calc(34px * var(--s)) calc(73px * var(--s)) calc(24px * var(--s));
}

.contact-head{
  transition:opacity .28s ease, transform .28s ease;
}

.contact-head h2{
  margin:0;
  font-size:calc(26px * var(--s));
  line-height:1;
  font-weight:700;
  letter-spacing:-.02em;
}

.contact-head p{
  width:calc(360px * var(--s));
  margin:calc(10px * var(--s)) 0 calc(24px * var(--s));
  color:#fff;
  font-size:calc(6.5px * var(--s));
  line-height:1.7;
  font-weight:400;
}

.contact-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:calc(30px * var(--s));
  row-gap:calc(17px * var(--s));
  transition:opacity .28s ease, transform .28s ease;
}

.field{
  position:relative;
  display:block;
  color:#fff;
  font-size:calc(7px * var(--s));
  line-height:1;
  font-weight:400;
}

.field > span{
  display:block;
  margin-bottom:calc(8px * var(--s));
}

.field input,
.field textarea{
  display:block;
  width:100%;
  height:calc(16px * var(--s));
  border:0;
  border-bottom:calc(1px * var(--s)) solid rgba(255,255,255,.78);
  background:transparent;
  color:#fff;
  outline:none;
  padding:0;
  font-family:inherit;
  font-size:calc(9px * var(--s));
}

.field.wide{grid-column:1/-1}

.field textarea{
  height:calc(46px * var(--s));
  resize:none;
  overflow-y:auto;
  line-height:1.4;
  padding-right:calc(6px * var(--s));
}

.required-field small{
  position:absolute;
  left:0;
  top:calc(31px * var(--s));
  color:#9abd35;
  font-size:calc(5.8px * var(--s));
  line-height:1;
  opacity:0;
  transform:translateY(calc(-3px * var(--s)));
  pointer-events:none;
  transition:opacity .22s ease, transform .22s ease;
}

.required-field.is-error small{
  opacity:1;
  transform:translateY(0);
}

.required-field.is-error input{
  border-bottom-color:#9abd35;
  box-shadow:0 calc(6px * var(--s)) calc(14px * var(--s)) rgba(154,189,53,.18);
}

.required-field.shake{
  animation:fieldShake .30s ease;
}

@keyframes fieldShake{
  0%,100%{transform:translateX(0)}
  25%{transform:translateX(calc(-4px * var(--s)))}
  75%{transform:translateX(calc(4px * var(--s)))}
}

.file-label > span{
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:calc(1px * var(--s)) solid rgba(255,255,255,.78);
  padding-bottom:calc(8px * var(--s));
  margin-bottom:0;
}

.file-icon{
  width:calc(13px * var(--s));
  height:calc(13px * var(--s));
  object-fit:contain;
}

.file-label input[type=file]{
  opacity:0;
  position:absolute;
  inset:0;
  height:calc(30px * var(--s));
  cursor:pointer;
}

.file-hint{
  display:block;
  min-height:calc(9px * var(--s));
  margin-top:calc(6px * var(--s));
  color:rgba(255,255,255,.78);
  font-size:calc(5.6px * var(--s));
  line-height:1.2;
}

.file-label.is-ok .file-hint,
.file-label.is-error .file-hint{color:#9abd35}

.file-label.is-error{animation:fieldShake .30s ease}

.send-button{
  position:relative;
  grid-column:1/2;
  width:calc(130px * var(--s));
  height:calc(28px * var(--s));
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  overflow:visible;
}

.send-button img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  transition:opacity .22s ease;
}

.send-hover{opacity:0}
.send-button:hover .send-normal{opacity:0}
.send-button:hover .send-hover{opacity:1}

.success-message{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  opacity:0;
  pointer-events:none;
  transform:translateY(calc(12px * var(--s)));
  transition:opacity .35s ease, transform .35s ease;
  text-align:center;
}

.success-icon{
  width:calc(52px * var(--s));
  height:calc(52px * var(--s));
  border-radius:50%;
  border:calc(2px * var(--s)) solid #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:calc(18px * var(--s));
}

.success-icon span{
  width:calc(24px * var(--s));
  height:calc(13px * var(--s));
  border-left:calc(3px * var(--s)) solid #9abd35;
  border-bottom:calc(3px * var(--s)) solid #9abd35;
  transform:rotate(-45deg) translate(calc(1px * var(--s)), calc(-2px * var(--s)));
}

.success-message h3{
  margin:0;
  color:#fff;
  font-size:calc(18px * var(--s));
  line-height:1.25;
  font-weight:700;
}

.contact-box.is-sent .contact-head,
.contact-box.is-sent .contact-form{
  opacity:0;
  transform:translateY(calc(-10px * var(--s)));
  pointer-events:none;
}

.contact-box.is-sent .success-message{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}

@media (prefers-reduced-motion:reduce){
  .card-track{animation:none}
  .play::after{animation:none}
}

/* v31 final contact fixes */
.contact-box::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 50% 4%,rgba(255,255,255,.08),transparent 55%);
  z-index:0;
  pointer-events:none;
}

.contact-content{
  position:relative;
  z-index:1;
}

.contact-box.is-sent .contact-head,
.contact-box.is-sent .contact-form{
  opacity:0!important;
  pointer-events:none!important;
}

.success-message{
  inset:0!important;
}

.file-hint:empty{
  display:none!important;
}

/* v32 contact refinements */
.contact-form{
  align-items:start!important;
}

.file-label{
  min-height:calc(36px * var(--s));
}

.file-label > span{
  height:calc(24px * var(--s));
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  border-bottom:calc(1px * var(--s)) solid rgba(255,255,255,.78)!important;
  padding-bottom:calc(8px * var(--s))!important;
  margin-bottom:0!important;
}

.file-icon{
  margin-top:calc(-2px * var(--s));
}

.file-label input[type=file]{
  inset:0!important;
  height:calc(30px * var(--s))!important;
}

.file-hint{
  margin-top:calc(6px * var(--s))!important;
  min-height:calc(9px * var(--s))!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.field input{
  height:calc(16px * var(--s))!important;
}

/* v33 hard stop for duplicate zemin svg */
.contact-box::before{
  background:linear-gradient(180deg,#020302 0%,#14210d 42%,#9dbc35 100%)!important;
}

.contact-box::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 50% 4%,rgba(255,255,255,.08),transparent 55%);
  z-index:0;
  pointer-events:none;
}

.contact-content{
  position:relative;
  z-index:1;
}

/* v34 tiny fixes only */

/* Close icon: before normal, after on hover */
.close-button .close-before{
  display:block!important;
}

.close-button .close-after{
  display:none!important;
}

.close-button:hover .close-before{
  display:none!important;
}

.close-button:hover .close-after{
  display:block!important;
}

/* Telefon ve Doküman/Belge çizgilerini aynı hatta sabitle */
.file-label > span{
  height:calc(24px * var(--s))!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  border-bottom:calc(1px * var(--s)) solid rgba(255,255,255,.78)!important;
  padding-bottom:calc(8px * var(--s))!important;
  margin-bottom:0!important;
}

.file-label input[type=file]{
  position:absolute!important;
  inset:0!important;
  height:calc(30px * var(--s))!important;
  opacity:0!important;
  cursor:pointer!important;
}

/* Dosya durum mesajı çizginin altında değil, yazı ile çizgi arasında görünsün */
.file-hint{
  position:absolute!important;
  left:0!important;
  right:calc(18px * var(--s))!important;
  top:calc(13px * var(--s))!important;
  min-height:0!important;
  margin-top:0!important;
  color:rgba(255,255,255,.82)!important;
  font-size:calc(5.3px * var(--s))!important;
  line-height:1.15!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  pointer-events:none!important;
}

.file-hint:empty{
  display:none!important;
}

.file-label.is-ok .file-hint,
.file-label.is-error .file-hint{
  color:#9abd35!important;
}

/* v36 targeted release fixes */

/* 2 - Telefon / Doküman-Belge çizgisi aynı Y koordinatında */
.file-label{
  position:relative!important;
}

.file-label > span{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  border-bottom:0!important;
  padding-bottom:0!important;
  margin-bottom:calc(8px * var(--s))!important;
}

.file-label::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:calc(31px * var(--s));
  border-bottom:calc(1px * var(--s)) solid rgba(255,255,255,.78);
  pointer-events:none;
}

.file-label .file-icon{
  width:calc(13px * var(--s))!important;
  height:calc(13px * var(--s))!important;
  margin-top:calc(-2px * var(--s))!important;
}

.file-label input[type=file]{
  position:absolute!important;
  inset:0!important;
  height:calc(34px * var(--s))!important;
  opacity:0!important;
  cursor:pointer!important;
}

/* 3 - Dosya durumu yazı ile çizgi arasında */
.file-hint{
  position:absolute!important;
  left:0!important;
  right:calc(18px * var(--s))!important;
  top:calc(17px * var(--s))!important;
  min-height:0!important;
  margin:0!important;
  font-size:calc(5.3px * var(--s))!important;
  line-height:1.1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  color:rgba(255,255,255,.82)!important;
  pointer-events:none!important;
}

.file-hint:empty{
  display:none!important;
}

.file-label.is-ok .file-hint,
.file-label.is-error .file-hint{
  color:#9abd35!important;
}

/* 5 - Popup açılınca animasyon durur, arka plan hafif blur olur */
.scene.modal-open .card-track{
  animation-play-state:paused!important;
}

.scene.modal-open .card-window,
.scene.modal-open .rail{
  filter:blur(calc(1.25px * var(--s)));
  transition:filter .22s ease;
}

.scene:not(.modal-open) .card-window,
.scene:not(.modal-open) .rail{
  filter:none!important;
}

/* 6 - Infinite loop boşluk düzeltmesi */


.card-track{
  height:calc(4230px * var(--s))!important;
  animation:moveUpV36 96s linear infinite!important;
  will-change:transform;
}

.card-window:hover .card-track{
  animation-play-state:paused!important;
}

@keyframes moveUpV36{
  0%{transform:translateY(0)}
  100%{transform:translateY(calc(-1410px * var(--s)))}
}

/* v37: removable upload list + tighter infinite loop */

/* Dosya durum/listesi kompakt; çizgi hizasını bozmaz */
.file-list{
  position:absolute;
  left:0;
  right:0;
  top:calc(31px * var(--s));
  display:flex;
  flex-wrap:wrap;
  gap:calc(4px * var(--s));
  z-index:3;
}

.file-chip{
  display:inline-flex;
  align-items:center;
  gap:calc(4px * var(--s));
  max-width:calc(88px * var(--s));
  height:calc(13px * var(--s));
  padding:0 calc(5px * var(--s));
  border-radius:calc(7px * var(--s));
  background:rgba(0,0,0,.36);
  color:#fff;
  font-size:calc(5.1px * var(--s));
  line-height:1;
  overflow:hidden;
}

.file-chip span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.file-remove{
  flex:0 0 auto;
  border:0;
  padding:0;
  margin:0;
  width:calc(8px * var(--s));
  height:calc(8px * var(--s));
  background:transparent;
  color:#9abd35;
  font-size:calc(8px * var(--s));
  line-height:calc(8px * var(--s));
  cursor:pointer;
}

.file-hint{
  right:calc(18px * var(--s))!important;
}

/* Boşluk hatası: loop mesafesini daha sıkı döndür */




.card-track{
  height:calc(4128px * var(--s))!important;
  animation:moveUpV37 96s linear infinite!important;
}

@keyframes moveUpV37{
  0%{transform:translateY(0)}
  100%{transform:translateY(calc(-1376px * var(--s)))}
}

/* v38 final: Anasayfa loop fix only */

/* Boxlar yalnızca gerçek kartın üzerindeyken dursun; sağdaki siyah alanda durmasın */
.card-window:hover .card-track{
  animation-play-state:running!important;
}

.card-window:has(.card:hover) .card-track{
  animation-play-state:paused!important;
}

/* Popup açıkken yine dursun */
.scene.modal-open .card-track{
  animation-play-state:paused!important;
}

/* Anasayfa.zip'e göre iki kolon aynı yerde bitti: cycle = 1359 */




.card-track{
  height:calc(4077px * var(--s))!important;
  animation:moveUpV38 96s linear infinite!important;
}

@keyframes moveUpV38{
  0%{transform:translateY(0)}
  100%{transform:translateY(calc(-1359px * var(--s)))}
}

/* v39: final loop spacing + phone required support */

/* Loop başlangıcında kutular temas etmesin, normal kart aralığı kalsın */




.card-track{
  height:calc(4170px * var(--s))!important;
  animation:moveUpV39 96s linear infinite!important;
}

@keyframes moveUpV39{
  0%{transform:translateY(0)}
  100%{transform:translateY(calc(-1390px * var(--s)))}
}

/* Telefon da zorunlu alan olduğunda hata mesajı düzgün dursun */
.required-field small{
  top:calc(31px * var(--s))!important;
}

/* v40 final touch - only requested items */

/* 1. Loop geçiş boşluğu yaklaşık 30px */




/* 2. Kayma hızı %20 artırıldı */
.card-track{
  height:calc(4119px * var(--s))!important;
  animation:moveUpV40 40s linear infinite!important;
}

@keyframes moveUpV40{
  0%{transform:translateY(0)}
  100%{transform:translateY(calc(-1373px * var(--s)))}
}

/* 3. RNA logo üst boşluk ayarı */
.rna-logo{
  top:calc(55px * var(--s))!important;
}

.contact-head a {

  color: inherit;

  text-decoration: none;

  cursor: pointer;

}

.contact-head a:hover,

.contact-head a:focus,

.contact-head a:visited {

  color: inherit;

  text-decoration: none;

}






.card-hover-info{
  position:absolute;
  left:calc(12px * var(--s));
  top:calc(12px * var(--s));
  z-index:4;
  opacity:0;
  transform:translateY(calc(6px * var(--s)));
  transition:opacity .25s ease, transform .25s ease;
  pointer-events:none;
  max-width:calc(210px * var(--s));
}

.card:hover .card-hover-info{
  opacity:1;
  transform:translateY(0);
}

.card-hover-title{
  color:#fff;
  font-weight:600;
  font-size:calc(11px * var(--s));
  line-height:1.15;
  margin-bottom:calc(5px * var(--s));
  text-shadow:0 2px 12px rgba(0,0,0,.45);
}

.card-hover-tags{
  display:flex;
  flex-wrap:wrap;
  gap:calc(4px * var(--s));
}

.card-hover-tags span{
  display:inline-flex;
  align-items:center;
  height:calc(13px * var(--s));
  padding:0 calc(6px * var(--s));
  border-radius:calc(8px * var(--s));
  background:rgba(154,189,53,.88);
  color:#0b0b0b;
  font-size:calc(5.5px * var(--s));
  font-weight:600;
  line-height:1;
}


/* RNA card hover info fix */
.card-hover-info{
  left:calc(12px * var(--s)) !important;
  right:auto !important;
  top:calc(12px * var(--s)) !important;
  text-align:left !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
}

.card-hover-title{
  text-align:left !important;
}

.card-hover-tags{
  justify-content:flex-start !important;
  align-items:flex-start !important;
  gap:calc(5px * var(--s)) !important;
}

.card-hover-tags span{
  background:transparent !important;
  color:#fff !important;
  border-radius:0 !important;
  padding:0 !important;
  height:auto !important;
  font-size:calc(5.8px * var(--s)) !important;
  font-weight:500 !important;
  text-shadow:0 2px 10px rgba(0,0,0,.45);
}

.card-hover-tags span::before{
  content:"+ ";
  color:#9abd35;
  font-weight:700;
}


/* RNA card hover info - final mirror style */
.card .card-hover-info{
  position:absolute !important;
  left:calc(12px * var(--s)) !important;
  right:auto !important;
  top:calc(12px * var(--s)) !important;
  z-index:4 !important;
  max-width:calc(220px * var(--s)) !important;
  opacity:0;
  transform:translateY(calc(6px * var(--s)));
  transition:opacity .25s ease, transform .25s ease;
  pointer-events:none;
  text-align:left !important;
}

.card:hover .card-hover-info{
  opacity:1;
  transform:translateY(0);
}

.card .card-hover-title{
  color:#fff !important;
  font-weight:700 !important;
  font-size:calc(13px * var(--s)) !important;
  line-height:1.12 !important;
  margin:0 0 calc(7px * var(--s)) 0 !important;
  text-align:left !important;
  text-shadow:0 2px 12px rgba(0,0,0,.45);
}

.card .card-hover-tags{
  margin-top:0 !important;
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:flex-start !important;
  align-items:flex-start !important;
  gap:calc(10px * var(--s)) !important;
  text-align:left !important;
  text-transform:uppercase !important;
  font-size:calc(7px * var(--s)) !important;
  font-weight:500 !important;
  line-height:1.25 !important;
  color:#fff !important;
}

.card .card-hover-tags span{
  display:inline !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  padding:0 !important;
  margin:0 !important;
  height:auto !important;
  color:#fff !important;
  font-size:inherit !important;
  font-weight:inherit !important;
  line-height:inherit !important;
  text-shadow:0 2px 10px rgba(0,0,0,.45);
}

.card .card-hover-tags span::before{
  content:'+ ' !important;
  color:#fff !important;
  font-weight:inherit !important;
}

/* RNA hover font final */
.card-hover-info,
.card-hover-title,
.card-hover-tags,
.card-hover-tags span,
.card-hover-tags span::before{
  font-family:"Poppins", sans-serif !important;
}

.card-hover-title{
  font-weight:600 !important;
}

.card-hover-tags span{
  font-weight:400 !important;
  letter-spacing:.04em !important;
  text-transform:uppercase !important;
}

.card-hover-tags span::before{
  content:"+ " !important;
  color:#fff !important;
  font-weight:400 !important;
  margin-right:calc(3px * var(--s)) !important;
}


/* RNA hover font final v2 */
.card-hover-info,
.card-hover-title,
.card-hover-tags,
.card-hover-tags span,
.card-hover-tags span::before{
  font-family:'PoppinsLocal','Poppins',Arial,sans-serif !important;
}


/* RNA hover match film modal typography */
.card-hover-info{
  left:calc(12px * var(--s)) !important;
  top:calc(12px * var(--s)) !important;
  right:auto !important;
  text-align:left !important;
  font-family:'PoppinsLocal','Poppins',Arial,sans-serif !important;
}

.card-hover-title{
  margin:0 0 calc(12px * var(--s)) !important;
  font-family:'PoppinsLocal','Poppins',Arial,sans-serif !important;
  font-size:calc(16px * var(--s)) !important;
  line-height:1 !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
  color:#fff !important;
}

.card-hover-tags.film-tags{
  margin-top:0 !important;
  display:flex !important;
  gap:calc(10px * var(--s)) !important;
  flex-wrap:wrap !important;
  text-transform:uppercase !important;
  font-family:'PoppinsLocal','Poppins',Arial,sans-serif !important;
  font-size:calc(7px * var(--s)) !important;
  font-weight:500 !important;
  letter-spacing:0 !important;
}

.card-hover-tags.film-tags span{
  font-family:'PoppinsLocal','Poppins',Arial,sans-serif !important;
  font-size:calc(7px * var(--s)) !important;
  font-weight:500 !important;
  letter-spacing:0 !important;
  color:#fff !important;
  background:transparent !important;
  padding:0 !important;
  height:auto !important;
  border-radius:0 !important;
}

.card-hover-tags.film-tags span::before{
  content:'+ ' !important;
  color:#fff !important;
  font-weight:500 !important;
  margin-right:0 !important;
}


/* RNA hover match film modal typography */
.card-hover-info{
  left:calc(12px * var(--s)) !important;
  top:calc(12px * var(--s)) !important;
  right:auto !important;
  text-align:left !important;
  font-family:'PoppinsLocal','Poppins',Arial,sans-serif !important;
}

.card-hover-title{
  margin:0 0 calc(12px * var(--s)) !important;
  font-family:'PoppinsLocal','Poppins',Arial,sans-serif !important;
  font-size:calc(16px * var(--s)) !important;
  line-height:1 !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
  color:#fff !important;
}

.card-hover-tags.film-tags{
  margin-top:0 !important;
  display:flex !important;
  gap:calc(10px * var(--s)) !important;
  flex-wrap:wrap !important;
  text-transform:uppercase !important;
  font-family:'PoppinsLocal','Poppins',Arial,sans-serif !important;
  font-size:calc(7px * var(--s)) !important;
  font-weight:500 !important;
  letter-spacing:0 !important;
}

.card-hover-tags.film-tags span{
  font-family:'PoppinsLocal','Poppins',Arial,sans-serif !important;
  font-size:calc(7px * var(--s)) !important;
  font-weight:500 !important;
  letter-spacing:0 !important;
  color:#fff !important;
  background:transparent !important;
  padding:0 !important;
  height:auto !important;
  border-radius:0 !important;
}

.card-hover-tags.film-tags span::before{
  content:'+ ' !important;
  color:#fff !important;
  font-weight:500 !important;
  margin-right:0 !important;
}



/* RNA unlimited projects fix */
.card-track .card{
  display:block !important;
  visibility:visible !important;
}


/* RNA remove browser focus outline on project cards */
.card:focus,
.card:focus-visible,
.card:active{
  outline:none !important;
  box-shadow:none !important;
}


/* RNA hide static cards until CMS projects are loaded */
.card-track{
  opacity:0;
}

body.rna-cards-ready .card-track{
  opacity:1;
}


/* RNA contact: hide legacy upload loading text */
#uploadProgressText{
  display:none !important;
}


/* RNA contact: prevent repeated submit visually */
.send-button:disabled,
.contact-form button[type="submit"]:disabled{
  pointer-events:none;
  opacity:.65;
}



/* RNA Plyr clean video player */
.film-player .plyr,
.film-player .plyr__video-wrapper,
.film-player .plyr iframe{
  width:100%!important;
  height:100%!important;
}

.film-player .plyr{
  border-radius:calc(8px * var(--s))!important;
  overflow:hidden!important;
  background:#000!important;
}

.film-player .plyr__controls{
  font-family:'PoppinsLocal','Poppins',Arial,sans-serif!important;
}

/* RNA Plyr YouTube UI crop final */
.film-player .plyr__video-embed{
  overflow:hidden!important;
}

.film-player .plyr__video-embed iframe{
  width:100%!important;
  height:200%!important;
  top:-50%!important;
  left:0!important;
  position:absolute!important;
}

/* YouTube iframe içindeki üst başlık / alt öneri alanlarını kırpar */
.film-player .plyr__video-wrapper{
  overflow:hidden!important;
  border-radius:calc(8px * var(--s))!important;
}


/* RNA Brand Color for Plyr */
:root{
    --plyr-color-main:#9ABD35;
}


/* Pause portfolio animation while hovering a card */
.card-track:hover{
    animation-play-state: paused !important;
}


/* RNA contact button viewport safety */
.contact-trigger{
  top:min(calc(405px * var(--s)), calc(100vh - 78px))!important;
}


/* RNA contact button symmetric vertical spacing */
.contact-trigger{
  top:auto!important;
  bottom:calc(55px * var(--s))!important;
}


/* RNA modal vertical center only */
.film-box{
  top:50%!important;
  transform:translateY(-50%)!important;
}

.contact-box{
  top:50%!important;
  transform:translateY(-50%)!important;
}


/* RNA Mobile v1 */
@media (max-width:768px){

  html, body{
    overflow-x:hidden!important;
  }

  .logo{
    position:fixed!important;
    left:24px!important;
    top:24px!important;
    width:72px!important;
    height:auto!important;
    z-index:30!important;
  }

  .contact-trigger{
    position:fixed!important;
    right:24px!important;
    left:auto!important;
    top:28px!important;
    bottom:auto!important;
    z-index:30!important;
    font-size:13px!important;
    transform:none!important;
  }

  .contact-trigger::before{
    height:28px!important;
  }

  .card-window{
    position:relative!important;
    left:auto!important;
    top:auto!important;
    width:100%!important;
    height:auto!important;
    overflow:visible!important;
    padding:96px 18px 32px!important;
  }

  .card-track{
    position:relative!important;
    transform:none!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:12px!important;
    width:100%!important;
    animation:none!important;
  }

  .card{
    position:relative!important;
    left:auto!important;
    top:auto!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:4/5!important;
    transform:none!important;
  }

  .card .cover{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }

  .card-hover-info{
    display:none!important;
  }

  .rna-scroll-progress{
    display:none!important;
  }

}


/* RNA Mobile Final v2 */
@media (max-width:768px){

  html, body{
    height:auto!important;
    min-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    background:#000!important;
  }

  .scene{
    position:relative!important;
    width:100%!important;
    height:auto!important;
    min-height:100vh!important;
    overflow:visible!important;
  }

  .rail{
    position:fixed!important;
    left:0!important;
    top:0!important;
    width:100%!important;
    height:76px!important;
    background:#000!important;
    z-index:80!important;
  }

  .rna-logo{
    position:fixed!important;
    left:18px!important;
    top:22px!important;
    width:70px!important;
    z-index:90!important;
  }

  .contact-trigger{
    position:fixed!important;
    right:18px!important;
    left:auto!important;
    top:25px!important;
    bottom:auto!important;
    z-index:90!important;
    transform:none!important;
  }

  .card-window{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:auto!important;
    overflow:visible!important;
    padding:92px 12px 36px!important;
  }

  .card-track{
    position:relative!important;
    left:auto!important;
    top:auto!important;
    width:100%!important;
    height:auto!important;
    animation:none!important;
    transform:none!important;
    column-count:2!important;
    column-gap:12px!important;
  }

  .card{
    position:relative!important;
    left:auto!important;
    top:auto!important;
    width:100%!important;
    height:auto!important;
    margin:0 0 12px!important;
    display:block!important;
    break-inside:avoid!important;
    aspect-ratio:var(--w) / var(--h)!important;
    transform:none!important;
    opacity:1!important;
    filter:none!important;
    background:#000!important;
  }

  .card img.cover{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    background:#000!important;
  }

  .card-hover-info,
  .rna-scroll-progress{
    display:none!important;
  }

  .play{
    width:38px!important;
    height:38px!important;
  }

  .film-modal.open,
  .contact-modal.open{
    position:fixed!important;
    inset:0!important;
    display:block!important;
    background:#000!important;
    z-index:120!important;
  }

  .film-box{
    position:fixed!important;
    inset:0!important;
    left:0!important;
    top:0!important;
    width:100vw!important;
    height:100vh!important;
    min-height:100vh!important;
    padding:70px 16px 28px!important;
    border-radius:0!important;
    transform:none!important;
    box-shadow:none!important;
    overflow:auto!important;
  }

  .film-box h2{
    font-size:24px!important;
    line-height:1.15!important;
    margin:0 54px 18px 0!important;
  }

  .film-player{
    width:100%!important;
    height:auto!important;
    aspect-ratio:16 / 9!important;
    border-radius:12px!important;
  }

  .film-tags{
    margin-top:18px!important;
    font-size:12px!important;
    gap:12px!important;
  }

  .contact-box{
    position:fixed!important;
    inset:0!important;
    left:0!important;
    top:0!important;
    width:100vw!important;
    height:100vh!important;
    border-radius:0!important;
    transform:none!important;
    box-shadow:none!important;
    overflow:auto!important;
  }

  .contact-content{
    padding:72px 22px 34px!important;
    height:auto!important;
    min-height:100vh!important;
  }

  .contact-head h2{
    font-size:38px!important;
  }

  .contact-head p{
    width:auto!important;
    font-size:12px!important;
    line-height:1.55!important;
    margin-bottom:28px!important;
  }

  .contact-form{
    display:block!important;
  }

  .contact-form .field{
    width:100%!important;
    margin:0 0 24px!important;
  }

  .field input,
  .field textarea{
    width:100%!important;
    font-size:17px!important;
    min-height:34px!important;
  }

  .field textarea{
    min-height:110px!important;
  }

  .send-button{
    width:130px!important;
    height:28px!important;
    margin-top:8px!important;
  }

  .close-button{
    position:fixed!important;
    right:18px!important;
    top:18px!important;
    z-index:140!important;
  }
}


/* RNA Mobile Polish Final */
@media (max-width:768px){

  .rna-logo,
  .logo{
    width:82px!important;
  }

  .contact-trigger{
    font-size:16px!important;
    font-weight:600!important;
    right:22px!important;
    top:31px!important;
  }

  .contact-trigger::before{
    width:5px!important;
    height:36px!important;
    margin-right:10px!important;
  }

  .card-window{
    padding:108px 20px 44px!important;
  }

  .card-track{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    column-count:unset!important;
    gap:18px!important;
    align-items:start!important;
  }

  .card{
    margin:0!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:var(--w) / var(--h)!important;
    break-inside:auto!important;
  }

  .card img.cover{
    object-fit:cover!important;
  }

  .play{
    width:48px!important;
    height:48px!important;
  }

  .film-modal.open{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
  }

  .film-box{
    position:relative!important;
    inset:auto!important;
    width:100vw!important;
    height:auto!important;
    min-height:auto!important;
    max-height:100vh!important;
    padding:72px 16px 28px!important;
    overflow:hidden!important;
  }

  .film-player{
    width:100%!important;
    aspect-ratio:16/9!important;
    height:auto!important;
  }

  .film-box .close-button,
  .contact-box .close-button,
  .close-button{
    width:44px!important;
    height:44px!important;
    right:18px!important;
    top:18px!important;
  }

  .close-button img{
    width:44px!important;
    height:44px!important;
  }

  .contact-head h2{
    font-size:42px!important;
  }

  .contact-head p{
    font-size:15px!important;
    line-height:1.55!important;
  }

  .contact-form .field span,
  .field span,
  .file-label span{
    font-size:15px!important;
    line-height:1.3!important;
  }

  .field input,
  .field textarea{
    font-size:17px!important;
    line-height:1.4!important;
  }

  .field small{
    font-size:12px!important;
  }

  .file-hint,
  .file-status,
  .file-list,
  .file-chip{
    font-size:13px!important;
  }

  .send-button{
    width:150px!important;
    height:42px!important;
    font-size:16px!important;
  }
}


/* RNA Mobile Polish v2 */
@media (max-width:768px){

  /* 1- Kart boşlukları: masonry ama eşit dikey aralık */
  .card-window{
    padding:108px 18px 44px!important;
  }

  .card-track{
    display:block!important;
    column-count:2!important;
    column-gap:18px!important;
  }

  .card{
    display:block!important;
    width:100%!important;
    margin:0 0 18px!important;
    break-inside:avoid!important;
    aspect-ratio:var(--w) / var(--h)!important;
  }

  /* 2- Mobil iletişim butonu büyütme */
  .contact-trigger{
    font-size:24px!important;
    line-height:1!important;
    font-weight:600!important;
    right:24px!important;
    top:36px!important;
  }

  .contact-trigger::before{
    width:7px!important;
    height:48px!important;
    margin-right:14px!important;
  }

  /* 3- Mobil iletişim formu toparlama */
  .contact-modal.open{
    overflow:hidden!important;
  }

  .contact-box{
    min-height:100dvh!important;
    height:100dvh!important;
    overflow:auto!important;
  }

  .contact-box::before{
    min-height:100dvh!important;
  }

  .contact-content{
    min-height:100dvh!important;
    padding:74px 24px 34px!important;
    box-sizing:border-box!important;
  }

  .contact-form{
    display:block!important;
  }

  .contact-form .field,
  .contact-form .field.wide{
    width:100%!important;
    margin-bottom:24px!important;
  }

  .file-label{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:16px!important;
    min-height:42px!important;
  }

  .file-label span{
    font-size:16px!important;
  }

  .file-icon{
    width:28px!important;
    height:28px!important;
    min-width:28px!important;
  }

  .send-button,
  .contact-form button[type="submit"]{
    width:180px!important;
    height:52px!important;
    font-size:18px!important;
    margin-top:10px!important;
    background:#3b3b3b!important;
  }
}


/* RNA Mobile Final Override */
@media (max-width:768px){

  /* 1- İletişim butonu gerçekten büyüsün */
  .contact-trigger{
    width:auto!important;
    height:42px!important;
    right:22px!important;
    top:25px!important;
    left:auto!important;
    bottom:auto!important;
  }

  .contact-trigger .contact-label{
    font-size:22px!important;
    font-weight:500!important;
    line-height:42px!important;
    margin-left:14px!important;
  }

  .contact-trigger .contact-line,
  .contact-trigger .contact-fill{
    width:7px!important;
    height:42px!important;
    flex:0 0 7px!important;
  }

  /* 2- Kart boşlukları daha sıkı ve ilk satır hizalı */
  .card-window{
    padding:104px 14px 34px!important;
  }

  .card-track{
    display:grid!important;
    grid-template-columns:repeat(2, minmax(0, 1fr))!important;
    gap:11px!important;
    column-count:unset!important;
  }

  .card{
    position:relative!important;
    left:auto!important;
    top:auto!important;
    margin:0!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:var(--w) / var(--h)!important;
    transform:none!important;
  }

  .card:nth-of-type(n+12),
  .card:nth-of-type(n+12):nth-of-type(-n+22),
  

  .card img.cover{
    object-fit:cover!important;
  }

  /* 3- İletişim formu mobilde okunur ve ekrana oturur */
  .contact-box{
    height:100dvh!important;
    min-height:100dvh!important;
    overflow:auto!important;
  }

  .contact-content{
    padding:72px 24px 28px!important;
    min-height:100dvh!important;
  }

  .contact-form{
    display:block!important;
  }

  .contact-form .field,
  .contact-form .field.wide{
    display:block!important;
    width:100%!important;
    margin:0 0 22px!important;
    font-size:16px!important;
  }

  .field > span,
  .file-label > span{
    font-size:16px!important;
    line-height:1.25!important;
  }

  .field input,
  .field textarea{
    font-size:17px!important;
    line-height:1.35!important;
    min-height:34px!important;
  }

  .file-label{
    position:relative!important;
    min-height:52px!important;
  }

  .file-label > span{
    height:34px!important;
    align-items:center!important;
  }

  .file-icon{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
  }

  .send-button{
    width:180px!important;
    height:52px!important;
    margin-top:4px!important;
    background:transparent!important;
  }
}


/* RNA Mobile Final Fix 2 */
@media (max-width:768px){

  /* 1- Kartlar: eşit dikey boşluk için masonry column düzenine geri dön */
  .card-window{
    padding:104px 14px 34px!important;
  }

  .card-track{
    display:block!important;
    column-count:2!important;
    column-gap:10px!important;
    gap:0!important;
  }

  .card{
    display:block!important;
    position:relative!important;
    left:auto!important;
    top:auto!important;
    width:100%!important;
    height:auto!important;
    margin:0 0 10px!important;
    break-inside:avoid!important;
    aspect-ratio:var(--w) / var(--h)!important;
    transform:none!important;
  }

  .card:nth-of-type(n+12),
  .card:nth-of-type(n+12):nth-of-type(-n+22),
  

  .card img.cover{
    object-fit:cover!important;
  }

  /* 2- İletişim yazısı: RNA logosundan yaklaşık %30 küçük */
  .rna-logo{
    width:82px!important;
  }

  .contact-trigger{
    width:auto!important;
    height:36px!important;
    right:20px!important;
    top:28px!important;
  }

  .contact-trigger .contact-label{
    font-size:15px!important;
    line-height:36px!important;
    font-weight:500!important;
    margin-left:10px!important;
  }

  .contact-trigger .contact-line,
  .contact-trigger .contact-fill{
    width:6px!important;
    height:36px!important;
    flex:0 0 6px!important;
  }

  /* 3- İletişim formu: doküman alanı, ikon ve zemin */
  .contact-modal.open{
    overflow:hidden!important;
  }

  .contact-box{
    height:100dvh!important;
    min-height:100dvh!important;
    overflow:auto!important;
    background:linear-gradient(180deg,#020302 0%,#14210d 42%,#9dbc35 100%)!important;
  }

  .contact-box::before{
    position:fixed!important;
    min-height:100dvh!important;
  }

  .contact-content{
    min-height:100dvh!important;
    padding:72px 24px 36px!important;
    box-sizing:border-box!important;
  }

  .contact-form{
    display:block!important;
  }

  .contact-form .field,
  .contact-form .field.wide{
    display:block!important;
    width:100%!important;
    margin:0 0 22px!important;
  }

  .field > span{
    font-size:16px!important;
    line-height:1.3!important;
  }

  .field input,
  .field textarea{
    font-size:17px!important;
    min-height:34px!important;
  }

  .file-label{
    display:block!important;
    position:relative!important;
    min-height:58px!important;
  }

  .file-label::after{
    top:38px!important;
  }

  .file-label > span{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    height:38px!important;
    font-size:16px!important;
    padding:0!important;
    margin:0!important;
    border-bottom:0!important;
  }

  .file-icon{
    width:32px!important;
    height:32px!important;
    min-width:32px!important;
    margin:0!important;
  }

  .file-hint{
    position:absolute!important;
    top:40px!important;
    left:0!important;
    right:0!important;
    font-size:12px!important;
  }

  .file-list{
    top:42px!important;
  }

  .send-button{
    width:180px!important;
    height:52px!important;
    margin-top:0!important;
    background:transparent!important;
  }
}


/* RNA Mobile Final Fix 3 */
@media (max-width:768px){

  /* Ana sayfa kartlar: iki kolon, her yerde eşit boşluk */
  .card-window{
    padding:104px 12px 34px!important;
  }

  .card-track{
    display:grid!important;
    grid-template-columns:repeat(2, minmax(0, 1fr))!important;
    gap:10px!important;
    column-count:unset!important;
    column-gap:0!important;
  }

  .card{
    position:relative!important;
    left:auto!important;
    top:auto!important;
    width:100%!important;
    height:auto!important;
    margin:0!important;
    aspect-ratio:var(--w) / var(--h)!important;
    transform:none!important;
  }

  .card:nth-of-type(n+12),
  .card:nth-of-type(n+12):nth-of-type(-n+22),
  

  .card img.cover{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }

  /* İletişim formu: ekrana sığacak şekilde kompakt */
  .contact-content{
    padding:58px 22px 22px!important;
    min-height:100dvh!important;
  }

  .contact-head h2{
    font-size:34px!important;
  }

  .contact-head p{
    font-size:11px!important;
    line-height:1.45!important;
    margin:8px 0 18px!important;
  }

  .contact-form .field,
  .contact-form .field.wide{
    margin:0 0 15px!important;
  }

  .field > span,
  .file-label > span{
    font-size:13px!important;
  }

  .field input,
  .field textarea{
    font-size:15px!important;
    min-height:28px!important;
  }

  .field textarea{
    min-height:76px!important;
  }

  .file-label{
    min-height:46px!important;
  }

  .file-label::after{
    top:32px!important;
  }

  .file-label > span{
    height:32px!important;
  }

  .file-icon{
    width:24px!important;
    height:24px!important;
    min-width:24px!important;
  }

  .file-hint{
    top:34px!important;
    font-size:10px!important;
  }

  .file-list{
    top:36px!important;
  }

  .send-button{
    width:150px!important;
    height:42px!important;
    margin-top:0!important;
  }
}


/* RNA Mobile Final Hard Fix */
@media (max-width:768px){

  /* Kartlar: iki kolon, her tarafta eşit boşluk */
  .card-window{
    padding:104px 12px 34px!important;
  }

  .card-track{
    display:grid!important;
    grid-template-columns:repeat(2, minmax(0, 1fr))!important;
    gap:12px!important;
    column-count:unset!important;
    column-gap:12px!important;
    width:100%!important;
  }

  .card{
    position:relative!important;
    left:auto!important;
    top:auto!important;
    width:100%!important;
    height:auto!important;
    margin:0!important;
    aspect-ratio:264 / 190!important;
    transform:none!important;
  }

  .card:nth-of-type(n+12),
  .card:nth-of-type(n+12):nth-of-type(-n+22),
  

  .card img.cover{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }

  /* İletişim doküman alanı */
  .file-label{
    min-height:44px!important;
  }

  .file-label > span{
    height:34px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    font-size:13px!important;
  }

  .file-icon{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    margin:0!important;
    object-fit:contain!important;
  }

  .file-label::after{
    top:36px!important;
  }

  /* Gönder butonu webdeki görsel buton olarak kalsın */
  .send-button{
    width:130px!important;
    height:28px!important;
    background:transparent!important;
    border:0!important;
    padding:0!important;
  }

  .send-button img{
    display:block!important;
    width:100%!important;
    height:100%!important;
  }

  /* Popup açıkken içeride/dışarıda scroll olmasın */
  .film-modal.open,
  .contact-modal.open{
    overflow:hidden!important;
    touch-action:none!important;
  }

  .film-box,
  .contact-box{
    overflow:hidden!important;
    touch-action:none!important;
  }

  body:has(#filmModal.open),
  body:has(#contactModal.open){
    overflow:hidden!important;
    touch-action:none!important;
  }
}


/* RNA mobile card/send final override */
@media (max-width:768px){

  .card-window{
    padding:104px 12px 34px!important;
  }

  .card img.cover{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }

  .send-button,
  .contact-form .send-button,
  .contact-form button[type="submit"].send-button{
    width:130px!important;
    height:28px!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    font-family:'PoppinsLocal','Poppins',Arial,sans-serif!important;
    overflow:visible!important;
  }

  .send-button img{
    display:block!important;
    width:100%!important;
    height:100%!important;
  }

  .send-button .send-normal{opacity:1!important;}
  .send-button .send-hover{opacity:0!important;}
  .send-button:hover .send-normal{opacity:0!important;}
  .send-button:hover .send-hover{opacity:1!important;}
}

