/* Mürekkep — dövme ve piercing stüdyosu teması. Tüm renkler token'lardan (--c-*). Önek: dv- */
@font-face { font-family: "Pirata One"; src: url("../fonts/pirata-ext.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Pirata One"; src: url("../fonts/pirata-lat.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@property --dv-r { syntax: "<length>"; inherits: false; initial-value: 0px; }

:root {
    --f-d: "Pirata One", "UnifrakturCook", Georgia, "Times New Roman", serif;
    --f-b: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --r: 3px;
    --wrap: 1180px;
    --head-h: 68px;
    --ink-l: 2px solid var(--c-primary-ink);
    --hard: 5px 5px 0 color-mix(in srgb, var(--c-primary) 20%, transparent);
    --hard-s: 3px 3px 0 color-mix(in srgb, var(--c-primary) 24%, transparent);
    --tape: color-mix(in srgb, var(--c-surface-2) 62%, var(--c-border-2));
    --ease: cubic-bezier(.2, .8, .2, 1);
    --dv-p: 0;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--head-h) + 14px); }
body.dv-body { margin: 0; background: var(--c-bg); color: var(--c-ink); font: 400 1rem/1.62 var(--f-b); -webkit-font-smoothing: antialiased; overflow-x: hidden; min-height: 100vh;
    background-image: radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--c-primary) 11%, transparent) 1px, transparent 1.4px); background-size: 17px 17px; }
img, svg { max-width: 100%; display: block; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4 { margin: 0; font-family: var(--f-d); font-weight: 400; line-height: 1.02; color: var(--c-ink); letter-spacing: .005em; }
p { margin: 0 0 1em; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button { font: inherit; color: inherit; cursor: pointer; }
fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--c-accent); outline-offset: 3px; border-radius: 2px; }
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.dv-wrap { width: min(100% - 2rem, var(--wrap)); margin-inline: auto; }
.dv-wrap--read { width: min(100% - 2rem, 740px); }
.dv-skip { position: fixed; left: 12px; top: -80px; z-index: 300; background: var(--c-primary); color: var(--c-on-primary); padding: .6rem 1rem; border-radius: var(--r); transition: top .2s; }
.dv-skip:focus { top: 12px; }
.dv-preview { background: var(--c-accent-soft); color: var(--c-accent-ink); text-align: center; padding: .4rem 1rem; font-size: .85rem; }
.dv-cur { font-family: var(--f-b); font-size: .56em; font-weight: 800; margin-right: .1em; vertical-align: .46em; letter-spacing: 0; }
.dv-ask { font-family: var(--f-d); font-size: 1.6rem; color: var(--c-accent-ink); }

/* ── semboller (soyut flash çizimleri) ── */
.dv-sym { width: 100%; height: 100%; overflow: visible; }
.dv-sym .k-l, .dv-sym .k-r, .dv-run svg .k-l, .dv-run svg .k-r, .dv-err svg .k-l, .dv-err svg .k-r, .dv-rule__box .k-r { fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.4; }
.dv-sym .k-l, .dv-run svg .k-l, .dv-err svg .k-l { stroke: var(--c-primary-ink); }
.dv-sym .k-r, .dv-run svg .k-r, .dv-err svg .k-r, .dv-rule__box .k-r { stroke: var(--c-accent); }
.dv-sym .k-f { fill: color-mix(in srgb, var(--c-primary) 14%, var(--c-bg)); transform: translate(3px, 3px); }
.dv-sym .k-rf { fill: var(--c-accent); stroke: var(--c-accent); stroke-width: 1.4; stroke-linejoin: round; }
.dv-sym .k-d { fill: var(--c-primary-ink); }
/* çizilme: JS varsa görünene dek gizli; görününce çizgiler sırayla çizilir (tek seferlik) */
.js [data-draw]:not(.is-drawn) .k-l, .js [data-draw]:not(.is-drawn) .k-r { stroke-dasharray: 1; stroke-dashoffset: 1; }
.js [data-draw]:not(.is-drawn) .k-f, .js [data-draw]:not(.is-drawn) .k-rf, .js [data-draw]:not(.is-drawn) .k-d { opacity: 0; }
[data-draw].is-drawn .k-l, [data-draw].is-drawn .k-r { stroke-dasharray: 1; stroke-dashoffset: 0; animation: dv-draw 1s cubic-bezier(.5, 0, .2, 1) backwards; animation-delay: calc(var(--d, 0s) + var(--i, 0) * .09s); }
[data-draw].is-drawn .k-f, [data-draw].is-drawn .k-rf, [data-draw].is-drawn .k-d { animation: dv-pop .5s ease backwards; animation-delay: calc(var(--d, 0s) + .7s); }
@keyframes dv-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes dv-pop { from { opacity: 0; } to { opacity: 1; } }

