html{overflow-x:clip}
.sec{overflow:hidden}
.brand img{width:44px;height:auto}
.brand .logo-d{display:none}
.hdr.solid .brand .logo-l{display:none}
.hdr.solid .brand .logo-d{display:block}
.brand b span{color:var(--red-hi)}
.hdr.solid .brand b span{color:var(--red)}
@media (max-width:860px){
  .menu-open .hdr.solid .brand .logo-l{display:block}
  .menu-open .hdr.solid .brand .logo-d{display:none}
  .menu-open .hdr.solid .brand b span{color:var(--red-hi)}
}
/* görsel açılış: kırpmayı kapsayıcıya değil görsele uygula (kapsayıcı görünür kalsın) */
.rv-img,.rv-img.in{clip-path:none}
.rv-img img{clip-path:inset(0 0 100% 0);transition:clip-path 1.4s var(--ease),transform 1.2s var(--ease)}
.rv-img.in img{clip-path:inset(0 0 0 0)}
@media (prefers-reduced-motion:reduce){.rv-img img{clip-path:none;transition:none}}

/* giriş sayacı */
.hero-count{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(44px,6vw,80px);border-top:1px solid rgba(255,255,255,.18)}
.hero-count div{padding:24px 20px 0 0;position:relative}
.hero-count div+div{padding-left:24px;border-left:1px solid rgba(255,255,255,.12)}
.hero-count b{display:flex;align-items:flex-start;font:800 clamp(40px,5.2vw,72px)/1 var(--display);letter-spacing:-.03em;color:#fff;font-variant-numeric:tabular-nums}
.hero-count b i{font-style:normal;color:var(--red-hi);font-size:.55em;margin:.08em 0 0 .06em}
.hero-count span:not(.cnt){display:block;margin-top:12px;font:600 11px/1.4 var(--body);letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.66)}

