/* ============================================
   FONTS
   ============================================ */
@font-face {
  font-family: "Manrope";
  src: url("../fonts/Manrope/Manrope-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
}

/* ============================================
   CSS VARIABLES
   ============================================ */
:root {
  /* Color Palette */
  --color-white: #ffffff;
  --color-black-1: #000;
  --color-black-2: #010102;

  --color-yellow-1: #f9d05d;
  --color-yellow-2: #edc659;

  --color-purple-1: #ad6ac2;
  --color-purple-2: #7d5fe0;

  --color-pink-1: #d134a1;
  --color-red-1: #d20909;
  --color-blue-1: #00bffe;

  /* Gradients */
  --gradient-yellow-1: linear-gradient(180deg, #f0ca60 0%, #f2cc5f 100%);
  --gradient-yellow-2: linear-gradient(180deg, #ffbd53 0%, #e09915 100%);
  --gradient-yellow-3: linear-gradient(180deg, #fee96e 0%, #95871c 100%);
  --gradient-yellow-4: linear-gradient(359deg, #c17235 0.77%, #ffb84d 99.23%);
  --gradient-yellow-5: linear-gradient(359deg, #c18c35 0.77%, #ffb84d 99.23%);
  --gradient-yellow-6: linear-gradient(180deg, #fee96e 0%, #e2c98a 100%);

  --gradient-black-1: linear-gradient(245deg, #060606 -1.27%, #1c0733 139.04%);

  --gradient-purple-1: linear-gradient(90deg, #ffd1f7 0%, #8759d3 100%);
  --gradient-purple-2: linear-gradient(180deg, #ad6ac2 0%, #8b15e0 100%);
  --gradient-purple-3: linear-gradient(180deg, #ad6ac2 0%, #e0156d 100%);

  --gradient-blue-1: linear-gradient(270deg, #7298c5 0%, #37495f 100%);

  --gradient-orange-1: linear-gradient(180deg, #fee96e 0%, #e02d15 100%);

  --gradient-green-1: linear-gradient(359deg, rgba(53, 156, 193, 0.82) 0.77%, rgba(125, 255, 77, 0.84) 99.23%);
  --gradient-green-2: linear-gradient(180deg, #6699d0 0%, #52b1a6 100%);

  --gradient-red-1: linear-gradient(261deg, #f96c6c -3.69%, #503f34 120.3%);

  /* Z-Index Layers */
  --z-background: 0;
  --z-content: 1;
  --z-overlay: 5;
  --z-elevated: 10;
  --z-modal: 100;
  --z-top: 1000;

  /* Blur Values */
  --blur-xsmall: 6.5rem;
  --blur-small: 17.5rem;
  --blur-medium: 25rem;
  --blur-large: 35rem;
  --blur-xlarge: 40rem;

  /* Content Width - max width for content sections */
  --content-max-width: 121.8rem;
  --content-padding-side: 4.1rem;

  /* Transitions */
  --transition-fast: 0.2s ease;
  --transition-medium: 0.3s ease;
  --transition-slow: 0.5s ease;
}

/* ============================================
   RESET & GENERAL STYLES
   ============================================ */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-size: 62.5%; /* 1rem = 10px */
  scroll-behavior: smooth;
}

body {
  font-size: 2rem;
  background-color: var(--color-black-1);
  overflow-x: hidden;
}

/* ============================================
   MAIN CONTAINER
   Full-width with centered content
   ============================================ */
.lp-main {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* ============================================
   SECTION CONTAINER
   Centered content with max-width
   ============================================ */
.lp-section {
  width: 100%;
  max-width: var(--content-max-width);
  padding: 0 var(--content-padding-side);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
}

/* ============================================
   TYPOGRAPHY
   ============================================ */
.body-text {
  color: var(--color-white);
  text-align: center;
  font-family: Manrope, sans-serif;
  font-size: 2rem;
  font-style: normal;
  font-weight: 400;
  line-height: 3.5rem;
}

.product-title {
  font-family: Manrope, sans-serif;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-align: center;
}

.product-subtitle {
  color: var(--color-white);
  text-align: center;
  font-family: Manrope, sans-serif;
  font-size: 2.4rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin-top: 0.4rem;
}

.product-description {
  color: var(--color-white);
  text-align: center;
  font-family: Manrope, sans-serif;
  font-size: 2rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  margin-top: 3rem;
}

/* Title Sizes */
.size-3 {
  font-size: 3rem;
}

.size-4 {
  font-size: 4rem;
}

.size-5 {
  font-size: 5rem;
}

/* Title Colors */
.color-yellow-1 {
  color: var(--color-yellow-1);
}

.color-yellow-2 {
  color: var(--color-yellow-2);
}

.color-purple-2 {
  color: var(--color-purple-2);
}

.color-blue-1 {
  color: var(--color-blue-1);
}

.color-pink-1 {
  color: var(--color-pink-1);
}

.color-red-1 {
  color: var(--color-red-1);
}

/* ============================================
   SPACING UTILITIES
   ============================================ */
.space-27 {
  margin-top: 2.7rem;
}

.space-40 {
  margin-bottom: 4rem;
}

.space-113 {
  margin-bottom: 11.3rem;
}

/* ============================================
   FRAME BADGES WITH TOOLTIPS
   Feature highlight badges
   ============================================ */
.frame-1 {
  width: 37.3rem;
  height: 8.3rem;
  border-radius: 1.47rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 2.5rem;
  position: relative;
  cursor: help;
  transition: transform var(--transition-fast);
  z-index: 1000;
  font-family: Manrope, sans-serif;
}

.frame-1:hover {
  transform: translateY(-2px);
}

/* Tooltip functionality */
.frame-1::before {
  content: attr(data-tooltip);
  position: absolute;
  bottom: calc(100% + 1rem);
  left: 50%;
  transform: translateX(-50%) scale(0);
  background: rgba(0, 0, 0, 0.9);
  color: var(--color-white);
  padding: 0.8rem 1.2rem;
  border-radius: 0.6rem;
  font-size: 1.4rem;
  white-space: normal;
  max-width: 25rem;
  width: max-content;
  text-align: center;
  line-height: 1.4;
  opacity: 0;
  transition: opacity var(--transition-fast), transform var(--transition-fast);
  pointer-events: none;
  z-index: var(--z-modal);
  font-family: Manrope, sans-serif;
}

.frame-1::after {
  content: "";
  position: absolute;
  bottom: calc(100% + 0.3rem);
  left: 50%;
  transform: translateX(-50%) scale(0);
  border: 0.7rem solid transparent;
  border-top-color: rgba(0, 0, 0, 0.9);
  opacity: 0;
  transition: opacity var(--transition-fast), transform var(--transition-fast);
  pointer-events: none;
  z-index: var(--z-modal);
  font-family: Manrope, sans-serif;
}

.frame-1:hover::before,
.frame-1:hover::after {
  opacity: 1;
  transform: translateX(-50%) scale(1);
}

/* Frame Badge Text Styles */
.frame-title {
  text-align: center;
  font-family: Manrope, sans-serif;
  font-size: 2.3rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

/* Frame Badge Color Variants */
.frame-yellow-1 {
  border: 0.1225rem solid #ffd8ab;
  background: linear-gradient(245deg, #0d0906 -1.27%, #504320 139.04%);
}

.frame-title-yellow {
  background: linear-gradient(90deg, #ffd8aa 31.73%, #edc659 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.frame-purple {
  border: 0.1225rem solid #a986f6;
  background: linear-gradient(245deg, #0d0906 -1.27%, #342960 139.04%);
}

.frame-title-purple {
  background: linear-gradient(90deg, #c3aef1 8.87%, #7d5fe0 94.73%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.frame-blue {
  border: 0.1225rem solid #00bffe;
  background: linear-gradient(245deg, #0d0906 -1.27%, #2b4164 139.04%);
}

.frame-title-blue {
  background: linear-gradient(91deg, #6edbff 8.25%, #2d6dcf 98.8%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.frame-pink {
  border: 0.1225rem solid #d134a1;
  background: linear-gradient(245deg, #0d0906 -1.27%, #340f3e 139.04%);
}

.frame-title-pink {
  background: linear-gradient(269deg, #d134a1 -1.83%, #e9aed7 98.81%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.frame-red {
  border: 0.1225rem solid #d134a1;
  background: linear-gradient(245deg, #0d0906 -1.27%, #340f3e 139.04%);
}

.frame-title-red {
  background: linear-gradient(90deg, #ffbdaa 3.85%, #ff6161 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ============================================
   REUSABLE COMPONENTS
   ============================================ */

/* Product Feature Layout */
.product-feature {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.product-feature-text {
  display: flex;
  flex-direction: column;
}

/* Buy Now Title */
.buynow-title {
  color: var(--color-white);
  text-align: center;
  font-family: Manrope, sans-serif;
  font-size: 3.5rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.8rem;
  margin: 8rem 0 2.9rem 0;
  z-index: var(--z-elevated);
}

/* Shop Logos */
.shops-list {
  display: flex;
  flex-direction: row;
  margin-top: 5rem;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.lp-section-smartphones-neo-3gt-buynow {
  width: inherit;
  padding: 7.3rem;
  padding: 7.3rem;
  margin-left: auto;
  margin-right: auto;
}

.shops-list-tablets {
  display: flex;
  flex-direction: row;
  margin: 5rem 0;
  justify-content: center;
  align-items: center;
}

.shops-list-speaker,
.shops-list-gamepad {
  display: flex;
  flex-direction: row;
  margin: 5rem 7.3rem;
  justify-content: center;
  align-items: center;
}

.shops-list-orange {
  height: 5.3rem;
}

.shops-list-plus {
  height: 3.58rem;
}

.shops-list-ztenubia {
  height: 2.6rem;
}

.shops-list-euro {
  height: 2.55rem;
}

.shops-list-mediaexpert {
  height: 3rem;
}

.shops-list-komputronik {
  height: 5.9rem;
}

.shops-list-xkom {
  height: 3.8rem;
  background-color: white;
  padding: 0.5rem;
}

/* Shop List Separators */
.shops-list-separator {
  width: 0.1409rem;
  height: 4.9323rem;
  transform: rotate(30deg);
  background: linear-gradient(180deg, #ffd8aa 0%, #f2cb72 100%);
}

.shops-list-separator-purple {
  width: 0.1409rem;
  height: 4.9323rem;
  transform: rotate(30deg);
  background: linear-gradient(180deg, #ad6ac2 0%, #461395 100%);
}

.shops-list-separator-blue {
  width: 0.1409rem;
  height: 4.9323rem;
  transform: rotate(30deg);
  background: linear-gradient(180deg, #00bffe 0%, #2860b3 100%);
}

/* ============================================
   HERO SECTION
   ============================================ */
.lp-section-hero {
  width: 100%;
  max-width: 100%;
  padding: 0;
  background-image: url(../img/hero-background.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  position: relative;
}

/* Decorative blur ovals */
.lp-section-hero-oval1 {
  width: 95rem;
  height: 64rem;
  border-radius: 95rem;
  background-color: var(--color-black-1);
  position: absolute;
  top: 6.5rem;
  filter: blur(var(--blur-large));
  z-index: var(--z-elevated);
}

.lp-section-hero-oval2 {
  width: 70.2rem;
  height: 70.2rem;
  position: absolute;
  border-radius: 95rem;
  top: 0;
  right: 0;
  transform: translate(50%, -50%);
  background-color: var(--color-black-1);
  filter: blur(var(--blur-xlarge));
  z-index: var(--z-elevated);
}

/* Logo section */
.lp-section-hero-logo {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin: 17.6rem auto 0 auto;
  z-index: 15;
}

.lp-section-hero-zte-logo {
  width: 8.3rem;
  margin-right: 3.2rem;
}

.lp-section-hero-nubia-logo {
  width: 17.5rem;
}

/* Hero title */
.lp-section-hero-title {
  color: var(--color-white);
  text-align: center;
  font-family: Manrope, sans-serif;
  font-style: normal;
  line-height: normal;
  margin-top: 5.1rem;
  z-index: 15;
}

.lp-section-hero-title-secondary {
  font-size: 7.1rem;
  font-weight: 500;
}

.lp-section-hero-title-primary {
  font-size: 5.9rem;
  font-weight: 300;
}

/* Hero graphic */
.lp-section-hero-graphic {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: 6.5rem;
  z-index: 15;
}

.lp-section-hero-graphic-img {
  width: 100vw;
  max-width: 100vw;
}

/* ============================================
   INTRODUCTION SECTION
   Product category icons with hover effects
   ============================================ */
.lp-section-introduction {
  background-color: var(--color-black-1);
  display: flex;
}

/* Product icons grid */
.lp-section-introduction-products {
  display: grid;
  grid-template-columns: repeat(3, 21.6rem);
  gap: 5rem 2.25rem;
  margin-top: 13.9rem;
  margin-bottom: 8.6rem;
  justify-content: center;
}

/* Grid layout adjustments */
.lp-section-introduction-product:nth-child(4) {
  grid-column: 2 / 3;
  transform: translateX(-13.05rem);
}

.lp-section-introduction-product:nth-child(5) {
  transform: translateX(-13.05rem);
}

/* Product icon cards with hover effect */
.lp-section-introduction-product {
  width: 21.6rem;
  height: 13.6rem;
  border-radius: 2.4rem;
  border: 2px solid var(--color-purple-1);
  background: var(--gradient-black-1);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  text-decoration: none;
  transition: transform var(--transition-medium), box-shadow var(--transition-medium);
  cursor: pointer;
  position: relative;
}

/* Hover effect - scale up */
.lp-section-introduction-product:hover {
  transform: scale(1.1);
  box-shadow: 0 8px 24px rgba(173, 106, 194, 0.4);
  z-index: var(--z-elevated);
}

.lp-section-introduction-product:nth-child(4):hover {
  transform: translateX(-13.05rem) scale(1.1);
}

.lp-section-introduction-product:nth-child(5):hover {
  transform: translateX(-13.05rem) scale(1.1);
}

/* Product images */
.lp-section-introduction-product-1 {
  height: 13.8rem;
  position: absolute;
  transform: translateY(-40%);
  transition: transform var(--transition-medium);
}

.lp-section-introduction-product:hover .lp-section-introduction-product-1 {
  transform: translateY(-40%) scale(1.05);
}

.lp-section-introduction-product-2 {
  height: 14.1rem;
  position: absolute;
  transform: translateY(-35%);
  transition: transform var(--transition-medium);
}

.lp-section-introduction-product:hover .lp-section-introduction-product-2 {
  transform: translateY(-35%) scale(1.05);
}

.lp-section-introduction-product-3 {
  height: 11.8rem;
  position: absolute;
  transform: translateY(-50%);
  transition: transform var(--transition-medium);
}

.lp-section-introduction-product:hover .lp-section-introduction-product-3 {
  transform: translateY(-50%) scale(1.05);
}

.lp-section-introduction-product-4 {
  height: 11.2rem;
  position: absolute;
  transform: translateY(-50%);
  transition: transform var(--transition-medium);
}

.lp-section-introduction-product:hover .lp-section-introduction-product-4 {
  transform: translateY(-50%) scale(1.05);
}

.lp-section-introduction-product-5 {
  height: 9.2rem;
  position: absolute;
  transform: translateY(-70%);
  transition: transform var(--transition-medium);
}

.lp-section-introduction-product:hover .lp-section-introduction-product-5 {
  transform: translateY(-70%) scale(1.05);
}

/* Product titles */
.lp-section-introduction-product-title {
  text-align: center;
  font-family: Manrope, sans-serif;
  font-size: 2.56rem;
  font-style: normal;
  font-weight: 400;
  line-height: 2.8rem;
  background: var(--gradient-purple-1);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  margin-bottom: 2rem;
}

/* Introduction description */
.lp-section-introduction-description {
  width: 92.3rem;
  max-width: 100%;
}

/* ============================================
   SMARTPHONES SECTION
   ============================================ */
.lp-section-smartphones {
  width: 100%;
  max-width: 100%;
  padding: 0;
  background-color: var(--color-black-1);
}

/* Smartphones header */
.lp-section-smartphones-header {
  width: 100%;
  height: 80rem;
  background-color: var(--color-black-2);
  display: flex;
  justify-content: center;
  overflow: hidden;
  position: relative;
  padding: 10rem 0 0 0;
}

.lp-section-smartphones-header-oval {
  width: 39.5rem;
  height: 72.2rem;
  transform: rotate(-52.218deg);
  border-radius: 72.2rem;
  background: var(--gradient-orange-1);
  filter: blur(var(--blur-large));
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(-52.218deg);
}

.lp-section-smartphones-header-image {
  position: absolute;
  width: 121rem;
  max-width: 100%;
  bottom: 0;
  left: 0;
}

.lp-section-smartphones-header-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: var(--z-content);
  transform: translateX(50%);
}

.lp-section-smartphones-header-text p {
  width: 54.2rem;
  max-width: 100%;
}

/* ============================================
   NUBIA NEO 3GT 5G
   ============================================ */
.lp-section-smartphones-neo-3gt {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
}

.lp-section-smartphones-neo-3gt-header {
  display: flex;
  position: relative;
  justify-content: space-between;
  align-items: center;
  margin-top: 10rem;
}

.lp-section-smartphones-neo-3gt-header-title {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.lp-section-smartphones-neo-3gt-header-title-oval {
  width: 72.6rem;
  height: 55.8rem;
  transform: rotate(-44.049deg);
  border-radius: 72.6rem;
  background: var(--gradient-yellow-1);
  filter: blur(350px);
  position: absolute;
}

.lp-section-smartphones-neo-3gt-header-image {
  width: 58.5rem;
  max-width: 50%;
  height: auto;
  z-index: var(--z-content);
}

.lp-section-smartphones-neo-3gt-header-title-categories {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Feature: Screen */
.lp-section-smartphones-neo-3gt-screen {
  align-items: center;
  justify-content: space-between;
  /* background-color: orange; */
}

.lp-section-smartphones-neo-3gt-screen-image {
  position: relative;
}

.lp-section-smartphones-neo-3gt-screen-image-oval {
  position: absolute;
  width: 59.6rem;
  height: 31.7rem;
  transform: rotate(-44.049deg);
  border-radius: 59.6rem;
  background: var(--gradient-purple-2);
  filter: blur(var(--blur-large));
}

.lp-section-smartphones-neo-3gt-screen-text {
  margin-left: 11.3rem;
}

.lp-section-smartphones-neo-3gt-screen-image img {
  width: 63.2rem;
  max-width: 100%;
  transform: translateY(15%);
}

.lp-section-smartphones-neo-3gt-screen-text p {
  width: 46.7rem;
  max-width: 100%;
}

.lp-section-smartphones-neo-3gt-screen-text h3 {
  margin-top: 5rem;
}

/* Feature: Design */
.lp-section-smartphones-neo-3gt-design {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-top: 8rem;
  align-items: center;
}

.lp-section-smartphones-neo-3gt-design-image {
  position: relative;
  min-height: 50rem;
  width: 60rem;
  flex-shrink: 0;
}

.lp-section-smartphones-neo-3gt-design-image-oval {
  width: 49rem;
  height: 33rem;
  transform: rotate(-44.049deg);
  border-radius: 49rem;
  background: var(--gradient-yellow-2);
  filter: blur(var(--blur-large));
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(-44.049deg);
  z-index: var(--z-background);
}

.lp-section-smartphones-neo-3gt-design-image-1 {
  position: absolute;
  width: 46.3rem;
  max-width: 100%;
  top: 0;
  left: 5rem;
  transform: translateY(-8%);
  z-index: var(--z-content);
}

.lp-section-smartphones-neo-3gt-design-image-2 {
  position: absolute;
  width: 46.3rem;
  max-width: 100%;
  left: 17rem;
  transform: translateY(-8%);
  z-index: var(--z-overlay);
}

.lp-section-smartphones-neo-3gt-design-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-right: 10.1rem;
  z-index: var(--z-elevated);
}

.lp-section-smartphones-neo-3gt-design-text p {
  width: 45.8rem;
  max-width: 100%;
  margin-bottom: 8.4rem;
}

/* Feature: Durability */
.lp-section-smartphones-neo-3gt-durability {
  display: flex;
  justify-content: space-between;
  margin-left: 15.8rem;
  margin-right: 14.6rem;
}

.lp-section-smartphones-neo-3gt-durability-text {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.lp-section-smartphones-neo-3gt-durability-text p {
  width: 40.5rem;
  max-width: 100%;
}

.lp-section-smartphones-neo-3gt-durability-image img {
  width: 38.5rem;
  margin-left: 12.3rem;
  max-width: 100%;
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}

/* Feature: Triggers */
.lp-section-smartphones-neo-3gt-triggers {
  display: flex;
  justify-content: space-between;
  margin-top: 5rem;
}

.lp-section-smartphones-neo-3gt-triggers-image {
  position: relative;
}

.lp-section-smartphones-neo-3gt-triggers-image img {
  width: 40.3rem;
  max-width: 100%;
  height: 41.8rem;
  position: relative;
  z-index: var(--z-elevated);
  margin-right: 8.7rem;
}

.lp-section-smartphones-neo-3gt-triggers-image-oval {
  width: 59.6rem;
  height: 31.7rem;
  border-radius: 59.6rem;
  background: var(--gradient-purple-3);
  filter: blur(350px);
  transform: rotate(-44.049deg);
  position: absolute;
  left: -12rem;
  z-index: var(--z-overlay);
}

.lp-section-smartphones-neo-3gt-triggers-text {
  width: 44.7rem;
  max-width: 100%;
}

/* ============================================
   NUBIA NEO 3 5G
   ============================================ */
.lp-section-smartphones-neo-3 {
  width: 100%;
  max-width: var(--content-max-width);
  padding: 0 var(--content-padding-side);
  margin-top: 11.4rem;
}

.lp-section-smartphones-neo-3-header {
  display: flex;
  position: relative;
  justify-content: center;
  align-items: center;
  z-index: 4;
}

.lp-section-smartphones-neo-3-header-images {
  position: relative;
  display: flex;
  margin-left: 11.8rem;
}

.lp-section-smartphones-neo-3-header-image-1 {
  width: 15.23rem;
  z-index: 3;
  transform: translate(3.5rem, 5rem);
}

.lp-section-smartphones-neo-3-header-image-2 {
  width: 15.3rem;
  z-index: 2;
  transform: translateX(1.8rem);
}

.lp-section-smartphones-neo-3-header-image-3 {
  width: 15.88rem;
  z-index: 1;
  transform: translateY(-5rem);
}

.lp-section-smartphones-neo-3-header-title-oval {
  position: absolute;
  width: 52.2rem;
  height: 62.8rem;
  transform: rotate(-44.049deg);
  border-radius: 62.8rem;
  background: var(--gradient-yellow-3);
  filter: blur(var(--blur-large));
  right: -3rem;
  top: 8rem;
}

/* Feature: Design */
.lp-section-smartphones-neo-3-design {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 12.2rem;
  align-items: center;
}

.lp-section-smartphones-neo-3-design-text {
  z-index: var(--z-elevated);
}

.lp-section-smartphones-neo-3-design-text p {
  width: 45.8rem;
  max-width: 100%;
}

.lp-section-smartphones-neo-3-design-images {
  display: flex;
  align-items: flex-end;
  margin-right: 13.4rem;
}

.lp-section-smartphones-neo-3-design-image-oval {
  width: 53rem;
  height: 31rem;
  transform: rotate(-45.393deg);
  position: absolute;
  border-radius: 53rem;
  background: var(--gradient-yellow-4);
  filter: blur(var(--blur-medium));
  top: 22rem;
  left: -9rem;
  z-index: var(--z-background);
}

.lp-section-smartphones-neo-3-design-image-1 {
  height: 46.9rem;

  z-index: var(--z-elevated);
}

.lp-section-smartphones-neo-3-design-image-2 {
  height: 40.9rem;
  transform: translateX(-3rem);
  z-index: var(--z-content);
}

/* Feature: CPU */
.lp-section-smartphones-neo-3-cpu {
  display: flex;
  justify-content: center;
  margin-top: 3.4rem;
  position: relative;
}

.lp-section-smartphones-neo-3-cpu-text p {
  width: 36rem;
  max-width: 100%;
}

.lp-section-smartphones-neo-3-cpu-image {
  position: relative;
  margin-left: 10.5rem;
  z-index: 10;
}

.lp-section-smartphones-neo-3-cpu-image-oval {
  position: absolute;
  width: 53rem;
  height: 31rem;
  transform: rotate(-45.393deg);
  border-radius: 530.818px;
  background: var(--gradient-green-1);
  filter: blur(var(--blur-medium));
  top: 5rem;
  right: -12rem;
}

.lp-section-smartphones-neo-3-cpu-image img {
  width: 48.6rem;
  max-width: 100%;
}

/* Feature: Durability */
.lp-section-smartphones-neo-3-durability {
  display: flex;
  justify-content: center;
  margin-top: 1.3rem;
}

.lp-section-smartphones-neo-3-durability-text {
  display: flex;
  flex-direction: column;
  margin-left: 12.7rem;
}

.lp-section-smartphones-neo-3-durability-text p {
  width: 41.6rem;
  max-width: 100%;
}

.lp-section-smartphones-neo-3-durability-image img {
  width: 39.8rem;
  max-width: 100%;
}

/* Feature: Triggers */
.lp-section-smartphones-neo-3-triggers {
  margin-top: 10.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lp-section-smartphones-neo-3-triggers-image {
  position: relative;
  margin-left: 5.6rem;
}

.lp-section-smartphones-neo-3-triggers-image-oval {
  width: 53rem;
  height: 31.1rem;
  transform: rotate(-45.393deg);
  border-radius: 53rem;
  background: var(--gradient-yellow-5);
  filter: blur(var(--blur-medium));
  position: absolute;
  z-index: var(--z-overlay);
  right: 0;
  top: -6rem;
}

.lp-section-smartphones-neo-3-triggers-text p {
  width: 44.7rem;
  max-width: 100%;
}

.lp-section-smartphones-neo-3-triggers-image img {
  width: 52.8rem;
  max-width: 100%;
  border-radius: 1.2rem;
  z-index: var(--z-elevated);
  position: relative;
}

.lp-section-smartphones-neo-3-buynow {
  width: 91.7rem;
  margin: auto;
}

/* ============================================
   REDMAGIC 10 PRO
   ============================================ */
.lp-section-smartphones-redmagic {
  width: 100%;
  max-width: var(--content-max-width);
  padding: 0 var(--content-padding-side);
}

.lp-section-smartphones-redmagic-header {
  display: flex;
  position: relative;
  flex-direction: row;
  justify-content: center;
  margin-top: 20rem;
}

.lp-section-smartphones-redmagic-header-title {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.lp-section-smartphones-redmagic-header-title-oval {
  width: 48.2rem;
  height: 45.8rem;
  transform: rotate(-44.049deg);
  border-radius: 48.2rem;
  background: var(--gradient-yellow-6);
  filter: blur(var(--blur-large));
  position: absolute;
}

.lp-section-smartphones-redmagic-header-image {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-right: 4rem;
}

.lp-section-smartphones-redmagic-header-image-1 {
  height: 48.2rem;
  z-index: 2;
}

.lp-section-smartphones-redmagic-header-image-2 {
  height: 48.2rem;
  transform: translate(-5.5rem, 7rem);
  z-index: 3;
}

.lp-section-smartphones-redmagic-header-image-3 {
  height: 48.2rem;
  transform: translate(-11rem, 14rem);
  z-index: 4;
}

.lp-section-smartphones-redmagic-header-title-categories {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Feature: Screen */
.lp-section-smartphones-redmagic-screen {
  margin-top: 24.4rem;
  position: relative;
  display: flex;
  justify-content: center;
}

.lp-section-smartphones-redmagic-screen-image {
  position: relative;
  width: 50.3rem;
  height: 25.9rem;
  border-radius: 3rem;
  background: var(--gradient-blue-1);
  display: flex;
  justify-content: center;
  align-items: flex-end;
  margin-left: 8.6rem;
}

.lp-section-smartphones-redmagic-screen-image-oval {
  position: absolute;
  width: 48.2rem;
  height: 45.8rem;
  transform: rotate(-44.049deg);
  border-radius: 48.2rem;
  background: var(--gradient-green-2);
  filter: blur(var(--blur-large));
  top: 0;
  right: 0;
  z-index: var(--z-background);
}

.lp-section-smartphones-redmagic-screen-image img {
  width: 44.2rem;
  max-width: 100%;
}

.lp-section-smartphones-redmagic-screen-text p {
  width: 43rem;
  max-width: 100%;
}

/* Feature: Design */
.lp-section-smartphones-redmagic-design {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 8rem;
  position: relative;
  z-index: var(--z-elevated);
  align-items: flex-start;
}

.lp-section-smartphones-redmagic-design-image {
  position: relative;
  min-height: 50rem;
  width: 60rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

.lp-section-smartphones-redmagic-design-image-oval {
  width: 35.3rem;
  height: 17.1rem;
  transform: rotate(-123.254deg);
  border-radius: 35.3rem;
  background: var(--gradient-red-1);
  filter: blur(var(--blur-small));
  position: absolute;
  top: 18rem;
  left: 19rem;
  z-index: var(--z-background);
  display: none;
}

.lp-section-smartphones-redmagic-design-image-1 {
  width: 48.1rem;
  max-width: 100%;
  z-index: var(--z-content);
}

.lp-section-smartphones-redmagic-design-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: var(--z-elevated);
}

.lp-section-smartphones-redmagic-design-text p {
  width: 41.9rem;
  max-width: 100%;
}

/* Feature: Battery */
.lp-section-smartphones-redmagic-battery {
  display: flex;
  justify-content: center;
}

.lp-section-smartphones-redmagic-battery-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.lp-section-smartphones-redmagic-battery-text p {
  width: 34.7rem;
  max-width: 100%;
}

.lp-section-smartphones-redmagic-battery-image img {
  width: 59.8rem;
  max-width: 100%;
  margin-left: 4.37rem;
}

.lp-section-smartphones-redmagic-buynow {
  margin: auto;
  width: 96.3rem;
  margin-bottom: 8.3rem;
}

/* ============================================
   TABLETS SECTION
   ============================================ */
.lp-section-tablets {
  width: 100%;
  max-width: 100%;
  padding: 0;
  background-color: var(--color-black-1);
  overflow: hidden;
}

/* Tablets hero */
.lp-section-tablets-hero {
  width: 100%;
  height: 80rem;
  background-color: var(--color-black-2);
  align-items: center;
  justify-content: center;
  display: flex;
  overflow: hidden;
  position: relative;
  padding-top: 3.65rem;
  background-image: url(../img/tablet-hero.png);
  background-repeat: no-repeat;
  background-size: auto 100%;
  background-position: right;
}

.lp-section-tablets-hero-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: var(--z-elevated);
  transform: translateX(-50%);
}

.lp-section-tablets-hero-text p {
  width: 51.2rem;
}

.lp-section-tablets-hero-oval-1 {
  position: absolute;
  width: 70.2rem;
  height: 70.2rem;
  background-color: #5f45ba;
  border-radius: 50%;
  filter: blur(var(--blur-xlarge));
  top: 10rem;
  right: -5rem;
}

/* Tablet features */
.lp-section-tablet {
  width: 100%;
  max-width: var(--content-max-width);
  padding: 0 var(--content-padding-side);
}

.lp-section-tablet-header {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  margin-top: 10rem;
  position: relative;
  gap: 8.97rem;
}

.lp-section-tablet-header-title-categories {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

.lp-section-tablet-header-title-category {
  z-index: var(--z-elevated);
}

.lp-section-tablet-header-image {
  width: 46.7rem;
  max-width: 100%;
  z-index: var(--z-elevated);
}

.lp-section-tablet-header-title-oval {
  position: absolute;
  width: 52.7rem;
  height: 41.5rem;
  transform: rotate(-171deg);
  border-radius: 52.7rem;
  background: #7561be;
  top: 6rem;
  left: -5rem;
  filter: blur(var(--blur-large));
}

/* Feature: CPU */
.lp-section-tablet-cpu {
  margin-top: 19.7rem;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lp-section-tablet-cpu-image-oval-1 {
  position: absolute;
  width: 53.2rem;
  height: 133.3rem;
  transform: rotate(-34deg);
  border-radius: 133.31rem;
  background: radial-gradient(50% 50% at 50% 50%, rgba(255, 255, 255, 0.15) 0%, rgba(153, 153, 153, 0) 100%);
  filter: blur(var(--blur-xsmall));
  top: -50rem;
  right: -7rem;
  z-index: var(--z-background);
}

.lp-section-tablet-cpu-image-oval-2 {
  position: absolute;
  width: 8.4rem;
  height: 104.1rem;
  transform: rotate(-34deg);
  border-radius: 104.1rem;
  background: radial-gradient(50% 50% at 50% 50%, rgba(255, 255, 255, 0.5) 0%, rgba(153, 153, 153, 0) 100%);
  filter: blur(var(--blur-xsmall));
  top: -35rem;
  right: 17rem;
  z-index: var(--z-content);
}

.lp-section-tablet-cpu h3 {
  z-index: var(--z-elevated);
}

.lp-section-tablet-cpu-image img {
  width: 38.1rem;
  max-width: 100%;
  margin-left: 9.3rem;
}

.lp-section-tablet-cpu-text p {
  width: 50.4rem;
  max-width: 100%;
  z-index: var(--z-elevated);
}

/* Feature: Design */
.lp-section-tablet-design {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 2.88rem;
  position: relative;
}

.lp-section-tablet-design-image {
  position: relative;
  min-height: 40rem;
  margin-right: -19.3rem;
}

.lp-section-tablet-design-image-1 {
  width: 31.7rem;
}

.lp-section-tablet-design-image-2 {
  width: 31.7rem;
  transform: translateX(-19.3rem);
}

.lp-section-tablet-design-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-left: 7.3rem;
}

.lp-section-tablet-design-text h3,
.lp-section-tablet-design-text p {
  z-index: var(--z-elevated);
}

.lp-section-tablet-design-text p {
  width: 47.8rem;
  max-width: 100%;
}

/* Feature: Battery */
.lp-section-tablet-battery {
  display: flex;
  justify-content: center;
  margin-top: 9.8rem;
  position: relative;
}

.lp-section-tablet-battery-text {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.lp-section-tablet-battery-text p {
  width: 43.5rem;
  max-width: 100%;
}

.lp-section-tablet-battery-image img {
  width: 60.6rem;
  max-width: 100%;
  height: 28.6rem;
  transform: rotate(22.486deg);
}

.lp-section-tablet-battery-oval {
  width: 44.9rem;
  height: 23.3rem;
  transform: rotate(-171deg);
  border-radius: 44.9rem;
  background: linear-gradient(180deg, #449bff 0%, #a1b9f3 100%);
  filter: blur(var(--blur-medium));
  top: 4rem;
  right: 5rem;
  position: absolute;
}

/* Buy now */
.lp-section-tablet-buynow {
  margin-left: auto;
  margin-right: auto;
}

/* ============================================
   ROUTER SECTION
   ============================================ */
.lp-section-router {
  width: 100%;
  max-width: 100%;
  padding: 0;
  background-color: var(--color-black-1);
  overflow: hidden;
}

/* Router hero */
.lp-section-router-hero {
  width: 100%;
  height: 80rem;
  background-color: var(--color-black-2);
  display: flex;
  overflow: hidden;
  position: relative;
  justify-content: center;
  padding: 10.4rem 0 35.5rem;
  z-index: 1000;
}

.lp-section-router-hero-image {
  position: absolute;
  width: 147.3rem;
  max-width: 200%;
  transform: rotate(30deg);
  left: -42rem;
  top: 36rem;
  z-index: 1000;
}

.lp-section-router-hero-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-right: 17.1rem;
  margin-left: 48.5rem;
  z-index: var(--z-elevated);
}

.lp-section-router-hero-text p {
  width: 56.1rem;
  max-width: 100%;
}

.lp-section-router-hero-oval-1 {
  position: absolute;
  width: 39.4rem;
  height: 72.2rem;
  transform: rotate(-52.218deg);
  border-radius: 72.2rem;
  background: linear-gradient(180deg, #dcf6ff 0%, #00bffe 100%);
  filter: blur(var(--blur-large));
  top: 35rem;
  left: 35rem;
  z-index: var(--z-background);
}

/* Router features */
.lp-section-router-features {
  width: 100%;
  max-width: var(--content-max-width);
  padding: 0 var(--content-padding-side);
}

.lp-section-router-header {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 1.35rem;
  position: relative;
  gap: 16.1rem;
}

.lp-section-router-header-title-categories {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  /* width: 100vw; */
}

.lp-section-router-header-title-category {
  z-index: var(--z-elevated);
}

.lp-section-router-header-image {
  width: 29.1rem;
  z-index: var(--z-elevated);
  margin: 0;
}

.lp-section-router-header-title-oval {
  position: absolute;
  width: 55.3rem;
  height: 47.4rem;
  transform: rotate(-87.628deg);
  border-radius: 55.3rem;
  background: linear-gradient(180deg, #7495ff 0%, #5caef2 100%);
  filter: blur(var(--blur-large));
  top: 5rem;
  left: 5rem;
}

/* Feature: 5G */
.lp-section-router-5g {
  margin-top: 13.1rem;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 11.5rem;
}

.lp-section-router-5g-image img {
  width: 41.2rem;
  max-width: 100%;
}

.lp-section-router-5g-text p {
  width: 39.4rem;
  max-width: 100%;
}

/* Feature: WiFi */
.lp-section-router-wifi {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: relative;
  margin-top: 11.9rem;
  gap: 9.9rem;
}

.lp-section-router-wifi-oval {
  position: absolute;
  width: 60.2rem;
  height: 47.4rem;
  transform: rotate(-171deg);
  border-radius: 60.2rem;
  background: linear-gradient(206deg, #182d48 14.89%, #49a8fb 102.21%);
  filter: blur(var(--blur-large));
  left: 1rem;
  top: 9rem;
}

.lp-section-router-wifi-image-1 {
  width: 44.4rem;
  max-width: 100%;
  position: relative;
  backdrop-filter: blur(5rem);
  border-radius: 3rem;
  z-index: var(--z-elevated);
}

.lp-section-router-wifi-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: var(--z-elevated);
}

.lp-section-router-wifi-text h3,
.lp-section-router-wifi-text p {
  z-index: var(--z-elevated);
}

.lp-section-router-wifi-text p {
  width: 40.8rem;
  max-width: 100%;
}

/* Feature: Ports */
.lp-section-router-ports {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin-top: 7.5rem;
  gap: 15rem;
}

.lp-section-router-ports-text {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.lp-section-router-ports-text p {
  width: 31.5rem;
  max-width: 100%;
  z-index: var(--z-elevated);
}

.lp-section-router-ports-image {
  z-index: var(--z-elevated);
}

.lp-section-router-ports-image img {
  width: 43.5rem;
  max-width: 100%;
}

/* Feature: NFC */
.lp-section-router-nfc {
  display: flex;
  justify-content: center;
  align-items: center;
  justify-content: center;
  margin-top: 6.3rem;
  position: relative;
  gap: 10rem;
}

.lp-section-router-nfc-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: var(--z-elevated);
}

.lp-section-router-nfc-text p {
  width: 38.5rem;
  max-width: 100%;
}

.lp-section-router-nfc-image img {
  width: 44.8rem;
  max-width: 100%;
  z-index: var(--z-elevated);
}

.lp-section-router-nfc-oval {
  width: 60.2rem;
  height: 47.4rem;
  transform: rotate(-171deg);
  border-radius: 60.2rem;
  background: #7a829c;
  filter: blur(var(--blur-large));
  top: -30rem;
  right: -6rem;
  position: absolute;
}

.lp-section-router-buynow {
  padding-bottom: 7.5rem;
}

/* ============================================
   SPEAKERS SECTION
   ============================================ */
.lp-section-speakers {
  width: 100%;
  max-width: 100%;
  padding: 0;
  background-color: var(--color-black-1);
  overflow: hidden;
}

/* Speakers hero */
.lp-section-speakers-hero {
  width: 100%;
  height: 80rem;
  background-color: var(--color-black-2);
  display: flex;
  justify-content: center;
  overflow: hidden;
  position: relative;
  background-image: url(../img/speaker-1.png);
  background-repeat: no-repeat;
  background-size: 150%;
  background-position: 0% 80%;
}

.lp-section-speakers-hero-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 14rem;
  margin-right: 54.5rem;
  margin-left: 8.4rem;
  z-index: var(--z-elevated);
}

.lp-section-speakers-hero-text p {
  width: 58.9rem;
  max-width: 100%;
}

/* Speakers features */
.lp-section-speakers-features {
  width: 100%;
  max-width: var(--content-max-width);
  padding: 0 var(--content-padding-side);
}

.lp-section-speakers-header {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: relative;
  padding-top: 11rem;
  gap: 5rem;
}

.lp-section-speakers-header-title-categories {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

.lp-section-speakers-header-title-category {
  z-index: var(--z-elevated);
}

.lp-section-speakers-header-image {
  height: 35rem;
  max-width: 100%;
  position: relative;
  z-index: var(--z-elevated);
}

.lp-section-speakers-header-title-oval {
  position: absolute;
  width: 60.2rem;
  height: 47.4rem;
  transform: rotate(-150deg);
  border-radius: 60.2rem;
  background: linear-gradient(200deg, #0d1a6a 5.83%, #f82bea 96.86%);
  filter: blur(30rem);
  top: 0;
  left: 0;
}

/* Feature: Handle */
.lp-section-speakers-handle {
  margin-top: 15.3rem;
  position: relative;
  display: flex;
  justify-content: center;
  gap: 5rem;
}
.lp-section-speakers-handle-image {
  position: relative;
}

.lp-section-speakers-handle-image img {
  width: 54.6rem;
  max-width: 100%;
}

.lp-section-speakers-handle-text {
  display: flex;
  align-items: center;
}

.lp-section-speakers-handle-text p {
  width: 40.2rem;
  max-width: 100%;
}

.lp-section-speakers-handle-text h3 {
  z-index: var(--z-modal);
}

.lp-section-speakers-handle-oval {
  position: absolute;
  width: 58.7rem;
  height: 57.5rem;
  border-radius: 58.7rem;
  background: linear-gradient(170deg, #ca2f9b -5.7%, #066aff 43.04%, #3eb7e3 94.68%);
  filter: blur(var(--blur-large));
  right: 2rem;
  top: -15rem;
}

/* Feature: Size */
.lp-section-speakers-size {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: relative;
  gap: 16.3rem;
}

.lp-section-speakers-size-oval {
  position: absolute;
  width: 60.2rem;
  height: 47.4rem;
  transform: rotate(-150deg);
  border-radius: 60.2rem;
  background: linear-gradient(200deg, #0d1a6a 5.83%, #f82bea 96.86%);
  filter: blur(var(--blur-large));
  left: -20rem;
  top: -15rem;
}

.lp-section-speakers-size-image-1 {
  width: 39.8rem;
  max-width: 100%;
  height: 59.2rem;
  border-radius: 1.9rem;
  z-index: var(--z-elevated);
  position: relative;
}

.lp-section-speakers-size-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: var(--z-elevated);
}

.lp-section-speakers-size-text h3,
.lp-section-speakers-size-text p {
  z-index: var(--z-elevated);
}

.lp-section-speakers-size-text p {
  width: 30.2rem;
  max-width: 100%;
}

/* Feature: LED */
.lp-section-speakers-led {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  gap: 15.6rem;
}

.lp-section-speakers-led-text {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.lp-section-speakers-led-text p {
  width: 30.2rem;
  max-width: 100%;
  z-index: var(--z-elevated);
}

.lp-section-speakers-led-image {
  z-index: var(--z-elevated);
}

.lp-section-speakers-led-image img {
  width: 41rem;
  max-width: 100%;
  border-radius: 1.9rem;
}

.lp-section-speakers-led-oval {
  position: absolute;
  width: 60.2rem;
  height: 47.4rem;
  transform: rotate(-171deg);
  border-radius: 60.2rem;
  background: linear-gradient(180deg, #003bff 0%, #f82bea 100%);
  filter: blur(var(--blur-large));
  top: 30rem;
  right: -17rem;
}

/* Feature: Battery */
.lp-section-speakers-battery {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 0;
  position: relative;
  gap: 13.8rem;
}

.lp-section-speakers-battery-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: var(--z-elevated);
}

.lp-section-speakers-battery-text p {
  width: 34.9rem;
  max-width: 100%;
}

.lp-section-speakers-battery-image {
  position: relative;
}

.lp-section-speakers-battery-image img {
  width: 39.8rem;
  max-width: 100%;
  border-radius: 4.5rem;
  z-index: var(--z-elevated);
  transform: translateY(-10rem);
}

.lp-section-speakers-battery-oval {
  width: 60.2rem;
  height: 47.4rem;
  transform: rotate(-171deg);
  border-radius: 60.2rem;
  background: linear-gradient(0deg, #4970ef 0%, #4970ef 100%);
  filter: blur(var(--blur-large));
  top: 25rem;
  left: -15rem;
  position: absolute;
}

/* ============================================
   GAMEPAD SECTION
   ============================================ */
.lp-section-gamepad {
  width: 100%;
  max-width: 100%;
  padding: 0;
  background-color: var(--color-black-1);
  overflow: hidden;
}

/* Gamepad hero */
.lp-section-gamepad-hero {
  width: 100%;
  background-color: var(--color-black-2);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  overflow: hidden;
  position: relative;
  padding-top: 7.8rem;
}

.lp-section-gamepad-hero-image {
  width: 100%;
  z-index: var(--z-content);
}

.lp-section-gamepad-hero-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: var(--z-elevated);
  width: 91.7rem;
  max-width: 90%;
  position: relative;
}

/* Gamepad features */
.lp-section-gamepad-features {
  width: 100%;
  max-width: var(--content-max-width);
  padding: 0 var(--content-padding-side);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.lp-section-gamepad-header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  margin-top: 13.5rem;
}

.lp-section-gamepad-header-title-categories {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

.lp-section-gamepad-header-title-category {
  z-index: var(--z-elevated);
}

.lp-section-gamepad-header-image {
  width: 89.2rem;
  max-width: 100%;
  z-index: var(--z-elevated);
  margin-top: 4.9rem;
  aspect-ratio: 223/76;
}

.lp-section-gamepad-header-title-oval {
  position: absolute;
  width: 60.2rem;
  height: 32.2rem;
  transform: rotate(-171deg);
  border-radius: 60.2rem;
  background: linear-gradient(180deg, #ffaea3 0%, #c80000 100%);
  filter: blur(var(--blur-large));
  margin: auto;
}

/* Feature: Design */
.lp-section-gamepad-design {
  margin-top: 9.2rem;
  position: relative;
  display: flex;
  flex-direction: column;
  z-index: var(--z-elevated);
}

.lp-section-gamepad-design-image {
  position: relative;
  z-index: var(--z-elevated);
}

.lp-section-gamepad-design-image img {
  width: 99.1rem;
  max-width: 100%;
  border-radius: 2.1rem;
  margin-top: 5.4rem;
  position: relative;
  z-index: var(--z-elevated);
}

.lp-section-gamepad-design-text {
  display: flex;
  align-items: center;
  position: relative;
  z-index: var(--z-elevated);
}

.lp-section-gamepad-design-text p {
  width: 62.2rem;
  max-width: 100%;
}

.lp-section-gamepad-design-text h3 {
  z-index: var(--z-modal);
}

/* Feature: Triggers */
.lp-section-gamepad-triggers {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  margin-top: 7.5rem;
  margin-right: 11.8rem;
  margin-left: 6.2rem;
}

.lp-section-gamepad-triggers-image-1 {
  width: 63.5rem;
  max-width: 100%;
  z-index: var(--z-elevated);
  position: relative;
}

.lp-section-gamepad-triggers-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: var(--z-elevated);
  margin-left: 3.9rem;
  position: relative;
}

.lp-section-gamepad-triggers-text h3,
.lp-section-gamepad-triggers-text p {
  z-index: var(--z-elevated);
}

.lp-section-gamepad-triggers-text p {
  width: 36.4rem;
  max-width: 100%;
}

/* Feature: Magnetic */
.lp-section-gamepad-magnetic {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  margin-top: 13.9rem;
  margin-right: 7.5rem;
  margin-left: 17.5rem;
}

.lp-section-gamepad-magnetic-image {
  z-index: var(--z-elevated);
}

.lp-section-gamepad-magnetic-image-1 {
  width: 47.5rem;
  max-width: 100%;
  z-index: var(--z-elevated);
  margin-left: 8.4rem;
}

.lp-section-gamepad-magnetic-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: var(--z-elevated);
  margin-left: 3.9rem;
}

.lp-section-gamepad-magnetic-text h3,
.lp-section-gamepad-magnetic-text p {
  z-index: var(--z-elevated);
}

.lp-section-gamepad-magnetic-text p {
  width: 36.4rem;
  max-width: 100%;
}

.lp-section-gamepad-magnetic-oval {
  width: 46.7rem;
  height: 36.7rem;
  transform: rotate(-171deg);
  border-radius: 46.7rem;
  background: #912e2e;
  filter: blur(250px);
  position: absolute;
  top: 0;
  right: 0;
  z-index: var(--z-background);
}

.lp-section-gamepad-buynow {
  margin-bottom: 16.9rem;
}

/* ============================================
   RESPONSIVE DESIGN - MEDIA QUERIES
   ============================================ */

/* Tablet Hero Image Adjustments */
@media screen and (max-width: 1800px) {
  .lp-section-tablets-hero {
    background-size: auto 100%;
    background-position: 80rem;
  }
}

@media screen and (max-width: 1500px) {
  .lp-section-tablets-hero {
    background-size: auto 100%;
    background-position: 70rem;
  }
}

@media screen and (max-width: 1300px) {
  .lp-section-tablets-hero {
    background-size: auto 100%;
    background-position: 55rem;
  }
}

/* ============================================
   Tablet landscape and smaller desktops - 1200px
   ============================================ */
@media screen and (max-width: 1200px) {
  /* Content Width Adjustments - Better margins */
  :root {
    --content-padding-side: 4rem;
  }

  .lp-section {
    overflow: hidden;
  }

  /* Typography */
  .body-text {
    font-size: 1.8rem;
    line-height: 3rem;
  }

  .product-title.size-5 {
    font-size: 4.5rem;
  }

  .product-title.size-4 {
    font-size: 3.6rem;
  }

  .product-title.size-3 {
    font-size: 2.7rem;
  }

  /* Hero Section */
  .lp-section-hero-title-secondary {
    font-size: 6rem;
  }

  .lp-section-hero-title-primary {
    font-size: 5rem;
  }

  /* Introduction Products Grid */
  .lp-section-introduction-products {
    grid-template-columns: repeat(3, 19rem);
    gap: 6rem 4rem;
  }

  .lp-section-introduction-product {
    width: 19rem;
    height: 12rem;
  }

  .lp-section-introduction-description {
    max-width: 60%;
    margin-left: auto;
    margin-right: auto;
  }

  .lp-section-smartphones-header-text {
    max-width: 50rem;
  }

  /* Smartphones Sections - Better spacing and centering */
  .lp-section-smartphones-neo-3gt {
    padding: 0 4rem;
    overflow: hidden;
  }

  .lp-section-smartphones-neo-3gt-header {
    max-width: 100%;
    padding: 0 2rem;
  }

  .lp-section-smartphones-neo-3gt-screen {
    gap: 4rem;
    justify-content: center;
    padding: 0 0rem;
  }

  .lp-section-smartphones-neo-3gt-screen-text {
    margin-right: 2rem;
    max-width: auto;
  }

  .lp-section-smartphones-neo-3gt-screen-text p {
    max-width: 42rem;
  }

  .lp-section-smartphones-neo-3gt-design {
    justify-content: center;
    align-items: flex-start;
    gap: 0rem;
    padding: 0 2rem;
    height: 40rem;
  }

  .lp-section-smartphones-neo-3gt-design-text {
    margin-right: 0;
    max-width: 45rem;
  }

  .lp-section-smartphones-neo-3gt-design-text p {
    max-width: 42rem;
  }

  .lp-section-smartphones-neo-3gt-design-image-1,
  .lp-section-smartphones-neo-3gt-design-image-2 {
    width: 38rem;
  }

  .lp-section-smartphones-neo-3gt-durability {
    justify-content: center;
    gap: 20rem;
    padding: 0 2rem;
    margin-left: 0;
    margin-right: 0;
  }

  .lp-section-smartphones-neo-3gt-durability-text p {
    max-width: 38rem;
  }

  .lp-section-smartphones-neo-3gt-durability-image img {
    margin-left: 0;
  }

  .lp-section-smartphones-neo-3gt-triggers {
    justify-content: center;
    gap: 12rem;
    padding: 0 2rem;
  }

  .lp-section-smartphones-neo-3gt-triggers-text {
    max-width: 42rem;
  }

  .lp-section-smartphones-neo-3gt-triggers-image img {
    margin-right: 0;
  }

  /* Neo 3 5G Section */
  .lp-section-smartphones-neo-3 {
    padding: 0 4rem;
  }

  .lp-section-smartphones-neo-3-design {
    justify-content: center;
    gap: 4rem;
    padding: 0 2rem;
  }

  .lp-section-smartphones-neo-3-design-text p {
    max-width: 42rem;
  }

  .lp-section-smartphones-neo-3-design-images {
    margin-right: 0;
  }

  .lp-section-smartphones-neo-3-cpu {
    justify-content: center;
    gap: 4rem;
    padding: 0 2rem;
    margin-top: 8rem;
  }

  .lp-section-smartphones-neo-3-cpu-text p {
    max-width: 34rem;
  }

  .lp-section-smartphones-neo-3-cpu-image {
    margin-left: 0;
    max-width: 40%;
  }

  .lp-section-smartphones-neo-3-durability {
    justify-content: center;
    gap: 6rem;
    padding: 0 2rem;
    margin-top: 8rem;
  }

  .lp-section-smartphones-neo-3-durability-image {
    max-width: 35%;
  }

  .lp-section-smartphones-neo-3-durability-text {
    margin-left: 0;
    max-width: 38rem;
  }

  .lp-section-smartphones-neo-3-durability-text p {
    max-width: 38rem;
  }

  .lp-section-smartphones-neo-3-triggers {
    justify-content: center;
    gap: 4rem;
    padding: 0 2rem;
  }

  .lp-section-smartphones-neo-3-triggers-text p {
    max-width: 38rem;
  }

  .lp-section-smartphones-neo-3-triggers-image {
    margin-left: 0;
    max-width: 40%;
  }

  /* RedMagic Section */
  .lp-section-smartphones-redmagic {
    padding: 0 4rem;
  }

  .lp-section-smartphones-redmagic-screen {
    justify-content: center;
    gap: 4rem;
    padding: 0 2rem;
  }

  .lp-section-smartphones-redmagic-screen-text p {
    max-width: 40rem;
  }

  .lp-section-smartphones-redmagic-screen-image {
    margin-left: 0;
    max-width: 45rem;
  }

  .lp-section-smartphones-redmagic-screen-image img {
    max-width: 40rem;
  }

  .lp-section-smartphones-redmagic-design {
    justify-content: center;
    padding: 0 2rem;
  }

  .lp-section-smartphones-redmagic-design-image {
    max-width: 48rem;
  }

  .lp-section-smartphones-redmagic-design-text p {
    max-width: 38rem;
  }

  .lp-section-smartphones-redmagic-battery {
    justify-content: center;
    padding: 0 2rem;
  }

  .lp-section-smartphones-redmagic-battery-text p {
    max-width: 32rem;
  }

  .lp-section-smartphones-redmagic-battery-image img {
    margin-left: 0;
  }

  /* Tablets Section */
  .lp-section-tablets-hero {
    background-position: 50rem;
  }

  .lp-section-tablet {
    padding: 0 4rem;
  }

  .lp-section-tablet-header {
    gap: 5rem;
  }

  .lp-section-tablet-cpu {
    margin-top: 10rem;
  }

  .lp-section-tablet-cpu {
    justify-content: center;
    gap: 16rem;
    padding: 0 2rem;
  }

  .lp-section-tablet-cpu-text p {
    max-width: 40rem;
  }

  .lp-section-tablet-cpu-image img {
    margin-left: 0;
    max-width: 40rem;
  }

  .lp-section-tablet-design {
    justify-content: center;
    gap: 4rem;
    padding: 0 2rem;
    margin-top: 10rem;
  }

  .lp-section-tablet-design-text {
    margin-left: 0;
  }

  .lp-section-tablet-design-text p {
    max-width: 40rem;
  }

  .lp-section-tablet-battery {
    justify-content: center;
    gap: 0rem;
    padding: 0 2rem;
  }

  .lp-section-tablet-battery-text {
    max-width: 35rem;
  }

  .lp-section-tablet-battery-image {
    margin-right: -15rem;
  }

  /* Router Section */
  .lp-section-router-hero-text {
    margin-left: 30rem;
    margin-right: 0rem;
  }

  .lp-section-router-features {
    padding: 0 4rem;
  }

  .lp-section-router-5g {
    justify-content: center;
    gap: 6rem;
    padding: 0 2rem;
  }

  .lp-section-router-5g-text p {
    max-width: 36rem;
  }

  .lp-section-router-wifi {
    justify-content: center;
    gap: 6rem;
    padding: 0 2rem;
  }

  .lp-section-router-wifi-text p {
    max-width: 38rem;
  }

  .lp-section-router-ports {
    justify-content: center;
    gap: 8rem;
    padding: 0 2rem;
  }

  .lp-section-router-ports-text p {
    max-width: 30rem;
  }

  .lp-section-router-nfc {
    justify-content: center;
    gap: 6rem;
    padding: 0 2rem;
  }

  .lp-section-router-nfc-text p {
    max-width: 36rem;
  }

  /* Speakers Section */
  .lp-section-speakers-features {
    padding: 0 4rem;
  }

  .lp-section-speakers-handle {
    justify-content: center;
    gap: 3rem;
    padding: 0 2rem;
  }

  .lp-section-speakers-handle-image {
    max-width: 45rem;
  }

  .lp-section-speakers-handle-text p {
    max-width: 38rem;
  }

  .lp-section-speakers-size {
    justify-content: center;
    gap: 15rem;
    padding: 0 2rem;
  }

  .lp-section-speakers-size-text p {
    max-width: 28rem;
  }

  .lp-section-speakers-size-image {
    max-width: 30rem;
    aspect-ratio: 199/296;
  }

  .lp-section-speakers-led {
    justify-content: center;
    gap: 12rem;
    padding: 0 2rem;
  }

  .lp-section-speakers-led-text p {
    max-width: 28rem;
  }

  .lp-section-speakers-led-image {
    max-height: 35rem;
    aspect-ratio: 398/573;
  }

  .lp-section-speakers-battery {
    justify-content: center;
    gap: 8rem;
    padding: 0 2rem;
    margin-bottom: 10rem;
  }

  .lp-section-speakers-battery-image {
    max-width: 35rem;
    aspect-ratio: 398/573;
  }

  .lp-section-speakers-battery-image img {
    transform: translateY(5rem);
  }

  .lp-section-speakers-battery-text p {
    max-width: 32rem;
  }

  /* Gamepad Section */
  .lp-section-gamepad-features {
    padding: 0 4rem;
  }

  .lp-section-gamepad-hero-text {
    max-width: 60rem;
  }

  .lp-section-gamepad-design-text {
    max-width: 60rem;
  }

  .lp-section-gamepad-triggers {
    justify-content: center;
    gap: 4rem;
    padding: 0 2rem;
    margin-right: 0;
    margin-left: 0;
  }

  .lp-section-gamepad-triggers-text {
    margin-left: 0;
  }

  .lp-section-gamepad-triggers-text p {
    max-width: 34rem;
  }

  .lp-section-gamepad-triggers-image {
    max-width: 50rem;
  }

  .lp-section-gamepad-magnetic {
    justify-content: center;
    gap: 16rem;
    padding: 0 2rem;
    margin-right: 0;
    margin-left: 0;
  }

  .lp-section-gamepad-magnetic-text {
    margin-left: 0;
  }

  .lp-section-gamepad-magnetic-text p {
    max-width: 34rem;
  }

  .lp-section-gamepad-magnetic-image {
    max-width: 40rem;
  }

  .lp-section-gamepad-magnetic-image-1 {
    margin-left: 0;
  }

  /* Shops List */
  .shops-list {
    gap: 2rem;
    justify-content: center;
  }

  /* Buy Now Sections - Center them */
  .lp-section-smartphones-neo-3gt-buynow,
  .lp-section-smartphones-neo-3-buynow,
  .lp-section-smartphones-redmagic-buynow {
    max-width: 90rem;
    margin-left: auto;
    margin-right: auto;
    padding: 7.3rem 4rem;
  }
}

/*1100*/

@media screen and (max-width: 1100px) {
  .lp-section-smartphones-header-text {
    margin-right: 10rem;
  }

  .lp-section-tablets-hero-text {
    transform: translateX(-18rem);
  }

  .lp-section-tablet-cpu {
    gap: 6rem;
  }

  .lp-section-tablet-design {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 10rem;
  }

  .lp-section-tablet-design-image img {
    max-width: 28rem;
  }

  .lp-section-router-hero-text {
    transform: translateX(3rem);
  }

  .lp-section-speakers-hero-text {
    max-width: 35rem;
    transform: translateX(10rem);
  }
}

/* ============================================
   Tablet portrait - 992px
   ============================================ */
@media screen and (max-width: 992px) {
  /* Typography */
  .body-text {
    font-size: 1.6rem;
    line-height: 2.8rem;
    width: 769px;
  }

  .product-title.size-5 {
    font-size: 4rem;
  }

  .product-title.size-4 {
    font-size: 3.2rem;
  }

  .product-subtitle {
    font-size: 2rem;
  }

  .product-description {
    font-size: 1.8rem;
  }

  /* Hero Section */
  .lp-section-hero-logo {
    margin-top: 12rem;
  }

  .lp-section-hero-zte-logo {
    width: 7rem;
  }

  .lp-section-hero-nubia-logo {
    width: 15rem;
  }

  .lp-section-hero-title-secondary {
    font-size: 5rem;
  }

  .lp-section-hero-title-primary {
    font-size: 4.2rem;
  }

  /* Introduction Grid - 2 columns */
  .lp-section-introduction-products {
    grid-template-columns: repeat(2, 19rem);
    gap: 8rem 3rem;
    justify-content: center;
  }

  .lp-section-introduction-product:nth-child(4) {
    grid-column: auto;
    transform: translateX(0);
  }

  .lp-section-introduction-product:nth-child(5) {
    transform: translateX(50%);
  }

  .lp-section-introduction-product:nth-child(4):hover {
    transform: scale(1.1);
  }

  .lp-section-introduction-product:nth-child(5):hover {
    transform: scale(1.1);
  }

  /* Frame Badges */
  .frame-1 {
    width: 32rem;
    max-width: 90%;
    height: auto;
    min-height: 7rem;
    padding: 1.5rem;
  }

  .frame-title {
    font-size: 2rem;
  }

  /* Smartphones Header */
  .lp-section-smartphones-header {
    height: auto;
    min-height: 60rem;
    flex-direction: column;
    padding: 10rem 2rem 5rem 2rem;
  }

  .lp-section-smartphones-header-text {
    transform: translate(33rem, -10rem);
    width: 100%;
    max-width: 41rem;
    padding: 0 2rem;
  }

  .lp-section-smartphones-header-image {
    max-width: 90%;
    height: auto;
  }

  /* Product Features - Column Layout */
  .lp-section-smartphones-neo-3gt-screen,
  .lp-section-smartphones-neo-3gt-design,
  .lp-section-smartphones-neo-3gt-durability,
  .lp-section-smartphones-neo-3gt-triggers {
    flex-direction: column;
    align-items: center;
    gap: 4rem;
    padding: 0 2rem;
    overflow: visible;
  }

  /* Zamiana kolejności dla sekcji design - tekst na górze, obraz na dole */
  .lp-section-smartphones-neo-3gt-design-text {
    order: 1;
  }

  .lp-section-smartphones-neo-3gt-design-image {
    order: 2;
  }

  .lp-section-smartphones-neo-3gt-screen-text,
  .lp-section-smartphones-neo-3gt-design-text,
  .lp-section-smartphones-neo-3gt-durability-text,
  .lp-section-smartphones-neo-3gt-triggers-text {
    margin: 0;
    text-align: center;
    width: 100%;
    max-width: 100%;
  }

  .lp-section-smartphones-neo-3gt-durability {
    margin-left: 0;
    margin-right: 0;
  }

  /* Neo 3GT Images - Scale down */
  .lp-section-smartphones-neo-3gt-screen-image {
    width: 100%;
    max-width: 55rem;
    overflow: visible;
  }

  .lp-section-smartphones-neo-3gt-screen {
    width: 100%;
  }

  .lp-section-smartphones-neo-3gt-screen-text {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 100%;
  }

  .lp-section-smartphones-neo-3gt-screen-text p {
    width: 100%;
  }

  .lp-section-smartphones-neo-3gt-screen-image img {
    width: 100%;
    max-width: 100%;
    height: auto;
  }

  .lp-section-smartphones-neo-3gt-design-image {
    width: 100%;
    max-width: 100%;
    min-height: auto;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    overflow: visible;
  }

  .lp-section-smartphones-neo-3gt-design-image-1,
  .lp-section-smartphones-neo-3gt-design-image-2 {
    width: 35rem;
    max-width: 45%;
    height: auto;
    position: relative;
  }

  .lp-section-smartphones-neo-3gt-durability-image img,
  .lp-section-smartphones-neo-3gt-triggers-image img {
    width: 100%;
    max-width: 35rem;
    height: auto;
  }

  .lp-section-smartphones-neo-3gt-design-image-1 {
    transform: translate(5rem, -10rem);
  }

  .lp-section-smartphones-neo-3gt-design-image-2 {
    transform: translate(-25rem, -10rem);
  }

  .lp-section-smartphones-neo-3gt-durability {
    margin-top: 10rem;
  }

  .lp-section-smartphones-neo-3gt-triggers-image {
    order: 2;
  }

  .lp-section-smartphones-neo-3gt-triggers-text {
    order: 1;
    max-width: 40rem;
  }

  .lp-section-smartphones-neo-3gt-buynow h3 {
    margin-top: 0rem;
  }

  /* Neo 3 Header */

  .lp-section-smartphones-neo-3 {
    margin-top: 10rem;
  }
  .lp-section-smartphones-neo-3-header {
    flex-direction: column;
    align-items: center;
    gap: 3rem;
    padding: 0 2rem;
    text-align: center;
  }

  .lp-section-smartphones-neo-3-header-title {
    display: flex;
    justify-content: center;
    align-items: center;
    order: 2;
    margin-top: 5rem;
  }

  .lp-section-smartphones-neo-3-header-title h3 {
    transform: translateY(-60rem);
  }

  .lp-section-smartphones-neo-3-header-title .frame-1 {
    margin-left: auto;
    margin-right: auto;
  }

  .lp-section-smartphones-neo-3-header-images {
    margin-left: 0;
    justify-content: center;
    width: 100%;
    overflow: visible;
    order: 1;
    transform: translateY(5rem);
  }

  /* Neo 3 Sections */
  .lp-section-smartphones-neo-3-design,
  .lp-section-smartphones-neo-3-cpu,
  .lp-section-smartphones-neo-3-durability,
  .lp-section-smartphones-neo-3-triggers {
    flex-direction: column;
    align-items: center;
    gap: 4rem;
    padding: 0 2rem;
    overflow: visible;
  }

  .lp-section-smartphones-neo-3-design-images {
    margin-right: 0;
    width: 100%;
    max-width: 40rem;
    overflow: visible;
    transform: translateX(2rem);
  }

  .lp-section-smartphones-neo-3-design-text {
    margin-top: 4rem;
  }

  .lp-section-smartphones-neo-3-cpu-image {
    order: 1;
  }

  .lp-section-smartphones-neo-3-cpu-text {
    order: 2;
  }

  .lp-section-smartphones-neo-3-triggers-text {
    order: 2;
  }

  .lp-section-smartphones-neo-3-triggers-image {
    order: 1;
  }

  .lp-section-smartphones-neo-3-design-image-1,
  .lp-section-smartphones-neo-3-design-image-2 {
    max-width: 45%;
    height: auto;
  }

  .lp-section-smartphones-neo-3-cpu-image,
  .lp-section-smartphones-neo-3-durability-image,
  .lp-section-smartphones-neo-3-triggers-image {
    margin: 0;
    width: 100%;
    max-width: 45rem;
    overflow: visible;
  }

  .lp-section-smartphones-neo-3-cpu-image img,
  .lp-section-smartphones-neo-3-durability-image img,
  .lp-section-smartphones-neo-3-triggers-image img {
    width: 100%;
    max-width: 100%;
    height: auto;
  }

  .lp-section-smartphones-neo-3-durability-text {
    margin: 0;
    text-align: center;
  }

  .lp-section-smartphones-neo-3-buynow h3 {
    margin-top: 0rem;
  }

  /* RedMagic Header */
  .lp-section-smartphones-redmagic-header {
    flex-direction: column;
    align-items: center;
    gap: 3rem;
    padding: 0 2rem;
    margin-top: 0rem;
  }

  .lp-section-smartphones-redmagic-header-image {
    margin-right: 0;
    width: 100%;
    max-width: 100%;
    overflow: visible;
    transform: translate(25%, 10rem);
  }

  .lp-section-smartphones-redmagic-header-title {
    margin-top: 15rem;
  }

  .lp-section-smartphones-redmagic-header-title h3 {
    transform: translateY(-65rem);
  }

  /* RedMagic Sections */
  .lp-section-smartphones-redmagic-screen,
  .lp-section-smartphones-redmagic-design,
  .lp-section-smartphones-redmagic-battery {
    flex-direction: column;
    gap: 4rem;
    padding: 0 2rem;
    align-items: center;
    overflow: visible;
  }

  .lp-section-smartphones-redmagic-screen {
    margin-top: 10rem;
  }

  .lp-section-smartphones-redmagic-screen-image {
    margin-left: 0;
    width: 100%;
    max-width: 45rem;
    height: auto;
  }

  .lp-section-smartphones-redmagic-screen-image img {
    width: 100%;
    max-width: 100%;
    height: auto;
  }

  .lp-section-smartphones-redmagic-design-image {
    width: 100%;
    max-width: 45rem;
    min-height: auto;
    overflow: visible;
    order: 2;
    margin-top: 5rem;
    margin-bottom: 10rem;
  }

  .lp-section-smartphones-redmagic-design-text {
    order: 1;
  }

  .lp-section-smartphones-redmagic-design-image-1 {
    width: 100%;
    max-width: 100%;
    height: auto;
  }

  .lp-section-smartphones-redmagic-battery-image img {
    margin-left: 0;
    width: 100%;
    max-width: 50rem;
    height: auto;
  }

  .lp-section-smartphones-redmagic-buynow h3 {
    margin-top: 0rem;
  }

  /* Tablets Hero */
  .lp-section-tablets-hero {
    height: auto;
    min-height: 60rem;
    background-size: 80%;
    background-position: 50rem;
    padding: 10rem 2rem 5rem 2rem;
  }

  .lp-section-tablets-hero-text {
    transform: translateX(-10rem);
    width: 100%;
    max-width: 60rem;
  }

  .lp-section-tablets-hero-text p {
    max-width: 40rem;
  }

  /* Tablet Header */
  .lp-section-tablet-header {
    flex-direction: column;
    align-items: center;
    gap: 3rem;
    padding: 0 2rem;
  }

  .lp-section-tablet-header h3 {
    transform: translateY(-55rem);
  }

  .lp-section-tablet-header-image {
    width: 100%;
    max-width: 45rem;
    height: auto;
    transform: translateY(18rem);
    margin-bottom: 5rem;
  }

  /* Tablet Features */
  .lp-section-tablet-cpu,
  .lp-section-tablet-design,
  .lp-section-tablet-battery {
    flex-direction: column;
    gap: 4rem;
    align-items: center;
    padding: 0 2rem;
    overflow: visible;
  }

  .lp-section-tablet-cpu-image,
  .lp-section-tablet-design-text {
    margin: 0;
    width: 100%;
    max-width: 100%;
  }

  .lp-section-tablet-cpu-image img {
    width: 100%;
    max-width: 40rem;
    height: auto;
    transform: translateX(50%);
  }

  .lp-section-tablet-cpu-image-oval-2,
  .lp-section-tablet-cpu-image-oval-1 {
    top: 0;
    right: 50%;
  }

  .lp-section-tablet-design-image {
    width: 100%;
    margin-right: 0;
    overflow: visible;
    order: 2;
    transform: translateX(25%);
    margin-top: 2rem;
  }

  .lp-section-tablet-design-text {
    order: 1;
  }

  .lp-section-tablet-design-image-1,
  .lp-section-tablet-design-image-2 {
    max-width: 45%;
    height: auto;
  }

  .lp-section-tablet-battery-image {
    width: 100%;
    max-width: 50rem;
    overflow: visible;
  }

  .lp-section-tablet-battery-image img {
    width: 100%;
    max-width: 100%;
    height: auto;
    margin-top: 10rem;
  }

  .lp-section-tablet-buynow h3 {
    margin-top: 0rem;
  }

  /* Router Hero */
  .lp-section-router-hero {
    height: auto;
    min-height: 60rem;
    flex-direction: column;
    padding: 10rem 2rem 5rem 2rem;
    align-items: center;
  }

  .lp-section-router-hero-text {
    margin: 0;
    z-index: var(--z-elevated);
    width: 100%;
    max-width: 40rem;
    transform: translate(40%, -10rem);
    margin-top: 0;
  }

  .lp-section-router-hero-image {
    width: 100rem;
    max-width: 150%;
    left: -40rem;
    top: 25rem;
  }

  /* Router Header */
  .lp-section-router-header {
    flex-direction: column;
    align-items: center;
    gap: 3rem;
    padding: 0 2rem;
    margin-top: 20rem;
  }

  .lp-section-router-header-image {
    width: 100%;
    max-width: 30rem;
    height: auto;
  }

  .lp-section-router-header-title-categories h3 {
    transform: translateY(-70rem);
  }

  .lp-section-router-header-title-categories {
    margin-top: 0rem;
    padding-top: 0rem;
  }

  /* Router Features */
  .lp-section-router-5g,
  .lp-section-router-wifi,
  .lp-section-router-ports,
  .lp-section-router-nfc {
    flex-direction: column;
    gap: 4rem;
    align-items: center;
    padding: 0 2rem;
    overflow: visible;
  }

  .lp-section-router-5g-image img,
  .lp-section-router-wifi-image-1,
  .lp-section-router-ports-image img,
  .lp-section-router-nfc-image img {
    width: 100%;
    max-width: 40rem;
    height: auto;
  }

  .lp-section-router-wifi-image {
    order: 2;
  }

  .lp-section-router-wifi-text {
    order: 1;
  }

  .lp-section-router-nfc-image {
    order: 2;
  }

  .lp-section-router-nfc-text {
    order: 1;
  }

  .lp-section-router-buynow h3 {
    margin-top: 0;
  }

  /* Speakers Hero */
  .lp-section-speakers-hero {
    height: 60rem;
    min-height: 60rem;
    background-size: 150%;
    background-position: left;
    padding: 10rem 2rem 5rem 2rem;
  }

  .lp-section-speakers-hero-text {
    margin: 0 auto;
    width: 100%;
    max-width: 40rem;
    transform: translateX(-10rem);
  }

  /* Speakers Header */
  .lp-section-speakers-header {
    flex-direction: column;
    align-items: center;
    gap: 3rem;
    padding: 0 2rem;
  }

  .lp-section-speakers-header-image {
    width: 100%;
    max-width: 30rem;
    height: auto;
  }

  /* Speakers Features */
  .lp-section-speakers-handle,
  .lp-section-speakers-size,
  .lp-section-speakers-led,
  .lp-section-speakers-battery {
    flex-direction: column;
    gap: 4rem;
    align-items: center;
    padding: 0 2rem;
    overflow: visible;
  }

  .lp-section-speakers-handle-image,
  .lp-section-speakers-size-image-1,
  .lp-section-speakers-led-image img,
  .lp-section-speakers-battery-image img {
    width: 100%;
    max-width: 45rem;
    height: auto;
  }

  .lp-section-speakers-header-image {
    margin-top: 20rem;
  }

  .lp-section-speakers-header-title-categories h3 {
    transform: translateY(-45rem);
  }

  .lp-section-speakers-handle {
    margin-top: 10rem;
  }

  .lp-section-speakers-handle-image {
    max-width: 30rem;
  }

  .lp-section-speakers-size-image {
    order: 2;
  }

  .lp-section-speakers-size-text {
    order: 1;
  }

  .lp-section-speakers-led-text {
    margin-top: 15rem;
  }

  .lp-section-speakers-battery-image {
    order: 2;
  }

  .lp-section-speakers-battery-text {
    order: 1;
    margin-top: 15rem;
  }

  /* Gamepad Hero */
  .lp-section-gamepad-hero {
    padding: 0rem 2rem 5rem 2rem;
  }

  .lp-section-gamepad-hero-text {
    width: 100%;
    max-width: 60rem;
  }

  .lp-section-gamepad-hero-image {
    width: 100%;
    max-width: 100%;
    height: auto;
  }

  /* Gamepad Header */
  .lp-section-gamepad-header {
    flex-direction: column;
    align-items: center;
    padding: 0 2rem;
  }

  .lp-section-gamepad-header-image {
    width: 100%;
    max-width: 80rem;
    height: auto;
  }

  /* Gamepad Features */
  .lp-section-gamepad-design {
    padding: 0 2rem;
    overflow: visible;
  }

  .lp-section-gamepad-design-image img {
    width: 100%;
    max-width: 90rem;
    height: auto;
  }

  .lp-section-gamepad-triggers,
  .lp-section-gamepad-magnetic {
    flex-direction: column;
    margin: 5rem 0;
    gap: 4rem;
    align-items: center;
    padding: 0 2rem;
    overflow: visible;
  }

  .lp-section-gamepad-triggers-image-1,
  .lp-section-gamepad-magnetic-image-1 {
    margin-left: 0;
    width: 100%;
    max-width: 55rem;
    height: auto;
  }

  .lp-section-gamepad-triggers-image {
    order: 2;
  }

  .lp-section-gamepad-triggers-text {
    order: 1;
  }

  .lp-section-gamepad-buynow h3 {
    margin: 0;
  }

  /* Buy Now Sections */
  .lp-section-smartphones-neo-3gt-buynow,
  .lp-section-smartphones-neo-3-buynow,
  .lp-section-smartphones-redmagic-buynow,
  .lp-section-tablet-buynow,
  .lp-section-router-buynow,
  .lp-section-speakers-buynow,
  .lp-section-gamepad-buynow {
    width: 100%;
    padding: 5rem 2rem;
    margin: 5rem auto;
    overflow: visible;
  }

  .shops-list {
    justify-content: center;
    gap: 2rem;
    flex-wrap: wrap;
  }

  .lp-section-introduction-description {
    display: flex;
    justify-content: center;
  }
}

/* ============================================
   Mobile landscape - 768px
   ============================================ */
@media screen and (max-width: 768px) {
  /* Typography */
  .body-text {
    font-size: 1.5rem;
    line-height: 2.5rem;
    font-size: 1.6rem;
  }

  .product-title.size-5 {
    font-size: 3.5rem;
  }

  .product-title.size-4 {
    font-size: 2.8rem;
  }

  .product-title.size-3 {
    font-size: 2.4rem;
  }

  .product-subtitle {
    font-size: 1.8rem;
  }

  .product-description {
    font-size: 1.6rem;
    margin-top: 2rem;
  }

  /* Hero Section */
  .lp-section-hero-logo {
    margin-top: 10rem;
  }

  .lp-section-hero-zte-logo {
    width: 6rem;
    margin-right: 2rem;
  }

  .lp-section-hero-nubia-logo {
    width: 13rem;
  }

  .lp-section-hero-title {
    margin-top: 4rem;
  }

  .lp-section-hero-title-secondary {
    font-size: 4rem;
  }

  .lp-section-hero-title-primary {
    font-size: 3.5rem;
  }

  .lp-section-hero-graphic {
    margin-top: 4rem;
  }

  /* Introduction */

  .lp-section-introduction-products {
    grid-template-columns: repeat(2, 17rem);
    gap: 10rem 2rem;
    margin-top: 10rem;
    margin-bottom: 6rem;
  }

  .lp-section-introduction-product {
    width: 17rem;
    height: 11rem;
  }

  .lp-section-introduction-product-title {
    font-size: 2.2rem;
    margin-bottom: 1.5rem;
  }

  .lp-section-introduction-description {
    width: 100%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    justify-content: center;
  }

  /* Frame Badges */
  .frame-1 {
    width: 100%;
    max-width: 35rem;
    height: 6.5rem;
  }

  .frame-title {
    font-size: 1.8rem;
  }

  /* Tooltips - Adjust for mobile */
  .frame-1::before {
    max-width: 30rem;
    font-size: 1.3rem;
    bottom: calc(100% + 0.8rem);
  }

  /* Smartphones Header */
  .lp-section-smartphones-header {
    height: 50rem;
    padding-top: 8rem;
  }

  .lp-section-smartphones-header-text p {
    width: 100%;
  }

  /* All Product Features - Mobile Column Layout */

  .product-feature-text {
    width: 100%;
    max-width: 100%;
    text-align: center;
    order: 1;
  }

  /* Images Order */
  .lp-section-smartphones-neo-3gt-screen-image,
  .lp-section-smartphones-neo-3gt-design-image,
  .lp-section-smartphones-neo-3gt-durability-image,
  .lp-section-smartphones-neo-3gt-triggers-image,
  .lp-section-smartphones-neo-3-design-image,
  .lp-section-smartphones-neo-3-cpu-image,
  .lp-section-smartphones-neo-3-durability-image,
  .lp-section-smartphones-neo-3-triggers-image,
  .lp-section-smartphones-redmagic-screen-image,
  .lp-section-smartphones-redmagic-design-image,
  .lp-section-smartphones-redmagic-battery-image {
    order: 2;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Image Sizes */
  .lp-section-smartphones-neo-3gt-screen-image img,
  .lp-section-smartphones-neo-3gt-design-image-1,
  .lp-section-smartphones-neo-3gt-design-image-2,
  .lp-section-smartphones-neo-3gt-durability-image img,
  .lp-section-smartphones-neo-3gt-triggers-image img {
    width: 100%;
    max-width: 45rem;
  }

  .lp-section-smartphones-neo-3gt-design-image-1 {
    transform: translate(40%, -8rem);
  }

  .lp-section-smartphones-neo-3gt-design-image-2 {
    transform: translate(-30%, -8rem);
  }

  .lp-section-smartphones-neo-3gt-design-image {
    width: 100%;
    min-height: auto;
  }

  .lp-section-smartphones-neo-3gt-design-image-1,
  .lp-section-smartphones-neo-3gt-design-image-2 {
    width: 35rem;
    position: relative;
    left: 0;
  }

  /* Header Images */
  .lp-section-smartphones-neo-3gt-header {
    flex-direction: column;
    gap: 3rem;
  }

  .lp-section-smartphones-neo-3gt-header-image,
  .lp-section-smartphones-neo-3-header-image-1,
  .lp-section-smartphones-neo-3-header-image-2,
  .lp-section-smartphones-neo-3-header-image-3 {
    width: 100%;
    max-width: 40rem;
  }

  .lp-section-smartphones-neo-3-header {
    flex-direction: column;
  }

  .lp-section-smartphones-neo-3-header-images {
    margin-left: 0;
    justify-content: center;
    max-width: 15rem;
  }

  .lp-section-smartphones-neo-3-header-images img {
    max-width: 20rem;
  }

  .lp-section-smartphones-neo-3-design-text,
  .lp-section-smartphones-neo-3-cpu-text,
  .p-section-smartphones-neo-3-durability-text,
  .lp-section-smartphones-neo-3-triggers-text,
  .lp-section-smartphones-redmagic-screen-text {
    display: flex;
    align-items: center;
  }

  .lp-section-smartphones-neo-3-durability-text p {
    margin: 0 auto;
  }

  /* RedMagic Header */
  .lp-section-smartphones-redmagic-header {
    flex-direction: column;
  }

  .lp-section-smartphones-redmagic-header-image {
    margin-right: 0;
  }

  .lp-section-smartphones-redmagic-header-image-1,
  .lp-section-smartphones-redmagic-header-image-2,
  .lp-section-smartphones-redmagic-header-image-3 {
    height: 35rem;
  }

  .lp-section-smartphones-redmagic-header-title h3 {
    transform: translateY(-55rem);
  }

  .lp-section-smartphones-header {
    background-image: url(../img/smartphone_hero_1.png);
    background-size: contain;
    background-position: 50% -20%;
    background-repeat: no-repeat;
    height: 70rem;
    display: flex;
    justify-content: flex-start;
  }

  .lp-section-smartphones-header-oval {
    width: 39.5rem;
    height: 72.2rem;
    transform: rotate(-52.218deg);
    border-radius: 72.2rem;
    background: var(--gradient-orange-1);
    filter: blur(var(--blur-large));
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translate(-50%, -20%) rotate(-52.218deg);
  }

  .lp-section-smartphones-header-image {
    display: none;
  }

  .lp-section-smartphones-header-text {
    position: absolute;
    flex-direction: column;
    align-items: center;
    z-index: var(--z-content);
    transform: translate(40%, 140%);
    padding: 0;
    margin: 0 auto;
  }

  .lp-section-smartphones-neo-3gt-header-title-categories h3 {
    transform: translateY(-50rem);
  }

  .lp-section-smartphones-neo-3gt-header-image {
    transform: translateY(4.5rem);
  }

  /* TABLETS SECTION - 768px */

  /* Tablets Hero */
  .lp-section-tablets-hero {
    height: auto;
    min-height: 60rem;
    background-size: 80%;
    background-position: 50rem;
    padding: 10rem 2rem 5rem 2rem;
    margin-top: 0rem;
  }

  .lp-section-tablets-hero-text {
    transform: translateX(-10rem);
    width: 100%;
    max-width: 60rem;
  }

  .lp-section-tablets-hero-text p {
    max-width: 40rem;
  }

  /* Tablet Section */
  .lp-section-tablet {
    padding: 0 4rem;
  }

  /* Tablet Header */
  .lp-section-tablet-header {
    flex-direction: column;
    align-items: center;
    gap: 3rem;
    padding: 0 2rem;
    margin-top: 0rem;
  }

  .lp-section-tablet-header h3 {
    transform: translateY(-55rem);
  }

  .lp-section-tablets-hero-image {
    width: 100%;
    max-width: 45rem;
    height: auto;
    transform: translateY(18rem);
    margin-bottom: 5rem;
  }

  .lp-section-tablets-hero {
    background-image: url(../img/tablet-hero-1.png);
    background-size: contain;
    background-position: 50% 0%;
    background-repeat: no-repeat;
    height: 100rem;
    display: flex;
    justify-content: flex-start;
  }

  .lp-section-tablets-hero-oval-1 {
    position: absolute;
    top: -30%;
  }

  .lp-section-tablets-hero-text {
    position: absolute;
    flex-direction: column;
    align-items: center;
    z-index: var(--z-content);
    transform: translate(10%, 90%);
    padding: 0;
    margin: 0 auto;
  }

  .lp-section-tablets-hero-text p {
    width: 120rem;
  }

  /* Tablet Features - Column Layout */
  .lp-section-tablet-cpu,
  .lp-section-tablet-design,
  .lp-section-tablet-battery {
    flex-direction: column;
    gap: 4rem;
    align-items: center;
    padding: 0 2rem;
    overflow: visible;
  }

  .lp-section-tablet-cpu-text,
  .lp-section-tablet-design-text,
  .lp-section-tablet-battery-text {
    width: 100%;
    max-width: 100%;
    text-align: center;
    order: 1;
    margin: 0;
  }

  .lp-section-tablet-cpu-text p,
  .lp-section-tablet-design-text p,
  .lp-section-tablet-battery-text p {
    width: 100%;
    max-width: 100%;
  }

  /* CPU Section */
  .lp-section-tablet-cpu-image {
    order: 2;
    margin: 0;
    width: 100%;
    max-width: 100%;
  }

  .lp-section-tablet-cpu-image img {
    width: 100%;
    max-width: 40rem;
    height: auto;
    transform: translateX(50%);
  }

  .lp-section-tablet-cpu-image-oval-2,
  .lp-section-tablet-cpu-image-oval-1 {
    top: 0;
    right: 50%;
  }

  /* Design Section */
  .lp-section-tablet-design-image {
    width: 100%;
    margin-right: 0;
    overflow: visible;
    order: 2;
    transform: translateX(25%);
    margin-top: 2rem;
  }

  .lp-section-tablet-design-text {
    order: 1;
  }

  .lp-section-tablet-design-image-1,
  .lp-section-tablet-design-image-2 {
    max-width: 45%;
    height: auto;
  }

  /* Battery Section */
  .lp-section-tablet-battery-image {
    width: 100%;
    max-width: 50rem;
    overflow: visible;
    order: 2;
  }

  .lp-section-tablet-battery-text {
    order: 1;
  }

  .lp-section-tablet-battery-image img {
    width: 100%;
    max-width: 100%;
    height: auto;
    margin-top: 10rem;
  }

  /* Buy Now */
  .lp-section-tablet-buynow h3 {
    margin-top: 0rem;
  }

  /* ROUTER SECTION - 768px */

  /* Router Hero */
  .lp-section-router-hero {
    background-image: url(../img/router-hero-1.png);
    background-size: contain;
    background-position: 50% 20%;
    background-repeat: no-repeat;
    height: 110rem;
    display: flex;
    justify-content: flex-start;
    margin-top: 0rem;
    margin-bottom: 0rem;
    padding-bottom: 0rem;
  }

  .lp-section-router-hero-text {
    position: absolute;
    flex-direction: column;
    align-items: center;
    z-index: var(--z-content);
    transform: translate(0%, 230%);
    padding: 0;
    margin: 12rem auto 0 auto;
  }

  .lp-section-router-hero-image {
    display: none;
  }

  .lp-section-router-hero-oval-1 {
    top: -20rem;
  }

  .lp-section-router-hero-text p {
    width: 100%;
    max-width: 100%;
  }

  /* Router Section */
  .lp-section-router-features {
    padding: 0 4rem;
  }

  /* Router Header */
  .lp-section-router-header {
    flex-direction: column;
    align-items: center;
    gap: 3rem;
    padding: 0 2rem;
    margin-top: 10rem;
  }

  .lp-section-router-header-image {
    width: 100%;
    max-width: 30rem;
    height: auto;
  }

  .lp-section-router-header-title-categories h3 {
    transform: translateY(-70rem);
  }

  .lp-section-router-header-title-categories {
    margin-top: 0rem;
    padding-top: 0rem;
  }

  /* Router Features - Column Layout */
  .lp-section-router-5g,
  .lp-section-router-wifi,
  .lp-section-router-ports,
  .lp-section-router-nfc {
    flex-direction: column;
    gap: 4rem;
    align-items: center;
    padding: 0 2rem;
    overflow: visible;
  }

  .lp-section-router-5g-text,
  .lp-section-router-wifi-text,
  .lp-section-router-ports-text,
  .lp-section-router-nfc-text {
    width: 100%;
    max-width: 100%;
    text-align: center;
    order: 1;
    margin: 0;
  }

  .lp-section-router-5g-text p,
  .lp-section-router-wifi-text p,
  .lp-section-router-ports-text p,
  .lp-section-router-nfc-text p {
    width: 100%;
    max-width: 100%;
  }

  /* 5G Section */
  .lp-section-router-5g-image {
    order: 2;
  }

  .lp-section-router-5g-image img {
    width: 100%;
    max-width: 40rem;
    height: auto;
  }

  /* WiFi Section */
  .lp-section-router-wifi-image {
    order: 2;
  }

  .lp-section-router-wifi-text {
    order: 1;
  }

  .lp-section-router-wifi-image-1 {
    width: 100%;
    max-width: 40rem;
    height: auto;
  }

  /* Ports Section */
  .lp-section-router-ports-image {
    order: 2;
  }

  .lp-section-router-ports-image img {
    width: 100%;
    max-width: 40rem;
    height: auto;
  }

  /* NFC Section */
  .lp-section-router-nfc-image {
    order: 2;
  }

  .lp-section-router-nfc-text {
    order: 1;
  }

  .lp-section-router-nfc-image img {
    width: 100%;
    max-width: 40rem;
    height: auto;
  }

  /* Buy Now */
  .lp-section-router-buynow h3 {
    margin-top: 0;
  }

  /* SPEAKERS SECTION - 768px */

  /* Speakers Hero */
  .lp-section-speakers-hero {
    position: relative;
    height: 80rem;
    background-size: 250% auto;
    background-position: center -40rem;
    background-repeat: no-repeat;
    background-color: var(--color-black-1);
  }

  .lp-section-speakers-hero::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50%;
    background: linear-gradient(to top, var(--color-black-1) 0%, var(--color-black-1) 60%, transparent 100%);
    pointer-events: none;
    z-index: 1;
  }

  .lp-section-speakers-hero-text {
    position: absolute;
    flex-direction: column;
    align-items: center;
    z-index: var(--z-content);
    transform: translate(0%, 130%);
    padding: 0;
    margin: 0 auto;
    z-index: 100;
  }

  .lp-section-speakers-hero-text p {
    width: 100%;
    max-width: 100%;
  }

  /* Speakers Section */
  .lp-section-speakers-features {
    padding: 0 4rem;
  }

  /* Speakers Header */
  .lp-section-speakers-header {
    flex-direction: column;
    align-items: center;
    gap: 3rem;
    padding: 0 2rem;
  }

  .lp-section-speakers-header-image {
    width: 100%;
    max-width: 30rem;
    height: auto;
    margin-top: 20rem;
  }

  .lp-section-speakers-header-title-categories h3 {
    transform: translateY(-45rem);
  }

  /* Speakers Features - Column Layout */
  .lp-section-speakers-handle,
  .lp-section-speakers-size,
  .lp-section-speakers-led,
  .lp-section-speakers-battery {
    flex-direction: column;
    gap: 4rem;
    align-items: center;
    padding: 0 2rem;
    overflow: visible;
  }

  .lp-section-speakers-handle-text,
  .lp-section-speakers-size-text,
  .lp-section-speakers-led-text,
  .lp-section-speakers-battery-text {
    width: 100%;
    max-width: 100%;
    text-align: center;
    order: 1;
    margin: 0;
  }

  .lp-section-speakers-handle-text p,
  .lp-section-speakers-size-text p,
  .lp-section-speakers-led-text p,
  .lp-section-speakers-battery-text p {
    width: 100%;
    max-width: 100%;
  }

  /* Handle Section */
  .lp-section-speakers-handle {
    margin-top: 10rem;
  }

  .lp-section-speakers-handle-image {
    max-width: 30rem;
    order: 2;
  }

  .lp-section-speakers-handle-image img {
    width: 100%;
    max-width: 45rem;
    height: auto;
  }

  /* Size Section */
  .lp-section-speakers-size-image {
    order: 2;
  }

  .lp-section-speakers-size-text {
    order: 1;
  }

  .lp-section-speakers-size-image-1 {
    width: 100%;
    max-width: 45rem;
    height: auto;
  }

  /* LED Section */
  .lp-section-speakers-led-text {
    margin-top: 15rem;
  }

  .lp-section-speakers-led-image {
    order: 2;
  }

  .lp-section-speakers-led-image img {
    width: 100%;
    max-width: 45rem;
    height: auto;
  }

  /* Battery Section */
  .lp-section-speakers-battery-image {
    order: 2;
  }

  .lp-section-speakers-battery-text {
    order: 1;
    margin-top: 15rem;
  }

  .lp-section-speakers-battery-image img {
    width: 100%;
    max-width: 45rem;
    height: auto;
  }

  /* GAMEPAD SECTION - 768px */

  /* Gamepad Hero */
  .lp-section-gamepad-hero {
    padding: 0rem 2rem 0rem 2rem;
    display: flex;
    flex-direction: column;
  }

  .lp-section-gamepad-hero-text {
    width: 100%;
    max-width: 60rem;
    order: 2;
    margin-top: 10rem;
  }

  .lp-section-gamepad-hero-text p {
    max-width: 60rem;
  }

  .lp-section-gamepad-hero-image {
    width: 100%;
    max-width: 100%;
    height: auto;
    order: 1;
  }

  /* Gamepad Section */
  .lp-section-gamepad-features {
    padding: 0 4rem;
  }

  /* Gamepad Header */
  .lp-section-gamepad-header {
    flex-direction: column;
    align-items: center;
    padding: 0 2rem;
  }

  .lp-section-gamepad-header-image {
    width: 100%;
    max-width: 80rem;
    height: auto;
  }

  /* Gamepad Design Section */
  .lp-section-gamepad-design {
    padding: 0 2rem;
    overflow: visible;
  }

  .lp-section-gamepad-design-text {
    max-width: 60rem;
    text-align: center;
    order: 1;
  }

  .lp-section-gamepad-design-text p {
    width: 100%;
    max-width: 100%;
  }

  .lp-section-gamepad-design-image {
    order: 2;
  }

  .lp-section-gamepad-design-image img {
    width: 100%;
    max-width: 90rem;
    height: auto;
  }

  /* Gamepad Features - Column Layout */
  .lp-section-gamepad-triggers,
  .lp-section-gamepad-magnetic {
    flex-direction: column;
    margin: 5rem 0;
    gap: 4rem;
    align-items: center;
    padding: 0 2rem;
    overflow: visible;
  }

  .lp-section-gamepad-triggers-image {
    display: flex;
    justify-content: center;
  }

  .lp-section-gamepad-triggers-text,
  .lp-section-gamepad-magnetic-text {
    width: 100%;
    max-width: 100%;
    text-align: center;
    order: 1;
    margin: 0;
  }

  .lp-section-gamepad-triggers-text p,
  .lp-section-gamepad-magnetic-text p {
    width: 100%;
    max-width: 100%;
  }

  /* Triggers Section */
  .lp-section-gamepad-triggers-image {
    order: 2;
    width: 100%;
    max-width: 100%;
  }

  .lp-section-gamepad-triggers-text {
    order: 1;
  }

  .lp-section-gamepad-triggers-image-1 {
    margin-left: 0;
    width: 100%;
    max-width: 55rem;
    height: auto;
  }

  /* Magnetic Section */
  .lp-section-gamepad-magnetic-image {
    order: 2;
    width: 100%;
    max-width: 100%;
    display: flex;
    justify-content: center;
  }

  .lp-section-gamepad-magnetic-image-1 {
    margin-left: 0;
    width: 100%;
    max-width: 55rem;
    height: auto;
  }

  /* Buy Now */
  .lp-section-gamepad-buynow h3 {
    margin: 0;
  }

  /* Buy Now */
  .buynow-title {
    font-size: 3rem;
    margin: 6rem 0 2rem 0;
  }

  .shops-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 3rem 2rem;
    justify-items: center;
    align-items: center;
  }

  .shops-list-separator,
  .shops-list-separator-purple,
  .shops-list-separator-blue {
    display: none;
  }

  .shops-list-orange,
  .shops-list-plus,
  .shops-list-ztenubia,
  .shops-list-euro,
  .shops-list-mediaexpert,
  .shops-list-komputronik,
  .shops-list-xkom {
    height: auto;
    max-height: 5rem;
  }
}

/* ============================================
   Mobile portrait - 576px
   ============================================ */
@media screen and (max-width: 576px) {
  /* Root Variables - 40px margins from Figma */
  :root {
    --content-padding-side: 4rem;
  }

  /* Typography - Based on Figma specs */
  html {
    font-size: 62.5%; /* 1rem = 10px */
  }

  .lp-section-introduction-description {
    display: flex;
    justify-content: center;
    max-width: 100vw;
  }

  .body-text {
    font-size: 1.6rem;
    line-height: 2.8rem;
    text-align: center;
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin: 0;
  }

  .product-title.size-5 {
    font-size: 2.7rem;
    text-align: center;
  }

  .product-title.size-4 {
    font-size: 2.7rem;
    text-align: center;
  }

  .product-title.size-3 {
    font-size: 2.7rem;
    text-align: center;
  }

  .product-subtitle {
    font-size: 1.9rem;
    text-align: center;
  }

  .product-description {
    font-size: 1.6rem;
    line-height: 2.8rem;
    text-align: center;
    margin-top: 3rem;
  }

  .product-feature {
    margin-bottom: 7rem;
  }

  /* Hero Section */
  .lp-section-hero-logo {
    margin-top: 8rem;
  }

  .lp-section-hero-zte-logo {
    width: 5rem;
    margin-right: 1.5rem;
  }

  .lp-section-hero-nubia-logo {
    width: 11rem;
  }

  .lp-section-hero-title {
    margin-top: 3rem;
  }

  .lp-section-hero-title-secondary {
    font-size: 3.2rem;
  }

  .lp-section-hero-title-primary {
    font-size: 2.8rem;
  }

  .lp-section-hero-graphic {
    margin-top: 3rem;
  }

  /* Introduction - Single Column */
  .lp-section-introduction-products {
    grid-template-columns: repeat(2, 17rem);
    gap: 10rem 2rem;
    margin-top: 10rem;
    margin-bottom: 6rem;
  }

  .lp-section-introduction-product {
    width: 100%;
    max-width: 25rem;
  }

  .lp-section-introduction-product-title {
    font-size: 2rem;
  }

  /* Spacing */
  .space-27 {
    margin-top: 2.7rem;
  }

  .space-40 {
    margin-bottom: 4rem;
  }

  .space-113 {
    margin-bottom: 8rem;
  }

  /* Frame Badges - 40px from edges */
  .frame-1 {
    width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 5.3rem;
    padding: 1.5rem;
    margin-bottom: 2.5rem;
    margin-left: auto;
    margin-right: auto;
  }

  .frame-title {
    font-size: 1.6rem;
    line-height: 2.9rem;
  }

  .frame-1::before {
    max-width: 90vw;
    font-size: 1.2rem;
    left: 50%;
    transform: translateX(-50%) scale(0);
  }

  /* Section Headers */
  .lp-section-smartphones-header,
  .lp-section-tablets-hero,
  .lp-section-router-hero,
  .lp-section-speakers-hero,
  .lp-section-gamepad-hero {
    height: auto;
    min-height: 40rem;
    padding: 0rem 4rem 0rem 4rem;
  }

  .lp-section-router-hero {
    height: 100rem;
  }

  .lp-section-router-hero-oval-1 {
    z-index: 1;
  }

  .lp-section-smartphones-header {
    height: 60rem;
    display: flex;
    align-items: center;
    width: 100%;
  }

  .lp-section-smartphones-header-text {
    width: 100%;
    padding: 0;
    margin: 0 auto;
    transform: none;
    transform: translate(0%, 30rem);
  }

  .lp-section-smartphones-header-text p {
    margin: 0 auto;
    width: 85%;
  }

  .lp-section-speakers-hero-text {
    transform: translateY(46rem);
  }

  /* SMARTPHONES SECTION - All centered with 40px margins */

  /* Neo 3GT Header */
  .lp-section-smartphones-neo-3gt {
    padding: 0 4rem;
  }

  .lp-section-smartphones-neo-3gt-header {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 6rem;
    gap: 4rem;
    padding: 0;
    width: 100%;
  }

  .lp-section-smartphones-neo-3gt-header-image {
    width: 100%;
    max-width: 33.5rem;
    height: auto;
    order: 1;
  }

  .lp-section-smartphones-neo-3gt-header-title {
    order: 2;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .lp-section-smartphones-neo-3gt-header-title-categories {
    width: 100%;
    align-items: center;
  }

  /* Neo 3GT Features - All vertical centered */
  .lp-section-smartphones-neo-3gt-screen,
  .lp-section-smartphones-neo-3gt-design,
  .lp-section-smartphones-neo-3gt-durability,
  .lp-section-smartphones-neo-3gt-triggers {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3rem;
    margin-top: 5rem;
    padding: 0;
  }
  /* 
  .lp-section-smartphones-neo-3gt-screen-text,
  .lp-section-smartphones-neo-3gt-design-text,
  .lp-section-smartphones-neo-3gt-durability-text,
  .lp-section-smartphones-neo-3gt-triggers-text {
    width: 100%;
    max-width: 100%;
    text-align: center;
    order: 1;
    margin: 0;
  }

  .lp-section-smartphones-neo-3gt-screen-text p,
  .lp-section-smartphones-neo-3gt-design-text p,
  .lp-section-smartphones-neo-3gt-durability-text p,
  .lp-section-smartphones-neo-3gt-triggers-text p {
    width: 90%;
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
  } */

  .lp-section-smartphones-neo-3gt-screen-image {
    order: 2;
    width: 100%;
    max-width: 100%;
  }

  .lp-section-smartphones-neo-3gt-screen-image img {
    width: 100%;
    max-width: 33.2rem;
    transform: translateY(0);
    margin: 0 auto;
    display: block;
  }

  .lp-section-smartphones-neo-3gt-design-image {
    order: 2;
    width: 100%;
    min-height: auto;
    height: auto;
  }

  .lp-section-smartphones-neo-3gt-design-image-1,
  .lp-section-smartphones-neo-3gt-design-image-2 {
    width: 35rem;
    position: relative;
    left: 0;
  }

  .lp-section-smartphones-neo-3gt-design-image-1 {
    transform: translate(10, 2rem);
  }

  .lp-section-smartphones-neo-3gt-design-image-2 {
    transform: translate(-10rem, -8rem);
  }

  .lp-section-smartphones-neo-3gt-durability-image {
    order: 2;
    width: 100%;
  }

  .lp-section-smartphones-neo-3gt-durability-image img {
    width: 100%;
    max-width: 24.3rem;
    margin: 0 auto;
    display: block;
  }

  .lp-section-smartphones-neo-3gt-triggers-image {
    order: 2;
    width: 100%;
  }

  .lp-section-smartphones-neo-3gt-triggers-image img {
    width: 100%;
    max-width: 26rem;
    margin: 0 auto;
    display: block;
  }

  /* Neo 3 Header */
  .lp-section-smartphones-neo-3 {
    padding: 0 4rem;
    margin-top: 5rem;
  }

  .lp-section-smartphones-neo-3-header {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4rem;
    padding: 0;
  }

  .lp-section-smartphones-neo-3-header-images {
    order: 1;
    margin: 0;
    justify-content: center;
    width: 100%;
    transform: translateY(10rem);
  }

  .lp-section-smartphones-neo-3-header-image-1,
  .lp-section-smartphones-neo-3-header-image-2,
  .lp-section-smartphones-neo-3-header-image-3 {
    width: auto;
    height: 24.2rem;
    transform: none;
  }

  .lp-section-smartphones-neo-3-header-title {
    order: 2;
    width: 100%;
  }

  .lp-section-smartphones-neo-3-header-title h3 {
    transform: translateY(-35rem);
  }

  /* Neo 3 Features */
  .lp-section-smartphones-neo-3-design,
  .lp-section-smartphones-neo-3-cpu,
  .lp-section-smartphones-neo-3-durability,
  .lp-section-smartphones-neo-3-triggers {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3rem;
    margin-top: 5rem;
    padding: 0;
  }

  .lp-section-smartphones-neo-3-header-title-categories {
    width: 100vw;
  }

  .lp-section-smartphones-neo-3-design-text,
  .lp-section-smartphones-neo-3-cpu-text,
  .lp-section-smartphones-neo-3-durability-text,
  .lp-section-smartphones-neo-3-triggers-text {
    width: 100%;
    text-align: center;
    order: 1;
    margin: 0;
    z-index: 1000;
  }

  .lp-section-smartphones-neo-3-design-text p,
  .lp-section-smartphones-neo-3-cpu-text p,
  .lp-section-smartphones-neo-3-durability-text p,
  .lp-section-smartphones-neo-3-triggers-text p {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  .lp-section-smartphones-neo-3-design-images {
    order: 2;
    margin: 0;
    width: 100%;
    transform: translateX(0);
  }

  .lp-section-smartphones-neo-3-design-image-1,
  .lp-section-smartphones-neo-3-design-image-2 {
    max-width: 15rem;
    height: auto;
  }

  .lp-section-smartphones-neo-3-cpu-image {
    order: 2;
    margin: 0;
    width: 100%;
    max-width: 24.5rem;
  }

  .lp-section-smartphones-neo-3-cpu-image img {
    width: 100%;
    max-width: 100%;
  }

  .lp-section-smartphones-neo-3-durability-image {
    order: 2;
    width: 100%;
    max-width: 25.6rem;
    margin: 0 auto;
  }

  .lp-section-smartphones-neo-3-durability-image img {
    width: 100%;
  }

  .lp-section-smartphones-neo-3-triggers-image {
    order: 2;
    width: 100%;
    max-width: 28.4rem;
    margin: 0 auto;
  }

  .lp-section-smartphones-neo-3-triggers-image img {
    width: 100%;
  }

  /* RedMagic Header */
  .lp-section-smartphones-redmagic {
    padding: 0 4rem;
    margin-top: 5rem;
  }

  .lp-section-smartphones-redmagic-header {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4rem;
    padding: 0;
    margin-top: 10rem;
  }

  .lp-section-smartphones-redmagic-header-image {
    order: 1;
    margin: 0;
    width: 100%;
    transform: none;
  }

  .lp-section-smartphones-redmagic-header-image-1,
  .lp-section-smartphones-redmagic-header-image-2,
  .lp-section-smartphones-redmagic-header-image-3 {
    height: 26.6rem;
    transform: none;
  }

  .lp-section-smartphones-redmagic-header-title {
    order: 2;
    width: 100%;
    margin-top: 0;
  }

  .lp-section-smartphones-redmagic-header-title h3 {
    transform: translateY(0);
  }

  /* RedMagic Features */
  .lp-section-smartphones-redmagic-screen,
  .lp-section-smartphones-redmagic-design,
  .lp-section-smartphones-redmagic-battery {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3rem;
    margin-top: 5rem;
    padding: 0;
  }

  .lp-section-smartphones-redmagic-screen-text,
  .lp-section-smartphones-redmagic-design-text,
  .lp-section-smartphones-redmagic-battery-text {
    width: 100%;
    text-align: center;
    order: 1;
    margin: 0;
    z-index: 1000;
  }

  .lp-section-smartphones-redmagic-screen-text p,
  .lp-section-smartphones-redmagic-design-text p,
  .lp-section-smartphones-redmagic-battery-text p {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  .lp-section-smartphones-redmagic-header-title-categories h3 {
    transform: translateY(-40rem);
  }

  .lp-section-smartphones-redmagic-header-image {
    justify-content: center;
  }

  .lp-section-smartphones-redmagic-screen-image {
    order: 2;
    width: 100%;
    max-width: 35.7rem;
    height: auto;
    margin: 0 auto;
    display: flex;
    justify-content: center;
  }

  .lp-section-smartphones-redmagic-screen-image img {
    width: 80%;
  }

  .lp-section-smartphones-redmagic-design-image {
    order: 2;
    width: 100%;
    max-width: 25.3rem;
    min-height: auto;
    margin: 0 auto;
  }

  .lp-section-smartphones-redmagic-design-image-1 {
    width: 100%;
  }

  .lp-section-smartphones-redmagic-battery-image {
    order: 2;
    width: 100%;
  }

  .lp-section-smartphones-redmagic-battery-image img {
    width: 100%;
    max-width: 33.8rem;
    margin: 0 auto;
    display: block;
  }

  /* TABLETS SECTION - All centered with 40px margins */

  /* Tablets Hero */
  .lp-section-tablets-hero {
    height: 100rem;
    min-height: auto;
    padding: 3.5rem 0rem 0 0rem;
    background-size: 100% 100%;
    background-position: 50% 0%;
    height: 50rem;
    display: flex;
    justify-content: flex-start;
    margin-bottom: 50rem;
    overflow: visible;
  }

  .lp-section-tablets-hero-text {
    width: 100%;
    max-width: 100%;
    transform: none;
    margin: 0;
    padding: 0;
    transform: translateY(50rem);
    z-index: 1000;
  }

  .lp-section-tablets-hero-oval-1 {
    display: none;
  }

  .lp-section-tablets-hero-text h3 {
    text-align: center;
    margin-bottom: 2.7rem;
    margin-left: 0;
    margin-right: 0;
  }

  .lp-section-tablets-hero-text p {
    width: 100%;
    max-width: 26.2rem;
    margin: 0 auto;
    text-align: center;
  }

  /* Tablet Header */
  .lp-section-tablet {
    padding: 0 4rem;
  }

  .lp-section-tablet-header {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4rem;
    padding: 0;
    margin-top: 8.6rem;
  }

  .lp-section-tablet-header-image {
    width: 100%;
    max-width: 37.6rem;
    height: auto;
    order: 1;
    transform: translateY(8rem);
    margin-bottom: 0;
  }

  .lp-section-tablet-header-title-categories {
    width: 100%;
    order: 2;
  }

  .lp-section-tablet-header h3 {
    transform: translateY(-50rem);
    text-align: center;
    margin-bottom: 4rem;
  }

  /* Tablet Features - All vertical centered */
  .lp-section-tablet-cpu,
  .lp-section-tablet-design,
  .lp-section-tablet-battery {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3rem;
    margin-top: 5rem;
    padding: 0;
  }

  .lp-section-tablet-cpu-text,
  .lp-section-tablet-design-text,
  .lp-section-tablet-battery-text {
    width: 100%;
    max-width: 100%;
    text-align: center;
    order: 1;
    margin: 0;
  }

  .lp-section-tablet-cpu-text p,
  .lp-section-tablet-design-text p,
  .lp-section-tablet-battery-text p {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  /* Tablet CPU Section */
  .lp-section-tablet-cpu {
    margin-top: 7.6rem;
  }

  .lp-section-tablet-cpu-image {
    order: 2;
    width: 100%;
    max-width: 20.9rem;
    margin: 0 auto;
  }

  .lp-section-tablet-cpu-image img {
    width: 100%;
    transform: translateX(0);
  }

  .lp-section-tablet-cpu-image-oval-2,
  .lp-section-tablet-cpu-image-oval-1 {
    display: none;
  }

  /* Tablet Design Section */
  .lp-section-tablet-design {
    margin-top: 5rem;
  }

  .lp-section-tablet-design-image {
    width: 100%;
    max-width: 100%;
    margin: 0;
    order: 2;
    transform: translateX(0);
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 0;
    min-height: auto;
  }

  .lp-section-tablet-design-text {
    order: 1;
  }

  .lp-section-tablet-design-image-1 {
    width: 100%;
    max-width: 17.98rem;
    height: auto;
    transform: translateX(10rem);
  }

  .lp-section-tablet-design-image-2 {
    width: 100%;
    max-width: 17.95rem;
    height: auto;
    transform: translateX(-5rem);
  }

  /* Tablet Battery Section */
  .lp-section-tablet-battery {
    margin-top: 5rem;
  }

  .lp-section-tablet-battery-text {
    order: 1;
  }

  .lp-section-tablet-battery-image {
    width: 100%;
    max-width: 100%;
    order: 2;
    margin: 0;
    overflow: visible;
  }

  .lp-section-tablet-battery-image img {
    width: 100%;
    max-width: 39.2rem;
    height: auto;
    margin: 0 auto;
    display: block;
    transform: rotate(15deg);
  }

  .lp-section-tablet-battery-oval {
    display: none;
  }

  /* Tablet Buy Now */
  .lp-section-tablet-buynow {
    width: 100%;
    padding: 0;
    margin: 8rem auto 0 auto;
  }

  .lp-section-tablet-buynow h3 {
    margin: 0 0 2.9rem 0;
    text-align: center;
  }

  .lp-section-tablet-buynow h4 {
    text-align: center;
    margin-bottom: 5rem;
  }

  .shops-list-tablets {
    justify-content: center;
    margin: 0;
  }

  /* Router Hero */
  .lp-section-router-hero-image {
    width: 60rem;
    left: -15rem;
    top: 20rem;
  }

  .lp-section-router-header {
    width: 100%;
  }

  .lp-section-router-header-title {
    width: 100%;
  }

  /* Speakers Hero */
  .lp-section-speakers-hero {
    background-size: auto 150%;
    background-position: center 120%;
    height: 80rem;
  }

  .lp-section-speakers-header {
    width: 100%;
  }

  .lp-section-speakers-header-title {
    width: 100%;
  }

  /* Gamepad */
  .lp-section-gamepad-hero-image {
    width: 120%;
    max-width: none;
  }

  .lp-section-gamepad-header-title {
    width: 100%;
  }

  .lp-section-gamepad-triggers,
  .lp-section-gamepad-magnetic {
    margin: 4rem 0;
  }

  .lp-section-gamepad-design-text p {
    width: 100%;
  }

  /* Buy Now */
  .buynow-title {
    font-size: 2.7rem;
    margin: 8rem 0 2.9rem 0;
    text-align: center;
  }

  .lp-section-smartphones-neo-3gt-buynow,
  .lp-section-smartphones-neo-3-buynow,
  .lp-section-smartphones-redmagic-buynow,
  .lp-section-tablet-buynow,
  .lp-section-router-buynow,
  .lp-section-speakers-buynow,
  .lp-section-gamepad-buynow {
    width: 100%;
    padding: 0 4rem;
    margin: 5rem auto;
  }

  .lp-section-smartphones-neo-3gt-buynow {
    margin-top: 5rem;
    margin-bottom: 5rem;
  }

  .shops-list,
  .shops-list-tablets,
  .shops-list-speaker,
  .shops-list-gamepad {
    margin-top: 5rem;
    gap: 2.5rem;
    justify-content: center;
  }

  .shops-list-orange,
  .shops-list-plus,
  .shops-list-ztenubia,
  .shops-list-euro,
  .shops-list-mediaexpert,
  .shops-list-komputronik,
  .shops-list-xkom {
    height: auto;
    max-height: 3rem;
  }

  /* Blur Effects - Reduce for Performance */
  :root {
    --blur-xsmall: 4rem;
    --blur-small: 10rem;
    --blur-medium: 15rem;
    --blur-large: 20rem;
    --blur-xlarge: 25rem;
  }

  /* Hide Decorative Elements on Small Screens */
  .lp-section-hero-oval1,
  .lp-section-hero-oval2 {
    display: none;
  }
}

/* ============================================
   MEDIA QUERY: BELOW 576px
   Extra small devices - body-text and frame-1 at 90% width
   ============================================ */
@media (max-width: 576px) {
  /* Make sure lp-section uses full width */

  /* Adjust frame title font size for better fit */
  .frame-title {
    font-size: 2rem;
  }

  /* Ensure tooltips don't overflow on small screens */
  .frame-1::before {
    max-width: 80vw;
    left: 50%;
    transform: translateX(-50%) scale(0);
  }

  .frame-1:hover::before {
    transform: translateX(-50%) scale(1);
  }
}

/* ============================================
   SCROLL TO TOP BUTTON
   Fixed button in bottom right corner
   ============================================ */

/* Scroll to top button container */
.scroll-to-top-container {
  position: fixed;
  bottom: 4rem;
  right: 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: var(--z-top);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--transition-medium), visibility var(--transition-medium);
}

.scroll-to-top-container.visible {
  opacity: 1;
  visibility: visible;
}

/* Button styling */
.scroll-to-top-button {
  width: 6rem;
  height: 6rem;
  border-radius: 12.55rem;
  background: linear-gradient(180deg, #a550c3 0%, #311272 100%);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform var(--transition-medium), box-shadow var(--transition-medium);
  box-shadow: 0 0.4rem 1.5rem rgba(165, 80, 195, 0.3);
}

.scroll-to-top-button:hover {
  transform: translateY(-0.5rem);
  box-shadow: 0 0.8rem 2.5rem rgba(165, 80, 195, 0.5);
}

.scroll-to-top-button:active {
  transform: translateY(-0.2rem);
}

.scroll-to-top-button svg {
  width: 12.6rem;
  height: 12.7rem;
  pointer-events: none;
}

/* Label styling */
.scroll-to-top-label {
  margin-top: 2rem;
  font-family: Manrope, sans-serif;
  font-size: 1.3rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.0893rem;
  background: linear-gradient(180deg, #f8cbf5 0%, #9b6dd9 180.53%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-align: center;
  white-space: nowrap;
}

/* Responsive adjustments for scroll to top button */
@media (max-width: 1200px) {
  .scroll-to-top-container {
    bottom: 2rem;
    right: 2rem;
  }

  .scroll-to-top-button {
    width: 4rem;
    height: 4rem;
  }

  .scroll-to-top-button svg {
    width: 10rem;
    height: 10.1rem;
  }

  .scroll-to-top-label {
    font-size: 1rem;
    letter-spacing: 0.054rem;
    margin-top: 1.4rem;
  }
}

@media (max-width: 768px) {
  .scroll-to-top-container {
    bottom: 2rem;
    right: 2rem;
  }

  .scroll-to-top-button {
    width: 2rem;
    height: 2rem;
  }

  .scroll-to-top-button svg {
    width: 8rem;
    height: 8.1rem;
  }

  .scroll-to-top-label {
    font-size: 0.7rem;
    letter-spacing: 0.054rem;
    margin-top: 1.2rem;
  }
}

@media (max-width: 510px) {
  .lp-section-smartphones-header {
    background-image: url(../img/smartphone_hero_1.png);
    background-size: contain;
    background-position: 50% -10%;
    background-repeat: no-repeat;
    height: 70rem;
    display: flex;
    justify-content: flex-start;
  }
}