/*
Theme Name: PF Hub
Theme URI: https://paulfenzl.de
Author: Paul Fenzl
Description: Persönlicher Link-Hub mit Kartenstapel, Podcast im Mittelpunkt und Blog. Alle Texte, Bilder, Farben, Buttons und Effekte lassen sich im Customizer steuern. Schriften liegen lokal im Theme, es gibt keinen Aufruf an externe Dienste.
Version: 2.0.0
Requires at least: 6.0
Tested up to: 6.6
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: pf-hub
*/

/* ============================================================
   SCHRIFTEN (lokal, je ein Schnitt)
   ============================================================ */
@font-face{font-family:"PF Figtree";src:url(assets/fonts/Figtree-Variable.woff2) format("woff2");font-weight:300 900;font-style:normal;font-display:swap}
@font-face{font-family:"PF Playfair";src:url(assets/fonts/playfair-italic-400.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"PF Lora";src:url(assets/fonts/lora-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"PF Oswald";src:url(assets/fonts/oswald-300.woff2) format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"PF Mono";src:url(assets/fonts/jetbrains-mono-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"PF Slab";src:url(assets/fonts/roboto-slab-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"PF Hand";src:url(assets/fonts/caveat-500.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}

/* ============================================================
   TOKENS (Farben kommen zusätzlich aus dem Customizer)
   ============================================================ */
@property --a{syntax:"<angle>";initial-value:0deg;inherits:false}
:root{
  --navy:#0E1822;--navy-rgb:14,24,34;--navy-top:#1D3144;
  --gold:#D4AF5A;--gold-rgb:212,175,90;--gold-hi:#F6DC8B;--gold-hi-rgb:246,220,139;
  --cream:#F5E9D0;--muted:#A9B7C3;--rose:#E8A87C;

  --f-body:"PF Figtree",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --f-display:"PF Playfair","Didot","Bodoni MT","Times New Roman",serif;
  --f-book:"PF Lora","Palatino Linotype",Palatino,Georgia,serif;
  --f-cond:"PF Oswald","Arial Narrow","Helvetica Neue",Arial,sans-serif;
  --f-mono:"PF Mono","SF Mono",Consolas,"Courier New",monospace;
  --f-slab:"PF Slab","Rockwell",Georgia,serif;
  --f-hand:"PF Hand","Segoe Script","Bradley Hand",cursive;

  --wrap:1040px;
  --pad:clamp(20px,5vw,40px);
}

/* ============================================================
   BASIS
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{scroll-behavior:smooth;background:var(--navy);-webkit-text-size-adjust:100%}
body{color:var(--cream);font-family:var(--f-body);font-size:17px;line-height:1.65;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body::before{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(120% 80% at 50% 0%,var(--navy-top) 0%,var(--navy) 60%);pointer-events:none}
h1,h2,h3,h4{font-weight:400}
strong,b{font-weight:400}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
ul{list-style:none}
section{position:relative;z-index:1}
:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--gold);color:#1c1508;padding:10px 16px;z-index:100;border-radius:0 0 10px 0}
.skip-link:focus{left:0}
.ico{width:1.05em;height:1.05em;flex:none}

/* ============================================================
   GEMEINSAME BAUSTEINE
   ============================================================ */
.kicker,.eyebrow{font-family:var(--f-mono);font-size:12.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.eyebrow--center{text-align:center}
.shine{background:linear-gradient(100deg,#b8892e 0%,#fff3c4 38%,var(--gold) 55%,#b8892e 100%);background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:pf-shine 7s linear infinite}
@keyframes pf-shine{to{background-position:-220% 0}}

.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.btns--center{justify-content:center}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 24px;border-radius:999px;text-decoration:none;font-size:15.5px;font-weight:500;
  letter-spacing:.03em;line-height:1.2;background:linear-gradient(135deg,var(--gold-hi),var(--gold));color:#1c1508;border:1px solid transparent;
  transition:transform .2s,box-shadow .2s,border-color .2s,color .2s}
.btn:hover,.btn:focus-visible{transform:translateY(-3px);box-shadow:0 10px 28px rgba(var(--gold-rgb),.35)}
.btn.ghost{background:transparent;color:var(--cream);border-color:rgba(245,233,208,.4)}
.btn.ghost:hover{border-color:var(--gold);color:var(--gold-hi);box-shadow:none}

.heart{display:inline-block;width:.9em;height:.9em;color:#ff8f8f;vertical-align:-.08em;animation:pf-beat 1.6s ease-in-out infinite}
@keyframes pf-beat{0%,100%{transform:scale(1)}15%{transform:scale(1.25)}30%{transform:scale(1)}45%{transform:scale(1.18)}}

/* Einblenden: nur mit JavaScript, sonst bleibt alles sichtbar */
html.pf-js .rv{opacity:0;transform:rotate(var(--rot,0deg)) translateY(calc(var(--ty,0px) + 30px));transition:opacity .9s ease,transform .9s ease}
html.pf-js .rv.in{opacity:1;transform:rotate(var(--rot,0deg)) translateY(var(--ty,0px))}
.d1{transition-delay:.12s!important}.d2{transition-delay:.24s!important}.d3{transition-delay:.36s!important}

/* Von JavaScript erzeugte Effekt-Elemente */
#pf-sparks{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.pf-glow{position:fixed;width:520px;height:520px;left:0;top:0;margin:-260px 0 0 -260px;border-radius:50%;pointer-events:none;z-index:0;
  background:radial-gradient(circle,rgba(var(--gold-rgb),.16),rgba(var(--gold-rgb),0) 65%);opacity:0;transition:opacity .4s}
.pf-bar{position:fixed;top:0;left:0;right:0;height:3px;z-index:50;transform-origin:0 50%;transform:scaleX(0);
  background:linear-gradient(90deg,#8a6a1f,var(--gold-hi),#8a6a1f)}
.pf-dots{position:fixed;right:14px;top:50%;transform:translateY(-50%);z-index:40;display:flex;flex-direction:column;gap:14px}
.pf-dots a{width:10px;height:10px;border-radius:50%;border:1px solid var(--gold);display:block;transition:.3s}
.pf-dots a.on{background:var(--gold);box-shadow:0 0 12px var(--gold);transform:scale(1.35)}

/* ============================================================
   HERO
   ============================================================ */
.hero{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:70px 20px 60px}
.crown{width:64px;margin:0 auto 12px;animation:pf-float 5s ease-in-out infinite;filter:drop-shadow(0 0 14px rgba(var(--gold-hi-rgb),.6))}
@keyframes pf-float{50%{transform:translateY(-8px)}}
.frame{--rx:0deg;--ry:0deg;position:relative;width:min(74vw,330px);aspect-ratio:3/4;padding:6px;border-radius:999px 999px 30px 30px;
  background:conic-gradient(from var(--a),#7a5a17,var(--gold-hi),#7a5a17,var(--gold-hi),#7a5a17);animation:pf-spin 9s linear infinite;
  transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .15s ease-out}
@keyframes pf-spin{to{--a:360deg}}
.frame::before{content:"";position:absolute;inset:-30px;border-radius:inherit;background:radial-gradient(circle,rgba(var(--gold-hi-rgb),.35),transparent 66%);z-index:-1;filter:blur(18px)}
.frame img{width:100%;height:100%;object-fit:cover;border-radius:999px 999px 24px 24px;background:#22374a}
.hero h1{font-family:var(--f-display);font-style:italic;font-size:clamp(38px,8vw,76px);line-height:1.1;margin-top:30px;letter-spacing:.01em;padding:0 .1em}
.hero .sub{font-family:var(--f-display);font-style:italic;font-size:clamp(17px,2.4vw,22px);color:var(--muted);max-width:560px;margin:14px auto 0}
.cue{margin-top:34px;display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;font-family:var(--f-mono);font-size:12px;letter-spacing:.3em;color:var(--gold);text-transform:uppercase;animation:pf-pulse 2.4s ease-in-out infinite}
.cue svg{width:24px;height:24px}
@keyframes pf-pulse{50%{opacity:.4;transform:translateY(6px)}}

/* ============================================================
   ÜBER MICH
   ============================================================ */
.ich{padding:14vh 0 12vh}
.hello{--rot:-2deg;font-family:var(--f-hand);font-weight:500;font-size:clamp(38px,6.4vw,58px);line-height:1.1;color:var(--rose);margin-bottom:18px;display:inline-block;transform:rotate(var(--rot))}
.statement{font-family:var(--f-book);font-size:clamp(24px,4.2vw,40px);line-height:1.35;max-width:820px}
html.pf-js .statement .w{opacity:.18;transition:opacity .35s}
html.pf-js .statement .w.on{opacity:1}
.note{font-family:var(--f-hand);font-weight:500;font-size:clamp(22px,3vw,26px);color:var(--rose);margin-top:28px;max-width:560px;line-height:1.5}
.polas{display:flex;gap:22px;flex-wrap:wrap;margin-top:56px}
.pola{--rot:-4deg;--ty:0px;background:#f7f1e3;padding:10px 10px 38px;width:min(100%,220px);box-shadow:0 18px 40px rgba(0,0,0,.45);position:relative;
  transform:rotate(var(--rot)) translateY(var(--ty))}
.pola:nth-child(2){--rot:2.5deg;--ty:16px}
.pola:nth-child(3){--rot:-2deg}
.pola img{width:100%;aspect-ratio:1;object-fit:cover;background:#22374a}
.pola figcaption{position:absolute;left:0;right:0;bottom:7px;text-align:center;font-family:var(--f-hand);font-weight:500;color:#3a2f1c;font-size:20px;line-height:1.1}
html.pf-js .pola.rv.in{transition:opacity .9s ease,transform .35s ease}
.pola:hover,html.pf-js .pola.rv.in:hover{transform:rotate(0) scale(1.05);z-index:2}

/* ============================================================
   PODCAST
   ============================================================ */
.podcast{min-height:110vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:14vh 20px;overflow:hidden;
  background:radial-gradient(60% 50% at 50% 50%,rgba(var(--gold-rgb),.14),transparent 70%)}
.rings{position:relative;width:min(70vw,260px);aspect-ratio:1;margin:0 auto 34px}
.rings i{position:absolute;inset:0;border-radius:50%;border:1px solid var(--gold);opacity:0;animation:pf-ring 4.8s ease-out infinite}
.rings i:nth-child(2){animation-delay:1.2s}.rings i:nth-child(3){animation-delay:2.4s}.rings i:nth-child(4){animation-delay:3.6s}
@keyframes pf-ring{0%{transform:scale(.7);opacity:.7}100%{transform:scale(2.3);opacity:0}}
.rings img{position:absolute;inset:0;width:100%;height:100%;border-radius:50%;object-fit:cover;border:3px solid var(--gold);z-index:2;background:#22374a}
.podcast h2{font-family:var(--f-cond);font-weight:300;text-transform:uppercase;font-size:clamp(46px,13vw,148px);line-height:.95;letter-spacing:.06em;margin-top:6px}
.podcast .lead{font-family:var(--f-cond);font-weight:300;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin:18px auto 0;max-width:640px;font-size:clamp(14px,2.2vw,19px);line-height:1.5}
.eq{display:flex;gap:5px;justify-content:center;align-items:flex-end;height:44px;margin:28px 0 4px}
.eq s{width:5px;background:var(--gold);border-radius:3px;animation:pf-eq 1.1s ease-in-out infinite;text-decoration:none;height:100%;transform-origin:bottom}
.eq s:nth-child(2n){animation-duration:.8s}.eq s:nth-child(3n){animation-duration:1.4s}.eq s:nth-child(4n){animation-delay:.3s}.eq s:nth-child(5n){animation-delay:.6s}
@keyframes pf-eq{0%,100%{transform:scaleY(.2)}50%{transform:scaleY(1)}}
.podcast .btns{justify-content:center}
.platforms{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:24px}
.platforms a{display:inline-block;font-family:var(--f-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:var(--muted);
  border:1px solid rgba(var(--gold-rgb),.4);border-radius:999px;padding:7px 15px;transition:color .2s,border-color .2s}
.platforms a:hover{color:var(--gold-hi);border-color:var(--gold-hi)}

/* ============================================================
   TAFELN (Kartenstapel)
   ============================================================ */
.stack-head{text-align:center;padding:10vh 20px 2vh}
.stack-head h2{font-family:var(--f-display);font-style:italic;font-size:clamp(30px,5vw,52px);line-height:1.15;margin-top:10px}
.cards{padding:4vh 16px 14vh}
.card{--cbg:#262c55;--cacc:#9db4ff;--cacc-rgb:157,180,255;
  position:sticky;top:calc(9vh + var(--i,0) * 3.6vh);max-width:var(--wrap);margin:0 auto 12vh;border-radius:30px;overflow:hidden;min-height:62vh;
  display:grid;grid-template-columns:.9fr 1.1fr;
  background:var(--cbg);
  background:linear-gradient(145deg,color-mix(in srgb,var(--cbg) 68%,#000),var(--cbg) 60%,color-mix(in srgb,var(--cbg) 58%,#000));
  border:1px solid rgba(var(--cacc-rgb),.4);box-shadow:0 30px 70px rgba(0,0,0,.5);transform-origin:50% 0;will-change:transform}
.card.no-pic{grid-template-columns:1fr}
.card .pic{position:relative;min-height:320px;background:#22374a}
.card .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.card .txt{padding:clamp(26px,4vw,52px);display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.card .kicker{color:var(--cacc)}
.card h3{line-height:1.08;margin:10px 0 16px}
.card p{color:#dfe6ec;max-width:460px}
.card .tag{font-size:12.5px;color:var(--muted);margin-top:18px;line-height:1.5}
.card .btn{background:linear-gradient(135deg,color-mix(in srgb,var(--cacc) 55%,#fff),var(--cacc));color:#14110a}
.card .btn.ghost{background:transparent;color:var(--cream)}
.card .btn.ghost:hover{border-color:var(--cacc);color:color-mix(in srgb,var(--cacc) 60%,#fff)}
.card .btn:hover{box-shadow:0 10px 28px rgba(var(--cacc-rgb),.35)}
.quote{font-family:var(--f-display);font-style:italic;font-size:clamp(22px,3vw,30px);line-height:1.3;color:var(--gold-hi);margin:6px 0 16px;
  border-left:2px solid var(--gold);padding-left:16px;max-width:460px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.chips li{font-family:var(--f-mono);font-size:12px;border:1px solid rgba(var(--cacc-rgb),.5);border-radius:999px;padding:4px 12px;color:color-mix(in srgb,var(--cacc) 60%,#fff)}

/* Agentur */
.c-fs h3{font-family:var(--f-mono);font-size:clamp(28px,4vw,44px);letter-spacing:-.02em}
.c-fs .pic::after{content:"";position:absolute;inset:14px;border:1px solid rgba(var(--cacc-rgb),.7);pointer-events:none;
  -webkit-mask:linear-gradient(#000 0 0) top left/26px 26px no-repeat,linear-gradient(#000 0 0) top right/26px 26px no-repeat,linear-gradient(#000 0 0) bottom left/26px 26px no-repeat,linear-gradient(#000 0 0) bottom right/26px 26px no-repeat;
  mask:linear-gradient(#000 0 0) top left/26px 26px no-repeat,linear-gradient(#000 0 0) top right/26px 26px no-repeat,linear-gradient(#000 0 0) bottom left/26px 26px no-repeat,linear-gradient(#000 0 0) bottom right/26px 26px no-repeat}
/* Empfehlung */
.c-gold .pic{clip-path:ellipse(100% 100% at 0 50%)}
.c-gold h3{font-family:var(--f-display);font-style:italic;font-size:clamp(34px,5vw,58px);
  background:linear-gradient(100deg,#b8892e 0%,#fff3c4 38%,var(--cacc) 55%,#b8892e 100%);background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:pf-shine 7s linear infinite}
/* Plan B */
.c-plan .pic{order:2}
.c-plan h3{font-family:var(--f-body);font-size:clamp(28px,4.2vw,48px);letter-spacing:-.01em}

/* ============================================================
   BLOG-ABSCHNITT
   ============================================================ */
.blog{padding:16vh 20px;text-align:center;
  background:linear-gradient(rgba(var(--navy-rgb),.86),rgba(var(--navy-rgb),.92)),var(--bl-img,none) center/cover fixed}
.blog h2{font-family:var(--f-slab);font-size:clamp(32px,5.4vw,58px);line-height:1.12}
.blog p{font-family:var(--f-slab);color:var(--muted);max-width:520px;margin:16px auto 0}
.blog .btns{justify-content:center}
.blog .kicker{display:block;margin-bottom:12px}

/* ============================================================
   KONTAKT
   ============================================================ */
.kontakt{padding:16vh 20px 10vh;text-align:center}
.kontakt h2{font-family:var(--f-hand);font-weight:500;font-size:clamp(52px,11vw,104px);color:var(--gold-hi);line-height:1.05}
.kontakt p{color:var(--muted);max-width:500px;margin:14px auto 0}
.kontakt .btns{justify-content:center}

/* ============================================================
   KOPF- UND FUSSZEILE
   ============================================================ */
.hdr{position:sticky;top:0;z-index:30;background:rgba(var(--navy-rgb),.88);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid rgba(245,233,208,.1)}
.hdr__in{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:12px;padding-bottom:12px}
.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none}
.brand .logo{width:34px;height:auto;color:var(--gold)}
.brand>span{display:flex;flex-direction:column;line-height:1.2}
.brand-name{font-size:16px;letter-spacing:.02em}
.brand small{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.hdr__nav{display:flex;gap:22px;font-size:14.5px}
.hdr__nav a{text-decoration:none;color:var(--muted);transition:color .2s}
.hdr__nav a:hover{color:var(--gold-hi)}

.ft{position:relative;z-index:1;border-top:1px solid rgba(245,233,208,.12);padding:44px 0 54px;background:rgba(var(--navy-rgb),.6)}
.ft__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px}
.ft nav ul{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:14.5px}
.ft nav a{text-decoration:none;color:var(--muted);transition:color .2s}
.ft nav a:hover{color:var(--gold-hi)}
.ft__legal{margin-top:30px;font-size:12.5px;line-height:1.6;color:var(--muted);max-width:820px}

.wa-float{position:fixed;right:16px;bottom:16px;z-index:45;display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:999px;text-decoration:none;
  background:linear-gradient(135deg,var(--gold-hi),var(--gold));color:#1c1508;font-size:14.5px;font-weight:500;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.wa-float .ico{width:20px;height:20px}

/* ============================================================
   BLOG UND SEITEN
   ============================================================ */
.bhero{padding:clamp(56px,9vw,110px) 0 clamp(28px,5vw,56px)}
.bhero__in{max-width:820px}
.bhero h1{font-family:var(--f-display);font-style:italic;font-size:clamp(34px,6vw,60px);line-height:1.12;margin:12px 0 0}
.bhero h1 em{color:var(--gold-hi)}
.lead{font-size:clamp(17px,2vw,20px);line-height:1.65;color:var(--cream);margin-top:18px;max-width:64ch}
.section{padding:clamp(48px,8vw,96px) 0}
.section--alt{background:rgba(255,255,255,.03);border-top:1px solid rgba(245,233,208,.08);border-bottom:1px solid rgba(245,233,208,.08)}
.section h2{font-family:var(--f-display);font-style:italic;font-size:clamp(28px,4.4vw,44px);line-height:1.18;margin-top:10px}
.section__head{margin-bottom:28px}

.manifest{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,72px);align-items:start}
.manifest__text{margin-top:20px}
.manifest__text p+p{margin-top:14px}
.rules-title{font-family:var(--f-mono);font-size:12.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
.rules{display:grid;gap:12px}
.rules--gap{margin-bottom:34px}
.rules li{display:flex;gap:12px;align-items:flex-start;line-height:1.5}
.rules svg{width:20px;height:20px;flex:none;margin-top:3px}
.rules .yes svg{color:#7fd8c9}
.rules .no svg{color:#e08a8a}

.topics{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:clamp(24px,4vw,40px)}
.topics a{display:inline-block;text-decoration:none;font-size:14px;border:1px solid rgba(245,233,208,.25);border-radius:999px;padding:6px 16px;color:var(--muted);transition:color .2s,border-color .2s}
.topics a:hover,.topics a[aria-current]{color:var(--gold-hi);border-color:var(--gold)}

.posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:clamp(18px,3vw,30px)}
.post{display:flex;flex-direction:column;text-decoration:none;background:rgba(255,255,255,.04);border:1px solid rgba(245,233,208,.12);border-radius:22px;overflow:hidden;transition:transform .25s,border-color .25s}
.post:hover{transform:translateY(-4px);border-color:rgba(var(--gold-rgb),.6)}
.post--lead{grid-column:1/-1;display:grid;grid-template-columns:1.1fr 1fr}
.post__img{aspect-ratio:16/10;background:#22374a;overflow:hidden}
.post__img img{width:100%;height:100%;object-fit:cover}
.post--lead .post__img{aspect-ratio:auto;min-height:280px}
.post__body{padding:22px 24px 26px}
.post__cat{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.post h3{font-family:var(--f-display);font-style:italic;font-size:clamp(22px,2.6vw,28px);line-height:1.2;margin:8px 0 10px}
.post p{color:#dfe6ec;font-size:15.5px}
.post__meta{margin-top:14px;font-size:13px;color:var(--muted)!important;display:flex;align-items:center;gap:10px}
.post__meta i,.entry__meta i{display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--muted)}
.pagination{margin-top:40px}
.pagination .nav-links{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.pagination a,.pagination span{display:inline-block;padding:8px 16px;border:1px solid rgba(245,233,208,.25);border-radius:999px;text-decoration:none;font-size:14px}
.pagination .current{border-color:var(--gold);color:var(--gold-hi)}

.grid--2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4.5vw,64px);align-items:center}

.cta-box{text-align:center;max-width:760px;margin:0 auto;padding:clamp(32px,5vw,56px);border:1px solid rgba(var(--gold-rgb),.35);border-radius:28px;
  background:linear-gradient(145deg,rgba(var(--gold-rgb),.08),rgba(255,255,255,.02))}
.cta-box .lead{margin-left:auto;margin-right:auto}

.entry__head{max-width:820px}
.entry__meta{margin-top:16px;font-size:14px;color:var(--muted);display:flex;align-items:center;gap:10px}
.entry__thumb{margin:0 auto clamp(28px,4vw,48px);max-width:var(--wrap);border-radius:22px;overflow:hidden}
.entry__thumb img{width:100%}
.entry{max-width:720px;margin:0 auto}
.entry-content{font-size:18px;line-height:1.8}
.entry-content>*+*{margin-top:1.15em}
.entry-content h2,.entry-content h3,.entry-content h4{font-family:var(--f-display);font-style:italic;line-height:1.25;margin-top:1.8em}
.entry-content h2{font-size:clamp(26px,3.6vw,34px)}
.entry-content h3{font-size:clamp(22px,3vw,27px)}
.entry-content a{color:var(--gold-hi);text-underline-offset:3px}
.entry-content strong,.entry-content b{font-weight:600}
.entry-content ul,.entry-content ol{padding-left:1.4em}
.entry-content ul{list-style:disc}
.entry-content li+li{margin-top:.4em}
.entry-content blockquote{border-left:2px solid var(--gold);padding-left:18px;font-family:var(--f-display);font-style:italic;font-size:1.15em;color:var(--gold-hi)}
.entry-content img{border-radius:14px}
.entry-content figcaption{font-size:14px;color:var(--muted);margin-top:8px}
.entry-content table{width:100%;border-collapse:collapse;font-size:16px}
.entry-content th,.entry-content td{border-bottom:1px solid rgba(245,233,208,.15);padding:10px 8px;text-align:left}
.pager{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;max-width:720px;margin:clamp(32px,5vw,56px) auto 0;font-size:15px}
.pager a{color:var(--gold-hi);text-decoration:none}
.comments{margin-top:24px}
.comments__title{margin-bottom:16px}
.comment-list{list-style:none;display:grid;gap:18px;margin-bottom:28px}
.comments input[type=text],.comments input[type=email],.comments input[type=url],.comments textarea{width:100%;background:rgba(255,255,255,.05);color:var(--cream);border:1px solid rgba(245,233,208,.25);border-radius:12px;padding:12px 14px;font:inherit}
.comments input[type=submit]{cursor:pointer;background:linear-gradient(135deg,var(--gold-hi),var(--gold));color:#1c1508;border:0;border-radius:999px;padding:12px 24px;font:inherit;font-weight:500}

/* ============================================================
   MOBIL UND BEWEGUNG
   ============================================================ */
@media (max-width:820px){
  body{font-size:16.5px}
  .pf-dots{display:none}
  .card{position:relative;top:auto!important;grid-template-columns:1fr;min-height:0;margin-bottom:8vh}
  .card .pic{min-height:260px}
  .c-plan .pic{order:0}
  .c-gold .pic{clip-path:none}
  .blog{background-attachment:scroll}
  .manifest,.grid--2,.post--lead{grid-template-columns:1fr}
  .hdr__nav{gap:16px;font-size:14px}
  .brand small{display:none}
  .polas{justify-content:center}
}
@media (min-width:821px) and (max-height:700px){
  .card{position:relative;top:auto!important}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html.pf-js .rv{opacity:1;transform:rotate(var(--rot,0deg)) translateY(var(--ty,0px))}
  html.pf-js .statement .w{opacity:1}
  html{scroll-behavior:auto}
  .shine,.c-gold h3{background-size:100% 100%}
}
