



/* =========================================



   RAXELIS — COMPLETE STYLESHEET



   UPDATED WITH PRODUCT CARD HOVER EFFECT



========================================= */







:root {



  --black: #050505;



  --dark: #0e0e10;



  --card: #131316;



  --red: #e10600;



  --red-dark: #bd261b;



  --white: #fff;



  --muted: #aaaab1;



  --border: #303034;



  --container: 1400px;



}







/* =========================================



   GLOBAL



========================================= */







* {



  box-sizing: border-box;



  margin: 0;



  padding: 0;



}







html {



  scroll-behavior: smooth;



  scroll-padding-top: 85px;



}







body {



  background: var(--black);



  color: var(--white);



  font-family: "Montserrat", sans-serif;



  overflow-x: hidden;



}







body.cart-open {



  overflow: hidden;



}







button,



input {



  font: inherit;



}







button {



  cursor: pointer;



}







a {



  color: inherit;



  text-decoration: none;



}







img,



video {



  display: block;



  max-width: 100%;



}







[hidden] {



  display: none !important;



}







.section-wrap {



  width: min(calc(100% - 70px), var(--container));



  margin-inline: auto;



}







.eyebrow {



  color: #c5c5ca;



  font-size: 10px;



  font-weight: 800;



  letter-spacing: 2.5px;



  text-transform: uppercase;



}







h1,



h2,



h3,



h4 {



  line-height: 1.13;



}







h1 em,



h2 em {



  color: var(--red);



  font-style: normal;



}







/* =========================================



   NAVIGATION



========================================= */







.navbar {



  position: fixed;



  z-index: 1000;



  inset: 0 0 auto;



  height: 74px;



  padding: 0 5%;



  display: flex;



  align-items: center;



  justify-content: space-between;



  gap: 25px;



  background: rgba(0, 0, 0, 0.95);



  border-bottom: 1px solid #303034;



}







.navbar.scrolled {



  box-shadow: 0 8px 30px #0008;



}







.brand {



  font-size: 29px;



  font-weight: 900;



  letter-spacing: -1.5px;



  white-space: nowrap;



}







.brand span {



  color: var(--red);



}







.nav-links {



  display: flex;



  align-items: center;



  gap: clamp(16px, 2.6vw, 42px);



}







.nav-links > a,



.nav-dropdown-toggle {



  color: white;



  font-size: 11px;



  font-weight: 800;



  letter-spacing: 1px;



}







.nav-links a:hover,



.nav-dropdown-toggle:hover {



  color: #ff6b60;



}







.nav-dropdown {



  position: relative;



}







.nav-dropdown-toggle {



  padding: 14px 0;



  border: 0;



  background: transparent;



}







.nav-dropdown-menu {



  position: absolute;



  display: none;



  top: 100%;



  left: -18px;



  width: 230px;



  padding: 8px 0;



  background: #151518;



  border: 1px solid #3b3b40;



  box-shadow: 0 20px 40px #000a;



}







.nav-dropdown:hover .nav-dropdown-menu,



.nav-dropdown:focus-within .nav-dropdown-menu,



.nav-dropdown.open .nav-dropdown-menu {



  display: block;



}







.nav-dropdown-menu a {



  display: block;



  padding: 14px 18px;



  color: #eee;



  font-size: 11px;



  font-weight: 700;



}







.nav-dropdown-menu a:hover {



  background: #242428;



}







.cart-toggle {



  display: flex;



  align-items: center;



  gap: 12px;



  padding: 10px 12px;



  border: 1px solid #4a4a4f;



  background: transparent;



  color: white;



  font-size: 11px;



  font-weight: 900;



}







.cart-toggle span {



  min-width: 25px;



  padding: 6px;



  background: var(--red);



  text-align: center;



}







.menu-button {



  display: none;



  border: 0;



  background: transparent;



  color: white;



  font-size: 25px;



}







/* =========================================



   HERO / HOME



========================================= */







.hero {



  position: relative;



  min-height: 650px;



  height: 90vh;



  display: flex;



  align-items: center;



  margin-bottom: 0;



  background:



    url("imagens/Stormbound City Beneath Crimson Lightning.png")



    center / cover no-repeat,



    #101013;



}







.hero-overlay {



  position: absolute;



  inset: 0;



  background: linear-gradient(



    90deg,



    #000e 0%,



    #0009 50%,



    #0003 100%



  );



}







.hero-content {



  position: relative;



  z-index: 1;



  width: min(calc(100% - 12%), 1400px);



  margin: 65px auto 0;



}