/* ── etiketler, başlıklar ── */
.dv-k { display: inline-flex; align-items: center; gap: .6rem; margin: 0 0 .7rem; font: 800 .72rem/1.3 var(--f-b); letter-spacing: .18em; text-transform: uppercase; color: var(--c-accent-ink); }
.dv-k::before { content: ""; width: 22px; height: 9px; background: linear-gradient(var(--c-accent), var(--c-accent)) 0 50% / 100% 2px no-repeat; mask: radial-gradient(circle at 3px 50%, transparent 0 2px, #000 2.5px); -webkit-mask: radial-gradient(circle at 3px 50%, transparent 0 2px, #000 2.5px); }
.dv-h1s, .dv-h2, .dv-h3 { font-family: var(--f-d); font-weight: 400; line-height: 1.04; color: var(--c-ink); }
.dv-h1s { font-size: clamp(2.5rem, 5.8vw, 4.6rem); }
.dv-h2 { font-size: clamp(2.2rem, 4.6vw, 3.6rem); }
.dv-h3 { font-size: clamp(1.5rem, 2.6vw, 2rem); }
.dv-fine { margin: 1.1rem 0 0; font-size: .84rem; line-height: 1.5; color: var(--c-muted); max-width: 70ch; }
.dv-link { color: var(--c-primary-ink); text-decoration: underline; text-decoration-color: var(--c-accent); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.dv-link:hover { color: var(--c-accent-ink); }
.dv-sec { padding-block: clamp(3.4rem, 7vw, 6.4rem); position: relative; }
.dv-sec--tint { background: color-mix(in srgb, var(--c-surface) 86%, transparent); border-block: 2px dashed var(--c-border-2); }
.dv-sechead { margin-bottom: clamp(1.6rem, 3.4vw, 2.8rem); max-width: 40rem; }
.dv-sechead--row { max-width: none; display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.dv-sechead--sub { margin: 3rem 0 1.4rem; }
.dv-more { display: inline-flex; align-items: center; gap: .5rem; font: 800 .76rem/1 var(--f-b); letter-spacing: .14em; text-transform: uppercase; color: var(--c-primary-ink); padding-bottom: .35rem; border-bottom: 2px solid var(--c-accent); }
.dv-more svg { width: 16px; height: 16px; transition: transform .2s var(--ease); } .dv-more:hover svg { transform: translateX(4px); }
.dv-pill { display: inline-flex; align-items: center; gap: .5rem; margin: 0 0 1rem; padding: .35rem .8rem; border: var(--ink-l); background: var(--c-soft); font: 800 .72rem/1.2 var(--f-b); letter-spacing: .14em; text-transform: uppercase; color: var(--c-primary-ink); transform: rotate(-1.2deg); }
.dv-pill svg { width: 15px; height: 15px; color: var(--c-accent); }
.dv-ring { display: inline-grid; place-items: center; width: 82px; height: 82px; padding: .3rem; border-radius: 50%; border: 4px double var(--c-accent-ink); color: var(--c-accent-ink); font: 800 .66rem/1.15 var(--f-b); letter-spacing: .1em; text-transform: uppercase; text-align: center; font-style: normal; transform: rotate(-9deg); background: color-mix(in srgb, var(--c-accent) 6%, var(--c-bg)); }

/* ── düğmeler ── */
.dv-btn { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; padding: .85rem 1.35rem; background: var(--c-primary); color: var(--c-on-primary); border: 2px solid var(--c-primary-dark); border-radius: var(--r); font: 800 .78rem/1.1 var(--f-b); letter-spacing: .13em; text-transform: uppercase; box-shadow: 4px 4px 0 var(--c-accent); transition: transform .14s var(--ease), box-shadow .14s var(--ease), background .14s; cursor: pointer; text-align: center; }
.dv-btn:hover { transform: translate(2px, 2px); box-shadow: 2px 2px 0 var(--c-accent); background: var(--c-primary-dark); }
.dv-btn:active { transform: translate(4px, 4px); box-shadow: 0 0 0 var(--c-accent); }
.dv-btn svg { width: 17px; height: 17px; }
.dv-btn--lg { padding: 1rem 1.6rem; font-size: .84rem; }
.dv-btn--sm { padding: .6rem 1rem; font-size: .7rem; box-shadow: 3px 3px 0 var(--c-accent); }
.dv-btn--block { display: flex; width: 100%; }
.dv-btn--line { background: var(--c-soft); color: var(--c-ink); border-color: var(--c-primary-ink); box-shadow: 4px 4px 0 var(--c-border-2); }
.dv-btn--line:hover { background: var(--c-surface); box-shadow: 2px 2px 0 var(--c-border-2); }
.dv-btn__a { font-size: 1.1em; transition: transform .2s var(--ease); } .dv-btn:hover .dv-btn__a { transform: translateX(3px); }
.dv-chip { padding: .45rem .9rem; background: var(--c-soft); border: 2px solid var(--c-primary-ink); border-radius: 99px; font: 800 .72rem/1.1 var(--f-b); letter-spacing: .08em; text-transform: uppercase; color: var(--c-primary-ink); transition: background .15s, transform .15s; }
.dv-chip:hover { transform: rotate(-1.5deg); }
.dv-chip.is-on { background: var(--c-primary); color: var(--c-on-primary); }

/* bant (washi) */
.dv-st__tape, .dv-gi__tape, .dv-a__tape, .dv-nt__tape, .dv-slip__tape, .dv-spec__tape, .dv-check__tape, .dv-card__tape, .dv-note__tape, .dv-hoursbox__tape, .dv-guide__tape, .dv-sheet__tape, .dv-foot__tape, .dv-care__tape { position: absolute; z-index: 3; top: -11px; left: 50%; width: 78px; height: 24px; margin-left: -39px; transform: rotate(-3deg); background: var(--tape); opacity: .92; clip-path: polygon(0 0, 100% 0, 97% 25%, 100% 50%, 97% 75%, 100% 100%, 0 100%, 3% 75%, 0 50%, 3% 25%); pointer-events: none; }
/* kayıt işaretleri */
.dv-reg { position: absolute; width: 22px; height: 22px; pointer-events: none; opacity: .65; }
.dv-reg::before, .dv-reg::after { content: ""; position: absolute; background: var(--c-primary-ink); }
.dv-reg::before { left: 50%; top: -6px; bottom: -6px; width: 2px; margin-left: -1px; } .dv-reg::after { top: 50%; left: -6px; right: -6px; height: 2px; margin-top: -1px; }
.dv-reg { border: 2px solid var(--c-primary-ink); border-radius: 50%; }
.dv-reg--a { left: 10px; top: 10px; } .dv-reg--b { right: 10px; top: 10px; } .dv-reg--c { left: 10px; bottom: 10px; } .dv-reg--d { right: 10px; bottom: 10px; }

/* ── üst çubuk ── */
.dv-head { position: sticky; top: 0; z-index: 90; background: color-mix(in srgb, var(--c-bg) 95%, transparent); border-bottom: var(--ink-l); view-transition-name: dv-head; }
.dv-head__in { display: flex; align-items: center; gap: .8rem; min-height: var(--head-h); width: min(100% - 2rem, var(--wrap)); margin-inline: auto; }
.dv-brand { display: inline-flex; align-items: center; gap: .6rem; margin-right: auto; min-width: 0; }
.dv-brand__mark { width: 40px; height: 40px; flex: none; padding: 7px; border: var(--ink-l); border-radius: 50%; background: var(--c-soft); box-shadow: 2px 2px 0 var(--c-accent); }
.dv-brand__name { font: 400 2rem/1 var(--f-d); letter-spacing: .02em; color: var(--c-ink); white-space: nowrap; }
.dv-brand__logo { max-height: 42px; width: auto; }
.dv-head__cta { padding: .55rem 1rem; border: 2px solid var(--c-accent-ink); background: var(--c-accent); color: var(--c-on-accent); font: 800 .72rem/1 var(--f-b); letter-spacing: .14em; text-transform: uppercase; transform: rotate(-2deg); box-shadow: 3px 3px 0 color-mix(in srgb, var(--c-accent-ink) 35%, transparent); transition: transform .15s var(--ease); white-space: nowrap; }
.dv-head__cta:hover { transform: rotate(0deg) translateY(-1px); }
.dv-menu { display: flex; align-items: center; gap: .65rem; padding: .3rem .65rem .3rem .35rem; background: var(--c-soft); border: var(--ink-l); border-radius: var(--r); box-shadow: var(--hard-s); transition: transform .15s var(--ease), box-shadow .15s; }
.dv-menu:hover { transform: translate(1px, 1px); box-shadow: 2px 2px 0 color-mix(in srgb, var(--c-primary) 24%, transparent); }
.dv-menu__sym { width: 40px; height: 40px; padding: 4px; border: 2px dashed var(--c-border-2); flex: none; }
.dv-menu__txt { display: grid; text-align: left; line-height: 1.1; min-width: 5.4rem; }
.dv-menu__txt small { font: 800 .62rem/1 var(--f-b); letter-spacing: .16em; text-transform: uppercase; color: var(--c-accent-ink); }
.dv-menu__txt b { font: 400 1.35rem/1.1 var(--f-d); color: var(--c-ink); }
.dv-menu__bars { display: grid; gap: 4px; width: 22px; } .dv-menu__bars i { display: block; height: 3px; background: var(--c-primary-ink); border-radius: 2px; transition: transform .25s var(--ease), width .25s; } .dv-menu__bars i:nth-child(2) { width: 70%; margin-left: auto; }
.dv-menu[aria-expanded="true"] .dv-menu__bars i:nth-child(1) { transform: translateY(7px) rotate(45deg); } .dv-menu[aria-expanded="true"] .dv-menu__bars i:nth-child(2) { opacity: 0; } .dv-menu[aria-expanded="true"] .dv-menu__bars i:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.dv-prog { position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; pointer-events: none; }
.dv-prog i { position: absolute; left: 0; top: -1px; height: 4px; width: 100%; background: var(--c-accent); transform-origin: 0 50%; transform: scaleX(var(--dv-p)); }
.dv-prog i::after { content: ""; position: absolute; right: -3px; top: -3px; width: 10px; height: 10px; border-radius: 50%; background: var(--c-accent); border: 2px solid var(--c-bg); }

/* ── flash sayfası menüsü ── */
.dv-scrim { position: fixed; inset: 0; z-index: 85; background: color-mix(in srgb, var(--c-ink) 26%, transparent); opacity: 0; transition: opacity .3s; }
.dv-scrim.is-on { opacity: 1; }
.dv-sheet { position: fixed; z-index: 95; top: calc(var(--head-h) + 12px); right: max(1rem, calc((100vw - var(--wrap)) / 2)); width: min(840px, calc(100vw - 2rem)); max-height: calc(100dvh - var(--head-h) - 28px); overflow: auto; overscroll-behavior: contain;
    background: var(--c-soft); border: 3px solid var(--c-primary-ink); box-shadow: 9px 9px 0 color-mix(in srgb, var(--c-primary) 22%, transparent); padding: 1.5rem 1.4rem 1.1rem;
    background-image: radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--c-primary) 11%, transparent) 1px, transparent 1.4px); background-size: 17px 17px;
    visibility: hidden; opacity: 0; transform: translateY(-22px) rotate(-3.2deg); transform-origin: 92% 0; transition: transform .55s cubic-bezier(.2, .9, .2, 1.08), opacity .22s, visibility 0s .55s; }
.dv-sheet.is-on { visibility: visible; opacity: 1; transform: rotate(-.5deg); transition-delay: 0s; }
.dv-sheet__tape { top: -12px; left: 12%; }
.dv-sheet__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.dv-sheet__t { margin: 0; font: 800 .7rem/1 var(--f-b); letter-spacing: .18em; text-transform: uppercase; color: var(--c-muted); } .dv-sheet__t span { color: var(--c-accent-ink); }
.dv-sheet__x { width: 38px; height: 38px; display: grid; place-items: center; background: var(--c-bg); border: var(--ink-l); border-radius: 50%; } .dv-sheet__x svg { width: 18px; height: 18px; }
.dv-labels { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .95rem; }
.dv-lab { position: relative; }
.dv-lab__a { position: relative; display: grid; grid-template-rows: auto 1fr auto; gap: .2rem; min-height: 142px; padding: .7rem .75rem .75rem; background: var(--c-bg); border: var(--ink-l); border-radius: var(--r); transition: transform .22s var(--ease), box-shadow .22s var(--ease), background .2s; transform: rotate(calc((var(--n) - 3) * .35deg)); }
.dv-lab__a::before { content: ""; position: absolute; top: 7px; right: 8px; width: 9px; height: 9px; border-radius: 50%; border: 2px solid var(--c-border-2); }
.dv-lab__a:hover, .dv-lab__a:focus-visible { transform: rotate(calc((var(--n) - 3) * -.5deg)) translateY(-4px); box-shadow: var(--hard-s); background: var(--c-soft); }
.dv-lab__no { font: 800 .62rem/1 var(--f-b); letter-spacing: .16em; text-transform: uppercase; color: var(--c-muted); }
.dv-lab__sym { width: 56px; height: 56px; justify-self: center; align-self: center; }
.dv-lab__t { font: 400 1.5rem/1.05 var(--f-d); color: var(--c-ink); }
.dv-lab.is-cur .dv-lab__a { border-color: var(--c-accent-ink); background: color-mix(in srgb, var(--c-accent) 7%, var(--c-bg)); }
.dv-lab__here { position: absolute; right: 8px; top: 1.7rem; padding: .18rem .4rem; border: 2px solid var(--c-accent-ink); border-radius: 99px; color: var(--c-accent-ink); font: 800 .54rem/1 var(--f-b); letter-spacing: .12em; text-transform: uppercase; transform: rotate(-8deg); background: var(--c-bg); }
.dv-lab--go .dv-lab__a { background: var(--c-primary); border-color: var(--c-primary-dark); } .dv-lab--go .dv-lab__t, .dv-lab--go .dv-lab__no { color: var(--c-on-primary); } .dv-lab--go .k-l { stroke: var(--c-on-primary); } .dv-lab--go .k-f { fill: color-mix(in srgb, var(--c-bg) 16%, var(--c-primary)); }
.dv-sheet .k-l, .dv-sheet .k-r { stroke-dasharray: 1; stroke-dashoffset: 0; }
.dv-sheet.is-on .k-l, .dv-sheet.is-on .k-r { animation: dv-draw .9s cubic-bezier(.5, 0, .2, 1) backwards; animation-delay: calc(.25s + var(--n, 0) * .07s + var(--i, 0) * .07s); }
.dv-lab.has-sub { display: grid; }
.dv-sub__subtoggle { position: absolute; z-index: 2; top: .35rem; left: .45rem; width: 24px; height: 24px; display: grid; place-items: center; background: var(--c-soft); border: 2px solid var(--c-primary-ink); border-radius: 50%; font-size: .75rem; line-height: 1; padding: 0; }
.dv-sub__sub { display: none; margin-top: .4rem; padding: .5rem .7rem; border: 2px dashed var(--c-border-2); background: var(--c-bg); font-size: .85rem; } .dv-lab.is-open .dv-sub__sub { display: grid; gap: .25rem; } .dv-sub__sub a:hover { color: var(--c-accent-ink); text-decoration: underline; }
.dv-sheet__foot { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1.6rem; margin-top: 1.1rem; padding-top: .9rem; border-top: 2px dashed var(--c-border-2); font-size: .9rem; }
.dv-sheet__age { display: inline-flex; align-items: center; gap: .6rem; margin: 0; } .dv-sheet__age b { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; border: 3px double var(--c-accent-ink); color: var(--c-accent-ink); font: 400 1.35rem/1 var(--f-d); transform: rotate(-8deg); } .dv-sheet__age span { font-size: .8rem; color: var(--c-muted); max-width: 11rem; line-height: 1.3; }
.dv-sheet__tel { display: inline-flex; align-items: center; gap: .45rem; font-weight: 800; color: var(--c-primary-ink); } .dv-sheet__tel svg { width: 17px; height: 17px; color: var(--c-accent); }
.dv-sheet__h { margin: 0; color: var(--c-muted); font-size: .8rem; flex: 1 1 14rem; }

/* alt çubuk (mobil) */
.dv-dock { display: none; position: fixed; z-index: 92; left: 0; right: 0; bottom: 0; padding: .55rem .6rem calc(.55rem + env(safe-area-inset-bottom)); gap: .55rem; background: color-mix(in srgb, var(--c-bg) 97%, transparent); border-top: var(--ink-l); view-transition-name: dv-dock; }
.dv-dock__a { flex: 1; display: flex; flex-direction: column; align-items: center; gap: .15rem; padding: .45rem .3rem; border: 2px dashed var(--c-primary-ink); border-radius: var(--r); font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--c-primary-ink); background: var(--c-soft); }
.dv-dock__a svg { width: 20px; height: 20px; }
.dv-dock__a--go { background: var(--c-accent); color: var(--c-on-accent); border: 2px solid var(--c-accent-ink); }
.dv-fab { position: fixed; right: 14px; bottom: 24px; z-index: 70; }

/* ── hero: flash sayfası ── */
.dv-hero { padding: clamp(2.4rem, 5vw, 4.4rem) 0 clamp(3rem, 6vw, 5.4rem); position: relative; }
.dv-hero__t { font-size: clamp(2.7rem, 8.4vw, 7.2rem); line-height: .94; margin: 0 0 clamp(1.4rem, 3vw, 2.4rem); }
.dv-hl { display: block; width: fit-content; position: relative; }
.dv-hl--1 { padding-left: clamp(1rem, 8vw, 7rem); color: var(--c-primary-ink); }
.dv-hl--2 { padding-left: clamp(.4rem, 3vw, 3rem); }
.dv-hl--2::after { content: ""; position: absolute; left: clamp(.4rem, 3vw, 3rem); right: 0; bottom: .03em; height: .12em; background: var(--c-accent); transform-origin: 0 50%; border-radius: 99px; opacity: .9; z-index: -1; }
.js .dv-hl { clip-path: inset(-10% 100% -10% 0); }
.js .dv-hero.is-go .dv-hl { animation: dv-wipe .85s var(--ease) forwards; animation-delay: calc(var(--l) * .38s); }
.js .dv-hero.is-go .dv-hl--2::after { animation: dv-grow .7s var(--ease) 1.5s backwards; }
@keyframes dv-wipe { to { clip-path: inset(-10% -4% -10% 0); } }
@keyframes dv-grow { from { transform: scaleX(0); } }
.dv-hero__stage { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1.4rem; align-items: start; }
.dv-flash { grid-column: 1 / 9; grid-row: 1; position: relative; margin: 0; padding: 1.3rem 3.8rem 1rem 1.3rem; background: var(--c-soft); border: 3px solid var(--c-primary-ink); box-shadow: 9px 9px 0 color-mix(in srgb, var(--c-primary) 18%, transparent); transform: rotate(-.7deg);
    background-image: radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--c-primary) 12%, transparent) 1px, transparent 1.4px); background-size: 17px 17px; }
