.hro-v2{
                                                                          
                                                                                
  --hro-cerceve:var(--cerceve);
  position:relative;background:var(--z1);
                                                                 
                                                             
  padding-block:calc(var(--nav-h) + var(--hro-cerceve) * 2) var(--hro-cerceve);
  padding-inline:var(--hro-cerceve);
}
.hro-v2-kutu{
  position:relative;isolation:isolate;overflow:clip;
  border-radius:var(--yr-xl);
  min-block-size:calc(100svh - var(--nav-h) - var(--hro-cerceve) * 3);
  display:grid;align-content:end;
  padding-block:clamp(2rem,5vh,3.5rem) clamp(3rem,8vh,5rem);
  color:#F3EEE4;
}
.hro-v2-gor{
  position:absolute;inset:0;z-index:-2;
  inline-size:100%;block-size:100%;object-fit:cover;object-position:center 58%;
}
.hro-v2-ort{
  position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,
    rgba(8,11,10,.38) 0%, rgba(8,11,10,.12) 26%,
    rgba(8,11,10,.26) 56%, rgba(8,11,10,.44) 80%, rgba(8,11,10,.54) 100%);
}
.hro-v2-ic{
                                                                        
                                                                           
                                           
  inline-size:min(calc(100% - 2 * max(0px, var(--serit-kenar) - var(--hro-cerceve))),var(--serit-w));
  margin-inline:auto;
  padding-inline:var(--serit-pd);
  display:grid;gap:clamp(.9rem,2vh,1.4rem);
                                                                      
                                                                     
                                                                       
                                                             
                                                                        
                                                                        
                                                                  
                                                                         
                                                                       
                                                  
                                                                     
                                                                    
                                                   
  text-align:var(--blm-hiza);justify-items:var(--blm-hiza-oge);
}
.hro-v2-bsl{
  margin:0;font-weight:800;letter-spacing:-.035em;line-height:1.02;
  font-size:clamp(2.4rem,6.4vw,5.2rem);max-inline-size:16ch;
}
html[lang="ar"] .hro-v2-bsl{letter-spacing:0;line-height:1.28}
.hro-v2-gvd{
  margin:0;max-inline-size:52ch;color:rgba(243,238,228,.9);
  font-size:var(--yz-alt);line-height:1.5;
}
@media(max-width:720px){
  .hro-v2-kutu{
    min-block-size:calc(92svh - var(--nav-h) - var(--hro-cerceve) * 2);
                                                                    
                                                                      
                                                                       
                          
    padding-block-end:clamp(4.5rem,10.5vh,7rem);
  }
}


                                                                       
.hro-v2-bsl{text-wrap:balance}

                                                                       
@media (prefers-reduced-motion: no-preference){
  .hro-v2-gor{animation:hro-v2-kb 13s ease-in-out infinite alternate;will-change:transform}
}
@keyframes hro-v2-kb{
  from{transform:scale(1.04) translate3d(0,0,0)}
  to  {transform:scale(1.18) translate3d(-2.4%,-1.8%,0)}
}

                                                                       

                                                                   
                                                                     
                                                                  
                                                    
.hro-v2-perde-metin{
  position:absolute;inset-block-end:0;inset-inline:0;block-size:48%;
  z-index:0;pointer-events:none;
  background:linear-gradient(180deg,
    transparent 0%, rgba(8,11,10,.14) 38%, rgba(8,11,10,.52) 72%, rgba(8,11,10,.74) 100%);
}
.hro-v2-ic{position:relative;z-index:2}

                                                                   
                                                                
                                                                   
                                                               
                                                 
                                                                     
.hro-v2-teb{
  position:relative;
  color:#F3EEE4;                                                    
                                                            
  font-weight:600;
  white-space:nowrap;                                                  
                                                                
                                                                   
                                                                         
}
                                                                 
                                                                  
                                                                      
