:root {
    --orange: #f58220;
    --orange-dark: #d8690f;
    --dark: #1f2329;
    --dark-2: #2d333b;
    --paper: #f6f6f6;
    --white: #ffffff;
    --ink: #22262c;
    --muted: #727982;
    --line: #e5e5e5;
}

body {
    background: #fff;
    color: var(--ink);
    font-family: "Segoe UI", Arial, sans-serif;
}

.topbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1040;
    background: var(--dark);
    color: rgba(255, 255, 255, .78);
    font-size: .88rem;
    padding: .55rem 0;
}

.topbar a {
    color: rgba(255, 255, 255, .82);
    text-decoration: none;
    margin-right: 1.1rem;
}

.topbar a:hover {
    color: var(--orange);
}

.topbar-links a {
    margin-right: 0;
    margin-left: 1.1rem;
}

.navbar {
    top: 2.3rem;
    background: rgba(255, 255, 255, .98);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 8px 24px rgba(31, 35, 41, .08);
}

.navbar .navbar-brand {
    color: var(--dark);
    font-weight: 900;
}

.navbar .nav-link {
    color: #30343a;
    font-weight: 800;
    font-size: .88rem;
    padding-left: .9rem !important;
    padding-right: .9rem !important;
}

.navbar .nav-link:hover,
.navbar .navbar-brand:hover {
    color: var(--orange);
}

.btn-gold {
    background: var(--orange);
    border-color: var(--orange);
    color: #fff;
    font-weight: 800;
    border-radius: 4px;
}

.btn-gold:hover {
    background: var(--orange-dark);
    border-color: var(--orange-dark);
    color: #fff;
}

.btn-glass,
.btn-outline-light {
    background: var(--dark);
    border-color: var(--dark);
    color: #fff;
    font-weight: 800;
    border-radius: 4px;
}

.btn-glass:hover,
.btn-outline-light:hover {
    background: var(--orange);
    border-color: var(--orange);
    color: #fff;
}

.hero {
    min-height: 760px;
    padding: 11rem 0 5rem;
    display: flex;
    align-items: center;
    background:
        linear-gradient(90deg, rgba(31, 35, 41, .88) 0%, rgba(31, 35, 41, .62) 46%, rgba(31, 35, 41, .18) 100%),
        url("images/fotogaleri/09.jpg") center / cover no-repeat;
    color: #fff;
}

.hero h1 {
    font-size: clamp(2.8rem, 5.8vw, 5.9rem);
    line-height: .98;
    font-weight: 900;
    letter-spacing: 0;
}

.hero .lead {
    color: rgba(255, 255, 255, .82);
    max-width: 42rem;
}

.eyebrow,
.section-title {
    color: var(--orange);
    text-transform: uppercase;
    font-weight: 900;
    letter-spacing: .04em;
    font-size: .9rem;
}

.hero-portrait {
    position: relative;
    background: #fff;
    padding: .55rem;
    border-radius: 4px;
    box-shadow: 0 18px 44px rgba(0, 0, 0, .26);
}

.hero-portrait img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    border-radius: 3px;
}

.portrait-note {
    position: absolute;
    left: 1.4rem;
    right: 1.4rem;
    bottom: 1.4rem;
    background: rgba(31, 35, 41, .92);
    border-left: 4px solid var(--orange);
    color: #fff;
    padding: 1rem;
}

.portrait-note span {
    display: block;
    color: var(--orange);
    font-weight: 900;
    text-transform: uppercase;
    font-size: .78rem;
}

.quick-cats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    background: var(--orange);
    box-shadow: 0 16px 34px rgba(0, 0, 0, .20);
}

.quick-cats a {
    color: #fff;
    text-decoration: none;
    font-weight: 900;
    text-align: center;
    padding: 1.15rem .8rem;
    border-right: 1px solid rgba(255, 255, 255, .28);
}

.quick-cats a:hover {
    background: var(--dark);
}

