/*
Theme Name: AgroPilot 4.0
Theme URI: https://agropilot.epi.info.pl
Description: Motyw strony Grupy Operacyjnej EPI „AgroPilot AI+Drone – Doradca, Mapy i Rynek 4.0". Koncepcja „Czat z doradcą": hero typograficzny z efektem maszyny do pisania, dymki konwersacyjne jako system treści, karty-wiadomości modułów przewijane w bok, liczniki KPI. Interwencja I.13.5.1 PS WPR 2023–2027.
Author: GO EPI AgroPilot AI+Drone
Version: 1.0.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: agropilot-epi
*/

/* ===== TOKENY ===== */
:root{
  --papier:#FAF7F0;
  --atrament:#212121;
  --kiwi:#7CB518;
  --kiwi-ciemny:#5C8A10;
  --sliwka:#5E548E;
  --sliwka-jasna:#EFEBF7;
  --kiwi-pastel:#EFF6E0;
  --biel:#FFFFFF;
  --szary:#6B6B6B;
  --linia:#E4DFD3;
  --max:1200px;
  --radius:18px;
  --radius-dymek:22px;
  --cien:0 10px 30px rgba(33,33,33,.10);
  --f-mono:'IBM Plex Mono',ui-monospace,'Courier New',monospace;
  --f-sans:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
}

