/* ==========================================================================
   OSBİK Ana Sayfa v2 — yalnızca .hv2 kapsamında geçerlidir
   ========================================================================== */

.hv2 {
    --hv2-ink: var(--tyn-emphasis-color, #111827);
    --hv2-muted: var(--tyn-secondary-color, #6b7280);
    --hv2-line: var(--tyn-border-color, #e5e7eb);
    --hv2-surface: var(--tyn-body-bg, #fff);
    --hv2-soft: var(--tyn-tertiary-bg, #f6f8fb);
    --hv2-primary: var(--tyn-primary, #185ff1);
    --hv2-primary-rgb: var(--tyn-primary-rgb, 24, 95, 241);
    --hv2-radius: 18px;
    --hv2-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 12px 32px -12px rgba(16, 24, 40, .14);
}

/* ---------- Ortak ---------- */
.hv2-section { padding: 5rem 0; }
.hv2-soft { background: var(--hv2-soft); }

.hv2-kicker {
    display: inline-block;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--hv2-primary);
    margin-bottom: .5rem;
}

.hv2-h2 {
    font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.25rem);
    font-weight: 700;
    letter-spacing: -.02em;
    line-height: 1.2;
    color: var(--hv2-ink);
    margin-bottom: .75rem;
}

.hv2-sub {
    color: var(--hv2-muted);
    font-size: 1rem;
    line-height: 1.65;
    margin-bottom: 0;
}

.hv2-section-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.25rem;
    margin-bottom: 2.25rem;
}

.hv2-center-head { max-width: 640px; margin-bottom: 3rem; }

.hv2-link {
    font-size: .875rem;
    font-weight: 500;
    color: var(--hv2-ink);
    text-decoration: none;
}
.hv2-link:hover { color: var(--hv2-primary); }
.hv2-link i { transition: transform .2s ease; display: inline-block; }
.hv2-link:hover i { transform: translateX(3px); }

/* ---------- Hero ---------- */
.hv2-hero {
    position: relative;
    padding: 5rem 0 3.5rem;
    overflow: hidden;
}

.hv2-hero-bg {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(60% 70% at 85% 10%, rgba(var(--hv2-primary-rgb), .14) 0%, rgba(var(--hv2-primary-rgb), 0) 70%),
        radial-gradient(50% 60% at 0% 100%, rgba(var(--hv2-primary-rgb), .08) 0%, rgba(var(--hv2-primary-rgb), 0) 70%);
    pointer-events: none;
}
.hv2-hero-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(var(--hv2-primary-rgb), .06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--hv2-primary-rgb), .06) 1px, transparent 1px);
    background-size: 44px 44px;
    -webkit-mask-image: radial-gradient(ellipse 70% 60% at 70% 30%, #000 0%, transparent 75%);
    mask-image: radial-gradient(ellipse 70% 60% at 70% 30%, #000 0%, transparent 75%);
}

.hv2-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .4rem .85rem;
    border-radius: 999px;
    background: var(--hv2-surface);
    border: 1px solid var(--hv2-line);
    font-size: .8rem;
    font-weight: 500;
    color: var(--hv2-ink);
    box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
}
.hv2-eyebrow i { color: var(--hv2-primary); }

.hv2-title {
    font-size: clamp(2.1rem, 1.4rem + 3vw, 3.6rem);
    font-weight: 700;
    letter-spacing: -.035em;
    line-height: 1.08;
    color: var(--hv2-ink);
    margin: 1.25rem 0 1.25rem;
    position: relative;
    z-index: 0;
}

.hv2-highlight {
    color: var(--hv2-primary);
    position: relative;
    white-space: nowrap;
}
.hv2-highlight::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: .06em;
    height: .22em;
    background: rgba(var(--hv2-primary-rgb), .16);
    border-radius: 4px;
    z-index: -1;
}

.hv2-lead {
    font-size: 1.075rem;
    line-height: 1.7;
    color: var(--hv2-muted);
    max-width: 540px;
    margin-bottom: 2rem;
}

.hv2-cta { display: flex; flex-wrap: wrap; gap: .75rem; }
.hv2-cta .btn { border-radius: 12px; font-size: 1rem; padding: .8rem 1.4rem; }

