/* = = = SEO-GEO-LANDINGPAGE (10.11.2026) // eigenes Stylesheet, Prefix .oprx-g-*, alles unter #opr-geo gescoped = = = */
/* Ueberschreibt keine bestehende Klasse. Braucht nur openpr.css (Bootstrap, Fira Sans, .opr-caption) und FontAwesome. */

#opr-geo{overflow-x:clip;background:#fff;padding-left:10px;padding-right:10px}
#opr-geo h1,#opr-geo h2,#opr-geo h3{letter-spacing:-.01em}
#opr-geo [id]{scroll-margin-top:24px}

/* Caption als angedockter Reiter (gleiches Verhalten wie auf /service/) */
#opr-geo .oprx-g-cap{line-height:0;margin:0 auto;padding-top:0;padding-bottom:0;position:relative;z-index:3}
#opr-geo .oprx-g-cap .opr-caption{margin:0;line-height:1.2;position:relative;top:1px;z-index:3}
#opr-geo .oprx-g-cap + section{border-top:1px solid #dee2e6}
#opr-geo .oprx-g-cap-top{height:0;overflow:visible}
#opr-geo .oprx-g-cap-top .opr-caption{transform:translateY(-100%);top:0!important}
#opr-geo .oprx-g-cap-top + section{border-top:0}
#opr-geo .oprx-g-cap:not(.oprx-g-cap-top){padding-top:32px}
#opr-geo .oprx-g-cap + section > .container-xl{padding-top:1.25rem!important}

