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

:root {
  --bg: #030507;
  --panel: #0b0d10;
  --ink: #f6f7f8;
  --muted: #c4c7cc;
  --cyan: #22d7f2;
  --aqua: #1ff0c0;
  --blue: #268bf2;
  --purple: #7a24f7;
  --pink: #cf2adc;
  --page: 1120px;
  --radius: 24px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background: var(--bg);
}

body {
  margin: 0;
  min-width: 320px;
  background: var(--bg);
  color: var(--ink);
  font-family: "Poppins", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.55;
  overflow-x: hidden;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

button,
input,
textarea {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

button {
  color: inherit;
}

a {
  color: inherit;
  text-decoration: none;
}

img,
video,
svg {
  display: block;
  max-width: 100%;
}

::selection {
  background: rgba(31, 240, 192, 0.8);
  color: #021014;
}

.site-shell {
  position: relative;
  isolation: isolate;
  background: #020304;
  overflow: clip;
}

.page-width {
  width: min(var(--page), calc(100% - 64px));
  margin-inline: auto;
}

.section-anchor {
  scroll-margin-top: 80px;
}

.overlap-section {
  position: relative;
  z-index: 2;
}

/* ---------- navigation ---------- */
.topbar {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  height: 88px;
  transition: background 350ms ease, border-color 350ms ease, backdrop-filter 350ms ease;
  border-bottom: 1px solid transparent;
}

.topbar.is-scrolled {
  background: rgba(2, 5, 10, 0.78);
  border-color: rgba(75, 210, 238, 0.14);
  backdrop-filter: blur(18px) saturate(135%);
}

.topbar__inner {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.brand-button {
  border: 0;
  background: transparent;
  padding: 0;
  width: 104px;
  cursor: pointer;
  transition: transform 260ms ease, filter 260ms ease;
}

.brand-button:hover {
  transform: translateY(-2px) scale(1.03);
  filter: drop-shadow(0 0 16px rgba(36, 212, 242, 0.28));
}

.desktop-nav {
  display: flex;
  align-items: center;
  gap: 22px;
}

.desktop-nav button {
  position: relative;
  padding: 12px 0;
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.82);
  font-size: 11px;
  font-weight: 500;
  cursor: pointer;
  transition: color 220ms ease;
}

.desktop-nav button::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 4px;
  width: 0;
  height: 1px;
  background: linear-gradient(90deg, var(--cyan), var(--aqua));
  transform: translateX(-50%);
  transition: width 260ms ease;
}

.desktop-nav button:hover,
.desktop-nav button.is-active {
  color: white;
}

.desktop-nav button:hover::after,
.desktop-nav button.is-active::after {
  width: 100%;
}

.menu-toggle,
.mobile-menu {
  display: none;
}

/* ---------- shared text ---------- */
h1,
h2,
h3,
h4,
p {
  margin-top: 0;
}

h1,
h2,
.section-title {
  letter-spacing: -0.038em;
}

h2 {
  margin-bottom: 18px;
  color: var(--cyan);
  font-size: clamp(30px, 2.25vw, 38px);
  line-height: 1.05;
  font-weight: 700;
}

p {
  color: rgba(255, 255, 255, 0.88);
}

strong,
b {
  font-weight: 700;
}

.gradient-button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 28px;
  overflow: hidden;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(100deg, #17e8b7 0%, #17eec3 48%, #23d7f4 100%);
  color: #03151a;
  font-size: 12px;
  line-height: 1;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(19, 226, 194, 0.14);
  transition: transform 220ms ease, box-shadow 220ms ease, filter 220ms ease;
}

.gradient-button::before {
  content: "";
  position: absolute;
  inset: -2px;
  background: linear-gradient(110deg, transparent 0 34%, rgba(255,255,255,.72) 47%, transparent 60%);
  transform: translateX(-140%);
  transition: transform 650ms cubic-bezier(.2,.75,.2,1);
}

.gradient-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(19, 226, 194, 0.25);
  filter: saturate(1.12);
}

.gradient-button:hover::before {
  transform: translateX(140%);
}

.gradient-button > span {
  position: relative;
  z-index: 1;
}

.gradient-button:focus-visible,
.desktop-nav button:focus-visible,
.menu-toggle:focus-visible,
.clients-carousel > button:focus-visible,
.brand-button:focus-visible,
.footer button:focus-visible,
.footer a:focus-visible {
  outline: 2px solid var(--aqua);
  outline-offset: 4px;
}

/* ---------- reveal animation ---------- */
.reveal {
  --reveal-delay: 0ms;
  opacity: 0;
  transform: translate3d(0, 34px, 0) scale(0.992);
  filter: blur(4px);
  transition:
    opacity 760ms cubic-bezier(.2,.75,.2,1) var(--reveal-delay),
    transform 760ms cubic-bezier(.2,.75,.2,1) var(--reveal-delay),
    filter 760ms ease var(--reveal-delay);
}

.reveal.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
  filter: blur(0);
}

/* ---------- hero ---------- */
.hero {
  position: relative;
  z-index: 1;
  height: 840px;
  min-height: 680px;
  background: #071024;
  overflow: hidden;
}

.hero__video,
.contact__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero__video {
  object-position: center center;
  transform: scale(1.018);
  animation: heroBreath 12s ease-in-out infinite alternate;
}

@keyframes heroBreath {
  from { transform: scale(1.018); }
  to { transform: scale(1.055); }
}

.hero__scrim {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 18% 52%, rgba(11, 22, 64, .08), rgba(5, 11, 28, .3) 38%, transparent 62%),
    linear-gradient(90deg, rgba(2, 9, 27, .6) 0%, rgba(2, 9, 27, .24) 45%, rgba(3, 9, 23, .03) 72%),
    linear-gradient(180deg, rgba(2, 6, 15, .15) 0%, rgba(2, 5, 12, .08) 65%, #10001d 100%);
}

.hero__particles {
  position: absolute;
  inset: 0 45% 0 0;
  opacity: .5;
  background-image:
    radial-gradient(circle, rgba(39, 222, 244, .62) 0 1px, transparent 1.8px),
    radial-gradient(circle, rgba(158, 78, 255, .45) 0 1px, transparent 1.8px);
  background-size: 68px 68px, 94px 94px;
  background-position: 12px 30px, 40px 10px;
  mask-image: linear-gradient(90deg, transparent, #000 40%, transparent 92%);
  animation: particleDrift 22s linear infinite;
}

@keyframes particleDrift {
  to { background-position: 148px 98px, -148px 104px; }
}

.hero__content {
  position: relative;
  z-index: 3;
  height: 100%;
  display: flex;
  align-items: flex-start;
  padding-top: 260px;
}

.hero-copy {
  width: 560px;
}

.hero h1 {
  margin-bottom: 18px;
  color: #24ddf0;
  font-size: 45px;
  line-height: .98;
  font-weight: 700;
  text-shadow: 0 0 24px rgba(24, 203, 245, .08);
}

.hero p {
  width: 530px;
  margin-bottom: 28px;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 400;
}

.hero__bottom-fade {
  position: absolute;
  inset: auto 0 0;
  height: 230px;
  background: linear-gradient(180deg, transparent 0%, rgba(64,0,120,.15) 45%, #160023 100%);
  pointer-events: none;
}

/* ---------- origin ---------- */
.origin {
  height: 846px;
  margin-top: -370px;
  padding-top: 138px;
  overflow: hidden;
}

.origin__background,
.solutions__background,
.differences__background,
.proof__background,
.makers__background,
.ecosystem__background,
.blog__background {
  position: absolute;
  inset: 0;
  z-index: -2;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
}

.origin__background {
  background-image: url('assets/session2/bg-s2.png');
}

.origin__grid {
  display: grid;
  grid-template-columns: 470px 1fr;
  gap: 70px;
  align-items: start;
  height: 100%;
  padding-bottom: 100px;
}

.origin__visual {
  align-self: end;
  height: 610px;
}

.lighthouse-wrap {
  position: relative;
  height: 100%;
}

.lighthouse {
  position: absolute;
  left: -60px;
  bottom: -20px;
  width: 460px;
  animation: lighthouseFloat 6s ease-in-out infinite;
  filter: drop-shadow(0 0 24px rgba(32, 197, 244, .18));
}

.lighthouse-glow {
  position: absolute;
  left: -12px;
  bottom: 68px;
  width: 510px;
  opacity: .76;
  mix-blend-mode: screen;
  animation: glowPulse 3.8s ease-in-out infinite alternate;
}

.kronberg-origin-logo {
  position: absolute;
  left: 225px;
  top: 245px;
  width: 210px;
  filter: drop-shadow(0 2px 12px rgba(0, 0, 0, .6));
}

@keyframes lighthouseFloat {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

@keyframes glowPulse {
  from { opacity: .45; transform: scale(.98); }
  to { opacity: .92; transform: scale(1.03); }
}

.origin__copy {
  align-self: start;
  padding-top: 35px;
}

.origin__copy h2 {
  font-size: 39px;
  margin-bottom: 32px;
}

.origin__copy p {
  max-width: 620px;
  margin-bottom: 20px;
  font-size: 15px;
  line-height: 1.62;
}

/* ---------- solutions ---------- */
.solutions {
  height: 1468px;
  margin-top: -244px;
  padding-top: 115px;
  overflow: hidden;
}

.solutions__background {
  background-image: url('assets/session3/BG_session3.png');
}

.solutions__content h2 {
  font-size: 36px;
  margin-bottom: 18px;
}

.solutions__intro {
  max-width: 1110px;
  margin-bottom: 16px;
  font-size: 15px;
}

.solutions__intro--strong {
  margin-bottom: 28px;
}

.solutions-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  perspective: 1200px;
}

.solution-card {
  --tilt-x: 0deg;
  --tilt-y: 0deg;
  --mouse-x: 50%;
  --mouse-y: 50%;
  position: relative;
  height: 535px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  transform: rotateX(var(--tilt-x)) rotateY(var(--tilt-y));
  transform-style: preserve-3d;
  transition: transform 180ms ease, filter 280ms ease;
  will-change: transform;
}

.solution-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.10) 45%, rgba(0,0,0,.32));
}

.solution-card__glow {
  position: absolute;
  inset: 0;
  opacity: 0;
  background: radial-gradient(circle at var(--mouse-x) var(--mouse-y), rgba(255,255,255,.22), transparent 32%);
  transition: opacity 260ms ease;
  mix-blend-mode: screen;
}

.solution-card:hover {
  filter: brightness(1.07) saturate(1.05);
}

.solution-card:hover .solution-card__glow {
  opacity: 1;
}

.solution-card__content {
  position: absolute;
  inset: auto 42px 48px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  transform: translateZ(28px);
}

.solution-logo {
  width: auto;
  max-width: 205px;
  max-height: 82px;
  margin-bottom: 24px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

.solution-card--cyan .solution-logo {
  max-height: 96px;
  margin-bottom: 10px;
}

.solution-card p {
  max-width: 405px;
  min-height: 70px;
  margin-bottom: 20px;
  font-size: 13px;
  line-height: 1.48;
}

.solution-card .gradient-button {
  min-width: 245px;
  min-height: 40px;
  font-size: 11px;
}

/* ---------- differences ---------- */
.differences {
  height: 850px;
  margin-top: 28px;
  overflow: hidden;
}

.differences__background {
  background-image: url('assets/session4/bg_session4.png');
}

.differences__grid {
  display: grid;
  grid-template-columns: 47% 53%;
  height: 100%;
  align-items: start;
}

.differences__person {
  position: relative;
  align-self: end;
  height: 760px;
}

.differences__person img {
  position: absolute;
  left: -160px;
  bottom: -7px;
  width: 680px;
  max-width: none;
  filter: drop-shadow(24px 20px 40px rgba(0,0,0,.28));
  transition: transform 700ms cubic-bezier(.2,.75,.2,1);
}

.differences:hover .differences__person img {
  transform: translateX(8px) scale(1.008);
}

.differences__copy {
  padding: 65px 0 0 40px;
}

.differences__copy h2 {
  font-size: 39px;
}

.differences__copy > p {
  max-width: 560px;
  margin-bottom: 26px;
  font-size: 14px;
}

.difference-list {
  width: 100%;
  max-width: 560px;
  display: grid;
  gap: 11px;
}

.difference-list__header,
.difference-pill {
  min-height: 43px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 12px;
}

.difference-list__header {
  position: relative;
  overflow: hidden;
  background: linear-gradient(90deg, #7434f5 0%, #8a26e8 48%, #21e5c7 100%);
  color: white;
  font-weight: 700;
  box-shadow: 0 12px 34px rgba(84, 39, 210, .22);
}

.difference-list__header::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
  transform: translateX(-120%);
  animation: differenceSweep 4.5s ease-in-out infinite;
}

@keyframes differenceSweep {
  0%, 55% { transform: translateX(-120%); }
  75%, 100% { transform: translateX(120%); }
}

.difference-pill {
  justify-content: flex-start;
  padding-inline: 24px;
  border: 1px solid rgba(255, 255, 255, .16);
  color: rgba(255,255,255,.88);
  background: rgba(5, 8, 17, .12);
  backdrop-filter: blur(4px);
  transition: transform 220ms ease, border-color 220ms ease, background 220ms ease, color 220ms ease;
}

.difference-pill:hover {
  transform: translateX(8px);
  color: white;
  border-color: rgba(40, 222, 235, .45);
  background: rgba(20, 48, 65, .28);
}

/* ---------- proof ---------- */
.proof {
  height: 1416px;
  margin-top: -28px;
  padding-top: 55px;
  overflow: hidden;
}

.proof__background {
  background-image: url('assets/session5/bg_session5.png');
}

.proof__content > .reveal > h2,
.proof h3 {
  text-align: center;
}

.proof h2 {
  margin-bottom: 40px;
  font-size: 34px;
}

.clients-carousel {
  display: grid;
  grid-template-columns: 42px 1fr 42px;
  align-items: center;
  gap: 18px;
  margin-bottom: 62px;
}

.clients-carousel > button {
  border: 0;
  background: transparent;
  color: #0ecfe9;
  font-size: 42px;
  line-height: 1;
  cursor: pointer;
  opacity: .7;
  transition: opacity 220ms ease, transform 220ms ease;
}

.clients-carousel > button:hover {
  opacity: 1;
  transform: scale(1.15);
}

.client-logos {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 18px;
  align-items: center;
}

.client-logo {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #f0f0f1;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.04), 0 12px 34px rgba(0,0,0,.18);
  overflow: hidden;
  animation: logoPop 460ms cubic-bezier(.2,.75,.2,1) both;
}

@keyframes logoPop {
  from { opacity: .3; transform: scale(.86); }
  to { opacity: 1; transform: scale(1); }
}

.client-logo__shine {
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.9) 50%, transparent 70%);
  transform: translateX(-120%);
  animation: logoShine 6s ease-in-out infinite;
}

@keyframes logoShine {
  0%, 55% { transform: translateX(-120%); }
  75%, 100% { transform: translateX(120%); }
}

.proof h3 {
  margin-bottom: 30px;
  color: var(--cyan);
  font-size: 31px;
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: -0.035em;
}

.numbers-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  max-width: 760px;
  margin: 0 auto 72px;
}

.numbers-grid > div {
  display: grid;
  text-align: center;
}

.numbers-grid strong {
  color: #7f39ff;
  font-size: 37px;
  line-height: 1;
  font-weight: 700;
  text-shadow: 0 0 22px rgba(115, 54, 255, .22);
}

.numbers-grid span {
  margin-top: 8px;
  color: rgba(255,255,255,.9);
  font-size: 12px;
}

.testimonial-area {
  text-align: center;
}

.testimonial-grid {
  display: flex;
  justify-content: center;
  gap: 70px;
  margin: 36px 0 42px;
}

.testimonial-card {
  width: 225px;
  text-align: center;
}

.testimonial-cover {
  position: relative;
  width: 184px;
  height: 328px;
  margin: 0 auto 18px;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 22px 58px rgba(0,0,0,.36);
  transition: transform 300ms ease, box-shadow 300ms ease;
}

.testimonial-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 55%, rgba(0,0,0,.16));
  pointer-events: none;
}

.testimonial-cover:hover {
  transform: translateY(-7px) scale(1.015);
  box-shadow: 0 28px 68px rgba(0,0,0,.46);
}

.testimonial-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.play-glyph {
  position: absolute;
  z-index: 2;
  left: 50%;
  top: 50%;
  width: 56px;
  transform: translate(-50%, -50%);
  filter: drop-shadow(0 8px 18px rgba(0,0,0,.25));
  transition: transform 220ms ease;
}

.testimonial-cover:hover .play-glyph {
  transform: translate(-50%, -50%) scale(1.12);
}

.testimonial-card > strong {
  display: block;
  font-size: 13px;
}

.testimonial-card > span {
  display: block;
  margin-top: 2px;
  color: rgba(255,255,255,.8);
  font-size: 10px;
}

/* ---------- makers ---------- */
.makers {
  height: 846px;
  margin-top: -4px;
  padding-top: 62px;
  overflow: hidden;
}

.makers__background {
  background-image: url('assets/session6/bg_session6.png');
}

.makers__content {
  position: relative;
  z-index: 2;
}

.makers h2 {
  margin-bottom: 34px;
  text-align: center;
  font-size: 34px;
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.team-card {
  height: 515px;
  overflow: hidden;
  background: #25a8da;
  color: #041019;
  box-shadow: 0 16px 44px rgba(0,0,0,.26);
  transition: transform 280ms ease, box-shadow 280ms ease;
}

.team-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 24px 60px rgba(0,0,0,.38);
}

.team-card__photo {
  position: relative;
  height: 275px;
  overflow: hidden;
  background: #10161b;
}

.team-card__photo::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 60px;
  background: linear-gradient(transparent, rgba(27,167,216,.45));
}

.team-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 550ms cubic-bezier(.2,.75,.2,1);
}

.team-card:hover .team-card__photo img {
  transform: scale(1.045);
}

.team-card__body {
  padding: 14px 17px 18px;
  text-align: center;
}

.team-card__body h3 {
  margin-bottom: 8px;
  font-size: 14px;
  line-height: 1.1;
  font-weight: 700;
}

.team-card__body p {
  margin-bottom: 10px;
  color: #041019;
  font-size: 10px;
  line-height: 1.42;
}

.makers__wave {
  position: absolute;
  z-index: 1;
  width: 620px;
  height: 100px;
  top: 335px;
  border-radius: 50%;
  filter: blur(18px);
  opacity: .25;
  pointer-events: none;
}

.makers__wave--left {
  left: -260px;
  background: radial-gradient(ellipse, rgba(21, 217, 251, .9), transparent 67%);
}

.makers__wave--right {
  right: -300px;
  background: radial-gradient(ellipse, rgba(33, 104, 255, .9), transparent 67%);
}

/* ---------- ecosystem ---------- */
.ecosystem {
  height: 757px;
  margin-top: -10px;
  padding-top: 45px;
  overflow: hidden;
}

.ecosystem__background {
  background-image: url('assets/session7/bg_session7.png');
}

.ecosystem h2 {
  margin-bottom: 28px;
  text-align: center;
  font-size: 34px;
}

.ecosystem-grid {
  display: grid;
  grid-template-columns: repeat(3, 363px);
  justify-content: center;
  gap: 15px;
}

.ecosystem-card {
  position: relative;
  height: 560px;
  background-size: cover;
  background-position: center;
  overflow: hidden;
  box-shadow: 0 18px 46px rgba(0,0,0,.28);
  transition: transform 280ms ease, box-shadow 280ms ease;
}

.ecosystem-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 28px 64px rgba(0,0,0,.4);
}

.ecosystem-card__veil {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(2,7,14,.08), rgba(2,7,14,.32));
  transition: background 300ms ease;
}

.ecosystem-card:hover .ecosystem-card__veil {
  background: linear-gradient(180deg, rgba(2,7,14,0), rgba(2,7,14,.2));
}

.ecosystem-card__content {
  position: relative;
  z-index: 1;
  height: 100%;
  padding: 72px 33px 34px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.ecosystem-card__content > img {
  width: auto;
  max-width: 185px;
  height: 38px;
  object-fit: contain;
  margin-bottom: 38px;
}

.ecosystem-card__content p {
  flex: 1;
  white-space: pre-line;
  margin-bottom: 20px;
  font-size: 12px;
  line-height: 1.5;
}

.ecosystem-card .gradient-button {
  min-width: 210px;
  padding-inline: 20px;
  font-size: 11px;
}

/* ---------- blog ---------- */
.blog {
  height: 717px;
  margin-top: -5px;
  padding-top: 60px;
  overflow: hidden;
}

.blog__background {
  background-image: url('assets/session8/bg_session8.png');
}

.blog h2 {
  margin-bottom: 1px;
  font-size: 34px;
}

.blog h3 {
  margin-bottom: 14px;
  color: #1de6c9;
  font-size: 18px;
  font-weight: 700;
}

.blog__content > .reveal > p {
  margin-bottom: 40px;
  font-size: 13px;
}

.blog-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 13px;
}

.blog-card {
  height: 390px;
  border-radius: 28px;
  background: #222321;
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(0,0,0,.28);
  transition: transform 260ms ease, box-shadow 260ms ease;
}

.blog-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 26px 66px rgba(0,0,0,.42);
}

.blog-card__cover {
  height: 160px;
  background: #fbfbfb;
  overflow: hidden;
}

.blog-card__cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 450ms cubic-bezier(.2,.75,.2,1);
}

.blog-card:hover .blog-card__cover img {
  transform: scale(1.05);
}

.blog-card__body {
  display: flex;
  height: calc(100% - 160px);
  flex-direction: column;
  align-items: flex-start;
  padding: 16px 17px 18px;
}

.blog-card h4 {
  margin-bottom: 4px;
  color: #1debd1;
  font-size: 12px;
  font-weight: 700;
}

.blog-card p {
  flex: 1;
  margin-bottom: 12px;
  color: white;
  font-size: 11px;
  line-height: 1.45;
}

.gradient-button--link {
  min-height: 35px;
  min-width: 100px;
  padding-inline: 20px;
  font-size: 10px;
}

/* ---------- contact ---------- */
.contact {
  position: relative;
  z-index: 2;
  height: 990px;
  margin-top: -9px;
  overflow: hidden;
  background: #020302;
}

.contact__video {
  object-position: center center;
}

.contact__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(1,2,4,.1), rgba(1,2,3,.3)),
    radial-gradient(circle at 65% 48%, transparent 0 30%, rgba(0,0,0,.08) 70%);
}

.contact__grid {
  position: relative;
  z-index: 2;
  height: 100%;
  display: grid;
  grid-template-columns: 1fr 520px;
  gap: 100px;
  align-items: start;
  padding-top: 74px;
}

.contact__copy {
  max-width: 520px;
}

.contact__copy h2 {
  margin-bottom: 22px;
  font-size: 44px;
}

.contact__copy p {
  max-width: 480px;
  font-size: 14px;
  line-height: 1.62;
}

.contact-card {
  padding: 43px 56px 42px;
  border-radius: 34px;
  background: rgba(23,23,24,.82);
  box-shadow: 0 30px 80px rgba(0,0,0,.32);
  backdrop-filter: blur(7px);
}

.contact-card h3 {
  margin-bottom: 34px;
  color: #27a8dd;
  font-size: 25px;
  font-weight: 700;
  text-align: center;
}

.contact-card form {
  display: grid;
  gap: 20px;
}

.contact-card input,
.contact-card textarea {
  width: 100%;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 18px;
  background: rgba(4,4,5,.32);
  color: white;
  outline: 0;
  transition: border-color 220ms ease, box-shadow 220ms ease, background 220ms ease;
}

.contact-card input {
  height: 48px;
  padding: 0 18px;
}

.contact-card textarea {
  min-height: 146px;
  padding: 15px 18px;
  resize: vertical;
}

.contact-card input::placeholder,
.contact-card textarea::placeholder {
  color: rgba(255,255,255,.35);
}

.contact-card input:focus,
.contact-card textarea:focus {
  border-color: rgba(38,215,242,.75);
  background: rgba(5,10,14,.54);
  box-shadow: 0 0 0 4px rgba(38,215,242,.06);
}

.submit-button {
  min-width: 225px;
  justify-self: center;
  margin-top: 2px;
}

.submit-button:disabled {
  opacity: .55;
  cursor: wait;
  transform: none;
}

.form-feedback {
  min-height: 20px;
  margin-top: -8px;
  color: rgba(255,255,255,.72);
  font-size: 11px;
  text-align: center;
}

/* ---------- footer ---------- */
.footer {
  position: relative;
  z-index: 3;
  height: 411px;
  margin-top: -1px;
  background: #141516;
}

