/* Kocabay V5 — authentic photography, industrial editorial rhythm */
:root{
    --v5-paper:#f4f1eb;
    --v5-cream:#e9e3d9;
    --v5-ink:#151817;
    --v5-steel:#5b625f;
    --v5-orange:#f36a21;
}

.public-v5{background:var(--v5-paper)}
.public-v5 .v4-header{border-bottom-color:rgba(255,255,255,.14)}
.public-v5 .v4-header.is-scrolled{border-bottom-color:rgba(255,255,255,.12);background:rgba(21,24,23,.96)}

/* First viewport: the real photograph is the primary material. */
.public-v5 .v4-hero{min-height:max(820px,100svh);border-bottom:1px solid rgba(255,255,255,.12)}
.public-v5 .v4-hero__slide{overflow:hidden}
.public-v5 .v4-hero__slide img{filter:saturate(.84) contrast(1.06);transform:scale(1.035);transition:filter .5s ease}
.public-v5 .v4-hero__slide--one img{object-position:center 54%}
.public-v5 .v4-hero__slide--two img{object-position:center 42%}
.public-v5 .v4-hero__slide--three img{object-position:center 48%}
.public-v5 .v4-hero__shade{
    background:
        linear-gradient(90deg,rgba(11,13,12,.94) 0%,rgba(11,13,12,.78) 39%,rgba(11,13,12,.26) 70%,rgba(11,13,12,.08) 100%),
        linear-gradient(0deg,rgba(10,12,11,.76) 0%,transparent 48%);
}
.public-v5 .v4-hero__content{width:min(1040px,74vw);padding-left:clamp(1.2rem,7vw,8rem)}
.public-v5 .v4-overline{display:inline-flex;align-items:center;gap:.7rem;padding:.65rem .8rem;background:rgba(15,18,17,.66);backdrop-filter:blur(10px)}
.public-v5 .v4-overline::before{content:"";width:22px;height:2px;background:var(--v5-orange)}
.public-v5 .v4-hero h1{max-width:940px;text-shadow:0 2px 24px rgba(0,0,0,.16)}
.public-v5 .v4-hero__content>p{max-width:630px;color:rgba(255,255,255,.82)}

