/*

Theme Name: Challenge Landing Theme

Theme URI: https://example.com/

Author: ChatGPT

Description: Lekki motyw landing page z sekcjami: hero, aktualne wyzwania, jak to działa, nagrody, społeczność.

Version: 1.0.0

Tags: landing, one-page, minimal

Text Domain: challenge-landing

*/



/* Reset & base */

*{box-sizing:border-box}html{scroll-behavior:smooth}

body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,'Noto Sans',sans-serif;color:#0f172a;background:#f7fbff}

a{color:#0ea5e9;text-decoration:none}

.container{max-width:1100px;margin:0 auto;padding:0 24px}



/* Hero */

.hero{position:relative;color:#fff;min-height:420px;background:radial-gradient(1200px 400px at 30% 60%,rgba(14,165,233,.35),rgba(14,165,233,0)),#0b2a3f}

.hero__bg{position:absolute;inset:0;background-image:url('assets/hero.jpg');background-size:cover;background-position:center;opacity:.9;mix-blend:normal;filter:saturate(1.05) contrast(1.02)}

.hero__overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,6,23,.2),rgba(2,6,23,.65))}

.hero__content{position:relative;z-index:2;padding:80px 0 40px}

.hero h1{font-size:44px;line-height:1.1;margin:0 0 20px;max-width:640px}