.footer__accent {
  height: 7px;
  background: linear-gradient(90deg, #20d6ee 0%, #21ece1 54%, #25d4f0 100%);
  box-shadow: 0 -8px 24px rgba(31,221,235,.12);
}

.footer__grid {
  position: relative;
  height: calc(100% - 7px);
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: start;
  padding-top: 72px;
}

.footer__left > img {
  width: 100px;
  margin-bottom: 22px;
  filter: grayscale(1) brightness(4);
}

.footer__left nav {
  display: grid;
  gap: 4px;
}

.footer__left button {
  width: max-content;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(255,255,255,.82);
  font-size: 10px;
  cursor: pointer;
  transition: color 180ms ease, transform 180ms ease;
}

.footer__left button:hover {
  color: var(--aqua);
  transform: translateX(4px);
}

.footer__right {
  justify-self: end;
  display: grid;
  justify-items: end;
  padding-top: 46px;
}

.footer__right > img {
  width: 150px;
  margin-bottom: 14px;
  filter: brightness(0) invert(1);
}

.socials {
  display: flex;
  gap: 10px;
}

.social-icon {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  color: white;
  transition: color 180ms ease, transform 180ms ease;
}

.social-icon:hover {
  color: var(--aqua);
  transform: translateY(-2px);
}

.social-icon svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.social-icon svg .fill {
  fill: currentColor;
  stroke: none;
}

.footer__legal {
  position: absolute;
  left: 50%;
  bottom: 42px;
  display: grid;
  justify-items: center;
  transform: translateX(-50%);
  color: rgba(255,255,255,.72);
  font-size: 9px;
  white-space: nowrap;
}

.footer__legal a:hover {
  color: var(--aqua);
}

/* ---------- desktop fit refinements ---------- */
@media (min-width: 1200px) and (max-width: 1499px) {
  :root { --page: 1120px; }
}

@media (min-width: 1500px) {
  .origin__background,
  .solutions__background,
  .differences__background,
  .proof__background,
  .makers__background,
  .ecosystem__background,
  .blog__background {
    background-size: cover;
  }

  .hero__video,
  .contact__video {
    width: 100vw;
  }
}

/* ---------- tablet and mobile ---------- */
@media (max-width: 980px) {
  :root {
    --page: 760px;
  }

  .page-width {
    width: min(var(--page), calc(100% - 40px));
  }

  .topbar {
    height: 72px;
  }

  .desktop-nav {
    display: none;
  }

  .brand-button {
    width: 90px;
  }

  .menu-toggle {
    display: grid;
    width: 44px;
    height: 44px;
    place-content: center;
    gap: 7px;
    border: 0;
    border-radius: 50%;
    background: rgba(6,14,24,.36);
    cursor: pointer;
  }

  .menu-toggle span {
    width: 21px;
    height: 1px;
    background: white;
    transition: transform 260ms ease;
  }

  .menu-toggle.is-open span:first-child {
    transform: translateY(4px) rotate(45deg);
  }

  .menu-toggle.is-open span:last-child {
    transform: translateY(-4px) rotate(-45deg);
  }

  .mobile-menu {
    display: grid;
    position: fixed;
    left: 20px;
    right: 20px;
    top: 78px;
    padding: 18px;
    border: 1px solid rgba(51,214,238,.12);
    border-radius: 22px;
    background: rgba(4,8,15,.94);
    backdrop-filter: blur(20px);
    opacity: 0;
    transform: translateY(-12px) scale(.98);
    pointer-events: none;
    transition: opacity 220ms ease, transform 220ms ease;
  }

  .mobile-menu.is-open {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
  }

  .mobile-menu button {
    padding: 13px 12px;
    border: 0;
    border-bottom: 1px solid rgba(255,255,255,.06);
    background: transparent;
    text-align: left;
    font-size: 14px;
  }

  .mobile-menu button:last-child {
    border-bottom: 0;
  }

  .hero {
    height: 760px;
    min-height: 760px;
  }

  .hero__video {
    object-position: 64% center;
  }

  .hero__scrim {
    background:
      linear-gradient(90deg, rgba(2,7,20,.88) 0%, rgba(2,7,20,.58) 58%, rgba(2,7,20,.2)),
      linear-gradient(180deg, rgba(0,0,0,.04), #130022 100%);
  }

  .hero__content {
    padding-top: 210px;
  }

  .hero-copy {
    width: min(570px, 72%);
  }

  .hero h1 {
    font-size: 40px;
  }

  .hero p {
    width: auto;
    font-size: 15px;
  }

  .origin,
  .solutions,
  .differences,
  .proof,
  .makers,
  .ecosystem,
  .blog,
  .contact,
  .footer {
    height: auto;
    min-height: 0;
  }

  .origin {
    margin-top: -80px;
    padding: 140px 0 130px;
  }

  .origin__background,
  .solutions__background,
  .differences__background,
  .proof__background,
  .makers__background,
  .ecosystem__background,
  .blog__background {
    background-size: cover;
  }

  .origin__grid {
    height: auto;
    grid-template-columns: 40% 60%;
    gap: 24px;
    padding-bottom: 0;
  }

  .origin__visual {
    height: 520px;
  }

  .lighthouse {
    left: -100px;
    width: 430px;
  }

  .lighthouse-glow {
    left: -70px;
    width: 430px;
  }

  .kronberg-origin-logo {
    left: 115px;
    top: 235px;
    width: 170px;
  }

  .origin__copy h2 {
    font-size: 34px;
  }

  .origin__copy p {
    font-size: 13px;
  }

  .solutions {
    margin-top: -70px;
    padding: 150px 0 130px;
  }

  .solutions-grid {
    gap: 12px;
  }

  .solution-card {
    height: 430px;
  }

  .solution-card__content {
    inset: auto 24px 30px;
  }

  .solution-card p {
    font-size: 11px;
  }

  .solution-card .gradient-button {
    min-width: 200px;
    padding-inline: 15px;
    font-size: 9px;
  }

  .differences {
    margin-top: -60px;
    padding: 90px 0 80px;
  }

  .differences__grid {
    height: auto;
    grid-template-columns: 44% 56%;
  }

  .differences__person {
    height: 640px;
  }

  .differences__person img {
    left: -180px;
    width: 620px;
  }

  .differences__copy {
    padding: 20px 0 0 20px;
  }

  .difference-list__header,
  .difference-pill {
    min-height: 38px;
    font-size: 10px;
  }

  .proof {
    margin-top: -50px;
    padding: 190px 0 130px;
  }

  .client-logos {
    gap: 10px;
  }

  .testimonial-grid {
    gap: 40px;
  }

  .makers {
    margin-top: -50px;
    padding: 120px 0 110px;
  }

  .team-card {
    height: 470px;
  }

  .team-card__photo {
    height: 230px;
  }

  .team-card__body p {
    font-size: 8.5px;
  }

  .ecosystem {
    margin-top: -50px;
    padding: 110px 0 120px;
  }

  .ecosystem-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
  }

  .ecosystem-card {
    height: 500px;
  }

  .ecosystem-card__content {
    padding: 50px 20px 28px;
  }

  .ecosystem-card__content p {
    font-size: 10px;
  }

  .ecosystem-card .gradient-button {
    min-width: 170px;
    font-size: 9px;
  }

  .blog {
    margin-top: -40px;
    padding: 100px 0 110px;
  }

  .blog-grid {
    gap: 9px;
  }

  .blog-card {
    height: 360px;
  }

  .blog-card__cover {
    height: 135px;
  }

  .blog-card__body {
    height: calc(100% - 135px);
  }

  .contact {
    margin-top: -30px;
    padding: 160px 0 150px;
  }

  .contact__grid {
    height: auto;
    grid-template-columns: 1fr 1fr;
    gap: 45px;
    padding-top: 0;
  }

  .contact-card {
    padding: 38px 30px;
  }

  .footer {
    padding-bottom: 40px;
  }

  .footer__grid {
    height: auto;
    min-height: 350px;
  }
}

@media (max-width: 720px) {
  body {
    font-size: 15px;
  }

  .page-width {
    width: calc(100% - 36px);
  }

  h2 {
    font-size: 29px;
  }

  .gradient-button {
    min-height: 43px;
    padding-inline: 22px;
    font-size: 11px;
  }

  .hero {
    height: 700px;
    min-height: 700px;
  }

  .hero__video {
    object-position: 68% center;
    filter: brightness(.76) saturate(.9);
  }

  .hero__scrim {
    background:
      linear-gradient(90deg, rgba(3,8,22,.9) 0%, rgba(3,8,22,.62) 66%, rgba(3,8,22,.22)),
      linear-gradient(180deg, rgba(2,4,12,.08), #170025 100%);
  }

  .hero__particles {
    inset: 0 28% 0 0;
    opacity: .28;
  }

  .hero__content {
    padding-top: 185px;
  }

  .hero-copy {
    width: 88%;
  }

  .hero h1 {
    font-size: clamp(32px, 9vw, 40px);
    line-height: 1.02;
  }

  .hero p {
    max-width: 440px;
    font-size: 14px;
  }

  .origin {
    margin-top: -60px;
    padding: 110px 0 90px;
  }

  .origin__grid {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .origin__visual {
    order: 2;
    width: 100%;
    height: 420px;
  }

  .origin__copy {
    order: 1;
    padding-top: 0;
  }

  .origin__copy h2 {
    font-size: 30px;
    margin-bottom: 24px;
  }

  .origin__copy p {
    font-size: 13px;
  }

  .lighthouse {
    left: -45px;
    width: 350px;
  }

  .lighthouse-glow {
    left: -25px;
    bottom: 55px;
    width: 360px;
  }

  .kronberg-origin-logo {
    left: 170px;
    top: 190px;
    width: 150px;
  }

  .solutions {
    margin-top: -35px;
    padding: 90px 0 95px;
  }

  .solutions__content h2 {
    font-size: 30px;
  }

  .solutions__intro {
    font-size: 13px;
  }

  .solutions-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .solution-card {
    height: min(92vw, 520px);
    min-height: 400px;
  }

  .solution-card__content {
    inset: auto 22px 30px;
  }

  .solution-logo {
    max-width: 185px;
  }

  .solution-card p {
    max-width: 380px;
    min-height: 0;
    font-size: 12px;
  }

  .solution-card .gradient-button {
    min-width: 215px;
    font-size: 10px;
  }

  .differences {
    margin-top: -25px;
    padding: 70px 0 90px;
  }

  .differences__grid {
    display: flex;
    flex-direction: column;
  }

  .differences__person {
    order: 2;
    width: 100%;
    height: 460px;
    margin-top: 26px;
  }

  .differences__person img {
    left: 50%;
    width: 500px;
    transform: translateX(-54%);
  }

  .differences:hover .differences__person img {
    transform: translateX(-52%) scale(1.008);
  }

  .differences__copy {
    order: 1;
    width: 100%;
    padding: 0;
  }

  .differences__copy h2 {
    font-size: 30px;
  }

  .difference-list {
    max-width: none;
  }

  .difference-list__header,
  .difference-pill {
    min-height: 44px;
    font-size: 11px;
  }

  .difference-pill {
    padding-inline: 18px;
  }

  .proof {
    margin-top: -25px;
    padding: 110px 0 100px;
  }

  .proof h2 {
    font-size: 28px;
    margin-bottom: 30px;
  }

  .clients-carousel {
    grid-template-columns: 28px 1fr 28px;
    gap: 8px;
    margin-bottom: 48px;
  }

  .client-logos {
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
  }

  .client-logo:nth-child(n+4) {
    display: none;
  }

  .proof h3 {
    font-size: 27px;
  }

  .numbers-grid {
    gap: 8px;
    margin-bottom: 60px;
  }

  .numbers-grid strong {
    font-size: 28px;
  }

  .numbers-grid span {
    font-size: 9px;
  }

  .testimonial-area h3 br {
    display: none;
  }

  .testimonial-grid {
    gap: 18px;
  }

  .testimonial-card {
    width: 50%;
  }

  .testimonial-cover {
    width: min(38vw, 180px);
    height: auto;
    aspect-ratio: 281 / 500;
  }

  .testimonial-card > span {
    font-size: 8px;
  }

  .makers {
    margin-top: -20px;
    padding: 90px 0 100px;
  }

  .makers h2 {
    font-size: 30px;
  }

  .team-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .team-card {
    height: 450px;
  }

  .team-card__photo {
    height: 230px;
  }

  .team-card__body {
    padding-inline: 12px;
  }

  .team-card__body h3 {
    font-size: 12px;
  }

  .team-card__body p {
    font-size: 8px;
  }

  .ecosystem {
    margin-top: -20px;
    padding: 90px 0 100px;
  }

  .ecosystem h2 {
    font-size: 30px;
  }

  .ecosystem-grid {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    justify-content: flex-start;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding: 0 1px 18px;
  }

  .ecosystem-grid::-webkit-scrollbar {
    display: none;
  }

  .ecosystem-grid > .reveal {
    flex: 0 0 min(82vw, 363px);
    scroll-snap-align: center;
  }

  .ecosystem-card {
    height: 530px;
  }

  .ecosystem-card__content p {
    font-size: 11px;
  }

  .blog {
    margin-top: -20px;
    padding: 85px 0 95px;
  }

  .blog h2 {
    font-size: 30px;
  }

  .blog__content > .reveal > p {
    font-size: 12px;
  }

  .blog-grid {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding: 0 1px 18px;
  }

  .blog-grid::-webkit-scrollbar {
    display: none;
  }

  .blog-grid > .reveal {
    flex: 0 0 min(76vw, 280px);
    scroll-snap-align: center;
  }

  .blog-card {
    height: 380px;
  }

  .contact {
    margin-top: 0;
    padding: 115px 0 100px;
  }

  .contact__video {
    object-position: 43% center;
  }

  .contact__overlay {
    background: linear-gradient(180deg, rgba(1,2,3,.25), rgba(1,2,3,.35));
  }

  .contact__grid {
    display: flex;
    flex-direction: column;
    gap: 42px;
  }

  .contact__copy h2 {
    font-size: 36px;
  }

  .contact__copy p {
    font-size: 13px;
  }

  .contact-card {
    width: 100%;
    padding: 34px 24px 30px;
    border-radius: 28px;
  }

  .contact-card h3 {
    font-size: 22px;
  }

  .contact-card form {
    gap: 15px;
  }

  .contact-card input {
    height: 46px;
  }

  .contact-card textarea {
    min-height: 120px;
  }

  .footer {
    min-height: 470px;
  }

  .footer__grid {
    min-height: 460px;
    grid-template-columns: 1fr 1fr;
    padding-top: 50px;
  }

  .footer__right {
    padding-top: 32px;
  }

  .footer__legal {
    bottom: 30px;
    font-size: 8px;
  }
}

@media (max-width: 430px) {
  .page-width {
    width: calc(100% - 30px);
  }

  .hero {
    height: 670px;
    min-height: 670px;
  }

  .hero__video {
    object-position: 71% center;
  }

  .hero__content {
    padding-top: 175px;
  }

  .hero-copy {
    width: 96%;
  }

  .hero h1 {
    font-size: 31px;
  }

  .hero p {
    font-size: 13px;
    line-height: 1.55;
  }

  .origin__copy h2,
  .solutions__content h2,
  .differences__copy h2,
  .makers h2,
  .ecosystem h2,
  .blog h2 {
    font-size: 27px;
  }

  .lighthouse {
    left: -90px;
  }

  .lighthouse-glow {
    left: -70px;
  }

  .kronberg-origin-logo {
    left: 130px;
  }

  .solution-card {
    min-height: 370px;
  }

  .difference-pill {
    font-size: 10px;
  }

  .proof h3 {
    font-size: 24px;
  }

  .numbers-grid span {
    font-size: 8px;
  }

  .testimonial-card > strong {
    font-size: 11px;
  }

  .team-grid {
    grid-template-columns: 1fr;
  }

  .team-card {
    height: auto;
    min-height: 510px;
  }

  .team-card__photo {
    height: 310px;
  }

  .team-card__body h3 {
    font-size: 14px;
  }

  .team-card__body p {
    font-size: 10px;
  }

  .footer {
    min-height: 520px;
  }

  .footer__grid {
    display: block;
    min-height: 510px;
  }

  .footer__right {
    position: absolute;
    right: 0;
    top: 54px;
  }

  .footer__legal {
    width: 100%;
    text-align: center;
    white-space: normal;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}

/* Static HTML: preserve explicit line breaks in ecosystem copy */
.ecosystem-card__content p { white-space: pre-line; }

/* ========================================================================== */
/* KRON revision 02 — Figma overlap fidelity + accessible typography          */
/* ========================================================================== */

:root {
  --body-font: "Poppins", Arial, sans-serif;
  --display-font: "Poppins", Arial, sans-serif;
}

body,
button,
input,
textarea,
select {
  font-family: "Poppins", Arial, sans-serif;
}

h1,
h2,
h3,
h4,
.section-title {
  font-family: "Poppins", Arial, sans-serif;
  font-weight: 700;
  letter-spacing: -0.025em;
}

/* Accessibility baseline: content and controls never render below 16px. */
body,
p,
a,
button,
input,
textarea,
.desktop-nav button,
.mobile-menu button,
.gradient-button,
.solution-card p,
.solution-card .gradient-button,
.origin__copy p,
.solutions__intro,
.differences__copy > p,
.difference-list__header,
.difference-pill,
.numbers-grid span,
.testimonial-card > strong,
.testimonial-card > span,
.team-card__body p,
.ecosystem-card__content p,
.ecosystem-card .gradient-button,
.blog__content > .reveal > p,
.blog-card h4,
.blog-card p,
.gradient-button--link,
.contact__copy p,
.contact-card input,
.contact-card textarea,
.footer,
.footer button,
.footer a,
.footer__legal {
  font-size: 16px;
}

button,
a.gradient-button,
.gradient-button {
  min-height: 44px;
}

p {
  line-height: 1.58;
}

/* Header remains compact even with accessible labels. */
.desktop-nav {
  gap: 20px;
}

.desktop-nav button {
  font-weight: 500;
}

.gradient-button {
  padding-inline: 28px;
  font-weight: 700;
}

/* ---------- Hero -> section 2: softer and deeper visual merge ---------- */
.hero {
  height: 840px;
}

.hero h1 {
  font-family: "Poppins", Arial, sans-serif;
  font-size: 45px;
  line-height: 1.04;
}

.hero__bottom-fade {
  height: 350px;
  background:
    radial-gradient(ellipse at 58% 100%, rgba(116, 17, 246, .38), transparent 58%),
    linear-gradient(180deg, transparent 0%, rgba(31, 0, 62, .08) 22%, rgba(39, 0, 77, .44) 67%, #160023 100%);
}

.origin {
  z-index: 3;
  margin-top: -430px;
  padding-top: 112px;
}

.origin::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  top: -160px;
  height: 260px;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 0%, rgba(51, 0, 96, .18) 40%, rgba(38, 0, 75, .58) 78%, transparent 100%);
}

.origin__background {
  background-size: 100% auto;
  background-position: top center;
}

.origin__copy h2 {
  font-size: 39px;
  line-height: 1.08;
}

/* ---------- Section 2 -> section 3: preserve the pointed Figma edge ------- */
.solutions {
  z-index: 4;
  height: 1340px;
  margin-top: -220px;
  padding-top: 86px;
  overflow: visible;
}

.solutions__background {
  background-size: 100% auto;
  background-position: top center;
}

.solutions__content {
  position: relative;
  z-index: 2;
}

.solutions__content h2 {
  font-size: 36px;
  line-height: 1.08;
}

.solution-card p {
  line-height: 1.5;
}

.solution-card .gradient-button {
  min-width: 270px;
}

/* ---------- Section 3 -> section 4: no dead gap; woman overlaps upward ---- */
.differences {
  z-index: 6;
  height: 850px;
  margin-top: 0;
  overflow: visible;
}

.differences__background {
  background-size: 100% 100%;
  background-position: center;
}

.differences__grid {
  position: relative;
  z-index: 2;
}

.differences__person {
  z-index: 5;
}

.differences__person img {
  left: -175px;
  bottom: -8px;
  width: 740px;
  filter:
    drop-shadow(22px 18px 34px rgba(0, 0, 0, .34))
    drop-shadow(0 28px 24px rgba(0, 0, 0, .46));
}

.differences__person::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: -88px;
  bottom: -16px;
  width: 610px;
  height: 84px;
  border-radius: 50%;
  background: rgba(0, 0, 0, .62);
  filter: blur(23px);
  opacity: .85;
  pointer-events: none;
}

.differences::after {
  content: "";
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 88px;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .18) 48%, rgba(0, 0, 0, .72) 100%);
}

.differences__copy h2 {
  line-height: 1.08;
}

.difference-list__header,
.difference-pill {
  min-height: 48px;
}

/* ---------- Section 5: remove excess empty tail -------------------------- */
.proof {
  z-index: 5;
  height: 1240px;
  margin-top: -2px;
  padding-top: 58px;
}

.proof h2,
.proof h3 {
  line-height: 1.08;
}

.numbers-grid span {
  line-height: 1.35;
}

.testimonial-card {
  width: 250px;
}

.testimonial-card > strong,
.testimonial-card > span {
  line-height: 1.35;
}

/* Remaining sections accommodate the 16px accessibility baseline. */
.makers {
  height: 930px;
  margin-top: -4px;
}

.team-card {
  height: 610px;
}

.team-card__photo {
  height: 285px;
}

.team-card__body h3 {
  font-size: 18px;
}

.team-card__body p {
  line-height: 1.42;
}

.ecosystem {
  height: 800px;
}

.ecosystem-card {
  height: 600px;
}

.ecosystem-card__content {
  padding: 60px 28px 30px;
}

.ecosystem-card__content p {
  line-height: 1.48;
}

.blog {
  height: 760px;
  padding-top: 55px;
}

.blog-card {
  height: 430px;
}

.blog-card__body {
  align-items: stretch;
}

.blog-card h4,
.blog-card p {
  line-height: 1.45;
}

.gradient-button--link {
  align-self: center;
  min-width: 118px;
  text-align: center;
}

/* Larger text also gets enough space in the footer. */
.footer__legal {
  line-height: 1.45;
}

@media (min-width: 1500px) {
  /* Do not replace the pointed section 3 asset with cover; cover crops it. */
  .origin__background,
  .solutions__background {
    background-size: 100% auto;
  }
}

/* ---------- Mobile/tablet accessibility and composition ------------------ */
@media (max-width: 980px) {
  body,
  p,
  a,
  button,
  input,
  textarea,
  .mobile-menu button,
  .gradient-button,
  .origin__copy p,
  .solutions__intro,
  .solution-card p,
  .solution-card .gradient-button,
  .differences__copy > p,
  .difference-list__header,
  .difference-pill,
  .numbers-grid span,
  .testimonial-card > strong,
  .testimonial-card > span,
  .team-card__body p,
  .ecosystem-card__content p,
  .ecosystem-card .gradient-button,
  .blog__content > .reveal > p,
  .blog-card h4,
  .blog-card p,
  .gradient-button--link,
  .contact__copy p,
  .footer__legal {
    font-size: 16px;
  }

  .origin {
    margin-top: -95px;
  }

  .solutions {
    height: auto;
    margin-top: -75px;
    padding-top: 130px;
    padding-bottom: 90px;
  }

  .solutions__background {
    background-size: cover;
  }

  .solution-card {
    min-height: 480px;
  }

  .differences {
    height: auto;
    margin-top: -1px;
    overflow: hidden;
  }

  .differences__person img {
    width: 650px;
  }

  .proof,
  .makers,
  .ecosystem,
  .blog {
    height: auto;
  }

  .team-card {
    height: auto;
    min-height: 650px;
  }

  .ecosystem-card {
    height: 620px;
  }

  .blog-card {
    height: 440px;
  }
}

@media (max-width: 720px) {
  body {
    font-size: 16px;
  }

  .hero h1 {
    font-size: clamp(31px, 8.4vw, 40px);
  }

  .hero p,
  .origin__copy p,
  .solutions__intro,
  .solution-card p,
  .differences__copy > p,
  .difference-pill,
  .numbers-grid span,
  .testimonial-card > span,
  .team-card__body p,
  .ecosystem-card__content p,
  .blog__content > .reveal > p,
  .blog-card p,
  .contact__copy p,
  .footer__legal {
    font-size: 16px;
  }

  .gradient-button,
  .solution-card .gradient-button,
  .ecosystem-card .gradient-button,
  .gradient-button--link {
    font-size: 16px;
  }

  .origin {
    padding-top: 120px;
  }

  .solutions {
    margin-top: -30px;
    padding-top: 100px;
  }

  .differences__person::after {
    left: 50%;
    width: 430px;
    transform: translateX(-50%);
  }

  .team-card {
    min-height: 620px;
  }

  .team-card__body h3 {
    font-size: 18px;
  }

  .ecosystem-card {
    height: 650px;
  }

  .blog-card {
    height: 450px;
  }
}

@media (max-width: 430px) {
  .team-card {
    min-height: 650px;
  }

  .team-card__body h3,
  .team-card__body p,
  .difference-pill,
  .numbers-grid span,
  .testimonial-card > strong,
  .testimonial-card > span {
    font-size: 16px;
  }
}


