/* ============================================
   Çiçekçi İlker - Premium Luxury Theme v2
   Dark, elegant, high-end flower shop
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600&family=Poppins:wght@300;400;500;600;700&display=swap');

:root {
    /* Core palette */
    --bg-deep: #080810;
    --bg-dark: #0c0c18;
    --bg-card: #12121f;
    --bg-card-hover: #181830;
    --bg-surface: #16162a;

    /* Gold spectrum */
    --gold: #c9a84c;
    --gold-light: #dfc070;
    --gold-dark: #a88a2e;
    --gold-glow: rgba(201,168,76,0.15);
    --gold-glow-strong: rgba(201,168,76,0.3);

    /* Text */
    --text-white: #f8f8f8;
    --text-light: #e2e2e8;
    --text-muted: #8888a0;
    --text-dim: #55556a;

    /* Accent */
    --rose: #e8577a;
    --whatsapp: #25D366;
    --cream: #e8d5b7;

    /* Utility */
    --border: rgba(201,168,76,0.12);
    --border-strong: rgba(201,168,76,0.25);
    --glass: rgba(12,12,24,0.75);
    --glass-light: rgba(255,255,255,0.03);

    --shadow: 0 8px 32px rgba(0,0,0,0.4);
    --shadow-gold: 0 8px 30px -8px rgba(201,168,76,0.35);
    --shadow-up: 0 -4px 20px rgba(0,0,0,0.3);

    --font-heading: 'Playfair Display', Georgia, serif;
    --font-body: 'Poppins', -apple-system, sans-serif;
    --ease: cubic-bezier(.4,0,.2,1);
    --radius: 12px;
    --radius-sm: 8px;
}

/* ---- Reset ---- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);font-weight:400;color:var(--text-light);background:var(--bg-deep);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
a{text-decoration:none;color:inherit;transition:all .3s var(--ease)}
img{max-width:100%;height:auto;display:block}
ul{list-style:none}

.container{max-width:1200px;margin:0 auto;padding:0 20px}

/* ============ NAVBAR ============ */
.navbar{
    position:fixed;top:0;left:0;right:0;z-index:1000;
    background:var(--glass);
    -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
    border-bottom:1px solid var(--border);
    transition:all .4s var(--ease);
}
.navbar.scrolled{
    background:rgba(8,8,16,0.95);
    box-shadow:0 4px 30px rgba(0,0,0,0.5);
}
.navbar .container{display:flex;justify-content:space-between;align-items:center;height:80px}
.navbar-brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.navbar-brand img{height:52px;width:auto;transition:transform .3s var(--ease);filter:drop-shadow(0 2px 8px rgba(201,168,76,0.2))}
.navbar-brand:hover img{transform:scale(1.08)}
.navbar-brand-text{
    font-family:'Cormorant Garamond', var(--font-heading), serif;
    font-size:1.65rem;
    font-weight:600;
    font-style:italic;
    background:linear-gradient(135deg, #e8d5a3 0%, #f5e6c8 25%, #c9a84c 50%, #e8d5a3 75%, #f5e6c8 100%);
    background-size:200% auto;
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    animation:goldShimmer 4s ease-in-out infinite;
    letter-spacing:1.5px;
    line-height:1.2;
    position:relative;
    padding-bottom:4px
}
.navbar-brand-text::after{
    content:'';
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    height:1px;
    background:linear-gradient(90deg, transparent, var(--gold-light), transparent);
    opacity:0.5
}
@keyframes goldShimmer{
    0%,100%{background-position:0% center}
    50%{background-position:200% center}
}
.navbar-brand-text small{display:block;font-family:var(--font-body);font-size:0.6rem;font-weight:400;color:var(--text-muted);letter-spacing:3px;text-transform:uppercase;font-style:normal;-webkit-text-fill-color:var(--text-muted);background:none}

.navbar-nav{display:flex;gap:4px;align-items:center}
.navbar-nav a{
    color:var(--text-muted);padding:8px 16px;font-size:0.85rem;font-weight:500;
    border-radius:var(--radius-sm);transition:all .25s var(--ease);
    position:relative;letter-spacing:0.3px;
}
.navbar-nav a:hover{color:var(--text-white)}
.navbar-nav a.active{color:var(--gold);background:var(--gold-glow)}
.navbar-nav .nav-cta{
    background:linear-gradient(135deg,var(--gold),var(--gold-light));
    color:var(--bg-deep);font-weight:600;padding:10px 22px;
    border-radius:50px;margin-left:8px;
    box-shadow:0 4px 15px rgba(201,168,76,0.3);
}
.navbar-nav .nav-cta:hover{transform:translateY(-2px);box-shadow:var(--shadow-gold)}

/* Dropdown */
.nav-dropdown{position:relative}
.nav-dropdown > a{display:inline-flex;align-items:center;gap:5px}
.nav-dropdown > a svg{transition:transform .25s var(--ease);opacity:.5}
.nav-dropdown:hover > a svg{transform:rotate(180deg);opacity:1}

.dropdown-menu{
    position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(8px);
    min-width:200px;padding:8px;
    background:rgba(12,12,24,0.97);
    -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
    border:1px solid var(--border-strong);border-radius:var(--radius);
    box-shadow:0 20px 50px rgba(0,0,0,0.5);
    opacity:0;visibility:hidden;
    transition:all .25s var(--ease);
    z-index:100;
}
.dropdown-menu::before{
    content:'';position:absolute;top:-6px;left:50%;transform:translateX(-50%) rotate(45deg);
    width:12px;height:12px;
    background:rgba(12,12,24,0.97);
    border-top:1px solid var(--border-strong);border-left:1px solid var(--border-strong);
}
.nav-dropdown:hover .dropdown-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}

