/* Gabster · home: evolução compacta, seções 3 a 10 e fundos alternados. */
/* Natural height is retained when zoom or a short viewport needs more space. */
.evolution-section {padding:clamp(32px,4.5svh,48px) 0 12px;scroll-margin-top:-18px}
.evolution-intro {gap:24px;margin-bottom:12px}
.evolution-intro .eyebrow {margin-bottom:8px}
.evolution-intro h2 {font-size:clamp(28px,4.5svh,38px)}
/* The two-tone title breaks at the comma when the line is narrower than the phrase, never mid-phrase. */
.evolution-intro h2>span {display:inline-block}
.evolution-intro>p {font-size:13px;line-height:1.5}
.evolution-section .ev-heading {justify-content:flex-end;border:0;padding:0;margin-bottom:8px}
.evolution-section .ev-heading>p:first-child {display:none}
/* Keep internal timeline references mounted; the simplified home has no lower toolbar. */
.evolution-section .ev-lower,
.evolution-section .ev-scrubber {display:none}
.evolution-section .ev-controls {margin-top:8px;gap:16px}
.evolution-section .ev-phase {min-height:44px;padding:6px 0}
@media(max-width:700px) {
  .evolution-section .ev-controls {grid-template-columns:minmax(0,1fr);row-gap:0}
  .evolution-section .ev-phases {grid-column:1/-1;grid-template-columns:1fr 1.4fr 1fr 1.2fr}
  .evolution-section .ev-phase {min-width:0;font-size:10px;white-space:normal;overflow-wrap:anywhere}
  .evolution-section .ev-play {position:static;justify-self:end;padding:4px 0}
}
.evolution-section .ev-info {min-width:0;display:flex;flex-direction:column;gap:12px}
/* Quadro de mensagem por fase (home-fases.js): um recado ao lado da cena, no tom dos cartões; a seta aponta para a ilustração. */
.fase-mensagem {position:relative;padding:14px 16px 15px;border:1px solid var(--line);border-radius:6px;background:var(--card);box-shadow:var(--shadow)}
.fase-mensagem::before {content:"";position:absolute;width:10px;height:10px;background:var(--card);border:1px solid var(--line);border-width:0 0 1px 1px;transform:rotate(45deg)}
.fase-mensagem-rotulo {display:flex;align-items:center;gap:8px;margin:0 0 7px;font-size:11px;font-weight:600;line-height:1.4;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.fase-mensagem-numero {font-variant-numeric:tabular-nums;color:var(--terra)}
.fase-mensagem-texto {margin:0;font-size:13px;line-height:1.6;color:var(--ink)}
.fase-mensagem.is-trocando .fase-mensagem-rotulo,.fase-mensagem.is-trocando .fase-mensagem-texto {animation:fase-mensagem-entrar 280ms var(--ease) both}
@keyframes fase-mensagem-entrar {from {opacity:0;transform:translateY(4px)} to {opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce) {.fase-mensagem.is-trocando .fase-mensagem-rotulo,.fase-mensagem.is-trocando .fase-mensagem-texto {animation:none}}
.evolution-section .ev-gene-cta {align-self:stretch;gap:12px;min-height:44px;padding:12px 14px;font-size:13px;text-align:center}
.evolution-section .ev-lower {margin-top:0}
.evolution-section-footer {margin-top:8px;padding-top:8px;gap:16px}
.evolution-section-footer .text-link {min-height:44px;display:inline-flex;align-items:center}
@media(min-width:761px) {
  .evolution-section .ev-visual {display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;align-items:center}
  .evolution-section .ev-scene {width:min(100%,calc(clamp(220px,100svh - 300px,560px) * 1456 / 816));justify-self:center}
  .evolution-section .ev-info {min-height:clamp(210px,100svh - 300px,560px)}
  .evolution-section .ev-annotations {position:relative;inset:auto;width:100%;height:auto;flex:1;min-height:0;margin:0;border:0}
  .evolution-section .ev-annotation-layer {display:flex;flex-direction:column;justify-content:center;gap:8px;padding:0 0 24px}
  .evolution-section .ev-annotation-layer.is-visible {position:relative}
  .evolution-section .ev-note {position:relative;inset:auto;width:100%;padding:5px 8px}
  .evolution-section .ev-note-copy {display:grid;grid-template-columns:1fr 1.25fr;gap:0 8px;width:100%}
  .evolution-section .ev-note-area {grid-column:1;grid-row:1}
  .evolution-section .ev-note-title {grid-column:1;grid-row:2}
  .evolution-section .ev-note-detail {grid-column:2;grid-row:1}
  .evolution-section .ev-note-meta {grid-column:2;grid-row:2}
  .evolution-section .ev-trace-route {grid-column:1/-1;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;margin-top:6px}
  .evolution-section .ev-trace-route li {flex-direction:column;align-items:flex-start;gap:3px;overflow-wrap:anywhere}
  .evolution-section .ev-trace-step-state {margin-left:0}
  .evolution-section .ev-note-title {margin-top:2px}
  .evolution-section .ev-note-detail {margin-top:3px}
  .evolution-section .ev-note-meta {margin-top:2px}
  .evolution-section .ev-annotation-disclaimer {left:0;right:auto;bottom:0}
  .evolution-section .ev-annotation-mobile-pins {display:none}
  .fase-mensagem {flex:none;padding-left:18px}
  .fase-mensagem::before {left:-6px;top:19px}
  .fase-mensagem-texto {min-height:calc(5 * 1.6em)}
}
/* Em telas baixas a coluna já é curta: quadro compacto, sem altura reservada. */
@media(min-width:761px) and (max-height:800px) {
  .fase-mensagem {padding:10px 12px 11px 14px}
  .fase-mensagem-rotulo {margin-bottom:4px}
  .fase-mensagem-texto {font-size:12px;line-height:1.5;min-height:0}
}
@media(min-width:761px) and (max-width:1023px) {
  .evolution-section {scroll-margin-top:-28px}
  .evolution-intro {grid-template-columns:1fr;gap:8px}
  .evolution-intro>p {max-width:none}
}
.evolution-section, .hs--light {background-color:var(--paper);background-image:radial-gradient(circle,#192d3826 1px,transparent 1.2px);background-size:24px 24px}
.hs {padding:96px 0}
.hs--dark {background:var(--ink);color:var(--paper)}
.hs--dark h2, .hs--dark h3 {color:var(--paper)}
.hs--dark h2>span {color:#C6BEAD}
.hs h2 {max-width:820px}
.hs-head {display:grid;grid-template-columns:1fr minmax(240px,420px);gap:40px;align-items:end;margin-bottom:44px}
.hs-head>p {font-size:15px;line-height:1.8;color:var(--muted)}
.hs--dark .hs-head>p {color:#C8CEC9}
.hs-grid {list-style:none;margin:0;padding:0;display:grid;gap:16px}
.hs-grid--4 {grid-template-columns:repeat(4,minmax(0,1fr))}
.hs-grid--3 {grid-template-columns:repeat(3,minmax(0,1fr))}
.hs-card {background:var(--card);border:1px solid var(--line);border-radius:6px;padding:26px 24px;display:flex;flex-direction:column;gap:12px}
.hs-card p {font-size:14px;line-height:1.7;color:var(--muted)}
.hs--dark .hs-card {background:var(--ink);border-color:#354650}
.hs--dark .hs-card p {color:#C8CEC9}
.hs-card .text-link {margin-top:auto;align-self:flex-start}
.hs-num {font-size:12px;font-weight:600;letter-spacing:.14em;color:var(--terra)}
.hs-base {margin-top:16px;padding:26px 24px;border:1px dashed var(--ink);border-radius:6px;background:var(--mint-tone);display:grid;grid-template-columns:auto auto 1fr auto;gap:12px 24px;align-items:center}
.hs-base .eyebrow {color:var(--muted);font-size:11px}
.hs-base p:not(.eyebrow) {font-size:14px;color:var(--ink)}
.hs--dark .hs-num {color:var(--mint)}
.hs--dark .hs-base {background:var(--ink);border-color:var(--mint)}
.hs--dark .hs-base .eyebrow,
.hs--dark .hs-base p:not(.eyebrow) {color:#C8CEC9}
.hs-metrics {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin:0}
.hs-metrics>div {border-top:1px solid #ffffff2e;padding-top:22px}
.hs-metrics dt {font-family:var(--font-title);font-weight:700;font-size:clamp(38px,4vw,56px);line-height:1.05;color:var(--mint);letter-spacing:0}
.hs-metrics dd {margin-top:12px;font-size:14px;line-height:1.7;color:#C8CEC9}
.hs--light .hs-metrics {margin-bottom:44px}
.hs--light .hs-metrics>div {border-top-color:var(--line)}
.hs--light .hs-metrics dt {color:var(--ink)}
.hs--light .hs-metrics dd {color:var(--muted)}
.partners-carousel {min-width:0}
.hs-partners-heading {display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin-bottom:20px}
.partners-toggle {min-height:44px;padding:8px 14px;border:1px solid var(--line);border-radius:6px;background:var(--paper);font-size:13px}
.partners-toggle:hover {border-color:var(--ink)}
.partners-viewport {overflow-x:auto;overflow-y:hidden;padding-block:12px;scrollbar-width:thin;scrollbar-color:var(--muted) var(--paper);border-block:1px solid var(--line)}
.partners-track {display:flex;width:max-content}
.hs-partners {display:flex;align-items:center;gap:40px;flex:none;width:max-content;list-style:none;margin:0;padding:0 40px 0 0}
.hs-partners li {display:flex;align-items:center;justify-content:center;flex:0 0 208px;width:208px;height:112px}
.hs-partners img {display:block;width:100%;height:100%;object-fit:contain}
.hs-partners img[alt="Bontempo"] {flex-shrink:0;width:125%;height:auto}
.hs-partners img[alt="SCA"] {width:82%}
.hs-partners img[alt="Pormade Portas"] {width:88%}
.hs-partners li:focus-visible {outline:3px solid var(--terra);outline-offset:-3px}
.partners-carousel.is-animated .partners-viewport {overflow:hidden}
.partners-carousel.is-animated .partners-track {will-change:transform}
.hs-partners[data-partners-copy] {display:none}
.partners-carousel.is-animated [data-partners-copy] {display:flex}
@media(max-width:760px) {
  .hs-partners {gap:24px;padding-right:24px}
  .hs-partners li {flex-basis:168px;width:168px;height:96px}
}
@media(prefers-reduced-motion:reduce) {
  .partners-carousel.is-animated .partners-viewport {overflow-x:auto}
  .partners-carousel .partners-track {transform:none!important;will-change:auto}
  .partners-carousel.is-animated [data-partners-copy] {display:none}
}
.hs-empty {min-height:220px;justify-content:center;align-items:center;border-style:dashed;background:#f8f7f4b3}
.hs-empty p {font-size:12px;font-weight:600;letter-spacing:.08em}
.hs-band {margin-top:16px;min-height:96px;border:1px dashed var(--line);border-radius:6px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 24px;background:#f8f7f4b3}
.hs-band .eyebrow {font-size:11px;color:var(--muted)}
.hs-tag {display:inline-block;font-size:11px;font-weight:400;padding:1px 8px;border-radius:999px;border:1px solid var(--muted);color:var(--muted);white-space:nowrap}
.hs-plan h3 {min-height:52px}
.hs-price {font-family:var(--font-title);font-size:28px!important;font-weight:700;color:var(--ink)!important;line-height:1.2!important}
.hs-price small {display:block;font-family:var(--font-body);font-size:12px;font-weight:400;color:var(--muted)}
.hs-meta {display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px!important}
.hs-plan .button {margin-top:auto;gap:16px;font-size:13px}
.hs-faq-wrap {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:48px}
.hs-faq details {border-top:1px solid #354650}
.hs-faq details:last-child {border-bottom:1px solid #354650}
.hs-faq summary {cursor:pointer;list-style:none;padding:22px 40px 22px 0;position:relative;font-size:17px;font-weight:600}
.hs-faq summary::-webkit-details-marker {display:none}
.hs-faq summary::after {content:"+";position:absolute;right:4px;top:18px;font-size:24px;font-weight:400;color:var(--mint)}
.hs-faq details[open] summary::after {content:"−"}
.hs-faq details p {padding:0 40px 22px 0;color:#C8CEC9;line-height:1.8;font-size:15px}
/* Últimos artigos do blog (seção 10): cartões compostos no servidor; grade 4/2/1 pelas regras de .hs-grid--4. */
.hs-post-intro {display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.hs-post-intro p {font-size:15px;line-height:1.8;color:var(--muted)}
.hs-post {padding:0;gap:0;overflow:hidden}
.hs-post-capa {display:block;aspect-ratio:16/9;background:var(--beige);border-bottom:1px solid var(--line)}
.hs-post-capa img {display:block;width:100%;height:100%;object-fit:cover}
.hs-post-corpo {display:flex;flex-direction:column;flex:1;gap:10px;padding:20px 24px 24px}
.hs-post .hs-post-categoria {font-size:12px;font-weight:600;letter-spacing:.14em;line-height:1.6;text-transform:uppercase;color:var(--terra)}
.hs-post h3 a:hover {color:var(--terra)}
.hs-post .hs-post-resumo {display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.hs-post .hs-meta {margin-top:auto;padding-top:6px;gap:4px 8px}
.hs-post .hs-meta>*+*::before {content:"·";margin-right:8px}
.hs-post-vazio {grid-column:1/-1;font-size:15px;line-height:1.8;color:var(--muted)}
.hs-post-vazio a {border-bottom:1px solid currentColor}
.hs-post-vazio a:hover {color:var(--terra)}
@media(max-width:1000px) {
  .hs-grid--4, .hs-metrics {grid-template-columns:repeat(2,minmax(0,1fr))}
  .hs-base {grid-template-columns:1fr}
  .hs-faq-wrap {grid-template-columns:1fr;gap:24px}
}
@media(max-width:760px) {
  .hs {padding:56px 0}
  .hs-head {grid-template-columns:1fr;gap:16px;margin-bottom:28px}
  .hs-grid--4, .hs-grid--3, .hs-metrics {grid-template-columns:1fr}
  .hs-empty {min-height:140px}
  .hs-plan h3 {min-height:0}
  .hs-band {flex-direction:column;justify-content:center;padding:20px}
  .hs-faq summary {font-size:15px}
  .evolution-section-footer .text-link {white-space:normal}
}
@media(max-width:760px) {
  .evolution-section {padding:32px 0 10px;scroll-margin-top:-28px}
  .evolution-section>.container {width:calc(100% - 32px)}
  .evolution-intro {gap:8px;margin-bottom:10px}
  .evolution-intro .eyebrow {margin-bottom:6px;font-size:9px}
  .evolution-intro h2 {font-size:26px}
  .evolution-intro>p {font-size:12px;line-height:1.45}
  .evolution-section .ev-heading {gap:10px;padding:0;margin-bottom:6px}
  .evolution-section .ev-heading p {font-size:9px}
  .evolution-section .ev-scene {width:100%;margin-inline:auto}
  .evolution-section .ev-annotations {height:auto;min-height:190px;margin-top:6px}
  .evolution-section .ev-annotation-layer {padding-top:0;padding-bottom:20px}
  /* Only the active text sets the height; long labels must not share fixed rows. */
  .evolution-section .ev-annotation-layer.is-visible {position:relative;grid-template-rows:auto}
  .evolution-section .ev-note {padding-block:4px}
  .evolution-section .ev-annotation-mobile-pins {width:100%;left:0;transform:none;bottom:calc(100% + 6px)}
  .evolution-section .ev-controls {grid-template-columns:minmax(0,1fr) auto;gap:8px}
  .evolution-section .ev-play {position:static;padding:0;gap:4px}
  .evolution-section .ev-lower {gap:4px}
  .evolution-section-footer {display:grid;grid-template-columns:1fr 1.7fr;gap:2px 12px;margin-top:6px;padding-top:6px}
  .evolution-section-footer p {grid-column:1/-1;font-size:10px}
  .evolution-section-footer .text-link {font-size:11px;line-height:1.4}
  .evolution-section gabster-evolution[data-information="3"] .ev-annotations {min-height:230px}
  .fase-mensagem {padding:12px 14px 13px}
  .fase-mensagem::before {left:18px;top:-6px;border-width:1px 0 0 1px}
  .fase-mensagem-rotulo {margin-bottom:6px;font-size:10px}
  .fase-mensagem-texto {font-size:12px;line-height:1.55}
}
@media(max-width:320px) {
  .hs-head {grid-template-columns:minmax(0,1fr)}
  .hs-head h2 {min-width:0;overflow-wrap:anywhere}
  /* Inactive annotation layers must not create an empty horizontal scroll area.
     Active text and the scene geometry remain unchanged. */
  .evolution-section .ev-annotation-layer:not(.is-visible) {overflow:clip}
  .evolution-section .ev-note-copy {grid-template-columns:minmax(0,1fr);overflow-wrap:anywhere}
  .evolution-section .ev-note-copy>p {grid-column:1;grid-row:auto}
  .evolution-section .ev-trace-route {grid-template-columns:minmax(0,1fr)}
  .evolution-section .ev-trace-route li {flex-direction:row;flex-wrap:wrap}
}