.hero-content h1 {



  max-width: 950px;



  margin-top: 22px;



  font-size: clamp(45px, 6vw, 88px);



  font-weight: 900;



  letter-spacing: -3px;



}







.hero-content h1 em {



  display: block;



}







.hero-content p {



  max-width: 600px;



  margin-top: 24px;



  color: #dedee0;



  font-size: 13px;



  line-height: 1.9;



}







.primary-button {



  display: inline-flex;



  align-items: center;



  justify-content: center;



  gap: 28px;



  min-height: 55px;



  margin-top: 30px;



  padding: 0 27px;



  background: var(--red-dark);



  color: white;



  font-size: 11px;



  font-weight: 900;



  letter-spacing: 1.1px;



  transition: background 0.2s;



}







.primary-button:hover {



  background: var(--red);



}







.primary-button span {



  font-size: 20px;



}







/* =========================================



   VIDEO SHOWCASE



   FIX: REMOVE BLACK GAP BELOW HOME



========================================= */







.showcase-section {



  padding: 0 0 50px;



  margin-top: 0;



}







.showcase {



  position: relative;



  height: clamp(390px, 43vw, 620px);



  margin-top: 0;



  overflow: hidden;



  background: #0d0d0f;



  border: 1px solid #2d2d32;



}







.showcase-slide {



  position: absolute;



  inset: 0;



  opacity: 0;



  visibility: hidden;



  transition:



    opacity 0.55s ease,



    visibility 0.55s;



}







.showcase-slide.is-active {



  opacity: 1;



  visibility: visible;



}







.showcase-slide video,



.showcase-slide img {



  width: 100%;



  height: 100%;



  object-fit: cover;



  object-position: center;



}







.showcase-overlay {



  position: absolute;



  z-index: 2;



  inset: 0;



  pointer-events: none;



  background: linear-gradient(



    90deg,



    rgba(0, 0, 0, 0.88) 0%,



    rgba(0, 0, 0, 0.6) 37%,



    rgba(0, 0, 0, 0.06) 100%



  );



}







.showcase-content {



  position: absolute;



  z-index: 3;



  left: clamp(24px, 6vw, 90px);



  top: 50%;



  transform: translateY(-50%);



  max-width: 800px;



  pointer-events: none;



}







.showcase-content h2 {



  margin-top: 18px;



  font-size: clamp(42px, 5.5vw, 79px);



  font-weight: 900;



  letter-spacing: -3px;



}







.showcase-content h2 em {



  display: block;



}







.showcase-content p {



  margin-top: 17px;



  color: #eee;



  font-size: 13px;



  line-height: 1.8;



}







.showcase-content .primary-button {



  pointer-events: auto;



}







.showcase-controls {



  position: absolute;



  z-index: 4;



  right: 22px;



  bottom: 20px;



  display: flex;



  align-items: center;



  gap: 9px;



}







.showcase-prev,



.showcase-next {



  width: 40px;



  height: 40px;



  border: 1px solid #777;



  background: #0009;



  color: white;



  font-size: 27px;



}







.showcase-prev:hover,



.showcase-next:hover {



  background: var(--red);



  border-color: var(--red);



}







.showcase-dot {



  width: 10px;



  height: 10px;



  border: 0;



  border-radius: 20px;



  background: #aaa;



}







.showcase-dot.is-active {



  width: 25px;



  background: var(--red);



}







/* =========================================



   COLLECTIONS



========================================= */







.collection {



  padding: 75px 0 90px;



  border-top: 1px solid #29292d;



}







.section-heading {



  display: flex;



  justify-content: space-between;



  align-items: end;



  gap: 30px;



  margin-bottom: 35px;



}







.section-heading h2 {



  margin-top: 15px;



  font-size: clamp(32px, 3.5vw, 49px);



  font-weight: 900;



  letter-spacing: -1.5px;



}







.section-heading > p {



  max-width: 360px;



  color: #aaaab1;



  font-size: 12px;



  line-height: 1.9;



}







/* =========================================



   PRODUCT GRID



========================================= */







.product-grid {



  display: grid;



  grid-template-columns: repeat(3, minmax(0, 1fr));



  gap: 23px;



  align-items: stretch;



}







/* =========================================



   PRODUCT CARD



   NEW: SMOOTH LIFT / "PULINHO"



========================================= */







.product-card {



  position: relative;



  min-width: 0;



  display: flex;



  flex-direction: column;



  background: var(--card);



  border: 1px solid #343439;







  transform: translateY(0);







  transition:



    transform 0.3s ease,



    border-color 0.3s ease,



    box-shadow 0.3s ease;



}







