/*
Theme Name: oddBits v2
Theme URI: https://oddbits.de
Author: oddBits
Description: Website v2 von oddBits.de als Block-Theme: Wabenkarte, Produkte als eigener Beitragstyp, Insekten-Feldnotizen, Hell/Dunkel-Umschalter.
Version: 1.2
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: oddbits
*/

:root{
  --ob-paper:oklch(0.94 0.022 100);--ob-card:oklch(0.97 0.012 95);--ob-ink:oklch(0.25 0.03 150);--ob-muted:oklch(0.4 0.03 150);
  --ob-line:oklch(0.82 0.03 115);--ob-grid:#b9bd9c;--ob-accent:oklch(0.48 0.16 295);--ob-accent-fill:oklch(0.48 0.16 295);
  --ob-amber:oklch(0.86 0.1 80);--ob-piece:oklch(0.97 0.012 95);--ob-piece-ink:oklch(0.25 0.03 150);--ob-piece-shadow:oklch(0.35 0.12 295);
  --ob-band:oklch(0.25 0.03 150);--ob-band-ink:oklch(0.94 0.02 100);--ob-band-muted:oklch(0.8 0.02 110);--ob-band-line:#455443;--ob-band-accent:oklch(0.8 0.12 295);
  --ob-hex:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);
  --ob-mono:"IBM Plex Mono",ui-monospace,monospace;--ob-display:"Barlow Condensed","Arial Narrow",sans-serif;
  --ob-hexgrid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='103.92'%3E%3Cpath d='M30 0L60 17.32V51.96L30 69.28L0 51.96V17.32Z M30 69.28V103.92' fill='none' stroke='black' stroke-width='0.5'/%3E%3C/svg%3E");
  --ob-pad:clamp(20px,4vw,48px);
  color-scheme:light;
}
[data-theme="dark"]{
  --ob-paper:oklch(0.2 0.018 150);--ob-card:oklch(0.25 0.02 150);--ob-ink:oklch(0.93 0.02 100);--ob-muted:oklch(0.78 0.02 110);
  --ob-line:oklch(0.33 0.025 140);--ob-grid:#3b4639;--ob-accent:oklch(0.78 0.13 295);--ob-accent-fill:oklch(0.62 0.16 295);
  --ob-amber:oklch(0.8 0.11 80);--ob-piece:oklch(0.93 0.02 95);--ob-piece-ink:oklch(0.22 0.02 150);--ob-piece-shadow:oklch(0.45 0.16 295);
  --ob-band:oklch(0.15 0.015 150);--ob-band-line:#2c3a2b;
  color-scheme:dark;
}
body{transition:background-color .3s ease,color .3s ease;}
.wp-site-blocks{min-height:100vh;display:flex;flex-direction:column;}
.admin-bar .wp-site-blocks{min-height:calc(100vh - 32px);}
@media (max-width:782px){.admin-bar .wp-site-blocks{min-height:calc(100vh - 46px);}}
.wp-site-blocks>*+*{margin-block-start:0;}
.wp-site-blocks>main,.wp-site-blocks>.wp-block-group{flex:1;}
a{text-underline-offset:3px;}

