/*
Theme Name: HR48 First Theme
Version: 0.1.22
Author: homepage-recycling.de
Author URI: https://homepage-recycling.de/
Description: Individuelles WordPress-Theme von homepage-recycling.de mit Elementor-Startseite, responsiver Navigation und filterbarer Nachrichtenübersicht.
*/
body{margin:0;background:#f6f4ee;color:#171917;font-family:system-ui,sans-serif}
.hr48-test-wrap{width:min(1120px,calc(100% - 2rem));margin-inline:auto}
.hr48-test-bar{padding:1rem 0;border-bottom:1px solid currentColor}
.hr48-test-bar .hr48-test-wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.hr48-test-bar img{width:auto;max-width:180px;height:auto}
.hr48-test-nav{display:flex;flex-wrap:wrap;gap:.6rem 1rem}
.hr48-test-nav a,.hr48-test-main a{color:inherit;text-underline-offset:.2em}
.hr48-test-main{padding-block:clamp(2rem,7vw,6rem)}
.hr48-test-main h1{font-size:clamp(2rem,6vw,4.5rem);line-height:1.05;overflow-wrap:anywhere}
.hr48-test-main article{line-height:1.65}
.hr48-test-main img{max-width:100%;height:auto}
.hr48-test-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));gap:1rem}
.hr48-test-card{border:1px solid #bcbfb5;border-radius:1rem;padding:1.25rem;background:#fff}
.hr48-test-fallback{background:#202320;color:#fff;padding:2rem 0}
.hr48-test-mobile-nav{display:none}
.hr48-test-main{overflow-wrap:anywhere}
.hr48-test-main iframe,.hr48-test-main video{max-width:100%}
@media(max-width:650px){
  .hr48-test-desktop-nav{display:none}
  .hr48-test-bar .hr48-test-wrap{position:relative}
  .hr48-test-mobile-nav{display:block}
  .hr48-test-mobile-nav summary{display:grid;place-items:center;cursor:pointer;border:1px solid;border-radius:.65rem;width:44px;height:44px;font-size:1.4rem;list-style:none}
  .hr48-test-mobile-nav summary::-webkit-details-marker{display:none}
  .hr48-test-mobile-nav .hr48-test-nav{position:absolute;z-index:10;top:calc(100% + .5rem);right:0;display:grid;gap:.2rem;min-width:min(14rem,100%);padding:.6rem;background:#f6f4ee;border:1px solid;border-radius:.65rem}
  .hr48-test-mobile-nav a{padding:.55rem}
  .hr48-test-main{overflow-x:auto}
}

.hr48-post-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(15rem,19rem);gap:clamp(1.5rem,4vw,4rem);align-items:start}
.hr48-post-content,.hr48-post-sidebar{min-width:0}
.hr48-post-intro{border-inline-start:.3rem solid var(--hr48-green,#588443);padding-inline-start:1.1rem;margin-bottom:1.75rem}
.hr48-post-intro h1{margin:.55rem 0;font-size:clamp(2rem,4vw,3.6rem)}
.hr48-post-cover{margin:0 0 1.75rem}
.hr48-post-cover img{display:block;width:100%;border-radius:1rem}
.hr48-post-sidebar{display:grid;gap:1rem}
.hr48-post-panel{background:linear-gradient(150deg,#fff,#e5e5e5);border:1px solid #d7d7d7;border-radius:1rem;padding:1.25rem;box-shadow:0 5px 12px #0000000c}
.hr48-post-panel h2{font-size:1.2rem;margin:0 0 .75rem}
.hr48-post-panel ul{margin:0;padding-inline-start:1.2rem}
.hr48-post-panel li+li{margin-top:.55rem}
.hr48-post-topics{display:flex;flex-wrap:wrap;gap:.45rem}
.hr48-post-topics a{background:#fff;border:1px solid #c6d4be;border-radius:2rem;padding:.25rem .65rem}
@media(max-width:780px){.hr48-post-layout{grid-template-columns:minmax(0,1fr)}}

.hr48-news-filters{display:flex;flex-wrap:wrap;gap:.55rem;margin-bottom:1.5rem}
.hr48-news-filters a,.hr48-news-paging .page-numbers:not(.dots){display:inline-block;border:1px solid #c6d4be;border-radius:2rem;padding:.5rem .9rem;text-decoration:none}
.hr48-news-filters [aria-current],.hr48-news-paging .current,.hr48-news-card .hr48-news-more{background:#37622e;color:#fff}
.hr48-news-grid{grid-template-columns:repeat(3,minmax(0,1fr));transition:opacity .22s ease}
.hr48-news-grid.is-filtering{opacity:.28}
.hr48-news-card{display:flex;flex-direction:column;min-width:0;padding:1rem}
.hr48-news-cover{aspect-ratio:16/9;overflow:hidden;border-radius:.65rem}
.hr48-news-cover img{display:block;width:100%;height:100%;object-fit:cover}
.hr48-news-card h2{font-size:1.18rem;line-height:1.25;margin:.8rem 0 .35rem}
.hr48-news-summary{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;margin:0 0 .8rem}
.hr48-news-card .hr48-news-more{align-self:flex-end;margin-top:auto;border-radius:.6rem;padding:.45rem .75rem;text-decoration:none}
.hr48-news-status{min-height:1.5rem;margin:1rem 0;text-align:center}
.hr48-news-status.is-loading::before{content:"";display:inline-block;width:.8em;height:.8em;margin-right:.45em;border:2px solid #c6d4be;border-top-color:#37622e;border-radius:50%;animation:hr48-news-spin .75s linear infinite}
@keyframes hr48-news-spin{to{transform:rotate(360deg)}}
@media(max-width:900px){.hr48-news-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.hr48-news-grid{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.hr48-news-grid{transition:none}.hr48-news-status.is-loading::before{animation:none}}

.hr48-managed-menu{display:flex;flex-wrap:wrap;gap:.65rem 1rem;list-style:none;margin:0;padding:0}
.hr48-managed-menu li{list-style:none}
.hr48-managed-menu .sub-menu{margin:.25rem 0 0;padding-inline-start:1rem}
@media(max-width:650px){.hr48-managed-menu{flex-direction:column}}

.hr48-footer .hr48-footer-grid:has(> .hr48-footer-column){
  grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr)) !important;
}
.hr48-footer .hr48-footer-column{min-width:0;overflow-wrap:anywhere;font:inherit}
.hr48-footer .hr48-footer-column .hr48-managed-menu{flex-direction:column;gap:.4rem}

.hr48-panel-icon,.hr48-post-sidebar .hr48-post-panel:not(:has(.hr48-panel-icon))::before{display:grid;place-items:center;width:2.65rem;height:2.65rem;margin-bottom:.75rem;border-radius:.7rem;background:#e5efdf;color:#37622e;font-size:1.35rem}
.hr48-post-sidebar .hr48-post-panel:not(:has(.hr48-panel-icon))::before{content:"";background:#e5efdf url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none' stroke='%2337622e' stroke-width='1.5'%3E%3Crect x='3' y='2' width='14' height='16' rx='2'/%3E%3Cpath d='M6 6h8M6 10h8M6 14h5'/%3E%3C/svg%3E") center no-repeat}

/* Let the landing page sections fill their parent without viewport-width overflow. */
body.home .elementor[data-elementor-type="wp-page"] > .elementor-top-section,
body.home .elementor[data-elementor-type="wp-page"] > .elementor-top-section > .elementor-container,
body.home .hr48-top,
body.home .hr48-hero,
body.home #hr48-arbeiten,
body.home #hr48-ueber-mich,
body.home #hr48-leistungen,
body.home #hr48-meinungen,
body.home .hr48-drone,
body.home .hr48-social-strip,
body.home #hr48-kontakt{
  box-sizing:border-box;
  width:100% !important;
  max-width:none !important;
  margin-inline:0 !important;
  left:auto !important;
  right:auto !important;
}
body.home .hr48-review-rail{
  max-width:52rem;
  margin-inline:auto;
}
body.home .hr48-review-rail{align-items:flex-start}
body.home .hr48-review-rail>figure{min-height:0;height:auto}

body.home .hr48-showcase{padding:clamp(.75rem,1.6vw,1.5rem) clamp(1rem,3vw,3rem) clamp(2rem,4vw,4rem) !important}
body.home .hr48-showcase>.elementor-container,
body.home .hr48-drone>.elementor-container{width:100%;max-width:none !important}
body.home .hr48-split,body.home .hr48-rail,body.home .hr48-service-grid{width:100%;max-width:none !important}
body.home .hr48-card-hero img{width:100%;height:auto}
body.home .hr48-bio-inner{width:min(100%,75rem);max-width:none}
.hr48-social-strip .hr48-footer-social a{
  width:clamp(3rem,7vw,6.5rem) !important;
  height:2.65rem;
  border-radius:999px !important;
  background:#303330;
  color:#fff;
}
@media(min-width:1250px){
  body.home .hr48-split{
    grid-template-columns:minmax(0,2fr) minmax(0,3fr) !important;
    gap:clamp(1.5rem,3vw,3.5rem);
  }
  body.home #hr48-leistungen{
    display:grid;
    grid-template-columns:minmax(0,2fr) minmax(0,1fr);
    grid-template-rows:auto 1fr auto;
    gap:1rem clamp(1.5rem,3vw,3rem);
    align-items:start;
  }
  body.home #hr48-leistungen>h2{grid-column:1;grid-row:1;margin-bottom:0}
  body.home .hr48-service-grid{grid-column:1;grid-row:2;margin-top:0}
  body.home #hr48-leistungen>.hr48-rule{grid-column:1/-1;grid-row:3;width:100%}
  body.home #hr48-meinungen{grid-column:2;grid-row:1/3;margin:0 !important}
  body.home .hr48-review-rail{max-width:none}
  body.home .hr48-flip{height:auto;min-height:clamp(14.5rem,18vw,18rem)}
}

/* Keep the full screenshot visible at its own aspect ratio. */
body.home .hr48-rail{align-items:start;overflow-y:hidden}
body.home .hr48-rail>article{height:auto !important;min-height:0 !important}
body.home .hr48-rail>article img{
  display:block;
  width:100%;
  height:auto !important;
  max-height:none !important;
  aspect-ratio:auto !important;
}
body.home .hr48-review-rail{overflow-y:hidden !important;touch-action:pan-x pan-y}
body.home .hr48-review-rail>figure,
body.home .hr48-review-rail blockquote{max-height:none !important;overflow:visible !important}

.hr48-social-strip .hr48-footer-social a,
body.home .hr48-review-nav a{
  background:#f6f2e8 !important;
  color:#151515 !important;
  border:1px solid #151515 !important;
  border-radius:14px !important;
  transition:background-color .18s ease,transform .18s ease;
}
.hr48-social-strip .hr48-footer-social a{height:46px;min-width:3rem}
.hr48-social-strip .hr48-footer-social a img{filter:brightness(0)}
.hr48-social-strip .hr48-footer-social a:is(:hover,:focus-visible),
body.home .hr48-review-nav a:is(:hover,:focus-visible){
  background:#58a728 !important;
  color:#151515 !important;
}
.hr48-social-strip .hr48-footer-social a:is(:hover,:focus-visible){transform:translateY(-3px)}
body.home .hr48-drone .elementor-button{
  background:#58a728 !important;
  color:#151515 !important;
}
body.home .hr48-drone .elementor-button:is(:hover,:focus-visible){background:#6fbd3e !important}
@media(prefers-reduced-motion:reduce){
  .hr48-social-strip .hr48-footer-social a,body.home .hr48-review-nav a{transition:none}
  .hr48-social-strip .hr48-footer-social a:is(:hover,:focus-visible){transform:none}
}

.hr48-footer .hr48-footer-grid > .hr48-footer-column{order:1}

.hr48-post-content iframe:is([src*="youtube.com/embed/"],[src*="youtube-nocookie.com/embed/"],[data-src*="youtube.com/embed/"],[data-src*="youtube-nocookie.com/embed/"]){
  display:block;width:100%;max-width:100%;height:auto;aspect-ratio:16/9;border:0;
}
.hr48-post-content .wp-block-embed-youtube{width:100%;max-width:none;margin-inline:0}
.hr48-post-content .elementor-video-iframe{height:100%}
.hr48-post-neighbors{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;margin-top:2rem;padding-top:1rem;border-top:1px solid #c6d4be}
.hr48-post-neighbors a{display:grid;gap:.25rem;padding:.8rem;border:1px solid #c6d4be;border-radius:.65rem;text-decoration:none}
.hr48-post-neighbors a:hover,.hr48-post-neighbors a:focus-visible{background:#e5efdf}
.hr48-post-neighbors span{font-size:.85rem;color:#37622e}
.hr48-post-next{grid-column:2;text-align:right}
@media(max-width:520px){
  .hr48-post-neighbors{gap:.5rem}
  .hr48-post-neighbors a{padding:.55rem;overflow-wrap:anywhere}
  .hr48-post-neighbors strong{font-size:.9rem;line-height:1.3}
  .hr48-post-neighbors span{font-size:.75rem}
}

.hr48-lightbox{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;border:0;padding:0;background:transparent;color:#fff}
.hr48-lightbox[open]{display:grid;place-items:center}
.hr48-lightbox::backdrop{background:rgb(0 0 0 / 88%)}
.hr48-lightbox img{max-width:calc(100vw - 7rem);max-height:calc(100dvh - 5rem);width:auto;height:auto;object-fit:contain}
.hr48-lightbox button{position:absolute;z-index:1;min-width:44px;min-height:44px;border:1px solid #fff;border-radius:.75rem;background:#202020;color:#fff;font-size:1.4rem;cursor:pointer}
.hr48-lightbox button:focus-visible{outline:3px solid #58a728;outline-offset:3px}
.hr48-lightbox-close{top:1rem;right:1rem}
.hr48-lightbox-prev{left:.5rem;top:50%;transform:translateY(-50%)}
.hr48-lightbox-next{right:.5rem;top:50%;transform:translateY(-50%)}
html:has(.hr48-lightbox[open]){overflow:hidden}

/* Match editorial images to the sidebar cards. */
.hr48-post-content img,
body.page:not(.home) main#main article img{
  box-sizing:border-box;
  border:1px solid #d7d7d7;
  border-radius:1rem;
  box-shadow:0 5px 12px #0000000c;
}

/* Match the article and news layouts to the homepage gutters. */
.hr48-test-main.hr48-news,
.hr48-test-main:has(> .hr48-post-layout){
  box-sizing:border-box;
  width:100%;
  padding-inline:clamp(1rem,3vw,3rem);
}
.hr48-test-main.hr48-news{padding-top:clamp(1rem,2vw,1.75rem)}
.hr48-news>h1{margin-top:0}
.hr48-social-strip .hr48-footer-social{flex-wrap:wrap}

.hr48-back-to-top{
  position:fixed;
  right:calc(1rem + env(safe-area-inset-right,0px));
  bottom:calc(1rem + env(safe-area-inset-bottom,0px));
  z-index:999;
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  padding:0;
  border:1px solid #151515;
  border-radius:14px;
  background:#f6f2e8;
  color:#151515;
  box-shadow:0 4px 12px #0002;
  font-size:1.4rem;
  cursor:pointer;
}
.hr48-back-to-top[hidden]{display:none}
.hr48-back-to-top:hover,.hr48-back-to-top:focus-visible{background:#58a728;color:#151515}
.hr48-back-to-top:focus-visible{outline:2px solid #151515;outline-offset:3px}
