/* Extracted page-level CSS from ecom/demo14 templates for Gold Commerce dynamic pages. */

/* product_details.php */
.product-details-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .product-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .product-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .product-breadcrumb strong{
    color:var(--heading);
  }

  .product-details-wrap{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
    margin-bottom:18px;
  }

  .product-gallery-card,
  .product-info-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
  }

  .product-gallery-card{
    padding:14px;
  }

  .product-main-image-wrap{
    position:relative;
    border-radius:18px;
    overflow:hidden;
    background:linear-gradient(180deg, var(--surface-2), var(--surface-3));
    border:1px solid var(--border);
    min-height:340px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:12px;
  }

  .product-main-image-wrap img{
    width:100%;
    height:340px;
    object-fit:contain;
  }

  .product-badge-group{
    position:absolute;
    top:12px;
    left:12px;
    display:flex;
    flex-direction:column;
    gap:8px;
    z-index:3;
  }

  .product-detail-badge{
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:11px;
    font-weight:900;
    color:#fff;
    box-shadow:0 8px 18px rgba(0,0,0,.22);
  }

  .product-detail-badge.sale{
    background:linear-gradient(90deg, var(--sale-start), var(--sale-end));
  }

  .product-detail-badge.stock{
    background:linear-gradient(90deg, #0f8f49, #27c26a);
  }

  .product-zoom-btn{
    position:absolute;
    top:12px;
    right:12px;
    width:38px;
    height:38px;
    border:none;
    border-radius:50%;
    background:rgba(0,0,0,.45);
    color:#fff;
    font-size:16px;
    cursor:pointer;
    border:1px solid rgba(255,255,255,.12);
  }

  .product-thumb-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:10px;
  }

  .product-thumb-item{
    border-radius:14px;
    overflow:hidden;
    border:1px solid var(--border);
    background:var(--surface-2);
    padding:6px;
    cursor:pointer;
    transition:var(--transition);
  }

  .product-thumb-item.active{
    border-color:rgba(212,175,55,.42);
    box-shadow:0 0 0 2px rgba(212,175,55,.10);
  }

  .product-thumb-item img{
    width:100%;
    height:72px;
    object-fit:cover;
    border-radius:10px;
  }

  .product-info-card{
    padding:16px;
  }

  .product-title-row{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-bottom:10px;
  }

  .product-title{
    font-size:24px;
    line-height:1.15;
    font-weight:900;
    color:var(--heading);
    margin-bottom:6px;
  }

  .product-subtitle{
    font-size:13px;
    color:var(--muted);
    font-weight:700;
  }

  .product-top-actions{
    display:flex;
    align-items:center;
    gap:8px;
    flex-shrink:0;
  }

  .product-top-btn{
    width:40px;
    height:40px;
    border:none;
    border-radius:50%;
    background:var(--surface-2);
    color:var(--primary);
    border:1px solid var(--border);
    display:grid;
    place-items:center;
    cursor:pointer;
    transition:var(--transition);
  }

  .product-top-btn:hover{
    background:var(--btn-primary-bg);
    color:#fff;
    transform:translateY(-2px);
  }

  .product-rating-row{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:14px;
  }

  .product-stars{
    display:flex;
    align-items:center;
    gap:3px;
    color:#f7c948;
    font-size:14px;
  }

  .product-rating-text{
    font-size:13px;
    color:var(--text-soft);
    font-weight:700;
  }

  .product-meta-inline{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
  }

  .product-meta-pill{
    min-height:30px;
    padding:0 12px;
    border-radius:999px;
    background:var(--surface-2);
    border:1px solid var(--border);
    color:var(--text-soft);
    font-size:12px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .product-price-box{
    display:flex;
    align-items:flex-end;
    flex-wrap:wrap;
    gap:10px 14px;
    margin-bottom:16px;
    padding:14px;
    border-radius:18px;
    background:linear-gradient(135deg, rgba(212,175,55,.10), rgba(255,255,255,.02));
    border:1px solid rgba(212,175,55,.14);
  }

  .product-current-price{
    font-size:30px;
    line-height:1;
    font-weight:900;
    color:var(--primary);
  }

  .product-old-price{
    font-size:16px;
    color:var(--muted-2);
    text-decoration:line-through;
    font-weight:700;
  }

  .product-save{
    min-height:30px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.12);
    border:1px solid rgba(212,175,55,.20);
    color:var(--accent);
    font-size:12px;
    font-weight:900;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .product-short-desc{
    font-size:14px;
    color:var(--text-soft);
    margin-bottom:16px;
  }

  .product-option-block{
    margin-bottom:16px;
  }

  .product-option-title{
    font-size:13px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:10px;
  }

  .product-color-list,
  .product-size-list{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }

  .product-color-swatch{
    width:34px;
    height:34px;
    border-radius:50%;
    border:2px solid transparent;
    cursor:pointer;
    box-shadow:0 6px 14px rgba(0,0,0,.16);
  }

  .product-color-swatch.active{
    border-color:#fff;
    box-shadow:0 0 0 2px rgba(212,175,55,.28);
  }

  .product-size-btn{
    min-width:48px;
    height:38px;
    padding:0 14px;
    border-radius:12px;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text-soft);
    font-size:13px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:var(--transition);
  }

  .product-size-btn.active,
  .product-size-btn:hover{
    background:var(--btn-primary-bg);
    color:#fff;
    border-color:transparent;
  }

  .product-purchase-box{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
    margin-bottom:16px;
  }

  .product-qty-wrap{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:54px;
    padding:8px;
    border-radius:16px;
    background:var(--surface-2);
    border:1px solid var(--border);
  }

  .product-qty-label{
    font-size:13px;
    font-weight:800;
    color:var(--text-soft);
    padding-left:6px;
  }

  .product-qty-box{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:var(--primary-soft);
    border:1px solid var(--primary-border);
    border-radius:999px;
    padding:4px;
  }

  .product-qty-btn{
    width:32px;
    height:32px;
    border:none;
    border-radius:50%;
    background:var(--white);
    color:var(--primary);
    font-size:18px;
    font-weight:800;
    cursor:pointer;
    display:grid;
    place-items:center;
  }

  .product-qty-input{
    width:42px;
    text-align:center;
    background:transparent;
    border:none;
    outline:none;
    color:var(--heading);
    font-size:14px;
    font-weight:900;
  }

  .product-action-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
  }

  .product-btn{
    min-height:50px;
    border:none;
    border-radius:16px;
    font-size:14px;
    font-weight:900;
    cursor:pointer;
    transition:var(--transition);
  }

  .product-btn.primary{
    background:var(--btn-primary-bg);
    color:#fff;
    box-shadow:var(--btn-primary-shadow);
  }

  .product-btn.secondary{
    background:var(--surface-2);
    color:var(--text-soft);
    border:1px solid var(--border);
  }

  .product-btn:hover{
    transform:translateY(-2px);
  }

  .product-extra-info{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }

  .product-extra-card{
    min-height:58px;
    border-radius:16px;
    background:var(--surface-2);
    border:1px solid var(--border);
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 14px;
  }

  .product-extra-icon{
    width:40px;
    height:40px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:18px;
    flex-shrink:0;
  }

  .product-extra-card strong{
    display:block;
    font-size:13px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:3px;
  }

  .product-extra-card span{
    font-size:12px;
    color:var(--text-soft);
    font-weight:700;
  }

  .product-detail-lower{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
    margin-bottom:18px;
  }

  .product-tabs-card,
  .product-side-info-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
  }

  .product-tabs-head{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    padding:14px;
    border-bottom:1px solid var(--border);
  }

  .product-tab-btn{
    min-height:40px;
    padding:0 16px;
    border-radius:999px;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text-soft);
    font-size:13px;
    font-weight:800;
    cursor:pointer;
    transition:var(--transition);
  }

  .product-tab-btn.active{
    background:var(--btn-primary-bg);
    color:#fff;
    border-color:transparent;
  }

  .product-tab-content{
    padding:18px 16px;
  }

  .product-tab-pane{
    display:none;
  }

  .product-tab-pane.active{
    display:block;
  }

  .product-description p,
  .product-description li{
    font-size:14px;
    color:var(--text-soft);
  }

  .product-description p{
    margin-bottom:12px;
  }

  .product-description ul{
    padding-left:18px;
  }

  .product-description li{
    margin-bottom:8px;
  }

  .product-spec-table{
    width:100%;
    border-collapse:collapse;
  }

  .product-spec-table tr{
    border-bottom:1px solid var(--border);
  }

  .product-spec-table tr:last-child{
    border-bottom:none;
  }

  .product-spec-table th,
  .product-spec-table td{
    text-align:left;
    padding:12px 8px;
    font-size:13px;
  }

  .product-spec-table th{
    width:38%;
    color:var(--heading);
    font-weight:900;
  }

  .product-spec-table td{
    color:var(--text-soft);
    font-weight:700;
  }

  .review-list{
    display:flex;
    flex-direction:column;
    gap:14px;
  }

  .review-item{
    border:1px solid var(--border);
    border-radius:16px;
    background:var(--surface-2);
    padding:14px;
  }

  .review-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:8px;
  }

  .review-user{
    display:flex;
    align-items:center;
    gap:10px;
  }

  .review-avatar{
    width:42px;
    height:42px;
    border-radius:50%;
    background:rgba(212,175,55,.12);
    color:var(--primary);
    font-size:16px;
    font-weight:900;
    display:grid;
    place-items:center;
    flex-shrink:0;
  }

  .review-user strong{
    display:block;
    font-size:13px;
    color:var(--heading);
    font-weight:900;
    margin-bottom:3px;
  }

  .review-user span{
    font-size:12px;
    color:var(--muted);
    font-weight:700;
  }

  .review-text{
    font-size:13px;
    color:var(--text-soft);
  }

  .product-side-info-card{
    padding:16px;
  }

  .product-side-title{
    font-size:16px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:14px;
  }

  .info-list{
    display:flex;
    flex-direction:column;
    gap:10px;
    margin-bottom:16px;
  }

  .info-item{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding:12px 0;
    border-bottom:1px solid var(--border);
  }

  .info-item:last-child{
    border-bottom:none;
    padding-bottom:0;
  }

  .info-item span{
    font-size:13px;
    color:var(--muted);
    font-weight:700;
  }

  .info-item strong{
    text-align:right;
    font-size:13px;
    color:var(--heading);
    font-weight:900;
  }

  .product-share{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }

  .product-share a{
    width:40px;
    height:40px;
    border-radius:50%;
    background:var(--surface-2);
    border:1px solid var(--border);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:15px;
    transition:var(--transition);
  }

  .product-share a:hover{
    background:var(--btn-primary-bg);
    color:#fff;
    transform:translateY(-2px);
  }

  .related-products-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
  }

  .related-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:16px 16px 0;
  }

  .related-head h3{
    font-size:18px;
    font-weight:900;
    color:var(--heading);
  }

  .related-head a{
    font-size:13px;
    color:var(--primary);
    font-weight:800;
  }

  .related-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:12px;
    padding:16px;
  }

  .related-grid .product-card{
    min-height:316px;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--surface-2);
    padding:12px 10px 14px;
  }

  .related-grid .product-card:nth-child(2n){
    border-right:1px solid var(--border);
  }

  @media (min-width:768px){
    .product-main-image-wrap{
      min-height:420px;
    }

    .product-main-image-wrap img{
      height:420px;
    }

    .product-action-grid{
      grid-template-columns:1.15fr .85fr;
    }

    .product-extra-info{
      grid-template-columns:repeat(3, 1fr);
    }

    .related-grid{
      grid-template-columns:repeat(3, 1fr);
    }
  }

  @media (min-width:992px){
    .product-details-page{
      padding:22px 0 42px;
    }

    .product-details-wrap{
      grid-template-columns:minmax(0, .95fr) minmax(0, 1.05fr);
      align-items:start;
      gap:18px;
    }

    .product-info-card{
      padding:18px;
    }

    .product-title{
      font-size:30px;
    }

    .product-detail-lower{
      grid-template-columns:minmax(0, 1fr) 320px;
      gap:18px;
    }

    .related-grid{
      grid-template-columns:repeat(4, 1fr);
    }
  }

  @media (min-width:1181px){
    .product-title{
      font-size:34px;
    }

    .related-grid{
      grid-template-columns:repeat(5, 1fr);
    }
  }

