:root {

    --page: #f4f1ea;

    --surface: #ffffff;

    --surface-soft: #ebe6dc;

    --ink: #111318;

    --muted: #676c75;

    --line: #d9d1c5;

    --navy: #101a2d;

    --gold: #c99643;

    --gold-dark: #a8792c;

    --green: #1f7a4d;

    --shadow: 0 18px 55px rgba(15, 20, 28, .10);

    --shadow-strong: 0 26px 80px rgba(15, 20, 28, .18);

    --radius: 8px;

    --container: 1200px;

    --hero-title: clamp(34px, 4vw, 52px);

    --section-title: clamp(28px, 3vw, 36px);

    --card-title: clamp(20px, 2vw, 22px);

    --body: clamp(15.5px, 1.2vw, 16px);

    --small: clamp(13.5px, 1vw, 14px);

    --mini: 12px;

}



* {

    box-sizing: border-box;

}



html {

    scroll-behavior: smooth;

}



body {

    margin: 0;

    background: var(--page);

    color: var(--ink);

    font-family: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;

    font-size: var(--body);

    line-height: 1.65;

    font-weight: 400;

    letter-spacing: 0;

    text-rendering: optimizeLegibility;

    -webkit-font-smoothing: antialiased;

}



body.is-gallery-open {

    overflow: hidden;

}



a {

    color: inherit;

    text-decoration: none;

}



img,

iframe {

    display: block;

    max-width: 100%;

}



button,

input,

textarea,

select {

    font: inherit;

}



.container {

    width: min(var(--container), calc(100% - 40px));

    margin: 0 auto;

}



.site-header {

    position: sticky;

    top: 0;

    z-index: 80;

    background: rgba(244, 241, 234, .96);

    border-bottom: 1px solid rgba(217, 209, 197, .92);

    backdrop-filter: blur(16px);

}



.nav {

    min-height: 82px;

    display: flex;

    align-items: center;

    gap: 22px;

}



.brand {

    min-width: 260px;

    display: inline-flex;

    align-items: center;

    gap: 12px;

}



.brand-mark {

    width: 44px;

    height: 44px;

    display: grid;

    place-items: center;

    border-radius: 7px;

    background: var(--navy);

    color: #fff;

    font-size: 20px;

    font-weight: 800;

}



.brand strong {

    display: block;

    color: var(--ink);

    font-size: 16px; /* Yazı biraz daha belirginleştirildi */

    line-height: 1.1;

    font-weight: 800; /* Font kalınlığı artırıldı */

    text-transform: uppercase; /* BÜYÜK HARF YAPAN KOD */

    letter-spacing: 0.5px; /* Harfler arası çok hafif açıldı */

}



.brand small {

    display: block;

    margin-top: 4px;

    color: var(--muted);

    font-size: 11px;

    line-height: 1.2;

    font-weight: 600;

    text-transform: uppercase; /* BÜYÜK HARF YAPAN KOD */

}



.nav-toggle,

.nav-toggle-button {

    display: none;

}



.nav-links {

    margin-left: auto;

    display: flex;

    align-items: center;

    gap: 24px;

    font-size: var(--small);

    font-weight: 700;

}



.nav-links > a,

.nav-dropdown-button {

    padding: 29px 0;

    color: var(--ink);

    white-space: nowrap;

}



.nav-links > a:hover,

.nav-dropdown-button:hover {

    color: var(--gold-dark);

}



.nav-dropdown {

    position: relative;

}



.nav-dropdown-button::after {

    content: "";

    display: inline-block;

    width: 6px;

    height: 6px;

    margin-left: 7px;

    border-right: 2px solid currentColor;

    border-bottom: 2px solid currentColor;

    transform: rotate(45deg) translateY(-2px);

}



.nav-dropdown-menu {

    position: absolute;

    top: 100%;

    left: 50%;

    width: 360px;

    padding: 10px;

    transform: translateX(-50%);

    background: var(--surface);

    border: 1px solid var(--line);

    border-radius: var(--radius);

    box-shadow: var(--shadow-strong);

    opacity: 0;

    visibility: hidden;

    pointer-events: none;

}