/* Header */
.ob-header{padding:24px var(--ob-pad);gap:16px 32px;}
.ob-header .wp-block-site-title{margin:0;font-family:var(--ob-display);font-weight:700;font-size:26px;text-transform:uppercase;letter-spacing:.04em;line-height:1;}
.ob-header .wp-block-site-title a{display:inline-flex;align-items:center;gap:10px;color:var(--ob-ink);text-decoration:none;}
.ob-header .wp-block-site-title a::before{content:"";width:18px;height:21px;background:var(--ob-accent-fill);clip-path:var(--ob-hex);}
.ob-header-right{gap:clamp(12px,2vw,24px);}
.ob-nav{font-family:var(--ob-display);font-weight:600;font-size:17px;text-transform:uppercase;letter-spacing:.06em;gap:clamp(16px,3vw,32px);}
.ob-nav a{color:var(--ob-ink);text-decoration:none;}
.ob-nav a:hover,.ob-nav .current-menu-item>a,.ob-nav [aria-current="page"]{color:var(--ob-accent);}
.wp-block-navigation__responsive-container.is-menu-open{background:var(--ob-paper)!important;color:var(--ob-ink)!important;}
.ob-modus{display:flex;align-items:center;}
.ob-modus-btn{width:44px;height:44px;display:grid;place-items:center;padding:0;border:0;background:none;cursor:pointer;}
.ob-modus-btn span{width:20px;height:20px;border-radius:50%;border:1.5px solid var(--ob-ink);box-sizing:border-box;transition:box-shadow .2s ease;}
.ob-modus-btn--light span{background:#f3f1e4;}
.ob-modus-btn--dark span{background:#1c261b;}
.ob-modus-btn[aria-pressed="true"] span{box-shadow:0 0 0 3px var(--ob-paper),0 0 0 5px var(--ob-accent-fill);}
.ob-modus-btn:focus-visible{outline:2px solid var(--ob-accent);outline-offset:-4px;border-radius:50%;}

/* Footer */
.ob-footer{padding:20px var(--ob-pad);gap:12px 24px;font-family:var(--ob-mono);font-size:12px;color:var(--ob-muted);}
.ob-footer p{margin:0;}
.ob-footer a{color:var(--ob-muted);text-decoration:none;}
.ob-footer a:hover{color:var(--ob-accent);}
.ob-footer .wp-block-navigation{gap:20px;font-size:12px;}

/* Shared */
.ob-main{padding-block:clamp(32px,6vw,72px) clamp(64px,9vw,112px);}
.ob-kicker,.is-style-ob-kicker{font-family:var(--ob-mono);font-size:.75rem;line-height:1.5;color:var(--ob-accent);margin:0;}
.ob-sub{font-family:var(--ob-display);font-weight:600;font-size:clamp(20px,2.4vw,28px);line-height:1.1;text-transform:uppercase;letter-spacing:.02em;text-wrap:balance;}
.ob-lead{font-size:clamp(17px,1.6vw,20px);line-height:1.6;max-width:620px;text-wrap:pretty;}
.ob-arrowlink a{font-family:var(--ob-display);font-weight:600;font-size:17px;text-transform:uppercase;letter-spacing:.06em;text-decoration:none;color:var(--ob-accent);}
.is-style-ob-card{background:var(--ob-card);border-radius:20px;padding:clamp(24px,4vw,40px);box-shadow:0 5px 0 var(--ob-line);}
h1,h2,h3,h4{text-wrap:balance;}
p{text-wrap:pretty;}
.ob-editor-ph{padding:24px;border:1.5px dashed var(--ob-line);border-radius:12px;font-family:var(--ob-mono);font-size:12px;color:var(--ob-muted);}

/* Wabenkarte */
.ob-front{padding:0;display:flex;flex-direction:column;}
.ob-front>.ob-map-hero{flex:1;}
.ob-map-hero{--ob-intro-w:clamp(440px,29vw,640px);display:grid;grid-template-columns:var(--ob-intro-w) 1fr;min-height:clamp(560px,74vh,760px);transition:grid-template-columns .7s cubic-bezier(.65,0,.25,1);}
.ob-map-hero.is-focus{grid-template-columns:0px 1fr;}
.ob-map-intro{min-width:0;overflow:hidden;display:flex;align-items:center;}
.ob-map-intro-inner{width:var(--ob-intro-w);flex:none;padding:0 40px 40px var(--ob-pad);box-sizing:border-box;transition:opacity .4s ease;}
.ob-map-intro-inner h1{font-size:clamp(60px,3.6vw,84px);line-height:.98;margin-block:20px;}
.is-focus .ob-map-intro-inner{opacity:0;}
.ob-map{position:relative;min-width:0;min-height:560px;overflow:hidden;}
.ob-board{position:absolute;inset:0;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(to bottom,transparent,#000 14%,#000 86%,transparent);}
.ob-cluster{position:absolute;left:calc(50% - 1800px);top:calc(50% - 896px);width:3600px;height:1800px;transition:left .7s cubic-bezier(.65,0,.25,1);transform:scale(var(--ob-s,1));}
.ob-cluster::before{content:"";position:absolute;inset:0;background:var(--ob-grid);-webkit-mask:var(--ob-hexgrid) 975px 550px/150px 259.8px repeat;mask:var(--ob-hexgrid) 975px 550px/150px 259.8px repeat;}
.ob-piece{position:absolute;left:calc(var(--x) + 900px);top:calc(var(--y) + 600px);width:150px;height:173px;padding:16px;box-sizing:border-box;text-decoration:none;}
.ob-piece-face{position:relative;width:100%;height:100%;clip-path:var(--ob-hex);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;padding:0 14px;box-sizing:border-box;}
.ob-piece--product{transition:transform .3s cubic-bezier(.2,.8,.2,1);}
.ob-piece--product:hover,.ob-piece--product:has(.ob-piece-link:focus-visible){transform:translateY(-7px);}
.ob-piece-link{position:relative;display:block;width:100%;height:100%;padding:0;border:0;background:none;font:inherit;color:inherit;text-decoration:none;text-align:inherit;cursor:pointer;isolation:isolate;filter:drop-shadow(0 5px 0 var(--ob-piece-shadow));}
.ob-piece-link:focus-visible{outline:none;}
.ob-piece-link::before{content:"";position:absolute;inset:-7px -8px;clip-path:var(--ob-hex);background:var(--ob-accent);z-index:-1;opacity:0;}
.ob-piece-link:focus-visible::before{opacity:1;}
.ob-info-btn{position:absolute;left:91px;top:122px;z-index:2;width:30px;height:30px;padding:0;display:grid;place-items:center;border-radius:50%;border:2px solid var(--ob-band-accent);background:var(--ob-band);color:var(--ob-band-accent);font:500 14px/1 var(--ob-mono);cursor:pointer;transition:background .2s ease,color .2s ease,transform .2s ease;}
.ob-info-btn::before{content:"";position:absolute;inset:-7px;border-radius:50%;}
.ob-info-btn:hover,.ob-info-btn:focus-visible{background:var(--ob-band-accent);color:var(--ob-band);transform:scale(1.12);}
.ob-info-btn:focus-visible{outline:3px solid var(--ob-accent);outline-offset:3px;}
.ob-piece--product .ob-piece-face{background:var(--ob-piece);color:var(--ob-piece-ink);}
.ob-piece-icon{width:36px;height:36px;color:oklch(0.45 0.16 295);}
.ob-piece-name{font-family:var(--ob-display);font-weight:700;font-size:20px;line-height:1.05;text-transform:uppercase;letter-spacing:.03em;}
.ob-piece--ext .ob-piece-face::after{content:"↗";position:absolute;top:15%;left:50%;transform:translateX(-50%);font-family:var(--ob-mono);font-size:13px;line-height:1;color:var(--ob-muted);}
.ob-piece-sub{display:block;max-height:0;opacity:0;overflow:hidden;font-family:var(--ob-mono);font-size:9.5px;line-height:1.3;color:oklch(0.4 0.03 150);transition:max-height .3s ease,opacity .3s ease;}
.is-focus .ob-piece-sub{max-height:3em;opacity:1;}
@media (hover:hover){.ob-piece--product:hover .ob-piece-sub,.ob-piece--product:has(.ob-piece-link:focus-visible) .ob-piece-sub{max-height:3em;opacity:1;}}
.ob-piece--brand .ob-piece-face{background:var(--ob-accent-fill);}
.ob-piece--loose{padding:24px;transform:rotate(11deg);}
.ob-piece--loose .ob-piece-face{background:var(--ob-amber);color:oklch(0.25 0.04 60);font-family:var(--ob-display);font-weight:600;font-size:15px;text-transform:uppercase;letter-spacing:.05em;}
.ob-map-fade{position:absolute;left:0;top:0;bottom:0;width:180px;background:linear-gradient(to right,var(--ob-paper),transparent);pointer-events:none;transition:opacity .5s ease;}
.is-focus .ob-map-fade{opacity:0;}
.ob-map-toggle{position:absolute;left:20px;top:50%;transform:translateY(-50%);height:44px;padding:0 18px;border:0;border-radius:22px;background:var(--ob-ink);color:var(--ob-paper);font-family:var(--ob-display);font-weight:600;font-size:16px;text-transform:uppercase;letter-spacing:.06em;cursor:pointer;box-shadow:0 4px 0 var(--ob-accent-fill);transition:transform .2s ease;}
.ob-map-toggle:hover{transform:translateY(calc(-50% - 2px));}
@media (min-width:1280px) and (min-height:700px){.ob-map{--ob-s:1.1;}}
@media (min-width:1500px) and (min-height:760px){.ob-map{--ob-s:1.25;}}
@media (min-width:1800px) and (min-height:900px){.ob-map{--ob-s:1.5;}}
@media (min-width:2300px) and (min-height:1150px){.ob-map{--ob-s:1.9;}}
.ob-map--voll{--ob-s:1!important;}
@media (min-width:2300px) and (min-height:1150px){.ob-map--voll{--ob-s:1.3!important;}}
@media (max-width:781px){
  .ob-map-hero{display:block;min-height:0;}
  .ob-map-intro-inner{width:auto;flex:1 1 auto;min-width:0;padding:12px var(--ob-pad) 0;}
  .ob-map-intro-inner h1{font-size:40px;margin-block:10px;}
  .ob-map{height:460px;min-height:0;}
  .ob-board{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 16%,#000 84%,transparent);mask-image:linear-gradient(to bottom,transparent,#000 16%,#000 84%,transparent);}
  .ob-cluster{left:calc(50% - 1095px);top:-600px;transition:none;}
  .ob-cluster::before{-webkit-mask:var(--ob-hexgrid) 930px 560px/104px 180.13px repeat;mask:var(--ob-hexgrid) 930px 560px/104px 180.13px repeat;}
  .ob-piece{left:calc(var(--mx) + 900px);top:calc(var(--my) + 600px);width:104px;height:120px;padding:10px;}
  .ob-piece--loose{padding:18px;}
  .ob-piece-icon{width:26px;height:26px;}
  .ob-piece-name{font-size:16px;}
  .ob-piece-sub,.ob-map-toggle,.ob-map-fade,.ob-info-btn{display:none!important;}
  .ob-piece--product:hover,.ob-piece--product:has(.ob-piece-link:focus-visible){transform:none;}
}

/* Info-Popup einer Wabe: Dialog am Desktop, Bottom Sheet am Handy */
.ob-info{padding:0;border:0;background:transparent;color:var(--ob-ink);width:min(520px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);overflow:visible;}
.ob-info::backdrop{background:oklch(0.15 0.015 150 / .55);backdrop-filter:blur(2px);}
.ob-info[open]{animation:ob-pop .22s cubic-bezier(.2,.8,.2,1);}
@keyframes ob-pop{from{opacity:0;transform:translateY(10px) scale(.98);}to{opacity:1;transform:none;}}
.ob-info-inner{position:relative;padding:28px 28px 26px;background:var(--ob-card);border-radius:20px;box-shadow:0 5px 0 var(--ob-accent-fill),0 18px 40px rgb(0 0 0 / .25);}
.ob-info-head{display:flex;align-items:center;gap:16px;padding-right:44px;}
.ob-info-hex{flex:none;width:64px;height:74px;clip-path:var(--ob-hex);background:color-mix(in oklch,var(--ob-accent-fill) 16%,var(--ob-card));display:grid;place-items:center;}
.ob-info-hex svg{width:34px;height:34px;color:var(--ob-accent);}
.ob-info h2{margin:0;font-family:var(--ob-display);font-weight:700;font-size:34px;line-height:1;text-transform:uppercase;letter-spacing:.01em;}
.ob-info-sub{margin:4px 0 0;font-family:var(--ob-mono);font-size:12px;line-height:1.4;color:var(--ob-muted);}
.ob-info-status{display:inline-block;margin-top:8px;padding:2px 10px;border-radius:999px;background:var(--ob-amber);color:oklch(0.28 0.05 60);font-family:var(--ob-mono);font-size:11px;line-height:1.6;}
.ob-info-text{margin:18px 0 0;font-size:16px;line-height:1.55;}
.ob-info-actions{margin-top:22px;display:flex;flex-wrap:wrap;gap:10px;}
.ob-info-close{position:absolute;top:14px;right:14px;width:44px;height:44px;border-radius:50%;border:1.5px solid var(--ob-line);background:transparent;color:var(--ob-ink);font:400 16px/1 var(--ob-mono);cursor:pointer;}
.ob-info-close:hover{border-color:var(--ob-ink);}
.ob-info-close:focus-visible,.ob-info .ob-btn:focus-visible{outline:3px solid var(--ob-accent);outline-offset:3px;}
.ob-info .ob-btn.is-pending{background:transparent;color:var(--ob-ink);box-shadow:none;}
.ob-info-grip{display:none;}
@media (max-width:781px){
  .ob-info{width:100%;margin:auto 0 0;max-height:92dvh;}
  .ob-info[open]{animation:ob-sheet .28s cubic-bezier(.2,.8,.2,1);}
  @keyframes ob-sheet{from{transform:translateY(100%);}to{transform:none;}}
  .ob-info-inner{padding:14px 20px calc(24px + env(safe-area-inset-bottom));border-radius:24px 24px 0 0;box-shadow:0 -5px 0 var(--ob-accent-fill);}
  .ob-info-grip{display:block;width:44px;height:5px;margin:0 auto 14px;border-radius:3px;background:var(--ob-line);}
  .ob-info-close{top:18px;right:14px;}
  .ob-info-actions{flex-direction:column;}
  .ob-info-actions .ob-btn{width:100%;justify-content:center;height:52px;}
}
@media (prefers-reduced-motion:reduce){.ob-info[open]{animation:none;}.ob-piece-sub,.ob-info-btn{transition:none;}}

/* Legende unter dem Intro der Startseite */
.ob-legend{list-style:none;margin:28px 0 0;padding:20px 0 0;border-top:1.5px solid var(--ob-line);display:grid;gap:12px;font-family:var(--ob-mono);font-size:13px;line-height:1.4;color:var(--ob-muted);}
.ob-legend li{display:flex;align-items:center;gap:12px;margin:0;}
.ob-legend-hex{flex:none;width:22px;height:25px;background:var(--ob-piece);clip-path:var(--ob-hex);outline:1px solid var(--ob-line);}
.ob-legend-i{flex:none;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--ob-accent);color:var(--ob-accent);display:grid;place-items:center;font-size:12px;line-height:1;}
.ob-legend .only-m{display:none;}
@media (max-width:781px){.ob-legend .only-d{display:none;}.ob-legend .only-m{display:flex;}.ob-legend{margin-top:14px;padding-top:14px;}}

/* Produktkopf */
.ob-pkopf{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:clamp(32px,5vw,64px);align-items:center;padding-block:clamp(8px,3vw,32px) clamp(24px,4vw,48px);}
.ob-pkopf::before{content:"";position:absolute;inset:-40px calc(-1 * var(--ob-pad));background:var(--ob-grid);-webkit-mask:var(--ob-hexgrid) 0 0/150px 259.8px repeat,radial-gradient(ellipse 60% 80% at 75% 45%,#000 20%,transparent 75%);-webkit-mask-composite:source-in;mask:var(--ob-hexgrid) 0 0/150px 259.8px repeat,radial-gradient(ellipse 60% 80% at 75% 45%,#000 20%,transparent 75%);mask-composite:intersect;z-index:-1;opacity:.8;}
.ob-pkopf-text{display:flex;flex-direction:column;gap:22px;}
.ob-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-family:var(--ob-mono);font-size:12px;}
.ob-crumbs a{color:var(--ob-muted);text-decoration:none;}
.ob-badge{margin-left:8px;padding:4px 10px;border-radius:999px;background:var(--ob-amber);color:oklch(0.28 0.05 60);}
.ob-pkopf-title{display:flex;align-items:flex-end;gap:18px;}
.ob-pkopf-title h1{margin:0;font-size:clamp(72px,11vw,128px);line-height:.85;}
.ob-pkopf-icon{width:56px;height:56px;flex:none;margin-bottom:4px;color:var(--ob-accent);}
.ob-pkopf-sub{margin:0;font-family:var(--ob-display);font-weight:600;font-size:clamp(22px,2.6vw,30px);line-height:1.1;text-transform:uppercase;letter-spacing:.02em;}
.ob-pkopf-lead{margin:0;font-size:18px;line-height:1.6;max-width:460px;}
.ob-pkopf-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px;}
.ob-btn{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 22px;border-radius:24px;box-sizing:border-box;border:1.5px solid var(--ob-ink);color:var(--ob-ink);font-family:var(--ob-display);font-weight:600;font-size:17px;text-transform:uppercase;letter-spacing:.06em;text-decoration:none;transition:transform .2s ease;}
.ob-btn--primary{background:var(--ob-ink);color:var(--ob-paper);box-shadow:0 4px 0 var(--ob-accent-fill);}
a.ob-btn:hover{transform:translateY(-2px);color:inherit;}
a.ob-btn--primary:hover{color:var(--ob-paper);}
.ob-btn--kofi{border-color:var(--ob-accent);color:var(--ob-accent);}
a.ob-btn--kofi:hover{background:var(--ob-accent-fill);color:var(--ob-paper);}
.ob-btn.is-pending{opacity:.55;cursor:default;}
.ob-btn small{font-family:var(--ob-mono);font-size:11px;text-transform:none;letter-spacing:0;opacity:.75;}
.ob-pkopf-media{display:flex;justify-content:center;}
.ob-pkopf-media img{width:min(70%,260px);height:auto;border-radius:22px;border:6px solid var(--ob-ink);box-shadow:0 8px 0 var(--ob-accent-fill);transform:rotate(-3deg);}
.ob-produkt-main{padding-bottom:0;}
.wp-block-post-content.alignfull{margin-block-start:0;}
.wp-block-post-content>.wp-block-group.alignwide,.wp-block-post-content>.wp-block-details.alignwide{margin-block-start:clamp(56px,8vw,96px);}
.wp-block-post-content>.wp-block-group.alignwide:first-child{margin-block-start:clamp(24px,4vw,40px);}
.wp-block-post-content>.ob-insect+.ob-insect,.wp-block-post-content>.ob-sammlung-head+.ob-insect,.wp-block-post-content>.ob-insect+.ob-freeslot{margin-block-start:20px!important;}

/* Überblick / Funktionen */
.ob-overview{counter-reset:ob-f;}
.ob-features{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:0 40px;}
.ob-features>*{margin:0!important;}
.ob-feature{counter-increment:ob-f;position:relative;padding:20px 0 20px 34px;border-top:1px solid var(--ob-line);}
.ob-feature::before{content:counter(ob-f,decimal-leading-zero);position:absolute;left:0;top:24px;font-family:var(--ob-mono);font-size:12px;color:var(--ob-accent);}
.ob-feature h3{margin:0 0 6px;font-family:inherit;font-weight:600;font-size:17px;line-height:1.3;text-transform:none;letter-spacing:0;}
.ob-feature p{margin:0;font-size:15px;line-height:1.55;color:var(--ob-muted);}
.ob-more{border:0!important;margin-top:20px;}
.ob-more>summary{display:inline-flex!important;width:max-content;height:44px;align-items:center;padding:0 18px!important;border-radius:22px;border:1.5px solid var(--ob-ink);font-family:var(--ob-display);font-weight:600!important;font-size:16px;text-transform:uppercase;letter-spacing:.06em;gap:10px;}
.ob-more>summary::after{order:-1;}
.ob-more>.ob-features{margin-top:20px;max-width:none!important;color:inherit!important;font-size:inherit!important;}
.ob-overview{width:100%;}

/* Galerie */
.ob-gal-nav{display:flex;justify-content:flex-end;gap:10px;margin-bottom:12px;}
.ob-gal-nav button{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--ob-ink);background:transparent;color:var(--ob-ink);font-family:var(--ob-mono);font-size:18px;cursor:pointer;}
.ob-gal-nav button:last-child{background:var(--ob-ink);color:var(--ob-paper);box-shadow:0 3px 0 var(--ob-accent-fill);}
.wp-block-gallery.is-style-ob-scroll{display:flex!important;flex-wrap:nowrap!important;gap:24px!important;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:20px;scrollbar-width:thin;scrollbar-color:var(--ob-accent-fill) var(--ob-line);}
.wp-block-gallery.is-style-ob-scroll .wp-block-image{flex:none!important;width:auto!important;margin:0!important;scroll-snap-align:start;}
.wp-block-gallery.is-style-ob-scroll .wp-block-image img{height:clamp(320px,50vw,440px)!important;width:auto!important;object-fit:contain!important;border-radius:20px;border:5px solid var(--ob-ink);}
.wp-block-gallery.is-style-ob-scroll .wp-block-image figcaption{position:static!important;background:none!important;color:var(--ob-muted)!important;font-family:var(--ob-mono);font-size:12px;padding:10px 0 0!important;text-align:left!important;}

/* Steckbrief */
.ob-steckbrief>h2{font-size:32px;margin:0 0 28px;}
.ob-specs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:24px 32px;}
.ob-specs>*{margin:0!important;}
.ob-spec{display:grid;grid-template-columns:30px 1fr;gap:4px 14px;align-items:start;}
.ob-spec::before{content:"";grid-column:1;grid-row:1/span 2;width:30px;height:35px;background:var(--ob-accent-fill);clip-path:var(--ob-hex);}
.ob-spec>*{grid-column:2;margin:0!important;}
.ob-spec h3{font-size:20px;}
.ob-spec p{font-size:14px;line-height:1.5;color:var(--ob-muted);}
.ob-note{margin-top:28px!important;padding:16px 18px;border-radius:12px;background:color-mix(in oklch,var(--ob-amber) 40%,var(--ob-card));font-size:14px;line-height:1.55;}

/* FAQ / Details */
.wp-block-details{border-top:1px solid var(--ob-line);padding:0;}
.wp-block-details:not(:has(+ .wp-block-details)){border-bottom:1px solid var(--ob-line);}
.wp-block-details>summary{list-style:none;display:flex;justify-content:space-between;gap:16px;padding:16px 0;font-weight:600;font-size:16px;cursor:pointer;}
.wp-block-details>summary::-webkit-details-marker{display:none;}
.wp-block-details>summary::after{content:"+";font-family:var(--ob-mono);font-weight:400;}
.wp-block-details[open]>summary::after{content:"−";}
.wp-block-details>:not(summary){color:var(--ob-muted);font-size:15px;max-width:620px;}
.wp-block-details>:last-child{margin-bottom:18px;}
.ob-faq{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:32px 64px;align-items:start;}
.ob-faq>*{margin:0!important;}
.ob-faq-head p{font-size:15px;color:var(--ob-muted);}
.ob-faq-list{grid-column:span 2;min-width:min(100%,560px);}
.ob-faq-list>.wp-block-details{margin-block-start:0;}
.ob-faq-list>.ob-kicker{padding-bottom:10px;}
.ob-faq-list>.wp-block-details+.ob-kicker{margin-top:36px;}
@media (max-width:781px){.ob-faq-list{grid-column:auto;min-width:0;}}

/* Feldnotiz */
.ob-fieldnote{position:relative;background:var(--ob-band);color:var(--ob-band-ink);padding-block:clamp(40px,6vw,72px);margin-block-start:clamp(56px,8vw,96px)!important;}
.ob-fieldnote::before{content:"";position:absolute;inset:0;background:var(--ob-band-line);-webkit-mask:var(--ob-hexgrid) 0 0/150px 259.8px repeat;mask:var(--ob-hexgrid) 0 0/150px 259.8px repeat;}
.ob-fieldnote>*{position:relative;}
.ob-fieldnote-head{gap:16px;}
.ob-fieldnote .ob-kicker{color:var(--ob-band-accent);}
.ob-fieldnote .ob-insekt-icon svg{width:56px;height:56px;color:var(--ob-band-accent);}
.ob-fieldnote .wp-block-details{border:0!important;}
.ob-fieldnote .wp-block-details>summary{align-items:center;font-family:var(--ob-display);font-weight:700;font-size:clamp(32px,4vw,44px);line-height:1;text-transform:uppercase;}
.ob-fieldnote .wp-block-details>summary::after{width:44px;height:44px;flex:none;display:grid;place-items:center;border-radius:50%;border:1.5px solid var(--ob-band-muted);font-size:20px;}
.ob-fieldnote .wp-block-details>:not(summary){color:var(--ob-band-ink);max-width:none;font-size:16px;}
.ob-fieldnote a{color:var(--ob-band-accent);}
.ob-fieldnote-body{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:32px 64px;padding-top:28px;}
.ob-fieldnote-body>*{margin:0!important;}
.ob-fieldnote-text p+p{color:var(--ob-band-muted);}
.ob-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--ob-line);border-radius:16px;overflow:hidden;align-self:start;}
.ob-facts>*{margin:0!important;background:var(--ob-card);padding:16px 18px;}
.ob-fieldnote .ob-facts{background:var(--ob-band-line);}
.ob-fieldnote .ob-facts>*{background:var(--ob-band);}
.ob-fact-label{margin:0!important;font-family:var(--ob-mono);font-size:11px;color:var(--ob-muted);}
.ob-fieldnote .ob-fact-label{color:var(--ob-band-muted);}
.ob-fact-value{margin:4px 0 0!important;font-family:var(--ob-display);font-weight:600;font-size:22px;line-height:1.1;}