/* cart.php */
.cart-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .cart-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .cart-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .cart-breadcrumb strong{
    color:var(--heading);
  }

  .cart-hero{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:18px;
    background:linear-gradient(135deg, rgba(212,175,55,.08), rgba(255,255,255,.02));
    margin-bottom:16px;
    padding:18px 14px;
  }

  .cart-hero::before{
    content:"";
    position:absolute;
    top:-50px;
    right:-30px;
    width:140px;
    height:140px;
    border-radius:50%;
    background:rgba(212,175,55,.05);
    filter:blur(10px);
  }

  .cart-hero-content{
    position:relative;
    z-index:2;
  }

  .cart-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.18);
    color:var(--accent);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:10px;
  }

  .cart-hero-title{
    font-size:22px;
    line-height:1.12;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .cart-hero-text{
    font-size:13px;
    color:var(--text-soft);
    max-width:700px;
  }

  .cart-layout{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
  }

  .cart-main{
    min-width:0;
  }

  .cart-summary-side{
    min-width:0;
  }

  .cart-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
  }

  .cart-card-head{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
  }

  .cart-card-head h2,
  .cart-card-head h3{
    font-size:17px;
    font-weight:900;
    color:var(--heading);
  }

  .cart-card-head a{
    font-size:12px;
    font-weight:800;
    color:var(--primary);
  }

  .cart-table-wrap{
    width:100%;
    overflow-x:auto;
  }

  .cart-table{
    width:100%;
    border-collapse:collapse;
    min-width:760px;
  }

  .cart-table thead th{
    text-align:left;
    font-size:12px;
    font-weight:900;
    color:var(--muted);
    padding:14px 16px;
    background:var(--surface-2);
    border-bottom:1px solid var(--border);
    text-transform:uppercase;
    letter-spacing:.03em;
  }

  .cart-table tbody td{
    padding:16px;
    border-bottom:1px solid var(--border);
    vertical-align:middle;
  }

  .cart-table tbody tr:last-child td{
    border-bottom:none;
  }

  .cart-product{
    display:flex;
    align-items:center;
    gap:14px;
    min-width:220px;
  }

  .cart-product-thumb{
    width:84px;
    height:84px;
    border-radius:16px;
    background:var(--surface-2);
    border:1px solid var(--border);
    display:grid;
    place-items:center;
    overflow:hidden;
    flex-shrink:0;
  }

  .cart-product-thumb img{
    width:74px;
    height:74px;
    object-fit:contain;
  }

  .cart-product-info{
    min-width:0;
  }

  .cart-product-name{
    font-size:14px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:6px;
    line-height:1.3;
  }

  .cart-product-meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
  }

  .cart-meta-pill{
    min-height:26px;
    padding:0 10px;
    border-radius:999px;
    background:var(--surface-2);
    border:1px solid var(--border);
    color:var(--text-soft);
    font-size:11px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .cart-price{
    font-size:15px;
    font-weight:900;
    color:var(--primary);
    white-space:nowrap;
  }

  .cart-old-price{
    display:block;
    font-size:11px;
    color:var(--muted-2);
    text-decoration:line-through;
    margin-top:4px;
    font-weight:700;
  }

  .cart-qty-control{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:var(--primary-soft);
    border:1px solid var(--primary-border);
    border-radius:999px;
    padding:4px;
  }

  .cart-qty-btn{
    width:32px;
    height:32px;
    border:none;
    border-radius:50%;
    background:var(--white);
    color:var(--primary);
    font-size:18px;
    font-weight:800;
    cursor:pointer;
    display:grid;
    place-items:center;
    flex-shrink:0;
  }

  .cart-qty-value{
    min-width:28px;
    text-align:center;
    font-size:13px;
    font-weight:900;
    color:var(--heading);
  }

  .cart-line-total{
    font-size:15px;
    font-weight:900;
    color:var(--accent);
    white-space:nowrap;
  }

  .cart-remove-btn{
    width:38px;
    height:38px;
    border:none;
    border-radius:50%;
    background:var(--surface-2);
    border:1px solid var(--border);
    color:var(--accent);
    cursor:pointer;
    font-size:16px;
    font-weight:900;
    display:grid;
    place-items:center;
    transition:var(--transition);
  }

  .cart-remove-btn:hover{
    background:var(--accent-soft);
    transform:translateY(-2px);
  }

  .cart-bottom-bar{
    padding:14px 16px 16px;
    border-top:1px solid var(--border);
    display:flex;
    flex-direction:column;
    gap:12px;
    background:var(--surface);
  }

  .cart-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }

  .cart-btn{
    min-height:48px;
    border:none;
    border-radius:14px;
    font-size:14px;
    font-weight:900;
    cursor:pointer;
    transition:var(--transition);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    text-align:center;
    padding:0 16px;
  }

  .cart-btn.primary{
    background:var(--btn-primary-bg);
    color:#fff;
    box-shadow:var(--btn-primary-shadow);
  }

  .cart-btn.secondary{
    background:var(--surface-2);
    color:var(--text-soft);
    border:1px solid var(--border);
  }

  .cart-btn:hover{
    transform:translateY(-2px);
  }

  .coupon-card,
  .summary-card,
  .cart-note-card,
  .recommended-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
  }

  .coupon-body,
  .summary-body,
  .cart-note-body{
    padding:16px;
  }

  .coupon-text,
  .cart-note-body p{
    font-size:13px;
    color:var(--text-soft);
    margin-bottom:12px;
  }

  .coupon-form{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }

  .coupon-form input{
    width:100%;
    min-width:0;
    height:48px;
    border-radius:14px;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text);
    font-size:14px;
    padding:0 14px;
    outline:none;
  }

  .coupon-form input::placeholder{
    color:var(--muted-2);
  }

  .summary-body{
    padding-top:14px;
  }

  .summary-list{
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .summary-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    font-size:14px;
    color:var(--text-soft);
    padding-bottom:10px;
    border-bottom:1px dashed var(--border);
  }

  .summary-row:last-child{
    border-bottom:none;
    padding-bottom:0;
  }

  .summary-row strong{
    color:var(--heading);
    font-weight:900;
  }

  .summary-row.total{
    font-size:17px;
    margin-top:4px;
    padding-top:8px;
    border-top:1px solid var(--border);
    border-bottom:none;
  }

  .summary-checkout{
    margin-top:14px;
  }

  .summary-checkout .cart-btn{
    width:100%;
  }

  .secure-points{
    margin-top:14px;
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .secure-point{
    display:flex;
    align-items:flex-start;
    gap:10px;
    font-size:12px;
    color:var(--text-soft);
    font-weight:700;
  }

  .secure-point .icon{
    width:30px;
    height:30px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:14px;
    flex-shrink:0;
  }

  .cart-note-body ul{
    padding-left:18px;
    margin:0;
  }

  .cart-note-body li{
    font-size:13px;
    color:var(--text-soft);
    margin-bottom:8px;
  }

  .recommended-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:16px 16px 0;
  }

  .recommended-head h3{
    font-size:18px;
    font-weight:900;
    color:var(--heading);
  }

  .recommended-head a{
    font-size:13px;
    color:var(--primary);
    font-weight:800;
  }

  .recommended-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:12px;
    padding:16px;
  }

  .recommended-grid .product-card{
    min-height:316px;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--surface-2);
    padding:12px 10px 14px;
  }

  .recommended-grid .product-card:nth-child(2n){
    border-right:1px solid var(--border);
  }

  .cart-empty-state{
    display:none;
    text-align:center;
    padding:34px 20px;
  }

  .cart-empty-icon{
    width:78px;
    height:78px;
    margin:0 auto 14px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    font-size:30px;
    display:grid;
    place-items:center;
  }

  .cart-empty-state h3{
    font-size:22px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .cart-empty-state p{
    font-size:14px;
    color:var(--text-soft);
    max-width:440px;
    margin:0 auto 16px;
  }

  @media (min-width:768px){
    .cart-actions{
      grid-template-columns:1fr 1fr;
    }

    .coupon-form{
      grid-template-columns:1fr auto;
    }

    .coupon-form .cart-btn{
      min-width:150px;
    }

    .recommended-grid{
      grid-template-columns:repeat(3, 1fr);
    }
  }

  @media (min-width:992px){
    .cart-page{
      padding:22px 0 42px;
    }

    .cart-layout{
      grid-template-columns:minmax(0, 1fr) 360px;
      align-items:start;
      gap:18px;
    }

    .cart-summary-side{
      position:sticky;
      top:84px;
    }

    .recommended-grid{
      grid-template-columns:repeat(4, 1fr);
    }
  }

  @media (min-width:1181px){
    .recommended-grid{
      grid-template-columns:repeat(5, 1fr);
    }
  }

/* wishlist.php */
.wishlist-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .wishlist-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .wishlist-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .wishlist-breadcrumb strong{
    color:var(--heading);
  }

  .wishlist-hero{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:18px;
    background:linear-gradient(135deg, rgba(212,175,55,.08), rgba(255,255,255,.02));
    margin-bottom:16px;
    padding:18px 14px;
  }

  .wishlist-hero::before{
    content:"";
    position:absolute;
    top:-50px;
    right:-30px;
    width:140px;
    height:140px;
    border-radius:50%;
    background:rgba(212,175,55,.05);
    filter:blur(10px);
  }

  .wishlist-hero-content{
    position:relative;
    z-index:2;
  }

  .wishlist-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.18);
    color:var(--accent);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:10px;
  }

  .wishlist-hero-title{
    font-size:22px;
    line-height:1.12;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .wishlist-hero-text{
    font-size:13px;
    color:var(--text-soft);
    max-width:720px;
  }

  .wishlist-layout{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
  }

  .wishlist-main{
    min-width:0;
  }

  .wishlist-side{
    min-width:0;
  }

  .wishlist-card,
  .wishlist-summary-card,
  .wishlist-tip-card,
  .wishlist-related-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
  }

  .wishlist-card-head{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
  }

  .wishlist-card-head h2,
  .wishlist-card-head h3{
    font-size:17px;
    font-weight:900;
    color:var(--heading);
  }

  .wishlist-card-head a{
    font-size:12px;
    font-weight:800;
    color:var(--primary);
  }

  .wishlist-table-wrap{
    width:100%;
    overflow-x:auto;
  }

  .wishlist-table{
    width:100%;
    border-collapse:collapse;
    min-width:760px;
  }

  .wishlist-table thead th{
    text-align:left;
    font-size:12px;
    font-weight:900;
    color:var(--muted);
    padding:14px 16px;
    background:var(--surface-2);
    border-bottom:1px solid var(--border);
    text-transform:uppercase;
    letter-spacing:.03em;
  }

  .wishlist-table tbody td{
    padding:16px;
    border-bottom:1px solid var(--border);
    vertical-align:middle;
  }

  .wishlist-table tbody tr:last-child td{
    border-bottom:none;
  }

  .wishlist-product{
    display:flex;
    align-items:center;
    gap:14px;
    min-width:240px;
  }

  .wishlist-product-thumb{
    width:84px;
    height:84px;
    border-radius:16px;
    background:var(--surface-2);
    border:1px solid var(--border);
    display:grid;
    place-items:center;
    overflow:hidden;
    flex-shrink:0;
  }

  .wishlist-product-thumb img{
    width:74px;
    height:74px;
    object-fit:contain;
  }

  .wishlist-product-info{
    min-width:0;
  }

  .wishlist-product-name{
    font-size:14px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:6px;
    line-height:1.3;
  }

  .wishlist-product-meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
  }

  .wishlist-meta-pill{
    min-height:26px;
    padding:0 10px;
    border-radius:999px;
    background:var(--surface-2);
    border:1px solid var(--border);
    color:var(--text-soft);
    font-size:11px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .wishlist-price{
    font-size:15px;
    font-weight:900;
    color:var(--primary);
    white-space:nowrap;
  }

  .wishlist-old-price{
    display:block;
    font-size:11px;
    color:var(--muted-2);
    text-decoration:line-through;
    margin-top:4px;
    font-weight:700;
  }

  .wishlist-stock{
    min-height:30px;
    padding:0 12px;
    border-radius:999px;
    font-size:12px;
    font-weight:900;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    white-space:nowrap;
  }

  .wishlist-stock.in{
    background:rgba(39,194,106,.12);
    border:1px solid rgba(39,194,106,.18);
    color:#51d788;
  }

  .wishlist-stock.low{
    background:rgba(255,183,0,.12);
    border:1px solid rgba(255,183,0,.18);
    color:#f7c948;
  }

  .wishlist-stock.out{
    background:rgba(255,82,82,.12);
    border:1px solid rgba(255,82,82,.18);
    color:#ff8a8a;
  }

  .wishlist-action-group{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
  }

  .wishlist-btn-small{
    min-height:40px;
    padding:0 14px;
    border:none;
    border-radius:12px;
    font-size:13px;
    font-weight:900;
    cursor:pointer;
    transition:var(--transition);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    white-space:nowrap;
  }

  .wishlist-btn-small.primary{
    background:var(--btn-primary-bg);
    color:#fff;
    box-shadow:var(--btn-primary-shadow);
  }

  .wishlist-btn-small.secondary{
    background:var(--surface-2);
    color:var(--text-soft);
    border:1px solid var(--border);
  }

  .wishlist-btn-small:hover{
    transform:translateY(-2px);
  }

  .wishlist-remove-btn{
    width:40px;
    height:40px;
    border:none;
    border-radius:50%;
    background:var(--surface-2);
    border:1px solid var(--border);
    color:var(--accent);
    cursor:pointer;
    font-size:16px;
    font-weight:900;
    display:grid;
    place-items:center;
    transition:var(--transition);
  }

  .wishlist-remove-btn:hover{
    background:var(--accent-soft);
    transform:translateY(-2px);
  }

  .wishlist-bottom-bar{
    padding:14px 16px 16px;
    border-top:1px solid var(--border);
    display:flex;
    flex-direction:column;
    gap:12px;
    background:var(--surface);
  }

  .wishlist-bottom-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }

  .wishlist-main-btn{
    min-height:48px;
    border:none;
    border-radius:14px;
    font-size:14px;
    font-weight:900;
    cursor:pointer;
    transition:var(--transition);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    text-align:center;
    padding:0 16px;
  }

  .wishlist-main-btn.primary{
    background:var(--btn-primary-bg);
    color:#fff;
    box-shadow:var(--btn-primary-shadow);
  }

  .wishlist-main-btn.secondary{
    background:var(--surface-2);
    color:var(--text-soft);
    border:1px solid var(--border);
  }

  .wishlist-main-btn:hover{
    transform:translateY(-2px);
  }

  .wishlist-summary-body,
  .wishlist-tip-body{
    padding:16px;
  }

  .wishlist-summary-list{
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .wishlist-summary-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    font-size:14px;
    color:var(--text-soft);
    padding-bottom:10px;
    border-bottom:1px dashed var(--border);
  }

  .wishlist-summary-row:last-child{
    border-bottom:none;
    padding-bottom:0;
  }

  .wishlist-summary-row strong{
    color:var(--heading);
    font-weight:900;
  }

  .wishlist-summary-row.total{
    font-size:17px;
    margin-top:4px;
    padding-top:8px;
    border-top:1px solid var(--border);
    border-bottom:none;
  }

  .wishlist-summary-actions{
    margin-top:14px;
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }

  .wishlist-tip-body p{
    font-size:13px;
    color:var(--text-soft);
    margin-bottom:12px;
  }

  .wishlist-tip-body ul{
    padding-left:18px;
    margin:0;
  }

  .wishlist-tip-body li{
    font-size:13px;
    color:var(--text-soft);
    margin-bottom:8px;
  }

  .wishlist-empty-state{
    display:none;
    text-align:center;
    padding:34px 20px;
  }

  .wishlist-empty-icon{
    width:78px;
    height:78px;
    margin:0 auto 14px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    font-size:30px;
    display:grid;
    place-items:center;
  }

  .wishlist-empty-state h3{
    font-size:22px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .wishlist-empty-state p{
    font-size:14px;
    color:var(--text-soft);
    max-width:440px;
    margin:0 auto 16px;
  }

  .wishlist-related-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:16px 16px 0;
  }

  .wishlist-related-head h3{
    font-size:18px;
    font-weight:900;
    color:var(--heading);
  }

  .wishlist-related-head a{
    font-size:13px;
    color:var(--primary);
    font-weight:800;
  }

  .wishlist-related-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:12px;
    padding:16px;
  }

  .wishlist-related-grid .product-card{
    min-height:316px;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--surface-2);
    padding:12px 10px 14px;
  }

  .wishlist-related-grid .product-card:nth-child(2n){
    border-right:1px solid var(--border);
  }

  @media (min-width:768px){
    .wishlist-bottom-actions{
      grid-template-columns:1fr 1fr;
    }

    .wishlist-summary-actions{
      grid-template-columns:1fr;
    }

    .wishlist-related-grid{
      grid-template-columns:repeat(3, 1fr);
    }
  }

  @media (min-width:992px){
    .wishlist-page{
      padding:22px 0 42px;
    }

    .wishlist-layout{
      grid-template-columns:minmax(0, 1fr) 360px;
      align-items:start;
      gap:18px;
    }

    .wishlist-side{
      position:sticky;
      top:84px;
    }

    .wishlist-related-grid{
      grid-template-columns:repeat(4, 1fr);
    }
  }

  @media (min-width:1181px){
    .wishlist-related-grid{
      grid-template-columns:repeat(5, 1fr);
    }
  }

