/* Avrupa Kargo / v1.0.1 — responsive, panelvan-first hero.
 * This file is intentionally loaded after main.css so existing card and inner-page
 * styles remain unchanged. All slider copy and images are still editable in admin.
 */
.ak-hero {
    height: clamp(500px, 38.5vw, 645px);
    min-height: 500px;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background: #071d3a;
}
.ak-slide { overflow: hidden; }
.ak-hero-photo {
    inset: 0;
    width: 100%;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: -2;
}
.ak-hero-overlay {
    background:
        linear-gradient(90deg,
            rgba(4, 24, 52, .90) 0%,
            rgba(4, 24, 52, .69) 24%,
            rgba(4, 24, 52, .29) 45%,
            rgba(4, 24, 52, .04) 67%,
            transparent 100%),
        linear-gradient(0deg, rgba(3, 18, 39, .13), transparent 35%);
}
.ak-hero .ak-slide-content {
    width: min(1470px, calc(100% - 144px));
    align-items: center;
    padding-bottom: 55px;
}
.ak-hero-copy {
    width: min(610px, 54%);
    padding-top: 0;
    position: relative;
    z-index: 1;
}
.ak-hero-badge {
    font-size: clamp(21px, 1.7vw, 27px);
    padding: 5px 17px 7px;
    border-radius: 12px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: -.035em;
}
.ak-hero h1,
.ak-hero h2.ak-slide-title {
    font-size: clamp(42px, 3.65vw, 62px);
    font-weight: 800;
    line-height: 1.075;
    letter-spacing: -.052em;
    margin: 14px 0 20px;
    text-wrap: balance;
    text-shadow: 0 2px 7px rgba(0, 10, 25, .15);
}
.ak-hero-desc {
    max-width: 450px;
    padding-left: 18px;
    border-left-width: 5px;
    margin: 0 0 26px;
    font-size: clamp(16px, 1.3vw, 20px);
    line-height: 1.45;
    font-weight: 600;
}
.ak-hero-actions { gap: 15px; flex-wrap: wrap; }
.ak-hero-actions .ak-btn {
    font-size: 14px;
    min-height: 48px;
    padding: 12px 19px;
    border-radius: 9px;
    gap: 10px;
    box-shadow: 0 7px 18px rgba(0, 0, 0, .15);
}
.ak-hero-actions .ak-btn .ak-icon { width: 18px; height: 18px; }
.ak-slider-arrow {
    top: 47%;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.15);
    background: rgba(46,70,100,.67);
    font-size: 40px;
    line-height: 1;
    padding: 0 0 6px;
    transition: background .2s, transform .2s;
}
.ak-slider-arrow:hover { background: var(--ak-orange); transform: scale(1.05); }
.ak-slider-prev { left: 20px; }
.ak-slider-next { right: 20px; }
.ak-slider-dots { bottom: 68px; gap: 10px; }
.ak-dot { width: 12px; height: 12px; }
.ak-slider-arrow:focus-visible,
.ak-dot:focus-visible,
.ak-hero-actions .ak-btn:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 3px;
}
/* Floating trust strip: more breathing room without modifying the four benefits. */
.ak-benefits { margin-top: -48px; }
.ak-benefit-panel {
    min-height: 95px;
    padding: 19px 22px;
    border-radius: 16px;
    box-shadow: 0 16px 35px rgba(3, 32, 58, .17);
}
.ak-benefit { min-height: 54px; gap: 14px; }
.ak-benefit strong { font-size: 15px; }
.ak-benefit span:not(.ak-benefit-icon) { font-size: 11px; }
.ak-benefit-icon .ak-icon { width: 43px; height: 43px; }

