:root {
  --bg: #111a16;
  --gold: #e0be77;
  --light: #f7f0df;
  --gray: #c6ccc0;
  --line: #e2d4aa29;
}
body { background: var(--bg); }
.hero {
  background: radial-gradient(ellipse at 80% 48%, #76542d55, transparent 58%), #101c16;
}
.hero::before {
  background: linear-gradient(90deg, #101a16, #101a1680 65%, #101a1644), url("hero.jpg") center / cover;
  opacity: .68;
}
.hero nav { border-color: #e0be773d; padding-block: 17px; padding-right: 107px; }
.hero nav a:last-child { color: var(--gold); }
.hero-grid { grid-template-columns: 1.06fr .94fr; gap: clamp(24px, 4vw, 64px); padding-block: 44px 50px; }
.hero h1 { font-size: clamp(43px, 4.8vw, 68px); line-height: .98; max-width: 100%; text-wrap: balance; }
.hero .tag { margin-bottom: 12px; }
.hero p { color: #e2e5d9; }
.hero .bundle { isolation: isolate; min-height: clamp(340px, 43vw, 510px); }
.hero .bundle::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 6% 3%;
  border: 1px solid #e0be773d;
  border-radius: 48% 48% 18px 18px;
  background: radial-gradient(ellipse, #e0be7724, transparent 71%);
}
.hero .mainbook { width: 60%; max-width: 305px; transform: rotate(3deg); }
.hero .sheet.a { left: 6%; top: 20%; transform: rotate(-12deg); }
.hero .sheet.b { right: 4%; top: 29%; transform: rotate(11deg); }
.hero .sheet { width: 36%; }
.hero .floating { bottom: 3%; left: 3%; border-radius: 9px; background: #17291ff5; }
.assurances { border-color: #e0be7744; color: #e4e5d7; align-items: center; }
.btn { border-radius: 9px; text-wrap: balance; background: linear-gradient(135deg, #edd498, #c8a15b); }
.section { padding-block: clamp(57px, 7vw, 108px); }
.section-head { margin-bottom: clamp(28px, 4vw, 52px); }
.section-head h2 { text-wrap: balance; }
.section.alt { background: #17231c; }
.section.paper { background: #f3eddd; }
.section.paper .tag { color: #76531e; }
.bridge { background: linear-gradient(115deg, #e8cd91, #c6a162); }
.reason, .extra { background: #faf6eb; border-color: #b8a27b66; border-radius: 13px; box-shadow: 0 12px 32px #45331d0b; }
.module { background: linear-gradient(145deg, #243428, #1b2920); border-color: #e0be7738; border-radius: 13px; }
.module .icon { width: 51px; height: 51px; display: grid; place-items: center; border: 1px solid #e0be7744; border-radius: 12px; background: #e0be7710; }
.module p { color: #d4dbce; }
#por-dentro { background: radial-gradient(ellipse at top, #5b4c322f, transparent 66%), #101a15; }
.sample-grid { align-items: stretch; }
.sample-card { background: #202e25; border-color: #e0be7744; border-radius: 14px; }
.sample-card button { padding: 16px; border-radius: 9px; background: radial-gradient(ellipse, #dbc78b29, #101913); }
.sample-card p { color: #d1d8ca; }
.offer-area { background: radial-gradient(ellipse at 52% 36%, #66512e55, transparent 68%), #111b15; }
.ticket { border: 1px solid #dfc892; border-radius: 15px; background: #f7f0df; }
.ticket-head { background: linear-gradient(105deg, #ead299, #caa360); }
.ticket-body { padding: clamp(23px, 3.5vw, 40px); }
.faq details { padding-inline: 18px; border: 1px solid #e0be7730; border-radius: 9px; margin-bottom: 10px; background: #1c2a21; }
.last { background: linear-gradient(160deg, #24382b, #14241a); }
@media (max-width: 760px) {
  .hero nav { flex-direction: column; align-items: flex-start; gap: 5px; padding-block: 11px; }
  .hero-grid { grid-template-columns: minmax(0, 1fr); padding-block: 28px 36px; gap: 18px; }
  .hero-grid > .hero-copy { display: contents; }
  .hero-intro { grid-row: 1; }
  .hero-grid > .bundle { grid-row: 2; }
  .hero-actions { grid-row: 3; }
  .hero h1 { max-width: 15ch; font-size: clamp(39px, 9.4vw, 60px); margin-bottom: 13px; }
    .hero-intro p { margin-bottom: 0; }
  .hero .bundle { min-height: 0; height: clamp(240px, 75vw, 365px); margin: 0; }
  .hero .mainbook { width: 48%; max-width: 195px; }
  .hero .sheet { width: 29%; max-width: 126px; }
  .hero .sheet.a { left: 10%; }
  .hero .sheet.b { right: 8%; }
  .hero .floating { padding: 8px 12px; font-size: 10px; bottom: 1%; left: 4%; }
  .hero .floating strong { font-size: 24px; }
  .hero-price { margin-top: 0; }
  .module .icon { width: 40px; height: 44px; font-size: 28px; }
  .sample-grid { grid-template-columns: minmax(0, 1fr); }
  .sample-card button { padding: 11px; }
  .sample-card img { height: clamp(285px, 90vw, 440px); }
  .sample-card p { font-size: 14px; }
  .offer-layout { grid-template-columns: minmax(0, 1fr); }
}
