.byn{
  position:relative;background:var(--z1);overflow:clip;
  padding-block:var(--blm-pd);
}
                                                                      
                                                           
                                                                         
                                                                       
                                                                        
                                                                     
                                      
                                                                
                                                                        
                                                                     
                                                                     
                       
@media(max-width:700px){
  .byn{padding-block-start:calc(var(--blm-pd) * 2)}
}
                                                                       
                                                                            
                                                                       
                                                                       
                                                                             
                                                                        
                                                                    
                                                                  
@media(min-width:701px) and (max-width:48rem){
  .byn{padding-block-start:calc(var(--blm-pd) * 2 - .85rem)}
}

                                                                        
                                                                      
                                                                        
                                                                          
                                                     

                                                                  
                                                                        

                                                                        
                                                                      
                                                                       
                                              
                                                                            
                 
.byn-doku{
  position:absolute;inset:0;z-index:0;pointer-events:none;
  --byn-tas:6rem;
  background:var(--toprak);
  -webkit-mask:url("/kalici/t-23/tema/assets/img/amblem-kanal.webp") repeat;
          mask:url("/kalici/t-23/tema/assets/img/amblem-kanal.webp") repeat;
  -webkit-mask-size:var(--byn-tas) var(--byn-tas);
          mask-size:var(--byn-tas) var(--byn-tas);
  opacity:0.025;
}
                                                                 
html[data-tema="koyu"] .byn-doku{
  background:color-mix(in srgb,var(--z1),var(--keten) 10%);
  opacity:0.030;
}
.byn-iz{
  position:relative;z-index:1;
  display:grid;align-items:center;
  gap:var(--bo-4);
  grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);
}

                    
.byn-sol{display:grid;gap:var(--bo-2)}
.byn-bsl{
  font-family:"Manrope",ui-sans-serif,system-ui,-apple-system,sans-serif;
  font-weight:800;font-size:var(--blm-bsl);
  line-height:1.08;letter-spacing:-.03em;color:var(--mrk);margin:0;
                                                                    
                                                                        
                                                                      
                                                                          
                                                                     
                                                                       
                                                                             
                                              
  text-align:var(--blm-hiza);
}
html[lang="ar"] .byn-bsl{font-family:"Noto Kufi Arabic",sans-serif;letter-spacing:0;line-height:1.4}
.byn-bsl em{font-style:normal;color:inherit}                           
.byn-kir{display:none}
@media(min-width:720px){.byn-kir{display:inline}}

.byn-metin{display:grid;gap:clamp(.85rem,1.6vw,1.15rem);max-inline-size:40rem}
/* 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.
   22.09.2026 17:22 Patron: «ilk paragraf kalın olacaktı» → giriş paragrafı standardın dışında, eski hâlinde kalır */
.byn-lead{
  margin:0;color:var(--mrk);font-size:var(--yz-gir);
  font-weight:500;line-height:1.5;letter-spacing:-.012em;text-wrap:pretty;
}
                                                                     
                                                                         
                                                                       
                                                                  
                                                         
