/* =========================================================
   OUTLAND — version PC (servie selon le user-agent)
   ========================================================= */
.container {padding: 0 32px; }
.header-inner {justify-content: space-between; }
.nav {display: flex;gap: 38px;position: absolute;left: 50%;transform: translateX(-50%); }
.header-actions {display: flex;align-items: center;gap: 6px; }
.burger, .mnav {display: none; }
.rail {display: grid;grid-template-columns: repeat(4, minmax(0, 1fr));gap: 22px; }

.hero { padding: 90px 0 200px; }
.hero-word {font-size: clamp(90px, 15vw, 220px); }
.hero-title {font-size: 34px; }

.grid.products {grid-template-columns: repeat(4, minmax(0, 1fr));gap: 22px; }
.grid.products.cols-3 {grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pcard:hover {transform: translateY(-6px);border-color: var(--line-2);box-shadow: 0 30px 60px -30px rgba(11, 46, 74, .27); }
.pcard.gold:hover {box-shadow: 0 0 50px -8px rgba(214, 168, 74, .7); }
.pcard.promo:hover {box-shadow: 0 0 50px -10px rgba(255, 92, 168, .75); }
.pcard.new:hover {box-shadow: 0 0 50px -10px rgba(25, 194, 216, .75); }
.pcard:hover .pcard-media img.main {transform: scale(1.06); }
.pcard:hover .pcard-media img.alt {opacity: 1; }
.pcard .quick {position: absolute;left: 12px;right: 12px;bottom: 12px;z-index: 2;opacity: 0;transform: translateY(10px);transition: all .4s var(--ease);height: 42px;font-size: 13px; }
.pcard:hover .quick {opacity: 1;transform: none; }

.shop-layout {display: grid;grid-template-columns: 260px 1fr;gap: 40px;align-items: start; }
.filters {position: sticky;top: calc(var(--header-h) + 24px); }
.filters-toggle {display: none; }
.shop-head .h1 {font-size: 54px; }

.pp-layout {display: grid;grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);gap: 56px;align-items: start; }
.pinfo {position: sticky;top: calc(var(--header-h) + 24px); }
.pinfo-name {font-size: 34px; }
.gallery-main:hover .zoom-hint {opacity: 0; }

.checkout-layout {display: grid;grid-template-columns: minmax(0, 1fr) 420px;gap: 28px;align-items: start; }
.summary {position: sticky;top: calc(var(--header-h) + 24px); }
.mobile-paybar {display: none; }

.spotlight {grid-template-columns: 1fr 1fr; }
.spotlight-media {min-height: 460px; }
.trust {grid-template-columns: repeat(4, 1fr); }
.grid.drops {grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid.reviews {grid-template-columns: repeat(3, minmax(0, 1fr)); }
.reviews-layout {display: grid;grid-template-columns: 360px 1fr;gap: 40px;align-items: start; }
.reviews-side {position: sticky;top: calc(var(--header-h) + 24px);display: grid;gap: 16px; }
.reviews-layout .grid.reviews {grid-template-columns: repeat(2, minmax(0, 1fr)); }
.track-layout {display: grid;grid-template-columns: minmax(0, 1fr) 380px;gap: 24px;align-items: start; }
.about-layout {display: grid;grid-template-columns: 1.1fr .9fr;gap: 60px;align-items: center; }
.values {grid-template-columns: repeat(3, 1fr); }
.footer-grid {grid-template-columns: 2fr 1fr 1fr 1fr; }
.footer-bottom {padding-right: 84px; }

.chat-panel {right: 24px;bottom: 96px;width: 390px;height: min(600px, calc(100vh - 130px));border-radius: 22px; }
.drawer {border-radius: 24px 0 0 24px; }

/* Si la fenêtre PC est étroite, on garde un rendu propre */
@media (max-width: 1100px) {
  .grid.products {grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .nav {gap: 24px; }
  .checkout-layout {grid-template-columns: minmax(0, 1fr) 360px; }
}
@media (max-width: 860px) {
  .container {padding: 0 16px; }
  .nav {display: none; }
  .burger {display: inline-grid; }
  .mnav {display: flex; }
  .rail {grid-template-columns: repeat(2, minmax(0, 1fr));gap: 12px; }
  .grid.products, .grid.products.cols-3 {grid-template-columns: repeat(2, minmax(0, 1fr));gap: 12px; }
  .shop-layout, .pp-layout, .checkout-layout, .reviews-layout, .track-layout, .about-layout, .spotlight {grid-template-columns: 1fr; }
  .filters, .pinfo, .summary, .reviews-side {position: static; }
  .trust, .values, .grid.drops, .grid.reviews, .reviews-layout .grid.reviews {grid-template-columns: 1fr; }
  .footer-grid {grid-template-columns: 1fr 1fr; }
  .chat-panel {right: 16px;left: 16px;width: auto; }
}
