/* ============================================================
   P Consórcios — Static CSS
   Replica all design tokens, layouts and components from the
   React/Tailwind source without any build tool dependency.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Rajdhani:wght@300;400;500;600;700&display=swap');

/* ── Design Tokens ─────────────────────────────────────────── */
:root {
  /* Base */
  --background:              hsl(0, 0%, 100%);
  --foreground:              hsl(0, 0%, 10%);
  --card:                    hsl(0, 0%, 100%);
  --card-foreground:         hsl(0, 0%, 10%);
  --popover:                 hsl(0, 0%, 100%);
  --popover-foreground:      hsl(0, 0%, 10%);

  /* Brand */
  --primary:                 hsl(214, 100%, 34%);
  --primary-foreground:      hsl(0, 0%, 95%);
  --secondary:               hsl(0, 0%, 95%);
  --secondary-foreground:    hsl(214, 100%, 34%);
  --muted:                   hsl(0, 0%, 96%);
  --muted-foreground:        hsl(0, 0%, 40%);
  --accent:                  hsl(214, 100%, 34%);
  --accent-foreground:       hsl(0, 0%, 95%);
  --destructive:             hsl(0, 84.2%, 60.2%);
  --destructive-foreground:  hsl(0, 0%, 95%);
  --border:                  hsl(0, 0%, 90%);
  --input:                   hsl(0, 0%, 90%);
  --ring:                    hsl(214, 100%, 34%);
  --radius:                  0.75rem;

  /* Custom palette */
  --p-blue:       hsl(214, 100%, 34%);
  --p-light:      hsl(0, 0%, 95%);
  --p-dark:       hsl(0, 0%, 10%);
  --p-gray:       hsl(0, 0%, 40%);
  --p-gray-light: hsl(0, 0%, 96%);
  --p-turquoise:  hsl(170, 100%, 42%);
  --p-green:      hsl(142, 76%, 45%);
  --p-yellow:     hsl(45, 100%, 51%);
  --p-purple:     hsl(266, 100%, 34%);
  --p-pink:       hsl(330, 100%, 71%);
  --p-orange:     hsl(27, 100%, 50%);
  --p-red:        hsl(0, 100%, 50%);

  /* Gradients */
  --gradient-blue-turquoise: linear-gradient(135deg, hsl(214,100%,34%), hsl(170,100%,42%));
  --gradient-purple-pink:    linear-gradient(135deg, hsl(266,100%,34%), hsl(330,100%,71%));
  --gradient-orange-red:     linear-gradient(135deg, hsl(27,100%,50%),  hsl(0,100%,50%));
  --gradient-green-yellow:   linear-gradient(135deg, hsl(142,76%,45%),  hsl(45,100%,51%));
  --gradient-hero:           linear-gradient(135deg, hsl(214,100%,34%), hsl(266,100%,34%));

  /* Effects */
  --shadow-glow: 0 10px 40px -10px hsla(214,100%,34%,0.3);
  --shadow-card: 0 4px 20px rgba(0,0,0,0.08);
  --transition-smooth: all 0.3s cubic-bezier(0.4,0,0.2,1);
}

/* ── Reset ─────────────────────────────────────────────────── */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0 solid var(--border);
}
html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  background: var(--background);
  color: var(--foreground);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; font-family: inherit; }
ul, ol { list-style: none; }

/* ── Layout Helpers ─────────────────────────────────────────── */
.container {
  width: 100%;
  max-width: 1400px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
}
.max-w-4xl  { max-width: 56rem; }
.max-w-5xl  { max-width: 64rem; }
.max-w-6xl  { max-width: 72rem; }
.max-w-7xl  { max-width: 80rem; }
.mx-auto    { margin-left: auto; margin-right: auto; }

.flex        { display: flex; }
.flex-col    { flex-direction: column; }
.flex-1      { flex: 1 1 0%; }
.flex-shrink-0 { flex-shrink: 0; }
.items-center  { align-items: center; }
.items-start   { align-items: flex-start; }
.justify-center  { justify-content: center; }
.justify-between { justify-content: space-between; }
.flex-wrap   { flex-wrap: wrap; }
.gap-1   { gap: 0.25rem; }
.gap-2   { gap: 0.5rem; }
.gap-3   { gap: 0.75rem; }
.gap-4   { gap: 1rem; }
.gap-6   { gap: 1.5rem; }
.gap-8   { gap: 2rem; }