/* Kamukent yetkinlikler */
.cred{overflow:hidden}
.creds{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;position:relative}
.creds article{border:1px solid var(--line-d);padding:40px 32px 36px;transition:border-color .4s}
.creds article:hover{border-color:rgba(210,85,79,.55)}
.creds span{font:600 11px/1 var(--body);letter-spacing:.24em;color:var(--red-hi)}
.creds h3{font-size:22px;font-weight:700;color:#fff;margin:24px 0 12px}
.creds p{font-size:14.5px;color:var(--on-dark-2);margin:0}

/* başlık: amblem hiçbir genişlikte sıkışmasın */
.brand{flex-shrink:0}.brand img{flex:none}

@media (max-width:860px){
  /* telefonda giriş görseli kırpılmadan tam görünsün, yazı altında */
  .hero{display:block;min-height:0;padding-top:84px}
  .hero-media{position:relative;inset:auto}
  .hero-media img{height:auto;aspect-ratio:auto;object-fit:contain}
  .hero-media::after{background:linear-gradient(180deg,rgba(22,24,27,.35) 0%,rgba(22,24,27,0) 30%,rgba(22,24,27,0) 70%,var(--ink-deep) 100%)}
  .hero .wrap{padding-top:34px}
  .hero-count{grid-template-columns:repeat(2,1fr)}
  .hero-count div{padding:22px 12px 22px 0}
  .hero-count div+div{padding-left:0;border-left:0}
  .hero-count div:nth-child(even){padding-left:20px;border-left:1px solid rgba(255,255,255,.12)}
  .hero-count div:nth-child(n+3){border-top:1px solid rgba(255,255,255,.12)}
  .creds{grid-template-columns:1fr}
}
/* alt imza ortalı */
.ftr .sig{margin-left:auto;margin-right:auto}
@media (max-width:560px){
  .ftr-top>div:first-child{text-align:center}
  .ftr-top>div:first-child .brand{justify-content:center}
  .ftr-top>div:first-child p{margin-left:auto;margin-right:auto}
}
/* açılış slaytı */
.hero-media .sl{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity 1.6s var(--ease),transform 7.5s linear;animation:none}
.hero-media .sl.on{opacity:1;transform:scale(1)}
.hero-sl{position:absolute;right:var(--gut);top:118px;z-index:2;display:flex;flex-direction:column;align-items:flex-end;gap:10px;color:rgba(255,255,255,.72);font:600 10.5px/1 var(--body);letter-spacing:.24em;text-transform:uppercase}
.hero-sl .hs-no{color:var(--red-hi)}
.hero-sl .hs-bar{display:block;width:150px;height:1px;background:rgba(255,255,255,.22);overflow:hidden}
.hero-sl .hs-bar i{display:block;height:100%;width:0;background:#fff}
.hero-sl.run .hs-bar i{animation:hsBar var(--hs,6.5s) linear forwards}
@keyframes hsBar{to{width:100%}}
@media (max-width:1080px){.hero-sl{display:none}}
@media (max-width:860px){
  .hero-media{aspect-ratio:3/2;overflow:hidden}
  .hero-media .sl{position:absolute;inset:0;height:100%;object-fit:cover}
}
@media (prefers-reduced-motion:reduce){.hero-media .sl{transition:none;transform:none}}
/* sayfa başı görseli telefonda tam */
@media (max-width:860px){
  .phero.has-img{display:block;min-height:0;padding-top:84px}
  .phero.has-img .hero-media{position:relative;inset:auto}
  .phero.has-img .hero-media img{width:100%;height:auto;object-fit:contain;transform:none;animation:none}
  .phero.has-img .hero-media::after{background:linear-gradient(180deg,rgba(22,24,27,.3) 0%,rgba(22,24,27,0) 30%,rgba(22,24,27,0) 70%,var(--ink) 100%)}
  .phero.has-img .wrap{padding-top:34px}
}
/* tadilat mozaiği (ana sayfa) */
.mosaic{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:clamp(120px,13vw,190px);gap:12px}
.mosaic figure,.st-g figure,.t2-g figure{margin:0;overflow:hidden;background:var(--ink-soft)}
.mosaic img,.st-g img,.t2-g img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.mosaic figure:hover img,.st-g figure:hover img,.t2-g figure:hover img{transform:scale(1.04)}
.m-a{grid-column:span 4;grid-row:span 2}.m-b{grid-column:span 2;grid-row:span 2}
.m-c{grid-column:span 2;grid-row:span 2}.m-d{grid-column:span 2}.m-e{grid-column:span 2}
.m-f{grid-column:span 2}.m-g{grid-column:span 2}
/* Kamukent yapım aşamaları */
.stage{display:grid;grid-template-columns:minmax(220px,.8fr) 2.2fr;gap:clamp(24px,4vw,56px);padding:clamp(34px,4vw,52px) 0;border-top:1px solid var(--line-d)}
.st-t span,.t2-h span{font:600 11px/1 var(--body);letter-spacing:.24em;text-transform:uppercase;color:var(--red-hi)}
.st-t h3,.t2-h h3{font-size:clamp(24px,2.4vw,32px);font-weight:700;color:#fff;margin:18px 0 12px}
.st-t p,.t2-h p{font-size:14.5px;color:var(--on-dark-2);margin:0}
.st-g{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(150px,17vw,260px);gap:10px}
.st-g figure{grid-column:span 1;grid-row:span 2}
.st-g figure.g-w{grid-column:span 2;grid-row:span 2}
.types2{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:clamp(40px,5vw,64px)}
.types2>div{border:1px solid var(--line-d);padding:clamp(22px,3vw,34px)}
.t2-g{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}
.t2-g figure{aspect-ratio:3/4}
@media (max-width:860px){
  .mosaic{grid-template-columns:repeat(2,1fr);grid-auto-rows:150px;gap:8px}
  .m-a{grid-column:span 2;grid-row:span 2}.m-b,.m-c{grid-column:span 1;grid-row:span 2}
  .m-d,.m-e,.m-f,.m-g{grid-column:span 1;grid-row:span 1}
  .stage{grid-template-columns:1fr}
  .st-g{grid-template-columns:repeat(2,1fr);grid-auto-rows:130px;gap:8px}
  .st-g figure.g-w{grid-column:span 2;grid-row:span 2}
  .types2{grid-template-columns:1fr}
}
/* açılış üst başlığı iki satır */
.eb2{align-items:flex-start}
.eb2::before{margin-top:7px}
.eb2 span{display:block;line-height:1.5}
.eb2 small{display:block;font-size:inherit;letter-spacing:inherit;opacity:.7;margin-top:4px}
/* açılış: atmosfer görseli, kenarları zemine eriyor */
.hero-media.atm{left:auto;right:0;width:min(80%,1680px);overflow:hidden}
.hero-media.atm img{object-fit:cover;object-position:62% 45%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 34%,#000 90%,transparent 100%),linear-gradient(180deg,transparent 0,#000 20%,#000 70%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0,#000 34%,#000 90%,transparent 100%),linear-gradient(180deg,transparent 0,#000 20%,#000 70%,transparent 100%);mask-composite:intersect;animation:atmIn 2.8s var(--ease) both}
.hero-media.atm::after{background:linear-gradient(90deg,rgba(22,24,27,.78) 0%,rgba(22,24,27,.45) 30%,rgba(22,24,27,0) 58%),linear-gradient(180deg,rgba(22,24,27,0) 55%,rgba(22,24,27,.45) 100%)}
@keyframes atmIn{from{opacity:0;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}
@media (max-width:860px){
  .hero-media.atm{width:100%;aspect-ratio:3/2}
  .hero-media.atm img{height:100%;object-fit:cover;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%),linear-gradient(180deg,transparent 0,#000 16%,#000 70%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%),linear-gradient(180deg,transparent 0,#000 16%,#000 70%,transparent 100%)}
  .hero-media.atm::after{background:none}
}
@media (prefers-reduced-motion:reduce){.hero-media.atm img{animation:none}}

/* ===== sunum dili: fotoğraflar zemine erir, tek renk karakteri ===== */
:root{--grade:contrast(1.06) saturate(.86) brightness(.97);--fx:9%;--fy:12%}
.hero-media img,.pcard .media img,.split-img .frame img,.band .img img,.note .im img,.gal img,.mosaic img,.st-g img,.t2-g img,.lb img{filter:var(--grade)}

/* yumuşak kenar maskesi */
.phero.has-img .hero-media img,.pcard .media img,.split-img .frame img,.band .img img,.note .im img,.gal,.mosaic,.st-g,.t2-g{
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--fx),#000 calc(100% - var(--fx)),transparent 100%),linear-gradient(180deg,transparent 0,#000 var(--fy),#000 calc(100% - var(--fy)),transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent 0,#000 var(--fx),#000 calc(100% - var(--fx)),transparent 100%),linear-gradient(180deg,transparent 0,#000 var(--fy),#000 calc(100% - var(--fy)),transparent 100%);
  mask-composite:intersect}

/* çerçeve zeminleri kalksın, görsel doğrudan sayfa rengine karışsın */
.pcard .media,.split-img .frame,.note .im,.gal button,.mosaic figure,.st-g figure,.t2-g figure{background:transparent}
.pcard .media::after{display:none}
.split-img .frame{border-radius:0}

/* kenar yumuşaklığı ölçeğe göre */
.pcard .media,.split-img .frame{--fx:6%;--fy:9%}
.pcard.wide .media{--fx:4%;--fy:10%}
/* kolajlar tek kompozisyon: kareler net, dış kenarları zemine dağılır */
.mosaic,.st-g,.t2-g,.gal{--fx:5%;--fy:7%}
.note .im{--fx:10%;--fy:10%}
.note{background:transparent}

/* Kamukent bandı: görsel sola doğru koyu zemine dağılır */
.band .img img{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 38%),linear-gradient(180deg,transparent 0,#000 10%,#000 90%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 38%),linear-gradient(180deg,transparent 0,#000 10%,#000 90%,transparent 100%)}

/* sayfa başları: ana sayfadaki gibi sağdan, kenarları eriyen görsel */
.phero.has-img{background:var(--ink-deep)}
.phero.has-img .hero-media{left:auto;right:0;width:min(78%,1640px)}
.phero.has-img .hero-media img{--fx:0%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 36%,#000 90%,transparent 100%),linear-gradient(180deg,transparent 0,#000 22%,#000 68%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 36%,#000 90%,transparent 100%),linear-gradient(180deg,transparent 0,#000 22%,#000 68%,transparent 100%)}
.phero.has-img .hero-media::after{background:linear-gradient(90deg,rgba(22,24,27,.75) 0%,rgba(22,24,27,.4) 32%,rgba(22,24,27,0) 60%)}

@media (max-width:860px){
  .phero.has-img .hero-media{width:100%}
  .phero.has-img .hero-media img{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 10%,#000 90%,transparent 100%),linear-gradient(180deg,transparent 0,#000 16%,#000 72%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 10%,#000 90%,transparent 100%),linear-gradient(180deg,transparent 0,#000 16%,#000 72%,transparent 100%)}
  .phero.has-img .hero-media::after{background:none}
  .band .img img{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 80%,transparent 100%),linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 80%,transparent 100%),linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%)}
  .mosaic,.st-g,.t2-g,.gal{--fx:4%;--fy:4%}
}

/* marka satırı: iki satır ortalı, logodaki beyaz-kırmızı */
.brand>span{display:flex;flex-direction:column;align-items:center;text-align:center}
.brand small{font-size:8.5px;letter-spacing:.17em;margin-top:7px;white-space:nowrap}
.eb2 span{text-align:center}
.eb2 .eb-n{display:block;font:inherit;letter-spacing:inherit;color:#fff}
.eb2 .eb-n i{font-style:normal;color:var(--red-hi)}
.eb2 small{letter-spacing:.2em}
@media (max-width:860px){
  .brand small{font-size:7.5px;letter-spacing:.12em}
  .st-g{grid-auto-flow:dense}
}
.eb2>span{display:inline-flex;flex-direction:column;align-items:center}
/* kurumsal görsel: daha geniş, yumuşak geçiş */
.split-img .frame{--fx:14%;--fy:14%}

.split-img img{aspect-ratio:4/3}
.split-img .tag{position:static;background:none;padding:14px 0 0;text-align:center}

/* sayfa başı görseli: bina bütünüyle görünsün */
.phero.has-img .hero-media{width:min(64%,1300px)}
.phero.has-img .hero-media img{object-position:center 55%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22%,#000 94%,transparent 100%),linear-gradient(180deg,transparent 0,#000 14%,#000 82%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 22%,#000 94%,transparent 100%),linear-gradient(180deg,transparent 0,#000 14%,#000 82%,transparent 100%)}
.phero.has-img .hero-media::after{background:linear-gradient(90deg,rgba(22,24,27,.35) 0%,rgba(22,24,27,0) 30%)}
@media (max-width:860px){.phero.has-img .hero-media{width:100%}.phero.has-img .hero-media::after{background:none}}
@media (min-width:861px){.phero.has-img .hero-media{top:92px;bottom:auto;height:auto;aspect-ratio:1.4/1;max-height:calc(100% - 92px)}.phero.has-img .hero-media img{height:100%}}

/* ===== Şantiyeden: paylaşım akışı ===== */
.feed .filters a.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.post{display:grid;grid-template-columns:minmax(260px,.9fr) 2fr;gap:clamp(28px,4vw,64px);align-items:start;padding:clamp(40px,5vw,64px) 0;border-top:1px solid var(--line-l)}
.post-h{position:sticky;top:110px}
.post-meta{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}
.post-meta span{font:600 10.5px/1 var(--body);letter-spacing:.24em;text-transform:uppercase;color:var(--red)}
.post-meta time{font:500 13px/1 var(--body);color:var(--stone)}
.post h2{font:600 clamp(26px,2.6vw,36px)/1.15 var(--display);letter-spacing:-.02em;margin:0 0 18px}
.post-h p{font-size:15px;line-height:1.75;color:var(--txt-2);margin:0 0 14px}
.post .lnk{display:inline-flex;align-items:center;gap:10px;margin-top:10px;font:600 13px/1 var(--body);letter-spacing:.04em;color:var(--txt);border-bottom:1px solid var(--red);padding-bottom:6px}
.post .lnk svg{width:16px;height:16px;transition:transform .4s var(--ease)}
.post .lnk:hover svg{transform:translateX(4px)}
/* kaydırmalı pano şeridi: tasarlanmış kareler olduğu gibi, renk ve maske yok */
.gal.pg{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:14px;-webkit-mask-image:linear-gradient(90deg,#000 0,#000 88%,transparent 100%);mask-image:linear-gradient(90deg,#000 0,#000 88%,transparent 100%);scrollbar-width:thin;scrollbar-color:var(--stone) transparent}
.gal.pg button{flex:0 0 clamp(220px,24vw,330px);aspect-ratio:4/5;scroll-snap-align:start;background:transparent;box-shadow:0 18px 40px -24px rgba(22,24,27,.45)}
.gal.pg img{filter:none;height:100%;object-fit:cover}
.gal.pg.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;overflow:visible;max-width:560px;-webkit-mask-image:none;mask-image:none;padding:0}
.gal.pg.grid3 button{flex:none;width:auto;box-shadow:none}
.post .swipe{grid-column:2;margin:-4px 0 0;font:600 10px/1 var(--body);letter-spacing:.22em;text-transform:uppercase;color:var(--stone)}
.post:has(.grid3) .swipe{display:none}
@media (max-width:860px){
  .post{grid-template-columns:1fr;gap:24px}
  .post-h{position:static}
  .post .swipe{grid-column:1}
  .gal.pg button{flex-basis:72vw}
  .gal.pg{margin-right:calc(var(--gut)*-1);padding-right:var(--gut)}
  .gal.pg.grid3{margin-right:0;padding-right:0}
}
.post[hidden]{display:none}
/* Kamukent kapağı: görsel sayfayı tam kaplar */
.phero.full .hero-media img{-webkit-mask-image:linear-gradient(180deg,#000 0,#000 78%,transparent 100%);mask-image:linear-gradient(180deg,#000 0,#000 78%,transparent 100%)}
@media (min-width:861px){
  .phero.full{min-height:92svh}
  .phero.full .hero-media{inset:0;width:auto;height:auto;aspect-ratio:auto;max-height:none}
  .phero.full .hero-media img{height:100%;object-position:50% 2%}
  .phero.full .hero-media::after{background:linear-gradient(90deg,rgba(22,24,27,.85) 0%,rgba(22,24,27,.55) 34%,rgba(22,24,27,0) 66%),linear-gradient(180deg,rgba(22,24,27,.55) 0%,rgba(22,24,27,0) 22%)}
}

/* menü: 5 sayfa sığmadığında hamburger 1080px'e kadar */
@media (min-width:861px) and (max-width:1080px){
  .nav{position:fixed;inset:0;background:var(--ink-deep);color:#fff;flex-direction:column;justify-content:center;gap:26px;opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility .45s}
  .nav a{font:600 28px/1 var(--display)}
  .nav a.btn{font:600 15px/1 var(--body);margin-top:10px}
  .menu-open .nav{opacity:1;visibility:visible}
  .menu-open .hdr{color:#fff}.menu-open .hdr.solid{background:transparent;box-shadow:none;backdrop-filter:none}
  .menu-btn{display:block;z-index:2}
  .brand{z-index:2}
}
.nav a.btn{white-space:nowrap}

/* orta genişlik: menü yazıları geri, sığacak kadar sıkı */
@media (min-width:861px) and (max-width:1080px){
  .nav{position:static;inset:auto;background:none;color:inherit;flex-direction:row;justify-content:flex-end;gap:15px;opacity:1;visibility:visible;transition:none}
  .nav a{font:500 12.5px/1 var(--body)}
  .nav a.btn{font:600 12.5px/1 var(--body);margin-top:0;height:38px;padding:0 14px}
  .menu-btn{display:none}
  .brand{gap:10px}.brand img{width:38px}
  .brand b{font-size:13.5px}
  .brand small{font-size:7px;letter-spacing:.1em}
}
/* dil seçici */
.lng{display:inline-flex;align-items:center;gap:2px;margin-right:4px}
.nav .lng a{font:600 11px/1 var(--body);letter-spacing:.14em;padding:6px 6px;opacity:.55;transition:opacity .3s}
.nav .lng a::after{display:none}
.nav .lng a:hover{opacity:1}
.nav .lng a[aria-current]{opacity:1;color:var(--red-hi)}
.hdr.solid .nav .lng a[aria-current]{color:var(--red)}
.lng-f{display:flex;justify-content:flex-end;margin:0 0 22px}
.lng-f .lng a{font:600 11px/1 var(--body);letter-spacing:.16em;padding:6px 8px;opacity:.6;color:inherit}
.lng-f .lng a[aria-current]{opacity:1;color:var(--red-hi)}
@media (min-width:861px) and (max-width:1180px){.nav .lng{display:none}}
@media (max-width:860px){
  .nav .lng{order:99;margin:18px 0 0;gap:6px}
  .nav .lng a{font:600 14px/1 var(--body);opacity:.6}
  .lng-f{justify-content:center}
}