/* checkout.php */
.checkout-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .checkout-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .checkout-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .checkout-breadcrumb strong{
    color:var(--heading);
  }

  .checkout-hero{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:18px;
    background:linear-gradient(135deg, rgba(212,175,55,.08), rgba(255,255,255,.02));
    margin-bottom:16px;
    padding:18px 14px;
  }

  .checkout-hero::before{
    content:"";
    position:absolute;
    top:-50px;
    right:-30px;
    width:140px;
    height:140px;
    border-radius:50%;
    background:rgba(212,175,55,.05);
    filter:blur(10px);
  }

  .checkout-hero-content{
    position:relative;
    z-index:2;
  }

  .checkout-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.18);
    color:var(--accent);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:10px;
  }

  .checkout-hero-title{
    font-size:22px;
    line-height:1.12;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .checkout-hero-text{
    font-size:13px;
    color:var(--text-soft);
    max-width:720px;
  }

  .checkout-layout{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
  }

  .checkout-main,
  .checkout-side{
    min-width:0;
  }

  .checkout-card,
  .checkout-summary-card,
  .checkout-note-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
  }

  .checkout-card-head{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
  }

  .checkout-card-head h2,
  .checkout-card-head h3{
    font-size:17px;
    font-weight:900;
    color:var(--heading);
  }

  .checkout-card-head span{
    font-size:12px;
    color:var(--muted);
    font-weight:700;
  }

  .checkout-body{
    padding:16px;
  }

  .checkout-section{
    margin-bottom:18px;
  }

  .checkout-section:last-child{
    margin-bottom:0;
  }

  .checkout-section-title{
    font-size:14px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:12px;
  }

  .checkout-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
  }

  .checkout-field{
    display:flex;
    flex-direction:column;
    gap:8px;
  }

  .checkout-field label{
    font-size:13px;
    font-weight:800;
    color:var(--text-soft);
  }

  .checkout-input,
  .checkout-textarea{
    width:100%;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text);
    border-radius:14px;
    outline:none;
    font-size:14px;
    transition:var(--transition);
  }

  .checkout-input{
    min-height:48px;
    padding:0 14px;
  }

  .checkout-textarea{
    min-height:120px;
    padding:14px;
    resize:vertical;
  }

  .checkout-input::placeholder,
  .checkout-textarea::placeholder{
    color:var(--muted-2);
  }

  .checkout-input:focus,
  .checkout-textarea:focus{
    border-color:rgba(212,175,55,.35);
    box-shadow:0 0 0 4px rgba(212,175,55,.06);
  }

  .checkout-radio-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
  }

  .checkout-radio-card{
    position:relative;
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:14px;
    border:1px solid var(--border);
    border-radius:16px;
    background:var(--surface-2);
    transition:var(--transition);
  }

  .checkout-radio-card:hover{
    border-color:rgba(212,175,55,.24);
  }

  .checkout-radio-card input{
    accent-color:#d4af37;
    width:18px;
    height:18px;
    margin-top:2px;
    flex-shrink:0;
  }

  .checkout-radio-card.active{
    border-color:rgba(212,175,55,.35);
    box-shadow:0 0 0 2px rgba(212,175,55,.08);
    background:linear-gradient(135deg, rgba(212,175,55,.08), rgba(255,255,255,.01));
  }

  .checkout-radio-content strong{
    display:block;
    font-size:14px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:4px;
  }

  .checkout-radio-content span{
    display:block;
    font-size:12px;
    color:var(--text-soft);
    font-weight:700;
    line-height:1.45;
  }

  .checkout-order-list{
    display:flex;
    flex-direction:column;
    gap:12px;
  }

  .checkout-order-item{
    display:grid;
    grid-template-columns:70px 1fr auto;
    gap:12px;
    align-items:center;
    padding:12px;
    border-radius:16px;
    border:1px solid var(--border);
    background:var(--surface-2);
  }

  .checkout-order-thumb{
    width:70px;
    height:70px;
    border-radius:14px;
    background:var(--surface);
    border:1px solid var(--border);
    display:grid;
    place-items:center;
    overflow:hidden;
  }

  .checkout-order-thumb img{
    width:60px;
    height:60px;
    object-fit:contain;
  }

  .checkout-order-info{
    min-width:0;
  }

  .checkout-order-name{
    font-size:13px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:5px;
    line-height:1.35;
  }

  .checkout-order-meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
  }

  .checkout-order-pill{
    min-height:24px;
    padding:0 9px;
    border-radius:999px;
    background:var(--surface);
    border:1px solid var(--border);
    color:var(--text-soft);
    font-size:11px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .checkout-order-price{
    text-align:right;
    white-space:nowrap;
  }

  .checkout-order-price strong{
    display:block;
    font-size:14px;
    font-weight:900;
    color:var(--primary);
    margin-bottom:4px;
  }

  .checkout-order-price span{
    display:block;
    font-size:11px;
    color:var(--muted);
    font-weight:700;
  }

  .checkout-summary-body{
    padding:16px;
  }

  .checkout-summary-list{
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .checkout-summary-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    font-size:14px;
    color:var(--text-soft);
    padding-bottom:10px;
    border-bottom:1px dashed var(--border);
  }

  .checkout-summary-row:last-child{
    border-bottom:none;
    padding-bottom:0;
  }

  .checkout-summary-row strong{
    color:var(--heading);
    font-weight:900;
  }

  .checkout-summary-row.total{
    font-size:17px;
    margin-top:4px;
    padding-top:8px;
    border-top:1px solid var(--border);
    border-bottom:none;
  }

  .checkout-coupon{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    margin:14px 0;
  }

  .checkout-coupon input{
    width:100%;
    min-width:0;
    height:46px;
    border-radius:14px;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text);
    font-size:14px;
    padding:0 14px;
    outline:none;
  }

  .checkout-coupon input::placeholder{
    color:var(--muted-2);
  }

  .checkout-btn{
    min-height:48px;
    border:none;
    border-radius:14px;
    font-size:14px;
    font-weight:900;
    cursor:pointer;
    transition:var(--transition);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    text-align:center;
    padding:0 16px;
  }

  .checkout-btn.primary{
    background:var(--btn-primary-bg);
    color:#fff;
    box-shadow:var(--btn-primary-shadow);
  }

  .checkout-btn.secondary{
    background:var(--surface-2);
    color:var(--text-soft);
    border:1px solid var(--border);
  }

  .checkout-btn:hover{
    transform:translateY(-2px);
  }

  .checkout-place-order{
    margin-top:14px;
  }

  .checkout-place-order .checkout-btn{
    width:100%;
  }

  .checkout-secure-list{
    margin-top:14px;
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .checkout-secure-item{
    display:flex;
    align-items:flex-start;
    gap:10px;
    font-size:12px;
    color:var(--text-soft);
    font-weight:700;
  }

  .checkout-secure-item .icon{
    width:30px;
    height:30px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:14px;
    flex-shrink:0;
  }

  .checkout-note-body{
    padding:16px;
  }

  .checkout-note-body p{
    font-size:13px;
    color:var(--text-soft);
    margin-bottom:12px;
  }

  .checkout-note-body ul{
    padding-left:18px;
    margin:0;
  }

  .checkout-note-body li{
    font-size:13px;
    color:var(--text-soft);
    margin-bottom:8px;
  }

  @media (min-width:768px){
    .checkout-coupon{
      grid-template-columns:1fr auto;
    }

    .checkout-coupon .checkout-btn{
      min-width:140px;
    }

    .checkout-radio-grid{
      grid-template-columns:1fr 1fr;
    }
  }

  @media (min-width:992px){
    .checkout-page{
      padding:22px 0 42px;
    }

    .checkout-layout{
      grid-template-columns:minmax(0, 1fr) 380px;
      align-items:start;
      gap:18px;
    }

    .checkout-side{
      position:sticky;
      top:84px;
    }
  }

/* profile.php */
.profile-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .profile-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .profile-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .profile-breadcrumb strong{
    color:var(--heading);
  }

  .profile-hero{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:18px;
    background:linear-gradient(135deg, rgba(212,175,55,.08), rgba(255,255,255,.02));
    margin-bottom:16px;
    padding:18px 14px;
  }

  .profile-hero::before{
    content:"";
    position:absolute;
    top:-50px;
    right:-30px;
    width:140px;
    height:140px;
    border-radius:50%;
    background:rgba(212,175,55,.05);
    filter:blur(10px);
  }

  .profile-hero-content{
    position:relative;
    z-index:2;
  }

  .profile-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.18);
    color:var(--accent);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:10px;
  }

  .profile-hero-title{
    font-size:22px;
    line-height:1.12;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .profile-hero-text{
    font-size:13px;
    color:var(--text-soft);
    max-width:720px;
  }

  .profile-layout{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
  }

  .profile-sidebar{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    height:max-content;
  }

  .profile-main{
    min-width:0;
  }

  .profile-user-box{
    padding:18px 16px;
    border-bottom:1px solid var(--border);
    text-align:center;
  }

  .profile-avatar{
    width:86px;
    height:86px;
    border-radius:50%;
    margin:0 auto 12px;
    background:linear-gradient(135deg, rgba(212,175,55,.20), rgba(255,255,255,.04));
    border:1px solid rgba(212,175,55,.24);
    display:grid;
    place-items:center;
    color:var(--primary);
    font-size:30px;
    font-weight:900;
    box-shadow:0 12px 24px rgba(0,0,0,.16);
  }

  .profile-user-box h3{
    font-size:18px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:4px;
  }

  .profile-user-box p{
    font-size:13px;
    color:var(--text-soft);
    margin-bottom:10px;
  }

  .profile-badge{
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.20);
    color:var(--accent);
    font-size:11px;
    font-weight:900;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .profile-menu{
    list-style:none;
    padding:10px;
    margin:0;
    display:flex;
    flex-direction:column;
    gap:8px;
  }

  .profile-menu a{
    min-height:46px;
    padding:0 14px;
    border-radius:14px;
    background:transparent;
    color:var(--text-soft);
    font-size:13px;
    font-weight:800;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    border:1px solid transparent;
    transition:var(--transition);
  }

  .profile-menu a:hover,
  .profile-menu a.active{
    background:var(--surface-2);
    border-color:var(--border);
    color:var(--heading);
  }

  .profile-menu a span:first-child{
    display:flex;
    align-items:center;
    gap:10px;
  }

  .profile-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    margin-bottom:16px;
  }

  .profile-card:last-child{
    margin-bottom:0;
  }

  .profile-card-head{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
  }

  .profile-card-head h2,
  .profile-card-head h3{
    font-size:17px;
    font-weight:900;
    color:var(--heading);
  }

  .profile-card-head a{
    font-size:12px;
    font-weight:800;
    color:var(--primary);
  }

  .profile-card-body{
    padding:16px;
  }

  .profile-stats{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:12px;
  }

  .profile-stat{
    border-radius:18px;
    border:1px solid var(--border);
    background:var(--surface-2);
    padding:16px 14px;
  }

  .profile-stat .icon{
    width:42px;
    height:42px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:18px;
    margin-bottom:10px;
  }

  .profile-stat strong{
    display:block;
    font-size:20px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:4px;
  }

  .profile-stat span{
    font-size:12px;
    color:var(--text-soft);
    font-weight:700;
  }

  .profile-info-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
  }

  .profile-info-item{
    border-radius:16px;
    border:1px solid var(--border);
    background:var(--surface-2);
    padding:14px;
  }

  .profile-info-item span{
    display:block;
    font-size:12px;
    color:var(--muted);
    font-weight:700;
    margin-bottom:6px;
  }

  .profile-info-item strong{
    display:block;
    font-size:14px;
    color:var(--heading);
    font-weight:900;
    line-height:1.5;
  }

  .profile-order-list{
    display:flex;
    flex-direction:column;
    gap:12px;
  }

  .profile-order-item{
    border-radius:18px;
    border:1px solid var(--border);
    background:var(--surface-2);
    padding:14px;
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
  }

  .profile-order-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
  }

  .profile-order-id{
    font-size:14px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:4px;
  }

  .profile-order-date{
    font-size:12px;
    color:var(--text-soft);
    font-weight:700;
  }

  .profile-order-status{
    min-height:30px;
    padding:0 12px;
    border-radius:999px;
    font-size:12px;
    font-weight:900;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    white-space:nowrap;
  }

  .profile-order-status.pending{
    background:rgba(255,183,0,.12);
    border:1px solid rgba(255,183,0,.18);
    color:#f7c948;
  }

  .profile-order-status.processing{
    background:rgba(72,149,239,.12);
    border:1px solid rgba(72,149,239,.18);
    color:#7cb8ff;
  }

  .profile-order-status.delivered{
    background:rgba(39,194,106,.12);
    border:1px solid rgba(39,194,106,.18);
    color:#51d788;
  }

  .profile-order-meta{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:10px;
  }

  .profile-order-box{
    border-radius:14px;
    background:var(--surface);
    border:1px solid var(--border);
    padding:12px;
  }

  .profile-order-box span{
    display:block;
    font-size:11px;
    color:var(--muted);
    font-weight:700;
    margin-bottom:5px;
  }

  .profile-order-box strong{
    display:block;
    font-size:13px;
    color:var(--heading);
    font-weight:900;
  }

  .profile-order-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }

  .profile-btn{
    min-height:42px;
    padding:0 14px;
    border:none;
    border-radius:12px;
    font-size:13px;
    font-weight:900;
    cursor:pointer;
    transition:var(--transition);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
  }

  .profile-btn.primary{
    background:var(--btn-primary-bg);
    color:#fff;
    box-shadow:var(--btn-primary-shadow);
  }

  .profile-btn.secondary{
    background:var(--surface);
    color:var(--text-soft);
    border:1px solid var(--border);
  }

  .profile-btn:hover{
    transform:translateY(-2px);
  }

  .profile-activity-list{
    display:flex;
    flex-direction:column;
    gap:12px;
  }

  .profile-activity-item{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:12px 0;
    border-bottom:1px solid var(--border);
  }

  .profile-activity-item:last-child{
    border-bottom:none;
    padding-bottom:0;
  }

  .profile-activity-icon{
    width:40px;
    height:40px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:16px;
    flex-shrink:0;
  }

  .profile-activity-text strong{
    display:block;
    font-size:13px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:4px;
  }

  .profile-activity-text p{
    font-size:12px;
    color:var(--text-soft);
    margin-bottom:4px;
    line-height:1.6;
  }

  .profile-activity-text span{
    font-size:11px;
    color:var(--muted);
    font-weight:700;
  }

  @media (min-width:768px){
    .profile-stats{
      grid-template-columns:repeat(4, 1fr);
    }

    .profile-info-grid{
      grid-template-columns:repeat(2, 1fr);
    }

    .profile-order-item{
      grid-template-columns:1fr;
    }
  }

  @media (min-width:992px){
    .profile-page{
      padding:22px 0 42px;
    }

    .profile-layout{
      grid-template-columns:290px minmax(0, 1fr);
      gap:18px;
      align-items:start;
    }

    .profile-sidebar{
      position:sticky;
      top:84px;
    }
  }

