:root {
  --bg: #0d1010;
  --panel: #141918;
  --panel-2: #1a211f;
  --line: #2c3633;
  --text: #f3f6f4;
  --muted: #9ba9a4;
  --accent: #c7ff38;
  --accent-dark: #9ed020;
  --danger: #ff756d;
  --success: #8ff0b2;
  --radius: 18px;
  --shadow: 0 24px 70px rgba(0,0,0,.25);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); line-height: 1.5; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }
.topbar { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; padding: 18px clamp(20px, 5vw, 76px); border-bottom: 1px solid rgba(255,255,255,.08); background: rgba(13,16,16,.88); backdrop-filter: blur(18px); }
.brand { display: flex; gap: 12px; align-items: center; }
.brand-mark { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--accent); color: #10130f; font-weight: 900; }
.brand strong, .brand small { display: block; }
.brand small { color: var(--muted); font-size: 12px; }
.topbar nav { display: flex; align-items: center; gap: 24px; color: var(--muted); font-size: 14px; }
.button { border: 0; border-radius: 12px; padding: 14px 20px; background: var(--accent); color: #11160f; font-weight: 800; transition: transform .2s, background .2s; }
.button:hover { transform: translateY(-1px); background: var(--accent-dark); }
.button-small { padding: 10px 15px; color: #11160f !important; }
.button-secondary { width: 100%; background: transparent; color: var(--text); border: 1px solid var(--line); }
.hero { min-height: 690px; display: grid; grid-template-columns: 1.15fr .85fr; align-items: center; gap: 60px; padding: 90px clamp(20px, 7vw, 110px); overflow: hidden; background: radial-gradient(circle at 80% 30%, rgba(199,255,56,.12), transparent 32%), linear-gradient(180deg, #101514 0%, var(--bg) 100%); }
.eyebrow { color: var(--accent); letter-spacing: .16em; font-size: 12px; font-weight: 850; }
.hero h1 { margin: 18px 0 24px; max-width: 900px; font-size: clamp(42px, 6vw, 78px); line-height: 1.02; letter-spacing: -.055em; }
.hero h1 em { color: var(--accent); font-style: normal; }
.hero p { max-width: 680px; color: var(--muted); font-size: 18px; }
.hero-points { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.hero-points span { padding: 10px 14px; border: 1px solid var(--line); border-radius: 999px; color: #cbd6d2; font-size: 13px; }
.hero-visual { display: grid; place-items: center; min-height: 430px; perspective: 900px; }
.model-box { width: min(370px, 72vw); aspect-ratio: 1.12; position: relative; border: 2px solid rgba(199,255,56,.55); background: rgba(199,255,56,.035); transform: rotateX(58deg) rotateZ(-28deg); box-shadow: 0 0 70px rgba(199,255,56,.08), inset 0 0 50px rgba(199,255,56,.04); }
.model-box::before, .model-box::after { content:""; position:absolute; border:1px dashed rgba(199,255,56,.28); inset: 30px; }
.model-part { position: absolute; inset: 23% 22%; background: linear-gradient(145deg,#65726e,#2d3734); border-radius: 35% 18% 42% 24%; box-shadow: 18px 18px 40px rgba(0,0,0,.4); }
.dimension { position: absolute; padding: 4px 8px; background: var(--accent); color:#111; border-radius: 5px; font-size: 11px; font-weight: 900; transform: rotateZ(28deg) rotateX(-58deg); }
.dimension-x { right:-25px; top:45%; }.dimension-y { left:35%; bottom:-25px; }.dimension-z { left:-25px; top:15%; }
.calculator-shell { max-width: 1180px; margin: -70px auto 100px; padding: clamp(24px, 4vw, 52px); background: var(--panel); border: 1px solid var(--line); border-radius: 28px; box-shadow: var(--shadow); position: relative; z-index: 3; }
.section-heading { display: flex; gap: 20px; align-items: flex-start; margin-bottom: 28px; }
.section-heading.compact { margin-top: 10px; }
.step-index { display: grid; place-items: center; min-width: 48px; height: 48px; border-radius: 14px; border: 1px solid var(--line); color: var(--accent); font-weight: 900; }
.section-heading h2 { margin: 0 0 5px; font-size: clamp(24px, 3vw, 36px); letter-spacing: -.03em; }
.section-heading p { margin: 0; color: var(--muted); }
.drop-zone { min-height: 245px; display: grid; place-items: center; align-content: center; gap: 7px; text-align: center; border: 1.5px dashed #46534f; border-radius: var(--radius); background: var(--panel-2); transition: border-color .2s, background .2s, transform .2s; outline: none; }
.drop-zone:hover, .drop-zone.dragover, .drop-zone:focus-visible { border-color: var(--accent); background: rgba(199,255,56,.035); transform: translateY(-2px); }
.upload-icon { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 16px; background: rgba(199,255,56,.1); color: var(--accent); font-size: 30px; margin-bottom: 6px; }
.drop-zone strong { font-size: 20px; }.drop-zone span,.drop-zone small { color:var(--muted); }.drop-zone small { margin-top: 9px; }
.status-box { margin-top: 18px; padding: 14px 16px; border-radius: 12px; background: #202724; color: var(--muted); }
.status-box.error { color: #ffd1cf; border: 1px solid rgba(255,117,109,.35); background: rgba(255,117,109,.08); }
.status-box.success { color: var(--success); border:1px solid rgba(143,240,178,.25); background:rgba(143,240,178,.06); }
.result-section { border-top: 1px solid var(--line); margin-top: 44px; padding-top: 38px; }
.metric-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }
.metric { padding: 20px; border-radius: 15px; background: var(--panel-2); border:1px solid var(--line); }
.metric span { display:block; color:var(--muted); font-size: 12px; text-transform:uppercase; letter-spacing:.08em; }.metric strong { display:block; margin-top:8px; font-size: 22px; }
.material-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:14px; }
.material-card { min-height: 220px; text-align:left; padding:22px; border-radius:16px; border:1px solid var(--line); background:var(--panel-2); color:var(--text); position:relative; }
.material-card:hover,.material-card.selected { border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent); }
.material-card.selected::after { content:"SEÇİLDİ"; position:absolute; right:16px; top:16px; color:#111; background:var(--accent); padding:4px 8px; border-radius:5px; font-size:10px; font-weight:900; }
.material-card h3 { margin:24px 0 8px; font-size:20px; }.material-card p { color:var(--muted); font-size:14px; }.material-card small { position:absolute; bottom:20px; left:22px; color:#cbd6d2; }
.quote-layout { display:grid; grid-template-columns: 1.4fr .6fr; gap:18px; }
.quote-breakdown,.technical-summary { padding:26px; border:1px solid var(--line); border-radius:18px; background:var(--panel-2); }
.quote-row { display:flex; justify-content:space-between; gap:20px; padding:15px 0; border-bottom:1px solid var(--line); color:var(--muted); }.quote-row strong { color:var(--text); }
.quote-total { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; padding-top:26px; }.quote-total span,.quote-total small { display:block; }.quote-total span { color:var(--accent); font-size:11px; letter-spacing:.12em; font-weight:900; }.quote-total small { color:var(--muted); margin-top:4px; }.quote-total > strong { font-size:clamp(32px,5vw,54px); letter-spacing:-.04em; }
.quote-note { margin:24px 0 0; color:var(--muted); font-size:12px; }
.technical-summary h3 { margin-top:0; }.technical-summary dl { margin:0 0 22px; }.technical-summary dl div { padding:12px 0; border-bottom:1px solid var(--line); }.technical-summary dt { color:var(--muted); font-size:12px; }.technical-summary dd { margin:4px 0 0; font-weight:800; }
.inquiry-card { display:grid; grid-template-columns:.75fr 1.25fr; gap:35px; margin-top:20px; padding:28px; border-radius:18px; border:1px solid var(--line); background:linear-gradient(135deg,rgba(199,255,56,.06),transparent 45%),var(--panel-2); }.inquiry-card h3 { font-size:28px; margin:10px 0; }.inquiry-card p { color:var(--muted); }
.inquiry-form { display:grid; grid-template-columns:1fr 1fr; gap:13px; }.inquiry-form label { color:var(--muted); font-size:12px; }.inquiry-form input,.inquiry-form textarea { width:100%; margin-top:6px; padding:12px 13px; color:var(--text); background:#101514; border:1px solid var(--line); border-radius:10px; outline:none; }.inquiry-form input:focus,.inquiry-form textarea:focus { border-color:var(--accent); }.full { grid-column:1/-1; }.form-message { margin:0 !important; font-size:13px; }
.how-it-works { max-width:1180px; margin:0 auto 110px; padding:0 20px; }.section-title h2 { margin:12px 0 35px; font-size:clamp(32px,5vw,54px); letter-spacing:-.04em; }.process-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:15px; }.process-grid article { padding:24px; border:1px solid var(--line); border-radius:16px; background:var(--panel); }.process-grid article > span { color:var(--accent); font-weight:900; }.process-grid h3 { margin:35px 0 10px; }.process-grid p { margin:0; color:var(--muted); font-size:14px; }
footer { display:flex; justify-content:space-between; gap:20px; padding:28px clamp(20px,5vw,76px); color:var(--muted); border-top:1px solid var(--line); } footer strong { color:var(--text); }
@media (max-width:900px){.hero{grid-template-columns:1fr;min-height:auto;padding-top:75px}.hero-visual{min-height:330px}.calculator-shell{margin:-20px 14px 70px}.metric-grid,.material-grid,.process-grid{grid-template-columns:1fr 1fr}.quote-layout,.inquiry-card{grid-template-columns:1fr}.topbar nav>a:first-child{display:none}}
@media (max-width:600px){.topbar{padding:13px 15px}.brand strong{font-size:14px}.hero{padding:65px 20px 55px}.hero h1{font-size:42px}.hero-visual{display:none}.calculator-shell{padding:22px 16px;border-radius:18px}.section-heading{gap:12px}.step-index{min-width:40px;height:40px}.metric-grid,.material-grid,.process-grid{grid-template-columns:1fr}.quote-total{align-items:flex-start;flex-direction:column}.inquiry-form{grid-template-columns:1fr}.full{grid-column:auto}.topbar nav{gap:8px}footer{flex-direction:column}.drop-zone{min-height:220px}}
@media print {.topbar,.hero,.drop-zone,#analysisSection,#materialSection,.inquiry-card,.how-it-works,footer,.section-heading,.button{display:none!important}.calculator-shell{margin:0;border:0;box-shadow:none;padding:0}.result-section{border:0;margin:0;padding:0}.quote-layout{grid-template-columns:1fr .6fr}body{background:white;color:black}.quote-breakdown,.technical-summary{background:white;color:black;border-color:#ccc}.quote-row,.technical-summary dl div{border-color:#ddd}.quote-row strong,.technical-summary dd,.quote-total>strong{color:black}.quote-note,.quote-row,.technical-summary dt{color:#555}}