/* Insekten */
.ob-intro{position:relative;padding-bottom:clamp(40px,6vw,72px);}
.ob-intro::before{content:"";position:absolute;inset:-60px calc(-1 * var(--ob-pad)) 0;background:var(--ob-grid);-webkit-mask:var(--ob-hexgrid) 0 0/150px 259.8px repeat,radial-gradient(ellipse 55% 80% at 85% 40%,#000 15%,transparent 70%);-webkit-mask-composite:source-in;mask:var(--ob-hexgrid) 0 0/150px 259.8px repeat,radial-gradient(ellipse 55% 80% at 85% 40%,#000 15%,transparent 70%);mask-composite:intersect;z-index:-1;}
.ob-intro h1{font-size:clamp(56px,9vw,104px);line-height:.9;max-width:800px;}
.ob-reasons{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:24px 40px;margin-top:32px!important;max-width:960px;}
.ob-reasons>*{margin:0!important;padding-top:16px;border-top:1px solid var(--ob-line);}
.ob-reasons h3{font-size:22px;margin:0 0 6px;}
.ob-reasons p{margin:0;font-size:15px;color:var(--ob-muted);}
.ob-insect{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:28px 56px;margin-block-start:20px!important;}
.ob-insect>*{margin:0!important;}
.ob-insect-head{gap:18px;}
.ob-insect .ob-insekt-icon{width:84px;height:97px;flex:none;clip-path:var(--ob-hex);background:color-mix(in oklch,var(--ob-accent-fill) 14%,var(--ob-card));display:grid;place-items:center;}
.ob-insect .ob-insekt-icon svg{width:48px;height:48px;color:var(--ob-accent);}
.ob-insect-name>*{margin:0!important;}
.ob-insect h3{font-size:36px;}
.ob-latin{font-family:var(--ob-mono);font-size:12px;font-style:italic;color:var(--ob-muted);margin-top:4px!important;}
.ob-insekt-icon svg{display:block;}

/* Blog */
.ob-blog-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:clamp(24px,4vw,48px);}
.ob-blog-head>*{margin:0!important;}
.ob-blog-head h1{font-size:clamp(56px,8vw,88px);line-height:.9;margin:12px 0!important;}
.ob-chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0;font-family:var(--ob-mono);font-size:13px;}
.ob-chips li{margin:0;}
.ob-chips a{display:flex;align-items:center;height:36px;padding:0 14px;border-radius:18px;border:1.5px solid var(--ob-line);color:var(--ob-ink);text-decoration:none;box-sizing:border-box;}
.ob-chips .current-cat a{background:var(--ob-ink);border-color:var(--ob-ink);color:var(--ob-paper);}
.ob-postlist .wp-block-post-template{list-style:none;padding:0;margin:0;}
.ob-postlist .wp-block-post{margin:0;padding:28px 0;border-top:1px solid var(--ob-line);}
.ob-postlist .wp-block-post:last-child{border-bottom:1px solid var(--ob-line);}
.ob-postrow{gap:24px;align-items:center!important;}
.ob-postrow-text{flex:1;min-width:0;}
.ob-postrow-text>*{margin-block:0 10px;}
.ob-meta{gap:12px;font-family:var(--ob-mono);font-size:12px;color:var(--ob-muted);}
.ob-meta>*{margin:0!important;}
.ob-meta a{color:var(--ob-accent);text-decoration:none;}
.ob-postlist .wp-block-post-title{font-size:clamp(26px,3vw,34px);line-height:1.02;}
.ob-postlist .wp-block-post-title a{color:var(--ob-ink);text-decoration:none;}
.ob-postlist .wp-block-post-title a:hover{color:var(--ob-accent);}
.ob-postlist .wp-block-post-excerpt__excerpt{margin:0;color:var(--ob-muted);}
.wp-block-post-excerpt__more-link{display:inline-block;margin-top:10px;font-family:var(--ob-display);font-weight:600;font-size:16px;text-transform:uppercase;letter-spacing:.06em;text-decoration:none;}
.ob-hexthumb{flex:none;width:clamp(84px,14vw,140px);margin:0!important;}
.ob-hexthumb img{width:100%;height:auto!important;aspect-ratio:1/1.1547;object-fit:cover;clip-path:var(--ob-hex);}
.wp-block-query-pagination{justify-content:center;gap:8px;margin-top:40px;font-family:var(--ob-mono);font-size:14px;}
.wp-block-query-pagination a{text-decoration:none;color:var(--ob-ink);}
.wp-block-query-pagination .page-numbers{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;}
.wp-block-query-pagination .page-numbers.current{background:var(--ob-ink);color:var(--ob-paper);}

