/* =============================================================
   akdmi · minimal — Cinematic light variant
   Hero animations + alternating dark sections for contrast rhythm
   ============================================================= */

/* ------- LIGHT THEME (root) ------- */
:root {
  --bg:           #ffffff;
  --bg-2:         #fafafb;
  --bg-3:         #f4f4f6;
  --ink:          #0a0f1e;
  --ink-2:        rgba(10,15,30,0.68);
  --ink-3:        rgba(10,15,30,0.42);
  --line:         rgba(10,15,30,0.08);
  --line-2:       rgba(10,15,30,0.14);
  --accent:       #d97706;
  --accent-glow:  rgba(217,119,6,0.18);

  /* Reserved dark surface (used by .is-dark sections) */
  --dark-bg:      #0a0f1e;
  --dark-ink:     #f5f5f7;
  --dark-ink-2:   rgba(245,245,247,0.68);
  --dark-line:    rgba(255,255,255,0.10);
  --dark-line-2:  rgba(255,255,255,0.18);
}

body { background: var(--bg); color: var(--ink); }

/* ------- HEADER ------- */
.m-header {
  background: #ffffff;
  border-bottom-color: var(--line);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.m-header__logo img { content: url("assets/images/logolight.png"); }
.m-footer__brand img { content: url("assets/images/logolight.png"); }

/* ------- CTA system in light ------- */
.m-cta { color: var(--ink); border-color: var(--line-2); }
.m-cta:hover { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.m-cta--primary { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.m-cta--primary:hover {
  background: var(--accent); border-color: var(--accent); color: #fff;
  box-shadow: 0 8px 28px rgba(217,119,6,0.35);
}

/* ------- language switcher (light) ------- */
.m-lang__trigger {
  background: #fdf4ea;
  border-color: rgba(217,119,6,0.18);
  color: var(--ink);
}
.m-lang__trigger:hover { background: #fbecdb; border-color: rgba(217,119,6,0.32); }
.m-lang__menu {
  background: #ffffff;
  border-color: var(--line);
  box-shadow: 0 24px 60px rgba(10,15,30,0.16);
}
.m-lang__opt:hover { background: #faf6f0; }
.m-lang__opt.is-active { background: #fdf4ea; }
.m-lang__check { color: var(--accent); }

/* =============================================================
   HERO — transparent (mesh lives on .m-stage-mesh)
   ============================================================= */
.m-hero {
  background: transparent;
  overflow: hidden;
  position: relative;
}
.m-hero::before, .m-hero::after { content: none; }

/* Shared mesh stage for hero + reel — one continuous light background */
.m-stage-mesh {
  position: relative;
  background: #ffffff;
  overflow: hidden;
}
.m-stage-mesh::before {
  content: "";
  position: absolute;
  inset: -10%;
  z-index: 0;
  background:
    radial-gradient(ellipse 45% 24% at 15% 12%,  rgba(217,119,6,0.35), transparent 65%),
    radial-gradient(ellipse 38% 20% at 85% 10%,  rgba(30,58,138,0.22), transparent 65%),
    radial-gradient(ellipse 50% 26% at 80% 70%,  rgba(245,158,11,0.28), transparent 70%),
    radial-gradient(ellipse 42% 22% at 20% 78%,  rgba(124,58,237,0.16), transparent 65%),
    radial-gradient(ellipse 35% 18% at 50% 45%,  rgba(37,99,235,0.10),  transparent 70%);
  filter: blur(80px) saturate(120%);
  /* animation removed — the 80px blur on this giant element was stealing
     compositor budget during scroll, throttling the reel iframe to ~30fps */
  /* animation: stageMeshDrift 28s ease-in-out infinite alternate; */
  pointer-events: none;
}
.m-stage-mesh::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(ellipse at center, rgba(255,255,255,0.30) 0%, rgba(255,255,255,0.50) 60%, rgba(255,255,255,0.7) 100%);
  pointer-events: none;
}
.m-stage-mesh > * { position: relative; z-index: 2; }
@keyframes stageMeshDrift {
  0%   { transform: translate(0, 0) scale(1) rotate(0deg); }
  33%  { transform: translate(-3%, 2%) scale(1.06) rotate(2deg); }
  66%  { transform: translate(2%, -2%) scale(1.04) rotate(-1.5deg); }
  100% { transform: translate(-2%, 3%) scale(1.08) rotate(1deg); }
}

/* Animated mesh gradient orbs */
.m-hero__glow--1 {
  width: 720px; height: 720px;
  background: radial-gradient(circle, rgba(217,119,6,0.18), transparent 70%);
  opacity: 0.85;
  animation: orbDrift 18s ease-in-out infinite alternate;
}
.m-hero__glow--2 {
  width: 540px; height: 540px;
  background: radial-gradient(circle, rgba(30,58,138,0.14), transparent 70%);
  opacity: 0.7;
  animation: orbDrift2 22s ease-in-out infinite alternate;
}
@keyframes orbDrift {
  0%   { transform: translate(-50%, -10%) scale(1); }
  100% { transform: translate(-30%, 20%) scale(1.18); }
}
@keyframes orbDrift2 {
  0%   { transform: translate(0, 0) scale(1); }
  100% { transform: translate(-30%, -10%) scale(1.25); }
}

/* Grid background — subtle for light */
.m-hero__grid {
  background-image:
    linear-gradient(rgba(10,15,30,0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(10,15,30,0.045) 1px, transparent 1px);
  background-size: 60px 60px;
  animation: gridShift 24s linear infinite;
}
@keyframes gridShift {
  to { background-position: 60px 60px; }
}

/* Floating particles layer */
.m-hero__particles {
  position: absolute; inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
}
.m-particle {
  position: absolute;
  width: 4px; height: 4px;
  border-radius: 50%;
  background: var(--accent);
  opacity: 0;
  animation: particleRise 14s linear infinite;
}
.m-particle.is-tiny { width: 2px; height: 2px; opacity: 0.5; }
.m-particle.is-blue { background: #2563eb; opacity: 0.4; }
@keyframes particleRise {
  0%   { transform: translateY(20px) scale(0.5); opacity: 0; }
  10%  { opacity: 0.8; }
  90%  { opacity: 0.6; }
  100% { transform: translateY(-110vh) scale(1); opacity: 0; }
}

/* Animated SVG network */
.m-hero__network {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  opacity: 0.6;
}
.m-hero__network line {
  stroke: rgba(217,119,6,0.25);
  stroke-width: 0.5;
  stroke-dasharray: 4 4;
  animation: dashFlow 8s linear infinite;
}
.m-hero__network circle {
  fill: rgba(217,119,6,0.55);
  animation: nodePulse 3s ease-in-out infinite;
}
.m-hero__network circle:nth-child(2n) { animation-delay: -1s; }
.m-hero__network circle:nth-child(3n) { animation-delay: -2s; }
@keyframes dashFlow {
  to { stroke-dashoffset: -32; }
}
@keyframes nodePulse {
  0%, 100% { opacity: 0.4; r: 2; }
  50%      { opacity: 1; r: 4; }
}

/* =============================================================
   HERO SPLIT LAYOUT (Deel-style)
   ============================================================= */
.m-hero__inner--split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  text-align: left !important;
  gap: 56px;
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 48px;
}
/* Both columns fill the hero so the bottom margin matches lateral 12px */
.m-hero__col-l,
.m-hero__col-r {
  position: relative;
  height: 100%;
  min-height: 480px;
  display: flex;
  min-width: 0;
}

/* Card chrome — large rounded panels (Deel-style) */
.m-hero__card {
  border-radius: 32px;
  overflow: hidden;
  padding: 56px;
}
.m-hero__card--dark {
  background: #1a1d4a;
  color: #fff;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 22px;
}
.m-hero__card--accent {
  padding: 0;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.m-hero__card--accent {
  background:
    radial-gradient(ellipse 70% 60% at 20% 25%, rgba(217,119,6,0.08),  transparent 60%),
    #1a1d2e;
  transition: background 0.25s linear;
}
.m-hero__card--accent[data-bg="1"] {
  background: #1a1d2e;
}
.m-hero__card--accent[data-bg="1"]::before { opacity: 0; }
.m-hero__card--accent[data-bg="2"] {
  background: #1a1d2e;
}
.m-hero__card--accent[data-bg="2"]::before { opacity: 0; }
.m-hero__card--accent[data-bg="3"] {
  background: #1a1d2e;
}
.m-hero__card--accent[data-bg="3"]::before { opacity: 0; }
.m-hero__card--accent::before {
  content: "";
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 40% 30% at 75% 15%, rgba(254,243,199,0.20), transparent 60%);
  pointer-events: none;
}

/* Left card content */
.m-hero__card--dark .m-hero__chip {
  margin: 0;
  background: rgba(255,255,255,0.10);
  border-color: rgba(255,255,255,0.18);
  color: rgba(255,255,255,0.85);
}
.m-hero__card--dark .m-hero__chip:hover {
  background: rgba(255,255,255,0.16);
  color: #fff;
}
.m-hero__card--dark .m-hero__title {
  font-size: clamp(36px, 4vw, 60px) !important;
  text-align: left;
  margin: 0;
  color: #fff;
}
.m-hero__card--dark .m-hero__title .em,
.m-hero__card--dark .m-hero__title__word.em { color: #c4b5fd; }
.m-hero__card--dark .m-hero__sub {
  text-align: left;
  margin: 0;
  max-width: 100%;
  color: rgba(255,255,255,0.78);
}
.m-hero__card--dark .m-hero__sub strong { color: #fff; }
.m-hero__card--dark .m-hero__ctas { justify-content: flex-start; margin: 8px 0 0; }
.m-hero__card--dark .m-cta--primary {
  background: #fff; color: #1a1d4a; border-color: #fff;
}
.m-hero__card--dark .m-cta--primary:hover {
  background: var(--accent); color: #fff; border-color: var(--accent);
}

/* Right card — phone stage fills it */
.m-phone-stage {
  position: relative;
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
}
.m-phone-stage__glow { display: none; }
.m-phone-photo {
  position: relative;
  width: 100%; height: 100%;
  z-index: 1;
}
.m-phone-photo__slide {
  position: absolute; inset: 0;
  opacity: 0;
  transition: opacity 0.25s linear;
  overflow: hidden;
}
.m-phone-photo__slide.is-active {
  opacity: 1; z-index: 2;
}
/* Ken Burns — slow pan + subtle zoom while the slide is visible.
   Animation lasts the whole slide window (7.5s) and stays paused at the
   end frame. Inactive slides keep their final transform so when we
   crossfade in for the next cycle there's no snap-back. */
.m-phone-photo__slide img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  transform-origin: center;
  will-change: transform;
  transform: translateX(0) scale(1.04);
  transition: transform 0s;
}
.m-phone-photo__slide img {
  animation: slidePan 15s ease-in-out infinite alternate;
}
.m-phone-photo__slide.dir-right img {
  animation: slidePanRight 15s ease-in-out infinite alternate;
}
@keyframes slidePan {
  0%   { transform: translateX(0)     scale(1.04); }
  100% { transform: translateX(-2.5%) scale(1.10); }
}
@keyframes slidePanRight {
  0%   { transform: translateX(0)     scale(1.04); }
  100% { transform: translateX(2.5%)  scale(1.10); }
}

/* Testimonial tag — bottom-left of right card */
.m-hero__corner-tag {
  position: absolute;
  bottom: 90px; left: 36px; right: 36px;
  display: flex; align-items: flex-start; gap: 16px;
  z-index: 3;
  opacity: 0;
  animation: revealUp 0.5s cubic-bezier(0.16,1,0.3,1) 0s forwards;
}
/* New layout: pill ABOVE title (no logo on the left anymore) */
.m-hero__corner-tag__text { display: flex; flex-direction: column; gap: 0; }
.m-hero__module-pill {
  display: inline-flex;
  align-items: stretch;
  align-self: flex-start;
  height: 30px;
  margin: 0 0 14px -12px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(10,15,30,0.55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: 0 8px 24px rgba(10,15,30,0.25);
}
.m-hero__module-pill__logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  padding: 6px;
  background: rgba(255,255,255,0.10);
  flex-shrink: 0;
}
.m-hero__module-pill__logo svg { width: 100%; height: 100%; display: block; }
.m-hero__module-pill__name {
  display: inline-flex;
  align-items: center;
  padding: 0 14px 0 12px;
  font: 600 11.5px var(--body);
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: #fff;
  background: var(--mod-color, var(--accent));
  white-space: nowrap;
}
.m-hero__corner-tag__logo {
  width: 38px; height: 38px;
  border-radius: 10px;
  background: rgba(10,15,30,0.55);
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 8px 24px rgba(10,15,30,0.25);
  backdrop-filter: blur(10px);
  overflow: hidden;
  padding: 7px;
}
.m-hero__corner-tag__logo svg {
  width: 100%; height: 100%;
  display: block;
}
.m-hero__corner-tag__captions {
  position: relative;
  flex: 1;
  min-height: 100px;
}
.m-hero__corner-tag__group {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  opacity: 0;
  transition: opacity 0.25s linear;
  pointer-events: none;
  display: flex; align-items: flex-end; gap: 14px;
}
.m-hero__corner-tag__group.is-active {
  opacity: 1;
  pointer-events: auto;
}
.m-hero__corner-tag__group.is-active {
  opacity: 1;
  pointer-events: auto;
}
/* fallback if older rule remains */
.m-hero__corner-tag__l1 {
  font: 600 clamp(22px, 2.2vw, 32px)/1.2 var(--display, 'Inter Tight', sans-serif);
  margin-bottom: 8px;
  letter-spacing: -0.015em;
  color: #ffffff;
}
.m-hero__corner-tag__l1 span {
  display: inline;
  background: rgba(10,15,30,0.55);
  box-shadow: 0.35em 0 0 rgba(10,15,30,0.55), -0.35em 0 0 rgba(10,15,30,0.55);
  padding: 0.05em 0;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.m-hero__corner-tag__l2 {
  font: 500 13px var(--body);
  letter-spacing: 0.6px;
  color: #ffffff;
}
.m-hero__corner-tag__l2 span {
  display: inline;
  background: rgba(10,15,30,0.55);
  box-shadow: 0.30em 0 0 rgba(10,15,30,0.55), -0.30em 0 0 rgba(10,15,30,0.55);
  padding: 0.05em 0;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
@keyframes tagRise {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Slide dots — bottom-right of the right card */
.m-phone-stage__dots {
  position: absolute;
  bottom: 44px; right: 36px;
  display: flex; gap: 8px;
  z-index: 4;
}
.m-phone-stage__dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: rgba(255,255,255,0.40);
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.16,1,0.3,1);
}
.m-phone-stage__dot.is-active {
  background: #ffffff;
  width: 28px;
  border-radius: 4px;
}

/* Wider container so cards have room to breathe */
.m-hero__inner--split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  align-items: stretch;
  text-align: left !important;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 12px;
}

@media (max-width: 900px) {
  .m-hero__inner--split { grid-template-columns: 1fr; gap: 12px; padding: 6px; }
  .m-hero__col-l, .m-hero__col-r { height: auto; min-height: 420px; max-height: none; }
  .m-hero__card--dark { padding: 36px; border-radius: 24px; }
  .m-hero__card--accent { padding: 0; border-radius: 24px; }
}

/* Headline cinematic reveal — words slide up in stagger */
.m-hero__title {
  perspective: 600px;
}
.m-hero__title__line {
  display: block;
  overflow: visible;
}
.m-hero__title__word {
  display: inline-block;
  opacity: 0;
  transform: translateY(40px);
  animation: wordRise 0.55s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.m-hero__title__word.em {
  color: var(--accent);
  font-style: italic;
  font-weight: 400;
}
.m-hero__title__word.em::after {
  content: "";
  display: inline-block;
  width: 6px; height: 6px;
  background: var(--accent);
  border-radius: 50%;
  margin-left: 12px;
  vertical-align: middle;
  animation: dotPulse 1.6s ease-in-out infinite;
  animation-delay: 1.6s;
  box-shadow: 0 0 16px var(--accent);
  opacity: 0;
  animation-name: dotAppear, dotPulse;
  animation-duration: 0.5s, 1.6s;
  animation-iteration-count: 1, infinite;
  animation-fill-mode: forwards, none;
  animation-delay: 1.4s, 1.8s;
}
@keyframes wordRise {
  to { opacity: 1; transform: translateY(0); }
}
@keyframes dotAppear {
  to { opacity: 1; }
}
@keyframes dotPulse {
  0%, 100% { opacity: 0.4; transform: scale(0.9); }
  50%      { opacity: 1; transform: scale(1.3); }
}

.m-hero__sub {
  opacity: 0;
  animation: revealUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.5s forwards;
}
.m-hero__sub strong { color: var(--ink); font-weight: 500; }
.m-hero__ctas {
  opacity: 0;
  animation: revealUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.6s forwards;
}
.m-hero__ctas .m-cta--primary {
  position: relative;
  overflow: hidden;
}
.m-hero__ctas .m-cta--primary::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
  transform: translateX(-100%);
  animation: shineSweep 4s ease-in-out infinite;
  animation-delay: 2s;
}
@keyframes shineSweep {
  0%, 30%  { transform: translateX(-100%); }
  60%, 100% { transform: translateX(100%); }
}

.m-hero__keywords {
  opacity: 0;
  animation: revealUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.7s forwards;
}

@keyframes revealUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Scroll hint at the bottom of hero */
.m-scroll-hint {
  position: absolute;
  bottom: 30px; left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  font: 500 11px var(--body);
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--ink-3);
  display: flex; flex-direction: column;
  align-items: center; gap: 10px;
  opacity: 0;
  animation: revealUp 1s ease 2s forwards;
}
.m-scroll-hint__line {
  width: 1px; height: 28px;
  background: linear-gradient(to bottom, var(--accent), transparent);
  position: relative;
  overflow: hidden;
}
.m-scroll-hint__line::after {
  content: "";
  position: absolute; top: 0; left: 0; right: 0;
  height: 14px;
  background: var(--accent);
  animation: scrollHintTravel 2.2s ease-in-out infinite;
}
@keyframes scrollHintTravel {
  0%   { top: -14px; }
  100% { top: 100%; }
}

/* =============================================================
   ITALIC ACCENT in section titles (preserve)
   ============================================================= */
.m-section__title .em,
.m-problem__statement .em,
.m-contact__title .em { color: var(--accent); }

/* =============================================================
   DARK SECTIONS — for contrast rhythm
   ============================================================= */
.m-section.is-dark,
.m-contact.is-dark {
  background: var(--dark-bg);
  color: var(--dark-ink);
  border-top: 0;
  position: relative;
  overflow: hidden;
  /* card treatment — inset from page edges with rounded corners */
  margin: 0 12px;
  border-radius: 28px;
}
.m-section.is-dark + .m-section.is-dark,
.m-section.is-dark + .m-contact.is-dark { margin-top: 16px; }
@media (max-width: 1000px) {
  .m-section.is-dark,
  .m-contact.is-dark { margin: 0 6px; border-radius: 20px; }
}

/* CONTACT + FOOTER — full-width dark block, no card treatment.
   Sits flush at page edges, contact flows seamlessly into the footer. */
.m-contact.is-dark {
  margin: 0;
  border-radius: 0;
  background: #000;
}
.m-contact.is-dark + * { margin-top: 0; }
.m-contact.is-dark .m-section__title,
.m-contact.is-dark .m-contact__title { color: #fff; }
.m-contact.is-dark .m-contact__sub { color: rgba(255,255,255,0.78); }
.m-contact.is-dark .m-contact__sub strong { color: #fff; }
.m-contact.is-dark .m-contact__details { color: rgba(255,255,255,0.78); }
.m-contact.is-dark .m-contact__details > div { color: rgba(255,255,255,0.78); }
.m-contact.is-dark .m-cta {
  color: #fff;
  border-color: rgba(255,255,255,0.25);
  background: transparent;
}
.m-contact.is-dark .m-cta:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.45);
  color: #fff;
}
.m-contact.is-dark .m-cta--primary {
  background: #fff;
  color: #000;
  border-color: #fff;
}
.m-contact.is-dark .m-cta--primary:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.m-footer {
  background: #000;
  color: rgba(255,255,255,0.78);
  border-top: 1px solid rgba(255,255,255,0.08);
}
.m-footer__brand img {
  /* white-on-black logo (overrides the light-theme dark logo) */
  content: url("assets/images/logodark.png");
  /* flatten all colors (orange/blue/white) to pure white */
  filter: brightness(0) invert(1);
}
.m-footer__brand p { color: rgba(255,255,255,0.72); }
.m-footer__social a {
  color: rgba(255,255,255,0.65);
  border-color: rgba(255,255,255,0.14);
}
.m-footer__social a:hover {
  color: #fff;
  border-color: rgba(255,255,255,0.4);
  background: rgba(255,255,255,0.06);
}
.m-footer__cols h5 { color: #fff; }
.m-footer__cols a,
.m-footer__cols p,
.m-footer__cols li { color: rgba(255,255,255,0.72); }
.m-footer__cols a:hover { color: #fff; }
.m-footer__main { border-bottom-color: rgba(255,255,255,0.10); }
.m-footer__bottom { color: rgba(255,255,255,0.55); }
@media (max-width: 1000px) {
  .m-contact.is-dark { margin: 0; border-radius: 0; }
}
.m-section.is-dark + .m-section { border-top: 0; }
.m-section.is-dark .m-section__title { color: var(--dark-ink); }
.m-section.is-dark .m-section__sub { color: var(--dark-ink-2); }
.m-section.is-dark .m-section__sub strong { color: var(--dark-ink); }
.m-section.is-dark .m-eyebrow { color: var(--accent); }

.m-section.is-dark .m-problem__cols,
.m-section.is-dark .m-vetores,
.m-section.is-dark .m-cases,
.m-section.is-dark .m-principles,
.m-section.is-dark .m-clients {
  border-color: var(--dark-line);
}
.m-section.is-dark .m-problem__col,
.m-section.is-dark .m-vetor,
.m-section.is-dark .m-case,
.m-section.is-dark .m-principle,
.m-section.is-dark .m-clients,
.m-section.is-dark .m-loop__node {
  border-color: var(--dark-line);
}
.m-section.is-dark .m-problem__col h4,
.m-section.is-dark .m-principle__n { color: rgba(255,255,255,0.42); }
.m-section.is-dark .m-problem__col.is-is h4,
.m-section.is-dark .m-vetor__num,
.m-section.is-dark .m-persona__role { color: var(--accent); }
.m-section.is-dark .m-problem__col li,
.m-section.is-dark .m-vetor__d,
.m-section.is-dark .m-principle__d,
.m-section.is-dark .m-persona__bullets li,
.m-section.is-dark .m-case__role,
.m-section.is-dark .m-vetor__kind { color: var(--dark-ink-2); }
.m-section.is-dark .m-problem__col li strong,
.m-section.is-dark .m-vetor__t,
.m-section.is-dark .m-principle__t,
.m-section.is-dark .m-case__quote,
.m-section.is-dark .m-persona__pain { color: var(--dark-ink); }
.m-section.is-dark .m-problem__col li { border-color: var(--dark-line); }
.m-section.is-dark .m-vetor:hover { background: rgba(255,255,255,0.02); }

.m-section.is-dark .m-case__logo {
  background: rgba(255,255,255,0.04);
  border-color: var(--dark-line-2);
  color: rgba(255,255,255,0.5);
}
.m-section.is-dark .m-clients__label,
.m-section.is-dark .m-clients__row > span { color: rgba(255,255,255,0.45); }
.m-section.is-dark .m-loop__node__dot { background: var(--dark-bg); }
.m-section.is-dark .m-loop__node__num { color: rgba(255,255,255,0.5); }
.m-section.is-dark .m-loop__node__t { color: var(--dark-ink); }
.m-section.is-dark .m-loop__node__d { color: var(--dark-ink-2); }

/* Dark section ambient glow (default — subtle) */
.m-section.is-dark::before {
  content: "";
  position: absolute;
  top: -20%; right: -10%;
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(217,119,6,0.07), transparent 60%);
  z-index: 0;
  pointer-events: none;
}
.m-section.is-dark > .m-container { position: relative; z-index: 1; }

/* "Por que o akdmi" — full mesh gradient on dark */
#problema.is-dark::before {
  inset: -20%;
  top: auto; right: auto; width: auto; height: auto;
  background:
    radial-gradient(ellipse 40% 30% at 15% 25%, rgba(217,119,6,0.30), transparent 65%),
    radial-gradient(ellipse 35% 28% at 85% 20%, rgba(96,165,250,0.18), transparent 65%),
    radial-gradient(ellipse 45% 35% at 80% 80%, rgba(245,158,11,0.22), transparent 70%),
    radial-gradient(ellipse 38% 30% at 20% 85%, rgba(124,58,237,0.16), transparent 65%),
    radial-gradient(ellipse 30% 25% at 50% 50%, rgba(37,99,235,0.10), transparent 70%);
  filter: blur(80px) saturate(130%);
  animation: darkMeshDrift 32s ease-in-out infinite alternate;
}
#problema.is-dark::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(ellipse at center, rgba(10,15,30,0) 0%, rgba(10,15,30,0.5) 70%, rgba(10,15,30,0.82) 100%);
  pointer-events: none;
}
@keyframes darkMeshDrift {
  0%   { transform: translate(0, 0) scale(1) rotate(0deg); }
  33%  { transform: translate(-3%, 2%) scale(1.06) rotate(2deg); }
  66%  { transform: translate(2%, -2%) scale(1.04) rotate(-1.5deg); }
  100% { transform: translate(-2%, 3%) scale(1.08) rotate(1deg); }
}

/* =============================================================
   SCREENSHOT placeholder — light adapted
   ============================================================= */
.m-screenshot {
  background:
    radial-gradient(ellipse at 30% 20%, rgba(217,119,6,0.06), transparent 50%),
    var(--bg-2);
  border-color: var(--line);
}
.m-screenshot::before {
  background-image:
    linear-gradient(rgba(10,15,30,0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(10,15,30,0.02) 1px, transparent 1px);
}
.m-screenshot__ph__tag {
  background: rgba(217,119,6,0.10);
  border-color: rgba(217,119,6,0.30);
}
.m-screenshot__ph__txt { color: var(--ink); }
.m-screenshot__ph__hint { color: var(--ink-3); }

/* =============================================================
   SCROLL-IN reveal (modules, personas, cases)
   ============================================================= */
/* Hero carousel progress nav (numbered pip + fill bar) */
.m-phone-stage__nav {
  position: absolute;
  bottom: 28px;
  left: 28px;
  right: 28px;
  display: flex;
  gap: 14px;
  z-index: 5;
}
.m-phone-stage__pip {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
  font-family: inherit;
}
.m-phone-stage__pip__num {
  font: 600 10.5px var(--body);
  letter-spacing: 1.6px;
  color: rgba(255,255,255,0.55);
  text-align: left;
  transition: color 0.3s ease;
}
.m-phone-stage__pip.is-active .m-phone-stage__pip__num {
  color: #fff;
}
.m-phone-stage__pip__track {
  display: block;
  width: 100%;
  height: 2px;
  background: rgba(255,255,255,0.18);
  border-radius: 2px;
  overflow: hidden;
}
.m-phone-stage__pip__fill {
  display: block;
  height: 100%;
  width: 0;
  background: #ffffff;
  border-radius: 2px;
}
@keyframes pipFill {
  from { width: 0%; }
  to   { width: 100%; }
}

/* Scroll-reveal — staggered fade-up */
.m-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1), transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}
.m-reveal.is-in {
  opacity: 1;
  transform: translateY(0);
}

/* Module card subtle lift on hover */
.m-module {
  transition: transform 0.4s cubic-bezier(0.4,0,0.2,1);
}
.m-module:hover { transform: translateY(-4px); }

/* Vetor reveal on hover */
.m-vetor {
  position: relative;
  transition: background 0.3s ease, transform 0.3s ease;
}
.m-vetor:hover { background: rgba(217,119,6,0.04); transform: translateY(-2px); }
.m-vetor::before {
  content: "";
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 1px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.5s cubic-bezier(0.4,0,0.2,1);
}
.m-vetor:hover::before { transform: scaleX(1); }

/* =============================================================
   CONTACT — animated glow
   ============================================================= */
.m-contact__glow {
  animation: contactGlow 8s ease-in-out infinite alternate;
}
@keyframes contactGlow {
  0%   { opacity: 0.7; transform: translate(-50%, -50%) scale(1); }
  100% { opacity: 1; transform: translate(-50%, -50%) scale(1.15); }
}

/* Variant pill */
.m-variant-pill {
  background: rgba(255,255,255,0.92);
  border-color: var(--line-2);
  color: var(--ink-2);
}
.m-variant-pill a {
  color: var(--ink);
  border-bottom-color: var(--line-2);
}

/* =============================================================
   MICRO-DETAIL: amber underline on links
   ============================================================= */
.m-section__sub a, .m-module__body a {
  position: relative;
  color: var(--accent);
  text-decoration: none;
}
.m-section__sub a::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: -1px;
  height: 1px; background: var(--accent);
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.3s ease;
}
.m-section__sub a:hover::after { transform: scaleX(1); }

/* Respect user preference */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01s !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01s !important;
  }
}

/* =============================================================
   MODULES GRID — 4 cards side-by-side, dark surface
   ============================================================= */
.m-modgrid-section { padding: 120px 0; }

.m-modgrid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 64px;
}