.dropdown-menu a{
    display:block;padding:10px 16px;color:var(--text-muted);
    font-size:0.84rem;font-weight:500;border-radius:var(--radius-sm);
    transition:all .2s var(--ease);
}
.dropdown-menu a:hover{color:var(--gold);background:var(--gold-glow);padding-left:20px}
.dropdown-menu a.active{color:var(--gold)}

.navbar-toggle{display:none;background:none;border:1px solid var(--border);cursor:pointer;padding:10px;border-radius:var(--radius-sm)}
.navbar-toggle span{display:block;width:22px;height:2px;background:var(--gold);margin:5px 0;transition:all .3s var(--ease)}

/* ============ HERO ============ */
.hero{
    position:relative;min-height:100vh;
    display:flex;align-items:center;justify-content:center;
    overflow:hidden;padding-top:80px;
}
.hero-bg{
    position:absolute;inset:0;z-index:0;
}
.hero-slide{
    position:absolute;inset:0;opacity:0;
    transition:opacity 1.2s ease-in-out;
}
.hero-slide.active{opacity:1}
.hero-slide img{width:100%;height:100%;object-fit:cover}
.hero-slide::after{
    content:'';position:absolute;inset:0;
    background:linear-gradient(135deg,rgba(8,8,16,0.88) 0%,rgba(8,8,16,0.6) 40%,rgba(8,8,16,0.75) 100%);
}

.hero-content{position:relative;z-index:2;text-align:center;padding:40px 20px;max-width:750px}

.hero-logo{width:200px;height:200px;margin:0 auto 30px;animation:heroLogoIn .8s .2s var(--ease) both}
.hero-logo img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 30px rgba(201,168,76,0.4))}

.hero-tagline{
    font-family:var(--font-body);color:var(--gold);font-size:0.85rem;font-weight:500;
    letter-spacing:5px;text-transform:uppercase;margin-bottom:20px;
    animation:heroFadeUp .6s .4s var(--ease) both;
}
.hero h1{
    font-family:var(--font-heading);color:var(--text-white);
    font-size:3.8rem;font-weight:700;line-height:1.15;margin-bottom:22px;
    animation:heroFadeUp .7s .5s var(--ease) both;
}
.hero h1 em{font-style:italic;color:var(--gold);position:relative}
.hero h1 em::after{
    content:'';position:absolute;bottom:-2px;left:0;right:0;height:2px;
    background:linear-gradient(90deg,transparent,var(--gold),transparent);
}

.hero-desc{
    color:var(--text-muted);font-size:1.05rem;max-width:520px;margin:0 auto 36px;line-height:1.8;
    animation:heroFadeUp .7s .65s var(--ease) both;
}

.hero-buttons{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;animation:heroFadeUp .7s .8s var(--ease) both}

/* Decorative dots */
.hero-dots{
    position:absolute;bottom:40px;left:50%;transform:translateX(-50%);
    z-index:3;display:flex;gap:10px;
}
.hero-dots span{
    width:10px;height:10px;border-radius:50%;
    background:rgba(255,255,255,0.2);cursor:pointer;
    transition:all .3s var(--ease);
}
.hero-dots span.active{background:var(--gold);box-shadow:0 0 12px rgba(201,168,76,0.5)}

