/* ============================================================
   BF Kuaför — site.css
   Krem zemin · koyu mürdüm · editoryal serif başlıklar
   ============================================================ */
:root{
  --plum:#8e3b52;          /* panelden değişir */
  --ink:#2d2226;
  --muted:#8a7580;
  --cream:#faf6f2;
  --cream2:#f3eae4;
  --card:#ffffff;
  --line:#e9dcd4;
  --gold:#c39a6b;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Jost',system-ui,sans-serif;background:var(--cream);color:var(--ink);line-height:1.6}
h1,h2,h3,.brand{font-family:'Playfair Display',Georgia,serif}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

.btn{display:inline-block;background:var(--plum);color:#fff;padding:.72rem 1.5rem;border-radius:999px;
  font-weight:500;letter-spacing:.4px;border:1px solid var(--plum);transition:.2s}
.btn:hover{filter:brightness(1.12)}
.btn.big{padding:.95rem 2.2rem;font-size:1.05rem}
.btn.line{background:transparent;color:var(--plum)}
.btn.invert{background:#fff;color:var(--plum);border-color:#fff}

/* ---------- NAV ---------- */
.nav{position:sticky;top:0;z-index:50;background:rgba(250,246,242,.92);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line)}
.nav-in{max-width:1180px;margin:0 auto;padding:.85rem 5vw;display:flex;align-items:center;gap:1.6rem}
.brand{font-size:1.45rem;font-weight:700;letter-spacing:.5px;color:var(--plum);margin-right:auto}
.links{display:flex;gap:1.5rem}
.links a{font-size:.98rem;color:var(--ink);opacity:.85}
.links a:hover{color:var(--plum);opacity:1}
.ham{display:none;background:none;border:0;cursor:pointer;padding:6px}
.ham span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0}
.mobile-menu{display:none}
@media(max-width:820px){
  .links,.nav-in>.btn{display:none}
  .ham{display:block}
  .mobile-menu{display:none;flex-direction:column;gap:1.1rem;padding:1.4rem 6vw 1.8rem;border-top:1px solid var(--line)}
  body.menu-open .mobile-menu{display:flex}
  .mobile-menu a{font-size:1.1rem}
  .mobile-menu .btn{text-align:center}
}

/* ---------- HERO ---------- */
.hero{max-width:1180px;margin:0 auto;padding:4.5rem 5vw 5rem;display:grid;
  grid-template-columns:1.05fr .95fr;gap:3.5rem;align-items:center}
.eyebrow{font-size:.8rem;letter-spacing:3.5px;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:1rem}
.hero h1{font-size:clamp(2.4rem,5vw,4rem);line-height:1.12;font-weight:700}
.hero p{margin-top:1.2rem;font-size:1.12rem;color:var(--muted);max-width:34rem;font-weight:300}
.hero-cta{margin-top:2rem;display:flex;gap:.8rem;flex-wrap:wrap}
.hero-vis img{border-radius:46% 54% 52% 48% / 42% 44% 56% 58%;aspect-ratio:4/4.6;object-fit:cover;
  box-shadow:0 30px 70px rgba(142,59,82,.18)}
