/* ===== HARD THEME OVERRIDES — CLEAN ===== */

/* Global – jasny motyw wszędzie */
html, body { background:#f8f6f1; color:#222; }

/* Header / Footer */
header, footer{
  background:#f8f6f1; color:#222;
  border-top:1px solid #e6e2d9;
  border-bottom:1px solid #e6e2d9;
}

/* NAV – szary pasek + białe linki */
nav{
  background:#303030; color:#fff;
  border:0; box-shadow:0 2px 8px rgba(0,0,0,.08);
}
nav a{ color:#fff; }
nav a:hover{ color:#ffcc00; }

/* Sekcje domyślnie jasne na wszystkich stronach */
section, main, article, aside,
#home, #about, #articles, #shop, #resources, #contact, #policy, #portfolio {
  background:transparent; color:#222;
}

/* Panele/kafle – PRZYWRÓCONE NA JASNE (wcześniej były ściemnione) */
#portfolio, .portfolio-item,
#categories-of-the-month, .category-item,
#featured-products,
#events, #poll, .modal-content{
  background:#ffffff; color:#222;
  border:1px solid #e7e8eb;
  box-shadow:0 0 10px rgba(0,0,0,.06);
}
#portfolio h2, #portfolio h3,
.category-item h2, .category-item h3,
#events h2, #poll h2, .modal-content h2, .modal-content h3{ color:#111; }
#portfolio p, .category-item p, #events p, #poll p, .modal-content p{ color:#333; }

/* Formularze */
label{ color:#222; }
input, textarea{
  background:#fff; color:#222; border:1px solid #ccc;
}

/* Przyciski (jasny motyw) */
button, .category-item button, #events button, #poll button{
  background:#007acc; color:#fff; border:0;
}
button:hover, .category-item button:hover, #events button:hover, #poll button:hover{
  background:#005f99;
}

