/* Redesign „Konzept A" — LEGAL / CONTENT pages (page=pages). Covers the CMS content pages reached from the footer: AGB (terms_and_conditions), Datenschutzvereinbarung (dataprivacy), Kontakt (contact_us) and Impressum. The native markup is a wide, unstyled block: .container.pagecontainer > .content-holder > .rightcontent > h1.center_box_heading (title, via Pages::DrawTitle) > …raw CMS html… (body, via Pages::DrawText) default.php tags with `rdA-legal` only on page=pages, so every rule here is scoped to that class and can't leak onto other pages. Live `custom` theme is untouched. */ /* ----- page canvas + readable article column ---------------------------- */ body.rdA-legal { background: var(--rd-bg-soft, #f4f8f6); } body.rdA-legal .container.pagecontainer { max-width: 1040px !important; width: auto !important; margin: 0 auto !important; float: none !important; padding: 0 18px !important; } /* content.php wraps EVERY page's content in #grid.grid.rdA-grid (the listing cards|map grid, which is display:grid globally). On the legal pages that squeezed `.pages_contents` into a ~255px grid column → unreadable. Collapse it to a plain block so the legal text spans the full card width. */ body.rdA-legal .grid.rdA-grid { display: block !important; } body.rdA-legal .content-holder, body.rdA-legal .content-holder.offset-3 { width: auto !important; margin: 0 !important; float: none !important; } /* the article itself = one rounded white card */ body.rdA-legal .rightcontent { width: auto !important; float: none !important; margin: 26px 0 52px !important; background: #fff; border: 1px solid var(--rd-line, #e7eef0); border-radius: 18px; padding: clamp(22px, 4.5vw, 52px); box-shadow: 0 8px 28px rgba(16, 40, 28, .06); font-family: var(--rd-text, 'Inter', system-ui, sans-serif); } /* ----- title ------------------------------------------------------------ */ body.rdA-legal .center_box_heading { display: block; font-family: var(--rd-display, 'Plus Jakarta Sans', system-ui, sans-serif); font-size: clamp(26px, 3.8vw, 36px); font-weight: 800; line-height: 1.15; color: var(--rd-navy, #15262f); margin: 0 0 20px; padding: 0 0 16px; border-bottom: 3px solid var(--rd-green, #00A057); } /* ----- body typography -------------------------------------------------- */ body.rdA-legal .rightcontent p, body.rdA-legal .rightcontent li, body.rdA-legal .rightcontent td { color: var(--rd-ink, #243239); line-height: 1.75; font-size: 15.5px; } body.rdA-legal .rightcontent p { margin: 0 0 14px; } body.rdA-legal .rightcontent h1, body.rdA-legal .rightcontent h2, body.rdA-legal .rightcontent h3, body.rdA-legal .rightcontent h4, body.rdA-legal .rightcontent h5, body.rdA-legal .rightcontent strong b, body.rdA-legal .rightcontent > b { font-family: var(--rd-display, 'Plus Jakarta Sans', system-ui, sans-serif); } body.rdA-legal .rightcontent h2, body.rdA-legal .rightcontent h3, body.rdA-legal .rightcontent h4 { color: var(--rd-green-700, #008a4c); font-weight: 700; line-height: 1.3; margin: 28px 0 10px; } body.rdA-legal .rightcontent h2 { font-size: 21px; } body.rdA-legal .rightcontent h3 { font-size: 18px; } body.rdA-legal .rightcontent h4 { font-size: 16px; } body.rdA-legal .rightcontent strong, body.rdA-legal .rightcontent b { color: var(--rd-navy, #15262f); } body.rdA-legal .rightcontent a { color: var(--rd-green-700, #008a4c); text-decoration: underline; text-underline-offset: 2px; word-break: break-word; } body.rdA-legal .rightcontent a:hover { color: var(--rd-green, #00A057); } body.rdA-legal .rightcontent ul, body.rdA-legal .rightcontent ol { margin: 0 0 16px; padding-left: 22px; } body.rdA-legal .rightcontent li { margin: 5px 0; } body.rdA-legal .rightcontent ul li::marker { color: var(--rd-green, #00A057); } body.rdA-legal .rightcontent hr { border: 0; border-top: 1px solid var(--rd-line, #e7eef0); margin: 26px 0; } body.rdA-legal .rightcontent img { max-width: 100%; height: auto; border-radius: 10px; } /* tame any legacy fixed-width / inline-styled tables in the CMS html */ body.rdA-legal .rightcontent table { width: 100% !important; max-width: 100%; border-collapse: collapse; margin: 18px 0; } body.rdA-legal .rightcontent th, body.rdA-legal .rightcontent td { border: 1px solid var(--rd-line, #e7eef0); padding: 9px 12px; text-align: left; vertical-align: top; } body.rdA-legal .rightcontent th { background: var(--rd-green-50, #eaf7f0); color: var(--rd-navy, #15262f); } /* ----- Kontakt contact form -------------------------------------------- */ body.rdA-legal .rightcontent input[type="text"], body.rdA-legal .rightcontent input[type="email"], body.rdA-legal .rightcontent input[type="tel"], body.rdA-legal .rightcontent input[type="number"], body.rdA-legal .rightcontent textarea, body.rdA-legal .rightcontent select { width: 100%; max-width: 420px; box-sizing: border-box; padding: 11px 13px; border: 1px solid var(--rd-line, #e7eef0); border-radius: 10px; font: inherit; font-size: 15px; color: var(--rd-ink, #243239); background: #fff; transition: border-color .15s, box-shadow .15s; } body.rdA-legal .rightcontent textarea { min-height: 130px; max-width: 100%; resize: vertical; } body.rdA-legal .rightcontent input:focus, body.rdA-legal .rightcontent textarea:focus, body.rdA-legal .rightcontent select:focus { outline: 0; border-color: var(--rd-green, #00A057); box-shadow: 0 0 0 3px var(--rd-green-100, #cdeeda); } /* contact form table layout → comfortable spacing without restructuring */ body.rdA-legal .rightcontent form td { border: 0; padding: 6px 8px 6px 0; } body.rdA-legal .rightcontent .mandatory_star { color: #c0492f; } /* primary button (contact submit, etc.) */ body.rdA-legal .rightcontent input[type="submit"], body.rdA-legal .rightcontent button[type="submit"], body.rdA-legal .rightcontent .form_button, body.rdA-legal .rightcontent .btn-primary { display: inline-block; background: var(--rd-green, #00A057); color: #fff !important; border: 0; border-radius: 999px; padding: 12px 26px; font-family: var(--rd-display, 'Plus Jakarta Sans', system-ui, sans-serif); font-weight: 700; font-size: 15px; cursor: pointer; transition: background .15s, transform .05s; -webkit-appearance: none; appearance: none; } body.rdA-legal .rightcontent input[type="submit"]:hover, body.rdA-legal .rightcontent button[type="submit"]:hover, body.rdA-legal .rightcontent .form_button:hover, body.rdA-legal .rightcontent .btn-primary:hover { background: var(--rd-green-700, #008a4c); } body.rdA-legal .rightcontent input[type="submit"]:active, body.rdA-legal .rightcontent .form_button:active { transform: translateY(1px); } /* ----- mobile ----------------------------------------------------------- */ @media (max-width: 760px) { body.rdA-legal .container.pagecontainer { padding: 0 12px !important; } body.rdA-legal .rightcontent { padding: 20px 16px; border-radius: 14px; margin: 14px 0 34px !important; } body.rdA-legal .center_box_heading { font-size: 24px; } }