/* Páginas de funcionalidade (usa a base de home.css: fh-browser, fh-title, fh-kicker...) */
.fp-hero{position:relative;padding:150px 0 110px;color:#fff;background:var(--flye-hero-bg);overflow:hidden}
.fp-hero-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:center}
.fp-crumb{display:flex;gap:8px;align-items:center;margin:0 0 22px!important;font-size:13.5px;color:rgba(255,255,255,.55)}
.fp-crumb a{color:rgba(255,255,255,.75)}
.fp-crumb a:hover{color:#fff}
.fp-module{display:flex;align-items:center;gap:10px;margin:0 0 14px!important;color:var(--flye-cyan);font-weight:700;font-size:15px}
.fp-module svg{width:22px;height:22px}
.fp-hero h1{font-size:clamp(36px,4.2vw,56px);line-height:1.04;letter-spacing:-.04em;margin:0 0 22px;color:#fff}
.fp-hero .fh-hero-lead{margin-bottom:32px!important}
.fp-hero .fh-browser{transform:perspective(1600px) rotateY(-7deg) rotateX(2deg)}
.fp-hero .fh-copy>*{animation:fh-rise .8s var(--flye-ease) both}
.fp-hero-visual{animation:fh-rise 1s .15s var(--flye-ease) both}

/* Cards de recursos */
.fp-features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.fp-feature{padding:32px 30px;border:1px solid var(--flye-line);border-radius:20px;background:#fff;transition:border-color .25s,box-shadow .25s}
.fp-feature:hover{border-color:#c9dafb;box-shadow:var(--flye-shadow-sm)}
.fp-feature>svg{display:block;width:28px;height:28px;color:var(--flye-blue);margin-bottom:22px}
.fp-feature h3{font-size:19px;letter-spacing:-.02em;margin:0 0 8px;color:var(--flye-ink)}
.fp-feature p{font-size:15.5px;line-height:1.6;color:var(--flye-muted)}

/* Destaque com print */
.fp-spot{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:64px;align-items:center}
.fp-spot .fh-title{font-size:clamp(28px,3vw,40px)}
.fp-spot+.fp-spot{margin-top:110px}
.fp-spot.is-flip .fp-spot-copy{order:2}
.fp-checks{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:14px}
.fp-checks li{display:flex;gap:12px;font-size:16px;line-height:1.5;color:var(--flye-ink)}
.fp-checks svg{flex:none;width:22px;height:22px;padding:4px;border-radius:50%;background:#e3f8ee;color:#12a35a;margin-top:1px}
.fp-spot-media img.fp-photo-img{border-radius:24px;box-shadow:var(--flye-shadow-lg);aspect-ratio:16/11;object-fit:cover;width:100%}
.fp-spot-media .fp-phone-img{max-width:300px;margin:0 auto;border-radius:32px;box-shadow:var(--flye-shadow-lg)}
.fp-howto-visual .fp-phone-img{max-width:260px}
.fp-hero-visual .fp-phone-img,.fp-howto-visual .fp-phone-img{display:block;margin:0 auto;border-radius:32px;box-shadow:var(--flye-shadow-lg)}

/* Fluxo de status (ordem de serviço) */
.fp-flow{background:#fff;color:var(--flye-ink);border-radius:20px;padding:28px;box-shadow:0 50px 100px -30px rgba(0,0,0,.6)}
.fp-flow-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-bottom:18px;border-bottom:1px solid var(--flye-line);margin-bottom:20px}
.fp-flow-head b{font-size:18px;letter-spacing:-.02em}
.fp-flow-head span{font-size:13px;color:var(--flye-muted)}
.fp-flow ol{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.fp-flow li{display:grid;grid-template-columns:30px 1fr auto;gap:14px;align-items:center;padding:12px 10px;border-radius:12px;font-size:15px}
.fp-flow li i{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--flye-line);font-style:normal}
.fp-flow li i svg{width:16px;height:16px}
.fp-flow li small{color:var(--flye-muted);font-size:13px}
.fp-flow li.is-done i{background:#12a35a;border-color:#12a35a;color:#fff}
.fp-flow li.is-now{background:#eef4ff}
.fp-flow li.is-now i{border-color:var(--flye-blue);box-shadow:inset 0 0 0 5px #fff;background:var(--flye-blue)}
.fp-flow li.is-now b{color:var(--flye-blue)}
.fp-flow li:not(.is-done):not(.is-now){color:var(--flye-muted)}

/* Módulos relacionados */
.fp-related{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.fp-rel{display:flex;flex-direction:column;gap:10px;padding:24px;border-radius:18px;background:#fff;border:1px solid var(--flye-line);transition:border-color .25s,transform .25s var(--flye-ease)}
.fp-rel:hover{border-color:var(--flye-blue);transform:translateY(-3px)}
.fp-rel>svg{width:24px;height:24px;color:var(--flye-blue)}
.fp-rel b{font-size:16.5px;letter-spacing:-.02em}
.fp-rel span{font-size:14px;color:var(--flye-muted);line-height:1.5}
.fp-rel em{margin-top:auto;font-style:normal;font-size:14px;font-weight:700;color:var(--flye-blue);display:flex;align-items:center;gap:6px}
.fp-rel em svg{width:16px;height:16px;transition:transform .25s}
.fp-rel:hover em svg{transform:translateX(4px)}

/* Página índice de funcionalidades */
.fp-index{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.fp-index .fp-rel{flex-direction:row;align-items:flex-start;gap:20px;padding:30px}
.fp-index .fp-rel>svg{flex:none;width:30px;height:30px;margin-top:2px}
.fp-index .fp-rel div{display:flex;flex-direction:column;gap:6px;flex:1}
.fp-index .fp-rel b{font-size:19px}
.fp-index .fp-rel span{font-size:15px}

@media(max-width:1080px){
  .fp-hero-grid,.fp-spot{grid-template-columns:minmax(0,1fr)}
  .fp-hero .fh-browser{transform:none}
  .fp-spot.is-flip .fp-spot-copy{order:0}
  .fp-features{grid-template-columns:1fr 1fr}
  .fp-related{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .fp-hero{padding:120px 0 80px}
  .fp-features,.fp-related,.fp-index{grid-template-columns:minmax(0,1fr)}
  .fp-feature{padding:26px 22px}
  .fp-spot+.fp-spot{margin-top:72px}
}

/* Links para segmentos */
.fp-seg-label{margin:44px 0 14px!important;text-align:center;font-size:14px;font-weight:700;color:var(--flye-muted)}
.fp-seg-links{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.fp-seg-links a{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;border:1px solid var(--flye-line);background:#fff;font-size:14.5px;font-weight:600;color:var(--flye-ink);transition:border-color .2s,color .2s,transform .2s}
.fp-seg-links a:hover{border-color:var(--flye-blue);color:var(--flye-blue);transform:translateY(-2px)}
.fp-seg-links svg{width:18px;height:18px;color:var(--flye-blue)}


/* O que é: texto explicativo */
.fp-explain{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:72px;align-items:start}
.fp-explain-head{position:sticky;top:120px}
.fp-explain-head .fh-title,.fp-howto-head .fh-title{font-size:clamp(28px,3.4vw,46px)}
.fp-explain-text p{font-size:18px;line-height:1.7;color:#334259;margin:0 0 18px}
.fp-explain-points{margin-top:28px;padding:26px 28px;border-radius:20px;background:var(--flye-surface);border:1px solid var(--flye-line)}
.fp-explain-points b{display:block;margin-bottom:14px;font-size:15px}
.fp-explain-points ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px 24px}
.fp-explain-points li{display:flex;gap:10px;font-size:15px;line-height:1.45}
.fp-explain-points svg{flex:none;width:20px;height:20px;color:#12a35a}

/* Passo a passo */
.fp-howto{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:start}
.fp-howto-head{position:sticky;top:110px}
.fp-howto-visual{margin-top:32px}
.fp-howto-visual .fh-browser{transform:none}
.fp-howto-steps{list-style:none;margin:0;padding:0;position:relative;display:grid;gap:14px}
.fp-howto-steps li{position:relative;padding:24px 26px;border-radius:20px;background:#fff;border:1px solid var(--flye-line);transition:border-color .25s,transform .3s var(--flye-ease)}
.fp-howto-steps li:hover{border-color:#c9dafb;transform:translateX(4px)}
.fp-howto-n{display:inline-block;margin-bottom:8px;font-size:13px;font-weight:700;color:var(--flye-blue)}
.fp-howto-steps h3{margin:0 0 6px;font-size:19px;letter-spacing:-.02em}
.fp-howto-steps p{font-size:15.5px;line-height:1.55;color:var(--flye-muted)}

@media(max-width:1000px){
  .fp-explain,.fp-howto{grid-template-columns:1fr;gap:32px}
  .fp-explain-head,.fp-howto-head{position:static}
  .fp-explain-points ul{grid-template-columns:minmax(0,1fr)}
}
