/* Out-of-Home landing page: scoped design, independent of authenticated layouts. */
#app .pn-ooh-page{--ooh-ink:#172b36;--ooh-muted:#63747d;--ooh-orange:#ed9b35;--ooh-border:#e5e8e9;--ooh-soft:#f8faf9;width:100%;max-width:none;margin:0 auto;background:#fff;color:var(--ooh-ink);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
#app .pn-ooh-page *{box-sizing:border-box}
#app .pn-ooh-page h1,#app .pn-ooh-page h2,#app .pn-ooh-page h3,#app .pn-ooh-page p{margin-top:0}
#app .pn-ooh-container{width:min(1140px,calc(100% - 48px));margin-inline:auto}
#app .pn-ooh-beta,#app .pn-footer .pn-ooh-footer-beta{display:inline-flex;align-items:center;justify-content:center;border:1px solid #f0d6b2;background:#fff3df;color:#96601f;padding:4px 8px;border-radius:6px;font-size:10px;line-height:1.15;font-weight:800;letter-spacing:.045em;white-space:nowrap}
#app .pn-ooh-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(350px,.95fr);gap:clamp(28px,4vw,72px);align-items:center;width:calc(100% - 48px);margin:24px auto 0;padding:clamp(64px,6vw,100px) clamp(36px,5vw,90px);border-radius:22px;background:#172a33;color:#fff;overflow:hidden;position:relative}
#app .pn-ooh-hero:before{content:"";position:absolute;width:480px;height:480px;border:1px solid #ffffff12;border-radius:50%;right:-200px;top:-190px;pointer-events:none}
#app .pn-ooh-hero-copy,#app .pn-ooh-hero-graphic{position:relative;z-index:1;min-width:0}
#app .pn-ooh-kicker{display:flex;align-items:center;gap:10px;color:#d8e4e5;font-size:12px;font-weight:750;letter-spacing:.045em;margin-bottom:24px}
#app .pn-ooh-dot{width:9px;height:9px;border-radius:50%;background:var(--ooh-orange);box-shadow:0 0 0 5px #ed9b3526}
#app .pn-ooh-hero h1{font-size:clamp(42px,5vw,68px);letter-spacing:-.052em;line-height:1.065;max-width:690px;font-weight:850;margin:0 0 24px}
#app .pn-ooh-hero h1 em{font-style:normal;color:#f5b85f}
#app .pn-ooh-lead{font-size:17px;line-height:1.78;color:#c6d1d3;max-width:565px;margin-bottom:30px}
#app .pn-ooh-hero-actions{display:flex;gap:21px;align-items:center;flex-wrap:wrap}
#app .pn-ooh-button{display:inline-flex;align-items:center;justify-content:center;gap:11px;max-width:100%;min-height:47px;padding:13px 19px;border-radius:10px;font-size:13px;font-weight:800;line-height:1.25;text-decoration:none!important;white-space:normal;text-align:center;transition:transform .18s ease,background .18s ease,color .18s ease}
#app .pn-ooh-button:hover{transform:translateY(-2px)}
#app .pn-ooh-button:focus-visible,#app .pn-ooh-platform-buttons button:focus-visible,#app .pn-ooh-faq summary:focus-visible{outline:3px solid #f1ae54;outline-offset:3px}
#app .pn-ooh-button-primary{background:#f1a43d;color:#1e2d31!important}
#app .pn-ooh-button-primary:hover{background:#ffc16d;color:#182a31!important}
#app .pn-ooh-button-dark{background:#20353f;color:#fff!important}
#app .pn-ooh-button-dark:hover{background:#37505b;color:#fff!important}
#app .pn-ooh-hero-link{color:#eef3f2!important;text-decoration:none!important;font-size:13px;font-weight:750;display:inline-flex;gap:10px;align-items:center}
#app .pn-ooh-hero-link:hover{text-decoration:underline!important}
#app .pn-ooh-hero-meta{display:flex;flex-wrap:wrap;align-items:center;gap:11px;margin-top:33px;color:#b8c9c8;font-size:12px}
#app .pn-ooh-hero-meta .fa-circle-check{color:#f3ae50}
#app .pn-ooh-hero-graphic{padding:20px 0 20px 22px}
#app .pn-ooh-delivery-small{display:flex;align-items:center;gap:18px;padding:18px 19px;border:1px solid #ffffff22;border-radius:15px;background:#ffffff0b;max-width:490px;margin-inline:auto;opacity:.86}
#app .pn-ooh-mini-symbol{display:grid;place-items:center;width:47px;height:47px;flex-shrink:0;border-radius:11px;background:#ffffff18;color:#e2ebea;font-size:19px}
#app .pn-ooh-delivery-small div{display:grid;gap:4px}
#app .pn-ooh-delivery-small small{font-size:10px;letter-spacing:.08em;font-weight:700;color:#bac7c9}
#app .pn-ooh-delivery-small strong{font-size:16px;line-height:1.2;color:#fff}
#app .pn-ooh-delivery-small div span{font-size:12px;line-height:1.5;color:#c1cfd0}
#app .pn-ooh-graphic-trail{display:grid;justify-items:center;gap:3px;padding:10px;color:#f1ad55}
#app .pn-ooh-graphic-trail span{width:1px;height:15px;background:#f1ad556b}
#app .pn-ooh-delivery-feature{padding:28px;border-radius:20px;background:#fff;color:#1a313b;box-shadow:0 20px 70px #00000030;max-width:540px;margin-inline:auto}
#app .pn-ooh-delivery-feature-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:17px}
#app .pn-ooh-delivery-feature-head>span:first-child{font-size:11px;color:#9d681f;font-weight:850;letter-spacing:.075em}
#app .pn-ooh-graphic-check{display:grid;place-items:center;background:#eaf4ee;color:#27764d;border-radius:50%;width:30px;height:30px}
#app .pn-ooh-graphic-symbols{display:flex;gap:10px;margin-bottom:19px}
#app .pn-ooh-graphic-symbols span{display:grid;place-items:center;width:63px;height:63px;border-radius:14px;background:#fff1de;color:#b66c23;font-size:26px}
#app .pn-ooh-graphic-symbols span+span{background:#ecf3f5;color:#2b6576}
#app .pn-ooh-delivery-feature>strong{font-size:24px;font-weight:850;letter-spacing:-.04em;display:block;margin-bottom:8px}
#app .pn-ooh-delivery-feature>p{color:#61727a;font-size:13px;line-height:1.7;margin-bottom:22px}
#app .pn-ooh-delivery-pills{display:flex;flex-wrap:wrap;gap:7px}
#app .pn-ooh-delivery-pills span{display:inline-flex;align-items:center;gap:7px;border-radius:50px;border:1px solid #e6e9ea;padding:7px 11px;color:#435962;font-size:11px;font-weight:750}
#app .pn-ooh-section-heading{max-width:770px;margin:0 auto 36px;text-align:center}
#app .pn-ooh-section-kicker{display:block;font-size:11px;font-weight:850;letter-spacing:.095em;color:#ba792a;margin-bottom:15px}
#app .pn-ooh-section-heading h2,#app .pn-ooh-finder h2,#app .pn-ooh-last h2{color:#1a2f3a;font-size:clamp(28px,3.5vw,43px);letter-spacing:-.045em;line-height:1.16;font-weight:850;margin-bottom:15px}
#app .pn-ooh-section-heading p{color:#697985;line-height:1.7;font-size:15px;margin:0}
#app .pn-ooh-benefits{padding-top:88px;padding-bottom:72px}
#app .pn-ooh-benefit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
#app .pn-ooh-benefit-grid article{background:#fbfcfc;border:1px solid #e7ebeb;border-radius:16px;padding:31px 27px;min-width:0}
#app .pn-ooh-benefit-icon{width:49px;height:49px;display:grid;place-items:center;background:#fff0da;color:#a96524;border-radius:13px;font-size:19px;margin-bottom:25px}
#app .pn-ooh-benefit-grid h3{font-size:17px;font-weight:830;letter-spacing:-.02em;margin-bottom:10px;color:#1d303a}
#app .pn-ooh-benefit-grid p{font-size:13px;color:#687983;line-height:1.75;margin:0}
#app .pn-ooh-eco-note{display:flex;align-items:flex-start;gap:11px;background:#f4f8f5;border:1px solid #e3eee6;color:#597062;font-size:12px;line-height:1.7;padding:16px 20px;border-radius:11px;margin:22px 0 0}
#app .pn-ooh-eco-note i{color:#4e8a63;margin-top:3px}
#app .pn-ooh-how{border-top:1px solid #e9eced;padding-top:79px;padding-bottom:78px}
#app .pn-ooh-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;position:relative}
#app .pn-ooh-steps>div{min-width:0}
#app .pn-ooh-step-number{display:grid;place-items:center;width:45px;height:45px;background:#243e49;border-radius:12px;color:#fff;font-size:13px;font-weight:850;letter-spacing:.035em;margin-bottom:20px}
#app .pn-ooh-steps h3{font-size:17px;font-weight:850;letter-spacing:-.025em;margin-bottom:11px}
#app .pn-ooh-steps p{font-size:13px;line-height:1.76;color:#62747e;margin:0}
#app .pn-ooh-how-note{display:flex;gap:11px;align-items:flex-start;padding:15px 18px;border-radius:10px;margin-top:30px;color:#68767a;background:#f5f7f7;font-size:12px;line-height:1.7}
#app .pn-ooh-how-note i{margin-top:3px}
#app .pn-ooh-finder{background:#fff8f0;border:1px solid #f1dfc7;border-radius:21px;padding:37px 40px 36px;margin-top:10px;margin-bottom:84px;scroll-margin-top:24px}
#app .pn-ooh-finder-header{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:24px}
#app .pn-ooh-finder-header .pn-ooh-section-kicker{margin-bottom:12px}
#app .pn-ooh-finder h2{font-size:clamp(26px,3vw,37px);margin-bottom:8px}
#app .pn-ooh-finder-header p{color:#6a7880;font-size:14px;line-height:1.5;margin:0}
#app .pn-ooh-finder-mark{display:grid;place-items:center;width:55px;height:55px;border-radius:15px;flex-shrink:0;color:#bc7826;background:#fcecd8;font-size:21px}
#app .pn-ooh-platform-buttons{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px}
#app .pn-ooh-platform-buttons button{border:1px solid #e4d3c2;border-radius:10px;background:#fff;color:#3a4c52;padding:13px 18px;font-size:13px;font-weight:800;display:inline-flex;gap:9px;align-items:center;cursor:pointer;min-height:46px;transition:border-color .15s ease,background .15s ease}
#app .pn-ooh-platform-buttons button:hover{border-color:#bd863c;background:#fffaf5}
#app .pn-ooh-platform-buttons button.is-selected,#app .pn-ooh-platform-buttons button[aria-pressed="true"]{color:#693a0c;border-color:#e8a756;background:#ffe8c7;box-shadow:inset 0 0 0 1px #e8a756}
#app .pn-ooh-platform-buttons button i{font-size:17px}
#app .pn-ooh-match{min-height:96px;padding:20px 23px;background:#fff;border:1px solid #ecdfce;border-radius:13px;display:flex;align-items:center;gap:19px}
#app .pn-ooh-match-empty{display:flex;align-items:center;gap:14px;color:#7e868a;font-size:13px}
#app .pn-ooh-match-empty i{color:#c38b46;font-size:20px}
#app .pn-ooh-match-icon{height:56px;width:56px;flex:0 0 56px;border-radius:12px;display:grid;place-items:center;background:#ecf1f4;color:#254b5e;font-size:26px}
#app .pn-ooh-match-woo{background:#f2e9f7;color:#744896}
#app .pn-ooh-match-shopware{background:#e5f4fb;color:#317f9e}
#app .pn-ooh-match-copy{flex:1;min-width:0}
#app .pn-ooh-match-copy small{font-size:10px;font-weight:850;color:#ba7a31;letter-spacing:.07em}
#app .pn-ooh-match-copy h3{font-size:18px;letter-spacing:-.02em;font-weight:850;margin:5px 0 7px}
#app .pn-ooh-match-copy p{font-size:12px;color:#63747a;line-height:1.68;margin:0 0 8px}
#app .pn-ooh-match-copy>span{font-size:11px;font-weight:700;color:#8b9497}
#app .pn-ooh-match>.pn-ooh-button{flex-shrink:0}
#app .pn-ooh-plugins{padding-bottom:84px;scroll-margin-top:20px}
#app .pn-ooh-plugin-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
#app .pn-ooh-plugin-card{display:flex;flex-direction:column;min-width:0;padding:29px;border:1px solid #e4e9ea;border-radius:17px;background:#fff;box-shadow:0 11px 37px #1c303a09}
#app .pn-ooh-plugin-card-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:25px}
#app .pn-ooh-plugin-logo{display:grid;place-items:center;width:62px;height:62px;border-radius:15px;background:#eef5f9;color:#317e9c;font-size:30px}
#app .pn-ooh-plugin-logo-woo{background:#f2ecf8;color:#734995}
#app .pn-ooh-plugin-card>small{font-size:10px;color:#a97637;font-weight:850;letter-spacing:.085em;margin-bottom:7px}
#app .pn-ooh-plugin-card h3{font-size:26px;font-weight:850;letter-spacing:-.04em;margin:0 0 10px}
#app .pn-ooh-plugin-card p{font-size:13px;color:#657680;line-height:1.76;margin-bottom:21px}
#app .pn-ooh-plugin-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:auto;margin-bottom:27px}
#app .pn-ooh-plugin-tags span{display:inline-flex;padding:7px 10px;border-radius:6px;color:#61747d;background:#f3f6f6;font-size:10px;font-weight:750}
#app .pn-ooh-plugin-bottom{display:flex;align-items:flex-start;flex-direction:column;gap:12px}
#app .pn-ooh-plugin-bottom>span{color:#97a1a6;font-size:11px}
#app .pn-ooh-disclaimer{display:flex;align-items:flex-start;gap:15px;margin-top:22px;padding:21px 24px;border-radius:12px;border:1px solid #eae7df;background:#faf9f6;color:#52636a}
#app .pn-ooh-disclaimer>i{color:#c08a40;font-size:21px;padding-top:2px}
#app .pn-ooh-disclaimer strong{color:#394d54;font-size:13px}
#app .pn-ooh-disclaimer p{font-size:12px;line-height:1.72;margin:7px 0 0}
#app .pn-ooh-faq{padding:74px 0 85px;border-top:1px solid #e9eeef}
#app .pn-ooh-faq-list{max-width:865px;margin:0 auto}
#app .pn-ooh-faq details{border-bottom:1px solid #e5ebeb;padding:19px 5px}
#app .pn-ooh-faq details:first-child{border-top:1px solid #e5ebeb}
#app .pn-ooh-faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:14px;font-weight:800;color:#243a45;line-height:1.5}
#app .pn-ooh-faq summary::-webkit-details-marker{display:none}
#app .pn-ooh-faq summary i{color:#b87531;transition:transform .2s ease}
#app .pn-ooh-faq details[open] summary i{transform:rotate(45deg)}
#app .pn-ooh-faq details p{color:#657781;font-size:13px;line-height:1.78;margin:12px 34px 0 0}
#app .pn-ooh-last{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:40px 44px;background:#edf3f2;border-radius:18px;margin-bottom:85px}
#app .pn-ooh-last>div{max-width:680px}
#app .pn-ooh-last h2{font-size:clamp(24px,3vw,34px);margin:0 0 10px}
#app .pn-ooh-last p{font-size:13px;line-height:1.7;color:#65767e;margin:0}
#app .pn-ooh-last .pn-ooh-button{flex-shrink:0}
#app .pn-footer .pn-ooh-footer-item{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
#app .pn-footer .pn-ooh-footer-beta{font-size:9px;padding:3px 6px}
@media(max-width:980px){
 #app .pn-ooh-hero{grid-template-columns:minmax(0,1fr) minmax(280px,.8fr);gap:26px;width:calc(100% - 36px);margin-top:18px;padding:64px 32px}
 #app .pn-ooh-hero h1{font-size:clamp(38px,4.5vw,56px)}
 #app .pn-ooh-match{flex-wrap:wrap}
 #app .pn-ooh-match>.pn-ooh-button{margin-left:75px}
}
@media(max-width:720px){
 #app .pn-ooh-container{width:min(100% - 32px,1140px)}
 #app .pn-ooh-hero{display:block;width:calc(100% - 24px);margin-top:12px;padding:50px 20px 55px;border-radius:16px}
 #app .pn-ooh-hero h1{font-size:clamp(39px,9vw,54px)}
 #app .pn-ooh-lead{font-size:15px}
 #app .pn-ooh-hero-graphic{margin-top:34px;padding:0}
 #app .pn-ooh-delivery-small{max-width:100%}
 #app .pn-ooh-delivery-feature{max-width:100%}
 #app .pn-ooh-benefits{padding-top:60px;padding-bottom:55px}
 #app .pn-ooh-benefit-grid,#app .pn-ooh-steps,#app .pn-ooh-plugin-grid{grid-template-columns:minmax(0,1fr);gap:14px}
 #app .pn-ooh-steps{gap:27px}
 #app .pn-ooh-how{padding-top:60px;padding-bottom:60px}
 #app .pn-ooh-finder{padding:26px 19px;margin-bottom:60px;border-radius:15px}
 #app .pn-ooh-finder-mark{display:none}
 #app .pn-ooh-platform-buttons button{flex:1 1 auto}
 #app .pn-ooh-match{display:flex;align-items:flex-start;flex-wrap:wrap;padding:17px}
 #app .pn-ooh-match-icon{width:46px;height:46px;flex-basis:46px}
 #app .pn-ooh-match-copy{flex-basis:calc(100% - 70px)}
 #app .pn-ooh-match>.pn-ooh-button{margin-left:0;width:100%}
 #app .pn-ooh-plugins{padding-bottom:60px}
 #app .pn-ooh-faq{padding:60px 0}
 #app .pn-ooh-last{flex-direction:column;align-items:flex-start;gap:23px;padding:30px 24px;margin-bottom:65px}
}
@media(max-width:390px){
 #app .pn-ooh-hero-actions{align-items:stretch;flex-direction:column}
 #app .pn-ooh-hero-actions .pn-ooh-button,#app .pn-ooh-hero-link{width:100%;justify-content:center}
 #app .pn-ooh-hero h1{font-size:37px}
 #app .pn-ooh-platform-buttons button{width:100%;justify-content:center}
 #app .pn-ooh-match-copy{flex-basis:100%}
}
@media(prefers-reduced-motion:reduce){
 #app .pn-ooh-page .pn-ooh-button,#app .pn-ooh-page .pn-ooh-platform-buttons button,#app .pn-ooh-faq summary i{transition:none!important}
 #app .pn-ooh-page .pn-ooh-button:hover{transform:none}
}

/* Unified catalog layout: WooCommerce, Shopware 6, JTL-Shop 5. */
#app .pn-ooh-plugin-logo-jtl{background:#f0f5ed;color:#518349}
#app .pn-ooh-match-jtl{background:#f0f5ed;color:#518349}
#app .pn-ooh-plugin-card{min-width:0}
#app .pn-ooh-plugin-card .pn-ooh-plugin-bottom{flex-wrap:wrap}
@media(min-width:721px) and (max-width:1130px){
 #app .pn-ooh-plugin-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:720px){
 #app .pn-ooh-plugin-grid{grid-template-columns:minmax(0,1fr);}
}