/* ============================================================
   Ferramentas (free SEO tools) — self-contained, no Tailwind
   purge dependency. Namespaced under .ftool.
   ============================================================ */
.ftool {
  max-width: 860px;
  margin: 0 auto;
  padding: 24px 16px 64px;
  line-height: 1.6;
}
.ftool-wide { max-width: 1100px; }
.ftool h1 {
  font-size: 1.9rem;
  font-weight: 700;
  margin: 8px 0 6px;
  background: linear-gradient(90deg, #F7931A, #f59e0b);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.ftool .lead { font-size: 1.05rem; opacity: .85; margin-bottom: 20px; }
.ftool h2 { font-size: 1.35rem; font-weight: 700; margin: 32px 0 10px; }
.ftool h3 { font-size: 1.1rem; font-weight: 700; margin: 20px 0 8px; }
.ftool a { color: #F7931A; }
.ftool .crumbs { font-size: .85rem; opacity: .7; margin-bottom: 4px; }
.ftool .crumbs a { text-decoration: none; }

.ftool-card {
  background: #fff;
  border: 1px solid #f1d9b5;
  border-radius: 16px;
  padding: 22px;
  box-shadow: 0 6px 20px rgba(247,147,26,.08);
  margin-bottom: 20px;
}
body.dark-mode .ftool-card { background: #383838; border-color: #4a4a4a; }

.ftool-field { margin-bottom: 14px; display: flex; flex-direction: column; gap: 5px; }
.ftool-field label { font-weight: 600; font-size: .9rem; }
.ftool-field .hint { font-size: .78rem; opacity: .65; }
.ftool input[type=number],
.ftool input[type=text],
.ftool input[type=date],
.ftool select,
.ftool textarea {
  width: 100%;
  padding: 11px 13px;
  border: 1px solid #d4d4d8;
  border-radius: 10px;
  font: inherit;
  background: #fafafa;
  color: inherit;
}
body.dark-mode .ftool input,
body.dark-mode .ftool select,
body.dark-mode .ftool textarea { background: #2d2d2d; border-color: #555; color: #e5e5e5; }
.ftool input:focus, .ftool select:focus, .ftool textarea:focus {
  outline: none; border-color: #F7931A; box-shadow: 0 0 0 3px rgba(247,147,26,.18);
}
.ftool-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 600px){ .ftool-grid, .ftool .ftool-grid-3 { grid-template-columns: 1fr; } }
.ftool-grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }

.ftool-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  background: linear-gradient(90deg, #F7931A, #f59e0b);
  color: #fff; font-weight: 700; border: none; cursor: pointer;
  padding: 12px 20px; border-radius: 10px; font-size: 1rem; text-decoration: none;
  transition: transform .08s ease, box-shadow .2s ease;
}
.ftool-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(247,147,26,.35); color:#fff; }
.ftool-btn.secondary { background: transparent; color: #F7931A; border: 1.5px solid #F7931A; }

.ftool-result {
  background: linear-gradient(135deg, rgba(247,147,26,.08), rgba(245,158,11,.05));
  border: 1px solid #f1d9b5; border-radius: 14px; padding: 18px; margin-top: 8px;
}
body.dark-mode .ftool-result { background: rgba(247,147,26,.10); border-color:#5a4a30; }
.ftool-result .big { font-size: 2rem; font-weight: 800; color: #F7931A; line-height: 1.1; }
.ftool-result .label { font-size: .82rem; opacity: .7; text-transform: uppercase; letter-spacing: .03em; }
.ftool-stats { display: grid; grid-template-columns: repeat(auto-fit,minmax(130px,1fr)); gap: 14px; }
.ftool-stat { text-align: center; }

.ftool-table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.ftool-table th, .ftool-table td { padding: 10px 12px; border-bottom: 1px solid #eee; text-align: left; }
body.dark-mode .ftool-table th, body.dark-mode .ftool-table td { border-color:#4a4a4a; }
.ftool-table th { font-weight: 700; background: rgba(247,147,26,.07); }
.ftool-table .win { color: #16a34a; font-weight: 700; }
.ftool-table .lose { color: #dc2626; font-weight: 700; }

.ftool-cta {
  text-align: center; margin: 36px 0 8px; padding: 28px 20px;
  background: linear-gradient(135deg, #F7931A, #f59e0b); border-radius: 18px; color: #fff;
}
.ftool-cta h2 { color: #fff; margin-top: 0; }
.ftool-cta p { margin: 8px 0 0; }
.ftool-cta .ftool-btn { background: #fff; color: #c2410c; margin-top: 22px; }

.ftool-note {
  font-size: .82rem; opacity: .7; border-left: 3px solid #F7931A;
  padding: 8px 12px; margin: 14px 0; background: rgba(247,147,26,.05); border-radius: 0 8px 8px 0;
}
.ftool-prose p { margin: 10px 0; }
.ftool-prose ul { margin: 10px 0; padding-left: 22px; list-style: disc; }
.ftool-prose li { margin: 5px 0; }

.ftool-faq details { border-bottom: 1px solid #eee; padding: 12px 0; }
body.dark-mode .ftool-faq details { border-color:#4a4a4a; }
.ftool-faq summary { font-weight: 700; cursor: pointer; }
.ftool-faq summary::-webkit-details-marker { color: #F7931A; }

.ftool-index-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(250px,1fr)); gap: 18px; }
.ftool-index-card {
  display: block; background: #fff; border: 1px solid #eee; border-radius: 16px;
  padding: 22px; text-decoration: none; transition: transform .12s, box-shadow .2s, border-color .2s;
}
body.dark-mode .ftool-index-card { background:#383838; border-color:#4a4a4a; }
.ftool-index-card:hover { transform: translateY(-3px); box-shadow: 0 10px 26px rgba(247,147,26,.18); border-color: #F7931A; }
.ftool-index-card .ic { display:inline-flex; align-items:center; justify-content:center; width:46px; height:46px; border-radius:12px; background:rgba(247,147,26,.12); margin-bottom:12px; color:#F7931A; }
.ftool-index-card .ic svg { width:24px; height:24px; }
.ftool-index-card .t { font-weight: 800; font-size: 1.05rem; margin-bottom: 6px; color: #1a1a1a; }
body.dark-mode .ftool-index-card .t { color: #f5f5f5; }
.ftool-index-card .d { font-size: .88rem; color: #6b7280; line-height: 1.5; }
body.dark-mode .ftool-index-card .d { color: #b5b5b5; }
.ftool-badge { display:inline-block; font-size:.7rem; font-weight:700; padding:2px 8px; border-radius:999px; background:rgba(247,147,26,.15); color:#c2410c; margin-bottom:8px; }