:root{
  --paper:#f5f3ee;
  --paper2:#faf9f6;
  --white:#ffffff;
  --ink:#202731;
  --muted:#69717b;
  --blue:#496d8f;
  --blue2:#7895ad;
  --blue-soft:#e9eff3;
  --line:#dfe3e5;
  --max:1160px;
}

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

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:Inter,Arial,sans-serif;
  line-height:1.6;
}

a{color:inherit;text-decoration:none}
.wrap{width:min(calc(100% - 42px),var(--max));margin:auto}

.topbar{
  position:sticky;
  top:0;
  z-index:30;
  background:rgba(245,243,238,.92);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(32,39,49,.08);
}

.nav{
  min-height:78px;
  display:flex;
  align-items:center;
  gap:30px;
}

.brand{
  display:flex;
  flex-direction:column;
  line-height:1;
}

.brand strong{
  font:700 18px Manrope,sans-serif;
  letter-spacing:.02em;
}

.brand small{
  margin-top:7px;
  color:#858b91;
  font-size:8px;
  letter-spacing:.2em;
}

.nav nav{
  margin-left:auto;
  display:flex;
  gap:26px;
  font-size:14px;
  color:#515a64;
}

.nav nav a:hover{color:var(--blue)}

.hero{
  padding:125px 0 110px;
  background:
    radial-gradient(circle at 85% 10%,rgba(73,109,143,.12),transparent 28%),
    linear-gradient(180deg,var(--paper2),var(--paper));
}

.hero-grid{
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:80px;
  align-items:center;
}

.eyebrow,.section-tag{
  color:var(--blue);
  font-size:11px;
  letter-spacing:.18em;
  font-weight:800;
  text-transform:uppercase;
}

h1,h2,h3{
  font-family:Manrope,sans-serif;
  line-height:1.04;
  margin:0;
}

h1{
  margin:18px 0 28px;
  font-size:clamp(56px,7vw,94px);
  letter-spacing:-.06em;
}

h1 em,h2 em{
  font-style:normal;
  color:var(--blue);
}

.lead{
  max-width:760px;
  color:#505a65;
  font-size:21px;
}

.actions{
  display:flex;
  gap:12px;
  margin-top:32px;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:14px 20px;
  border-radius:999px;
  font-weight:700;
  font-size:14px;
}

.primary{
  background:var(--ink);
  color:white;
}

.primary:hover{background:var(--blue)}

.secondary{
  border:1px solid #c9ced1;
  background:rgba(255,255,255,.65);
}

.secondary:hover{border-color:var(--blue);color:var(--blue)}

.profile-card{
  padding:34px;
  background:rgba(255,255,255,.7);
  border:1px solid rgba(73,109,143,.16);
  border-radius:24px;
  box-shadow:0 20px 55px rgba(45,55,65,.06);
}

.profile-mark{
  width:70px;
  height:70px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--blue-soft);
  color:var(--blue);
  font:800 22px Manrope,sans-serif;
  margin-bottom:28px;
}

.profile-card>span{
  display:block;
  color:#8a9299;
  font-size:10px;
  letter-spacing:.16em;
}

.profile-card strong{
  display:block;
  margin:8px 0 10px;
  font:700 26px Manrope,sans-serif;
}