.nav-dropdown:hover .nav-dropdown-menu {

    opacity: 1;

    visibility: visible;

    pointer-events: auto;

}



.nav-dropdown-menu a {

    display: grid;

    gap: 4px;

    padding: 12px 13px;

    border-radius: 6px;

    color: var(--ink);

    font-size: var(--small);

    font-weight: 700;

}



.nav-dropdown-menu a:hover {

    background: var(--surface-soft);

}



.nav-dropdown-menu span {

    color: var(--muted);

    font-size: 12px;

    line-height: 1.4;

    font-weight: 400;

}



.nav-phone {

    color: var(--navy);

    font-size: var(--small);

    font-weight: 700;

    white-space: nowrap;

}



.btn {

    min-height: 46px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    padding: 12px 18px;

    border: 1px solid transparent;

    border-radius: 6px;

    font-size: var(--small);

    line-height: 1.2;

    font-weight: 700;

    cursor: pointer;

    transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;

}



.btn:hover {

    transform: translateY(-1px);

}



.btn-primary {

    background: var(--gold);

    border-color: var(--gold);

    color: #fff;

}



.btn-primary:hover {

    background: var(--gold-dark);

    border-color: var(--gold-dark);

}



.btn-secondary {

    background: rgba(255, 255, 255, .08);

    border-color: rgba(255, 255, 255, .30);

    color: #fff;

}



.btn-secondary:hover {

    background: rgba(255, 255, 255, .15);

    border-color: rgba(255, 255, 255, .60);

}



.hero {

    position: relative;

    min-height: 640px;

    overflow: hidden;

    display: grid;

    align-items: center;

    background: var(--navy);

    color: #fff;

}



.hero-backdrop,

.hero-background-media {

    position: absolute;

    inset: 0;

}



.hero-background-media img,

.hero-backdrop img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.hero::after,

.hero-backdrop::after {

    content: "";

    position: absolute;

    inset: 0;

    pointer-events: none; /* LIGHTHOUSE'UN RESMİ GÖRMESİNİ SAĞLAYAN KOD */

    background:

        linear-gradient(90deg, rgba(10, 16, 28, .92), rgba(10, 16, 28, .72) 48%, rgba(10, 16, 28, .34)),

        linear-gradient(0deg, rgba(10, 16, 28, .72), rgba(10, 16, 28, .05) 42%, rgba(10, 16, 28, .34));

}



.hero-grid,

.hero-inner {

    position: relative;

    z-index: 2;

    min-height: 640px;

    display: grid;

    grid-template-columns: minmax(0, 1fr) 320px;

    gap: 56px;

    align-items: end;

    padding: 96px 0 72px;

}



.hero-copy {

    max-width: 760px;

}



.eyebrow {

    display: inline-flex;

    margin-bottom: 16px;

    color: var(--gold);

    font-size: var(--mini);

    line-height: 1.2;

    font-weight: 700;

    letter-spacing: 0;

    text-transform: uppercase;

}



.hero h1 {

    max-width: 780px;

    margin: 0;

    font-size: var(--hero-title);

    line-height: 1.1;

    font-weight: 500;

    letter-spacing: 0;

}



.hero p {

    max-width: 650px;

    margin: 24px 0 0;

    color: rgba(255, 255, 255, .82);

    font-size: 17px;

    line-height: 1.7;

}



.hero-actions {

    display: flex;

    flex-wrap: wrap;

    gap: 12px;

    margin-top: 32px;

}



.hero-proof,

.hero-facts {

    display: grid;

    gap: 12px;

}



.hero-proof {

    align-self: end;

}



.hero-proof span,

.hero-facts div {

    display: block;

    padding: 17px 18px;

    border: 1px solid rgba(255, 255, 255, .18);

    border-radius: var(--radius);

    background: rgba(255, 255, 255, .10);

    color: #fff;

    backdrop-filter: blur(14px);

}



.hero-facts strong {

    display: block;

    font-size: 22px;

    line-height: 1.1;

    font-weight: 600;

}



.hero-proof span,

.hero-facts span {

    color: rgba(255, 255, 255, .76);

    font-size: var(--small);

    line-height: 1.35;

    font-weight: 500;

}