.m-modcard {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 32px 26px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 18px;
  transition: transform 0.25s cubic-bezier(0.22, 0.61, 0.36, 1),
              background 0.25s ease,
              border-color 0.25s ease;
  min-height: 280px;
}
.m-modcard:hover {
  transform: translateY(-3px);
  background: rgba(255,255,255,0.05);
  border-color: rgba(245,158,11,0.35);
}
.m-modcard__brand {
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.m-modcard__brand__prefix {
  font: 500 12px var(--body);
  letter-spacing: 0.04em;
  color: rgba(255,255,255,0.45);
  text-transform: lowercase;
}
.m-modcard__brand__name {
  font-family: var(--display);
  font-size: 24px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: #ffffff;
  line-height: 1.1;
}
.m-modcard__cat {
  font: 500 11px var(--body);
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--accent);
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.m-modcard__body {
  font: 400 14.5px/1.6 var(--body);
  color: rgba(255,255,255,0.72);
  flex: 1;
  margin: 0;
}
.m-modcard__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  padding: 10px 16px;
  font: 500 13px var(--body);
  color: #fff;
  background: transparent;
  border: 1px solid rgba(255,255,255,0.20);
  border-radius: 99px;
  text-decoration: none;
  align-self: flex-start;
  cursor: pointer;
  transition: all 0.2s ease;
}
.m-modcard__cta svg {
  transition: transform 0.25s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.m-modcard__cta:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}
