/* ============================================================
   Botões
   ============================================================ */

.c-btn {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 52px;
  padding: 14px 26px;
  border: 1px solid transparent;
  border-radius: 0;
  background: none;
  font: 600 1rem/1 var(--font-display);
  letter-spacing: -0.01em;
  cursor: pointer;
  overflow: hidden;
  transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease),
    border-color var(--t-fast) var(--ease);
}

.c-btn > * { position: relative; z-index: 1; }

.c-btn::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 auto 0 -10%;
  width: 0;
  background: var(--blue-dark);
  transform: skewX(calc(var(--slant) * -1));
  transition: width var(--t-mid) var(--ease);
}

.c-btn:hover .u-arrow { transform: translateX(4px); }

.c-btn--primary { background: var(--orange); color: var(--blue-dark); }
.c-btn--primary:hover { color: var(--white); }
.c-btn--primary:hover::after { width: 125%; }

.c-btn--secondary { border-color: var(--blue); color: var(--blue); }
.c-btn--secondary::after { background: var(--blue); }
.c-btn--secondary:hover { color: var(--white); border-color: var(--blue); }
.c-btn--secondary:hover::after { width: 125%; }

.c-btn--ghost { border-color: var(--line-light-2); color: var(--white); }
.c-btn--ghost::after { background: var(--white); }
.c-btn--ghost:hover { color: var(--blue-dark); border-color: var(--white); }
.c-btn--ghost:hover::after { width: 125%; }

.c-btn--block { width: 100%; }
.c-btn[disabled] { opacity: 0.55; cursor: progress; }
.c-btn[disabled]::after { width: 0; }

.c-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }

/* ============================================================
   Barra de utilidade + header
   ============================================================ */

.c-slot-header { min-height: calc(var(--util-h) + var(--header-h)); }

.c-util {
  background: var(--blue-dark);
  color: var(--white);
  border-bottom: 1px solid var(--line-light);
}

.c-util-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
  height: var(--util-h);
  font: 400 0.8125rem/1 var(--font-body);
}

.c-util-place { display: inline-flex; align-items: center; gap: 10px; color: rgba(255, 255, 255, 0.82); }
.c-util-place::before {
  content: "";
  width: 18px;
  height: 5px;
  background: var(--orange);
  transform: skewX(calc(var(--slant) * -1));
}

.c-util-links { display: flex; align-items: center; gap: var(--space-5); }
.c-util-links a { display: inline-flex; align-items: center; gap: 8px; color: var(--white); }
.c-util-links a:hover { color: var(--white); text-decoration: underline; text-underline-offset: 4px; }
.c-util-links svg { width: 14px; height: 14px; opacity: 0.7; }

.c-header {
  position: sticky;
  top: 0;
  z-index: 60;
  background: var(--white);
  border-bottom: 1px solid var(--grey-light);
  transition: box-shadow var(--t-mid) var(--ease);
}

.c-header.is-stuck { box-shadow: var(--shadow-bar); }

.c-header-inner {
  display: flex;
  align-items: center;
  gap: var(--space-5);
  height: var(--header-h);
}

.c-logo {
  display: flex;
  align-items: center;
  gap: 14px;
  flex: 0 0 auto;
  padding-block: 8px;
}

.c-logo img {
  width: auto;
  height: 34px;
  min-width: 96px;
}

.c-logo-tag {
  padding-left: 14px;
  border-left: 1px solid var(--grey-light);
  font: 400 0.75rem/1.3 var(--font-body);
  color: var(--grey-dark);
  max-width: 7.5em;
}

.c-nav { display: flex; align-items: stretch; height: var(--header-h); margin-left: auto; }

.c-nav-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 100%;
  padding: 0 16px;
  border: 0;
  background: none;
  color: var(--blue-dark);
  font: 700 0.9375rem/1 var(--font-body);
  cursor: pointer;
}

.c-nav-btn::after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 16px;
  right: 16px;
  height: 3px;
  background: var(--blue);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--t-mid) var(--ease);
}

.c-nav-portal,
.c-drawer-portal {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--blue-dark);
  font: 700 0.9375rem/1 var(--font-body);
}

.c-nav-portal { height: 100%; padding: 0 16px; }

.c-nav-portal-mark {
  width: 16px;
  height: 6px;
  background: var(--orange);
  transform: skewX(calc(var(--slant) * -1));
  flex: 0 0 auto;
}

.c-nav-portal:hover,
.c-drawer-portal:hover { color: var(--blue); }

.c-drawer-portal {
  min-height: 56px;
  border-bottom: 1px solid var(--grey-light);
}

.c-nav-btn:hover { color: var(--blue); }
.c-nav-btn.is-active,
.c-nav-btn[aria-expanded="true"] { color: var(--blue); }
.c-nav-btn.is-active::after,
.c-nav-btn[aria-expanded="true"]::after { transform: scaleX(1); }

.c-chev { width: 11px; height: 11px; transition: transform var(--t-fast) var(--ease); }
.c-nav-btn[aria-expanded="true"] .c-chev,
.c-acc-btn[aria-expanded="true"] .c-chev { transform: rotate(180deg); }

