
/* Layout: tek sayfa, tam genişlik renk bantları (koyu / krem / kiremit), içerik 1200px kolonda; büyük sıkı başlık + ince çizgi + DM Mono etiket. */
:root{
  --oda:#1B1A17;      /* Karanlık Oda */
  --krem:#E9DCC0;
  --kiremit:#B0461F;
  --hardal:#D49B34;   /* sadece işaret/vurgu */
  --krem-2:#DFD0B0;   /* krem üstünde ince yüzey */
  --oda-2:#2A2824;
  --cizgi-koyu:rgba(27,26,23,.22);
  --cizgi-acik:rgba(233,220,192,.22);
  --f-baslik:"Instrument Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --f-etiket:"DM Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --s-1:clamp(44px,8.4vw,120px);
  --s-2:clamp(34px,5.2vw,72px);
  --s-3:clamp(22px,2.4vw,30px);
  --s-body:17px;
  --s-etiket:12px;
  color-scheme:light;
}
*{box-sizing:border-box}
body{margin:0}
img{max-width:100%}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
body{background:var(--krem);color:var(--oda);font-family:var(--f-baslik);font-size:var(--s-body);line-height:1.5;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--oda)}
a{color:inherit}
:focus-visible{outline:2px solid var(--hardal);outline-offset:3px}
.ic{max-width:1200px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
@media (min-width:700px){.ic{padding-left:max(40px,env(safe-area-inset-left,0px));padding-right:max(40px,env(safe-area-inset-right,0px))}}
.bant{padding-block:clamp(48px,5.5vw,80px)}
.koyu{background:var(--oda);color:var(--krem)}
.kiremit{background:var(--kiremit);color:var(--krem)}
.etiket{font-family:var(--f-etiket);font-size:var(--s-etiket);letter-spacing:.12em;text-transform:uppercase;font-weight:500}
h1,h2,h3{font-family:var(--f-baslik);font-stretch:100%;font-weight:600;letter-spacing:-.02em;line-height:.98;margin:0;text-wrap:balance}
h1{font-size:var(--s-1)}
h2{font-size:var(--s-2)}
h3{font-size:var(--s-3);letter-spacing:-.02em;line-height:1.1}
p{margin:0;max-width:62ch}
.ust-baslik{display:grid;gap:20px;margin-bottom:clamp(28px,4vw,48px)}
.ust-baslik p{font-size:19px;opacity:.82}

/* Üst menü */
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--oda);color:var(--krem);border-bottom:1px solid var(--cizgi-acik)}
header .ic{display:flex;align-items:center;justify-content:space-between;gap:24px;height:68px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--krem)}
.logo img{height:30px;width:auto;display:block}
.logo span{font-family:"Lexend",var(--f-baslik);font-weight:500;font-size:22px;letter-spacing:-.03em;line-height:1}
nav ul{display:flex;gap:clamp(16px,2vw,28px);list-style:none;margin:0;padding:0}
nav a{text-decoration:none;opacity:.8;white-space:nowrap;font-size:15px}
nav a:hover{opacity:1}
.dugme{white-space:nowrap;display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border-radius:999px;text-decoration:none;font-weight:600;font-size:15px;border:1px solid currentColor;transition:background .2s,color .2s}
.dugme.dolu{background:var(--krem);color:var(--oda);border-color:var(--krem)}
.dugme.dolu:hover{background:transparent;color:var(--krem)}
@media (max-width:1080px){nav{display:none}}