.product-card:hover {



  transform: translateY(-8px);



  border-color: #6d3c39;



  box-shadow: 0 16px 35px rgba(0, 0, 0, 0.35);



  z-index: 2;



}







.product-gallery {



  background: #101013;



}







/* =========================================



   PRODUCT MAIN IMAGE



========================================= */







.product-image {



  position: relative;



  height: 290px;



  overflow: hidden;



  background: #101013;



  isolation: isolate;



}







.product-image > img {



  position: absolute;



  inset: 0;



  width: 100%;



  height: 100%;



  padding: 18px;



  object-fit: contain;



  object-position: center;



  transition: opacity 0.25s ease;



}







.product-front {



  opacity: 1;



}







.product-back {



  opacity: 0;



}







.product-image[data-current-image="1"] .product-front {



  opacity: 0;



}







.product-image[data-current-image="1"] .product-back {



  opacity: 1;



}







/* =========================================



   PRODUCT GALLERY ARROWS



   HIDDEN UNTIL IMAGE HOVER



========================================= */







.product-gallery-arrow {



  position: absolute;



  z-index: 5;



  top: 50%;



  width: 35px;



  height: 42px;



  border: 1px solid #666;



  background: #0009;



  color: white;



  font-size: 27px;







  opacity: 0;



  visibility: hidden;







  transform: translateY(-50%) scale(0.9);







  transition:



    opacity 0.25s ease,



    visibility 0.25s ease,



    transform 0.25s ease,



    background 0.25s ease,



    border-color 0.25s ease;



}







.product-gallery-arrow.prev {



  left: 9px;



}







.product-gallery-arrow.next {



  right: 9px;



}







.product-image:hover .product-gallery-arrow,



.product-image:focus-within .product-gallery-arrow {



  opacity: 1;



  visibility: visible;



  transform: translateY(-50%) scale(1);



}







.product-gallery-arrow:hover {



  background: var(--red);



  border-color: var(--red);



}







/* =========================================



   PRODUCT THUMBNAILS



========================================= */







.product-thumbnails {



  display: flex;



  justify-content: center;



  align-items: center;



  gap: 10px;



  min-height: 76px;



  padding: 9px;



  background: #101013;



}







.product-thumbnail {



  width: 58px;



  height: 58px;



  padding: 5px;



  border: 1px solid #44444a;



  background: #101013;



  overflow: hidden;



}







.product-thumbnail.active {



  border-color: var(--red);



}







.product-thumbnail img {



  width: 100%;



  height: 100%;



  object-fit: contain;



  object-position: center;



}







/* =========================================



   PRODUCT INFORMATION



========================================= */







.product-info {



  display: flex;



  flex-direction: column;



  flex: 1;



  padding: 22px 22px;



}







.product-tag {



  margin-bottom: 13px;



  color: #b2b2b9;



  font-size: 10px;



  letter-spacing: 1.6px;



}







.product-info h3 {



  font-size: 22px;



  font-weight: 900;



  letter-spacing: -0.5px;



}







.product-description {



  min-height: 38px;



  margin-top: 13px;



  color: #b2b2b9;



  font-size: 12px;



  line-height: 1.8;



}







.product-price {



  margin: 15px 0 6px;



  font-size: 32px;



  font-weight: 900;



}







/* =========================================



   MULTI-BUY OFFERS



========================================= */







.offer-box {



  margin-top: auto;



  padding: 17px 19px;



  background: #1d1112;



  border: 1px solid #663534;



}







.offer-heading {



  padding-bottom: 9px;



  color: #ff756d;



  font-size: 10px;



  font-weight: 900;



  letter-spacing: 1.3px;



}







.offer-line {



  display: flex;



  align-items: center;



  justify-content: space-between;



  gap: 10px;



  padding: 8px 0;



  border-top: 1px solid #4b3031;



  color: #ddd;



  font-size: 12px;



}







.offer-line strong {



  color: white;



  font-size: 15px;



  font-weight: 900;



}







.add-button {



  width: 100%;



  min-height: 53px;



  margin-top: 19px;



  border: 0;



  background: var(--red-dark);



  color: white;



  font-size: 11px;



  font-weight: 900;



  letter-spacing: 1.2px;



}







.add-button:hover {



  background: var(--red);



}







/* =========================================



   ABOUT RAXELIS



========================================= */







.about-section {



  padding: 105px 0;



  background: #101013;



  border-top: 1px solid #29292d;



}







.about-layout {



  display: grid;



  grid-template-columns: 1fr 1fr;



  gap: 65px;



  align-items: center;



}







.about-content h2 {



  margin: 22px 0 27px;



  font-size: clamp(35px, 4.1vw, 59px);



  font-weight: 900;



  letter-spacing: -2px;



}







