/*!
 * AmiralSoft — ortak stil dosyası
 * Renkler: zemin #F3F5F8 · mürekkep #0A0F1A · marka mavisi #1E7FD8 · marka yeşili #9AC43C
 * Yazı tipleri: Montserrat (başlık), Inter (metin)
 * Not: Bileşen stilleri HTML içinde satır içi (inline) tutulmuştur; bu dosya ortak kuralları,
 * animasyonları ve ekran boyutu (responsive) ayarlarını içerir.
 */

/* ===== index.html ===== */
body{margin:0;background:#F3F5F8;color:#0A0F1A;font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:hover{opacity:.75}
@keyframes words{0%,20%{transform:translateY(0)}25%,45%{transform:translateY(-20%)}50%,70%{transform:translateY(-40%)}75%,95%{transform:translateY(-60%)}100%{transform:translateY(-80%)}}
.words{animation:words 11s cubic-bezier(.7,0,.2,1) infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.spin{transform-box:fill-box;transform-origin:center;animation:spin 40s linear infinite}
.spin-r{transform-box:fill-box;transform-origin:center;animation:spin 26s linear infinite reverse}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(154,196,60,.55)}100%{box-shadow:0 0 0 10px rgba(154,196,60,0)}}
.pulse{animation:pulse 2s ease-out infinite}
@keyframes glow{0%,100%{opacity:.35}50%{opacity:1}}
.glow{animation:glow 2.4s ease-in-out infinite}
.glow2{animation-delay:.8s}
.glow3{animation-delay:1.6s}
@keyframes flow{to{stroke-dashoffset:-24}}
.flow{stroke-dasharray:4 8;animation:flow 1.2s linear infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.bob{animation:bob 4s ease-in-out infinite}
@keyframes cur{0%,100%{transform:translate(0,0)}40%{transform:translate(-60px,-20px)}70%{transform:translate(-20px,12px)}}
.cur{animation:cur 6s ease-in-out infinite}
@keyframes barup{0%,10%{transform:scaleY(.15)}45%,85%{transform:scaleY(1)}100%{transform:scaleY(.15)}}
.barup{transform-box:fill-box;transform-origin:bottom;animation:barup 5s cubic-bezier(.2,.7,.2,1) infinite}
@keyframes blink{50%{opacity:0}}
.caret{animation:blink 1s steps(1) infinite}
@keyframes type{0%{transform:scaleX(0)}40%,100%{transform:scaleX(1)}}
.type{transform-box:fill-box;transform-origin:left;animation:type 4s ease-out infinite}
@keyframes marquee{to{transform:translateX(-50%)}}
.marquee{display:flex;width:max-content;animation:marquee 50s linear infinite}
.marquee-wrap:hover .marquee{animation-play-state:paused}
.slide{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(.9) translateY(14px);transition:opacity .7s ease,transform 1s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.slide.on{opacity:1;transform:none}
.slide-cap{position:absolute;left:0;right:0;bottom:9%;text-align:center;opacity:0;transform:translateY(10px);transition:opacity .6s .25s,transform .6s .25s}
.slide.on .slide-cap{opacity:1;transform:none}
.tab{color:#7D8698;transition:color .3s}
.tab.on,.tab:hover{color:#FFFFFF}
.bar{transform:scaleX(0);transform-origin:left}
@keyframes fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.bar.on{animation:fill 5s linear forwards}
.tile{transition:transform .6s cubic-bezier(.2,.7,.2,1),box-shadow .6s}
.tile:hover{transform:translateY(-6px);box-shadow:0 28px 56px rgba(10,15,26,.10);opacity:1}
.pill{transition:background .25s,color .25s,border-color .25s,transform .25s}
.pill:hover{transform:translateY(-2px)}
.mcard{transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.mcard:hover{transform:translateY(-4px);opacity:1}
@keyframes blockin{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
.blockin{animation:blockin .5s cubic-bezier(.2,.7,.2,1) both}
@keyframes up{from{opacity:0;transform:translateY(44px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){.reveal{animation:up linear both;animation-timeline:view();animation-range:entry 0% entry 70%}}
.menu-btn{display:none;cursor:pointer}
@media (min-width:1800px){[style*="max-width: 1360px"]{max-width:1520px !important}[style*="max-width: 1408px"]{max-width:1568px !important}}
@media (max-width:1100px){
  .nav-links{display:none !important}
  .menu-btn{display:flex !important}
  .site-header.nav-open .nav-links{
    display:flex !important;
    flex-direction:column;
    align-items:flex-start !important;
    gap:16px !important;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    background:rgba(243,245,248,.98);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    padding:24px 32px 28px;
    border-bottom:1px solid rgba(10,15,26,.12);
    box-shadow:0 20px 40px rgba(10,15,26,.08);
    z-index:99;
    font-size:16px !important;
  }
  .stage{max-width:520px !important}
  .sec{padding-top:120px !important}
}
@media (max-width:760px){
[style*="max-width: 1360px"]{padding-left:20px !important;padding-right:20px !important}
header [style*="height: 76px"]{height:64px !important}
.hide-sm{display:none !important}
.sec{padding-top:88px !important}
.hero-h1{font-size:40px !important}
.stats{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
.tab-n{display:none}
[style*="padding: 36px"]{padding:24px !important}
[style*="min-height: 420px"]{min-height:0 !important}
.mcard{width:240px !important}
}
@media (prefers-reduced-motion: reduce){*{animation:none !important;transition:none !important}}

/* ===== hizmetler.html ===== */
.wrap{max-width:1360px;margin:0 auto;padding-left:32px;padding-right:32px}
@keyframes swap{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.swap{animation:swap .55s cubic-bezier(.2,.7,.2,1) both}
.svc{transition:background .3s,color .3s,padding .3s}
.svc:hover{padding-left:26px !important}
@media (min-width:1800px){.wrap{max-width:1520px}}
@media (max-width:1100px){.nav-links{display:none !important}.menu-btn{display:flex !important}}
@media (max-width:760px){.wrap{padding-left:20px;padding-right:20px}.hide-sm{display:none !important}[style*="padding: 36px"]{padding:24px !important}}

/* ===== yapay-zeka.html ===== */
@keyframes c1{0%,3%{opacity:0;transform:translateY(10px)}8%,90%{opacity:1;transform:none}96%,100%{opacity:0}}
@keyframes c2{0%,20%{opacity:0;transform:translateY(10px)}25%,90%{opacity:1;transform:none}96%,100%{opacity:0}}
@keyframes c3{0%,40%{opacity:0;transform:translateY(10px)}45%,90%{opacity:1;transform:none}96%,100%{opacity:0}}
@keyframes c4{0%,58%{opacity:0;transform:translateY(10px)}63%,90%{opacity:1;transform:none}96%,100%{opacity:0}}
.m1{animation:c1 14s ease-out infinite both}
.m2{animation:c2 14s ease-out infinite both}
.m3{animation:c3 14s ease-out infinite both}
.m4{animation:c4 14s ease-out infinite both}
@keyframes dots{0%,100%{opacity:.25}50%{opacity:1}}
.dot{animation:dots 1.2s ease-in-out infinite}
.dot2{animation-delay:.2s}
.dot3{animation-delay:.4s}
.grow{transition:width .6s cubic-bezier(.2,.7,.2,1)}
@media (prefers-reduced-motion: reduce){*{animation:none !important;transition:none !important}.m1,.m2,.m3,.m4{opacity:1 !important}}

/* ===== projeler.html ===== */
@keyframes pfloat{0%,100%{transform:translateY(0) rotate(-18deg)}50%{transform:translateY(-10px) rotate(-18deg)}}
.fb{animation:pfloat 6s ease-in-out infinite}
@keyframes pbob{0%,100%{transform:translateY(0) rotate(8deg)}50%{transform:translateY(-12px) rotate(8deg)}}
.pbob{animation:pbob 5s ease-in-out infinite}
@keyframes scan{0%,100%{transform:translateY(0)}50%{transform:translateY(58px)}}
.scan{animation:scan 2.6s ease-in-out infinite}

/* ===== dijital-test.html ===== */
.q{transition:box-shadow .3s}
.q:hover{box-shadow:0 12px 30px rgba(10,15,26,.06)}
@media (max-width:760px){.wrap{padding-left:20px;padding-right:20px}.hide-sm{display:none !important}}

/* ===== hakkimizda.html ===== */
@keyframes ring{from{transform:scale(.4);opacity:.9}to{transform:scale(3.2);opacity:0}}
.ring{transform-box:fill-box;transform-origin:center;animation:ring 2.6s ease-out infinite}
.ring2{animation-delay:1.3s}
.row{transition:padding .5s cubic-bezier(.2,.7,.2,1)}
.row:hover{padding-left:16px !important}

/* ===== iletisim.html ===== */
.field{width:100%;box-sizing:border-box;height:52px;border:1px solid #DDE2E9;border-radius:14px;padding:0 16px;font:400 15px Inter,sans-serif;background:#FFFFFF;color:#0A0F1A}
.lbl{display:flex;flex-direction:column;gap:8px;font-size:13px;color:#3A4252}

/* ===== Alt Sayfalar (Hizmet Detay, Proje Detay, Blog, SSS, Yasal) ===== */
@media (max-width:960px){
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .sub-grid-3{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .sub-grid-2{grid-template-columns:1fr !important}
}
@media (max-width:600px){
  .footer-grid{grid-template-columns:1fr !important}
  .sub-grid-3{grid-template-columns:1fr !important}
}
.prose h2{font-family:'Montserrat',sans-serif;font-weight:700;font-size:clamp(22px,2.4vw,30px);letter-spacing:-0.025em;line-height:1.25;color:#0A0F1A;margin:40px 0 16px}
.prose h3{font-family:'Montserrat',sans-serif;font-weight:700;font-size:clamp(18px,1.8vw,22px);letter-spacing:-0.02em;line-height:1.3;color:#0A0F1A;margin:32px 0 12px}
.prose h4{font-family:'Montserrat',sans-serif;font-weight:600;font-size:17px;color:#0A0F1A;margin:24px 0 10px}
.prose p{font-size:16px;line-height:1.75;color:#3A4252;margin:0 0 18px}
.prose ul,.prose ol{margin:0 0 24px;padding-left:20px;color:#3A4252;font-size:15.5px;line-height:1.75}
.prose li{margin-bottom:8px}
.prose blockquote{margin:28px 0;padding:24px 28px;background:#FFFFFF;border-left:4px solid #9AC43C;border-radius:0 18px 18px 0;font-size:16px;line-height:1.7;color:#0A0F1A;font-weight:500}
.prose strong{color:#0A0F1A;font-weight:600}
details > summary{list-style:none}
details > summary::-webkit-details-marker{display:none}

/* Masaüstü ölçekleme: 1080p ve laptop ekranlarda tasarımı 2K ekrandaki oranlarla göster */
@media (min-width:1101px) and (max-width:2199px){html{zoom:.85}}

.shot{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.tile:hover .shot{transform:scale(1.03)}

