:root {
    --carbon: #000;
    --paper: #fff;
    --sky: #dceeff;
    --concrete: #cccccc;
    --mist: #e9e9e9;
    --blue: #4da2ff;
    --mint: #55db9c;
    --lavender: #e9ccff;
    --ember: #fb4903;
    --sun: #ffd731;
    --violet: #5c4ade;

    --r-panel: 30px;
    --r-card: 20px;
    --r-card-lg: 40px;
    --r-pill: 1600px;

    --display: clamp(88px, 24vw, 400px);
    --display-md: clamp(48px, 10vw, 150px);
    --heading: clamp(40px, 6.4vw, 96px);
  }
  * { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body {
    margin: 0;
    background: var(--carbon);
    color: var(--carbon);
    font-family: Inter, system-ui, sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.45;
    letter-spacing: -0.01em;
    -webkit-font-smoothing: antialiased;
  }
  img, svg { display: block; }
  /* width/height öznitelikleri yalnız oran için: CSS genişlik verince yükseklik orantılı kalsın (:where = hiçbir kuralı ezmez) */
  :where(img[width][height]) { height: auto; }
  a { color: inherit; }
  :focus-visible { outline: 3px solid var(--violet); outline-offset: 3px; }

  /* ---------- Tipografi ---------- */
  .display {
    font-weight: 900;
    font-variation-settings: "opsz" 32;
    text-transform: uppercase;
    line-height: .8;
    letter-spacing: -0.06em;
    margin: 0;
  }
  .display.italic { font-style: italic; }
  .label {
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .032em;
    text-transform: uppercase;
  }

  /* ---------- Butonlar ---------- */
  .btn {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 12px 18px;
    border: 1px solid var(--carbon);
    border-radius: var(--r-pill);
    background: var(--paper);
    color: var(--carbon);
    font-family: inherit; font-weight: 700; font-size: 13px; line-height: 1;
    letter-spacing: .032em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: transform .15s ease, background .15s ease;
    white-space: nowrap;
  }
  .btn:hover { transform: translateY(-2px); }
  .btn.solid { background: var(--carbon); color: var(--paper); }
  .btn.solid:hover { background: #222; }
  .btn .ico { width: 18px; height: 18px; }
  .icon-btn {
    width: 40px; height: 40px; padding: 0; justify-content: center;
    font-size: 22px; font-weight: 400;
  }

  /* ---------- Marquee (üst şerit) ---------- */
  .ticker {
    background: var(--lavender);
    overflow: hidden;
    border-bottom: 1px solid var(--carbon);
  }
  .ticker-track {
    display: flex; width: max-content;
    animation: slide 30s linear infinite;
  }
  .ticker span { padding: 8px 20px; white-space: nowrap; }
  @keyframes slide { to { transform: translateX(-50%); } }

  /* ---------- Nav ---------- */
  .nav {
    position: fixed; z-index: 50;
    left: 16px; right: 16px; top: 44px;
    display: flex; align-items: center; justify-content: space-between;
    pointer-events: none;
    transition: top .25s ease;
  }
  .nav > * { pointer-events: auto; }
  .nav.scrolled { top: 12px; }
  .logo {
    width: var(--logo, 44px); height: var(--logo, 44px);
    border: 1px solid var(--carbon); border-radius: 50%;
    background: var(--paper);
    display: grid; place-items: center;
    font-weight: 900; font-size: calc(var(--logo, 44px) * .45); letter-spacing: -0.06em;
    text-decoration: none;
  }
  .logo-rounded { border-radius: 24%; }
  .logo { grid-template-columns: 100%; grid-template-rows: 100%; }
  .logo img { width: 100%; height: 100%; object-fit: contain; display: block; }
  .logo-none { border: 0; background: transparent; border-radius: 0; overflow: visible; }
  .logo-none.has-img { display: flex; align-items: center; width: auto; }
  .logo-none img { width: auto; height: var(--logo, 44px); max-width: none; }
  .logo-none .logo-mask { width: var(--logo, 44px); height: var(--logo, 44px); }
  .logo-mask { display: block; width: 100%; height: 100%; -webkit-mask-size: contain; mask-size: contain; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; }
  .logo-circle.has-img img, .logo-rounded.has-img img { padding: 14%; }
  .logo-circle.has-img .logo-mask, .logo-rounded.has-img .logo-mask { width: 72%; height: 72%; }
  /* Sticker gibi: beyaz kenar + siyah kontur (sitedeki sticker'larla aynı dil) */
  .ls-sticker { overflow: visible; }
  .logo-sticker { filter: drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff) drop-shadow(1.5px 0 0 #000) drop-shadow(-1.5px 0 0 #000) drop-shadow(0 1.5px 0 #000) drop-shadow(0 -1.5px 0 #000); rotate: -4deg; transition: rotate .35s var(--bounce, ease); }
  .logo:hover .logo-sticker { rotate: 8deg; }
  .logo-circle.ls-sticker.has-img, .logo-rounded.ls-sticker.has-img { border-color: transparent; background: transparent; }
  .nav-right { display: flex; gap: 4px; align-items: center; }
  .nav-links { display: flex; gap: 4px; transition: opacity .2s ease, transform .2s ease; }
  html:not(.mo-navhide) .nav.scrolled .nav-links { opacity: 0; transform: translateY(-8px); pointer-events: none; }
  .menu {
    position: fixed; z-index: 49; top: 70px; right: 16px;
    display: none; flex-direction: column; gap: 6px;
    padding: 12px; background: var(--paper);
    border: 1px solid var(--carbon); border-radius: var(--r-card);
  }
  .menu.open { display: flex; }
  .nav.scrolled ~ .menu { top: 62px; }

  /* ---------- Paneller ---------- */
  main { display: flex; flex-direction: column; gap: 8px; padding: 8px; }
  .panel {
    position: relative;
    border-radius: var(--r-panel);
    overflow: hidden;
    background: var(--paper);
  }
  .panel.sky { background: var(--sky); }
  .inner { max-width: 1440px; margin: 0 auto; padding: 0 clamp(16px, 4vw, 48px); position: relative; }

  /* ---------- Kurdele (ribbon) ---------- */
  .ribbon { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; transform: translate3d(0, var(--py, 0px), 0) scale(1.12); }

  /* ---------- Sticker ---------- */
  .sticker { position: absolute; z-index: 3; width: clamp(56px, 9vw, 120px); height: auto; transform: translate3d(var(--dx, 0px), calc(var(--py, 0px) + var(--dy, 0px)), 0); }
  .sticker.float { animation: bob 5s ease-in-out infinite; }
  @keyframes bob { 50% { translate: 0 -8px; } }

  /* ---------- Hero ---------- */
  .hero {
    min-height: min(100svh, 980px);
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center;
    padding: 120px 16px 72px;
  }
  .hero h1, .hero h2[data-intro] { position: relative; z-index: 2; font-size: var(--display); }
  .hero .tagline {
    position: relative; z-index: 2;
    font-size: clamp(24px, 4.4vw, 64px); font-weight: 500; letter-spacing: -0.03em; line-height: 1;
    margin: 18px 0 28px;
  }
  .hero .actions { position: relative; z-index: 2; display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }

  /* ---------- Vitrin (showcase) ---------- */
  .showcase {
    min-height: min(90svh, 860px);
    display: flex; align-items: center; justify-content: center;
    gap: clamp(16px, 5vw, 72px);
    padding: 120px 16px 80px;
    flex-wrap: wrap;
  }
  .browser {
    position: relative; z-index: 2;
    width: min(560px, 92vw);
    background: #17142e; color: #fff;
    border: 1px solid var(--carbon); border-radius: var(--r-card);
    overflow: hidden;
    rotate: -3deg;
  }
  .browser-bar { display: flex; gap: 6px; align-items: center; padding: 10px 12px; background: #221d47; }
  .browser-bar i { width: 10px; height: 10px; border-radius: 50%; background: #ffffff40; }
  .browser-bar .url { margin-left: 10px; flex: 1; background: #ffffff1a; border-radius: var(--r-pill); padding: 4px 12px; font-size: 11px; color: #ffffffb0; }
  .browser-body { padding: 18px; display: grid; gap: 14px; }
  .mini-hero { background: var(--violet); border-radius: 14px; padding: 18px; }
  .mini-hero b { display: block; font-size: 22px; font-weight: 900; letter-spacing: -0.05em; line-height: .9; text-transform: uppercase; }
  .mini-hero small { opacity: .8; }
  .mini-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
  .mini-grid div { aspect-ratio: 1; border-radius: 12px; display: grid; place-items: center; }
  .photo-card {
    position: relative; z-index: 2;
    width: min(300px, 70vw);
    background: var(--paper);
    border: 1px solid var(--carbon); border-radius: var(--r-card);
    padding: 12px 12px 16px;
    rotate: 4deg;
  }
  .photo-card .shot { aspect-ratio: 4/5; border-radius: 12px; background: var(--sun); display: grid; place-items: center; overflow: hidden; }
  .photo-card p { margin: 12px 4px 0; font-size: 13px; }
  .photo-card .placeholder-note { font-size: 11px; opacity: .6; }
  .mini-hero small { font-size: 13px; }

  /* ---------- Büyük italik bildiri ---------- */
  .statement { padding: clamp(100px, 14vw, 180px) 16px; }
  .statement .lines { display: flex; flex-direction: column; align-items: center; gap: .06em; font-size: var(--display-md); }
  .statement .line { display: flex; align-items: center; gap: .18em; flex-wrap: nowrap; }
  .inline-sticker { width: .9em; height: .9em; flex: none; }
  .inline-card {
    flex: none; display: inline-flex; align-items: center; gap: .1em;
    height: .9em; padding: 0 .22em 0 .08em;
    background: var(--violet); color: var(--paper);
    border: 1px solid var(--carbon); border-radius: var(--r-card);
    font-style: normal;
    text-decoration: none;
    rotate: -2deg;
  }
  .inline-card .ic-text { font-size: .14em; font-weight: 700; letter-spacing: .032em; }
  .inline-card .sq { height: 80%; aspect-ratio: 1; background: var(--paper); border-radius: 12px; display: grid; place-items: center; }

  /* ---------- Hizmet satırları ---------- */
  .features { padding-block: clamp(80px, 10vw, 140px); display: grid; gap: clamp(64px, 9vw, 128px); }
  .feature { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 5vw, 72px); align-items: center; }
  .feature.rev .feature-media { order: 2; }
  .feature-media {
    aspect-ratio: 1; width: 100%; border: 1px solid var(--carbon); border-radius: var(--r-card);
    overflow: hidden; position: relative;
  }
  .feature-media.is-stack { aspect-ratio: auto; display: grid; gap: 14px; padding: 18px; }
  .feature-media.is-stack > img { width: 100%; height: auto; display: block; border: 1px solid var(--carbon); border-radius: 8px; background: #fff; }
  .feature h2 { font-size: var(--heading); }
  .feature p { max-width: 420px; margin: 20px 0 24px; font-size: 15px; }
  .pattern { position: absolute; inset: -10%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 6%; padding: 6%; rotate: -12deg; }
  .pattern svg { width: 100%; height: auto; }

  /* ---------- Neden biz / carousel ---------- */
  .why { padding: clamp(80px, 10vw, 140px) 0 56px; text-align: center; }
  .why h2 { font-size: clamp(28px, 4vw, 48px); font-weight: 500; letter-spacing: -0.03em; line-height: 1.1; margin: 0 auto 24px; max-width: 760px; }
  .why .actions { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-bottom: 48px; }
  .carousel {
    display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory;
    padding: 0 clamp(16px, 4vw, 48px) 8px; scrollbar-width: none;
  }
  .carousel::-webkit-scrollbar { display: none; }
  .c-card {
    flex: 0 0 clamp(260px, 30vw, 380px); aspect-ratio: 4/5;
    scroll-snap-align: center;
    border: 1px solid var(--carbon); border-radius: var(--r-card);
    position: relative; text-align: left;
    padding: 24px; display: flex; align-items: flex-end;
  }
  .c-card h3 { font-size: clamp(40px, 4.6vw, 64px); }
  .c-card .sticker { top: 20px; right: 20px; width: 84px; }
  .dots { display: flex; gap: 6px; justify-content: center; margin-top: 24px; }
  .dots i { width: 6px; height: 6px; border-radius: 50%; background: var(--concrete); transition: background .2s, width .2s; }
  .dots i.on { background: var(--carbon); width: 18px; border-radius: var(--r-pill); }

  /* ---------- Siyah etiket bandı ---------- */
  .band { padding: clamp(100px, 12vw, 170px) 0; overflow: hidden; background: var(--carbon); }
  .band-row { display: flex; gap: 12px; width: max-content; margin: 14px 0; }
  /* Üç sıra tek blok olarak birlikte eğilir (ayrı ayrı eğilince alttaki sıra kırpılıyordu) */
  .band-rows { rotate: -3deg; width: 112%; margin: 0 -6%; }
  .band-row:nth-of-type(odd) { animation: slide 36s linear infinite; }
  .band-row:nth-of-type(even) { animation: slide 36s linear infinite reverse; }
  .tagpill {
    font-size: clamp(56px, 8vw, 120px); padding: .08em .18em .04em;
    border: 3px solid var(--carbon); border-radius: .22em;
    white-space: nowrap;
  }

  /* ---------- Süreç sekmeleri ---------- */
  .process { padding: clamp(80px, 10vw, 140px) 0; }
  .process h2 { text-align: center; font-size: clamp(28px, 4vw, 48px); font-weight: 500; letter-spacing: -0.03em; margin: 0 0 20px; }
  .tabs { display: flex; justify-content: center; margin-bottom: 56px; }
  .tablist { position: relative; display: inline-flex; gap: 4px; padding: 4px; border: 1px solid var(--carbon); border-radius: var(--r-pill); }
  .tab-bg { position: absolute; z-index: 0; top: 4px; bottom: 4px; left: 0; width: var(--w, 0px); translate: var(--x, 0px) 0; border-radius: var(--r-pill); background: var(--carbon); transition: translate .5s cubic-bezier(.65, .05, 0, 1), width .5s cubic-bezier(.65, .05, 0, 1); }
  .tab { border: 0; background: transparent; padding: 10px 16px; border-radius: var(--r-pill); cursor: pointer; font-family: inherit; font-weight: 700; font-size: 12px; line-height: 1; text-transform: uppercase; }
  /* Yazı, zeminin tersi renkte çizilir: siyah hap altına girince beyaz, dışında siyah olur.
     Renk geçişi hapla aynı anda ve aynı yerde olduğu için yazı hiçbir anda kaybolmaz. */
  .tab { position: relative; z-index: 1; color: #fff; mix-blend-mode: difference; transition: none; }
  .tablist { isolation: isolate; background: var(--paper); }
  .steps { list-style: none; padding: 0; margin: 20px 0 24px; display: grid; gap: 10px; counter-reset: s; }
  .steps li { display: flex; gap: 12px; align-items: baseline; font-size: 15px; }
  .steps li::before { counter-increment: s; content: counter(s); flex: none; width: 26px; height: 26px; display: grid; place-items: center; border: 1px solid var(--carbon); border-radius: 50%; font-size: 12px; font-weight: 700; }

  /* ---------- Footer / iletişim ---------- */
  .contact { padding: clamp(80px, 10vw, 140px) 0 32px; }
  .contact h2 { font-size: var(--display-md); text-align: center; }
  .contact-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 56px 0 72px; }
  .contact-card {
    border: 1px solid var(--carbon); border-radius: var(--r-card);
    padding: 24px; min-height: 220px; text-decoration: none;
    display: flex; flex-direction: column; justify-content: space-between;
    transition: rotate .2s ease;
  }
  .contact-card:hover { rotate: -1.5deg; }
  .contact-card h3 { font-size: clamp(36px, 4vw, 56px); }
  .contact-card span { font-size: 15px; }
  .contact-card .label { font-size: 12px; }
  .foot { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; font-size: 13px; border-top: 1px solid var(--carbon); padding-top: 20px; }

  /* ---------- Responsive ---------- */
  @media (max-width: 900px) {
    .nav-links { display: none; }
    .feature, .feature.rev { grid-template-columns: 1fr; }
    .feature.rev .feature-media { order: 0; }
    .contact-grid { grid-template-columns: 1fr; }
    .contact-card { min-height: 160px; }
    .hero { min-height: auto; padding: 150px 16px 90px; }
    .hero .sticker { left: var(--mx) !important; top: var(--my) !important; }
    .statement .line { flex-wrap: wrap; justify-content: center; }
  }
  @media (min-width: 901px) { .menu { display: none !important; } }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
    html { scroll-behavior: auto; }
  }

  /* ---------- Yüklenen görseller ---------- */
  .feature-media > img, .shot > img { width: 100%; height: 100%; object-fit: cover; object-position: left; }
  .photo-card .shot { position: relative; }

  .hero .sticker { left: var(--x); top: var(--y); width: clamp(calc(var(--s) * .5px), calc(var(--s) * 1vw / 14.4), calc(var(--s) * 1px)); }
  .logo { overflow: hidden; }
  .logo img { width: 100%; height: 100%; object-fit: cover; }
  .mini-grid div { overflow: hidden; }
  .mini-grid img { width: 100%; height: 100%; object-fit: cover; }
  .c-img { position: absolute; top: 20px; left: 20px; right: 20px; height: 52%; width: calc(100% - 40px); object-fit: cover; border: 1px solid var(--carbon); border-radius: calc(var(--r-card) - 6px); }
  .contact-grid.cols-1 { grid-template-columns: 1fr; }
  .contact-grid.cols-2 { grid-template-columns: repeat(2, 1fr); }
  .ribbon .edge { stroke: var(--carbon); opacity: .22; }
  .ribbon .shine { stroke: #fff; opacity: .38; }
  body.no-anim *, body.no-anim *::before, body.no-anim *::after { animation: none !important; }
  @media (max-width: 900px) { .contact-grid.cols-2 { grid-template-columns: 1fr; } }
  html:not(.mo-navhide) .nav.keep-links.scrolled .nav-links { opacity: 1; transform: none; pointer-events: auto; }

  /* ---------- Yazı stilleri: kutu içi yerleşim ---------- */
  .feature > div:last-child { align-self: stretch; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; min-width: 0; container-type: inline-size; }
  .feature > div:last-child h2 { font-size: min(var(--heading), 12.5cqi); }
  .hero .tagline, .hero h1, .hero h2[data-intro] { max-width: 100%; }

  /* ---------- Hareketler (referans sitedeki akışa göre) ---------- */
  /* Hız eğrileri: "slush" = cubic-bezier(.65,.05,0,1); "bounce" = yerine oturmadan önce aşıp geri gelen eğri (JS'te ve burada aynı). */
  :root { --bounce: linear(0, 0.5737 7.6%, 0.8382 11.87%, 0.9463 14.19%, 1.0292 16.54%, 1.0886 18.97%, 1.1258 21.53%, 1.137 22.97%, 1.1424 24.48%, 1.1423 26.1%, 1.1366 27.86%, 1.1165 31.01%, 1.0507 38.62%, 1.0219 42.57%, 0.9995 46.99%, 0.9872 51.63%, 0.9842 58.77%, 1.0011 81.26%, 1); --slush: cubic-bezier(.65, .05, 0, 1); }

  /* Yumuşak kaydırma (Lenis) */
  html.lenis, html.lenis body { height: auto; }
  .lenis.lenis-smooth { scroll-behavior: auto !important; }
  .lenis.lenis-stopped { overflow: hidden; }

  /* Harfler ve kelimeler */
  .w { display: inline-block; white-space: nowrap; }
  .ch { display: inline-block; }
  .ln { display: block; }
  .rw { display: inline-block; white-space: nowrap; }
  .rl { display: inline-block; position: relative; }
  .rc { display: inline-block; }
  /* Başlık harfleri boşlukta ağırlıksızca süzülür: her harf kendi yönünde, hızında ve fazında */
  html.mo-idle [data-intro].ready .rl { animation: zerog var(--ld, 10s) ease-in-out infinite; animation-delay: var(--ldl, 0s); will-change: translate, rotate; }
  @keyframes zerog {
    0%, 100% { translate: 0 0; rotate: 0deg; }
    30% { translate: calc(var(--lx, .01) * 1em) calc(var(--ly, .015) * -1em); rotate: var(--lr, 1deg); }
    65% { translate: calc(var(--lx, .01) * -.8em) calc(var(--ly, .015) * .7em); rotate: calc(var(--lr, 1deg) * -.9); }
  }
  [data-intro] { translate: var(--pmx, 0px) var(--pmy, 0px); }
  .hero .sticker { margin: var(--pmy, 0px) 0 0 var(--pmx, 0px); }
  html.js.mo-intro .hero [data-intro]:not(.ready),
  html.js.mo-reveal [data-reveal]:not(.split-ready),
  html.js.mo-headings [data-heading]:not(.split-ready) { visibility: hidden; animation: unhide 0s 1.8s forwards; }
  @keyframes unhide { to { visibility: visible; } }

  /* Açılış: giriş bölümündeki her şey sırayla gelir */
  html.js.mo-intro .hero [data-sub]:not(.shown), html.js.mo-intro .hero .actions .btn:not(.shown), html.js.mo-intro .hero .ribbon:not(.shown), html.js.mo-intro .hero .hero-hook:not(.shown) { opacity: 0; }
  .u-ib { display: inline-block; }

  /* Sticker'lar */
  html.js.mo-pop [data-pop]:not(.popped) { scale: .2; opacity: 0; }
  .sticker { transform: translate3d(0, var(--py, 0%), 0); }
  .ribbon { transform: translate3d(0, var(--py, 0%), 0) scale(1.12); }
  /* Sticker'lar ve görseller "uzayda süzülür": yavaş, geniş ve her biri farklı fazda salınır.
     drift yalnızca konum ve eğimi, flavor-* yalnızca boyutu oynatır (çakışmasın diye). */
  :root { --fx: 9px; --fy: 11px; --fr: 4deg; }
  html.mo-idle .idle-on:is(.sticker, .inline-sticker), html.mo-idle .tab-st { animation: drift var(--dur, 9s) ease-in-out infinite; }
  html.mo-idle :is(.sticker, .inline-sticker).idle-on.st-camera { animation: drift var(--dur, 9s) ease-in-out infinite, flavor-camera 4.2s ease-in-out infinite; }
  html.mo-idle :is(.sticker, .inline-sticker).idle-on.st-cursor { animation: drift var(--dur, 9s) ease-in-out infinite, flavor-camera 5s ease-in-out infinite; }
  html.mo-idle :is(.sticker, .inline-sticker).idle-on.st-coin { animation: drift var(--dur, 9s) ease-in-out infinite, flavor-coin 5s ease-in-out infinite; }
  html.mo-idle :is(.sticker, .inline-sticker).idle-on.st-check { animation: drift var(--dur, 9s) ease-in-out infinite, flavor-check 4.6s ease-in-out infinite; }
  html.mo-idle :is(.sticker, .inline-sticker).idle-on.st-star { animation: drift var(--dur, 9s) ease-in-out infinite, flavor-star 6s ease-in-out infinite; }
  @keyframes drift {
    0%, 100% { translate: 0 0; rotate: var(--r, 0deg); }
    25% { translate: var(--fx, 9px) calc(var(--fy, 11px) * -1); rotate: calc(var(--r, 0deg) + var(--fr, 4deg)); }
    50% { translate: calc(var(--fx, 9px) * .35) calc(var(--fy, 11px) * -1.7); rotate: var(--r, 0deg); }
    75% { translate: calc(var(--fx, 9px) * -1) calc(var(--fy, 11px) * -.5); rotate: calc(var(--r, 0deg) - var(--fr, 4deg)); }
  }
  @keyframes flavor-camera { 0%, 100% { scale: 1; } 5% { scale: 1.14; } 10% { scale: .95; } 15% { scale: 1; } }
  @keyframes flavor-coin { 0%, 100% { scale: 1 1; } 50% { scale: .95 1.06; } }
  @keyframes flavor-check { 0%, 55%, 100% { scale: 1; } 65% { scale: 1.16; } 75% { scale: .94; } 85% { scale: 1; } }
  @keyframes flavor-star { 0%, 100% { scale: 1; } 50% { scale: 1.14; } }

  /* Büyük görseller de ağırlıksız salınır, kurdele çok yavaş nefes alır */
  html.mo-idle .browser.idle-on { --fx: 7px; --fy: 9px; --fr: .9deg; animation: drift 11s ease-in-out infinite; }
  html.mo-idle .photo-card.idle-on { --fx: -7px; --fy: 11px; --fr: -1.1deg; animation: drift 13s ease-in-out infinite; }
  html.mo-idle .ribbon { animation: ribbon-breathe 20s ease-in-out infinite; }
  @keyframes ribbon-breathe { 0%, 100% { scale: 1; rotate: 0deg; } 50% { scale: 1.035; rotate: .7deg; } }

  /* Kaydırırken farklı hızlarda kayan öğeler (yazılar hariç) */
  .inline-sticker[data-par], .browser[data-par], .photo-card[data-par], .k-st[data-par], .c-card .sticker[data-par], .feature-media > img[data-par] { transform: translate3d(0, var(--py, 0%), 0); }
  .feature-media > img[data-par] { scale: 1.12; }

  /* Menü: köşelerdeki linkler kaydırınca sırayla yukarı uçar */
  .nav-links .btn { transition: transform .15s ease, background .15s ease, translate .75s var(--bounce) calc(var(--ui, 0) * 30ms); }
  .nav-links.away .btn { translate: 0 -300%; transition-delay: 0s, 0s, calc(var(--di, 0) * 30ms); }
  .nav-links.away { pointer-events: none; }

  /* Vitrin kartları: aşağıdan büyüyerek gelir (JS ile) */
  html.js.mo-device [data-device]:not(.shown) { opacity: 0; }
  .browser { rotate: -3deg; }
  .photo-card { rotate: 4deg; }

  /* Kartlar: 3D uçarak gelir */
  [data-cards] { perspective: 1200px; }
  html.js.mo-cards [data-card]:not(.shown) { opacity: 0; }
  .c-card { transition: rotate .3s var(--slush); }
  .c-card:hover { rotate: -2.5deg; }
  .feature-media { transition: rotate .3s ease; }
  .feature-media:hover { rotate: -1deg; }
  .carousel.animating, .carousel.edge { scroll-snap-type: none; }
  .carousel.edge { scroll-behavior: auto; }
  .carousel.dragging { cursor: grabbing; scroll-snap-type: none; }
  .dots i { cursor: pointer; }

  /* Etiket bandı: kaydırdıkça iki sıra ters yöne kayar, yön değişince bant da döner */
  .band { position: relative; }
  .band-row { translate: calc(var(--bp, 0) * var(--dir, 1) * 20vw * var(--mi, 1)) 0; }
  .band-st { z-index: 5; }
  .band .sticker, .site-footer .sticker { left: var(--x); top: var(--y); width: clamp(calc(var(--s) * .5px), calc(var(--s) * 1vw / 14.4), calc(var(--s) * 1px)); }
  @media (max-width: 900px) { .band .sticker, .site-footer .sticker { left: var(--mx); top: var(--my); } }

  /* Sekmeler: tüm paneller aynı hücrede üst üste durur, geçişi JS yönetir */
  .tabpanels { display: grid; }
  .tabpanel { grid-area: 1 / 1; visibility: hidden; pointer-events: none; }
  .tabpanel.active { visibility: visible; pointer-events: auto; z-index: 2; }
  .tabpanel.leaving { visibility: visible; z-index: 1; }
  .tab-bg { pointer-events: none; }

  body.no-anim .tab-st { animation: none !important; }
  @media (prefers-reduced-motion: reduce) {
    html.js [data-pop], html.js [data-card], html.js [data-device], html.js [data-sub], html.js .hero .btn, html.js .hero .ribbon { opacity: 1 !important; scale: none !important; }
  }
  html.mo-safe [data-pop], html.mo-safe [data-card], html.mo-safe [data-device], html.mo-safe [data-sub], html.mo-safe .hero .btn, html.mo-safe .hero .ribbon { opacity: 1 !important; scale: none !important; }
  html.mo-safe [data-intro], html.mo-safe [data-reveal], html.mo-safe [data-heading] { visibility: visible !important; }

  img { max-width: none; }
  @media (max-width: 600px) { .logo { width: min(var(--logo, 44px), 64px); height: min(var(--logo, 44px), 64px); } .logo-none.has-img { width: auto; } .logo-none img, .logo-none .logo-mask { height: min(var(--logo, 44px), 64px); } .logo-none .logo-mask { width: min(var(--logo, 44px), 64px); } }

  /* ---------- Özel sayfalar ---------- */
  .page-hero { min-height: auto; padding: 190px 16px 110px; }
  .page-eyebrow { position: relative; z-index: 2; margin: 0 0 18px; padding: 6px 14px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); }
  main.no-hero > .panel:first-child { padding-top: 110px; }
  .blk .inner { padding-block: clamp(64px, 8vw, 120px); }
  .blk-in { display: flex; flex-direction: column; align-items: flex-start; }
  .blk-in.is-center { align-items: center; text-align: center; }
  .blk-in .eyebrow { margin: 0 0 16px; font-size: 12px; }
  .blk-in h2 { font-size: var(--heading); margin: 0 0 24px; }
  .blk-in p { font-size: 18px; line-height: 1.55; max-width: 62ch; margin: 0 0 1em; }
  .blk-in > .btn { margin-top: 12px; }
  .blk-in.is-center p { margin-inline: auto; }
  .blk-in h3.txt-h { font-size: clamp(22px, 2.6vw, 30px); line-height: calc(.95em + 2mm); letter-spacing: 0; font-style: italic; margin: 1.4em 0 .6em; max-width: 34ch; }
  .blk-in a.txt-link { color: inherit; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
  .blk-in a.txt-link:hover { background: var(--sun, #ffd731); }
  .nav-links .btn[aria-current="page"], .menu .btn[aria-current="page"] { background: var(--carbon); color: var(--paper); }

  /* Kart ızgarası */
  .k-grid { display: grid; grid-template-columns: repeat(var(--cols, 3), 1fr); gap: 12px; width: 100%; margin-top: 32px; text-align: left; }
  .k-card { position: relative; min-height: 280px; padding: 24px; border: 1px solid var(--carbon); border-radius: var(--r-card); display: flex; flex-direction: column; justify-content: flex-end; gap: 12px; overflow: hidden; transition: rotate .3s var(--slush, ease); }
  .k-card:hover { rotate: -1.5deg; }
  .k-card h3 { font-size: clamp(28px, 3vw, 40px); margin: 0; }
  .k-card p { margin: 0; font-size: 15px; max-width: 34ch; }
  .k-st { top: 20px; left: auto; right: 20px; width: 84px; }
  .k-img { position: absolute; inset: 0 0 auto 0; width: 100%; height: 52%; object-fit: cover; border-bottom: 1px solid var(--carbon); }

  /* Galeri */
  .g-grid { display: grid; grid-template-columns: repeat(var(--cols, 3), 1fr); gap: 12px; width: 100%; margin-top: 32px; }
  .g-item { position: relative; padding: 0; border: 1px solid var(--carbon); border-radius: var(--r-card); overflow: hidden; background: var(--mist); cursor: zoom-in; display: block; }
  .g-item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: scale .5s var(--slush, ease); }
  .g-item:hover img { scale: 1.06; }
  .g-grid[data-ratio="square"] .g-item { aspect-ratio: 1; }
  .g-grid[data-ratio="portrait"] .g-item { aspect-ratio: 4 / 5; }
  .g-grid[data-ratio="wide"] .g-item { aspect-ratio: 16 / 10; }
  .g-grid[data-ratio="natural"] { align-items: start; }
  .g-grid[data-ratio="natural"] .g-item img { height: auto; }
  .g-cap { position: absolute; left: 10px; bottom: 10px; padding: 6px 12px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); font-size: 12px; font-weight: 700; max-width: calc(100% - 20px); text-align: left; }
  .g-empty { padding: 32px; border: 2px dashed var(--carbon); border-radius: var(--r-card); width: 100%; text-align: center; margin-top: 24px; }
  .lightbox { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; background: #000d; padding: 24px; opacity: 0; transition: opacity .25s ease; }
  .lightbox.open { opacity: 1; }
  .lightbox figure { margin: 0; display: grid; gap: 12px; justify-items: center; max-width: min(1200px, 100%); }
  .lightbox img { max-width: 100%; max-height: 80vh; border-radius: var(--r-card); border: 1px solid #fff; scale: .94; transition: scale .5s var(--bounce, ease); }
  .lightbox.open img { scale: 1; }
  .lightbox figcaption { color: #fff; font-weight: 700; font-size: 14px; }
  .lightbox button { position: absolute; border: 1px solid var(--carbon); background: var(--paper); border-radius: 50%; width: 44px; height: 44px; font-size: 20px; cursor: pointer; }
  .lb-close { top: 20px; right: 20px; }
  .lb-prev { left: 20px; top: 50%; translate: 0 -50%; }
  .lb-next { right: 20px; top: 50%; translate: 0 -50%; }
  @media (max-width: 900px) { .k-grid { grid-template-columns: repeat(min(var(--cols, 3), 2), 1fr); } .g-grid { grid-template-columns: repeat(min(var(--cols, 3), 3), 1fr); } }
  @media (max-width: 600px) { .k-grid { grid-template-columns: 1fr; } .g-grid { grid-template-columns: repeat(2, 1fr); } .page-hero { padding-top: 150px; } }
  .blk-in .k-grid .k-card p { margin: 0; font-size: 15px; max-width: 34ch; }
  /* Blog: liste kartları ve yazı tarihi */
  .bl-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; width: 100%; margin: 32px 0 24px; text-align: left; }
  .bl-card { display: flex; flex-direction: column; border: 1px solid var(--carbon); border-radius: var(--r-card); overflow: hidden; background: var(--paper); color: var(--carbon); text-decoration: none; transition: rotate .3s var(--slush, ease); }
  .bl-card:hover { rotate: -1.5deg; }
  .bl-card > img, .bl-ph { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-bottom: 1px solid var(--carbon); background: var(--bc, var(--sky)); }
  .bl-head { display: block; padding: 22px 22px 20px; border-bottom: 1px solid var(--carbon); }
  .bl-card > img + .bl-head { border-bottom: 1px solid var(--carbon); }
  .bl-ph { display: flex; align-items: flex-end; aspect-ratio: auto; min-height: 210px; }
  .bl-head h3 { font-size: clamp(24px, 2.4vw, 32px); line-height: calc(.95em + 2mm); letter-spacing: 0; margin: 0; color: var(--carbon); }
  .bl-foot { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
  .bl-body { display: flex; flex-direction: column; gap: 10px; padding: 20px 22px 22px; flex: 1; }
  .bl-body h3 { font-size: clamp(24px, 2.4vw, 32px); line-height: .95; margin: 0; }
  .bl-body p { margin: 0; font-size: 15px; }
  .bl-more { font-weight: 700; }
  .blog-date { position: relative; margin-top: 18px; font-size: 13px; }
  @media (max-width: 900px) { .bl-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 600px) { .bl-grid { grid-template-columns: 1fr; } }
  .blk-in .k-grid .k-card h3 { margin: 0; }

  /* Kare kalitesi: hareket eden katmanlar önceden ayrı katmana alınır (kaydırırken yeniden boyanmaz) */
  .ribbon, .sticker, .band-row, [data-device] { will-change: transform; }
  /* Yazı tipi yüklenene kadar sayfa görünmez (yazı tipi değişirken metnin zıplaması olmaz) */
  html.js:not(.fonts-ready) body { opacity: 0; }
  body { transition: opacity .35s ease; }
  html.mo-safe body { opacity: 1 !important; }

  /* ---------- Footer ---------- */
  .site-footer { position: relative; color: var(--ft, #fff); }
  .site-footer .inner { padding-block: clamp(64px, 8vw, 110px) 28px; position: relative; z-index: 2; }
  .sf-top { display: grid; grid-template-columns: 1.3fr 1fr 1.1fr 1.1fr; gap: clamp(28px, 5vw, 72px); }
  .sf-logo { height: 64px; width: auto; display: block; margin-bottom: 18px; }
  .sf-logo-text { font-size: 48px; margin: 0 0 14px; }
  .sf-brand p { max-width: 36ch; margin: 0; font-size: 16px; }
  .sf-col h3, .sf-col p.label { margin: 0 0 16px; font-size: 12px; opacity: .75; }
  .sf-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
  .sf-link { display: inline-flex; padding: 9px 16px; border: 1px solid var(--ft, #fff); border-radius: var(--r-pill); color: inherit; text-decoration: none; font-weight: 700; font-size: 13px; line-height: 1; text-transform: uppercase; transition: background .2s ease, color .2s ease; }
  .sf-link:hover { background: var(--ft, #fff); color: var(--fb, #000); }
  .sf-big { margin: clamp(48px, 7vw, 110px) 0 clamp(20px, 3vw, 36px); font-size: 12vw; line-height: .8; text-align: center; text-transform: uppercase; white-space: nowrap; overflow: hidden; }
  .site-footer .foot { border-top: 1px solid color-mix(in srgb, var(--ft, #fff) 35%, transparent); color: inherit; }
  @media (max-width: 800px) { .sf-top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .sf-brand { grid-column: 1 / -1; } .sf-top > * { min-width: 0; } .sf-company { overflow-wrap: anywhere; } }

  /* Sticker tıklama oyunları */
  .st-camera, .st-coin, .st-check, .st-star { cursor: pointer; }
  .sticker, .inline-sticker { overflow: visible; }
  .cam-flash { position: fixed; inset: 0; z-index: 9999; background: #fff; opacity: 0; pointer-events: none; }
  .polaroid { position: fixed; z-index: 60; pointer-events: none; aspect-ratio: 5 / 6; background: #fff; border: 2px solid #000; border-radius: 4px; padding: 6% 6% 0; box-shadow: 3px 4px 0 #000; }
  .polaroid i { display: block; width: 100%; aspect-ratio: 1; background: radial-gradient(circle at 30% 30%, #ffd731 0 12%, transparent 13%), linear-gradient(160deg, #dceeff, #e9ccff 60%, #55db9c); border: 1.5px solid #000; }
  .polaroid b { display: block; width: 46%; height: 5%; margin: 8% auto 0; background: #000; border-radius: 4px; opacity: .8; }
  .fx-spark { position: fixed; z-index: 70; pointer-events: none; }
  .fx-spark svg { width: 100%; height: 100%; display: block; }
  .rating { display: inline-flex; gap: 3px; cursor: pointer; }
  .rating .rs { display: inline-block; width: 1.1em; height: 1.1em; }
  .rating .rs svg { width: 100%; height: 100%; display: block; }

  /* ---------- İşler (portföy) ---------- */
  .works-in, .work-in { width: 100%; max-width: 1240px; margin-inline: auto; padding: clamp(32px, 5vw, 64px) clamp(16px, 3vw, 40px) clamp(64px, 8vw, 120px); }
  .work-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; }
  .work-filter { border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); color: var(--carbon); padding: 11px 18px; font: 700 12px/1 inherit; font-family: inherit; letter-spacing: .032em; text-transform: uppercase; cursor: pointer; transition: transform .15s ease, background .15s ease; }
  .work-filter:hover { transform: translateY(-2px); }
  .work-filter.on { background: var(--carbon); color: var(--paper); }
  .work-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 12px; align-items: stretch; }
  .work-card { position: relative; border: 1px solid var(--carbon); border-radius: calc(var(--r-card) * 1.4); overflow: hidden; background: var(--wc, var(--mint)); transition: transform .35s var(--slush, ease), box-shadow .35s ease; }
  .work-card[hidden] { display: none; }
  .work-card:hover { transform: translateY(-6px) rotate(-.35deg); box-shadow: 4px 6px 0 var(--carbon); }
  .work-link { display: flex; flex-direction: column; height: 100%; color: inherit; text-decoration: none; }
  .work-shot { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--wc, var(--mint)); border-bottom: 1px solid var(--carbon); display: flex; flex-direction: column; }
  .work-shot > img, .work-shot > .work-ph { flex: 1; min-height: 0; width: 100%; }
  .work-shot > img { display: block; object-fit: cover; object-position: top center; transition: scale .6s var(--slush, ease); }
  .work-card:hover .work-shot > img { scale: 1.05; }
  .work-ph { position: relative; display: grid; place-items: center; overflow: hidden; }
  .work-ph .work-st { position: absolute; width: 38%; right: -4%; bottom: -10%; rotate: -12deg; opacity: .95; }
  .work-ph b { position: relative; font-size: clamp(56px, 9vw, 120px); line-height: 1; }
  .work-body { display: grid; gap: 10px; align-content: start; padding: 18px 22px 24px; flex: 1; }
  .work-meta { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
  .work-meta .label { font-size: 11px; }
  .work-cat { padding: 5px 11px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); }
  .work-body h3 { margin: 0; font-size: clamp(26px, 2.6vw, 38px); }
  .work-body p { margin: 0; font-size: 15px; line-height: 1.45; max-width: 46ch; }
  .work-tags { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0; padding: 0; }
  .work-tags li { padding: 4px 10px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: #ffffffaa; font-size: 12px; font-weight: 600; }
  .work-more { margin-top: 6px; }
  .work-empty { margin: 0; padding: 60px 0; text-align: center; font-size: 20px; opacity: .7; }
  @media (min-width: 900px) { .work-card.is-featured { grid-column: span 2; } .work-card.is-featured .work-shot { aspect-ratio: 21 / 10; } }
  .work-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 16px 28px; margin: 0 0 36px; padding-bottom: 28px; border-bottom: 1px solid var(--carbon); }
  .work-facts dt { opacity: .6; margin-bottom: 4px; }
  .work-facts dd { margin: 0; font-size: 18px; font-weight: 600; }
  .work-cover { margin-bottom: 40px; }
  .work-cover .work-shot { aspect-ratio: 16 / 9; border: 1px solid var(--carbon); border-radius: var(--r-card); box-shadow: 4px 6px 0 var(--carbon); }
  .work-text { max-width: 70ch; margin-bottom: 28px; }
  .work-text p { font-size: 18px; line-height: 1.6; margin: 0 0 1.1em; }
  .work-visit { margin-bottom: 40px; }
  .work-in .g-grid { margin: 8px 0 40px; }
  .work-pager { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; padding-top: 28px; border-top: 1px solid var(--carbon); }
  .showcase-cta { position: absolute; left: 50%; bottom: 28px; translate: -50% 0; z-index: 6; }

  /* İşler kartı: alan adı ve aşağı doğru açılan açıklama */
  .work-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 460px), 1fr)); align-items: start; }
  .work-shotlink { display: block; color: inherit; text-decoration: none; }
  .work-card:hover { transform: none; box-shadow: 4px 6px 0 var(--carbon); }
  .work-domain { justify-self: start; color: inherit; text-decoration: none; border-bottom: 1.5px solid var(--carbon); padding-bottom: 1px; }
  .work-domain:hover { background: var(--carbon); color: var(--paper); }
  .work-sum { margin: 0; }
  .work-toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; margin-top: 8px; padding: 13px 18px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); color: var(--carbon); font-family: inherit; cursor: pointer; text-align: left; transition: background .2s ease, color .2s ease; }
  .work-toggle:hover { background: var(--carbon); color: var(--paper); }
  .work-toggle i { font-style: normal; font-size: 20px; line-height: 1; transition: rotate .35s var(--slush, ease); }
  .work-card.open .work-toggle i { rotate: 135deg; }
  .work-card.open .work-toggle { background: var(--carbon); color: var(--paper); }
  .work-panel { display: grid; grid-template-rows: 1fr; }
  html.js .work-panel { grid-template-rows: 0fr; transition: grid-template-rows .5s var(--slush, ease); }
  html.js .work-card.open .work-panel { grid-template-rows: 1fr; }
  .work-panel > .work-desc { min-height: 0; overflow: hidden; }
  .work-desc p { margin: 14px 0 0; font-size: 16px; font-weight: 800; line-height: 1.35; }
  .work-desc ul { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 8px; }
  .work-desc li { position: relative; padding-left: 28px; font-size: 15px; line-height: 1.4; }
  .work-desc li::before { content: '✓'; position: absolute; left: 0; top: 1px; width: 19px; height: 19px; display: grid; place-items: center; border: 1px solid var(--carbon); border-radius: 50%; background: var(--paper); font-size: 11px; font-weight: 900; }
  .work-page { display: inline-block; margin: 16px 0 4px; color: inherit; text-decoration: none; border-bottom: 1.5px solid var(--carbon); }
  .work-text.work-desc p { font-size: 20px; margin-top: 0; }
  .work-text.work-desc li { font-size: 17px; }

  /* Canlı site önizlemesi: masaüstü genişliğinde çizilip karta sığacak şekilde küçültülür */
  .work-shot > .work-live { flex: 1; min-height: 0; }
  .work-live { position: relative; overflow: hidden; background: var(--wc, var(--mint)); }
  .work-live > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
  .work-live iframe { position: absolute; left: 0; top: 0; width: 1440px; height: 900px; border: 0; background: #fff; transform-origin: 0 0; transform: scale(var(--k, .3)); opacity: 0; transition: opacity .7s ease; pointer-events: none; }
  .work-live.is-loaded iframe { opacity: 1; }

  .work-badge { padding: 5px 11px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--sun); }
  .work-shot.is-natural { background: var(--sky); }
  .work-shot.is-natural > img { object-fit: contain; object-position: center; background: var(--sky); }

  /* İşler: kategori başlıkları */
  .work-group[hidden] { display: none; }
  .work-group + .work-group { margin-top: clamp(56px, 8vw, 110px); }
  .work-group-h { margin: 0 0 clamp(20px, 3vw, 36px); font-size: clamp(44px, 8vw, 120px); line-height: .9; }

  .work-body > .work-page { justify-self: start; margin: 10px 0 0; }

  /* ---------- Uygulama detayı: özellikler, bölümler, küçük gösterimler ---------- */
  .rating { font-size: 22px; }
  .work-body .rating { margin: 2px 0 0; }
  .work-feat { margin: 0 0 40px; }
  .work-feat-h { margin: 0 0 18px; font-size: clamp(30px, 4vw, 56px); }
  .work-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
  .work-chips li { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px 10px 10px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); font-size: 15px; font-weight: 600; transition: transform .25s var(--slush, ease), background .25s ease; cursor: default; }
  .work-chips li i { display: grid; place-items: center; flex: none; width: 22px; height: 22px; border: 1px solid var(--carbon); border-radius: 50%; background: var(--mint); font-style: normal; font-size: 12px; font-weight: 900; transition: rotate .4s var(--slush, ease), background .25s ease; }
  .work-chips li:hover { transform: translateY(-3px) rotate(-1.2deg); background: var(--sun); }
  .work-chips li:hover i { rotate: 360deg; background: var(--paper); }
  .work-secs { display: grid; gap: 12px; margin: 0 0 40px; }
  .work-sec { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 14px clamp(20px, 4vw, 56px); padding: clamp(24px, 3.5vw, 44px); padding-right: clamp(24px, 9vw, 120px); border: 1px solid var(--carbon); border-radius: calc(var(--r-card) * 1.4); background: var(--sc, var(--sky)); overflow: visible; }
  .work-sec h3 { margin: 0; font-size: clamp(26px, 3vw, 42px); }
  .work-sec p { margin: 0; font-size: 17px; line-height: 1.6; max-width: 62ch; }
  .sec-st { right: clamp(10px, 2vw, 26px); top: -18px; left: auto; width: clamp(54px, 7vw, 84px); rotate: 10deg; }
  @media (max-width: 760px) { .work-sec { grid-template-columns: 1fr; padding-right: clamp(24px, 12vw, 80px); } }

  .fun { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 32px; margin: 0 0 40px; padding: clamp(20px, 3vw, 34px); border: 1px solid var(--carbon); border-radius: calc(var(--r-card) * 1.4); background: var(--sky); box-shadow: 4px 6px 0 var(--carbon); }
  .fun-note { margin: 0; font-size: 12px; opacity: .65; flex-basis: 100%; }
  .fm-stage { position: relative; width: 78px; height: 100px; flex: none; display: grid; place-items: end center; }
  .fm-pin { width: 60px; height: auto; position: relative; z-index: 1; transform-origin: 50% 100%; }
  .fm-stage.pop .fm-pin { animation: pin-drop .7s cubic-bezier(.3, 1.6, .5, 1); }
  .fm-ring { position: absolute; bottom: 2px; left: 50%; width: 18px; height: 8px; margin-left: -9px; border: 2px solid var(--ember); border-radius: 50%; opacity: 0; }
  .fm-stage.pop .fm-ring { animation: pin-ring .9s ease-out; }
  @keyframes pin-drop { 0% { translate: 0 -46px; scale: .6; opacity: 0; } 55% { translate: 0 0; scale: 1.15 .85; opacity: 1; } 100% { scale: 1; } }
  @keyframes pin-ring { 0% { opacity: .9; scale: .4; } 100% { opacity: 0; scale: 4.2; } }
  .fm-side { display: grid; gap: 12px; }
  .fm-bubble { margin: 0; padding: 10px 16px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); justify-self: start; font-size: 13px; }
  .fm-bubble b { font-weight: 900; }
  .fm-levels { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; }
  .fm-levels li { padding: 6px 12px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); font-size: 13px; font-weight: 700; transition: background .3s ease, transform .3s var(--slush, ease); }
  .fm-levels li.on { background: var(--sun); transform: translateY(-3px) rotate(-1.5deg); }
  .fun-map { cursor: pointer; }

  .fun-deliv { display: grid; background: var(--mint); }
  .fd-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
  .fd-steps li { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); font-weight: 700; font-size: 14px; cursor: pointer; transition: background .3s ease, color .3s ease, transform .3s var(--slush, ease); }
  .fd-steps li i { display: grid; place-items: center; flex: none; width: 24px; height: 24px; border: 1px solid var(--carbon); border-radius: 50%; font-style: normal; font-size: 12px; font-weight: 900; }
  .fd-steps li.done { background: var(--sun); }
  .fd-steps li.on { background: var(--carbon); color: var(--paper); transform: translateY(-3px); }
  .fd-steps li.on i { color: var(--carbon); background: var(--paper); }
  .fd-track { position: relative; height: 14px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); }
  .fd-bar { position: absolute; left: 0; top: 0; bottom: 0; width: var(--p, 16%); border-radius: var(--r-pill); background: var(--carbon); transition: width .8s var(--slush, ease); }
  .fd-truck { position: absolute; top: -22px; left: var(--p, 16%); width: 38px; height: 22px; margin-left: -19px; background: var(--ember); border: 1.5px solid var(--carbon); border-radius: 6px 10px 4px 4px; transition: left .8s var(--slush, ease); }
  .fd-truck::before, .fd-truck::after { content: ''; position: absolute; bottom: -7px; width: 10px; height: 10px; border: 1.5px solid var(--carbon); border-radius: 50%; background: var(--paper); }
  .fd-truck::before { left: 5px; } .fd-truck::after { right: 5px; }
  @media (max-width: 640px) { .fd-steps { grid-template-columns: 1fr; } }
  .fun-rev { background: var(--sun); }
  .fun-rev .rating { font-size: clamp(34px, 6vw, 56px); gap: 6px; }

  /* Ortak yaklaşım */
  .work-approach .works-in { padding-top: clamp(56px, 7vw, 100px); }
  .wa-h { margin: 18px 0 18px; font-size: clamp(36px, 6vw, 84px); line-height: .92; max-width: 16ch; }
  .wa-text { margin: 0 0 32px; font-size: clamp(17px, 1.6vw, 22px); line-height: 1.5; max-width: 60ch; }
  .wa-points { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 12px; margin-bottom: 12px; }
  .wa-point { position: relative; padding: 26px 26px 28px; border: 1px solid var(--carbon); border-radius: calc(var(--r-card) * 1.4); background: var(--paper); }
  .wa-point:nth-child(2) { background: var(--sky); } .wa-point:nth-child(3) { background: var(--mint); }
  .wa-point h3 { margin: 0 0 8px; font-size: clamp(24px, 2.4vw, 34px); padding-right: 56px; }
  .wa-point p { margin: 0; font-size: 16px; line-height: 1.45; }
  .wa-st { right: 14px; top: -14px; left: auto; width: 56px; rotate: 12deg; }
  .wa-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 12px; margin-bottom: 36px; }
  .wa-card { padding: 24px 26px; border: 1px solid var(--carbon); border-radius: calc(var(--r-card) * 1.4); background: var(--sun); }
  .wa-card:nth-child(2) { background: var(--ember); color: var(--paper); }
  .wa-card h3 { margin: 0 0 8px; font-size: 20px; }
  .wa-card p { margin: 0; font-size: 15px; line-height: 1.5; }
  .wa-quote { margin: 0; font-size: clamp(28px, 4.6vw, 64px); line-height: 1; text-align: left; }
  .wa-quote .rating { font-size: clamp(22px, 3vw, 36px); vertical-align: middle; margin-left: 10px; }

  /* Proje sayfası: renkli bölümler */
  .page-eyebrow-link { text-decoration: none; color: inherit; transition: background .2s ease, color .2s ease, transform .2s ease; }
  .page-eyebrow-link:hover { background: var(--carbon); color: var(--paper); transform: translateY(-2px); }
  .work-stage .work-in, .work-featpanel .work-in, .work-secpanel .work-in, .work-end .work-in { padding-top: clamp(40px, 6vw, 80px); padding-bottom: clamp(40px, 6vw, 80px); }
  .work-stage .work-facts { border: 0; padding: 0; margin-bottom: 28px; gap: 10px; }
  .work-stage .work-facts > div { padding: 12px 18px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); }
  .work-stage .work-facts dd { font-size: 16px; }
  .work-stage .work-facts dt { margin: 0 0 2px; font-size: 11px; }
  .work-stage .work-cover { margin-bottom: 28px; }
  .work-stage .work-visit { margin-bottom: 28px; }
  .work-stage .fun { margin-bottom: 0; }
  .ws-st { width: clamp(56px, 8vw, 110px); left: auto; z-index: 4; }
  .ws-a { right: clamp(10px, 3vw, 44px); top: clamp(10px, 3vw, 40px); rotate: 12deg; }
  .ws-b { left: clamp(8px, 2vw, 28px); bottom: clamp(14px, 4vw, 50px); rotate: -10deg; }
  .ws-c { right: clamp(10px, 3vw, 44px); top: clamp(10px, 2vw, 28px); rotate: 8deg; }
  .work-featpanel .work-feat, .work-secpanel .work-secs { margin: 0; }
  .work-end .work-pager { border-top: 0; padding-top: 0; }
  .work-pager .btn { max-width: 100%; min-width: 0; white-space: normal; text-align: left; line-height: 1.2; }
  .work-end .g-grid { margin: 0 0 28px; }

  .work-mid { display: grid; gap: 10px; align-content: start; min-height: 88px; }
  .work-meta .rating { font-size: 17px; gap: 2px; }

  /* Renkli çerçeve (zemin beyaz kalır) */
  .work-frame { position: relative; margin: 0 0 40px; padding: clamp(12px, 1.8vw, 22px); background: var(--wc, var(--mint)); border: 1px solid var(--carbon); border-radius: calc(var(--r-card) * 1.7); box-shadow: 6px 8px 0 var(--carbon); }
  .work-frame .work-cover { margin: 0; }
  .work-frame .work-shot { border: 1px solid var(--carbon); border-radius: var(--r-card); box-shadow: none; }
  .wf-tape { position: absolute; top: -13px; width: clamp(64px, 9vw, 104px); height: 26px; background: #ffffffcc; border: 1px solid var(--carbon); z-index: 2; }
  .wf-t1 { left: 9%; rotate: -5deg; } .wf-t2 { right: 9%; rotate: 4deg; }
  .wf-tag { position: absolute; left: clamp(18px, 3vw, 36px); bottom: -15px; padding: 8px 16px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--sun); z-index: 2; }
  .work-stage .work-visit { margin-top: 12px; }
  .work-stage .work-facts > div { background: var(--wc, var(--sky)); }

  /* Rozet şablonları gösterimi */
  .fun-badges { background: var(--lavender); }
  .fb-tile { position: relative; width: 150px; height: 190px; flex: none; display: grid; place-items: center; border: 1px solid var(--carbon); border-radius: var(--r-card); background: var(--sun); }
  .fb-tile .fb-bottle { width: 62px; height: auto; }
  .fb-tile .fb-badge { position: absolute; left: 10px; top: 10px; }
  .fb-side { display: grid; gap: 12px; }
  .fb-side .label { margin: 0; }
  .fb-chips { display: flex; flex-wrap: wrap; gap: 8px; }
  .fb-badge { display: inline-block; padding: 7px 13px; border: 1.5px solid var(--carbon); border-radius: var(--r-pill); font: 800 12px/1 inherit; font-family: inherit; white-space: nowrap; transition: transform .25s var(--slush, ease); }
  button.fb-chip { cursor: pointer; } button.fb-chip:hover { transform: translateY(-3px) rotate(-2deg); } button.fb-chip.on { outline: 3px solid var(--carbon); outline-offset: 2px; }
  .fb-badge.b0 { background: var(--violet); color: #fff; }
  .fb-badge.b1 { background: #fff; color: var(--carbon); }
  .fb-badge.b2 { background: #fff; color: var(--ember); border: 1.5px dashed var(--ember); }
  .fb-badge.b3 { background: linear-gradient(90deg, var(--ember), var(--sun)); color: var(--carbon); }
  .fb-badge.b4 { background: var(--carbon); color: var(--sun); }
  .fb-badge.b5 { background: var(--mint); color: var(--carbon); }

  /* Hikaye ve kapanış */
  .work-storypanel .work-in { padding-top: clamp(40px, 6vw, 80px); padding-bottom: clamp(40px, 6vw, 80px); }
  .work-story-h { margin: 0 0 24px; font-size: clamp(34px, 5.4vw, 76px); line-height: .92; max-width: 18ch; }
  .work-story { max-width: 72ch; }
  .work-story p { margin: 0 0 1em; font-size: clamp(18px, 1.7vw, 24px); line-height: 1.5; }
  .work-story p:first-child { font-weight: 700; }
  .ws-d { right: clamp(10px, 3vw, 44px); top: clamp(12px, 3vw, 40px); rotate: -8deg; }
  .work-closing { margin: 0 0 36px; max-width: 34ch; font-size: clamp(24px, 3.4vw, 44px); line-height: 1.02; text-transform: none; font-weight: 800; }

  /* Kelime vurgusu: üzerine gelince sitenin sarısı */
  .hw { border-radius: 6px; padding: 0 .1em; margin: 0 -.1em; transition: background .12s ease; }
  .hw:hover { background: var(--sun); }
  .hw-pg .split-ready .w { border-radius: 8px; transition: background .12s ease; }
  .hw-pg .split-ready .w:hover { background: var(--sun); }
  .k-card .hw:hover { background: none; }

  /* Çok satırlı başlıklar üst üste binmesin: satır aralığı açık */
  .work-sec h3.display, .work-body h3.display, .wa-point h3.display { line-height: 1.12; }
  .work-feat-h.display, .work-story-h.display { line-height: 1.06; }
  .wa-h.display, .work-closing.display { line-height: 1.08; }
  .work-group-h.display { line-height: 1; }
  .work-sec h3.display { align-self: start; padding-top: .1em; }

  /* Bölüm kartı başlıkları: daha küçük ve geniş sütun */
  .work-sec { grid-template-columns: minmax(0, 1.3fr) minmax(0, 2fr); }
  .work-sec h3.display { font-size: clamp(22px, 2.3vw, 32px); line-height: 1.08; }

  /* Başlıklar: ilk boyut ve düzen, satır aralığı yalnızca çok az açık */
  .work-sec { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
  .work-sec h3.display { font-size: clamp(26px, 3vw, 42px); line-height: .95; padding-top: 0; }
  .work-body h3.display, .wa-point h3.display { line-height: .95; }
  .work-feat-h.display, .work-story-h.display { line-height: .96; }
  .wa-h.display, .work-closing.display { line-height: .98; }
  .work-group-h.display { line-height: .95; }
  @media (max-width: 760px) {
    .work-sec { grid-template-columns: 1fr; gap: 12px; padding: 26px 22px 28px; }
    .work-sec h3.display { font-size: clamp(24px, 7vw, 30px); line-height: 1; padding-right: 48px; }
    .work-sec p { font-size: 16px; line-height: 1.55; }
  }

  /* Premium proje etiketi */
  .work-premium { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--carbon); color: var(--sun); font-size: 11px; white-space: nowrap; }
  .work-premium i { font-style: normal; }
  .work-card > .work-premium { position: absolute; left: 14px; top: 14px; z-index: 4; box-shadow: 2px 3px 0 #0003; }
  html.mo-idle .work-premium { background-image: linear-gradient(110deg, #000 38%, #4a3d00 50%, #000 62%); background-size: 250% 100%; animation: premium-shine 3.4s linear infinite; }
  @keyframes premium-shine { from { background-position: 150% 0; } to { background-position: -100% 0; } }
  .work-card.is-premium { box-shadow: 4px 6px 0 var(--sun), 4px 6px 0 1px var(--carbon); }
  .work-premium-note { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; margin: 0 0 24px; font-size: 15px; font-weight: 600; }

  /* Sağ altta sabit "yukarı çık" oku */
  .to-top { position: fixed; right: clamp(14px, 2vw, 28px); bottom: clamp(14px, 2vw, 28px); z-index: 40; width: 52px; height: 52px; display: grid; place-items: center; border: 1px solid var(--carbon); border-radius: 50%; background: var(--sun); color: var(--carbon); box-shadow: 3px 4px 0 var(--carbon); opacity: 0; translate: 0 18px; pointer-events: none; transition: opacity .3s ease, translate .35s var(--slush, ease), background .2s ease, color .2s ease; }
  .to-top svg { width: 24px; height: 24px; }
  .to-top.show { opacity: 1; translate: 0 0; pointer-events: auto; }
  .to-top.show:hover { background: var(--carbon); color: var(--sun); translate: 0 -4px; }
  .work-premium-inline { padding: 5px 11px; font-size: 11px; }

  /* Çerez bildirimi: altta ortada, ince ve uzun sticker şerit */
  .ck-bar { position: fixed; left: 50%; bottom: clamp(12px, 2vw, 24px); z-index: 60; width: min(780px, calc(100% - 32px)); display: flex; align-items: center; gap: 12px; padding: 8px 8px 8px 12px; border: 2.5px solid #000; border-radius: var(--r-pill); background: #fff; color: #000; box-shadow: 3px 4px 0 #000; translate: -50% calc(100% + 40px); opacity: 0; transition: translate .5s var(--slush, ease), opacity .3s ease; }
  .ck-bar.show { translate: -50% 0; opacity: 1; }
  .ck-bar[hidden] { display: none; }
  .ck-ico { flex: none; width: 34px; height: 34px; }
  .ck-text { flex: 1; min-width: 0; margin: 0; font-size: 13px; font-weight: 600; line-height: 1.3; }
  .ck-text a { font-weight: 800; white-space: nowrap; text-decoration-thickness: 2px; text-underline-offset: 2px; }
  .ck-act { flex: none; display: flex; gap: 6px; }
  .ck-btn { padding: 10px 14px; font-size: 11px; border: 2px solid #000; background: #fff; color: #000; }
  .ck-btn.ck-ok { background: var(--mint); }
  .ck-btn:hover { background: #000; color: #fff; }
  html.ck-on .to-top { bottom: calc(clamp(12px, 2vw, 24px) + 72px); }
  @media (max-width: 640px) {
    .ck-bar { border-radius: 24px; flex-wrap: wrap; gap: 8px 10px; padding: 10px 12px; }
    .ck-text { flex-basis: calc(100% - 46px); }
    .ck-act { width: 100%; }
    .ck-act .ck-btn { flex: 1; justify-content: center; }
    html.ck-on .to-top { bottom: calc(clamp(12px, 2vw, 24px) + 132px); }
  }
  @media (prefers-reduced-motion: reduce) { .ck-bar { transition: opacity .2s ease; } }

  /* Premium proje etiketi: sitenin sarı hap diliyle, alan adının altında */
  .work-ptag { display: inline-flex; align-items: center; gap: 8px; justify-self: start; padding: 7px 16px 7px 10px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--sun); color: var(--carbon); font-size: 11px; font-weight: 900; letter-spacing: .06em; box-shadow: 2px 3px 0 var(--carbon); rotate: -1.5deg; transition: rotate .3s var(--slush, ease), translate .3s var(--slush, ease); white-space: nowrap; }
  .work-ptag .pt-star { width: 20px; height: 20px; flex: none; background: var(--paper); border: 1px solid var(--carbon); border-radius: 50%; padding: 2px; }
  html.mo-idle .work-ptag .pt-star { animation: pt-spin 6s linear infinite; }
  @keyframes pt-spin { to { rotate: 360deg; } }
  .work-card:hover .work-ptag { rotate: 0deg; translate: 0 -2px; }

  /* Ana sayfa işler vitrini: gerçek projeler */
  .show-stage { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--sky); }
  .show-slide { position: absolute; inset: 0; display: block; opacity: 0; transition: opacity .8s ease; }
  .show-slide.on { opacity: 1; z-index: 1; }
  .show-slide img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
  .show-cap { position: absolute; left: 12px; bottom: 12px; z-index: 3; padding: 7px 14px; background: var(--paper); color: var(--carbon); border: 1px solid var(--carbon); border-radius: var(--r-pill); font-size: 11px; box-shadow: 2px 3px 0 var(--carbon); pointer-events: none; }
  .show-apps { width: min(380px, 78vw); }
  .photo-card.show-apps .shot { aspect-ratio: 16 / 11; border: 1px solid var(--carbon); background: var(--sky); }
  .show-apps .show-slide img { object-fit: contain; background: var(--sky); }
  .show-appcap { margin: 12px 4px 0 !important; font-size: 13px; }
  .show-st { width: clamp(50px, 7vw, 92px); z-index: 1; }
  @media (max-width: 760px) { .show-st { display: none; } }

  /* Görseller kadraja oturur: ekran görüntüleri 2,05:1 */
  .work-shot { aspect-ratio: 2.05 / 1; }
  .work-cover .work-shot { aspect-ratio: 2.05 / 1; }
  @media (min-width: 900px) { .work-card.is-featured .work-shot { aspect-ratio: 2.05 / 1; } }
  .work-shot.is-natural > img { object-fit: contain; }

  /* Ana sayfa vitrini: temalı renkli çerçeve */
  .show-browser { width: min(640px, 92vw); padding: 10px 10px 14px; background: var(--wc, var(--mint)); color: var(--carbon); border: 1px solid var(--carbon); border-radius: calc(var(--r-card) * 1.6); box-shadow: 6px 8px 0 var(--carbon); overflow: visible; transition: background .7s ease; }
  .show-browser .browser-bar { background: transparent; padding: 4px 4px 10px; }
  .show-browser .browser-bar i { width: 11px; height: 11px; border: 1px solid var(--carbon); background: var(--paper); }
  .show-browser .browser-bar i:nth-child(1) { background: var(--ember); } .show-browser .browser-bar i:nth-child(2) { background: var(--sun); } .show-browser .browser-bar i:nth-child(3) { background: var(--paper); }
  .show-browser .browser-bar .url { background: var(--paper); color: var(--carbon); border: 1px solid var(--carbon); font-weight: 700; font-size: 12px; padding: 5px 14px; }
  .show-browser .show-stage { aspect-ratio: 2.05 / 1; border: 1px solid var(--carbon); border-radius: var(--r-card); background: var(--paper); }
  .show-browser .wf-tape { top: -13px; }
  .photo-card.show-apps .shot { aspect-ratio: 16 / 9; }
  .showcase { padding-bottom: 140px; }

  .show-head { flex: 0 0 100%; text-align: center; position: relative; z-index: 3; margin-bottom: 8px; }
  .show-eyebrow { display: inline-block; margin: 0 0 10px; padding: 5px 16px; background: var(--paper); border: 1px solid var(--carbon); border-radius: var(--r-pill); font-size: 12px; }
  .show-title { margin: 0; font-size: clamp(56px, 10vw, 128px); line-height: .9; }
  .show-sub { margin: 10px 0 0; font-size: 15px; opacity: .75; }
  .showcase { padding-top: 130px; }
  .photo-card.show-apps { background: var(--wc, var(--lavender)); padding: 10px 10px 14px; border-radius: calc(var(--r-card) * 1.6); box-shadow: 6px 8px 0 var(--carbon); transition: background .7s ease; overflow: visible; }
  .photo-card.show-apps .shot { border-radius: var(--r-card); background: var(--paper); }
  .photo-card.show-apps .show-slide img { background: var(--paper); }
  .photo-card.show-apps figcaption { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
  .photo-card.show-apps figcaption p { margin: 10px 4px 0; }
  .photo-card.show-apps .placeholder-note { opacity: 1; font-size: 11px; font-weight: 700; background: var(--paper); border: 1px solid var(--carbon); border-radius: var(--r-pill); padding: 2px 10px; }
  .photo-card.show-apps .wf-tape { top: -13px; }

  .work-photo .wp-card { position: relative; background: var(--wc); border: 1px solid var(--carbon); border-radius: calc(var(--r-card) * 1.6); box-shadow: 6px 8px 0 var(--carbon); padding: clamp(22px, 4vw, 44px); display: grid; gap: 22px; }
  .wp-st { position: absolute; right: 18px; top: -34px; width: 88px; height: 88px; rotate: 10deg; }
  .wp-text { margin: 0; max-width: 34em; font-size: clamp(18px, 2.2vw, 26px); font-weight: 700; line-height: 1.25; padding-right: 80px; }
  .wp-points { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
  .wp-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
  .wp-gallery figure { margin: 0; background: var(--paper); border: 1px solid var(--carbon); border-radius: var(--r-card); padding: 8px; }
  .wp-gallery img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: calc(var(--r-card) - 4px); }
  .wp-gallery figcaption { padding: 8px 4px 2px; font-size: 11px; }
  .work-approach { margin-top: clamp(40px, 6vw, 80px); }
  @media (min-width: 700px) { .wp-points { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  .polaroid i.pz { position: relative; overflow: hidden; background-image: none; }
  .polaroid i.pz * { animation: none !important; transition: none !important; }

  .show-head .show-title { padding-bottom: .12em; }
  .show-sub { margin-top: 18px; }
  .show-tag { position: absolute; z-index: 5; bottom: -18px; right: 22px; background: var(--paper); color: var(--carbon); border: 1px solid var(--carbon); border-radius: var(--r-pill); padding: 6px 16px; font-size: 12px; box-shadow: 2px 3px 0 var(--carbon); }
  .show-browser .show-tag { right: auto; left: 24px; }
  .show-photo { position: relative; z-index: 2; display: grid; gap: 6px; align-content: center; justify-items: start; width: min(210px, 70vw); aspect-ratio: 1 / 1.05; padding: 22px 20px; background: var(--sun); color: var(--carbon); text-decoration: none; border: 1px solid var(--carbon); border-radius: calc(var(--r-card) * 1.6); box-shadow: 6px 8px 0 var(--carbon); rotate: 4deg; }
  .show-photo b { font-size: clamp(26px, 3vw, 34px); line-height: .95; }
  .show-photo .label { font-size: 11px; background: var(--paper); border: 1px solid var(--carbon); border-radius: var(--r-pill); padding: 3px 10px; }
  .show-photo-st { position: absolute; right: -14px; top: -28px; width: 84px; height: 84px; rotate: 10deg; }
  .show-browser .show-tag { left: auto; right: 28px; }
  .show-apps .show-tag { bottom: auto; top: -18px; right: 20px; }
  .show-photo { width: min(240px, 76vw); }
  .show-photo b { font-size: clamp(22px, 2.4vw, 28px); overflow-wrap: anywhere; }
  .wp-text { font-weight: 600; font-size: clamp(17px, 1.8vw, 21px); line-height: 1.4; }
  .show-head .show-sub { font-size: clamp(24px, 3.4vw, 46px); margin: 14px 0 0; opacity: 1; }
  .show-hook { margin: 18px auto 0; max-width: 900px; display: grid; gap: 12px; justify-items: center; }
  .show-hook-big { font-size: clamp(30px, 5.4vw, 72px); line-height: 1; }
  .show-hook-big mark { background: var(--sun); color: var(--carbon); padding: .02em .28em .06em; border: 1px solid var(--carbon); border-radius: .22em; box-shadow: 4px 5px 0 var(--carbon); box-decoration-break: clone; -webkit-box-decoration-break: clone; }
  .show-hook-sub { font-size: clamp(16px, 1.9vw, 24px); font-weight: 600; line-height: 1.3; }
  .show-hook { gap: 22px; }
  .show-hook-big { font-size: clamp(26px, 4vw, 54px); line-height: 1.35; text-wrap: balance; }
  .statement-cta { margin: clamp(24px, 4vw, 48px) 0 0; text-align: center; }
  .page-hero h1, .page-hero .tagline { text-wrap: balance; }
  .blk-in h2, .wa-h, .work-group-h { line-height: .95; }
  .feature-media.is-bare { background: transparent !important; border: 0; aspect-ratio: auto; overflow: visible; }
  .feature-media.is-bare svg { filter: drop-shadow(6px 8px 0 #000); }
  .tabpanel h3.display { line-height: .95; }

  .cf { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(24px, 5vw, 72px); align-items: start; }
  @media (max-width: 800px) { .cf { grid-template-columns: 1fr; } }
  .cf-links { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 10px; }
  .cf-links li { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
  .cf-links .label { background: var(--sun); border: 1px solid var(--carbon); border-radius: var(--r-pill); padding: 3px 12px; font-size: 11px; }
  .cf-links a { color: inherit; font-weight: 600; text-underline-offset: 3px; }
  .cf-form { display: grid; gap: 14px; background: var(--mint); border: 1px solid var(--carbon); border-radius: calc(var(--r-card) * 1.6); box-shadow: 6px 8px 0 var(--carbon); padding: clamp(20px, 3vw, 34px); }
  .cf-form label { display: grid; gap: 6px; }
  .cf-form .label { font-size: 11px; }
  .cf-form input, .cf-form textarea { font: inherit; font-size: 16px; padding: 12px 14px; background: var(--paper); color: var(--carbon); border: 1px solid var(--carbon); border-radius: var(--r-card); width: 100%; box-sizing: border-box; resize: vertical; }
  .cf-form input:focus, .cf-form textarea:focus { outline: 3px solid var(--sun); outline-offset: 1px; }
  .cf-hp { position: absolute; left: -9999px; opacity: 0; height: 0; }
  .cf-form .btn { justify-self: start; }
  .cf-status { margin: 0; min-height: 1.2em; font-weight: 600; }
  .cf-status.ok { background: var(--paper); border: 1px solid var(--carbon); border-radius: var(--r-card); padding: 10px 14px; }
  .cf-status.err { color: #b00020; background: var(--paper); border: 1px solid #b00020; border-radius: var(--r-card); padding: 10px 14px; }

  /* Liquid glass sekme çubuğu */
  .tabs::before { content: none; }
  .tablist { z-index: 1; border: 1px solid rgba(0,0,0,.16);
    background: linear-gradient(180deg, rgba(255,255,255,.55), rgba(205,214,230,.30));
    -webkit-backdrop-filter: blur(22px) saturate(1.9) brightness(1.04); backdrop-filter: blur(22px) saturate(1.9) brightness(1.04);
    box-shadow: inset 0 1.5px 1px rgba(255,255,255,.95), inset 0 -1.5px 2px rgba(0,0,0,.07), inset 0 0 14px rgba(255,255,255,.55), 0 10px 30px rgba(20,30,60,.14), 0 1px 2px rgba(0,0,0,.10); }
  .tab { mix-blend-mode: normal; color: var(--carbon); transition: color .22s ease; }
  .tab[aria-selected="true"] { color: var(--carbon); }
  .tab-bg { overflow: hidden; border: 1px solid rgba(255,255,255,.7);
    background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.55));
    -webkit-backdrop-filter: blur(10px) saturate(1.6); backdrop-filter: blur(10px) saturate(1.6);
    box-shadow: inset 0 2px 2px rgba(255,255,255,1), inset 0 -3px 5px rgba(0,0,0,.10), inset 2px 0 4px rgba(255,255,255,.6), inset -2px 0 4px rgba(255,255,255,.6), 0 6px 14px rgba(20,30,60,.22), 0 1px 3px rgba(0,0,0,.18); }
  .tab-bg::after { content: ''; position: absolute; left: 8%; right: 8%; top: 2px; height: 42%; border-radius: 999px; background: linear-gradient(rgba(255,255,255,.85), rgba(255,255,255,0)); pointer-events: none; }
  .page-hero .page-eyebrow { margin-bottom: clamp(24px, 3.4vw, 48px); z-index: 6; }
  .sf-company { font-size: 12px; opacity: .65; line-height: 1.5; margin: 14px 0 0; }

/* Süreç yol haritası */
.rm-intro { margin: 14px 0 0; max-width: 56ch; font-size: clamp(15px, 1.6vw, 18px); font-weight: 600; }
.rm { list-style: none; margin: 44px 0 36px; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; position: relative; }
.rm::before { content: ''; position: absolute; left: 6%; right: 6%; top: 74px; border-top: 4px dashed var(--carbon); transform-origin: left; transform: scaleX(var(--draw, 1)); transition: transform 1.4s cubic-bezier(.65,.05,0,1); }
.rm-step { position: relative; display: grid; gap: 10px; justify-items: start; align-content: start; }
.rm-step:nth-child(even) { margin-top: 56px; }
.rm-ico { width: 100%; max-width: 150px; aspect-ratio: 1; display: grid; place-items: center; background: var(--c); border: 2px solid var(--carbon); border-radius: 28px; box-shadow: 5px 6px 0 var(--carbon); position: relative; z-index: 1; }
.rm-no { position: absolute; z-index: 2; top: -18px; left: 112px; font-size: 24px; line-height: 1; background: var(--carbon); color: #fff; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; }
.rm-step h3 { margin: 12px 0 0; font-size: clamp(26px, 2.8vw, 38px); line-height: .95; }
.rm-step p { margin: 0; font-size: 15px; max-width: 26ch; }
.rm-cta { margin-top: 8px; }
html.js .rm:not(.on) .rm-step { opacity: 0; translate: 0 40px; }
html.js .rm:not(.on) { --draw: 0; }
html.js .rm .rm-step { transition: opacity .6s ease, translate .7s cubic-bezier(.2,.8,.2,1); transition-delay: calc(var(--i) * .22s); }
@media (max-width: 800px) {
  .rm { grid-template-columns: 1fr; gap: 28px; margin-left: 22px; }
  .rm::before { left: 0; right: auto; top: 0; bottom: 0; border-top: 0; border-left: 4px dashed var(--carbon); transform-origin: top; transform: scaleY(var(--draw, 1)); }
  .rm-step { padding-left: 34px; }
  .rm-step:nth-child(even) { margin-top: 0; }
  .rm-no { left: -22px; top: 0; }
  .rm-ico { max-width: 110px; }
}
@media (prefers-reduced-motion: reduce) { html.js .rm:not(.on) .rm-step { opacity: 1; translate: 0 0; } html.js .rm:not(.on) { --draw: 1; } }

/* Görselsiz iş kartı: ortada büyük sticker, köşede küçük ikincisi */
.work-ph .work-st-main { position: relative; width: min(44%, 260px); right: auto; bottom: auto; rotate: -6deg; }
.work-ph .work-st-sub { width: min(22%, 140px); right: 8%; bottom: 8%; rotate: 12deg; }
.work-ph.has-slogan { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: clamp(8px, 1.6vw, 20px); padding: clamp(20px, 3vw, 44px); }
.work-ph.has-slogan .work-st-main { position: relative; z-index: 2; left: auto; top: auto; width: clamp(64px, 9vw, 120px); rotate: -8deg; flex: none; }
.work-slogan { position: relative; display: block; max-width: 16ch; text-align: center; font-size: clamp(28px, 5.2vw, 76px); line-height: .95; }


/* Neden biz kartları: tıklayınca çevrilir, arka yüzde açıklama yazar */
.c-card { padding: 0; display: block; background: none; border: 0; perspective: 1400px; }
.c-card .c-flip { position: absolute; inset: 0; transform-style: preserve-3d; transition: transform .75s cubic-bezier(.2,.8,.2,1); }
.c-card.flipped .c-flip { transform: rotateY(180deg); }
.c-face { position: absolute; inset: 0; background: var(--cc); border: 1px solid var(--carbon); border-radius: var(--r-card); backface-visibility: hidden; -webkit-backface-visibility: hidden; overflow: hidden; }
.c-front { padding: 24px; display: flex; align-items: flex-end; }
.c-back { transform: rotateY(180deg); padding: clamp(22px, 3vw, 34px); display: flex; align-items: center; }
.c-back .c-text { margin: 0; font-weight: 600; line-height: 1.35; }
.c-card.has-back { cursor: pointer; }
.c-card.has-back:focus-visible { outline: 3px solid var(--violet); outline-offset: 4px; border-radius: var(--r-card); }
.c-hint { position: absolute; right: 16px; bottom: 16px; display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; line-height: 1; }
.c-hint i { font-style: normal; font-size: 15px; display: inline-block; transition: rotate .4s ease; }
.c-card.has-back:hover .c-hint i { rotate: 180deg; }
.c-card.has-back:hover .c-hint { background: var(--carbon); color: #fff; }
.c-back { flex-direction: column; align-items: flex-start; justify-content: center; gap: 12px; }
.c-back-t { font-size: 12px; letter-spacing: .06em; }
@media (prefers-reduced-motion: reduce) { .c-card .c-flip { transition: none; } }

.why .why-h { font-size: var(--heading); font-weight: 900; line-height: .95; max-width: none; margin: 0 auto 32px; padding-bottom: .1em; }

/* Başlık satırları arasında 2 mm boşluk: satır yüksekliği = noktalı harflerin (İ, Ü, Ö) tepesi + 2 mm */
.pg-tight h1.display, .pg-tight h2.display, .pg-tight h3.display { line-height: calc(.95em + 2mm); }
/* Google SEO, ikas, blog: harf aralığı 0, satır arası 2 mm (alt satırın en üst noktası ile üst satırın tabanı arası) */
.pg-spaced .display, .pg-spaced .k-card h3.display, .pg-spaced .bl-body h3.display { letter-spacing: 0 !important; }
.pg-spaced h1.display, .pg-spaced h2.display, .pg-spaced h3.display, .pg-spaced .k-card h3.display, .pg-spaced .bl-body h3.display { line-height: calc(.95em + 2mm) !important; }
/* Kapı müşterisi beklemeye son: sarı zemin, siyah çerçeve, yuvarlak köşe, sağ tarafı hafif yukarıda, boşlukta sallanır */
.page-hero h1.t-hang { position: relative; z-index: 5; width: fit-content; max-width: 100%; white-space: nowrap; font-size: clamp(15px, 4.7vw, 100px) !important; margin: .15em auto .35em; box-sizing: border-box; padding: .1em .5em .08em; border: 3px solid var(--carbon); border-radius: var(--r-pill); background: var(--sun); color: var(--carbon); rotate: -3deg; animation: uzayBoşluğu 2.8s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .page-hero h1.t-hang { animation: none; } }
.page-hero h1.t-hang .t-lean { display: inline-block; transform: skewX(-12deg); }

/* Başlıkta çizili kelime + araya sıkıştırılmış düzeltme (elle düzeltilmiş gibi) */
.has-fix { padding-top: 0; }
.fix { position: relative; display: inline-block; white-space: nowrap; }
.fix s { position: relative; display: inline-block; line-height: .78; text-decoration: none; }
.fix s::before { content: ''; position: absolute; left: -1.5%; right: -1.5%; top: 50%; height: .13em; margin-top: -.065em; z-index: 3; border-radius: 99px; background: var(--ember); rotate: -1.8deg; pointer-events: none; }
.fix em { position: absolute; left: 100%; right: auto; top: -.12em; margin-left: .3em; translate: 0 0; rotate: -4deg; font-size: .58em; line-height: 1; white-space: nowrap; font-style: italic; text-decoration: none; letter-spacing: .04em; word-spacing: .12em; color: var(--carbon); background: var(--sun); padding: .16em .4em .2em; border: 1px solid var(--carbon); border-radius: .22em; box-shadow: 3px 4px 0 var(--carbon); z-index: 4; }

.pg-tight h2.has-fix { font-size: calc(var(--heading) * .86); }
/* Dar ekranda etiket kelimenin yanına sığmaz: kelimenin altında kendi satırında durur */
@media (max-width: 900px) {
  .fix { display: block; }
  .fix + br { display: none; } /* blok etiketten sonraki satır sonu fazladan boş satır açmasın */
  .fix em { position: relative; left: auto; top: auto; margin: .35em 0 .45em; display: block; width: fit-content; font-size: .6em; translate: 0 0; }
}
@media (max-width: 480px) { .fix s { font-size: .8em; } .fix em { font-size: .5em; } }

/* Yazılı logo: işaret + yazı (SVG). Aşağı kaydırınca yazı kapanır, işaret kalır */
.logo.has-word { gap: calc(var(--logo, 44px) * .22); flex: none; overflow: visible; }
.logo.has-word .logo-mark { flex: none; height: var(--logo, 44px); width: auto; max-width: none; display: block; object-fit: contain; }
.logo.has-word .logo-word { flex: none; display: block; height: calc(var(--logo, 44px) * .98); width: calc(var(--logo, 44px) * .98 * 2.87); color: var(--lw, var(--violet)); overflow: hidden; transition: width .55s var(--slush, cubic-bezier(.65, .05, 0, 1)), opacity .3s ease, margin .55s ease; }
.nav.scrolled .logo.has-word .logo-word { width: 0; opacity: 0; margin-left: calc(var(--logo, 44px) * -.22); }
@media (max-width: 520px) { .logo.has-word { --logo: 40px !important; } }
@media (prefers-reduced-motion: reduce) { .logo.has-word .logo-word { transition: none; } }

/* Hizmetler: başlıklı, kompakt üç kart */
.svc { padding-block: clamp(44px, 6vw, 88px); }
.svc-in { display: grid; gap: clamp(20px, 3vw, 36px); }
.svc-h { margin: 0; font-size: clamp(36px, 5.6vw, 80px); line-height: .95; padding-bottom: .1em; }
.svc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(12px, 1.6vw, 20px); }
.svc-card { --st: clamp(52px, 5.4vw, 76px); position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: clamp(18px, 2vw, 26px); border: 1px solid var(--carbon); border-radius: var(--r-card); transition: translate .25s ease; }
.svc-card:hover { translate: 0 -4px; }
.svc-card h3 { margin: 0; font-size: clamp(26px, 2.8vw, 40px); line-height: .98; padding-right: calc(var(--st) + 10px); min-height: calc(var(--st) * .8); }
.svc-card.two h3 { padding-right: calc(var(--st) * 1.75 + 10px); }
.svc-card p { margin: 0 0 4px; font-size: 15px; line-height: 1.4; max-width: 34ch; }
.svc-card .btn { margin-top: auto; }
.svc-card .svc-st { position: absolute; top: 14px; right: 14px; width: var(--st); height: auto; }
.svc-card .svc-st.b { right: calc(14px + var(--st) * .78); top: 22px; }
@media (max-width: 800px) { .svc-grid { grid-template-columns: 1fr; } }

/* Hizmetler: diğer işler rozetleri */
.svc-more { display: grid; gap: 12px; }
.svc-more-t { margin: 0; }
.svc-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.svc-chip { display: inline-flex; align-items: center; gap: 8px; padding: 9px 15px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); color: var(--carbon); text-decoration: none; font-size: 14px; font-weight: 700; line-height: 1; transition: background .2s ease, translate .2s ease; }
.svc-chip::before { content: ''; width: 9px; height: 9px; border-radius: 50%; background: var(--c, var(--sun)); border: 1px solid var(--carbon); flex: none; }
.svc-chip:hover { background: var(--c, var(--sun)); translate: 0 -2px; }

/* Rozet grupları: her grup kendi kutusunda */
.svc-groups { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(10px, 1.4vw, 16px); }
.svc-group { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: clamp(16px, 1.8vw, 22px); border: 1px solid var(--carbon); border-radius: var(--r-card); background: var(--paper); }
.svc-group-t { margin: 0; display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 10px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--c, var(--sun)); }
.svc-group .svc-chips { gap: 8px; }
@media (max-width: 900px) { .svc-groups { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .svc-groups { grid-template-columns: 1fr; } }
/* Kutularda daha kompakt rozetler; tek başına kalan son kutu satırı doldurur */
.svc-group .svc-chips { gap: 6px; }
.svc-group .svc-chip { font-size: 13px; padding: 7px 12px; line-height: 1.15; }
.svc-groups > .svc-group:last-child:nth-child(3n + 1) { grid-column: 1 / -1; flex-direction: row; align-items: center; flex-wrap: wrap; }
@media (max-width: 900px) {
  .svc-groups > .svc-group:last-child:nth-child(3n + 1) { grid-column: auto; flex-direction: column; align-items: flex-start; }
  .svc-groups > .svc-group:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (max-width: 560px) { .svc-groups > .svc-group:last-child:nth-child(odd) { grid-column: auto; } }
@media (min-width: 1000px) {
  .svc-groups { grid-template-columns: repeat(4, 1fr); }
  .svc-groups > .svc-group:last-child:nth-child(3n + 1) { grid-column: auto; flex-direction: column; align-items: flex-start; flex-wrap: nowrap; }
  .svc-groups > .svc-group:last-child:nth-child(4n + 3) { grid-column: span 2; }
}
/* Kutu içi: hap yerine sade liste satırları (daha az yer kaplar) */
.svc-group .svc-chips { flex-direction: column; gap: 2px; width: 100%; }
.svc-group .svc-chip { border: 0; background: none; padding: 4px 0; border-radius: 0; font-size: 14px; font-weight: 600; line-height: 1.25; align-items: flex-start; }
.svc-group .svc-chip::before { margin-top: .32em; }
.svc-group .svc-chip:hover { background: none; translate: 0 0; text-decoration: underline; text-underline-offset: 3px; }
.svc-groups > .svc-group:last-child:nth-child(4n + 3) .svc-chips { flex-direction: row; flex-wrap: wrap; gap: 4px 18px; }

/* Diğer işler: ana kartlarla aynı kutular, işlerdeki gibi açılan ayrıntılar */
.svc-grid-more { align-items: start; }
.svc-grid-more .svc-card { min-height: 272px; }
@media (max-width: 800px) { .svc-grid-more .svc-card { min-height: 0; } }
.svc-toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; margin-top: auto; padding: 12px 16px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); color: var(--carbon); cursor: pointer; font-family: inherit; font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.svc-toggle i { font-style: normal; font-size: 20px; line-height: 1; transition: rotate .3s ease; }
.svc-toggle[aria-expanded="true"] i { rotate: 45deg; }
.svc-panel { display: grid; grid-template-rows: 0fr; width: 100%; transition: grid-template-rows .4s cubic-bezier(.65, .05, 0, 1); }
.svc-panel > .svc-items { overflow: hidden; min-height: 0; }
.svc-card.open .svc-panel { grid-template-rows: 1fr; }
.svc-items { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.svc-items li { display: grid; gap: 4px; padding: 12px 0; border-top: 1px solid var(--carbon); }
.svc-card.open .svc-items { padding-top: 6px; }
.svc-items b { font-size: 15px; font-weight: 800; }
.svc-items span { font-size: 14px; line-height: 1.4; }
.svc-more-link { justify-self: start; margin-top: 2px; color: var(--carbon); text-decoration: underline; text-underline-offset: 3px; }
/* Diğer işler ana kartlarla tek ızgara gibi görünsün: aynı boşluk, aynı kutular */
.svc-more { margin-top: calc(clamp(12px, 1.6vw, 20px) - clamp(20px, 3vw, 36px)); }

/* Hizmetler: dokuz kutu aynı boyutta; ayrıntılar açılır paneldedir */
.svc-grid { align-items: start; }
.svc-card { min-height: 272px; }
@media (max-width: 800px) { .svc-card { min-height: 0; } }
.svc-open { overflow: hidden; min-height: 0; display: grid; gap: 14px; justify-items: start; }
.svc-panel > .svc-items { overflow: visible; }
.svc-card .svc-open .btn { margin: 4px 0 6px; }
.svc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 800px) { .svc-grid { grid-template-columns: minmax(0, 1fr); } }

/* Ürün çekimi galerisi: kategoriye göre gruplu, hepsi kare */
.wp-group { display: grid; gap: 12px; margin-top: 8px; }
.wp-group-t { margin: 8px 0 0; padding: 6px 12px; justify-self: start; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); }
.wp-gallery { grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); }
.wp-gallery img { aspect-ratio: 1 / 1; object-fit: cover; object-position: center; }

/* Ürün çekimi: sektör kapak kartları + açılan pencere */
.wp-sectors { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: 14px; }
.wp-sector { position: relative; display: block; aspect-ratio: 1 / 1; padding: 0; border: 1px solid var(--carbon); border-radius: var(--r-card); overflow: hidden; background: var(--paper); cursor: pointer; text-align: left; font-family: inherit; color: var(--carbon); transition: translate .25s ease; }
.wp-sector:hover { translate: 0 -4px; }
.wp-sector img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: scale .5s ease; }
.wp-sector:hover img { scale: 1.05; }
.wp-sector-t { position: absolute; left: 12px; right: 12px; bottom: 44px; z-index: 1; display: inline-block; width: fit-content; max-width: calc(100% - 24px); padding: 6px 12px 8px; background: var(--paper); border: 1px solid var(--carbon); border-radius: .5em; font-size: clamp(20px, 2vw, 28px); line-height: 1; }
.wp-sector-n { position: absolute; left: 12px; bottom: 12px; z-index: 1; padding: 6px 12px; background: var(--carbon); color: #fff; border-radius: var(--r-pill); }
.wp-dialog { width: min(1100px, calc(100vw - 24px)); max-height: calc(100vh - 24px); padding: 0; border: 1px solid var(--carbon); border-radius: var(--r-card); background: var(--paper); color: var(--carbon); overflow: hidden; }
.wp-dialog::backdrop { background: rgba(10, 10, 14, .72); }
.wp-dialog-in { display: grid; grid-template-rows: auto 1fr; max-height: calc(100vh - 24px); }
.wp-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--carbon); }
.wp-dialog-head h3 { margin: 0; font-size: clamp(26px, 3.4vw, 44px); line-height: 1; }
.wp-close { padding: 10px 16px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--carbon); color: #fff; cursor: pointer; font-family: inherit; }
.wp-dialog .wp-gallery { padding: 16px 20px 20px; overflow-y: auto; overscroll-behavior: contain; }

/* Fotoğraf büyütme penceresi */
.wp-dialog .wp-gallery figure { cursor: zoom-in; }
.wp-light { width: 100vw; height: 100vh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: transparent; color: #fff; overflow: hidden; }
.wp-light::backdrop { background: rgba(8, 8, 12, .9); }
.wp-light figure { margin: 0; height: 100%; display: grid; grid-template-rows: 1fr auto; place-items: center; gap: 12px; padding: 56px 64px 24px; }
.wp-light img { width: auto; height: auto; max-width: 100%; max-height: calc(100vh - 150px); object-fit: contain; border-radius: var(--r-card); border: 1px solid #fff; }
.wp-light figcaption { color: #fff; text-align: center; }
.wp-light-x { position: absolute; top: 16px; right: 16px; padding: 10px 16px; border: 1px solid #fff; border-radius: var(--r-pill); background: transparent; color: #fff; cursor: pointer; font-family: inherit; }
.wp-light-a { position: absolute; top: 50%; translate: 0 -50%; width: 48px; height: 48px; border: 1px solid #fff; border-radius: 50%; background: transparent; color: #fff; font-size: 30px; line-height: 1; cursor: pointer; }
.wp-light-a.prev { left: 12px; } .wp-light-a.next { right: 12px; }
@media (max-width: 600px) { .wp-light figure { padding: 56px 12px 16px; } .wp-light-a { top: auto; bottom: 12px; translate: 0 0; } }
/* Sektör kartı: kare fotoğraf üstte, yazılar karenin altında */
.wp-sector { aspect-ratio: auto; display: grid; gap: 10px; padding: 8px 8px 12px; align-content: start; }
.wp-ph { display: block; position: relative; overflow: hidden; aspect-ratio: 1 / 1; border-radius: calc(var(--r-card) - 4px); }
.wp-sector img { position: static; inset: auto; width: 100%; height: 100%; aspect-ratio: 1 / 1; border-radius: 0; display: block; transform-origin: 0 0; }
.wp-sector:hover img { scale: 1; }
.wp-sector-t { position: static; display: block; width: auto; max-width: none; padding: 0 4px; background: none; border: 0; border-radius: 0; font-size: clamp(22px, 2.2vw, 30px); line-height: 1; padding-bottom: .08em; }
.wp-sector-n { position: static; justify-self: start; margin: 0 4px; }

/* Teklif sihirbazı */
.blk-wizard { padding-block: clamp(32px, 5vw, 72px); }
.wz { background: var(--paper); border: 1px solid var(--carbon); border-radius: calc(var(--r-card) * 1.4); padding: clamp(20px, 3vw, 40px); max-width: 1100px; margin-inline: auto; }
.wz-head { display: flex; justify-content: space-between; gap: 16px; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.wz-track { height: 6px; border-radius: 9px; background: #00000014; margin: 14px 0 28px; overflow: hidden; }
.wz-fill { height: 100%; width: 0; background: var(--carbon); transition: width .35s ease; }
.wz h2 { margin: 0 0 10px; font-size: clamp(26px, 3.4vw, 42px); line-height: 1; font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: -.02em; }
.wz-lead { margin: 0 0 22px; font-size: clamp(16px, 1.6vw, 19px); line-height: 1.55; max-width: 62ch; }
.wz-scene { animation: wzin .3s ease both; }
.wz button, .wz a, .wz label, .wz summary { -webkit-tap-highlight-color: transparent; }
@keyframes wzin { from { opacity: 0; translate: 0 8px; } to { opacity: 1; translate: 0 0; } }
.wz-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.wz-choice { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; min-height: 150px; padding: 20px 52px 20px 20px; text-align: left; border: 1px solid var(--carbon); border-radius: var(--r-card); background: var(--sky); color: var(--carbon); cursor: pointer; font-family: inherit; transition: translate .2s ease; }
.wz-choice[data-i="1"] { background: var(--mint); } .wz-choice[data-i="2"] { background: var(--lavender); } .wz-choice[data-i="3"] { background: var(--sun); }
.wz-choice:hover { translate: 0 -3px; }
.wz-choice strong { font-size: clamp(19px, 1.9vw, 24px); font-weight: 800; line-height: 1.1; letter-spacing: -.01em; }
.wz-choice small { font-size: 15px; line-height: 1.5; }
.wz-mark { position: absolute; top: 18px; right: 18px; width: 24px; height: 24px; display: grid; place-items: center; border: 1px solid var(--carbon); border-radius: 50%; background: #fff; font-size: 13px; font-weight: 800; }
.wz-choice[aria-pressed="true"] { background: var(--carbon); color: #fff; }
.wz-choice[aria-pressed="true"] .wz-mark { background: var(--sun); color: var(--carbon); }
.wz-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--carbon); }
.wz-hint { font-size: 13px; text-align: center; }
.wz-btn { padding: 12px 20px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: #fff; color: var(--carbon); font-family: inherit; font-size: 14px; font-weight: 800; cursor: pointer; }
.wz-btn.primary { background: var(--carbon); color: #fff; }
.wz-btn:disabled { opacity: .35; cursor: not-allowed; }
.wz-btn[hidden] { display: none; }
.wz-pack { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 8px 0 24px; padding: 22px 24px; border: 1px solid var(--carbon); border-radius: var(--r-card); background: var(--mint); }
.wz-pack small { font-weight: 800; letter-spacing: .04em; }
.wz-pack h3 { margin: 6px 0; font-size: clamp(30px, 4vw, 48px); line-height: .95; font-weight: 900; font-style: italic; text-transform: uppercase; }
.wz-pack p { margin: 0; font-size: 15px; line-height: 1.5; }
.wz-pill { padding: 8px 14px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: #fff; font-size: 12px; font-weight: 800; white-space: nowrap; }
.wz-sub { margin: 26px 0 10px; font-size: 20px; font-weight: 800; }
.wz-summary { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 8px; }
.wz-summary li { padding: 12px 16px; border: 1px solid var(--carbon); border-radius: 14px; background: var(--lavender); font-size: 15px; }
.wz-selected { display: grid; gap: 10px; }
.wz-item { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; border: 1px solid var(--carbon); border-radius: var(--r-card); background: var(--sky); }
.wz-item p { margin: 6px 0 0; font-size: 15px; line-height: 1.5; }
.wz-empty { padding: 14px 18px; border: 1px dashed var(--carbon); border-radius: 14px; font-size: 14px; }
.wz-other { margin-top: 20px; border-top: 1px solid var(--carbon); padding-top: 12px; }
.wz-other summary { cursor: pointer; font-weight: 800; padding: 8px 0; }
.wz-other .wz-grid { margin-top: 14px; }
.wz-notice { margin: 20px 0 0; font-size: 14px; line-height: 1.6; }
.wz-form { display: grid; gap: 12px; max-width: 560px; }
.wz-form label:not(.wz-consent) { display: grid; gap: 6px; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; }
.wz-form input:not([type="checkbox"]), .wz textarea { width: 100%; padding: 13px 16px; border: 1px solid var(--carbon); border-radius: 14px; background: #fff; color: var(--carbon); font: inherit; font-size: 16px; text-transform: none; letter-spacing: 0; font-weight: 500; }
.wz textarea { min-height: 150px; resize: vertical; line-height: 1.6; }
.wz-consent { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; line-height: 1.5; font-weight: 500; }
.wz-consent input { margin-top: 3px; width: 18px; height: 18px; flex: none; accent-color: var(--carbon); }
.wz-consent a { text-decoration: underline; }
.wz-hp { position: absolute; left: -9999px; opacity: 0; }
.wz-form-status, .wz-status { min-height: 20px; margin: 4px 0 0; font-size: 14px; font-weight: 700; }
.wz-form-status.ok { color: #0c7a47; } .wz-form-status.err { color: #b3261e; }
.wz-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.wz-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
@media (max-width: 700px) { .wz-grid { grid-template-columns: 1fr; } .wz-choice { min-height: 0; } .wz-hint { display: none; } .wz-pack { flex-wrap: wrap; } .wz-item { flex-direction: column; align-items: flex-start; } }
@media (prefers-reduced-motion: reduce) { .wz-scene { animation: none; } .wz-fill { transition: none; } }

.wz-plus li b { display: inline-grid; place-items: center; width: 22px; height: 22px; margin-right: 6px; border: 1px solid var(--carbon); border-radius: 50%; background: var(--sun); font-size: 14px; line-height: 1; }
.wz-plus li.wz-incl { background: var(--sky); font-weight: 800; }

.wz-choice.wz-locked { opacity: .55; cursor: not-allowed; background: #e9e9e9 !important; color: var(--carbon); }
.wz-choice.wz-locked:hover { translate: 0 0; }
.wz-lock-note { font-weight: 800; font-size: 14px; }

.wz-choice small b, .wz-item p b { font-weight: 900; }
/* Teklif sihirbazı sayacı */
.wz-timer { position: relative; display: flex; align-items: center; gap: 12px; width: fit-content; max-width: min(1100px, 100%); margin: 0 auto 14px; padding: 10px 18px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--sun); overflow: hidden; transition: background .3s ease; }
.wz-timer-ic { font-size: 18px; line-height: 1; }
.wz-timer-txt { font-size: 14px; font-weight: 700; line-height: 1.2; }
.wz-timer-clock { font-size: 20px; font-weight: 900; font-variant-numeric: tabular-nums; letter-spacing: .02em; padding: 3px 12px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: #fff; }
.wz-timer-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: #00000018; }
.wz-timer-bar i { display: block; height: 100%; width: 100%; background: var(--carbon); transition: width .25s linear; }
.wz-timer[data-state="run"] { background: var(--mint); }
.wz-timer[data-state="win"] { background: var(--lavender); }
.wz-timer[data-state="over"] { background: var(--sky); }
.wz-timer[data-state="run"] .wz-timer-ic { animation: wzpulse 1s ease-in-out infinite; }
@keyframes wzpulse { 50% { scale: 1.2; } }
@media (max-width: 600px) { .wz-timer { width: 100%; justify-content: space-between; border-radius: 22px; padding: 10px 14px; } .wz-timer-txt { font-size: 13px; } }
@media (prefers-reduced-motion: reduce) { .wz-timer-bar i { transition: none; } .wz-timer[data-state="run"] .wz-timer-ic { animation: none; } }
/* Sayaç sağda, sticker gibi hafif eğik; kartın sağ kenarına hizalı */
.wz-timer { margin: 0 calc((100% - min(1100px, 100%)) / 2) -18px auto; rotate: 2deg; position: relative; z-index: 3; translate: 0 6px; }
.wz-timer[data-state="win"] { rotate: -2deg; }
@media (max-width: 1140px) { .wz-timer { margin-right: 12px; } }
@media (max-width: 600px) { .wz-timer { margin: 0 0 -14px auto; width: auto; max-width: 100%; rotate: 1.5deg; } }

/* Paket farkı + yapılacak işler */
.wz-todo li { background: var(--sky); }
.wz-diff { margin: 30px 0 8px; padding: 20px; border: 2px solid var(--carbon); border-radius: var(--r-card); background: var(--sun); }
.wz-diff-title { margin: 0 0 14px; font-size: clamp(20px, 2.4vw, 28px); font-weight: 900; font-style: italic; text-transform: uppercase; line-height: 1.05; }
.wz-diff-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.wz-yes, .wz-no { padding: 16px; border: 1px solid var(--carbon); border-radius: 14px; }
.wz-yes { background: var(--mint); } .wz-no { background: #ffb4a8; }
.wz-yes strong, .wz-no strong { display: block; margin-bottom: 10px; font-size: 14px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.wz-diff ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.wz-diff li { display: flex; gap: 8px; font-size: 15px; line-height: 1.45; }
.wz-diff li b { flex: none; }
.wz-no li { text-decoration: line-through; text-decoration-thickness: 1px; }
@media (max-width: 700px) { .wz-diff-cols { grid-template-columns: 1fr; } }

.wz-site-status { min-height: 22px; margin: 4px 0 0; font-size: 15px; font-weight: 800; }
.wz-site-status.ok { color: #0c7a47; } .wz-site-status.err { color: #b3261e; }

/* Paket kazanımları */
.wz-gain { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.wz-gain-card { display: flex; flex-direction: column; gap: 6px; padding: 16px 18px; border: 1px solid var(--carbon); border-radius: 14px; background: #fff; }
.wz-gain-tag { align-self: flex-start; padding: 3px 10px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--mint); font-size: 12px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.wz-gain-card strong { font-size: clamp(17px, 1.6vw, 20px); line-height: 1.2; font-weight: 800; }
.wz-gain-card p { margin: 0; font-size: 15px; line-height: 1.45; }
.wz-all { margin-top: 18px; }
.wz-all summary { cursor: pointer; font-weight: 800; padding: 8px 0; }
.wz-all .wz-summary { margin-top: 10px; }
@media (max-width: 700px) { .wz-gain { grid-template-columns: 1fr; } }

/* Ek öneriler: dikkat çeken alan */
.wz-reco { margin-top: 36px; padding: clamp(18px, 2.4vw, 30px); border: 2px solid var(--carbon); border-radius: calc(var(--r-card) * 1.2); background: var(--lavender); }
.wz-reco-title { margin: 0 0 8px; font-size: clamp(30px, 4.6vw, 56px); line-height: .95; font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: -.02em; }
.wz-reco-lead { margin: 0 0 20px; font-size: clamp(16px, 1.6vw, 19px); font-weight: 700; }

.wz-urlbox { display: flex; align-items: stretch; max-width: 700px; border: 2px solid var(--carbon); border-radius: 20px; background: var(--sun); overflow: hidden; box-shadow: 2px 3px 0 var(--carbon); }
.wz-urlbox i { display: grid; place-items: center; padding: 0 4px 0 16px; font-style: normal; font-size: 16px; font-weight: 800; text-transform: none; letter-spacing: 0; color: #00000099; }
.wz-form .wz-urlbox input { border: 0; border-radius: 0; padding-left: 2px; background: var(--sun) !important; color: #000; }
.wz-form .wz-urlbox input:focus { outline: none; background: var(--sun) !important; }
.wz-form .wz-urlbox input:-webkit-autofill, .wz-form .wz-urlbox input:-webkit-autofill:hover, .wz-form .wz-urlbox input:-webkit-autofill:focus { -webkit-box-shadow: 0 0 0 1000px var(--sun) inset !important; -webkit-text-fill-color: #000 !important; background: var(--sun) !important; }
.wz-urlbox:focus-within { border-color: var(--sun); box-shadow: 0 0 0 2px var(--carbon); }

/* Paketin tüm özellikleri: iki sütun, üstüne gelince sarı */
.wz-allgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wz-allgrid li { background: #fff; transition: background .18s ease, translate .18s ease; }
.wz-allgrid li:hover { background: var(--sun); translate: 0 -2px; }
@media (max-width: 700px) { .wz-allgrid { grid-template-columns: 1fr; } }

/* Seçilen bağımsız hizmetler: belirgin alan, hizmet kendi kart renginde */
.wz-sel { margin: 34px 0 8px; padding: clamp(16px, 2.2vw, 26px); border: 2px solid var(--carbon); border-radius: calc(var(--r-card) * 1.2); background: #fff; }
.wz-sel-title { margin: 0 0 14px; font-size: clamp(26px, 3.8vw, 46px); line-height: .95; font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: -.02em; }
.wz-sel .wz-item { background: var(--sky); } .wz-sel .wz-item[data-i="1"] { background: var(--mint); } .wz-sel .wz-item[data-i="2"] { background: var(--lavender); } .wz-sel .wz-item[data-i="3"] { background: var(--sun); }
.wz-sel .wz-item strong { font-size: clamp(18px, 1.8vw, 22px); }
.wz-sel .wz-empty { background: #ffffff99; }

.wz-keep { animation: none; }

/* Cevaplarınız: renkli kutucuklar */
.wz-chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 8px; }
.wz-chip { display: flex; flex-direction: column; gap: 2px; padding: 10px 16px; border: 1px solid var(--carbon); border-radius: 14px; background: var(--sky); }
.wz-chip[data-i="1"] { background: var(--mint); } .wz-chip[data-i="2"] { background: var(--lavender); } .wz-chip[data-i="3"] { background: var(--sun); }
.wz-chip small { font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.wz-chip b { font-size: 16px; font-weight: 800; line-height: 1.25; }

.wz-reco-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.wz-reco-top .wz-btn { flex: none; margin-top: 6px; }
.wz-reco-bottom { display: flex; justify-content: flex-end; margin-top: 16px; }
@media (max-width: 700px) { .wz-reco-top { flex-direction: column; } }

/* Artılar / eksikler */
.wz-pm { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.wz-pm-col { padding: 16px; border: 2px solid var(--carbon); border-radius: var(--r-card); }
.wz-pm-plus { background: #e6fbf0; } .wz-pm-minus { background: #ffe3dd; }
.wz-pm-col h4 { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font-size: clamp(20px, 2.2vw, 26px); font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: -.01em; }
.wz-pm-col h4 b { display: inline-grid; place-items: center; width: 28px; height: 28px; border: 1px solid var(--carbon); border-radius: 50%; font-style: normal; font-size: 20px; line-height: 1; }
.wz-pm-plus h4 b { background: var(--mint); } .wz-pm-minus h4 b { background: #ff8f7d; }
.wz-pm-col .wz-chips { margin: 0; }
.wz-pm-empty { margin: 0; font-size: 14px; font-weight: 700; }
@media (max-width: 700px) { .wz-pm { grid-template-columns: 1fr; } }

.wz-basic { margin-top: 14px; padding: 16px; border: 2px solid var(--carbon); border-radius: var(--r-card); background: #fff; }
.wz-basic h4 { margin: 0 0 12px; font-size: clamp(20px, 2.2vw, 26px); font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: -.01em; }
.wz-basic .wz-chips { margin: 0; }
.wz-note p { margin: 0; font-size: 16px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }

.wz-sel-top { display: flex; justify-content: flex-start; margin-bottom: 10px; }
.wz-sel-top:empty { display: none; }

/* Paketin tüm özellikleri: pakete özel maddeler baş harf rozetiyle */
.wz-allgrid li { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.wz-badge { flex: none; display: inline-grid; place-items: center; width: 24px; height: 24px; border: 1px solid var(--carbon); border-radius: 50%; background: var(--sun); font-size: 13px; font-weight: 900; line-height: 1; }
.wz-all-note { margin: 10px 0 0; display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; }

/* Sonuç sayfası: sağ sütunda seçilen hizmetler */
.wz-res { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 360px); gap: 24px; align-items: start; }
.wz-res-main { min-width: 0; }
.wz-res-side { position: sticky; top: 100px; }
.wz-res-side .wz-sel { margin: 34px 0 0; }
.wz-res-side .wz-sel-title { font-size: clamp(22px, 2.4vw, 30px); }
.wz-res-side .wz-item { flex-direction: column; align-items: flex-start; }
@media (max-width: 900px) { .wz-res { grid-template-columns: 1fr; } .wz-res-side { position: static; } .wz-res-side .wz-sel { margin-top: 0; } }

/* Paket merdiveni */
.wz-ladder-wrap { position: relative; margin: 8px 0 24px; }
.wz-ladder { height: 300px; overflow-y: auto; scroll-snap-type: y proximity; padding-block: 56px; display: flex; flex-direction: column; gap: 10px; scrollbar-width: none; border-radius: var(--r-card); }
.wz-ladder::-webkit-scrollbar { display: none; }
.wz-ladder:focus-visible { outline: 2px solid var(--carbon); outline-offset: 3px; }
.wz-tier { flex: none; height: 188px; scroll-snap-align: center; border: 1px solid var(--carbon); border-radius: var(--r-card); }
.wz-tier.mid { background: var(--mint); border-width: 2px; display: flex; }
.wz-tier.mid .wz-pack { flex: 1; margin: 0; border: 0; background: transparent; border-radius: 0; }
.wz-tier.up { background: var(--lavender); } .wz-tier.down { background: var(--sky); }
.wz-tier.up, .wz-tier.down { display: flex; padding: 16px 22px; }
.wz-tier.up { flex-direction: column; } .wz-tier.down { flex-direction: column-reverse; }
.wz-tier-head small { font-size: 12px; font-weight: 800; letter-spacing: .05em; }
.wz-tier-head h3 { margin: 4px 0 0; font-size: clamp(26px, 3.4vw, 40px); line-height: .95; font-weight: 900; font-style: italic; text-transform: uppercase; }
.wz-tier.up .wz-tier-head { order: 2; margin-top: auto; } .wz-tier.up .wz-tier-body { order: 1; }
.wz-tier-body p { margin: 0; font-size: 15px; line-height: 1.5; }
.wz-ladder-hint { position: absolute; right: 14px; top: 50%; translate: 0 -50%; padding: 4px 10px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: #fff; font-size: 12px; font-weight: 800; pointer-events: none; }
@media (max-width: 700px) { .wz-ladder-hint { display: none; } }

/* Seçilenler kutusu tam genişlikte; "Hepsini çıkar" sağ üst köşede */
.wz-res { display: block; } .wz-res-side { position: static; }
.wz-sel { position: relative; }
.wz-sel-top { position: absolute; top: clamp(16px, 2.2vw, 26px); right: clamp(16px, 2.2vw, 26px); margin: 0; justify-content: flex-end; }
.wz-sel-title { padding-right: 190px; }
@media (max-width: 700px) { .wz-sel-top { position: static; margin-bottom: 10px; } .wz-sel-title { padding-right: 0; } }

/* Artılar / eksikler: canlı renkler */
.wz-pm-plus { background: var(--mint); } .wz-pm-minus { background: var(--ember, #ff7a59); }
.wz-pm-col .wz-chip { background: #fff; border-width: 2px; }
.wz-pm-plus h4 b { background: #fff; } .wz-pm-minus h4 b { background: #fff; }
.wz-pm-empty { background: #ffffffcc; padding: 8px 12px; border-radius: 12px; }

/* Son sayfa: canlı renkler */
.wz-pack { background: var(--mint); border-width: 2px; }
.wz-screen .wz-sub { margin: 34px 0 14px; font-size: clamp(28px, 4vw, 48px); line-height: .95; font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: -.02em; }
.wz-todo li { font-weight: 700; border-width: 2px; background: var(--sky); }
.wz-todo li:nth-child(4n+2) { background: var(--mint); } .wz-todo li:nth-child(4n+3) { background: var(--lavender); } .wz-todo li:nth-child(4n) { background: var(--sun); }
.wz-basic { background: var(--sky); }
.wz-basic .wz-chip { background: #fff; border-width: 2px; }
.wz-note { background: var(--lavender); }
.wz-all summary { display: inline-block; padding: 10px 18px; border: 2px solid var(--carbon); border-radius: var(--r-pill); background: var(--sun); font-weight: 900; list-style: none; }
.wz-all summary::-webkit-details-marker { display: none; }
.wz-all[open] summary { background: var(--carbon); color: #fff; }
.wz-sel { background: var(--blue); }
.wz-sel-title { color: #fff; }
.wz-sel .wz-empty { background: #fff; }
.wz-send { margin-top: 34px; padding: clamp(18px, 2.6vw, 32px); border: 2px solid var(--carbon); border-radius: calc(var(--r-card) * 1.2); background: var(--sun); }
.wz-send-title { margin: 0 0 12px; font-size: clamp(28px, 4vw, 48px); line-height: .95; font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: -.02em; }
.wz-send .wz-lead { max-width: 60ch; }
.wz-notice { display: inline-block; padding: 10px 16px; border: 1px solid var(--carbon); border-radius: 14px; background: #fff; font-weight: 700; }

/* Tambur etkisi: kademeler kaydırırken silindir gibi döner */
.wz-ladder-wrap { display: flex; flex-direction: column; align-items: flex-end; }
.wz-ladder-wrap .wz-ladder { align-self: stretch; }
.wz-ladder-hint { position: static; translate: none; margin: 0 0 8px; pointer-events: none; }
.wz-tier { will-change: transform; }

.wz-ladder, .wz-tier { user-select: none; -webkit-user-select: none; cursor: default; }

.wz-screen, .wz-screen * { overflow-anchor: none; }

/* Paket yığını: seçilen paket ortada, öteki paketler arkasından görünür. Sabit, hareketsiz. */
.wz-stack { position: relative; margin: 8px 0 24px; }
.wz-mid { position: relative; z-index: 5; }
.wz-mid .wz-pack { margin: 0; background: var(--mint); border-width: 2px; }
.wz-peek { position: absolute; height: 110px; display: flex; padding: 9px 22px; border: 2px solid var(--carbon); border-radius: var(--r-card); user-select: none; cursor: default; }
.wz-peek b { font-size: clamp(18px, 2vw, 24px); font-weight: 900; font-style: italic; text-transform: uppercase; line-height: 1; }
.wz-peek.up { align-items: flex-start; background: var(--lavender); z-index: 3; }
.wz-peek.up.d1 { background: var(--sun); z-index: 2; }
.wz-peek.down { align-items: flex-end; background: var(--sky); z-index: 3; }
.wz-peek.down.d1 { background: var(--sun); z-index: 2; }

/* Eksikleriniz kutusu: sağ üstte boşlukta sallanan "merak etmeyin" etiketi */
.wz-pm-minus { position: relative; }
.wz-hang { display: inline-block; pointer-events: auto; }
.wz-hang i { display: none; }
.wz-hang b { display: inline-block; padding: 8px 16px; border: 2px solid var(--carbon); border-radius: 20px; background: var(--sun); color: var(--carbon); font-size: 13px; font-weight: 600; line-height: 1.4; text-align: center; box-shadow: 2px 3px 0 var(--carbon), 0 0 24px rgba(255, 200, 0, 0.5), 0 8px 16px rgba(0, 0, 0, 0.08); position: relative; top: -6px; animation: uzayBoşluğu 2.8s ease-in-out infinite; }
.wz-hang b::before { display: none; }
@keyframes uzayBoşluğu { 0%, 100% { transform: translateY(0px); } 50% { transform: translateY(-5px); } }
@keyframes wzSwing { from { rotate: -7deg; } to { rotate: 7deg; } }
@media (prefers-reduced-motion: reduce) { .wz-hang { animation: none; } }
@media (max-width: 700px) { .wz-pm-minus { margin-top: 34px; } }

/* ikas işareti: seçenek kartında küçük rozet */
.wz-ikas { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px 5px 8px; border: 2px solid var(--carbon); border-radius: var(--r-pill); background: var(--violet, #5c4ade); color: #fff; font-size: 17px; font-weight: 900; font-style: italic; letter-spacing: -.02em; line-height: 1; box-shadow: 2px 3px 0 var(--carbon); rotate: -3deg; }
.wz-ikas i { width: 14px; height: 14px; border: 2px solid var(--carbon); border-radius: 50%; background: var(--sun); }
.wz-choice[aria-pressed="true"] .wz-ikas { border-color: #fff; box-shadow: 2px 3px 0 #fff; }

/* Hizmet amaç soruları */
.wz-dets { display: grid; gap: 14px; }
.wz-det { padding: clamp(16px, 2vw, 24px); border: 2px solid var(--carbon); border-radius: var(--r-card); background: var(--sky); }
.wz-det[data-i="1"] { background: var(--mint); } .wz-det[data-i="2"] { background: var(--lavender); } .wz-det[data-i="3"] { background: var(--sun); }
.wz-det h3 { margin: 0 0 8px; font-size: clamp(24px, 3vw, 36px); line-height: .95; font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: -.02em; }
.wz-det-q { margin: 14px 0 8px; font-size: 16px; font-weight: 800; }
.wz-picks { display: flex; flex-wrap: wrap; gap: 8px; }
.wz-pick { padding: 10px 16px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: #fff; color: var(--carbon); font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; transition: translate .15s ease; }
.wz-pick:hover { translate: 0 -2px; }
.wz-pick[aria-pressed="true"] { background: var(--carbon); color: #fff; }
.wz-det-note { display: grid; gap: 6px; margin-top: 16px; font-size: 13px; font-weight: 800; }
.wz-det-note input { width: 100%; padding: 12px 16px; border: 1px solid var(--carbon); border-radius: 14px; background: #fff; font: inherit; font-size: 16px; font-weight: 500; }
.wz-item-det { font-weight: 700; }

/* Üstteki Devam et */
.wz-head { align-items: center; }
.wz-head .wz-count { margin-left: auto; }
.wz-next-top { padding: 8px 16px; font-size: 13px; }
.wz-next-top[hidden] { display: none; }

/* İşler başlığı: sarı etiket iki satıra bölününce satırlar üst üste binmesin; tek kutu olarak durur */
.show-hook-big mark { display: inline-block; max-width: 100%; padding: .1em .3em .16em; line-height: 1.08; text-wrap: balance; -webkit-box-decoration-break: slice; box-decoration-break: slice; }

/* Dokunmatik kaydırma: kart kaydırıcısı titremesin */
.carousel { -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; touch-action: pan-x pan-y; }
.c-card { -webkit-transform: translateZ(0); transform: translateZ(0); }
@media (hover: none) { .c-card, .c-card:hover { transition: none; } .c-card:hover { rotate: none; } }

/* Konum haritası: harita sitenin renklerine boyanır */
.blk-map { padding-block: clamp(32px, 5vw, 72px); }
.map-wrap { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: clamp(20px, 3vw, 40px); align-items: center; }
.map-card { position: relative; display: block; aspect-ratio: 4 / 3; border: 2px solid var(--carbon); border-radius: calc(var(--r-card) * 1.2); overflow: hidden; background: var(--mint); isolation: isolate; }
.map-frame, .map-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.map-frame iframe { pointer-events: none; filter: grayscale(1) contrast(1.15) brightness(1.05); }
.map-tint { position: absolute; inset: 0; background: var(--mint); mix-blend-mode: multiply; pointer-events: none; }
.map-pin { position: absolute; left: 50%; top: 50%; translate: -50% -100%; display: grid; justify-items: center; gap: 0; pointer-events: none; }
.map-pin b { padding: 8px 14px; border: 2px solid var(--carbon); border-radius: var(--r-pill); background: var(--sun); font-size: 14px; font-weight: 900; letter-spacing: .02em; text-transform: uppercase; white-space: nowrap; rotate: -3deg; }
.map-pin i { width: 22px; height: 22px; margin-top: 6px; border: 3px solid var(--carbon); border-radius: 50% 50% 50% 0; rotate: -45deg; background: var(--ember); }
.map-card:hover .map-pin i { translate: 0 -4px; }
.map-pin i { transition: translate .25s ease; }
.map-info p { margin-block: 0 18px; }
.map-btn { display: inline-flex; }
@media (max-width: 800px) { .map-wrap { grid-template-columns: 1fr; } .map-card { aspect-ratio: 1 / 1; } }

/* Alt bilgi konum kartı */
.sf-map { position: relative; display: block; width: min(340px, 100%); aspect-ratio: 16 / 10; margin-top: 20px; border: 2px solid var(--ft, #fff); border-radius: var(--r-card); overflow: hidden; background: var(--mint); isolation: isolate; }
.sf-map .map-pin b { padding: 5px 10px; font-size: 11px; border-width: 2px; }
.sf-map .map-pin i { width: 16px; height: 16px; margin-top: 4px; border-width: 2px; }

/* Konum haritası: kutusuz, sitenin çizgi diliyle; kenarları yumuşakça silinir */
.map-card, .sf-map { border: 0 !important; border-radius: 0 !important; background: none !important; overflow: visible; }
.map-card { aspect-ratio: 4 / 3; }
.map-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; -webkit-mask-image: radial-gradient(ellipse 72% 72% at 50% 50%, #000 52%, transparent 100%); mask-image: radial-gradient(ellipse 72% 72% at 50% 50%, #000 52%, transparent 100%); pointer-events: none; }
.sf-map { width: min(380px, 100%); aspect-ratio: 4 / 3; }
.sf-map .map-pin b { background: var(--sun); color: #000; }

/* Alt bilgi haritası: daha az yüksek, footer şişmesin */
.sf-map { width: min(320px, 100%); aspect-ratio: 16 / 7; margin-top: 14px; }
.sf-map .map-img { -webkit-mask-image: radial-gradient(ellipse 78% 82% at 50% 50%, #000 50%, transparent 100%); mask-image: radial-gradient(ellipse 78% 82% at 50% 50%, #000 50%, transparent 100%); }

/* Ana sayfa: Ürün fotoğrafları kartı gerçek çekimle */
.show-photo.has-img { padding: 0; background: var(--paper); aspect-ratio: 4 / 5; }
.show-photo-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.show-photo.has-img .show-photo-cap { position: absolute; left: 12px; right: 12px; bottom: 12px; display: grid; gap: 6px; justify-items: start; padding: 10px 12px; background: var(--paper); border: 1px solid var(--carbon); border-radius: calc(var(--r-card) * .8); }
.show-photo.has-img .show-photo-cap b { font-size: clamp(18px, 2vw, 22px); }

.show-photo-img { opacity: 0; transition: opacity .6s ease; }
.show-photo-img.on { opacity: 1; }

/* Haritanın altındaki şehir yazısı */
.map-col { display: grid; gap: 10px; }
.map-city, .sf-city { margin: 0; font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.sf-city { margin-top: 6px; color: var(--ft, #fff); }
.map-city { text-align: center; }

.map-city, .sf-city { font-style: italic; font-weight: 900; }

@media (max-width: 700px) { .statement { padding-top: 72px; } }

/* Mobil: Anahtar teslim başlığında İ noktası üstteki satıra çarpmasın */
@media (max-width: 700px) { .hero h2[data-intro] { line-height: 1.07 !important; } }

/* Başlık harfleri: İ / Ö / Ü noktaları satır kutusunun üstüne taşar; iOS Safari harf katmanını kutu sınırında kesiyordu. Katman yukarı doğru genişletilir (satır yüksekliği değişmez) */
.rl, .rl > .rc { padding-top: .24em; margin-top: -.24em; }
.rw { padding-top: .02em; }


/* Mobil: ana sayfa başlığında efekt yok (harf süzülmesi kapalı) */
@media (max-width: 700px) { html.mo-idle [data-intro].ready .rl { animation: none !important; will-change: auto; } }


/* Gülen yüz: alt bilgideki büyük yazının en alt tarafında */
.sf-bigwrap { position: relative; }
.sf-coin { z-index: 2; cursor: pointer; }

/* Ana sayfada H1 = logo (marka adı); hero büyük başlığı H2 */
.logo-h1 { margin: 0; font: inherit; display: flex; flex: none; align-items: center; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* Hizmetler sayfası: başlık harfleri birbirine girmesin */
.pg-loose .display { letter-spacing: -0.03em; }
.pg-loose .k-card h3.display { line-height: calc(1em + 2mm); }

/* Hizmetler: başlıklarda alt-üst satır aralığı yalnızca 0,2 mm */
.pg-loose h1.display, .pg-loose h2.display, .pg-loose h3.display, .pg-loose .k-card h3.display { line-height: calc(.95em + .2mm) !important; }

/* Hizmet sepeti (Hizmetler sayfası) */
#top { position: relative; }
.cart-add { align-self: flex-start; margin-top: 14px; padding: 9px 16px; border: 2px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); color: var(--carbon); font: inherit; font-size: 14px; font-weight: 800; cursor: pointer; transition: translate .15s ease, background .15s ease; position: relative; z-index: 3; }
.cart-add:hover { translate: 0 -2px; }
.cart-add[aria-pressed="true"] { background: var(--carbon); color: #fff; }
.k-card .cart-add { margin-top: auto; }
.cart-rail { position: absolute; left: 0; width: 68px; z-index: 40; pointer-events: none; }
.cart-fab { pointer-events: auto; position: sticky; top: 120px; display: grid; place-items: center; width: 68px; height: 68px; padding: 0; border: 3px solid var(--carbon); border-radius: 50%; background: var(--sun); cursor: pointer; transition: translate .2s ease, background .2s ease; }
.cart-fab:hover { translate: 0 -3px; background: var(--mint); }
.cart-fab.has-items { background: var(--mint); }
.cart-fab svg { width: 36px; height: 36px; }
.cart-count { position: absolute; right: -6px; top: -6px; min-width: 26px; height: 26px; padding: 0 6px; display: grid; place-items: center; border: 2px solid var(--carbon); border-radius: 99px; background: var(--ember); color: #fff; font-size: 13px; font-weight: 900; }
.cart-count[hidden] { display: none; }
.cart-tip { position: absolute; right: 78px; top: 50%; translate: 0 -50%; padding: 6px 12px; border: 2px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); font-size: 12px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; opacity: 0; pointer-events: none; transition: opacity .2s ease; white-space: nowrap; }
.cart-fab:hover .cart-tip, .cart-fab:focus-visible .cart-tip { opacity: 1; }
.cart-back { position: fixed; inset: 0; z-index: 90; background: rgba(0, 0, 0, .45); }
.cart-panel { position: fixed; z-index: 91; top: 0; right: 0; bottom: 0; width: min(460px, 100vw); display: flex; flex-direction: column; gap: 14px; padding: 20px; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; background: var(--paper); border-left: 3px solid var(--carbon); }
.cart-panel[hidden], .cart-back[hidden] { display: none; }
.cart-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cart-title { margin: 0; font-size: clamp(30px, 5vw, 44px); line-height: .95; font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: -.02em; }
.cart-close { width: 44px; height: 44px; border: 2px solid var(--carbon); border-radius: 50%; background: #fff; font-size: 26px; line-height: 1; cursor: pointer; }
.cart-list { display: grid; gap: 10px; }
.cart-group { padding: 12px; border: 2px solid var(--carbon); border-radius: var(--r-card); background: var(--sky); }
.cart-gname { margin: 0 0 8px; font-size: 13px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.cart-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; margin-bottom: 6px; border: 1px solid var(--carbon); border-radius: 12px; background: #fff; }
.cart-item { font-size: 15px; font-weight: 700; line-height: 1.3; }
.cart-rm { flex: none; padding: 5px 10px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.cart-empty { margin: 0; padding: 14px 16px; border: 2px dashed var(--carbon); border-radius: var(--r-card); font-size: 15px; line-height: 1.5; font-weight: 600; }
.cart-form { display: grid; gap: 10px; }
.cart-form[hidden], .cart-list[hidden], .cart-empty[hidden] { display: none; }
.cart-lead { margin: 0; font-size: 15px; font-weight: 700; }
.cart-form label:not(.cart-consent) { display: grid; gap: 4px; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; }
.cart-form input:not([type="checkbox"]), .cart-form textarea { width: 100%; padding: 11px 14px; border: 1px solid var(--carbon); border-radius: 12px; background: #fff; font: inherit; font-size: 16px; font-weight: 500; text-transform: none; letter-spacing: 0; }
.cart-hp { position: absolute; left: -9999px; opacity: 0; }
.cart-consent { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.45; font-weight: 500; }
.cart-consent input { margin-top: 3px; width: 18px; height: 18px; flex: none; accent-color: var(--carbon); }
.cart-consent a { text-decoration: underline; }
.cart-send { padding: 14px 20px; border: 2px solid var(--carbon); border-radius: var(--r-pill); background: var(--carbon); color: #fff; font: inherit; font-size: 16px; font-weight: 900; cursor: pointer; }
.cart-send:disabled { opacity: .45; cursor: wait; }
.cart-status { min-height: 20px; margin: 0; font-size: 14px; font-weight: 700; }
.cart-status.err { color: #b3261e; }
html.cart-open { overflow: hidden; }
@media (max-width: 900px) { .cart-rail { position: fixed !important; top: auto !important; height: auto !important; right: auto; left: 14px; bottom: 18px; } .cart-fab { position: static; width: 60px; height: 60px; } .cart-tip { display: none; } }

.cart-go { padding: 14px 20px; border: 2px solid var(--carbon); border-radius: var(--r-pill); background: var(--carbon); color: #fff; font: inherit; font-size: 16px; font-weight: 900; cursor: pointer; }
.cart-go[hidden] { display: none; }
.cart-backlink { justify-self: start; padding: 6px 12px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); font: inherit; font-size: 13px; font-weight: 800; cursor: pointer; }

/* /sepet sayfası */
.blk-cartpage { padding-block: clamp(28px, 4vw, 64px); }
.cp-sum { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 0 0 22px; padding: 20px 24px; border: 2px solid var(--carbon); border-radius: var(--r-card); background: var(--mint); }
.cp-sum small { font-size: 12px; font-weight: 800; letter-spacing: .06em; }
.cp-sum strong { font-size: clamp(26px, 4vw, 44px); line-height: .95; font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: -.02em; }
.cp-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(18px, 3vw, 36px); align-items: start; }
.cp-h { margin: 0 0 14px; font-size: clamp(28px, 4vw, 48px); line-height: .95; font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: -.02em; }
.cp-group { margin: 0 0 12px; padding: 16px; border: 2px solid var(--carbon); border-radius: var(--r-card); background: var(--sky); }
.cp-group[data-i="1"] { background: var(--mint); } .cp-group[data-i="2"] { background: var(--lavender); } .cp-group[data-i="3"] { background: var(--sun); }
.cp-gname { margin: 0 0 10px; font-size: 13px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.cp-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; margin-bottom: 8px; border: 1px solid var(--carbon); border-radius: 14px; background: #fff; }
.cp-item { font-size: 16px; font-weight: 700; line-height: 1.3; }
.cp-rm { flex: none; padding: 6px 12px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.cp-more { display: inline-block; margin-top: 4px; padding: 10px 18px; border: 2px dashed var(--carbon); border-radius: var(--r-pill); font-weight: 800; text-decoration: none; }
.cp-more:hover { background: var(--sun); }
.cp-side { padding: 20px; border: 2px solid var(--carbon); border-radius: var(--r-card); background: var(--lavender); }
.cp-form { display: grid; gap: 10px; }
.cp-lead { margin: 0; font-size: 15px; font-weight: 700; }
.cp-form label:not(.cp-consent) { display: grid; gap: 4px; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; }
.cp-form input:not([type="checkbox"]), .cp-form textarea { width: 100%; padding: 12px 14px; border: 1px solid var(--carbon); border-radius: 12px; background: #fff; font: inherit; font-size: 16px; font-weight: 500; text-transform: none; letter-spacing: 0; }
.cp-form textarea { resize: vertical; }
.cp-consent { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.45; font-weight: 500; }
.cp-consent input { margin-top: 3px; width: 18px; height: 18px; flex: none; accent-color: var(--carbon); }
.cp-consent a { text-decoration: underline; }
.cp-send { padding: 15px 22px; border: 2px solid var(--carbon); border-radius: var(--r-pill); background: var(--carbon); color: #fff; font: inherit; font-size: 17px; font-weight: 900; cursor: pointer; }
.cp-send:disabled { opacity: .45; cursor: wait; }
.cp-status { min-height: 20px; margin: 0; font-size: 14px; font-weight: 700; }
.cp-status.err { color: #b3261e; }
.cp-empty, .cp-done { margin: 0 0 18px; padding: 24px; border: 2px dashed var(--carbon); border-radius: var(--r-card); font-size: 17px; font-weight: 600; line-height: 1.5; }
.cp-done { border-style: solid; background: var(--sun); } .cp-done h2 { margin: 0 0 8px; font-size: clamp(30px, 4vw, 48px); font-style: italic; text-transform: uppercase; }
.cp-related { margin-top: clamp(32px, 5vw, 64px); }
.cp-works { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.cp-work { position: relative; display: grid; align-content: end; gap: 6px; min-height: 220px; padding: 14px; overflow: hidden; border: 2px solid var(--carbon); border-radius: var(--r-card); background: var(--sky); color: var(--carbon); text-decoration: none; transition: translate .2s ease; }
.cp-work[data-i="1"] { background: var(--mint); } .cp-work[data-i="2"] { background: var(--lavender); } .cp-work[data-i="3"] { background: var(--sun); }
.cp-work:hover { translate: 0 -4px; }
.cp-work img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cp-work-l, .cp-work-t { position: relative; justify-self: start; padding: 5px 10px; border: 1px solid var(--carbon); border-radius: 10px; background: var(--paper); }
.cp-work-l { font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.cp-work-t { font-size: 16px; font-weight: 900; line-height: 1.2; }
@media (max-width: 900px) { .cp-grid { grid-template-columns: 1fr; } .cp-works { grid-template-columns: 1fr; } .cp-work { min-height: 180px; } }

/* Sepet sayfası: hizmet açıklaması, üzerine gelince sarı bar */
.cp-row { align-items: flex-start; transition: background .15s ease, translate .15s ease; }
.cp-row:hover { background: var(--sun); }
.cp-info { display: grid; gap: 4px; min-width: 0; }
.cp-desc { margin: 0; font-size: 14px; line-height: 1.45; font-weight: 500; }
.cp-row .cp-rm { margin-top: 2px; }

/* Sepet sayfası: satıra tıklayınca hizmetin içeriği altta açılır */
.cp-toggle { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.cp-toggle:disabled { cursor: default; }
.cp-chev { flex: none; font-style: normal; font-size: 16px; transition: rotate .2s ease; }
.cp-toggle[aria-expanded="true"] .cp-chev { rotate: 180deg; }
.cp-desc[hidden] { display: none; }
.cp-desc { padding-top: 6px; border-top: 1px dashed var(--carbon); margin-top: 4px; }
.cp-row { cursor: pointer; }

.cp-chev { display: none; }

.cp-chev { display: inline-block; }
.cp-row.open .cp-chev { rotate: 180deg; }

/* Ekmek kırıntısı (sayfa yolu) */
.crumbs { position: relative; z-index: 3; margin: 0 0 14px; }
.crumbs ol { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 0; padding: 0; list-style: none; font-size: 13px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.crumbs li + li::before { content: "›"; margin-right: 6px; opacity: .6; }
.crumbs a { color: inherit; text-decoration: none; border-bottom: 1px solid transparent; }
.crumbs a:hover { border-bottom-color: currentColor; background: var(--sun); }
.crumbs [aria-current] { opacity: .75; }

/* Hizmet <-> iş bağlantıları */
.rel-works, .work-svc { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 22px 0 0; }
.rel-works .label, .work-svc .label { font-size: 12px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; opacity: .8; }
.rel-works a, .work-svc a { padding: 7px 14px; border: 1px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); color: var(--carbon); font-size: 14px; font-weight: 800; text-decoration: none; transition: background .15s ease; }
.rel-works a:hover, .work-svc a:hover { background: var(--sun); }


/* İş ortaklığı bölümü: ikas × The Goatz Studio */
.partner { position: relative; overflow: hidden; padding: clamp(44px, 6.5vw, 96px) clamp(18px, 4vw, 56px); background: var(--sun); color: var(--carbon); }
.partner-in { position: relative; z-index: 2; max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(26px, 4.5vw, 72px); align-items: center; }
.pt-lockup { display: flex; align-items: center; flex-wrap: wrap; gap: clamp(10px, 1.8vw, 22px); }
.pt-ikas { display: inline-flex; align-items: center; gap: .26em; padding: .12em .46em .16em .3em; border: 3px solid var(--carbon); border-radius: 999px; background: var(--violet); color: #fff; font-weight: 900; font-size: clamp(46px, 7.4vw, 108px); line-height: 1; letter-spacing: -.05em; rotate: -3deg; }
.pt-ikas i { width: .44em; height: .44em; border: 3px solid var(--carbon); border-radius: 50%; background: var(--sun); }
.pt-x { display: grid; place-items: center; width: clamp(44px, 5vw, 76px); aspect-ratio: 1; border: 3px solid var(--carbon); border-radius: 50%; background: #fff; font-size: clamp(26px, 3.4vw, 46px); font-weight: 900; line-height: 1; }
.pt-goatz { display: inline-flex; align-items: center; gap: .3em; padding: .1em .44em .1em .16em; border: 3px solid var(--carbon); border-radius: 999px; background: #fff; rotate: 2deg; }
.pt-goatz img { height: clamp(46px, 6.2vw, 90px); width: auto; display: block; }
.pt-goatz b { font-size: clamp(22px, 3.2vw, 46px); font-weight: 900; font-style: italic; line-height: .92; text-transform: uppercase; letter-spacing: -.03em; }
.pt-h { margin: clamp(20px, 2.6vw, 34px) 0 0; font-size: clamp(30px, 4.3vw, 62px); line-height: 1.02; font-weight: 900; font-style: italic; text-transform: uppercase; letter-spacing: -.03em; }
.pt-tag { display: inline-block; margin: 0 0 14px; padding: 6px 14px; border: 2px solid var(--carbon); border-radius: var(--r-pill); background: #fff; font-size: 13px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.pt-text { margin: 0 0 20px; font-size: clamp(18px, 1.9vw, 26px); line-height: 1.4; font-weight: 600; }
.pt-chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 24px; padding: 0; list-style: none; }
.pt-chips li { padding: 9px 16px; border: 2px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); font-size: 15px; font-weight: 800; line-height: 1.2; transition: translate .15s ease, background .15s ease; }
.pt-chips li:hover { translate: 0 -3px; background: var(--mint); }
.pt-chips li:nth-child(2):hover { background: var(--lavender); } .pt-chips li:nth-child(3):hover { background: var(--sky); }
.pt-btn { display: inline-flex; }
.pt-st { position: absolute; z-index: 1; height: auto; }
@media (max-width: 900px) { .partner-in { grid-template-columns: 1fr; } .pt-st { opacity: .9; } }

/* İş ortaklığı: ikas × The Goatz Studio tek satıra sığsın, daha dengeli */
.partner-in { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
.pt-lockup { flex-wrap: nowrap; }
.pt-ikas { font-size: clamp(38px, 5.6vw, 84px); }
.pt-x { width: clamp(38px, 4vw, 62px); font-size: clamp(22px, 2.8vw, 38px); flex: none; }
.pt-goatz img { height: clamp(38px, 4.8vw, 72px); }
.pt-goatz b { font-size: clamp(18px, 2.6vw, 38px); white-space: nowrap; }
.pt-h { font-size: clamp(30px, 4vw, 58px); }
@media (max-width: 700px) { .pt-lockup { flex-wrap: wrap; } .pt-ikas { font-size: clamp(44px, 16vw, 72px); } .pt-goatz img { height: 44px; } .pt-goatz b { font-size: 22px; } .pt-x { width: 44px; } }

/* İş ortaklığı: ikas × The Goatz Studio üstte tam genişlikte tek satır; altında başlık ve yazı yan yana */
.partner-in { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: start; row-gap: clamp(22px, 3vw, 40px); }
.pt-left { display: contents; }
.pt-lockup { grid-column: 1 / -1; flex-wrap: wrap; }
.pt-h { grid-column: 1; margin: 0; align-self: center; }
.pt-right { grid-column: 2; align-self: center; }
.pt-ikas { font-size: clamp(46px, 7.2vw, 108px); }
.pt-x { width: clamp(44px, 5vw, 76px); font-size: clamp(26px, 3.4vw, 46px); }
.pt-goatz img { height: clamp(46px, 6.2vw, 92px); }
.pt-goatz b { font-size: clamp(22px, 3.4vw, 50px); }
.pt-h { font-size: clamp(30px, 3.9vw, 56px); }
@media (max-width: 900px) { .partner-in { grid-template-columns: 1fr; } .pt-h, .pt-right { grid-column: 1; } }

/* İş ortaklığı: daha küçük; ikas rozeti Teklif Al'daki ikas ikonuyla aynı (yatık, sert gölge); iki işaretin etrafında nefes payı; Goatz gerçek logo + yazı */
.partner { padding: clamp(30px, 4.4vw, 62px) clamp(18px, 4vw, 56px); }
.partner-in { row-gap: clamp(18px, 2.4vw, 30px); }
.pt-lockup { align-items: center; gap: clamp(16px, 2.4vw, 32px); padding: 6px 0 12px; }
.pt-ikas { font-size: clamp(32px, 4.4vw, 64px); font-style: italic; letter-spacing: -.03em; gap: .32em; padding: .3em .62em .34em .46em; border-width: 3px; box-shadow: .07em .1em 0 var(--carbon); rotate: -3deg; }
.pt-ikas i { width: .46em; height: .46em; border-width: 3px; }
.pt-x { width: clamp(34px, 3.6vw, 54px); font-size: clamp(20px, 2.4vw, 32px); box-shadow: 3px 4px 0 var(--carbon); }
.pt-goatz { gap: .5em; padding: .34em .9em .34em .5em; border-width: 3px; background: #fff; box-shadow: 4px 6px 0 var(--carbon); rotate: 2deg; font-size: clamp(32px, 4.4vw, 64px); }
.pt-goatz img { height: 1.14em; width: auto; }
.pt-word { height: 1.02em; width: auto; color: var(--carbon); display: block; }
.pt-h { font-size: clamp(24px, 3vw, 44px); }
.pt-text { font-size: clamp(16px, 1.55vw, 21px); margin-bottom: 16px; }
.pt-chips { margin-bottom: 18px; gap: 8px; }
.pt-chips li { padding: 7px 14px; font-size: 14px; }
.pt-tag { margin-bottom: 10px; }
@media (max-width: 700px) { .pt-ikas, .pt-goatz { font-size: clamp(30px, 10vw, 44px); } .pt-lockup { gap: 14px; } }

/* İş ortaklığı: logo efektleri biraz daha belirgin (gölge, eğim, hafif süzülme, üzerine gelince kalkış) */
.pt-ikas { box-shadow: .1em .14em 0 var(--carbon); rotate: -4deg; transition: translate .25s ease, rotate .25s ease, box-shadow .25s ease; animation: pt-float 5.5s ease-in-out infinite; }
.pt-goatz { box-shadow: 6px 8px 0 var(--carbon); rotate: 3deg; transition: translate .25s ease, rotate .25s ease, box-shadow .25s ease; animation: pt-float 6.5s ease-in-out -2s infinite; }
.pt-x { box-shadow: 4px 5px 0 var(--carbon); transition: rotate .35s ease; }
.pt-lockup:hover .pt-x { rotate: 180deg; }
.pt-ikas:hover { translate: 0 -6px; rotate: -6deg; box-shadow: .13em .2em 0 var(--carbon); }
.pt-goatz:hover { translate: 0 -6px; rotate: 5deg; box-shadow: 8px 11px 0 var(--carbon); }
@keyframes pt-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -5px; } }
@media (prefers-reduced-motion: reduce) { .pt-ikas, .pt-goatz { animation: none; } }

/* İş ortaklığı başlığı: satırlar üst üste binmesin, aralarında 2 mm boşluk */
.pt-h { line-height: calc(.95em + 2mm); }

/* İş ortaklığı: ev -> gece, yıldız -> parlama */
.partner { transition: background .6s ease, color .6s ease; }
.partner.night { background: #161b44; color: #fff; }
.partner.night .pt-tag, .partner.night .pt-chips li { color: var(--carbon); }
.pt-sky { position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: 0; transition: opacity .6s ease; }
.partner.night .pt-sky { opacity: 1; }
.pt-sky b { position: absolute; width: 10px; height: 10px; background: #000; opacity: .45; clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); animation: pt-twinkle 1.6s ease-in-out infinite; }
.pt-sky b:nth-child(odd) { animation-delay: -.8s; width: 14px; height: 14px; }
.pt-moon { position: absolute; right: 16%; top: 8%; width: clamp(34px, 4vw, 56px); aspect-ratio: 1; border-radius: 50%; background: #fff6c8; border: 3px solid var(--carbon); box-shadow: inset -.45em -.1em 0 #e8dca0; }
@keyframes pt-twinkle { 50% { opacity: .25; scale: .6; } }
.pt-st { transition: filter .35s ease, scale .35s ease; }
.pt-st.glow { filter: drop-shadow(0 0 10px #fff) drop-shadow(0 0 26px #ffd731); scale: 1.18; animation: pt-glow 1s ease-in-out infinite alternate; }
.partner.night .st-pstore { filter: drop-shadow(0 0 18px #ffd731); }
@keyframes pt-glow { to { filter: drop-shadow(0 0 16px #fff) drop-shadow(0 0 40px #ffd731); } }

.pt-tag { background: var(--mint); }

/* İş ortaklığı: yazıların üstüne gelince yeşil vurgu */
.pt-h, .pt-text { transition: background-color .25s ease, color .25s ease; -webkit-box-decoration-break: clone; box-decoration-break: clone; border-radius: 10px; }
.pt-text { padding: 6px 10px; margin-left: -10px; margin-right: -10px; }
.pt-h:hover, .pt-text:hover { background: var(--mint); color: var(--carbon); }
.partner.night .pt-h:hover, .partner.night .pt-text:hover { background: var(--mint); color: var(--carbon); }
.pt-h, .pt-text { width: fit-content; max-width: 100%; }
.pt-text { padding: 2px 6px; margin-left: -6px; margin-right: 0; }

/* Yeşil vurgu kelime kelime (tüm alan değil) */
.pt-h:hover, .pt-text:hover, .partner.night .pt-h:hover, .partner.night .pt-text:hover { background: none; color: inherit; }
.pt-text { padding: 0; margin-left: 0; }
.pt-h .w, .pt-text .pw { border-radius: 8px; transition: background-color .2s ease, color .2s ease; }
.pt-h .w:hover, .pt-text .pw:hover, .partner.night .pt-h .w:hover, .partner.night .pt-text .pw:hover { background: var(--mint); color: var(--carbon); }

/* Gece: soldaki yıldız gece yıldızına dönüşür (soluk mavi-beyaz, parıldar) */
.partner .st-pstar { transition: filter .6s ease, scale .35s ease; }
.partner.night .st-pstar { filter: grayscale(.55) brightness(1.25) hue-rotate(160deg) drop-shadow(0 0 12px #cfe0ff); animation: pt-nstar 1.8s ease-in-out infinite alternate; }
@keyframes pt-nstar { to { filter: grayscale(.55) brightness(1.4) hue-rotate(160deg) drop-shadow(0 0 22px #e8f0ff); scale: 1.12; } }

.pt-sky b:nth-of-type(3n) { width: 7px; height: 7px; animation-delay: -.4s; }
.pt-sky b:nth-of-type(4n) { animation-duration: 2.2s; }

/* ---------- Gece / gündüz teması ---------- */
.theme-btn svg { width: 20px; height: 20px; }
.theme-btn .t-moon, html[data-theme="night"] .theme-btn .t-sun { display: none; }
html[data-theme="night"] .theme-btn .t-moon { display: block; }
body, .panel { transition: background-color .5s ease, color .5s ease; }
html[data-theme="night"] .panel:not(.site-footer)[style*="var(--paper)"], html[data-theme="night"] .panel:not(.site-footer)[style*="var(--sky)"] { --carbon: #f4f1e8; --paper: #161b44; color: #f4f1e8; }
html[data-theme="night"] .panel:not(.site-footer)[style*="var(--paper)"] { background: #161b44 !important; }
html[data-theme="night"] .panel:not(.site-footer)[style*="var(--sky)"] { background: #161b44 !important; }
/* renkli kartlar ve kutular gündüz renginde kalır */
html[data-theme="night"] .panel [style*="background:var(--"] { --carbon: #000; --paper: #fff; color: #000; }
html[data-theme="night"] .nav .logo, html[data-theme="night"] .nav .logo b { color: #f4f1e8; }
html[data-theme="night"] mark, html[data-theme="night"] .show-appcap, html[data-theme="night"] .c-face, html[data-theme="night"] .c-face * { color: #000; }
html[data-theme="night"] .rm-no { color: #12163a; }
html[data-theme="night"] .partner.night .pt-x { color: #000; }
html[data-theme="night"] .sf-city { color: #f4f1e8 !important; }
.ns { display: none; position: absolute; inset: 0; z-index: -1; pointer-events: none; }
html[data-theme="night"] .panel:has(> .ns), html[data-theme="night"] .site-footer { isolation: isolate; }
html[data-theme="night"] .ns { display: block; }
.ns b { position: absolute; background: #ffd731; clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); animation: pt-twinkle 1.8s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .ns b { animation: none; } }

html[data-theme="night"] .logo.has-word .logo-word { color: #fff !important; }
.ns-moon { display: none; position: absolute; z-index: -1; top: calc(50% - 23vw); left: calc(50% + 23vw); translate: -50% 0; width: clamp(80px, 11vw, 170px); aspect-ratio: 1; border-radius: 50%; background: #14162b; border: 4px solid #000; box-shadow: 0 0 40px rgba(255, 246, 200, .5); cursor: pointer; pointer-events: auto; }
.ns-moon canvas { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 50%; display: block; }
@keyframes ns-moon-glow { 50% { box-shadow: 0 0 70px 6px rgba(255, 246, 200, .8); } }
html[data-theme="night"] .ns-moon { display: block; animation: ns-moon-in .8s ease both, ns-moon-glow 3.5s ease-in-out .8s infinite; }
@keyframes ns-moon-in { from { opacity: 0; scale: .5; } }
/* İş ortaklığı paneli: site gecedeyken kendisi de gece (tema ile birlikte) */
html[data-theme="night"] .partner .pt-x { color: #000; }
/* Gece teması: mini uzay gemileri ve çatışma */
.ns-ship { position: absolute; display: block; opacity: .92; }
.ns-ship svg { display: block; }
.ns-shot { position: absolute; width: 12px; height: 2.5px; border-radius: 2px; box-shadow: 0 0 6px 1px currentColor; }
.ns-boom { position: absolute; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; background: radial-gradient(circle, #fff 0 30%, #ffd731 31% 60%, #fb4903 61%); }
.ns-spark { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: #ffd731; }

/* Mekikler: motor alevi, süzülme sallantısı */
.ns-wob { display: block; position: relative; }
.ns-fl { position: absolute; right: 94%; top: 50%; width: 14px; height: 5px; margin-top: -2.5px; border-radius: 50% 0 0 50%; background: linear-gradient(90deg, rgba(251,73,3,0), #fb4903 45%, #ffd731); transform-origin: right center; animation: ns-flame .18s ease-in-out infinite alternate; }
@keyframes ns-flame { from { scale: .6 .8; opacity: .7; } to { scale: 1.2 1; opacity: 1; } }
.ns-glow { position: absolute; left: 20%; right: 20%; top: 80%; height: 6px; border-radius: 50%; background: radial-gradient(closest-side, rgba(180, 230, 255, .8), rgba(180, 230, 255, 0)); animation: ns-flame .9s ease-in-out infinite alternate; }
.ns-lvl { display: block; rotate: var(--cr, 0deg); }
.ns-trail { position: absolute; right: calc(100% - 4px); top: 50%; width: 52px; height: 1px; background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .4)); pointer-events: none; }
/* Gece: teklif sihirbazı seçenek kartları (renkli kartlarda siyah yazı) */
html[data-theme="night"] .wz-choice, html[data-theme="night"] .wz-choice * { color: #000; }
html[data-theme="night"] .wz-choice[aria-pressed="true"], html[data-theme="night"] .wz-choice[aria-pressed="true"] * { color: #fff; }
html[data-theme="night"] .wz-choice[aria-pressed="true"] { background: #000; }
html[data-theme="night"] .wz-choice[aria-pressed="true"] .wz-mark { background: var(--sun); color: #000; }
html[data-theme="night"] .wz-choice .wz-ikas, html[data-theme="night"] .wz-choice .wz-ikas * { color: #fff; }
/* Dar telefonlarda menü (logo + tema + menü + Teklif Al) ekrana sığsın */
@media (max-width: 430px) {
  .nav { left: 10px; right: 10px; }
  .nav-right { gap: 3px; min-width: 0; }
  .nav-right .icon-btn { width: 36px; height: 36px; font-size: 20px; }
  .nav-right .btn.solid { padding: 10px 13px; font-size: 12px; }
  .logo.has-word .logo-word { height: calc(var(--logo, 44px) * .8); width: calc(var(--logo, 44px) * .8 * 2.87); }
}

.cart-clear { justify-self: start; padding: 9px 16px; border: 2px solid var(--carbon); border-radius: var(--r-pill); background: var(--paper); font: inherit; font-size: 14px; font-weight: 800; cursor: pointer; }
.cart-clear:hover { background: var(--ember); color: #fff; }
.cart-clear[hidden] { display: none; }

/* Yan sepet: her bölümün ayrı rengi */
.cart-group[data-i="0"] { background: var(--lavender); }
.cart-group[data-i="1"] { background: var(--mint); }
.cart-group[data-i="2"] { background: var(--sun); }
.cart-group[data-i="3"] { background: var(--blue); }
.cart-group[data-i="4"] { background: var(--ember); }
.cart-group[data-i="5"] { background: var(--sky); }

/* İkon başlığın üstüne binmesin: ikon için üstte yer ayrılır */
.k-card:has(> .k-st) { padding-top: 116px; }

/* Hizmetler: her ana kategori kendi renk grubunda, alt hizmetler o rengin tonlarında */
.blk-cards[data-g] .k-card { background: color-mix(in srgb, var(--gb) calc(100% - var(--tw, 0%)), var(--tc, #fff)) !important; }
.blk-cards[data-g] .k-card[data-t="0"] { --tw: var(--w0, 0%); }
.blk-cards[data-g] .k-card[data-t="1"] { --tw: var(--w1, 22%); }
.blk-cards[data-g] .k-card[data-t="2"] { --tw: var(--w2, 40%); }
.blk-cards[data-g] .k-card[data-t="3"] { --tw: var(--w3, 56%); }
.blk-cards[data-g="0"] { --gb: var(--blue); }
.blk-cards[data-g="1"] { --gb: var(--sun); }
.blk-cards[data-g="2"] { --gb: var(--mint); }
.blk-cards[data-g="3"] { --gb: var(--lavender); --tc: var(--violet); --w1: 9%; --w2: 18%; --w3: 27%; }
.blk-cards[data-g="4"] { --gb: var(--ember); }
.blk-cards[data-g="5"] { --gb: var(--violet); --w0: 38%; --w1: 52%; --w2: 64%; --w3: 76%; }
.blk-cards[data-g="6"] { --gb: color-mix(in srgb, var(--ember) 45%, var(--lavender)); }
.blk-cards[data-g="7"] { --gb: color-mix(in srgb, var(--mint) 50%, var(--blue)); }
.cart-group[data-i="0"] { background: color-mix(in srgb, var(--blue) 80%, #fff); }
.cart-group[data-i="1"] { background: color-mix(in srgb, var(--sun) 80%, #fff); }
.cart-group[data-i="2"] { background: color-mix(in srgb, var(--mint) 80%, #fff); }
.cart-group[data-i="3"] { background: var(--lavender); }
.cart-group[data-i="4"] { background: color-mix(in srgb, var(--ember) 75%, #fff); }
.cart-group[data-i="5"] { background: color-mix(in srgb, var(--violet) 45%, #fff); }
.cart-group[data-i="6"] { background: color-mix(in srgb, color-mix(in srgb, var(--ember) 45%, var(--lavender)) 80%, #fff); }
.cart-group[data-i="7"] { background: color-mix(in srgb, color-mix(in srgb, var(--mint) 50%, var(--blue)) 80%, #fff); }
/* Tonlar sıralı değil karışık: her grupta açık ve koyu tonlar iç içe */
.blk-cards[data-g="0"] { --w0: 40%; --w1: 0%; --w2: 56%; --w3: 22%; }
.blk-cards[data-g="1"] { --w0: 22%; --w1: 56%; --w2: 0%; --w3: 40%; }
.blk-cards[data-g="2"] { --w0: 0%; --w1: 40%; --w2: 22%; --w3: 56%; }
.blk-cards[data-g="3"] { --w0: 18%; --w1: 0%; --w2: 27%; --w3: 9%; }
.blk-cards[data-g="4"] { --w0: 56%; --w1: 22%; --w2: 40%; --w3: 0%; }
.blk-cards[data-g="5"] { --w0: 64%; --w1: 38%; --w2: 76%; --w3: 52%; }
.blk-cards[data-g="6"] { --w0: 30%; --w1: 0%; --w2: 50%; --w3: 15%; }
.blk-cards[data-g="7"] { --w0: 0%; --w1: 45%; --w2: 20%; --w3: 56%; }
/* Hizmetler: kart ızgarası, buton ve "ilgili işler" satırı birbirine yapışmasın */
.blk-cards .blk-in > .btn { margin-top: 28px; }
.blk-cards .blk-in > .rel-works { margin-top: 22px; gap: 10px; }
.blk-cards .blk-in > .btn + .rel-works { margin-top: 24px; }
.blk-cards .blk-in > .rel-works:last-child { margin-bottom: 8px; }

/* Hizmetler: tüm başlıklar sağa yatık */
.blk-cards[data-g] h2, .blk-cards[data-g] h2 .w, .blk-cards[data-g] h2 .ch { font-style: italic; }
/* Hizmetler, gündüz teması: bölüm zemini grubunun rengine uygun açık ton (beyaz-mavi-beyaz-mavi gitmesin) */
html:not([data-theme="night"]) .blk-cards[data-g] { background: color-mix(in srgb, var(--gb) var(--pt, 16%), #fff) !important; }
.blk-cards[data-g="1"] { --pt: 22%; }
.blk-cards[data-g="3"] { --pt: 42%; }
.blk-cards[data-g="5"] { --pt: 14%; }

/* Hizmetler: sol mini filtre ve (dar ekranda) alttaki kategori çubuğu */
.svc-bar a, .svc-rail a { --gb: var(--blue); }
.svc-rail a[data-g="0"], .svc-bar a[data-g="0"], .svc-bar[data-g="0"] { --gb: var(--blue); }
.svc-rail a[data-g="1"], .svc-bar a[data-g="1"], .svc-bar[data-g="1"] { --gb: var(--sun); }
.svc-rail a[data-g="2"], .svc-bar a[data-g="2"], .svc-bar[data-g="2"] { --gb: var(--mint); }
.svc-rail a[data-g="3"], .svc-bar a[data-g="3"], .svc-bar[data-g="3"] { --gb: var(--lavender); }
.svc-rail a[data-g="4"], .svc-bar a[data-g="4"], .svc-bar[data-g="4"] { --gb: var(--ember); }
.svc-rail a[data-g="5"], .svc-bar a[data-g="5"], .svc-bar[data-g="5"] { --gb: color-mix(in srgb, var(--violet) 55%, #fff); }
.svc-rail a[data-g="6"], .svc-bar a[data-g="6"], .svc-bar[data-g="6"] { --gb: color-mix(in srgb, var(--mint) 50%, var(--blue)); }
.svc-rail a[data-g="7"], .svc-bar a[data-g="7"], .svc-bar[data-g="7"] { --gb: color-mix(in srgb, var(--ember) 45%, var(--lavender)); }
.svc-bar { position: fixed; z-index: 45; left: 50%; bottom: 18px; translate: -50% 0; max-width: calc(100vw - 180px); padding: 6px; border: 2px solid #000; border-radius: var(--r-pill); background: color-mix(in srgb, var(--gb, var(--blue)) 55%, #fff); color: #000; transition: background .35s ease; }
.svc-bar[hidden] { display: none; }
.svc-bar-track { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.svc-bar-track::-webkit-scrollbar { display: none; }
.svc-bar a { flex: none; padding: 8px 14px; border: 2px solid transparent; border-radius: var(--r-pill); color: #000; text-decoration: none; font-weight: 800; font-size: 13px; white-space: nowrap; transition: background .2s ease, border-color .2s ease; }
.svc-bar a:hover { border-color: #000; }
.svc-bar a.on { background: var(--gb); border-color: #000; }
.blk-cards[data-g] { scroll-margin-top: 84px; }
@media (max-width: 900px) { .svc-bar { max-width: calc(100vw - 150px); bottom: 14px; } }

@media (min-width: 1200px) { .svc-bar { display: none; } }

/* Sol kategori filtresi: alt alta liste, her biri kendi çerçevesinde; hafifçe süzülür. Kartlar ona yer açmak için içeri alınır (siyah boşluk yok) */
@media (min-width: 1200px) { .blk-cards[data-g] .blk-in { padding-left: calc(clamp(16px, 4vw, 48px) + 236px); } }
.svc-rail-wrap { position: absolute; z-index: 45; left: 30px; width: 280px; pointer-events: none; }
.svc-rail { position: sticky; top: 130px; display: grid; gap: 8px; justify-items: start; pointer-events: none; }
.svc-rail[hidden] { display: none; }
.svc-rail a { --fc: var(--paper); display: block; padding: 8px 15px; white-space: nowrap; border: 2px solid var(--carbon, #000); border-radius: var(--r-pill, 1600px); background: var(--fc); color: #000; text-decoration: none; font-weight: 800; font-size: 11.5px; line-height: 1.2; text-align: left; pointer-events: auto; transition: transform .15s ease, background .15s ease, color .15s ease; position: relative; transform-origin: 20% 50%; animation: svc-float var(--t, 9s) ease-in-out infinite alternate; animation-delay: var(--d, 0s); }
.svc-rail .v { display: block; }
.svc-rail a:hover { transform: translateY(-2px); }
@keyframes svc-float { 0% { translate: 0 calc(var(--amp, 3px) * -1); rotate: calc(var(--rot, 2deg) * -1); } 50% { translate: calc(var(--sx, 3px) * -1) 0; rotate: 0deg; } 100% { translate: var(--sx, 3px) var(--amp, 3px); rotate: var(--rot, 2deg); } }
@media (prefers-reduced-motion: reduce) { .svc-rail a { animation: none; } }
@media (max-width: 1199px) { .svc-rail-wrap { display: none; } }
/* Gece: koyu çerçeveler, açık yazı */



/* Filtre kapsülleri: sitenin düz renkleri */
.svc-rail a[data-g="0"] { --fc: var(--blue); }
.svc-rail a[data-g="1"] { --fc: var(--sun); }
.svc-rail a[data-g="2"] { --fc: var(--mint); }
.svc-rail a[data-g="3"] { --fc: var(--lavender); }
.svc-rail a[data-g="4"] { --fc: var(--ember); }
.svc-rail a[data-g="5"] { --fc: color-mix(in srgb, var(--violet) 62%, #fff); }
.svc-rail a[data-g="6"] { --fc: color-mix(in srgb, var(--ember) 45%, var(--lavender)); }
.svc-rail a[data-g="7"] { --fc: color-mix(in srgb, var(--mint) 50%, var(--blue)); }

/* Aktif kategori siyaha dönmez: kendi renginde kalır, biraz öne çıkar ve çerçevesi kalınlaşır */

/* İlgili işler ve sayfalar: üzerine gelince sitenin sarısı, yazı hep siyah (gece modunda da) */
.rel-works a:hover, .work-svc a:hover { background: var(--sun); color: #000; border-color: #000; }

/* Filtre: sol kenarlar aynı hizada, dış çerçeve ve yazılar gündüz de gece de siyah; bulunulan kategori yalnız kalın çerçeveyle ayrılır */
.svc-rail a, html[data-theme="night"] .svc-rail a { border-color: #000; color: #000; }
.svc-rail a.on { border-width: 3px; padding: 7px 14px; font-weight: 900; transform: none; }
.svc-rail a.on:hover { transform: translateY(-2px); }
/* Telefon / dar ekran: alttaki kategori çubuğu da aynı kapsül görünümünde (tıklayınca gider) */
.svc-bar { padding: 0; border: 0; background: transparent !important; max-width: calc(100vw - 150px); }
.svc-bar-track { gap: 6px; padding: 2px; }
.svc-bar a { --fc: var(--paper); flex: none; padding: 8px 15px; border: 2px solid #000; border-radius: var(--r-pill, 1600px); background: var(--fc); color: #000; font-weight: 800; font-size: 12px; line-height: 1.2; text-transform: none; letter-spacing: 0; white-space: nowrap; }
.svc-bar a.on { border-width: 3px; padding: 7px 14px; font-weight: 900; background: var(--fc); }
.svc-bar a:hover { border-color: #000; }
.svc-bar a[data-g="0"] { --fc: var(--blue); }
.svc-bar a[data-g="1"] { --fc: var(--sun); }
.svc-bar a[data-g="2"] { --fc: var(--mint); }
.svc-bar a[data-g="3"] { --fc: var(--lavender); }
.svc-bar a[data-g="4"] { --fc: var(--ember); }
.svc-bar a[data-g="5"] { --fc: color-mix(in srgb, var(--violet) 62%, #fff); }
.svc-bar a[data-g="6"] { --fc: color-mix(in srgb, var(--ember) 45%, var(--lavender)); }
.svc-bar a[data-g="7"] { --fc: color-mix(in srgb, var(--mint) 50%, var(--blue)); }


/* Hizmet kartı başlıkları: uzun kelime ("Koordinasyonu") kart genişliğine sığsın, kenarda kesilmesin */
.blk-cards[data-g] .k-card h3 { font-size: clamp(22px, 2.35vw, 36px); overflow-wrap: break-word; }
@media (max-width: 1199px) { .blk-cards[data-g] .k-card h3 { font-size: clamp(26px, 3vw, 40px); } }
@media (max-width: 480px) { .blk-cards[data-g] .k-card h3 { font-size: clamp(24px, 7.2vw, 32px); } }
/* Filtre girişi/çıkışı: soldan sırayla çıkıp yerine gelir, çıkarken sola doğru kayıp kaybolur (bulanıklık ve büyüme yok) */
.svc-rail a { opacity: 0; scale: 1; filter: none; left: -120px; pointer-events: none; transition: transform .15s ease, background .15s ease, color .15s ease, opacity .35s ease, left .45s cubic-bezier(.5, 0, .9, .5); }
.svc-rail.show a { opacity: 1; scale: 1; filter: none; left: 0; pointer-events: auto; transition: transform .15s ease, background .15s ease, color .15s ease, opacity .7s ease calc(var(--k, 0) * 90ms), left 1s cubic-bezier(.16, .84, .3, 1) calc(var(--k, 0) * 90ms); }
@media (prefers-reduced-motion: reduce) { .svc-rail a, .svc-rail.show a { left: 0; transition: opacity .2s ease; } }

/* Sepet konuşma balonu: sepette ürün varken ara ara sepetin solunda, üst kısmında belirir; çerçevesi siyah */
.cart-bubble { position: absolute; right: 76px; top: -18px; padding: 8px 14px; border: 2px solid #000; border-radius: 16px; background: #fff; color: #000; font-family: inherit; font-size: 13px; font-weight: 800; line-height: 1.2; white-space: nowrap; opacity: 0; scale: .7; transform-origin: 100% 100%; pointer-events: none; transition: opacity .3s ease, scale .4s cubic-bezier(.3, 1.6, .5, 1); }
.cart-bubble.show { opacity: 1; scale: 1; }
@media (max-width: 900px) { .cart-bubble { right: auto; left: 0; top: auto; bottom: calc(100% + 26px); transform-origin: 20% 100%; } .cart-bubble .cb-tail { right: auto; left: 18px; } }
@media (prefers-reduced-motion: reduce) { .cart-bubble { transition: opacity .2s ease; scale: 1; } }
/* Başlık kelimeleri (Entegrasyonları, Koordinasyonu...) hiçbir ekranda bölünmesin: yazı boyutu kart genişliğine göre sınırlanır */
.blk-cards[data-g] .k-card { container-type: inline-size; }
.blk-cards[data-g] .k-card h3 { font-size: min(clamp(22px, 2.35vw, 36px), 11.2cqw); }
@media (max-width: 1199px) { .blk-cards[data-g] .k-card h3 { font-size: min(clamp(26px, 3vw, 40px), 11.2cqw); } }
@media (max-width: 480px) { .blk-cards[data-g] .k-card h3 { font-size: min(clamp(24px, 7.2vw, 32px), 11.2cqw); } }
.cart-bubble { overflow: visible; }
.cart-bubble .cb-tail { position: absolute; top: 100%; right: -4px; width: 34px; height: 26px; pointer-events: none; overflow: visible; }

/* Gece evreni: gezegenler (uzak küçük, yakın büyük; yavaş geçer) */
.ns-planet { position: absolute; border-radius: 50%; pointer-events: none; background: radial-gradient(circle at 32% 30%, color-mix(in srgb, var(--c1) 80%, #fff) 0, var(--c1) 40%, var(--c2) 100%); box-shadow: inset calc(var(--s) * -.1) calc(var(--s) * -.08) calc(var(--s) * .22) rgba(0, 0, 0, .55), 0 0 calc(var(--s) * .25) color-mix(in srgb, var(--c1) 22%, transparent); }
.ns-planet.bands::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: repeating-linear-gradient(10deg, rgba(255, 255, 255, .15) 0 7%, rgba(0, 0, 0, .12) 7% 14%); }
.ns-planet.ring::after { content: ""; position: absolute; left: -38%; right: -38%; top: 36%; bottom: 36%; border-radius: 50%; border: calc(var(--s) * .035) solid rgba(255, 255, 255, .38); rotate: -16deg; }
html.ns-aim, html.ns-aim body, html.ns-aim .panel { cursor: crosshair; }
/* Üst menü sepeti: gece/gündüz düğmesinin solunda; altında konuşma balonu (kuyruk üst sağ köşeden) */
.cart-top-btn { position: relative; background: var(--mint); }
.cart-top-btn svg { width: 20px; height: 20px; }
.cart-top-n { position: absolute; top: -6px; right: -6px; min-width: 18px; height: 18px; padding: 0 4px; border: 2px solid #000; border-radius: 9px; background: var(--ember); color: #fff; font-size: 11px; font-weight: 900; line-height: 14px; text-align: center; }
.cart-top-bubble { position: absolute; z-index: 60; top: calc(100% + 16px); right: -8px; padding: 8px 14px; border: 2px solid #000; border-radius: 16px; background: #fff; color: #000; font-family: inherit; font-size: 13px; font-weight: 800; line-height: 1.2; white-space: nowrap; opacity: 0; scale: .7; transform-origin: 90% 0; pointer-events: none; transition: opacity .3s ease, scale .4s cubic-bezier(.3, 1.6, .5, 1); }
.cart-top-bubble.show { opacity: 1; scale: 1; }
.cart-top-bubble .cb-tail { position: absolute; width: 34px; height: 26px; pointer-events: none; overflow: visible; }
.cart-top-bubble .cb-tail.up { bottom: 100%; right: 8px; width: 19px; height: 15px; }
@media (prefers-reduced-motion: reduce) { .cart-top-bubble { transition: opacity .2s ease; scale: 1; } }
@media (max-width: 600px) { .cart-top-bubble { white-space: normal; width: max-content; max-width: 170px; } }

/* Gece: renkli (lavanta, mint, sarı...) düz paneller de gece lacivertine döner; Hizmetler sayfası kendi renkli bölümlerini korur */
html[data-theme="night"] body:not(:has([data-svc-cart])) .panel:not(.site-footer):not(.partner):is([style*="var(--lavender)"], [style*="var(--mint)"], [style*="var(--sun)"], [style*="var(--blue)"], [style*="var(--ember)"], [style*="var(--violet)"], [style*="var(--concrete)"], [style*="var(--mist)"]) { --carbon: #f4f1e8; --paper: #161b44; color: #f4f1e8; background: #161b44 !important; }
/* Gece: /sepet sayfasındaki açık renkli hizmet kartlarında açıklama ve başlıklar koyu yazı (beyaz zeminde silik kalmasın) */
html[data-theme="night"] .cp-group .cp-desc, html[data-theme="night"] .cp-group .cp-info, html[data-theme="night"] .cp-group .cp-item, html[data-theme="night"] .cp-group .cp-chev, html[data-theme="night"] .cp-group .cp-toggle, html[data-theme="night"] .cp-group .cp-gname { color: #000; }
html[data-theme="night"] .cp-group .cp-desc { opacity: .78; }
/* Hizmetler: sepet önce üst menüdeki yerinde durur (docked), sonra yerine iner */

.cart-fab.docked svg { width: 20px; height: 20px; }
.cart-fab.docked .cart-bubble, .cart-fab.docked .cart-tip { display: none; }
.cart-fab.docked .cart-count { top: -7px; right: -7px; }
.cart-slot-el { display: none; }
html.cart-slot .cart-slot-el { display: inline-block; position: relative; width: 36px; height: 36px; flex: none; }
.cart-fab.docked { position: absolute; top: 0; left: 0; width: 36px; height: 36px; border-width: 2px; }

/* Menü yazı tipi hazır olana kadar görünmez (düğme genişlikleri değişip kaymasın); kaydırma çubuğu gelip gidince de menü oynamasın */
html.js:not(.fnt) .nav { opacity: 0; }
html { scrollbar-gutter: stable; }

.cart-top { display: none; position: relative; }
html.cart-top-on .cart-top { display: inline-flex; }
.cart-top-n:empty { display: none; }
.cart-ghost { display: none; }
html.cart-slot .cart-ghost { display: grid; place-items: center; position: relative; width: 36px; height: 36px; border: 2px solid var(--carbon, #000); border-radius: 50%; background: var(--mint); }
.cart-ghost svg { width: 20px; height: 20px; }
.cart-ghost .cart-count { top: -7px; right: -7px; }
.cart-ghost .cart-count:empty { display: none; }
/* Gece: "Teklif al" düğmeleri sarı (siyah yazı, siyah çerçeve) */
html[data-theme="night"] a.btn.solid[href="/teklif-al"], html[data-theme="night"] .nav-right .btn.solid { background: var(--sun); color: #000; border-color: #000; }
html[data-theme="night"] a.btn.solid[href="/teklif-al"]:hover, html[data-theme="night"] .nav-right .btn.solid:hover { background: #ffe35c; color: #000; }

/* SSS: açılır kapanır sorular (açık/koyu temada aynı: beyaz kart, siyah çizgi) */
.blk-faq .faq-list { display: grid; gap: 12px; max-width: 920px; margin-top: 8px; }
.blk-faq .is-center .faq-list { margin-inline: auto; }
.faq-item { border: 2px solid #000; border-radius: var(--r-card, 22px); background: #fff; color: #000; overflow: hidden; }
.faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 20px; cursor: pointer; list-style: none; font-weight: 800; font-size: clamp(16px, 1.5vw, 19px); line-height: 1.3; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:focus-visible { outline: 3px solid var(--violet); outline-offset: -3px; }
.faq-item summary > i { position: relative; flex: none; width: 30px; height: 30px; border: 2px solid #000; border-radius: 50%; background: var(--sun); transition: rotate .25s ease, background .2s ease; }
.faq-item summary > i::before, .faq-item summary > i::after { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 2px; margin: -1px 0 0 -6px; background: #000; border-radius: 2px; }
.faq-item summary > i::after { rotate: 90deg; transition: rotate .25s ease; }
.faq-item[open] summary > i { background: var(--mint); }
.faq-item[open] summary > i::after { rotate: 0deg; }
.faq-item summary:hover { background: color-mix(in srgb, var(--sun) 28%, #fff); }
.faq-a { padding: 0 20px 18px; }
.faq-a p { margin: 0; font-size: 16.5px; line-height: 1.55; font-weight: 500; }
.faq-a a { font-weight: 800; text-decoration: underline; text-underline-offset: 3px; color: #000; }
@media (prefers-reduced-motion: reduce) { .faq-item summary > i, .faq-item summary > i::after { transition: none; } }

/* SSS: başlık solda yapışkan, sorular sağda; her grup kendi renginde */
@media (min-width: 1000px) {
  .blk-faq .blk-in { display: grid; grid-template-columns: minmax(260px, 380px) minmax(0, 1fr); column-gap: clamp(32px, 5vw, 80px); align-items: start; }
  .blk-faq .blk-in > :not(.faq-list) { grid-column: 1; position: sticky; top: 110px; }
  .blk-faq .blk-in > .faq-list { grid-column: 2; grid-row: 1 / span 6; max-width: none; margin-top: 0; }
  .blk-faq h2.display { font-size: clamp(34px, 3.6vw, 56px) !important; }
}
.blk-faq .faq-item { box-shadow: 4px 4px 0 #000; }
.blk-faq .faq-item[open] { box-shadow: 6px 6px 0 #000; }


/* Gece: panel lacivert; grup rengi gölge ve artı simgesinde kalır */
html[data-theme="night"] .blk-faq[data-bg="sun"] { --acc: var(--sun); }
html[data-theme="night"] .blk-faq[data-bg="mint"] { --acc: var(--mint); }
html[data-theme="night"] .blk-faq[data-bg="lavender"] { --acc: var(--lavender); }
html[data-theme="night"] .blk-faq[data-bg="blue"] { --acc: var(--blue); }
html[data-theme="night"] .blk-faq[data-bg="ember"] { --acc: var(--ember); }
html[data-theme="night"] .blk-faq[data-bg="sky"] { --acc: var(--sky); }
html[data-theme="night"] .blk-faq[data-bg="paper"] { --acc: var(--sun); }
html[data-theme="night"] .blk-faq .faq-item { box-shadow: 4px 4px 0 var(--acc, var(--sun)); border-color: var(--acc, var(--sun)); }
html[data-theme="night"] .blk-faq .faq-item summary > i { background: var(--acc, var(--sun)); }
html[data-theme="night"] .blk-faq .faq-item[open] { box-shadow: 6px 6px 0 var(--acc, var(--sun)); }

/* Tüm büyük başlıklar: satır arası 2 mm (alt satırdaki İ/Ü/Ö noktasının tepesi ile üst satırın tabanı arası) */
:is(h1, h2, h3).display, .hero h2[data-intro], .why .why-h, .svc-h, .svc-card h3, .rm-step h3, .bl-body h3, .work-slogan, .show-title, .wp-dialog-head h3,
.wz h2, .wz-pack h3, .wz-reco-title, .wz-sel-title, .wz-tier-head h3, .wz-send-title, .wz-det h3, .cart-title, .cp-h, .pt-h { line-height: calc(.95em + 2mm) !important; }
/* Tüm büyük başlıklar sağa yatık */
:is(h1, h2, h3).display, .hero h2[data-intro], .why .why-h, .svc-h, .svc-card h3, .rm-step h3, .bl-body h3, .work-slogan, .show-title, .wp-dialog-head h3 { font-style: italic; }
.page-hero h1.t-hang .t-lean { transform: none; }
/* Kapı müşterisi: harfler birbirine girmesin */
.page-hero h1.t-hang { letter-spacing: .04em !important; }
/* "Devamını oku": kesilmiş açıklama alttan soluklaşır, düğmeyle tamamı açılır */
.txt-more.is-cut { position: relative; max-height: var(--more-h, 340px); overflow: hidden; }
.txt-more.is-cut::after { content: ""; position: absolute; inset: auto 0 0 0; height: 120px; background: linear-gradient(to bottom, transparent, var(--more-bg, var(--paper, #fff))); pointer-events: none; }
.txt-more.is-cut.is-open { max-height: none; }
.txt-more.is-cut.is-open::after { display: none; }
.blk-more .txt-more-btn { margin-top: 18px; }
.blk-more .txt-more > :first-child { margin-top: 0; }
/* Kartın altındaki "Detaylı bilgi" bağlantısı */
.k-card .k-link { align-self: flex-start; padding: 7px 14px; border: 1px solid #000; border-radius: var(--r-pill, 999px); background: #fff; color: #000; font-size: 14px; font-weight: 800; text-decoration: none; transition: background .15s ease; }
.k-card .k-link:hover, .k-card .k-link:focus-visible { background: var(--sun, #ffd731); }
/* Uzun açıklamalar geniş ekranda iki sütun (sol, sonra sağ). Kısaltılmışken önce sol sütun dolar, sonra sağ; "Devamını oku" ile tamamı açılır. */
@media (min-width: 900px) {
  .blk-more .txt-more { column-count: 2; column-gap: 56px; column-fill: balance; }
  .blk-more .txt-more.is-cut:not(.is-open) { column-fill: auto; height: var(--more-h, 340px); }
  .blk-more .txt-more p { max-width: none; }
  .blk-more .txt-more .txt-h { break-after: avoid; margin-top: 0; }
  .blk-more .txt-more .txt-h { break-inside: avoid-column; }
}

/* İşler: Hizmetler'deki sol filtre (svc-nav.js); geniş ekranda işler filtreye yer açmak için sağa alınır */
.work-group[data-g] { scroll-margin-top: 84px; }
@media (min-width: 1200px) { .works.has-rail > .works-in { max-width: calc(1240px + 236px); padding-left: calc(clamp(16px, 3vw, 40px) + 236px); } }

/* ---------- Ortak yapı (tüm sayfalar aynı) ---------- */
/* Kelime vurgusu: üzerine gelince sarı, yazı her temada siyah (gece de okunur) */
.hw:hover, .hw-pg .split-ready .w:hover { background: var(--sun); color: #000; }
/* Yazı içi bağlantılar: SSS cevabı, açıklama, proje metni hepsi aynı (altı çizili, üzerine gelince sarı, yazı siyah) */
.faq-a a:hover, .blk-in a.txt-link:hover, .work-story a:hover { background: var(--sun, #ffd731); color: #000; }
/* SSS ve uzun açıklama başlıkları: her sayfada aynı harf aralığı ve satır yüksekliği (harfler birbirine girmez) */
.blk-faq h2.display, .blk-more h2.display { letter-spacing: 0 !important; line-height: calc(.95em + 2mm) !important; }
/* ikas rozeti (Neden biz'deki iş ortaklığı rozetinin yazı içi küçük hâli) */
.ikas-mark { display: inline-flex; align-items: center; gap: .22em; padding: .02em .42em .06em .26em; margin: 0 .06em; border: 2px solid #000; border-radius: 999px; background: var(--violet); color: #fff; font-weight: 900; font-style: normal; letter-spacing: -.02em; line-height: 1.15; text-transform: none; vertical-align: .04em; white-space: nowrap; }
.ikas-mark i { width: .5em; height: .5em; border: 2px solid #000; border-radius: 50%; background: var(--sun); flex: none; }
summary .ikas-mark { font-size: .92em; vertical-align: -.12em; }
html[data-theme="night"] .ikas-mark { border-color: #fff; }
html[data-theme="night"] .ikas-mark i { border-color: #000; }

/* "Kapı Müşterisi Beklemeye Son!!!" (ana sayfa İşler): Seçili işler etiketi gibi oval çerçeve, çerçeve her temada siyah, sağı biraz yukarıda */
.show-hook-big mark { border: 3px solid #000 !important; border-radius: 999px !important; box-shadow: 4px 5px 0 #000 !important; padding: .1em .62em .16em !important; rotate: -2.5deg; word-spacing: .12em; color: #000 !important; }
/* Büyük başlıkta ikas rozeti: başlıkla aynı boyda, çizgi kalın */
.display .ikas-mark { border-width: .05em; padding: 0 .3em .04em .2em; letter-spacing: -.02em; vertical-align: .02em; line-height: 1; }
.display .ikas-mark i { border-width: .05em; }
/* Telefonda SSS ve uzun açıklama başlıkları ekrana sığar (uzun kelimeler taşmaz) */
@media (max-width: 600px) { .blk-more h2.display, .blk-faq h2.display { font-size: clamp(26px, 8.6vw, 44px) !important; overflow-wrap: break-word; } }

/* Ana sayfa kampanya penceresi (Shopier %10) */
.promo { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 16px; }
.promo[hidden] { display: none; }
.promo-bg { position: absolute; inset: 0; background: rgba(0, 0, 0, .45); opacity: 0; transition: opacity .3s ease; }
.promo-card { position: relative; width: min(500px, 100%); padding: clamp(26px, 4vw, 38px) clamp(20px, 4vw, 34px) clamp(22px, 3vw, 30px); border: 3px solid #000; border-radius: 26px; background: var(--mint, #55db9c); color: #000; box-shadow: 5px 6px 0 #000; translate: 0 30px; scale: .96; opacity: 0; transition: translate .45s var(--slush, ease), scale .45s var(--slush, ease), opacity .3s ease; }
.promo.show .promo-bg { opacity: 1; }
.promo.show .promo-card { translate: 0 0; scale: 1; opacity: 1; }
.promo-x { position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; border: 2.5px solid #000; border-radius: 50%; background: #fff; color: #000; font: 700 24px/1 system-ui, sans-serif; cursor: pointer; display: grid; place-items: center; padding: 0 0 2px; }
.promo-x:hover { background: var(--sun); }
.promo-badge { position: absolute; top: -26px; left: -14px; width: 92px; height: 92px; border: 3px solid #000; border-radius: 50%; background: var(--sun); display: grid; place-content: center; text-align: center; rotate: -12deg; font-weight: 700; font-size: 13px; line-height: 1.05; text-transform: uppercase; letter-spacing: .04em; }
.promo-badge b { display: block; font-size: 30px; font-style: italic; letter-spacing: 0; line-height: .95; }
.promo-card:focus { outline: none; }
.promo-eye { display: inline-block; margin: 0 44px 12px 64px; padding: 5px 12px; border: 2.5px solid #000; border-radius: 999px; background: #fff; font-weight: 700; font-size: 14px; text-transform: uppercase; letter-spacing: .04em; }
.promo-t { margin: 0 0 12px; font-size: clamp(28px, 6.4vw, 40px); line-height: calc(.95em + 2mm); letter-spacing: 0; }
.promo-txt { margin: 0 0 20px; font-size: 17px; line-height: 1.45; }
.promo-act { display: flex; flex-wrap: wrap; gap: 10px; }
.promo-act .btn { cursor: pointer; }
.promo-no { background: #fff; }
@media (max-width: 420px) { .promo-badge { width: 76px; height: 76px; top: -20px; left: -8px; } .promo-badge b { font-size: 25px; } .promo-eye { margin-left: 52px; margin-right: 36px; font-size: 11.5px; letter-spacing: 0; white-space: nowrap; padding: 5px 10px; } .promo-t { font-size: 26px; } }
@media (prefers-reduced-motion: reduce) { .promo-card, .promo-bg { transition: none; } }

/* %10 rozeti uzay boşluğunda süzülür: yavaş, düzensiz salınım */
@keyframes promo-float {
  0% { transform: translate(0, 0) rotate(0deg); }
  20% { transform: translate(3px, -7px) rotate(7deg); }
  45% { transform: translate(-4px, -3px) rotate(-5deg); }
  70% { transform: translate(2px, 5px) rotate(9deg); }
  100% { transform: translate(0, 0) rotate(0deg); }
}
.promo.show .promo-badge { animation: promo-float 6.5s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .promo.show .promo-badge { animation: none; } }

/* Çerez şeridi kampanya penceresinin üstünde kalır, ikisi ayrı ayrı kullanılır */
.ck-bar { z-index: 95; }

/* Sayfa girişi (ana sayfa hariç): hero'dan sonraki başlıksız ilk metin kalın ve yatık */
.page-lead .blk-in p { font-weight: 700; font-style: italic; font-size: clamp(19px, 1.7vw, 23px); line-height: 1.5; }

/* Metin bloğu: başlığın sağında ikas × The Goatz Studio (partnerLockup) */
.head-lockup { display: flex; align-items: center; flex-wrap: wrap; gap: 14px clamp(24px, 4vw, 56px); margin-bottom: var(--blk-head-gap, 18px); }
.head-lockup > h2 { margin: 0; }
.head-lockup .pt-lockup.is-side { flex-wrap: nowrap; padding: 4px 0 10px; gap: clamp(12px, 1.6vw, 22px); }
.pt-lockup.is-side .pt-ikas, .pt-lockup.is-side .pt-goatz { font-size: clamp(26px, 3vw, 44px); }
.pt-lockup.is-side .pt-x { width: clamp(30px, 2.8vw, 42px); font-size: clamp(18px, 1.8vw, 26px); }
@media (max-width: 520px) { .pt-lockup.is-side .pt-ikas, .pt-lockup.is-side .pt-goatz { font-size: 24px; } .head-lockup .pt-lockup.is-side { gap: 10px; } }
@media (min-width: 1320px) { .head-lockup { flex-wrap: nowrap; width: max-content; max-width: calc(100vw - 120px); } .head-lockup > h2 { white-space: nowrap; flex: none; } .head-lockup .pt-lockup.is-side { flex: none; } }

/* "Kapı Müşterisi Beklemeye Son!!!" ana sayfa hero'da, "Anahtar teslim" başlığının üstünde: aynı oval, daha küçük */
.hero .hero-hook { position: relative; z-index: 2; margin: 0 auto clamp(14px, 2vw, 26px); }
.hero .hero-hook .show-hook-big { font-size: clamp(18px, 2.5vw, 34px); line-height: 1.2; }
@media (max-width: 600px) { .hero .hero-hook .show-hook-big { font-size: 4vw; } .hero .hero-hook mark { white-space: nowrap; } }

/* Alt sayfa slayt zemini (pageBg): ana sayfadaki şerit gibi, sayfaya göre farklı kıvrım, daha soluk */
.page-hero .page-ribbon > g { opacity: .9; }
html[data-theme="night"] .page-hero .page-ribbon .pr-band { stroke: rgba(255, 255, 255, .07) !important; }
html[data-theme="night"] .page-hero .page-ribbon .shine { opacity: .12; }

/* Ana sayfa İşler: "Markanızın yeni dijital vitriniyle..." (yalnız "yeni dijital vitrini" sarı, siyah çerçeveli kutu) büyük harf, sağa yatık, daha büyük */
.show-hook .show-hook-sub { font-size: clamp(20px, 2.8vw, 38px); font-weight: 800; font-style: italic; text-transform: uppercase; line-height: calc(.95em + 2mm); letter-spacing: 0; text-wrap: balance; }
/* Vitrin cümlesi: kelimelerin altı hep sarı (üzerine gelinmiş gibi), tek renk; gece de aynı, yazı siyah */
.show-hook .hook-hl { display: inline-block; background: var(--sun); color: #000; padding: .06em .28em .1em; margin: 0 .08em; border: 3px solid #000; border-radius: 10px; transform: rotate(-2deg); -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.show-hook .show-hook-sub .hw:hover, .show-hook .show-hook-sub .w:hover { background: none; }
.show-hook .hook-nw { white-space: nowrap; }
.show-hook .show-hook-sub { line-height: 1.4; } .show-hook .hook-hl { margin: 0 .04em 0 0; vertical-align: .04em; }

/* Süreç sayfası slayt zemini (roadBg): konuya göre soyut çizgiler, dikkat dağıtmaz */
.page-bg { position: absolute; width: clamp(150px, 32vw, 470px); height: auto; aspect-ratio: 560 / 460; z-index: 0; pointer-events: none; color: #000; opacity: .16; }
.pb-tl { top: 64px; left: 0; } .pb-tr { top: 64px; right: 0; } .pb-bl { bottom: 0; left: 0; } .pb-br { bottom: 0; right: 0; }
html[data-theme="night"] .page-bg { color: #fff; opacity: .15; }
@media (max-width: 700px) { .page-bg { opacity: .12; } html[data-theme="night"] .page-bg { opacity: .13; } }
/* Süreç başlığı dar ekranda taşmasın (uzun kelime) */
@media (max-width: 600px) { .page-hero.pg-road h1 { font-size: min(48px, 10.4vw) !important; letter-spacing: -.04em; } }

/* Mobil alt köşeler: sepet (sol) ve yukarı oku (sağ), kompakt; kategori şeridi artık üstte */
@media (max-width: 900px) {
  html.svc-bar-on { --sb-h: 44px; --sb-side: 14px; --sb-b: calc(12px + env(safe-area-inset-bottom, 0px)); }
  html.svc-bar-on .to-top { width: var(--sb-h); height: var(--sb-h); right: var(--sb-side); bottom: var(--sb-b); box-shadow: none; border-width: 2px; }
  html.svc-bar-on .to-top svg { width: 20px; height: 20px; }
  html.svc-bar-on .cart-rail { left: var(--sb-side); bottom: var(--sb-b); }
  html.svc-bar-on .cart-fab:not(.docked) { width: var(--sb-h); height: var(--sb-h); border-width: 2px; }
  html.svc-bar-on .cart-fab:not(.docked) svg { width: 22px; height: 22px; }
  html.svc-bar-on .cart-fab:not(.docked) .cart-count { min-width: 20px; height: 20px; font-size: 11px; padding: 0 4px; top: -8px; right: -5px; }
}

/* Dar ekran (<1200px) kategori şeridi: üst menünün hemen altına yapışır, yatay kaydırılır, kenarları solar. Alt köşelerde yalnız sepet ve yukarı oku kalır. */
@media (max-width: 1199px) {
  .svc-bar { top: calc(64px + env(safe-area-inset-top, 0px)); bottom: auto; left: 50%; translate: -50% 0; width: calc(100vw - 20px); max-width: 760px; padding: 3px; border: 2px solid #000; border-radius: var(--r-pill, 1600px); background: var(--paper) !important; z-index: 44; }
  .svc-bar-track { display: flex; gap: 4px; padding: 0 10px; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12px, #000 calc(100% - 12px), transparent); mask-image: linear-gradient(90deg, transparent, #000 12px, #000 calc(100% - 12px), transparent); }
  .svc-bar a { scroll-snap-align: center; display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 14px 0 12px; max-width: none; overflow: visible; border: 2px solid transparent; background: transparent; font-size: 14px; font-weight: 800; }
  .svc-bar a .dot { flex: none; width: 14px; height: 14px; border: 2px solid #000; border-radius: 50%; background: var(--fc); }
  .svc-bar a:hover { border-color: transparent; }
  .svc-bar a.on { background: var(--fc); border: 3px solid #000; padding: 0 13px 0 11px; font-weight: 900; }
  .svc-bar a.on .dot { background: #000; border-color: #000; }
  .svc-bar a:focus-visible { outline: 3px solid #000; outline-offset: -3px; }
  html[data-theme="night"] .svc-bar { background: #161b44 !important; border-color: #f4f1e8; }
  html[data-theme="night"] .svc-bar a { color: #f4f1e8; }
  html[data-theme="night"] .svc-bar a .dot { border-color: #000; }
  html[data-theme="night"] .svc-bar a.on { color: #000; }
  html:not(.svc-bar-on) .svc-bar { display: none; }
}
@media (max-width: 900px) {
  /* şerit üstte olduğu için alt köşelerdeki düğmeler çerez şeridine göre konumlanır */
  html.svc-bar-on .cart-rail, html.svc-bar-on .to-top { bottom: var(--sb-b); }
}

/* Çerez şeridi açıkken mobil alt çubuk (sepet, kategori çubuğu, yukarı ok) şeridin üstüne çıkar */
@media (max-width: 900px) {
  html.ck-on.svc-bar-on { --sb-b: calc(12px + env(safe-area-inset-bottom, 0px) + var(--ck-h, 120px) + 24px); }
  html.ck-on:not(.svc-bar-on) .cart-rail { bottom: calc(18px + var(--ck-h, 120px) + 24px); }
}

/* İşler: üstteki düğme filtresi (.work-filters) geri geldi. Dar ekranda yapışkan çip şeridi gizli (iki filtre üst üste binmesin), geniş ekranda sol kapsüller + üst düğmeler birlikte durur */
.svc-bar.is-works { display: none !important; }
@media (max-width: 1199px) { .work-group[data-g] { scroll-margin-top: 84px; } }
@media (max-width: 600px) { .work-filters { gap: 6px; } .work-filter { padding: 10px 14px; } }

/* Büyütülmüş grup: kırpma yok, dikey/yatay görsel kareye tam sığar (boşluk görselin kenar rengiyle dolar) */
.wp-gallery img, .wp-sector img { object-fit: contain; background: var(--paper); }

/* Ürün kapakları: beyaz/düz fonlu ürünler biraz yakınlaştırılır, ürünlerin altı kartlar arasında ortak bir tabana oturur (site.js .wp-ph dengesi) */
.wp-sector img[data-zoom] { transform: translate(var(--zx), var(--zy)) scale(var(--zs)); }

  /* ---------- Referanslar (ana sayfa, kayan logo şeridi) ---------- */
  .refs { position: relative; z-index: 2; grid-column: 1 / -1; width: 100%; margin-top: clamp(40px, 6vw, 72px); }
  .refs-tag { display: table; margin: 0 auto 14px; padding: 6px 16px; background: var(--paper); color: var(--carbon); border: 2px solid var(--carbon); border-radius: var(--r-pill); font-size: 12px; rotate: -2deg; }
  .refs-view { overflow: hidden; background: var(--paper); border-block: 2px solid var(--carbon); -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
  .refs-track { display: flex; width: max-content; animation: slide 36s linear infinite; }
  .refs-view:hover .refs-track { animation-play-state: paused; }
  .ref-set { display: flex; align-items: center; }
  .ref-logo { display: flex; align-items: center; justify-content: center; height: 96px; padding: 0 clamp(28px, 4vw, 56px); }
  .ref-logo img { display: block; height: auto; max-height: calc(52px * var(--rs, 1)); max-width: 190px; width: auto; transition: transform .3s var(--bounce, ease); }
  a.ref-logo:hover img { transform: scale(1.08) rotate(-3deg); }
  @media (max-width: 640px) { .ref-logo { height: 76px; } .ref-logo img { max-height: calc(40px * var(--rs, 1)); max-width: 140px; } }
  @media (prefers-reduced-motion: reduce) { .refs-track { animation-duration: 120s; } }

  /* ---------- Yeni iş (ana sayfa, İşler vitrininin önünde tek proje) ---------- */
  .newwork { background: var(--sun); padding: clamp(56px, 8vw, 110px) 16px; }
  .nw-in { max-width: 1240px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
  .nw-tag { display: inline-block; padding: 10px 26px; background: var(--ember); color: var(--paper); border: 2px solid var(--carbon); border-radius: var(--r-pill); font-size: clamp(20px, 2.2vw, 30px); font-weight: 900; rotate: -3deg; }
  .nw-title { margin: 18px 0 12px; font-size: clamp(40px, 6vw, 84px); line-height: calc(.95em + 2mm); letter-spacing: 0; }
  .nw-sub { margin: 0 0 14px; font-weight: 700; font-size: clamp(17px, 1.6vw, 21px); }
  .nw-list { margin: 0 0 26px; padding-left: 1.1em; display: grid; gap: 6px; }
  .nw-btns { display: flex; flex-wrap: wrap; gap: 10px; }
  .browser.nw-shot { display: block; position: relative; width: auto; overflow: visible; color: var(--carbon); rotate: 2deg; background: var(--wc, var(--mint)); border: 2px solid var(--carbon); border-radius: var(--r-card); padding: 12px; transition: rotate .35s var(--bounce, ease); }
  .browser.nw-shot:hover { rotate: 0deg; }
  .nw-shot .browser-bar { background: transparent; padding: 4px 4px 10px; }
  .nw-stage { position: relative; aspect-ratio: 1600 / 830; overflow: hidden; background: var(--paper); border: 1px solid var(--carbon); border-radius: calc(var(--r-card) - 6px); }
  .nw-stage img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center; opacity: 0; transition: opacity .8s ease; }
  .nw-stage img.on { opacity: 1; }
  @media (max-width: 860px) { .nw-in { grid-template-columns: 1fr; } .browser.nw-shot { rotate: 0deg; } }
  .nw-shot .browser-bar i { width: 11px; height: 11px; border: 1px solid var(--carbon); background: var(--paper); }
  .nw-shot .browser-bar i:nth-child(1) { background: var(--ember); } .nw-shot .browser-bar i:nth-child(2) { background: var(--sun); }
  .nw-shot .browser-bar .url { background: var(--paper); color: var(--carbon); border: 1px solid var(--carbon); font-size: 13px; padding: 5px 14px; }

  /* ---------- Üst menü "Yeni bir iş" baloncuğu (İşler'in altında) ---------- */
  .btn.nw-bubble { position: fixed; z-index: 60; top: 0; left: 0; padding: 10px 16px; font-size: 12px; white-space: nowrap; overflow: visible; opacity: 0; transform: translateY(-8px) scale(.9); transform-origin: var(--ax, 30px) 0; transition: opacity .25s ease, transform .45s var(--bounce, ease); pointer-events: none; }
  .btn.nw-bubble.on { opacity: 1; transform: none; pointer-events: auto; animation: nwb-bob 2.4s ease-in-out .6s infinite; }
  .nw-bubble::before { content: ""; position: absolute; top: -6px; left: calc(var(--ax, 30px) - 7px); width: 14px; height: 14px; background: var(--carbon); border-radius: 2px; rotate: 45deg; }
  @keyframes nwb-bob { 0%, 100% { translate: 0 0; } 50% { translate: 0 3px; } }