/*
Theme Name: Ciência Magno
Theme URI: https://cienciamagno.com.br
Author: Ciência Magno
Description: Tema institucional para projetos, experimentos e divulgação científica.
Version: 1.5.0
Requires at least: 6.6
Requires PHP: 8.0
Text Domain: ciencia-magno
*/

:root {
  --cm-navy: #071a33;
  --cm-blue: #0c315d;
  --cm-yellow: #ffc928;
  --cm-cream: #fff9e8;
  --cm-ink: #122033;
  --cm-muted: #5c6878;
  --cm-line: #dfe6ee;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; }
a { text-underline-offset: .18em; }
.wp-site-blocks { padding: 0; }
.wp-site-blocks > * { margin-block-start: 0; }

.cm-header {
  position: sticky;
  top: 0;
  z-index: 20;
  box-shadow: 0 1px 0 rgba(255,255,255,.12);
}
.admin-bar .cm-header { top: 32px; }
.cm-brand { gap: .75rem; }
.cm-brand::before {
  content: "";
  display: block;
  width: 2.15rem;
  height: 2.15rem;
  flex: 0 0 2.15rem;
  border: 3px solid var(--cm-yellow);
  border-radius: 50%;
  box-shadow: inset 0 0 0 5px var(--cm-navy), inset 0 0 0 8px var(--cm-yellow);
  transform: rotate(-12deg);
}
.cm-brand .wp-block-site-title a { text-decoration: none; }
.cm-nav a { text-decoration: none; }
.cm-nav a:hover { color: var(--cm-yellow) !important; }

.cm-hero {
  position: relative;
  overflow: hidden;
  min-height: 36rem;
}
.cm-hero::after {
  content: "";
  position: absolute;
  width: 30rem;
  height: 30rem;
  right: -8rem;
  top: -9rem;
  border: 1px solid rgba(255,201,40,.35);
  border-radius: 50%;
  box-shadow: 0 0 0 3.5rem rgba(255,201,40,.08), 0 0 0 7rem rgba(255,201,40,.04);
  pointer-events: none;
}
.cm-kicker {
  display: inline-flex;
  width: fit-content;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: .78rem;
  font-weight: 700;
}
.cm-card {
  height: 100%;
  border: 1px solid var(--cm-line);
  transition: transform .2s ease, box-shadow .2s ease;
}
.cm-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 44px rgba(7,26,51,.1);
}
.cm-number {
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  color: var(--cm-blue);
}
.cm-footer a { color: inherit; }
.cm-footer a:hover { color: var(--cm-yellow); }