.m-modcard__cta:hover svg { transform: translateX(3px); }

@media (max-width: 1100px) {
  .m-modgrid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .m-modgrid { grid-template-columns: 1fr; gap: 12px; }
  .m-modgrid-section { padding: 80px 0; }
  .m-modcard { min-height: 0; padding: 28px 24px; }
}

/* =============================================================
   BLOG — listing page (blog.html)
   ============================================================= */
.m-blog__hero {
  padding: 140px 0 60px;
  text-align: center;
  background:
    radial-gradient(ellipse 60% 50% at 50% 30%, rgba(217,119,6,0.10), transparent 70%),
    radial-gradient(ellipse 40% 40% at 20% 80%, rgba(30,58,138,0.06), transparent 70%);
}
.m-blog__hero .m-eyebrow { justify-content: center; }
.m-blog__hero__title {
  font-family: var(--display);
  font-size: clamp(40px, 5vw, 64px);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin: 18px auto 18px;
  color: var(--ink);
  max-width: 880px;
  text-wrap: balance;
}
.m-blog__hero__title .em {
  font-style: italic;
  font-weight: 400;
  color: var(--accent);
}
.m-blog__hero__sub {
  font: 400 18px/1.55 var(--body);
  color: var(--ink-2);
  max-width: 640px;
  margin: 0 auto;
}

.m-blog__controls {
  padding: 24px 0 8px;
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255,255,255,0.92);
  backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--line);
}
.m-blog__controls .m-container {
  display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
  padding-bottom: 16px;
}
.m-blog__search {
  position: relative;
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px;
  background: #fff;
  border: 1px solid var(--line-2);
  border-radius: 99px;
  min-width: 280px; flex: 0 0 320px;
  transition: border-color 0.2s ease;
}
.m-blog__search:focus-within { border-color: var(--ink); }
.m-blog__search svg { color: var(--ink-3); flex-shrink: 0; }
.m-blog__search input {
  flex: 1; border: 0; background: transparent; outline: none;
  font: 400 14.5px var(--body);
  color: var(--ink);
}
.m-blog__search input::placeholder { color: var(--ink-3); }
.m-blog__search__clear {
  width: 22px; height: 22px;
  border: 0;
  background: rgba(10,15,30,0.06);
  border-radius: 50%;
  font-size: 16px;
  color: var(--ink-2);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.m-blog__cats {
  display: flex; gap: 6px; flex-wrap: wrap; flex: 1;
}
.m-blog__cat {
  padding: 8px 14px;
  border: 1px solid transparent;
  background: transparent;
  border-radius: 99px;
  font: 500 13px var(--body);
  color: var(--ink-2);
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
}
.m-blog__cat:hover { background: rgba(10,15,30,0.04); color: var(--ink); }
.m-blog__cat.is-active {
  background: var(--ink);
  color: var(--bg);
  border-color: var(--ink);
}

.m-blog__grid-section { padding: 56px 0 120px; }
.m-blog__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 24px;
}
.m-blog__empty {
  text-align: center;
  padding: 80px 0;
}
.m-blog__empty p {
  font: 400 16px var(--body);
  color: var(--ink-2);
  margin-bottom: 16px;
}

.m-postcard {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  text-decoration: none;
  transition: transform 0.25s cubic-bezier(0.22, 0.61, 0.36, 1),
              box-shadow 0.25s ease,
              border-color 0.25s ease;
}
.m-postcard:hover {
  transform: translateY(-4px);
  border-color: var(--line-2);
  box-shadow: 0 18px 44px rgba(10,15,30,0.07),
              0 4px 12px rgba(10,15,30,0.04);
}
.m-postcard__cover {
  aspect-ratio: 16 / 9;
  background: rgba(10,15,30,0.04);
  overflow: hidden;
}
.m-postcard__cover img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.m-postcard:hover .m-postcard__cover img { transform: scale(1.04); }

