/* ============================================================
   patricksteinhofer.com — GEMEINSAMES DESIGN-SYSTEM
   Jede Seite bindet diese Datei ein. Farben/Schriften/Buttons
   kommen NUR von hier. Niemals eigene Farben oder Schriften setzen.
   ============================================================ */

:root{
  --teal:#1AC6DD; --teal-dark:#0E8DA1; --teal-mid:#15A9BD;
  --anthra:#2B2B2F; --warm-black:#1A1509;
  --dark:#141418; --dark2:#1C1C1E;
  --bg:#FBF8F2; --cream:#F3ECDC; --beige:#EFE4D2; --beige2:#E7DCC4; --white:#FFFFFF;
  --gold:#C9A24B; --gold-soft:#E4D5BE;
  --body:#5A564F; --muted:#6A655D;
  --line:rgba(26,21,9,.10);
  --shadow:0 30px 70px -34px rgba(43,43,47,.4);
  --shadow-sm:0 12px 30px -18px rgba(43,43,47,.3);
  --r-btn:30px; --r-card:18px;
  --container:1020px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,sans-serif;color:var(--body);background:var(--bg);line-height:1.65;
  font-size:clamp(1.06rem,1.7vw,1.2rem);-webkit-font-smoothing:antialiased}
h1,h2,h3,.eyebrow{font-family:'Poppins',sans-serif;color:var(--warm-black)}
h1{font-weight:900;line-height:1.0;letter-spacing:-.02em;font-size:clamp(2.4rem,6vw,4rem)}
h2{font-weight:800;line-height:1.08;letter-spacing:-.015em;font-size:clamp(1.9rem,4vw,3rem)}
h3{font-weight:700;line-height:1.15;font-size:clamp(1.3rem,2.2vw,1.7rem)}
.teal{color:var(--teal)}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--container);margin:0 auto;padding-inline:clamp(22px,5vw,34px)}
section{padding-block:clamp(64px,10vw,120px)}
.eyebrow{font-size:.82rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--teal-dark)}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.5em;font-family:'Poppins',sans-serif;font-weight:700;
  font-size:1.02rem;border-radius:var(--r-btn);padding:.9em 1.6em;cursor:pointer;border:0;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease;white-space:nowrap}
.btn-primary{background:var(--teal);color:#06333b;box-shadow:0 16px 34px -14px rgba(26,198,221,.65)}
.btn-primary:hover{background:var(--teal-dark);color:#fff;transform:translateY(-2px)}
.btn-ghost{background:transparent;color:var(--warm-black);border:1.5px solid var(--line)}
.btn-ghost:hover{border-color:var(--teal);color:var(--teal-dark)}
.btn-gold{background:var(--gold);color:#211c10}
.btn-gold:hover{background:#d8b45a;transform:translateY(-2px)}
.btn .arrow{transition:transform .18s ease}
.btn:hover .arrow{transform:translateX(4px)}

/* Nav */
header.nav{position:absolute;top:0;left:0;right:0;z-index:20}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:20px}
.brand{font-family:'Poppins',sans-serif;font-weight:800;color:var(--warm-black);font-size:1.1rem;line-height:1}
.brand small{display:block;font-size:.62rem;letter-spacing:.2em;color:var(--teal-dark);font-weight:700;margin-top:3px}
.nav-links{display:flex;align-items:center;gap:1.5rem}
.nav-links .lnk{font-size:.95rem;font-weight:600;color:var(--warm-black);opacity:.75}
.nav-links .lnk:hover{opacity:1}
.nav-links .btn{padding:.62em 1.15em;font-size:.92rem}
@media(max-width:820px){.nav-links .lnk{display:none}}

/* Sektionskopf + Karten */
.sec-head{max-width:40ch}
.sec-head h2{margin:.3em 0 .2em}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:1.6rem 1.4rem;box-shadow:var(--shadow-sm)}

/* Footer */
footer{background:var(--dark);color:#b7b2a8;padding-block:52px;font-size:.95rem}
footer .brand{color:#fff}footer .brand small{color:var(--teal)}
.foot-grid{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap}
footer a:hover{color:#fff}
.foot-legal{margin-top:2rem;padding-top:1.3rem;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.85rem;color:#7f7b73}

/* Scroll-Reveal (braucht das kleine Script aus dem Template) */
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}