/* Imersão em IA aplicada ao BIM · FF Solutions
   Página estática, independente do WordPress. Fontes e tokens do FF Solutions Design System. */

@font-face{font-family:"Clash Grotesk";src:url("../fonts/ClashGrotesk-Medium.otf") format("opentype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Clash Grotesk";src:url("../fonts/ClashGrotesk-Semibold.otf") format("opentype");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Geologica";src:url("../fonts/Geologica-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Geologica";src:url("../fonts/Geologica-Medium.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Geologica";src:url("../fonts/Geologica-SemiBold.ttf") format("truetype");font-weight:600;font-style:normal;font-display:swap}

:root{
  --font-display:"Clash Grotesk","Inter",system-ui,sans-serif;
  --font-body:"Geologica","Inter",system-ui,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
  color-scheme:dark;
}

html{scroll-behavior:smooth;scroll-padding-top:80px}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:#050F22;font-family:"Geologica","Inter",system-ui,sans-serif;color:#FFFFFF;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:#FF8A52}a:hover{color:#FFFFFF}
a:focus-visible{outline:2px solid #FF712E;outline-offset:3px}
input:focus,select:focus{outline:none;border-color:#FF712E !important;box-shadow:0 0 0 3px rgba(255,113,46,.25)}
input::placeholder{color:rgba(255,255,255,.45)}
select option{color:#0C2751;background:#FFFFFF}

.ff-btn{transition:background .2s, box-shadow .2s, transform .2s}
.ff-btn:hover{background:#FF8A52 !important;color:#081A36 !important;box-shadow:0 0 0 1px rgba(255,113,46,.6),0 8px 32px rgba(255,113,46,.45) !important;transform:translateY(-1px)}
.ff-ghost{transition:border-color .2s, background .2s}
.ff-ghost:hover{border-color:#FF712E !important;background:rgba(255,113,46,.08) !important;color:#FFFFFF !important}
.ff-card{transition:border-color .25s, box-shadow .25s, transform .25s}
.ff-card:hover{border-color:rgba(255,113,46,.55) !important;box-shadow:0 0 0 1px rgba(255,113,46,.25),0 16px 48px rgba(255,113,46,.12) !important;transform:translateY(-2px)}
.ff-ticker{animation:ffTicker 40s linear infinite}
.ff-blink{animation:ffBlink 1.1s steps(1) infinite}
.ff-pulse{animation:ffPulse 2s ease-in-out infinite}
.ff-spin{animation:ffSpin .8s linear infinite}
@keyframes ffSpin{to{transform:rotate(360deg)}}
@keyframes ffTicker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes ffBlink{50%{opacity:0}}
@keyframes ffPulse{0%,100%{box-shadow:0 0 0 0 rgba(255,113,46,.6)}50%{box-shadow:0 0 0 6px rgba(255,113,46,0)}}
.ff-faq summary{list-style:none;cursor:pointer}
.ff-faq summary::-webkit-details-marker{display:none}
.ff-faq summary:hover{color:#FF8A52}
.ff-faq summary:focus-visible{outline:2px solid #FF712E;outline-offset:4px;border-radius:8px}
.ff-faq-icon{transition:transform .25s}
.ff-faq[open] .ff-faq-icon{transform:rotate(45deg)}
.ff-faq[open]{border-color:rgba(255,113,46,.45) !important;background:rgba(255,113,46,.05) !important}
.ff-voucher{transition:border-color .25s, background .25s, transform .25s}
.ff-voucher:hover{border-color:#FF712E !important;background:rgba(255,113,46,.13) !important;transform:translateY(-2px)}
.ff-btn-navy{transition:background .2s, transform .2s}
.ff-btn-navy:hover{background:#0C2751 !important;color:#FFFFFF !important;transform:translateY(-1px)}

/* Painel do agente (hero) */
.ff-step{display:flex;gap:12px;align-items:flex-start;color:rgba(255,255,255,.86);transition:color .3s}
.ff-step-icon{flex:none;display:inline-flex;width:20px;height:20px;align-items:center;justify-content:center;border-radius:6px;font-size:12px;box-sizing:border-box}
.ff-step-hl{color:#FF8A52}
.ff-step-tag{flex:none;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#FF8A52;padding-top:2px}
.ff-step[data-state="done"] .ff-step-icon{background:rgba(255,113,46,.15);color:#FF8A52}
.ff-step[data-state="pending"]{color:rgba(255,255,255,.38)}
.ff-step[data-state="pending"] .ff-step-icon{border:1px dashed rgba(255,255,255,.35)}
.ff-step[data-state="pending"] .ff-step-hl{color:rgba(255,138,82,.45)}
.ff-step[data-state="pending"] .ff-step-tag{color:rgba(255,255,255,.35)}
.ff-step[data-state="running"] .ff-step-tag{color:#FFFFFF}
[hidden]{display:none !important}

/* Formulário HubSpot sobre fundo escuro */
#ff-hs-mount .hs-form-frame{min-height:320px}

@media (max-width: 640px){.ff-navlink{display:none}.ff-facts{grid-template-columns:1fr 1fr !important}.ff-facts>div{padding:16px 12px 16px 0 !important;border-right:0 !important}.ff-facts strong{font-size:17px !important}}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}.ff-ticker,.ff-blink,.ff-pulse,.ff-spin{animation:none}.ff-card:hover,.ff-btn:hover,.ff-voucher:hover{transform:none}}
