/* dearpaw Design System: Schriften, Farben, Komponenten */

/* Schriften, lokal gehostet */
@font-face{font-family:"Fraunces";src:url(../fonts/fraunces-latin-full-normal.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Fraunces";src:url(../fonts/fraunces-latin-ext-full-normal.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Fraunces";src:url(../fonts/fraunces-latin-full-italic.woff2) format("woff2");font-weight:100 900;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Fraunces";src:url(../fonts/fraunces-latin-ext-full-italic.woff2) format("woff2");font-weight:100 900;font-style:italic;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Atkinson Hyperlegible Next";src:url(../fonts/atkinson-hyperlegible-next-latin-wght-normal.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Atkinson Hyperlegible Next";src:url(../fonts/atkinson-hyperlegible-next-latin-ext-wght-normal.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Atkinson Hyperlegible Next";src:url(../fonts/atkinson-hyperlegible-next-latin-wght-italic.woff2) format("woff2");font-weight:200 800;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Homemade Apple";src:url(../fonts/homemade-apple-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}

/* Farben und Maße */
:root{
	--dp-papier:#f8f5ef;--dp-briefbogen:#fdfbf7;--dp-wiesenhauch:#ecefe6;--dp-himmelhauch:#e6ecf5;
	--dp-linie:#cbc3b3;--dp-linie-zart:#e0dcd2;--dp-tinte:#2a2320;--dp-tinte-weich:#5a4f47;--dp-erde:#3a2f28;
	--dp-moos:#3f4d3a;--dp-moos-tief:#34412f;--dp-moos-hell:#d6dfcc;
	--dp-blau:#8fa8d8;--dp-blau-tief:#3e5a8c;--dp-salbei:#9daf8a;
	--dp-display:"Fraunces",Georgia,"Times New Roman",serif;
	--dp-body:"Atkinson Hyperlegible Next","Atkinson Hyperlegible",system-ui,sans-serif;
	--dp-hand:"Homemade Apple","Segoe Script",cursive;
	--dp-schatten-papier:0 1px 2px rgba(58,47,40,.08),0 18px 40px rgba(58,47,40,.10);
	--dp-schatten-karte:0 10px 24px rgba(58,47,40,.16);
}

/* Grundlage, überschreibt Kadence */
body,body.content-style-unboxed .site{background:var(--dp-papier)}
body{font-family:var(--dp-body);color:var(--dp-tinte);font-size:19px;line-height:1.7}
h1,h2,h3,h4,.dp-display{font-family:var(--dp-display);font-variation-settings:"SOFT" 100;font-weight:400;color:var(--dp-tinte);letter-spacing:-.01em}
h1{font-size:clamp(46px,6vw,78px);line-height:1.04}
h2{font-size:clamp(34px,4vw,48px);line-height:1.1}
h3{font-size:28px;line-height:1.25;font-weight:500}
a{color:var(--dp-blau-tief)}a:hover{color:var(--dp-tinte)}
:where(a,button,input,summary,select,textarea):focus-visible{outline:2px solid var(--dp-blau-tief);outline-offset:3px}
.dp-hand{font-family:var(--dp-hand);line-height:1.5}
.dp-etikett{font-size:14px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--dp-tinte-weich)}
.dp-leise{color:var(--dp-tinte-weich)}
.dp-zitat{font-family:var(--dp-display);font-variation-settings:"SOFT" 100;font-style:italic;font-size:27px;line-height:1.35;border-top:1px solid #c3c9b6;padding-top:22px;margin:0}

/* Abschnitte */
.dp-abschnitt{padding-block:112px}
.dp-wiesenhauch{background:var(--dp-wiesenhauch)}
.dp-himmelhauch{background:var(--dp-himmelhauch)}
.dp-moos{background:var(--dp-moos);color:var(--dp-papier)}
.dp-moos h2,.dp-moos h3{color:var(--dp-papier)}
.dp-moos .dp-etikett{color:var(--dp-moos-hell)}
.dp-relativ{position:relative;overflow:hidden}

/* Buttons */
.dp-btn,.wp-block-button.is-style-dp .wp-block-button__link{display:inline-block;background:var(--dp-moos);color:var(--dp-papier)!important;border:0;border-radius:999px;padding:19px 32px;font-family:var(--dp-body);font-weight:600;font-size:18px;line-height:1.3;text-decoration:none;min-height:56px;box-sizing:border-box;cursor:pointer}
.dp-btn:hover,.wp-block-button.is-style-dp .wp-block-button__link:hover{background:var(--dp-moos-tief)}
.dp-btn-zweit{display:inline-block;background:transparent;color:var(--dp-moos)!important;border:1.5px solid var(--dp-moos);border-radius:999px;padding:17px 28px;font-weight:600;font-size:18px;text-decoration:none}
.dp-btn-hell{background:var(--dp-papier);color:var(--dp-tinte)!important}
.dp-btn-hell:hover{background:#fff}
.dp-link{color:var(--dp-blau-tief);text-decoration:underline wavy var(--dp-blau);text-decoration-thickness:1.5px;text-underline-offset:6px}
.dp-welle{text-decoration:underline wavy var(--dp-blau);text-decoration-thickness:3px;text-underline-offset:14px;text-decoration-skip-ink:none}

/* Papier und Karten */
.dp-brief{position:relative;background:var(--dp-briefbogen);border-radius:2px;padding:56px 56px 44px;box-shadow:var(--dp-schatten-papier);font-size:19px;line-height:1.75}
.dp-brief-kopf{display:flex;justify-content:space-between;align-items:baseline;gap:16px;border-bottom:1px solid var(--dp-linie);padding-bottom:16px;margin-bottom:20px}
.dp-brief-tag{font-family:var(--dp-display);font-variation-settings:"SOFT" 100;font-style:italic;font-size:26px}
.dp-stempel{position:absolute;top:-34px;right:-26px;width:120px;height:120px;transform:rotate(-12deg);opacity:.85}
.dp-karte{background:var(--dp-briefbogen);border-radius:2px;box-shadow:var(--dp-schatten-papier);padding:44px}
.dp-mockup-flaeche{background:var(--dp-himmelhauch);border-radius:2px;padding:36px;display:flex;justify-content:center;align-items:center;min-height:396px;box-sizing:border-box}
.dp-foto{border-radius:2px;box-shadow:var(--dp-schatten-karte)}

/* Briefmarke mit Zackenrand */
.dp-marke-schatten{filter:drop-shadow(0 16px 26px rgba(58,47,40,.14))}
.dp-marke{background:var(--dp-briefbogen);padding:21px;-webkit-mask:radial-gradient(7px,#0000 97%,#000) round -10.5px -10.5px/21px 21px,linear-gradient(#000 0 0) no-repeat 50%/calc(100% - 21px) calc(100% - 21px);mask:radial-gradient(7px,#0000 97%,#000) round -10.5px -10.5px/21px 21px,linear-gradient(#000 0 0) no-repeat 50%/calc(100% - 21px) calc(100% - 21px)}
.dp-marke-innen{border:1px solid var(--dp-linie);padding:44px 36px}

/* Liste mit Blüte */
.dp-bluetenliste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.dp-bluetenliste li{display:flex;gap:14px;align-items:center}
.dp-bluetenliste li::before{content:"";flex:none;width:22px;height:20px;background:url(../img/bluete.png) center/contain no-repeat}

/* Zeitleiste */
.dp-zeitleiste{list-style:none;margin:0;padding:0 0 0 32px;border-left:1px solid #b9c2ad}
.dp-zeitleiste li{position:relative;display:grid;grid-template-columns:160px minmax(0,1fr);gap:20px;padding:0 0 34px}
.dp-zeitleiste li:last-child{padding-bottom:0}
.dp-zeitleiste li::before{content:"";position:absolute;left:-40px;top:10px;width:15px;height:15px;border-radius:999px;background:var(--dp-blau);border:3px solid var(--dp-wiesenhauch)}
.dp-zeitleiste li:last-child::before{background:var(--dp-blau-tief)}
.dp-zeitleiste .dp-tag{font-family:var(--dp-display);font-variation-settings:"SOFT" 100;font-style:italic;font-size:25px;color:var(--dp-blau-tief)}
@media (max-width:600px){.dp-zeitleiste li{grid-template-columns:1fr;gap:4px}}

/* Häufige Fragen */
.dp-fragen details{border-top:1px solid var(--dp-linie-zart);padding:4px 0}
.dp-fragen details:last-child{border-bottom:1px solid var(--dp-linie-zart)}
.dp-fragen summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:18px 0;font-weight:600}
.dp-fragen summary::-webkit-details-marker{display:none}
.dp-fragen summary::after{content:"+";font-size:28px;font-weight:400;color:var(--dp-blau-tief);transition:transform .2s}
.dp-fragen details[open] summary::after{transform:rotate(45deg)}

/* Formular */
.dp-feld{display:flex;flex-direction:column;gap:8px}
.dp-feld label{font-size:16px;font-weight:600}
.dp-feld input{font:inherit;font-size:19px;padding:14px 18px;border:1px solid #a49c8e;border-radius:10px;background:#fff;min-height:54px;box-sizing:border-box}

/* Natur und Pfoten */
.dp-wiese{height:240px;background:var(--dp-papier) url(../img/wiesenrand.webp) repeat-x left bottom/auto 220px;position:relative;overflow:hidden}
.dp-pfotenspur svg{position:absolute;fill:var(--dp-tinte-weich)}
.dp-deko{pointer-events:none;position:absolute}

/* Bewegung nur, wenn gewünscht */
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Seitenaufbau für Block-Inhalte */
.dp-seite{overflow-x:hidden}
.dp-seite > .wp-block-group{margin:0}
.dp-innen{max-width:1180px;margin-inline:auto;padding-inline:32px;box-sizing:border-box}
.dp-innen-schmal{max-width:860px;margin-inline:auto;padding-inline:32px;box-sizing:border-box}
.dp-seite .wp-block-columns{gap:72px;margin-bottom:0}
.dp-seite p{margin-block:0 18px}
.dp-seite h1,.dp-seite h2{margin-block:0 22px}
.dp-einstieg{font-size:22px;line-height:1.6;max-width:36ch}
.dp-hinweis{font-size:16px;color:var(--dp-tinte-weich)}
.dp-hero{padding-block:88px 136px}
.dp-hero-bild{position:relative;margin-bottom:48px}
.dp-hero-bild > img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:2px;box-shadow:var(--dp-schatten-karte)}
.dp-hero-bild::after{content:"";position:absolute;inset:16px;border:1px solid rgba(253,251,247,.75);pointer-events:none}
.dp-hero-strauss{position:absolute;right:-54px;bottom:-64px;width:170px;transform:rotate(14deg);z-index:2}
.dp-hero-brief{position:absolute;left:-72px;bottom:-48px;width:300px;background:var(--dp-briefbogen);border-radius:2px;padding:26px 28px 20px;box-shadow:0 1px 2px rgba(58,47,40,.10),0 22px 40px rgba(58,47,40,.18);transform:rotate(-3deg);font-size:15px;line-height:1.6;z-index:3}
.dp-hero-brief p{margin:0 0 8px}
@media (max-width:781px){.dp-hero-brief{position:relative;left:auto;bottom:auto;width:auto;margin:-60px 16px 0}.dp-hero-strauss{width:110px;right:-10px;bottom:-30px}.dp-hero{padding-block:48px 72px}}
.dp-buttons{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin:6px 0 16px}
.dp-szenen{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr));gap:40px 64px;max-width:980px;margin-bottom:48px}
.dp-gruen-linie{border-left-color:#b9c2ad}
.dp-pfotenspur{position:absolute;right:2%;top:40px;width:260px;height:560px;pointer-events:none}
.dp-gutschein{filter:drop-shadow(0 14px 24px rgba(0,0,0,.28));transform:rotate(-3deg);display:flex;justify-content:center}
.dp-gutschein .dp-marke{background:var(--dp-himmelhauch)}
.dp-gutschein .dp-marke-innen{border-color:var(--dp-blau);display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;color:var(--dp-tinte);min-width:260px;padding:32px 44px}
.dp-preis{font-family:var(--dp-display);font-variation-settings:"SOFT" 100;font-size:76px;line-height:1}
.dp-mockups{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:48px}
.dp-moos a:not(.dp-btn){color:var(--dp-papier)}
.dp-pfotenspur span{position:absolute;display:block;background:url(../img/pfote-weich.svg) center/contain no-repeat}
.dp-pfote-sig{display:inline-block;width:22px;height:22px;background:url(../img/pfote-weich.svg) center/contain no-repeat;opacity:.8}