/* --- Mega painel --- */

.c-panel {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 59;
  background: var(--white);
  border-bottom: 1px solid var(--grey-light);
  box-shadow: var(--shadow-panel);
  animation: panel-in var(--t-mid) var(--ease-out);
}

@keyframes panel-in {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: none; }
}

.c-panel-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.46fr);
  gap: clamp(24px, 4vw, 64px);
  padding-block: 32px 36px;
}

.c-panel-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 24px; align-content: start; }
.c-panel-list--single { grid-template-columns: minmax(0, 1fr); }

.c-panel-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto;
  align-items: center;
  gap: 2px 16px;
  padding: 14px 16px 14px 18px;
  border-left: 2px solid transparent;
  transition: border-color var(--t-fast) var(--ease), background var(--t-fast) var(--ease);
}

.c-panel-item:hover,
.c-panel-item:focus-visible { border-left-color: var(--blue); background: var(--tint-blue); }
.c-panel-item:hover .c-panel-title { color: var(--blue); }
.c-panel-item:hover .u-arrow { transform: translateX(4px); }
.c-panel-item[aria-current="page"] .c-panel-title { color: var(--blue); }
.c-panel-item[aria-current="page"] { border-left-color: var(--blue); }

.c-panel-title { grid-area: 1 / 1 / 2 / 2; font: 700 1rem/1.35 var(--font-body); color: var(--blue-dark); }
.c-panel-desc { grid-area: 2 / 1 / 3 / 2; font: 400 0.8125rem/1.45 var(--font-body); color: var(--grey-dark); }
.c-panel-item .u-arrow,
.c-panel-item .u-ext { grid-area: 1 / 2 / 3 / 3; align-self: center; color: var(--grey-mid); }
.c-panel-item:hover .u-arrow,
.c-panel-item:hover .u-ext { color: var(--blue); }

.c-panel-feature {
  position: relative;
  display: block;
  align-self: start;
  background: var(--blue-dark);
  color: var(--white);
  overflow: hidden;
}

.c-panel-feature img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  opacity: 0.85;
  transition: transform var(--t-slow) var(--ease-out), opacity var(--t-fast) var(--ease);
}

.c-panel-feature:hover img { transform: scale(1.04); opacity: 1; }

.c-panel-feature-body { padding: 18px 20px 22px; }
.c-panel-feature-kicker {
  font: 700 0.6875rem/1 var(--font-body);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--orange);
}
.c-panel-feature h3 { margin-top: 10px; color: var(--white); font-size: 1.0625rem; }
:where(.c-panel-feature) p { margin-top: 6px; font-size: 0.8125rem; line-height: 1.5; color: rgba(255, 255, 255, 0.76); }
.c-panel-feature .c-panel-feature-kicker { margin-top: 0; }

/* --- Ferramentas do header --- */

.c-header-tools { display: flex; align-items: center; gap: var(--space-3); flex: 0 0 auto; }

.c-lang {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  border: 1px solid var(--grey-light);
  color: var(--blue-dark);
  font: 700 0.8125rem/1 var(--font-body);
  letter-spacing: 0.06em;
}

.c-lang[aria-current="true"] { border-color: var(--blue); color: var(--blue); }

.c-header .c-btn { min-height: 46px; padding: 12px 20px; font-size: 0.9375rem; }

.c-burger {
  display: none;
  width: 46px;
  height: 46px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--grey-light);
  background: var(--white);
  color: var(--blue-dark);
  cursor: pointer;
}

.c-burger:hover { border-color: var(--blue); color: var(--blue); }

.c-progress {
  position: absolute;
  left: 0;
  bottom: -1px;
  height: 2px;
  width: 0;
  background: var(--blue);
  z-index: 2;
}

/* --- Drawer mobile --- */

.c-backdrop {
  position: fixed;
  inset: 0;
  z-index: 70;
  border: 0;
  padding: 0;
  background: var(--veil-dark);
  backdrop-filter: blur(2px);
}

.c-drawer {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 80;
  display: flex;
  flex-direction: column;
  width: min(100vw, 400px);
  height: 100%;
  background: var(--white);
  overflow-y: auto;
  overscroll-behavior: contain;
}

.c-drawer[hidden],
.c-backdrop[hidden] { display: none !important; }

.c-drawer-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 20px;
  background: var(--blue-dark);
}

.c-drawer-top img { height: 26px; width: auto; }

.c-drawer-close {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid var(--line-light-2);
  background: none;
  color: var(--white);
  font: 700 0.875rem/1 var(--font-body);
  cursor: pointer;
}

.c-drawer-contact {
  display: grid;
  gap: 2px;
  padding: 16px 20px;
  background: var(--tint-blue);
  border-bottom: 1px solid var(--grey-light);
}

.c-drawer-contact a { display: flex; align-items: center; gap: 10px; min-height: 40px; color: var(--blue-dark); font-weight: 700; }
.c-drawer-contact svg { width: 15px; height: 15px; color: var(--blue); }

.c-drawer-nav { padding: 8px 20px 0; }