.byn-lead,
.byn-gvd{text-align:var(--blm-hiza)}
.byn-gvd{
  margin:0;color:color-mix(in oklab,var(--mrk2),var(--mrk) 30%);
  font-size:var(--yz-gir);line-height:1.66;
                                                                               
                                                                         
                        
  text-wrap:pretty;
}

                                                     
.byn-sag{display:grid;justify-items:stretch;gap:.7rem}
                                                                        
                                                         
.byn-eylem2{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
/* 22.09.2026: «Tanıtım Filmini İzle» — metnin altında, ortak logolarının üstünde (hero'daki pencereyi açar) */
.byn-film{
  font:inherit;font-size:var(--yz-dgm);font-weight:600;cursor:pointer;
  display:inline-flex;align-items:center;gap:.7rem;
  inline-size:fit-content;justify-self:start;align-self:start;
  margin-block:clamp(1.25rem,2.4vw,1.75rem) 0;padding:.65rem 1.35rem .65rem .65rem;
  border:0;border-radius:999px;background:var(--mrk);color:var(--z1);
  transition:background-color var(--mikro) var(--egri),box-shadow var(--mikro) var(--egri);
}
.byn-film-daire{
  display:grid;place-items:center;inline-size:2.1rem;block-size:2.1rem;flex:none;
  border-radius:50%;background:color-mix(in srgb,var(--z1) 18%,transparent);color:var(--z1);
}
.byn-film-daire svg{inline-size:1.05rem;block-size:1.05rem;display:block}
html[dir="rtl"] .byn-film-daire svg{transform:scaleX(-1)}
.byn-film:hover{background:color-mix(in srgb,var(--mrk) 88%,var(--aksan));box-shadow:0 1px 2px rgba(0,0,0,.18),0 10px 24px -12px rgba(0,0,0,.45)}
.byn-film:focus-visible{outline:2px solid var(--aksan);outline-offset:3px}

/* 22.09.2026: harita düğmelerinin ALTINDA 360° tur kısayolları — üç sütun, dar alanda alt alta */
.byn-eylem3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin-block-start:.5rem}
.byn-tur{text-decoration:none}
.byn-tur>span{min-inline-size:0;overflow-wrap:anywhere}
@media(max-width:60rem){.byn-eylem3{grid-template-columns:minmax(0,1fr)}}
.byn-ac,.byn-tur{
  font:inherit;font-size:var(--yz-kck);font-weight:600;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.7rem 1rem;border-radius:var(--yr-s);
  border:1px solid var(--cizgi);background:none;color:var(--mrk);
  transition:background-color var(--mikro) var(--egri);
}
.byn-ac:hover,.byn-tur:hover{background:var(--z2)}
.byn-ac svg,.byn-tur svg{inline-size:.9rem;block-size:.9rem;flex:none;color:var(--toprak-mtn)}
                                                                      
                                                                           
                                                                         
                                                                
                                                                    
@media(max-width:560px){
  .byn-eylem2{gap:.4rem}
  .byn-ac,.byn-tur{padding-inline:.55rem;gap:.4rem;min-block-size:2.75rem}
}

                                      
.byn-sek{display:flex;gap:var(--bo-2);border-block-end:1px solid var(--cizgi2)}
.byn-sek-d{
  font:inherit;font-size:var(--yz-kck);font-weight:600;cursor:pointer;border:0;background:none;
  color:var(--mrk2);padding:0 0 .55rem;position:relative;
  transition:color var(--mikro) var(--egri);
}
                                                              
                                                                      
                                                                      
                                                                          
                                                                   
                                                                            
.byn-sek-d[aria-selected="true"]{color:var(--mrk)}
.byn-sek-d:hover{color:var(--mrk)}

                                                                               
                                                                       
                                                                        
                 
.byn-kutu{display:grid;min-block-size:0}
                                                                      
                                                                           
                                                                                 
.byn-pnl{grid-area:1 / 1;position:relative;min-block-size:0;
  display:grid;justify-items:center;align-items:center}
.byn-pnl[data-gizli]{visibility:hidden;opacity:0;pointer-events:none}
.byn-gmap{
                                                                                
  inline-size:100%;
  aspect-ratio:4/3;border:0;display:block;margin-inline:auto;
  border-radius:var(--yr-s);background:var(--z2);
}
.byn-git{
  position:absolute;inset-block-end:.6rem;inset-inline-start:.6rem;
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.4rem .7rem;border-radius:var(--yr-l);
  font-size:var(--yz-kck);font-weight:600;color:var(--mrk);
  background:color-mix(in srgb,var(--z1) 88%,transparent);
  transition:background-color var(--mikro) var(--egri);
}
.byn-git:hover{background:var(--z1)}
.byn-git svg{inline-size:.85rem;block-size:.85rem;flex:none}


