/* * Zemin site.css: the one site-wide stylesheet (CLAUDE.md, errata E6), printed after Breakdance's CSS. * Generated by tools/build_site_css.py from yon-b-v4.css, yon-b-v4-cta.css, yon-b-v4-teklif.css, yon-b-v4-kategori-4.css, yon-b-v4-sektor.css, yon-b-v4-urun-a-4.css, yon-b-v4-servis.css, yon-b-v4-yedek-parca.css, yon-b-v4-ikinci-el.css, yon-b-v4-yazi.css, yon-b-v4-blog.css, yon-b-v4-hakkimizda.css, yon-b-v4-iletisim.css * (the design reference) plus tools/site-css/reset.css and adapt.css. Do not edit by hand: change the sources * and rebuild. --zt-rev changes on every build (handbook 23.5). */ :root { --zt-rev: "2026-11-05.6"; } :root {color-scheme: light; --zt-bg: var(--bde-palette-color-1-366ac0f0-05b3-527d-add5-e5159d2a58fd); --zt-surface: var(--bde-palette-color-1-6fe7dbea-50d1-5378-8c31-6644c92fc464); --zt-surface-2: var(--bde-palette-color-1-6babab2a-f003-5c8b-ac48-dad184e184c9); --zt-surface-3: #E6E1DA; --zt-line: var(--bde-palette-color-1-5b3cd6c7-75b3-528d-bd02-59d9c3efd335); --zt-floor: var(--bde-palette-color-1-86d3c05a-a406-5e73-a652-dc1b7b0b8fbf); --zt-plane: var(--bde-palette-color-1-4828a547-e64a-5d9b-8bb1-3b61e032a748); --zt-horizon: var(--bde-palette-color-1-64bbe4bc-1f55-5129-98ef-8119354aef05); --zt-field: var(--bde-palette-color-1-56786a17-3086-5ca9-b05c-3576a70fa443); --zt-text: var(--bde-palette-color-1-d21eff8f-1b97-56ab-a0ed-0604a1e2df00); --zt-text-2: var(--bde-palette-color-1-ef034904-1767-55fd-910e-3b4a48cebbd2); --zt-text-3: var(--bde-palette-color-1-c89bff0b-70ea-5bae-a0d6-25ca7535edb3); --zt-quiet: var(--bde-palette-color-1-dde1f831-c396-5312-92f3-3e7290a57674); --zt-fume: var(--bde-palette-color-1-34bc9030-489b-555b-bd12-60a5f78cb093); --zt-fume-deep: var(--bde-palette-color-1-d01b26a1-5c36-540b-8faa-268f0486a578); --zt-on-fume: var(--bde-palette-color-1-828827ae-5969-52d4-93ec-1cc0a0e4f3d2); --zt-on-fume-2: var(--bde-palette-color-1-bd613740-d62a-5a45-9ec1-34be5c309bb3); --zt-on-photo-2: var(--bde-palette-color-1-aa704635-da89-5ccf-be0d-96a157a2e94b); --zt-fume-line: var(--bde-palette-color-1-b83070d8-befe-5d54-86f4-17917f68a215); --zt-orange: var(--bde-palette-color-1-508b09bc-d878-5928-844c-a74d84ed4eb3); --zt-orange-hover: var(--bde-palette-color-1-8544c929-610f-5155-9e1e-0ca553e83e1d); --zt-on-orange: var(--bde-palette-color-1-b0b18837-43c6-511c-930d-824a5b32c41c); --zt-error: var(--bde-palette-color-1-e2273124-facd-53e7-87d1-f35a6f98eb43); --zt-on-photo: var(--bde-palette-color-1-5bb1554c-e08f-5113-aa81-e19897daf534); --zt-glass: rgb(255 255 255 / 0.84); --zt-glass-fume: rgb(24 32 36 / 0.42); --zt-glass-line: rgb(255 255 255 / 0.14); --zt-photo-line: rgb(242 240 236 / 0.72); --zt-photo-glass: rgb(255 255 255 / 0.08); --zt-dock: rgb(31 42 47 / 0.92); --zt-dock-icon: rgb(255 255 255 / 0.12); --zt-scrim: rgb(16 22 25 / 0.8); --zt-backdrop: rgb(16 22 25 / 0.5); --zt-scrim-0: rgb(16 22 25 / 0); --zt-scrim-top: linear-gradient(180deg, rgb(20 28 32 / 0.62) 0%, rgb(20 28 32 / 0) 24%); --zt-scrim-low: linear-gradient(0deg, rgb(20 28 32 / 0.5) 0%, rgb(20 28 32 / 0) 30%); --zt-scrim-side: linear-gradient(90deg, rgb(20 28 32 / 0.1) 0%, rgb(20 28 32 / 0.14) 38%, rgb(20 28 32 / 0.7) 56%, rgb(20 28 32 / 0.8) 100%); --zt-shade: rgb(32 41 45 / 0.5); --zt-contact: rgb(32 41 45 / 0.42); --zt-shadow-pop: 0 2px 6px rgb(32 41 45 / 0.06), 0 28px 56px -20px rgb(32 41 45 / 0.28); --zt-shadow-seg: 0 1px 3px rgb(32 41 45 / 0.14); --zt-shadow-dock: 0 22px 44px -14px rgb(16 22 25 / 0.55), 0 6px 16px -6px rgb(16 22 25 / 0.3); --zt-cast: drop-shadow(18px 4px 22px rgb(20 28 32 / 0.3)); --zt-shade-blur: 12px; --zt-font: "Manrope", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif; --zt-fs-mega: clamp(3.5rem, 1.5rem + 5.4vw, 7rem); --zt-fs-h1: clamp(2.75rem, 4.6vw - 2px, 4rem); --zt-fs-stat: clamp(2.25rem, 1.4rem + 1.8vw, 3.25rem); --zt-fs-h2: clamp(2rem, 1.1rem + 1.9vw, 2.75rem); --zt-fs-h3: 1.75rem; --zt-fs-tile: 1.625rem; --zt-fs-h4: 1.5rem; --zt-fs-quote: 1.375rem; --zt-fs-value: 1.375rem; --zt-fs-lead: 1.25rem; --zt-fs-lg: 1.1875rem; --zt-fs-md: 1.125rem; --zt-fs-body: 1.0625rem; --zt-fs-base: 1rem; --zt-fs-sm: 0.9375rem; --zt-fs-xs: 0.875rem; --zt-fs-2xs: 0.8125rem; --zt-fs-3xs: 0.75rem; --zt-sp-1: 4px; --zt-sp-2: 8px; --zt-sp-3: 12px; --zt-sp-4: 16px; --zt-sp-5: 20px; --zt-sp-6: 24px; --zt-sp-7: 28px; --zt-sp-8: 32px; --zt-sp-9: 36px; --zt-sp-10: 40px; --zt-sp-12: 48px; --zt-sp-14: 56px; --zt-sp-16: 64px; --zt-sp-18: 72px; --zt-sp-22: 88px; --zt-sp-24: 96px; --zt-gutter: var(--zt-sp-8); --zt-max: 1280px; --zt-sec: 112px; --zt-gap: var(--zt-sp-5); --zt-head-gap: var(--zt-sp-12); --zt-r-pill: 999px; --zt-r-panel: 20px; --zt-r-inner: 12px; --zt-r-round: 50%; --zt-hair: 1px; --zt-stroke: 2px; --zt-rule: var(--zt-hair) solid var(--zt-line); --zt-rule-floor: var(--zt-hair) solid var(--zt-floor); --zt-header-h: 76px; --zt-touch: 44px; --zt-btn-h: 52px; --zt-btn-h-lg: 58px; --zt-field-h: 52px; --zt-logo-h: 40px; --zt-icon: 20px; --zt-icon-sm: 16px; --zt-icon-lg: 24px; --zt-go: 40px; --zt-avatar: 48px; --zt-thumb: 84px; --zt-stage-lg: 360px; --zt-stage-sm: 208px; --zt-card-img: 176px; --zt-row-img: 96px; --zt-row-cols: var(--zt-row-img) minmax(0, 1.5fr) repeat(2, minmax(0, 0.85fr)) minmax(0, 1.15fr) 196px; --zt-horizon-at: 66%; --zt-feet: 11%; --zt-vis: 0.74; --zt-dock-h: 66px; --zt-hero-mw: min(46vw, 700px); --zt-hero-drop: calc(var(--zt-hero-mw) * 0.19); --zt-hero-top: 120px; --zt-hero-pb: 128px; --zt-ease: cubic-bezier(0.22, 0.7, 0.2, 1); --zt-dur-fast: 0.25s; --zt-dur-slow: 0.6s; --zt-dur-enter: 0.9s;} :root {--zt-sheet-shadow: 0 -18px 40px -12px rgb(16 22 25 / 0.35);} body.breakdance.zt-page--kategori {--zt-hero-mw: 360px; --zt-hero-drop: calc(var(--zt-hero-mw) * 0.298); --zt-hero-top: 64px; --zt-hero-pb: 84px; --zt-kat-h1: clamp(2.5rem, 2.6vw + 1rem, 3.5rem); --zt-cp-side: clamp(236px, calc(100vw / 3 - 180px), 300px); --zt-cp-q2: clamp(21.5rem, 29vw, 26rem); --zt-kc-img: 232px; --zt-kc-gap: var(--zt-sp-6); --zt-kc-in: var(--zt-sp-3); --zt-kc-shadow: 0 1px 2px rgb(32 41 45 / 0.05), 0 16px 32px -22px rgb(32 41 45 / 0.28); --zt-kc-lift: 0 2px 8px rgb(32 41 45 / 0.06), 0 30px 50px -26px rgb(32 41 45 / 0.34); --zt-opt-h: 40px; --zt-backdrop: rgb(16 22 25 / 0.5); --zt-sheet-shadow: 0 -18px 40px -12px rgb(16 22 25 / 0.35);} body.breakdance.zt-page--urun {--zt-sub-h: 60px; --zt-sec-pd: var(--zt-sp-24); --zt-box-pad: var(--zt-sp-8); --zt-cmp-label: 196px; --zt-backdrop: rgb(16 22 25 / 0.5); --zt-lock-bg: rgb(135 138 140); --zt-sheet-shadow: 0 -18px 40px -12px rgb(16 22 25 / 0.35); --zt-sub-glass: rgb(255 255 255 / 0.94); --zt-go-shadow: 0 4px 14px rgb(16 22 25 / 0.18); --zt-stat: 1.375rem; --zt-model: clamp(2.5rem, 1.25rem + 2.6vw, 3.5rem);} body.breakdance.zt-page--servis {--zt-svc-h1: clamp(2.5rem, 2.6vw + 1rem, 3.5rem); --zt-svc-mt-ratio: 4 / 3; --zt-backdrop: rgb(16 22 25 / 0.5); --zt-lock-bg: rgb(135 138 140); --zt-sheet-shadow: 0 -18px 40px -12px rgb(16 22 25 / 0.35);} body.breakdance.zt-page--yedek-parca {--zt-yp-h1: clamp(2.5rem, 2.6vw + 1rem, 3.5rem); --zt-yp-lap: 88px; --zt-yp-scrim: linear-gradient(90deg, rgb(20 28 32 / 0.9) 0%, rgb(20 28 32 / 0.84) 36%, rgb(20 28 32 / 0.4) 62%, rgb(20 28 32 / 0.16) 100%); --zt-yp-scrim-v: linear-gradient(180deg, rgb(20 28 32 / 0.88) 0%, rgb(20 28 32 / 0.84) 70%, rgb(20 28 32 / 0.62) 100%); --zt-panel-shadow: 0 1px 2px rgb(32 41 45 / 0.05), 0 26px 52px -30px rgb(32 41 45 / 0.42); --zt-backdrop: rgb(16 22 25 / 0.5); --zt-lock-bg: rgb(135 138 140); --zt-sheet-shadow: 0 -18px 40px -12px rgb(16 22 25 / 0.35);} body.breakdance.zt-page--ikinci-el {--zt-hero-top: 64px; --zt-hero-pb: 88px; --zt-kat-h1: clamp(2.5rem, 2.6vw + 1rem, 3.5rem); --zt-tip-img: 120px; --zt-step-n: 48px; --zt-backdrop: rgb(16 22 25 / 0.5); --zt-lock-bg: rgb(135 138 140); --zt-sheet-shadow: 0 -18px 40px -12px rgb(16 22 25 / 0.35);} body.breakdance.zt-page--yazi {--zt-hero-drop: 0px; --zt-post-h1: clamp(2.375rem, 1.3vw + 1.6rem, 2.875rem); --zt-post-photo: 44%; --zt-post-seam: linear-gradient(90deg, rgb(31 42 47 / 1) 0%, rgb(31 42 47 / 0.88) 16%, rgb(31 42 47 / 0.3) 36%, rgb(31 42 47 / 0) 52%); --zt-art-h2: clamp(1.625rem, 1.2rem + 0.95vw, 2.125rem); --zt-art-w: 35rem; --zt-toc-w: 220px; --zt-rail-w: 300px; --zt-rail-img: 72px; --zt-dot: 24px; --zt-backdrop: rgb(16 22 25 / 0.5); --zt-sheet-shadow: 0 -18px 40px -12px rgb(16 22 25 / 0.35); --zt-lock-bg: rgb(135 138 140);} body.breakdance.zt-page--hakkimizda {--zt-hk-h: clamp(620px, 52vw, 780px); --zt-hk-h1: clamp(2.5rem, 2.6vw + 1rem, 3.5rem); --zt-hk-top: linear-gradient(180deg, rgb(20 28 32 / 0.66) 0, rgb(20 28 32 / 0.5) var(--zt-header-h), rgb(20 28 32 / 0) calc(var(--zt-header-h) + var(--zt-sp-7))); --zt-hk-fade-y: 100px; --zt-hk-fade-x: 240px; --zt-hk-scrim: linear-gradient(90deg, rgb(20 28 32 / 0.84) 0%, rgb(20 28 32 / 0.8) calc(100% - var(--zt-hk-fade-x)), rgb(20 28 32 / 0) 100%); --zt-hk-seam: linear-gradient(0deg, rgb(31 42 47 / 1) 0%, rgb(31 42 47 / 0.88) 14%, rgb(31 42 47 / 0) 36%); --zt-tl-dot: 14px; --zt-tl-y: calc(var(--zt-fs-stat) + var(--zt-sp-6)); --zt-line-ico: var(--zt-sp-12); --zt-backdrop: rgb(16 22 25 / 0.5); --zt-lock-bg: rgb(135 138 140); --zt-sheet-shadow: 0 -18px 40px -12px rgb(16 22 25 / 0.35);} body.breakdance.zt-page--iletisim {--zt-hero-mw: 360px; --zt-hero-drop: calc(var(--zt-hero-mw) * 0.298); --zt-hero-top: 64px; --zt-hero-pb: 84px; --zt-kat-h1: clamp(2.5rem, 2.6vw + 1rem, 3.5rem); --zt-ch-pad: var(--zt-sp-8); --zt-ch-v: clamp(1.1875rem, 2.5vw - 8px, 1.5rem); --zt-backdrop: rgb(16 22 25 / 0.5); --zt-lock-bg: rgb(135 138 140); --zt-sheet-shadow: 0 -18px 40px -12px rgb(16 22 25 / 0.35);} /* Breakdance 2.8.3 element defaults, undone on converted elements only (zt-bd-* markers from tools/bdgen/html2bd.py). Measured defaults (plugin elements' default.css, Rottest's 2.8.3 install, 11 Oct; same version here, re-measure in the browser on the first converted page): .bde-section { position: relative; width: 100%; background-size: cover } and .section-container { max-width; padding; display: flex; flex-direction: column; align-items: flex-start; text-align: left; margin: 0 auto }; .bde-div and .bde-container-link the same flex column; .bde-text { max-width: 100%; margin: 0; color: var(--bde-text-color, var(--bde-body-text-color)) }; .bde-text-link { display: flex }; .bde-icon { display: flex }; .bde-heading { max-width: 100% }; themeless normalize.min.css h1-h6 { line-height: 1.2 }; global-settings.css .breakdance h1-h6 { color; font-size } (heading sizes from the type scale). The mockup's headings inherit line-height and color and keep the browser's font-size unless a class sets them. Editor-added elements keep Breakdance's behavior. Links keep the mockup's own text-decoration (Zemin's base sheet says a { text-decoration: none }; a revert here outranked it and brought back the browser's underline, measured 3 Nov). */ .breakdance .zt-bd-section { position: static; width: auto; background-position: 0 0; background-size: auto; } .breakdance .zt-bd-section > .section-container { display: contents; } .breakdance .zt-bd-div { display: block; flex-direction: row; align-items: normal; text-align: inherit; max-width: none; position: static; background-size: auto; } .breakdance .zt-bd-text { max-width: none; color: inherit; } .breakdance .zt-bd-heading { max-width: none; color: inherit; line-height: inherit; font-size: revert; } .breakdance .zt-bd-link { display: inline; flex-direction: row; align-items: normal; text-align: inherit; max-width: none; position: static; background-size: auto; transition: none; } .breakdance .zt-bd-icon, .breakdance .zt-bd-icon > .bde-icon-icon, .breakdance .zt-bd-svg { display: contents; } .breakdance .zt-bd-code { display: contents; } /* Code Block wrapper (.bde-code-block is a flex column) */ *, *::before, *::after {box-sizing: border-box;} html {-webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--zt-header-h) + var(--zt-sp-6));} body.breakdance {margin: 0; background: var(--zt-bg); color: var(--zt-text); font-family: var(--zt-font); font-size: var(--zt-fs-body); line-height: 1.6; -webkit-font-smoothing: antialiased;} .breakdance h1, .breakdance h2, .breakdance h3, .breakdance h4, .breakdance p, .breakdance ul, .breakdance .zt-tag-dl, .breakdance .zt-tag-dd, .breakdance figure, .breakdance blockquote, .breakdance dl, .breakdance dd {margin: 0;} .breakdance ul {padding: 0; list-style: none;} .breakdance img {display: block; max-width: 100%; height: auto;} .breakdance a {color: inherit; text-decoration: none;} .breakdance a:hover {color: inherit;} .breakdance button, .breakdance input, .breakdance select, .breakdance textarea {font: inherit; color: inherit;} .breakdance .zt-tag-address, .breakdance address {font-style: normal;} .breakdance :focus-visible {outline: var(--zt-stroke) solid var(--zt-fume); outline-offset: 3px;} .breakdance ::selection {background: var(--zt-orange); color: var(--zt-on-orange);} .breakdance .zt-sprite {position: absolute; width: 0; height: 0; overflow: hidden;} .breakdance .zt-sr {position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;} .breakdance .zt-icon {width: var(--zt-icon); height: var(--zt-icon); flex: none; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round;} .breakdance .zt-icon--sm {width: var(--zt-icon-sm); height: var(--zt-icon-sm);} .breakdance .zt-skip {position: absolute; top: var(--zt-sp-3); left: var(--zt-sp-4); z-index: 100; padding: var(--zt-sp-3) var(--zt-sp-5); border-radius: var(--zt-r-pill); background: var(--zt-fume); color: var(--zt-on-fume); font-weight: 700; transform: translateY(-200%);} .breakdance .zt-skip:hover {color: var(--zt-on-fume);} .breakdance .zt-skip:focus {transform: none;} .breakdance .zt-container {width: min(100% - 2 * var(--zt-gutter), var(--zt-max)); margin-inline: auto;} .breakdance .zt-section {padding-block: var(--zt-sec); border-top: var(--zt-rule-floor);} .breakdance .zt-h2 {font-size: var(--zt-fs-h2); line-height: 1.1; font-weight: 750; letter-spacing: -0.028em; text-wrap: balance;} .breakdance .zt-head {display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--zt-sp-4) var(--zt-sp-12); margin-bottom: var(--zt-head-gap);} .breakdance .zt-head__text {flex: 0 1 25em; color: var(--zt-text-2);} .breakdance .zt-head__lead {max-width: 34em; margin-top: var(--zt-sp-4); font-size: var(--zt-fs-md); color: var(--zt-text-2);} .breakdance .zt-eyebrow {margin-bottom: var(--zt-sp-4); font-size: var(--zt-fs-2xs); font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--zt-text-3);} .breakdance .zt-btn {display: inline-flex; align-items: center; justify-content: center; gap: var(--zt-sp-2); min-height: var(--zt-btn-h); padding: 0 var(--zt-sp-6); border: var(--zt-stroke) solid transparent; border-radius: var(--zt-r-pill); font-size: var(--zt-fs-base); font-weight: 700; line-height: 1.1; white-space: nowrap; cursor: pointer;} .breakdance .zt-btn--lg {min-height: var(--zt-btn-h-lg); padding: 0 var(--zt-sp-8); font-size: var(--zt-fs-body);} .breakdance .zt-btn--sm {min-height: var(--zt-touch); padding: 0 var(--zt-sp-5); font-size: var(--zt-fs-sm);} .breakdance .zt-btn--block {width: 100%;} .breakdance .zt-btn--quote {background: var(--zt-orange); color: var(--zt-on-orange);} .breakdance .zt-btn--quote:hover {color: var(--zt-on-orange);} .breakdance .zt-btn--quote:hover {background: var(--zt-orange-hover);} .breakdance .zt-btn--line {border-color: var(--zt-fume); color: var(--zt-fume);} .breakdance .zt-btn--line:hover {color: var(--zt-fume);} .breakdance .zt-btn--line:hover {background: var(--zt-fume); color: var(--zt-bg);} .breakdance .zt-btn--glass {border-color: var(--zt-photo-line); background: var(--zt-photo-glass); color: var(--zt-on-fume);} .breakdance .zt-btn--glass:hover {color: var(--zt-on-fume);} .breakdance .zt-btn--glass:hover {border-color: var(--zt-on-fume); background: var(--zt-on-fume); color: var(--zt-fume);} .breakdance .zt-btn__num {margin-left: var(--zt-sp-1); font-weight: 500;} .breakdance .zt-link {display: inline-flex; align-items: center; gap: var(--zt-sp-2); min-height: var(--zt-touch); font-weight: 700; color: var(--zt-fume); white-space: nowrap;} .breakdance .zt-link:hover {color: var(--zt-fume);} .breakdance .zt-link--quiet {font-weight: 600; color: var(--zt-text-2);} .breakdance .zt-link--quiet:hover {color: var(--zt-text-2);} .breakdance .zt-faq__a a, .breakdance .zt-form__kvkk a, .breakdance .zt-form__done-text a {color: var(--zt-fume); font-weight: 700; text-decoration: underline; text-decoration-thickness: var(--zt-hair); text-underline-offset: 3px; white-space: nowrap;} .breakdance .zt-faq__a a:hover, .breakdance .zt-form__kvkk a:hover, .breakdance .zt-form__done-text a:hover {color: var(--zt-fume);} .breakdance .zt-header {position: sticky; top: 0; z-index: 50; color: var(--zt-text); --zt-hover: var(--zt-surface-3); --zt-ring: var(--zt-fume);} .breakdance .zt-header::before, .breakdance .zt-header::after {content: ""; position: absolute; inset: 0; z-index: -1; -webkit-backdrop-filter: saturate(1.6) blur(16px); backdrop-filter: saturate(1.6) blur(16px); pointer-events: none;} .breakdance .zt-header::before {background: var(--zt-glass); border-bottom: var(--zt-rule);} .breakdance .zt-header::after {background: var(--zt-glass-fume); border-bottom: var(--zt-hair) solid var(--zt-glass-line); opacity: 0;} .zt-js body.breakdance:has(.zt-hero) .zt-header:not(.is-solid) {color: var(--zt-on-fume); --zt-hover: var(--zt-glass-line); --zt-ring: var(--zt-photo-line);} .zt-js body.breakdance:has(.zt-hero) .zt-header:not(.is-solid)::before {opacity: 0;} .zt-js body.breakdance:has(.zt-hero) .zt-header:not(.is-solid)::after {opacity: 1;} .zt-js body.breakdance:has(.zt-hero) .zt-header:not(.is-solid) :focus-visible {outline-color: var(--zt-on-fume);} .breakdance .zt-logo--light, .zt-js body.breakdance:has(.zt-hero) .zt-header:not(.is-solid) .zt-logo--dark {display: none;} .zt-js body.breakdance:has(.zt-hero) .zt-header:not(.is-solid) .zt-logo--light {display: block;} .breakdance .zt-header__bar {position: relative; display: flex; align-items: center; gap: var(--zt-sp-6); height: var(--zt-header-h);} .breakdance .zt-header__logo {flex: none; padding-block: var(--zt-sp-1);} .breakdance .zt-header__logo img {width: auto; height: var(--zt-logo-h);} .breakdance .zt-nav {flex: 1; display: flex; justify-content: center; min-width: 0;} .breakdance .zt-nav__list {display: flex; align-items: center; gap: var(--zt-sp-1);} .breakdance .zt-nav__link {display: flex; align-items: center; gap: var(--zt-sp-2); min-height: var(--zt-touch); padding: 0 clamp(var(--zt-sp-3), calc(1.25vw - 2px), var(--zt-sp-4)); border-radius: var(--zt-r-pill); font-size: var(--zt-fs-sm); font-weight: 600; white-space: nowrap; cursor: pointer; list-style: none;} .breakdance .zt-nav__link::-webkit-details-marker {display: none;} .breakdance .zt-nav__link:hover, .breakdance .zt-drop[open] > .zt-nav__link {background: var(--zt-hover);} .breakdance .zt-drop[open] .zt-icon--sm {transform: rotate(180deg);} .breakdance .zt-drop__panel {position: absolute; top: calc(100% + var(--zt-sp-2)); left: 0; right: 0; padding: var(--zt-sp-8); background: var(--zt-bg); border: var(--zt-rule); border-radius: var(--zt-r-panel); box-shadow: var(--zt-shadow-pop); color: var(--zt-text);} .breakdance .zt-mega__grid {display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--zt-sp-10);} .breakdance .zt-mega__label {margin-bottom: var(--zt-sp-3); padding-left: var(--zt-sp-3); font-size: var(--zt-fs-2xs); font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--zt-text-3);} .breakdance .zt-mega__features {display: grid; gap: var(--zt-sp-2);} .breakdance .zt-mega__list {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--zt-sp-2) var(--zt-sp-4);} .breakdance .zt-mega__feature, .breakdance .zt-mega__item {display: grid; align-items: center; border-radius: var(--zt-r-inner); color: var(--zt-text);} .breakdance .zt-mega__feature:hover, .breakdance .zt-mega__item:hover {color: var(--zt-text);} .breakdance .zt-mega__feature {grid-template-columns: 168px minmax(0, 1fr); gap: var(--zt-sp-5); padding: var(--zt-sp-3);} .breakdance .zt-mega__item {grid-template-columns: 80px minmax(0, 1fr); gap: var(--zt-sp-4); padding: var(--zt-sp-2) var(--zt-sp-3) var(--zt-sp-2) var(--zt-sp-2);} .breakdance .zt-mega__feature:hover, .breakdance .zt-mega__item:hover {background: var(--zt-surface-3);} .breakdance .zt-mega__stage, .breakdance .zt-mega__thumb {position: relative; overflow: hidden; background: var(--zt-surface);} .breakdance .zt-mega__stage {aspect-ratio: 4 / 3; border-radius: var(--zt-r-inner);} .breakdance .zt-mega__thumb {width: 80px; height: 64px; border-radius: 10px;} .breakdance .zt-mega__stage img, .breakdance .zt-mega__thumb img {position: absolute; inset: 7%; width: 86%; height: 86%; object-fit: contain; mix-blend-mode: multiply;} .breakdance .zt-mega__text {display: grid; gap: var(--zt-sp-1);} .breakdance .zt-mega__name {font-size: var(--zt-fs-md); font-weight: 800; line-height: 1.25; letter-spacing: -0.012em;} .breakdance .zt-mega__desc {font-size: var(--zt-fs-sm); line-height: 1.45; color: var(--zt-text-2);} .breakdance .zt-mega__list .zt-mega__name {font-size: var(--zt-fs-sm);} .breakdance .zt-mega__list .zt-mega__desc {font-size: var(--zt-fs-xs);} .breakdance .zt-mega__foot {display: flex; align-items: center; justify-content: space-between; gap: var(--zt-sp-5); margin-top: var(--zt-sp-6); padding: var(--zt-sp-5) var(--zt-sp-3) 0; border-top: var(--zt-rule);} .breakdance .zt-mega__brands {display: flex; flex-wrap: wrap; align-items: center; gap: var(--zt-sp-2); font-size: var(--zt-fs-2xs); font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--zt-text-3);} .breakdance .zt-mega__brands a {display: inline-flex; align-items: center; min-height: var(--zt-touch); padding: 0 var(--zt-sp-4); border: var(--zt-rule); border-radius: var(--zt-r-pill); font-size: var(--zt-fs-sm); font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--zt-text);} .breakdance .zt-mega__brands a:hover {color: var(--zt-text);} .breakdance .zt-mega__brands a:first-of-type {margin-left: var(--zt-sp-2);} .breakdance .zt-mega__brands a:hover {background: var(--zt-surface-3); border-color: var(--zt-surface-3);} .breakdance .zt-mega__all {display: inline-flex; align-items: center; gap: var(--zt-sp-2); min-height: var(--zt-touch); padding: 0 var(--zt-sp-4); border-radius: var(--zt-r-pill); font-size: var(--zt-fs-sm); font-weight: 800; color: var(--zt-fume);} .breakdance .zt-mega__all:hover {color: var(--zt-fume);} .breakdance .zt-mega__all:hover {background: var(--zt-surface-3);} .breakdance .zt-mega--sektor .zt-mega__list {grid-template-columns: repeat(3, minmax(0, 1fr));} .breakdance .zt-mega__thumb--photo img {inset: 0; width: 100%; height: 100%; object-fit: cover; mix-blend-mode: normal;} .breakdance .zt-mega__note {font-size: var(--zt-fs-sm); color: var(--zt-text-2);} .breakdance .zt-nav__actions {display: none;} .breakdance .zt-header__tel {display: flex; align-items: center; gap: var(--zt-sp-2); min-height: var(--zt-touch); font-size: var(--zt-fs-sm); font-weight: 700; white-space: nowrap;} .breakdance .zt-header__quote {min-height: 46px; padding: 0 var(--zt-sp-6); font-size: var(--zt-fs-sm);} .breakdance .zt-header__menu {display: none;} .breakdance .zt-hero {position: relative; z-index: 1; isolation: isolate; margin-top: calc(-1 * var(--zt-header-h)); overflow-x: clip; background: var(--zt-fume-deep);} .breakdance .zt-hero__media {position: absolute; inset: 0; z-index: -1; overflow: hidden;} .breakdance .zt-hero__media::after {content: ""; position: absolute; inset: 0; background: var(--zt-scrim-top), var(--zt-scrim-low), var(--zt-scrim-side);} .breakdance .zt-hero__bg {width: 100%; height: 100%; object-fit: cover; object-position: 50% 58%;} .breakdance .zt-hero__media picture {display: contents;} .breakdance .zt-hero__grid {display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-areas: "machine copy"; align-items: end; column-gap: var(--zt-sp-12); padding-top: calc(var(--zt-header-h) + var(--zt-hero-top));} .breakdance .zt-hero__copy {grid-area: copy; padding-bottom: var(--zt-hero-pb); color: var(--zt-on-fume);} .breakdance .zt-hero__eyebrow {margin-bottom: var(--zt-sp-5); font-size: var(--zt-fs-sm); font-weight: 700; letter-spacing: 0.02em; word-spacing: 0.12em; color: var(--zt-on-photo-2);} .breakdance .zt-hero__title {max-width: 8.3em; font-size: var(--zt-fs-h1); line-height: 0.98; font-weight: 800; letter-spacing: -0.045em; text-wrap: balance;} .breakdance .zt-hero__lead {max-width: 25em; margin-top: var(--zt-sp-6); font-size: var(--zt-fs-lead); line-height: 1.5; color: var(--zt-on-photo-2);} .breakdance .zt-hero__actions {display: flex; flex-wrap: wrap; gap: var(--zt-sp-3); margin-top: var(--zt-sp-9);} .breakdance .zt-hero__copy :focus-visible {outline-color: var(--zt-on-fume);} .breakdance .zt-hero__machine {grid-area: machine; position: relative; width: var(--zt-hero-mw); margin: 0 0 calc(-1 * var(--zt-hero-drop)) calc(-1 * min(var(--zt-sp-10), (100vw - min(100vw - 2 * var(--zt-gutter), var(--zt-max))) / 2 - var(--zt-sp-2)));} .breakdance .zt-hero__m {width: 100%; filter: var(--zt-cast);} .breakdance .zt-shadow {position: absolute; bottom: calc(-1 * var(--zt-shade-blur)); height: calc(2 * var(--zt-shade-blur)); border-radius: var(--zt-r-round); background: var(--zt-shade); filter: blur(var(--zt-shade-blur));} .breakdance .zt-hero__machine .zt-shadow {left: 2%; width: 88%;} .breakdance .zt-hero + .zt-section {padding-top: calc(var(--zt-hero-drop) + var(--zt-sp-14)); border-top: 0;} .breakdance .zt-stage {--zt-ratio: 1; position: relative; overflow: hidden; isolation: isolate; border-radius: calc(var(--zt-r-panel) - var(--zt-sp-3)); background: var(--zt-surface);} .breakdance .zt-stage::before {content: ""; position: absolute; inset: var(--zt-horizon-at) 0 0; z-index: -1; border-top: var(--zt-hair) solid var(--zt-horizon); background: var(--zt-plane);} .breakdance .zt-stage::after {content: ""; position: absolute; left: 50%; bottom: calc(var(--zt-feet) - 3%); width: calc(var(--bw) * var(--zt-vis) / var(--bh) * var(--zt-ratio) * 86%); height: 8%; z-index: -1; border-radius: var(--zt-r-round); background: var(--zt-contact); filter: blur(5px); transform: translateX(-50%);} .breakdance .zt-stage img {position: absolute; bottom: var(--zt-feet); left: 50%; width: auto; max-width: none; height: calc(var(--zt-vis) / var(--bh) * 100%); mix-blend-mode: multiply; filter: brightness(1.02); transform: translate(-50%, var(--ft)); transform-origin: 50% calc(100% - var(--ft));} .breakdance .zt-mf__grid {display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--zt-sp-10); align-items: start;} .breakdance .zt-mf__qs {padding: var(--zt-sp-7); border-radius: var(--zt-r-panel); background: var(--zt-surface);} .breakdance .zt-fd__q + .zt-fd__q {margin-top: var(--zt-sp-4);} .breakdance .zt-fd__label {margin-bottom: var(--zt-sp-2); font-size: var(--zt-fs-2xs); font-weight: 700; color: var(--zt-text-2);} .breakdance .zt-fd__opts {display: flex; flex-wrap: wrap; gap: var(--zt-sp-2);} .breakdance .zt-fd__opt {display: inline-flex; align-items: center; min-height: var(--zt-touch); padding: 0 var(--zt-sp-4); border: var(--zt-hair) solid var(--zt-field); border-radius: var(--zt-r-pill); background: var(--zt-bg); font-size: var(--zt-fs-sm); font-weight: 600; white-space: nowrap; cursor: pointer;} .breakdance .zt-fd__opt:hover {border-color: var(--zt-fume);} .breakdance .zt-fd__opt.is-on {background: var(--zt-fume); border-color: var(--zt-fume); color: var(--zt-bg);} .breakdance .zt-fd__opt.is-on:hover {color: var(--zt-bg);} .breakdance .zt-fd__foot {display: flex; flex-wrap: wrap; align-items: center; gap: var(--zt-sp-3) var(--zt-sp-5); margin-top: var(--zt-sp-6); padding-top: var(--zt-sp-5); border-top: var(--zt-rule);} .breakdance .zt-fd__fine {flex: 1 1 16em; font-size: var(--zt-fs-2xs); line-height: 1.45; color: var(--zt-text-2);} .breakdance .zt-fd__kicker {margin-bottom: var(--zt-sp-3); font-size: var(--zt-fs-2xs); font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--zt-text-3);} .breakdance .zt-fd__note {margin-bottom: var(--zt-sp-3); padding: var(--zt-sp-2) var(--zt-sp-3); border-radius: var(--zt-r-inner); background: var(--zt-surface); font-size: var(--zt-fs-xs); font-weight: 600;} .breakdance .zt-cards {display: grid; gap: var(--zt-sp-3);} .breakdance .zt-card {display: grid; grid-template-columns: var(--zt-card-img) minmax(0, 1fr); grid-template-rows: auto 1fr auto; grid-template-areas: "stage head" "stage spec" "stage act"; column-gap: var(--zt-sp-6); padding: var(--zt-sp-3) var(--zt-sp-6) var(--zt-sp-3) var(--zt-sp-3); border: var(--zt-rule); border-radius: var(--zt-r-panel); background: var(--zt-bg);} .breakdance .zt-card--grp {grid-template-areas: "stage head" "stage act"; grid-template-rows: 1fr auto;} .breakdance .zt-card__stage {grid-area: stage; aspect-ratio: 1;} .breakdance .zt-card__head {grid-area: head; padding-top: var(--zt-sp-3);} .breakdance .zt-card__meta {font-size: var(--zt-fs-2xs); font-weight: 600; color: var(--zt-text-2);} .breakdance .zt-card__name {margin-top: 2px; font-size: var(--zt-fs-h3); line-height: 1.1; font-weight: 800; letter-spacing: -0.025em;} .breakdance .zt-card__line {max-width: 30em; margin-top: var(--zt-sp-2); color: var(--zt-text-2);} .breakdance .zt-spec {grid-area: spec; align-self: center; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--zt-sp-5); padding-block: var(--zt-sp-3) var(--zt-sp-6);} .breakdance .zt-spec > div {display: flex; flex-direction: column; justify-content: space-between; gap: var(--zt-sp-1);} .breakdance .zt-spec .zt-tag-dt, .breakdance .zt-spec dt {font-size: var(--zt-fs-3xs); line-height: 1.25; font-weight: 600; color: var(--zt-text-3);} .breakdance .zt-spec .zt-tag-dd, .breakdance .zt-spec dd {position: relative; font-size: var(--zt-fs-value); line-height: 1.1; font-weight: 800; letter-spacing: -0.02em; white-space: nowrap; font-variant-numeric: tabular-nums;} .breakdance .zt-spec .zt-tag-dd span, .breakdance .zt-spec dd span {font-size: var(--zt-fs-3xs); font-weight: 700; letter-spacing: 0; color: var(--zt-text-2);} .breakdance .zt-spec .zt-bar {position: absolute; top: calc(100% + var(--zt-sp-2)); left: 0; right: 0; height: 4px; overflow: hidden; border-radius: var(--zt-r-pill); background: var(--zt-surface-2);} .breakdance .zt-spec .zt-bar > span {display: block; height: 100%; border-radius: inherit; background: var(--zt-fume);} .breakdance .zt-card__act {grid-area: act; display: flex; align-items: center; gap: var(--zt-sp-6);} .breakdance .zt-all {margin-top: var(--zt-sp-10);} .breakdance .zt-all__sum {display: inline-flex; align-items: center; gap: var(--zt-sp-2); min-height: var(--zt-btn-h); margin-left: calc((100% - var(--zt-sp-10)) / 3 + var(--zt-sp-10)); padding: 0 var(--zt-sp-6); border: var(--zt-stroke) solid var(--zt-fume); border-radius: var(--zt-r-pill); font-weight: 700; color: var(--zt-fume); cursor: pointer; list-style: none;} .breakdance .zt-all__sum::-webkit-details-marker {display: none;} .breakdance .zt-all__sum:hover {background: var(--zt-fume); color: var(--zt-bg);} .breakdance .zt-all[open] .zt-all__show, .breakdance .zt-all:not([open]) .zt-all__hide {display: none;} .breakdance .zt-all[open] .zt-all__sum .zt-icon {transform: rotate(180deg);} .breakdance .zt-list {margin-top: var(--zt-sp-10); padding-top: var(--zt-sp-10); border-top: var(--zt-rule-floor);} .breakdance .zt-list__bar {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--zt-sp-3) var(--zt-sp-8); margin-bottom: var(--zt-sp-6);} html:not(.zt-js) .zt-list__bar {display: none;} .breakdance .zt-list__ctl {display: flex; flex-wrap: wrap; align-items: center; gap: var(--zt-sp-2) var(--zt-sp-3);} .breakdance .zt-list__lbl {font-size: var(--zt-fs-2xs); font-weight: 700; color: var(--zt-text-2);} .breakdance .zt-seg {display: inline-flex; gap: 2px; padding: 3px; border-radius: var(--zt-r-pill); background: var(--zt-surface-2);} .breakdance .zt-seg__btn {min-height: var(--zt-touch); padding: 0 var(--zt-sp-5); border: 0; border-radius: var(--zt-r-pill); background: none; font-size: var(--zt-fs-sm); font-weight: 700; color: var(--zt-text-2); white-space: nowrap; cursor: pointer;} .breakdance .zt-seg__btn:hover {color: var(--zt-text);} .breakdance .zt-seg__btn.is-on {background: var(--zt-bg); color: var(--zt-text); box-shadow: var(--zt-shadow-seg);} .breakdance .zt-seg__btn.is-on:hover {color: var(--zt-text);} .breakdance .zt-list__cols, .breakdance .zt-row {display: grid; grid-template-columns: var(--zt-row-cols); align-items: center; column-gap: var(--zt-sp-6);} .breakdance .zt-list__cols {padding: 0 var(--zt-sp-5) var(--zt-sp-2) var(--zt-sp-2); font-size: var(--zt-fs-3xs); font-weight: 600; color: var(--zt-text-3);} .breakdance .zt-list__cols span:first-child {grid-column: 1 / 3;} .breakdance .zt-list__rows {display: grid; gap: var(--zt-sp-2);} .breakdance .zt-row {padding: var(--zt-sp-2) var(--zt-sp-5) var(--zt-sp-2) var(--zt-sp-2); border: var(--zt-rule); border-radius: var(--zt-r-panel); background: var(--zt-bg);} .breakdance .zt-row[data-rec] {border-color: var(--zt-floor);} .breakdance .zt-row__stage {--zt-ratio: 0.75; width: var(--zt-row-img); aspect-ratio: 4 / 3;} .breakdance .zt-row__head {min-width: 0;} .breakdance .zt-row__name {display: inline; font-size: var(--zt-fs-h4); line-height: 1.15; font-weight: 800; letter-spacing: -0.025em;} .breakdance .zt-rec {display: none; margin-left: var(--zt-sp-3); padding: 2px var(--zt-sp-3); border-radius: var(--zt-r-pill); background: var(--zt-surface-2); color: var(--zt-fume); font-size: var(--zt-fs-3xs); font-weight: 800; line-height: 1.6; vertical-align: 4px; white-space: nowrap;} .breakdance .zt-row[data-rec] .zt-rec {display: inline-block;} .breakdance .zt-row .zt-spec {grid-area: 1 / 3 / 2 / 6; grid-template-columns: subgrid; padding: 0;} .breakdance .zt-row .zt-spec .zt-tag-dd, .breakdance .zt-row .zt-spec dd {font-size: var(--zt-fs-lg);} .breakdance .zt-row .zt-bar {top: calc(100% + 6px); max-width: 160px;} .breakdance .zt-row__act {display: flex; align-items: center; gap: var(--zt-sp-5);} .breakdance .zt-list__more {display: flex; flex-wrap: wrap; gap: 0 var(--zt-sp-8); margin-top: var(--zt-sp-5);} .breakdance .zt-groups {background: var(--zt-surface-2);} .breakdance .zt-groups__grid {display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: var(--zt-gap);} .breakdance .zt-groups__item {display: flex; grid-column: span 2;} .breakdance .zt-groups__item--lg {grid-column: span 5;} .breakdance .zt-tile {position: relative; flex: 1; display: grid; grid-template-rows: auto 1fr auto; grid-template-areas: "text" "stage" "meta"; overflow: hidden; background: var(--zt-bg); border-radius: var(--zt-r-panel);} .breakdance .zt-tile--lg {grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); grid-template-rows: 1fr auto; grid-template-areas: "text stage" "meta meta";} .breakdance .zt-tile__text {grid-area: text; padding: var(--zt-sp-6) var(--zt-sp-6) 0;} .breakdance .zt-tile--lg .zt-tile__text {padding: var(--zt-sp-9) 0 var(--zt-sp-8) var(--zt-sp-9);} .breakdance .zt-tile__name {font-size: var(--zt-fs-body); line-height: 1.3; font-weight: 750; letter-spacing: -0.012em;} .breakdance .zt-tile--lg .zt-tile__name {max-width: 11em; font-size: var(--zt-fs-tile); line-height: 1.2; letter-spacing: -0.02em;} .breakdance .zt-tile__line {max-width: 21em; margin-top: var(--zt-sp-3); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} .breakdance .zt-tile__link::after, .breakdance .zt-sector__link::after {content: ""; position: absolute; inset: 0; z-index: 2;} .breakdance .zt-tile__link:focus-visible, .breakdance .zt-sector__link:focus-visible {outline: none;} .breakdance .zt-tile:has(.zt-tile__link:focus-visible), .breakdance .zt-sector:has(.zt-sector__link:focus-visible) {outline: var(--zt-stroke) solid var(--zt-fume); outline-offset: 3px;} .breakdance .zt-tile__stage {--zt-air: var(--zt-sp-3); --zt-lift: var(--zt-sp-6); --zt-ih: calc((100% - var(--zt-air) - var(--zt-lift)) * var(--zt-scale, 1)); grid-area: stage; position: relative; min-height: var(--zt-stage-sm); overflow: hidden; isolation: isolate;} .breakdance .zt-tile--lg .zt-tile__stage {--zt-air: var(--zt-sp-10); --zt-lift: var(--zt-sp-9); min-height: var(--zt-stage-lg);} .breakdance .zt-tile__stage img {position: absolute; bottom: var(--zt-lift); left: 50%; width: auto; max-width: none; height: var(--zt-ih); mask-image: linear-gradient(to top, transparent var(--zt-foot, 0%), black calc(var(--zt-foot, 0%) + var(--zt-fade, 0%))); mix-blend-mode: multiply; filter: brightness(1.02); transform: translate(-50%, var(--zt-foot, 0%)); transform-origin: 50% calc(100% - var(--zt-foot, 0%));} .breakdance .zt-tile__stage::after {content: ""; position: absolute; left: 50%; bottom: calc(var(--zt-lift) - var(--zt-ih) * 0.03); z-index: -1; height: calc(var(--zt-ih) * 0.06); aspect-ratio: calc(var(--zt-sw, 0.5) / 0.06); background: radial-gradient(closest-side, var(--zt-contact), transparent); transform: translateX(-50%);} .breakdance .zt-tile__meta {grid-area: meta; display: flex; align-items: center; justify-content: space-between; gap: var(--zt-sp-3); padding: var(--zt-sp-3) var(--zt-sp-4) var(--zt-sp-3) var(--zt-sp-6); border-top: var(--zt-rule-floor);} .breakdance .zt-tile--lg .zt-tile__meta {padding-left: var(--zt-sp-9);} .breakdance .zt-tile__brands {font-size: var(--zt-fs-2xs); font-weight: 700; letter-spacing: 0.01em; color: var(--zt-text-2);} .breakdance .zt-go {display: grid; place-items: center; width: var(--zt-go); height: var(--zt-go); flex: none; border-radius: var(--zt-r-round); background: var(--zt-surface); color: var(--zt-fume);} .breakdance .zt-tile:hover .zt-go {background: var(--zt-fume); color: var(--zt-bg);} .breakdance .zt-services {background: var(--zt-surface);} .breakdance .zt-services__grid {display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--zt-sp-18);} .breakdance .zt-services__media {position: relative; min-height: 480px; overflow: hidden; border-radius: var(--zt-r-panel); background: var(--zt-surface-2);} .breakdance .zt-services__media img {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 64% 42%;} .breakdance .zt-services__list {border-top: var(--zt-rule-floor);} .breakdance .zt-svc {display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: var(--zt-sp-4) var(--zt-sp-10); padding: var(--zt-sp-8) 0; border-bottom: var(--zt-rule-floor);} .breakdance .zt-svc__title {font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} .breakdance .zt-svc__desc {max-width: 32em; margin-top: var(--zt-sp-3); color: var(--zt-text-2);} .breakdance .zt-svc__tel {display: inline-flex; align-items: center; gap: var(--zt-sp-2); min-height: var(--zt-touch); margin-top: var(--zt-sp-2); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} .breakdance .zt-svc__tel:hover {color: var(--zt-text-2);} .breakdance .zt-svc__tel strong {font-weight: 800; color: var(--zt-fume);} .breakdance .zt-svc__tel .zt-icon {color: var(--zt-fume);} .breakdance .zt-svc .zt-btn {min-width: 172px;} .breakdance .zt-trust {text-align: center;} .breakdance .zt-trust__head {max-width: 46rem; margin-inline: auto;} .breakdance .zt-trust__text {margin-top: var(--zt-sp-5); font-size: var(--zt-fs-md); color: var(--zt-text-2);} .breakdance .zt-brands {display: flex; justify-content: space-evenly; gap: var(--zt-sp-6); margin-top: var(--zt-sp-18); border-bottom: var(--zt-rule-floor);} .breakdance .zt-brand {display: block; padding-bottom: 0.2em; font-size: var(--zt-fs-mega); line-height: 1; font-weight: 800; letter-spacing: -0.05em; color: var(--zt-quiet);} .breakdance .zt-brand:hover {color: var(--zt-quiet);} .breakdance .zt-brand:hover {color: var(--zt-text);} .breakdance .zt-facts {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--zt-sp-6); margin-top: var(--zt-sp-14);} .breakdance .zt-fact .zt-tag-dt, .breakdance .zt-fact dt {font-size: var(--zt-fs-stat); line-height: 1; font-weight: 800; letter-spacing: -0.035em; color: var(--zt-fume);} .breakdance .zt-fact .zt-tag-dd, .breakdance .zt-fact dd {margin-top: var(--zt-sp-3); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} .breakdance .zt-sectors {background: var(--zt-surface-2);} .breakdance .zt-sectors__grid {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--zt-gap);} .breakdance .zt-sector {position: relative; display: flex; align-items: flex-end; aspect-ratio: 1; overflow: hidden; isolation: isolate; border-radius: var(--zt-r-panel); background: var(--zt-fume);} .breakdance .zt-sector img {position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; object-fit: cover;} .breakdance .zt-sector__text {width: 100%; padding: var(--zt-sp-24) var(--zt-sp-6) var(--zt-sp-5); background: linear-gradient(to top, var(--zt-scrim) 0%, var(--zt-scrim) 38%, var(--zt-scrim-0) 100%); color: var(--zt-on-photo);} .breakdance .zt-sector__name {font-size: var(--zt-fs-lg); line-height: 1.2; font-weight: 800; letter-spacing: -0.012em;} .breakdance .zt-sector__line {margin-top: var(--zt-sp-2); font-size: var(--zt-fs-xs); line-height: 1.45;} .breakdance .zt-quotes {background: var(--zt-surface);} .breakdance .zt-quotes__grid {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: var(--zt-sp-12);} .breakdance .zt-quote {display: flex; flex-direction: column; justify-content: space-between; gap: var(--zt-sp-8); padding-right: var(--zt-sp-16);} .breakdance .zt-quote + .zt-quote {padding: 0 0 0 var(--zt-sp-16); border-left: var(--zt-rule-floor);} .breakdance .zt-quote__text {max-width: 34em; font-size: var(--zt-fs-quote); line-height: 1.5; font-weight: 500; letter-spacing: -0.012em; text-wrap: pretty;} .breakdance .zt-quote__text p {text-indent: -0.42em;} .breakdance .zt-quote__by {display: flex; align-items: center; gap: var(--zt-sp-4);} .breakdance .zt-quote__ini {display: grid; place-items: center; width: var(--zt-avatar); height: var(--zt-avatar); flex: none; border: var(--zt-rule-floor); border-radius: var(--zt-r-round); background: var(--zt-bg); font-size: var(--zt-fs-xs); font-weight: 800; color: var(--zt-fume);} .breakdance .zt-quote__who {display: flex; flex-direction: column; font-size: var(--zt-fs-sm); line-height: 1.45; color: var(--zt-text-2);} .breakdance .zt-quote__who strong {font-weight: 700; color: var(--zt-text);} .breakdance .zt-faq__in {max-width: 880px;} .breakdance .zt-faq .zt-h2 {text-align: center;} .breakdance .zt-faq__list {margin-top: var(--zt-sp-10); border-top: var(--zt-rule);} .breakdance .zt-faq__item {border-bottom: var(--zt-rule);} .breakdance .zt-faq__q {display: flex; align-items: center; justify-content: space-between; gap: var(--zt-sp-6); min-height: 76px; padding: var(--zt-sp-4) 0; font-size: var(--zt-fs-lg); font-weight: 700; letter-spacing: -0.012em; cursor: pointer; list-style: none;} .breakdance .zt-faq__q::-webkit-details-marker {display: none;} .breakdance .zt-faq__q .zt-icon {color: var(--zt-fume);} .breakdance .zt-faq__item[open] .zt-faq__q .zt-icon {transform: rotate(180deg);} .breakdance .zt-faq__a {max-width: 44em; padding: 0 var(--zt-sp-14) var(--zt-sp-7) 0; color: var(--zt-text-2);} .breakdance .zt-offer {background: var(--zt-surface-2);} .breakdance .zt-offer__grid {display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--zt-sp-18); align-items: start;} .breakdance .zt-offer__text {max-width: 22em; margin-top: var(--zt-sp-5); font-size: var(--zt-fs-md); color: var(--zt-text-2);} .breakdance .zt-offer__direct {display: grid; justify-items: start; gap: var(--zt-sp-1); margin-top: var(--zt-sp-8); padding-top: var(--zt-sp-7); border-top: var(--zt-rule-floor);} .breakdance .zt-offer__tel, .breakdance .zt-offer__mail {display: inline-flex; align-items: center; gap: var(--zt-sp-3); min-height: var(--zt-sp-12); font-weight: 700; color: var(--zt-fume);} .breakdance .zt-offer__tel:hover, .breakdance .zt-offer__mail:hover {color: var(--zt-fume);} .breakdance .zt-offer__tel {font-size: var(--zt-fs-h4); letter-spacing: -0.02em;} .breakdance .zt-offer__tel .zt-icon {width: var(--zt-icon-lg); height: var(--zt-icon-lg);} .breakdance .zt-offer__panel {padding: var(--zt-sp-10); background: var(--zt-bg); border-radius: var(--zt-r-panel);} .breakdance .zt-form__grid, .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--zt-sp-5);} .breakdance .zt-field--full {grid-column: 1 / -1;} .breakdance .zt-field__label, .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field__label {display: block; margin-bottom: var(--zt-sp-2); font-size: var(--zt-fs-sm); font-weight: 700;} .breakdance .zt-field__input, .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field__input {display: block; width: 100%; min-height: var(--zt-field-h); padding: var(--zt-sp-3) var(--zt-sp-4); border: var(--zt-hair) solid var(--zt-field); border-radius: var(--zt-r-inner); background: var(--zt-bg); font-size: var(--zt-fs-base); line-height: 1.45;} .breakdance .zt-field__input:hover, .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field__input:hover {border-color: var(--zt-text-2);} .breakdance .zt-field__input:focus-visible, .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field__input:focus-visible {outline-offset: var(--zt-hair); border-color: var(--zt-fume);} .breakdance .zt-field__input[aria-invalid="true"], .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field__input[aria-invalid="true"] {border-color: var(--zt-error); box-shadow: inset 0 0 0 var(--zt-hair) var(--zt-error);} .breakdance textarea.zt-field__input, .breakdance :is(.zt-offer__panel, .zt-qp) textarea.breakdance-form-field__input {min-height: 116px; resize: vertical;} .breakdance .zt-field__error {margin-top: var(--zt-sp-2); font-size: var(--zt-fs-xs); font-weight: 600; color: var(--zt-error);} .breakdance .zt-field__error:empty {display: none;} .breakdance .zt-select {position: relative;} .breakdance .zt-select select {padding-right: var(--zt-sp-12); appearance: none; cursor: pointer;} .breakdance .zt-select .zt-icon {position: absolute; top: 50%; right: var(--zt-sp-4); margin-top: calc(var(--zt-icon) / -2); color: var(--zt-fume); pointer-events: none;} .breakdance .zt-hp {position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden;} .breakdance .zt-form__kvkk {margin: var(--zt-sp-6) 0 var(--zt-sp-5); font-size: var(--zt-fs-xs); color: var(--zt-text-2);} .breakdance .zt-form__status {margin-top: var(--zt-sp-3); font-size: var(--zt-fs-xs); font-weight: 600; color: var(--zt-error);} .breakdance .zt-form__status:empty {margin: 0;} .breakdance .zt-form__done:focus {outline: none;} .breakdance .zt-form__tick {display: grid; place-items: center; width: var(--zt-sp-14); height: var(--zt-sp-14); border-radius: var(--zt-r-round); background: var(--zt-surface); color: var(--zt-fume);} .breakdance .zt-form__tick .zt-icon {width: var(--zt-sp-7); height: var(--zt-sp-7);} .breakdance .zt-form__done-title {margin-top: var(--zt-sp-5); font-size: var(--zt-fs-h3); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} .breakdance .zt-form__done-text {max-width: 30em; margin-top: var(--zt-sp-3); color: var(--zt-text-2);} .breakdance .zt-footer {padding: var(--zt-sp-22) 0 var(--zt-sp-9); background: var(--zt-fume); color: var(--zt-on-fume);} .breakdance .zt-footer :focus-visible {outline-color: var(--zt-on-fume);} .breakdance .zt-footer__top {display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 5fr) minmax(0, 3fr); gap: var(--zt-sp-12);} .breakdance .zt-footer__brand img {width: auto; height: 44px;} .breakdance .zt-footer__lead {max-width: 22em; margin-top: var(--zt-sp-5); font-size: var(--zt-fs-sm); color: var(--zt-on-fume-2);} .breakdance .zt-footer__brand .zt-btn {margin-top: var(--zt-sp-7);} .breakdance .zt-footer__nav {display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); grid-template-rows: auto 1fr; gap: var(--zt-sp-8);} .breakdance .zt-footer__col--wide {grid-row: span 2;} .breakdance .zt-footer__h {margin-bottom: var(--zt-sp-3); font-size: var(--zt-fs-2xs); font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--zt-on-fume-2);} .breakdance .zt-footer__col a {display: inline-block; padding: var(--zt-sp-1) 0; font-size: var(--zt-fs-sm);} .breakdance .zt-footer__col a:hover, .breakdance .zt-footer__row:hover {color: var(--zt-bg);} .breakdance .zt-footer__address {display: grid; gap: var(--zt-sp-4);} .breakdance .zt-footer__row {display: flex; align-items: flex-start; gap: var(--zt-sp-3); font-size: var(--zt-fs-sm); line-height: 1.45;} .breakdance .zt-footer__row .zt-icon {margin-top: var(--zt-hair); color: var(--zt-on-fume-2);} .breakdance .zt-footer__row small {display: block; font-size: var(--zt-fs-2xs); color: var(--zt-on-fume-2);} .breakdance .zt-footer__bottom {display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--zt-sp-3) var(--zt-sp-8); margin-top: var(--zt-sp-18); padding-top: var(--zt-sp-6); border-top: var(--zt-hair) solid var(--zt-fume-line); font-size: var(--zt-fs-2xs); color: var(--zt-on-fume-2);} .breakdance .zt-footer__legal {display: flex; gap: var(--zt-sp-6);} .breakdance .zt-footer__legal a:hover {color: var(--zt-on-fume);} .breakdance .zt-footer__note {margin-top: var(--zt-sp-4); font-size: var(--zt-fs-2xs); color: var(--zt-on-fume-2);} .breakdance .zt-dock {display: none;} @media (prefers-reduced-motion: no-preference) { html {scroll-behavior: smooth;} .breakdance .zt-header::before, .breakdance .zt-header::after {transition: opacity 0.35s var(--zt-ease);} .breakdance .zt-icon {transition: transform var(--zt-dur-fast) var(--zt-ease);} .breakdance .zt-btn:hover > .zt-icon:last-child, .breakdance .zt-link:hover .zt-icon, .breakdance .zt-tile:hover .zt-go .zt-icon {transform: translateX(3px);} .breakdance .zt-tile__stage img, .breakdance .zt-stage img, .breakdance .zt-sector img, .breakdance .zt-dock a {transition: transform var(--zt-dur-slow) var(--zt-ease);} .breakdance .zt-dock a {transition-duration: 0.15s;} .breakdance .zt-tile:hover .zt-tile__stage img {transform: translate(-50%, var(--zt-foot, 0%)) scale(1.045);} .breakdance .zt-card:hover .zt-stage img, .breakdance .zt-row:hover .zt-stage img {transform: translate(-50%, var(--ft)) scale(1.04);} .breakdance .zt-sector:hover img {transform: scale(1.04);} .breakdance .zt-hero__m {animation: zt-settle var(--zt-dur-enter) var(--zt-ease) both;} .breakdance .zt-hero__machine .zt-shadow {animation: zt-in var(--zt-dur-enter) var(--zt-ease) both;} .breakdance .zt-fd__out > * {animation: zt-in 0.35s var(--zt-ease) both;} @keyframes zt-settle { from { transform: translateY(-18px); } } @keyframes zt-in { from { opacity: 0; transform: translateY(6px); } } } @media (max-width: 1199px) { :root {--zt-scrim-side: linear-gradient(90deg, rgb(20 28 32 / 0.1) 0%, rgb(20 28 32 / 0.14) 32%, rgb(20 28 32 / 0.74) 50%, rgb(20 28 32 / 0.82) 100%);} .breakdance .zt-header__bar {gap: var(--zt-sp-4);} .breakdance .zt-nav__link {padding: 0 clamp(var(--zt-sp-2), calc(1.6vw - 7px), var(--zt-sp-3));} .breakdance .zt-header__num {display: none;} .breakdance .zt-header__tel {justify-content: center; width: var(--zt-touch); border: var(--zt-stroke) solid var(--zt-ring); border-radius: var(--zt-r-round);} .breakdance .zt-hero__grid {grid-template-columns: minmax(0, 6fr) minmax(0, 6fr);} } @media (max-width: 1024px) { :root {--zt-gutter: var(--zt-sp-6); --zt-sec: var(--zt-sp-22); --zt-header-h: 68px; --zt-gap: var(--zt-sp-4); --zt-fs-h1: clamp(2.125rem, 9vw, 4rem); --zt-fs-mega: 9.6vw; --zt-hero-mw: 66vw; --zt-hero-top: var(--zt-sp-12); --zt-hero-pb: var(--zt-sp-6); --zt-card-img: 160px; --zt-row-img: 88px; --zt-scrim-top: none; --zt-scrim-low: none; --zt-scrim-side: linear-gradient(180deg, rgb(20 28 32 / 0.84) 0%, rgb(20 28 32 / 0.76) 54%, rgb(20 28 32 / 0.26) 76%, rgb(20 28 32 / 0.5) 100%);} .breakdance .zt-header__tel {margin-left: auto;} .breakdance .zt-header__menu {display: grid; place-items: center; width: 46px; height: 46px; padding: 0; border: 0; border-radius: var(--zt-r-round); background: transparent; cursor: pointer;} .breakdance .zt-header__menu .zt-icon {grid-area: 1 / 1; width: 26px; height: 26px;} .breakdance .zt-header__menu .zt-icon--close, .breakdance .zt-header.is-open .zt-icon--open {display: none;} .breakdance .zt-header.is-open .zt-icon--close {display: block;} .breakdance .zt-nav {position: absolute; top: 100%; left: 0; right: 0; display: none; max-height: calc(100dvh - var(--zt-header-h)); overflow-y: auto; padding: var(--zt-sp-2) var(--zt-gutter) var(--zt-sp-6); background: var(--zt-bg); color: var(--zt-text); border-bottom: var(--zt-rule); box-shadow: var(--zt-shadow-pop);} .breakdance .zt-header.is-open .zt-nav {display: block;} .breakdance .zt-nav__list {flex-direction: column; align-items: stretch; gap: 0;} .breakdance .zt-nav__item {border-bottom: var(--zt-rule);} .breakdance .zt-nav__link {justify-content: space-between; min-height: var(--zt-sp-14); padding: 0 var(--zt-sp-1); border-radius: 0; font-size: var(--zt-fs-body);} .breakdance .zt-nav__link:hover, .breakdance .zt-drop[open] > .zt-nav__link {background: transparent;} .breakdance .zt-header__bar {position: static;} .breakdance .zt-drop__panel {position: static; padding: 0 0 var(--zt-sp-4); border: 0; border-radius: 0; box-shadow: none;} .breakdance .zt-mega__grid {grid-template-columns: 100%; gap: var(--zt-sp-4);} .breakdance .zt-mega__label {margin-bottom: var(--zt-sp-1); padding-left: var(--zt-sp-1);} .breakdance .zt-mega__features, .breakdance .zt-mega__list, .breakdance .zt-mega--sektor .zt-mega__list {grid-template-columns: 100%; gap: 0;} .breakdance .zt-mega__feature, .breakdance .zt-mega__item {grid-template-columns: 64px minmax(0, 1fr); gap: var(--zt-sp-4); min-height: var(--zt-touch); padding: var(--zt-sp-2) var(--zt-sp-1);} .breakdance .zt-mega__stage, .breakdance .zt-mega__thumb {width: 64px; height: 50px; aspect-ratio: auto; border-radius: 10px;} .breakdance .zt-mega__name, .breakdance .zt-mega__list .zt-mega__name {font-size: var(--zt-fs-body); font-weight: 700;} .breakdance .zt-mega__desc, .breakdance .zt-mega__note {display: none;} .breakdance .zt-mega__foot {flex-direction: column; align-items: flex-start; gap: var(--zt-sp-3); margin-top: var(--zt-sp-3); padding: var(--zt-sp-4) var(--zt-sp-1) 0;} .breakdance .zt-mega__brands a:first-of-type {margin-left: 0;} .breakdance .zt-mega__all {padding: 0;} .breakdance .zt-nav__actions {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--zt-sp-3); margin-top: var(--zt-sp-5);} .breakdance .zt-hero__grid {grid-template-columns: 100%; grid-template-areas: "copy" "machine";} .breakdance .zt-hero__lead {font-size: var(--zt-fs-md);} .breakdance .zt-hero__machine {margin-left: calc(-1 * var(--zt-sp-2));} .breakdance .zt-mf__grid {grid-template-columns: 100%; gap: var(--zt-sp-8);} .breakdance .zt-all__sum {margin-left: 0;} .breakdance .zt-list__cols {display: none;} .breakdance .zt-row {grid-template-columns: var(--zt-row-img) minmax(0, 1fr) auto; grid-template-areas: "stage head act" "stage spec act"; row-gap: var(--zt-sp-1); padding-right: var(--zt-sp-4);} .breakdance .zt-row__stage {grid-area: stage; --zt-ratio: 1; aspect-ratio: 1;} .breakdance .zt-row__head {grid-area: head; align-self: end;} .breakdance .zt-row .zt-spec {grid-area: spec; align-self: start; display: flex; flex-wrap: wrap; gap: 0 var(--zt-sp-4);} .breakdance .zt-row .zt-spec .zt-tag-dd, .breakdance .zt-row .zt-spec dd {font-size: var(--zt-fs-base);} .breakdance .zt-row .zt-bar {display: none;} .breakdance .zt-row__act {grid-area: act;} .breakdance .zt-groups__grid {grid-template-columns: repeat(2, minmax(0, 1fr));} .breakdance .zt-groups__item, .breakdance .zt-groups__item--lg {grid-column: span 1;} .breakdance .zt-tile--lg {grid-template-columns: 100%; grid-template-rows: auto 1fr auto; grid-template-areas: "text" "stage" "meta";} .breakdance .zt-tile--lg .zt-tile__text {padding: var(--zt-sp-7) var(--zt-sp-7) 0;} .breakdance .zt-tile--lg .zt-tile__name {font-size: var(--zt-fs-quote);} .breakdance .zt-tile--lg .zt-tile__stage {--zt-air: 0px; --zt-lift: var(--zt-sp-7); min-height: 258px;} .breakdance .zt-tile--sm {grid-template-columns: var(--zt-thumb) minmax(0, 1fr) auto; grid-template-rows: auto auto; grid-template-areas: "stage text go" "stage brands go"; align-items: center; column-gap: var(--zt-sp-5); padding: var(--zt-sp-3) var(--zt-sp-3) var(--zt-sp-3) var(--zt-sp-4);} .breakdance .zt-tile--sm .zt-tile__text {align-self: end; padding: 0;} .breakdance .zt-tile--sm .zt-tile__meta {display: contents;} .breakdance .zt-tile--sm .zt-tile__brands {grid-area: brands; align-self: start;} .breakdance .zt-tile--sm .zt-go {grid-area: go; width: var(--zt-sp-9); height: var(--zt-sp-9);} .breakdance .zt-tile--sm .zt-tile__stage {--zt-air: 0px; --zt-lift: var(--zt-sp-2); min-height: 0; height: var(--zt-thumb);} .breakdance .zt-services__grid {grid-template-columns: 100%; gap: var(--zt-sp-10);} .breakdance .zt-services__media {min-height: 0; aspect-ratio: 16 / 9;} .breakdance .zt-services__media img {object-position: 60% 46%;} .breakdance .zt-brands {justify-content: space-between;} .breakdance .zt-facts {grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--zt-sp-10) var(--zt-sp-6);} .breakdance .zt-sector__text {padding: var(--zt-sp-16) var(--zt-sp-4) var(--zt-sp-4);} .breakdance .zt-sector__name {font-size: var(--zt-fs-base);} .breakdance .zt-sector__line {display: none;} .breakdance .zt-quotes__grid {grid-template-columns: 100%; margin-top: var(--zt-sp-10);} .breakdance .zt-quote {padding: 0 0 var(--zt-sp-10);} .breakdance .zt-quote + .zt-quote {padding: var(--zt-sp-10) 0 0; border-left: 0; border-top: var(--zt-rule-floor);} .breakdance .zt-offer__grid {grid-template-columns: 100%; gap: var(--zt-sp-10);} .breakdance .zt-footer__top {grid-template-columns: repeat(2, minmax(0, 1fr));} .breakdance .zt-footer__nav {grid-row: span 2;} } @media (max-width: 767px) { :root {--zt-gutter: var(--zt-sp-4); --zt-sec: var(--zt-sp-16); --zt-header-h: 64px; --zt-head-gap: var(--zt-sp-7); --zt-gap: var(--zt-sp-3); --zt-logo-h: 33px; --zt-fs-body: 1rem; --zt-fs-h2: clamp(1.625rem, 7.4vw, 2rem); --zt-fs-h1: clamp(2.125rem, 11.2vw, 3rem); --zt-fs-mega: 10.2vw; --zt-fs-h3: 1.375rem; --zt-fs-value: clamp(0.9375rem, 4.6vw, 1.0625rem); --zt-hero-mw: 92vw; --zt-hero-top: var(--zt-sp-6); --zt-hero-pb: var(--zt-sp-4); --zt-card-img: 96px; --zt-row-img: 72px;} body.breakdance {padding-bottom: calc(var(--zt-dock-h) + 2 * var(--zt-sp-3) + env(safe-area-inset-bottom, 0px));} .breakdance .zt-head {align-items: flex-start;} .breakdance .zt-head__lead {font-size: var(--zt-fs-body);} .breakdance .zt-header__bar {gap: var(--zt-sp-2);} .breakdance .zt-header__quote {display: none;} .breakdance .zt-header__tel {height: var(--zt-touch);} .breakdance .zt-header__logo {padding-block: 6px;} .breakdance .zt-nav {max-height: calc(100dvh - var(--zt-header-h) - var(--zt-dock-h) - 2 * var(--zt-sp-3) - env(safe-area-inset-bottom, 0px));} .breakdance .zt-nav__actions {display: none;} .breakdance .zt-hero__eyebrow {margin-bottom: var(--zt-sp-3); font-size: var(--zt-fs-xs);} .breakdance .zt-hero__lead {margin-top: var(--zt-sp-4); font-size: var(--zt-fs-body);} .breakdance .zt-hero__actions {gap: var(--zt-sp-3); margin-top: var(--zt-sp-6);} .breakdance .zt-hero__actions .zt-btn {flex: 1 1 auto; min-height: 54px; padding: 0 var(--zt-sp-5);} .breakdance .zt-hero__actions .zt-btn__num {display: none;} .breakdance .zt-hero__machine {margin-left: calc(-1 * var(--zt-sp-3));} .breakdance .zt-hero + .zt-section {padding-top: calc(var(--zt-hero-drop) + var(--zt-sp-10));} .breakdance .zt-mf__qs {padding: var(--zt-sp-5);} .breakdance .zt-fd__opt {padding: 0 var(--zt-sp-3); font-size: var(--zt-fs-xs);} .breakdance .zt-card {grid-template-rows: auto auto auto; grid-template-areas: "stage head" "spec spec" "act act"; column-gap: var(--zt-sp-4); padding: var(--zt-sp-3);} .breakdance .zt-card--grp {grid-template-areas: "stage head" "act act";} .breakdance .zt-card__head {align-self: center; padding-top: 0;} .breakdance .zt-spec {column-gap: var(--zt-sp-3); margin-top: var(--zt-sp-3); padding-top: var(--zt-sp-3); border-top: var(--zt-rule);} .breakdance .zt-card__act {justify-content: space-between; margin-top: var(--zt-sp-1);} .breakdance .zt-all__sum {display: flex; justify-content: center;} .breakdance .zt-list__bar {display: grid; gap: var(--zt-sp-3); margin-bottom: var(--zt-sp-4);} .breakdance .zt-list__ctl {display: grid; gap: 6px;} .breakdance .zt-seg {display: flex;} .breakdance .zt-seg--wrap {flex-wrap: wrap; border-radius: var(--zt-r-panel);} .breakdance .zt-seg__btn {flex: 1 1 auto; padding: 0 var(--zt-sp-3); font-size: var(--zt-fs-xs);} .breakdance .zt-row {grid-template-columns: var(--zt-row-img) minmax(0, 1fr); grid-template-areas: "stage head" "stage spec" "stage act"; align-items: start; column-gap: var(--zt-sp-4); row-gap: 2px; padding: 10px;} .breakdance .zt-row__name {font-size: var(--zt-fs-lg);} .breakdance .zt-row .zt-spec {margin: 0; padding: 0; border: 0; gap: 0 10px;} .breakdance .zt-row .zt-spec .zt-tag-dd, .breakdance .zt-row .zt-spec dd {font-size: var(--zt-fs-xs);} .breakdance .zt-row__act {justify-content: space-between; margin-top: 6px;} .breakdance .zt-rec {margin-left: var(--zt-sp-2);} .breakdance .zt-groups__grid {grid-template-columns: 100%;} .breakdance .zt-tile--lg .zt-tile__text {padding: var(--zt-sp-6) var(--zt-sp-6) 0;} .breakdance .zt-tile--lg .zt-tile__stage {--zt-lift: var(--zt-sp-6); min-height: 224px;} .breakdance .zt-tile__line {margin-top: var(--zt-sp-2);} .breakdance .zt-services__media {aspect-ratio: 4 / 3;} .breakdance .zt-svc {grid-template-columns: 100%; padding: var(--zt-sp-7) 0;} .breakdance .zt-svc .zt-btn {justify-self: start;} .breakdance .zt-trust {text-align: left;} .breakdance .zt-trust__text {font-size: var(--zt-fs-body);} .breakdance .zt-brands {margin-top: var(--zt-sp-12);} .breakdance .zt-facts {gap: var(--zt-sp-8) var(--zt-sp-4); margin-top: var(--zt-sp-10);} .breakdance .zt-sectors__grid {grid-template-columns: repeat(2, minmax(0, 1fr));} .breakdance .zt-sector__text {padding: var(--zt-sp-14) var(--zt-sp-3) var(--zt-sp-3);} .breakdance .zt-sector__name {font-size: var(--zt-fs-sm);} .breakdance .zt-quote {gap: var(--zt-sp-6);} .breakdance .zt-quote__text {font-size: var(--zt-fs-lg);} .breakdance .zt-faq .zt-h2 {text-align: left;} .breakdance .zt-faq__q {min-height: var(--zt-sp-16); font-size: var(--zt-fs-body);} .breakdance .zt-faq__a {padding-right: 0;} .breakdance .zt-faq__a a {white-space: normal;} .breakdance .zt-offer__text {font-size: var(--zt-fs-body);} .breakdance .zt-offer__tel {font-size: var(--zt-fs-quote);} .breakdance .zt-offer__panel {padding: var(--zt-sp-6) var(--zt-sp-5);} .breakdance .zt-form__grid, .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form {grid-template-columns: 100%; gap: var(--zt-sp-4);} .breakdance .zt-footer {padding-top: var(--zt-sp-16);} .breakdance .zt-footer__top {grid-template-columns: 100%; gap: var(--zt-sp-10);} .breakdance .zt-footer__nav {grid-row: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--zt-sp-7) var(--zt-sp-4);} .breakdance .zt-footer__col--wide {grid-column: 1 / -1; grid-row: auto;} .breakdance .zt-footer__col a {padding: var(--zt-sp-3) 0;} .breakdance .zt-footer__row {padding-block: var(--zt-sp-1);} .breakdance .zt-footer__bottom {flex-direction: column; margin-top: var(--zt-sp-12);} .breakdance .zt-footer__legal a {display: inline-block; padding: var(--zt-sp-3) 0;} .breakdance .zt-dock {position: fixed; inset: auto var(--zt-sp-3) calc(var(--zt-sp-3) + env(safe-area-inset-bottom, 0px)); z-index: 60; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px; height: var(--zt-dock-h); padding: 6px; border: var(--zt-hair) solid var(--zt-glass-line); border-radius: var(--zt-r-pill); background: var(--zt-dock); -webkit-backdrop-filter: saturate(1.4) blur(16px); backdrop-filter: saturate(1.4) blur(16px); box-shadow: var(--zt-shadow-dock); color: var(--zt-on-fume);} .breakdance .zt-dock a {display: flex; align-items: center; border-radius: var(--zt-r-pill);} .breakdance .zt-dock a:active {transform: scale(0.96);} .breakdance .zt-dock :focus-visible {outline-color: var(--zt-on-fume); outline-offset: 2px;} .breakdance .zt-dock__call {gap: 10px; padding: 0 14px 0 var(--zt-sp-1);} .breakdance .zt-dock__icon {display: grid; place-items: center; width: var(--zt-sp-10); height: var(--zt-sp-10); border-radius: var(--zt-r-round); background: var(--zt-dock-icon);} .breakdance .zt-dock__txt {display: grid; line-height: 1.2;} .breakdance .zt-dock__txt strong {font-size: var(--zt-fs-base); font-weight: 800;} .breakdance .zt-dock__txt small {font-size: var(--zt-fs-3xs); font-weight: 600; color: var(--zt-on-fume-2); font-variant-numeric: tabular-nums;} .breakdance .zt-dock__quote {justify-content: center; gap: var(--zt-sp-2); background: var(--zt-orange); color: var(--zt-on-orange); font-size: var(--zt-fs-base); font-weight: 800;} .breakdance .zt-dock__quote:hover {color: var(--zt-on-orange);} } @media (max-width: 359px) { .breakdance .zt-dock__txt small {display: none;} .breakdance .zt-seg__btn {padding: 0 var(--zt-sp-2); font-size: var(--zt-fs-3xs);} } .breakdance .zt-cookie {position: fixed; left: var(--zt-sp-5); bottom: var(--zt-sp-5); z-index: 60; display: grid; gap: var(--zt-sp-4); width: min(440px, calc(100% - 2 * var(--zt-sp-5))); max-height: calc(100dvh - 2 * var(--zt-sp-5)); overflow-y: auto; overscroll-behavior: contain; padding: var(--zt-sp-5); border: var(--zt-hair) solid var(--zt-line); border-radius: var(--zt-r-panel); background: var(--zt-bg); box-shadow: var(--zt-shadow-pop);} .breakdance .zt-cookie__text {color: var(--zt-text-2); font-size: var(--zt-fs-sm); line-height: 1.55;} .breakdance .zt-cookie__text a {color: var(--zt-text); text-decoration: underline; text-underline-offset: 3px;} .breakdance .zt-cookie__text a:hover {color: var(--zt-text);} .breakdance .zt-cookie__actions {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zt-sp-2);} .breakdance .zt-cookie .zt-btn {min-height: var(--zt-touch); padding: 0 var(--zt-sp-3); font-size: var(--zt-fs-sm);} .breakdance .zt-cookie__prefs {display: grid; gap: var(--zt-sp-3); padding-top: var(--zt-sp-4); border-top: var(--zt-hair) solid var(--zt-line);} .breakdance .zt-cookie__option {display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: start; gap: var(--zt-sp-3); color: var(--zt-text-2); font-size: var(--zt-fs-sm); line-height: 1.5; cursor: pointer;} .breakdance .zt-cookie__option input {width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--zt-fume);} .breakdance .zt-cookie__option b {display: block; color: var(--zt-text); font-weight: 700;} @media (max-width: 767px) { .breakdance .zt-cookie {left: var(--zt-sp-3); right: var(--zt-sp-3); bottom: calc(var(--zt-dock-h) + 2 * var(--zt-sp-3) + env(safe-area-inset-bottom, 0px)); width: auto; max-height: calc(100dvh - var(--zt-dock-h) - 4 * var(--zt-sp-3) - env(safe-area-inset-bottom, 0px)); padding: var(--zt-sp-4); gap: var(--zt-sp-3);} } [hidden] {display: none;} .breakdance .zt-cta {display: grid; align-items: center; border-radius: var(--zt-r-panel);} .breakdance .zt-cta__title {font-weight: 800; line-height: 1.15; letter-spacing: -0.025em; text-wrap: balance;} .breakdance .zt-cta__lead {margin-top: var(--zt-sp-2);} .breakdance .zt-cta__act {display: flex; flex-wrap: wrap; align-items: center; gap: var(--zt-sp-3);} .breakdance .zt-cta--fume {grid-template: ". media" 1fr "body media" auto "act media" auto ". media" 1fr / minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--zt-sp-12); padding: var(--zt-sp-3); background: var(--zt-fume-deep); color: var(--zt-on-fume);} .breakdance .zt-cta--fume :focus-visible {outline-color: var(--zt-on-fume);} .breakdance .zt-cta--fume > .zt-cta__body {grid-area: body; padding: var(--zt-sp-8) 0 0 var(--zt-sp-10);} .breakdance .zt-cta--fume > .zt-cta__act {grid-area: act; padding: var(--zt-sp-7) 0 var(--zt-sp-8) var(--zt-sp-10);} .breakdance .zt-cta--fume .zt-cta__title {font-size: var(--zt-fs-h3);} .breakdance .zt-cta--fume .zt-cta__lead {font-size: var(--zt-fs-md); line-height: 1.5; color: var(--zt-on-photo-2);} .breakdance .zt-cta__media {grid-area: media; --zt-ratio: 0.5625; aspect-ratio: 16 / 9;} .breakdance .zt-cta--slim {grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--zt-sp-4) var(--zt-sp-6); padding: var(--zt-sp-6) var(--zt-sp-7); background: var(--zt-surface);} .breakdance .zt-cta__ico {display: grid; place-items: center; width: var(--zt-sp-12); height: var(--zt-sp-12); border-radius: var(--zt-r-round); background: var(--zt-bg); color: var(--zt-fume); box-shadow: var(--zt-shadow-seg);} .breakdance .zt-cta__ico .zt-icon {width: var(--zt-icon-lg); height: var(--zt-icon-lg); stroke-width: 1.6;} .breakdance .zt-cta--slim .zt-cta__title {font-size: var(--zt-fs-h4);} .breakdance .zt-cta--slim .zt-cta__lead {font-size: var(--zt-fs-sm); color: var(--zt-text-2);} .breakdance .zt-cta--slim > .zt-cta__act {display: grid; grid-template-columns: auto auto; justify-content: end;} .breakdance .zt-cta__more {grid-column: 1 / -1; justify-self: end; margin-block: calc(-1 * var(--zt-sp-2)) calc(-1 * var(--zt-sp-3)); font-size: var(--zt-fs-sm);} .breakdance .zt-cta--dark {background: var(--zt-fume-deep); color: var(--zt-on-fume);} .breakdance .zt-cta--dark :focus-visible {outline-color: var(--zt-on-fume);} .breakdance .zt-cta--dark .zt-cta__lead {color: var(--zt-on-photo-2);} .breakdance .zt-cta--dark .zt-cta__ico {background: var(--zt-dock-icon); color: var(--zt-on-fume); box-shadow: none;} .breakdance .zt-cta--dark .zt-cta__more {color: var(--zt-on-fume-2);} .breakdance .zt-cta--dark .zt-cta__more:hover {color: var(--zt-on-fume-2);} .breakdance .zt-cta--dark .zt-cta__more:hover {color: var(--zt-on-fume);} @media (max-width: 1024px) { .breakdance .zt-cta--fume {grid-template: "body media" auto "act act" auto / minmax(0, 1fr) var(--zt-cta-stage, 144px); gap: var(--zt-sp-6) var(--zt-sp-8); padding: var(--zt-sp-8);} .breakdance .zt-cta--fume > .zt-cta__body, .breakdance .zt-cta--fume > .zt-cta__act {padding: 0;} .breakdance .zt-cta__media {--zt-ratio: 1; aspect-ratio: 1; border-radius: var(--zt-r-inner);} .breakdance .zt-cta--slim {grid-template: "ico title" auto "ico lead" auto ". act" auto / auto minmax(0, 1fr); row-gap: var(--zt-sp-1);} .breakdance .zt-cta--slim > .zt-cta__body {display: contents;} .breakdance .zt-cta--slim .zt-cta__title {grid-area: title;} .breakdance .zt-cta--slim .zt-cta__lead {grid-area: lead; margin: 0;} .breakdance .zt-cta--slim > .zt-cta__act {grid-area: act; justify-content: start; padding-top: var(--zt-sp-4);} .breakdance .zt-cta__ico {grid-area: ico; align-self: start;} .breakdance .zt-cta__more {justify-self: start;} } @media (max-width: 767px) { .breakdance .zt-cta--fume {grid-template: "title media" auto "lead lead" auto "act act" auto / minmax(0, 1fr) var(--zt-cta-stage, 96px); gap: var(--zt-sp-3) var(--zt-sp-4); padding: var(--zt-sp-5);} .breakdance .zt-cta--fume > .zt-cta__body {display: contents;} .breakdance .zt-cta--fume .zt-cta__title {grid-area: title;} .breakdance .zt-cta--fume .zt-cta__lead {grid-area: lead; margin: 0; font-size: var(--zt-fs-sm);} .breakdance .zt-cta--fume > .zt-cta__act {padding-top: var(--zt-sp-2);} .breakdance .zt-cta > .zt-cta__act {display: grid; grid-template-columns: 100%; gap: 10px;} .breakdance .zt-cta .zt-btn {min-height: var(--zt-btn-h); padding-inline: var(--zt-sp-5); font-size: var(--zt-fs-base);} .breakdance .zt-cta--slim {grid-template: "ico title" auto "lead lead" auto "act act" auto / auto minmax(0, 1fr); gap: var(--zt-sp-3) var(--zt-sp-4); padding: var(--zt-sp-5);} .breakdance .zt-cta--slim .zt-cta__title {align-self: center; font-size: var(--zt-fs-lg);} .breakdance .zt-cta--slim > .zt-cta__act {padding-top: var(--zt-sp-1);} .breakdance .zt-cta__ico {width: var(--zt-sp-10); height: var(--zt-sp-10); align-self: center;} .breakdance .zt-cta__more {justify-self: center; margin: 0;} } @media (max-width: 359px) { .breakdance .zt-cta--fume, .breakdance .zt-cta--slim {padding: var(--zt-sp-4);} .breakdance .zt-cta--fume {--zt-cta-stage: 84px;} } @media (prefers-reduced-motion: no-preference) { .breakdance .zt-cta {transition: opacity var(--zt-dur-slow) var(--zt-ease), transform var(--zt-dur-slow) var(--zt-ease);} .breakdance .zt-cta.is-out:not(:focus-within) {opacity: 0; transform: translateY(var(--zt-sp-6));} } .breakdance .zt-qp {width: min(520px, 100% - 2 * var(--zt-gutter)); max-width: none; max-height: calc(100dvh - 2 * var(--zt-sp-8)); padding: 0; border: 0; border-radius: var(--zt-r-panel); background: var(--zt-bg); color: var(--zt-text); box-shadow: var(--zt-shadow-pop); overflow: hidden;} .breakdance .breakdance-popup-open .zt-qp, .breakdance .zt-qp__form {display: flex; flex-direction: column; min-height: 0;} .breakdance .zt-qp__head {display: flex; align-items: center; justify-content: space-between; gap: var(--zt-sp-4); padding: var(--zt-sp-5) var(--zt-sp-5) 0 var(--zt-sp-8);} .breakdance .zt-qp__title {font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} .breakdance .zt-qp:has(.zt-qp__done:not([hidden])) .zt-qp__title {visibility: hidden;} .breakdance .zt-qp__x {display: grid; place-items: center; width: var(--zt-touch); height: var(--zt-touch); padding: 0; border: 0; border-radius: var(--zt-r-round); background: var(--zt-surface); color: var(--zt-fume); cursor: pointer;} .breakdance .zt-qp__body {display: grid; gap: var(--zt-sp-4); padding: var(--zt-sp-1) var(--zt-sp-8) var(--zt-sp-6); overflow: auto; overscroll-behavior: contain;} .breakdance .zt-qp__lead {margin-bottom: var(--zt-sp-1); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} .breakdance .zt-qp__m {display: flex; align-items: center; gap: var(--zt-sp-4); padding: var(--zt-sp-2); border-radius: var(--zt-r-inner); background: var(--zt-surface);} .breakdance .zt-qp__thumb {flex: none; width: var(--zt-sp-16); aspect-ratio: 1; border-radius: calc(var(--zt-r-inner) - var(--zt-sp-2)); background: var(--zt-bg);} .breakdance .zt-qp__m .zt-tag-dt, .breakdance .zt-qp__m dt {font-size: var(--zt-fs-2xs); font-weight: 700; color: var(--zt-text-2);} .breakdance .zt-qp__m .zt-tag-dd, .breakdance .zt-qp__m dd {font-size: var(--zt-fs-md); line-height: 1.3; font-weight: 800;} .breakdance .zt-qp .zt-form__kvkk {margin: 0;} .breakdance .zt-qp__foot {padding: var(--zt-sp-4) var(--zt-sp-8) var(--zt-sp-6); border-top: var(--zt-rule);} .breakdance .zt-qp__done {padding: 0 var(--zt-sp-8) var(--zt-sp-8); overflow: auto;} .breakdance :where(.zt-qp__done) .zt-btn {margin-top: var(--zt-sp-7); background: none;} @media (prefers-reduced-motion: no-preference) { .breakdance .breakdance-popup-open .zt-qp {animation: zt-in 0.32s var(--zt-ease) both;} .breakdance .zt-qp .zt-btn:active {transition: transform 0.15s var(--zt-ease); transform: scale(0.97);} @keyframes zt-fade { from { opacity: 0; } } @keyframes zt-sheet-in { from { transform: translateY(100%); } } } @media (max-width: 767px) { .breakdance .zt-qp {inset: auto 0 0; width: 100%; max-height: 92dvh; margin: 0; border-radius: var(--zt-r-panel) var(--zt-r-panel) 0 0; box-shadow: var(--zt-sheet-shadow);} .breakdance .zt-qp__head {padding: var(--zt-sp-3) var(--zt-sp-3) 0 var(--zt-sp-4);} .breakdance .zt-qp__title {font-size: var(--zt-fs-lg);} .breakdance .zt-qp__body {padding-inline: var(--zt-sp-4);} .breakdance .zt-qp__foot {padding: var(--zt-sp-3) var(--zt-sp-4) calc(var(--zt-sp-3) + env(safe-area-inset-bottom, 0px));} .breakdance .zt-qp__done {padding: 0 var(--zt-sp-4) calc(var(--zt-sp-5) + env(safe-area-inset-bottom, 0px));} } @media (prefers-reduced-motion: no-preference) and (max-width: 767px) { .breakdance .breakdance-popup-open .zt-qp {animation-name: zt-sheet-in;} } body.breakdance.zt-page--kategori .zt-hero--kat {--zt-scrim-side: linear-gradient(90deg, rgb(20 28 32 / 0.1) 0%, rgb(20 28 32 / 0.16) 18%, rgb(20 28 32 / 0.76) 33%, rgb(20 28 32 / 0.84) 100%);} body.breakdance.zt-page--kategori .zt-hero--kat .zt-hero__grid {grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);} body.breakdance.zt-page--kategori .zt-hero--kat .zt-hero__machine {justify-self: center; width: auto; margin-left: 0;} body.breakdance.zt-page--kategori .zt-hero--kat .zt-hero__m {width: calc(var(--zt-hero-mw) * min(1.25, sqrt(1.357 * var(--ar, 0.738)), 1.356 * var(--ar, 0.738))); max-width: none; height: auto;} body.breakdance.zt-page--kategori .zt-hero--kat .zt-hero__machine .zt-shadow {left: 6%; width: 86%;} body.breakdance.zt-page--kategori .zt-hero--kat .zt-hero__title {max-width: 13em; font-size: var(--zt-kat-h1);} body.breakdance.zt-page--kategori .zt-hero--kat .zt-hero__lead {max-width: 34em;} body.breakdance.zt-page--kategori .zt-crumbs ol {display: flex; flex-wrap: wrap; gap: 0 var(--zt-sp-2); margin: 0 0 var(--zt-sp-5); padding: 0; list-style: none; font-size: var(--zt-fs-2xs); font-weight: 600; color: var(--zt-on-photo-2);} body.breakdance.zt-page--kategori .zt-crumbs li + li::before {content: "/"; margin-right: var(--zt-sp-2);} body.breakdance.zt-page--kategori .zt-crumbs a {display: inline-block; padding: var(--zt-sp-3) 0; margin: calc(-1 * var(--zt-sp-3)) 0;} body.breakdance.zt-page--kategori .zt-crumbs a:hover, body.breakdance.zt-page--kategori .zt-crumbs [aria-current] {color: var(--zt-on-fume);} body.breakdance.zt-page--kategori .zt-cp {display: grid; grid-template-columns: var(--zt-cp-side) minmax(0, 1fr) var(--zt-cp-q2); grid-template-rows: auto 1fr; grid-template-areas: "title qs qs" "side qs qs"; column-gap: var(--zt-sp-10); margin-bottom: var(--zt-sp-10); padding: var(--zt-sp-8); border-radius: var(--zt-r-panel); background: var(--zt-surface);} html:has(> body.breakdance.zt-page--kategori):not(.zt-js) .zt-cp, html:has(> body.breakdance.zt-page--kategori):not(.zt-js) .zt-kl__bar, html:has(> body.breakdance.zt-page--kategori):not(.zt-js) .zt-kl__sort, html:has(> body.breakdance.zt-page--kategori):not(.zt-js) .zt-kl__more {display: none;} body.breakdance.zt-page--kategori .zt-cp__title {grid-area: title; font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} body.breakdance.zt-page--kategori .zt-cp__qs {grid-area: qs; display: grid; grid-template-columns: subgrid; align-content: start; row-gap: var(--zt-sp-6);} body.breakdance.zt-page--kategori .zt-cp__q .zt-fd__label {margin-bottom: 10px;} body.breakdance.zt-page--kategori .zt-nw {white-space: nowrap;} body.breakdance.zt-page--kategori .zt-cp__q .zt-fd__opt {position: relative; min-height: var(--zt-opt-h); padding: 0 clamp(var(--zt-sp-3), 1.1vw, var(--zt-sp-4)); border-color: var(--zt-line); font-size: var(--zt-fs-xs); color: var(--zt-text-2);} body.breakdance.zt-page--kategori .zt-cp__q .zt-fd__opt:hover {color: var(--zt-text-2);} body.breakdance.zt-page--kategori .zt-cp__q .zt-fd__opt::after, body.breakdance.zt-page--kategori .zt-tok::after {content: ""; position: absolute; inset: calc((var(--zt-opt-h) - var(--zt-touch)) / 2) 0;} body.breakdance.zt-page--kategori .zt-cp__q .zt-fd__opt:hover {border-color: var(--zt-field); color: var(--zt-text);} body.breakdance.zt-page--kategori .zt-cp__q .zt-fd__opt.is-on {background: var(--zt-bg); border-color: var(--zt-fume); box-shadow: inset 0 0 0 var(--zt-hair) var(--zt-fume); color: var(--zt-fume);} body.breakdance.zt-page--kategori .zt-cp__q .zt-fd__opt.is-on:hover {color: var(--zt-fume);} body.breakdance.zt-page--kategori .zt-cp__foot {grid-area: side; align-self: start; display: flex; flex-wrap: wrap; align-items: center; gap: var(--zt-sp-1) var(--zt-sp-3); margin-top: var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-cp__toks {display: flex; flex-wrap: wrap; gap: var(--zt-sp-2);} body.breakdance.zt-page--kategori .zt-tok {--zt-opt-h: var(--zt-sp-8); position: relative; display: inline-flex; align-items: center; gap: var(--zt-sp-1); height: var(--zt-opt-h); padding: 0 var(--zt-sp-2) 0 var(--zt-sp-3); border: var(--zt-hair) solid var(--zt-line); border-radius: var(--zt-r-pill); background: var(--zt-bg); font-size: var(--zt-fs-2xs); font-weight: 700; color: var(--zt-fume); white-space: nowrap; cursor: pointer;} body.breakdance.zt-page--kategori .zt-tok:hover {border-color: var(--zt-fume);} body.breakdance.zt-page--kategori .zt-tok .zt-icon {color: var(--zt-text-3);} body.breakdance.zt-page--kategori .zt-clear {display: inline-flex; align-items: center; gap: 6px; min-height: var(--zt-touch); padding: 0 var(--zt-sp-1); border: 0; background: none; font-size: var(--zt-fs-xs); font-weight: 700; color: var(--zt-fume); white-space: nowrap; cursor: pointer;} body.breakdance.zt-page--kategori .zt-clear:hover {text-decoration: underline; text-underline-offset: 3px;} body.breakdance.zt-page--kategori .zt-cp__bin {display: block; flex-basis: 100%; min-height: var(--zt-touch); padding-block: var(--zt-sp-1); font-size: var(--zt-fs-xs); white-space: normal;} body.breakdance.zt-page--kategori .zt-cp__bin .zt-icon {display: inline-block; margin-left: var(--zt-sp-1); vertical-align: -5px;} body.breakdance.zt-page--kategori .zt-kl__meta {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--zt-sp-3) var(--zt-sp-6); margin-bottom: var(--zt-sp-5);} body.breakdance.zt-page--kategori .zt-kl .zt-seg__btn {padding: 0 var(--zt-sp-4);} body.breakdance.zt-page--kategori .zt-kl__bar {display: none;} body.breakdance.zt-page--kategori .zt-kl__count {font-weight: 700;} body.breakdance.zt-page--kategori .zt-kl__count:focus {outline: none;} body.breakdance.zt-page--kategori .zt-kl__more {display: flex; width: fit-content; margin: var(--zt-sp-10) auto 0; background: var(--zt-bg);} body.breakdance.zt-page--kategori .zt-kl__more .zt-icon {width: var(--zt-icon-sm); height: var(--zt-icon-sm);} body.breakdance.zt-page--kategori .zt-kl__empty {display: grid; justify-items: start; gap: var(--zt-sp-2); padding: var(--zt-sp-8); border: var(--zt-rule); border-radius: var(--zt-r-panel); background: var(--zt-bg);} body.breakdance.zt-page--kategori .zt-kl__empty p {font-size: var(--zt-fs-md); font-weight: 700;} body.breakdance.zt-page--kategori .zt-btn--fume {background: var(--zt-fume); border-color: var(--zt-fume); color: var(--zt-on-fume);} body.breakdance.zt-page--kategori .zt-btn--fume:hover {color: var(--zt-on-fume);} body.breakdance.zt-page--kategori .zt-btn--fume:hover {background: var(--zt-fume-deep); border-color: var(--zt-fume-deep);} body.breakdance.zt-page--kategori .zt-kc__list {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--zt-kc-gap);} .zt-js body.breakdance.zt-page--kategori .zt-kc.is-more {display: none;} body.breakdance.zt-page--kategori .zt-kl .zt-kc {position: relative; grid-row: span 4; grid-template-columns: minmax(0, 1fr); grid-template-rows: subgrid; grid-template-areas: "stage" "main" "data" "act"; row-gap: 0; padding: var(--zt-sp-3); box-shadow: var(--zt-kc-shadow);} body.breakdance.zt-page--kategori .zt-kl .zt-kc::after {content: ""; position: absolute; inset: calc(-1 * var(--zt-hair)); border-radius: inherit; box-shadow: var(--zt-kc-lift); opacity: 0; pointer-events: none;} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-card__stage {--zt-ratio: 0.4; aspect-ratio: 5 / 2;} body.breakdance.zt-page--kategori .zt-kc__main, body.breakdance.zt-page--kategori .zt-kc__data, body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-card__act {padding-inline: var(--zt-kc-in);} body.breakdance.zt-page--kategori .zt-kc__main {grid-area: main; padding-top: var(--zt-sp-5);} body.breakdance.zt-page--kategori .zt-kc__data {grid-area: data; padding-top: var(--zt-sp-5);} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-card__head {padding-top: 0;} body.breakdance.zt-page--kategori .zt-kc__brand {font-weight: 700; color: var(--zt-text);} body.breakdance.zt-page--kategori .zt-kc__desc {grid-area: desc; margin-top: var(--zt-sp-2); font-size: var(--zt-fs-sm); line-height: 1.55; color: var(--zt-text-2);} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-spec {grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.15fr); padding: 0 0 var(--zt-sp-5);} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-spec .zt-tag-dd, body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-spec dd {white-space: normal;} body.breakdance.zt-page--kategori .zt-kc__q {white-space: nowrap;} body.breakdance.zt-page--kategori .zt-kc__note {grid-area: note; font-size: var(--zt-fs-3xs); line-height: 1.45; color: var(--zt-text-3);} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-card__act {gap: var(--zt-sp-3); padding-block: var(--zt-sp-4) var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-kc .zt-card__act .zt-btn {min-width: 128px;} body.breakdance.zt-page--kategori .zt-kc .zt-btn--fume:hover {background: var(--zt-orange); border-color: var(--zt-orange); color: var(--zt-on-orange);} body.breakdance.zt-page--kategori .zt-kc__img {display: contents;} body.breakdance.zt-page--kategori .zt-kc__mark, body.breakdance.zt-page--kategori .zt-kc__pills {position: absolute; z-index: 1; top: var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-kc__mark {top: 17px; left: var(--zt-sp-3); font-size: 11px; line-height: 1; font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase; color: var(--zt-fume);} body.breakdance.zt-page--kategori .zt-kc__pills {right: var(--zt-sp-3); display: flex; gap: 6px;} body.breakdance.zt-page--kategori .zt-kc__pill {padding: 4px 10px; border-radius: var(--zt-r-pill); background: var(--zt-bg); box-shadow: var(--zt-shadow-seg); font-size: var(--zt-fs-3xs); line-height: 1.3; font-weight: 700; color: var(--zt-fume); white-space: nowrap;} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-card__meta {display: none;} body.breakdance.zt-page--kategori .zt-kc__ico {display: block; width: 26px; height: 26px; margin-bottom: var(--zt-sp-2); fill: none; stroke: var(--zt-fume); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; opacity: 0.75;} body.breakdance.zt-page--kategori .zt-kc__link {color: inherit; text-decoration: none;} body.breakdance.zt-page--kategori .zt-kc__link:hover {color: inherit;} body.breakdance.zt-page--kategori .zt-kc__link:hover {text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.12em;} @media (hover: hover) and (min-width: 1025px) { body.breakdance.zt-page--kategori .zt-kl .zt-kc:hover::after {opacity: 1;} } body.breakdance.zt-page--kategori .zt-sheet {position: fixed; inset: auto 0 0; width: 100%; max-width: 100%; max-height: min(90dvh, 740px); margin: 0; padding: 0; border: 0; border-radius: var(--zt-r-panel) var(--zt-r-panel) 0 0; background: var(--zt-bg); color: var(--zt-text); box-shadow: var(--zt-sheet-shadow); overflow: auto; overscroll-behavior: contain;} body.breakdance.zt-page--kategori .zt-sheet::backdrop {background: var(--zt-backdrop);} body.breakdance.zt-page--kategori .zt-sheet__in {padding: 0 var(--zt-sp-4) calc(var(--zt-sp-3) + env(safe-area-inset-bottom, 0px));} body.breakdance.zt-page--kategori .zt-sheet__head, body.breakdance.zt-page--kategori .zt-sheet__foot {position: sticky; z-index: 1; display: flex; align-items: center; gap: var(--zt-sp-3); background: var(--zt-bg);} body.breakdance.zt-page--kategori .zt-sheet__head {top: 0; justify-content: space-between; padding-block: var(--zt-sp-2);} body.breakdance.zt-page--kategori .zt-sheet__title {font-size: var(--zt-fs-lg); font-weight: 800; letter-spacing: -0.012em;} body.breakdance.zt-page--kategori .zt-sheet__close, body.breakdance.zt-page--kategori .zt-qp__x {display: grid; place-items: center; width: var(--zt-touch); height: var(--zt-touch); padding: 0; border: 0; border-radius: var(--zt-r-round); background: var(--zt-surface); color: var(--zt-fume); cursor: pointer;} body.breakdance.zt-page--kategori .zt-sheet__body .zt-cp__qs {grid-template-columns: 100%; gap: var(--zt-sp-4); padding: var(--zt-sp-1) 0 var(--zt-sp-4);} body.breakdance.zt-page--kategori .zt-sheet__body .zt-list__ctl {display: grid; gap: var(--zt-sp-2); padding: var(--zt-sp-4) 0; border-top: var(--zt-rule);} body.breakdance.zt-page--kategori .zt-sheet__foot {bottom: 0; justify-content: space-between; padding-block: var(--zt-sp-3) var(--zt-sp-1); border-top: var(--zt-rule);} body.breakdance.zt-page--kategori .zt-sheet__foot .zt-btn {flex: 0 1 auto; min-width: 0; padding: 0 var(--zt-sp-6);} .zt-lock, .zt-lock body.breakdance.zt-page--kategori {overflow: hidden;} .zt-lock {scrollbar-gutter: stable;} body.breakdance.zt-page--kategori .zt-qp {width: min(520px, 100% - 2 * var(--zt-gutter)); max-width: none; max-height: calc(100dvh - 2 * var(--zt-sp-8)); padding: 0; border: 0; border-radius: var(--zt-r-panel); background: var(--zt-bg); color: var(--zt-text); box-shadow: var(--zt-shadow-pop); overflow: hidden;} body.breakdance.zt-page--kategori .breakdance-popup-open .zt-qp, body.breakdance.zt-page--kategori .zt-qp__form {display: flex; flex-direction: column; min-height: 0;} body.breakdance.zt-page--kategori .zt-qp__head {display: flex; align-items: center; justify-content: space-between; gap: var(--zt-sp-4); padding: var(--zt-sp-5) var(--zt-sp-5) 0 var(--zt-sp-8);} body.breakdance.zt-page--kategori .zt-qp__title {font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} body.breakdance.zt-page--kategori .zt-qp:has(.zt-qp__done:not([hidden])) .zt-qp__title {visibility: hidden;} body.breakdance.zt-page--kategori .zt-qp__body {display: grid; gap: var(--zt-sp-4); padding: var(--zt-sp-1) var(--zt-sp-8) var(--zt-sp-6); overflow: auto; overscroll-behavior: contain;} body.breakdance.zt-page--kategori .zt-qp__lead {margin-bottom: var(--zt-sp-1); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} body.breakdance.zt-page--kategori .zt-qp__m {display: flex; align-items: center; gap: var(--zt-sp-4); padding: var(--zt-sp-2); border-radius: var(--zt-r-inner); background: var(--zt-surface);} body.breakdance.zt-page--kategori .zt-qp__thumb {flex: none; width: var(--zt-sp-16); aspect-ratio: 1; border-radius: calc(var(--zt-r-inner) - var(--zt-sp-2)); background: var(--zt-bg);} body.breakdance.zt-page--kategori .zt-qp__m .zt-tag-dt, body.breakdance.zt-page--kategori .zt-qp__m dt {font-size: var(--zt-fs-2xs); font-weight: 700; color: var(--zt-text-2);} body.breakdance.zt-page--kategori .zt-qp__m .zt-tag-dd, body.breakdance.zt-page--kategori .zt-qp__m dd {font-size: var(--zt-fs-md); line-height: 1.3; font-weight: 800;} body.breakdance.zt-page--kategori .zt-qp .zt-form__kvkk {margin: 0;} body.breakdance.zt-page--kategori .zt-qp__foot {padding: var(--zt-sp-4) var(--zt-sp-8) var(--zt-sp-6); border-top: var(--zt-rule);} body.breakdance.zt-page--kategori .zt-qp__done {padding: 0 var(--zt-sp-8) var(--zt-sp-8); overflow: auto;} body.breakdance.zt-page--kategori :where(.zt-qp__done) .zt-btn {margin-top: var(--zt-sp-7); background: none;} body.breakdance.zt-page--kategori .zt-groups--rel .zt-groups__grid {grid-template-columns: repeat(12, minmax(0, 1fr));} body.breakdance.zt-page--kategori .zt-groups--rel .zt-groups__item {grid-column: span 3;} body.breakdance.zt-page--kategori .zt-groups--rel .zt-groups__item--lg {grid-column: span 6;} body.breakdance.zt-page--kategori .zt-kq__grid {display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: var(--zt-sp-16); align-items: start;} body.breakdance.zt-page--kategori .zt-kq .zt-faq__list {margin-top: var(--zt-sp-8);} body.breakdance.zt-page--kategori .zt-kq__about {margin-top: var(--zt-sp-16); padding: var(--zt-sp-7); border-radius: var(--zt-r-panel); background: var(--zt-surface); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} body.breakdance.zt-page--kategori .zt-kq__about p + p {margin-top: var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-kq__h {margin-bottom: var(--zt-sp-3); font-size: var(--zt-fs-lg); line-height: 1.25; font-weight: 800; letter-spacing: -0.012em; color: var(--zt-text);} @media (prefers-reduced-motion: no-preference) { body.breakdance.zt-page--kategori .zt-sheet[open] {animation: zt-sheet-in 0.32s var(--zt-ease) both;} body.breakdance.zt-page--kategori .breakdance-popup-open .zt-qp {animation: zt-in 0.32s var(--zt-ease) both;} body.breakdance.zt-page--kategori .zt-sheet[open]::backdrop {animation: zt-fade 0.32s var(--zt-ease) both;} body.breakdance.zt-page--kategori .zt-kl__open:active, body.breakdance.zt-page--kategori .zt-sheet .zt-btn:active, body.breakdance.zt-page--kategori .zt-qp .zt-btn:active {transition: transform 0.15s var(--zt-ease); transform: scale(0.97);} body.breakdance.zt-page--kategori .zt-kl .zt-kc {transition: transform var(--zt-dur-slow) var(--zt-ease);} body.breakdance.zt-page--kategori .zt-kl .zt-kc::after {transition: opacity var(--zt-dur-slow) var(--zt-ease);} } @media (prefers-reduced-motion: no-preference) and (hover: hover) and (min-width: 1025px) { body.breakdance.zt-page--kategori .zt-kl .zt-kc:hover {transform: translateY(-4px);} } @media (max-width: 1199px) { body.breakdance.zt-page--kategori .zt-hero--kat .zt-hero__grid {grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);} body.breakdance.zt-page--kategori .zt-cp {grid-template-columns: auto minmax(0, 1fr); grid-template-rows: none; grid-template-areas: "title side" "qs qs"; row-gap: var(--zt-sp-6); padding: var(--zt-sp-7);} body.breakdance.zt-page--kategori .zt-cp__foot {align-self: center; justify-self: end; justify-content: flex-end; margin-top: 0;} body.breakdance.zt-page--kategori .zt-cp__qs {grid-template-columns: max-content minmax(0, 1fr); gap: var(--zt-sp-3) var(--zt-sp-8);} body.breakdance.zt-page--kategori .zt-cp__q {display: grid; grid-column: 1 / -1; grid-template-columns: subgrid; align-items: center;} body.breakdance.zt-page--kategori .zt-cp__q .zt-fd__label {margin: 0;} } @media (max-width: 1024px) { body.breakdance.zt-page--kategori .zt-kc__mark, body.breakdance.zt-page--kategori .zt-kc__pills {display: none;} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-card__meta {display: block;} body.breakdance.zt-page--kategori {--zt-hero-mw: 34vw; --zt-hero-top: var(--zt-sp-10); --zt-hero-pb: var(--zt-sp-5); --zt-kat-h1: clamp(2.125rem, 6.4vw, 3.25rem); --zt-kc-gap: var(--zt-sp-5);} body.breakdance.zt-page--kategori .zt-hero--kat {--zt-scrim-side: inherit;} body.breakdance.zt-page--kategori .zt-hero--kat .zt-hero__grid {grid-template-columns: 100%;} body.breakdance.zt-page--kategori .zt-kc__list {grid-template-columns: minmax(0, 1fr);} body.breakdance.zt-page--kategori .zt-kl .zt-kc {grid-row: auto; grid-template-columns: var(--zt-kc-img) minmax(0, 1fr); grid-template-rows: auto auto 1fr; grid-template-areas: "stage main" "stage data" "stage act"; column-gap: var(--zt-sp-7); padding: var(--zt-sp-3) var(--zt-sp-6) var(--zt-sp-3) var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-card__stage {--zt-ratio: 1.15; align-self: stretch; aspect-ratio: auto; min-height: var(--zt-kc-img);} body.breakdance.zt-page--kategori .zt-kc__main, body.breakdance.zt-page--kategori .zt-kc__data, body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-card__act {padding-inline: 0;} body.breakdance.zt-page--kategori .zt-kc__main {padding-top: var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-kc__data {padding-top: var(--zt-sp-4);} body.breakdance.zt-page--kategori .zt-kc__desc {max-width: 34em; margin-top: var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-kc__note {margin-bottom: var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-card__act {align-self: end; padding-block: 0 var(--zt-sp-1);} body.breakdance.zt-page--kategori .zt-groups--rel .zt-groups__grid {grid-template-columns: repeat(2, minmax(0, 1fr));} body.breakdance.zt-page--kategori .zt-groups--rel .zt-groups__item {grid-column: span 1;} body.breakdance.zt-page--kategori .zt-groups--rel .zt-groups__item--lg {grid-column: 1 / -1;} body.breakdance.zt-page--kategori .zt-kq__grid {grid-template-columns: 100%; gap: 0;} body.breakdance.zt-page--kategori .zt-kq__about {margin-top: var(--zt-sp-10);} } @media (max-width: 767px) { body.breakdance.zt-page--kategori {--zt-hero-mw: 46vw; --zt-hero-top: var(--zt-sp-5); --zt-hero-pb: var(--zt-sp-3); --zt-kat-h1: clamp(1.875rem, 9vw, 2.25rem); --zt-kc-img: 120px; --zt-kc-gap: var(--zt-sp-4);} body.breakdance.zt-page--kategori .zt-hero--kat {--zt-scrim-side: linear-gradient(180deg, rgb(20 28 32 / 0.84) 0%, rgb(20 28 32 / 0.78) 70%, rgb(20 28 32 / 0.3) 88%, rgb(20 28 32 / 0.5) 100%);} body.breakdance.zt-page--kategori .zt-crumbs ol {margin-bottom: var(--zt-sp-3); font-size: var(--zt-fs-3xs);} body.breakdance.zt-page--kategori .zt-hero--kat + .zt-section {padding-top: calc(var(--zt-hero-drop) + var(--zt-sp-10));} body.breakdance.zt-page--kategori .zt-kl .zt-head {margin-bottom: var(--zt-sp-5);} body.breakdance.zt-page--kategori .zt-cp {grid-template-columns: 100%; grid-template-areas: "title" "qs" "side"; row-gap: var(--zt-sp-4); margin-bottom: var(--zt-sp-4); padding: var(--zt-sp-4) var(--zt-sp-4) var(--zt-sp-5);} body.breakdance.zt-page--kategori .zt-cp__title {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--kategori .zt-cp .zt-cp__q--more {display: none;} body.breakdance.zt-page--kategori .zt-cp__qs {grid-template-columns: 100%;} body.breakdance.zt-page--kategori .zt-cp__q {display: block;} body.breakdance.zt-page--kategori .zt-cp__q .zt-fd__label {margin: 0 0 var(--zt-sp-2);} body.breakdance.zt-page--kategori .zt-cp__q .zt-fd__opts {gap: var(--zt-sp-2) 6px;} body.breakdance.zt-page--kategori .zt-cp__q .zt-fd__opt {padding: 0 var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-cp__foot {justify-self: stretch; justify-content: flex-start; padding-top: var(--zt-sp-2); border-top: var(--zt-rule-floor);} body.breakdance.zt-page--kategori .zt-kl__bar {position: sticky; top: var(--zt-header-h); z-index: 4; display: flex; gap: var(--zt-sp-2); margin-inline: calc(-1 * var(--zt-gutter)); padding: var(--zt-sp-2) var(--zt-gutter); background: var(--zt-bg); border-bottom: var(--zt-rule);} body.breakdance.zt-page--kategori .zt-kl__meta > .zt-kl__sort {display: none;} body.breakdance.zt-page--kategori .zt-kl__open {display: inline-flex; align-items: center; gap: var(--zt-sp-2); min-height: var(--zt-touch); padding: 0 var(--zt-sp-4); border: var(--zt-hair) solid var(--zt-field); border-radius: var(--zt-r-pill); background: var(--zt-bg); font-size: var(--zt-fs-xs); font-weight: 700; cursor: pointer;} body.breakdance.zt-page--kategori .zt-kl__open:last-child {flex: 1 1 auto; justify-content: space-between; min-width: 0;} body.breakdance.zt-page--kategori .zt-kl__open strong {margin-right: auto; font-weight: 800;} body.breakdance.zt-page--kategori .zt-kl__badge {display: grid; place-items: center; min-width: var(--zt-sp-5); height: var(--zt-sp-5); padding: 0 6px; border-radius: var(--zt-r-pill); background: var(--zt-fume); color: var(--zt-on-fume); font-size: var(--zt-fs-3xs); font-weight: 800;} body.breakdance.zt-page--kategori .zt-kl__meta {margin: var(--zt-sp-3) 0 var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-kl__count {font-size: var(--zt-fs-sm);} body.breakdance.zt-page--kategori .zt-sheet .zt-seg__btn {padding: 0 var(--zt-sp-2);} body.breakdance.zt-page--kategori .zt-sheet .zt-seg {flex-wrap: wrap; border-radius: var(--zt-r-panel);} body.breakdance.zt-page--kategori .zt-kl__more {width: 100%; margin-top: var(--zt-sp-6);} body.breakdance.zt-page--kategori .zt-kc__main, body.breakdance.zt-page--kategori .zt-kc__data {display: contents;} body.breakdance.zt-page--kategori .zt-kl .zt-kc {grid-template-columns: var(--zt-kc-img) minmax(0, 1fr); grid-template-rows: 1fr 1fr auto auto auto; grid-template-areas: "stage head" "stage spec" "desc desc" "note note" "act act"; column-gap: var(--zt-sp-4); row-gap: 0; padding: var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-card__stage {--zt-ratio: 1; align-self: start; aspect-ratio: 1; min-height: 0;} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-card__head {align-self: end; padding-top: 0;} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-card__meta {line-height: 1.35;} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-spec {display: flex; flex-wrap: wrap; align-self: start; gap: 0 var(--zt-sp-3); margin: 6px 0 0; padding: 0; border: 0;} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-spec .zt-tag-dt, body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-spec dt {position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-spec .zt-tag-dd, body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-spec dd {font-size: var(--zt-fs-xs);} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-bar {display: none;} body.breakdance.zt-page--kategori .zt-kc__desc {margin-top: var(--zt-sp-3); font-size: var(--zt-fs-xs); line-height: 1.5;} body.breakdance.zt-page--kategori .zt-kc__note {margin: var(--zt-sp-1) 0 0;} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-card__act {display: grid; grid-template-columns: 1fr 1fr; gap: var(--zt-sp-2); margin-top: var(--zt-sp-3); padding: 0;} body.breakdance.zt-page--kategori .zt-kc .zt-card__act .zt-btn {min-width: 0;} body.breakdance.zt-page--kategori .zt-groups--rel .zt-groups__grid {grid-template-columns: 100%;} body.breakdance.zt-page--kategori .zt-groups--rel .zt-groups__item, body.breakdance.zt-page--kategori .zt-groups--rel .zt-groups__item--lg {grid-column: auto;} body.breakdance.zt-page--kategori .zt-kq__about {padding: var(--zt-sp-5);} body.breakdance.zt-page--kategori .zt-qp {inset: auto 0 0; width: 100%; max-height: 92dvh; margin: 0; border-radius: var(--zt-r-panel) var(--zt-r-panel) 0 0; box-shadow: var(--zt-sheet-shadow);} body.breakdance.zt-page--kategori .zt-qp__head {padding: var(--zt-sp-3) var(--zt-sp-3) 0 var(--zt-sp-4);} body.breakdance.zt-page--kategori .zt-qp__title {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--kategori .zt-qp__body {padding-inline: var(--zt-sp-4);} body.breakdance.zt-page--kategori .zt-qp__foot {padding: var(--zt-sp-3) var(--zt-sp-4) calc(var(--zt-sp-3) + env(safe-area-inset-bottom, 0px));} body.breakdance.zt-page--kategori .zt-qp__done {padding: 0 var(--zt-sp-4) calc(var(--zt-sp-5) + env(safe-area-inset-bottom, 0px));} } @media (prefers-reduced-motion: no-preference) and (max-width: 767px) { body.breakdance.zt-page--kategori .breakdance-popup-open .zt-qp {animation-name: zt-sheet-in;} } @media (max-width: 359px) { body.breakdance.zt-page--kategori {--zt-kc-img: 96px;} body.breakdance.zt-page--kategori .zt-kl__open {padding: 0 var(--zt-sp-3); font-size: var(--zt-fs-2xs); white-space: nowrap;} body.breakdance.zt-page--kategori .zt-kl .zt-kc {column-gap: var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-kl .zt-kc .zt-spec {gap: 0 var(--zt-sp-2);} } body.breakdance.zt-page--kategori [hidden] {display: none;} body.breakdance.zt-page--kategori .zt-sf {padding-block: 0; border-top: 0;} body.breakdance.zt-page--kategori .zt-sf__facts {gap: 0; margin-top: 0; border-bottom: var(--zt-rule);} body.breakdance.zt-page--kategori .zt-sf .zt-fact {padding: var(--zt-sp-10) var(--zt-sp-6) var(--zt-sp-9);} body.breakdance.zt-page--kategori .zt-sf .zt-fact:first-child {padding-left: 0;} body.breakdance.zt-page--kategori .zt-sf .zt-fact + .zt-fact {border-left: var(--zt-rule);} body.breakdance.zt-page--kategori .zt-sf .zt-fact .zt-tag-dt, body.breakdance.zt-page--kategori .zt-sf .zt-fact dt {font-size: var(--zt-fs-h3); white-space: nowrap;} body.breakdance.zt-page--kategori .zt-sf__u {font-size: 0.58em; font-weight: 750; letter-spacing: -0.01em;} body.breakdance.zt-page--kategori .zt-sf .zt-fact .zt-tag-dd, body.breakdance.zt-page--kategori .zt-sf .zt-fact dd {margin-top: var(--zt-sp-2);} body.breakdance.zt-page--kategori .zt-flow__list {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--zt-sp-12) var(--zt-sp-6); margin: 0; padding: 0; list-style: none; counter-reset: zt-flow;} body.breakdance.zt-page--kategori .zt-flow__step {display: grid; grid-template-rows: subgrid; grid-row: span 4; row-gap: 0; align-content: start; counter-increment: zt-flow;} body.breakdance.zt-page--kategori .zt-flow__media {position: relative; overflow: hidden; aspect-ratio: 4 / 3; border-radius: var(--zt-r-panel); background: var(--zt-surface);} body.breakdance.zt-page--kategori .zt-flow__media img {width: 100%; height: 100%; object-fit: cover;} body.breakdance.zt-page--kategori .zt-flow__media::after {content: counter(zt-flow); position: absolute; top: var(--zt-sp-3); left: var(--zt-sp-3); display: grid; place-items: center; width: var(--zt-sp-10); height: var(--zt-sp-10); border-radius: var(--zt-r-round); background: var(--zt-bg); color: var(--zt-fume); font-size: var(--zt-fs-md); font-weight: 800; font-variant-numeric: tabular-nums; box-shadow: var(--zt-shadow-seg);} body.breakdance.zt-page--kategori .zt-flow__t {margin-top: var(--zt-sp-6); font-size: var(--zt-fs-lg); line-height: 1.25; font-weight: 800; letter-spacing: -0.015em; text-wrap: balance;} body.breakdance.zt-page--kategori .zt-flow__p {margin-top: var(--zt-sp-3); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} body.breakdance.zt-page--kategori .zt-flow__tags {display: flex; flex-wrap: wrap; align-content: start; gap: var(--zt-sp-3) var(--zt-sp-2); margin: var(--zt-sp-5) 0 0; padding: 0; list-style: none;} body.breakdance.zt-page--kategori .zt-flow__tag {position: relative; display: inline-flex; align-items: center; min-height: var(--zt-sp-8); padding: 0 var(--zt-sp-3); border: var(--zt-hair) solid var(--zt-line); border-radius: var(--zt-r-pill); background: var(--zt-bg); font-size: var(--zt-fs-2xs); font-weight: 700; color: var(--zt-text);} body.breakdance.zt-page--kategori .zt-flow__tag::before {content: ""; position: absolute; inset: -6px 0;} body.breakdance.zt-page--kategori .zt-flow__tag:hover {border-color: var(--zt-fume);} body.breakdance.zt-page--kategori .zt-cmp {background: var(--zt-surface);} body.breakdance.zt-page--kategori .zt-cmp__table {width: 100%; border-collapse: separate; border-spacing: 0; overflow: hidden; border-radius: var(--zt-r-panel); background: var(--zt-bg); font-size: var(--zt-fs-sm);} body.breakdance.zt-page--kategori .zt-cmp__table th, body.breakdance.zt-page--kategori .zt-cmp__table td {padding: var(--zt-sp-5) var(--zt-sp-6); text-align: left; vertical-align: top;} body.breakdance.zt-page--kategori .zt-cmp__table thead th {padding-block: var(--zt-sp-5) var(--zt-sp-4); font-size: var(--zt-fs-2xs); font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--zt-text-3);} body.breakdance.zt-page--kategori .zt-cmp__table tbody > tr > * {border-top: var(--zt-rule);} body.breakdance.zt-page--kategori .zt-cmp__model {width: 32%;} body.breakdance.zt-page--kategori .zt-cmp__id {display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: var(--zt-sp-5); align-items: start;} body.breakdance.zt-page--kategori .zt-cmp__stage {--zt-ratio: 0.75; aspect-ratio: 4 / 3; border-radius: var(--zt-r-inner);} body.breakdance.zt-page--kategori .zt-cmp__img {display: contents;} body.breakdance.zt-page--kategori .zt-cmp__txt {display: grid; justify-items: start;} body.breakdance.zt-page--kategori .zt-cmp__more {margin-top: var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-cmp__name {font-size: var(--zt-fs-md); line-height: 1.3; font-weight: 800; letter-spacing: -0.01em; color: var(--zt-text);} body.breakdance.zt-page--kategori .zt-cmp__name:hover {color: var(--zt-text);} body.breakdance.zt-page--kategori .zt-cmp__name:hover {text-decoration: underline; text-decoration-thickness: var(--zt-hair); text-underline-offset: 3px;} body.breakdance.zt-page--kategori .zt-cmp__group {display: block; margin-top: var(--zt-sp-1); font-size: var(--zt-fs-2xs); font-weight: 400; color: var(--zt-text-3);} body.breakdance.zt-page--kategori .zt-cmp__job {width: 36%; font-size: var(--zt-fs-body); color: var(--zt-text);} body.breakdance.zt-page--kategori .zt-cmp__dl > div {display: flex; justify-content: space-between; align-items: baseline; gap: var(--zt-sp-4);} body.breakdance.zt-page--kategori .zt-cmp__dl > div + div {margin-top: var(--zt-sp-2);} body.breakdance.zt-page--kategori .zt-cmp__dl .zt-tag-dt, body.breakdance.zt-page--kategori .zt-cmp__dl dt {color: var(--zt-text-2);} body.breakdance.zt-page--kategori .zt-cmp__dl .zt-tag-dd, body.breakdance.zt-page--kategori .zt-cmp__dl dd {flex: none; font-weight: 700; text-align: right; font-variant-numeric: tabular-nums;} @media (max-width: 1024px) { body.breakdance.zt-page--kategori .zt-sf__facts {grid-template-columns: repeat(2, minmax(0, 1fr));} body.breakdance.zt-page--kategori .zt-sf .zt-fact {padding: var(--zt-sp-7) var(--zt-sp-5);} body.breakdance.zt-page--kategori .zt-sf .zt-fact:nth-child(odd) {padding-left: 0; border-left: 0;} body.breakdance.zt-page--kategori .zt-sf .zt-fact:nth-child(n + 3) {border-top: var(--zt-rule);} body.breakdance.zt-page--kategori .zt-flow__list {grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--zt-sp-10) var(--zt-sp-5);} body.breakdance.zt-page--kategori .zt-cmp__table th, body.breakdance.zt-page--kategori .zt-cmp__table td {padding-inline: var(--zt-sp-4);} body.breakdance.zt-page--kategori .zt-cmp__model {width: 36%;} body.breakdance.zt-page--kategori .zt-cmp__job {width: 30%;} body.breakdance.zt-page--kategori .zt-cmp__id {grid-template-columns: 80px minmax(0, 1fr); gap: var(--zt-sp-4);} } @media (max-width: 767px) { body.breakdance.zt-page--kategori .zt-sf .zt-fact {padding: var(--zt-sp-5) var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-sf .zt-fact .zt-tag-dt, body.breakdance.zt-page--kategori .zt-sf .zt-fact dt {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--kategori .zt-sf__u {display: block; margin-top: var(--zt-sp-1);} body.breakdance.zt-page--kategori .zt-sf .zt-fact .zt-tag-dd, body.breakdance.zt-page--kategori .zt-sf .zt-fact dd {font-size: var(--zt-fs-2xs);} body.breakdance.zt-page--kategori .zt-flow__list {grid-template-columns: 100%; gap: var(--zt-sp-9);} body.breakdance.zt-page--kategori .zt-flow__media {border-radius: var(--zt-r-inner);} body.breakdance.zt-page--kategori .zt-flow__t {margin-top: var(--zt-sp-4);} body.breakdance.zt-page--kategori .zt-cmp__table, body.breakdance.zt-page--kategori .zt-cmp__table tbody, body.breakdance.zt-page--kategori .zt-cmp__table tr, body.breakdance.zt-page--kategori .zt-cmp__table th, body.breakdance.zt-page--kategori .zt-cmp__table td {display: block; width: auto;} body.breakdance.zt-page--kategori .zt-cmp__table {overflow: visible; border-radius: 0; background: none;} body.breakdance.zt-page--kategori .zt-cmp__table thead {position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;} body.breakdance.zt-page--kategori .zt-cmp__table tbody > tr {padding: var(--zt-sp-5) var(--zt-sp-4); border-radius: var(--zt-r-inner); background: var(--zt-bg);} body.breakdance.zt-page--kategori .zt-cmp__table tbody > tr + tr {margin-top: var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-cmp__table tbody > tr > * {padding: 0; border-top: 0;} body.breakdance.zt-page--kategori .zt-cmp__id {grid-template-columns: 88px minmax(0, 1fr);} body.breakdance.zt-page--kategori .zt-cmp__table tbody > tr > .zt-cmp__job {margin-top: var(--zt-sp-3);} body.breakdance.zt-page--kategori .zt-cmp__table tbody > tr > .zt-cmp__vals {margin-top: var(--zt-sp-3); padding-top: var(--zt-sp-3); border-top: var(--zt-rule);} } html:has(> body.breakdance.zt-page--urun) {scroll-padding-top: calc(var(--zt-header-h) + var(--zt-sub-h) + 1px);} body.breakdance.zt-page--urun .zt-nw {white-space: nowrap;} body.breakdance.zt-page--urun .zt-todo__ico, body.breakdance.zt-page--urun .zt-assure__ico, body.breakdance.zt-page--urun .zt-check__dot, body.breakdance.zt-page--urun .zt-gal__go, body.breakdance.zt-page--urun .zt-lb__btn, body.breakdance.zt-page--urun .zt-qp__x {display: grid; place-items: center;} body.breakdance.zt-page--urun .zt-pd {padding-block: var(--zt-sp-5) var(--zt-sp-16);} body.breakdance.zt-page--urun .zt-crumbs ol, body.breakdance.zt-page--urun .zt-tips {margin: 0; padding: 0; list-style: none;} body.breakdance.zt-page--urun .zt-crumbs ol {display: flex; flex-wrap: wrap; gap: 0 var(--zt-sp-2); font-size: var(--zt-fs-2xs); font-weight: 600; color: var(--zt-text-2);} body.breakdance.zt-page--urun .zt-crumbs li + li::before {content: "/"; margin-right: var(--zt-sp-2); color: var(--zt-quiet);} body.breakdance.zt-page--urun .zt-crumbs a {display: inline-block; padding: var(--zt-sp-3) 0; margin: calc(-1 * var(--zt-sp-3)) 0;} body.breakdance.zt-page--urun .zt-crumbs a:hover {color: var(--zt-text); text-decoration: underline; text-underline-offset: 3px;} body.breakdance.zt-page--urun .zt-crumbs [aria-current] {color: var(--zt-text-3);} body.breakdance.zt-page--urun .zt-pd__grid {display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--zt-sp-14); align-items: start; margin-top: var(--zt-sp-5);} body.breakdance.zt-page--urun .zt-gal {display: grid; gap: var(--zt-sp-3); min-width: 0;} body.breakdance.zt-page--urun .zt-gal__track {display: grid; grid-auto-flow: column; grid-auto-columns: 100%; grid-template-rows: minmax(0, 1fr); aspect-ratio: 4 / 3.3; overflow: auto hidden; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; border-radius: var(--zt-r-panel); outline: var(--zt-rule); outline-offset: calc(-1 * var(--zt-hair)); background: var(--zt-surface);} body.breakdance.zt-page--urun .zt-gal__track:focus-visible, body.breakdance.zt-page--urun .zt-gal__slide:has(.zt-gal__open:focus-visible) {outline: var(--zt-stroke) solid var(--zt-fume); outline-offset: 3px;} body.breakdance.zt-page--urun .zt-gal__slide {position: relative; display: grid; min-width: 0; overflow: hidden; scroll-snap-align: start; background: var(--zt-surface);} body.breakdance.zt-page--urun .zt-gal__slide > img, body.breakdance.zt-page--urun .zt-gal__thumb img {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;} body.breakdance.zt-page--urun .zt-gal__slide--framed > img, body.breakdance.zt-page--urun .zt-gal__thumb--framed img {box-sizing: border-box; padding: 7%; object-fit: contain; mix-blend-mode: multiply;} body.breakdance.zt-page--urun .zt-gal__open {display: none;} body.breakdance.zt-page--urun .zt-gal__slide--todo::before {content: ""; position: absolute; inset: var(--zt-sp-3); border: var(--zt-hair) dashed var(--zt-floor); border-radius: calc(var(--zt-r-panel) - var(--zt-sp-3));} body.breakdance.zt-page--urun .zt-todo {display: grid; place-content: center; justify-items: center; gap: var(--zt-sp-1); padding: var(--zt-sp-8); text-align: center;} body.breakdance.zt-page--urun .zt-todo__ico {width: var(--zt-sp-12); height: var(--zt-sp-12); margin-bottom: var(--zt-sp-2); border-radius: var(--zt-r-round); background: var(--zt-bg); color: var(--zt-fume); box-shadow: var(--zt-shadow-seg);} body.breakdance.zt-page--urun .zt-todo__k, body.breakdance.zt-page--urun .zt-use__h, body.breakdance.zt-page--urun .zt-sg__h {font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--zt-text-3);} body.breakdance.zt-page--urun .zt-todo__k {font-size: var(--zt-fs-3xs);} body.breakdance.zt-page--urun .zt-todo__n {font-size: var(--zt-fs-sm); line-height: 1.35; font-weight: 700;} body.breakdance.zt-page--urun .zt-gal__thumbs {display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--zt-sp-3);} html:has(> body.breakdance.zt-page--urun):not(.zt-js) :is(.zt-gal__thumbs, .zt-gal__open) {display: none;} body.breakdance.zt-page--urun .zt-gal__thumb {position: relative; display: grid; place-items: center; aspect-ratio: 1; padding: 0; overflow: hidden; border: 0; border-radius: var(--zt-r-inner); background: var(--zt-surface); color: var(--zt-text-3); cursor: pointer;} body.breakdance.zt-page--urun .zt-gal__thumb:hover {color: var(--zt-text-3);} body.breakdance.zt-page--urun .zt-gal__thumb::after {content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 var(--zt-hair) var(--zt-line);} body.breakdance.zt-page--urun .zt-gal__thumb:hover::after {box-shadow: inset 0 0 0 var(--zt-hair) var(--zt-field);} body.breakdance.zt-page--urun .zt-gal__thumb[aria-current="true"]::after {box-shadow: inset 0 0 0 var(--zt-stroke) var(--zt-fume);} body.breakdance.zt-page--urun .zt-pd__info {display: grid; gap: var(--zt-sp-5); align-content: start; padding: var(--zt-box-pad); border-radius: var(--zt-r-panel); background: var(--zt-fume-deep); color: var(--zt-on-fume);} body.breakdance.zt-page--urun .zt-pd__info :focus-visible, body.breakdance.zt-page--urun .zt-lb :focus-visible {outline-color: var(--zt-on-fume);} body.breakdance.zt-page--urun .zt-pd__code {display: flex; flex-wrap: wrap; align-items: center; gap: var(--zt-sp-1) var(--zt-sp-3); font-size: var(--zt-fs-2xs); font-weight: 600; color: var(--zt-on-fume-2); font-variant-numeric: tabular-nums;} body.breakdance.zt-page--urun .zt-pd__brand, body.breakdance.zt-page--urun .zt-kc__mark {font-size: 11px; font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase;} body.breakdance.zt-page--urun .zt-pd__brand {padding-right: var(--zt-sp-3); border-right: var(--zt-hair) solid var(--zt-fume-line); line-height: 1.4; color: var(--zt-on-fume);} body.breakdance.zt-page--urun .zt-pd__title {display: grid; gap: var(--zt-sp-2);} body.breakdance.zt-page--urun .zt-pd__model {font-size: var(--zt-model); line-height: 1; font-weight: 800; letter-spacing: -0.04em;} body.breakdance.zt-page--urun .zt-pd__kind {font-size: var(--zt-fs-h4); line-height: 1.25; font-weight: 600; letter-spacing: -0.015em; color: var(--zt-on-photo-2);} body.breakdance.zt-page--urun .zt-pd__lead {font-size: var(--zt-fs-base); line-height: 1.55; color: var(--zt-on-photo-2);} body.breakdance.zt-page--urun .zt-pd__stats {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--zt-sp-5) var(--zt-sp-3); padding-block: var(--zt-sp-4); border-block: var(--zt-hair) solid var(--zt-fume-line);} body.breakdance.zt-page--urun .zt-pd__stats .zt-tag-dt, body.breakdance.zt-page--urun .zt-pd__stats .zt-tag-dd :is(span, small), body.breakdance.zt-page--urun .zt-pd__stats dt, body.breakdance.zt-page--urun .zt-pd__stats dd :is(span, small) {font-size: var(--zt-fs-3xs); line-height: 1.3; font-weight: 600; letter-spacing: 0; color: var(--zt-on-fume-2);} body.breakdance.zt-page--urun .zt-pd__stats .zt-kc__ico {width: var(--zt-icon-lg); height: var(--zt-icon-lg); margin-bottom: var(--zt-sp-2); stroke: currentColor; opacity: 1;} body.breakdance.zt-page--urun .zt-pd__stats .zt-tag-dd, body.breakdance.zt-page--urun .zt-pd__stats dd {margin-top: var(--zt-sp-1); font-size: var(--zt-stat); line-height: 1.15; font-weight: 800; letter-spacing: -0.02em; font-variant-numeric: tabular-nums;} body.breakdance.zt-page--urun .zt-pd__stats .zt-tag-dd span, body.breakdance.zt-page--urun .zt-pd__stats dd span {font-weight: 700;} body.breakdance.zt-page--urun .zt-pd__stats small {display: block; margin-top: 3px;} body.breakdance.zt-page--urun .zt-pd__act {display: flex; gap: var(--zt-sp-3);} body.breakdance.zt-page--urun .zt-pd__act .zt-btn--quote {flex: 1 1 auto;} body.breakdance.zt-page--urun .zt-pd__note {margin-top: calc(-1 * var(--zt-sp-2)); font-size: var(--zt-fs-sm); color: var(--zt-on-fume-2);} body.breakdance.zt-page--urun .zt-assure {display: grid; gap: var(--zt-sp-3); padding-top: var(--zt-sp-5); border-top: var(--zt-hair) solid var(--zt-fume-line);} body.breakdance.zt-page--urun .zt-assure li {display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: var(--zt-sp-3); align-items: center; font-size: var(--zt-fs-sm); font-weight: 600; color: var(--zt-on-photo-2);} body.breakdance.zt-page--urun .zt-assure__ico {width: 34px; height: 34px; border-radius: 9px; background: var(--zt-dock-icon); color: var(--zt-on-fume);} body.breakdance.zt-page--urun .zt-assure .zt-icon {width: 18px; height: 18px;} @media (min-width: 1025px) { body.breakdance.zt-page--urun .zt-gal__track {grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; gap: var(--zt-sp-3); aspect-ratio: auto; overflow: visible; border-radius: 0; outline: 0; background: none;} body.breakdance.zt-page--urun .zt-gal__slide {aspect-ratio: 1; border-radius: var(--zt-r-panel); outline: var(--zt-rule); outline-offset: calc(-1 * var(--zt-hair));} body.breakdance.zt-page--urun .zt-gal__slide:first-child {grid-column: 1 / -1; aspect-ratio: 4 / 3.3;} body.breakdance.zt-page--urun .zt-gal__slide:last-child:nth-child(even) {grid-column: 1 / -1; aspect-ratio: 16 / 10;} body.breakdance.zt-page--urun .zt-gal__thumbs {display: none;} body.breakdance.zt-page--urun .zt-pd__info {position: sticky; top: min(calc(var(--zt-header-h) + var(--zt-sp-6)), var(--zt-fit, 100vh));} body.breakdance.zt-page--urun .zt-use {grid-area: 1 / 2 / 3; position: sticky; top: calc(var(--zt-header-h) + var(--zt-sub-h) + var(--zt-sp-8));} body.breakdance.zt-page--urun .zt-gal__open {position: absolute; inset: 0; display: block; padding: 0; border: 0; border-radius: inherit; background: none; cursor: pointer;} body.breakdance.zt-page--urun .zt-gal__open:focus-visible {outline: 0;} body.breakdance.zt-page--urun .zt-gal__go {position: absolute; top: var(--zt-sp-5); right: var(--zt-sp-5); width: var(--zt-go); height: var(--zt-go); border-radius: var(--zt-r-round); background: var(--zt-bg); color: var(--zt-fume); box-shadow: var(--zt-go-shadow); opacity: 0;} body.breakdance.zt-page--urun .zt-gal__slide:hover .zt-gal__go, body.breakdance.zt-page--urun .zt-gal__open:focus-visible .zt-gal__go {opacity: 1;} } body.breakdance.zt-page--urun .zt-subnav {position: sticky; top: calc(var(--zt-header-h) - var(--zt-hair)); z-index: 40; border-block: var(--zt-rule); background: var(--zt-sub-glass); -webkit-backdrop-filter: saturate(1.4) blur(14px); backdrop-filter: saturate(1.4) blur(14px);} body.breakdance.zt-page--urun .zt-subnav ul {display: flex; gap: var(--zt-sp-8); overflow-x: auto; scrollbar-width: none;} body.breakdance.zt-page--urun .zt-subnav a {position: relative; display: inline-flex; align-items: center; min-height: var(--zt-sub-h); font-size: var(--zt-fs-sm); font-weight: 600; color: var(--zt-text-2); white-space: nowrap;} body.breakdance.zt-page--urun .zt-subnav a:hover {color: var(--zt-text-2);} body.breakdance.zt-page--urun .zt-subnav a::after {content: ""; position: absolute; inset: auto 0 0; height: var(--zt-stroke); background: var(--zt-fume); transform: scaleX(0); transform-origin: left;} body.breakdance.zt-page--urun .zt-subnav a:hover, body.breakdance.zt-page--urun .zt-subnav a[aria-current="true"] {color: var(--zt-text);} body.breakdance.zt-page--urun .zt-subnav a[aria-current="true"]:hover {color: var(--zt-text);} body.breakdance.zt-page--urun .zt-subnav a[aria-current="true"]::after {transform: scaleX(1);} body.breakdance.zt-page--urun .zt-subnav a:focus-visible {outline-offset: -2px;} body.breakdance.zt-page--urun .zt-subnav + .zt-section {border-top: 0;} body.breakdance.zt-page--urun .zt-cmp__pick {display: none;} body.breakdance.zt-page--urun .zt-cmp__wrap {position: relative; overflow-x: auto;} body.breakdance.zt-page--urun .zt-cmp__t {width: 100%; min-width: 880px; table-layout: fixed; border-collapse: separate; border-spacing: 0;} body.breakdance.zt-page--urun .zt-cmp__corner {width: var(--zt-cmp-label);} body.breakdance.zt-page--urun .zt-cmp__t th, body.breakdance.zt-page--urun .zt-cmp__t td {padding: var(--zt-sp-4); text-align: left; vertical-align: top;} body.breakdance.zt-page--urun .zt-cmp__t thead th {vertical-align: bottom; font-weight: 800;} body.breakdance.zt-page--urun .zt-cmp__t tbody th {padding-left: 0; border-top: var(--zt-rule); font-size: var(--zt-fs-xs); line-height: 1.3; font-weight: 600; color: var(--zt-text-2);} body.breakdance.zt-page--urun .zt-cmp__t tbody th .zt-kc__ico {width: 22px; height: 22px;} body.breakdance.zt-page--urun .zt-cmp__t tbody td {border-top: var(--zt-rule); font-size: var(--zt-fs-value); line-height: 1.15; font-weight: 800; letter-spacing: -0.02em; font-variant-numeric: tabular-nums;} body.breakdance.zt-page--urun .zt-cmp__t td > span:not([class]), body.breakdance.zt-page--urun .zt-cmp__t .zt-nw > span {font-size: var(--zt-fs-3xs); font-weight: 700; letter-spacing: 0; color: var(--zt-text-2);} body.breakdance.zt-page--urun .zt-cmp__t small {display: block; margin-top: 3px; font-size: var(--zt-fs-3xs); line-height: 1.4; font-weight: 600; letter-spacing: 0; color: var(--zt-text-3);} body.breakdance.zt-page--urun .zt-kc__ico {display: block; margin-bottom: 6px; fill: none; stroke: var(--zt-fume); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; opacity: 0.75;} body.breakdance.zt-page--urun .zt-cmp__t .is-this {background: var(--zt-surface);} body.breakdance.zt-page--urun .zt-cmp__t thead .is-this {border-radius: var(--zt-r-panel) var(--zt-r-panel) 0 0;} body.breakdance.zt-page--urun .zt-cmp__t tfoot .is-this {border-radius: 0 0 var(--zt-r-panel) var(--zt-r-panel);} body.breakdance.zt-page--urun .zt-cmp__t tfoot td {padding-block: var(--zt-sp-4) var(--zt-sp-5);} body.breakdance.zt-page--urun .zt-cmp__stage {--zt-ratio: 0.75; --zt-vis: 0.64; aspect-ratio: 4 / 3; border-radius: var(--zt-r-inner);} body.breakdance.zt-page--urun .zt-cmp__t .is-this .zt-cmp__stage {background: var(--zt-bg);} body.breakdance.zt-page--urun .zt-kc__img {display: contents;} body.breakdance.zt-page--urun .zt-kc__mark {position: absolute; z-index: 1; top: var(--zt-sp-3); left: var(--zt-sp-3); line-height: 1; color: var(--zt-fume);} body.breakdance.zt-page--urun .zt-cmp__tag {display: block; width: fit-content; margin-bottom: var(--zt-sp-3); padding: 4px 10px; border-radius: var(--zt-r-pill); background: var(--zt-fume); color: var(--zt-on-fume); font-size: var(--zt-fs-3xs); line-height: 1.3; font-weight: 700;} body.breakdance.zt-page--urun .zt-cmp__name {display: block; margin-top: var(--zt-sp-3); font-size: var(--zt-fs-h4); line-height: 1.15; letter-spacing: -0.025em;} body.breakdance.zt-page--urun .zt-kc__link:hover {text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.12em;} body.breakdance.zt-page--urun .zt-cmp__w {font-size: var(--zt-fs-md); font-weight: 700; letter-spacing: -0.01em;} body.breakdance.zt-page--urun .zt-cmp__bar {display: block; max-width: 150px; height: 4px; margin-top: var(--zt-sp-2); overflow: hidden; border-radius: var(--zt-r-pill); background: var(--zt-surface-2);} body.breakdance.zt-page--urun .zt-cmp__bar > span {display: block; height: 100%; border-radius: inherit; background: var(--zt-fume);} body.breakdance.zt-page--urun .zt-cmp__na {font-size: var(--zt-fs-xs); font-weight: 600; letter-spacing: 0; color: var(--zt-text-3);} body.breakdance.zt-page--urun .zt-cmp__txt {display: block; font-size: var(--zt-fs-xs); line-height: 1.5; font-weight: 500; letter-spacing: 0; color: var(--zt-text-2);} body.breakdance.zt-page--urun .zt-cmp__fn {margin-top: var(--zt-sp-4); font-size: var(--zt-fs-2xs); color: var(--zt-text-3);} body.breakdance.zt-page--urun .zt-cmp__act {display: grid; gap: var(--zt-sp-1);} body.breakdance.zt-page--urun .zt-cmp__view {justify-self: center; font-size: var(--zt-fs-sm);} body.breakdance.zt-page--urun .zt-btn--fume {background: var(--zt-fume); border-color: var(--zt-fume); color: var(--zt-on-fume);} body.breakdance.zt-page--urun .zt-btn--fume:hover {color: var(--zt-on-fume);} body.breakdance.zt-page--urun .zt-btn--fume:hover {background: var(--zt-orange); border-color: var(--zt-orange); color: var(--zt-on-orange);} body.breakdance.zt-page--urun .zt-sec {padding-block: var(--zt-sec-pd);} body.breakdance.zt-page--urun .zt-sec--alt {background: var(--zt-surface);} body.breakdance.zt-page--urun .zt-split {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--zt-sp-16); align-items: start;} body.breakdance.zt-page--urun .zt-desc {max-width: 32em;} body.breakdance.zt-page--urun .zt-desc__lead {margin-top: var(--zt-sp-5); font-size: var(--zt-fs-lead); line-height: 1.5;} body.breakdance.zt-page--urun .zt-desc__h {margin: var(--zt-sp-10) 0 var(--zt-sp-2); font-size: var(--zt-fs-lg); line-height: 1.3; font-weight: 800; letter-spacing: -0.012em;} body.breakdance.zt-page--urun .zt-desc__p {line-height: 1.7; color: var(--zt-text-2);} body.breakdance.zt-page--urun .zt-tips {counter-reset: zt-tip;} body.breakdance.zt-page--urun .zt-tips li {display: grid; grid-template-columns: var(--zt-sp-10) minmax(0, 1fr); padding: var(--zt-sp-4) 0; border-bottom: var(--zt-rule); color: var(--zt-text-2); counter-increment: zt-tip;} body.breakdance.zt-page--urun .zt-tips li::before {content: counter(zt-tip, decimal-leading-zero); padding-top: 2px; font-size: var(--zt-fs-2xs); font-weight: 800; color: var(--zt-fume); font-variant-numeric: tabular-nums;} body.breakdance.zt-page--urun .zt-use {display: grid; gap: var(--zt-sp-3); padding: var(--zt-sp-8); border-radius: var(--zt-r-panel); background: var(--zt-surface);} body.breakdance.zt-page--urun .zt-use__h {font-size: var(--zt-fs-2xs);} body.breakdance.zt-page--urun .zt-use ul + h3 {margin-top: var(--zt-sp-5);} body.breakdance.zt-page--urun .zt-areas, body.breakdance.zt-page--urun .zt-floors {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--zt-sp-2);} body.breakdance.zt-page--urun .zt-use li {display: grid; align-content: start; gap: var(--zt-sp-2); font-size: var(--zt-fs-2xs); line-height: 1.3; font-weight: 700;} body.breakdance.zt-page--urun .zt-areas li {gap: var(--zt-sp-3); padding: var(--zt-sp-4) var(--zt-sp-3) var(--zt-sp-3); border-radius: var(--zt-r-inner); background: var(--zt-bg);} body.breakdance.zt-page--urun .zt-use .zt-kc__ico {flex: none; width: 28px; height: 28px; margin: 0; opacity: 1;} body.breakdance.zt-page--urun .zt-mat {aspect-ratio: 3 / 2; border-radius: var(--zt-r-inner); box-shadow: inset 0 0 0 1px var(--zt-line);} body.breakdance.zt-page--urun .zt-mat--pvc {--zt-j: conic-gradient(at 1px 12px, transparent 75%, var(--zt-floor) 0); background: var(--zt-j) 0 0 / 104px 24px, var(--zt-j) 52px 12px / 104px 24px, repeating-linear-gradient(transparent 0 11px, var(--zt-floor) 0 12px), repeating-linear-gradient(var(--zt-plane) 0 12px, var(--zt-surface-2) 0 24px, var(--zt-horizon) 0 36px);} body.breakdance.zt-page--urun .zt-mat--epoksi {background: radial-gradient(120% 70% at 20% 0%, var(--zt-photo-line), transparent 60%), linear-gradient(170deg, var(--zt-field), var(--zt-fume-line));} body.breakdance.zt-page--urun .zt-mat--seramik {background: conic-gradient(from 90deg at 2px 2px, transparent 25%, var(--zt-horizon) 0) -1px -1px / 30px 30px, linear-gradient(135deg, var(--zt-bg) 30%, var(--zt-plane)) 0 0 / 30px 30px;} body.breakdance.zt-page--urun .zt-mat--cilali {background: linear-gradient(120deg, transparent 27%, var(--zt-glass) 35%, transparent 43%, var(--zt-photo-line) 47%, transparent 51%), linear-gradient(35deg, transparent 63%, var(--zt-floor) 0 64.4%, transparent 0), radial-gradient(60% 50% at 82% 80%, var(--zt-horizon), transparent), var(--zt-plane);} body.breakdance.zt-page--urun .zt-check {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--zt-sp-8) var(--zt-sp-16);} body.breakdance.zt-page--urun .zt-check li {display: grid; grid-template-columns: var(--zt-sp-8) minmax(0, 1fr); gap: var(--zt-sp-4);} body.breakdance.zt-page--urun .zt-check__dot {width: var(--zt-sp-8); height: var(--zt-sp-8); border-radius: var(--zt-r-round); background: var(--zt-fume); color: var(--zt-on-fume);} body.breakdance.zt-page--urun .zt-check__dot .zt-icon {width: var(--zt-icon-sm); height: var(--zt-icon-sm); stroke-width: 2.5;} body.breakdance.zt-page--urun .zt-check__t {padding-top: 3px; font-size: var(--zt-fs-md); line-height: 1.35; font-weight: 800; letter-spacing: -0.01em;} body.breakdance.zt-page--urun .zt-check__p {max-width: 34em; margin-top: var(--zt-sp-1); color: var(--zt-text-2);} body.breakdance.zt-page--urun .zt-specs {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zt-sp-5); align-items: start;} body.breakdance.zt-page--urun .zt-sg {padding: var(--zt-sp-7) var(--zt-sp-7) var(--zt-sp-3); border-radius: var(--zt-r-panel); background: var(--zt-surface);} body.breakdance.zt-page--urun .zt-sg__h {margin-bottom: var(--zt-sp-3); font-size: var(--zt-fs-2xs);} body.breakdance.zt-page--urun .zt-sg__dl > div {display: flex; justify-content: space-between; align-items: baseline; gap: var(--zt-sp-4); padding: var(--zt-sp-3) 0; border-top: var(--zt-rule);} body.breakdance.zt-page--urun .zt-sg__dl .zt-tag-dt, body.breakdance.zt-page--urun .zt-sg__dl dt {font-size: var(--zt-fs-sm); line-height: 1.4; color: var(--zt-text-2);} body.breakdance.zt-page--urun .zt-sg__dl .zt-tag-dd, body.breakdance.zt-page--urun .zt-sg__dl dd {flex: none; max-width: 58%; font-size: var(--zt-fs-sm); line-height: 1.4; font-weight: 700; text-align: right; font-variant-numeric: tabular-nums;} body.breakdance.zt-page--urun .zt-split + .zt-container {margin-top: var(--zt-sp-18);} body.breakdance.zt-page--urun .zt-specs + .zt-cta {margin-top: var(--zt-sp-10);} body.breakdance.zt-page--urun .zt-equip {display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--zt-sp-16); align-items: start;} body.breakdance.zt-page--urun .zt-equip__list {columns: 2; column-gap: var(--zt-sp-10); border-top: var(--zt-rule-floor);} body.breakdance.zt-page--urun .zt-equip__list li {display: flex; gap: var(--zt-sp-3); padding: var(--zt-sp-4) 0; border-bottom: var(--zt-rule-floor); line-height: 1.45; break-inside: avoid;} body.breakdance.zt-page--urun .zt-equip__list .zt-icon {margin-top: 2px; color: var(--zt-fume);} body.breakdance.zt-page--urun .zt-lb {inset: 0; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: var(--zt-sp-4) var(--zt-sp-6) var(--zt-sp-5); overflow: hidden; border: 0; background: var(--zt-fume-deep); color: var(--zt-on-fume);} body.breakdance.zt-page--urun .zt-lb[open] {display: grid; grid-template: 48px minmax(0, 1fr) auto / 48px minmax(0, 1fr) 48px; gap: var(--zt-sp-4) var(--zt-sp-6); place-items: center;} body.breakdance.zt-page--urun .zt-lb::backdrop {background: var(--zt-fume-deep);} body.breakdance.zt-page--urun .zt-lb__x {grid-area: 1 / 3;} body.breakdance.zt-page--urun .zt-lb__img {grid-area: 2 / 2; width: auto; height: auto; max-width: 100%; max-height: 100%; border-radius: var(--zt-r-panel); background: var(--zt-bg);} body.breakdance.zt-page--urun .zt-lb__prev {grid-area: 2 / 1;} body.breakdance.zt-page--urun .zt-lb__next {grid-area: 2 / 3;} body.breakdance.zt-page--urun .zt-lb__prev .zt-icon {transform: scaleX(-1);} body.breakdance.zt-page--urun .zt-lb__count {grid-area: 3 / 2; font-size: var(--zt-fs-sm); color: var(--zt-on-fume-2); font-variant-numeric: tabular-nums;} body.breakdance.zt-page--urun .zt-lb__btn {width: 48px; height: 48px; padding: 0; border: var(--zt-hair) solid var(--zt-photo-line); border-radius: var(--zt-r-round); background: var(--zt-photo-glass); color: var(--zt-on-fume); cursor: pointer;} body.breakdance.zt-page--urun .zt-lb__btn:hover {border-color: var(--zt-on-fume); background: var(--zt-on-fume); color: var(--zt-fume);} body.breakdance.zt-page--urun .zt-qp {width: min(520px, 100% - 2 * var(--zt-gutter)); max-width: none; max-height: calc(100dvh - 2 * var(--zt-sp-8)); padding: 0; border: 0; border-radius: var(--zt-r-panel); background: var(--zt-bg); color: var(--zt-text); box-shadow: var(--zt-shadow-pop); overflow: hidden;} .zt-lock, .zt-lock body.breakdance.zt-page--urun, html:has(> body.breakdance.zt-page--urun):has(.zt-lb[open]), html:has(> body.breakdance.zt-page--urun):has(.zt-lb[open]) body {overflow: hidden;} .zt-lock {scrollbar-gutter: stable; background: var(--zt-lock-bg);} body.breakdance.zt-page--urun .breakdance-popup-open .zt-qp, body.breakdance.zt-page--urun .zt-qp__form {display: flex; flex-direction: column; min-height: 0;} body.breakdance.zt-page--urun .zt-qp__head {display: flex; align-items: center; justify-content: space-between; gap: var(--zt-sp-4); padding: var(--zt-sp-5) var(--zt-sp-5) 0 var(--zt-sp-8);} body.breakdance.zt-page--urun .zt-qp__title {font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} body.breakdance.zt-page--urun .zt-qp:has(.zt-qp__done:not([hidden])) .zt-qp__title {visibility: hidden;} body.breakdance.zt-page--urun .zt-qp__x {width: var(--zt-touch); height: var(--zt-touch); padding: 0; border: 0; border-radius: var(--zt-r-round); background: var(--zt-surface); color: var(--zt-fume); cursor: pointer;} body.breakdance.zt-page--urun .zt-qp__body {display: grid; gap: var(--zt-sp-4); padding: var(--zt-sp-1) var(--zt-sp-8) var(--zt-sp-6); overflow: auto; overscroll-behavior: contain;} body.breakdance.zt-page--urun .zt-qp__lead {margin-bottom: var(--zt-sp-1); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} body.breakdance.zt-page--urun .zt-qp__m {display: flex; align-items: center; gap: var(--zt-sp-4); padding: var(--zt-sp-2); border-radius: var(--zt-r-inner); background: var(--zt-surface);} body.breakdance.zt-page--urun .zt-qp__thumb {flex: none; width: var(--zt-sp-16); aspect-ratio: 1; border-radius: calc(var(--zt-r-inner) - var(--zt-sp-2)); background: var(--zt-bg);} body.breakdance.zt-page--urun .zt-qp__m .zt-tag-dt, body.breakdance.zt-page--urun .zt-qp__m dt {font-size: var(--zt-fs-2xs); font-weight: 700; color: var(--zt-text-2);} body.breakdance.zt-page--urun .zt-qp__m .zt-tag-dd, body.breakdance.zt-page--urun .zt-qp__m dd {font-size: var(--zt-fs-md); line-height: 1.3; font-weight: 800;} body.breakdance.zt-page--urun .zt-qp .zt-form__kvkk {margin: 0;} body.breakdance.zt-page--urun .zt-qp__foot {padding: var(--zt-sp-4) var(--zt-sp-8) var(--zt-sp-6); border-top: var(--zt-rule);} body.breakdance.zt-page--urun .zt-qp__done {padding: 0 var(--zt-sp-8) var(--zt-sp-8); overflow: auto;} body.breakdance.zt-page--urun :where(.zt-qp__done) .zt-btn {margin-top: var(--zt-sp-7); background: none;} @media (prefers-reduced-motion: no-preference) { body.breakdance.zt-page--urun .zt-subnav a::after {transition: transform 0.3s var(--zt-ease);} body.breakdance.zt-page--urun .zt-lb[open] {animation: zt-fade 0.3s var(--zt-ease) both;} body.breakdance.zt-page--urun .zt-lb[open] .zt-lb__img {animation: zt-in 0.6s var(--zt-ease) both;} body.breakdance.zt-page--urun .breakdance-popup-open .zt-qp {animation: zt-in 0.32s var(--zt-ease) both;} body.breakdance.zt-page--urun .zt-qp .zt-btn:active {transition: transform 0.15s var(--zt-ease); transform: scale(0.97);} } @media (prefers-reduced-motion: no-preference) and (min-width: 1025px) { body.breakdance.zt-page--urun .zt-gal__slide > img {transition: transform 0.5s var(--zt-ease);} body.breakdance.zt-page--urun .zt-gal__go {transition: opacity var(--zt-dur-fast) var(--zt-ease);} body.breakdance.zt-page--urun .zt-gal__slide:hover > img, body.breakdance.zt-page--urun .zt-gal__slide:has(.zt-gal__open:focus-visible) > img {transform: scale(1.05);} } @media (max-width: 1199px) { body.breakdance.zt-page--urun {--zt-cmp-label: 170px;} body.breakdance.zt-page--urun .zt-pd__grid {grid-template-columns: repeat(2, minmax(0, 1fr));} body.breakdance.zt-page--urun .zt-areas {grid-template-columns: repeat(2, minmax(0, 1fr));} body.breakdance.zt-page--urun .zt-areas li {display: flex; align-items: center; padding: var(--zt-sp-3);} } @media (max-width: 1024px) { body.breakdance.zt-page--urun {--zt-sec-pd: var(--zt-sp-18); --zt-cmp-in: var(--zt-sp-4);} body.breakdance.zt-page--urun .zt-pd {padding-bottom: var(--zt-sp-12);} body.breakdance.zt-page--urun .zt-pd__grid, body.breakdance.zt-page--urun .zt-split, body.breakdance.zt-page--urun .zt-equip {grid-template-columns: 100%; gap: var(--zt-sp-8);} body.breakdance.zt-page--urun .zt-specs {grid-template-columns: repeat(2, minmax(0, 1fr));} body.breakdance.zt-page--urun .zt-check {gap: var(--zt-sp-7) var(--zt-sp-8);} .zt-js body.breakdance.zt-page--urun .zt-cmp__pick {display: flex; flex-wrap: wrap; align-items: center; gap: var(--zt-sp-2) var(--zt-sp-4); margin-bottom: var(--zt-sp-6);} .zt-js body.breakdance.zt-page--urun .zt-cmp__wrap {overflow: visible;} .zt-js body.breakdance.zt-page--urun .zt-cmp__t, .zt-js body.breakdance.zt-page--urun .zt-cmp__t :is(thead, tbody, tfoot) {display: block; min-width: 0;} .zt-js body.breakdance.zt-page--urun .zt-cmp__t tr {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));} .zt-js body.breakdance.zt-page--urun .zt-cmp__t tbody tr {border-top: var(--zt-rule);} .zt-js body.breakdance.zt-page--urun .zt-cmp__t tbody th {grid-column: 1 / -1; display: flex; align-items: center; gap: var(--zt-sp-2); padding: var(--zt-sp-4) 0 0; border: 0;} .zt-js body.breakdance.zt-page--urun .zt-cmp__t tbody th .zt-kc__ico {width: 18px; height: 18px; margin: 0;} .zt-js body.breakdance.zt-page--urun .zt-cmp__t :is(thead th, td) {padding: var(--zt-sp-2) 0 var(--zt-sp-4) var(--zt-cmp-in); border: 0;} .zt-js body.breakdance.zt-page--urun .zt-cmp__t .is-this {padding-left: 0; padding-right: var(--zt-cmp-in); background: none;} .zt-js body.breakdance.zt-page--urun .zt-cmp__t thead th {display: flex; flex-direction: column; justify-content: flex-end; padding-top: 0;} .zt-js body.breakdance.zt-page--urun .zt-cmp__t tbody td:not(.is-this) {border-left: var(--zt-rule);} .zt-js body.breakdance.zt-page--urun .zt-cmp__t tfoot td {padding-bottom: 0;} .zt-js body.breakdance.zt-page--urun .zt-cmp__t .is-this .zt-cmp__stage {background: var(--zt-surface);} .zt-js body.breakdance.zt-page--urun .zt-cmp__stage {--zt-ratio: 0.625; aspect-ratio: 16 / 10;} .zt-js body.breakdance.zt-page--urun .zt-cmp [data-c]:not(.is-this):not(.is-pick), .zt-js body.breakdance.zt-page--urun .zt-cmp__corner {display: none;} body.breakdance.zt-page--urun .zt-use {padding: 0; background: none;} body.breakdance.zt-page--urun .zt-areas {grid-template-columns: repeat(4, minmax(0, 1fr));} body.breakdance.zt-page--urun .zt-use li {font-size: var(--zt-fs-xs);} body.breakdance.zt-page--urun .zt-areas li {background: var(--zt-surface);} body.breakdance.zt-page--urun .zt-use .zt-kc__ico {width: 40px; height: 40px; padding: 9px; border-radius: var(--zt-r-round); background: var(--zt-bg);} } @media (max-width: 767px) { body.breakdance.zt-page--urun {--zt-sub-h: 52px; --zt-sec-pd: var(--zt-sp-14); --zt-box-pad: var(--zt-sp-6) var(--zt-sp-5); --zt-cmp-in: var(--zt-sp-3); --zt-stat: 1.1875rem; --zt-model: clamp(2rem, 9.6vw, 2.75rem);} body.breakdance.zt-page--urun .zt-pd {padding-block: var(--zt-sp-3) var(--zt-sp-10);} body.breakdance.zt-page--urun .zt-crumbs li {display: none;} body.breakdance.zt-page--urun .zt-crumbs li:has(+ li[aria-current]) {display: block;} body.breakdance.zt-page--urun .zt-crumbs li:has(+ li[aria-current])::before {content: none;} body.breakdance.zt-page--urun .zt-pd__grid {gap: var(--zt-sp-6); margin-top: var(--zt-sp-3);} body.breakdance.zt-page--urun .zt-gal__track {aspect-ratio: 16 / 12;} body.breakdance.zt-page--urun .zt-gal__thumbs {gap: 6px;} body.breakdance.zt-page--urun .zt-pd__kind {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--urun .zt-pd__stats {grid-template-columns: repeat(2, minmax(0, 1fr));} body.breakdance.zt-page--urun .zt-pd__act {display: grid; grid-template-columns: 100%;} body.breakdance.zt-page--urun .zt-subnav ul {gap: var(--zt-sp-6); margin-inline: calc(-1 * var(--zt-gutter)); padding-inline: var(--zt-gutter);} body.breakdance.zt-page--urun .zt-cmp__pick .zt-seg {display: flex; width: 100%;} body.breakdance.zt-page--urun .zt-cmp__pick .zt-seg__btn {flex: 1 1 0; padding: 0 var(--zt-sp-1);} body.breakdance.zt-page--urun .zt-cmp__name, body.breakdance.zt-page--urun .zt-cmp__t tbody td {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--urun .zt-desc__lead {font-size: var(--zt-fs-md);} body.breakdance.zt-page--urun .zt-areas, body.breakdance.zt-page--urun .zt-floors {grid-template-columns: repeat(2, minmax(0, 1fr));} body.breakdance.zt-page--urun .zt-floors {row-gap: var(--zt-sp-5);} body.breakdance.zt-page--urun .zt-areas li {gap: 10px; padding: 10px;} body.breakdance.zt-page--urun .zt-use .zt-kc__ico {width: 36px; height: 36px; padding: 8px;} body.breakdance.zt-page--urun .zt-check, body.breakdance.zt-page--urun .zt-specs {grid-template-columns: 100%;} body.breakdance.zt-page--urun .zt-check {gap: var(--zt-sp-6);} body.breakdance.zt-page--urun .zt-sg {padding: var(--zt-sp-5) var(--zt-sp-5) var(--zt-sp-2);} body.breakdance.zt-page--urun .zt-split + .zt-container {margin-top: var(--zt-sp-12);} body.breakdance.zt-page--urun .zt-specs + .zt-cta {margin-top: var(--zt-sp-6);} body.breakdance.zt-page--urun .zt-cta .zt-kc__mark {display: none;} body.breakdance.zt-page--urun .zt-equip__list {columns: 1;} body.breakdance.zt-page--urun .zt-qp {inset: auto 0 0; width: 100%; max-height: 92dvh; margin: 0; border-radius: var(--zt-r-panel) var(--zt-r-panel) 0 0; box-shadow: var(--zt-sheet-shadow);} body.breakdance.zt-page--urun .zt-qp__head {padding: var(--zt-sp-3) var(--zt-sp-3) 0 var(--zt-sp-4);} body.breakdance.zt-page--urun .zt-qp__title {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--urun .zt-qp__body {padding-inline: var(--zt-sp-4);} body.breakdance.zt-page--urun .zt-qp__foot {padding: var(--zt-sp-3) var(--zt-sp-4) calc(var(--zt-sp-3) + env(safe-area-inset-bottom, 0px));} body.breakdance.zt-page--urun .zt-qp__done {padding: 0 var(--zt-sp-4) calc(var(--zt-sp-5) + env(safe-area-inset-bottom, 0px));} } @media (prefers-reduced-motion: no-preference) and (max-width: 767px) { body.breakdance.zt-page--urun .breakdance-popup-open .zt-qp {animation-name: zt-sheet-in;} } @media (max-width: 359px) { body.breakdance.zt-page--urun {--zt-box-pad: var(--zt-sp-5) var(--zt-sp-4);} body.breakdance.zt-page--urun .zt-gal__thumbs {gap: 4px;} body.breakdance.zt-page--urun .zt-cmp__pick .zt-seg__btn {font-size: var(--zt-fs-3xs);} body.breakdance.zt-page--urun .zt-cmp__tag {padding-inline: var(--zt-sp-2); font-size: 11px; white-space: nowrap;} .zt-js body.breakdance.zt-page--urun .zt-cmp__t thead .is-this {padding-right: var(--zt-sp-2);} body.breakdance.zt-page--urun .zt-areas li {font-size: var(--zt-fs-2xs);} } body.breakdance.zt-page--urun [hidden] {display: none;} body.breakdance.zt-page--servis .zt-hero--svc {--zt-hero-top: 72px; --zt-hero-pb: 104px; --zt-scrim-side: linear-gradient(90deg, rgb(20 28 32 / 0.86) 0%, rgb(20 28 32 / 0.8) 36%, rgb(20 28 32 / 0.34) 64%, rgb(20 28 32 / 0.14) 100%);} body.breakdance.zt-page--servis .zt-hero--svc .zt-hero__grid {grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); grid-template-areas: "copy .";} body.breakdance.zt-page--servis .zt-hero--svc .zt-hero__bg {object-position: 50% 50%;} body.breakdance.zt-page--servis .zt-hero--svc .zt-hero__title {max-width: 11em; font-size: var(--zt-svc-h1);} body.breakdance.zt-page--servis .zt-hero--svc .zt-hero__lead {max-width: 30em;} body.breakdance.zt-page--servis .zt-hero--svc + .zt-section {padding-top: var(--zt-sec);} body.breakdance.zt-page--servis .zt-crumbs ol {display: flex; flex-wrap: wrap; gap: 0 var(--zt-sp-2); margin: 0 0 var(--zt-sp-5); padding: 0; list-style: none; font-size: var(--zt-fs-2xs); font-weight: 600; color: var(--zt-on-photo-2);} body.breakdance.zt-page--servis .zt-crumbs li + li::before {content: "/"; margin-right: var(--zt-sp-2);} body.breakdance.zt-page--servis .zt-crumbs a {display: inline-block; padding: var(--zt-sp-3) 0; margin: calc(-1 * var(--zt-sp-3)) 0;} body.breakdance.zt-page--servis .zt-crumbs a:hover, body.breakdance.zt-page--servis .zt-crumbs [aria-current] {color: var(--zt-on-fume);} body.breakdance.zt-page--servis .zt-sv__grid {display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--zt-sp-16);} body.breakdance.zt-page--servis .zt-sv__media {position: relative; min-height: 480px; overflow: hidden; border-radius: var(--zt-r-panel); background: var(--zt-surface-2);} body.breakdance.zt-page--servis .zt-sv__media img {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 58% 46%;} body.breakdance.zt-page--servis .zt-sv__list {border-top: var(--zt-rule-floor);} body.breakdance.zt-page--servis .zt-sv__item {display: grid; grid-template-columns: var(--zt-sp-12) minmax(0, 1fr); gap: var(--zt-sp-5); padding: var(--zt-sp-7) 0; border-bottom: var(--zt-rule-floor);} body.breakdance.zt-page--servis .zt-sv__ico, body.breakdance.zt-page--servis .zt-sf__ci, body.breakdance.zt-page--servis .zt-file__ico, body.breakdance.zt-page--servis .zt-qp__ico {display: grid; place-items: center; flex: none; border-radius: var(--zt-r-round); color: var(--zt-fume);} body.breakdance.zt-page--servis .zt-sv__ico {width: var(--zt-sp-12); height: var(--zt-sp-12); background: var(--zt-surface);} body.breakdance.zt-page--servis .zt-sv__ico .zt-icon, body.breakdance.zt-page--servis .zt-qp__ico .zt-icon {width: var(--zt-icon-lg); height: var(--zt-icon-lg); stroke-width: 1.6;} body.breakdance.zt-page--servis .zt-sv__t {padding-top: 10px; font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} body.breakdance.zt-page--servis .zt-sv__p {max-width: 34em; margin-top: var(--zt-sp-2); color: var(--zt-text-2);} body.breakdance.zt-page--servis .zt-parts__h {margin-top: var(--zt-sp-5); font-size: var(--zt-fs-2xs); font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--zt-text-3);} body.breakdance.zt-page--servis .zt-parts {display: flex; flex-wrap: wrap; gap: var(--zt-sp-2); margin-top: var(--zt-sp-3);} body.breakdance.zt-page--servis .zt-parts li {display: inline-flex; align-items: center; gap: var(--zt-sp-2); min-height: var(--zt-sp-10); padding: 0 var(--zt-sp-4) 0 var(--zt-sp-3); border-radius: var(--zt-r-pill); background: var(--zt-surface); font-size: var(--zt-fs-xs); font-weight: 700;} body.breakdance.zt-page--servis .zt-parts .zt-icon {color: var(--zt-fume); stroke-width: 1.6;} body.breakdance.zt-page--servis .zt-notes {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zt-sp-6); margin-top: var(--zt-sp-7);} body.breakdance.zt-page--servis .zt-notes li {display: flex; align-items: flex-start; gap: var(--zt-sp-3); font-size: var(--zt-fs-sm); line-height: 1.45; color: var(--zt-text-2);} body.breakdance.zt-page--servis .zt-notes .zt-icon {margin-top: 1px; color: var(--zt-fume);} body.breakdance.zt-page--servis .zt-sv > .section-container > .zt-container + .zt-container {margin-top: var(--zt-sp-18);} body.breakdance.zt-page--servis .zt-cta__media--photo {overflow: hidden; border-radius: calc(var(--zt-r-panel) - var(--zt-sp-3)); background: var(--zt-fume);} body.breakdance.zt-page--servis .zt-cta__media--photo img {width: 100%; height: 100%; object-fit: cover; object-position: 40% 56%;} body.breakdance.zt-page--servis .zt-types {background: var(--zt-surface-2);} body.breakdance.zt-page--servis .zt-mt__grid {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--zt-gap);} body.breakdance.zt-page--servis .zt-mt {display: flex; flex-direction: column; height: 100%; border-radius: var(--zt-r-panel); background: var(--zt-bg);} body.breakdance.zt-page--servis .zt-mt__name {padding: var(--zt-sp-5) var(--zt-sp-5) 0; font-size: var(--zt-fs-sm); line-height: 1.3; font-weight: 750; letter-spacing: -0.01em;} body.breakdance.zt-page--servis .zt-mt .zt-tile__stage {--zt-air: var(--zt-sp-3); --zt-lift: var(--zt-sp-5); flex: none; min-height: 0; margin-top: auto; aspect-ratio: var(--zt-svc-mt-ratio);} body.breakdance.zt-page--servis .zt-mt__meta {display: flex; align-items: center; justify-content: space-between; gap: var(--zt-sp-2); min-height: var(--zt-sp-12); padding: 0 var(--zt-sp-4) 0 var(--zt-sp-5); border-top: var(--zt-rule-floor); font-size: var(--zt-fs-xs); font-weight: 700; color: var(--zt-fume);} body.breakdance.zt-page--servis .zt-mt:hover .zt-mt__name {text-decoration: underline; text-decoration-thickness: var(--zt-hair); text-underline-offset: 3px;} body.breakdance.zt-page--servis .zt-mt--all {background: var(--zt-fume); color: var(--zt-on-fume);} body.breakdance.zt-page--servis .zt-mt--all:hover {color: var(--zt-on-fume);} body.breakdance.zt-page--servis .zt-mt__all {display: grid; align-content: center; justify-items: center; gap: var(--zt-sp-3); margin-top: auto; padding: var(--zt-sp-4); aspect-ratio: var(--zt-svc-mt-ratio); text-align: center;} body.breakdance.zt-page--servis .zt-mt__all .zt-icon {width: var(--zt-sp-10); height: var(--zt-sp-10);} body.breakdance.zt-page--servis .zt-mt__line {max-width: 16em; font-size: var(--zt-fs-xs); line-height: 1.4; color: var(--zt-on-photo-2);} body.breakdance.zt-page--servis .zt-mt--all .zt-mt__meta {border-top-color: var(--zt-fume-line); color: var(--zt-on-fume);} body.breakdance.zt-page--servis .zt-proc {background: var(--zt-surface);} body.breakdance.zt-page--servis .zt-steps {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zt-sp-10); margin: 0; padding: 0; list-style: none;} body.breakdance.zt-page--servis .zt-step {position: relative;} body.breakdance.zt-page--servis .zt-step:not(:last-child)::before {content: ""; position: absolute; top: calc(var(--zt-sp-12) / 2 - 1px); left: calc(var(--zt-sp-12) + var(--zt-sp-4)); right: calc(var(--zt-sp-4) - var(--zt-sp-10)); border-top: var(--zt-stroke) solid var(--zt-floor);} body.breakdance.zt-page--servis .zt-step__n {display: grid; place-items: center; width: var(--zt-sp-12); height: var(--zt-sp-12); border-radius: var(--zt-r-round); background: var(--zt-fume); color: var(--zt-on-fume); font-size: var(--zt-fs-md); font-weight: 800; font-variant-numeric: tabular-nums;} body.breakdance.zt-page--servis .zt-step__t {margin-top: var(--zt-sp-6); font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} body.breakdance.zt-page--servis .zt-step__p {max-width: 24em; margin-top: var(--zt-sp-3); color: var(--zt-text-2);} body.breakdance.zt-page--servis .zt-step__p a {color: var(--zt-fume); font-weight: 700; text-decoration: underline; text-decoration-thickness: var(--zt-hair); text-underline-offset: 3px; white-space: nowrap;} body.breakdance.zt-page--servis .zt-step__p a:hover {color: var(--zt-fume);} body.breakdance.zt-page--servis .zt-sf__grid {display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--zt-sp-18); align-items: start;} body.breakdance.zt-page--servis .zt-sf__side {position: sticky; top: calc(var(--zt-header-h) + var(--zt-sp-8));} body.breakdance.zt-page--servis .zt-sf__direct {display: grid; gap: var(--zt-sp-2); margin-top: var(--zt-sp-8); padding-top: var(--zt-sp-6); border-top: var(--zt-rule-floor);} body.breakdance.zt-page--servis .zt-sf__c {display: inline-flex; align-items: center; gap: var(--zt-sp-4); min-height: var(--zt-sp-14); font-size: var(--zt-fs-lg); line-height: 1.25; font-weight: 800; letter-spacing: -0.01em; color: var(--zt-fume); overflow-wrap: anywhere;} body.breakdance.zt-page--servis .zt-sf__c:hover {color: var(--zt-fume);} body.breakdance.zt-page--servis .zt-sf__direct li:first-child .zt-sf__c {font-size: var(--zt-fs-h4); letter-spacing: -0.02em;} body.breakdance.zt-page--servis .zt-sf__c small {display: block; margin-bottom: 2px; font-size: var(--zt-fs-2xs); font-weight: 700; letter-spacing: 0; color: var(--zt-text-2);} body.breakdance.zt-page--servis .zt-sf__ci {width: var(--zt-sp-12); height: var(--zt-sp-12); background: var(--zt-bg);} html:has(> body.breakdance.zt-page--servis):not(.zt-js) .zt-sf__open {display: none;} .zt-js body.breakdance.zt-page--servis .zt-sf__grid {display: block;} .zt-js body.breakdance.zt-page--servis .zt-sf__side {position: static; display: grid; grid-template: "intro act" auto "lines lines" auto / minmax(0, 1fr) auto; align-items: center; column-gap: var(--zt-sp-12);} .zt-js body.breakdance.zt-page--servis .zt-sf__intro {grid-area: intro; margin: 0;} .zt-js body.breakdance.zt-page--servis .zt-sf .zt-offer__text {max-width: 36em;} body.breakdance.zt-page--servis .zt-sf__open {grid-area: act;} .zt-js body.breakdance.zt-page--servis .zt-sf__direct {grid-area: lines; display: flex; flex-wrap: wrap; gap: var(--zt-sp-2) var(--zt-sp-12);} body.breakdance.zt-page--servis .zt-sf__set {min-width: 0; margin: 0; padding: 0; border: 0;} body.breakdance.zt-page--servis .zt-sf__set legend {padding: 0;} body.breakdance.zt-page--servis .zt-sf__opts {display: flex; flex-wrap: wrap; gap: var(--zt-sp-2);} body.breakdance.zt-page--servis .zt-sf__opt {position: relative; display: inline-flex;} body.breakdance.zt-page--servis .zt-sf__opt input {position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer;} body.breakdance.zt-page--servis .zt-sf__opt span {display: inline-flex; align-items: center; min-height: var(--zt-touch); padding: 0 var(--zt-sp-5); border: var(--zt-hair) solid var(--zt-field); border-radius: var(--zt-r-pill); background: var(--zt-bg); font-size: var(--zt-fs-sm); font-weight: 600;} body.breakdance.zt-page--servis .zt-sf__opt:hover span {border-color: var(--zt-fume);} body.breakdance.zt-page--servis .zt-sf__opt input:checked + span {border-color: var(--zt-fume); background: var(--zt-fume); color: var(--zt-on-fume);} body.breakdance.zt-page--servis .zt-sf__opt input:focus-visible + span {outline: var(--zt-stroke) solid var(--zt-fume); outline-offset: 3px;} body.breakdance.zt-page--servis .zt-field__hint {margin-top: var(--zt-sp-2); font-size: var(--zt-fs-xs); color: var(--zt-text-2);} body.breakdance.zt-page--servis .zt-file {position: relative; display: flex; align-items: center; gap: var(--zt-sp-4); padding: var(--zt-sp-4) var(--zt-sp-5); border: var(--zt-stroke) dashed var(--zt-field); border-radius: var(--zt-r-inner); background: var(--zt-bg);} body.breakdance.zt-page--servis .zt-file:hover, body.breakdance.zt-page--servis .zt-file.is-over {border-color: var(--zt-fume); background: var(--zt-surface);} body.breakdance.zt-page--servis .zt-file:has(:focus-visible) {outline: var(--zt-stroke) solid var(--zt-fume); outline-offset: 3px;} body.breakdance.zt-page--servis .zt-file:has([aria-invalid="true"]) {border-color: var(--zt-error);} body.breakdance.zt-page--servis .zt-file__input {position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer;} body.breakdance.zt-page--servis .zt-file__ico {width: var(--zt-sp-12); height: var(--zt-sp-12); background: var(--zt-surface);} body.breakdance.zt-page--servis .zt-file__t {display: block; font-size: var(--zt-fs-sm); font-weight: 700; line-height: 1.35;} body.breakdance.zt-page--servis .zt-file__h {display: block; margin-top: 2px; font-size: var(--zt-fs-xs); line-height: 1.45; color: var(--zt-text-2);} body.breakdance.zt-page--servis .zt-file__list {display: grid; gap: var(--zt-sp-1); margin-top: var(--zt-sp-3); font-size: var(--zt-fs-xs); font-weight: 600; overflow-wrap: anywhere;} body.breakdance.zt-page--servis .zt-file__clear {display: inline-flex; align-items: center; gap: 6px; min-height: var(--zt-touch); padding: 0; border: 0; background: none; font-size: var(--zt-fs-xs); font-weight: 700; color: var(--zt-fume); cursor: pointer;} body.breakdance.zt-page--servis .zt-file__clear:hover {text-decoration: underline; text-underline-offset: 3px;} body.breakdance.zt-page--servis .zt-faq__in + .zt-container {margin-top: var(--zt-sp-16);} body.breakdance.zt-page--servis .zt-qp {width: min(520px, 100% - 2 * var(--zt-gutter)); max-width: none; max-height: calc(100dvh - 2 * var(--zt-sp-8)); padding: 0; border: 0; border-radius: var(--zt-r-panel); background: var(--zt-bg); color: var(--zt-text); box-shadow: var(--zt-shadow-pop); overflow: hidden;} body.breakdance.zt-page--servis .zt-qp--form {width: min(640px, 100% - 2 * var(--zt-gutter));} body.breakdance.zt-page--servis .breakdance-popup-open .zt-qp, body.breakdance.zt-page--servis .zt-qp__form {display: flex; flex-direction: column; min-height: 0;} body.breakdance.zt-page--servis .zt-qp__head {display: flex; align-items: center; justify-content: space-between; gap: var(--zt-sp-4); padding: var(--zt-sp-5) var(--zt-sp-5) 0 var(--zt-sp-8);} body.breakdance.zt-page--servis .zt-qp__title {font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} body.breakdance.zt-page--servis .zt-qp:has(.zt-qp__done:not([hidden])) .zt-qp__title {visibility: hidden;} body.breakdance.zt-page--servis .zt-qp__x {display: grid; place-items: center; width: var(--zt-touch); height: var(--zt-touch); padding: 0; border: 0; border-radius: var(--zt-r-round); background: var(--zt-surface); color: var(--zt-fume); cursor: pointer;} body.breakdance.zt-page--servis .zt-qp__body {display: grid; gap: var(--zt-sp-4); padding: var(--zt-sp-1) var(--zt-sp-8) var(--zt-sp-6); overflow: auto; overscroll-behavior: contain;} body.breakdance.zt-page--servis .zt-qp__lead {margin-bottom: var(--zt-sp-1); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} body.breakdance.zt-page--servis .zt-qp__m {display: flex; align-items: center; gap: var(--zt-sp-4); padding: var(--zt-sp-2); border-radius: var(--zt-r-inner); background: var(--zt-surface);} body.breakdance.zt-page--servis .zt-qp__thumb {flex: none; width: var(--zt-sp-16); aspect-ratio: 1; border-radius: calc(var(--zt-r-inner) - var(--zt-sp-2)); background: var(--zt-bg);} body.breakdance.zt-page--servis .zt-qp__m .zt-tag-dt, body.breakdance.zt-page--servis .zt-qp__m dt {font-size: var(--zt-fs-2xs); font-weight: 700; color: var(--zt-text-2);} body.breakdance.zt-page--servis .zt-qp__m .zt-tag-dd, body.breakdance.zt-page--servis .zt-qp__m dd {font-size: var(--zt-fs-md); line-height: 1.3; font-weight: 800;} body.breakdance.zt-page--servis .zt-qp .zt-form__kvkk {margin: 0;} body.breakdance.zt-page--servis .zt-qp__foot {padding: var(--zt-sp-4) var(--zt-sp-8) var(--zt-sp-6); border-top: var(--zt-rule);} body.breakdance.zt-page--servis .zt-qp__done {padding: 0 var(--zt-sp-8) var(--zt-sp-8); overflow: auto;} body.breakdance.zt-page--servis :where(.zt-qp__done) .zt-btn {margin-top: var(--zt-sp-7); background: none;} .zt-lock, .zt-lock body.breakdance.zt-page--servis {overflow: hidden;} .zt-lock {scrollbar-gutter: stable; background: var(--zt-lock-bg);} @media (prefers-reduced-motion: no-preference) { body.breakdance.zt-page--servis .breakdance-popup-open .zt-qp {animation: zt-in 0.32s var(--zt-ease) both;} body.breakdance.zt-page--servis .zt-qp .zt-btn:active {transition: transform 0.15s var(--zt-ease); transform: scale(0.97);} body.breakdance.zt-page--servis .zt-mt:hover .zt-tile__stage img {transform: translate(-50%, var(--zt-foot, 0%)) scale(1.045);} body.breakdance.zt-page--servis .zt-mt:hover .zt-mt__meta .zt-icon {transform: translateX(3px);} } @media (max-width: 1199px) { body.breakdance.zt-page--servis {--zt-svc-mt-ratio: 4 / 3;} } @media (max-width: 1024px) { body.breakdance.zt-page--servis .zt-hero--svc {--zt-svc-h1: clamp(2.5rem, 5.6vw, 3.25rem); --zt-hero-top: var(--zt-sp-12); --zt-hero-pb: var(--zt-sp-16); --zt-scrim-side: linear-gradient(180deg, rgb(20 28 32 / 0.86) 0%, rgb(20 28 32 / 0.74) 100%);} body.breakdance.zt-page--servis .zt-hero--svc .zt-hero__grid {grid-template-columns: 100%; grid-template-areas: "copy";} body.breakdance.zt-page--servis .zt-hero--svc .zt-hero__bg {object-position: 58% 50%;} body.breakdance.zt-page--servis .zt-sv__grid {gap: var(--zt-sp-10);} body.breakdance.zt-page--servis .zt-sv__media {min-height: 0;} body.breakdance.zt-page--servis .zt-notes {grid-template-columns: 100%; gap: var(--zt-sp-3);} body.breakdance.zt-page--servis .zt-cta__media--photo {border-radius: var(--zt-r-inner);} body.breakdance.zt-page--servis .zt-steps {gap: var(--zt-sp-6);} body.breakdance.zt-page--servis .zt-step:not(:last-child)::before {right: calc(var(--zt-sp-3) - var(--zt-sp-6));} body.breakdance.zt-page--servis .zt-sf__grid {grid-template-columns: 100%; gap: 0;} body.breakdance.zt-page--servis .zt-sf__side {display: contents;} body.breakdance.zt-page--servis .zt-sf__intro {order: 1; margin-bottom: var(--zt-sp-8);} body.breakdance.zt-page--servis .zt-sf .zt-qp--form {order: 2;} body.breakdance.zt-page--servis .zt-sf__direct {order: 3;} } @media (max-width: 767px) { body.breakdance.zt-page--servis {--zt-svc-mt-ratio: 5 / 4;} body.breakdance.zt-page--servis .zt-hero--svc {--zt-svc-h1: clamp(2.125rem, 10.4vw, 2.75rem); --zt-hero-top: var(--zt-sp-5); --zt-hero-pb: var(--zt-sp-10);} body.breakdance.zt-page--servis .zt-hero--svc .zt-hero__bg {object-position: 62% 50%;} body.breakdance.zt-page--servis .zt-crumbs ol {margin-bottom: var(--zt-sp-3); font-size: var(--zt-fs-3xs);} body.breakdance.zt-page--servis .zt-crumbs a {padding-block: 13px; margin-block: -13px;} body.breakdance.zt-page--servis .zt-sv__grid {grid-template-columns: 100%; gap: var(--zt-sp-6);} body.breakdance.zt-page--servis .zt-sv__media {aspect-ratio: 4 / 3;} body.breakdance.zt-page--servis .zt-sv__media img {object-position: 60% 42%;} body.breakdance.zt-page--servis .zt-sv__item {grid-template-columns: var(--zt-sp-10) minmax(0, 1fr); gap: var(--zt-sp-4); padding: var(--zt-sp-6) 0;} body.breakdance.zt-page--servis .zt-sv__ico {width: var(--zt-sp-10); height: var(--zt-sp-10);} body.breakdance.zt-page--servis .zt-sv__ico .zt-icon {width: var(--zt-icon); height: var(--zt-icon);} body.breakdance.zt-page--servis .zt-sv__t {padding-top: 7px; font-size: var(--zt-fs-lg);} body.breakdance.zt-page--servis .zt-parts li {min-height: 36px; padding: 0 var(--zt-sp-3) 0 10px;} body.breakdance.zt-page--servis .zt-notes {margin-top: var(--zt-sp-6);} body.breakdance.zt-page--servis .zt-sv > .section-container > .zt-container + .zt-container {margin-top: var(--zt-sp-12);} body.breakdance.zt-page--servis .zt-mt__grid {grid-template-columns: repeat(2, minmax(0, 1fr));} body.breakdance.zt-page--servis .zt-mt__name {padding: var(--zt-sp-4) var(--zt-sp-4) 0; font-size: var(--zt-fs-xs);} body.breakdance.zt-page--servis .zt-mt .zt-tile__stage {--zt-air: var(--zt-sp-2); --zt-lift: var(--zt-sp-4);} body.breakdance.zt-page--servis .zt-mt__meta {min-height: var(--zt-touch); padding: 0 var(--zt-sp-3) 0 var(--zt-sp-4);} body.breakdance.zt-page--servis .zt-steps {grid-template-columns: 100%; gap: 0;} body.breakdance.zt-page--servis .zt-step {display: grid; grid-template-columns: var(--zt-sp-10) minmax(0, 1fr); column-gap: var(--zt-sp-4); padding-bottom: var(--zt-sp-7);} body.breakdance.zt-page--servis .zt-step:last-child {padding-bottom: 0;} body.breakdance.zt-page--servis .zt-step__n {grid-row: 1 / span 2; width: var(--zt-sp-10); height: var(--zt-sp-10); font-size: var(--zt-fs-base);} body.breakdance.zt-page--servis .zt-step__t, body.breakdance.zt-page--servis .zt-step__p {grid-column: 2;} body.breakdance.zt-page--servis .zt-step__t {margin-top: 7px; font-size: var(--zt-fs-lg);} body.breakdance.zt-page--servis .zt-step__p {margin-top: var(--zt-sp-2);} body.breakdance.zt-page--servis .zt-step:not(:last-child)::before {top: calc(var(--zt-sp-10) + var(--zt-sp-2)); bottom: var(--zt-sp-2); left: calc(var(--zt-sp-10) / 2 - 1px); right: auto; border-top: 0; border-left: var(--zt-stroke) solid var(--zt-floor);} body.breakdance.zt-page--servis .zt-sf__intro {margin-bottom: var(--zt-sp-6);} .zt-js body.breakdance.zt-page--servis .zt-sf__side {grid-template: "intro" auto "act" auto "lines" auto / 100%;} body.breakdance.zt-page--servis .zt-sf__open {margin-top: var(--zt-sp-6);} .zt-js body.breakdance.zt-page--servis .zt-sf__direct {display: grid;} body.breakdance.zt-page--servis .zt-sf__c {font-size: var(--zt-fs-md);} body.breakdance.zt-page--servis .zt-sf__direct li:first-child .zt-sf__c {font-size: var(--zt-fs-quote);} body.breakdance.zt-page--servis .zt-sf__ci {width: var(--zt-sp-10); height: var(--zt-sp-10);} body.breakdance.zt-page--servis .zt-sf__opt span {padding: 0 var(--zt-sp-4);} body.breakdance.zt-page--servis .zt-file {padding: var(--zt-sp-4);} body.breakdance.zt-page--servis .zt-faq__in + .zt-container {margin-top: var(--zt-sp-10);} body.breakdance.zt-page--servis .zt-qp {inset: auto 0 0; width: 100%; max-height: 92dvh; margin: 0; border-radius: var(--zt-r-panel) var(--zt-r-panel) 0 0; box-shadow: var(--zt-sheet-shadow);} body.breakdance.zt-page--servis .zt-qp__head {padding: var(--zt-sp-3) var(--zt-sp-3) 0 var(--zt-sp-4);} body.breakdance.zt-page--servis .zt-qp__title {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--servis .zt-qp__body {padding-inline: var(--zt-sp-4);} body.breakdance.zt-page--servis .zt-qp__foot {padding: var(--zt-sp-3) var(--zt-sp-4) calc(var(--zt-sp-3) + env(safe-area-inset-bottom, 0px));} body.breakdance.zt-page--servis .zt-qp__done {padding: 0 var(--zt-sp-4) calc(var(--zt-sp-5) + env(safe-area-inset-bottom, 0px));} } @media (prefers-reduced-motion: no-preference) and (max-width: 767px) { body.breakdance.zt-page--servis .breakdance-popup-open .zt-qp {animation-name: zt-sheet-in;} } @media (max-width: 359px) { body.breakdance.zt-page--servis .zt-sf__c {font-size: var(--zt-fs-sm);} body.breakdance.zt-page--servis .zt-mt__name {padding: var(--zt-sp-3) var(--zt-sp-3) 0;} body.breakdance.zt-page--servis .zt-mt__meta {padding: 0 var(--zt-sp-2) 0 var(--zt-sp-3);} body.breakdance.zt-page--servis .zt-sf__opt span {padding: 0 var(--zt-sp-3);} body.breakdance.zt-page--servis .zt-file {gap: var(--zt-sp-3); padding: var(--zt-sp-3);} } body.breakdance.zt-page--servis [hidden] {display: none;} body.breakdance.zt-page--yedek-parca .zt-hero--yp {--zt-hero-top: 64px; --zt-hero-pb: 72px; --zt-scrim-side: var(--zt-yp-scrim);} body.breakdance.zt-page--yedek-parca .zt-hero--yp .zt-hero__grid {grid-template-columns: minmax(0, 1fr); grid-template-areas: "copy";} body.breakdance.zt-page--yedek-parca .zt-hero--yp .zt-hero__copy {max-width: 42rem; padding-bottom: calc(var(--zt-hero-pb) + var(--zt-yp-lap));} body.breakdance.zt-page--yedek-parca .zt-hero--yp .zt-hero__title {max-width: 13em; font-size: var(--zt-yp-h1);} body.breakdance.zt-page--yedek-parca .zt-hero--yp .zt-hero__lead {max-width: 34em;} body.breakdance.zt-page--yedek-parca .zt-hero--yp .zt-hero__bg {object-position: 50% 50%;} body.breakdance.zt-page--yedek-parca .zt-crumbs ol {display: flex; flex-wrap: wrap; gap: 0 var(--zt-sp-2); margin: 0 0 var(--zt-sp-5); padding: 0; list-style: none; font-size: var(--zt-fs-2xs); font-weight: 600; color: var(--zt-on-photo-2);} body.breakdance.zt-page--yedek-parca .zt-crumbs li + li::before {content: "/"; margin-right: var(--zt-sp-2);} body.breakdance.zt-page--yedek-parca .zt-crumbs a {display: inline-block; padding: var(--zt-sp-3) 0; margin: calc(-1 * var(--zt-sp-3)) 0;} body.breakdance.zt-page--yedek-parca .zt-crumbs a:hover, body.breakdance.zt-page--yedek-parca .zt-crumbs [aria-current] {color: var(--zt-on-fume);} body.breakdance.zt-page--yedek-parca .zt-hero--yp + .zt-parts {padding-block: 0; border-top: 0;} body.breakdance.zt-page--yedek-parca .zt-parts + .zt-section {border-top: 0;} body.breakdance.zt-page--yedek-parca .zt-parts__panel {position: relative; z-index: 2; margin-top: calc(-1 * var(--zt-yp-lap)); padding: var(--zt-sp-8); border-radius: var(--zt-r-panel); background: var(--zt-bg); box-shadow: var(--zt-panel-shadow);} body.breakdance.zt-page--yedek-parca .zt-parts__head {display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--zt-sp-2) var(--zt-sp-8); margin-bottom: var(--zt-sp-6);} body.breakdance.zt-page--yedek-parca .zt-parts__title {font-size: var(--zt-fs-h3); line-height: 1.15;} body.breakdance.zt-page--yedek-parca .zt-parts__hint {font-size: var(--zt-fs-sm); color: var(--zt-text-2); text-wrap: pretty;} body.breakdance.zt-page--yedek-parca .zt-parts__list {display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--zt-sp-3);} body.breakdance.zt-page--yedek-parca .zt-part {position: relative; display: flex; flex-direction: column; padding: var(--zt-sp-5) var(--zt-sp-5) var(--zt-sp-6); border-radius: var(--zt-r-inner); background: var(--zt-surface);} body.breakdance.zt-page--yedek-parca .zt-part:hover {background: var(--zt-surface-2);} body.breakdance.zt-page--yedek-parca .zt-part__ico {display: grid; place-items: center; width: var(--zt-sp-12); height: var(--zt-sp-12); margin-bottom: var(--zt-sp-8); border-radius: var(--zt-r-round); background: var(--zt-bg); color: var(--zt-fume); box-shadow: var(--zt-shadow-seg);} body.breakdance.zt-page--yedek-parca .zt-part__ico .zt-icon {width: var(--zt-icon-lg); height: var(--zt-icon-lg); stroke-width: 1.6;} body.breakdance.zt-page--yedek-parca .zt-part__name {font-size: var(--zt-fs-lg); line-height: 1.25; font-weight: 800; letter-spacing: -0.012em;} body.breakdance.zt-page--yedek-parca .zt-part__link::after {content: ""; position: absolute; inset: 0; z-index: 1;} body.breakdance.zt-page--yedek-parca .zt-part__link:focus-visible {outline: none;} body.breakdance.zt-page--yedek-parca .zt-part:has(.zt-part__link:focus-visible) {outline: var(--zt-stroke) solid var(--zt-fume); outline-offset: 3px;} body.breakdance.zt-page--yedek-parca .zt-part__ex {margin-top: var(--zt-sp-2); font-size: var(--zt-fs-xs); line-height: 1.5; color: var(--zt-text-2);} body.breakdance.zt-page--yedek-parca .zt-part .zt-go {position: absolute; top: var(--zt-sp-5); right: var(--zt-sp-5); width: var(--zt-sp-9); height: var(--zt-sp-9); background: var(--zt-bg);} body.breakdance.zt-page--yedek-parca .zt-part:hover .zt-go {background: var(--zt-fume); color: var(--zt-bg);} body.breakdance.zt-page--yedek-parca .zt-steps {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zt-sp-10); margin: 0; padding: 0; list-style: none;} body.breakdance.zt-page--yedek-parca .zt-step {padding-top: var(--zt-sp-6); border-top: var(--zt-rule-floor);} body.breakdance.zt-page--yedek-parca .zt-step__n {display: block; font-size: var(--zt-fs-2xs); font-weight: 800; letter-spacing: 0.14em; color: var(--zt-text-3); font-variant-numeric: tabular-nums;} body.breakdance.zt-page--yedek-parca .zt-step__t {margin-top: var(--zt-sp-3); font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} body.breakdance.zt-page--yedek-parca .zt-step__p {max-width: 24em; margin-top: var(--zt-sp-3); color: var(--zt-text-2);} body.breakdance.zt-page--yedek-parca .zt-steps + .zt-cta {margin-top: var(--zt-sp-18);} body.breakdance.zt-page--yedek-parca .zt-ident .zt-head__lead a {color: var(--zt-fume); font-weight: 700; text-decoration: underline; text-decoration-thickness: var(--zt-hair); text-underline-offset: 3px;} body.breakdance.zt-page--yedek-parca .zt-ident .zt-head__lead a:hover {color: var(--zt-fume);} body.breakdance.zt-page--yedek-parca .zt-cta__media--photo {position: relative; overflow: hidden; border-radius: calc(var(--zt-r-panel) - var(--zt-sp-3)); background: var(--zt-surface);} body.breakdance.zt-page--yedek-parca .zt-cta__media--photo img {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 56%;} body.breakdance.zt-page--yedek-parca .zt-cross {background: var(--zt-surface);} body.breakdance.zt-page--yedek-parca .zt-cross__grid {display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--zt-sp-18); align-items: center;} body.breakdance.zt-page--yedek-parca .zt-cross__media {position: relative; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--zt-r-panel); background: var(--zt-surface-2);} body.breakdance.zt-page--yedek-parca .zt-cross__media img {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 40% 62%;} body.breakdance.zt-page--yedek-parca .zt-cross__text {max-width: 32em; margin-top: var(--zt-sp-5); font-size: var(--zt-fs-md); color: var(--zt-text-2);} body.breakdance.zt-page--yedek-parca .zt-cross__act {display: flex; flex-wrap: wrap; align-items: center; gap: var(--zt-sp-3) var(--zt-sp-8); margin-top: var(--zt-sp-8);} body.breakdance.zt-page--yedek-parca .zt-cross .zt-svc__tel {margin-top: 0;} body.breakdance.zt-page--yedek-parca .zt-file {position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 2px var(--zt-sp-4); min-height: 88px; padding: var(--zt-sp-4) var(--zt-sp-5); border: var(--zt-hair) dashed var(--zt-field); border-radius: var(--zt-r-inner); background: var(--zt-surface);} body.breakdance.zt-page--yedek-parca .zt-file:hover, body.breakdance.zt-page--yedek-parca .zt-file.is-drag {border-color: var(--zt-fume);} body.breakdance.zt-page--yedek-parca .zt-file.is-drag {background: var(--zt-surface-2);} body.breakdance.zt-page--yedek-parca .zt-file:has(.zt-file__input:focus-visible) {outline: var(--zt-stroke) solid var(--zt-fume); outline-offset: var(--zt-hair);} body.breakdance.zt-page--yedek-parca .zt-file:has(.zt-file__input[aria-invalid="true"]) {border-style: solid; border-color: var(--zt-error); box-shadow: inset 0 0 0 var(--zt-hair) var(--zt-error);} body.breakdance.zt-page--yedek-parca .zt-file__input {position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer;} body.breakdance.zt-page--yedek-parca .zt-file__input::file-selector-button {cursor: pointer;} body.breakdance.zt-page--yedek-parca .zt-file__ico {grid-row: span 2; display: grid; place-items: center; width: var(--zt-touch); height: var(--zt-touch); border-radius: var(--zt-r-round); background: var(--zt-bg); color: var(--zt-fume); box-shadow: var(--zt-shadow-seg);} body.breakdance.zt-page--yedek-parca .zt-file__txt {align-self: end; font-size: var(--zt-fs-sm); font-weight: 600; line-height: 1.4;} body.breakdance.zt-page--yedek-parca .zt-file__txt strong {font-weight: 800; color: var(--zt-fume); text-decoration: underline; text-decoration-thickness: var(--zt-hair); text-underline-offset: 3px;} body.breakdance.zt-page--yedek-parca .zt-file__hint {align-self: start; font-size: var(--zt-fs-xs); line-height: 1.45; color: var(--zt-text-2);} body.breakdance.zt-page--yedek-parca .zt-file__list {display: grid; gap: var(--zt-sp-1); margin-top: var(--zt-sp-3); font-size: var(--zt-fs-xs); font-weight: 600;} body.breakdance.zt-page--yedek-parca .zt-file__list li {display: flex; align-items: baseline; gap: var(--zt-sp-2); overflow-wrap: anywhere;} body.breakdance.zt-page--yedek-parca .zt-file__list li::before {content: ""; width: 6px; height: 6px; flex: none; border-radius: var(--zt-r-round); background: var(--zt-fume); transform: translateY(-2px);} body.breakdance.zt-page--yedek-parca .zt-file__list .is-bad {color: var(--zt-error);} body.breakdance.zt-page--yedek-parca .zt-file__list .is-bad::before {background: var(--zt-error);} body.breakdance.zt-page--yedek-parca .zt-file__clear {display: inline-flex; align-items: center; gap: var(--zt-sp-2); min-height: var(--zt-touch); padding: 0; border: 0; background: none; font-size: var(--zt-fs-xs); font-weight: 700; color: var(--zt-fume); cursor: pointer;} body.breakdance.zt-page--yedek-parca .zt-file__clear:hover {text-decoration: underline; text-underline-offset: 3px;} body.breakdance.zt-page--yedek-parca .zt-file__clear + .zt-field__error {margin-top: 0;} html:has(> body.breakdance.zt-page--yedek-parca):not(.zt-js) .zt-offer__open {display: none;} .zt-js body.breakdance.zt-page--yedek-parca .zt-offer__grid {display: block;} .zt-js body.breakdance.zt-page--yedek-parca .zt-offer__intro {display: grid; grid-template: "h act" auto "p act" auto "lines lines" auto / minmax(0, 1fr) auto; align-items: center; column-gap: var(--zt-sp-12);} .zt-js body.breakdance.zt-page--yedek-parca .zt-offer__intro > .zt-h2 {grid-area: h;} .zt-js body.breakdance.zt-page--yedek-parca .zt-offer__text {grid-area: p; max-width: 36em;} body.breakdance.zt-page--yedek-parca .zt-offer__open {grid-area: act;} .zt-js body.breakdance.zt-page--yedek-parca .zt-offer__direct {grid-area: lines; display: flex; flex-wrap: wrap; gap: var(--zt-sp-1) var(--zt-sp-12);} body.breakdance.zt-page--yedek-parca .zt-qp {width: min(520px, 100% - 2 * var(--zt-gutter)); max-width: none; max-height: calc(100dvh - 2 * var(--zt-sp-8)); padding: 0; border: 0; border-radius: var(--zt-r-panel); background: var(--zt-bg); color: var(--zt-text); box-shadow: var(--zt-shadow-pop); overflow: hidden;} body.breakdance.zt-page--yedek-parca .zt-qp--form {width: min(640px, 100% - 2 * var(--zt-gutter));} .zt-lock, .zt-lock body.breakdance.zt-page--yedek-parca {overflow: hidden;} .zt-lock {scrollbar-gutter: stable; background: var(--zt-lock-bg);} body.breakdance.zt-page--yedek-parca .breakdance-popup-open .zt-qp, body.breakdance.zt-page--yedek-parca .zt-qp__form {display: flex; flex-direction: column; min-height: 0;} body.breakdance.zt-page--yedek-parca .zt-qp__head {display: flex; align-items: center; justify-content: space-between; gap: var(--zt-sp-4); padding: var(--zt-sp-5) var(--zt-sp-5) 0 var(--zt-sp-8);} body.breakdance.zt-page--yedek-parca .zt-qp__title {font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} body.breakdance.zt-page--yedek-parca .zt-qp:has(.zt-qp__done:not([hidden])) .zt-qp__title {visibility: hidden;} body.breakdance.zt-page--yedek-parca .zt-qp__x {display: grid; place-items: center; width: var(--zt-touch); height: var(--zt-touch); padding: 0; border: 0; border-radius: var(--zt-r-round); background: var(--zt-surface); color: var(--zt-fume); cursor: pointer;} body.breakdance.zt-page--yedek-parca .zt-qp__body {display: grid; gap: var(--zt-sp-4); padding: var(--zt-sp-1) var(--zt-sp-8) var(--zt-sp-6); overflow: auto; overscroll-behavior: contain;} body.breakdance.zt-page--yedek-parca .zt-qp__lead {margin-bottom: var(--zt-sp-1); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} body.breakdance.zt-page--yedek-parca .zt-qp__m {display: flex; align-items: center; gap: var(--zt-sp-4); padding: var(--zt-sp-2); border-radius: var(--zt-r-inner); background: var(--zt-surface);} body.breakdance.zt-page--yedek-parca .zt-qp__thumb {flex: none; width: var(--zt-sp-16); aspect-ratio: 1; border-radius: calc(var(--zt-r-inner) - var(--zt-sp-2)); background: var(--zt-bg);} body.breakdance.zt-page--yedek-parca .zt-qp__thumb--ico {display: grid; place-items: center; color: var(--zt-fume);} body.breakdance.zt-page--yedek-parca .zt-qp__thumb--ico .zt-icon {width: var(--zt-sp-7); height: var(--zt-sp-7); stroke-width: 1.6;} body.breakdance.zt-page--yedek-parca .zt-qp__m .zt-tag-dt, body.breakdance.zt-page--yedek-parca .zt-qp__m dt {font-size: var(--zt-fs-2xs); font-weight: 700; color: var(--zt-text-2);} body.breakdance.zt-page--yedek-parca .zt-qp__m .zt-tag-dd, body.breakdance.zt-page--yedek-parca .zt-qp__m dd {font-size: var(--zt-fs-md); line-height: 1.3; font-weight: 800;} body.breakdance.zt-page--yedek-parca .zt-qp .zt-form__kvkk {margin: 0;} body.breakdance.zt-page--yedek-parca .zt-qp__foot {padding: var(--zt-sp-4) var(--zt-sp-8) var(--zt-sp-6); border-top: var(--zt-rule);} body.breakdance.zt-page--yedek-parca .zt-qp__done {padding: 0 var(--zt-sp-8) var(--zt-sp-8); overflow: auto;} body.breakdance.zt-page--yedek-parca :where(.zt-qp__done) .zt-btn {margin-top: var(--zt-sp-7); background: none;} @media (prefers-reduced-motion: no-preference) { body.breakdance.zt-page--yedek-parca .zt-part {transition: transform var(--zt-dur-slow) var(--zt-ease);} body.breakdance.zt-page--yedek-parca .zt-part:hover {transform: translateY(-3px);} body.breakdance.zt-page--yedek-parca .zt-part:hover .zt-go .zt-icon {transform: translateX(3px);} body.breakdance.zt-page--yedek-parca .breakdance-popup-open .zt-qp {animation: zt-in 0.32s var(--zt-ease) both;} body.breakdance.zt-page--yedek-parca .zt-qp .zt-btn:active {transition: transform 0.15s var(--zt-ease); transform: scale(0.97);} } @media (max-width: 1024px) { body.breakdance.zt-page--yedek-parca {--zt-yp-lap: 64px; --zt-yp-h1: clamp(2.125rem, 6.4vw, 3.25rem);} body.breakdance.zt-page--yedek-parca .zt-hero--yp {--zt-hero-top: var(--zt-sp-10); --zt-hero-pb: var(--zt-sp-10); --zt-scrim-side: var(--zt-yp-scrim-v);} body.breakdance.zt-page--yedek-parca .zt-parts__panel {padding: var(--zt-sp-6);} body.breakdance.zt-page--yedek-parca .zt-parts__list {grid-template-columns: repeat(6, minmax(0, 1fr));} body.breakdance.zt-page--yedek-parca .zt-part {grid-column: span 2;} body.breakdance.zt-page--yedek-parca .zt-part:nth-child(n + 4) {grid-column: span 3;} body.breakdance.zt-page--yedek-parca .zt-part__ico {margin-bottom: var(--zt-sp-6);} body.breakdance.zt-page--yedek-parca .zt-steps {gap: var(--zt-sp-6);} body.breakdance.zt-page--yedek-parca .zt-steps + .zt-cta {margin-top: var(--zt-sp-12);} body.breakdance.zt-page--yedek-parca .zt-cta__media--photo {border-radius: var(--zt-r-inner);} body.breakdance.zt-page--yedek-parca .zt-cross__grid {gap: var(--zt-sp-8);} body.breakdance.zt-page--yedek-parca .zt-cross__media {aspect-ratio: 1;} } @media (max-width: 767px) { body.breakdance.zt-page--yedek-parca {--zt-yp-lap: var(--zt-sp-6); --zt-yp-h1: clamp(1.875rem, 9vw, 2.25rem);} body.breakdance.zt-page--yedek-parca .zt-hero--yp {--zt-hero-top: var(--zt-sp-5); --zt-hero-pb: var(--zt-sp-6);} body.breakdance.zt-page--yedek-parca .zt-crumbs ol {margin-bottom: var(--zt-sp-3); font-size: var(--zt-fs-3xs); line-height: 1.7;} body.breakdance.zt-page--yedek-parca .zt-parts__panel {padding: var(--zt-sp-5) var(--zt-sp-3) var(--zt-sp-3);} body.breakdance.zt-page--yedek-parca .zt-parts__head {margin: 0 var(--zt-sp-2) var(--zt-sp-4);} body.breakdance.zt-page--yedek-parca .zt-parts__title {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--yedek-parca .zt-parts__list {grid-template-columns: 100%; gap: var(--zt-sp-2);} body.breakdance.zt-page--yedek-parca .zt-part, body.breakdance.zt-page--yedek-parca .zt-part:nth-child(n + 4) {grid-column: auto; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "ico name go" "ico ex go"; align-items: center; column-gap: var(--zt-sp-4); padding: var(--zt-sp-3);} body.breakdance.zt-page--yedek-parca .zt-part__ico {grid-area: ico; width: var(--zt-touch); height: var(--zt-touch); margin: 0;} body.breakdance.zt-page--yedek-parca .zt-part__ico .zt-icon {width: var(--zt-icon); height: var(--zt-icon);} body.breakdance.zt-page--yedek-parca .zt-part__name {grid-area: name; align-self: end; font-size: var(--zt-fs-base);} body.breakdance.zt-page--yedek-parca .zt-part__ex {grid-area: ex; align-self: start; margin-top: 0;} body.breakdance.zt-page--yedek-parca .zt-part .zt-go {grid-area: go; position: static; width: var(--zt-sp-8); height: var(--zt-sp-8);} body.breakdance.zt-page--yedek-parca .zt-steps {grid-template-columns: 100%; gap: var(--zt-sp-5);} body.breakdance.zt-page--yedek-parca .zt-step {display: grid; grid-template-columns: var(--zt-sp-10) minmax(0, 1fr); padding-top: var(--zt-sp-4);} body.breakdance.zt-page--yedek-parca .zt-step__n {grid-row: span 2; padding-top: 6px;} body.breakdance.zt-page--yedek-parca .zt-step__t {margin-top: 0; font-size: var(--zt-fs-lg);} body.breakdance.zt-page--yedek-parca .zt-step__p {margin-top: var(--zt-sp-1);} body.breakdance.zt-page--yedek-parca .zt-steps + .zt-cta {margin-top: var(--zt-sp-10);} body.breakdance.zt-page--yedek-parca .zt-cross__grid {grid-template-columns: 100%;} body.breakdance.zt-page--yedek-parca .zt-cross__media {aspect-ratio: 4 / 3;} body.breakdance.zt-page--yedek-parca .zt-cross__text {font-size: var(--zt-fs-body);} body.breakdance.zt-page--yedek-parca .zt-cross__act {gap: var(--zt-sp-2) var(--zt-sp-6); margin-top: var(--zt-sp-6);} body.breakdance.zt-page--yedek-parca .zt-file {min-height: 0; padding: var(--zt-sp-3) var(--zt-sp-4);} .zt-js body.breakdance.zt-page--yedek-parca .zt-offer__intro {grid-template: "h" auto "p" auto "act" auto "lines" auto / 100%;} body.breakdance.zt-page--yedek-parca .zt-offer__open {margin-top: var(--zt-sp-6);} .zt-js body.breakdance.zt-page--yedek-parca .zt-offer__direct {display: grid;} body.breakdance.zt-page--yedek-parca .zt-qp {inset: auto 0 0; width: 100%; max-height: 92dvh; margin: 0; border-radius: var(--zt-r-panel) var(--zt-r-panel) 0 0; box-shadow: var(--zt-sheet-shadow);} body.breakdance.zt-page--yedek-parca .zt-qp__head {padding: var(--zt-sp-3) var(--zt-sp-3) 0 var(--zt-sp-4);} body.breakdance.zt-page--yedek-parca .zt-qp__title {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--yedek-parca .zt-qp__body {padding-inline: var(--zt-sp-4);} body.breakdance.zt-page--yedek-parca .zt-qp__foot {padding: var(--zt-sp-3) var(--zt-sp-4) calc(var(--zt-sp-3) + env(safe-area-inset-bottom, 0px));} body.breakdance.zt-page--yedek-parca .zt-qp__done {padding: 0 var(--zt-sp-4) calc(var(--zt-sp-5) + env(safe-area-inset-bottom, 0px));} } @media (prefers-reduced-motion: no-preference) and (max-width: 767px) { body.breakdance.zt-page--yedek-parca .breakdance-popup-open .zt-qp {animation-name: zt-sheet-in;} } @media (max-width: 359px) { body.breakdance.zt-page--yedek-parca .zt-part, body.breakdance.zt-page--yedek-parca .zt-part:nth-child(n + 4) {column-gap: var(--zt-sp-3);} body.breakdance.zt-page--yedek-parca .zt-part .zt-go {display: none;} } body.breakdance.zt-page--yedek-parca [hidden] {display: none;} body.breakdance.zt-page--ikinci-el .zt-hero--kat {--zt-scrim-side: linear-gradient(90deg, rgb(20 28 32 / 0.1) 0%, rgb(20 28 32 / 0.16) 18%, rgb(20 28 32 / 0.76) 33%, rgb(20 28 32 / 0.84) 100%);} body.breakdance.zt-page--ikinci-el .zt-hero--kat .zt-hero__grid {grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);} body.breakdance.zt-page--ikinci-el .zt-hero--kat .zt-hero__title {max-width: 13em; font-size: var(--zt-kat-h1);} body.breakdance.zt-page--ikinci-el .zt-hero--kat .zt-hero__lead {max-width: 34em;} body.breakdance.zt-page--ikinci-el .zt-hero--ie .zt-hero__bg {position: absolute; bottom: 0; left: 0; height: 132%; object-position: 50% 100%;} body.breakdance.zt-page--ikinci-el .zt-hero--ie + .zt-section {padding-top: var(--zt-sec);} body.breakdance.zt-page--ikinci-el .zt-crumbs ol {display: flex; flex-wrap: wrap; gap: 0 var(--zt-sp-2); margin: 0 0 var(--zt-sp-5); padding: 0; list-style: none; font-size: var(--zt-fs-2xs); font-weight: 600; color: var(--zt-on-photo-2);} body.breakdance.zt-page--ikinci-el .zt-crumbs li + li::before {content: "/"; margin-right: var(--zt-sp-2);} body.breakdance.zt-page--ikinci-el .zt-crumbs a {display: inline-flex; align-items: center; min-height: var(--zt-touch); margin: calc(-1 * var(--zt-sp-3)) 0;} body.breakdance.zt-page--ikinci-el .zt-crumbs a:hover, body.breakdance.zt-page--ikinci-el .zt-crumbs [aria-current] {color: var(--zt-on-fume);} body.breakdance.zt-page--ikinci-el .zt-ie-tip {background: var(--zt-surface-2);} body.breakdance.zt-page--ikinci-el .zt-tips {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zt-gap);} body.breakdance.zt-page--ikinci-el .zt-tips__item {display: flex;} body.breakdance.zt-page--ikinci-el .zt-tips .zt-tile {grid-template-columns: var(--zt-tip-img) minmax(0, 1fr); grid-template-rows: 1fr 1fr; grid-template-areas: "stage text" "stage act"; align-items: center; column-gap: var(--zt-sp-5); padding: var(--zt-sp-3) var(--zt-sp-5) var(--zt-sp-3) var(--zt-sp-3);} body.breakdance.zt-page--ikinci-el .zt-tips .zt-tile__text {align-self: end; padding: 0;} body.breakdance.zt-page--ikinci-el .zt-tips .zt-tile__meta {display: contents;} body.breakdance.zt-page--ikinci-el .zt-tile__act {grid-area: act; align-self: start; justify-self: start; display: inline-flex; align-items: center; gap: 6px; margin-top: var(--zt-sp-1); font-size: var(--zt-fs-2xs); font-weight: 700; color: var(--zt-fume);} body.breakdance.zt-page--ikinci-el .zt-tile__act .zt-icon {width: var(--zt-icon-sm); height: var(--zt-icon-sm);} body.breakdance.zt-page--ikinci-el .zt-tips .zt-tile__stage {--zt-air: var(--zt-sp-2); --zt-lift: var(--zt-sp-2); min-height: 0; height: var(--zt-tip-img); border-radius: calc(var(--zt-r-panel) - var(--zt-sp-3)); background: var(--zt-surface);} body.breakdance.zt-page--ikinci-el .zt-steps {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zt-sp-10); margin: 0; padding: 0; list-style: none;} body.breakdance.zt-page--ikinci-el .zt-step {position: relative;} body.breakdance.zt-page--ikinci-el .zt-step__n {display: grid; place-items: center; width: var(--zt-step-n); height: var(--zt-step-n); border: var(--zt-stroke) solid var(--zt-fume); border-radius: var(--zt-r-round); font-size: var(--zt-fs-md); font-weight: 800; line-height: 1; color: var(--zt-fume);} body.breakdance.zt-page--ikinci-el .zt-step:not(:last-child)::after {content: ""; position: absolute; top: calc(var(--zt-step-n) / 2); left: calc(var(--zt-step-n) + var(--zt-sp-4)); right: calc(var(--zt-sp-4) - var(--zt-sp-10)); border-top: var(--zt-rule-floor);} body.breakdance.zt-page--ikinci-el .zt-step__t {margin-top: var(--zt-sp-6); font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} body.breakdance.zt-page--ikinci-el .zt-step__p {max-width: 24em; margin-top: var(--zt-sp-3); color: var(--zt-text-2);} body.breakdance.zt-page--ikinci-el .zt-step__p a {font-weight: 700; color: var(--zt-fume); text-decoration: underline; text-decoration-thickness: var(--zt-hair); text-underline-offset: 3px; white-space: nowrap;} body.breakdance.zt-page--ikinci-el .zt-step__p a:hover {color: var(--zt-fume);} body.breakdance.zt-page--ikinci-el .zt-steps + .zt-cta {margin-top: var(--zt-sp-18);} body.breakdance.zt-page--ikinci-el .zt-cta__media--photo {position: relative; overflow: hidden; border-radius: calc(var(--zt-r-panel) - var(--zt-sp-3)); background: var(--zt-surface);} body.breakdance.zt-page--ikinci-el .zt-cta__media--photo img {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%;} body.breakdance.zt-page--ikinci-el .zt-ie-new__grid {display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--zt-sp-18); align-items: start;} body.breakdance.zt-page--ikinci-el .zt-assure {display: grid; gap: var(--zt-sp-3); margin-top: var(--zt-sp-6);} body.breakdance.zt-page--ikinci-el .zt-assure li {display: grid; grid-template-columns: var(--zt-sp-9) minmax(0, 1fr); align-items: center; gap: var(--zt-sp-3); font-size: var(--zt-fs-sm); font-weight: 600; color: var(--zt-text-2);} body.breakdance.zt-page--ikinci-el .zt-assure__ico {display: grid; place-items: center; width: var(--zt-sp-9); height: var(--zt-sp-9); border-radius: var(--zt-r-round); background: var(--zt-bg); color: var(--zt-fume);} body.breakdance.zt-page--ikinci-el .zt-assure .zt-icon {width: 18px; height: 18px;} html:has(> body.breakdance.zt-page--ikinci-el):not(.zt-js) .zt-offer__open {display: none;} .zt-js body.breakdance.zt-page--ikinci-el .zt-offer__grid {display: block;} .zt-js body.breakdance.zt-page--ikinci-el .zt-offer__intro {display: grid; grid-template: "h act" auto "p act" auto "lines lines" auto / minmax(0, 1fr) auto; align-items: center; column-gap: var(--zt-sp-12);} .zt-js body.breakdance.zt-page--ikinci-el .zt-offer__intro > .zt-h2 {grid-area: h;} .zt-js body.breakdance.zt-page--ikinci-el .zt-offer__text {grid-area: p; max-width: 36em;} body.breakdance.zt-page--ikinci-el .zt-offer__open {grid-area: act;} .zt-js body.breakdance.zt-page--ikinci-el .zt-offer__lines {grid-area: lines; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--zt-sp-4) var(--zt-sp-12); margin-top: var(--zt-sp-8); padding-top: var(--zt-sp-7); border-top: var(--zt-rule-floor);} .zt-js body.breakdance.zt-page--ikinci-el .zt-offer__lines > * {margin: 0; padding: 0; border: 0;} .zt-js body.breakdance.zt-page--ikinci-el .zt-offer__lines > .zt-offer__direct {display: flex; flex-wrap: wrap; gap: var(--zt-sp-1) var(--zt-sp-12);} .zt-js body.breakdance.zt-page--ikinci-el .zt-offer__lines > .zt-assure {display: flex; flex-wrap: wrap; gap: var(--zt-sp-3) var(--zt-sp-8);} body.breakdance.zt-page--ikinci-el .zt-qp {width: min(520px, 100% - 2 * var(--zt-gutter)); max-width: none; max-height: calc(100dvh - 2 * var(--zt-sp-8)); padding: 0; border: 0; border-radius: var(--zt-r-panel); background: var(--zt-bg); color: var(--zt-text); box-shadow: var(--zt-shadow-pop); overflow: hidden;} body.breakdance.zt-page--ikinci-el .zt-qp--form {width: min(640px, 100% - 2 * var(--zt-gutter));} .zt-lock, .zt-lock body.breakdance.zt-page--ikinci-el {overflow: hidden;} .zt-lock {scrollbar-gutter: stable; background: var(--zt-lock-bg);} body.breakdance.zt-page--ikinci-el .breakdance-popup-open .zt-qp, body.breakdance.zt-page--ikinci-el .zt-qp__form {display: flex; flex-direction: column; min-height: 0;} body.breakdance.zt-page--ikinci-el .zt-qp__head {display: flex; align-items: center; justify-content: space-between; gap: var(--zt-sp-4); padding: var(--zt-sp-5) var(--zt-sp-5) 0 var(--zt-sp-8);} body.breakdance.zt-page--ikinci-el .zt-qp__title {font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} body.breakdance.zt-page--ikinci-el .zt-qp:has(.zt-qp__done:not([hidden])) .zt-qp__title {visibility: hidden;} body.breakdance.zt-page--ikinci-el .zt-qp__x {display: grid; place-items: center; width: var(--zt-touch); height: var(--zt-touch); padding: 0; border: 0; border-radius: var(--zt-r-round); background: var(--zt-surface); color: var(--zt-fume); cursor: pointer;} body.breakdance.zt-page--ikinci-el .zt-qp__body {display: grid; gap: var(--zt-sp-4); padding: var(--zt-sp-1) var(--zt-sp-8) var(--zt-sp-6); overflow: auto; overscroll-behavior: contain;} body.breakdance.zt-page--ikinci-el .zt-qp__lead {margin-bottom: var(--zt-sp-1); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} body.breakdance.zt-page--ikinci-el .zt-qp__m {display: flex; align-items: center; gap: var(--zt-sp-4); padding: var(--zt-sp-2); border-radius: var(--zt-r-inner); background: var(--zt-surface);} body.breakdance.zt-page--ikinci-el .zt-qp__thumb {flex: none; width: var(--zt-sp-16); aspect-ratio: 1; overflow: hidden; border-radius: calc(var(--zt-r-inner) - var(--zt-sp-2)); background: var(--zt-bg);} body.breakdance.zt-page--ikinci-el .zt-qp__thumb img {width: 100%; height: 100%; object-fit: cover;} body.breakdance.zt-page--ikinci-el .zt-qp__m .zt-tag-dt, body.breakdance.zt-page--ikinci-el .zt-qp__m dt {font-size: var(--zt-fs-2xs); font-weight: 700; color: var(--zt-text-2);} body.breakdance.zt-page--ikinci-el .zt-qp__m .zt-tag-dd, body.breakdance.zt-page--ikinci-el .zt-qp__m dd {font-size: var(--zt-fs-md); line-height: 1.3; font-weight: 800;} body.breakdance.zt-page--ikinci-el .zt-qp .zt-form__kvkk {margin: 0;} body.breakdance.zt-page--ikinci-el .zt-qp__foot {padding: var(--zt-sp-4) var(--zt-sp-8) var(--zt-sp-6); border-top: var(--zt-rule);} body.breakdance.zt-page--ikinci-el .zt-qp__done {padding: 0 var(--zt-sp-8) var(--zt-sp-8); overflow: auto;} body.breakdance.zt-page--ikinci-el :where(.zt-qp__done) .zt-btn {margin-top: var(--zt-sp-7); background: none;} @media (prefers-reduced-motion: no-preference) { body.breakdance.zt-page--ikinci-el .zt-tile:hover .zt-tile__act .zt-icon {transform: translateX(3px);} body.breakdance.zt-page--ikinci-el .breakdance-popup-open .zt-qp {animation: zt-in 0.32s var(--zt-ease) both;} body.breakdance.zt-page--ikinci-el .zt-qp .zt-btn:active {transition: transform 0.15s var(--zt-ease); transform: scale(0.97);} } @media (max-width: 1344px) { body.breakdance.zt-page--ikinci-el {--zt-tip-img: 104px;} } @media (max-width: 1199px) { body.breakdance.zt-page--ikinci-el {--zt-tip-img: 88px;} } @media (max-width: 1024px) { body.breakdance.zt-page--ikinci-el {--zt-hero-top: var(--zt-sp-10); --zt-hero-pb: var(--zt-sp-12); --zt-kat-h1: clamp(2.125rem, 6.4vw, 3.25rem);} body.breakdance.zt-page--ikinci-el .zt-hero--kat {--zt-scrim-side: linear-gradient(180deg, rgb(20 28 32 / 0.86) 0%, rgb(20 28 32 / 0.82) 80%, rgb(20 28 32 / 0.62) 100%);} body.breakdance.zt-page--ikinci-el .zt-hero--kat .zt-hero__grid {grid-template-columns: 100%;} body.breakdance.zt-page--ikinci-el .zt-tips {grid-template-columns: repeat(2, minmax(0, 1fr));} body.breakdance.zt-page--ikinci-el .zt-steps {gap: var(--zt-sp-6);} body.breakdance.zt-page--ikinci-el .zt-step:not(:last-child)::after {right: calc(var(--zt-sp-4) - var(--zt-sp-6));} body.breakdance.zt-page--ikinci-el .zt-step__t {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--ikinci-el .zt-cta__media--photo {border-radius: var(--zt-r-inner);} body.breakdance.zt-page--ikinci-el .zt-ie-new__grid {grid-template-columns: 100%; gap: var(--zt-sp-8);} } @media (max-width: 767px) { body.breakdance.zt-page--ikinci-el {--zt-hero-top: var(--zt-sp-5); --zt-hero-pb: var(--zt-sp-10); --zt-kat-h1: clamp(1.875rem, 9vw, 2.25rem); --zt-tip-img: 72px; --zt-step-n: 40px;} body.breakdance.zt-page--ikinci-el .zt-crumbs ol {margin-bottom: var(--zt-sp-3); font-size: var(--zt-fs-3xs);} body.breakdance.zt-page--ikinci-el .zt-tips {grid-template-columns: 100%;} body.breakdance.zt-page--ikinci-el .zt-tips .zt-tile {column-gap: var(--zt-sp-4); padding: var(--zt-sp-2) var(--zt-sp-4) var(--zt-sp-2) var(--zt-sp-2);} body.breakdance.zt-page--ikinci-el .zt-tips .zt-tile__stage {border-radius: var(--zt-r-inner);} body.breakdance.zt-page--ikinci-el .zt-steps {grid-template-columns: 100%; gap: var(--zt-sp-7);} body.breakdance.zt-page--ikinci-el .zt-step {display: grid; grid-template-columns: var(--zt-step-n) minmax(0, 1fr); align-items: center; column-gap: var(--zt-sp-4);} body.breakdance.zt-page--ikinci-el .zt-step__n {grid-area: 1 / 1;} body.breakdance.zt-page--ikinci-el .zt-step__t {grid-area: 1 / 2; margin: 0;} body.breakdance.zt-page--ikinci-el .zt-step__p {grid-area: 2 / 2; margin-top: var(--zt-sp-1);} body.breakdance.zt-page--ikinci-el .zt-step:not(:last-child)::after {top: calc(var(--zt-step-n) + var(--zt-sp-2)); bottom: calc(var(--zt-sp-2) - var(--zt-sp-7)); left: calc(var(--zt-step-n) / 2); right: auto; border-top: 0; border-left: var(--zt-rule-floor);} body.breakdance.zt-page--ikinci-el .zt-steps + .zt-cta {margin-top: var(--zt-sp-12);} .zt-js body.breakdance.zt-page--ikinci-el .zt-offer__intro {grid-template: "h" auto "p" auto "act" auto "lines" auto / 100%;} body.breakdance.zt-page--ikinci-el .zt-offer__open {margin-top: var(--zt-sp-6);} .zt-js body.breakdance.zt-page--ikinci-el .zt-offer__lines, .zt-js body.breakdance.zt-page--ikinci-el .zt-offer__lines > .zt-offer__direct, .zt-js body.breakdance.zt-page--ikinci-el .zt-offer__lines > .zt-assure {display: grid;} .zt-js body.breakdance.zt-page--ikinci-el .zt-offer__lines {justify-content: stretch; gap: var(--zt-sp-5);} body.breakdance.zt-page--ikinci-el .zt-qp {inset: auto 0 0; width: 100%; max-height: 92dvh; margin: 0; border-radius: var(--zt-r-panel) var(--zt-r-panel) 0 0; box-shadow: var(--zt-sheet-shadow);} body.breakdance.zt-page--ikinci-el .zt-qp__head {padding: var(--zt-sp-3) var(--zt-sp-3) 0 var(--zt-sp-4);} body.breakdance.zt-page--ikinci-el .zt-qp__title {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--ikinci-el .zt-qp__body {padding-inline: var(--zt-sp-4);} body.breakdance.zt-page--ikinci-el .zt-qp__foot {padding: var(--zt-sp-3) var(--zt-sp-4) calc(var(--zt-sp-3) + env(safe-area-inset-bottom, 0px));} body.breakdance.zt-page--ikinci-el .zt-qp__done {padding: 0 var(--zt-sp-4) calc(var(--zt-sp-5) + env(safe-area-inset-bottom, 0px));} } @media (prefers-reduced-motion: no-preference) and (max-width: 767px) { body.breakdance.zt-page--ikinci-el .breakdance-popup-open .zt-qp {animation-name: zt-sheet-in;} } @media (max-width: 359px) { body.breakdance.zt-page--ikinci-el {--zt-tip-img: 64px;} } body.breakdance.zt-page--ikinci-el [hidden] {display: none;} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__media {top: var(--zt-header-h); left: var(--zt-post-photo);} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__media::after {background: var(--zt-post-seam);} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__bg {object-position: 86% 50%;} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__grid {grid-template-columns: minmax(0, 1fr); grid-template-areas: "copy"; min-height: clamp(560px, 44vw, 680px); padding-top: calc(var(--zt-header-h) + var(--zt-sp-12));} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__copy {max-width: 36rem; padding-bottom: var(--zt-sp-16);} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__eyebrow {margin-bottom: var(--zt-sp-4); font-size: var(--zt-fs-2xs); font-weight: 800; letter-spacing: 0.14em; word-spacing: normal; text-transform: uppercase; color: var(--zt-orange);} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__title {max-width: none; font-size: var(--zt-post-h1); line-height: 1.05; letter-spacing: -0.035em;} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__lead {max-width: 32em; margin-top: var(--zt-sp-5); font-size: var(--zt-fs-md);} body.breakdance.zt-page--yazi .zt-meta {display: flex; flex-wrap: wrap; gap: 0 var(--zt-sp-3); margin-top: var(--zt-sp-6); font-size: var(--zt-fs-sm); font-weight: 600; color: var(--zt-on-photo-2);} body.breakdance.zt-page--yazi .zt-meta span + span::before {content: "·"; margin-right: var(--zt-sp-3);} body.breakdance.zt-page--yazi .zt-crumbs ol {display: flex; flex-wrap: wrap; gap: 0 var(--zt-sp-2); margin: 0 0 var(--zt-sp-5); padding: 0; list-style: none; font-size: var(--zt-fs-2xs); font-weight: 600; color: var(--zt-on-photo-2);} body.breakdance.zt-page--yazi .zt-crumbs li + li::before {content: "/"; margin-right: var(--zt-sp-2);} body.breakdance.zt-page--yazi .zt-crumbs a {display: inline-block; padding: var(--zt-sp-3) 0; margin: calc(-1 * var(--zt-sp-3)) 0;} body.breakdance.zt-page--yazi .zt-crumbs a:hover, body.breakdance.zt-page--yazi .zt-crumbs [aria-current] {color: var(--zt-on-fume);} body.breakdance.zt-page--yazi .zt-hero--post .zt-crumbs ol {flex-wrap: nowrap;} body.breakdance.zt-page--yazi .zt-hero--post .zt-crumbs li {flex: none;} body.breakdance.zt-page--yazi .zt-hero--post .zt-crumbs li:last-child {flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} body.breakdance.zt-page--yazi .zt-post {display: grid; grid-template-columns: var(--zt-toc-w) minmax(0, 1fr) var(--zt-rail-w); gap: var(--zt-sp-12); align-items: start;} body.breakdance.zt-page--yazi .zt-post__main {justify-self: center; width: 100%; max-width: var(--zt-art-w);} body.breakdance.zt-page--yazi .zt-toc {position: sticky; top: calc(var(--zt-header-h) + var(--zt-sp-6));} body.breakdance.zt-page--yazi .zt-toc__title, body.breakdance.zt-page--yazi .zt-rail__title, body.breakdance.zt-page--yazi .zt-sum__title {margin-bottom: var(--zt-sp-3); font-size: var(--zt-fs-2xs); font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--zt-text-3);} body.breakdance.zt-page--yazi .zt-toc ol, body.breakdance.zt-page--yazi .zt-toc-m ol {margin: 0; padding: 0; list-style: none;} body.breakdance.zt-page--yazi .zt-toc ol {border-left: var(--zt-rule);} body.breakdance.zt-page--yazi .zt-toc a {display: flex; align-items: center; min-height: var(--zt-touch); margin-left: calc(-1 * var(--zt-hair)); padding: var(--zt-sp-2) 0 var(--zt-sp-2) var(--zt-sp-4); border-left: 3px solid transparent; font-size: var(--zt-fs-xs); line-height: 1.4; color: var(--zt-text-2);} body.breakdance.zt-page--yazi .zt-toc a:hover {color: var(--zt-text-2);} body.breakdance.zt-page--yazi .zt-toc a:hover {color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-toc a[aria-current="true"] {border-left-color: var(--zt-orange); font-weight: 800; color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-toc a[aria-current="true"]:hover {color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-toc-m {display: none; margin-bottom: var(--zt-sp-6); border-block: var(--zt-rule);} body.breakdance.zt-page--yazi .zt-toc-m summary {display: flex; align-items: center; gap: var(--zt-sp-3); min-height: var(--zt-sp-14); font-weight: 800; cursor: pointer; list-style: none;} body.breakdance.zt-page--yazi .zt-toc-m summary::-webkit-details-marker {display: none;} body.breakdance.zt-page--yazi .zt-toc-m summary span {margin-right: auto; font-weight: 500; color: var(--zt-text-2);} body.breakdance.zt-page--yazi .zt-toc-m summary .zt-icon {color: var(--zt-fume);} body.breakdance.zt-page--yazi .zt-toc-m[open] summary .zt-icon {transform: rotate(180deg);} body.breakdance.zt-page--yazi .zt-toc-m ol {padding-bottom: var(--zt-sp-3);} body.breakdance.zt-page--yazi .zt-toc-m a {display: flex; align-items: center; min-height: var(--zt-touch); color: var(--zt-text-2);} body.breakdance.zt-page--yazi .zt-toc-m a:hover {color: var(--zt-text-2);} body.breakdance.zt-page--yazi .zt-art {display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--zt-sp-5); font-size: var(--zt-fs-md); line-height: 1.75; color: var(--zt-text-2);} body.breakdance.zt-page--yazi .zt-art > h2 {margin-top: var(--zt-sp-10); font-size: var(--zt-art-h2); line-height: 1.15; font-weight: 800; letter-spacing: -0.025em; color: var(--zt-text); text-wrap: balance;} body.breakdance.zt-page--yazi .zt-art > h3 {margin-top: var(--zt-sp-3); font-size: var(--zt-fs-lg); line-height: 1.3; font-weight: 800; letter-spacing: -0.012em; color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-art > ul:not([class]) {display: grid; gap: var(--zt-sp-2); padding-left: 1.25em; list-style: disc;} body.breakdance.zt-page--yazi .zt-art > ul:not([class]) li::marker {color: var(--zt-quiet);} body.breakdance.zt-page--yazi .zt-art :is(p, .zt-tag-dd) > a, body.breakdance.zt-page--yazi .zt-art :is(p, dd) > a {font-weight: 700; color: var(--zt-fume); text-decoration: underline; text-decoration-thickness: var(--zt-hair); text-underline-offset: 3px;} body.breakdance.zt-page--yazi .zt-art :is(p, .zt-tag-dd) > a:hover {color: var(--zt-fume);} body.breakdance.zt-page--yazi .zt-sum {display: grid; gap: var(--zt-sp-2); margin-bottom: var(--zt-sp-2); padding: var(--zt-sp-7); border-radius: var(--zt-r-panel); background: var(--zt-surface); font-size: var(--zt-fs-body); line-height: 1.55; color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-sum ul, body.breakdance.zt-page--yazi .zt-checks {display: grid; gap: var(--zt-sp-3);} body.breakdance.zt-page--yazi .zt-sum li, body.breakdance.zt-page--yazi .zt-checks li {display: grid; grid-template-columns: var(--zt-dot) minmax(0, 1fr); gap: var(--zt-sp-3); align-items: start;} body.breakdance.zt-page--yazi .zt-dot {display: grid; place-items: center; width: var(--zt-dot); height: var(--zt-dot); margin-top: 1px; border-radius: var(--zt-r-round); background: var(--zt-orange); color: var(--zt-on-orange);} body.breakdance.zt-page--yazi .zt-dot .zt-icon {width: 14px; height: 14px; stroke-width: 2.6;} body.breakdance.zt-page--yazi .zt-checks {font-size: var(--zt-fs-body); line-height: 1.55; color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-checks .zt-dot {background: var(--zt-surface-2); color: var(--zt-fume);} body.breakdance.zt-page--yazi .zt-dl {border-top: var(--zt-rule);} body.breakdance.zt-page--yazi .zt-dl > div {display: grid; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); gap: var(--zt-sp-5); padding-block: var(--zt-sp-4); border-bottom: var(--zt-rule);} body.breakdance.zt-page--yazi .zt-dl .zt-tag-dt, body.breakdance.zt-page--yazi .zt-dl dt {font-weight: 800; line-height: 1.5; color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-dl .zt-tag-dd, body.breakdance.zt-page--yazi .zt-dl dd {font-size: var(--zt-fs-body); line-height: 1.65;} body.breakdance.zt-page--yazi .zt-tbl {margin-block: var(--zt-sp-1);} body.breakdance.zt-page--yazi .zt-tbl table, body.breakdance.zt-page--yazi .zt-tbl tbody, body.breakdance.zt-page--yazi .zt-tbl tr, body.breakdance.zt-page--yazi .zt-tbl th, body.breakdance.zt-page--yazi .zt-tbl td {display: block;} body.breakdance.zt-page--yazi .zt-tbl thead {position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0);} body.breakdance.zt-page--yazi .zt-tbl tbody {display: grid; gap: var(--zt-sp-3);} body.breakdance.zt-page--yazi .zt-tbl tr {display: grid; grid-template-columns: minmax(0, 9rem) minmax(0, 1fr); grid-template-areas: "name pro" "use con"; gap: var(--zt-sp-3) var(--zt-sp-6); padding: var(--zt-sp-5) var(--zt-sp-6); border: var(--zt-rule); border-radius: var(--zt-r-panel); font-size: var(--zt-fs-sm); line-height: 1.55; text-align: left;} body.breakdance.zt-page--yazi .zt-tbl tbody th {grid-area: name; font-size: var(--zt-fs-lg); line-height: 1.3; font-weight: 800; color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-tbl td:nth-of-type(1) {grid-area: pro;} body.breakdance.zt-page--yazi .zt-tbl td:nth-of-type(2) {grid-area: con;} body.breakdance.zt-page--yazi .zt-tbl td:nth-of-type(3) {grid-area: use;} body.breakdance.zt-page--yazi .zt-tbl td::before {content: attr(data-label); display: block; margin-bottom: 2px; font-size: var(--zt-fs-3xs); font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--zt-text-3);} body.breakdance.zt-page--yazi .zt-pair {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--zt-sp-4); margin-block: var(--zt-sp-2);} body.breakdance.zt-page--yazi .zt-pair img {width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--zt-r-panel); background: var(--zt-surface);} body.breakdance.zt-page--yazi .zt-pair figcaption {margin-top: var(--zt-sp-2); font-size: var(--zt-fs-xs); line-height: 1.5; color: var(--zt-text-3);} body.breakdance.zt-page--yazi .zt-art > .zt-cta {margin-block: var(--zt-sp-4) var(--zt-sp-2); line-height: 1.5; color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-author {display: flex; align-items: center; gap: var(--zt-sp-4); margin-top: var(--zt-sp-12); padding-top: var(--zt-sp-6); border-top: var(--zt-rule); font-size: var(--zt-fs-sm); line-height: 1.5; color: var(--zt-text-2);} body.breakdance.zt-page--yazi .zt-author strong {display: block; font-size: var(--zt-fs-body); font-weight: 800; color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-mono {display: grid; place-items: center; flex: none; width: var(--zt-avatar); height: var(--zt-avatar); border-radius: var(--zt-r-round); background: var(--zt-fume); color: var(--zt-on-fume); font-size: var(--zt-fs-xs); font-weight: 800; letter-spacing: 0.04em;} body.breakdance.zt-page--yazi .zt-rail {position: sticky; top: min(calc(var(--zt-header-h) + var(--zt-sp-6)), var(--zt-fit, 100vh)); display: grid; gap: var(--zt-sp-6);} body.breakdance.zt-page--yazi .zt-rail__list {border-top: var(--zt-rule);} body.breakdance.zt-page--yazi .zt-rail__item {position: relative; display: grid; grid-template-columns: var(--zt-rail-img) minmax(0, 1fr); grid-template-rows: 1fr 1fr; column-gap: var(--zt-sp-4); padding: var(--zt-sp-3) 0; border-bottom: var(--zt-rule);} body.breakdance.zt-page--yazi .zt-rail__stage {grid-row: 1 / -1; width: var(--zt-rail-img); aspect-ratio: 1; border-radius: var(--zt-r-inner);} body.breakdance.zt-page--yazi .zt-rail__name {align-self: end; font-size: var(--zt-fs-body); font-weight: 800; line-height: 1.3; letter-spacing: -0.01em; color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-rail__name a::after {content: ""; position: absolute; inset: 0;} body.breakdance.zt-page--yazi .zt-rail__name a:focus-visible {outline: none;} body.breakdance.zt-page--yazi .zt-rail__item:has(a:focus-visible) {outline: var(--zt-stroke) solid var(--zt-fume); outline-offset: 2px; border-radius: var(--zt-r-inner);} body.breakdance.zt-page--yazi .zt-rail__spec {align-self: start; margin-top: 2px; font-size: var(--zt-fs-2xs); line-height: 1.4; color: var(--zt-text-2);} body.breakdance.zt-page--yazi .zt-rail__cta {display: grid; gap: var(--zt-sp-3); padding: var(--zt-sp-7) var(--zt-sp-6) var(--zt-sp-6); border-radius: var(--zt-r-panel); background: var(--zt-fume-deep); color: var(--zt-on-fume);} body.breakdance.zt-page--yazi .zt-rail__q {font-size: var(--zt-fs-lg); line-height: 1.25; font-weight: 800; letter-spacing: -0.015em;} body.breakdance.zt-page--yazi .zt-rail__lead {margin-bottom: var(--zt-sp-2); font-size: var(--zt-fs-sm); line-height: 1.55; color: var(--zt-on-photo-2);} body.breakdance.zt-page--yazi .zt-rail__cta :focus-visible {outline-color: var(--zt-on-fume);} body.breakdance.zt-page--yazi .zt-rail__cta .zt-btn {width: 100%;} body.breakdance.zt-page--yazi .zt-post-faq {background: var(--zt-surface);} body.breakdance.zt-page--yazi .zt-pgrid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zt-sp-6);} body.breakdance.zt-page--yazi .zt-pcard {position: relative; display: grid; align-content: start; gap: var(--zt-sp-4);} body.breakdance.zt-page--yazi .zt-pcard__media {overflow: hidden; border-radius: var(--zt-r-panel); background: var(--zt-surface);} body.breakdance.zt-page--yazi .zt-pcard__media img {width: 100%; aspect-ratio: 3 / 2; object-fit: cover;} body.breakdance.zt-page--yazi .zt-pcard__body {display: grid; gap: var(--zt-sp-2);} body.breakdance.zt-page--yazi .zt-pcard__date {font-size: var(--zt-fs-xs); font-weight: 600; color: var(--zt-text-3);} body.breakdance.zt-page--yazi .zt-pcard__title {font-size: var(--zt-fs-lg); line-height: 1.3; font-weight: 800; letter-spacing: -0.012em; text-wrap: balance;} body.breakdance.zt-page--yazi .zt-pcard__title a::after {content: ""; position: absolute; inset: 0;} body.breakdance.zt-page--yazi .zt-pcard__title a:focus-visible {outline: none;} body.breakdance.zt-page--yazi .zt-pcard:has(a:focus-visible) {outline: var(--zt-stroke) solid var(--zt-fume); outline-offset: 6px; border-radius: var(--zt-r-panel);} .zt-lock, .zt-lock body.breakdance.zt-page--yazi {overflow: hidden;} .zt-lock {scrollbar-gutter: stable; background: var(--zt-lock-bg);} body.breakdance.zt-page--yazi .zt-qp {width: min(520px, 100% - 2 * var(--zt-gutter)); max-width: none; max-height: calc(100dvh - 2 * var(--zt-sp-8)); padding: 0; border: 0; border-radius: var(--zt-r-panel); background: var(--zt-bg); color: var(--zt-text); box-shadow: var(--zt-shadow-pop); overflow: hidden;} body.breakdance.zt-page--yazi .breakdance-popup-open .zt-qp, body.breakdance.zt-page--yazi .zt-qp__form {display: flex; flex-direction: column; min-height: 0;} body.breakdance.zt-page--yazi .zt-qp__head {display: flex; align-items: center; justify-content: space-between; gap: var(--zt-sp-4); padding: var(--zt-sp-5) var(--zt-sp-5) 0 var(--zt-sp-8);} body.breakdance.zt-page--yazi .zt-qp__title {font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} body.breakdance.zt-page--yazi .zt-qp:has(.zt-qp__done:not([hidden])) .zt-qp__title {visibility: hidden;} body.breakdance.zt-page--yazi .zt-qp__x {display: grid; place-items: center; width: var(--zt-touch); height: var(--zt-touch); padding: 0; border: 0; border-radius: var(--zt-r-round); background: var(--zt-surface); color: var(--zt-fume); cursor: pointer;} body.breakdance.zt-page--yazi .zt-qp__body {display: grid; gap: var(--zt-sp-4); padding: var(--zt-sp-1) var(--zt-sp-8) var(--zt-sp-6); overflow: auto; overscroll-behavior: contain;} body.breakdance.zt-page--yazi .zt-qp__lead {margin-bottom: var(--zt-sp-1); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} body.breakdance.zt-page--yazi .zt-qp .zt-form__kvkk {margin: 0;} body.breakdance.zt-page--yazi .zt-qp__foot {padding: var(--zt-sp-4) var(--zt-sp-8) var(--zt-sp-6); border-top: var(--zt-rule);} body.breakdance.zt-page--yazi .zt-qp__done {padding: 0 var(--zt-sp-8) var(--zt-sp-8); overflow: auto;} body.breakdance.zt-page--yazi :where(.zt-qp__done) .zt-btn {margin-top: var(--zt-sp-7); background: none;} @media (prefers-reduced-motion: no-preference) { body.breakdance.zt-page--yazi .zt-toc-m summary .zt-icon {transition: transform var(--zt-dur-fast) var(--zt-ease);} body.breakdance.zt-page--yazi .zt-pcard__media img {transition: transform var(--zt-dur-slow) var(--zt-ease);} body.breakdance.zt-page--yazi .zt-pcard:hover .zt-pcard__media img {transform: scale(1.04);} body.breakdance.zt-page--yazi .zt-rail__item:hover .zt-stage img {transform: translate(-50%, var(--ft)) scale(1.06);} body.breakdance.zt-page--yazi .breakdance-popup-open .zt-qp {animation: zt-in 0.32s var(--zt-ease) both;} body.breakdance.zt-page--yazi .zt-qp .zt-btn:active {transition: transform 0.15s var(--zt-ease); transform: scale(0.97);} } @media (min-width: 1025px) { body.breakdance.zt-page--yazi .zt-art .zt-cta--slim {grid-template: "ico title" auto "ico lead" auto ". act" auto / auto minmax(0, 1fr); row-gap: var(--zt-sp-1);} body.breakdance.zt-page--yazi .zt-art .zt-cta--slim > .zt-cta__body {display: contents;} body.breakdance.zt-page--yazi .zt-art .zt-cta--slim .zt-cta__title {grid-area: title;} body.breakdance.zt-page--yazi .zt-art .zt-cta--slim .zt-cta__lead {grid-area: lead; margin: 0;} body.breakdance.zt-page--yazi .zt-art .zt-cta--slim > .zt-cta__act {grid-area: act; justify-content: start; padding-top: var(--zt-sp-4);} body.breakdance.zt-page--yazi .zt-art .zt-cta__ico {grid-area: ico; align-self: start;} body.breakdance.zt-page--yazi .zt-art .zt-cta__more {justify-self: start;} } @media (max-width: 1279px) { body.breakdance.zt-page--yazi .zt-post {grid-template-columns: minmax(0, 1fr) var(--zt-rail-w);} body.breakdance.zt-page--yazi .zt-post__main {justify-self: start;} body.breakdance.zt-page--yazi .zt-toc {display: none;} body.breakdance.zt-page--yazi .zt-toc-m {display: block;} } @media (max-width: 1199px) { body.breakdance.zt-page--yazi {--zt-post-photo: 48%;} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__copy {max-width: 33rem;} } @media (max-width: 1024px) { .zt-js body.breakdance.zt-page--yazi:has(.zt-hero) .zt-header:not(.is-solid) {color: var(--zt-text); --zt-hover: var(--zt-surface-2); --zt-ring: var(--zt-fume);} .zt-js body.breakdance.zt-page--yazi:has(.zt-hero) .zt-header:not(.is-solid)::before {opacity: 1;} .zt-js body.breakdance.zt-page--yazi:has(.zt-hero) .zt-header:not(.is-solid)::after {opacity: 0;} .zt-js body.breakdance.zt-page--yazi:has(.zt-hero) .zt-header:not(.is-solid) :focus-visible {outline-color: var(--zt-fume);} .zt-js body.breakdance.zt-page--yazi:has(.zt-hero) .zt-header:not(.is-solid) .zt-logo--dark {display: block;} .zt-js body.breakdance.zt-page--yazi:has(.zt-hero) .zt-header:not(.is-solid) .zt-logo--light {display: none;} body.breakdance.zt-page--yazi .zt-hero--post {display: flex; flex-direction: column-reverse; padding-bottom: var(--zt-sp-10); background: var(--zt-surface);} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__media {position: relative; inset: auto; z-index: 0; width: min(100% - 2 * var(--zt-gutter), var(--zt-max)); margin-inline: auto; aspect-ratio: 16 / 9; border-radius: var(--zt-r-panel);} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__media::after {content: none;} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__grid {min-height: 0; padding-top: calc(var(--zt-header-h) + var(--zt-sp-8));} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__copy {max-width: 46rem; padding-bottom: var(--zt-sp-8); color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__copy :focus-visible {outline-color: var(--zt-fume);} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__eyebrow {color: var(--zt-text-3);} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__lead, body.breakdance.zt-page--yazi .zt-hero--post .zt-meta, body.breakdance.zt-page--yazi .zt-hero--post .zt-crumbs ol {color: var(--zt-text-2);} body.breakdance.zt-page--yazi .zt-hero--post .zt-crumbs a:hover, body.breakdance.zt-page--yazi .zt-hero--post .zt-crumbs [aria-current] {color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-post {grid-template-columns: minmax(0, 1fr); gap: var(--zt-sp-12);} body.breakdance.zt-page--yazi .zt-rail {position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: var(--zt-sp-8);} body.breakdance.zt-page--yazi .zt-pgrid {gap: var(--zt-sp-5);} } @media (max-width: 767px) { body.breakdance.zt-page--yazi {--zt-post-h1: clamp(1.875rem, 8.2vw, 2.25rem); --zt-art-h2: clamp(1.5rem, 6.6vw, 1.75rem); --zt-rail-img: 64px;} body.breakdance.zt-page--yazi .zt-hero--post {padding-bottom: var(--zt-sp-6);} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__media {aspect-ratio: 4 / 3;} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__grid {padding-top: calc(var(--zt-header-h) + var(--zt-sp-5));} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__copy {padding-bottom: var(--zt-sp-6);} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__eyebrow {margin-bottom: var(--zt-sp-3);} body.breakdance.zt-page--yazi .zt-hero--post .zt-hero__lead {margin-top: var(--zt-sp-4); font-size: var(--zt-fs-body);} body.breakdance.zt-page--yazi .zt-meta {margin-top: var(--zt-sp-4); font-size: var(--zt-fs-xs);} body.breakdance.zt-page--yazi .zt-crumbs ol {margin-bottom: var(--zt-sp-3); font-size: var(--zt-fs-3xs);} body.breakdance.zt-page--yazi .zt-art {font-size: var(--zt-fs-body); line-height: 1.7;} body.breakdance.zt-page--yazi .zt-art > h2 {margin-top: var(--zt-sp-8);} body.breakdance.zt-page--yazi .zt-sum {padding: var(--zt-sp-5);} body.breakdance.zt-page--yazi .zt-dl > div {grid-template-columns: minmax(0, 1fr); gap: var(--zt-sp-1);} body.breakdance.zt-page--yazi .zt-pair {grid-template-columns: minmax(0, 1fr); gap: var(--zt-sp-5);} body.breakdance.zt-page--yazi .zt-tbl tr {grid-template-columns: minmax(0, 1fr); grid-template-areas: "name" "pro" "con" "use"; gap: 0; padding: var(--zt-sp-4) var(--zt-sp-5) var(--zt-sp-2);} body.breakdance.zt-page--yazi .zt-tbl tbody th {padding-bottom: var(--zt-sp-2);} body.breakdance.zt-page--yazi .zt-tbl td {padding-block: var(--zt-sp-2); border-top: var(--zt-rule);} body.breakdance.zt-page--yazi .zt-author {margin-top: var(--zt-sp-10);} body.breakdance.zt-page--yazi .zt-rail {grid-template-columns: minmax(0, 1fr); gap: var(--zt-sp-6);} body.breakdance.zt-page--yazi .zt-rail__cta {padding: var(--zt-sp-6) var(--zt-sp-5) var(--zt-sp-5);} body.breakdance.zt-page--yazi .zt-pgrid {grid-template-columns: minmax(0, 1fr); gap: 0; border-top: var(--zt-rule);} body.breakdance.zt-page--yazi .zt-pcard {grid-template-columns: 112px minmax(0, 1fr); align-items: center; gap: var(--zt-sp-4); padding-block: var(--zt-sp-4); border-bottom: var(--zt-rule);} body.breakdance.zt-page--yazi .zt-pcard__media {border-radius: var(--zt-r-inner);} body.breakdance.zt-page--yazi .zt-pcard__media img {aspect-ratio: 1;} body.breakdance.zt-page--yazi .zt-pcard__body {gap: var(--zt-sp-1);} body.breakdance.zt-page--yazi .zt-pcard__title {font-size: var(--zt-fs-base);} body.breakdance.zt-page--yazi .zt-pcard:has(a:focus-visible) {outline-offset: 2px; border-radius: var(--zt-r-inner);} body.breakdance.zt-page--yazi .zt-qp {inset: auto 0 0; width: 100%; max-height: 92dvh; margin: 0; border-radius: var(--zt-r-panel) var(--zt-r-panel) 0 0; box-shadow: var(--zt-sheet-shadow);} body.breakdance.zt-page--yazi .zt-qp__head {padding: var(--zt-sp-3) var(--zt-sp-3) 0 var(--zt-sp-4);} body.breakdance.zt-page--yazi .zt-qp__title {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--yazi .zt-qp__body {padding-inline: var(--zt-sp-4);} body.breakdance.zt-page--yazi .zt-qp__foot {padding: var(--zt-sp-3) var(--zt-sp-4) calc(var(--zt-sp-3) + env(safe-area-inset-bottom, 0px));} body.breakdance.zt-page--yazi .zt-qp__done {padding: 0 var(--zt-sp-4) calc(var(--zt-sp-5) + env(safe-area-inset-bottom, 0px));} } @media (prefers-reduced-motion: no-preference) and (max-width: 767px) { body.breakdance.zt-page--yazi .breakdance-popup-open .zt-qp {animation-name: zt-sheet-in;} } @media (max-width: 359px) { body.breakdance.zt-page--yazi .zt-meta {font-size: var(--zt-fs-2xs);} body.breakdance.zt-page--yazi .zt-sum, body.breakdance.zt-page--yazi .zt-rail__cta {padding: var(--zt-sp-4);} body.breakdance.zt-page--yazi .zt-pcard {grid-template-columns: 88px minmax(0, 1fr);} } body.breakdance.zt-page--yazi [hidden] {display: none;} body.breakdance.zt-page--yazi .zt-art > .zt-figure {margin-block: var(--zt-sp-2);} body.breakdance.zt-page--yazi .zt-art > .zt-figure img {width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--zt-r-panel); background: var(--zt-surface);} body.breakdance.zt-page--yazi .zt-art > .zt-figure figcaption {margin-top: var(--zt-sp-2); font-size: var(--zt-fs-xs); line-height: 1.5; color: var(--zt-text-3);} body.breakdance.zt-page--yazi .zt-lhead {padding-block: var(--zt-sp-12); border-top: 0;} body.breakdance.zt-page--yazi .zt-lhead .zt-crumbs ol {color: var(--zt-text-2);} body.breakdance.zt-page--yazi .zt-lhead .zt-crumbs a:hover, body.breakdance.zt-page--yazi .zt-lhead .zt-crumbs [aria-current] {color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-lhead__title {max-width: 16em; font-size: var(--zt-fs-h1); line-height: 1.02; font-weight: 800; letter-spacing: -0.035em; color: var(--zt-text); text-wrap: balance;} body.breakdance.zt-page--yazi .zt-lhead__lead {max-width: 38em; margin-top: var(--zt-sp-5); font-size: var(--zt-fs-md); line-height: 1.6; color: var(--zt-text-2);} body.breakdance.zt-page--yazi .zt-topics {display: flex; flex-wrap: wrap; gap: var(--zt-sp-2); margin-top: var(--zt-sp-8);} body.breakdance.zt-page--yazi .zt-topics a {display: inline-flex; align-items: center; min-height: var(--zt-touch); padding: 0 var(--zt-sp-4); border: var(--zt-hair) solid var(--zt-line); border-radius: var(--zt-r-pill); font-size: var(--zt-fs-sm); font-weight: 600; color: var(--zt-text-2); white-space: nowrap;} body.breakdance.zt-page--yazi .zt-topics a:hover {color: var(--zt-text-2);} body.breakdance.zt-page--yazi .zt-topics a:hover {border-color: var(--zt-field); color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-topics a[aria-current] {background: var(--zt-fume); border-color: var(--zt-fume); color: var(--zt-on-fume);} body.breakdance.zt-page--yazi .zt-topics a[aria-current]:hover {color: var(--zt-on-fume);} body.breakdance.zt-page--yazi .zt-list {padding-top: 0; border-top: 0;} body.breakdance.zt-page--yazi .zt-list .zt-pgrid {row-gap: var(--zt-sp-12);} body.breakdance.zt-page--yazi .zt-pcard__text {display: -webkit-box; overflow: hidden; font-size: var(--zt-fs-sm); line-height: 1.6; color: var(--zt-text-2); -webkit-line-clamp: 3; -webkit-box-orient: vertical;} body.breakdance.zt-page--yazi .zt-pager {margin-top: var(--zt-sp-16);} body.breakdance.zt-page--yazi .zt-pager ul {display: flex; flex-wrap: wrap; justify-content: center; gap: var(--zt-sp-2);} body.breakdance.zt-page--yazi .zt-pager .page-numbers {display: inline-flex; align-items: center; justify-content: center; min-width: var(--zt-touch); min-height: var(--zt-touch); padding: 0 var(--zt-sp-4); border: var(--zt-hair) solid var(--zt-line); border-radius: var(--zt-r-pill); font-size: var(--zt-fs-sm); font-weight: 700; color: var(--zt-text-2);} body.breakdance.zt-page--yazi .zt-pager a.page-numbers:hover {border-color: var(--zt-field); color: var(--zt-text);} body.breakdance.zt-page--yazi .zt-pager .page-numbers.current {background: var(--zt-fume); border-color: var(--zt-fume); color: var(--zt-on-fume);} body.breakdance.zt-page--yazi .zt-pager .page-numbers.dots {min-width: 0; padding: 0; border-color: transparent;} body.breakdance.zt-page--yazi .zt-legal__date {margin-top: var(--zt-sp-4); font-size: var(--zt-fs-xs); font-weight: 600; color: var(--zt-text-3);} body.breakdance.zt-page--yazi .zt-legal {padding-top: 0; border-top: 0;} body.breakdance.zt-page--yazi .zt-legal__text {max-width: 46rem;} body.breakdance.zt-page--yazi .zt-legal__text > h2:first-child {margin-top: 0;} @media (max-width: 1024px) { body.breakdance.zt-page--yazi .zt-lhead {padding-block: var(--zt-sp-10);} body.breakdance.zt-page--yazi .zt-list .zt-pgrid {grid-template-columns: repeat(2, minmax(0, 1fr));} } @media (max-width: 767px) { body.breakdance.zt-page--yazi .zt-lhead {padding-block: var(--zt-sp-8);} body.breakdance.zt-page--yazi .zt-lhead__lead {font-size: var(--zt-fs-body);} body.breakdance.zt-page--yazi .zt-topics {flex-wrap: nowrap; margin-inline: calc(-1 * var(--zt-gutter)); padding-inline: var(--zt-gutter); overflow-x: auto; scrollbar-width: none;} body.breakdance.zt-page--yazi .zt-list .zt-pgrid {grid-template-columns: minmax(0, 1fr); row-gap: 0;} body.breakdance.zt-page--yazi .zt-pcard__text {display: none;} body.breakdance.zt-page--yazi .zt-pcard:not(:has(.zt-pcard__media)) .zt-pcard__body {grid-column: 1 / -1;} body.breakdance.zt-page--yazi .zt-pager {margin-top: var(--zt-sp-10);} } body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__media::after {background: var(--zt-hk-top);} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__bg {object-position: 50% 30%;} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__grid {grid-template-columns: minmax(0, 1fr); grid-template-areas: "copy"; min-height: var(--zt-hk-h); padding-top: calc(var(--zt-header-h) + var(--zt-sp-12));} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__copy {position: relative; max-width: 34rem; padding-bottom: var(--zt-sp-16);} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__copy::before {content: ""; position: absolute; z-index: -1; top: calc(-1 * var(--zt-hk-fade-y)); right: calc(-1 * var(--zt-hk-fade-x)); bottom: 0; left: -50vw; background: var(--zt-hk-scrim); -webkit-mask-image: linear-gradient(0deg, black calc(100% - var(--zt-hk-fade-y)), transparent); mask-image: linear-gradient(0deg, black calc(100% - var(--zt-hk-fade-y)), transparent);} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__title {max-width: none; font-size: var(--zt-hk-h1); line-height: 1; letter-spacing: -0.04em;} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__lead {max-width: 27em; margin-top: var(--zt-sp-5);} body.breakdance.zt-page--hakkimizda .zt-hero--hk + .zt-section {padding-top: var(--zt-sec);} body.breakdance.zt-page--hakkimizda .zt-crumbs ol {display: flex; flex-wrap: wrap; gap: 0 var(--zt-sp-2); margin: 0 0 var(--zt-sp-5); padding: 0; list-style: none; font-size: var(--zt-fs-2xs); font-weight: 600; color: var(--zt-on-photo-2);} body.breakdance.zt-page--hakkimizda .zt-crumbs li + li::before {content: "/"; margin-right: var(--zt-sp-2);} body.breakdance.zt-page--hakkimizda .zt-crumbs a {display: inline-flex; align-items: center; min-height: var(--zt-touch); margin: calc(-1 * var(--zt-sp-3)) 0;} body.breakdance.zt-page--hakkimizda .zt-crumbs a:hover, body.breakdance.zt-page--hakkimizda .zt-crumbs [aria-current] {color: var(--zt-on-fume);} body.breakdance.zt-page--hakkimizda .zt-hk-who__grid {display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--zt-sp-6) var(--zt-sp-18); align-items: start;} body.breakdance.zt-page--hakkimizda .zt-hk-who__head .zt-h2 {max-width: 11em;} body.breakdance.zt-page--hakkimizda .zt-hk-who__text {display: grid; gap: var(--zt-sp-5); max-width: 40em; padding-top: var(--zt-sp-9); font-size: var(--zt-fs-md); color: var(--zt-text-2);} body.breakdance.zt-page--hakkimizda .zt-tl {position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--zt-sp-8); margin: var(--zt-sp-22) 0 0; padding: 0; list-style: none;} body.breakdance.zt-page--hakkimizda .zt-tl::before {content: ""; position: absolute; top: var(--zt-tl-y); right: 0; left: 0; border-top: var(--zt-rule-floor);} body.breakdance.zt-page--hakkimizda .zt-tl__item {position: relative;} body.breakdance.zt-page--hakkimizda .zt-tl__item::before {content: ""; position: absolute; top: calc(var(--zt-tl-y) - var(--zt-tl-dot) / 2); left: 0; width: var(--zt-tl-dot); height: var(--zt-tl-dot); border: var(--zt-stroke) solid var(--zt-fume); border-radius: var(--zt-r-round); background: var(--zt-bg);} body.breakdance.zt-page--hakkimizda .zt-tl__item:last-child::before {background: var(--zt-fume);} body.breakdance.zt-page--hakkimizda .zt-tl__year {font-size: var(--zt-fs-stat); line-height: 1; font-weight: 800; letter-spacing: -0.035em; color: var(--zt-fume); font-variant-numeric: tabular-nums;} body.breakdance.zt-page--hakkimizda .zt-tl__title {margin-top: var(--zt-sp-12); font-size: var(--zt-fs-lg); line-height: 1.25; font-weight: 800; letter-spacing: -0.015em;} body.breakdance.zt-page--hakkimizda .zt-tl__text {max-width: 17em; margin-top: var(--zt-sp-2); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} body.breakdance.zt-page--hakkimizda .zt-hk-what {background: var(--zt-surface-2);} body.breakdance.zt-page--hakkimizda .zt-hk-cards {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zt-gap);} body.breakdance.zt-page--hakkimizda .zt-hk-card {display: flex; flex-direction: column; padding: var(--zt-sp-3); border-radius: var(--zt-r-panel); background: var(--zt-bg);} body.breakdance.zt-page--hakkimizda .zt-hk-card__media {--zt-ratio: 0.75; aspect-ratio: 4 / 3; overflow: hidden; border-radius: calc(var(--zt-r-panel) - var(--zt-sp-3)); background: var(--zt-surface);} body.breakdance.zt-page--hakkimizda .zt-hk-card__media--photo img {width: 100%; height: 100%; object-fit: cover;} body.breakdance.zt-page--hakkimizda .zt-hk-card__body {flex: 1; display: flex; flex-direction: column; padding: var(--zt-sp-6) var(--zt-sp-4) 0;} body.breakdance.zt-page--hakkimizda .zt-hk-card__title {font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} body.breakdance.zt-page--hakkimizda .zt-hk-card__text {margin-top: var(--zt-sp-3); color: var(--zt-text-2);} body.breakdance.zt-page--hakkimizda .zt-hk-card__links {margin-top: auto; padding-top: var(--zt-sp-6);} body.breakdance.zt-page--hakkimizda .zt-hk-card__links li {border-top: var(--zt-rule);} body.breakdance.zt-page--hakkimizda .zt-hk-go {display: flex; align-items: center; justify-content: space-between; gap: var(--zt-sp-3); width: 100%; min-height: var(--zt-sp-12); white-space: normal;} body.breakdance.zt-page--hakkimizda .zt-hk-go--tel {justify-content: flex-start; font-size: var(--zt-fs-sm); font-weight: 600; color: var(--zt-text-2);} body.breakdance.zt-page--hakkimizda .zt-hk-go--tel:hover {color: var(--zt-text-2);} body.breakdance.zt-page--hakkimizda .zt-hk-go--tel strong {font-weight: 800; color: var(--zt-fume); white-space: nowrap;} body.breakdance.zt-page--hakkimizda .zt-hk-go--tel .zt-icon {color: var(--zt-fume);} body.breakdance.zt-page--hakkimizda .zt-hk-cards + .zt-cta {margin-top: var(--zt-sp-12);} body.breakdance.zt-page--hakkimizda .zt-hk-brands .zt-brands {margin-top: var(--zt-sp-16);} body.breakdance.zt-page--hakkimizda .zt-hk-brands .zt-brand:hover {color: var(--zt-quiet);} body.breakdance.zt-page--hakkimizda .zt-hk-visit {background: var(--zt-surface);} body.breakdance.zt-page--hakkimizda .zt-hk-visit__grid {display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--zt-sp-10) var(--zt-sp-18); align-items: start;} body.breakdance.zt-page--hakkimizda .zt-hk-addr {display: grid; grid-template-columns: var(--zt-line-ico) minmax(0, 1fr); gap: var(--zt-sp-5); margin-top: var(--zt-sp-8); padding-top: var(--zt-sp-8); border-top: var(--zt-rule-floor);} body.breakdance.zt-page--hakkimizda .zt-hk-addr .zt-hk-line__ico {background: var(--zt-bg);} body.breakdance.zt-page--hakkimizda .zt-hk-addr__label {font-size: var(--zt-fs-2xs); font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--zt-text-3);} body.breakdance.zt-page--hakkimizda .zt-hk-addr__text {max-width: 22em; margin-top: var(--zt-sp-1); font-size: var(--zt-fs-lg); line-height: 1.45; font-weight: 700;} body.breakdance.zt-page--hakkimizda .zt-hk-addr__go {margin-top: var(--zt-sp-5);} body.breakdance.zt-page--hakkimizda .zt-hk-lines {padding: var(--zt-sp-2) var(--zt-sp-8); border-radius: var(--zt-r-panel); background: var(--zt-bg);} body.breakdance.zt-page--hakkimizda .zt-hk-lines li + li {border-top: var(--zt-rule);} body.breakdance.zt-page--hakkimizda .zt-hk-line {display: grid; grid-template-columns: var(--zt-line-ico) minmax(0, 1fr); align-items: center; gap: var(--zt-sp-5); min-height: 104px; padding-block: var(--zt-sp-4);} body.breakdance.zt-page--hakkimizda .zt-hk-line__ico {display: grid; place-items: center; width: var(--zt-line-ico); height: var(--zt-line-ico); border-radius: var(--zt-r-round); background: var(--zt-surface); color: var(--zt-fume);} body.breakdance.zt-page--hakkimizda .zt-hk-line__text {display: grid; min-width: 0;} body.breakdance.zt-page--hakkimizda .zt-hk-line strong {font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em; color: var(--zt-fume); overflow-wrap: anywhere;} body.breakdance.zt-page--hakkimizda .zt-hk-line small {margin-top: var(--zt-sp-1); font-size: var(--zt-fs-sm); font-weight: 600; color: var(--zt-text-2);} body.breakdance.zt-page--hakkimizda .zt-hk-line:hover .zt-hk-line__ico {background: var(--zt-fume); color: var(--zt-bg);} body.breakdance.zt-page--hakkimizda .zt-qp {width: min(520px, 100% - 2 * var(--zt-gutter)); max-width: none; max-height: calc(100dvh - 2 * var(--zt-sp-8)); padding: 0; border: 0; border-radius: var(--zt-r-panel); background: var(--zt-bg); color: var(--zt-text); box-shadow: var(--zt-shadow-pop); overflow: hidden;} .zt-lock, .zt-lock body.breakdance.zt-page--hakkimizda {overflow: hidden;} .zt-lock {scrollbar-gutter: stable; background: var(--zt-lock-bg);} body.breakdance.zt-page--hakkimizda .breakdance-popup-open .zt-qp, body.breakdance.zt-page--hakkimizda .zt-qp__form {display: flex; flex-direction: column; min-height: 0;} body.breakdance.zt-page--hakkimizda .zt-qp__head {display: flex; align-items: center; justify-content: space-between; gap: var(--zt-sp-4); padding: var(--zt-sp-5) var(--zt-sp-5) 0 var(--zt-sp-8);} body.breakdance.zt-page--hakkimizda .zt-qp__title {font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} body.breakdance.zt-page--hakkimizda .zt-qp:has(.zt-qp__done:not([hidden])) .zt-qp__title {visibility: hidden;} body.breakdance.zt-page--hakkimizda .zt-qp__x {display: grid; place-items: center; width: var(--zt-touch); height: var(--zt-touch); padding: 0; border: 0; border-radius: var(--zt-r-round); background: var(--zt-surface); color: var(--zt-fume); cursor: pointer;} body.breakdance.zt-page--hakkimizda .zt-qp__body {display: grid; gap: var(--zt-sp-4); padding: var(--zt-sp-1) var(--zt-sp-8) var(--zt-sp-6); overflow: auto; overscroll-behavior: contain;} body.breakdance.zt-page--hakkimizda .zt-qp__lead {margin-bottom: var(--zt-sp-1); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} body.breakdance.zt-page--hakkimizda .zt-qp .zt-form__kvkk {margin: 0;} body.breakdance.zt-page--hakkimizda .zt-qp__foot {padding: var(--zt-sp-4) var(--zt-sp-8) var(--zt-sp-6); border-top: var(--zt-rule);} body.breakdance.zt-page--hakkimizda .zt-qp__done {padding: 0 var(--zt-sp-8) var(--zt-sp-8); overflow: auto;} body.breakdance.zt-page--hakkimizda :where(.zt-qp__done) .zt-btn {margin-top: var(--zt-sp-7); background: none;} @media (prefers-reduced-motion: no-preference) { body.breakdance.zt-page--hakkimizda .zt-hk-addr__go:hover .zt-icon {transform: translate(2px, -2px);} body.breakdance.zt-page--hakkimizda .breakdance-popup-open .zt-qp {animation: zt-in 0.32s var(--zt-ease) both;} body.breakdance.zt-page--hakkimizda .zt-qp .zt-btn:active {transition: transform 0.15s var(--zt-ease); transform: scale(0.97);} } @media (max-width: 1024px) { body.breakdance.zt-page--hakkimizda {--zt-hk-h1: clamp(2.125rem, 6.4vw, 3.25rem);} body.breakdance.zt-page--hakkimizda .zt-hero--hk {padding-top: var(--zt-header-h);} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__media {position: relative; inset: auto; z-index: 0; aspect-ratio: 16 / 9;} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__media::after {background: var(--zt-hk-seam);} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__grid {position: relative; min-height: 0; margin-top: calc(-1 * var(--zt-sp-8)); padding-top: 0;} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__copy {max-width: 40rem; padding-bottom: var(--zt-sp-12);} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__copy::before {content: none;} body.breakdance.zt-page--hakkimizda .zt-hk-who__grid {grid-template-columns: 100%;} body.breakdance.zt-page--hakkimizda .zt-hk-who__text {padding-top: 0;} body.breakdance.zt-page--hakkimizda .zt-tl {grid-template-columns: 100%; gap: var(--zt-sp-8); margin-top: var(--zt-sp-14);} body.breakdance.zt-page--hakkimizda .zt-tl::before {top: calc(var(--zt-fs-h3) / 2); right: auto; bottom: 0; left: calc(var(--zt-tl-dot) / 2 - var(--zt-hair) / 2); border-top: 0; border-left: var(--zt-rule-floor);} body.breakdance.zt-page--hakkimizda .zt-tl__item {padding-left: var(--zt-sp-10);} body.breakdance.zt-page--hakkimizda .zt-tl__item::before {top: calc(var(--zt-fs-h3) / 2 - var(--zt-tl-dot) / 2);} body.breakdance.zt-page--hakkimizda .zt-tl__year {font-size: var(--zt-fs-h3);} body.breakdance.zt-page--hakkimizda .zt-tl__title {margin-top: var(--zt-sp-2);} body.breakdance.zt-page--hakkimizda .zt-tl__text {max-width: 36em;} body.breakdance.zt-page--hakkimizda .zt-hk-cards {grid-template-columns: 100%;} body.breakdance.zt-page--hakkimizda .zt-hk-card {display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); align-items: stretch; column-gap: var(--zt-sp-2);} body.breakdance.zt-page--hakkimizda .zt-hk-card__media {align-self: start;} body.breakdance.zt-page--hakkimizda .zt-hk-card__body {padding: var(--zt-sp-3) var(--zt-sp-4) 0 var(--zt-sp-5);} body.breakdance.zt-page--hakkimizda .zt-hk-card__links {padding-top: var(--zt-sp-4);} body.breakdance.zt-page--hakkimizda .zt-hk-visit__grid {grid-template-columns: 100%;} body.breakdance.zt-page--hakkimizda .zt-hk-lines {padding-inline: var(--zt-sp-6);} body.breakdance.zt-page--hakkimizda .zt-hk-line {min-height: 88px;} } @media (max-width: 767px) { body.breakdance.zt-page--hakkimizda {--zt-hk-h1: clamp(2.125rem, 10.5vw, 2.5rem); --zt-line-ico: var(--zt-sp-10);} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__media {aspect-ratio: 4 / 3;} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__grid {margin-top: calc(-1 * var(--zt-sp-6));} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__copy {padding-bottom: var(--zt-sp-10);} body.breakdance.zt-page--hakkimizda .zt-hero--hk .zt-hero__lead {margin-top: var(--zt-sp-4);} body.breakdance.zt-page--hakkimizda .zt-crumbs ol {margin-bottom: var(--zt-sp-3); font-size: var(--zt-fs-3xs);} body.breakdance.zt-page--hakkimizda .zt-hk-who__text {font-size: var(--zt-fs-body);} body.breakdance.zt-page--hakkimizda .zt-tl {margin-top: var(--zt-sp-12); gap: var(--zt-sp-7);} body.breakdance.zt-page--hakkimizda .zt-hk-card {display: flex;} body.breakdance.zt-page--hakkimizda .zt-hk-card__media {align-self: stretch;} body.breakdance.zt-page--hakkimizda .zt-hk-card__body {padding: var(--zt-sp-5) var(--zt-sp-2) 0;} body.breakdance.zt-page--hakkimizda .zt-hk-card__title {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--hakkimizda .zt-hk-brands .zt-brands {margin-top: var(--zt-sp-12);} body.breakdance.zt-page--hakkimizda .zt-hk-addr {gap: var(--zt-sp-4); margin-top: var(--zt-sp-7); padding-top: var(--zt-sp-7);} body.breakdance.zt-page--hakkimizda .zt-hk-addr__text {font-size: var(--zt-fs-md);} body.breakdance.zt-page--hakkimizda .zt-hk-lines {padding: var(--zt-sp-1) var(--zt-sp-4);} body.breakdance.zt-page--hakkimizda .zt-hk-line {gap: var(--zt-sp-4); min-height: 80px;} body.breakdance.zt-page--hakkimizda .zt-hk-line strong {font-size: var(--zt-fs-md);} body.breakdance.zt-page--hakkimizda .zt-qp {inset: auto 0 0; width: 100%; max-height: 92dvh; margin: 0; border-radius: var(--zt-r-panel) var(--zt-r-panel) 0 0; box-shadow: var(--zt-sheet-shadow);} body.breakdance.zt-page--hakkimizda .zt-qp__head {padding: var(--zt-sp-3) var(--zt-sp-3) 0 var(--zt-sp-4);} body.breakdance.zt-page--hakkimizda .zt-qp__title {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--hakkimizda .zt-qp__body {padding-inline: var(--zt-sp-4);} body.breakdance.zt-page--hakkimizda .zt-qp__foot {padding: var(--zt-sp-3) var(--zt-sp-4) calc(var(--zt-sp-3) + env(safe-area-inset-bottom, 0px));} body.breakdance.zt-page--hakkimizda .zt-qp__done {padding: 0 var(--zt-sp-4) calc(var(--zt-sp-5) + env(safe-area-inset-bottom, 0px));} } @media (prefers-reduced-motion: no-preference) and (max-width: 767px) { body.breakdance.zt-page--hakkimizda .breakdance-popup-open .zt-qp {animation-name: zt-sheet-in;} } body.breakdance.zt-page--hakkimizda [hidden] {display: none;} body.breakdance.zt-page--iletisim .zt-hero--il {--zt-scrim-side: linear-gradient(90deg, rgb(20 28 32 / 0.84) 0%, rgb(20 28 32 / 0.78) 58%, rgb(20 28 32 / 0.2) 80%, rgb(20 28 32 / 0.1) 100%);} body.breakdance.zt-page--iletisim .zt-hero--il .zt-hero__grid {grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-areas: "copy machine";} body.breakdance.zt-page--iletisim .zt-hero--il .zt-hero__machine {justify-self: center; margin-left: 0;} body.breakdance.zt-page--iletisim .zt-hero--il .zt-hero__machine .zt-shadow {left: 6%; width: 86%;} body.breakdance.zt-page--iletisim .zt-hero--il .zt-hero__title {font-size: var(--zt-kat-h1);} body.breakdance.zt-page--iletisim .zt-hero--il .zt-hero__lead {max-width: 30em;} body.breakdance.zt-page--iletisim .zt-crumbs ol {display: flex; flex-wrap: wrap; gap: 0 var(--zt-sp-2); margin: 0 0 var(--zt-sp-5); padding: 0; list-style: none; font-size: var(--zt-fs-2xs); font-weight: 600; color: var(--zt-on-photo-2);} body.breakdance.zt-page--iletisim .zt-crumbs li + li::before {content: "/"; margin-right: var(--zt-sp-2);} body.breakdance.zt-page--iletisim .zt-crumbs a {display: inline-flex; align-items: center; min-height: var(--zt-touch); margin: calc(-1 * var(--zt-sp-3)) 0;} body.breakdance.zt-page--iletisim .zt-crumbs a:hover, body.breakdance.zt-page--iletisim .zt-crumbs [aria-current] {color: var(--zt-on-fume);} body.breakdance.zt-page--iletisim .zt-nw {white-space: nowrap;} body.breakdance.zt-page--iletisim .zt-ch__grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zt-gap);} body.breakdance.zt-page--iletisim .zt-ch {position: relative; display: flex; flex-direction: column; align-items: flex-start; padding: var(--zt-ch-pad); border-radius: var(--zt-r-panel); background: var(--zt-surface);} body.breakdance.zt-page--iletisim .zt-ch--link:hover {background: var(--zt-surface-2);} body.breakdance.zt-page--iletisim .zt-ch:has(.zt-ch__link:focus-visible) {outline: var(--zt-stroke) solid var(--zt-fume); outline-offset: 3px;} body.breakdance.zt-page--iletisim .zt-ch__ico {display: grid; place-items: center; flex: none; width: var(--zt-sp-12); height: var(--zt-sp-12); margin-bottom: var(--zt-sp-6); border-radius: var(--zt-r-round); background: var(--zt-bg); color: var(--zt-fume); box-shadow: var(--zt-shadow-seg);} body.breakdance.zt-page--iletisim .zt-ch__t {font-size: var(--zt-fs-2xs); line-height: 1.4; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--zt-text-3);} body.breakdance.zt-page--iletisim .zt-ch__v {margin-top: var(--zt-sp-2); font-size: var(--zt-ch-v); line-height: 1.3; font-weight: 800; letter-spacing: -0.02em; color: var(--zt-fume);} body.breakdance.zt-page--iletisim .zt-ch__link[href^="tel:"] {white-space: nowrap; font-variant-numeric: tabular-nums;} body.breakdance.zt-page--iletisim .zt-ch__link::after {content: ""; position: absolute; inset: 0; z-index: 2; border-radius: var(--zt-r-panel);} body.breakdance.zt-page--iletisim .zt-ch__link:focus-visible {outline: none;} body.breakdance.zt-page--iletisim .zt-ch__p {margin-top: var(--zt-sp-2); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} body.breakdance.zt-page--iletisim .zt-ch__act {display: inline-flex; align-items: center; gap: 6px; margin-top: auto; padding-top: var(--zt-sp-6); font-size: var(--zt-fs-xs); font-weight: 700; color: var(--zt-fume);} body.breakdance.zt-page--iletisim .zt-ch__act .zt-icon {width: var(--zt-icon-sm); height: var(--zt-icon-sm);} body.breakdance.zt-page--iletisim .zt-ch--place {grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: center; column-gap: var(--zt-sp-12); padding: var(--zt-sp-3);} body.breakdance.zt-page--iletisim .zt-ch__media {position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: calc(var(--zt-r-panel) - var(--zt-sp-3)); background: var(--zt-surface-2);} body.breakdance.zt-page--iletisim .zt-ch__media img {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 42% 50%;} body.breakdance.zt-page--iletisim .zt-ch__body {display: flex; flex-direction: column; align-items: flex-start; padding: var(--zt-sp-6) var(--zt-sp-8) var(--zt-sp-6) 0;} body.breakdance.zt-page--iletisim .zt-ch__map {margin-top: var(--zt-sp-6);} body.breakdance.zt-page--iletisim .zt-il-rt {background: var(--zt-surface);} body.breakdance.zt-page--iletisim .zt-rt__grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zt-gap);} body.breakdance.zt-page--iletisim .zt-rt {position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "ico go" "t t" "p p"; align-content: start; align-items: center; padding: var(--zt-sp-6) var(--zt-sp-6) var(--zt-sp-7); border-radius: var(--zt-r-panel); background: var(--zt-bg);} body.breakdance.zt-page--iletisim .zt-rt:has(.zt-rt__link:focus-visible) {outline: var(--zt-stroke) solid var(--zt-fume); outline-offset: 3px;} body.breakdance.zt-page--iletisim .zt-rt__ico {grid-area: ico; display: grid; place-items: center; width: var(--zt-sp-12); height: var(--zt-sp-12); border-radius: var(--zt-r-round); background: var(--zt-surface); color: var(--zt-fume);} body.breakdance.zt-page--iletisim .zt-rt .zt-go {grid-area: go;} body.breakdance.zt-page--iletisim .zt-rt:hover .zt-go {background: var(--zt-fume); color: var(--zt-bg);} body.breakdance.zt-page--iletisim .zt-rt__t {grid-area: t; margin-top: var(--zt-sp-6); font-size: var(--zt-fs-lg); line-height: 1.25; font-weight: 800; letter-spacing: -0.015em;} body.breakdance.zt-page--iletisim .zt-rt__link::after {content: ""; position: absolute; inset: 0; z-index: 2; border-radius: var(--zt-r-panel);} body.breakdance.zt-page--iletisim .zt-rt__link:focus-visible {outline: none;} body.breakdance.zt-page--iletisim .zt-rt__p {grid-area: p; max-width: 30em; margin-top: var(--zt-sp-2); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} body.breakdance.zt-page--iletisim .zt-qp {width: min(520px, 100% - 2 * var(--zt-gutter)); max-width: none; max-height: calc(100dvh - 2 * var(--zt-sp-8)); padding: 0; border: 0; border-radius: var(--zt-r-panel); background: var(--zt-bg); color: var(--zt-text); box-shadow: var(--zt-shadow-pop); overflow: hidden;} .zt-lock, .zt-lock body.breakdance.zt-page--iletisim {overflow: hidden;} .zt-lock {scrollbar-gutter: stable; background: var(--zt-lock-bg);} body.breakdance.zt-page--iletisim .breakdance-popup-open .zt-qp, body.breakdance.zt-page--iletisim .zt-qp__form {display: flex; flex-direction: column; min-height: 0;} body.breakdance.zt-page--iletisim .zt-qp__head {display: flex; align-items: center; justify-content: space-between; gap: var(--zt-sp-4); padding: var(--zt-sp-5) var(--zt-sp-5) 0 var(--zt-sp-8);} body.breakdance.zt-page--iletisim .zt-qp__title {font-size: var(--zt-fs-h4); line-height: 1.2; font-weight: 800; letter-spacing: -0.02em;} body.breakdance.zt-page--iletisim .zt-qp:has(.zt-qp__done:not([hidden])) .zt-qp__title {visibility: hidden;} body.breakdance.zt-page--iletisim .zt-qp__x {display: grid; place-items: center; width: var(--zt-touch); height: var(--zt-touch); padding: 0; border: 0; border-radius: var(--zt-r-round); background: var(--zt-surface); color: var(--zt-fume); cursor: pointer;} body.breakdance.zt-page--iletisim .zt-qp__body {display: grid; gap: var(--zt-sp-4); padding: var(--zt-sp-1) var(--zt-sp-8) var(--zt-sp-6); overflow: auto; overscroll-behavior: contain;} body.breakdance.zt-page--iletisim .zt-qp__lead {margin-bottom: var(--zt-sp-1); font-size: var(--zt-fs-sm); color: var(--zt-text-2);} body.breakdance.zt-page--iletisim .zt-qp .zt-form__kvkk {margin: 0;} body.breakdance.zt-page--iletisim .zt-qp__foot {padding: var(--zt-sp-4) var(--zt-sp-8) var(--zt-sp-6); border-top: var(--zt-rule);} body.breakdance.zt-page--iletisim .zt-qp__done {padding: 0 var(--zt-sp-8) var(--zt-sp-8); overflow: auto;} body.breakdance.zt-page--iletisim :where(.zt-qp__done) .zt-btn {margin-top: var(--zt-sp-7); background: none;} @media (prefers-reduced-motion: no-preference) { body.breakdance.zt-page--iletisim .zt-ch--link:hover .zt-ch__act .zt-icon, body.breakdance.zt-page--iletisim .zt-rt:hover .zt-go .zt-icon {transform: translateX(3px);} body.breakdance.zt-page--iletisim .breakdance-popup-open .zt-qp {animation: zt-in 0.32s var(--zt-ease) both;} body.breakdance.zt-page--iletisim .zt-qp .zt-btn:active {transition: transform 0.15s var(--zt-ease); transform: scale(0.97);} } @media (max-width: 1199px) { body.breakdance.zt-page--iletisim {--zt-ch-pad: var(--zt-sp-6);} } @media (max-width: 1024px) { body.breakdance.zt-page--iletisim {--zt-hero-mw: 34vw; --zt-hero-top: var(--zt-sp-10); --zt-hero-pb: var(--zt-sp-5); --zt-kat-h1: clamp(2.125rem, 6.4vw, 3.25rem); --zt-ch-v: var(--zt-fs-h4);} body.breakdance.zt-page--iletisim .zt-hero--il {--zt-scrim-side: inherit;} body.breakdance.zt-page--iletisim .zt-hero--il .zt-hero__grid {grid-template-columns: 100%; grid-template-areas: "copy" "machine";} body.breakdance.zt-page--iletisim .zt-ch__grid, body.breakdance.zt-page--iletisim .zt-rt__grid {grid-template-columns: 100%;} body.breakdance.zt-page--iletisim .zt-ch--link {display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "ico t act" "ico v act" "ico p act"; align-items: center; column-gap: var(--zt-sp-6); padding: var(--zt-sp-6) var(--zt-sp-7) var(--zt-sp-6) var(--zt-sp-6);} body.breakdance.zt-page--iletisim .zt-ch--link .zt-ch__ico {grid-area: ico; margin: 0;} body.breakdance.zt-page--iletisim .zt-ch--link .zt-ch__t {grid-area: t;} body.breakdance.zt-page--iletisim .zt-ch--link .zt-ch__v {grid-area: v;} body.breakdance.zt-page--iletisim .zt-ch--link .zt-ch__p {grid-area: p;} body.breakdance.zt-page--iletisim .zt-ch--link .zt-ch__act {grid-area: act; margin: 0; padding: 0;} body.breakdance.zt-page--iletisim .zt-ch--place {grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); column-gap: var(--zt-sp-7);} body.breakdance.zt-page--iletisim .zt-ch__media {align-self: stretch; aspect-ratio: auto; min-height: 208px;} body.breakdance.zt-page--iletisim .zt-ch__body {padding: var(--zt-sp-4) var(--zt-sp-4) var(--zt-sp-4) 0;} body.breakdance.zt-page--iletisim .zt-rt {grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "ico t go" "ico p go"; column-gap: var(--zt-sp-5); padding: var(--zt-sp-5) var(--zt-sp-6) var(--zt-sp-5) var(--zt-sp-5);} body.breakdance.zt-page--iletisim .zt-rt__t {margin-top: 0;} body.breakdance.zt-page--iletisim .zt-rt__p {margin-top: var(--zt-sp-1);} } @media (max-width: 767px) { body.breakdance.zt-page--iletisim {--zt-hero-mw: min(46vw, 264px); --zt-hero-top: var(--zt-sp-5); --zt-hero-pb: var(--zt-sp-5); --zt-kat-h1: var(--zt-fs-h1); --zt-ch-v: clamp(1.0625rem, 5.4vw, 1.375rem);} body.breakdance.zt-page--iletisim .zt-hero--il {--zt-scrim-side: linear-gradient(180deg, rgb(20 28 32 / 0.84) 0%, rgb(20 28 32 / 0.78) 70%, rgb(20 28 32 / 0.3) 88%, rgb(20 28 32 / 0.5) 100%);} body.breakdance.zt-page--iletisim .zt-hero--il + .zt-section {padding-top: calc(var(--zt-hero-drop) + var(--zt-sp-6));} body.breakdance.zt-page--iletisim .zt-crumbs ol {margin-bottom: var(--zt-sp-3); font-size: var(--zt-fs-3xs);} body.breakdance.zt-page--iletisim .zt-ch--link {grid-template-areas: "ico t act" "v v v" "p p p"; column-gap: var(--zt-sp-3); padding: var(--zt-sp-4) var(--zt-sp-5) var(--zt-sp-5);} body.breakdance.zt-page--iletisim .zt-ch__ico {width: var(--zt-sp-10); height: var(--zt-sp-10);} body.breakdance.zt-page--iletisim .zt-ch--link .zt-ch__v {margin-top: var(--zt-sp-3);} body.breakdance.zt-page--iletisim .zt-ch--place {grid-template-columns: 100%; row-gap: var(--zt-sp-4);} body.breakdance.zt-page--iletisim .zt-ch__media {aspect-ratio: 16 / 9; min-height: 0;} body.breakdance.zt-page--iletisim .zt-ch__body {display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: var(--zt-sp-3); padding: 0 var(--zt-sp-2) var(--zt-sp-2);} body.breakdance.zt-page--iletisim .zt-ch__body .zt-ch__ico {margin: 0;} body.breakdance.zt-page--iletisim .zt-ch__body .zt-ch__v, body.breakdance.zt-page--iletisim .zt-ch__map {grid-column: 1 / -1;} body.breakdance.zt-page--iletisim .zt-ch__body .zt-ch__v {margin-top: var(--zt-sp-3);} body.breakdance.zt-page--iletisim .zt-ch__map {justify-self: stretch; margin-top: var(--zt-sp-5);} body.breakdance.zt-page--iletisim .zt-rt {grid-template-areas: "ico t go" "p p p"; column-gap: var(--zt-sp-4); padding: var(--zt-sp-4) var(--zt-sp-4) var(--zt-sp-5);} body.breakdance.zt-page--iletisim .zt-rt__ico {width: var(--zt-sp-10); height: var(--zt-sp-10);} body.breakdance.zt-page--iletisim .zt-rt__p {margin-top: var(--zt-sp-3);} body.breakdance.zt-page--iletisim .zt-qp {inset: auto 0 0; width: 100%; max-height: 92dvh; margin: 0; border-radius: var(--zt-r-panel) var(--zt-r-panel) 0 0; box-shadow: var(--zt-sheet-shadow);} body.breakdance.zt-page--iletisim .zt-qp__head {padding: var(--zt-sp-3) var(--zt-sp-3) 0 var(--zt-sp-4);} body.breakdance.zt-page--iletisim .zt-qp__title {font-size: var(--zt-fs-lg);} body.breakdance.zt-page--iletisim .zt-qp__body {padding-inline: var(--zt-sp-4);} body.breakdance.zt-page--iletisim .zt-qp__foot {padding: var(--zt-sp-3) var(--zt-sp-4) calc(var(--zt-sp-3) + env(safe-area-inset-bottom, 0px));} body.breakdance.zt-page--iletisim .zt-qp__done {padding: 0 var(--zt-sp-4) calc(var(--zt-sp-5) + env(safe-area-inset-bottom, 0px));} } @media (prefers-reduced-motion: no-preference) and (max-width: 767px) { body.breakdance.zt-page--iletisim .breakdance-popup-open .zt-qp {animation-name: zt-sheet-in;} } @media (max-width: 359px) { body.breakdance.zt-page--iletisim .zt-ch__actt {display: none;} } body.breakdance.zt-page--iletisim [hidden] {display: none;} /* Form fields as wide as the row (the mockups' .zt-field--full, by control name) */ .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field:has([name^="fields[fotograf]"]), .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field:has([name^="fields[makine_tipi]"]), .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field:has([name^="fields[makine_turu]"]), .breakdance :is(.zt-offer__panel, .zt-qp) #form-servis .breakdance-form-field:has([name^="fields[marka]"]), .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field:has([name^="fields[mesaj]"]), .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field:has([name^="fields[talep_turu]"]) { grid-column: 1 / -1; } /* Adaptations to Breakdance's markup (measured differences from the mockup). Ported from Rottest's catalog (referans/rottest-site/tools/site-css/adapt.css, Breakdance 2.8.3, same version here) to Zemin's classes and tokens, rule by rule as the matching component renders here (3 Nov). */ /* Lead forms: the mockup's field rules reach the Form Builder through FORM_ALIASES (tools/build_site_css.py); these cover the parts whose markup differs. Breakdance's form.css (Rottest, 11 Oct): the form sets color and font-size from --bde-form-*, fields span 12 grid columns, labels take a bottom margin and line-height 1, required labels add a star, textarea line-height 1.4, inputs a focus ring, select a background chevron, the success message is a padded green box with a dismiss button. The cards: the page form's panel (.zt-offer__panel) and the quote popup (.zt-qp). */ .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form { color: inherit; font-size: inherit; } .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field { grid-column: auto; } .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field--html, .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-footer { grid-column: 1 / -1; } /* the KVKK note, the button; fields: .zt-field--full above */ .breakdance .zt-qp:not(.zt-qp--form) .breakdance-form-field { grid-column: 1 / -1; } /* the quote popup's fields stack (.zt-qp__body is one column) */ .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field__label { color: inherit; line-height: inherit; cursor: default; } /* form.css: .breakdance-form label { line-height: 1 } */ .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field__required { display: none; } /* the mockup marks optional fields instead */ .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field__input:focus { box-shadow: none; background-color: var(--zt-bg); } .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field--hidden, .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field--condition-hidden, .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form--hidden .breakdance-form-field { display: none; } /* form.css hides these; the .zt-field twin must not show them */ .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field--html .form-input-html > * { margin: 0; } /* The submit button: the mockup's is .zt-btn--lg.zt-btn--block (full width, 58 px) ending with the arrow icon (#i-arrow); Breakdance's button takes its colors from Global Settings and holds only its text (no button icon path in the harvest), so the button draws the arrow as the select draws its chevron. */ .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-button { width: 100%; min-height: var(--zt-btn-h-lg); gap: var(--zt-sp-2); font-size: var(--zt-fs-body); } .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-button::after { content: ""; flex: none; width: var(--zt-icon); height: var(--zt-icon); background-color: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M13 18l6 -6'/%3E%3Cpath d='M13 6l6 6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M13 18l6 -6'/%3E%3Cpath d='M13 6l6 6'/%3E%3C/svg%3E") center / contain no-repeat; } /* The select's chevron: the mockup's .zt-select draws the icon over the field; Breakdance's select has its own background chevron and no wrapper, so the field draws it (the mockup's chevron, 20 px, fume, 16 px from the edge). */ .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field--select { position: relative; } .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field--select select { background-image: none; padding-right: var(--zt-sp-12); appearance: none; cursor: pointer; } .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-field--select::after { content: ""; position: absolute; right: var(--zt-sp-4); bottom: calc((var(--zt-field-h) - var(--zt-icon)) / 2); width: var(--zt-icon); height: var(--zt-icon); background-color: var(--zt-fume); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6l6 -6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6l6 -6'/%3E%3C/svg%3E") center / contain no-repeat; pointer-events: none; } /* Success: the message holds the mockup's .zt-form__done block (success_message); the green box and its dismiss button go. */ .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-message--success { display: block; margin-top: 0; padding: 0; border-radius: 0; background: none; color: inherit; } .breakdance :is(.zt-offer__panel, .zt-qp) .breakdance-form-message-dismiss { display: none; } /* Quote popup: Breakdance's Popup element is the frame, the mockup's .zt-qp card the content. Measured in Rottest (Popup default.css, popups.css, 13 Oct): the frame is a 750 px box centered in a fixed overlay; its content box has a 30 px padding, the body background and overflow: auto. Here the frame takes the card's width and the content box is bare; the card scrolls inside (below). The overlay is the mockup's backdrop. */ .breakdance .bde-popup:has(.zt-qp) { justify-content: flex-start; overflow-y: auto; overscroll-behavior: contain; padding: var(--zt-sp-5) var(--zt-gutter); background-color: var(--zt-backdrop); } .breakdance .bde-popup:has(.zt-qp) .breakdance-popup { width: min(520px, 100%); max-height: none; margin-block: auto; } .breakdance .bde-popup:has(.zt-qp--form) .breakdance-popup { width: min(640px, 100%); } /* the request forms' two field columns (the mockups' .zt-qp--form) */ .breakdance .bde-popup:has(.zt-qp) .breakdance-popup-content { padding: 0; background: none; overflow: visible; } .breakdance .zt-qp:focus { outline: none; } /* The popup's form is the mockup's .zt-qp__body (fields) and .zt-qp__foot (button) in one Breakdance form. */ .breakdance .zt-qp .breakdance-form { gap: var(--zt-sp-4); padding: var(--zt-sp-1) var(--zt-sp-8) 0; } .breakdance .zt-qp .breakdance-form-footer { width: auto; margin: var(--zt-sp-2) calc(-1 * var(--zt-sp-8)) 0; padding: var(--zt-sp-4) var(--zt-sp-8) var(--zt-sp-6); border-top: var(--zt-rule); } /* form.css gives it width: 100%, which kept the negative margins from widening it (its rule stopped 64 px short of the card's right edge, measured 4 Nov) */ .breakdance .zt-qp .breakdance-form-message--success { padding: var(--zt-sp-6) var(--zt-sp-8); } /* The card keeps the mockup's height limit (the screen less 2 x sp-8, phones 92dvh) and scrolls inside, as the mockup's .zt-qp__body does; since the form holds the fields and the button together, the head (title, close) and the form's footer stick to the card's top and bottom edges, and the button stays in view (Alp, 4 Nov: "mobil formlarda submit butonu sticky olsun"). Before, the card cut the form off: the service form's button sat 320 px under the card's edge on a 375 x 812 phone, out of reach (measured 4 Nov). The card fills the frame. These rules carry `body` to win over the page sheets' copies (body.breakdance.zt-page-- .zt-qp); scroll-padding keeps a focused field clear of the head and the footer. */ body.breakdance .bde-popup .zt-qp { width: 100%; overflow: hidden auto; overscroll-behavior: contain; scroll-padding-block: calc(var(--zt-touch) + var(--zt-sp-5)) calc(var(--zt-btn-h-lg) + var(--zt-sp-12)); } body.breakdance .bde-popup .zt-qp__head { position: sticky; top: 0; z-index: 1; background-color: var(--zt-bg); } body.breakdance .bde-popup .zt-qp .breakdance-form-footer { position: sticky; bottom: 0; z-index: 1; background-color: var(--zt-bg); } @media (max-width: 767px) { /* a card between the overlay's margins (not the mockup's bottom sheet), so all four corners round; the form and its footer take the mockup's phone padding (.zt-qp__body, .zt-qp__foot), in line with the head */ body.breakdance .bde-popup .zt-qp { border-radius: var(--zt-r-panel); scroll-padding-block: calc(var(--zt-touch) + var(--zt-sp-3)) calc(var(--zt-btn-h-lg) + var(--zt-sp-8)); } .breakdance .zt-qp .breakdance-form { padding-inline: var(--zt-sp-4); } .breakdance .zt-qp .breakdance-form-footer { margin-inline: calc(-1 * var(--zt-sp-4)); padding: var(--zt-sp-3) var(--zt-sp-4) calc(var(--zt-sp-3) + env(safe-area-inset-bottom, 0px)); } } /* form.css gives every field `transition: all 0.3s` (.breakdance-form .breakdance-form-field__input); in a popup that includes the visibility the field inherits from the frame, so it could not take focus when the popup opened (measured on Rottest's 2.8.3, 13 Oct). */ .breakdance .bde-popup .breakdance-form-field__input { transition-property: border-color, background-color, box-shadow, color; } /* The homepage's model finder is a Shortcode element (zemin-core Home_Views): the section after the hero sits in Breakdance's .bde-shortcode wrapper, so the base rule .zt-hero + .zt-section (room for the machine that hangs below the hero) is given to that section through its wrapper too. */ .breakdance .zt-hero + .bde-shortcode > .zt-section { padding-top: calc(var(--zt-hero-drop) + var(--zt-sp-14)); border-top: 0; } @media (max-width: 767px) { .breakdance .zt-hero + .bde-shortcode > .zt-section { padding-top: calc(var(--zt-hero-drop) + var(--zt-sp-10)); } } /* A category head (zemin-core Category_Views) is a Shortcode element too, and so is the model list after it: the room for the head's hanging machine (the mockup's .zt-hero--kat + .zt-section) is given through both wrappers. Without it the machine touched the list's heading on phones and overlapped it from 768 px (measured 4 Nov). On the shop page the list prints nothing and its wrapper stays empty, so the room goes to the section after it. A head without a machine (a sector page) needs no room. */ .breakdance .bde-shortcode:has(> .zt-hero--kat .zt-hero__machine) + .bde-shortcode > .zt-section, .breakdance .bde-shortcode:has(> .zt-hero--kat .zt-hero__machine) + .bde-shortcode:not(:has(*)) + .bde-shortcode > .zt-section { padding-top: calc(var(--zt-hero-drop) + var(--zt-sp-14)); border-top: 0; } @media (max-width: 767px) { .breakdance .bde-shortcode:has(> .zt-hero--kat .zt-hero__machine) + .bde-shortcode > .zt-section, .breakdance .bde-shortcode:has(> .zt-hero--kat .zt-hero__machine) + .bde-shortcode:not(:has(*)) + .bde-shortcode > .zt-section { padding-top: calc(var(--zt-hero-drop) + var(--zt-sp-10)); } } /* The mockups toggle [hidden] on grid and flex items (the homepage finder's cards and rows) and end their stylesheet with [hidden] { display: none } to win over their own display rules by order. In site.css those rules carry the .breakdance prefix, so the hidden rule carries it as well (measured: the finder's hidden cards showed). */ .breakdance [hidden] { display: none; }