.adm{
  padding-block: var(--blm-pd);
  background: var(--z1);
  --adm-yon: 1;

                                                                     
                                                                 
                                                       

                                                                  
                                                                  
                                                  
                                                                         
                                                                     
                                                                   

                                                                      
                                                                   
                                             

                                                                     
                                                      
  --adm-nav-alt: calc(var(--cerceve) + var(--nav-h) + 2px);
  --adm-dok: calc(var(--adm-nav-alt) + var(--bo-3));

                                                                   
                                                                       
                                                               
                                                  
                                     
                                                       
                                                                    
                                                                 
                                              

                                                                
                                                                   
                                                                  
  --adm-kart-bsl: calc(var(--blm-bsl) * .82);

                                                                   
                                                                       
                    
  --adm-ikon-o: clamp(3.25rem, 2rem + 2.8vw, 4.75rem);
}
html[dir="rtl"] .adm{ --adm-yon: -1 }

.adm-iz{
  display: grid;
  gap: var(--bo-4);
  align-items: start;
}

                                                                        
.adm-liste{
  list-style: none;
  margin: 0;
  padding: 0;
                                                                     
                                                                    
                                                                     
                                                                 

                                                                  
                                                          
                                                                   
                                                                     
                                                     
  --adm-bsl-satir: calc(var(--adm-kart-bsl) * var(--sy-bsl));
                                                        
                                                                    
                                                                      
                                                              
                                                       
                                                                  
                                                                       
                                                                 
                                          
                                                                  
                                                                 
                                                                     
                                      
                                                                 
                                                                        
                                                            
  --adm-basamak: var(--kart-pd);

                                                              
                                                               
                                                         
                                                             
                                                                 
                                                               
                                                             
                                                                    
  --adm-ara: 3rem;
}
                                                                  
                                                                 
                                                                  
                                                                     
.adm-oge{
  margin: 0;
  padding-block-end: var(--bo-3);

                                                                  
                                                                   
                                                                   
                                                                
                                                                      
                                                                  

                                                               
                                                              
                                                             
                                             

                                                                 
                                                       
  position: sticky;
  inset-block-start: var(--adm-dok);
  transform-origin: 50% 0%;
  will-change: transform;

                                                            
                                                                        
                                                                     
                                                                        
                                                                    
                                                              
                                  
                                                                          
  --adm-ic-opak: 1;
}
.adm-oge:nth-child(2){ inset-block-start: calc(var(--adm-dok) + var(--adm-basamak)) }
.adm-oge:nth-child(3){ inset-block-start: calc(var(--adm-dok) + var(--adm-basamak) * 2) }

                                                                   
                                                                      
                                                                   
                                  

                                                                      
                                                                    
                                                                       
                                                                      
                                                                       
                                                                        

                                                                       
                                                                        
                                                                        
                       

                                                                
                                                         
                                                     
                                                                      
                                                                       
         

                                                                     
                                                                 
                                                                 
                                                                      
                                                                 
                                     
                                                                     
                                                                       
                         
                                                            
                                                                      
                                                                  
                                             
                                                               
                                                                         

                                                                       
                                                       
                                          
                                                                   
                                                                    
                                       

                                                                      
                                                            
                                                                    
                                                                  
                                                                          
                                                                   
.adm-oge{ padding-block-end: calc(var(--adm-ara) + var(--adm-basamak) * 3) }
.adm-oge:nth-child(2){ padding-block-end: calc(var(--adm-ara) + var(--adm-basamak) * 2) }
.adm-oge:nth-child(3){ padding-block-end: calc(var(--adm-ara) + var(--adm-basamak)) }
                                                                   
                                                                    
                                                                

                                                                   
                                                                      
                                                                  
               

                                                                     
                                                                 
                                                                   
                                                                      
                                                              

                                                                     
                                                                  
.adm-oge-cta{
  inset-block-start: calc(var(--adm-dok) + var(--adm-basamak) * 3);
  padding-block-end: var(--adm-ara);
}

                                                                    
                                                                         
.adm-kuyruk{
  list-style: none;
  margin: 0;
  padding: 0;
  block-size: 10svh;
}

                                                                    
                                                                    

                                                                 
                                                                  
                                                                    

                                                        
                                                                   
                                         
                                                                  
                                                              

