/* ===== SOSYALEVIN STYLE - RESET & BASE ===== */
*{margin:0;padding:0;box-sizing:border-box}
:root{
    --bg-primary:#0a0a12;--bg-secondary:#12121e;--bg-card:#1a1a2a;--bg-card-hover:#222236;
    --text-primary:#e8e8f0;--text-secondary:#9494b0;--text-muted:#5c5c78;
    --accent:#e8364e;--accent-light:#ff4d6a;--accent-dark:#c42040;
    --gradient-1:linear-gradient(135deg,#e8364e,#d42e78);
    --gradient-2:linear-gradient(135deg,#4a3aff,#7b6cff);
    --border:rgba(255,255,255,0.06);--shadow:0 4px 30px rgba(0,0,0,0.4);
    --radius:12px;--radius-lg:20px;--font:'Inter',-apple-system,sans-serif;
}
html{scroll-behavior:smooth}
body{font-family:var(--font);background:var(--bg-primary);color:var(--text-primary);line-height:1.6;overflow-x:hidden}
.container{max-width:1240px;margin:0 auto;padding:0 20px}
a{text-decoration:none;color:inherit;transition:all .3s ease}
img{max-width:100%;height:auto}
.gradient-text{background:var(--gradient-1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hidden{display:none!important}

/* TOP BAR */
.top-bar{background:var(--bg-secondary);border-bottom:1px solid var(--border);padding:8px 0;font-size:13px}
.top-bar-inner{display:flex;justify-content:space-between;align-items:center}
.top-bar-left,.top-bar-right{display:flex;align-items:center;gap:20px}
.top-bar a{color:var(--text-secondary)}.top-bar a:hover{color:var(--accent)}
.top-bar i{margin-right:6px}

/* NAVBAR */
.navbar{background:rgba(10,10,18,0.95);border-bottom:1px solid var(--border);padding:14px 0;position:sticky;top:0;z-index:100;backdrop-filter:blur(20px)}
.navbar-inner{display:flex;align-items:center;gap:20px}
.logo{display:flex;align-items:center;gap:8px;font-size:22px;font-weight:800;white-space:nowrap}
.logo img{height:36px}
.logo-icon{font-size:28px}.logo-highlight{color:var(--accent)}
.search-bar{flex:1;max-width:420px;display:flex;background:var(--bg-secondary);border:1px solid var(--border);border-radius:50px;overflow:hidden;transition:border-color .3s}
.search-bar:focus-within{border-color:var(--accent)}
.search-bar input{flex:1;padding:10px 20px;background:transparent;border:none;color:var(--text-primary);font-size:14px;outline:none}
.search-bar input::placeholder{color:var(--text-muted)}
.search-bar button{padding:10px 18px;background:var(--gradient-1);border:none;color:#fff;cursor:pointer;font-size:14px}
.navbar-actions{display:flex;align-items:center;gap:14px}
.nav-icon{position:relative;color:var(--text-secondary);font-size:18px;padding:8px;border-radius:10px;transition:all .3s}
.nav-icon:hover{color:var(--accent)}
.badge{position:absolute;top:0;right:0;background:var(--accent);color:#fff;font-size:10px;font-weight:700;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.btn-login{background:var(--gradient-1);color:#fff;padding:10px 22px;border-radius:50px;font-weight:600;font-size:14px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.btn-login:hover{transform:translateY(-1px);box-shadow:0 4px 20px rgba(232,54,78,0.3)}
.mobile-menu-btn{display:none;background:none;border:none;color:var(--text-secondary);font-size:22px;cursor:pointer}

/* MENU BAR */
.menu-bar{background:var(--bg-secondary);border-bottom:1px solid var(--border)}
.menu-bar-inner{display:flex;align-items:center;overflow-x:auto;gap:0}
.menu-link{padding:14px 24px;color:var(--text-secondary);font-size:14px;font-weight:500;white-space:nowrap;display:flex;align-items:center;gap:8px;border-bottom:2px solid transparent;transition:all .3s}
.menu-link:hover,.menu-link.active{color:var(--accent);border-bottom-color:var(--accent)}

/* HERO - SOSYALEVIN STYLE */
.hero-section{padding:40px 0 50px;position:relative;overflow:hidden}
.hero-section::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(ellipse at 30% 50%,rgba(232,54,78,0.06) 0%,transparent 60%)}
.hero-grid{display:grid;grid-template-columns:1fr 340px;gap:20px;align-items:stretch}
.hero-main{border-radius:var(--radius-lg);overflow:hidden;position:relative;min-height:400px;display:flex;align-items:center;background:linear-gradient(135deg,#1a1028 0%,#2a1a35 50%,#1a1028 100%)}
.hero-main img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}
.hero-main-overlay{position:relative;z-index:2;padding:50px 40px;display:flex;flex-direction:column;justify-content:center;width:100%}
.hero-main-overlay::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,rgba(10,10,18,0.85) 0%,rgba(10,10,18,0.4) 100%);z-index:-1}
.hero-badge{display:inline-block;background:rgba(232,54,78,0.15);border:1px solid rgba(232,54,78,0.3);color:var(--accent);padding:6px 16px;border-radius:50px;font-size:13px;font-weight:600;margin-bottom:16px;width:fit-content}
.hero-main-overlay h1{font-size:36px;font-weight:900;line-height:1.2;margin-bottom:14px}
.hero-main-overlay p{color:var(--text-secondary);font-size:15px;margin-bottom:20px;max-width:500px;line-height:1.7}
.hero-rating{display:flex;align-items:center;gap:8px;margin-top:16px}
.hero-rating .stars{color:#ffc107;font-size:16px}
.hero-rating span{color:var(--text-secondary);font-size:14px;font-weight:600}
.hero-side{display:flex;flex-direction:column;gap:16px}
.hero-card{flex:1;border-radius:var(--radius-lg);overflow:hidden;position:relative;display:flex;align-items:flex-end;padding:20px;min-height:190px;cursor:pointer;transition:transform .3s}
.hero-card:hover{transform:scale(1.02)}
.hero-card img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}
.hero-card-content{position:relative;z-index:2}
.hero-card-content h3{font-size:14px;font-weight:800;color:#fff;margin-bottom:4px}
.hero-card-content p{font-size:12px;color:rgba(255,255,255,0.8)}
.hero-card-content .hero-card-btn{display:inline-block;margin-top:10px;padding:8px 18px;background:rgba(255,255,255,0.2);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.25);border-radius:50px;color:#fff;font-size:12px;font-weight:600}
.hero-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:70%;background:linear-gradient(transparent,rgba(0,0,0,0.8));z-index:1}

/* PLATFORMS */
.platforms{padding:60px 0}
.section-title{font-size:26px;font-weight:800;margin-bottom:36px;text-align:center}
.section-title i{color:var(--accent)}
.section-subtitle{text-align:center;color:var(--text-secondary);font-size:14px;margin-top:-28px;margin-bottom:36px}
.platforms-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-bottom:30px}
.platform-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px 28px;text-align:center;transition:all .3s;display:flex;align-items:center;gap:12px;font-weight:600;font-size:14px}
.platform-card:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,0.3)}
.platform-card i{font-size:22px;color:var(--accent)}
.btn-show-all{display:block;text-align:center;padding:14px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-secondary);font-weight:600;font-size:14px;transition:all .3s;max-width:300px;margin:0 auto}
.btn-show-all:hover{border-color:var(--accent);color:var(--accent)}

