/* Visual alignment for Chapter 2 pages with the Chapter 1 editorial layout. */
:root{
  --cap2-bg:#FCFCFA;
  --cap2-page:#EDEDED;
  --cap2-text:#2C3E50;
  --cap2-muted:#5D6D7E;
  --cap2-blue:#004B87;
  --cap2-blue-soft:#E8F0FE;
  --cap2-red:#B03A2E;
  --cap2-green:#1A7A4A;
  --cap2-purple:#6D28D9;
  --cap2-border:#DDE3ED;
  --cap2-card:#FFFFFF;
  --cap2-shadow:0 10px 28px rgba(0,0,0,.08);
  --cap2-title:clamp(1.32rem,2.2vw,1.72rem);
  --cap2-subtitle:clamp(.82rem,1.25vw,1rem);
  --cap2-body:clamp(.93rem,1.25vw,1.04rem);
  --cap2-small:clamp(.82rem,1.1vw,.94rem);
  --cap2-card-title:clamp(.96rem,1.35vw,1.08rem);
}

html,
body{
  margin:0!important;
  padding:0!important;
  width:100%!important;
  min-height:100%!important;
  overflow-x:hidden!important;
  background:var(--cap2-page)!important;
  color:var(--cap2-text)!important;
  font-family:"Lora",Georgia,serif!important;
}

body{
  display:flex!important;
  justify-content:center!important;
  align-items:flex-start!important;
  padding:clamp(8px,1.8vw,18px)!important;
}

.page{
  width:min(100%,1280px)!important;
  max-width:1280px!important;
  min-height:min(720px,calc(100vh - 2*clamp(8px,1.8vw,18px)))!important;
  margin:0 auto!important;
  display:flex!important;
  flex-direction:column!important;
  gap:clamp(12px,1.8vw,18px)!important;
  background:var(--cap2-bg)!important;
  border:1px solid rgba(0,0,0,.04)!important;
  box-shadow:var(--cap2-shadow)!important;
  padding:clamp(10px,1.6vw,18px)!important;
  overflow:visible!important;
}

.hero{
  background:#F2F4F7!important;
  border:0!important;
  border-left:5px solid var(--cap2-blue)!important;
  border-radius:6px!important;
  box-shadow:none!important;
  margin:0!important;
}

.hero-inner{
  padding:clamp(10px,1.5vw,15px) clamp(16px,2.4vw,30px)!important;
}

.card{
  background:var(--cap2-card)!important;
  border:1px solid var(--cap2-border)!important;
  border-top:3px solid var(--cap2-blue)!important;
  border-radius:9px!important;
  box-shadow:0 2px 10px rgba(0,0,0,.045)!important;
  padding:clamp(12px,1.8vw,18px)!important;
  min-width:0!important;
  overflow:visible!important;
}

.card.simulator-card{
  border-top-color:var(--cap2-green)!important;
}

.ai-exercise-card,
[data-termo-ai-exercise]{
  border-top:3px solid var(--cap2-purple)!important;
}

.index-back-button{
  width:fit-content!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  text-decoration:none!important;
  font-family:"Inter",sans-serif!important;
  font-size:.78rem!important;
  font-weight:700!important;
  color:var(--cap2-blue)!important;
  background:#EEF3FC!important;
  border:1px solid #C5D8F5!important;
  border-radius:7px!important;
  padding:5px 10px!important;
  margin:0 0 8px!important;
  transition:.18s ease!important;
}

.index-back-button:hover{
  background:#DCEBFF!important;
  transform:translateY(-1px)!important;
}

.chapter-label{
  display:inline-flex!important;
  align-items:center!important;
  align-self:flex-start!important;
  width:fit-content!important;
  gap:8px!important;
  background:var(--cap2-blue-soft)!important;
  color:var(--cap2-blue)!important;
  border-radius:999px!important;
  padding:6px 12px!important;
  font-family:"Inter",sans-serif!important;
  font-size:.8rem!important;
  font-weight:800!important;
  line-height:1.2!important;
  margin:0 0 10px!important;
}