/* ========================================================================== */
/* Migrated from index.html — client composition rules                       */
/* ========================================================================== */
/* Estes ajustes atuam somente no desktop. O comportamento mobile existente
       no styles.css permanece intacto. */
    @media (min-width: 981px) {
      /* 1) Hero -> seção 2: mantém a posição aprovada, mas faz o BG da seção 2
         entrar aos poucos para eliminar a faixa horizontal marcada. */
      .origin {
        margin-top: -270px !important;
      }

      .origin__background {
        -webkit-mask-image: linear-gradient(
          to bottom,
          transparent 0%,
          rgba(0, 0, 0, .18) 7%,
          rgba(0, 0, 0, .58) 16%,
          #000 30%,
          #000 100%
        ) !important;
        mask-image: linear-gradient(
          to bottom,
          transparent 0%,
          rgba(0, 0, 0, .18) 7%,
          rgba(0, 0, 0, .58) 16%,
          #000 30%,
          #000 100%
        ) !important;
      }

      .origin::before {
        content: "";
        position: absolute;
        z-index: -1;
        top: 0;
        left: 0;
        right: 0;
        height: 230px;
        pointer-events: none;
        background: linear-gradient(
          180deg,
          rgba(21, 0, 38, 0) 0%,
          rgba(28, 0, 52, .16) 34%,
          rgba(46, 0, 92, .34) 68%,
          rgba(74, 8, 154, .18) 100%
        );
      }

      /* 2) Seção 2 -> seção 3: mantém o encaixe atual, que já ficou legível. */
      .solutions {
        margin-top: -110px !important;
        height: 1485px !important;
        padding-top: 92px !important;
      }

      /* 3) Seção 3 -> seção 4: a altura extra acima cria cerca de 100px de
         respiro depois dos dois cards inferiores antes da próxima seção. */
      .differences {
        margin-top: 0 !important;
      }

      /* 4) Seção 5: aumenta mais um pouco as capas dos depoimentos. */
      .proof {
        height: 1460px !important;
      }

      .testimonial-grid {
        gap: 88px !important;
        margin-top: 30px !important;
        margin-bottom: 34px !important;
      }

      .testimonial-card {
        width: 330px !important;
      }

      .testimonial-cover {
        width: 292px !important;
        height: 520px !important;
        border-radius: 30px !important;
        margin-bottom: 20px !important;
      }

      .play-glyph {
        width: 68px !important;
      }

      /* Compensa o crescimento das capas sem recriar o excesso de vazio anterior. */
      .clients-carousel {
        margin-bottom: 46px !important;
      }

      .numbers-grid {
        margin-bottom: 48px !important;
      }
    }

    /* ====================================================================== */
    /* Considerações do cliente — revisão 05                                  */
    /* ====================================================================== */

    /* Produtos: nova hierarquia de mensagem, mantendo acessibilidade. */
    .solution-card__content h3 {
      max-width: 470px;
      margin: 0 0 14px;
      color: #fff;
      font-family: "Poppins", Arial, sans-serif;
      font-size: 18px;
      line-height: 1.25;
      font-weight: 700;
      letter-spacing: 0;
    }

    .solution-card__content p {
      min-height: 92px;
      margin-bottom: 20px;
      font-size: 16px !important;
      line-height: 1.5;
    }

    .solution-card .gradient-button {
      width: min(100%, 430px);
      min-height: 54px;
      height: auto;
      padding: 12px 22px;
      font-size: 16px !important;
      line-height: 1.25;
    }

    .solution-card .gradient-button span {
      white-space: normal;
      text-align: center;
    }

    /* Resultados: cada etapa ganha um bloco próprio para não ficar embolada. */
    .proof-block {
      position: relative;
    }

    .proof-block + .proof-block::before {
      content: "";
      position: absolute;
      left: 50%;
      top: 0;
      width: min(940px, 82%);
      height: 1px;
      transform: translateX(-50%);
      background: linear-gradient(90deg, transparent, rgba(37, 217, 239, .46), rgba(126, 57, 255, .34), transparent);
      box-shadow: 0 0 26px rgba(37, 217, 239, .10);
    }

    .numbers-grid > div {
      padding: 22px 12px;
      border: 1px solid rgba(255,255,255,.08);
      border-radius: 20px;
      background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
      backdrop-filter: blur(3px);
    }

    .testimonial-video-link {
      display: block;
      color: inherit;
      text-decoration: none;
    }

    .testimonial-text-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 24px;
      max-width: 980px;
      margin: 48px auto 0;
    }

    .testimonial-text-card {
      position: relative;
      min-height: 210px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 34px 38px;
      overflow: hidden;
      border: 1px solid rgba(255,255,255,.10);
      border-radius: 26px;
      background:
        radial-gradient(circle at 100% 0%, rgba(40, 222, 235, .13), transparent 42%),
        linear-gradient(145deg, rgba(25,25,36,.92), rgba(8,9,15,.94));
      text-align: left;
      box-shadow: 0 22px 54px rgba(0,0,0,.24);
    }

    .testimonial-text-card::before {
      content: "“";
      position: absolute;
      right: 25px;
      top: 2px;
      color: rgba(41, 222, 239, .12);
      font-family: "Poppins", Arial, sans-serif;
      font-size: 110px;
      line-height: 1;
    }

    .testimonial-text-card blockquote {
      position: relative;
      z-index: 1;
      margin: 0 0 20px;
      color: #fff;
      font-size: 18px;
      line-height: 1.5;
      font-weight: 500;
    }

    .testimonial-text-card strong,
    .testimonial-text-card span {
      position: relative;
      z-index: 1;
      display: block;
      font-size: 16px;
      line-height: 1.35;
    }

    .testimonial-text-card span {
      margin-top: 4px;
      color: rgba(255,255,255,.7);
    }

    .testimonial-actions {
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
      gap: 16px;
      margin-top: 36px;
    }

    .outline-button {
      min-height: 48px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 12px 26px;
      border: 1px solid rgba(39, 217, 238, .45);
      border-radius: 999px;
      color: #fff;
      background: rgba(8, 14, 21, .52);
      font-size: 16px;
      font-weight: 700;
      text-decoration: none;
      transition: transform .22s ease, border-color .22s ease, background .22s ease;
    }

    .outline-button:hover {
      transform: translateY(-2px);
      border-color: rgba(39, 217, 238, .9);
      background: rgba(25, 68, 79, .38);
    }

    /* Quem faz a KRON: quatro fundos diferentes dentro da paleta do KV. */
    .team-grid > div:nth-child(1) .team-card__body {
      background: linear-gradient(160deg, #22c5e7 0%, #2082d3 100%) !important;
    }
    .team-grid > div:nth-child(2) .team-card__body {
      background: linear-gradient(160deg, #20dfc9 0%, #18aebd 100%) !important;
    }
    .team-grid > div:nth-child(3) .team-card__body {
      background: linear-gradient(160deg, #6e42f5 0%, #3d75dc 100%) !important;
    }
    .team-grid > div:nth-child(4) .team-card__body {
      background: linear-gradient(160deg, #d33fc0 0%, #7d42ed 100%) !important;
    }

    .team-grid > div:nth-child(3) .team-card__body,
    .team-grid > div:nth-child(4) .team-card__body {
      color: #fff;
    }
    .team-grid > div:nth-child(3) .team-card__body p,
    .team-grid > div:nth-child(4) .team-card__body p {
      color: rgba(255,255,255,.94) !important;
    }

    /* Formulário com headline mais forte e novo campo de desafio. */
    .contact-card__intro {
      margin: -18px 0 26px;
      color: rgba(255,255,255,.8);
      font-size: 16px;
      line-height: 1.5;
      text-align: center;
    }

    .contact-card label {
      display: block;
      margin: 2px 0 -8px;
      color: rgba(255,255,255,.9);
      font-size: 16px;
      font-weight: 600;
    }

    .contact-card select {
      width: 100%;
      min-height: 52px;
      padding: 0 18px;
      border: 1px solid rgba(255,255,255,.25);
      border-radius: 18px;
      background: rgba(4,4,5,.50);
      color: #fff;
      outline: 0;
      font-size: 16px;
      transition: border-color 220ms ease, box-shadow 220ms ease, background 220ms ease;
    }

    .contact-card select:focus {
      border-color: rgba(38,215,242,.75);
      background: rgba(5,10,14,.64);
      box-shadow: 0 0 0 4px rgba(38,215,242,.06);
    }

    .contact-card select option {
      color: #fff;
      background: #151619;
    }

    /* Rodapé robusto com todas as rotas da home. */
    .footer__grid--robust {
      grid-template-columns: 180px 1fr 220px !important;
      gap: 70px;
    }

    .footer__brand {
      display: grid;
      align-content: start;
      gap: 22px;
    }

    .footer__brand > img:first-child {
      width: 110px;
      filter: grayscale(1) brightness(4);
    }

    .footer__brand > img:last-child {
      width: 145px;
      filter: brightness(0) invert(1);
    }

    .footer__menus {
      display: grid;
      grid-template-columns: 1.2fr .8fr;
      gap: 44px;
    }

    .footer-menu-title {
      display: block;
      margin-bottom: 16px;
      color: var(--aqua, #24ddec);
      font-family: "Poppins", Arial, sans-serif;
      font-size: 16px;
      font-weight: 700;
    }

    .footer-menu {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 9px 24px;
    }

    .footer-menu--solutions {
      grid-template-columns: 1fr;
    }

    .footer-menu button {
      width: max-content;
      max-width: 100%;
      min-height: 30px;
      padding: 0;
      border: 0;
      background: transparent;
      color: rgba(255,255,255,.82);
      font-size: 16px;
      line-height: 1.25;
      text-align: left;
      cursor: pointer;
      transition: color .18s ease, transform .18s ease;
    }

    .footer-menu button:hover {
      color: var(--aqua, #24ddec);
      transform: translateX(4px);
    }

    .footer-social-block {
      justify-self: end;
    }

    .footer-socials {
      display: flex;
      gap: 14px;
    }

    .footer-social-link {
      width: 44px;
      height: 44px;
      display: grid;
      place-items: center;
      border: 1px solid rgba(255,255,255,.14);
      border-radius: 50%;
      color: #fff;
      background: rgba(255,255,255,.03);
      transition: color .18s ease, transform .18s ease, border-color .18s ease;
    }

    .footer-social-link:hover {
      color: var(--aqua, #24ddec);
      border-color: rgba(36,221,236,.48);
      transform: translateY(-3px);
    }

    .footer-social-link svg {
      width: 21px;
      height: 21px;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.8;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .footer-social-link svg .fill {
      fill: currentColor;
      stroke: none;
    }

    @media (min-width: 981px) {
      /* O novo conteúdo dos produtos ocupa mais altura sem perder o respiro final. */
      .solutions {
        height: 1605px !important;
      }

      .solution-card {
        height: 580px !important;
      }

      .solution-card__content {
        inset: auto 34px 38px !important;
      }

      /* Três momentos independentes: clientes, dados e depoimentos. */
      .proof {
        height: auto !important;
        min-height: 1940px !important;
        padding-top: 68px !important;
        padding-bottom: 120px !important;
      }

      .proof-block {
        padding-bottom: 72px;
      }

      .proof-block + .proof-block {
        padding-top: 74px;
      }

      .proof-block--clients .clients-carousel {
        margin-bottom: 0 !important;
      }

      .numbers-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        max-width: 860px !important;
        gap: 18px;
        margin-bottom: 0 !important;
      }

      .testimonial-grid {
        gap: 92px !important;
        margin: 38px 0 0 !important;
      }

      .testimonial-card {
        width: 360px !important;
      }

      .testimonial-cover {
        width: 320px !important;
        height: 569px !important;
      }

      .testimonial-card > strong,
      .testimonial-card > span {
        font-size: 16px !important;
      }

      .makers {
        margin-top: 0 !important;
      }

      .contact {
        height: 1080px !important;
      }

      .contact-card {
        padding-top: 38px !important;
      }

      .footer {
        height: 530px !important;
      }

      .footer__grid--robust {
        padding-top: 64px !important;
      }

      .footer__legal {
        bottom: 36px !important;
      }
    }

    @media (max-width: 980px) {
      .solution-card__content h3,
      .testimonial-text-card blockquote,
      .testimonial-text-card strong,
      .testimonial-text-card span,
      .contact-card label,
      .contact-card select,
      .footer-menu-title,
      .footer-menu button {
        font-size: 16px;
      }

      .solution-card {
        min-height: 550px !important;
      }

      .proof {
        padding-bottom: 80px;
      }

      .proof-block {
        padding-bottom: 54px;
      }

      .proof-block + .proof-block {
        padding-top: 56px;
      }

      .numbers-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
      }

      .testimonial-grid {
        display: grid !important;
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 46px !important;
      }

      .testimonial-text-grid {
        grid-template-columns: 1fr;
      }

      .testimonial-text-card {
        min-height: 190px;
        padding: 28px 24px;
      }

      .footer {
        height: auto !important;
        min-height: 760px !important;
      }

      .footer__grid--robust {
        height: auto !important;
        min-height: 740px !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 36px;
        padding-top: 48px !important;
        padding-bottom: 130px;
      }

      .footer__menus {
        grid-template-columns: 1fr;
        gap: 32px;
      }

      .footer-menu {
        grid-template-columns: 1fr 1fr;
      }

      .footer-social-block {
        justify-self: start;
      }

      .footer__legal {
        bottom: 34px !important;
      }
    }

    @media (max-width: 560px) {
      .numbers-grid,
      .footer-menu {
        grid-template-columns: 1fr;
      }

      .testimonial-cover {
        width: min(84vw, 320px) !important;
        height: auto !important;
        aspect-ratio: 9 / 16;
      }
    }


    /* ====================================================================== */
    /* Refinos solicitados — quebra de linhas, fusões e acabamento visual     */
    /* ====================================================================== */
    .forced-line {
      display: block;
    }

    @media (min-width: 981px) {
      /* Hero: exatamente duas linhas, sem quebra automática dentro delas. */
      .hero-copy {
        width: 700px !important;
      }

      .hero h1 {
        width: 700px;
        max-width: none;
      }

      .hero h1 .forced-line {
        white-space: nowrap;
      }

      /* Hero -> origem: desfaz a faixa horizontal perceptível acima do farol
         sem alterar a posição já aprovada das duas seções. */
      .origin::before {
        top: -120px !important;
        height: 560px !important;
        background: linear-gradient(
          180deg,
          rgba(28, 0, 55, 0) 0%,
          rgba(39, 0, 77, .08) 18%,
          rgba(52, 0, 101, .18) 38%,
          rgba(66, 5, 132, .20) 56%,
          rgba(61, 3, 121, .11) 76%,
          rgba(45, 0, 87, 0) 100%
        ) !important;
        filter: blur(24px);
        transform: scaleY(1.08);
      }

      .origin__background {
        -webkit-mask-image: linear-gradient(
          to bottom,
          transparent 0%,
          rgba(0,0,0,.06) 10%,
          rgba(0,0,0,.20) 22%,
          rgba(0,0,0,.46) 36%,
          rgba(0,0,0,.74) 50%,
          #000 66%,
          #000 100%
        ) !important;
        mask-image: linear-gradient(
          to bottom,
          transparent 0%,
          rgba(0,0,0,.06) 10%,
          rgba(0,0,0,.20) 22%,
          rgba(0,0,0,.46) 36%,
          rgba(0,0,0,.74) 50%,
          #000 66%,
          #000 100%
        ) !important;
      }

      /* Origem: três linhas definidas pelo cliente, sem palavra órfã. */
      .origin__copy h2 {
        width: 690px;
        max-width: none;
        font-size: 35px !important;
        line-height: 1.10 !important;
      }

      .origin__copy h2 .forced-line {
        white-space: nowrap;
      }

      /* Soluções: headline balanceada em duas linhas. */
      .solutions__content h2 {
        width: 980px;
        max-width: none;
      }

      .solutions__content h2 .forced-line {
        white-space: nowrap;
      }

      /* Produtos: títulos controlados para não deixar uma palavra isolada. */
      .solution-card__content h3 .forced-line {
        white-space: nowrap;
      }

      /* Quem faz a KRON: o fundo de cada card agora ocupa toda a área textual.
         Isso remove a faixa azul vazia que aparecia abaixo de textos menores. */
      .team-card {
        display: flex;
        flex-direction: column;
        background: #071321 !important;
      }

      .team-card__photo {
        flex: 0 0 285px;
      }

      .team-card__body {
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        padding: 18px 19px 22px !important;
        color: #fff !important;
      }

      .team-card__body h3,
      .team-card__body p {
        color: #fff !important;
      }

      .team-grid > div:nth-child(1) .team-card__body {
        background: linear-gradient(165deg, rgba(16,187,222,.96) 0%, rgba(10,91,155,.96) 100%) !important;
      }
      .team-grid > div:nth-child(2) .team-card__body {
        background: linear-gradient(165deg, rgba(17,210,189,.96) 0%, rgba(8,104,132,.96) 100%) !important;
      }
      .team-grid > div:nth-child(3) .team-card__body {
        background: linear-gradient(165deg, rgba(100,64,235,.96) 0%, rgba(34,79,156,.96) 100%) !important;
      }
      .team-grid > div:nth-child(4) .team-card__body {
        background: linear-gradient(165deg, rgba(198,55,184,.96) 0%, rgba(90,47,179,.96) 100%) !important;
      }

      /* Capas especiais dos vídeos: mantém o link para o YouTube, mas usa as
         artes próprias presentes no projeto. */
      .testimonial-cover img {
        object-fit: cover;
        object-position: center;
      }
    }

    @media (max-width: 980px) {
      /* No mobile as linhas podem se adaptar à largura disponível. */
      .hero h1 .forced-line,
      .origin__copy h2 .forced-line,
      .solutions__content h2 .forced-line,
      .solution-card__content h3 .forced-line {
        white-space: normal;
      }

      .team-card {
        display: flex;
        flex-direction: column;
      }

      .team-card__body {
        flex: 1 1 auto;
      }
    }


/* ========================================================================== */
/* KRON revision 06 — desktop blend + mobile-first refinements                */
/* ========================================================================== */

/* Hero copy: headline and supporting copy read as one visual block. */
.hero-copy,
.hero h1,
.hero-support {
  width: 700px;
  max-width: 700px;
}

.hero-support {
  text-wrap: balance;
}

/* Public social icon assets: no hand-drawn SVGs. */
.footer-social-link img {
  width: 21px;
  height: 21px;
  object-fit: contain;
  display: block;
}

/* Desktop: eliminate the hard seam between Hero and Origin. */
@media (min-width: 981px) {
  .hero__bottom-fade {
    height: 430px !important;
    bottom: -1px;
    background:
      radial-gradient(ellipse at 57% 108%, rgba(119, 24, 244, .44) 0%, rgba(76, 4, 158, .25) 34%, transparent 68%),
      linear-gradient(180deg, rgba(18, 0, 32, 0) 0%, rgba(29, 0, 53, .05) 18%, rgba(42, 0, 79, .21) 46%, rgba(51, 0, 99, .47) 72%, rgba(40, 0, 77, .78) 100%) !important;
  }

  .origin {
    isolation: isolate;
  }

  .origin__background {
    top: -90px !important;
    bottom: -1px !important;
    height: auto !important;
    background-position: center top !important;
    background-size: 100% auto !important;
    -webkit-mask-image: linear-gradient(
      to bottom,
      transparent 0%,
      rgba(0,0,0,.03) 7%,
      rgba(0,0,0,.10) 15%,
      rgba(0,0,0,.24) 25%,
      rgba(0,0,0,.44) 36%,
      rgba(0,0,0,.68) 49%,
      rgba(0,0,0,.88) 62%,
      #000 74%,
      #000 100%
    ) !important;
    mask-image: linear-gradient(
      to bottom,
      transparent 0%,
      rgba(0,0,0,.03) 7%,
      rgba(0,0,0,.10) 15%,
      rgba(0,0,0,.24) 25%,
      rgba(0,0,0,.44) 36%,
      rgba(0,0,0,.68) 49%,
      rgba(0,0,0,.88) 62%,
      #000 74%,
      #000 100%
    ) !important;
  }

  .origin::before {
    z-index: -1 !important;
    top: -210px !important;
    height: 650px !important;
    background:
      radial-gradient(ellipse at 48% 48%, rgba(125, 26, 255, .24), transparent 62%),
      linear-gradient(180deg, rgba(20,0,36,0) 0%, rgba(34,0,64,.10) 24%, rgba(54,0,106,.25) 50%, rgba(67,7,139,.20) 72%, rgba(47,0,91,0) 100%) !important;
    filter: blur(36px) !important;
    transform: scale(1.05) !important;
    pointer-events: none;
  }
}

/* ------------------------------ mobile ----------------------------------- */
@media (max-width: 720px) {
  .page-width {
    width: calc(100% - 36px) !important;
  }

  /* Hero: balanced lines, tighter vertical rhythm, no orphaned words. */
  .hero {
    height: 620px !important;
    min-height: 620px !important;
  }

  .hero__content {
    padding-top: 145px !important;
  }

  .hero-copy,
  .hero h1,
  .hero-support {
    width: 100% !important;
    max-width: 100% !important;
  }

  .hero h1 {
    font-size: clamp(24px, 7vw, 29px) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.035em !important;
    text-wrap: balance;
  }

  .hero h1 .forced-line {
    display: block !important;
    white-space: nowrap !important;
  }

  .hero-support {
    margin-top: 18px;
    margin-bottom: 24px !important;
    font-size: 16px !important;
    line-height: 1.52 !important;
    text-wrap: balance;
  }

  .hero__bottom-fade {
    height: 230px !important;
    background: linear-gradient(180deg, transparent 0%, rgba(57,0,110,.28) 54%, rgba(39,0,75,.72) 100%) !important;
  }

  /* Hero -> section 2: remove the empty canyon and preserve a purple blend. */
  .origin {
    margin-top: -155px !important;
    padding: 112px 0 72px !important;
    background: #2c0060;
    overflow: hidden;
  }

  .origin::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    pointer-events: none;
    background:
      radial-gradient(circle at 78% 20%, rgba(127, 29, 255, .54), transparent 44%),
      radial-gradient(circle at 28% 70%, rgba(99, 17, 209, .46), transparent 52%),
      linear-gradient(180deg, rgba(60,0,115,.15), rgba(32,0,67,.35));
  }

  .origin__background {
    inset: 0 !important;
    opacity: .88;
    background-size: cover !important;
    background-position: 55% center !important;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.42), #000 20%, #000 100%) !important;
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.42), #000 20%, #000 100%) !important;
  }

  .origin__grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
  }

  .origin__copy {
    order: 1;
    padding-top: 0 !important;
  }

  .origin__copy h2 {
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 22px !important;
    font-size: clamp(24px, 6.7vw, 28px) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.03em !important;
    text-wrap: balance;
  }

  .origin__copy h2 .forced-line,
  .solutions__content h2 .forced-line,
  .solution-card__content h3 .forced-line {
    display: inline !important;
    white-space: normal !important;
  }

  .origin__copy h2 .forced-line + .forced-line::before,
  .solutions__content h2 .forced-line + .forced-line::before,
  .solution-card__content h3 .forced-line + .forced-line::before {
    content: " ";
  }

  .origin__copy p {
    max-width: 100% !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
    text-wrap: pretty;
  }

  .origin__visual {
    order: 2;
    width: 100% !important;
    height: 390px !important;
    margin-top: 0;
  }

  .lighthouse {
    left: 50% !important;
    bottom: -35px !important;
    width: min(92vw, 350px) !important;
    transform: translateX(-65%);
  }

  .lighthouse-glow {
    left: 50% !important;
    bottom: 34px !important;
    width: min(92vw, 360px) !important;
    transform: translateX(-63%);
  }

  .kronberg-origin-logo {
    left: auto !important;
    right: 4% !important;
    top: 165px !important;
    width: 145px !important;
  }

  /* Section 3: smaller balanced title with safe side margins. */
  .solutions {
    margin-top: -8px !important;
    padding: 78px 0 82px !important;
  }

  .solutions__content h2 {
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 22px !important;
    font-size: clamp(23px, 6.4vw, 27px) !important;
    line-height: 1.13 !important;
    letter-spacing: -0.03em !important;
    text-wrap: balance;
  }

  .solutions__intro {
    max-width: 100% !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
    text-wrap: pretty;
  }

  .solutions-grid {
    margin-top: 28px;
  }

  .solution-card__content h3 {
    width: 100%;
    max-width: 100%;
    font-size: 17px !important;
    line-height: 1.28 !important;
    text-wrap: balance;
  }

  /* Section 4: show the woman, not only the notebook. */
  .differences {
    margin-top: 0 !important;
    padding: 68px 0 0 !important;
    overflow: hidden !important;
  }

  .differences__copy h2 {
    font-size: clamp(24px, 6.6vw, 28px) !important;
    line-height: 1.12 !important;
    text-wrap: balance;
  }

  .differences__person {
    order: 2;
    width: 100% !important;
    height: 470px !important;
    margin-top: 28px !important;
    overflow: visible;
  }

  .differences__person img {
    left: 50% !important;
    bottom: -2px !important;
    width: min(94vw, 400px) !important;
    max-width: none !important;
    transform: translateX(-50%) !important;
  }

  .differences:hover .differences__person img {
    transform: translateX(-50%) !important;
  }

  .differences__person::after {
    left: 50% !important;
    width: min(86vw, 350px) !important;
    transform: translateX(-50%) !important;
  }

  /* Section 5: center each special video cover consistently. */
  .proof {
    margin-top: 0 !important;
    padding: 92px 0 90px !important;
  }

  .testimonial-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 48px !important;
    width: 100%;
  }

  .testimonial-card {
    width: 100% !important;
    max-width: 340px !important;
    margin-inline: auto !important;
  }

  .testimonial-video-link {
    width: 100%;
    display: flex !important;
    justify-content: center;
  }

  .testimonial-cover {
    width: min(78vw, 300px) !important;
    height: auto !important;
    aspect-ratio: 281 / 500 !important;
    margin: 0 auto 18px !important;
  }

  /* Ecosystem: stack all three cards; none are hidden off-canvas. */
  .ecosystem {
    margin-top: 0 !important;
    padding: 82px 0 90px !important;
    overflow: hidden !important;
  }

  .ecosystem-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  .ecosystem-grid > .reveal {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
  }

  .ecosystem-card {
    width: 100% !important;
    height: 600px !important;
  }

  /* Blog: true touch carousel with deliberate next-card peek. */
  .blog {
    margin-top: 0 !important;
    padding: 80px 0 88px !important;
    overflow-x: clip !important;
    overflow-y: visible !important;
  }

  .blog-grid {
    display: flex !important;
    width: calc(100vw - 18px) !important;
    max-width: none !important;
    gap: 16px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 0 36px 20px 0 !important;
    scroll-padding-inline: 0 36px;
    scroll-snap-type: x mandatory !important;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x;
    scrollbar-width: thin !important;
    scrollbar-color: rgba(34,215,242,.6) rgba(255,255,255,.08);
  }

  .blog-grid::-webkit-scrollbar {
    display: block !important;
    height: 5px;
  }

  .blog-grid::-webkit-scrollbar-thumb {
    background: linear-gradient(90deg, #1ff0c0, #22d7f2);
    border-radius: 999px;
  }

  .blog-grid > .reveal {
    flex: 0 0 min(78vw, 292px) !important;
    scroll-snap-align: start !important;
  }

  .blog-card {
    width: 100%;
  }
}

@media (max-width: 430px) {
  .page-width {
    width: calc(100% - 32px) !important;
  }

  .hero {
    height: 600px !important;
    min-height: 600px !important;
  }

  .hero__content {
    padding-top: 132px !important;
  }

  .hero h1 {
    font-size: clamp(22px, 6.45vw, 27px) !important;
  }

  .origin {
    margin-top: -150px !important;
    padding-top: 108px !important;
  }

  .origin__copy h2,
  .solutions__content h2,
  .differences__copy h2 {
    font-size: clamp(22px, 6.2vw, 26px) !important;
  }

  .differences__person {
    height: 445px !important;
  }

  .differences__person img {
    width: min(94vw, 385px) !important;
  }

  .ecosystem-card {
    height: 575px !important;
  }
}

/* Final mobile spacing correction after device review. */
@media (max-width: 720px) {
  .hero {
    height: 590px !important;
    min-height: 590px !important;
  }

  .origin {
    margin-top: -205px !important;
    padding-top: 108px !important;
  }

  /* Keep the lighthouse horizontally positioned without fighting its keyframe transform. */
  .lighthouse {
    left: 50% !important;
    margin-left: -230px !important;
    transform: none !important;
  }

  .lighthouse-glow {
    left: 50% !important;
    margin-left: -220px !important;
    transform: none !important;
  }
}

@media (max-width: 430px) {
  .hero {
    height: 575px !important;
    min-height: 575px !important;
  }

  .origin {
    margin-top: -198px !important;
    padding-top: 104px !important;
  }
}

/* ========================================================================== */
/* KRON revision 07 — hero alignment, seamless origin blend and mobile title  */
/* ========================================================================== */

/* External brand icons are loaded from a public CDN; normalize them to white. */
.footer-social-link img {
  width: 21px !important;
  height: 21px !important;
  display: block !important;
  object-fit: contain !important;
  filter: brightness(0) invert(1) !important;
}

@media (min-width: 981px) {
  /* Headline and supporting paragraph share the same visual measure. */
  .hero-copy,
  .hero h1,
  .hero p.hero-support {
    width: 700px !important;
    max-width: 700px !important;
  }

  .hero p.hero-support {
    margin-bottom: 28px !important;
    line-height: 1.52 !important;
    text-wrap: pretty !important;
  }

  /*
   * Blend the video into section 2 from inside the Hero first. This removes
   * the rectangular "overlay band" that was visible above the lighthouse.
   */
  .hero::after {
    content: "";
    position: absolute;
    z-index: 2;
    left: -5%;
    right: -5%;
    bottom: -42px;
    height: 430px;
    pointer-events: none;
    background:
      radial-gradient(ellipse at 58% 104%, rgba(122, 24, 247, .48) 0%, rgba(84, 6, 177, .28) 36%, transparent 69%),
      linear-gradient(180deg, rgba(25, 0, 48, 0) 0%, rgba(35, 0, 68, .08) 20%, rgba(48, 0, 94, .22) 43%, rgba(54, 0, 108, .45) 68%, rgba(45, 0, 88, .74) 100%);
    filter: blur(30px);
    transform: scaleX(1.04);
    opacity: .96;
  }

  .hero__bottom-fade {
    z-index: 2 !important;
    height: 470px !important;
    background:
      radial-gradient(ellipse at 57% 108%, rgba(116, 17, 246, .36) 0%, rgba(76, 4, 158, .20) 36%, transparent 70%),
      linear-gradient(180deg, transparent 0%, rgba(37, 0, 72, .08) 30%, rgba(49, 0, 96, .28) 61%, rgba(42, 0, 82, .72) 100%) !important;
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
  }

  /* Let the top blur breathe outside the section instead of being clipped. */
  .origin {
    overflow: visible !important;
  }

  /* Previous pseudo-element was responsible for a visible horizontal edge. */
  .origin::before {
    content: none !important;
  }

  /* Fade the actual section-2 artwork in over a long distance. */
  .origin__background {
    top: -185px !important;
    bottom: -1px !important;
    height: auto !important;
    background-position: center top !important;
    background-size: 100% auto !important;
    -webkit-mask-image: linear-gradient(
      to bottom,
      transparent 0%,
      rgba(0, 0, 0, .015) 14%,
      rgba(0, 0, 0, .06) 24%,
      rgba(0, 0, 0, .16) 35%,
      rgba(0, 0, 0, .33) 46%,
      rgba(0, 0, 0, .54) 58%,
      rgba(0, 0, 0, .76) 69%,
      rgba(0, 0, 0, .94) 80%,
      #000 88%,
      #000 100%
    ) !important;
    mask-image: linear-gradient(
      to bottom,
      transparent 0%,
      rgba(0, 0, 0, .015) 14%,
      rgba(0, 0, 0, .06) 24%,
      rgba(0, 0, 0, .16) 35%,
      rgba(0, 0, 0, .33) 46%,
      rgba(0, 0, 0, .54) 58%,
      rgba(0, 0, 0, .76) 69%,
      rgba(0, 0, 0, .94) 80%,
      #000 88%,
      #000 100%
    ) !important;
  }
}

@media (max-width: 720px) {
  /* Mobile also receives a seamless purple transition without a hard strip. */
  .hero::after {
    content: "";
    position: absolute;
    z-index: 2;
    left: -10%;
    right: -10%;
    bottom: -38px;
    height: 210px;
    pointer-events: none;
    background: linear-gradient(180deg, transparent 0%, rgba(58, 0, 111, .20) 35%, rgba(63, 0, 126, .62) 100%);
    filter: blur(22px);
  }

  .hero__bottom-fade {
    z-index: 2 !important;
    height: 245px !important;
    background: linear-gradient(180deg, transparent 0%, rgba(57, 0, 110, .20) 50%, rgba(53, 0, 104, .70) 100%) !important;
  }

  .origin::before {
    content: none !important;
  }

  .origin__background {
    top: -85px !important;
    bottom: 0 !important;
    opacity: 1 !important;
    background-position: 54% top !important;
    -webkit-mask-image: linear-gradient(
      to bottom,
      transparent 0%,
      rgba(0,0,0,.08) 16%,
      rgba(0,0,0,.30) 31%,
      rgba(0,0,0,.64) 49%,
      #000 67%,
      #000 100%
    ) !important;
    mask-image: linear-gradient(
      to bottom,
      transparent 0%,
      rgba(0,0,0,.08) 16%,
      rgba(0,0,0,.30) 31%,
      rgba(0,0,0,.64) 49%,
      #000 67%,
      #000 100%
    ) !important;
  }

  /* Supporting copy uses the exact same horizontal measure as the headline. */
  .hero p.hero-support {
    width: 100% !important;
    max-width: 100% !important;
    text-wrap: pretty !important;
  }
}

@media (max-width: 430px) {
  /*
   * Headlines require balanced wrapping. At phone widths, 27px makes the first
   * forced line overflow. This keeps the approved two-line composition intact
   * while still respecting the 16px accessibility floor.
   */
  .hero h1 {
    width: 100% !important;
    max-width: 100% !important;
    font-size: clamp(16.8px, 5.25vw, 21px) !important;
    line-height: 1.10 !important;
    letter-spacing: -0.035em !important;
  }

  .hero h1 .forced-line {
    display: block !important;
    white-space: nowrap !important;
  }

  .hero p.hero-support {
    margin-top: 18px !important;
    font-size: 16px !important;
    line-height: 1.48 !important;
  }
}

/* ========================================================================== */
/* KRON — conteúdo final 10-08-2026 / arquitetura storytelling                */
/* Esta camada substitui a ordem visual anterior sem quebrar os assets atuais. */
/* ========================================================================== */

.section-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
  color: var(--aqua);
  font-family: "Poppins", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.section-eyebrow::before {
  content: "";
  width: 34px;
  height: 2px;
  background: linear-gradient(90deg, var(--aqua), var(--cyan));
  box-shadow: 0 0 16px rgba(31, 240, 192, .35);
}

/* Hero: preserva a headline aprovada e alinha a subheadline à mesma medida. */
.hero-copy,
.hero h1,
.hero .hero-support {
  width: min(700px, 100%) !important;
  max-width: 700px !important;
}

.hero .hero-support {
  margin-bottom: 28px !important;
  font-size: 16px !important;
  line-height: 1.55 !important;
  text-wrap: pretty;
}

/* ---------- 2. Contexto ---------- */
.context {
  position: relative;
  z-index: 4;
  margin-top: -115px;
  padding: 185px 0 118px;
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(ellipse at 74% 4%, rgba(118, 26, 244, .34), transparent 44%),
    radial-gradient(ellipse at 12% 42%, rgba(24, 192, 229, .12), transparent 35%),
    linear-gradient(180deg, #230042 0%, #0b0b19 32%, #04070a 100%);
}

.context::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -75px -8% auto;
  height: 240px;
  background: radial-gradient(ellipse at center, rgba(96, 10, 205, .45), rgba(47, 0, 91, .10) 54%, transparent 76%);
  filter: blur(34px);
  pointer-events: none;
}

.context__mesh {
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: .26;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px),
    radial-gradient(circle at 50% 50%, rgba(34,215,242,.10), transparent 56%);
  background-size: 54px 54px, 54px 54px, 100% 100%;
  mask-image: linear-gradient(180deg, transparent 0, #000 14%, #000 88%, transparent 100%);
}

.context__inner {
  position: relative;
}

.context__head {
  max-width: 920px;
}

.context__head h2 {
  max-width: 900px;
  margin-bottom: 24px;
  font-size: clamp(36px, 3.2vw, 52px);
  line-height: 1.06;
  text-wrap: balance;
}

.context__head > p {
  max-width: 830px;
  margin-bottom: 48px;
  font-size: 18px;
  line-height: 1.62;
}

.context-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.context-stat {
  position: relative;
  min-height: 270px;
  padding: 34px 30px 30px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 28px;
  background:
    radial-gradient(circle at 100% 0, rgba(36,221,240,.12), transparent 45%),
    linear-gradient(145deg, rgba(255,255,255,.06), rgba(255,255,255,.018));
  box-shadow: 0 28px 70px rgba(0,0,0,.22);
  backdrop-filter: blur(8px);
}

.context-stat::after {
  content: "";
  position: absolute;
  inset: auto 24px 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--cyan), var(--purple), transparent);
  opacity: .6;
}