.grid  { display: grid; }
.grid-cols-1 { grid-template-columns: repeat(1,1fr); }
.grid-cols-2 { grid-template-columns: repeat(2,1fr); }

/* ── Spacing ────────────────────────────────────────────────── */
.p-6  { padding: 1.5rem; }
.p-8  { padding: 2rem; }
.px-4 { padding-left: 1rem;  padding-right: 1rem; }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.py-2 { padding-top: 0.5rem;  padding-bottom: 0.5rem; }
.py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.py-4 { padding-top: 1rem;    padding-bottom: 1rem; }
.pt-8 { padding-top: 2rem; }
.pb-0 { padding-bottom: 0; }
.mb-2  { margin-bottom: 0.5rem; }
.mb-4  { margin-bottom: 1rem; }
.mb-6  { margin-bottom: 1.5rem; }
.mb-8  { margin-bottom: 2rem; }
.mb-12 { margin-bottom: 3rem; }
.mb-16 { margin-bottom: 4rem; }
.ml-2  { margin-left: 0.5rem; }
.mr-2  { margin-right: 0.5rem; }
.mt-1  { margin-top: 0.25rem; }
.space-y-2 > * + * { margin-top: 0.5rem; }
.space-y-3 > * + * { margin-top: 0.75rem; }
.space-y-4 > * + * { margin-top: 1rem; }
.space-y-5 > * + * { margin-top: 1.25rem; }
.space-y-6 > * + * { margin-top: 1.5rem; }