/* Beitrag */
.ob-postmeta{gap:12px;font-family:var(--ob-mono);font-size:12px;color:var(--ob-muted);}
.ob-postmeta>*{margin:0!important;}
.ob-postmeta a{color:var(--ob-accent);text-decoration:none;}
.ob-single .wp-block-post-title{font-size:clamp(44px,7vw,72px);line-height:.94;}
.ob-single-image img{border-radius:18px;}
.wp-block-post-content{font-size:17px;line-height:1.75;}
.wp-block-post-content h2{font-size:32px;margin-top:2em;}
.wp-block-quote{border-left:3px solid var(--ob-accent-fill);padding-left:24px;margin-block:2rem;}
.wp-block-quote p{font-family:var(--ob-display);font-weight:600;font-size:28px;line-height:1.2;text-transform:uppercase;}
.wp-block-quote cite{font-family:var(--ob-mono);font-size:12px;color:var(--ob-muted);}
.ob-single-foot{margin-top:48px!important;padding-top:28px;border-top:1px solid var(--ob-line);}
.ob-tags{display:flex;flex-wrap:wrap;gap:8px;font-family:var(--ob-mono);font-size:12px;}
.ob-tags .wp-block-post-terms__separator{display:none;}
.ob-tags a{display:inline-flex;align-items:center;height:32px;padding:0 12px;border-radius:16px;border:1.5px solid var(--ob-line);color:var(--ob-ink);text-decoration:none;}
.ob-postnav{margin-top:28px!important;gap:16px;}
.ob-postnav a{font-family:var(--ob-display);font-weight:700;font-size:20px;text-transform:uppercase;color:var(--ob-ink);text-decoration:none;}
.ob-postnav .post-navigation-link__label{display:block;font-family:var(--ob-mono);font-weight:400;font-size:11px;text-transform:none;color:var(--ob-muted);}

