/* TEMA 3 · DEVRE KARTI — açık zemin, logo renkleri (lacivert + kırmızı), kesik köşeli paneller */
:root{--bg:#f4f7fb;--k:#fff;--ink:#0b1730;--t:#3d4a63;--m:#6c7a93;--b:#1e40a0;--o:#ee3e36;--cizgi:#dfe6f1;--kes:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%)}
body{background:var(--bg);color:var(--t);font:16px/1.75 Sora,system-ui,sans-serif}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.5;background-image:linear-gradient(var(--cizgi) 1px,transparent 1px),linear-gradient(90deg,var(--cizgi) 1px,transparent 1px);background-size:44px 44px;-webkit-mask:radial-gradient(ellipse at 50% 0,#000 20%,transparent 75%);mask:radial-gradient(ellipse at 50% 0,#000 20%,transparent 75%)}
.etiket,.logo-ad,.kart-no,.adim-no,.deger-no,.serit,.ust-etiket{font-family:Orbitron,sans-serif}
::selection{background:var(--b);color:#fff}

.ust{background:rgba(244,247,251,.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--cizgi)}
.logo-ad{font-weight:800;font-size:16px;color:var(--ink);letter-spacing:1px}
.menu{font-size:14px;font-weight:500}
.menu a:not(.btn){color:var(--t);position:relative}
.menu a:not(.btn)::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:var(--o);transition:.25s}
.menu a:not(.btn):hover::after,.menu a.aktif::after{width:100%}
.menu a.aktif{color:var(--ink)}
@media (max-width:1000px){.menu{background:var(--bg);border-bottom:1px solid var(--cizgi)}.menu a:not(.btn)::after{bottom:8px}}

.btn{padding:13px 24px;font-weight:600;font-size:14px;color:var(--ink);background:var(--k);border:1px solid var(--cizgi);clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.btn:hover{border-color:var(--b);color:var(--b)}
.btn-dolu,.menu .btn-giris{background:var(--b);color:#fff;border-color:var(--b)}
.btn-dolu:hover,.menu .btn-giris:hover{background:var(--ink);border-color:var(--ink);color:#fff}

/* Hero */
.hero{padding:60px 0 30px;position:relative;z-index:1}
.hero-ic{display:grid;grid-template-columns:1.05fr 1fr;gap:40px;align-items:center}
.ust-etiket{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:12px;letter-spacing:2px;color:var(--b);padding:8px 14px;border:1px solid rgba(30,64,160,.25);background:rgba(30,64,160,.05);margin-bottom:24px}
.ust-etiket b{width:7px;height:7px;background:var(--o);animation:yanip 1.2s infinite}
@keyframes yanip{50%{opacity:.2}}
.hero h1{font:800 clamp(36px,5.2vw,68px)/1.06 Sora;color:var(--ink);letter-spacing:-2px}
.hero h1 em{font-style:normal;color:var(--b);position:relative;z-index:0}
.hero h1 em::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:10px;background:var(--o);opacity:.25;z-index:-1}
.hero p{font-size:18px;margin:24px 0 34px;max-width:560px}
.cta{display:flex;gap:12px;flex-wrap:wrap}
.cip svg{width:100%;height:auto;display:block}
.cip .iz{fill:none;stroke:#c9d5e8;stroke-width:2}
.cip .akim{fill:none;stroke:var(--b);stroke-width:2.4;stroke-dasharray:14 400;animation:akis 3.2s linear infinite}
.cip .akim.k{stroke:var(--o);animation-duration:4.1s}
@keyframes akis{from{stroke-dashoffset:414}to{stroke-dashoffset:0}}
.cip .ped{fill:#fff;stroke:#b6c4db;stroke-width:2}
.serit{display:flex;gap:14px 40px;justify-content:center;flex-wrap:wrap;margin-top:40px;padding:22px;background:var(--ink);font-weight:600;font-size:13px;letter-spacing:3px}
.serit a{color:#fff;text-decoration:none}
.serit a::before{content:"◆ ";color:var(--o)}
.serit a:hover{color:#9db4ff}

/* Bölümler */
.bolum{z-index:1}
.etiket{display:flex;align-items:center;gap:12px;font-weight:600;font-size:12px;letter-spacing:3px;color:var(--o);margin-bottom:14px;text-transform:uppercase}
.etiket::before{content:"";width:34px;height:2px;background:var(--o)}
.baslik,.sayfa-baslik h1{font:800 clamp(28px,3.6vw,46px)/1.12 Sora;color:var(--ink);letter-spacing:-1px}
.giris{color:var(--ink)}
.deger-serit li{padding:8px 16px;background:var(--ink);color:#fff;font:600 13px Orbitron;letter-spacing:1px}
.deger-serit li:nth-child(even){background:var(--b)}

.kart,.yan-kutu,.form-kutu,.adim,.bilgi{background:var(--k);border:1px solid var(--cizgi)}
.kart{padding:32px;clip-path:var(--kes)}
.kart:hover{border-color:var(--b);box-shadow:0 24px 60px rgba(11,23,48,.08);transform:translateY(-4px)}
.kart h3{font-size:20px;line-height:1.3;color:var(--ink)}
.kart h3 a:hover{color:var(--b)}
.kart-oz{color:var(--b);font-size:14px;font-weight:600}
.kart p{font-size:15px}
.kart-ikon{background:rgba(30,64,160,.08);color:var(--b)}
.kart-no{font-weight:800;font-size:14px;color:#c3cde0}
.kart-link{color:var(--o)}
.maddeler{font-size:14px;font-weight:500;color:var(--ink)}
.maddeler li::before{content:"▸";color:var(--o)}
.kart-genis .maddeler{background:var(--bg);padding:20px;border-left:3px solid var(--b)}

.bolum-koyu{background:var(--ink);color:#b8c6e3}
.bolum-koyu .baslik{color:#fff}
.bolum-koyu .izgara-4{gap:1px;background:rgba(255,255,255,.08)}
.deger{background:var(--ink);padding:36px 28px;transition:.3s}
.deger:hover{background:#13285a}
.deger-harf{display:none}
.deger-no{font-weight:800;font-size:13px;color:var(--o);letter-spacing:2px}
.deger h3{font:700 26px Sora;color:#fff;margin:14px 0 10px}
.deger p{font-size:14.5px}
.adim{padding:28px}
.surec .adim:not(:last-child)::after{content:"";position:absolute;top:50%;right:-19px;width:20px;height:2px;background:var(--b)}
.adim-no{font-weight:800;font-size:34px;color:var(--b)}
.adim h3{font:700 19px Sora;color:var(--ink);margin:6px 0}
.adim p{font-size:14.5px}

.vurgu-kutu{position:relative;background:linear-gradient(135deg,#0b1730,#183a8f);color:#fff;padding:40px 34px;clip-path:polygon(24px 0,100% 0,100% calc(100% - 24px),calc(100% - 24px) 100%,0 100%,0 24px);overflow:hidden}
.vurgu-kutu::before{content:"";position:absolute;inset:-50%;background:conic-gradient(from 0deg,transparent,rgba(80,140,255,.35),transparent 30%);animation:don 6s linear infinite}
@keyframes don{to{transform:rotate(360deg)}}
.vurgu-kutu>*{position:relative}
.vurgu-kutu span{display:block;font:800 44px/1.1 Orbitron}
.vurgu-kutu em{font-style:normal;color:var(--o)}
.vurgu-kutu p{color:#b8c6e3;margin-top:18px;font-size:15px}
.yan-kutu{padding:28px;clip-path:var(--kes)}
.yan-kutu h3{color:var(--ink);font-size:19px;margin-bottom:14px}
.yan-kutu.vurgu{background:var(--ink);color:#b8c6e3;border-color:var(--ink)}
.yan-kutu.vurgu h3{color:#fff}
.yan-kutu.vurgu .btn-dolu{background:var(--o);border-color:var(--o)}
.cta-bant{background:linear-gradient(120deg,var(--b),#132c75);color:#dbe6ff;padding:60px 50px;clip-path:polygon(30px 0,100% 0,100% calc(100% - 30px),calc(100% - 30px) 100%,0 100%,0 30px)}
.cta-bant .baslik{color:#fff}
.cta-bant .etiket{color:#ffb3ae}.cta-bant .etiket::before{background:#ffb3ae}
.cta-bant .btn-dolu{background:var(--o);border-color:var(--o)}
.cta-bant .btn{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.25)}

.sayfa-baslik{background:linear-gradient(180deg,transparent,rgba(30,64,160,.04));border-bottom:1px solid var(--cizgi)}
.sayfa-baslik h1{font-size:clamp(32px,4.6vw,58px)}
.yol{color:var(--m)}
.yol a:hover{color:var(--b)}
.yol b{color:var(--o);font-weight:600}

.bilgi{color:var(--ink);font-weight:500}
.bilgi:hover{border-color:var(--b)}
.bilgi .ikon{color:var(--o)}
.harita{border:1px solid var(--cizgi);padding:8px;background:var(--k);clip-path:var(--kes)}
.form-kutu{padding:44px;clip-path:var(--kes)}
.alan label{color:var(--ink)}
.alan input,.alan select,.alan textarea{background:var(--bg);border:1px solid var(--cizgi);color:var(--ink)}
.alan input:focus,.alan select:focus,.alan textarea:focus{border-color:var(--b);box-shadow:0 0 0 3px rgba(30,64,160,.12)}

.alt{background:var(--ink);color:#9fb0cf}
.alt .logo-ad{color:#fff}
.alt-menu h4{color:#fff;font-family:Orbitron;font-size:12px}
.alt-menu a:hover{color:#fff}
.alt-cizgi{border-top:1px solid rgba(255,255,255,.1);color:#7f90b0}

@media (max-width:1000px){.hero-ic{grid-template-columns:1fr}.surec .adim::after{display:none}.cta-bant{padding:40px 26px}.form-kutu{padding:28px}.vurgu-kutu span{font-size:34px}}