:root {
    --asphalt: #14161B;
    --asphalt-2: #1D2026;
    --asphalt-3: #262A32;
    --line: #2E323B;
    --paper: #F5F3EE;
    --paper-2: #EBE8E0;
    --ink: #14161B;
    --ink-2: #4C4F58;
    --muted: #8B8E97;
    --orange: #E8611A;
    --orange-hot: #FF6D1F;
    --orange-deep: #C24E12;
    --on-dark: #F5F3EE;
    --on-dark-2: #B7BAC2;
    --r: 16px;
    --shadow-lg: 0 24px 60px -12px rgba(20,22,27,0.35);
  }
  * { box-sizing: border-box; margin: 0; padding: 0; }
  ::selection { background: var(--orange); color: #fff; }
  :focus-visible { outline: 3px solid var(--orange-hot); outline-offset: 2px; border-radius: 4px; }
  a, button { -webkit-tap-highlight-color: transparent; }
  section[id], div[id] { scroll-margin-top: 88px; }
  html { scroll-behavior: smooth; }
  body {
    font-family: 'Manrope', system-ui, sans-serif;
    background: var(--paper); color: var(--ink);
    line-height: 1.65; -webkit-font-smoothing: antialiased;
  }
  img { max-width: 100%; display: block; }
  .wrap { max-width: 1160px; margin: 0 auto; padding: 0 26px; }
  h1, h2, h3 { font-family: 'Bricolage Grotesque', sans-serif; letter-spacing: -0.01em; }
  .anton { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; letter-spacing: -0.015em; }

  /* reveal animasyonu */
  .rv { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s ease; }
  .rv.in { opacity: 1; transform: none; }
  @media (prefers-reduced-motion: reduce) {
    .rv { opacity: 1; transform: none; transition: none; }
    html { scroll-behavior: auto; }
    .mq-track, .wa-float { animation: none !important; }
  }

  /* ==== utility bar ==== */
  .ubar { background: #0E1013; color: var(--on-dark-2); font-size: 12.5px; }
  .ubar .wrap { display: flex; justify-content: space-between; align-items: center; height: 36px; gap: 16px; }
  .ubar b { color: var(--on-dark); font-weight: 700; }
  .ubar a { color: var(--orange-hot); text-decoration: none; font-weight: 700; }
  .ubar .dot { color: var(--line); margin: 0 6px; }
  @media (max-width: 680px) { .ubar .hide-m { display: none; } }

  /* ==== nav ==== */
  .topbar { position: sticky; top: 0; z-index: 50; background: rgba(20,22,27,0.86); backdrop-filter: blur(14px); border-bottom: 1px solid transparent; transition: border-color .3s, background .3s; }
  .topbar.scrolled { border-bottom-color: var(--line); background: rgba(14,16,19,0.94); }
  .topbar .wrap { display: flex; align-items: center; gap: 30px; height: 74px; }
  .brand { display: flex; align-items: center; gap: 12px; color: var(--on-dark); text-decoration: none; }
  .brand-mark { width: 40px; height: 40px; border-radius: 10px; background: var(--orange); display: grid; place-items: center; flex: none; }
  .brand-mark svg { width: 23px; height: 23px; }
  .brand-name { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 17.5px; letter-spacing: 0.02em; }
  .brand-name span { color: var(--orange-hot); }
  nav { display: flex; gap: 26px; margin-left: auto; }
  nav a { color: var(--on-dark-2); text-decoration: none; font-size: 14px; font-weight: 700; transition: color .2s; }
  nav a:hover { color: var(--on-dark); }
  .tel-btn {
    display: inline-flex; align-items: center; gap: 9px;
    background: var(--orange); color: #fff; text-decoration: none;
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 14px;
    padding: 11px 20px; border-radius: 11px; white-space: nowrap; transition: background .2s, transform .15s;
  }
  .tel-btn:hover { background: var(--orange-deep); transform: translateY(-1px); }
  .tel-btn svg { width: 16px; height: 16px; }
  .burger {
    display: none; margin-left: auto; background: none; border: 1.5px solid var(--line);
    border-radius: 10px; width: 44px; height: 44px; cursor: pointer; place-items: center;
  }
  .burger svg { width: 22px; height: 22px; stroke: var(--on-dark); }
  .mnav {
    display: none; position: fixed; inset: 0; z-index: 60; background: rgba(14,16,19,0.97);
    padding: 90px 30px 30px; flex-direction: column; gap: 4px;
  }
  .mnav.open { display: flex; }
  .mnav a {
    color: var(--on-dark); text-decoration: none; font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 800; font-size: 26px; padding: 14px 0; border-bottom: 1px solid var(--line);
  }
  .mnav a:active { color: var(--orange-hot); }
  .mnav .close {
    position: absolute; top: 22px; right: 26px; background: none; border: 1.5px solid var(--line);
    border-radius: 10px; width: 44px; height: 44px; color: var(--on-dark);
    font-family: 'Bricolage Grotesque'; font-size: 22px; cursor: pointer;
  }
  .mnav .m-tel { margin-top: auto; border-bottom: 0; }
  .mnav .m-tel .tel-btn { width: 100%; justify-content: center; padding: 16px; font-size: 17px; }
  @media (max-width: 860px) {
    nav { display: none; }
    .topbar .tel-btn { display: none; }
    .burger { display: grid; }
  }

  /* mobil alt arama çubuğu */
  .callbar {
    display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 55;
    background: rgba(14,16,19,0.96); backdrop-filter: blur(12px);
    border-top: 1px solid var(--line);
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
    grid-template-columns: 1fr 1fr; gap: 10px;
  }
  .callbar a {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    text-decoration: none; font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800;
    font-size: 15px; padding: 13px 0; border-radius: 11px;
  }
  .callbar .c1 { background: var(--orange); color: #fff; }
  .callbar .c2 { background: var(--asphalt-3); color: var(--on-dark); }
  .callbar svg { width: 17px; height: 17px; }
  @media (max-width: 680px) {
    .callbar { display: grid; }
    body { padding-bottom: calc(66px + env(safe-area-inset-bottom)); }
  }

  /* ==== sabit WhatsApp butonu (masaüstü/tablet) ==== */
  .wa-float {
    position: fixed; right: 24px; bottom: 26px; z-index: 54;
    display: inline-flex; align-items: center; gap: 0;
    height: 58px; padding: 0 16px; border-radius: 999px;
    background: #25D366; color: #fff; text-decoration: none;
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 15px;
    white-space: nowrap; overflow: hidden;
    box-shadow: 0 14px 34px -8px rgba(18,140,70,0.55), 0 3px 10px rgba(20,22,27,0.22);
    transition: gap .28s ease, padding .28s ease, background .2s, transform .2s;
    animation: wa-pulse 3s ease-out infinite;
  }
  .wa-float svg { width: 27px; height: 27px; flex: none; fill: currentColor; }
  .wa-float .lbl {
    max-width: 0; opacity: 0; transition: max-width .28s ease, opacity .22s ease;
  }
  .wa-float:hover, .wa-float:focus-visible {
    background: #1FB855; transform: translateY(-2px); gap: 11px; padding: 0 22px 0 16px;
    animation: none;
    box-shadow: 0 18px 40px -8px rgba(18,140,70,0.6), 0 4px 12px rgba(20,22,27,0.26);
  }
  .wa-float:hover .lbl, .wa-float:focus-visible .lbl { max-width: 220px; opacity: 1; }
  /* nabız halkası */
  @keyframes wa-pulse {
    0%   { box-shadow: 0 14px 34px -8px rgba(18,140,70,0.55), 0 3px 10px rgba(20,22,27,0.22), 0 0 0 0 rgba(37,211,102,0.5); }
    70%  { box-shadow: 0 14px 34px -8px rgba(18,140,70,0.55), 0 3px 10px rgba(20,22,27,0.22), 0 0 0 20px rgba(37,211,102,0); }
    100% { box-shadow: 0 14px 34px -8px rgba(18,140,70,0.55), 0 3px 10px rgba(20,22,27,0.22), 0 0 0 0 rgba(37,211,102,0); }
  }
  @media (max-width: 680px) { .wa-float { display: none; } }

  /* ==== hero ==== */
  .hero {
    position: relative; min-height: 88vh; display: flex; align-items: center;
    color: var(--on-dark); isolation: isolate; padding: 90px 0 150px;
  }
  .hero-bg { position: absolute; inset: 0; z-index: -2; display: block; }
  .hero-bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 38%; }
  .hero::after {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background:
      linear-gradient(180deg, rgba(14,16,19,0.72) 0%, rgba(14,16,19,0.28) 45%, rgba(20,22,27,0.88) 100%),
      linear-gradient(100deg, rgba(14,16,19,0.82) 0%, rgba(14,16,19,0.25) 60%, rgba(14,16,19,0.05) 100%);
  }
  .eyebrow {
    display: inline-flex; align-items: center; gap: 12px;
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 700; font-size: 12.5px;
    letter-spacing: 0.22em; color: var(--orange-hot); text-transform: uppercase;
  }
  .eyebrow::before { content: ""; width: 38px; height: 3px; background: var(--orange); }
  .hero h1 {
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800;
    font-size: clamp(38px, 6.8vw, 86px); line-height: 1.02; text-transform: uppercase;
    margin: 26px 0 24px; max-width: 15ch; letter-spacing: -0.02em;
    text-shadow: 0 3px 24px rgba(0,0,0,0.35);
  }
  .hero h1 em { font-style: normal; color: var(--orange-hot); }
  .hero .lede { font-size: 18.5px; color: var(--on-dark-2); max-width: 50ch; font-weight: 500; }
  .hero-ctas { display: flex; gap: 14px; margin-top: 36px; flex-wrap: wrap; }
  .btn-ghost {
    display: inline-flex; align-items: center; gap: 9px;
    border: 1.5px solid rgba(245,243,238,0.35); color: var(--on-dark); text-decoration: none;
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 14px;
    padding: 13px 22px; border-radius: 11px; backdrop-filter: blur(4px); transition: border-color .2s, background .2s;
  }
  .btn-ghost:hover { border-color: var(--on-dark); background: rgba(245,243,238,0.08); }
  .tel-btn.big { padding: 13px 24px; font-size: 15px; }

  /* maersk çalıntısı: hero altına taşan kart */
  .quick {
    position: relative; z-index: 5; margin-top: -92px;
  }
  .quick-card {
    background: #fff; border-radius: 20px; box-shadow: var(--shadow-lg);
    display: grid; grid-template-columns: 1.1fr 1.2fr 1fr; overflow: hidden;
  }
  .q-cell { padding: 30px 32px; display: flex; gap: 16px; align-items: flex-start; }
  .q-cell + .q-cell { border-left: 1px solid var(--paper-2); }
  .q-ic { width: 44px; height: 44px; border-radius: 11px; background: rgba(232,97,26,0.1); display: grid; place-items: center; flex: none; }
  .q-ic svg { width: 22px; height: 22px; }
  .q-cell .k { font-size: 11.5px; font-weight: 800; letter-spacing: 0.14em; color: var(--muted); text-transform: uppercase; }
  .q-cell .v { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 17px; margin-top: 3px; }
  .q-cell .v a { color: var(--ink); text-decoration: none; }
  .q-cell .v a:hover { color: var(--orange-deep); }
  .q-cell p { font-size: 13px; color: var(--ink-2); margin-top: 3px; }
  @media (max-width: 900px) {
    .quick-card { grid-template-columns: 1fr; }
    .q-cell + .q-cell { border-left: 0; border-top: 1px solid var(--paper-2); }
  }

  /* ==== marquee ==== */
  .mq { background: var(--asphalt); overflow: hidden; padding: 22px 0; margin-top: 84px; border-top: 3px solid var(--orange); }
  .mq-track { display: flex; gap: 0; width: max-content; animation: mq 38s linear infinite; }
  .mq span {
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 20px; letter-spacing: 0.06em;
    color: transparent; -webkit-text-stroke: 1px rgba(245,243,238,0.34); text-transform: uppercase;
    padding: 0 22px; white-space: nowrap;
  }
  .mq span.f { color: var(--orange); -webkit-text-stroke: 0; }
  @keyframes mq { to { transform: translateX(-50%); } }

  /* ==== sections ==== */
  section { padding: 96px 0; }
  .sec-head { max-width: 62ch; margin-bottom: 52px; }
  .sec-head .eyebrow { color: var(--orange-deep); }
  .sec-head .eyebrow::before { background: var(--orange-deep); }
  .sec-head h2 { font-size: clamp(30px, 4.4vw, 46px); line-height: 1.12; margin-top: 16px; font-weight: 800; text-wrap: balance; }
  .sec-head p { color: var(--ink-2); margin-top: 14px; font-size: 16.5px; }

  .cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(245px, 1fr)); gap: 20px; }
  .card {
    background: #fff; border: 1px solid var(--paper-2); border-radius: var(--r);
    padding: 30px 26px; transition: transform .25s ease, box-shadow .25s ease;
  }
  .card:hover { transform: translateY(-6px); box-shadow: 0 20px 44px -18px rgba(20,22,27,0.22); }
  .card .ic { width: 50px; height: 50px; border-radius: 13px; background: rgba(232,97,26,0.1); display: grid; place-items: center; margin-bottom: 20px; }
  .card .ic svg { width: 26px; height: 26px; }
  .card h3 { font-size: 17.5px; margin-bottom: 9px; font-weight: 800; }
  .card p { font-size: 14px; color: var(--ink-2); }

  /* process */
  .process { background: var(--paper-2); }
  .steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; counter-reset: step; }
  @media (max-width: 780px) { .steps { grid-template-columns: 1fr; } }
  .step { position: relative; background: #fff; border-radius: var(--r); padding: 34px 28px 30px; overflow: hidden; }
  .step .big-n {
    font-family: 'Bricolage Grotesque', sans-serif; font-size: 96px; line-height: 1;
    position: absolute; top: -14px; right: 10px;
    color: transparent; -webkit-text-stroke: 1.5px rgba(232,97,26,0.32); font-weight: 800;
  }
  .step h3 { font-size: 18px; font-weight: 800; margin-bottom: 8px; position: relative; }
  .step p { font-size: 14.5px; color: var(--ink-2); position: relative; max-width: 30ch; }
  .step .tag { display: inline-block; font-family: 'Bricolage Grotesque'; font-weight: 800; font-size: 11.5px; letter-spacing: 0.16em; color: var(--orange-deep); text-transform: uppercase; margin-bottom: 14px; }

  /* quote band */
  .band {
    position: relative; isolation: isolate; color: var(--on-dark);
    padding: 130px 0; text-align: center;
  }
  .band::before {
    content: ""; position: absolute; inset: 0; z-index: -2;
    background: url('img/loading.jpg') center / cover no-repeat;
    background-image: image-set(url('img/loading.webp') type('image/webp'), url('img/loading.jpg') type('image/jpeg'));
  }
  .band::after { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(14,16,19,0.78); }
  .band .anton { font-size: clamp(30px, 5.2vw, 58px); line-height: 1.08; text-transform: uppercase; max-width: 22ch; margin: 0 auto; }
  .band .anton em { font-style: normal; color: var(--orange-hot); }
  .band .sub { margin-top: 18px; color: var(--on-dark-2); font-weight: 600; font-size: 14.5px; letter-spacing: 0.12em; text-transform: uppercase; }

  /* coverage */
  .coverage { background: var(--asphalt); color: var(--on-dark); }
  .coverage .sec-head h2 { color: var(--on-dark); }
  .coverage .sec-head p { color: var(--on-dark-2); }
  .coverage .eyebrow { color: var(--orange-hot); }
  .coverage .eyebrow::before { background: var(--orange); }
  .cov-grid { display: grid; grid-template-columns: 1.25fr 0.9fr; gap: 54px; align-items: start; }
  @media (max-width: 860px) { .cov-grid { grid-template-columns: 1fr; } }

  .route { margin: 8px 0 44px; }
  .route-line { position: relative; height: 64px; }
  .route-track { position: absolute; left: 0; right: 0; top: 50%; border-top: 3px dashed var(--line); }
  .route-progress { position: absolute; left: 0; width: 62%; top: 50%; border-top: 3px solid var(--orange); box-shadow: 0 0 18px rgba(232,97,26,0.5); }
  .node { position: absolute; top: 0; bottom: 0; width: 0; }
  .node .dot {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 16px; height: 16px; border-radius: 50%; background: var(--orange);
    box-shadow: 0 0 0 4px var(--asphalt), 0 0 0 6px var(--orange);
  }
  .node.end .dot { background: var(--asphalt-3); box-shadow: 0 0 0 4px var(--asphalt), 0 0 0 6px var(--line); }
  .node label {
    position: absolute; top: calc(50% + 26px); left: 50%; transform: translateX(-50%);
    font-family: 'Bricolage Grotesque', sans-serif; white-space: nowrap; text-align: center;
    font-weight: 800; font-size: 14px; letter-spacing: 0.14em; color: var(--on-dark);
  }
  .node small { display: block; color: var(--muted); font-size: 10.5px; letter-spacing: 0.1em; font-weight: 600; }
  .truck { position: absolute; left: 62%; top: 50%; transform: translate(-50%, -50%); background: var(--orange); border-radius: 9px; padding: 8px 10px; box-shadow: 0 6px 18px rgba(232,97,26,0.45); }
  .truck svg { width: 24px; height: 24px; display: block; }
  @media (max-width: 640px) {
    .node:not(.end) label { left: 0; transform: none; text-align: left; }
    .node.end label { left: auto; right: 0; transform: none; text-align: right; }
    .node label { font-size: 12.5px; }
    .hero { min-height: 74vh; padding: 72px 0 122px; }
    .hero::before { background-position: 62% 38%; }
    .hero .lede { font-size: 16.5px; }
    section { padding: 64px 0; }
    .sec-head { margin-bottom: 36px; }
    .quick { margin-top: -70px; }
    .q-cell { padding: 20px 22px; }
    .mq { margin-top: 64px; padding: 15px 0; }
    .mq span { font-size: 16px; }
    .band { padding: 88px 0; }
    .step .big-n { font-size: 76px; }
    .cta { padding: 64px 0; }
    .cta .wrap { flex-direction: column; align-items: flex-start; }
    .why { padding: 20px 0; }
    footer { padding: 42px 0 28px; }
  }

  .chips { display: flex; flex-wrap: wrap; gap: 10px; }
  .chip { border: 1px solid var(--line); border-radius: 999px; padding: 9px 17px; font-size: 13px; font-weight: 700; color: var(--on-dark-2); }
  .chip.hot { background: var(--orange); border-color: var(--orange); color: #fff; }
  .cov-side { display: grid; gap: 20px; }
  .cov-photo { border-radius: var(--r); overflow: hidden; border: 1px solid var(--line); }
  .cov-photo picture { display: block; }
  .cov-photo img { width: 100%; height: 230px; object-fit: cover; }
  .cov-note { border-left: 3px solid var(--orange); padding: 6px 0 6px 20px; color: var(--on-dark-2); font-size: 15px; }
  .cov-note b { color: var(--on-dark); }

  /* ilce kartlari */
  .dist { margin-top: 56px; padding-top: 46px; border-top: 1px solid var(--line); }
  .dist > h3 {
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800;
    font-size: clamp(20px, 2.6vw, 26px); color: var(--on-dark); margin-bottom: 26px;
  }
  .dist-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; }
  .dist-card {
    background: var(--asphalt-2); border: 1px solid var(--line); border-radius: var(--r);
    padding: 24px 22px; transition: border-color .2s, transform .2s;
  }
  .dist-card:hover { border-color: var(--orange); transform: translateY(-3px); }
  .dist-card h4 {
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 18px;
    color: var(--on-dark); display: flex; align-items: center; gap: 9px;
  }
  .dist-card h4::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--orange); flex: none; }
  .dist-card p { color: var(--on-dark-2); font-size: 14.5px; margin-top: 10px; }
  .dist-card .spots { color: var(--muted); font-size: 13px; margin-top: 12px; display: block; }

  /* why */
  .why-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 56px; }
  @media (max-width: 780px) { .why-list { grid-template-columns: 1fr; } }
  .why { display: flex; gap: 20px; padding: 26px 0; border-bottom: 1px solid var(--paper-2); }
  .why .n { font-family: 'Bricolage Grotesque', sans-serif; color: var(--orange); font-size: 20px; padding-top: 1px; flex: none; }
  .why h3 { font-size: 16.5px; font-weight: 800; }
  .why p { font-size: 14.5px; color: var(--ink-2); margin-top: 5px; }

  /* faq */
  .faq { background: var(--paper-2); }
  .faq-list { max-width: 780px; }
  details {
    background: #fff; border: 1px solid var(--paper-2); border-radius: 14px;
    margin-bottom: 12px; overflow: hidden;
  }
  summary {
    cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px;
    padding: 20px 24px; font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 15.5px;
  }
  summary::-webkit-details-marker { display: none; }
  summary::after { content: "+"; font-family: 'Bricolage Grotesque'; font-size: 22px; color: var(--orange); transition: transform .25s; flex: none; }
  details[open] summary::after { transform: rotate(45deg); }
  details p { padding: 0 24px 22px; color: var(--ink-2); font-size: 14.5px; max-width: 65ch; }

  /* cta band */
  .cta { background: var(--orange); color: #fff; padding: 84px 0; }
  .cta .wrap { display: flex; align-items: center; justify-content: space-between; gap: 34px; flex-wrap: wrap; }
  .cta .anton { font-size: clamp(30px, 4.6vw, 52px); text-transform: uppercase; line-height: 1.05; max-width: 18ch; }
  .cta-btn {
    display: inline-flex; align-items: center; gap: 10px; flex: none;
    background: var(--asphalt); color: var(--on-dark); text-decoration: none;
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 17px;
    padding: 18px 30px; border-radius: 14px; transition: transform .15s;
  }
  .cta-btn:hover { transform: translateY(-2px); }
  .cta-btn svg { width: 19px; height: 19px; }

  /* contact */
  .contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; }
  @media (max-width: 820px) { .contact-grid { grid-template-columns: 1fr; } }
  .big-tel { font-family: 'Bricolage Grotesque', sans-serif; font-size: clamp(30px, 4.4vw, 44px); color: var(--ink); text-decoration: none; display: inline-block; margin: 8px 0 4px; letter-spacing: 0.02em; }
  .big-tel:hover { color: var(--orange-deep); }
  .c-label { font-size: 11.5px; font-weight: 800; letter-spacing: 0.16em; color: var(--muted); text-transform: uppercase; }
  .c-block { margin-bottom: 30px; }
  .c-block p { color: var(--ink-2); font-size: 15px; }
  .wa-btn {
    display: inline-flex; align-items: center; gap: 11px;
    background: var(--asphalt); color: var(--on-dark); text-decoration: none;
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 15px;
    padding: 15px 26px; border-radius: 13px; margin-top: 8px; transition: background .2s;
  }
  .wa-btn:hover { background: var(--asphalt-2); }
  .wa-btn svg { width: 19px; height: 19px; }
  .hours { display: grid; grid-template-columns: auto 1fr; gap: 7px 24px; font-size: 15px; }
  .hours dt { font-weight: 800; }
  .hours dd { color: var(--ink-2); }

  /* footer */
  footer { background: #0E1013; color: var(--muted); padding: 54px 0 34px; font-size: 13.5px; }
  .f-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 0.9fr; gap: 40px; padding-bottom: 34px; border-bottom: 1px solid var(--line); }
  @media (max-width: 980px) { .f-grid { grid-template-columns: 1fr 1fr; } }
  @media (max-width: 560px) { .f-grid { grid-template-columns: 1fr; } }
  .f-grid h4 { font-family: 'Bricolage Grotesque'; color: var(--on-dark); font-size: 13px; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 14px; }
  .f-grid a { display: block; color: var(--muted); text-decoration: none; padding: 4px 0; }
  .f-grid a:hover { color: var(--on-dark-2); }
  .f-bottom { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-top: 22px; }

  /* ================= alt sayfalar ================= */
  .crumbs { font-size: 13px; color: var(--on-dark-2); margin-bottom: 22px; }
  .crumbs a { color: var(--on-dark-2); text-decoration: none; border-bottom: 1px solid transparent; }
  .crumbs a:hover { color: var(--orange-hot); border-bottom-color: var(--orange-hot); }
  .crumbs span { color: var(--muted); margin: 0 8px; }
  .crumbs b { color: var(--on-dark); font-weight: 700; }

  .page-hero { background: var(--asphalt); color: var(--on-dark); padding: 38px 0 64px; }
  .page-hero h1 {
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800;
    font-size: clamp(32px, 5.2vw, 56px); line-height: 1.06; letter-spacing: -0.02em;
    margin-top: 16px; text-wrap: balance;
  }
  .page-hero h1 em { font-style: normal; color: var(--orange-hot); }
  .page-hero .lede { color: var(--on-dark-2); font-size: clamp(16px, 1.9vw, 19px); margin-top: 20px; max-width: 66ch; }
  .page-hero .hero-ctas { margin-top: 30px; display: flex; gap: 14px; flex-wrap: wrap; }
  .page-hero .btn-ghost { border-color: rgba(245,243,238,0.35); color: var(--on-dark); }

  .prose { padding: 74px 0 10px; }
  .prose .col { max-width: 74ch; }
  .prose h2 {
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800;
    font-size: clamp(24px, 3.2vw, 33px); line-height: 1.16; margin: 52px 0 16px; letter-spacing: -0.015em;
  }
  .prose h2:first-child { margin-top: 0; }
  .prose h3 { font-size: 19px; font-weight: 800; margin: 30px 0 8px; }
  .prose p { color: var(--ink-2); margin-bottom: 15px; }
  .prose a {
    color: var(--orange-deep); font-weight: 600; text-decoration: underline;
    text-underline-offset: 3px; text-decoration-thickness: 1.5px;
    text-decoration-color: rgba(194,78,18,0.4); transition: color .15s, text-decoration-color .15s;
  }
  .prose a:hover { color: var(--orange); text-decoration-color: currentColor; }
  .prose strong { color: var(--ink); font-weight: 700; }
  .prose ul { list-style: none; margin: 6px 0 18px; }
  .prose ul li { position: relative; padding-left: 26px; color: var(--ink-2); margin-bottom: 9px; }
  .prose ul li::before {
    content: ""; position: absolute; left: 4px; top: 11px;
    width: 7px; height: 7px; border-radius: 50%; background: var(--orange);
  }
  .prose ul li b { color: var(--ink); }

  .keybox {
    background: var(--paper-2); border-left: 3px solid var(--orange);
    border-radius: 0 var(--r) var(--r) 0; padding: 22px 24px; margin: 26px 0 30px;
  }
  .keybox h3 { margin-top: 0; }
  .keybox p:last-child, .keybox ul:last-child { margin-bottom: 0; }

  .spec { width: 100%; border-collapse: collapse; margin: 8px 0 24px; font-size: 15px; }
  .spec th, .spec td { text-align: left; padding: 12px 14px; border-bottom: 1px solid #DEDAD1; }
  .spec th { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
  .spec td b { color: var(--ink); }
  .spec-wrap { overflow-x: auto; }

  /* footer kurumsal bilgi seridi */
  .f-trust {
    color: var(--muted); font-size: 13px; line-height: 1.9; padding: 20px 0 4px;
    border-bottom: 1px solid var(--line);
  }
  .f-trust b { color: var(--on-dark-2); font-weight: 700; }
  .f-trust .sep { opacity: 0.5; margin: 0 4px; }

  /* iletisim sayfasi kartlari */
  .nap { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; margin: 4px 0 30px; }
  .nap > div {
    background: #fff; border: 1px solid #E3DFD6; border-radius: var(--r); padding: 20px 22px;
  }
  .nap .k {
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 11.5px;
    letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted);
  }
  .nap .v { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 19px; margin-top: 6px; color: var(--ink); }
  .nap .v a { color: var(--ink); text-decoration: none; }
  .nap .v a:hover { color: var(--orange-deep); }
  .nap p { font-size: 14px; margin-top: 6px; color: var(--ink-2); }

  /* 404 */
  .nf { padding: 90px 0 100px; text-align: center; }
  .nf .code { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: clamp(70px, 14vw, 150px); color: var(--orange); line-height: 1; }
  .nf h1 { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: clamp(26px, 4vw, 40px); margin-top: 10px; }
  .nf p { color: var(--ink-2); margin: 14px auto 30px; max-width: 52ch; }
  .nf .lg { text-align: left; margin-top: 34px; }

  /* ilgili sayfa kartlari */
  .linkgrid { padding: 20px 0 84px; }
  .linkgrid h2 { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: clamp(22px, 2.8vw, 28px); margin-bottom: 24px; }
  .lg { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 16px; }
  .lg a {
    display: block; text-decoration: none; background: #fff; border: 1px solid #E3DFD6;
    border-radius: var(--r); padding: 22px 22px 20px; transition: border-color .2s, transform .2s, box-shadow .2s;
  }
  .lg a:hover { border-color: var(--orange); transform: translateY(-3px); box-shadow: 0 14px 30px -14px rgba(20,22,27,0.25); }
  .lg .t { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 17px; color: var(--ink); display: flex; align-items: center; gap: 8px; }
  .lg .t::after { content: "→"; color: var(--orange); font-size: 15px; }
  .lg .d { color: var(--ink-2); font-size: 14.5px; margin-top: 7px; }

  /* anasayfadaki kartlar artik link */
  a.card, a.dist-card { text-decoration: none; display: block; color: inherit; }
  a.card::after {
    content: "Detaylar →"; display: block; margin-top: 14px;
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 13.5px; color: var(--orange-deep);
  }
  a.dist-card::after {
    content: "Detaylı bilgi →"; display: block; margin-top: 14px;
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 13px; color: var(--orange-hot);
  }