/* ========================================
   PRIJATELJSKI KRUG — ISTAKNUTI PROJEKT v1.7
======================================== */
.pk-featured {
    --pk-navy: #062b57;
    --pk-red: #b5121b;
    width: 100%;
    padding: 10px 0 34px;
    background: #fff;
}

.pk-featured__card {
    position: relative;
    width: min(1440px, calc(100% - 72px));
    min-height: 470px;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 24px;
    background: #f8f4ed;
    box-shadow: 0 16px 40px rgba(6,43,87,.07);
}

.pk-featured__bg {
    position: absolute;
    inset: 0 0 0 39%;
    width: 61%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    image-rendering: auto;
    backface-visibility: hidden;
}

.pk-featured__veil {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, #f8f4ed 0%, #f8f4ed 37%, rgba(248,244,237,.94) 44%, rgba(248,244,237,.55) 53%, rgba(248,244,237,.08) 66%, rgba(248,244,237,0) 78%),
        linear-gradient(0deg, rgba(248,244,237,.82) 0%, rgba(248,244,237,.22) 23%, rgba(248,244,237,0) 53%);
    z-index: 1;
    pointer-events: none;
}

.pk-featured__content {
    position: relative;
    z-index: 2;
    min-height: 470px;
    padding: 34px 34px 30px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 236px;
    gap: 24px;
    align-items: stretch;
}

.pk-featured__main { min-width: 0; }

.pk-featured__eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 13px;
    border-radius: 4px;
    background: var(--pk-red);
    color: #fff;
    font-size: 13px;
    font-weight: 850;
    letter-spacing: .02em;
}

.pk-featured__title {
    margin: 10px 0 0;
    color: var(--pk-navy);
    font-size: clamp(38px, 4vw, 60px);
    line-height: .96;
    letter-spacing: -.045em;
    font-weight: 900;
}

.pk-featured__script {
    margin: 7px 0 0;
    color: var(--pk-red);
    font-family: "Segoe Script", "Brush Script MT", "URW Chancery L", cursive;
    font-size: clamp(24px, 2.2vw, 35px);
    line-height: 1.1;
}

.pk-featured__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 28px;
    margin-top: 17px;
    color: var(--pk-navy);
    font-size: 15px;
}

.pk-featured__meta span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.pk-featured__meta svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: var(--pk-red);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.pk-featured__lead {
    width: min(560px, 54%);
    margin: 15px 0 0;
    color: #173252;
    font-size: 14px;
    line-height: 1.5;
}

.pk-featured__activities {
    display: grid;
    grid-template-columns: repeat(8, minmax(65px, 1fr));
    gap: 11px;
    width: min(980px, calc(100% - 10px));
    margin-top: 28px;
}

.pk-activity {
    text-align: center;
    color: var(--pk-navy);
    font-size: 11px;
    line-height: 1.2;
    font-weight: 750;
}

.pk-activity__icon {
    width: 47px;
    height: 47px;
    margin: 0 auto 7px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 23px;
    line-height: 1;
    box-shadow: 0 7px 16px rgba(6,43,87,.12);
}
.pk-activity--green .pk-activity__icon { background:#57985b; }
.pk-activity--orange .pk-activity__icon { background:#d96c0b; }
.pk-activity--blue .pk-activity__icon { background:#0d5fa8; }
.pk-activity--purple .pk-activity__icon { background:#6543a8; }
.pk-activity--lime .pk-activity__icon { background:#79a827; }
.pk-activity--gold .pk-activity__icon { background:#eca800; }
.pk-activity--red .pk-activity__icon { background:#b5121b; }
.pk-activity--navy .pk-activity__icon { background:#0a568e; }

.pk-featured__actions {
    align-self: end;
    display: grid;
    gap: 9px;
    padding-bottom: 6px;
}

.pk-featured__btn {
    min-height: 47px;
    padding: 8px 18px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 14px;
    line-height: 1.08;
    font-weight: 850;
    text-decoration: none !important;
    transition: transform .18s ease, box-shadow .18s ease;
    box-shadow: 0 6px 14px rgba(6,43,87,.08);
}
.pk-featured__btn:hover { transform: translateY(-2px); }
.pk-featured__btn--red { background: var(--pk-red); color:#fff !important; }
.pk-featured__btn--white { background:#fff; color:var(--pk-navy) !important; border:1.5px solid var(--pk-navy); }
.pk-featured__btn--navy { background:var(--pk-navy); color:#fff !important; }

@media (max-width: 1180px) {
    .pk-featured__card { width: min(100% - 40px, 1100px); }
    .pk-featured__content { grid-template-columns: 1fr 210px; }
    .pk-featured__activities { grid-template-columns: repeat(4, 1fr); width: min(660px, 70%); }
    .pk-featured__lead { width: min(580px, 66%); }
}

@media (max-width: 820px) {
    .pk-featured__card { width: min(100% - 24px, 700px); min-height: 0; }
    .pk-featured__bg { position: relative; inset:auto; width:100%; height:290px; object-position:center; display:block; }
    .pk-featured__veil {
        background: linear-gradient(0deg, #f8f4ed 0%, rgba(248,244,237,.92) 7%, rgba(248,244,237,0) 32%);
    }
    .pk-featured__content {
        min-height: 0;
        margin-top: -160px;
        padding: 24px;
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .pk-featured__main { padding-top: 150px; }
    .pk-featured__lead { width:100%; }
    .pk-featured__activities { width:100%; grid-template-columns: repeat(4,1fr); }
    .pk-featured__actions { grid-template-columns: 1fr 1fr 1fr; padding:0; }
    .pk-featured__btn { border-radius:14px; }
}

@media (max-width: 560px) {
    .pk-featured__content { padding:18px; }
    .pk-featured__title { font-size: clamp(36px, 12vw, 48px); }
    .pk-featured__script { font-size: 25px; }
    .pk-featured__meta { display:grid; gap:9px; }
    .pk-featured__activities { grid-template-columns: repeat(2,1fr); gap:16px 10px; }
    .pk-featured__actions { grid-template-columns:1fr; }
}

/* v1.7: cleaner large-screen rendering and a taller featured project */
@media (min-width: 1181px) {
    .pk-featured__card,
    .pk-featured__content {
        min-height: 470px;
    }

    .pk-featured__bg {
        object-position: center 48%;
    }
}
