@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Manrope:wght@400;500;600&display=swap');

:root {
  --forest: #0d2e28;
  --forest-soft: #17493d;
  --moss: #55745b;
  --mist: #dce9df;
  --ivory: #f7f3e8;
  --gold: #c9a86a;
  --ink: #17251f;
  --shadow: 0 22px 55px rgba(4, 24, 19, .22);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  min-height: 100vh;
  margin: 0 !important;
  padding: clamp(18px, 4vw, 56px) !important;
  color: var(--ink) !important;
  font-family: Manrope, system-ui, sans-serif !important;
  font-size: 16px;
  line-height: 1.75;
  background:
    radial-gradient(circle at 12% 15%, rgba(201,168,106,.22), transparent 25rem),
    radial-gradient(circle at 88% 75%, rgba(126,165,139,.22), transparent 28rem),
    linear-gradient(145deg, #08251f 0%, #174a3c 48%, #0a2a25 100%) fixed !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .17;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90' viewBox='0 0 90 90'%3E%3Cpath d='M45 2C36 18 20 34 2 45c18 11 34 27 43 43 9-16 25-32 43-43C70 34 54 18 45 2Z' fill='none' stroke='%23f6e8c8' stroke-width='.6'/%3E%3C/svg%3E");
}

body > table,
#container {
  position: relative;
  width: min(1180px, 100%) !important;
  margin: 0 auto !important;
  overflow: hidden;
  border: 1px solid rgba(201,168,106,.55) !important;
  border-radius: 30px;
  color: var(--ink);
  background: linear-gradient(155deg, rgba(255,255,255,.97), rgba(238,242,231,.94)) !important;
  box-shadow: var(--shadow);
}

body > table { border-spacing: clamp(12px, 2vw, 24px) !important; padding: clamp(8px, 2vw, 22px); }

body > table td,
body > table th {
  height: auto !important;
  padding: clamp(18px, 3vw, 34px) !important;
  vertical-align: middle;
  border: 1px solid rgba(85,116,91,.18) !important;
  border-radius: 22px;
  color: var(--ink) !important;
  background: rgba(255,255,255,.48);
}

body > table tr:first-child > th:nth-child(2),
body > table tr:first-child > th[colspan] {
  background: linear-gradient(145deg, var(--forest), var(--forest-soft));
  color: var(--ivory) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}

h1, h2, h3, .Estilo1, .Estilo6, .Estilo7 {
  font-family: "Cormorant Garamond", Georgia, serif !important;
  letter-spacing: .015em;
}

.Estilo1, .Estilo6, .Estilo7 {
  font-size: clamp(2rem, 4.5vw, 3.6rem) !important;
  line-height: 1.05;
  font-weight: 600 !important;
}

.Estilo2, .Estilo3, .Estilo4, .Estilo5, .Estilo18, .Estilo26, .Estilo28,
p, span, div { color: inherit; }

a {
  color: var(--forest-soft) !important;
  text-decoration-color: var(--gold);
  text-underline-offset: .25em;
  transition: color .2s ease, transform .2s ease, box-shadow .2s ease;
}

th a:not(:has(img)) {
  display: inline-block;
  margin: 4px;
  padding: 10px 16px;
  border: 1px solid rgba(201,168,106,.75);
  border-radius: 999px;
  color: var(--ivory) !important;
  text-decoration: none;
  background: rgba(255,255,255,.08);
}

a:hover { color: #8c6a2c !important; }
th a:not(:has(img)):hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.18); }

img {
  max-width: 100% !important;
  height: auto !important;
  border-radius: 18px;
  filter: saturate(.83) contrast(1.03);
  box-shadow: 0 16px 34px rgba(9,38,31,.2);
  transition: transform .35s ease, filter .35s ease;
}

a:hover img { transform: translateY(-5px) scale(1.015); filter: saturate(1); }

#container { padding: clamp(22px, 5vw, 60px); }
#container #sidebar1 {
  float: right;
  width: min(250px, 32%) !important;
  margin: 0 0 24px 32px;
  padding: 22px !important;
  border-radius: 20px;
  color: var(--ivory);
  background: linear-gradient(145deg, var(--forest), var(--forest-soft)) !important;
}
#container #mainContent { margin: 0 !important; }
#container iframe { width: 100%; max-width: 720px; border: 0; border-radius: 20px; box-shadow: var(--shadow); }
#container p { max-width: 72ch; }
#container > p:first-child img { width: auto !important; height: 50px !important; border-radius: 10px; }

embed { max-width: 100%; opacity: .8; }

@media (max-width: 780px) {
  body { padding: 12px !important; }
  body > table, body > table tbody, body > table tr, body > table td, body > table th { display: block; width: 100% !important; }
  body > table { border-spacing: 0 !important; }
  body > table td, body > table th { margin-bottom: 12px; padding: 20px !important; }
  #container #sidebar1 { float: none; width: 100% !important; margin: 16px 0 28px; }
  .Estilo1, .Estilo6, .Estilo7 { font-size: 2.15rem !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}