/* Textseiten */
.ob-page .wp-block-post-title{font-size:clamp(48px,7vw,72px);line-height:.92;padding-bottom:28px;border-bottom:1px solid var(--ob-line);margin-bottom:40px;}
.wp-block-post-content h3{font-family:inherit;font-weight:600;font-size:17px;text-transform:none;letter-spacing:0;line-height:1.4;}
.ob-hinweis{padding:16px 18px;border-radius:12px;background:var(--ob-card);font-size:15px;line-height:1.6;}
.ob-mailcard a{display:flex;align-items:center;gap:18px;padding:22px 24px;border-radius:18px;background:var(--ob-card);box-shadow:0 5px 0 var(--ob-accent-fill);color:var(--ob-ink);text-decoration:none;font-family:var(--ob-display);font-weight:700;font-size:clamp(24px,4vw,34px);line-height:1.1;text-transform:uppercase;letter-spacing:.02em;overflow-wrap:anywhere;transition:transform .2s ease;}
.ob-mailcard a::before{content:"";flex:none;width:40px;height:46px;background:var(--ob-accent-fill);clip-path:var(--ob-hex);}
.ob-mailcard a::after{content:"→";margin-left:auto;font-family:var(--ob-mono);font-weight:400;font-size:18px;}
.ob-mailcard a:hover{transform:translateY(-3px);color:var(--ob-ink);}