/* Artykuły */
.post{ border-bottom:1px solid #ddd; }
.post h2{ color:#111; }
.post p{ color:#333; }

/* Linki do eventów */
#events a{ color:#111; text-decoration:underline; font-weight:600; }
#events a:hover{ color:#333; }

/* ---------- KARTY PRODUKTÓW — CIEMNE TYLKO DLA SKLEPU ---------- */
.product-row .product-item{
  background:#1f1f1f;
  color:#fff;
  border:1px solid #3b3b3b;
  border-radius:12px;
  box-shadow:0 6px 18px rgba(0,0,0,.10);
}
.product-row .product-item h4{ color:#fff; }
.product-row .product-item p{ color:rgba(255,255,255,.88); }
.product-row .product-item img{
  width:100%; height:220px; object-fit:cover; border-radius:10px;
}
.product-row .product-item .add-to-cart{
  background:#0a7bdc; color:#fff; border:0; border-radius:10px; padding:10px 16px; font-weight:700;
}
.product-row .product-item .add-to-cart:hover{ background:#075ea7; }

/* ---------- Talent Spotlight — lżejsza ramka (bez skracania treści) ---------- */
.talent-card{
  display:flex; flex-wrap:wrap; align-items:center; gap:24px;
  background:#fff; color:#000;
  border:3px solid #EF9D8A;       /* było 5px */
  border-radius:12px;
  padding:18px;                    /* było 24px – subtelniej */
  box-shadow:0 4px 14px rgba(0,0,0,.10);
  max-width:1100px; margin:20px auto;
}
.talent-card .half{ flex:1 1 420px; padding:10px; }
.talent-card h3{ margin:0 0 10px; font-size:1.5rem; line-height:1.2; color:#000; text-align:center; }
.talent-card p{ margin:0; line-height:1.6; color:#000; }
.talent-card .half-image{ display:flex; justify-content:center; align-items:center; }
.talent-card .half-image img{
  width:90%; max-width:360px; height:auto; display:block; margin:0 auto; border-radius:8px; object-fit:cover;
}

/* ---------- Quote block (wyśrodkowany, avatar trochę większy) ---------- */
.quote{
  background:#f5f5f5; padding:28px 16px; margin:30px auto;
  border-radius:10px; text-align:center; max-width:1100px;
}
.quote .row{ display:flex; align-items:center; justify-content:center; gap:20px; flex-wrap:wrap; }
.quote-avatar{
  width:120px; height:120px; border-radius:9999px; object-fit:cover;
  box-shadow:0 4px 8px rgba(0,0,0,.2); flex:0 0 auto;
}
.quote .text{ max-width:760px; margin:0 auto; }
.quote .line{
  font-size:22px; font-style:italic; font-weight:800; text-transform:uppercase;
  color:#333; margin:0;
}
.quote .by{ font-size:14px; color:#777; margin:6px 0 0; }
.quote .desc{ font-size:14px; color:#555; margin-top:10px; }
@media (max-width:520px){
  .quote-avatar{ width:100px; height:100px; }
}

/* ---------- Obrazki z width/height – anty-rozciąganie ---------- */
img[width][height]{ height:auto; }

/* ---------- Resources: „Click below…” na środku ---------- */
#resources { text-align:center; }
#resources p { text-align:center; }
#resources ul { padding-left:0; margin:10px 0 0; }
#resources li { display:inline-block; margin:10px 12px; }

/* === KARTY SKLEPU – jak wcześniej (ciemne kafelki) === */
.product-row .product-item{
  background:#1f1f1f !important;
  color:#f2f2f2 !important;
  border:none !important;
  border-radius:8px !important;
  padding:20px !important;
  box-shadow:none !important; /* w poprzedniej wersji nie było cienia */
  text-align:center;
}

/* Tekst w kartach */
.product-row .product-item h4,
.product-row .product-item p{
  color:#f2f2f2 !important;
}

/* Obrazki w kartach */
.product-row .product-item img{
  width:100% !important;
  height:200px !important;
  object-fit:cover !important;
  border-radius:4px !important;
}

/* Przyciski w kartach */
.product-row .product-item .add-to-cart{
  margin-top:10px;
  background:#007acc !important;
  color:#fff !important;
  padding:10px 20px !important;
  border:none !important;
  border-radius:5px !important;
  cursor:pointer;
}
.product-row .product-item .add-to-cart:hover{
  background:#005f99 !important;
}

/* ==== FINAL LIGHT THEME HOTFIX – everywhere light, shop cards dark ==== */

/* Global – wymuś jasne tło/tekst wszędzie */
html, body { background:#f8f6f1 !important; color:#222 !important; }

/* Wszystkie sekcje/kontenery z powrotem jasne */
main, section, article, aside,
header, footer,
.container, .content, .wrap, .page,
.hero, .panel, .card, .post, .article, .article-card,
#home, #about, #articles, #portfolio, #shop, #resources, #contact, #policy,
#events, #poll, .modal-content, .category-item, .portfolio-item {
  background:transparent !important;
  color:#222 !important;
  border-color:#e7e8eb !important;
}

/* Pudełka (panele) – białe wnętrze */
#portfolio, .portfolio-item,
#events, #poll, .modal-content,
.category-item, .post, .card, .panel, .article-card {
  background:#ffffff !important;
  color:#222 !important;
  border:1px solid #e7e8eb !important;
  box-shadow:0 0 10px rgba(0,0,0,.06) !important;
}

/* NAV zostaje ciemny – nie ruszamy */

/* === SKLEP: tylko karty produktów mają być ciemne (jak wcześniej) === */
.product-row .product-item{
  background:#1f1f1f !important;
  color:#f2f2f2 !important;
  border:none !important;
  border-radius:8px !important;
  padding:20px !important;
  box-shadow:none !important;
  text-align:center !important;
}
.product-row .product-item h4,
.product-row .product-item p{ color:#f2f2f2 !important; }
.product-row .product-item img{
  width:100% !important;
  height:200px !important;
  object-fit:cover !important;
  border-radius:4px !important;
}
.product-row .product-item .add-to-cart{
  margin-top:10px !important;
  background:#007acc !important;
  color:#fff !important;
  padding:10px 20px !important;
  border:none !important;
  border-radius:5px !important;
  cursor:pointer !important;
}
.product-row .product-item .add-to-cart:hover{ background:#005f99 !important; }

/* Talent Spotlight – tylko cieńsza ramka, bez zmian treści */
.talent-card{
  background:#fff !important; color:#000 !important;
  border:3px solid #EF9D8A !important;   /* lżej */
  border-radius:12px !important;
  padding:18px !important;
  box-shadow:0 4px 14px rgba(0,0,0,.10) !important;
}

/* Cytat – avatar trochę większy (nie wpływa na tła) */
.quote-avatar{
  width:130px !important; height:130px !important;
  border-radius:9999px; object-fit:cover; box-shadow:0 4px 8px rgba(0,0,0,.2);
}

/* Resources – opis na środku */
#resources, #resources p{ text-align:center !important; }
#resources ul{ padding-left:0 !important; margin:10px 0 0 !important; }
#resources li{ display:inline-block !important; margin:10px 12px !important; }

/* Anty-rozciąganie obrazków z width/height (np. Merchandise) */
img[width][height]{ height:auto !important; }



/* === 0) Montserrat wszędzie === */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700&display=swap');
html, body, h1, h2, h3, h4, h5, h6,
p, a, li, button, input, textarea {
  font-family: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
  letter-spacing: .2px;
}

/* === 1) Globalnie przywróć jasny motyw na podstronach === */
html, body { background:#f8f6f1 !important; color:#222 !important; }
header, footer { background:#f8f6f1 !important; color:#222 !important; }

/* Zbij przypadkowe ciemne tła na sekcjach/podstronach */
#home, #about, #articles, #shop, #resources, #contact, #policy, #portfolio,
section {
  background: transparent !important;
  color:#222 !important;
}

/* === 2) PORTFOLIO – naprawa czytelności boxa z opisem ===
   (łapiemy typowe nazwy kontenerów – jeżeli któryś z nich istnieje,
   box dostanie jasne tło i ciemny tekst) */
#portfolio .panel, #portfolio .card, #portfolio .box,
#portfolio .content, #portfolio .projects-intro, #portfolio .project-panel,
#portfolio [class*="panel"], #portfolio [class*="card"], #portfolio [class*="box"] {
  background:#ffffff !important;
  color:#222 !important;
  border:1px solid #e7e8eb !important;
  box-shadow:0 4px 12px rgba(0,0,0,.06) !important;
}
#portfolio .panel p, #portfolio .panel h1, #portfolio .panel h2, #portfolio .panel h3,
#portfolio .card p,  #portfolio .card h1,  #portfolio .card h2,  #portfolio .card h3 {
  color:#222 !important;
}

/* Na wszelki wypadek – jeżeli coś zostało przyciemnione selektorem z wyższą specyficznością */
#portfolio * { color:inherit !important; }

/* === 3) Obrazki ze stałymi width/height nie będą rozciągane w pionie === */
img[width][height]{ height:auto; }



/* ========== PORTFOLIO: jasny panel pod "Our Projects" ========== */
/* Łapiemy najczęstsze układy: h2 + div/section w sekcji Portfolio */
#portfolio h2 + div,
#portfolio h2 + section,
#portfolio .portfolio-intro,
#portfolio .projects-intro,
#portfolio .project-panel,
#portfolio .panel,
#portfolio .card,
#portfolio .box {
  background:#ffffff !important;
  color:#222 !important;
  border:1px solid #e7e8eb !important;
  box-shadow:0 4px 12px rgba(0,0,0,.06) !important;
}
#portfolio h2 + div *,
#portfolio h2 + section *,
#portfolio .portfolio-intro *,
#portfolio .projects-intro *,
#portfolio .project-panel *,
#portfolio .panel *,
#portfolio .card *,
#portfolio .box * {
  color:inherit !important;
}

/* Dodatkowy bezpiecznik, gdyby strona nie miała #portfolio:
   pierwszy DIV zaraz po nagłówku "Our Projects" też rozjaśnij */
h2:nth-of-type(1)+div[style*="background"],
h2:nth-of-type(1)+div {
  background:#ffffff !important;
  color:#222 !important;
  border:1px solid #e7e8eb !important;
  box-shadow:0 4px 12px rgba(0,0,0,.06) !important;
}

/* ========== PORTFOLIO: wideo na pełną szerokość kontentu ========== */
#portfolio video {
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  border-radius:8px;
}

/* Rozszerz typowe wrappery na 100% szerokości layoutu */
#portfolio .video-wrapper,
#portfolio .video-container,
#portfolio .video-card,
#portfolio .project-video,
#portfolio .media,
#portfolio figure,
#portfolio .video-block {
  width:100% !important;
  max-width:1100px !important;   /* dopasuj do szerokości treści strony */
  margin:0 auto 20px !important;
  background:#fff;               /* jeżeli chcesz białe tło za playerem */
  border:1px solid #e7e8eb;
  border-radius:12px;
  box-shadow:0 4px 12px rgba(0,0,0,.06);
}

/* ========== GLOBALNIE (żeby nic nie przyciemniało z powrotem) ========== */
body, html { background:#f8f6f1 !important; color:#222 !important; }
section { background:transparent !important; color:inherit !important; }


/* Talent Spotlight – lżejsza ramka i odrobinkę mniejsza typografia */
.talent-card{
  border:3px solid #EF9D8A !important;  /* było 5px */
  padding:18px;                          /* było 24px */
  border-radius:12px;
}
.talent-card h3{ font-size:1.35rem; }    /* było 1.5rem */
.talent-card p{  font-size:0.98rem; }



/* Avatar w cytacie – trochę większy */
.quote-avatar{
  width:130px !important;
  height:130px !important;
  border-radius:9999px;
  object-fit:cover;
  box-shadow:0 4px 8px rgba(0,0,0,.2);
  flex:0 0 auto;
}


/* === TALENT SPOTLIGHT — ramka cieńsza, fonty odrobinę mniejsze,
   obrazek BEZ zmniejszania (przywrócony) === */
.talent-card{
  border: 2px solid #EF9D8A !important;  /* cieńsza ramka */
  padding: 16px !important;               /* delikatnie mniejszy padding */
  border-radius: 12px;
  box-shadow: 0 3px 10px rgba(0,0,0,.10) !important;
}

.talent-card h3{
  font-size: 1.35rem !important;          /* było 1.5rem */
}

.talent-card p{
  font-size: 0.98rem !important;          /* odrobinkę mniejsze */
  line-height: 1.6 !important;
}

/* Przywrócenie poprzedniego rozmiaru obrazka (kasuje wcześniejsze pomniejszanie) */
.talent-card .half-image img{
  width: 90% !important;
  max-width: 360px !important;            /* jak wcześniej */
  height: auto !important;
  object-fit: cover !important;
}



/* === CEO avatar – większy, wymuszone nad inline === */
.quote img.quote-avatar{
  width: 140px !important;
  height: 140px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  box-shadow: 0 4px 8px rgba(0,0,0,.2) !important;
}

/* Na telefonach odrobinę mniejszy */
@media (max-width:520px){
  .quote img.quote-avatar{ width:120px !important; height:120px !important; }
}

/* === Talent Spotlight – cieńsza ramka + mniejszy padding i fonty === */
section .talent-card{
  border: 2px solid #EF9D8A !important;   /* 5px -> 2px */
  padding: 16px !important;               /* 24px -> 16px */
  border-radius: 12px !important;
  box-shadow: 0 3px 10px rgba(0,0,0,.10) !important;
}
section .talent-card h3{ font-size: 1.35rem !important; }  /* było ~1.5rem */
section .talent-card p { font-size: 0.98rem !important; }

/* Przywrócenie rozmiaru obrazka w Spotlight (wcześniejsze reguły mogły go zmniejszyć) */
section .talent-card .half-image img{
  width: 90% !important;
  max-width: 360px !important;
  height: auto !important;
  object-fit: cover !important;
}


/* === CEO avatar – większy, wymuszone nad inline === */
.quote img.quote-avatar{
  width: 140px !important;
  height: 140px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  box-shadow: 0 4px 8px rgba(0,0,0,.2) !important;
}

/* Na telefonach odrobinę mniejszy */
@media (max-width:520px){
  .quote img.quote-avatar{ width:120px !important; height:120px !important; }
}

/* Talent Spotlight – zmniejszony obrazek */
#talent-spotlight .talent-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  max-width: 1000px;
  margin: 40px auto;
}

#talent-spotlight .talent-text {
  flex: 1;
  font-size: 0.95rem;
  line-height: 1.5;
}

#talent-spotlight .talent-img {
  flex: 0 0 280px;   /* szerokość kolumny na obrazek */
  text-align: center;
}

#talent-spotlight .talent-img img {
  width: 100%;
  max-width: 260px;  /* obrazek nie większy niż 260px */
  border-radius: 8px;
  object-fit: cover;
}

/* Telefon – obrazek pod tekstem */
@media (max-width: 768px) {
  #talent-spotlight .talent-wrap {
    flex-direction: column;
    text-align: center;
  }
}