.about-content h2 em {



  display: block;



}







.about-content p {



  margin-top: 16px;



  max-width: 610px;



  color: #bcbcc2;



  font-size: 13px;



  line-height: 2;



}







.text-link {



  display: inline-block;



  margin-top: 30px;



  color: #ff6b60;



  font-size: 12px;



  font-weight: 900;



  letter-spacing: 1px;



}







.about-image {



  height: 420px;



  overflow: hidden;



  border: 1px solid #35353a;



}







.about-image img {



  width: 100%;



  height: 100%;



  object-fit: cover;



}







/* =========================================



   CERTIFICATIONS



========================================= */







.certifications {



  padding-top: 100px;



  padding-bottom: 110px;



}







.section-description {



  max-width: 750px;



  margin-bottom: 30px;



  color: #b7b7be;



  font-size: 13px;



  line-height: 1.9;



}







.certificate-list {



  display: grid;



  grid-template-columns: repeat(2, minmax(0, 1fr));



  gap: 17px;



}







.certificate-card {



  display: flex;



  align-items: center;



  justify-content: space-between;



  gap: 18px;



  min-height: 125px;



  padding: 25px;



  background: #151518;



  border: 1px solid #39393e;



  transition: border-color 0.2s;



}







.certificate-card:hover {



  border-color: var(--red);



}







.certificate-card strong {



  display: block;



  font-size: 13px;



  line-height: 1.6;



}







.certificate-card small {



  display: block;



  margin-top: 9px;



  color: #a8a8af;



  font-size: 11px;



  line-height: 1.7;



}







.certificate-card .pdf-arrow {



  color: #ff6b60;



  font-size: 12px;



  font-weight: 900;



  white-space: nowrap;



}







/* =========================================



   CONTACT



========================================= */







.contact-section {



  padding: 105px 0;



  background: #101013;



  border-top: 1px solid #2b2b30;



}







.contact-section h2 {



  margin-top: 18px;



  font-size: clamp(40px, 5vw, 70px);



  font-weight: 900;



  letter-spacing: -2px;



}







.contact-section > .section-wrap > p {



  margin-top: 20px;



  max-width: 650px;



  color: #bcbcc2;



  font-size: 13px;



  line-height: 1.9;



}







.social-grid {



  display: grid;



  grid-template-columns: repeat(2, minmax(0, 1fr));



  gap: 18px;



  margin-top: 36px;



}







.social-card {



  display: flex;



  align-items: center;



  gap: 20px;



  min-height: 115px;



  padding: 27px 30px;



  background: #17171a;



  border: 1px solid #38383e;







  transition:



    border-color 0.2s,



    background 0.2s;



}







.social-card:hover {



  border-color: var(--red);



  background: #1d191b;



}







.social-icon {



  display: grid;



  place-items: center;



  flex: 0 0 38px;



  color: white;



}







.social-icon svg {



  width: 30px;



  height: 30px;



  fill: none;



  stroke: currentColor;



  stroke-width: 1.8;



}







.social-copy {



  min-width: 0;



}







.social-copy strong {



  display: block;



  font-size: 14px;



  font-weight: 900;



}







.social-copy small {



  display: block;



  margin-top: 7px;



  color: #b4b4bc;



  font-size: 11px;



  overflow-wrap: anywhere;



}







.social-arrow {



  margin-left: auto;



  color: #f45a4d;



  font-size: 27px;



}







/* =========================================



   FOOTER



========================================= */







.footer {



  padding: 65px 0 25px;



  background: #080809;



  border-top: 1px solid #2c2c30;



}







.footer-layout {



  display: flex;



  justify-content: space-between;



  gap: 30px;



  padding-bottom: 48px;



}







.footer-layout p {



  margin-top: 14px;



  color: #aaa;



  font-size: 11px;



  letter-spacing: 1px;



}







.footer-links {



  display: flex;



  flex-wrap: wrap;



  gap: 22px;



}







.footer-links a {



  font-size: 11px;



  color: #ccc;



}







.footer-links a:hover {



  color: #ff6b60;



}







.footer-bottom {



  padding-top: 23px;



  border-top: 1px solid #29292d;



  color: #929299;



  font-size: 10px;



}







/* =========================================



   FLOATING WHATSAPP



========================================= */







.floating-whatsapp {



  position: fixed;



  z-index: 900;



  right: 24px;



  bottom: 24px;



  display: grid;



  place-items: center;



  width: 57px;



  height: 57px;



  border-radius: 50%;



  background: #55c66d;



  color: white;



  box-shadow: 0 5px 25px #0008;



}