.c-acc-btn {
  display: flex;
  width: 100%;
  min-height: 56px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0;
  border: 0;
  border-bottom: 1px solid var(--grey-light);
  background: none;
  color: var(--blue-dark);
  font: 700 1.0625rem/1.3 var(--font-display);
  text-align: left;
  cursor: pointer;
}

.c-acc-btn.is-active { color: var(--blue); }
.c-acc-panel { padding: 6px 0 14px; border-bottom: 1px solid var(--grey-light); }

.c-acc-panel a {
  display: grid;
  gap: 2px;
  min-height: 48px;
  align-content: center;
  padding: 8px 0 8px 16px;
  border-left: 2px solid var(--grey-light);
  color: var(--blue-dark);
  font: 700 0.9375rem/1.35 var(--font-body);
}

.c-acc-panel a:hover,
.c-acc-panel a[aria-current="page"] { border-left-color: var(--blue); color: var(--blue); }
.c-acc-panel .c-panel-desc { font-weight: 400; }

.c-drawer-cta { margin-top: auto; display: grid; gap: 14px; padding: 24px 20px 28px; }
.c-drawer-cta .c-lang { justify-self: start; }

/* ============================================================
   Breadcrumb + barra de âncoras
   ============================================================ */

.c-crumb-bar { border-bottom: 1px solid var(--grey-light); background: var(--white); }

.c-crumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  font: 400 0.8125rem/1.4 var(--font-body);
  color: var(--grey-dark);
}

.c-crumb a { color: var(--grey-dark); }
.c-crumb a:hover { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
.c-crumb [aria-hidden="true"] { color: var(--grey-mid); }
.c-crumb [aria-current="page"] { color: var(--blue-dark); font-weight: 700; }

.c-subnav {
  position: sticky;
  top: var(--header-h);
  z-index: 50;
  background: var(--white);
  border-bottom: 1px solid var(--grey-light);
}

.c-subnav-inner {
  display: flex;
  align-items: center;
  gap: 4px;
  height: var(--subnav-h);
  overflow-x: auto;
  scrollbar-width: none;
}

.c-subnav-inner::-webkit-scrollbar { display: none; }

.c-subnav-label {
  flex: 0 0 auto;
  margin-right: 12px;
  padding-right: 16px;
  border-right: 1px solid var(--grey-light);
  font: 700 0.6875rem/1 var(--font-body);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--grey-mid);
}

.c-subnav a {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 100%;
  padding: 0 14px;
  white-space: nowrap;
  color: var(--blue-dark);
  font: 400 0.875rem/1 var(--font-body);
}

.c-subnav a span { color: var(--grey-mid); font-variant-numeric: tabular-nums; font-size: 0.75rem; }
.c-subnav a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 8px;
  right: 8px;
  height: 3px;
  background: var(--blue);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--t-mid) var(--ease);
}

.c-subnav a:hover { color: var(--blue); }
.c-subnav a.is-current { color: var(--blue); font-weight: 700; }
.c-subnav a.is-current span { color: var(--blue); }
.c-subnav a.is-current::after { transform: scaleX(1); }

/* ============================================================
   Cards
   ============================================================ */

.c-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 26px 26px 28px;
  border: 1px solid var(--grey-light);
  background: var(--white);
  color: var(--black);
  overflow: hidden;
  transition: border-color var(--t-fast) var(--ease), transform var(--t-mid) var(--ease),
    box-shadow var(--t-mid) var(--ease);
}

.c-card > * { position: relative; z-index: 1; }

.c-card h3 { margin-bottom: 10px; }
:where(.c-card) p { color: var(--grey-dark); font-size: 0.9375rem; line-height: 1.65; }
.c-card .u-index { margin-bottom: 18px; display: block; }
.c-card-foot { margin-top: auto; padding-top: 22px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.c-card-foot span { color: var(--blue); font: 700 0.875rem/1 var(--font-body); }
.c-card-foot .u-arrow,
.c-card-foot .u-ext { color: var(--blue); }

a.c-card::before {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 3px;
  background: var(--blue);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--t-mid) var(--ease);
}

a.c-card:hover { border-color: var(--blue); transform: translateY(-3px); box-shadow: var(--shadow-lift); }
a.c-card:hover::before { transform: scaleX(1); }
a.c-card:hover .u-arrow { transform: translateX(5px); }

.c-card--media { padding: 0; }
.c-card--media .c-card-media { position: relative; overflow: hidden; background: var(--blue-dark); }
.c-card--media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform var(--t-slow) var(--ease-out);
}
a.c-card--media:hover img { transform: scale(1.05); }
.c-card--media .c-card-body { display: flex; flex-direction: column; flex: 1; padding: 24px 26px 26px; }

.c-card-badge {
  position: absolute;
  top: 0;
  left: 0;
  padding: 8px 18px 8px 14px;
  background: var(--blue);
  color: var(--white);
  font: 700 0.75rem/1 var(--font-body);
  letter-spacing: 0.1em;
  clip-path: polygon(0 0, 100% 0, calc(100% - 10px) 100%, 0 100%);
}

.c-card--dark {
  background: var(--blue-dark);
  border-color: transparent;
  color: var(--white);
}