.hero-ph{border-radius:46% 54% 52% 48% / 42% 44% 56% 58%;aspect-ratio:4/4.6;
  background:linear-gradient(150deg,var(--cream2),#ecd9d0 55%,#e6c9c4);display:flex;align-items:center;justify-content:center}
.hero-ph span{font-size:4rem;color:var(--plum);opacity:.35}
@media(max-width:820px){.hero{grid-template-columns:1fr;padding-top:2.6rem;text-align:center}
  .hero p{margin-left:auto;margin-right:auto}.hero-cta{justify-content:center}
  .hero-vis{order:-1;max-width:320px;margin:0 auto}}

/* Google rozeti */
.g-badge{display:inline-flex;align-items:center;gap:.55rem;margin-top:1.6rem;background:#fff;
  border:1px solid var(--line);border-radius:999px;padding:.5rem 1.1rem;font-size:.95rem}
.g-badge.center{margin:1.2rem auto 0}
.g-logo{width:26px;height:26px;border-radius:50%;background:conic-gradient(#4285F4 0 25%,#34A853 0 50%,#FBBC05 0 75%,#EA4335 0);
  color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;font-family:'Jost';font-size:.95rem}
.g-badge b{font-size:1.05rem}
.stars{color:#f5a623;letter-spacing:1px}
.g-cnt{color:var(--muted);font-size:.88rem}

/* ---------- SECTIONS ---------- */
.sec{max-width:1180px;margin:0 auto;padding:4.5rem 5vw}
.sec.alt{max-width:none;background:var(--cream2)}
.sec.alt>*{max-width:1180px;margin-left:auto;margin-right:auto}
.sec-head{text-align:center;margin-bottom:2.6rem}
.sec-head.left{text-align:left}
.sec-head h2{font-size:clamp(1.9rem,3.4vw,2.6rem);font-weight:700}
.sec-cta{text-align:center;margin-top:2.4rem}

/* Hizmetler */
.svc-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2.4rem 3.5rem}
.svc-col h3{font-size:1.3rem;color:var(--plum);margin-bottom:1.1rem;font-weight:700}
.svc-row{display:flex;align-items:baseline;gap:.7rem;padding:.62rem 0;border-bottom:1px solid var(--line)}
.svc-n{font-weight:500}
.svc-t{display:block;font-size:.8rem;color:var(--muted);font-weight:400}
.svc-dots{flex:1;border-bottom:2px dotted #d8c6bc;transform:translateY(-6px)}
.svc-p{font-weight:600;color:var(--plum);white-space:nowrap}

/* Hakkımızda */
.about{max-width:820px}
.about-txt{font-size:1.12rem;color:#5c4a52;font-weight:300}

/* Ekip */
.team{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:2rem}
.member{text-align:center}
.m-photo{width:180px;height:180px;border-radius:50%;overflow:hidden;margin:0 auto 1rem;
  border:4px solid #fff;box-shadow:0 14px 34px rgba(142,59,82,.16)}
.m-photo img{width:100%;height:100%;object-fit:cover}
.m-photo.ph{background:linear-gradient(150deg,var(--plum),#b56a80);display:flex;align-items:center;justify-content:center}
.m-photo.ph span{color:#fff;font-size:3rem;font-family:'Playfair Display'}
.m-n{font-weight:600;font-size:1.08rem}
.m-t{color:var(--muted);font-size:.92rem}
.m-ig{display:inline-block;margin-top:.3rem;color:var(--plum);font-size:.88rem}

/* Galeri */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:.9rem}
.gallery img{border-radius:16px;aspect-ratio:1/1.15;object-fit:cover;transition:.25s}
.gallery img:hover{transform:scale(1.02)}

/* Yorumlar */
.quotes{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1.4rem}
.quote{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:1.6rem}
.q-stars{color:#f5a623;letter-spacing:2px;margin-bottom:.7rem}
.quote blockquote{font-size:1rem;color:#4d3d44;font-weight:300;font-style:italic}
.quote figcaption{margin-top:1rem;display:flex;align-items:center;gap:.6rem;font-weight:500;font-size:.95rem}
.quote figcaption img{width:34px;height:34px;border-radius:50%}
.via-g{margin-left:auto;font-style:normal;font-size:.75rem;color:var(--muted);border:1px solid var(--line);
  border-radius:999px;padding:.15rem .6rem}

/* İletişim */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem}
@media(max-width:820px){.contact-grid{grid-template-columns:1fr}}
.c-line{margin:.5rem 0;font-size:1.04rem}
.c-line a{color:var(--plum)}
.socials{margin-top:1.4rem;display:flex;gap:.6rem;flex-wrap:wrap}
.soc{border:1px solid var(--plum);color:var(--plum);border-radius:999px;padding:.42rem 1rem;font-size:.92rem;transition:.2s}
.soc:hover{background:var(--plum);color:#fff}
.hours{max-width:420px}
.h-row{display:flex;justify-content:space-between;padding:.55rem 0;border-bottom:1px solid var(--line)}
.map{margin-top:2.6rem}
.map iframe{width:100%;height:340px;border:0;border-radius:20px}

/* CTA bandı + footer */
.cta-band{background:linear-gradient(135deg,var(--plum),#5f2438);color:#fff;text-align:center;padding:4rem 6vw}
.cta-band h2{font-size:clamp(1.7rem,3vw,2.4rem);margin-bottom:1.6rem}
footer{background:#241a1e;color:#cbb6be;text-align:center;padding:2.6rem 6vw}
.f-brand{font-family:'Playfair Display';font-size:1.4rem;color:#fff}
.f-links{margin:1rem 0;display:flex;gap:1.6rem;justify-content:center}
.f-links a:hover{color:#fff}
.f-copy{font-size:.85rem;opacity:.7}

/* ============================================================
   RANDEVU SİHİRBAZI
   ============================================================ */
.booking-body{background:var(--cream);min-height:100vh}
.booking-wrap{max-width:640px;margin:0 auto;padding:2.2rem 5vw 4rem}
.back{color:var(--muted);font-size:.95rem}
.booking-wrap h1{font-size:2rem;margin:.8rem 0 1.4rem;color:var(--plum)}
.steps{display:flex;gap:.4rem;margin-bottom:1.4rem}
.step{flex:1;text-align:center;font-size:.85rem;color:var(--muted);padding-bottom:.7rem;border-bottom:3px solid var(--line)}
.step span{display:block;font-weight:700;font-size:1rem}
.step.active{color:var(--plum);border-color:var(--plum)}
.step.done{color:var(--gold);border-color:var(--gold)}
.panel{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:1.6rem;
  box-shadow:0 18px 44px rgba(142,59,82,.08)}
.panel h3{font-size:1.2rem;margin-bottom:1rem}
.panel h4{font-size:.85rem;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin:1.1rem 0 .5rem}
.field{margin-bottom:.9rem}
.field label{display:block;font-size:.86rem;color:var(--muted);margin-bottom:.3rem}
.field input,.field textarea{width:100%;background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:.65rem .8rem;font-size:1rem;font-family:inherit;color:var(--ink)}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--plum)}
.opt{display:flex;justify-content:space-between;align-items:center;gap:.8rem;width:100%;text-align:left;
  background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:.85rem 1rem;margin-bottom:.6rem;
  cursor:pointer;font-family:inherit;font-size:1rem;color:var(--ink);transition:.15s}
.opt:hover{border-color:var(--plum)}
.opt small{color:var(--muted)}
.opt .price{color:var(--plum);font-weight:600;white-space:nowrap}
.opt .st-photo{width:46px;height:46px;border-radius:50%;object-fit:cover;flex:none}
.opt .st-ini{width:46px;height:46px;border-radius:50%;background:var(--plum);color:#fff;display:flex;
  align-items:center;justify-content:center;font-weight:700;flex:none}
.opt .st-main{flex:1}
.slot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:.5rem}
.slot{background:#fff;border:1.5px solid var(--line);border-radius:10px;padding:.55rem 0;text-align:center;
  cursor:pointer;font-family:inherit;font-size:.98rem;color:var(--ink)}
.slot:hover{border-color:var(--plum)}
.slot.sel{background:var(--plum);border-color:var(--plum);color:#fff;font-weight:600}
.b-actions{display:flex;justify-content:space-between;margin-top:1.2rem}
.btn.ghost{background:transparent;color:var(--muted);border-color:var(--line)}
.ok-box{text-align:center;padding:1.4rem 0}
.ok-box .big-ico{font-size:3rem}
.ok-box h3{color:var(--plum);margin:.6rem 0}
.sum{background:var(--cream2);border-radius:14px;padding:1rem 1.2rem;margin:.9rem 0;text-align:left}
.sum div{display:flex;justify-content:space-between;padding:.25rem 0;font-size:.98rem}
.sum span{color:var(--muted)}
.err-msg{color:#b3261e;font-size:.92rem;margin-top:.6rem}
.muted{color:var(--muted)}.mini{font-size:.85rem}

/* ============================================================
   10 KADIN KUAFÖRÜ TEMASI (theme.template: 1-10)
   Değişkenler: --cream(bg) --cream2(alt) --card --line --ink --muted --plum(vurgu) --gold
   ============================================================ */

/* 1 · Rosé — krem + mürdüm (varsayılan, üstteki tanımlar) */

/* 2 · Noir — koyu şıklık, pudra vurgu */
.tpl-2{--cream:#141013;--cream2:#1d171b;--card:#231b20;--line:#392c33;--ink:#f3e9ee;--muted:#b99faa;--plum:#e8a2b8;--gold:#d7b98c}
.tpl-2 .nav{background:rgba(20,16,19,.92)}
.tpl-2 .btn{color:#241318}
.tpl-2 .g-badge,.tpl-2 .quote,.tpl-2 .soc{background:var(--card)}
.tpl-2 .cta-band{background:linear-gradient(135deg,#3a232e,#241318)}
.tpl-2 .hero-ph{background:linear-gradient(150deg,#2a2026,#3a2a33)}

/* 3 · İpek — fildişi + altın, Cormorant zarafeti */
.tpl-3{--cream:#fbf8f1;--cream2:#f4edde;--line:#e8dcc4;--ink:#3a2f22;--muted:#98876c;--plum:#a8853c;--gold:#c9ab72}
.tpl-3 h1,.tpl-3 h2,.tpl-3 h3,.tpl-3 .brand{font-family:'Cormorant Garamond',Georgia,serif}
.tpl-3 .hero h1{font-weight:600;font-style:italic}
.tpl-3 .btn{border-radius:4px}

/* 4 · Lavanta — lila ferahlığı */
.tpl-4{--cream:#f7f4fb;--cream2:#efe9f7;--line:#e2d7ef;--ink:#332a44;--muted:#8d80a6;--plum:#7c5cbf;--gold:#b39ddb}
.tpl-4 .hero-ph{background:linear-gradient(150deg,#efe9f7,#ddd0f0)}

/* 5 · Terracotta — sıcak toprak, Montserrat modern */
.tpl-5{--cream:#faf4ee;--cream2:#f3e6da;--line:#ead6c4;--ink:#3d2c22;--muted:#a08571;--plum:#c05f33;--gold:#d99e6b}
.tpl-5 body,.tpl-5{font-family:'Montserrat',sans-serif}
.tpl-5 h1,.tpl-5 h2,.tpl-5 h3,.tpl-5 .brand{font-family:'Montserrat',sans-serif;font-weight:800;letter-spacing:-.5px}
.tpl-5 .btn{border-radius:12px}
.tpl-5 .hero-vis img,.tpl-5 .hero-ph{border-radius:24px;aspect-ratio:4/4.2}

/* 6 · Adaçayı — doğal yeşil sükunet */
.tpl-6{--cream:#f5f8f4;--cream2:#e9f0e7;--line:#d7e3d3;--ink:#2b382c;--muted:#7d907c;--plum:#4e7d58;--gold:#9dbb9a}
.tpl-6 .hero-ph{background:linear-gradient(150deg,#e9f0e7,#d3e2cf)}

/* 7 · Şampanya — ışıltılı nötr, italik hero */
.tpl-7{--cream:#faf6f0;--cream2:#f2eadf;--line:#e7dac8;--ink:#43362a;--muted:#a3907b;--plum:#b0813f;--gold:#d4b98a}
.tpl-7 .hero h1{font-style:italic;font-weight:500}
.tpl-7 .eyebrow{color:var(--plum)}
.tpl-7 .btn{border-radius:999px;letter-spacing:1.5px;text-transform:uppercase;font-size:.85rem;padding:.85rem 1.9rem}

/* 8 · Bordo — dramatik, güçlü kontrast */
.tpl-8{--cream:#fbf7f7;--cream2:#f4e9ea;--line:#e9d4d7;--ink:#33161d;--muted:#9c7680;--plum:#7a1f33;--gold:#b08790}
.tpl-8 .nav{border-bottom:2px solid var(--plum)}
.tpl-8 .hero h1{color:var(--plum)}
.tpl-8 .cta-band{background:linear-gradient(135deg,#7a1f33,#4a0f1e)}

/* 9 · Pudra — yumuşacık pembe, Nunito */
.tpl-9{--cream:#fdf5f6;--cream2:#f9e9ec;--line:#f0d8dd;--ink:#4a343b;--muted:#ab8f97;--plum:#d4718c;--gold:#e8a7b8}
.tpl-9 body,.tpl-9{font-family:'Nunito',sans-serif}
.tpl-9 h1,.tpl-9 h2,.tpl-9 h3,.tpl-9 .brand{font-family:'Nunito',sans-serif;font-weight:800}
.tpl-9 .btn,.tpl-9 .quote,.tpl-9 .panel{border-radius:26px}
.tpl-9 .hero-vis img,.tpl-9 .hero-ph{border-radius:38% 62% 55% 45% / 55% 45% 55% 45%}

/* 10 · Minimal — saf beyaz, siyah, keskin çizgiler */
.tpl-10{--cream:#ffffff;--cream2:#f6f6f6;--line:#e5e5e5;--ink:#111111;--muted:#8a8a8a;--plum:#111111;--gold:#999999}
.tpl-10 .btn{border-radius:0;background:#111;border-color:#111;letter-spacing:2px;text-transform:uppercase;font-size:.82rem}
.tpl-10 .brand{letter-spacing:4px;text-transform:uppercase;font-family:'Jost';font-weight:600}
.tpl-10 .hero h1{letter-spacing:-1.5px}
.tpl-10 .hero-vis img,.tpl-10 .hero-ph{border-radius:0}
.tpl-10 .eyebrow{color:#111}
.tpl-10 .quote,.tpl-10 .panel{border-radius:0}
.tpl-10 .cta-band{background:#111}

/* koyu tema (2) randevu sihirbazı uyumu */
.tpl-2.booking-body .field input,.tpl-2.booking-body .field textarea,
.tpl-2 .opt,.tpl-2 .slot{background:var(--card);color:var(--ink)}