/* Açılış: solda başlık, sağda format değiştiren vizör */
.acilis{padding-block:clamp(56px,8vw,112px)}
.acilis .ic{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(40px,5vw,80px);align-items:center}
.acilis .metin{display:grid;gap:28px;min-width:0}
.acilis h1 em{font-style:normal;color:var(--hardal)}
.acilis .metin p{font-size:clamp(19px,1.8vw,23px);max-width:34ch;opacity:.9}
.acilis .metin .dugme{justify-self:start}
@media (max-width:860px){.acilis .ic{grid-template-columns:1fr}}
.sahne{position:relative;width:100%;max-width:520px;aspect-ratio:1/1;justify-self:center;display:grid;place-items:center}
.hayalet{position:absolute;border:1px dashed var(--cizgi-acik)}
.hayalet.y{width:100%;height:56.25%}
.hayalet.d{width:56.25%;height:100%}
.vizor{position:relative;width:100%;height:56.25%;transition:width .9s cubic-bezier(.7,0,.2,1),height .9s cubic-bezier(.7,0,.2,1);background:
  linear-gradient(var(--cizgi-acik),var(--cizgi-acik)) 33.33% 0/1px 100% no-repeat,
  linear-gradient(var(--cizgi-acik),var(--cizgi-acik)) 66.66% 0/1px 100% no-repeat,
  linear-gradient(var(--cizgi-acik),var(--cizgi-acik)) 0 33.33%/100% 1px no-repeat,
  linear-gradient(var(--cizgi-acik),var(--cizgi-acik)) 0 66.66%/100% 1px no-repeat,
  var(--oda-2);display:grid;place-items:center;overflow:hidden}
.vizor .kose{position:absolute;width:22px;height:22px;border-color:var(--krem);border-style:solid;border-width:0}
.vizor .k1{top:10px;left:10px;border-top-width:2px;border-left-width:2px}
.vizor .k2{top:10px;right:10px;border-top-width:2px;border-right-width:2px}
.vizor .k3{bottom:10px;left:10px;border-bottom-width:2px;border-left-width:2px}
.vizor .k4{bottom:10px;right:10px;border-bottom-width:2px;border-right-width:2px}
.vizor .isaret{width:clamp(48px,12%,80px);height:auto}
.vizor .ust{position:absolute;top:16px;left:40px;right:40px;display:flex;justify-content:space-between;gap:8px;font-size:11px}
.vizor .alt{position:absolute;bottom:16px;left:40px;right:40px;display:flex;justify-content:space-between;gap:8px;font-size:11px}
.rec{display:inline-flex;align-items:center;gap:6px}
.rec::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--kiremit);animation:yanip 1.2s steps(2) infinite}
@keyframes yanip{50%{opacity:0}}
.tc{font-variant-numeric:tabular-nums}
.vizor .format{color:var(--hardal)}
@media (prefers-reduced-motion:reduce){.rec::before{animation:none}.vizor{transition:none}}

/* Fikirden yayına */
.akis{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--cizgi-koyu)}
.akis li{list-style:none;padding:24px 24px 8px 0;display:grid;gap:12px;align-content:start;min-width:0}
.akis li+li{padding-left:24px;border-left:1px solid var(--cizgi-koyu)}
.akis .no{color:var(--kiremit)}
.akis ol{margin:0;padding:0}
@media (max-width:820px){.akis{grid-template-columns:1fr 1fr}.akis li:nth-child(3){padding-left:0;border-left:0}.akis li:nth-child(n+3){border-top:1px solid var(--cizgi-koyu)}}
@media (max-width:480px){.akis{grid-template-columns:1fr}.akis li,.akis li+li{padding-left:0;border-left:0}.akis li+li{border-top:1px solid var(--cizgi-koyu)}}

