/* HemenBegeni — kategori (paket seçme) sayfaları için görünüm katmanı.
   Platform sayfalarıyla (hbx/hbt/hby/hbs) aynı görsel dil. Yalnızca görünüm; sipariş akışına dokunmaz.
   hbc.js body'ye .hbc sınıfı ve data-hbp (instagram/tiktok/youtube/spotify/diger) ekler. */
body.hbc{--hc1:#eb534b;--hc2:#ff7a59;--hg:linear-gradient(120deg,#feda75 0%,#fa7e1e 22%,#d62976 50%,#962fbf 76%,#4f5bd5 100%);--hglow:rgba(214,41,118,.5);--hglow2:rgba(150,47,191,.5);--hink:#14152b}
body.hbc[data-hbp=tiktok]{--hc1:#fe2c55;--hc2:#ff5e7a;--hg:linear-gradient(120deg,#25f4ee 0%,#6c7bff 48%,#fe2c55 100%);--hglow:rgba(254,44,85,.45);--hglow2:rgba(37,244,238,.3)}
body.hbc[data-hbp=youtube]{--hc1:#ff0000;--hc2:#ff4e45;--hg:linear-gradient(120deg,#ff8a3d 0%,#ff0000 50%,#b3002d 100%);--hglow:rgba(255,0,0,.45);--hglow2:rgba(255,110,60,.3)}
body.hbc[data-hbp=spotify]{--hc1:#1db954;--hc2:#17a34a;--hg:linear-gradient(120deg,#b6f36b 0%,#1ed760 45%,#12a150 100%);--hglow:rgba(30,215,96,.38);--hglow2:rgba(18,161,80,.38)}

/* Üst bant: platform sayfasındaki koyu hero ile aynı */
body.hbc #intall .intall{position:relative;background:radial-gradient(520px circle at 92% -20%,var(--hglow),transparent 62%),radial-gradient(460px circle at -6% 135%,var(--hglow2),transparent 62%),#11122a!important;border-radius:26px!important;overflow:hidden;isolation:isolate;min-height:176px;box-shadow:0 24px 60px rgba(17,18,42,.18)}
body.hbc #intall .introBG{display:none!important}
body.hbc #intall .conts{padding:30px 36px!important;align-items:center}
body.hbc #intall .icobox{background:var(--hg)!important;border-radius:18px!important;box-shadow:0 10px 26px rgba(0,0,0,.25)}
body.hbc #intall .icobox i{color:#fff!important}
body.hbc #intall .detabox h1{color:#fff!important;font-size:30px!important;font-weight:800!important;letter-spacing:-.6px;line-height:1.15!important}
body.hbc #intall .detabox p{color:rgba(255,255,255,.72)!important}
body.hbc #intall .countservices{background:rgba(255,255,255,.1)!important;color:#fff!important;border:1px solid rgba(255,255,255,.14);border-radius:999px!important}
body.hbc #intall .hbc-has-ph .hb-art,body.hbc #intall .hbc-has-ph .icobox{display:none!important}
body.hbc #intall .hbc-has-ph .detabox{max-width:56%}
body.hbc .hbc-ph{position:absolute;right:16px;top:16px;bottom:16px;width:34%;border-radius:18px;overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.35)}
body.hbc .hbc-ph img{width:100%;height:100%;object-fit:cover;object-position:50% 35%;display:block}
body.hbc .hbc-ph:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(17,18,42,.45),transparent 40%)}

/* Paket seçici */
body.hbc .hb-sec-card{border-radius:24px;border:1px solid #ebecf3;box-shadow:0 18px 50px rgba(20,21,43,.07)}
body.hbc .hb-sec-h{font-size:22px!important;font-weight:800!important;color:var(--hink)!important;letter-spacing:-.4px}
body.hbc .hb-sec-h em{background:var(--hg);-webkit-background-clip:text;background-clip:text;color:transparent}
body.hbc .hb-chip{border-radius:16px;border-color:#ebecf3;color:var(--hink)}
body.hbc .hb-chip:hover{border-color:color-mix(in srgb,var(--hc1) 55%,#fff);box-shadow:0 12px 26px rgba(20,21,43,.08)}
body.hbc .hb-chip .hb-p{background:var(--hink)}
body.hbc .hb-chip.sel{border-color:var(--hc1);background:color-mix(in srgb,var(--hc1) 6%,#fff);box-shadow:0 0 0 3px color-mix(in srgb,var(--hc1) 16%,transparent)}
body.hbc .hb-chip.sel .hb-p{background:linear-gradient(135deg,var(--hc1),var(--hc2))}
body.hbc .hb-chip.sel::after{background-color:var(--hc1)}
body.hbc .hb-chip .hb-pop{background:linear-gradient(135deg,var(--hc1),var(--hc2));font-weight:700;box-shadow:0 4px 10px color-mix(in srgb,var(--hc1) 35%,transparent)}
body.hbc .hb-feats{border-radius:16px;background:#f6f6fb;border-color:#ebecf3}
body.hbc .hb-sum-h{font-size:17px;font-weight:800;color:var(--hink)}
body.hbc .hb-pick{border-radius:16px;border-color:#ebecf3}
body.hbc .hb-mid b,body.hbc .hb-tot b,body.hbc .hb-st-t b{color:var(--hink);font-weight:800}
body.hbc .hb-cta{background:linear-gradient(135deg,var(--hc1),var(--hc2))!important;border-radius:14px;font-weight:800;font-size:16px;padding:16px;box-shadow:0 14px 30px color-mix(in srgb,var(--hc1) 38%,transparent)}
body.hbc .hb-cta:hover{filter:brightness(1.06);transform:translateY(-1px)}

/* SSS ve makale */
body.hbc .hb-sss details{border-radius:16px;border-color:#ebecf3}
body.hbc .hb-sss details[open]{box-shadow:0 12px 30px rgba(20,21,43,.06)}
body.hbc .hb-sss summary::after{color:var(--hc1)}
body.hbc .article--area{border-radius:24px!important}

@media(max-width:991px){body.hbc .hbc-ph{width:30%}body.hbc #intall .detabox h1{font-size:24px!important}}
@media(max-width:767px){body.hbc #intall .intall{border-radius:20px!important;min-height:0}body.hbc #intall .conts{padding:20px 18px!important}body.hbc .hbc-ph{display:none}body.hbc #intall .hbc-has-ph .detabox{max-width:none}body.hbc #intall .detabox h1{font-size:21px!important}body.hbc .hb-sec-card{border-radius:18px}body.hbc .hb-sec-h{font-size:19px!important}}

/* v3 — seçicinin altı: paket sayfasına özel, platform sayfasından farklı bölümler (.hbl) */
body.hbc .hbl{color:var(--hink);margin:10px auto 34px}
body.hbc .hbl-sec{margin-top:38px}
body.hbc .hbl-kk{display:inline-block;font-size:12px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;background:var(--hg);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:6px}
body.hbc .hbl-h{font-size:24px;font-weight:800;letter-spacing:-.5px;line-height:1.15;margin:0 0 6px;color:var(--hink)}
body.hbc .hbl-sub{color:#666a82;font-size:14px;margin:0 0 16px}
/* 1) sipariş süreci — yatay zaman çizelgesi */
body.hbc .hbl-tl{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid #ebecf3;border-radius:22px;padding:22px 10px;box-shadow:0 12px 34px rgba(20,21,43,.05);position:relative}
body.hbc .hbl-st{position:relative;text-align:center;padding:0 12px}
body.hbc .hbl-st:not(:last-child):after{content:"";position:absolute;top:19px;left:calc(50% + 26px);right:calc(-50% + 26px);height:2px;background:repeating-linear-gradient(90deg,color-mix(in srgb,var(--hc1) 45%,#fff) 0 6px,transparent 6px 11px)}
body.hbc .hbl-st i.n{display:grid;place-items:center;width:40px;height:40px;margin:0 auto 10px;border-radius:50%;font-style:normal;font-weight:800;font-size:16px;color:#fff;background:linear-gradient(135deg,var(--hc1),var(--hc2));box-shadow:0 8px 18px color-mix(in srgb,var(--hc1) 35%,transparent)}
body.hbc .hbl-st b{display:block;font-size:15px;font-weight:800}
body.hbc .hbl-st small{display:block;font-size:12.5px;color:#666a82;margin-top:3px;line-height:1.4}
/* 2) yorum şeridi */
body.hbc .hbl-rv{display:flex;align-items:center;gap:22px;background:#11122a;border-radius:22px;padding:18px 24px;color:#fff;position:relative;overflow:hidden;isolation:isolate}
body.hbc .hbl-rv:before{content:"";position:absolute;z-index:-1;width:380px;height:380px;right:-120px;top:-220px;border-radius:50%;background:radial-gradient(closest-side,var(--hglow),transparent)}
body.hbc .hbl-sc{flex:none;display:flex;align-items:center;gap:12px;padding-right:22px;border-right:1px solid rgba(255,255,255,.12)}
body.hbc .hbl-sc b{font-size:38px;font-weight:800;letter-spacing:-1.5px;line-height:1}
body.hbc .hbl-sc span{display:block;color:#ffb400;letter-spacing:2px;font-size:14px}
body.hbc .hbl-sc small{display:block;color:rgba(255,255,255,.6);font-size:12px}
body.hbc .hbl-q{flex:1;min-width:0;min-height:44px;display:flex;align-items:center}
body.hbc .hbl-q p{margin:0;font-size:14.5px;line-height:1.55;color:rgba(255,255,255,.9);transition:opacity .4s}
body.hbc .hbl-q p em{font-style:normal;font-weight:800;color:#fff;margin-left:8px;white-space:nowrap}
body.hbc .hbl-q p.out{opacity:0}
/* 3) SSS */
body.hbc .hbl-fq{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:start}
body.hbc .hbl-fq details{background:#fff;border:1px solid #ebecf3;border-radius:16px;padding:0 18px;transition:box-shadow .2s}
body.hbc .hbl-fq details[open]{box-shadow:0 12px 30px rgba(20,21,43,.06);border-color:color-mix(in srgb,var(--hc1) 30%,#ebecf3)}
body.hbc .hbl-fq summary{list-style:none;cursor:pointer;font-size:14.5px;font-weight:700;color:var(--hink);padding:15px 0;display:flex;justify-content:space-between;align-items:center;gap:12px}
body.hbc .hbl-fq summary::-webkit-details-marker{display:none}
body.hbc .hbl-fq summary:after{content:"+";flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:18px;font-weight:600;color:var(--hc1);background:color-mix(in srgb,var(--hc1) 10%,#fff);transition:transform .2s}
body.hbc .hbl-fq details[open] summary:after{transform:rotate(45deg)}
body.hbc .hbl-fq details p{font-size:13.5px;color:#5a6472;line-height:1.65;margin:0;padding:0 0 15px}
body.hbc .hbl-wa{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:14px;font-size:14px;color:#666a82}
body.hbc .hbl-wa a{display:inline-flex;align-items:center;gap:6px;font-weight:800;color:#15965c!important;text-decoration:none!important}
/* 4) birlikte iyi gider — tamamlayıcı kartlar */
body.hbc .hbl-xa{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
body.hbc .hbl-xa a{position:relative;display:flex;flex-direction:column;gap:12px;background:#fff;border:1px solid #ebecf3;border-radius:22px;padding:20px;text-decoration:none!important;color:var(--hink)!important;transition:transform .2s,box-shadow .2s,border-color .2s;overflow:hidden}
body.hbc .hbl-xa a:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--hc1) 45%,#fff);box-shadow:0 18px 40px rgba(20,21,43,.09)}
body.hbc .hbl-xa a:before{content:"";position:absolute;right:-40px;top:-40px;width:120px;height:120px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--hc1) 16%,transparent),transparent)}
body.hbc .hbl-xa .ic{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;color:#fff;font-size:22px;font-style:normal;background:linear-gradient(135deg,var(--hc1),var(--hc2));box-shadow:0 10px 22px color-mix(in srgb,var(--hc1) 35%,transparent)}
body.hbc .hbl-xa b{font-size:17px;font-weight:800;letter-spacing:-.2px}
body.hbc .hbl-xa p{margin:-6px 0 0;font-size:13.5px;color:#666a82;line-height:1.5;flex:1}
body.hbc .hbl-xa .ft{display:flex;align-items:center;justify-content:space-between}
body.hbc .hbl-xa .tg{font-size:11.5px;font-weight:700;padding:4px 10px;border-radius:999px;color:var(--hc1);background:color-mix(in srgb,var(--hc1) 9%,#fff)}
body.hbc .hbl-xa .go{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#f3f3f8;font-weight:800;transition:.2s}
body.hbc .hbl-xa a:hover .go{background:var(--hink);color:#fff}
body.hbc .hbl-xa .pop{position:absolute;top:14px;right:14px;font-size:10.5px;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--hc1),var(--hc2));padding:3px 9px;border-radius:999px}
/* 5) makale — rehber görünümü */
body.hbc .hbg-on{margin-bottom:34px}
body.hbc .hbg-on .article-fade{display:none!important}
body.hbc .hbg{display:grid;grid-template-columns:260px 1fr;gap:18px;align-items:start}
body.hbc .hbg.hbg-1c{grid-template-columns:1fr}
body.hbc .hbg-toc{position:sticky;top:90px;background:#fff;border:1px solid #ebecf3;border-radius:22px;padding:20px}
body.hbc .hbg-toc .t{font-size:12px;font-weight:800;letter-spacing:1.1px;text-transform:uppercase;color:#666a82;margin-bottom:10px}
body.hbc .hbg-toc a{display:flex;gap:10px;padding:9px 10px;border-radius:12px;color:var(--hink)!important;text-decoration:none!important;font-size:13.5px;font-weight:600;line-height:1.35}
body.hbc .hbg-toc a:hover{background:#f6f6fb}
body.hbc .hbg-toc a span{flex:none;width:22px;height:22px;border-radius:7px;display:grid;place-items:center;font-size:11px;font-weight:800;background:#f3f3f8;color:#666a82}
body.hbc .hbg-toc a.on{background:color-mix(in srgb,var(--hc1) 8%,#fff);color:var(--hc1)!important}
body.hbc .hbg-toc a.on span{background:var(--hc1);color:#fff}
body.hbc .hbg-toc .rt{margin-top:12px;padding-top:12px;border-top:1px solid #ebecf3;font-size:12.5px;color:#666a82}
body.hbc .hbg-art{background:#fff;border:1px solid #ebecf3;border-radius:22px;overflow:hidden;min-width:0}
body.hbc .hbg-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));border-bottom:1px solid #ebecf3}
body.hbc .hbg-facts div{padding:16px 18px;border-right:1px solid #ebecf3}
body.hbc .hbg-facts div:last-child{border-right:0}
body.hbc .hbg-facts small{display:block;font-size:11.5px;color:#666a82;font-weight:700;text-transform:uppercase;letter-spacing:.6px}
body.hbc .hbg-facts b{display:block;margin-top:4px;font-size:14.5px;font-weight:700;color:var(--hink);line-height:1.35}
body.hbc .hbg-bar{height:4px;background:#f0f0f6}
body.hbc .hbg-bar i{display:block;height:100%;width:3%;background:linear-gradient(90deg,var(--hc1),var(--hc2));border-radius:0 4px 4px 0}
body.hbc .article--area.hbg-sc{position:relative;max-height:480px!important;overflow-y:auto!important;border-radius:0!important;box-shadow:none!important;border:0!important;margin:0!important;padding:24px 28px!important;-webkit-mask-image:none!important;mask-image:none!important;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--hc1) 45%,#fff) transparent}
body.hbc .article--area.hbg-sc::-webkit-scrollbar{width:6px}
body.hbc .article--area.hbg-sc::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--hc1) 45%,#fff);border-radius:6px}
body.hbc .article--area.hbg-sc h3{font-size:17px!important;font-weight:800!important;color:var(--hink)!important}
body.hbc .article--area.hbg-sc h2{font-size:19px!important;font-weight:800!important;color:var(--hink)!important;letter-spacing:-.3px}
body.hbc .article--area.hbg-sc img{width:min(230px,38%)!important;height:auto!important;max-width:none!important;float:right;border-radius:16px;margin:4px 0 10px 18px!important}
@media(max-width:991px){body.hbc .hbl-xa{grid-template-columns:repeat(2,1fr)}body.hbc .hbl-fq{grid-template-columns:1fr}body.hbc .hbg{grid-template-columns:1fr}body.hbc .hbg-toc{position:static}}
@media(max-width:767px){body.hbc .hbl-sec{margin-top:28px}body.hbc .hbl-h{font-size:20px}
 body.hbc .hbl-tl{grid-template-columns:1fr 1fr;row-gap:18px;padding:18px 6px}body.hbc .hbl-st:nth-child(2):after{display:none}
 body.hbc .hbl-rv{flex-direction:column;align-items:flex-start;gap:12px;padding:18px}body.hbc .hbl-sc{border-right:0;padding-right:0}
 body.hbc .hbl-xa{grid-template-columns:1fr}body.hbc .hbg-toc{display:none}body.hbc .article--area.hbg-sc{max-height:60vh!important;padding:18px 16px!important}body.hbc .article--area.hbg-sc img{float:none;display:block;width:100%!important;margin:0 0 12px!important}body.hbc .hbg-facts{grid-template-columns:1fr 1fr}body.hbc .hbg-facts div:nth-child(2n){border-right:0}body.hbc .hbg-facts div{border-bottom:1px solid #ebecf3}}