@media (prefers-reduced-motion: no-preference){
  .hro-v2-teb::after{animation:vrg-akis var(--vrg-sure) linear infinite}
}
@media (prefers-reduced-motion: reduce){
  .hro-v2-teb::after{background-position:100% 50%}
}
.hro-v2-teb::after{
  content:"";position:absolute;pointer-events:none;
  inset-inline:-.04em;
  inset-block-end:.04em;
  block-size:.085em;
                                                                  
                                                                  
                                                                   
                                                                  
  background:inherit;
  background-clip:border-box;-webkit-background-clip:border-box;
}
                                                            
                                                
html[lang="ar"] .hro-v2-teb::after{transform:scaleX(-1)}

                                                                    
                                                                 
                                                                    
                                                               
                                                                      
video.hro-v2-vid{animation:none !important;will-change:auto}
                                                                               
video.hro-v2-vid{background:var(--z2,#0b0f0e)}

                                                                     
                                                            
                                                                     
                                                                  
                                                                   
                                                                 
                                                                    
                                  
                                                                      
                                   
                                                              
                                                                
.hro-v2-gor{pointer-events:none}
@media (prefers-reduced-motion:reduce){
                                                                   
  video.hro-v2-vid{animation:none}
}

                                                                          
                                                               
                                                                          
                                                                         
                                                                      
                                                               

                                 
                                               
                                                          
                                                            

                                 
                                                                          
                                                                            
                                                                     
                                                                           
                                                                   

                                                                           
                                                                      
                                                                       
                                                                    
                                                                           
.hro-v2-sahne{
  position:absolute;inset:0;z-index:0;
                                                                  
                                                                   
                                                                     
                                              
  pointer-events:none
}

@media(max-width:720px){
                                                                        
                                                                         
  .hro-v2{padding-block-end:0}
  .hro-v2-kutu{
    min-block-size:0;
    grid-template-rows:auto auto;align-content:start;
    padding-block:0;
    overflow:visible;border-radius:0;
    color:var(--mrk)                                                    
                                                                                
  }
                                                                      
                                                                        
                                                       
  .hro-v2-sahne{
    position:relative;inset:auto;
    aspect-ratio:3/4;
    border-radius:var(--yr-xl);overflow:clip
  }
                                                                    
                                                                            
  .hro-v2-perde-metin{display:none}

  .hro-v2-ic{
                                                                     
                                                               
    inline-size:100%;padding-inline:0;
    padding-block:clamp(1.3rem,5vw,1.9rem) 0;
    gap:clamp(.7rem,2.4vw,1rem);
                                                                       
                                                                   
    text-align:var(--blm-hiza);justify-items:var(--blm-hiza-oge)
  }
  .hro-v2-bsl{
                                                                     
                                            
    font-size:clamp(2.2rem,10.6vw,3.1rem);
    max-inline-size:13ch;line-height:1.04
  }
  .hro-v2-gvd{
                                                                          
                                                                       
                                                           
                                                                        
                                                                     
                                                                      
                                                                      
                                                                      
                                      
    color:var(--mrk2);font-size:1rem;line-height:1.55;max-inline-size:none;
                                                                          
                                                                       
                                                                        
                                                                           
                                                                        
                                                                          
                                                                    
    padding-inline:.5rem;
                                                                     
                                                                    
                                                                  
    text-wrap:pretty
  }

                                                                         
                                                                      
                                                                          
                                                                         
                                                                       
                                                             
                                                                      

                                                                           
                                                                      
                                                          

                                                                       
                                                                             
                                                                        
                                                                       
                                                                         
                                                             
  .hro-v2-ic .hro-v2-vrg{
    --vrg-1:var(--toprak-mtn);
    --vrg-2:var(--vrg-altin);
    --vrg-3:var(--aksan)
  }

                                                                          
                                                                         
                                                                         
                                                                        
                                                                        
                                                
  .hro-v2-teb{
    background-image:none;
    -webkit-text-fill-color:currentColor;
    color:var(--mrk)
  }
  .hro-v2-teb::after{background:var(--toprak-mtn);animation:none}
}

/* 22.09.2026 — «Tanıtım videosunu izle» düğmesi + açılır pencere (bolum-hero).
   Düğme: daire içinde oynat simgesi + yazı; hover yalnız renk değiştirir (yer oynamaz). */
.hro-v2-film{
  display:inline-flex;align-items:center;gap:.8rem;
  margin-block-start:clamp(.1rem,.8vh,.5rem);
  padding:0;border:0;background:none;cursor:pointer;
  font:inherit;font-size:clamp(1rem,.92rem + .3vw,1.15rem);font-weight:600;letter-spacing:.01em;
  color:#f3eee4;
}
.hro-v2-film-daire{
  display:grid;place-items:center;flex:none;
  inline-size:3.25rem;block-size:3.25rem;border-radius:50%;
  background:rgba(243,238,228,.14);
  box-shadow:inset 0 0 0 1.5px rgba(243,238,228,.8),0 8px 24px -8px rgba(0,0,0,.5);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  transition:background-color .28s var(--egri),color .28s var(--egri);
}
.hro-v2-film-daire svg{inline-size:1.2rem;block-size:1.2rem;display:block}
.hro-v2-film:hover .hro-v2-film-daire,
.hro-v2-film:focus-visible .hro-v2-film-daire{background:#f3eee4;color:#141a17}
.hro-v2-film:focus-visible{outline:2px solid #f3eee4;outline-offset:5px;border-radius:2rem}
@media(max-width:720px){
  .hro-v2-film{color:var(--mrk)}
  .hro-v2-film-daire{background:var(--mrk);color:var(--z1);box-shadow:0 8px 24px -10px rgba(0,0,0,.45);
    -webkit-backdrop-filter:none;backdrop-filter:none}
  .hro-v2-film:hover .hro-v2-film-daire,
  .hro-v2-film:focus-visible .hro-v2-film-daire{background:var(--toprak,#8a6a3e);color:#fff}
  .hro-v2-film:focus-visible{outline-color:var(--mrk)}
}
html.hro-film-acik{overflow:hidden}
.hro-film{
  margin:0;padding:0;border:0;background:transparent;color:#f3eee4;
  inline-size:100vw;block-size:100dvh;max-inline-size:none;max-block-size:none;
  --hro-film-pd:clamp(1rem,4vw,3rem);
}
.hro-film[open]{display:grid;place-items:center;padding:var(--hro-film-pd)}
.hro-film::backdrop{background:rgba(8,11,10,.88);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.hro-film-kap{
  position:relative;
  inline-size:min(100%, calc((100dvh - 2 * var(--hro-film-pd) - 3.6rem) * 16 / 9));
  aspect-ratio:16/9;margin-block-start:3.6rem;
}
.hro-film-vid{display:block;inline-size:100%;block-size:100%;background:#000;border-radius:var(--yr-l,14px);
  box-shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px -8px rgba(0,0,0,.5),0 24px 64px -24px rgba(0,0,0,.6)}
.hro-film-kapat{
  position:absolute;inset-block-end:calc(100% + .8rem);inset-inline-end:0;
  display:grid;place-items:center;inline-size:2.75rem;block-size:2.75rem;
  border:0;border-radius:50%;cursor:pointer;color:#f3eee4;
  background:rgba(243,238,228,.12);box-shadow:inset 0 0 0 1px rgba(243,238,228,.35);
  transition:background-color .25s var(--egri);
}
.hro-film-kapat svg{inline-size:1.25rem;block-size:1.25rem}
.hro-film-kapat:hover,.hro-film-kapat:focus-visible{background:rgba(243,238,228,.24)}
.hro-film-kapat:focus-visible{outline:2px solid #f3eee4;outline-offset:3px}
@media (prefers-reduced-motion:no-preference){
  .hro-film[open]{animation:hro-film-gir .32s var(--egri) both}
  .hro-film[open]::backdrop{animation:hro-film-gir .32s var(--egri) both}
}
@keyframes hro-film-gir{from{opacity:0}to{opacity:1}}