/*
Theme Name: PS Landingpage
Theme URI: https://ps-potentiometer.de/
Author: PS Potentiometer-Service GmbH
Description: Schlanke, responsive Übergangs-Landingpage für die PS Potentiometer-Service GmbH mit Produktkatalog-Link, Kontaktformular, Impressum und Datenschutz.
Version: 1.1.1
Requires at least: 6.2
Tested up to: 6.8
Requires PHP: 8.0
Text Domain: ps-landingpage
*/

:root {
  --ps-green: #006c2f;
  --ps-green-dark: #004d22;
  --ps-green-deep: #003d1b;
  --ps-ink: #171717;
  --ps-muted: #656565;
  --ps-line: rgba(0, 84, 38, .15);
  --ps-soft: #f6f7f6;
  --ps-white: #fff;
  --ps-shadow: 0 22px 60px rgba(0,0,0,.12);
  --ps-radius: 22px;
  --ps-width: 1480px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ps-ink);
  background: #fff;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: inherit; }
img { max-width: 100%; height: auto; display: block; }
button,input,textarea { font: inherit; }

.ps-site {
  min-height: 100svh;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(circle at 67% 15%, rgba(0,108,47,.035), transparent 28%),
    linear-gradient(180deg, #fff 0%, #fbfcfb 100%);
}
.ps-shell { width: min(calc(100% - 64px), var(--ps-width)); margin-inline: auto; position: relative; z-index: 2; }

.ps-header { padding: 38px 0 10px; }
.ps-brand { display: inline-flex; align-items: center; gap: 28px; text-decoration: none; }
.ps-logo { width: 148px; max-width: 19vw; border-radius: 24px; }
.ps-company-name { font-size: clamp(1.25rem, 2.1vw, 2.6rem); line-height: 1; font-weight: 760; letter-spacing: -.035em; white-space: nowrap; }

.ps-main { padding: 30px 0 108px; }
.ps-layout { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr); gap: clamp(36px, 5vw, 92px); align-items: start; }

