/* Sade görünüm (Airbnb / Apple yönü). ŞİMDİLİK YALNIZ ANA SAYFADA (body.ana) geçerli; onaylanınca tüm siteye yayılacak.
   İlkeler: beyaz zemin, normal boyda net yazılar, kutusuz kartlar (fotoğrafın kendisi kart, yazı altında), bol ve büyük fotoğraf,
   tek vurgu rengi (marka altını) yalnız ana düğmelerde. */

/* Zemin her zaman beyaz: işletim sistemi koyu temada olsa da ana sayfa açık kalır */
body.ana{--bg:#FFFFFF;--surface:#FFFFFF;--surface-2:#F7F7F7;--ink:#222222;--muted:#6A6A6A;--line:#EBEBEB;--gold-ink:#8A5200;--blue-ink:#1757B8;--bad-ink:#B11B2B;--ok-ink:#0A7049;
  --shadow:0 1px 2px rgb(17 19 21 / .06),0 12px 32px rgb(17 19 21 / .09);background:var(--bg);color:var(--ink);color-scheme:light}

/* üst menü ve demo şeridi */
.ana .hdr{background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom:1px solid var(--line)}
.ana .hdr-in{min-height:76px}
.ana .nav a{font-size:14px;font-weight:500;color:var(--ink);padding:10px 13px}
.ana .nav a:hover{background:var(--surface-2)}
.ana .demo-bar{background:var(--surface-2);color:var(--muted);font-weight:500;border-bottom:1px solid var(--line)}

