/* Basımhanem · Tasarım Stüdyosu sayfası (2026-09-23) — yalnızca .bh-studyo altında */
.bh-studyo { --st-olive:#2f3328; --st-acc:#BB3D16; --st-ink:#1f201c; --st-soft:#6b665d; --st-green:#2f6a3a;
  --st-line:rgba(47,51,40,.12); --st-tile:rgba(255,255,255,.86);
  --st-sh:0 1px 1px rgba(47,51,40,.05),8px 18px 40px -16px rgba(80,62,40,.2),30px 50px 80px -48px rgba(80,62,40,.22);
  font-family:'Work Sans',-apple-system,'Segoe UI',sans-serif; color:var(--st-ink); padding-bottom:60px; }
.bh-studyo *, .bh-studyo *::before, .bh-studyo *::after { box-sizing:border-box; }
.bh-studyo h1, .bh-studyo h2, .bh-studyo h3 { font-family:'Work Sans',sans-serif; font-weight:600; letter-spacing:-.02em; margin:0; }
.st-ust { display:flex; align-items:flex-end; gap:20px; flex-wrap:wrap; margin:10px 0 22px; }
.st-rozet { display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:600; padding:6px 12px; border-radius:99px; background:rgba(187,61,22,.09); color:var(--st-acc); }
.st-ust h1 { font-size:32px; margin-top:12px; line-height:1.15; }
.st-ust p { color:var(--st-soft); font-size:14.5px; margin:8px 0 0; max-width:640px; line-height:1.55; }
.st-hak { margin-left:auto; display:flex; align-items:center; gap:12px; padding:12px 16px; border-radius:18px; background:rgba(47,51,40,.05); font-size:12.5px; color:var(--st-soft); }
.st-hak b { display:block; color:var(--st-ink); font-size:14px; }
.st-hak .st-noktalar { display:flex; gap:5px; }
.st-hak .st-noktalar i { width:22px; height:6px; border-radius:6px; background:var(--st-olive); }
.st-hak .st-noktalar i.bos { background:rgba(47,51,40,.15); }