/* edit_profile.php */
.edit-profile-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .edit-profile-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .edit-profile-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .edit-profile-breadcrumb strong{
    color:var(--heading);
  }

  .edit-profile-hero{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:18px;
    background:linear-gradient(135deg, rgba(212,175,55,.08), rgba(255,255,255,.02));
    margin-bottom:16px;
    padding:18px 14px;
  }

  .edit-profile-hero::before{
    content:"";
    position:absolute;
    top:-50px;
    right:-30px;
    width:140px;
    height:140px;
    border-radius:50%;
    background:rgba(212,175,55,.05);
    filter:blur(10px);
  }

  .edit-profile-hero-content{
    position:relative;
    z-index:2;
  }

  .edit-profile-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.18);
    color:var(--accent);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:10px;
  }

  .edit-profile-hero-title{
    font-size:22px;
    line-height:1.12;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .edit-profile-hero-text{
    font-size:13px;
    color:var(--text-soft);
    max-width:760px;
  }

  .edit-profile-layout{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
  }

  .edit-profile-sidebar{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    height:max-content;
  }

  .edit-profile-main{
    min-width:0;
  }

  .edit-profile-user-box{
    padding:18px 16px;
    border-bottom:1px solid var(--border);
    text-align:center;
  }

  .edit-profile-avatar{
    width:88px;
    height:88px;
    border-radius:50%;
    margin:0 auto 12px;
    background:linear-gradient(135deg, rgba(212,175,55,.20), rgba(255,255,255,.04));
    border:1px solid rgba(212,175,55,.24);
    display:grid;
    place-items:center;
    color:var(--primary);
    font-size:30px;
    font-weight:900;
    box-shadow:0 12px 24px rgba(0,0,0,.16);
  }

  .edit-profile-user-box h3{
    font-size:18px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:4px;
  }

  .edit-profile-user-box p{
    font-size:13px;
    color:var(--text-soft);
    margin-bottom:10px;
  }

  .edit-profile-badge{
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.20);
    color:var(--accent);
    font-size:11px;
    font-weight:900;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .edit-profile-menu{
    list-style:none;
    padding:10px;
    margin:0;
    display:flex;
    flex-direction:column;
    gap:8px;
  }

  .edit-profile-menu a{
    min-height:46px;
    padding:0 14px;
    border-radius:14px;
    background:transparent;
    color:var(--text-soft);
    font-size:13px;
    font-weight:800;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    border:1px solid transparent;
    transition:var(--transition);
  }

  .edit-profile-menu a:hover,
  .edit-profile-menu a.active{
    background:var(--surface-2);
    border-color:var(--border);
    color:var(--heading);
  }

  .edit-profile-menu a span:first-child{
    display:flex;
    align-items:center;
    gap:10px;
  }

  .edit-profile-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    margin-bottom:16px;
  }

  .edit-profile-card:last-child{
    margin-bottom:0;
  }

  .edit-profile-card-head{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
  }

  .edit-profile-card-head h2,
  .edit-profile-card-head h3{
    font-size:17px;
    font-weight:900;
    color:var(--heading);
  }

  .edit-profile-card-head span{
    font-size:12px;
    color:var(--muted);
    font-weight:700;
  }

  .edit-profile-card-body{
    padding:16px;
  }

  .edit-profile-form{
    display:flex;
    flex-direction:column;
    gap:18px;
  }

  .edit-profile-section-title{
    font-size:14px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:12px;
  }

  .edit-profile-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
  }

  .edit-profile-field{
    display:flex;
    flex-direction:column;
    gap:8px;
  }

  .edit-profile-field label{
    font-size:13px;
    font-weight:800;
    color:var(--text-soft);
  }

  .edit-profile-input-wrap{
    position:relative;
  }

  .edit-profile-input,
  .edit-profile-textarea,
  .edit-profile-select{
    width:100%;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text);
    border-radius:14px;
    outline:none;
    font-size:14px;
    transition:var(--transition);
  }

  .edit-profile-input,
  .edit-profile-select{
    min-height:50px;
    padding:0 46px 0 14px;
  }

  .edit-profile-textarea{
    min-height:120px;
    padding:14px;
    resize:vertical;
  }

  .edit-profile-input::placeholder,
  .edit-profile-textarea::placeholder{
    color:var(--muted-2);
  }

  .edit-profile-input:focus,
  .edit-profile-textarea:focus,
  .edit-profile-select:focus{
    border-color:rgba(212,175,55,.35);
    box-shadow:0 0 0 4px rgba(212,175,55,.06);
  }

  .edit-profile-input-icon{
    position:absolute;
    top:50%;
    right:14px;
    transform:translateY(-50%);
    color:var(--muted);
    font-size:16px;
    pointer-events:none;
  }

  .edit-profile-upload-box{
    border:1px dashed rgba(212,175,55,.28);
    background:var(--surface-2);
    border-radius:18px;
    padding:16px;
    display:flex;
    flex-direction:column;
    gap:14px;
    align-items:center;
    text-align:center;
  }

  .edit-profile-upload-preview{
    width:92px;
    height:92px;
    border-radius:50%;
    overflow:hidden;
    border:2px solid rgba(212,175,55,.22);
    background:var(--surface);
    display:grid;
    place-items:center;
    color:var(--primary);
    font-size:30px;
    font-weight:900;
  }

  .edit-profile-upload-preview img{
    width:100%;
    height:100%;
    object-fit:cover;
  }

  .edit-profile-upload-box p{
    font-size:12px;
    color:var(--text-soft);
    line-height:1.6;
    max-width:320px;
  }

  .edit-profile-upload-box input[type="file"]{
    display:none;
  }

  .edit-profile-upload-btn{
    min-height:42px;
    padding:0 16px;
    border:none;
    border-radius:12px;
    background:var(--surface);
    color:var(--text-soft);
    border:1px solid var(--border);
    font-size:13px;
    font-weight:900;
    cursor:pointer;
    transition:var(--transition);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
  }

  .edit-profile-upload-btn:hover{
    transform:translateY(-2px);
    border-color:rgba(212,175,55,.26);
  }

  .edit-profile-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
  }

  .edit-profile-btn{
    min-height:50px;
    border:none;
    border-radius:14px;
    font-size:14px;
    font-weight:900;
    cursor:pointer;
    transition:var(--transition);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:0 18px;
  }

  .edit-profile-btn.primary{
    background:var(--btn-primary-bg);
    color:#fff;
    box-shadow:var(--btn-primary-shadow);
  }

  .edit-profile-btn.secondary{
    background:var(--surface-2);
    color:var(--text-soft);
    border:1px solid var(--border);
  }

  .edit-profile-btn:hover{
    transform:translateY(-2px);
  }

  .edit-profile-note-list{
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .edit-profile-note-item{
    display:flex;
    align-items:flex-start;
    gap:10px;
    font-size:13px;
    color:var(--text-soft);
    font-weight:700;
  }

  .edit-profile-note-icon{
    width:32px;
    height:32px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:14px;
    flex-shrink:0;
  }

  @media (min-width:768px){
    .edit-profile-grid{
      grid-template-columns:1fr 1fr;
    }

    .edit-profile-grid .full{
      grid-column:1 / -1;
    }

    .edit-profile-actions{
      grid-template-columns:1fr 1fr;
    }
  }

  @media (min-width:992px){
    .edit-profile-page{
      padding:22px 0 42px;
    }

    .edit-profile-layout{
      grid-template-columns:290px minmax(0, 1fr);
      gap:18px;
      align-items:start;
    }

    .edit-profile-sidebar{
      position:sticky;
      top:84px;
    }
  }

/* total_orders.php */
.total-orders-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .total-orders-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .total-orders-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .total-orders-breadcrumb strong{
    color:var(--heading);
  }

  .total-orders-hero{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:18px;
    background:linear-gradient(135deg, rgba(212,175,55,.08), rgba(255,255,255,.02));
    margin-bottom:16px;
    padding:18px 14px;
  }

  .total-orders-hero::before{
    content:"";
    position:absolute;
    top:-50px;
    right:-30px;
    width:140px;
    height:140px;
    border-radius:50%;
    background:rgba(212,175,55,.05);
    filter:blur(10px);
  }

  .total-orders-hero-content{
    position:relative;
    z-index:2;
  }

  .total-orders-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.18);
    color:var(--accent);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:10px;
  }

  .total-orders-hero-title{
    font-size:22px;
    line-height:1.12;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .total-orders-hero-text{
    font-size:13px;
    color:var(--text-soft);
    max-width:760px;
  }

  .total-orders-layout{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
  }

  .total-orders-sidebar{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    height:max-content;
  }

  .total-orders-main{
    min-width:0;
  }

  .total-orders-user-box{
    padding:18px 16px;
    border-bottom:1px solid var(--border);
    text-align:center;
  }

  .total-orders-avatar{
    width:88px;
    height:88px;
    border-radius:50%;
    margin:0 auto 12px;
    background:linear-gradient(135deg, rgba(212,175,55,.20), rgba(255,255,255,.04));
    border:1px solid rgba(212,175,55,.24);
    display:grid;
    place-items:center;
    color:var(--primary);
    font-size:30px;
    font-weight:900;
    box-shadow:0 12px 24px rgba(0,0,0,.16);
  }

  .total-orders-user-box h3{
    font-size:18px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:4px;
  }

  .total-orders-user-box p{
    font-size:13px;
    color:var(--text-soft);
    margin-bottom:10px;
  }

  .total-orders-badge{
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.20);
    color:var(--accent);
    font-size:11px;
    font-weight:900;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .total-orders-menu{
    list-style:none;
    padding:10px;
    margin:0;
    display:flex;
    flex-direction:column;
    gap:8px;
  }

  .total-orders-menu a{
    min-height:46px;
    padding:0 14px;
    border-radius:14px;
    background:transparent;
    color:var(--text-soft);
    font-size:13px;
    font-weight:800;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    border:1px solid transparent;
    transition:var(--transition);
  }

  .total-orders-menu a:hover,
  .total-orders-menu a.active{
    background:var(--surface-2);
    border-color:var(--border);
    color:var(--heading);
  }

  .total-orders-menu a span:first-child{
    display:flex;
    align-items:center;
    gap:10px;
  }

  .total-orders-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    margin-bottom:16px;
  }

  .total-orders-card:last-child{
    margin-bottom:0;
  }

  .total-orders-card-head{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
  }

  .total-orders-card-head h2,
  .total-orders-card-head h3{
    font-size:17px;
    font-weight:900;
    color:var(--heading);
  }

  .total-orders-card-head span{
    font-size:12px;
    color:var(--muted);
    font-weight:700;
  }

  .total-orders-card-body{
    padding:16px;
  }

  .total-orders-stats{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:12px;
  }

  .total-orders-stat{
    border-radius:18px;
    border:1px solid var(--border);
    background:var(--surface-2);
    padding:16px 14px;
  }

  .total-orders-stat .icon{
    width:42px;
    height:42px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:18px;
    margin-bottom:10px;
  }

  .total-orders-stat strong{
    display:block;
    font-size:20px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:4px;
  }

  .total-orders-stat span{
    font-size:12px;
    color:var(--text-soft);
    font-weight:700;
  }

  .total-orders-toolbar{
    display:flex;
    flex-direction:column;
    gap:12px;
  }

  .total-orders-search{
    display:flex;
    align-items:center;
    gap:8px;
    min-height:46px;
    padding:0 12px;
    border-radius:14px;
    background:var(--surface-2);
    border:1px solid var(--border);
  }

  .total-orders-search input{
    width:100%;
    min-width:0;
    border:none;
    outline:none;
    background:transparent;
    color:var(--text);
    font-size:14px;
  }

  .total-orders-search input::placeholder{
    color:var(--muted-2);
  }

  .total-orders-filters{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }

  .total-orders-select{
    width:100%;
    min-height:44px;
    border-radius:14px;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text-soft);
    font-size:13px;
    font-weight:800;
    padding:0 12px;
    outline:none;
  }

  .total-orders-list{
    display:flex;
    flex-direction:column;
    gap:14px;
  }

  .total-orders-item{
    border-radius:18px;
    border:1px solid var(--border);
    background:var(--surface-2);
    padding:14px;
  }

  .total-orders-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
    margin-bottom:12px;
  }

  .total-orders-id{
    font-size:15px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:4px;
  }

  .total-orders-date{
    font-size:12px;
    color:var(--text-soft);
    font-weight:700;
  }

  .total-orders-status{
    min-height:30px;
    padding:0 12px;
    border-radius:999px;
    font-size:12px;
    font-weight:900;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    white-space:nowrap;
  }

  .total-orders-status.pending{
    background:rgba(255,183,0,.12);
    border:1px solid rgba(255,183,0,.18);
    color:#f7c948;
  }

  .total-orders-status.processing{
    background:rgba(72,149,239,.12);
    border:1px solid rgba(72,149,239,.18);
    color:#7cb8ff;
  }

  .total-orders-status.delivered{
    background:rgba(39,194,106,.12);
    border:1px solid rgba(39,194,106,.18);
    color:#51d788;
  }

  .total-orders-status.cancelled{
    background:rgba(255,82,82,.12);
    border:1px solid rgba(255,82,82,.18);
    color:#ff8a8a;
  }

  .total-orders-meta{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:10px;
    margin-bottom:12px;
  }

  .total-orders-box{
    border-radius:14px;
    background:var(--surface);
    border:1px solid var(--border);
    padding:12px;
  }

  .total-orders-box span{
    display:block;
    font-size:11px;
    color:var(--muted);
    font-weight:700;
    margin-bottom:5px;
  }

  .total-orders-box strong{
    display:block;
    font-size:13px;
    color:var(--heading);
    font-weight:900;
    line-height:1.5;
  }

  .total-orders-products{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:12px;
  }

  .total-orders-product-pill{
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:var(--surface);
    border:1px solid var(--border);
    color:var(--text-soft);
    font-size:12px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .total-orders-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }

  .total-orders-btn{
    min-height:42px;
    padding:0 14px;
    border:none;
    border-radius:12px;
    font-size:13px;
    font-weight:900;
    cursor:pointer;
    transition:var(--transition);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
  }

  .total-orders-btn.primary{
    background:var(--btn-primary-bg);
    color:#fff;
    box-shadow:var(--btn-primary-shadow);
  }

  .total-orders-btn.secondary{
    background:var(--surface);
    color:var(--text-soft);
    border:1px solid var(--border);
  }

  .total-orders-btn:hover{
    transform:translateY(-2px);
  }

  .total-orders-pagination{
    margin-top:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
  }

  .total-orders-page-btn{
    min-width:42px;
    height:42px;
    padding:0 14px;
    border-radius:12px;
    border:1px solid var(--border);
    background:var(--surface);
    color:var(--text-soft);
    font-size:13px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transition:var(--transition);
  }

  .total-orders-page-btn:hover,
  .total-orders-page-btn.active{
    background:var(--btn-primary-bg);
    color:#fff;
    border-color:transparent;
    box-shadow:var(--btn-primary-shadow);
  }

  @media (min-width:768px){
    .total-orders-stats{
      grid-template-columns:repeat(4, 1fr);
    }

    .total-orders-toolbar{
      flex-direction:row;
      align-items:center;
      justify-content:space-between;
    }

    .total-orders-search{
      width:320px;
      flex-shrink:0;
    }

    .total-orders-filters{
      width:290px;
      flex-shrink:0;
    }
  }

  @media (min-width:992px){
    .total-orders-page{
      padding:22px 0 42px;
    }

    .total-orders-layout{
      grid-template-columns:290px minmax(0, 1fr);
      gap:18px;
      align-items:start;
    }

    .total-orders-sidebar{
      position:sticky;
      top:84px;
    }
  }