.dv-flash__top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0 0 .4rem 1rem; font: 800 .7rem/1.2 var(--f-b); letter-spacing: .2em; text-transform: uppercase; color: var(--c-muted); }
.dv-flash__top .dv-ring { width: 74px; height: 74px; font-size: .6rem; margin-right: 1rem; }
.dv-flash__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-rows: 168px; gap: .3rem .4rem; padding: .4rem 1rem 0; }
.dv-fl { display: grid; grid-template-rows: minmax(0, 1fr) auto; min-height: 0; padding: .4rem .5rem .3rem; position: relative; }
.dv-fl .dv-sym { width: 100%; height: 100%; min-height: 0; }
.dv-fl__cap { display: block; margin-top: .25rem; font: 700 .62rem/1.25 var(--f-b); letter-spacing: .06em; text-transform: uppercase; color: var(--c-muted); } .dv-fl__cap b { display: block; color: var(--c-accent-ink); }
.dv-fl--1 { grid-area: 1 / 1 / 3 / 3; } .dv-fl--2 { grid-area: 1 / 3 / 2 / 5; } .dv-fl--3 { grid-area: 1 / 5 / 2 / 6; } .dv-fl--4 { grid-area: 1 / 6 / 3 / 7; }
.dv-fl--5 { grid-area: 2 / 3 / 4 / 4; } .dv-fl--6 { grid-area: 2 / 4 / 3 / 6; } .dv-fl--7 { grid-area: 3 / 1 / 4 / 2; } .dv-fl--8 { grid-area: 3 / 2 / 4 / 3; } .dv-fl--9 { grid-area: 3 / 4 / 4 / 7; }
.dv-fl--1 .dv-sym { padding: .4rem; }
.dv-flash__note { margin: .7rem 1rem 0; padding-top: .6rem; border-top: 2px dashed var(--c-border-2); font-size: .8rem; color: var(--c-muted); line-height: 1.45; }
.dv-slip { grid-column: 9 / 13; grid-row: 1; margin-left: -3.6rem; align-self: end; position: relative; margin-bottom: clamp(1rem, 3vw, 2.4rem); padding: 1.5rem 1.4rem 1.3rem; background: var(--c-bg); border: var(--ink-l); box-shadow: var(--hard); transform: rotate(1.4deg); z-index: 2; }
.dv-slip__tape { left: 30%; }
.dv-slip__k { margin: 0 0 .3rem; font: 400 2rem/1 var(--f-d); color: var(--c-primary-ink); }
.dv-hero__s { margin: 0 0 .7rem; font-size: 1.04rem; line-height: 1.55; color: var(--c-ink-soft); }
.dv-slip__x { margin: 0 0 1.2rem; font-size: .9rem; color: var(--c-muted); }
.dv-hero__act { display: flex; flex-wrap: wrap; gap: .9rem; }
.dv-hero__chips { display: grid; gap: .35rem; margin: 1.3rem 0 0; font-size: .86rem; font-weight: 700; color: var(--c-ink-soft); } .dv-hero__chips li { display: flex; gap: .5rem; align-items: center; } .dv-hero__chips svg { width: 16px; height: 16px; flex: none; color: var(--c-accent); }
.dv-slip__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin: 1.3rem 0 0; padding-top: 1rem; border-top: 2px dashed var(--c-border-2); }
.dv-slip__stats div { display: flex; flex-direction: column-reverse; gap: .15rem; } .dv-slip__stats dd { margin: 0; font: 400 1.65rem/1 var(--f-d); color: var(--c-primary-ink); } .dv-slip__stats dt { font-size: .66rem; line-height: 1.25; color: var(--c-muted); font-weight: 700; letter-spacing: .04em; }

/* ── stil kartları ── */
.dv-cards { columns: 3; column-gap: 1.6rem; }
.dv-st { break-inside: avoid; margin: 0 0 1.7rem; position: relative; }
.dv-st__a { display: block; position: relative; padding: .7rem .7rem 1rem; background: var(--c-soft); border: var(--ink-l); box-shadow: var(--hard); transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
.dv-st--0 .dv-st__a { transform: rotate(-.9deg); } .dv-st--1 .dv-st__a { transform: rotate(.7deg); } .dv-st--2 .dv-st__a { transform: rotate(-.4deg); } .dv-st--3 .dv-st__a { transform: rotate(.9deg); } .dv-st--4 .dv-st__a { transform: rotate(-.6deg); } .dv-st--5 .dv-st__a { transform: rotate(.5deg); }
.dv-st__a:hover { transform: rotate(0) translate(-3px, -4px); box-shadow: 8px 9px 0 color-mix(in srgb, var(--c-primary) 22%, transparent); }
.dv-st__no { position: absolute; z-index: 2; left: 1.1rem; top: 1.1rem; padding: .2rem .5rem; background: var(--c-bg); border: 2px solid var(--c-primary-ink); font: 800 .62rem/1.2 var(--f-b); letter-spacing: .14em; text-transform: uppercase; }
.dv-st__img { display: block; overflow: hidden; border: 2px solid var(--c-primary-ink); background: var(--c-surface); }
.dv-st__img img { width: 100%; object-fit: cover; transition: transform .6s var(--ease); } .dv-st__a:hover .dv-st__img img { transform: scale(1.04); }
.dv-st--0 .dv-st__img img, .dv-st--4 .dv-st__img img { aspect-ratio: 4 / 5; } .dv-st--1 .dv-st__img img, .dv-st--3 .dv-st__img img { aspect-ratio: 1 / 1; } .dv-st--2 .dv-st__img img, .dv-st--5 .dv-st__img img { aspect-ratio: 4 / 3; }
.dv-st__body { display: block; padding: .9rem .3rem 0; }
.dv-st__badge { display: inline-block; margin: 0 0 .5rem; padding: .2rem .55rem; background: var(--c-accent); color: var(--c-on-accent); font: 800 .6rem/1.2 var(--f-b); letter-spacing: .14em; text-transform: uppercase; transform: rotate(-1.5deg); }
.dv-st__t { display: block; font: 400 clamp(1.7rem, 2.6vw, 2.2rem)/1.04 var(--f-d); color: var(--c-ink); }
.dv-st__s { display: block; margin: .5rem 0 0; font-size: .9rem; line-height: 1.5; color: var(--c-ink-soft); }
.dv-st__row { display: flex; align-items: flex-end; justify-content: space-between; gap: .8rem; margin-top: .9rem; padding-top: .7rem; border-top: 2px dashed var(--c-border-2); }
.dv-st__p small { display: block; font: 800 .6rem/1 var(--f-b); letter-spacing: .16em; text-transform: uppercase; color: var(--c-muted); } .dv-st__p b { font: 400 2.1rem/1 var(--f-d); color: var(--c-accent-ink); }
.dv-st__d { display: inline-flex; align-items: center; gap: .35rem; font-size: .78rem; font-weight: 700; color: var(--c-ink-soft); } .dv-st__d svg { width: 15px; height: 15px; color: var(--c-accent); }
.dv-st__u { display: block; margin-top: .4rem; font-size: .76rem; color: var(--c-muted); line-height: 1.4; }
.dv-cards--rel { columns: 3; }

/* ── ön görüşmeden bakıma: iğne çizgisi ── */
.dv-run { position: relative; }
.dv-run__svg { position: absolute; left: 0; top: 0; width: 100%; height: 120px; overflow: hidden; }
.dv-run__svg path { vector-effect: non-scaling-stroke; stroke-width: 3; } .dv-run__svg .k-r { stroke-width: 2; stroke-dasharray: 1; }
.dv-run__ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); position: relative; }
.dv-stop { position: relative; padding: 0 1.5rem 0 0; }
.dv-stop__tag { display: inline-block; margin: 0 0 .5rem; padding: .25rem .6rem; border: 2px solid var(--c-primary-ink); background: var(--c-soft); font: 800 .64rem/1.2 var(--f-b); letter-spacing: .14em; text-transform: uppercase; color: var(--c-primary-ink); transform: rotate(-1.5deg); }
.dv-stop__n { position: absolute; left: 24%; top: 60px; width: 54px; height: 54px; margin: -27px 0 0 -27px; display: grid; place-items: center; border-radius: 50%; background: var(--c-bg); border: 3px solid var(--c-primary-ink); font: 400 1.9rem/1 var(--f-d); color: var(--c-accent-ink); box-shadow: 3px 3px 0 var(--c-accent); }
.dv-stop__t { margin: 5.4rem 0 .5rem; font-size: 1.8rem; } .dv-stop__x { margin: 0; font-size: .92rem; line-height: 1.55; color: var(--c-ink-soft); }
.dv-stop__tag { margin-bottom: 0; }
.dv-run [data-draw] { }
.js .dv-stop__n { opacity: 0; transform: scale(.6); } .js .dv-run.is-drawn .dv-stop__n { opacity: 1; transform: none; transition: opacity .3s, transform .45s cubic-bezier(.3, 1.6, .5, 1); transition-delay: calc(.35s + var(--n) * .45s); }
.dv-run.is-drawn .k-l { animation-duration: 2.2s; } .dv-run.is-drawn .k-r { animation-duration: 2.2s; animation-delay: .25s; }

/* ── portföy duvarı ── */
.dv-filter { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 0 0 1.8rem; }
.dv-filter__l { margin-right: .4rem; font: 800 .7rem/1 var(--f-b); letter-spacing: .16em; text-transform: uppercase; color: var(--c-muted); }
.dv-wall { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1.7rem 1.3rem; align-items: start; }
.dv-wall__i--0 { grid-column: span 5; } .dv-wall__i--1 { grid-column: span 4; margin-top: 2.2rem; } .dv-wall__i--2 { grid-column: span 3; } .dv-wall__i--3 { grid-column: span 3; } .dv-wall__i--4 { grid-column: span 4; margin-top: -1rem; } .dv-wall__i--5 { grid-column: span 5; margin-top: .8rem; }
.dv-wall--page .dv-wall__i--0, .dv-wall--page .dv-wall__i--3 { grid-column: span 4; } .dv-wall--page .dv-wall__i--1, .dv-wall--page .dv-wall__i--4 { grid-column: span 4; } .dv-wall--page .dv-wall__i--2, .dv-wall--page .dv-wall__i--5 { grid-column: span 4; margin-top: 0; }
.dv-gi { display: block; position: relative; padding: .6rem .6rem 0; background: var(--c-soft); border: var(--ink-l); box-shadow: var(--hard); transition: transform .3s var(--ease); }
.dv-wall__i:nth-child(odd) .dv-gi { transform: rotate(-1deg); } .dv-wall__i:nth-child(even) .dv-gi { transform: rotate(.8deg); } .dv-gi:hover { transform: rotate(0) translateY(-4px); }
.dv-gi img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border: 2px solid var(--c-primary-ink); }
.dv-gi__cap { display: block; padding: .6rem .2rem .7rem; font: 400 1.4rem/1.1 var(--f-d); color: var(--c-ink); }