.context-stat strong {
  display: block;
  margin-bottom: 24px;
  color: var(--cyan);
  font-family: "Poppins", Arial, sans-serif;
  font-size: clamp(34px, 3.2vw, 52px);
  line-height: 1;
  letter-spacing: -.03em;
}

.context-stat p {
  margin: 0;
  font-size: 16px;
  line-height: 1.58;
}

.context__sources {
  margin: 26px 0 0;
  color: rgba(255,255,255,.64);
  font-size: 16px;
  line-height: 1.5;
}

.context__turn {
  max-width: 980px;
  margin: 72px auto 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  text-align: center;
}

.context__turn strong {
  color: #fff;
  font-family: "Poppins", Arial, sans-serif;
  font-size: clamp(22px, 2.1vw, 32px);
  line-height: 1.18;
}

.scroll-cue {
  flex: 0 0 54px;
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(31,240,192,.38);
  border-radius: 50%;
  background: rgba(31,240,192,.07);
  color: var(--aqua);
  font-size: 27px;
  cursor: pointer;
  animation: scrollCue 2s ease-in-out infinite;
}

@keyframes scrollCue {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(7px); }
}

/* ---------- 3. Diferencial ---------- */
.differences.differences--story {
  z-index: 5 !important;
  height: auto !important;
  min-height: 940px !important;
  margin-top: 0 !important;
  padding: 90px 0 70px !important;
  overflow: hidden !important;
}

.differences--story .differences__background {
  background-size: cover !important;
  background-position: center !important;
}

.differences--story .differences__grid {
  min-height: 790px;
  grid-template-columns: 43% 57% !important;
  align-items: center !important;
}

.differences--story .differences__person {
  height: 760px !important;
  align-self: end !important;
}

.differences--story .differences__person img {
  left: -130px !important;
  bottom: -18px !important;
  width: 680px !important;
  max-width: none !important;
}

.differences--story .differences__copy {
  padding: 26px 0 0 34px !important;
}

.differences--story .differences__copy h2 {
  max-width: 650px;
  margin-bottom: 24px;
  font-size: clamp(34px, 3vw, 48px) !important;
  line-height: 1.07 !important;
  text-wrap: balance;
}

.differences--story .differences__copy > p {
  max-width: 630px;
  margin-bottom: 22px;
  font-size: 16px !important;
  line-height: 1.62;
}

.differences--story .difference-turn {
  color: #fff;
  margin-top: 30px;
}

.differences--story .difference-list {
  max-width: 630px !important;
  gap: 10px !important;
}

.differences--story .difference-pill {
  min-height: 48px !important;
  font-size: 16px !important;
}

.differences--story .difference-list__header {
  display: none !important;
}

/* ---------- 4. Produtos ---------- */
.solutions.solutions--story {
  z-index: 6 !important;
  height: auto !important;
  min-height: 0 !important;
  margin-top: 0 !important;
  padding: 110px 0 130px !important;
  overflow: hidden !important;
}

.solutions--story .solutions__background {
  background-size: cover !important;
  background-position: center !important;
}

.solutions--story .solutions-grid {
  gap: 18px !important;
}

.solutions--story .solution-card {
  height: 590px !important;
  min-height: 590px !important;
  filter: none !important;
  background-size: cover !important;
  background-position: center !important;
}

/* O briefing final pede imagem sem filtro adicional. */
.solutions--story .solution-card::before {
  background: linear-gradient(180deg, rgba(0,0,0,.02), rgba(0,0,0,.05) 52%, rgba(0,0,0,.30)) !important;
}

.solutions--story .solution-card:hover {
  filter: none !important;
}

.solutions--story .solution-card__content {
  inset: auto 34px 38px !important;
}

.solutions--story .solution-card__content h3 {
  max-width: 480px;
  margin-bottom: 14px;
  font-size: 18px !important;
  line-height: 1.28;
}

.solutions--story .solution-card__content p {
  min-height: 96px !important;
  margin-bottom: 20px;
  font-size: 16px !important;
  line-height: 1.52;
}

.solutions--story .solution-card .gradient-button {
  width: min(100%, 440px);
  min-height: 54px;
  font-size: 16px !important;
}

/* ---------- 5. Origem ---------- */
.origin-final {
  position: relative;
  z-index: 7;
  padding: 118px 0 130px;
  overflow: hidden;
  isolation: isolate;
  background: #040508;
}

.origin-final__bg {
  position: absolute;
  z-index: -2;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(4,5,8,.08), #040508 96%),
    url('assets/session2/bg-s2.png') center top / cover no-repeat;
  opacity: .72;
}

.origin-final::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    radial-gradient(circle at 80% 17%, rgba(119, 31, 247, .23), transparent 26%),
    radial-gradient(circle at 17% 34%, rgba(34, 215, 242, .13), transparent 32%),
    linear-gradient(180deg, rgba(2,5,10,.08), rgba(2,4,8,.66) 52%, #030405 100%);
}

.origin-final__intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 500px;
  gap: 80px;
  align-items: center;
}

.origin-final__copy h2 {
  max-width: 720px;
  margin-bottom: 28px;
  font-size: clamp(36px, 3.2vw, 50px);
  line-height: 1.08;
  text-wrap: balance;
}

.origin-final__copy > p {
  max-width: 670px;
  font-size: 17px;
  line-height: 1.65;
}

.origin-final__tagline {
  margin: 26px 0 30px;
  color: #fff;
}

.origin-network {
  position: relative;
  min-height: 440px;
  display: grid;
  place-items: center;
}

.origin-network__line {
  position: absolute;
  left: 20%;
  right: 20%;
  top: 50%;
  height: 2px;
  background: linear-gradient(90deg, rgba(36,221,240,.08), rgba(36,221,240,.9), rgba(31,240,192,.9), rgba(31,240,192,.08));
  box-shadow: 0 0 22px rgba(36,221,240,.45);
  transform: rotate(-13deg);
}

.origin-network__halo {
  position: absolute;
  width: 270px;
  aspect-ratio: 1;
  border-radius: 50%;
  filter: blur(28px);
  opacity: .24;
}

.origin-network__halo--a { left: 0; top: 32px; background: var(--cyan); }
.origin-network__halo--b { right: 0; bottom: 24px; background: var(--purple); }

.origin-network__node {
  position: absolute;
  width: 220px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 50%;
  background: radial-gradient(circle at 32% 28%, rgba(255,255,255,.10), rgba(4,8,16,.92) 64%);
  box-shadow: 0 24px 70px rgba(0,0,0,.40), inset 0 0 42px rgba(36,221,240,.06);
  backdrop-filter: blur(10px);
}

.origin-network__node::after {
  content: "";
  position: absolute;
  inset: -12px;
  border: 1px solid rgba(36,221,240,.12);
  border-radius: 50%;
  animation: nodePulse 4s ease-in-out infinite;
}

.origin-network__node img {
  width: 145px;
  height: auto;
  max-height: 70px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

.origin-network__node--kronberg { left: 10px; top: 46px; }
.origin-network__node--kron { right: 12px; bottom: 40px; }

@keyframes nodePulse {
  0%,100% { transform: scale(.97); opacity: .34; }
  50% { transform: scale(1.04); opacity: .72; }
}

.origin-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-top: 90px;
}

.origin-stats article {
  min-height: 180px;
  display: grid;
  align-content: center;
  justify-items: center;
  padding: 28px 18px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 25px;
  background: linear-gradient(155deg, rgba(255,255,255,.06), rgba(255,255,255,.018));
  text-align: center;
  backdrop-filter: blur(8px);
}

.origin-stats strong {
  margin-bottom: 15px;
  color: var(--aqua);
  font-family: "Poppins", Arial, sans-serif;
  font-size: clamp(32px, 3vw, 47px);
  line-height: 1;
}

.origin-stats span {
  color: rgba(255,255,255,.87);
  font-size: 16px;
  line-height: 1.42;
}

.origin-subsection {
  margin-top: 120px;
}

.origin-subsection > .reveal > h2,
.origin-testimonials > .reveal > h2 {
  margin-bottom: 38px;
  text-align: center;
  font-size: clamp(34px, 3vw, 46px);
}