.hero-media {

    position: relative;

    z-index: 2;

    padding: 10px;

    border: 1px solid rgba(255, 255, 255, .18);

    border-radius: var(--radius);

    background: rgba(255, 255, 255, .10);

    box-shadow: var(--shadow-strong);

}



.hero-media img {

    width: 100%;

    aspect-ratio: 4 / 3;

    object-fit: cover;

    border-radius: 6px;

}



.trust-strip {

    background: var(--surface);

    border-bottom: 1px solid var(--line);

}



.trust-grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

}



.trust-grid > div {

    min-height: 106px;

    padding: 25px 26px;

    border-left: 1px solid var(--line);

}



.trust-grid > div:first-child {

    border-left: 0;

}



.trust-grid strong {

    display: block;

    color: var(--ink);

    font-size: 20px;

    line-height: 1.18;

    font-weight: 600;

}



.trust-grid span {

    display: block;

    margin-top: 7px;

    color: var(--muted);

    font-size: 13px;

    line-height: 1.35;

}



.section {

    padding: 86px 0;

}



.section-soft,

.section-gallery,

.section-faq,

.section-products {

    background: var(--surface-soft);

}



.section-head {

    max-width: 800px;

    margin-bottom: 34px;

}



.section-head-row {

    max-width: none;

    display: grid;

    grid-template-columns: minmax(0, 1fr) 420px;

    gap: 48px;

    align-items: end;

}



.section-head h2,

.intro-grid h2,

.review-panel h2,

.industry-layout h2,

.split-band h2,

.region-grid h2,

.cta-inner h2,

.detail-content h2,

.content-rich h2,

.faq-layout h2 {

    margin: 0;

    color: var(--ink);

    font-size: var(--section-title);

    line-height: 1.16;

    font-weight: 500;

    letter-spacing: 0;

}



.section-head p,

.intro-copy,

.intro-copy p,

.review-panel p,

.industry-layout p,

.split-band p,

.region-grid p,

.content-rich p,

.detail-content p,

.faq-list p,

.service-card p,

.product-card p,

.process-card p,

.video-card-body p,

.cta-inner p {

    margin: 0;

    color: var(--muted);

    font-size: var(--body);

    line-height: 1.65;

    font-weight: 400;

}



.section-intro {

    background: var(--page);

}



.intro-grid,

.review-panel,

.industry-layout,

.detail-layout,

.content-grid,

.split-band,

.region-grid,

.faq-layout {

    display: grid;

    gap: 48px;

    align-items: start;

}



.intro-grid {

    grid-template-columns: .9fr 1.1fr;

}



.review-panel {

    grid-template-columns: minmax(0, 1fr) 360px;

    align-items: center;

}



.industry-layout {

    grid-template-columns: .9fr 1.1fr;

}



.detail-layout,

.content-grid {

    grid-template-columns: minmax(0, 1fr) 370px;

}



.split-band {

    grid-template-columns: .9fr 1.1fr;

    padding: 46px;

    background: var(--surface);

    border: 1px solid var(--line);

    border-radius: var(--radius);

    box-shadow: var(--shadow);

}



.region-grid {

    grid-template-columns: .9fr 1.1fr;

    align-items: center;

}



.faq-layout {

    grid-template-columns: 420px minmax(0, 1fr);

}



.intro-copy p + p,

.content-rich p + p,

.detail-content p + p {

    margin-top: 18px;

}



.content-card,

.quote-panel,

.detail-content,

.project-panel,

.service-card,

.product-card,

.factor-card,

.video-card,

.review-score-card,

.industry-list article,

.faq-list details {

    background: var(--surface);

    border: 1px solid var(--line);

    border-radius: var(--radius);

    box-shadow: var(--shadow);

}



.content-card,

.detail-content {

    padding: 40px;

}



.quote-panel,

.project-panel {

    position: sticky;

    top: 106px;

    padding: 28px;

}



.quote-panel strong,

.project-panel strong {

    display: block;

    color: var(--ink);

    font-size: 22px;

    line-height: 1.2;

    font-weight: 600;

}



.quote-panel p,

.project-panel p {

    margin: 14px 0 20px;

    color: var(--muted);

}



.quote-panel .btn,

