/* A versão de computador usa as mesmas páginas e o mesmo conteúdo do celular. */
.desktop-tools, .desktop-nav-link { display: none; }

@media (min-width: 769px) and (max-width: 1099px) {
  .site-home .nav-links { display: none; }
  .site-home .menu-toggle { display: block; }
}

@media (min-width: 1100px) {
  .site-home {
    scroll-padding-top: 100px;
  }

  .site-home .header-inner {
    max-width: 1480px;
    gap: 26px;
    padding-inline: clamp(28px, 4vw, 64px);
  }

  .site-home .nav-links {
    align-items: center;
    gap: clamp(12px, 1.35vw, 24px);
  }

  .site-home .nav-links a { font-size: clamp(.7rem, .9vw, .88rem); }
  .site-home .nav-links .desktop-nav-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    color: #211304;
    background: #f2cf7e;
    border-radius: 6px;
  }

  .site-home .nav-links .desktop-nav-link:hover { background: #ffe4a6; }
  .site-home .nav-links .desktop-nav-link::after { display: none; }
  .site-home .mobile-nav.open { display: none; }

  .site-home .hero {
    display: grid;
    grid-template-columns: minmax(0, 660px) minmax(0, 500px);
    justify-content: center;
    gap: clamp(32px, 5vw, 88px);
    min-height: min(760px, 88svh);
    padding: 132px clamp(34px, 5vw, 88px) 70px;
    background: radial-gradient(ellipse at 22% 30%, #560c13 0%, #220d09 50%, #110906 85%);
  }

  .site-home .hero-content { max-width: none; padding: 0; text-align: left; }
  .site-home .hero-cross img { width: clamp(86px, 8vw, 125px); }
  .site-home .hero-title { font-size: clamp(2.6rem, 4.3vw, 4.6rem); letter-spacing: .015em; }
  .site-home .hero-title i { display: block; font-style: normal; }
  .site-home .hero-verse { max-width: 44ch; font-size: clamp(1rem, 1.25vw, 1.2rem); margin-bottom: 26px; }
  .site-home .hero-scroll { bottom: 12px; }

  .desktop-tools {
    display: block;
    position: relative;
    z-index: 2;
    border: 1px solid #bc8e4d70;
    border-radius: 18px;
    padding: clamp(20px, 2.5vw, 36px);
    background: #170f0cee;
    box-shadow: 0 22px 60px #0005;
  }

  .desktop-tools .tools-kicker {
    color: #efc16b;
    text-transform: uppercase;
    letter-spacing: .15em;
    font-weight: 700;
    font-size: .75rem;
  }

  .desktop-tools h2 { font: 700 clamp(1.45rem, 2vw, 2.15rem)/1.2 var(--font-serif); margin: 8px 0 20px; }
  .desktop-tools nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .desktop-tools nav a {
    display: grid;
    align-content: start;
    gap: 8px;
    min-height: 120px;
    padding: 14px;
    border: 1px solid #c9a84c44;
    border-radius: 10px;
    background: #ffffff06;
    color: var(--cream);
    text-decoration: none;
  }

  .desktop-tools nav a:hover { background: #c9a84c16; border-color: #e8bf75; }
  .desktop-tools nav i { color: #f2cf7e; font-size: 1.2rem; }
  .desktop-tools nav strong { font-size: 1rem; }
  .desktop-tools nav span { color: #e3cfc0; font-size: .88rem; line-height: 1.35; }
  .desktop-tools .tools-project { display: inline-flex; align-items: center; gap: 9px; margin-top: 22px; color: #f2cf7e; text-underline-offset: 4px; }

  .site-home .container { max-width: 1400px; padding-inline: clamp(32px, 5vw, 72px); }
  .site-home .cultos-grid:has(> .culto-card) { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
  .site-home .cultos-grid > .culto-card { width: 100%; max-width: none; margin: 0; }
  .site-home .avisos-box { margin-top: 32px; }
  .site-home .footer-inner { max-width: 1320px; }
  .site-home .footer-inner .btn-hero { margin: 0 3px 12px !important; padding-inline: 20px; }

  .site-reader .hi, .site-reader .bg { max-width: 1460px; }
  .site-reader #cv:not(:fullscreen):not(.datashow-fallback) .cvi { max-width: 1160px; }
  .site-reader #cv:not(:fullscreen):not(.datashow-fallback) .car-card { max-width: 1000px; padding-inline: clamp(36px, 5vw, 76px); }

  .site-quiz .game-header, .site-quiz #quiz-root { max-width: 1060px; }
  .site-quiz .q-body { padding: 32px 38px; }
  .site-quiz .q-text { font-size: 1.65rem; }
  .site-quiz .q-opt { font-size: 1.1rem; padding: 16px 18px; }
  .site-quiz .q-start-title { font-size: 2rem; }
  .site-quiz .q-start .q-levels { max-width: 680px; }

  .site-study #presentation:not(:fullscreen):not(.presentation-mode) { max-width: 1260px; }
  .site-study #presentation:not(:fullscreen):not(.presentation-mode) :is(.panel, .slide-nav) { max-width: 1020px; }
  .site-study #presentation:not(:fullscreen):not(.presentation-mode) .slide-content { font-size: 1.17rem; }
  .site-study #presentation:not(:fullscreen):not(.presentation-mode) .slide-title { font-size: 2rem; }
}

.site-home :is(a, button):focus-visible {
  outline: 2px solid #ffe4a6;
  outline-offset: 4px;
}

.site-home .tools-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 18px;
  margin-top: 18px;
}
.site-home .tools-actions .tools-project { margin: 0; }
.site-home .install-app {
  padding: 9px 12px;
  border: 1px solid #bc8e4d90;
  border-radius: 8px;
  color: #ffdb95;
  background: #f2cf7e14;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.site-home .install-app:hover { background: #f2cf7e29; border-color: #ffdb95; }
.site-home .install-app i { margin-inline-end: 5px; }
.site-home .install-help {
  width: min(100% - 32px, 460px);
  max-height: calc(100% - 32px);
  margin: auto;
  padding: clamp(18px, 5vw, 28px);
  border: 1px solid #bc8e4d;
  border-radius: 14px;
  color: #fff5e9;
  background: #221310;
  box-shadow: 0 16px 50px #0008;
}
.site-home .install-help::backdrop { background: #000a; }
.site-home .install-help h2 { font: 700 1.25rem/1.3 var(--font-serif); color: #ffdb95; margin-bottom: 10px; }
.site-home .install-help p { line-height: 1.5; margin-bottom: 14px; }
.site-home .install-help strong { color: #ffdb95; }

.site-home :is(section[id], footer[id]) { scroll-margin-top: 86px; }
.site-home .hero [hidden] { display: none; }
.site-home .next-service {
  display: inline-grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  max-width: 100%;
  padding: 13px 16px;
  border: 1px solid #e4b76b90;
  border-radius: 12px;
  background: #221310;
  color: var(--cream);
  text-align: left;
  text-decoration: none;
}
.site-home .next-service:hover { border-color: #ffdb95; background: #352019; }
.next-service .service-icon, .next-service .service-arrow { color: #ffdb95; font-size: 1.2rem; }
.next-service .service-label {
  display: block;
  margin-bottom: 3px;
  color: #ffdb95;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.next-service strong { display: block; font-size: clamp(1rem, 2vw, 1.3rem); }
.next-service #nextServiceChurch { display: block; color: #f2d9c9; font-size: .89rem; margin-top: 3px; }

@media (max-width: 1099px) {
  .site-home .hero { flex-direction: column; gap: 0; padding-bottom: 32px; }
  .site-home .hero-content { padding: 112px 16px 32px; }
  .site-home .hero-scroll { display: none; }
  .desktop-tools {
    position: relative;
    z-index: 2;
    display: block;
    width: min(100% - 28px, 560px);
    padding: 18px 14px;
    border: 1px solid #bc8e4d70;
    border-radius: 15px;
    background: #170f0c;
  }
  .desktop-tools .tools-kicker { font-size: .73rem; font-weight: 700; color: #efc16b; text-transform: uppercase; letter-spacing: .1em; }
  .desktop-tools h2 { font: 700 clamp(1.05rem, 4vw, 1.45rem)/1.25 var(--font-serif); margin: 5px 0 12px; }
  .desktop-tools nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .desktop-tools nav a {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 48px;
    padding: 9px;
    border: 1px solid #c9a84c44;
    border-radius: 8px;
    color: var(--cream);
    background: #ffffff07;
    font-size: .9rem;
    text-decoration: none;
  }
  .desktop-tools nav a:hover { border-color: #ffdb95; background: #c9a84c16; }
  .desktop-tools nav a span { display: none; }
  .desktop-tools nav i, .desktop-tools .tools-project { color: #f2cf7e; }
  .desktop-tools .tools-project { display: inline-block; margin-top: 15px; text-underline-offset: 3px; }
}

@media (max-width: 420px) {
  .site-home .header-inner { padding-inline: 12px; gap: 12px; }
  .site-home .logo-area { gap: 8px; }
  .site-home .logo-img { width: 44px; height: 44px; }
  .site-home .logo-title { font-size: .91rem; }
  .site-home .logo-sub { font-size: .62rem; }
  .site-home .hero-title { letter-spacing: .02em; }
}