/* Hinweis WP Statistics */
.ob-notice{display:none!important;position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:100;width:min(640px,calc(100% - 32px));box-sizing:border-box;margin:0!important;padding:18px 20px;gap:14px 24px;align-items:center;justify-content:space-between;background:var(--ob-card);color:var(--ob-ink);border-radius:16px;box-shadow:0 5px 0 var(--ob-accent-fill),0 12px 32px rgb(0 0 0 / .2);font-size:14px;line-height:1.55;}
.ob-notice-show .ob-notice{display:flex!important;}
.ob-notice p{margin:0;flex:1 1 260px;}
.ob-notice p a{color:var(--ob-accent);text-decoration:underline;}
.ob-notice .wp-block-buttons{margin:0;flex:none;}
.ob-notice .wp-block-button__link{cursor:pointer;font-size:15px;padding:.55em 1.3em;}
.editor-styles-wrapper .ob-notice{display:flex!important;position:static;transform:none;width:auto;margin:24px auto!important;}

/* FAQ-Gruppen */
.ob-faq-list:has(>.ob-faq-group){display:flex;flex-direction:column;gap:36px;}
.ob-faq-group>*{margin:0!important;}
.ob-faq-group>.ob-kicker,.ob-faq-group>.is-style-ob-kicker{padding-bottom:10px;}
.ob-faq-list>.is-style-ob-kicker{padding-bottom:10px;}
.ob-faq-list>.wp-block-details+.is-style-ob-kicker{margin-top:36px;}
.ob-fieldnote .is-style-ob-kicker{color:var(--ob-band-accent);}
/* Abschnitt */
.ob-section>h2{margin:0 0 28px;}
.ob-section>*{margin-block-start:0;}
.wp-block-oddbits-faq-liste>*{margin-block:0!important;}
.wp-block-oddbits-faq-liste>.block-list-appender{position:static;margin-top:12px!important;}