.project-panel .btn {

    width: 100%;

}



.mini-list,

.project-panel-list {

    display: grid;

    gap: 8px;

    margin-top: 20px;

    color: var(--muted);

    font-size: var(--small);

}



.service-grid,

.product-grid,

.process-grid,

.factor-grid,

.video-grid,

.industry-list,

.faq-list {

    display: grid;

}



.service-grid,

.product-grid {

    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 18px;

}



.compact-grid {

    grid-template-columns: repeat(4, minmax(0, 1fr));

}



.product-grid-three {

    grid-template-columns: repeat(3, minmax(0, 1fr));

}



.process-grid {

    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 0;

    overflow: hidden;

}



.service-card,

.product-card,

.process-card {

    position: relative;

    min-height: 235px;

    padding: 26px;

    overflow: hidden;

    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;

}



.service-card:hover,

.product-card:hover {

    transform: translateY(-4px);

    border-color: rgba(201, 150, 67, .45);

    box-shadow: var(--shadow-strong);

}



.service-card::before,

.product-card::before {

    content: "";

    position: absolute;

    left: 26px;

    right: 26px;

    top: 0;

    height: 3px;

    background: var(--gold);

}



.process-card {

    border-radius: 0;

    box-shadow: none;

    border-top: 0;

    border-bottom: 0;

    border-right: 0;

}



.process-card:first-child {

    border-left: 0;

}



.service-card span,

.product-card span,

.process-card span {

    display: inline-flex;

    margin-bottom: 18px;

    color: var(--gold-dark);

    font-size: var(--mini);

    font-weight: 700;

    line-height: 1.2;

    text-transform: uppercase;

}



.process-card span {

    margin-bottom: 44px;

    color: var(--gold);

}



.service-card h3,

.product-card h3,

.process-card h3,

.industry-list h3,

.video-card-body h3 {

    margin: 0 0 12px;

    color: var(--ink);

    font-size: var(--card-title);

    line-height: 1.25;

    font-weight: 600;

    letter-spacing: 0;

}



.service-card a,

.product-card a {

    display: inline-flex;

    width: fit-content;

    margin-top: 18px;

    color: var(--navy);

    font-size: var(--small);

    font-weight: 700;

    border-bottom: 2px solid var(--gold);

}



.product-card.is-featured {

    background: var(--navy);

    border-color: var(--navy);

    color: #fff;

}



.product-card.is-featured h3,

.product-card.is-featured a {

    color: #fff;

}



.product-card.is-featured p {

    color: rgba(255, 255, 255, .74);

}



.industry-list {

    gap: 14px;

}



.industry-list article {

    padding: 24px;

}



.section-reviews,

.section-dark {

    background: var(--navy);

    color: #fff;

}



.section-reviews h2,

.section-reviews p,

.section-dark .eyebrow,

.section-dark h2,

.section-dark p {

    color: #fff;

}



.review-score-card {

    padding: 30px;

    color: var(--ink);

}



.review-score-card strong {

    display: inline-block;

    font-size: 52px;

    line-height: 1;

    font-weight: 600;

}



.review-score-card > span {

    color: var(--muted);

    font-weight: 700;

}



.review-score-card p {

    margin: 14px 0 24px;

}



.review-actions {

    display: flex;

    flex-wrap: wrap;

    gap: 10px;

}



.review-link {

    background: #fff;

    border-color: var(--line);

    color: var(--navy);

}



.image-gallery,

.gallery-masonry {

    display: flex;

    gap: 18px;

    overflow-x: auto;

    overflow-y: hidden;

    scroll-behavior: smooth;

    scroll-snap-type: x mandatory;

    padding: 4px 2px 18px;

    scrollbar-width: none;

}



.image-gallery::-webkit-scrollbar,

.gallery-masonry::-webkit-scrollbar {

    display: none;

}



.gallery-card,

.gallery-card.is-large {

    position: relative;

    flex: 0 0 340px;

    width: 340px;

    min-width: 340px;

    margin: 0;

    overflow: hidden;

    border-radius: var(--radius);

    background: #111;

    box-shadow: var(--shadow);

    scroll-snap-align: start;

}



