/* Dodatkowe style portfolio dla Mijsys – bazuje na PaperCSS */
.section-block {
  margin-top: 4rem;
}

/* Hero personalizacja */
.hero-portfolio {
  background: linear-gradient(125deg, var(--paper-bg-alt) 0%, var(--paper-bg) 40%, var(--paper-bg-alt) 100%);
  position: relative;
  overflow: hidden;
}
.hero-portfolio::before {
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 30% 30%, rgba(var(--paper-accent-rgb), .06) 0, transparent 60%),
    linear-gradient(90deg, rgba(var(--paper-accent-rgb), .05), transparent 60%),
    repeating-linear-gradient(-45deg, transparent 0 22px, rgba(var(--paper-accent-rgb), .04) 22px 23px);
  opacity:.35;
  mix-blend-mode:multiply;
  pointer-events:none;
}

/* Sekcja umiejętności */
.skills-grid {
  display:grid;
  gap:1.25rem;
  grid-template-columns: repeat(auto-fit, minmax(240px,1fr));
  margin-top:1.5rem;
}
.skill {
  background: var(--paper-bg-alt);
  border:1px solid var(--paper-border);
  border-radius: var(--paper-radius);
  padding:1rem 1.1rem 1.15rem;
  position:relative;
  overflow:hidden;
}
.skill h4 {
  margin:0 0 .4rem;
  font-size: .95rem;
  letter-spacing: .5px;
  font-weight:600;
}
.skill::after {
  content:"";
  position:absolute;
  right:-14px;
  top:-14px;
  width:64px;
  height:64px;
  background: radial-gradient(circle at 30% 30%, rgba(var(--paper-accent-rgb), 0.18), transparent 60%);
  opacity:.18;
  pointer-events:none;
  transform:rotate(25deg);
}

/* Karty projektów */
.project-card {
  position:relative;
  display:flex;
  flex-direction:column;
  gap:1rem;
}
.project-card h3 {
  margin-top:0;
  margin-bottom:.25rem;
  font-size: clamp(1.15rem, 1rem + .6vw, 1.5rem);
}
.project-badge {
  position:absolute;
  top:-.65rem;
  right:-.5rem;
}
.project-meta {
  list-style:none;
  margin:0;
  padding:0;
  font-size:.75rem;
  display:grid;
  gap:.4rem;
}
.project-meta li strong {
  font-weight:600;
  color: var(--paper-ink-soft);
  margin-right:.25rem;
}
.project-actions {
  margin-top:auto;
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
}

/* Timeline (doświadczenie) */
.timeline {
  position:relative;
  display:flex;
  flex-direction:column;
  gap:2rem;
  margin-top:2rem;
  padding-left:1rem;
}
.timeline::before {
  content:"";
  position:absolute;
  left:.4rem;
  top:0;
  bottom:0;
  width:2px;
  background: linear-gradient(var(--paper-accent), var(--paper-info));
  opacity:.35;
}
.timeline-item {
  position:relative;
  padding-left:1.5rem;
}
.timeline-item::before {
  content:"";
  position:absolute;
  left:-.05rem;
  top:.35rem;
  width:12px;
  height:12px;
  border-radius:50%;
  background: var(--paper-accent);
  box-shadow:0 0 0 3px var(--paper-bg);
  border:1px solid var(--paper-border);
}
.timeline-item .time {
  font-size:.65rem;
  text-transform:uppercase;
  letter-spacing:.75px;
  color: var(--paper-ink-soft);
  margin-bottom:.2rem;
  font-weight:600;
}
.timeline-item h4 {
  margin:.15rem 0 .35rem;
  font-size:1rem;
}

/* CTA sekcja */
.cta-section .card {
  text-align:center;
}

/* Formularz kontaktowy – delikatne modyfikacje */
#contactForm .btn-submit.is-loading {
  filter:saturate(1.2);
}

/* Social */
.social-inline {
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
}

/* Responsywność */
@media (max-width:820px) {
  .project-card { min-height:auto; }
  .timeline { gap:1.5rem; }
}

@media (max-width:640px) {
  .skills-grid { grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); }
  .hero-portfolio h1 { font-size: clamp(1.8rem, 1.5rem + 3vw, 2.6rem); }
}

/* Drobne akcenty */
.section-intro {
  background: var(--paper-highlight);
  border-left:4px solid var(--paper-accent);
  padding:1rem;
  margin:1rem 0 2rem;
  border-radius: var(--paper-radius);
  font-size:.85rem;
  color: var(--paper-ink-soft);
}

.no-js [data-reveal] { opacity:1!important; transform:none!important; }