/* NEDEN BIZ */
.why-us{padding:70px 0;background:var(--bg-secondary)}
.why-us-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.why-us-image{position:relative}
.why-us-image img{border-radius:var(--radius-lg);width:100%}
.why-us-image .why-badge{position:absolute;top:20px;left:20px;background:var(--gradient-1);color:#fff;padding:8px 16px;border-radius:8px;font-size:12px;font-weight:700}
.why-us-content h2{font-size:28px;font-weight:800;margin-bottom:16px;line-height:1.3}
.why-us-content p{color:var(--text-secondary);font-size:14px;line-height:1.8;margin-bottom:20px}
.why-us-features{display:flex;flex-direction:column;gap:12px;margin-bottom:24px}
.why-feature{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--bg-card);border:1px solid var(--border);border-radius:10px}
.why-feature i{color:var(--accent);font-size:18px;width:24px}
.why-feature span{font-size:14px;font-weight:500}
.btn-about{display:inline-flex;align-items:center;gap:8px;padding:12px 28px;background:var(--gradient-1);color:#fff;border-radius:50px;font-weight:600;font-size:14px}
.btn-about:hover{transform:translateY(-2px);box-shadow:0 8px 30px rgba(232,54,78,0.3)}

/* CAMPAIGNS */
.campaigns-section{padding:60px 0}
.campaigns-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.campaign-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;transition:all .3s}
.campaign-card:hover{border-color:var(--accent);transform:translateY(-4px)}
.campaign-card img{width:100%;height:180px;object-fit:cover}
.campaign-card-body{padding:20px}
.campaign-badge{display:inline-block;padding:4px 12px;border-radius:50px;font-size:11px;font-weight:700;margin-bottom:10px}
.campaign-badge.active{background:rgba(0,184,148,0.15);color:#00b894;border:1px solid rgba(0,184,148,0.3)}
.campaign-badge.expired{background:rgba(255,107,107,0.15);color:#ff6b6b;border:1px solid rgba(255,107,107,0.3)}
.campaign-card-body h3{font-size:16px;font-weight:700;margin-bottom:10px;line-height:1.4}
.campaign-date{display:flex;align-items:center;gap:6px;color:var(--text-muted);font-size:12px}
.campaign-date i{color:var(--accent)}

/* BEST SELLERS - KESFET */
.best-sellers{padding:60px 0}
.best-tabs{display:flex;justify-content:center;gap:8px;margin-bottom:30px;flex-wrap:wrap}
.best-tab{padding:10px 20px;background:var(--bg-card);border:1px solid var(--border);border-radius:50px;color:var(--text-secondary);font-size:13px;font-weight:600;cursor:pointer;transition:all .3s}
.best-tab:hover,.best-tab.active{background:var(--gradient-1);color:#fff;border-color:transparent}
.best-sellers-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:20px}
.best-seller-column{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}
.column-header{padding:16px 20px;background:var(--bg-secondary);font-weight:700;font-size:14px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--border)}
.column-header i{color:var(--accent);font-size:18px}
.product-item{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;border-bottom:1px solid var(--border);transition:background .3s}
.product-item:last-child{border-bottom:none}
.product-item:hover{background:var(--bg-card-hover)}
.product-info{display:flex;align-items:center;gap:12px}
.product-icon{color:var(--accent);font-size:18px;width:20px}
.product-info strong{display:block;font-size:13px;font-weight:600}
.product-info small{color:var(--text-muted);font-size:11px}
.product-price{display:flex;align-items:center;gap:10px;font-weight:700;font-size:14px;color:var(--accent);white-space:nowrap}
.btn-cart{background:var(--gradient-1);border:none;color:#fff;width:32px;height:32px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;transition:transform .3s}
.btn-cart:hover{transform:scale(1.1)}

/* STATS */
.stats{padding:50px 0;background:var(--bg-secondary);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
.stat-item{text-align:center}
.stat-icon{font-size:28px;color:var(--accent);margin-bottom:10px}
.stat-number{font-size:30px;font-weight:900;color:var(--text-primary)}
.stat-label{font-size:13px;color:var(--text-secondary);font-weight:500;margin-top:4px}

/* REVIEWS */
.reviews-section{padding:70px 0}
.reviews-layout{display:grid;grid-template-columns:320px 1fr;gap:40px;align-items:start}
.reviews-left{position:relative}
.reviews-left img{border-radius:var(--radius-lg);width:100%}
.google-badge{display:flex;align-items:center;gap:12px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:14px 20px;margin-top:16px}
.google-badge i{font-size:28px;color:#4285f4}
.google-badge strong{display:block;font-size:14px}
.google-badge span{color:var(--text-muted);font-size:12px}
.reviews-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.review-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;transition:all .3s}
.review-card:hover{border-color:var(--accent)}
.review-header{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.review-header img{width:48px;height:48px;border-radius:50%;object-fit:cover}
.review-header strong{display:block;font-size:14px}
.review-header small{color:var(--text-muted);font-size:12px}
.review-stars{color:#ffc107;font-size:12px;margin-left:auto}
.review-card p{color:var(--text-secondary);font-size:13px;line-height:1.7}
.btn-more-reviews{display:block;text-align:center;padding:14px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-secondary);font-weight:600;font-size:14px;margin-top:20px;transition:all .3s}
.btn-more-reviews:hover{border-color:var(--accent);color:var(--accent)}

/* FAQ */
.faq-section{padding:70px 0;background:var(--bg-secondary)}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.faq-item{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:border-color .3s}
.faq-item:hover{border-color:rgba(232,54,78,0.3)}
.faq-question{padding:16px 20px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-size:14px;font-weight:500;transition:background .3s}
.faq-question:hover{background:var(--bg-card-hover)}
.faq-arrow{color:var(--text-muted);font-size:12px;transition:transform .3s}
.faq-item.active .faq-arrow{transform:rotate(180deg);color:var(--accent)}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .4s ease}
.faq-answer p{padding:0 20px 16px;color:var(--text-secondary);font-size:13px;line-height:1.7}

/* PARTNERS */
.partners-section{padding:60px 0}
.partners-slider{display:flex;gap:16px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x mandatory}
.partners-slider::-webkit-scrollbar{height:4px}
.partners-slider::-webkit-scrollbar-track{background:var(--bg-card);border-radius:4px}
.partners-slider::-webkit-scrollbar-thumb{background:var(--accent);border-radius:4px}
.partner-card{min-width:160px;max-width:160px;height:230px;cursor:pointer;position:relative;border-radius:14px;overflow:hidden;scroll-snap-align:start;transition:transform .3s;flex-shrink:0}
.partner-card:hover{transform:scale(1.04)}
.partner-card img{width:100%;height:100%;object-fit:cover}
.partner-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:50%;background:linear-gradient(transparent,rgba(0,0,0,0.8))}
.partner-info{position:absolute;bottom:12px;left:0;right:0;z-index:2;text-align:center;padding:0 8px}
.partner-name{color:#fff;font-size:12px;font-weight:700}
.partner-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;width:40px;height:40px;background:rgba(255,255,255,0.2);backdrop-filter:blur(4px);border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}
.partner-card:hover .partner-play{opacity:1}
.partner-play i{font-size:14px;color:#fff;margin-left:2px}

/* BLOG */
.blog-section{padding:60px 0}
.blog-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.blog-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;transition:all .3s}
.blog-card:hover{transform:translateY(-6px);border-color:var(--accent)}
.blog-card-image{height:160px;overflow:hidden;position:relative}
.blog-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.blog-card:hover .blog-card-image img{transform:scale(1.05)}
.blog-card-body{padding:18px}
.blog-card-date{color:var(--text-muted);font-size:12px;margin-bottom:8px}
.blog-card-body h3{font-size:15px;font-weight:600;margin-bottom:10px;line-height:1.4}
.blog-card-body .blog-read{color:var(--accent);font-size:13px;font-weight:600;display:inline-flex;align-items:center;gap:6px}

/* SEO CONTENT */
.seo-content{padding:60px 0;background:var(--bg-secondary)}
.seo-content h2{font-size:22px;font-weight:700;margin-bottom:16px;color:var(--text-primary)}
.seo-content h3{font-size:18px;font-weight:600;margin:24px 0 12px;color:var(--text-primary)}
.seo-content p{color:var(--text-secondary);font-size:14px;line-height:1.8;margin-bottom:14px}
.seo-content ul,.seo-content ol{color:var(--text-secondary);font-size:14px;line-height:1.8;margin:12px 0;padding-left:20px}

/* FOOTER */
.footer{padding:40px 0 0;background:var(--bg-primary);border-top:1px solid var(--border)}
.footer-contact-bar{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:30px}
.footer-contact-item{display:flex;align-items:center;gap:12px;background:var(--bg-card);border:1px solid var(--border);padding:14px 20px;border-radius:var(--radius);transition:all .3s;flex:1;min-width:200px}
.footer-contact-item:hover{border-color:var(--accent)}
.footer-contact-item i{font-size:20px;color:var(--accent)}
.footer-contact-item small{color:var(--text-muted);font-size:11px;display:block}
.footer-contact-item strong{font-size:13px}
.footer-brand{display:flex;align-items:center;justify-content:space-between;padding:24px 0;border-bottom:1px solid var(--border);flex-wrap:wrap;gap:16px}
.footer-brand .logo-text{font-size:20px;font-weight:800}
.footer-socials{display:flex;gap:10px}
.footer-socials a{width:36px;height:36px;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);font-size:14px;transition:all .3s}
.footer-socials a:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.footer-links{padding:30px 0;display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
.footer-links h4{font-size:14px;font-weight:700;margin-bottom:16px;color:var(--text-primary)}
.footer-links a{display:block;color:var(--text-secondary);font-size:13px;padding:5px 0;transition:color .3s}
.footer-links a:hover{color:var(--accent)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding:20px 0;border-top:1px solid var(--border);flex-wrap:wrap;gap:12px}
.footer-bottom p{color:var(--text-muted);font-size:13px}
.payment-icons{display:flex;gap:8px;align-items:center}
.payment-icons img{height:28px;opacity:0.7}

/* MOBILE BOTTOM NAV */
.mobile-nav{display:none;position:fixed;bottom:0;left:0;right:0;background:var(--bg-secondary);border-top:1px solid var(--border);padding:10px 0;z-index:100}
.mobile-nav-inner{display:flex;justify-content:space-around;align-items:center}
.mobile-nav a{display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--text-muted);font-size:10px;font-weight:500;transition:color .3s}
.mobile-nav a i{font-size:18px}
.mobile-nav a.active,.mobile-nav a:hover{color:var(--accent)}

/* STORY MODAL */
.story-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;align-items:center;justify-content:center}
.story-modal.active{display:flex}
.story-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.85);backdrop-filter:blur(10px)}
.story-content{position:relative;z-index:1;width:360px;max-width:90vw}
.story-close{position:absolute;top:-40px;right:0;background:var(--accent);border:none;color:#fff;width:36px;height:36px;border-radius:50%;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.story-video-wrapper{width:100%;aspect-ratio:9/16;border-radius:var(--radius-lg);overflow:hidden;background:#000}
.story-video-wrapper iframe{width:100%;height:100%}

/* PLATFORM DETAIL PAGE */
.platform-hero{padding:50px 0;text-align:center;position:relative}
.platform-hero-icon{font-size:64px;margin-bottom:16px}
.platform-hero h1{font-size:32px;font-weight:900;margin-bottom:10px}
.platform-hero p{color:var(--text-secondary);font-size:15px;max-width:600px;margin:0 auto}
.platform-cats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;padding:40px 0}
.platform-cat-card{display:flex;align-items:center;gap:16px;background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:20px;transition:all .3s}
.platform-cat-card:hover{border-color:var(--accent);transform:translateY(-2px)}
.platform-cat-card i{font-size:24px;color:var(--accent)}
.platform-cat-card strong{display:block;font-size:14px}
.platform-cat-card small{color:var(--text-muted);font-size:12px}