.gallery-open {

    width: 100%;

    height: 255px;

    display: block;

    padding: 0;

    border: 0;

    background: transparent;

    overflow: hidden;

    cursor: zoom-in;

}



.gallery-card img,

.gallery-card.is-large img,

.gallery-open img {

    width: 100%;

    height: 100%;

    aspect-ratio: auto;

    object-fit: cover;

    transition: transform .25s ease;

}



.gallery-card:hover img {

    transform: scale(1.035);

}



.gallery-card figcaption {

    min-height: 52px;

    padding: 13px 14px 0;

    color: var(--ink);

    font-size: var(--small);

    line-height: 1.35;

    font-weight: 600;

    background: var(--surface);

}



.gallery-carousel-shell {

    position: relative;

}



.gallery-carousel-button {

    position: absolute;

    top: 42%;

    z-index: 5;

    width: 46px;

    height: 64px;

    border: 1px solid rgba(17, 19, 24, .14);

    border-radius: 6px;

    background: rgba(255, 255, 255, .94);

    color: var(--ink);

    font-size: 42px;

    line-height: 1;

    cursor: pointer;

    box-shadow: var(--shadow);

}



.gallery-carousel-button:disabled {

    opacity: .35;

    cursor: default;

}



.gallery-carousel-prev {

    left: -18px;

}



.gallery-carousel-next {

    right: -18px;

}



.gallery-lightbox {

    position: fixed;

    inset: 0;

    z-index: 999999;

    display: none;

    align-items: center;

    justify-content: center;

    padding: 24px;

    background: rgba(7, 10, 15, .90);

    backdrop-filter: blur(8px);

}



.gallery-lightbox.is-open {

    display: flex;

}



.gallery-lightbox-frame {

    position: relative;

    width: min(1040px, calc(100vw - 96px));

    max-height: calc(100vh - 80px);

    display: grid;

    gap: 12px;

}



.gallery-lightbox-frame img {

    width: 100%;

    max-height: calc(100vh - 150px);

    object-fit: contain;

    border-radius: var(--radius);

    background: #111;

}



.gallery-lightbox-caption {

    color: #fff;

    font-size: var(--small);

    text-align: center;

}



.gallery-lightbox-close,

.gallery-lightbox-nav {

    position: absolute;

    z-index: 2;

    border: 1px solid rgba(255, 255, 255, .22);

    background: rgba(255, 255, 255, .10);

    color: #fff;

    border-radius: 6px;

    cursor: pointer;

}



.gallery-lightbox-close {

    top: 18px;

    right: 18px;

    width: 46px;

    height: 46px;

    font-size: 32px;

    line-height: 1;

}



.gallery-lightbox-nav {

    top: 50%;

    width: 52px;

    height: 72px;

    transform: translateY(-50%);

    font-size: 48px;

    line-height: 1;

}



.gallery-lightbox-prev {

    left: 20px;

}



.gallery-lightbox-next {

    right: 20px;

}



.video-grid {

    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 18px;

}



.video-card {

    overflow: hidden;

}



.video-thumb {

    position: relative;

    width: 100%;

    padding: 0;

    border: 0;

    background: #111;

    cursor: pointer;

}



.video-thumb img,

.video-thumb iframe {

    width: 100%;

    aspect-ratio: 16 / 9;

    object-fit: cover;

    border: 0;

}



.video-thumb span {

    position: absolute;

    left: 50%;

    top: 50%;

    min-width: 74px;

    min-height: 46px;

    display: grid;

    place-items: center;

    transform: translate(-50%, -50%);

    background: var(--gold);

    color: #fff;

    border-radius: 6px;

    font-size: 13px;

    font-weight: 700;

}



.video-card-body {

    padding: 22px;

}



.factor-grid {

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 12px;

}



.factor-card {

    min-height: 74px;

    display: flex;

    align-items: center;

    padding: 18px;

    color: var(--ink);

    font-size: var(--small);

    line-height: 1.4;

    font-weight: 600;

}



.region-tags {

    display: flex;

    flex-wrap: wrap;

    gap: 10px;

}