.c-card--dark h3,
.c-card--dark h4 { color: var(--white); }
:where(.c-card--dark) p { color: rgba(255, 255, 255, 0.76); }
.c-card--dark .t-kicker { color: var(--white); }
.c-card--dark .t-kicker::before { background: var(--orange); }

.c-card--flat { border: 0; border-top: 3px solid var(--grey-light); padding: 24px 0 0; background: none; }
.c-card--flat:hover { border-top-color: var(--blue); }

/* Lista numerada em linhas largas */
.c-rows { border-top: 1px solid var(--grey-light); }

.c-row {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 8px 24px;
  padding: 26px 0;
  border-bottom: 1px solid var(--grey-light);
  transition: background var(--t-fast) var(--ease);
}

.c-row-num {
  font: 300 1.25rem/1 var(--font-display);
  color: var(--blue);
  font-variant-numeric: tabular-nums;
  padding-top: 4px;
}

:where(.c-row-body) p { margin-top: 8px; color: var(--grey-dark); max-width: 62ch; }
.c-row--tight { padding: 18px 0; }

.is-dark .c-rows,
.is-dark .c-row { border-color: var(--line-light); }
.is-dark .c-row-num { color: var(--orange); }
.is-dark .c-row-body p { color: rgba(255, 255, 255, 0.76); }

/* Lista simples com marcador inclinado */
.c-marks { display: grid; gap: 14px; }

.c-marks li {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.c-marks li::before {
  content: "";
  width: 18px;
  height: 6px;
  margin-top: 0.7em;
  background: var(--blue);
  transform: skewX(calc(var(--slant) * -1));
}

.c-marks--orange li::before { background: var(--orange); }
.is-dark .c-marks li::before { background: var(--orange); }

/* ============================================================
   Figuras
   ============================================================ */

.c-media {
  position: relative;
  overflow: hidden;
  background: var(--blue-dark);
}

.c-media img { width: 100%; height: 100%; object-fit: cover; }
.c-media--4x3 img { aspect-ratio: 4 / 3; }
.c-media--16x9 img { aspect-ratio: 16 / 9; }
.c-media--3x4 img { aspect-ratio: 3 / 4; }
.c-media--1x1 img { aspect-ratio: 1 / 1; }

.c-media-tag {
  position: absolute;
  left: 0;
  bottom: 0;
  max-width: 88%;
  padding: 12px 26px 12px 18px;
  background: var(--white);
  color: var(--blue-dark);
  font: 700 0.8125rem/1.4 var(--font-body);
  clip-path: polygon(0 0, 100% 0, calc(100% - 14px) 100%, 0 100%);
}

.c-media-tag small { display: block; font: 400 0.75rem/1.4 var(--font-body); color: var(--grey-dark); }

.c-figure { margin: 0; }
.c-figure .c-media { border: 1px solid var(--grey-light); }
.c-figure figcaption {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
  font: 400 0.8125rem/1.5 var(--font-body);
  color: var(--grey-dark);
}

.c-figure-zoom {
  display: block;
  max-height: 72vh;
  overflow: auto;
  background: var(--white);
}

.c-figure-zoom img { min-width: 860px; }

/* Bloco de imagem com moldura deslocada */
.c-media-stack { position: relative; }
.c-media-stack::before {
  content: "";
  position: absolute;
  inset: auto -18px -18px auto;
  width: 62%;
  height: 58%;
  border: 1px solid var(--blue);
  z-index: 0;
}
.c-media-stack .c-media { position: relative; z-index: 1; }

/* ============================================================
   Métricas e estatísticas
   ============================================================ */

.c-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--line-light); }

.c-stat { padding: 34px 28px 36px; background: var(--blue-dark); }
:where(.c-stat) p { margin-top: 14px; max-width: 30ch; color: rgba(255, 255, 255, 0.82); font-size: 0.9375rem; line-height: 1.6; }
.c-stat .c-stat-num {
  margin-top: 0;
  font: 700 clamp(2rem, 3.6vw, 2.875rem)/1 var(--font-display);
  letter-spacing: -0.04em;
  color: var(--orange);
}

.c-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.c-fact { padding-top: 16px; border-top: 3px solid var(--orange); }
.c-fact dt { font: 700 0.6875rem/1 var(--font-body); letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255, 255, 255, 0.6); }
.c-fact dd { margin-top: 8px; font: 600 1.0625rem/1.35 var(--font-display); color: var(--white); }

/* ============================================================
   Status de ciclo de vida
   ============================================================ */

[data-tone="novo"] {
    --tone: #CE803F;
    --tone-ink: #FFFFFF;
}

[data-tone="ativo"] {
    --tone: #47AF64;
    --tone-ink: #FFFFFF;
}

[data-tone="classico"] {
    --tone: #004DA0;
    --tone-ink: #FFFFFF;
}

[data-tone="limitado"] {
    --tone: #80A6CF;
    --tone-ink: #FFFFFF;
}

[data-tone="reparo"] {
    --tone: #666666;
    --tone-ink: #FFFFFF;
}