.hv2-login-hint { margin: 1rem 0 0; font-size: .875rem; color: var(--hv2-muted); }
.hv2-login-hint a { color: var(--hv2-ink); font-weight: 600; text-decoration: none; border-bottom: 1px solid currentColor; }
.hv2-login-hint a:hover { color: var(--hv2-primary); }

/* Vitrin kartı */
.hv2-showcase {
    position: relative;
    background: var(--hv2-surface);
    border: 1px solid var(--hv2-line);
    border-radius: 22px;
    padding: 1.25rem;
    box-shadow: 0 30px 60px -30px rgba(16, 24, 40, .25), 0 1px 2px rgba(16, 24, 40, .04);
    max-width: 540px;
    margin-left: auto;
    margin-right: auto;
}

.hv2-showcase-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .25rem .35rem 1rem;
    font-size: .8rem;
    font-weight: 600;
    color: var(--hv2-muted);
    text-transform: uppercase;
    letter-spacing: .06em;
}
.hv2-showcase-head a {
    text-transform: none;
    letter-spacing: 0;
    color: var(--hv2-primary);
    text-decoration: none;
    font-weight: 500;
}

.hv2-joblist { display: grid; grid-template-columns: minmax(0, 1fr); gap: .6rem; }
.hv2-joblist > li { min-width: 0; }

