/* Yalnız açılış sayfası (site/index.html). Portal, KVKK ve kayıt sayfaları site.css kullanır. */
:root {
  --paper: #f7f6f2; --paper2: #efede6; --white: #ffffff;
  --ink: #16181b; --ink2: #2c3036; --muted: #5f656d; --line: #e0ddd4; --line2: #cfcbc0;
  --accent: #b9532b; --accent2: #97401f; --accentbg: #f6e7df;
  --dark: #121417; --dark2: #1c1f24; --darkline: #2b3038;
  --ok: #1d7a46; --okbg: #e3f3e9; --err: #a32626; --errbg: #fbe8e8;
  --sans: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --display: "Segoe UI Variable Display", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --mono: "Cascadia Mono", "Cascadia Code", Consolas, "SFMono-Regular", Menlo, monospace;
  --radius: 14px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 76px; }
body { margin: 0; font: 16px/1.6 var(--sans); color: var(--ink); background: var(--paper); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
body.modal-open { overflow: hidden; }
a { color: var(--accent2); }
img, svg, video { max-width: 100%; display: block; }
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
h1, h2, h3 { font-family: var(--display); letter-spacing: -0.02em; color: var(--ink); }
h2 { font-size: clamp(28px, 3.4vw, 40px); line-height: 1.12; margin: 0 0 14px; font-weight: 650; }
h3 { font-size: 19px; margin: 0 0 6px; font-weight: 650; }
p { margin: 0 0 14px; }
.eyebrow { font: 600 12px/1.4 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin: 0 0 14px; }
.lede { font-size: 18px; color: var(--muted); max-width: 720px; }
.muted { color: var(--muted); } .small { font-size: 14px; }
.skip { position: absolute; left: -9999px; } .skip:focus { left: 16px; top: 12px; z-index: 100; background: var(--white); padding: 8px 12px; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* ---------------------------------------------------------------- düğmeler */
.btn { display: inline-flex; align-items: center; gap: 8px; padding: 11px 20px; border-radius: 999px; border: 1px solid var(--line2);
  background: var(--white); color: var(--ink); text-decoration: none; font: 600 15px/1.2 var(--sans); cursor: pointer; transition: background .15s, border-color .15s, transform .15s; }
.btn:hover { border-color: var(--ink); }
.btn.primary { background: var(--ink); border-color: var(--ink); color: #fff; }
.btn.primary:hover { background: var(--accent2); border-color: var(--accent2); }
.btn.small { padding: 8px 15px; font-size: 14px; }
.btn.light { background: transparent; color: #fff; border-color: rgba(255,255,255,.35); }
.btn.light:hover { border-color: #fff; }

/* ---------------------------------------------------------------- üst bar */
.lhead { position: sticky; top: 0; z-index: 20; background: rgba(247,246,242,.88); backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid var(--line); }
.lhead .wrap { display: flex; align-items: center; gap: 24px; height: 64px; }
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--ink); margin-right: auto; min-width: 0; }
.brand-logo { height: 34px; width: auto; flex: none; }
.brand-sub { font-size: 12.5px; color: var(--muted); line-height: 1.25; padding-left: 12px; border-left: 1px solid var(--line2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.lnav { display: flex; align-items: center; gap: 22px; font-size: 14.5px; }
.lnav a { color: var(--ink2); text-decoration: none; }
.lnav a:hover { color: var(--accent2); }
.lnav .btn { color: #fff; }
.nav-toggle { display: none; background: none; border: 1px solid var(--line2); border-radius: 10px; padding: 8px 12px; font: 600 14px var(--sans); color: var(--ink); cursor: pointer; }

/* ---------------------------------------------------------------- hero */
.hero { padding: 72px 0 64px; position: relative; overflow: hidden; }
.hero::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 32px 32px; opacity: .45; -webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 85%); mask-image: linear-gradient(180deg, #000 0%, transparent 85%); }
.hero .wrap { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr); gap: 56px; align-items: center; }
.hero h1 { font-size: clamp(36px, 4.6vw, 58px); line-height: 1.04; margin: 0 0 20px; font-weight: 700; }
.hero h1 em { font-style: normal; color: var(--accent); }
.hero .lede { margin-bottom: 28px; }
.hero-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.facts { display: flex; gap: 28px; flex-wrap: wrap; margin: 36px 0 0; padding: 22px 0 0; border-top: 1px solid var(--line); list-style: none; }
.facts li { display: flex; flex-direction: column; font-size: 13.5px; color: var(--muted); }
.facts b { font: 650 22px/1.2 var(--display); color: var(--ink); }

/* monitör */
.monitor { position: relative; }
.monitor-screen { background: #0e1013; border-radius: 16px; padding: 10px; box-shadow: 0 30px 60px -28px rgba(20,22,26,.55), 0 0 0 1px rgba(0,0,0,.08); }
.monitor-stand { width: 22%; height: 26px; margin: 0 auto; background: linear-gradient(#cfccc4, #b9b5ab); clip-path: polygon(18% 0, 82% 0, 100% 100%, 0 100%); }
.monitor-base { width: 36%; height: 8px; margin: 0 auto; border-radius: 6px; background: #b3afa4; }
.monitor-label { display: flex; justify-content: space-between; gap: 12px; margin-top: 14px; font: 12px var(--mono); color: var(--muted); }
.monitor-label b { color: var(--ink); font-weight: 600; }

/* ---------------------------------------------------------------- program şeridi */
.strip { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--white); }
.strip ul { list-style: none; margin: 0; padding: 18px 0; display: flex; flex-wrap: wrap; gap: 10px 34px; justify-content: center; font: 500 14px var(--mono); color: var(--muted); }

/* ---------------------------------------------------------------- bölümler */
.sec { padding: 96px 0; }
.sec.alt { background: var(--white); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.sec.dark { background: var(--dark); color: #d9dde3; }
.sec.dark h2, .sec.dark h3 { color: #fff; } .sec.dark .lede, .sec.dark .muted { color: #9aa3ae; }
.sec-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: end; margin-bottom: 44px; }
.sec-head .lede { margin: 0; }

/* program kartları */
.pgrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.pcard { display: flex; flex-direction: column; text-align: left; padding: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white);
  font: inherit; color: inherit; cursor: pointer; overflow: hidden; transition: transform .2s ease, box-shadow .2s ease, border-color .2s; }
.pcard:hover { transform: translateY(-3px); border-color: var(--line2); box-shadow: 0 18px 40px -24px rgba(20,22,26,.45); }
.pcard-pic { position: relative; aspect-ratio: 16 / 10; background: var(--paper2); border-bottom: 1px solid var(--line); overflow: hidden; }
.pcard-pic svg { width: 100%; height: 100%; }
.pcard-play { position: absolute; z-index: 1; right: 12px; bottom: 12px; width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.92); color: var(--ink);
  display: grid; place-items: center; font-size: 13px; box-shadow: 0 6px 16px rgba(0,0,0,.18); transition: transform .2s, background .2s; }
.pcard:hover .pcard-play { transform: scale(1.08); background: var(--accent); color: #fff; }
.pcard-body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.pcard-num { font: 12px var(--mono); color: var(--muted); }
.pcard-body p { font-size: 14.5px; color: var(--muted); margin: 0; }
.pcard-ver { margin-top: auto !important; padding-top: 12px; font: 12px var(--mono) !important; color: var(--ink2) !important; }
.pcard-cta { font-size: 13.5px; font-weight: 600; color: var(--accent2); padding-top: 4px; }
.pcard-flag { position: absolute; z-index: 1; left: 12px; top: 12px; font: 600 11.5px var(--sans); color: #6b4a12; background: #fff4d6; border: 1px solid #e8c873; padding: 4px 9px; border-radius: 999px; }
.pcard-notice { font-size: 13px !important; color: #6b4a12 !important; background: #fff8e6; border-left: 3px solid #e0b44c; padding: 7px 10px; border-radius: 6px; margin-top: 8px !important; }
.pcard.held .pcard-pic svg { filter: grayscale(.6); opacity: .8; }
.modal-notice { margin: 0 0 14px; font-size: 14px; color: #6b4a12; background: #fff4d6; border: 1px solid #e8c873; border-radius: 10px; padding: 12px 14px; }
.modal-notice[hidden] { display: none; }
.modal-info .notice { font-size: 14px; color: #6b4a12; background: #fff4d6; border: 1px solid #e8c873; border-radius: 10px; padding: 12px 14px; }
.pnote { margin-top: 22px; font-size: 14px; color: var(--muted); }

/* nasıl çalışır */
.steps3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border: 1px solid var(--darkline); border-radius: var(--radius); overflow: hidden; }
.steps3 > div { padding: 30px 28px; border-right: 1px solid var(--darkline); }
.steps3 > div:last-child { border-right: none; }
.steps3 .n { font: 600 13px var(--mono); color: var(--accent); display: block; margin-bottom: 18px; }
.steps3 p { color: #9aa3ae; margin: 0; font-size: 15px; }
.prompts { margin-top: 30px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.prompt { font: 14px/1.55 var(--mono); color: #e7eaee; background: var(--dark2); border: 1px solid var(--darkline); border-radius: 12px; padding: 14px 16px; }
.prompt::before { content: "› "; color: var(--accent); }

/* özellik düzeni */
.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: start; }
.checks { list-style: none; padding: 0; margin: 18px 0 0; }
.checks li { position: relative; padding: 10px 0 10px 30px; border-top: 1px solid var(--line); font-size: 15.5px; }
.checks li::before { content: ""; position: absolute; left: 2px; top: 17px; width: 12px; height: 7px; border-left: 2px solid var(--accent); border-bottom: 2px solid var(--accent); transform: rotate(-45deg); }
.panel { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px; }
.sec.alt .panel { background: var(--paper); }
.wizard { list-style: none; margin: 0; padding: 0; counter-reset: s; }
.wizard li { counter-increment: s; display: grid; grid-template-columns: 34px 1fr; gap: 12px; padding: 12px 0; border-top: 1px solid var(--line); font-size: 15px; }
.wizard li:first-child { border-top: none; }
.wizard li::before { content: counter(s); width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--line2); display: grid; place-items: center; font: 600 12px var(--mono); }
.wizard b { display: block; }
.mini-demo { margin-top: 20px; }
.outputs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.outputs span { font: 12.5px var(--mono); padding: 6px 10px; border: 1px solid var(--line2); border-radius: 999px; background: var(--white); }

/* kurulum süreci */
.process { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; counter-reset: p; }
.process li { counter-increment: p; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px 18px; font-size: 14.5px; color: var(--muted); }
.process li::before { content: "0" counter(p); display: block; font: 600 12px var(--mono); color: var(--accent); margin-bottom: 12px; }
.process b { display: block; color: var(--ink); font-size: 15.5px; margin-bottom: 4px; }

/* fiyat */
.pricing { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 22px; align-items: start; }
table.price { width: 100%; border-collapse: collapse; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
table.price td { padding: 16px 20px; border-top: 1px solid var(--line); font-size: 15px; }
table.price tr:first-child td { border-top: none; }
table.price td:last-child { text-align: right; font: 600 15px var(--mono); white-space: nowrap; }
table.price tr.first td { background: var(--accentbg); }
.example { background: var(--ink); color: #e9ebee; border-radius: var(--radius); padding: 26px; }
.example h3 { color: #fff; }
.example .line { display: flex; justify-content: space-between; gap: 14px; padding: 9px 0; border-top: 1px solid #30353d; font-size: 14.5px; }
.example .line span:last-child { font-family: var(--mono); white-space: nowrap; }
.example .line.total { font-weight: 700; font-size: 16px; color: #fff; border-top: 1px solid #555c66; margin-top: 6px; padding-top: 14px; }
.price-note { margin-top: 18px; font-size: 14px; color: var(--muted); }

/* destek */
.cards3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.card { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 24px; }
.sec.alt .card { background: var(--paper); }
.card .tag { font: 600 12px var(--mono); color: var(--accent); display: block; margin-bottom: 10px; }
.card p { font-size: 15px; color: var(--muted); }
.card p:last-child { margin-bottom: 0; }

/* sss */
.faq-list { max-width: 860px; }
details.faq { border-top: 1px solid var(--line); padding: 4px 0; }
details.faq:last-child { border-bottom: 1px solid var(--line); }
details.faq summary { list-style: none; cursor: pointer; font-weight: 600; font-size: 16.5px; padding: 16px 40px 16px 0; position: relative; }
details.faq summary::-webkit-details-marker { display: none; }
details.faq summary::after { content: "+"; position: absolute; right: 6px; top: 12px; font: 400 24px var(--sans); color: var(--muted); transition: transform .2s; }
details.faq[open] summary::after { transform: rotate(45deg); }
details.faq p { color: var(--muted); padding-right: 40px; }

/* iletişim */
.contact { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 48px; align-items: start; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px; }
.form-grid .wide { grid-column: 1 / -1; }
label { display: flex; flex-direction: column; gap: 6px; font-size: 13.5px; font-weight: 600; color: var(--ink2); }
input, textarea { font: 15px var(--sans); padding: 11px 12px; border: 1px solid var(--line2); border-radius: 10px; background: var(--white); color: var(--ink); width: 100%; }
input:focus, textarea:focus { outline: 2px solid var(--accent); outline-offset: 0; border-color: transparent; }
label.check { flex-direction: row; align-items: flex-start; gap: 10px; font-weight: 400; }
label.check input { width: auto; margin-top: 4px; }
label.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.flash { padding: 14px 18px; border-radius: 12px; margin: 0 0 18px; font-weight: 600; }
.flash.ok { background: var(--okbg); color: var(--ok); } .flash.err { background: var(--errbg); color: var(--err); }

/* alt bilgi */
.lfoot { background: var(--dark); color: #9aa3ae; padding: 48px 0 40px; font-size: 14px; }
.lfoot .wrap { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 40px; }
.lfoot a { color: #d9dde3; }
.foot-brand img { height: 34px; width: auto; margin-bottom: 12px; }
.foot-brand p { margin: 0; }
.lfoot nav { display: flex; gap: 20px; flex-wrap: wrap; align-items: start; }
.trademarks { grid-column: 1 / -1; border-top: 1px solid var(--darkline); padding-top: 20px; font-size: 12.5px; line-height: 1.6; color: #7d8590; }

/* ================================================================ canlandırma çerçevesi */
.dm-frame { display: grid; grid-template-columns: 300px minmax(0, 1fr); grid-template-areas: "chat win"; background: #0e1013; border-radius: 12px; overflow: hidden; font-family: var(--sans); }
.dm-win { grid-area: win; position: relative; display: flex; flex-direction: column; min-width: 0; }
.dm-chat { grid-area: chat; display: flex; flex-direction: column; background: #f8f8f6; border-right: 1px solid #23272e; height: 0; min-height: 100%; }
/* satır yüksekliğini program penceresi belirler; sohbet kendi içinde kayar */
.dm-bar { display: flex; align-items: center; gap: 10px; height: 32px; padding: 0 12px; background: #1b1e23; color: #c6ccd4; font: 12px var(--sans); border-bottom: 1px solid #262a31; }
.dm-lights { width: 40px; height: 10px; flex: none; background: radial-gradient(circle at 5px 5px, #5b6068 4px, transparent 4.5px), radial-gradient(circle at 20px 5px, #5b6068 4px, transparent 4.5px), radial-gradient(circle at 35px 5px, #5b6068 4px, transparent 4.5px); }
.dm-wtitle { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dm-wstatus { font: 11px var(--mono); color: #7fd19b; padding: 2px 8px; border-radius: 999px; background: rgba(127,209,155,.12); white-space: nowrap; }
.dm-wstatus.busy { color: #f0c36b; background: rgba(240,195,107,.13); }
.dm-svg { width: 100%; height: auto; aspect-ratio: 16 / 10; display: block; }
.dm-toast { position: absolute; left: 12px; bottom: 12px; font: 12px var(--mono); color: #fff; background: rgba(20,22,26,.86); padding: 7px 11px; border-radius: 8px; opacity: 0; transform: translateY(6px); transition: opacity .4s, transform .4s; pointer-events: none; }
.dm-toast.on { opacity: 1; transform: none; }
.dm-chead { display: flex; align-items: center; gap: 8px; padding: 0 14px; height: 32px; border-bottom: 1px solid #e6e4de; font-size: 12.5px; }
.dm-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); flex: none; }
.dm-chtitle { font-weight: 650; color: #1f2226; white-space: nowrap; }
.dm-chsub { margin-left: auto; color: #8a8f96; font-size: 11px; white-space: nowrap; }
.dm-msgs { flex: 1; overflow-y: auto; padding: 12px; display: flex; flex-direction: column; gap: 8px; min-height: 0; scroll-behavior: smooth; }
.dm-msg { font-size: 13px; line-height: 1.45; animation: dmIn .35s ease both; }
.dm-msg.user { align-self: flex-end; max-width: 92%; background: #1f2226; color: #f3f4f6; padding: 9px 11px; border-radius: 12px 12px 4px 12px; }
.dm-msg.step { display: grid; grid-template-columns: 12px minmax(0, 1fr); align-items: start; gap: 3px 7px; color: #3d4249; padding-left: 2px; }
.dm-msg.step .dm-spin { margin-top: 3px; }
.dm-msg.step .dm-tool { grid-column: 2; justify-self: start; }
.dm-msg.final { background: #fff; border: 1px solid #e3e1da; color: #1f2226; padding: 9px 11px; border-radius: 12px 12px 12px 4px; }
.dm-spin { width: 12px; height: 12px; border-radius: 50%; border: 2px solid #d5d3cc; border-top-color: var(--accent); animation: dmSpin .8s linear infinite; flex: none; }
.dm-msg.done .dm-spin { animation: none; border: none; background: #1d7a46; position: relative; }
.dm-msg.done .dm-spin::after { content: ""; position: absolute; left: 4px; top: 2px; width: 3px; height: 6px; border: solid #fff; border-width: 0 1.6px 1.6px 0; transform: rotate(45deg); }
.dm-tool { font: 11px var(--mono); color: #6b4a3a; background: #f3e6df; padding: 1px 6px; border-radius: 5px; }
.dm-input { display: flex; align-items: center; gap: 8px; margin: 10px; padding: 9px 11px; border: 1px solid #dedcd5; border-radius: 10px; background: #fff; min-height: 40px; font-size: 13px; color: #1f2226; }
.dm-typing { flex: 1; min-width: 0; }
.dm-typing::after { content: ""; display: inline-block; width: 1.5px; height: 1.05em; margin-left: 1px; vertical-align: -2px; background: #1f2226; animation: dmBlink 1s steps(1) infinite; }
.dm-send { flex: none; width: 24px; height: 24px; border-radius: 7px; background: #1f2226; color: #fff; display: grid; place-items: center; font-size: 12px; }
.dm-frame.paused .dm-spin { animation-play-state: paused; }
@keyframes dmSpin { to { transform: rotate(360deg); } }
@keyframes dmBlink { 50% { opacity: 0; } }
@keyframes dmIn { from { opacity: 0; transform: translateY(6px); } }

/* hero'da sohbet pencerenin üstünde yüzer */
.dm-frame.compact { grid-template-columns: minmax(0, 1fr); grid-template-areas: "win"; position: relative; }
.dm-frame.compact .dm-chat { position: absolute; left: 10px; bottom: 10px; width: min(46%, 300px); height: 54%; min-height: 0; border: 1px solid rgba(0,0,0,.08); border-radius: 12px;
  background: rgba(250,250,248,.94); box-shadow: 0 16px 34px -14px rgba(0,0,0,.5); backdrop-filter: blur(6px); transition: opacity .5s ease, transform .5s ease; }
.dm-frame.compact .dm-chat.away { opacity: 0; transform: translateY(10px); }
.dm-frame.compact .dm-chead { height: 28px; } .dm-frame.compact .dm-chsub { display: none; }
.dm-frame.compact .dm-msgs { padding: 8px 10px; gap: 6px; }
.dm-frame.compact .dm-msg { font-size: 11.5px; }
.dm-frame.compact .dm-tool { font-size: 10px; }
.dm-frame.compact .dm-input { margin: 8px; min-height: 34px; padding: 6px 9px; font-size: 12px; }
.dm-frame.compact .dm-toast { left: auto; right: 12px; }

/* oynatıcı denetimleri */
.dm-ctrl { display: flex; align-items: center; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.dm-btn { font: 600 13px var(--sans); padding: 8px 14px; border-radius: 999px; border: 1px solid var(--ink); background: var(--ink); color: #fff; cursor: pointer; }
.dm-btn.ghost { background: transparent; color: var(--ink); border-color: var(--line2); }
.dm-track { flex: 1; min-width: 80px; height: 4px; border-radius: 4px; background: var(--line); overflow: hidden; }
.dm-prog { height: 100%; width: 0; background: var(--accent); }

/* ---------------------------------------------------------------- SVG öğeleri */
.dm-svg text { font-family: var(--mono); }
.dm-bg { fill: var(--vbg); }
.dm-grid { stroke: var(--vgrid); stroke-width: .6; }
.dm-grid.major { stroke: var(--vgrid2); stroke-width: .9; }
.dm-axis { stroke-width: 2; } .dm-axis.x { stroke: #e5534b; } .dm-axis.y { stroke: #57ab5a; }
.dm-it { opacity: 0; transition-property: opacity, transform; transition-duration: .5s; transition-timing-function: ease; }
.dm-it.on { opacity: 1; }
.dm-it[data-rise] { transform: translateY(10px); }
.dm-it[data-rise].on { transform: none; }
.dm-it line, .dm-it polyline, .dm-it polygon, .dm-it rect, .dm-it path, .dm-it circle, .dm-it ellipse { fill: none; stroke: var(--vink); stroke-width: 1.5; stroke-linejoin: round; stroke-linecap: round; }
.dm-txt { fill: var(--vtext); font-size: 13px; }
.dm-txt.sm { font-size: 11.5px; } .dm-txt.xs { font-size: 10px; } .dm-txt.lg { font-size: 16px; }
.dm-row { opacity: 0; transition: opacity .35s ease; } .dm-row.on { opacity: 1; }
.dm-it .dm-row rect { fill: var(--trow); stroke: var(--tline); stroke-width: 1; }
.dm-it .dm-row.head rect { fill: var(--thead); }
.dm-it .dm-row.head text { font-weight: 700; }
.dm-it .dm-row.total rect { fill: var(--ttotal); } .dm-it .dm-row.total text { font-weight: 700; }
.dm-it .dm-row.est rect { fill: var(--test); }
.dm-row text { fill: var(--vtext); }

.dm-it.wall line, .dm-it.wall polyline, .dm-it.wall polygon, .dm-it.wall rect { stroke-width: 3; }
.dm-it.door path { stroke: var(--vacc); stroke-width: 1.4; }
.dm-it.hl line, .dm-it.hl path, .dm-it.hl rect { stroke: var(--vhl); stroke-width: 3; stroke-opacity: .85; }
.dm-it.hlfill rect { fill: var(--vhl); fill-opacity: .05; stroke: none; }
.dm-dimline, .dm-ext { stroke: var(--vdim) !important; stroke-width: 1 !important; }
.dm-dimtxt { fill: var(--vdim); font-size: 12px; }
.dm-it.hud .dm-txt { fill: var(--vdim); }
.dm-it.label .dm-txt { fill: var(--vink); font-weight: 600; }
.dm-it.dimtxt .dm-txt { fill: var(--vdim); }
.dm-it.tag .dm-txt { fill: var(--vacc); font-weight: 600; }
.dm-it.note .dm-txt { fill: #9a5b1f; }
.dm-it.room rect { fill: var(--vacc); fill-opacity: .08; stroke: none; }
.dm-it.area polygon { fill: var(--vacc); fill-opacity: .14; stroke: var(--vacc); }
.dm-it.center line, .dm-it.center circle { stroke: var(--vdim); stroke-width: 1; stroke-dasharray: 14 4 3 4; }
.dm-it.hidden line { stroke: var(--vdim); stroke-width: 1; stroke-dasharray: 5 4; }
.dm-it.part circle, .dm-it.part rect { stroke: var(--vink); stroke-width: 2; fill: var(--vacc); fill-opacity: .07; }
.dm-it.ghost rect { stroke: var(--vdim); stroke-dasharray: 6 5; stroke-width: 1.2; }
.dm-it.capture rect { stroke: #fff; stroke-width: 2; stroke-dasharray: 10 8; opacity: .8; }
.dm-it.win rect { stroke: var(--vacc); stroke-width: 1.4; fill: var(--vbg); }
.dm-it.slabfill rect { fill: var(--vacc); fill-opacity: .04; stroke: none; }
.dm-it.flag circle { stroke: #ff5d5d; stroke-width: 3; }
.dm-it.bar rect { fill: var(--vacc); stroke: none; }
.dm-it.bar.cost rect { fill: #9aa1aa; } .dm-it.bar.alt rect { fill: #1f2226; }
.dm-it.arrow path { stroke: var(--vacc); stroke-width: 2.5; }
.dm-it.wire line { stroke: #7d8590; stroke-width: 2; }
.dm-node { fill: #fff !important; stroke: #7d8590 !important; stroke-width: 1.2 !important; }
.dm-it.srf polygon { stroke: var(--vdim); stroke-dasharray: 6 5; fill: var(--vacc); fill-opacity: .04; }
.dm-it.panel polygon { fill: var(--vacc); fill-opacity: .35; stroke: var(--vacc); stroke-width: .8; }
.dm-it.glass polygon { fill: #9cc9ef; fill-opacity: .55; stroke: #d9ecfb; }
.dm-it.frame line { stroke: #d9ecfb; stroke-width: 2; }
.dm-it.oak polygon { fill: #d8b383; stroke: #b88d5a; }
.dm-it.wood polygon { fill: #a8774a; stroke: #7e5634; }
.dm-it.plank line { stroke: #7e5634; stroke-width: 1; }
.dm-it.ground polygon { fill: var(--vground); stroke: none; }
.dm-it.selface polygon { fill: #3b82f6; fill-opacity: .4; stroke: #1d4ed8; stroke-width: 2; }
.dm-it.ray line { stroke: #f2b84b; stroke-width: 1.4; stroke-dasharray: 6 6; }
.dm-sun { stroke: #f2b84b !important; fill: #f7cf73 !important; stroke-width: 2 !important; }
.dm-page { fill: #fff !important; stroke: #c9c6bd !important; filter: drop-shadow(0 6px 10px rgba(0,0,0,.12)); }
.dm-pbar { fill: #dedbd2 !important; stroke: none !important; } .dm-pbar.strong { fill: #1f2226 !important; }
.dm-ptotal { fill: #1f2226 !important; font-weight: 700; }
.dm-stamp { fill: #b9532b; fill-opacity: .35; font: 800 30px var(--sans) !important; letter-spacing: .12em; }
.dm-it.pending rect { fill: #fff4d6; stroke: #e0b44c; rx: 8; }
.dm-it.pendtxt .dm-txt { fill: #7a5a12; font-weight: 600; }

/* izometrik kutu yüzleri */
.dm-it polygon.f-t { fill: var(--ft); stroke: var(--fs); stroke-width: .8; }
.dm-it polygon.f-r { fill: var(--fr); stroke: var(--fs); stroke-width: .8; }
.dm-it polygon.f-f { fill: var(--ff); stroke: var(--fs); stroke-width: .8; }
.dm-it.wall polygon.f-t { fill: var(--wt); } .dm-it.wall polygon.f-r { fill: var(--wr); } .dm-it.wall polygon.f-f { fill: var(--wf); }
.dm-it.slab polygon { fill: var(--wf); stroke: var(--fs); stroke-width: .8; }
.dm-it.cut polygon.f-t { fill: #ff8a65; }
.dm-it.obj polygon.f-t { fill: var(--ot); } .dm-it.obj polygon.f-r { fill: var(--or); } .dm-it.obj polygon.f-f { fill: var(--of); }
.dm-it.obj.wood polygon.f-t { fill: #a8774a; } .dm-it.obj.wood polygon.f-r { fill: #7e5634; } .dm-it.obj.wood polygon.f-f { fill: #946640; }
.dm-it.sel polygon { stroke: #f5a524; stroke-width: 1.6; }
.dm-it.warn polygon.f-t { fill: #ff8f85; } .dm-it.warn polygon.f-r { fill: #d9534a; } .dm-it.warn polygon.f-f { fill: #ec6d63; }
.dm-it.warn polygon { stroke: #9e2a22; }
.dm-it.timber polygon.f-t { fill: #e2c393; } .dm-it.timber polygon.f-r { fill: #b98e57; } .dm-it.timber polygon.f-f { fill: #cfa871; }
.dm-it.mass polygon.f-t { fill: #f4f2ec; } .dm-it.mass polygon.f-r { fill: #c9c6bd; } .dm-it.mass polygon.f-f { fill: #dedbd2; }
.dm-it.mass.gray polygon.f-t { fill: #e4e6e9; } .dm-it.mass.gray polygon.f-r { fill: #a9afb7; } .dm-it.mass.gray polygon.f-f { fill: #c3c8ce; }
.dm-it.bld polygon.f-t { fill: #e6eefc; } .dm-it.bld polygon.f-r { fill: #9fb4dc; } .dm-it.bld polygon.f-f { fill: #c3d3ef; }
.dm-it.bld polygon { stroke: #3f5f9e; }

/* program temaları (stilize; programların gerçek arayüzleri değildir) */
.theme-cad { --vbg: #1d232b; --vgrid: #252c35; --vgrid2: #2f3843; --vink: #e8edf2; --vtext: #c9d3dd; --vacc: #f5c542; --vdim: #5ec8e5; --vhl: #ff6b5b;
  --trow: #222a33; --thead: #2c3540; --tline: #3a4552; --ttotal: #31404d; --test: #3c3424; }
.theme-max { --vbg: #3a3e44; --vgrid: #444950; --vgrid2: #555b63; --vink: #e6e8eb; --vtext: #e6e8eb; --vacc: #6cb6ff; --vdim: #aab2bd; --vhl: #ff7b72;
  --ft: #d2d5da; --fr: #9ea3aa; --ff: #b7bbc1; --fs: #2a2d31; --wt: #c8ccd2; --wr: #8f959d; --wf: #aab0b8; --ot: #8fb8e8; --or: #4f7bb0; --of: #6b97cc;
  --trow: #42474e; --thead: #50565e; --tline: #5d636c; --ttotal: #565d66; --test: #5a4f3a; }
.theme-bim { --vbg: #fbfbf9; --vgrid: #efede7; --vgrid2: #e2dfd6; --vink: #23262b; --vtext: #23262b; --vacc: #1f6feb; --vdim: #6b7280; --vhl: #d9480f;
  --ft: #e6eefc; --fr: #9fb4dc; --ff: #c3d3ef; --fs: #3f5f9e; --trow: #ffffff; --thead: #eef3fd; --tline: #d5dbe6; --ttotal: #e3ebfb; --test: #fff3d6; }
.theme-su { --vbg: #e9eef2; --vgrid: #d9e0e6; --vgrid2: #c9d2da; --vink: #2e3439; --vtext: #2e3439; --vacc: #c2562b; --vdim: #6b7280; --vhl: #c2562b;
  --vground: #dfe6d5; --ft: #f4f2ec; --fr: #c9c6bd; --ff: #dedbd2; --fs: #2e3439; }
.theme-rh { --vbg: #e7e8ea; --vgrid: #d6d8dc; --vgrid2: #c5c8cd; --vink: #30343a; --vtext: #30343a; --vacc: #2f6fdf; --vdim: #6b7280; --vhl: #e8590c;
  --ft: #f4f5f6; --fr: #b8bcc3; --ff: #d6d9dd; --fs: #30343a; --ot: #f4f5f6; --or: #b8bcc3; --of: #d6d9dd;
  --trow: #ffffff; --thead: #e8effc; --tline: #cfd5df; --ttotal: #dde7fa; --test: #fff3d6; }
.theme-bl { --vbg: #2b2b2b; --vgrid: #353535; --vgrid2: #454545; --vink: #e6e6e6; --vtext: #e6e6e6; --vacc: #f0883e; --vdim: #9a9a9a; --vhl: #f0883e;
  --ft: #c4c4c4; --fr: #8a8a8a; --ff: #a6a6a6; --fs: #1b1b1b; --wt: #cfcfcf; --wr: #8d8d8d; --wf: #ababab; --ot: #e0a46b; --or: #a86c36; --of: #c4864e;
  --trow: #333333; --thead: #404040; --tline: #4c4c4c; --ttotal: #474747; --test: #4a4030; }
.theme-fc { --vbg: #f4f6f9; --vgrid: #e6eaef; --vgrid2: #d7dde5; --vink: #1f2a37; --vtext: #1f2a37; --vacc: #2563eb; --vdim: #64748b; --vhl: #e8590c;
  --trow: #ffffff; --thead: #e8eefc; --tline: #d3dae5; --ttotal: #dde6fb; --test: #fff3d6; }
.theme-ac { --vbg: #fcfcfa; --vgrid: #f0efea; --vgrid2: #e3e1da; --vink: #2b2b2b; --vtext: #2b2b2b; --vacc: #0f766e; --vdim: #6b7280; --vhl: #e8590c;
  --trow: #ffffff; --thead: #e6f3f1; --tline: #d4e0de; --ttotal: #d5ece8; --test: #fff3d6; }
.theme-mt { --vbg: #eef0f2; --vgrid: #e4e7ea; --vgrid2: #d9dde1; --vink: #1f2226; --vtext: #1f2226; --vacc: #b9532b; --vdim: #6b7280; --vhl: #b9532b;
  --trow: #ffffff; --thead: #f6e7df; --tline: #e0ddd4; --ttotal: #1f2226; --test: #fff3d6; }
.theme-mt .dm-it .dm-row.total text { fill: #fff; }
.theme-mt .dm-it.xls .dm-row.head rect { fill: #e2efe6; }

/* ================================================================ program penceresi (modal) */
.modal { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: 24px; }
.modal[hidden] { display: none; }
.modal-back { position: absolute; inset: 0; background: rgba(14,16,19,.62); backdrop-filter: blur(4px); opacity: 0; transition: opacity .25s; }
.modal-box { position: relative; width: min(1180px, 100%); max-height: calc(100vh - 48px); overflow-y: auto; background: var(--paper); border-radius: 18px;
  box-shadow: 0 40px 80px -30px rgba(0,0,0,.6); opacity: 0; transform: translateY(14px) scale(.985); transition: opacity .25s, transform .25s; }
.modal.show .modal-back { opacity: 1; } .modal.show .modal-box { opacity: 1; transform: none; }
.modal-head { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 24px; background: rgba(247,246,242,.95); border-bottom: 1px solid var(--line); }
.modal-head h2 { font-size: 26px; margin: 0; }
.modal-head .eyebrow { margin: 0 0 2px; }
.modal-x { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line2); background: var(--white); font-size: 22px; line-height: 1; cursor: pointer; color: var(--ink); flex: none; }
.modal-x:hover { border-color: var(--ink); }
.modal-body { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; padding: 22px 24px 26px; }
.modal-main { min-width: 0; }
.modal-video { width: 100%; border-radius: 12px; background: #000; }
.modal-badge { display: inline-flex; align-items: center; gap: 8px; margin: 14px 0 0; font: 12px var(--mono); color: var(--muted); }
.modal-badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); }
.modal-thumbs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
.mthumb { display: flex; flex-direction: column; gap: 6px; padding: 0; border: none; background: none; text-align: left; cursor: pointer; font: inherit; color: var(--ink); }
.mthumb-pic { position: relative; display: block; border-radius: 10px; overflow: hidden; border: 2px solid transparent; aspect-ratio: 16 / 10; background: #1b1e23; }
.mthumb-pic svg { width: 100%; height: 100%; }
.mthumb-play { display: grid; place-items: center; width: 100%; height: 100%; color: #fff; font-size: 22px; }
.mthumb[aria-pressed="true"] .mthumb-pic { border-color: var(--accent); }
.mthumb:hover .mthumb-pic { border-color: var(--line2); }
.mthumb[aria-pressed="true"]:hover .mthumb-pic { border-color: var(--accent); }
.mthumb-cap { font-size: 13px; font-weight: 600; }
.modal-info h3 { font-size: 15px; margin: 18px 0 8px; } .modal-info h3:first-child { margin-top: 0; }
.modal-info p { font-size: 14.5px; color: var(--muted); }
.modal-info ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.modal-info li { font: 13px/1.5 var(--mono); background: var(--white); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; }
.modal-info .ver { font: 13px var(--mono); color: var(--ink2); }
.modal-info .fine { font-size: 12.5px; color: var(--muted); margin-top: 16px; }

/* ================================================================ duyarlı düzen */
@media (max-width: 1080px) {
  .pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .process { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .modal-body { grid-template-columns: minmax(0, 1fr); }
  .dm-frame { grid-template-columns: 250px minmax(0, 1fr); }
}
@media (max-width: 920px) {
  .lnav { display: none; position: absolute; top: 64px; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 0; background: var(--paper); border-bottom: 1px solid var(--line); padding: 8px 16px 16px; }
  .lnav a { padding: 12px 4px; border-bottom: 1px solid var(--line); }
  .lnav .btn { margin-top: 12px; justify-content: center; border-bottom: none; }
  body.nav-open .lnav { display: flex; }
  .nav-toggle { display: inline-block; }
  .hero .wrap, .sec-head, .split, .pricing, .contact { grid-template-columns: minmax(0, 1fr); }
  .hero .wrap { gap: 40px; }
  .sec-head { gap: 12px; }
  .cards3, .steps3 { grid-template-columns: minmax(0, 1fr); }
  .steps3 > div { border-right: none; border-bottom: 1px solid var(--darkline); }
  .steps3 > div:last-child { border-bottom: none; }
  .prompts { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
  .wrap { padding: 0 16px; }
  .hero { padding: 44px 0 40px; }
  .sec { padding: 64px 0; }
  .pgrid, .process { grid-template-columns: minmax(0, 1fr); }
  .form-grid { grid-template-columns: minmax(0, 1fr); padding: 18px; }
  .facts { gap: 18px; }
  table.price td { padding: 13px 14px; font-size: 14px; }
  .lfoot .wrap { grid-template-columns: minmax(0, 1fr); }
  .brand-sub { display: none; }
  .brand-logo { height: 30px; }
  .modal { padding: 0; place-items: stretch; }
  .modal-box { max-height: 100vh; height: 100%; border-radius: 0; }
  .modal-head { padding: 14px 16px; } .modal-head h2 { font-size: 21px; }
  .modal-body { padding: 16px; }
  .modal-thumbs { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .mthumb-cap { font-size: 11.5px; }
  .dm-frame { grid-template-columns: minmax(0, 1fr); grid-template-areas: "win" "chat"; }
  .dm-frame:not(.compact) .dm-chat { height: 230px; min-height: 0; border-right: none; border-top: 1px solid #23272e; }
  .dm-frame.compact .dm-chat { width: calc(100% - 20px); height: 46%; }
  .dm-chsub { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

/* Telefon: 16 px'ten küçük alan yazısı iPhone'da odaklanınca sayfayı yakınlaştırır; onay kutuları parmakla dokunulacak boyutta */
@media (max-width: 760px) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea { font-size: 16px; }
  input[type="checkbox"], input[type="radio"] { width: 22px; height: 22px; flex: 0 0 22px; }
}