:root{--orange:#F78207;--dark:#20252a;--muted:#6b737a;--border:#e6e1dc;--cream:#fff8f0}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#f7f7f7;color:var(--dark);font-family:Arial,Helvetica,sans-serif}
.nakliyat-page{max-width:1180px;margin:auto;padding-bottom:40px}
.nakliyat-hero{background:linear-gradient(135deg,#fff4e6,#fff);padding:70px 28px;border-radius:0 0 28px 28px}
.hero-inner{max-width:800px}.badge{color:var(--orange);font-size:12px;font-weight:800;letter-spacing:2px}
.nakliyat-hero h1{font-size:clamp(34px,5vw,62px);line-height:1.05;margin:16px 0}
.nakliyat-hero p{font-size:19px;color:var(--muted);max-width:680px;line-height:1.6}
.hero-brand {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 34px;
}

.hero-logo {
    width: 150px;
    max-width: 42vw;
    height: auto;
    object-fit: contain;
}

.brand-text {
    display: flex;
    flex-direction: column;
    gap: 5px;
    border-left: 1px solid #ddd;
    padding-left: 14px;
}

.brand-text strong {
    color: #20252a;
    font-size: 15px;
    letter-spacing: 1px;
}

.brand-text span {
    color: #777;
    font-size: 12px;
}

.nakliyat-hero h1 {
    max-width: 780px;
    color: #20252a;
    font-weight: 700;
}

.nakliyat-hero h1 strong {
    display: block;
    color: #F78207;
    font-weight: 900;
}

.nakliyat-hero p {
    max-width: 680px;
    font-size: 18px;
    line-height: 1.65;
}

.hero-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px;
    margin-top: 28px;
}

.hero-button {
    box-shadow: 0 8px 18px rgba(247, 130, 7, .24);
    transition: .2s ease;
}

.hero-button:hover {
    background: #d96d00;
    transform: translateY(-2px);
}

.hero-note {
    color: #626262;
    font-size: 13px;
    font-weight: 600;
}
.hero-button,.calculate-button,.whatsapp-button{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:9px;background:var(--orange)
;color:#fff;text-decoration:none;font-weight:800;padding:15px 22px;cursor:pointer;font-size:16px}
.calculator-wrap {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 28px;
}

.calculator-card {
    width: 100%;
}

.result-card {
    width: 100%;
    position: static;
}
.calculator-card,.result-card,.info-section{background:#fff;border:1px solid var(--border);border-radius:18px;padding:26px;box-shadow:0 8px 24px #23170b0d}
.card-title{display:flex;gap:13px;align-items:flex-start}
.card-title>span{background:var(--orange);color:#fff;font-weight:800;border-radius:50%;width:30px;height:30px;display:grid;place-items:center;flex:0 0 30px}
.card-title h2{font-size:24px;margin:0 0 4px}
.card-title p{margin:0;color:var(--muted)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px;margin:25px 0}
label{font-size:14px;font-weight:700;display:flex;flex-direction:column;gap:7px}
select,input{height:48px;border:1px solid #d4d0cc;border-radius:8px;background:#fff;padding:0 12px;font:inherit;color:var(--dark)}
select:focus,input:focus{outline:3px solid #f7820730;border-color:var(--orange)}
.calculate-button{width:100%}.small-note{font-size:12px;color:var(--muted);margin:13px 0 0}
.result-card{height:max-content;position:sticky;top:18px;background:var(--cream)}
.empty-result{margin-top:28px;border:1px dashed #d9c5b2;border-radius:10px;padding:24px;color:var(--muted);text-align:center}
.price-label{font-size:14px;color:var(--muted);margin-top:25px}
.price{font-size:31px;font-weight:900;color:var(--orange);margin:7px 0 15px}
.result-summary{font-size:14px;line-height:1.7}
.whatsapp-button{background:#159447;width:100%;margin-top:15px}
.info-section{margin:0 28px}.info-section h2{margin-top:0}
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.info-grid p{color:var(--muted);line-height:1.55}@media(max-width:800px){.nakliyat-hero{padding:45px 20px;border-radius:0 0 20px 20px}
.calculator-wrap {
    padding: 18px 12px;
}
.form-grid,.info-grid{grid-template-columns:1fr}.result-card{position:static}
.info-section{margin:0 12px;padding:22px}.nakliyat-hero h1{font-size:39px}}
@media (max-width: 600px) {
    .hero-brand {
        align-items: flex-start;
        margin-bottom: 25px;
    }

    .hero-logo {
        width: 125px;
    }

    .brand-text {
        padding-left: 10px;
    }

    .brand-text strong {
        font-size: 12px;
    }

    .brand-text span {
        font-size: 10px;
    }

    .nakliyat-hero h1 {
        font-size: 36px;
    }

    .hero-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .hero-button {
        width: 100%;
    }
}