.m-postcard__body {
  display: flex; flex-direction: column; gap: 12px;
  padding: 22px 24px 24px;
  flex: 1;
}
.m-postcard__meta {
  display: flex; align-items: center; gap: 8px;
  font: 500 11.5px var(--body);
  letter-spacing: 0.04em;
}
.m-postcard__cat {
  padding: 4px 10px;
  border-radius: 99px;
  text-transform: uppercase;
  letter-spacing: 1.4px;
  font-size: 10.5px;
}
.m-postcard__cat.is-cultura   { background: rgba(245,158,11,0.10); color: #B45309; }
.m-postcard__cat.is-politica  { background: rgba(30,58,138,0.10);  color: #1E3A8A; }
.m-postcard__cat.is-pratica   { background: rgba(217,119,6,0.10);  color: #D97706; }
.m-postcard__cat.is-evidencia { background: rgba(15,118,110,0.10); color: #0F766E; }
.m-postcard__cat.is-evolucao  { background: rgba(127,29,29,0.10);  color: #9F1239; }
.m-postcard__dot { color: var(--ink-3); }
.m-postcard__read { color: var(--ink-3); }

.m-postcard__title {
  font-family: var(--display);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 2px 0 4px;
}
.m-postcard__excerpt {
  font: 400 14px/1.55 var(--body);
  color: var(--ink-2);
  margin: 0;
  flex: 1;
}
.m-postcard__foot {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 10px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.m-postcard__author {
  display: flex; align-items: center; gap: 8px;
  font: 500 13px var(--body);
  color: var(--ink);
}
.m-postcard__avatar {
  width: 26px; height: 26px;
  border-radius: 50%;
  background: var(--accent); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  font: 600 12px var(--body);
}
.m-postcard__date {
  font: 400 12.5px var(--body);
  color: var(--ink-3);
}

/* Featured (first) post — span 2 columns on desktop */
.m-postcard.is-feature {
  grid-column: span 2;
  flex-direction: row;
}
.m-postcard.is-feature .m-postcard__cover {
  flex: 0 0 50%;
  aspect-ratio: auto;
}
.m-postcard.is-feature .m-postcard__body {
  padding: 32px 36px;
  justify-content: center;
}
.m-postcard.is-feature .m-postcard__title { font-size: 26px; }
.m-postcard.is-feature .m-postcard__excerpt { font-size: 15px; }

@media (max-width: 1100px) {
  .m-blog__grid { grid-template-columns: repeat(2, 1fr); }
  .m-postcard.is-feature { grid-column: span 2; flex-direction: column; }
  .m-postcard.is-feature .m-postcard__cover { flex: 0 0 auto; aspect-ratio: 16/9; }
}
@media (max-width: 720px) {
  .m-blog__hero { padding: 100px 0 40px; }
  .m-blog__grid { grid-template-columns: 1fr; gap: 18px; }
  .m-blog__controls .m-container { flex-direction: column; align-items: stretch; }
  .m-blog__search { min-width: 0; flex: 1; }
  .m-blog__cats { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
  .m-postcard.is-feature { grid-column: span 1; }
}

/* =============================================================
   POST — single article (post.html)
   ============================================================= */
.m-post__hero {
  padding: 140px 0 40px;
  text-align: center;
  background:
    radial-gradient(ellipse 50% 40% at 50% 30%, rgba(217,119,6,0.08), transparent 70%);
}
.m-post__crumbs {
  display: flex; justify-content: center; gap: 8px;
  font: 500 12px var(--body);
  color: var(--ink-3);
  margin-bottom: 28px;
}
.m-post__crumbs a {
  color: var(--ink-2);
  text-decoration: none;
}
.m-post__crumbs a:hover { color: var(--ink); }
.m-post__cat {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 99px;
  font: 500 11px var(--body);
  text-transform: uppercase;
  letter-spacing: 1.6px;
  margin-bottom: 18px;
}
.m-post__cat.is-cultura   { background: rgba(245,158,11,0.10); color: #B45309; }
.m-post__cat.is-politica  { background: rgba(30,58,138,0.10);  color: #1E3A8A; }
.m-post__cat.is-pratica   { background: rgba(217,119,6,0.10);  color: #D97706; }
.m-post__cat.is-evidencia { background: rgba(15,118,110,0.10); color: #0F766E; }
.m-post__cat.is-evolucao  { background: rgba(127,29,29,0.10);  color: #9F1239; }

.m-post__title {
  font-family: var(--display);
  font-size: clamp(34px, 4.6vw, 60px);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 auto 24px;
  max-width: 920px;
  text-wrap: balance;
}
.m-post__lead {
  font: 400 19px/1.55 var(--body);
  color: var(--ink-2);
  max-width: 720px;
  margin: 0 auto 36px;
  text-wrap: pretty;
}
.m-post__meta {
  display: flex; justify-content: center; align-items: center; gap: 12px;
  flex-wrap: wrap;
  font: 400 13.5px var(--body);
  color: var(--ink-2);
}
.m-post__meta__dot { color: var(--ink-3); }
.m-post__author { display: flex; align-items: center; gap: 10px; }
.m-post__author > span:last-child { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.3; }
.m-post__author strong { color: var(--ink); font-weight: 600; font-size: 13.5px; }
.m-post__author small { color: var(--ink-3); font-size: 11.5px; font-weight: 500; }
.m-post__avatar {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--accent); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  font: 600 16px var(--body);
}

.m-post__cover {
  padding: 24px 0 0;
}
.m-post__cover img {
  width: 100%;
  max-height: 540px;
  object-fit: cover;
  display: block;
  border-radius: 20px;
}

.m-post__bodywrap { padding: 64px 0; position: relative; }
.m-post__bodywrap .m-container {
  display: grid;
  grid-template-columns: 1fr 64px;
  gap: 40px;
  max-width: 800px;
}
.m-post__body {
  font: 400 17.5px/1.7 var(--body);
  color: var(--ink-2);
  text-wrap: pretty;
}
.m-post__body p, .m-post__body ul, .m-post__body ol {
  margin: 0 0 22px;
}
.m-post__body h2 {
  font-family: var(--display);
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 44px 0 18px;
  line-height: 1.2;
}
.m-post__body strong { color: var(--ink); font-weight: 600; }
.m-post__intro {
  font-size: 19.5px;
  font-style: italic;
  color: var(--ink);
  border-left: 3px solid var(--accent);
  padding-left: 20px;
  margin: 0 0 32px;
}
.m-post__body blockquote {
  margin: 32px 0;
  padding: 22px 28px;
  background: rgba(245,158,11,0.06);
  border-radius: 12px;
  border-left: 3px solid var(--accent);
  font: 500 18px/1.5 var(--display);
  color: var(--ink);
  letter-spacing: -0.01em;
}
.m-post__body ol, .m-post__body ul { padding-left: 22px; }
.m-post__body li { margin-bottom: 14px; }

.m-post__share {
  position: sticky;
  top: 100px;
  align-self: start;
  display: flex; flex-direction: column; gap: 10px;
}
.m-post__share__label {
  font: 500 10px var(--body);
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--ink-3);
}
.m-post__share__btns { display: flex; flex-direction: column; gap: 8px; }
.m-post__share__btns button {
  width: 40px; height: 40px;
  border-radius: 50%;
  border: 1px solid var(--line-2);
  background: #fff;
  color: var(--ink-2);
  font: 600 13px var(--body);
  cursor: pointer;
  transition: all 0.2s ease;
}
.m-post__share__btns button:hover {
  background: var(--ink);
  color: var(--bg);
  border-color: var(--ink);
}

.m-post__related {
  padding: 80px 0 120px;
  border-top: 1px solid var(--line);
}
.m-post__related .m-blog__grid { grid-template-columns: repeat(3, 1fr); }

@media (max-width: 900px) {
  .m-post__bodywrap .m-container { grid-template-columns: 1fr; gap: 24px; }
  .m-post__share { position: static; flex-direction: row; align-items: center; }
  .m-post__share__btns { flex-direction: row; }
  .m-post__related .m-blog__grid { grid-template-columns: 1fr; }
}

/* =============================================================
   LEGAL — Terms / Privacy / Security (legal.html)
   ============================================================= */
.m-legal__hero {
  padding: 140px 0 32px;
  border-bottom: 1px solid var(--line);
}
.m-legal__crumbs {
  display: flex; gap: 8px;
  font: 500 12px var(--body);
  color: var(--ink-3);
  margin-bottom: 18px;
}
.m-legal__crumbs a {
  color: var(--ink-2);
  text-decoration: none;
}
.m-legal__crumbs a:hover { color: var(--ink); }
.m-legal__title {
  font-family: var(--display);
  font-size: clamp(36px, 4.4vw, 56px);
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 0 8px;
}
.m-legal__meta {
  font: 400 13.5px var(--body);
  color: var(--ink-3);
  margin: 0 0 28px;
}
.m-legal__tabs {
  display: flex; gap: 6px; flex-wrap: wrap;
}
.m-legal__tab {
  padding: 10px 18px;
  border: 1px solid var(--line-2);
  border-radius: 99px;
  font: 500 13px var(--body);
  color: var(--ink-2);
  text-decoration: none;
  transition: all 0.2s ease;
}
.m-legal__tab:hover {
  border-color: var(--ink);
  color: var(--ink);
}
.m-legal__tab.is-active {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--bg);
}

.m-legal__body { padding: 56px 0 100px; }
.m-legal__doc {
  max-width: 760px;
  margin: 0 auto;
}
.m-legal__section { margin-bottom: 36px; }
.m-legal__section h2 {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 12px;
}
.m-legal__section p {
  font: 400 16px/1.65 var(--body);
  color: var(--ink-2);
  margin: 0;
  text-wrap: pretty;
}
.m-legal__foot {
  margin-top: 64px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
}
.m-legal__foot p {
  font: 400 14.5px var(--body);
  color: var(--ink-2);
}
.m-legal__foot a {
  color: var(--accent);
  text-decoration: none;
  font-weight: 500;
  border-bottom: 1px solid currentColor;
}

/* =============================================================
   MODULE DETAIL PAGE (modulo.html)
   ============================================================= */
.m-modpage__hero {
  background: var(--dark-bg);
  color: var(--dark-ink);
  padding: 140px 0 100px;
  margin: 0 12px;
  border-radius: 28px;
  position: relative;
  overflow: hidden;
}
.m-modpage__hero::before {
  content: "";
  position: absolute;
  inset: -30%;
  background:
    radial-gradient(ellipse 40% 30% at 20% 30%, rgba(217,119,6,0.20), transparent 60%),
    radial-gradient(ellipse 35% 30% at 80% 80%, rgba(30,58,138,0.18), transparent 60%);
  pointer-events: none;
}
.m-modpage__hero > .m-container { position: relative; z-index: 1; }

.m-modpage__crumbs {
  display: flex; gap: 8px;
  font: 500 12px var(--body);
  color: rgba(255,255,255,0.45);
  margin-bottom: 36px;
}
.m-modpage__crumbs a {
  color: rgba(255,255,255,0.72);
  text-decoration: none;
}
.m-modpage__crumbs a:hover { color: #fff; }

.m-modpage__brand {
  display: flex; align-items: baseline; gap: 10px;
  margin-bottom: 14px;
}
.m-modpage__brand__prefix {
  font: 500 16px var(--body);
  letter-spacing: 0.04em;
  color: rgba(255,255,255,0.5);
  text-transform: lowercase;
}
.m-modpage__brand__name {
  font-family: var(--display);
  font-size: clamp(36px, 4.6vw, 56px);
  font-weight: 600;
  letter-spacing: -0.02em;
  color: #fff;
  line-height: 1;
}
.m-modpage__cat {
  font: 500 12px var(--body);
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 28px;
}
.m-modpage__title {
  font-family: var(--display);
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: -0.015em;
  color: rgba(255,255,255,0.92);
  max-width: 780px;
  margin: 0 0 36px;
  text-wrap: pretty;
}
.m-modpage__ctas { display: flex; gap: 12px; flex-wrap: wrap; }
.m-modpage__ctas .m-cta {
  color: rgba(255,255,255,0.92);
  border-color: rgba(255,255,255,0.25);
  background: transparent;
}
.m-modpage__ctas .m-cta:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.5);
  color: #fff;
}
.m-modpage__ctas .m-cta--primary {
  background: #fff;
  color: #0a0f1e;
  border-color: #fff;
}
.m-modpage__ctas .m-cta--primary:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.m-modpage__features { padding: 120px 0; }
.m-modpage__feats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin-top: 56px;
}
.m-modpage__feat {
  padding: 32px 30px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s;
}
.m-modpage__feat:hover {
  transform: translateY(-3px);
  border-color: var(--line-2);
  box-shadow: 0 14px 36px rgba(10,15,30,0.06);
}
.m-modpage__feat__num {
  font: 600 11px var(--body);
  letter-spacing: 2px;
  color: var(--accent);
}
.m-modpage__feat h3 {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 8px 0 10px;
  line-height: 1.2;
}
.m-modpage__feat p {
  font: 400 15px/1.6 var(--body);
  color: var(--ink-2);
  margin: 0;
}

.m-modpage__related {
  padding: 0 0 120px;
}
.m-modpage__related .m-section__head { margin-bottom: 48px; }

@media (max-width: 1000px) {
  .m-modpage__hero { margin: 0 6px; border-radius: 20px; padding: 100px 0 80px; }
  .m-modpage__feats { grid-template-columns: 1fr; }
}

/* =============================================================
   HEADER — mobile drawer + hamburger
   ============================================================= */
.m-header__ctas { display: flex; gap: 8px; }
.m-header__burger {
  display: none;
  position: relative;
  width: 40px; height: 40px;
  border: 1px solid var(--line-2);
  background: rgba(255,255,255,0.6);
  border-radius: 10px;
  cursor: pointer;
  padding: 0;
}
.m-header__burger span {
  position: absolute;
  left: 10px; right: 10px;
  height: 1.5px;
  background: var(--ink);
  border-radius: 2px;
  transition: transform 0.28s cubic-bezier(0.22,0.61,0.36,1),
              opacity 0.18s ease,
              top 0.28s cubic-bezier(0.22,0.61,0.36,1);
}
.m-header__burger span:nth-child(1) { top: 13px; }
.m-header__burger span:nth-child(2) { top: 19px; }
.m-header__burger span:nth-child(3) { top: 25px; }
.m-header.is-open .m-header__burger span:nth-child(1) { top: 19px; transform: rotate(45deg); }
.m-header.is-open .m-header__burger span:nth-child(2) { opacity: 0; }
.m-header.is-open .m-header__burger span:nth-child(3) { top: 19px; transform: rotate(-45deg); }

.m-header__drawer {
  position: fixed;
  inset: 64px 0 0 0;
  background: #fff;
  z-index: 99;
  overflow: hidden;
  transform: translateY(-12px);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.32s cubic-bezier(0.22,0.61,0.36,1),
              opacity 0.24s ease;
}
.m-header__drawer.is-open {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}

/* Two stacked screens: top-level and drilled-in. Top-level slides out
   to the left when a sub-screen is shown. */
.m-header__drawer__screen {
  position: absolute;
  inset: 0;
  overflow-y: auto;
  padding: 32px 24px 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  transition: transform 0.32s cubic-bezier(0.22,0.61,0.36,1);
  background: #fff;
}
.m-header__drawer.has-sub .m-header__drawer__screen:not(.is-sub) {
  transform: translateX(-30%);
  opacity: 0.4;
  pointer-events: none;
}
.m-header__drawer__screen.is-sub {
  transform: translateX(100%);
  z-index: 2;
}
.m-header__drawer.has-sub .m-header__drawer__screen.is-sub {
  transform: translateX(0);
}

/* Top-level nav */
.m-header__drawer__nav {
  list-style: none;
  margin: 0; padding: 0;
  display: flex; flex-direction: column;
  border-bottom: 1px solid var(--line);
  padding-bottom: 16px;
}
.m-header__drawer__nav li { margin: 0; }
.m-header__drawer__nav a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 4px;
  font: 500 22px var(--display);
  letter-spacing: -0.01em;
  color: var(--ink);
  text-decoration: none;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
}
.m-header__drawer__nav a.has-arrow svg { color: var(--ink-3); }
.m-header__drawer__nav li:last-child a { border-bottom: 0; }
.m-header__drawer__ctas {
  display: flex; flex-direction: column; gap: 8px;
}
.m-header__drawer__ctas .m-cta {
  width: 100%;
  justify-content: center;
  height: 48px;
}

/* Drilled-in sub-screen */
.m-header__drawer__back {
  display: inline-flex; align-items: center; gap: 8px;
  background: transparent;
  border: 0;
  padding: 4px 0 14px;
  font: 500 14px var(--body);
  letter-spacing: -0.01em;
  color: var(--ink);
  cursor: pointer;
  align-self: flex-start;
  border-bottom: 2px solid var(--ink);
  margin-bottom: 8px;
}
.m-header__drawer__sub__eyebrow {
  font: 500 11px var(--body);
  letter-spacing: 2.4px;
  text-transform: uppercase;
  color: var(--ink-3);
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.m-header__drawer__sub__items {
  list-style: none;
  margin: 0; padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.m-header__drawer__sub__items a {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 4px;
  text-decoration: none;
  color: inherit;
  border-radius: 12px;
  transition: background 0.18s ease;
}
.m-header__drawer__sub__items a:active,
.m-header__drawer__sub__items a:hover {
  background: var(--bg-2);
}
.m-header__drawer__sub__bullet {
  flex-shrink: 0;
  width: 38px; height: 38px;
  border-radius: 10px;
  background: rgba(245,158,11,0.10);
  color: var(--accent);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.m-header__drawer__sub__stage {
  font: 600 13px var(--body);
  letter-spacing: 0.8px;
  color: var(--accent);
}
.m-header__drawer__sub__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.m-header__drawer__sub__text strong {
  font: 600 16px var(--display);
  letter-spacing: -0.01em;
  color: var(--ink);
}
.m-header__drawer__sub__text span {
  font: 400 13.5px var(--body);
  color: var(--ink-2);
}

.m-header__drawer__sub__extras {
  margin-top: 16px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.m-header__drawer__sub__extras a {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px 14px;
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: 12px;
  text-decoration: none;
  color: inherit;
}
.m-header__drawer__sub__extras strong {
  font: 600 14.5px var(--display);
  letter-spacing: -0.01em;
  color: var(--ink);
}
.m-header__drawer__sub__extras span {
  font: 400 12.5px var(--body);
  color: var(--ink-2);
}

@media (max-width: 820px) {
  .m-nav { display: none; }
  .m-header__ctas { display: none; }
  .m-header__burger { display: inline-flex; }
  .m-header__inner { padding: 0 18px; }
  .m-header__logo img { height: 26px; }
}

/* =============================================================
   FOOTER — mobile (stack cols, lighter padding)
   ============================================================= */
@media (max-width: 1000px) {
  .m-footer { padding: 56px 24px 24px; }
  .m-footer__main {
    grid-template-columns: 1fr;
    gap: 36px;
    padding-bottom: 36px;
  }
  .m-footer__cols { grid-template-columns: repeat(2, 1fr); gap: 28px 20px; }
  .m-footer__brand p { max-width: none; }
}
@media (max-width: 560px) {
  .m-footer { padding: 48px 20px 20px; }
  .m-footer__cols { grid-template-columns: 1fr; gap: 24px; }
  .m-footer__bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    text-align: left;
  }
}


/* =============================================================
   ABOUT page
   ============================================================= */
.m-about__hero {
  padding: 140px 0 80px;
  background:
    radial-gradient(ellipse 60% 50% at 50% 30%, rgba(217,119,6,0.10), transparent 70%),
    radial-gradient(ellipse 40% 40% at 20% 80%, rgba(30,58,138,0.06), transparent 70%);
}
.m-about__hero .m-eyebrow { margin-bottom: 22px; }
.m-about__title {
  font-family: var(--display);
  font-size: clamp(40px, 5.5vw, 76px);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.025em;
  color: var(--ink);
  margin: 0 0 22px;
  max-width: 880px;
  text-wrap: balance;
}
.m-about__title .em { font-family: var(--serif); font-style: italic; font-weight: 400; color: var(--accent); }
.m-about__lead {
  font: 400 19px/1.55 var(--body);
  color: var(--ink-2);
  max-width: 680px;
}

.m-about__manifesto-section { padding: 100px 0 120px; }
.m-about__manifesto {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: 56px;
}
.m-about__belief {
  padding: 32px 30px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 18px;
}
.m-about__belief__num {
  font: 600 11px var(--body);
  letter-spacing: 2px;
  color: var(--accent);
  margin-bottom: 12px;
}
.m-about__belief h3 {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: #fff;
  margin: 0 0 10px;
}
.m-about__belief p {
  font: 400 14.5px/1.6 var(--body);
  color: rgba(255,255,255,0.72);
  margin: 0;
}

.m-about__journey { padding: 100px 0; }
.m-about__timeline {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-top: 48px;
  position: relative;
}
.m-about__timeline::before {
  content: "";
  position: absolute;
  top: 30px; left: 6%; right: 6%;
  height: 1px;
  background: linear-gradient(to right, transparent, var(--line-2), var(--line-2), transparent);
}
.m-about__step {
  position: relative;
  padding-top: 56px;
}
.m-about__step::before {
  content: "";
  position: absolute;
  top: 25px; left: 0;
  width: 12px; height: 12px;
  background: var(--bg);
  border: 1.5px solid var(--accent);
  border-radius: 50%;
}
.m-about__step__year {
  font: 600 11px var(--body);
  letter-spacing: 1.8px;
  color: var(--ink-3);
  margin-bottom: 8px;
}
.m-about__step h3 {
  font-family: var(--display);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 8px;
}
.m-about__step p {
  font: 400 14px/1.6 var(--body);
  color: var(--ink-2);
  margin: 0;
}

.m-about__team-section { padding: 60px 0 120px; }
.m-about__team {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-top: 48px;
}
.m-about__member {
  padding: 32px 28px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
}
.m-about__member__avatar {
  width: 56px; height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--accent), #1E3A8A);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font: 600 22px var(--display);
  margin-bottom: 18px;
}
.m-about__member h3 {
  font-family: var(--display);
  font-size: 20px;
  font-weight: 600;
  color: var(--ink);
  letter-spacing: -0.015em;
  margin: 0 0 4px;
}
.m-about__member__role {
  font: 500 11px var(--body);
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 14px;
}
.m-about__member p {
  font: 400 14px/1.6 var(--body);
  color: var(--ink-2);
  margin: 0;
}

@media (max-width: 900px) {
  .m-about__manifesto { grid-template-columns: 1fr; }
  .m-about__timeline { grid-template-columns: 1fr; gap: 32px; }
  .m-about__timeline::before { display: none; }
  .m-about__team { grid-template-columns: 1fr; }
}

/* =============================================================
   PRICING page
   ============================================================= */
.m-pricing__hero {
  padding: 140px 0 60px;
  text-align: center;
  background: radial-gradient(ellipse 60% 50% at 50% 30%, rgba(217,119,6,0.10), transparent 70%);
}
.m-pricing__hero .m-eyebrow { justify-content: center; }
.m-pricing__title {
  font-family: var(--display);
  font-size: clamp(40px, 5vw, 64px);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 18px auto 18px;
  max-width: 880px;
  text-wrap: balance;
}
.m-pricing__title .em { font-family: var(--serif); font-style: italic; font-weight: 400; color: var(--accent); }
.m-pricing__lead {
  font: 400 17px/1.55 var(--body);
  color: var(--ink-2);
  max-width: 640px;
  margin: 0 auto;
}

.m-pricing__plans-section { padding: 64px 0 80px; }
.m-pricing__plans {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  align-items: stretch;
}
.m-pricing__plan {
  position: relative;
  display: flex; flex-direction: column;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 36px 30px 32px;
  transition: transform 0.25s cubic-bezier(0.22,0.61,0.36,1), box-shadow 0.25s, border-color 0.25s;
}
.m-pricing__plan:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 44px rgba(10,15,30,0.07);
  border-color: var(--line-2);
}
.m-pricing__plan.is-featured {
  background: #0a0f1e;
  color: #fff;
  border-color: #0a0f1e;
}
.m-pricing__plan__badge {
  position: absolute;
  top: -12px;
  left: 50%; transform: translateX(-50%);
  padding: 6px 14px;
  background: var(--accent);
  color: #fff;
  font: 500 11px var(--body);
  letter-spacing: 1.4px;
  text-transform: uppercase;
  border-radius: 99px;
}
.m-pricing__plan__head {
  border-bottom: 1px solid var(--line);
  padding-bottom: 22px;
  margin-bottom: 22px;
}
.m-pricing__plan.is-featured .m-pricing__plan__head { border-bottom-color: rgba(255,255,255,0.10); }
.m-pricing__plan__tag {
  font: 500 11px var(--body);
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 10px;
}
.m-pricing__plan__name {
  font-family: var(--display);
  font-size: 32px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 6px;
}
.m-pricing__plan.is-featured .m-pricing__plan__name { color: #fff; }
.m-pricing__plan__price {
  font: 500 18px var(--display);
  color: var(--ink-3);
  margin-bottom: 14px;
}
.m-pricing__plan.is-featured .m-pricing__plan__price { color: rgba(255,255,255,0.55); }
.m-pricing__plan__blurb {
  font: 400 14.5px/1.55 var(--body);
  color: var(--ink-2);
  margin: 0;
}
.m-pricing__plan.is-featured .m-pricing__plan__blurb { color: rgba(255,255,255,0.78); }
.m-pricing__plan__body { flex: 1; }
.m-pricing__plan__body ul {
  list-style: none;
  display: flex; flex-direction: column; gap: 10px;
  margin: 0; padding: 0;
}
.m-pricing__plan__body li {
  display: flex; align-items: flex-start; gap: 10px;
  font: 400 14px/1.5 var(--body);
  color: var(--ink-2);
}
.m-pricing__plan__body li svg {
  flex-shrink: 0;
  color: var(--accent);
  margin-top: 4px;
}
.m-pricing__plan.is-featured .m-pricing__plan__body li { color: rgba(255,255,255,0.78); }
.m-pricing__plan__cta {
  align-self: stretch;
  text-align: center;
  margin-top: 24px;
  justify-content: center;
}
.m-pricing__plan.is-featured .m-pricing__plan__cta {
  background: #fff;
  color: #0a0f1e;
  border-color: #fff;
}
.m-pricing__plan.is-featured .m-pricing__plan__cta:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.m-pricing__compare { padding: 80px 0; }
.m-pricing__table {
  margin-top: 40px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
}
.m-pricing__table__row {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  font: 400 14px var(--body);
  color: var(--ink-2);
  border-top: 1px solid var(--line);
}
.m-pricing__table__row:first-child { border-top: 0; }
.m-pricing__table__row > div { padding: 16px 22px; }
.m-pricing__table__row > div:not(:first-child) { border-left: 1px solid var(--line); }
.m-pricing__table__row--head {
  background: var(--bg-2);
  font: 600 12px var(--body);
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--ink);
}
.m-pricing__table__label { font-weight: 500; color: var(--ink); }

.m-pricing__faq { padding: 80px 0 120px; }
.m-pricing__faq__list {
  display: flex; flex-direction: column;
  max-width: 800px;
  margin: 40px auto 0;
}
.m-pricing__faq__item {
  border-top: 1px solid var(--line);
}
.m-pricing__faq__item:last-child { border-bottom: 1px solid var(--line); }
.m-pricing__faq__item summary {
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 4px;
  cursor: pointer;
  font: 500 18px var(--display);
  letter-spacing: -0.015em;
  color: var(--ink);
  list-style: none;
}
.m-pricing__faq__item summary::-webkit-details-marker { display: none; }
.m-pricing__faq__item summary svg {
  color: var(--ink-3);
  transition: transform 0.25s cubic-bezier(0.22,0.61,0.36,1);
}
.m-pricing__faq__item[open] summary svg { transform: rotate(180deg); }
.m-pricing__faq__item p {
  padding: 0 4px 22px;
  font: 400 15px/1.65 var(--body);
  color: var(--ink-2);
  margin: 0;
}

@media (max-width: 1000px) {
  .m-pricing__plans { grid-template-columns: 1fr; gap: 14px; }
  .m-pricing__table__row { grid-template-columns: 1fr; }
  .m-pricing__table__row > div:not(:first-child) { border-left: 0; border-top: 1px solid var(--line); }
  .m-pricing__table__row--head { display: none; }
}

/* =============================================================
   404 page
   ============================================================= */
.m-404 {
  min-height: calc(100vh - 64px);
  display: flex; align-items: center; justify-content: center;
  padding: 80px 0;
  background: radial-gradient(ellipse 60% 50% at 50% 30%, rgba(217,119,6,0.10), transparent 70%);
}
.m-404__wrap {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}
.m-404__wrap .m-eyebrow { justify-content: center; margin: 18px 0; }
.m-404__code {
  font-family: var(--display);
  font-size: clamp(140px, 22vw, 280px);
  font-weight: 600;
  line-height: 0.9;
  letter-spacing: -0.06em;
  color: var(--ink);
  margin: 0 auto 8px;
}
.m-404__code .em {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  color: var(--accent);
}
.m-404__title {
  font-family: var(--display);
  font-size: clamp(30px, 4vw, 48px);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 0 22px;
  text-wrap: balance;
}
.m-404__title .em { font-family: var(--serif); font-style: italic; font-weight: 400; color: var(--accent); }
.m-404__lead {
  font: 400 17px/1.55 var(--body);
  color: var(--ink-2);
  margin: 0 auto 36px;
  max-width: 580px;
}
.m-404__lead em { font-style: italic; color: var(--ink); }
.m-404__ctas {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}


/* =============================================================
   MEGAMENU — Plataforma + Como funciona
   ============================================================= */
.m-nav__item.has-mega {
  display: flex;
  align-items: center;
  align-self: stretch;
}
.m-nav__item.has-mega .m-nav__trigger {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  /* Generous vertical padding so the hover hit-area covers the full
     header height — prevents flicker when the cursor sits on the text.
     Negative margin keeps the visible layout intact. */
  padding: 22px 6px;
  margin: -22px -6px;
}
/* Brand-color line under the ACTIVE trigger only, sits at header bottom */
.m-nav__item.has-mega .m-nav__trigger::after {
  content: "";
  position: absolute;
  left: 6px;
  right: 6px;
  bottom: -2px;
  height: 2px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: center;
  opacity: 0;
  transition: transform 0.32s cubic-bezier(0.22, 0.61, 0.36, 1),
              opacity 0.2s ease;
  pointer-events: none;
  z-index: 2;
}
.m-nav__item.has-mega .m-nav__trigger.is-active::after {
  transform: scaleX(1);
  opacity: 1;
}
.m-nav__item.has-mega .m-nav__trigger svg {
  transition: transform 0.22s cubic-bezier(0.22,0.61,0.36,1);
  transform-origin: center center;
  color: var(--ink-3);
}
.m-nav__item.has-mega .m-nav__trigger.is-active svg { transform: rotate(180deg); color: var(--ink); }
.m-nav__item.has-mega .m-nav__trigger.is-active { color: var(--ink); }

.m-mega {
  position: fixed;
  top: 72px;
  left: 50%;
  transform: translate(-50%, -8px);
  width: calc(100vw - 32px);
  max-width: 1060px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  box-shadow: 0 24px 60px rgba(10,15,30,0.18);
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
  transition: opacity 0.22s cubic-bezier(0.22,0.61,0.36,1),
              transform 0.28s cubic-bezier(0.22,0.61,0.36,1),
              visibility 0s linear 0.22s;
  pointer-events: none;
}
.m-mega.is-open {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
  pointer-events: auto;
  transition-delay: 0s;
}
.m-mega__inner {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 40px;
  padding: 32px 36px 28px;
}
.m-mega__col-l { min-width: 0; }
.m-mega__label {
  display: inline-block;
  font: 500 11px var(--body);
  letter-spacing: 2.4px;
  text-transform: uppercase;
  color: var(--ink-3);
  margin-bottom: 22px;
}
.m-mega__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  margin-bottom: 28px;
}
.m-mega__grid.is-loop { grid-template-columns: 1fr 1fr; }
.m-mega__item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 16px;
  border-radius: 12px;
  text-decoration: none;
  transition: background 0.18s ease;
}
.m-mega__item:hover { background: var(--bg-2); }
.m-mega__item__icon {
  flex-shrink: 0;
  width: 38px; height: 38px;
  border-radius: 10px;
  background: rgba(245,158,11,0.10);
  color: var(--accent);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.m-mega__item__stage {
  font: 600 13px var(--body);
  letter-spacing: 0.8px;
  color: var(--accent);
}
.m-mega__item__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.m-mega__item__text strong {
  font: 600 14.5px var(--display);
  letter-spacing: -0.01em;
  color: var(--ink);
}
.m-mega__item__text span {
  font: 400 12.5px var(--body);
  color: var(--ink-2);
}

.m-mega__extras {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}
.m-mega__extra {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 14px 16px;
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: 12px;
  text-decoration: none;
  position: relative;
  transition: border-color 0.18s ease, background 0.18s ease;
}
.m-mega__extra:hover {
  border-color: var(--line-2);
  background: var(--bg-3);
}
.m-mega__extra strong {
  font: 600 14px var(--display);
  letter-spacing: -0.01em;
  color: var(--ink);
}
.m-mega__extra span {
  font: 400 12.5px var(--body);
  color: var(--ink-2);
}
.m-mega__extra svg {
  position: absolute;
  top: 50%; right: 14px;
  transform: translateY(-50%);
  color: var(--ink-3);
  transition: transform 0.22s cubic-bezier(0.22,0.61,0.36,1), color 0.18s;
}
.m-mega__extra:hover svg {
  color: var(--accent);
  transform: translate(3px, -50%);
}

.m-mega__feature {
  position: relative;
  display: block;
  /* Bleed to the top and right edges of the panel — overflow: hidden on
     .m-mega clips to the panel's outer radius automatically. */
  margin: -32px -36px 0 0;
  border-radius: 0;
  overflow: hidden;
  min-height: 320px;
  text-decoration: none;
  background: #0a0f1e;
}
.m-mega__feature img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
  position: absolute;
  inset: 0;
  transition: transform 0.5s cubic-bezier(0.22,0.61,0.36,1);
}
.m-mega__feature:hover img { transform: scale(1.03); }
.m-mega__feature::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(10,15,30,0.85) 0%, rgba(10,15,30,0.40) 45%, transparent 100%);
}
.m-mega__feature__caption {
  position: absolute;
  left: 22px; right: 22px; bottom: 20px;
  display: flex; flex-direction: column; gap: 4px;
  z-index: 2;
}
.m-mega__feature__caption strong {
  font: 600 19px var(--display);
  letter-spacing: -0.015em;
  color: #fff;
}
.m-mega__feature__caption span {
  font: 400 13px var(--body);
  color: rgba(255,255,255,0.78);
}

.m-mega__foot {
  background: var(--bg-2);
  border-top: 1px solid var(--line);
  padding: 14px 36px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 24px;
}
.m-mega__foot__links { display: flex; gap: 28px; align-items: center; }
.m-mega__foot__links a {
  font: 500 13px var(--body);
  color: var(--ink-2);
  text-decoration: none;
  cursor: pointer;
}
.m-mega__foot__links a:hover { color: var(--ink); }
.m-mega__close {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  background: transparent;
  border: 0;
  font: 500 13px var(--body);
  color: var(--ink-2);
  cursor: pointer;
  border-radius: 8px;
  transition: background 0.18s, color 0.18s;
}
.m-mega__close:hover { background: rgba(10,15,30,0.04); color: var(--ink); }

/* Backdrop behind the megamenu — only dims below the header */
.m-header__backdrop {
  position: fixed;
  top: 64px;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(10,15,30,0.18);
  z-index: 98;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.22s ease, visibility 0s linear 0.22s;
  pointer-events: none;
}
.m-header__backdrop.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}

@media (max-width: 820px) {
  .m-mega, .m-header__backdrop { display: none; }
}


/* =============================================================
   PROBLEM TABLE — Dia a dia hoje × Dia a dia com akdmi
   Lives on .is-dark section, so colors target the dark surface.
   ============================================================= */
.m-problem__table {
  margin-top: 56px;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(255,255,255,0.02);
}
.m-problem__table__head {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.m-problem__table__h {
  padding: 22px 28px;
  border-bottom: 1px solid rgba(255,255,255,0.10);
}
.m-problem__table__h.is-after {
  border-left: 1px solid rgba(255,255,255,0.10);
  background: rgba(245,158,11,0.06);
}
.m-problem__table__h .m-eyebrow {
  color: rgba(255,255,255,0.55);
  margin: 0;
}
.m-problem__table__h.is-after .m-eyebrow {
  color: var(--accent);
}
.m-problem__table__h.is-after .m-eyebrow::before {
  background: var(--accent);
  box-shadow: 0 0 16px var(--accent);
}

.m-problem__table__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid rgba(255,255,255,0.08);
}
.m-problem__table__row:first-of-type { border-top: 0; }
.m-problem__table__cell {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 22px 28px;
  font: 400 16px/1.5 var(--body);
}
.m-problem__table__cell.is-before {
  color: rgba(255,255,255,0.55);
  text-decoration: line-through;
  text-decoration-color: rgba(255,255,255,0.18);
  text-decoration-thickness: 1px;
}
.m-problem__table__cell.is-after {
  color: #ffffff;
  border-left: 1px solid rgba(255,255,255,0.10);
  background: rgba(245,158,11,0.04);
}
.m-problem__table__cell.is-after strong {
  color: var(--accent);
  font-weight: 600;
}
.m-problem__table__icon {
  flex-shrink: 0;
  width: 22px; height: 22px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
  background: rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.45);
}
.m-problem__table__icon.is-check {
  background: rgba(245,158,11,0.18);
  color: var(--accent);
}

@media (max-width: 800px) {
  .m-problem__table__head { display: none; }
  .m-problem__table__row { grid-template-columns: 1fr; }
  .m-problem__table__cell.is-after { border-left: 0; border-top: 1px solid rgba(255,255,255,0.10); }
  .m-problem__table__cell { padding: 18px 22px; font-size: 15px; }
}


/* =============================================================
   LOOP STAGE PAGE (estagio.html)
   ============================================================= */
.m-stage__hero {
  position: relative;
  padding: 120px 0 64px;
  min-height: 70vh;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  color: #fff;
}
.m-stage__hero__img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
}
.m-stage__hero__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to top, rgba(10,15,30,0.85) 0%, rgba(10,15,30,0.45) 50%, rgba(10,15,30,0.2) 100%);
  z-index: 1;
}
.m-stage__hero .m-container { position: relative; z-index: 2; }
.m-stage__crumbs {
  display: flex; gap: 8px;
  font: 500 12px var(--body);
  color: rgba(255,255,255,0.65);
  margin-bottom: 28px;
}
.m-stage__crumbs a { color: rgba(255,255,255,0.85); text-decoration: none; }
.m-stage__crumbs a:hover { color: #fff; }
.m-stage__hero__inner {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 880px;
}
.m-stage__hero__stage {
  font: 600 13px var(--body);
  letter-spacing: 2.4px;
  color: var(--accent);
}
.m-stage__hero__title {
  font-family: var(--display);
  font-size: clamp(56px, 8vw, 120px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.025em;
  color: #fff;
  margin: 0;
}
.m-stage__hero__title .em {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  color: var(--accent);
}
.m-stage__hero__tag {
  font: 400 21px/1.4 var(--body);
  color: rgba(255,255,255,0.92);
  margin: 6px 0 0;
  max-width: 700px;
  text-wrap: pretty;
}

.m-stage__intro { padding: 100px 0 80px; }
.m-stage__lead {
  font-family: var(--display);
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 64px;
  border-left: 3px solid var(--accent);
  padding-left: 24px;
  text-wrap: pretty;
}
.m-stage__blocks {
  display: flex;
  flex-direction: column;
  gap: 56px;
}
.m-stage__block h2 {
  font-family: var(--display);
  font-size: 28px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 16px;
}
.m-stage__block p {
  font: 400 17px/1.7 var(--body);
  color: var(--ink-2);
  margin: 0;
  text-wrap: pretty;
}
.m-stage__block p strong {
  color: var(--ink);
  font-weight: 600;
}

.m-stage__caps { padding: 80px 0; }
.m-stage__caps .m-section__head { margin-bottom: 40px; }
.m-stage__bullets {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.m-stage__bullets li {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 22px 24px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  font: 400 15.5px/1.5 var(--body);
  color: var(--ink);
}
.m-stage__bullets__num {
  font: 600 12px var(--body);
  letter-spacing: 1.6px;
  color: var(--accent);
  flex-shrink: 0;
  padding-top: 1px;
}

.m-stage__nav-section { padding: 80px 0 120px; }
.m-stage__nav-section .m-section__head { margin-bottom: 56px; }
.m-stage__nav {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
}
.m-stage__nav__card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 24px 22px 26px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  text-decoration: none;
  color: inherit;
  transition: transform 0.25s cubic-bezier(0.22,0.61,0.36,1),
              border-color 0.25s ease,
              box-shadow 0.25s ease;
}
.m-stage__nav__card:hover {
  transform: translateY(-3px);
  border-color: var(--line-2);
  box-shadow: 0 14px 32px rgba(10,15,30,0.06);
}
.m-stage__nav__card.is-current {
  background: var(--ink);
  color: #fff;
  border-color: var(--ink);
}
.m-stage__nav__num {
  font: 600 11px var(--body);
  letter-spacing: 1.6px;
  color: var(--accent);
}
.m-stage__nav__card.is-current .m-stage__nav__num { color: var(--accent); }
.m-stage__nav__card strong {
  font-family: var(--display);
  font-size: 19px;
  font-weight: 600;
  letter-spacing: -0.015em;
}
.m-stage__nav__card > span:last-child {
  font: 400 13px/1.4 var(--body);
  color: var(--ink-2);
}
.m-stage__nav__card.is-current > span:last-child { color: rgba(255,255,255,0.72); }

@media (max-width: 1000px) {
  .m-stage__hero { padding: 100px 0 48px; min-height: 60vh; }
  .m-stage__bullets { grid-template-columns: 1fr; }
  .m-stage__nav { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .m-stage__hero__title { font-size: 56px; }
  .m-stage__nav { grid-template-columns: 1fr; }
}


/* Loop icons (replace 01-05 numbers) */
.m-loop__node__num {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  color: var(--accent);
}
.m-stage__hero__stage {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px; height: 56px;
  border-radius: 14px;
  background: rgba(217,119,6,0.15);
  color: var(--accent);
  margin-bottom: 4px;
}
.m-stage__nav__num {
  display: inline-flex;
  align-items: center;
  color: var(--accent);
}
.m-stage__nav__card.is-current .m-stage__nav__num { color: var(--accent); }


/* =============================================================
   MODULE PAGE — rich variant (modulo.html?id=corporatepulse)
   ============================================================= */
.m-modpage__hero-rich {
  position: relative;
  padding: 140px 0 80px;
  min-height: 84vh;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  color: #fff;
}
.m-modpage__hero-rich__img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 0;
}
.m-modpage__hero-rich__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(10,15,30,0.85) 0%, rgba(10,15,30,0.50) 50%, rgba(10,15,30,0.25) 100%);
  z-index: 1;
}
.m-modpage__hero-rich .m-container { position: relative; z-index: 2; }
.m-modpage__hero-rich__inner {
  display: flex; flex-direction: column; gap: 16px;
  max-width: 880px;
}
.m-modpage__brand-pill {
  display: inline-flex; align-items: stretch;
  align-self: flex-start;
  height: 36px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.18);
}
.m-modpage__brand-pill__prefix {
  padding: 0 14px;
  display: inline-flex; align-items: center;
  font: 500 13px var(--body);
  letter-spacing: 0.04em;
  color: rgba(255,255,255,0.78);
  text-transform: lowercase;
}
.m-modpage__brand-pill__name {
  padding: 0 16px;
  display: inline-flex; align-items: center;
  font: 600 14px var(--body);
  color: #fff;
  background: var(--mod-color, var(--accent));
}
.m-modpage__cat-rich {
  font: 500 12px var(--body);
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--accent);
}
.m-modpage__title-rich {
  font-family: var(--display);
  font-size: clamp(40px, 5.5vw, 76px);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.025em;
  color: #fff;
  margin: 0;
  text-wrap: balance;
}
.m-modpage__title-rich .em { font-family: var(--serif); font-style: italic; font-weight: 400; color: var(--accent); }
.m-modpage__hero-rich__ctas {
  display: flex; gap: 12px; flex-wrap: wrap;
  margin-top: 12px;
}
.m-modpage__hero-rich__ctas .m-cta {
  color: rgba(255,255,255,0.92);
  border-color: rgba(255,255,255,0.25);
  background: transparent;
}
.m-modpage__hero-rich__ctas .m-cta:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.5);
  color: #fff;
}
.m-modpage__hero-rich__ctas .m-cta--primary {
  background: #fff; color: #0a0f1e; border-color: #fff;
}
.m-modpage__hero-rich__ctas .m-cta--primary:hover {
  background: var(--accent); border-color: var(--accent); color: #fff;
}