.ecosystem-grid--inside-origin {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

.ecosystem-grid--inside-origin .ecosystem-card {
  height: 590px !important;
  border-radius: 4px;
}

.ecosystem-grid--inside-origin .ecosystem-card__content {
  padding: 62px 28px 30px !important;
}

.ecosystem-grid--inside-origin .ecosystem-card__content p {
  font-size: 16px !important;
  line-height: 1.52;
}

.ecosystem-grid--inside-origin .gradient-button {
  min-height: 48px;
  font-size: 16px !important;
}

.testimonial-grid--origin {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 58px !important;
  max-width: 920px;
  margin: 0 auto !important;
}

.testimonial-grid--origin .testimonial-card {
  width: auto !important;
  display: grid;
  justify-items: center;
  text-align: center;
}

.testimonial-grid--origin .testimonial-cover {
  width: min(100%, 310px) !important;
  height: auto !important;
  aspect-ratio: 281 / 500;
}

.testimonial-grid--origin .testimonial-card > strong {
  margin-top: 4px;
  font-size: 18px !important;
}

.testimonial-grid--origin .testimonial-card > span {
  margin-top: 4px;
  font-size: 16px !important;
}

.testimonial-grid--origin blockquote {
  max-width: 390px;
  margin: 22px 0 0;
  color: rgba(255,255,255,.88);
  font-size: 16px;
  line-height: 1.58;
  font-style: normal;
}

/* ---------- 6. Sócios ---------- */
.makers.makers--story {
  z-index: 8 !important;
  height: auto !important;
  min-height: 0 !important;
  margin-top: 0 !important;
  padding: 110px 0 130px !important;
  overflow: hidden !important;
}

.makers--story .makers__background {
  background-size: cover !important;
  background-position: center !important;
}

.makers__heading h2 {
  max-width: 970px;
  margin: 0 auto 52px !important;
  font-size: clamp(36px, 3.2vw, 50px) !important;
  line-height: 1.08;
  text-align: center;
}

.makers__heading h2 span {
  color: #fff;
}

.team-grid--three {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 20px !important;
  max-width: 1020px;
  margin: 0 auto;
}

.team-grid--three .team-card {
  height: 620px !important;
  min-height: 620px !important;
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 2px;
  background: rgba(6, 13, 24, .86) !important;
  overflow: hidden;
}

.team-grid--three .team-card__photo {
  position: relative;
  flex: 0 0 355px;
  height: 355px !important;
}

.team-grid--three .team-card__photo::after {
  height: 90px;
  background: linear-gradient(transparent, rgba(4,12,22,.86));
}

.team-grid--three .team-card__photo img {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

.team-card__photo--fallback {
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 50% 35%, rgba(31,240,192,.18), transparent 32%),
    linear-gradient(145deg, #0b2435, #16102e 64%, #080d16);
}

.team-card__initials {
  position: absolute;
  z-index: 1;
  color: rgba(255,255,255,.22);
  font-family: "Poppins", Arial, sans-serif;
  font-size: 88px;
  line-height: 1;
}

.team-grid--three .team-card__body {
  flex: 1;
  padding: 28px 28px 30px !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  background: linear-gradient(160deg, rgba(20,196,223,.96), rgba(38,102,206,.96)) !important;
  color: #fff !important;
  text-align: center;
}

.team-grid--three > div:nth-child(2) .team-card__body {
  background: linear-gradient(160deg, rgba(27,220,190,.96), rgba(23,141,180,.96)) !important;
}

.team-grid--three > div:nth-child(3) .team-card__body {
  background: linear-gradient(160deg, rgba(124,63,242,.96), rgba(187,53,191,.96)) !important;
}

.team-grid--three .team-card__body h3 {
  margin-bottom: 10px;
  color: #fff !important;
  font-size: 20px !important;
}

.team-grid--three .team-card__body p {
  margin: 0;
  color: #fff !important;
  font-size: 16px !important;
  line-height: 1.52;
}

.team-role {
  display: block;
  margin: -2px 0 13px;
  color: rgba(255,255,255,.80);
  font-size: 16px;
  font-weight: 600;
}

.team-profile-link {
  margin-top: auto;
  padding-top: 18px;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 5px;
  text-decoration-thickness: 1px;
}

.team-profile-link:hover {
  color: #03151a;
}

/* ---------- 7. Blog ---------- */
.blog.blog--story {
  z-index: 9 !important;
  height: auto !important;
  min-height: 0 !important;
  margin-top: 0 !important;
  padding: 105px 0 125px !important;
  overflow: hidden !important;
}

.blog--story .blog__background {
  background-size: cover !important;
  background-position: center !important;
}

.blog--story h2 {
  font-size: clamp(34px, 3vw, 46px) !important;
}

.blog--story h3,
.blog--story .blog__content > .reveal > p,
.blog--story .blog-card h4,
.blog--story .blog-card p,
.blog--story .gradient-button--link {
  font-size: 16px !important;
}

.blog--story .blog-grid {
  gap: 15px;
}

.blog--story .blog-card {
  height: 445px !important;
}

/* ---------- 8. Fechamento ---------- */
.contact.contact--story {
  height: auto !important;
  min-height: 930px !important;
  margin-top: 0 !important;
  padding: 110px 0 120px !important;
}

.contact--story .contact__grid {
  height: auto !important;
  grid-template-columns: 1fr 500px !important;
  gap: 90px !important;
  padding-top: 0 !important;
  align-items: start !important;
}

.contact--story .contact__copy h2 {
  font-size: clamp(38px, 3.5vw, 54px) !important;
}

.contact--story .contact__copy p {
  font-size: 16px !important;
}

.contact--story .contact-card h3 {
  margin-bottom: 30px;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 25px !important;
}

.contact--story .contact-card form {
  gap: 18px !important;
}

.contact--story .submit-button {
  min-width: 170px;
}

/* ---------- Footer ---------- */
.footer.footer--story {
  height: auto !important;
  min-height: 520px;
}

.footer--story .footer__grid--robust {
  min-height: 510px;
  padding-top: 64px !important;
  padding-bottom: 130px;
}

.footer-social-link img {
  width: 21px !important;
  height: 21px !important;
  filter: brightness(0) invert(1) !important;
}

/* ---------- Storytelling responsivo ---------- */
@media (max-width: 980px) {
  .context {
    margin-top: -78px;
    padding: 145px 0 95px;
  }

  .context-stats {
    grid-template-columns: 1fr;
  }

  .context-stat {
    min-height: 0;
  }

  .context__turn {
    margin-top: 54px;
  }

  .differences.differences--story {
    min-height: 0 !important;
    padding: 90px 0 85px !important;
  }

  .differences--story .differences__grid {
    min-height: 0;
    grid-template-columns: 1fr !important;
  }

  .differences--story .differences__copy {
    order: 1;
    padding: 0 !important;
  }

  .differences--story .differences__person {
    order: 2;
    width: 100%;
    height: 520px !important;
    margin-top: 42px;
  }

  .differences--story .differences__person img {
    left: 50% !important;
    bottom: -22px !important;
    width: min(86vw, 500px) !important;
    transform: translateX(-50%) !important;
  }

  .differences--story:hover .differences__person img {
    transform: translateX(-50%) !important;
  }

  .solutions.solutions--story {
    padding: 90px 0 100px !important;
  }

  .solutions--story .solutions-grid {
    grid-template-columns: 1fr !important;
  }

  .solutions--story .solution-card {
    min-height: 560px !important;
  }

  .origin-final {
    padding: 95px 0 110px;
  }

  .origin-final__intro {
    grid-template-columns: 1fr;
    gap: 54px;
  }

  .origin-network {
    width: min(100%, 560px);
    margin: 0 auto;
  }

  .origin-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 65px;
  }

  .ecosystem-grid--inside-origin {
    display: grid !important;
    grid-template-columns: 1fr !important;
    max-width: 520px;
    margin: 0 auto;
  }

  .ecosystem-grid--inside-origin > .reveal {
    width: 100%;
  }

  .testimonial-grid--origin {
    gap: 36px !important;
  }

  .makers.makers--story {
    padding: 95px 0 105px !important;
  }

  .team-grid--three {
    grid-template-columns: 1fr !important;
    max-width: 520px;
  }

  .team-grid--three .team-card {
    min-height: 0 !important;
    height: auto !important;
  }

  .team-grid--three .team-card__photo {
    flex-basis: 430px;
    height: 430px !important;
  }

  .blog.blog--story {
    padding: 90px 0 105px !important;
  }

  .contact.contact--story {
    min-height: 0 !important;
    padding: 100px 0 110px !important;
  }

  .contact--story .contact__grid {
    grid-template-columns: 1fr !important;
    gap: 48px !important;
  }
}

@media (max-width: 720px) {
  .hero {
    height: 610px !important;
    min-height: 610px !important;
  }

  .hero__content {
    padding-top: 150px !important;
  }

  .hero-copy {
    width: 100% !important;
    max-width: 100% !important;
  }

  .hero h1 {
    width: 100% !important;
    max-width: 100% !important;
    font-size: clamp(22px, 6.7vw, 34px) !important;
    line-height: 1.08 !important;
  }

  .hero h1 .forced-line {
    white-space: normal !important;
    text-wrap: balance;
  }

  .hero .hero-support {
    width: 100% !important;
    max-width: 100% !important;
    font-size: 16px !important;
    line-height: 1.52 !important;
  }

  .context {
    margin-top: -58px;
    padding: 122px 0 82px;
  }

  .context__head h2 {
    font-size: clamp(28px, 8vw, 38px);
  }

  .context__head > p {
    font-size: 16px;
  }

  .context-stat {
    padding: 28px 24px;
  }

  .context__turn {
    flex-direction: column;
    gap: 20px;
  }

  .context__turn strong {
    font-size: clamp(21px, 6.4vw, 28px);
  }

  .differences--story .differences__copy h2,
  .origin-final__copy h2,
  .makers__heading h2 {
    font-size: clamp(28px, 8vw, 38px) !important;
  }

  .differences--story .differences__person {
    height: 450px !important;
  }

  .differences--story .differences__person img {
    width: min(95vw, 420px) !important;
  }

  .solutions.solutions--story {
    padding: 74px 0 88px !important;
  }

  .solutions--story .solution-card {
    height: auto !important;
    min-height: 570px !important;
  }

  .solutions--story .solution-card__content {
    inset: auto 22px 28px !important;
  }

  .solutions--story .solution-card__content h3 {
    font-size: 18px !important;
  }

  .solutions--story .solution-card__content h3 .forced-line {
    white-space: normal !important;
  }

  .origin-final {
    padding: 82px 0 94px;
  }

  .origin-network {
    min-height: 365px;
  }

  .origin-network__node {
    width: 174px;
  }

  .origin-network__node img {
    width: 116px;
  }

  .origin-network__node--kronberg { left: 0; top: 34px; }
  .origin-network__node--kron { right: 0; bottom: 38px; }

  .origin-stats {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .origin-stats article {
    min-height: 150px;
  }

  .origin-subsection {
    margin-top: 86px;
  }

  .ecosystem-grid--inside-origin .ecosystem-card {
    height: auto !important;
    min-height: 590px !important;
  }

  .testimonial-grid--origin {
    grid-template-columns: 1fr !important;
  }

  .testimonial-grid--origin .testimonial-cover {
    width: min(78vw, 300px) !important;
  }

  .makers.makers--story {
    padding: 78px 0 90px !important;
  }

  .makers__heading h2 br {
    display: none;
  }

  .team-grid--three .team-card__photo {
    flex-basis: 340px;
    height: 340px !important;
  }

  .blog--story .blog-grid {
    display: flex !important;
    gap: 14px !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
    padding: 0 16px 22px 0;
    scrollbar-width: thin;
    scrollbar-color: rgba(31,240,192,.55) rgba(255,255,255,.08);
  }

  .blog--story .blog-grid > .reveal {
    flex: 0 0 min(82vw, 310px) !important;
    scroll-snap-align: start;
  }

  .contact--story .contact-card {
    padding: 32px 24px !important;
  }

  .footer--story .footer__grid--robust {
    min-height: 0;
  }
}

@media (max-width: 430px) {
  .page-width {
    width: calc(100% - 32px) !important;
  }

  .hero {
    height: 590px !important;
    min-height: 590px !important;
  }

  .hero__content {
    padding-top: 138px !important;
  }

  .hero h1 {
    font-size: clamp(21px, 6.55vw, 28px) !important;
    letter-spacing: -.028em !important;
  }

  .hero .hero-support {
    font-size: 16px !important;
  }

  .context {
    padding-top: 112px;
  }

  .section-eyebrow {
    font-size: 16px;
  }

  .differences--story .differences__person {
    height: 405px !important;
  }

  .origin-network {
    min-height: 320px;
  }

  .origin-network__node {
    width: 152px;
  }

  .origin-network__node img {
    width: 100px;
  }

  .team-grid--three .team-card__photo {
    flex-basis: 300px;
    height: 300px !important;
  }

  .team-grid--three .team-card__body {
    padding: 25px 22px 28px !important;
  }
}

/* ==========================================================================
   KRON — refinamento 10/08/2026
   Origem inspirada na lógica orbital da BeMinder + fundos limpos em Sócios/Blog
   ========================================================================== */

/* Contexto: a frase de virada fica sozinha, sem seta/controle lateral. */
.context__turn {
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  max-width: 980px !important;
  margin-inline: auto !important;
  text-align: center !important;
}
.context__turn .scroll-cue {
  display: none !important;
}

/* --------------------------------------------------------------------------
   Origem: Kronberg como núcleo, KRON orbitando e stats distribuídos no campo.
   -------------------------------------------------------------------------- */
.origin-final {
  background:
    radial-gradient(circle at 74% 30%, rgba(82, 34, 187, .13), transparent 28%),
    radial-gradient(circle at 22% 36%, rgba(30, 211, 236, .08), transparent 32%),
    linear-gradient(135deg, #06101d 0%, #060a14 42%, #120525 100%) !important;
}

.origin-final__bg {
  opacity: .20 !important;
  background:
    radial-gradient(circle at 72% 38%, rgba(88, 32, 211, .28), transparent 31%),
    radial-gradient(circle at 40% 50%, rgba(25, 215, 237, .12), transparent 32%) !important;
}

.origin-final::before {
  background:
    linear-gradient(90deg, rgba(2,7,14,.28), transparent 44%),
    radial-gradient(circle at 76% 38%, rgba(118, 47, 246, .16), transparent 31%),
    radial-gradient(circle at 70% 40%, rgba(34, 215, 242, .08), transparent 44%) !important;
}

.origin-final__intro {
  grid-template-columns: minmax(0, .92fr) minmax(560px, 1.08fr) !important;
  gap: 54px !important;
  align-items: center !important;
}

.origin-network {
  position: relative !important;
  width: 100% !important;
  min-height: 610px !important;
  display: block !important;
  overflow: visible !important;
  isolation: isolate;
}

.origin-network__ambient {
  position: absolute;
  border-radius: 50%;
  filter: blur(95px);
  pointer-events: none;
  opacity: .22;
}
.origin-network__ambient--cyan {
  left: 15%;
  top: 17%;
  width: 360px;
  height: 360px;
  background: #23d8ef;
}
.origin-network__ambient--purple {
  right: 5%;
  bottom: 10%;
  width: 330px;
  height: 330px;
  background: #7b2bf4;
}

.origin-network__ring {
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.origin-network__ring--outer {
  width: 490px;
  height: 490px;
  border: 1px solid rgba(34, 215, 242, .11);
  box-shadow: 0 0 55px rgba(34, 215, 242, .035);
}
.origin-network__ring--middle {
  width: 360px;
  height: 360px;
  border: 1px solid rgba(122, 36, 247, .15);
}
.origin-network__ring--inner {
  width: 250px;
  height: 250px;
  border: 1px solid rgba(255,255,255,.09);
}

.origin-network__orbit {
  position: absolute;
  z-index: 8;
  left: 50%;
  top: 50%;
  width: 390px;
  height: 390px;
  margin-left: -195px;
  margin-top: -195px;
  border-radius: 50%;
  animation: kronOrbit 24s linear infinite;
  pointer-events: none;
}

.origin-network__node {
  position: absolute !important;
  display: grid !important;
  place-items: center !important;
  aspect-ratio: 1 !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.17) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.origin-network__node-shine {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background:
    radial-gradient(circle at 28% 20%, rgba(255,255,255,.25), transparent 24%),
    linear-gradient(145deg, rgba(255,255,255,.06), transparent 48%);
  pointer-events: none;
}

.origin-network__node--kronberg {
  z-index: 12 !important;
  left: 50% !important;
  top: 50% !important;
  width: 245px !important;
  height: 245px !important;
  transform: translate(-50%, -50%) !important;
  background:
    radial-gradient(circle at 36% 32%, rgba(44, 180, 226, .14), transparent 35%),
    rgba(4, 14, 25, .62) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 0 54px rgba(34, 215, 242, .055),
    0 0 90px rgba(34, 215, 242, .10) !important;
}
.origin-network__node--kronberg::before,
.origin-network__node--kronberg::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.075);
}
.origin-network__node--kronberg::before { inset: 34px; }
.origin-network__node--kronberg::after { inset: 68px; }

.origin-network__node--kronberg img {
  position: relative;
  z-index: 3;
  width: 152px !important;
  max-height: 62px !important;
  filter: brightness(0) invert(1) !important;
}

.origin-network__node--kron {
  z-index: 15 !important;
  right: -69px !important;
  top: 50% !important;
  width: 145px !important;
  height: 145px !important;
  transform: translateY(-50%) !important;
  background:
    radial-gradient(circle at 30% 24%, rgba(255,255,255,.20), transparent 27%),
    radial-gradient(circle at 68% 72%, rgba(122,36,247,.20), transparent 39%),
    rgba(28, 10, 58, .66) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 18px 18px 46px rgba(255,255,255,.025),
    0 0 72px rgba(122,36,247,.26) !important;
  animation: kronCounterOrbit 24s linear infinite;
}
.origin-network__node--kron::after {
  content: "";
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 50%;
}
.origin-network__node--kron img {
  position: relative;
  z-index: 3;
  width: 100px !important;
  max-height: 52px !important;
  filter: brightness(0) invert(1) !important;
}

@keyframes kronOrbit {
  to { transform: rotate(360deg); }
}
@keyframes kronCounterOrbit {
  from { transform: translateY(-50%) rotate(0deg); }
  to { transform: translateY(-50%) rotate(-360deg); }
}

/* stats orbital visual */
.origin-stats--orbit {
  position: absolute !important;
  inset: 0 !important;
  z-index: 20 !important;
  display: block !important;
  margin: 0 !important;
  pointer-events: none;
}
.origin-stats--orbit article {
  position: absolute !important;
  width: 148px !important;
  min-height: 146px !important;
  display: flex !important;
  flex-direction: column;
  align-items: flex-start !important;
  justify-content: center !important;
  padding: 19px 18px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 18px !important;
  background: rgba(8, 19, 34, .58) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 20px 60px rgba(0,0,0,.14) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  text-align: left !important;
}
.origin-stats--orbit strong {
  margin: 0 0 10px !important;
  color: #20e3cd !important;
  font-size: 34px !important;
  line-height: .95 !important;
  letter-spacing: -.05em;
}
.origin-stats--orbit span {
  color: rgba(255,255,255,.70) !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

.origin-stat--one { left: 0 !important; top: 24px !important; }
.origin-stat--two { right: 0 !important; top: 68px !important; }
.origin-stat--three { left: 10px !important; bottom: 28px !important; }
.origin-stat--four { right: 18px !important; bottom: 8px !important; }

/* --------------------------------------------------------------------------
   Sócios: remove o bokeh pixelado do asset antigo e usa fundo institucional.
   -------------------------------------------------------------------------- */
.makers.makers--story {
  position: relative;
  background:
    radial-gradient(ellipse at 50% 105%, rgba(26, 147, 236, .26), transparent 42%),
    radial-gradient(circle at 84% 28%, rgba(119, 39, 242, .16), transparent 27%),
    linear-gradient(180deg, #04050a 0%, #060918 52%, #06172b 100%) !important;
}
.makers--story .makers__background {
  background-image: none !important;
  opacity: 0 !important;
}
.makers.makers--story::before {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 255px;
  background:
    repeating-radial-gradient(ellipse at 50% 110%, rgba(32,205,238,.18) 0 1px, transparent 2px 11px);
  opacity: .24;
  transform: perspective(480px) rotateX(64deg) scaleX(1.35);
  transform-origin: bottom center;
  pointer-events: none;
}
.makers.makers--story::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(6,17,33,.38), transparent 24% 76%, rgba(6,17,33,.38)),
    linear-gradient(180deg, transparent 70%, rgba(3,8,16,.48));
}
.makers--story .makers__content {
  position: relative;
  z-index: 2;
}

/* --------------------------------------------------------------------------
   Blog: mesmo universo, porém com roxo controlado e sem manchas quadradas.
   -------------------------------------------------------------------------- */
.blog.blog--story {
  position: relative;
  background:
    radial-gradient(ellipse at 50% 105%, rgba(112, 25, 241, .32), transparent 45%),
    radial-gradient(circle at 14% 20%, rgba(31, 220, 236, .09), transparent 25%),
    linear-gradient(180deg, #08031b 0%, #10002f 55%, #170040 100%) !important;
}
.blog--story .blog__background {
  background-image: none !important;
  opacity: 0 !important;
}
.blog.blog--story::before {
  content: "";
  position: absolute;
  left: -8%;
  right: -8%;
  bottom: -130px;
  height: 340px;
  border-radius: 50%;
  background:
    repeating-radial-gradient(ellipse at center, rgba(179,51,255,.23) 0 1px, transparent 2px 10px);
  opacity: .30;
  filter: blur(.2px);
  transform: perspective(520px) rotateX(62deg) scaleX(1.25);
  pointer-events: none;
}
.blog.blog--story::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 50% 65%, rgba(127,29,255,.15), transparent 36%),
    linear-gradient(180deg, rgba(5,2,14,.05), rgba(7,2,20,.12));
  pointer-events: none;
}
.blog--story .blog__content {
  position: relative;
  z-index: 2;
}

/* --------------------------------------------------------------------------
   Mobile / tablet
   -------------------------------------------------------------------------- */
@media (max-width: 980px) {
  .origin-final__intro {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  .origin-network {
    width: min(100%, 640px) !important;
    min-height: 570px !important;
    margin-inline: auto;
  }
}

@media (max-width: 720px) {
  .origin-final {
    padding-top: 82px !important;
  }

  .origin-network {
    width: min(100%, 360px) !important;
    min-height: 580px !important;
    margin-top: 8px;
  }

  .origin-network__ring--outer {
    width: 286px;
    height: 286px;
  }
  .origin-network__ring--middle {
    width: 222px;
    height: 222px;
  }
  .origin-network__ring--inner {
    width: 156px;
    height: 156px;
  }

  .origin-network__orbit {
    width: 226px;
    height: 226px;
    margin-left: -113px;
    margin-top: -113px;
  }

  .origin-network__node--kronberg {
    width: 148px !important;
    height: 148px !important;
  }
  .origin-network__node--kronberg::before { inset: 20px; }
  .origin-network__node--kronberg::after { inset: 42px; }
  .origin-network__node--kronberg img {
    width: 96px !important;
  }

  .origin-network__node--kron {
    right: -38px !important;
    width: 82px !important;
    height: 82px !important;
  }
  .origin-network__node--kron::after { inset: 10px; }
  .origin-network__node--kron img {
    width: 57px !important;
  }

  .origin-network__ambient--cyan {
    left: 10%;
    top: 20%;
    width: 220px;
    height: 220px;
  }
  .origin-network__ambient--purple {
    right: 2%;
    bottom: 18%;
    width: 210px;
    height: 210px;
  }

  .origin-stats--orbit article {
    width: 112px !important;
    min-height: 110px !important;
    padding: 12px 11px !important;
    border-radius: 15px !important;
  }
  .origin-stats--orbit strong {
    font-size: 25px !important;
    margin-bottom: 7px !important;
  }
  .origin-stats--orbit span {
    font-size: 10px !important;
    line-height: 1.30 !important;
  }

  .origin-stat--one { left: 0 !important; top: 8px !important; }
  .origin-stat--two { right: 0 !important; top: 28px !important; }
  .origin-stat--three { left: 0 !important; bottom: 14px !important; }
  .origin-stat--four { right: 0 !important; bottom: 0 !important; }

  .makers.makers--story::before {
    height: 190px;
    opacity: .18;
  }
  .blog.blog--story::before {
    height: 230px;
    bottom: -92px;
  }
}

@media (max-width: 430px) {
  .origin-network {
    width: min(100%, 330px) !important;
    min-height: 550px !important;
  }

  .origin-network__ring--outer {
    width: 260px;
    height: 260px;
  }
  .origin-network__ring--middle {
    width: 204px;
    height: 204px;
  }
  .origin-network__ring--inner {
    width: 144px;
    height: 144px;
  }

  .origin-network__orbit {
    width: 208px;
    height: 208px;
    margin-left: -104px;
    margin-top: -104px;
  }

  .origin-network__node--kronberg {
    width: 138px !important;
    height: 138px !important;
  }
  .origin-network__node--kronberg img {
    width: 90px !important;
  }

  .origin-network__node--kron {
    right: -34px !important;
    width: 76px !important;
    height: 76px !important;
  }
  .origin-network__node--kron img {
    width: 52px !important;
  }

  .origin-stats--orbit article {
    width: 104px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .origin-network__orbit,
  .origin-network__node--kron {
    animation: none !important;
  }
}



/* ========================================================================== */
/* KRON refinement — 10/08/2026: orbit upright + typography + product bg       */
/* ========================================================================== */

/* Desktop-only controlled breaks. On smaller screens the browser balances the
   copy naturally, avoiding orphan words without forcing an oversized line. */
.desktop-story-break { display: inline; }

@media (min-width: 981px) {
  .desktop-story-break { display: block; }

  /* Differential headline: three intentional lines, no isolated word. */
  .differences--story .differences__copy h2.story-balanced-title {
    max-width: 690px !important;
    font-size: 42px !important;
    line-height: 1.08 !important;
    text-wrap: initial !important;
  }

  /* Origin headline follows the visual rhythm used in BeMinder but with a
     slightly smaller size, keeping each line meaningful. */
  .origin-final__copy h2.origin-final__title {
    width: 610px !important;
    max-width: 610px !important;
    font-size: 43px !important;
    line-height: 1.08 !important;
    text-wrap: initial !important;
  }
}

/* PRODUCT SECTION
   The original 1440x1468 raster background became visually enlarged when the
   storytelling section changed height. We remove that stretched bitmap and
   keep a clean KRON background generated in CSS, so it scales without artifacts. */
.solutions.solutions--story {
  position: relative !important;
  isolation: isolate;
  background:
    radial-gradient(ellipse at 78% 12%, rgba(31, 224, 202, .10) 0%, rgba(31, 224, 202, 0) 38%),
    radial-gradient(ellipse at 24% 88%, rgba(111, 42, 244, .16) 0%, rgba(111, 42, 244, 0) 42%),
    linear-gradient(180deg, #020508 0%, #03070b 48%, #070414 100%) !important;
}

.solutions--story .solutions__background {
  display: none !important;
  background-image: none !important;
}

.solutions.solutions--story::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent 0%, rgba(34, 215, 242, .035) 50%, transparent 100%),
    radial-gradient(circle at 50% 48%, rgba(255,255,255,.025), transparent 48%);
}

.solutions--story .solutions__content {
  position: relative !important;
  z-index: 2 !important;
}

/* ORBIT
   Animate the KRON planet itself around a static center. The transform uses a
   rotation + exact counter-rotation in the same animation, so the logo stays
   upright at every point of the orbit instead of turning upside down. */
.origin-network__orbit {
  position: absolute !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  animation: none !important;
  transform: none !important;
  border-radius: 0 !important;
  pointer-events: none;
}

.origin-network__node--kron {
  --kron-orbit-radius: 195px;
  left: 50% !important;
  right: auto !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translate(-50%, -50%) translateX(var(--kron-orbit-radius)) !important;
  transform-origin: center !important;
  animation: kronPlanetOrbitUpright 24s linear infinite !important;
  will-change: transform;
}

@keyframes kronPlanetOrbitUpright {
  from {
    transform: translate(-50%, -50%) rotate(0deg) translateX(var(--kron-orbit-radius)) rotate(0deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(360deg) translateX(var(--kron-orbit-radius)) rotate(-360deg);
  }
}

/* The image itself never receives a rotation. */
.origin-network__node--kron img {
  transform: none !important;
  animation: none !important;
}

@media (max-width: 980px) {
  .desktop-story-break { display: none; }

  .differences--story .differences__copy h2.story-balanced-title,
  .origin-final__copy h2.origin-final__title {
    width: auto !important;
    max-width: 100% !important;
    text-wrap: balance !important;
  }
}

@media (max-width: 720px) {
  .differences--story .differences__copy h2.story-balanced-title {
    font-size: 30px !important;
    line-height: 1.08 !important;
  }

  .origin-final__copy h2.origin-final__title {
    font-size: 31px !important;
    line-height: 1.09 !important;
  }

  .origin-network__node--kron {
    --kron-orbit-radius: 113px;
  }
}

@media (max-width: 430px) {
  .differences--story .differences__copy h2.story-balanced-title {
    font-size: 27px !important;
  }

  .origin-final__copy h2.origin-final__title {
    font-size: 29px !important;
  }

  .origin-network__node--kron {
    --kron-orbit-radius: 104px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .origin-network__node--kron {
    animation: none !important;
    transform: translate(-50%, -50%) translateX(var(--kron-orbit-radius)) !important;
  }
}


/* ========================================================================== */
/* KRON final refinements — 10/08/2026 (orbit, origem, produtos, diferencial) */
/* ========================================================================== */

@media (min-width: 981px) {
  .origin-final__intro {
    grid-template-columns: minmax(0, 1fr) 540px !important;
    gap: 96px !important;
  }

  .origin-final__copy h2.origin-final__title {
    width: 700px !important;
    max-width: 700px !important;
    font-size: 41px !important;
    line-height: 1.06 !important;
    letter-spacing: -0.03em !important;
    text-wrap: initial !important;
  }

  .origin-final__title .origin-title-line {
    display: block !important;
    white-space: nowrap !important;
  }

  .origin-final__copy > p {
    max-width: 620px !important;
  }
}

.origin-final__title .origin-title-line {
  display: inline;
}

.origin-final__title .origin-title-line + .origin-title-line::before {
  content: " ";
}

.origin-network {
  min-height: 620px !important;
}

.origin-stats--orbit article {
  width: 152px !important;
}

.origin-stat--one {
  left: 34px !important;
  top: 40px !important;
}

.origin-stat--two {
  right: 18px !important;
  top: 82px !important;
}

.origin-stat--three {
  left: 36px !important;
  bottom: 34px !important;
}

.origin-stat--four {
  right: 24px !important;
  bottom: 12px !important;
}

/* Reinforce the orbit motion in the final file so the KRON bubble keeps
   rotating around the center while the logo stays upright. */
.origin-network__orbit {
  position: absolute !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  animation: none !important;
  transform: none !important;
  border-radius: 0 !important;
}

.origin-network__node--kron {
  --kron-orbit-radius: 195px;
  left: 50% !important;
  right: auto !important;
  top: 50% !important;
  bottom: auto !important;
  transform-origin: center !important;
  animation: kronPlanetOrbitUpright 20s linear infinite !important;
  will-change: transform;
}

@keyframes kronPlanetOrbitUpright {
  from {
    transform: translate(-50%, -50%) rotate(0deg) translateX(var(--kron-orbit-radius)) rotate(0deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(360deg) translateX(var(--kron-orbit-radius)) rotate(-360deg);
  }
}

/* Products: use the original artwork, remove the artificial color wash and
   recover readability through a neutral dark veil only. */
.solutions--story .solution-card {
  background-color: #08111d !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}

.solutions--story .solution-card--purple {
  background-position: center top !important;
}

.solutions--story .solution-card--green {
  background-position: center center !important;
}

.solutions--story .solution-card--cyan {
  background-position: center top !important;
}

.solutions--story .solution-card--pink {
  background-position: center top !important;
}

.solutions--story .solution-card::before {
  background: linear-gradient(180deg, rgba(4,10,18,.06) 0%, rgba(4,10,18,.16) 24%, rgba(4,10,18,.54) 62%, rgba(4,10,18,.92) 100%) !important;
}

.solutions--story .solution-card::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 42%;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(4,10,18,0) 0%, rgba(4,10,18,.24) 35%, rgba(4,10,18,.84) 100%);
}

.solutions--story .solution-card__glow {
  display: none !important;
}

.solutions--story .solution-card__content {
  z-index: 3 !important;
}

.solutions--story .solution-card__content h3,
.solutions--story .solution-card__content p,
.solutions--story .solution-card__content .gradient-button {
  text-shadow: 0 4px 20px rgba(0,0,0,.34);
}

/* Diferencial: remove the visibly stretched bitmap and place the wave asset as
   a controlled layer over a clean KRON gradient background. */
.differences.differences--story {
  position: relative;
  background:
    radial-gradient(circle at 78% 20%, rgba(35, 216, 239, .12), transparent 24%),
    radial-gradient(circle at 62% 74%, rgba(122, 43, 244, .16), transparent 30%),
    linear-gradient(180deg, #070a11 0%, #0a1020 52%, #08111d 100%) !important;
}

.differences--story .differences__background {
  background-image: none !important;
  opacity: 0 !important;
}

.differences.differences--story::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: url('assets/session4/bg_session4.png') right center / 1380px auto no-repeat;
  opacity: .28;
  mix-blend-mode: screen;
}

.differences--story .differences__grid,
.differences--story .differences__person,
.differences--story .differences__copy {
  position: relative;
  z-index: 2;
}

@media (max-width: 1280px) {
  .differences.differences--story::before {
    background-size: 1180px auto;
  }
}

@media (max-width: 980px) {
  .origin-final__copy h2.origin-final__title {
    width: auto !important;
    max-width: 100% !important;
    font-size: 34px !important;
    line-height: 1.08 !important;
    text-wrap: balance !important;
  }

  .origin-final__title .origin-title-line {
    display: inline !important;
    white-space: normal !important;
  }

  .origin-final__title .origin-title-line + .origin-title-line::before {
    content: " ";
  }

  .origin-network__node--kron {
    --kron-orbit-radius: 145px;
  }

  .origin-stat--one { left: 8px !important; top: 18px !important; }
  .origin-stat--two { right: 8px !important; top: 42px !important; }
  .origin-stat--three { left: 14px !important; bottom: 30px !important; }
  .origin-stat--four { right: 14px !important; bottom: 16px !important; }

  .differences.differences--story::before {
    background-size: 980px auto;
    background-position: center bottom;
    opacity: .22;
  }
}

@media (max-width: 720px) {
  .origin-final__copy h2.origin-final__title {
    font-size: 30px !important;
  }

  .origin-network__node--kron {
    --kron-orbit-radius: 113px;
  }

  .differences.differences--story::before {
    background-size: 820px auto;
    background-position: center bottom;
    opacity: .18;
  }

  .solutions--story .solution-card {
    background-position: center center !important;
  }
}

@media (max-width: 430px) {
  .origin-final__copy h2.origin-final__title {
    font-size: 28px !important;
  }

  .origin-network__node--kron {
    --kron-orbit-radius: 104px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .origin-network__node--kron {
    animation: none !important;
    transform: translate(-50%, -50%) translateX(var(--kron-orbit-radius)) !important;
  }
}

/* ========================================================================== */
/* KRON refinement — 10/08/2026 (round 2): origin title, ecosystem and s4 bg  */
/* ========================================================================== */

/* ORIGEM / ECOSSISTEMA: keep the title in 4 clean lines, like the approved
   pattern, and give the orbital block more breathing room so nothing invades
   the headline area. */
.origin-final__intro {
  grid-template-columns: minmax(0, .90fr) minmax(540px, 1.10fr) !important;
  gap: 72px !important;
  align-items: center !important;
}

.origin-final__copy h2.origin-final__title {
  width: 560px !important;
  max-width: 560px !important;
  font-size: 40px !important;
  line-height: 1.05 !important;
  text-wrap: initial !important;
}

.origin-final__title .origin-title-line {
  display: block !important;
  white-space: normal !important;
}

.origin-final__title .origin-title-line + .origin-title-line::before {
  content: none !important;
}

.origin-stat--one { left: 64px !important; top: 54px !important; }
.origin-stat--two { right: 18px !important; top: 86px !important; }
.origin-stat--three { left: 54px !important; bottom: 34px !important; }
.origin-stat--four { right: 26px !important; bottom: 18px !important; }

/* SESSÃO 4 / DIFERENCIAIS: rebalance the composition and constrain the wave
   asset to the right side only, avoiding the stretched/misaligned feel. */
.differences.differences--story {
  height: 840px !important;
}

.differences--story .differences__grid {
  grid-template-columns: 43% 57% !important;
  align-items: center !important;
}

.differences--story .differences__person {
  height: 740px !important;
}

.differences--story .differences__person img {
  left: -108px !important;
  bottom: -2px !important;
  width: 610px !important;
}

.differences--story .differences__copy {
  padding: 72px 0 0 12px !important;
}

.differences--story .differences__copy h2.story-balanced-title {
  max-width: 720px !important;
  font-size: 36px !important;
  line-height: 1.04 !important;
  text-wrap: balance !important;
}

.differences--story .differences__copy > p {
  max-width: 610px !important;
}

.differences.differences--story::before {
  inset: 0 0 0 40% !important;
  background: url('assets/session4/bg_session4.png') right 54% center / 1120px auto no-repeat !important;
  opacity: .20 !important;
  mix-blend-mode: screen;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.45) 14%, rgba(0,0,0,1) 34%);
          mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.45) 14%, rgba(0,0,0,1) 34%);
}

@media (max-width: 1280px) {
  .origin-final__intro {
    grid-template-columns: minmax(0, .92fr) minmax(500px, 1.08fr) !important;
    gap: 56px !important;
  }

  .origin-final__copy h2.origin-final__title {
    width: 520px !important;
    max-width: 520px !important;
    font-size: 37px !important;
  }

  .differences--story .differences__grid {
    grid-template-columns: 40% 60% !important;
  }

  .differences--story .differences__person img {
    left: -92px !important;
    width: 570px !important;
  }

  .differences--story .differences__copy h2.story-balanced-title {
    font-size: 34px !important;
    max-width: 650px !important;
  }

  .differences.differences--story::before {
    inset: 0 0 0 36% !important;
    background-size: 980px auto !important;
    background-position: right 60px center !important;
  }
}

@media (max-width: 980px) {
  .origin-final__intro {
    grid-template-columns: 1fr !important;
    gap: 34px !important;
  }

  .origin-final__copy h2.origin-final__title {
    width: auto !important;
    max-width: 100% !important;
    font-size: 34px !important;
    line-height: 1.08 !important;
    text-wrap: balance !important;
  }

  .origin-final__title .origin-title-line {
    display: inline !important;
  }

  .origin-final__title .origin-title-line + .origin-title-line::before {
    content: " " !important;
  }

  .origin-stat--one { left: 10px !important; top: 16px !important; }
  .origin-stat--two { right: 10px !important; top: 42px !important; }
  .origin-stat--three { left: 14px !important; bottom: 24px !important; }
  .origin-stat--four { right: 14px !important; bottom: 12px !important; }

  .differences.differences--story {
    height: auto !important;
  }

  .differences--story .differences__grid {
    grid-template-columns: 1fr !important;
  }

  .differences--story .differences__person {
    order: 1;
    height: 460px !important;
  }

  .differences--story .differences__person img {
    left: 50% !important;
    bottom: 0 !important;
    width: min(86vw, 420px) !important;
    transform: translateX(-50%) !important;
  }

  .differences--story:hover .differences__person img {
    transform: translateX(-50%) scale(1.008) !important;
  }

  .differences--story .differences__copy {
    order: 2;
    padding: 24px 0 0 !important;
  }

  .differences--story .differences__copy h2.story-balanced-title {
    max-width: 100% !important;
    font-size: 31px !important;
    line-height: 1.08 !important;
    text-wrap: balance !important;
  }

  .differences.differences--story::before {
    inset: 0 !important;
    background-size: 880px auto !important;
    background-position: center 78% !important;
    opacity: .16 !important;
    -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,.28), rgba(0,0,0,1) 48%);
            mask-image: linear-gradient(180deg, rgba(0,0,0,.28), rgba(0,0,0,1) 48%);
  }
}

@media (max-width: 720px) {
  .origin-final__copy h2.origin-final__title {
    font-size: 30px !important;
  }

  .differences--story .differences__person {
    height: 390px !important;
  }

  .differences--story .differences__copy h2.story-balanced-title {
    font-size: 28px !important;
  }

  .differences.differences--story::before {
    background-size: 720px auto !important;
    background-position: center 86% !important;
  }
}

@media (max-width: 430px) {
  .origin-final__copy h2.origin-final__title {
    font-size: 28px !important;
  }

  .differences--story .differences__person {
    height: 340px !important;
  }

  .differences--story .differences__copy h2.story-balanced-title {
    font-size: 26px !important;
  }
}

/* ========================================================================== */
/* CLIENT REVISION — 11/08/2026                                              */
/* ========================================================================== */

/* Global headline direction: balanced Poppins weights. */
.hero h1,
.context__head h2,
.context__turn strong,
.differences--story .differences__copy h2,
.origin-final__copy h2,
.origin-subsection > .reveal > h2,
.origin-testimonials > .reveal > h2,
.makers__heading h2,
.blog--story h2,
.blog--story h3,
.contact--story .contact__copy h2 {
  font-family: "Poppins", Arial, sans-serif;
  font-weight: 600 !important;
  letter-spacing: -0.025em !important;
}

.hero h1 {
  font-size: clamp(38px, 3.6vw, 52px) !important;
  line-height: 1.06 !important;
}

.context__head h2 {
  max-width: 780px !important;
  font-size: clamp(30px, 2.6vw, 40px) !important;
  line-height: 1.08 !important;
}

.context__turn strong {
  font-size: clamp(20px, 1.7vw, 26px) !important;
  line-height: 1.22 !important;
}

.differences--story .differences__copy h2.story-balanced-title {
  font-size: clamp(30px, 2.5vw, 38px) !important;
  line-height: 1.07 !important;
  max-width: 660px !important;
}

.origin-final__copy h2.origin-final__title {
  width: 520px !important;
  max-width: 520px !important;
  font-size: clamp(31px, 2.6vw, 39px) !important;
  line-height: 1.07 !important;
}

.origin-final__title .origin-title-line {
  display: block !important;
  white-space: nowrap !important;
}

.origin-final__title .origin-title-line + .origin-title-line::before {
  content: none !important;
}

.origin-subsection > .reveal > h2,
.origin-testimonials > .reveal > h2 {
  font-size: clamp(29px, 2.4vw, 37px) !important;
}

.makers__heading h2 {
  font-size: clamp(30px, 2.7vw, 40px) !important;
  line-height: 1.08 !important;
}

.makers__heading h2 span {
  font-weight: 400 !important;
}

.blog--story h2 {
  font-size: clamp(30px, 2.5vw, 38px) !important;
}

.blog--story h3 {
  font-size: clamp(18px, 1.55vw, 23px) !important;
  font-weight: 400 !important;
}

.contact--story .contact__copy h2 {
  font-size: clamp(34px, 3vw, 44px) !important;
  line-height: 1.08 !important;
}

/* Navigation — exact client order, with room for 10 items. */
.topbar__inner {
  width: min(1380px, calc(100% - 48px)) !important;
}

.desktop-nav {
  gap: 15px !important;
}

.desktop-nav button,
.desktop-nav .nav-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 12px 0;
  border: 0;
  background: transparent;
  color: rgba(255,255,255,.82);
  font-size: 13px !important;
  font-weight: 500;
  white-space: nowrap;
  cursor: pointer;
  transition: color 220ms ease;
}

.desktop-nav .nav-link::after,
.desktop-nav button::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 4px;
  width: 0;
  height: 1px;
  background: linear-gradient(90deg, var(--cyan), var(--aqua));
  transform: translateX(-50%);
  transition: width 260ms ease;
}

.desktop-nav .nav-link:hover,
.desktop-nav button:hover,
.desktop-nav button.is-active {
  color: #fff;
}