.btn{display:inline-block;background:#0b5cab;color:#fff;padding:14px 22px;border-radius:12px;font-weight:700;box-shadow:0 8px 24px rgba(2,6,23,.25)}

.btn:hover{transform:translateY(-1px)}

.badge-tabs{display:flex;gap:8px;margin:18px 0}

.badge{background:#e2e8f0;color:#1e293b;padding:6px 10px;border-radius:10px;font-size:13px}

.badge--active{background:#0ea5e9;color:#fff}



/* Menu */

.main-nav {

  background:#fff;

  border-bottom:1px solid #e2e8f0;

  margin-top:-12px; 

  margin-bottom:24px;

  padding:12px 0;

}



.main-nav .menu {

  display:flex;

  justify-content:center;   /* wyrównanie na środku */

  gap:32px;                 /* odstępy między elementami */

  list-style:none;

  margin:0;

  padding:0;

}



.main-nav .menu li {

  flex:0 0 auto;            /* każdy element ma szerokość wg treści */

}



.main-nav .menu li a {

  color:#0f172a;

  font-weight:600;

  text-decoration:none;

  padding:6px 10px;

  border-radius:6px;

  transition:background .2s,color .2s;

}



.main-nav .menu li a:hover {

  background:#0ea5e9;

  color:#fff;

}







/* Card grid */

.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:24px 0}

.card{background:#fff;border-radius:16px;box-shadow:0 10px 30px rgba(2,6,23,.08);overflow:hidden;border:1px solid #e2e8f0}

.card__thumb{background:#dbeafe;padding:12px}

.card__thumb img{width:100%;border-radius:12px;display:block}

.card__body{padding:14px 16px 18px}

.card h3{margin:2px 0 6px;font-size:18px;color:#0f172a}

.card p{margin:0 0 10px;color:#475569}

.card .btn{width:100%;text-align:center;border-radius:10px;background:#0b5cab}



/* How it works */

.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:8px 0}

.step{display:flex;flex-direction:column;align-items:center;text-align:center;background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:18px;gap:10px;box-shadow:0 10px 24px rgba(2,6,23,.05)}

.step img{width:56px;height:56px}

.section{background:#fff;border-radius:18px;padding:24px;margin-top:24px;border:1px solid #e2e8f0;box-shadow:0 10px 30px rgba(2,6,23,.06)}

.section h2{margin:0 0 12px;font-size:24px}



/* Rewards */

.rewards{display:grid;grid-template-columns:1fr 240px 240px;gap:24px;align-items:center}



/* Community */

.community{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}

.avatar-card{display:flex;gap:12px;align-items:center;background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:12px}

.avatar-card img{width:64px;height:64px;border-radius:12px}



/* Footer */

/* .site-footer{padding:40px 0;color:#475569}

@media (max-width:960px){

  .cards,.steps,.community{grid-template-columns:1fr 1fr}

  .rewards{grid-template-columns:1fr 1fr}

  .hero h1{font-size:36px}

}

@media (max-width:640px){

  .cards,.steps,.community{grid-template-columns:1fr}

  .hero{min-height:380px}

  .hero h1{font-size:30px}

}

*/





.site-footer.fx-dark{

  background: radial-gradient(circle at 30% 0%, rgba(14,165,233,.08), transparent 70%), #0a0f1c;

  color:#e2e8f0;

  padding:40px 0 20px;

  border-top:3px solid #0ea5e9;

  margin-top:40px;

}



.footer-grid{

  display:grid; grid-template-columns:1.2fr 1fr 1fr 1fr;

  gap:32px; margin-bottom:24px;

}



.footer-col h4{ color:#fff; margin:0 0 12px; font-size:18px; }

.footer-col p{ color:#94a3b8; }



.footer-menu{ list-style:none; margin:0; padding:0; display:grid; gap:6px; }

.footer-menu a{ color:#94a3b8; text-decoration:none; transition:color .2s; }

.footer-menu a:hover{ color:#0ea5e9; }



.footer-socials{ display:flex; gap:12px; margin-bottom:14px; }

.soc{ width:36px; height:36px; border-radius:50%; background:#1e293b; display:inline-block; position:relative; }

.soc:hover{ background:#0ea5e9; box-shadow:0 0 12px #0ea5e9; }



.newsletter{ display:flex; gap:8px; }

.newsletter input{

  flex:1; padding:10px; border-radius:8px; border:0; background:#1e293b; color:#e2e8f0;

}

.newsletter button{

  background:#0ea5e9; border:0; padding:10px 14px; border-radius:8px;

  color:#fff; font-weight:600; cursor:pointer; transition:0.2s;

}

.newsletter button:hover{ background:#0b5cab; }



.footer-bottom{

  border-top:1px solid #1e293b;

  text-align:center;

  color:#64748b;

  padding-top:12px;

  font-size:14px;

}



@media(max-width:768px){

  .footer-grid{ grid-template-columns:1fr 1fr; }

}

@media(max-width:480px){

  .footer-grid{ grid-template-columns:1fr; text-align:center; }

  .newsletter{ flex-direction:column; }

}



/* Blog */



.wyzwania-grid{display:grid;grid-template-columns:2fr 1fr;gap:32px;}

.challenge-card{display:flex;gap:16px;background:#f8fafc;padding:12px;border-radius:10px;margin-bottom:16px;}

.challenge-card .thumb img{width:180px;height:120px;object-fit:cover;border-radius:8px;}

.challenge-card .body{flex:1;}

.challenge-card .title{margin:0;font-size:18px;color:#0f172a;}

.challenge-card .excerpt{font-size:14px;color:#334155;}

.challenge-card .btn{display:inline-block;background:#0b5cab;color:#fff;padding:6px 12px;border-radius:6px;text-decoration:none;}

.wyzwania-sidebar select{width:100%;margin-bottom:12px;padding:8px;}

#load-more{cursor:pointer;text-align:center;background:#0ea5e9;color:#fff;padding:10px 16px;border-radius:6px;margin-top:16px;}


/* === Dark Elegant+ Footer Enhancements (retry) === */
.site-footer.fx-dark {
  background: radial-gradient(circle at 30% 0%, rgba(14,165,233,.08), transparent 70%), #0a0f1c;
  color:#e2e8f0;
  margin-top:40px;
  border-top:3px solid #0ea5e9;
  position:relative;
  z-index:3;
}
.site-footer .footer-grid { display:grid; gap:32px; grid-template-columns:1.2fr 1fr 1fr 1fr; }
.site-footer .footer-col h4 { color:#fff; margin:0 0 12px; font-size:18px; }
.site-footer .footer-menu { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.site-footer .footer-menu a { color:#94a3b8; text-decoration:none; transition:color .2s; }
.site-footer .footer-menu a:hover { color:#0ea5e9; }
.site-footer .footer-socials { display:flex; gap:12px; margin-bottom:14px; }
.soc { width:36px; height:36px; border-radius:50%; background:#1e293b; display:inline-block; position:relative; box-shadow:inset 0 0 4px rgba(255,255,255,.05); }
.soc:hover { background:#0ea5e9; box-shadow:0 0 10px #0ea5e9; }
.site-footer .footer-bottom { border-top:1px solid #1e293b; text-align:center; color:#64748b; padding:12px 0; font-size:14px; }
.hero__ornament{ pointer-events:none; z-index:2; }
@media(max-width:768px){ .site-footer .footer-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:480px){ .site-footer .footer-grid{ grid-template-columns:1fr; text-align:center; } }