.ornek-tasarim.firma-tasarim { display: block; isolation: isolate; color: #FFFFFF; background: var(--ft-zemin); }
.firma-tasarim > span:not(.ornek-tasarim__ornek), .firma-tasarim__plaka, .firma-tasarim__metin { position: absolute; }
.firma-tasarim > .ornek-tasarim__ornek { top: 8.5%; }
.firma-tasarim--yatay > .ornek-tasarim__ornek { top: 13%; }
.sy:has(.firma-tasarim) .alan__ipucu { display: none; }

.firma-tasarim__zemin { inset: 0; z-index: -4; background:
  radial-gradient(85% 55% at 88% 6%, color-mix(in srgb, var(--ft-vurgu) 30%, transparent), transparent 70%),
  radial-gradient(70% 50% at 4% 100%, color-mix(in srgb, var(--ft-vurgu2) 24%, transparent), transparent 72%),
  linear-gradient(158deg, var(--ft-zemin2) 0%, var(--ft-zemin) 78%); }
.firma-tasarim--siluetsiz .firma-tasarim__zemin { background:
  radial-gradient(circle, color-mix(in srgb, var(--ft-vurgu) 22%, transparent) 9%, transparent 11%) 0 0 / 1.4em 1.4em,
  radial-gradient(85% 55% at 88% 6%, color-mix(in srgb, var(--ft-vurgu) 30%, transparent), transparent 70%),
  linear-gradient(158deg, var(--ft-zemin2) 0%, var(--ft-zemin) 78%); }
.firma-tasarim__desen { inset: -30%; z-index: -3; background: var(--ft-desen) 0 0 / 9em auto repeat; opacity: .065; transform: rotate(-14deg); }
.firma-tasarim__dev { z-index: -2; top: -4%; right: -30%; width: 96%; height: 58%; background: var(--ft-siluet) center / contain no-repeat; opacity: .12; transform: rotate(-9deg); }
.firma-tasarim__cizgi { z-index: -1; left: -12%; right: -12%; top: 60%; height: .6em; background: var(--ft-vurgu); transform: rotate(-7deg); box-shadow: 0 .4em 1.2em -.3em color-mix(in srgb, var(--ft-vurgu) 70%, transparent); }
.firma-tasarim__cizgi--ince { top: 63.4%; height: .2em; background: var(--ft-vurgu2); box-shadow: none; opacity: .9; }

.firma-tasarim__plaka { z-index: 1; top: 14%; left: 50%; display: grid; grid-template: minmax(0, 1fr) / minmax(0, 1fr); place-items: center; width: 50%; aspect-ratio: 1; max-height: 40%; padding: 1em; border-radius: .9em; background: #FFFFFF; transform: translateX(-50%);
  box-shadow: 0 1.4em 2.6em -1em rgba(0, 0, 0, .6), 0 0 0 .3em color-mix(in srgb, var(--ft-vurgu) 60%, transparent); }
.firma-tasarim--logo-genis .firma-tasarim__plaka { width: 76%; aspect-ratio: clamp(2.2, var(--ft-oran), 4.2); padding: .7em 1em; }
.firma-tasarim--logo-uzun .firma-tasarim__plaka { width: 40%; aspect-ratio: .78; }
.firma-tasarim--acik-logo .firma-tasarim__plaka { background: color-mix(in srgb, var(--ft-zemin) 82%, #000000); box-shadow: 0 1.4em 2.6em -1em rgba(0, 0, 0, .6), 0 0 0 .12em rgba(255, 255, 255, .35); }
.firma-tasarim__plaka img { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; object-fit: contain; }

.firma-tasarim__metin { z-index: 2; left: 8%; right: 8%; bottom: 7%; display: flex; flex-direction: column; align-items: flex-start; gap: .45em; }
.firma-tasarim__metin::before { content: ""; width: 2.8em; height: .22em; margin-bottom: .35em; border-radius: 999px; background: var(--ft-vurgu); }
.firma-tasarim__baslik { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; max-width: 100%; padding-bottom: .08em; font-family: var(--font-baslik); font-weight: var(--fw-ekstra); line-height: 1.06; letter-spacing: -.015em; overflow-wrap: anywhere; text-wrap: balance; }
.firma-tasarim__baslik--kisa { font-size: 2.35em; }
.firma-tasarim__baslik--orta { font-size: 1.8em; }
.firma-tasarim__baslik--uzun { font-size: 1.35em; }
.firma-tasarim__mesaj { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; max-width: 100%; font-size: .86em; line-height: 1.35; overflow-wrap: anywhere; }
.firma-tasarim__web { max-width: 100%; margin-top: .35em; padding: .32em .9em; overflow: hidden; border-radius: 999px; background: var(--ft-kapsul); color: var(--ft-vurgu-metin); font-size: .66em; font-weight: var(--fw-kalin); letter-spacing: .04em; white-space: nowrap; text-overflow: ellipsis; }
.firma-tasarim__bos { opacity: .62; }

.firma-tasarim--alt .firma-tasarim__metin { top: 14%; bottom: auto; }
.firma-tasarim--alt .firma-tasarim__plaka { top: auto; bottom: 8%; }
.firma-tasarim--alt .firma-tasarim__cizgi { top: 47%; transform: rotate(7deg); }
.firma-tasarim--alt .firma-tasarim__cizgi--ince { top: 50.4%; }
.firma-tasarim--alt .firma-tasarim__dev { top: auto; right: auto; bottom: -6%; left: -32%; transform: rotate(9deg); }

.firma-tasarim--kapak .firma-tasarim__plaka { top: 17%; }
.firma-tasarim--kapak .firma-tasarim__metin { align-items: center; text-align: center; }
.firma-tasarim--kapak .firma-tasarim__dev { top: auto; bottom: -10%; right: -24%; height: 52%; }

.firma-tasarim--cift-sol .firma-tasarim__dev { top: 8%; right: auto; left: -14%; width: 120%; height: 62%; opacity: .14; transform: rotate(-6deg); }
.firma-tasarim--cift-sol .firma-tasarim__cizgi { top: 64%; right: -2%; }
.firma-tasarim--cift-sol .firma-tasarim__cizgi--ince { top: 67.4%; }
.firma-tasarim--cift-sol .firma-tasarim__baslik--kisa { font-size: 2.7em; }
.firma-tasarim--cift-sol .firma-tasarim__baslik--orta { font-size: 2.1em; }
.firma-tasarim--cift-sol .firma-tasarim__baslik--uzun { font-size: 1.6em; }
.firma-tasarim--cift-sag .firma-tasarim__cizgi { top: 55.4%; left: -2%; }
.firma-tasarim--cift-sag .firma-tasarim__cizgi--ince { top: 58.8%; }
.firma-tasarim--cift-sag .firma-tasarim__metin { align-items: flex-end; text-align: right; }
.firma-tasarim--cift-sag .firma-tasarim__metin::before { align-self: flex-end; }

.firma-tasarim--yatay .firma-tasarim__plaka { top: 50%; left: 6%; width: auto; height: 64%; max-height: none; max-width: 38%; transform: translateY(-50%); }
.firma-tasarim--yatay.firma-tasarim--logo-kare .firma-tasarim__plaka { aspect-ratio: auto; width: 38%; }
.firma-tasarim--yatay.firma-tasarim--logo-genis .firma-tasarim__plaka { width: 40%; height: auto; max-width: 40%; aspect-ratio: clamp(2.1, var(--ft-oran), 4.5); padding: .45em .7em; }
.firma-tasarim--yatay .firma-tasarim__metin { top: 50%; bottom: auto; left: 50%; right: 5%; gap: .3em; transform: translateY(-50%); }
.firma-tasarim--yatay .firma-tasarim__metin::before { margin-bottom: .15em; }
.firma-tasarim--yatay .firma-tasarim__baslik { -webkit-line-clamp: 2; }
.firma-tasarim--yatay .firma-tasarim__baslik--kisa { font-size: 1.7em; }
.firma-tasarim--yatay .firma-tasarim__baslik--orta { font-size: 1.32em; }
.firma-tasarim--yatay .firma-tasarim__baslik--uzun { font-size: 1.05em; }
.firma-tasarim--yatay .firma-tasarim__mesaj { -webkit-line-clamp: 2; font-size: .74em; }
.firma-tasarim--yatay .firma-tasarim__web { margin-top: .15em; border-radius: .7em; font-size: .58em; white-space: normal; overflow-wrap: anywhere; }
.firma-tasarim--yatay .firma-tasarim__cizgi { top: 86%; transform: rotate(-3deg); }
.firma-tasarim--yatay .firma-tasarim__cizgi--ince { top: 91%; }
.firma-tasarim--yatay .firma-tasarim__dev { top: -30%; right: -12%; width: 60%; height: 160%; opacity: .08; }

.serit-ornek-tasarim.firma-renk { background: linear-gradient(90deg, var(--ft-zemin), var(--ft-zemin2)); box-shadow: inset 0 .16em 0 var(--ft-vurgu); }
.serit-ornek-tasarim.firma-renk img.ornek-tasarim__logo--kullanici { width: auto; max-width: 6em; }
.tk__ornek-tasarim.firma-renk { background: linear-gradient(90deg, var(--ft-zemin), var(--ft-zemin2)); box-shadow: inset .3em 0 0 var(--ft-vurgu); }
.tk__ornek-tasarim.firma-renk > span:last-child { flex: 1 1 auto; min-width: 0; }
.tk__ornek-tasarim.firma-renk b, .tk__ornek-tasarim.firma-renk small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.yp__rozet.firma-renk { border-color: var(--ft-vurgu); background: linear-gradient(90deg, var(--ft-zemin), var(--ft-zemin2)); color: #FFFFFF; }
.yp__rozet.firma-renk small { color: rgba(255, 255, 255, .8); }
.cetvel__uc.firma-renk { background: linear-gradient(90deg, var(--ft-zemin2), var(--ft-zemin)); }

.firma-paleti { display: flex; align-items: center; gap: var(--b-2); margin: 0; color: var(--metin-ikincil); font-size: var(--fs-xs); }
.firma-paleti[hidden] { display: none; }
.firma-paleti__renkler { display: inline-flex; flex-shrink: 0; }
.firma-paleti__renkler i { width: 18px; height: 18px; border: 2px solid #FFFFFF; border-radius: 50%; box-shadow: 0 0 0 1px var(--kenarlik-guclu); }
.firma-paleti__renkler i + i { margin-left: -5px; }

@media (pointer: coarse) {
  .kart__logo:has(.firma-paleti) input[type="text"] { font-size: 16px; }
}