.adm-kart{
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--bo-2);
                                                                     
                                                                             
                                                                       
                                                           
  padding: var(--kart-pd);
                                                                     
                                                                  
                                                                  

                                                                     
                                                                    
                                               

                                                             
                                                                    
                                                                      
                                                                     
                                                                   
                                                                     
                                                                   
                                                                 
                                                        

                                                                     
                          
  border: 1px solid color-mix(in srgb, var(--cizgi) 50%, transparent);
  border-radius: var(--yr-l);
  background: var(--z3, var(--z2));
                                                               
                                   
  transition: background-color var(--gecis) var(--egri),
              border-color var(--gecis) var(--egri);
                                                                     
                                                                
                                                                      
}
                                                                      
                                               

                                                                      
                                                                 
                                                           
                                 

                                                                          
                                                                     
                                                                    
                                                                 
                                                                
                               
                                                                    
                                                                      
                                

                                                                   
                                     
                                                                    
                                                                    
                                                                   
                                                                 
                                                                     
                                          
                                                                   
                                                                   
                                                                      
                                                                    
                                                              
                                                
                                                             

                                                                   
                                                                   
                                                                       
                                                                    
            
                                                           
                                                                     
                                                                   
                                                                   
                                                                   
                                                                   
                                                  
                                                                    
                                                                   
                                                                  
.adm-kart{ min-block-size: var(--adm-kart-h, 16rem) }
                                                                          
                                                                       
                               
                               
                                                
                                                                   
                                                                    
                                                                    
                                              
                                                                      
                                                                       
                                                                        
                            
.adm-kart{ inline-size: 100% }

@media (min-width: 62rem){
                                                                      
                                                                      
                                                                      
                                                                        
                                                                         
                                              
  .adm-kart{ aspect-ratio: 16 / 8.1 }
}

                                                   
                                                                  
                                                                   
                                                             
                                                                        
.adm-kart-us,
.adm-ikon{ opacity: var(--adm-ic-opak) }

.adm-kart-us{
  display: grid;
  gap: var(--bo-1);
                                       
                                                                     
                                                                   
                                                                      
                                                                     
                                                                   
                                                                     
                                              
                                                                     
                                      
}
.adm-kart-bsl{
  margin: 0;
                                                                 
                                                               
                                                                   
                                                                    
                                                              
  font-size: var(--adm-kart-bsl);
  font-weight: 800;
  line-height: var(--sy-bsl);
  letter-spacing: -.03em;
  color: var(--mrk);
                                                                       
                                                                        
                                                              
  text-wrap: pretty;
}
.adm-kart-not{
  margin: 0;
                                                                    
                                                                     
                                                                    
                                                                        
                                                                         
  font-size: var(--yz-gir);   /* 22.09.2026 Patron: kayan kutu yazısı = bölüm açıklaması boyutu */
  line-height: 1.5;
                                                                       
                                                                       
                                                                         
                                                
  max-inline-size: 45ch;
                                                                     
                                                                     
                                                                    
                                                                       
                                                               

                                                                  
                                                                    
                                                 
                                                

                                                          
                                                                     
                                                                  
                     

                                                                   
                                                                  
                                                                  
                                                                    
                                                                
                                                                     
                                                                     
                                                   
  color: var(--mrk);
}

                                                                   
                                                                      
                                                                  
                                                                      
                                                                     

                                                                 
                                                                 
                                                                      

                                                                  
                                                           
.adm-ikon{
  flex: none;
  align-self: end;                                                            
  inline-size: var(--adm-ikon-o);
  block-size: var(--adm-ikon-o);
                                                                    
                                                                   
                                                             
                                                                       
                                                                
                                                                 
                                                                   
                            
  color: color-mix(in srgb, var(--z3, var(--z2)) 78%, var(--mrk) 22%);
                                                                      
                                                                     

                                                                        
                                                                  
                                                                     
                                                 
                                                                      
                                                               
                                                                       
                                                          

                                                                     
                                                               
                                                                        
                                                                       
                                                                    
                                        
}
                                                                       
                                                                      
                                                                       
                                                                        
                                                                      
                                                 
                                                                    
                               
html[dir="rtl"] .adm-ikon{ transform: translateX(calc(var(--adm-ikon-o) * -.25)) }

                                                                        
.adm-kart-cta{
                                                                     
                                                                       
                                                                     
                                                                     
                                              

                                                               
                                                                        
                                                                       
                                                                      
                                                                       
                                                                      
                                                                         

                                                                    
                                                                    
                            

                                                                      
                                                                     
                                                                     
                                                                       
                                                                     
                                                                     
                                                                      
                                                                  
                                                                   
                                          

                                           
                                                           
                                                              
  background: var(--yzy-sakin);
  border-color: transparent;
  color: var(--yzy-sakin-mrk);
  text-decoration: none;
                                                                    
                                                                  
}
.adm-kart-cta .adm-kart-bsl{ color: var(--yzy-sakin-mrk) }
                                                                    
                                                                       
                                                                      
                                                            
.adm-kart-cta .adm-kart-not{ color: var(--yzy-sakin-mrk2); opacity: 1 }
.adm-kart-cta .adm-kart-us{ display: grid; gap: var(--bo-1) }