.chapter-title{
  font-family:"Inter",sans-serif!important;
  font-size:var(--cap2-title)!important;
  font-weight:700!important;
  color:var(--cap2-blue)!important;
  line-height:1.18!important;
  letter-spacing:-.01em!important;
  margin:0 0 6px!important;
  text-transform:none!important;
}

.chapter-text,
.body-text,
.highlight,
.warning,
.footer-note,
.definition-item,
.relation-card,
.result-box,
.check-card,
.simulator-card,
.summary-table td,
.process-table td,
p,
li,
td{
  font-family:"Lora",Georgia,serif!important;
  font-size:var(--cap2-body)!important;
  line-height:1.58!important;
  color:var(--cap2-text)!important;
}

.chapter-text p,
.body-text p{
  margin:0 0 .75rem!important;
  text-align:justify!important;
}

.grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,310px),1fr))!important;
  gap:clamp(12px,1.8vw,18px)!important;
  align-items:stretch!important;
  min-width:0!important;
}

.card-title,
.relation-title,
.definition-label{
  font-family:"Inter",sans-serif!important;
  font-size:var(--cap2-card-title)!important;
  font-weight:700!important;
  line-height:1.25!important;
  color:var(--cap2-blue)!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin:0 0 clamp(6px,.9vw,10px)!important;
  letter-spacing:.015em!important;
}

.card-title.green,
.math-box.green,
.relation-card.green{
  color:var(--cap2-green)!important;
  border-color:#A7D7B5!important;
}

.card-title.purple,
.math-box.purple,
.relation-card.purple{
  color:var(--cap2-purple)!important;
  border-color:#DDD6FE!important;
}

.card-title.red,
.math-box.red,
.relation-card.red{
  color:var(--cap2-red)!important;
  border-color:#F2B8B0!important;
}

.highlight,
.footer-note{
  background:var(--cap2-blue-soft)!important;
  border:1px solid #C5D8F5!important;
  border-left:4px solid var(--cap2-blue)!important;
  border-radius:0 8px 8px 0!important;
  padding:clamp(12px,1.6vw,16px)!important;
  margin-top:clamp(10px,1.4vw,16px)!important;
  box-shadow:none!important;
}

.warning{
  background:#FFF8F6!important;
  border:1px solid #F2B8B0!important;
  border-left:4px solid var(--cap2-red)!important;
  border-radius:0 8px 8px 0!important;
  padding:clamp(12px,1.6vw,16px)!important;
  margin-top:clamp(10px,1.4vw,16px)!important;
}

.definition-item,
.relation-card,
.result-box,
.check-card{
  background:#FFFFFF!important;
  border:1px solid var(--cap2-border)!important;
  border-radius:9px!important;
  padding:clamp(12px,1.6vw,16px)!important;
  box-shadow:0 2px 10px rgba(0,0,0,.035)!important;
}

.math-box,
.math,
.math-cell,
.equation,
.formula,
.relation-card{
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
}

.math-box{
  background:#F8F9FA!important;
  border:1px solid #D5D8DC!important;
  border-radius:8px!important;
  border-left:0!important;
  padding:clamp(12px,1.6vw,16px)!important;
  margin:clamp(10px,1.4vw,16px) 0!important;
  text-align:center!important;
  font-size:clamp(.95rem,1.25vw,1.08rem)!important;
  line-height:1.45!important;
}

mjx-container,
.math-box mjx-container,
.relation-card mjx-container,
.summary-table mjx-container,
.process-table mjx-container{
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  white-space:nowrap!important;
}

.table-wrap{
  max-width:100%!important;
  overflow-x:auto!important;
  border-radius:8px!important;
  border:1px solid var(--cap2-border)!important;
}

.process-table,
.summary-table{
  width:100%!important;
  border-collapse:collapse!important;
  font-family:"Inter",sans-serif!important;
  font-size:var(--cap2-small)!important;
}

.process-table{
  min-width:520px!important;
}

.summary-table{
  min-width:880px!important;
}

.process-table th,
.summary-table th{
  background:var(--cap2-blue)!important;
  color:#FFFFFF!important;
  padding:9px 11px!important;
  border:1px solid rgba(255,255,255,.18)!important;
  text-align:left!important;
  font-family:"Inter",sans-serif!important;
  font-size:var(--cap2-small)!important;
  line-height:1.3!important;
}