/* ── Typography ─────────────────────────────────────────────── */
.text-xs   { font-size: 0.75rem;  line-height: 1rem; }
.text-sm   { font-size: 0.875rem; line-height: 1.25rem; }
.text-base { font-size: 1rem;     line-height: 1.5rem; }
.text-lg   { font-size: 1.125rem; line-height: 1.75rem; }
.text-xl   { font-size: 1.25rem;  line-height: 1.75rem; }
.text-2xl  { font-size: 1.5rem;   line-height: 2rem; }
.text-3xl  { font-size: 1.875rem; line-height: 2.25rem; }
.text-4xl  { font-size: 2.25rem;  line-height: 2.5rem; }
.text-5xl  { font-size: 3rem;     line-height: 1; }
.font-medium   { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold     { font-weight: 700; }
.font-normal   { font-weight: 400; }
.italic        { font-style: italic; }
.leading-tight { line-height: 1.25; }
.text-center   { text-align: center; }
.text-left     { text-align: left; }
.break-all     { word-break: break-all; }
.opacity-70    { opacity: 0.7; }
.opacity-80    { opacity: 0.8; }
.opacity-90    { opacity: 0.9; }

/* ── Colors ─────────────────────────────────────────────────── */
.text-foreground         { color: var(--foreground); }
.text-primary            { color: var(--primary); }
.text-primary-foreground { color: var(--primary-foreground); }
.text-muted-foreground   { color: var(--muted-foreground); }
.text-white              { color: #fff; }
.text-p-yellow           { color: var(--p-yellow); }

.bg-background    { background-color: var(--background); }
.bg-primary       { background-color: var(--primary); }
.bg-p-gray-light  { background-color: var(--p-gray-light); }
.bg-p-yellow      { background-color: var(--p-yellow); }
.bg-p-green       { background-color: var(--p-green); }
.bg-p-turquoise   { background-color: var(--p-turquoise); }
.bg-p-pink        { background-color: var(--p-pink); }
.bg-secondary     { background-color: var(--secondary); }

.bg-gradient-hero           { background-image: var(--gradient-hero); }
.bg-gradient-blue-turquoise { background-image: var(--gradient-blue-turquoise); }
.bg-gradient-purple-pink    { background-image: var(--gradient-purple-pink); }
.bg-gradient-orange-red     { background-image: var(--gradient-orange-red); }
.bg-gradient-green-yellow   { background-image: var(--gradient-green-yellow); }
.bg-overlay-blue    { background: linear-gradient(to right, hsla(214,100%,34%,0.9), hsla(214,100%,34%,0.8), hsla(170,100%,42%,0.7)); }

/* ── Borders & Radius ────────────────────────────────────────── */
.rounded-full { border-radius: 9999px; }
.rounded-lg   { border-radius: var(--radius); }
.rounded-2xl  { border-radius: 1rem; }
.rounded-3xl  { border-radius: 1.5rem; }
.border   { border-width: 1px; border-color: var(--border); }
.border-2 { border-width: 2px; border-color: var(--border); }
.border-t { border-top-width: 1px; border-color: var(--border); }
.border-none { border: none; }
.border-primary-foreground-20 { border-color: hsla(0,0%,95%,0.2); }

/* ── Effects ─────────────────────────────────────────────────── */
.shadow-glow { box-shadow: var(--shadow-glow); }
.shadow-card { box-shadow: var(--shadow-card); }
.shadow-2xl  { box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25); }
.shadow-primary-20 { box-shadow: 0 25px 50px -12px hsla(214,100%,34%,0.2); }

.overflow-hidden   { overflow: hidden; }
.relative          { position: relative; }
.absolute          { position: absolute; }
.fixed             { position: fixed; }
.sticky            { position: sticky; }
.inset-0           { top:0; right:0; bottom:0; left:0; }
.z-10              { z-index: 10; }
.z-50              { z-index: 50; }
.top-0             { top: 0; }
.bottom-0          { bottom: 0; }
.left-0            { left: 0; }
.right-0           { right: 0; }
.bottom-6          { bottom: 1.5rem; }
.right-6           { right: 1.5rem; }
.top-4             { top: 1rem; }
.right-4           { right: 1rem; }
.top-8             { top: 2rem; }
.top-20            { top: 5rem; }
.left-10           { left: 2.5rem; }
.bottom-10         { bottom: 2.5rem; }
.left-20           { left: 5rem; }
.h-0-5             { height: 0.125rem; }
.top-1-2           { top: 50%; }

.transition-all      { transition: all 0.3s cubic-bezier(0.4,0,0.2,1); }
.transition-opacity  { transition: opacity 0.3s; }
.transition-colors   { transition: color 0.2s, background-color 0.2s; }
.transition-transform { transition: transform 0.3s cubic-bezier(0.4,0,0.2,1); }
.duration-300 { transition-duration: 300ms; }
.duration-500 { transition-duration: 500ms; }

.w-full { width: 100%; }
.h-full { height: 100%; }
.w-4   { width: 1rem; }    .h-4  { height: 1rem; }
.w-5   { width: 1.25rem; } .h-5  { height: 1.25rem; }
.w-6   { width: 1.5rem; }  .h-6  { height: 1.5rem; }
.w-8   { width: 2rem; }    .h-8  { height: 2rem; }
.w-12  { width: 3rem; }    .h-12 { height: 3rem; }
.w-16  { width: 4rem; }    .h-16 { height: 4rem; }
.w-20  { width: 5rem; }    .h-20 { height: 5rem; }
.w-24  { width: 6rem; }    .h-24 { height: 6rem; }
.w-32  { width: 8rem; }    .h-32 { height: 8rem; }
.h-48  { height: 12rem; }
.h-screen { height: 100vh; }
.min-h-screen { min-height: 100vh; }
.aspect-3-4 { aspect-ratio: 3/4; }

.blur-3xl   { filter: blur(64px); }
.backdrop-blur-sm { backdrop-filter: blur(4px); }
.mix-blend-overlay { mix-blend-mode: overlay; }
.object-cover  { object-fit: cover; }
.object-contain { object-fit: contain; }
.bg-cover  { background-size: cover; }
.bg-center { background-position: center; }

/* ── Animations ─────────────────────────────────────────────── */
@keyframes fade-in {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.5; }
}
.animate-fade-in { animation: fade-in 0.6s ease-out both; }
.animate-pulse   { animation: pulse 2s cubic-bezier(0.4,0,0.6,1) infinite; }
.fade-in-ready   { opacity: 0; transform: translateY(12px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
.fade-in-ready.visible { opacity: 1; transform: translateY(0); }

/* ── Hover states ────────────────────────────────────────────── */
.hover-scale:hover    { transform: scale(1.05); }
.hover-scale-110:hover { transform: scale(1.1); }
.group:hover .group-hover-scale { transform: scale(1.1); }
.group:hover .group-hover-opacity { opacity: 1; }

/* ============================================================
   NAVBAR
   ============================================================ */
.navbar {
  position: sticky;
  top: 0;
  z-index: 50;
  background-color: var(--primary);
  border-bottom: 1px solid var(--primary);
}
.navbar-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 5rem;
}
.navbar-logo { height: 3rem; }

/* ============================================================
   HERO SECTION
   ============================================================ */
.hero-section {
  position: relative;
  padding: 4rem 0;
  background-image: var(--gradient-hero);
  overflow: hidden;
}
.hero-grid {
  display: grid;
  gap: 2rem;
  align-items: start;
  max-width: 80rem;
  margin: 0 auto;
}
.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: hsla(0,0%,100%,0.1);
  backdrop-filter: blur(4px);
  border-radius: 9999px;
  color: var(--primary-foreground);
  font-size: 0.875rem;
  font-weight: 500;
}
.hero-title {
  font-size: clamp(1.875rem, 5vw, 3.75rem);
  font-weight: 700;
  color: var(--primary-foreground);
  line-height: 1.2;
}
.hero-subtitle {
  font-size: 1.125rem;
  color: hsla(0,0%,95%,0.9);
}
.hero-tagline {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--p-yellow);
}
.hero-benefits {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  padding-top: 1rem;
}
.hero-benefit-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--primary-foreground);
  font-size: 0.875rem;
}
.hero-check {
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
  color: var(--p-yellow);
}
.hero-decor {
  position: absolute;
  border-radius: 9999px;
  filter: blur(64px);
}

/* ============================================================
   SIMULATION FORM CARD
   ============================================================ */
.sim-card {
  background: var(--background);
  border-radius: 1.5rem;
  padding: 1.5rem;
  box-shadow: 0 25px 50px -12px hsla(214,100%,34%,0.2);
  border: 2px solid hsla(214,100%,34%,0.1);
}
.sim-card-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--foreground);
  margin-bottom: 0.5rem;
}
.sim-card-sub {
  color: var(--muted-foreground);
  font-size: 0.875rem;
}
.form-group { margin-bottom: 1.25rem; }
.form-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--foreground);
  margin-bottom: 0.5rem;
}
.input-wrap { position: relative; }
.input-icon {
  position: absolute;
  left: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1rem;
  height: 1rem;
  color: var(--muted-foreground);
  pointer-events: none;
}
.form-input,
.form-select {
  width: 100%;
  padding: 0.5rem 0.75rem 0.5rem 2.25rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--background);
  color: var(--foreground);
  font-size: 0.875rem;
  font-family: inherit;
  line-height: 1.5;
  outline: none;
  transition: border-color 0.2s;
}
.form-select { padding-left: 0.75rem; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23666' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.75rem center; background-size: 1rem; padding-right: 2.5rem; }
.form-input:focus, .form-select:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 2px hsla(214,100%,34%,0.1);
}
.form-input.error, .form-select.error { border-color: var(--destructive); }
.form-input.valid { border-color: var(--p-green); }
.form-error {
  font-size: 0.75rem;
  color: var(--destructive);
  margin-top: 0.25rem;
  display: none;
}
.form-error.show { display: block; }

/* Toggle Carta/Parcela */
.toggle-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.toggle-btn {
  padding: 0.75rem 1rem;
  border-radius: var(--radius);
  font-weight: 500;
  transition: all 0.2s;
  font-size: 0.875rem;
  border: none;
  background: var(--secondary);
  color: var(--secondary-foreground);
}
.toggle-btn.active {
  background: var(--primary);
  color: var(--primary-foreground);
  box-shadow: var(--shadow-glow);
}

/* Slider */
.slider-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem; }
.slider-value  { color: var(--primary); font-weight: 700; font-size: 1.125rem; }
.slider-limits { display: flex; justify-content: space-between; font-size: 0.75rem; color: var(--muted-foreground); margin-top: 0.5rem; }
.form-range {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 0.375rem;
  border-radius: 9999px;
  background: var(--secondary);
  outline: none;
  cursor: pointer;
  margin: 1rem 0;
}
.form-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 9999px;
  background: var(--primary);
  box-shadow: var(--shadow-glow);
  cursor: pointer;
  border: 2px solid white;
}
.form-range::-moz-range-thumb {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 9999px;
  background: var(--primary);
  box-shadow: var(--shadow-glow);
  cursor: pointer;
  border: 2px solid white;
}
.form-range::-webkit-slider-runnable-track { border-radius: 9999px; }

/* Submit btn */
.btn-submit {
  width: 100%;
  padding: 0.875rem 1.5rem;
  background: var(--primary);
  color: var(--primary-foreground);
  border: none;
  border-radius: var(--radius);
  font-size: 1rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  box-shadow: var(--shadow-glow);
  transition: all 0.2s;
}
.btn-submit:hover { background: hsl(214,100%,28%); transform: scale(1.01); }
.form-secure {
  text-align: center;
  font-size: 0.75rem;
  color: var(--muted-foreground);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  margin-top: 0.75rem;
}

/* ============================================================
   COMO FUNCIONA
   ============================================================ */
.section-como-funciona {
  padding: 5rem 0;
  background: var(--background);
}
.steps-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  max-width: 72rem;
  margin: 0 auto;
  position: relative;
}
.step-item { text-align: center; }
.step-circle {
  width: 4rem;
  height: 4rem;
  border-radius: 9999px;
  background-image: var(--gradient-blue-turquoise);
  color: var(--primary-foreground);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0 auto 1rem;
  box-shadow: var(--shadow-glow);
  transition: transform 0.3s;
}
.step-circle:hover { transform: scale(1.1); }
.step-text { color: var(--muted-foreground); }
.steps-line {
  display: none;
  position: absolute;
  top: 2rem;
  left: 0; right: 0;
  height: 2px;
  background: linear-gradient(to right, var(--p-blue), var(--p-turquoise), var(--p-green));
}

/* ============================================================
   PRICING CARDS
   ============================================================ */
.section-pricing {
  padding: 5rem 0;
  background: var(--p-gray-light);
}
.pricing-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  max-width: 80rem;
  margin: 0 auto;
}
.pricing-card {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius);
  border: none;
  box-shadow: var(--shadow-card);
  transition: all 0.3s;
}
.pricing-card:hover { transform: scale(1.05); box-shadow: var(--shadow-glow); }
.pricing-card-body { padding: 2rem; color: var(--primary-foreground); }
.pricing-card-badge {
  position: absolute;
  top: 1rem; right: 1rem;
  background: var(--background);
  color: var(--foreground);
  padding: 0.25rem 0.75rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 600;
}
.pricing-title  { font-size: 1.5rem; font-weight: 700; margin-bottom: 1.5rem; }
.pricing-amount { font-size: 3rem; font-weight: 700; margin-bottom: 0.5rem; }
.pricing-per    { color: hsla(0,0%,95%,0.8); margin-bottom: 1.5rem; }
.pricing-detail { color: hsla(0,0%,95%,0.9); margin-bottom: 0.5rem; font-size: 0.9rem; }
.pricing-zero   { font-size: 0.875rem; color: hsla(0,0%,95%,0.9); margin-top: 0.5rem; }
.pricing-card-footer { padding: 0 2rem 2rem; }
.btn-secondary {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.75rem 1.5rem;
  background: var(--background);
  color: var(--foreground);
  border: none;
  border-radius: var(--radius);
  font-weight: 500;
  font-size: 0.875rem;
  font-family: inherit;
  cursor: pointer;
  transition: background 0.2s;
}
.btn-secondary:hover { background: hsl(0,0%,90%); }
.btn-secondary svg { transition: transform 0.2s; }
.btn-secondary:hover svg { transform: translateX(4px); }

/* ============================================================
   INSPIRATIONAL BANNER
   ============================================================ */
.banner-section {
  position: relative;
  height: 300px;
  overflow: hidden;
}
.banner-bg {
  position: absolute; inset: 0;
  background-size: cover;
  background-position: center;
}
.banner-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to right, hsla(214,100%,34%,0.9), hsla(214,100%,34%,0.8), hsla(170,100%,42%,0.7));
}
.banner-content {
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.banner-title {
  font-size: clamp(1.5rem, 5vw, 3.75rem);
  font-weight: 700;
  color: white;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}
.banner-subtitle {
  font-size: 1.125rem;
  color: hsla(0,0%,100%,0.9);
  max-width: 48rem;
  margin: 0 auto;
}

/* ============================================================
   CONSORTIUM CARDS
   ============================================================ */
.section-consortium {
  padding: 5rem 0;
  background: var(--background);
}
.consortium-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  max-width: 80rem;
  margin: 0 auto;
}
.consortium-card {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius);
  border: none;
  transition: all 0.3s;
}
.consortium-card:hover { transform: scale(1.05); box-shadow: var(--shadow-glow); }
.consortium-card-badge {
  position: absolute;
  top: 1rem; right: 1rem;
  z-index: 10;
  background: var(--primary);
  color: var(--primary-foreground);
  padding: 0.5rem 1rem;
  border-radius: 9999px;
  font-size: 0.875rem;
  font-weight: 600;
}
.consortium-card-img-wrap { height: 12rem; overflow: hidden; opacity: 0.8; }
.consortium-card-img {
  width: 100%; height: 100%;
  object-fit: cover;
  mix-blend-mode: overlay;
  transition: transform 0.3s;
}
.consortium-card:hover .consortium-card-img { transform: scale(1.1); }
.consortium-card-body { padding: 1.5rem; color: var(--primary-foreground); }
.consortium-card-title { font-size: 1.5rem; font-weight: 700; margin-bottom: 0.5rem; }
.consortium-card-desc  { color: hsla(0,0%,95%,0.9); }

/* ============================================================
   TEAM SECTION
   ============================================================ */
.section-team {
  padding: 5rem 0;
  background: var(--background);
}
.team-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}
.team-card {
  position: relative;
  overflow: hidden;
  border-radius: 1.5rem;
  aspect-ratio: 3/4;
  transition: all 0.5s;
}
.team-card:hover { transform: scale(1.05); box-shadow: var(--shadow-glow); }
.team-color-layer {
  position: absolute; inset: 0;
  opacity: 0.9;
  transition: opacity 0.3s;
}
.team-card:hover .team-color-layer { opacity: 1; }
.team-img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  mix-blend-mode: overlay;
}
.team-info {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 1.5rem;
  color: white;
}
.team-name { font-size: 1.5rem; font-weight: 700; margin-bottom: 0.25rem; }
.team-role { color: hsla(0,0%,100%,0.9); }

/* ============================================================
   FAQ SECTION
   ============================================================ */
.section-faq {
  padding: 5rem 0;
  background: var(--primary);
}
.faq-list { list-style: none; display: flex; flex-direction: column; gap: 1rem; }
.faq-item {
  background: hsla(0,0%,100%,0.1);
  backdrop-filter: blur(4px);
  border-radius: var(--radius);
  border: 1px solid hsla(0,0%,95%,0.2);
  overflow: hidden;
}
.faq-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem 1.5rem;
  background: none;
  border: none;
  color: var(--primary-foreground);
  font-size: 1rem;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  gap: 1rem;
}
.faq-trigger:hover { color: hsla(0,0%,95%,0.8); }
.faq-chevron {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  transition: transform 0.3s;
}
.faq-trigger[aria-expanded="true"] .faq-chevron { transform: rotate(180deg); }
.faq-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out;
}
.faq-content.open { max-height: 500px; }
.faq-answer {
  padding: 0 1.5rem 1.25rem;
  color: hsla(0,0%,95%,0.9);
  font-size: 0.9rem;
  line-height: 1.7;
}

/* ============================================================
   TESTIMONIALS CAROUSEL
   ============================================================ */
.section-testimonials {
  padding: 5rem 0;
  background: var(--p-gray-light);
}
.carousel-wrap { position: relative; max-width: 72rem; margin: 0 auto; }
.carousel-viewport { overflow: hidden; }
.carousel-track {
  display: flex;
  transition: transform 0.4s cubic-bezier(0.4,0,0.2,1);
}
.carousel-slide {
  flex: 0 0 100%;
  padding: 0 0.5rem;
}
.testimonial-card {
  background: var(--card);
  border-radius: var(--radius);
  border: 1px solid var(--border);
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1rem;
  height: 100%;
  box-shadow: var(--shadow-card);
}
.testimonial-photo {
  width: 5rem;
  height: 5rem;
  border-radius: 9999px;
  object-fit: cover;
  border: 4px solid hsla(214,100%,34%,0.1);
}
.testimonial-name { font-weight: 700; font-size: 1.125rem; color: var(--foreground); }
.testimonial-stars { display: flex; gap: 0.25rem; }
.star-icon { width: 1.25rem; height: 1.25rem; color: var(--p-yellow); fill: var(--p-yellow); }
.testimonial-text { color: var(--muted-foreground); font-style: italic; }
.carousel-controls {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-top: 2rem;
}
.carousel-btn {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 9999px;
  border: 1px solid var(--border);
  background: var(--background);
  color: var(--foreground);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s;
}
.carousel-btn:hover { background: var(--primary); color: white; border-color: var(--primary); }

/* ============================================================
   CONTACT SECTION
   ============================================================ */
.section-contact {
  padding: 3rem 0 4rem;
  background: var(--background);
}
.contact-gradient-card {
  background-image: var(--gradient-purple-pink);
  border-radius: var(--radius);
  padding: 2rem;
  margin-bottom: 1.5rem;
  box-shadow: var(--shadow-glow);
}
.contact-gradient-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
  text-align: center;
}
.contact-icon-circle {
  width: 4rem;
  height: 4rem;
  border-radius: 9999px;
  background: hsla(0,0%,100%,0.2);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.contact-icon-circle svg { width: 2rem; height: 2rem; color: var(--primary-foreground); }
.contact-card-title { font-size: 1.5rem; font-weight: 700; color: var(--primary-foreground); margin-bottom: 0.5rem; }
.contact-card-sub   { color: hsla(0,0%,95%,0.9); font-size: 1rem; }
.btn-contact {
  flex-shrink: 0;
  padding: 0.75rem 1.5rem;
  background: var(--background);
  color: var(--foreground);
  border: none;
  border-radius: var(--radius);
  font-weight: 600;
  font-size: 0.9rem;
  font-family: inherit;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
}
.btn-contact:hover { background: hsl(0,0%,90%); }
.contact-info-card {
  border: 2px solid var(--border);
  border-radius: var(--radius);
  padding: 1.5rem 2rem;
}
.contact-info-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}
.contact-link {
  display: flex;
  align-items: center;
  gap: 1rem;
  transition: transform 0.2s;
  text-decoration: none;
}
.contact-link:hover { transform: scale(1.05); }
.contact-link-icon {
  flex-shrink: 0;
  width: 3rem;
  height: 3rem;
  border-radius: 9999px;
  background: var(--primary);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}
.contact-link:hover .contact-link-icon { background: hsl(214,100%,28%); }
.contact-link-icon svg { width: 1.5rem; height: 1.5rem; color: var(--primary-foreground); }
.contact-link-label { font-weight: 600; color: var(--foreground); font-size: 1.125rem; }
.contact-link-sub   { font-size: 0.875rem; color: var(--muted-foreground); }
.contact-divider { display: none; width: 1px; background: var(--border); }

/* ============================================================
   FOOTER
   ============================================================ */
.footer {
  background: var(--primary);
  color: var(--primary-foreground);
  padding: 4rem 0;
}
.footer-legal {
  font-size: 0.875rem;
  line-height: 1.75;
  max-width: 56rem;
  margin: 0 auto 3rem;
  text-align: center;
}
.footer-legal strong { font-weight: 700; }
.footer-legal .cnpj  { font-weight: 600; }
.footer-legal .fine  { font-size: 0.75rem; opacity: 0.8; }
.footer-certs-title {
  text-align: center;
  font-size: 0.875rem;
  font-weight: 600;
  opacity: 0.8;
  margin-bottom: 1.5rem;
}
.footer-certs-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  align-items: center;
  justify-items: center;
  max-width: 56rem;
  margin: 0 auto 3rem;
}
.footer-cert-item { display: flex; flex-direction: column; align-items: center; gap: 1rem; }
.footer-cert-img {
  height: 5rem;
  object-fit: contain;
  opacity: 0.9;
  transition: opacity 0.2s;
}
.footer-cert-img:hover { opacity: 1; }
.footer-cert-label { font-size: 0.75rem; opacity: 0.7; }
.footer-border-top { border-top: 1px solid hsla(0,0%,95%,0.2); padding-top: 2rem; margin-top: 2rem; }
.footer-copyright { text-align: center; font-size: 0.875rem; }

/* ============================================================
   FLOATING BUTTON
   ============================================================ */
.floating-btn {
  position: fixed;
  bottom: 3.5rem;
  right: 1.5rem;
  z-index: 50;
  background: var(--primary);
  color: white;
  border: none;
  border-radius: 9999px;
  padding: 1rem 1.5rem;
  font-size: 1rem;
  font-weight: 600;
  font-family: inherit;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  box-shadow: var(--shadow-glow), 0 0 0 0 hsla(214,100%,34%,0.4);
  cursor: pointer;
  transition: all 0.3s;
  animation: float-pulse 2s infinite;
}
.floating-btn:hover { background: hsl(214,100%,28%); transform: scale(1.1); }
@keyframes float-pulse {
  0%   { box-shadow: var(--shadow-glow), 0 0 0 0   hsla(214,100%,34%,0.4); }
  70%  { box-shadow: var(--shadow-glow), 0 0 0 12px hsla(214,100%,34%,0); }
  100% { box-shadow: var(--shadow-glow), 0 0 0 0   hsla(214,100%,34%,0); }
}

/* ============================================================
   SECTION SHARED HEADINGS
   ============================================================ */
.section-heading {
  font-size: clamp(1.5rem, 4vw, 2.25rem);
  font-weight: 700;
  text-align: center;
  margin-bottom: 1rem;
  color: var(--foreground);
}
.section-sub {
  font-size: 1.25rem;
  text-align: center;
  color: var(--muted-foreground);
  margin-bottom: 4rem;
}

/* ============================================================
   RESPONSIVE — md (≥ 768px)
   ============================================================ */
@media (min-width: 768px) {
  .hero-section { padding: 6rem 0; }
  .hero-grid { grid-template-columns: 1fr 1fr; gap: 3rem; }
  .sim-card { padding: 2rem; }
  .sim-card-title { font-size: 1.875rem; }

  .steps-grid { grid-template-columns: repeat(5, 1fr); }
  .steps-line { display: block; }

  .pricing-grid { grid-template-columns: repeat(2, 1fr); }

  .banner-section { height: 400px; }

  .consortium-grid { grid-template-columns: repeat(2, 1fr); }

  .team-grid { grid-template-columns: repeat(2, 1fr); }

  .carousel-slide { flex: 0 0 50%; }

  .contact-gradient-inner { flex-direction: row; text-align: left; }
  .contact-info-grid { grid-template-columns: 1fr 1fr; }
  .contact-divider { display: block; }

  .footer-certs-grid { grid-template-columns: repeat(3, 1fr); }
  .footer-cert-img   { height: 6rem; }
}

/* ============================================================
   RESPONSIVE — lg (≥ 1024px)
   ============================================================ */
@media (min-width: 1024px) {
  .pricing-grid    { grid-template-columns: repeat(4, 1fr); }
  .consortium-grid { grid-template-columns: repeat(4, 1fr); }
  .team-grid       { grid-template-columns: repeat(4, 1fr); }
  .carousel-slide  { flex: 0 0 33.333%; }
  .hero-title      { font-size: 3.75rem; }
}



.site-main{
  padding-bottom: 80px;
}

.breadcrumb {
    font-size: 0.85rem;
    color: #666;
    margin-bottom: 1rem;
}

.breadcrumb a {
    color: var(--primary); /* Ou a cor principal do seu site */
    text-decoration: none;
    transition: opacity 0.2s;
}

.breadcrumb a:hover {
    text-decoration: underline;
    opacity: 0.8;
}

.breadcrumb .separator {
    margin: 0 8px;
    color: #ccc;
}

.breadcrumb .current {
    color: #999;
    font-weight: 500;
}

.cookie-banner {
    position: fixed;
    bottom: 20px;
    left: 20px;
    right: 20px;
    max-width: 400px;
    background: #ffffff;
    color: #333;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
    z-index: 9999;
    display: none; /* Escondido por padrão */
    border: 1px solid #eee;
}

.cookie-content {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.cookie-content p {
    font-size: 0.9rem;
    line-height: 1.4;
    margin: 0;
}

.btn-cookie {
    background: var(--primary, #007bff); /* Usa sua cor principal */
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    transition: filter 0.2s;
}

.btn-cookie:hover {
    filter: brightness(1.1);
}

@media (max-width: 480px) {
    .cookie-banner {
        left: 10px;
        right: 10px;
        bottom: 10px;
    }
}

.signature{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 1rem;
}

.signature p{
  font-family: 'Rajdhani', sans-serif;
  font-size: 16px;
  text-align: start;
}