.m-modpage__intro { padding: 100px 0 60px; }
.m-modpage__lead {
  font-family: var(--display);
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0;
  border-left: 3px solid var(--accent);
  padding-left: 24px;
  text-wrap: pretty;
}

.m-modpage__audience { padding: 60px 0 80px; }
.m-modpage__audience .m-section__head { margin-bottom: 48px; }
.m-modpage__audience__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.m-modpage__audience__card {
  padding: 32px 30px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  display: flex; flex-direction: column; gap: 14px;
}
.m-modpage__audience__role {
  font: 500 11px var(--body);
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--accent);
}
.m-modpage__audience__card p {
  font-family: var(--display);
  font-style: italic;
  font-size: 19px;
  font-weight: 400;
  line-height: 1.45;
  color: var(--ink);
  margin: 0;
}

.m-modpage__flow { padding: 80px 0; background: var(--bg-2); }
.m-modpage__flow .m-section__head { margin-bottom: 56px; }
.m-modpage__flow__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  position: relative;
}
.m-modpage__flow__step {
  padding: 28px 24px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  display: flex; flex-direction: column; gap: 10px;
}
.m-modpage__flow__num {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  font: 600 14px var(--body);
}
.m-modpage__flow__step h3 {
  font-family: var(--display);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 4px 0 4px;
}
.m-modpage__flow__step p {
  font: 400 14px/1.55 var(--body);
  color: var(--ink-2);
  margin: 0;
}