/* change_password.php */
.change-password-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .change-password-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .change-password-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .change-password-breadcrumb strong{
    color:var(--heading);
  }

  .change-password-hero{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:18px;
    background:linear-gradient(135deg, rgba(212,175,55,.08), rgba(255,255,255,.02));
    margin-bottom:16px;
    padding:18px 14px;
  }

  .change-password-hero::before{
    content:"";
    position:absolute;
    top:-50px;
    right:-30px;
    width:140px;
    height:140px;
    border-radius:50%;
    background:rgba(212,175,55,.05);
    filter:blur(10px);
  }

  .change-password-hero-content{
    position:relative;
    z-index:2;
  }

  .change-password-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.18);
    color:var(--accent);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:10px;
  }

  .change-password-hero-title{
    font-size:22px;
    line-height:1.12;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .change-password-hero-text{
    font-size:13px;
    color:var(--text-soft);
    max-width:760px;
  }

  .change-password-layout{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
  }

  .change-password-sidebar{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    height:max-content;
  }

  .change-password-main{
    min-width:0;
  }

  .change-password-user-box{
    padding:18px 16px;
    border-bottom:1px solid var(--border);
    text-align:center;
  }

  .change-password-avatar{
    width:88px;
    height:88px;
    border-radius:50%;
    margin:0 auto 12px;
    background:linear-gradient(135deg, rgba(212,175,55,.20), rgba(255,255,255,.04));
    border:1px solid rgba(212,175,55,.24);
    display:grid;
    place-items:center;
    color:var(--primary);
    font-size:30px;
    font-weight:900;
    box-shadow:0 12px 24px rgba(0,0,0,.16);
  }

  .change-password-user-box h3{
    font-size:18px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:4px;
  }

  .change-password-user-box p{
    font-size:13px;
    color:var(--text-soft);
    margin-bottom:10px;
  }

  .change-password-badge{
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.20);
    color:var(--accent);
    font-size:11px;
    font-weight:900;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .change-password-menu{
    list-style:none;
    padding:10px;
    margin:0;
    display:flex;
    flex-direction:column;
    gap:8px;
  }

  .change-password-menu a{
    min-height:46px;
    padding:0 14px;
    border-radius:14px;
    background:transparent;
    color:var(--text-soft);
    font-size:13px;
    font-weight:800;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    border:1px solid transparent;
    transition:var(--transition);
  }

  .change-password-menu a:hover,
  .change-password-menu a.active{
    background:var(--surface-2);
    border-color:var(--border);
    color:var(--heading);
  }

  .change-password-menu a span:first-child{
    display:flex;
    align-items:center;
    gap:10px;
  }

  .change-password-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    margin-bottom:16px;
  }

  .change-password-card:last-child{
    margin-bottom:0;
  }

  .change-password-card-head{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
  }

  .change-password-card-head h2,
  .change-password-card-head h3{
    font-size:17px;
    font-weight:900;
    color:var(--heading);
  }

  .change-password-card-head span{
    font-size:12px;
    color:var(--muted);
    font-weight:700;
  }

  .change-password-card-body{
    padding:16px;
  }

  .change-password-form{
    display:flex;
    flex-direction:column;
    gap:16px;
  }

  .change-password-field{
    display:flex;
    flex-direction:column;
    gap:8px;
  }

  .change-password-field label{
    font-size:13px;
    font-weight:800;
    color:var(--text-soft);
  }

  .change-password-input-wrap{
    position:relative;
  }

  .change-password-input{
    width:100%;
    min-height:50px;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text);
    border-radius:14px;
    outline:none;
    font-size:14px;
    padding:0 48px 0 14px;
    transition:var(--transition);
  }

  .change-password-input::placeholder{
    color:var(--muted-2);
  }

  .change-password-input:focus{
    border-color:rgba(212,175,55,.35);
    box-shadow:0 0 0 4px rgba(212,175,55,.06);
  }

  .change-password-input-icon{
    position:absolute;
    top:50%;
    right:14px;
    transform:translateY(-50%);
    color:var(--muted);
    font-size:16px;
    pointer-events:none;
  }

  .change-password-strength{
    margin-top:4px;
    display:flex;
    align-items:center;
    gap:8px;
  }

  .change-password-strength-bar{
    flex:1;
    height:8px;
    border-radius:999px;
    background:var(--surface-3);
    overflow:hidden;
  }

  .change-password-strength-fill{
    width:66%;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg, #f7c948, #27c26a);
  }

  .change-password-strength span{
    font-size:12px;
    font-weight:800;
    color:var(--text-soft);
  }

  .change-password-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
    margin-top:4px;
  }

  .change-password-btn{
    min-height:50px;
    border:none;
    border-radius:14px;
    font-size:14px;
    font-weight:900;
    cursor:pointer;
    transition:var(--transition);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:0 18px;
  }

  .change-password-btn.primary{
    background:var(--btn-primary-bg);
    color:#fff;
    box-shadow:var(--btn-primary-shadow);
  }

  .change-password-btn.secondary{
    background:var(--surface-2);
    color:var(--text-soft);
    border:1px solid var(--border);
  }

  .change-password-btn:hover{
    transform:translateY(-2px);
  }

  .change-password-tips{
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .change-password-tip{
    display:flex;
    align-items:flex-start;
    gap:10px;
    font-size:13px;
    color:var(--text-soft);
    font-weight:700;
    line-height:1.6;
  }

  .change-password-tip-icon{
    width:32px;
    height:32px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:14px;
    flex-shrink:0;
  }

  .change-password-note{
    padding:14px;
    border-radius:16px;
    border:1px solid var(--border);
    background:var(--surface-2);
  }

  .change-password-note strong{
    display:block;
    font-size:13px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:6px;
  }

  .change-password-note p{
    font-size:12px;
    color:var(--text-soft);
    line-height:1.65;
  }

  @media (min-width:768px){
    .change-password-actions{
      grid-template-columns:1fr 1fr;
    }
  }

  @media (min-width:992px){
    .change-password-page{
      padding:22px 0 42px;
    }

    .change-password-layout{
      grid-template-columns:290px minmax(0, 1fr);
      gap:18px;
      align-items:start;
    }

    .change-password-sidebar{
      position:sticky;
      top:84px;
    }
  }

/* login.php */
.login-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .login-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .login-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .login-breadcrumb strong{
    color:var(--heading);
  }

  .login-hero{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:18px;
    background:linear-gradient(135deg, rgba(212,175,55,.08), rgba(255,255,255,.02));
    margin-bottom:16px;
    padding:18px 14px;
  }

  .login-hero::before{
    content:"";
    position:absolute;
    top:-50px;
    right:-30px;
    width:140px;
    height:140px;
    border-radius:50%;
    background:rgba(212,175,55,.05);
    filter:blur(10px);
  }

  .login-hero-content{
    position:relative;
    z-index:2;
  }

  .login-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.18);
    color:var(--accent);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:10px;
  }

  .login-hero-title{
    font-size:22px;
    line-height:1.12;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .login-hero-text{
    font-size:13px;
    color:var(--text-soft);
    max-width:720px;
  }

  .login-layout{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
  }

  .login-form-card,
  .login-info-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
  }

  .login-card-head{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
  }

  .login-card-head h2,
  .login-card-head h3{
    font-size:17px;
    font-weight:900;
    color:var(--heading);
  }

  .login-card-head span{
    font-size:12px;
    color:var(--muted);
    font-weight:700;
  }

  .login-card-body{
    padding:16px;
  }

  .login-form{
    display:flex;
    flex-direction:column;
    gap:14px;
  }

  .login-field{
    display:flex;
    flex-direction:column;
    gap:8px;
  }

  .login-field label{
    font-size:13px;
    font-weight:800;
    color:var(--text-soft);
  }

  .login-input-wrap{
    position:relative;
  }

  .login-input{
    width:100%;
    min-height:50px;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text);
    border-radius:14px;
    outline:none;
    font-size:14px;
    padding:0 46px 0 14px;
    transition:var(--transition);
  }

  .login-input::placeholder{
    color:var(--muted-2);
  }

  .login-input:focus{
    border-color:rgba(212,175,55,.35);
    box-shadow:0 0 0 4px rgba(212,175,55,.06);
  }

  .login-input-icon{
    position:absolute;
    top:50%;
    right:14px;
    transform:translateY(-50%);
    color:var(--muted);
    font-size:16px;
    pointer-events:none;
  }

  .login-options{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
  }

  .login-check{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:13px;
    color:var(--text-soft);
    font-weight:700;
  }

  .login-check input{
    accent-color:#d4af37;
    width:16px;
    height:16px;
    flex-shrink:0;
  }

  .forgot-link{
    font-size:13px;
    color:var(--primary);
    font-weight:800;
  }

  .forgot-link:hover{
    text-decoration:underline;
  }

  .login-btn{
    width:100%;
    min-height:50px;
    border:none;
    border-radius:14px;
    background:var(--btn-primary-bg);
    color:#fff;
    font-size:14px;
    font-weight:900;
    cursor:pointer;
    box-shadow:var(--btn-primary-shadow);
    transition:var(--transition);
  }

  .login-btn:hover{
    transform:translateY(-2px);
  }

  .login-divider{
    display:flex;
    align-items:center;
    gap:12px;
    color:var(--muted);
    font-size:12px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.04em;
  }

  .login-divider::before,
  .login-divider::after{
    content:"";
    flex:1;
    height:1px;
    background:var(--border);
  }

  .login-social-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }

  .login-social-btn{
    min-height:48px;
    border-radius:14px;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text-soft);
    font-size:13px;
    font-weight:900;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    cursor:pointer;
    transition:var(--transition);
  }

  .login-social-btn:hover{
    transform:translateY(-2px);
    border-color:rgba(212,175,55,.24);
  }

  .login-register{
    text-align:center;
    font-size:13px;
    color:var(--text-soft);
    font-weight:700;
  }

  .login-register a{
    color:var(--primary);
    font-weight:900;
  }

  .login-info-body{
    padding:16px;
  }

  .login-info-text{
    font-size:13px;
    color:var(--text-soft);
    margin-bottom:14px;
    line-height:1.7;
  }

  .login-feature-list{
    display:flex;
    flex-direction:column;
    gap:10px;
    margin-bottom:16px;
  }

  .login-feature-item{
    display:flex;
    align-items:flex-start;
    gap:10px;
    font-size:13px;
    color:var(--text-soft);
    font-weight:700;
  }

  .login-feature-icon{
    width:32px;
    height:32px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:14px;
    flex-shrink:0;
  }

  .login-note-box{
    padding:14px;
    border-radius:16px;
    border:1px solid var(--border);
    background:var(--surface-2);
  }

  .login-note-box strong{
    display:block;
    font-size:13px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:6px;
  }

  .login-note-box p{
    font-size:12px;
    color:var(--text-soft);
    line-height:1.65;
  }

  @media (min-width:768px){
    .login-social-grid{
      grid-template-columns:1fr 1fr;
    }
  }

  @media (min-width:992px){
    .login-page{
      padding:22px 0 42px;
    }

    .login-layout{
      grid-template-columns:minmax(0, 1fr) 380px;
      gap:18px;
      align-items:start;
    }
  }

