:root {
    --mgps-blog-ink: #090909;
    --mgps-blog-charcoal: #151515;
    --mgps-blog-paper: #f3f3ef;
    --mgps-blog-white: #fff;
    --mgps-blog-red: #ce1711;
    --mgps-blog-text: #171717;
    --mgps-blog-muted: #686868;
    --mgps-blog-line: #d7d7d2;
    --mgps-blog-max: 1240px;
    --mgps-blog-pad: clamp(20px, 4vw, 56px);
}

.mgps-blog,
.mgps-blog * { box-sizing: border-box; }
.mgps-blog { overflow: clip; background: var(--mgps-blog-paper); color: var(--mgps-blog-text); font-family: Montserrat, Arial, sans-serif; }
.mgps-blog img { display: block; width: 100%; }
.mgps-blog a { color: inherit; text-decoration: none; }
.mgps-blog button { font: inherit; }
.mgps-blog [hidden] { display: none !important; }
.mgps-blog :focus-visible { outline: 3px solid #ef554f; outline-offset: 3px; }
.mgps-blog__shell { width: min(var(--mgps-blog-max), calc(100% - (var(--mgps-blog-pad) * 2))); margin-inline: auto; }

/* Tasarım onayından sonra kaldırılacak yerel varyant seçici. */
.mgps-blog__preview-bar {
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    padding: 6px var(--mgps-blog-pad);
    border-bottom: 1px solid #2d2d2d;
    background: #1d1d1d;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.mgps-blog__preview-bar > span { color: #8b8b8b; }
.mgps-blog__preview-bar > div { display: flex; gap: 6px; }
.mgps-blog__preview-bar button {
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid #454545;
    border-radius: 0;
    background: transparent;
    color: #aaa;
    cursor: pointer;
}
.mgps-blog__preview-bar button:hover { border-color: #777; color: #fff; }
.mgps-blog__preview-bar button[aria-pressed="true"] { border-color: var(--mgps-blog-red); background: var(--mgps-blog-red); color: #fff; }

.mgps-blog__eyebrow,
.mgps-blog__section-kicker {
    margin: 0 0 16px;
    color: var(--mgps-blog-red);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .2em;
    line-height: 1.4;
    text-transform: uppercase;
}
.mgps-blog__eyebrow { display: flex; align-items: center; gap: 12px; }
.mgps-blog__eyebrow::before { flex: 0 0 28px; height: 2px; background: currentColor; content: ""; }
.mgps-blog h1,
.mgps-blog h2,
.mgps-blog h3,
.mgps-blog p { margin-top: 0; }
.mgps-blog h1 {
    margin-bottom: 0;
    font-size: clamp(46px, 6vw, 88px);
    font-weight: 800;
    letter-spacing: -.055em;
    line-height: .91;
    text-transform: uppercase;
}
.mgps-blog__text-link {
    width: max-content;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    gap: 14px;
    border-bottom: 1px solid currentColor;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.mgps-blog__text-link svg,
.mgps-blog__button svg { width: 18px; height: 18px; transition: transform .2s ease; }
.mgps-blog__text-link:hover svg,
.mgps-blog__button:hover svg { transform: translateX(4px); }

/* Hero 01 — koyu split: mevcut taslağın daha kompakt, ilk ekrana sığan hali. */
.mgps-blog__hero--one { position: relative; padding: clamp(42px, 5.5vw, 72px) 0 clamp(54px, 6vw, 84px); background: var(--mgps-blog-ink); color: #fff; }
.mgps-blog__hero--one h1,
.mgps-blog__hero--one h2 { color: #fff; }
.mgps-blog__hero--one::before { position: absolute; top: -15vw; right: -8vw; width: 42vw; height: 42vw; border: 1px solid rgba(255,255,255,.06); transform: rotate(18deg); content: ""; }
.mgps-blog__hero-intro { position: relative; display: grid; grid-template-columns: 1.25fr .75fr; align-items: end; gap: 48px; margin-bottom: clamp(28px, 4vw, 48px); }
.mgps-blog__hero-intro > p { max-width: 440px; margin: 0 0 4px auto; color: #aaa; font-size: clamp(14px, 1.3vw, 17px); line-height: 1.7; }
.mgps-blog__feature { position: relative; display: grid; grid-template-columns: minmax(0, 1.42fr) minmax(310px, .78fr); min-height: clamp(390px, 40vw, 480px); border: 1px solid #303030; background: var(--mgps-blog-charcoal); }
.mgps-blog__feature-media { min-height: 360px; overflow: hidden; }
.mgps-blog__feature-media img { height: 100%; object-fit: cover; filter: saturate(.72) contrast(1.08); transition: transform .4s ease; }
.mgps-blog__feature:hover .mgps-blog__feature-media img { transform: scale(1.02); }
.mgps-blog__feature-copy { position: relative; display: flex; flex-direction: column; justify-content: center; padding: clamp(30px, 4.5vw, 60px); }
.mgps-blog__feature-copy::before { position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--mgps-blog-red); content: ""; }
.mgps-blog__meta { margin-bottom: 18px; color: #9b9b9b; font-size: 9px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.mgps-blog__feature h2 { margin-bottom: 20px; font-size: clamp(27px, 2.8vw, 42px); font-weight: 700; letter-spacing: -.035em; line-height: 1.06; }
.mgps-blog__feature-copy > p { margin-bottom: 26px; color: #b8b8b8; font-size: 13px; line-height: 1.7; }

/* Hero 02 — sinematik: tek güçlü fotoğraf ve alt bantta içerik. */
.mgps-blog__hero--two { position: relative; min-height: min(720px, calc(100svh - 187px)); display: grid; align-items: end; isolation: isolate; overflow: hidden; background: #050505; color: #fff; }
.mgps-blog__hero--two h1,
.mgps-blog__hero--two h2 { color: #fff; }
.mgps-blog__hero-cover { position: absolute; z-index: -2; inset: 0; height: 100%; object-fit: cover; object-position: 50% 43%; filter: saturate(.65) contrast(1.08); }
.mgps-blog__hero-shade { position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.92) 0%, rgba(0,0,0,.48) 48%, rgba(0,0,0,.16) 76%), linear-gradient(0deg, rgba(0,0,0,.8), transparent 58%); }
.mgps-blog__cinematic-copy { min-height: min(720px, calc(100svh - 187px)); display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); grid-template-rows: 1fr auto; align-items: center; gap: 40px; padding-block: clamp(44px, 6vw, 72px); }
.mgps-blog__cinematic-copy > .mgps-blog__eyebrow { position: absolute; top: clamp(48px, 7vw, 88px); }
.mgps-blog__cinematic-copy h1 { min-width: 0; align-self: center; font-size: clamp(58px, 7vw, 104px); letter-spacing: -.05em; line-height: 1; white-space: nowrap; }
.mgps-blog__cinematic-story { align-self: end; max-width: 480px; padding: 28px 0 0 30px; border-top: 4px solid var(--mgps-blog-red); border-left: 1px solid rgba(255,255,255,.3); }
.mgps-blog__cinematic-story > span { display: block; margin-bottom: 15px; color: #ccc; font-size: 9px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.mgps-blog__cinematic-story h2 { margin-bottom: 24px; font-size: clamp(24px, 2.9vw, 40px); font-weight: 700; letter-spacing: -.03em; line-height: 1.08; }

/* Hero 03 — açık teknik: daha kurumsal/okunaklı katalog yaklaşımı. */
.mgps-blog__hero--three { position: relative; background: #ecece7; color: var(--mgps-blog-ink); }
.mgps-blog__technical-grid { min-height: min(720px, calc(100svh - 90px)); display: grid; grid-template-columns: minmax(0, .82fr) minmax(420px, 1.18fr); align-items: stretch; }
.mgps-blog__technical-copy { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; padding: clamp(56px, 8vw, 108px) clamp(34px, 6vw, 84px) clamp(56px, 8vw, 108px) 0; }
.mgps-blog__technical-copy h1 { margin-bottom: 30px; color: var(--mgps-blog-red); font-size: clamp(52px, 5.5vw, 82px); line-height: .96; }
.mgps-blog__technical-deck { max-width: 500px; margin-bottom: 30px; color: #555; font-size: clamp(15px, 1.3vw, 18px); line-height: 1.75; }
.mgps-blog__technical-media { position: relative; min-height: 500px; overflow: hidden; }
.mgps-blog__technical-media img { height: 100%; object-fit: cover; filter: saturate(.7) contrast(1.05); }
.mgps-blog__technical-media > span { position: absolute; right: 0; bottom: 0; left: 0; display: flex; align-items: baseline; gap: 16px; padding: 18px 24px; background: var(--mgps-blog-ink); color: #fff; font-size: 9px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.mgps-blog__technical-media b { color: var(--mgps-blog-red); font-size: 23px; }
.mgps-blog__technical-index { position: absolute; right: clamp(10px, 2vw, 30px); top: 50%; color: rgba(255,255,255,.6); font-size: 9px; font-weight: 800; letter-spacing: .18em; writing-mode: vertical-rl; }

/* Arşiv */
.mgps-blog__archive { padding: clamp(68px, 8vw, 112px) 0; }
.mgps-blog__archive-head { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 32px; }
.mgps-blog__archive h2,
.mgps-blog__academy h2,
.mgps-blog__social h2 { margin-bottom: 0; font-size: clamp(32px, 4vw, 58px); font-weight: 800; letter-spacing: -.045em; line-height: 1; text-transform: uppercase; }
.mgps-blog__result { margin: 0; color: var(--mgps-blog-muted); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.mgps-blog__filters-wrap { overflow-x: auto; margin: 0 calc(var(--mgps-blog-pad) * -1) 42px; padding: 0 var(--mgps-blog-pad) 8px; scrollbar-width: thin; }
.mgps-blog__filters { width: max-content; min-width: min(100%, var(--mgps-blog-max)); display: flex; gap: 8px; }
.mgps-blog__filters button { min-height: 44px; padding: 0 18px; border: 1px solid #c9c9c4; border-radius: 0; background: transparent; color: #494949; font-size: 9px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; white-space: nowrap; cursor: pointer; }
.mgps-blog__filters button:hover { border-color: var(--mgps-blog-ink); color: var(--mgps-blog-ink); }
.mgps-blog__filters button[aria-pressed="true"] { border-color: var(--mgps-blog-ink); background: var(--mgps-blog-ink); color: #fff; }
.mgps-blog__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 52px 24px; }
.mgps-blog__empty { padding: 44px 0; border-top: 1px solid var(--mgps-blog-ink); color: var(--mgps-blog-muted); font-size: 14px; }
.mgps-blog__card { min-width: 0; border-top: 1px solid var(--mgps-blog-ink); }
.mgps-blog__card-media { display: block; aspect-ratio: 1.42; overflow: hidden; margin-top: 12px; background: #ddd; }
.mgps-blog__card-media img { height: 100%; object-fit: cover; filter: saturate(.82); transition: transform .4s ease, filter .4s ease; }
.mgps-blog__card:hover .mgps-blog__card-media img { transform: scale(1.025); filter: saturate(1); }
.mgps-blog__card-body { padding-top: 20px; }
.mgps-blog__card-meta { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 13px; color: var(--mgps-blog-muted); font-size: 9px; font-weight: 700; letter-spacing: .1em; line-height: 1.5; text-transform: uppercase; }
.mgps-blog__card-meta strong { color: var(--mgps-blog-red); }
.mgps-blog__card h3 { margin-bottom: 13px; font-size: clamp(19px, 1.7vw, 24px); font-weight: 700; letter-spacing: -.025em; line-height: 1.22; }
.mgps-blog__card h3 a:hover { color: var(--mgps-blog-red); }
.mgps-blog__card-body > p { margin-bottom: 18px; color: var(--mgps-blog-muted); font-size: 13px; line-height: 1.7; }
.mgps-blog__card-footer { display: flex; align-items: center; justify-content: space-between; padding-top: 13px; border-top: 1px solid var(--mgps-blog-line); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.mgps-blog__card-arrow { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid #c7c7c2; transition: background .2s ease, color .2s ease; }
.mgps-blog__card-arrow svg { width: 15px; }
.mgps-blog__card:hover .mgps-blog__card-arrow { border-color: var(--mgps-blog-red); background: var(--mgps-blog-red); color: #fff; }

/* YouTube + yeni eğitim sayfası: ayrı promosyonlar yerine tek öğrenme yolu. */
.mgps-blog__academy { display: grid; grid-template-columns: 1.08fr .92fr; min-height: 600px; background: var(--mgps-blog-ink); color: #fff; }
.mgps-blog__academy h2 { color: #fff; }
.mgps-blog__academy-media { position: relative; min-height: 500px; overflow: hidden; }
.mgps-blog__academy-media::after { position: absolute; inset: 0; background: linear-gradient(90deg, transparent 58%, rgba(0,0,0,.32)); content: ""; }
.mgps-blog__academy-media img { height: 100%; object-fit: cover; filter: saturate(.65) contrast(1.06); }
.mgps-blog__play { position: absolute; z-index: 2; top: 50%; left: 50%; width: 86px; height: 86px; display: grid; place-items: center; padding: 0; border: 1px solid rgba(255,255,255,.65); border-radius: 0; background: rgba(0,0,0,.68); color: #fff; cursor: pointer; transform: translate(-50%, -50%); transition: background .2s ease; }
.mgps-blog__play:hover { background: var(--mgps-blog-red); }
.mgps-blog__play svg { width: 31px; height: 31px; fill: currentColor; }
.mgps-blog__video-label { position: absolute; z-index: 2; right: 22px; bottom: 22px; padding: 11px 13px; background: var(--mgps-blog-red); font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.mgps-blog__video-frame { position: absolute; z-index: 4; inset: 0; background: #000; }
.mgps-blog__video-frame iframe { width: 100%; height: 100%; display: block; border: 0; }
.mgps-blog button.mgps-blog__video-close { position: absolute; z-index: 2; top: 12px; right: 12px; width: auto !important; min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 12px !important; border: 1px solid rgba(255,255,255,.78); border-radius: 0; background: rgba(0,0,0,.9); color: #fff; cursor: pointer; font-family: Montserrat, Arial, sans-serif !important; font-size: 8px !important; font-weight: 800 !important; letter-spacing: .08em !important; line-height: 1 !important; text-transform: uppercase; appearance: none; }
.mgps-blog__video-close:hover { border-color: var(--mgps-blog-red); background: var(--mgps-blog-red); }
.mgps-blog__video-close svg { width: 15px; height: 15px; }
.mgps-blog__academy-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(48px, 7vw, 100px); }
.mgps-blog__academy-copy h2 { margin-bottom: 27px; }
.mgps-blog__academy-copy > p { max-width: 540px; margin-bottom: 34px; color: #aaa; font-size: 14px; line-height: 1.8; }
.mgps-blog__academy-actions { width: min(100%, 400px); display: grid; grid-template-columns: 1fr; gap: 10px; }
.mgps-blog__button { width: 100%; min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 14px; padding: 0 20px; border: 1px solid transparent; font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.mgps-blog__button--red { background: var(--mgps-blog-red); color: #fff; }
.mgps-blog__button--red:hover { background: #a9110d; }
.mgps-blog__button--line { border-color: #555; color: #fff; }
.mgps-blog__button--line:hover { border-color: #fff; }
.mgps-blog__button.is-disabled { opacity: .52; cursor: not-allowed; }
.mgps-blog__button.is-disabled:hover { border-color: #555; }

/* Instagram eklenti slotu: 5'li kontrollü şerit, footer bülteniyle yarışmaz. */
.mgps-blog__social { padding: clamp(68px, 8vw, 108px) 0; background: #fff; }
.mgps-blog__social-head { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 36px; }
.mgps-blog__instagram-feed { display: none; }
.mgps-blog__social.has-live-feed .mgps-blog__instagram-feed { display: block; }
.mgps-blog__social.has-live-feed .mgps-blog__instagram-placeholder { display: none; }
.mgps-blog__instagram-feed #sb_instagram { width: 100% !important; padding: 0 !important; }
.mgps-blog__instagram-feed #sbi_images { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px !important; padding: 0 !important; }
.mgps-blog__instagram-feed .sbi_item { width: auto !important; aspect-ratio: 4 / 5; overflow: hidden; padding: 0 !important; background: #e5e5e2; }
.mgps-blog__instagram-feed .sbi_item:nth-child(n+6) { display: none !important; }
.mgps-blog__instagram-feed .sbi_photo_wrap,
.mgps-blog__instagram-feed .sbi_photo { height: 100% !important; }
.mgps-blog__instagram-feed .sbi_photo img { width: 100% !important; height: 100% !important; object-fit: cover !important; filter: saturate(.72); transition: filter .25s ease; }
.mgps-blog__instagram-feed .sbi_item:nth-child(2) { transform: translateY(24px); }
.mgps-blog__instagram-feed .sbi_item:nth-child(4) { transform: translateY(-18px); }
.mgps-blog__instagram-feed .sbi_item:hover .sbi_photo img { filter: saturate(1); }
.mgps-blog__instagram-feed .sb_instagram_header,
.mgps-blog__instagram-feed #sbi_load,
.mgps-blog__instagram-feed .sbi_follow_btn { display: none !important; }
.mgps-blog__instagram-placeholder { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.mgps-blog__social-tile { aspect-ratio: 4 / 5; overflow: hidden; background: #e5e5e2; }
.mgps-blog__social-tile:nth-child(2) { transform: translateY(24px); }
.mgps-blog__social-tile:nth-child(4) { transform: translateY(-18px); }
.mgps-blog__social-tile img { height: 100%; object-fit: cover; filter: saturate(.72); transition: filter .25s ease; }
.mgps-blog__social-tile:hover img { filter: saturate(1); }
.mgps-blog__integration-note { display: none; }

@media (max-width: 1024px) {
    .mgps-blog__hero-intro { grid-template-columns: 1fr; gap: 20px; }
    .mgps-blog__hero-intro > p { margin-left: 0; }
    .mgps-blog__feature { grid-template-columns: 1.15fr .85fr; }
    .mgps-blog__technical-grid { grid-template-columns: .9fr 1.1fr; }
    .mgps-blog__cinematic-copy { grid-template-columns: minmax(0, 1fr) minmax(320px, .9fr); gap: 28px; }
    .mgps-blog__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mgps-blog__academy { grid-template-columns: 1fr; }
    .mgps-blog__academy-media { min-height: 540px; }
}

@media (max-width: 720px) {
    body.mgps-blog-page #page .site-content { margin-top: 15px; }
    .mgps-blog__preview-bar { align-items: flex-start; flex-direction: column; gap: 8px; padding-block: 10px; }
    .mgps-blog__preview-bar > div { width: 100%; overflow-x: auto; }
    .mgps-blog__preview-bar button { flex: 0 0 auto; }
    .mgps-blog h1 { font-size: clamp(44px, 14.5vw, 66px); }
    .mgps-blog__hero--one { padding-top: 42px; }
    .mgps-blog__feature { grid-template-columns: 1fr; }
    .mgps-blog__feature-media { min-height: 285px; aspect-ratio: 1.22; }
    .mgps-blog__feature-copy { min-height: 350px; }
    .mgps-blog__feature-copy::before { inset: 0 0 auto; width: auto; height: 4px; }
    .mgps-blog__hero--two,
    .mgps-blog__cinematic-copy { min-height: calc(100svh - 168px); }
    .mgps-blog__hero-shade { background: linear-gradient(0deg, rgba(0,0,0,.95) 0%, rgba(0,0,0,.35) 70%, rgba(0,0,0,.5)); }
    .mgps-blog__cinematic-copy { grid-template-columns: 1fr; grid-template-rows: 1fr auto; align-items: end; }
    .mgps-blog__cinematic-copy h1 { align-self: end; font-size: clamp(46px, 14vw, 64px); letter-spacing: -.045em; line-height: 1; }
    .mgps-blog__cinematic-story { padding-left: 20px; }
    .mgps-blog__technical-grid { min-height: auto; grid-template-columns: 1fr; padding-block: 0; }
    .mgps-blog__technical-copy { min-height: 460px; padding-right: 0; }
    .mgps-blog__technical-media { min-height: 390px; margin-inline: calc(var(--mgps-blog-pad) * -1); }
    .mgps-blog__technical-index { display: none; }
    .mgps-blog__archive-head,
    .mgps-blog__social-head { align-items: flex-start; flex-direction: column; gap: 14px; }
    .mgps-blog__grid { grid-template-columns: 1fr; gap: 46px; }
    .mgps-blog__card h3 { font-size: 23px; }
    .mgps-blog__meta,
    .mgps-blog__cinematic-story > span,
    .mgps-blog__filters button,
    .mgps-blog__card-meta,
    .mgps-blog__card-footer,
    .mgps-blog__video-label,
    .mgps-blog__button { font-size: 10px; }
    .mgps-blog__card-body > p { font-size: 14px; }
    .mgps-blog__academy-media { min-height: 380px; }
    .mgps-blog__play { width: 70px; height: 70px; }
    .mgps-blog__social-head .mgps-blog__text-link { margin-top: 4px; }
    .mgps-blog__video-close span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    .mgps-blog button.mgps-blog__video-close { padding: 0 !important; }
    .mgps-blog__instagram-feed #sbi_images,
    .mgps-blog__instagram-placeholder { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mgps-blog__instagram-feed .sbi_item:nth-child(2),
    .mgps-blog__instagram-feed .sbi_item:nth-child(4) { transform: none; }
    .mgps-blog__instagram-feed .sbi_item:nth-child(5) { width: calc((100% - 6px) / 2) !important; grid-column: 1 / -1; justify-self: center; }
    .mgps-blog__social-tile:nth-child(2),
    .mgps-blog__social-tile:nth-child(4) { transform: none; }
    .mgps-blog__social-tile:last-child { width: calc((100% - 6px) / 2); grid-column: 1 / -1; justify-self: center; }
}

@media (prefers-reduced-motion: reduce) {
    .mgps-blog *,
    .mgps-blog *::before,
    .mgps-blog *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
