body{margin:0;font-family:Inter,Arial,sans-serif;background:#f8fafc;color:#020617;}
.container{max-width:1200px;margin:auto;padding:40px 20px}
.breadcrumbs{font-size:13px;color:#64748b;margin-bottom:18px;}
.breadcrumbs a{color:#0284c7;text-decoration:none;}
.hero{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;background:#fff;padding:40px;border-radius:24px;box-shadow:0 20px 40px rgba(2,6,23,.08);}
.hero img{width:100%;border-radius:20px}
.badge{background:#0ea5e9;color:#fff;padding:6px 16px;border-radius:999px;display:inline-block;font-weight:600;}
h1{font-size:38px;margin:18px 0}
.price{font-size:34px;color:#0284c7;font-weight:800}
.btn{padding:14px 30px;border-radius:12px;text-decoration:none;display:inline-block;margin-top:20px;margin-right:12px;font-weight:700;cursor:pointer;border:none;}
.btn-primary{background:#0ea5e9;color:#fff}
.btn-outline{border:2px solid #0ea5e9;color:#0284c7;background:#fff}
.specs{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:50px}
.spec{background:#fff;padding:22px;border-radius:18px;text-align:center;box-shadow:0 8px 22px rgba(2,6,23,.06);}
.tabs{margin-top:60px}
.tabs button{background:none;border:none;color:#0284c7;margin-right:20px;font-size:16px;font-weight:800;cursor:pointer;}
.tab-content{margin-top:20px;padding:26px;background:#fff;border-radius:18px;box-shadow:0 8px 22px rgba(2,6,23,.06);}
.gallery{margin-top:50px;display:flex;gap:14px;overflow-x:auto;}
.gallery img{width:140px;border-radius:14px;box-shadow:0 6px 16px rgba(0,0,0,.15);}

/* PDF box */
.pdf-box{display:none;margin-top:14px;background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 8px 22px rgba(2,6,23,.06);}
.pdf-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border-bottom:1px solid #e2e8f0;}
.pdf-title{font-weight:800;color:#0f172a}
.pdf-close{background:#ef4444;color:#fff;border:0;border-radius:10px;padding:10px 14px;cursor:pointer;font-weight:800;}

@media(max-width:900px){
  .hero{grid-template-columns:1fr}
  .specs{grid-template-columns:1fr 1fr}
}

/* RTL via class */
html.rtl body{text-align:right;}
html.rtl .hero{direction:rtl;}
html.rtl .tabs button{margin-right:0;margin-left:20px;}
html.rtl .btn{margin-right:0;margin-left:12px;}




/* ===== Product Page Pro UI ===== */
.container{max-width:1100px;margin:0 auto;padding:22px 16px}
.breadcrumbs{font-size:13px;color:#64748b;margin:6px 0 14px}
.breadcrumbs a{color:#0ea5e9;text-decoration:none}
.breadcrumbs a:hover{text-decoration:underline}

.product-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:18px;align-items:start}
@media(max-width:920px){.product-grid{grid-template-columns:1fr;gap:14px}}

.card{
  background:#fff;border:1px solid #e5e7eb;border-radius:16px;
  box-shadow:0 10px 30px rgba(2,6,23,.06); overflow:hidden;
}
.hero-card{padding:18px}
.hero-top{display:flex;gap:16px;align-items:center}
@media(max-width:920px){.hero-top{flex-direction:column;align-items:stretch}}

.product-media{
  background:linear-gradient(180deg,#f8fafc,#ffffff);
  border:1px solid #e5e7eb;border-radius:14px;
  padding:10px; position:relative;
}
.product-media img{
  width:100%; height:auto; display:block; border-radius:12px;
  aspect-ratio: 16/10; object-fit:contain; background:#fff;
}

.badges{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700;
  border:1px solid #e5e7eb;background:#f8fafc;color:#0f172a
}
.badge-blue{background:#e0f2fe;border-color:#bae6fd;color:#075985}
.badge-green{background:#dcfce7;border-color:#bbf7d0;color:#166534}

.h1{font-size:28px;line-height:1.2;margin:8px 0 10px;color:#0f172a}
@media(max-width:920px){.h1{font-size:24px}}

.meta{display:flex;flex-wrap:wrap;gap:10px;color:#334155;font-size:14px}
.meta strong{color:#0f172a}
.price{
  font-size:28px;font-weight:800;color:#0284c7;margin:12px 0 12px;
  letter-spacing:.3px
}

.cta-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  gap:8px;padding:12px 14px;border-radius:12px;
  font-weight:800;text-decoration:none;border:1px solid transparent;
  cursor:pointer; transition:.15s transform, .15s opacity
}
.btn:hover{transform:translateY(-1px);opacity:.96}
.btn-primary{background:#0284c7;color:#fff}
.btn-secondary{background:#0ea5e9;color:#fff}
.btn-outline{background:#fff;border-color:#cbd5e1;color:#0f172a}

.trust{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px
}
@media(max-width:920px){.trust{grid-template-columns:1fr}}
.trust .item{
  border:1px dashed #cbd5e1;background:#f8fafc;border-radius:12px;
  padding:10px 12px;font-size:13px;color:#334155
}
.trust .item b{display:block;color:#0f172a;margin-bottom:2px}

.section{margin-top:16px}
.section h2{
  font-size:18px;margin:0 0 10px;color:#0f172a
}
.section .content{
  background:#fff;border:1px solid #e5e7eb;border-radius:16px;
  padding:16px; box-shadow:0 10px 30px rgba(2,6,23,.04)
}

.spec-table{width:100%;border-collapse:collapse;font-size:14px}
.spec-table th,.spec-table td{padding:10px 12px;border-bottom:1px solid #eef2f7;text-align:left}
.spec-table th{width:32%;color:#0f172a;background:#f8fafc}
.spec-table td{color:#334155}
@media(max-width:920px){.spec-table th{width:42%}}

.sticky-buy{
  display:none;position:fixed;left:12px;right:12px;bottom:12px;
  background:#ffffff;border:1px solid #e5e7eb;border-radius:16px;
  box-shadow:0 18px 45px rgba(2,6,23,.18);
  padding:10px;z-index:9999;gap:10px;align-items:center
}
.sticky-buy .s-price{font-weight:900;color:#0284c7}
.sticky-buy .s-title{font-size:13px;color:#334155;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:48vw}
.sticky-buy .s-btns{margin-left:auto;display:flex;gap:8px;flex-wrap:nowrap}
@media(max-width:920px){.sticky-buy{display:flex}}