/* ── fiyat rehberi: boyut ve fiyat hesaplayıcı ── */
.dv-guide { position: relative; margin: 0 0 3rem; padding: clamp(1.3rem, 3vw, 2.2rem); background: var(--c-soft); border: 3px solid var(--c-primary-ink); box-shadow: var(--hard); }
.dv-guide__head { display: flex; align-items: baseline; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; margin-bottom: 1.4rem; } .dv-guide__hint { margin: 0; max-width: 46ch; color: var(--c-ink-soft); font-size: .94rem; }
.dv-guide__body { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 1.6rem 2rem; align-items: start; }
.dv-guide__pick { display: contents; }
.dv-guide legend { display: flex; align-items: center; gap: .6rem; margin-bottom: .8rem; padding: 0; font: 800 .74rem/1 var(--f-b); letter-spacing: .16em; text-transform: uppercase; color: var(--c-primary-ink); } .dv-guide legend span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--c-accent); color: var(--c-on-accent); font-size: .72rem; }
.dv-guide__sizes { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .8rem; } .dv-guide__sizes legend { grid-column: 1 / -1; margin-bottom: 0; }
.dv-sz { position: relative; display: block; }
.dv-sz input, .dv-ex input, .dv-age-ck input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.dv-sz__box { display: grid; align-content: start; gap: .25rem; height: 100%; padding: .9rem .85rem 1rem; border: 2px dashed var(--c-border-2); background: var(--c-bg); transition: border-color .15s, background .15s, transform .15s, box-shadow .15s; }
.dv-sz:hover .dv-sz__box { border-color: var(--c-primary-ink); }
.dv-sz input:checked + .dv-sz__box { border: 2px solid var(--c-primary-ink); background: color-mix(in srgb, var(--c-primary) 6%, var(--c-bg)); box-shadow: var(--hard-s); transform: translateY(-2px); }
.dv-sz input:focus-visible + .dv-sz__box { outline: 3px solid var(--c-accent); outline-offset: 3px; }
.dv-sz__ico { display: block; width: calc(14px + var(--s) * 9px); height: calc(14px + var(--s) * 9px); margin-bottom: .35rem; border: 2px dashed var(--c-accent); background: color-mix(in srgb, var(--c-accent) 8%, transparent); }
.dv-sz__n { font: 400 1.6rem/1 var(--f-d); color: var(--c-ink); } .dv-sz__m { font-size: .78rem; line-height: 1.35; color: var(--c-muted); } .dv-sz__p { font-size: .82rem; font-weight: 800; color: var(--c-primary-ink); } .dv-sz__box small { font-size: .74rem; line-height: 1.35; color: var(--c-ink-soft); }
.dv-guide__extras { grid-column: 1; grid-row: 2; display: grid; gap: .6rem; align-content: start; }
.dv-ex { position: relative; display: flex; align-items: center; gap: .75rem; padding: .65rem .8rem; border: 2px dashed var(--c-border-2); background: var(--c-bg); transition: border-color .15s, background .15s; }
.dv-ex__b { flex: none; width: 24px; height: 24px; display: grid; place-items: center; border: 2px solid var(--c-primary-ink); background: var(--c-soft); } .dv-ex__b svg { width: 16px; height: 16px; color: var(--c-on-accent); opacity: 0; transform: scale(.4); transition: .18s; }
.dv-ex input:checked ~ .dv-ex__b { background: var(--c-accent); border-color: var(--c-accent-ink); } .dv-ex input:checked ~ .dv-ex__b svg { opacity: 1; transform: none; } .dv-ex:has(input:checked) { border: 2px solid var(--c-primary-ink); }
.dv-ex input:focus-visible ~ .dv-ex__b { outline: 3px solid var(--c-accent); outline-offset: 2px; }
.dv-ex__t { display: grid; line-height: 1.3; } .dv-ex__t b { font-size: .9rem; } .dv-ex__t small { font-size: .76rem; color: var(--c-muted); }
.dv-guide__out { grid-column: 2; grid-row: 2; align-self: start; position: relative; padding: 1.5rem 1.2rem 1.2rem; background: var(--c-bg); border: var(--ink-l); box-shadow: var(--hard-s); transform: rotate(1deg); }
.dv-guide__sum { margin: 0 0 .7rem; font: 400 clamp(3rem, 5vw, 4rem)/1 var(--f-d); color: var(--c-accent-ink); }
.dv-guide__dl { margin: 0 0 1.1rem; display: grid; gap: .5rem; } .dv-guide__dl div { display: flex; justify-content: space-between; gap: 1rem; padding-bottom: .4rem; border-bottom: 2px dashed var(--c-border-2); font-size: .84rem; } .dv-guide__dl dt { color: var(--c-muted); font-weight: 700; } .dv-guide__dl dd { margin: 0; text-align: right; font-weight: 800; color: var(--c-ink); }
.dv-guide__hour { margin: 1.3rem 0 0; padding: .7rem 1rem; border: 2px dashed var(--c-border-2); background: var(--c-bg); font-size: .9rem; font-weight: 700; color: var(--c-primary-ink); }
.dv-guide__body:not(.is-js) { grid-template-columns: minmax(0, 1fr); }

/* ── seans paketleri: delikli bilet ── */
.dv-tixs { display: grid; gap: 1.6rem; }
.dv-tix { position: relative; display: grid; grid-template-columns: 74px minmax(0, 1fr) 250px; background: var(--c-soft); border: 3px solid var(--c-primary-ink); box-shadow: var(--hard); }
.dv-tixs .dv-tix:nth-child(2) { margin-left: clamp(0rem, 6vw, 5rem); } .dv-tixs .dv-tix:nth-child(3) { margin-right: clamp(0rem, 6vw, 5rem); }
.dv-tix__stub { display: grid; align-content: center; justify-items: center; gap: .15rem; padding: .8rem .3rem; background: var(--c-primary); color: var(--c-on-primary); border-right: 3px dashed var(--c-bg); }
.dv-tix__stub span { font: 800 .6rem/1 var(--f-b); letter-spacing: .18em; text-transform: uppercase; opacity: .85; } .dv-tix__stub b { font: 400 2.4rem/1 var(--f-d); } .dv-tix__stub i { width: 30px; height: 26px; margin-top: .5rem; background: repeating-linear-gradient(90deg, var(--c-on-primary) 0 2px, transparent 2px 5px); opacity: .8; }
.dv-tix__main { padding: 1.3rem 1.5rem; min-width: 0; }
.dv-tix__badge { display: inline-block; margin: 0 0 .5rem; padding: .2rem .55rem; background: var(--c-accent); color: var(--c-on-accent); font: 800 .6rem/1.2 var(--f-b); letter-spacing: .14em; text-transform: uppercase; transform: rotate(-1.5deg); }
.dv-tix__t { font-size: clamp(1.8rem, 3vw, 2.4rem); } .dv-tix__t a:hover { color: var(--c-primary-ink); text-decoration: underline; text-decoration-color: var(--c-accent); text-decoration-thickness: 3px; }
.dv-tix__s { margin: .5rem 0 .9rem; font-size: .94rem; color: var(--c-ink-soft); }
.dv-tix__l { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .3rem 1.2rem; font-size: .84rem; } .dv-tix__l li { display: flex; gap: .45rem; align-items: flex-start; line-height: 1.4; } .dv-tix__l svg { flex: none; width: 15px; height: 15px; margin-top: .15rem; color: var(--c-accent); }
.dv-tix__price { position: relative; display: grid; align-content: center; justify-items: start; gap: .2rem; padding: 1.2rem 1.4rem; border-left: 3px dashed var(--c-primary-ink); background: var(--c-bg); }
.dv-tix__price::before, .dv-tix__price::after { content: ""; position: absolute; left: -14px; width: 24px; height: 24px; border-radius: 50%; background: var(--c-bg); border: 3px solid var(--c-primary-ink); }
.dv-tix__price::before { top: -15px; clip-path: inset(50% 0 0 0); } .dv-tix__price::after { bottom: -15px; clip-path: inset(0 0 50% 0); }
.dv-tix__price small { font: 800 .62rem/1 var(--f-b); letter-spacing: .16em; text-transform: uppercase; color: var(--c-muted); } .dv-tix__price b { font: 400 3rem/1 var(--f-d); color: var(--c-accent-ink); } .dv-tix__price em { margin-bottom: .6rem; font-style: normal; font-size: .78rem; color: var(--c-muted); line-height: 1.35; }

/* ── stüdyo kuralları: onam formu ── */
.dv-form { position: relative; display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: clamp(1.5rem, 3vw, 2.6rem); padding: clamp(1.5rem, 3vw, 2.4rem); background: var(--c-soft); border: 3px solid var(--c-primary-ink); box-shadow: var(--hard); }
.dv-form::before { content: "ONAM VE KURALLAR · FORM 18"; position: absolute; top: -.78rem; left: 1.4rem; padding: .2rem .7rem; background: var(--c-bg); border: 2px solid var(--c-primary-ink); font: 800 .62rem/1.2 var(--f-b); letter-spacing: .18em; color: var(--c-primary-ink); }
.dv-age { align-self: start; text-align: center; padding: 1rem; border: 2px dashed var(--c-border-2); background: var(--c-bg); }
.dv-age__ring { position: relative; display: grid; place-items: center; width: 150px; height: 150px; margin: 0 auto .8rem; border-radius: 50%; border: 5px double var(--c-accent-ink); color: var(--c-accent-ink); transform: rotate(-8deg); } .dv-age__ring b { font: 400 5.4rem/1 var(--f-d); } .dv-age__ring i { position: absolute; inset: 7px; border-radius: 50%; border: 2px dashed var(--c-accent); opacity: .6; }
.js .dv-form:not(.is-drawn) .dv-age__ring { transform: rotate(-24deg) scale(1.4); opacity: 0; } .dv-form.is-drawn .dv-age__ring { transition: transform .55s cubic-bezier(.3, 1.5, .5, 1), opacity .2s; }
.dv-age__t { margin: 0; font: 800 .74rem/1.2 var(--f-b); letter-spacing: .18em; text-transform: uppercase; color: var(--c-accent-ink); } .dv-age__x { margin: .6rem 0 0; font-size: .86rem; line-height: 1.5; color: var(--c-ink-soft); }
.dv-form__l { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 2rem; align-content: start; }
.dv-rule { position: relative; padding-left: 2.6rem; }
.dv-rule__box { position: absolute; left: 0; top: .1rem; width: 28px; height: 28px; border: 2px solid var(--c-primary-ink); background: var(--c-bg); } .dv-rule__box svg { width: 100%; height: 100%; padding: 2px; overflow: visible; } .dv-rule__box .k-r { stroke-width: 3.4; }
.dv-form .dv-rule__box .k-r { --d: calc(.5s + var(--n, 0) * .22s); }
.dv-rule__t { margin: 0 0 .3rem; font: 400 1.5rem/1.1 var(--f-d); } .dv-rule__x { margin: 0; font-size: .9rem; line-height: 1.55; color: var(--c-ink-soft); }

