/* ──────────────────────────────────────────────────────────────
Paten Fakültesi — ortak stiller
Sayfaların bölümlerindeki inline stil bloklarının
birleşimidir. Tasarım birebir korunur.
────────────────────────────────────────────────────────────── */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Hanken Grotesk',system-ui,sans-serif;background:#F4EFE6;color:#17150F;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:#E8422A;text-decoration:none}
a:hover{color:#C9331C}
::selection{background:#E8422A;color:#fff}
@keyframes cityscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes lbIn{from{opacity:0}to{opacity:1}}
@keyframes lbPop{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}
/* Dar ekranda çok sütunlu ızgaralar tek sütuna iner.
Galeri ızgarası kendi kuralına sahip olduğu için hariç tutulur. */
@media (max-width:900px){.g-grid{grid-template-columns:repeat(2,1fr) !important;grid-auto-rows:120px !important}}
.galeri-suslu{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:28px;z-index:0}
.galeri-suslu span{position:absolute;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.08))}
@media (max-width:560px){.galeri-suslu span{font-size:26px !important}}
@media (max-width:760px){[style*="grid-template-columns"]:not(.g-grid){grid-template-columns:1fr !important}}
/* ── Üst menü ─────────────────────────────────────────────── */
.site-header a:hover{color:#fff}
.site-nav a{transition:color .2s}
.site-cta{transition:transform .25s cubic-bezier(.22,1,.36,1),background .2s,color .2s}
.site-cta:hover{background:#fff !important;color:#17150F !important}
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:46px;height:46px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,0.14);cursor:pointer;flex:0 0 auto}
.nav-toggle span{display:block;width:20px;height:2px;margin:0 auto;border-radius:2px;background:#fff;transition:transform .28s cubic-bezier(.22,1,.36,1),opacity .18s}
html.nav-acik .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
html.nav-acik .nav-toggle span:nth-child(2){opacity:0}
html.nav-acik .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-menu{display:none}
/* ── Mobil hero sırası: rozet → görsel → başlık → ... ─────── */
@media (max-width:760px){
.hero-grid{display:flex !important;flex-direction:column;align-items:stretch !important}
.hero-copy{display:contents}
.hero-copy>*:nth-child(1){order:1}
#heroMediaFrame{order:2;margin-top:24px}
.hero-copy>*:nth-child(2){order:3}
.hero-copy>*:nth-child(3){order:4}
.hero-copy>*:nth-child(4){order:5}
.hero-copy>*:nth-child(5){order:6}
.hero-copy>*:nth-child(6){order:7}
}
@media (max-width:1150px){
header.site-header{gap:14px !important}
.site-nav{display:none !important}
.site-cta{display:none !important}
.nav-toggle{display:flex}
.mobile-menu{position:fixed;top:0;left:0;right:0;bottom:0;z-index:55;background:#E8422A;padding:104px max(clamp(20px,5vw,72px), calc((100% - 1340px) / 2)) 40px;overflow-y:auto;flex-direction:column}
html.nav-acik{overflow:hidden}
html.nav-acik .mobile-menu{display:flex}
.mobile-menu nav{display:flex;flex-direction:column}
.mobile-menu nav a{padding:18px 0;font-family:'Archivo',sans-serif;font-weight:800;font-size:clamp(26px,7vw,38px);line-height:1;letter-spacing:-0.01em;color:rgba(255,255,255,0.72);border-bottom:1px solid rgba(255,255,255,0.18)}
.mobile-menu nav a[aria-current="page"]{color:#fff}
.mobile-menu .mm-cta{display:inline-flex;align-items:center;justify-content:center;margin-top:32px;padding:18px 30px;border-radius:999px;background:#17150F;color:#fff;font-weight:700;font-size:16px;letter-spacing:0.02em}
}
/* ── Ortak içerik kolonu ──────────────────────────────────────
Logo, menü ve tüm bölümler aynı noktadan başlar ve biter.
.pf-bleed işaretli bölümler bilerek kenardan kenara akar. */
header.site-header,
main > section:not(.pf-bleed),
footer{
padding-left:max(clamp(20px,5vw,72px), calc((100% - 1340px) / 2)) !important;
padding-right:max(clamp(20px,5vw,72px), calc((100% - 1340px) / 2)) !important;
}
/* Sabit (parallax) görsel bandı — GERÇEK ![]()
ile, tam çözünürlükte NET kalır.
![]()
viewport'a sabitlenir; clip-path bandı bir "pencere" gibi kırpar,
böylece sayfa kaydıkça görsel yerinde durur ama kalite düşmez.
(Eskiden background-attachment:fixed kullanılıyordu; o, Retina ekranlarda
sabit arka planı düşük çözünürlükte çizdiği için görseli bulanıklaştırıyordu.)
Mobilde sabitleme kapanır: fixed orada titrek çalışır. */
.pf-fix{position:relative;overflow:hidden;clip-path:inset(0);background-color:#1B1916}
.pf-fix-img{position:fixed;inset:0;width:100vw;height:100vh;object-fit:cover;object-position:center 32%;display:block}
.pf-fix::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 14px 40px -18px rgba(0,0,0,0.5), inset 0 -14px 40px -18px rgba(0,0,0,0.5)}
@media (max-width:820px){
.pf-fix{clip-path:none}
.pf-fix-img{position:absolute;width:100%;height:100%}
}
/* ── Hover efektleri ──────────────────────────────────────────
Eskiden style-hover özniteliğiyle üretilen kurallar. */
.kart-yukselt{transition:transform .3s cubic-bezier(.22,1,.36,1)}
.kart-yukselt:hover{transform:translateY(-6px)}
.buton-koyu:hover{background:#17150F !important;color:#F4EFE6 !important;border-color:#17150F !important}
.buton-ters:hover{background:#17150F !important;color:#fff !important;border-color:#17150F !important}
.foto-ust{opacity:0;transition:opacity .25s}
.foto-kutu:hover .foto-ust{opacity:1;background:rgba(232,66,42,0.32)}
/* Dersler: lokasyon etiketleri ve paket butonları */
.yer-etiket:hover{background:#17150F;color:#fff;border-color:#17150F}
.buton-siyah:hover{background:#000 !important}
.kart-yukselt-4:hover{transform:translateY(-4px)}
.form-gonder:hover{background:#C9331C}
/* Sosyal medya: 3 kart → tablette 2, telefonda 1 */
@media (max-width:1100px){.sosyal-grid{grid-template-columns:repeat(2,1fr) !important}}
@media (max-width:760px){.sosyal-grid{grid-template-columns:1fr !important}}
/* Blog listesi: 4 sütun → dar ekranlarda kademeli azalır */
@media (max-width:1180px){.blog-grid{grid-template-columns:repeat(3,1fr) !important}}
@media (max-width:900px){.blog-grid{grid-template-columns:repeat(2,1fr) !important}}
@media (max-width:620px){.blog-grid{grid-template-columns:1fr !important}}