/*
Theme Name: Eponeo
Theme URI: https://eponeo.de
Author: Eponeo
Description: Schlankes Onepager-Theme für eponeo.de – ohne externe Schriften, ohne Tracking, ohne Plugins.
Version: 1.1.1
Requires at least: 6.4
Requires PHP: 8.1
License: Proprietary
Text Domain: eponeo
*/
:root{
  --ink:#111111; --paper:#FFFFFF; --muted:#5b5b5b; --line:#e4e4e4; --soft:#f5f4f1;
  --serif:"Bodoni 72","Didot","Bodoni MT","Libre Bodoni",Georgia,"Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,Arial,sans-serif;
  --max:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit}
img,svg{max-width:100%}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}

/* Kopf */
.top{position:sticky;top:0;z-index:10;background:rgba(17,17,17,.96);color:var(--paper);backdrop-filter:saturate(1.2) blur(6px)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:68px}
.top .mark{display:flex;align-items:center;gap:12px;text-decoration:none}
.top .mark svg{width:46px;height:auto;color:var(--paper)}
.top .mark span{font:500 15px/1 var(--sans);letter-spacing:.28em}
.top nav{display:flex;gap:28px}
.top nav a{text-decoration:none;font-size:14px;letter-spacing:.04em;opacity:.8}
.top nav a:hover{opacity:1}
@media (max-width:760px){.top nav{display:none}}

/* Hero */
.hero{background:var(--ink);color:var(--paper);padding:88px 0 110px}
.hero .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:64px;align-items:center}
.hero .logo svg{width:100%;max-width:420px;height:auto;color:var(--paper);display:block}
.eyebrow{font-size:13px;letter-spacing:.24em;text-transform:uppercase;opacity:.7;margin:0 0 18px}
h1,h2,h3{font-family:var(--serif);font-weight:400;letter-spacing:.005em}
.hero h1{font-size:clamp(38px,5vw,62px);line-height:1.08;margin:0 0 24px}
.hero p.lead{font-size:19px;opacity:.85;max-width:34em;margin:0 0 36px}
.btns{display:flex;flex-wrap:wrap;gap:14px}
.btn{display:inline-block;padding:14px 26px;border:1px solid currentColor;text-decoration:none;font-size:15px;letter-spacing:.04em;transition:background .15s,color .15s}
.btn.solid{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn.solid:hover{background:transparent;color:var(--paper)}
.btn.ghost:hover{background:var(--paper);color:var(--ink)}
.btn.dark{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn.dark:hover{background:transparent;color:var(--ink)}
@media (max-width:860px){.hero{padding:56px 0 72px}.hero .wrap{grid-template-columns:1fr;gap:40px}.hero .logo svg{max-width:260px}}

/* Abschnitte */
section{padding:96px 0;border-bottom:1px solid var(--line)}
section.soft{background:var(--soft)}
.head{max-width:44em;margin-bottom:52px}
.head h2{font-size:clamp(30px,3.6vw,44px);line-height:1.12;margin:0 0 16px}
.head p{color:var(--muted);margin:0}
.num{font:500 12px/1 var(--sans);letter-spacing:.22em;color:var(--muted);display:block;margin-bottom:14px}

/* Idee */
.idea{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:start}
.idea blockquote{margin:0;font-family:var(--serif);font-size:clamp(26px,3vw,36px);line-height:1.25}
.idea p{margin:0 0 16px;color:#333}
@media (max-width:860px){.idea{grid-template-columns:1fr;gap:28px}}

/* Leistungen */
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--ink)}
.card{padding:36px 36px 40px 0;border-bottom:1px solid var(--line)}
.card:nth-child(odd){padding-right:48px;border-right:1px solid var(--line)}
.card:nth-child(even){padding-left:48px}
.card h3{font-size:26px;margin:0 0 10px}
.card p{margin:0;color:#333}
.card p.ex{margin-top:16px;padding-left:14px;border-left:2px solid var(--ink);font-size:15px;line-height:1.6;color:var(--muted)}
.card p.ex b{display:block;font:500 11px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--ink);margin-bottom:6px}
@media (max-width:760px){.grid{grid-template-columns:1fr}.card,.card:nth-child(odd),.card:nth-child(even){padding:28px 0;border-right:0}}

/* Agenturen / White-Label */
.wl{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;border-top:1px solid var(--ink);padding-top:36px}
.wl h3,.sub{font-size:26px;margin:0 0 16px}
.ticks{list-style:none;margin:0;padding:0}
.ticks li{position:relative;padding:11px 0 11px 26px;border-bottom:1px solid var(--line);color:#333}
.ticks li::before{content:"";position:absolute;left:2px;top:22px;width:10px;height:1px;background:var(--ink)}
.ticks li b{color:var(--ink);font-weight:600}
.sub{margin-top:72px}
.cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.case{background:var(--soft);padding:28px 26px}
.case p{margin:0;color:#333;font-size:16px}
.wl-cta{margin-top:44px}
@media (max-width:860px){.wl{grid-template-columns:1fr;gap:40px}.cases{grid-template-columns:1fr}}

/* Vorgehen */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;counter-reset:s}
.step{padding:0 28px 0 0;border-left:1px solid var(--ink);padding-left:22px}
.step h3{font-size:24px;margin:10px 0 8px}
.step p{margin:0;color:#333;font-size:16px}
.step b{font:500 12px/1 var(--sans);letter-spacing:.22em;color:var(--muted)}
@media (max-width:860px){.steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:36px}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}

/* Praxis */
.practice{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:64px}
.practice ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.practice li{padding:18px 0;border-bottom:1px solid var(--line);display:flex;gap:18px}
.practice li span{font-family:var(--serif);font-size:22px;line-height:1.2;min-width:1.6em;color:var(--muted)}
.story p{color:#333;margin:0 0 14px}
.story p:last-child{margin-bottom:0}
.list-label{font:500 12px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin:6px 0 16px}
@media (max-width:860px){.practice{grid-template-columns:1fr;gap:28px}}

/* Kontakt */
.contact{background:var(--ink);color:var(--paper);border:0;text-align:center}
.contact h2{font-size:clamp(32px,4vw,52px);margin:0 0 18px}
.contact p{opacity:.85;max-width:36em;margin:0 auto 34px}
.contact .mail{display:block;margin-top:22px;font-size:15px;opacity:.7}

/* Fuß */
footer{background:var(--ink);color:#bdbdbd;border-top:1px solid #2a2a2a;font-size:14px}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:26px;padding-bottom:26px}
footer a{color:#e8e8e8;text-decoration:none;margin-left:22px}
footer a:hover{text-decoration:underline}

/* Rechtstexte */
.legal{padding:72px 0 96px;border:0}
.legal .wrap{max-width:760px}
.legal h1{font-size:clamp(34px,4vw,48px);margin:0 0 28px}
.legal h2{font-size:24px;margin:36px 0 10px}
.legal p,.legal li{color:#333}
.draft{background:#fff6d6;border:1px solid #e9d27a;padding:12px 16px;font-size:14px;margin:0 0 28px}