.m-modpage__proof { padding: 80px 0; }
.m-modpage__proof__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  text-align: center;
}
.m-modpage__proof__item {
  padding: 32px 24px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}
.m-modpage__proof__kpi {
  font-family: var(--display);
  font-size: 56px;
  font-weight: 500;
  letter-spacing: -0.025em;
  line-height: 1;
  color: var(--accent);
  margin-bottom: 14px;
}
.m-modpage__proof__label {
  font: 400 14px/1.5 var(--body);
  color: var(--ink-2);
  max-width: 240px;
  margin: 0 auto;
}

@media (max-width: 900px) {
  .m-modpage__audience__grid,
  .m-modpage__flow__grid,
  .m-modpage__proof__grid { grid-template-columns: 1fr; }
  .m-modpage__hero-rich { padding: 110px 0 56px; min-height: 70vh; }
}


/* =============================================================
   RELATED MODULES — used at the bottom of every module page
   ============================================================= */
.m-modgrid-rel {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-top: 16px;
}
.m-modcard-rel {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform 0.25s cubic-bezier(0.22,0.61,0.36,1),
              border-color 0.25s ease,
              box-shadow 0.25s ease;
}
.m-modcard-rel:hover {
  transform: translateY(-4px);
  border-color: var(--line-2);
  box-shadow: 0 18px 44px rgba(10,15,30,0.07);
}
.m-modcard-rel__cover {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--bg-3);
}
.m-modcard-rel__cover img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  display: block;
  transition: transform 0.4s cubic-bezier(0.22,0.61,0.36,1);
}
.m-modcard-rel:hover .m-modcard-rel__cover img { transform: scale(1.03); }
.m-modcard-rel__cover__ph {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  background:
    repeating-linear-gradient(135deg, rgba(245,158,11,0.06) 0 1px, transparent 1px 11px),
    radial-gradient(ellipse at center, rgba(245,158,11,0.10), transparent 70%),
    var(--bg-2);
}
.m-modcard-rel__cover__ph span {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink-3);
}
.m-modcard-rel__body {
  display: flex; flex-direction: column;
  gap: 10px;
  padding: 22px 24px 24px;
  flex: 1;
}
.m-modcard-rel__brand {
  display: flex; align-items: baseline; gap: 6px;
}
.m-modcard-rel__brand__prefix {
  font: 500 12px var(--body);
  letter-spacing: 0.04em;
  color: var(--ink-3);
  text-transform: lowercase;
}
.m-modcard-rel__brand__name {
  font-family: var(--display);
  font-size: 21px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  line-height: 1.1;
}
.m-modcard-rel__cat {
  font: 500 10.5px var(--body);
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--accent);
}
.m-modcard-rel__body__text {
  font: 400 14px/1.55 var(--body);
  color: var(--ink-2);
  margin: 0;
  flex: 1;
}
.m-modcard-rel__arrow {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 6px;
  font: 500 13px var(--body);
  color: var(--ink);
}
.m-modcard-rel__arrow svg {
  transition: transform 0.25s cubic-bezier(0.22,0.61,0.36,1);
}
.m-modcard-rel:hover .m-modcard-rel__arrow { color: var(--accent); }
.m-modcard-rel:hover .m-modcard-rel__arrow svg { transform: translateX(3px); }

