:root{--surface:#fff;--surface2:#f5f6fb;--border:#e8eaf3;--text:#1f2430;--muted:#687083;--accent:#4e00ff;--accent2:#6a1fff;--wa:#25d366;--danger:#dc2626;--shadow:0 14px 34px rgba(31,36,48,.08)}
*{box-sizing:border-box}body{margin:0;font-family:"Plus Jakarta Sans",Arial,sans-serif;background:#f7f8fc;color:var(--text)}a{text-decoration:none;color:inherit}
.container{max-width:1320px;margin:auto;padding:0 26px}
.topbar{background:#1a1d24;color:#d1d5db;font-size:13px;padding:10px 0}.topbar .container{display:flex;justify-content:space-between;align-items:center}.topbar-info{display:flex;gap:28px}.topbar-info span i{color:var(--accent);margin-right:8px}.topbar-social a{margin-left:16px;transition:color .2s}.topbar-social a:hover{color:var(--accent)}
.header{background:var(--surface);border-bottom:1px solid var(--border);padding:22px 0;position:sticky;top:0;z-index:100}.header .container{display:flex;align-items:center;gap:36px}
.logo{font-size:26px;font-weight:800;letter-spacing:-.8px}.logo span{color:var(--accent)}
.search-bar{flex:1;position:relative;max-width:620px}.search-bar i{position:absolute;left:18px;top:50%;transform:translateY(-50%);color:#97a0b3}.search-bar input{width:100%;padding:14px 58px 14px 48px;background:var(--surface2);border:1.5px solid transparent;border-radius:12px;font-size:14px;transition:all .2s}.search-bar input:focus{outline:none;background:#fff;border-color:var(--accent)}
.search-submit{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:#efeaff;color:var(--accent);border:none;border-radius:8px;padding:7px 10px}
.header-actions{display:flex;gap:12px;margin-left:auto;align-items:center}.btn-whatsapp-header{background:var(--wa);color:#fff;padding:12px 20px;border-radius:12px;font-weight:600;font-size:14px;display:inline-flex;align-items:center;gap:10px;transition:all .2s;box-shadow:0 4px 14px rgba(37,211,102,.25)}
.btn-whatsapp-header:hover{background:#1ebe5b;transform:translateY(-1px)}
.nav{background:#fff;border-bottom:1px solid var(--border)}.nav .container{display:flex;gap:4px;overflow:auto}.nav a{padding:16px 20px;border-bottom:2px solid transparent;font-size:14px;font-weight:600;color:#50586d;display:flex;gap:8px;align-items:center;white-space:nowrap;transition:all .2s}.nav a:hover,.nav a.active{color:var(--accent);border-bottom-color:var(--accent)}
.page-hero{margin:28px 0;background:linear-gradient(120deg,#f3edff 0,#e3d7ff 100%);padding:32px;border-radius:20px;box-shadow:var(--shadow)}.page-hero h1{margin:0 0 8px;font-size:38px;letter-spacing:-1px}.page-hero p{margin:0;color:var(--muted)}
.section-title{font-size:30px;font-weight:800;margin:26px 0 16px;letter-spacing:-.6px}
.products-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.product-card{background:#fff;border:1px solid var(--border);border-radius:18px;overflow:hidden;box-shadow:0 6px 20px rgba(22,32,64,.05)}
.product-image{aspect-ratio:1/1;background:#f0f2fa;display:flex;align-items:center;justify-content:center}.product-image img{width:100%;height:100%;object-fit:cover}
.product-body{padding:16px;display:grid;gap:10px}.product-cat{font-size:11px;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.7px}
.product-title{font-weight:700;line-height:1.4}.price{font-size:24px;font-weight:800;color:var(--accent)}.market{font-size:14px;color:#9a3412;text-decoration:line-through}
.stock-pill{padding:9px 12px;font-weight:800;font-size:12px}.ok{background:#dcfce7;color:#166534}.low{background:#fef3c7;color:#92400e}.out{background:#fee2e2;color:#991b1b}
.btn-primary{background:linear-gradient(90deg,var(--accent) 0,var(--accent2) 100%);color:#fff;padding:11px 14px;border-radius:10px;font-weight:700;border:none;cursor:pointer}
.btn-outline{background:#fff;border:1px solid #d8ddeb;color:#46506a;padding:11px 14px;border-radius:10px;font-weight:700;cursor:pointer}
.contracts{display:grid;gap:14px}.contract-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:20px;box-shadow:0 6px 20px rgba(22,32,64,.04)}
.detail-grid{display:grid;grid-template-columns:minmax(300px,480px) 1fr;gap:24px}.detail-side{background:#fff;border:1px solid var(--border);border-radius:18px;padding:26px;box-shadow:0 6px 20px rgba(22,32,64,.05);display:grid;gap:14px}
.btn-buy{width:100%;background:var(--wa);color:#fff;padding:13px;border-radius:10px;font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center;gap:8px}
footer{background:var(--surface);border-top:1px solid var(--border);margin-top:80px;padding:64px 0 0}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:56px;margin-bottom:48px}.footer-col h4{font-size:13px;font-weight:700;margin-bottom:20px;color:var(--text);letter-spacing:1.2px;text-transform:uppercase}.footer-col ul{list-style:none;padding:0}.footer-col li{margin:12px 0;color:#4f576b}.footer-bottom{margin-top:0;border-top:1px solid var(--border);padding:24px 0;text-align:center;color:#6e768a;font-size:13px}
.whatsapp-float{position:fixed;right:22px;bottom:22px;width:60px;height:60px;background:var(--wa);color:#fff;border-radius:50%;font-size:30px;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 24px rgba(37,211,102,.35)}
.footer-social{display:flex;gap:10px;margin-top:18px}
.footer-social a{width:38px;height:38px;border-radius:10px;background:var(--surface2);display:flex;align-items:center;justify-content:center;color:#636b80;transition:all .2s}
.footer-social a:hover{background:var(--accent);color:#fff;transform:translateY(-2px)}
.search-submit{transition:all .2s}
.search-submit:hover{background:var(--accent);color:#fff}

/* sub pages - homepage visual consistency */
.page-hero{position:relative;overflow:hidden;border:1px solid #e6dcff}
.page-hero::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;background:radial-gradient(circle,rgba(78,0,255,.18) 0,rgba(78,0,255,0) 68%);border-radius:50%}
.section-title{letter-spacing:-.8px}
.products-grid .product-card{transition:transform .22s,border-color .22s,box-shadow .22s}
.products-grid .product-card:hover{transform:translateY(-4px);border-color:#d9c8ff;box-shadow:0 14px 30px rgba(50,33,102,.1)}
.muted{color:var(--muted);line-height:1.7}
.empty-state{background:#fff;border:1px solid var(--border);border-radius:18px;padding:44px 26px;text-align:center;display:grid;gap:12px;justify-items:center;box-shadow:0 10px 26px rgba(20,31,64,.05)}
.empty-state i{font-size:30px;color:var(--accent)}
.empty-state h3{font-size:24px;letter-spacing:-.6px}
.empty-state p{color:var(--muted);max-width:560px}

.product-title-detail{font-size:34px;line-height:1.2;font-weight:800;letter-spacing:-1px;color:#171c2a}
.stock-soft{display:flex;align-items:center;gap:10px;border-radius:12px;padding:12px 14px;font-weight:700;font-size:14px;border:1px solid transparent}
.stock-soft .dot{width:10px;height:10px;border-radius:50%}
.stock-soft.ok{background:#edfdf5;color:#0f766e;border-color:#ccfbf1}
.stock-soft.ok .dot{background:#14b8a6;box-shadow:0 0 0 5px rgba(20,184,166,.16)}
.stock-soft.low{background:#fff8e8;color:#b45309;border-color:#fde68a}
.stock-soft.low .dot{background:#f59e0b;box-shadow:0 0 0 5px rgba(245,158,11,.16)}
.stock-soft.out{background:#fff1f2;color:#be123c;border-color:#fecdd3}
.stock-soft.out .dot{background:#f43f5e;box-shadow:0 0 0 5px rgba(244,63,94,.14)}
.btn-whatsapp-detail{justify-content:center;width:100%;padding:14px 16px;border-radius:12px;font-size:15px;font-weight:700}

.contract-card-themed{transition:transform .2s,border-color .2s,box-shadow .2s}
.contract-card-themed:hover{transform:translateY(-3px);border-color:#d9c8ff;box-shadow:0 12px 26px rgba(31,36,48,.08)}
.contract-link{display:flex;justify-content:space-between;align-items:center;gap:12px}
.contract-link-title{font-size:21px;font-weight:800;letter-spacing:-.4px}
.contract-content{padding:28px 26px;line-height:1.75}
.contract-content h1,.contract-content h2,.contract-content h3{margin:14px 0 10px;color:#1c2233}
.contract-content p,.contract-content li{color:#4e5669}

@media(max-width:680px){
  .product-title-detail{font-size:28px}
}

/* admin */
.admin-bg{background:linear-gradient(180deg,#f4f7ff 0,#eef2ff 100%)}
.admin{max-width:1380px;margin:24px auto;padding:0 16px;display:grid;grid-template-columns:280px 1fr;gap:22px}
.admin-nav{background:linear-gradient(180deg,#ffffff 0,#f8f9ff 100%);border:1px solid var(--border);border-radius:20px;padding:18px;position:sticky;top:20px;box-shadow:var(--shadow)}
.admin-nav h3{margin:6px 0 14px;font-size:18px}.admin-nav a{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:12px;color:#4f576b;font-weight:600}.admin-nav a:hover{background:#efeaff;color:var(--accent)}
.admin-main{min-width:0}
.admin-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:16px}
.admin-card{background:#fff;border:1px solid var(--border);border-radius:18px;padding:22px;margin-bottom:18px;box-shadow:0 10px 26px rgba(20,31,64,.06)}
.admin-card h2{margin:0 0 14px}
.admin-form{display:grid;gap:14px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
label{font-size:13px;font-weight:700;color:#5b6479;margin-bottom:6px;display:block}
input,select,textarea{width:100%;padding:12px 13px;border:1px solid #d2d8e8;border-radius:12px;background:#fff;font-family:inherit}
textarea{min-height:120px}
.form-actions{display:flex;gap:10px;flex-wrap:wrap}
button,.btn{background:linear-gradient(90deg,var(--accent) 0,var(--accent2) 100%);color:#fff;border:none;padding:11px 14px;border-radius:11px;cursor:pointer;font-weight:700}
.btn-danger{background:#dc2626}.btn-gray{background:#607089}
.table-wrap{overflow:auto}
table{width:100%;border-collapse:separate;border-spacing:0 10px}th,td{padding:13px 12px;text-align:left;white-space:nowrap}tbody tr{background:#fff}tbody td:first-child{border-radius:10px 0 0 10px}tbody td:last-child{border-radius:0 10px 10px 0}
th{color:#687083;font-size:12px;letter-spacing:.6px;text-transform:uppercase}
.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:14px}
.stat-item{background:linear-gradient(120deg,#f3eeff 0,#ffffff 100%);border:1px solid var(--border);padding:16px;border-radius:14px}
.stat-item strong{font-size:28px;display:block;color:var(--accent)}
.admin-auth{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:linear-gradient(135deg,#ece6ff 0,#f6f8ff 100%)}
.admin-auth .admin-card{width:min(520px,92vw)}
@media(max-width:1024px){.admin{grid-template-columns:1fr}.admin-nav{position:static}.footer-grid{grid-template-columns:repeat(2,1fr)}.detail-grid{grid-template-columns:1fr}.form-row{grid-template-columns:1fr}.products-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.container{padding:0 16px}.topbar-info{display:none}.header .container{flex-wrap:wrap}.search-bar{order:3;flex-basis:100%}.footer-grid{grid-template-columns:1fr}.stat-grid{grid-template-columns:1fr 1fr}.products-grid{grid-template-columns:1fr}}