/* açılış: büyük, yuvarlak köşeli fotoğraf; yazı doğrudan fotoğrafın üstünde, kutu yok */
.ana .hero{width:min(1200px,calc(100% - 40px));margin:20px auto 0;min-height:clamp(420px,40vw,520px);border-radius:24px;overflow:visible;z-index:5;justify-content:flex-start;align-items:flex-end}
/* yuvarlak köşe yalnız fotoğrafa: arama sonuçları aşağı taşabilsin */
.ana .hero-slides,.ana .hero::after{border-radius:inherit}
.ana .hero::after{background:linear-gradient(0deg,rgb(0 0 0 / .72) 0%,rgb(0 0 0 / .38) 42%,rgb(0 0 0 / 0) 68%),linear-gradient(90deg,rgb(0 0 0 / .4) 0%,rgb(0 0 0 / 0) 60%)}
.ana .hero-panel{flex:0 1 640px;margin:0 0 44px 44px;padding:0;background:none;border:0;border-radius:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.ana .hero-panel .eyebrow{font-size:15px;font-weight:600;letter-spacing:0;text-transform:none;color:#fff;opacity:.92}
.ana .hero-panel h1{font-size:clamp(32px,3.6vw,46px);font-weight:700;letter-spacing:-.02em;line-height:1.1;margin-top:8px}
.ana .hero-panel h1 em{display:inline;font:inherit;color:inherit}
.ana .hero-panel p{font-size:17px;color:rgb(255 255 255 / .92);margin-top:10px}
.ana .search{margin-top:22px;border-radius:999px;padding:3px 8px 3px 20px;box-shadow:0 6px 24px rgb(0 0 0 / .22)}
.ana .search input{padding:14px 0;font-size:16px}
.ana .search:focus-within{outline:0;box-shadow:0 0 0 3px rgb(255 255 255 / .6),0 6px 24px rgb(0 0 0 / .22)}
.ana .quick{margin-top:14px}
.ana .quick button{padding:7px 14px;font-size:13.5px;font-weight:500;background:rgb(255 255 255 / .16);border-color:rgb(255 255 255 / .45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.ana .quick .surpriz{background:#fff;border-color:#fff;color:#222;font-weight:600}
.ana .quick .surpriz .ic{color:var(--gold-ink)}
.ana .hero-ui{top:auto;bottom:22px;right:22px}
.ana .chip-dark,.ana .dots{background:rgb(0 0 0 / .35)}

/* arama: sitede bulunamazsa ya da her soru için "Kayserili AI'ye sor" */
.ana .results{border-radius:16px;padding:8px}
.ara-ai{display:flex;align-items:center;gap:10px;width:100%;border:0;border-top:1px solid #EBEBEB;margin-top:4px;padding:12px 10px 8px;background:none;color:#222;font-size:14px;text-align:left;border-radius:0}
.ara-ai .ic{width:18px;height:18px;color:#7445D6;flex:none}
.ara-ai:hover span{text-decoration:underline}

/* Akıllı Kayseri: renkli, canlı veri gösteren kutucuklar (zemin beyaz kalır) */
.akilli-s{padding-top:32px!important}
.akilli{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.ak{position:relative;display:flex;flex-direction:column;gap:4px;min-width:0;padding:20px;border-radius:20px;background:var(--t);color:#222;transition:transform .2s,box-shadow .2s}
a.ak:hover{transform:translateY(-2px);box-shadow:0 10px 24px -14px var(--c)}
.ak-sahne{display:flex;align-items:flex-end;height:92px;margin:-4px 0 12px}
.ak-sahne span{display:contents}
.ak-sahne svg{height:100%;width:auto;max-width:100%;transition:transform .35s ease}
a.ak:hover .ak-sahne svg{transform:translateY(-3px) scale(1.03)}
.ak-k{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;font-weight:600;color:var(--c)}
.ak b{font-size:17px;font-weight:600;line-height:1.3}
.ak .ak-buyuk{font-size:34px;font-weight:700;letter-spacing:-.02em;line-height:1.1}
.ak small{font-size:13.5px;color:#5A5A5A}
.ak-ai{grid-column:span 2}
.ak-sorular{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.ak-sorular button{border:0;border-radius:999px;padding:8px 14px;background:#fff;color:#4B2BA8;font-size:13.5px;font-weight:600;box-shadow:0 1px 2px rgb(116 69 214 / .18);transition:background .2s,color .2s}
.ak-sorular button:hover{background:#7445D6;color:#fff}

/* geniş kutular (üçüncü sıra): yazı solda, görsel sağda */
.ak-genis{grid-column:span 2;flex-direction:row;align-items:stretch;gap:18px;overflow:hidden;min-height:236px}
.ak-metin{display:flex;flex-direction:column;gap:6px;flex:1 1 auto;min-width:0;align-self:center}
.ak-genis b{font-size:21px;font-weight:700;letter-spacing:-.01em}
.ak-dugme{display:inline-flex;align-items:center;gap:6px;margin-top:10px;align-self:flex-start;padding:9px 16px;border-radius:999px;background:#fff;color:var(--c);font-size:14px;font-weight:700;box-shadow:0 1px 2px rgb(0 0 0 / .08)}
.ak-dugme .ic{width:16px;height:16px}
.ak-k .ic{width:16px;height:16px}
a.ak-genis:hover .ak-dugme{background:var(--c);color:#fff}
/* Günaydın: gün doğumu renklerinde zemin, sağda kartın gerçek önizlemesi telefon gibi */
.gk-kutu{background:linear-gradient(120deg,#FFE0CF 0%,#FFEFD9 42%,#DDEFFF 100%)}
.gk-mini-k{position:relative;flex:0 0 132px;margin:-6px -4px -40px 0;align-self:flex-start}
.gk-mini-k img{display:block;width:132px;height:auto;aspect-ratio:9/16;border-radius:18px;background:linear-gradient(180deg,#FF9A6E,#FFC690 55%,#CBE6FF);
  box-shadow:0 0 0 5px #fff,0 18px 34px -12px rgb(160 70 20 / .45);transform:rotate(4deg);transition:transform .35s ease}
a.gk-kutu:hover .gk-mini-k img{transform:rotate(1deg) translateY(-4px)}
.gk-kutu:not(.hazir) .gk-mini-k img{opacity:.9}
/* Eski Kayseri: sıcak (eski) tondan serin (bugün) tona; sağda yarı eski yarı yeni fotoğraf */
.ek-kutu{background:linear-gradient(120deg,#F8E6D0 0%,#F3EAFE 55%,#E2EEFF 100%)}
.ek-mini{position:relative;flex:0 0 46%;align-self:stretch;min-height:170px;margin:-20px -20px -20px 0;overflow:hidden;border-radius:0 20px 20px 0}
.ek-mini img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}
.ek-mini .o{clip-path:inset(0 50% 0 0);filter:sepia(.35) contrast(1.05);transition:clip-path .5s ease}
a.ek-kutu:hover .ek-mini .o{clip-path:inset(0 30% 0 0)}
.ek-mini i{position:absolute;top:0;bottom:0;left:50%;width:3px;margin-left:-1.5px;background:#fff;box-shadow:0 0 10px rgb(0 0 0 / .35);transition:left .5s ease}
a.ek-kutu:hover .ek-mini i{left:70%}
.ek-mini em{position:absolute;bottom:10px;font-style:normal;font-size:12px;font-weight:700;padding:3px 9px;border-radius:999px;background:rgb(0 0 0 / .55);color:#fff}
.ek-mini .l{left:10px}.ek-mini .r{right:10px}

/* Bugün şeridi: gölgesiz, ince çizgili sade satır */
.ana .today{margin-top:24px}
.ana .today-in{border:1px solid var(--line);border-radius:16px;box-shadow:none}
.ana .tg{padding:16px 18px;border-color:var(--line)}
.ana .tg:hover{background:var(--surface-2)}
.ana .tg-k{font-size:13px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--muted)}
.ana .tg b{font-size:17px;font-weight:600;letter-spacing:0}
.ana .tg-ai{background:none;padding:0;color:var(--ink);font-size:13px;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.ana .tg-ai .ic{color:var(--gold-ink)}
/* küçük pastel görsel: sağ altta, göze batmadan */
.tg-gorsel{position:absolute;right:10px;top:12px;width:30px;height:30px;pointer-events:none;opacity:.95}
.ana .tg-k{padding-right:30px}
.tg-gorsel span{display:contents}
.tg-gorsel svg{width:100%;height:100%}
.tg-gorsel [data-hava="sahne-mini"] svg{width:42px;height:auto;margin:2px 0 0 -12px}
.ana .rozet{background:var(--surface-2);color:var(--muted);letter-spacing:.02em}
.ana .rozet.r-guncel{background:color-mix(in srgb,#1F6FE0 10%,var(--surface));color:var(--blue-ink)}

/* bölüm başlıkları: normal boy, düz; süs yazısı yok */
.ana .sec{padding-block:56px 0}
.ana .sec-hd{margin-bottom:20px}
.ana .sec-hd .kicker{display:none}
.ana .kicker{font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--muted)}
.ana .hk-erciyes .kicker{color:#C9D3E6}
.ana .sec-hd h2{font-size:26px;font-weight:600;letter-spacing:-.015em;margin-top:0}
.ana .sec-hd h2 em,.ana .word .big{font-family:var(--f-body);font-style:normal;color:inherit}
.ana .sec-hd p{font-size:15px;margin-top:4px}
.ana .more{font-size:15px;font-weight:600;color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.ana .more .ic{display:none}

/* gezilecek yerler: yatay kayan fotoğraf sırası */
.sira-ok{display:flex;gap:8px}
.sira-ok button{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink);display:grid;place-items:center;transition:box-shadow .2s}
.sira-ok button:hover{box-shadow:0 2px 10px rgb(0 0 0 / .14)}
.sira-ok .ic{width:16px;height:16px}
.sira{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 4 * 20px) / 5);gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.sira::-webkit-scrollbar{display:none}
.yer-k{display:grid;gap:3px;align-content:start;scroll-snap-align:start;min-width:0}
.yer-foto{display:block;aspect-ratio:1/1;border-radius:14px;overflow:hidden;background:var(--surface-2);margin-bottom:9px}
.yer-foto img,.kesif-foto img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.yer-k:hover img,.kesif:hover img{transform:scale(1.04)}
.yer-k b{font-size:15px;font-weight:600}
.yer-k small{font-size:14px;color:var(--muted);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.yer-k em{display:flex;align-items:center;gap:5px;margin-top:3px;font-style:normal;font-size:14px}
.yer-k em .ic{width:14px;height:14px;color:var(--muted)}

/* nereden başlayalım: kutusuz keşif kartları */
.kesifler{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.kesif{display:grid;gap:3px;align-content:start;min-width:0}
.kesif-foto{display:block;aspect-ratio:4/5;border-radius:16px;overflow:hidden;background:var(--surface-2);margin-bottom:10px}
.kesif-etiket{justify-self:start;font-size:12.5px;font-weight:600;color:var(--c);margin-bottom:2px}
.kesif b{font-size:16px;font-weight:600}
.kesif small{font-size:14px;color:var(--muted);line-height:1.45}

/* kartlar: kutu yok, fotoğraf + altında yazı */
.ana .grid{gap:24px}
.ana .card{background:none;border:0;border-radius:0;overflow:visible}
.ana .card .ph{border-radius:16px;aspect-ratio:1/1}
.ana .card .ph img{transition:transform .5s ease}
.ana .card:hover .ph img{transform:scale(1.04)}
.ana a.card:hover,.ana .link:hover{transform:none;box-shadow:none}
.ana .card-b{padding:12px 0 0;gap:4px}
.ana .card-b h3{font-size:16px;font-weight:600}
.ana .card-b p{font-size:14px}
.ana .firm-mini{background:none;border:0;border-radius:0;padding:6px 0 0}
.ana .firm-card.sponsor{box-shadow:none}

/* listeler: ince çizgiyle ayrılan satırlar */
.ana .list{gap:0}
.ana .row{background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:14px 0}
.ana .row .th{width:72px;height:72px;border-radius:12px}
.ana .row b{font-size:15px;font-weight:600}

/* diğer bloklar: gölgesiz, yumuşak köşe */
.ana .hk-sehir,.ana .hk-erciyes,.ana .erc-kart,.ana .nabiz-mini,.ana .kayserle-mini,.ana .mh-kart{border-radius:16px;box-shadow:none}
.ana .hk-sehir{background:var(--surface)}
.ana .word{background:var(--surface-2);border:0;border-radius:16px}
.ana .word .big{font-weight:700;font-size:36px;color:var(--ink)}
.ana .dn{min-height:0;padding:0;display:grid;gap:3px;align-content:start;color:var(--ink);background:none;border-radius:0;overflow:visible}
.ana .dn img{position:static;z-index:auto;height:auto;aspect-ratio:4/3;border-radius:16px;margin-bottom:9px}
.ana .dn::after{display:none}
.ana .dn-g{position:static;justify-self:start;padding:0;background:none;color:var(--muted);font-size:13px;font-weight:600;letter-spacing:0}
.ana .dn h3{font-size:16px;font-weight:600}
.ana .dn p{font-size:14px;color:var(--muted);margin-top:0}
.ana .btn-dark{background:#222;color:#fff}

@media (max-width:980px){
  .akilli{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ak-ai{order:-1}
  .sira{grid-auto-columns:calc((100% - 2 * 16px) / 3);gap:16px}
  .kesifler{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .ana .hero-panel p{font-size:15px}
  .ana .quick button:nth-child(n+4){display:none}
  .ana .hero-ui .chip-dark{display:none}
  .ana .hero{width:calc(100% - 32px);margin-top:12px;min-height:480px;border-radius:20px}
  .ana .hero-panel{flex:1 1 auto;margin:0 18px 58px}
  .ana .hero-panel h1{font-size:30px}
  .ana .hero-ui{left:18px;right:auto;bottom:18px}
  .ana .today-in{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
  .ana .tg{flex:0 0 46%;scroll-snap-align:start;border-top:0!important}
  .sira{grid-auto-columns:72%}
  .kesifler{gap:16px}
  .ana .sec{padding-block:44px 0}
  .ana .sec-hd h2{font-size:22px}
  .sira-ok{display:none}
  .akilli{gap:12px}
  .ak{padding:16px;border-radius:18px}
  .ak-sahne{height:72px;margin-bottom:8px}
  .ak .ak-buyuk{font-size:28px}
  .ak b{font-size:15.5px}
  .ak-genis{min-height:0}
  .ak-genis b{font-size:18px}
  .gk-mini-k{flex-basis:96px}
  .gk-mini-k img{width:96px}
  .ek-mini{margin:-16px -16px -16px 0;flex-basis:40%;min-height:150px}
}

/* demo şeridi: telefonda kısa metin (tüm sayfalarda) */
.demo-bar .db-kisa{display:none}
@media (max-width:640px){
  .demo-bar .db-uzun{display:none}
  .demo-bar .db-kisa{display:inline}
}