.adm-ok{
  flex: none;
  align-self: end;                                                      
  display: grid;
  place-items: center;
                                                                   
                                                                     
                                                                    
                                                
  inline-size: calc(var(--adm-ikon-o) * .75);
  block-size: calc(var(--adm-ikon-o) * .75);
  border-radius: var(--yr-tam);
                                                                      
                                                                      
                                                                   
                                                                
                                                         

                                                                     
                                                                   
                       
                                                      
                                                         
  background: var(--yzy-sakin-mrk);
  color: var(--yzy-sakin);
  transition: transform var(--gecis) var(--egri);
}
.adm-ok-cizim{
  inline-size: calc(var(--adm-ikon-o) * .3);
  block-size: calc(var(--adm-ikon-o) * .3);
  transform: scaleX(var(--adm-yon));                             
  transition: transform var(--gecis) var(--egri);
}
.adm-kart-cta:hover .adm-ok,
.adm-kart-cta:focus-visible .adm-ok{
  transform: translateX(calc(var(--adm-yon) * .375rem));
}

                                                                        
.adm-bas{
  display: grid;
  gap: var(--blm-bsl-ara);
  justify-items: start;
  text-align: start;
}
.adm-bsl{
  margin: 0;
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: -.04em;
}
html[lang="ar"] .adm-bsl{ letter-spacing: 0; line-height: 1.32 }

                                                        
                                                              
                                                                 
                                                                 
                                                                      
                                                                 
                                                                     
                        
.adm-satir{ display: block; overflow: hidden;
            padding-block: .04em .18em; margin-block-end: -.14em }
.adm-satir-ic{ display: block }

                                                                    
                                                                  
                                                                 
             

                                                                  
                                                                     
                                                                    
                                                                     
                                                               
                                                                

                                                                 
                                                                
                                                               
                                                             
                                                  
                                                                   
                                                                  
                                                                
                                                                    
                                                                     
                                 
.adm-gorsel{
  margin: 0;
  margin-block-start: var(--bo-4);
                                                                        
                                                                       
                                                                    
                                                                   
                                           
                                                                    
                                    
  inline-size: min(52ch, 100%);
}
.adm-gorsel-im{
  inline-size: 100%;
  block-size: auto;
  display: block;
}


/* 22.09.2026 Patron: bölüm açıklamalarında tek standart = «Mekke'de nesiller boyu…» bölümünün
   2. paragrafından sonraki yazı (.byn-gvd): boyut --yz-gir · kalınlık 400 · renk mrk2+mrk %30 · satır 1.66 */
.adm-gir{
  margin: 0;
  margin-block-start: var(--bo-2);
  font-size: var(--yz-gir);
  font-weight: 400;
  line-height: 1.66;
  color: color-mix(in oklab,var(--mrk2),var(--mrk) 30%);
                                                                       
                                                                     
                                                         
                                   
                                                                     
                                
                                                                 
                                                                     
                                                    
  max-inline-size: 52ch;
  text-wrap: balance;
}
html[lang="ar"] .adm-gir{ line-height: 1.8 }

                                                                     
                                                                    
                             
.adm-satir:has(> :empty){ display: none }

                                                                        
@media (min-width: 62rem){
                                                                      
                                                               
  .adm{ --adm-kart-bsl: var(--blm-bsl) }
  .adm-iz{
                                                                  
                                                                 
                                                                     
                                                                   
                                
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr);
    column-gap: clamp(2rem, 5vw, 4.5rem);
  }
                                                                   
                                                              
  .adm-liste{ grid-column: 1; grid-row: 1 }
  .adm-bas{
    grid-column: 2;
    grid-row: 1;
                                                                    
    align-self: start;
    position: sticky;
                                                               
                                                       
    inset-block-start: var(--adm-dok);
                                                                      
                                                                    
                                                                   
                                                                        
                

                                                     
                                                                         
                                                                  
                                                                       
                                                                  
                                                                         
                                                                       
                   
                                                                     
                                                                    
                                                                      
                                           
    justify-items: end;
    text-align: end;

                                                                    
                                                                       
                                                            
                                                                    
                                                               
                                                   
                                                                     
                                                                      
                                                                   
                                                                    
                                                                      
                      

                                                                        
                                                                        
                                                        
                                                        
                                                                   
                                                        

                                                                       
                                                                         
                                                                    
                                                
                                                                    
                                                                        
                                                              
                                                                      
                                                                         
                                                                        
                           
    min-block-size: calc(100svh - var(--adm-dok) - var(--blm-pd));
    align-content: center;
  }
}

                                                                      
                                                                     
                                                                      
                                                               
                                                                      
                                                                     
                                                               
                                                                         

                                                                   
                                                                    
                                           
                                                                         