.hv2-jobitem {
    display: flex;
    align-items: center;
    gap: .9rem;
    padding: .85rem;
    border-radius: 14px;
    border: 1px solid var(--hv2-line);
    background: var(--hv2-surface);
    text-decoration: none;
    min-width: 0;
    transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.hv2-jobitem:hover {
    border-color: rgba(var(--hv2-primary-rgb), .45);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px -14px rgba(var(--hv2-primary-rgb), .45);
}

.hv2-joblogo {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid var(--hv2-line);
    display: grid;
    place-items: center;
    overflow: hidden;
    color: var(--hv2-muted);
}
.hv2-joblogo img { display: block; width: auto; height: auto; max-width: 38px; max-height: 38px; object-fit: contain; }

.hv2-jobtext { min-width: 0; flex: 1; display: flex; flex-direction: column; }
.hv2-jobtitle {
    font-size: .925rem;
    font-weight: 600;
    color: var(--hv2-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.hv2-jobmeta {
    font-size: .78rem;
    color: var(--hv2-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.hv2-jobtag {
    flex: 0 0 auto;
    font-size: .7rem;
    font-weight: 600;
    padding: .3rem .6rem;
    border-radius: 999px;
    color: var(--hv2-primary);
    background: rgba(var(--hv2-primary-rgb), .1);
}

.hv2-float {
    position: absolute;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .55rem .9rem;
    border-radius: 12px;
    background: var(--hv2-surface);
    border: 1px solid var(--hv2-line);
    box-shadow: var(--hv2-shadow);
    font-size: .8rem;
    color: var(--hv2-ink);
    white-space: nowrap;
    animation: hv2-bob 6s ease-in-out infinite;
}
.hv2-float-top { top: -18px; right: 24px; }
.hv2-float-bottom { bottom: -20px; left: -18px; animation-delay: -3s; }
.hv2-float-bottom i { color: #16a34a; font-size: 1rem; }
.hv2-float-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 0 4px rgba(34, 197, 94, .18);
}

@keyframes hv2-bob {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

/* Rakamlar */
.hv2-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 4.5rem;
}
.hv2-stat {
    display: flex;
    align-items: center;
    gap: .9rem;
    padding: 1.1rem 1.25rem;
    border-radius: 16px;
    background: var(--hv2-surface);
    border: 1px solid var(--hv2-line);
}
.hv2-stat-icon {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    font-size: 1.15rem;
    color: var(--hv2-primary);
    background: rgba(var(--hv2-primary-rgb), .1);
}
.hv2-stat strong {
    display: block;
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -.02em;
    line-height: 1.1;
    color: var(--hv2-ink);
    font-variant-numeric: tabular-nums;
}
.hv2-stat span:not(.hv2-stat-icon) { font-size: .825rem; color: var(--hv2-muted); }

/* ---------- Logo bandı ---------- */
.hv2-logos { padding: 2.5rem 0 3rem; border-top: 1px solid var(--hv2-line); border-bottom: 1px solid var(--hv2-line); }
.hv2-logos-title {
    text-align: center;
    font-size: .875rem;
    font-weight: 500;
    color: var(--hv2-muted);
    margin-bottom: 1.75rem;
}

.hv2-marquee {
    overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
    margin-bottom: 1.5rem;
}
.hv2-marquee-track {
    display: flex;
    gap: 1rem;
    width: max-content;
    animation: hv2-scroll 70s linear infinite;
}
.hv2-marquee:hover .hv2-marquee-track { animation-play-state: paused; }

.hv2-logo {
    flex: 0 0 auto;
    width: 150px;
    height: 76px;
    display: grid;
    place-items: center;
    padding: .75rem 1rem;
    border-radius: 14px;
    background: #fff;
    border: 1px solid var(--hv2-line);
    transition: border-color .2s ease, box-shadow .2s ease;
}
.hv2-logo img {
    display: block;
    width: auto;
    height: auto;
    max-width: 118px;
    max-height: 48px;
    object-fit: contain;
    filter: grayscale(1);
    opacity: .7;
    transition: filter .25s ease, opacity .25s ease;
}
.hv2-logo:hover { border-color: rgba(var(--hv2-primary-rgb), .4); box-shadow: var(--hv2-shadow); }
.hv2-logo:hover img { filter: none; opacity: 1; }

@keyframes hv2-scroll {
    from { transform: translateX(0); }
    to { transform: translateX(calc(-50% - .5rem)); }
}

/* ---------- Popüler ilanlar (JS ile doldurulan kartlar) ---------- */
.hv2 .jobs-list { --tyn-gutter-y: 0; }
.hv2 .jobs-list .job-card {
    border-radius: var(--hv2-radius);
    border-color: var(--hv2-line);
    box-shadow: none !important;
    height: 100%;
    transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.hv2 .jobs-list .job-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--hv2-shadow) !important;
}
.hv2 .jobs-list .job-card .card-body { padding: 1.25rem; }
.hv2 .jobs-list .job-card .card-footer {
    padding: .9rem 1.25rem;
    border-bottom-left-radius: var(--hv2-radius);
    border-bottom-right-radius: var(--hv2-radius);
    background: transparent !important;
}
.hv2 .jobs-list .job-card .btn-primary { border-radius: 10px; }

/* ---------- Nasıl çalışır ---------- */
.hv2-flow {
    height: 100%;
    display: flex;
    flex-direction: column;
    padding: 2rem;
    border-radius: 22px;
    background: var(--hv2-surface);
    border: 1px solid var(--hv2-line);
}
.hv2-flow-head { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.75rem; }
.hv2-flow-head h3 { font-size: 1.25rem; font-weight: 700; margin: 0; color: inherit; }
.hv2-flow-head p { margin: .15rem 0 0; font-size: .875rem; opacity: .7; }
.hv2-flow-icon {
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    font-size: 1.35rem;
    color: var(--hv2-primary);
    background: rgba(var(--hv2-primary-rgb), .1);
}

.hv2-steps {
    list-style: none;
    counter-reset: hv2step;
    padding: 0;
    margin: 0 0 1.75rem;
    flex: 1;
}
.hv2-steps li {
    counter-increment: hv2step;
    position: relative;
    padding: 0 0 1.4rem 3rem;
}
.hv2-steps li:last-child { padding-bottom: 0; }
.hv2-steps li::before {
    content: counter(hv2step);
    position: absolute;
    left: 0;
    top: 0;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: .85rem;
    font-weight: 700;
    color: var(--hv2-primary);
    background: rgba(var(--hv2-primary-rgb), .1);
}
.hv2-steps li:not(:last-child)::after {
    content: "";
    position: absolute;
    left: calc(1rem - 1px);
    top: 2.35rem;
    bottom: .35rem;
    width: 2px;
    background: rgba(var(--hv2-primary-rgb), .15);
}
.hv2-steps strong { display: block; font-size: 1rem; font-weight: 600; margin-bottom: .2rem; }
.hv2-steps span { display: block; font-size: .9rem; line-height: 1.6; opacity: .75; }
.hv2-flow .btn { border-radius: 12px; padding: .75rem 1rem; font-weight: 600; }

.hv2-flow-dark {
    background: #0f172a;
    border-color: #0f172a;
    color: #e2e8f0;
    background-image: radial-gradient(80% 60% at 100% 0%, rgba(var(--hv2-primary-rgb), .35) 0%, rgba(var(--hv2-primary-rgb), 0) 60%);
}
.hv2-flow-dark .hv2-flow-head h3,
.hv2-flow-dark .hv2-steps strong { color: #fff; }
.hv2-flow-dark .hv2-flow-icon,
.hv2-flow-dark .hv2-steps li::before { color: #fff; background: rgba(255, 255, 255, .12); }
.hv2-flow-dark .hv2-steps li:not(:last-child)::after { background: rgba(255, 255, 255, .15); }

/* ---------- Video ---------- */
.hv2-video {
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 30px 60px -30px rgba(16, 24, 40, .35);
    background: #0f172a;
}
.hv2-video iframe { border: 0; }

/* ---------- SSS ---------- */
.hv2-sticky { position: sticky; top: 140px; }
.hv2-faq { --tyn-accordion-border-color: var(--hv2-line); }
.hv2-faq .accordion-item {
    border: 1px solid var(--hv2-line);
    border-radius: 14px !important;
    margin-bottom: .75rem;
    overflow: hidden;
    background: var(--hv2-surface);
}
.hv2-faq .accordion-button {
    font-size: 1rem;
    font-weight: 600;
    padding: 1.15rem 1.35rem;
    background: transparent;
    box-shadow: none;
}
.hv2-faq .accordion-button:not(.collapsed) { color: var(--hv2-primary); }
.hv2-faq .accordion-body { padding: 0 1.35rem 1.25rem; color: var(--hv2-muted); line-height: 1.7; }

/* ---------- Son çağrı ---------- */
/* Kapanış bandı koyu footer'ın üst kenarına yarı yarıya biner */
.hv2-cta-wrap { padding-bottom: 0; position: relative; z-index: 1; }
body:has(.hv2-cta-wrap) .site-footer { margin-top: -5.5rem; padding-top: 10rem; }
.hv2-soft + .hv2-cta-wrap { background: linear-gradient(var(--hv2-soft) 50%, transparent 50%); padding-top: 0; }
.hv2-final {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 2.75rem 3rem;
    border-radius: 24px;
    color: #fff;
    background:
        radial-gradient(70% 120% at 100% 0%, rgba(255, 255, 255, .18) 0%, rgba(255, 255, 255, 0) 60%),
        linear-gradient(120deg, #0f4fd6 0%, var(--hv2-primary) 60%, #3b82f6 100%);
    box-shadow: 0 30px 60px -30px rgba(var(--hv2-primary-rgb), .7);
}
.hv2-final h2 { color: #fff; font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem); font-weight: 700; letter-spacing: -.02em; margin: 0 0 .4rem; }
.hv2-final p { margin: 0; color: rgba(255, 255, 255, .85); }
.hv2-final-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.hv2-final-actions .btn { border-radius: 12px; font-weight: 600; }
.hv2-final-actions .btn-light { color: var(--hv2-primary); }

/* ---------- Duyarlı ---------- */
@media (max-width: 991.98px) {
    .hv2-hero { padding: 3rem 0 2.5rem; }
    .hv2-section { padding: 3.5rem 0; }
    .hv2-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 3.5rem; }
    .hv2-float-bottom { left: 8px; }
    .hv2-sticky { position: static; }
}

@media (max-width: 575.98px) {
    .hv2-cta .btn { flex: 1 1 100%; }
    .hv2-stat { padding: .9rem; gap: .7rem; }
    .hv2-stat-icon { flex-basis: 38px; width: 38px; height: 38px; font-size: 1rem; }
    .hv2-stat strong { font-size: 1.25rem; }
    .hv2-showcase { padding: 1rem; }
    .hv2-jobtag { display: none; }
    .hv2-float-top { right: 12px; }
    .hv2-flow { padding: 1.5rem; }
    .hv2-final { padding: 2rem 1.5rem; }
    .hv2-final-actions, .hv2-final-actions .btn { width: 100%; }
    .hv2-logo { width: 120px; height: 64px; }
    .hv2-logo img { max-width: 92px; max-height: 40px; }
}

/* Karanlık tema */
[data-bs-theme="dark"] .hv2 .hv2-joblogo,
[data-bs-theme="dark"] .hv2 .hv2-logo { background: #fff; }
[data-bs-theme="dark"] .hv2 .btn-outline-dark { --tyn-btn-color: #e5e7eb; --tyn-btn-border-color: #4b5563; }

/* Hareket azaltma tercihi */
@media (prefers-reduced-motion: reduce) {
    .hv2-marquee-track,
    .hv2-float { animation: none; }
    .hv2-marquee { overflow-x: auto; }
}

/* ==========================================================================
   İç sayfalar (Hakkımızda vb.) — .hv2 tasarım dilinin uzantısı
   ========================================================================== */
.hv2-page-hero {
    position: relative;
    overflow: hidden;
    padding: 3rem 0 3.5rem;
    border-bottom: 1px solid var(--hv2-line);
}
.hv2-breadcrumb { margin-bottom: 1.5rem; font-size: .85rem; }
.hv2-breadcrumb a { color: var(--hv2-muted); text-decoration: none; }
.hv2-breadcrumb a:hover { color: var(--hv2-primary); }
.hv2-page-title {
    font-size: clamp(1.9rem, 1.3rem + 2.4vw, 3rem);
    font-weight: 700;
    letter-spacing: -.03em;
    line-height: 1.12;
    color: var(--hv2-ink);
    max-width: 820px;
    margin: 0 0 1rem;
    position: relative;
    z-index: 0;
}
.hv2-page-hero .hv2-lead { max-width: 720px; }

/* Panelden gelen zengin metin */
.hv2-prose { font-size: 1.05rem; line-height: 1.85; color: var(--hv2-ink); }
.hv2-prose p { margin-bottom: 1.25rem; color: var(--hv2-muted); }
.hv2-prose p:first-child { font-size: 1.2rem; line-height: 1.7; color: var(--hv2-ink); }
.hv2-prose p:empty { display: none; }
.hv2-prose strong { color: var(--hv2-ink); font-weight: 600; }
.hv2-prose a { color: var(--hv2-primary); }

/* Bir bakışta kartı */
.hv2-glance {
    position: sticky;
    top: 120px;
    padding: 1.75rem;
    border-radius: 22px;
    border: 1px solid var(--hv2-line);
    background: var(--hv2-surface);
    box-shadow: var(--hv2-shadow);
}
.hv2-glance-title { font-size: 1.1rem; font-weight: 700; color: var(--hv2-ink); margin-bottom: 1.25rem; }
.hv2-glance-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    margin-bottom: 1.5rem;
}
.hv2-glance-stats > div {
    padding: .9rem 1rem;
    border-radius: 14px;
    background: rgba(var(--hv2-primary-rgb), .06);
}
.hv2-glance-stats strong {
    display: block;
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -.02em;
    color: var(--hv2-ink);
    font-variant-numeric: tabular-nums;
}
.hv2-glance-stats span { font-size: .8rem; color: var(--hv2-muted); }
.hv2-glance-list { list-style: none; padding: 0; margin: 0 0 1.5rem; display: grid; gap: .7rem; }
.hv2-glance-list li { display: flex; gap: .6rem; font-size: .9rem; color: var(--hv2-ink); line-height: 1.5; }
.hv2-glance-list i { color: var(--hv2-primary); flex: 0 0 auto; margin-top: .1rem; }
.hv2-glance .btn { border-radius: 12px; padding: .7rem 1rem; font-weight: 600; }

/* Değer kartları */
.hv2-value {
    height: 100%;
    padding: 1.75rem;
    border-radius: 20px;
    border: 1px solid var(--hv2-line);
    background: var(--hv2-surface);
    transition: transform .2s ease, box-shadow .2s ease;
}
.hv2-value:hover { transform: translateY(-3px); box-shadow: var(--hv2-shadow); }
.hv2-value-icon {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    font-size: 1.35rem;
    color: var(--hv2-primary);
    background: rgba(var(--hv2-primary-rgb), .1);
    margin-bottom: 1.25rem;
}
.hv2-value h3 { font-size: 1.15rem; font-weight: 700; color: var(--hv2-ink); margin-bottom: .5rem; }
.hv2-value p { margin: 0; color: var(--hv2-muted); line-height: 1.65; font-size: .95rem; }

@media (max-width: 991.98px) {
    .hv2-glance { position: static; }
    .hv2-page-hero { padding: 2rem 0 2.5rem; }
}