/* LESA Fine Jewelry — site stili (C — Vitrin) */
:root{
  --krem:#F4EDE3; --fildisi:#FBF8F3; --kum:#E7D9CA; --sampanya:#C9A57C;
  --altin:#9C7449; --bronz:#7A5634; --bronz-koyu:#5C3F24; --tas:#6B5847; --murekkep:#2E2219;
  --r-lg:28px; --r-md:24px; --r-sm:16px;
  --yay:cubic-bezier(.2,.7,.2,1);
  --cerceve:1360px;
  --alt-bar:0px;
  --wa:#25D366; --wa-koyu:#1DA851;
  --ig:linear-gradient(45deg,#F58529 0%,#DD2A7B 50%,#8134AF 100%);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
html,body{margin:0}
body{
  background:var(--fildisi); color:var(--murekkep);
  font-family:'Jost',system-ui,sans-serif; font-weight:400; font-size:15px; line-height:1.5;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
  padding-bottom:var(--alt-bar);
}
img,svg{display:block; max-width:100%}
a{color:inherit; text-decoration:none}
button{font:inherit; color:inherit; cursor:pointer}
h1,h2,h3{margin:0; font-weight:300; letter-spacing:-.02em; line-height:1.05}
h1{font-size:clamp(38px,4.4vw,64px); line-height:1.02}
h2{font-size:clamp(28px,3vw,40px)}
h3{font-size:22px; letter-spacing:-.01em; font-weight:400}
p{margin:0}
.ince{font-weight:300; color:var(--tas); line-height:1.6}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}
:focus-visible{outline:2px solid var(--murekkep); outline-offset:3px; border-radius:4px}
.cerceve{max-width:var(--cerceve); margin:0 auto; padding:0 24px}
@media (max-width:640px){ .cerceve{padding:0 16px} }

/* ---------- Butonlar ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  height:52px; padding:0 28px; border-radius:999px; border:1px solid transparent;
  font-size:15px; font-weight:500; white-space:nowrap;
  transition:transform .35s var(--yay), background-color .3s, color .3s, border-color .3s, box-shadow .35s;
}
.btn svg{width:17px; height:17px; flex:0 0 auto}
.btn-koyu{background:var(--murekkep); color:var(--fildisi)}
.btn-bronz{background:var(--bronz); color:var(--fildisi)}
.btn-acik{background:var(--fildisi); color:var(--murekkep)}
.btn-cerceve{border-color:var(--murekkep); color:var(--murekkep); background:transparent}
.btn-cerceve-acik{border-color:var(--fildisi); color:var(--fildisi); background:transparent}
.btn-wa{background:var(--wa); color:#fff; border-color:var(--wa)}
.btn-wa svg{width:18px; height:18px}
.btn-ig{background:var(--ig); color:#fff; border-color:transparent}
.btn-ig svg{width:18px; height:18px}
.btn-sm{height:46px; padding:0 22px; font-size:14px}
.btn-lg{height:58px; font-size:16px; width:100%}
.btn:active{transform:translateY(1px)}
@media (hover:hover){
  .btn:hover{transform:translateY(-2px); box-shadow:0 14px 28px -16px rgba(46,34,25,.5)}
  .btn-bronz:hover{background:var(--bronz-koyu)}
  .btn-koyu:hover{background:#1f1711}
  .btn-cerceve:hover{background:var(--murekkep); color:var(--fildisi)}
  .btn-cerceve-acik:hover{background:var(--fildisi); color:var(--murekkep)}
  .btn-acik:hover{background:#fff}
  .btn-wa:hover{background:var(--wa-koyu); border-color:var(--wa-koyu)}
}
.ikon-btn{
  width:44px; height:44px; flex:0 0 44px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:50%; border:1px solid var(--murekkep); background:transparent; color:var(--murekkep);
  transition:background-color .3s, color .3s, transform .3s var(--yay);
}
.ikon-btn svg{width:18px; height:18px}
.ikon-btn.dolu{background:var(--bronz); border-color:var(--bronz); color:var(--fildisi)}
.ikon-btn.wa{background:var(--wa); border-color:var(--wa); color:#fff}
.ikon-btn.wa svg{width:20px; height:20px}
.ikon-btn.ig{width:46px; height:46px; flex-basis:46px}
.ikon-btn.ig svg{width:20px; height:20px}
@media (hover:hover){
  .ikon-btn:hover{background:var(--murekkep); color:var(--fildisi); transform:translateY(-2px)}
  .ikon-btn.dolu:hover{background:var(--bronz-koyu); border-color:var(--bronz-koyu)}
  .ikon-btn.wa:hover{background:var(--wa-koyu); border-color:var(--wa-koyu)}
}
.rozet{display:inline-flex; align-items:center; padding:6px 12px; border-radius:999px; background:var(--krem); font-size:12px; color:var(--murekkep); line-height:1.3}
.rozet-koyu{background:var(--murekkep); color:var(--fildisi)}
.rozet-cizgi{background:transparent; border:1px solid var(--sampanya); color:var(--sampanya); letter-spacing:.08em; font-size:11px}

/* ---------- Header ---------- */
.ust{position:sticky; top:0; z-index:40; background:rgba(251,248,243,.92); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px)}
.ust-ic{min-height:88px; padding:12px 0; display:flex; align-items:center; justify-content:space-between; gap:24px}
.marka{display:flex; flex-direction:column; align-items:center; gap:5px; padding:4px 0}
.marka-ad{font-family:'Cormorant Garamond',Georgia,serif; font-weight:500; font-size:30px; line-height:1; letter-spacing:.3em; padding-left:.3em}
.marka-alt{font-size:9px; letter-spacing:.42em; padding-left:.42em; color:var(--altin); text-transform:uppercase}
.nav-hap{display:flex; gap:4px; padding:5px; background:var(--krem); border-radius:999px; font-size:14px}
.nav-hap a{display:flex; align-items:center; height:44px; padding:0 20px; border-radius:999px; transition:background-color .25s, color .25s}
.nav-hap a[aria-current="page"]{background:var(--murekkep); color:var(--fildisi)}
@media (hover:hover){ .nav-hap a:not([aria-current="page"]):hover{background:var(--fildisi)} }
.ust-aksiyon{display:flex; gap:8px}
.ust-mobil{display:none}
.menu-ac{display:none}
@media (max-width:1080px){
  .nav-hap{display:none}
  .ust-ic{min-height:64px; padding:8px 0}
  .ust-aksiyon .btn-cerceve{display:none}
}
@media (max-width:760px){
  .ust-ic{min-height:60px; padding:0; margin:0 -8px}
  .ust-aksiyon{display:none}
  .menu-ac,.ust-mobil{display:inline-flex}
  .ikon-sade{width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; border:0; background:transparent; border-radius:50%}
  .ikon-sade svg{width:22px; height:22px}
  .marka-ad{font-size:26px}
  .marka-alt{display:none}
}

