/* ═══════════════════════════════════════════
   EgzotikMarket — Ana CSS
   Açık çimen yeşil tema + Altın vurgular
   ═══════════════════════════════════════════ */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --g:#5a9e3a;--g2:#6dbe47;--g3:#edf7e4;--gl:#f4fbee;
  --gold:#b8860b;--gold2:#e8c97a;
  --bg:#f5faf0;--bg2:#fff;--bg3:#edf7e4;
  --border:#cde8b5;--border2:#a8d080;
  --text:#1a2e10;--text2:#3d5c28;--text3:#7a9e62;
  --red:#c8102e;--red2:#e53935;
  --shadow:0 2px 12px rgba(90,158,58,.10);
}
html{scroll-behavior:smooth;overflow-x:hidden}
body{font-family:"Inter",sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden;font-size:14px;max-width:100vw}
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-thumb{background:var(--g2);border-radius:3px}
button,input,select,textarea{font-family:"Inter",sans-serif}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}

/* TOPBAR */
#topbar{background:var(--g);color:rgba(255,255,255,.9);padding:6px 24px;display:flex;align-items:center;justify-content:space-between;font-size:11px}
.tb-l{display:flex;gap:18px}.tb-l span{display:flex;align-items:center;gap:5px}
.tb-r{display:flex;gap:14px}
.tb-r a{color:rgba(255,255,255,.8);cursor:pointer;transition:color .2s}
.tb-r a:hover{color:#fff}
.tb-sep{opacity:.4}

/* STICKY WRAPPER — header + navbar birlikte yapışık */
#sticky-wrap{position:sticky;top:0;z-index:400;background:#fff;box-shadow:0 2px 12px rgba(90,158,58,.10)}

/* HEADER */
#header{background:#fff;border-bottom:3px solid var(--g3);padding:14px 24px;display:flex;align-items:center;gap:18px;}
.logo{font-family:"Playfair Display",serif;font-size:22px;font-weight:700;cursor:pointer;white-space:nowrap;flex-shrink:0;line-height:1.1}
.logo em{color:var(--g);font-style:normal}
.logo small{font-family:"Inter",sans-serif;font-size:9px;letter-spacing:2.5px;color:var(--text3);font-weight:400;display:block;margin-top:1px}
.srch{flex:1;max-width:540px;display:flex}
.srch input{flex:1;background:var(--gl);border:1.5px solid var(--border2);border-right:none;padding:9px 14px;color:var(--text);font-size:13px;outline:none;transition:border-color .2s}
.srch input:focus{border-color:var(--g)}
.srch button{background:var(--g);border:none;padding:0 18px;color:#fff;font-size:16px;cursor:pointer;flex-shrink:0;transition:background .2s}
.srch button:hover{background:var(--g2)}
.hdr-r{display:flex;align-items:center;gap:10px;margin-left:auto;flex-shrink:0}
.hic{display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer;padding:6px 10px;border:1.5px solid transparent;border-radius:6px;transition:all .2s;position:relative;min-width:52px}
.hic:hover{border-color:var(--border2);background:var(--g3)}
.hic-i{font-size:20px;line-height:1}
.hic-l{font-size:9px;color:var(--text3);white-space:nowrap}
.hic-v{font-size:10px;color:var(--g);font-weight:600}
.cbdg{position:absolute;top:-2px;right:-2px;background:var(--red);color:#fff;font-size:9px;font-weight:700;min-width:16px;height:16px;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 3px}
.hbtn{background:var(--g);color:#fff;border:none;padding:9px 16px;font-size:11px;font-weight:600;cursor:pointer;border-radius:4px;transition:background .2s;white-space:nowrap}
.hbtn:hover{background:var(--g2)}

/* NAVBAR */
#navbar{background:#fff;border-bottom:2px solid var(--g3);padding:0 24px;display:flex;align-items:center;}
.nit{padding:11px 16px;font-size:12px;font-weight:500;color:var(--text2);cursor:pointer;border-bottom:2px solid transparent;transition:all .2s;white-space:nowrap}
.nit:hover,.nit.on{color:var(--g);border-color:var(--g)}
.nsp{flex:1}

/* PAGES */
.page{display:none}.page.on{display:block}

/* HOME 3-COL */
.home-grid{display:grid;grid-template-columns:210px 1fr 210px;gap:1px;background:var(--border);height:380px;max-height:380px}

/* SIDEBAR */
.sb{background:#fff;overflow:hidden}
.sb-hd{background:var(--g);color:#fff;padding:11px 14px;font-size:11px;font-weight:700;letter-spacing:1px}
.sb-it{display:flex;align-items:center;justify-content:space-between;padding:9px 14px;border-bottom:1px solid var(--border);cursor:pointer;font-size:11px;color:var(--text2);transition:all .2s}
.sb-it:hover,.sb-it.on{background:var(--g3);color:var(--g)}
.sb-bdg{background:var(--red);color:#fff;font-size:8px;font-weight:700;padding:2px 5px;border-radius:2px}
.sb-bdg-g{background:var(--g);color:#fff;font-size:8px;font-weight:700;padding:2px 5px;border-radius:2px}
.sb-promo{margin:12px;border:1px solid var(--border2);padding:14px;text-align:center;background:var(--g3)}
.sb-promo-em{font-size:30px;margin-bottom:6px}
.sb-promo-t{font-size:11px;font-weight:700;color:var(--g);margin-bottom:3px}
.sb-promo-s{font-size:10px;color:var(--text3);line-height:1.5}

/* CENTER SLIDER */
.cban{background:#1a3a0d;display:flex;flex-direction:column;overflow:hidden}
.swrap{flex:1;position:relative;min-height:0;overflow:hidden;cursor:pointer}
.cs{position:absolute;inset:0;display:flex;align-items:center;padding:28px 32px;gap:20px;opacity:0;pointer-events:none;transition:opacity .6s}
.cs.on{opacity:1;pointer-events:all}
.cs-txt{flex:1;z-index:2}
.cs-tag{font-size:9px;letter-spacing:2.5px;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:10px}
.cs-h{font-family:"Playfair Display",serif;font-size:30px;font-weight:700;color:#fff;line-height:1.1;margin-bottom:10px}
.cs-p{font-size:11px;color:rgba(255,255,255,.7);line-height:1.65;margin-bottom:14px;max-width:260px}
.cs-price{font-family:"Playfair Display",serif;font-size:26px;font-weight:700;color:#e8c97a;margin-bottom:14px}
.cs-price span{font-size:10px;color:rgba(255,255,255,.4);font-family:"Inter",sans-serif;font-weight:400}
.cs-btn{background:#e8c97a;color:#1a1a00;border:none;padding:10px 24px;font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:all .2s}
.cs-btn:hover{background:#ffdd99}
.cs-em{font-size:100px;flex-shrink:0;animation:bob 4s ease-in-out infinite;line-height:1}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-10px) rotate(4deg)}}
.cs-circ{position:absolute;top:14px;right:14px;width:58px;height:58px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:700;font-size:10px;color:#fff;z-index:3;box-shadow:0 3px 14px rgba(0,0,0,.35)}
.sbot{background:rgba(0,0,0,.3);padding:10px 22px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.sdots{display:flex;gap:6px}
.sd{height:3px;border-radius:2px;background:rgba(255,255,255,.3);cursor:pointer;transition:all .3s;width:8px}
.sd.on{background:#e8c97a;width:22px}
.sstats{display:flex;gap:18px;text-align:center}
.ssn{font-family:"Playfair Display",serif;font-size:18px;color:#e8c97a;line-height:1}
.ssl{font-size:8px;letter-spacing:1px;color:rgba(255,255,255,.4);text-transform:uppercase;margin-top:2px}

/* RIGHT SCROLL */
.rcol{background:#fff;overflow:hidden;display:flex;flex-direction:column;height:100%}
.rcol-hd{background:linear-gradient(135deg,var(--g),#3d7a25);color:#fff;padding:11px 14px;font-size:11px;font-weight:700;letter-spacing:1px;text-align:center}
.rcp{overflow:hidden;flex:1}
.rct{display:flex;flex-direction:column;animation:rcUp 18s linear infinite}
.rct:hover,.rcol:hover .rct{animation-play-state:paused}
@keyframes rcUp{0%{transform:translateY(0)}100%{transform:translateY(-50%)}}
.rcc{padding:13px 10px;text-align:center;cursor:pointer;border-bottom:1px solid rgba(255,255,255,.12);transition:filter .2s;flex-shrink:0}
.rcc:hover{filter:brightness(1.2)}
.rcc-em{font-size:36px;margin-bottom:5px;line-height:1}
.rcc-nm{font-size:10px;font-weight:700;margin-bottom:2px;letter-spacing:.3px}
.rcc-pr{font-family:"Playfair Display",serif;font-size:14px;font-weight:700;line-height:1;margin-bottom:2px}
.rcc-tg{font-size:8px;letter-spacing:.5px;text-transform:uppercase;opacity:.6}

/* MARQUEE */
.mbar{background:var(--g);padding:8px 0;overflow:hidden;white-space:nowrap}
.min{display:inline-block;animation:mt 26s linear infinite}
@keyframes mt{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.mi{display:inline-flex;align-items:center;gap:6px;margin:0 20px;font-size:9px;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.85)}
.mi-d{width:3px;height:3px;border-radius:50%;background:#e8c97a;flex-shrink:0}

/* CAT SHORTCUTS */
.catsc{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--border)}
.csc{background:#fff;padding:18px 10px;text-align:center;cursor:pointer;transition:background .2s}
.csc:hover{background:var(--g3)}.csc:hover .csc-em{transform:scale(1.15) rotate(-5deg)}
.csc-em{font-size:40px;transition:transform .3s;display:block;margin-bottom:8px}
.csc-t{font-size:11px;font-weight:600;color:var(--text2)}.csc-s{font-size:10px;color:var(--text3);margin-top:2px}

/* PRODUCTS */
.psec{padding:24px;background:#fff;border-top:1px solid var(--border)}
.phdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;padding-bottom:12px;border-bottom:2px solid var(--g3)}
.phdr-t{font-family:"Playfair Display",serif;font-size:20px;color:var(--text);display:flex;align-items:center;gap:8px}
.phdr-t::before{content:"";display:block;width:4px;height:20px;background:var(--g);border-radius:2px}
.ptabs{display:flex}
.ptab{background:transparent;border:1px solid var(--border);color:var(--text3);padding:5px 12px;font-size:10px;cursor:pointer;transition:all .2s;font-weight:500}
.ptab.on,.ptab:hover{background:var(--g);color:#fff;border-color:var(--g)}
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.pcard{background:#fff;border:1.5px solid var(--border);cursor:pointer;transition:all .28s;overflow:hidden}
.pcard:hover{border-color:var(--g2);transform:translateY(-4px);box-shadow:0 8px 24px rgba(90,158,58,.14)}
.pcard:hover .pc-em{transform:scale(1.1) rotate(-5deg)}
.pcimg{height:175px;background:var(--g3);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;flex-shrink:0}
.pcimg img{width:100%;height:100%;object-fit:contain;display:block;transition:transform .35s}
.pc-em{font-size:70px;transition:transform .35s;line-height:1}
.pcbdg{position:absolute;top:0;left:0;font-size:9px;font-weight:700;padding:3px 8px;text-transform:uppercase}
.bdg-l{background:var(--g);color:#fff}.bdg-n{background:var(--red);color:#fff}
.bdg-r{background:#7b1fa2;color:#fff}.bdg-h{background:#e65100;color:#fff}
.pcbody{padding:12px 14px}
.pcorg{font-size:9px;letter-spacing:1px;text-transform:uppercase;color:var(--text3);margin-bottom:3px}
.pcnm{font-family:"Playfair Display",serif;font-size:14px;font-weight:600;margin-bottom:4px;line-height:1.3;color:var(--text)}
.pcst{color:#f9a825;font-size:10px;margin-bottom:8px}
.pcft{display:flex;align-items:center;justify-content:space-between}
.pcpr{font-family:"Playfair Display",serif;font-size:17px;color:var(--g);font-weight:700}
.pcun{font-size:9px;color:var(--text3);margin-top:1px}
.pcadd{width:30px;height:30px;background:transparent;border:1.5px solid var(--border2);color:var(--g);font-size:18px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s;cursor:pointer}
.pcadd:hover{background:var(--g);color:#fff;border-color:var(--g)}

/* PROMO STRIP */
.promo-s{background:linear-gradient(135deg,#1a3a0d,#2d5a1a);padding:24px 28px;display:flex;align-items:center;justify-content:space-between}
.promo-l .pt{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:5px}
.promo-l .ph{font-family:"Playfair Display",serif;font-size:24px;color:#fff;margin-bottom:3px}
.promo-l .ps{font-size:11px;color:rgba(255,255,255,.6)}
.promo-m{font-size:56px}.promo-r{text-align:right}
.promo-d{font-family:"Playfair Display",serif;font-size:48px;color:#e8c97a;line-height:1;font-weight:700}
.promo-dl{font-size:10px;color:rgba(255,255,255,.5);letter-spacing:1px;text-transform:uppercase;margin-bottom:10px}

/* BENEFITS */
.bens{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border)}
.ben{background:#fff;padding:22px 16px;text-align:center;transition:background .2s}
.ben:hover{background:var(--g3)}
.ben-ic{width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 12px;font-size:24px;border:1.5px solid}
.ben-t{font-size:12px;font-weight:700;color:var(--text);margin-bottom:5px}
.ben-d{font-size:11px;color:var(--text3);line-height:1.6}

/* HOW IT WORKS */
.hiw{padding:32px 24px;background:#fff;border-top:1px solid var(--border)}
.sec-hdr{display:flex;align-items:center;gap:9px;margin-bottom:24px;font-family:"Playfair Display",serif;font-size:20px;color:var(--text)}
.sec-hdr::before{content:"";display:block;width:4px;height:20px;background:var(--g);border-radius:2px}
.hiw-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;position:relative}
.hiw-line{position:absolute;top:32px;left:15%;right:15%;height:1px;background:repeating-linear-gradient(90deg,var(--g) 0,var(--g) 6px,transparent 6px,transparent 14px);opacity:.3}
.hiw-step{text-align:center;position:relative}
.hiw-num{position:absolute;top:-6px;right:calc(50% - 38px);width:18px;height:18px;background:var(--g);border-radius:50%;font-size:9px;font-weight:700;color:#fff;display:flex;align-items:center;justify-content:center}
.hiw-ic{width:64px;height:64px;background:linear-gradient(135deg,#1a3a0d,var(--g));border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 12px;font-size:24px;box-shadow:0 4px 14px rgba(90,158,58,.3)}
.hiw-t{font-size:12px;font-weight:700;color:var(--text);margin-bottom:4px}
.hiw-d{font-size:11px;color:var(--text3);line-height:1.5}

/* VARIETIES */
.vars-wrap{background:linear-gradient(135deg,#1a3a0d,#2d5a1a)}
.vars{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.1)}
.var{padding:28px 20px;text-align:center;cursor:pointer;border-right:1px solid rgba(255,255,255,.12);transition:background .25s;position:relative;overflow:hidden}
.var:last-child{border-right:none}.var:hover{background:rgba(255,255,255,.08)}
.var-em{font-size:72px;margin-bottom:10px;display:block;filter:drop-shadow(0 4px 12px rgba(0,0,0,.3))}
.var-orig{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:6px}
.var-name{font-family:"Playfair Display",serif;font-size:18px;color:#fff;margin-bottom:7px;font-weight:600}
.var-desc{font-size:11px;color:rgba(255,255,255,.6);line-height:1.6;margin-bottom:12px}
.var-price{font-family:"Playfair Display",serif;font-size:22px;color:#e8c97a;font-weight:700}
.var-bdg{position:absolute;top:10px;right:10px;background:var(--red);color:#fff;font-size:8px;font-weight:700;padding:3px 8px}
.vars-btn-wrap{padding:18px;text-align:center;background:linear-gradient(135deg,#1a3a0d,#2d5a1a)}
.btn-ghost{background:transparent;border:1px solid rgba(255,255,255,.35);color:rgba(255,255,255,.8);padding:10px 28px;font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;font-family:"Inter",sans-serif;transition:all .2s}
.btn-ghost:hover{border-color:#e8c97a;color:#e8c97a}

/* NUT + FARM */
.nutfarm{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border)}
.nut-p{background:#fff;padding:28px 24px}
.farm-p{background:#fff;padding:28px 24px}
.nt{width:100%;border-collapse:collapse;margin-top:14px}
.nt th{background:var(--g3);padding:9px 13px;font-size:10px;font-weight:700;letter-spacing:.5px;color:var(--g);text-align:left;border-bottom:1px solid var(--border)}
.nt td{padding:8px 13px;font-size:11px;border-bottom:1px solid var(--border)}
.nt tr:last-child td{border-bottom:none}.nt tr:nth-child(even) td{background:var(--g3)}
.nt-val{font-weight:700;color:var(--g)}
.farm-box{background:linear-gradient(135deg,#1a3a0d,#2d5a1a);padding:22px;margin-top:14px}
.farm-city{font-family:"Playfair Display",serif;font-size:36px;color:#e8c97a;line-height:1;margin-bottom:3px}
.farm-sub{font-size:9px;letter-spacing:3px;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:14px}
.farm-facts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ff{border-top:1px solid rgba(255,255,255,.15);padding-top:9px}
.ff-t{font-size:11px;font-weight:600;color:#fff;margin-bottom:2px}
.ff-d{font-size:10px;color:rgba(255,255,255,.4)}

/* SHOP PAGE */
.shop-wrap{display:grid;grid-template-columns:210px 1fr;gap:1px;background:var(--border)}
.shop-main{background:#fff;padding:22px}
.shop-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;padding-bottom:12px;border-bottom:2px solid var(--g3)}

/* PAGE HERO */
.phero{background:linear-gradient(135deg,#1a3a0d,var(--g));padding:48px 40px;text-align:center}
.phero h1{font-family:"Playfair Display",serif;font-size:42px;font-weight:700;color:#fff;margin-bottom:10px}
.phero h1 em{color:#e8c97a;font-style:italic}
.phero p{font-size:12px;color:rgba(255,255,255,.75);max-width:500px;margin:0 auto;line-height:1.8}

/* ABOUT */
.about-g{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border)}
.about-img{background:linear-gradient(135deg,#1a3a0d,var(--g));display:flex;align-items:center;justify-content:center;min-height:320px}
.about-txt{background:#fff;padding:40px}
.about-tag{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--g);margin-bottom:8px;display:flex;align-items:center;gap:7px}
.about-tag::before{content:"";display:block;width:14px;height:1.5px;background:var(--g)}
.about-h{font-family:"Playfair Display",serif;font-size:30px;font-weight:700;margin-bottom:12px;line-height:1.2;color:var(--text)}
.about-h em{color:var(--g);font-style:italic}
.about-p{font-size:12px;color:var(--text2);line-height:1.9;margin-bottom:10px}
.anums{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);margin-top:20px}
.anum{background:#fff;padding:16px;border-right:1px solid var(--border);border-bottom:1px solid var(--border)}
.anum:nth-child(2n){border-right:none}.anum:nth-child(3),.anum:nth-child(4){border-bottom:none}
.anum-n{font-family:"Playfair Display",serif;font-size:28px;color:var(--g);line-height:1}
.anum-l{font-size:9px;color:var(--text3);letter-spacing:1px;text-transform:uppercase;margin-top:3px}
.vals-sec{padding:36px 40px;background:#fff;border-top:1px solid var(--border)}
.val-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);margin-top:20px}
.val-card{background:#fff;padding:22px 18px;border-right:1px solid var(--border);transition:background .2s}
.val-card:last-child{border-right:none}.val-card:hover{background:var(--g3)}
.val-ic{font-size:26px;margin-bottom:10px}.val-t{font-size:12px;font-weight:700;margin-bottom:5px;color:var(--text)}
.val-d{font-size:11px;color:var(--text3);line-height:1.6}
.team-sec{padding:0 40px 36px;background:#fff;border-top:1px solid var(--border)}
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);margin-top:20px}
.team-card{background:#fff;padding:24px 20px;text-align:center;border-right:1px solid var(--border);transition:background .2s}
.team-card:last-child{border-right:none}.team-card:hover{background:var(--g3)}
.team-av{width:52px;height:52px;background:var(--g3);border:1.5px solid var(--border2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:"Playfair Display",serif;font-size:18px;color:var(--g);margin:0 auto 12px}
.team-name{font-size:13px;font-weight:600;margin-bottom:3px;color:var(--text)}.team-role{font-size:10px;color:var(--text3)}

/* CONTACT */
.cnt-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:1px;background:var(--border)}
.cnt-info{background:#fff;padding:32px}.cnt-form{background:#fff;padding:32px}
.ci-it{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--border)}
.ci-it:last-child{border:none}
.ci-ic{width:36px;height:36px;background:var(--g3);border:1px solid var(--border2);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}
.ci-t{font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--g);margin-bottom:3px}
.ci-d{font-size:12px;color:var(--text2);line-height:1.6}

/* FORMS */
.fg{display:flex;flex-direction:column;gap:5px;margin-bottom:14px}
.fg label{font-size:10px;letter-spacing:.8px;text-transform:uppercase;color:var(--text3)}
.fg label span{color:var(--red)}
.fg input,.fg select,.fg textarea{background:var(--gl);border:1.5px solid var(--border);padding:9px 12px;font-size:12px;color:var(--text);outline:none;transition:border-color .2s;width:100%}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--g);background:#fff}
.fg select option{background:#fff;color:var(--text)}
.fg-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.btn-g{background:var(--g);color:#fff;border:none;padding:11px 22px;font-size:11px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;cursor:pointer;transition:all .2s;border-radius:3px}
.btn-g:hover{background:var(--g2)}.btn-g.full{width:100%}
.btn-out{background:transparent;color:var(--g);border:1.5px solid var(--g);padding:10px 20px;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s;border-radius:3px}
.btn-out:hover{background:var(--g3)}

/* AUTH */
.auth-wrap{min-height:calc(100vh - 118px);display:flex;align-items:center;justify-content:center;background:var(--bg);padding:40px}
.auth-box{width:min(400px,96%);background:#fff;border:1.5px solid var(--border);border-radius:6px;overflow:hidden;box-shadow:var(--shadow)}
.auth-hd{background:linear-gradient(135deg,#1a3a0d,var(--g));padding:28px;text-align:center}
.auth-hd-ic{font-size:32px;margin-bottom:10px}
.auth-hd h2{font-family:"Playfair Display",serif;font-size:24px;color:#fff;margin-bottom:4px}
.auth-hd p{font-size:11px;color:rgba(255,255,255,.7)}
.auth-body{padding:28px}
.auth-sw{text-align:center;margin-top:16px;font-size:12px;color:var(--text3)}
.auth-sw a{color:var(--g);cursor:pointer}
.sec-bdg{display:flex;align-items:center;gap:7px;border:1px solid var(--border2);background:var(--g3);padding:8px 12px;font-size:10px;color:var(--g);margin-bottom:16px;border-radius:3px}
.err-msg{font-size:12px;color:#dc2626;min-height:14px;margin-bottom:8px;padding:10px 12px;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;display:none;text-align:center;font-weight:500}
.err-msg:not(:empty){display:block;animation:shake .4s ease}
.pw-bar{height:2px;margin-top:5px;transition:all .3s;background:var(--border)}
.pw-bar.s1{background:var(--red2);width:25%}.pw-bar.s2{background:#ffa000;width:50%}
.pw-bar.s3{background:#7cb342;width:75%}.pw-bar.s4{background:var(--g);width:100%}
.pw-txt{font-size:10px;color:var(--text3);margin-top:3px}
.rate-msg{background:rgba(200,16,46,.06);border:1px solid rgba(200,16,46,.2);padding:8px 12px;font-size:11px;color:var(--red);margin-bottom:12px;display:none;border-radius:3px}
.rate-msg.on{display:block}
.eye-btn{position:absolute;right:10px;bottom:9px;background:none;border:none;cursor:pointer;color:var(--text3);font-size:14px}
.eye-btn:hover{color:var(--g)}

/* ACCOUNT */
.acc-wrap{display:grid;grid-template-columns:210px 1fr;gap:1px;background:var(--border);min-height:calc(100vh - 118px)}
.acc-sb{background:#fff;display:flex;flex-direction:column}
.acc-user{background:linear-gradient(135deg,#1a3a0d,var(--g));padding:22px 16px}
.acc-av{width:44px;height:44px;border:1.5px solid rgba(255,255,255,.3);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:"Playfair Display",serif;font-size:16px;color:#e8c97a;margin-bottom:8px}
.acc-nm{font-size:13px;font-weight:600;color:#fff;margin-bottom:2px}
.acc-em{font-size:10px;color:rgba(255,255,255,.6)}
.acc-mit{display:flex;align-items:center;gap:9px;padding:11px 16px;border-bottom:1px solid var(--border);cursor:pointer;font-size:12px;color:var(--text2);transition:all .2s}
.acc-mit:hover,.acc-mit.on{background:var(--g3);color:var(--g)}
.acc-logout{display:flex;align-items:center;gap:8px;padding:11px 16px;cursor:pointer;font-size:12px;color:var(--text3);transition:color .2s;margin-top:auto}
.acc-logout:hover{color:var(--red)}
.acc-content{background:#fff;padding:28px}
.acc-sec{display:none}.acc-sec.on{display:block}
.acc-t{font-family:"Playfair Display",serif;font-size:20px;color:var(--text);margin-bottom:18px;display:flex;align-items:center;gap:8px}
.acc-t::before{content:"";display:block;width:4px;height:20px;background:var(--g);border-radius:2px}
.ocard{background:var(--bg3);border:1px solid var(--border);margin-bottom:10px;border-radius:3px;transition:border-color .2s}
.ocard:hover{border-color:var(--border2)}
.ohd{padding:12px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.ono{font-size:12px;font-weight:600;color:var(--g)}.odt{font-size:10px;color:var(--text3);margin-top:2px}
.otot{font-family:"Playfair Display",serif;font-size:16px;color:var(--g)}
.obody{padding:10px 16px;display:flex;flex-wrap:wrap;gap:5px}
.oit{background:#fff;border:1px solid var(--border);padding:3px 9px;font-size:10px;color:var(--text2);border-radius:2px}
.sp{font-size:9px;font-weight:700;padding:3px 8px;border-radius:2px}
.sp-p{background:rgba(255,160,0,.1);color:#e65100;border:1px solid rgba(255,160,0,.2)}
.sp-pr{background:rgba(33,150,243,.1);color:#1565c0;border:1px solid rgba(33,150,243,.2)}
.sp-sh{background:rgba(90,158,58,.1);color:var(--g);border:1px solid rgba(90,158,58,.2)}
.sp-d{background:rgba(90,158,58,.1);color:var(--g);border:1px solid var(--border2)}
.sp-c{background:rgba(200,16,46,.08);color:var(--red);border:1px solid rgba(200,16,46,.2)}

/* CART PANEL */
#cart-panel{position:fixed;top:0;right:-370px;width:360px;height:100vh;background:#fff;z-index:600;border-left:1.5px solid var(--border);transition:right .4s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;box-shadow:-4px 0 20px rgba(90,158,58,.1)}
#cart-panel.on{right:0}
.cp-hd{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.cp-hd-t{font-family:"Playfair Display",serif;font-size:18px;color:var(--text)}
.cp-x{background:none;border:1px solid var(--border);color:var(--text3);width:28px;height:28px;font-size:13px;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:4px;transition:all .2s}
.cp-x:hover{border-color:var(--g);color:var(--g)}
.cp-items{flex:1;overflow-y:auto;padding:14px 20px}
.cp-empty{text-align:center;padding:48px 0;color:var(--text3)}
.cp-empty div{font-size:40px;margin-bottom:8px}.cp-empty p{font-size:11px}
.ci-row{display:flex;gap:10px;padding:12px 0;border-bottom:1px solid var(--border);align-items:center}
.ci-em{width:44px;height:44px;background:var(--g3);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0;border-radius:4px}
.ci-inf{flex:1}.ci-n{font-size:12px;font-weight:500;color:var(--text)}
.ci-p{font-size:11px;color:var(--g);margin-top:2px;font-family:"Playfair Display",serif}
.ci-qty{display:flex;align-items:center;gap:7px;margin-top:6px}
.ci-qb{width:20px;height:20px;background:transparent;border:1px solid var(--border);color:var(--text);font-size:12px;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:3px;transition:all .2s}
.ci-qb:hover{border-color:var(--g);color:var(--g)}
.ci-qn{font-size:12px;font-weight:500;min-width:14px;text-align:center;color:var(--text)}
.ci-del{background:none;border:none;color:var(--text3);font-size:13px;cursor:pointer;transition:color .2s}
.ci-del:hover{color:var(--red)}
.cp-foot{padding:14px 20px;border-top:1px solid var(--border);flex-shrink:0;background:var(--bg3)}
.cp-sum{background:#fff;border:1px solid var(--border);padding:12px;margin-bottom:12px;border-radius:3px}
.cp-sr{display:flex;justify-content:space-between;font-size:11px;color:var(--text3);margin-bottom:5px}
.cp-sr.tot{border-top:1px solid var(--border);padding-top:9px;margin-top:7px;font-weight:600;color:var(--text);font-size:12px}
.cp-sr.tot span:last-child{font-family:"Playfair Display",serif;font-size:16px;color:var(--g)}
.sec-line{font-size:9px;color:var(--text3);text-align:center;margin-top:9px;letter-spacing:.8px;text-transform:uppercase}

/* OVERLAY + TOAST */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:450;opacity:0;pointer-events:none;transition:opacity .3s}
.overlay.on{opacity:1;pointer-events:all}
.toast{position:fixed;bottom:22px;right:22px;background:#fff;border-left:3px solid var(--g);border:1.5px solid var(--border);border-left-width:3px;color:var(--text);padding:10px 16px;font-size:11px;opacity:0;transform:translateX(16px);transition:all .3s;z-index:9999;pointer-events:none;max-width:270px;border-radius:4px;box-shadow:var(--shadow)}
.toast.on{opacity:1;transform:translateX(0)}.toast.tok{border-left-color:var(--g)}.toast.twarn{border-left-color:var(--red)}

/* CHECKOUT */
#chk-modal{position:fixed;inset:0;z-index:700;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.65);backdrop-filter:blur(5px)}
#chk-modal.on{display:flex}
.chk{background:#fff;border:1.5px solid var(--border);width:min(860px,97vw);max-height:93vh;overflow:hidden;display:flex;flex-direction:column;border-radius:6px;box-shadow:0 16px 48px rgba(0,0,0,.2)}
.chk-steps{display:flex;background:var(--g3);border-bottom:1px solid var(--border);flex-shrink:0}
.chk-st{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;padding:13px;font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--text3);border-bottom:2px solid transparent;transition:all .3s}
.chk-st.on{color:var(--g);border-color:var(--g)}.chk-st.done{color:var(--g2);border-color:var(--g2)}
.chk-st-n{width:19px;height:19px;border:1.5px solid currentColor;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;border-radius:50%}
.chk-body{flex:1;overflow-y:auto;padding:24px;display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.chk-body.full{grid-template-columns:1fr}
.chk-sec-t{font-family:"Playfair Display",serif;font-size:20px;margin-bottom:18px;color:var(--text);display:flex;align-items:center;gap:8px}
.chk-sec-t::before{content:"";display:block;width:4px;height:20px;background:var(--g);border-radius:2px}
.chk-sum{background:var(--bg3);border:1px solid var(--border);padding:18px;position:sticky;top:0;border-radius:3px}
.chk-sum h3{font-family:"Playfair Display",serif;font-size:16px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--border);color:var(--text)}
.chk-its{display:flex;flex-direction:column;gap:8px;margin-bottom:12px;max-height:180px;overflow-y:auto}
.chk-it{display:flex;align-items:center;gap:8px}
.chk-it-em{font-size:18px;width:26px}.chk-it-n{font-size:11px;flex:1;color:var(--text2)}.chk-it-p{font-size:11px;color:var(--g);font-weight:600}
.chk-div{border:none;border-top:1px solid var(--border);margin:10px 0}
.chk-sr{display:flex;justify-content:space-between;font-size:11px;margin-bottom:5px;color:var(--text3)}
.chk-tot{display:flex;justify-content:space-between;font-size:12px;font-weight:600;padding-top:9px;border-top:1px solid var(--border);margin-top:5px;color:var(--text)}
.chk-tot span:last-child{font-family:"Playfair Display",serif;font-size:20px;color:var(--g)}
.chk-foot{padding:14px 24px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;flex-shrink:0;background:var(--bg3)}
.coupon-row{display:flex}.coupon-row input{flex:1;border-right:none}
.btn-coupon{background:var(--g);color:#fff;border:none;padding:0 14px;font-size:10px;font-weight:700;text-transform:uppercase;cursor:pointer}
.coupon-ok{border:1px solid var(--border2);background:var(--g3);padding:7px 11px;font-size:10px;color:var(--g);display:none;align-items:center;gap:6px;margin-top:6px;border-radius:3px}
.coupon-ok.on{display:flex}

/* CREDIT CARD */
.card-vwrap{perspective:1000px;margin-bottom:16px}
.card-vis{width:100%;max-width:320px;height:188px;margin:0 auto;position:relative;transform-style:preserve-3d;transition:transform .7s}
.card-vis.flip{transform:rotateY(180deg)}
.card-face{position:absolute;inset:0;backface-visibility:hidden;display:flex;flex-direction:column;padding:18px 20px;border-radius:8px}
.card-front{background:linear-gradient(135deg,#1a3a0d 0%,#2d5a1a 40%,#1a4a0d 100%);border:1px solid rgba(255,255,255,.15)}
.card-back{background:linear-gradient(135deg,#1a4a0d,#2d5a1a,#1a3a0d);border:1px solid rgba(255,255,255,.15);transform:rotateY(180deg)}
.card-chip{width:30px;height:24px;background:linear-gradient(135deg,#e8c97a,#8a6a20);margin-bottom:14px;border-radius:3px}
.card-num-d{font-size:14px;letter-spacing:2.5px;color:rgba(255,255,255,.9);margin-bottom:10px}
.card-det{display:flex;justify-content:space-between;align-items:flex-end}
.card-lbl{font-size:7px;color:rgba(255,255,255,.4);letter-spacing:1px;text-transform:uppercase;margin-bottom:2px}
.card-val{font-size:10px;font-weight:500;color:#fff}
.card-brand{font-size:15px;font-weight:700;color:#e8c97a;font-style:italic;font-family:"Playfair Display",serif}
.card-stripe{background:rgba(0,0,0,.3);height:36px;margin:20px -20px 10px}
.card-cvv-a{display:flex;align-items:center;gap:10px;padding:0 4px}
.card-cvv-t{flex:1;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);height:30px;display:flex;align-items:center;padding:0 9px;border-radius:3px}
.card-cvv-t span{font-size:12px;color:#fff;letter-spacing:2px}
.card-cvv-l{font-size:8px;color:rgba(255,255,255,.4);letter-spacing:1px;text-transform:uppercase}
.success-sc{text-align:center;padding:40px 32px}
.success-ic{width:68px;height:68px;border:2px solid var(--g2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:30px;margin:0 auto 18px;background:var(--g3)}
.success-t{font-family:"Playfair Display",serif;font-size:30px;color:var(--text);margin-bottom:8px}
.success-sub{font-size:12px;color:var(--text2);line-height:1.8;max-width:360px;margin:0 auto 20px}
.success-no{border:1.5px solid var(--border2);background:var(--g3);padding:16px 24px;display:inline-block;margin-bottom:20px;border-radius:4px}
.sn-l{font-size:8px;letter-spacing:2px;color:var(--text3);text-transform:uppercase;margin-bottom:5px}
.sn-n{font-family:"Playfair Display",serif;font-size:24px;color:var(--g)}

/* ADMIN MODALS */
#adm-login-modal{position:fixed;inset:0;z-index:800;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.82);backdrop-filter:blur(8px)}
#adm-login-modal.on{display:flex}
#adm-modal{position:fixed;inset:0;z-index:700;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.78);backdrop-filter:blur(6px)}
#adm-modal.on{display:flex}
.ap{background:#fff;border:1.5px solid var(--border);width:min(1080px,98vw);max-height:93vh;overflow:hidden;display:flex;flex-direction:column;border-radius:6px;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.apbar{background:linear-gradient(135deg,#1a3a0d,var(--g));padding:0 20px;height:52px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.ap-logo{font-family:"Playfair Display",serif;font-size:15px;color:#e8c97a;letter-spacing:1px}
.aptabs{display:flex;overflow-x:auto}
.atab{background:transparent;border:none;border-bottom:2px solid transparent;color:rgba(255,255,255,.55);padding:0 13px;height:52px;font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:all .2s;white-space:nowrap}
.atab.on{color:#e8c97a;border-color:#e8c97a}.atab:hover:not(.on){color:rgba(255,255,255,.85)}
.ap-x{background:transparent;border:1px solid rgba(255,255,255,.3);color:rgba(255,255,255,.7);width:26px;height:26px;cursor:pointer;font-size:12px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}
.ap-x:hover{border-color:#e8c97a;color:#e8c97a}
.apbody{flex:1;overflow-y:auto;padding:22px}

/* ADMIN PANEL */
.dash-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);margin-bottom:22px}
.dstat{background:var(--bg3);padding:16px;transition:background .2s}.dstat:hover{background:var(--g3)}
.dstat-n{font-family:"Playfair Display",serif;font-size:26px;color:var(--g);line-height:1}
.dstat-l{font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--text3);margin-top:4px}
.ap-sec-t{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--text3);margin:0 0 11px;padding-bottom:7px;border-bottom:1px solid var(--border)}
.ot{width:100%;border-collapse:collapse}
.ot th{text-align:left;padding:8px 11px;font-size:9px;letter-spacing:1px;text-transform:uppercase;color:var(--text3);background:var(--bg3);border-bottom:1px solid var(--border)}
.ot td{padding:9px 11px;font-size:11px;border-bottom:1px solid var(--border);color:var(--text)}
.ot tr:hover td{background:var(--g3)}
.ossel{background:#fff;border:1px solid var(--border);color:var(--text);padding:4px 8px;font-size:10px;outline:none;cursor:pointer;border-radius:3px}
.ossel:focus{border-color:var(--g)}
.btn-dtl{background:transparent;border:1px solid var(--border);color:var(--text3);padding:3px 10px;font-size:9px;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;transition:all .2s;border-radius:3px}
.btn-dtl:hover{border-color:var(--g);color:var(--g)}
.btn-del{background:transparent;border:1px solid var(--border);color:var(--text3);padding:3px 10px;font-size:9px;cursor:pointer;transition:all .2s;border-radius:3px}
.btn-del:hover{border-color:var(--red);color:var(--red)}
#ord-drawer{position:fixed;top:0;right:-460px;width:440px;height:100vh;background:#fff;border-left:1.5px solid var(--border);z-index:750;transition:right .38s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;box-shadow:-4px 0 20px rgba(0,0,0,.12)}
#ord-drawer.on{right:0}
.od-hd{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;background:var(--g3);flex-shrink:0}
.od-title{font-family:"Playfair Display",serif;font-size:16px;color:var(--g)}
.od-body{flex:1;overflow-y:auto;padding:16px 20px}
.od-sec{margin-bottom:18px}
.od-sec-t{font-size:8px;letter-spacing:2px;text-transform:uppercase;color:var(--text3);margin-bottom:9px;padding-bottom:6px;border-bottom:1px solid var(--border)}
.od-row{display:flex;justify-content:space-between;padding:5px 0;border-bottom:1px solid var(--border);font-size:11px;color:var(--text)}
.od-row span:first-child{color:var(--text3)}
.od-it{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--border)}
.od-it:last-child{border:none}
.od-it-em{font-size:18px;width:26px}.od-it-nm{flex:1;font-size:11px;color:var(--text)}.od-it-pr{font-size:12px;color:var(--g);font-family:"Playfair Display",serif}
.card-prev{background:var(--g3);border:1.5px solid var(--border2);padding:11px 14px;margin-bottom:9px;border-radius:3px}
.cp-bank{font-size:8px;letter-spacing:1.5px;color:var(--text3);text-transform:uppercase;margin-bottom:4px}
.cp-num{font-size:13px;color:var(--text);letter-spacing:2px;margin-bottom:5px}
.cp-bot{display:flex;justify-content:space-between;font-size:10px;color:var(--text3)}
.ap-list{display:flex;flex-direction:column;gap:1px;background:var(--border)}
.api-row{background:var(--bg3);padding:10px 13px;display:flex;align-items:center;gap:11px;transition:background .2s}
.api-row:hover{background:var(--g3)}
.api-em{width:38px;height:38px;background:#fff;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;border-radius:4px}
.api-inf{flex:1;min-width:0}.api-nm{font-size:12px;font-weight:500;color:var(--text)}.api-mt{font-size:10px;color:var(--text3);margin-top:1px}
.api-pi{width:70px;background:#fff;border:1px solid var(--border);padding:5px 7px;font-size:12px;color:var(--text);outline:none;border-radius:3px}
.api-pi:focus{border-color:var(--g)}
.api-acts{display:flex;gap:4px}
.bsm{border:1px solid var(--border);background:transparent;padding:4px 9px;font-size:9px;text-transform:uppercase;cursor:pointer;transition:all .2s;color:var(--text3);border-radius:3px}
.bsm:hover{border-color:var(--g);color:var(--g)}.bsm-d:hover{border-color:var(--red);color:var(--red)}
.apform{display:grid;grid-template-columns:1fr 1fr;gap:13px}.apform-full{grid-column:span 2}
.egrid{display:grid;grid-template-columns:repeat(8,1fr);gap:3px;border:1px solid var(--border);padding:6px;background:var(--bg3)}
.epb{background:#fff;border:1px solid var(--border);padding:4px;font-size:16px;cursor:pointer;text-align:center;transition:all .2s;border-radius:3px}
.epb:hover,.epb.on{border-color:var(--g);background:var(--g3);transform:scale(1.1)}
.scard{background:var(--bg3);border:1px solid var(--border);padding:16px;margin-bottom:13px;border-radius:3px}
.scard h3{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--text3);margin-bottom:12px;padding-bottom:7px;border-bottom:1px solid var(--border)}
.srow{display:flex;align-items:center;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--border)}
.srow:last-child{border:none}.srow-l{font-size:11px;color:var(--text)}.srow-d{font-size:10px;color:var(--text3);margin-top:1px}
.sinp{background:#fff;border:1px solid var(--border);padding:5px 8px;font-size:12px;color:var(--text);outline:none;border-radius:3px}
.sinp:focus{border-color:var(--g)}
.empty-st{text-align:center;padding:40px 0;color:var(--text3)}
.empty-st div{font-size:40px;margin-bottom:9px}.empty-st p{font-size:11px;letter-spacing:.8px;text-transform:uppercase}

/* FOOTER */
footer{background:#1a3a0d;color:rgba(255,255,255,.85);padding:44px 40px 22px}
.ftop{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:36px;margin-bottom:36px}
.flogo{font-family:"Playfair Display",serif;font-size:18px;color:#e8c97a;display:block;margin-bottom:9px}
.flogo span{color:rgba(255,255,255,.35)}
.fdesc{font-size:11px;color:rgba(255,255,255,.5);line-height:1.8;max-width:230px}
.fsoc{display:flex;gap:6px;margin-top:14px}
.fsb{width:28px;height:28px;border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:10px;color:rgba(255,255,255,.5);transition:all .2s;border-radius:3px}
.fsb:hover{border-color:#e8c97a;color:#e8c97a}
.fcol h4{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:14px}
.fcol ul{list-style:none}.fcol li{margin-bottom:7px}
.fcol a{color:rgba(255,255,255,.5);font-size:11px;transition:color .2s;cursor:pointer}
.fcol a:hover{color:#e8c97a}
.fbot{border-top:1px solid rgba(255,255,255,.1);padding-top:16px;display:flex;justify-content:space-between;align-items:center}
.fcopy{font-size:10px;color:rgba(255,255,255,.35)}
.fps{display:flex;gap:4px}
.fpb{border:1px solid rgba(255,255,255,.2);padding:2px 7px;font-size:9px;font-weight:600;color:rgba(255,255,255,.4)}

/* RESPONSIVE */
@media(max-width:1024px){
  .home-grid,.shop-wrap,.acc-wrap{grid-template-columns:1fr}
  .rcol{display:none}.pgrid{grid-template-columns:repeat(2,1fr)}
  .ftop{grid-template-columns:1fr 1fr;gap:22px}
  .val-grid,.team-grid,.dash-grid{grid-template-columns:1fr 1fr}
  .about-g,.cnt-grid,.nutfarm{grid-template-columns:1fr}
  .chk-body{grid-template-columns:1fr}
  #ord-drawer{width:100vw;right:-100vw}
  .vals-sec,.team-sec{padding:28px}
  .phero{padding:36px 24px}.phero h1{font-size:32px}
}

/* ═══════════════════════════════
   BLOG & TARİF SAYFASI
   ═══════════════════════════════ */

/* BLOG LİSTESİ */
.blog-hero{background:linear-gradient(135deg,#1a3a0d,var(--g));padding:40px 40px 32px;text-align:center}
.blog-hero h1{font-family:"Playfair Display",serif;font-size:38px;font-weight:700;color:#fff;margin-bottom:8px}
.blog-hero h1 em{color:#e8c97a;font-style:italic}
.blog-hero p{font-size:12px;color:rgba(255,255,255,.7);max-width:480px;margin:0 auto;line-height:1.8}

.blog-wrap{display:grid;grid-template-columns:1fr 300px;gap:1px;background:var(--border);min-height:60vh}
.blog-main{background:var(--bg);padding:28px}
.blog-side{background:#fff;padding:22px;border-left:1px solid var(--border)}

/* BLOG KARTLARİ */
.blog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-bottom:28px}
.bcard{background:#fff;border:1.5px solid var(--border);border-radius:6px;overflow:hidden;cursor:pointer;transition:all .28s}
.bcard:hover{border-color:var(--g2);transform:translateY(-3px);box-shadow:0 8px 24px rgba(90,158,58,.12)}
.bcard:hover .bcard-img-em{transform:scale(1.08)}
.bcard-img{height:160px;background:linear-gradient(135deg,#1a3a0d,var(--g));display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.bcard-img-em{font-size:64px;transition:transform .35s;line-height:1}
.bcard-cat{position:absolute;top:10px;left:10px;background:rgba(0,0,0,.45);color:#e8c97a;font-size:8px;font-weight:700;padding:3px 8px;border-radius:2px;letter-spacing:1px;text-transform:uppercase}
.bcard-body{padding:14px 16px}
.bcard-tag{font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--g);margin-bottom:5px;display:flex;align-items:center;gap:5px}
.bcard-tag::before{content:"";display:block;width:10px;height:1.5px;background:var(--g)}
.bcard-h{font-family:"Playfair Display",serif;font-size:15px;font-weight:600;color:var(--text);line-height:1.3;margin-bottom:6px}
.bcard-p{font-size:11px;color:var(--text3);line-height:1.7;margin-bottom:10px}
.bcard-foot{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:var(--text3);border-top:1px solid var(--border);padding-top:8px;margin-top:6px}
.bcard-foot span{display:flex;align-items:center;gap:4px}

/* BLOG SIDEBAR */
.bside-sec{margin-bottom:22px}
.bside-t{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--text3);margin-bottom:12px;padding-bottom:7px;border-bottom:1px solid var(--border);font-weight:700}
.bside-cat{display:flex;flex-direction:column;gap:0}
.bcatit{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;border-bottom:1px solid var(--border);cursor:pointer;font-size:11px;color:var(--text2);transition:all .2s;border-radius:3px}
.bcatit:hover{background:var(--g3);color:var(--g)}
.bcatit span:last-child{background:var(--g3);color:var(--g);font-size:9px;font-weight:700;padding:2px 6px;border-radius:10px}
.bpop-it{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--border);cursor:pointer;transition:opacity .2s;align-items:flex-start}
.bpop-it:hover{opacity:.75}
.bpop-it:last-child{border-bottom:none}
.bpop-em{width:36px;height:36px;background:var(--g3);border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.bpop-t{font-size:11px;font-weight:500;color:var(--text);line-height:1.4;margin-bottom:2px}
.bpop-d{font-size:9px;color:var(--text3)}

/* BLOG DETAY */
.bdet-wrap{max-width:820px;margin:0 auto;padding:28px}
.bdet-back{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--g);cursor:pointer;margin-bottom:18px;transition:opacity .2s}
.bdet-back:hover{opacity:.7}
.bdet-hero{background:linear-gradient(135deg,#1a3a0d,var(--g));border-radius:8px;height:240px;display:flex;align-items:center;justify-content:center;margin-bottom:24px;position:relative;overflow:hidden}
.bdet-hero-em{font-size:100px;filter:drop-shadow(0 8px 20px rgba(0,0,0,.3));animation:bob 4s ease-in-out infinite}
.bdet-hero-badge{position:absolute;top:14px;left:14px;background:rgba(0,0,0,.4);color:#e8c97a;font-size:9px;font-weight:700;padding:4px 10px;border-radius:2px;letter-spacing:1px;text-transform:uppercase}
.bdet-meta{display:flex;align-items:center;gap:16px;margin-bottom:12px;flex-wrap:wrap}
.bdet-cat{background:var(--g3);color:var(--g);font-size:9px;font-weight:700;padding:3px 9px;border-radius:2px;letter-spacing:1px;text-transform:uppercase}
.bdet-date{font-size:10px;color:var(--text3)}
.bdet-read{font-size:10px;color:var(--text3)}
.bdet-h{font-family:"Playfair Display",serif;font-size:28px;font-weight:700;color:var(--text);line-height:1.2;margin-bottom:16px}
.bdet-lead{font-size:13px;color:var(--text2);line-height:1.9;margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid var(--border);font-style:italic}
.bdet-body h3{font-family:"Playfair Display",serif;font-size:18px;color:var(--text);margin:22px 0 10px;display:flex;align-items:center;gap:8px}
.bdet-body h3::before{content:"";display:block;width:3px;height:18px;background:var(--g);border-radius:2px}
.bdet-body p{font-size:12px;color:var(--text2);line-height:1.9;margin-bottom:14px}
.bdet-body ul{padding-left:0;list-style:none;margin-bottom:14px}
.bdet-body ul li{font-size:12px;color:var(--text2);line-height:1.8;padding-left:18px;position:relative;margin-bottom:4px}
.bdet-body ul li::before{content:"●";position:absolute;left:0;color:var(--g);font-size:8px;top:5px}
.bdet-tip{background:var(--g3);border-left:3px solid var(--g);padding:14px 16px;margin:18px 0;border-radius:0 4px 4px 0}
.bdet-tip p{margin-bottom:0;color:var(--text);font-size:11px}
.bdet-tip strong{color:var(--g)}

/* TARİF KARTI */
.recipe-box{background:#fff;border:1.5px solid var(--border);border-radius:6px;padding:20px;margin:20px 0}
.recipe-box-t{font-family:"Playfair Display",serif;font-size:16px;color:var(--text);margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px}
.recipe-box-t::before{content:"";display:block;width:3px;height:16px;background:var(--g);border-radius:2px}
.recipe-info{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}
.ri{background:var(--g3);padding:10px;text-align:center;border-radius:4px}
.ri-n{font-size:18px;margin-bottom:3px}
.ri-l{font-size:9px;font-weight:700;color:var(--g);letter-spacing:.5px;text-transform:uppercase;margin-bottom:1px}
.ri-v{font-size:11px;color:var(--text2)}
.ingr-list{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-bottom:14px}
.ingr-it{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--text2);padding:5px;border-radius:3px;transition:background .2s}
.ingr-it:hover{background:var(--g3)}
.ingr-it::before{content:"✓";color:var(--g);font-weight:700;font-size:10px;flex-shrink:0}
.steps-list{display:flex;flex-direction:column;gap:10px}
.step-it{display:flex;gap:12px;align-items:flex-start}
.step-n{width:24px;height:24px;background:var(--g);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:#fff;flex-shrink:0;margin-top:1px}
.step-t{font-size:12px;color:var(--text2);line-height:1.7}

/* BLOG ETİKETLER */
.blog-tags{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0}
.btag{background:var(--g3);border:1px solid var(--border2);color:var(--g);font-size:10px;padding:4px 10px;border-radius:20px;cursor:pointer;transition:all .2s}
.btag:hover{background:var(--g);color:#fff}

/* PAYLAŞ */
.share-bar{display:flex;align-items:center;gap:10px;padding:14px 0;border-top:1px solid var(--border);margin-top:18px}
.share-l{font-size:10px;font-weight:700;color:var(--text3);letter-spacing:1px;text-transform:uppercase}
.share-btn{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;cursor:pointer;border:1px solid var(--border);color:var(--text3);transition:all .2s;background:transparent}
.share-btn:hover{border-color:var(--g);color:var(--g)}

/* ═══════════════════════════════
   KULLANICI YORUMLARI & PUANLAMA
   ═══════════════════════════════ */

/* ANA SAYFA YORUM ŞERİDİ */
.reviews-sec{padding:32px 24px;background:#fff;border-top:1px solid var(--border)}
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:20px}
.rcard{background:var(--bg3);border:1.5px solid var(--border);border-radius:6px;padding:18px;transition:all .25s;position:relative}
.rcard:hover{border-color:var(--border2);box-shadow:0 4px 16px rgba(90,158,58,.1)}
.rcard-stars{color:#f9a825;font-size:13px;letter-spacing:2px;margin-bottom:8px}
.rcard-text{font-size:12px;color:var(--text2);line-height:1.8;margin-bottom:12px;font-style:italic}
.rcard-text::before{content:'"';font-family:"Playfair Display",serif;font-size:28px;color:var(--border2);line-height:0;vertical-align:-12px;margin-right:4px}
.rcard-foot{display:flex;align-items:center;justify-content:space-between}
.rcard-user{display:flex;align-items:center;gap:9px}
.rcard-av{width:32px;height:32px;background:linear-gradient(135deg,#1a3a0d,var(--g));border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:"Playfair Display",serif;font-size:12px;color:#e8c97a;font-weight:700;flex-shrink:0}
.rcard-name{font-size:12px;font-weight:600;color:var(--text);line-height:1}
.rcard-city{font-size:9px;color:var(--text3);margin-top:2px}
.rcard-prod{font-size:9px;background:var(--g3);color:var(--g);padding:2px 7px;border-radius:2px;font-weight:600;letter-spacing:.3px}
.rcard-verified{position:absolute;top:12px;right:12px;font-size:9px;color:var(--g);display:flex;align-items:center;gap:3px;font-weight:600}

/* YORUM FORMU */
.review-form-sec{background:linear-gradient(135deg,#1a3a0d,var(--g));padding:32px;margin-top:1px}
.review-form-sec h2{font-family:"Playfair Display",serif;font-size:24px;color:#fff;margin-bottom:6px}
.review-form-sec p{font-size:11px;color:rgba(255,255,255,.65);margin-bottom:20px}
.rf-box{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);padding:22px;border-radius:6px}
.rf-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.rf-field{display:flex;flex-direction:column;gap:5px;margin-bottom:13px}
.rf-field label{font-size:10px;letter-spacing:.8px;text-transform:uppercase;color:rgba(255,255,255,.55)}
.rf-field input,.rf-field select,.rf-field textarea{background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.2);padding:9px 12px;font-size:12px;color:#fff;outline:none;transition:border-color .2s;border-radius:3px;font-family:"Inter",sans-serif}
.rf-field input::placeholder,.rf-field textarea::placeholder{color:rgba(255,255,255,.35)}
.rf-field input:focus,.rf-field select:focus,.rf-field textarea:focus{border-color:rgba(255,255,255,.5)}
.rf-field select option{background:#1a3a0d;color:#fff}
.star-pick{display:flex;gap:6px;margin-bottom:13px}
.star-pick label{font-size:10px;letter-spacing:.8px;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:7px;display:block}
.sp-star{font-size:26px;cursor:pointer;color:rgba(255,255,255,.25);transition:all .2s;line-height:1}
.sp-star:hover,.sp-star.on{color:#f9a825;transform:scale(1.15)}
.btn-review{background:#e8c97a;color:#1a1a00;border:none;padding:11px 28px;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;cursor:pointer;border-radius:3px;transition:all .2s}
.btn-review:hover{background:#ffdd99}
.rv-success{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);padding:14px 18px;border-radius:4px;font-size:12px;color:#fff;display:none;align-items:center;gap:10px;margin-top:12px}
.rv-success.on{display:flex}

/* YORUM PAGİNASYON */
.rvs-filter{display:flex;align-items:center;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.rvs-filter label{font-size:10px;color:var(--text3);font-weight:600;letter-spacing:.5px;text-transform:uppercase}
.rvf-btn{background:transparent;border:1px solid var(--border);color:var(--text3);padding:5px 12px;font-size:10px;cursor:pointer;border-radius:20px;transition:all .2s;font-family:"Inter",sans-serif}
.rvf-btn:hover,.rvf-btn.on{background:var(--g);color:#fff;border-color:var(--g)}
.rv-stats{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;background:var(--g3);border:1px solid var(--border2);padding:18px;border-radius:6px;margin-bottom:18px}
.rv-big-score{font-family:"Playfair Display",serif;font-size:52px;color:var(--g);line-height:1;font-weight:700;text-align:center}
.rv-big-stars{color:#f9a825;font-size:16px;letter-spacing:2px;margin-bottom:3px}
.rv-big-cnt{font-size:11px;color:var(--text3)}
.rv-bars{display:flex;flex-direction:column;gap:5px}
.rv-bar-row{display:flex;align-items:center;gap:8px}
.rv-bar-lbl{font-size:10px;color:var(--text3);width:32px;text-align:right;flex-shrink:0}
.rv-bar-bg{flex:1;height:6px;background:var(--border);border-radius:3px;overflow:hidden}
.rv-bar-fill{height:100%;background:var(--g);border-radius:3px;transition:width .8s ease}
.rv-bar-cnt{font-size:10px;color:var(--text3);width:24px;flex-shrink:0}

/* YORUM SAYFASI TAM */
.rvpage-wrap{background:var(--bg);padding:28px}
.rv-item{background:#fff;border:1.5px solid var(--border);border-radius:6px;padding:18px;margin-bottom:12px;transition:border-color .2s}
.rv-item:hover{border-color:var(--border2)}
.rv-item-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:10px}
.rv-item-user{display:flex;align-items:center;gap:10px}
.rv-item-av{width:38px;height:38px;background:linear-gradient(135deg,#1a3a0d,var(--g));border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:"Playfair Display",serif;font-size:14px;color:#e8c97a;font-weight:700;flex-shrink:0}
.rv-item-name{font-size:13px;font-weight:600;color:var(--text);line-height:1}
.rv-item-city{font-size:10px;color:var(--text3);margin-top:2px}
.rv-item-right{text-align:right}
.rv-item-stars{color:#f9a825;font-size:12px;letter-spacing:1px}
.rv-item-date{font-size:9px;color:var(--text3);margin-top:3px}
.rv-item-prod{display:inline-block;background:var(--g3);color:var(--g);font-size:9px;font-weight:700;padding:2px 8px;border-radius:2px;margin-bottom:8px}
.rv-item-text{font-size:12px;color:var(--text2);line-height:1.8}
.rv-item-helpful{display:flex;align-items:center;gap:10px;margin-top:10px;padding-top:9px;border-top:1px solid var(--border)}
.rv-helpful-l{font-size:10px;color:var(--text3)}
.rv-helpful-btn{background:transparent;border:1px solid var(--border);padding:3px 10px;font-size:9px;color:var(--text3);cursor:pointer;border-radius:20px;transition:all .2s;font-family:"Inter",sans-serif}
.rv-helpful-btn:hover{border-color:var(--g);color:var(--g)}
.rv-helpful-btn.on{background:var(--g3);border-color:var(--g);color:var(--g)}

/* NAVBAR YENİ LİNKLER */
.nit-new{position:relative}
.nit-new::after{content:"YENİ";position:absolute;top:6px;right:0;font-size:7px;font-weight:800;color:var(--red);letter-spacing:.5px;line-height:1}

/* RESİM UPLOAD */
.img-upload-area{border:2px dashed var(--border2);border-radius:6px;padding:20px;text-align:center;cursor:pointer;transition:all .2s;position:relative;background:var(--bg3)}
.img-upload-area:hover{border-color:var(--g);background:var(--g3)}
.img-upload-area.has-img{border-style:solid;border-color:var(--g)}
.img-upload-area input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.img-preview{width:100%;max-height:180px;object-fit:cover;border-radius:4px;display:block;margin-bottom:8px}
.img-upload-icon{font-size:32px;margin-bottom:8px;display:block}
.img-upload-t{font-size:11px;font-weight:600;color:var(--g);margin-bottom:3px}
.img-upload-s{font-size:10px;color:var(--text3)}
.img-current{border:1px solid var(--border2);border-radius:4px;overflow:hidden;margin-bottom:10px;position:relative}
.img-current img{width:100%;height:120px;object-fit:cover;display:block}
.img-current-lbl{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.5);color:#fff;font-size:9px;text-align:center;padding:3px;letter-spacing:.5px;text-transform:uppercase}
.img-del-btn{position:absolute;top:6px;right:6px;background:var(--red);color:#fff;border:none;width:22px;height:22px;border-radius:50%;font-size:11px;cursor:pointer;display:flex;align-items:center;justify-content:center}
/* Ürün kartı — resim tam kapsama (ana tanım yukarıda) */
/* ═══════════════════════════════════════════
   AUTH MODAL — Giriş/Kayıt Modal Sistemi
   Blur backdrop, slide-in animasyon, dropdown
   ═══════════════════════════════════════════ */

/* BACKDROP BLUR OVERLAY */
#auth-modal-wrap {
  position: fixed;
  inset: 0;
  z-index: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  box-sizing: border-box;
  opacity: 0;
  pointer-events: none;
  transition: opacity .35s ease;
}
#auth-modal-wrap.on {
  opacity: 1;
  pointer-events: all;
}
#auth-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(10, 25, 10, 0.55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  cursor: pointer;
}
#auth-modal-box {
  position: relative;
  z-index: 2;
  width: min(460px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  background: #fff;
  border-radius: 16px;
  overflow-y: auto;
  overflow-x: hidden;
  box-shadow: 0 32px 80px rgba(0,0,0,.35);
  transform: translateY(24px) scale(.97);
  transition: transform .4s cubic-bezier(.34,1.56,.64,1), opacity .35s;
  opacity: 0;
  scrollbar-width: none;
}
#auth-modal-box::-webkit-scrollbar { display: none; }
#auth-modal-wrap.on #auth-modal-box {
  transform: translateY(0) scale(1);
  opacity: 1;
}

/* Küçük ekranlar (≤600px) */
@media (max-width: 600px) {
  #auth-modal-wrap {
    align-items: flex-end;
    padding: 0;
  }
  #auth-modal-box {
    width: 100vw;
    max-height: 92vh;
    border-radius: 20px 20px 0 0;
  }
  #auth-modal-wrap.on #auth-modal-box {
    transform: translateY(0) scale(1);
  }
  #auth-modal-wrap #auth-modal-box {
    transform: translateY(100%);
  }
  .am-hd { padding: 24px 20px 18px; }
  .am-body { padding: 18px 20px 24px; }
}

/* Orta ekranlar (601-900px) */
@media (min-width: 601px) and (max-width: 900px) {
  #auth-modal-box {
    width: min(420px, calc(100vw - 40px));
    max-height: calc(100vh - 40px);
  }
}

/* Küçük yükseklik (laptop, 600px altı yükseklik) */
@media (max-height: 650px) {
  #auth-modal-box {
    max-height: calc(100vh - 20px);
    border-radius: 12px;
  }
  .am-hd {
    padding: 18px 24px 14px;
  }
  .am-icon { width: 42px; height: 42px; font-size: 18px; margin-bottom: 8px; }
  .am-hd h2 { font-size: 18px; }
  .am-hd p { font-size: 11px; }
  .am-body { padding: 16px 24px 20px; }
  .am-body .fg { margin-bottom: 10px; }
  .am-body .fg input { padding: 8px 12px; font-size: 12px; }
  .am-btn { padding: 11px; font-size: 12px; }
  .am-sec-note { padding: 6px 10px; font-size: 10px; margin-bottom: 12px; }
}

/* MODAL HEADER */
.am-hd {
  background: linear-gradient(135deg, #1a3a0d 0%, #2d6e1a 60%, #1a4a10 100%);
  padding: 32px 28px 24px;
  position: relative;
  text-align: center;
  overflow: hidden;
}
.am-hd::before {
  content: '';
  position: absolute;
  top: -60px; right: -60px;
  width: 180px; height: 180px;
  background: rgba(255,255,255,.06);
  border-radius: 50%;
}
.am-hd::after {
  content: '';
  position: absolute;
  bottom: -40px; left: -40px;
  width: 120px; height: 120px;
  background: rgba(232,201,122,.08);
  border-radius: 50%;
}
.am-close {
  position: absolute;
  top: 14px; right: 14px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.2);
  color: rgba(255,255,255,.8);
  width: 32px; height: 32px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 14px;
  display: flex; align-items: center; justify-content: center;
  transition: all .2s; z-index: 3;
}
.am-close:hover { background: rgba(255,255,255,.22); color: #fff; }
.am-icon {
  width: 56px; height: 56px;
  background: rgba(255,255,255,.12);
  border: 2px solid rgba(255,255,255,.2);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
  margin: 0 auto 14px;
  position: relative; z-index: 3;
}
.am-hd h2 {
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  color: #fff;
  margin-bottom: 5px;
  position: relative; z-index: 3;
}
.am-hd p {
  font-size: 12px;
  color: rgba(255,255,255,.65);
  position: relative; z-index: 3;
}

/* MODAL SEKME GEÇİŞİ */
.am-tabs {
  display: flex;
  background: #f8fdf5;
  border-bottom: 1px solid var(--border);
}
.am-tab {
  flex: 1;
  padding: 13px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text3);
  cursor: pointer;
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  transition: all .2s;
  font-family: 'Inter', sans-serif;
  letter-spacing: .3px;
}
.am-tab.on {
  color: var(--g);
  border-bottom-color: var(--g);
  background: #fff;
}
.am-tab:hover:not(.on) { color: var(--text); }

/* MODAL BODY */
.am-body { padding: 24px 28px 28px; }
.am-panel { display: none; }
.am-panel.on { display: block; }

/* FORM INPUTS — modal için özel stil */
.am-body .fg label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: var(--text3);
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 6px;
}
.am-body .fg input {
  background: var(--bg3);
  border: 1.5px solid var(--border);
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 13px;
  color: var(--text);
  width: 100%;
  outline: none;
  transition: all .2s;
  font-family: 'Inter', sans-serif;
}
.am-body .fg input:focus {
  border-color: var(--g);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(90,158,58,.12);
}
.am-body .fg { margin-bottom: 14px; }
.am-btn {
  width: 100%;
  background: linear-gradient(135deg, #2d6e1a, var(--g));
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: 13px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .5px;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  transition: all .2s;
  margin-top: 4px;
  box-shadow: 0 4px 16px rgba(90,158,58,.3);
}
.am-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(90,158,58,.4);
}
.am-btn:active { transform: translateY(0); }
.am-divider {
  display: flex; align-items: center; gap: 10px;
  margin: 16px 0;
  font-size: 10px; color: var(--text3); letter-spacing: 1px; text-transform: uppercase;
}
.am-divider::before, .am-divider::after {
  content: ''; flex: 1; height: 1px; background: var(--border);
}
.am-sw { text-align: center; font-size: 12px; color: var(--text3); margin-top: 14px; }
.am-sw a { color: var(--g); cursor: pointer; font-weight: 600; }
.am-sw a:hover { text-decoration: underline; }
.am-sec-note {
  display: flex; align-items: center; gap: 7px;
  background: var(--g3);
  border: 1px solid var(--border2);
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 10px; color: var(--g);
  margin-bottom: 16px;
}

/* USER DROPDOWN */
.usr-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  padding: 6px 10px;
  border: 1.5px solid transparent;
  border-radius: 8px;
  transition: all .2s;
  position: relative;
}
.usr-btn:hover { border-color: var(--border2); background: var(--g3); }
.usr-avatar {
  width: 32px; height: 32px;
  background: linear-gradient(135deg, #1a3a0d, var(--g));
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Playfair Display', serif;
  font-size: 13px;
  color: #e8c97a;
  font-weight: 700;
  flex-shrink: 0;
}
.usr-info { display: flex; flex-direction: column; }
.usr-name { font-size: 12px; font-weight: 600; color: var(--text); line-height: 1.2; }
.usr-role { font-size: 9px; color: var(--text3); line-height: 1; }
.usr-chevron { font-size: 10px; color: var(--text3); transition: transform .2s; }
.usr-btn.open .usr-chevron { transform: rotate(180deg); }

/* DROPDOWN MENU */
.usr-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 200px;
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(0,0,0,.15);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-8px);
  transition: all .25s cubic-bezier(.34,1.56,.64,1);
  z-index: 500;
  overflow: hidden;
}
.usr-btn.open .usr-dropdown {
  opacity: 1;
  pointer-events: all;
  transform: translateY(0);
}
.ud-header {
  padding: 14px 16px;
  background: linear-gradient(135deg, #1a3a0d, var(--g));
  display: flex; align-items: center; gap: 10px;
}
.ud-av {
  width: 36px; height: 36px;
  background: rgba(255,255,255,.15);
  border: 1.5px solid rgba(255,255,255,.25);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Playfair Display', serif;
  font-size: 14px; color: #e8c97a; font-weight: 700;
}
.ud-nm { font-size: 12px; font-weight: 600; color: #fff; }
.ud-em { font-size: 10px; color: rgba(255,255,255,.6); }
.ud-sep { height: 1px; background: var(--border); margin: 4px 0; }
.ud-it {
  display: flex !important; 
  align-items: center !important; 
  gap: 10px !important;
  padding: 10px 16px !important;
  font-size: 13px !important; 
  color: #374151 !important;
  cursor: pointer !important;
  transition: background .15s !important;
  text-decoration: none !important;
  background: transparent !important;
}
.ud-it:hover { background: #fdf2f8 !important; color: #db2777 !important; }
.ud-it-icon { font-size: 16px !important; width: 22px !important; text-align: center !important; flex-shrink: 0 !important; color: inherit !important; }
.ud-logout {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 16px;
  font-size: 13px; color: var(--red);
  cursor: pointer;
  transition: background .15s;
  border-top: 1px solid var(--border);
  margin-top: 4px;
  font-weight: 600;
}
.ud-logout:hover { background: rgba(200,16,46,.06); }

/* Giriş yap butonu (misafir) */
.login-btn-hdr {
  display: flex; align-items: center; gap: 6px;
  background: var(--g);
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 8px 16px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  transition: all .2s;
  white-space: nowrap;
}
.login-btn-hdr:hover { background: var(--g2); transform: translateY(-1px); }
.register-btn-hdr {
  display: flex; align-items: center;
  background: transparent;
  color: var(--g);
  border: 1.5px solid var(--border2);
  border-radius: 8px;
  padding: 7px 14px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  transition: all .2s;
}
.register-btn-hdr:hover { border-color: var(--g); background: var(--g3); }

/* Modal shake animasyonu (hatalı giriş) */
@keyframes shake {
  0%,100% { transform: translateY(0) scale(1); }
  20%      { transform: translateY(0) scale(1) translateX(-6px); }
  40%      { transform: translateY(0) scale(1) translateX(6px); }
  60%      { transform: translateY(0) scale(1) translateX(-4px); }
  80%      { transform: translateY(0) scale(1) translateX(4px); }
}

/* ── AUTH MODAL RESPONSIVE EK ── */
/* Ad/Soyad grid — küçük ekranda alt alta */
@media (max-width: 480px) {
  #am-register [style*="grid-template-columns:1fr 1fr"],
  #am-register .fg-row {
    grid-template-columns: 1fr !important;
  }
  .am-tab { font-size: 11px; padding: 11px 8px; }
  .usr-info { display: none; }
}

/* Genel küçük ekran iyileştirmeleri */
@media (max-width: 768px) {
  .hdr-r .register-btn-hdr { display: none; }
}

/* Modal scroll göstergesi (içerik taşıyorsa) */
#auth-modal-box::after {
  content: '';
  display: block;
  height: 1px;
}

/* ═══════════════════════════════════════
   ÜRÜN KARTI — Hover efektleri
   ═══════════════════════════════════════ */
.pcard { cursor:pointer; }
.pcard:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(90,158,58,.16);
  border-color: var(--g2);
}

/* ÜRÜN DETAY MODAL — Mobil Uyum */
@media (max-width: 640px) {
  #prod-modal-box {
    grid-template-columns: 1fr !important;
    max-height: 95vh;
  }
  #prod-modal-img {
    min-height: 220px !important;
    max-height: 260px;
  }
}


/* ══════════════════════════════════════════════════════════════════
   ANA SAYFA MOBİL RESPONSİVE (768px altı)
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* Ana sayfa grid - tek sütun */
  .home-grid {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  
  /* Sidebar gizle */
  .rcol, .home-grid > .rcol, .sidebar, #home-sidebar {
    display: none !important;
  }
  
  /* Ürün grid - 2 sütun */
  .pgrid, #yeni-pgrid, .product-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  
  /* Section padding */
  .psec, .home-sec {
    padding: 20px 12px !important;
  }
  
  /* Section header */
  .phdr {
    flex-direction: column !important;
    gap: 8px !important;
    text-align: center !important;
  }
  .phdr h2 {
    font-size: 18px !important;
  }
  
  /* Ürün kartları */
  .pcard {
    padding: 10px !important;
  }
  .pcard-em {
    font-size: 40px !important;
    height: 80px !important;
  }
  .pcard h3 {
    font-size: 12px !important;
  }
  .pcard .price {
    font-size: 14px !important;
  }
  
  /* Promo section */
  .promo-s {
    flex-direction: column !important;
    gap: 12px !important;
  }
  
  /* Slider */
  .slider-wrap, .hero-slider {
    height: 200px !important;
  }
  
  /* Sepet panel tam genişlik */
  #cart-panel {
    width: 100vw !important;
    right: -100vw !important;
    border-radius: 0 !important;
  }
  #cart-panel.on {
    right: 0 !important;
  }
  
  /* Overlay tam ekran */
  .overlay, #overlay {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0,0,0,.5) !important;
    z-index: 500 !important;
    display: none !important;
  }
  .overlay.on, #overlay.on {
    display: block !important;
  }
  
  /* Sticky header */
  #sticky-wrap {
    position: sticky;
    top: 0;
    z-index: 100;
  }
  
  /* Header düzeni */
  #header {
    padding: 10px 12px !important;
    gap: 8px !important;
  }
  .logo {
    font-size: 16px !important;
  }
  .srch {
    display: none !important;
  }
  .mob-search-btn {
    display: flex !important;
  }
  
  /* Navbar scroll */
  #navbar {
    overflow-x: auto !important;
    white-space: nowrap !important;
    padding: 0 8px !important;
    gap: 0 !important;
    -webkit-overflow-scrolling: touch;
  }
  #navbar::-webkit-scrollbar {
    display: none;
  }
  .nit {
    padding: 10px 12px !important;
    font-size: 11px !important;
    flex-shrink: 0;
  }
  .nsp {
    display: none !important;
  }
  
  /* Footer */
  .ftop {
    grid-template-columns: 1fr !important;
    text-align: center;
  }
  .fcol {
    text-align: center;
  }
}

/* ══════════════════════════════════════════════════════════════════
   KÜÇÜK MOBİL (480px altı)
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 480px) {
  /* Ürün grid - 2 sütun (daha dar) */
  .pgrid, #yeni-pgrid, .product-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  
  /* Çok küçük ekranlar için tek sütun */
  .pcard-em {
    font-size: 32px !important;
    height: 60px !important;
  }
  .pcard h3 {
    font-size: 11px !important;
  }
  
  /* Topbar gizle */
  #topbar {
    display: none !important;
  }
  
  /* Header ayarları */
  #header {
    padding: 8px 10px !important;
  }
  .logo {
    font-size: 14px !important;
  }
  
  /* Navbar */
  .nit {
    padding: 8px 10px !important;
    font-size: 10px !important;
  }
  
  /* Section padding */
  .psec, .home-sec {
    padding: 16px 10px !important;
  }
}

/* ══════════════════════════════════════════════════════════════════
   TOUCH CİHAZLAR İÇİN İYİLEŞTİRMELER
   ══════════════════════════════════════════════════════════════════ */
@media (hover: none) and (pointer: coarse) {
  /* Hover efektlerini kaldır */
  .pcard:hover,
  .bcard:hover {
    transform: none !important;
    box-shadow: none !important;
  }
  
  /* Daha büyük tıklama alanları */
  .nit {
    min-height: 44px;
    display: flex;
    align-items: center;
  }
  .btn, button {
    min-height: 44px;
  }
}


/* ══════════════════════════════════════════════════════════════════
   MOBİL OVERFLOW FİX - SEPET TAŞMASIN
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
    width: 100% !important;
    position: relative !important;
  }
  
  /* Sepet panel - kesinlikle gizli kalmalı */
  #cart-panel:not(.on) {
    right: -110vw !important;
    visibility: hidden !important;
  }
}