/* ── stüdyodan notlar ve masalar ── */
.dv-notes__in { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 4vw, 3.6rem); align-items: start; }
.dv-desks .dv-h3 { margin-bottom: 1rem; }
.dv-desk { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 1rem; align-items: center; padding: .9rem 0; border-bottom: 2px dashed var(--c-border-2); }
.dv-desk__sym { width: 64px; height: 64px; padding: 6px; border: var(--ink-l); background: var(--c-soft); border-radius: 50%; }
.dv-desk b { display: block; font: 400 1.6rem/1.1 var(--f-d); } .dv-desk span { display: block; font-size: .84rem; font-weight: 800; color: var(--c-accent-ink); letter-spacing: .02em; } .dv-desk small { display: block; font-size: .84rem; color: var(--c-muted); line-height: 1.4; }
.dv-notelist { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.6rem 1.3rem; }
.dv-nt { position: relative; padding: 1.5rem 1.2rem 1.1rem; background: var(--c-soft); border: 2px solid var(--c-primary-ink); box-shadow: var(--hard-s); }
.dv-nt--0 { transform: rotate(-1.1deg); } .dv-nt--1 { transform: rotate(.9deg); margin-top: 1.2rem; } .dv-nt--2 { transform: rotate(.6deg); } .dv-nt--3 { transform: rotate(-.8deg); margin-top: 1.2rem; }
.dv-nt__no { position: absolute; right: .8rem; top: .6rem; font: 800 .6rem/1 var(--f-b); letter-spacing: .16em; text-transform: uppercase; color: var(--c-muted); }
.dv-nt__t { margin: 0 0 .5rem; font: 400 1.45rem/1.1 var(--f-d); } .dv-nt__x { margin: 0 0 .7rem; font-size: .88rem; line-height: 1.55; color: var(--c-ink-soft); } .dv-nt__w { margin: 0; font: 800 .64rem/1.3 var(--f-b); letter-spacing: .14em; text-transform: uppercase; color: var(--c-accent-ink); }

/* ── ulaşım: ilçe damgaları ── */
.dv-stamps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2.2rem 1.2rem; }
.dv-stamp { text-align: center; color: var(--c-primary-ink); }
.dv-stamp.is-hot { color: var(--c-accent-ink); }
.dv-stamp__svg { width: min(100%, 178px); aspect-ratio: 1; margin: 0 auto .5rem; overflow: visible; }
.dv-stamp--0 .dv-stamp__svg { transform: rotate(-7deg); } .dv-stamp--1 .dv-stamp__svg { transform: rotate(5deg); } .dv-stamp--2 .dv-stamp__svg { transform: rotate(-3deg); } .dv-stamp--3 .dv-stamp__svg { transform: rotate(8deg); }
.dv-stamp__svg .r1 { fill: none; stroke: currentColor; stroke-width: 4; } .dv-stamp__svg .r2 { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-dasharray: 3 5; }
.dv-stamp__svg .arc { font: 800 14.5px var(--f-b); letter-spacing: .2em; text-transform: uppercase; fill: currentColor; } .dv-stamp__svg .arc--b { font-size: 15px; }
.dv-stamp__svg .num { font: 400 74px var(--f-d); fill: currentColor; } .dv-stamp__svg .unit { font: 800 13px var(--f-b); letter-spacing: .24em; text-transform: uppercase; fill: currentColor; } .dv-stamp__svg .dot { fill: currentColor; }
.dv-stamp__svg .k-l, .dv-stamp__svg .k-r { stroke: currentColor; fill: none; stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; } .dv-stamp__svg .k-f { fill: color-mix(in srgb, currentColor 12%, transparent); }
.dv-stamp__n { margin: 0; font: 400 1.5rem/1.1 var(--f-d); color: var(--c-ink); } .dv-stamp__d { margin: .1rem 0 .3rem; font: 800 .7rem/1.3 var(--f-b); letter-spacing: .1em; text-transform: uppercase; color: var(--c-accent-ink); } .dv-stamp__s { margin: 0; font-size: .8rem; line-height: 1.45; color: var(--c-muted); max-width: 22ch; margin-inline: auto; }
.js .dv-stamps:not(.is-in) .dv-stamp { opacity: 0; } .js .dv-stamps.is-in .dv-stamp { animation: dv-press .6s cubic-bezier(.3, 1.4, .5, 1) backwards; animation-delay: calc(var(--k, 0) * .09s); }
.dv-stamps .dv-stamp:nth-child(1) { --k: 1; } .dv-stamps .dv-stamp:nth-child(2) { --k: 2; } .dv-stamps .dv-stamp:nth-child(3) { --k: 3; } .dv-stamps .dv-stamp:nth-child(4) { --k: 4; } .dv-stamps .dv-stamp:nth-child(5) { --k: 5; } .dv-stamps .dv-stamp:nth-child(6) { --k: 6; } .dv-stamps .dv-stamp:nth-child(7) { --k: 7; } .dv-stamps .dv-stamp:nth-child(8) { --k: 8; }
@keyframes dv-press { from { opacity: 0; transform: scale(1.35) rotate(-10deg); } 60% { opacity: 1; } }

/* ── bakım günlüğü ── */
.dv-care { position: relative; margin: 0 0 clamp(2rem, 4vw, 3.4rem); padding: clamp(1.3rem, 3vw, 2.2rem); background: var(--c-soft); border: 3px solid var(--c-primary-ink); box-shadow: var(--hard); }
.dv-care__head { display: flex; align-items: center; gap: 1.1rem; margin-bottom: 1.4rem; } .dv-care__head p { margin: .2rem 0 0; color: var(--c-ink-soft); font-size: .92rem; }
.dv-care__sym { flex: none; width: 70px; height: 70px; padding: 8px; border-radius: 50%; border: var(--ink-l); background: var(--c-bg); }
.dv-care__body { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 2rem; }
.dv-care__tabs { display: grid; align-content: start; gap: .1rem; border-left: 3px solid var(--c-primary-ink); }
.dv-care__tab { display: flex; align-items: baseline; gap: .6rem; width: 100%; padding: .65rem .9rem; background: none; border: 0; border-bottom: 2px dashed var(--c-border-2); text-align: left; font: 800 .82rem/1.3 var(--f-b); color: var(--c-ink-soft); transition: background .15s, padding .2s var(--ease); }
.dv-care__tab small { font: 800 .64rem/1 var(--f-b); letter-spacing: .14em; color: var(--c-accent-ink); }
.dv-care__tab:hover { background: var(--c-bg); } .dv-care__tab.is-on { background: var(--c-primary); color: var(--c-on-primary); padding-left: 1.3rem; } .dv-care__tab.is-on small { color: var(--c-on-primary); opacity: .8; }
.dv-care__panels { min-width: 0; }
.dv-care__p { padding: 1rem 1.2rem 1.2rem; background: var(--c-bg); border: 2px solid var(--c-primary-ink); min-height: 100%; }
.dv-care__p + .dv-care__p { margin-top: 1rem; }
.dv-care.is-js .dv-care__p { display: none; } .dv-care.is-js .dv-care__p.is-on { display: block; animation: dv-pop .35s ease; }
.dv-care__when { margin: 0 0 .3rem; font: 800 .7rem/1 var(--f-b); letter-spacing: .18em; text-transform: uppercase; color: var(--c-accent-ink); } .dv-care__t { font-size: clamp(1.9rem, 3.4vw, 2.6rem); margin-bottom: .6rem; } .dv-care__x { margin: 0; font-size: 1rem; line-height: 1.7; color: var(--c-ink-soft); max-width: 56ch; }

