/* Acil Uzmanları: eski, mekanik kurum portalı.
   Küçük ve okunur yazı, normal ağırlıklar, çizgiler ve tablolar; iri ve kalın başlık yok.
   Tokenlar DESIGN.md ile aynı. Tek açık tema. */
:root{
  --navy:#173F5E;--navy2:#1F5A85;--link:#1A5C8A;--ink:#1F2B33;--txt:#3B4650;--muted:#5E6A73;
  --line:#C9D2D9;--dot:#9AA8B2;--soft:#F2F5F7;--page:#E2E6E9;--pick:#FFF8DC;--err:#9A2A20;
  --f:"PT Sans","Trebuchet MS",Verdana,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--page);color:var(--txt);font:14.5px/1.55 var(--f);
  padding:22px max(14px,env(safe-area-inset-right,0px)) 30px max(14px,env(safe-area-inset-left,0px))}
::selection{background:#C7DCEB;color:var(--ink)}
a{color:var(--link);text-underline-offset:2px}
a:hover{color:var(--navy)}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--navy2);outline-offset:2px}
[hidden]{display:none!important}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:14px;top:-60px;background:#fff;color:var(--navy);padding:6px 10px;z-index:10}
.skip:focus{top:6px}
.ico{width:1em;height:1em;flex:none;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
ul{list-style:none;margin:0;padding:0}
time{font-variant-numeric:tabular-nums}
p{margin:0}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.box{max-width:1000px;margin:0 auto;background:#fff;border:1px solid #C3CCD3;box-shadow:0 1px 4px rgba(23,63,94,.10)}

/* Düğme: ince kenarlı, hafif geçişli, eski form düğmesi */
.btn{display:inline-block;font:inherit;font-size:13.5px;font-weight:700;line-height:1.2;text-decoration:none;color:#fff;
  background:linear-gradient(#2A6F9E,#1F5A85);border:1px solid #174A6E;border-radius:3px;padding:6px 14px;cursor:pointer;white-space:nowrap}
.btn:hover{background:linear-gradient(#3079AB,#225F8C);color:#fff}
.btn:active{transform:translateY(1px)}
.btn.alt{color:var(--link);background:linear-gradient(#fff,#E8EEF2);border-color:#A9B8C3}
.btn.alt:hover{background:linear-gradient(#fff,#DDE6EC);color:var(--navy)}
.btn.wide{display:block;width:100%;text-align:center}

/* Bant */
.band{background:linear-gradient(100deg,#123754,var(--navy) 55%,#1F4F75);color:#fff;padding:22px 26px 0}
.band-top{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding-bottom:20px}
.word{color:#fff;text-decoration:none;line-height:1}
.word b{display:block;font-size:27px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.word span{display:block;margin-top:7px;font-size:12.5px;letter-spacing:.32em;text-transform:uppercase;color:#D3E2EE}
.word:hover{color:#fff}

/* Sekmeler */
.tabs{display:flex;gap:3px;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs a{flex:none;font-size:13px;font-weight:700;color:#fff;text-decoration:none;padding:7px 13px 6px;border:1px solid rgba(255,255,255,.25);border-bottom:0;border-radius:4px 4px 0 0;background:rgba(5,25,40,.30)}
.tabs a:hover{background:rgba(5,25,40,.5);color:#fff}
.tabs a[aria-current]{background:#fff;color:var(--navy);border-color:#fff}

/* Başlıklar: küçük, noktalı alt çizgi */
.mini{margin:0 0 9px;padding-bottom:4px;border-bottom:1px dashed var(--dot);font-size:13.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--link)}
h1{margin:0 0 8px;font-size:22px;font-weight:700;line-height:1.25;color:var(--ink)}
.sec>h2{margin:0 0 10px;padding-bottom:5px;border-bottom:1px solid var(--line);font-size:18px;font-weight:700;line-height:1.3;color:var(--link)}
h3{margin:0 0 6px;font-size:15px;font-weight:700;color:var(--ink)}

/* Portal: üç sütun */
.portal{display:grid;grid-template-columns:190px minmax(0,1fr) 200px;gap:22px;padding:20px 22px 24px}
.portal>*{min-width:0}
.portal .l,.portal .r{display:flex;flex-direction:column;gap:20px}
.login{display:flex;flex-direction:column;gap:7px;font-size:13px}
.login label{display:flex;flex-direction:column;gap:3px;font-weight:700;color:var(--ink)}
.login input[type=email]{font:inherit;font-weight:400;padding:4px 6px;border:1px solid #A9B6BF;border-radius:2px;color:var(--ink);width:100%}
.login input:focus{outline:2px solid var(--navy2);outline-offset:0}
.login .btn{align-self:flex-start}
.note{font-size:12.5px;line-height:1.4;color:var(--muted)}
.msg{font-size:12.5px;min-height:1em;color:var(--err)}
.help{display:flex;flex-direction:column;gap:4px;font-size:13.5px}
.help a::before{content:"» ";color:var(--dot)}
.portal .c>p{margin:0 0 12px;font-size:15px;line-height:1.55;max-width:62ch}
.acts{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.index{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:22px;border-top:1px solid var(--line)}
.index>div{padding:6px 0 7px;border-bottom:1px dotted var(--dot)}
.index b{font-size:14.5px;font-weight:700;color:var(--ink)}
.index span{display:block;font-size:12.5px;line-height:1.35;color:var(--muted)}
.access{background:var(--soft);border:1px solid var(--line);padding:10px 12px;font-size:13px;line-height:1.45}
.access p{margin-bottom:8px}
.access b{color:var(--ink)}

/* Bölüm iskeleti */
.sec{padding:20px 22px 24px;border-top:1px solid var(--line)}
.sec>.lead{margin:0 0 14px;max-width:70ch;font-size:14.5px}

/* Örnek kart */
.card{border:1px solid #AEBBC5;background:#fff}
.card-head{display:flex;justify-content:space-between;gap:10px;padding:5px 10px;background:linear-gradient(#F4F7F9,#E4EAEF);border-bottom:1px solid #AEBBC5;font-size:12.5px;color:var(--muted)}
.card-head b{color:var(--ink)}
.card-body{padding:14px 14px 12px;min-height:170px;display:flex;flex-direction:column;gap:10px}
.q{font-size:16px;line-height:1.45;color:var(--ink)}
.a{padding-top:9px;border-top:1px dashed var(--dot);display:flex;flex-direction:column;gap:4px}
.a strong{font-size:15.5px;color:var(--link);line-height:1.4}
.a span{font-size:14px}
.card-foot{padding:8px 10px 10px;border-top:1px solid var(--line);background:var(--soft)}
.rates{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
.rates button{font:inherit;font-size:13px;font-weight:700;color:var(--ink);background:linear-gradient(#fff,#E8EEF2);border:1px solid #A9B8C3;border-radius:3px;padding:4px 2px;cursor:pointer;line-height:1.2}
.rates button small{display:block;font-weight:400;font-size:11.5px;color:var(--muted)}
.rates button:hover{background:linear-gradient(#fff,#DDE6EC)}
.study-notes{display:flex;flex-direction:column;gap:6px;font-size:13.5px;line-height:1.4}
.study-notes li{padding-left:14px;position:relative}
.study-notes li::before{content:"»";position:absolute;left:0;color:var(--dot)}

/* Nasıl çalışır: düz numaralı liste */
.steps{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px;font-size:14.5px}
.steps li::marker{font-weight:700;color:var(--link)}
.steps b{color:var(--ink);margin-right:6px}
.steps p{display:inline}

/* Kimler için */
.who{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line)}
.who>div{padding:12px 14px}
.who>div+div{border-left:1px solid var(--line)}
.who h3{padding-bottom:4px;border-bottom:1px dotted var(--dot)}
.who li{padding-left:14px;position:relative;margin-top:4px;font-size:14px}
.who li::before{content:"»";position:absolute;left:0;color:var(--dot)}

/* Fiyat tablosu */
.table-wrap{overflow-x:auto}
.prices{width:100%;max-width:640px;border-collapse:collapse;font-size:14.5px;font-variant-numeric:tabular-nums}
.prices th,.prices td{padding:7px 10px;border:1px solid var(--line);text-align:left;vertical-align:middle}
.prices thead th{background:linear-gradient(#F4F7F9,#E4EAEF);font-size:12.5px;font-weight:700;color:var(--ink);text-transform:uppercase;letter-spacing:.03em}
.prices tbody th{font-weight:700;color:var(--ink);white-space:nowrap}
.prices td{white-space:nowrap}
.prices td:last-child{text-align:right;width:1%}
.prices tr.pick{background:var(--pick)}
.prices tr.pick th,.prices tr.pick td{border-color:#E2CF8F}
.tag{display:inline-block;margin-left:6px;padding:0 6px;font-size:11.5px;font-weight:700;color:#7A5A00;background:#FCEBB1;border:1px solid #E2CF8F;border-radius:2px;vertical-align:1px}
.tnote{margin-top:10px;max-width:640px;font-size:13px;line-height:1.5;color:var(--muted)}

/* Sipariş kutusu: form, havale bilgisi, dekont */
.order{max-width:640px;margin-top:18px;border:1px solid #AEBBC5;background:#fff;scroll-margin-top:12px}
.order-body{padding:14px}
.order-body>p{margin-bottom:10px;max-width:62ch}
.order-body>p:last-child{margin-bottom:0}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px}
.fields .full{grid-column:1/-1}
.order label{display:flex;flex-direction:column;gap:3px;font-size:13px;font-weight:700;color:var(--ink)}
.order input,.order select{font:inherit;font-weight:400;font-size:14.5px;width:100%;padding:5px 7px;border:1px solid #A9B6BF;border-radius:2px;color:var(--ink);background:#fff}
.order input[type=file]{padding:6px;background:var(--soft)}
.order input:focus,.order select:focus{outline:2px solid var(--navy2);outline-offset:0}
.order [aria-invalid=true]{border-color:var(--err)}
.order .msg:empty{display:none}
.order .btn[disabled]{opacity:.6;cursor:default}
.tuzak{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.pay{width:100%;margin-bottom:10px;border-collapse:collapse;font-size:14.5px;font-variant-numeric:tabular-nums}
.pay th,.pay td{padding:7px 10px;border:1px solid var(--line);text-align:left;vertical-align:middle}
.pay th{width:1%;white-space:nowrap;font-size:12.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--ink);background:var(--soft)}
.pay td:last-child{width:1%;text-align:right;border-left:0;padding-left:0}
.pay td:nth-child(2){border-right:0;color:var(--ink);overflow-wrap:anywhere}
.pay span{color:var(--muted)}
.upload{display:flex;flex-direction:column;gap:8px;margin:14px 0 10px;padding-top:12px;border-top:1px dashed var(--dot)}
.later{border-top:1px dashed var(--dot);padding:0 14px}
.later summary{padding:10px 0;font-size:13.5px;color:var(--link);text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.later summary:hover{color:var(--navy)}
.later form{padding:4px 0 14px}
.linkbtn{font:inherit;color:var(--link);background:none;border:0;padding:0;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.linkbtn:hover{color:var(--navy)}

/* SSS */
.faq{border-top:1px solid var(--line);max-width:720px}
.faq details{border-bottom:1px dotted var(--dot)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:12px;padding:8px 0;font-size:14.5px;font-weight:700;color:var(--link)}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ico{font-size:14px;color:var(--muted);transform:translateY(3px)}
.faq details[open] summary .ico{transform:translateY(3px) rotate(45deg)}
.faq summary:hover{text-decoration:underline}
.faq p{margin:0 0 10px;max-width:66ch;font-size:14px}

/* Footer */
.foot{background:var(--navy);color:#C9D7E3;padding:16px 22px 12px;font-size:13px;border-top:4px solid #D5DDE3}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:18px;padding-bottom:12px}
.foot b.name{display:block;font-size:15px;font-weight:700;color:#fff;letter-spacing:.05em;text-transform:uppercase}
.foot p{margin-top:4px;max-width:30ch}
.foot .mini{color:#fff;border-bottom-color:rgba(255,255,255,.3)}
.foot li{margin-top:3px}
.foot a{color:#DCE6F0;text-decoration:none}
.foot a:hover{color:#fff;text-decoration:underline}
.disclaimer{margin:0;padding-top:10px;border-top:1px solid rgba(255,255,255,.18);font-size:12px;line-height:1.5;color:#B8C9D8;max-width:90ch}
.foot-bottom{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:8px;font-size:12px}
.after{height:0}

/* Dar ekran */
@media (max-width:860px){
  .portal{grid-template-columns:1fr}
  .portal>.c{order:1}.portal>.r{order:2}.portal>.l{order:3}
  .index{grid-template-columns:1fr 1fr}
  /* Dokunmatik: düğmeler en az 44px, form yazısı 16px (iOS odaklanınca yakınlaştırmasın) */
  .btn{font-size:15px;padding:12px 16px}
  .rates button{min-height:44px}
  .login input[type=email],.order input,.order select{font-size:16px;min-height:44px}
  .faq summary{padding:12px 0}
  .help{gap:0}.help a,.foot li a{display:inline-block;padding:7px 0}.foot li{margin-top:0}
  .who{grid-template-columns:1fr}.who>div+div{border-left:0;border-top:1px solid var(--line)}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:600px){
  body{padding:0}
  .box{border:0}
  .band{padding:16px 14px 0}.word b{font-size:22px}.word span{letter-spacing:.22em}
  .portal{padding:16px 14px 20px}.sec{padding:16px 14px 20px}.foot{padding:14px 14px 10px}
  .index{column-gap:14px}
  /* Sekmeler kaydırma yerine iki satır: hepsi görünür */
  .tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;overflow:visible;padding-bottom:12px}
  .tabs a{text-align:center;padding:11px 4px;border-bottom:1px solid rgba(255,255,255,.25);border-radius:3px}
  .fields{grid-template-columns:1fr}
  .pay th,.pay td{padding:8px 8px}
  .rates{grid-template-columns:repeat(2,minmax(0,1fr))}
  .prices{font-size:13.5px}.prices th,.prices td{padding:6px 6px}.prices thead th{font-size:11.5px}.tag{display:block;margin:3px 0 0;width:max-content}
  .foot-grid{grid-template-columns:1fr}
}