.region-tags span {

    min-height: 42px;

    display: inline-flex;

    align-items: center;

    padding: 9px 14px;

    border: 1px solid rgba(255, 255, 255, .18);

    border-radius: 6px;

    background: rgba(255, 255, 255, .07);

    color: #fff;

    font-size: var(--small);

    font-weight: 600;

}



.region-tags a {

    color: #fff;

}



.faq-list {

    gap: 10px;

}



.faq-list details {

    padding: 0;

}



.faq-list summary {

    padding: 19px 21px;

    color: var(--ink);

    cursor: pointer;

    list-style: none;

    font-weight: 600;

}



.faq-list summary::-webkit-details-marker {

    display: none;

}



.faq-list p {

    padding: 0 21px 21px;

}



.cta-band {

    position: relative;

    overflow: hidden;

    padding: 76px 0;

    background:

        linear-gradient(110deg, rgba(16, 26, 45, .98), rgba(23, 40, 66, .96)),

        var(--navy);

    color: #fff;

}



.cta-band::before {

    content: "";

    position: absolute;

    inset: 0;

    background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .045) 0 1px, transparent 1px 86px);

}



.cta-inner {

    position: relative;

    z-index: 1;

    display: grid;

    grid-template-columns: minmax(0, 1fr) auto;

    gap: 36px;

    align-items: center;

}



.cta-inner h2,

.cta-inner p {

    color: #fff;

}



.cta-inner p {

    max-width: 780px;

    margin-top: 12px;

    color: rgba(255, 255, 255, .76);

}



.site-footer {

    padding: 64px 0;

    background: #101010;

    color: #fff;

}



.footer-grid {

    display: grid;

    grid-template-columns: 1.2fr .9fr .9fr;

    gap: 44px;

}



.site-footer strong {

    display: block;

    margin-bottom: 13px;

    color: #fff;

    font-size: 17px;

    font-weight: 600;

}



.site-footer p,

.site-footer a {

    display: block;

    margin: 0 0 8px;

    color: rgba(255, 255, 255, .72);

    font-size: var(--small);

}



.footer-whatsapp {

    margin-top: 16px;

    color: #fff;

    font-weight: 700;

}



.floating-actions {

    position: fixed;

    right: 18px;

    bottom: 18px;

    z-index: 90;

    display: flex;

    gap: 10px;

}



.floating-actions a,

.float-call,

.float-whatsapp {

    min-height: 44px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    padding: 10px 16px;

    border-radius: 6px;

    color: #fff;

    font-size: 13px;

    font-weight: 700;

    box-shadow: 0 12px 30px rgba(0, 0, 0, .18);

}



.float-call {

    background: var(--gold);

}



.float-whatsapp {

    background: var(--green);

}



.mt-3 {

    margin-top: 16px;

}



@media (max-width: 1180px) {

    .nav-phone {

        display: none;

    }



    .hero-grid,

    .hero-inner,

    .section-head-row,

    .intro-grid,

    .review-panel,

    .industry-layout,

    .detail-layout,

    .content-grid,

    .split-band,

    .region-grid,

    .faq-layout {

        grid-template-columns: 1fr;

    }



    .hero-proof,

    .hero-facts {

        grid-template-columns: repeat(3, minmax(0, 1fr));

    }



    .service-grid,

    .product-grid,

    .video-grid,

    .compact-grid {

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }



    .process-grid {

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }



    .quote-panel,

    .project-panel {

        position: static;

    }

}