/* ── rehber yazıları ── */
.dv-art__grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 1.4rem 2rem; align-items: start; } .dv-art__rest { display: grid; gap: 1.4rem; }
.dv-a { display: grid; gap: 1rem; color: inherit; }
.dv-a__img { position: relative; display: block; padding: .5rem; background: var(--c-soft); border: var(--ink-l); box-shadow: var(--hard-s); overflow: visible; }
.dv-a__img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border: 2px solid var(--c-primary-ink); }
.dv-a__img--tile { display: grid; place-items: center; aspect-ratio: 4 / 3; } .dv-a__img--tile svg { width: 40px; height: 40px; }
.dv-a__body { display: grid; gap: .35rem; }
.dv-a__cat { font: 800 .64rem/1 var(--f-b); letter-spacing: .18em; text-transform: uppercase; color: var(--c-accent-ink); }
.dv-a__t { font: 400 clamp(1.5rem, 2.4vw, 1.95rem)/1.08 var(--f-d); color: var(--c-ink); } .dv-a--lead .dv-a__t { font-size: clamp(2rem, 3.4vw, 2.8rem); }
.dv-a:hover .dv-a__t { text-decoration: underline; text-decoration-color: var(--c-accent); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.dv-a__x { font-size: .9rem; line-height: 1.55; color: var(--c-ink-soft); } .dv-a__m { font-size: .76rem; color: var(--c-muted); font-weight: 700; }
.dv-a:not(.dv-a--lead) { grid-template-columns: 150px minmax(0, 1fr); align-items: start; padding-bottom: 1.2rem; border-bottom: 2px dashed var(--c-border-2); } .dv-a:not(.dv-a--lead) .dv-a__x { display: none; } .dv-a:not(.dv-a--lead) .dv-a__t { font-size: 1.45rem; }
.dv-art__grid--page .dv-a:not(.dv-a--lead) .dv-a__x { display: block; }

/* ── kapanış ── */
.dv-cta__in { position: relative; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(1.8rem, 4vw, 3.4rem); align-items: center; padding: clamp(1.8rem, 4vw, 3.4rem); background: var(--c-soft); border: 3px solid var(--c-primary-ink); box-shadow: 9px 9px 0 color-mix(in srgb, var(--c-primary) 18%, transparent); }
.dv-cta__x { max-width: 46ch; margin: 1rem 0 1.6rem; font-size: 1.05rem; color: var(--c-ink-soft); }
.dv-cta__act { display: flex; flex-wrap: wrap; gap: .9rem; }
.dv-check { position: relative; padding: 1.6rem 1.3rem 1.2rem; background: var(--c-bg); border: var(--ink-l); box-shadow: var(--hard-s); transform: rotate(1.3deg); }
.dv-check__t { margin: 0 0 1rem; font-size: 1.8rem; }
.dv-check ul { display: grid; gap: .75rem; } .dv-check li { display: flex; gap: .75rem; align-items: flex-start; }
.dv-check__box { flex: none; width: 24px; height: 24px; display: grid; place-items: center; background: var(--c-accent); border: 2px solid var(--c-accent-ink); color: var(--c-on-accent); } .dv-check__box svg { width: 15px; height: 15px; }
.dv-check li div { display: grid; line-height: 1.35; } .dv-check li b { font-size: .92rem; } .dv-check li span { font-size: .84rem; color: var(--c-muted); }

/* ── iç sayfa başlığı ── */
.dv-ph { position: relative; padding: clamp(2.2rem, 5vw, 4rem) 0 clamp(1.6rem, 3vw, 2.6rem); border-bottom: 3px solid var(--c-primary-ink); background: color-mix(in srgb, var(--c-surface) 70%, transparent); }
.dv-ph::after { content: ""; position: absolute; left: 0; right: 0; bottom: -9px; height: 3px; background: repeating-linear-gradient(90deg, var(--c-primary-ink) 0 14px, transparent 14px 22px); opacity: .45; }
.dv-ph__in { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 2rem; align-items: end; }
.dv-ph__no { margin: 0 0 .6rem; font: 800 .72rem/1.2 var(--f-b); letter-spacing: .18em; text-transform: uppercase; color: var(--c-accent-ink); } .dv-ph__no b { font-size: 1rem; }
.dv-ph__t { font-size: clamp(2.7rem, 7.2vw, 5.8rem); line-height: .98; } .dv-ph__t--read { font-size: clamp(2.2rem, 5.2vw, 4rem); max-width: 22ch; }
.dv-ph__ink { width: min(340px, 64%); height: 14px; margin: .4rem 0 .9rem; overflow: visible; } .dv-ph__ink path { fill: none; stroke: var(--c-accent); stroke-width: 3.6; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.dv-ph .dv-ph__ink path { stroke-dasharray: 1; stroke-dashoffset: 0; }
.js .dv-ph:not(.is-drawn) .dv-ph__ink path { stroke-dashoffset: 1; } .dv-ph.is-drawn .dv-ph__ink path { animation: dv-draw .9s .2s var(--ease) backwards; }
.dv-ph__l { max-width: 54ch; margin: 0; font-size: 1.1rem; line-height: 1.6; color: var(--c-ink-soft); }
.dv-ph__art { width: 170px; height: 170px; padding: 18px; justify-self: end; border-radius: 50%; border: 3px double var(--c-primary-ink); background: var(--c-soft); transform: rotate(5deg); box-shadow: 5px 5px 0 var(--c-accent); }
.dv-ph--narrow .dv-ph__art { width: 120px; height: 120px; padding: 12px; }
.dv-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: 0 0 1rem; font-size: .8rem; font-weight: 700; color: var(--c-muted); } .dv-crumbs a:hover { color: var(--c-accent-ink); text-decoration: underline; } .dv-crumbs [aria-current] { color: var(--c-ink); }

/* ── stil kataloğu ── */
.dv-index { display: flex; flex-wrap: wrap; gap: .6rem; margin: 0 0 clamp(2rem, 4vw, 3.4rem); }
.dv-index a { display: inline-flex; align-items: baseline; gap: .5rem; padding: .5rem .9rem; background: var(--c-soft); border: var(--ink-l); font: 400 1.25rem/1.1 var(--f-d); transition: transform .15s var(--ease), background .15s; } .dv-index a small { font: 800 .62rem/1 var(--f-b); letter-spacing: .14em; color: var(--c-accent-ink); } .dv-index a:hover { transform: rotate(-1.5deg) translateY(-2px); background: var(--c-bg); }
.dv-spread { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(1.5rem, 4vw, 3.6rem); align-items: center; padding-block: clamp(1.6rem, 3vw, 2.6rem); border-bottom: 2px dashed var(--c-border-2); }
.dv-spread.is-flip .dv-spread__img { order: 2; transform: rotate(1.2deg); }
.dv-spread__img { position: relative; display: block; padding: .6rem; background: var(--c-soft); border: var(--ink-l); box-shadow: var(--hard); transform: rotate(-1.2deg); } .dv-spread__img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border: 2px solid var(--c-primary-ink); }
.dv-gi__tape { top: -12px; }
.dv-spread__main { position: relative; display: grid; gap: .7rem; justify-items: start; }
.dv-spread__no { position: absolute; right: 0; top: -1.2rem; margin: 0; font: 400 clamp(5rem, 11vw, 9rem)/1 var(--f-d); color: transparent; -webkit-text-stroke: 2px color-mix(in srgb, var(--c-primary) 20%, transparent); pointer-events: none; z-index: 0; } .dv-spread__main > *:not(.dv-spread__no) { position: relative; z-index: 1; }
.dv-spread__t { font-size: clamp(2.2rem, 4.4vw, 3.4rem); } .dv-spread__t a:hover { color: var(--c-primary-ink); }
.dv-spread__s { margin: 0; max-width: 46ch; color: var(--c-ink-soft); }
.dv-spread__meta { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; font-size: .82rem; font-weight: 700; color: var(--c-ink-soft); } .dv-spread__meta li { display: inline-flex; align-items: center; gap: .4rem; } .dv-spread__meta svg { width: 15px; height: 15px; color: var(--c-accent); }
.dv-spread__p { margin: 0; display: flex; align-items: baseline; gap: .6rem; } .dv-spread__p small { font: 800 .64rem/1 var(--f-b); letter-spacing: .16em; text-transform: uppercase; color: var(--c-muted); } .dv-spread__p b { font: 400 2.8rem/1 var(--f-d); color: var(--c-accent-ink); }

