/* ---------- RESET & BASE ---------- */
    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }
    body {
      background-color: #000;
      color: #fff;
      font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
      line-height: 1.5;
    }
    a {
      text-decoration: none;
      color: inherit;
    }
    img {
      max-width: 100%;
      display: block;
    }
    .row {
      max-width: 1280px;
      margin: 0 auto;
      padding: 0 24px;
    }
    /* buttons & tags */
    .button {
      display: inline-block;
      padding: 12px 28px;
      border-radius: 40px;
      font-weight: 600;
      transition: 0.2s;
      text-align: center;
    }
    .button.primary {
      background: #FF5300;
      color: #fff;
      border: none;
    }
    .button.secondary {
      background: transparent;
      border: 1px solid #FF5300;
      color: #FF5300;
    }
    .button.outline {
      background: transparent;
      border: 1px solid #FF5300;
      color: #FF5300;
    }
    .tag {
      display: inline-block;
      background: rgba(255, 83, 0, 0.2);
      padding: 4px 12px;
      border-radius: 40px;
      font-size: 0.85rem;
      color: #FF5300;
      margin-bottom: 16px;
    }
    .heading-3 {
      font-size: 2.5rem;
      font-weight: 600;
      line-height: 1.2;
      margin-bottom: 1rem;
    }
    .heading-4 {
      font-size: 1.8rem;
      font-weight: 500;
    }
    .emphasis {
      font-size: 1.2rem;
      color: #ccc;
      margin-bottom: 1.5rem;
    }
    /* header */
    .header-top-banner {
      background: #000;
      border-bottom: 1px solid #222;
      padding: 10px 0;
      text-align: center;
      font-size: 0.9rem;
    }
    .pick-up-news {
      background: #111;
      padding: 8px;
      text-align: center;
      font-size: 0.8rem;
      color: #aaa;
    }
    .main-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 20px 24px;
      max-width: 1280px;
      margin: 0 auto;
    }
    .logo img {
      height: 32px;
      width: auto;
    }
    .nav-links {
      display: flex;
      gap: 32px;
      font-weight: 500;
    }
    .nav-links a:hover {
      color: #FF5300;
    }
    .cart-icon svg {
      width: 22px;
      stroke: #fff;
    }
    .header-actions {
      display: flex;
      gap: 20px;
      align-items: center;
    }
    /* hero */
    .hero {
      padding: 60px 0 80px;
    }
    .hero-grid {
      display: flex;
      flex-wrap: wrap;
      gap: 40px;
      align-items: center;
    }
    .hero-content {
      flex: 1;
    }
    .hero-illustration {
      flex: 1;
      text-align: center;
    }
    .stats-list {
      display: flex;
      gap: 32px;
      margin-top: 40px;
      list-style: none;
    }
    .stats-list li {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 0.9rem;
    }
    /* info blocks */
    .infos-grid {
      display: flex;
      flex-wrap: wrap;
      gap: 40px;
      justify-content: center;
      text-align: center;
      padding: 60px 0;
    }
    .info-card {
      flex: 1;
      min-width: 200px;
    }
    .info-card img {
      width: 48px;
      margin-bottom: 16px;
      margin-inline: auto;
    }
    /* generic banner */
    .generic-banner {
      background: linear-gradient(90deg, #000 30%, transparent), url('/images/banner_desktop.webp');
      background-size: cover;
      background-position: center;
      border-radius: 32px;
      margin: 40px 24px;
      padding: 60px 40px;
    }
    @media (max-width: 768px) {
      .generic-banner { background-image: url('/images/banner_mobile.webp'); }
    }
    /* product cards */
    .products-grid {
      display: flex;
      flex-wrap: wrap;
      gap: 30px;
      margin: 48px 0;
    }
    .product-card {
      background: #111;
      border-radius: 28px;
      padding: 24px;
      flex: 1;
      transition: 0.2s;
      border: 1px solid #222;
    }
    .product-card img {
      border-radius: 20px;
      margin-bottom: 20px;
    }
    .product-card h3 {
      font-size: 1.6rem;
      margin-bottom: 12px;
    }
    /* cryptos */
    .crypto-icons {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 32px;
      margin: 40px 0;
    }
    .crypto-icons img {
      width: 56px;
      height: 56px;
      object-fit: contain;
    }
    /* scrolly simplified */
    .scrolly-section {
      display: flex;
      flex-wrap: wrap;
      gap: 48px;
      align-items: center;
      padding: 80px 0;
    }
    /* testimonials (vanilla slider) */
    .testimonial-slider {
      position: relative;
      overflow: hidden;
      margin: 40px 0;
    }
    .testimonial-track {
      display: flex;
      transition: transform 0.4s ease;
      gap: 24px;
    }
    .testimonial-card {
      background: #111;
      border-radius: 24px;
      padding: 28px;
      flex: 0 0 calc(33.33% - 16px);
      min-width: 280px;
    }
    @media (max-width: 900px) {
      .testimonial-card { flex: 0 0 calc(50% - 12px); }
    }
    @media (max-width: 600px) {
      .testimonial-card { flex: 0 0 100%; }
    }
    .slider-controls {
      display: flex;
      justify-content: flex-end;
      gap: 16px;
      margin-top: 24px;
    }
    .slider-btn {
      background: #222;
      border: none;
      color: white;
      padding: 8px 20px;
      border-radius: 40px;
      cursor: pointer;
    }
    /* FAQ */
    .faq-item {
      border-bottom: 1px solid #333;
      margin-bottom: 16px;
    }
    .faq-question {
      background: none;
      border: none;
      width: 100%;
      text-align: left;
      font-size: 1.2rem;
      font-weight: 600;
      padding: 20px 0;
      cursor: pointer;
      display: flex;
      justify-content: space-between;
      color: #fff;
    }
    .faq-answer {
      display: none;
      padding-bottom: 20px;
      color: #ccc;
    }
    .faq-answer.active {
      display: block;
    }
    /* newsletter & footer */
    .newsletter-section {
      background: #0a0a0a;
      padding: 60px 0;
    }
    .newsletter-flex {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      gap: 40px;
    }
    .social-links {
      display: flex;
      gap: 20px;
      margin-top: 24px;
    }
    .footer-links {
      display: flex;
      flex-wrap: wrap;
      gap: 48px;
      margin-top: 40px;
    }
    .footer-col a {
      display: block;
      color: #aaa;
      margin: 8px 0;
      font-size: 0.85rem;
    }
    .footer-col strong {
      font-size: 1rem;
      margin-bottom: 12px;
      display: inline-block;
    }
    .legal-note {
      font-size: 0.7rem;
      color: #666;
      margin-top: 40px;
      text-align: center;
    }
    @media (max-width: 768px) {
      .nav-links { display: none; }
      .hero-grid { flex-direction: column; text-align: center; }
      .stats-list { justify-content: center; }
      .heading-3 { font-size: 1.8rem; }
    }
    button, input {
      font-family: inherit;
    }
    .inline-form {
      display: flex;
      flex-wrap: wrap;
      gap: 16px;
      margin-top: 20px;
    }
    .input-group {
      position: relative;
    }
    .input-group input {
      background: transparent;
      border: 1px solid #444;
      border-radius: 40px;
      padding: 12px 16px;
      color: #fff;
      width: 260px;
    }
    .input-group label {
      position: absolute;
      left: 16px;
      top: 12px;
      color: #aaa;
      pointer-events: none;
      transition: 0.2s;
    }
    .input-group input:focus + label,
    .input-group input:not(:placeholder-shown) + label {
      top: -10px;
      font-size: 12px;
      background: #0a0a0a;
      padding: 0 4px;
    }