/* Werbekampagnen: page-scoped styling using the existing brand tokens. */
.werbung-page { background: #F4F7F7; }
.werbung-page main { --pw-muted: #465E65; --pw-rule: #C7D5D8; }
.werbung-page main > .section { padding-block: clamp(54px, 6.5vw, 96px); }
.werbung-page main h1, .werbung-page main h2 { hyphens: none; }
.werbung-page main h2 { font-size: clamp(30px, 3.15vw, 44px); line-height: 1.14; letter-spacing: -.035em; }
.werbung-page main h3 { font-size: 24px; line-height: 1.25; }
.werbung-page main h4 { font-size: 19px; line-height: 1.35; }
.werbung-page main p { text-wrap: pretty; }
.werbung-page main .btn { border-radius: 9px; min-height: 50px; text-align: center; }
.werbung-page main .btn--primary::after { display: none; }
.werbung-page main a { text-underline-offset: 4px; }
.werbung-page main :focus-visible { outline: 3px solid #006277; outline-offset: 5px; }
.werbung-page main .section--dark :focus-visible { outline-color: #E3AC45; }
.werbung-page main a, .werbung-page main button, .werbung-page main summary { touch-action: manipulation; -webkit-tap-highlight-color: rgba(201,146,46,.2); }
.werbung-page .sticky-cta .btn { border-radius: 8px; font-size: 14px; justify-content: center; text-align: center; }
.pw-skip { position: fixed; top: 10px; left: 15px; z-index: 10000; padding: 12px 18px; background: white; color: #0C1C22; border-radius: 5px; transform: translateY(-160%); }
.pw-skip:focus { transform: translateY(0); }
.pw-back { display: inline-flex; min-height: 44px; align-items: center; color: #C0D2D6; font-size: 14px; text-decoration: none; margin-bottom: 17px; }
.pw-back:hover { color: #FFFFFF; text-decoration: underline; }
.pw-hero { overflow: hidden; }
.pw-hero__grid { display: grid; grid-template-columns: minmax(0, 1.03fr) minmax(0, 1fr); gap: clamp(30px, 4.5vw, 66px); align-items: center; }
.werbung-page .pw-hero h1 { font-size: clamp(38px, 4.1vw, 60px); line-height: 1.06; font-weight: 750; max-width: 17ch; letter-spacing: -.045em; text-wrap: balance; }
.pw-hero__copy > .lead { font-size: 18px; color: #CEDCE0; max-width: 48ch; margin-top: 25px; line-height: 1.65; }
.pw-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 25px; margin-top: 28px; }
.pw-fine { font-size: 13px; color: #B8CDD2; margin-top: 11px; }
.pw-textlink { display: inline-flex; align-items: center; min-height: 44px; font-weight: 500; }
.pw-textlink:hover { text-decoration-thickness: 2px; }
.pw-hero__jump { margin-top: 13px; font-size: 14px; gap: 12px; color: #E6EEF0; }
.pw-hero__jump span { font-size: 21px; text-decoration: none; }
.pw-hero__visual { margin: 0; min-width: 0; }
.pw-hero__visual picture { display: block; background: #17343C; border-radius: 16px 16px 0 0; overflow: hidden; }
.pw-hero__visual img { width: 100%; height: auto; aspect-ratio: 1.07; object-fit: cover; object-position: 48% center; animation: pw-photo-in 1.2s cubic-bezier(.2,.75,.2,1) both; }
.pw-hero__visual figcaption { padding: 18px 22px; background: #17343C; border-radius: 0 0 16px 16px; color: #EEF4F5; }
.pw-hero__visual figcaption > span { display: block; font: 600 17px/1.4 var(--display); }
.pw-hero__visual figcaption small { font-size: 12px; color: #B8CDD2; display: block; margin-top: 5px; }
@keyframes pw-photo-in { from { transform: scale(1.045); opacity: .6; } to { transform: scale(1); opacity: 1; } }
.pw-promises { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 32px; border-top: 1px solid #38525B; padding-top: 28px; margin-top: 52px; }
.pw-promises li + li { border-left: 1px solid #38525B; padding-left: 32px; }
.pw-promises strong { display: block; color: #F4F7F7; font: 600 17px/1.4 var(--display); margin-bottom: 7px; }
.pw-promises span { display: block; color: #BBCDD2; font-size: 15px; max-width: 34ch; }
.pw-heading { display: grid; grid-template-columns: minmax(0,1.03fr) minmax(0,1fr); gap: clamp(25px, 5.5vw, 80px); align-items: end; margin-bottom: 35px; }
.pw-heading h2 { max-width: 22ch; }
.pw-heading > p { font-size: 18px; color: var(--pw-muted); max-width: 54ch; }
.pw-example { background: #E7EFEF; }
.pw-example__top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 24px; margin-bottom: 24px; }
.pw-tabs { display: flex; gap: 6px; background: #D6E1E3; padding: 5px; border-radius: 11px; }
.pw-tabs[hidden], .pw-adpanel[hidden] { display: none; }
.pw-tabs button { font: 500 15px/1.4 var(--text); color: #344E56; border: 1px solid transparent; background: transparent; padding: 11px 23px; border-radius: 8px; cursor: pointer; min-height: 46px; transition: background-color .18s, color .18s; }
.pw-tabs button:hover { background: #ECF3F4; }
.pw-tabs button[aria-selected="true"] { color: #FFFFFF; background: #17343C; }
.pw-example__note { font-size: 13px; color: #465E65; }
.pw-example__grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.03fr); gap: clamp(26px, 5.5vw, 80px); align-items: start; }
.pw-ads { min-width: 0; }
.pw-adpanel { padding: 28px; border: 1px solid #C4D4D8; border-radius: 14px; background: #F8FBFB; }
.pw-adpanel + .pw-adpanel:not([hidden]) { margin-top: 24px; }
.pw-tabs-ready .pw-adpanel { min-height: 710px; }
.werbung-page main .pw-panel-label { font-size: 19px; line-height: 1.45; margin-bottom: 23px; letter-spacing: -.02em; }
.pw-ad-caption { font-size: 12px; color: #526970; margin-top: 22px; }
/* ---------- Anzeigenbeispiele im Handy ----------
   Wie das Handy auf der Startseite (.sp__handy): die Suche im vertrauten
   Look, bewusst "Igel" statt der echten Marke, und ein Feed wie in einer
   Foto-App, bewusst "pfau". Die Farben gehoeren zu den Nachbildungen,
   nicht zur Gestaltung dieser Website. */
.pw-symbole { position: absolute; width: 0; height: 0; overflow: hidden; }
.pw-i { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pw-handy { position: relative; width: 280px; max-width: 100%; height: 540px; margin: 0 auto; padding: 9px; border-radius: 38px; background: #07131A; box-shadow: 0 30px 60px -34px rgba(12,28,34,.6), 0 0 0 1px rgba(12,28,34,.1); }
.pw-handy::before { content: ""; position: absolute; z-index: 5; top: 16px; left: 50%; width: 60px; height: 7px; margin-left: -30px; border-radius: 10px; background: #07131A; }
.pw-handy__schirm { position: relative; height: 100%; overflow: hidden; border-radius: 29px; background: #FFFFFF; color: #202124; font-family: var(--text); }

/* Die Suche */
.pw-igel { padding: 34px 12px 12px; }
.pw-igel__kopf { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; padding: 0 2px; }
.pw-igel__logo { font: 700 23px/1 var(--display); letter-spacing: -.03em; }
.pw-igel__logo b:nth-child(1) { color: #4285F4; }
.pw-igel__logo b:nth-child(2) { color: #EA4335; }
.pw-igel__logo b:nth-child(3) { color: #FBBC05; }
.pw-igel__logo b:nth-child(4) { color: #34A853; }
.pw-igel__profil { width: 24px; height: 24px; border-radius: 50%; background: #DADCE0; box-shadow: inset 0 -8px 0 #BDC1C6; }
.pw-igel__feld { display: flex; align-items: center; gap: 8px; height: 36px; padding: 0 13px; border: 1px solid #DFE1E5; border-radius: 100px; color: #5F6368; font-size: 12.5px; box-shadow: 0 1px 6px rgba(32,33,36,.18); }
.pw-igel__feld .pw-i { width: 15px; height: 15px; stroke-width: 2.2; }
.pw-igel__feld span { overflow: hidden; color: #202124; white-space: nowrap; }
.pw-igel__reiter { display: flex; gap: 14px; margin-top: 10px; padding: 0 4px; border-bottom: 1px solid #E8EAED; color: #5F6368; font-size: 11px; }
.pw-igel__reiter span { padding: 6px 0 7px; }
.pw-igel__reiter .is-aktiv { color: #1A73E8; box-shadow: inset 0 -2px 0 #1A73E8; }
.pw-igel__treffer { margin-top: 6px; padding: 9px 8px; border-radius: 10px; }
.pw-igel__gesponsert { display: block; margin-bottom: 6px; color: #202124; font: 700 11px/1.2 var(--text); }
.pw-igel__quelle { display: flex; align-items: center; gap: 7px; }
.pw-igel__quelle > span:last-child { display: grid; line-height: 1.25; }
.pw-igel__quelle b { color: #202124; font: 500 11px/1.25 var(--text); }
.pw-igel__quelle i { color: #4D5156; font-size: 10px; font-style: normal; }
.pw-igel__favicon { display: inline-grid; place-items: center; flex: none; width: 20px; height: 20px; border: 1px solid #E8EAED; border-radius: 50%; background: #F1F3F4; font: 700 10px/1 var(--display); }
.pw-igel__favicon--k { border-color: #34594A; background: #34594A; color: #FFFFFF; }
.pw-igel__titel { margin-top: 5px; color: #1A0DAB; font: 400 14px/1.3 var(--text); }
.pw-igel__auszug { margin-top: 3px; color: #4D5156; font-size: 11px; line-height: 1.45; }
.pw-igel__links { display: flex; flex-wrap: wrap; gap: 3px 12px; margin-top: 6px; color: #1A0DAB; font-size: 11px; }
/* Mit JavaScript wird der Suchbegriff getippt, dann kommen die Treffer,
   und der gesponserte leuchtet kurz auf wie beim Antippen. */
.pw-igel.is-animiert .pw-igel__treffer { opacity: 0; transform: translateY(8px); }
.pw-igel.is-fertig .pw-igel__treffer { opacity: 1; transform: none; transition: opacity .45s ease, transform .45s var(--ease); }
.pw-igel.is-fertig .pw-igel__treffer:nth-child(5) { transition-delay: .12s; }
.pw-igel.is-fertig .pw-igel__treffer:nth-child(6) { transition-delay: .24s; }
.pw-igel.is-fertig .pw-igel__treffer--anzeige { animation: pw-igel-tipp 1.4s ease .9s both; }
.pw-igel.is-animiert:not(.is-fertig) [data-pw-tippen]::after { content: ""; display: inline-block; width: 1px; height: 13px; margin-left: 1px; background: #202124; vertical-align: -2px; animation: pw-cursor 1s steps(1) infinite; }
@keyframes pw-igel-tipp { 0%, 100% { background: transparent; } 30%, 60% { background: #F1F3F4; } }
@keyframes pw-cursor { 50% { opacity: 0; } }

/* Der Feed */
.pw-feed { display: flex; flex-direction: column; padding-top: 26px; color: #262626; }
.pw-feed__kopf { display: flex; flex: none; align-items: center; justify-content: space-between; height: 40px; padding: 0 12px; border-bottom: 1px solid #EFEFEF; }
.pw-feed__kopf b { font: 800 21px/1 var(--display); letter-spacing: -.045em; }
.pw-feed__kopf span { display: flex; gap: 14px; }
.pw-feed__fenster { position: relative; flex: 1; min-height: 0; overflow: hidden; }
/* Ohne Bewegung steht die Anzeige im Bild. Den genauen Abstand misst
   paket-werbung.js, der Wert hier ist nur die Naeherung ohne Skript. */
.pw-feed__liste { position: relative; transform: translateY(calc(var(--pw-ziel, 373px) * -1)); }
.pw-feed__stories { display: flex; gap: 8px; padding: 9px 10px 8px; overflow: hidden; border-bottom: 1px solid #EFEFEF; }
.pw-feed__stories span { display: grid; flex: none; justify-items: center; gap: 4px; width: 50px; overflow: hidden; font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
.pw-feed__stories i { display: block; width: 46px; height: 46px; padding: 2px; border-radius: 50%; background: linear-gradient(45deg, #F9CE34, #EE2A7B 55%, #6228D7); }
.pw-feed__stories i::after { content: ""; display: block; width: 100%; height: 100%; border: 2px solid #FFFFFF; border-radius: 50%; background: #C98B5B; box-sizing: border-box; }
.pw-feed__stories span:nth-child(1) i { background: #DBDBDB; }
.pw-feed__stories span:nth-child(1) i::after { background: #C7CDD1; }
.pw-feed__stories span:nth-child(3) i::after { background: #5B8EC9; }
.pw-feed__stories span:nth-child(4) i::after { background: #7FA86B; }
.pw-feed__stories span:nth-child(5) i::after { background: #B07CC6; }
.pw-post { padding-bottom: 10px; border-bottom: 1px solid #EFEFEF; }
.pw-post__kopf { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 10px; font-size: 11.5px; }
.pw-post__kopf b { font-weight: 600; }
.pw-post__kopf span:not(.pw-post__mehr) { display: grid; line-height: 1.2; }
.pw-post__kopf small { color: #737373; font-size: 9.5px; }
.pw-post__mehr { margin-left: auto; letter-spacing: 1px; }
.pw-post__avatar { display: inline-grid; place-items: center; flex: none; width: 26px; height: 26px; border-radius: 50%; background: #C98B5B; color: #FFFFFF; font: 700 11px/1 var(--display); font-style: normal; }
.pw-post:last-child .pw-post__avatar { background: #5B8EC9; }
.pw-post--anzeige .pw-post__avatar { background: #34594A; }
.pw-post > img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; background: #EFEFEF; }
.pw-post--anzeige > img { aspect-ratio: 1; }
.pw-post__cta { display: flex; align-items: center; justify-content: space-between; height: 32px; padding: 0 8px 0 10px; background: #EFEFEF; font-size: 11.5px; font-weight: 600; }
.pw-post__cta .pw-i { width: 15px; height: 15px; stroke-width: 2.2; }
.pw-post__aktionen { display: flex; gap: 12px; padding: 8px 10px 5px; }
.pw-post__merken { margin-left: auto; }
.pw-post__text { padding: 0 10px; font-size: 11px; line-height: 1.4; }
.pw-post__text b { font-weight: 600; }
.pw-feed__leiste { display: flex; flex: none; align-items: center; justify-content: space-around; height: 42px; border-top: 1px solid #EFEFEF; background: #FFFFFF; }
.pw-feed__ich { width: 20px; height: 20px; border-radius: 50%; background: #C7CDD1; }
/* Beim Scrollen taucht die Anzeige auf, bleibt stehen, der Knopf wird
   blau wie in der echten App, dann laeuft der Feed weiter und beginnt
   von vorn. Laeuft nur, solange das Handy zu sehen ist (paket-werbung.js). */
.pw-feed.is-laeuft .pw-feed__liste { animation: pw-feed-lauf 12s infinite; }
.pw-feed.is-laeuft .pw-post__cta { animation: pw-feed-knopf 12s infinite; }
@keyframes pw-feed-lauf {
  0% { transform: translateY(0); opacity: 0; }
  4% { transform: translateY(0); opacity: 1; }
  16% { transform: translateY(0); opacity: 1; animation-timing-function: cubic-bezier(.3,.1,.15,1); }
  32% { transform: translateY(calc(var(--pw-ziel, 373px) * -1)); opacity: 1; }
  76% { transform: translateY(calc(var(--pw-ziel, 373px) * -1)); opacity: 1; animation-timing-function: cubic-bezier(.4,0,.2,1); }
  90% { transform: translateY(calc(var(--pw-weiter, 623px) * -1)); opacity: 1; }
  95% { transform: translateY(calc(var(--pw-weiter, 623px) * -1)); opacity: 0; }
  100% { transform: translateY(0); opacity: 0; }
}
@keyframes pw-feed-knopf {
  0%, 44% { background: #EFEFEF; color: #262626; }
  47%, 86% { background: #0095F6; color: #FFFFFF; }
  89%, 100% { background: #EFEFEF; color: #262626; }
}
@media (prefers-reduced-motion: reduce) {
  .pw-feed.is-laeuft .pw-feed__liste, .pw-feed.is-laeuft .pw-post__cta { animation: none; }
}
.pw-journey { padding-top: 10px; }
.pw-journey > h3 { max-width: 26ch; margin-bottom: 26px; }
.pw-journey ol { display: grid; }
.pw-journey li { display: flex; align-items: flex-start; gap: 18px; padding-bottom: 25px; position: relative; }
.pw-journey li:not(:last-child)::after { content: ''; position: absolute; top: 35px; bottom: 0; left: 17px; width: 1px; background: #AEC3C8; }
.pw-step-no { flex: 0 0 35px; display: grid; place-items: center; height: 35px; background: #17343C; color: #F4F7F7; border-radius: 50%; font-size: 14px; }
.pw-journey li p { font-size: 16px; line-height: 1.65; margin-top: 7px; color: #465E65; }
.pw-journey__aside { border-top: 1px solid #BCCDD1; padding-top: 19px; font-size: 14px; color: #465E65; }
.pw-production { background: #FFFFFF; }
.pw-production__grid { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(0,1fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.pw-production__figure { margin: 0; overflow: hidden; border-radius: 13px; background: #DCE6E8; }
.pw-production__figure img { width: 100%; aspect-ratio: 1.02; height: auto; object-fit: cover; object-position: 58% center; }
.pw-production__figure figcaption { padding: 12px 16px; font-size: 12px; color: #465E65; }
.pw-production__copy > p { margin-top: 21px; font-size: 17px; color: #465E65; }
.pw-production__list { margin-top: 24px; }
.pw-production__list li { padding: 15px 0; border-top: 1px solid #CCDADD; }
.pw-production__list strong { color: #17343C; font-size: 17px; display: block; }
.pw-production__list span { display: block; margin-top: 3px; font-size: 15px; color: #465E65; }
.pw-production__copy p.pw-small { font-size: 13px; margin-top: 16px; }
.pw-scope__grid { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(0,1fr); gap: clamp(30px, 6vw, 86px); }
.pw-services { margin: 0; border-top: 1px solid #B8CCD0; }
.pw-services > div { padding: 23px 0; border-bottom: 1px solid #C7D5D8; }
.pw-services dt { font: 600 21px/1.35 var(--display); color: #0C1C22; letter-spacing: -.02em; }
.pw-services dd { font-size: 16px; color: #465E65; margin: 9px 0 0; max-width: 57ch; }
.pw-costs { padding: 30px; border-radius: 13px; background: #E7EFEF; align-self: start; }
.pw-costs ol { margin-top: 24px; }
.pw-costs li { padding-block: 16px; border-top: 1px solid #BCCDD1; }
.pw-costs strong { display: block; color: #17343C; font-size: 16px; }
.pw-costs span { display: block; color: #465E65; font-size: 14px; margin-top: 4px; }
.pw-costs > p { margin-top: 10px; font-size: 14px; color: #465E65; }
.pw-costs .pw-textlink { font-size: 14px; margin-top: 13px; }
.pw-scope__boundary { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr); gap: 24px; background: #FFFFFF; border-left: 3px solid #C9922E; padding: 23px 27px; margin-top: 31px; }
.pw-scope__boundary strong { color: #17343C; font-size: 17px; }
.pw-scope__boundary p { color: #465E65; font-size: 15px; }
.pw-results { position: relative; overflow: hidden; }
.pw-results > .wrap { position: relative; }
.pw-results .pw-heading > p { color: #C7D7DB; }
.pw-metrics { margin: 0; }
.pw-metrics > div { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,1.3fr) minmax(0,.75fr); align-items: center; gap: 26px; border-top: 1px solid #38525B; padding: 26px 0; }
.pw-metrics dt { color: #F4F7F7; font: 600 21px/1.3 var(--display); letter-spacing: -.02em; }
.pw-metrics dd { margin: 0; color: #CEDCE0; font-size: 16px; }
.pw-metrics dd.pw-metric-source { font-size: 13px; color: #E3AC45; }
.pw-results__note { border-top: 1px solid #38525B; padding-top: 23px; color: #B8CDD2; font-size: 13px; max-width: 95ch; }
.pw-start { background: #FFFFFF; }
.pw-start__grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(30px, 7vw, 100px); }
.pw-start h2 { max-width: 21ch; }
.pw-start__intro { margin-top: 24px; color: #465E65; font-size: 17px; }
.pw-fit { margin-top: 29px; border-left: 3px solid #C9922E; padding-left: 24px; }
.werbung-page main .pw-fit h3 { font-size: 19px; }
.pw-fit ul { padding-left: 18px; list-style: disc; margin-block: 13px; }
.pw-fit li { font-size: 15px; color: #465E65; margin-top: 6px; padding-left: 3px; }
.pw-fit p { font-size: 13px; color: #526970; }
.pw-start__process { padding-top: 6px; }
.pw-start__process ol { margin-top: 27px; }
.pw-start__process li { display: flex; gap: 22px; border-top: 1px solid #C7D5D8; padding-block: 24px; }
.pw-start__process li > span { color: #7D591B; font: 500 20px/1.3 var(--display); padding-top: 2px; }
.pw-start__process li p { color: #465E65; margin-top: 8px; font-size: 16px; }
.pw-start__process > .btn { margin-top: 8px; }
.pw-faq { background: #E7EFEF; }
.pw-faq__grid { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.4fr); gap: clamp(30px, 7vw, 100px); }
.pw-faq__grid > div > p { color: #465E65; margin-top: 22px; font-size: 17px; }
.pw-faq details { border-top: 1px solid #B3C7CC; }
.pw-faq details:last-child { border-bottom: 1px solid #B3C7CC; }
.pw-faq summary { list-style: none; position: relative; padding: 22px 38px 22px 0; cursor: pointer; color: #0C1C22; font: 600 18px/1.45 var(--text); }
.pw-faq summary::-webkit-details-marker { display: none; }
.pw-faq summary::after { content: '+'; position: absolute; right: 5px; top: 20px; font-size: 23px; font-weight: 400; }
.pw-faq details[open] summary::after { content: '−'; }
.pw-faq summary:hover { color: #006277; }
.pw-faq details > div { padding: 0 30px 24px 0; font-size: 16px; color: #465E65; }
.pw-close__grid { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(0,1fr); gap: clamp(30px, 7vw, 100px); align-items: center; }
.pw-close h2 { max-width: 21ch; }
.pw-close .lead { color: #CEDCE0; font-size: 18px; margin-top: 25px; max-width: 56ch; }
.pw-phone { color: #F4F7F7; display: inline-flex; align-items: center; min-height: 44px; font-size: 16px; }
.pw-close__aside { border-left: 1px solid #38525B; padding-left: 34px; }
.werbung-page main .pw-close__aside h3 { font-size: 20px; }
.pw-close__aside ul { margin-top: 21px; color: #C7D7DB; font-size: 15px; }
.pw-close__aside li { position: relative; padding-left: 23px; margin-top: 12px; }
.pw-close__aside li::before { content: '✓'; color: #E3AC45; position: absolute; left: 0; }
.pw-close__aside .pw-textlink { color: #E3AC45; font-size: 14px; margin-top: 23px; }
@media (min-width: 821px) { .werbung-page .pw-hero { padding-top: 52px; padding-bottom: 45px; } }
@media (max-width: 1100px) {
 .pw-hero__grid { gap: 32px; }
 .werbung-page .pw-hero h1 { font-size: 47px; }
 .pw-hero__visual img { aspect-ratio: .91; }
 .pw-hero__copy > .lead { font-size: 17px; }
 .pw-adpanel { padding: 23px; }
 .pw-metrics > div { grid-template-columns: 1fr 1.3fr; gap: 11px 25px; }
 .pw-metric-source { grid-column: 2; }
}
@media (max-width: 820px) {
 .pw-hero__grid, .pw-heading, .pw-example__grid, .pw-production__grid, .pw-scope__grid, .pw-start__grid, .pw-faq__grid, .pw-close__grid { grid-template-columns: 1fr; gap: 30px; }
 .werbung-page .pw-hero { padding-top: 32px; }
 .werbung-page .pw-hero h1 { font-size: clamp(39px, 6vw, 53px); max-width: 20ch; }
 .pw-hero__copy > .lead { max-width: 58ch; }
 .pw-hero__visual { max-width: 640px; }
 .pw-hero__visual img { aspect-ratio: 1.5; }
 .pw-promises { gap: 20px; margin-top: 32px; }
 .pw-promises li + li { padding-left: 20px; }
 .pw-promises strong { font-size: 16px; }
 .pw-promises span { font-size: 14px; }
 .pw-heading { gap: 20px; }
 .pw-heading h2 { max-width: 27ch; }
 .pw-heading > p { max-width: 60ch; font-size: 17px; }
 .pw-ads { max-width: 620px; }
 .pw-tabs-ready .pw-adpanel { min-height: 0; }
 .pw-adpanel { padding: 26px; }
 .pw-journey { padding-top: 0; }
 .pw-journey > h3 { max-width: none; }
 .pw-production__figure { max-width: 640px; }
 .pw-production__figure img { aspect-ratio: 1.6; }
 .pw-production__copy h2 { max-width: 26ch; }
 .pw-production__list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
 .pw-scope__grid { gap: 27px; }
 .pw-costs ol { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
 .pw-costs { padding: 27px; }
 .pw-costs > h3 { max-width: none; }
 .pw-scope__boundary { grid-template-columns: 1fr; gap: 8px; }
 .pw-start h2 { max-width: 26ch; }
 .pw-start__process { padding-top: 8px; }
 .pw-start__process li { padding-block: 20px; }
 .pw-close__aside { border-left: 0; border-top: 1px solid #38525B; padding: 28px 0 0; }
 .pw-close__aside ul { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 24px; }
 .pw-close__aside li { margin: 0; }
 .pw-close__aside .pw-textlink { margin-top: 18px; }
}
@media (max-width: 600px) {
 .werbung-page main > .section { padding-block: 49px; }
 .werbung-page .pw-hero { padding-top: 24px; padding-bottom: 30px; }
 .werbung-page main h2 { font-size: 32px; }
 .werbung-page .pw-hero h1 { font-size: clamp(37px, 9.2vw, 49px); line-height: 1.08; max-width: 17ch; }
 .pw-back { margin-bottom: 17px; font-size: 13px; }
 .pw-hero__copy > .lead { margin-top: 22px; font-size: 17px; line-height: 1.65; }
 .pw-actions { margin-top: 23px; gap: 10px; }
 .pw-actions > .btn { width: 100%; justify-content: center; }
 .pw-fine { text-align: center; font-size: 12px; }
 .pw-hero__jump { width: 100%; justify-content: center; font-size: 13px; margin-top: 8px; }
 .pw-hero__grid { gap: 27px; }
 .pw-hero__visual img { aspect-ratio: 1.2; }
 .pw-hero__visual figcaption { padding: 15px 17px; }
 .pw-hero__visual figcaption > span { font-size: 15px; }
 .pw-promises { grid-template-columns: 1fr; gap: 0; padding-top: 8px; margin-top: 29px; }
 .pw-promises li { padding: 17px 0; display: grid; grid-template-columns: minmax(0,.86fr) minmax(0,1fr); gap: 17px; }
 .pw-promises li + li { border-left: 0; border-top: 1px solid #38525B; padding-left: 0; }
 .pw-promises strong { font-size: 15px; margin: 0; }
 .pw-promises span { font-size: 13px; line-height: 1.6; }
 .pw-heading { margin-bottom: 27px; }
 .pw-example__top { margin-bottom: 21px; gap: 13px; }
 .pw-tabs { width: 100%; }
 .pw-tabs button { flex: 1; padding-inline: 12px; }
 .pw-example__note { font-size: 12px; }
 .pw-adpanel { padding: 21px 18px; border-radius: 11px; }
 .werbung-page main .pw-panel-label { font-size: 18px; margin-bottom: 19px; }
 .pw-ad-caption { font-size: 11px; }
 .pw-journey > h3 { font-size: 24px; }
 .pw-journey li { gap: 14px; padding-bottom: 22px; }
 .werbung-page main h4 { font-size: 18px; }
 .pw-journey li p { font-size: 15px; }
 .pw-journey__aside { font-size: 13px; }
 .pw-production__figure img { aspect-ratio: 1.12; }
 .pw-production__list { grid-template-columns: 1fr; gap: 0; }
 .pw-production__copy > p { font-size: 16px; }
 .pw-services > div { padding-block: 20px; }
 .pw-services dt { font-size: 21px; }
 .pw-services dd { font-size: 15px; }
 .pw-costs { padding: 24px 22px; }
 .pw-costs ol { grid-template-columns: 1fr; gap: 0; margin-top: 21px; }
 .pw-scope__boundary { padding: 21px; }
 .pw-metrics > div { grid-template-columns: 1fr; gap: 9px; padding-block: 22px; }
 .pw-metrics dt { font-size: 22px; }
 .pw-metrics dd { font-size: 15px; }
 .pw-metric-source { grid-column: auto; }
 .pw-metrics dd.pw-metric-source { font-size: 12px; margin-top: 2px; }
 .pw-results__note { font-size: 12px; }
 .pw-start__intro { font-size: 16px; }
 .pw-start__process li { gap: 18px; }
 .pw-start__process li p { font-size: 15px; }
 .pw-start__process > .btn { width: 100%; justify-content: center; }
 .pw-faq summary { font-size: 17px; padding-block: 20px; }
 .pw-faq details > div { padding-right: 10px; font-size: 15px; }
 .pw-close .lead { font-size: 17px; }
 .pw-phone { justify-content: center; margin-inline: auto; }
 .pw-close__aside ul { grid-template-columns: 1fr; gap: 12px; }
}
@media (max-width: 360px) {
 .werbung-page main h2 { font-size: 29px; }
 .werbung-page .pw-hero h1 { font-size: 35px; }
 .pw-promises li { grid-template-columns: 1fr; gap: 6px; }
 .pw-promises span { max-width: none; }
 .pw-adpanel { padding: 20px 15px; }
 .pw-tabs button { font-size: 14px; }
 .werbung-page .sticky-cta .btn { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
 .werbung-page *, .werbung-page *::before, .werbung-page *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
/* Keep keyboard targets above the existing mobile action bar and companion. */
html:has(> body.werbung-page) { scroll-padding-bottom: 240px; }
.werbung-page main :is(a, button, summary, [role="tabpanel"]) { scroll-margin-block: 110px 240px; }
@media (max-height: 650px) {
 html:has(> body.werbung-page) { scroll-padding-bottom: 140px; }
 .werbung-page main :is(a, button, summary, [role="tabpanel"]) { scroll-margin-bottom: 140px; }
}