/* Hans & Friends – Ergänzungen, die theme.json nicht abdeckt. */
:root{--hf-radius-s:10px;--hf-radius-m:14px;--hf-radius-l:22px}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.wp-site-blocks>*{margin-block-start:0}
:where(.wp-site-blocks) > main{margin-block-start:0}

/* Kopf */
.hf-header{position:sticky;top:0;z-index:50}
.hf-brand{display:flex;align-items:center;gap:12px;text-decoration:none!important;color:#fff!important;font-family:Montserrat,sans-serif;font-weight:800;font-size:19px;letter-spacing:.01em;white-space:nowrap}
.hf-brand img{width:40px;height:40px;display:block}
.hf-brand b{color:#2196FE;font-weight:800}
.hf-header .wp-block-navigation a{color:#fff}
.hf-header .wp-block-navigation a:hover{color:#8CC8FF}
.hf-header .wp-block-navigation__responsive-container.is-menu-open{background:#191E25!important;color:#fff!important}

/* Hero */
.hf-hero{position:relative;overflow:hidden}
.hf-hero::before{content:"";position:absolute;left:50%;top:38%;width:min(1000px,140vw);height:640px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(33,150,254,.22),rgba(33,150,254,0));pointer-events:none}
.hf-hero>*{position:relative}
.hf-hero h1 .hf-dim,.hf-dim{color:#A3ADBD}
.hf-plugin-logo img{height:84px;width:auto}

/* Live-Import-Fenster */
.hf-app{max-width:1000px;margin-inline:auto!important;background:#212833;border:1px solid rgba(255,255,255,.08);border-bottom:0;border-radius:22px 22px 0 0;padding:28px clamp(18px,3vw,34px) 0;color:#E8EDF5;box-shadow:0 -20px 80px rgba(0,0,0,.35)}
.hf-app-top{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.hf-app-top strong{font-family:Montserrat,sans-serif;font-size:19px}
.hf-app-top span{color:#8CC8FF;font-weight:600}
.hf-bar{height:12px;border-radius:99px;background:rgba(255,255,255,.08);margin-bottom:22px;overflow:hidden}
.hf-bar i{display:block;height:100%;width:78%;background:#2196FE;border-radius:99px;animation:hf-grow 2.4s ease-out both}
@keyframes hf-grow{from{width:12%}to{width:78%}}
@media (prefers-reduced-motion:reduce){.hf-bar i{animation:none}}
.hf-log{background:#12161C;border-radius:14px 14px 0 0;padding:6px clamp(14px,2vw,22px);margin:0;list-style:none}
.hf-log li{display:grid;grid-template-columns:22px 1fr auto;gap:12px;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.06);font-size:15px;line-height:1.45}
.hf-log li:last-child{border-bottom:0}
.hf-log em{font-style:normal;color:#8E99AB}
.hf-log .ok{color:#7CE3B0;font-weight:700}.hf-log .wa{color:#FFC266;font-weight:700}
@media (max-width:640px){.hf-log li{grid-template-columns:22px 1fr}.hf-log li>em:last-child{display:none}}

/* Karten */
.hf-card{border-radius:14px;align-self:stretch!important}
.hf-card-link{display:block;text-decoration:none!important;color:inherit!important;border-radius:14px;transition:transform .15s ease, box-shadow .15s ease}
.hf-card-link:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(25,30,37,.12)}
.hf-step-num{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#2196FE;color:#fff;font-family:Montserrat,sans-serif;font-weight:800;font-size:18px}

/* Vergleichstabelle */
.hf-compare table{border-collapse:collapse;width:100%;min-width:620px}
.hf-compare{overflow-x:auto;border-radius:14px;border:1px solid #E3E7EE}
.hf-compare th,.hf-compare td{padding:16px 20px;text-align:left;border-top:1px solid #E3E7EE;vertical-align:top}
.hf-compare thead th{background:#F2F5F9;border-top:0;font-weight:700}
.hf-compare thead th:last-child{color:#0B6FD1}
.hf-compare tbody th{font-weight:600}
.hf-compare td:nth-child(2){color:#566070}

/* Preise */
.hf-price{font-family:Montserrat,sans-serif;font-weight:900;font-size:48px;line-height:1;letter-spacing:-.03em}
.hf-plan-featured{outline:2px solid #2196FE;outline-offset:-2px}
.hf-badge{display:inline-block;background:#2196FE;color:#fff;font-size:13px;font-weight:700;padding:4px 10px;border-radius:999px}
.hf-plan ul{padding-left:20px;margin:0}
.hf-plan ul li{margin:6px 0}

/* FAQ */
.wp-block-details summary{font-weight:600;cursor:pointer}
.wp-block-details[open] summary{margin-bottom:8px}

/* Fuß */
.hf-footer a{color:#C7CFDC}
.hf-footer a:hover{color:#fff}

/* Beiträge */
.wp-block-post-content img{border-radius:12px}
.hf-hero h1.has-text-align-center{max-width:980px;margin-inline:auto}
.hf-plan{display:flex!important;flex-direction:column}
.hf-plan>.wp-block-buttons{margin-top:auto!important;padding-top:8px}
.hf-price+span{margin-left:8px}
/* Menü ab Tablet-Breite einklappen */
@media (max-width:960px){
.hf-header .wp-block-navigation__responsive-container-open:not(.always-shown){display:flex!important}
.hf-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open){display:none!important}
.hf-header .wp-block-buttons{display:none}
.hf-header .wp-block-navigation__responsive-container-open svg{fill:#fff;width:30px;height:30px}
}
@media (max-width:480px){.hf-brand{font-size:16px}.hf-brand img{width:34px;height:34px}}
.hf-plan>.hf-badge{align-self:flex-start}
.wp-block-columns:has(>.hf-plan),.wp-block-columns:has(>.hf-card){align-items:stretch!important}
.hf-card h3 a{color:inherit!important;text-decoration:none}.hf-card h3 a:hover{color:#0B6FD1!important}.hf-card:has(h3 a){position:relative}.hf-card h3 a::after{content:"";position:absolute;inset:0}

/* Launch-Angebot */
.hf-launch{display:table;margin:28px auto 0;padding:10px 20px;border:1px solid #2196FE;background:rgba(33,150,254,.14);border-radius:999px;color:#fff;font-size:16px;text-align:center}
.hf-launch[hidden]{display:none}
.hf-price del{font-size:.5em;font-weight:700;color:#8a94a6;margin-right:8px;letter-spacing:0}
.hf-deal{display:table;margin:0 0 10px;background:#FFB020;color:#0B1530;font-size:13px;font-weight:800;padding:4px 10px;border-radius:999px;letter-spacing:.01em}
/* Danke-Seite */
.hf-thanks-check{width:72px;height:72px;margin:0 auto 8px;border-radius:50%;display:grid;place-items:center;background:#2196FE;color:#fff;box-shadow:0 0 0 10px rgba(33,150,254,.18),0 18px 40px -12px rgba(33,150,254,.7)}
.hf-thanks-note{border:1px solid #E3E8EF;border-radius:14px;padding:28px!important}
.hf-thanks-note h3{margin-top:0;font-size:20px}
.hf-card>.wp-block-buttons{margin-top:auto!important;padding-top:8px}
.hf-card:has(>.wp-block-buttons){display:flex;flex-direction:column}
/* Geld-zurück-Garantie */
.hf-guarantee{display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:center;background:#F2F5F9;border:1px solid #E3E8EF;border-radius:20px;padding:36px 44px;position:relative;overflow:hidden}
.hf-guarantee::after{content:"";position:absolute;left:-80px;top:-80px;width:320px;height:320px;background:radial-gradient(closest-side,rgba(33,150,254,.16),rgba(33,150,254,0));pointer-events:none}
.hf-guarantee__seal{position:relative;z-index:1;transform:rotate(-8deg);filter:drop-shadow(0 18px 28px rgba(25,30,37,.28))}
.hf-seal{display:block;width:168px;height:168px}
.hf-guarantee__body{position:relative;z-index:1}
.hf-guarantee__body h2{margin:0 0 10px;font-size:clamp(26px,3vw,34px)}
.hf-guarantee__body p{margin:0 0 18px;color:#566070;font-size:18px;line-height:1.6;max-width:600px}
.hf-guarantee__list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 24px}
.hf-guarantee__list li{display:flex;align-items:center;gap:8px;margin:0;font-weight:600;color:#191E25;font-size:15px}
.hf-guarantee__list svg{flex:none;color:#fff;background:#2196FE;border-radius:50%;padding:3px;width:22px;height:22px}
@media (max-width:700px){.hf-guarantee{grid-template-columns:1fr;justify-items:center;text-align:center;padding:32px 22px;gap:24px}.hf-guarantee__list{justify-content:center}.hf-guarantee__body p{margin-inline:auto}}
/* Startseite: Plugin-Name, Vertrauenszeile, Fakten */
.hf-eyebrow{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px;margin:22px auto 0!important;width:max-content;max-width:100%;padding:7px 16px;border:1px solid rgba(140,200,255,.35);background:rgba(33,150,254,.12);border-radius:999px;color:#C7CFDC;font-size:15px}
.hf-eyebrow strong{color:#fff;font-family:Montserrat,sans-serif;font-weight:800}
.hf-eyebrow span{color:#8CC8FF}
.hf-trust{text-align:center;color:#A3ADBD;font-size:14px;margin:0 auto 56px!important;max-width:760px}
.hf-facts{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.hf-facts li{background:#fff;border:1px solid #E3E8EF;border-radius:14px;padding:16px 18px;margin:0;display:flex;flex-direction:column;gap:2px}
.hf-facts strong{font-family:Montserrat,sans-serif;font-weight:800;font-size:20px;color:#191E25}
.hf-facts span{color:#566070;font-size:14px}
@media (max-width:700px){.hf-facts{grid-template-columns:1fr}}
/* Footer */
.hf-footer{margin-top:0}
.hf-foot{padding:64px 0 28px}
.hf-foot__cta{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;background:linear-gradient(120deg,#1C2C45,#191E25 60%);border:1px solid rgba(140,200,255,.18);border-radius:18px;padding:26px 30px;transform:translateY(-34px);box-shadow:0 24px 48px -28px rgba(0,0,0,.6)}
.hf-foot__cta strong{display:block;color:#fff;font-family:Montserrat,sans-serif;font-size:20px;font-weight:800;margin-bottom:4px}
.hf-foot__cta span{color:#A3ADBD;font-size:15px}
.hf-foot__ctabtns{display:flex;gap:10px;flex-wrap:wrap}
.hf-btn{display:inline-flex;align-items:center;min-height:46px;padding:0 20px;border-radius:10px;font-weight:700;text-decoration:none!important;font-size:15px}
.hf-btn--primary{background:#2196FE;color:#fff!important}
.hf-btn--primary:hover{background:#0B6FD1}
.hf-btn--ghost{border:1.5px solid rgba(255,255,255,.35);color:#fff!important}
.hf-btn--ghost:hover{border-color:#fff}
.hf-foot__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;padding:8px 0 36px}
.hf-foot__brand p{margin:14px 0 18px;color:#A3ADBD;font-size:15px;line-height:1.6;max-width:340px}
.hf-foot__wporg{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:#C7CFDC!important;text-decoration:none!important;border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:7px 14px}
.hf-foot__wporg:hover{border-color:#8CC8FF;color:#fff!important}
.hf-foot nav h2{color:#fff;font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin:6px 0 14px;font-family:Montserrat,sans-serif;font-weight:800}
.hf-foot nav ul{list-style:none;margin:0;padding:0}
.hf-foot nav li{margin:0 0 9px}
.hf-foot nav a{color:#C7CFDC!important;text-decoration:none!important;font-size:15px}
.hf-foot nav a:hover{color:#fff!important}
.hf-foot__bottom{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.08);padding-top:20px;color:#7D879A;font-size:13px}
@media (max-width:900px){.hf-foot__grid{grid-template-columns:1fr 1fr}.hf-foot__brand{grid-column:1/-1}}
@media (max-width:520px){.hf-foot__grid{grid-template-columns:1fr}.hf-foot__cta{padding:22px}}
/* Konto-Link im Header */
.hf-account-link{display:inline-flex;align-items:center;gap:6px;color:#C7CFDC!important;text-decoration:none!important;font-size:15px;font-weight:600}
.hf-account-link:hover{color:#fff!important}
@media (max-width:960px){.hf-account-link span{display:none}}
/* Hilfe / Doku */
.hf-docs{align-items:flex-start!important}
.hf-docs__nav{position:sticky;top:24px;align-self:flex-start}
.hf-toc{background:#F2F5F9;border-radius:14px;padding:18px 18px 10px}
.hf-toc strong{display:block;font-family:Montserrat,sans-serif;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:#566070;margin-bottom:8px}
.hf-toc ol{list-style:none;margin:0;padding:0;counter-reset:t}
.hf-toc li{margin:0;counter-increment:t}
.hf-toc a{display:block;padding:6px 8px;border-radius:8px;color:#191E25!important;text-decoration:none!important;font-size:15px}
.hf-toc a::before{content:counter(t) ". ";color:#8A94A6}
.hf-toc a:hover{background:#fff}
.hf-docs__body h2{scroll-margin-top:24px;margin-top:56px;padding-top:4px;font-size:28px}
.hf-docs__body h2:first-child{margin-top:0}
.hf-docs__body p,.hf-docs__body li{font-size:17px;line-height:1.7}
.hf-pill{display:inline-block;vertical-align:middle;background:#2196FE;color:#fff;font-size:12px;font-weight:800;letter-spacing:.04em;padding:3px 9px;border-radius:999px;font-family:Figtree,sans-serif}
.hf-quick{list-style:none;margin:20px 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.hf-quick li{background:#fff;border:1px solid #E3E8EF;border-radius:14px;padding:18px;margin:0;font-size:15px!important;line-height:1.55!important;color:#566070}
.hf-quick span{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#2196FE;color:#fff;font-weight:800;margin-bottom:10px}
.hf-quick strong{display:block;color:#191E25;font-size:17px;margin-bottom:4px}
.hf-note{background:#EAF4FF;border-left:4px solid #2196FE;border-radius:10px;padding:14px 18px;margin:20px 0;color:#174a7c}
.hf-table table{border-collapse:collapse;width:100%;font-size:15px}
.hf-table th{background:#F2F5F9;text-align:left;font-weight:700;color:#191E25}
.hf-table th,.hf-table td{border:1px solid #E3E8EF;padding:10px 12px;vertical-align:top}
.hf-docs__body .wp-block-code{background:#191E25;color:#E6EDF6;border-radius:12px;padding:16px 18px;font-size:14px;overflow:auto}
.hf-docs__body .wp-block-details{border:1px solid #E3E8EF;border-radius:10px;padding:14px 18px;margin:8px 0}
.hf-docs__body .wp-block-details summary{font-weight:700;cursor:pointer}
.hf-support{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:18px 0}
.hf-support>div{border:1px solid #E3E8EF;border-radius:14px;padding:20px 22px}
.hf-support h3{margin:0 0 6px;font-size:19px}
.hf-support p{margin:0 0 12px}
.hf-support__tip{background:#F2F5F9;border-radius:10px;padding:14px 18px;font-size:15px!important}
@media (max-width:900px){.hf-docs{flex-direction:column}.hf-docs__nav{position:static;flex-basis:auto!important;width:100%}.hf-quick,.hf-support{grid-template-columns:1fr}}
/* Kundenkonto */
.hf-account{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;align-items:start}
.hf-account__main{background:#191E25;color:#C7CFDC;border-radius:20px;padding:36px 40px;position:relative;overflow:hidden}
.hf-account__main::before{content:"";position:absolute;right:-120px;top:-140px;width:420px;height:420px;background:radial-gradient(closest-side,rgba(33,150,254,.28),rgba(33,150,254,0))}
.hf-account__main>*{position:relative}
.hf-account__main h2{color:#fff;margin:14px 0 10px;font-size:32px}
.hf-check{list-style:none;padding:0;margin:18px 0 24px}
.hf-check li{padding-left:30px;position:relative;margin:0 0 10px;color:#E6EDF6}
.hf-check li::before{content:"";position:absolute;left:0;top:3px;width:20px;height:20px;border-radius:50%;background:#2196FE url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4L18 8' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.hf-small{font-size:14px;color:#A3ADBD;margin-top:14px}
.hf-account__side{display:flex;flex-direction:column;gap:14px}
.hf-card-plain{border:1px solid #E3E8EF;border-radius:16px;padding:22px 24px;background:#fff}
.hf-card-plain h3{margin:0 0 8px;font-size:19px}
.hf-card-plain p{margin:0 0 10px;color:#566070;font-size:16px}
@media (max-width:900px){.hf-account{grid-template-columns:1fr}.hf-account__main{padding:28px 24px}}
/* Anwendungsfälle-Übersicht */
.hf-uc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:24px}
.hf-uc-card{display:flex;flex-direction:column;gap:6px;border:1px solid #E3E8EF;border-radius:16px;padding:24px 26px;text-decoration:none!important;color:#566070!important;background:#fff;transition:border-color .15s,box-shadow .15s,transform .15s}
.hf-uc-card:hover{border-color:#2196FE;box-shadow:0 16px 32px -20px rgba(33,150,254,.5);transform:translateY(-2px)}
.hf-uc-card strong{font-family:Montserrat,sans-serif;font-size:21px;color:#191E25}
.hf-uc-card em{font-style:normal;color:#0B6FD1;font-weight:700;margin-top:8px}
@media (max-width:700px){.hf-uc-grid{grid-template-columns:1fr}}
/* Sprachumschalter */
.hf-lang{position:relative}
.hf-lang>summary{list-style:none;display:inline-flex;align-items:center;gap:6px;cursor:pointer;color:#C7CFDC;font-weight:700;font-size:14px;padding:6px 10px;border:1px solid rgba(255,255,255,.18);border-radius:999px}
.hf-lang>summary::-webkit-details-marker{display:none}
.hf-lang>summary:hover,.hf-lang[open]>summary{color:#fff;border-color:rgba(140,200,255,.6)}
.hf-lang ul{position:absolute;right:0;top:calc(100% + 10px);z-index:50;list-style:none;margin:0;padding:6px;min-width:190px;background:#fff;border-radius:12px;box-shadow:0 18px 40px -16px rgba(0,0,0,.45)}
.hf-lang li{margin:0}
.hf-lang a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;color:#191E25!important;text-decoration:none!important;font-size:15px}
.hf-lang a span{display:inline-grid;place-items:center;min-width:30px;height:22px;border-radius:6px;background:#F2F5F9;color:#566070;font-size:12px;font-weight:800}
.hf-lang a:hover{background:#F2F5F9}
.hf-lang a[aria-current]{background:#EAF4FF;font-weight:700}
.hf-lang a[aria-current] span{background:#2196FE;color:#fff}
.hf-legal-note{background:#FFF6E5;border-left:4px solid #FFB020;border-radius:10px;padding:12px 16px;font-size:15px}

/* Mobil (19.10.): Kopfzeile ohne Überlauf, Menü-Button rechts, lesbares Menü, Hero kompakter */
main{overflow-wrap:break-word}
@media (max-width:960px){
.hf-header>.wp-block-group>.wp-block-group{gap:14px!important}
.hf-header .wp-block-navigation{order:9}
.hf-header .wp-block-navigation__responsive-container.is-menu-open{padding:24px!important;box-sizing:border-box}
.hf-header .is-menu-open .wp-block-navigation__responsive-close{max-width:none;width:100%}
.hf-header .is-menu-open .wp-block-navigation__responsive-dialog{margin-top:0!important}
.hf-header .is-menu-open .wp-block-navigation__responsive-container-content{align-items:stretch!important;padding-top:64px!important}
.hf-header .is-menu-open .wp-block-navigation__container{align-items:stretch!important;gap:0!important;width:100%}
.hf-header .is-menu-open .wp-block-navigation-item{width:100%;border-bottom:1px solid rgba(255,255,255,.12);justify-content:flex-start!important}
.hf-header .is-menu-open .wp-block-navigation-item__content{display:block;width:100%;font-family:Montserrat,sans-serif;font-size:22px;font-weight:800;padding:16px 0!important;text-align:left}
.hf-header .is-menu-open .wp-block-navigation__responsive-container-close{top:22px!important;right:22px!important}
.hf-header .is-menu-open .wp-block-navigation__responsive-container-close svg{fill:#fff;width:30px;height:30px}
}
@media (max-width:480px){
.hf-header{padding-top:12px!important;padding-bottom:12px!important}
.hf-header>.wp-block-group>.wp-block-group{gap:12px!important}
.hf-brand{font-size:15px;gap:8px}.hf-brand img{width:32px;height:32px}
.hf-lang>summary{padding:5px 8px;font-size:13px}
.hf-eyebrow{width:auto;flex-direction:column;gap:2px;padding:8px 18px;border-radius:18px;font-size:14px}
.hf-eyebrow>span[aria-hidden]{display:none}
.hf-hero h1,main h1.wp-block-heading{font-size:clamp(30px,8.6vw,40px)!important;line-height:1.12!important}
.hf-launch{border-radius:18px;padding:12px 16px;font-size:15px}
}