/* ==========================================================================
   export.css — İhracat / Export, bespoke sayfa (Gülmar Yapı)
   Tasarım dili: CNC sayfasıyla akraba "atölyeden sevkiyata" — koyu grafit hero
   (CNC banner fotoğrafı + scrim), marka amber vurgusu (#f2a100), açık gövde.
   Aile ile ortak iskelet (tag / h2 / head / faq / cta). Tüm sınıflar .ex- ile
   namespace'lenir; sayfa tek başına çalışır (landing.css yüklenmez), fotoğraf
   bulunmasa da tam görünür. Başlık line-height en az 1.15 (TR aksan çakışması).
   ========================================================================== */

:root {
    --ex-accent: #f2a100;
    --ex-accent-2: #ffc247;
    --ex-accent-dk: #8a5a00;
    --ex-ink: #14161a;
    --ex-ink-2: #2a2d34;
    --ex-muted: #5d626c;
    --ex-line: #e4e6ea;
    --ex-soft: #f5f6f8;
    --ex-card: #ffffff;
    --ex-radius: 22px;
    --ex-radius-sm: 14px;
    --ex-shadow: 0 22px 55px rgba(20, 22, 26, 0.09);
    --ex-shadow-hover: 0 34px 80px rgba(20, 22, 26, 0.16);
    --ex-mono: ui-monospace, "SF Mono", "JetBrains Mono", "Roboto Mono", "Consolas", monospace;
}

/* --------------------------------------------------------------------------
   İskelet
   -------------------------------------------------------------------------- */
.ex-section { position: relative; padding: clamp(60px, 8vw, 110px) 0; background: var(--ex-card); overflow: hidden; }
.ex-section--soft { background: var(--ex-soft); }

.ex-h2 {
    margin: 14px 0 0;
    font-family: "Poppins", sans-serif;
    font-size: clamp(27px, 3.8vw, 46px);
    line-height: 1.18;
    letter-spacing: -0.02em;
    font-weight: 800;
    color: var(--ex-ink);
    text-wrap: balance;
}

.ex-tag {
    display: inline-flex; align-items: center; gap: 9px;
    font-family: var(--ex-mono);
    font-size: 12.5px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase;
    color: var(--ex-accent-dk);
}
.ex-tag::before { content: ""; width: 22px; height: 1px; background: currentColor; }
.ex-section--cta .ex-tag { color: var(--ex-accent); }

.ex-head { max-width: 780px; margin: 0 auto clamp(32px, 4.5vw, 56px); text-align: center; }
.ex-head .ex-tag { justify-content: center; }
.ex-head-lead { margin: 18px 0 0; font-size: clamp(15px, 1.3vw, 18px); line-height: 1.7; color: var(--ex-muted); }

/* --------------------------------------------------------------------------
   Butonlar (self-contained — landing.css yüklenmez). WhatsApp ikonlu buton
   global kuralla (header-pill.css) yeşile döner; burada yalnız iskelet.
   -------------------------------------------------------------------------- */
