*,
*::before,
::after {
	list-style: none;
	text-decoration: none;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0;
	margin: 0 auto;
	max-width: 1440px;
}
/* FONTS */
@font-face {
	font-family: 'Display';
	src: url(../fonts/Sf-Pro/Display/woff/SF-Pro-Display-Regular.woff) format("woff");
	src: url(../fonts/Sf-Pro/Display/woff2/SF-Pro-Display-Regular.woff2) format("woff2");
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Display';
	src: url(../fonts/Sf-Pro/Display/woff/SF-Pro-Display-RegularItalic.woff) format("woff");
	src: url(https://www.savkarkuyumculuk.com.tr/fonts/Sf-Pro/Display/woff2/SF-Pro-Display-RegularItalic.woff2) format("woff2");
	font-weight: normal;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Display';
	src: url(../fonts/Sf-Pro/Display/woff/SF-Pro-Display-Bold.woff) format("woff");
	src: url(../fonts/Sf-Pro/Display/woff2/SF-Pro-Display-Bold.woff2) format("woff2");
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Display';
	src: url(../fonts/Sf-Pro/Display/woff/SF-Pro-Display-BoldItalic.woff) format("woff");
	src: url(../fonts/Sf-Pro/Display/woff2/SF-Pro-Display-BoldItalic.woff2) format("woff2");
	font-weight: bold;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Text';
	src: url(../fonts/Sf-Pro/Text/woff/SF-Pro-Text-Regular.woff) format("woff");
	src: url(../fonts/Sf-Pro/Text/woff2/SF-Pro-Text-Regular.woff2) format("woff2");
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Text';
	src: url(../fonts/Sf-Pro/Text/woff/SF-Pro-Text-RegularItalic.woff) format("woff");
	src: url(../fonts/Sf-Pro/Text/woff2/SF-Pro-Text-RegularItalic.woff2) format("woff2");
	font-weight: normal;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Text';
	src: url(../fonts/Sf-Pro/Text/woff/SF-Pro-Text-Bold.woff) format("woff");
	src: url(../fonts/Sf-Pro/Text/woff2/SF-Pro-Text-Bold.woff2) format("woff2");
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Text';
	src: url(../fonts/Sf-Pro/Text/woff/SF-Pro-Text-BoldItalic.woff) format("woff");
	src: url(../fonts/Sf-Pro/Text/woff2/SF-Pro-Text-BoldItalic.woff2) format("woff2");
	font-weight: bold;
	font-style: italic;
	font-display: swap;
}
html {
	overflow-x: hidden;
}
a {
	color: inherit;
}
h1{
	font-size: var(--h1);
}
h2{
	font-size: var(--h2);
}
h3{
	font-size: var(--h3);
}
h4{
	font-size: var(--h4);
}
h5{
	font-size: var(--h5);
}
h6{
	font-size: var(--h6);
}
p{
	font-size: var(--p);
}
:root {
	--h1: clamp(2rem, 1rem + 5vw, 5rem);
	--h2: calc(var(--h1) * 0.95);
	--h3: calc(var(--h2) * 0.90);
	--h4: calc(var(--h3) * 0.85);
	--h5: calc(var(--h4) * 0.80);
	--h6: calc(var(--h5) * 0.75);
	--p: calc(var(--h6) * 0.70);
	--p-small: calc(var(--p) * 0.65);
	--p-smaller: calc(var(--p-small) * 0.60);
	--p-xs: calc(var(--h1) * 0.15);
	--red-akbank: #DC0005; 
	--light-blue2: #3399ff; 
	--blue: #0500ff;
	--blue-apple: rgb(0, 102, 204);
	--yellow: rgb(255, 231, 1);
	--black: rgb(29, 29, 31); 
	--strong: #1d1d1f;
	--green: rgb(3, 161, 14);
	--blue2: rgb(0, 119, 237);
	--gray: #86868b;
	--apple-orange: rgb(245, 99, 0);
	--apple-gray: rgb(245, 245, 247);

	--blue-gra: linear-gradient(107.56deg,
			#020024 0.48%,
			#090979 50.6%,
			#0068ff 100%);
	--blue-gra-reverse: linear-gradient(-107.56deg,
			#020024 0.48%,
			#090979 50.6%,
			#0068ff 100%);
	--orange-gra: linear-gradient(147deg, #fe8a39 0%, #fd3838 74%);
	/* --orangeDark-gra: linear-gradient(45deg, rgba(231, 72, 234, 1) 0%, rgba(75, 26, 188, 1) 100%); */
	/* --purple-orange-gra: linear-gradient(147deg, #fe8a39 0%, #fd3838 74%); */
	/* --purple-gra: linear-gradient(45deg, rgba(231, 72, 234, 1) 0%, rgba(75, 26, 188, 1) 100%); */
	/* --yellowPurple-gra: linear-gradient(90deg, rgba(255, 225, 113, 1) 0%, rgba(217, 110, 139, 1) 45%, rgba(151, 106, 255, 1) 94%); */
	--red-orange-gra: radial-gradient(circle 860px at 11.8% 33.5%, rgba(240, 30, 92, 1) 0%, rgba(244, 49, 74, 1) 30.5%, rgba(249, 75, 37, 1) 56.1%, rgba(250, 88, 19, 1) 75.6%, rgba(253, 102, 2, 1) 100.2%);
}
/* General Classes */
.hidden{
	display: none;
}
.flex{
	display: flex;
}
.sup {
	/* font-size:70%; */
	line-height: 500%;
	font-size:var(--p-xs);
	vertical-align: text-top;
	color: yellow;
}
.vertical-align_text-top{
	vertical-align: text-top;
}
.line-height16 {
	line-height: 1.6;
}
/* .line-height14 {
	line-height: 1.4;
} */
.text-center {
	text-align: center;
}
.text-left{
	text-align: start;
}
.text-shadow-black {
	text-shadow: 1px 1px 2px black;
}
.text-shadow-black {
	text-shadow: 1px 1px 2px black;
}
.text_stroke_black{
	-webkit-text-stroke: .2rem black;
}
/* .text-shadow-white {
	text-shadow: 1px 1px 2px white;
} */
.bg-white {
	-webkit-backdrop-filter: blur(16px) saturate(180%);
	-moz-backdrop-filter: blur(16px) saturate(180%);
	backdrop-filter: blur(16px) saturate(180%);
	background-color: rgba(17, 25, 40, 0.75);
	border-radius: 20px;
	border: 3px solid rgba(255, 255, 255, 0.125);
}

.red {
	/* color: #E50914; */
	color: #DC0005;
}
.white{
	color: white !important;
}
.orange {
	-moz-background-clip: text;
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	background-image: linear-gradient(-90deg, #ff0000, #ff6600);
}

.blue-glass1 {
	-webkit-backdrop-filter: blur(4px) saturate(50%);
	-moz-backdrop-filter: blur(4px) saturate(50%);
	backdrop-filter: blur(4px) saturate(50%);
	background-color: rgba(7, 0, 62, 0.52);
	border: 1px solid rgba(255, 255, 255, 0.125);
}
.bold{
	font-weight: bold;
}
.italic{
	font-style: italic;
}
.arrow {
	display: inline-flex;
	align-items: stretch;
	font-size: smaller;
}
.stroke1pxBlack{
	-webkit-text-stroke: 1px black;
}
.savkar{
	font-family: 'Display';
	font-style: italic;
	color:	#D5AD6D;
	background: -webkit-linear-gradient(transparent, transparent),
			-webkit-linear-gradient(top, hsl(37, 55.30%, 63.10%) 0%, rgba(213,173,109,1) 26%, rgba(226,186,120,1) 35%, rgba(163,126,67,1) 45%, rgba(145,112,59,1) 61%, rgba(213,173,109,1) 100%);
	background: -o-linear-gradient(transparent, transparent);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	    /* Yazının etrafına 1px siyah çizgi çeker */
    -webkit-text-stroke: 1px #000000;
    
    /* ÖNEMLİ: Çerçevenin harfin içini yiyip inceltmesini engeller */
    /* Önce çerçeveyi çizer, sonra üstüne altını boyar */
    paint-order: stroke fill;
    /* Ekstra Derinlik (Opsiyonel) */
    filter: drop-shadow(0px 2px 0px rgba(0,0,0,0.2)); 
}
.gold_animated {
    font-family: 'Display', serif;
    font-style: italic;
    font-weight: 900; /* Stroke ekleyince yazı biraz incelir, kalınlığı artırdık */
    
    /* Işıltılı Altın Gradyanı */
    background: linear-gradient(
        110deg, 
        #b8860b 10%, 
        #d4af37 30%, 
        #ffffff 45%,  /* Parlak Beyaz Işık */
        #ffffff 55%,  /* Parlak Beyaz Işık */
        #d4af37 70%, 
        #b8860b 90%
    );
    
    background-size: 200% auto;
    
    /* Maskeleme */
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    
    /* --- YENİ EKLENEN KISIM: SİYAH KONTÜR --- */
    /* Yazının etrafına 1px siyah çizgi çeker */
    -webkit-text-stroke: 1px #000000;
    
    /* ÖNEMLİ: Çerçevenin harfin içini yiyip inceltmesini engeller */
    /* Önce çerçeveyi çizer, sonra üstüne altını boyar */
    paint-order: stroke fill;
    
    /* Animasyon */
    animation: shine 4s linear infinite;
    
    /* Ekstra Derinlik (Opsiyonel) */
    filter: drop-shadow(0px 2px 0px rgba(0,0,0,0.2)); 
}

/* Işıltı Animasyonu */
@keyframes shine {
    to {
        background-position: 200% center;
    }
}
/* NAVABAR STYLE */
  #top-navbar {
        width: 100%;
        height: auto;
        max-height: fit-content;
        position: fixed;
        top: 0;
        z-index: 3;
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: aliceblue;
        box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        transition: all 0.5s;
    }
    .navbar{
        background: rgba(0, 0, 0, 0.3);
    }
    .navbar-scrolled{
        background: rgba(0, 0, 0, 0.1);
    }
    #top-navbar-Logo-a {
        display: flex;
        align-content: center; 
        max-width: 40px;
    }
    #top-navbar-Logo {
        width: 100%;
        height: auto;
        max-height: fit-content;
    }
	#savkarClassic_Navbar_Center{
        flex-grow: 2;
        text-align: center;
    }
    #top-navbar a {
        margin: 0 1%;
    }
    #top-navbar-menu {
        display: flex;
        align-items: center;
        padding: 1% 2%;
        font-size: clamp(1rem, 1rem + 1vw, 1.50rem);
        border-radius: 10px;
        border: black 3px solid;
        color:	#000000; /*if no support for background-clip*/
        background: linear-gradient(top, #a95, #f2f2f2 25%, #ffffff 38%, #c5c5c5 63%, #f7f7f7 87%, #a95);
        background: -webkit-linear-gradient(top, #a95, #fea 25%, #ffffff 38%, #dc8  63%, #fea 87%, #a95);
        -webkit-text-stroke: .5px black;
    }
    .gold{
        color:	#D5AD6D; /*if no support for background-clip*/
        background: -webkit-linear-gradient(transparent, transparent),
                -webkit-linear-gradient(top, hsl(37, 55.30%, 63.10%) 0%, rgba(213,173,109,1) 26%, rgba(226,186,120,1) 35%, rgba(163,126,67,1) 45%, rgba(145,112,59,1) 61%, rgba(213,173,109,1) 100%);
        background: -o-linear-gradient(transparent, transparent);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
    }
    .gold1{
        backface-visibility: hidden;
        position: relative;
        cursor: pointer;
        display: inline-block;
        white-space: nowrap;
        background: linear-gradient(180deg,#fea 0%,#dc8 49%,#a95 51%,#dc8 100%);
        border-radius: 5px;
    }
    .silver{
        border-color: #7c7c7c;
		background: linear-gradient(top, rgba(38, 38, 38, 0.8), #e6e6e6 25%, #ffffff 38%, #c5c5c5 63%, #f7f7f7 87%, rgba(38, 38, 38, 0.8));
		background: -webkit-linear-gradient(top, rgba(38, 38, 38, 0.5), #e6e6e6 25%, #ffffff 38%, rgba(0, 0, 0, 0.25)  63%, #e6e6e6 87%, rgba(38, 38, 38, 0.4));
}
	.gold4{
		color: #fff;
		background-image: -webkit-repeating-linear-gradient(left, rgba(255, 238, 170, 0) 0%, rgba(255, 238, 170, 0) 3%, rgba(255, 238, 170, .1) 3.75%),
		-webkit-repeating-linear-gradient(left, rgba(170, 153, 85, 0) 0%, rgba(170, 153, 85, 0) 2%, rgba(170, 153, 85, .03) 2.25%),
		-webkit-repeating-linear-gradient(left, rgba(255, 238, 170, 0) 0%, rgba(255, 238, 170, 0) .6%, rgba(255, 238, 170, .15) 1.2%),
		
		linear-gradient(180deg, #a95 0%, 
		#fea 47%, 
		#dc8 53%,
		#fea 100%);
	}
.black{
    backface-visibility: hidden;
  position: relative;
  cursor: pointer;
  display: inline-block;
  white-space: nowrap;
  border-color: #111;
  color: #555;
  background: linear-gradient(180deg,#555 0%,#222 49%, #000 51%,#222 100%);
  border-radius: 5px;
  box-shadow: inset 0px 1px 0px rgba(255,255,255,.5),0px 1px 3px rgba(0,0,0,0.3);
}
@media (orientation: landscape) {
	#top-navbar {
		max-height: 40px;
	}

	#top-navbar-menu {
		max-height: 35px
	}

	#top-navbar-Logo {
		max-height: 35px;
	}
}
/* END NAVABAR STYLE */
/* FOOTER STYLE */
	footer {
		background: #000000;
		color: #ffffff;
		width: 100%;
		padding-bottom: min(2vh, 2em);
		padding-top: min(2vh, 1em);
		text-align: center;
		bottom: 0;
	}

	.footer-info {
		font-size: var(--p);
	}

	.footer-info p,
	a,
	address {
		font-size: 0.75rem;
	}

	.footer-tel {
		font-size: var(--h3);
		line-height: 1.6;
		min-height: 64px;
	}

	.footer-social p {
		margin-top: 2vh;
	}

	.footer-social ul {
		display: flex;
		column-gap: min(5vw, 10%);
		justify-content: center;
		padding: 2vh 0;
	}
/* END FOOTER STYLE */
/* TOOLBAR STYLE */
    .toolbar{
        position: fixed;
        bottom: 0;
        width: 100%;
        max-height: fit-content;
        max-height: -moz-fit-content;
        /* z-index duplicate kaldırıldı, en yüksek değer korundu */
        z-index: 3; 
        color: aliceblue; /* var(--white) yoksa bu çalışır */
        background: rgba( 0, 0, 0, 0.9 );
        box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
        backdrop-filter: blur( 14px );
        -webkit-backdrop-filter: blur( 14px );
        font-family: 'Text', Times, serif;
    }
    .toolbar-scrolled{
        background: rgba( 0, 0, 0, 0.6 );
    }
    .toolbar ul{
        display: flex;
        justify-content: space-between;
        align-items: stretch;
        margin: 0; /* Tarayıcı varsayılanını sıfırla */
        padding: 0;
    }
    .toolbar img{
        max-width:25px;
        height: auto;
    }
    .toolbar li{
        display: flex;
        justify-content: center;
        border: 1px solid white;
        flex-grow: 1;
        min-width: 20%;
        padding-block:0.25em ;
        text-align: center;
    }
    .toolbar li:active{
        color: var(--blue, #007bff); /* Fallback eklendi */
        font-weight: bolder;
        box-shadow: inset 4px 4px 12px #c5c5c5, inset -4px -4px 12px #ffffff;
        box-shadow: inset 0px 0.1em 0.6em #3c4fe0;
        transform: translateY(0.05em);
        background: var(--white, #fff);
    }
    .toolbar a{
        width: 100%;
        height: 100%;
        text-decoration: none; /* Link alt çizgisini garanti kaldır */
        color: inherit;
    }
    .toolbar_text{
        font-size: clamp(0.50rem, 0.50rem + 1vw, 1.75rem);
        margin-top: 3px;
    }
    @media (orientation: landscape) {
        .toolbar img {
            max-width: 15px;
        }
        .toolbar_text{
            font-size: clamp(0.30rem, 0.30rem + 1vw, 1.75rem);
        }
    }
/* END TOOLBAR STYLE */
/* MAP STYLE */
	#map {
        padding-bottom: min(70px, 90px);
        padding-top: min(10px, 15px);
        font-size: var(--h4);
        /* background-color: #545458; */
        color: black;
        /* color: var(--apple-gray); */
        /* font-weight: bold; */
        display: grid;
        grid-template-columns: 1fr 1fr;
        justify-content: space-between;
        font-family: 'Text', Times, serif;
    }

    #map ul {
        list-style: square !important;
        margin: 0 !important;
    }

    #map ul li {
        padding: 0.25em 1em;
    }

    .map-right {
        text-align: right;
    }
/* END MAP STYLE */
/* MENU_MODAL STYLE */
    .menu-modal {
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%) scale(0);
        transition: 200ms ease-in-out;
        border-radius: 10px;
        z-index: 4;
        color: #ffffff;
        width: 500px;
        max-width: 80%;
        backdrop-filter: blur(16px) saturate(180%);
        -webkit-backdrop-filter: blur(16px) saturate(180%);
        background-color: rgba(0, 0, 0, 0.75);
        border-radius: 20px;
        border: 1px solid rgba(255, 255, 255, 0.125);
    }
    .menu-modal.active {
        transform: translate(-50%, -50%) scale(1);
    }
    .menu-modal-header {
        padding: 10px 15px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-bottom: 2px solid black;
    }
    .menu-modal-header .menu-modal-title {
        font-size: clamp(1.5rem, 1rem + 3vw, 3rem);
        font-weight: bold;
    }
    .menu-modal-header .menu-modal-close-button {
        cursor: pointer;
        color: #ffffff;
        background: none;
        font-size: 2.5rem;
        font-weight: bold;
        padding: 0 0.10em;
        box-shadow:
            12px 12px 16px 0 rgba(255, 255, 255, 0.3) inset,
            -8px -8px 12px 0 rgba(0, 0, 0, .25) inset;
        margin-right: 0;
    }
    .menu-modal-body {
        padding: 10px 15px;
        margin: 0.5em 0;
    }
    .menu-modal-body p {
        font-size: clamp(0.75rem, 0.5rem + 2vw, 1.5rem);
        text-align: center;
    }
    .menu-modal-body ul {
        display: grid;
        display: -ms-grid;
        grid-template-columns: 1fr 1fr;
        -ms-grid-columns: 1fr 1fr;
        gap: 1em;
        margin: 0 auto;
    }
    /* #sss_modal{
        grid-template-columns: 1fr;
        -ms-grid-columns: 1fr;
    } */
    .menu-modal-body li {
        min-width: 100%;
        min-height: 100%;
        /* Orange Bg */
        /* background: linear-gradient(180deg,
                rgba(255, 140, 7, 1) 0%,
                rgba(232, 73, 29, 1) 50%,
                rgba(252, 42, 0, 1) 100%); */

        background: -webkit-linear-gradient(transparent, transparent),
                -webkit-linear-gradient(top, hsl(37, 55.30%, 63.10%) 0%, rgba(213,173,109,1) 26%, rgba(226,186,120,1) 35%, rgba(163,126,67,1) 45%, rgba(145,112,59,1) 61%, rgba(213,173,109,1) 100%);
   
        /* Orange Bg */
    }
    .menu-modal-body a {
        display: grid;
        display: -ms-grid;
        place-content: center;
        border: 1px solid white;
        padding: 0.5em 2em;
        box-shadow:
            12px 12px 16px 0 rgba(255, 255, 255, 0.3) inset,
            -8px -8px 12px 0 rgba(0, 0, 0, .25) inset;
        min-height: 100%;
    }
    .menu-modal-body a:active {
        transform: translateY(4px);
    }
    #overlay {
        position: fixed;
        opacity: 0;
        transition: 200ms ease-in-out;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        pointer-events: none;
        /* background-color: rgba(0, 0, 0, 0.5); */
        background: rgba(0, 0, 0, 0.80);
        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
    }
    #overlay.active {
        opacity: 1;
        pointer-events: all;
        z-index: 2;
        cursor: pointer;
    }
/* END MENU_MODAL STYLE */