/* Hero keyframes */
@keyframes heroLogoIn{from{opacity:0;transform:scale(0.7) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}
@keyframes heroFadeUp{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}

/* ============ BUTTONS ============ */
.btn{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    padding:14px 36px;font-family:var(--font-body);font-size:0.88rem;font-weight:600;
    border-radius:50px;border:none;cursor:pointer;
    transition:all .3s var(--ease);letter-spacing:0.5px;text-transform:uppercase;
    position:relative;overflow:hidden;
}

.btn-gold{
    background:linear-gradient(135deg,var(--gold) 0%,var(--gold-light) 100%);
    color:var(--bg-deep);
    box-shadow:0 4px 20px -4px rgba(201,168,76,0.4);
}
.btn-gold:hover{transform:translateY(-3px);box-shadow:var(--shadow-gold)}
.btn-gold:active{transform:translateY(-1px)}

.btn-outline{
    background:transparent;color:var(--gold);
    border:1.5px solid var(--gold);
}
.btn-outline:hover{background:var(--gold);color:var(--bg-deep);box-shadow:var(--shadow-gold);transform:translateY(-2px)}

.btn-glass{
    background:rgba(255,255,255,0.06);color:var(--text-white);
    border:1px solid rgba(255,255,255,0.12);
    -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
}
.btn-glass:hover{background:rgba(255,255,255,0.12);border-color:rgba(255,255,255,0.2);transform:translateY(-2px)}

.btn-whatsapp{
    background:linear-gradient(135deg,#25D366,#20bd5a);color:#fff;
    box-shadow:0 4px 15px rgba(37,211,102,0.3);
}
.btn-whatsapp:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(37,211,102,0.4)}

.btn-sm{padding:10px 24px;font-size:0.78rem}
.btn-lg{padding:16px 44px;font-size:0.92rem}

/* ============ SECTION ============ */
.section{padding:100px 0;position:relative}
.section-dark{background:var(--bg-dark)}
.section-surface{background:var(--bg-surface)}

.section-title{text-align:center;margin-bottom:60px}
.section-title .label{
    display:inline-block;font-size:0.72rem;font-weight:600;
    color:var(--gold);letter-spacing:4px;text-transform:uppercase;
    margin-bottom:14px;
}
.section-title h2{
    font-family:var(--font-heading);font-size:2.6rem;font-weight:600;
    color:var(--text-white);margin-bottom:16px;line-height:1.2;
}
.section-title .gold-line{
    width:50px;height:2px;margin:0 auto 18px;
    background:linear-gradient(90deg,transparent,var(--gold),transparent);
}
.section-title p{color:var(--text-muted);font-size:0.95rem;max-width:500px;margin:0 auto}

/* ============ GALLERY STRIP ============ */
.gallery-strip{
    display:flex;gap:16px;padding:0 20px;overflow:hidden;
    margin:-60px 0 0;position:relative;z-index:2;
}
.gallery-strip .g-item{
    flex:0 0 220px;height:300px;border-radius:var(--radius);overflow:hidden;
    border:1px solid var(--border);position:relative;
}
.gallery-strip .g-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.gallery-strip .g-item:hover img{transform:scale(1.08)}
.gallery-strip .g-item::after{
    content:'';position:absolute;inset:0;
    background:linear-gradient(to top,rgba(8,8,16,0.5) 0%,transparent 50%);
    pointer-events:none;
}

/* ============ PRODUCT CARDS ============ */
.products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:24px}

.product-card{
    background:var(--bg-card);
    border:1px solid var(--border);
    border-radius:var(--radius);overflow:hidden;
    transition:all .35s var(--ease);position:relative;
}
.product-card:hover{
    transform:translateY(-6px);
    border-color:var(--border-strong);
    box-shadow:var(--shadow-gold);
}
.product-card .card-image{position:relative;height:280px;overflow:hidden;display:block}
.product-card .card-image img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.product-card:hover .card-image img{transform:scale(1.08)}

.product-card .card-image::after{
    content:'';position:absolute;inset:0;
    background:linear-gradient(to top,rgba(8,8,16,0.4) 0%,transparent 40%);
    pointer-events:none;
}

.product-card .badge-featured{
    position:absolute;top:14px;left:14px;z-index:2;
    background:linear-gradient(135deg,var(--gold),var(--gold-light));
    color:var(--bg-deep);padding:5px 14px;font-size:0.68rem;font-weight:700;
    text-transform:uppercase;letter-spacing:1px;border-radius:50px;
}
.product-card .badge-discount{
    position:absolute;top:14px;right:14px;z-index:2;
    background:var(--rose);color:#fff;padding:5px 12px;
    font-size:0.72rem;font-weight:600;border-radius:50px;
}