.floating-whatsapp svg {



  width: 29px;



  height: 29px;



  fill: none;



  stroke: currentColor;



  stroke-width: 1.8;



}







/* =========================================



   CART



========================================= */







.cart-backdrop {



  position: fixed;



  z-index: 1100;



  inset: 0;



  background: #000b;



}







.cart-panel {



  position: fixed;



  z-index: 1200;



  top: 0;



  right: 0;



  display: flex;



  flex-direction: column;



  width: min(100%, 500px);



  height: 100dvh;



  background: #121215;



  border-left: 1px solid #39393e;



  transform: translateX(105%);



  transition: transform 0.3s;



}







.cart-panel.open {



  transform: translateX(0);



}







.cart-header {



  display: flex;



  justify-content: space-between;



  align-items: center;



  padding: 25px;



  border-bottom: 1px solid #343439;



}







.cart-header h2 {



  margin-top: 8px;



  font-size: 26px;



  font-weight: 900;



}







.cart-close {



  width: 37px;



  height: 37px;



  border: 1px solid #555;



  background: transparent;



  color: white;



  font-size: 25px;



}







.cart-items {



  flex: 1;



  padding: 20px;



  overflow-y: auto;



}







.empty-cart {



  padding: 25px 5px;



  color: #aaa;



  font-size: 13px;



  line-height: 1.8;



}







.cart-product {



  display: grid;



  grid-template-columns: 110px minmax(0, 1fr);



  gap: 17px;



  padding: 20px 0;



  border-bottom: 1px solid #333338;



}







.cart-product > img {



  width: 110px;



  height: 120px;



  padding: 8px;



  object-fit: contain;



  background: #19191d;



  border: 1px solid #333338;



}







.cart-product-info h3 {



  font-size: 15px;



  font-weight: 900;



}







.unit-price {



  margin-top: 9px;



  color: #aaa;



  font-size: 11px;



}







.line-total {



  margin-top: 12px;



  font-size: 23px;



  font-weight: 900;



}







.discount-note {



  margin-top: 7px;



  color: #8fd99b;



  font-size: 11px;



  font-weight: 800;



}







/* =========================================



   QUANTITY CONTROL



========================================= */







.quantity-control {



  display: inline-flex;



  align-items: center;



  justify-content: space-between;



  min-width: 165px;



  height: 44px;



  margin-top: 15px;



  padding: 3px 6px;



  border: 2px solid var(--red);



  border-radius: 999px;



  background: #0c0c0e;



}







.quantity-control button {



  display: grid;



  place-items: center;



  width: 38px;



  height: 34px;



  border: 0;



  border-radius: 50%;



  background: transparent;



  color: white;



  font-size: 22px;



}







.quantity-control button:hover {



  background: #a21e1b55;



}







.quantity-control .qty {



  min-width: 30px;



  text-align: center;



  font-size: 16px;



  font-weight: 900;



}







.cart-summary {



  padding: 22px 25px 25px;



  background: #0e0e10;



  border-top: 1px solid #3b3b40;



}







.cart-summary-row {



  display: flex;



  justify-content: space-between;



  gap: 15px;



  margin-bottom: 15px;



  color: #b9b9c0;



  font-size: 11px;



  font-weight: 700;



}







.cart-summary-row strong {



  color: white;



  font-size: 14px;



}







.savings-row,



.savings-row strong {



  color: #8fd99b;



}







.cart-total-row {



  align-items: center;



  padding-top: 18px;



  border-top: 1px solid #37373c;



  color: white;



  font-size: 13px;



  font-weight: 900;



}







.cart-total-row strong {



  font-size: 24px;



}







.checkout-button {



  width: 100%;



  min-height: 52px;



  margin-top: 10px;



  border: 0;



  background: var(--red-dark);



  color: white;



  font-size: 11px;



  font-weight: 900;



}







.checkout-button:disabled {



  opacity: 0.65;



  cursor: not-allowed;



}







.checkout-note {



  margin-top: 12px;



  color: #929299;



  text-align: center;



  font-size: 10px;



  line-height: 1.6;



}







/* =========================================



   TABLET



========================================= */







@media (max-width: 1100px) {



  .product-grid {



    grid-template-columns: repeat(2, minmax(0, 1fr));



  }







  .nav-links {



    gap: 17px;



  }







  .nav-links > a,



  .nav-dropdown-toggle {



    font-size: 10px;



  }







  .about-layout {



    gap: 35px;



  }



}







/* =========================================



   MOBILE NAVIGATION



========================================= */