@media (max-width: 1000px) {
  .m-modgrid-rel { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 700px) {
  .m-modgrid-rel { grid-template-columns: 1fr; }
}


/* =============================================================
   MEGAMENU — 3-column variant (Recursos)
   ============================================================= */
.m-mega--3col {
  max-width: 1100px;
}
.m-mega__inner-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  padding: 36px 40px 32px;
}
.m-mega__col {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.m-mega__col .m-mega__label {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 8px;
}
.m-mega__list {
  list-style: none;
  margin: 0; padding: 0;
  display: flex; flex-direction: column;
  gap: 2px;
}
.m-mega__listitem {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px 10px;
  border-radius: 10px;
  text-decoration: none;
  color: inherit;
  transition: background 0.18s ease;
}
.m-mega__listitem:hover { background: var(--bg-2); }
.m-mega__listitem__name {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--display);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.m-mega__listitem__star {
  color: var(--accent);
  flex-shrink: 0;
  filter: drop-shadow(0 0 6px rgba(217,119,6,0.45));
}
.m-mega__listitem__sub {
  font: 400 12.5px var(--body);
  color: var(--ink-2);
}
.m-mega__listitem__badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  font: 600 9.5px var(--body);
  letter-spacing: 0.4px;
  text-transform: uppercase;
  color: var(--accent);
  background: rgba(217,119,6,0.10);
  border-radius: 999px;
}


/* =============================================================
   STATIC PAGES (pagina.html?id=...)
   ============================================================= */
.m-static__hero {
  padding: 140px 0 60px;
  background:
    radial-gradient(ellipse 60% 50% at 50% 30%, rgba(217,119,6,0.10), transparent 70%),
    radial-gradient(ellipse 40% 40% at 20% 80%, rgba(30,58,138,0.06), transparent 70%);
  text-align: center;
}
.m-static__hero .m-eyebrow { justify-content: center; }
.m-static__title {
  font-family: var(--display);
  font-size: clamp(40px, 5vw, 64px);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 18px auto 18px;
  max-width: 880px;
  text-wrap: balance;
}
.m-static__title .em { font-family: var(--serif); font-style: italic; font-weight: 400; color: var(--accent); }
.m-static__lead {
  font: 400 18px/1.55 var(--body);
  color: var(--ink-2);
  max-width: 680px;
  margin: 0 auto 28px;
  text-wrap: pretty;
}
.m-static__hero__ctas { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }

/* SOON body */
.m-static__values { padding: 80px 0 120px; }
.m-static__values__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.m-static__value {
  padding: 32px 28px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
}
.m-static__value__num {
  font: 600 11px var(--body);
  letter-spacing: 2px;
  color: var(--accent);
  margin-bottom: 14px;
}
.m-static__value h3 {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 12px;
}
.m-static__value p {
  font: 400 14.5px/1.6 var(--body);
  color: var(--ink-2);
  margin: 0;
}

/* PRESS body */
.m-static__releases { padding: 80px 0 60px; }
.m-static__releases__list {
  list-style: none;
  padding: 0; margin: 0;
}
.m-static__releases__list li {
  border-top: 1px solid var(--line);
}
.m-static__releases__list li:last-child { border-bottom: 1px solid var(--line); }
.m-static__releases__list a {
  display: block;
  padding: 22px 4px;
  text-decoration: none;
  color: inherit;
}
.m-static__release__meta {
  display: flex; align-items: center; gap: 14px;
  font: 500 12px var(--body);
  letter-spacing: 0.04em;
  color: var(--ink-3);
  margin-bottom: 6px;
}
.m-static__release__tag {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 99px;
  background: rgba(217,119,6,0.10);
  color: var(--accent);
  font: 500 10px var(--body);
  letter-spacing: 1.4px;
  text-transform: uppercase;
}
.m-static__releases__list h3 {
  font-family: var(--display);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0;
}

.m-static__kit { padding: 60px 0 100px; }
.m-static__kit__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 28px;
}
.m-static__kit__card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 28px 24px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  text-decoration: none;
  color: inherit;
  transition: border-color 0.2s ease, transform 0.25s ease;
}
.m-static__kit__card:hover { border-color: var(--line-2); transform: translateY(-2px); }
.m-static__kit__card h3 {
  font-family: var(--display);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0;
}
.m-static__kit__card p {
  font: 400 13.5px/1.55 var(--body);
  color: var(--ink-2);
  margin: 0;
  flex: 1;
}
.m-static__kit__badge {
  display: inline-flex;
  padding: 4px 10px;
  font: 500 10.5px var(--body);
  letter-spacing: 0.4px;
  text-transform: uppercase;
  color: var(--ink-3);
  background: var(--bg-2);
  border-radius: 6px;
  align-self: flex-start;
}
.m-static__kit__contact {
  margin-top: 36px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
  font: 400 14.5px var(--body);
  color: var(--ink-2);
}
.m-static__kit__contact a { color: var(--accent); font-weight: 500; }

/* PARTNERS body */
.m-static__tiers { padding: 80px 0 120px; }
.m-static__tiers .m-section__head { margin-bottom: 48px; }
.m-static__tiers__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.m-static__tier {
  position: relative;
  padding: 36px 30px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  display: flex; flex-direction: column; gap: 14px;
}
.m-static__tier.is-featured {
  background: #0a0f1e;
  color: #fff;
  border-color: #0a0f1e;
}
.m-static__tier__badge {
  position: absolute;
  top: -12px;
  left: 50%; transform: translateX(-50%);
  padding: 6px 14px;
  background: var(--accent);
  color: #fff;
  font: 500 11px var(--body);
  letter-spacing: 1.4px;
  text-transform: uppercase;
  border-radius: 99px;
}
.m-static__tier h3 {
  font-family: var(--display);
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -0.015em;
  margin: 0;
  color: var(--ink);
}
.m-static__tier.is-featured h3 { color: #fff; }
.m-static__tier__sub {
  font: 400 14.5px/1.55 var(--body);
  color: var(--ink-2);
  margin: 0 0 4px;
}
.m-static__tier.is-featured .m-static__tier__sub { color: rgba(255,255,255,0.78); }
.m-static__tier ul {
  list-style: none;
  padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 10px;
}
.m-static__tier li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font: 400 14px/1.5 var(--body);
  color: var(--ink-2);
}
.m-static__tier li svg {
  flex-shrink: 0;
  color: var(--accent);
  margin-top: 4px;
}
.m-static__tier.is-featured li { color: rgba(255,255,255,0.78); }

/* FAQ body */
.m-static__faq { padding: 80px 0 120px; }
.m-static__faq__group { margin-bottom: 48px; }
.m-static__faq__group__h {
  font-family: var(--display);
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 12px;
}

/* COMPARE body */
.m-static__cats { padding: 80px 0; background: var(--bg-2); }
.m-static__cats__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 40px;
}
.m-static__cat {
  padding: 28px 24px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
}
.m-static__cat h3 {
  font-family: var(--display);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 10px;
}
.m-static__cat p {
  font: 400 13.5px/1.55 var(--body);
  color: var(--ink-2);
  margin: 0;
}

.m-static__vs { padding: 80px 0; }
.m-static__vs .m-section__head { margin-bottom: 40px; }
.m-static__vs__table {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
}
.m-static__vs__row {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
  font: 400 14px var(--body);
  color: var(--ink-2);
  border-top: 1px solid var(--line);
  align-items: center;
}
.m-static__vs__row:first-child { border-top: 0; }
.m-static__vs__row > div { padding: 18px 22px; }
.m-static__vs__row > div:not(:first-child) {
  border-left: 1px solid var(--line);
  text-align: center;
}
.m-static__vs__row--head {
  background: var(--bg-2);
  font: 600 12px var(--body);
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--ink);
}
.m-static__vs__label { font-weight: 500; color: var(--ink); }
.m-static__vs__own { background: rgba(217,119,6,0.04); }
.m-static__vs__partial {
  font: 500 11px var(--body);
  letter-spacing: 1px;
  color: var(--ink-3);
  text-transform: uppercase;
}
.m-static__vs__dash { color: var(--ink-3); font-size: 16px; }

.m-static__cta-foot { padding: 60px 0 120px; }
.m-static__cta-card {
  background: #0a0f1e;
  color: #fff;
  border-radius: 24px;
  padding: 64px 56px;
  text-align: center;
}
.m-static__cta-card h3 {
  font-family: var(--display);
  font-size: clamp(28px, 3.5vw, 44px);
  font-weight: 500;
  letter-spacing: -0.02em;
  margin: 0 0 22px;
}
.m-static__cta-card .m-cta--primary { background: #fff; color: #0a0f1e; border-color: #fff; }
.m-static__cta-card .m-cta--primary:hover { background: var(--accent); border-color: var(--accent); color: #fff; }

@media (max-width: 900px) {
  .m-static__values__grid,
  .m-static__tiers__grid,
  .m-static__kit__grid,
  .m-static__cats__grid { grid-template-columns: 1fr; }
  .m-static__vs__row { grid-template-columns: 1fr; }
  .m-static__vs__row > div:not(:first-child) { border-left: 0; border-top: 1px solid var(--line); text-align: left; display: flex; justify-content: space-between; }
  .m-static__vs__row > div:not(:first-child)::before {
    content: attr(data-col) " ";
    font: 600 10px var(--body);
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: var(--ink-3);
  }
  .m-static__vs__row--head { display: none; }
}


/* =============================================================
   CAREERS page — Deel-style rich layout
   ============================================================= */
.m-careers__stats {
  padding: 60px 0 80px;
  border-bottom: 1px solid var(--line);
}
.m-careers__stats__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.m-careers__stat {
  text-align: left;
}
.m-careers__stat__kpi {
  font-family: var(--display);
  font-size: clamp(48px, 5vw, 72px);
  font-weight: 500;
  letter-spacing: -0.025em;
  line-height: 1;
  color: var(--ink);
  margin-bottom: 12px;
}
.m-careers__stat__label {
  font: 400 14px/1.4 var(--body);
  color: var(--ink-2);
  max-width: 200px;
}

.m-careers__collage { padding: 80px 0 60px; }
.m-careers__collage__grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  grid-template-rows: 220px 220px;
  gap: 12px;
  border-radius: 24px;
  overflow: hidden;
}
.m-careers__photo {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
}
.m-careers__photo--1 { grid-row: 1 / span 2; }
.m-careers__photo--2 { grid-column: 2; grid-row: 1; }
.m-careers__photo--3 { grid-column: 3; grid-row: 1; }
.m-careers__photo--4 { grid-column: 2 / span 2; grid-row: 2; }

.m-careers__values { padding: 80px 0 100px; }
.m-careers__values .m-section__head { margin-bottom: 48px; }
.m-careers__values__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
}
.m-careers__value {
  padding: 36px 32px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  display: flex; flex-direction: column; gap: 12px;
}
.m-careers__value__num {
  font: 600 11px var(--body);
  letter-spacing: 2px;
  color: var(--accent);
}
.m-careers__value h3 {
  font-family: var(--display);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0;
}
.m-careers__value p {
  font: 400 15px/1.6 var(--body);
  color: var(--ink-2);
  margin: 0;
}

.m-careers__benefits { padding: 100px 0; background: var(--bg-2); }
.m-careers__benefits .m-section__head { margin-bottom: 48px; }
.m-careers__benefits__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.m-careers__benefit {
  display: flex;
  gap: 14px;
  padding: 24px 22px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
}
.m-careers__benefit svg {
  flex-shrink: 0;
  color: var(--accent);
  margin-top: 2px;
}
.m-careers__benefit h3 {
  font-family: var(--display);
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 6px;
}
.m-careers__benefit p {
  font: 400 13.5px/1.55 var(--body);
  color: var(--ink-2);
  margin: 0;
}

.m-careers__teams { padding: 100px 0; }
.m-careers__teams .m-section__head { margin-bottom: 40px; }
.m-careers__teams__list {
  list-style: none;
  margin: 0; padding: 0;
  border-top: 1px solid var(--line);
}
.m-careers__team {
  display: flex;
  align-items: center;
  gap: 32px;
  padding: 28px 4px;
  border-bottom: 1px solid var(--line);
}
.m-careers__team__size {
  flex-shrink: 0;
  width: 70px;
  font-family: var(--display);
  font-size: 44px;
  font-weight: 500;
  letter-spacing: -0.025em;
  line-height: 1;
  color: var(--accent);
}
.m-careers__team__body { flex: 1; }
.m-careers__team__body h3 {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 4px;
}
.m-careers__team__body p {
  font: 400 14px var(--body);
  color: var(--ink-2);
  margin: 0;
}