html[dir="rtl"] :is(.byn-ac,.byn-tur) svg{transform:scaleX(-1)}
.byn-plaka{
  position:relative;display:block;inline-size:100%;padding:0;border:0;
  background:none;cursor:pointer;text-align:start;
  border-radius:var(--yr-s);overflow:hidden;
  transition:transform var(--gecis) var(--egri);
}
.byn-plaka:hover{transform:scale(1.008)}
.byn-harita{
  position:relative;display:block;aspect-ratio:4/3;
  background:url("/kalici/t-23/tema/assets/img/konum-paftasi-m-v3.webp") no-repeat center/100% 100%;
}

                                                                       
                                                                        
                                                                      
                           
                                                                
                                                                    
                                                                        
                                            

                                            
                                                                    

                                                                        
                                                                       
                                                                         
                                                                        
                                                                        
                                                                       
                                               

                                                                 
                                                                     
                                                               
                                                                         

                                                     
.byn-im{
  position:absolute;z-index:1;
                                                                          
                                                                     
                                                                         
                                                                          
  inset-inline-start:calc(var(--byn-x) * 1%);
  inset-block-start:calc(var(--byn-y2) * 1%);
  inline-size:0;block-size:0;
}
.byn-nok{
  position:absolute;display:block;
  inline-size:.55rem;block-size:.55rem;border-radius:50%;
  inset-inline-start:0;inset-block-start:0;translate:-50% -50%;
  background:var(--toprak-mtn);
}
.byn-ad{
  position:absolute;inset-block-start:0;inset-inline-start:0;
  font-size:var(--yz-etk);font-weight:600;letter-spacing:-.005em;white-space:nowrap;
  color:var(--mrk);background:color-mix(in srgb,var(--z1) 88%,transparent);
  padding:.16rem .45rem;border-radius:var(--yr-s);
}
.byn-im[data-nok="yok"] .byn-nok{display:none}
.byn-im[data-yer="alt-orta"] .byn-ad{translate:-50% var(--byn-alt,1.1rem)}
.byn-im[data-yer="alt-sag"]  .byn-ad{translate:1rem .55rem}
.byn-im[data-yer="alt-sol"]  .byn-ad{translate:calc(-100% - 1rem) .55rem}
.byn-im[data-yer="ust-sag"]  .byn-ad{translate:1rem -1.85rem}
.byn-im[data-yer="ust-sol"]  .byn-ad{translate:calc(-100% - 1rem) -1.85rem}
                                                                        
                                                                    
                                                                         
                                                                     
                                                                   
                                                                          
                                             
                                                                        
                                                                     
                                                                        
                                                                      
                                                                   
                             
html[dir="rtl"] .byn-harita,
html[dir="rtl"] .byn-buyuk{direction:ltr}
                                                                
                                                                   
                                                                   
                                                                
                                                                 
                                                             
                                      
                                                                    
                                                                    
                                                               
                                               
html[dir="rtl"] .byn-harita .byn-ad,
html[dir="rtl"] .byn-buyuk .byn-ad{direction:ltr;unicode-bidi:plaintext}

                            


@keyframes byn-kat-ac{from{opacity:0}to{opacity:1}}

@keyframes byn-cer-ac{from{opacity:0;transform:translateY(1rem) scale(.99)}to{opacity:1;transform:none}}
                                                                    
                                                                          
                                                                            
.byn-buyuk{
  position:relative;aspect-ratio:4/3;border-radius:var(--yr-s);overflow:hidden;
                                                                            
                                                                       
                                                                        
                                                                        
                                                                    
                                                                      
                                                            
                                                                     
                                                                      
                                                                           
                                                                        
  inline-size:100%;
  margin-inline:auto;
                                                                            
                                                                        
                                                                   
  align-self:start;
  background:url("/kalici/t-23/tema/assets/img/konum-paftasi-v3.webp") no-repeat center/100% 100%;
}




                    
.byn-kunye{display:grid;gap:.7rem;align-content:start;
  padding-block-start:clamp(.25rem,1vw,.6rem)}

                                                                       
                                                                      
                                                     
                                                                         