/* Bausteine */
#opr-geo .oprx-g-check{color:#ed7000;flex:none;margin-top:.25em}
#opr-geo .oprx-g-shead{display:flex;align-items:center;gap:14px;margin-bottom:12px}
#opr-geo .oprx-g-ic{width:44px;height:44px;border-radius:50%;background:#ed7000;color:#fff;display:grid;place-items:center;flex:none;font-size:19px}
#opr-geo .oprx-g-ic svg{width:22px;height:22px}
#opr-geo .oprx-g-lead{max-width:680px;font-size:17px;margin-bottom:40px}
#opr-geo .oprx-g-stat b{font-size:30px;font-weight:800;color:#ed7000;letter-spacing:-.02em;line-height:1;display:block}
#opr-geo .oprx-g-stat span{font-size:13px;color:#6c757d}
#opr-geo .oprx-g-more{display:inline-block;align-self:flex-start;font-size:14px;font-weight:500;color:#465058;text-decoration:none;border:1px solid #dee2e6;border-radius:.375rem;padding:9px 12px;background:#fff}
#opr-geo .oprx-g-more:hover,#opr-geo .oprx-g-more:focus-visible{border-color:#7a8c96;color:#212529}
#opr-geo .oprx-g-lift{transition:transform .14s,box-shadow .16s}
#opr-geo .oprx-g-lift:hover{transform:translateY(-3px);box-shadow:0 .5rem 1.25rem rgba(33,37,41,.10)}
#opr-geo .oprx-g-emph{color:#b35400}
#opr-geo .oprx-g-fn{color:#ed7000;font-weight:700;font-size:.6em}
#opr-geo .oprx-g-ribbon{position:absolute;top:26px;right:-42px;width:160px;text-align:center;transform:rotate(45deg);background:#ed7000;color:#fff;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:7px 0;box-shadow:0 .125rem .25rem rgba(33,37,41,.12);z-index:1}
#opr-geo .oprx-g-best{background:linear-gradient(180deg,#FFE9D1,#fff8ec 72%)}
#opr-geo .card:has(.oprx-g-ribbon){overflow:hidden;contain:paint}
#opr-geo .oprx-g-final{background:linear-gradient(180deg,#fff8ec,#fff)}
@media(min-width:992px){#opr-geo .card.p-4{padding:2rem!important}}

/* Screenshot-Rahmen, Schritte, Video */
#opr-geo .oprx-g-frame{border:1px solid #dee2e6;border-radius:.5rem;overflow:hidden;background:#fff;box-shadow:0 .5rem 1rem rgba(0,0,0,.15)}
#opr-geo .oprx-g-frame img{display:block;width:100%;height:auto}
#opr-geo .oprx-g-bar{display:flex;align-items:center;gap:6px;padding:9px 12px;background:#f8f9fa;border-bottom:1px solid #dee2e6}
#opr-geo .oprx-g-bar i{width:10px;height:10px;border-radius:50%;background:#ced4da;display:block}
#opr-geo .oprx-g-bar span{margin-left:8px;font-size:12px;font-weight:600;color:#6c757d}
#opr-geo .oprx-g-shot{display:block;width:100%;height:auto;border:1px solid #dee2e6;border-radius:.375rem;box-shadow:0 .125rem .25rem rgba(0,0,0,.075)}
#opr-geo .oprx-g-step{display:flex;align-items:center;gap:14px}
#opr-geo .oprx-g-num{width:40px;height:40px;border-radius:50%;background:#ed7000;color:#fff;font-weight:800;font-size:17px;display:inline-grid;place-items:center;flex:none}
#opr-geo .oprx-g-video{border:1px solid #dee2e6;border-radius:.5rem;overflow:hidden;background:#212529;box-shadow:0 .5rem 1rem rgba(0,0,0,.15)}
#opr-geo .oprx-g-video video{display:block;width:100%;height:auto}


/* Pressefach-Chips und Top-10-Liste */
#opr-geo .oprx-g-chips{display:flex;flex-wrap:wrap;gap:8px}
#opr-geo .oprx-g-chips a{display:inline-block;padding:6px 12px;border:1px solid #f8c699;background:#fff8ec;border-radius:50px;font-size:14px;font-weight:600;color:#5f2d00;text-decoration:none;line-height:1.3}
#opr-geo .oprx-g-chips a:hover{background:#fbe2cc;border-color:#ed7000}
#opr-geo .oprx-g-chips span{display:inline-block;padding:12px 14px;border:1px solid #dee2e6;background:#fff;border-radius:50px;font-size:14px;font-weight:600;color:#212529;line-height:1.3}
#opr-geo .oprx-g-top{counter-reset:oprxg}
#opr-geo .oprx-g-top li{counter-increment:oprxg;display:grid;grid-template-columns:30px minmax(0,1fr);gap:10px;padding:10px 0;border-top:1px solid #dee2e6;font-size:15px;line-height:1.4}
#opr-geo .oprx-g-top li:first-child{border-top:0}
#opr-geo .oprx-g-top li::before{content:counter(oprxg);font-weight:800;color:#ed7000;font-size:17px;text-align:right}
#opr-geo .oprx-g-top a{color:#212529;font-weight:600;text-decoration:none}
#opr-geo .oprx-g-top a:hover{color:#be5a00;text-decoration:underline}
#opr-geo .oprx-g-honest{background:#fff8ec;border-left:3px solid #ed7000;border-radius:.375rem;padding:22px 24px}

/* FAQ (details/summary, kein JavaScript) */
#opr-geo .oprx-g-faq{border-top:1px solid #dee2e6}
#opr-geo .oprx-g-faq details{border-bottom:1px solid #dee2e6}
#opr-geo .oprx-g-faq summary{list-style:none;cursor:pointer;padding:18px 44px 18px 0;position:relative;font-weight:700;font-size:16px;color:#212529}
#opr-geo .oprx-g-faq summary::-webkit-details-marker{display:none}
#opr-geo .oprx-g-faq summary::after{content:"";position:absolute;right:6px;top:22px;width:10px;height:10px;border-right:2.5px solid #ed7000;border-bottom:2.5px solid #ed7000;transform:rotate(45deg);transition:transform .2s}
#opr-geo .oprx-g-faq details[open] summary::after{transform:rotate(-135deg);top:26px}
#opr-geo .oprx-g-faq p{padding:0 44px 18px 0;margin:0}

/* Fallstudie Notar Hebebrand (Bilder liegen bereits unter /assets/openpr-studie/) */
#opr-geo .oprx-g-case{margin-top:2.5rem;border:1px solid #f8c699;border-radius:.5rem;background:linear-gradient(180deg,#fff8ec,#fff 55%);padding:28px 24px}
@media(min-width:992px){#opr-geo .oprx-g-case{padding:40px}}
#opr-geo .oprx-g-case-eyebrow{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#b35400}
#opr-geo .oprx-g-case-chart{background:#fff;border:1px solid #dee2e6;border-radius:.375rem;padding:16px 16px 10px;box-shadow:0 .125rem .25rem rgba(0,0,0,.075)}
#opr-geo .oprx-g-case-chart svg{display:block;width:100%;height:auto}
#opr-geo .oprx-g-case-chart p{font-size:12.5px;color:#6c757d;margin:6px 0 0}
#opr-geo .oprx-g-case-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 24px;margin:1.5rem 0}
#opr-geo .oprx-g-case-stats b{display:block;font-size:26px;font-weight:800;color:#ed7000;letter-spacing:-.02em;line-height:1.1}
#opr-geo .oprx-g-case-stats span{font-size:13.5px;color:#465058;line-height:1.35;display:block;margin-top:2px}
#opr-geo .oprx-g-case-quote{display:flex;gap:16px;align-items:flex-start;margin:1.5rem 0 0;padding-top:1.5rem;border-top:1px solid #f8c699}
#opr-geo .oprx-g-case-quote img{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:none;background:#eff0f1}
#opr-geo .oprx-g-case-quote blockquote{margin:0;font-size:16px;font-style:italic;color:#212529;line-height:1.5}
#opr-geo .oprx-g-case-quote cite{display:block;margin-top:6px;font-size:13.5px;font-style:normal;font-weight:600;color:#465058}
@media(max-width:575.98px){#opr-geo .oprx-g-case-stats b{font-size:21px}}

/* Lesbarkeit und Tippflaechen auf Smartphones und Tablets */
#opr-geo .oprx-g-tap{padding-top:.6rem;padding-bottom:.6rem}
#opr-geo .oprx-g-more{padding-top:11px;padding-bottom:11px}
#opr-geo .oprx-g-chips a{padding:12px 14px}
#opr-geo .oprx-g-case-chart svg text{font-size:14px}
#opr-geo .oprx-g-case-chart svg text.oprx-g-p1{font-size:17px}
@media(max-width:1399.98px){
#opr-geo .oprx-g-case-chart svg text{font-size:18px}
#opr-geo .oprx-g-case-chart svg text.oprx-g-p1{font-size:21px}
}
@media(max-width:575.98px){
#opr-geo .oprx-g-case-chart{padding:12px 8px 8px}
#opr-geo .oprx-g-case-chart svg text{font-size:25px}
#opr-geo .oprx-g-case-chart svg text.oprx-g-p1{font-size:29px}
#opr-geo .oprx-g-case-chart svg text.oprx-g-xs-hide{display:none}
#opr-geo .oprx-g-case-stats b{overflow-wrap:anywhere}
}
@media(max-width:359.98px){#opr-geo .oprx-g-case-stats b{font-size:18px}}