@media (max-width: 800px) {



  .navbar {



    height: 66px;



    padding: 0 20px;



  }







  .brand {



    font-size: 25px;



  }







  .menu-button {



    display: block;



    order: 3;



  }







  .cart-toggle {



    margin-left: auto;



  }







  .nav-links {



    position: absolute;



    top: 66px;



    left: 0;



    right: 0;



    display: none;



    flex-direction: column;



    align-items: stretch;



    gap: 0;



    padding: 15px 22px;



    background: #101013;



    border-bottom: 1px solid #39393e;



  }







  .nav-links.open {



    display: flex;



  }







  .nav-links > a,



  .nav-dropdown-toggle {



    display: block;



    width: 100%;



    padding: 14px 0;



    font-size: 12px;



    text-align: left;



  }







  .nav-dropdown-menu {



    position: static;



    width: 100%;



    box-shadow: none;



  }







  .nav-dropdown:hover:not(.open) .nav-dropdown-menu {



    display: none;



  }







  .nav-dropdown.open .nav-dropdown-menu {



    display: block;



  }







  .hero {



    min-height: 570px;



    height: 80vh;



  }







  .hero-content h1 {



    font-size: clamp(42px, 8vw, 65px);



  }







  .about-layout {



    grid-template-columns: 1fr;



  }







  .about-image {



    height: 350px;



  }



}







/* =========================================



   SMALL SCREENS



========================================= */







@media (max-width: 600px) {



  .section-wrap {



    width: calc(100% - 30px);



  }







  .hero-content {



    width: calc(100% - 40px);



  }







  .hero-content h1 {



    font-size: clamp(38px, 10vw, 55px);



    letter-spacing: -2px;



  }







  .showcase-section {



    padding: 0 0 30px;



  }







  .showcase {



    height: 390px;



  }







  .showcase-content {



    left: 22px;



    right: 18px;



  }







  .showcase-content h2 {



    font-size: clamp(37px, 9vw, 53px);



    letter-spacing: -2px;



  }







  .showcase-content p {



    font-size: 11px;



  }







  .showcase-content .primary-button {



    min-height: 48px;



    padding: 0 16px;



    font-size: 9px;



  }







  .showcase-controls {



    right: 10px;



    bottom: 10px;



  }







  .showcase-prev,



  .showcase-next {



    width: 32px;



    height: 32px;



  }







  .collection {



    padding: 55px 0 65px;



  }







  .section-heading {



    display: block;



  }







  .section-heading h2 {



    font-size: 33px;



  }







  .section-heading > p {



    margin-top: 13px;



  }







  .product-grid {



    grid-template-columns: 1fr;



  }







  .product-image {



    height: 300px;



  }







  .product-info {



    padding: 23px 20px;



  }







  .about-section,



  .contact-section {



    padding: 65px 0;



  }







  .about-content h2 {



    font-size: 36px;



  }







  .about-image {



    height: 270px;



  }







  .certifications {



    padding-top: 65px;



    padding-bottom: 65px;



  }







  .certificate-list,



  .social-grid {



    grid-template-columns: 1fr;



  }







  .contact-section h2 {



    font-size: 41px;



  }







  .social-card {



    min-height: 95px;



    padding: 20px;



  }







  .footer-layout {



    flex-direction: column;



  }







  .footer-links {



    gap: 14px;



  }







  .cart-product {



    grid-template-columns: 95px minmax(0, 1fr);



  }







  .cart-product > img {



    width: 95px;



    height: 110px;



  }







  .quantity-control {



    min-width: 150px;



  }







  .floating-whatsapp {



    right: 15px;



    bottom: 15px;



    width: 50px;



    height: 50px;



  }



}







/* =========================================



   TOUCH DEVICES



========================================= */







@media (hover: none) {



  .product-gallery-arrow {



    display: none;



  }







  .product-card:hover {



    transform: none;



    box-shadow: none;



  }







  .product-thumbnails {



    display: flex;



  }



}







/* =========================================



   REDUCED MOTION



========================================= */







@media (prefers-reduced-motion: reduce) {



  *,



  *::before,



  *::after {



    scroll-behavior: auto !important;



    transition-duration: 0.01ms !important;



  }



}







/* =========================================



   END OF RAXELIS STYLESHEET



========================================= */



/* COMPACT PRODUCT CARDS — 10 NOV 2026 */

.product-image { height: 255px; }

.product-image > img { padding: 13px; }

.product-thumbnails { min-height: 58px; padding: 6px; }

.product-thumbnail { width: 46px; height: 46px; }

.product-info { padding: 19px 20px; }

.product-tag { margin-bottom: 8px; }

.product-description { min-height: 0; margin-top: 8px; line-height: 1.5; }