.ps-copy { padding-top: clamp(18px, 3vw, 54px); max-width: 760px; }
.ps-title { margin: 0; color: var(--ps-green); font-size: clamp(3rem, 5.4vw, 6.5rem); line-height: .97; letter-spacing: -.055em; font-weight: 830; }
.ps-lead { margin: 34px 0 0; max-width: 690px; font-size: clamp(1.2rem, 1.65vw, 2rem); line-height: 1.42; color: #282828; }
.ps-actions { margin-top: 34px; display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.ps-catalog-button {
  display: inline-flex; align-items: center; justify-content: center; gap: 16px;
  min-height: 78px; padding: 0 30px; border-radius: 12px;
  background: linear-gradient(180deg, #007533, var(--ps-green)); color: #fff;
  font-size: clamp(1.05rem, 1.35vw, 1.55rem); font-weight: 760; text-decoration: none;
  box-shadow: 0 14px 30px rgba(0,108,47,.18);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.ps-catalog-button:hover { transform: translateY(-2px); box-shadow: 0 18px 38px rgba(0,108,47,.26); filter: brightness(1.03); }
.ps-catalog-button svg { width: 34px; height: 34px; flex: 0 0 auto; }
.ps-catalog-button.is-disabled { opacity: .6; cursor: default; pointer-events: none; }
.ps-catalog-note { flex-basis: 100%; margin: 0 0 0 4px; color: #3d3d3d; font-size: .98rem; }

.ps-contact-data { margin-top: 62px; display: grid; gap: 20px; width: fit-content; }
.ps-contact-link { display: flex; align-items: center; gap: 16px; text-decoration: none; font-size: clamp(1rem, 1.25vw, 1.35rem); }
.ps-icon-circle { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: var(--ps-green); color: #fff; flex: 0 0 auto; }
.ps-icon-circle svg { width: 22px; height: 22px; }

.ps-form-wrap { position: relative; min-height: 610px; padding-top: 20px; }
.ps-blueprint { position: absolute; z-index: -2; top: -165px; right: -150px; width: 930px; opacity: .34; pointer-events: none; }
.ps-scene { position: absolute; z-index: -1; right: -105px; bottom: -88px; width: 700px; max-width: 52vw; pointer-events: none; }
.ps-card {
  width: min(100%, 470px); margin-left: auto; position: relative;
  padding: 34px; border: 1px solid rgba(0,0,0,.12); border-radius: var(--ps-radius);
  background: rgba(255,255,255,.92); backdrop-filter: blur(14px);
  box-shadow: var(--ps-shadow);
}
.ps-card h2 { margin: 0 0 24px; color: var(--ps-green); font-size: clamp(1.45rem, 1.8vw, 2rem); line-height: 1.15; }
.ps-field { display: grid; gap: 8px; margin-bottom: 18px; }
.ps-field label { font-weight: 650; font-size: .98rem; }
.ps-field input, .ps-field textarea {
  width: 100%; border: 1px solid rgba(0,0,0,.18); border-radius: 8px; background: rgba(255,255,255,.96); color: var(--ps-ink);
  padding: 14px 15px; outline: 0; transition: border-color .15s ease, box-shadow .15s ease;
}
.ps-field input { min-height: 48px; }
.ps-field textarea { min-height: 124px; resize: vertical; }
.ps-field input:focus, .ps-field textarea:focus { border-color: var(--ps-green); box-shadow: 0 0 0 3px rgba(0,108,47,.11); }
.ps-consent { display: grid; grid-template-columns: 18px 1fr; gap: 9px; align-items: start; margin: 2px 0 19px; font-size: .83rem; line-height: 1.4; color: #4b4b4b; }
.ps-consent input { margin: 3px 0 0; accent-color: var(--ps-green); }
.ps-consent a { color: var(--ps-green); font-weight: 650; }
.ps-submit {
  width: 100%; min-height: 60px; border: 0; border-radius: 8px; background: linear-gradient(180deg, #007533, var(--ps-green)); color: #fff;
  display: inline-flex; align-items: center; justify-content: center; gap: 12px; font-size: 1.08rem; font-weight: 760; cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease;
}
.ps-submit:hover { transform: translateY(-1px); box-shadow: 0 12px 22px rgba(0,108,47,.2); }
.ps-submit svg { width: 25px; height: 25px; }
.ps-honeypot { position: absolute !important; width: 1px !important; height: 1px !important; opacity: 0 !important; overflow: hidden !important; pointer-events: none !important; left: -9999px !important; }
.ps-form-message { border-radius: 9px; padding: 12px 14px; margin: -4px 0 18px; font-size: .9rem; }
.ps-form-message.success { background: #eef9f2; border: 1px solid #b8dec7; color: #235f3a; }
.ps-form-message.error { background: #fff3f3; border: 1px solid #e5bcbc; color: #852f2f; }

.ps-footer {
  position: absolute; left: 0; right: 0; bottom: 0; min-height: 92px; z-index: 1;
  display: flex; align-items: flex-end; color: #fff;
  background: linear-gradient(90deg, #005725, #007438 72%, #00652e);
  clip-path: ellipse(76% 95% at 52% 100%);
  padding: 34px 0 20px;
}
.ps-footer-inner { width: min(calc(100% - 64px), var(--ps-width)); margin-inline: auto; display: flex; align-items: center; justify-content: space-between; gap: 26px; }
.ps-footer-company { font-size: 1rem; }
.ps-footer-nav { display: flex; align-items: center; gap: 24px; }
.ps-footer-nav a { color: #fff; text-decoration: none; }
.ps-footer-nav a:hover { text-decoration: underline; }
.ps-footer-sep { width: 1px; height: 26px; background: rgba(255,255,255,.55); }

/* Legal pages */
.ps-legal-page { min-height: 100vh; background: #f8faf8; }
.ps-legal-header { background: #fff; border-bottom: 1px solid #e5e9e5; }
.ps-legal-header .ps-shell { padding: 20px 0; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.ps-legal-header .ps-brand { gap: 16px; }
.ps-legal-header .ps-logo { width: 82px; border-radius: 15px; }
.ps-legal-header .ps-company-name { font-size: 1.25rem; }
.ps-back { text-decoration: none; color: var(--ps-green); font-weight: 700; }
.ps-legal-content { width: min(calc(100% - 48px), 900px); margin: 0 auto; padding: 70px 0 100px; }
.ps-legal-content h1 { color: var(--ps-green); font-size: clamp(2.2rem, 5vw, 4rem); margin: 0 0 34px; letter-spacing: -.04em; }
.ps-legal-content h2 { margin-top: 36px; color: #1d1d1d; }
.ps-legal-content p, .ps-legal-content li { line-height: 1.7; color: #333; }
.ps-legal-content a { color: var(--ps-green); }
.ps-legal-note { margin: 36px 0; padding: 18px; border-left: 4px solid var(--ps-green); background: #fff; }

@media (max-width: 1120px) {
  .ps-shell { width: min(calc(100% - 44px), var(--ps-width)); }
  .ps-header { padding-top: 26px; }
  .ps-logo { width: 118px; }
  .ps-layout { grid-template-columns: 1fr 430px; gap: 32px; }
  .ps-title { font-size: clamp(3rem, 6vw, 5.5rem); }
  .ps-blueprint { right: -280px; }
  .ps-scene { width: 560px; right: -160px; opacity: .82; }
  .ps-card { padding: 28px; }
}

@media (max-width: 880px) {
  .ps-site { overflow: visible; }
  .ps-shell { width: min(calc(100% - 34px), 760px); }
  .ps-header { padding: 22px 0 0; }
  .ps-brand { gap: 18px; }
  .ps-logo { width: 96px; max-width: 24vw; border-radius: 16px; }
  .ps-company-name { font-size: clamp(1.05rem, 4vw, 1.6rem); white-space: normal; }
  .ps-main { padding: 20px 0 40px; }
  .ps-layout { grid-template-columns: 1fr; gap: 36px; }
  .ps-copy { padding-top: 20px; max-width: none; }
  .ps-title { font-size: clamp(3rem, 11vw, 5.4rem); }
  .ps-lead { margin-top: 24px; font-size: clamp(1.08rem, 3.7vw, 1.5rem); }
  .ps-actions { margin-top: 28px; }
  .ps-catalog-button { min-height: 68px; padding: 0 22px; }
  .ps-contact-data { margin-top: 40px; }
  .ps-form-wrap { min-height: auto; padding: 0 0 34px; }
  .ps-blueprint { width: 760px; top: -240px; right: -420px; opacity: .18; }
  .ps-scene { display: none; }
  .ps-card { margin: 0; width: 100%; }
  .ps-footer { position: relative; min-height: 0; clip-path: none; padding: 26px 0; }
  .ps-footer-inner { width: min(calc(100% - 34px), 760px); }
}

@media (max-width: 560px) {
  .ps-brand { align-items: center; }
  .ps-logo { width: 82px; }
  .ps-company-name { font-size: 1.05rem; line-height: 1.15; }
  .ps-title { font-size: clamp(2.75rem, 13vw, 4.2rem); }
  .ps-lead { font-size: 1.08rem; line-height: 1.5; }
  .ps-catalog-button { width: 100%; font-size: 1.07rem; }
  .ps-contact-link { font-size: .98rem; }
  .ps-icon-circle { width: 38px; height: 38px; }
  .ps-card { padding: 22px 18px; border-radius: 17px; }
  .ps-footer-inner { flex-direction: column; align-items: flex-start; }
  .ps-footer-nav { gap: 15px; flex-wrap: wrap; }
  .ps-footer-sep { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; transition: none !important; }
}