.product-card .card-body{padding:22px}
.product-card .card-category{
    font-size:0.7rem;color:var(--gold);text-transform:uppercase;
    letter-spacing:1.5px;margin-bottom:8px;font-weight:500;
}
.product-card .card-title{
    font-family:var(--font-heading);font-size:1.1rem;font-weight:600;
    color:var(--text-white);margin-bottom:12px;line-height:1.35;
}
.product-card .card-title a:hover{color:var(--gold)}

.product-card .card-price{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.product-card .price-current{font-size:1.2rem;font-weight:700;color:var(--gold)}
.product-card .price-old{font-size:0.85rem;color:var(--text-dim);text-decoration:line-through}

.product-card .card-actions{display:flex;gap:8px}
.product-card .card-actions .btn{flex:1;justify-content:center;padding:10px 12px;font-size:0.76rem}

/* ============ CATEGORY CARDS ============ */
.categories-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}

.category-card{
    position:relative;height:320px;border-radius:var(--radius);
    overflow:hidden;cursor:pointer;border:1px solid var(--border);
    transition:all .4s var(--ease);
}
.category-card:hover{transform:translateY(-4px);border-color:var(--border-strong);box-shadow:var(--shadow-gold)}
.category-card img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.category-card:hover img{transform:scale(1.1)}

.category-card .overlay{
    position:absolute;inset:0;
    background:linear-gradient(to top,rgba(8,8,16,0.9) 0%,rgba(8,8,16,0.1) 50%);
    display:flex;flex-direction:column;justify-content:flex-end;
    padding:28px;transition:all .4s var(--ease);
}
.category-card:hover .overlay{
    background:linear-gradient(to top,rgba(8,8,16,0.95) 0%,rgba(8,8,16,0.2) 50%);
}
.category-card .overlay h3{
    font-family:var(--font-heading);font-size:1.4rem;
    color:var(--text-white);margin-bottom:6px;
}
.category-card .overlay span{
    color:var(--gold);font-size:0.8rem;font-weight:500;
    letter-spacing:1.5px;text-transform:uppercase;
    transition:all .3s var(--ease);
}
.category-card:hover .overlay span{letter-spacing:3px}

/* ============ FEATURES ============ */
.features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}

.feature-card{
    background:var(--bg-card);border:1px solid var(--border);
    border-radius:var(--radius);padding:36px 28px;text-align:center;
    transition:all .35s var(--ease);position:relative;overflow:hidden;
}
.feature-card::before{
    content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);
    width:80px;height:2px;
    background:linear-gradient(90deg,transparent,var(--gold),transparent);
    opacity:0;transition:opacity .3s var(--ease);
}
.feature-card:hover{border-color:var(--border-strong);transform:translateY(-4px)}
.feature-card:hover::before{opacity:1}

.feature-card .f-icon{
    width:60px;height:60px;margin:0 auto 20px;
    border-radius:16px;background:var(--gold-glow);
    display:flex;align-items:center;justify-content:center;
}
.feature-card .f-icon svg{width:28px;height:28px;stroke:var(--gold);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

.feature-card h4{
    font-family:var(--font-heading);font-size:1.05rem;
    color:var(--text-white);margin-bottom:10px;
}
.feature-card p{color:var(--text-muted);font-size:0.86rem;line-height:1.7}

/* ============ INSTAGRAM / SHOWCASE STRIP ============ */
.showcase{padding:80px 0;overflow:hidden}
.showcase-title{text-align:center;margin-bottom:40px}
.showcase-title h3{font-family:var(--font-heading);font-size:1.6rem;color:var(--text-white);margin-bottom:8px}
.showcase-title p{color:var(--text-muted);font-size:0.88rem}

.showcase-grid{
    display:grid;grid-template-columns:repeat(5,1fr);gap:6px;
}
.showcase-grid .s-item{
    aspect-ratio:1;overflow:hidden;position:relative;
}
.showcase-grid .s-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.showcase-grid .s-item:hover img{transform:scale(1.1)}
.showcase-grid .s-item::after{
    content:'';position:absolute;inset:0;
    background:rgba(8,8,16,0.3);opacity:0;transition:opacity .3s var(--ease);
}
.showcase-grid .s-item:hover::after{opacity:1}

/* ============ CTA BANNER ============ */
.cta-banner{
    background:linear-gradient(135deg,var(--bg-surface) 0%,#1a1a35 100%);
    border:1px solid var(--border);border-radius:var(--radius);
    padding:60px 50px;display:flex;align-items:center;justify-content:space-between;
    gap:30px;margin:0 20px;position:relative;overflow:hidden;
}
.cta-banner::before{
    content:'';position:absolute;right:-100px;top:-100px;width:300px;height:300px;
    background:radial-gradient(circle,var(--gold-glow) 0%,transparent 70%);
    pointer-events:none;
}
.cta-banner-text h3{font-family:var(--font-heading);font-size:1.8rem;color:var(--text-white);margin-bottom:8px}
.cta-banner-text p{color:var(--text-muted);font-size:0.92rem}

/* ============ FOOTER ============ */
.footer{
    background:var(--bg-dark);
    border-top:1px solid var(--border);
    padding:80px 0 0;position:relative;
}
.footer::before{
    content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);
    width:200px;height:1px;
    background:linear-gradient(90deg,transparent,var(--gold),transparent);
}

.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:50px;margin-bottom:50px}

