/*
 * izolmak.com.mk front page: the sections after the hero (facts, products, solutions, profiles, support band,
 * news). Board: https://claude.ai/artifact/EXDmS3knR1S2d2o6Ep6xE4. The support band's buttons are the hero's
 * (.ih-btn, .ih-btn2 in home-hero.20261024.css). The file name changes with its content: CSS is cached 30 days.
 */
.fp { --fp-blue: #1B3679; --fp-ground: #072378; --fp-yellow: #FDB813; --fp-gold: #8a5d00; --fp-text: #1f2937; --fp-muted: #4b5563;
  padding: 72px 0; color: var(--fp-text); }
.fp-wrap { max-width: 1152px; margin: 0 auto; padding: 0 24px; box-sizing: border-box; display: flex; flex-direction: column; gap: 32px; }
.fp-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.fp-intro { display: flex; flex-direction: column; gap: 12px; max-width: 760px; }
.fp-eyebrow { margin: 0 0 10px; font-size: 13px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--fp-gold); }
.fp-intro .fp-eyebrow { margin: 0; }
.fp .fp-h2 { margin: 0; font-size: clamp(26px, 3vw, 34px); line-height: 1.2; font-weight: 700; color: var(--fp-blue); text-transform: none; }
.fp-lead { margin: 0; font-size: 17px; line-height: 1.6; color: #374151; }
.fp-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 0; list-style: none; }
.fp-more { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-weight: 700; color: var(--fp-blue); text-decoration: none; align-self: flex-start; }
.fp-more:hover { color: #0f2150; text-decoration: underline; }
.fp a:focus-visible { outline: 3px solid var(--fp-yellow); outline-offset: 3px; }

/* facts */
.fp-facts { padding-bottom: 64px; }
.fp-fact { border-top: 4px solid var(--fp-yellow); padding-top: 16px; display: flex; flex-direction: column; gap: 6px; }
.fp-fact strong { font-size: 44px; line-height: 1; font-weight: 700; color: var(--fp-blue); }
.fp-fact span { font-size: 15px; line-height: 1.5; color: #374151; }

/* cards: products and profiles */
.fp-products { background: #F0F2FA; }
.fp-card { background: #ffffff; border-radius: 10px; overflow: hidden; box-shadow: 0 2px 12px rgba(27, 54, 121, .08); display: flex; flex-direction: column; }
.fp-media { display: block; height: 180px; background: #ffffff; }
.fp-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.fp-media--pack img { object-fit: contain; padding: 10px; box-sizing: border-box; }
.fp-body { padding: 20px 20px 16px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.fp-kind { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; color: var(--fp-gold); }
.fp .fp-h3 { margin: 0; font-size: 22px; font-weight: 700; color: var(--fp-blue); }
.fp-h3 a { color: inherit; text-decoration: none; }
.fp-h3 a:hover { text-decoration: underline; }
.fp-points { margin: 4px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; font-size: 15px; line-height: 1.45; }
.fp-points li { display: flex; gap: 10px; align-items: flex-start; }
.fp-points svg { flex-shrink: 0; margin-top: 2px; color: var(--fp-blue); }
.fp-product .fp-more { margin-top: auto; }

.fp-profiles { padding-top: 0; }
.fp-profile { text-decoration: none; color: inherit; transition: box-shadow .2s ease, transform .2s ease; }
.fp-profile:hover { box-shadow: 0 8px 24px rgba(27, 54, 121, .16); transform: translateY(-2px); }
.fp-profile img { display: block; width: 100%; height: 150px; object-fit: cover; }
.fp-profile .fp-body { padding: 16px 18px 18px; gap: 6px; }
.fp-profile .fp-h3 { font-size: 19px; }
.fp-line { font-size: 14px; line-height: 1.5; color: #374151; }

/* solutions */
.fp-tile { position: relative; display: block; min-height: 260px; border-radius: 10px; overflow: hidden; color: #ffffff; text-decoration: none; background: var(--fp-ground); }
.fp-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.fp-tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(7, 35, 120, 0) 25%, rgba(7, 35, 120, .94) 100%); }
.fp-tile:hover img { transform: scale(1.04); }
.fp-tile-text { position: absolute; z-index: 1; left: 20px; right: 20px; bottom: 18px; display: flex; flex-direction: column; gap: 6px; }
.fp-tile-name { font-size: 22px; font-weight: 700; }
.fp-tile-line { font-size: 14px; line-height: 1.45; color: #e5eaf7; }
.fp-tile-go { font-size: 14px; font-weight: 700; color: var(--fp-yellow); }

/* support band */
.fp-band { position: relative; overflow: hidden; background: var(--fp-ground); color: #ffffff; padding: 56px 0; --ih-yellow: var(--fp-yellow); }
/* the band's buttons are the hero's: .ih-btn takes its yellow from --ih-yellow */
.fp-band-shape { position: absolute; inset: 0; background: var(--fp-blue); clip-path: polygon(64% 0, 100% 0, 100% 100%, 56% 100%); }
.fp-band-shape::before { content: ""; position: absolute; inset: 0; background: var(--fp-yellow); clip-path: polygon(63% 0, 64% 0, 56% 100%, 55% 100%); }
.fp-band .fp-wrap { position: relative; flex-direction: row; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 24px; }
.fp-band .fp-band-h { margin: 0 0 10px; font-size: clamp(24px, 2.6vw, 30px); line-height: 1.25; color: #ffffff; }
.fp-band p { margin: 0; max-width: 600px; font-size: 17px; line-height: 1.6; color: #dfe5f5; }
.fp-band-ctas { display: flex; gap: 12px; flex-wrap: wrap; }

/* news */
.fp-post { display: flex; flex-direction: column; gap: 10px; padding-top: 16px; border-top: 1px solid #d8dde6; text-decoration: none; color: inherit; }
.fp-post-title { font-size: 18px; font-weight: 700; line-height: 1.35; color: var(--fp-blue); }
.fp-post:hover .fp-post-title { text-decoration: underline; }
.fp-post-go { font-size: 14px; font-weight: 700; color: var(--fp-gold); }

@media (max-width: 900px) {
  .fp { padding: 56px 0; }
  .fp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fp-band-shape { clip-path: polygon(78% 0, 100% 0, 100% 100%, 70% 100%); }
  .fp-band-shape::before { clip-path: polygon(77% 0, 78% 0, 70% 100%, 69% 100%); }
}
@media (max-width: 560px) {
  .fp-wrap { padding: 0 16px; gap: 24px; }
  .fp-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .fp-factlist { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fp-fact strong { font-size: 36px; }
  .fp-tile { min-height: 220px; }
  .fp-band-ctas { width: 100%; flex-direction: column; }
  .fp-band-ctas a { width: 100%; }
  .fp-band-shape, .fp-band-shape::before { display: none; }
}
@media (prefers-reduced-motion: reduce) { .fp-tile img, .fp-profile { transition: none; } }