/* Stougaard Anlæg og Pleje — recreation of the live WordPress theme (Entrepreneurx / Themo) */

:root {
  --primary: #6c9c1e;
  --primary-dark: #5d871a;
  --text: #5c5c5c;
  --heading: #333333;
  --border: #e6e6e6;
  --bg: #ffffff;
  --bg-alt: #fafafa;
  --cta: #00a99d;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: "Open Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.65;
  color: var(--text);
  background: #ffffff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--primary); text-decoration: none; }
a:hover { color: var(--primary-dark); text-decoration: none; }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  font-weight: 600;
  color: var(--heading);
  line-height: 1.25;
  margin: 0 0 0.6em;
}

h1 { font-size: 2.25rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.125rem; }

p { margin: 0 0 1em; }

ul, ol { margin: 0 0 1em; padding-left: 1.25em; }
li { margin-bottom: 0.2em; }

/* Decorative "leaf" lists used on subpages (match the live site's fa-ul) */
ul.fa-ul {
  list-style: none;
  padding-left: 0;
  margin: 1em 0;
}
ul.fa-ul li {
  position: relative;
  padding-left: 1.75em;
  margin-bottom: 0.35em;
}
ul.fa-ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.35em;
  width: 1.1em;
  height: 1.1em;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path fill='%236c9c1e' d='M272 96c-78.6 0-145.1 51.5-167.7 122.5C91.7 200.9 74.8 192 56 192L0 192l0 16c0 92.8 75.2 168 168 168l24 0 0 24c0 22.1 17.9 40 40 40s40-17.9 40-40l0-24 0-5.3c129.1-14.5 229.2-123.8 229.2-256.2c0-14-11.3-25.3-25.3-25.3c-5 0-9.9 .7-14.7 2.1c-24.6 7-60.4 13.8-104.6 13.8l0 .1z'/></svg>");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
ul.fa-ul li i { display: none; }

.container {
  width: 100%;
  max-width: 1170px;
  margin: 0 auto;
  padding: 0 15px;
}

/* Skip link for a11y */
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* ----- Header / Navbar ----- */
.banner {
  background: #ffffff url("/img/bodytexture.png") repeat-x bottom -130px center;
  border-bottom: 3px solid var(--primary);
  position: relative;
  z-index: 20;
}

.banner .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 22px;
  padding-bottom: 22px;
  gap: 24px;
  flex-wrap: wrap;
}

#logo img {
  max-height: 90px;
  width: auto;
  display: block;
}

.navbar-nav {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 28px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.navbar-nav > li > a {
  font-family: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: var(--heading);
  text-decoration: none;
  padding: 8px 0;
  display: inline-block;
}
.navbar-nav > li > a:hover,
.navbar-nav > li.active > a {
  color: var(--primary);
}

.navbar-nav > li.th-accent {
  background: var(--primary);
  color: #fff;
  border-radius: 5px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  margin: 0;
}
.navbar-nav > li.th-accent > a {
  color: #fff;
  padding: 10px 16px;
}
.navbar-nav > li.th-accent:hover {
  background-color: #5d871a;
}

.navbar-toggle {
  display: none;
  border: 0;
  background: var(--primary);
  color: #fff;
  padding: 10px 12px;
  border-radius: 4px;
  cursor: pointer;
}
.navbar-toggle .icon-bar {
  display: block;
  width: 22px;
  height: 2px;
  background: #fff;
  margin: 4px 0;
}

/* Secondary nav (inner page menu like the Elementor horizontal menu) */
.subnav {
  background: transparent;
  padding: 18px 0 0;
}
.subnav-inner {
  display: flex;
  justify-content: center;
  gap: 22px;
  flex-wrap: wrap;
}
.subnav a {
  font-family: "Montserrat", sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--heading);
  text-decoration: none;
  padding: 8px 2px;
}
.subnav a:hover,
.subnav a.active {
  color: var(--primary);
}

/* ----- Hero / MasterSlider recreation ----- */
.hero-slider {
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  background: #000;
}
.hero-slider .slides {
  position: relative;
  width: 100%;
  aspect-ratio: 1200 / 500;
}
.hero-slider .slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 1.2s ease;
}
.hero-slider .slide.is-active { opacity: 1; }
.hero-slider .timebar {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: var(--primary);
  transform-origin: 0 50%;
  transform: scaleX(0);
}
.hero-slider.playing .timebar {
  animation: timebar 3s linear infinite;
}
@keyframes timebar {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

/* ----- Inner page header (entry-title + page body) ----- */
.inner-container {
  padding: 40px 0 60px;
}
.inner-container .entry-title {
  text-align: center;
  font-size: 2.1rem;
  color: var(--primary);
  margin: 0 0 12px;
}
.content-editor {
  margin-top: 20px;
}

/* Page content rhythm on subpages */
.page-body h1,
.page-body h2,
.page-body h3 {
  text-align: center;
  color: var(--heading);
  margin-top: 2em;
}
.page-body h1 { color: var(--primary); }
.page-body p {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}
.page-body ul.fa-ul {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}
.page-body img,
.page-body figure {
  margin: 28px auto;
  max-width: 750px;
  display: block;
}

/* ----- Homepage heading/intro band ----- */
.home-heading {
  padding: 34px 0 10px;
  text-align: center;
}
.home-heading h2 {
  font-size: 1.6rem;
  font-weight: 600;
  color: var(--heading);
  max-width: 920px;
  margin: 0 auto 12px;
  line-height: 1.35;
}
.home-heading p {
  max-width: 860px;
  margin: 10px auto;
}
.home-heading a {
  color: var(--primary);
  font-weight: 600;
}

/* ----- Services grid (3x2) with figure + caption + button ----- */
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 34px 28px;
  padding: 20px 0 40px;
}
.service-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.service-card figure {
  margin: 0;
  width: 100%;
  max-width: 306px;
}
.service-card figure img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 2px;
}
.service-card figcaption {
  padding: 14px 4px 0;
}
.service-card figcaption h3 {
  font-size: 1.25rem;
  margin: 0 0 6px;
  color: var(--heading);
}
.service-card figcaption p {
  font-size: 14px;
  color: var(--text);
  margin: 0 0 16px;
}
.service-card .btn {
  margin-top: auto;
}