.footer-brand{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.footer-brand img{height:44px;width:auto}
.footer-brand span{font-family:var(--font-heading);font-size:1.2rem;font-weight:600;color:var(--gold)}

.footer h4{
    font-family:var(--font-heading);color:var(--gold);font-size:1rem;
    margin-bottom:20px;position:relative;padding-bottom:12px;
}
.footer h4::after{
    content:'';position:absolute;bottom:0;left:0;width:30px;height:2px;
    background:var(--gold);border-radius:2px;
}

.footer p,.footer li{font-size:0.88rem;color:var(--text-muted);line-height:2}
.footer li a:hover{color:var(--gold);padding-left:4px}

.footer-social{display:flex;gap:10px;margin-top:16px}
.footer-social a{
    width:40px;height:40px;border-radius:50%;
    border:1px solid var(--border);
    display:flex;align-items:center;justify-content:center;
    color:var(--text-muted);font-size:0.9rem;
    transition:all .25s var(--ease);
}
.footer-social a:hover{border-color:var(--gold);color:var(--gold);background:var(--gold-glow)}

.footer-bottom{
    border-top:1px solid var(--border);padding:22px 0;
    text-align:center;font-size:0.82rem;color:var(--text-dim);
}
.footer-bottom span{color:var(--gold)}

/* ============ WHATSAPP FLOAT ============ */
.whatsapp-float{
    position:fixed;bottom:28px;right:28px;z-index:999;
    width:60px;height:60px;border-radius:50%;
    background:linear-gradient(135deg,#25D366,#20bd5a);
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 6px 20px rgba(37,211,102,0.4);
    transition:all .3s var(--ease);
}
.whatsapp-float svg{width:28px;height:28px;fill:#fff}
.whatsapp-float:hover{transform:scale(1.1) translateY(-2px);box-shadow:0 8px 30px rgba(37,211,102,0.5)}
.whatsapp-float::before{
    content:'';position:absolute;inset:-4px;border-radius:50%;
    border:2px solid rgba(37,211,102,0.3);
    animation:wp-pulse 2s infinite;
}
@keyframes wp-pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.15);opacity:0}}

/* ============ BREADCRUMB ============ */
.breadcrumb{padding:20px 0;background:var(--bg-surface);border-bottom:1px solid var(--border)}
.breadcrumb ul{display:flex;gap:8px;align-items:center;font-size:0.84rem}
.breadcrumb li+li::before{content:'›';margin-right:8px;color:var(--text-dim)}
.breadcrumb a{color:var(--gold)}
.breadcrumb a:hover{color:var(--gold-light)}
.breadcrumb .current{color:var(--text-muted)}

/* ============ CATEGORY PAGE ============ */
.category-header{
    background:linear-gradient(135deg,var(--bg-dark),var(--bg-surface));
    padding:60px 0;text-align:center;
    border-bottom:1px solid var(--border);
}
.category-header h1{font-family:var(--font-heading);color:var(--text-white);font-size:2.5rem;margin-bottom:10px}
.category-header p{color:var(--text-muted);font-size:0.95rem}

.category-layout{display:grid;grid-template-columns:220px 1fr;gap:40px}

.category-sidebar{
    background:var(--bg-card);border:1px solid var(--border);
    border-radius:var(--radius);overflow:hidden;
}
.category-sidebar a{
    display:block;padding:13px 18px;color:var(--text-muted);
    border-left:3px solid transparent;
    transition:all .25s var(--ease);font-size:0.88rem;
}
.category-sidebar a:hover{color:var(--text-white);background:var(--glass-light);border-left-color:var(--text-dim)}
.category-sidebar a.active{color:var(--gold);border-left-color:var(--gold);background:var(--gold-glow)}

