:root{
  --yazi:#3d454e;          /* gövde + başlık rengi (61,69,78) */
  --bag:#334862;           /* bağlantı / ürün adı (51,72,98) */
  --ust:#b2baa4;           /* üst çubuk adaçayı yeşili */
  --kirli:#f6f7f4;         /* açık bölüm zemini */
  --pudra:#faf4f4;         /* ustalar zemini */
  --alt:#333;              /* alt bilgi */
  --alt2:#222;             /* en alt şerit */
  --yildiz:#f7b603;
  --ig-mavi:#408bd1;
  --f-baslik:"Josefin Sans",sans-serif;
  --f-govde:"Lato","Carlito",sans-serif;
  --kap:1050px;            /* içerik genişliği (195 → 1245) */
  --ust-h:83px;
  --kahraman-h:720px;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font:16px/1.6 var(--f-govde);color:var(--yazi);background:#fff;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:var(--bag)}
p{margin:0 0 20px}
.kap{width:var(--kap);margin:0 auto}
.orta{text-align:center}

/* --- ortak başlık + çizgi --- */
.bas{font:700 33.28px/1.3 var(--f-baslik);margin:0;text-transform:uppercase;letter-spacing:0}
.bas.b{font-size:35.36px}
.bas.k{font-size:25.6px}
.cizgi{width:60px;height:3px;background:var(--yazi);margin:13px auto 19px}
.kas{font:700 10.4px/1 var(--f-baslik);letter-spacing:1.6px;text-transform:uppercase;margin:0 0 6px}

.dg{display:inline-block;font:700 15.52px/24.8px var(--f-govde);letter-spacing:.4656px;text-transform:uppercase;
  text-decoration:none;color:#fff;background:var(--pembe);padding:5px 12px;border:0;cursor:pointer;
  transition:box-shadow .3s,opacity .3s,background .3s}
.dg:hover{box-shadow:inset 0 0 0 100px rgba(0,0,0,.2)}

/* =========== ÜST ÇUBUK =========== */
.ust{position:sticky;top:0;z-index:20;height:var(--ust-h);background:var(--ust);display:flex;align-items:center;justify-content:space-between;padding:0 17px 0 17px}
.menu{display:flex;align-items:center;gap:8px;color:#fff;font:700 12.8px/1 var(--f-govde);letter-spacing:.64px;text-transform:uppercase;text-decoration:none}
.menu svg{width:20px;height:16px}
.logo{position:absolute;left:50%;top:0;transform:translateX(-50%);width:88px;height:130px;background:#fff;
  clip-path:polygon(0 0,100% 0,100% 100%,50% 88%,0 100%);display:flex;flex-direction:column;align-items:center;padding-top:6px;text-decoration:none}
.logo .muhur{width:48px;height:48px;border-radius:50%;border:2px solid #6b6f68;display:grid;place-items:center;font:700 26px/1 var(--f-baslik);color:#6b6f68;background:#e9ebe6}
.logo b{font:700 13px/1 var(--f-baslik);color:#4c4f4b;letter-spacing:.5px;margin-top:11px}
.logo i{font:italic 9px/1.15 Georgia,serif;color:#9a9c98;text-align:center;margin-top:3px;letter-spacing:.6px}
.sag{display:flex;align-items:center;color:#fff;font:700 13px/1 var(--f-govde)}
.sag .kisi{width:18px;height:18px;margin-right:20px}
.sag .ayr{width:1px;height:30px;background:rgba(255,255,255,.25);margin-right:19px}
.sag .sepet{margin-left:10px;border:2px solid #fff;width:28px;height:30px;display:grid;place-items:center;font-size:13px;position:relative}
.sag .sepet::before{content:"";position:absolute;top:-8px;left:7px;width:10px;height:8px;border:2px solid #fff;border-bottom:0;border-radius:6px 6px 0 0}

.sag a{color:inherit;text-decoration:none}
/* =========== KAHRAMAN =========== */
.kahraman::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.32)}
.kahraman>*{position:relative}
.kahraman h1{margin:0;font:700 32px/27.2px var(--f-baslik);letter-spacing:.8px;text-transform:uppercase;text-shadow:0 1px 3px rgba(0,0,0,.4)}
.kahraman h4{margin:18px 0 0;font:700 24px/28.8px var(--f-baslik);letter-spacing:1.2px;text-transform:uppercase;text-shadow:0 1px 3px rgba(0,0,0,.4)}
.kahraman .dg{margin-top:22px;padding:5px 12px}

/* =========== TANITIM =========== */
.tanitim{padding:68px 0 31px}
.tanitim .metin{width:600px;margin:0 auto}
.tanitim .fiyat-bas{font-weight:700;font-size:15px;margin:33px 0 21px}


/* =========== YORUMLAR =========== */
.yorum{background:var(--kirli);padding:66px 0 74px}
.puan{display:flex;justify-content:center;align-items:baseline;gap:10px;margin:2px 0 14px}
.puan b{font:400 32px/38.4px var(--f-govde);color:#000}
.puan .y{color:var(--yildiz);font:400 26px/1 Arial,sans-serif;letter-spacing:1px}
.puan a{color:#70757a;font-size:14px;text-decoration:none}
.yorum .kim{font-weight:700;color:#000;margin-top:10px;line-height:22.4px}
.yorum .ne{color:#70757a;font-size:13px;line-height:19px}
.yorum .ne span{color:var(--yildiz);font-size:13px;letter-spacing:1px;margin-right:6px}
.yorum .kaynak{font-size:13px;color:#70757a;margin:14px 0 6px}
.yorum .kaynak b{color:#4285f4;font-weight:700}

/* =========== TAKİP (ızgara) =========== */
.takip{background:var(--kirli);padding:75px 0 70px}
.profil{display:flex;align-items:center;margin:28px 0 20px;height:40px}
.profil span{width:40px;height:40px;border-radius:50%;background:#2b2a28;border:3px solid #e4e2dc;display:grid;place-items:center;color:#d7c9b0;font:700 15px/1 var(--f-baslik)}
.profil h3{flex:1;text-align:center;margin:0;font:700 16px/20.8px var(--f-baslik);padding-right:40px}
.izgara{display:grid;grid-template-columns:repeat(3,343px);gap:10px}
.izgara a{position:relative;aspect-ratio:1;overflow:hidden;display:block}
.izgara img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.izgara a::before{content:"";position:absolute;inset:0;z-index:1;background:rgba(0,0,0,0);transition:background .3s}
.izgara a:hover::before{background:rgba(0,0,0,.35)}
.izgara a:hover img{transform:scale(1.05)}
.ig-dg{display:flex;justify-content:center;gap:8px;margin-top:16px}
.ig-dg a{font:700 13px/19.5px var(--f-govde);letter-spacing:.39px;text-transform:uppercase;padding:7px 14px;border-radius:4px;color:#fff;background:#333;text-decoration:none}
.ig-dg a.m{background:var(--ig-mavi);text-transform:none;font-weight:400;letter-spacing:0}
.ig-dg a:hover{box-shadow:inset 0 0 0 100px rgba(0,0,0,.15)}

/* =========== KISA ÇAĞRI =========== */
.cagri{background:var(--kirli);padding:75px 0 61px}
.cagri p{margin:0 0 20px}
.cagri p:last-child{margin:0}

/* =========== USTALAR =========== */
.ustalar{background:var(--pudra);padding:75px 0 92px}
.ustalar .metin{width:600px;margin:0 auto}
.usta-sira{display:flex;justify-content:center;gap:70px;margin-top:0}
.usta-sira+.usta-sira{margin-top:56px}
.usta{width:200px;text-align:center}
.usta .yuv{width:200px;height:200px;border-radius:50%;overflow:hidden;background:#ddd}
.usta img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.usta:hover img{transform:scale(1.08)}
.usta h3{margin:14px 0 0;font:700 23px/36.8px var(--f-baslik);color:var(--yazi)}
.ustalar .usta-sira:first-of-type{margin-top:54px}



/* =========== KONUM =========== */
.konum{padding:75px 0 76px}
.konum .adr{margin:0 0 18px}
.konum .adr b{display:block}
.konum .adr a{font-weight:700}

/* =========== HİZMETLER =========== */
.hizmet{background:var(--kirli);padding:75px 0 82px}
.hizmet h3{margin:0;font:700 20px/32px var(--f-baslik);text-transform:uppercase}
.hizmet p{margin:10px 0 14px}



/* =========== ALT BİLGİ =========== */
.alt{background:var(--alt);color:#f1f1f1;padding:30px 0 30px}
.alt .ic{width:var(--kap);margin:0 auto;display:grid;grid-template-columns:510px 510px;column-gap:30px}
.alt h3{margin:0;font:700 20px/32px var(--f-baslik);color:#fff}
.alt h4{margin:0 0 10px;font:700 13.6px/14.28px var(--f-baslik);letter-spacing:.68px;text-transform:uppercase;color:#fff}
.alt h5{margin:0 0 6px;font:700 16px/25.6px var(--f-baslik);color:#fff;text-transform:uppercase}
.alt p{font-size:13px;line-height:20.8px;margin:0 0 14px;color:#f1f1f1}
.alt a{color:#f1f1f1;text-decoration:none}
.alt a.ilet{display:inline-block;font:700 13.6px/14.28px var(--f-baslik);letter-spacing:.68px;text-transform:uppercase;color:#fff}
.saat{width:100%;border-collapse:collapse;font-size:14.4px;line-height:18.72px}
.saat td{padding:8px 0 7px;border-bottom:1px solid rgba(255,255,255,.1);color:#f1f1f1}
.saat td:first-child{width:216px}
.altalt{background:var(--alt2);color:rgba(255,255,255,.8);font-size:14.4px;line-height:23.04px;padding:12px 0 16px}
.altalt .ic{width:var(--kap);margin:0 auto;display:flex;justify-content:space-between;align-items:flex-start}
.altalt a{color:rgba(255,255,255,.8)}
.altalt b{font-weight:700}

@media (max-width:849px){
  :root{--kap:360px;--ust-h:70px;--kahraman-h:332px}
  .menu span{display:none}
  .menu svg{width:22px;height:18px}
  .sag .kisi,.sag .ayr,.sag .tutar{display:none}
  .sag .sepet{width:26px;height:28px;margin:0}
  .kahraman{background-position:center 30%}
  .kahraman h1{font-size:22px;line-height:18.7px;letter-spacing:.55px}
  .kahraman h4{font-size:16.5px;line-height:19.8px;letter-spacing:.825px;margin-top:14px}
  .kahraman .dg{font-size:10.67px;line-height:17px;padding:4px 13px;margin-top:20px}
  .bas{font-size:24.96px;line-height:32.448px}
  .bas.b{font-size:29.12px;line-height:37.856px;width:240px;margin:0 auto}
  .bas.k{font-size:19.2px;line-height:24.96px}
  .tanitim{padding:72px 0 30px}
  .tanitim .metin{width:360px}
  .tanitim .fiyat-bas{margin:30px 0 21px}
  .yorum{padding:72px 0 102px}
  .yorum .kaynak{margin:34px 0 20px}
  .puan{flex-wrap:wrap;width:200px;margin:2px auto 14px;row-gap:0}
  .puan a{flex-basis:100%;text-align:center}
  .takip{padding:72px 0 40px}
  .profil{width:295px;height:48px;margin:28px auto 28px}
  .profil span{width:48px;height:48px}
  .izgara{grid-template-columns:295px;justify-content:center}
  .cagri{padding:72px 0 80px}
  .ustalar{padding:72px 0 140px}
  .usta-sira{flex-direction:column;align-items:center;gap:74px;margin-top:57px}
  .usta-sira+.usta-sira{margin-top:74px}
  .usta h3{font-size:18.4px;line-height:29.44px;margin-top:12px}
  .konum{padding:72px 0 89px}
  .hizmet{padding:72px 0 60px}
  .hizmet h3{font-size:16px;line-height:25.6px}
  .hizmet p{margin:10px 0 30px}
  .alt{padding:30px 0 61px}
  .alt .ic{grid-template-columns:360px;row-gap:54px}
  .alt h3+h4{margin:8px 0 18px}
  .altalt{font-size:16px;padding:20px 0 24px}
  .alt h3{font-size:16px;line-height:25.6px}
  .saat td:first-child{width:120px}
  .altalt .ic{flex-direction:column-reverse;text-align:center;align-items:center}
}
