:root {
  --ink: #19130f;
  --forest: #19130f;
  --forest-2: #2b1d17;
  --mint: #ffb191;
  --mint-2: #ff8a60;
  --cream: #f6f0e7;
  --paper: #fffaf4;
  --orange: #ed704a;
  --line: #dfd4c6;
  --line-2: #d5c8b7;
  --muted: #74685f;
  --muted-2: #62574f;
}

body {
  background:
    radial-gradient(circle at 86% 8%, rgba(255, 135, 91, .12), transparent 22rem),
    var(--cream);
}
.wide { width: min(1240px, calc(100% - 56px)); }
.top-banner { background: #19130f; color: #f5d2c1; }
.top-banner b { color: #ff9d78; }
.site-header { background: rgba(246,240,231,.88); border-color: rgba(93,65,49,.14); }
.brand-mark { background: #19130f; color: #ff9d78; border-radius: 12px; }
.brand b { color: var(--orange); }
.btn-dark { background: #19130f; }
.btn-accent { box-shadow: 0 12px 30px rgba(237,112,74,.25); }
.btn-accent:hover, .buy-button:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(237,112,74,.28); }

.hero { min-height: 690px; padding-block: 72px 68px; grid-template-columns: 1.02fr .98fr; gap: 72px; }
.hero-copy h1 {
  font-family: "DM Serif Display", Georgia, serif;
  font-size: clamp(56px, 6.7vw, 91px); font-weight: 400; letter-spacing: -.045em; line-height: .91;
}
.hero-copy h1 em { color: var(--orange); }
.hero-copy .eyebrow { color: #9d4d37; }
.lead { max-width: 610px; font-size: 17px; }
.choice { border-radius: 16px; box-shadow: 0 8px 26px rgba(45,31,22,.04); }
.choice-icon-token { background: #19130f; color: #ffa481; }
.choice-highlight { border-color: #d36a4b; }
.hero-proof { color: #645950; }

.hero-visual { min-height: 530px; isolation: isolate; }
.hero-visual::before {
  content: ""; position: absolute; inset: 18px 4px 0;
  border-radius: 46% 54% 38% 62% / 45% 35% 65% 55%;
  background: linear-gradient(145deg, #f38a61, #ffc09d 55%, #f4dcc8);
  transform: rotate(-3deg); z-index: -2;
}
.hero-visual::after {
  content: "AI"; position: absolute; right: 16px; top: 15px; z-index: -1;
  color: rgba(255,255,255,.25); font: 700 150px/1 "Space Grotesk", sans-serif;
}
.visual-glow { background: radial-gradient(circle, rgba(255,235,219,.9), rgba(255,173,130,.2) 58%, transparent 70%); }
.terminal-card { width: min(92%,500px); transform: rotate(-1.2deg); border-radius: 20px; background: #171311; border-color: #473229; box-shadow: 0 34px 80px rgba(39,24,16,.32); }
.terminal-top { border-color: #433028; color: #a99488; }
.mint { color: #ffac89; }.peach { color: #ff8060; }.gold { color: #f6d7a8; }
.response-card { background: #211915; border-color: #53382c; }
.status { color: #ff9c76; }.status i { background: #ff9c76; }
.float-tag { border: 0; border-radius: 14px; box-shadow: 0 16px 36px rgba(42,27,18,.16); }

.trust-strip { background: #fffaf4; border-color: var(--line); }
.trust-strip b { color: #42362f; }
.ritmo { padding-top: 108px; }
.ritmo-heading h2, .section-heading h2, .modelos h2, .dark-section h2, .safety h2, .faq h2, .download-card h2, .final-cta h2 {
  font-family: "DM Serif Display", Georgia, serif; font-weight: 400; letter-spacing: -.035em;
}
.ritmo-card { border-radius: 20px; box-shadow: 0 12px 40px rgba(52,36,25,.055); }
.ritmo-card.highlight { background: #211713; color: white; border-color: #211713; }
.ritmo-card.highlight p, .ritmo-card.highlight small { color: #cfbfb5; }
.ritmo-card.highlight .ritmo-icon { background: #ed704a; color: white; }

.pricing-section { padding-block: 105px 50px; }
.token-grid { gap: 18px; }
.plan-card { border-radius: 20px; overflow: hidden; box-shadow: 0 14px 42px rgba(52,36,25,.06); transition: transform .2s, box-shadow .2s; }
.plan-card:hover { transform: translateY(-5px); box-shadow: 0 20px 50px rgba(52,36,25,.11); }
.plan-image { min-height: 170px; }
.buy-button { border-radius: 999px; background: #19130f; transition: transform .2s, box-shadow .2s; }
.plan-card.best .buy-button { background: var(--orange); }
.ilimitado-section { padding-bottom: 110px; }
.ilimitado-card .plan-image { background: linear-gradient(135deg,#20140f,#623422 60%,#b85939)!important; }
.ilimitado-perks article { border-radius: 17px; }

.modelos-dark { border-radius: 30px; background: #171210; box-shadow: 0 32px 80px rgba(31,20,14,.16); }
.modelo-card { border-radius: 16px; background: #241a16; border-color: #443027; }
.integration-grid article { border-color: #463229; }
.dark-section { background: #231814; }
.steps article { border-color: #584038; border-radius: 18px; }
.step-icon { color: #ff9c76; }
.btn-light { background: #ff9c76; color: #21140f; }
.safety { background: linear-gradient(135deg, #e56e49, #f38d67); }
.safety-list article { border-color: rgba(255,255,255,.32); }
.safety-list article > span { background: #20140f; color: #ff9d79; }

.faq { padding-block: 110px; }
.faq-list details { border-radius: 14px; }
.download-card { border-radius: 24px; background: #19130f; color: #fffaf4; box-shadow: 0 18px 50px rgba(31,20,14,.22); }
.download-card h2 { color: #fffaf4; }
.download-card p { color: #d6c8bc; }
.download-card .eyebrow { color: #ffb191; }
.download-card .btn-accent { background: #ed704a; }
.final-cta { background: linear-gradient(180deg, #f6f0e7 0%, #ede6db 100%); position: relative; overflow: hidden; }
.final-cta::after { content: "↗"; position: absolute; right: 7%; top: -80px; font: 400 380px/1 "DM Serif Display", serif; color: rgba(25,19,15,.06); }
.final-cta h2 { color: #19130f; }
.final-cta h2 em { color: #ed704a; }
.final-cta p { color: #62574f; }
.final-cta .pill { background: #fffaf4; border-color: #dfd4c6; color: #74685f; }
.final-cta .light-link { color: #19130f; }
.final-cta h2 em { color: #ff9c76; }
footer { background: #100d0b; }

@media (max-width: 900px) {
  .wide { width: min(100% - 36px, 1240px); }
  .hero { min-height: auto; padding-top: 55px; gap: 35px; }
  .hero-copy h1 { font-size: clamp(50px, 12vw, 72px); }
  .hero-visual { min-height: 450px; }
}
@media (max-width: 620px) {
  .wide { width: min(100% - 28px, 1240px); }
  .hero-copy h1 { font-size: 51px; }
  .choice-links { display: grid; }
  .choice-divider { display: none; }
  .hero-visual { min-height: 390px; }
  .hero-visual::before { inset: 10px 0; }
  .terminal-card { width: 96%; }
  .tag-one { left: -4px; }.tag-two { right: -4px; }
  .modelos-dark { border-radius: 22px; }
}