.st-izgara { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:24px; align-items:start; }
.st-kart { background:var(--st-tile); border:1px solid rgba(255,255,255,.95); border-radius:24px; box-shadow:var(--st-sh); padding:22px; }
.st-kart h2 { font-size:16px; display:flex; align-items:center; gap:10px; }
.st-urun-sec { display:inline-flex; padding:4px; border-radius:99px; background:rgba(47,51,40,.07); gap:4px; margin-bottom:16px; }
.st-urun-sec button { border:0; background:transparent; padding:9px 18px; border-radius:99px; font:inherit; font-size:13.5px; font-weight:600; color:#45423b; cursor:pointer; }
.st-urun-sec button[aria-pressed="true"] { background:#fff; color:var(--st-olive); box-shadow:0 4px 12px -6px rgba(0,0,0,.25); }
.st-etiket { display:block; font-size:12px; font-weight:600; color:var(--st-soft); margin:0 0 6px; }
.st-tarif { width:100%; min-height:92px; resize:vertical; padding:14px 16px; border-radius:16px; border:1px solid var(--st-line); background:#fff; font:inherit; font-size:15px; line-height:1.55; color:var(--st-ink); }
.st-tarif:focus, .st-alanlar input:focus, .st-sec select:focus { outline:none; border-color:var(--st-olive); box-shadow:0 0 0 3px rgba(47,51,40,.14); }
.st-oneriler { display:flex; flex-wrap:wrap; gap:8px; margin:10px 0 18px; }
.st-oneriler button { border:1px solid var(--st-line); background:#fff; border-radius:99px; padding:7px 12px; font:inherit; font-size:12.5px; color:#45423b; cursor:pointer; }
.st-oneriler button:hover { border-color:rgba(47,51,40,.35); }
.st-alanlar { display:grid; grid-template-columns:1fr 1fr; gap:12px 14px; }
.st-alanlar label { display:block; }
.st-alanlar input { width:100%; padding:11px 13px; border-radius:12px; border:1px solid var(--st-line); background:#fff; font:inherit; font-size:14px; color:var(--st-ink); }
.st-alanlar .st-genis { grid-column:1 / -1; }
.st-alt { display:flex; align-items:center; gap:14px; margin-top:18px; flex-wrap:wrap; }
.st-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:0; border-radius:999px; padding:13px 22px; font:inherit; font-size:14px; font-weight:600; cursor:pointer; text-decoration:none; transition:transform .15s, box-shadow .15s, background .15s; }
.st-btn svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.st-btn.birincil { background:var(--st-olive); color:#fff; box-shadow:0 12px 24px -14px rgba(47,51,40,.7); }
.st-btn.birincil:hover { background:#20241c; transform:translateY(-1px); }
.st-btn.ikincil { background:rgba(47,51,40,.07); color:var(--st-olive); }
.st-btn[disabled] { opacity:.55; cursor:not-allowed; transform:none; }
.st-not { font-size:12.5px; color:var(--st-soft); line-height:1.5; }
.st-hata { color:var(--st-acc); font-size:13px; min-height:18px; }

/* taslaklar */
.st-taslaklar { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-top:22px; }
.st-taslak { border-radius:22px; padding:14px; background:var(--st-tile); border:1px solid rgba(255,255,255,.95); box-shadow:var(--st-sh); cursor:pointer; transition:box-shadow .2s, transform .2s; position:relative; }
.st-taslak:hover { transform:translateY(-2px); }
.st-taslak[aria-pressed="true"] { box-shadow:0 0 0 2px var(--st-olive), var(--st-sh); }
.st-onizleme { position:relative; border-radius:16px; background:linear-gradient(150deg,#ece3d6,#dcd6c8); aspect-ratio:4/3; display:grid; place-items:center; overflow:hidden; }
.st-onizleme img { max-width:86%; max-height:86%; border-radius:4px; box-shadow:0 14px 24px -12px rgba(0,0,0,.45); user-select:none; -webkit-user-drag:none; pointer-events:none; }
.st-onizleme .st-kilit { position:absolute; right:10px; bottom:10px; display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:600; padding:5px 9px; border-radius:99px; background:rgba(31,32,28,.72); color:#fff; }
.st-onizleme .st-kilit svg { width:12px; height:12px; fill:none; stroke:currentColor; stroke-width:2; }
.st-yuz { display:inline-flex; background:rgba(47,51,40,.07); border-radius:99px; padding:3px; gap:2px; }
.st-yuz button { border:0; background:transparent; font:inherit; font-size:11px; font-weight:600; padding:4px 9px; border-radius:99px; cursor:pointer; color:#45423b; }
.st-yuz button[aria-pressed="true"] { background:var(--st-olive); color:#fff; }
.st-taslak-alt { display:flex; align-items:center; gap:8px; margin-top:12px; }
.st-taslak h3 { font-size:14px; margin:12px 2px 0; display:flex; align-items:center; gap:8px; }
.st-taslak h3 .st-secildi { margin-left:auto; font-size:11px; font-weight:600; padding:4px 9px; border-radius:99px; background:rgba(47,106,58,.1); color:var(--st-green); visibility:hidden; }
.st-taslak[aria-pressed="true"] h3 .st-secildi { visibility:visible; }
.st-taslak p { font-size:12.5px; color:var(--st-soft); margin:4px 2px 0; line-height:1.45; }
.st-iskelet .st-onizleme { background:linear-gradient(100deg,#ece6dc 30%,#f6f2ec 50%,#ece6dc 70%); background-size:300% 100%; animation:st-parilti 1.3s infinite linear; }
@keyframes st-parilti { from { background-position:100% 0; } to { background-position:-100% 0; } }
.st-guvence { display:flex; gap:10px; align-items:flex-start; margin-top:18px; padding:14px 16px; border-radius:16px; background:rgba(47,51,40,.05); font-size:12.5px; color:var(--st-soft); line-height:1.5; }
.st-guvence svg { width:18px; height:18px; flex-shrink:0; fill:none; stroke:var(--st-olive); stroke-width:1.7; }

/* sağ panel */
.st-yan { position:sticky; top:20px; display:grid; gap:16px; }
.st-teklif { position:relative; border:1.5px solid var(--st-olive); }
.st-teklif .st-serit { position:absolute; top:-11px; left:18px; font-size:10.5px; font-weight:700; letter-spacing:.08em; padding:4px 10px; border-radius:99px; background:var(--st-olive); color:#fff; }
.st-teklif .st-fiyat { font-size:26px; font-weight:600; letter-spacing:-.02em; margin-top:10px; }
.st-sec { display:grid; gap:10px; margin-top:14px; }
.st-sec select { width:100%; appearance:none; -webkit-appearance:none; padding:11px 36px 11px 13px; border-radius:12px; border:1px solid var(--st-line); background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236f6a62' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center/15px; font:inherit; font-size:13.5px; color:var(--st-ink); }
.st-tutar { display:flex; align-items:baseline; justify-content:space-between; margin-top:14px; font-size:13px; color:var(--st-soft); }
.st-tutar b { font-size:20px; color:var(--st-ink); letter-spacing:-.01em; }
.st-liste { list-style:none; padding:0; margin:12px 0 0; }
.st-liste li { display:flex; gap:8px; font-size:12.8px; padding:4px 0; line-height:1.45; }
.st-liste li svg { width:15px; height:15px; flex-shrink:0; margin-top:2px; fill:none; stroke:var(--st-green); stroke-width:2; }
.st-bos { text-align:center; padding:26px 18px; color:var(--st-soft); font-size:13px; line-height:1.55; }

/* giriş kutusu */
.st-giris { margin-top:16px; padding:18px; border-radius:18px; border:1px dashed rgba(47,51,40,.25); background:rgba(255,255,255,.6); }
.st-giris h3 { font-size:15px; }
.st-giris .st-alanlar { margin-top:12px; }
.st-giris .st-baglanti { background:none; border:0; padding:0; font:inherit; font-size:13px; color:var(--st-olive); font-weight:600; text-decoration:underline; cursor:pointer; }

/* hak bitti */
.st-bitti { margin-top:16px; padding:16px 18px; border-radius:18px; background:rgba(187,61,22,.06); border:1px solid rgba(187,61,22,.18); font-size:13.5px; line-height:1.55; }

@media (max-width:980px) {
  .st-izgara { grid-template-columns:minmax(0,1fr); }
  .st-yan { position:static; }
}
@media (max-width:640px) {
  .st-ust h1 { font-size:25px; }
  .st-hak { margin-left:0; width:100%; }
  .st-alanlar { grid-template-columns:1fr; }
  .st-taslaklar { grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:84%; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:8px; margin-left:-16px; margin-right:-16px; padding-left:16px; padding-right:16px; scrollbar-width:none; }
  .st-taslaklar::-webkit-scrollbar { display:none; }
  .st-taslak { scroll-snap-align:start; }
  .st-kart { padding:18px; border-radius:20px; }
}
/* mobil alt çubuk */
.st-mbar { display:none; }
@media (max-width:980px) {
  .st-mbar:not([hidden]) { display:flex; align-items:center; gap:12px; position:fixed; left:0; right:0; bottom:0; z-index:900;
    padding:12px 16px calc(12px + env(safe-area-inset-bottom)); background:rgba(251,248,243,.92); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
    border-top:1px solid rgba(47,51,40,.1); box-shadow:0 -12px 30px -18px rgba(40,30,20,.35); }
  .st-mbar-bilgi { flex:1; min-width:0; text-align:left; background:none; border:0; padding:0; font:inherit; color:var(--st-ink); cursor:pointer; }
  .st-mbar-bilgi span { display:block; font-size:12px; color:var(--st-soft); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .st-mbar-bilgi span.hata { color:var(--st-acc); white-space:normal; }
  .st-mbar-bilgi b { display:block; font-size:17px; font-weight:600; letter-spacing:-.01em; white-space:nowrap; }
  .st-mbar-bilgi b small { font-size:11.5px; font-weight:500; color:var(--st-soft); }
  .st-mbar-bilgi em { display:block; font-style:normal; font-size:11.5px; font-weight:600; color:var(--st-olive); text-decoration:underline; text-underline-offset:2px; margin-top:1px; }
  .st-mbar .st-btn { flex-shrink:0; padding:13px 18px; }
  body.st-mbar-var .bh-studyo { padding-bottom:110px; }
  body.st-mbar-var .bh-wa-destek, body.st-mbar-var .bh-ak-bubble { bottom:104px !important; }
  body.st-mbar-var .bh-ak-panel { bottom:170px !important; }
}
@media (prefers-reduced-motion:reduce) { .bh-studyo * { animation:none !important; transition:none !important; } }