/* ===== HesapAraçları — base.css ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px;-webkit-text-size-adjust:100%}
:root{
  --p:#6C63FF;--pd:#5548E8;--pl:#EEEEFF;
  --ac:#4ECDC4;--al:#E8FBF9;
  --gn:#22C55E;--gl:#DCFCE7;
  --rd:#EF4444;--rl:#FEE2E2;
  --or:#F97316;--ol:#FFF0E6;
  --bg:#F5F4FF;--sf:#FFFFFF;
  --br:#E8E6FF;--br2:#D1CEFF;
  --tx:#1A1635;--tx2:#5E5A80;--tx3:#9896B8;--mu:#C8C5E8;
  --ss:0 1px 3px rgba(108,99,255,.08),0 1px 2px rgba(108,99,255,.05);
  --sm:0 4px 20px rgba(108,99,255,.10),0 2px 6px rgba(108,99,255,.06);
  --sl:0 8px 40px rgba(108,99,255,.14),0 4px 12px rgba(108,99,255,.08);
  --sx:0 20px 60px rgba(108,99,255,.18),0 8px 24px rgba(108,99,255,.10);
  --sd:0 24px 48px -12px rgba(108,99,255,.28);
  --rsm:8px;--rmd:14px;--rlg:20px;--rxl:28px;--rp:999px;
  --fn:'Sora',sans-serif;--mo:'JetBrains Mono',monospace;
  --ez:cubic-bezier(.16,1,.3,1);
  --tf:150ms;--tm:260ms;--ts:420ms;
  --hh:68px;--cw:1140px;
}
body{font-family:var(--fn);background:var(--bg);color:var(--tx);line-height:1.6;min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{cursor:pointer;font-family:var(--fn);border:none;background:none;outline:none}
input,select{outline:none}
img{max-width:100%;display:block}
:focus-visible{outline:2px solid var(--p);outline-offset:2px;border-radius:4px}
.container{width:100%;max-width:var(--cw);margin:0 auto;padding:0 28px}
.grad-text{background:linear-gradient(135deg,var(--p),var(--ac));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

/* ---- HEADER ---- */
.site-header{position:sticky;top:0;z-index:200;height:var(--hh);background:rgba(255,255,255,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--br);box-shadow:var(--ss)}
.site-header .container{display:flex;align-items:center;height:100%;gap:8px}
.logo{display:flex;align-items:center;gap:10px;flex-shrink:0;margin-right:16px}
.logo-icon{display:flex}
.logo-text{font-size:1.125rem;color:var(--tx);letter-spacing:-.02em}
.logo-text strong{color:var(--p);font-weight:700}
.site-nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav-item{position:relative;display:flex;align-items:center;gap:5px;padding:8px 14px;border-radius:var(--rp);font-size:.875rem;font-weight:500;color:var(--tx2);transition:all var(--tf);white-space:nowrap;user-select:none;cursor:pointer}
.nav-item:hover,.nav-item.active{color:var(--p);background:var(--pl)}
.nav-item.active{font-weight:600}
.chevron{transition:transform var(--tf)}
.dd-open .chevron{transform:rotate(180deg)}
/* Dropdown */
.has-dd{position:relative}
/* Görünmez köprü: fareyi menü başlığından dropdown listesine taşırken hover kesintisini önler */
.has-dd::after{content:'';position:absolute;top:100%;left:-20px;right:-20px;height:20px;display:block;pointer-events:all}
.dd-menu{position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%) translateY(-6px);min-width:256px;background:var(--sf);border:1px solid var(--br);border-radius:var(--rlg);box-shadow:var(--sd);padding:8px;opacity:0;pointer-events:none;transition:opacity var(--tm) var(--ez),transform var(--tm) var(--ez);z-index:300}
.has-dd:hover .dd-menu,.has-dd.dd-open .dd-menu{opacity:1;pointer-events:all;transform:translateX(-50%) translateY(0)}
.dd-menu::before{content:'';position:absolute;top:-5px;left:50%;transform:translateX(-50%) rotate(45deg);width:10px;height:10px;background:var(--sf);border-top:1px solid var(--br);border-left:1px solid var(--br)}
.dd-lbl{font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--tx3);padding:6px 10px 4px}
.dd-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--rmd);font-size:.875rem;font-weight:500;color:var(--tx2);transition:all var(--tf)}
.dd-item:hover,.dd-item.active{background:var(--pl);color:var(--p)}
.dd-item.dis{opacity:.4;cursor:not-allowed;pointer-events:none}
.dd-ico{width:32px;height:32px;border-radius:var(--rsm);background:var(--br);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.875rem;transition:background var(--tf)}
.dd-item:hover .dd-ico,.dd-item.active .dd-ico{background:var(--pl)}
.dd-soon{margin-left:auto;font-size:.625rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;background:var(--mu);color:#fff;padding:2px 6px;border-radius:var(--rp)}
/* Mobile */
.menu-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:38px;height:38px;padding:6px;border-radius:var(--rsm);margin-left:auto;transition:background var(--tf)}
.menu-toggle:hover{background:var(--pl)}
.menu-toggle span{display:block;height:2px;background:var(--tx);border-radius:2px;transition:all var(--tm) var(--ez)}
.menu-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-toggle.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.menu-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-nav{display:none;position:fixed;top:var(--hh);left:0;right:0;bottom:0;background:var(--sf);z-index:199;overflow-y:auto;padding:12px 14px 48px;opacity:0;transform:translateX(20px);transition:opacity var(--tm) var(--ez),transform var(--tm) var(--ez);pointer-events:none}
.mobile-nav.open{display:block;opacity:1;transform:translateX(0);pointer-events:all}
/* Direct link (Ana Sayfa) */
.mn-direct{display:flex;align-items:center;gap:10px;padding:14px 16px;border-radius:var(--rmd);font-size:1rem;font-weight:600;color:var(--tx2);background:var(--bg);border:1px solid var(--br);margin-bottom:8px;transition:all var(--tf);min-height:52px}
.mn-direct:hover,.mn-direct.active{color:var(--p);background:var(--pl);border-color:var(--br2)}
/* Accordion wrapper */
.mn-accordion{border-radius:var(--rmd);overflow:hidden;border:1px solid var(--br);margin-bottom:8px;background:var(--sf)}
.mn-accordion.active>.mn-acc-head{color:var(--p)}
/* Accordion header - always visible */
.mn-acc-head{width:100%;display:flex;align-items:center;justify-content:space-between;padding:15px 16px;background:var(--bg);border:none;cursor:pointer;font-size:.9375rem;font-weight:600;color:var(--tx2);font-family:var(--fn);min-height:52px;transition:all var(--tf)}
.mn-accordion.open>.mn-acc-head{color:var(--p);background:var(--pl)}
.mn-acc-label{flex:1;text-align:left}
.mn-acc-chevron{flex-shrink:0;transition:transform var(--tm) var(--ez);color:var(--tx3)}
.mn-accordion.open>.mn-acc-head .mn-acc-chevron{transform:rotate(180deg);color:var(--p)}
/* Accordion body - hidden by default */
.mn-acc-body{max-height:0;overflow:hidden;transition:max-height .3s var(--ez)}
.mn-accordion.open>.mn-acc-body{max-height:400px}
/* Accordion items */
.mn-acc-item{display:flex;align-items:center;gap:12px;padding:13px 16px;font-size:.9rem;font-weight:500;color:var(--tx2);border-top:1px solid var(--br);min-height:48px;transition:all var(--tf);background:var(--sf)}
.mn-acc-item:hover{background:var(--pl);color:var(--p)}
.mn-acc-item.active{background:var(--pl);color:var(--p);font-weight:600}
.mn-acc-item.dis{opacity:.4;pointer-events:none}
.mn-acc-item-ico{font-size:1.125rem;width:28px;text-align:center;flex-shrink:0}
.mn-badge{font-size:.5625rem;font-weight:700;text-transform:uppercase;background:var(--mu);color:#fff;padding:2px 7px;border-radius:var(--rp);margin-left:auto}

/* ---- HERO ---- */
.hero{position:relative;padding:72px 0 40px;overflow:hidden}
.hero-bg{position:absolute;inset:0;pointer-events:none;z-index:0}
.blob{position:absolute;border-radius:50%;filter:blur(80px);opacity:.22}
.blob-1{width:600px;height:600px;background:radial-gradient(circle,#6C63FF 0%,transparent 70%);top:-200px;left:-100px;animation:blobF 8s ease-in-out infinite}
.blob-2{width:500px;height:500px;background:radial-gradient(circle,#4ECDC4 0%,transparent 70%);top:-100px;right:-100px;animation:blobF 10s ease-in-out infinite reverse}
@keyframes blobF{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(20px,30px) scale(1.05)}}
.grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(108,99,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(108,99,255,.05) 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(ellipse 80% 100% at 50% 0%,black 40%,transparent 100%)}
.hero-inner{position:relative;z-index:1;text-align:center;max-width:680px;margin:0 auto}
.eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:.8125rem;font-weight:600;color:var(--p);letter-spacing:.04em;text-transform:uppercase;margin-bottom:18px;background:var(--pl);padding:6px 14px;border-radius:var(--rp);border:1px solid var(--br2)}
.hero-title{font-size:clamp(2rem,5vw,3.4rem);font-weight:800;line-height:1.1;letter-spacing:-.04em;margin-bottom:18px}
.hero-sub{font-size:1.0625rem;color:var(--tx2);line-height:1.65;max-width:520px;margin:0 auto}

/* ---- TOOL LAYOUT ---- */
.main-content{flex:1;padding:40px 0 80px}
.tool-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start;margin-bottom:64px}
.calc-card{background:var(--sf);border-radius:var(--rxl);border:1px solid var(--br);box-shadow:var(--sl);padding:32px;position:relative;overflow:hidden}
.calc-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--p),var(--ac));border-radius:var(--rxl) var(--rxl) 0 0}
.card-hdr{display:flex;align-items:center;gap:14px;margin-bottom:28px}
.card-ico{width:48px;height:48px;border-radius:var(--rmd);background:linear-gradient(135deg,var(--pl),#e8e6ff);display:flex;align-items:center;justify-content:center;color:var(--p);flex-shrink:0;border:1px solid var(--br2)}
.card-ttl{font-size:1.125rem;font-weight:700;letter-spacing:-.02em}
.card-stt{font-size:.8125rem;color:var(--tx3);margin-top:2px}
.inp-grp{margin-bottom:20px}
.inp-lbl{display:flex;align-items:center;gap:6px;font-size:.8125rem;font-weight:600;color:var(--tx2);margin-bottom:8px}
.inp-wrap{position:relative;display:flex;align-items:center}
.cinput{width:100%;height:52px;padding:0 52px 0 16px;font-size:1.0625rem;font-weight:500;font-family:var(--fn);color:var(--tx);background:var(--bg);border:1.5px solid var(--br);border-radius:var(--rmd);transition:all var(--tf);-moz-appearance:textfield}
.cinput::-webkit-inner-spin-button,.cinput::-webkit-outer-spin-button{-webkit-appearance:none}
.cinput::placeholder{color:var(--mu)}
.cinput:hover{border-color:var(--br2)}
.cinput:focus{border-color:var(--p);background:var(--sf);box-shadow:0 0 0 4px rgba(108,99,255,.12)}
.cinput.err{border-color:var(--rd);box-shadow:0 0 0 4px rgba(239,68,68,.1)}
.cinput.no-sfx{padding-right:16px}
.inp-sfx{position:absolute;right:0;top:0;bottom:0;width:48px;display:flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:600;color:var(--tx3);border-left:1px solid var(--br);pointer-events:none;background:rgba(108,99,255,.03);border-radius:0 var(--rmd) var(--rmd) 0}
.inp-hint{display:block;font-size:.75rem;color:var(--tx3);margin-top:5px;padding-left:2px}
.cselect{width:100%;height:52px;padding:0 16px;font-size:1rem;font-weight:500;font-family:var(--fn);color:var(--tx);background:var(--bg);border:1.5px solid var(--br);border-radius:var(--rmd);cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%239896B8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;transition:all var(--tf)}
.cselect:focus{border-color:var(--p);background-color:var(--sf);box-shadow:0 0 0 4px rgba(108,99,255,.12)}
.action-bar{display:flex;gap:10px;margin-top:28px}
.btn-calc{flex:1;height:52px;display:flex;align-items:center;justify-content:center;gap:9px;background:linear-gradient(135deg,var(--p),var(--pd));color:#fff;border-radius:var(--rmd);font-size:1rem;font-weight:700;transition:all var(--tm) var(--ez);box-shadow:0 4px 16px rgba(108,99,255,.35);position:relative;overflow:hidden}
.btn-calc::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.1),transparent 60%)}
.btn-calc:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(108,99,255,.45)}
.btn-calc:active{transform:translateY(0)}
.btn-rst{width:52px;height:52px;display:flex;align-items:center;justify-content:center;border-radius:var(--rmd);background:var(--bg);color:var(--tx2);border:1.5px solid var(--br);transition:all var(--tf)}
.btn-rst:hover{background:var(--rl);color:var(--rd);border-color:var(--rd)}
.err-msg{margin-top:10px;font-size:.8125rem;font-weight:500;color:var(--rd);padding:10px 14px;background:var(--rl);border-radius:var(--rsm);border:1px solid rgba(239,68,68,.2);display:none}
.err-msg.show{display:block}
/* Quick rates */
.quick-rates{margin:4px 0 8px}
.q-lbl{display:block;font-size:.75rem;font-weight:600;color:var(--tx3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}
.q-btns{display:flex;flex-wrap:wrap;gap:7px}
.q-btn{padding:5px 12px;border-radius:var(--rp);font-size:.8125rem;font-weight:600;color:var(--p);background:var(--pl);border:1px solid var(--br2);transition:all var(--tf);font-family:var(--mo)}
.q-btn:hover,.q-btn.active{background:var(--p);color:#fff;border-color:var(--p);transform:translateY(-1px);box-shadow:var(--ss)}
/* Mode tabs */
.mode-tabs{display:flex;gap:6px;background:var(--bg);border-radius:var(--rmd);padding:5px;margin-bottom:28px;border:1px solid var(--br)}
.mode-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;padding:9px 12px;border-radius:var(--rsm);font-size:.8125rem;font-weight:500;color:var(--tx2);transition:all var(--tm) var(--ez);background:transparent}
.mode-tab:hover{color:var(--p)}
.mode-tab.active{background:var(--sf);color:var(--p);font-weight:600;box-shadow:var(--ss);border:1px solid var(--br)}
.cpanel{display:none}.cpanel.active{display:block}

/* ---- RESULT CARD ---- */
.result-card{background:var(--sf);border-radius:var(--rxl);border:1px solid var(--br);box-shadow:var(--sl);min-height:340px;display:flex;flex-direction:column;position:relative;overflow:hidden;transition:box-shadow var(--tm),border-color var(--tm)}
.result-card.has-result{box-shadow:var(--sx);border-color:var(--p)}
.res-ph{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:48px 32px;text-align:center}
.ph-ico{color:var(--mu);animation:pulse 2.5s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:.8;transform:scale(1.04)}}
.res-ph p{font-size:.9375rem;color:var(--tx3);line-height:1.6}
.res-body{padding:32px;display:flex;flex-direction:column;animation:fadeUp var(--ts) var(--ez) both}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.res-badge{display:inline-flex;align-items:center;gap:6px;font-size:.75rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--gn);background:var(--gl);padding:5px 12px;border-radius:var(--rp);border:1px solid rgba(34,197,94,.2);margin-bottom:24px}
.res-lbl{display:block;font-size:.6875rem;font-weight:700;color:var(--tx3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}
.res-val{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;letter-spacing:-.04em;color:var(--p);font-family:var(--mo);line-height:1}
.res-cur{font-size:1.125rem;font-weight:700;color:var(--p);opacity:.7}
.res-tag{display:inline-flex;align-items:center;font-size:.875rem;font-weight:700;color:#fff;background:linear-gradient(135deg,var(--p),var(--ac));padding:5px 14px;border-radius:var(--rp)}
.res-div{height:1px;background:var(--br);margin:18px 0}
.drow{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.drow:last-child{margin-bottom:0}
.dcell{background:var(--bg);border-radius:var(--rmd);padding:12px 14px;border:1px solid var(--br)}
.dcell.hi{background:var(--gl);border-color:rgba(34,197,94,.2)}
.dcell.warn{background:var(--ol);border-color:rgba(249,115,22,.2)}
.dc-lbl{display:block;font-size:.6875rem;font-weight:700;color:var(--tx3);text-transform:uppercase;letter-spacing:.07em;margin-bottom:4px}
.dc-val{display:block;font-size:.9375rem;font-weight:700;color:var(--tx);font-family:var(--mo);letter-spacing:-.02em}
.dc-val.green{color:var(--gn)}.dc-val.orange{color:var(--or)}.dc-val.red{color:var(--rd)}
.bar-wrap{margin-bottom:20px}
.bar-lbls,.bar-pcts{display:flex;justify-content:space-between;font-size:.6875rem;font-weight:700;color:var(--tx3);text-transform:uppercase;letter-spacing:.07em;margin-bottom:5px}
.bar-pcts{font-family:var(--mo);color:var(--tx2);margin-top:5px;margin-bottom:0;text-transform:none}
.pbar{width:100%;height:10px;background:var(--gl);border-radius:var(--rp);overflow:hidden;border:1px solid rgba(34,197,94,.2)}
.pbar-fill{height:100%;background:linear-gradient(90deg,var(--p),var(--ac));border-radius:var(--rp);transition:width .8s var(--ez);width:0%}
.btn-copy{width:100%;height:44px;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:var(--rmd);font-size:.8125rem;font-weight:600;color:var(--tx2);background:var(--bg);border:1.5px solid var(--br);transition:all var(--tf);margin-top:20px}
.btn-copy:hover{background:var(--pl);color:var(--p);border-color:var(--p)}
.btn-copy.copied{background:var(--gl);color:var(--gn);border-color:rgba(34,197,94,.3)}
/* Info */
.info-sec{padding-top:16px}
.sec-ttl{font-size:1.375rem;font-weight:700;letter-spacing:-.03em;margin-bottom:24px;text-align:center}
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}
.info-card{background:var(--sf);border-radius:var(--rlg);padding:24px;border:1px solid var(--br);transition:all var(--tm) var(--ez)}
.info-card:hover{border-color:var(--p);box-shadow:var(--sm);transform:translateY(-2px)}
.inf-num{font-size:2rem;font-weight:800;font-family:var(--mo);color:var(--br2);letter-spacing:-.05em;margin-bottom:12px;line-height:1}
.info-card h3{font-size:.9375rem;font-weight:700;margin-bottom:8px;letter-spacing:-.02em}
.info-card p{font-size:.8125rem;color:var(--tx2);line-height:1.6;margin-bottom:14px}
.formula{background:var(--bg);border-radius:var(--rsm);padding:10px 14px;border:1px solid var(--br)}
.formula code{font-family:var(--mo);font-size:.75rem;color:var(--p);font-weight:500}
/* FOOTER */
.site-footer{background:var(--sf);border-top:1px solid var(--br);padding:28px 0;margin-top:auto}
.footer-in{display:flex;align-items:center;gap:24px;justify-content:space-between;flex-wrap:wrap}
.footer-logo .logo-text{font-size:1rem}
.footer-copy{font-size:.8125rem;color:var(--tx3)}
.footer-nav{display:flex;gap:20px;flex-wrap:wrap}
.footer-nav a{font-size:.8125rem;color:var(--tx3);transition:color var(--tf)}
.footer-nav a:hover{color:var(--p)}
/* Responsive */
@media(max-width:900px){.tool-layout{grid-template-columns:1fr}.site-nav{display:none}.menu-toggle{display:flex}}
@media(max-width:640px){
  :root{--hh:58px}
  .container{padding:0 16px}
  .hero{padding:40px 0 20px}
  .hero-title{font-size:clamp(1.7rem,7vw,2.5rem);letter-spacing:-.03em}
  .hero-sub{font-size:.9375rem}
  .eyebrow{font-size:.6875rem;padding:5px 10px}
  .calc-card,.result-card{padding:18px 14px;border-radius:var(--rlg)}
  .res-body{padding:18px 14px}
  .card-hdr{margin-bottom:20px}
  .card-ico{width:40px;height:40px}
  .card-ttl{font-size:1rem}
  .cinput{height:48px;font-size:1rem}
  .inp-sfx{height:48px}
  .btn-calc,.btn-rst{height:48px}
  .btn-calc{font-size:.9375rem}
  .drow{grid-template-columns:1fr}
  .mode-tab{font-size:.75rem;padding:8px 6px;gap:4px}
  .mode-tab svg{display:none}
  .q-btns{gap:5px}
  .q-btn{padding:5px 9px;font-size:.75rem}
  .main-content{padding:24px 0 60px}
  .tool-layout{gap:16px;margin-bottom:40px}
  .info-grid{gap:12px}
  .info-card{padding:18px}
  .footer-in{flex-direction:column;align-items:flex-start;gap:12px}
  .footer-nav{gap:14px}
  .res-val{font-size:clamp(1.6rem,7vw,2.2rem)}
  .res-lbl{font-size:.625rem}
}
@media(max-width:400px){
  .container{padding:0 12px}
  .hero-title{font-size:1.65rem}
  .calc-card,.result-card{padding:14px 12px}
  .mode-tabs{padding:4px}
  .mode-tab{font-size:.6875rem;padding:7px 4px}
}