/* V14: layout, type and motion. The existing color palette is retained. */
.brand { gap: 12px; }
.brand-mark-official {
  position: relative;
  display: block;
  flex: 0 0 auto;
  width: 60px;
  height: 44px;
  overflow: hidden;
  background: var(--white);
  border-radius: 10px;
  box-shadow: none;
}
.brand-mark-official img {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 116%;
  max-width: none;
  height: auto;
  transform: translate(-50%, -50%);
  display: block;
}
.brand strong { font-size: 21px; }
.brand small { font-size: 10px; letter-spacing: .17em; line-height: 1.4; }
.nexa-intro { transition-duration: .45s; }
.nexa-intro::before { animation-duration: 1.2s; }
.nexa-intro-inner { gap: 12px; }
.nexa-intro-brand { gap: 22px; animation-duration: .55s; animation-delay: .08s; }
.nexa-intro-brand .brand-mark-official { width: 152px; height: 108px; border-radius: 18px; }
.nexa-intro-brand small { font-size: .8rem; letter-spacing: .2em; line-height: 1.4; }
.nexa-intro-line { animation-duration: .7s; animation-delay: .2s; }
.hero.intro-hero-reveal .hero-photo-wrap { animation-duration: .65s; }
.hero.intro-hero-reveal .hero-copy { animation-duration: .5s; animation-delay: .08s; }

.product-grid { align-items: stretch; gap: 24px; }
.product { display: flex; flex-direction: column; }
.product-image {
  flex: 0 0 auto;
  height: auto;
  aspect-ratio: 1.05;
  overflow: hidden;
}
.product-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
  transition: transform .4s ease;
}
.product-image::after { pointer-events: none; }
.product-info { display: flex; flex-direction: column; flex: 1; padding: 24px; }
.product-info .product-kicker {
  min-height: 0;
  margin: 0 0 10px;
  font-size: .8125rem !important;
  line-height: 1.45;
}
.product-info h3 { font-size: 1.25rem; line-height: 1.35; min-height: 2.7em; margin-bottom: 10px; }
.product-actions { margin: 0 0 16px; }
.product-actions .link-btn { font-size: .875rem; min-height: 32px; }
.product-details p { min-height: 0; font-size: .875rem; line-height: 1.6; }
.size-row { gap: 12px; margin: 10px 0 22px; }
.size-row label { font-size: .875rem; line-height: 1.4; gap: 8px; }
.size-row select { min-height: 48px; font-size: 1rem; }
.product-meta { margin-top: auto; position: static; padding-top: 8px; }
.price { display: inline-block; font-size: 1.5rem; font-weight: 800; line-height: 1.2; font-variant-numeric: tabular-nums; }
.add-btn { min-height: 46px; padding: 12px 18px; font-size: .875rem; }
.badge360 span:last-child { font-size: .875rem !important; }
.reveal { transform: translateY(16px); transition: opacity .5s ease var(--reveal-delay, 0ms), transform .5s ease var(--reveal-delay, 0ms); }
.product.reveal { transition: opacity .5s ease var(--reveal-delay, 0ms), transform .5s ease var(--reveal-delay, 0ms), box-shadow .3s ease !important; }
.reveal.visible { opacity: 1; transform: none; }

.cart-panel { transition: transform .28s cubic-bezier(.2,.8,.2,1); height: 100dvh; }
.overlay { display: block; visibility: hidden; opacity: 0; pointer-events: none; transition: opacity .22s ease, visibility .22s ease; }
.overlay.open { visibility: visible; opacity: 1; pointer-events: auto; }
.cart-added-feedback { margin: 0; padding: 14px 24px; font-size: .875rem; line-height: 1.5; background: var(--paper); color: var(--ink); border-bottom: 1px solid var(--line); }
.cart-added-feedback[hidden] { display: none; }
.cart-total strong { font-size: 1.35rem; font-variant-numeric: tabular-nums; }
.cart-footer p { font-size: .875rem; line-height: 1.5; }
.modal-card, .video-modal-card { animation-duration: .26s; }
.modal.is-closing { pointer-events: none; animation: modalBackdropOut .16s ease both; }
.modal.is-closing .modal-card, .modal.is-closing .video-modal-card { animation: modalOut .16s ease both; }
.nav.open { animation: menuIn .2s ease both; }
@keyframes modalOut { to { opacity: 0; transform: translateY(6px) scale(.99); } }
@keyframes modalBackdropOut { to { opacity: 0; } }
@keyframes menuIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }

@media (hover: hover) and (pointer: fine) {
  .product.reveal.visible:hover { transform: translateY(-5px); }
  .product:hover .product-image img { transform: scale(1.025); }
}
@media (hover: none) {
  .product.reveal.visible:hover, .product:hover .product-image img { transform: none; }
}
@media (max-width: 900px) {
  .header:not(.legal-header) { height: 72px; }
  .header:not(.legal-header) .menu-toggle { display: block; }
  .header:not(.legal-header) .nav { display: none; position: absolute; top: 72px; left: 0; right: 0; padding: 20px; flex-direction: column; align-items: stretch; background: var(--white); border-bottom: 1px solid var(--line); }
  .header:not(.legal-header) .nav.open { display: flex; }
  .header:not(.legal-header) .nav a { min-height: 44px; display: flex; align-items: center; }
}
@media (max-width: 650px) {
  .product-grid > .product { --reveal-delay: 0ms !important; }
  .product-info { padding: 22px; }
  .product-info h3 { min-height: 0; }
  .hero { min-height: 0; padding: 34px 6vw 36px; gap: 28px; }
  .hero h1 { font-size: clamp(2rem, 9.4vw, 2.5rem); line-height: 1.08; }
  .hero .eyebrow { margin-bottom: 12px; }
  .hero-text { font-size: 1rem; line-height: 1.6; margin: 18px 0 20px; }
  .hero-actions { gap: 10px; }
  .hero-actions .btn { min-height: 46px; padding: 0 17px; font-size: .875rem; }
  .hero-points { gap: 8px 14px; margin-top: 18px; font-size: .8125rem; }
  .hero-photo-wrap { border-radius: 24px; }
  .hero-photo-wrap img { height: 250px; }
  .floating-card { left: 12px; bottom: 14px; padding: 11px 13px; gap: 8px; border-radius: 14px; }
  .floating-card strong { font-size: .875rem; }
  .floating-card small { font-size: .75rem; }
  .floating-icon { width: 30px; height: 30px; }
  .photo-tag { display: none; }
  .trust-strip div { padding: 15px 18px; gap: 9px; }
  .trust-strip span { font-size: .875rem; line-height: 1.4; }
  .products-section { padding-top: 48px; padding-bottom: 56px; }
  .section-head { margin-bottom: 26px; }
  .section h2 { font-size: 2rem; line-height: 1.12; }
  .section-intro { font-size: 1rem; margin-bottom: 0; }
  .nexa-intro-brand { gap: 15px; }
  .nexa-intro-brand .brand-mark-official { width: 116px; height: 84px; border-radius: 14px; }
  .nexa-intro-brand strong { font-size: 1.6rem; }
  .nexa-intro-brand small { font-size: .625rem; letter-spacing: .13em; }
  .brand-mark-official { width: 54px; height: 40px; }
  .brand strong { font-size: 19px; }
  .brand small { font-size: 9px; }
  .cart-head, .cart-footer { padding: 20px; }
  .cart-items { padding: 16px 20px; }
  .cart-added-feedback { padding: 12px 20px; }
}
@media (max-width: 380px) {
  .hero-photo-wrap img { height: 220px; }
  .product-info { padding: 18px; }
  .price { font-size: 1.375rem; }
  .add-btn { padding: 10px 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .reveal, .product.reveal, .hero-photo-wrap, .hero-copy, .modal, .modal-card, .video-modal-card, .cart-panel, .overlay, .nav, .product-image img, .btn, .add-btn, .badge360 {
    animation: none !important;
    transition: none !important;
  }
  .reveal { opacity: 1; transform: none; }
  .product:hover, .product:hover .product-image img { transform: none !important; }
}