/* Página individual dos projetos científicos. */
.cm-project-page { overflow: hidden; }
.cm-project-hero { position: relative; overflow: hidden; }
.cm-project-hero::after {
  content: "";
  position: absolute;
  width: 24rem;
  height: 24rem;
  right: -8rem;
  top: -10rem;
  border: 1px solid rgba(255,201,40,.32);
  border-radius: 50%;
  box-shadow: 0 0 0 3rem rgba(255,201,40,.07), 0 0 0 6rem rgba(255,201,40,.035);
  pointer-events: none;
}
.cm-project-hero > * { position: relative; z-index: 1; }
.cm-project-title {
  max-width: 24ch;
  margin-top: 1.25rem;
  text-wrap: balance;
}
.cm-project-lead {
  max-width: 760px;
  color: rgba(255,255,255,.82) !important;
}
.cm-project-visual-section {
  background: linear-gradient(to bottom, var(--cm-navy) 0 42%, #fff 42% 100%);
}
.cm-project-featured {
  overflow: hidden;
  border: 8px solid #fff;
  border-radius: 24px;
  box-shadow: 0 24px 70px rgba(7,26,51,.18);
}
.cm-project-featured img {
  display: block;
  width: 100%;
  max-height: 610px;
  aspect-ratio: 16 / 8;
  object-fit: cover;
}
.cm-project-main { background: #fff; }
.cm-project-content-shell { width: 100%; }
.cm-project-main:has(.cm-pv-study) { background: linear-gradient(180deg, #fff 0, var(--cm-cream) 100%); }
.cm-project-content > .wp-block-group {
  width: 100%;
  max-width: none !important;
  border-radius: 22px;
  padding: clamp(1.5rem, 4vw, 3.5rem) !important;
}
.cm-project-content > .wp-block-group:first-child {
  box-shadow: 0 16px 46px rgba(7,26,51,.10);
}
.cm-project-content h2:first-child { margin-top: 0; }
.cm-project-content p { max-width: 78ch; }
.cm-project-card h3 { text-wrap: balance; }

/* Navegação e capítulos dos projetos científicos. */
.cm-project-main { padding-top: 0 !important; }
.cm-project-content-shell { max-width: 1680px !important; }
.cm-project-section-wrap { width: 100%; }
.cm-project-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  width: min(1680px, calc(100% - 2rem));
  margin: -1.65rem auto 0;
  position: relative;
  z-index: 3;
  border: 1px solid var(--cm-line);
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 14px 38px rgba(7,26,51,.12);
}
.cm-project-tabs a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 4.25rem;
  padding: .8rem 1rem;
  color: var(--cm-navy);
  font-weight: 750;
  text-align: center;
  text-decoration: none;
  border-right: 1px solid var(--cm-line);
}
.cm-project-tabs a:last-child { border-right: 0; }
.cm-project-tabs a:hover { background: var(--cm-cream); }
.cm-project-tabs a.is-active {
  color: #fff;
  background: var(--cm-navy);
  box-shadow: inset 0 -4px 0 var(--cm-yellow);
}
.cm-project-section {
  width: min(1680px, 100%);
  margin: 0 auto;
  padding: clamp(2.5rem, 5vw, 5rem) clamp(1rem, 3.6vw, 4rem);
}
.cm-project-section h2 { margin-top: 2.4rem; }
.cm-project-section h2:first-child { margin-top: 0; }
.cm-project-section p,
.cm-project-section li { line-height: 1.72; }
.cm-project-section p { max-width: 88ch; }
.cm-project-intro-grid,
.cm-development-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
}
.cm-project-panel,
.cm-development-card {
  padding: clamp(1.25rem, 2vw, 2rem);
  border: 1px solid var(--cm-line);
  border-radius: 16px;
  background: #fff;
}
.cm-project-question {
  margin: 2rem 0;
  padding: clamp(1.4rem, 3vw, 2.4rem);
  border-left: 5px solid var(--cm-yellow);
  border-radius: 0 16px 16px 0;
  background: var(--cm-cream);
  font-size: clamp(1.2rem, 2.2vw, 1.65rem);
  font-weight: 700;
}
.cm-paper-head { padding-bottom: 2rem; border-bottom: 1px solid var(--cm-line); }
.cm-paper-status { color: var(--cm-blue); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; font-size: .76rem; }
.cm-paper-layout { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); margin-top: 2rem; }
.cm-paper-index { align-self: start; position: sticky; top: 7rem; padding: 1.25rem; border: 1px solid var(--cm-line); border-radius: 14px; background: #fff; }
.cm-paper-index strong { display: block; margin-bottom: .65rem; }
.cm-paper-index a { display: block; padding: .42rem 0; color: var(--cm-blue); text-decoration: none; }
.cm-paper-body { min-width: 0; }
.cm-paper-body section { scroll-margin-top: 7rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--cm-line); }
.cm-paper-body section:last-child { border-bottom: 0; }
.cm-paper-placeholder { padding: 1.15rem; border: 1px dashed #aebccc; border-radius: 12px; color: var(--cm-muted); background: #f8fafc; }
.cm-data-intro { margin-bottom: 1.5rem; }
.cm-data-dashboard { width: 100%; }

/* Páginas principais: Projetos, Artigos, Sobre e Contato. */
.cm-landing-hero {
  position: relative;
  overflow: hidden;
}
.cm-landing-hero::after {
  content: "";
  position: absolute;
  width: 21rem;
  height: 21rem;
  right: -6rem;
  bottom: -13rem;
  border: 1px solid rgba(255,201,40,.3);
  border-radius: 50%;
  box-shadow: 0 0 0 2.7rem rgba(255,201,40,.06), 0 0 0 5.4rem rgba(255,201,40,.03);
  pointer-events: none;
}
.cm-landing-hero > * { position: relative; z-index: 1; }
.cm-landing-title {
  margin-top: 1.1rem;
  max-width: 18ch;
}
.cm-landing-lead {
  max-width: 760px;
  color: rgba(255,255,255,.82) !important;
}
.cm-landing-body { min-height: 24rem; }
.cm-landing-content > h2:first-child,
.cm-landing-content > h3:first-child,
.cm-landing-content > p:first-child { margin-top: 0; }
.cm-landing-content .wp-block-button__link { text-decoration: none; }
.cm-page-artigos .cm-landing-body,
.cm-page-projetos .cm-landing-body { background: var(--cm-cream); }
.cm-page-artigos .cm-landing-body,
.cm-page-projetos .cm-landing-body {
  min-height: 27rem;
  padding-top: 2.25rem !important;
  padding-bottom: 3.25rem !important;
}
.cm-page-artigos .cm-landing-body > *,
.cm-page-projetos .cm-landing-body > * {
  width: 100%;
  max-width: 1040px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.cm-page-artigos .cm-landing-hero {
  padding-top: 3.5rem !important;
  padding-bottom: 3rem !important;
}
.cm-page-artigos .cm-landing-title {
  font-size: clamp(2rem, 4vw, 3.1rem) !important;
}
.cm-page-artigos .cm-landing-lead {
  max-width: 680px;
  font-size: clamp(1.05rem, 2vw, 1.22rem) !important;
}
.cm-page-projetos .cm-landing-hero {
  padding-top: 3.5rem !important;
  padding-bottom: 3rem !important;
}
.cm-page-projetos .cm-landing-title {
  font-size: clamp(2rem, 4vw, 3.1rem) !important;
}
.cm-page-projetos .cm-landing-lead {
  max-width: 680px;
  font-size: clamp(1.05rem, 2vw, 1.22rem) !important;
}
.cm-page-sobre .cm-landing-body,
.cm-page-contato .cm-landing-body { background: #fff; }
.cm-page-contato .cm-landing-content {
  padding: clamp(1.5rem, 4vw, 3.5rem);
  border: 1px solid var(--cm-line);
  border-radius: 22px;
  box-shadow: 0 16px 46px rgba(7,26,51,.08);
}

@media (max-width: 782px) {
  .admin-bar .cm-header { top: 46px; }
  .cm-hero { min-height: auto; }
  .cm-hero::after { width: 18rem; height: 18rem; right: -9rem; }
  .cm-project-title { max-width: none; }
  .cm-project-hero::after { width: 17rem; height: 17rem; right: -9rem; }
  .cm-project-featured { border-width: 5px; border-radius: 16px; }
  .cm-project-featured img { aspect-ratio: 4 / 3; }
  .cm-project-content > .wp-block-group { border-radius: 16px; }
  .cm-landing-title { max-width: none; }
  .cm-landing-hero::after { right: -11rem; }
  .cm-page-contato .cm-landing-content { border-radius: 16px; }
  .cm-project-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: -1rem; }
  .cm-project-tabs a:nth-child(2) { border-right: 0; }
  .cm-project-tabs a:nth-child(-n+2) { border-bottom: 1px solid var(--cm-line); }
  .cm-project-intro-grid, .cm-development-grid, .cm-paper-layout { grid-template-columns: 1fr; }
  .cm-paper-index { position: static; }
}