.quick-cats a:last-child {
    border-right: 0;
}

.section-pad {
    padding: 5rem 0;
}

main > .section-pad {
    background: #fff;
    color: var(--ink);
}

main > .section-pad:nth-of-type(odd):not(.hero):not(.profile-band) {
    background: var(--paper);
}

.page-hero {
    padding: 8.5rem 0 2.4rem;
    background:
        linear-gradient(90deg, rgba(31, 35, 41, .92), rgba(31, 35, 41, .76)),
        url("images/fotogaleri/10.jpg") center / cover no-repeat;
    color: #fff;
}

.page-hero .lead {
    max-width: 720px;
    color: rgba(255, 255, 255, .78);
}

.project-list-section {
    background: #f6f6f6;
    color: var(--ink);
    padding-top: 3.5rem;
}

.project-list-section .section-title {
    color: var(--orange);
}

.project-list-section h2,
.project-list-section h3,
.project-list-section .h3,
.project-list-section .h4 {
    color: var(--ink);
}

.project-card,
.post-card,
.contact-panel {
    background: #fff;
    color: var(--ink);
    border: 1px solid var(--line);
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(31, 35, 41, .08);
    transition: transform .2s ease, box-shadow .2s ease;
}

.project-card:hover,
.post-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(31, 35, 41, .14);
}

.project-card img,
.post-card img,
.gallery-img {
    width: 100%;
    height: 260px;
    object-fit: cover;
}

.project-card a,
.post-card a {
    color: inherit;
    text-decoration: none;
}

.project-card .p-4,
.post-card .p-4 {
    border-top: 3px solid var(--orange);
}

.badge-gold {
    background: var(--orange);
    color: #fff;
    border: 0;
    border-radius: 3px;
    font-weight: 800;
}

.project-filter {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
}

.project-filter a {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: .55rem 1rem;
    background: rgba(255, 255, 255, .96);
    color: var(--dark);
    border: 1px solid rgba(255, 255, 255, .34);
    text-decoration: none;
    font-weight: 800;
    border-radius: 4px;
}

.project-filter a.active,
.project-filter a:hover {
    background: var(--orange);
    border-color: var(--orange);
    color: #fff;
}

.project-group {
    padding-top: 1rem;
}

.project-group .btn-glass {
    background: var(--dark);
    border-color: var(--dark);
    color: #fff;
}

.project-group .btn-glass:hover {
    background: var(--orange);
    border-color: var(--orange);
}

.project-detail-page {
    background:
        linear-gradient(180deg, #343a43 0%, #2a3038 42%, #1f2329 100%) !important;
    color: #fff !important;
}

.project-detail-page .project-detail-card {
    background: #fff;
    color: var(--ink);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 4px;
    padding: 2rem;
    box-shadow: 0 18px 46px rgba(0, 0, 0, .24);
}

.project-detail-page .project-detail-card h1,
.project-detail-page .project-detail-card .fs-5 {
    color: var(--ink);
}

.project-detail-page .project-detail-card .muted {
    color: var(--muted);
}

.project-detail-page .contact-panel {
    color: var(--ink);
}

.project-detail-page > .container > h2 {
    color: #fff;
}

.project-detail-page > .container > .row + h2 {
    border-left: 4px solid var(--orange);
    padding-left: .85rem;
}

.muted {
    color: var(--muted);
}

.service-strip {
    background: var(--dark);
}

.service-strip a {
    display: block;
    color: #fff;
    text-decoration: none;
    text-align: center;
    font-weight: 900;
    padding: 1.25rem .75rem;
    border-right: 1px solid rgba(255, 255, 255, .12);
}

.service-strip a:hover {
    background: var(--orange);
}

.profile-band {
    background: #fff;
    color: var(--ink);
}

.profile-band .detail-cover {
    border-radius: 4px;
}

.profile-band .muted {
    color: var(--muted);
}

.cta-band {
    padding: 4rem 0;
    background:
        linear-gradient(90deg, rgba(245, 130, 32, .94), rgba(245, 130, 32, .84)),
        url("images/fotogaleri/16.jpg") center / cover no-repeat;
    color: #fff;
}

.cta-band span {
    display: block;
    font-weight: 900;
    text-transform: uppercase;
}

.cta-band h2 {
    font-weight: 900;
    margin: .35rem 0 0;
}

.cta-band .btn-gold {
    background: var(--dark);
    border-color: var(--dark);
}

.detail-cover {
    width: 100%;
    max-height: 560px;
    object-fit: cover;
    border-radius: 4px;
    box-shadow: 0 14px 34px rgba(31, 35, 41, .16);
}

.form-control,
.form-select,
.form-control:focus {
    background: #fff;
    color: #111;
}

.social-share a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 42px;
    border: 1px solid var(--line);
    color: var(--dark);
    background: #fff;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 900;
}