/* ===== FONTY LOKALNE (WOFF2, OFL, latin+latin-ext) ===== */
@font-face{font-family:'IBM Plex Mono';src:url('assets/fonts/ibmplexmono-regular-ext.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'IBM Plex Mono';src:url('assets/fonts/ibmplexmono-regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'IBM Plex Mono';src:url('assets/fonts/ibmplexmono-semibold-ext.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'IBM Plex Mono';src:url('assets/fonts/ibmplexmono-semibold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:'IBM Plex Sans';src:url('assets/fonts/ibmplexsans-regular-ext.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'IBM Plex Sans';src:url('assets/fonts/ibmplexsans-regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'IBM Plex Sans';src:url('assets/fonts/ibmplexsans-semibold-ext.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'IBM Plex Sans';src:url('assets/fonts/ibmplexsans-semibold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap;}

/* ===== RESET / BAZA ===== */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:var(--f-sans);color:var(--atrament);background:var(--papier);line-height:1.65;font-size:17px;-webkit-font-smoothing:antialiased;}
img{max-width:100%;height:auto;display:block;}
a{color:var(--kiwi-ciemny);}
h1,h2,h3{font-family:var(--f-mono);line-height:1.15;letter-spacing:-.01em;}
h2{font-size:clamp(1.7rem,3.4vw,2.5rem);margin:0 0 .6em;}
h3{font-size:1.15rem;margin:0 0 .4em;}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--atrament);color:#fff;padding:.7em 1.2em;z-index:100;}
.skip-link:focus{left:0;}
:focus-visible{outline:3px solid var(--kiwi);outline-offset:2px;}

/* ===== PAS BRANDOWY (tylko znaki) + PAS INFO ===== */
.pas-brand{background:var(--biel);border-bottom:1px solid var(--linia);}
.pas-brand__wnetrze{max-width:var(--max);margin:0 auto;padding:14px 20px;display:flex;justify-content:center;align-items:center;gap:34px;flex-wrap:wrap;}
.pas-brand img{height:52px;width:auto;background:var(--biel);}
.pas-info{background:var(--biel);border-bottom:1px solid var(--linia);}
.pas-info p{max-width:var(--max);margin:0 auto;padding:8px 20px;font-size:.82rem;color:var(--szary);text-align:center;}

/* ===== NAGŁÓWEK ===== */
.naglowek{background:var(--papier);border-bottom:1px solid var(--linia);position:sticky;top:0;z-index:50;}
.naglowek__wnetrze{max-width:var(--max);margin:0 auto;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:20px;}
.naglowek__marka{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--atrament);}
.naglowek__logo{width:44px;height:44px;}
.naglowek__nazwa{font-family:var(--f-mono);font-weight:600;font-size:1.18rem;}
.naglowek__nazwa em{font-style:normal;color:var(--kiwi-ciemny);}
.menu{display:flex;gap:26px;list-style:none;margin:0;padding:0;}
.menu a{text-decoration:none;color:var(--atrament);font-weight:600;font-size:.95rem;}
.menu a:hover{color:var(--kiwi-ciemny);}

/* ===== HERO H2 — typewriter ===== */
.hero{background:var(--biel);overflow:hidden;}
.hero__wnetrze{max-width:var(--max);margin:0 auto;padding:clamp(48px,7vw,96px) 20px;display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,4vw,64px);align-items:center;position:relative;}
.hero__kicker{font-family:var(--f-mono);font-size:.85rem;color:var(--sliwka);margin:0 0 14px;letter-spacing:.04em;}
.hero__h1{font-size:clamp(2.1rem,4.6vw,3.4rem);margin:0 0 .5em;}
.hero__linia-pisana{display:block;min-height:1.2em;color:var(--kiwi-ciemny);}
.hero__kursor{display:inline-block;width:2px;border-right:3px solid var(--kiwi);animation:mruganie 1s steps(1) infinite;margin-left:2px;height:.95em;vertical-align:-.08em;}
@keyframes mruganie{50%{border-color:transparent;}}
.hero__linia-stala{display:block;}
.hero__linia-stala .akcent{color:var(--kiwi-ciemny);}
.hero__h1-pelny{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.hero__lead{font-size:1.12rem;max-width:34em;margin:0 0 26px;}
.hero__cta{display:inline-block;background:var(--kiwi);color:var(--atrament);font-family:var(--f-mono);font-weight:600;text-decoration:none;padding:14px 26px;border-radius:999px;box-shadow:var(--cien);}
.hero__cta:hover{background:var(--kiwi-ciemny);color:#fff;}
.hero__pauza{margin-left:14px;background:none;border:1px solid var(--linia);border-radius:999px;padding:12px 18px;font-family:var(--f-mono);cursor:pointer;color:var(--szary);}
.hero__wizual{position:relative;display:flex;justify-content:center;}
.hero__blob{position:absolute;inset:auto;width:min(120%,520px);aspect-ratio:1;border-radius:46% 54% 55% 45%/48% 44% 56% 52%;background:color-mix(in srgb,var(--kiwi) 12%,white);z-index:0;top:50%;left:50%;transform:translate(-50%,-50%);}
.hero__telefon{position:relative;z-index:1;width:min(78%,340px);filter:drop-shadow(0 18px 34px rgba(33,33,33,.18));}
.hero__klos{position:absolute;z-index:2;width:min(30%,150px);right:-4%;bottom:-6%;transform:rotate(8deg);}

/* ===== SEKCJE WSPÓLNE ===== */
.sekcja{padding:clamp(52px,7vw,92px) 0;}
.sekcja--biala{background:var(--biel);}
.sekcja--pastel{background:var(--kiwi-pastel);}
.sekcja--sliwka{background:var(--sliwka-jasna);}
.sekcja--ciemna{background:linear-gradient(150deg,var(--atrament),#3A3A3A);color:#fff;}
.sekcja--ciemna h2{color:#fff;}
.sekcja__wnetrze{max-width:var(--max);margin:0 auto;padding:0 20px;}
.sekcja__wnetrze--dwie{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(26px,4vw,56px);align-items:center;}
.sekcja__kicker{font-family:var(--f-mono);font-size:.82rem;color:var(--sliwka);letter-spacing:.05em;margin:0 0 8px;text-transform:uppercase;}
.sekcja--ciemna .sekcja__kicker{color:var(--kiwi);}
.podkreslenie{display:block;width:min(300px,62%);height:10px;margin-top:2px;}
.podkreslenie path{stroke:var(--kiwi);stroke-width:4;fill:none;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1s ease .15s;}
.podkreslenie.is-drawn path{stroke-dashoffset:0;}
.media-ramka{border-radius:var(--radius);overflow:hidden;box-shadow:var(--cien);}
.media-ramka img{width:100%;object-fit:cover;}

/* ===== PLACEHOLDER MEDIÓW ===== */
.ph{display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(45deg,#EFEBE0,#EFEBE0 12px,#F7F3E8 12px,#F7F3E8 24px);border:2px dashed var(--linia);border-radius:var(--radius);min-height:240px;color:var(--szary);font-family:var(--f-mono);font-size:.85rem;text-align:center;padding:18px;}

/* ===== DYMKI CZATU (element charakterystyczny) ===== */
.czat{display:flex;flex-direction:column;gap:16px;max-width:640px;}
.dymek{padding:16px 20px;border-radius:var(--radius-dymek);max-width:86%;box-shadow:var(--cien);position:relative;}
.dymek--rolnik{background:var(--sliwka);color:#fff;align-self:flex-start;border-bottom-left-radius:6px;}
.dymek--ai{background:var(--kiwi-pastel);border:1px solid color-mix(in srgb,var(--kiwi) 35%,white);align-self:flex-end;border-bottom-right-radius:6px;}
.dymek__kto{display:block;font-family:var(--f-mono);font-size:.72rem;opacity:.75;margin-bottom:4px;letter-spacing:.05em;}

/* ===== KARTY-WIADOMOŚCI W1–W4 (scroll-snap, WOW d) ===== */
.moduly__pas{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px 4px 22px;scrollbar-color:var(--kiwi) var(--linia);}
.moduly__pas::-webkit-scrollbar{height:8px;}
.moduly__pas::-webkit-scrollbar-thumb{background:var(--kiwi);border-radius:4px;}
.karta-msg{flex:0 0 min(78%,340px);scroll-snap-align:start;background:var(--biel);border:1px solid var(--linia);border-radius:var(--radius-dymek);border-bottom-left-radius:6px;padding:26px;box-shadow:var(--cien);display:flex;flex-direction:column;gap:12px;}
.karta-msg__pikto{width:56px;height:56px;}
.karta-msg__nr{font-family:var(--f-mono);color:var(--sliwka);font-size:.8rem;letter-spacing:.06em;}
.moduly__strzalki{display:flex;gap:10px;margin-top:4px;}
.moduly__strzalka{border:1px solid var(--linia);background:var(--biel);border-radius:999px;width:44px;height:44px;font-size:1.2rem;cursor:pointer;color:var(--atrament);}
.moduly__strzalka:hover{background:var(--kiwi-pastel);}

/* ===== KPI COUNT-UP (WOW b) ===== */
.kpi-siatka{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-top:26px;}
.kpi{background:var(--biel);border-radius:var(--radius);padding:26px 22px;box-shadow:var(--cien);text-align:center;position:relative;}
.kpi__licznik{font-family:var(--f-mono);font-weight:600;font-size:clamp(2rem,4vw,2.8rem);color:var(--kiwi-ciemny);display:block;}
.kpi__opis{font-size:.92rem;color:var(--szary);}
.kpi--sliwka .kpi__licznik{color:var(--sliwka);}
.sekcja--pastel .kpi{border:1px solid color-mix(in srgb,var(--kiwi) 25%,white);}
.kpi-kolba{position:absolute;width:120px;right:-30px;top:-46px;transform:rotate(12deg);pointer-events:none;}

/* ===== SEKCJA APLIKACJA — rotator mockupów (v6.4) ===== */
.sekcja--app .sekcja__wnetrze{max-width:min(1520px,97vw);}
.sekcja__wnetrze--app{display:grid;grid-template-columns:1.55fr .85fr;gap:clamp(24px,3vw,48px);align-items:center;min-height:clamp(460px,52vw,760px);}
.rotator{position:relative;display:flex;justify-content:center;align-items:center;}
.rotator__blob{position:absolute;width:min(88%,760px);aspect-ratio:1;border-radius:52% 48% 44% 56%/46% 58% 42% 54%;background:color-mix(in srgb,var(--sliwka) 10%,white);z-index:0;}
.rotator__scena{position:relative;width:min(104%,1000px);z-index:1;}
.rotator__slajd{opacity:0;visibility:hidden;transition:opacity .6s ease,visibility .6s;position:absolute;inset:0;display:flex;justify-content:center;}
.rotator__slajd.is-active{opacity:1;visibility:visible;position:relative;}
.rotator__slajd img{width:min(100%,430px);filter:drop-shadow(0 22px 40px rgba(33,33,33,.22));}
.rotator__kropki{display:flex;gap:8px;justify-content:center;margin-top:14px;}
.rotator__kropka{width:10px;height:10px;border-radius:50%;background:var(--linia);border:0;padding:0;cursor:pointer;}
.rotator__kropka.is-active{background:var(--kiwi);}
.app-lista{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-direction:column;gap:14px;}
.app-lista li{padding-left:34px;position:relative;}
.app-lista li::before{content:"";position:absolute;left:0;top:.35em;width:20px;height:20px;border-radius:50%;background:var(--kiwi);}
.app-lista li.is-current::before{background:var(--sliwka);}

/* ===== WYCINANKI SEKCYJNE ===== */
.wycinanka-boczna{width:min(46%,220px);position:absolute;pointer-events:none;}
.sekcja--rel{position:relative;overflow:visible;}
.wyc-dron{right:2%;top:-40px;transform:rotate(-6deg);}
.wyc-rzepak{left:-2%;bottom:-30px;transform:rotate(5deg);width:min(36%,180px);}
.wyc-dron-zad{right:0;bottom:-26px;transform:rotate(4deg);width:min(38%,190px);}

/* ===== HARMONOGRAM ===== */
.kamienie{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:14px;}
.kamien{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;background:var(--biel);border-radius:var(--radius);padding:16px 20px;border:1px solid var(--linia);}
.kamien__data{font-family:var(--f-mono);font-size:.85rem;color:var(--szary);white-space:nowrap;}
.badge{font-family:var(--f-mono);font-size:.72rem;padding:5px 12px;border-radius:999px;letter-spacing:.04em;}
.badge--planowane{background:var(--sliwka-jasna);color:var(--sliwka);}
.badge--w-trakcie{background:#FFF3D6;color:#9C6B00;}
.badge--zakonczone{background:var(--kiwi-pastel);color:var(--kiwi-ciemny);}

/* ===== GRUPA ===== */
.grupa-karty{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin-top:24px;}
.grupa-karta{background:var(--biel);border-radius:var(--radius);padding:22px;border:1px solid var(--linia);}
.grupa-karta h3{color:var(--sliwka);}
.adnotacja{font-size:.88rem;color:var(--szary);border-left:4px solid var(--kiwi);padding:10px 16px;background:var(--biel);border-radius:0 var(--radius) var(--radius) 0;margin-top:20px;}

/* ===== FINANSOWANIE ===== */
.finanse-siatka{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:24px;}
.finanse-karta{background:var(--biel);border-radius:var(--radius);padding:24px;text-align:center;border-top:6px solid var(--kiwi);}
.finanse-karta--ue{border-top-color:var(--sliwka);}
.finanse-karta .kwota{font-family:var(--f-mono);font-weight:600;font-size:1.5rem;display:block;}

/* ===== AKTUALNOŚCI ===== */
.wpisy-lista{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px;margin-top:24px;}
.wpis-karta{background:var(--biel);border-radius:var(--radius);padding:26px;border:1px solid var(--linia);display:flex;flex-direction:column;gap:12px;}
.wpis-karta time{font-family:var(--f-mono);font-size:.8rem;color:var(--szary);}
.czytaj-dalej{font-family:var(--f-mono);font-weight:600;text-decoration:none;color:var(--kiwi-ciemny);margin-top:auto;}
.czytaj-dalej:hover{text-decoration:underline;}

/* ===== STOPKA ===== */
.stopka{background:var(--atrament);color:#EDEAE2;padding:44px 0 26px;margin-top:0;}
.stopka__wnetrze{max-width:var(--max);margin:0 auto;padding:0 20px;display:grid;grid-template-columns:1.2fr .8fr;gap:32px;}
.stopka a{color:var(--kiwi);}
.stopka__znaki{display:flex;gap:22px;align-items:center;flex-wrap:wrap;margin-top:16px;}
.stopka__znaki img{height:44px;background:#fff;padding:5px 9px;border-radius:6px;}
.stopka__prawna{max-width:var(--max);margin:26px auto 0;padding:18px 20px 0;border-top:1px solid #3A3A3A;font-size:.8rem;color:#B9B4A8;}

/* ===== REVEAL bazowy (mikro, nie WOW) ===== */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease;}
.reveal.is-in{opacity:1;transform:none;}

/* ===== REDUCED MOTION ===== */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .hero__kursor{animation:none;border-color:transparent;}
  .reveal{opacity:1;transform:none;transition:none;}
  .podkreslenie path{stroke-dashoffset:0;transition:none;}
  .rotator__slajd{transition:none;}
}

/* ===== MOBILE ===== */
@media (max-width:900px){
  .hero__wnetrze{grid-template-columns:1fr;}
  .hero__wizual{order:2;margin-top:14px;}
  .hero__klos{width:min(26%,110px);right:2%;}
  .sekcja__wnetrze--dwie{grid-template-columns:1fr;}
  .sekcja__wnetrze--app{grid-template-columns:1fr;min-height:0;}
  .sekcja__wnetrze--app .rotator{order:2;}
  .rotator__scena{width:min(100%,560px);margin:0 auto;}
  .rotator__slajd img{width:min(88%,420px);}
  .stopka__wnetrze{grid-template-columns:1fr;}
  .wycinanka-boczna{position:static;transform:none;width:min(50%,180px);margin:18px auto 0;}
  .karta-msg{flex-basis:min(86%,320px);}
  .kpi-kolba{display:none;}
  .hero__blob{width:min(100%,420px);}
  .kamien{grid-template-columns:1fr;gap:6px;}
  .kamien__data{white-space:normal;}
  .kamien .badge{justify-self:start;}
}
@media (max-width:480px){
  body{font-size:16px;}
  .pas-brand img{height:40px;}
  .naglowek__wnetrze{flex-wrap:wrap;justify-content:center;gap:8px 16px;padding:10px 14px;}
  .menu{gap:18px;}
  .naglowek__nazwa{font-size:1.05rem;}
}