.v5-hero-proof{position:absolute;z-index:3;right:clamp(2rem,5vw,6rem);top:50%;display:grid;width:250px;padding:1.2rem 1.3rem;color:#fff;border-top:3px solid var(--v5-orange);background:rgba(18,21,20,.82);backdrop-filter:blur(14px);transform:translateY(-50%)}
.v5-hero-proof small{color:#f5a06f;font-size:.58rem;font-weight:950;letter-spacing:.14em}
.v5-hero-proof strong{margin-top:1.2rem;font:750 1.35rem/1.05 "Bahnschrift",sans-serif}
.v5-hero-proof span{margin-top:.55rem;color:rgba(255,255,255,.58);font-size:.66rem}

.public-v5 .v4-service-strip{position:relative;z-index:4;width:min(1400px,calc(100% - 4rem));margin:-54px auto 0;padding:0;background:#fff;box-shadow:0 24px 70px rgba(22,26,24,.12)}
.public-v5 .v4-service-strip article{min-height:108px;padding:1.35rem 1.5rem;border-color:#e6e2db}
.public-v5 .v4-service-strip article>span{display:grid;place-items:center;width:34px;height:34px;color:#fff;background:var(--v5-orange)}
.public-v5 .v4-service-strip small{color:#747b77}

/* Company profile: editorial image crop with a technical detail inset. */
.public-v5 .v4-profile{padding-top:clamp(7rem,11vw,11rem)}
.public-v5 .v4-profile__visual{min-height:700px}
.public-v5 .v4-profile__image{box-shadow:none}
.public-v5 .v4-profile__image--main{inset:0 8% 0 0;border:1px solid rgba(21,24,23,.12)}
.public-v5 .v4-profile__image--main img{object-position:center 38%}
.public-v5 .v4-profile__image--detail{left:auto;right:0;top:auto;bottom:8%;width:31%;height:48%;border:8px solid var(--v5-paper);box-shadow:0 20px 46px rgba(21,24,23,.18)}
.public-v5 .v4-profile__image--detail img{object-position:center 38%}
.public-v5 .v4-profile__visual::after{content:"GERÇEK İŞ AKIŞI";position:absolute;left:-1.4rem;bottom:2rem;padding:.6rem .75rem;color:#fff;background:var(--v5-ink);font-size:.55rem;font-weight:950;letter-spacing:.15em;writing-mode:vertical-rl;transform:rotate(180deg)}
.public-v5 .v4-profile__stamp{right:5%;bottom:auto;top:8%;width:118px;height:118px;box-shadow:none}

/* Product groups become photo-led catalogue covers instead of abstract tiles. */
.public-v5 .v4-categories{background:#e9e5de}
.public-v5 .v4-category-card{--v5-photo:url('../images/photo-depo-operasyon.webp');min-height:310px;color:#fff!important;background:#1d211f;box-shadow:0 1px 0 rgba(21,24,23,.08)}
.public-v5 .v4-category-card:nth-child(6n+1){--v5-photo:url('../images/photo-aydinlatma-detay.webp')}
.public-v5 .v4-category-card:nth-child(6n+2){--v5-photo:url('../images/photo-elektrik-paneli.webp')}
.public-v5 .v4-category-card:nth-child(6n+3){--v5-photo:url('../images/photo-depo-operasyon.webp')}
.public-v5 .v4-category-card:nth-child(6n+4){--v5-photo:url('../images/photo-depo-personeli.webp')}
.public-v5 .v4-category-card:nth-child(6n+5){--v5-photo:url('../images/photo-sevkiyat-hazirlik.webp')}
.public-v5 .v4-category-card:nth-child(6n+6){--v5-photo:url('../images/photo-aydinlatma-detay.webp')}
.public-v5 .v4-category-card::before{z-index:-2;background:linear-gradient(180deg,rgba(13,15,14,.04) 20%,rgba(13,15,14,.92) 100%),var(--v5-photo) center/cover no-repeat;transform:scale(1.015);transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .4s ease}
.public-v5 .v4-category-card::after{z-index:-1;left:0;right:auto;top:auto;bottom:0;width:4px;height:100%;border:0;border-radius:0;background:var(--v5-orange)}
.public-v5 .v4-category-card:hover::before{filter:saturate(1.04);transform:scale(1.065)}
.public-v5 .v4-category-card__number{position:relative;z-index:1;display:grid;place-items:center;width:34px;height:34px;background:rgba(15,18,17,.76);backdrop-filter:blur(8px)}
.public-v5 .v4-category-card>div:not(.v4-category-card__line){position:relative;z-index:1;max-width:80%}
.public-v5 .v4-category-card h3{text-shadow:0 2px 18px rgba(0,0,0,.24)}
.public-v5 .v4-category-card p{color:rgba(255,255,255,.72)}
.public-v5 .v4-category-card>a,.public-v5 .v4-category-card--4>a{z-index:2;color:#fff;border-color:rgba(255,255,255,.5);background:rgba(15,18,17,.48);backdrop-filter:blur(8px)}
.public-v5 .v4-category-card__line{display:none}

/* A dedicated photographic chapter breaks the UI-heavy sections. */
.v5-story{display:grid;grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr);gap:clamp(3rem,8vw,9rem);align-items:center;padding:clamp(6rem,10vw,10rem) clamp(1.2rem,5vw,5rem);background:var(--v5-paper)}
.v5-story__intro{align-self:start;position:sticky;top:130px;max-width:570px;padding-top:2rem}
.v5-story__intro h2{margin:1rem 0 1.5rem;font:740 clamp(3rem,5.1vw,6.4rem)/.9 "Bahnschrift","Arial Narrow",sans-serif;letter-spacing:-.055em}
.v5-story__intro h2 em{color:var(--v5-orange);font-style:normal;font-weight:400}
.v5-story__intro p{max-width:520px;margin:0;color:#656c68;font-size:.92rem;line-height:1.8}
.v5-story__gallery{display:grid;grid-template-columns:1.18fr .82fr;grid-template-rows:420px 330px;gap:1rem}
.v5-story__frame{position:relative;min-width:0;margin:0;overflow:hidden;background:#232725}
.v5-story__frame img{width:100%;height:100%;object-fit:cover;filter:saturate(.85);transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .4s ease}
.v5-story__frame:hover img{filter:saturate(1);transform:scale(1.035)}
.v5-story__frame::after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(0deg,rgba(10,12,11,.92),transparent)}
.v5-story__frame figcaption{position:absolute;z-index:2;left:1.3rem;right:1.3rem;bottom:1.2rem;display:grid;grid-template-columns:30px 1fr;column-gap:.8rem;color:#fff}
.v5-story__frame figcaption span{grid-row:1/3;color:#ff8a49;font-size:.6rem;font-weight:950;letter-spacing:.12em}
.v5-story__frame figcaption strong{font:720 1.25rem/1 "Bahnschrift",sans-serif}
.v5-story__frame figcaption small{margin-top:.35rem;color:rgba(255,255,255,.64);font-size:.66rem}
.v5-story__frame--warehouse{grid-row:1/3}
.v5-story__frame--warehouse img{object-position:center}
.v5-story__frame--worker img{object-position:center}
.v5-story__frame--light img{object-position:center 42%}

.public-v5 .v4-portal{border-top:1px solid rgba(255,255,255,.08)}
.public-v5 .v4-workspace__bar{border-bottom:3px solid var(--v5-orange)}
.public-v5 .v4-flow{background:#fbfaf7}
.public-v5 .v4-advantages{background:#e65f18}

.public-v5 .v4-final-cta{position:relative;isolation:isolate;overflow:hidden;color:#fff;background:#171a19}
.public-v5 .v4-final-cta::before{content:"";position:absolute;z-index:-2;inset:0 0 0 55%;background:url('../images/photo-aydinlatma-detay.webp') center/cover no-repeat;filter:saturate(.82)}
.public-v5 .v4-final-cta::after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,#171a19 0%,#171a19 50%,rgba(23,26,25,.42) 76%,rgba(23,26,25,.12))}
.public-v5 .v4-final-cta h2{max-width:820px}
.public-v5 .v4-final-cta .v4-text-link{color:#fff}

/* Authentication and application screens share the same photographic language. */
.public-v5--login .auth-shell{outline:1px solid rgba(21,24,23,.09)}
.public-v5--login .auth-visual img{filter:saturate(.8) contrast(1.04);object-position:center}
.public-v5--login .auth-visual::after{background:linear-gradient(0deg,rgba(10,12,11,.94) 0%,rgba(10,12,11,.16) 70%),linear-gradient(90deg,rgba(10,12,11,.25),transparent)}
.public-v5--login .auth-visual::before{content:"DEPO · SAHA · BAYİ";position:absolute;z-index:2;right:1.4rem;top:1.4rem;padding:.7rem .8rem;color:#fff;border-top:2px solid var(--v5-orange);background:rgba(15,18,17,.68);font-size:.56rem;font-weight:950;letter-spacing:.14em;backdrop-filter:blur(10px)}
.public-v5--login .auth-role-line span{background:rgba(15,18,17,.38);backdrop-filter:blur(8px)}
.public-v5--application .application-hero::before{background:linear-gradient(90deg,rgba(15,18,17,.96) 0%,rgba(15,18,17,.78) 43%,rgba(15,18,17,.28) 100%),url('../images/photo-depo-operasyon.webp') center 52%/cover no-repeat}

@media(max-width:1100px){
    .v5-hero-proof{display:none}
    .public-v5 .v4-service-strip{width:calc(100% - 2rem)}
    .public-v5 .v4-profile__visual{min-height:630px}
    .v5-story{grid-template-columns:1fr;gap:3rem}
    .v5-story__intro{position:static;max-width:780px}
    .v5-story__gallery{grid-template-rows:360px 300px}
    .public-v5 .v4-final-cta::before{left:48%}
}

@media(max-width:680px){
    .public-v5 .v4-hero{min-height:780px}
    .public-v5 .v4-hero__slide--one img{object-position:60% center}
    .public-v5 .v4-hero__slide--two img{object-position:56% center}
    .public-v5 .v4-hero__slide--three img{object-position:52% center}
    .public-v5 .v4-hero__shade{background:linear-gradient(0deg,rgba(11,13,12,.97) 0%,rgba(11,13,12,.79) 60%,rgba(11,13,12,.26) 100%)}
    .public-v5 .v4-hero__content{padding-bottom:9.2rem}
    .public-v5 .v4-overline{font-size:.56rem}
    .public-v5 .v4-service-strip{width:100%;margin:0;box-shadow:none}
    .public-v5 .v4-service-strip article{min-height:100px;padding-inline:1rem}
    .public-v5 .v4-profile__visual{min-height:470px}
    .public-v5 .v4-profile__image--main{inset:0 0 0 6%}
    .public-v5 .v4-profile__image--detail{right:auto;left:0;width:38%;height:46%;border-width:5px}
    .public-v5 .v4-profile__stamp{right:0;top:7%;width:88px;height:88px}
    .public-v5 .v4-profile__visual::after{left:-.7rem;bottom:1rem}
    .public-v5 .v4-category-card{min-height:290px}
    .v5-story{padding:4.5rem 1rem}
    .v5-story__intro{padding-top:0}
    .v5-story__intro h2{font-size:clamp(3rem,14vw,4.4rem)}
    .v5-story__gallery{grid-template-columns:1fr;grid-template-rows:420px 250px 300px}
    .v5-story__frame--warehouse{grid-row:auto}
    .v5-story__frame--worker img{object-position:62% center}
    .public-v5 .v4-final-cta{padding-top:21rem;background:#171a19}
    .public-v5 .v4-final-cta::before{inset:0 0 auto;height:18rem}
    .public-v5 .v4-final-cta::after{background:linear-gradient(0deg,#171a19 0%,#171a19 56%,rgba(23,26,25,.08) 100%)}
    .public-v5--login .auth-visual img{object-position:62% center}
    .public-v5--login .auth-visual::before{right:.8rem;top:.8rem}
    .public-v5--application .application-hero::before{background:linear-gradient(0deg,rgba(15,18,17,.95) 0%,rgba(15,18,17,.66) 62%,rgba(15,18,17,.2) 100%),url('../images/photo-depo-operasyon.webp') 60% center/cover no-repeat}
}

@media(max-width:380px){
    .public-v5 .v4-hero{min-height:760px}
    .v5-story__gallery{grid-template-rows:360px 220px 260px}
    .v5-story__frame figcaption{left:1rem;right:1rem;bottom:1rem}
}

@media(prefers-reduced-motion:reduce){
    .public-v5 .v4-category-card::before,.v5-story__frame img{transition:none}
    .public-v5 .v4-category-card:hover::before,.v5-story__frame:hover img{transform:none}
}