.profile-card p{color:#68717a}
.profile-card a{color:var(--blue);font-weight:700}

.section{padding:100px 0}

.split{
  display:grid;
  grid-template-columns:.35fr .65fr;
  gap:70px;
}

.section h2{
  margin:12px 0 26px;
  font-size:clamp(42px,5vw,68px);
  letter-spacing:-.045em;
}

.big{
  margin-top:0;
  color:#3f4852;
  font-size:23px;
}

.split p:not(.big){color:var(--muted)}

.projects{
  background:var(--white);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.section-head{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:60px;
  margin-bottom:46px;
}

.section-head>p{
  max-width:420px;
  color:var(--muted);
}

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

.card{
  position:relative;
  min-height:275px;
  padding:30px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fcfcfb;
  transition:.25s ease;
}

.card:hover{
  transform:translateY(-4px);
  border-color:#aebfcb;
  box-shadow:0 14px 34px rgba(43,55,65,.06);
}

.card.main-card{
  background:#2c3640;
  color:white;
  border-color:#2c3640;
}

.index{
  position:absolute;
  right:24px;
  top:21px;
  color:#9aa1a6;
  font-size:11px;
}

.pill{
  display:inline-block;
  margin-bottom:28px;
  padding:6px 9px;
  border-radius:999px;
  background:var(--blue-soft);
  color:var(--blue);
  font-size:10px;
  font-weight:700;
}

.main-card .pill{
  background:rgba(255,255,255,.1);
  color:#dce7ef;
}

.card h3{
  font-size:31px;
  letter-spacing:-.03em;
}

.card p{
  max-width:510px;
  color:#68727a;
}

.main-card p{color:#c6ced4}

.card i{
  position:absolute;
  left:30px;
  bottom:26px;
  color:var(--blue);
  font-style:normal;
  font-weight:700;
  font-size:13px;
}

.main-card i{color:white}

.focus{background:#eef1f2}

.focus-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  margin-top:30px;
}

.focus-grid article{
  padding:26px;
  border-radius:18px;
  background:rgba(255,255,255,.7);
  border:1px solid #dce1e3;
}

.focus-grid span{
  color:var(--blue);
  font-size:10px;
}

.focus-grid h3{
  margin:18px 0 8px;
  font-size:22px;
}

.focus-grid p{
  margin:0;
  color:#69737a;
  font-size:14px;
}

.contact{
  background:#e7ecef;
}

.contact-box{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:70px;
  align-items:center;
  padding:55px;
  border:1px solid #d0d8dd;
  border-radius:26px;
  background:rgba(255,255,255,.58);
}

.contact-box p{color:#69737a}

.contact-data{
  padding-left:45px;
  border-left:1px solid #c8d0d5;
  display:flex;
  flex-direction:column;
  gap:13px;
}

.contact-data a{
  font-size:18px;
  font-weight:700;
}

.contact-data a:hover{color:var(--blue)}

footer{
  padding:28px 0;
  background:#f7f6f2;
  border-top:1px solid var(--line);
  color:#788087;
}

.footer{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:30px;
  align-items:center;
  font-size:11px;
}

.footer>div{
  display:flex;
  flex-direction:column;
}

.footer strong{color:#3d454d}

.footer nav{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px 18px;
}

.footer nav a:hover{color:var(--blue)}

@media(max-width:850px){
  .nav nav{display:none}
  .hero-grid,.split,.contact-box{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .focus-grid{grid-template-columns:1fr 1fr}
  .contact-data{
    padding:28px 0 0;
    border-left:0;
    border-top:1px solid #c8d0d5;
  }
  .footer{grid-template-columns:1fr}
  .footer nav{justify-content:flex-start}
}

@media(max-width:560px){
  .wrap{width:min(calc(100% - 26px),var(--max))}
  .hero{padding:90px 0 75px}
  .section{padding:72px 0}
  h1{font-size:14vw}
  .section-head{display:block}
  .actions{flex-direction:column}
  .btn{text-align:center}
  .focus-grid{grid-template-columns:1fr}
  .contact-box{padding:28px 22px}
}

/* V3 - poprawiona widoczność nazwy w nagłówku */
.topbar .brand strong{
  color:#f7f8f8 !important;
  font-family:Manrope,Inter,sans-serif !important;
  font-size:19px !important;
  font-weight:800 !important;
  letter-spacing:.035em !important;
  text-shadow:0 1px 0 rgba(0,0,0,.15);
}

.topbar .brand strong::after{
  content:"";
  display:inline-block;
  width:7px;
  height:7px;
  margin-left:8px;
  border-radius:50%;
  background:#6f91ad;
  vertical-align:middle;
}

.topbar .brand small{
  color:#b9c2c8 !important;
  font-size:8px !important;
  letter-spacing:.22em !important;
}

.topbar{
  background:#111916 !important;
}

.topbar .nav nav{
  color:#e1e6e3 !important;
}

.topbar .nav nav a:hover{
  color:#8eacc3 !important;
}

@media(max-width:560px){
  .topbar .brand strong{font-size:16px !important}
  .topbar .brand small{font-size:7px !important;letter-spacing:.16em !important}
}

/* V4 — kolory marek na kaflach projektów */
.card{
  --brand:#496d8f;
  --brand-soft:#e9eff3;
  --brand-dark:#2f465c;
  position:relative;
}

.card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:var(--brand);
  opacity:.78;
}

.card .pill{
  background:var(--brand-soft);
  color:var(--brand-dark);
}

.card i{
  color:var(--brand);
}

.card:hover{
  border-color:color-mix(in srgb,var(--brand) 45%, #dfe3e5);
  box-shadow:0 14px 34px color-mix(in srgb,var(--brand) 12%, transparent);
}

.card:hover h3{
  color:var(--brand-dark);
}

/* GreenForge — kolory z identyfikacji */
.brand-greenforge{
  --brand:#43ef75;
  --brand-soft:rgba(67,239,117,.11);
  --brand-dark:#159844;
  background:linear-gradient(145deg,#101a15,#15231b);
  border-color:#244e34;
}
.brand-greenforge::before{width:5px}
.brand-greenforge .pill{
  background:rgba(67,239,117,.11);
  color:#9affb6;
}
.brand-greenforge h3{color:#ffffff}
.brand-greenforge p{color:#c4cec8}
.brand-greenforge i{color:#63f38a}
.brand-greenforge:hover h3{color:#7cff9d}

/* GreenSoftware — zielony + grafit */
.brand-greensoftware{
  --brand:#32d96b;
  --brand-soft:#e9f8ee;
  --brand-dark:#168843;
}

/* SmartHomeExpert — morski / niebiesko-zielony */
.brand-smarthome{
  --brand:#2aa59a;
  --brand-soft:#e7f4f2;
  --brand-dark:#19766f;
}

/* SP9SMT — chłodny techniczny niebieski */
.brand-sp9smt{
  --brand:#477cb3;
  --brand-soft:#e9f0f7;
  --brand-dark:#315b85;
}

/* KursStrzelania — oliwkowy, spokojny i odrębny */
.brand-kurs{
  --brand:#7d8b4e;
  --brand-soft:#f0f2e7;
  --brand-dark:#5c6838;
}

@media(max-width:560px){
  .card::before{width:3px}
}

/* V5 — pełne logo GreenForge + SEO/content sections */
.greenforge-logo-wrap{
  display:inline-flex;
  align-items:center;
  padding:11px 14px;
  margin-bottom:26px;
  background:#0c1713;
  border-radius:12px;
  border:1px solid rgba(67,239,117,.15);
}
.greenforge-wordmark{
  display:block;
  width:min(100%,267px);
  height:auto;
}
.profile-card .profile-title{
  margin:8px 0 10px;
  font-family:Manrope,sans-serif;
  font-size:22px;
  letter-spacing:-.025em;
  line-height:1.2;
}
.profile-card>span{
  margin-top:1px;
}

.method{
  background:#f8f7f3;
  border-top:1px solid var(--line);
}
.method-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:34px;
}
.method-grid article{
  padding:26px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
}
.method-grid article>span{
  color:var(--blue);
  font-size:10px;
  font-weight:800;
}
.method-grid h3{
  margin:18px 0 9px;
  font-size:21px;
}
.method-grid p{
  margin:0;
  color:#69737a;
  font-size:14px;
}

.context{
  background:#fff;
}
.context-grid{
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  gap:75px;
}
.context-copy p{
  margin:0 0 18px;
  color:#626d74;
}
.context-copy a{
  color:var(--blue);
  font-weight:700;
}

.faq{
  background:#eef1f2;
}
.faq> .wrap > h2{
  margin-top:12px;
}
.faq-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:30px;
}
.faq-grid article{
  padding:25px;
  background:rgba(255,255,255,.76);
  border:1px solid #dce1e3;
  border-radius:18px;
}
.faq-grid h3{
  margin:0 0 10px;
  font-size:18px;
}
.faq-grid p{
  margin:0;
  color:#69737a;
  font-size:14px;
}
.faq-grid a{
  color:var(--blue);
  font-weight:700;
}

@media(max-width:850px){
  .method-grid,.faq-grid,.context-grid{grid-template-columns:1fr}
}

.footer{grid-template-columns:auto 1fr 1fr auto}
.footer-nav,.footer-brands{display:flex;flex-wrap:wrap;gap:8px 14px;justify-content:center}
@media(max-width:850px){
  .footer{grid-template-columns:1fr}
  .footer-nav,.footer-brands{justify-content:flex-start}
}

/* V6 — doświadczenie osobiste */
.personal-experience{
  background:#e9eef1;
  border-top:1px solid #d8dfe3;
  border-bottom:1px solid #d8dfe3;
}
.personal-experience-grid{
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:70px;
  align-items:start;
}
.personal-experience .big{
  color:#4b5761;
  font-size:19px;
}
.experience-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.experience-list article{
  padding:22px;
  background:rgba(255,255,255,.78);
  border:1px solid #d6dee2;
  border-radius:16px;
}
.experience-list article.wide{grid-column:1 / -1}
.experience-list article>span{
  color:var(--blue);
  font-size:10px;
  font-weight:800;
}
.experience-list h3{
  margin:14px 0 7px;
  font-size:19px;
}
.experience-list p{
  margin:0;
  color:#69737a;
  font-size:14px;
}
@media(max-width:850px){
  .personal-experience-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
  .experience-list{grid-template-columns:1fr}
  .experience-list article.wide{grid-column:auto}
}