/* signup.php */
.signup-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .signup-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .signup-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .signup-breadcrumb strong{
    color:var(--heading);
  }

  .signup-hero{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:18px;
    background:linear-gradient(135deg, rgba(212,175,55,.08), rgba(255,255,255,.02));
    margin-bottom:16px;
    padding:18px 14px;
  }

  .signup-hero::before{
    content:"";
    position:absolute;
    top:-50px;
    right:-30px;
    width:140px;
    height:140px;
    border-radius:50%;
    background:rgba(212,175,55,.05);
    filter:blur(10px);
  }

  .signup-hero-content{
    position:relative;
    z-index:2;
  }

  .signup-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.18);
    color:var(--accent);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:10px;
  }

  .signup-hero-title{
    font-size:22px;
    line-height:1.12;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .signup-hero-text{
    font-size:13px;
    color:var(--text-soft);
    max-width:720px;
  }

  .signup-layout{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
  }

  .signup-form-card,
  .signup-info-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
  }

  .signup-card-head{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
  }

  .signup-card-head h2,
  .signup-card-head h3{
    font-size:17px;
    font-weight:900;
    color:var(--heading);
  }

  .signup-card-head span{
    font-size:12px;
    color:var(--muted);
    font-weight:700;
  }

  .signup-card-body{
    padding:16px;
  }

  .signup-form{
    display:flex;
    flex-direction:column;
    gap:14px;
  }

  .signup-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
  }

  .signup-field{
    display:flex;
    flex-direction:column;
    gap:8px;
  }

  .signup-field label{
    font-size:13px;
    font-weight:800;
    color:var(--text-soft);
  }

  .signup-input-wrap{
    position:relative;
  }

  .signup-input{
    width:100%;
    min-height:50px;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text);
    border-radius:14px;
    outline:none;
    font-size:14px;
    padding:0 46px 0 14px;
    transition:var(--transition);
  }

  .signup-input::placeholder{
    color:var(--muted-2);
  }

  .signup-input:focus{
    border-color:rgba(212,175,55,.35);
    box-shadow:0 0 0 4px rgba(212,175,55,.06);
  }

  .signup-input-icon{
    position:absolute;
    top:50%;
    right:14px;
    transform:translateY(-50%);
    color:var(--muted);
    font-size:16px;
    pointer-events:none;
  }

  .signup-check-group{
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .signup-check{
    display:flex;
    align-items:flex-start;
    gap:10px;
    font-size:13px;
    color:var(--text-soft);
    font-weight:700;
    line-height:1.5;
  }

  .signup-check input{
    accent-color:#d4af37;
    width:16px;
    height:16px;
    margin-top:2px;
    flex-shrink:0;
  }

  .signup-check a{
    color:var(--primary);
    font-weight:900;
  }

  .signup-btn{
    width:100%;
    min-height:50px;
    border:none;
    border-radius:14px;
    background:var(--btn-primary-bg);
    color:#fff;
    font-size:14px;
    font-weight:900;
    cursor:pointer;
    box-shadow:var(--btn-primary-shadow);
    transition:var(--transition);
  }

  .signup-btn:hover{
    transform:translateY(-2px);
  }

  .signup-divider{
    display:flex;
    align-items:center;
    gap:12px;
    color:var(--muted);
    font-size:12px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.04em;
  }

  .signup-divider::before,
  .signup-divider::after{
    content:"";
    flex:1;
    height:1px;
    background:var(--border);
  }

  .signup-social-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }

  .signup-social-btn{
    min-height:48px;
    border-radius:14px;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text-soft);
    font-size:13px;
    font-weight:900;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    cursor:pointer;
    transition:var(--transition);
  }

  .signup-social-btn:hover{
    transform:translateY(-2px);
    border-color:rgba(212,175,55,.24);
  }

  .signup-login{
    text-align:center;
    font-size:13px;
    color:var(--text-soft);
    font-weight:700;
  }

  .signup-login a{
    color:var(--primary);
    font-weight:900;
  }

  .signup-info-body{
    padding:16px;
  }

  .signup-info-text{
    font-size:13px;
    color:var(--text-soft);
    margin-bottom:14px;
    line-height:1.7;
  }

  .signup-feature-list{
    display:flex;
    flex-direction:column;
    gap:10px;
    margin-bottom:16px;
  }

  .signup-feature-item{
    display:flex;
    align-items:flex-start;
    gap:10px;
    font-size:13px;
    color:var(--text-soft);
    font-weight:700;
  }

  .signup-feature-icon{
    width:32px;
    height:32px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:14px;
    flex-shrink:0;
  }

  .signup-note-box{
    padding:14px;
    border-radius:16px;
    border:1px solid var(--border);
    background:var(--surface-2);
  }

  .signup-note-box strong{
    display:block;
    font-size:13px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:6px;
  }

  .signup-note-box p{
    font-size:12px;
    color:var(--text-soft);
    line-height:1.65;
  }

  @media (min-width:768px){
    .signup-grid{
      grid-template-columns:1fr 1fr;
    }

    .signup-grid .signup-field.full{
      grid-column:1 / -1;
    }

    .signup-social-grid{
      grid-template-columns:1fr 1fr;
    }
  }

  @media (min-width:992px){
    .signup-page{
      padding:22px 0 42px;
    }

    .signup-layout{
      grid-template-columns:minmax(0, 1fr) 380px;
      gap:18px;
      align-items:start;
    }
  }

/* about.php */
.about-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .about-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .about-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .about-breadcrumb strong{
    color:var(--heading);
  }

  .about-hero{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:20px;
    background:linear-gradient(135deg, rgba(212,175,55,.10), rgba(255,255,255,.02));
    margin-bottom:16px;
    padding:18px 14px;
  }

  .about-hero::before{
    content:"";
    position:absolute;
    top:-50px;
    right:-30px;
    width:150px;
    height:150px;
    border-radius:50%;
    background:rgba(212,175,55,.05);
    filter:blur(10px);
  }

  .about-hero-wrap{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:1fr;
    gap:18px;
    align-items:center;
  }

  .about-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.18);
    color:var(--accent);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:10px;
  }

  .about-title{
    font-size:24px;
    line-height:1.1;
    font-weight:900;
    color:var(--heading);
    margin-bottom:10px;
  }

  .about-text{
    font-size:14px;
    color:var(--text-soft);
    line-height:1.75;
    margin-bottom:14px;
    max-width:760px;
  }

  .about-hero-stats{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:12px;
  }

  .about-stat{
    padding:14px;
    border-radius:18px;
    background:var(--surface-2);
    border:1px solid var(--border);
  }

  .about-stat strong{
    display:block;
    font-size:22px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:4px;
  }

  .about-stat span{
    display:block;
    font-size:12px;
    color:var(--text-soft);
    font-weight:700;
  }

  .about-hero-image{
    border-radius:20px;
    overflow:hidden;
    border:1px solid var(--border);
    background:var(--surface-2);
    min-height:260px;
  }

  .about-hero-image img{
    width:100%;
    height:100%;
    min-height:260px;
    object-fit:cover;
    display:block;
  }

  .about-section{
    margin-bottom:16px;
  }

  .about-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
  }

  .about-card-head{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--border);
  }

  .about-card-head h2,
  .about-card-head h3{
    font-size:18px;
    font-weight:900;
    color:var(--heading);
  }

  .about-card-body{
    padding:16px;
  }

  .about-story-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
  }

  .about-story-text p{
    font-size:14px;
    color:var(--text-soft);
    line-height:1.8;
    margin-bottom:12px;
  }

  .about-feature-list{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
  }

  .about-feature{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:14px;
    border-radius:18px;
    border:1px solid var(--border);
    background:var(--surface-2);
  }

  .about-feature-icon{
    width:44px;
    height:44px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:18px;
    flex-shrink:0;
  }

  .about-feature strong{
    display:block;
    font-size:14px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:4px;
  }

  .about-feature p{
    font-size:13px;
    color:var(--text-soft);
    line-height:1.7;
  }

  .about-values-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
  }

  .about-value-card{
    padding:16px;
    border-radius:18px;
    border:1px solid var(--border);
    background:var(--surface-2);
  }

  .about-value-card .icon{
    width:46px;
    height:46px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:18px;
    margin-bottom:12px;
  }

  .about-value-card h4{
    font-size:16px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .about-value-card p{
    font-size:13px;
    color:var(--text-soft);
    line-height:1.75;
  }

  .about-timeline{
    display:flex;
    flex-direction:column;
    gap:14px;
  }

  .about-timeline-item{
    position:relative;
    padding-left:18px;
    border-left:2px solid rgba(212,175,55,.22);
  }

  .about-timeline-item::before{
    content:"";
    position:absolute;
    top:2px;
    left:-7px;
    width:12px;
    height:12px;
    border-radius:50%;
    background:var(--primary);
    box-shadow:0 0 0 4px rgba(212,175,55,.10);
  }

  .about-timeline-year{
    font-size:12px;
    color:var(--accent);
    font-weight:900;
    margin-bottom:4px;
    text-transform:uppercase;
    letter-spacing:.04em;
  }

  .about-timeline-item h4{
    font-size:15px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:6px;
  }

  .about-timeline-item p{
    font-size:13px;
    color:var(--text-soft);
    line-height:1.75;
  }

  .about-team-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:12px;
  }

  .about-team-card{
    border-radius:18px;
    overflow:hidden;
    border:1px solid var(--border);
    background:var(--surface-2);
  }

  .about-team-image{
    width:100%;
    height:180px;
    overflow:hidden;
    background:var(--surface-3);
  }

  .about-team-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }

  .about-team-content{
    padding:14px;
  }

  .about-team-content h4{
    font-size:15px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:4px;
  }

  .about-team-content span{
    display:block;
    font-size:12px;
    color:var(--accent);
    font-weight:800;
    margin-bottom:8px;
  }

  .about-team-content p{
    font-size:12px;
    color:var(--text-soft);
    line-height:1.7;
  }

  .about-cta{
    text-align:center;
    padding:20px 16px;
    border-radius:20px;
    border:1px solid var(--border);
    background:linear-gradient(135deg, rgba(212,175,55,.10), rgba(255,255,255,.02));
  }

  .about-cta h3{
    font-size:22px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:10px;
  }

  .about-cta p{
    font-size:14px;
    color:var(--text-soft);
    line-height:1.75;
    max-width:720px;
    margin:0 auto 16px;
  }

  .about-cta-actions{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:12px;
  }

  .about-btn{
    min-height:48px;
    padding:0 18px;
    border:none;
    border-radius:14px;
    font-size:14px;
    font-weight:900;
    cursor:pointer;
    transition:var(--transition);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
  }

  .about-btn.primary{
    background:var(--btn-primary-bg);
    color:#fff;
    box-shadow:var(--btn-primary-shadow);
  }

  .about-btn.secondary{
    background:var(--surface-2);
    color:var(--text-soft);
    border:1px solid var(--border);
  }

  .about-btn:hover{
    transform:translateY(-2px);
  }

  @media (min-width:768px){
    .about-hero-stats{
      grid-template-columns:repeat(4, 1fr);
    }

    .about-values-grid{
      grid-template-columns:repeat(2, 1fr);
    }

    .about-team-grid{
      grid-template-columns:repeat(4, 1fr);
    }
  }

  @media (min-width:992px){
    .about-page{
      padding:22px 0 42px;
    }

    .about-hero{
      padding:22px;
    }

    .about-hero-wrap{
      grid-template-columns:minmax(0, 1.05fr) minmax(320px, .95fr);
      gap:20px;
    }

    .about-title{
      font-size:34px;
    }

    .about-story-grid{
      grid-template-columns:1.05fr .95fr;
      gap:18px;
      align-items:start;
    }

    .about-values-grid{
      grid-template-columns:repeat(4, 1fr);
    }
  }