.process-table td,
.summary-table td{
  padding:9px 11px!important;
  border:1px solid #EEF1F5!important;
  vertical-align:top!important;
}

.process-name,
.summary-table td:first-child{
  color:var(--cap2-blue)!important;
  font-weight:700!important;
  font-family:"Inter",sans-serif!important;
}

.summary-table.microstate-table{
  min-width:0!important;
}

.summary-table.microstate-table td,
.summary-table.microstate-table td:first-child{
  color:var(--cap2-text)!important;
  font-weight:400!important;
  font-family:"Lora",Georgia,serif!important;
}

.summary-table.microstate-table .microstate-total{
  color:var(--cap2-blue)!important;
  font-weight:700!important;
  font-family:"Inter",sans-serif!important;
}

.math-cell{
  background:#F8F9FA!important;
  text-align:center!important;
  font-family:"Lora",Georgia,serif!important;
}

.maxwell-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))!important;
  gap:clamp(10px,1.4vw,14px)!important;
  margin-top:clamp(10px,1.4vw,16px)!important;
}

.rectangle-box{
  max-width:520px!important;
  width:100%!important;
}

.rect-cell{
  border-radius:9px!important;
  font-family:"Inter",sans-serif!important;
}

.simulator-button,
.ai-btn{
  font-family:"Inter",sans-serif!important;
  border-radius:8px!important;
}

img,
svg,
video{
  max-width:100%!important;
  height:auto!important;
}


/* Pin side-by-side content cards to the top when one column grows dynamically. */
.grid,
.maxwell-grid,
.body,
.main-content-layout,
.main-content-wrapper,
.content-main-layout,
.content-grid-container,
.content-columns-wrapper,
.main-content-container,
.content-layout-grid,
.gas-ideal-content-layout,
.content-grid,
.main-grid,
.ai-workspace{
  align-items:start!important;
}

.grid>*,
.maxwell-grid>*,
.body>*,
.main-content-layout>*,
.main-content-wrapper>*,
.content-main-layout>*,
.content-grid-container>*,
.content-columns-wrapper>*,
.main-content-container>*,
.content-layout-grid>*,
.gas-ideal-content-layout>*,
.content-grid>*,
.main-grid>*,
.ai-workspace>*{
  align-self:start!important;
}

.col,.left-column,.right-column,.left-content-column,.right-content-column,.left-theory-column,.right-application-column,.left-explanation-column,.right-formalism-column,.left-column-content,.right-column-content,.content-column-left,.content-column-right,.left-column-theoretical,.right-column-practical,.left-column-textual,.right-column-tabular,.left-derivation-pane,.right-application-pane,.left-column-theory,.right-column-practical,.gas-ideal-left-column,.gas-ideal-right-column,.left-pane,.right-pane{
  justify-content:flex-start!important;
}

.card,
.termo-exercise,
[data-termo-ai-exercise]{
  align-self:flex-start!important;
}

.right-panel{
  align-items:flex-start!important;
}

@media (max-width:900px){
  html,
  body{
    background:var(--cap2-bg)!important;
  }

  body{
    padding:0!important;
  }

  .page{
    width:100%!important;
    max-width:none!important;
    min-height:100vh!important;
    border:0!important;
    box-shadow:none!important;
    padding:10px 12px 18px!important;
  }

  .grid{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }

  .hero-inner,
  .card{
    padding:12px!important;
  }

  .chapter-text p,
  .body-text p,
  .highlight,
  .warning,
  .footer-note,
  li,
  td{
    text-align:left!important;
  }
}

@media (max-width:520px){
  :root{
    --cap2-title:1.22rem;
    --cap2-subtitle:.76rem;
    --cap2-body:.94rem;
    --cap2-card-title:.98rem;
  }

  .page{
    padding:8px 10px 16px!important;
  }

  .chapter-label{
    padding:6px 10px!important;
  }

  .summary-table{
    min-width:760px!important;
  }

  .summary-table.microstate-table{
    min-width:0!important;
  }

  .process-table{
    min-width:440px!important;
  }
}