/* ---------- Mobil çekmece ---------- */
.cekmece-ort{position:fixed; inset:0; z-index:60; background:rgba(46,34,25,.45); opacity:0; pointer-events:none; transition:opacity .35s}
.cekmece{
  position:fixed; top:0; bottom:0; left:0; z-index:61; width:min(326px,86vw);
  display:flex; flex-direction:column; background:var(--fildisi);
  transform:translateX(-102%); transition:transform .45s var(--yay);
  overflow-y:auto; -webkit-overflow-scrolling:touch;
}
body.menu-acik .cekmece-ort{opacity:1; pointer-events:auto}
body.menu-acik .cekmece{transform:none}
body.menu-acik{overflow:hidden}
.cekmece-ust{flex:0 0 64px; padding:0 8px 0 20px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--kum)}
.cekmece nav{flex:1; padding:8px 20px; display:flex; flex-direction:column; font-size:16px}
.cekmece nav > a{padding:15px 0}
.akordeon-bas{padding:15px 0; display:flex; align-items:center; justify-content:space-between; width:100%; border:0; background:transparent; text-align:left; font-size:16px}
.akordeon-bas svg{width:18px; height:18px; transition:transform .3s}
.akordeon-bas[aria-expanded="true"]{font-weight:500}
.akordeon-bas[aria-expanded="true"] svg{transform:rotate(180deg)}
.akordeon-ic{display:none; flex-direction:column; padding:0 0 8px 14px; border-left:1px solid var(--sampanya); font-size:15px}
.akordeon-ic a{padding:12px 0}
.akordeon-ic.acik{display:flex}
.cekmece-alt{padding:16px 20px calc(24px + env(safe-area-inset-bottom)); display:flex; flex-direction:column; gap:10px; border-top:1px solid var(--kum)}
.cekmece-alt .btn{width:100%}
.cekmece-alt .ig{padding:12px 0 0; display:flex; align-items:center; justify-content:center; gap:8px; font-size:14px}
.cekmece-alt .ig svg{width:18px; height:18px}

/* ---------- Mobil alt çubuk ---------- */
.alt-bar{
  display:none; position:fixed; left:0; right:0; bottom:0; z-index:35;
  padding:10px 16px calc(12px + env(safe-area-inset-bottom)); gap:10px;
  background:rgba(251,248,243,.96); border-top:1px solid var(--kum);
}
.alt-bar .btn{flex:1; height:50px; padding:0 16px}
@media (max-width:760px){
  .alt-bar{display:flex}
  :root{--alt-bar:76px}
}

/* ---------- Kutular ---------- */
.kutu{border-radius:var(--r-lg); background:var(--krem)}
.kutu-kum{background:var(--kum)}
.kutu-koyu{background:var(--murekkep); color:var(--fildisi)}
.kutu-cizgi{border:1px solid var(--kum); background:transparent}
.bolum{padding-top:88px}
.bolum-son{padding-bottom:72px}
@media (max-width:760px){ .bolum{padding-top:48px} .bolum-son{padding-bottom:40px} }
.bolum-bas{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:28px}
.bolum-bas a{padding:12px 0; font-size:15px; font-weight:500; text-decoration:underline; text-underline-offset:5px; text-decoration-color:var(--sampanya)}
@media (max-width:760px){ .bolum-bas{margin-bottom:16px} }