[data-tone="fim"] {
    --tone: #D9D9D9;
    --tone-ink: #FFFFFF;
}

.c-phase-rail { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 2px; margin-bottom: 28px; }
.c-phase-rail span { height: 10px; background: var(--tone); }

.c-lifecycle { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 24px; }

.c-phase { padding-top: 18px; border-top: 4px solid var(--tone); }
:where(.c-phase) p { margin-top: 12px; color: var(--grey-dark); font-size: 0.9375rem; line-height: 1.65; }
.c-phase .c-status { margin-top: 0; }
.is-dark :where(.c-phase) p { color: rgba(255, 255, 255, 0.76); }

.c-status {
  display: inline-flex;
  align-items: center;
  padding: 5px 14px 5px 10px;
  background: var(--tone);
  color: var(--tone-ink);
  font: 700 0.6875rem/1.2 var(--font-body);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  clip-path: polygon(0 0, 100% 0, calc(100% - 7px) 100%, 0 100%);
}

.c-phase[data-tone="fim"] .c-status { outline: 1px solid var(--grey-light); }

/* ============================================================
   Aviso
   ============================================================ */

.c-notice {
  display: grid;
  gap: 12px;
  padding: 26px 30px;
  border: 1px solid var(--grey-light);
  border-left: 5px solid var(--orange);
  background: var(--white);
}

.c-notice h3 { max-width: 46ch; }
:where(.c-notice) p { color: var(--grey-dark); max-width: 66ch; }

/* ============================================================
   Tabelas
   ============================================================ */

.c-table-wrap { border: 1px solid var(--grey-light); }
.c-table-scroll { overflow-x: auto; }

.c-table th {
  padding: 16px 20px;
  background: var(--blue-dark);
  color: var(--white);
  font: 700 0.8125rem/1.3 var(--font-body);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: left;
  white-space: nowrap;
}

.c-table td {
  padding: 16px 20px;
  border-bottom: 1px solid var(--grey-light);
  vertical-align: top;
  font-size: 0.9375rem;
  line-height: 1.6;
}

.c-table tbody tr:last-child td { border-bottom: 0; }
.c-table tbody tr { transition: background var(--t-fast) var(--ease); }
.c-table tbody tr:hover { background: var(--tint-blue); }
.c-table a { color: var(--blue); font-weight: 700; display: inline-flex; align-items: center; gap: 8px; }
.c-table a:hover { text-decoration: underline; text-underline-offset: 3px; }

.c-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.c-chip {
  display: inline-flex;
  padding: 4px 10px;
  border: 1px solid var(--grey-light);
  font: 400 0.75rem/1.4 var(--font-body);
  color: var(--blue-dark);
  white-space: nowrap;
}

/* De → para */
.c-swap { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--grey-light); }

.c-swap-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 20px 22px;
  background: var(--white);
}

.c-swap-from { font: 400 0.9375rem/1.4 var(--font-body); color: var(--grey-dark); }
.c-swap-to { font: 700 1.0625rem/1.3 var(--font-display); color: var(--blue-dark); }
.c-swap-item svg { width: 20px; height: 20px; color: var(--blue); }

/* ============================================================
   Formulários
   ============================================================ */

.c-form-shell {
  border: 1px solid var(--grey-light);
  background: var(--white);
}

.c-form-head {
  display: grid;
  gap: 10px;
  padding: 28px 32px;
  background: var(--blue-dark);
  color: var(--white);
}

.c-form-head h2,
.c-form-head h3 { color: var(--white); }
:where(.c-form-head) p { color: rgba(255, 255, 255, 0.78); font-size: 0.9375rem; max-width: 58ch; }

.c-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 24px; padding: 32px; }
.c-form-span { grid-column: 1 / -1; }

.c-fieldset-title {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 8px;
  font: 700 0.6875rem/1 var(--font-body);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--grey-dark);
}

.c-fieldset-title::after { content: ""; flex: 1; height: 1px; background: var(--grey-light); }

.c-field { display: grid; gap: 8px; align-content: start; }
.c-field > label,
.c-field > span,
.c-field > legend { font: 700 0.8125rem/1.4 var(--font-body); color: var(--blue-dark); }
.c-req { color: var(--orange); }

.c-field input[type="text"],
.c-field input[type="email"],
.c-field input[type="tel"],
.c-field input[type="number"],
.c-field input[type="file"],
.c-field select,
.c-field textarea {
  width: 100%;
  min-height: 48px;
  padding: 11px 14px;
  border: 1px solid var(--grey-mid);
  border-radius: 0;
  background: var(--white);
  color: var(--black);
  font: 400 1rem/1.5 var(--font-body);
  transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}

.c-field textarea { min-height: 128px; resize: vertical; }

.c-field input:focus,
.c-field select:focus,
.c-field textarea:focus {
  outline: 0;
  border-color: var(--blue);
  box-shadow: inset 0 0 0 1px var(--blue);
}

.c-field input[type="file"] { padding: 10px 12px; cursor: pointer; }
.c-field input[type="file"]::file-selector-button {
  margin-right: 14px;
  padding: 8px 14px;
  border: 1px solid var(--blue);
  background: var(--white);
  color: var(--blue);
  font: 700 0.8125rem/1 var(--font-body);
  cursor: pointer;
}

