:root {
  --green: #96D5AB;
  --dark-green: #22543d;
  --wood: #8b6f47;
  --wood-light: #a0845c;
  --white: #fff;
  --section: #f7faf8;
  --shadow: 0 8px 34px rgba(34,84,61,0.13);
}

/* Hero sekce s foto */
.hero {
  min-height: 510px;
  position: relative;
  display: flex;
  align-items: center;
  background: var(--white);
}
.hero-bg {
  position: absolute; inset:0;
  background: url('images/background.jpg') center/cover no-repeat;
  filter: brightness(0.62);
  z-index: 1;
}
.hero-content {
  position: relative;
  z-index: 2;
  margin: 0 auto; max-width: 850px; text-align: center;
  color: var(--white);
  padding: 60px 0;
}
.hero-content h1 {font-size: 3.13rem; margin-bottom: 0.2em;font-weight: bold;}
.hero-subtitle {font-size: 1.18rem; opacity: 0.95; margin-bottom:1.2em;}
.hero-desc {margin-bottom: 2.2em; color:var(--green); font-weight:bold;}
.hero-btns {display: flex; justify-content: center; gap:28px;}
.hero-btn {background: var(--green); color:var(--dark-green); padding:11px 34px; border:none;border-radius:27px;font-weight:700;text-decoration:none;font-size:1rem;box-shadow:var(--shadow);transition:background .19s;}
.hero-btn.ghost {background: none; border:2px solid var(--green); color:var(--green);}
.hero-btn:hover {background: var(--dark-green); color: var(--white);}
.hero-btn.ghost:hover {background: var(--green); color:var(--dark-green);}

/* O mně sekce */
.about {background: var(--green);padding:63px 0 50px;}
.about-wrap {display: flex; gap:46px;justify-content: space-between; flex-wrap:wrap;}
.about-main h2 {margin-top:0;margin-bottom:0.93em;}
.about-main p {font-size:1.10em;}
.about-side-card {flex:1 1 330px;}
.about-side-card h3 {margin-top:0; color: var(--dark-green);}
.about-card-content {background: var(--dark-green); color: var(--white); padding: 18px 18px 14px 18px; border-radius: 16px; font-size: 1.11em; box-shadow:0 2px 17px rgba(34,77,34,.10); margin-top:7px;}
.about-side-card strong {font-size:1.07em;}

.projects {background: var(--white);padding:78px 0 63px;}
.projects h2 {color: var(--dark-green);margin-bottom: .5em;}
.projects-desc {color: var(--dark-green);opacity: .88;font-size:1.08em;margin-bottom:20px;}
.projects-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:32px;}
.project-card {border-radius:18px;box-shadow:0 5px 28px rgba(139,111,71,0.09);padding:22px 15px 15px 18px;display:flex;flex-direction:column;align-items:flex-start;}
.project-card.wood {background:var(--wood);color:var(--white);}
.project-card.wood-light {background:var(--wood-light);color:var(--dark-green);}
.project-card h3 {margin-top: 0;font-size: 1.09em;}
.project-btn {margin-top:14px;padding:7px 16px;border-radius:20px;font-weight:bold;background:var(--green);color:var(--dark-green);text-decoration:none;transition:background .16s;}
.project-btn:hover {background:var(--dark-green);color:var(--white);}

.skills {background:var(--dark-green);padding:66px 0;}
.skills h2 {color:var(--green);margin-bottom: .5em;}
.skills-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:28px;}
.skill-card {background:var(--white);border-radius:18px;box-shadow:var(--shadow);padding:20px 18px 14px;text-align:center;}
.skill-card h4 {margin-top:0;margin-bottom:.7em;color:var(--dark-green);}
.skill-card ul {list-style:none;padding:0;}
.skill-card li {margin-bottom:7px; color:var(--wood);}
.skill-card li:last-child {margin-bottom:0;}

.contact {background: var(--section);}
.contact h2 {color:var(--dark-green);margin-bottom:1.2em;}
.contact-grid {display:flex;justify-content:center;gap:54px;margin:38px 0;}
.contact-card {background:var(--green);border-radius:32px;text-align:center;box-shadow:0 0 18px rgba(70,105,99,0.10);padding:38px 19px 21px 19px;min-width:210px;}
.contact-img {width:118px;height:118px;object-fit:cover;border-radius:50%;box-shadow:0 8px 26px rgba(70,105,99,0.25);margin-bottom:14px;background:var(--white);border:7px solid var(--dark-green);transition:transform .18s;}
.contact-img:hover {transform:scale(1.07);}
.contact-card h5 {margin-bottom:9px;font-size:1.16em;color:var(--dark-green);}
.contact-card p {margin-bottom:0;font-size:1em;color:#333;}
.footer {text-align:center;margin-top:30px;color:var(--dark-green);font-size:0.98em;opacity:0.87;padding-bottom:15px;}

@media (max-width:950px){
  .container{padding:0 8px;}
  .about-wrap{flex-direction:column;gap:28px;}
  .contact-grid{flex-direction:column;gap:28px;}
}
@media (max-width:600px){
  .hero-content h1{font-size:1.6rem;}
  .project-card,.skill-card,.contact-card{padding:14px 8px;}
  .contact-img{width:72px;height:72px;}
  .about-card-content{font-size:1em;padding:12px;}
}