/* Hero "Karşılama Afişi" (HeroPoster.razor): logo, iki satırlı başlık, giriş, düğmeler, yuvarlak fotoğraf, ikonlu maddeler. Öneki "hp-".
   Renkler bölümün ayarlarından (--hp-*) ya da sitenin tema renklerinden gelir; özel CSS ya da dış yazı tipi gerekmez. */
.hp { --hp-c-text: var(--hp-text, var(--mud-palette-text-primary, #293173)); --hp-c-hi: var(--hp-hi, var(--mud-palette-secondary, #e61d26)); --hp-c-em: var(--hp-em, var(--mud-palette-primary, #55ba50));
    --hp-c-btn: var(--hp-btn, var(--mud-palette-secondary, #f7931d)); --hp-c-bg: var(--hp-bg, color-mix(in srgb, var(--mud-palette-primary, #55ba50) 9%, #fff));
    position: relative; overflow: hidden; color: var(--hp-c-text); padding: clamp(40px, 6vw, 80px) 0 0;
    background: radial-gradient(circle at 12% 18%, rgba(255,255,255,.9) 0 6%, transparent 7%), radial-gradient(circle at 92% 8%, rgba(255,255,255,.8) 0 5%, transparent 6%),
        radial-gradient(circle at 6% 62%, rgba(255,255,255,.7) 0 4%, transparent 5%), linear-gradient(180deg, var(--hp-c-bg) 0%, color-mix(in srgb, var(--hp-c-bg) 45%, #fff) 100%); }
.hp-top { display: grid; grid-template-columns: 1.05fr .95fr; gap: 32px; align-items: center; }
.hp-top.hp-single { grid-template-columns: 1fr; }
.hp-logo { display: block; width: min(520px, 94%); height: auto; margin: 0 0 18px -6px; }
.hp-eyebrow { display: inline-block; margin: 0 0 16px; padding: 7px 15px; border-radius: 999px; font-size: .76rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; background: rgba(255,255,255,.8); }
.pv-hero .hp-title { margin: 0; font-weight: 900; line-height: 1.02; font-size: clamp(40px, 6vw, 72px); letter-spacing: -.5px; color: var(--hp-c-text); }
.pv-hero .hp-title span { display: block; color: var(--hp-c-hi); }
.hp-line { display: block; width: min(330px, 80%); height: 34px; margin: 6px 0 18px; }
.hp-lead { margin: 0 0 14px; font-weight: 800; font-size: clamp(18px, 2vw, 24px); line-height: 1.35; text-transform: uppercase; }
.hp-lead b { color: var(--hp-c-em); }
.hp-text { margin: 0 0 24px; max-width: 520px; font-size: clamp(16px, 1.6vw, 19px); line-height: 1.6; }
.hp-text b { color: var(--hp-c-hi); font-weight: 800; }
.hp-btns { display: flex; flex-wrap: wrap; gap: 12px; }
.hp-btn { display: inline-block; padding: 14px 28px; border-radius: 999px; font-size: 16px; font-weight: 800; text-decoration: none; transition: transform .15s; }
.hp-btn:hover { transform: translateY(-2px); }
.hp-b1 { background: var(--hp-c-btn); color: #fff; box-shadow: 0 8px 20px color-mix(in srgb, var(--hp-c-btn) 35%, transparent); }
.hp-b2 { background: #fff; color: var(--hp-c-text); border: 2px solid color-mix(in srgb, var(--hp-c-text) 18%, #fff); }
.hp-facts { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 22px 0 0; padding: 0; list-style: none; font-size: .9rem; font-weight: 700; }
.hp-facts li::before { content: "✓"; margin-right: 7px; color: var(--hp-c-em); font-weight: 900; }
.hp-photo { position: relative; justify-self: center; width: min(460px, 92%); }
.hp-photo::before { content: ""; position: absolute; inset: -18px; border-radius: 50%; border: 5px solid transparent; border-top-color: color-mix(in srgb, var(--hp-c-text) 30%, #fff); border-left-color: color-mix(in srgb, var(--hp-c-text) 20%, #fff); border-bottom-color: color-mix(in srgb, var(--hp-c-text) 12%, #fff); transform: rotate(-18deg); }
.hp-photo::after { content: ""; position: absolute; inset: -34px -26px -26px -34px; border-radius: 50%; border: 3px solid color-mix(in srgb, var(--hp-c-text) 12%, #fff); border-right-color: transparent; transform: rotate(10deg); }
.hp-photo img { position: relative; z-index: 1; display: block; width: 100%; aspect-ratio: 1 / 1.18; object-fit: cover; object-position: 50% 30%; border-radius: 50%; box-shadow: 0 24px 50px rgba(40,50,110,.22); }
.hp-icons { display: grid; grid-template-columns: repeat(var(--hp-cols, 5), 1fr); gap: 18px; margin: 46px 0 40px; text-align: center; }
.hp-ic { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.hp-ic i { display: grid; place-items: center; width: 104px; height: 104px; border-radius: 50%; overflow: hidden; box-shadow: 0 8px 20px rgba(31,43,92,.08); }
.hp-ic i img { width: 100%; height: 100%; object-fit: cover; }
.hp-ic svg { width: 52px; height: 52px; }
.hp-ic span { max-width: 160px; font-size: 15px; font-weight: 800; line-height: 1.3; text-transform: uppercase; }
.hp-ic small { max-width: 180px; font-size: .85rem; line-height: 1.45; opacity: .8; }
@media (max-width: 860px) { .hp-top { grid-template-columns: 1fr; } .hp-photo { order: -1; margin-top: 8px; } .hp-icons { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 520px) { .hp-icons { grid-template-columns: repeat(2, 1fr); } .hp-ic i { width: 88px; height: 88px; } }