/* ============================================================
   YKA Grup — Ortak bölüm bileşenleri (group.css)
   Açık editöryel + koyu teknoloji bandı + grup nav/footer
   ============================================================ */

/* ---- Grup Nav ---- */
.gnav{position:sticky;top:0;z-index:var(--z-sticky);display:flex;align-items:center;
  justify-content:space-between;padding:16px clamp(20px,5vw,44px);background:#fff;
  border-bottom:1px solid var(--color-border)}
.gnav .logo{font-family:var(--font-display);font-weight:600;font-size:21px;
  color:var(--color-primary);letter-spacing:.02em;text-decoration:none}
.gnav .logo b{color:var(--color-accent)}
.gnav .links{display:flex;gap:26px;align-items:center}
.gnav .links a{font-size:14px;color:#475569;font-weight:500;text-decoration:none}
.gnav .links a:hover{color:var(--color-primary)}
.gnav .cta{background:var(--color-primary);color:#fff !important;padding:9px 18px;
  border-radius:var(--radius-sm);font-size:13.5px;font-weight:600}

/* ---- Editöryel açık bölüm ---- */
.editorial{background:#fff}
.editorial.alt{background:var(--color-surface-alt)}
.editorial .eyebrow,.tech .eyebrow{font:600 12px var(--font-body);letter-spacing:.2em;
  text-transform:uppercase;color:var(--color-accent);margin-bottom:18px}
.editorial h2{font-family:var(--font-display);font-weight:600;color:var(--color-primary);
  font-size:var(--text-4xl);line-height:1.1;letter-spacing:-.01em;margin:0 0 18px}
.editorial p{font-size:var(--text-lg);line-height:1.7;color:#54657a;max-width:46ch}

/* ---- Koyu teknoloji bandı ---- */
.tech{background:var(--color-ink);color:var(--color-ink-text);position:relative;overflow:hidden}
.tech .glow{position:absolute;width:560px;height:560px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(56,189,248,.16),transparent 65%);top:-200px;right:-160px}
.tech .inner{position:relative;padding:var(--space-4xl) clamp(20px,5vw,44px);max-width:1200px;margin:0 auto}
.tech .eyebrow{color:#7DD3FC}
.tech h2{font-family:var(--font-display);font-weight:500;font-size:var(--text-3xl);margin:0;letter-spacing:-.01em}
.tech .card{background:var(--color-ink-card);border:1px solid var(--color-ink-border);
  border-radius:var(--radius-lg);padding:26px;transition:border-color var(--duration-normal)}
.tech .card:hover{border-color:rgba(56,189,248,.5)}
.tech .card .ic{width:46px;height:46px;border-radius:12px;background:rgba(56,189,248,.12);
  color:#7DD3FC;display:grid;place-items:center;font-size:20px;margin-bottom:18px}
.tech .card h3{font-size:18px;margin:0 0 8px;font-weight:600;color:var(--color-ink-text)}
.tech .card p{font-size:13.5px;color:var(--color-ink-muted);line-height:1.6;margin:0 0 16px}
.tech .card .lk{font-size:13.5px;color:#7DD3FC;font-weight:600;text-decoration:none}
.tech .card.soon{opacity:.6}

/* ---- Hero (açık editöryel) ---- */
.ghero{display:grid;grid-template-columns:1.05fr .95fr;background:#fff}
.ghero .l{padding:clamp(40px,6vw,64px) clamp(20px,5vw,44px);display:flex;flex-direction:column;justify-content:center}
.ghero h1{font-family:var(--font-display);font-weight:600;font-size:var(--text-6xl);
  line-height:1.06;letter-spacing:-.015em;color:var(--color-primary);margin:0 0 20px}
.ghero p{font-size:var(--text-lg);line-height:1.65;color:#54657a;max-width:40ch;margin:0 0 30px}
.ghero .acts{display:flex;gap:12px;flex-wrap:wrap}
.ghero .r{background-size:cover;background-position:center;min-height:430px}

/* ---- İstatistik şeridi ---- */
.gstat{display:grid;grid-template-columns:repeat(4,1fr);background:var(--color-primary);color:#fff}
.gstat div{padding:26px clamp(16px,3vw,30px);border-right:1px solid rgba(255,255,255,.1)}
.gstat .k{font-family:var(--font-display);font-size:var(--text-4xl);line-height:1}
.gstat .v{font-size:13px;color:#9fb3cc;margin-top:6px}

/* ---- 3'lü grid ---- */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

/* ---- Buton yardımcıları (grup) ---- */
.gbtn{background:var(--color-primary);color:#fff;padding:13px 26px;border-radius:var(--radius-sm);
  font-weight:600;font-size:14px;text-decoration:none;display:inline-block}
.gbtn.gold{background:var(--color-accent)}
.gbtn.ghost{background:transparent;color:var(--color-primary);border:1px solid #D6DCE4}
.gbtn.on-dark{background:#38BDF8;color:#08111c}

/* ---- Grup footer ---- */
.gfoot{background:var(--color-ink-deep);color:var(--color-ink-muted);
  padding:30px clamp(20px,5vw,44px);display:flex;justify-content:space-between;
  align-items:center;flex-wrap:wrap;gap:14px;font-size:13px}
.gfoot .logo{font-family:var(--font-display);color:#fff;font-size:17px}

/* ---- Responsive ---- */
@media(max-width:780px){
  .ghero{grid-template-columns:1fr}.ghero .r{min-height:200px;order:-1}
  .gstat{grid-template-columns:1fr 1fr}.grid-3{grid-template-columns:1fr}
  .gstat div:nth-child(2n){border-right:none}
  .gnav{flex-wrap:wrap}
  .gnav .links{gap:14px}
  /* Linkleri yalnızca ana sayfanın hero-üstü nav'ında gizle (CTA kalır).
     Masa Menü gibi sade .gnav sayfalarında linkler görünür kalmalı. */
  .gnav.over-hero .links a:not(.cta){display:none}
  .gfoot{flex-direction:column;text-align:center}
  .gfoot div[style]{text-align:center !important}
}

/* ============================================================
   MOBİL GÜVENLİK AĞI (deploy öncesi toplu uyum)
   ============================================================ */
/* Yatay taşmayı engelle (sticky'yi bozmaz — clip scroll-container açmaz) */
html{overflow-x:clip}
/* iOS'ta odaklanınca otomatik zoom'u engelle: form alanları ≥16px */
@media (max-width:600px){
  input, textarea, select{font-size:16px}
}
/* Uzun Türkçe kelimeler dar ekranda taşmasın */
.hero-cine h1,.ghero h1,.mission p,.imgband h2,.editorial h2,.vcard h3,.blog-hero-title{
  overflow-wrap:break-word}

/* ---- Solid accent text (replaces AI-cliché gradient text) ---- */
.accent-text{color:var(--color-accent)}

/* ============================================================
   HOMEPAGE ELEVATION — atmosphere · motion · refined detail
   Kurumsal editöryel + mühendislik (blueprint) ruhu
   ============================================================ */

/* --- Motion: page-load rise + scroll reveal --- */
@keyframes rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.rise{opacity:0;animation:rise .85s cubic-bezier(.2,.7,.2,1) both}
.sr{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.sr.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rise,.sr{animation:none;opacity:1;transform:none}}

/* --- Eyebrow with accent rule --- */
.eyebrow-rule{display:inline-flex;align-items:center;gap:12px}
.eyebrow-rule::before{content:"";width:34px;height:1px;background:currentColor;opacity:.6}

/* --- HERO atmosphere --- */
.ghero{position:relative;isolation:isolate;overflow:hidden;align-items:stretch}
.ghero .l{position:relative;z-index:2}
.ghero::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(120% 120% at 0% 0%, rgba(196,137,26,.07), transparent 46%),
    linear-gradient(transparent 0 calc(100% - 1px), rgba(15,43,82,.05) 100%) 0 0/100% 34px,
    linear-gradient(90deg, transparent 0 calc(100% - 1px), rgba(15,43,82,.05) 100%) 0 0/34px 100%;
  -webkit-mask-image:linear-gradient(90deg,#000 50%,transparent 78%);
          mask-image:linear-gradient(90deg,#000 50%,transparent 78%)}
.ghero .ghost{position:absolute;right:1%;bottom:-10%;z-index:0;
  font-family:var(--font-display);font-weight:600;font-size:clamp(130px,22vw,300px);
  line-height:.8;color:rgba(15,43,82,.04);pointer-events:none;user-select:none}
.ghero h1{position:relative}
.ghero h1 .uline{background:linear-gradient(transparent 62%, rgba(196,137,26,.28) 0) ;padding:0 .04em}
.ghero .r{position:relative;z-index:1}
.ghero .r::after{content:"";position:absolute;inset:0;
  background:linear-gradient(115deg, rgba(8,14,26,.42), transparent 55%)}
.ghero .scrollcue{position:absolute;left:clamp(20px,5vw,44px);bottom:22px;z-index:2;
  font:600 11px var(--font-body);letter-spacing:.18em;text-transform:uppercase;color:var(--color-text-light);
  display:inline-flex;align-items:center;gap:8px}
.ghero .scrollcue i{animation:cue 1.6s ease-in-out infinite}
@keyframes cue{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}

/* --- Refined buttons --- */
.gbtn{transition:transform .25s var(--ease-out),box-shadow .25s,background .25s,color .25s}
.gbtn:hover{transform:translateY(-2px);box-shadow:0 12px 26px -12px rgba(15,43,82,.55)}
.gbtn.ghost:hover{background:var(--color-primary);color:#fff}
.gbtn.gold:hover{box-shadow:0 14px 30px -12px rgba(196,137,26,.6)}

/* --- STAT strip --- */
.gstat .k b{color:var(--color-accent-glow);font-weight:inherit}

/* --- VENTURES: blueprint grid + richer cards --- */
.tech::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    linear-gradient(transparent 0 calc(100% - 1px), rgba(56,189,248,.055) 100%) 0 0/100% 40px,
    linear-gradient(90deg, transparent 0 calc(100% - 1px), rgba(56,189,248,.055) 100%) 0 0/40px 100%;
  -webkit-mask-image:radial-gradient(130% 95% at 82% 0%, #000, transparent 72%);
          mask-image:radial-gradient(130% 95% at 82% 0%, #000, transparent 72%)}
.tech .inner{z-index:1}
.tech .card{position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:236px;
  transition:border-color .3s,transform .4s var(--ease-out),background .3s}
.tech .card::before{content:"";position:absolute;left:0;top:0;height:2px;width:0;
  background:linear-gradient(90deg,var(--color-accent),#7DD3FC);transition:width .45s var(--ease-out)}
.tech .card:hover{transform:translateY(-6px);background:rgba(255,255,255,.055)}
.tech .card:hover::before{width:100%}
.tech .card .num{position:absolute;top:24px;right:26px;font-family:var(--font-display);
  font-size:15px;color:rgba(255,255,255,.2)}
.tech .card .lk{margin-top:auto;display:inline-flex;align-items:center;gap:7px;transition:gap .25s}
.tech .card:hover .lk{gap:12px}
.tech .card.soon .ic{background:rgba(255,255,255,.06);color:#7c8aa0}

/* --- EDITORIAL refinement --- */
.ed-img{position:relative;overflow:hidden}
.ed-img::after{content:"";position:absolute;inset:0;
  background:linear-gradient(205deg, rgba(15,43,82,.28), transparent 58%)}
.ed-list{margin:18px 0 0;padding:0;list-style:none}
.ed-list li{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;color:#33455a;
  padding:11px 0;border-bottom:1px dashed var(--color-border)}
.ed-list li:last-child{border-bottom:none}
.ed-list li i{color:var(--color-accent);margin-top:2px;font-size:14px}

@media(max-width:780px){
  .ghero .ghost{display:none}
  .ghero::before{-webkit-mask-image:none;mask-image:none;opacity:.5}
  .editorial #neden > div,.editorial [style*="grid-template-columns"]{grid-template-columns:1fr !important}
}

/* ============================================================
   CINEMATIC — full-bleed image hero + image statement bands
   (tam ekran fotoğraf · koyu overlay · üstte yazı)
   ============================================================ */

/* grain / film noise texture */
.grain{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---- Cinematic hero ---- */
.hero-cine{position:relative;isolation:isolate;min-height:92vh;display:flex;align-items:center;
  background-size:cover;background-position:center;color:#fff;overflow:hidden}
.hero-cine::before{content:"";position:absolute;inset:0;z-index:0;
  background:
    linear-gradient(180deg, rgba(7,11,18,.42) 0%, rgba(7,11,18,.55) 52%, rgba(7,11,18,.93) 100%),
    linear-gradient(105deg, rgba(8,14,26,.86), rgba(8,14,26,.2) 62%)}
.hero-cine .gridtex{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(transparent 0 calc(100% - 1px), rgba(56,189,248,.08) 100%) 0 0/100% 46px,
    linear-gradient(90deg, transparent 0 calc(100% - 1px), rgba(56,189,248,.08) 100%) 0 0/46px 100%;
  -webkit-mask-image:radial-gradient(120% 120% at 12% 92%, #000, transparent 68%);
          mask-image:radial-gradient(120% 120% at 12% 92%, #000, transparent 68%)}
.hero-cine .inner{position:relative;z-index:3;max-width:1200px;margin:0 auto;width:100%;padding:0 clamp(20px,5vw,44px)}
.hero-cine .eyebrow{color:var(--color-accent-glow)}
.hero-cine h1{font-family:var(--font-display);font-weight:600;color:#fff;
  font-size:clamp(2.6rem,1.3rem+4.6vw,5.1rem);line-height:1.02;letter-spacing:-.02em;margin:18px 0 22px;max-width:17ch}
.hero-cine h1 .uline{background:linear-gradient(transparent 64%, rgba(196,137,26,.5) 0);padding:0 .03em}
.hero-cine p{font-size:clamp(1rem,.92rem+.4vw,1.22rem);line-height:1.6;color:rgba(255,255,255,.84);max-width:48ch;margin:0 0 34px}
.hero-cine .acts{display:flex;gap:14px;flex-wrap:wrap}
.hero-cine .scrollcue{position:absolute;left:50%;transform:translateX(-50%);bottom:26px;z-index:3;
  font:600 11px var(--font-body);letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.6);
  display:inline-flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none}
.hero-cine .scrollcue i{animation:cue 1.6s ease-in-out infinite}

/* buttons for dark imagery */
.gbtn.light{background:#fff;color:var(--color-primary)}
.gbtn.light:hover{background:#fff}
.gbtn.outline{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.45)}
.gbtn.outline:hover{background:#fff;color:var(--color-primary);border-color:#fff}

/* ---- Full-bleed image statement band ---- */
.imgband{position:relative;isolation:isolate;background-size:cover;background-position:center;
  color:#fff;overflow:hidden}
.imgband::before{content:"";position:absolute;inset:0;z-index:0;
  background:linear-gradient(100deg, rgba(7,11,18,.92) 0%, rgba(7,11,18,.74) 44%, rgba(7,11,18,.38) 100%)}
.imgband .inner{position:relative;z-index:2;max-width:1200px;margin:0 auto;padding:var(--space-4xl) clamp(20px,5vw,44px)}
.imgband .eyebrow{color:var(--color-accent-glow)}
.imgband h2{font-family:var(--font-display);font-weight:500;color:#fff;font-size:var(--text-4xl);
  line-height:1.1;letter-spacing:-.01em;margin:14px 0 18px}
.imgband p{font-size:var(--text-lg);line-height:1.7;color:rgba(255,255,255,.84)}
.imgband .ed-list li{color:rgba(255,255,255,.92);border-bottom-color:rgba(255,255,255,.14)}
.imgband .ed-list li i{color:var(--color-accent-glow)}
.imgband.center{text-align:center}
.imgband.center::before{background:linear-gradient(180deg, rgba(7,11,18,.82), rgba(7,11,18,.9))}
.imgband.center .inner{max-width:760px}
.imgband.center p{margin-left:auto;margin-right:auto}
.imgband.center .eyebrow-rule{justify-content:center}
.imgband.center .eyebrow-rule::before{display:none}

@media(max-width:780px){
  .hero-cine{min-height:84vh}
  .hero-cine h1{max-width:none}
}

/* ============================================================
   v2 ELEVATION — Enterprise Gateway · kinetic · showcase
   ============================================================ */

/* ---- Nav: transparent over hero → solid on scroll ---- */
.gnav.over-hero{position:fixed;top:0;left:0;right:0;background:transparent;border-bottom-color:transparent;
  transition:background .4s ease,box-shadow .4s ease,border-color .4s ease}
.gnav.over-hero .logo{color:#fff;transition:color .4s}
.gnav.over-hero .logo b{color:var(--color-accent-glow)}
.gnav.over-hero .links a{color:rgba(255,255,255,.92);transition:color .4s}
.gnav.over-hero .links a:hover{color:#fff}
.gnav.over-hero .cta{background:#fff;color:var(--color-primary) !important}
.gnav.over-hero.scrolled{background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border-bottom-color:var(--color-border);box-shadow:var(--shadow-sm)}
.gnav.over-hero.scrolled .logo{color:var(--color-primary)}
.gnav.over-hero.scrolled .logo b{color:var(--color-accent)}
.gnav.over-hero.scrolled .links a{color:#475569}
.gnav.over-hero.scrolled .cta{background:var(--color-primary);color:#fff !important}

/* ---- Hero Ken Burns layer + kinetic headline ---- */
.hero-cine{background:var(--color-ink)}
.hero-cine .kb{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;
  animation:kenburns 20s ease-out infinite alternate;will-change:transform}
@keyframes kenburns{from{transform:scale(1.02)}to{transform:scale(1.13)}}
.hero-cine::before{z-index:1}
.hero-cine .gridtex,.hero-cine .grain{z-index:2}
.hero-cine .inner,.hero-cine .scrollcue{z-index:4}
.hero-cine h1 .w{display:inline-block;will-change:transform,opacity}
@media (prefers-reduced-motion:reduce){.hero-cine .kb{animation:none}}

/* ---- Mission statement (typographic) ---- */
.mission{background:var(--color-surface)}
.mission .inner{max-width:1080px;margin:0 auto;padding:clamp(64px,9vw,128px) clamp(20px,5vw,44px)}
.mission .lead{font:600 12px var(--font-body);letter-spacing:.22em;text-transform:uppercase;
  color:var(--color-accent);margin-bottom:26px;display:inline-flex;align-items:center;gap:12px}
.mission .lead::before{content:"";width:34px;height:1px;background:var(--color-accent)}
.mission p{font-family:var(--font-display);font-weight:400;font-size:clamp(1.55rem,1rem+2.6vw,3rem);
  line-height:1.3;color:var(--color-primary);letter-spacing:-.01em;margin:0}
.mission p .em{color:var(--color-accent);font-style:italic}

/* ---- Ventures showcase (image-backed cards) ---- */
.vshow{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.vcard{position:relative;border-radius:var(--radius-lg);overflow:hidden;min-height:430px;isolation:isolate;
  display:flex;flex-direction:column;justify-content:flex-end;color:#fff;text-decoration:none}
.vcard .bg{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;
  transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.vcard::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg, rgba(7,11,18,.12) 0%, rgba(7,11,18,.5) 52%, rgba(6,10,18,.94) 100%)}
.vcard:hover .bg{transform:scale(1.07)}
.vcard .body{position:relative;z-index:2;padding:30px}
.vcard .ic{width:50px;height:50px;border-radius:13px;background:rgba(255,255,255,.13);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:grid;place-items:center;
  font-size:21px;color:#fff;margin-bottom:18px;border:1px solid rgba(255,255,255,.18)}
.vcard h3{font-family:var(--font-display);font-weight:600;font-size:1.45rem;margin:0 0 9px;letter-spacing:-.01em}
.vcard p{font-size:13.5px;color:rgba(255,255,255,.84);line-height:1.6;margin:0 0 18px;max-width:36ch}
.vcard .lk{font-size:13px;font-weight:600;color:var(--color-accent-glow);
  display:inline-flex;align-items:center;gap:8px;transition:gap .25s}
.vcard:hover .lk{gap:14px}
.vcard .num{position:absolute;top:26px;right:28px;z-index:2;font-family:var(--font-display);
  font-size:17px;color:rgba(255,255,255,.55)}
.vcard .badge{position:absolute;top:28px;left:30px;z-index:2;font:600 10px var(--font-body);
  letter-spacing:.08em;text-transform:uppercase;background:#38BDF8;color:#06121f;padding:5px 11px;border-radius:99px}
.vcard.soon{pointer-events:none}
.vcard.soon .bg{filter:grayscale(.55) brightness(.62)}

/* ---- Principles (light, big numbers) ---- */
.principles{background:var(--color-surface-alt)}
.principles .inner{max-width:1200px;margin:0 auto;padding:var(--space-4xl) clamp(20px,5vw,44px)}
.principles .pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;margin-top:44px}
.principle{padding-top:26px;border-top:2px solid var(--color-primary)}
.principle .n{font-family:var(--font-display);font-size:2.6rem;color:var(--color-accent);line-height:1;margin-bottom:16px}
.principle h3{font-family:var(--font-display);font-size:1.3rem;color:var(--color-primary);margin:0 0 10px;letter-spacing:-.01em}
.principle p{font-size:14px;color:#54657a;line-height:1.7;margin:0}

/* ---- Premium multi-column footer ---- */
.gfoot2{background:var(--color-ink-deep);color:var(--color-ink-muted)}
.gfoot2 .top{max-width:1200px;margin:0 auto;padding:clamp(52px,7vw,84px) clamp(20px,5vw,44px) 40px;
  display:grid;grid-template-columns:1.7fr 1fr 1fr 1.2fr;gap:40px}
.gfoot2 .brand .logo{font-family:var(--font-display);color:#fff;font-size:23px;margin-bottom:16px;display:inline-block;text-decoration:none}
.gfoot2 .brand p{font-size:13.5px;line-height:1.75;max-width:36ch;margin:0}
.gfoot2 h4{color:#fff;font-size:12px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 14px;font-weight:600}
.gfoot2 a{color:var(--color-ink-muted);text-decoration:none;display:block;padding:6px 0;font-size:14px;transition:color .2s}
.gfoot2 a:hover{color:var(--color-accent-glow)}
.gfoot2 .social{display:flex;gap:12px;margin-top:18px}
.gfoot2 .social a{display:grid;place-items:center;width:38px;height:38px;padding:0;
  border:1px solid rgba(255,255,255,.14);border-radius:50%;color:#fff}
.gfoot2 .social a:hover{border-color:var(--color-accent);color:var(--color-accent-glow)}
.gfoot2 .bottom{border-top:1px solid rgba(255,255,255,.08);max-width:1200px;margin:0 auto;
  padding:22px clamp(20px,5vw,44px);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:12.5px}

/* ---- Responsive (v2) ---- */
@media(max-width:880px){
  .vshow{grid-template-columns:1fr 1fr}
  .principles .pgrid{grid-template-columns:1fr}
  .gfoot2 .top{grid-template-columns:1fr 1fr;gap:30px}
  .gfoot2 .brand{grid-column:1 / -1}
}
@media(max-width:600px){
  .vshow{grid-template-columns:1fr}
  .gfoot2 .top{grid-template-columns:1fr}
}

/* ---- Blog hero: sinematik fotoğraf backdrop (sistem taşıma) ---- */
.blog-hero{isolation:isolate}
.blog-hero .kb{position:absolute;inset:0;z-index:0;opacity:.5}
.blog-hero .bh-overlay{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(180deg, rgba(7,11,18,.5) 0%, rgba(7,11,18,.74) 50%, rgba(6,10,18,.95) 100%)}
.blog-hero .grain{z-index:0;opacity:.06}
.blog-hero > .container{position:relative;z-index:1}

/* ---- Plaka hero: sinematik fotoğraf backdrop (sistem taşıma) ---- */
.hero .kb{z-index:0}
.hero .hero-overlay{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg, rgba(8,12,20,.6) 0%, rgba(8,12,20,.52) 44%, rgba(8,14,26,.86) 100%),
             radial-gradient(ellipse 78% 60% at 74% 42%, rgba(196,137,26,.22), transparent 56%)}
.hero .grain{z-index:2;opacity:.06}
.hero-wave{position:relative;z-index:3}
.hero .hero-title .w{display:inline-block;will-change:transform,opacity}