*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: var(--font-body); font-size: 16px; line-height: 1.65; color: var(--text-dark); background: var(--chalk); -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
ul { margin: 0; padding: 0; list-style: none; }
p { margin: 0; }
h1, h2, h3, h4 { margin: 0; font-family: var(--font-head); font-weight: 600; }
button { font: inherit; border: 0; background: none; cursor: pointer; color: inherit; padding: 0; }
table { border-collapse: collapse; width: 100%; }
.jfs-container { max-width: var(--container); margin: 0 auto; padding: 0 24px; }
.jfs-skip { position: absolute; left: -9999px; top: 0; background: var(--pine); color: #fff; padding: 10px 16px; z-index: 200; }
.jfs-skip:focus { left: 0; }
.jfs-h1 { font-size: clamp(30px, 4vw, 44px); line-height: 1.1; text-wrap: balance; }
.jfs-h2 { font-size: clamp(23px, 3vw, 29px); line-height: 1.2; }
.jfs-h3 { font-size: 20px; line-height: 1.25; }
.jfs-h1--light, .jfs-h2--light { color: var(--text-on-dark); }
.jfs-eyebrow { font-family: var(--font-head); font-weight: 500; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--pine); margin-bottom: 10px; }
.jfs-eyebrow--light { color: var(--pine-light); }
.jfs-breadcrumb { font-family: var(--font-mono); font-size: 12px; color: var(--muted-soft); margin-bottom: 14px; }
.jfs-breadcrumb a:hover { color: var(--pine-light); }
.jfs-pagehero--plain .jfs-breadcrumb, .jfs-section--light .jfs-breadcrumb { color: var(--text-stone); }
.jfs-dashes { display: inline-flex; gap: 6px; margin-bottom: 16px; }
.jfs-dashes span { width: 26px; height: 4px; }
.jfs-dashes span:nth-child(1) { background: var(--pine); }
.jfs-dashes span:nth-child(2) { background: var(--gas); }
.jfs-dashes span:nth-child(3) { background: var(--oil); }
.jfs-stripe { height: 4px; width: 180px; background: linear-gradient(90deg, var(--pine) 0 44%, var(--gas) 44% 72%, var(--oil) 72% 90%, transparent 90%); margin-bottom: 24px; }
.jfs-rule { display: block; height: 4px; }
.jfs-rule--water { background: var(--pine); }
.jfs-rule--gas { background: var(--gas); }
.jfs-rule--oil { background: var(--oil); }
.jfs-rule--short { width: 36px; }
.jfs-btn { display: inline-flex; align-items: center; justify-content: center; gap: 12px; height: 48px; padding: 0 24px; font-family: var(--font-head); font-weight: 600; font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase; transition: background 0.2s, color 0.2s, border-color 0.2s; }
.jfs-btn--primary { background-image: var(--grad-water); color: #fff; }
.jfs-btn--primary:hover { background-image: var(--grad-water-hover); }
.jfs-btn--outline { border: 1px solid var(--ink-900); color: var(--ink-900); }
.jfs-btn--outline:hover { background: var(--ink-900); color: #fff; }
.jfs-btn--outline-light { border: 1px solid rgba(242, 246, 242, 0.55); color: var(--text-on-dark); }
.jfs-btn--outline-light:hover { background: rgba(242, 246, 242, 0.12); }
.jfs-btn--dark { background: var(--ink-900); color: #fff; }
.jfs-btn--dark:hover { background: var(--ink-950); }
.jfs-btn--ghost { color: var(--muted-strong); border: 1px solid var(--ink-600); }
.jfs-btn--ghost:hover { color: #fff; border-color: var(--muted-soft); }
.jfs-btn--whatsapp { background: #25D366; color: var(--ink-950); }
.jfs-btn--whatsapp:hover { background: #1FBF5B; }
.jfs-btn--sm { height: 40px; padding: 0 16px; font-size: 12px; }
.jfs-btn--block { width: 100%; }
.jfs-arrow { flex: none; }
.jfs-link { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-head); font-weight: 600; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--pine); }
.jfs-link:hover { color: var(--pine-hover); }
.jfs-link--light { color: var(--pine-light); }
.jfs-link--light:hover { color: #fff; }
.jfs-icon { flex: none; }
.jfs-icon--sm { width: 16px; height: 16px; }
.jfs-icon--xs { width: 12px; height: 12px; }
.jfs-icon--lg { width: 30px; height: 30px; }
.jfs-icon--xl { width: 44px; height: 44px; }
.jfs-icon--pine { color: var(--pine); }
.jfs-icon--flip { transform: scaleX(-1); }
.jfs-badge { display: inline-flex; align-items: center; font-family: var(--font-head); font-weight: 600; font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: #fff; padding: 5px 9px; }
.jfs-badge--stock { background: var(--success); }
.jfs-badge--lead { background: #5C7A30; }
.jfs-badge--request { background: var(--ink-900); }
.jfs-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; font-family: var(--font-head); font-weight: 500; font-size: 12px; border: 1px solid; }
.jfs-chip--water { background: var(--water-tint); color: var(--water-text); border-color: var(--water-border); }
.jfs-chip--gas { background: var(--gas-tint); color: var(--gas-text); border-color: var(--gas-border); }
.jfs-chip--oil { background: var(--oil-tint); color: var(--oil-text); border-color: var(--oil-border); }
.jfs-chip--plain { background: #fff; color: var(--text-dark); border-color: var(--line-light); }
.jfs-chip-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.jfs-ticks { position: relative; }
.jfs-ticks::before { content: ''; position: absolute; top: -1px; left: -1px; width: 12px; height: 12px; border-top: 2px solid var(--pine-light); border-left: 2px solid var(--pine-light); }
.jfs-ticks::after { content: ''; position: absolute; bottom: -1px; right: -1px; width: 12px; height: 12px; border-bottom: 2px solid var(--oil); border-right: 2px solid var(--oil); opacity: 0.65; }
.jfs-banner { display: flex; gap: 12px; padding: 14px 16px; border: 1px solid; border-left-width: 4px; margin-bottom: 18px; font-size: 14px; }
.jfs-banner__title { font-family: var(--font-head); font-weight: 600; font-size: 14px; }
.jfs-banner--success { background: var(--success-bg); border-color: var(--success-border); border-left-color: var(--success); color: #41584A; }
.jfs-banner--success .jfs-banner__title { color: #1A5133; }
.jfs-banner--success .jfs-icon { color: var(--success); }
.jfs-banner--error { background: var(--error-bg); border-color: var(--error-border); border-left-color: var(--error); color: #6B322C; }
.jfs-banner--error .jfs-banner__title { color: #8E1F19; }
.jfs-banner--error .jfs-icon { color: var(--error); }
.jfs-prose p { margin: 0 0 14px; line-height: 1.7; }
.jfs-prose p:last-child { margin-bottom: 0; }