.desktop-nav .nav-link:hover::after,
.desktop-nav button:hover::after,
.desktop-nav button.is-active::after {
  width: 100%;
}

.mobile-menu-link {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 48px;
  padding: 0 24px;
  color: rgba(255,255,255,.9);
  font-size: 16px;
  font-weight: 500;
}

/* No eyebrows anywhere in the final version. */
.section-eyebrow { display: none !important; }

/* Hero -> Contexto: match both edge colors exactly and use a long overlap so
   the seam disappears instead of looking like a horizontal divider. */
.hero__bottom-fade {
  height: 340px !important;
  background: linear-gradient(180deg,
    rgba(33,0,62,0) 0%,
    rgba(33,0,62,.18) 30%,
    rgba(33,0,62,.62) 66%,
    #21003e 100%) !important;
  filter: blur(.01px);
}

.context {
  margin-top: -172px !important;
  padding-top: 238px !important;
  background:
    radial-gradient(ellipse at 74% 5%, rgba(118,26,244,.26), transparent 42%),
    radial-gradient(ellipse at 12% 42%, rgba(24,192,229,.10), transparent 35%),
    linear-gradient(180deg, #21003e 0%, #100b22 23%, #06090e 62%, #04070a 100%) !important;
  box-shadow: 0 -58px 110px 42px rgba(33,0,62,.42);
}

.context::before {
  top: -120px !important;
  height: 330px !important;
  background: radial-gradient(ellipse at center, rgba(73,8,153,.40), rgba(33,0,62,.12) 62%, transparent 80%) !important;
  filter: blur(48px) !important;
}

/* Context cards: smaller number/copy and three distinct KRON colors. */
.context-stats {
  gap: 16px !important;
}

.context-stat {
  min-height: 226px !important;
  padding: 28px 27px 26px !important;
  border-radius: 23px !important;
}

.context-stat strong {
  margin-bottom: 18px !important;
  font-size: clamp(29px, 2.4vw, 38px) !important;
  font-weight: 400 !important;
}

.context-stat p {
  font-size: 16px !important;
  line-height: 1.52 !important;
}

.context-stat:nth-child(1) {
  border-color: rgba(34,215,242,.24) !important;
  background: radial-gradient(circle at 100% 0, rgba(34,215,242,.18), transparent 48%), linear-gradient(145deg, rgba(19,80,100,.20), rgba(255,255,255,.015)) !important;
}
.context-stat:nth-child(1) strong { color: #22d7f2 !important; }
.context-stat:nth-child(1)::after { background: linear-gradient(90deg, transparent, #22d7f2, transparent) !important; }

.context-stat:nth-child(2) {
  border-color: rgba(142,68,255,.26) !important;
  background: radial-gradient(circle at 100% 0, rgba(126,45,244,.22), transparent 48%), linear-gradient(145deg, rgba(64,24,112,.22), rgba(255,255,255,.015)) !important;
}
.context-stat:nth-child(2) strong { color: #a477ff !important; }
.context-stat:nth-child(2)::after { background: linear-gradient(90deg, transparent, #8d4cff, transparent) !important; }

.context-stat:nth-child(3) {
  border-color: rgba(31,240,192,.24) !important;
  background: radial-gradient(circle at 100% 0, rgba(31,240,192,.18), transparent 48%), linear-gradient(145deg, rgba(15,83,75,.21), rgba(255,255,255,.015)) !important;
}
.context-stat:nth-child(3) strong { color: #1ff0c0 !important; }
.context-stat:nth-child(3)::after { background: linear-gradient(90deg, transparent, #1ff0c0, transparent) !important; }

/* Why KRON: entire content visible in one desktop viewport. */
.differences.differences--story {
  min-height: 760px !important;
  height: 760px !important;
  padding: 30px 0 18px !important;
  overflow: hidden !important;
  background: #1c1c2e !important;
}

.differences--story .differences__background {
  display: block !important;
  opacity: 1 !important;
  background-image: url('assets/session4/bg_session4.png') !important;
  background-size: cover !important;
  background-position: center center !important;
}

.differences.differences--story::before {
  display: none !important;
  content: none !important;
}

.differences--story .differences__grid {
  min-height: 712px !important;
  grid-template-columns: 42% 58% !important;
  align-items: center !important;
}

.differences--story .differences__person {
  height: 655px !important;
  align-self: end !important;
}

.differences--story .differences__person img {
  left: -105px !important;
  bottom: -12px !important;
  width: 575px !important;
}

.differences--story .differences__copy {
  padding: 6px 0 0 24px !important;
}

.differences--story .differences__copy > p {
  max-width: 610px !important;
  margin-bottom: 14px !important;
  font-size: 16px !important;
  line-height: 1.48 !important;
}

.differences--story .difference-turn {
  margin: 16px 0 14px !important;
  font-size: 16px !important;
}

.differences--story .difference-list {
  max-width: 620px !important;
  gap: 7px !important;
}

.differences--story .difference-pill {
  min-height: 42px !important;
  padding-inline: 22px !important;
  font-size: 16px !important;
}

/* Product card copy follows the lighter headline direction. */
.solutions--story .solution-card__content h3 {
  font-family: "Poppins", Arial, sans-serif;
  font-size: 18px !important;
  line-height: 1.28 !important;
  font-weight: 600 !important;
}

/* Origin: compact headline, card spacing and BeMinder-like orbital motion. */
.origin-final__intro {
  grid-template-columns: 500px minmax(0, 1fr) !important;
  gap: 82px !important;
  align-items: center !important;
}

.origin-network {
  min-height: 600px !important;
  width: 100% !important;
  overflow: visible !important;
}

.origin-stat--one { left: 28px !important; top: 38px !important; }
.origin-stat--two { right: 8px !important; top: 82px !important; }
.origin-stat--three { left: 34px !important; bottom: 34px !important; }
.origin-stat--four { right: 20px !important; bottom: 16px !important; }

.origin-network__orbit {
  position: absolute !important;
  z-index: 8 !important;
  left: 50% !important;
  top: 50% !important;
  inset: auto !important;
  width: 390px !important;
  height: 390px !important;
  margin-left: -195px !important;
  margin-top: -195px !important;
  border-radius: 50% !important;
  transform: none !important;
  animation: kronOrbitFinal 18s linear infinite !important;
  pointer-events: none;
}

.origin-network__node--kron {
  left: auto !important;
  right: -72px !important;
  top: 50% !important;
  bottom: auto !important;
  width: 145px !important;
  height: 145px !important;
  transform: translateY(-50%) !important;
  animation: kronCounterOrbitFinal 18s linear infinite !important;
}

.origin-network__node--kron img {
  transform: none !important;
  animation: none !important;
}

@keyframes kronOrbitFinal {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes kronCounterOrbitFinal {
  from { transform: translateY(-50%) rotate(0deg); }
  to { transform: translateY(-50%) rotate(-360deg); }
}

/* Ecosystem: two cards only, centered and wider. */
.ecosystem-grid--inside-origin.ecosystem-grid--two {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  max-width: 940px !important;
  gap: 26px !important;
  margin-inline: auto !important;
}

.ecosystem-grid--two .ecosystem-card {
  height: 510px !important;
  border-radius: 20px !important;
  overflow: hidden;
}

.ecosystem-grid--two .ecosystem-card__veil {
  background: linear-gradient(180deg, rgba(3,9,18,.26), rgba(3,9,18,.62) 54%, rgba(3,9,18,.92) 100%) !important;
}

.ecosystem-grid--two .ecosystem-card__content {
  padding: 48px 36px 32px !important;
}

.ecosystem-grid--two .ecosystem-card__content p {
  max-width: 390px;
  margin-inline: auto;
  font-size: 16px !important;
  line-height: 1.5 !important;
}

/* Testimonials: square cover on left, text on right, one under another. */
.testimonial-list {
  display: grid;
  gap: 22px;
  max-width: 960px;
  margin-inline: auto;
}

.testimonial-row {
  display: grid;
  grid-template-columns: 235px minmax(0, 1fr);
  gap: 34px;
  align-items: center;
  padding: 22px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.015));
  box-shadow: 0 22px 70px rgba(0,0,0,.18);
}

.testimonial-media {
  position: relative;
  width: 235px;
  height: 235px;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(34,215,242,.24);
  border-radius: 18px;
  background: #06101c;
  cursor: pointer;
}

.testimonial-media > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(.88) brightness(.78);
  transform: scale(1.04);
  transition: transform 280ms ease, filter 280ms ease;
}

.testimonial-media:hover > img {
  transform: scale(1.08);
  filter: saturate(1) brightness(.88);
}

.testimonial-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(3,12,22,.05), rgba(3,12,22,.26));
}

.testimonial-media__brand {
  position: absolute;
  z-index: 3;
  left: 16px;
  top: 16px;
  width: 96px;
}

.testimonial-media__brand img {
  width: 100%;
  filter: brightness(0) invert(1);
}

.testimonial-media .play-glyph {
  position: absolute;
  z-index: 4;
  left: 50%;
  top: 50%;
  width: 58px;
  height: 58px;
  transform: translate(-50%, -50%);
}

.testimonial-row__copy h3 {
  margin: 0 0 5px;
  color: #fff;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 22px;
  font-weight: 600;
}

.testimonial-row__copy > span {
  display: block;
  margin-bottom: 18px;
  color: var(--aqua);
  font-size: 16px;
  font-weight: 500;
}

.testimonial-row__copy blockquote {
  margin: 0 0 20px;
  color: rgba(255,255,255,.88);
  font-size: 18px;
  line-height: 1.58;
}

.testimonial-watch {
  min-height: 42px;
  padding: 0 20px;
  border: 1px solid rgba(31,240,192,.38);
  border-radius: 999px;
  background: rgba(31,240,192,.08);
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: background 220ms ease, border-color 220ms ease, transform 220ms ease;
}

.testimonial-watch:hover {
  transform: translateY(-2px);
  border-color: rgba(31,240,192,.72);
  background: rgba(31,240,192,.15);
}

/* Popup video. */
.video-modal {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: none;
  place-items: center;
  padding: 24px;
}

.video-modal.is-open {
  display: grid;
}

.video-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.82);
  backdrop-filter: blur(12px);
}

.video-modal__panel {
  position: relative;
  z-index: 2;
  width: min(920px, 94vw);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 22px;
  background: #05070b;
  box-shadow: 0 36px 120px rgba(0,0,0,.62);
}

.video-modal__frame {
  aspect-ratio: 16/9;
  overflow: hidden;
  border-radius: 22px;
}

.video-modal__frame iframe {
  width: 100%;
  height: 100%;
  border: 0;
}

.video-modal__close {
  position: absolute;
  z-index: 5;
  right: -14px;
  top: -14px;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 50%;
  background: #0b1020;
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}

body.video-modal-open { overflow: hidden; }

/* Partner roles/colors requested by client. */
.team-grid--three .team-role {
  display: block;
  margin: 2px 0 12px;
  color: rgba(255,255,255,.92);
  font-size: 16px;
  font-weight: 600;
}

.team-grid--three .team-card--carlos .team-card__body {
  background: linear-gradient(180deg, #22b9e7 0%, #218dcc 100%) !important;
}

.team-grid--three .team-card--sandra .team-card__body {
  background: linear-gradient(180deg, #7c35ed 0%, #5022b9 100%) !important;
}

.team-grid--three .team-card--marcelo .team-card__body {
  background: linear-gradient(180deg, #21d4b0 0%, #138b79 100%) !important;
}

/* Footer links added to the richer menu. */
.footer-menu a {
  display: inline-flex;
  color: inherit;
  font-size: inherit;
  line-height: inherit;
}

@media (max-width: 1180px) {
  .desktop-nav { gap: 11px !important; }
  .desktop-nav button,
  .desktop-nav .nav-link { font-size: 12px !important; }
}

@media (max-width: 980px) {
  .hero h1 {
    font-size: clamp(27px, 7.3vw, 34px) !important;
  }

  .context {
    margin-top: -132px !important;
    padding-top: 190px !important;
  }

  .context__head h2,
  .differences--story .differences__copy h2.story-balanced-title,
  .origin-final__copy h2.origin-final__title,
  .makers__heading h2,
  .blog--story h2,
  .contact--story .contact__copy h2 {
    font-size: 30px !important;
    line-height: 1.09 !important;
  }

  .context-stats {
    grid-template-columns: 1fr !important;
  }

  .context-stat {
    min-height: 0 !important;
  }

  .differences.differences--story {
    height: auto !important;
    min-height: 0 !important;
    padding: 58px 0 70px !important;
  }

  .differences--story .differences__grid {
    min-height: 0 !important;
    grid-template-columns: 1fr !important;
    gap: 20px;
  }

  .differences--story .differences__person {
    height: 440px !important;
  }

  .differences--story .differences__person img {
    left: 50% !important;
    bottom: -4px !important;
    width: min(88vw, 430px) !important;
    transform: translateX(-50%) !important;
  }

  .differences--story:hover .differences__person img {
    transform: translateX(-50%) scale(1.006) !important;
  }

  .differences--story .differences__copy {
    padding: 0 !important;
  }

  .origin-final__intro {
    grid-template-columns: 1fr !important;
    gap: 34px !important;
  }

  .origin-final__copy h2.origin-final__title {
    width: auto !important;
    max-width: 100% !important;
    text-wrap: balance !important;
  }

  .origin-final__title .origin-title-line {
    display: inline !important;
    white-space: normal !important;
  }

  .origin-final__title .origin-title-line + .origin-title-line::before {
    content: " " !important;
  }

  .origin-network {
    width: min(100%, 640px) !important;
    margin-inline: auto;
  }

  .ecosystem-grid--inside-origin.ecosystem-grid--two {
    grid-template-columns: 1fr !important;
    max-width: 540px !important;
  }

  .testimonial-row {
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 24px;
  }

  .testimonial-media {
    width: 190px;
    height: 190px;
  }
}

@media (max-width: 720px) {
  .context__head h2,
  .differences--story .differences__copy h2.story-balanced-title,
  .origin-final__copy h2.origin-final__title,
  .makers__heading h2,
  .blog--story h2,
  .contact--story .contact__copy h2 {
    font-size: 27px !important;
  }

  .context-stat strong {
    font-size: 31px !important;
  }

  .context-stat p,
  .context__head > p,
  .differences--story .differences__copy > p,
  .difference-pill,
  .origin-final__copy > p,
  .ecosystem-grid--two .ecosystem-card__content p,
  .testimonial-row__copy > span,
  .team-role {
    font-size: 16px !important;
  }

  .origin-network__orbit {
    width: 226px !important;
    height: 226px !important;
    margin-left: -113px !important;
    margin-top: -113px !important;
  }

  .origin-network__node--kron {
    right: -40px !important;
    width: 82px !important;
    height: 82px !important;
  }

  .testimonial-row {
    grid-template-columns: 1fr;
    padding: 18px;
  }

  .testimonial-media {
    width: min(100%, 320px);
    height: auto;
    aspect-ratio: 1;
    margin-inline: auto;
  }

  .testimonial-row__copy {
    text-align: center;
  }

  .testimonial-row__copy blockquote {
    font-size: 16px;
  }

  .video-modal { padding: 12px; }
  .video-modal__close { right: 4px; top: -52px; }
}

@media (max-width: 430px) {
  .hero h1 { font-size: 25px !important; }

  .context__head h2,
  .differences--story .differences__copy h2.story-balanced-title,
  .origin-final__copy h2.origin-final__title,
  .makers__heading h2,
  .blog--story h2,
  .contact--story .contact__copy h2 {
    font-size: 25px !important;
  }

  .origin-network {
    min-height: 545px !important;
  }

  .origin-stat--one { left: 4px !important; top: 20px !important; }
  .origin-stat--two { right: 4px !important; top: 42px !important; }
  .origin-stat--three { left: 8px !important; bottom: 30px !important; }
  .origin-stat--four { right: 8px !important; bottom: 16px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .origin-network__orbit,
  .origin-network__node--kron {
    animation-play-state: paused !important;
  }
}

/* The orbital motion is an intentional brand interaction requested for this
   section. Keep it perceptible even when the OS asks to reduce other motion. */
@media (prefers-reduced-motion: reduce) {
  .origin-network__orbit {
    animation: kronOrbitFinal 36s linear infinite !important;
  }
  .origin-network__node--kron {
    animation: kronCounterOrbitFinal 36s linear infinite !important;
  }
}

/* ========================================================================== */
/* CLIENT REVISION — 11/08/2026 — ajuste fino hero/orbita/sócios              */
/* ========================================================================== */

/* Hero -> Contexto
   A seção Contexto entra por cima da cauda da hero e começa transparente.
   Assim o vídeo continua visível durante a fusão e não existe uma linha reta
   marcando onde um bloco termina e o outro começa. */
.hero__bottom-fade {
  height: 330px !important;
  background: linear-gradient(
    180deg,
    rgba(33, 0, 62, 0) 0%,
    rgba(33, 0, 62, .10) 25%,
    rgba(33, 0, 62, .34) 54%,
    rgba(33, 0, 62, .68) 78%,
    #21003e 100%
  ) !important;
}

.context {
  margin-top: -285px !important;
  padding-top: 165px !important;
  background:
    radial-gradient(ellipse at 74% 12%, rgba(118, 26, 244, .24), transparent 42%),
    radial-gradient(ellipse at 12% 38%, rgba(24, 192, 229, .08), transparent 35%),
    linear-gradient(
      180deg,
      rgba(33, 0, 62, 0) 0px,
      rgba(33, 0, 62, .18) 68px,
      rgba(33, 0, 62, .54) 150px,
      #21003e 285px,
      #100b22 520px,
      #06090e 900px,
      #04070a 100%
    ) !important;
  box-shadow: none !important;
}

.context::before {
  top: -28px !important;
  left: -5% !important;
  right: -5% !important;
  height: 245px !important;
  background: linear-gradient(
    180deg,
    rgba(68, 7, 133, 0),
    rgba(68, 7, 133, .18) 38%,
    rgba(45, 3, 91, .36) 70%,
    rgba(33, 0, 62, .08)
  ) !important;
  filter: blur(28px) !important;
  opacity: .86;
}

.context::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  top: -105px;
  height: 265px;
  pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(54, 5, 107, .11) 55%, rgba(33, 0, 62, .18));
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 34%, #000 72%, transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0%, #000 34%, #000 72%, transparent 100%);
}

/* Órbita KRON
   Classes exclusivas evitam a cascata dos protótipos anteriores. O movimento
   é aplicado por requestAnimationFrame no script.js; o CSS define somente a
   geometria da órbita e da bolha. */
.origin-kron-orbit-system {
  position: absolute;
  z-index: 14;
  left: 50%;
  top: 50%;
  width: 405px;
  height: 405px;
  margin: -202.5px 0 0 -202.5px;
  border-radius: 50%;
  pointer-events: none;
  transform: rotate(0deg);
  transform-origin: 50% 50%;
  will-change: transform;
}

.origin-kron-orbit-bubble {
  position: absolute;
  right: -74px;
  top: 50%;
  width: 148px;
  height: 148px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  background:
    radial-gradient(circle at 28% 22%, rgba(255,255,255,.24), transparent 28%),
    radial-gradient(circle at 70% 78%, rgba(122,36,247,.22), transparent 40%),
    rgba(28, 10, 58, .69);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 18px 18px 48px rgba(255,255,255,.03),
    0 0 72px rgba(122,36,247,.28);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  transform: translateY(-50%) rotate(0deg);
  transform-origin: 50% 50%;
  will-change: transform;
}

.origin-kron-orbit-bubble__ring {
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 50%;
}

.origin-kron-orbit-bubble img {
  position: relative;
  z-index: 3;
  width: 101px;
  max-height: 52px;
  object-fit: contain;
  filter: brightness(0) invert(1);
  transform: none !important;
}

/* Sócios: paleta final + Ver perfil como botão. */
.team-grid--three .team-card--purple .team-card__body,
.team-grid--three .team-card--sandra .team-card__body {
  background: linear-gradient(160deg, #842ff0 0%, #5d24c8 56%, #3e1a92 100%) !important;
}

.team-grid--three .team-card--green .team-card__body,
.team-grid--three .team-card--marcelo .team-card__body {
  background: linear-gradient(160deg, #23d4b1 0%, #13a78d 54%, #0b7568 100%) !important;
}

.team-profile-link {
  min-width: 154px;
  min-height: 44px;
  margin-top: auto !important;
  padding: 0 22px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.26);
  border-radius: 999px;
  background: rgba(4, 11, 22, .82);
  box-shadow: 0 12px 30px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.08);
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  text-underline-offset: 0 !important;
  transition: transform 220ms ease, background 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

.team-profile-link:hover {
  transform: translateY(-2px);
  border-color: rgba(34,215,242,.62);
  background: #071728;
  color: #fff !important;
  box-shadow: 0 16px 36px rgba(0,0,0,.24), 0 0 0 3px rgba(34,215,242,.08);
}

.team-profile-link:focus-visible {
  outline: 2px solid #22d7f2;
  outline-offset: 3px;
}

@media (max-width: 980px) {
  .context {
    margin-top: -210px !important;
    padding-top: 145px !important;
    background:
      radial-gradient(ellipse at 74% 10%, rgba(118, 26, 244, .22), transparent 45%),
      linear-gradient(180deg, rgba(33,0,62,0) 0px, rgba(33,0,62,.48) 120px, #21003e 210px, #100b22 440px, #04070a 100%) !important;
  }

  .origin-kron-orbit-system {
    width: 300px;
    height: 300px;
    margin: -150px 0 0 -150px;
  }

  .origin-kron-orbit-bubble {
    right: -55px;
    width: 110px;
    height: 110px;
  }

  .origin-kron-orbit-bubble__ring { inset: 13px; }
  .origin-kron-orbit-bubble img { width: 76px; }
}

@media (max-width: 720px) {
  .context {
    margin-top: -165px !important;
    padding-top: 126px !important;
    background: linear-gradient(180deg, rgba(33,0,62,0) 0px, rgba(33,0,62,.48) 90px, #21003e 165px, #100b22 390px, #04070a 100%) !important;
  }

  .context::after {
    top: -72px;
    height: 190px;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }

  .origin-kron-orbit-system {
    width: 226px;
    height: 226px;
    margin: -113px 0 0 -113px;
  }

  .origin-kron-orbit-bubble {
    right: -41px;
    width: 82px;
    height: 82px;
  }

  .origin-kron-orbit-bubble__ring { inset: 10px; }
  .origin-kron-orbit-bubble img { width: 57px; }

  .team-profile-link {
    min-width: 146px;
    min-height: 43px;
  }
}

/* Layer order mirrors the BeMinder Origin reference: stats below orbit,
   KRON orbit above stats, Kronberg nucleus above everything. */
.origin-stats--orbit { z-index: 20 !important; }
.origin-kron-orbit-system { z-index: 30 !important; }
.origin-network__node--kronberg { z-index: 40 !important; }

/* ========================================================================== */
/* KRON — client fine tuning 11/08/2026 v3                                   */
/* ========================================================================== */

/* Hero headline follows the same scale as the other main section headlines. */
@media (min-width: 981px) {
  .hero h1 {
    font-size: clamp(31px, 2.65vw, 40px) !important;
    line-height: 1.07 !important;
    max-width: 900px !important;
  }
}

/* Fine blur only at the visual seam between Hero and Contexto. */
.hero {
  isolation: isolate;
}

.hero::after {
  content: "";
  position: absolute;
  z-index: 4;
  left: -3%;
  right: -3%;
  bottom: 0;
  height: 145px;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    rgba(33,0,62,0) 0%,
    rgba(33,0,62,.10) 28%,
    rgba(33,0,62,.34) 58%,
    rgba(33,0,62,.60) 78%,
    rgba(33,0,62,.76) 100%
  );
  filter: blur(22px);
  transform: scaleX(1.025);
  opacity: .90;
}

.hero__bottom-fade {
  height: 360px !important;
  filter: blur(9px) !important;
  transform: translateY(8px) scaleX(1.015) !important;
  transform-origin: bottom center;
}

.context::before {
  filter: blur(58px) !important;
  opacity: .72 !important;
}

/* Keep 20% x 80% on a single line. */
.context-stats .context-stat:nth-child(3) strong {
  display: block;
  white-space: nowrap !important;
  font-size: clamp(29px, 2.35vw, 36px) !important;
  letter-spacing: -0.035em !important;
}

/* Partner cards — final palette and a little more breathing room above button. */
#quem-faz .team-grid--three > div:nth-child(2) .team-card__body,
#quem-faz .team-card--sandra .team-card__body {
  background: linear-gradient(160deg, #842ff0 0%, #6728d4 52%, #4b1da4 100%) !important;
}

#quem-faz .team-grid--three > div:nth-child(3) .team-card__body,
#quem-faz .team-card--marcelo .team-card__body {
  background: linear-gradient(160deg, #27d7b4 0%, #16ad92 52%, #0b7768 100%) !important;
}

#quem-faz .team-card__body {
  padding-bottom: 20px !important;
}

#quem-faz .team-profile-link {
  margin-top: auto !important;
  margin-bottom: -7px !important;
}

/* Footer navigation follows the same order as the header: first column is read
   top-to-bottom, then it continues in the second column. */
.footer--story .footer-menu:not(.footer-menu--solutions) {
  display: grid !important;
  grid-template-rows: repeat(5, minmax(30px, auto)) !important;
  grid-template-columns: repeat(2, minmax(150px, 1fr)) !important;
  grid-auto-flow: column !important;
  gap: 9px 30px !important;
  align-items: start;
}

.footer--story .footer-menu:not(.footer-menu--solutions) button,
.footer--story .footer-menu:not(.footer-menu--solutions) a {
  width: max-content !important;
  max-width: 100% !important;
  min-height: 30px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: rgba(255,255,255,.82) !important;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  text-align: left !important;
  text-decoration: none !important;
  cursor: pointer;
}

.footer--story .footer-menu:not(.footer-menu--solutions) button:hover,
.footer--story .footer-menu:not(.footer-menu--solutions) a:hover {
  color: var(--aqua, #24ddec) !important;
  transform: translateX(4px);
}

/* Native validation affordance for the phone field. */
#contact-form input[name="phone"]:invalid:not(:placeholder-shown) {
  border-color: rgba(255, 91, 112, .76) !important;
  box-shadow: 0 0 0 3px rgba(255, 91, 112, .08);
}

#contact-form input[name="phone"]:valid:not(:placeholder-shown) {
  border-color: rgba(31, 240, 192, .54) !important;
}

@media (max-width: 980px) {
  .hero::after {
    bottom: -24px;
    height: 115px;
    filter: blur(18px);
  }

  .hero__bottom-fade {
    filter: blur(7px) !important;
  }
}

@media (max-width: 720px) {
  .footer--story .footer-menu:not(.footer-menu--solutions) {
    grid-template-rows: none !important;
    grid-template-columns: 1fr !important;
    grid-auto-flow: row !important;
    gap: 8px !important;
  }

  .context-stats .context-stat:nth-child(3) strong {
    font-size: 30px !important;
  }
}

/* ========================================================================== */
/* KRON — ajuste fino Hero -> Contexto v4                                     */
/* A transição deixa de usar uma faixa com blur e passa a ser uma fusão       */
/* progressiva por transparência/máscara, como no mockup do Figma.            */
/* ========================================================================== */

/* Remove a faixa borrada que estava denunciando a divisão da Hero. */
.hero::after {
  display: none !important;
  content: none !important;
}

/* O vídeo vai sendo tingido de roxo gradualmente, sem uma borda definida. */
.hero__bottom-fade {
  height: 430px !important;
  bottom: -1px !important;
  filter: none !important;
  transform: none !important;
  opacity: 1 !important;
  background:
    radial-gradient(ellipse at 68% 100%, rgba(112, 22, 225, .34) 0%, rgba(77, 9, 154, .18) 34%, transparent 67%),
    radial-gradient(ellipse at 24% 112%, rgba(32, 152, 220, .10) 0%, transparent 58%),
    linear-gradient(
      180deg,
      rgba(31, 0, 55, 0) 0%,
      rgba(31, 0, 55, .025) 13%,
      rgba(34, 0, 62, .08) 28%,
      rgba(36, 0, 68, .19) 44%,
      rgba(37, 0, 72, .38) 61%,
      rgba(37, 0, 72, .66) 78%,
      #250048 100%
    ) !important;
}

/* A própria seção Contexto entra gradualmente por cima da Hero. A máscara
   elimina qualquer linha horizontal mesmo quando o vídeo muda de frame. */
.context {
  margin-top: -305px !important;
  padding-top: 245px !important;
  background:
    radial-gradient(ellipse at 72% 0%, rgba(119, 30, 238, .22), transparent 42%),
    radial-gradient(ellipse at 12% 24%, rgba(27, 172, 226, .07), transparent 34%),
    linear-gradient(
      180deg,
      #250048 0px,
      #21003f 180px,
      #150b2a 430px,
      #090b18 720px,
      #04070a 100%
    ) !important;
  -webkit-mask-image: linear-gradient(
    180deg,
    transparent 0px,
    rgba(0,0,0,.10) 42px,
    rgba(0,0,0,.42) 94px,
    rgba(0,0,0,.78) 148px,
    #000 205px,
    #000 100%
  );
  mask-image: linear-gradient(
    180deg,
    transparent 0px,
    rgba(0,0,0,.10) 42px,
    rgba(0,0,0,.42) 94px,
    rgba(0,0,0,.78) 148px,
    #000 205px,
    #000 100%
  );
}

/* Esses dois layers antigos eram justamente os responsáveis pelo aspecto de
   faixa/blur horizontal perceptível no print. */
.context::before,
.context::after {
  display: none !important;
  content: none !important;
}

@media (max-width: 980px) {
  .hero__bottom-fade {
    height: 350px !important;
  }

  .context {
    margin-top: -245px !important;
    padding-top: 205px !important;
    -webkit-mask-image: linear-gradient(180deg, transparent 0px, rgba(0,0,0,.18) 38px, rgba(0,0,0,.58) 88px, #000 145px, #000 100%);
    mask-image: linear-gradient(180deg, transparent 0px, rgba(0,0,0,.18) 38px, rgba(0,0,0,.58) 88px, #000 145px, #000 100%);
  }
}

@media (max-width: 720px) {
  .hero__bottom-fade {
    height: 285px !important;
  }

  .context {
    margin-top: -185px !important;
    padding-top: 165px !important;
    -webkit-mask-image: linear-gradient(180deg, transparent 0px, rgba(0,0,0,.26) 34px, rgba(0,0,0,.70) 72px, #000 116px, #000 100%);
    mask-image: linear-gradient(180deg, transparent 0px, rgba(0,0,0,.26) 34px, rgba(0,0,0,.70) 72px, #000 116px, #000 100%);
  }
}


/* =========================================================
   AJUSTE LOCAL — DEPOIMENTOS COM CAPAS 1:1 + VÍDEO 9:16
   Não altera Hero nem Contexto.
   ========================================================= */
.testimonial-media > img {
  filter: none !important;
  transform: none !important;
}
.testimonial-media:hover > img {
  transform: scale(1.025) !important;
  filter: none !important;
}
.testimonial-media::after {
  background: linear-gradient(180deg, rgba(3,12,22,0), rgba(3,12,22,.12)) !important;
}
.testimonial-media__brand { display:none !important; }
.video-modal__frame video {
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  background:#000;
  border:0;
}
.video-modal__panel.is-vertical {
  width:min(430px, 92vw);
}
.video-modal__frame.is-vertical {
  aspect-ratio:9/16;
  max-height:84vh;
  margin-inline:auto;
}
.video-modal__frame.is-vertical iframe,
.video-modal__frame.is-vertical video {
  width:100%;
  height:100%;
}
@media (max-width:640px){
  .video-modal__panel.is-vertical { width:min(390px, 92vw); }
  .video-modal__frame.is-vertical { max-height:78vh; }
}


/* ========================================================================== */
/* KRON — ajustes finais de conteúdo / blog / sócios / mobile — 11/08/2026   */
/* ========================================================================== */

/* Blog Home: imagem + título + resumo sempre visíveis. */
.blog--story .blog-grid {
  align-items: stretch;
}

.blog--story .blog-card {
  display: flex !important;
  flex-direction: column !important;
  height: 510px !important;
  background: rgba(18, 20, 27, .96) !important;
}

.blog--story .blog-card__cover {
  display: block !important;
  flex: 0 0 210px !important;
  height: 210px !important;
  background: #0b1020 !important;
}

.blog--story .blog-card__cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

.blog--story .blog-card__body {
  display: flex !important;
  flex: 1 1 auto !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 20px 20px 22px !important;
}

.blog--story .blog-card h4 {
  display: -webkit-box;
  overflow: hidden;
  margin: 0 0 12px !important;
  color: #1debd1 !important;
  font-size: 18px !important;
  line-height: 1.26 !important;
  font-weight: 700 !important;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.blog--story .blog-card p {
  display: -webkit-box;
  overflow: hidden;
  margin: 0 0 18px !important;
  color: rgba(255,255,255,.88) !important;
  font-size: 18px !important;
  line-height: 1.48 !important;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}

.blog--story .blog-card .gradient-button--link {
  margin-top: auto;
  font-size: 16px !important;
}

/* Sócios: card inteiro abre o modal, sem perder o botão visual. */
.team-card--profile {
  cursor: pointer;
}
.team-card--profile:focus-visible {
  outline: 2px solid #22d7f2;
  outline-offset: 5px;
}
.team-profile-link {
  font-family: "Poppins", Arial, sans-serif;
  cursor: pointer;
}

/* Modal de perfil. */
.profile-modal {
  position: fixed;
  z-index: 1200;
  inset: 0;
  display: none;
  place-items: center;
  padding: 24px;
}
.profile-modal.is-open { display: grid; }
.profile-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.80);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.profile-modal__panel {
  position: relative;
  z-index: 2;
  width: min(680px, 94vw);
  padding: 42px 44px 40px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 26px;
  background:
    radial-gradient(circle at 100% 0%, rgba(108,53,255,.18), transparent 38%),
    linear-gradient(145deg, #0b1020, #060914 76%);
  box-shadow: 0 36px 120px rgba(0,0,0,.58);
}
.profile-modal__close {
  position: absolute;
  right: 18px;
  top: 16px;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  background: rgba(5,11,22,.78);
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}
.profile-modal__label {
  display: block;
  margin-bottom: 12px;
  color: #1ff0c0;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .10em;
  text-transform: uppercase;
}
.profile-modal h2 {
  margin: 0 56px 14px 0;
  color: #22d7f2;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 34px;
  line-height: 1.05;
  font-weight: 400;
}
.profile-modal__lead {
  margin: 0 0 20px;
  color: #fff;
  font-size: 20px;
  line-height: 1.48;
  font-weight: 600;
}
.profile-modal__bio {
  margin: 0 0 28px;
  color: rgba(255,255,255,.82);
  font-size: 18px;
  line-height: 1.65;
}
body.profile-modal-open { overflow: hidden; }

/* Modal de vídeo YouTube vertical. */
.video-modal__notice {
  min-height: 360px;
  display: grid;
  place-items: center;
  padding: 32px;
  color: rgba(255,255,255,.78);
  font-size: 16px;
  line-height: 1.5;
  text-align: center;
}
.video-modal__notice[hidden] { display: none !important; }
.video-modal__panel.is-vertical {
  width: min(430px, 92vw) !important;
}
.video-modal__frame.is-vertical {
  aspect-ratio: 9 / 16 !important;
  max-height: 84vh;
  margin-inline: auto;
}
.video-modal__frame.is-vertical iframe {
  width: 100%;
  height: 100%;
}

/* Validação visual também para e-mail. */
#contact-form input[name="email"]:invalid:not(:placeholder-shown) {
  border-color: rgba(255, 91, 112, .76) !important;
  box-shadow: 0 0 0 3px rgba(255, 91, 112, .08);
}
#contact-form input[name="email"]:valid:not(:placeholder-shown) {
  border-color: rgba(31, 240, 192, .54) !important;
}

/* Desktop: textos que estavam em 16 px passam para 18 px. */
@media (min-width: 981px) {
  .hero p,
  .context__head > p,
  .context-stat p,
  .differences--story .differences__copy > p,
  .differences--story .difference-pill,
  .origin-final__copy > p,
  .ecosystem-card__content p,
  .testimonial-row__copy > span,
  .testimonial-row__copy blockquote,
  .team-role,
  .team-card__body p,
  .contact--story .contact__copy p,
  .contact-card input,
  .contact-card textarea,
  .footer--story .footer-menu button,
  .footer--story .footer-menu a,
  .footer__legal,
  .gradient-button,
  .testimonial-watch,
  .team-profile-link {
    font-size: 18px !important;
  }
}

@media (max-width: 720px) {
  /* Menos distância entre Hero e Contexto, sem mexer na transição desktop. */
  .context {
    margin-top: -220px !important;
    padding-top: 138px !important;
  }

  /* Sessão 4: imagem começa mais cedo e ocupa melhor o primeiro viewport. */
  .differences.differences--story {
    padding-top: 28px !important;
  }
  .differences--story .differences__person {
    height: 375px !important;
    margin-top: -62px !important;
  }
  .differences--story .differences__person img {
    bottom: 10px !important;
    width: min(91vw, 430px) !important;
  }

  .differences--story .differences__copy > p,
  .differences--story .difference-turn,
  .differences--story .difference-pill {
    font-size: 14px !important;
    line-height: 1.48 !important;
  }

  .blog--story .blog-card {
    height: 500px !important;
  }
  .blog--story .blog-card__cover {
    flex-basis: 205px !important;
    height: 205px !important;
  }
  .blog--story .blog-card h4 {
    font-size: 17px !important;
  }
  .blog--story .blog-card p {
    font-size: 16px !important;
    -webkit-line-clamp: 4;
  }

  .profile-modal__panel {
    padding: 34px 24px 28px;
    border-radius: 22px;
  }
  .profile-modal h2 { font-size: 28px; }
  .profile-modal__lead { font-size: 17px; }
  .profile-modal__bio { font-size: 16px; }
}

/* ========================================================================== */
/* KRON refinement — 11/08/2026 v6: sócios, blog e ajuste mobile da sessão 4 */
/* ========================================================================== */

/* Sócios: nome legível, sem negrito excessivo. */
#quem-faz .team-grid--three .team-card__body h3 {
  font-family: "Poppins", Arial, sans-serif;
  font-weight: 600 !important;
  letter-spacing: -0.015em !important;
}

/* Modal dos sócios com foto + conteúdo. */
.profile-modal__panel {
  width: min(900px, 94vw) !important;
  padding: 0 !important;
  overflow: hidden;
}

.profile-modal__layout {
  display: grid;
  grid-template-columns: minmax(260px, 330px) minmax(0, 1fr);
  min-height: 480px;
}

.profile-modal__media {
  position: relative;
  min-height: 100%;
  overflow: hidden;
  background: #08111d;
}

.profile-modal__media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(3,9,18,.03), rgba(3,9,18,.12));
}

.profile-modal__media img {
  width: 100%;
  height: 100%;
  min-height: 480px;
  display: block;
  object-fit: cover;
  object-position: center top;
}

.profile-modal__content {
  padding: 42px 44px 40px;
  align-self: center;
}

/* Blog Home: tipografia Poppins no padrão do site, e recorte limpo. */
.blog--story .blog-card h4 {
  font-family: "Poppins", Arial, sans-serif;
  font-size: 17px !important;
  line-height: 1.28 !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
  -webkit-line-clamp: 3 !important;
}

.blog--story .blog-card p {
  font-family: "Poppins", Arial, sans-serif;
  font-size: 16px !important;
  line-height: 1.52 !important;
  font-weight: 400 !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
  -webkit-line-clamp: 4 !important;
}

@media (min-width: 981px) {
  /* Exceção proposital ao ajuste global de 18px: resumo de blog deve ficar
     no tamanho editorial padrão para não pesar nos cards. */
  .blog--story .blog-card p {
    font-size: 16px !important;
  }
}

@media (max-width: 720px) {
  /* Sessão 4: desce um pouco a imagem em relação à rodada anterior. */
  .differences--story .differences__person {
    margin-top: -30px !important;
  }

  .differences--story .differences__person img {
    bottom: -8px !important;
  }

  .profile-modal__panel {
    width: min(94vw, 560px) !important;
    max-height: 88vh;
    overflow-y: auto;
  }

  .profile-modal__layout {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .profile-modal__media {
    min-height: 290px;
    max-height: 330px;
  }

  .profile-modal__media img {
    min-height: 290px;
    height: 330px;
    object-position: center 18%;
  }

  .profile-modal__content {
    padding: 28px 24px 30px;
  }

  .blog--story .blog-card h4 {
    font-size: 16px !important;
    line-height: 1.3 !important;
  }

  .blog--story .blog-card p {
    font-size: 15px !important;
    line-height: 1.5 !important;
  }
}

/* ========================================================================== */
/* KRON — alterações finais cliente 31/08/2026                               */
/* ========================================================================== */

/* Ritmo geral: blocos mais próximos e transições menos secas. */
.context,
.differences.differences--story,
.solutions.solutions--story,
.origin-final,
.makers.makers--story,
.blog.blog--story,
.contact.contact--story,
.faq.faq--story {
  position: relative;
}

.differences.differences--story,
.solutions.solutions--story,
.origin-final,
.makers.makers--story,
.blog.blog--story,
.contact.contact--story,
.faq.faq--story {
  box-shadow:
    inset 0 38px 70px rgba(3, 7, 15, .12),
    inset 0 -38px 70px rgba(3, 7, 15, .12);
}

/* HERO — nova promessa, provas e dois CTAs. */
@media (min-width: 981px) {
  .hero {
    min-height: 860px !important;
    height: 860px !important;
  }

  .hero__content {
    align-items: center !important;
    padding-top: 72px !important;
    padding-bottom: 150px !important;
  }

  .hero-copy {
    width: min(760px, 58vw) !important;
  }

  .hero h1 {
    max-width: 720px !important;
    font-size: clamp(36px, 3.15vw, 48px) !important;
    line-height: 1.06 !important;
  }

  .hero .hero-support {
    max-width: 700px !important;
    margin-bottom: 24px !important;
    font-size: 18px !important;
    line-height: 1.55 !important;
  }
}

.hero-proof {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  width: min(760px, 100%);
  margin: 4px 0 22px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(5, 11, 22, .34);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.hero-proof__item {
  min-height: 92px;
  padding: 18px 18px 16px;
  border-right: 1px solid rgba(255,255,255,.09);
}
.hero-proof__item:last-child { border-right: 0; }
.hero-proof__item strong {
  display: block;
  margin-bottom: 5px;
  color: #22d7f2;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 20px;
  line-height: 1.05;
  font-weight: 400;
}
.hero-proof__item span {
  display: block;
  color: rgba(255,255,255,.78);
  font-size: 13px;
  line-height: 1.35;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.secondary-button,
.secondary-button--link {
  min-height: 50px;
  padding: 0 27px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 999px;
  background: rgba(6, 12, 23, .38);
  color: #fff;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
.secondary-button:hover,
.secondary-button--link:hover {
  transform: translateY(-2px);
  border-color: rgba(31,240,192,.72);
  background: rgba(17, 39, 52, .68);
}

/* CONTEXTO — texto e dados finais do cliente. */
.context {
  padding-bottom: 82px !important;
}
.context__head h2 {
  max-width: 900px !important;
}
.context-stat strong {
  font-size: clamp(28px, 2.15vw, 35px) !important;
}
.context-stat p {
  font-size: 15px !important;
  line-height: 1.5 !important;
}
.context__sources {
  max-width: 1050px;
}
.context__turn {
  margin-top: 48px !important;
  padding: 0 !important;
  text-align: center;
}
.context__turn strong {
  display: block;
  max-width: 900px;
  margin-inline: auto;
  font-family: "Poppins", Arial, sans-serif;
  font-size: clamp(22px, 2vw, 30px) !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
}

/* POR QUE A KRON — composição diversa usando os assets já existentes. */
.differences.differences--story {
  height: auto !important;
  min-height: 720px !important;
  padding: 54px 0 50px !important;
}
.differences--story .differences__grid {
  min-height: 610px !important;
}
.differences__person--diverse {
  position: relative !important;
  height: 600px !important;
  overflow: visible !important;
}
.differences__person--diverse .differences__person-main {
  position: absolute !important;
  left: -118px !important;
  bottom: -56px !important;
  width: 560px !important;
  height: auto !important;
  z-index: 1;
  object-fit: contain !important;
}
.differences__person--diverse .differences__person-accent {
  position: absolute !important;
  left: 145px !important;
  bottom: -34px !important;
  width: 300px !important;
  height: auto !important;
  z-index: 2;
  object-fit: contain !important;
  filter: drop-shadow(0 24px 35px rgba(0,0,0,.34));
}
.differences--story .differences__copy {
  padding-top: 0 !important;
}
.differences--story .differences__copy h2.story-balanced-title {
  max-width: 720px !important;
  font-size: clamp(30px, 2.45vw, 37px) !important;
}
.differences--story .differences__copy > p {
  max-width: 680px !important;
}
.differences--story .difference-list {
  gap: 8px !important;
}
.differences--story .difference-pill {
  min-height: 45px !important;
  padding: 10px 18px !important;
}

/* SOLUÇÕES — cards com especificação completa sem perder legibilidade. */
.solutions.solutions--story {
  padding: 72px 0 !important;
}
.solutions-grid--detailed {
  gap: 22px !important;
}
.solutions-grid--detailed .solution-card {
  min-height: 780px !important;
  height: 780px !important;
}
.solutions-grid--detailed .solution-card__content {
  justify-content: flex-end !important;
  padding: 38px 38px 34px !important;
}
.solutions-grid--detailed .solution-logo {
  max-height: 58px !important;
  margin-bottom: 17px !important;
}
.solutions-grid--detailed .solution-card__content h3 {
  margin-bottom: 12px !important;
  font-size: 21px !important;
  line-height: 1.25 !important;
}
.solutions-grid--detailed .solution-card__content > p {
  margin-bottom: 18px !important;
  font-size: 16px !important;
  line-height: 1.48 !important;
}
.solution-specs {
  width: 100%;
  margin: 0 0 22px;
  padding: 15px 16px;
  display: grid;
  gap: 8px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 16px;
  background: rgba(3, 8, 17, .55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  text-align: left;
}
.solution-specs div {
  display: grid;
  grid-template-columns: 105px minmax(0, 1fr);
  gap: 10px;
}
.solution-specs dt,
.solution-specs dd {
  margin: 0;
  font-size: 13px;
  line-height: 1.38;
}
.solution-specs dt {
  color: #1ff0c0;
  font-weight: 700;
}
.solution-specs dd {
  color: rgba(255,255,255,.86);
  font-weight: 400;
}
.solutions-grid--detailed .solution-card .gradient-button {
  width: 100% !important;
  font-size: 14px !important;
}

/* ORIGEM — nova mensagem e provas. */
.origin-final {
  padding: 76px 0 70px !important;
}
@media (min-width: 981px) {
  .origin-final__intro {
    grid-template-columns: minmax(0, .90fr) minmax(520px, 1.10fr) !important;
    gap: 62px !important;
  }
  .origin-final__copy h2.origin-final__title {
    width: 610px !important;
    max-width: 610px !important;
    font-size: clamp(31px, 2.45vw, 37px) !important;
  }
  .origin-final__title .origin-title-line {
    white-space: normal !important;
  }
}
.origin-final__copy > p {
  max-width: 610px !important;
}
.origin-final__tagline {
  margin-bottom: 0 !important;
}
.origin-stat strong {
  font-size: clamp(27px, 2.2vw, 35px) !important;
}
.origin-stat span {
  font-size: 12px !important;
}

/* ECOSSISTEMA — introdução + três frentes. */
.origin-subsection.ecosystem-section {
  margin-top: 70px !important;
  padding-top: 58px !important;
}
.ecosystem-heading {
  max-width: 1080px;
  margin-bottom: 30px;
}
.ecosystem-heading h2 {
  margin: 0 0 10px !important;
}
.ecosystem-heading h3 {
  margin: 0 0 24px;
  color: #fff;
  font-family: "Poppins", Arial, sans-serif;
  font-size: clamp(25px, 2vw, 31px);
  line-height: 1.15;
  font-weight: 400;
}
.ecosystem-intro-copy {
  padding: 22px 24px;
  display: grid;
  gap: 10px;
  border-left: 2px solid #1ff0c0;
  background: linear-gradient(90deg, rgba(31,240,192,.065), transparent 75%);
}
.ecosystem-intro-copy p {
  margin: 0;
  color: rgba(255,255,255,.82);
  font-size: 16px;
  line-height: 1.52;
}
.ecosystem-grid--three-final {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
}
.ecosystem-grid--three-final .ecosystem-card--compact {
  min-height: 420px !important;
  height: 420px !important;
}
.ecosystem-grid--three-final .ecosystem-card__content {
  justify-content: flex-end !important;
  padding: 28px 26px !important;
  text-align: left !important;
}
.ecosystem-grid--three-final .ecosystem-card__content > img {
  align-self: flex-start;
  max-width: 170px !important;
  max-height: 52px !important;
  margin-bottom: 12px !important;
}
.ecosystem-card__type {
  display: block;
  margin-bottom: 14px;
  color: #1ff0c0;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.ecosystem-grid--three-final .ecosystem-card__content p {
  margin: 0 0 18px !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  text-align: left !important;
}
.ecosystem-text-link {
  align-self: flex-start;
  padding: 0;
  border: 0;
  background: transparent;
  color: #1ff0c0;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}
.ecosystem-text-link:hover { color: #fff; }

/* DEPOIMENTOS — quote card por padrão, vídeo no hover/click. */
.origin-testimonials {
  margin-top: 64px !important;
  padding-top: 56px !important;
}
.testimonial-heading h2 {
  margin-bottom: 26px !important;
}
.testimonial-hover-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.testimonial-hover-card {
  position: relative;
  min-height: 285px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(12,20,35,.94), rgba(9,11,25,.94));
  cursor: pointer;
  isolation: isolate;
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}
.testimonial-hover-card:hover,
.testimonial-hover-card:focus-visible {
  transform: translateY(-4px);
  border-color: rgba(31,240,192,.44);
  box-shadow: 0 22px 60px rgba(0,0,0,.25);
  outline: 0;
}
.testimonial-hover-card__copy {
  position: relative;
  z-index: 2;
  min-height: 285px;
  padding: 34px 34px 30px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: opacity .28s ease, transform .28s ease;
}
.testimonial-hover-card blockquote {
  margin: 0 0 28px;
  color: rgba(255,255,255,.92);
  font-size: 19px;
  line-height: 1.55;
  font-weight: 500;
}
.testimonial-person {
  display: flex;
  align-items: center;
  gap: 12px;
}
.testimonial-person__avatar {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(135deg, #187ee7, #23d8ef);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}
.testimonial-person__avatar--purple { background: linear-gradient(135deg, #6933f2, #9b4cff); }
.testimonial-person strong,
.testimonial-person span { display: block; }
.testimonial-person strong { color: #fff; font-size: 15px; }
.testimonial-person span { margin-top: 2px; color: rgba(255,255,255,.62); font-size: 12px; }
.testimonial-hover-card__media {
  position: absolute;
  z-index: 3;
  inset: 0;
  opacity: 0;
  transform: scale(1.04);
  transition: opacity .32s ease, transform .42s ease;
  background: #06111e;
}
.testimonial-hover-card__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(4,10,18,.08), rgba(4,10,18,.58));
}
.testimonial-hover-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 32%;
}
.testimonial-hover-card__media .play-glyph {
  position: absolute;
  z-index: 5;
  left: 50%;
  top: 48%;
  width: 68px;
  height: 68px;
  transform: translate(-50%, -50%);
}
.testimonial-hover-card__watch {
  position: absolute;
  z-index: 5;
  left: 50%;
  bottom: 24px;
  transform: translateX(-50%);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}
.testimonial-hover-card:hover .testimonial-hover-card__media,
.testimonial-hover-card:focus-visible .testimonial-hover-card__media {
  opacity: 1;
  transform: scale(1);
}
.testimonial-hover-card:hover .testimonial-hover-card__copy,
.testimonial-hover-card:focus-visible .testimonial-hover-card__copy {
  opacity: .08;
  transform: translateY(6px);
}
.testimonial-case-cta {
  margin-top: 22px;
}

/* SÓCIOS — textos finais. */
.team-card__body p {
  line-height: 1.5 !important;
}

/* FORMULÁRIO — campos finais e feedback por campo. */
.contact.contact--story {
  padding-block: 72px !important;
}
.contact-card form {
  gap: 12px !important;
}
.form-field {
  position: relative;
}
.contact-card input,
.contact-card textarea,
.contact-card select {
  width: 100%;
  min-height: 56px;
  padding: 0 18px;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 18px;
  background: rgba(7, 9, 13, .55);
  color: #fff;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 16px;
  outline: none;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.contact-card textarea {
  min-height: 132px;
  padding-top: 16px;
  resize: vertical;
}
.contact-card select {
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(255,255,255,.7) 50%),
    linear-gradient(135deg, rgba(255,255,255,.7) 50%, transparent 50%);
  background-position: calc(100% - 22px) 24px, calc(100% - 16px) 24px;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}
.contact-card select:invalid { color: rgba(255,255,255,.42); }
.contact-card select option { color: #111; }
.contact-card input:focus,
.contact-card textarea:focus,
.contact-card select:focus {
  border-color: rgba(31,240,192,.7);
  box-shadow: 0 0 0 3px rgba(31,240,192,.08);
}
.field-error {
  display: none;
  padding: 6px 8px 0;
  color: #ff8d9c;
  font-size: 12px;
  line-height: 1.3;
}
.form-field.has-error .field-error { display: block; }
.form-field.has-error input,
.form-field.has-error textarea,
.form-field.has-error select {
  border-color: rgba(255,91,112,.78) !important;
}

/* FAQ com busca e accordion. */
.faq.faq--story {
  padding: 78px 0 84px;
  background:
    radial-gradient(circle at 85% 15%, rgba(77, 37, 168, .16), transparent 30%),
    linear-gradient(180deg, #090d17, #05070b);
}
.faq__inner {
  max-width: 1120px !important;
}
.faq__heading {
  max-width: 760px;
  margin-bottom: 26px;
}
.faq__heading h2 {
  margin: 0 0 10px;
  color: #22d7f2;
  font-family: "Poppins", Arial, sans-serif;
  font-size: clamp(30px, 2.6vw, 40px);
  line-height: 1.08;
  font-weight: 400;
}
.faq__heading p {
  margin: 0;
  color: rgba(255,255,255,.78);
  font-size: 17px;
}
.faq-search-wrap {
  margin-bottom: 22px;
}
.faq-search {
  height: 58px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 18px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 18px;
  background: rgba(13,20,34,.82);
}
.faq-search > span {
  color: #1ff0c0;
  font-size: 25px;
}
.faq-search input {
  flex: 1;
  height: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #fff;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 16px;
}
.faq-search-status {
  display: block;
  min-height: 18px;
  margin-top: 8px;
  color: rgba(255,255,255,.55);
  font-size: 12px;
}
.faq-list {
  display: grid;
  gap: 10px;
}
.faq-item {
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 16px;
  background: rgba(12,18,31,.72);
}
.faq-item[hidden] { display: none !important; }
.faq-question {
  width: 100%;
  min-height: 64px;
  padding: 16px 19px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border: 0;
  background: transparent;
  color: #fff;
  text-align: left;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}
.faq-icon {
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(31,240,192,.25);
  border-radius: 50%;
  color: #1ff0c0;
  font-size: 19px;
  transition: transform .2s ease;
}
.faq-answer {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .28s ease;
}
.faq-answer > p {
  min-height: 0;
  overflow: hidden;
  margin: 0;
  padding: 0 19px;
  color: rgba(255,255,255,.76);
  font-size: 15px;
  line-height: 1.6;
  transition: padding .28s ease;
}
.faq-item.is-open .faq-answer { grid-template-rows: 1fr; }
.faq-item.is-open .faq-answer > p { padding: 0 19px 20px; }
.faq-item.is-open .faq-icon { transform: rotate(45deg); }

/* Menos respiro vertical entre os blocos principais. */
.makers.makers--story { padding-block: 72px !important; }
.blog.blog--story { padding-block: 72px !important; }
.origin-final__inner > .origin-subsection { margin-bottom: 0 !important; }

/* Transições internas suaves sem interferir na transição Hero -> Contexto já aprovada. */
.differences.differences--story::after,
.solutions.solutions--story::before,
.solutions.solutions--story::after,
.origin-final::after,
.makers.makers--story::after,
.blog.blog--story::after,
.contact.contact--story::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 54px;
  pointer-events: none;
  z-index: 5;
}
.differences.differences--story::after,
.solutions.solutions--story::after,
.origin-final::after,
.makers.makers--story::after,
.blog.blog--story::after,
.contact.contact--story::after {
  bottom: -1px;
  background: linear-gradient(180deg, transparent, rgba(4,7,11,.26));
}
.solutions.solutions--story::before {
  top: -1px;
  background: linear-gradient(180deg, rgba(4,7,11,.22), transparent);
}

/* Mobile */
@media (max-width: 980px) {
  .hero {
    min-height: 830px !important;
    height: auto !important;
  }
  .hero__content {
    padding-top: 122px !important;
    padding-bottom: 180px !important;
  }
  .hero h1 {
    font-size: clamp(27px, 8.3vw, 38px) !important;
  }
  .hero .hero-support {
    max-width: 100% !important;
  }
  .hero-proof {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 18px;
  }
  .hero-proof__item:nth-child(2) { border-right: 0; }
  .hero-proof__item:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.09); }
  .hero-proof__item strong { font-size: 18px; }
  .hero-actions { gap: 10px; }
  .hero-actions .gradient-button,
  .hero-actions .secondary-button { width: 100%; }

  .context {
    padding-bottom: 60px !important;
  }

  .differences__person--diverse {
    height: 420px !important;
    margin-top: -6px !important;
  }
  .differences__person--diverse .differences__person-main {
    left: 50% !important;
    bottom: -26px !important;
    width: min(92vw, 430px) !important;
    transform: translateX(-58%) !important;
  }
  .differences__person--diverse .differences__person-accent {
    left: 54% !important;
    bottom: -16px !important;
    width: min(48vw, 235px) !important;
  }

  .solutions-grid--detailed .solution-card {
    min-height: 740px !important;
    height: auto !important;
  }
  .solutions-grid--detailed .solution-card__content {
    padding: 30px 24px !important;
  }
  .solution-specs div {
    grid-template-columns: 88px minmax(0,1fr);
  }

  .origin-final { padding-block: 62px !important; }
  .origin-final__copy h2.origin-final__title {
    width: auto !important;
    max-width: 100% !important;
  }
  .origin-final__title .origin-title-line {
    white-space: normal !important;
  }
  .ecosystem-grid--three-final {
    grid-template-columns: 1fr !important;
  }
  .ecosystem-grid--three-final .ecosystem-card--compact {
    height: auto !important;
    min-height: 390px !important;
  }
  .testimonial-hover-grid {
    grid-template-columns: 1fr;
  }
  .testimonial-hover-card__media {
    opacity: 0;
  }

  .faq.faq--story { padding-block: 62px 68px; }
}

@media (max-width: 720px) {
  .hero-proof__item {
    min-height: 82px;
    padding: 14px 13px 12px;
  }
  .hero-proof__item span { font-size: 11px; }
  .context__turn { margin-top: 36px !important; }

  .differences.differences--story {
    padding-top: 42px !important;
  }
  .differences__person--diverse {
    height: 390px !important;
  }
  .differences__person--diverse .differences__person-main {
    bottom: -18px !important;
    transform: translateX(-60%) !important;
  }
  .differences__person--diverse .differences__person-accent {
    left: 58% !important;
    bottom: -10px !important;
  }

  .solutions.solutions--story,
  .makers.makers--story,
  .blog.blog--story,
  .contact.contact--story {
    padding-block: 54px !important;
  }
  .solutions-grid--detailed .solution-card__content h3 {
    font-size: 19px !important;
  }
  .solutions-grid--detailed .solution-card__content > p {
    font-size: 15px !important;
  }
  .solution-specs {
    padding: 13px 14px;
  }
  .solution-specs div {
    display: block;
  }
  .solution-specs dt { margin-bottom: 2px; }
  .solution-specs dt,
  .solution-specs dd { font-size: 12.5px; }

  .ecosystem-heading h3 { font-size: 24px; }
  .ecosystem-intro-copy p { font-size: 14px; }

  .testimonial-hover-card { min-height: 255px; }
  .testimonial-hover-card__copy { min-height: 255px; padding: 26px 22px; }
  .testimonial-hover-card blockquote { font-size: 16px; }
  .testimonial-hover-card:active .testimonial-hover-card__media { opacity: 1; }

  .contact-card input,
  .contact-card textarea,
  .contact-card select { font-size: 16px !important; }

  .faq-question { font-size: 15px; }
  .faq-answer > p { font-size: 14px; }
}

/* ========================================================================== */
/* KRON — refinamentos 09/09/2026                                             */
/* ========================================================================== */

/* Evita palavras órfãs e linhas finais excessivamente curtas. */
h1, h2, h3, h4, h5, h6,
p, blockquote, li,
.hero-support,
.difference-pill,
.solution-specs dd,
.team-card__body p,
.ecosystem-card__content p,
.faq-question,
.faq-answer > p {
  text-wrap: pretty;
}

h1, h2, h3, h4, h5, h6 {
  text-wrap: balance;
}

/* CTA principal da Hero: link real + camada acima dos efeitos visuais. */
.hero-actions {
  position: relative;
  z-index: 20;
}
.hero-primary-cta {
  position: relative;
  z-index: 21;
  pointer-events: auto !important;
}

/* ECOSSISTEMA KRONBERG — alinhamento à esquerda e cards sem imagens. */
.ecosystem-heading {
  max-width: 100% !important;
  margin-inline: 0 !important;
  text-align: left !important;
}
.ecosystem-heading h2,
.ecosystem-heading h3,
.ecosystem-intro-copy {
  text-align: left !important;
}
.ecosystem-heading h2 {
  width: 100%;
  justify-content: flex-start;
}
.ecosystem-heading h3 {
  max-width: 640px;
}

.ecosystem-grid--three-final {
  gap: 16px !important;
  align-items: stretch;
}
.ecosystem-grid--three-final > .reveal {
  height: 100%;
}
.ecosystem-grid--three-final .ecosystem-card--compact {
  min-height: 248px !important;
  height: 100% !important;
  background-image: none !important;
  background-color: #0d1522 !important;
  border: 1px solid rgba(124, 151, 191, .20) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
  overflow: hidden;
}
.ecosystem-grid--three-final .ecosystem-card--compact::before,
.ecosystem-grid--three-final .ecosystem-card--compact::after,
.ecosystem-grid--three-final .ecosystem-card__veil {
  display: none !important;
}
.ecosystem-grid--three-final .ecosystem-card__content {
  position: relative !important;
  inset: auto !important;
  min-height: 248px;
  height: 100%;
  padding: 24px 20px 20px !important;
  display: flex !important;
  flex-direction: column;
  justify-content: flex-start !important;
  align-items: flex-start !important;
  text-align: left !important;
  background: transparent !important;
}
.ecosystem-grid--three-final .ecosystem-card__content h4 {
  margin: 0 0 3px;
  color: #fff;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 600;
}
.ecosystem-grid--three-final .ecosystem-card__content > img {
  display: none !important;
}
.ecosystem-grid--three-final .ecosystem-card__content p {
  flex: 1;
  margin: 10px 0 16px !important;
  color: rgba(222, 232, 247, .72) !important;
  font-size: 14px !important;
  line-height: 1.48 !important;
}
.ecosystem-card__type {
  margin-bottom: 0 !important;
  color: #22d7f2 !important;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 10px !important;
  line-height: 1.2;
  letter-spacing: .13em !important;
}
.ecosystem-card--kronberg {
  background: linear-gradient(145deg, #101827 0%, #0d1522 100%) !important;
}
.ecosystem-card--kron {
  background: linear-gradient(145deg, #0b1b21 0%, #0c1720 100%) !important;
  border-color: rgba(34, 215, 242, .34) !important;
}
.ecosystem-card--beminder {
  background: linear-gradient(145deg, #101827 0%, #0e1522 100%) !important;
}
.ecosystem-text-link {
  margin-top: auto;
  color: #22d7f2 !important;
  font-size: 13px !important;
}
.ecosystem-card--kron .ecosystem-text-link,
.ecosystem-card--kron .ecosystem-card__type {
  color: #1ff0c0 !important;
}

/* DEPOIMENTOS — foto real no avatar; hover mostra apenas play + chamada. */
.testimonial-person__photo {
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  display: block;
  object-fit: cover;
  object-position: center;
  border: 1px solid rgba(34, 215, 242, .30);
  border-radius: 50%;
  box-shadow: 0 5px 18px rgba(0,0,0,.20);
}
.testimonial-hover-card__media {
  display: grid !important;
  place-items: center;
  background: rgba(5, 10, 19, .68) !important;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  opacity: 0;
  transform: none !important;
}
.testimonial-hover-card__media::after,
.testimonial-hover-card__media > img {
  display: none !important;
}
.testimonial-hover-card__media .play-glyph {
  top: calc(50% - 13px) !important;
  width: 62px !important;
  height: 62px !important;
}
.testimonial-hover-card__watch {
  top: calc(50% + 34px) !important;
  bottom: auto !important;
  font-size: 14px !important;
}
.testimonial-hover-card:hover .testimonial-hover-card__copy,
.testimonial-hover-card:focus-visible .testimonial-hover-card__copy {
  opacity: .28 !important;
  transform: none !important;
}
.testimonial-hover-card:hover .testimonial-hover-card__media,
.testimonial-hover-card:focus-visible .testimonial-hover-card__media {
  opacity: 1 !important;
  transform: none !important;
}

/* Formulário: select legível também no estado fechado e no menu de opções. */
.contact-card select,
.contact-card select:valid,
.contact-card select:focus {
  color: #fff !important;
  background-color: rgba(7, 9, 13, .88) !important;
  color-scheme: dark;
}
.contact-card select:invalid {
  color: rgba(255,255,255,.62) !important;
}
.contact-card select option {
  color: #fff !important;
  background: #0b111c !important;
}
.contact-card select option:disabled {
  color: #8f98a8 !important;
}

@media (max-width: 980px) {
  .ecosystem-grid--three-final .ecosystem-card--compact,
  .ecosystem-grid--three-final .ecosystem-card__content {
    min-height: 230px !important;
  }

  .testimonial-hover-card__media {
    opacity: 0;
  }
  .testimonial-hover-card:active .testimonial-hover-card__media,
  .testimonial-hover-card:focus-visible .testimonial-hover-card__media {
    opacity: 1 !important;
  }
}

/* ========================================================================== */
/* KRON — refinamentos 09/09/2026 v9                                         */
/* ========================================================================== */

/* HERO — garante área clicável integral dos dois CTAs mesmo com o Contexto
   sobreposto visualmente na transição. */
.hero__video,
.hero__scrim,
.hero__particles,
.hero__bottom-fade {
  pointer-events: none !important;
}

.hero__content,
.hero-copy,
.hero-actions {
  position: relative !important;
  z-index: 80 !important;
}

.hero-actions,
.hero-actions a,
.hero-actions button,
.hero-actions span {
  pointer-events: auto !important;
}

/* O Contexto invade a cauda da Hero apenas visualmente. Sua área transparente
   não pode interceptar cliques nos CTAs que ficam abaixo dela na pilha DOM. */
.context,
.context__mesh,
.context__inner {
  pointer-events: none !important;
}
.context a,
.context button,
.context input,
.context select,
.context textarea {
  pointer-events: auto !important;
}

/* POR QUE A KRON — três linhas estáveis no desktop, sem palavra órfã. */
.differences-title-balanced {
  max-width: 720px !important;
  font-size: clamp(34px, 2.55vw, 42px) !important;
  line-height: 1.06 !important;
  letter-spacing: -0.025em !important;
}
.differences-title-balanced > span {
  display: block;
  white-space: nowrap;
}

/* Nova imagem aprovada: um único grupo, sem composição duplicada. */
.differences__person--diverse .differences__person-main {
  left: -100px !important;
  bottom: -30px !important;
  width: 650px !important;
  max-width: none !important;
  transform: none !important;
  filter: drop-shadow(0 28px 40px rgba(0,0,0,.30));
}
.differences__person--diverse .differences__person-accent {
  display: none !important;
}

/* ORIGEM — números com peso visual mais leve. */
.origin-stats--orbit strong,
.origin-stat strong {
  font-weight: 400 !important;
  letter-spacing: -0.025em !important;
  text-shadow: none !important;
}

/* SÓCIOS — botão alinhado nos três cards e com respiro real até o rodapé. */
#quem-faz .team-grid--three .team-card__body {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-height: 324px !important;
  padding-bottom: 28px !important;
}
#quem-faz .team-grid--three .team-card__body > p {
  flex: 1 1 auto !important;
  margin-bottom: 18px !important;
}
#quem-faz .team-grid--three .team-profile-link {
  margin-top: auto !important;
  margin-bottom: 0 !important;
  align-self: center !important;
}

@media (max-width: 1180px) and (min-width: 981px) {
  .differences-title-balanced {
    font-size: 34px !important;
  }
}

@media (max-width: 980px) {
  .differences-title-balanced {
    max-width: 100% !important;
    font-size: 31px !important;
    line-height: 1.08 !important;
    text-wrap: balance !important;
  }
  .differences-title-balanced > span {
    display: inline;
    white-space: normal;
  }
  .differences-title-balanced > span + span::before {
    content: " ";
  }

  .differences__person--diverse .differences__person-main {
    left: 50% !important;
    bottom: -18px !important;
    width: min(108vw, 520px) !important;
    transform: translateX(-50%) !important;
  }

  #quem-faz .team-grid--three .team-card__body {
    min-height: 0 !important;
    padding-bottom: 26px !important;
  }
}

@media (max-width: 720px) {
  .differences__person--diverse .differences__person-main {
    bottom: -10px !important;
    width: min(112vw, 470px) !important;
  }
}

/* ========================================================================== */
/* KRON refinement v10 — equilíbrio headline "Por que a Kron" + cards sócios */
/* ========================================================================== */

/* POR QUE A KRON — mantém as 3 linhas aprovadas, mas respeita a largura real
   da coluna sem estourar a viewport. */
@media (min-width: 981px) {
  .differences-title-balanced {
    width: 100% !important;
    max-width: 700px !important;
    font-size: clamp(32px, 2.05vw, 38px) !important;
    line-height: 1.07 !important;
    letter-spacing: -0.022em !important;
    overflow: visible !important;
  }

  .differences-title-balanced > span {
    display: block !important;
    white-space: nowrap !important;
  }
}

@media (min-width: 981px) and (max-width: 1280px) {
  .differences-title-balanced {
    max-width: 620px !important;
    font-size: 32px !important;
  }
}

/* SÓCIOS — remove a altura fixa que estava cortando os botões e usa a própria
   linha do grid para igualar a altura dos três cards. */
#quem-faz .team-grid--three {
  align-items: stretch !important;
}

#quem-faz .team-grid--three > div {
  display: flex !important;
  align-self: stretch !important;
}

#quem-faz .team-grid--three .team-card {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

#quem-faz .team-grid--three .team-card__body {
  flex: 1 1 auto !important;
  min-height: 310px !important;
  height: auto !important;
  padding: 28px 28px 34px !important;
  box-sizing: border-box !important;
}

#quem-faz .team-grid--three .team-card__body > p {
  flex: 1 1 auto !important;
  margin: 0 0 22px !important;
}

#quem-faz .team-grid--three .team-profile-link {
  flex: 0 0 auto !important;
  margin-top: auto !important;
  margin-bottom: 0 !important;
  align-self: center !important;
  position: relative !important;
  bottom: auto !important;
}

/* Garante uma margem visual real entre o botão e o fim do card. */
#quem-faz .team-grid--three .team-card__body::after {
  content: "";
  display: block;
  flex: 0 0 4px;
}

@media (max-width: 980px) {
  #quem-faz .team-grid--three > div {
    display: block !important;
  }

  #quem-faz .team-grid--three .team-card {
    height: auto !important;
  }

  #quem-faz .team-grid--three .team-card__body {
    min-height: 0 !important;
    padding-bottom: 30px !important;
  }
}

/* ========================================================================== */
/* KRON refinement v11 — headline Por que a Kron respeitando a viewport       */
/* ========================================================================== */

/* O problema anterior vinha do white-space: nowrap em linhas maiores que a
   coluna. Mantemos as 3 linhas aprovadas, mas fazemos a tipografia responder
   à largura real disponível e impedimos a coluna do grid de estourar. */
@media (min-width: 981px) {
  .differences--story .differences__grid {
    grid-template-columns: minmax(0, 43%) minmax(0, 57%) !important;
  }

  .differences--story .differences__copy {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding-right: 28px !important;
    overflow: visible !important;
  }

  .differences-title-balanced {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    font-size: clamp(23px, 1.7vw, 31px) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.018em !important;
    overflow: visible !important;
  }

  .differences-title-balanced > span {
    display: block !important;
    width: fit-content !important;
    max-width: 100% !important;
    white-space: nowrap !important;
  }
}

/* Em notebooks menores ainda mantemos as três linhas, só reduzindo o necessário
   para que nenhuma delas atravesse o limite direito da tela. */
@media (min-width: 981px) and (max-width: 1180px) {
  .differences--story .differences__copy {
    padding-left: 24px !important;
    padding-right: 20px !important;
  }

  .differences-title-balanced {
    font-size: 22px !important;
    letter-spacing: -0.02em !important;
  }
}


/* ========================================================================== */
/* KRON refinement v12 — headline Por que a Kron: correção estrutural         */
/* ========================================================================== */
/* A correção agora é feita também no HTML: as três linhas foram redistribuídas
   para terem comprimentos próximos. Aqui apenas garantimos que cada linha
   respeite a largura real da coluna e que a tipografia responda à viewport. */
@media (min-width: 981px) {
  .differences--story .differences__grid {
    grid-template-columns: minmax(0, 43%) minmax(0, 57%) !important;
  }

  .differences--story .differences__copy {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-right: clamp(24px, 3vw, 56px) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .differences-title-balanced {
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
    font-size: clamp(24px, 1.72vw, 31px) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.018em !important;
    overflow: visible !important;
  }

  .differences-title-balanced > span {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    white-space: nowrap !important;
  }
}

@media (min-width: 981px) and (max-width: 1180px) {
  .differences-title-balanced {
    font-size: 22px !important;
  }
}

@media (max-width: 980px) {
  .differences-title-balanced > span {
    display: inline !important;
    white-space: normal !important;
  }

  .differences-title-balanced > span + span::before {
    content: " ";
  }
}

/* ========================================================================== */
/* KRON refinement v13 — correção definitiva da headline "Por que a Kron"   */
/* ========================================================================== */
/* O gargalo real era a largura global de 1120px da .page-width. Nesta seção
   liberamos uma largura maior no desktop e fazemos a coluna direita crescer,
   mantendo as 3 linhas controladas sem cortar texto na lateral. */
@media (min-width: 981px) {
  .differences.differences--story > .page-width.differences__grid {
    width: min(1400px, calc(100% - 64px)) !important;
    max-width: none !important;
    grid-template-columns: minmax(0, 40%) minmax(0, 60%) !important;
    gap: 0 !important;
  }

  .differences--story .differences__copy {
    min-width: 0 !important;
    width: 100% !important;
    max-width: none !important;
    padding-left: clamp(22px, 2.2vw, 40px) !important;
    padding-right: clamp(24px, 2.5vw, 44px) !important;
    overflow: visible !important;
  }

  .differences--story .differences__copy h2.differences-title-balanced {
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 24px !important;
    font-size: 31px !important;
    line-height: 1.08 !important;
    letter-spacing: -0.018em !important;
    overflow: visible !important;
  }

  .differences--story .differences__copy h2.differences-title-balanced > span {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    white-space: nowrap !important;
    overflow: visible !important;
  }
}

/* Notebook grande / desktop menor: preserva as três linhas e reduz a fonte
   somente o necessário para continuar dentro da coluna. */
@media (min-width: 1281px) and (max-width: 1500px) {
  .differences--story .differences__copy h2.differences-title-balanced {
    font-size: 30px !important;
  }
}

@media (min-width: 1101px) and (max-width: 1280px) {
  .differences.differences--story > .page-width.differences__grid {
    width: calc(100% - 48px) !important;
    grid-template-columns: minmax(0, 38%) minmax(0, 62%) !important;
  }

  .differences--story .differences__copy {
    padding-left: 22px !important;
    padding-right: 20px !important;
  }

  .differences--story .differences__copy h2.differences-title-balanced {
    font-size: 28px !important;
  }
}

@media (min-width: 981px) and (max-width: 1100px) {
  .differences.differences--story > .page-width.differences__grid {
    width: calc(100% - 36px) !important;
    grid-template-columns: minmax(0, 35%) minmax(0, 65%) !important;
  }

  .differences--story .differences__copy {
    padding-left: 18px !important;
    padding-right: 14px !important;
  }

  .differences--story .differences__copy h2.differences-title-balanced {
    font-size: 25px !important;
  }
}

/* Mobile volta a quebrar naturalmente, sem nowrap. */
@media (max-width: 980px) {
  .differences--story .differences__copy h2.differences-title-balanced > span {
    display: inline !important;
    white-space: normal !important;
  }

  .differences--story .differences__copy h2.differences-title-balanced > span + span::before {
    content: " " !important;
  }
}


/* ========================================================================== */
/* KRON — Depoimentos YouTube 23/09/2026                                     */
/* Quatro depoimentos lado a lado em frame 9:16, capa oficial do YouTube.    */
/* ========================================================================== */

.origin-testimonials {
  margin-top: 72px !important;
  padding-top: 58px !important;
}

.testimonial-heading {
  max-width: 920px;
}

.testimonial-heading h2 {
  margin: 0 0 30px !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-weight: 600 !important;
  line-height: 1.16 !important;
  text-wrap: balance;
}

.testimonial-youtube-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(14px, 1.6vw, 22px);
  align-items: start;
}

.testimonial-youtube-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 22px;
  background: linear-gradient(160deg, rgba(13,22,37,.96), rgba(8,12,24,.98));
  box-shadow: 0 16px 42px rgba(0,0,0,.16);
  cursor: pointer;
  transition: transform 240ms ease, border-color 240ms ease, box-shadow 240ms ease;
}

.testimonial-youtube-card:hover,
.testimonial-youtube-card:focus-visible {
  transform: translateY(-5px);
  border-color: rgba(31,240,192,.46);
  box-shadow: 0 24px 58px rgba(0,0,0,.28), 0 0 0 3px rgba(34,215,242,.05);
  outline: none;
}

.testimonial-youtube-card__media {
  position: relative;
  width: 100%;
  aspect-ratio: 9 / 16;
  overflow: hidden;
  background: #050a12;
  border-bottom: 1px solid rgba(255,255,255,.10);
}

.testimonial-youtube-card__media > img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  transform: scale(1.01);
  transition: transform 420ms ease, filter 280ms ease;
}

.testimonial-youtube-card__overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(180deg, rgba(2,7,13,.04) 0%, rgba(2,7,13,.08) 52%, rgba(2,7,13,.78) 100%);
  transition: background 280ms ease;
}