.lp-btn, .ex-btn, .ex-btn-ghost {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    padding: 15px 28px; border-radius: 999px;
    font-size: 15px; font-weight: 600; text-decoration: none; text-align: center;
    border: 2px solid transparent; cursor: pointer; line-height: 1.2;
    transition: transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.lp-btn-primary, .ex-btn { background: var(--ex-accent); color: var(--ex-ink); box-shadow: 0 14px 30px rgba(242, 161, 0, 0.26); }
.lp-btn-primary:hover, .ex-btn:hover { background: var(--ex-accent-2); color: var(--ex-ink); transform: translateY(-2px); }
.ex-btn-ghost { background: transparent; border-color: currentColor; color: #fff; }
.ex-btn-ghost:hover { transform: translateY(-2px); color: var(--ex-accent-2); }
.lp-btn:focus-visible, .ex-card a:focus-visible, .ex-faq-q:focus-visible, .ex-faq-a a:focus-visible, .ex-cta-mail a:focus-visible {
    outline: 3px solid var(--ex-accent); outline-offset: 3px;
}

/* Blok (flex) + fit-content: kardeş eyebrow breadcrumb satırına binmesin */
.pp-crumb { display: flex; width: fit-content; max-width: 100%; align-items: center; flex-wrap: wrap; gap: 8px 10px; font-size: 13px; margin-bottom: 18px; }
.ex-crumb a { color: rgba(255, 255, 255, 0.72); text-decoration: none; transition: color .2s; }
.ex-crumb a:hover { color: #fff; }
.ex-crumb i { font-size: 11px; opacity: .65; color: rgba(255, 255, 255, 0.72); }
.ex-crumb .is-current { color: var(--ex-accent); font-weight: 600; }

/* ==========================================================================
   HERO
   ========================================================================== */
.ex-hero {
    position: relative;
    margin-top: -96px;                 /* floating pill bar altına tam taşır */
    padding: clamp(140px, 15vw, 200px) 0 clamp(56px, 7vw, 96px);
    background:
        radial-gradient(90% 70% at 85% 20%, rgba(242, 161, 0, 0.16), transparent 60%),
        linear-gradient(160deg, #1b1e24 0%, #14161a 55%, #0c0d10 100%);
    color: #fff; overflow: hidden; isolation: isolate;
}
.ex-hero-media { position: absolute; inset: 0; z-index: -3; margin: 0; overflow: hidden; }
.ex-hero-media img { width: 100%; height: 100%; object-fit: cover; opacity: .55; }
.ex-hero-scrim {
    position: absolute; inset: 0; z-index: -2; pointer-events: none;
    background:
        linear-gradient(100deg, rgba(12,13,16,.96) 0%, rgba(12,13,16,.84) 42%, rgba(12,13,16,.5) 74%, rgba(12,13,16,.3) 100%),
        linear-gradient(0deg, rgba(12,13,16,.95) 1%, transparent 30%);
}
.ex-hero-glow {
    position: absolute; width: 58vw; height: 58vw; max-width: 700px; max-height: 700px;
    right: -12vw; top: -18vw; z-index: -2; pointer-events: none;
    background: radial-gradient(circle, rgba(242, 161, 0, 0.18), transparent 62%);
    filter: blur(20px); animation: bs-glow-pulse 9s ease-in-out infinite;
}
.ex-hero-copy { position: relative; z-index: 2; max-width: 860px; min-width: 0; }

.ex-eyebrow {
    display: inline-flex; align-items: center; gap: 10px;
    font-family: var(--ex-mono); font-size: 12.5px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase;
    color: var(--ex-accent); margin-bottom: 18px;
}
.ex-eyebrow-dot { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: var(--ex-accent); animation: ex-ping 2.2s ease-out infinite; }
@keyframes ex-ping { 0% { box-shadow: 0 0 0 0 rgba(242, 161, 0, 0.55); } 100% { box-shadow: 0 0 0 14px rgba(242, 161, 0, 0); } }

/* Başlık rengi AÇIKÇA beyaz: global h1..h6 rengi koyu zeminde başlığı karartmasın */
.ex-hero-title {
    margin: 0; font-family: "Poppins", sans-serif;
    font-size: clamp(31px, 4.7vw, 62px); line-height: 1.16; letter-spacing: -0.025em; font-weight: 800;
    color: #fff; text-wrap: balance;
}
.ex-hero-accent {
    margin: 16px 0 0; font-family: "Poppins", sans-serif;
    font-size: clamp(17px, 1.9vw, 24px); line-height: 1.35; font-weight: 600; letter-spacing: -0.01em;
    color: var(--ex-accent-2);
}
.ex-hero-tag { margin: 18px 0 0; max-width: 66ch; font-size: clamp(15.5px, 1.35vw, 18px); line-height: 1.7; color: rgba(255, 255, 255, 0.8); }

.ex-hero-chips { list-style: none; margin: 24px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.ex-hero-chips li {
    display: inline-flex; align-items: center; gap: 8px; padding: 8px 15px; border-radius: 999px;
    font-size: 13.5px; font-weight: 500; color: rgba(255, 255, 255, 0.92);
    background: rgba(255, 255, 255, 0.07); border: 1px solid rgba(255, 255, 255, 0.14);
}
.ex-hero-chips li i { color: var(--ex-accent); font-size: 14px; }
.ex-hero-actions { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 12px; }

@media (max-width: 575px) {
    .ex-hero-actions .lp-btn { flex: 1 1 100%; }
    /* Telefonda çipler alttaki bilgi şeridiyle aynı işi görür → CTA ilk ekranda kalsın */
    .ex-hero-chips { display: none; }
}

/* ==========================================================================
   BİLGİ ŞERİDİ (koyu) — yalnız repoda teyitli ölçüler; sayaç animasyonu yok
   ========================================================================== */
.ex-facts { background: var(--ex-ink); padding: clamp(28px, 4vw, 48px) 0; border-top: 1px solid rgba(255,255,255,.08); }
.ex-facts-grid { margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(18px, 3vw, 40px); }
.ex-fact { display: flex; flex-direction: column; text-align: center; min-width: 0; }
.ex-fact-v {
    margin: 0; font-family: "Poppins", sans-serif; font-weight: 700;
    font-size: clamp(16px, 1.9vw, 25px); line-height: 1.25; letter-spacing: -0.01em;
    color: var(--ex-accent-2); text-wrap: balance;
}
.ex-fact-k { margin: 8px 0 0; font-weight: 400; font-size: clamp(12px, 1vw, 14px); line-height: 1.45; color: rgba(255,255,255,.68); }
@media (max-width: 767px) { .ex-facts-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 16px; } }

/* ==========================================================================
   ÜRÜN KARTLARI (4)
   ========================================================================== */
.ex-products { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(18px, 2.4vw, 30px); }
.ex-card {
    display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    border-radius: var(--ex-radius); overflow: hidden; background: var(--ex-card);
    border: 1px solid var(--ex-line); box-shadow: var(--ex-shadow);
    transition: transform .3s ease, box-shadow .3s ease;
}
.ex-card:hover { transform: translateY(-4px); box-shadow: var(--ex-shadow-hover); }
.ex-card-fig { margin: 0; min-height: 100%; background: var(--ex-soft); }
.ex-card-fig img { display: block; width: 100%; height: 100%; min-height: 220px; object-fit: cover; }
.ex-card-body { padding: clamp(20px, 2.4vw, 30px); display: flex; flex-direction: column; min-width: 0; }
.ex-card-kicker { font-family: var(--ex-mono); font-size: 11.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--ex-accent-dk); }
.ex-card-title { margin: 8px 0 0; font-family: "Poppins", sans-serif; font-size: clamp(18px, 1.6vw, 22px); line-height: 1.3; font-weight: 700; letter-spacing: -0.01em; color: var(--ex-ink); }
.ex-card-title a { color: inherit; text-decoration: none; }
.ex-card-title a:hover { color: var(--ex-accent-dk); }
.ex-card-text { margin: 12px 0 0; font-size: 14.5px; line-height: 1.7; color: var(--ex-muted); }
.ex-card-specs { list-style: none; margin: 16px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ex-card-specs li { padding: 6px 11px; border-radius: 999px; font-size: 12.5px; font-weight: 500; line-height: 1.3; color: var(--ex-ink-2); background: var(--ex-soft); border: 1px solid var(--ex-line); }
.ex-card-more { margin-top: auto; padding-top: 18px; font-size: 14px; font-weight: 600; color: var(--ex-accent-dk); text-decoration: none; }
.ex-card-more:hover { color: var(--ex-ink); text-decoration: underline; }
@media (max-width: 1199px) { .ex-products { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 575px) {
    .ex-card { grid-template-columns: minmax(0, 1fr); }
    .ex-card-fig img { min-height: 0; height: auto; aspect-ratio: 16 / 9; }
}

/* ==========================================================================
   KİMLER ALIYOR
   ========================================================================== */
.ex-buyers { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(16px, 2vw, 24px); }
.ex-buyer {
    grid-column: span 2;
    padding: clamp(20px, 2.4vw, 28px); border-radius: var(--ex-radius-sm);
    background: var(--ex-card); border: 1px solid var(--ex-line);
}
/* 5 kart: ilk sıra 3'lü, ikinci sıra 2'li (ortalanmış gibi tam genişlik) */
.ex-buyer:nth-child(4), .ex-buyer:nth-child(5) { grid-column: span 3; }
.ex-buyer-ico { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 13px; background: rgba(242,161,0,.14); color: var(--ex-accent-dk); font-size: 25px; }
.ex-buyer-title { margin: 16px 0 0; font-family: "Poppins", sans-serif; font-size: 17.5px; line-height: 1.35; font-weight: 700; color: var(--ex-ink); }
.ex-buyer-need { margin: 10px 0 0; font-size: 14.5px; line-height: 1.65; color: var(--ex-ink-2); font-style: italic; }
.ex-buyer-text { margin: 10px 0 0; padding-top: 10px; border-top: 1px dashed var(--ex-line); font-size: 14.5px; line-height: 1.65; color: var(--ex-muted); }
@media (max-width: 991px) {
    .ex-buyers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ex-buyer, .ex-buyer:nth-child(4), .ex-buyer:nth-child(5) { grid-column: auto; }
    .ex-buyer:last-child { grid-column: 1 / -1; }
}
@media (max-width: 575px) {
    .ex-buyers { grid-template-columns: minmax(0, 1fr); }
    .ex-buyer:last-child { grid-column: auto; }
}

/* ==========================================================================
   SİPARİŞ ADIMLARI
   ========================================================================== */
.ex-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(16px, 2vw, 24px); counter-reset: none; }
.ex-step { position: relative; padding: clamp(20px, 2.4vw, 28px); border-radius: var(--ex-radius-sm); background: var(--ex-soft); border: 1px solid var(--ex-line); min-width: 0; }
.ex-step-no { position: absolute; top: 18px; right: 20px; font-family: var(--ex-mono); font-size: 13px; font-weight: 600; letter-spacing: .1em; color: rgba(20,22,26,.38); }
.ex-step-ico { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 13px; background: var(--ex-ink); color: var(--ex-accent); font-size: 25px; }
.ex-step-title { margin: 16px 0 0; font-family: "Poppins", sans-serif; font-size: 17px; line-height: 1.35; font-weight: 700; color: var(--ex-ink); }
.ex-step-text { margin: 10px 0 0; font-size: 14.5px; line-height: 1.65; color: var(--ex-muted); }
@media (max-width: 1199px) { .ex-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575px) { .ex-steps { grid-template-columns: minmax(0, 1fr); } }

/* ==========================================================================
   SSS
   ========================================================================== */
.ex-faq { max-width: 860px; margin: 0 auto; display: flex; flex-direction: column; gap: 12px; }
.ex-faq-item { border: 1px solid var(--ex-line); border-radius: var(--ex-radius-sm); background: var(--ex-card); overflow: hidden; transition: box-shadow .3s, border-color .3s; }
.ex-faq-item.is-open { box-shadow: var(--ex-shadow); border-color: rgba(242,161,0,.55); }
.ex-faq-h { margin: 0; font-size: inherit; line-height: inherit; }
.ex-faq-q {
    width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px;
    padding: 18px 22px; background: none; border: 0; cursor: pointer; text-align: left;
    font-family: "Poppins", sans-serif; font-size: clamp(15.5px, 1.3vw, 17.5px); font-weight: 600; line-height: 1.4; color: var(--ex-ink);
}
.ex-faq-plus { position: relative; flex: 0 0 auto; width: 22px; height: 22px; }
.ex-faq-plus::before, .ex-faq-plus::after { content: ""; position: absolute; left: 50%; top: 50%; background: var(--ex-accent-dk); border-radius: 2px; transition: transform .3s ease; }
.ex-faq-plus::before { width: 14px; height: 2px; transform: translate(-50%, -50%); }
.ex-faq-plus::after { width: 2px; height: 14px; transform: translate(-50%, -50%); }
.ex-faq-item.is-open .ex-faq-plus::after { transform: translate(-50%, -50%) scaleY(0); }
.ex-faq-a { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.ex-faq-item.is-open .ex-faq-a { max-height: 640px; }
.ex-faq-a p { margin: 0; padding: 0 22px 20px; font-size: 14.5px; line-height: 1.7; color: var(--ex-muted); }
.ex-faq-a a { color: var(--ex-accent-dk); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.ex-faq-a a:hover { color: var(--ex-ink); }

/* ==========================================================================
   CTA (koyu) — başlık rengi açıkça verildi (global başlık rengi ezmesin)
   ========================================================================== */
.ex-section--cta { background: linear-gradient(160deg, #1b1e24 0%, #14161a 60%, #0c0d10 100%); color: #fff; }
.ex-cta {
    position: relative; max-width: 860px; margin: 0 auto; text-align: center;
    padding: clamp(34px, 5vw, 60px) clamp(20px, 4vw, 56px);
    border-radius: clamp(22px, 3vw, 32px);
    background: rgba(255,255,255,.04); border: 1px solid rgba(242,161,0,.24);
}
.ex-cta .ex-tag { justify-content: center; }
.ex-cta-title { margin: 14px 0 0; font-family: "Poppins", sans-serif; font-size: clamp(25px, 3.3vw, 40px); font-weight: 800; line-height: 1.2; letter-spacing: -0.02em; color: #fff; text-wrap: balance; }
.ex-cta p { margin: 16px auto 0; max-width: 58ch; font-size: clamp(15px, 1.4vw, 18px); line-height: 1.7; color: rgba(255,255,255,.78); }
.ex-cta-actions { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.ex-cta .ex-cta-mail { margin-top: 18px; font-size: 14.5px; }
.ex-cta-mail a { color: rgba(255,255,255,.86); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.ex-cta-mail a:hover { color: var(--ex-accent-2); }
@media (max-width: 575px) { .ex-cta-actions .lp-btn { flex: 1 1 100%; } }

/* ==========================================================================
   SCROLL-REVEAL (yalnız JS varken gizle → FOUC yok)
   ========================================================================== */
.ex-js [data-ex-reveal] { opacity: 0; translate: 0 26px; transition: opacity .7s cubic-bezier(.2,.7,.2,1), translate .7s cubic-bezier(.2,.7,.2,1); }
.ex-js [data-ex-reveal].is-in { opacity: 1; translate: 0 0; }
.ex-js [data-ex-stagger] > * { opacity: 0; translate: 0 20px; transition: opacity .6s ease, translate .6s ease, transform .3s ease, box-shadow .3s ease; }
.ex-js [data-ex-stagger].is-in > * { opacity: 1; translate: 0 0; }
.ex-js [data-ex-stagger].is-in > *:nth-child(2) { transition-delay: .08s; }
.ex-js [data-ex-stagger].is-in > *:nth-child(3) { transition-delay: .16s; }
.ex-js [data-ex-stagger].is-in > *:nth-child(4) { transition-delay: .24s; }
.ex-js [data-ex-stagger].is-in > *:nth-child(5) { transition-delay: .32s; }

@media (prefers-reduced-motion: reduce) {
    .ex-js [data-ex-reveal], .ex-js [data-ex-stagger] > * { opacity: 1 !important; translate: none !important; transition: none !important; }
    .ex-hero-glow, .ex-eyebrow-dot { animation: none !important; }
    .ex-card { transition: none; }
}