/*
Theme Name: PleinImmo v2
Theme URI: https://pleinimmo.at
Author: PleinImmo GmbH
Description: One-Page-Website für PleinImmo – Experten für Sanierungen & Entrümpelungen in Graz und der Steiermark. Umgesetzt aus dem Claude-Design-Entwurf „PleinImmo v2". Bilder werden über den Customizer (Design → Anpassen → PleinImmo Bilder) eingesetzt.
Version: 1.1.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: pleinimmo
*/

/* ============================================================
   Baked-in design tokens (accent = green #2f5d3c, panels = sage)
   ============================================================ */
:root,
.pi-root {
  --accent: #2f5d3c;
  --accent-deep: #244a2e;
  --img-radius: 14px;
  --eyebrow-display: block;

  /* Nav (top / hero state — overridden by .pi-scrolled) */
  --nav-bg: transparent;
  --nav-fg: #ffffff;
  --nav-border: transparent;
  --nav-shadow: none;
  --nav-blur: none;
  --nav-pad: 22px;
  --logo-white-display: block;
  --logo-black-display: none;

  /* Sage panel theme (Über uns / Kontakt) */
  --panel-bg: #dce7dd;
  --panel-head: #1c2a20;
  --panel-eyebrow: var(--accent);
  --panel-sub: #38493c;
  --panel-body: #4e5f52;
  --panel-label: #7a8c7d;
  --panel-strong: #1c2a20;

  /* Footer */
  --foot-bg: #d0dfd1;
  --foot-body: #566459;
  --foot-link: #38493c;
  --foot-copy: #82927f;
  --foot-border: rgba(0, 0, 0, .1);
  --foot-logo-white: none;
  --foot-logo-black: block;
}

/* Nav solid state once the page is scrolled */
.pi-root.pi-scrolled {
  --nav-bg: rgba(245, 243, 238, 0.9);
  --nav-fg: #1c1f1d;
  --nav-border: rgba(0, 0, 0, 0.08);
  --nav-shadow: 0 8px 30px rgba(0, 0, 0, 0.06);
  --nav-blur: saturate(1.4) blur(12px);
  --nav-pad: 14px;
  --logo-white-display: none;
  --logo-black-display: block;
}

/* ============================================================
   Reset & base
   ============================================================ */
* { box-sizing: border-box; }
html, body { margin: 0; }
body.pi-body {
  background: #f5f3ee;
  color: #1c1f1d;
  font-family: 'Hanken Grotesk', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
.pi-root img { display: block; max-width: 100%; }
.pi-root a { text-decoration: none; color: inherit; }

/* ============================================================
   Animations & interactions
   ============================================================ */
@keyframes pi-up { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
.pi-link:hover { color: var(--accent) !important; }
.pi-img:hover { transform: scale(1.045) !important; }
.pi-card:hover { transform: translateY(-4px) !important; box-shadow: 0 18px 50px rgba(0, 0, 0, .10) !important; }
.pi-btn-p:hover { background: var(--accent-deep) !important; }
.pi-btn-o:hover { background: rgba(255, 255, 255, .12) !important; }
.pi-field:focus { border-color: var(--accent) !important; outline: none; }

/* Clickable gallery images */
.pi-shot { cursor: zoom-in; overflow: hidden; }
.pi-shot img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }

/* ============================================================
   Hamburger / mobile menu
   ============================================================ */
.pi-ham { display: none; }
.pi-mobile { display: none; }
.pi-mobile.pi-open { display: flex; }

@media (max-width: 880px) {
  .pi-navlinks { display: none !important; }
  .pi-navcta { display: none !important; }
  .pi-ham { display: flex !important; }
  .pi-2col { grid-template-columns: 1fr !important; }
  .pi-4col { grid-template-columns: 1fr 1fr !important; }
  .pi-gal { grid-template-columns: 1fr 1fr !important; }
  .pi-vngal { grid-template-columns: 1fr !important; }
}
@media (max-width: 560px) {
  .pi-4col { grid-template-columns: 1fr !important; }
  .pi-gal { grid-template-columns: 1fr !important; }
}