/* ── stil föyü ve künye ── */
.dv-sd { padding: clamp(2rem, 4vw, 3.4rem) 0 0; }
.dv-sd__in { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(1.5rem, 4vw, 3.4rem); align-items: center; }
.dv-sd__img { position: relative; margin: 0; padding: 1.4rem; background: var(--c-soft); border: 3px solid var(--c-primary-ink); box-shadow: var(--hard); transform: rotate(1.2deg); } .dv-sd__img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border: 2px solid var(--c-primary-ink); }
.dv-sd__cols { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.dv-sd__main .dv-h3 { margin: 2.2rem 0 1rem; } .dv-sd__copy .dv-ph__l { margin-top: 1rem; } .dv-sd__copy .dv-hero__act { margin-top: 1.5rem; } .dv-sd__copy .dv-k { margin-top: 1.2rem; }
.dv-steps { counter-reset: s; display: grid; gap: .8rem; } .dv-steps li { counter-increment: s; position: relative; padding: .8rem 1rem .8rem 3.6rem; background: var(--c-soft); border: 2px solid var(--c-primary-ink); font-size: .96rem; } .dv-steps li::before { content: counter(s); position: absolute; left: .8rem; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: var(--c-accent); color: var(--c-on-accent); font: 400 1.35rem/1 var(--f-d); }
.dv-spec { position: sticky; top: calc(var(--head-h) + 1.2rem); padding: 1.7rem 1.4rem 1.4rem; background: var(--c-soft); border: 3px solid var(--c-primary-ink); box-shadow: var(--hard); transform: rotate(.8deg); }
.dv-spec__p { margin: 0 0 1rem; display: grid; gap: .1rem; } .dv-spec__p small { font: 800 .64rem/1 var(--f-b); letter-spacing: .16em; text-transform: uppercase; color: var(--c-muted); } .dv-spec__p b { font: 400 3.6rem/1 var(--f-d); color: var(--c-accent-ink); } .dv-spec__p em { font-style: normal; font-size: .84rem; color: var(--c-ink-soft); line-height: 1.4; }
.dv-facts { margin: 0 0 1.2rem; display: grid; gap: .55rem; } .dv-facts div { display: grid; grid-template-columns: 5.6rem 1fr; gap: .8rem; padding-bottom: .5rem; border-bottom: 2px dashed var(--c-border-2); font-size: .86rem; } .dv-facts dt { font-weight: 800; color: var(--c-muted); } .dv-facts dd { margin: 0; font-weight: 700; }
.dv-spec__stamp { position: absolute; right: -14px; top: -22px; width: 74px; height: 74px; font-size: .58rem; }

/* ── düzyazı, okuma ── */
.dv-prose { font-size: 1.04rem; line-height: 1.78; color: var(--c-ink-soft); max-width: 68ch; } .dv-prose > * + * { margin-top: 1rem; }
.dv-prose h2, .dv-prose h3 { margin: 2.2rem 0 .8rem; font-size: clamp(1.7rem, 3vw, 2.3rem); color: var(--c-ink); }
.dv-prose a { color: var(--c-primary-ink); text-decoration: underline; text-decoration-color: var(--c-accent); text-underline-offset: 3px; text-decoration-thickness: 2px; }
.dv-prose ul, .dv-prose ol { padding-left: 1.3rem; list-style: revert; } .dv-prose strong { color: var(--c-ink); }
.dv-prose--drop > p:first-of-type::first-letter { float: left; margin: .06em .12em 0 0; font: 400 3.7em/.8 var(--f-d); color: var(--c-accent-ink); }
.dv-prose--cols { max-width: none; }
.dv-read__in { display: grid; grid-template-columns: 190px minmax(0, 740px); gap: clamp(1.5rem, 4vw, 3.4rem); }
.dv-read__meta { position: sticky; top: calc(var(--head-h) + 1.2rem); align-self: start; display: grid; gap: .8rem; padding: 1rem; border: 2px dashed var(--c-border-2); background: var(--c-soft); font-size: .88rem; font-weight: 700; } .dv-read__meta p { margin: 0; } .dv-read__meta small { display: block; font: 800 .6rem/1.2 var(--f-b); letter-spacing: .16em; text-transform: uppercase; color: var(--c-accent-ink); }
.dv-read__cover { position: relative; margin: 0 0 2rem; padding: .6rem; background: var(--c-soft); border: var(--ink-l); box-shadow: var(--hard-s); } .dv-read__cover img { width: 100%; border: 2px solid var(--c-primary-ink); }
.dv-read__disc { margin-top: 2rem; padding: 1rem 1.2rem; border: 2px dashed var(--c-accent); background: color-mix(in srgb, var(--c-accent) 5%, var(--c-bg)); color: var(--c-ink-soft); }
.dv-about { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.dv-prose--cols { column-count: 1; }
.dv-hoursbox { position: relative; padding: 1.7rem 1.4rem 1.4rem; background: var(--c-soft); border: var(--ink-l); box-shadow: var(--hard-s); transform: rotate(1.2deg); } .dv-hoursbox__h { display: flex; gap: .6rem; margin: 0 0 .8rem; font-weight: 800; line-height: 1.45; } .dv-hoursbox__h svg { flex: none; width: 18px; height: 18px; color: var(--c-accent); margin-top: .2rem; }

/* ── formlar, kâğıt, kart ── */
.dv-contact { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: clamp(1.8rem, 4vw, 3.4rem); align-items: start; }
.dv-paper { position: relative; padding: clamp(1.4rem, 3vw, 2.4rem); background: var(--c-soft); border: 3px solid var(--c-primary-ink); box-shadow: var(--hard); }
.dv-ok { padding: 1rem 0; } .dv-ok p { margin: .5rem 0 0; color: var(--c-ink-soft); }
.dv-formx { display: grid; gap: 1.1rem; } .dv-formx__2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem; }
.dv-field { display: grid; gap: .4rem; } .dv-field label { font: 800 .72rem/1.2 var(--f-b); letter-spacing: .14em; text-transform: uppercase; color: var(--c-primary-ink); }
.dv-field input, .dv-field select, .dv-field textarea { width: 100%; padding: .8rem .9rem; background: var(--c-bg); border: 2px solid var(--c-primary-ink); border-radius: 2px; font: 400 1rem/1.4 var(--f-b); color: var(--c-ink); transition: box-shadow .15s, border-color .15s; }
.dv-field textarea { min-height: 130px; resize: vertical; } .dv-field input:focus, .dv-field select:focus, .dv-field textarea:focus { outline: none; border-color: var(--c-accent-ink); box-shadow: 3px 3px 0 var(--c-accent); }
.dv-field.is-bad input, .dv-field.is-bad textarea { border-color: var(--c-accent-ink); background: color-mix(in srgb, var(--c-accent) 6%, var(--c-bg)); } .dv-bad { font-size: .8rem; font-weight: 700; color: var(--c-accent-ink); }
.dv-err-msg { padding: .8rem 1rem; border: 2px solid var(--c-accent-ink); background: var(--c-accent-soft); color: var(--c-accent-ink); font-weight: 700; }
.field--hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.dv-stepbar { display: flex; gap: .4rem; margin: 0 0 .4rem; } .dv-stepbar li { flex: 1; padding: .45rem .6rem; border-bottom: 4px solid var(--c-border-2); font: 800 .68rem/1 var(--f-b); letter-spacing: .14em; text-transform: uppercase; color: var(--c-muted); } .dv-stepbar li.is-on { border-color: var(--c-accent); color: var(--c-primary-ink); }
.dv-steps-f.is-js .dv-step { display: none; } .dv-steps-f.is-js .dv-step.is-on { display: grid; gap: 1.1rem; animation: dv-pop .3s ease; } .dv-step { display: grid; gap: 1.1rem; } .dv-step legend { margin-bottom: .4rem; padding: 0; } .dv-stepbar { display: none; } .dv-steps-f.is-js .dv-stepbar { display: flex; }
.dv-stepnav { display: flex; justify-content: space-between; gap: 1rem; }
.dv-age-ck { position: relative; display: flex; gap: .8rem; align-items: flex-start; padding: .9rem 1rem; border: 2px dashed var(--c-accent); background: color-mix(in srgb, var(--c-accent) 5%, var(--c-bg)); font-size: .9rem; font-weight: 700; line-height: 1.4; cursor: pointer; }
.dv-age-ck__b { flex: none; width: 24px; height: 24px; display: grid; place-items: center; border: 2px solid var(--c-primary-ink); background: var(--c-soft); } .dv-age-ck__b svg { width: 16px; height: 16px; color: var(--c-on-accent); opacity: 0; transform: scale(.4); transition: .18s; }
.dv-age-ck input:checked ~ .dv-age-ck__b { background: var(--c-accent); border-color: var(--c-accent-ink); } .dv-age-ck input:checked ~ .dv-age-ck__b svg { opacity: 1; transform: none; } .dv-age-ck input:focus-visible ~ .dv-age-ck__b { outline: 3px solid var(--c-accent); outline-offset: 2px; }
.dv-card { position: relative; display: grid; gap: .9rem; padding: 1.8rem 1.4rem 1.4rem; background: var(--c-soft); border: var(--ink-l); box-shadow: var(--hard-s); transform: rotate(-1.1deg); }
.dv-card__i { display: flex; gap: .8rem; align-items: flex-start; } .dv-card__i svg { flex: none; width: 20px; height: 20px; margin-top: .2rem; color: var(--c-accent); } .dv-card__i p { margin: 0; line-height: 1.5; } .dv-card__i b { display: block; font: 800 .66rem/1.3 var(--f-b); letter-spacing: .16em; text-transform: uppercase; color: var(--c-muted); } .dv-card__i a { color: var(--c-primary-ink); font-weight: 800; }
.dv-card__stamp { position: absolute; right: -10px; top: -26px; width: 70px; height: 70px; font-size: .56rem; }
.dv-note { position: relative; padding: 1.3rem 1.1rem 1rem; background: var(--c-bg); border: 2px solid var(--c-primary-ink); transform: rotate(.8deg); } .dv-note__t { margin: 0 0 .4rem; font: 400 1.4rem/1.1 var(--f-d); } .dv-note__x { margin: 0; font-size: .86rem; color: var(--c-ink-soft); line-height: 1.55; }
.dv-faq { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: clamp(1.6rem, 4vw, 3.4rem); align-items: start; }
.dv-faq__idx { position: sticky; top: calc(var(--head-h) + 1.2rem); display: grid; gap: .3rem; } .dv-faq__idx a { display: flex; gap: .7rem; align-items: baseline; padding: .65rem .9rem; border: 2px dashed var(--c-border-2); background: var(--c-soft); font-weight: 800; font-size: .9rem; transition: border-color .15s, background .15s; } .dv-faq__idx a span { font: 400 1.2rem/1 var(--f-d); color: var(--c-accent-ink); } .dv-faq__idx a:hover { border: 2px solid var(--c-primary-ink); background: var(--c-bg); }
.dv-faq__body .dv-h3 { margin: 2.4rem 0 1rem; } .dv-faq__body .dv-h3:first-child { margin-top: 0; }
.dv-acc { display: grid; gap: .7rem; } .dv-acc__i { background: var(--c-soft); border: 2px solid var(--c-primary-ink); transition: box-shadow .2s; } .dv-acc__i.is-open { box-shadow: var(--hard-s); }
.dv-acc__b { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.2rem; background: none; border: 0; text-align: left; font: 400 1.4rem/1.2 var(--f-d); color: var(--c-ink); } .dv-acc__b i { flex: none; position: relative; width: 20px; height: 20px; } .dv-acc__b i::before, .dv-acc__b i::after { content: ""; position: absolute; left: 0; top: 9px; width: 20px; height: 3px; background: var(--c-accent); transition: transform .25s var(--ease); } .dv-acc__b i::after { transform: rotate(90deg); } .dv-acc__i.is-open .dv-acc__b i::after { transform: rotate(0); }
.dv-acc__p { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s var(--ease); } .dv-acc__in { overflow: hidden; min-height: 0; } .dv-acc__i.is-open .dv-acc__p { grid-template-rows: 1fr; } .dv-acc__p .dv-prose { padding: 0 1.2rem 1.2rem; font-size: .96rem; }
.dv-faq__more { margin-top: 2.4rem; }
.dv-err { text-align: left; } .dv-err .dv-h2 { margin: .5rem 0 1rem; } .dv-err .dv-hero__act { margin-top: 1.6rem; } .dv-err__in { padding-block: clamp(1rem, 4vw, 3rem); max-width: 40rem; }
.dv-err__svg { width: min(380px, 100%); margin-bottom: 1.2rem; overflow: visible; } .dv-err__svg .p { fill: var(--c-soft); stroke: var(--c-primary-ink); stroke-width: 3; } .dv-err__svg .k-l, .dv-err__svg .k-r { stroke-width: 5; fill: none; } .dv-err__svg .tip { fill: var(--c-accent); }
.dv-err__code { margin: 0; font: 400 clamp(5rem, 14vw, 9rem)/.9 var(--f-d); color: var(--c-accent-ink); } .dv-err__dbg { margin-top: 1.5rem; padding: 1rem; background: var(--c-surface); border: 2px dashed var(--c-border-2); font-size: .8rem; white-space: pre-wrap; }

/* ── bloklar ── */
.dv-blk__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.6rem; margin-top: 1.4rem; } .dv-blk__cards img { margin-bottom: .8rem; border: 2px solid var(--c-primary-ink); }
.dv-blk__cta, .dv-blk__hero { max-width: 52rem; } .dv-blk__fig { margin: 1.6rem 0 0; } .dv-blk__fig img { border: var(--ink-l); } .dv-blk__fig--solo { margin-block: 2rem; } .dv-blk__fig figcaption { margin-top: .5rem; font-size: .84rem; color: var(--c-muted); }
.dv-blk__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; margin-top: 1.2rem; } .dv-blk__grid img { border: var(--ink-l); }
.dv-blk__faq div { padding: 1rem 0; border-bottom: 2px dashed var(--c-border-2); } .dv-blk__faq dt { font: 400 1.4rem/1.2 var(--f-d); } .dv-blk__faq dd { margin: .4rem 0 0; color: var(--c-ink-soft); }
.dv-blk__bq { margin: 0; padding: 1.4rem 1.6rem; border-left: 6px solid var(--c-accent); background: var(--c-soft); } .dv-blk__bq p { margin: 0 0 .6rem; font: 400 1.7rem/1.3 var(--f-d); } .dv-blk__bq cite { font-style: normal; font-weight: 800; font-size: .84rem; color: var(--c-muted); }
.dv-blk__stats { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.dv-custom { min-height: 40vh; }

/* ── görüntüleyici ── */
.dv-lb { position: fixed; inset: 0; z-index: 300; background: color-mix(in srgb, var(--c-ink) 70%, transparent); display: grid; place-items: center; padding: 1rem; }
.dv-lb__f { position: relative; margin: 0; max-width: min(92vw, 1000px); padding: .8rem .8rem 3rem; background: var(--c-soft); border: 3px solid var(--c-primary-ink); box-shadow: 8px 8px 0 var(--c-accent); }
.dv-lb__f img { max-height: 76vh; width: auto; margin-inline: auto; border: 2px solid var(--c-primary-ink); } .dv-lb__f figcaption { position: absolute; left: 1rem; bottom: .7rem; font: 400 1.4rem/1 var(--f-d); color: var(--c-primary-ink); }
.dv-lb__x, .dv-lb__n { position: absolute; width: 46px; height: 46px; display: grid; place-items: center; background: var(--c-soft); border: var(--ink-l); border-radius: 50%; } .dv-lb__x { right: 14px; top: 14px; } .dv-lb__n--p { left: 14px; top: 50%; transform: rotate(180deg); } .dv-lb__n--n { right: 14px; top: 50%; } .dv-lb svg { width: 20px; height: 20px; }

/* ── alt bilgi ── */
.dv-foot { position: relative; margin-top: clamp(2rem, 5vw, 4rem); padding-bottom: 1.2rem; background: color-mix(in srgb, var(--c-surface) 80%, transparent); border-top: 3px solid var(--c-primary-ink); }
.dv-foot__strip { display: flex; justify-content: space-between; gap: .4rem; padding: .8rem 1.2rem; overflow: hidden; border-bottom: 2px dashed var(--c-border-2); } .dv-foot__strip span { flex: 1; max-width: 62px; opacity: .55; } .dv-foot__strip span:nth-child(odd) { transform: rotate(-6deg); } .dv-foot__strip span:nth-child(even) { transform: rotate(5deg) translateY(4px); }
.dv-foot__in { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1.1fr; gap: clamp(1.4rem, 3vw, 2.8rem); padding-top: clamp(2rem, 4vw, 3rem); align-items: start; }
.dv-foot__logo { margin: 0 0 .5rem; font: 400 clamp(3rem, 5vw, 4.4rem)/1 var(--f-d); color: var(--c-ink); } .dv-foot__st { margin: 0 0 1.2rem; max-width: 26ch; color: var(--c-ink-soft); line-height: 1.5; }
.dv-foot__age { display: flex; gap: .8rem; align-items: center; margin: 0; } .dv-foot__age b { flex: none; display: grid; place-items: center; width: 62px; height: 62px; border-radius: 50%; border: 4px double var(--c-accent-ink); color: var(--c-accent-ink); font: 400 1.9rem/1 var(--f-d); transform: rotate(-9deg); } .dv-foot__age span { font-size: .8rem; line-height: 1.4; color: var(--c-muted); max-width: 20ch; }
.dv-foot__col { display: grid; gap: .35rem; align-content: start; } .dv-foot__col h4 { margin: 0 0 .5rem; font: 800 .72rem/1 var(--f-b); letter-spacing: .18em; text-transform: uppercase; color: var(--c-accent-ink); } .dv-foot__col a { display: flex; gap: .6rem; align-items: baseline; padding: .15rem 0; font-size: .92rem; font-weight: 700; color: var(--c-ink-soft); } .dv-foot__col a small { font: 800 .6rem/1 var(--f-b); letter-spacing: .1em; color: var(--c-muted); } .dv-foot__col a:hover { color: var(--c-primary-ink); text-decoration: underline; text-decoration-color: var(--c-accent); text-decoration-thickness: 2px; }
.dv-foot__card { position: relative; padding: 1.7rem 1.3rem 1.3rem; background: var(--c-bg); border: var(--ink-l); box-shadow: var(--hard-s); transform: rotate(1.6deg); display: grid; gap: .8rem; } .dv-foot__card h4 { margin: 0; font-size: 1.6rem; } .dv-foot__card address { font-style: normal; font-size: .9rem; line-height: 1.6; color: var(--c-ink-soft); } .dv-foot__card address a { color: var(--c-primary-ink); font-weight: 800; }
.dv-foot__hours { display: flex; gap: .5rem; margin: 0; font-size: .82rem; line-height: 1.4; color: var(--c-muted); } .dv-foot__hours svg { flex: none; width: 16px; height: 16px; color: var(--c-accent); margin-top: .1rem; }
.dv-foot__social { display: flex; gap: .5rem; } .dv-foot__social a { width: 36px; height: 36px; display: grid; place-items: center; border: var(--ink-l); border-radius: 50%; } .dv-foot__social svg { width: 17px; height: 17px; }
.dv-foot__bar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .6rem 1.4rem; margin-top: clamp(1.6rem, 3vw, 2.4rem); padding-top: 1rem; border-top: 2px dashed var(--c-border-2); font-size: .8rem; color: var(--c-muted); } .dv-foot__bar p { margin: 0; } .dv-foot__bar nav { display: flex; gap: 1rem; } .dv-foot__bar a:hover { color: var(--c-primary-ink); text-decoration: underline; }