.c-field.is-invalid input,
.c-field.is-invalid select,
.c-field.is-invalid textarea { border-left: 4px solid var(--orange); }

.c-error,
.c-hint { font: 400 0.8125rem/1.5 var(--font-body); }
.c-error { color: var(--blue-dark); font-weight: 700; }
.c-hint { color: var(--grey-dark); }

.c-check,
.c-choice {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  font: 400 0.9375rem/1.55 var(--font-body);
  color: var(--black);
  cursor: pointer;
}

.c-check input,
.c-choice input {
  width: 20px;
  height: 20px;
  min-height: 20px;
  margin: 3px 0 0;
  accent-color: var(--blue);
  cursor: pointer;
}

.c-field > label.c-check,
.c-field > label.c-choice { font: 400 0.9375rem/1.55 var(--font-body); }

.c-choices { display: grid; gap: 12px; }
.c-choices--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 24px; }
.c-choices--box { gap: 8px; }
.c-choices--box .c-choice { padding: 12px 14px; border: 1px solid var(--grey-light); transition: border-color var(--t-fast) var(--ease); }
.c-choices--box .c-choice:hover { border-color: var(--blue); }

.c-form-legal { color: var(--grey-dark); font-size: 0.8125rem; line-height: 1.6; }
.c-form-legal a { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
.c-form-error { grid-column: 1 / -1; padding: 14px 16px; border-left: 4px solid var(--orange); background: var(--tint-blue); font-weight: 700; }
.c-form-foot { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ============================================================
   Pager (navegação entre páginas)
   ============================================================ */

.c-pager { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--grey-light); border-block: 1px solid var(--grey-light); }

.c-pager a {
  display: grid;
  gap: 8px;
  padding: 30px 32px;
  background: var(--white);
  transition: background var(--t-fast) var(--ease);
}

.c-pager a:hover { background: var(--tint-blue); }
.c-pager a:hover h3 { color: var(--blue); }
.c-pager small { font: 700 0.6875rem/1 var(--font-body); letter-spacing: 0.14em; text-transform: uppercase; color: var(--grey-dark); }
.c-pager .c-pager-next { text-align: right; }
.c-pager h3 { display: inline-flex; align-items: center; gap: 12px; }

/* ============================================================
   Faixa final
   ============================================================ */

.c-cta {
  position: relative;
  background: var(--blue-dark);
  color: var(--white);
  overflow: hidden;
}

.c-cta-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.55;
}

.c-cta-inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: clamp(28px, 4vw, 64px);
  padding-block: clamp(56px, 7vw, 88px);
}

.c-cta h2 { color: var(--white); max-width: 22ch; }
.c-cta-meta { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 20px; color: rgba(255, 255, 255, 0.82); font-size: 0.9375rem; }
.c-cta-meta a { color: var(--white); border-bottom: 1px solid var(--line-light-2); }
.c-cta-meta a:hover { border-bottom-color: var(--white); }

/* ============================================================
   Rodapé
   ============================================================ */

.c-footer { background: var(--blue-dark); color: var(--white); }

.c-footer-claim {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 24px;
  padding-block: 40px;
  border-bottom: 1px solid var(--line-light);
}

.c-footer-claim img { height: 38px; width: auto; }
.c-footer-claim p {
  font: 700 clamp(1.5rem, 3vw, 2.25rem)/1.05 var(--font-display);
  letter-spacing: -0.03em;
  color: var(--white);
}
.c-footer-claim span { color: var(--orange); }

.c-footer-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.25fr);
  gap: clamp(28px, 4vw, 56px);
  padding-block: 48px 40px;
}

.c-footer-title {
  margin-bottom: 18px;
  font: 700 0.6875rem/1 var(--font-body);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
}

.c-footer li + li { margin-top: 12px; }
.c-footer a { color: var(--white); font-size: 0.9375rem; }
.c-footer a:hover { text-decoration: underline; text-underline-offset: 4px; }
.c-footer-links a { display: inline-flex; align-items: center; gap: 8px; }

.c-footer address { font-style: normal; font-size: 0.9375rem; line-height: 1.7; color: rgba(255, 255, 255, 0.82); }
.c-footer-contact { display: grid; gap: 8px; margin-top: 18px; }
.c-footer-contact a { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; }
.c-footer-contact svg { width: 15px; height: 15px; color: var(--orange); }

.c-footer-base {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px 32px;
  padding-block: 24px 32px;
  border-top: 1px solid var(--line-light);
  font-size: 0.8125rem;
  color: rgba(255, 255, 255, 0.62);
}

.c-social { display: flex; align-items: center; gap: 10px; }
.c-social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--line-light);
  transition: border-color var(--t-fast) var(--ease), background var(--t-fast) var(--ease);
}
.c-social a:hover { border-color: var(--white); background: rgba(255, 255, 255, 0.08); }
.c-social svg { width: 18px; height: 18px; }

/* ============================================================
   Responsivo
   ============================================================ */