/* Kimin için: iki seçenek */
.secim{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.secim button{font:inherit;color:inherit;text-align:left;cursor:pointer;background:var(--krem-2);border:1px solid transparent;padding:clamp(22px,3vw,36px);display:grid;gap:12px;align-content:start;min-width:0;transition:background .2s,color .2s}
.secim button:hover{border-color:var(--cizgi-koyu)}
.secim button[aria-expanded="true"]{background:var(--oda);color:var(--krem)}
.secim button .etiket{color:var(--kiremit)}
.secim button[aria-expanded="true"] .etiket{color:var(--hardal)}
.secim button h3{font-size:clamp(28px,3.6vw,48px);letter-spacing:-.035em}
.secim button p{opacity:.8}
.secim .ac{font-family:var(--f-etiket);font-size:12px;letter-spacing:.12em;text-transform:uppercase;margin-top:8px}
@media (max-width:640px){.secim{grid-template-columns:1fr}}
.detay{background:var(--oda);color:var(--krem);padding:clamp(24px,4vw,48px);margin-top:16px;display:grid;gap:32px}
.detay .giris{font-size:clamp(20px,2vw,24px);max-width:48ch}
.hizmetler{display:grid;grid-template-columns:repeat(3,1fr);gap:0 32px}
.hizmetler div{padding-block:18px;border-top:1px solid var(--cizgi-acik);display:grid;gap:6px;align-content:start;min-width:0}
.hizmetler b{font-size:19px;font-weight:600;letter-spacing:-.01em}
.hizmetler p{font-size:15px;opacity:.75}
.hizmetler .ornek{font-family:var(--f-etiket);font-size:11px;letter-spacing:.08em;color:var(--hardal);opacity:1}
@media (max-width:900px){.hizmetler{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.hizmetler{grid-template-columns:1fr}}
.detay .dugme{justify-self:start}

/* Neden biz */
.neden{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(24px,3vw,40px)}
.neden div{display:grid;gap:14px;align-content:start;padding-top:20px;border-top:2px solid var(--hardal);min-width:0}
.neden p{opacity:.78}
@media (max-width:900px){.neden{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.neden{grid-template-columns:1fr}}

/* Ne çekiyoruz: kutular */
.formatlar{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.formatlar div{background:var(--krem-2);padding:clamp(22px,2.6vw,32px);display:grid;gap:14px;align-content:start;min-height:220px;min-width:0}
.formatlar .genis{grid-column:span 2;background:var(--oda);color:var(--krem)}
.formatlar h3{font-size:clamp(28px,3.4vw,46px);letter-spacing:-.035em}
.formatlar p{opacity:.8;max-width:42ch}
.formatlar .oran{color:var(--kiremit)}
.formatlar .genis .oran{color:var(--hardal)}
@media (max-width:820px){.formatlar{grid-template-columns:1fr 1fr}.formatlar div{min-height:0}}
@media (max-width:520px){.formatlar{grid-template-columns:1fr}.formatlar .genis{grid-column:auto}}

/* Nerede çekiyoruz */
.yerler{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:56px}
.yerler div{padding:22px;border:1px solid var(--cizgi-acik);display:grid;gap:8px;min-width:0;align-content:start}

.yerler p{opacity:.78;font-size:15px}
@media (max-width:760px){.yerler{grid-template-columns:1fr}}
.galeri{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.galeri figure{margin:0;display:grid;gap:10px;min-width:0}
.galeri img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;max-width:100%}
.galeri figcaption{display:flex;justify-content:space-between;gap:8px;font-size:15px}
.galeri figcaption .etiket{opacity:.6;font-size:11px}
.galeri .genis{grid-column:span 2}
.galeri .genis img{aspect-ratio:8/3.05}
@media (max-width:820px){.galeri{grid-template-columns:1fr 1fr}.galeri .genis{grid-column:span 2}}

/* İşlerimiz */
.sekme{display:flex;gap:8px;margin-bottom:28px;flex-wrap:wrap}
.sekme button{font:inherit;font-family:var(--f-etiket);font-size:12px;letter-spacing:.12em;text-transform:uppercase;padding:10px 18px;border-radius:999px;border:1px solid var(--cizgi-acik);background:transparent;color:var(--krem);cursor:pointer}
.sekme button[aria-selected="true"]{background:var(--krem);color:var(--oda);border-color:var(--krem)}
.isler{display:grid;grid-template-columns:repeat(3,1fr);gap:28px 16px}
.isler figure{margin:0;display:grid;gap:12px;align-content:start;min-width:0}
.isler img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;display:block;max-width:100%;background:var(--oda-2)}
.isler.markalar img{object-position:center 25%}
.isler figcaption{display:grid;gap:4px}
.isler figcaption b{font-size:20px;letter-spacing:-.01em;font-weight:600}
.isler figcaption span{font-size:14px;opacity:.7}
.isler figcaption .etiket{color:var(--hardal);opacity:1;font-size:11px}
.ayrica{margin-top:40px;padding-top:20px;border-top:1px solid var(--cizgi-acik);display:flex;flex-wrap:wrap;gap:10px 28px;align-items:baseline}
.ayrica .etiket{opacity:.6}
@media (max-width:820px){.isler{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.isler{grid-template-columns:1fr}}

/* Nasıl çalışıyoruz: kutular */
.surec{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0;padding:0}
.surec li{list-style:none;display:grid;gap:14px;align-content:start;padding:clamp(20px,2.4vw,28px);background:var(--krem-2);min-height:220px;min-width:0;position:relative}
.surec li:last-child{background:var(--kiremit);color:var(--krem)}
.surec .no{color:var(--kiremit)}
.surec li:last-child .no{color:var(--krem)}
.surec p{opacity:.8}
.surec li:not(:last-child)::after{content:"→";position:absolute;right:-11px;top:50%;transform:translateY(-50%);width:22px;height:22px;display:grid;place-items:center;background:var(--krem);border-radius:50%;font-size:13px;z-index:1}
@media (max-width:820px){.surec{grid-template-columns:1fr 1fr}.surec li{min-height:0}.surec li::after{display:none}}
@media (max-width:480px){.surec{grid-template-columns:1fr}}

/* İletişim */
.iletisim .ic{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:start}
.iletisim h2{font-size:var(--s-2)}
.kanallar{display:grid;gap:0;margin-top:40px}
.kanallar a,.kanallar div{display:flex;justify-content:space-between;gap:16px;padding-block:14px;border-top:1px solid rgba(233,220,192,.35);text-decoration:none;flex-wrap:wrap}
.kanallar .etiket{opacity:.75}
form{display:grid;gap:14px}
label{display:grid;gap:6px}
input,textarea,select{font:inherit;font-size:16px;color:var(--krem);background:transparent;border:0;border-bottom:1px solid rgba(233,220,192,.5);padding:10px 0;border-radius:0}
select option{color:var(--oda)}
input::placeholder,textarea::placeholder{color:rgba(233,220,192,.55)}
textarea{min-height:96px;resize:vertical}
form .dugme{justify-self:start;margin-top:10px;cursor:pointer;background:var(--krem);color:var(--oda);border-color:var(--krem)}
form .not{font-size:14px;min-height:1.4em}
@media (max-width:820px){.iletisim .ic{grid-template-columns:1fr}}

footer{background:var(--oda);color:var(--krem);padding-block:40px}
footer .ic{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
footer .etiket{opacity:.6}

.s-ust .ust-baslik{margin-bottom:28px}
.s-ust h1{font-size:var(--s-2)}
.s-ust .ust-baslik p{max-width:56ch}
.s-ust .etiket a{color:inherit}
.s-liste{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.s-liste div{padding:clamp(20px,2.4vw,28px);background:var(--krem-2);display:grid;gap:10px;align-content:start;min-width:0}
.s-liste p{opacity:.8}
@media (max-width:820px){.s-liste{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.s-liste{grid-template-columns:1fr}}
.s-sss{max-width:820px}
.s-sss details{border-top:1px solid var(--cizgi-koyu);padding:18px 0}
.s-sss details:last-child{border-bottom:1px solid var(--cizgi-koyu)}
.s-sss summary{font-weight:600;font-size:19px;cursor:pointer;letter-spacing:-.01em}
.s-sss details p{margin-top:10px;opacity:.8}
.s-diger{margin-top:clamp(40px,5vw,64px);display:grid;gap:14px}
.s-diger div{display:flex;flex-wrap:wrap;gap:10px}
.s-diger .dugme{font-weight:500}
.s-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px}
.s-yazi{max-width:720px}
.s-yazi h2{font-size:var(--s-3);letter-spacing:-.02em;line-height:1.15;margin:36px 0 12px}
.s-yazi h2:first-child{margin-top:0}
.s-yazi p{font-size:18px;line-height:1.6}
.s-yazi .s-son{margin-top:36px;padding-top:24px;border-top:1px solid var(--cizgi-koyu)}
.s-yazi a,.s-yazilar a{color:inherit}
.s-yazilar{display:grid;gap:12px;max-width:820px}
.s-yazilar a{display:grid;gap:10px;padding:clamp(20px,2.4vw,28px);background:var(--krem-2);text-decoration:none}
.s-yazilar a:hover{background:var(--kiremit);color:var(--krem)}
.s-yazilar h2{font-size:var(--s-3);letter-spacing:-.02em;line-height:1.15}
.s-yazilar p{opacity:.8}
/* s-gorsel */
.s-ust .ic{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,400px);column-gap:56px;align-items:center}
.s-ust .ust-baslik,.s-ust .ic>.dugme{grid-column:1}
.s-ust .ic>.dugme{justify-self:start}
.s-gorsel{grid-column:2;grid-row:1 / span 2;position:relative;aspect-ratio:4/3;border:1px solid var(--cizgi-acik);background:var(--oda-2);overflow:hidden;color:var(--krem)}
@media (max-width:860px){.s-ust .ic{grid-template-columns:1fr}.s-gorsel{display:none}}
.s-gorsel .ust,.s-gorsel .alt{position:absolute;left:14px;right:14px;display:flex;justify-content:space-between;font-family:var(--f-etiket);font-size:11px;letter-spacing:.12em;text-transform:uppercase;z-index:2}
.s-gorsel .ust{top:12px}
.s-gorsel .alt{bottom:12px}
.s-gorsel .hardal{color:var(--hardal)}
.s-gorsel .rec::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--kiremit);margin-right:7px;vertical-align:1px;animation:sYan 1.2s steps(2) infinite}
@keyframes sYan{50%{opacity:0}}
.s-dalga{position:absolute;inset:28% 9%;display:flex;align-items:center;gap:5px}
.s-dalga i{flex:1;height:18%;background:var(--hardal);border-radius:2px;animation:sDalga 1s ease-in-out infinite alternate}
@keyframes sDalga{to{height:88%}}
.s-oynat{position:absolute;inset:0;display:grid;place-items:center}
.s-oynat b{width:76px;height:76px;border-radius:50%;background:var(--kiremit);display:grid;place-items:center;animation:sNabiz 2.4s ease-in-out infinite}
.s-oynat b::after{content:"";border-left:22px solid var(--krem);border-top:13px solid transparent;border-bottom:13px solid transparent;margin-left:6px}
@keyframes sNabiz{50%{transform:scale(1.08)}}
.s-ilerleme{position:absolute;left:14px;right:14px;bottom:40px;height:3px;background:var(--cizgi-acik)}
.s-ilerleme b{display:block;height:100%;width:0;background:var(--kiremit);animation:sIlerle 8s linear infinite}
@keyframes sIlerle{to{width:100%}}
.s-telefon{position:absolute;top:9%;bottom:9%;left:50%;transform:translateX(-50%);aspect-ratio:9/16;border:1px solid var(--krem);border-radius:16px;overflow:hidden}
.s-akis{height:100%;animation:sKay 8s ease-in-out infinite}
.s-akis div{height:100%;display:grid;align-content:end;gap:6px;padding:14px}
.s-akis div:nth-child(1),.s-akis div:nth-child(4){background:var(--kiremit)}
.s-akis div:nth-child(2){background:var(--oda)}
.s-akis div:nth-child(3){background:#3A3630}
.s-akis i{display:block;height:6px;border-radius:3px;background:var(--krem);opacity:.85}
.s-akis i+i{width:60%;opacity:.5}
@keyframes sKay{0%,22%{transform:translateY(0)}33%,55%{transform:translateY(-100%)}66%,88%{transform:translateY(-200%)}100%{transform:translateY(-300%)}}
.s-kalp{position:absolute;right:calc(50% - 82px);bottom:22%;width:26px;height:26px;z-index:2;animation:sKalp 2s ease-in-out infinite}
.s-kalp svg{width:100%;height:100%;fill:var(--krem)}
@keyframes sKalp{0%,100%{transform:scale(1)}15%{transform:scale(1.3)}30%{transform:scale(1)}}
.s-cizgi{position:absolute;inset:0}
.s-cizgi i{position:absolute;background:var(--cizgi-acik)}
.s-cizgi i:nth-child(1){left:33.33%;top:0;bottom:0;width:1px}
.s-cizgi i:nth-child(2){left:66.66%;top:0;bottom:0;width:1px}
.s-cizgi i:nth-child(3){top:33.33%;left:0;right:0;height:1px}
.s-cizgi i:nth-child(4){top:66.66%;left:0;right:0;height:1px}
.s-odak{position:absolute;width:22%;aspect-ratio:1;border:2px solid var(--hardal);animation:sOdak 7s ease-in-out infinite}
@keyframes sOdak{0%,100%{left:20%;top:22%}30%{left:58%;top:30%}60%{left:38%;top:52%}}
.s-isik{position:absolute;inset:0}
.s-isik i{position:absolute;top:-10%;width:34%;height:120%;left:33%;background:linear-gradient(to bottom,rgba(233,220,192,.38),rgba(233,220,192,0) 85%);clip-path:polygon(45% 0,55% 0,100% 100%,0 100%);transform-origin:50% 0;animation:sIsik 5s ease-in-out infinite alternate}
.s-isik i:nth-child(1){left:2%;animation-delay:-1.5s}
.s-isik i:nth-child(3){left:64%;animation-delay:-3s;background:linear-gradient(to bottom,rgba(176,70,31,.55),rgba(176,70,31,0) 85%)}
@keyframes sIsik{from{transform:rotate(-14deg)}to{transform:rotate(14deg)}}
.s-kalabalik{position:absolute;left:0;right:0;bottom:0;height:22%;background:radial-gradient(circle at 6% 100%,var(--oda) 22px,transparent 23px),radial-gradient(circle at 18% 100%,var(--oda) 28px,transparent 29px),radial-gradient(circle at 31% 100%,var(--oda) 20px,transparent 21px),radial-gradient(circle at 44% 100%,var(--oda) 30px,transparent 31px),radial-gradient(circle at 58% 100%,var(--oda) 24px,transparent 25px),radial-gradient(circle at 71% 100%,var(--oda) 29px,transparent 30px),radial-gradient(circle at 84% 100%,var(--oda) 21px,transparent 22px),radial-gradient(circle at 96% 100%,var(--oda) 27px,transparent 28px)}
.s-satirlar{position:absolute;inset:22% 12%;display:grid;align-content:start;gap:16px}
.s-satirlar i{display:block;height:8px;border-radius:4px;background:var(--krem);opacity:.75;width:0;animation:sYaz 7s steps(24) infinite}
.s-satirlar i:nth-child(1){--w:90%;animation-delay:0s;background:var(--hardal);opacity:1;height:12px}
.s-satirlar i:nth-child(2){--w:82%;animation-delay:.8s}
.s-satirlar i:nth-child(3){--w:94%;animation-delay:1.6s}
.s-satirlar i:nth-child(4){--w:70%;animation-delay:2.4s}
.s-satirlar i:nth-child(5){--w:56%;animation-delay:3.2s}
@keyframes sYaz{0%{width:0}12%,85%{width:var(--w)}100%{width:var(--w);opacity:0}}
.isler.yatay img{aspect-ratio:16/10;object-position:top}
.isler.orta img{aspect-ratio:4/5;object-position:center}
.isler.dikey{grid-template-columns:repeat(5,1fr);gap:24px 12px}
.isler.dikey img{aspect-ratio:9/16;object-position:center}
@media (max-width:820px){.isler.dikey{grid-template-columns:repeat(3,1fr)}}
@media (max-width:480px){.isler.dikey{grid-template-columns:1fr 1fr}}
@media (prefers-reduced-motion:reduce){.s-gorsel *,.s-gorsel *::before{animation:none!important}}
.formatlar .devam{margin-top:auto;font-family:var(--f-etiket);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--kiremit);text-decoration:none}
.formatlar .devam:hover{text-decoration:underline}
.alt-menu{display:flex;flex-wrap:wrap;gap:8px 20px;width:100%;order:3}
.alt-menu a{color:inherit;opacity:.75;text-decoration:none;font-size:14px}
.alt-menu a:hover{opacity:1}

/* Blog yazısı: görsel, veri kutusu, setten not, kaynaklar */
.s-yazi figure{margin:36px 0;display:grid;gap:10px}
.s-yazi figure img{width:100%;height:auto;display:block;background:var(--oda-2)}
.s-yazi figure.dikey-iki{grid-template-columns:1fr 1fr;gap:12px}
.s-yazi figure.dikey-iki img{aspect-ratio:9/16;object-fit:cover}
.s-yazi figure.dikey-iki figcaption{grid-column:1/-1}
.s-yazi figure svg{width:100%;height:auto;display:block}
.s-yazi figcaption{font-size:14px;line-height:1.5;opacity:.72}
.s-yazi ul,.s-yazi ol{font-size:18px;line-height:1.6;padding-left:22px;margin:12px 0 0;display:grid;gap:6px}
.s-yazi p+p{margin-top:14px}
.s-veri{margin:32px 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.s-veri div{background:var(--oda);color:var(--krem);padding:22px 24px;display:grid;gap:10px;align-content:start;border-top:3px solid var(--kiremit)}
.s-veri b{font-size:clamp(38px,5vw,56px);font-weight:600;letter-spacing:-.03em;line-height:1}
.s-veri span{font-size:15px;line-height:1.45;opacity:.88}
.s-veri a{font-family:var(--f-etiket);font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.6;text-decoration:none}
.s-veri a:hover{opacity:1;text-decoration:underline}
.s-not{margin:32px 0;padding:22px 24px;background:var(--krem-2);border-left:3px solid var(--kiremit);display:grid;gap:8px}
.s-not .etiket{color:var(--kiremit)}
.s-not p{font-size:17px}
.s-tablo{width:100%;border-collapse:collapse;margin:20px 0 0;font-size:16px}
.s-tablo th,.s-tablo td{text-align:left;padding:12px 10px 12px 0;border-top:1px solid var(--cizgi-koyu);vertical-align:top}
.s-tablo th{font-family:var(--f-etiket);font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:500;opacity:.7}
.s-kaynaklar{margin-top:44px;padding-top:24px;border-top:1px solid var(--cizgi-koyu)}
.s-kaynaklar h2{font-size:20px;margin:0 0 10px}
.s-kaynaklar ol{font-size:15px;line-height:1.5;opacity:.85}
@media (max-width:520px){.s-yazi figure.dikey-iki{grid-template-columns:1fr 1fr}.s-tablo{font-size:15px}}
/* Blog düzeni: yan sütun, içindekiler, liste kapakları */
.s-duzen{display:grid;grid-template-columns:minmax(0,720px) minmax(240px,300px);justify-content:space-between;gap:64px;align-items:start}
.s-yan{position:sticky;top:96px;display:grid;gap:16px}
.s-icindekiler{border-top:2px solid var(--oda);padding-top:16px;display:grid;gap:12px}
.s-icindekiler .etiket{color:var(--kiremit)}
.s-icindekiler ol{list-style:none;padding:0;margin:0;display:grid;gap:10px;font-size:15px;line-height:1.35}
.s-icindekiler a{text-decoration:none;opacity:.8;color:inherit}
.s-icindekiler a:hover{opacity:1;color:var(--kiremit)}
.s-yan-kutu{background:var(--oda);color:var(--krem);padding:22px;display:grid;gap:12px}
.s-yan-kutu .etiket{opacity:.7}
.s-yan-kutu b{font-size:24px;font-weight:600;letter-spacing:-.02em;line-height:1.1}
.s-yan-kutu p{font-size:15px;opacity:.85}
.s-yan-kutu .dugme{justify-self:start}
.s-yazi h2{scroll-margin-top:90px}
.s-yazi figure.tek-dikey{max-width:340px}
.s-yazi figure.dar{max-width:560px}
@media (max-width:980px){.s-duzen{grid-template-columns:1fr;gap:40px}.s-yan{position:static}.s-icindekiler{display:none}}
.s-yazilar{grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr));max-width:none;gap:16px}
.s-yazilar a{padding:0;gap:0;align-content:start}
.s-yazilar a .s-gorsel{grid-column:auto;grid-row:auto;display:block;aspect-ratio:16/9;border:0}
.s-yazilar .metin{padding:clamp(20px,2.4vw,28px);display:grid;gap:10px}
/* Mobil düzen (16 Ekim) */
html{scroll-padding-top:76px}
.s-yazi h2{scroll-margin-top:16px}
.menu-ac{display:none}
@media (max-width:1080px){
  header .ic{gap:10px}
  .logo{margin-right:auto}
  .menu-ac{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;flex:none;border:1px solid var(--cizgi-acik);border-radius:50%;background:none;color:var(--krem);cursor:pointer;padding:0}
  .menu-ac span{display:block;width:18px;height:1.5px;background:currentColor;transition:transform .25s}
  header.menu-acik .menu-ac span:first-child{transform:translateY(3.25px) rotate(45deg)}
  header.menu-acik .menu-ac span:last-child{transform:translateY(-3.25px) rotate(-45deg)}
  header nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--oda);border-bottom:1px solid var(--cizgi-acik);max-height:calc(100dvh - 68px);overflow-y:auto}
  header.menu-acik nav{display:block}
  header nav ul{flex-direction:column;gap:0;max-width:1200px;margin:0 auto;padding:4px max(16px,env(safe-area-inset-left,0px)) 16px}
  header nav li+li a{border-top:1px solid var(--cizgi-acik)}
  header nav a{display:block;padding:15px 0;font-size:18px;opacity:.9}
}
@media (min-width:700px) and (max-width:1080px){header nav ul{padding-left:40px;padding-right:40px}}
@media (max-width:400px){.logo span{font-size:18px}.logo img{height:26px}header .dugme{padding:10px 14px;font-size:14px}}
@media (max-width:340px){.logo span{display:none}}
.akis{margin:0;padding:0}
@media (max-width:820px){.surec li:not(:last-child)::after{display:none}}
@media (max-width:600px){.vizor .ust,.vizor .alt{left:14px;right:14px;font-size:10px}}
@media (max-width:860px){.sahne{max-width:320px;margin-left:auto;margin-right:auto}}
@media (max-width:820px){.galeri .genis img{aspect-ratio:16/9}}
@media (hover:none){.serit:hover .serit-ic{animation-play-state:running}}
dialog.buyut{height:100dvh}
@media (max-width:700px){.buyut .onceki,.buyut .sonraki{bottom:max(16px,env(safe-area-inset-bottom,0px))}}
.alt-menu{gap:0 20px}
.alt-menu a{display:inline-block;padding-block:10px}
.s-sss details{padding:0}
.s-sss summary{list-style:none;display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:16px 0;min-height:48px}
.s-sss summary::-webkit-details-marker{display:none}
.s-sss summary::after{content:"+";font-family:var(--f-etiket);font-weight:400;flex:none;color:var(--kiremit)}
.s-sss details[open] summary::after{content:"–"}
.s-sss details p{margin:0 0 18px}
@media (max-width:480px){.isler.dikey figure:last-child:nth-child(odd){grid-column:1/-1;width:calc(50% - 6px);justify-self:center}}
@media (max-width:980px){.s-duzen{grid-template-columns:minmax(0,1fr)}.s-yan{display:contents}.s-icindekiler{display:grid;order:-1;background:var(--krem-2);border-top:0;padding:18px}}
@media (max-width:600px){.s-yazi figure:has(>svg){overflow-x:auto;-webkit-overflow-scrolling:touch}.s-yazi figure svg{min-width:560px}}
/* Mobil düzen 2 (16 Ekim) */
@media (max-width:480px){.isler{grid-template-columns:1fr 1fr;gap:22px 12px}.isler figcaption b{font-size:16px}.isler figcaption span{font-size:13px}}
@media (max-width:340px){.isler{grid-template-columns:1fr}}
.s-yazi figure.tek-dikey img{aspect-ratio:9/16;object-fit:cover}