.byn-sek-ik{inline-size:1.05rem;block-size:1.05rem;flex:none;opacity:.65;
  transition:opacity var(--mikro) var(--egri)}
.byn-sek-d[aria-selected="true"] .byn-sek-ik{opacity:1}
                                                       
                                                                       
                                                                          
                                                                       
                                                                      
                                                                      
                                                                    
                                                 
.byn-sek-d{display:flex;align-items:end;gap:.55rem;min-block-size:2.75rem}

@media(min-width:1000px){
                                                                      
                                                                         
                                                      
  .byn-icerik{block-size:calc(100svh - clamp(4.5rem,10vw,7rem));
    grid-template-columns:auto minmax(17rem,23rem)}
                                                                            
                                                                               
  .byn-pnl{container-type:size}
  .byn-buyuk,.byn-gmap{inline-size:min(100cqw, calc(100cqh * 4 / 3))}
                                                                         
                                                                         
                                                                       
                                                              
                                                                     
                                                                         
                                                                     
                                                                    
                                                       
                                                                
                                                                        
                                                                       
                                                                        
                                                                          
                                                                         
                                                                 
                                                                      
                                                                        
                                            
  .byn-sek{grid-column:2;grid-row:1;display:flex;flex-wrap:wrap;
    gap:var(--bo-2);align-items:end;align-content:start;
    padding-block-end:.9rem;margin-block-end:.2rem;
    border-block-end:1px solid var(--cizgi2)}
  .byn-kutu{grid-column:1;grid-row:1 / span 2}
  .byn-kunye{grid-column:2;grid-row:2}
                                                                      
                                                                         
                                                                            
                                                                     
                                                                          
                                          
                                                                            
                                                                    
                                                                        
                                                  
  .byn-sek-d{
    padding:.15rem .2rem .5rem;text-align:start;
    transition:color var(--mikro) var(--egri);
  }
                                                                  
                                                                        
                                                                    
                                                                   
                                                          
  .byn-yan{grid-column:2;grid-row:2;position:relative;min-block-size:0;display:grid}
  .byn-kunye{padding-block-start:0;padding-inline-start:clamp(.5rem,1.5vw,1.2rem);
    border-inline-start:1px solid var(--cizgi2);align-content:start;
    min-block-size:0;overflow-y:auto;overflow-x:clip;overscroll-behavior:contain;
                                                           
    scrollbar-width:none}
  .byn-kunye::-webkit-scrollbar{display:none}
                                                         
  .byn-yan[data-byn-kaydir] .byn-kunye{padding-inline-end:1.1rem}
                                                                               
  .byn-yan[data-byn-kaydir] .byn-kunye{
    mask-image:linear-gradient(to bottom,#000 calc(100% - 2rem),transparent)}
  .byn-yan[data-byn-kaydir][data-byn-son] .byn-kunye{mask-image:none}
}
.byn-kat-bsl{
  margin:0;font-family:"Manrope",ui-sans-serif,sans-serif;font-weight:700;
  font-size:var(--yz-alt);letter-spacing:-.02em;color:var(--mrk);
}
html[lang="ar"] .byn-kat-bsl{font-family:"Noto Kufi Arabic",sans-serif;letter-spacing:0}
                                                                          
                          
.byn-kat-gvd{margin:0;color:var(--mrk2);font-size:var(--yz-gvd);line-height:1.6;max-inline-size:104ch}

                                                                      
                                                                               
                                                                        
                                                                        
                                                                        
                                                               
                                                                     
                                                                      
                                                                       
                                                                       
                                                                     
.byn-kat-bsl,.byn-kat-gvd{padding-inline:.6rem}
.byn-mes{margin:0;padding:0;list-style:none;display:grid;gap:0;
  padding-block-start:clamp(.6rem,1.4vw,1rem)}
                                                   
                                                                        
                                                                       
                                                                         
                                                                     
                                                                    
                        
.byn-mes-bsl{font-size:var(--yz-kck);font-weight:700;letter-spacing:.02em;
  text-transform:uppercase;color:var(--mrk2);padding-block-end:.45rem;
  padding-inline:.6rem}
.byn-mes-oge{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
  padding-block:.42rem;padding-inline:.6rem;border-block-start:1px solid var(--cizgi2);
  font-size:var(--yz-gvd);color:var(--mrk2)}
.byn-mes-dk{flex:none;color:var(--mrk);font-variant-numeric:tabular-nums}
.byn-mes-bsl2{padding-block-start:1.1rem}

                                    
.byn-cubuk{
  position:absolute;inset-block:0;inset-inline-end:0;inline-size:5px;
  border-radius:var(--yr-tam);background:color-mix(in oklab,var(--mrk) 9%,transparent);
  opacity:0;transition:opacity var(--gecis) var(--egri);pointer-events:none;
}
.byn-yan[data-byn-kaydir] .byn-cubuk{opacity:1;pointer-events:auto}
.byn-cubuk i{
  position:absolute;inset-inline:0;inset-block-start:0;block-size:2rem;
  border-radius:var(--yr-tam);background:color-mix(in oklab,var(--mrk) 38%,transparent);
  cursor:grab;transition:background var(--mikro) var(--egri);
}
.byn-cubuk i:hover,.byn-cubuk i:active{background:color-mix(in oklab,var(--mrk) 60%,transparent)}
.byn-cubuk i:active{cursor:grabbing}
.byn-mes-oge{cursor:pointer;transition:background-color var(--mikro) var(--egri),
  color var(--mikro) var(--egri)}
.byn-mes-oge:focus-visible{outline:2px solid var(--mrk);outline-offset:2px}
                                                                          
.byn-yan[data-byn-uydu] .byn-mes-oge{pointer-events:none;cursor:default}

                              
                                                                       
                                                                 
.byn-mes-oge.byn-vurgu{background:color-mix(in srgb,var(--mrk) 7%,transparent);color:var(--mrk)}
.byn-im.byn-vurgu{z-index:3}
.byn-im.byn-vurgu .byn-nok{scale:1.85;background:var(--mrk)}
.byn-im.byn-vurgu .byn-ad{background:var(--mrk);color:var(--z1)}
.byn-nok,.byn-ad{transition:scale var(--mikro) var(--egri),
  background-color var(--mikro) var(--egri),color var(--mikro) var(--egri)}
@media(prefers-reduced-motion:reduce){
  .byn-nok,.byn-ad{transition:none}
  .byn-im.byn-vurgu .byn-nok{scale:1}                                          
}
.byn-mes-dk b{font-weight:700}
html[lang="ar"] 
@media(prefers-reduced-motion:reduce){
  .byn-katman,
  .byn-plaka:hover{transform:none}
}

@media(max-width:900px){
  .byn-iz{grid-template-columns:minmax(0,1fr);gap:var(--bo-3)}
  .byn-ad{font-size:var(--yz-etk);padding:.12rem .35rem}
}
                                                                        
                                                                          
                                                                    
                                                   
                                         
                                                         
                                                              
                                                                         
                                                                         
                                                                          
                                                                        
                                                                      
                              

                                                                        
                                                                         
                                         
.byn-harita,.byn-buyuk{container-type:inline-size}

@container (max-width:800px){
                                                                      
                                                                      
                                                                          
                                                                         
                                                                            
                                                                    
                                                 
  .byn-im[data-byn-yer="jamarat"] .byn-ad,
  .byn-im[data-byn-yer="muzdelife"] .byn-ad{visibility:hidden;opacity:0}
                                                                      
                                                                        
                                                      
  .byn-im.byn-vurgu .byn-ad{visibility:visible;opacity:1}
}

                                                                        
                                                            
                                                                 
                                                                      
                                                                       
                            
                                                                       
                                                                    
                                                               
                                                                     
                                                                        
                                                                  
@container (max-width:420px){
                                                                          
                                                                   
                                                                    
                                                               
  .byn-buyuk .byn-ad{visibility:hidden;opacity:0}
  .byn-buyuk .byn-im[data-byn-yer="hayat"] .byn-ad,
  .byn-buyuk .byn-im[data-byn-yer="haram"] .byn-ad,
  .byn-buyuk .byn-im[data-byn-yer="kapi"]  .byn-ad{visibility:visible;opacity:1}
  .byn-buyuk .byn-im.byn-vurgu .byn-ad{visibility:visible;opacity:1}
}


                                                                      
                                                          
                                                                      
                                                  
                                                                      
                                                         
                                                                   
                                                                      
                                                            
                                                                   
                                                                
                                                                       
.byn-ortak{
  display:flex;flex-wrap:wrap;align-items:center;
  gap:var(--bo-3);
  margin-block-start:clamp(1.8rem,3.4vw,2.6rem);
}
.byn-ortak-logo{
  display:block;background:currentColor;color:var(--mrk2);opacity:.8;
  inline-size:var(--byn-ortak-gen);block-size:auto;aspect-ratio:var(--byn-ortak-oran);
  -webkit-mask:var(--byn-ortak-kaynak) no-repeat center/contain;
          mask:var(--byn-ortak-kaynak) no-repeat center/contain;
  transition:opacity var(--mikro,.18s) var(--egri),color var(--mikro,.18s) var(--egri);
}
.byn-ortak-ek{--byn-ortak-kaynak:url(/kalici/t-23/tema/assets/logo/emlak-konut-2026-tr.png);--byn-ortak-oran:1.895;--byn-ortak-gen:10.2rem}
/* 22.09.2026 17:48 Patron: Emlak Konut logosu dile göre (eski ortak-emlak-konut.png yedek) */
html[lang="en"] .byn-ortak-ek{--byn-ortak-kaynak:url(/kalici/t-23/tema/assets/logo/emlak-konut-2026-en.png);--byn-ortak-oran:1.807}
html[lang="ar"] .byn-ortak-ek{--byn-ortak-kaynak:url(/kalici/t-23/tema/assets/logo/emlak-konut-2026-ar.png);--byn-ortak-oran:1.807}
.byn-ortak-mg{--byn-ortak-kaynak:url(/kalici/t-23/tema/assets/logo/ortak-makkah-gate.png);--byn-ortak-oran:1.84;--byn-ortak-gen:10.6rem}
.byn-ortak-sk{--byn-ortak-kaynak:url(/kalici/t-23/tema/assets/logo/ortak-sakani.png);--byn-ortak-oran:2.445;--byn-ortak-gen:9.2rem}
                                                                
                                                                         
                                                                   
                                                                          
                                                                            
                                                                      
                                                                          
                                                                   
                                                                        
                                               
@media(max-width:720px){
  .byn-ortak{
    --byn-ortak-oluk:clamp(.55rem, 2.8vw, 1.4rem);
    flex-wrap:nowrap;                                                    
                                                                       
                                                                          
                                                                            
                                                                        
                                                                      
                                                                          
                                                      
    container-type:inline-size;
    min-inline-size:0;
    gap:var(--byn-ortak-oluk);
  }
                                                                      
                                                                       
                                        
  .byn-ortak-logo{
    --byn-ortak-gen:min(7.6rem, (100cqi - 2 * var(--byn-ortak-oluk)) / 3);
  }
}

                                                                  
                                               
.byn-ortak-oge{position:relative;display:inline-flex;align-items:center}
.byn-ortak-ipucu{
  position:absolute;inset-block-end:calc(100% + .7rem);inset-inline:0;
  display:flex;justify-content:center;pointer-events:none;z-index:4;
}
.byn-ortak-ad{
  flex:none;inline-size:max-content;max-inline-size:min(20rem,60vw);text-align:center;
  font-size:var(--yz-kck);line-height:1.4;padding:.5rem .85rem;border-radius:var(--yr-m);
  color:var(--mrk);background:color-mix(in oklab,var(--z1) 93%,transparent);
  border:1px solid var(--cizgi);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  opacity:0;transform:translateY(5px);
  transition:opacity 220ms var(--egri),transform 220ms var(--egri);
}
.byn-ortak-oge:hover .byn-ortak-ad,
.byn-ortak-oge:focus-within .byn-ortak-ad{opacity:1;transform:translateY(0)}
.byn-ortak-oge:hover .byn-ortak-logo{opacity:1;color:var(--mrk)}
.byn-ortak-oge:first-child .byn-ortak-ipucu{justify-content:start}
@media (prefers-reduced-motion:reduce){
  .byn-ortak-ad{transition:none;transform:none}
  .byn-ortak-logo{transition:none}
}


                                                                         
                                                                      
                                                                    
                                                                           
.byn-icerik[hidden]{display:none}
.byn-icerik{
                                                                        
                                                                          
                              
  position:relative; inline-size:100%;
  display:grid; gap:var(--bo-2);
                                                                               
                                                                      
                                                                                 
  max-block-size:calc(100svh - clamp(4.5rem,10vw,7rem));
  grid-template-rows:auto minmax(0,1fr);
  min-block-size:0;
  background:var(--z1); color:var(--mrk); border-radius:var(--yr-s);
  padding:clamp(1rem,2.4vw,1.9rem);
  animation:byn-cer-ac 420ms var(--egri) both;
}
@media (prefers-reduced-motion:reduce){ .byn-icerik{animation:none} }

                                                                         
                                                                              

                                                                         
                                                                          
                                                                     
                                                                         
                                                                     
                                                                        
                                                        
                                                                            
                                                            
                                                                     
                                                         

                                                                      
                                                                             
                                                                         
                                                            
                                                                            
@media(max-width:999px){
  .byn-icerik{max-block-size:none;grid-template-rows:auto auto auto}
}

                                                                        
                                                  
                                                                           
                                                                       
                                                                    
                                                                            
                             

                                                                   
                                                                           
                                                                          
                                                                      
                                                                    
                                                                             
                                                                         
                                                                       

                                                                     
                                                                        
                                                                    
                                                                           
                               
.byn-ad{white-space:normal;text-wrap:balance;line-height:1.25}
.byn-im[data-yer="ust-sol"] .byn-ad,
.byn-im[data-yer="alt-sol"] .byn-ad{
  max-inline-size:max(2.5rem, calc(var(--byn-x) * 1cqi - 1.35rem));
}
.byn-im[data-yer="ust-sag"] .byn-ad,
.byn-im[data-yer="alt-sag"] .byn-ad{
  max-inline-size:max(2.5rem, calc((100 - var(--byn-x)) * 1cqi - 1.35rem));
}
.byn-im[data-yer="alt-orta"] .byn-ad{
  max-inline-size:max(2.5rem, calc(min(var(--byn-x), 100 - var(--byn-x)) * 2cqi - .6rem));
}

                                                                        
                                                                       
                                                                        
                                                                 
                                                                 
                                                                         
                                                        
                                                                     
                                                                     
                                                                             

                                                                          
                                                                          
                                                                          
                                                                        
                                                                     
                                                            
@container (max-width:420px){
  .byn-im[data-byn-yer="kapi"] .byn-ad{
                                                                          
                                                                      
                                                     
                                                                    
                                                                   
                                                               
                                                         
                                                                      
                                                                 
                                                                    
                                                                
                                             
                                                                    
                                                                 
                                                                     
                                                                  
                                                                           
    translate:calc(-100% - 1rem) calc(-100% - .4rem);
    max-inline-size:max(2.5rem, calc(var(--byn-x) * 1cqi - 1.35rem));
  }
}

/* 22.09.2026 Patron: krokideki altın Hayat Mekke logosu görselden çıkarıldı (ayrı dosya:
   assets/logo/hm-krokideki-logo.webp) → yerine canlı konum pini: başı yuvarlak, içinde logo.
   Başın merkezi eski logonun merkezinde (%32,33 · %71,78); pin haritayla birlikte ölçeklenir. */
.byn-im-pin{z-index:2}
.byn-pin{
  position:absolute;inset-inline-start:0;inset-block-start:0;display:block;
  inline-size:clamp(1.9rem,6.4cqi,3.6rem);aspect-ratio:40/52;
  translate:-50% -98.08%;pointer-events:none;
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.35));
}
.byn-pin svg{display:block;inline-size:100%;block-size:100%;overflow:visible}
.byn-pin-govde{fill:#1F2B25;stroke:#C9A15B;stroke-width:1.4}
.byn-pin-bas{fill:#F3EEE4}
.byn-pin-logo{
  position:absolute;inset-inline-start:50%;inset-block-start:38.46%;
  inline-size:62%;block-size:auto;translate:-50% -50%;
}
/* ucunda konum halkası */
.byn-pin::after{
  content:"";position:absolute;inset-inline-start:50%;inset-block-start:100%;
  inline-size:70%;aspect-ratio:2.6/1;translate:-50% -50%;border-radius:50%;
  border:1.5px solid #C9A15B;opacity:0;z-index:-1;
}
@media (prefers-reduced-motion:no-preference){
  .byn-pin::after{animation:byn-pin-halka 2.4s ease-out infinite}
}
@keyframes byn-pin-halka{
  0%{opacity:.75;transform:scale(.35)}
  100%{opacity:0;transform:scale(1.35)}
}

/* 22.09.2026 17:00 Patron: landing-1'deki kroki düzeni siteye taşındı.
   · Pin artık UCUNDAN sabit: ucu gri proje alanının ağırlık merkezinde (%22,52 · %77,16),
     her ekran boyunda aynı noktaya basar. Baş, ucun 0,775 × pin genişliği üstünde.
   · Mekke Kapısı simgesi görselde 150 px sola, 14 px yukarı taşındı (konum-paftasi-v3 /
     -m-v3; v2 yedek). Yazısının noktası da aynı kaydırmayla %13,17 · %65,96.
   · «Hayat Mekke» yazısı pin başının hemen sağında; «Mekke Kapısı» simgenin üstünde, sağa açılır
     (solda yer yok). Dar krokide Hayat Mekke yazısı pinin gövde hizasına iner ki başla binmesin. */
.byn-im[data-byn-yer="hayat"] .byn-ad{
  max-inline-size:none;white-space:nowrap;
  translate:calc(clamp(1.9rem,6.4cqi,3.6rem) * .5 + .4rem) calc(-50% - clamp(1.9rem,6.4cqi,3.6rem) * .775);
}
.byn-im[data-byn-yer="kapi"] .byn-ad{
  max-inline-size:none;inline-size:max-content;white-space:nowrap;
  translate:-.9rem calc(-100% - .8rem);
}
@container (max-width:34rem){
  .byn-im[data-byn-yer="hayat"] .byn-ad{
    translate:calc(clamp(1.9rem,6.4cqi,3.6rem) * .5 + .4rem) calc(-50% - clamp(1.9rem,6.4cqi,3.6rem) * .3);
  }
}

/* 23.09.2026 Patron: «Tanıtım Filmini İzle» çok zıttı → sitenin zeytin tonlarıyla yumuşak düğme (açık + koyu tema) */
.byn-film{
  background:color-mix(in srgb,var(--aksan) 14%,var(--z2));color:var(--mrk);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--aksan) 26%,transparent);
}
.byn-film-daire{background:var(--aksan);color:var(--z1)}
.byn-film:hover{
  background:color-mix(in srgb,var(--aksan) 24%,var(--z2));
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--aksan) 34%,transparent),0 1px 2px rgba(0,0,0,.12),0 8px 20px -12px rgba(0,0,0,.35);
}