@media (max-width: 860px) {

    .container {

        width: min(var(--container), calc(100% - 28px));

    }



    .nav {

        min-height: 74px;

    }



    .brand {

        min-width: 0;

    }



    .brand small {

        display: none;

    }



    .nav-toggle-button {

        margin-left: auto;

        width: 44px;

        height: 44px;

        display: grid;

        place-items: center;

        gap: 4px;

        border: 1px solid var(--line);

        border-radius: 6px;

        cursor: pointer;

    }



    .nav-toggle-button span {

        width: 20px;

        height: 2px;

        background: var(--ink);

    }



    .nav-links {

        position: absolute;

        top: 74px;

        left: 14px;

        right: 14px;

        display: none;

        padding: 14px;

        background: var(--surface);

        border: 1px solid var(--line);

        border-radius: var(--radius);

        box-shadow: var(--shadow);

    }



    .nav-toggle:checked ~ .nav-links {

        display: grid;

        gap: 2px;

    }



    .nav-links > a,

    .nav-dropdown-button {

        display: block;

        padding: 12px;

    }



    .nav-dropdown-menu {

        position: static;

        width: auto;

        transform: none;

        opacity: 1;

        visibility: visible;

        pointer-events: auto;

        padding: 0 0 0 12px;

        border: 0;

        box-shadow: none;

        background: transparent;

    }



    .nav-cta {

        display: none;

    }



    .hero,

    .hero-grid,

    .hero-inner {

        min-height: 560px;

    }



    .hero-grid,

    .hero-inner {

        padding: 76px 0 48px;

        gap: 28px;

    }



    .hero-proof,

    .hero-facts,

    .trust-grid,

    .service-grid,

    .product-grid,

    .process-grid,

    .video-grid,

    .factor-grid,

    .compact-grid,

    .footer-grid,

    .cta-inner {

        grid-template-columns: 1fr;

    }



    .trust-grid > div {

        border-left: 0;

        border-top: 1px solid var(--line);

    }



    .trust-grid > div:first-child {

        border-top: 0;

    }



    .section {

        padding: 62px 0;

    }



    .content-card,

    .detail-content,

    .quote-panel,

    .project-panel,

    .split-band {

        padding: 26px;

    }



    .gallery-carousel-prev {

        left: 4px;

    }



    .gallery-carousel-next {

        right: 4px;

    }

}