/* ============ PRODUCT DETAIL ============ */
.product-detail{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}

.product-detail .product-image{
    border-radius:var(--radius);overflow:hidden;
    border:1px solid var(--border);
}
.product-detail .product-image img{width:100%;height:500px;object-fit:cover}

.product-detail .product-info h1{
    font-family:var(--font-heading);font-size:2rem;color:var(--text-white);margin-bottom:10px;
}
.product-detail .product-category-label{
    color:var(--gold);font-size:0.8rem;text-transform:uppercase;
    letter-spacing:2px;margin-bottom:20px;display:block;font-weight:500;
}
.product-detail .product-price-block{
    margin:25px 0;padding:22px;
    background:var(--bg-card);border-radius:var(--radius);
    border:1px solid var(--border);border-left:3px solid var(--gold);
}
.product-detail .price-big{font-size:2rem;font-weight:700;color:var(--gold)}
.product-detail .price-old-big{font-size:1.2rem;color:var(--text-dim);text-decoration:line-through;margin-left:15px}

.product-detail .product-desc{color:var(--text-muted);line-height:1.9;margin-bottom:30px;font-size:0.95rem}

.product-detail .order-buttons{display:flex;gap:12px;flex-wrap:wrap}

/* ============ EMPTY STATE ============ */
.empty-state{text-align:center;padding:80px 20px}
.empty-state .icon{font-size:3rem;margin-bottom:20px;opacity:0.3}
.empty-state h3{font-family:var(--font-heading);margin-bottom:10px;color:var(--text-white)}
.empty-state p{color:var(--text-muted)}

/* ============ PAGE HERO (Alt sayfalar) ============ */
.page-hero{
    padding:140px 0 50px;
    text-align:center;
    background:linear-gradient(180deg, var(--bg-deep) 0%, var(--bg-card) 100%);
    border-bottom:1px solid var(--border)
}
.page-hero h1{
    font-family:var(--font-heading);font-size:2.8rem;font-weight:600;
    color:var(--text-white);margin-bottom:12px
}
.page-hero p{color:var(--gold-light);font-size:1.05rem;letter-spacing:0.5px}

/* ============ HAKKIMIZDA ============ */
.about-story{
    display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center
}
.about-image{border-radius:16px;overflow:hidden;position:relative}
.about-image::after{
    content:'';position:absolute;inset:0;
    border:2px solid var(--gold);border-radius:16px;opacity:0.3;pointer-events:none
}
.about-image img{width:100%;height:450px;object-fit:cover;display:block}
.about-text h2{
    font-family:var(--font-heading);font-size:2rem;color:var(--text-white);margin-bottom:8px
}
.about-text p{color:var(--text-muted);line-height:1.9;margin-bottom:16px;font-size:0.95rem}

