/* Burhan Koca — only the linked navigation-card grid used on the two hub pages
   (/burhankoca/ and /burhankoca/gruplar/). Everything else on the section reuses
   the theme's own blocks (page-head, about-bio, services, stats, cta-band) and
   their stylesheets. Scoped under body.theme-bk (see inc/burhankoca.php). Uses
   the theme design tokens from tokens.css. */

/* Site-wide bk header treatment: transparent/borderless nav, less-rounded corners,
   and a 1280px width matched to .container (was tested on Markalar only, now the
   default look for the whole Burhan Koca section). */
.theme-bk .nav-wrap{max-width:1280px;margin:0 auto}
.theme-bk .nav{border-radius:6px;max-width:none;background:none;border:none;box-shadow:none}
.theme-bk .container{max-width:1280px}
.theme-bk .nav .wordmark .dot{display:none}
.theme-bk .nav .primary a,.theme-bk .footer nav a{font-family:var(--f-display);font-weight:600;font-size:15px;letter-spacing:0.025em}
.theme-bk .nav .cta.btn-accent{background:#F4F5F7;color:var(--accent);border:1px solid var(--line)}
.theme-bk .nav .cta.btn-accent:hover{background:#E9EBEF}
.theme-bk .nav-drawer__panel a{font-family:var(--f-display);font-weight:600;letter-spacing:0.025em}
.theme-bk .nav-drawer__panel .btn.btn-accent{background:#F4F5F7;color:var(--accent);border:1px solid var(--line)}
.theme-bk .nav-drawer__panel .btn.btn-accent:hover{background:#E9EBEF}

/* Home page only: header floats over the dark v2-hero band (see .bk-hero below),
   so its wordmark/links need to be white instead of the usual navy/ink. The CTA
   pill keeps its light background regardless of what's behind it, so it's left
   alone. Set via the header-bk-dark part's className, not a page-template
   selector, so it stays with the block instance if the template ever changes. */
.theme-bk .nav-wrap.nav-on-dark{position:absolute;top:0;left:0;right:0}
.theme-bk .nav-wrap.nav-on-dark .nav{backdrop-filter:none;-webkit-backdrop-filter:none}
.theme-bk .nav-wrap.nav-on-dark .nav .wordmark,
.theme-bk .nav-wrap.nav-on-dark .nav .primary a{color:#fff}
.theme-bk .nav-wrap.nav-on-dark .nav .primary a:hover,
.theme-bk .nav-wrap.nav-on-dark .nav .primary a.on{color:#fff;font-weight:600}
.theme-bk .nav-wrap.nav-on-dark .nav-toggle .line{background:#fff}

/* Home page hero: a decorative dark band (no built-in nav/lead — see the
   showTop/showLead/showPhoto v2-hero attributes). The header (.nav-on-dark,
   above) is taken out of flow with position:absolute so it overlays the hero's
   top edge directly — no negative-margin pixel math needed to close the gap. */
/* Mobile-first: a much shorter band than the desktop version (72vh reads as a
   huge near-empty dark slab on a tall phone viewport) — bumped up at 768px. */
.theme-bk .bk-hero{height:clamp(420px,58vh,520px);max-height:none;min-height:0}
.theme-bk .bk-hero .hero-name{display:flex;justify-content:center;gap:clamp(10px,2.4vw,28px);bottom:10px;z-index:5}
.theme-bk .bk-hero .hero-name .l{font-size:clamp(34px,9vw,82px)}
/* Mobile-first: size the portrait by WIDTH (capped), not height — a tall,
   height-based box (fine on wide desktop viewports) would force an equally
   wide box on narrow screens via object-fit:contain and overflow off-screen.
   Centered horizontally (left:50%/translateX), not right-aligned. Sits BEHIND
   the giant name text (hero-name z-index:5 above this z-index:4), so the name
   reads in front of the portrait rather than being covered by it. */
.theme-bk .bk-hero .hero-portrait{position:absolute;left:50%;bottom:0;transform:translateX(-50%);z-index:4;width:100vw;pointer-events:none}
.theme-bk .bk-hero .hero-portrait img{display:block;width:100%;height:auto;object-fit:contain}
@media (min-width:768px){
	.theme-bk .bk-hero{height:clamp(480px,72vh,680px)}
	.theme-bk .bk-hero .hero-name{bottom:32px}
	.theme-bk .bk-hero .hero-name .l{font-size:clamp(24px,6.5vw,82px)}
	.theme-bk .bk-hero .hero-portrait{width:auto;max-width:none;height:88%;max-height:560px}
	.theme-bk .bk-hero .hero-portrait img{width:auto;height:100%}
}

/* Home page "Markalar & Yatırımlar" logo teaser (arnout/clients block, reused
   from the main site's design) — widened to fit exactly 5 logos instead of the
   shared block's default 4-column desktop grid. Scoped to this instance via
   className so the main site's client grid is untouched. */
@media (min-width:768px){
	.theme-bk .clients-sec.bk-five .clients{grid-template-columns:repeat(5,1fr)}
}

/* Lighter gray band than the theme default (--gray, #ECEEF2), for the page-head/
   services "gray" band across all of theme-bk. */
.theme-bk .band-gray{background:#F4F5F7}

/* Headings use a navy shade instead of the theme's near-black --ink. Accent
   spans (e.g. the blue word inside an h1 title) keep their own more specific
   color rule, so they're unaffected. */
body.theme-bk h1,body.theme-bk h2,body.theme-bk h3{color:#22354f}

/* Services card description (e.g. HRPeak/Talentate/Empatik desc text on Markalar):
   same plain body-text style as the Gruplar hub's linked bk-card description
   (e.g. "İstihdam odaklı İK yöneticileri topluluğu (750+ üye)." under onlyHR) —
   normal body font, no display-font/weight tricks. Scoped here (not services.css)
   since that block/stylesheet is shared with the main site's /consulting/ page. */
.theme-bk .svc-card p{font-size:15px;line-height:1.55;color:var(--muted)}

/* card grid */
.theme-bk .bk-cards{
	width:100%;max-width:1180px;margin:0 auto;
	padding:56px 20px 64px;
	display:grid;gap:18px;
	grid-template-columns:1fr;
}

.theme-bk .bk-card{
	position:relative;
	background:var(--card);
	border:1px solid var(--line);
	border-radius:var(--r-md);
	padding:26px 24px;
	display:flex;flex-direction:column;gap:9px;
	transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.theme-bk .bk-card:hover{
	transform:translateY(-3px);
	border-color:var(--accent-soft);
	box-shadow:0 18px 40px -24px rgba(18,39,64,0.45);
}
.theme-bk .bk-card h3{
	font-family:var(--f-display);font-weight:700;letter-spacing:-0.01em;
	font-size:20px;margin:0;color:var(--ink);
	display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.theme-bk .bk-card h3 a{color:inherit;text-decoration:none}
.theme-bk .bk-card h3 a::after{content:"";position:absolute;inset:0}
.theme-bk .bk-card h3::after{content:"→";color:var(--accent);font-weight:500;transition:transform .16s ease}
.theme-bk .bk-card:hover h3::after{transform:translateX(4px)}
.theme-bk .bk-card p{margin:0;font-size:15px;line-height:1.55;color:var(--muted)}

/* label + divider between card groups (e.g. "Genel Kurallar") */
.theme-bk .bk-cards-label{
	width:100%;max-width:1180px;margin:40px auto 0;padding:0 20px;
	font-family:var(--f-mono);font-size:12px;letter-spacing:0.16em;text-transform:uppercase;
	color:var(--muted);
}
.theme-bk .bk-hub .wp-block-separator{
	width:100%;max-width:1180px;margin:8px auto 0;padding:0;
	border:0;border-top:1px solid var(--line);opacity:1;
}

/* Floating scroll-to-top button — hidden at page top, fades in once scrolled. */
.bk-to-top{
	position:fixed;right:24px;bottom:24px;z-index:80;
	width:48px;height:48px;border-radius:999px;border:none;
	background:var(--navy);color:#fff;
	display:flex;align-items:center;justify-content:center;cursor:pointer;
	box-shadow:0 10px 28px rgba(18,39,64,0.35);
	opacity:0;visibility:hidden;transform:translateY(10px);
	transition:opacity .25s,transform .25s,visibility .25s,background .15s;
}
.bk-to-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)}
.bk-to-top:hover{background:var(--accent-deep)}
.bk-to-top svg{width:20px;height:20px}

/* Blog article body — plain core paragraphs/images need their own rhythm since
   theme.json blockGap is 0 and reset.css zeroes all margins. */
.theme-bk .bk-article{width:100%;max-width:760px;margin:0 auto;padding:40px 20px 64px}
.theme-bk .bk-article > *+*{margin-top:1.3em}
.theme-bk .bk-article p{font-size:16px;line-height:1.7;color:var(--ink)}
.theme-bk .bk-article p strong{color:var(--ink)}
.theme-bk .bk-article a{color:var(--accent-deep);font-weight:500;border-bottom:1px solid currentColor}
.theme-bk .bk-article figure{margin-top:1.3em}
.theme-bk .bk-article img{border-radius:var(--r-md)}