@media (max-width: 560px) {

    body {

        padding-bottom: 70px;

    }



    .hero-actions {

        display: grid;

    }



    .btn {

        width: 100%;

    }



    .gallery-card,

    .gallery-card.is-large {

        flex-basis: 82vw;

        width: 82vw;

        min-width: 82vw;

    }



    .gallery-open {

        height: 62vw;

        max-height: 260px;

    }



    .gallery-lightbox {

        padding: 14px;

    }



    .gallery-lightbox-frame {

        width: 100%;

        max-height: calc(100vh - 70px);

    }



    .gallery-lightbox-frame img {

        max-height: calc(100vh - 145px);

    }



    .gallery-lightbox-nav {

        top: auto;

        bottom: 18px;

        width: 48px;

        height: 48px;

        font-size: 38px;

        transform: none;

    }



    .gallery-lightbox-prev {

        left: 18px;

    }



    .gallery-lightbox-next {

        right: 18px;

    }



    .floating-actions {

        left: 12px;

        right: 12px;

        bottom: 12px;

    }



    .floating-actions a {

        flex: 1;

    }

}
/* Ürünlerimiz mobil aç/kapat */
.product-menu-toggle {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.nav-dropdown-button {
    cursor: pointer;
    user-select: none;
}

/* Mobilde Ürünlerimiz kapalı gelsin, tıklanınca açılsın */
@media (max-width: 860px) {
    .nav-links {
        max-height: calc(100vh - 92px);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .nav-dropdown {
        width: 100%;
    }

    .nav-dropdown-button {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .nav-dropdown .nav-dropdown-menu,
    .nav-dropdown:hover .nav-dropdown-menu {
        position: static;
        width: auto;
        transform: none;
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        padding: 0;
        margin: 0;
        border: 0;
        box-shadow: none;
        background: transparent;
        transition: max-height .25s ease, opacity .2s ease;
    }

    .product-menu-toggle:checked ~ .nav-dropdown-menu {
        max-height: 52vh;
        overflow-y: auto;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        padding: 8px 0 0 12px;
        margin-top: 4px;
    }

    .product-menu-toggle:checked + .nav-dropdown-button::after {
        transform: rotate(225deg) translate(-2px, -2px);
    }

    .nav-dropdown-menu a {
        padding: 11px 12px;
    }
}
/* Rehber / Blog Sayfalari */
.guide-index-hero,
.guide-detail-hero {
    background: var(--page, #f4f1ea);
    padding: 86px 0 52px;
}

.guide-index-hero h1,
.guide-detail-hero h1 {
    max-width: 920px;
    margin: 0;
    color: var(--ink, #111318);
    font-size: clamp(34px, 4vw, 54px);
    line-height: 1.12;
    font-weight: 500;
}

.guide-index-hero p,
.guide-detail-hero p {
    max-width: 760px;
    margin: 18px 0 0;
    color: var(--muted, #6b6f78);
    font-size: 17px;
    line-height: 1.7;
}

.guide-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.guide-card-public {
    overflow: hidden;
    background: var(--surface, #fff);
    border: 1px solid var(--line, #d8d0c3);
    border-radius: var(--radius, 8px);
    box-shadow: 0 16px 45px rgba(15, 20, 28, .06);
}

.guide-card-image {
    display: block;
    background: #111;
}

.guide-card-image img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

.guide-card-body {
    padding: 24px;
}

.guide-card-body span {
    display: inline-block;
    margin-bottom: 10px;
    color: var(--gold-2, #a8792c);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.guide-card-body h2 {
    margin: 0;
    color: var(--ink, #111318);
    font-size: 22px;
    line-height: 1.25;
    font-weight: 600;
}

.guide-card-body p {
    margin: 14px 0 0;
    color: var(--muted, #6b6f78);
    font-size: 15px;
    line-height: 1.65;
}

.guide-read-link {
    display: inline-flex;
    width: fit-content;
    margin-top: 20px;
    color: var(--ink, #111318);
    font-size: 14px;
    font-weight: 800;
    border-bottom: 2px solid var(--gold, #c99643);
}

.guide-empty {
    padding: 46px;
    background: var(--surface, #fff);
    border: 1px solid var(--line, #d8d0c3);
    border-radius: var(--radius, 8px);
    text-align: center;
}

.guide-empty h2 {
    margin: 0;
    font-size: 28px;
    font-weight: 500;
}

.guide-empty p {
    margin: 12px 0 0;
    color: var(--muted, #6b6f78);
}

.guide-detail-head {
    max-width: 980px;
}

.guide-date {
    margin-top: 18px;
    color: var(--muted, #6b6f78);
    font-size: 14px;
    font-weight: 700;
}

.guide-cover-section {
    background: var(--page, #f4f1ea);
    padding: 0 0 34px;
}

.guide-cover {
    width: 100%;
    max-height: 520px;
    object-fit: cover;
    border-radius: var(--radius, 8px);
    border: 1px solid var(--line, #d8d0c3);
    box-shadow: 0 16px 45px rgba(15, 20, 28, .08);
}

.guide-content-section {
    background: var(--surface, #fff);
}

.guide-content-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 42px;
    align-items: start;
}

.guide-content {
    max-width: 820px;
}

.guide-content p {
    margin: 0 0 20px;
    color: var(--ink-2, #2c3139);
    font-size: 17px;
    line-height: 1.8;
}

.guide-side-cta {
    position: sticky;
    top: 110px;
    padding: 26px;
    background: var(--page, #f4f1ea);
    border: 1px solid var(--line, #d8d0c3);
    border-radius: var(--radius, 8px);
}

.guide-side-cta strong {
    display: block;
    color: var(--ink, #111318);
    font-size: 22px;
    line-height: 1.2;
    font-weight: 600;
}

.guide-side-cta p {
    margin: 12px 0 20px;
    color: var(--muted, #6b6f78);
    font-size: 15px;
}

.guide-side-cta .btn {
    width: 100%;
}

@media (max-width: 980px) {
    .guide-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .guide-content-layout {
        grid-template-columns: 1fr;
    }

    .guide-side-cta {
        position: static;
    }
}

@media (max-width: 620px) {
    .guide-index-hero,
    .guide-detail-hero {
        padding: 64px 0 38px;
    }

    .guide-grid {
        grid-template-columns: 1fr;
    }

    .guide-card-body {
        padding: 20px;
    }

    .guide-content p {
        font-size: 16px;
    }
}
.guide-content a {
    color: var(--gold-2, #a8792c);
    font-weight: 700;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
}

.guide-content a:hover {
    color: var(--gold, #c99643);
}
.detail-content a,
.content-rich a {
    color: var(--gold-dark);
    font-weight: 700;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
}

.detail-content a:hover,
.content-rich a:hover {
    color: var(--navy);
}