@media (max-width: 1119px) {
  .c-nav-btn,
  .c-nav-portal { padding: 0 12px; font-size: 0.875rem; }
  .c-logo-tag { display: none; }
}

@media (max-width: 1023px) {
  .c-util { display: none; }
  .c-nav { display: none; }
  .c-header .c-lang { display: none; }
  .c-burger { display: inline-flex; }
  .c-slot-header { min-height: var(--header-h); }
  .c-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .c-lifecycle { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .c-swap { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .c-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .c-cta-inner { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .c-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
  .c-drawer,
  .c-backdrop,
  .c-burger { display: none !important; }
}

@media (max-width: 767px) {
  .c-header .c-btn { padding: 12px 14px; }
  .c-header .c-btn .c-btn-label { display: none; }
  .c-stats,
  .c-lifecycle,
  .c-swap,
  .c-facts,
  .c-footer-grid,
  .c-pager { grid-template-columns: minmax(0, 1fr); }
  .c-form { grid-template-columns: minmax(0, 1fr); padding: 24px 20px; }
  .c-form-head { padding: 24px 20px; }
  .c-choices--2 { grid-template-columns: minmax(0, 1fr); }
  .c-footer-claim { grid-template-columns: minmax(0, 1fr); }
  .c-pager .c-pager-next { text-align: left; }
  .c-row { grid-template-columns: 48px minmax(0, 1fr); gap: 4px 16px; }
  .c-media-stack::before { display: none; }
  .c-table-pairs thead { display: none; }
  .c-table-pairs tr { display: block; padding: 16px 20px; border-bottom: 1px solid var(--grey-light); }
  .c-table-pairs td { display: block; padding: 0; border: 0; }
}

@media (max-width: 400px) {
  .c-header .c-btn { display: none; }
}


/* ============================================================
   RD Station Button
   ============================================================ */

.rd-button{
    position: relative !important;
    isolation: isolate !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    min-height:52px !important;
    padding:14px 26px !important;

    border:none !important;
    border-radius:0 !important;

    background:var(--orange) !important;
    color:var(--blue-dark) !important;

    font:600 1rem/1 var(--font-display) !important;

    cursor:pointer !important;
    overflow:hidden !important;

    transition:
        background var(--t-fast) var(--ease),
        color var(--t-fast) var(--ease) !important;
}

.rd-button::after{
    content:"";
    position:absolute;
    z-index:-1;

    inset:0 auto 0 -10%;
    width:0;

    background:var(--blue-dark);

    transform:skewX(calc(var(--slant) * -1));

    transition:
        width var(--t-mid) var(--ease);
}

.rd-button:hover{
    color:var(--white) !important;
}

.rd-button:hover::after{
    width:125%;
}

.ncm-details{
    margin-top:12px;
}

.ncm-details summary{
    cursor:pointer;
    font-weight:600;
    color:var(--blue);
    text-decoration:underline;
    margin-bottom:12px;
}

.ncm-table{
    width:100%;
    border-collapse:collapse;
    margin-top:10px;
    font-size:14px;
}

.ncm-table th,
.ncm-table td{
    border:1px solid #d9d9d9;
    padding:8px;
    text-align:left;
}

.ncm-table th{
    background:#f5f5f5;
    font-weight:600;
}

.ncm-details small{
    display:block;
    margin-top:12px;
    color:#666;
}

/* ===== Parceiros ===== */
.p-partner-card { display: flex; flex-direction: column; height: 100%; }
.p-partner-card .c-chips { margin-top: var(--space-3, 12px); }

.p-partner-country { margin: 0 0 6px; font-size: .875rem; font-weight: 600; }
.p-partner-cat { margin: 4px 0 0; font-size: .875rem; opacity: .75; }
.p-partner-phone { margin: var(--space-4, 16px) 0 0; font-size: .875rem; }

.p-partner-units { list-style: none; margin: var(--space-4, 16px) 0 0; padding: 0; }
.p-partner-units li { display: flex; flex-direction: column; gap: 2px; padding: 12px 0; border-top: 1px solid rgba(0,0,0,.08); font-size: .875rem; line-height: 1.45; overflow-wrap: anywhere; }
.p-partner-units li:first-child { border-top: 0; padding-top: 0; }
.p-partner-units--compact li { padding: 8px 0; }
.p-partner-city { font-size: 1rem; font-weight: 600; }
.p-partner-note { margin-left: 6px; font-size: .75rem; font-weight: 600; opacity: .7; }

.p-partner-card .p-partner-actions { margin-top: auto; padding-top: var(--space-5, 20px); display: flex; flex-wrap: wrap; gap: 26px; }
.p-partner-actions .c-btn { flex: 1 1 0; min-width: 0; }


@media (max-width: 480px) {
  .p-partner-actions .c-btn { flex: 1 1 100%; justify-content: center; }}

/* Seta do botão "Site" acompanha a cor do texto: azul em repouso, branca no hover */
.p-partner-actions .c-btn .u-arrow { color: currentColor; }

/* Botão "Contato": inverso do "Site" (fundo azul, texto branco; no hover, fundo branco e texto azul) */
.p-partner-actions .c-btn--primary { background: var(--blue); border-color: var(--blue); color: var(--white); }
.p-partner-actions .c-btn--primary::after { background: var(--white); }
.p-partner-actions .c-btn--primary:hover,
.p-partner-actions .c-btn--primary:focus-visible { color: var(--blue); border-color: var(--blue); }
.p-partner-actions .c-btn--primary:focus-visible::after { width: 125%; }

/* Mapa de parceiros */
.p-partner-map { position: relative; width: 100%; aspect-ratio: 16 / 9; border: 1px solid var(--grey-light); background: var(--white); overflow: hidden; }
.p-partner-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
@media (max-width: 767px) {
.p-partner-map { aspect-ratio: 3 / 4; }
}


/* ============================================================
   Popover - Código Lenze do produto
   ============================================================ */

.c-help-link{
    background:none;
    border:0;
    padding:0;
    font:inherit;
    cursor:pointer;
}

/* Fechado: sempre escondido */
.c-popover:not(:popover-open){
    display:none;
}

/* Aberto: janela centralizada */
.c-popover:popover-open{
    display:block;
    position:fixed;
    inset:0;
    margin:auto;
    width:min(760px, 94vw);
    height:fit-content;
    max-height:88vh;
    overflow-y:auto;
    padding:32px;
    border:0;
    background:var(--white);
    color:var(--blue-dark);
    box-shadow:0 20px 60px rgba(0,32,62,.25);
}

.c-popover::backdrop{
    background:rgba(0,32,62,.55);
}

.c-popover-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
}

.c-popover-close{
    background:none;
    border:0;
    font-size:1.8rem;
    line-height:1;
    cursor:pointer;
    color:var(--blue-dark);
}

.c-popover-nav{
    list-style:none;
    margin:12px 0 0;
    padding:0;
    display:grid;
    gap:8px;
}

.c-popover-block{
    margin-top:28px;
    padding-top:28px;
    border-top:1px solid #e6e6e6;
}

.c-popover-block h4{
    margin:0 0 8px;
}

.c-popover-gallery{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:8px;
    margin-top:16px;
}

.c-popover-gallery img{
    width:100%;
    height:180px;
    object-fit:cover;
    display:block;
}

.c-popover-split{
    display:grid;
    grid-template-columns:1fr 200px;
    gap:24px;
    align-items:center;
}

.c-popover-split img{
    width:100%;
    height:auto;
    display:block;
}

@media (max-width:640px){
    .c-popover:popover-open{ padding:22px; }
    .c-popover-gallery{ grid-template-columns:1fr; }
    .c-popover-gallery img{ height:auto; }
    .c-popover-split{ grid-template-columns:1fr; }
}

.c-help-chip{
    display: flex;
    width: 100%;
    box-sizing: border-box;
    align-items:center;
    gap:12px;
    padding:10px 18px 10px 10px;
    border:1px solid rgba(50,95,236,.25);
    background:rgba(50,95,236,.08);
    color:var(--blue-dark);
    font:inherit;
    text-align:left;
    cursor:pointer;
    transition:background .2s, border-color .2s;
}

.c-help-chip:hover{
    background:rgba(50,95,236,.16);
    border-color:var(--blue);
}

.c-help-chip-icon{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    width:32px;
    height:32px;
    border-radius:50%;
    background:var(--orange);
    color:var(--white);
    font-weight:700;
    font-size:1.1rem;
}

.c-help-chip strong{
    display:block;
    line-height:1.3;
}

.c-help-chip small{
    display:block;
    font-size:.82rem;
    opacity:.75;
}


/* Link de ajuda dentro do formulário RD */
.c-help-inline {
display: block !important;
width: auto !important;
margin: 0 0 4px !important;
padding: 0 !important;
border: 0 !important;
background: none !important;
color: #325FEC !important;
font-family: "Noto Sans", sans-serif !important;
font-size: 0.8rem !important;
font-weight: 600 !important;
line-height: 1.4 !important;
text-align: left !important;
text-decoration: underline !important;
text-underline-offset: 3px;
cursor: pointer;
}
 
.c-help-inline:hover {
color: #00203E !important;
}

/* Bandeira no canto superior direito do card de parceiro */
.p-partner-card {
    position: relative;
}

.p-partner-flag {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 32px;
    height: auto;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .12);
}

/* Evita que o nome do parceiro passe por baixo da bandeira */
.p-partner-card h3,
.p-partner-card .p-partner-country {
    padding-right: 48px;
}

/* Bandeiras sem borda */
img[src*="/assets/flags/"] {
border: 0 !important;
outline: 0 !important;
box-shadow: none !important;
background: none !important;
padding: 0 !important;
border-radius: 0 !important;
width: 40px;
height: auto !important;
}

/* Imagem com 60% da altura do formato 16:9 */
.c-media.c-media--short {
    aspect-ratio: 16 / 5.4 !important;
    height: auto !important;
    padding-top: 0 !important;
}

.c-media.c-media--short img {
    width: 100%;
    height: 100% !important;
    object-fit: cover;
    object-position: center 30%;
}