*{box-sizing:border-box}
html{scroll-behavior:smooth;background:#fff7ef}
body{margin:0;background:#fff7ef;color:#3e2b21;font-family:Arial,Helvetica,sans-serif}
main{width:100%;overflow:hidden}
.art-block{position:relative;width:min(100%,1536px);margin:0 auto;background:#fff7ef}
.art-block img{display:block;width:100%;height:auto}
.cta-hotspot{position:absolute;z-index:5;display:block;border-radius:22px;cursor:pointer}
.cta-hotspot:focus-visible{outline:4px solid #fff;outline-offset:3px;box-shadow:0 0 0 8px rgba(244,119,23,.48)}
.art-block+.art-block{border-top:1px solid rgba(122,87,54,.04)}
.floating-cta{position:fixed;z-index:100;left:50%;bottom:18px;transform:translateX(-50%);width:min(560px,calc(100% - 28px));min-height:64px;padding:12px 22px;border-radius:20px;display:none;align-items:center;justify-content:space-between;gap:18px;color:#fff;text-decoration:none;background:linear-gradient(135deg,#f47717,#ff8f28);box-shadow:0 15px 36px rgba(146,65,7,.34);font-weight:900}
.floating-cta strong{font-size:20px;white-space:nowrap}
@media(max-width:760px){body{padding-bottom:92px}.art-block{width:100%}.floating-cta{display:flex}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}


/* =========================================================
   DESKTOP + MOBILE NO MESMO SITE
   ========================================================= */

.desktop-version { display: block; }
.mobile-version { display: none; }

/* No desktop, mantém exatamente a estrutura anterior. */
.desktop-version .art-block {
  position: relative;
  width: min(100%, 1536px);
  margin: 0 auto;
  background: #fff7ef;
}

/* Versão exclusiva para celular */
.mobile-art {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  line-height: 0;
  overflow: hidden;
  background: #fff8ed;
}

.mobile-art img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  user-select: none;
  -webkit-user-drag: none;
}

.mobile-hotspot {
  position: absolute;
  z-index: 20;
  display: block;
  border-radius: 24px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

.mobile-hotspot:active {
  transform: scale(.985);
}

.mobile-hotspot:focus-visible {
  outline: 4px solid rgba(255,255,255,.95);
  outline-offset: 3px;
  box-shadow: 0 0 0 8px rgba(244,119,23,.5);
}

/* Celular */
@media (max-width: 760px) {
  html, body {
    background: #f5ecdf;
  }

  body {
    padding-bottom: 90px;
  }

  .desktop-version {
    display: none !important;
  }

  .mobile-version {
    display: block !important;
    width: min(100%, 480px);
    margin: 0 auto;
    background: #fff8ed;
    box-shadow: 0 0 30px rgba(80,55,25,.08);
  }

  .floating-cta {
    display: flex !important;
  }
}

/* Tablet e desktop */
@media (min-width: 761px) {
  .desktop-version {
    display: block !important;
  }

  .mobile-version {
    display: none !important;
  }

  .floating-cta {
    display: none !important;
  }
}