﻿    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
      --purple:       #6b21a8;
      --purple-light: #9333ea;
      --purple-soft:  #c084fc;
      --purple-pale:  #f5f0ff;
      --purple-bg:    #1a1028;
      --gold:         #c9a84c;
      --gold-light:   #e8c97a;
      --white:        #ffffff;
      --off-white:    #fafafa;
      --gray-50:      #f7f7f8;
      --gray-100:     #f0f0f2;
      --gray-200:     #e2e2e7;
      --gray-400:     #9898a8;
      --gray-600:     #5a5a6e;
      --gray-800:     #28283a;
      --black:        #14141e;
      --green:        #22c55e;
      --radius:       10px;
    }

    html { scroll-behavior: smooth; }

    body {
      font-family: 'Inter', sans-serif;
      background: var(--white);
      color: var(--gray-800);
      font-size: 15px;
      line-height: 1.6;
    }

    a { text-decoration: none; color: inherit; }
    img { display: block; max-width: 100%; }

    /* ══════════════════════════════
       HEADER
    ══════════════════════════════ */
    header {
      background: var(--white);
      position: sticky;
      top: 0;
      /* Acima das .spa-page com overflow-* (clip) — senão menu fixo dentro do header
         fica “atrás” do hero mesmo com z alto no backdrop/nav (stacking só no contexto pai). */
      z-index: 10100;
      border-bottom: 1px solid var(--gray-100);
      box-shadow: 0 2px 16px rgba(0,0,0,0.07);
    }

    .header-wrap {
      max-width: 1260px;
      margin: 0 auto;
      padding: 0 clamp(14px, 4vw, 32px);
      min-height: 72px;
      height: auto;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: clamp(12px, 2vw, 28px);
      flex-wrap: nowrap;
      width: 100%;
      max-width: 100%;
      box-sizing: border-box;
    }

    @media (min-width: 901px) {
      .main-nav {
        flex: 1;
        justify-content: center;
      }
    }

    .header-actions {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-shrink: 0;
    }

    .btn-cta-head {
      background: linear-gradient(135deg, var(--purple), var(--purple-light));
      color: var(--white);
      padding: 10px 22px;
      border-radius: 50px;
      font-size: 13px;
      font-weight: 600;
      transition: opacity 0.15s, transform 0.15s;
      white-space: nowrap;
      box-shadow: 0 4px 14px rgba(107,33,168,0.3);
    }

    .btn-cta-head:hover { opacity: 0.88; transform: translateY(-1px); }

    /* ══════════════════════════════
       HERO VÍDEO
    ══════════════════════════════ */
    .hero {
      position: relative;
      overflow: hidden;
      background: #000;
      width: 100%;
      aspect-ratio: 16 / 9;
      min-height: 480px;
    }

    /* camada que cobre o overlay do YouTube (nome do canal) */
    .hero-yt-shield {
      position: absolute;
      inset: 0;
      z-index: 2;
      pointer-events: none;
    }

    /* escurecimento geral + gradiente lateral para foco no título */
    .hero-overlay {
      position: absolute;
      inset: 0;
      z-index: 3;
      background:
        /* camada escura uniforme no topo */
        linear-gradient(to bottom, rgba(10,3,22,0.55) 0%, rgba(10,3,22,0.30) 100%),
        /* gradiente lateral que foca o texto à esquerda */
        linear-gradient(100deg, rgba(10,3,22,0.80) 0%, rgba(10,3,22,0.45) 50%, rgba(10,3,22,0.15) 100%);
      pointer-events: none;
    }

    /* conteúdo sobre o vídeo */
    .hero-content {
      position: absolute;
      inset: 0;
      z-index: 4;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 0 80px;
      width: 100%;
    }

    /* vídeo de fundo */
    .hero-video {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      z-index: 0;
      /* performance hint */
      will-change: transform;
    }

    /* fallback: imagem estática exibida enquanto o vídeo carrega */
    .hero-img-fallback {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      z-index: 0;
    }

    /* esconde fallback assim que o vídeo estiver pronto */
    .hero-video-loaded .hero-img-fallback { opacity: 0; }


    /* botão mute/unmute */
    .hero-mute-btn {
      position: absolute;
      bottom: 32px;
      right: 32px;
      z-index: 10;
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: rgba(255,255,255,0.15);
      border: 1.5px solid rgba(255,255,255,0.3);
      color: var(--white);
      font-size: 18px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      backdrop-filter: blur(6px);
      transition: background 0.2s;
    }

    .hero-mute-btn:hover { background: rgba(255,255,255,0.28); }


    .hero-eyebrow {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--purple-soft);
      margin-bottom: 16px;
    }

    .hero-content h1 {
      font-family: 'Playfair Display', serif;
      font-size: clamp(28px, 4vw, 52px);
      font-weight: 700;
      line-height: 1.08;
      color: var(--white);
      max-width: 640px;
      margin-bottom: 20px;
    }

    .hero-content h1 em {
      font-style: italic;
      color: var(--gold-light);
    }

    .hero-content p {
      font-size: 16px;
      color: rgba(255,255,255,0.78);
      max-width: 440px;
      margin-bottom: 36px;
      line-height: 1.7;
    }

    .hero-btns { display: flex; gap: 12px; flex-wrap: wrap; }

    .btn-hero-primary {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: linear-gradient(135deg, var(--purple), var(--purple-light));
      color: var(--white);
      padding: 13px 28px;
      border-radius: 8px;
      font-size: 14px;
      font-weight: 700;
      transition: transform 0.2s, box-shadow 0.2s;
      box-shadow: 0 6px 20px rgba(107,33,168,0.45);
    }

    .btn-hero-primary:hover { transform: translateY(-2px); box-shadow: 0 10px 30px rgba(107,33,168,0.55); }

    .btn-hero-secondary {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: rgba(255,255,255,0.12);
      border: 1px solid rgba(255,255,255,0.3);
      color: var(--white);
      padding: 13px 28px;
      border-radius: 8px;
      font-size: 14px;
      font-weight: 600;
      backdrop-filter: blur(4px);
      transition: background 0.2s;
    }

    .btn-hero-secondary:hover { background: rgba(255,255,255,0.22); }

    /* scroll-down indicator */
    .hero-scroll {
      position: absolute;
      bottom: 28px;
      left: 50%;
      transform: translateX(-50%);
      z-index: 10;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
      color: rgba(255,255,255,0.55);
      font-size: 11px;
      letter-spacing: 1.5px;
      text-transform: uppercase;
      cursor: pointer;
      animation: scrollBounce 2s ease-in-out infinite;
    }

    @keyframes scrollBounce {
      0%, 100% { transform: translateX(-50%) translateY(0); }
      50% { transform: translateX(-50%) translateY(6px); }
    }

    .hero-scroll svg { opacity: 0.6; }

    /* ── Color dots por produto ── */
    .dot-purple      { background: #2c1654; }
    .dot-tan         { background: #8b7355; }
    .dot-black       { background: #1a1a1a; }
    .dot-brown-dark  { background: #3d2b1f; }
    .dot-tan-light   { background: #c0a080; }
    .dot-brown-mid   { background: #5c4033; }
    .dot-saddle      { background: #8b4513; }
    .dot-blue        { background: #2e6ca4; }
    .dot-brown       { background: #8b6343; }
    .dot-aura-split  { background: linear-gradient(90deg, #2e6ca4 50%, #8b6343 50%); }
    .dot-wine        { background: #6b1a2e; }
    .dot-gray-prem   { background: #8a8a8a; }
    .dot-champagne   { background: #c8a882; }

    /* ── Badge topo de linha (gradiente roxo) ── */
    .p-badge-top {
      background: linear-gradient(135deg, #6b21a8, #9333ea);
      color: #fff;
    }

    /* ── Blog section dentro de products-section ── */
    .blog-products-grid {
      grid-template-columns: repeat(3, 1fr);
    }

    .blog-p-cat { margin-bottom: 8px; }
    .blog-p-title { font-size: 16px; margin-bottom: 8px; }
    .blog-p-desc { font-size: 13px; color: var(--gray-400); line-height: 1.6; }

    /* ── Contact layout ── */
    .contact-layout {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 40px;
      max-width: 960px;
      margin: 0 auto;
    }

    .contact-form-card {
      background: var(--white);
      border: 1px solid var(--gray-200);
      border-radius: 16px;
      padding: 36px;
    }

    .contact-form-title {
      font-family: 'Playfair Display', serif;
      font-size: 20px;
      margin-bottom: 24px;
      color: var(--black);
    }

    .contact-field-label {
      font-size: 13px;
      font-weight: 600;
      color: var(--gray-600);
      display: block;
      margin-bottom: 6px;
    }

    .contact-field-wrap { margin-bottom: 16px; }

    .contact-input {
      width: 100%;
      padding: 11px 14px;
      border: 1.5px solid var(--gray-200);
      border-radius: 8px;
      font-size: 14px;
      font-family: 'Inter', sans-serif;
      outline: none;
      transition: border-color 0.2s;
      background: var(--white);
      color: var(--gray-800);
    }

    .contact-input:focus { border-color: var(--purple); }

    .contact-textarea { resize: vertical; min-height: 88px; }

    .contact-submit {
      width: 100%;
      background: linear-gradient(135deg, var(--purple), var(--purple-light));
      color: var(--white);
      border: none;
      padding: 13px;
      border-radius: 8px;
      font-size: 14px;
      font-weight: 700;
      cursor: pointer;
      font-family: 'Inter', sans-serif;
      margin-top: 4px;
      transition: opacity 0.2s;
    }

    .contact-submit:hover { opacity: 0.88; }

    .contact-info-side { display: flex; flex-direction: column; gap: 16px; }

    .wa-contact-card {
      display: flex;
      align-items: center;
      gap: 16px;
      background: linear-gradient(135deg, #2ecc71 0%, #25D366 50%, #1da851 100%);
      border-radius: 14px;
      padding: 22px 24px;
      text-decoration: none;
      box-shadow: 0 4px 20px rgba(37,211,102,0.35);
      transition: transform 0.2s, box-shadow 0.2s;
      position: relative;
      overflow: hidden;
    }

    .wa-contact-card:hover {
      transform: translateY(-2px);
      box-shadow: 0 8px 32px rgba(37,211,102,0.5);
    }

    .wa-contact-icon { font-size: 38px; flex-shrink: 0; color: #fff; }
    .wa-contact-number { color: #fff; font-size: 17px; font-weight: 700; display: block; }
    .wa-contact-label { color: rgba(255,255,255,0.85); font-size: 13px; }

    .contact-details-card {
      background: var(--white);
      border: 1px solid var(--gray-200);
      border-radius: 14px;
      padding: 24px;
      display: flex;
      flex-direction: column;
      gap: 16px;
    }

    .contact-detail-row { display: flex; align-items: flex-start; gap: 12px; }

    .contact-detail-icon {
      width: 38px;
      height: 38px;
      border-radius: 9px;
      background: var(--purple-pale);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 18px;
      flex-shrink: 0;
    }

    .contact-detail-title { font-size: 14px; font-weight: 600; color: var(--gray-800); display: block; }
    .contact-detail-sub { font-size: 13px; color: var(--gray-400); }

    .contact-mission-card {
      background: var(--purple-pale);
      border: 1px solid rgba(107,33,168,0.2);
      border-radius: 14px;
      padding: 24px;
    }

    .contact-mission-title { font-size: 14px; font-weight: 700; color: var(--purple); display: block; margin-bottom: 6px; }
    .contact-mission-text { font-size: 13px; color: var(--gray-600); line-height: 1.65; }

    /* ── Why section background ── */
    .why-section-bg { background: var(--off-white); }

    /* ── Contact section background ── */
    .contact-section { background: var(--gray-50); }

    /* ── Blog card link reset ── */
    .blog-card-link { text-decoration: none; color: inherit; display: block; }

    /* ── Blog section background ── */
    .blog-section { background: var(--white); }

    /* ── Feature split img row fix ── */
    .row1 { grid-row: 1; }

    /* YouTube iframe — ocupa exatamente o hero */
    .hero-yt-wrap {
      position: absolute;
      inset: 0;
      pointer-events: none;
    }

    .hero-yt-wrap iframe {
      width: 100%;
      height: 100%;
      border: none;
      display: block;
    }

    /* ══════════════════════════════
       TRUST BAR
    ══════════════════════════════ */
    .trust-bar {
      background: var(--gray-50);
      border-bottom: 1px solid var(--gray-200);
    }

    .trust-inner {
      max-width: 1260px;
      margin: 0 auto;
      padding: 0 24px;
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      divide-x: 1px solid var(--gray-200);
    }

    .trust-item {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 14px 16px;
      border-right: 1px solid var(--gray-200);
    }

    .trust-item:last-child { border-right: none; }

    .trust-icon {
      width: 32px;
      height: 32px;
      border-radius: 8px;
      font-size: 16px;
      background: var(--purple-pale);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 20px;
      flex-shrink: 0;
    }

    .trust-item b { font-size: 12px; font-weight: 600; color: var(--gray-800); display: block; line-height: 1.2; }
    .trust-item span { font-size: 11px; color: var(--gray-400); }

    /* ══════════════════════════════
       FEATURE SPLIT (Devoted to...)
    ══════════════════════════════ */
    .feature-split {
      max-width: 1260px;
      margin: 48px auto;
      padding: 0;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0;
      border-radius: 16px;
      overflow: hidden;
      box-shadow: 0 4px 32px rgba(0,0,0,0.08);
    }

    .feature-split-img {
      position: relative;
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: 520px 380px;
      gap: 6px;
      background: var(--gray-200);
    }

    .feature-split-img .img-cell {
      overflow: hidden;
      background: var(--gray-100);
    }

    .feature-split-img .img-cell img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      transition: transform 0.4s;
    }

    .feature-split-img .img-cell:hover img { transform: scale(1.05); }

    .feature-split-img .img-cell.span2 {
      grid-column: span 2;
    }

    .feature-split-copy {
      background: var(--purple-pale);
      padding: 48px 56px;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .eyebrow {
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--purple);
      margin-bottom: 12px;
    }

    .feature-split-copy h2 {
      font-family: 'Playfair Display', serif;
      font-size: clamp(22px, 2.5vw, 30px);
      font-weight: 700;
      line-height: 1.2;
      color: var(--black);
      margin-bottom: 16px;
    }

    .feature-sub {
      font-size: 16px;
      color: var(--gray-700);
      line-height: 1.7;
      font-weight: 500;
      margin-bottom: 14px;
    }

    .feature-desc {
      font-size: 13px;
      color: var(--gray-400);
      line-height: 1.75;
      margin-bottom: 28px;
    }

    .feature-split-copy p {
      font-size: 15px;
      color: var(--gray-600);
      line-height: 1.75;
      margin-bottom: 32px;
    }

    .btn-outline-purple {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      border: 2px solid var(--purple);
      color: var(--purple);
      padding: 11px 24px;
      border-radius: 8px;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.5px;
      text-transform: uppercase;
      transition: background 0.2s, color 0.2s;
      width: fit-content;
    }

    .btn-outline-purple:hover { background: var(--purple); color: var(--white); }

    /* ══════════════════════════════
       SECTION HEADING
    ══════════════════════════════ */
    .sec-head {
      text-align: center;
      margin-bottom: 28px;
    }

    .sec-head .eyebrow { display: block; margin-bottom: 8px; }

    .sec-head h2 {
      font-family: 'Playfair Display', serif;
      font-size: clamp(22px, 2.8vw, 32px);
      font-weight: 700;
      color: var(--black);
      margin-bottom: 10px;
    }

    .sec-head p { font-size: 15px; color: var(--gray-400); max-width: 520px; margin: 0 auto; }

    /* ══════════════════════════════
       PRODUCT TABS + GRID
    ══════════════════════════════ */
    .products-section {
      background: var(--white);
      padding: 48px 24px;
    }

    .products-inner {
      max-width: 1260px;
      margin: 0 auto;
      width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }

    .product-tabs {
      display: flex;
      justify-content: center;
      gap: 6px;
      margin-bottom: 40px;
      flex-wrap: wrap;
    }

    .tab-btn {
      padding: 8px 22px;
      border-radius: 100px;
      font-size: 13px;
      font-weight: 600;
      border: 1.5px solid var(--gray-200);
      color: var(--gray-600);
      background: var(--white);
      cursor: pointer;
      transition: all 0.2s;
    }

    .tab-btn.active, .tab-btn:hover {
      background: var(--purple);
      border-color: var(--purple);
      color: var(--white);
    }

    .products-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 24px;
    }

    .product-card {
      background: var(--white);
      border: 1px solid var(--gray-200);
      border-radius: 14px;
      overflow: hidden;
      transition: box-shadow 0.25s, transform 0.25s;
      position: relative;
    }

    .product-card:hover {
      box-shadow: 0 12px 40px rgba(107,33,168,0.13);
      transform: translateY(-4px);
    }

    .product-card-img {
      position: relative;
      aspect-ratio: 1;
      overflow: hidden;
      background: var(--gray-50);
    }

    .product-card-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.4s, opacity 0.35s ease;
    }

    .product-card:hover .product-card-img img { transform: scale(1.06); }

    .product-card-img .wishlist-btn {
      position: absolute;
      top: 12px;
      right: 12px;
      width: 32px;
      height: 32px;
      border-radius: 50%;
      background: var(--white);
      border: 1px solid var(--gray-200);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 15px;
      cursor: pointer;
      opacity: 0;
      transition: opacity 0.2s;
      z-index: 2;
    }

    .product-card:hover .wishlist-btn { opacity: 1; }

    .p-badge {
      position: absolute;
      top: 12px;
      left: 12px;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 1px;
      text-transform: uppercase;
      padding: 4px 10px;
      border-radius: 4px;
      z-index: 2;
    }

    .p-badge.novo { background: var(--purple); color: var(--white); }
    .p-badge.destaque { background: var(--gold); color: var(--black); }
    .p-badge.premium { background: var(--black); color: var(--white); }

    .product-card-body { padding: 18px 18px 20px; }

    .product-color-dots {
      display: flex;
      gap: 5px;
      margin-bottom: 10px;
    }

    .color-dot {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      border: 1.5px solid var(--gray-200);
    }

    .product-card-body h3 {
      font-size: 15px;
      font-weight: 600;
      color: var(--gray-800);
      margin-bottom: 4px;
      line-height: 1.3;
    }

    .product-card-body .p-cat {
      font-size: 12px;
      color: var(--gray-400);
      margin-bottom: 12px;
    }

    .product-card-footer {
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .p-price {
      font-size: 14px;
      font-weight: 700;
      color: var(--purple);
    }

    .p-price small {
      font-size: 11px;
      font-weight: 400;
      color: var(--gray-400);
      display: block;
    }

    .p-price-detail {
      font-size: 10px;
      font-weight: 400;
      color: var(--gray-400);
      display: block;
    }

    .aura-footer {
      align-items: flex-end;
    }

    .aura-price {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .aura-price-full {
      font-size: 11px;
      font-weight: 400;
      color: var(--gray-400);
      text-decoration: line-through;
    }

    .aura-price-parcel {
      font-size: 13px;
      font-weight: 700;
      color: var(--purple);
    }

    .aura-price-pix {
      font-size: 11px;
      font-weight: 500;
      color: #16a34a;
    }

    /* Resumo de avaliação PDP — sempre visível abaixo do preço/PIX */
    .pdp-rating-inline {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px 14px;
      margin-top: 12px;
      margin-bottom: 6px;
    }

    .pdp-rating-inline .pdp-rating-stars {
      margin-bottom: 0;
      font-size: clamp(14px, 2vw, 17px);
      line-height: 1;
      letter-spacing: 0.06em;
    }

    .pdp-rating-inline .pdp-rating-stars .star:not(.empty) {
      color: var(--gold);
      text-shadow: 0 1px 6px rgba(245, 158, 11, 0.22);
    }

    .pdp-rating-inline .pdp-rating-stars .star.half {
      color: var(--gray-200);
    }

    .pdp-rating-inline .pdp-rating-stars .star.half::before {
      color: var(--gold);
      text-shadow: 0 1px 6px rgba(245, 158, 11, 0.22);
    }

    .pdp-rating-meta {
      font-size: 13px;
      font-weight: 600;
      color: var(--gray-600);
      line-height: 1.3;
    }

    .add-btn {
      width: 34px;
      height: 34px;
      border-radius: 8px;
      background: var(--purple);
      color: var(--white);
      border: none;
      font-size: 20px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: background 0.2s, transform 0.15s;
    }

    .add-btn:hover { background: var(--purple-light); transform: scale(1.08); }

    .stars {
      display: flex;
      gap: 2px;
      margin-bottom: 8px;
      font-size: 12px;
    }

    .star { color: var(--gold); }
    .star.empty { color: var(--gray-200); }
    .star.half {
      position: relative;
      display: inline-block;
      color: var(--gray-200);
    }
    .star.half::before {
      content: "★";
      position: absolute;
      left: 0;
      top: 0;
      width: 50%;
      overflow: hidden;
      color: var(--gold);
    }

    /* ══════════════════════════════
       PROMO BANNER
    ══════════════════════════════ */
    .promo-banner {
      background: #000;
      padding: 0;
      position: relative;
      overflow: hidden;
    }

    .promo-banner::before {
      content: '';
      position: absolute;
      right: -100px;
      top: -100px;
      width: 500px;
      height: 500px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(147,51,234,0.2) 0%, transparent 70%);
      pointer-events: none;
    }

    .promo-inner {
      max-width: 1260px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 40px;
      align-items: center;
    }

    .promo-tag {
      display: inline-block;
      background: var(--gold);
      color: var(--black);
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 2px;
      text-transform: uppercase;
      padding: 5px 12px;
      border-radius: 4px;
    }

    /* badge sobre a imagem */
    .promo-tag-img {
      position: absolute;
      top: 16px;
      left: 16px;
      z-index: 3;
    }

    .promo-img-only {
      position: relative;
    }

    .promo-img-only img {
      width: 100%;
      height: 460px;
      display: block;
      object-fit: cover;
      object-position: center center;
    }

    .promo-copy h2 {
      font-family: 'Playfair Display', serif;
      font-size: clamp(24px, 3vw, 38px);
      font-weight: 700;
      color: var(--white);
      line-height: 1.1;
      margin-bottom: 12px;
    }

    .promo-copy h2 span { color: var(--gold-light); }

    .promo-copy p {
      color: rgba(255,255,255,0.6);
      font-size: 15px;
      margin-bottom: 28px;
    }

    .btn-gold {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: linear-gradient(135deg, var(--gold), var(--gold-light));
      color: var(--black);
      padding: 13px 28px;
      border-radius: 8px;
      font-size: 14px;
      font-weight: 700;
      transition: transform 0.2s, box-shadow 0.2s;
      box-shadow: 0 6px 20px rgba(201,168,76,0.35);
    }

    .btn-gold:hover { transform: translateY(-2px); box-shadow: 0 10px 30px rgba(201,168,76,0.5); }

    .promo-img-wrap {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: flex-end;
    }

    .promo-img-wrap img {
      max-height: 320px;
      object-fit: contain;
      filter: drop-shadow(0 20px 40px rgba(0,0,0,0.4));
      position: relative;
      z-index: 2;
      display: block;
      transition: transform 0.3s;
    }

    .promo-img-wrap .glow {
      position: absolute;
      width: 320px;
      height: 320px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(147,51,234,0.35) 0%, transparent 70%);
      right: 20px;
    }

    /* link wrapper da imagem promo */
    .promo-img-link {
      position: relative;
      display: inline-block;
      z-index: 2;
      cursor: pointer;
    }

    .promo-img-link:hover img { transform: scale(1.04); }

    .promo-img-hover {
      position: absolute;
      inset: 0;
      background: rgba(107,33,168,0.45);
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      transition: opacity 0.25s;
      border-radius: 12px;
    }

    .promo-img-hover span {
      color: var(--white);
      font-size: 15px;
      font-weight: 700;
      letter-spacing: 0.5px;
      background: rgba(0,0,0,0.35);
      padding: 10px 22px;
      border-radius: 8px;
      border: 1.5px solid rgba(255,255,255,0.3);
    }

    .promo-img-link:hover .promo-img-hover { opacity: 1; }

    /* botão secundário da promo */
    .promo-actions { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; margin-top: 4px; }

    .btn-promo-ver {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      color: rgba(255,255,255,0.75);
      font-size: 14px;
      font-weight: 600;
      border-bottom: 1px solid rgba(255,255,255,0.3);
      padding-bottom: 2px;
      transition: color 0.2s, border-color 0.2s;
    }

    .btn-promo-ver:hover { color: var(--gold-light); border-color: var(--gold-light); }

    /* ══════════════════════════════
       WHY US
    ══════════════════════════════ */
    .why-section {
      padding: 48px 24px;
      background: var(--off-white);
      position: relative;
      overflow: hidden;
    }

    /* ── Flores da Vida decorativas (base reutilizável) ── */
    .flower-bg {
      position: absolute;
      aspect-ratio: 1 / 1;
      pointer-events: none;
      user-select: none;
      z-index: 0;
      transform-origin: center center;
      will-change: transform;
    }

    @keyframes flower-spin {
      to { transform: rotate(360deg); }
    }
    @keyframes flower-spin-reverse {
      to { transform: rotate(-360deg); }
    }

    /* Why Us — deslocada para o canto direito */
    .why-flower-bg {
      top: -90px;
      right: -160px;
      width: min(740px, 80%);
      opacity: 0.14;
      mix-blend-mode: multiply;
      animation: flower-spin 120s linear infinite;
    }

    /* Hero — canto inferior esquerdo, sobre vídeo escuro + gradiente */
    .hero-flower-bg {
      bottom: -70px;
      left: -70px;
      width: clamp(240px, 28vw, 380px);
      opacity: 0.22;
      mix-blend-mode: screen;
      z-index: 3;
      animation: flower-spin-reverse 90s linear infinite;
    }

    /* Feature Split — canto superior direito, sobre fundo roxo claro */
    .feature-flower-bg {
      top: -110px;
      right: -130px;
      width: clamp(300px, 34vw, 480px);
      opacity: 0.18;
      z-index: 2;
      mix-blend-mode: multiply;
      animation: flower-spin 150s linear infinite;
    }
    .feature-split { position: relative; overflow: hidden; }
    .feature-split-img, .feature-split-copy { position: relative; z-index: 1; }

    /* About CTA Florianópolis — canto inferior direito, sobre imagem escura */
    .about-flower-bg {
      bottom: -150px;
      right: -150px;
      width: clamp(400px, 50vw, 640px);
      opacity: 0.32;
      mix-blend-mode: screen;
      z-index: 1;
      animation: flower-spin-reverse 100s linear infinite;
    }
    .about-cta-content { position: relative; z-index: 2; }

    @media (prefers-reduced-motion: reduce) {
      .flower-bg { animation: none !important; }
    }

    /* Tablet — ajustes intermediários */
    @media (max-width: 900px) {
      .why-flower-bg {
        width: min(560px, 88%);
        opacity: 0.14;
        right: -80px;
        top: -50px;
      }
      .hero-flower-bg {
        width: clamp(220px, 42vw, 320px);
        opacity: 0.30;
        bottom: -40px;
        left: -40px;
      }
      /* No tablet/mobile o feature-split vira 1 coluna — joga a flor pro canto inferior
         direito, sobre o bloco roxo claro do texto, em vez do canto sup sobre as fotos */
      .feature-flower-bg {
        top: auto;
        bottom: -70px;
        right: -70px;
        width: clamp(260px, 50vw, 380px);
        opacity: 0.16;
      }
      .about-flower-bg {
        width: min(440px, 80%);
        opacity: 0.36;
        bottom: -90px;
        right: -90px;
      }
    }

    /* Mobile pequeno — ajustes finos para telas estreitas */
    @media (max-width: 600px) {
      .why-flower-bg {
        width: min(420px, 95%);
        opacity: 0.13;
        right: -50px;
        top: -40px;
      }
      .hero-flower-bg {
        width: clamp(200px, 50vw, 260px);
        opacity: 0.32;
        bottom: -30px;
        left: -30px;
      }
      .feature-flower-bg {
        width: min(280px, 70%);
        opacity: 0.15;
        bottom: -50px;
        right: -50px;
      }
      .about-flower-bg {
        width: min(360px, 90%);
        opacity: 0.34;
        bottom: -70px;
        right: -70px;
      }
    }

    .why-inner { max-width: 1260px; margin: 0 auto; position: relative; z-index: 1; }

    .why-layout {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 64px;
      align-items: center;
    }

    .why-img-mosaic {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: auto auto;
      gap: 12px;
    }

    .why-img-mosaic .mosaic-cell {
      border-radius: 12px;
      overflow: hidden;
      background: var(--gray-100);
    }

    .why-img-mosaic .mosaic-cell img {
      width: 100%;
      height: 220px;
      object-fit: cover;
      transition: transform 0.4s;
    }

    .why-img-mosaic .mosaic-cell:hover img { transform: scale(1.05); }
    .why-img-mosaic .mosaic-cell.tall img { height: 260px; }
    .why-img-mosaic .mosaic-cell.full { grid-column: 1 / -1; }

    .why-copy .eyebrow { margin-bottom: 10px; }

    .why-copy h2 {
      font-family: 'Playfair Display', serif;
      font-size: clamp(22px, 2.5vw, 30px);
      font-weight: 700;
      line-height: 1.2;
      color: var(--black);
      margin-bottom: 16px;
    }

    .why-copy > p {
      font-size: 15px;
      color: var(--gray-600);
      line-height: 1.75;
      margin-bottom: 32px;
    }

    .why-features {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 16px;
      margin-bottom: 36px;
    }

    .why-feat {
      display: flex;
      align-items: flex-start;
      gap: 12px;
    }

    .why-benefits {
      list-style: none;
      padding: 0;
      margin: 0 0 36px 0;
      display: flex;
      flex-direction: column;
      gap: 16px;
    }

    .why-benefits li {
      display: flex;
      flex-direction: column;
      gap: 3px;
      padding-left: 16px;
      position: relative;
    }

    .why-benefits li::before {
      content: '';
      position: absolute;
      left: 0;
      top: 8px;
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--purple);
    }

    .why-benefits li b {
      font-size: 14px;
      font-weight: 700;
      color: var(--gray-800);
    }

    .why-benefits li span {
      font-size: 13px;
      color: var(--gray-400);
      line-height: 1.6;
    }

    .why-feat-icon {
      width: 38px;
      height: 38px;
      border-radius: 9px;
      background: var(--purple-pale);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 18px;
      flex-shrink: 0;
    }

    .why-feat b { font-size: 13px; font-weight: 600; color: var(--gray-800); display: block; margin-bottom: 2px; }
    .why-feat span { font-size: 12px; color: var(--gray-400); line-height: 1.5; }

    /* ══════════════════════════════
       CATEGORIES
    ══════════════════════════════ */
    .cat-section {
      padding: 48px 24px;
      background: var(--white);
    }

    .cat-inner { max-width: 1260px; margin: 0 auto; }

    .cat-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
    }

    .cat-card {
      position: relative;
      border-radius: 14px;
      overflow: hidden;
      min-height: 260px;
      cursor: pointer;
    }

    .cat-card img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.5s;
      position: absolute;
      inset: 0;
    }

    .cat-card:hover img { transform: scale(1.07); }

    .cat-card-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(20,5,40,0.75) 0%, rgba(20,5,40,0.15) 60%, transparent 100%);
    }

    .cat-card-label {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 24px 20px;
    }

    .cat-card-label span {
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: 2px;
      color: var(--purple-soft);
      display: block;
      margin-bottom: 4px;
    }

    .cat-card-label h3 {
      font-family: 'Playfair Display', serif;
      font-size: 22px;
      font-weight: 700;
      color: var(--white);
      margin-bottom: 12px;
    }

    .cat-link {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 12px;
      font-weight: 700;
      color: var(--gold-light);
      letter-spacing: 0.5px;
    }

    .cat-link::after {
      content: '→';
      transition: transform 0.2s;
    }

    .cat-card:hover .cat-link::after { transform: translateX(4px); }

    /* ══════════════════════════════
       ABOUT CTA
    ══════════════════════════════ */
    .about-cta {
      position: relative;
      overflow: hidden;
      min-height: 420px;
      display: flex;
      align-items: center;
    }

    .about-cta-bg {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .about-cta-overlay {
      position: absolute;
      inset: 0;
      background: rgba(20,5,40,0.7);
    }

    .about-cta-content {
      position: relative;
      z-index: 2;
      max-width: 1260px;
      margin: 0 auto;
      padding: 52px 24px;
      text-align: center;
      width: 100%;
    }

    .about-cta-content h2 {
      font-family: 'Playfair Display', serif;
      font-size: clamp(22px, 3vw, 38px);
      font-weight: 700;
      color: var(--white);
      margin-bottom: 16px;
      max-width: 640px;
      margin-left: auto;
      margin-right: auto;
    }

    .about-cta-content p {
      font-size: 16px;
      color: rgba(255,255,255,0.72);
      max-width: 480px;
      margin: 0 auto 36px;
    }

    .about-cta-btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

    /* ══════════════════════════════
       COMPARE TABLE
    ══════════════════════════════ */
    .compare-section {
      padding: 72px 24px;
      background: var(--off-white);
    }

    .compare-inner {
      max-width: 1100px;
      margin: 0 auto;
      width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }

    .compare-wrap {
      overflow-x: auto;
      overflow-y: visible;
      -webkit-overflow-scrolling: touch;
      overscroll-behavior-x: contain;
      width: 100%;
      max-width: 100%;
      margin-inline: 0;
      padding-bottom: 4px;
    }

    .compare-scroll-hint {
      display: none;
    }

    .compare-table {
      width: 100%;
      min-width: 640px;
      border-collapse: collapse;
      border-radius: 16px;
      overflow: hidden;
      box-shadow: 0 4px 24px rgba(0,0,0,0.07);
      background: #fff;
    }

    .compare-table thead tr {
      background: #1e1030;
    }

    .compare-table thead th {
      padding: 18px 20px;
      text-align: center;
      font-size: 15px;
      font-weight: 700;
      color: #fff;
    }

    .compare-table thead th:first-child {
      text-align: left;
    }

    .compare-table thead th.col-highlight {
      background: #0f0820;
      color: var(--gold);
    }

    .compare-table tbody tr {
      border-bottom: 1px solid var(--gray-100);
    }

    .compare-table tbody tr:last-child {
      border-bottom: none;
    }

    .compare-table tbody tr:nth-child(even) {
      background: #faf9ff;
    }

    .compare-table tbody td {
      padding: 14px 20px;
      text-align: center;
      font-size: 14px;
      color: var(--gray-600);
    }

    .compare-table tbody td:first-child {
      text-align: left;
      font-weight: 600;
      color: var(--gray-800);
    }

    .compare-table td.col-highlight {
      background: #f5f0ff;
    }

    .ct-yes { color: #16a34a; font-weight: 700; }
    .ct-no  { color: #d1d5db; }
    .ct-premium { color: var(--purple); font-weight: 600; font-size: 13px; }
    .ct-gold { color: #b8860b; font-weight: 700; }

    .ct-price-row td {
      padding-top: 20px;
      padding-bottom: 20px;
      font-size: 15px;
      font-weight: 700;
      color: var(--gray-800);
      border-top: 2px solid var(--gray-100);
    }

    /* ══════════════════════════════
       TESTIMONIALS
    ══════════════════════════════ */
    .testimonials-section {
      padding: 48px 24px;
      background: var(--off-white);
    }

    .testimonials-inner { max-width: 1260px; margin: 0 auto; }

    .testimonials-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }

    .testi-card {
      background: var(--white);
      border: 1px solid var(--gray-200);
      border-radius: 16px;
      padding: 28px;
      transition: box-shadow 0.25s;
    }

    .testi-card:hover { box-shadow: 0 8px 32px rgba(107,33,168,0.1); }

    .testi-stars { font-size: 14px; color: var(--gold); margin-bottom: 14px; }

    .testi-card blockquote {
      font-size: 14px;
      color: var(--gray-600);
      line-height: 1.75;
      font-style: italic;
      margin-bottom: 20px;
    }

    .testi-author {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .testi-avatar {
      width: 42px;
      height: 42px;
      border-radius: 50%;
      overflow: hidden;
      background: var(--purple-pale);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 20px;
      flex-shrink: 0;
    }

    .testi-avatar img { width: 100%; height: 100%; object-fit: cover; }

    .testi-author b { font-size: 13px; font-weight: 600; color: var(--gray-800); display: block; }
    .testi-author span { font-size: 12px; color: var(--gray-400); }

    /* ══════════════════════════════
       GUIAS E DICAS
    ══════════════════════════════ */
    .guias-section {
      padding: 72px 24px;
      background: var(--white);
    }

    .guias-inner {
      max-width: 1100px;
      margin: 0 auto;
    }

    .guias-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
      margin-top: 48px;
    }

    .guia-card {
      background: #faf9ff;
      border: 1px solid #ede9f8;
      border-radius: 16px;
      padding: 32px 28px;
      display: flex;
      flex-direction: column;
      gap: 14px;
      transition: box-shadow 0.3s, transform 0.3s;
    }

    .guia-card:hover {
      box-shadow: 0 8px 32px rgba(107,33,168,0.10);
      transform: translateY(-4px);
    }

    .guia-card-highlight {
      border-color: var(--purple);
      background: #f5f0ff;
    }

    .guia-tag {
      display: inline-block;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: 1.5px;
      text-transform: uppercase;
      padding: 4px 10px;
      border-radius: 20px;
      width: fit-content;
    }

    .guia-tag-green  { background: #dcfce7; color: #16a34a; }
    .guia-tag-blue   { background: #dbeafe; color: #1d4ed8; }
    .guia-tag-purple { background: #ede9fe; color: var(--purple); }

    .guia-card h3 {
      font-family: 'Playfair Display', serif;
      font-size: 17px;
      font-weight: 700;
      color: var(--gray-800);
      line-height: 1.35;
      margin: 0;
    }

    .guia-card p {
      font-size: 14px;
      color: var(--gray-400);
      line-height: 1.7;
      margin: 0;
      flex: 1;
    }

    .guia-link {
      font-size: 13px;
      font-weight: 600;
      color: var(--purple);
      text-decoration: none;
      margin-top: auto;
    }

    .guia-link:hover { text-decoration: underline; }

    @media (max-width: 768px) {
      .guias-grid { grid-template-columns: 1fr; }
    }

    /* ══════════════════════════════
       INSTAGRAM GRID
    ══════════════════════════════ */
    .insta-section {
      padding: 48px 24px;
      background: var(--white);
    }

    .insta-inner { max-width: 1260px; margin: 0 auto; }

    .insta-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 32px;
      flex-wrap: wrap;
      gap: 16px;
    }

    .insta-handle {
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .insta-handle .ig-icon {
      width: 38px;
      height: 38px;
      border-radius: 10px;
      background: linear-gradient(135deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 20px;
    }

    .insta-handle b { font-size: 15px; font-weight: 700; color: var(--gray-800); }
    .insta-handle span { font-size: 12px; color: var(--gray-400); display: block; }

    .btn-insta {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      border: 1.5px solid var(--gray-200);
      color: var(--gray-600);
      padding: 9px 18px;
      border-radius: 8px;
      font-size: 13px;
      font-weight: 600;
      transition: border-color 0.2s, color 0.2s;
    }

    .btn-insta:hover { border-color: var(--purple); color: var(--purple); }

    .insta-grid {
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      gap: 8px;
    }

    .insta-cell {
      aspect-ratio: 1;
      border-radius: 8px;
      overflow: hidden;
      position: relative;
      cursor: pointer;
      background: var(--gray-100);
    }

    .insta-cell img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.4s, filter 0.3s;
    }

    .insta-cell:hover img { transform: scale(1.08); filter: brightness(0.85); }

    .insta-cell-overlay {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      background: rgba(107,33,168,0.5);
      transition: opacity 0.25s;
      color: var(--white);
      font-size: 22px;
    }

    .insta-cell:hover .insta-cell-overlay { opacity: 1; }

    /* ══════════════════════════════
       CTA BANNER
    ══════════════════════════════ */
    .cta-banner {
      background: linear-gradient(135deg, #c084fc 0%, #a855f7 40%, #7c3aed 100%);
      padding: 72px 24px;
    }

    .cta-banner-inner {
      max-width: 640px;
      margin: 0 auto;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 16px;
    }

    .cta-banner h2 {
      font-family: 'Playfair Display', serif;
      font-size: clamp(26px, 3.5vw, 42px);
      font-weight: 700;
      color: #fff;
      line-height: 1.15;
      margin: 0;
    }

    .cta-banner > .cta-banner-inner > p {
      font-size: 15px;
      color: rgba(255,255,255,0.85);
      margin: 0;
    }

    .cta-banner-btn {
      display: inline-block;
      background: #fff;
      color: var(--purple);
      font-size: 16px;
      font-weight: 700;
      padding: 18px 36px;
      border-radius: 50px;
      text-decoration: none;
      margin-top: 8px;
      box-shadow: 0 8px 32px rgba(0,0,0,0.15);
      transition: transform 0.2s, box-shadow 0.2s;
    }

    .cta-banner-btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 12px 40px rgba(0,0,0,0.2);
    }

    .cta-banner-sub {
      font-size: 12px;
      color: rgba(255,255,255,0.65);
    }

    .cta-banner-links {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      margin-top: 8px;
    }

    .cta-banner-social {
      font-size: 13px;
      color: rgba(255,255,255,0.75);
    }

    .cta-banner-showroom {
      font-size: 13px;
      font-weight: 600;
      color: #fff;
      text-decoration: underline;
    }

    /* ══════════════════════════════
       NEWSLETTER (kept for ref)
    ══════════════════════════════ */
    .newsletter {
      background: linear-gradient(135deg, var(--purple), var(--purple-light));
      padding: 40px 24px;
    }

    .newsletter-inner {
      max-width: 640px;
      margin: 0 auto;
      text-align: center;
    }

    .newsletter h2 {
      font-family: 'Playfair Display', serif;
      font-size: clamp(20px, 2.5vw, 28px);
      font-weight: 700;
      color: var(--white);
      margin-bottom: 10px;
    }

    .newsletter p {
      font-size: 15px;
      color: rgba(255,255,255,0.78);
      margin-bottom: 28px;
    }

    .newsletter-form {
      display: flex;
      gap: 10px;
      max-width: 460px;
      margin: 0 auto;
    }

    .newsletter-form input {
      flex: 1;
      padding: 13px 18px;
      border-radius: 8px;
      border: 1.5px solid rgba(255,255,255,0.3);
      background: rgba(255,255,255,0.12);
      color: var(--white);
      font-size: 14px;
      font-family: 'Inter', sans-serif;
      outline: none;
      transition: border-color 0.2s;
    }

    .newsletter-form input::placeholder { color: rgba(255,255,255,0.55); }
    .newsletter-form input:focus { border-color: var(--white); }

    .btn-nl {
      background: var(--white);
      color: var(--purple);
      padding: 13px 22px;
      border-radius: 8px;
      font-size: 14px;
      font-weight: 700;
      border: none;
      cursor: pointer;
      font-family: 'Inter', sans-serif;
      transition: transform 0.15s;
      white-space: nowrap;
    }

    .btn-nl:hover { transform: scale(1.03); }

    /* ══════════════════════════════
       FOOTER
    ══════════════════════════════ */
    footer {
      background: var(--black);
      padding: 44px 24px 0;
    }

    .footer-inner {
      max-width: 1260px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 2.2fr 1fr 1fr 1.3fr;
      gap: 48px;
      padding-bottom: 48px;
      border-bottom: 1px solid rgba(255,255,255,0.07);
    }

    .footer-brand {}

    .footer-brand .logo { margin-bottom: 16px; }
    .footer-brand .logo .logo-texts b { color: var(--white); }
    .footer-brand .logo .logo-texts small { color: var(--purple-soft); }

    .footer-brand p {
      font-size: 14px;
      color: rgba(255,255,255,0.45);
      line-height: 1.75;
      margin-bottom: 24px;
    }

    .footer-socials { display: flex; gap: 10px; }

    .f-social {
      width: 36px;
      height: 36px;
      border-radius: 8px;
      background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.1);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
      color: rgba(255,255,255,0.55);
      transition: background 0.2s, color 0.2s;
    }

    .f-social:hover { background: var(--purple); color: var(--white); }

    .footer-col h4 {
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: var(--white);
      margin-bottom: 20px;
    }

    .footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }

    .footer-col ul li a {
      font-size: 14px;
      color: rgba(255,255,255,0.45);
      transition: color 0.2s;
    }

    .footer-col ul li a:hover { color: var(--white); }

    .footer-contact-list { display: flex; flex-direction: column; gap: 14px; }

    .f-contact-row {
      display: flex;
      align-items: flex-start;
      gap: 10px;
    }

    .f-contact-icon {
      width: 32px;
      height: 32px;
      border-radius: 7px;
      background: rgba(107,33,168,0.25);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 14px;
      flex-shrink: 0;
    }

    .f-contact-row b { font-size: 13px; color: var(--white); display: block; line-height: 1.2; }
    .f-contact-row span { font-size: 12px; color: rgba(255,255,255,0.4); }

    .footer-bottom {
      max-width: 1260px;
      margin: 0 auto;
      padding: 22px 0;
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: 12px;
    }

    .footer-bottom p { font-size: 12px; color: rgba(255,255,255,0.25); }
    .footer-bottom .verse { font-style: italic; color: rgba(255,255,255,0.2); }

    /* ══════════════════════════════
       WHATSAPP FLOAT
    ══════════════════════════════ */
    .wa-float {
      position: fixed;
      bottom: 28px;
      right: 28px;
      z-index: 999;
      width: 56px;
      height: 56px;
      border-radius: 50%;
      background: #25D366;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 6px 24px rgba(37,211,102,0.45);
      transition: transform 0.2s, box-shadow 0.2s;
    }

    .wa-float:hover { transform: scale(1.1); box-shadow: 0 10px 36px rgba(37,211,102,0.6); }

    /* ══════════════════════════════
       RESPONSIVE
    ══════════════════════════════ */
    @media (max-width: 1024px) {
      .products-grid { grid-template-columns: repeat(2, 1fr); }
      .footer-inner { grid-template-columns: 1fr 1fr; }
      .trust-inner { grid-template-columns: repeat(3, 1fr); }
      .trust-item:nth-child(3) { border-right: none; }
      .trust-item:nth-child(4),
      .trust-item:nth-child(5) { border-top: 1px solid var(--gray-200); }
      .trust-item:nth-child(5) { border-right: none; }
    }

    @media (max-width: 900px) {
      .feature-split,
      .why-layout,
      .promo-inner { grid-template-columns: 1fr; }
      .cat-grid { grid-template-columns: 1fr 1fr; }
      .testimonials-grid { grid-template-columns: 1fr; }
      .insta-grid { grid-template-columns: repeat(3, 1fr); }
    }

    @media (max-width: 600px) {
      .products-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
      .cat-grid { grid-template-columns: 1fr; }
      .insta-grid { grid-template-columns: repeat(3, 1fr); }
      .footer-inner { grid-template-columns: 1fr; }
      .newsletter-form { flex-direction: column; }
      .hero-content h1 { font-size: 34px; }
      section, .products-section, .why-section, .cat-section,
      .testimonials-section, .insta-section { padding: 48px 16px; }
    }

    /* ══════════════════════════════
       SCROLL ANIMATION
    ══════════════════════════════ */
    .fade-in {
      opacity: 0;
      transform: translateY(24px);
      transition: opacity 0.55s ease, transform 0.55s ease;
    }
    .fade-in.visible { opacity: 1; transform: translateY(0); }

    /* SPA / catálogo / detalhe produto */
    .spa-page[hidden] { display: none !important; }

    .spa-page:not([hidden]) {
      width: 100%;
      max-width: 100%;
      box-sizing: border-box;
      overflow-x: clip;
    }

    .f-social.f-social-wa {
      background: #25D366;
      border-color: rgba(255, 255, 255, 0.15);
      color: #fff;
    }
    .f-social.f-social-wa:hover {
      background: #20bd5a;
      color: #fff;
    }

    .spa-back-link {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: 14px;
      font-weight: 600;
      color: var(--purple);
      margin-bottom: 24px;
    }
    .spa-back-link:hover { color: var(--purple-light); }

    .p-detail-link {
      display: inline-block;
      margin-top: 12px;
      font-size: 13px;
      font-weight: 600;
      color: var(--purple);
    }
    .p-detail-link:hover { color: var(--purple-light); }

    .product-detail-wrap {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 40px;
      align-items: start;
    }
    @media (max-width: 900px) {
      .product-detail-wrap { grid-template-columns: 1fr; }
    }
    .product-detail-img {
      border-radius: var(--radius);
      overflow: hidden;
      background: var(--gray-50);
      border: 1px solid var(--gray-200);
    }
    .product-detail-img img { width: 100%; display: block; }
    .product-gallery {
      display: grid;
      gap: 14px;
    }
    .product-gallery-main {
      border-radius: 16px;
      box-shadow: 0 14px 30px rgba(20, 20, 30, 0.08);
    }
    .product-gallery-main img {
      aspect-ratio: 1 / 1;
      object-fit: cover;
      cursor: zoom-in;
    }
    .product-main-zoomable {
      cursor: zoom-in;
    }
    .product-gallery-thumbs {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(82px, 1fr));
      gap: 10px;
    }
    .product-gallery-thumb {
      border: 1.5px solid var(--gray-200);
      border-radius: 12px;
      background: var(--white);
      padding: 0;
      overflow: hidden;
      cursor: pointer;
      transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
    }
    .product-gallery-thumb:hover {
      transform: translateY(-2px);
      border-color: rgba(147, 51, 234, 0.46);
      box-shadow: 0 6px 18px rgba(107, 33, 168, 0.14);
    }
    .product-gallery-thumb.is-active {
      border-color: var(--purple);
      box-shadow: 0 0 0 2px rgba(147, 51, 234, 0.16);
    }
    .product-gallery-thumb img {
      width: 100%;
      height: 100%;
      aspect-ratio: 1 / 1;
      object-fit: cover;
      display: block;
    }
    .product-gallery-thumb--video {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 4px;
      min-height: 82px;
      aspect-ratio: 1 / 1;
      background: linear-gradient(150deg, #1a1228 0%, #352060 100%);
      color: #fff;
      border-color: rgba(147, 51, 234, 0.55);
    }
    .product-gallery-thumb--video .thumb-video-icon {
      font-size: 22px;
      line-height: 1;
      opacity: 0.95;
    }
    .product-gallery-thumb--video .thumb-video-text {
      font-size: 10px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.08em;
    }
    .product-main-video {
      width: 100%;
      aspect-ratio: 1 / 1;
      object-fit: contain;
      display: block;
      background: #0f0b1a;
      cursor: zoom-in;
      border-radius: inherit;
    }
    .product-detail-body .eyebrow { margin-bottom: 10px; }
    .product-detail-body h1 {
      font-family: 'Playfair Display', serif;
      font-size: clamp(26px, 4vw, 36px);
      color: var(--black);
      margin-bottom: 8px;
      line-height: 1.15;
    }
    .product-detail-variant {
      font-size: 15px;
      color: var(--gray-600);
      margin-bottom: 16px;
    }
    .product-detail-desc {
      font-size: 15px;
      color: var(--gray-600);
      margin: 20px 0;
      line-height: 1.75;
    }
    .product-gallery-thumb:focus-visible {
      outline: 2px solid var(--purple);
      outline-offset: 2px;
    }

    /* Lightbox galeria PDP — imagem grande centralizada (estilo vitrine) */
    .pdp-lightbox {
      position: fixed;
      inset: 0;
      z-index: 10050;
      box-sizing: border-box;
      /* Cobre a viewport real (útil quando o ancestral não é o viewport). */
      width: 100%;
      min-height: 100vh;
      min-height: 100dvh;
    }
    .pdp-lightbox[hidden] {
      display: none !important;
    }
    .pdp-lightbox-backdrop {
      position: absolute;
      inset: 0;
      z-index: 0;
      background: rgba(0, 0, 0, 0.82);
      cursor: zoom-out;
    }
    .pdp-lightbox-stage {
      position: absolute;
      inset: 0;
      z-index: 1;
      display: flex;
      align-items: center;
      justify-content: center;
      /* Um pouco mais de espaço em baixo do que em cima: a foto fica opticamente mais centrada “para cima”, sem parecer que desce. */
      padding-top: max(clamp(48px, 8vh, 76px), env(safe-area-inset-top, 0px));
      padding-bottom: max(clamp(72px, 14vh, 112px), env(safe-area-inset-bottom, 0px));
      padding-left: max(clamp(56px, 7vw, 96px), env(safe-area-inset-left, 0px));
      padding-right: max(clamp(56px, 7vw, 96px), env(safe-area-inset-right, 0px));
      box-sizing: border-box;
      pointer-events: none;
      min-height: 0;
    }
    .pdp-lightbox-img,
    .pdp-lightbox-video {
      pointer-events: auto;
      max-width: min(94vw, 1500px);
      max-height: min(88vh, 980px);
      max-height: min(88dvh, 980px);
      width: auto;
      height: auto;
      flex: 0 1 auto;
      min-height: 0;
      object-fit: contain;
      border-radius: 12px;
      box-shadow:
        0 8px 40px rgba(0, 0, 0, 0.45),
        0 0 0 1px rgba(255, 255, 255, 0.06);
      background: #0a0812;
    }
    .pdp-lightbox-video {
      background: #000;
    }
    .pdp-lightbox-counter {
      position: absolute;
      top: max(clamp(14px, 2.5vh, 22px), env(safe-area-inset-top, 0px));
      left: max(clamp(16px, 3vw, 28px), env(safe-area-inset-left, 0px));
      z-index: 2;
      margin: 0;
      font-size: clamp(15px, 1.8vw, 18px);
      font-weight: 600;
      color: #fff;
      letter-spacing: 0.06em;
      text-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
      pointer-events: none;
    }
    .pdp-lightbox-prev,
    .pdp-lightbox-next {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      z-index: 2;
      width: clamp(48px, 8vw, 56px);
      height: clamp(48px, 8vw, 56px);
      border: none;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.14);
      color: #fff;
      font-size: clamp(32px, 5vw, 42px);
      line-height: 1;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0 0 2px 0;
      transition:
        background 0.2s,
        transform 0.2s;
      box-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
    }
    .pdp-lightbox-prev {
      left: max(clamp(8px, 2vw, 20px), env(safe-area-inset-left, 0px));
    }
    .pdp-lightbox-next {
      right: max(clamp(8px, 2vw, 20px), env(safe-area-inset-right, 0px));
    }
    .pdp-lightbox-prev[hidden],
    .pdp-lightbox-next[hidden] {
      display: none !important;
    }
    .pdp-lightbox-prev:hover,
    .pdp-lightbox-next:hover {
      background: rgba(255, 255, 255, 0.28);
      transform: translateY(-50%) scale(1.06);
    }
    .pdp-lightbox-close {
      position: absolute;
      top: max(clamp(12px, 2vh, 20px), env(safe-area-inset-top, 0px));
      right: max(clamp(14px, 2.5vw, 24px), env(safe-area-inset-right, 0px));
      z-index: 2;
      width: 48px;
      height: 48px;
      border: none;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.12);
      color: #fff;
      font-size: 32px;
      line-height: 1;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0;
      transition: background 0.2s;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    }
    .pdp-lightbox-close:hover {
      background: rgba(255, 255, 255, 0.24);
    }
    body.pdp-lightbox-open {
      overflow: hidden;
    }
    /* A secção PDP usa .fade-in com `transform`, o que cria containing block e ancora
       `position:fixed` do lightbox à secção em vez da viewport (overlay “abre para baixo”). */
    body.pdp-lightbox-open #page-produto .product-detail-section.fade-in {
      transform: none !important;
      /* Evita animar transform/opacity da secção no instante em que o fixed passa a usar a viewport — isso causava o “puxão” visível. */
      transition: none !important;
    }

    .product-detail-desc ul { margin-top: 12px; padding-left: 20px; }
    .product-detail-desc li { margin-bottom: 8px; }
    .product-detail-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }

    /* ══════════════════════════════
       CATÁLOGO · HERO CARROSSEL · FILTROS
    ══════════════════════════════ */
    .catalog-hero-wrap {
      max-width: 100%;
      width: 100%;
      margin: 0;
      padding: 16px clamp(10px, 2.2vw, 16px) 8px;
      padding-inline: var(--section-pad-x);
      box-sizing: border-box;
    }

    #page-catalogo .catalog-page-section {
      padding-top: 22px;
    }

    .catalog-carousel {
      position: relative;
      width: 100%;
      border-radius: 22px;
      overflow: hidden;
      border: 1px solid var(--gray-200);
      background: #0f0b1a;
      box-shadow: 0 22px 56px rgba(18, 10, 35, 0.22);
      animation: catalog-hero-in 0.75s ease both;
    }

    @keyframes catalog-hero-in {
      from {
        opacity: 0;
        transform: translateY(10px);
      }
      to {
        opacity: 1;
        transform: none;
      }
    }

    .catalog-carousel-slides {
      position: relative;
      width: 100%;
      min-width: 100%;
      box-sizing: border-box;
      /* Banners reais: 5760×1620 → 32:9 (panorâmico); 5:2 gerava faixas pretas com object-fit */
      aspect-ratio: 32 / 9;
      min-height: 120px;
      overflow: hidden;
    }

    .catalog-carousel-slide {
      margin: 0;
      position: absolute;
      inset: 0;
      display: flex;
      width: 100%;
      height: 100%;
      overflow: hidden;
      opacity: 0;
      visibility: hidden;
      transition:
        opacity 0.75s ease,
        visibility 0.75s linear;
      z-index: 0;
    }

    .catalog-carousel-slide picture {
      display: block;
      width: 100%;
      height: 100%;
      margin: 0;
    }

    .catalog-carousel-slide.is-active {
      opacity: 1;
      visibility: visible;
      z-index: 2;
    }

    .catalog-carousel-slide img,
    .catalog-carousel-slide picture,
    .catalog-carousel-slide picture img {
      flex: 1 0 auto;
      width: 100%;
      min-width: 100%;
      height: 100%;
      min-height: 100%;
      max-width: none;
      object-fit: cover;
      object-position: center;
      transform: scale(1.02);
      transition: transform 5s ease;
    }

    .catalog-carousel-slide.is-active img,
    .catalog-carousel-slide.is-active picture img {
      transform: scale(1);
    }

    .catalog-carousel-slide figcaption {
      position: absolute;
      left: 18px;
      right: auto;
      bottom: 18px;
      max-width: min(86%, 520px);
      padding: 10px 14px;
      border-radius: 12px;
      font-size: clamp(12px, 1.6vw, 14px);
      font-weight: 600;
      color: var(--white);
      letter-spacing: 0.02em;
      background: rgba(16, 11, 31, 0.64);
      border: 1px solid rgba(255, 255, 255, 0.22);
      backdrop-filter: blur(4px);
      text-shadow: 0 2px 10px rgba(0,0,0,0.25);
      line-height: 1.35;
    }

    .catalog-carousel-dots {
      position: absolute;
      z-index: 4;
      right: 16px;
      bottom: 14px;
      display: flex;
      gap: 8px;
      padding: 6px 8px;
      border-radius: 999px;
      background: rgba(20, 16, 38, 0.34);
      border: 1px solid rgba(255, 255, 255, 0.22);
    }

    .catalog-carousel-dot {
      width: 9px;
      height: 9px;
      border-radius: 50%;
      padding: 0;
      border: 1.5px solid rgba(255,255,255,0.92);
      background: transparent;
      cursor: pointer;
      transition:
        transform 0.2s,
        background 0.25s,
        box-shadow 0.2s;
      box-shadow: 0 1px 4px rgba(0,0,0,0.2);
    }

    .catalog-carousel-dot:hover {
      transform: scale(1.15);
      background: rgba(255,255,255,0.35);
    }

    .catalog-carousel-dot.is-active {
      background: var(--white);
      border-color: var(--white);
      box-shadow:
        0 0 0 1.5px rgba(147,51,234,0.85),
        0 4px 12px rgba(107,33,168,0.35);
      transform: scale(1.1);
    }

    .catalog-sec-head .eyebrow {
      letter-spacing: 0.06em;
    }

    /* Filtros */
    .filter-bar {
      margin: 0 auto 28px;
      max-width: 960px;
    }

    .filter-bar-row {
      display: flex;
      flex-wrap: wrap;
      align-items: flex-end;
      gap: 20px;
    }

    .filter-bar-label-inline {
      display: block;
      font-size: 11px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: var(--purple);
      margin-bottom: 8px;
    }

    .filter-bar-select {
      min-width: 200px;
      padding: 10px 14px;
      font-size: 14px;
      font-weight: 500;
      color: var(--gray-800);
      border-radius: var(--radius);
      border: 1.5px solid var(--gray-200);
      background: var(--white);
      cursor: pointer;
      transition: border-color 0.2s, box-shadow 0.2s;
      box-shadow: 0 1px 4px rgba(0,0,0,0.04);
    }

    .filter-bar-select:focus-visible {
      outline: none;
      border-color: var(--purple-soft);
      box-shadow: 0 0 0 4px rgba(147,51,234,0.15);
    }

    .price-pills-wrap {
      flex: 1;
      min-width: 260px;
    }

    .filter-bar-caption {
      display: block;
      font-size: 11px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: var(--gray-600);
      margin-bottom: 8px;
    }

    .price-pills {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .price-pill {
      padding: 7px 12px;
      border-radius: 100px;
      font-size: 12px;
      font-weight: 600;
      border: 1.5px solid var(--gray-200);
      background: var(--gray-50);
      color: var(--gray-600);
      cursor: pointer;
      transition: background 0.2s, border-color 0.2s, transform 0.15s ease;
      white-space: nowrap;
    }

    .price-pill:hover {
      border-color: var(--purple-soft);
      color: var(--purple);
    }

    .price-pill:active {
      transform: scale(0.98);
    }

    .price-pill.active {
      background: linear-gradient(135deg, var(--purple), var(--purple-light));
      border-color: transparent;
      color: var(--white);
      box-shadow: 0 4px 14px rgba(107,33,168,0.26);
    }

    .product-tabs-catalog {
      margin-bottom: 32px;
    }

    a.product-card.catalog-grid-card,
    #catalog-grid a.product-card,
    #home-featured-grid a.product-card {
      display: flex;
      flex-direction: column;
      text-decoration: none;
      color: inherit;
      height: 100%;
    }

    #catalog-grid a.product-card:focus-visible,
    #home-featured-grid a.product-card:focus-visible {
      outline: 2px solid var(--purple-light);
      outline-offset: 3px;
    }

    #catalog-grid a.product-card .p-variant-inline,
    #home-featured-grid a.product-card .p-variant-inline {
      font-size: 12px;
      color: var(--gray-400);
      font-weight: 500;
      margin: 2px 0 4px;
    }

    .stars.stars-under-price {
      margin: 8px 0 2px;
      font-size: 11px;
      line-height: 1;
      letter-spacing: 0.04em;
    }

    .stars.stars-under-price .star.half::before {
      font-size: inherit;
      line-height: inherit;
    }

    #catalog-grid a.product-card:hover .p-detail-link,
    #home-featured-grid a.product-card:hover .p-detail-link {
      text-decoration: underline;
    }

    .catalog-products-grid,
    #home-featured-grid {
      gap: clamp(18px, 2vw, 28px);
    }

    #home-featured-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      max-width: 1100px;
      margin-left: auto;
      margin-right: auto;
    }

    #produtos .product-tabs-home {
      margin-bottom: 28px;
    }

    #produtos.products-section {
      padding-top: 40px;
      padding-bottom: 40px;
    }

    /* ══════════════════════════════
       PDP · ABAS
    ══════════════════════════════ */
    .pdp-buy-row {
      margin-top: 6px;
      margin-bottom: 8px;
    }

    .pdp-tabs {
      display: flex;
      gap: 4px;
      flex-wrap: wrap;
      padding: 6px;
      margin: 20px 0 0;
      position: sticky;
      top: 72px;
      z-index: 30;
      background: rgba(255,255,255,0.9);
      backdrop-filter: blur(10px);
      border-radius: 12px;
      border: 1px solid var(--gray-100);
      box-shadow: 0 6px 24px rgba(0,0,0,0.04);
    }

    .pdp-tab {
      flex: 1 1 auto;
      min-width: fit-content;
      padding: 10px 16px;
      border: none;
      border-radius: 8px;
      font-size: 13px;
      font-weight: 600;
      color: var(--gray-600);
      background: transparent;
      cursor: pointer;
      transition: background 0.2s ease, color 0.2s ease, transform 0.15s ease;
      font-family: inherit;
    }

    .pdp-tab:hover {
      color: var(--purple);
      background: var(--purple-pale);
    }

    .pdp-tab:focus-visible {
      outline: none;
      box-shadow: 0 0 0 3px rgba(147,51,234,0.28);
      color: var(--purple);
    }

    .pdp-tab.is-active {
      background: linear-gradient(
        135deg,
        rgba(107,33,168,0.12),
        rgba(147,51,234,0.08)
      );
      color: var(--purple);
      transform: translateY(-1px);
    }

    .pdp-panel {
      margin-top: 20px;
      padding-bottom: 8px;
      animation: pdp-fade-panel 0.45s ease;
    }

    @keyframes pdp-fade-panel {
      from {
        opacity: 0;
        transform: translateY(5px);
      }
      to {
        opacity: 1;
        transform: none;
      }
    }

    .pdp-prose p + p {
      margin-top: 12px;
    }

    .pdp-highlight-title {
      margin-top: 20px;
      font-size: 14px;
    }

    .pdp-specs {
      display: grid;
      gap: 0;
      grid-template-columns: auto 1fr;
      align-items: baseline;
      font-size: 14px;
      border: 1px solid var(--gray-100);
      border-radius: var(--radius);
      overflow: hidden;
    }

    .pdp-specs dt {
      padding: 12px 16px;
      font-weight: 600;
      color: var(--gray-600);
      background: var(--gray-50);
      border-bottom: 1px solid var(--gray-100);
    }

    .pdp-specs dd {
      padding: 12px 16px;
      margin: 0;
      color: var(--gray-800);
      border-bottom: 1px solid var(--gray-100);
    }

    .pdp-specs dd:last-child,
    .pdp-specs dt:last-of-type {
      border-bottom: none;
    }

    .pdp-specs-image-wrap {
      margin: 0;
      border-radius: var(--radius);
      overflow: hidden;
      border: 1px solid var(--gray-100);
      background: var(--white);
      line-height: 0;
    }

    .pdp-specs-img {
      display: block;
      width: 100%;
      height: auto;
    }

    @media (max-width: 768px) {
      .catalog-carousel-slides {
        aspect-ratio: 4 / 5;
        min-height: 220px;
        max-height: min(78vh, 520px);
      }

      .catalog-carousel-slide img,
      .catalog-carousel-slide picture img {
        object-fit: contain;
        object-position: center center;
        background: #0f0b1a;
      }
    }

    @media (max-width: 700px) {
      .catalog-carousel-slides {
        min-height: 200px;
      }

      .catalog-carousel-slide figcaption {
        left: 12px;
        right: 12px;
        bottom: 12px;
        max-width: none;
        padding: 9px 11px;
        font-size: 12px;
      }

      .pdp-tabs {
        top: 66px;
      }
    }

    /* ══════════════════════════════
       ALUGUEL B2B / EVENTOS
    ══════════════════════════════ */
    .rental-page .rental-hero {
      background: linear-gradient(165deg, var(--purple-pale) 0%, var(--white) 52%, var(--gray-50) 100%);
      padding: clamp(28px, 5vw, 48px) var(--section-pad-x) clamp(24px, 4vw, 40px);
      border-bottom: 1px solid var(--gray-200);
    }

    .rental-hero-inner {
      display: grid;
      grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
      grid-template-rows: auto auto;
      gap: clamp(24px, 3.5vw, 36px) clamp(28px, 4vw, 44px);
      align-items: center;
      max-width: min(1180px, 100%);
      margin-inline: auto;
      width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }

    .rental-hero-copy {
      grid-column: 1;
      grid-row: 1;
      min-width: 0;
    }

    .rental-hero-figure {
      grid-column: 2;
      grid-row: 1;
      min-width: 0;
      align-self: center;
    }

    .rental-hero-trust {
      grid-column: 1 / -1;
      grid-row: 2;
      min-width: 0;
    }

    .rental-hero-copy .eyebrow {
      font-size: 12px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.12em;
      color: var(--purple);
      display: inline-block;
      margin-bottom: 12px;
    }

    .rental-page-title {
      font-size: clamp(26px, 4vw, 38px);
      font-weight: 800;
      line-height: 1.15;
      color: var(--black);
      margin-bottom: 16px;
      overflow-wrap: anywhere;
    }

    .rental-lead {
      font-size: 16px;
      line-height: 1.72;
      color: var(--gray-600);
      max-width: 36rem;
      overflow-wrap: anywhere;
    }

    .rental-hero-cta-row {
      display: flex;
      flex-wrap: wrap;
      gap: 14px;
      margin-top: 24px;
    }

    .btn-rental-wa {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 14px 28px;
      border-radius: 50px;
      font-size: 15px;
      font-weight: 700;
      background: linear-gradient(135deg, #25d366, #128c43);
      color: var(--white);
      border: none;
      box-shadow: 0 8px 24px rgba(18, 140, 67, 0.35);
      transition: opacity 0.15s ease, transform 0.15s ease;
      white-space: nowrap;
      box-sizing: border-box;
      text-align: center;
      max-width: 100%;
    }

    .btn-rental-wa:hover {
      opacity: 0.93;
      transform: translateY(-2px);
    }

    .rental-catalog-link {
      align-self: center;
      padding: 12px 22px !important;
    }

    .rental-sponsors-marquee {
      margin-top: 0;
      max-width: 100%;
      border-radius: var(--radius);
      background: var(--white);
      border: 1px solid var(--gray-200);
      box-shadow: 0 8px 26px rgba(20, 20, 34, 0.06);
    }

    .rental-sponsors-marquee-viewport {
      overflow: hidden;
      mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
      -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
    }

    .rental-sponsors-marquee-track {
      display: flex;
      width: max-content;
      animation: rental-sponsors-marquee-scroll 42s linear infinite;
    }

    .rental-sponsors-row {
      display: flex;
      flex-shrink: 0;
      align-items: center;
      gap: clamp(20px, 4vw, 40px);
      padding: 14px clamp(16px, 3vw, 28px);
      margin: 0;
      list-style: none;
    }

    .rental-sponsors-row li {
      flex: 0 0 auto;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .rental-sponsors-row img {
      display: block;
      height: clamp(40px, 5vw, 52px);
      width: auto;
      max-width: min(140px, 28vw);
      object-fit: contain;
      filter: grayscale(1);
      opacity: 0.68;
      transition: opacity 0.2s ease, filter 0.2s ease;
    }

    .rental-sponsors-row img:hover {
      opacity: 0.95;
      filter: grayscale(0.35);
    }

    @keyframes rental-sponsors-marquee-scroll {
      from {
        transform: translateX(0);
      }

      to {
        transform: translateX(-50%);
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .rental-sponsors-marquee-track {
        animation: none;
        justify-content: center;
        flex-wrap: wrap;
        width: auto;
        max-width: 100%;
      }

      .rental-sponsors-row[aria-hidden='true'] {
        display: none;
      }

      .rental-sponsors-row {
        flex-wrap: wrap;
        justify-content: center;
        padding: 14px 16px;
      }
    }

    .rental-aura-block {
      max-width: min(920px, 100%);
      margin-inline: auto;
      margin-bottom: 28px;
      padding: 0;
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(260px, 48%);
      gap: 0;
      align-items: stretch;
      border-radius: 16px;
      overflow: hidden;
      border: 1px solid rgba(107, 33, 168, 0.14);
      background: var(--white);
      box-shadow:
        0 1px 1px rgba(26, 16, 40, 0.04),
        0 8px 28px rgba(26, 16, 40, 0.055),
        0 26px 56px rgba(26, 16, 40, 0.045);
    }

    .rental-aura-block .rental-aura-copy {
      display: flex;
      flex-direction: column;
      gap: clamp(10px, 1.5vw, 16px);
      padding: clamp(16px, 2.2vw, 26px) clamp(16px, 2.4vw, 28px) clamp(16px, 2.2vw, 26px)
        clamp(18px, 2.5vw, 30px);
      min-width: 0;
      max-width: none;
      background: linear-gradient(
        118deg,
        rgba(245, 240, 255, 0.97) 0%,
        rgba(255, 255, 255, 0.82) 46%,
        var(--gray-50) 100%
      );
    }

    .rental-aura-block .rental-aura-eyebrow {
      margin: 0;
      font-size: clamp(11px, 0.45vw + 10px, 12px);
      font-weight: 600;
      letter-spacing: 0.09em;
      text-transform: uppercase;
      color: rgba(107, 33, 168, 0.72);
      line-height: 1.35;
    }

    .rental-aura-block .rental-aura-heading-row h2 {
      font-size: clamp(1.02rem, 1.9vw + 0.78rem, 1.22rem);
      font-weight: 800;
      color: var(--black);
      margin: 0;
      line-height: 1.25;
      letter-spacing: -0.025em;
    }

    .rental-aura-block .rental-aura-heading-row h2::after {
      content: '';
      display: block;
      width: 40px;
      height: 3px;
      margin-top: 8px;
      border-radius: 2px;
      background: linear-gradient(90deg, var(--purple), var(--gold));
      opacity: 0.92;
    }

    .rental-aura-block .rental-aura-lead {
      font-size: clamp(0.88rem, 0.85vw + 0.78rem, 0.96rem);
      color: var(--gray-600);
      line-height: 1.5;
      max-width: min(50ch, 100%);
      margin: 0;
    }

    .rental-aura-block .rental-aura-lead strong {
      color: var(--gray-800);
      font-weight: 700;
    }

    .rental-aura-block .rental-aura-whys {
      margin: 0;
      padding: clamp(12px, 2vw, 18px) clamp(12px, 2vw, 18px) clamp(12px, 2vw, 18px)
        clamp(16px, 2.4vw, 22px);
      list-style: none;
      font-size: clamp(12px, 0.3vw + 11px, 13px);
      color: var(--gray-600);
      line-height: 1.48;
      background: rgba(107, 33, 168, 0.04);
      border: 1px solid rgba(107, 33, 168, 0.11);
      border-radius: 12px;
      border-left: 3px solid var(--purple);
      display: flex;
      flex-direction: column;
      gap: clamp(6px, 1.2vw, 10px);
    }

    .rental-aura-block .rental-aura-whys li {
      position: relative;
      padding-left: 1.35em;
    }

    .rental-aura-block .rental-aura-whys li::before {
      content: '';
      position: absolute;
      left: 0;
      top: 0.48em;
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: linear-gradient(145deg, var(--purple-soft), var(--purple));
      opacity: 0.88;
    }

    .rental-aura-block .rental-aura-whys strong {
      color: var(--gray-800);
      font-weight: 700;
    }

    .rental-aura-block .rental-aura-note {
      font-size: clamp(11px, 0.3vw + 10px, 12px);
      color: var(--gray-600);
      line-height: 1.5;
      max-width: min(50ch, 100%);
      margin: 0;
      opacity: 0.94;
    }

    .rental-aura-block .rental-aura-gallery {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      align-self: stretch;
      min-height: 0;
      height: 100%;
      max-height: none;
      min-width: 0;
      max-width: 100%;
      overflow: hidden;
      background: #f5f5f7;
      border-left: 1px solid rgba(26, 16, 40, 0.07);
      box-shadow: inset 10px 0 28px rgba(26, 16, 40, 0.045);
      border-top-right-radius: 16px;
      border-bottom-right-radius: 16px;
    }

    .rental-aura-block .rental-aura-figure {
      margin: 0;
      flex: 1;
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 0;
      height: 100%;
      width: 100%;
      max-width: 100%;
      overflow: hidden;
      background: #f5f5f7;
      line-height: 0;
      box-sizing: border-box;
      padding: clamp(8px, 1.4vw, 14px);
    }

    .rental-aura-block .rental-aura-figure img {
      display: block;
      max-width: 100%;
      max-height: 100%;
      width: auto;
      height: auto;
      object-fit: contain;
      object-position: center;
    }

    .rental-pricing-note {
      margin-top: 14px;
      font-size: 13px;
      color: var(--gray-400);
      max-width: 52rem;
      margin-bottom: 0;
    }

    .rental-hero-figure {
      margin: 0;
      border-radius: 20px;
      overflow: hidden;
      border: 1px solid var(--gray-200);
      box-shadow: 0 24px 48px rgba(26, 16, 40, 0.18);
      background: var(--purple-bg);
      line-height: 0;
    }

    .rental-hero-figure img {
      display: block;
      width: 100%;
      height: auto;
      aspect-ratio: 4 / 3;
      object-fit: cover;
    }

    .rental-body {
      padding: 48px 0 72px;
      background: var(--white);
    }

    .rental-cards {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 24px;
      margin-bottom: 40px;
    }

    .rental-card {
      background: var(--gray-50);
      border: 1px solid var(--gray-200);
      border-radius: 18px;
      padding: 28px;
    }

    .rental-card h2 {
      font-size: 20px;
      font-weight: 800;
      color: var(--black);
      margin-bottom: 16px;
    }

    .rental-card h2::after {
      content: '';
      display: block;
      width: 52px;
      height: 3px;
      margin-top: 10px;
      border-radius: 2px;
      background: linear-gradient(90deg, var(--purple), var(--gold));
      opacity: 0.92;
    }

    .rental-prose-list,
    .rental-steps {
      font-size: 15px;
      color: var(--gray-600);
      line-height: 1.7;
      padding-left: 1.2em;
    }

    .rental-prose-list li + li,
    .rental-steps li + li {
      margin-top: 10px;
    }

    .rental-steps {
      list-style: decimal;
    }

    .rental-audience {
      margin-bottom: 44px;
    }

    .rental-audience h2 {
      font-size: 22px;
      font-weight: 800;
      color: var(--black);
      margin-bottom: 12px;
    }

    .rental-audience p {
      font-size: 15px;
      color: var(--gray-600);
      max-width: 56em;
      line-height: 1.74;
    }

    .rental-zone-note {
      margin-top: 14px;
      font-size: 14px;
      color: var(--gray-800);
      padding: 10px 14px;
      padding-left: 17px;
      border-left: 3px solid var(--purple-soft);
      background: var(--purple-pale);
      border-radius: 0 var(--radius) var(--radius) 0;
    }

    .rental-gallery-title {
      font-size: 22px;
      font-weight: 800;
      margin-bottom: 18px;
      color: var(--black);
    }

    .rental-gallery {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr));
      gap: 14px;
    }

    .rental-thumb {
      margin: 0;
      border-radius: 14px;
      overflow: hidden;
      border: 1px solid var(--gray-200);
      background: var(--gray-50);
      box-shadow: 0 8px 22px rgba(20, 20, 34, 0.08);
    }

    .rental-thumb img {
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: cover;
      transition: transform 0.35s ease;
    }

    .rental-thumb:hover img {
      transform: scale(1.03);
    }

    .rental-cta-banner {
      margin-top: 48px;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      padding: 28px 32px;
      border-radius: 20px;
      background: linear-gradient(125deg, var(--purple-bg) 0%, #2d1848 54%, var(--purple) 100%);
      color: var(--white);
      border: 1px solid rgba(201, 168, 76, 0.28);
      box-shadow: 0 20px 52px rgba(26, 16, 40, 0.35);
    }

    .rental-cta-banner h2 {
      font-size: clamp(18px, 2.8vw, 24px);
      font-weight: 800;
      margin-bottom: 8px;
    }

    .rental-cta-banner p {
      font-size: 14px;
      opacity: 0.92;
      max-width: 36em;
    }

    .btn-rental-wa-inverse {
      background: linear-gradient(135deg, var(--gold) 0%, var(--gold-light) 100%) !important;
      color: var(--purple-bg) !important;
      box-shadow: 0 10px 28px rgba(0, 0, 0, 0.25);
    }

    .btn-rental-wa-inverse:hover {
      opacity: 0.94;
      transform: translateY(-2px);
    }

    @media (max-width: 900px) {
      .rental-hero-inner {
        grid-template-columns: 1fr;
        gap: 24px;
      }

      .rental-hero-copy,
      .rental-hero-figure,
      .rental-hero-trust {
        grid-column: auto;
        grid-row: auto;
      }

      .rental-cards {
        grid-template-columns: 1fr;
      }

      .rental-page .rental-hero {
        padding-top: 28px;
      }

      .rental-aura-block {
        grid-template-columns: minmax(0, 1fr);
        gap: clamp(10px, 2.5vw, 16px);
        padding: clamp(12px, 3.2vw, 18px);
      }

      .rental-aura-block .rental-aura-gallery {
        order: -1;
        max-width: none;
        max-height: none;
        height: auto;
        min-height: 0;
        align-self: stretch;
        border-left: none;
        box-shadow: none;
        border-bottom: 1px solid rgba(26, 16, 40, 0.07);
        border-radius: clamp(14px, 3vw, 18px);
        background: #ebebef;
        width: 100%;
        margin: 0;
      }

      .rental-aura-block .rental-aura-figure {
        flex: none;
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: min(320px, 52vw);
        max-height: none;
        aspect-ratio: 1 / 1;
        border-radius: inherit;
        background: linear-gradient(180deg, #f0f0f3 0%, #e4e4ea 100%);
        padding: clamp(8px, 2vw, 14px);
      }

      .rental-aura-block .rental-aura-figure img {
        width: 100%;
        max-width: 100%;
        max-height: min(340px, 85vw);
        height: auto;
        object-fit: contain;
        object-position: center;
      }

      .rental-aura-block .rental-aura-copy {
        padding: clamp(6px, 1.5vw, 12px) 0 0;
        width: 100%;
        min-width: 0;
      }

      .rental-aura-block .rental-aura-lead,
      .rental-aura-block .rental-aura-note {
        max-width: none;
      }

      .rental-aura-block .rental-aura-whys {
        max-width: none;
      }
    }

    /* ══════════════════════════════
       ARTIGO / BLOG (SPA)
    ══════════════════════════════ */
    .blog-article-page {
      background: var(--gray-50);
      padding: 32px 0 56px;
      min-height: 60vh;
    }

    .blog-article-inner {
      max-width: 960px;
      margin: 0 auto;
      padding: 0 20px;
      width: 100%;
      box-sizing: border-box;
    }

    .blog-article-page .spa-back-link {
      display: inline-flex;
      margin-bottom: 20px;
    }

    .blog-article-hero {
      margin: 0 0 28px;
      border-radius: var(--radius);
      overflow: hidden;
      border: 1px solid var(--gray-200);
      box-shadow: 0 12px 32px rgba(26, 16, 40, 0.08);
      line-height: 0;
      background: var(--white);
    }

    .blog-article-hero img {
      display: block;
      width: 100%;
      height: auto;
    }

    .blog-article-header h1 {
      font-family: 'Playfair Display', serif;
      font-size: clamp(1.55rem, 3.5vw, 2.05rem);
      font-weight: 700;
      line-height: 1.2;
      color: var(--black);
      margin: 0 0 12px;
    }

    .blog-article-meta {
      font-size: 14px;
      color: var(--gray-600);
      margin: 0 0 28px;
      padding-bottom: 20px;
      border-bottom: 1px solid var(--gray-200);
    }

    .blog-article-prose h2 {
      font-size: clamp(1.15rem, 2.2vw, 1.35rem);
      font-weight: 700;
      color: var(--black);
      margin: 32px 0 14px;
      line-height: 1.3;
    }

    .blog-article-prose h2:first-of-type {
      margin-top: 0;
    }

    .blog-article-prose h3 {
      font-size: 1.05rem;
      font-weight: 700;
      color: var(--black);
      margin: 18px 0 8px;
      line-height: 1.35;
    }

    .blog-article-prose p {
      font-size: 15px;
      line-height: 1.75;
      color: var(--gray-600);
      margin: 0 0 14px;
    }

    .blog-article-prose ul {
      margin: 0 0 18px;
      padding-left: 22px;
      color: var(--gray-600);
      font-size: 15px;
      line-height: 1.7;
    }

    .blog-article-prose li {
      margin-bottom: 8px;
    }

    .blog-article-prose li:last-child {
      margin-bottom: 0;
    }

    .blog-article-table-wrap {
      overflow-x: auto;
      margin: 16px 0 22px;
      -webkit-overflow-scrolling: touch;
      border-radius: var(--radius);
      border: 1px solid var(--gray-200);
      background: var(--white);
      /* Só cria faixa de scroll quando o conteúdo realmente extrapola */
      max-width: 100%;
    }

    .blog-article-table {
      width: 100%;
      min-width: 0;
      max-width: 100%;
      border-collapse: collapse;
      font-size: 14px;
      line-height: 1.5;
      color: var(--gray-800);
      table-layout: auto;
    }

    .blog-article-table th,
    .blog-article-table td {
      padding: 10px 12px;
      text-align: left;
      border-bottom: 1px solid var(--gray-200);
      vertical-align: top;
      word-wrap: break-word;
      overflow-wrap: break-word;
    }

    .blog-article-table thead th {
      background: var(--gray-100);
      font-weight: 700;
      color: var(--black);
      border-bottom: 1px solid var(--gray-200);
    }

    .blog-article-table tbody tr:last-child th,
    .blog-article-table tbody tr:last-child td {
      border-bottom: none;
    }

    .blog-article-table tbody th[scope="row"] {
      background: rgba(107, 33, 168, 0.06);
      font-weight: 600;
      color: var(--gray-800);
    }

    .blog-article-table--compare {
      min-width: 520px;
      font-size: 13px;
    }

    @media (min-width: 901px) {
      .blog-article-table--compare {
        font-size: 14px;
      }
    }

    @media (max-width: 900px) {
      .blog-article-table th,
      .blog-article-table td {
        padding: 8px 9px;
      }
    }

    .blog-model-block {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 0;
      margin: 28px 0;
      border: 1px solid var(--gray-200);
      border-radius: var(--radius);
      overflow: hidden;
      background: var(--white);
      box-shadow: 0 6px 20px rgba(26, 16, 40, 0.06);
      width: 100%;
      max-width: 100%;
    }

    @media (min-width: 720px) {
      .blog-model-block {
        flex-direction: row;
      }

      .blog-model-block-fig {
        flex: 0 0 44%;
        width: 44%;
        max-width: 44%;
        align-self: stretch;
        min-height: 0;
      }

      .blog-model-block-fig img {
        max-height: 100%;
      }

      .blog-model-block-body {
        flex: 1 1 0;
        min-width: 0;
        border-left: 1px solid var(--gray-200);
        background: var(--white);
        position: relative;
        z-index: 1;
      }
    }

    .blog-model-block-fig {
      margin: 0;
      min-height: 240px;
      min-width: 0;
      aspect-ratio: 4 / 3;
      background: #f2f2f4;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 16px;
      box-sizing: border-box;
    }

    .blog-model-block-fig img {
      flex: 0 1 auto;
      max-width: 100%;
      max-height: 100%;
      width: auto;
      height: auto;
      object-fit: contain;
      object-position: center;
      display: block;
    }

    @media (max-width: 719px) {
      .blog-model-block-fig {
        min-height: 260px;
        aspect-ratio: 16 / 11;
      }

      .blog-model-block-fig img {
        max-height: 360px;
      }
    }

    .blog-model-block-body {
      padding: 18px 20px 22px;
      min-width: 0;
      background: var(--white);
      overflow-wrap: anywhere;
    }

    .blog-model-block-body h3 {
      margin: 0 0 4px;
      font-size: 1.08rem;
      font-weight: 700;
      color: var(--black);
      line-height: 1.3;
    }

    .blog-model-block-body .blog-product-card-tagline {
      margin: 0 0 12px;
    }

    .blog-model-block-prices {
      display: flex;
      flex-direction: column;
      gap: 4px;
      margin-bottom: 12px;
    }

    .blog-model-price-main {
      font-size: 1.15rem;
      font-weight: 700;
      color: var(--purple);
    }

    .blog-model-price-pix {
      font-size: 14px;
      color: var(--gray-600);
    }

    .blog-model-block-body a {
      color: var(--green);
      font-weight: 600;
    }

    .blog-model-block-body a:hover {
      text-decoration: underline;
    }

    .blog-article-tip {
      font-size: 15px;
    }

    .blog-article-tip {
      margin: 20px 0;
      padding: 16px 18px;
      border-radius: var(--radius);
      background: rgba(107, 33, 168, 0.08);
      border-left: 4px solid var(--purple);
      font-size: 15px;
      line-height: 1.65;
      color: var(--gray-800);
    }

    .blog-article-prose .blog-subh {
      font-weight: 700;
      color: var(--gray-800);
      margin: 18px 0 8px;
      font-size: 15px;
    }

    .blog-product-cards {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 20px;
      margin: 28px 0;
    }

    @media (max-width: 640px) {
      .blog-product-cards {
        grid-template-columns: 1fr;
      }
    }

    .blog-product-card {
      background: var(--white);
      border: 1px solid var(--gray-200);
      border-radius: var(--radius);
      overflow: hidden;
      box-shadow: 0 6px 20px rgba(26, 16, 40, 0.06);
    }

    .blog-product-card-fig {
      margin: 0;
      aspect-ratio: 1;
      background: var(--gray-100);
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
    }

    .blog-product-card-fig img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .blog-product-card-body {
      padding: 16px;
    }

    .blog-product-card-body h3 {
      font-size: 16px;
      font-weight: 700;
      margin: 0 0 4px;
      color: var(--black);
    }

    .blog-product-card-body p.blog-product-card-tagline {
      font-size: 12px;
      font-weight: 600;
      color: var(--purple);
      margin: 0 0 8px;
      line-height: 1.4;
    }

    .blog-product-card-body p {
      font-size: 13px;
      line-height: 1.6;
      color: var(--gray-600);
      margin: 0 0 10px;
    }

    .blog-product-price {
      font-weight: 700;
      color: var(--purple);
      font-size: 15px;
      margin-bottom: 8px;
    }

    .blog-product-card-body a {
      font-size: 14px;
      font-weight: 600;
      color: var(--green);
    }

    .blog-product-card-body a:hover {
      text-decoration: underline;
    }

    .blog-article-cta {
      margin: 32px 0;
      padding: 24px 22px;
      border-radius: 16px;
      background: linear-gradient(135deg, var(--purple-bg) 0%, #2a1a42 100%);
      color: var(--white);
      text-align: center;
    }

    .blog-article-cta h2 {
      font-size: 1.25rem;
      margin: 0 0 10px;
      color: var(--white);
    }

    .blog-article-cta p {
      margin: 0 0 18px;
      opacity: 0.92;
      font-size: 14px;
      line-height: 1.6;
      color: var(--white);
    }

    .blog-article-cta .btn-newsletter {
      display: inline-block;
      padding: 12px 24px;
      border-radius: 999px;
      background: var(--green);
      color: var(--white);
      font-weight: 700;
      font-size: 14px;
      border: none;
      cursor: pointer;
      text-decoration: none;
      transition: opacity 0.15s, transform 0.15s;
    }

    .blog-article-cta .btn-newsletter:hover {
      opacity: 0.92;
      transform: translateY(-1px);
    }

    .blog-article-related {
      margin-top: 40px;
      padding-top: 28px;
      border-top: 1px solid var(--gray-200);
    }

    .blog-article-related h2 {
      font-size: 1rem;
      margin: 0 0 12px;
      color: var(--black);
    }

    .blog-article-related ul {
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .blog-article-related a {
      display: inline-block;
      padding: 6px 0;
      color: var(--purple);
      font-weight: 600;
      font-size: 14px;
      overflow-wrap: anywhere;
      max-width: 100%;
    }

    .blog-article-related a:hover {
      color: var(--purple-light);
    }

    .blog-article-foot {
      margin-top: 28px;
      padding-top: 20px;
      border-top: 1px solid var(--gray-200);
      font-size: 12px;
      color: var(--gray-400);
    }

    /* ══════════════════════════════
       BASE · overflow / tipografia fluida
    ══════════════════════════════ */
    :root {
      --header-sticky-offset: 72px;
      --section-pad-x: clamp(14px, 4vw, 24px);
      --section-pad-y: clamp(36px, 6vw, 48px);
    }

    html {
      overflow-x: clip;
    }

    body {
      font-size: clamp(14px, 0.35vw + 13px, 16px);
    }

    /* ══════════════════════════════
       MENU MOBILE (drawer)
    ══════════════════════════════ */
    .nav-menu-toggle {
      display: none;
      flex-shrink: 0;
      align-items: center;
      justify-content: center;
      width: 44px;
      height: 44px;
      margin: 0;
      padding: 0;
      border: 1.5px solid var(--gray-200);
      border-radius: 10px;
      background: var(--white);
      cursor: pointer;
      transition:
        border-color 0.15s ease,
        background 0.15s ease;
    }

    .nav-menu-toggle:hover {
      border-color: var(--purple-soft);
      background: var(--purple-pale);
    }

    .nav-menu-toggle:focus-visible {
      outline: none;
      box-shadow: 0 0 0 3px rgba(147, 51, 234, 0.35);
    }

    .nav-menu-toggle-box {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 5px;
      width: 22px;
      pointer-events: none;
    }

    .nav-menu-toggle-bar {
      display: block;
      width: 100%;
      height: 2px;
      border-radius: 2px;
      background: var(--gray-800);
      transition:
        transform 0.22s ease,
        opacity 0.22s ease;
    }

    .nav-menu-toggle[aria-expanded='true'] .nav-menu-toggle-bar:nth-child(1) {
      transform: translateY(7px) rotate(45deg);
    }

    .nav-menu-toggle[aria-expanded='true'] .nav-menu-toggle-bar:nth-child(2) {
      opacity: 0;
    }

    .nav-menu-toggle[aria-expanded='true'] .nav-menu-toggle-bar:nth-child(3) {
      transform: translateY(-7px) rotate(-45deg);
    }

    .nav-drawer-backdrop {
      position: fixed;
      inset: 0;
      z-index: 10110;
      border: none;
      padding: 0;
      margin: 0;
      background: rgba(14, 14, 22, 0.48);
      backdrop-filter: blur(3px);
      cursor: pointer;
      -webkit-tap-highlight-color: transparent;
    }

    .nav-drawer-backdrop[hidden] {
      display: none !important;
    }

    body.nav-drawer-open {
      overflow: hidden;
      touch-action: none;
    }

    @media (max-width: 900px) {
      :root {
        --header-sticky-offset: 56px;
      }

      .nav-menu-toggle {
        display: inline-flex;
        margin-left: auto;
      }

      /* Sobrepõe o bloco inline do index que escondia o nav em mobile */
      nav.main-nav {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 2px;
        flex: none;
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        width: min(320px, calc(100vw - 40px));
        max-width: 100%;
        margin: 0;
        padding:
          calc(20px + env(safe-area-inset-top, 0px))
          16px
          calc(24px + env(safe-area-inset-bottom, 0px));
        background: var(--white);
        box-shadow: -12px 0 48px rgba(20, 16, 40, 0.18);
        z-index: 10120;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        transform: translateX(104%);
        visibility: hidden;
        transition:
          transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
          visibility 0.3s;
      }

      nav.main-nav.is-open {
        transform: translateX(0);
        visibility: visible;
        pointer-events: auto;
      }

      nav.main-nav:not(.is-open) {
        pointer-events: none;
      }

      nav.main-nav a {
        white-space: normal;
        padding: 14px 14px;
        min-height: 44px;
        display: flex;
        align-items: center;
        font-size: clamp(14px, 0.5vw + 13px, 16px);
        border-radius: 10px;
      }

      nav.main-nav a::after {
        display: none;
      }

      .btn-cta-head {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 10px 16px;
        font-size: clamp(12px, 0.4vw + 11px, 13px);
        max-width: min(52vw, 200px);
        white-space: normal;
        text-align: center;
        line-height: 1.25;
      }

      /* Header slide no scroll: transform:none (não translateY(0)) para não criar
         stacking context — will-change:transform aprisionaria o position:fixed do drawer. */
      header {
        transform: none;
        transition:
          transform 0.28s cubic-bezier(0.4, 0, 0.2, 1),
          box-shadow 0.28s ease;
      }

      header.header-hidden {
        transform: translateY(-100%);
        box-shadow: none !important;
      }

      header.header-visible {
        transform: none;
        box-shadow: 0 2px 16px rgba(0, 0, 0, 0.10);
      }

      body.nav-drawer-open header {
        transform: none !important;
        box-shadow: 0 2px 16px rgba(0, 0, 0, 0.10);
      }

      .pdp-tabs {
        top: var(--header-sticky-offset);
      }
    }

    @media (prefers-reduced-motion: reduce) {
      nav.main-nav {
        transition: none;
      }

      .nav-menu-toggle-bar {
        transition: none;
      }
    }

    /* ══════════════════════════════
       ≤768px · secções e componentes
    ══════════════════════════════ */
    @media (max-width: 768px) {
      .products-section,
      .why-section,
      .cat-section,
      .testimonials-section,
      .insta-section,
      .compare-section,
      .guias-section,
      .cta-banner,
      .newsletter,
      .blog-section {
        padding-inline: var(--section-pad-x);
        padding-block: var(--section-pad-y);
      }

      .feature-split {
        margin-inline: var(--section-pad-x);
      }

      .feature-split-copy {
        padding: clamp(24px, 5vw, 40px) clamp(18px, 4vw, 28px);
      }

      .hero-content {
        padding-left: clamp(16px, 5vw, 48px);
        padding-right: clamp(16px, 5vw, 48px);
        justify-content: flex-end;
        padding-top: clamp(72px, 18vw, 100px);
        padding-bottom: max(24px, env(safe-area-inset-bottom, 0px));
      }

      .hero-overlay {
        background:
          linear-gradient(to bottom, rgba(10, 3, 22, 0.78) 0%, rgba(10, 3, 22, 0.58) 50%, rgba(10, 3, 22, 0.42) 100%),
          linear-gradient(165deg, rgba(10, 3, 22, 0.9) 0%, rgba(10, 3, 22, 0.52) 55%, rgba(10, 3, 22, 0.2) 100%);
      }

      .hero-content h1 {
        text-shadow: 0 2px 16px rgba(0, 0, 0, 0.55);
      }

      .hero-content p {
        text-shadow: 0 1px 10px rgba(0, 0, 0, 0.48);
        font-size: clamp(14px, 0.5vw + 13px, 16px);
      }

      .promo-inner {
        padding: clamp(24px, 5vw, 40px) var(--section-pad-x);
        gap: 24px;
      }

      .contact-layout {
        grid-template-columns: 1fr;
        gap: 28px;
      }

      .contact-form-card {
        padding: clamp(22px, 5vw, 32px);
      }

      .tab-btn {
        min-height: 44px;
        padding: 10px 18px;
      }

      .product-detail-section {
        padding-block: clamp(28px, 6vw, 48px) clamp(40px, 8vw, 64px);
        padding-inline: var(--section-pad-x);
      }

      .blog-article-inner {
        padding-inline: clamp(14px, 4vw, 20px);
      }

      .blog-article-page {
        padding-block: clamp(24px, 5vw, 32px) clamp(40px, 8vw, 56px);
      }

      .blog-model-block-body {
        padding: clamp(14px, 4vw, 18px) clamp(14px, 4vw, 20px)
          clamp(18px, 4vw, 22px);
      }

      .rental-body {
        padding-inline: var(--section-pad-x);
        padding-block: clamp(32px, 6vw, 48px) clamp(48px, 10vw, 72px);
      }

      .rental-cta-banner {
        flex-direction: column;
        align-items: stretch;
        padding: clamp(20px, 5vw, 28px);
      }

      .footer-inner {
        gap: clamp(28px, 6vw, 40px);
      }

      .footer-bottom {
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
      }

      .trust-inner {
        grid-template-columns: 1fr;
      }

      .trust-item {
        border-right: none;
        border-bottom: 1px solid var(--gray-200);
        padding-block: 12px;
      }

      .trust-item:last-child {
        border-bottom: none;
      }

      .compare-scroll-hint {
        display: block;
        font-size: 12px;
        font-weight: 600;
        color: var(--purple);
        text-align: center;
        margin: 0 0 10px;
        letter-spacing: 0.02em;
      }

      .compare-table {
        min-width: 480px;
      }

      .compare-table thead th:first-child,
      .compare-table tbody td:first-child {
        position: sticky;
        left: 0;
        z-index: 2;
        box-shadow: 4px 0 12px rgba(0, 0, 0, 0.08);
      }

      .compare-table thead th:first-child {
        z-index: 3;
        background: #1e1030;
      }

      .compare-table tbody td:first-child {
        background: #fff;
      }

      .compare-table tbody tr:nth-child(even) td:first-child {
        background: #faf9ff;
      }

      .blog-article-table-wrap::before {
        content: 'Deslize ↔ para ver a tabela completa';
        display: block;
        font-size: 11px;
        font-weight: 600;
        color: var(--purple);
        text-align: center;
        margin-bottom: 8px;
        line-height: 1.35;
      }

      .blog-article-table tbody tr > :first-child {
        position: sticky;
        left: 0;
        z-index: 1;
        box-shadow: 3px 0 10px rgba(0, 0, 0, 0.07);
      }

      .blog-article-table thead th:first-child {
        position: sticky;
        left: 0;
        z-index: 2;
        box-shadow: 3px 0 10px rgba(0, 0, 0, 0.07);
        background: var(--gray-100);
      }

      .blog-article-table tbody tr:nth-child(odd) > :first-child {
        background: #fff;
      }

      .blog-article-table tbody tr:nth-child(even) > :first-child {
        background: #f7f7fa;
      }

      .blog-article-table tbody th[scope="row"] {
        background: #f0ecf8;
      }

      .catalog-carousel-dot {
        min-width: 44px;
        min-height: 44px;
        padding: 16px;
        margin: -12px;
        box-sizing: border-box;
        border: none;
        background: transparent;
        display: inline-flex;
        align-items: center;
        justify-content: center;
      }

      .catalog-carousel-dot::after {
        content: '';
        width: 9px;
        height: 9px;
        border-radius: 50%;
        border: 1.5px solid rgba(255, 255, 255, 0.92);
        background: transparent;
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
      }

      .catalog-carousel-dot.is-active::after {
        background: var(--white);
        border-color: var(--white);
        box-shadow:
          0 0 0 1.5px rgba(147, 51, 234, 0.85),
          0 4px 12px rgba(107, 33, 168, 0.35);
      }

      .catalog-carousel-dots {
        gap: 4px;
        padding: 8px 10px;
      }

      .catalog-carousel-dot:hover::after {
        transform: scale(1.18);
        background: rgba(255, 255, 255, 0.38);
      }

      .wa-float {
        bottom: max(16px, env(safe-area-inset-bottom, 0px));
        right: max(16px, env(safe-area-inset-right, 0px));
        width: 52px;
        height: 52px;
      }

      .hero-mute-btn {
        bottom: max(16px, env(safe-area-inset-bottom, 0px));
        right: max(16px, env(safe-area-inset-right, 0px));
      }

      .hero-scroll {
        bottom: max(72px, calc(env(safe-area-inset-bottom, 0px) + 56px));
      }

      .filter-bar-select {
        width: 100%;
        min-width: 0;
      }

      .price-pills-wrap {
        min-width: 0;
        flex: 1 1 100%;
      }

      .pdp-tab {
        min-height: 44px;
      }

      .product-gallery-thumbs {
        grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
      }

      .add-btn {
        width: 44px;
        height: 44px;
      }

      #home-featured-grid {
        grid-template-columns: 1fr;
        gap: clamp(14px, 3.2vw, 20px);
      }

      #home-featured-grid .product-card {
        min-width: 0;
        max-width: 100%;
      }

      #home-featured-grid .product-card-body h3,
      #catalog-grid .product-card-body h3 {
        overflow-wrap: anywhere;
      }

      #home-featured-grid .product-card-body {
        padding: clamp(14px, 3vw, 18px);
      }

      #produtos .product-tabs-home,
      .product-tabs-catalog {
        flex-wrap: nowrap;
        justify-content: flex-start;
        gap: 8px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
        padding-bottom: 8px;
        margin-bottom: 22px;
      }

      #produtos .product-tabs-home .tab-btn,
      .product-tabs-catalog .tab-btn {
        flex: 0 0 auto;
      }

      #catalog-grid.catalog-products-grid {
        grid-template-columns: 1fr;
        gap: clamp(16px, 3vw, 22px);
      }

      #produtos .sec-head {
        margin-bottom: 20px;
      }

      #produtos .sec-head h2 {
        font-size: clamp(1.35rem, 5vw, 1.85rem);
      }

      #produtos .sec-head p {
        font-size: clamp(14px, 3.5vw, 15px);
      }

      .compare-table thead th,
      .compare-table tbody td {
        padding: 12px 14px;
        font-size: 13px;
        line-height: 1.35;
        vertical-align: top;
      }

      .compare-table tbody td:first-child,
      .compare-table thead th:first-child {
        white-space: normal;
      }

      .rental-hero-cta-row {
        flex-direction: column;
        align-items: stretch;
      }

      .rental-hero-cta-row .btn-rental-wa {
        width: 100%;
        white-space: normal;
        padding-inline: 18px;
      }

      .rental-catalog-link {
        width: 100%;
        max-width: 100%;
        justify-content: center;
        text-align: center;
        align-self: stretch !important;
        box-sizing: border-box;
      }

      .rental-gallery {
        grid-template-columns: repeat(auto-fill, minmax(min(160px, 100%), 1fr));
        gap: 12px;
      }

      .catalog-hero-wrap {
        padding-top: 12px;
        padding-bottom: 6px;
      }

      .catalog-carousel {
        max-width: 100%;
      }

      .blog-article-header h1 {
        font-size: clamp(1.38rem, 5.5vw, 1.72rem);
      }

      .blog-article-table {
        font-size: 13px;
      }

      .blog-article-prose {
        overflow-wrap: anywhere;
      }

      .price-pills-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
        padding-bottom: 6px;
      }

      .price-pills {
        flex-wrap: nowrap;
      }

      .price-pill {
        flex: 0 0 auto;
      }

      .filter-bar-row {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        gap: 16px;
        padding-bottom: 6px;
        align-items: center;
      }
    }

    /* ══════════════════════════════
       ≤480px · tele estreito
    ══════════════════════════════ */
    @media (max-width: 480px) {
      :root {
        --section-pad-x: 14px;
        --section-pad-y: clamp(28px, 8vw, 40px);
      }

      .hero {
        min-height: clamp(300px, 62vw, 420px);
      }

      .hero-content h1 {
        font-size: clamp(24px, 7.5vw, 34px);
      }

      .products-grid {
        grid-template-columns: 1fr;
        gap: 16px;
      }

      .blog-products-grid {
        grid-template-columns: 1fr;
      }

      .insta-grid {
        grid-template-columns: repeat(2, 1fr);
      }

      .compare-table thead th,
      .compare-table tbody td {
        padding: 10px 12px;
        font-size: 13px;
      }

      .rental-card {
        padding: clamp(18px, 5vw, 24px);
      }

      .header-wrap {
        flex-wrap: wrap;
        row-gap: 10px;
        padding-inline: max(12px, env(safe-area-inset-left, 0px))
          max(12px, env(safe-area-inset-right, 0px));
        min-height: auto;
        padding-block: 10px;
      }

      .nav-menu-toggle {
        margin-left: auto;
        flex-shrink: 0;
      }

      .logo.header-logo {
        min-width: 0;
        flex: 1 1 auto;
        max-width: calc(100% - 56px);
      }

      .logo-img {
        width: 44px;
        height: 44px;
        flex-shrink: 0;
      }

      .header-actions {
        flex: 1 1 100%;
        min-width: 0;
        order: 4;
      }

      .btn-cta-head {
        width: 100%;
        max-width: none !important;
        white-space: normal;
        font-size: 12px;
        padding: 11px 14px;
        line-height: 1.25;
      }

      .compare-table {
        min-width: 520px;
      }

      .rental-page-title {
        font-size: clamp(1.35rem, 6.2vw, 1.65rem);
      }

      .btn-rental-wa {
        font-size: 14px;
        padding-inline: 16px;
      }

      .blog-article-cta {
        padding: 20px 16px;
      }

      .blog-article-table th,
      .blog-article-table td {
        padding: 7px 8px;
        font-size: 12px;
      }

      .blog-model-block-body h3 {
        font-size: 1.02rem;
      }

      .catalog-carousel-slide figcaption {
        font-size: 11px;
        line-height: 1.4;
      }
    }