/* contact.php */
.contact-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .contact-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .contact-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .contact-breadcrumb strong{
    color:var(--heading);
  }

  .contact-hero{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:20px;
    background:linear-gradient(135deg, rgba(212,175,55,.10), rgba(255,255,255,.02));
    margin-bottom:16px;
    padding:18px 14px;
  }

  .contact-hero::before{
    content:"";
    position:absolute;
    top:-50px;
    right:-30px;
    width:150px;
    height:150px;
    border-radius:50%;
    background:rgba(212,175,55,.05);
    filter:blur(10px);
  }

  .contact-hero-wrap{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:1fr;
    gap:18px;
    align-items:center;
  }

  .contact-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.18);
    color:var(--accent);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:10px;
  }

  .contact-title{
    font-size:24px;
    line-height:1.1;
    font-weight:900;
    color:var(--heading);
    margin-bottom:10px;
  }

  .contact-text{
    font-size:14px;
    color:var(--text-soft);
    line-height:1.75;
    max-width:760px;
  }

  .contact-quick-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:16px;
  }

  .contact-quick-card{
    padding:14px;
    border-radius:18px;
    border:1px solid var(--border);
    background:var(--surface-2);
  }

  .contact-quick-card strong{
    display:block;
    font-size:18px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:4px;
  }

  .contact-quick-card span{
    display:block;
    font-size:12px;
    color:var(--text-soft);
    font-weight:700;
  }

  .contact-layout{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
  }

  .contact-form-card,
  .contact-info-card,
  .contact-map-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
  }

  .contact-card-head{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--border);
  }

  .contact-card-head h2,
  .contact-card-head h3{
    font-size:18px;
    font-weight:900;
    color:var(--heading);
  }

  .contact-card-body{
    padding:16px;
  }

  .contact-form{
    display:flex;
    flex-direction:column;
    gap:16px;
  }

  .contact-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
  }

  .contact-field{
    display:flex;
    flex-direction:column;
    gap:8px;
  }

  .contact-field label{
    font-size:13px;
    font-weight:800;
    color:var(--text-soft);
  }

  .contact-input-wrap{
    position:relative;
  }

  .contact-input,
  .contact-select,
  .contact-textarea{
    width:100%;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text);
    border-radius:14px;
    outline:none;
    font-size:14px;
    transition:var(--transition);
  }

  .contact-input,
  .contact-select{
    min-height:50px;
    padding:0 46px 0 14px;
  }

  .contact-textarea{
    min-height:140px;
    padding:14px;
    resize:vertical;
  }

  .contact-input::placeholder,
  .contact-textarea::placeholder{
    color:var(--muted-2);
  }

  .contact-input:focus,
  .contact-select:focus,
  .contact-textarea:focus{
    border-color:rgba(212,175,55,.35);
    box-shadow:0 0 0 4px rgba(212,175,55,.06);
  }

  .contact-input-icon{
    position:absolute;
    top:50%;
    right:14px;
    transform:translateY(-50%);
    color:var(--muted);
    font-size:16px;
    pointer-events:none;
  }

  .contact-btn{
    min-height:50px;
    border:none;
    border-radius:14px;
    font-size:14px;
    font-weight:900;
    cursor:pointer;
    transition:var(--transition);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:0 18px;
  }

  .contact-btn.primary{
    background:var(--btn-primary-bg);
    color:#fff;
    box-shadow:var(--btn-primary-shadow);
  }

  .contact-btn.secondary{
    background:var(--surface-2);
    color:var(--text-soft);
    border:1px solid var(--border);
  }

  .contact-btn:hover{
    transform:translateY(-2px);
  }

  .contact-info-list{
    display:flex;
    flex-direction:column;
    gap:12px;
  }

  .contact-info-item{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:14px;
    border-radius:18px;
    border:1px solid var(--border);
    background:var(--surface-2);
  }

  .contact-info-icon{
    width:44px;
    height:44px;
    border-radius:50%;
    background:rgba(212,175,55,.10);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:18px;
    flex-shrink:0;
  }

  .contact-info-content strong{
    display:block;
    font-size:14px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:5px;
  }

  .contact-info-content p,
  .contact-info-content a{
    font-size:13px;
    color:var(--text-soft);
    line-height:1.7;
    display:block;
  }

  .contact-social{
    margin-top:16px;
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }

  .contact-social a{
    width:42px;
    height:42px;
    border-radius:50%;
    background:var(--surface-2);
    border:1px solid var(--border);
    color:var(--primary);
    display:grid;
    place-items:center;
    font-size:15px;
    transition:var(--transition);
  }

  .contact-social a:hover{
    background:var(--btn-primary-bg);
    color:#fff;
    transform:translateY(-2px);
  }

  .contact-map{
    width:100%;
    min-height:280px;
    border:0;
    display:block;
    background:var(--surface-2);
  }

  .contact-note{
    margin-top:14px;
    padding:14px;
    border-radius:16px;
    border:1px solid var(--border);
    background:var(--surface-2);
  }

  .contact-note strong{
    display:block;
    font-size:13px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:6px;
  }

  .contact-note p{
    font-size:12px;
    color:var(--text-soft);
    line-height:1.65;
  }

  @media (min-width:768px){
    .contact-grid{
      grid-template-columns:1fr 1fr;
    }

    .contact-grid .full{
      grid-column:1 / -1;
    }
  }

  @media (min-width:992px){
    .contact-page{
      padding:22px 0 42px;
    }

    .contact-hero{
      padding:22px;
    }

    .contact-title{
      font-size:34px;
    }

    .contact-layout{
      grid-template-columns:minmax(0, 1fr) 360px;
      gap:18px;
      align-items:start;
    }

    .contact-side{
      position:sticky;
      top:84px;
    }
  }

/* blog.php */
.blog-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .blog-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .blog-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .blog-breadcrumb strong{
    color:var(--heading);
  }

  .blog-hero{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:20px;
    background:linear-gradient(135deg, rgba(212,175,55,.10), rgba(255,255,255,.02));
    margin-bottom:16px;
    padding:18px 14px;
  }

  .blog-hero::before{
    content:"";
    position:absolute;
    top:-50px;
    right:-30px;
    width:150px;
    height:150px;
    border-radius:50%;
    background:rgba(212,175,55,.05);
    filter:blur(10px);
  }

  .blog-hero-wrap{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:1fr;
    gap:18px;
    align-items:center;
  }

  .blog-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.18);
    color:var(--accent);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:10px;
  }

  .blog-title{
    font-size:24px;
    line-height:1.1;
    font-weight:900;
    color:var(--heading);
    margin-bottom:10px;
  }

  .blog-text{
    font-size:14px;
    color:var(--text-soft);
    line-height:1.75;
    max-width:760px;
    margin-bottom:14px;
  }

  .blog-search-wrap{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }

  .blog-search-box{
    display:flex;
    align-items:center;
    gap:10px;
    min-height:50px;
    padding:0 14px;
    border-radius:14px;
    background:var(--surface-2);
    border:1px solid var(--border);
  }

  .blog-search-box input{
    width:100%;
    min-width:0;
    border:none;
    outline:none;
    background:transparent;
    color:var(--text);
    font-size:14px;
  }

  .blog-search-box input::placeholder{
    color:var(--muted-2);
  }

  .blog-search-btn{
    min-height:50px;
    border:none;
    border-radius:14px;
    background:var(--btn-primary-bg);
    color:#fff;
    font-size:14px;
    font-weight:900;
    cursor:pointer;
    box-shadow:var(--btn-primary-shadow);
    transition:var(--transition);
    padding:0 18px;
  }

  .blog-search-btn:hover{
    transform:translateY(-2px);
  }

  .blog-layout{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
  }

  .blog-main{
    min-width:0;
    order:1;
  }

  .blog-sidebar{
    min-width:0;
    order:2;
  }

  .blog-featured{
    margin-bottom:16px;
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
  }

  .blog-featured-grid{
    display:grid;
    grid-template-columns:1fr;
  }

  .blog-featured-image{
    min-height:240px;
    overflow:hidden;
    background:var(--surface-2);
  }

  .blog-featured-image img{
    width:100%;
    height:100%;
    min-height:240px;
    object-fit:cover;
    display:block;
  }

  .blog-featured-content{
    padding:18px 16px;
  }

  .blog-meta{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:10px;
  }

  .blog-meta-pill{
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:var(--surface-2);
    border:1px solid var(--border);
    color:var(--text-soft);
    font-size:11px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .blog-featured-content h2{
    font-size:24px;
    line-height:1.25;
    font-weight:900;
    color:var(--heading);
    margin-bottom:10px;
  }

  .blog-featured-content p{
    font-size:14px;
    color:var(--text-soft);
    line-height:1.8;
    margin-bottom:14px;
  }

  .blog-read-btn{
    min-height:44px;
    padding:0 16px;
    border:none;
    border-radius:12px;
    background:var(--btn-primary-bg);
    color:#fff;
    font-size:13px;
    font-weight:900;
    cursor:pointer;
    box-shadow:var(--btn-primary-shadow);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    transition:var(--transition);
  }

  .blog-read-btn:hover{
    transform:translateY(-2px);
  }

  .blog-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
  }

  .blog-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    transition:var(--transition);
  }

  .blog-card:hover{
    transform:translateY(-3px);
    box-shadow:0 14px 34px rgba(0,0,0,.16);
  }

  .blog-card-image{
    height:220px;
    overflow:hidden;
    background:var(--surface-2);
  }

  .blog-card-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:transform .5s ease;
  }

  .blog-card:hover .blog-card-image img{
    transform:scale(1.06);
  }

  .blog-card-content{
    padding:16px;
  }

  .blog-card-content h3{
    font-size:18px;
    line-height:1.35;
    font-weight:900;
    color:var(--heading);
    margin-bottom:10px;
  }

  .blog-card-content p{
    font-size:13px;
    color:var(--text-soft);
    line-height:1.75;
    margin-bottom:14px;
  }

  .blog-card-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
  }

  .blog-author{
    font-size:12px;
    color:var(--muted);
    font-weight:700;
  }

  .blog-link{
    color:var(--primary);
    font-size:13px;
    font-weight:900;
    display:inline-flex;
    align-items:center;
    gap:6px;
  }

  .blog-side-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    margin-bottom:16px;
  }

  .blog-side-card:last-child{
    margin-bottom:0;
  }

  .blog-side-head{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--border);
  }

  .blog-side-head h3{
    font-size:17px;
    font-weight:900;
    color:var(--heading);
  }

  .blog-side-body{
    padding:16px;
  }

  .blog-category-list,
  .blog-post-list,
  .blog-tag-list{
    list-style:none;
    margin:0;
    padding:0;
  }

  .blog-category-list{
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .blog-category-list li a{
    min-height:44px;
    padding:0 14px;
    border-radius:14px;
    background:var(--surface-2);
    border:1px solid var(--border);
    color:var(--text-soft);
    font-size:13px;
    font-weight:800;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    transition:var(--transition);
  }

  .blog-category-list li a:hover{
    color:var(--heading);
    border-color:rgba(212,175,55,.24);
  }

  .blog-post-list{
    display:flex;
    flex-direction:column;
    gap:12px;
  }

  .blog-post-item{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding-bottom:12px;
    border-bottom:1px solid var(--border);
  }

  .blog-post-item:last-child{
    padding-bottom:0;
    border-bottom:none;
  }

  .blog-post-thumb{
    width:78px;
    height:78px;
    border-radius:14px;
    overflow:hidden;
    flex-shrink:0;
    border:1px solid var(--border);
    background:var(--surface-2);
  }

  .blog-post-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }

  .blog-post-info h4{
    font-size:13px;
    line-height:1.5;
    font-weight:900;
    color:var(--heading);
    margin-bottom:6px;
  }

  .blog-post-info span{
    font-size:11px;
    color:var(--muted);
    font-weight:700;
  }

  .blog-tag-list{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }

  .blog-tag-list a{
    min-height:34px;
    padding:0 14px;
    border-radius:999px;
    background:var(--surface-2);
    border:1px solid var(--border);
    color:var(--text-soft);
    font-size:12px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transition:var(--transition);
  }

  .blog-tag-list a:hover{
    color:var(--heading);
    border-color:rgba(212,175,55,.24);
  }

  .blog-pagination{
    margin-top:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
  }

  .blog-page-btn{
    min-width:42px;
    height:42px;
    padding:0 14px;
    border-radius:12px;
    border:1px solid var(--border);
    background:var(--surface);
    color:var(--text-soft);
    font-size:13px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transition:var(--transition);
  }

  .blog-page-btn:hover,
  .blog-page-btn.active{
    background:var(--btn-primary-bg);
    color:#fff;
    border-color:transparent;
    box-shadow:var(--btn-primary-shadow);
  }

  @media (min-width:768px){
    .blog-search-wrap{
      grid-template-columns:1fr auto;
    }

    .blog-search-btn{
      min-width:150px;
    }

    .blog-grid{
      grid-template-columns:repeat(2, 1fr);
    }
  }

  @media (min-width:992px){
    .blog-page{
      padding:22px 0 42px;
    }

    .blog-title{
      font-size:34px;
    }

    .blog-layout{
      grid-template-columns:minmax(0, 1fr) 340px;
      gap:18px;
      align-items:start;
    }

    .blog-sidebar{
      order:2;
      position:sticky;
      top:84px;
    }

    .blog-main{
      order:1;
    }

    .blog-featured-grid{
      grid-template-columns:1.02fr .98fr;
      align-items:stretch;
    }

    .blog-featured-image{
      min-height:100%;
    }

    .blog-grid{
      grid-template-columns:repeat(2, 1fr);
    }
  }