/* Feldnotiz: Breite unabhängig vom Layout-System */
.wp-block-post-content>.ob-fieldnote,.ob-fieldnote.alignfull{width:auto;max-width:none!important;margin-left:calc(var(--wp--style--root--padding-left,0px) * -1)!important;margin-right:calc(var(--wp--style--root--padding-right,0px) * -1)!important;padding-left:var(--ob-pad)!important;padding-right:var(--ob-pad)!important;box-sizing:border-box;}
.ob-fieldnote>.ob-fieldnote-inner,.ob-fieldnote>.wp-block-group{width:100%;max-width:1120px!important;margin-left:auto!important;margin-right:auto!important;box-sizing:border-box;}
.ob-fieldnote-head{display:flex;align-items:center;gap:16px;margin-bottom:8px;}
.ob-fieldnote-head>*{margin:0!important;}
.ob-fieldnote .wp-block-details>summary{gap:20px;}

/* Seite ohne Titel: Fließtext bündig mit der linken Kante der weiten Abschnitte */
.ob-lefty>:not(.alignwide):not(.alignfull){margin-left:max(0px,calc((100% - 1120px) / 2))!important;margin-right:auto!important;}

/* Insekten-Sammlung */
.ob-sammlung-head{gap:12px 24px;padding-bottom:12px;margin-top:clamp(24px,4vw,48px)!important;}
.ob-sammlung-head>*{margin:0!important;}
.ob-sammlung-count{font-family:var(--ob-mono);font-size:12px;color:var(--ob-muted);}
.ob-freeslot{gap:20px;align-items:center!important;padding:clamp(20px,3vw,28px) clamp(24px,4vw,40px);border-radius:20px;border:1.5px dashed var(--ob-line);margin-block-start:20px!important;}
.ob-freeslot>*{margin:0!important;}
.ob-freeslot-hex{flex:none;width:56px;height:65px;background:var(--ob-amber);clip-path:var(--ob-hex);transform:rotate(11deg);}
.ob-freeslot-text h3{font-size:24px;margin:0 0 4px!important;}
.ob-freeslot-text p{margin:0;font-size:15px;color:var(--ob-muted);}
.ob-insect+.ob-insect{margin-block-start:20px!important;}

