a {
      text-decoration: none;
      color: inherit;
    }

    img {
      display: block;
      max-width: 100%;
    }

    button {
      cursor: pointer;
      border: none;
      outline: none;
      font-family: var(--font-body);
    }

    /* STAR RATING INPUT */
    .star-rating-input{display:flex;gap:8px;align-items:center;}
    .star-rating-input input{display:none;}
    .star-rating-input label{font-size:32px;color:var(--text3);cursor:pointer;transition:all .2s;user-select:none;padding:4px 8px;border-radius:8px;}
    .star-rating-input label:hover{transform:scale(1.2);background:rgba(251,191,36,0.1);}
    .star-rating-input label:hover ~ label,
    .star-rating-input input:checked ~ label{color:var(--yellow);transform:scale(1.1);}
    .star-rating-input input:checked + label,
    .star-rating-input input:checked + label ~ label{color:var(--yellow);transform:scale(1.1);text-shadow:0 0 8px rgba(251,191,36,0.5);}

    /* REVIEW BUTTON */
    .review-btn{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;padding:10px 20px;border-radius:8px;font-size:14px;font-weight:600;transition:all .3s;box-shadow:0 4px 12px rgba(16,185,129,0.2);}
    .review-btn:hover{background:linear-gradient(135deg,var(--accent2),var(--accent));transform:translateY(-2px);box-shadow:0 6px 16px rgba(16,185,129,0.3);}

    /* REVIEW EDIT BUTTON */
    .review-edit-btn{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,rgba(99,102,241,0.1),rgba(139,92,246,0.1));color:var(--accent);padding:6px 14px;border-radius:6px;font-size:12px;font-weight:600;transition:all .3s;border:1px solid rgba(99,102,241,0.2);margin-left:auto;}
    .review-edit-btn:hover{background:linear-gradient(135deg,rgba(99,102,241,0.2),rgba(139,92,246,0.2));transform:translateY(-1px);box-shadow:0 4px 12px rgba(99,102,241,0.15);}
    .review-edit-btn i{font-size:11px;}

    /* REVIEW MODAL */
    .review-modal{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);z-index:1000;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(4px);}
    .modal-content{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;max-width:500px;box-shadow:0 8px 32px rgba(0,0,0,0.2);animation:modalSlideIn 0.3s ease-out;}
    @keyframes modalSlideIn{from{transform:translateY(-20px);opacity:0;}to{transform:translateY(0);opacity:1;}}
    .modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border);}
    .modal-header h3{font-family:var(--font-head);font-size:20px;font-weight:700;color:var(--text);margin:0;}
    .modal-close{width:36px;height:36px;border-radius:8px;background:var(--bg2);color:var(--text3);display:flex;align-items:center;justify-content:center;transition:all .3s;}
    .modal-close:hover{background:var(--bg3);color:var(--text);}
    .modal-body{padding:24px;}
    .product-name{font-size:16px;color:var(--text2);margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--border);}
    .form-group{margin-bottom:20px;}
    .form-group label{display:block;font-size:14px;font-weight:600;color:var(--text);margin-bottom:8px;}
    .form-group textarea{width:100%;background:var(--bg2);border:2px solid var(--border);border-radius:12px;padding:14px;font-size:14px;color:var(--text);font-family:var(--font-body);resize:vertical;transition:all .3s;}
    .form-group textarea:focus{border-color:var(--accent);background:#fff;box-shadow:0 0 0 4px rgba(16,185,129,0.1);outline:none;}
    .btn-submit{width:100%;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;padding:14px;border-radius:12px;font-size:16px;font-weight:700;transition:all .3s;box-shadow:0 4px 16px rgba(16,185,129,0.3);}
    .btn-submit:hover{background:linear-gradient(135deg,var(--accent2),var(--accent));transform:translateY(-2px);box-shadow:0 6px 24px rgba(16,185,129,0.4);}

    /* ─── TOP BAR ─── */
    

    

    

    

    

    

    

    

    

    

    

    

    /* ─── SECONDARY NAV ─── */
    

    

    

    

    

    

    /* ---- MEGA MENU ---- */
    

    

    

    

    

    

    

    /* ---- RIGHT ALIGNED DROPDOWNS ---- */
    

    

    /* MAIN LAYOUT */
    .main-layout {
      max-width: 1260px;
      margin: 0 auto;
      padding: 28px 24px;
      display: grid;
      grid-template-columns: 1fr 340px;
      gap: 32px;
      align-items: start;
    }

    /* LEFT SIDE */
    .item-title-row {
      margin-bottom: 20px;
    }

    .item-title {
      font-family: var(--font-head);
      font-size: 28px;
      font-weight: 800;
      letter-spacing: -.5px;
      margin-bottom: 10px;
      line-height: 1.2;
    }

    .item-meta-row {
      display: flex;
      align-items: center;
      gap: 16px;
      flex-wrap: wrap;
    }

    .item-author {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 13px;
      color: var(--text2);
    }

    .item-author a {
      color: var(--accent2);
      font-weight: 600;
    }

    .meta-tag {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      font-size: 12px;
      background: rgba(16, 185, 129, 0.08);
      border: 1px solid rgba(16, 185, 129, 0.15);
      color: var(--green);
      padding: 3px 10px;
      border-radius: 100px;
      font-weight: 600;
    }

    .meta-tag.blue {
      background: rgba(16, 185, 129, 0.08);
      border-color: rgba(16, 185, 129, 0.15);
      color: var(--accent);
    }

    .meta-tag.yellow {
      background: rgba(251, 191, 36, 0.1);
      border-color: rgba(251, 191, 36, 0.25);
      color: var(--yellow);
    }

    /* TABS */
    .detail-tabs {
      display: flex;
      border-bottom: 1px solid var(--border);
      margin-bottom: 24px;
    }

    .detail-tab {
      padding: 10px 20px;
      font-size: 13px;
      font-weight: 600;
      color: var(--text3);
      cursor: pointer;
      border-bottom: 2px solid transparent;
      transition: all .2s;
      background: none;
      border-top: none;
      border-left: none;
      border-right: none;
      font-family: var(--font-body);
    }

    .detail-tab.active {
      color: var(--accent);
      border-bottom-color: var(--accent);
    }

    .detail-tab:hover:not(.active) {
      color: var(--text2);
    }

    /* TAB CONTENT */
    .tab-content {
      display: none;
    }

    .tab-content.active {
      display: block;
    }

    /* PREVIEW AREA */
    .preview-main {
      position: relative;
      border-radius: var(--radius-lg);
      overflow: hidden;
      border: 1px solid var(--border);
      background: var(--bg3);
      aspect-ratio: 16/10;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 16px;
    }

    .preview-main .preview-img {
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      background-image: url('https://images.unsplash.com/photo-1560448204-e02f11c3d0e2?w=1200&h=750&fit=crop');
      background-size: cover;
      background-position: center;
    }

    .preview-thumbs {
      display: flex;
      gap: 10px;
      overflow-x: auto;
      padding-bottom: 4px;
    }

    .preview-thumbs .preview-thumb {
      flex-shrink: 0;
      width: 110px;
      height: 68px;
      border-radius: 8px;
      border: 2px solid var(--border);
      overflow: hidden;
      cursor: pointer;
      transition: border-color .2s;
      display: flex;
      align-items: center;
      justify-content: center;
      background: var(--bg3);
      background-size: cover;
      background-position: center;
    }

    .preview-thumb.active,
    .preview-thumb:hover {
      border-color: var(--accent);
    }

    .preview-thumb.t1 {
      background-image: url('https://images.unsplash.com/photo-1467232004584-a241de8bcf5d?w=600&h=400&fit=crop');
    }

    .preview-thumb.t2 {
      background-image: url('https://images.unsplash.com/photo-1559028006-448665bd7c7f?w=600&h=400&fit=crop');
    }

    .preview-thumb.t3 {
      background-image: url('https://images.unsplash.com/photo-1556742049-0cfed4f6a45d?w=600&h=400&fit=crop');
    }

    .preview-thumb.t4 {
      background-image: url('https://images.unsplash.com/photo-1560448204-e02f11c3d0e2?w=600&h=400&fit=crop');
    }

    .preview-thumb.t5 {
      background-image: url('https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=400&fit=crop');
    }

    .preview-btns {
      display: flex;
      gap: 10px;
      margin-top: 14px;
    }

    .preview-btn {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 10px 20px;
      border-radius: 9px;
      font-size: 13px;
      font-weight: 600;
      transition: all .2s;
      border: 1px solid var(--border2);
      background: var(--bg3);
      color: var(--text2);
      font-family: var(--font-body);
    }

    .preview-btn:hover {
      border-color: var(--accent);
      color: var(--accent);
    }

    /* ITEM ACTIONS BAR */
    .actions-bar {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 12px 0;
      border-bottom: 1px solid var(--border);
      margin-bottom: 24px;
    }

    .action-icon-btn {
      width: 36px;
      height: 36px;
      border-radius: 8px;
      border: 1px solid var(--border);
      background: var(--bg3);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 14px;
      color: var(--text3);
      cursor: pointer;
      transition: all .2s;
    }

    .action-icon-btn:hover {
      border-color: var(--accent);
      color: var(--accent);
    }

    /* DESCRIPTION SECTION */
    .desc-section h3 {
      font-family: var(--font-head);
      font-size: 18px;
      font-weight: 700;
      margin-bottom: 14px;
    }

    .desc-section p {
      color: var(--text2);
      font-size: 14px;
      line-height: 1.8;
      margin-bottom: 14px;
    }

    .desc-section ul {
      list-style: none;
      margin-bottom: 20px;
    }

    .desc-section ul li {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      color: var(--text2);
      font-size: 14px;
      padding: 6px 0;
      border-bottom: 1px solid var(--border);
    }

    .desc-section ul li i {
      color: var(--green);
      margin-top: 3px;
      font-size: 12px;
      flex-shrink: 0;
    }

    .features-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
      margin-bottom: 24px;
    }

    .feature-box {
      background: var(--bg3);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 16px;
    }

    .feature-box i {
      font-size: 20px;
      color: var(--accent);
      margin-bottom: 8px;
    }

    .feature-box h4 {
      font-family: var(--font-head);
      font-size: 13px;
      font-weight: 700;
      margin-bottom: 4px;
    }

    .feature-box p {
      font-size: 12px;
      color: var(--text3);
    }

    /* SCREENSHOTS */
    .screenshots-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
      margin-bottom: 24px;
    }

    .screenshot {
      border-radius: 10px;
      overflow: hidden;
      border: 1px solid var(--border);
      aspect-ratio: 16/10;
      display: flex;
      align-items: center;
      justify-content: center;
      background-size: cover;
      background-position: center;
    }

    .s1 {
      background-image: url('https://images.unsplash.com/photo-1467232004584-a241de8bcf5d?w=600&h=400&fit=crop');
    }

    .s2 {
      background-image: url('https://images.unsplash.com/photo-1559028006-448665bd7c7f?w=600&h=400&fit=crop');
    }

    .s3 {
      background-image: url('https://images.unsplash.com/photo-1556742049-0cfed4f6a45d?w=600&h=400&fit=crop');
    }

    .s4 {
      background-image: url('https://images.unsplash.com/photo-1560448204-e02f11c3d0e2?w=600&h=400&fit=crop');
    }

    .s5 {
      background-image: url('https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=400&fit=crop');
    }

    .s6 {
      background-image: url('https://images.unsplash.com/photo-1542744173-8e7e53415bb0?w=600&h=400&fit=crop');
    }

    /* COMMENTS SECTION */
    .review-card {
      background: var(--bg3);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 18px;
      margin-bottom: 12px;
    }

    .review-head {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 10px;
    }

    .review-avatar {
      width: 38px;
      height: 38px;
      border-radius: 50%;
      background: linear-gradient(135deg, var(--accent), var(--pink));
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: var(--font-head);
      font-size: 14px;
      font-weight: 700;
      color: #fff;
      flex-shrink: 0;
    }

    .review-name {
      font-weight: 600;
      font-size: 14px;
    }

    .review-date {
      font-size: 12px;
      color: var(--text3);
    }

    .review-stars {
      display: flex;
      gap: 3px;
      color: var(--yellow);
      font-size: 12px;
      margin-top: 2px;
    }

    .review-text {
      font-size: 13px;
      color: var(--text2);
      line-height: 1.7;
    }

    /* RIGHT SIDEBAR */
    .sidebar {
      position: sticky;
      top: 24px;
    }

    .price-card {
      background: var(--card);
      border: 1px solid var(--border);
      border-radius: var(--radius-lg);
      padding: 24px;
      margin-bottom: 16px;
    }

    .price-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 18px;
    }

    .license-selector {
      display: flex;
      align-items: center;
      gap: 8px;
      background: var(--bg3);
      border: 1px solid var(--border);
      border-radius: 8px;
      padding: 8px 12px;
      font-size: 13px;
      color: var(--text2);
      cursor: pointer;
    }

    .license-selector i {
      color: var(--text3);
      font-size: 11px;
    }

    .price-display {
      text-align: right;
    }

    .price-old {
      font-size: 14px;
      color: var(--text3);
      text-decoration: line-through;
      margin-bottom: 2px;
    }

    .price-new {
      font-family: var(--font-head);
      font-size: 34px;
      font-weight: 800;
      color: var(--text);
      line-height: 1;
    }

    .price-new .currency {
      font-size: 16px;
      font-weight: 600;
      vertical-align: top;
      margin-top: 6px;
      display: inline-block;
    }

    .price-includes {
      list-style: none;
      margin-bottom: 20px;
    }

    .price-includes li {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 13px;
      color: var(--text2);
      padding: 5px 0;
    }

    .price-includes li i {
      color: var(--green);
      font-size: 11px;
    }

    .extend-support {
      background: var(--bg3);
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 14px;
      margin-bottom: 20px;
      display: flex;
      align-items: flex-start;
      gap: 10px;
    }

    .extend-support input[type=checkbox] {
      width: 16px;
      height: 16px;
      margin-top: 2px;
      accent-color: var(--accent);
    }

    .extend-support-text {
      font-size: 13px;
      color: var(--text2);
    }

    .extend-support-text strong {
      color: var(--text);
    }

    .extend-support-text .prices {
      color: var(--text3);
      font-size: 12px;
      margin-top: 2px;
    }

    .qty-row {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 20px;
    }

    .qty-label {
      font-size: 13px;
      color: var(--text2);
    }

    .qty-ctrl {
      display: flex;
      align-items: center;
      gap: 0;
      border: 1px solid var(--border);
      border-radius: 8px;
      overflow: hidden;
    }

    .qty-btn {
      width: 32px;
      height: 32px;
      background: var(--bg3);
      color: var(--text2);
      font-size: 16px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      border: none;
      transition: background .2s;
      font-family: var(--font-body);
    }

    .qty-btn:hover {
      background: var(--bg2);
      color: var(--text);
    }

    .qty-num {
      width: 40px;
      text-align: center;
      font-size: 14px;
      font-weight: 600;
      background: var(--bg3);
      color: var(--text);
      border: none;
      outline: none;
      font-family: var(--font-body);
    }

    .action-buttons {
      display: flex;
      gap: 12px;
      margin-bottom: 8px;
    }

    .add-to-cart-btn {
      flex: 1;
      background: var(--accent);
      color: #fff;
      padding: 14px;
      border-radius: 10px;
      font-size: 15px;
      font-weight: 700;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      transition: all .2s;
      border: none;
      font-family: var(--font-head);
    }

    .add-to-cart-btn:hover {
      background: var(--accent2);
      transform: translateY(-1px);
      box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
    }

    .buy-now-btn {
      flex: 1;
      background: linear-gradient(135deg, #f59e0b, #d97706);
      color: #fff;
      padding: 14px;
      border-radius: 10px;
      font-size: 15px;
      font-weight: 700;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      transition: all .2s;
      border: none;
      font-family: var(--font-head);
    }

    .buy-now-btn:hover {
      background: linear-gradient(135deg, #d97706, #b45309);
      transform: translateY(-1px);
      box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
    }

    .wishlist-btn {
      width: 52px;
      background: var(--bg3);
      border: 1px solid var(--border);
      border-radius: 10px;
      color: var(--text2);
      font-size: 18px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: all .2s;
    }

    .wishlist-btn:hover {
      background: var(--bg2);
      color: var(--pink);
      border-color: var(--pink);
    }

    .wishlist-btn.active {
      background: rgba(244, 114, 182, 0.1);
      color: var(--pink);
      border-color: var(--pink);
    }

    .wishlist-btn.active i {
      font-weight: 900;
    }

    /* Wishlist button when combined with preview-btn */
    .preview-btns .wishlist-btn.preview-btn {
      width: auto !important;
      padding: 10px 20px !important;
      display: inline-flex !important;
      align-items: center;
      gap: 7px;
      position: relative;
      font-size: 13px !important;
    }

    .preview-btns .wishlist-btn.preview-btn i {
      color: var(--text2) !important;
      font-size: 14px !important;
      display: inline-block;
    }

    .preview-btns .wishlist-btn.preview-btn .wishlist-text {
      display: inline-block;
    }

    .preview-btns .wishlist-btn.preview-btn:hover {
      background: var(--accent) !important;
      color: #fff !important;
      border-color: var(--accent) !important;
    }

    .preview-btns .wishlist-btn.preview-btn:hover i {
      color: #fff !important;
    }

    .preview-btns .wishlist-btn.preview-btn.active {
      background: var(--accent) !important;
      color: #fff !important;
      border-color: var(--accent) !important;
    }

    .preview-btns .wishlist-btn.preview-btn.active i {
      color: #fff !important;
    }

    /* Wishlist button on preview-main (always visible) */
    .preview-main {
      position: relative;
    }

    .wishlist-btn-preview {
      position: absolute;
      top: 16px;
      right: 16px;
      width: 44px;
      height: 44px;
      background: rgba(255, 255, 255, 0.95);
      border: 1px solid var(--border);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: all 0.3s ease;
      z-index: 10;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    }

    .wishlist-btn-preview i {
      font-size: 18px;
      color: var(--text2);
      transition: color 0.3s ease;
    }

    .wishlist-btn-preview:hover {
      background: #fff;
      border-color: var(--accent);
      transform: scale(1.1);
    }

    .wishlist-btn-preview:hover i {
      color: var(--accent);
    }

    .wishlist-btn-preview.active {
      background: linear-gradient(135deg, var(--accent), var(--accent2));
      border-color: var(--accent);
    }

    .wishlist-btn-preview.active i {
      color: #fff;
    }

    .wishlist-btn-preview.active:hover {
      transform: scale(1.1);
    }

    .price-note {
      font-size: 11.5px;
      color: var(--text3);
      text-align: center;
    }

    .divider {
      height: 1px;
      background: var(--border);
      margin: 20px 0;
    }

    .author-mini {
      display: flex;
      align-items: center;
      gap: 14px;
      margin-bottom: 16px;
    }

    .author-mini-avatar {
      width: 48px;
      height: 48px;
      border-radius: 50%;
      background: linear-gradient(135deg, var(--accent), var(--pink));
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: var(--font-head);
      font-size: 16px;
      font-weight: 800;
      color: #fff;
      flex-shrink: 0;
    }

    .author-mini-info .elite {
      font-size: 11px;
      background: rgba(251, 191, 36, 0.12);
      border: 1px solid rgba(251, 191, 36, 0.3);
      color: var(--yellow);
      padding: 2px 8px;
      border-radius: 100px;
      margin-bottom: 4px;
      display: inline-block;
    }

    .author-mini-info .name {
      font-family: var(--font-head);
      font-size: 15px;
      font-weight: 700;
    }

    .author-mini-info .items {
      font-size: 12px;
      color: var(--text3);
    }

    .author-badges {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      margin-bottom: 14px;
    }

    .badge-icon {
      width: 28px;
      height: 28px;
      border-radius: 6px;
      background: var(--bg3);
      border: 1px solid var(--border);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 14px;
    }

    .view-portfolio-btn {
      width: 100%;
      padding: 9px;
      border-radius: 8px;
      border: 1px solid var(--border2);
      background: transparent;
      color: var(--text2);
      font-size: 13px;
      font-weight: 600;
      transition: all .2s;
      font-family: var(--font-body);
    }

    .view-portfolio-btn:hover {
      border-color: var(--accent);
      color: var(--accent);
    }

    /* ITEM INFO TABLE */
    .info-table {
      list-style: none;
    }

    .info-table li {
      display: flex;
      padding: 9px 0;
      border-bottom: 1px solid var(--border);
      font-size: 13px;
    }

    .info-table li:last-child {
      border-bottom: none;
    }

    .info-table .key {
      color: var(--text3);
      min-width: 130px;
      flex-shrink: 0;
    }

    .info-table .val {
      color: var(--text2);
      font-weight: 500;
    }

    .info-table .val a {
      color: var(--accent2);
    }

    .info-table .val .tag-list a {
      display: inline-block;
      background: var(--bg3);
      border: 1px solid var(--border);
      border-radius: 100px;
      padding: 2px 10px;
      font-size: 11px;
      color: var(--text3);
      margin: 2px;
      transition: all .2s;
    }

    .info-table .val .tag-list a:hover {
      border-color: var(--accent);
      color: var(--accent2);
    }

    /* TAGS */
    .tags-row {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      margin-top: 20px;
    }

    .tag {
      background: var(--bg3);
      border: 1px solid var(--border);
      color: var(--text3);
      font-size: 12px;
      padding: 4px 12px;
      border-radius: 100px;
      transition: all .2s;
      cursor: pointer;
    }

    .tag:hover {
      border-color: var(--accent);
      color: var(--accent);
    }

    /* RATINGS */
    .ratings-summary {
      display: flex;
      align-items: center;
      gap: 24px;
      background: var(--bg3);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 20px;
      margin-bottom: 20px;
    }

    .rating-big .num {
      font-family: var(--font-head);
      font-size: 52px;
      font-weight: 800;
      line-height: 1;
      color: var(--text);
    }

    .rating-big .stars {
      display: flex;
      gap: 3px;
      color: var(--yellow);
      font-size: 16px;
      margin: 4px 0;
    }

    .rating-big .count {
      font-size: 12px;
      color: var(--text3);
    }

    .rating-bars {
      flex: 1;
    }

    .rating-bar-row {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 5px;
    }

    .rating-bar-row span {
      font-size: 12px;
      color: var(--text3);
      min-width: 10px;
    }

    .rating-bar {
      flex: 1;
      height: 6px;
      background: var(--border);
      border-radius: 100px;
      overflow: hidden;
    }

    .rating-bar-fill {
      height: 100%;
      background: var(--yellow);
      border-radius: 100px;
    }

    .rating-bar-row .cnt {
      font-size: 12px;
      color: var(--text3);
      min-width: 24px;
      text-align: right;
    }

    /* 

    .

    .

    .

    .

    .

    .

    

    

    .

    .

    .

    .

    .

    .

    .

    .

    .

    .

    /* RESPONSIVE */
    @media (max-width:1024px) {
      .main-layout {
        grid-template-columns: 1fr;
      }

      .preview-btns {
        flex-wrap: wrap;
      }

      .preview-btn {
        flex: 1;
        min-width: 140px;
      }

      .
    }

    @media (max-width:768px) {
      

      

      

      .breadcrumb {
        padding: 12px 16px;
      }

      .item-title {
        font-size: 24px;
      }

      .main-layout {
        grid-template-columns: 1fr;
        gap: 32px;
      }

      .detail-tabs {
        flex-wrap: wrap;
      }

      .detail-tab {
        flex: 1;
        min-width: 120px;
      }

      .preview-btns {
        flex-direction: column;
      }

      .preview-btn {
        margin-left: 0 !important;
      }

      .action-buttons {
        flex-direction: column;
      }

      .wishlist-btn {
        width: 100%;
        flex: none;
      }

      .qty-row {
        flex-direction: column;
        align-items: stretch;
      }

      .qty-ctrl {
        justify-content: space-between;
      }

      .author-mini {
        flex-direction: column;
        text-align: center;
      }

      .author-mini-avatar {
        margin: 0 auto;
      }

      .

      .

      .
    }

    @media (max-width:480px) {
      

      

      .breadcrumb {
        padding: 10px 12px;
      }

      .item-title {
        font-size: 20px;
      }

      .preview-thumbs {
        gap: 8px;
      }

      .preview-thumb {
        width: 60px;
        height: 45px;
      }

      .preview-btn {
        font-size: 12px;
        padding: 8px 16px;
      }

      .add-to-cart-btn {
        font-size: 14px;
        padding: 12px;
      }

      .wishlist-btn {
        width: 52px;
        flex: none;
      }

      .action-buttons {
        flex-direction: row;
      }

      .detail-tabs {
        padding: 0 12px;
      }

      .extend-support {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
      }

      
    }