/* shop.php */
.shop-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .shop-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .shop-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .shop-breadcrumb strong{
    color:var(--heading);
  }

  .shop-hero{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:18px;
    background:linear-gradient(135deg, rgba(212,175,55,.08), rgba(255,255,255,.02));
    margin-bottom:16px;
    padding:18px 14px;
  }

  .shop-hero::before{
    content:"";
    position:absolute;
    top:-50px;
    right:-30px;
    width:140px;
    height:140px;
    border-radius:50%;
    background:rgba(212,175,55,.05);
    filter:blur(10px);
  }

  .shop-hero-content{
    position:relative;
    z-index:2;
  }

  .shop-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.18);
    color:var(--accent);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:10px;
  }

  .shop-hero-title{
    font-size:22px;
    line-height:1.12;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .shop-hero-text{
    font-size:13px;
    color:var(--text-soft);
    max-width:760px;
  }

  .shop-layout{
    display:flex;
    flex-direction:column;
    gap:16px;
  }

  .shop-main{
    order:1;
    min-width:0;
  }

  .shop-sidebar{
    order:2;
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    height:max-content;
  }

  .shop-card-head{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
  }

  .shop-card-head h3{
    font-size:15px;
    font-weight:900;
    color:var(--heading);
  }

  .shop-card-head a{
    font-size:12px;
    font-weight:800;
    color:var(--primary);
  }

  .shop-filter-block{
    padding:14px 16px 16px;
    border-bottom:1px solid var(--border);
  }

  .shop-filter-block:last-child{
    border-bottom:none;
  }

  .shop-filter-title{
    font-size:13px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:12px;
  }

  .shop-search{
    display:flex;
    align-items:center;
    gap:8px;
    height:46px;
    padding:0 12px;
    background:var(--surface-2);
    border:1px solid var(--border);
    border-radius:14px;
  }

  .shop-search input{
    width:100%;
    min-width:0;
    border:none;
    outline:none;
    background:transparent;
    color:var(--text);
    font-size:14px;
  }

  .shop-search input::placeholder{
    color:var(--muted-2);
  }

  .shop-category-list,
  .shop-brand-list{
    list-style:none;
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .shop-category-list li,
  .shop-brand-list li{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }

  .shop-check{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:13px;
    color:var(--text-soft);
    font-weight:700;
  }

  .shop-check input{
    accent-color:#d4af37;
    width:16px;
    height:16px;
    flex-shrink:0;
  }

  .shop-count{
    min-width:28px;
    height:24px;
    padding:0 8px;
    border-radius:999px;
    background:var(--surface-2);
    border:1px solid var(--border);
    font-size:11px;
    font-weight:800;
    color:var(--muted);
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .price-range{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-bottom:12px;
  }

  .price-box{
    min-height:46px;
    border-radius:14px;
    background:var(--surface-2);
    border:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
    font-weight:800;
    color:var(--text-soft);
  }

  .filter-btn{
    width:100%;
    min-height:46px;
    border:none;
    border-radius:14px;
    background:var(--btn-primary-bg);
    color:#fff;
    font-size:14px;
    font-weight:800;
    cursor:pointer;
    box-shadow:var(--btn-primary-shadow);
    transition:var(--transition);
  }

  .filter-btn:hover{
    transform:translateY(-2px);
  }

  .shop-toolbar{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:18px;
    padding:14px;
    margin-bottom:14px;
    display:flex;
    flex-direction:column;
    gap:12px;
  }

  .shop-toolbar-top{
    display:flex;
    flex-direction:column;
    gap:12px;
  }

  .shop-result-text{
    font-size:13px;
    color:var(--text-soft);
    font-weight:700;
  }

  .shop-result-text strong{
    color:var(--heading);
  }

  .shop-toolbar-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }

  .shop-select{
    width:100%;
    min-height:44px;
    border-radius:14px;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text-soft);
    font-size:13px;
    font-weight:800;
    padding:0 12px;
    outline:none;
  }

  .shop-chips{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }

  .shop-chip{
    min-height:36px;
    padding:0 14px;
    border-radius:999px;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text-soft);
    font-size:12px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
  }

  .shop-chip.active{
    background:rgba(212,175,55,.12);
    color:var(--accent);
    border-color:rgba(212,175,55,.25);
  }

  .shop-product-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:12px;
  }

  .shop-product-grid .product-card{
    min-height:316px;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--surface);
    padding:12px 10px 14px;
  }

  .shop-product-grid .product-card:nth-child(2n){
    border-right:1px solid var(--border);
  }

  .shop-product-grid .product-actions{
    justify-content:flex-end;
  }

  .shop-product-grid .product-thumb,
  .shop-product-grid .product-thumb img{
    width:96px;
    height:96px;
  }

  .shop-product-grid .product-name{
    max-width:150px;
    min-height:36px;
    font-size:11px;
  }

  .shop-product-grid .product-price{
    font-size:13px;
  }

  .shop-product-grid .old-price{
    font-size:11px;
  }

  .shop-empty-state{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:18px;
    padding:28px 18px;
    text-align:center;
    color:var(--text-soft);
    display:none;
  }

  .shop-empty-state h3{
    font-size:18px;
    color:var(--heading);
    margin-bottom:8px;
  }

  .shop-pagination{
    margin-top:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
  }

  .shop-page-btn{
    min-width:42px;
    height:42px;
    padding:0 14px;
    border-radius:12px;
    border:1px solid var(--border);
    background:var(--surface);
    color:var(--text-soft);
    font-size:13px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transition:var(--transition);
  }

  .shop-page-btn:hover,
  .shop-page-btn.active{
    background:var(--btn-primary-bg);
    color:#fff;
    border-color:transparent;
    box-shadow:var(--btn-primary-shadow);
  }

  .shop-promo-strip{
    margin-top:18px;
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    display:grid;
    grid-template-columns:1fr;
    background:var(--surface);
  }

  .shop-promo-card{
    padding:18px 16px;
    border-bottom:1px solid var(--border);
  }

  .shop-promo-card:last-child{
    border-bottom:none;
  }

  .shop-promo-card h4{
    font-size:16px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .shop-promo-card p{
    font-size:13px;
    color:var(--text-soft);
    margin-bottom:12px;
  }

  .shop-promo-card a{
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:var(--primary);
    font-size:13px;
    font-weight:800;
  }

  @media (min-width:768px){
    .shop-toolbar-top{
      flex-direction:row;
      align-items:center;
      justify-content:space-between;
    }

    .shop-toolbar-actions{
      width:340px;
      flex-shrink:0;
    }

    .shop-product-grid{
      grid-template-columns:repeat(3, 1fr);
    }

    .shop-product-grid .product-card:nth-child(2n){
      border-right:1px solid var(--border);
    }

    .shop-product-grid .product-card:nth-child(3n){
      border-right:1px solid var(--border);
    }
  }

  @media (min-width:992px){
    .shop-page{
      padding:24px 0 42px;
    }

    .shop-hero{
      padding:20px 22px;
      margin-bottom:18px;
    }

    .shop-hero-title{
      font-size:28px;
    }

    .shop-hero-text{
      font-size:14px;
      max-width:760px;
    }

    .shop-layout{
      display:grid;
      grid-template-columns:300px minmax(0, 1fr);
      gap:18px;
      align-items:start;
    }

    .shop-sidebar{
      order:1;
      position:sticky;
      top:84px;
    }

    .shop-main{
      order:2;
    }

    .shop-product-grid{
      grid-template-columns:repeat(4, 1fr);
    }

    .shop-product-grid .product-card{
      min-height:324px;
    }

    .shop-promo-strip{
      grid-template-columns:repeat(3, 1fr);
    }

    .shop-promo-card{
      border-right:1px solid var(--border);
      border-bottom:none;
    }

    .shop-promo-card:last-child{
      border-right:none;
    }
  }

  @media (min-width:1181px){
    .shop-hero-title{
      font-size:30px;
    }

    .shop-product-grid{
      grid-template-columns:repeat(5, 1fr);
    }

    .shop-product-grid .product-card{
      min-height:330px;
    }
  }

/* category.php */
.category-page{
    padding:18px 0 34px;
    background:var(--bg);
  }

  .category-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:14px;
  }

  .category-breadcrumb a{
    color:var(--text-soft);
    font-weight:700;
  }

  .category-breadcrumb strong{
    color:var(--heading);
  }

  .category-hero{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:18px;
    background:
      linear-gradient(135deg, rgba(212,175,55,.10), rgba(255,255,255,.02)),
      linear-gradient(180deg, var(--surface), var(--surface-2));
    margin-bottom:16px;
    padding:18px 14px;
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
  }

  .category-hero::before{
    content:"";
    position:absolute;
    top:-50px;
    right:-30px;
    width:140px;
    height:140px;
    border-radius:50%;
    background:rgba(212,175,55,.05);
    filter:blur(10px);
  }

  .category-hero-content{
    position:relative;
    z-index:2;
  }

  .category-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(212,175,55,.10);
    border:1px solid rgba(212,175,55,.18);
    color:var(--accent);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-bottom:10px;
  }

  .category-hero-title{
    font-size:22px;
    line-height:1.12;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .category-hero-text{
    font-size:13px;
    color:var(--text-soft);
    max-width:700px;
    margin-bottom:12px;
  }

  .category-meta{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }

  .category-meta-item{
    min-height:34px;
    padding:0 14px;
    border-radius:999px;
    background:var(--surface-2);
    border:1px solid var(--border);
    color:var(--text-soft);
    font-size:12px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .category-hero-banner{
    position:relative;
    z-index:2;
    min-height:220px;
    border-radius:18px;
    overflow:hidden;
    border:1px solid var(--border);
    background:var(--surface-2);
  }

  .category-hero-banner img{
    width:100%;
    height:100%;
    object-fit:cover;
  }

  .category-layout{
    display:flex;
    flex-direction:column;
    gap:16px;
  }

  .category-main{
    order:1;
    min-width:0;
  }

  .category-sidebar{
    order:2;
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    height:max-content;
  }

  .category-card-head{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
  }

  .category-card-head h3{
    font-size:15px;
    font-weight:900;
    color:var(--heading);
  }

  .category-card-head a{
    font-size:12px;
    font-weight:800;
    color:var(--primary);
  }

  .category-filter-block{
    padding:14px 16px 16px;
    border-bottom:1px solid var(--border);
  }

  .category-filter-block:last-child{
    border-bottom:none;
  }

  .category-filter-title{
    font-size:13px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:12px;
  }

  .category-list,
  .subcategory-list,
  .brand-list{
    list-style:none;
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .category-list li,
  .subcategory-list li,
  .brand-list li{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }

  .category-check{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:13px;
    color:var(--text-soft);
    font-weight:700;
  }

  .category-check input{
    accent-color:#d4af37;
    width:16px;
    height:16px;
    flex-shrink:0;
  }

  .category-count{
    min-width:28px;
    height:24px;
    padding:0 8px;
    border-radius:999px;
    background:var(--surface-2);
    border:1px solid var(--border);
    font-size:11px;
    font-weight:800;
    color:var(--muted);
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .price-range{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-bottom:12px;
  }

  .price-box{
    min-height:46px;
    border-radius:14px;
    background:var(--surface-2);
    border:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
    font-weight:800;
    color:var(--text-soft);
  }

  .filter-btn{
    width:100%;
    min-height:46px;
    border:none;
    border-radius:14px;
    background:var(--btn-primary-bg);
    color:#fff;
    font-size:14px;
    font-weight:800;
    cursor:pointer;
    box-shadow:var(--btn-primary-shadow);
    transition:var(--transition);
  }

  .filter-btn:hover{
    transform:translateY(-2px);
  }

  .subcat-strip{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:12px;
    margin-bottom:14px;
  }

  .subcat-card{
    position:relative;
    min-height:120px;
    border-radius:18px;
    overflow:hidden;
    border:1px solid var(--border);
    background:var(--surface);
    isolation:isolate;
  }

  .subcat-card img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:.72;
    transition:transform .5s ease;
  }

  .subcat-card::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.60));
    z-index:1;
  }

  .subcat-card:hover img{
    transform:scale(1.06);
  }

  .subcat-content{
    position:relative;
    z-index:2;
    height:100%;
    padding:14px;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    color:#fff;
  }

  .subcat-content h4{
    font-size:15px;
    font-weight:900;
    margin-bottom:4px;
  }

  .subcat-content p{
    font-size:12px;
    color:rgba(255,255,255,.86);
  }

  .category-toolbar{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:18px;
    padding:14px;
    margin-bottom:14px;
    display:flex;
    flex-direction:column;
    gap:12px;
  }

  .category-toolbar-top{
    display:flex;
    flex-direction:column;
    gap:12px;
  }

  .category-result-text{
    font-size:13px;
    color:var(--text-soft);
    font-weight:700;
  }

  .category-result-text strong{
    color:var(--heading);
  }

  .category-toolbar-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }

  .category-select{
    width:100%;
    min-height:44px;
    border-radius:14px;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text-soft);
    font-size:13px;
    font-weight:800;
    padding:0 12px;
    outline:none;
  }

  .category-chips{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }

  .category-chip{
    min-height:36px;
    padding:0 14px;
    border-radius:999px;
    border:1px solid var(--border);
    background:var(--surface-2);
    color:var(--text-soft);
    font-size:12px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
  }

  .category-chip.active{
    background:rgba(212,175,55,.12);
    color:var(--accent);
    border-color:rgba(212,175,55,.25);
  }

  .category-product-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:12px;
  }

  .category-product-grid .product-card{
    min-height:316px;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--surface);
    padding:12px 10px 14px;
  }

  .category-product-grid .product-card:nth-child(2n){
    border-right:1px solid var(--border);
  }

  .category-product-grid .product-actions{
    justify-content:flex-end;
  }

  .category-product-grid .product-thumb,
  .category-product-grid .product-thumb img{
    width:96px;
    height:96px;
  }

  .category-product-grid .product-name{
    max-width:150px;
    min-height:36px;
    font-size:11px;
  }

  .category-product-grid .product-price{
    font-size:13px;
  }

  .category-product-grid .old-price{
    font-size:11px;
  }

  .category-empty-state{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:18px;
    padding:28px 18px;
    text-align:center;
    color:var(--text-soft);
    display:none;
  }

  .category-empty-state h3{
    font-size:18px;
    color:var(--heading);
    margin-bottom:8px;
  }

  .category-pagination{
    margin-top:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
  }

  .category-page-btn{
    min-width:42px;
    height:42px;
    padding:0 14px;
    border-radius:12px;
    border:1px solid var(--border);
    background:var(--surface);
    color:var(--text-soft);
    font-size:13px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transition:var(--transition);
  }

  .category-page-btn:hover,
  .category-page-btn.active{
    background:var(--btn-primary-bg);
    color:#fff;
    border-color:transparent;
    box-shadow:var(--btn-primary-shadow);
  }

  .category-info-strip{
    margin-top:18px;
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    display:grid;
    grid-template-columns:1fr;
    background:var(--surface);
  }

  .category-info-card{
    padding:18px 16px;
    border-bottom:1px solid var(--border);
  }

  .category-info-card:last-child{
    border-bottom:none;
  }

  .category-info-card h4{
    font-size:16px;
    font-weight:900;
    color:var(--heading);
    margin-bottom:8px;
  }

  .category-info-card p{
    font-size:13px;
    color:var(--text-soft);
    margin-bottom:12px;
  }

  .category-info-card a{
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:var(--primary);
    font-size:13px;
    font-weight:800;
  }

  @media (min-width:768px){
    .category-toolbar-top{
      flex-direction:row;
      align-items:center;
      justify-content:space-between;
    }

    .category-toolbar-actions{
      width:340px;
      flex-shrink:0;
    }

    .category-product-grid{
      grid-template-columns:repeat(3, 1fr);
    }

    .category-product-grid .product-card:nth-child(2n){
      border-right:1px solid var(--border);
    }

    .category-product-grid .product-card:nth-child(3n){
      border-right:1px solid var(--border);
    }

    .subcat-strip{
      grid-template-columns:repeat(4, 1fr);
    }
  }

  @media (min-width:992px){
    .category-page{
      padding:24px 0 42px;
    }

    .category-hero{
      grid-template-columns:minmax(0, 1.05fr) minmax(320px, .95fr);
      align-items:center;
      padding:22px;
      margin-bottom:18px;
    }

    .category-hero-title{
      font-size:30px;
    }

    .category-hero-text{
      font-size:14px;
    }

    .category-layout{
      display:grid;
      grid-template-columns:300px minmax(0, 1fr);
      gap:18px;
      align-items:start;
    }

    .category-sidebar{
      order:1;
      position:sticky;
      top:84px;
    }

    .category-main{
      order:2;
    }

    .category-product-grid{
      grid-template-columns:repeat(4, 1fr);
    }

    .category-product-grid .product-card{
      min-height:324px;
    }

    .category-info-strip{
      grid-template-columns:repeat(3, 1fr);
    }

    .category-info-card{
      border-right:1px solid var(--border);
      border-bottom:none;
    }

    .category-info-card:last-child{
      border-right:none;
    }
  }

  @media (min-width:1181px){
    .category-hero-title{
      font-size:34px;
    }

    .category-product-grid{
      grid-template-columns:repeat(5, 1fr);
    }

    .category-product-grid .product-card{
      min-height:330px;
    }
  }