.about-values{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.value-card{
    background:var(--bg-card);border:1px solid var(--border);border-radius:16px;
    padding:32px 24px;text-align:center;transition:all .3s var(--ease)
}
.value-card:hover{border-color:var(--gold);transform:translateY(-4px);box-shadow:0 12px 30px rgba(201,168,76,0.1)}
.value-icon{width:56px;height:56px;margin:0 auto 18px;display:flex;align-items:center;justify-content:center}
.value-icon svg{width:40px;height:40px;stroke:var(--gold)}
.value-card h3{font-family:var(--font-heading);font-size:1.15rem;color:var(--text-white);margin-bottom:10px}
.value-card p{color:var(--text-muted);font-size:0.88rem;line-height:1.7}

/* ============ GALERİ ============ */
.gallery-filters{
    display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:40px
}
.gallery-filter{
    padding:10px 24px;border:1px solid var(--border);border-radius:30px;
    background:transparent;color:var(--text-muted);font-family:var(--font-body);
    font-size:0.85rem;cursor:pointer;transition:all .3s var(--ease)
}
.gallery-filter:hover,.gallery-filter.active{
    background:var(--gold);color:var(--bg-deep);border-color:var(--gold)
}

.gallery-grid{
    display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px
}
.gallery-item{border-radius:12px;overflow:hidden;position:relative}
.gallery-item.hidden{display:none}
.gallery-link{display:block;position:relative;height:300px;overflow:hidden}
.gallery-link img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.gallery-link:hover img{transform:scale(1.08)}
.gallery-overlay{
    position:absolute;inset:0;
    background:linear-gradient(0deg, rgba(8,8,16,0.9) 0%, transparent 60%);
    display:flex;flex-direction:column;justify-content:flex-end;padding:20px;
    opacity:0;transition:opacity .3s var(--ease)
}
.gallery-link:hover .gallery-overlay{opacity:1}
.gallery-overlay h4{font-family:var(--font-heading);color:var(--text-white);font-size:1.05rem;margin-bottom:4px}
.gallery-overlay span{color:var(--gold-light);font-size:0.8rem}
.gallery-overlay .gallery-price{color:var(--gold);font-weight:600;font-size:0.95rem;margin-top:6px}

/* ============ KURUMSAL HİZMETLER ============ */
.services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.service-card{
    background:var(--bg-card);border:1px solid var(--border);border-radius:16px;
    padding:36px 30px;transition:all .3s var(--ease);position:relative;overflow:hidden
}
.service-card::before{
    content:'';position:absolute;top:0;left:0;right:0;height:3px;
    background:linear-gradient(90deg, var(--gold), var(--gold-light));
    opacity:0;transition:opacity .3s var(--ease)
}
.service-card:hover{border-color:var(--gold);transform:translateY(-4px);box-shadow:0 12px 30px rgba(201,168,76,0.1)}
.service-card:hover::before{opacity:1}
.service-icon{width:52px;height:52px;margin-bottom:18px;display:flex;align-items:center;justify-content:center}
.service-icon svg{width:36px;height:36px;stroke:var(--gold)}
.service-card h3{font-family:var(--font-heading);font-size:1.25rem;color:var(--text-white);margin-bottom:12px}
.service-card > p{color:var(--text-muted);font-size:0.9rem;line-height:1.7;margin-bottom:16px}
.service-list{list-style:none;padding:0;margin:0 0 20px}
.service-list li{
    padding:6px 0;color:var(--text-muted);font-size:0.85rem;
    padding-left:18px;position:relative
}
.service-list li::before{
    content:'';position:absolute;left:0;top:13px;width:8px;height:8px;
    border-radius:50%;background:var(--gold);opacity:0.6
}

/* Sipariş Süreci */
.process-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.process-step{padding:30px 20px}
.step-number{
    width:56px;height:56px;border-radius:50%;border:2px solid var(--gold);
    display:flex;align-items:center;justify-content:center;margin:0 auto 18px;
    font-family:var(--font-heading);font-size:1.4rem;color:var(--gold);font-weight:600
}
.process-step h4{font-family:var(--font-heading);color:var(--text-white);margin-bottom:8px;font-size:1rem}
.process-step p{color:var(--text-muted);font-size:0.85rem;line-height:1.6}

/* ============ SCROLL ANIMATIONS ============ */
.reveal{opacity:0;transform:translateY(30px);transition:all .7s var(--ease)}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-left{opacity:0;transform:translateX(-30px);transition:all .7s var(--ease)}
.reveal-left.visible{opacity:1;transform:translateX(0)}
.reveal-right{opacity:0;transform:translateX(30px);transition:all .7s var(--ease)}
.reveal-right.visible{opacity:1;transform:translateX(0)}
.reveal-scale{opacity:0;transform:scale(0.9);transition:all .6s var(--ease)}
.reveal-scale.visible{opacity:1;transform:scale(1)}

/* Stagger children */
.stagger-children > *{opacity:0;transform:translateY(20px);transition:all .5s var(--ease)}
.stagger-children.visible > *{opacity:1;transform:translateY(0)}
.stagger-children.visible > *:nth-child(1){transition-delay:.05s}
.stagger-children.visible > *:nth-child(2){transition-delay:.12s}
.stagger-children.visible > *:nth-child(3){transition-delay:.19s}
.stagger-children.visible > *:nth-child(4){transition-delay:.26s}
.stagger-children.visible > *:nth-child(5){transition-delay:.33s}
.stagger-children.visible > *:nth-child(6){transition-delay:.4s}
.stagger-children.visible > *:nth-child(7){transition-delay:.47s}
.stagger-children.visible > *:nth-child(8){transition-delay:.54s}

/* ============ RESPONSIVE ============ */
@media(max-width:1100px){
    .features-grid{grid-template-columns:repeat(2,1fr)}
    .showcase-grid{grid-template-columns:repeat(3,1fr)}
    .about-values{grid-template-columns:repeat(2,1fr)}
    .process-steps{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:992px){
    .hero h1{font-size:2.8rem}
    .footer-grid{grid-template-columns:1fr 1fr}
    .product-detail{grid-template-columns:1fr}
    .product-detail .product-image img{height:400px}
    .cta-banner{flex-direction:column;text-align:center;padding:40px 30px}
    .about-story{grid-template-columns:1fr;gap:30px}
    .about-image img{height:350px}
    .services-grid{grid-template-columns:1fr}
}

@media(max-width:768px){
    .navbar-toggle{display:block}
    .navbar .container{height:70px}
    .navbar-brand img{height:40px}
    .navbar-brand-text{font-size:1.3rem;letter-spacing:1px}

    .navbar-nav{
        display:none;position:absolute;top:70px;left:0;right:0;
        height:calc(100vh - 70px);
        background:rgb(8,8,16);
        flex-direction:column;align-items:stretch;
        padding:30px 24px;gap:0;
        border-top:1px solid var(--border);
        z-index:1000;
        overflow-y:auto;
    }
    .navbar-nav.active{display:flex}
    .navbar-nav li{list-style:none;border-bottom:1px solid rgba(255,255,255,0.06)}
    .navbar-nav li:last-child{border-bottom:none;text-align:center;padding:20px 0 0}
    .navbar-nav a{display:block;padding:16px 20px;font-size:1rem;text-align:center}
    .navbar-nav a.active{color:var(--gold)}
    .navbar-nav .nav-cta{display:inline-flex;justify-content:center;margin:0 auto}

    /* Mobile dropdown */
    .nav-dropdown{width:100%}
    .dropdown-menu{
        position:static;transform:none;opacity:1;visibility:visible;
        min-width:auto;background:rgba(255,255,255,0.03);
        border:none;box-shadow:none;margin:0;padding:0 0 4px 0;
        display:none;-webkit-backdrop-filter:none;backdrop-filter:none;
    }
    .dropdown-menu::before{display:none}
    .nav-dropdown.open .dropdown-menu{display:block}
    .dropdown-menu a{padding:12px 20px;font-size:0.9rem;color:var(--text-muted)}

    .hero{min-height:90vh;padding-top:70px}
    .hero h1{font-size:2.2rem}
    .hero-desc{font-size:0.92rem}
    .hero-logo{width:150px;height:150px;margin-bottom:22px}
    .hero-buttons{flex-direction:column;align-items:center}
    .hero-buttons .btn{width:100%;max-width:300px}

    .section{padding:60px 0}
    .section-title h2{font-size:2rem}
    .section-title{margin-bottom:40px}

    .products-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
    .product-card .card-image{height:220px}
    .product-card .card-body{padding:16px}

    .features-grid{grid-template-columns:1fr 1fr;gap:14px}
    .feature-card{padding:24px 18px}

    .footer-grid{grid-template-columns:1fr;gap:30px}

    .category-layout{grid-template-columns:1fr;gap:20px}
    .category-aside{order:2}
    .category-header h1{font-size:1.8rem}

    .showcase-grid{grid-template-columns:repeat(3,1fr)}
    .page-hero{padding:110px 0 40px}
    .page-hero h1{font-size:2.2rem}
    .gallery-grid{grid-template-columns:repeat(2,1fr)}
    .gallery-link{height:240px}
}

@media(max-width:480px){
    .hero h1{font-size:1.8rem}
    .hero-tagline{font-size:0.72rem;letter-spacing:3px}
    .hero-logo{width:120px;height:120px}

    .products-grid{grid-template-columns:1fr 1fr;gap:10px}
    .product-card .card-image{height:180px}
    .product-card .card-body{padding:12px}
    .product-card .card-title{font-size:0.92rem}
    .product-card .card-actions .btn{padding:8px 8px;font-size:0.7rem}

    .categories-grid{grid-template-columns:1fr 1fr;gap:10px}
    .category-card{height:220px}

    .features-grid{grid-template-columns:1fr}

    .showcase-grid{grid-template-columns:repeat(2,1fr)}

    .section-title h2{font-size:1.6rem}
    .section{padding:50px 0}

    .page-hero{padding:100px 0 30px}
    .page-hero h1{font-size:1.8rem}
    .about-image img{height:260px}
    .about-values{grid-template-columns:1fr}
    .process-steps{grid-template-columns:1fr 1fr;gap:16px}
    .gallery-grid{grid-template-columns:1fr 1fr;gap:10px}
    .gallery-link{height:200px}
}

/* ============ REDUCE MOTION ============ */
@media(prefers-reduced-motion:reduce){
    *,*::before,*::after{animation-duration:0.01ms !important;transition-duration:0.01ms !important}
}