:root {
  --navy: #0b1c2c;
  --sun: #e85d04;
  --paper: #f4efe6;
  --mute: #b7c0c8;
  --line: rgba(244,239,230,.12);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { min-height: 100%; }
body {
  background: var(--navy);
  color: var(--paper);
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.45;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--sun); }
.top {
  display: flex; justify-content: space-between; align-items: center;
  padding: 1rem 1.25rem; max-width: 1100px; margin: 0 auto;
}
.brand { color: var(--paper); text-decoration: none; font-weight: 800; letter-spacing: .12em; font-size: .92rem; }
.place { color: var(--sun); font-size: .82rem; font-weight: 700; }
.wrap { max-width: 1100px; margin: 0 auto; padding: 0 1.25rem 4rem; }
.hero {
  display: grid; grid-template-columns: 1.1fr .9fr; gap: 1.5rem;
  align-items: center; margin-bottom: 2.2rem;
}
.hero img { width: 100%; border-radius: 20px; border: 1px solid var(--line); object-fit: cover; }
.fb { font-size:.82rem; margin-top:.8rem; }
.kicker { text-transform: uppercase; letter-spacing: .16em; font-size: .72rem; color: var(--sun); font-weight: 700; margin-bottom: .7rem; }
h1 {
  font-family: Impact, "Arial Black", Arial, sans-serif;
  font-size: clamp(2.1rem, 5.5vw, 3.6rem);
  line-height: .95; letter-spacing: -.03em; margin-bottom: .9rem;
}
.lede { color: var(--mute); font-size: 1.05rem; margin-bottom: .7rem; max-width: 36ch; }
.punch { color: var(--paper); font-weight: 700; margin-bottom: 1.1rem; }
.cta {
  display: inline-flex; background: var(--sun); color: #fff; text-decoration: none;
  font-weight: 800; padding: .9rem 1.2rem; border-radius: 999px;
}
h2 {
  font-size: .72rem; letter-spacing: .16em; text-transform: uppercase;
  color: var(--sun); margin: 2.2rem 0 .8rem;
}
.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.card {
  background: #12283c; border: 1px solid var(--line);
  border-radius: 18px; padding: 1.2rem 1.25rem;
}
.card p, .card li { color: var(--mute); font-size: .98rem; margin-bottom: .55rem; }
.card ol { padding-left: 1.15rem; }
.card li { margin-bottom: .7rem; }
.card strong { color: var(--paper); }
.price {
  font-family: Impact, "Arial Black", Arial, sans-serif;
  font-size: clamp(1.8rem, 4vw, 2.4rem); color: var(--sun);
  letter-spacing: -.03em; line-height: 1; margin: .3rem 0 .5rem;
}
.fine { color: #7e8b96; font-size: .82rem; }
form.card label {
  display: block; font-size: .78rem; font-weight: 800; color: var(--paper);
  letter-spacing: .04em; text-transform: uppercase; margin: 14px 0 6px;
}
input, textarea, select {
  width: 100%; font-size: 16px; padding: 11px 12px;
  border: 1px solid var(--line); border-radius: 10px;
  background: #0b1c2c; color: var(--paper);
}
textarea { min-height: 72px; resize: vertical; }
button {
  margin: 22px 0 10px; width: 100%; background: var(--sun); color: #fff;
  border: 0; padding: 14px 16px; font-size: 16px; font-weight: 800;
  border-radius: 999px; cursor: pointer;
}
button:hover { filter: brightness(1.06); }
footer { margin-top: 2.5rem; color: #7e8b96; font-size: .82rem; }
.plans { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.plan { background:#12283c; border:1px solid var(--line); border-radius:18px; padding:1.25rem 1.2rem; display:flex; flex-direction:column; }
.plan h3 { font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--sun); margin-bottom:.4rem; }
.plan .num { font-family:Impact,"Arial Black",Arial,sans-serif; font-size:2.4rem; color:var(--sun); letter-spacing:-.03em; line-height:1; margin:.2rem 0 .2rem; }
.plan .per { color:var(--mute); font-size:.82rem; margin-bottom:.8rem; }
.plan ul { list-style:none; margin:0 0 1rem; flex:1; }
.plan li { color:var(--mute); font-size:.95rem; margin:0 0 .45rem; }
.plan li::before { content:"— "; color:var(--sun); }
.plan.featured { outline:2px solid var(--sun); }
@media (max-width: 860px) {
  .hero, .grid { grid-template-columns: 1fr; }
  .plans { grid-template-columns: 1fr 1fr; }
}
.nav { display:flex; gap:1rem; flex-wrap:wrap; font-size:.82rem; margin:-.4rem 0 1.4rem; }
.nav a { color:var(--mute); text-decoration:none; font-weight:700; }
.nav a:hover { color:var(--sun); }
.bigh { font-family:Impact,"Arial Black",Arial,sans-serif; font-size:clamp(1.8rem,4.5vw,2.8rem); line-height:.95; letter-spacing:-.03em; margin:.2rem 0 .7rem; }
.apps { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.app { background:#12283c; border:1px solid var(--line); border-radius:18px; overflow:hidden; display:flex; flex-direction:column; }
.app img { width:100%; aspect-ratio:16/10; object-fit:cover; object-position:top; border-bottom:1px solid var(--line); background:#fff; }
.app .in { padding:1.1rem 1.2rem 1.25rem; display:flex; flex-direction:column; flex:1; }
.app h3 { font-family:Impact,"Arial Black",Arial,sans-serif; font-size:1.7rem; letter-spacing:-.02em; line-height:1; margin-bottom:.3rem; }
.app .tag { color:var(--sun); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; font-weight:700; margin-bottom:.6rem; }
.app p { color:var(--mute); font-size:.95rem; margin-bottom:.7rem; }
.app ul { list-style:none; margin:0 0 1rem; flex:1; }
.app li { color:var(--mute); font-size:.9rem; margin:0 0 .4rem; }
.app li::before { content:"— "; color:var(--sun); }
.app li strong { color:var(--paper); }
.ghost { display:inline-flex; justify-content:center; border:2px solid var(--sun); color:var(--paper); text-decoration:none; font-weight:800; padding:.75rem 1.1rem; border-radius:999px; }
.ghost:hover { background:var(--sun); }
.mods { width:100%; border-collapse:collapse; font-size:.93rem; }
.mods td { padding:.55rem .3rem; border-bottom:1px solid var(--line); color:var(--mute); vertical-align:top; }
.mods td:first-child { color:var(--paper); font-weight:700; white-space:nowrap; }
.mods td.note { color:var(--mute); font-weight:400; white-space:normal; text-align:left; font-size:.85rem; padding-top:.8rem; }
.mods td.note strong { color:var(--paper); }
.mods th { text-align:left; font-size:.75rem; text-transform:uppercase; letter-spacing:.06em; color:var(--mute); padding:.4rem .3rem; border-bottom:1px solid var(--line); }
.mods th:nth-child(n+3) { text-align:right; }
.mods td:nth-child(3) { color:var(--paper); font-weight:700; white-space:nowrap; text-align:right; }
.mods td:last-child { color:var(--sun); font-weight:800; white-space:nowrap; text-align:right; }
.combos { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:1rem; }
@media (max-width: 860px) {
  .apps { grid-template-columns:1fr; }
  .combos { grid-template-columns:1fr 1fr; }
  .mods tr { display:grid; grid-template-columns:1fr auto auto; gap:0 .6rem; }
  .mods th:nth-child(2) { display:none; }
  .mods td { border-bottom:0; padding:.2rem .1rem; }
  .mods td:nth-child(2) { grid-column:1 / -1; grid-row:2; border-bottom:1px solid var(--line); padding-bottom:.6rem; }
  .mods td.note { grid-column:1 / -1; }
  .mods td:first-child { white-space:normal; }
}
@media (max-width: 520px) { .plans { grid-template-columns:1fr; } }
/* páginas internas */
.crumbs { font-size:.8rem; color:var(--mute); margin:-.2rem 0 1.4rem; }
.crumbs ol { list-style:none; display:flex; flex-wrap:wrap; gap:.35rem; }
.crumbs li + li::before { content:"›"; margin-right:.35rem; color:var(--sun); }
.crumbs a { color:var(--mute); text-decoration:none; }
.crumbs a:hover { color:var(--sun); }
.page-hero { margin-bottom:1.6rem; }
.page-hero .lede { max-width:62ch; }
.page-hero.withimg { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; align-items:center; }
.page-hero.withimg img { border-radius:18px; border:1px solid var(--line); background:#fff; }
.ctas { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:.4rem; }
h2.sec { font-family:Impact,"Arial Black",Arial,sans-serif; font-size:clamp(1.4rem,3vw,1.9rem); text-transform:none; letter-spacing:-.02em; color:var(--paper); margin:2.2rem 0 .7rem; line-height:1; }
.prose { max-width:70ch; }
.prose p { color:var(--mute); margin-bottom:.8rem; font-size:1rem; }
.prose strong { color:var(--paper); }
.ticks { list-style:none; margin:.2rem 0 1rem; }
.ticks li { color:var(--mute); margin:0 0 .5rem; }
.ticks li::before { content:"— "; color:var(--sun); }
.ticks li strong { color:var(--paper); }
.faq details { border-bottom:1px solid var(--line); padding:.8rem 0; }
.faq summary { cursor:pointer; font-weight:700; color:var(--paper); }
.faq details p { color:var(--mute); margin-top:.5rem; max-width:70ch; }
.links { display:grid; grid-template-columns:repeat(3,1fr); gap:.6rem; }
.links a { display:block; background:#12283c; border:1px solid var(--line); border-radius:14px; padding:.8rem 1rem; color:var(--paper); text-decoration:none; font-weight:700; font-size:.95rem; }
.links a span { display:block; color:var(--mute); font-weight:400; font-size:.82rem; margin-top:.2rem; }
.links a:hover { border-color:var(--sun); }
.more { display:inline-block; margin-top:.2rem; font-weight:800; font-size:.9rem; text-decoration:none; }
.more:hover { text-decoration:underline; }
@media (max-width: 860px) { .page-hero.withimg { grid-template-columns:1fr; } .links { grid-template-columns:1fr 1fr; } }
@media (max-width: 520px) { .links { grid-template-columns:1fr; } }