.social-share a:hover {
    color: #fff;
    background: var(--orange);
    border-color: var(--orange);
}

.map-frame {
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid var(--line);
}

.map-frame iframe {
    display: block;
    width: 100%;
    min-height: 280px;
    border: 0;
}

.site-footer {
    background: var(--dark);
    color: #fff;
}

.footer-main {
    background: var(--dark);
}

.footer-bottom {
    background: #171a1f;
    color: rgba(255, 255, 255, .70);
    font-size: .9rem;
}

.footer-bottom a,
.footer-link {
    color: rgba(255, 255, 255, .78);
    text-decoration: none;
    margin-bottom: .35rem;
}

.footer-link:hover,
.footer-bottom a:hover {
    color: var(--orange);
}

.footer-title {
    color: #fff;
    font-size: 1rem;
    font-weight: 900;
    margin-bottom: 1rem;
}

.footer-social a {
    background: var(--orange);
    border-color: var(--orange);
    color: #fff;
}

.admin-shell {
    min-height: 100vh;
    padding-top: 2rem;
    background: #f4f2ee;
    color: #17191f;
}

.admin-shell .admin-panel {
    background: #ffffff;
    color: #17191f;
    border: 1px solid #ded8cc;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 14px 34px rgba(17, 19, 24, .08);
}

.admin-shell .table {
    --bs-table-bg: transparent;
    --bs-table-color: #17191f;
    --bs-table-border-color: #e5dfd4;
    color: #17191f;
    margin-bottom: 0;
}

.admin-shell .table a,
.admin-shell a {
    color: #8a5d1f;
}

.admin-shell a.text-danger,
.admin-shell .text-danger {
    color: #b02a37 !important;
}

.admin-shell .text-muted {
    color: #6c6256 !important;
}

.admin-shell .form-label,
.admin-shell .form-check-label,
.admin-shell h1,
.admin-shell h2,
.admin-shell h3,
.admin-shell strong {
    color: #17191f;
}

.admin-shell .form-control,
.admin-shell .form-select {
    background: #fff;
    color: #17191f;
    border-color: #d8d0c2;
}

.admin-shell .form-control:focus,
.admin-shell .form-select:focus {
    border-color: var(--orange);
    box-shadow: 0 0 0 .2rem rgba(245, 130, 32, .2);
}

.admin-nav a {
    color: #17191f;
    text-decoration: none;
    font-weight: 700;
    margin-right: 1rem;
}

.admin-nav a:hover {
    color: #8a5d1f;
}

@media (max-width: 992px) {
    .topbar {
        position: static;
    }

    .navbar {
        top: 0;
    }

    .hero {
        padding-top: 7rem;
    }

    .quick-cats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .hero {
        min-height: auto;
        padding: 7rem 0 4rem;
    }

    .quick-cats {
        grid-template-columns: 1fr;
    }

    .quick-cats a {
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, .28);
    }

    .project-card img,
    .post-card img,
    .gallery-img {
        height: 220px;
    }
}