/* ── giriş hareketi ── */
.js [data-reveal] { opacity: 0; transform: translateY(20px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.js [data-reveal].is-in { opacity: 1; transform: none; }
.js .dv-ph[data-reveal], .js .dv-sd[data-reveal] { transform: none; }

/* ── sayfa geçişi: mürekkep lekeleri birleşir ── */
@media (prefers-reduced-motion: no-preference) {
    @view-transition { navigation: auto; }
    ::view-transition-group(dv-head), ::view-transition-group(dv-dock) { animation-duration: 0s; }
    ::view-transition-old(root) { animation: none; }
    ::view-transition-new(root) { animation: dv-ink .85s cubic-bezier(.4, .1, .2, 1) both;
        -webkit-mask-image: radial-gradient(circle at 12% 86%, #000 var(--dv-r), transparent calc(var(--dv-r) + 1px)), radial-gradient(circle at 78% 18%, #000 calc(var(--dv-r) * .84), transparent calc(var(--dv-r) * .84 + 1px)), radial-gradient(circle at 46% 62%, #000 calc(var(--dv-r) * .72), transparent calc(var(--dv-r) * .72 + 1px)), radial-gradient(circle at 93% 84%, #000 calc(var(--dv-r) * .6), transparent calc(var(--dv-r) * .6 + 1px)), radial-gradient(circle at 24% 10%, #000 calc(var(--dv-r) * .5), transparent calc(var(--dv-r) * .5 + 1px));
        mask-image: radial-gradient(circle at 12% 86%, #000 var(--dv-r), transparent calc(var(--dv-r) + 1px)), radial-gradient(circle at 78% 18%, #000 calc(var(--dv-r) * .84), transparent calc(var(--dv-r) * .84 + 1px)), radial-gradient(circle at 46% 62%, #000 calc(var(--dv-r) * .72), transparent calc(var(--dv-r) * .72 + 1px)), radial-gradient(circle at 93% 84%, #000 calc(var(--dv-r) * .6), transparent calc(var(--dv-r) * .6 + 1px)), radial-gradient(circle at 24% 10%, #000 calc(var(--dv-r) * .5), transparent calc(var(--dv-r) * .5 + 1px)); }
}
@keyframes dv-ink { from { --dv-r: 0px; } to { --dv-r: 145vmax; } }

/* ── duyarlı ── */
@media (max-width: 1100px) {
    .dv-cards, .dv-cards--rel { columns: 2; }
    .dv-guide__body { grid-template-columns: minmax(0, 1fr); } .dv-guide__out, .dv-guide__extras { grid-column: 1; grid-row: auto; } .dv-guide__sizes { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
    .dv-foot__in { grid-template-columns: 1fr 1fr; } .dv-foot__card { transform: rotate(.8deg); }
    .dv-sd__cols, .dv-about, .dv-contact { grid-template-columns: minmax(0, 1fr); } .dv-spec { position: static; max-width: 480px; }
}
@media (max-width: 900px) {
    .dv-hero__stage { grid-template-columns: minmax(0, 1fr); } .dv-flash, .dv-slip { grid-column: 1 / -1; grid-row: auto; padding-right: 1.3rem; } .dv-slip { margin: -.6rem .6rem 0; padding-right: 1.4rem; }
    .dv-tix { grid-template-columns: 56px minmax(0, 1fr); } .dv-tix__price { grid-column: 1 / -1; grid-template-columns: auto 1fr auto; align-items: center; border-left: 0; border-top: 3px dashed var(--c-primary-ink); gap: .2rem 1rem; } .dv-tix__price::before { left: -14px; top: -15px; clip-path: inset(0 0 50% 50%); } .dv-tix__price::after { left: auto; right: -14px; top: -15px; bottom: auto; clip-path: inset(0 50% 50% 0); } .dv-tix__price small, .dv-tix__price em { grid-column: 1; } .dv-tix__price .dv-btn { grid-column: 3; grid-row: 1 / 4; }
    .dv-tixs .dv-tix:nth-child(n) { margin-inline: 0; }
    .dv-form { grid-template-columns: minmax(0, 1fr); } .dv-age { display: grid; grid-template-columns: 120px 1fr; gap: 1rem; text-align: left; align-items: center; } .dv-age__ring { width: 110px; height: 110px; margin: 0; } .dv-age__ring b { font-size: 4rem; } .dv-age__t, .dv-age__x { grid-column: 2; }
    .dv-notes__in, .dv-care__body, .dv-art__grid, .dv-cta__in, .dv-sd__in, .dv-spread { grid-template-columns: minmax(0, 1fr); } 
    .dv-spread.is-flip .dv-spread__img { order: 0; } .dv-spread__no { top: -1.6rem; }
    .dv-stamps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dv-care__tabs { grid-auto-flow: column; grid-auto-columns: max-content; overflow-x: auto; border-left: 0; border-bottom: 3px solid var(--c-primary-ink); padding-bottom: 0; } .dv-care__tab { border-bottom: 0; white-space: nowrap; } .dv-care__tab.is-on { padding-left: .9rem; }
    .dv-faq, .dv-read__in { grid-template-columns: minmax(0, 1fr); } .dv-faq__idx { position: static; grid-auto-flow: column; grid-auto-columns: max-content; overflow-x: auto; padding-bottom: .4rem; } .dv-read__meta { position: static; grid-auto-flow: column; justify-content: start; gap: 1.4rem; }
    .dv-ph__in { grid-template-columns: minmax(0, 1fr) 110px; } .dv-ph__art { width: 100px; height: 100px; padding: 10px; }
    .dv-run__svg { display: none; } .dv-run__ol { grid-template-columns: minmax(0, 1fr); gap: 1.6rem; position: relative; padding-left: 3.4rem; } .dv-run__ol::before { content: ""; position: absolute; left: 22px; top: 8px; bottom: 8px; border-left: 3px dashed var(--c-primary-ink); }
    .dv-stop { padding: 0; } .dv-stop__n { left: -3.4rem; top: 0; margin: 0; width: 46px; height: 46px; font-size: 1.6rem; } .dv-stop__t { margin: .6rem 0 .4rem; font-size: 1.6rem; }
    .dv-notelist { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
    :root { --head-h: 62px; }
    body.dv-body { padding-bottom: 76px; }
    .dv-dock { display: flex; } .dv-fab { bottom: 90px; }
    .dv-head__cta { display: none; } .dv-brand__name { font-size: 1.7rem; } .dv-menu__txt { min-width: 0; } .dv-menu__txt b { max-width: 7.5rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .dv-menu__bars { display: none; } .dv-menu__sym { width: 34px; height: 34px; }
    .dv-sheet { left: 0; right: 0; top: auto; bottom: 0; width: auto; max-height: 88dvh; padding: 1.5rem 1rem 1.2rem; border-width: 3px 0 0; border-radius: 18px 18px 0 0; box-shadow: none; transform: translateY(104%); transform-origin: 50% 100%; transition: transform .5s cubic-bezier(.2, .9, .2, 1.02), opacity .2s, visibility 0s .5s; }
    .dv-sheet.is-on { transform: none; } .dv-sheet__tape { left: 50%; top: 8px; width: 56px; height: 8px; margin-left: -28px; border-radius: 99px; clip-path: none; transform: none; background: var(--c-border-2); }
    .dv-labels { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; } .dv-lab__a { min-height: 118px; transform: none; } .dv-lab__sym { width: 46px; height: 46px; } .dv-lab__t { font-size: 1.35rem; }
    .dv-hero__t { max-width: none; } .dv-flash { padding: .9rem .5rem .8rem; } .dv-flash__top { margin-left: .5rem; } .dv-flash__top .dv-ring { margin-right: .4rem; width: 62px; height: 62px; font-size: .52rem; }
    .dv-flash__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 136px; padding: .3rem .2rem 0; gap: .2rem; } .dv-fl { grid-area: auto !important; padding: .2rem; } .dv-fl__cap { font-size: .54rem; } .dv-flash__note { margin-inline: .4rem; }
    .dv-cards, .dv-cards--rel { columns: 1; }
    .dv-wall { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem .8rem; } .dv-wall .dv-wall__i { grid-column: span 1 !important; margin-top: 0 !important; } .dv-wall .dv-wall__i:first-child { grid-column: 1 / -1 !important; }
    .dv-form__l { grid-template-columns: minmax(0, 1fr); } .dv-stamps { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dv-notelist { grid-template-columns: minmax(0, 1fr); } .dv-nt--1, .dv-nt--3 { margin-top: 0; }
    .dv-tix__l { grid-template-columns: minmax(0, 1fr); } .dv-tix__main { padding: 1rem; }
    .dv-a:not(.dv-a--lead) { grid-template-columns: 112px minmax(0, 1fr); gap: .8rem; }
    .dv-formx__2 { grid-template-columns: minmax(0, 1fr); } .dv-foot__in { grid-template-columns: minmax(0, 1fr); } .dv-foot__strip span:nth-child(n+8) { display: none; }
    .dv-guide__sizes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; } .dv-sz__box { padding: .7rem .6rem .8rem; } .dv-ph__art { display: none; } .dv-ph__in { grid-template-columns: minmax(0, 1fr); }
    .dv-cta__in { padding: 1.3rem; } .dv-check { transform: none; } .dv-slip { margin-inline: 0; } .dv-slip__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dv-hero__act .dv-btn { flex: 1 1 100%; } .dv-sd__img { padding: .8rem; } .dv-spec__stamp, .dv-card__stamp { right: 8px; }
}
@media (max-width: 420px) { .dv-brand__name { font-size: 1.5rem; } }
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .001ms !important; animation-delay: 0s !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
    .js .dv-hl { clip-path: none; } .js [data-reveal] { opacity: 1; transform: none; }
    .js [data-draw]:not(.is-drawn) .k-l, .js [data-draw]:not(.is-drawn) .k-r { stroke-dashoffset: 0; } .js [data-draw]:not(.is-drawn) .k-f, .js [data-draw]:not(.is-drawn) .k-rf, .js [data-draw]:not(.is-drawn) .k-d { opacity: 1; }
    .js .dv-stop__n, .js .dv-form:not(.is-drawn) .dv-age__ring { opacity: 1; transform: none; } .js .dv-stamps:not(.is-in) .dv-stamp { opacity: 1; } .js .dv-ph:not(.is-drawn) .dv-ph__ink path { stroke-dashoffset: 0; }
}

/* 19. Mürekkep variant */
:root { --radius-md: 4px; }