.testimonial-youtube-card__play {
  position: absolute;
  z-index: 4;
  left: 50%;
  top: 50%;
  width: 64px;
  height: 64px;
  transform: translate(-50%, -50%);
  filter: drop-shadow(0 10px 24px rgba(0,0,0,.34));
  transition: transform 240ms ease;
}

.testimonial-youtube-card__play svg {
  width: 100%;
  height: 100%;
  display: block;
}

.testimonial-youtube-card__watch {
  position: absolute;
  z-index: 4;
  left: 50%;
  bottom: 22px;
  width: calc(100% - 28px);
  transform: translateX(-50%);
  color: #fff;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 13px;
  line-height: 1.4;
  font-weight: 600;
  text-align: center;
  opacity: .9;
}

.testimonial-youtube-card:hover .testimonial-youtube-card__media > img,
.testimonial-youtube-card:focus-visible .testimonial-youtube-card__media > img {
  transform: scale(1.045);
  filter: brightness(.82);
}

.testimonial-youtube-card:hover .testimonial-youtube-card__play,
.testimonial-youtube-card:focus-visible .testimonial-youtube-card__play {
  transform: translate(-50%, -50%) scale(1.08);
}

.testimonial-youtube-card__copy {
  min-height: 112px;
  padding: 18px 18px 20px;
}

