/* ===== Product hero ===== */
.product-hero{background:var(--white);padding-top:64px;}
.product-hero__grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:56px;align-items:start;}

.product-gallery__main{
  aspect-ratio:4/3.4;border-radius:var(--radius);box-shadow:var(--shadow-md);
  background:linear-gradient(150deg,#274361,#0e1b2c);transition:background .35s ease;
}
.product-gallery__main[data-variant="2"]{background:linear-gradient(150deg,#5c1b22,#0e1b2c);}
.product-gallery__main[data-variant="3"]{background:linear-gradient(150deg,#3d3116,#0e1b2c);}
.product-gallery__main[data-variant="4"]{background:linear-gradient(150deg,#1c3d33,#0e1b2c);}

.product-gallery__thumbs{display:flex;gap:14px;margin-top:16px;}
.product-gallery__thumb{
  flex:1;aspect-ratio:1;border-radius:10px;border:2px solid transparent;
  background:linear-gradient(150deg,#274361,#0e1b2c);opacity:.6;
  transition:opacity var(--transition), border-color var(--transition);
}
.product-gallery__thumb[data-variant="2"]{background:linear-gradient(150deg,#5c1b22,#0e1b2c);}
.product-gallery__thumb[data-variant="3"]{background:linear-gradient(150deg,#3d3116,#0e1b2c);}
.product-gallery__thumb[data-variant="4"]{background:linear-gradient(150deg,#1c3d33,#0e1b2c);}
.product-gallery__thumb:hover{opacity:.85;}
.product-gallery__thumb.is-active{opacity:1;border-color:var(--red-600);}

.product-info .tag{margin-bottom:16px;}
.product-info h2{font-size:clamp(24px,3vw,32px);color:var(--navy-900);margin-bottom:16px;}
.product-info__desc{color:var(--gray-600);font-size:16px;margin-bottom:22px;}

.product-badges{display:flex;gap:10px;margin-bottom:24px;}
.product-badge{
  background:var(--navy-900);color:var(--gold);font-weight:800;font-size:14px;
  padding:8px 18px;border-radius:999px;letter-spacing:.5px;
}

.product-highlights{margin-bottom:28px;}
.product-highlights li{display:flex;align-items:flex-start;gap:10px;margin-bottom:12px;font-size:15px;color:var(--gray-900);}
.product-highlights .icon{color:var(--red-600);margin-top:3px;flex-shrink:0;}

.product-actions{display:flex;gap:16px;flex-wrap:wrap;}
.product-note{margin-top:12px;font-size:13.5px;color:var(--red-600);font-weight:600;min-height:18px;}

/* ===== Features ===== */
.product-features{background:var(--gray-100);}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.feature-card{
  background:var(--white);border:1px solid var(--gray-300);border-radius:var(--radius);
  padding:28px 24px;transition:transform var(--transition), box-shadow var(--transition);
}
.feature-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);}
.feature-card > .icon{width:32px;height:32px;color:var(--red-600);margin-bottom:14px;}
.feature-card h3{font-size:16.5px;color:var(--navy-900);margin-bottom:8px;}
.feature-card p{font-size:14px;color:var(--gray-600);}

/* ===== Specs table ===== */
.product-specs{background:var(--navy-900);color:var(--white);}
.specs-table{border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);overflow:hidden;}
.specs-row{display:grid;grid-template-columns:260px 1fr;border-bottom:1px solid rgba(255,255,255,.1);}
.specs-row:last-child{border-bottom:none;}
.specs-row:nth-child(odd){background:rgba(255,255,255,.03);}
.specs-row span:first-child{padding:16px 24px;font-weight:700;color:var(--gold);font-size:14.5px;}
.specs-row span:last-child{padding:16px 24px;font-size:14.5px;color:#dfe6ee;}

/* ===== Certifications ===== */
.certifications{background:var(--navy-900);color:var(--white);}
.cert-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.cert-card{
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);
  padding:28px 24px;transition:background var(--transition), transform var(--transition);
}
.cert-card:hover{background:rgba(255,255,255,.08);transform:translateY(-6px);}
.cert-card__icon{
  width:48px;height:48px;border-radius:12px;background:rgba(232,163,61,.15);color:var(--gold);
  display:flex;align-items:center;justify-content:center;margin-bottom:16px;
}
.cert-card h3{font-size:16.5px;margin-bottom:10px;}
.cert-card p{font-size:14px;color:#b7c1cf;margin-bottom:18px;min-height:42px;}
.cert-card__btn{
  display:inline-flex;align-items:center;gap:8px;background:transparent;border:1px solid var(--gold);
  color:var(--gold);font-size:13.5px;font-weight:700;padding:9px 16px;border-radius:999px;
  transition:background var(--transition), color var(--transition);
}
.cert-card__btn:hover{background:var(--gold);color:var(--navy-900);}
.cert-card__btn .icon{width:15px;height:15px;}

/* ===== FAQ accordion ===== */
.product-faq{background:var(--gray-100);}
.faq-accordion{display:flex;flex-direction:column;gap:14px;}
.faq-item{
  background:var(--white);border:1px solid var(--gray-300);border-radius:var(--radius);
  overflow:hidden;transition:border-color var(--transition), box-shadow var(--transition);
}
.faq-item[open]{border-color:var(--red-600);box-shadow:var(--shadow-md);}
.faq-item summary{
  list-style:none;cursor:pointer;padding:18px 24px;display:flex;align-items:center;
  justify-content:space-between;gap:16px;font-weight:700;font-size:15.5px;color:var(--navy-900);
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary:hover{background:var(--gray-100);}
.faq-item summary .icon{width:18px;height:18px;color:var(--red-600);flex-shrink:0;transition:transform var(--transition);}
.faq-item[open] summary .icon{transform:rotate(180deg);}
.faq-item__answer{padding:0 24px 20px;color:var(--gray-600);font-size:14.5px;line-height:1.75;}
.faq-item__answer p{margin-bottom:0;}

/* ===== Quote CTA =====
   Cố tình dùng gradient đỏ (giống .cta ở trang chủ) thay vì navy-900 — vì
   section này nằm ngay trên footer (cũng navy-900), dùng cùng màu sẽ dính
   liền không phân biệt được ranh giới 2 khối. */
.product-quote{background:linear-gradient(120deg,var(--red-600),var(--red-700));color:var(--white);}
.product-quote__grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
.product-quote__intro .eyebrow{color:#ffe1e1;}
.product-quote__intro h2{color:var(--white);font-size:clamp(24px,3vw,30px);margin-bottom:14px;}
.product-quote__desc{color:#ffe1e1;font-size:15.5px;line-height:1.7;margin-bottom:24px;}
.product-quote__benefits li{display:flex;align-items:center;gap:10px;color:var(--white);font-size:14.5px;margin-bottom:12px;}
.product-quote__benefits .icon{color:var(--white);flex-shrink:0;}
.product-quote__form{box-shadow:var(--shadow-lg);}

/* ===== Related products ===== */
.related-products{background:var(--white);}

/* ===== Responsive ===== */
@media (max-width:1080px){
  .product-hero__grid{grid-template-columns:1fr;}
  .feature-grid{grid-template-columns:repeat(2,1fr);}
  .cert-grid{grid-template-columns:repeat(2,1fr);}
  .specs-row{grid-template-columns:1fr;}
  .specs-row span:first-child{padding-bottom:4px;}
  .product-quote__grid{grid-template-columns:1fr;}
}
@media (max-width:600px){
  .feature-grid{grid-template-columns:1fr;}
  .cert-grid{grid-template-columns:1fr;}
  .product-gallery__thumbs{gap:8px;}
}