/* Informačné stránky O nás / Pre dodávateľov / Kariéra (legal_layout v režime $plain). */

.ip-hero{
  position:relative; overflow:hidden;
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:24px; align-items:center;
  padding:34px 38px; border-radius:var(--radius-lg);
  border:1px solid rgba(74,31,31,0.10);
  background:
    radial-gradient(460px 280px at 88% 20%, rgba(244,180,26,0.34), transparent 65%),
    radial-gradient(380px 240px at 70% 110%, rgba(79,138,59,0.20), transparent 65%),
    linear-gradient(135deg, rgba(255,250,241,0.95), rgba(245,230,204,0.75));
  box-shadow:var(--shadow-soft);
}
.ip-kicker{ margin:0 0 8px; color:var(--green); font-size:13px; font-weight:900; text-transform:uppercase; letter-spacing:1.2px; }
.ip-hero h1{ margin:0; font-size:clamp(32px, 3.6vw, 52px); line-height:1.02; letter-spacing:-1.2px; font-weight:900; }
.ip-hero p{ max-width:660px; margin:14px 0 0; color:var(--text-muted); font-size:17px; line-height:1.6; font-weight:700; }
.ip-mascot{ width:190px; height:190px; border-radius:50%; background:rgba(255,250,241,0.85); display:grid; place-items:center; box-shadow:0 18px 40px rgba(74,31,31,0.16); border:4px solid #fffaf1; font-size:84px; }
.ip-mascot img{ width:150px; height:150px; object-fit:contain; }

.ip-section-title{ margin:40px 0 16px; font-size:clamp(24px, 2.4vw, 32px); line-height:1.05; letter-spacing:-.6px; font-weight:900; }
.ip-lead{ max-width:820px; margin:0 0 6px; color:var(--text-muted); font-size:16px; line-height:1.7; font-weight:600; }

.ip-cards{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:18px; }
.ip-cards.is-four{ grid-template-columns:repeat(4, minmax(0,1fr)); }
/* Ikona stojí vedľa nadpisu, text pod nimi na celú šírku karty. */
.ip-card{
  display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; column-gap:12px; row-gap:10px; padding:24px; border-radius:28px;
  background:#fffaf1; border:1px solid rgba(74,31,31,0.08); box-shadow:0 12px 28px rgba(74,31,31,0.09);
}
.ip-icon{ font-size:26px; line-height:1; }
.ip-card h3{ margin:0; font-size:20px; font-weight:900; line-height:1.2; }
.ip-card p{ grid-column:1 / -1; margin:0; color:var(--text-muted); font-size:14.5px; line-height:1.55; font-weight:600; }

.ip-steps{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:14px; counter-reset:ipstep; list-style:none; margin:0; padding:0; }
.ip-steps li{ position:relative; padding:22px 20px 20px; border-radius:24px; background:rgba(255,250,241,0.85); border:1px solid rgba(74,31,31,0.08); counter-increment:ipstep; }
.ip-steps li::before{ content:counter(ipstep); display:grid; place-items:center; width:38px; height:38px; margin-bottom:12px; border-radius:50%; background:var(--mustard); color:var(--brown); font-weight:900; font-size:17px; }
.ip-steps b{ display:block; font-size:16px; font-weight:900; }
.ip-steps span{ display:block; margin-top:4px; color:var(--text-muted); font-size:14px; line-height:1.5; font-weight:600; }

.ip-cta{
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:20px; align-items:center;
  margin-top:40px; padding:28px 32px; border-radius:28px;
  background:var(--brown); color:var(--cream); box-shadow:0 18px 36px rgba(74,31,31,0.22);
}
.ip-cta h2{ margin:0; font-size:clamp(22px, 2.2vw, 28px); font-weight:900; line-height:1.15; }
.ip-cta p{ margin:8px 0 0; color:rgba(245,230,204,0.8); font-size:15px; line-height:1.55; font-weight:600; }
.ip-cta-buttons{ display:flex; flex-wrap:wrap; gap:10px; }
.ip-btn{ display:inline-flex; align-items:center; gap:8px; padding:12px 20px; border-radius:999px; font-size:15px; font-weight:900; text-decoration:none; background:var(--mustard); color:var(--brown) !important; white-space:nowrap; }
.ip-btn.is-ghost{ background:rgba(245,230,204,0.14); color:var(--cream) !important; }
.ip-btn:hover{ filter:brightness(1.06); }

.ip-note{ margin:18px 0 0; padding:16px 20px; border-radius:20px; background:rgba(244,180,26,0.16); border:1px solid rgba(244,180,26,0.45); font-size:15px; line-height:1.55; font-weight:700; }

@media (max-width: 1100px){
  .ip-cards.is-four, .ip-steps{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width: 860px){
  .ip-hero{ grid-template-columns:1fr; padding:24px 20px; }
  .ip-mascot{ display:none; }
  .ip-cards, .ip-cards.is-four, .ip-steps{ grid-template-columns:1fr; }
  .ip-cta{ grid-template-columns:1fr; padding:24px 20px; }
}