@media (max-width: 1100px) {
    .ak-hero .ak-slide-content { width: calc(100% - 126px); }
    .ak-hero-copy { width: min(590px, 60%); }
    .ak-hero h1,
    .ak-hero h2.ak-slide-title { font-size: clamp(40px, 4.4vw, 49px); }
    .ak-benefit { gap: 10px; }
    .ak-benefit strong { font-size: 13px; }
    .ak-benefit span:not(.ak-benefit-icon) { font-size: 10px; }
}
@media (max-width: 900px) {
    .ak-hero { height: 515px; min-height: 515px; }
    .ak-hero .ak-slide-content { width: calc(100% - 90px); padding-bottom: 40px; }
    .ak-hero-copy { width: min(510px, 68%); }
    .ak-hero h1,
    .ak-hero h2.ak-slide-title { font-size: clamp(36px, 5.1vw, 46px); }
    .ak-hero-photo { background-position: 54% center; }
    .ak-benefits { margin-top: -34px; }
    .ak-benefit-panel { padding: 16px; min-height: 80px; }
    .ak-slider-arrow { top: 74%; width: 36px; height: 36px; font-size: 30px; }
    .ak-slider-prev { left: 4px; }
    .ak-slider-next { right: 4px; }
    .ak-slider-dots { bottom: 55px; }
}
@media (max-width: 650px) {
    .ak-hero { height: 590px; min-height: 590px; }
    .ak-hero-photo { background-position: 61% center; opacity: .9; }
    .ak-hero-overlay {
        background:
            linear-gradient(90deg, rgba(4,22,47,.94), rgba(4,25,53,.78) 58%, rgba(3,19,45,.3)),
            linear-gradient(0deg, rgba(3,19,45,.65), transparent 44%);
    }
    .ak-hero .ak-slide-content {
        width: calc(100% - 40px);
        align-items: flex-start;
        padding: 42px 0 72px;
    }
    .ak-hero-copy { width: 100%; max-width: 500px; }
    .ak-hero-badge { font-size: 21px; padding: 5px 12px 7px; }
    .ak-hero h1,
    .ak-hero h2.ak-slide-title {
        font-size: clamp(32px, 7.6vw, 43px);
        line-height: 1.1;
        margin: 14px 0 16px;
        letter-spacing: -.047em;
    }
    .ak-hero-desc { font-size: 15px; line-height: 1.45; max-width: 350px; margin-bottom: 21px; }
    .ak-hero-actions { gap: 10px; }
    .ak-hero-actions .ak-btn { min-height: 44px; font-size: 12px; padding: 10px 13px; }
    .ak-slider-arrow { width: 34px; height: 34px; top: 68%; font-size: 29px; padding-bottom: 4px; }
    .ak-slider-prev { left: 5px; }
    .ak-slider-next { right: 5px; }
    .ak-slider-dots { bottom: 32px; gap: 9px; }
    .ak-benefits { margin-top: -20px; }
    .ak-benefit-panel { min-height: 80px; padding: 12px; border-radius: 12px; }
    .ak-benefit { min-height: 45px; }
    .ak-benefit-icon .ak-icon { width: 30px; height: 30px; }
    .ak-benefit strong { font-size: 11px; }
    .ak-benefit span:not(.ak-benefit-icon) { font-size: 9px; }
}
@media (max-width: 440px) {
    .ak-hero { height: 605px; min-height: 605px; }
    .ak-hero .ak-slide-content { width: calc(100% - 34px); padding-top: 32px; }
    .ak-hero h1,
    .ak-hero h2.ak-slide-title { font-size: clamp(29px, 7.7vw, 36px); }
    .ak-hero-actions { display: flex; flex-direction: column; align-items: flex-start; }
    .ak-hero-actions .ak-btn { white-space: normal; max-width: 100%; }
    .ak-slider-arrow { top: 75%; }
    .ak-hero-photo { background-position: 62% center; }
}
@media (max-width: 360px) {
    .ak-hero { height: 620px; min-height: 620px; }
    .ak-hero h1,
    .ak-hero h2.ak-slide-title { font-size: 29px; }
}