@media (max-width: 61.999rem){

                                                                    
                                                               
                                                                
                                                               
                                           

                                                                 
                                                                  
                                                                     
                                                            
                                                                    
                                                                    
  .adm-bas{ display: contents }

                                                                  
                                                                  
                                                              
                                                                  
  .adm-iz{ row-gap: 0 }
  .adm-liste{ margin-block-start: var(--bo-4) }

                                                                     
  .adm-bsl{
    position: sticky;
                                                                   
                                                             
    align-self: start;
                                                 
                                                                
                                                                  
                                                                 
                                                                 
    inset-block-start: var(--adm-nav-alt);
    padding-block: var(--bo-3) var(--bo-2);
                                                                  
                                                                    
                                                              
                                                                
                                                              
    background: var(--z1);
                                                                 
                                                               
                              
    z-index: 5;
                                                                    
                                                                 
                                                                  
    text-align: var(--blm-hiza);
  }
                                                               
                                                                  
                                                           
  .adm-gir{ text-align: var(--blm-hiza); margin-inline: auto }
  .adm-gorsel{ margin-inline: auto }

                                                                    
                                                                    
                                                                 
                               

                                                                
                                                              
                                                     
                                                                  
                                                                    
                
  .adm{
    --adm-dok: calc(var(--adm-nav-alt) + var(--adm-bsl-h, 9.5rem));
                                                                 
                                                                 
                                                                   
                                                                   
                                                                      
    padding-block-start: max(0px, calc(var(--blm-pd) - var(--bo-3)));

                                                                     
                                                            
                                                                    
                                
                                  
                                  
                                  
                                                  
                                                

                                                                     
                                                                     
                                                                
                                                                    
                                   
                                                                     
                                                               
                                                                       
                                             
  }
  .adm{ padding-block-end: 0 }
                                                                           
                                                                         
                                                                        
                                                                 
                                                                            
  .adm-oge-cta{ padding-block-end: var(--adm-ara) }
  .adm-kuyruk{ block-size: var(--blm-pd) }
}

                                                                   
                                                                   
@media (prefers-reduced-motion: reduce){
  .adm-kart, .adm-ok, .adm-ok-cizim{ transition: none }
}


                                                                         
                                                                           
                                                                     
                                                                   
                                      

                                                                    
                                                                          
                                                                      
                                                                  
                                  
.adm-gorsel{ position: relative; border-radius: var(--yr-l); overflow: clip }
.adm-gorsel-vid{
  position: absolute; inset: 0;
  inline-size: 100%; block-size: 100%;
  object-fit: cover; display: block;
  opacity: 0; visibility: hidden;
  transition: opacity var(--gecis, .5s) var(--egri, ease);
  pointer-events: none;                                                      
}
.adm-gorsel.adm-vid-acik .adm-gorsel-vid{ opacity: 1; visibility: visible }
                                                                     
                                      
.adm-gorsel.adm-vid-acik .adm-gorsel-im{ opacity: 0; transition: opacity var(--gecis, .5s) }
@media (prefers-reduced-motion: reduce){
  .adm-gorsel-vid{ display: none }
  .adm-gorsel .adm-gorsel-im{ opacity: 1 }
}

/* 22.09.2026 — kartlar ekrana sığmıyorsa (adimlar.js → .adm-akis) deste kurulmaz:
   kartlar yapışmadan alt alta akar, kaydırmada yazı solması ve küçülme kapanır. */
.adm.adm-akis .adm-oge{
  position: relative;
  inset-block-start: auto;
  padding-block-end: var(--bo-3);
  transform: none !important;
  --adm-ic-opak: 1 !important;
}
.adm.adm-akis .adm-oge-cta{ padding-block-end: var(--adm-ara) }
/* akışta boy eşitlemesi gereksiz: kısa metinli kart boşluk taşımasın */
.adm.adm-akis .adm-kart{ min-block-size: auto }
@media (max-width: 61.999rem){
  .adm.adm-akis .adm-bsl{ position: relative; inset-block-start: auto }
}

/* 22.09.2026 22:45 — videonun tamamı tıklanır: tanıtım filmi penceresini (#hro-film) açar.
   Üstünde oynat simgesi yok (Patron 22:48); yalnız imleç el olur. */
.adm-film{
  position: absolute; inset: 0; z-index: 2;
  display: grid; place-items: center;
  border: 0; padding: 0; margin: 0; background: transparent; cursor: pointer;
  border-radius: inherit;
}
.adm-film:focus-visible{ outline: 2px solid var(--aksan, #c9a45c); outline-offset: 3px }