/* Sayfaya özel stiller; ortak style.css korunur. */
.kyg-page { --kyg-ink: #171717; --kyg-muted: #626262; --kyg-line: #e4e1d9; }
.kyg-page button, .kyg-page .kyg-action { font-family: inherit; }
.kyg-page .kyg-skip { position: fixed; inset-block-start: 8px; inset-inline-start: 8px; z-index: 300; padding: 12px 18px; background: var(--primary-color); color: #121212; transform: translateY(-180%); }
.kyg-page .kyg-skip:focus { transform: none; }
.kyg-hero { background: var(--primary-color); color: var(--kyg-ink); padding: clamp(24px,3vw,40px) 0 clamp(22px,2.5vw,32px); }
.kyg-hero-inner { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 32px; align-items: center; }
.kyg-eyebrow { font-size: .76rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; margin-block-end: 10px; }
.kyg-hero h1 { font-size: clamp(1.85rem,3.8vw,3.2rem); letter-spacing: -.045em; line-height: 1.12; max-width: 800px; margin-block-end: 12px; }
.kyg-lead { max-width: 760px; font-size: clamp(.95rem,1.3vw,1.05rem); color: #343026; }
.kyg-hero-link { display: inline-block; color: #171717; font-weight: 650; margin-block-start: 16px; text-underline-offset: 6px; }
.kyg-hero-detail { text-align: center; padding-inline-start: 28px; border-inline-start: 1px solid #17171730; }
.kyg-hero-detail > span { display: block; font-size: 4.25rem; font-weight: 800; line-height: 1; letter-spacing: -.07em; }
.kyg-hero-detail > span > span { font-size: 1.6rem; vertical-align: top; letter-spacing: 0; }
.kyg-hero-detail small { display: block; font-size: .62rem; font-weight: 700; letter-spacing: .09em; margin-block-start: 12px; }
.kyg-section { background: #f8f7f4; color: var(--kyg-ink); padding: 50px 0 64px; scroll-margin-top: 110px; }
.kyg-section-top { display: flex; gap: 24px; justify-content: space-between; align-items: end; margin-block-end: 28px; }
.kyg-section h2, .kyg-cta h2 { font-size: clamp(1.55rem,2.7vw,2.25rem); font-weight: 750; line-height: 1.2; letter-spacing: -.025em; }
.kyg-section .kyg-eyebrow { color: var(--kyg-muted); }
.kyg-filters { display: flex; flex-wrap: wrap; gap: 8px; padding-block-end: 6px; }
.kyg-filter { display: inline-flex; align-items: center; gap: 8px; background: #fff; border: 1px solid var(--kyg-line); color: #383838; border-radius: 999px; padding: 10px 16px; min-height: 44px; font-size: .87rem; cursor: pointer; transition: background .15s, border-color .15s; white-space: nowrap; }
.kyg-filter:hover { border-color: #777; }
.kyg-filter[aria-pressed="true"] { background: var(--kyg-ink); color: #fff; border-color: var(--kyg-ink); }
.kyg-filter-count { font-size: .75rem; opacity: .72; font-variant-numeric: tabular-nums; }
.kyg-count { color: var(--kyg-muted); font-size: .83rem; margin: 15px 0 22px; }
.kyg-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 24px 18px; }
.kyg-card { min-width: 0; background: #fff; border: 1px solid var(--kyg-line); border-radius: 12px; overflow: hidden; }
.kyg-card[hidden], .kyg-empty[hidden], .kyg-viewer [hidden] { display: none !important; }
.kyg-open { display: block; width: 100%; border: 0; background: #e9e7e0; cursor: zoom-in; position: relative; aspect-ratio: 4/3; overflow: hidden; }
.kyg-open img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease; }
.kyg-card-overlay { position: absolute; inset: 0; background: linear-gradient(transparent 45%,#0004); pointer-events: none; opacity: 0; transition: opacity .25s; }
.kyg-card-zoom { position: absolute; inset-inline-end: 12px; inset-block-end: 12px; background: #fffffff0; color: #171717; border-radius: 50%; width: 32px; height: 32px; display: grid; place-items: center; font-size: 1.2rem; opacity: 0; transition: opacity .25s; pointer-events: none; }
.kyg-play { position: absolute; inset: 0; display: grid; place-items: center; pointer-events: none; }
.kyg-play::before { content: '▶'; color: #171717; background: var(--primary-color); width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; padding-inline-start: 3px; box-shadow: 0 4px 18px #0004; font-size: 1.2rem; }
.kyg-card figcaption { padding: 16px; }
.kyg-card-category { font-size: .7rem; font-weight: 700; letter-spacing: .025em; color: #6c5b29; margin-block-end: 5px; }
.kyg-card-title { font-size: .9rem; font-weight: 600; line-height: 1.5; color: #252525; }
.kyg-card-type { font-size: .7rem; color: var(--kyg-muted); margin-block-start: 7px; }
@media (hover:hover) { .kyg-open:hover img { transform: scale(1.035); } .kyg-open:hover .kyg-card-overlay, .kyg-open:hover .kyg-card-zoom { opacity: 1; } }
.kyg-open:focus-visible .kyg-card-overlay, .kyg-open:focus-visible .kyg-card-zoom { opacity: 1; }
.kyg-page :is(.kyg-filter,.kyg-open,.kyg-action,.kyg-icon-button,.kyg-hero-link,.kyg-skip):focus-visible { outline: 3px solid #2872c6; outline-offset: 4px; }
.kyg-open:focus-visible { outline-offset: -4px; }
.kyg-empty { background: #fff; border: 1px dashed #c6c2b7; border-radius: 12px; padding: 40px 20px; text-align: center; color: #555; }
.kyg-cta { background: #1c1c1c; color: #fff; padding: 48px 0; border-block-start: 4px solid var(--primary-color); }
.kyg-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.kyg-cta .kyg-eyebrow { color: var(--primary-color); }
.kyg-cta h2 { max-width: 620px; margin-block-end: 12px; }
.kyg-cta p:not(.kyg-eyebrow) { color: #c5c5c5; max-width: 610px; }
.kyg-cta-actions { display: flex; flex-wrap: wrap; gap: 10px; flex-shrink: 0; }
.kyg-action { display: inline-flex; justify-content: center; align-items: center; gap: 10px; min-height: 48px; padding: 12px 18px; border-radius: 8px; text-decoration: none; font-weight: 650; font-size: .9rem; transition: filter .15s; }
.kyg-action:hover { filter: brightness(1.08); }
.kyg-action-whatsapp { background: #25d366; color: #102919; }
.kyg-action-call { background: var(--primary-color); color: #171717; }
.kyg-viewer { position: fixed; inset: 0; border: 0; margin: auto; width: min(1120px,100% - 32px); max-width: none; max-height: calc(100dvh - 28px); color: #fff; background: #151515; padding: 0; border-radius: 14px; overflow: auto; box-shadow: 0 20px 90px #0009; }
.kyg-viewer::backdrop { background: #070707ec; }
.kyg-viewer-shell { padding: 14px 20px 20px; }
.kyg-viewer-controls { display: flex; align-items: center; gap: 8px; }
.kyg-external { text-decoration: none; font-size: 1.4rem; }
.kyg-viewer-top { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 44px; margin-block-end: 10px; color: #d2d2d2; font-size: .85rem; }
.kyg-icon-button { width: 44px; height: 44px; flex-shrink: 0; display: grid; place-items: center; background: #2d2d2d; border: 1px solid #ffffff25; color: #fff; border-radius: 50%; font-size: 1.9rem; line-height: 1; cursor: pointer; }
.kyg-icon-button:hover { background: #444; }
.kyg-icon-button:disabled { opacity: .35; cursor: default; }
.kyg-stage-wrap { position: relative; display: grid; grid-template-columns: 44px minmax(0,1fr) 44px; align-items: center; gap: 12px; }
.kyg-stage { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 150px; height: min(62dvh,650px); background: #0c0c0c; border-radius: 7px; overflow: hidden; }
.kyg-stage[data-type="image"] { touch-action: pan-y pinch-zoom; }
.kyg-stage img, .kyg-stage video { width: 100%; height: 100%; object-fit: contain; display: block; }
.kyg-stage iframe { width: 100%; height: 100%; border: 0; background: white; }
.kyg-stage[data-type="instagram"] iframe { max-width: 540px; }
.kyg-viewer-caption { padding: 14px 56px 0; }
.kyg-viewer-caption .kyg-eyebrow { color: var(--primary-color); margin-block-end: 6px; }
.kyg-viewer-caption h2 { font-size: clamp(1rem,2vw,1.2rem); line-height: 1.4; margin: 0; }
.kyg-stage-error { padding: 24px; text-align: center; color: #ddd; }
html.kyg-modal-open { overflow: hidden; scrollbar-gutter: stable; }
[dir="rtl"] .kyg-prev, [dir="rtl"] .kyg-next { transform: rotate(180deg); }
[dir="rtl"] .kyg-eyebrow { letter-spacing: 0; }
@media (max-width: 1050px) { .kyg-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } .kyg-cta-inner { align-items: start; flex-direction: column; } }
@media (max-width: 700px) {
 .kyg-hero-inner { display: block; }
 .kyg-hero-detail { display: none; }
 .kyg-section { padding: 32px 0 40px; }
 .kyg-section-top { display: block; margin-block-end: 22px; }
 .kyg-filters { flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-inline: contain; padding: 4px 4px 12px; margin-inline: -4px; scrollbar-width: thin; }
 .kyg-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px 10px; }
 .kyg-card figcaption { padding: 11px; }
 .kyg-card-title { font-size: .8rem; }
 .kyg-card-category { font-size: .65rem; }
 .kyg-card-zoom { width: 28px; height: 28px; inset-inline-end: 8px; inset-block-end: 8px; }
 .kyg-cta { padding: 32px 0; }
 .kyg-cta-actions { width: 100%; }
 .kyg-action { flex: 1; }
 .kyg-viewer { width: calc(100% - 12px); max-height: calc(100dvh - 12px); border-radius: 10px; }
 .kyg-viewer-shell { padding: 8px 8px 18px; }
 .kyg-stage-wrap { display: block; }
 .kyg-stage { height: min(58dvh,650px); }
 .kyg-prev, .kyg-next { position: absolute; bottom: 10px; z-index: 2; background: #151515d9; }
 .kyg-prev { inset-inline-start: 10px; }
 .kyg-next { inset-inline-end: 10px; }
 .kyg-viewer-caption { padding: 12px 8px 0; }
}
@media (max-width: 350px) { .kyg-grid { grid-template-columns: minmax(0,1fr); } }
@media (prefers-reduced-motion: reduce) { .kyg-page *, .kyg-page *::before, .kyg-page *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }
