:root{
  --axis-bg:#07070a;
  --axis-bg-2:#0c0c12;
  --axis-text:#f5f2ea;
  --axis-muted:rgba(245,242,234,.70);
  --axis-gold:#d7c49a;
  --axis-gold-2:#bda36a;
  --axis-border:rgba(255,255,255,.10);
  --axis-shadow: 0 24px 80px rgba(0,0,0,.45);
}

html,body{height:100%; overflow-x: clip;}

.axis-body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 17px;
  line-height: 1.55;
  background:
    radial-gradient(1000px 600px at 15% 10%, rgba(215,196,154,.08), transparent 55%),
    radial-gradient(1200px 700px at 85% 20%, rgba(189,163,106,.06), transparent 60%),
    linear-gradient(180deg, var(--axis-bg), var(--axis-bg-2));
  color: var(--axis-text);
  overflow-x:hidden;
}

.axis-serif{font-family:"Playfair Display", Georgia, "Times New Roman", serif;}

/* Header-only typography: new font + bigger text only in the top navigation area. */
.axis-header{
  font-family: "Plus Jakarta Sans", Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
.axis-brand-full{display:none;}
@media (min-width: 640px){
  .axis-brand-short{display:none;}
  .axis-brand-full{display:inline;}
}

/* Force correct menu behavior even if responsive utility CSS is missing/cached */
@media (max-width: 1023px){
  .axis-header [data-desktop-nav]{display:none !important;}
  .axis-header [data-mobile-menu-button]{display:inline-flex !important;}
}
@media (min-width: 1024px){
  .axis-header [data-desktop-nav]{display:flex !important;}
  .axis-header [data-mobile-menu-button]{display:none !important;}
  .axis-header [data-menu-panel]{display:none !important;}
}
.axis-header .axis-brand-title{
  /* Responsive to avoid overflow on mobile while staying "bigger" */
  font-size: clamp(1.15rem, 3.8vw, 1.85rem);
  line-height: 1.15;
}
.axis-header .axis-nav-link{font-size: 1rem;}
.axis-header .axis-btn{font-size: 1rem;}
.axis-header .axis-mobile-link{font-size: 1rem;}

section[id]{scroll-margin-top: 92px;}

.axis-skip{
  position:absolute;
  left:12px;
  top:12px;
  z-index:100;
  padding:10px 12px;
  border-radius:12px;
  background:#fff;
  color:#000;
  transform: translateY(-220%);
  transition: transform .15s ease;
}
.axis-skip:focus{transform: translateY(0);}
.axis-skip:focus-visible{outline:none; box-shadow: 0 0 0 4px rgba(215,196,154,.25);}

.axis-header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  width:100%;
  z-index:200;
  backdrop-filter: blur(14px);
  background: rgba(0,0,0,.40);
  border-bottom: 1px solid var(--axis-border);
}

/* Spacer below the fixed header so content doesn't slide under it. */
#conteudo{height: 76px;}

.axis-logo{
  width:38px;height:38px;
  border-radius:12px;
  border: 1px solid rgba(215,196,154,.35);
  background:
    radial-gradient(circle at 30% 25%, rgba(255,255,255,.18), transparent 50%),
    linear-gradient(145deg, rgba(215,196,154,.30), rgba(189,163,106,.10));
  box-shadow: 0 10px 40px rgba(0,0,0,.35);
  position: relative;
  display:flex;
  align-items:center;
  justify-content:center;
}

@media (max-width: 639px){
  .axis-logo{width:32px;height:32px; border-radius:11px;}
  .axis-logo::after{font-size: 18px;}
}

.axis-logo::after{
  content:"∞";
  font-family:"Playfair Display", Georgia, "Times New Roman", serif;
  font-weight: 700;
  font-size: 22px;
  line-height: 1;
  color: rgba(215,196,154,.95);
  text-shadow: 0 8px 24px rgba(0,0,0,.45);
}

.axis-nav-link{
  font-size: 0.92rem;
  color: rgba(255,255,255,.70);
  transition: color .15s ease, transform .15s ease;
}
.axis-nav-link:hover{color: rgba(255,255,255,.92); transform: translateY(-1px);}
.axis-nav-link:focus{outline:none;}
.axis-nav-link--active{
  color: rgba(255,255,255,.94);
  position: relative;
}
.axis-nav-link--active::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-10px;
  height:2px;
  border-radius:999px;
  background: linear-gradient(90deg, transparent, rgba(215,196,154,.85), transparent);
}

.axis-menu-btn{
  width:44px;height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  border:1px solid var(--axis-border);
  background: rgba(255,255,255,.04);
  transition: background .15s ease, border-color .15s ease;
}
.axis-menu-btn:hover{background: rgba(255,255,255,.06); border-color: rgba(215,196,154,.30);}
.axis-menu-btn:focus{outline:none; box-shadow: 0 0 0 4px rgba(215,196,154,.15);}
.axis-menu-icon{
  width:18px;height:2px;
  background: rgba(255,255,255,.85);
  position: relative;
  border-radius:2px;
}
.axis-menu-icon::before,.axis-menu-icon::after{
  content:"";
  position:absolute;
  left:0;
  width:18px;height:2px;
  background: rgba(255,255,255,.70);
  border-radius:2px;
}
.axis-menu-icon::before{top:-6px;}
.axis-menu-icon::after{top:6px;}

.axis-mobile-menu{border-top:1px solid var(--axis-border);}
.axis-mobile-link{
  display:block;
  padding:10px 12px;
  border-radius:12px;
  color: rgba(255,255,255,.80);
  border:1px solid transparent;
}
.axis-mobile-link:hover{background: rgba(255,255,255,.04); border-color: rgba(215,196,154,.20);}

.axis-eyebrow{
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color: rgba(215,196,154,.75);
}

/* ==========================================================================
   Botões — MODELO 1 (backup do estilo atual)
   Para usar: axis-btn-modelo1 + (axis-btn-primary-modelo1 / secondary / ghost)
   ========================================================================== */
.axis-btn-modelo1{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding: .85rem 1.05rem;
  border-radius: 1rem;
  font-weight: 600;
  font-size: .95rem;
  border: 1px solid var(--axis-border);
  transition: transform .15s ease, background .15s ease, border-color .15s ease, color .15s ease;
}
.axis-btn-modelo1:focus{outline:none; box-shadow: 0 0 0 4px rgba(215,196,154,.18);}
.axis-btn-modelo1:hover{transform: translateY(-1px);}
.axis-btn-primary-modelo1{
  border-color: rgba(215,196,154,.40);
  background:
    radial-gradient(circle at 25% 20%, rgba(255,255,255,.20), transparent 55%),
    linear-gradient(135deg, rgba(215,196,154,.22), rgba(189,163,106,.12));
  color: rgba(255,255,255,.95);
}
.axis-btn-primary-modelo1:hover{border-color: rgba(215,196,154,.55);}
.axis-btn-secondary-modelo1{
  border-color: rgba(215,196,154,.25);
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.90);
}
.axis-btn-secondary-modelo1:hover{border-color: rgba(215,196,154,.40); background: rgba(255,255,255,.06);}
.axis-btn-ghost-modelo1{
  background: transparent;
  color: rgba(255,255,255,.80);
}
.axis-btn-ghost-modelo1:hover{background: rgba(255,255,255,.04); border-color: rgba(215,196,154,.25); color: rgba(255,255,255,.92);}

/* ==========================================================================
   Botões — NOVO MODELO (padrão atual do site)
   Mantém as mesmas classes (.axis-btn + variantes), só melhora o visual.
   ========================================================================== */
.axis-btn{
  position: relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  padding: .92rem 1.15rem;
  border-radius: 999px;
  font-weight: 650;
  font-size: .96rem;
  letter-spacing: .01em;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.92);
  box-shadow:
    0 18px 50px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.08);
  transition:
    transform .15s ease,
    box-shadow .15s ease,
    background .15s ease,
    border-color .15s ease,
    color .15s ease,
    filter .15s ease;
  -webkit-font-smoothing: antialiased;
  text-decoration: none;
}
.axis-btn::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius: inherit;
  opacity: 0;
  transition: opacity .15s ease;
  background: radial-gradient(140px 60px at 30% 0%, rgba(255,255,255,.22), transparent 65%);
  pointer-events:none;
}
.axis-btn:hover{
  transform: translateY(-1px);
  border-color: rgba(215,196,154,.32);
  background: rgba(255,255,255,.055);
  box-shadow:
    0 26px 70px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.10);
}
.axis-btn:hover::before{opacity: .9;}
.axis-btn:active{transform: translateY(0); filter: brightness(.98);}
.axis-btn:focus{outline:none;}
.axis-btn:focus-visible{box-shadow: 0 0 0 4px rgba(215,196,154,.20), 0 26px 70px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.10);}

.axis-btn-primary{
  border-color: rgba(215,196,154,.40);
  background:
    radial-gradient(220px 120px at 20% 0%, rgba(255,255,255,.18), transparent 60%),
    linear-gradient(135deg, rgba(215,196,154,.34), rgba(189,163,106,.10)),
    rgba(255,255,255,.02);
  color: rgba(255,255,255,.96);
}
.axis-btn-primary:hover{border-color: rgba(215,196,154,.62);}

.axis-btn-secondary{
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.035);
  color: rgba(255,255,255,.90);
}
.axis-btn-secondary:hover{border-color: rgba(215,196,154,.30);}

.axis-btn-ghost{
  background: transparent;
  border-color: rgba(255,255,255,.10);
  color: rgba(255,255,255,.85);
  box-shadow: none;
}
.axis-btn-ghost:hover{
  background: rgba(255,255,255,.04);
  border-color: rgba(215,196,154,.22);
  color: rgba(255,255,255,.94);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

.axis-link{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  font-size:.92rem;
  color: rgba(215,196,154,.85);
  text-decoration:none;
}
.axis-link:hover{color: rgba(215,196,154,.95); text-decoration: underline;}

.axis-card{
  border-radius: 1.25rem;
  border: 1px solid var(--axis-border);
  background:
    radial-gradient(800px 240px at 10% 0%, rgba(215,196,154,.06), transparent 60%),
    rgba(255,255,255,.03);
  box-shadow: 0 10px 60px rgba(0,0,0,.35);
}

.axis-surface{
  border-radius: 1.5rem;
  border: 1px solid rgba(215,196,154,.20);
  background:
    radial-gradient(900px 320px at 20% 0%, rgba(215,196,154,.10), transparent 60%),
    rgba(255,255,255,.03);
  box-shadow: var(--axis-shadow);
}

.axis-card-sheen{
  background:
    radial-gradient(500px 200px at 30% 0%, rgba(255,255,255,.12), transparent 60%),
    linear-gradient(120deg, transparent, rgba(255,255,255,.06), transparent);
  opacity:.9;
}

.axis-step{
  width:34px;height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius: 999px;
  border: 1px solid rgba(215,196,154,.35);
  background: rgba(0,0,0,.25);
  color: rgba(215,196,154,.95);
  font-weight: 700;
  font-size: .9rem;
}

.axis-dot{
  width:8px;height:8px;border-radius:999px;
  background: rgba(215,196,154,.90);
  box-shadow: 0 0 0 4px rgba(215,196,154,.10);
}

.axis-icon{
  width:34px;height:34px;
  border-radius: 12px;
  border: 1px solid rgba(215,196,154,.25);
  background: rgba(255,255,255,.03);
  display:flex;
  align-items:center;
  justify-content:center;
  color: rgba(215,196,154,.90);
  font-size: 16px;
  flex: 0 0 auto;
}

.axis-badge{
  font-size:.72rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  border-radius:999px;
  border:1px solid rgba(215,196,154,.25);
  color: rgba(215,196,154,.85);
  background: rgba(0,0,0,.25);
  padding: .45rem .7rem;
  white-space:nowrap;
}

.axis-scroll{
  overflow-x:auto;
  padding-bottom: 4px;
  scrollbar-width: thin;
  scrollbar-color: rgba(215,196,154,.25) transparent;
}
.axis-scroll::-webkit-scrollbar{height:8px;}
.axis-scroll::-webkit-scrollbar-thumb{background: rgba(215,196,154,.22); border-radius:999px;}
.axis-scroll-track{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(220px, 1fr);
  gap: 12px;
  scroll-snap-type: x mandatory;
}
.axis-mini-card{
  scroll-snap-align:start;
  border-radius: 1rem;
  border: 1px solid var(--axis-border);
  background: rgba(0,0,0,.25);
  padding: 14px;
}

.axis-li{
  position:relative;
  padding-left: 22px;
}
.axis-li::before{
  content:"";
  position:absolute;
  left:0;
  top: 0.55em;
  width:10px;height:10px;
  border-radius:999px;
  background: rgba(215,196,154,.85);
  box-shadow: 0 0 0 4px rgba(215,196,154,.12);
}

.axis-accordion{
  border-radius: 1.25rem;
  border: 1px solid var(--axis-border);
  background: rgba(255,255,255,.03);
  padding: 16px;
}
.axis-accordion[open]{border-color: rgba(215,196,154,.22);}
.axis-accordion-summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  cursor:pointer;
}
.axis-accordion-summary::-webkit-details-marker{display:none;}
.axis-accordion-icon{
  width:28px;height:28px;
  border-radius: 10px;
  border: 1px solid rgba(215,196,154,.25);
  display:flex;
  align-items:center;
  justify-content:center;
  color: rgba(215,196,154,.85);
  background: rgba(0,0,0,.25);
  font-weight: 700;
}
.axis-accordion[open] .axis-accordion-icon{transform: rotate(45deg); transition: transform .15s ease;}

.axis-footer-link{color: rgba(255,255,255,.70); text-decoration:none;}
.axis-footer-link:hover{color: rgba(255,255,255,.92); text-decoration: underline;}

.axis-bg-grid{
  background-image:
    linear-gradient(to right, rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(circle at 20% 10%, black 30%, transparent 65%);
}
.axis-bg-radial{
  background:
    radial-gradient(900px 500px at 30% 10%, rgba(215,196,154,.14), transparent 60%),
    radial-gradient(800px 500px at 85% 20%, rgba(189,163,106,.10), transparent 60%);
  opacity:.65;
}

.axis-sticky-cta{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
  background: rgba(0,0,0,.65);
  border-top: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(14px);
  z-index: 60;
}

@media (max-width: 639px){
  main{padding-bottom: 84px;}
}

@media (prefers-reduced-motion: reduce){
  *{scroll-behavior:auto !important; transition:none !important; animation:none !important;}
}