.m-careers__positions { padding: 100px 0; background: var(--bg-2); }
.m-careers__positions .m-section__head { margin-bottom: 40px; }
.m-careers__positions__list {
  list-style: none;
  margin: 0; padding: 0;
  border-top: 1px solid var(--line);
}
.m-careers__position {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 22px 24px;
  border-bottom: 1px solid var(--line);
  background: #fff;
  text-decoration: none;
  color: inherit;
  transition: background 0.18s ease;
}
.m-careers__position:hover { background: var(--bg-3); }
.m-careers__position__title {
  font-family: var(--display);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  flex: 1;
}
.m-careers__position__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font: 400 13px var(--body);
  color: var(--ink-2);
}
.m-careers__position__meta .dot { color: var(--ink-3); }
.m-careers__position svg { color: var(--ink-3); }
.m-careers__position:hover svg { color: var(--accent); }

.m-careers__empty {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 56px 48px;
  text-align: center;
}
.m-careers__empty h3 {
  font-family: var(--display);
  font-size: 28px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 14px;
}
.m-careers__empty p {
  font: 400 15.5px/1.6 var(--body);
  color: var(--ink-2);
  margin: 0 auto 24px;
  max-width: 560px;
}

.m-careers__quote { padding: 80px 0 120px; }
.m-careers__quote blockquote {
  margin: 0;
  text-align: center;
  border-left: 0;
  background: transparent;
}
.m-careers__quote blockquote p {
  font-family: var(--display);
  font-size: clamp(22px, 2.6vw, 32px);
  font-weight: 400;
  font-style: italic;
  line-height: 1.4;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 24px;
  text-wrap: balance;
}
.m-careers__quote blockquote p::before,
.m-careers__quote blockquote p::after { content: none; }
.m-careers__quote blockquote footer {
  font: 500 13px var(--body);
  color: var(--ink-2);
}
.m-careers__quote blockquote footer strong {
  color: var(--ink);
  display: block;
  font-weight: 600;
  margin-bottom: 2px;
}
.m-careers__quote blockquote footer span {
  color: var(--ink-3);
  font-weight: 400;
}

@media (max-width: 1000px) {
  .m-careers__stats__grid { grid-template-columns: repeat(2, 1fr); }
  .m-careers__collage__grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 180px 180px 180px;
  }
  .m-careers__photo--1 { grid-row: 1; grid-column: 1 / span 2; }
  .m-careers__photo--2 { grid-row: 2; grid-column: 1; }
  .m-careers__photo--3 { grid-row: 2; grid-column: 2; }
  .m-careers__photo--4 { grid-row: 3; grid-column: 1 / span 2; }
  .m-careers__values__grid,
  .m-careers__benefits__grid { grid-template-columns: 1fr; }
  .m-careers__position { flex-direction: column; align-items: flex-start; gap: 6px; }
}


/* Careers — timeline */
.m-careers__timeline-section { padding: 100px 0; }
.m-careers__timeline-section .m-section__head { margin-bottom: 56px; }
.m-careers__timeline {
  list-style: none;
  margin: 0; padding: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0;
}
/* Vertical spine running through the year column */
.m-careers__timeline::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  left: 96px;
  width: 1px;
  background: linear-gradient(to bottom, transparent, var(--line-2) 8%, var(--line-2) 92%, transparent);
}
.m-careers__timeline__step {
  display: grid;
  grid-template-columns: 200px 1fr;
  align-items: center;
  gap: 36px;
  padding: 24px 0;
  position: relative;
}
.m-careers__timeline__step::before {
  content: "";
  position: absolute;
  top: 50%;
  margin-top: -5.5px;
  left: 91px;
  width: 11px; height: 11px;
  border-radius: 50%;
  background: var(--bg);
  border: 1.5px solid var(--accent);
}
.m-careers__timeline__step:hover::before {
  background: var(--accent);
  box-shadow: 0 0 0 4px rgba(217,119,6,0.18);
}
.m-careers__timeline__year {
  font-family: var(--display);
  font-size: 36px;
  font-weight: 500;
  letter-spacing: -0.025em;
  line-height: 1;
  color: var(--accent);
}
.m-careers__timeline__body {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 22px 24px;
  transition: border-color 0.2s ease, transform 0.25s ease;
}
.m-careers__timeline__step:hover .m-careers__timeline__body {
  border-color: var(--line-2);
  transform: translateX(4px);
}
.m-careers__timeline__body h3 {
  font-family: var(--display);
  font-size: 21px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 8px;
}
.m-careers__timeline__body p {
  font: 400 14.5px/1.6 var(--body);
  color: var(--ink-2);
  margin: 0;
}

@media (max-width: 700px) {
  .m-careers__timeline::before { left: 18px; }
  .m-careers__timeline__step {
    grid-template-columns: 1fr;
    padding-left: 44px;
    gap: 8px;
    align-items: flex-start;
  }
  .m-careers__timeline__step::before { top: 28px; left: 13px; margin-top: 0; }
  .m-careers__timeline__year { font-size: 26px; margin-bottom: 4px; }
}


/* =============================================================
   EVENTS page
   ============================================================= */
.m-events__upcoming { padding: 80px 0 60px; }
.m-events__upcoming .m-section__head { margin-bottom: 40px; }
.m-events__list {
  list-style: none;
  margin: 0; padding: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.m-event-card {
  display: grid;
  grid-template-columns: 96px 1fr auto;
  gap: 28px;
  align-items: center;
  padding: 28px 28px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  text-decoration: none;
  color: inherit;
  transition: transform 0.25s cubic-bezier(0.22,0.61,0.36,1),
              border-color 0.25s ease,
              box-shadow 0.25s ease;
}
.m-event-card:hover {
  transform: translateY(-3px);
  border-color: var(--line-2);
  box-shadow: 0 18px 44px rgba(10,15,30,0.07);
}
.m-event-card__date {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 14px 8px;
  background: var(--bg-2);
  border-radius: 12px;
  border: 1px solid var(--line);
}
.m-event-card__day {
  font-family: var(--display);
  font-size: 36px;
  font-weight: 500;
  letter-spacing: -0.025em;
  line-height: 1;
  color: var(--accent);
}
.m-event-card__month {
  font: 600 11px var(--body);
  letter-spacing: 1.4px;
  color: var(--ink-3);
  margin-top: 4px;
}
.m-event-card__body { min-width: 0; }
.m-event-card__meta {
  display: flex; align-items: center; gap: 10px;
  font: 500 12px var(--body);
  color: var(--ink-3);
  margin-bottom: 8px;
  flex-wrap: wrap;
}
.m-event-card__format { color: var(--ink-2); font-weight: 500; }
.m-event-card__dot { color: var(--ink-3); }
.m-event-card__tag {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 99px;
  font: 600 10.5px var(--body);
  letter-spacing: 1.2px;
  text-transform: uppercase;
}
.m-event-card__tag.is-cultura   { background: rgba(245,158,11,0.10); color: #B45309; }
.m-event-card__tag.is-politica  { background: rgba(30,58,138,0.10);  color: #1E3A8A; }
.m-event-card__tag.is-pratica   { background: rgba(217,119,6,0.10);  color: #D97706; }
.m-event-card__tag.is-evidencia { background: rgba(15,118,110,0.10); color: #0F766E; }
.m-event-card__tag.is-evolucao  { background: rgba(127,29,29,0.10);  color: #9F1239; }
.m-event-card__tag.is-produto   { background: rgba(10,15,30,0.08);   color: var(--ink); }
.m-event-card__title {
  font-family: var(--display);
  font-size: 21px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 6px;
  line-height: 1.25;
}
.m-event-card__desc {
  font: 400 14px/1.55 var(--body);
  color: var(--ink-2);
  margin: 0 0 14px;
}
.m-event-card__foot {
  display: flex; align-items: center; gap: 14px;
  flex-wrap: wrap;
}
.m-event-card__speakers { display: flex; }
.m-event-card__speaker {
  width: 30px; height: 30px;
  border-radius: 50%;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font: 600 11px var(--body);
  letter-spacing: 0.4px;
  border: 2px solid #fff;
  margin-left: -8px;
  box-shadow: 0 2px 6px rgba(10,15,30,0.10);
}
.m-event-card__speaker:first-child { margin-left: 0; }
.m-event-card__spots {
  font: 500 12px var(--body);
  color: var(--ink-3);
}
.m-event-card__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 18px;
  background: var(--ink);
  color: #fff;
  border-radius: 99px;
  font: 500 13px var(--body);
  transition: background 0.2s ease;
  flex-shrink: 0;
}
.m-event-card:hover .m-event-card__cta { background: var(--accent); }

.m-events__past { padding: 80px 0 120px; background: var(--bg-2); }
.m-events__past .m-section__head { margin-bottom: 40px; }
.m-events__past__list {
  list-style: none;
  margin: 0; padding: 0;
  border-top: 1px solid var(--line);
}
.m-event-past {
  display: grid;
  grid-template-columns: 200px 1fr auto;
  gap: 24px;
  align-items: center;
  padding: 22px 4px;
  border-bottom: 1px solid var(--line);
}
.m-event-past__date {
  font: 500 13px var(--body);
  color: var(--ink-3);
  letter-spacing: 0.04em;
}
.m-event-past__title {
  font-family: var(--display);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
}
.m-event-past__meta {
  display: flex; align-items: center; gap: 10px;
  font: 400 13px var(--body);
  color: var(--ink-2);
  flex-wrap: wrap;
  justify-content: flex-end;
}

@media (max-width: 800px) {
  .m-event-card {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 22px;
  }
  .m-event-card__date {
    flex-direction: row;
    gap: 12px;
    justify-content: flex-start;
    padding: 12px 18px;
  }
  .m-event-card__month { margin-top: 0; }
  .m-event-card__cta { align-self: flex-start; }
  .m-event-past {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .m-event-past__meta { justify-content: flex-start; }
}


/* Events — empty state */
.m-events__empty-section { padding: 60px 0 120px; }
.m-events__empty {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 64px 56px;
  text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 14px;
}
.m-events__empty svg {
  color: var(--accent);
  background: rgba(217,119,6,0.10);
  padding: 16px;
  border-radius: 16px;
  width: 64px; height: 64px;
  margin-bottom: 8px;
}
.m-events__empty h3 {
  font-family: var(--display);
  font-size: 28px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0;
}
.m-events__empty p {
  font: 400 15.5px/1.6 var(--body);
  color: var(--ink-2);
  margin: 0 auto 12px;
  max-width: 560px;
}


/* =============================================================
   PARTNERS page — deeper layout
   ============================================================= */
.m-partners__cases { padding: 100px 0; background: var(--bg-2); }
.m-partners__cases .m-section__head { margin-bottom: 56px; }
.m-partners__cases__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.m-partners__case {
  display: flex; flex-direction: column;
  gap: 12px;
  padding: 28px 28px 24px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  transition: transform 0.25s cubic-bezier(0.22,0.61,0.36,1),
              border-color 0.25s ease,
              box-shadow 0.25s ease;
}
.m-partners__case:hover {
  transform: translateY(-3px);
  border-color: var(--line-2);
  box-shadow: 0 16px 36px rgba(10,15,30,0.06);
}
.m-partners__case__head {
  display: flex; justify-content: space-between; align-items: center;
  gap: 10px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.m-partners__case__num {
  font: 600 11px var(--body);
  letter-spacing: 1.8px;
  color: var(--accent);
}
.m-partners__case__module {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  font: 500 10.5px var(--body);
  letter-spacing: 0.6px;
  background: var(--bg-2);
  color: var(--ink-2);
  text-align: right;
}
.m-partners__case h3 {
  font-family: var(--display);
  font-size: 19px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 4px 0 6px;
  text-wrap: balance;
}
.m-partners__case p {
  font: 400 14px/1.6 var(--body);
  color: var(--ink-2);
  margin: 0;
  flex: 1;
}
.m-partners__case__foot {
  display: flex; align-items: center; gap: 8px;
  padding-top: 12px;
  margin-top: 4px;
  border-top: 1px solid var(--line);
  font: 500 12.5px var(--body);
  color: var(--ink-3);
}
.m-partners__case__foot svg { color: var(--accent); flex-shrink: 0; }

.m-partners__flow { padding: 100px 0; }
.m-partners__flow .m-section__head { margin-bottom: 56px; }
.m-partners__flow__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}
.m-partners__flow__step {
  padding: 30px 26px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  display: flex; flex-direction: column; gap: 10px;
}
.m-partners__flow__num {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  font: 600 15px var(--body);
}
.m-partners__flow__step h3 {
  font-family: var(--display);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 6px 0 4px;
}
.m-partners__flow__step p {
  font: 400 14px/1.55 var(--body);
  color: var(--ink-2);
  margin: 0;
}

.m-partners__proof { padding: 60px 0 100px; }
.m-partners__proof__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
.m-partners__proof__item {
  padding: 32px 28px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  text-align: center;
}
.m-partners__proof__kpi {
  font-family: var(--display);
  font-size: 56px;
  font-weight: 500;
  letter-spacing: -0.025em;
  line-height: 1;
  color: var(--accent);
  margin-bottom: 14px;
}
.m-partners__proof__label {
  font: 400 14px/1.5 var(--body);
  color: var(--ink-2);
  max-width: 240px;
  margin: 0 auto;
}

@media (max-width: 1000px) {
  .m-partners__cases__grid,
  .m-partners__flow__grid,
  .m-partners__proof__grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .m-partners__case__module { font-size: 9.5px; padding: 4px 8px; }
}