.product-price { margin: 12px 0; font-size: 29px; }

.add-button { min-height: 47px; margin: 0 0 14px; }

.offer-box { margin-top: auto; padding: 10px 13px; }

.offer-heading { padding-bottom: 7px; }

.offer-line { padding: 7px 0; }

@media (max-width: 700px) { .product-image { height: 250px; } }



/* RAXELIS showcase: ensure only active media is visible */

.showcase { position: relative; overflow: hidden; isolation: isolate; }

.showcase-slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .6s ease, visibility .6s ease; }

.showcase-slide.is-active { opacity: 1; visibility: visible; pointer-events: auto; }

.showcase-slide video, .showcase-slide img { width: 100%; height: 100%; object-fit: cover; }

.showcase-overlay { pointer-events: none; }

.showcase-controls { z-index: 5; }

/* RAXELIS 2026 — static showcase + portrait ABOUT carousel */
.showcase-static {position:relative; isolation:isolate;}
.showcase-static .showcase-background {position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center;}
.about-video-gallery {width:100%; max-width:360px; justify-self:center; display:flex; flex-direction:column; align-items:center; gap:14px; min-width:0;}
.about-video-frame {position:relative; width:100%; aspect-ratio:9 / 16; overflow:hidden; background:#101013; border:1px solid #3a3a40;}
.about-video {position:absolute; inset:0; width:100%; height:100%; object-fit:contain; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .35s ease;}
.about-video.is-active {opacity:1; visibility:visible; pointer-events:auto;}
.about-video-controls {display:flex; justify-content:center; align-items:center; gap:13px;}
.about-video-prev,.about-video-next {width:38px;height:38px;background:#17171b;color:#fff;border:1px solid #555;font-size:27px;line-height:1;}
.about-video-prev:hover,.about-video-next:hover {background:#e10600;border-color:#e10600;}
.about-video-dot {width:9px;height:9px;border:0;border-radius:20px;background:#777;transition:width .2s;}
.about-video-dot.is-active {width:23px;background:#e10600;}
@media(max-width:850px){.about-video-gallery{max-width:min(330px,100%);margin:12px auto 0;}.about-layout{grid-template-columns:1fr;}}
@media(max-width:480px){.about-video-gallery{max-width:min(290px,100%);}}

/* Alinhar o vídeo com o título BUILT FOR */
.about-layout {
  align-items: start;
}

.about-video-gallery {
  margin-top: 65px;
}
@media (max-width: 600px) {



  .section-wrap {



    width: calc(100% - 30px);



  }







  .hero-content {



    width: calc(100% - 40px);



  }







  .hero-content h1 {



    font-size: clamp(38px, 10vw, 55px);



    letter-spacing: -2px;



  }







  .showcase-section {



    padding: 0 0 30px;



  }







  .showcase {



    height: 390px;



  }







  .showcase-content {



    left: 22px;



    right: 18px;



  }







  .showcase-content h2 {



    font-size: clamp(37px, 9vw, 53px);



    letter-spacing: -2px;



  }







  .showcase-content p {



    font-size: 11px;



  }







  .showcase-content .primary-button {



    min-height: 48px;



    padding: 0 16px;



    font-size: 9px;



  }







  .showcase-controls {



    right: 10px;



    bottom: 10px;



  }







  .showcase-prev,



  .showcase-next {



    width: 32px;



    height: 32px;



  }







  .collection {



    padding: 55px 0 65px;



  }







  .section-heading {



    display: block;



  }







  .section-heading h2 {



    font-size: 33px;



  }







  .section-heading > p {



    margin-top: 13px;



  }







  .product-grid {



    grid-template-columns: 1fr;



  }







  .product-image {



    height: 300px;



  }







  .product-info {



    padding: 23px 20px;



  }







  .about-section,



  .contact-section {



    padding: 65px 0;



  }







  .about-content h2 {



    font-size: 36px;



  }







  .about-image {



    height: 270px;



  }







  .certifications {



    padding-top: 65px;



    padding-bottom: 65px;



  }







  .certificate-list,



  .social-grid {



    grid-template-columns: 1fr;



  }







  .contact-section h2 {



    font-size: 41px;



  }







  .social-card {



    min-height: 95px;



    padding: 20px;



  }







  .footer-layout {



    flex-direction: column;



  }







  .footer-links {



    gap: 14px;



  }







  .cart-product {



    grid-template-columns: 95px minmax(0, 1fr);



  }







  .cart-product > img {



    width: 95px;



    height: 110px;



  }







  .quantity-control {



    min-width: 150px;



  }







  .floating-whatsapp {



    right: 15px;



    bottom: 15px;



    width: 50px;



    height: 50px;



  }



}







/* =========================================



   TOUCH DEVICES



========================================= */







@media (hover: none) {



  .product-gallery-arrow {



    display: none;



  }







  .product-card:hover {



    transform: none;



    box-shadow: none;



  }







  .product-thumbnails {



    display: flex;



  }



}







/* =========================================



   REDUCED MOTION



========================================= */







@media (prefers-reduced-motion: reduce) {



  *,



  *::before,



  *::after {



    scroll-behavior: auto !important;



    transition-duration: 0.01ms !important;



  }



}







/* =========================================



   END OF RAXELIS STYLESHEET



========================================= */



/* COMPACT PRODUCT CARDS — 10 NOV 2026 */

.product-image { height: 255px; }

.product-image > img { padding: 13px; }

.product-thumbnails { min-height: 58px; padding: 6px; }

.product-thumbnail { width: 46px; height: 46px; }

.product-info { padding: 19px 20px; }

.product-tag { margin-bottom: 8px; }

.product-description { min-height: 0; margin-top: 8px; line-height: 1.5; }

.product-price { margin: 12px 0; font-size: 29px; }

.add-button { min-height: 47px; margin: 0 0 14px; }

.offer-box { margin-top: auto; padding: 10px 13px; }

.offer-heading { padding-bottom: 7px; }

.offer-line { padding: 7px 0; }

@media (max-width: 700px) { .product-image { height: 250px; } }



/* RAXELIS showcase: ensure only active media is visible */

.showcase { position: relative; overflow: hidden; isolation: isolate; }

.showcase-slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .6s ease, visibility .6s ease; }

.showcase-slide.is-active { opacity: 1; visibility: visible; pointer-events: auto; }

.showcase-slide video, .showcase-slide img { width: 100%; height: 100%; object-fit: cover; }

.showcase-overlay { pointer-events: none; }

.showcase-controls { z-index: 5; }

/* RAXELIS 2026 — static showcase + portrait ABOUT carousel */
.showcase-static {position:relative; isolation:isolate;}
.showcase-static .showcase-background {position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center;}
.about-video-gallery {width:100%; max-width:360px; justify-self:center; display:flex; flex-direction:column; align-items:center; gap:14px; min-width:0;}
.about-video-frame {position:relative; width:100%; aspect-ratio:9 / 16; overflow:hidden; background:#101013; border:1px solid #3a3a40;}
.about-video {position:absolute; inset:0; width:100%; height:100%; object-fit:contain; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .35s ease;}
.about-video.is-active {opacity:1; visibility:visible; pointer-events:auto;}
.about-video-controls {display:flex; justify-content:center; align-items:center; gap:13px;}
.about-video-prev,.about-video-next {width:38px;height:38px;background:#17171b;color:#fff;border:1px solid #555;font-size:27px;line-height:1;}
.about-video-prev:hover,.about-video-next:hover {background:#e10600;border-color:#e10600;}
.about-video-dot {width:9px;height:9px;border:0;border-radius:20px;background:#777;transition:width .2s;}
.about-video-dot.is-active {width:23px;background:#e10600;}
@media(max-width:850px){.about-video-gallery{max-width:min(330px,100%);margin:12px auto 0;}.about-layout{grid-template-columns:1fr;}}
@media(max-width:480px){.about-video-gallery{max-width:min(290px,100%);}}

.product-documentation {
  display: inline-block;
  margin: 0.5rem 0;
  color: inherit;
  text-underline-offset: 0.2em;
}

.checkout-return {
  margin-block: 1rem;
}

#delivery-returns {
  scroll-margin-top: 7rem;
}

@media (max-width: 600px) {
  .section-wrap,
  .hero-content {
    width: calc(100% - 40px);
  }

  .navbar {
    padding-inline: 16px;
  }

  .hero-content h1 {
    font-size: clamp(32px, 9vw, 50px);
    line-height: 1.08;
  }

  .hero-content p,
  .showcase-content p {
    font-size: 14px;
    line-height: 1.65;
  }

  .showcase-content .primary-button {
    font-size: 11px;
  }

  .section-heading > p {
    line-height: 1.65;
  }

  .product-grid {
    gap: 32px;
  }

  .product-info {
    padding: 24px 20px;
  }

  .product-description {
    font-size: 14px;
  }

  .product-documentation {
    margin-block: 12px;
  }

  .product-price {
    margin-block: 16px;
  }

  .add-button {
    min-height: 48px;
    margin-bottom: 18px;
  }

  .certificate-card {
    gap: 12px;
  }
}