/* Überschriften in Theme-Bausteinen gegen die Fließtext-h3-Regel schützen */
.wp-block-post-content :is(.ob-insect,.ob-reasons,.ob-spec,.ob-freeslot) h3{font-family:var(--ob-display);font-weight:700;text-transform:uppercase;letter-spacing:.01em;line-height:1;}
.wp-block-post-content .ob-insect h3{font-size:36px;}
.wp-block-post-content .ob-reasons h3{font-size:22px;}
.wp-block-post-content .ob-spec h3{font-size:20px;}
.wp-block-post-content .ob-freeslot h3{font-size:24px;}
/* Seite breit: Fließtext 1120 px */
.ob-wide-text>:not(.alignfull){max-width:1120px!important;}

/* Wabe: Untertitel auch beim Hover/Fokus einblenden */
.ob-piece-sub{display:block!important;max-height:0;opacity:0;overflow:hidden;transition:max-height .3s ease,opacity .25s ease;}
.ob-piece--product:hover .ob-piece-sub,.ob-piece--product:focus-visible .ob-piece-sub,.is-focus .ob-piece-sub{max-height:3.2em;opacity:1;}
@media (max-width:781px){.ob-piece-sub{display:none!important;}}
@media (hover:none){.ob-piece--product:hover .ob-piece-sub{max-height:0;opacity:0;}}