/* PRODUCT CARDS */
.products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;padding:30px 0}
.product-card{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:20px;transition:all .3s}
.product-card:hover{border-color:var(--accent)}
.product-card h3{font-size:15px;font-weight:700;margin-bottom:6px}
.product-card .pc-desc{color:var(--text-secondary);font-size:13px;margin-bottom:12px}
.product-card .pc-meta{display:flex;align-items:center;gap:8px;color:var(--text-muted);font-size:12px;margin-bottom:14px}
.product-card .pc-bottom{display:flex;justify-content:space-between;align-items:center}
.product-card .pc-price{font-size:20px;font-weight:800;color:var(--accent)}
.product-card .pc-old-price{text-decoration:line-through;color:var(--text-muted);font-size:13px;margin-left:8px}
.product-card .pc-btn{padding:10px 20px;background:var(--gradient-1);color:#fff;border-radius:10px;font-size:13px;font-weight:600;display:inline-flex;align-items:center;gap:6px}
.product-card .pc-btn:hover{transform:translateY(-1px)}

/* CAMPAIGNS PAGE */
.campaigns-page{padding:50px 0}
.campaigns-page h1{font-size:32px;font-weight:900;text-align:center;margin-bottom:10px}
.campaigns-page .page-subtitle{text-align:center;color:var(--text-secondary);font-size:14px;margin-bottom:40px}
.campaign-full-card{display:grid;grid-template-columns:300px 1fr;gap:0;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;margin-bottom:20px;transition:all .3s}
.campaign-full-card:hover{border-color:var(--accent)}
.campaign-full-card img{width:100%;height:100%;object-fit:cover;min-height:200px}
.campaign-full-body{padding:30px;display:flex;flex-direction:column;justify-content:center}
.campaign-full-body h3{font-size:20px;font-weight:700;margin-bottom:10px}
.campaign-full-body .cf-date{color:var(--text-muted);font-size:13px;display:flex;align-items:center;gap:6px}
.campaign-full-body .cf-btn{display:inline-block;margin-top:16px;padding:10px 24px;background:var(--gradient-1);color:#fff;border-radius:50px;font-size:13px;font-weight:600;width:fit-content}

/* AUTH PAGES */
.auth-page{min-height:80vh;display:flex;align-items:center;justify-content:center;padding:40px 20px}
.auth-box{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:40px;max-width:440px;width:100%}
.auth-box h1{font-size:24px;font-weight:800;text-align:center;margin-bottom:8px}
.auth-box .auth-sub{text-align:center;color:var(--text-secondary);font-size:14px;margin-bottom:30px}
.form-group{margin-bottom:18px}
.form-group label{display:block;color:var(--text-secondary);font-size:13px;margin-bottom:6px;font-weight:500}
.form-group input,.form-group textarea,.form-group select{width:100%;padding:12px 16px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:10px;color:var(--text-primary);font-size:14px;font-family:var(--font);outline:none;transition:border-color .3s}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--accent)}
.btn-submit{width:100%;padding:14px;background:var(--gradient-1);border:none;border-radius:10px;color:#fff;font-size:15px;font-weight:700;cursor:pointer;font-family:var(--font);transition:all .3s}
.btn-submit:hover{opacity:0.9;transform:translateY(-1px)}
.auth-link{text-align:center;margin-top:16px;color:var(--text-secondary);font-size:13px}
.auth-link a{color:var(--accent);font-weight:600}

/* CONTACT PAGE */
.contact-page{padding:50px 0}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.contact-info-cards{display:flex;flex-direction:column;gap:14px}
.contact-info-card{display:flex;align-items:center;gap:14px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:20px}
.contact-info-card i{font-size:24px;color:var(--accent);width:40px;height:40px;background:rgba(232,54,78,0.1);border-radius:10px;display:flex;align-items:center;justify-content:center}
.contact-info-card strong{display:block;font-size:14px}
.contact-info-card small{color:var(--text-muted);font-size:12px}
.contact-form{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:30px}

/* CART & CHECKOUT */
.cart-page{padding:50px 0}
.cart-items{display:flex;flex-direction:column;gap:14px;margin-bottom:30px}
.cart-item{display:flex;align-items:center;gap:16px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px}
.cart-item-info{flex:1}
.cart-item-info h4{font-size:14px;font-weight:600}
.cart-item-info small{color:var(--text-muted);font-size:12px}
.cart-item-price{font-size:16px;font-weight:700;color:var(--accent)}
.cart-item-remove{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:16px;padding:8px}
.cart-item-remove:hover{color:#e74c3c}
.cart-summary{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px}
.cart-summary h3{font-size:18px;font-weight:700;margin-bottom:16px}
.cart-total{display:flex;justify-content:space-between;padding:12px 0;border-top:1px solid var(--border);font-size:16px;font-weight:700}
.cart-total span:last-child{color:var(--accent)}

/* FLASH MESSAGES */
.flash{padding:14px 20px;border-radius:10px;margin-bottom:20px;font-size:14px;font-weight:500}
.flash-success{background:rgba(0,184,148,0.1);border:1px solid rgba(0,184,148,0.2);color:#00b894}
.flash-error{background:rgba(231,76,60,0.1);border:1px solid rgba(231,76,60,0.2);color:#e74c3c}
.flash-info{background:rgba(52,152,219,0.1);border:1px solid rgba(52,152,219,0.2);color:#3498db}

/* RESPONSIVE */
@media(max-width:1024px){
    .hero-grid{grid-template-columns:1fr}
    .hero-side{flex-direction:row}
    .best-sellers-grid{grid-template-columns:1fr}
    .reviews-layout{grid-template-columns:1fr}
    .why-us-grid{grid-template-columns:1fr}
    .blog-grid{grid-template-columns:repeat(2,1fr)}
    .campaigns-grid{grid-template-columns:repeat(2,1fr)}
    .campaign-full-card{grid-template-columns:1fr}
}
@media(max-width:768px){
    .top-bar{display:none}
    .navbar-inner{flex-wrap:wrap}
    .search-bar{order:3;max-width:100%;width:100%;margin-top:10px}
    .menu-bar{display:none}
    .hero-main-overlay h1{font-size:24px}
    .hero-side{flex-direction:column}
    .platforms-grid{justify-content:flex-start}
    .stats-grid{grid-template-columns:repeat(2,1fr);gap:20px}
    .faq-grid{grid-template-columns:1fr}
    .reviews-grid{grid-template-columns:1fr}
    .blog-grid{grid-template-columns:1fr}
    .footer-links{grid-template-columns:repeat(2,1fr)}
    .footer-bottom{flex-direction:column;text-align:center}
    .mobile-menu-btn{display:block}
    .mobile-nav{display:block}
    body{padding-bottom:70px}
    .contact-grid{grid-template-columns:1fr}
    .campaigns-grid{grid-template-columns:1fr}
}
@media(max-width:480px){
    .platforms-grid{gap:8px}
    .platform-card{padding:12px 16px;font-size:13px}
    .footer-links{grid-template-columns:1fr}
    .hero-main{min-height:300px}
    .hero-main-overlay{padding:30px 20px}
}

/* ANIMATIONS */
@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.fade-in{animation:fadeInUp .6s ease forwards}

/* LIGHT MODE */
body.light-mode{
    --bg-primary:#f8f9fc;--bg-secondary:#ffffff;--bg-card:#ffffff;--bg-card-hover:#f5f5fa;
    --text-primary:#1a1a2e;--text-secondary:#555570;--text-muted:#8888a0;
    --accent:#e8364e;--border:rgba(0,0,0,0.08);--shadow:0 4px 20px rgba(0,0,0,0.04);
}
body.light-mode .navbar{background:rgba(255,255,255,0.97)}
body.light-mode .stats{background:#fff}
body.light-mode .faq-section{background:#f8f9fc}
body.light-mode .seo-content{background:#f8f9fc}

/* THEME TOGGLE */
.theme-toggle{display:flex;align-items:center;gap:4px;background:rgba(255,255,255,0.08);border:1px solid var(--border);border-radius:50px;padding:4px 10px;cursor:pointer;font-size:13px;color:var(--text-secondary);transition:all .3s}
.theme-toggle:hover{border-color:var(--accent);color:var(--accent)}
.theme-toggle .fa-sun{display:none;color:#f39c12}
.theme-toggle .fa-moon{color:#a0a0c0}
body.light-mode .theme-toggle .fa-sun{display:inline}
body.light-mode .theme-toggle .fa-moon{display:none}

/* PRODUCT PAGE - SOSYALEVIN STYLE */
.product-page{padding:30px 0}
.breadcrumb{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-muted);margin-bottom:24px}
.breadcrumb a{color:var(--accent)}
.breadcrumb i{font-size:10px}
.product-page-grid{display:grid;grid-template-columns:1fr 280px;gap:30px}
.pp-hero{display:flex;align-items:center;gap:20px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:30px;margin-bottom:24px}
.pp-hero-icon{width:80px;height:80px;background:var(--pcolor);border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:36px;color:#fff;flex-shrink:0}
.pp-platform-badge{font-size:12px;font-weight:700;color:var(--pcolor);text-transform:uppercase;letter-spacing:1px}
.pp-hero-info p{color:var(--text-secondary);font-size:14px;margin:8px 0}
.pp-rating{font-size:13px;color:#ffc107}
.pp-rating span{color:var(--text-primary);font-weight:600;margin-left:4px}
.pp-rating small{color:var(--text-muted)}

/* Package Selection */
.pp-packages{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px;margin-bottom:20px}
.pp-packages h2{font-size:16px;font-weight:700;display:flex;align-items:center;gap:8px;margin-bottom:4px}
.pp-packages h2 i{color:var(--accent)}
.pp-packages-sub{color:var(--text-muted);font-size:13px;margin-bottom:16px}
.pp-package-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.pp-package-item{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:var(--bg-secondary);border:2px solid var(--border);border-radius:10px;cursor:pointer;transition:all .2s}
.pp-package-item:hover{border-color:rgba(232,54,78,0.4)}
.pp-package-item.active{border-color:var(--accent);background:rgba(232,54,78,0.05)}
.pp-package-item input{display:none}
.pp-pkg-name{font-size:13px;font-weight:600}
.pp-pkg-price{font-size:13px;font-weight:700;color:var(--accent)}

/* Selected Summary */
.pp-selected-summary{display:flex;justify-content:space-between;align-items:center;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px;margin-bottom:20px}
.pp-selected-info{display:flex;flex-direction:column;gap:2px}
.pp-selected-info span{font-size:13px;color:var(--text-secondary)}
.pp-selected-info strong{font-size:20px;color:var(--accent)}

/* Social Proof */
.pp-social-proof{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px;margin-bottom:24px}
.pp-cart-count{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--accent);margin-bottom:16px}
.pp-features{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pp-features>div{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-secondary);padding:8px 12px;background:var(--bg-secondary);border-radius:8px}
.pp-features i{color:var(--accent);width:16px}

/* How To Steps */
.pp-how-to{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px}
.pp-how-to h3{font-size:16px;font-weight:700;margin-bottom:20px}
.pp-steps{display:flex;flex-direction:column;gap:16px}
.pp-step{display:flex;align-items:flex-start;gap:14px}
.pp-step-num{width:32px;height:32px;background:var(--gradient-1);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex-shrink:0}
.pp-step strong{display:block;font-size:14px;margin-bottom:2px}
.pp-step p{color:var(--text-muted);font-size:12px}

/* Sidebar Stats */
.pps-stats{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;display:flex;flex-direction:column;gap:16px;position:sticky;top:120px}
.pps-stat{display:flex;align-items:center;gap:12px;padding:12px;background:var(--bg-secondary);border-radius:10px}
.pps-stat i{font-size:20px;color:var(--accent);width:24px}
.pps-stat strong{display:block;font-size:16px;font-weight:800}
.pps-stat small{color:var(--text-muted);font-size:11px}

/* BUY PAGE */
.buy-layout{display:grid;grid-template-columns:200px 1fr 260px;gap:24px}
.buy-sidebar{position:sticky;top:120px;height:fit-content}
.buy-platform-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);text-align:center;overflow:hidden}
.bpc-icon{background:var(--pcolor);padding:30px;font-size:40px;color:#fff}
.buy-platform-card h2{font-size:16px;font-weight:700;padding:16px 16px 4px}
.buy-platform-card p{color:var(--text-muted);font-size:13px;padding:0 16px 16px}
.buy-main{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:30px}
.buy-price-box{display:flex;align-items:center;gap:14px;margin-bottom:24px;padding:16px;background:var(--bg-secondary);border-radius:10px}
.buy-old-price{text-decoration:line-through;color:var(--text-muted);font-size:14px}
.buy-price{font-size:24px;font-weight:800;color:var(--accent)}
.buy-delivery{color:var(--text-muted);font-size:13px;margin-left:auto}
.buy-step{margin-top:20px}
.buy-step h3{font-size:15px;font-weight:700;display:flex;align-items:center;gap:8px;margin-bottom:4px}
.buy-step h3 i{color:var(--accent)}
.buy-input-row{display:flex;gap:10px;margin-bottom:10px}
.buy-input{width:100%;padding:12px 16px;background:var(--bg-secondary);border:2px solid var(--border);border-radius:10px;color:var(--text-primary);font-size:14px;font-family:var(--font);outline:none;transition:border-color .3s}
.buy-input:focus{border-color:var(--accent)}
.buy-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;background:var(--gradient-1);color:#fff;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;font-family:var(--font);transition:all .3s;text-decoration:none}
.buy-btn:hover{transform:translateY(-1px);box-shadow:0 4px 16px rgba(232,54,78,0.3)}
.buy-btn-full{width:100%;justify-content:center}
.buy-btn-outline{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;background:transparent;border:1px solid var(--border);color:var(--text-secondary);border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;font-family:var(--font);transition:all .3s;text-decoration:none}
.buy-btn-outline:hover{border-color:var(--accent);color:var(--accent)}
.buy-btn-sm{padding:10px 16px;background:var(--gradient-1);color:#fff;border:none;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;font-family:var(--font)}
.buy-warning{display:flex;align-items:center;gap:8px;padding:10px 14px;background:rgba(232,54,78,0.08);border:1px solid rgba(232,54,78,0.15);border-radius:8px;font-size:12px;color:var(--accent)}
.buy-confirmed{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:rgba(0,184,148,0.08);border:1px solid rgba(0,184,148,0.2);border-radius:10px;margin-bottom:16px}
.buy-confirmed-info{display:flex;align-items:center;gap:10px}
.buy-confirmed-info strong{display:block;font-size:12px;color:var(--text-muted)}
.buy-confirmed-info span{font-size:14px;font-weight:600}
.buy-status-ok{background:#00b894;color:#fff;padding:4px 12px;border-radius:50px;font-size:11px;font-weight:700}
.buy-total{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:var(--bg-secondary);border-radius:10px;margin-bottom:16px;font-size:14px}
.buy-total strong{color:var(--accent);font-size:16px}

/* Trust Sidebar */
.buy-trust{position:sticky;top:120px;height:fit-content}
.buy-trust-badge{background:rgba(232,54,78,0.1);border:1px solid rgba(232,54,78,0.2);border-radius:10px;padding:12px 16px;font-size:13px;font-weight:600;color:var(--accent);display:flex;align-items:center;gap:8px;margin-bottom:16px}
.buy-trust-features{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;display:flex;flex-direction:column;gap:12px}
.buy-trust-features>div{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text-secondary)}
.buy-trust-features i{color:var(--accent);width:18px}

/* CART PAGE */
.cart-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;padding:20px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg)}
.cart-header-left{display:flex;align-items:center;gap:14px}
.cart-header-icon{width:48px;height:48px;background:var(--gradient-1);border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:20px}
.cart-header h1{font-size:20px;font-weight:700;margin-bottom:2px}
.cart-header p{color:var(--text-muted);font-size:13px}
.cart-header-badge{text-align:right;font-size:13px;color:var(--text-muted)}
.cart-layout{display:grid;grid-template-columns:1fr 340px;gap:24px}
.cart-items{display:flex;flex-direction:column;gap:12px}
.cart-item{display:flex;justify-content:space-between;align-items:center;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px;transition:border-color .3s}
.cart-item:hover{border-color:var(--accent)}
.cart-item-info{display:flex;align-items:center;gap:14px}
.cart-item-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px}
.cart-item-info strong{display:block;font-size:12px;font-weight:700}
.cart-item-info span{display:block;font-size:14px;font-weight:600}
.cart-item-info small{display:block;color:var(--text-muted);font-size:12px;margin-top:2px}
.cart-item-right{display:flex;align-items:center;gap:16px}
.cart-item-price{font-size:16px;font-weight:700;color:var(--accent)}
.cart-item-remove{color:var(--text-muted);font-size:14px;padding:8px;transition:color .3s}
.cart-item-remove:hover{color:#e74c3c}
.cart-sidebar{position:sticky;top:120px;height:fit-content}
.cart-coupon{display:flex;gap:8px;margin-bottom:16px}
.cart-summary{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;margin-bottom:16px}
.cart-summary-row{display:flex;justify-content:space-between;padding:10px 0;font-size:14px;color:var(--text-secondary);border-bottom:1px solid var(--border)}
.cart-summary-row:last-child{border-bottom:none}
.cart-summary-row.total{font-weight:700;font-size:16px;color:var(--text-primary);padding-top:14px}
.cart-summary-row.total span:last-child{color:var(--accent)}

/* Payment Options */
.payment-option{display:block;margin-bottom:10px;cursor:pointer}
.payment-option input{display:none}
.po-content{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--bg-card);border:2px solid var(--border);border-radius:12px;transition:all .2s}
.payment-option input:checked+.po-content{border-color:var(--accent);background:rgba(232,54,78,0.05)}
.po-icon{width:40px;height:40px;background:var(--bg-secondary);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--accent)}
.po-info strong{display:block;font-size:14px}
.po-info small{color:var(--text-muted);font-size:12px}

/* CHECKOUT */
.checkout-layout{display:grid;grid-template-columns:1fr 340px;gap:24px}
.checkout-main .card{background:var(--bg-card);border:1px solid var(--border)}
.checkout-summary .card{background:var(--bg-card);border:1px solid var(--border)}
.bank-info-grid{display:flex;flex-direction:column;gap:16px}
.bank-info-item{padding:14px;background:var(--bg-secondary);border-radius:10px}
.bank-info-item small{display:block;color:var(--text-muted);font-size:11px;margin-bottom:4px;text-transform:uppercase;letter-spacing:0.5px}
.bank-info-item strong{font-size:14px}

/* Cart Added Modal */
.cart-added-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;display:flex;align-items:center;justify-content:center}
.cam-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);backdrop-filter:blur(4px)}
.cam-content{position:relative;z-index:1;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:30px;max-width:500px;width:90%}
.cam-content h2{font-size:18px;font-weight:700;display:flex;align-items:center;gap:10px;margin-bottom:8px}
.cam-content>p{color:var(--text-muted);font-size:13px;margin-bottom:20px}
.cam-related{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.cam-item{display:flex;justify-content:space-between;align-items:center;padding:12px;background:var(--bg-secondary);border-radius:10px}
.cam-item-info{display:flex;align-items:center;gap:10px}
.cam-item-info i{font-size:18px;color:var(--accent)}
.cam-item-info strong{display:block;font-size:13px}
.cam-add-btn{padding:8px 14px;background:var(--gradient-1);color:#fff;border-radius:8px;font-size:12px;font-weight:600}
.cam-actions{display:flex;gap:10px}
.cam-actions>*{flex:1;text-align:center;justify-content:center}

/* RESPONSIVE OVERRIDES */
@media(max-width:1024px){
    .product-page-grid{grid-template-columns:1fr}
    .product-page-sidebar{display:none}
    .buy-layout{grid-template-columns:1fr}
    .buy-sidebar{display:none}
    .buy-trust{display:none}
    .cart-layout{grid-template-columns:1fr}
    .checkout-layout{grid-template-columns:1fr}
}
@media(max-width:768px){
    .pp-hero{flex-direction:column;text-align:center}
    .pp-package-grid{grid-template-columns:1fr 1fr}
    .pp-features{grid-template-columns:1fr}
}

/* TOOLS PAGES */
.tool-page{padding:40px 0}
.tool-back{display:inline-flex;align-items:center;gap:6px;color:var(--accent);font-size:13px;font-weight:600;margin-bottom:20px}
.tool-back:hover{text-decoration:underline}
.tool-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}
.tool-card-header{display:flex;align-items:center;gap:16px;padding:30px;border-bottom:1px solid var(--border);background:var(--bg-secondary)}
.tool-icon{width:56px;height:56px;background:var(--gradient-1);border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:24px;color:#fff;flex-shrink:0}
.tool-card-header h1{font-size:22px;font-weight:800;margin-bottom:4px}
.tool-card-header p{color:var(--text-secondary);font-size:14px}
.tool-card-body{padding:30px}
.tool-input-row{display:flex;gap:10px;margin-bottom:20px}
.tool-input{flex:1;padding:14px 18px;background:var(--bg-secondary);border:2px solid var(--border);border-radius:12px;color:var(--text-primary);font-size:15px;font-family:var(--font);outline:none;transition:border-color .3s}
.tool-input:focus{border-color:var(--accent)}
.tool-btn{display:inline-flex;align-items:center;gap:8px;padding:14px 24px;background:var(--gradient-1);color:#fff;border:none;border-radius:12px;font-size:14px;font-weight:600;cursor:pointer;font-family:var(--font);transition:all .3s;white-space:nowrap}
.tool-btn:hover{transform:translateY(-1px);box-shadow:0 4px 16px rgba(232,54,78,0.3)}
.tool-btn-sm{padding:8px 14px;background:var(--gradient-1);color:#fff;border:none;border-radius:8px;font-size:12px;font-weight:600;cursor:pointer;font-family:var(--font)}
.tool-results{margin-top:24px;padding:20px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:14px}
.tool-results-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.tool-results-header strong{font-size:14px}
.tool-tags{display:flex;flex-wrap:wrap;gap:8px}
.tool-tag{background:rgba(232,54,78,0.1);color:var(--accent);padding:8px 14px;border-radius:8px;font-size:13px;cursor:pointer;transition:all .2s;font-weight:500}
.tool-tag:hover{background:rgba(232,54,78,0.2);transform:translateY(-1px)}
.tool-tag.copied{background:rgba(0,184,148,0.2);color:#00b894}
.tool-textarea{width:100%;min-height:120px;padding:14px 18px;background:var(--bg-secondary);border:2px solid var(--border);border-radius:12px;color:var(--text-primary);font-size:14px;font-family:var(--font);outline:none;resize:vertical;transition:border-color .3s}
.tool-textarea:focus{border-color:var(--accent)}
.tool-output{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:20px;margin-top:16px;font-size:14px;line-height:1.7;color:var(--text-secondary)}
.tool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;margin-top:16px}
.tool-grid-item{padding:10px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;text-align:center;cursor:pointer;transition:all .2s;font-size:20px}
.tool-grid-item:hover{border-color:var(--accent);transform:scale(1.05)}
.tool-stat-row{display:flex;gap:12px;margin-top:16px;flex-wrap:wrap}
.tool-stat{flex:1;min-width:100px;padding:14px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:10px;text-align:center}
.tool-stat strong{display:block;font-size:22px;font-weight:800;color:var(--accent)}
.tool-stat small{color:var(--text-muted);font-size:11px}

/* TOOLS LIST PAGE */
.tools-page{padding:50px 0}
.tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.tools-card{display:flex;align-items:center;gap:16px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px;transition:all .3s}
.tools-card:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,0.2)}
.tools-card .tool-icon{width:48px;height:48px;font-size:20px}
.tools-card h3{font-size:15px;font-weight:700;margin-bottom:4px}
.tools-card p{color:var(--text-muted);font-size:12px}
