/*
Theme Name: matyjas.net
Theme URI: https://matyjas.net/
Author: matyjas.net
Description: Lekki dwujęzyczny motyw blokowy dla matyjas.net. Bez Elementora i zewnętrznych fontów.
Version: 1.1.8
Requires at least: 6.0
Requires PHP: 7.2
Text Domain: matyjas-net
*/

:root {
  --mn-navy-950: #071426;
  --mn-navy-900: #0a1c33;
  --mn-navy-800: #102945;
  --mn-blue-700: #0756a4;
  --mn-blue-500: #1e73be;
  --mn-cyan-400: #34b6e4;
  --mn-ink: #142033;
  --mn-muted: #5d6a7b;
  --mn-line: #dbe4ee;
  --mn-soft: #f3f7fb;
  --mn-white: #fff;
  --mn-radius: 18px;
  --mn-shadow: 0 18px 50px rgba(7, 20, 38, .12);
}

html { scroll-behavior: smooth; }
body {
  background: var(--mn-white);
  color: var(--mn-ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}

img { height: auto; }
a { text-underline-offset: .2em; }
.mn-shell { overflow: clip; }
.mn-container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.mn-section { padding: clamp(64px, 8vw, 112px) 0; }
.mn-section--soft { background: var(--mn-soft); }
.mn-section--dark { background: var(--mn-navy-950); color: var(--mn-white); }
.mn-eyebrow {
  color: var(--mn-blue-500);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .13em;
  margin: 0 0 14px;
  text-transform: uppercase;
}
.mn-section--dark .mn-eyebrow { color: #75d7f7; }
.mn-section-title {
  font-size: clamp(2rem, 4vw, 3.45rem);
  line-height: 1.05;
  margin: 0 0 20px;
  max-width: 18ch;
}
.mn-lead {
  color: var(--mn-muted);
  font-size: clamp(1.05rem, 1.7vw, 1.25rem);
  line-height: 1.7;
  max-width: 68ch;
}
.mn-section--dark .mn-lead { color: #c5d3e3; }

.mn-header {
  background: rgba(7, 20, 38, .97);
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  position: sticky;
  top: 0;
  z-index: 50;
}
.mn-header__inner {
  align-items: center;
  display: flex;
  gap: 28px;
  justify-content: space-between;
  min-height: 78px;
  position: relative;
}
.mn-logo { display: block; flex: 0 1 320px; line-height: 0; }
.mn-logo img { height: auto; max-width: 300px; width: 100%; }
.mn-nav { align-items: center; display: flex; flex-wrap: wrap; gap: 8px 20px; justify-content: flex-end; padding-right: 70px; }
.mn-nav a { color: #e9f1f8; font-size: .92rem; font-weight: 700; text-decoration: none; }
.mn-nav a:hover, .mn-nav a:focus-visible { color: #75d7f7; }
.mn-lang {
  align-items: center;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 999px;
  color: #e9f1f8;
  display: inline-flex;
  font-size: .72rem;
  font-weight: 800;
  gap: 5px;
  line-height: 1;
  padding: 5px 8px;
  position: absolute;
  right: 0;
  text-decoration: none;
  top: 8px;
}
.mn-lang:hover, .mn-lang:focus-visible { border-color: #75d7f7; color: #75d7f7; }
.mn-flag {
  background: #fff;
  border: 1px solid #8b98a8;
  border-radius: 2px;
  box-sizing: content-box;
  display: block;
  flex: 0 0 auto;
  height: 12px;
}
.mn-flag--pl { width: 19.2px; }
.mn-flag--de { width: 20px; }

.mn-hero {
  background:
    radial-gradient(circle at 12% 22%, rgba(30, 115, 190, .34), transparent 28%),
    linear-gradient(135deg, var(--mn-navy-950), var(--mn-navy-800));
  color: var(--mn-white);
  padding: clamp(72px, 9vw, 132px) 0;
}
.mn-hero__grid { align-items: start; display: grid; gap: clamp(34px, 4vw, 58px); grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
.mn-hero__copy { min-width: 0; position: relative; z-index: 1; }
.mn-hero h1 { font-size: clamp(2.65rem, 4vw, 4.1rem); hyphens: auto; letter-spacing: -.045em; line-height: .98; margin: 0 0 24px; overflow-wrap: anywhere; }
.mn-hero p { color: #c8d6e6; font-size: clamp(1.05rem, 1.7vw, 1.28rem); line-height: 1.65; margin: 0 0 30px; max-width: 58ch; }
.mn-hero__media { border: 1px solid rgba(255,255,255,.16); border-radius: 22px; box-shadow: 0 28px 80px rgba(0,0,0,.28); justify-self: end; min-width: 0; overflow: hidden; transform: translate(18px, -36px); width: 100%; }
.mn-hero__media img { aspect-ratio: 16 / 10; display: block; object-fit: cover; width: 100%; }
.mn-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.mn-button {
  background: var(--mn-blue-500);
  border: 2px solid var(--mn-blue-500);
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  font-weight: 800;
  padding: 13px 20px;
  text-decoration: none;
}
.mn-button:hover, .mn-button:focus-visible { background: #2b87d5; border-color: #2b87d5; color: #fff; }
.mn-button--ghost { background: transparent; border-color: rgba(255,255,255,.45); }
.mn-button--ghost:hover, .mn-button--ghost:focus-visible { background: rgba(255,255,255,.1); border-color: #fff; }

.mn-service-grid { display: grid; gap: 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 42px; }
.mn-card {
  background: #fff;
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius);
  box-shadow: 0 8px 28px rgba(7, 20, 38, .06);
  min-height: 100%;
  padding: 26px;
}
.mn-card--primary { background: var(--mn-navy-900); border-color: var(--mn-navy-900); color: #fff; }
.mn-card__number { color: var(--mn-blue-500); font-size: .78rem; font-weight: 900; letter-spacing: .1em; }
.mn-card--primary .mn-card__number { color: #75d7f7; }
.mn-card h3 { font-size: 1.3rem; margin: 0 0 10px; }
.mn-card p { color: var(--mn-muted); line-height: 1.65; margin: 0; }
.mn-card--primary p { color: #c5d3e3; }

.mn-feature-grid { align-items: center; display: grid; gap: clamp(38px, 7vw, 90px); grid-template-columns: 1fr 1fr; }
.mn-feature-media { border-radius: 24px; box-shadow: var(--mn-shadow); overflow: hidden; }
.mn-feature-media img { aspect-ratio: 4 / 3; display: block; object-fit: cover; width: 100%; }
.mn-checks { list-style: none; margin: 28px 0 0; padding: 0; }
.mn-checks li { border-top: 1px solid var(--mn-line); padding: 14px 0 14px 30px; position: relative; }
.mn-checks li::before { color: var(--mn-blue-500); content: "✓"; font-weight: 900; left: 0; position: absolute; }
.mn-tools { border-left: 3px solid var(--mn-blue-500); color: var(--mn-muted); line-height: 1.8; margin: 28px 0 0; padding-left: 20px; }

.mn-proof { align-items: center; display: grid; gap: clamp(38px, 7vw, 90px); grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.mn-real-photo { border-radius: 22px; margin: 0; min-width: 0; overflow: hidden; }
.mn-real-photo img { display: block; width: 100%; }
.mn-real-photo--inline { margin-top: 24px; }
.mn-real-photo--inline img { aspect-ratio: 16 / 9; object-fit: cover; }

.mn-process-grid { counter-reset: step; display: grid; gap: 18px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 42px; }
.mn-step { border-left: 3px solid var(--mn-blue-500); padding: 4px 18px 8px 22px; }
.mn-step::before { color: var(--mn-blue-500); content: "0" counter(step); counter-increment: step; display: block; font-size: .82rem; font-weight: 900; margin-bottom: 18px; }
.mn-step h3 { font-size: 1.2rem; margin: 0 0 8px; }
.mn-step p { color: var(--mn-muted); line-height: 1.6; margin: 0; }

.mn-portraits { display: grid; gap: 20px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 42px; }
.mn-person { background: #fff; border: 1px solid var(--mn-line); border-radius: var(--mn-radius); overflow: hidden; }
.mn-person img { aspect-ratio: 4 / 5; display: block; object-fit: cover; width: 100%; }
.mn-person__caption { padding: 20px 22px 24px; }
.mn-person__role { color: var(--mn-blue-500); font-size: .78rem; font-weight: 900; letter-spacing: .1em; margin: 0 0 6px; text-transform: uppercase; }
.mn-person h3 { font-size: 1.25rem; margin: 0; }

.mn-equipment { display: grid; gap: 18px; grid-template-columns: repeat(5, minmax(0, 1fr)); margin-top: 36px; }
.mn-equipment__item { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14); border-radius: 14px; padding: 22px; }
.mn-equipment__item strong { display: block; font-size: 1.15rem; margin-bottom: 8px; }
.mn-equipment__item span { color: #bdcad9; font-size: .92rem; line-height: 1.5; }
.mn-equipment-photo { border-radius: 22px; margin-top: 38px; max-width: 820px; overflow: hidden; }
.mn-equipment-photo img { display: block; width: 100%; }
.mn-equipment-photo figcaption { background: #0d223a; color: #c5d3e3; font-size: .9rem; padding: 12px 16px; }

.mn-contact-grid { display: grid; gap: clamp(36px, 7vw, 88px); grid-template-columns: .8fr 1.2fr; }
.mn-contact-form { background: #fff; border: 1px solid var(--mn-line); border-radius: var(--mn-radius); box-shadow: var(--mn-shadow); padding: clamp(24px, 4vw, 42px); }
.mn-form-row { display: grid; gap: 8px; margin-bottom: 18px; }
.mn-form-row label { font-size: .9rem; font-weight: 800; }
.mn-form-row input, .mn-form-row textarea {
  background: #fff;
  border: 1px solid #bac8d7;
  border-radius: 10px;
  color: var(--mn-ink);
  font: inherit;
  padding: 12px 14px;
  width: 100%;
}
.mn-form-row input:focus, .mn-form-row textarea:focus { border-color: var(--mn-blue-500); box-shadow: 0 0 0 3px rgba(30,115,190,.16); outline: 0; }
.mn-form-consent { align-items: flex-start; display: flex; font-size: .88rem; gap: 10px; line-height: 1.5; margin: 0 0 20px; }
.mn-form-consent input { margin-top: 3px; }
.mn-honeypot { left: -9999px; position: absolute; }
.mn-form-status { border-radius: 10px; font-weight: 700; margin-bottom: 18px; padding: 12px 14px; }
.mn-form-status--success { background: #e7f7ec; color: #176b34; }
.mn-form-status--error { background: #fff0ef; color: #9b2c24; }

.mn-footer { background: #050e1a; color: #aebdcd; padding: 34px 0; }
.mn-footer__inner { align-items: center; display: flex; gap: 24px; justify-content: space-between; }
.mn-footer p { margin: 0; }
.mn-footer a { color: #e8f1f9; }

@media (max-width: 980px) {
  .mn-header__inner { align-items: flex-start; flex-direction: column; padding-block: 18px; }
  .mn-logo { flex-basis: auto; max-width: 240px; }
  .mn-nav { justify-content: flex-start; padding-right: 0; }
  .mn-lang { top: 12px; }
  .mn-hero__grid, .mn-feature-grid, .mn-contact-grid { grid-template-columns: 1fr; }
  .mn-proof { grid-template-columns: 1fr; }
  .mn-hero__media { max-width: 760px; transform: none; }
  .mn-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mn-process-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mn-equipment { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .mn-container { width: min(100% - 28px, 1180px); }
  .mn-section { padding-block: 58px; }
  .mn-header { position: static; }
  .mn-nav { gap: 10px 14px; }
  .mn-nav a { font-size: .84rem; }
  .mn-hero { padding-block: 64px; }
  .mn-hero h1 { font-size: clamp(2.45rem, 13vw, 4rem); overflow-wrap: anywhere; }
  .mn-hero__grid { gap: 34px; }
  .mn-service-grid, .mn-process-grid, .mn-portraits, .mn-equipment { grid-template-columns: 1fr; }
  .mn-person { max-width: 430px; }
  .mn-footer__inner { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 380px) {
  .mn-logo { max-width: 205px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}