/* ---------- Ana sayfa ---------- */
.hero{display:flex; flex-wrap:wrap; gap:16px}
.hero-ana{
  flex:1.25 1 480px; min-width:0; min-height:600px; padding:min(26vw,360px) 40px 40px;
  display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; gap:18px;
  position:relative; overflow:hidden;
}
.hero-logo{
  position:absolute; left:50%; top:0; transform:translateX(-50%); width:min(50%,400px); aspect-ratio:1; pointer-events:none;
  -webkit-mask-image:radial-gradient(circle at 50% 50%,#000 48%,transparent 70%);
          mask-image:radial-gradient(circle at 50% 50%,#000 48%,transparent 70%);
}
.hero-logo img{width:100%; height:100%}
.hero-ana h1{max-width:520px; position:relative}
.hero-ana p{max-width:420px; font-size:17px; position:relative}
.hero-ana .btnler{display:flex; flex-wrap:wrap; gap:8px; position:relative}
.hero-kat{flex:1 1 420px; min-width:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px}
.kat-kart{
  position:relative; overflow:hidden; isolation:isolate;
  min-height:272px; padding:24px; display:flex; flex-direction:column; justify-content:space-between; align-items:flex-start;
  border-radius:var(--r-lg); background:var(--krem); color:var(--murekkep);
  transition:transform .4s var(--yay), box-shadow .4s;
}
.kat-kart .kat-foto{position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; transition:transform .8s var(--yay)}
.kat-kart::after{content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg, rgba(251,248,243,0) 35%, rgba(251,248,243,.78) 68%, rgba(251,248,243,.96) 100%)}
.kat-kart.koyu::after{background:linear-gradient(180deg, rgba(46,34,25,.1) 20%, rgba(46,34,25,.72) 62%, rgba(46,34,25,.95) 100%)}
.kat-kart .tipler{padding:6px 12px; border-radius:999px; background:rgba(251,248,243,.88); font-size:12px; color:var(--murekkep); backdrop-filter:blur(4px)}
.kat-kart.koyu .tipler{background:rgba(46,34,25,.6); color:var(--kum); border:1px solid rgba(201,165,124,.6)}
.kat-kart .ad{width:100%}
.kat-kart.koyu{background:var(--murekkep); color:var(--fildisi)}
.kat-kart .ad{display:flex; align-items:flex-end; justify-content:space-between; gap:12px; font-size:26px; font-weight:300; line-height:1.1}
.kat-kart .ad svg{width:20px; height:20px; flex:0 0 auto}
@media (hover:hover){ .kat-kart:hover{transform:translateY(-4px); box-shadow:0 24px 40px -28px rgba(46,34,25,.5)} .kat-kart:hover .kat-foto{transform:scale(1.05)} }
.bilgi-sira{padding-top:16px; display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px}
.bilgi{padding:22px 24px; display:flex; flex-direction:column; gap:4px; border:1px solid var(--kum); border-radius:var(--r-md)}
.bilgi b{font-weight:500; font-size:17px}
@media (max-width:760px){
  .hero-ana{min-height:0; padding:min(62vw,300px) 20px 22px; border-radius:var(--r-md); gap:12px}
  .hero-ana h1{font-size:40px}
  .hero-ana p{font-size:15px}
  .hero-logo{width:min(66%,260px); top:-3%}
  .hero-kat{gap:12px}
  .kat-kart{min-height:150px; padding:16px; border-radius:var(--r-md); justify-content:flex-end}
  .kat-kart .ad{font-size:19px; font-weight:400}
  .kat-kart .tipler{display:none}
  .bilgi-sira{padding-top:12px; gap:10px}
}

.suyolu-band{display:flex; flex-wrap:wrap; gap:16px}
.suyolu-metin{
  flex:1 1 420px; min-width:0; min-height:440px; padding:48px;
  display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; gap:16px;
}
.suyolu-metin .rozet-cizgi{margin-bottom:auto}
.suyolu-metin h2{font-size:clamp(34px,3.6vw,52px)}
.suyolu-metin p{max-width:400px; font-size:17px; color:var(--kum); font-weight:300; line-height:1.6}
.suyolu-gorsel{flex:1.4 1 480px; min-width:0; min-height:440px; display:flex; align-items:center; justify-content:center; overflow:hidden; position:relative}
.suyolu-gorsel img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
@media (max-width:760px){
  .suyolu-metin{min-height:300px; padding:24px; border-radius:var(--r-md)}
  .suyolu-metin p{font-size:15px}
  .suyolu-gorsel{display:none}
}

.adimlar{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px}
.adim{min-height:220px; padding:28px; display:flex; flex-direction:column; justify-content:space-between; gap:24px; border-radius:var(--r-lg); background:var(--krem)}
.adim .no{width:44px; height:44px; display:flex; align-items:center; justify-content:center; background:var(--fildisi); border-radius:50%; font-weight:500}
.adim h3{margin-bottom:6px}
@media (max-width:760px){
  .adimlar{gap:10px}
  .adim{min-height:0; padding:16px; flex-direction:row; align-items:center; gap:14px; border-radius:20px}
  .adim .no{flex:0 0 40px; height:40px}
  .adim h3{font-size:16px; font-weight:500; margin-bottom:2px}
  .adim p{font-size:14px}
}
.insta-band{padding:40px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px 48px}
@media (max-width:760px){ .insta-band{padding:24px; border-radius:var(--r-md)} }

/* ---------- Ürün kartı ve ızgara ---------- */
.izgara{display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:32px 16px}
@media (max-width:760px){ .izgara{grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 12px} }
.kart{display:flex; flex-direction:column; gap:12px; min-width:0}
.kart-foto{
  position:relative; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; overflow:hidden;
  border-radius:var(--r-md); background:var(--krem);
}
.kart-foto img{width:100%; height:100%; object-fit:cover; transition:transform .6s var(--yay)}
.kart-foto .ph{width:46%; opacity:.9; transition:transform .6s var(--yay)}
@media (hover:hover){ .kart-foto:hover img,.kart-foto:hover .ph{transform:scale(1.04)} }
.kart-foto .rozet{position:absolute; left:14px; top:14px; background:var(--fildisi)}
.kart-foto .rozet-koyu{left:auto; right:14px; background:var(--murekkep)}
.kart-alt{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 6px}
.kart-ad{display:flex; flex-direction:column; gap:2px; min-width:0}
.kart-ad a{display:block; padding:4px 0; font-size:17px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.kart-ad small{font-size:13px; color:var(--tas)}
.kart-btnler{display:flex; gap:6px}
@media (max-width:760px){
  .kart{gap:10px}
  .kart-foto{border-radius:var(--r-sm)}
  .kart-foto .rozet{left:10px; top:10px; padding:4px 10px; font-size:11px}
  .kart-foto .rozet-koyu{right:10px}
  .kart-alt{flex-direction:column; align-items:stretch; gap:10px; padding:0 2px}
  .kart-ad a{font-size:15px; white-space:normal}
  .kart-ad small{font-size:12px}
  .kart-btnler{gap:8px}
  .kart-btnler .ikon-btn{flex:1; width:auto; border-radius:999px; height:42px}
}

/* ---------- Kategori sayfası ---------- */
.kat-bas{
  position:relative; overflow:hidden; isolation:isolate;
  min-height:360px; padding:40px; display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:24px 48px;
}
.kat-bas-foto{position:absolute; top:0; right:0; bottom:0; z-index:-2; width:58%; height:100%; object-fit:cover}
.kat-bas::after{content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(90deg, #E7D9CA 40%, rgba(231,217,202,.85) 52%, rgba(231,217,202,0) 72%)}
.kat-bas.kutu-koyu::after{background:linear-gradient(90deg, #2E2219 40%, rgba(46,34,25,.85) 52%, rgba(46,34,25,.15) 75%)}
.kat-bas .kirinti,.kat-bas h1,.kat-bas p{position:relative}
.kat-bas > div{max-width:46%; display:flex; flex-direction:column}
.kat-bas p{margin-top:16px}
.kutu-koyu .kirinti,.kutu-koyu .kirinti a{color:var(--kum)}
.kutu-koyu .kirinti span[aria-current]{color:var(--fildisi)}
.kutu-koyu p.ince{color:var(--kum)}
.kat-bas p{max-width:420px; font-size:17px}
.kirinti{display:flex; flex-wrap:wrap; gap:8px; font-size:13px; color:var(--tas); margin-bottom:14px}
.kirinti a{color:var(--tas)}
.kirinti span[aria-current]{color:var(--murekkep)}
@media (max-width:760px){
  .kat-bas{min-height:0; padding:min(52vw,240px) 24px 24px; border-radius:var(--r-md)}
  .kat-bas-foto{width:100%; height:min(60vw,280px); bottom:auto}
  .kat-bas::after{background:linear-gradient(180deg, rgba(231,217,202,0) 25%, rgba(231,217,202,.9) 48%, #E7D9CA 58%)}
  .kat-bas.kutu-koyu::after{background:linear-gradient(180deg, rgba(46,34,25,.05) 25%, rgba(46,34,25,.9) 48%, #2E2219 58%)}
  .kat-bas > div{max-width:none}
  .kat-bas h1{font-size:36px}
  .kat-bas p{font-size:15px}
}
.filtre-sira{padding-top:24px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px}
.filtreler{display:flex; flex-wrap:wrap; gap:8px}
.filtre{height:46px; padding:0 22px; border:1px solid var(--murekkep); border-radius:999px; background:transparent; font-size:14px; transition:background-color .25s, color .25s}
.filtre[aria-pressed="true"]{background:var(--murekkep); color:var(--fildisi)}
.filtre-sag{display:flex; align-items:center; gap:16px}
.sayac{font-size:14px; color:var(--tas); white-space:nowrap}
.gecis{display:flex; align-items:center; gap:10px; height:46px; padding:0 18px 0 8px; border:1px solid var(--kum); border-radius:999px; background:var(--krem); font-size:14px}
.gecis .kutucuk{width:30px; height:30px; display:flex; align-items:center; justify-content:center; border:1px solid var(--murekkep); border-radius:50%; color:var(--fildisi); transition:background-color .25s}
.gecis .kutucuk svg{width:14px; height:14px; opacity:0; transition:opacity .2s}
.gecis[aria-pressed="true"] .kutucuk svg{opacity:1}
.gecis[aria-pressed="true"] .kutucuk{background:var(--murekkep)}
@media (max-width:760px){
  .filtre-sira{padding-top:16px; gap:12px}
  .filtreler{width:100%; flex-wrap:nowrap; overflow-x:auto; padding-bottom:4px; margin:0 -16px; padding-left:16px; padding-right:16px; scrollbar-width:none}
  .filtreler::-webkit-scrollbar{display:none}
  .filtre{flex:0 0 auto; height:42px; padding:0 18px}
  .filtre-sag{width:100%; justify-content:space-between}
  .gecis{height:42px}
}
.urun-liste{padding-top:32px}
.bos[hidden]{display:none}
.bos{padding:64px 24px; display:flex; flex-direction:column; align-items:center; gap:16px; text-align:center}
.bos div{font-size:22px; font-weight:300}
.cta-band{padding:40px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px 48px}
.cta-band .btnler{display:flex; flex-wrap:wrap; gap:8px}
@media (max-width:760px){ .cta-band{padding:24px; border-radius:var(--r-md)} .cta-band h2{font-size:26px} .cta-band .btnler{width:100%} .cta-band .btn{flex:1} }

/* ---------- Ürün sayfası ---------- */
.urun{display:flex; flex-wrap:wrap; align-items:flex-start; gap:32px 48px}
.galeri{flex:1.3 1 520px; min-width:0; display:flex; flex-direction:column; gap:12px}
.galeri-ana{position:relative; aspect-ratio:1/1; border-radius:var(--r-lg); background:var(--krem); overflow:hidden; display:flex}
.galeri-ana .kaydir{display:flex; width:100%; height:100%; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -webkit-overflow-scrolling:touch}
.galeri-ana .kaydir::-webkit-scrollbar{display:none}
.galeri-ana .kare{flex:0 0 100%; height:100%; scroll-snap-align:start; display:flex; align-items:center; justify-content:center}
.galeri-ana .kare img{width:100%; height:100%; object-fit:cover}
.galeri-ana .kare .ph{width:40%}
.galeri-ana .sayac{position:absolute; right:20px; bottom:20px; padding:8px 14px; background:var(--fildisi); border-radius:999px; font-size:13px; color:var(--murekkep)}
.galeri-kucuk{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px}
.galeri-kucuk button{aspect-ratio:1/1; padding:0; border:2px solid transparent; border-radius:18px; background:var(--krem); overflow:hidden; display:flex; align-items:center; justify-content:center}
.galeri-kucuk button[aria-pressed="true"]{border-color:var(--murekkep)}
.galeri-kucuk img{width:100%; height:100%; object-fit:cover}
.galeri-kucuk .ph{width:44%}
.urun-bilgi{flex:1 1 400px; min-width:0; display:flex; flex-direction:column; gap:28px}
.urun-bilgi .bas{display:flex; flex-direction:column; gap:10px}
.urun-bilgi .rozetler{display:flex; flex-wrap:wrap; gap:6px}
.urun-bilgi h1{font-size:clamp(36px,3.6vw,52px)}
.urun-bilgi .kod{font-size:14px; color:var(--tas)}
.ozellikler{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px}
.ozellik{padding:16px 18px; background:var(--krem); border-radius:var(--r-sm); display:flex; flex-direction:column; gap:2px}
.ozellik small{font-size:12px; color:var(--tas)}
.ozellik span{font-size:16px}
.urun-btnler{display:flex; flex-direction:column; gap:10px}
.urun-btnler .not{padding-top:4px; font-size:13px; color:var(--tas); text-align:center}
.sekmeler{display:flex; gap:28px; border-bottom:1px solid var(--kum)}
.sekme{padding:14px 0; border:0; border-bottom:2px solid transparent; background:transparent; color:var(--tas); font-size:16px; margin-bottom:-1px}
.sekme[aria-selected="true"]{color:var(--murekkep); border-bottom-color:var(--murekkep); font-weight:500}
.sekme-ic{display:none; padding-top:16px}
.sekme-ic.acik{display:block}
.sekme-ic p{font-size:16px}
.ek-bilgi{display:flex; flex-direction:column; font-size:15px}
.ek-bilgi div{padding:12px 0; display:flex; justify-content:space-between; gap:24px; border-bottom:1px solid var(--kum)}
.ek-bilgi small{font-size:15px; color:var(--tas)}
@media (max-width:760px){
  .urun{gap:24px}
  .galeri{gap:10px}
  .galeri-ana{border-radius:var(--r-md)}
  .galeri-kucuk{gap:8px}
  .galeri-kucuk button{border-radius:12px}
  .urun-bilgi{gap:22px}
  .urun-bilgi h1{font-size:34px}
  .urun-btnler{display:none}
}

/* ---------- Yüzen WhatsApp (masaüstü) ---------- */
.yuzen-wa{
  position:fixed; right:24px; bottom:24px; z-index:30; width:56px; height:56px;
  display:flex; align-items:center; justify-content:center; border-radius:50%;
  background:var(--wa); color:#fff; box-shadow:0 16px 32px -14px rgba(29,168,81,.7);
  transition:transform .35s var(--yay), background-color .3s;
}
.yuzen-wa svg{width:28px; height:28px}
@media (hover:hover){ .yuzen-wa:hover{transform:translateY(-3px); background:var(--wa-koyu)} }
@media (max-width:760px){ .yuzen-wa{display:none} }

/* ---------- İletişim ---------- */
.iletisim{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px}
.iletisim-kart{padding:28px; display:flex; flex-direction:column; gap:14px; border-radius:var(--r-lg); background:var(--krem); min-height:200px}
.iletisim-kart .ikon{width:44px; height:44px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--fildisi); color:var(--bronz)}
.iletisim-kart .ikon.wa{background:var(--wa); color:#fff}
.iletisim-kart .ikon.ig{background:var(--ig); color:#fff}
.iletisim-kart .ikon svg{width:20px; height:20px}
.iletisim-kart h3{margin-top:auto}
.iletisim-kart .deger{font-size:17px}
.iletisim-kart .deger a{text-decoration:underline; text-underline-offset:4px; text-decoration-color:var(--sampanya)}
.saatler{display:flex; flex-direction:column; font-size:15px}
.saatler div{display:flex; justify-content:space-between; gap:16px; padding:10px 0; border-bottom:1px solid var(--kum)}
.saatler div:last-child{border-bottom:0}
@media (max-width:760px){ .iletisim-kart{padding:22px; border-radius:var(--r-md); min-height:0} }

/* ---------- Footer ---------- */
.alt{padding:0 24px 24px}
@media (max-width:640px){ .alt{padding:0 16px 16px} }
.alt-ic{padding:56px 48px 28px; display:flex; flex-direction:column; gap:48px; border-radius:var(--r-lg); background:var(--murekkep); color:var(--fildisi)}
.alt-ust{display:flex; flex-wrap:wrap; justify-content:space-between; gap:40px 64px}
.alt-marka{flex:1 1 320px; display:flex; flex-direction:column; align-items:flex-start; gap:20px}
.alt-marka .marka-ad{font-size:34px}
.alt-marka p{max-width:360px; font-size:16px; color:var(--kum)}
.alt-marka .btnler{display:flex; flex-wrap:wrap; gap:8px}
.alt-sutun{display:flex; flex-direction:column; gap:4px; font-size:15px}
.alt-sutun .baslik{padding-bottom:8px; font-size:12px; letter-spacing:.12em; color:var(--sampanya)}
.alt-sutun a,.alt-sutun div:not(.baslik){padding:10px 0}
.alt-sutun .soluk{color:var(--kum)}
.alt-sutun a.ig{display:flex; align-items:center; gap:8px}
.alt-sutun a.ig svg{width:16px; height:16px}
@media (hover:hover){ .alt-sutun a:hover{color:var(--sampanya)} }
.alt-cizgi{padding-top:20px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 24px; border-top:1px solid var(--tas); font-size:13px; color:var(--kum)}
.imza{font-size:10px; letter-spacing:.1em; opacity:.55; padding:8px 0}
@media (hover:hover){ .imza:hover{opacity:.9; text-decoration:underline; text-underline-offset:3px} }
@media (max-width:760px){
  .alt-ic{padding:28px 24px 20px; gap:28px; border-radius:var(--r-md)}
  .alt-ust{gap:24px}
  .alt-marka .marka-ad{font-size:28px}
  .alt-sutun{width:100%}
}

/* ---------- Giriş animasyonu ---------- */
@media (prefers-reduced-motion:no-preference){
  .yuksel{animation:yuksel .8s var(--yay) both}
  .g1{animation-delay:.05s}.g2{animation-delay:.15s}.g3{animation-delay:.25s}.g4{animation-delay:.35s}
  .kart{animation:yuksel .6s var(--yay) both}
}
@keyframes yuksel{from{opacity:0; transform:translateY(10px)}to{opacity:1; transform:none}}
@media (prefers-reduced-motion:reduce){ *{transition:none !important; animation:none !important} html{scroll-behavior:auto} }

/* ======================================================
   Zen Pırlanta'dan uyarlanan ekler: duyuru bandı, güven satırı, arama,
   favoriler, rozetler, sıralama, yapışkan çubuk, takım, yukarı çık
   ====================================================== */

/* ---------- Duyuru bandı ---------- */
.duyuru{background:var(--murekkep); color:var(--kum); font-size:12.5px; letter-spacing:.02em; text-align:center}
.duyuru a{display:block; padding:8px 0; color:var(--kum)}
@media (max-width:760px){ .duyuru{font-size:12px} .duyuru a{padding:7px 0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis} }

/* ---------- Header ekleri ---------- */
.ust-aksiyon{align-items:center}
.ikon-btn.sade{border-color:var(--kum); background:var(--krem); width:46px; height:46px; flex-basis:46px; position:relative}
.ikon-btn.sade svg{width:20px; height:20px}
@media (hover:hover){ .ikon-btn.sade:hover{background:var(--murekkep); border-color:var(--murekkep); color:var(--fildisi)} }
.fav-sayi{position:absolute; top:-4px; right:-4px; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:var(--bronz); color:#fff; font-size:11px; font-weight:500; line-height:18px; text-align:center}
.fav-link{position:relative}
.ust-mobil{gap:0}
@media (max-width:760px){
  .ust-mobil{display:flex}
  .ust-mobil .fav-sayi{top:2px; right:2px}
}

/* ---------- Güven satırı ---------- */
.guven{list-style:none; margin:16px 0 0; padding:18px 24px; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; border:1px solid var(--kum); border-radius:var(--r-md)}
.guven li{display:flex; align-items:center; gap:12px; min-width:0}
.guven li > span:last-child{display:flex; flex-direction:column; min-width:0}
.guven b{font-weight:500; font-size:14px; line-height:1.3}
.guven small{font-size:12.5px; color:var(--tas); line-height:1.3}
.guven-ik{flex:0 0 40px; width:40px; height:40px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--krem); color:var(--altin)}
.guven-ik svg{width:20px; height:20px}
.guven-kisa{margin:0; padding:14px 16px; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 16px; background:var(--krem); border:0}
.guven-kisa .guven-ik{flex-basis:32px; width:32px; height:32px; background:var(--fildisi)}
.guven-kisa .guven-ik svg{width:16px; height:16px}
.guven-kisa b{font-size:13.5px; font-weight:400}
@media (max-width:1080px){ .guven{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:760px){
  .guven{margin-top:12px; padding:4px 16px; grid-template-columns:1fr; gap:0; border-radius:20px}
  .guven li{padding:10px 0; border-bottom:1px solid var(--kum)}
  .guven li:last-child{border-bottom:0}
  .guven-kisa{margin:0; padding:12px 14px; grid-template-columns:1fr 1fr; gap:8px 12px; border-radius:var(--r-sm)}
  .guven-kisa li{padding:0; border:0}
}

/* ---------- Arama ---------- */
.ara{position:fixed; inset:0; z-index:70; display:none}
body.ara-acik .ara{display:block}
body.ara-acik{overflow:hidden}
.ara-ort{position:absolute; inset:0; background:rgba(46,34,25,.45)}
.ara-kutu{position:relative; max-width:720px; margin:min(12vh,120px) auto 0; padding:8px; background:var(--fildisi); border-radius:var(--r-md); box-shadow:0 30px 60px -30px rgba(46,34,25,.6); animation:yuksel .35s var(--yay) both}
.ara-form{display:flex; align-items:center; gap:10px; padding:4px 8px 4px 16px; border-bottom:1px solid var(--kum)}
.ara-form > svg{width:22px; height:22px; flex:0 0 auto; color:var(--tas)}
.ara-form input{flex:1; min-width:0; height:52px; border:0; background:transparent; font:inherit; font-size:18px; font-weight:300; color:var(--murekkep); outline:none}
.ara-form input::placeholder{color:var(--tas); opacity:.8}
.ara-form input::-webkit-search-cancel-button{-webkit-appearance:none}
.ara-form .ikon-sade{width:44px; height:44px; flex:0 0 44px; display:inline-flex; align-items:center; justify-content:center; border:0; background:transparent; border-radius:50%}
.ara-form .ikon-sade svg{width:20px; height:20px}
.ara-sonuc{max-height:min(60vh,520px); overflow-y:auto; padding:8px}
.ara-ipucu,.ara-bos{padding:14px 10px; font-size:14px; color:var(--tas)}
.ara-ipucu button{margin:0 4px 4px 0; padding:6px 12px; border:1px solid var(--kum); border-radius:999px; background:var(--krem); font-size:13px}
.ara-bos a{color:var(--bronz); text-decoration:underline; text-underline-offset:4px}
.ara-satir{display:flex; align-items:center; gap:14px; padding:8px 10px; border-radius:var(--r-sm); transition:background-color .2s}
.ara-satir:hover,.ara-satir:focus-visible{background:var(--krem)}
.ara-foto{flex:0 0 56px; width:56px; height:56px; border-radius:12px; overflow:hidden; background:var(--krem); display:flex; align-items:center; justify-content:center}
.ara-foto img{width:100%; height:100%; object-fit:cover}
.ara-foto img.ph{width:50%; height:auto}
.ara-ad{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; font-size:16px}
.ara-ad small{font-size:13px; color:var(--tas)}
.ara-satir > svg{width:18px; height:18px; color:var(--tas); flex:0 0 auto}
@media (max-width:760px){
  .ara-kutu{margin:0; min-height:100%; border-radius:0; animation:none; padding:calc(4px + env(safe-area-inset-top)) 8px 8px}
  .ara-sonuc{max-height:none}
  .ara-form input{font-size:16px}
}

/* ---------- Favori kalbi ---------- */
.kart{position:relative}
.fav{position:absolute; top:12px; right:12px; z-index:2; width:40px; height:40px; display:flex; align-items:center; justify-content:center; border:0; border-radius:50%; background:rgba(251,248,243,.92); color:var(--murekkep); box-shadow:0 4px 12px -6px rgba(46,34,25,.5); transition:transform .3s var(--yay), background-color .25s, color .25s}
.fav svg{width:19px; height:19px}
.fav[aria-pressed="true"]{color:#C8384B}
@media (hover:hover){ .fav:hover{transform:scale(1.08); background:#fff} }
.fav.zipla{animation:zipla .45s var(--yay)}
@keyframes zipla{0%{transform:scale(1)}40%{transform:scale(1.3)}100%{transform:scale(1)}}
.fav-buyuk{top:20px; right:20px; width:48px; height:48px}
.fav-buyuk svg{width:22px; height:22px}
@media (max-width:760px){ .fav{top:8px; right:8px; width:36px; height:36px} .fav svg{width:17px; height:17px} .fav-buyuk{top:14px; right:14px; width:44px; height:44px} }

/* ---------- Rozetler ---------- */
.kart-foto .rozetler{position:absolute; left:14px; top:14px; right:60px; display:flex; flex-wrap:wrap; gap:6px}
.kart-foto .rozetler .rozet{position:static; background:var(--fildisi)}
.kart-foto .rozetler .rozet-koyu{background:var(--murekkep)}
.rozet-bronz{background:var(--bronz); color:var(--fildisi)}
.rozet-altin{background:var(--sampanya); color:var(--murekkep)}
.kart-foto .rozetler .rozet-bronz{background:var(--bronz)}
.kart-foto .rozetler .rozet-altin{background:var(--sampanya)}
@media (max-width:760px){ .kart-foto .rozetler{left:10px; top:10px; right:50px; gap:4px} .kart-foto .rozetler .rozet{padding:4px 10px; font-size:11px} }

/* ---------- Sıralama ---------- */
.sira select{height:46px; padding:0 40px 0 18px; border:1px solid var(--kum); border-radius:999px; background:var(--krem) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232E2219' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center/16px; color:var(--murekkep); font:inherit; font-size:14px; appearance:none; -webkit-appearance:none; cursor:pointer}
@media (max-width:760px){ .sira{flex:1} .sira select{width:100%; height:42px} .filtre-sag .gecis{flex:1; justify-content:center} }

/* ---------- Ürün sayfası ekleri ---------- */
.kod-satir{display:flex; align-items:center; justify-content:space-between; gap:12px}
.paylas{display:inline-flex; align-items:center; gap:6px; height:36px; padding:0 14px; border:1px solid var(--kum); border-radius:999px; background:transparent; font-size:13px; color:var(--tas); transition:background-color .25s, color .25s}
.paylas svg{width:16px; height:16px}
@media (hover:hover){ .paylas:hover{background:var(--krem); color:var(--murekkep)} }
.galeri-ana{position:relative}
.takim{padding:32px}
.takim .btn-wa{white-space:nowrap}
.izgara-4{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
@media (max-width:760px){ .takim{padding:20px 16px; border-radius:var(--r-md)} .takim .bolum-bas{margin-bottom:12px} .takim .bolum-bas .btn{width:100%} .izgara-4{grid-template-columns:repeat(2,minmax(0,1fr))} }
.yapiskan{position:fixed; left:0; right:0; bottom:0; z-index:34; background:rgba(251,248,243,.96); backdrop-filter:blur(10px); border-top:1px solid var(--kum); transform:translateY(110%); transition:transform .4s var(--yay)}
.yapiskan.acik{transform:none}
.yapiskan-ic{display:flex; align-items:center; gap:16px; padding:10px 0}
.yapiskan-foto{flex:0 0 52px; width:52px; height:52px; border-radius:12px; overflow:hidden; background:var(--krem); display:flex; align-items:center; justify-content:center}
.yapiskan-foto img{width:100%; height:100%; object-fit:cover}
.yapiskan-foto img.ph{width:50%; height:auto}
.yapiskan-ad{flex:1; min-width:0; display:flex; flex-direction:column; font-size:16px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.yapiskan-ad small{font-size:13px; color:var(--tas)}
@media (max-width:760px){ .yapiskan{display:none} }

/* ---------- Yukarı çık ---------- */
.yukari{position:fixed; right:24px; bottom:92px; z-index:30; width:44px; height:44px; display:flex; align-items:center; justify-content:center; border:1px solid var(--kum); border-radius:50%; background:var(--fildisi); color:var(--murekkep); box-shadow:0 10px 24px -14px rgba(46,34,25,.5); opacity:0; pointer-events:none; transform:translateY(8px); transition:opacity .3s, transform .3s var(--yay)}
.yukari svg{width:18px; height:18px}
.yukari.acik{opacity:1; pointer-events:auto; transform:none}
@media (max-width:760px){ .yukari{right:16px; bottom:calc(var(--alt-bar) + 12px); width:40px; height:40px} }

/* ---------- İnce ayarlar ---------- */
@media (max-width:760px){
  .filtre-sag{flex-wrap:wrap; gap:10px}
  .filtre-sag .sayac{width:100%}
  .filtre-sag .gecis{white-space:nowrap; padding:0 14px 0 6px; font-size:13px}
  .filtre-sag .gecis .kutucuk{width:26px; height:26px}
  .kart-foto .rozetler .rozet:nth-child(n+3){display:none}
}

/* ======================================================
   Luna Pırlanta'dan uyarlanan ekler: kayan duyuru, popüler kategoriler,
   atölye bandı, rehber, önceki/sonraki model, taş tablosu, ölçü rehberi
   ====================================================== */

/* ---------- Kayan duyuru bandı ---------- */
.duyuru{overflow:hidden}
.duyuru-kaydir{display:flex; width:max-content}
.duyuru-grup{display:flex; flex:0 0 auto}
.duyuru-grup a{display:inline-block; padding:8px 28px; white-space:nowrap; position:relative}
.duyuru-grup a::after{content:""; position:absolute; right:0; top:50%; width:3px; height:3px; margin-top:-1.5px; border-radius:50%; background:var(--sampanya)}
@media (prefers-reduced-motion:no-preference){
  .duyuru-kaydir{animation:kay 40s linear infinite}
  .duyuru:hover .duyuru-kaydir{animation-play-state:paused}
}
@keyframes kay{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (max-width:760px){ .duyuru a{white-space:nowrap; overflow:visible; text-overflow:clip} .duyuru-grup a{padding:7px 20px} }

/* ---------- Popüler kategoriler ---------- */
.pop-izgara{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px}
.pop-kart{display:flex; align-items:center; gap:14px; padding:10px 16px 10px 10px; border:1px solid var(--kum); border-radius:var(--r-sm); background:var(--fildisi); transition:transform .3s var(--yay), box-shadow .3s, border-color .3s}
.pop-kart img{flex:0 0 64px; width:64px; height:64px; border-radius:12px; object-fit:cover; background:var(--krem)}
.pop-kart img.ph{width:64px; height:64px; padding:14px}
.pop-metin{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px}
.pop-metin b{font-weight:500; font-size:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.pop-metin small{font-size:12.5px; color:var(--tas)}
.pop-kart > svg{width:18px; height:18px; flex:0 0 auto; color:var(--tas); transition:transform .3s var(--yay)}
@media (hover:hover){ .pop-kart:hover{transform:translateY(-2px); border-color:var(--sampanya); box-shadow:0 16px 28px -22px rgba(46,34,25,.5)} .pop-kart:hover > svg{transform:translateX(3px)} }
@media (max-width:1080px){ .pop-izgara{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:760px){ .pop-izgara{grid-template-columns:1fr 1fr; gap:8px} .pop-kart{gap:10px; padding:8px 10px 8px 8px} .pop-kart img{flex-basis:52px; width:52px; height:52px} .pop-metin b{font-size:13.5px; white-space:normal; line-height:1.25} .pop-kart > svg{display:none} }

/* ---------- Atölye bandı ---------- */
.usta-band{display:flex; flex-wrap:wrap; overflow:hidden; min-height:420px}
.usta-metin{flex:1 1 420px; min-width:0; padding:48px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:16px}
.usta-metin h2{max-width:520px; font-size:clamp(30px,3.2vw,44px)}
.usta-metin p{max-width:440px; font-size:17px; color:var(--kum); font-weight:300; line-height:1.6}
.usta-metin .btnler{display:flex; flex-wrap:wrap; gap:8px; margin-top:8px}
.usta-gorsel{flex:1 1 400px; min-width:0; min-height:320px; position:relative}
.usta-gorsel img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
@media (max-width:760px){ .usta-band{border-radius:var(--r-md); min-height:0} .usta-metin{padding:24px; order:2} .usta-metin p{font-size:15px} .usta-gorsel{flex-basis:100%; min-height:220px; order:1} .usta-metin .btnler .btn{flex:1} }

/* ---------- Rehber ---------- */
.rehber{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
.rehber-kart{padding:0; border-radius:var(--r-md); overflow:hidden}
.rehber-kart summary{list-style:none; cursor:pointer; padding:20px 24px; display:flex; align-items:center; gap:14px; position:relative}
.rehber-kart summary::-webkit-details-marker{display:none}
.rehber-kart summary::after{content:""; position:absolute; right:24px; top:50%; width:10px; height:10px; margin-top:-7px; border-right:1.5px solid var(--murekkep); border-bottom:1.5px solid var(--murekkep); transform:rotate(45deg); transition:transform .3s}
.rehber-kart[open] summary::after{transform:rotate(-135deg); margin-top:-2px}
.rehber-kart summary h3{font-size:18px; font-weight:400; padding-right:28px}
.rehber-kart summary .rozet{flex:0 0 auto; background:var(--fildisi)}
.rehber-kart p{padding:0 24px 22px; font-size:15px}
@media (max-width:760px){ .rehber{grid-template-columns:1fr; gap:8px} .rehber-kart summary{padding:16px} .rehber-kart summary h3{font-size:16px} .rehber-kart p{padding:0 16px 16px} }

/* ---------- Önceki / sonraki model ---------- */
.gezin{display:flex; justify-content:space-between; gap:16px; padding:0 0 20px}
.gezin-a{display:flex; align-items:center; gap:12px; max-width:48%; min-width:0; color:var(--tas); transition:color .25s}
.gezin-a.sag{text-align:right; margin-left:auto}
.gezin-ok{flex:0 0 36px; width:36px; height:36px; display:flex; align-items:center; justify-content:center; border:1px solid var(--kum); border-radius:50%; transition:background-color .25s, border-color .25s}
.gezin-ok svg{width:16px; height:16px}
.gezin-ad{display:flex; flex-direction:column; min-width:0}
.gezin-ad small{font-size:12px; letter-spacing:.04em}
.gezin-ad b{font-weight:400; font-size:14px; color:var(--murekkep); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
@media (hover:hover){ .gezin-a:hover{color:var(--murekkep)} .gezin-a:hover .gezin-ok{background:var(--murekkep); border-color:var(--murekkep); color:var(--fildisi)} }
@media (max-width:760px){ .gezin{padding-bottom:16px} .gezin-ad b{display:none} .gezin-ad small{font-size:13px; color:var(--murekkep)} }

/* ---------- Taş tablosu ---------- */
.tas-tablo{border:1px solid var(--kum); border-radius:var(--r-sm); overflow:hidden}
.tas-bas{padding:12px 16px; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--altin); background:var(--krem)}
.tas-kaydir{overflow-x:auto}
.tas-tablo table{width:100%; border-collapse:collapse; font-size:14px}
.tas-tablo th,.tas-tablo td{padding:10px 14px; text-align:left; white-space:nowrap}
.tas-tablo th{font-weight:500; font-size:12.5px; color:var(--tas); border-bottom:1px solid var(--kum)}
.tas-tablo tbody tr + tr td{border-top:1px solid var(--kum)}
.tas-not{padding:10px 16px; font-size:13px; color:var(--tas); border-top:1px solid var(--kum)}

/* ---------- Yüzük ölçü rehberi ---------- */
.olcu{border:1px solid var(--kum); border-radius:var(--r-sm); overflow:hidden}
.olcu summary{list-style:none; cursor:pointer; padding:14px 16px; display:flex; align-items:center; gap:10px; font-size:15px}
.olcu summary::-webkit-details-marker{display:none}
.olcu summary > svg:first-child{width:20px; height:20px; color:var(--altin); flex:0 0 auto}
.olcu summary span{flex:1}
.olcu summary > svg:last-child{width:18px; height:18px; transition:transform .3s}
.olcu[open] summary > svg:last-child{transform:rotate(180deg)}
.olcu-ic{padding:0 16px 16px; display:flex; flex-direction:column; gap:14px; align-items:flex-start}
.olcu-ic p{font-size:14px}
.olcu-tablo{width:100%; display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:6px}
.olcu-tablo div{padding:8px 4px; display:flex; flex-direction:column; align-items:center; gap:2px; background:var(--krem); border-radius:10px}
.olcu-tablo b{font-weight:500; font-size:15px}
.olcu-tablo small{font-size:11px; color:var(--tas)}
@media (max-width:760px){ .olcu-tablo{grid-template-columns:repeat(4,minmax(0,1fr))} }

/* ======================================================
   Atasay'dan uyarlanan ekler: hediye rehberi, SSS, footer sütunları
   ====================================================== */
.hediye-izgara{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px}
.hediye-kart{display:flex; align-items:center; gap:16px; padding:18px 20px; border-radius:var(--r-md); transition:transform .3s var(--yay), box-shadow .3s}
.hediye-ik{flex:0 0 52px; width:52px; height:52px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--fildisi); color:var(--altin)}
.hediye-ik svg{width:24px; height:24px}
.hediye-ad{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px}
.hediye-ad b{font-weight:500; font-size:17px}
.hediye-ad small{font-size:13px; color:var(--tas)}
.hediye-kart > svg{width:18px; height:18px; color:var(--tas); flex:0 0 auto; transition:transform .3s var(--yay)}
@media (hover:hover){ .hediye-kart:hover{transform:translateY(-3px); box-shadow:0 20px 32px -24px rgba(46,34,25,.5)} .hediye-kart:hover > svg{transform:translateX(3px)} }
@media (max-width:1080px){ .hediye-izgara{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:760px){ .hediye-izgara{grid-template-columns:1fr; gap:8px} .hediye-kart{padding:14px 16px; border-radius:var(--r-sm)} .hediye-ik{flex-basis:44px; width:44px; height:44px} .hediye-ad b{font-size:15px} }

.sss{padding-top:16px; display:flex; flex-direction:column; gap:10px}
.sss-bas{font-size:22px; padding:28px 0 6px; font-weight:400}
.sss-bas:first-child{padding-top:0}
.sss .rehber-kart p a{text-decoration:underline; text-underline-offset:4px; text-decoration-color:var(--sampanya)}
.sss .olcu-tablo{width:auto}
@media (max-width:760px){ .sss-bas{font-size:19px; padding-top:20px} }

.olcu-yazi{font-size:13px; padding-top:4px; border-top:1px dashed var(--kum); width:100%}
.alt-ust{gap:40px 48px}
@media (max-width:1080px){ .alt-sutun{flex:1 1 40%} }
@media (max-width:760px){ .nav-hap a{padding:0 16px} }
@media (max-width:1180px) and (min-width:1081px){ .nav-hap a{padding:0 14px; font-size:13.5px} }