/* ----- Buttons ----- */
.btn, .elementor-button {
  display: inline-block;
  background: var(--primary);
  color: #fff;
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  font-size: 14px;
  padding: 10px 18px;
  border-radius: 5px;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: background-color .15s ease;
  line-height: 1.3;
}
.btn:hover, .elementor-button:hover {
  background: var(--primary-dark);
  color: #fff;
}
.btn-ghost {
  background: transparent;
  color: var(--primary);
  border: 1px solid var(--primary);
}
.btn-ghost:hover {
  background: var(--primary);
  color: #fff;
}
.btn-sm { padding: 8px 14px; font-size: 13px; }

/* ----- Intro text band (below slider) ----- */
.intro-band {
  padding: 44px 0 10px;
  text-align: center;
}
.intro-band h4 {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--heading);
  margin: 0 0 14px;
}
.intro-band p {
  max-width: 860px;
  margin: 0 auto;
}

/* ----- Footer ----- */
.prefooter { height: 30px; }

.footer {
  background: #f5f5f5;
  border-top: 1px solid var(--border);
  padding: 46px 0 0;
  color: var(--text);
  font-size: 15px;
}
.footer-widgets {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  padding-bottom: 34px;
}
.footer .widget-title,
.footer h3 {
  font-size: 1.05rem;
  color: var(--heading);
  margin: 0 0 14px;
  text-transform: none;
}
.footer .widget-title { color: var(--primary); }
.footer a {
  color: var(--primary);
  text-decoration: none;
}
.footer a:hover { text-decoration: underline; }

.footer-area-2 img {
  max-width: 300px;
  height: auto;
  display: block;
}

.footer-btm-bar {
  background: #eeeeee;
  padding: 16px 0;
  font-size: 13px;
  color: #888;
}
.footer-btm-bar p { margin: 0; }
.footer_credit a { color: var(--primary); }

/* ----- Contact page ----- */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  max-width: 1000px;
  margin: 20px auto 0;
  padding: 20px 0;
}
.contact-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 24px 26px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}
.contact-card h3 {
  color: var(--primary);
  font-size: 1.1rem;
  margin: 0 0 14px;
}
.contact-card p { margin: 0 0 10px; }
.contact-card .phone-link {
  font-size: 1.6rem;
  font-weight: 600;
  color: var(--primary);
}
.contact-map iframe,
.contact-map img {
  width: 100%;
  min-height: 320px;
  border: 0;
  display: block;
}

/* Embedded page hero image */
.page-hero {
  max-width: 1200px;
  margin: 24px auto 0;
}
.page-hero img { width: 100%; height: auto; display: block; }

/* Video on subpages (anlægsarbejde / haveanlæg / profil) */
.page-video {
  max-width: 1170px;
  margin: 10px auto 20px;
}
.page-video video { width: 100%; height: auto; display: block; }

/* ----- Utility ----- */
.text-center { text-align: center; }
.mt-lg { margin-top: 36px; }
.mb-lg { margin-bottom: 36px; }

/* ----- Responsive ----- */
@media (max-width: 900px) {
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-widgets { grid-template-columns: 1fr; gap: 24px; }
  .contact-grid { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
  .banner .container {
    padding-top: 14px;
    padding-bottom: 14px;
  }
  .navbar-toggle { display: block; }
  .navbar-nav {
    width: 100%;
    display: none;
    flex-direction: column;
    gap: 0;
    padding: 10px 0 0;
    order: 3;
  }
  .navbar-nav.is-open { display: flex; }
  .navbar-nav > li {
    width: 100%;
    border-bottom: 1px solid var(--border);
  }
  .navbar-nav > li > a {
    display: block;
    padding: 12px 4px;
  }
  .navbar-nav > li.th-accent {
    margin: 10px 0 0;
    border-bottom: none;
    text-align: center;
  }
  .navbar-nav > li.th-accent > a { padding: 12px; }

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

  h1 { font-size: 1.8rem; }
  h2 { font-size: 1.5rem; }

  .inner-container .entry-title { font-size: 1.7rem; }
  .subnav-inner { gap: 14px; }
}