/* İnci Bilişim — ortak tasarım (statik sayfalar). Ölçüt: React sitesi (src/index.css, Navbar.tsx, Footer.tsx).
   Üretici: scripts/ortak-tasarim.mjs. Bu dosyayı elle değil, scripts/ortak/ib-ortak.css kaynağından düzenleyin. */

/* ── Yazı tipleri (kendi sunucumuzdan, Google Fonts'a bağımlılık yok) ── */
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:400;font-display:swap;src:url(/ib-fonts/plus-jakarta-sans-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:400;font-display:swap;src:url(/ib-fonts/plus-jakarta-sans-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:600;font-display:swap;src:url(/ib-fonts/plus-jakarta-sans-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:600;font-display:swap;src:url(/ib-fonts/plus-jakarta-sans-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:700;font-display:swap;src:url(/ib-fonts/plus-jakarta-sans-latin-ext-700-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:700;font-display:swap;src:url(/ib-fonts/plus-jakarta-sans-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:200 800;font-display:swap;src:url(/ib-fonts/bricolage-grotesque-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:200 800;font-display:swap;src:url(/ib-fonts/bricolage-grotesque-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ── Renk ölçütü (React: --background, --primary, --secondary...) ── */
:root{
  --ib-bg:hsl(40 20% 97%);--ib-fg:hsl(220 30% 15%);--ib-primary:hsl(220 40% 25%);--ib-primary-dark:hsl(220 40% 18%);
  --ib-secondary:hsl(30 40% 60%);--ib-muted:hsl(40 20% 92%);--ib-muted-fg:hsl(220 20% 40%);--ib-border:hsl(220 20% 85%);
  --ib-sans:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;--ib-display:"Bricolage Grotesque","Plus Jakarta Sans",system-ui,sans-serif;

  /* Şablonların kendi renk değişkenlerini ölçüte bağlar (bu dosya şablon stilinden SONRA yüklenir) */
  --navy:var(--ib-primary);--navy-dark:var(--ib-primary-dark);--gold:var(--ib-secondary);--gold-light:hsl(30 40% 66%);--gold-bg:hsl(30 40% 92%);
  --bg:var(--ib-bg);--white:#fff;--text:var(--ib-fg);--text-mid:hsl(220 20% 32%);--text-light:var(--ib-muted-fg);--text-soft:var(--ib-muted-fg);
  --border:var(--ib-border);--card-border:var(--ib-border);--green:hsl(150 40% 32%);
  --edge-red:var(--ib-primary);--edge-red-dark:var(--ib-primary-dark);--edge-red-light:var(--ib-muted);--cream:var(--ib-muted);--ink:var(--ib-fg);
  /* --muted bilerek bağlanmadı: Edge şablonunda metin, eLogo şablonunda zemin rengi olarak farklı anlamda kullanılıyor */
}

/* ── Tipografi ── */
html{-webkit-text-size-adjust:100%}
body{background:var(--ib-bg)!important;color:var(--ib-fg);margin:0}
body,body *:not(code):not(pre):not(kbd):not(samp):not(.mono):not(svg):not(svg *){font-family:var(--ib-sans)!important}
body h1,body h2,body h3{font-family:var(--ib-display)!important;font-weight:700!important;letter-spacing:-.01em}
body h4,body h5{font-family:var(--ib-display)!important;font-weight:600!important}
body h1 em,body h2 em{font-style:italic;font-weight:400;color:var(--ib-secondary)}
body code,body pre,body kbd,body samp,body .mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace!important}
button,input,select,textarea{font-family:inherit}

/* ── Düğmeler: React ile aynı keskin köşe ── */
.btn,.btn-navy,.btn-outline,.btn-white,.btn-primary,.btn-info,.btn-whatsapp,.btn-outline-white,.btn-tel,.header-cta,.birinci{border-radius:0!important}
.hero-badge,.hero-tag,.hero-edge .badge,.badge{border-radius:0!important}

/* ── Ortak üst kısım (React Navbar.tsx ile aynı) ── */
.ib-header{position:sticky;top:0;z-index:1000;width:100%;background:hsl(40 20% 97% / .95);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--ib-border);padding:12px 0;box-sizing:border-box;text-align:left}
.ib-header *,.ib-footer *{box-sizing:border-box}
/* Şablonların gövde satır yüksekliği/harf aralığı üst-alt kısma bulaşmasın: React (Tailwind text-sm = 14px/20px) ile aynı ölçü */
.ib-header,.ib-header *,.ib-footer *{line-height:20px;letter-spacing:normal}
.ib-header,.ib-footer{font-size:14px;font-style:normal}
.ib-header *{text-transform:none}
.ib-header a{text-decoration:none}
.ib-in{width:100%;max-width:1400px;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
@media(min-width:768px){.ib-in{padding:0 32px}}
@media(min-width:1280px){.ib-in{padding:0 40px}}
.ib-logo{display:flex;align-items:center}
.ib-logo img{height:36px;width:auto;display:block}
.ib-nav{display:none;align-items:center;gap:4px;font-size:14px;font-weight:500;white-space:nowrap}
@media(min-width:1280px){.ib-nav{display:flex}}
.ib-nav>a,.ib-dd>span{display:flex;align-items:center;gap:4px;padding:8px 12px;color:hsl(220 30% 15% / .7);border-radius:0;cursor:pointer;transition:color .15s}
.ib-nav>a:hover,.ib-dd:hover>span,.ib-dd:focus-within>span{color:var(--ib-primary)}
.ib-dd{position:relative}
.ib-dd>span svg{width:13px;height:13px;transition:transform .2s}
.ib-dd:hover>span svg,.ib-dd:focus-within>span svg{transform:rotate(180deg)}
.ib-menu{display:none;position:absolute;top:100%;left:0;padding-top:4px;z-index:60}
.ib-dd:hover .ib-menu,.ib-dd:focus-within .ib-menu{display:block}
.ib-menu-in{width:208px;background:var(--ib-bg);border:1px solid var(--ib-border);box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);padding:4px 0}
.ib-menu-in a{display:block;padding:10px 16px;font-size:14px;font-weight:500;color:hsl(220 30% 15% / .7);transition:color .15s,background .15s}
.ib-menu-in a:hover{color:var(--ib-primary);background:var(--ib-muted)}
.ib-act{display:flex;align-items:center;gap:12px}
.ib-btn{display:none;align-items:center;gap:8px;padding:10px 20px;font-size:14px;font-weight:600;line-height:20px;border-radius:0;white-space:nowrap;transition:background .15s}
.ib-btn svg{width:15px;height:15px}
@media(min-width:640px){.ib-btn{display:flex}}
.ib-btn.t{background:var(--ib-secondary);color:#fff}.ib-btn.t:hover{background:hsl(30 40% 54%)}
.ib-btn.p{background:var(--ib-primary);color:#fff}.ib-btn.p:hover{background:var(--ib-primary-dark)}
.ib-chk{position:absolute;opacity:0;pointer-events:none}
.ib-burger{display:flex;padding:8px;color:var(--ib-primary);cursor:pointer;line-height:0}
.ib-burger svg{width:22px;height:22px}
@media(min-width:1280px){.ib-burger{display:none}}
.ib-burger .x{display:none}
.ib-chk:checked~.ib-in .ib-burger .m{display:none}.ib-chk:checked~.ib-in .ib-burger .x{display:block}
.ib-mob{display:none;background:var(--ib-bg);border-top:1px solid var(--ib-border);padding:12px 24px;font-size:14px;font-weight:500;max-height:80vh;overflow-y:auto;margin-top:0}
.ib-chk:checked~.ib-mob{display:block}
@media(min-width:1280px){.ib-mob,.ib-chk:checked~.ib-mob{display:none}}
.ib-mob>a,.ib-mob summary{display:flex;align-items:center;justify-content:space-between;padding:12px 0;color:hsl(220 30% 15% / .7);border-bottom:1px solid hsl(220 20% 85% / .5);cursor:pointer;list-style:none}
.ib-mob summary::-webkit-details-marker{display:none}
.ib-mob summary svg{width:14px;height:14px;transition:transform .2s}
.ib-mob details[open] summary svg{transform:rotate(180deg)}
.ib-mob details a{display:block;padding:10px 0 10px 16px;color:hsl(220 30% 15% / .6);border-bottom:1px solid hsl(220 20% 85% / .2)}
.ib-mob .b{display:block;margin-top:12px;padding:12px 16px;text-align:center;font-weight:600;border-radius:0;color:#fff;border:0}
.ib-mob .b.t{background:var(--ib-secondary)}.ib-mob .b.p{background:var(--ib-primary);margin-top:8px}

/* ── Fiyat listelerinden ilgili ürün sayfasına dönüş ── */
.ib-price-back{width:100%;background:var(--ib-bg);border-bottom:1px solid var(--ib-border);font-family:var(--ib-sans);font-size:14px}
.ib-price-back-in{width:100%;max-width:1400px;margin:0 auto;padding:12px 24px}
.ib-price-back a{display:inline-flex;align-items:center;gap:8px;color:var(--ib-primary);font-weight:700;text-decoration:none;line-height:20px;transition:color .15s}
.ib-price-back a:hover{color:var(--ib-secondary)}
.ib-price-back a span{font-size:18px;line-height:1}
@media(min-width:768px){.ib-price-back-in{padding-left:32px;padding-right:32px}}
@media(min-width:1280px){.ib-price-back-in{padding-left:40px;padding-right:40px}}

/* ── Ortak alt kısım (React Footer.tsx ile aynı) ── */
.ib-footer{background:var(--ib-primary);color:#fff;font-size:14px;line-height:20px;text-align:left;clear:both}
.ib-footer a{text-decoration:none;color:inherit}
/* Alt kısım kutusu = React Footer.tsx'teki Tailwind "container mx-auto px-6 md:px-12" (kırılımlı genişlik) */
.ib-fw,.ib-ct{width:100%;margin:0 auto;padding:0 24px}
@media(min-width:640px){.ib-fw,.ib-ct{max-width:640px}}
@media(min-width:768px){.ib-fw,.ib-ct{max-width:768px;padding:0 48px}}
@media(min-width:1024px){.ib-fw,.ib-ct{max-width:1024px}}
@media(min-width:1280px){.ib-fw,.ib-ct{max-width:1280px}}
@media(min-width:1536px){.ib-fw,.ib-ct{max-width:1536px}}
.ib-fgrid{display:grid;grid-template-columns:1fr;gap:40px;padding-top:56px;padding-bottom:56px}
@media(min-width:640px){.ib-fgrid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.ib-fgrid{grid-template-columns:repeat(5,1fr)}}
.ib-footer img.fl{height:36px;width:auto;display:block;margin-bottom:16px}
.ib-footer p.fa{color:rgb(255 255 255 / .6);margin:0 0 20px;line-height:1.7}
.ib-fi{display:flex;flex-direction:column;gap:12px;color:rgb(255 255 255 / .65)}
.ib-fi a,.ib-fi div{display:flex;align-items:flex-start;gap:8px}
.ib-fi a:hover{color:var(--ib-secondary)}
.ib-fi svg{width:14px;height:14px;flex:none;margin-top:4px}
.ib-fi .k{font-size:12px;color:rgb(255 255 255 / .4)}
.ib-footer h3{font-size:14px;font-weight:700;color:#fff!important;margin:0 0 16px;text-transform:uppercase;letter-spacing:.05em;font-family:var(--ib-sans)!important}
.ib-footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ib-footer li a{color:rgb(255 255 255 / .6)}.ib-footer li a:hover{color:var(--ib-secondary)}
.ib-fbar{border-top:1px solid rgb(255 255 255 / .1);padding:20px 0;font-size:12px;color:rgb(255 255 255 / .4)}
.ib-fbar .ib-fw{display:flex;flex-direction:column;gap:12px;justify-content:space-between;align-items:center}
@media(min-width:640px){.ib-fbar .ib-fw{flex-direction:row}}

/* ── Sayfa gövdesi: şablonlar arası ortak mantık ── */
/* Hero: React iç sayfalarındaki gibi soldan hizalı, ortak renk dili */
.hero,.hero-edge{border-radius:0}
.hero .hero-logo{display:none}
.breadcrumb,.breadcrumb-inner{font-family:var(--ib-sans)}
.alert-bar{border-radius:0}

/* ── Dar ekran güvenliği: şablonlarda mobil kural olmayan ızgara ve tablolar sayfayı yatay taşırmasın ── */
img,video,iframe{max-width:100%}
@media(max-width:700px){
  .service-grid,.card-grid{grid-template-columns:1fr!important}
  .service-card,.card{min-width:0}
  table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
