/* AKSA halka açık site: antrasit/siyah + beyaz + ölçülü kırmızı. Tek dosya; harici yazı tipi/kütüphane/görsel yok (dekor CSS/SVG). */
:root {
  --ink: #0e0f11; --black: #000; --coal: #181a1e; --coal-2: #20232a; --line-d: #30343b;
  --white: #fff; --paper: #efede8; --line-l: #d6d3cc;
  --red: #c8231f; --red-dark: #a51b18; --red-text: #ff6b66;
  --wa: #0b7a41; --wa-dark: #095f33;
  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  /* aralık ölçeği */
  --s1: 8px; --s2: 16px; --s3: 24px; --s4: 32px; --s5: 48px; --s6: 72px; --s7: 112px;
  --radius: 16px; --head-h: 68px;
}
* { box-sizing: border-box; }
html { font-size: 16px; -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--head-h) + 12px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
body.site { margin: 0; font-family: var(--font); background: var(--ink); color: #f2f3f5; line-height: 1.6; overflow-wrap: break-word; overflow-x: hidden; }
body.has-bar { padding-bottom: calc(68px + env(safe-area-inset-bottom)); }
@media (min-width: 768px) { body.has-bar { padding-bottom: 0; } }
img { max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3 { line-height: 1.1; margin: 0 0 var(--s1); letter-spacing: -.025em; }
h1 { font-size: clamp(2.5rem, 7.4vw, 5.2rem); font-weight: 900; line-height: 1.02; letter-spacing: -.035em; }
h2 { font-size: clamp(1.9rem, 4.8vw, 3.1rem); font-weight: 900; }
h3 { font-size: 1.2rem; font-weight: 800; letter-spacing: -.01em; }
p { margin: 0 0 var(--s2); }
.wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.narrow { max-width: 780px; }
.narrow-l { max-width: 1200px; }
.muted { font-size: .95rem; }
.skip { position: absolute; left: 8px; top: -60px; background: #fff; color: #000; padding: .6rem 1rem; z-index: 200; border-radius: 8px; }
.skip:focus { top: 8px; }
.hp, .hidden { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
:focus-visible { outline: 3px solid var(--focus, #fff); outline-offset: 3px; border-radius: 6px; }

/* bantlar: her biri kendi renk takımını taşır */
.band-dark  { --bg: var(--ink);   --fg: #f3f4f6; --mut: #adb4be; --card: var(--coal);   --bd: var(--line-d); --focus: #fff; --acc: var(--red-text); --field: #0e0f11; --fbd: #6b7380; }
.band-black { --bg: var(--black); --fg: #f3f4f6; --mut: #adb4be; --card: #111316;       --bd: #2b2f35;      --focus: #fff; --acc: var(--red-text); --field: #000; --fbd: #6b7380; }
.band-coal  { --bg: var(--coal);  --fg: #f3f4f6; --mut: #b4bbc5; --card: var(--coal-2); --bd: #353a42;      --focus: #fff; --acc: var(--red-text); --field: #14161a; --fbd: #707886; }
.band-light { --bg: var(--white); --fg: #121417; --mut: #4a515b; --card: #f6f5f2;       --bd: var(--line-l); --focus: #121417; --acc: var(--red); --field: #fff; --fbd: #858c96; }
.band-paper { --bg: var(--paper); --fg: #121417; --mut: #4a515b; --card: #fff;          --bd: var(--line-l); --focus: #121417; --acc: var(--red); --field: #faf9f7; --fbd: #858c96; }
.band-dark, .band-black, .band-coal, .band-light, .band-paper { background: var(--bg); color: var(--fg); }
.sec { padding: clamp(var(--s6), 10vw, var(--s7)) 0; position: relative; }
.eyebrow { text-transform: uppercase; letter-spacing: .16em; font-size: .78rem; font-weight: 800; color: var(--acc, var(--red-text)); margin-bottom: .5rem; }
.lead { font-size: clamp(1.05rem, 2.4vw, 1.28rem); color: var(--mut, #adb4be); max-width: 60ch; }
.muted { color: var(--mut); }

/* bölüm başlığı: editoryal numara + ince çizgi */
.sec-head { display: flex; gap: var(--s3); align-items: center; margin-bottom: var(--s5); padding-bottom: var(--s3); border-bottom: 1px solid var(--bd); }
.sec-no { font-size: clamp(3.4rem, 9vw, 6rem); font-weight: 900; line-height: .8; letter-spacing: -.05em; color: transparent; -webkit-text-stroke: 1.5px var(--acc); flex: none; }
.sec-head h2 { margin: 0; }
.sec-lead { margin: var(--s2) 0 0; color: var(--mut); max-width: 56ch; }
.split { display: grid; gap: var(--s5); }
.split-head .sec-head { margin-bottom: var(--s3); }
@media (min-width: 960px) {
  .split { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: var(--s6); align-items: start; }
  .split-head { position: sticky; top: calc(var(--head-h) + 24px); }
  .split-head .sec-head { flex-direction: column; align-items: flex-start; gap: var(--s2); border-bottom: 0; padding-bottom: 0; }
}

/* düğmeler */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; min-height: 48px; padding: .6rem 1.3rem; border-radius: 12px; border: 2px solid transparent;
  font: inherit; font-weight: 800; text-decoration: none; cursor: pointer; color: #fff; background: transparent; line-height: 1.2; transition: background .15s, transform .15s, border-color .15s; }
.btn .ic { flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.btn-lg { min-height: 54px; padding: .7rem 1.5rem; font-size: 1.02rem; }
.btn-xl { min-height: 60px; padding: .8rem 1.7rem; font-size: 1.08rem; }
.btn-block { width: 100%; }
.btn-primary { background: var(--red); border-color: var(--red); color: #fff; box-shadow: 0 8px 24px -8px rgba(200, 35, 31, .7); }
.btn-primary:hover { background: var(--red-dark); border-color: var(--red-dark); transform: translateY(-2px); }
.btn-wa { background: var(--wa); border-color: var(--wa); color: #fff; }
.btn-wa:hover { background: var(--wa-dark); border-color: var(--wa-dark); transform: translateY(-2px); }
.btn-ghost { border-color: currentColor; color: inherit; }
.btn-ghost:hover { background: rgba(127, 127, 127, .16); }
.btn-dark { background: #121417; border-color: #121417; color: #fff; }
.btn-dark:hover { background: #000; }
.btn[disabled] { opacity: .55; cursor: not-allowed; transform: none; }
.cta-row { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: var(--s3); }
.stack { display: grid; gap: .7rem; }
.badge { display: inline-block; border: 1px solid var(--acc); color: var(--acc); border-radius: 999px; padding: .2rem .8rem; font-size: .72rem; font-weight: 800; letter-spacing: .14em; margin-bottom: var(--s2); }

/* üst bar */
.preview-banner { background: #5a3b00; color: #ffe2a8; padding: .5rem 1rem; text-align: center; font-weight: 600; font-size: .9rem; }
.site-head { position: sticky; top: 0; z-index: 60; background: rgba(10, 11, 13, .96); border-bottom: 1px solid var(--line-d); }
.head-in { display: flex; align-items: center; justify-content: space-between; min-height: var(--head-h); gap: 1rem; flex-wrap: wrap; }
.logo { display: inline-flex; align-items: center; gap: .65rem; text-decoration: none; color: #fff; font-weight: 900; letter-spacing: -.01em; min-height: 44px; }
.logo-mark { display: inline-grid; place-items: center; width: 38px; height: 38px; background: var(--red); border-radius: 10px; font-weight: 900; font-size: 1.15rem; }
.nav-toggle { display: none; background: none; border: 1px solid var(--line-d); color: #fff; width: 46px; height: 46px; border-radius: 12px; cursor: pointer; place-items: center; }
.nav-toggle .ic { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.site-nav { display: flex; gap: .25rem 1.3rem; align-items: center; flex-wrap: wrap; }
.site-nav a { color: #dfe2e7; text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; font-weight: 700; font-size: .94rem; }
.site-nav a:hover { color: #fff; text-decoration: underline; text-underline-offset: 6px; text-decoration-color: var(--red); text-decoration-thickness: 2px; }
.site-nav .nav-cta { background: var(--red); color: #fff; padding: 0 1.2rem; border-radius: 12px; }
.site-nav .nav-cta:hover { background: var(--red-dark); text-decoration: none; }
@media (max-width: 960px) {
  html.js .nav-toggle { display: inline-grid; }
  html.js .site-nav { display: none; width: 100%; flex-direction: column; align-items: stretch; padding-bottom: 14px; }
  html.js .site-nav.open { display: flex; }
  html.js .site-nav a { padding: 0 .5rem; border-top: 1px solid var(--line-d); min-height: 50px; }
  html.js .site-nav .nav-cta { margin-top: .6rem; justify-content: center; }
}

/* hero */
.hero { position: relative; overflow: hidden; isolation: isolate; background: #0a0b0d; border-bottom: 1px solid var(--line-d); }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -2;
  background: radial-gradient(900px 520px at 90% -10%, rgba(200, 35, 31, .42), transparent 62%), radial-gradient(800px 500px at -5% 105%, rgba(255, 255, 255, .07), transparent 60%),
              repeating-linear-gradient(115deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 24px); }
.hero::after { content: ""; position: absolute; left: -10%; right: -10%; bottom: 96px; height: 2px; z-index: -1; background: linear-gradient(90deg, transparent, var(--red) 30%, var(--red) 70%, transparent); transform: rotate(-4deg); opacity: .55; }
.hero-art { position: absolute; z-index: -1; right: -12%; top: 50%; width: min(980px, 120vw); transform: translateY(-50%); fill: none; stroke: rgba(255, 255, 255, .09); stroke-width: 1.2; pointer-events: none; }
.hero-art .cross { stroke: rgba(255, 255, 255, .05); } .hero-art .slash { stroke: rgba(200, 35, 31, .55); stroke-width: 2; }
.hero-in { display: grid; gap: var(--s5); align-items: center; padding-top: clamp(var(--s5), 9vw, 112px); padding-bottom: clamp(var(--s5), 8vw, 96px); }
@media (min-width: 960px) { .hero-in { grid-template-columns: minmax(0, 1.35fr) minmax(0, .65fr); gap: var(--s6); } }
.kicker { display: flex; align-items: center; gap: .8rem; text-transform: uppercase; letter-spacing: .16em; font-size: .8rem; font-weight: 800; color: #e7eaee; margin-bottom: var(--s3); }
.kicker .bar { width: 44px; height: 3px; background: var(--red); border-radius: 2px; flex: none; }
.hero h1 { margin-bottom: var(--s3); }
.hl { color: var(--red-text); }
.hero .lead { color: #c3c9d2; margin-bottom: 0; }
.hero-card { position: relative; background: linear-gradient(160deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .02)); border: 1px solid rgba(255, 255, 255, .16); border-radius: var(--radius); padding: var(--s3); backdrop-filter: blur(6px); }
.hero-card::before { content: ""; position: absolute; left: 24px; top: -2px; width: 64px; height: 4px; background: var(--red); border-radius: 0 0 4px 4px; }
.hc-title { display: flex; align-items: center; gap: .6rem; text-transform: uppercase; letter-spacing: .16em; font-size: .78rem; font-weight: 800; color: #e7eaee; margin-bottom: var(--s2); }
.dot { width: 9px; height: 9px; border-radius: 50%; background: var(--red); flex: none; }
.hero-card ul { list-style: none; margin: 0 0 var(--s2); padding: 0; display: grid; gap: var(--s2); }
.hero-card li { display: flex; gap: .9rem; align-items: flex-start; }
.hero-card li .ic { fill: none; stroke: var(--red-text); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; margin-top: .2rem; }
.hero-card span { display: block; font-size: .74rem; text-transform: uppercase; letter-spacing: .12em; color: #adb4be; font-weight: 700; }
.hero-card strong { font-size: 1.02rem; font-weight: 700; color: #fff; }
.hero-card a { text-decoration: none; }
.hero-photo { margin: 0; border-radius: var(--radius); overflow: hidden; border: 1px solid rgba(255, 255, 255, .16); box-shadow: 0 30px 60px -30px #000; }
.hero-photo img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.hero-photo figcaption { padding: .7rem 1rem; font-size: .9rem; color: #dfe2e7; background: rgba(0, 0, 0, .5); }
.hero-feats { list-style: none; margin: 0 auto; padding-top: var(--s3); padding-bottom: var(--s3); border-top: 1px solid rgba(255, 255, 255, .12); display: grid; gap: var(--s2) var(--s4); }
@media (min-width: 720px) { .hero-feats { grid-template-columns: repeat(3, auto); justify-content: start; } }
.hero-feats li { display: flex; align-items: center; gap: .7rem; font-weight: 700; color: #e4e7ec; font-size: .95rem; }
.hero-feats .ic { fill: none; stroke: var(--red-text); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.hero-sm .hero-in, .hero-sm .page-hero-in { padding-top: clamp(var(--s5), 8vw, 88px); padding-bottom: clamp(var(--s5), 7vw, 80px); }
.hero-sm h1 { font-size: clamp(2.1rem, 5.6vw, 3.8rem); max-width: 20ch; }
.hero-sm .lead { max-width: 64ch; }
.crumbs { font-size: .9rem; color: #adb4be; margin-bottom: var(--s2); }
.crumbs a { color: inherit; display: inline-flex; align-items: center; min-height: 36px; }
.nf-no { font-size: clamp(5rem, 22vw, 12rem); font-weight: 900; line-height: .85; margin: 0 0 var(--s2); color: transparent; -webkit-text-stroke: 2px var(--red); letter-spacing: -.06em; }

/* hizmet kartları: 5 öğe = 1 büyük + 4 */
.cards { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s3); grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.card { position: relative; background: var(--card); border: 1px solid var(--bd); border-radius: var(--radius); overflow: hidden; transition: transform .2s, box-shadow .2s, border-color .2s; }
.card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--red); transform: scaleY(.35); transform-origin: top; transition: transform .25s; }
.card:hover, .card:focus-within { transform: translateY(-4px); border-color: var(--red); box-shadow: 0 22px 40px -24px rgba(0, 0, 0, .55); }
.card:hover::before, .card:focus-within::before { transform: scaleY(1); }
.card-link { display: flex; flex-direction: column; gap: .5rem; height: 100%; padding: var(--s4) var(--s3) var(--s3) calc(var(--s3) + 4px); text-decoration: none; color: inherit; border-radius: var(--radius); }
.svc-ic { fill: none; stroke: var(--acc); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; width: 52px; height: 52px; margin-bottom: var(--s1); }
.card .num { position: absolute; right: var(--s3); top: var(--s2); font-weight: 900; font-size: 2.4rem; letter-spacing: -.04em; color: transparent; -webkit-text-stroke: 1px var(--bd); }
.card h3 { margin: 0; font-size: 1.3rem; }
.card p { margin: 0; color: var(--mut); }
.card .more { margin-top: auto; padding-top: var(--s2); font-weight: 800; display: inline-flex; align-items: center; gap: .4rem; color: var(--fg); min-height: 44px; }
.card .more svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s; }
.card:hover .more svg { transform: translateX(5px); }
.card-lead { background: linear-gradient(150deg, #101114 0%, #2b1211 100%); color: #fff; border-color: #3a1a19; --mut: #d0d5dc; --acc: var(--red-text); --fg: #fff; --bd: #4a2423; }
.card-lead h3 { font-size: clamp(1.6rem, 3.6vw, 2.3rem); letter-spacing: -.03em; }
.card-lead .svc-ic { width: 76px; height: 76px; }
.card-lead p { font-size: 1.08rem; max-width: 36ch; }
@media (min-width: 600px) and (max-width: 899px) { .cards.n5 { grid-template-columns: repeat(2, 1fr); } .cards.n5 .card-lead { grid-column: 1 / -1; } }
@media (min-width: 900px) {
  .cards.n5 { grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(3, auto); }
  .cards.n5 .card-lead { grid-row: 1 / span 2; }
}
.chips { display: flex; flex-wrap: wrap; gap: .6rem; margin: var(--s4) 0 0; }
.chip { border: 1px solid var(--fg); border-radius: 999px; padding: .5rem 1.1rem; text-decoration: none; font-weight: 700; min-height: 44px; display: inline-flex; align-items: center; }
.chip:hover { background: var(--fg); color: var(--bg); }

/* galeri + boş durum + lightbox */
.g-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s2); grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.g-item { margin: 0; }
.g-link { position: relative; display: block; border-radius: var(--radius); overflow: hidden; aspect-ratio: 4 / 3; background: var(--card); border: 1px solid var(--bd); }
.g-link img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.g-link:hover img { transform: scale(1.05); }
.g-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 2rem 1rem .8rem; background: linear-gradient(transparent, rgba(0, 0, 0, .88)); color: #fff; font-size: .92rem; font-weight: 700; }
.g-soon { display: grid; gap: var(--s3); align-items: center; padding: var(--s5) var(--s4); border: 1.5px dashed #4a4f58; border-radius: var(--radius);
  background: radial-gradient(500px 240px at 0% 0%, rgba(200, 35, 31, .16), transparent 70%), #0c0d0f; }
@media (min-width: 760px) { .g-soon { grid-template-columns: auto 1fr; gap: var(--s5); } }
.g-soon-ic { width: 96px; height: 96px; border-radius: 50%; border: 2px solid var(--line-d); display: grid; place-items: center; color: var(--red-text); }
.g-soon-ic .ic { width: 42px; height: 42px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.g-soon h3 { font-size: clamp(1.4rem, 3.4vw, 2rem); letter-spacing: -.02em; }
.g-soon p { color: var(--mut); max-width: 60ch; }
.lightbox { border: 0; padding: 0; width: 100vw; height: 100vh; max-width: 100vw; max-height: 100vh; background: rgba(5, 6, 7, .96); color: #fff; }
.lightbox::backdrop { background: rgba(0, 0, 0, .85); }
.lightbox[open] { display: flex; flex-direction: column; }
.lb-bar { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; }
.lb-stage { flex: 1; min-height: 0; display: grid; grid-template-columns: 52px 1fr 52px; align-items: center; gap: 4px; padding: 0 4px 12px; }
.lb-stage figure { margin: 0; min-height: 0; display: grid; justify-items: center; gap: .6rem; }
.lb-img { max-width: 100%; max-height: calc(100vh - 150px); object-fit: contain; border-radius: 8px; }
.lb-cap { text-align: center; max-width: 70ch; color: #dfe2e7; }
.lb-btn { background: rgba(255, 255, 255, .12); color: #fff; border: 1px solid rgba(255, 255, 255, .3); width: 48px; height: 48px; border-radius: 50%; display: inline-grid; place-items: center; cursor: pointer; }
.lb-btn .ic { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.lb-btn:hover { background: rgba(255, 255, 255, .25); }
.lightbox :focus-visible { outline-color: #fff; }
@media (max-width: 600px) { .lb-stage { grid-template-columns: 44px 1fr 44px; } .lb-btn { width: 44px; height: 44px; } }

/* neden AKSA: numaralı satırlar */
.why { list-style: none; margin: 0; padding: 0; counter-reset: w; }
.why li { display: grid; grid-template-columns: auto 1fr; gap: var(--s3); padding: var(--s3) 0; border-top: 1px solid var(--bd); }
.why li:last-child { border-bottom: 1px solid var(--bd); }
.w-no { font-size: clamp(2rem, 5vw, 3rem); font-weight: 900; line-height: 1; letter-spacing: -.04em; color: var(--acc); min-width: 2.2ch; }
.why h3 { margin-bottom: .3rem; font-size: 1.3rem; }
.why p { margin: 0; color: var(--mut); max-width: 56ch; }

/* süreç: büyük numaralı zaman çizgisi */
.steps { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s4); position: relative; }
.steps li { position: relative; padding-left: 92px; min-height: 80px; }
.steps li::before { content: ""; position: absolute; left: 33px; top: 72px; bottom: -32px; width: 2px; background: var(--bd); }
.steps li:last-child::before { display: none; }
.step-n { position: absolute; left: 0; top: 0; width: 68px; height: 68px; border-radius: 50%; background: var(--red); color: #fff; display: grid; place-items: center; font-size: 1.9rem; font-weight: 900; box-shadow: 0 0 0 6px var(--bg), 0 0 0 8px var(--bd); }
.steps h3 { font-size: 1.3rem; margin-bottom: .35rem; padding-top: .3rem; }
.steps p { margin: 0; color: var(--mut); max-width: 44ch; }
@media (min-width: 900px) {
  .steps { grid-template-columns: repeat(4, 1fr); gap: var(--s3); }
  .steps li { padding: 92px 0 0; min-height: 0; }
  .steps li::before { left: 76px; right: -12px; top: 33px; bottom: auto; width: auto; height: 2px; }
}

/* SSS */
.faq details { background: var(--card); border: 1px solid var(--bd); border-radius: 14px; padding: .2rem 1.2rem; margin-bottom: .7rem; transition: border-color .15s; }
.faq details[open] { border-color: var(--red); }
.faq summary { cursor: pointer; font-weight: 800; min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; list-style: none; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-size: 1.6rem; font-weight: 500; color: var(--acc); flex: none; line-height: 1; }
.faq details[open] summary::after { content: "–"; }
.faq details p { color: var(--mut); margin: 0 0 1.1rem; }

/* form */
.req-form { background: var(--card); border: 1px solid var(--bd); border-radius: var(--radius); padding: clamp(var(--s3), 4vw, var(--s5)); margin-top: var(--s2); color: var(--fg); box-shadow: 0 30px 60px -40px rgba(0, 0, 0, .35); }
.form-grid { display: grid; gap: 0 var(--s2); grid-template-columns: 1fr; }
@media (min-width: 640px) { .form-grid { grid-template-columns: 1fr 1fr; } }
.req-form label { display: block; font-weight: 800; font-size: .92rem; margin-bottom: var(--s2); color: var(--fg); }
.req-form input:not([type="checkbox"]), .req-form select, .req-form textarea { display: block; width: 100%; margin-top: .4rem; padding: .75rem .9rem; min-height: 52px; font: inherit; font-weight: 500; color: var(--fg); background: var(--field); border: 1.5px solid var(--fbd); border-radius: 12px; }
.req-form input:focus, .req-form select:focus, .req-form textarea:focus { outline: 3px solid var(--red); outline-offset: 1px; border-color: var(--red); }
.req-form textarea { min-height: 110px; resize: vertical; }
.req-form input[type="file"] { padding: .6rem; }
.req-form input[type="file"]::file-selector-button { margin-right: .8rem; padding: .55rem 1rem; border: 0; border-radius: 8px; background: var(--fg); color: var(--bg); font: inherit; font-weight: 700; cursor: pointer; }
.req-form label.check { display: flex; gap: .8rem; align-items: flex-start; font-weight: 500; padding: .8rem .9rem; border: 1px solid var(--bd); border-radius: 12px; }
.req-form label.check input { flex: none; width: 26px; height: 26px; margin: 0; accent-color: var(--red); }
.req-form a { text-underline-offset: 3px; font-weight: 700; }
.req-form .btn { width: 100%; margin-top: var(--s1); }
@media (min-width: 640px) { .req-form .btn { width: auto; min-width: 260px; } }
#req-msg { font-weight: 800; margin: var(--s2) 0 0; min-height: 1.5em; }
#req-msg.ok { color: #0b7a41; } #req-msg.bad { color: #b3261e; }
.alert { background: #fff3d6; color: #5a3b00; border: 1px solid #d9b05a; border-radius: 12px; padding: .8rem 1rem; }

/* iletişim */
.contact { margin: 0; display: grid; gap: var(--s3) var(--s5); grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.contact dt { font-size: .78rem; text-transform: uppercase; letter-spacing: .14em; color: var(--mut); font-weight: 800; }
.contact dd { margin: .3rem 0 0; font-size: clamp(1.1rem, 2.4vw, 1.4rem); font-weight: 800; letter-spacing: -.01em; }
.contact a { text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; }

/* alt bilgi */
.site-foot { background: #000; color: #b9bfc8; padding: var(--s6) 0 var(--s3); border-top: 3px solid var(--red); }
.foot-grid { display: grid; gap: var(--s4); grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.foot-h { color: #fff; font-weight: 900; margin-bottom: .6rem; }
.foot-links { list-style: none; margin: 0; padding: 0; }
.foot-links a, .site-foot a { color: #e4e7ec; text-underline-offset: 3px; display: inline-flex; align-items: center; min-height: 44px; }
.foot-note { margin-top: var(--s4); border-top: 1px solid var(--line-d); padding-top: var(--s2); font-size: .88rem; }

/* hizmet detay / metin sayfaları */
.article-grid { display: grid; gap: var(--s5); }
@media (min-width: 960px) { .article-grid { grid-template-columns: minmax(0, 1fr) 340px; gap: var(--s6); align-items: start; } .side-card { position: sticky; top: calc(var(--head-h) + 24px); } }
.side-card { background: #121417; color: #f3f4f6; border-radius: var(--radius); padding: var(--s3); border-top: 4px solid var(--red); }
.side-card p { color: #c3c9d2; }
.prose { font-size: 1.06rem; }
.prose h2 { font-size: clamp(1.5rem, 3.4vw, 2rem); margin-top: var(--s5); padding-left: var(--s2); border-left: 5px solid var(--red); }
.prose > h2:first-child { margin-top: 0; }
.prose p, .prose li { max-width: 68ch; }
.prose ul { padding-left: 1.3rem; } .prose li { margin-bottom: .5rem; }
.prose ol { list-style: none; counter-reset: p; padding: 0; display: grid; gap: .7rem; }
.prose ol li { counter-increment: p; position: relative; background: var(--card); border: 1px solid var(--bd); border-radius: 14px; padding: 1rem 1rem 1rem 4rem; margin: 0; max-width: none; }
.prose ol li::before { content: counter(p); position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); width: 2.2rem; height: 2.2rem; border-radius: 50%; background: var(--red); color: #fff; display: grid; place-items: center; font-weight: 900; }
.photos { display: grid; gap: var(--s2); grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.photos figure { margin: 0; } .photos img { width: 100%; height: auto; max-height: 280px; object-fit: cover; border-radius: 12px; }
.photos figcaption { font-size: .85rem; color: var(--mut); margin-top: .3rem; }

/* mobil sabit eylem çubuğu */
.actionbar { display: none; }
@media (max-width: 767px) {
  .actionbar { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; background: #0b0c0e; border-top: 1px solid var(--line-d);
    padding-bottom: env(safe-area-inset-bottom); }
  .actionbar a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 62px; padding: 6px 2px; color: #fff; text-decoration: none; font-size: .78rem; font-weight: 800; }
  .actionbar .ic { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  .actionbar a.wa { color: #4ce08c; }
  .actionbar a.req { background: var(--red); }
  .cta-row .btn-xl { width: 100%; }
}
@media print { .site-head, .actionbar, .req-form { display: none !important; } }

/* =====================================================================================================
   ARAÇ KATMANI: oto onarım teması. Satır içi SVG araç çizimi (illüstrasyon), far huzmesi, kadran halkaları, plaka etiketi.
   Harici font/görsel yok. Çizimler gerçek iş fotoğrafı değildir ve sayfada öyle belirtilir.
   ===================================================================================================== */
:root {
  --display: "Segoe UI Black", "Arial Black", "Helvetica Neue", Arial, system-ui, sans-serif;
  --mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;
  --radius: 12px;
}
h1, h2 { font-family: var(--display); font-style: italic; font-weight: 900; letter-spacing: -.035em; line-height: 1.02; }
h1 { font-size: clamp(2rem, 6.4vw, 4.5rem); }
h2 { font-size: clamp(1.7rem, 4.6vw, 3rem); }
h3 { font-family: var(--display); font-weight: 800; }
.logo, .btn, .kicker, .hc-title, .eyebrow { font-family: var(--display); }
.hero h1 { text-shadow: 0 6px 24px rgba(0, 0, 0, .5); }
.hero-sm h1 { font-size: clamp(1.8rem, 5.2vw, 3.5rem); max-width: 18ch; }

/* plaka etiketi (genel; gerçek plaka değildir) */
.eyebrow.plate { display: inline-flex; align-items: stretch; background: var(--fg); color: var(--bg); border: 2px solid var(--fg); border-left: 14px solid var(--red);
  border-radius: 6px; font-family: var(--mono); font-size: .74rem; letter-spacing: .14em; margin-bottom: .9rem; }
.eyebrow.plate b { padding: .3rem .65rem; border-right: 1.5px solid currentColor; font-weight: 800; }
.eyebrow.plate span { padding: .3rem .75rem; font-weight: 800; }
.sec-no { font-family: var(--display); font-style: italic; }

/* düğmeler: basma efekti */
.btn { transition: transform .12s, box-shadow .12s, background .15s; }
.btn-primary, .btn-wa, .btn-dark { box-shadow: 0 4px 0 rgba(0, 0, 0, .35); }
.btn:active { transform: translateY(3px); box-shadow: 0 1px 0 rgba(0, 0, 0, .35); }
.btn-xl { min-height: 66px; font-size: 1.05rem; }

/* araç çizimi */
.car { display: block; width: 100%; height: auto; overflow: visible; fill: none; stroke: #d6dbe2; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.car .ground path { stroke: rgba(255, 255, 255, .22); } .car .ground .dash { stroke: rgba(255, 255, 255, .3); stroke-dasharray: 22 16; }
.car .speed path { stroke: rgba(255, 255, 255, .3); stroke-width: 2; }
.car .tread { stroke: rgba(255, 255, 255, .3); stroke-width: 5; }
.car .line { stroke-width: 1.6; opacity: .8; }
.car .beam { stroke: none; }
.car .tail { fill: #ff6b66; stroke: none; opacity: .85; }
.car .z { color: #ff6b66; stroke: #ff6b66; stroke-width: 2.6; opacity: .3; transition: opacity .25s, stroke-width .25s, filter .25s; }
.car .z .fill { stroke: none; }
.car .z-boya .fill { opacity: .5; } .car .z-far .fill { fill: #ff6b66; fill-opacity: .4; }
.car[data-zone~="tampon"] .z-tampon, .car[data-zone~="far"] .z-far, .car[data-zone~="kaporta"] .z-kaporta, .car[data-zone~="boya"] .z-boya, .car[data-zone~="kaynak"] .z-kaynak
  { opacity: 1; stroke-width: 4; filter: drop-shadow(0 0 5px rgba(255, 107, 102, .85)); }
.car .labels path { stroke: rgba(255, 255, 255, .5); stroke-width: 1.2; stroke-dasharray: 4 4; } .car .labels .dim { stroke-dasharray: none; }
.car .labels text { font: 700 15px var(--mono); letter-spacing: .14em; fill: #e7eaee; stroke: none; }
@media (max-width: 699px) { .car .labels { display: none; } }
.band-light .car, .band-paper .car { stroke: #1b1f24; }
.band-light .car .ground path, .band-paper .car .ground path { stroke: rgba(0, 0, 0, .25); }
.band-light .car .z, .band-paper .car .z { color: var(--red); stroke: var(--red); }
.band-light .car[data-zone~="tampon"] .z-tampon, .band-light .car[data-zone~="far"] .z-far, .band-light .car[data-zone~="kaporta"] .z-kaporta, .band-light .car[data-zone~="boya"] .z-boya, .band-light .car[data-zone~="kaynak"] .z-kaynak
  { filter: drop-shadow(0 0 4px rgba(200, 35, 31, .6)); }
.band-light .car .z-far .fill { fill: var(--red); }
.ill-cap { font: 600 .7rem var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--mut, #aab1bb); margin-top: .6rem; }
@media (prefers-reduced-motion: no-preference) {
  .car .beam { animation: beam 1.9s ease-out .25s both; }
  @keyframes beam { 0% { opacity: 0; } 16% { opacity: .75; } 24% { opacity: .05; } 38% { opacity: .9; } 50% { opacity: .2; } 100% { opacity: 1; } }
}

/* hero */
.hero-in { grid-template-columns: 1fr; }
@media (min-width: 960px) { .hero-in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.hero-aside { display: grid; gap: var(--s3); min-width: 0; }
.car-stage { margin: 0; min-width: 0; }
.hero-art .ticks { stroke: rgba(255, 255, 255, .15); stroke-width: 9; } .hero-art .needle { stroke: rgba(200, 35, 31, .65); stroke-width: 2; }
.hero::after { display: none; }
.hero-card, .side-card { padding: 0 var(--s3) var(--s3); border: 1px solid rgba(255, 255, 255, .18); border-radius: var(--radius); overflow: hidden; background: linear-gradient(165deg, #20232a, #121417); backdrop-filter: none; box-shadow: 0 24px 50px -30px #000; }
.hero-card::before { display: none; }
.hc-title { margin: 0 calc(var(--s3) * -1) var(--s2); padding: .7rem var(--s3); background: var(--red); color: #fff; letter-spacing: .18em; font-style: italic; }
.dot { background: #fff; }
.hero-card ul { gap: 0; margin-bottom: var(--s2); } .hero-card li { padding: .85rem 0; border-bottom: 1px dashed #59606b; } .hero-card li:last-child { border-bottom: 0; }
.hero-card span { font-family: var(--mono); letter-spacing: .1em; }
.side-card { border-top: 1px solid rgba(255, 255, 255, .18); }
/* gösterge şeridi: üç doğrulanabilir sinyal */
.steel { background: #08090b; border-top: 1px solid rgba(255, 255, 255, .14); position: relative; }
.steel::before { content: ""; position: absolute; left: 0; top: -1px; width: min(36%, 460px); height: 3px; background: linear-gradient(90deg, var(--red), transparent); }
.hero-feats { border-top: 0; padding: 0 20px; gap: 0; grid-template-columns: 1fr; }
.hero-feats li { position: relative; padding: 1.05rem 0; font-family: var(--display); font-style: italic; font-size: .92rem; letter-spacing: .02em; color: #fff; }
.hero-feats li + li { border-top: 1px solid rgba(255, 255, 255, .12); }
.hero-feats .ic { width: 26px; height: 26px; stroke-width: 2.3; }
@media (min-width: 768px) {
  .hero-feats { grid-template-columns: repeat(3, 1fr); }
  .hero-feats li { padding: 1.4rem 1.6rem; font-size: 1rem; } .hero-feats li:first-child { padding-left: 0; }
  .hero-feats li + li { border-top: 0; }
  .hero-feats li + li::before { content: ""; position: absolute; left: 0; top: 50%; height: 34px; width: 3px; background: var(--red); transform: translateY(-50%) skewX(-20deg); }
}
.hero-sm { border-bottom: 3px solid var(--red); }
.page-hero-in.has-aside { display: grid; gap: var(--s4); align-items: center; }
@media (min-width: 960px) { .page-hero-in.has-aside { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); } }
.hero-sm-copy, .hero-sm-aside { min-width: 0; }

/* hizmetler: parça şeması + kartlarda parça vurgusu */
.diagram { margin: 0 0 var(--s5); padding: var(--s3) var(--s3) var(--s2); border: 1.5px solid var(--bd); border-radius: var(--radius); background: linear-gradient(180deg, #fff, #ecebe6); }
.car-diagram { max-width: 880px; margin: 0 auto; }
.car-diagram .z { opacity: .35; }
.diagram .ill-cap { text-align: center; }
.svc-ic { stroke-width: 3; transition: transform .25s; }
.card:hover .svc-ic, .card:focus-within .svc-ic { transform: rotate(-6deg) scale(1.1); }
.card::after { content: ""; position: absolute; right: 0; bottom: 0; width: 56%; height: 60%; pointer-events: none; opacity: .9; }
.card[data-zone="far"]::after { background: radial-gradient(ellipse at 100% 55%, rgba(255, 196, 90, .38), transparent 62%); }
.card[data-zone="boya"]::after { background: radial-gradient(circle at 100% 100%, rgba(200, 35, 31, .3), rgba(255, 170, 60, .2) 35%, transparent 62%); }
.card[data-zone="kaporta"]::after { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 80' fill='none' stroke='%23c8231f' stroke-opacity='.35' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M0 62Q100 30 200 50'/%3E%3Cpath d='M20 78Q110 50 200 66' stroke-opacity='.2'/%3E%3C/svg%3E") right bottom / 100% auto no-repeat; }
.card[data-zone="kaynak"]::after { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 80' stroke='%23e8890c' stroke-opacity='.55' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M70 70l8-14M70 70l-6-16M70 70l18-4M70 70l4 8M70 70l-14 2'/%3E%3C/svg%3E") right bottom / 70% auto no-repeat; }
.card-lead::after { width: 70%; height: 55%; right: 0; bottom: 0; border: 0; border-radius: 0; box-shadow: none;
  background: repeating-linear-gradient(120deg, rgba(255, 255, 255, .07) 0 7px, transparent 7px 16px); -webkit-mask: linear-gradient(135deg, transparent 30%, #000 100%); mask: linear-gradient(135deg, transparent 30%, #000 100%); }
.card-lead[data-zone="tampon"]::after { background: repeating-linear-gradient(120deg, rgba(255, 255, 255, .07) 0 7px, transparent 7px 16px); }

/* galeri boş durumu: araç silüeti */
.g-soon { border: 1.5px dashed #4a4f58; background: radial-gradient(500px 240px at 0% 0%, rgba(200, 35, 31, .16), transparent 70%), #0c0d0f; }
.g-car { min-width: 0; width: min(100%, 420px); }
@media (min-width: 760px) { .g-soon { grid-template-columns: minmax(0, 420px) 1fr; } }

/* süreç: araç yolculuğu */
.road-line { display: none; }
@media (min-width: 900px) {
  .road-line { display: grid; grid-template-columns: repeat(4, 1fr); position: relative; margin: 0 0 var(--s3); padding-top: 56px; font: 700 .7rem var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--mut); }
  .road-line::before { content: ""; position: absolute; left: 0; right: 0; top: 44px; border-top: 3px dashed var(--bd); }
  .road-line span { position: relative; }
  .road-line span::before { content: ""; position: absolute; top: -18px; left: 0; width: 12px; height: 12px; border-radius: 50%; background: var(--red); }
  .mini-car { position: absolute; left: 0; top: 0; z-index: 1; fill: var(--bg); stroke: var(--fg); stroke-width: 3; stroke-linejoin: round; transition: left 2.6s ease-in-out; }
  .road-line:not(.rv) .mini-car, .road-line.in .mini-car { left: calc(100% - 100px); }
}

/* kaydırmayla belirme: JS kapalıyken ya da hareket azaltılmışsa içerik her zaman görünür */
@media (prefers-reduced-motion: no-preference) {
  .js .rv { transition: opacity .6s ease, transform .6s ease; }
  .js .rv:not(.in) { opacity: 0; transform: translateY(26px); }
  .js .card.rv { transition: opacity .6s ease, transform .25s, box-shadow .2s, border-color .2s; }
}
@media print { .js .rv:not(.in) { opacity: 1 !important; transform: none !important; } }
/* hero: araç daha büyük, servis kartı daha kompakt */
.car .labels text { font-size: 19px; }
.car-stage { margin-right: -3%; }
.hero-card li { padding: .6rem 0; }
.hero-card .btn { min-height: 44px; }
.hero-in { padding-top: clamp(var(--s4), 6vw, 72px); padding-bottom: clamp(var(--s4), 6vw, 64px); }
@media (max-width: 767px) {
  .hero .cta-row { gap: .6rem; }
  .hero .cta-row .btn-xl { width: auto; flex: 1 1 40%; min-height: 58px; padding: .7rem .8rem; }
  .hero .cta-row .btn-xl:last-child { flex-basis: 100%; }
  .hero .lead { font-size: 1rem; }
}
.side-card .hc-title, .side-card p.hc-title { color: #fff; }
.eyebrow.plate b { white-space: nowrap; }
.eyebrow.plate { max-width: 100%; }
@media (max-width: 480px) { .eyebrow.plate { font-size: .66rem; letter-spacing: .1em; } .eyebrow.plate b, .eyebrow.plate span { padding: .25rem .5rem; } }

/* fotoğraf rehberi, bilgi yazıları */
.shot-grid { display: grid; gap: var(--s4); grid-template-columns: 1fr; }
@media (min-width: 900px) { .shot-grid { grid-template-columns: 1fr 1fr; } }
.shot { position: relative; margin: 0; background: #fff; border: 1.5px solid var(--bd); border-radius: var(--radius); padding: var(--s3); min-width: 0; }
.shot-no { position: absolute; left: var(--s3); top: var(--s3); z-index: 1; width: 40px; height: 40px; display: grid; place-items: center; background: var(--red); color: #fff; border-radius: 8px; font: 900 1.3rem var(--display); font-style: italic; }
.shot .car { margin: var(--s4) 0 var(--s2); }
.car-shot .viewfinder { stroke: var(--red); stroke-width: 5; fill: none; }
.car-shot .viewfinder path:last-child { stroke-width: 3; opacity: .7; }
.shot figcaption h3 { margin-bottom: .35rem; }
.shot figcaption p { margin: 0; color: var(--mut); }
.tips { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s3); grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.tips li { display: flex; gap: var(--s2); background: var(--card); border: 1px solid var(--bd); border-radius: var(--radius); padding: var(--s3); border-left: 5px solid var(--red); }
.tip-ic { flex: none; fill: none; stroke: var(--acc); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.tips h3 { margin-bottom: .3rem; } .tips p { margin: 0; color: var(--mut); }
.note-box { background: var(--card); border: 1px dashed var(--fbd, #858c96); border-radius: 10px; padding: .9rem 1.1rem; color: var(--mut); margin-top: var(--s4); }
.more-links { list-style: none; padding: 0; margin: var(--s3) 0 0; display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; }
.more-links a { font-weight: 800; text-underline-offset: 4px; display: inline-flex; align-items: center; min-height: 44px; }
.prose ul li { max-width: 68ch; }
.car-shot { overflow: hidden; border-radius: 8px; background: linear-gradient(180deg, #fdfdfc, #eceae5); }
.shot .car { margin: var(--s5) 0 var(--s2); }
.car-shot { aspect-ratio: 4 / 3; height: auto; }

/* ===== v2: sade ve iş odaklı ana sayfa (önceki kurallar bunun altında geçersiz kılınır) ===== */
.sec { padding: clamp(48px, 8vw, 88px) 0; }
.sec-head { display: block; border: 0; padding: 0; margin: 0 0 var(--s4); }
.sec-head .eyebrow { margin: 0 0 .4rem; }
.sec-head h2 { margin: 0; font-size: clamp(1.7rem, 4vw, 2.6rem); }
.sec-lead { margin: .6rem 0 0; }
.hero2::before { background: radial-gradient(900px 480px at 85% -10%, rgba(200, 35, 31, .30), transparent 62%); }
.hero2::after { display: none; }
.hero2 h1 { font-size: clamp(2.2rem, 5.6vw, 4rem); }
.hero2 .hero-in { padding-top: clamp(32px, 6vw, 72px); padding-bottom: clamp(32px, 6vw, 72px); }
.hero-link { margin: var(--s3) 0 0; }
.hero-link a { color: #dfe2e7; font-weight: 700; text-underline-offset: 5px; }
.hero-photo video, .hero-photo img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: #000; }
.hero-photo { box-shadow: 0 30px 70px -30px rgba(0, 0, 0, .9); }
/* galeri: ilk öğe büyük, geri kalanı düzenli ızgara */
.g-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
.g-link { aspect-ratio: 4 / 3; }
.g-link video { width: 100%; height: 100%; object-fit: cover; display: block; background: #000; }
.g-play { position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 50%; background: rgba(200, 35, 31, .92); display: grid; place-items: center; box-shadow: 0 8px 24px rgba(0, 0, 0, .5); }
.g-play svg { fill: #fff; margin-left: 3px; }
@media (min-width: 900px) {
  .g-grid { grid-template-columns: repeat(4, 1fr); }
  .g-item:first-child { grid-column: span 2; grid-row: span 2; }
  .g-item:first-child .g-link { aspect-ratio: auto; height: 100%; min-height: 360px; }
}
.lb-video { max-width: 100%; max-height: calc(100vh - 150px); border-radius: 8px; background: #000; }
/* hizmetler: sade, eşit kutular */
.cards, .cards.n5 { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); grid-template-rows: none; gap: 14px; }
.cards .card-lead, .cards.n5 .card-lead { grid-row: auto; grid-column: auto; background: var(--card); color: inherit; border-color: var(--bd); --mut: #4a515b; --acc: var(--red); --fg: #121417; --bd: var(--line-l); }
.cards.n5 .card-lead h3 { font-size: 1.3rem; letter-spacing: -.01em; }
.cards.n5 .card-lead .svc-ic { width: 52px; height: 52px; }
.cards.n5 .card-lead p { font-size: 1rem; }
.card .num { display: none; }
.card-link { padding: var(--s3); }
.card::after, .card-lead::after { display: none; }
.cards .card-lead h3 { font-size: 1.3rem; letter-spacing: -.01em; }
.cards .card-lead .svc-ic { width: 52px; height: 52px; }
.cards .card-lead p { font-size: 1rem; }
@media (min-width: 900px) { .cards.n6 { grid-template-columns: repeat(3, 1fr); } }
/* önce / sonra rozeti */
.g-stage { position: absolute; left: 10px; top: 10px; padding: .25rem .7rem; border-radius: 999px; font-size: .74rem; font-weight: 900; letter-spacing: .14em; color: #fff; box-shadow: 0 4px 14px rgba(0, 0, 0, .5); }
.g-once { background: #3b4048; border: 1px solid rgba(255, 255, 255, .35); }
.g-sonra { background: var(--wa); border: 1px solid rgba(255, 255, 255, .35); }

/* ===== yazı tipi: daha doğal, italik/aşırı kalın yok ===== */
:root { --display: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
h1, h2 { font-style: normal; font-weight: 800; letter-spacing: -.02em; line-height: 1.12; }
h1 { font-size: clamp(2.1rem, 5vw, 3.6rem); }
h2 { font-size: clamp(1.6rem, 3.6vw, 2.3rem); }
h3 { font-weight: 700; letter-spacing: 0; }
.hero2 h1 { font-size: clamp(2.2rem, 5vw, 3.5rem); text-shadow: none; }
.logo, .btn { font-weight: 700; letter-spacing: 0; }
.kicker, .eyebrow { font-weight: 700; letter-spacing: .1em; }
.hero-feats li, .hc-title { font-style: normal; font-weight: 600; }
.hero-card span { font-family: var(--font); }
.g-cap { font-weight: 600; }
/* talep formu: sade */
.more-info { border: 1px dashed var(--bd); border-radius: 12px; padding: .6rem 1rem; margin: var(--s2) 0; }
.more-info summary { cursor: pointer; font-weight: 600; min-height: 44px; display: flex; align-items: center; }
/* yorumlar */
.reviews { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.reviews li { background: var(--card); border: 1px solid var(--bd); border-radius: var(--radius); padding: var(--s3); }
.reviews blockquote { margin: 0 0 var(--s2); }
.reviews blockquote p { margin: 0; font-size: 1.02rem; }
.rv-by { margin: 0; color: var(--mut); font-size: .92rem; }
.rv-stars { color: #f5b301; letter-spacing: .1em; }
.rv-more { margin: var(--s3) 0 0; }

/* ===== marka: iki katmanlı ad, başlıkta telefon, WhatsApp balonu, güvence şeridi ===== */
.logo-mark { width: 44px; height: 44px; font-size: 1.4rem; border-radius: 12px; box-shadow: 0 6px 18px -6px rgba(200, 35, 31, .8); }
.logo-text { display: flex; flex-direction: column; line-height: 1; }
.logo-text b { font-size: 1.5rem; font-weight: 800; letter-spacing: .04em; }
.logo-text small { font-size: .68rem; font-weight: 700; letter-spacing: .26em; color: #c3c9d2; margin-top: 3px; }
.site-nav .nav-tel { gap: .45rem; font-weight: 800; color: #fff; }
.site-nav .nav-tel .ic { fill: none; stroke: var(--red-text); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.fab-wa { display: none; }
@media (min-width: 768px) {
  .fab-wa { position: fixed; right: 22px; bottom: 22px; z-index: 70; display: inline-flex; align-items: center; gap: .55rem; padding: .8rem 1.2rem; border-radius: 999px;
    background: var(--wa); color: #fff; text-decoration: none; font-weight: 700; box-shadow: 0 10px 30px -8px rgba(0, 0, 0, .7); }
  .fab-wa:hover { background: var(--wa-dark); }
  .fab-wa .ic { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
}
.hl-strip { border-bottom: 1px solid var(--line-d); }
.hl-list { list-style: none; margin: 0; padding: var(--s3) 0; display: grid; gap: var(--s2) var(--s4); grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.hl-list li { display: grid; gap: .15rem; }
.hl-list strong { font-size: 1.05rem; color: #fff; }
.hl-list span { color: #b4bbc5; font-size: .92rem; }

/* ===== v3: AKSA'ya özgü görünüm. Atölyenin kendi renkleri: beyaz fayans, kırmızı raf, koyu çelik. Şablon hissi veren koyu/neon tema kalktı. ===== */
:root { --paper: #f4f1ec; --steel: #1c1e22; }
body.site { background: var(--paper); color: #17181a; }
.band-dark  { --bg: #f4f1ec; --fg: #17181a; --mut: #50565e; --card: #ffffff; --bd: #ddd5c8; --focus: #17181a; --acc: var(--red); --field: #fff; --fbd: #8b8f96; }
.band-black { --bg: #ffffff; --fg: #17181a; --mut: #50565e; --card: #f4f1ec; --bd: #ddd5c8; --focus: #17181a; --acc: var(--red); --field: #fff; --fbd: #8b8f96; }
.band-coal  { --bg: #ebe6dd; --fg: #17181a; --mut: #50565e; --card: #ffffff; --bd: #d6cdbd; --focus: #17181a; --acc: var(--red); --field: #fff; --fbd: #8b8f96; }
.site-head { background: var(--steel); }
/* hero */
.hero2, .hero2.band-dark { background: var(--paper); border-bottom: 1px solid var(--bd); }
.hero2::before { background: linear-gradient(90deg, rgba(200, 35, 31, .07), transparent 40%); }
.hero2 h1 { color: #17181a; }
.hero2 .hl { color: var(--red); }
.hero2 .lead, .hero .lead { color: #444a52; }
.hero2 .kicker { color: #17181a; }
.hero-link a { color: #17181a; }
.hero2 .btn-ghost { color: #17181a; }
.hero-photo { border-color: var(--bd); box-shadow: 0 24px 50px -28px rgba(0, 0, 0, .45); background: #fff; }
.hero-photo figcaption { background: #fff; color: #17181a; }
.hero-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; }
.hero-pair figcaption { grid-column: 1 / -1; }
.pair-item { position: relative; display: block; }
.pair-item img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; display: block; }
.hero-feats { border-top: 1px solid var(--bd); }
.hero-feats li { color: #17181a; }
.steel { background: transparent; }
.hero-feats .ic { stroke: var(--red); }
/* güvence şeridi: koyu çelik, beyaz yazı */
.hl-strip { background: var(--steel); border: 0; }
.hl-list strong { color: #fff; }
.hl-list span { color: #b9c0ca; }
/* bölüm başlıkları */
.eyebrow { color: var(--red); }
.sec-head h2 { color: #17181a; }
.sec-lead { color: #50565e; }
/* kartlar */
.card { background: #fff; border-color: var(--bd); }
.cards .card-lead { background: #fff; }
.card h3, .steps h3 { color: #17181a; }
.card p, .steps p { color: #50565e; }
.card .more { color: #17181a; }
/* galeri bandı beyaz zemin: altyazı fotoğrafın üstünde kalır */
.g-link { border-color: var(--bd); }
/* yorumlar */
.reviews li { background: #fff; }
.faq details { background: #fff; }
.faq summary { color: #17181a; }
/* form ve iletişim */
.band-paper { --bg: #ffffff; }
.contact dt { color: #50565e; }

/* ===== önce/sonra kaydırıcı ===== */
.ba { margin: 0; }
.ba-frame { position: relative; overflow: hidden; border-radius: var(--radius); background: #000; aspect-ratio: 4 / 3; border: 1px solid var(--bd); }
.ba-frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.ba-range { display: none; }
.ba figcaption { padding: .6rem .2rem 0; color: var(--mut); font-size: .92rem; }
.ba-tag { position: absolute; top: 10px; left: 10px; z-index: 3; }
.ba-tag-r { left: auto; right: 10px; }
/* JS yoksa iki görsel yan yana */
html:not(.js) .ba-frame { aspect-ratio: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: none; }
html:not(.js) .ba-frame img { position: static; aspect-ratio: 4 / 3; }
html:not(.js) .ba-before { order: -1; }
html.js .ba-before { clip-path: inset(0 calc(100% - var(--pos, 50%)) 0 0); z-index: 1; }
html.js .ba-handle { position: absolute; z-index: 2; top: 0; bottom: 0; left: var(--pos, 50%); width: 3px; margin-left: -1.5px; background: #fff; box-shadow: 0 0 0 1px rgba(0, 0, 0, .35); pointer-events: none; }
html.js .ba-handle::after { content: "↔"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 42px; height: 42px; border-radius: 50%; background: #fff; color: #17181a;
  display: grid; place-items: center; font-size: 1.2rem; font-weight: 800; box-shadow: 0 4px 14px rgba(0, 0, 0, .5); }
html.js .ba-range { display: block; position: absolute; z-index: 4; left: 0; top: 0; width: 100%; height: calc(100% - 2.1rem); margin: 0; opacity: 0; cursor: ew-resize; touch-action: pan-y; }
html.js .ba { position: relative; }
html.js .ba:focus-within .ba-handle::after { outline: 3px solid var(--red); outline-offset: 2px; }
.ba-grid { display: grid; gap: var(--s3); grid-template-columns: 1fr; margin-bottom: var(--s4); }
@media (min-width: 760px) { .ba-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .ba-grid { grid-template-columns: repeat(3, 1fr); } }
.hero-photo.ba { background: #fff; padding: 0; overflow: hidden; }
.hero-photo.ba .ba-frame { border: 0; border-radius: 0; aspect-ratio: 4 / 3; }
.hero-photo.ba figcaption { padding: .7rem 1rem; }
html.js .hero-photo.ba .ba-range { height: calc(100% - 2.6rem); }
/* hasar sihirbazı */
.wiz-q { font-weight: 700; margin: 0 0 .6rem; }
.wiz-opts { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: var(--s3); }
.wiz-btn { font: inherit; font-weight: 600; min-height: 48px; padding: .6rem 1.1rem; border-radius: 12px; border: 2px solid var(--bd); background: #fff; color: #17181a; cursor: pointer; }
.wiz-btn:hover { border-color: #17181a; }
.wiz-btn[aria-pressed="true"] { background: #17181a; color: #fff; border-color: #17181a; }
.wiz-sum { background: #fff; border: 1px solid var(--bd); border-radius: 12px; padding: .8rem 1rem; margin: 0 0 var(--s2); font-weight: 600; }
.wiz-note { color: var(--mut); max-width: 60ch; }
.wiz-reset { background: none; border: 0; color: var(--mut); text-decoration: underline; cursor: pointer; font: inherit; min-height: 44px; }
/* video vitrini */
.vid-h { margin: var(--s4) 0 var(--s2); }
.vid-strip { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; -webkit-overflow-scrolling: touch; }
.vid-card { position: relative; flex: 0 0 auto; width: min(240px, 62vw); aspect-ratio: 9 / 16; border-radius: var(--radius); overflow: hidden; background: #000; scroll-snap-align: start; border: 1px solid var(--bd); display: block; }
.vid-card video { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ===== kayan duyuru bandı ===== */
.ticker { background: var(--red); color: #fff; overflow: hidden; font-size: .88rem; font-weight: 600; border-bottom: 1px solid rgba(0, 0, 0, .25); }
.ticker-track { display: flex; width: max-content; animation: tick 60s linear infinite; }
.ticker:hover .ticker-track, .ticker:focus-within .ticker-track { animation-play-state: paused; }
.ticker-list { list-style: none; margin: 0; padding: 0; display: flex; flex: none; }
.ticker-list li { padding: .5rem 0; white-space: nowrap; }
.ticker-list li::after { content: "◆"; margin: 0 1.4rem; font-size: .6rem; opacity: .7; vertical-align: middle; }
@keyframes tick { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .ticker-track { animation: none; width: auto; overflow-x: auto; }
  .ticker-list[aria-hidden="true"] { display: none; }
}
/* hero: açık/kapalı + sosyal */
.open-now { margin: var(--s3) 0 0; display: inline-flex; align-items: center; gap: .55rem; font-weight: 700; color: #17181a; background: #fff; border: 1px solid var(--bd); border-radius: 999px; padding: .4rem 1rem; }
.open-now::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: #9aa0a8; }
.open-now.is-open::before { background: #1a9d57; box-shadow: 0 0 0 4px rgba(26, 157, 87, .25); }
.open-now.is-closed::before { background: var(--red); }
.hero-social { list-style: none; margin: var(--s2) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.hero-social a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 1rem; border-radius: 999px; border: 1px solid var(--bd); background: #fff; color: #17181a; font-weight: 600; text-decoration: none; font-size: .92rem; }
.hero-social a:hover { border-color: #17181a; }
/* galeri süzgeci */
.gal-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 var(--s3); }
.gal-chip { font: inherit; font-weight: 700; min-height: 44px; padding: 0 1.2rem; border-radius: 999px; border: 2px solid var(--bd); background: #fff; color: #17181a; cursor: pointer; }
.gal-chip[aria-pressed="true"] { background: #17181a; color: #fff; border-color: #17181a; }
html:not(.js) .gal-chips { display: none; }
.gal-unit[hidden] { display: none !important; }
.gal-more { text-align: center; margin: var(--s3) 0; }
/* yorum çağrısı */
.rv-cta { background: #fff; border: 1px solid var(--bd); border-radius: var(--radius); padding: var(--s3); margin-top: var(--s3); }
.rv-cta p { margin: 0 0 var(--s2); max-width: 62ch; }

/* ===== hakkımızda, tüm işler, sigorta ===== */
.about-facts { list-style: none; margin: var(--s3) 0 0; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.about-facts li { background: #fff; border: 1px solid var(--bd); border-radius: var(--radius); padding: var(--s2) var(--s3); display: grid; gap: .2rem; }
.about-facts span { color: var(--mut); font-size: .92rem; }
.about-who { font-size: 1.1rem; margin-bottom: var(--s2); }
.shop-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.shop-fig { margin: 0; }
.shop-fig img { width: 100%; height: auto; border-radius: var(--radius); display: block; aspect-ratio: 4 / 3; object-fit: cover; }
.shop-fig figcaption { color: var(--mut); font-size: .9rem; padding-top: .4rem; }
.about-svc { list-style: none; margin: 0 0 var(--s3); padding: 0; display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.about-svc li { background: #fff; border: 1px solid var(--bd); border-radius: var(--radius); padding: var(--s2) var(--s3); display: grid; gap: .2rem; }
.about-svc span { color: var(--mut); font-size: .92rem; }
.gal-all { text-align: center; margin: var(--s3) 0 0; }
.ins-steps { list-style: none; margin: 0 0 var(--s3); padding: 0; display: grid; gap: var(--s2); }
.ins-steps li { display: flex; gap: var(--s2); align-items: flex-start; background: #fff; border: 1px solid var(--bd); border-radius: var(--radius); padding: var(--s2) var(--s3); }
.ins-n { flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--red); color: #fff; display: grid; place-items: center; font-weight: 800; }
.ins-steps h3 { margin: 0 0 .2rem; font-size: 1.1rem; }
.ins-steps p { margin: 0; color: var(--mut); }

/* ===== alt sayfa başlık bandı: ana sayfayla aynı açık atölye teması ===== */
.hero-sm, .hero-sm.band-dark { background: var(--paper); border-bottom: 1px solid var(--bd); }
.hero-sm::before { background: linear-gradient(90deg, rgba(200, 35, 31, .07), transparent 40%); }
.hero-sm::after, .hero-sm .hero-art { display: none; }
.hero-sm h1 { color: #17181a; text-shadow: none; }
.hero-sm .lead { color: #444a52; }
.hero-sm .crumbs, .hero-sm .crumbs a { color: #50565e; }
.hero-sm .crumbs a { color: #17181a; }
.hero-sm .btn-ghost { color: #17181a; }
.hero-sm .ill-cap { color: #50565e; }

/* =====================================================================================================
   v4 — CLEAN & INDUSTRIAL MINIMALISM (ui-ux-pro-max: "Güven ve Otorite + Dönüşüm" deseni, Swiss/minimal stil)
   Antrasit + metalik gri + endüstriyel sarı. Keskin köşeler, net hiyerarşi, yüksek kontrast, harici yazı tipi yok.
   Vurgu rengini değiştirmek için yalnızca aşağıdaki --accent* satırları yeterlidir.
   ===================================================================================================== */
:root {
  --font: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif; --display: var(--font);
  --ink: #14171a; --steel-900: #1b1f24; --steel-800: #252a31; --steel-600: #47505a; --steel-300: #b8c0c9; --steel-100: #e8ebef; --paper: #f1f3f5;
  --accent: #f5b400; --accent-dark: #d99a00; --on-accent: #14171a; --accent-ink: #7a5600;
  --red: var(--accent); --red-dark: var(--accent-dark); --red-text: var(--accent);
  --radius: 6px;
}
body.site { background: var(--paper); font-family: var(--font); }
h1, h2, h3 { font-family: var(--font); }
/* açık bantlarda vurgu metni: koyu altın (4.5:1 üstü) */
.band-dark, .band-black, .band-coal, .band-light, .band-paper { --acc: var(--accent-ink); }
.band-dark { --bg: var(--paper); } .band-coal { --bg: var(--steel-100); --bd: #cfd5dc; } .band-paper { --bg: #fff; }
.eyebrow { color: var(--accent-ink); letter-spacing: .14em; }
.eyebrow::before { content: ""; display: inline-block; width: 28px; height: 3px; background: var(--accent); margin-right: .6rem; vertical-align: middle; }
/* köşeler: keskin */
.btn, .site-nav .nav-cta, .wiz-btn, .gal-chip, .open-now, .hero-social a, .rv-cta, .card, .ins-steps li, .about-facts li, .about-svc li, .reviews li,
.hl-list, .faq details, .more-info, .ba-frame, .hero-photo, .g-link, .req-form, .logo-mark, .g-stage, .vid-card, .shop-fig img, .wiz-sum { border-radius: var(--radius); }
.g-stage, .open-now, .hero-social a, .gal-chip { border-radius: 4px; }
/* düğmeler */
.btn { font-weight: 700; letter-spacing: .01em; }
.btn-primary, .site-nav .nav-cta { background: var(--accent); border-color: var(--accent); color: var(--on-accent); box-shadow: none; }
.btn-primary:hover, .site-nav .nav-cta:hover { background: var(--accent-dark); border-color: var(--accent-dark); color: var(--on-accent); transform: none; }
.btn-primary, .btn-wa, .btn-dark { box-shadow: 0 2px 0 rgba(0, 0, 0, .25); }
.btn-wa { background: #14803f; border-color: #14803f; }
.btn-ghost { border-width: 2px; }
.btn:focus-visible, a:focus-visible, button:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; box-shadow: 0 0 0 5px #14171a; }
.req-form input:focus, .req-form select:focus, .req-form textarea:focus { outline: 3px solid #14171a; outline-offset: 1px; border-color: #14171a; box-shadow: 0 0 0 5px var(--accent); }
/* üst bant, başlık, logo */
.ticker { background: var(--accent); color: var(--on-accent); border-bottom: 0; }
.ticker-list li::after { color: var(--on-accent); opacity: .55; }
.site-head { background: var(--ink); border-bottom: 1px solid #2c3239; }
.logo-mark { background: var(--accent); color: var(--on-accent); box-shadow: none; }
.logo-text small { color: var(--steel-300); }
.site-nav a:hover { text-decoration-color: var(--accent); }
.site-nav .nav-tel .ic { stroke: var(--accent); }
/* hero (ana + alt sayfa): antrasit zemin, ince metalik çizgi deseni, sarı vurgu */
.hero2, .hero2.band-dark, .hero-sm, .hero-sm.band-dark { background: var(--steel-900); color: #fff; border-bottom: 4px solid var(--accent); }
.hero2::before, .hero-sm::before { background: repeating-linear-gradient(115deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 28px), linear-gradient(90deg, rgba(255, 255, 255, .05), transparent 55%); }
.hero2::after, .hero-sm::after, .hero-art { display: none; }
.hero2 h1, .hero-sm h1 { color: #fff; text-shadow: none; letter-spacing: -.02em; }
.hero2 .hl { color: var(--accent); }
.hero2 .lead, .hero .lead, .hero-sm .lead { color: #c9d0d8; }
.hero2 .kicker, .hero-sm .kicker { color: #e8ebef; }
.kicker .bar { background: var(--accent); border-radius: 0; }
.hero-link a, .hero2 .btn-ghost, .hero-sm .btn-ghost { color: #fff; }
.hero-sm .crumbs, .hero-sm .crumbs a { color: var(--steel-300); }
.hero-sm .crumbs a { color: #fff; }
.hero-sm .ill-cap { color: var(--steel-300); }
.hero-feats { border-top: 1px solid rgba(255, 255, 255, .14); }
.hero-feats li { color: #e8ebef; }
.hero-feats .ic { stroke: var(--accent); }
.hero-feats li + li::before { background: var(--accent); }
.hero-photo { border: 1px solid #39414a; box-shadow: none; background: var(--steel-800); }
.hero-photo figcaption { background: var(--steel-800); color: #e8ebef; }
.open-now { background: var(--steel-800); color: #fff; border-color: #39414a; }
.hero-social a { background: transparent; color: #fff; border-color: #4a535d; }
.hero-social a:hover { border-color: var(--accent); }
.hero2 .hero-card, .hero2 .hero-card strong { color: #fff; }
/* güvence şeridi: sarı üst çizgi */
.hl-strip { background: var(--ink); border-top: 0; border-bottom: 1px solid #2c3239; }
.hl-list strong { color: var(--accent); }
.hl-list span { color: #c9d0d8; }
/* bölüm başlıkları ve kartlar: net çizgiler */
.sec-head h2 { letter-spacing: -.02em; }
.card::before { background: var(--accent); }
.card:hover, .card:focus-within { border-color: #14171a; transform: none; box-shadow: none; }
.svc-ic { stroke: #14171a; }
.step-n, .ins-n { background: var(--accent); color: var(--on-accent); box-shadow: none; }
.ins-steps li { border: 1px solid var(--bd); }
.g-once { background: #14171a; color: #fff; border: 1px solid rgba(255, 255, 255, .25); }
.g-sonra { background: var(--accent); color: var(--on-accent); border: 1px solid rgba(0, 0, 0, .2); }
.g-play { background: var(--accent); }
.g-play svg { fill: var(--on-accent); }
.gal-chip[aria-pressed="true"], .wiz-btn[aria-pressed="true"] { background: #14171a; color: #fff; border-color: #14171a; }
html.js .ba-handle { background: var(--accent); box-shadow: none; }
html.js .ba-handle::after { background: var(--accent); color: var(--on-accent); }
html.js .ba:focus-within .ba-handle::after { outline: 3px solid #14171a; }
.faq details[open] { border-color: #14171a; }
.prose h2 { border-left-color: var(--accent); }
.prose ol li::before, .shot-no, .hc-title { background: var(--accent); color: var(--on-accent); }
.side-card { border-top-color: var(--accent); }
/* alt bilgi */
.site-foot { background: var(--ink); border-top: 4px solid var(--accent); }
.fab-wa { border-radius: 6px; background: #14803f; }
/* mobil alt çubuk */
@media (max-width: 767px) {
  .actionbar { background: var(--ink); border-top: 1px solid #2c3239; }
  .actionbar a.req { background: var(--accent); color: var(--on-accent); }
  .actionbar a.wa { color: #5be39a; }
}
@media (prefers-reduced-motion: reduce) { .ticker-track { animation: none; } }

/* ===== v4 tipografi: sade ve teknik; başlıkta DIN tarzı (Bahnschrift, Windows), gövdede IBM Plex Sans / Segoe UI ===== */
:root {
  --font: "IBM Plex Sans", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --head: "Bahnschrift", "IBM Plex Sans", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
}
body.site { font-size: 1.0625rem; line-height: 1.65; letter-spacing: 0; -webkit-font-smoothing: antialiased; }
h1, h2, h3, .logo-text b, .btn, .nav-cta, .eyebrow, .kicker, .wiz-q, .gal-chip, .wiz-btn, .hl-list strong, .foot-h { font-family: var(--head); font-style: normal; }
h1 { font-weight: 700; font-size: clamp(2.2rem, 5.2vw, 3.7rem); line-height: 1.08; letter-spacing: -.005em; }
h2 { font-weight: 700; font-size: clamp(1.7rem, 3.6vw, 2.4rem); line-height: 1.15; letter-spacing: 0; }
h3 { font-weight: 600; font-size: 1.2rem; line-height: 1.25; letter-spacing: .005em; }
.hero2 h1 { font-size: clamp(2.3rem, 5.4vw, 3.9rem); }
.lead { font-size: clamp(1.08rem, 2.2vw, 1.25rem); line-height: 1.6; }
.eyebrow, .kicker { font-weight: 600; letter-spacing: .16em; font-size: .8rem; }
.btn { font-weight: 600; letter-spacing: .02em; font-size: 1.02rem; }
.nav-cta, .site-nav a { font-weight: 600; letter-spacing: .01em; }
.logo-text b { font-weight: 700; letter-spacing: .08em; }
.logo-text small { font-family: var(--head); letter-spacing: .24em; }
.card h3, .steps h3, .ins-steps h3 { font-weight: 600; }
.sec-lead, .card p, .steps p, .ins-steps p { line-height: 1.6; }

/* ===== IBM Plex Sans (OFL 1.1, Google Fonts v23): siteye gömülü değişken yazı tipi; harici istek yok. Türkçe karakterler latin + latin-ext dosyalarındadır. ===== */
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("/static/plex-sans-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("/static/plex-sans-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
:root { --font: "IBM Plex Sans", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif; --head: var(--font); }
h1, h2 { letter-spacing: -.01em; }
h1 { font-weight: 700; } h2 { font-weight: 700; } h3 { font-weight: 600; }
.logo-text b { letter-spacing: .1em; }

/* v5 — plastik onarım kapsamı + kurumsal düzen */
.plastic-grid{list-style:none;margin:28px 0 20px;padding:0;display:grid;gap:1px;background:var(--steel-300,#c9ced3);border:1px solid var(--steel-300,#c9ced3);grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.plastic-grid li{background:#fff;padding:22px 22px 24px;border-top:4px solid var(--accent);position:relative}
.plastic-grid h3{margin:0 0 6px;font-size:1.05rem;letter-spacing:.01em;color:var(--steel-900,#14171a)}
.plastic-grid p{margin:0;font-size:.95rem;line-height:1.5;color:var(--steel-600,#4a525a)}
#plastik .cta-row{margin-top:20px}
#hizmetler .cards .card-lead{border-top-color:var(--accent)}
.hero h1{max-width:20ch}
@media(max-width:640px){.hero h1{max-width:none}.plastic-grid{grid-template-columns:1fr}}

/* v6 — atölye fotoğrafı arka planı ve "Atölyemiz" bölümü (özgün, kurumsal) */
.hero2.has-bg{position:relative;overflow:hidden;isolation:isolate}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 8%;opacity:.4;filter:grayscale(.55) contrast(1.05);z-index:-1}
.hero2.has-bg::before{z-index:-1}
.hero2.has-bg::after{display:block;content:"";position:absolute;inset:0;width:auto;height:auto;opacity:1;background:linear-gradient(90deg,rgba(20,23,26,.97) 0%,rgba(20,23,26,.93) 42%,rgba(20,23,26,.45) 100%);z-index:-1}
.shop-home{display:grid;gap:40px;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center}
.sp-facts{margin:24px 0;display:grid;gap:0;border-top:1px solid rgba(255,255,255,.18)}
.sp-facts div{display:grid;grid-template-columns:150px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.18)}
.sp-facts dt{color:var(--accent);font-weight:700;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase}
.sp-facts dd{margin:0;color:#e8ebef}
.sp-grid{display:grid;gap:8px;grid-template-columns:repeat(2,1fr)}
.sp-fig{margin:0;position:relative;overflow:hidden;border-bottom:4px solid var(--accent);background:#1d2125}
.sp-fig img{display:block;width:100%;height:auto;object-fit:cover}
.sp-lead{grid-column:1/-1}
.sp-lead img{aspect-ratio:1400/1244;object-position:center top}
.sp-grid.n1 .sp-lead img{aspect-ratio:1400/1244}
.sp-fig figcaption{position:absolute;left:0;bottom:0;background:var(--accent);color:var(--on-accent);font-size:.8rem;font-weight:700;padding:4px 10px}
@media(max-width:860px){.shop-home{grid-template-columns:1fr}.sp-facts div{grid-template-columns:1fr;gap:2px}}
#atolye{background:var(--steel-900);color:#e8ebef;--fg:#fff;--mut:#c9d0d8;--bd:rgba(255,255,255,.18);border-top:4px solid var(--accent)}
#atolye h2,#atolye h3{color:#fff}
#atolye .sec-head p,#atolye .muted{color:#c9d0d8}
#atolye .btn-ghost{color:#fff;border-color:rgba(255,255,255,.5);background:transparent}

/* v7 — hero vitrini (dönen önce/sonra) ve Google puan rozeti */
.hero-rot{position:relative}
.hero-rot .hero-slide{display:none}
.hero-rot .hero-slide.on{display:block;animation:slideIn .5s ease}
@keyframes slideIn{from{opacity:.0}to{opacity:1}}
.rot-dots{display:flex;gap:8px;justify-content:center;margin-top:12px}
.rot-dot{width:34px;height:6px;border:0;padding:0;background:rgba(255,255,255,.28);cursor:pointer;border-radius:0}
.rot-dot.on{background:var(--accent)}
.rot-dot:focus-visible{outline:2px solid #fff;outline-offset:3px}
.g-badge{display:inline-flex;align-items:center;gap:10px;margin:14px 0 4px;padding:9px 14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);border-left:4px solid var(--accent);color:#fff;text-decoration:none;font-size:.95rem;line-height:1.3}
.g-badge .g-stars{color:var(--accent);letter-spacing:2px;font-size:1.05rem}
a.g-badge:hover{background:rgba(255,255,255,.14)}
@media (prefers-reduced-motion:reduce){.hero-rot .hero-slide.on{animation:none}}

/* v8 — destek penceresi, açık/kapalı rozeti bağlantısı, hero arka planı soldan temizlendi */
.hero-bg{-webkit-mask-image:linear-gradient(90deg,transparent 0,transparent 38%,#000 78%);mask-image:linear-gradient(90deg,transparent 0,transparent 38%,#000 78%)}
a.open-now{text-decoration:none;color:inherit}
a.open-now:hover{border-color:var(--accent)}
.desk-btn{position:fixed;left:18px;bottom:18px;z-index:70;display:inline-flex;align-items:center;gap:.5rem;padding:.65rem 1rem;background:var(--steel-900,#14171a);color:#fff;border:1px solid rgba(255,255,255,.28);border-left:4px solid var(--accent);border-radius:6px;font:600 .9rem var(--font);cursor:pointer}
.desk-btn .ic{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.desk-btn:hover{background:#242a30}
.desk-btn:focus-visible,.desk-dlg :focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.desk-dlg{width:min(440px,calc(100vw - 32px));border:0;border-top:4px solid var(--accent);padding:0;background:#fff;color:#17181a;box-shadow:0 20px 60px rgba(0,0,0,.45)}
.desk-dlg::backdrop{background:rgba(10,12,14,.6)}
.desk-form{padding:22px;display:grid;gap:12px}
.desk-form h2{margin:0;font-size:1.3rem}
.desk-form label{display:grid;gap:4px;font-weight:600;font-size:.9rem}
.desk-form input,.desk-form textarea{font:inherit;padding:.6rem .7rem;border:1px solid #8b8f96;border-radius:4px;width:100%;box-sizing:border-box}
.desk-form .check{display:flex;gap:8px;align-items:flex-start;font-weight:400}
.desk-form .check input{width:auto;margin-top:3px}
.desk-msg.ok{color:#14803f}.desk-msg.bad{color:#b3261e}
@media(max-width:860px){.desk-btn{bottom:78px;left:12px}}

/* v9 — seçilen stil: siyah + kırmızı, hap düğmeler (sahibi seçti: örnek 4) */
:root {
  --ink: #0d0e10; --steel-900: #16181b; --steel-800: #22262b;
  --accent: #e5322d; --accent-dark: #c42823; --on-accent: #fff; --accent-ink: #b3231f;
  --red: var(--accent); --red-dark: var(--accent-dark); --red-text: #ff6b66;
  --radius: 8px;
}
.btn, .btn-primary, .site-nav .nav-cta, .gal-chip, .chip, .fab-wa, .desk-btn, .rot-dot, .g-stage { border-radius: 999px; }
.btn { padding-left: 1.5rem; padding-right: 1.5rem; }
.rot-dot { height: 6px; }
.wiz-opt, .wiz-sum { border-radius: 14px; }
.btn-wa, .fab-wa { background: #14803f; border-color: #14803f; color: #fff; }
.btn-ghost { border-radius: 999px; }
.gal-chip[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: #fff; }
.ticker { background: var(--accent); color: #fff; }
.g-sonra { color: #fff; border-color: rgba(0, 0, 0, .25); }
.desk-btn { border-left-width: 1px; border-color: rgba(255, 255, 255, .28); }
.desk-btn::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }
.eyebrow { color: var(--accent-ink); }
.sec .eyebrow, .band-dark .eyebrow, #atolye .eyebrow { color: #ff6b66; }
.band-light .eyebrow, .band-paper .eyebrow, .sec.band-light .eyebrow { color: var(--accent-ink); }
.hero .hl, .hero2 .hl, h1 .hl { color: #ff4a44; }
.hero2 h1 .hl { color: #ff4a44; }
.plastic-grid li, .sp-fig { border-color: var(--accent); }
.sp-facts dt, .g-badge .g-stars { color: #ff6b66; }

/* v10 — İşlerimiz vitrini: süzgeçsiz, büyük öne çıkan iş + düzenli ızgara */
.gal-chips { display: none; }
#isler .ba-grid { gap: 14px; }
#isler .ba-grid .ba { background: #1b1f24; border: 1px solid rgba(255, 255, 255, .12); border-radius: var(--radius); overflow: hidden; margin: 0; }
#isler .ba-grid .ba .ba-frame { border: 0; border-radius: 0; }
#isler .ba-grid .ba figcaption { padding: 10px 14px 12px; font-weight: 600; font-size: .95rem; color: #f1f3f5; border-top: 3px solid var(--accent); }
@media (min-width: 1100px) {
  #isler .ba-grid > .ba:first-child { grid-column: span 2; grid-row: span 2; display: flex; flex-direction: column; }
  #isler .ba-grid > .ba:first-child .ba-frame { aspect-ratio: auto; flex: 1; min-height: 420px; }
  #isler .ba-grid > .ba:first-child figcaption { font-size: 1.1rem; }
}
#isler { background: var(--steel-900); color: #e8ebef; --fg: #fff; --mut: #c9d0d8; --bd: rgba(255, 255, 255, .18); border-top: 4px solid var(--accent); }
#isler h2, #isler h3 { color: #fff; }
#isler .sec-lead, #isler .muted { color: #c9d0d8; }
#isler .eyebrow { color: #ff6b66; }
#isler .btn-ghost { color: #fff; border-color: rgba(255, 255, 255, .5); background: transparent; }
#isler .gal-all { margin-top: 20px; }

/* v11 — Sigorta ve kasko bölümü: adım adım rehber, karşılaştırma ve kısa SSS */
#sigorta { background: var(--steel-900); color: #e8ebef; --fg: #fff; --mut: #c9d0d8; --bd: rgba(255, 255, 255, .18); border-top: 4px solid var(--accent); }
#sigorta h2, #sigorta h3 { color: #fff; }
#sigorta .sec-lead, #sigorta .muted, #sigorta p { color: #c9d0d8; }
#sigorta .eyebrow { color: #ff6b66; }
#sigorta a { color: #fff; text-decoration-color: var(--accent); }
.ins-grid { display: grid; gap: 28px; grid-template-columns: 1fr; margin: 26px 0 18px; align-items: start; }
@media (min-width: 960px) { .ins-grid { grid-template-columns: 1fr 1fr; gap: 44px; } }
.ins-h { margin: 0 0 12px; font-size: 1.05rem; letter-spacing: .02em; }
.ins-cmp { display: grid; gap: 12px; grid-template-columns: 1fr; margin-bottom: 18px; }
@media (min-width: 560px) { .ins-cmp { grid-template-columns: 1fr 1fr; } }
.ins-col { background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .16); border-top: 4px solid var(--accent); padding: 16px 16px 18px; border-radius: var(--radius); }
.ins-col h3 { margin: 0 0 6px; font-size: 1.05rem; }
.ins-col p { margin: 0; font-size: .95rem; line-height: 1.5; }
.ins-faq details { border-top: 1px solid rgba(255, 255, 255, .18); padding: 12px 0; }
.ins-faq details:last-child { border-bottom: 1px solid rgba(255, 255, 255, .18); }
.ins-faq summary { cursor: pointer; font-weight: 600; color: #fff; }
.ins-faq p { margin: 8px 0 0; font-size: .95rem; line-height: 1.5; }
#sigorta .ins-steps li { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .16); }
.ins-src { font-size: .85rem; margin-top: 14px; }

/* v12 — önce/sonra kaydırıcıda video */
.ba-frame video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
html:not(.js) .ba-frame video { position: static; aspect-ratio: 9 / 16; }
.ba-video { background: #000; }
.ba-vert .ba-frame, .hero-photo.ba.ba-vert .ba-frame { aspect-ratio: 1 / 1; }

/* v13 — sigorta sayfası: kanıt fotoğrafı ve akış */
.ins-proof { display: grid; gap: 28px; align-items: center; grid-template-columns: 1fr; }
@media (min-width: 900px) { .ins-proof { grid-template-columns: 1fr 1fr; } }
.ins-fig { margin: 0; position: relative; border-radius: var(--radius); overflow: hidden; border-bottom: 4px solid var(--accent); }
.ins-fig img { display: block; width: 100%; height: auto; }
.ins-fig figcaption { position: absolute; left: 0; bottom: 0; background: var(--accent); color: #fff; font-weight: 700; font-size: .85rem; padding: 4px 12px; }
.ins-flow { margin: 12px 0; padding-left: 1.2rem; display: grid; gap: 8px; }

/* v14 — Atölyemiz: tek tip oranlı, temiz fotoğraf düzeni */
.sp-fig:not(.sp-lead) img { aspect-ratio: 3 / 2; object-fit: cover; }
.sp-lead img { aspect-ratio: auto; object-position: center; }
.sp-grid.n3 .sp-fig:not(.sp-lead) { }

/* v15 — tıklayınca yüklenen Google Haritalar kartı */
.map-box { margin-top: 22px; display: grid; gap: 8px; justify-items: start; }
.map-frame { width: 100%; height: 360px; border: 0; border-radius: var(--radius); background: #e8ebef; }

/* v16 — resmî logo (koyu zemin için şeffaf PNG) */
.logo-img { display: block; height: 46px; width: auto; }
.foot-logo { display: block; height: 70px; width: auto; margin-bottom: 14px; }
@media (max-width: 640px) { .logo-img { height: 38px; } }

/* v17 — mobilde Destek düğmesi yalnızca simge (içeriği kapatmasın) */
@media (max-width: 860px) {
  .desk-btn { left: auto; right: 12px; bottom: 78px; width: 46px; height: 46px; padding: 0; justify-content: center; border-radius: 50%; border-left-width: 1px; }
  .desk-btn span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .desk-btn::before { display: none; }
}

/* v18: üst menü iki telefon */
.nav-tel-menu { position: relative; }
.nav-tel-menu summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; }
.nav-tel-menu summary::-webkit-details-marker { display: none; }
.nav-tel-list { position: absolute; right: 0; top: calc(100% + 8px); min-width: 190px; display: grid; gap: 2px; padding: 6px; background: #14171b; border: 1px solid rgba(255,255,255,.14); border-radius: 12px; box-shadow: 0 16px 40px rgba(0,0,0,.5); z-index: 60; }
.nav-tel-list a { display: block; padding: 10px 12px; border-radius: 8px; color: #fff; font-weight: 800; text-decoration: none; white-space: nowrap; }
.nav-tel-list a:hover, .nav-tel-list a:focus-visible { background: #e5322d; }
@media (max-width: 900px) { .nav-tel-list { position: static; margin-top: 6px; } }

/* v19: yorumlarda "Daha fazla" */
.rv-more { margin-top: 14px; }
.rv-more > summary { list-style: none; cursor: pointer; display: inline-flex; margin-bottom: 14px; }
.rv-more > summary::-webkit-details-marker { display: none; }
.rv-more[open] > summary { display: none; }

.preview-banner .pv-admin { color: inherit; font-weight: 800; text-decoration: underline; margin-left: 12px; white-space: nowrap; }

/* v20: kontrast (açık bantlarda eyebrow, yorum yıldızları) */
#yorumlar .eyebrow, #sss .eyebrow { color: var(--accent-ink); }
.rv-stars { color: #a06b00; }