/*
 * DESADOOR — WASM PUBLIC SHELL
 * Blazor WASM yuklenene kadar statik gorunum.
 * Blazor App #app icine yuklenince shell kaybolur.
 */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--desa-font-sans);color:var(--desa-text);background:var(--desa-bg-base);overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}

.desa-shell{min-height:100vh;display:flex;flex-direction:column}

/* HEADER — Glassmorphism */
.desa-sh-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 clamp(16px,5vw,80px);height:72px;background:rgba(255,255,255,.85);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border-bottom:1px solid var(--desa-border)}

.desa-sh-logo{display:inline-flex;align-items:center;gap:10px}
.desa-sh-logo img{height:32px;width:auto}
.desa-sh-logo span{font-family:var(--desa-font-serif);font-size:1.1rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--desa-text)}

.desa-sh-nav{display:flex;align-items:center;gap:28px}
.desa-sh-nav a{font-size:.78rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--desa-text-secondary);transition:color .15s}
.desa-sh-nav a:hover{color:var(--desa-accent)}

/* HERO — Skeleton */
.desa-sh-hero{display:flex;align-items:center;justify-content:center;min-height:420px;padding:clamp(2rem,6vw,5rem) clamp(1rem,5vw,4rem);background:linear-gradient(135deg, var(--desa-bg-alt) 0%, var(--desa-bg-section) 50%, var(--desa-bg-alt) 100%);position:relative;overflow:hidden}
.desa-sh-hero::after{content:'';position:absolute;top:0;right:0;width:400px;height:400px;background:radial-gradient(circle, color-mix(in srgb, var(--desa-accent) 8%, transparent), transparent 70%);pointer-events:none}
.desa-sh-hero-icerik{position:relative;z-index:1;text-align:center;max-width:720px}
.desa-sh-hero-icerik .skeleton-baslik{width:min(560px,80%);height:48px;background:linear-gradient(90deg, var(--desa-border) 25%, var(--desa-border-light) 50%, var(--desa-border) 75%);background-size:200% 100%;animation:shimmer 2s infinite;border-radius:6px;margin:0 auto 16px}
.desa-sh-hero-icerik .skeleton-alt{width:min(400px,65%);height:20px;background:linear-gradient(90deg, var(--desa-border) 25%, var(--desa-border-light) 50%, var(--desa-border) 75%);background-size:200% 100%;animation:shimmer 2s infinite;border-radius:4px;margin:0 auto 24px}
.desa-sh-hero-icerik .skeleton-btn{width:160px;height:48px;background:var(--desa-accent);border-radius:8px;margin:0 auto;opacity:.6;animation:shimmer 2s infinite}

/* KOLEKSIYON BASLIK — Skeleton */
.desa-sh-section{padding:clamp(2rem,5vw,4rem) clamp(1rem,5vw,80px)}
.desa-sh-section .skeleton-h2{width:280px;height:32px;background:linear-gradient(90deg, var(--desa-border) 25%, var(--desa-border-light) 50%, var(--desa-border) 75%);background-size:200% 100%;animation:shimmer 2s infinite;border-radius:6px;margin-bottom:24px}

/* KART GRID — Skeleton */
.desa-sh-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));gap:20px}
.desa-sh-kart{border:1px solid var(--desa-border);border-radius:12px;overflow:hidden;background:var(--desa-surface);box-shadow:var(--desa-shadow-sm)}
.desa-sh-kart-gorsel{aspect-ratio:4/3;background:linear-gradient(90deg, var(--desa-border) 25%, var(--desa-border-light) 50%, var(--desa-border) 75%);background-size:200% 100%;animation:shimmer 2s infinite}
.desa-sh-kart-icerik{padding:16px;display:flex;flex-direction:column;gap:10px}
.desa-sh-kart-icerik .skeleton-line{height:14px;border-radius:4px;background:linear-gradient(90deg, var(--desa-border) 25%, var(--desa-border-light) 50%, var(--desa-border) 75%);background-size:200% 100%;animation:shimmer 2s infinite}
.desa-sh-kart-icerik .skeleton-line.short{width:60%}
.desa-sh-kart-icerik .skeleton-line.title{height:20px;width:80%}

/* FOOTER */
.desa-sh-footer{margin-top:auto;padding:clamp(2rem,5vw,4rem) clamp(1rem,5vw,80px);background:var(--desa-bg-dark);color:var(--desa-text-inverse);display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:32px}
.desa-sh-footer-col h4{font-family:var(--desa-font-serif);font-size:1rem;color:var(--desa-accent);margin-bottom:12px;letter-spacing:.05em}
.desa-sh-footer-col a,.desa-sh-footer-col p{font-size:.85rem;color:var(--desa-text-light);line-height:2;display:block}
.desa-sh-footer-col a:hover{color:var(--desa-accent)}
.desa-sh-footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:16px;margin-top:24px;grid-column:1/-1;text-align:center;font-size:.78rem;color:var(--desa-text-muted)}

/* SHIMMER ANIMATION */
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}

/* MOBIL */
@media(max-width:768px){
  .desa-sh-nav{display:none}
  .desa-sh-footer{grid-template-columns:1fr 1fr}
  .desa-sh-grid{grid-template-columns:repeat(auto-fill, minmax(160px, 1fr))}
  .desa-sh-hero{min-height:320px}
}