.testimonial-youtube-card__copy strong,
.testimonial-youtube-card__copy span {
  display: block;
  font-family: "Poppins", Arial, sans-serif;
}

.testimonial-youtube-card__copy strong {
  color: #fff;
  font-size: 16px;
  line-height: 1.35;
  font-weight: 600;
}

.testimonial-youtube-card__copy span {
  margin-top: 7px;
  color: rgba(255,255,255,.66);
  font-size: 13px;
  line-height: 1.48;
  font-weight: 400;
  text-wrap: pretty;
}

.testimonial-actions--youtube {
  margin-top: 28px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.testimonial-actions--youtube .gradient-button,
.testimonial-actions--youtube .secondary-button {
  min-height: 48px;
  min-width: min(100%, 245px);
  justify-content: center;
  text-align: center;
}

.testimonial-playlist-cta {
  min-width: min(100%, 286px) !important;
}

/* Mantém o popup dos quatro vídeos sempre na proporção vertical definida. */
.video-modal__panel.is-vertical {
  width: min(430px, calc(100vw - 36px)) !important;
}

.video-modal__frame.is-vertical {
  width: 100% !important;
  aspect-ratio: 9 / 16 !important;
  max-height: calc(100vh - 84px);
}

.video-modal__frame.is-vertical iframe {
  width: 100% !important;
  height: 100% !important;
}

@media (max-width: 1100px) {
  .testimonial-youtube-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 760px;
    margin-inline: auto;
  }
}

@media (max-width: 620px) {
  .origin-testimonials {
    margin-top: 58px !important;
    padding-top: 48px !important;
  }

  .testimonial-youtube-grid {
    grid-template-columns: repeat(4, minmax(235px, 76vw));
    max-width: none;
    margin-inline: 0;
    overflow-x: auto;
    gap: 14px;
    padding: 2px 18px 14px 0;
    scroll-snap-type: x mandatory;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(34,215,242,.42) transparent;
  }

  .testimonial-youtube-card {
    scroll-snap-align: start;
  }

  .testimonial-youtube-card__copy {
    min-height: 104px;
    padding: 16px;
  }

  .testimonial-youtube-card__play {
    width: 58px;
    height: 58px;
  }

  .testimonial-actions--youtube {
    align-items: stretch;
  }

  .testimonial-actions--youtube .gradient-button,
  .testimonial-actions--youtube .secondary-button {
    width: 100%;
    min-width: 0 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .testimonial-youtube-card,
  .testimonial-youtube-card__media > img,
  .testimonial-youtube-card__play {
    transition: none !important;
  }
}


/* KRON — correções depoimentos v2 | 23/09/2026 */
.origin-testimonials .testimonial-heading {
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto 30px !important;
  text-align: center !important;
}

.origin-testimonials .testimonial-heading h2 {
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  text-align: center !important;
}

@media (max-width: 620px) {
  .origin-testimonials .testimonial-heading {
    margin-bottom: 24px !important;
  }

  .origin-testimonials .testimonial-heading h2 {
    text-align: center !important;
  }
}