/* Native TM24 shell and checkout adapters for Claude's approved premium components.
 * Existing IDs, legal text, form handlers and route visibility remain authoritative.
 * Specific legacy !important declarations are contained here, never applied globally. */
body.page-ankauf.tm-ui { margin:0; background:var(--tm-bg); color:var(--tm-ink); font-family:var(--tm-font); font-size:var(--tm-fs-base); overflow-x:clip; }
body.tm-ui [hidden] { display:none !important; }
body.tm-ui .tm-wrap { width:100%; max-width:var(--tm-max); margin-inline:auto; }
body.tm-ui ::selection { background:var(--tm-accent-soft); color:var(--tm-accent-ink); }
body.tm-ui :is(input,textarea) { caret-color:var(--tm-accent); }
body.tm-ui :is(a,button,input,select,textarea):focus-visible { outline:2px solid var(--tm-accent); outline-offset:3px; }
body.tm-ui .tm-input::placeholder { color:var(--tm-muted); opacity:1; }
body.tm-ui .tm-topbar.ankauf-header { position:sticky !important; top:0 !important; z-index:1000; padding:0 !important; background:var(--tm-surface) !important; border:0; border-bottom:1px solid var(--tm-border); box-shadow:none !important; }
body.tm-ui .tm-topbar .tm24-header-grid { display:flex !important; align-items:center; justify-content:space-between; height:var(--tm-header-h,72px) !important; min-height:var(--tm-header-h,72px); padding:0 var(--tm-gutter) !important; gap:24px; max-width:var(--tm-max) !important; }
body.tm-ui .tm24-header-left, body.tm-ui .tm24-header-right { display:flex; align-items:center; gap:24px; min-width:0; }
body.tm-ui .tm-topbar .tm-brand { margin:0; padding:0; flex:none; }
body.tm-ui .tm-topbar .tm-brand img { width:auto !important; height:var(--tm-logo-h,34px) !important; max-width:170px !important; max-height:var(--tm-logo-h,34px) !important; object-fit:contain; }
/* Insel "Verkaufen | Kaufen | B2B": ausschliesslich templates/NOVAChild/css/tm24-pills-master.css (v4). Keine lokalen Overrides. */
body.tm-ui .ankauf-icon-link.tm-btn { min-height:40px; border:1px solid var(--tm-border-strong); background:var(--tm-surface); color:var(--tm-ink); font-size:var(--tm-fs-sm); font-weight:600; border-radius:var(--tm-r-pill); box-shadow:none; padding:0 14px; white-space:nowrap; }
body.tm-ui .ankauf-icon-link.tm-btn:hover { border-color:var(--tm-blue); color:var(--tm-blue); background:var(--tm-blue-soft); }
body.tm-ui .ankauf-icon-link i { display:none; }
body.tm-ui .ankauf-icon-link span { display:inline !important; }
body.tm-ui .ankauf-burger-btn { width:44px; height:44px; border:1px solid var(--tm-border); border-radius:var(--tm-r-sm); }
body.tm-ui .lang-pill { color:var(--tm-ink-2); }
body.tm-ui .lang-pill.active { background:var(--tm-accent-soft); color:var(--tm-accent-ink); }
body.tm-ui #mobile-nav { background:var(--tm-surface); }
body.tm-ui #mobile-nav a { color:var(--tm-ink-2); border-color:var(--tm-border); }
body.tm-ui #mobile-nav a.active { background:var(--tm-accent-soft); color:var(--tm-accent-ink); }
body.tm-ui #tm24-ankauf-hero { margin:0; padding:28px 0 0; overflow:visible; background:var(--tm-surface); border:0; border-bottom:1px solid var(--tm-border); border-radius:0; box-shadow:none; }
body.tm-ui #tm24-ankauf-hero h1 { text-transform:none; font-family:var(--tm-font); font-size:clamp(30px,4.4vw,50px); font-weight:var(--tm-h-weight,800); color:var(--tm-ink); line-height:1.06; letter-spacing:-.03em; margin:0; }
body.tm-ui #tm24-ankauf-hero .tm-hero-sub { color:var(--tm-ink-2); margin-top:16px; }
body.tm-ui .tm-hero-search { margin:24px 0 0; padding:0; max-width:560px; border:0; border-radius:0; background:transparent; }
body.tm-ui .tm-hero-search .tm-search { margin:0; min-height:60px; padding:6px 18px; border:1.5px solid var(--tm-border-strong); border-radius:var(--tm-r-pill); box-shadow:var(--tm-shadow-2); gap:10px; }
body.tm-ui .tm-hero-search .tm-search:focus-within { border-color:var(--tm-accent); box-shadow:0 0 0 3px var(--tm-accent-ring); }
body.tm-ui .tm-hero-search .suche-icon { position:static; transform:none; width:20px; height:20px; margin:0; color:var(--tm-muted); flex:none; }
body.tm-ui .tm-hero-search .suche-input,body.tm-ui .tm-hero-search .suche-input:focus { min-width:0; width:100%; height:44px; border:0 !important; border-radius:0; padding:0 !important; font:400 16px/1.4 var(--tm-font); color:var(--tm-ink); background:transparent; outline:0 !important; box-shadow:none !important; }
body.tm-ui .tm-hero-search .suche-input::placeholder { color:var(--tm-muted); }
body.tm-ui .tm-hero-search .suche-ergebnisse { z-index:1100; top:calc(100% + 8px); padding:6px; border:1px solid var(--tm-border); border-radius:var(--tm-r-md); box-shadow:var(--tm-shadow-2); max-height:min(60vh,420px); }
body.tm-ui .tm-hero-search .suche-ergebnisse:empty { display:none; }
body.tm-ui .tm-hero-search .suche-item { color:var(--tm-ink); background:var(--tm-surface); border-radius:var(--tm-r-sm); border:0; min-height:60px; }
body.tm-ui .tm-hero-search .suche-item:hover,body.tm-ui .tm-hero-search [aria-selected="true"] { background:var(--tm-accent-soft); }
body.tm-ui .tm24-search-contact { margin-top:16px; padding:16px; background:var(--tm-surface-2); border:1px solid var(--tm-border); border-radius:var(--tm-r-md); color:var(--tm-ink-2); }
body.tm-ui .tm24-search-contact h3 { color:var(--tm-ink); font-size:var(--tm-fs-md); }
body.tm-ui .tm24-search-contact__links { display:flex; flex-wrap:wrap; gap:12px; }
body.tm-ui .tm24-search-contact__links a { color:var(--tm-accent-ink); }
body.tm-ui .tm-facts-row { margin-bottom:0; }
body.tm-ui .tm-facts-row b { text-transform:none; }
body.tm-ui #kategorie-auswahl.tm-block { grid-column:1/-1; width:100%; max-width:none; padding:28px 0 0 !important; margin:0 !important; background:transparent !important; border:0 !important; box-shadow:none !important; }
body.tm-ui .tm24-category-section__title { display:block; text-align:left !important; margin-bottom:16px !important; }
body.tm-ui .tm24-category-section__title h2 { text-transform:none !important; color:var(--tm-ink) !important; font-size:clamp(24px,3vw,32px) !important; font-weight:700 !important; letter-spacing:-.02em !important; }
body.tm-ui .tm24-category-section__title p { color:var(--tm-muted); margin:8px 0 0; }
body.tm-ui #tm24-category-grid { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:12px !important; padding:0 !important; }
body.tm-ui #tm24-category-grid .tm-cat { display:grid !important; gap:12px; padding:14px 14px 18px !important; min-width:0; border:1px solid var(--tm-border) !important; border-radius:var(--tm-r-md) !important; background:var(--tm-surface) !important; box-shadow:none !important; text-align:left !important; cursor:pointer; transform:none; }
body.tm-ui #tm24-category-grid .tm-cat:hover,body.tm-ui #tm24-category-grid .tm-cat.is-active { border-color:var(--tm-accent) !important; box-shadow:none !important; }
body.tm-ui #tm24-category-grid .tm-cat.is-active { background:var(--tm-blue-soft) !important; }
body.tm-ui #tm24-category-grid .tm-cat:focus-visible { outline:2px solid var(--tm-accent); outline-offset:3px; }
@media(min-width:600px) { body.tm-ui #tm24-category-grid { grid-template-columns:repeat(4,minmax(0,1fr)) !important; } }
body.tm-ui #tm24-category-grid .tm24-category-card__image { width:100%; height:auto !important; aspect-ratio:1; border-radius:10px; background:var(--tm-surface-2) !important; overflow:hidden; padding:8px; }
body.tm-ui #tm24-category-grid .tm24-category-card__image img { width:100% !important; height:100% !important; max-height:none !important; object-fit:contain; mix-blend-mode:multiply; }
body.tm-ui #tm24-category-grid .tm24-category-card__name { color:var(--tm-ink) !important; font:700 17px/1.3 var(--tm-font) !important; background:transparent !important; padding:0 4px !important; }
body.tm-ui #tm24-eco-badge { display:flex; gap:10px; align-items:flex-start; max-width:var(--tm-max); margin:20px auto 0; padding:0 var(--tm-gutter); border:0; border-radius:0; background:transparent; color:var(--tm-muted); font-size:var(--tm-fs-sm); box-shadow:none; }
body.tm-ui #tm24-eco-badge .tm24-eco-badge__icon { background:transparent; color:var(--tm-success); }
body.tm-ui .tm24-entry-support { max-width:var(--tm-max); margin:0 auto 36px; padding:0 var(--tm-gutter); }
body.tm-ui .tm24-order-status-entry { max-width:none; padding:16px 18px; border:1px solid var(--tm-border); border-radius:var(--tm-r-md); background:var(--tm-surface); color:var(--tm-ink); box-shadow:none; }
body.tm-ui .tm24-order-status-entry__icon { color:var(--tm-accent); background:var(--tm-accent-soft); }
body.tm-ui .tm-how.tm24-flyer-hero__process-wrap { display:block; max-width:none; margin:0; padding:56px 0; border:0; border-block:1px solid var(--tm-border); border-radius:0; box-shadow:none; background:var(--tm-surface); }
body.tm-ui .tm-how h2 { text-transform:none; color:var(--tm-ink); font-weight:750; margin:0; text-align:left; }
body.tm-ui .tm-how-steps li { font-size:var(--tm-fs-base); }
body.tm-ui .tm-how-steps b { text-transform:none; color:var(--tm-ink); }
body.tm-ui .tm-how-steps span:last-child { line-height:1.55; }
body.tm-ui #faq-section { padding:56px var(--tm-gutter); }
body.tm-ui #faq-section .tm24-faq { max-width:none; margin:0; padding:0; background:transparent; }
body.tm-ui #faq-section :is(.tm24-faq-title,.tm24-faq-sub) { text-align:left; color:var(--tm-ink); }
body.tm-ui #faq-section .tm24-faq-title { font-size:clamp(24px,3vw,32px); font-weight:700; margin:0 0 16px; }
body.tm-ui #faq-section .tm24-faq-sub { color:var(--tm-muted); margin-bottom:16px; }
body.tm-ui #faq-section .tm24-faq-item { margin:0; border:0; border-bottom:1px solid var(--tm-border); border-radius:0; background:transparent; box-shadow:none; }
body.tm-ui #faq-section .tm24-faq-q { color:var(--tm-ink); font-size:var(--tm-fs-md); font-weight:600; padding:18px 0; background:transparent; }
body.tm-ui #faq-section .tm24-faq-ico { display:none; }
body.tm-ui #faq-section .tm24-faq-a { padding:0 0 18px; color:var(--tm-ink-2); font-size:var(--tm-fs-base); line-height:1.55; }
/* Footer: gemeinsame Komponente templates/NOVAChild/css/tm24-footer.css. Hier nur die Reparatur der Legacy-Kaskade
   (tm24-ankauf-redesign.css setzt .tm24-footer{padding:0} und einen Verlauf). */
body.tm-ui .tm24-footer#ankauf-footer { margin:0; padding:0 var(--tm-gutter); border:0; border-radius:0; background:var(--tm-navy) !important; background-image:none !important; color:var(--tm-on-navy); }
body.tm-ui .tm24-footer#ankauf-footer .tm24-footer__grid { padding-top:44px; }
/* The checkout retains a single set of real form fields; this is a layout adapter only. */
body.tm-ui #schritt-4 { width:100%; max-width:var(--tm-max); background:transparent !important; color:var(--tm-ink); padding:32px var(--tm-gutter) 80px !important; min-height:60vh; }
body.tm-ui #schritt-4 .checkout-content { max-width:800px; margin:0 auto; padding:0; background:transparent; border:0; box-shadow:none; border-radius:0; overflow:visible; }
body.tm-ui #schritt-4 .wizard-back-btn { margin:0 0 20px; background:transparent !important; border:0; color:var(--tm-accent); box-shadow:none !important; min-height:44px; }
body.tm-ui #schritt-4 .checkout-tabs { display:flex; padding:0; margin:0 0 28px; gap:6px; list-style:none; background:transparent; border:0; border-radius:0; box-shadow:none; overflow:visible; }
body.tm-ui #schritt-4 .checkout-tabs::after { content:none; }
body.tm-ui #schritt-4 .checkout-tab { display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:0; flex:1; min-width:0; min-height:48px; padding:14px 0 0 !important; border:0; border-radius:0; background:transparent; font-size:var(--tm-fs-xs) !important; color:var(--tm-muted); font-weight:600; text-align:left; }
body.tm-ui #schritt-4 .checkout-tab::after { content:''; position:absolute; top:0; left:0; right:0; bottom:auto; height:4px; background:var(--tm-border); border-radius:2px; }
body.tm-ui #schritt-4 .checkout-tab:is(.active,.done)::after { background:var(--tm-accent); }
body.tm-ui #schritt-4 .checkout-tab.active { color:var(--tm-accent-ink); }
body.tm-ui #schritt-4 .checkout-tab.done { color:var(--tm-ink-2); }
body.tm-ui #schritt-4 .checkout-tab-nr { display:none; }
body.tm-ui #schritt-4 .checkout-pane-inner { padding:0 !important; background:transparent; border:0; border-radius:0; box-shadow:none; }
body.tm-ui #schritt-4 .checkout-pane.active { animation:none; }
body.tm-ui #schritt-4 .checkout-pane-titel { font-size:clamp(24px,3vw,30px); font-weight:700; color:var(--tm-ink); letter-spacing:-.02em; line-height:1.2; border:0; margin:0 0 20px; padding:0; }
body.tm-ui #schritt-4 .checkout-intro-hint { padding:0; margin:0 0 28px; background:transparent; border:0; color:var(--tm-muted); font-size:var(--tm-fs-base); }
body.tm-ui #schritt-4 .checkout-form-section { display:block; margin:0 0 32px; padding:0; background:transparent; border:0; border-radius:0; box-shadow:none; }
body.tm-ui #schritt-4 :is(.checkout-form-section-title,.auszahlung-titel) { font:650 20px/1.4 var(--tm-font); color:var(--tm-ink); margin:0 0 14px; padding:0; border:0; }
body.tm-ui #schritt-4 .form-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:0; }
body.tm-ui #schritt-4 .form-row>.form-group { width:auto !important; max-width:none !important; flex:none !important; min-width:0; padding:0; margin-bottom:14px; }
body.tm-ui #schritt-4 .form-label { font:500 14px/1.5 var(--tm-font); text-transform:none; letter-spacing:0; color:var(--tm-ink-2); margin-bottom:6px; }
body.tm-ui #schritt-4 .form-control { width:100% !important; min-width:0; min-height:46px; padding:11px 14px; color:var(--tm-ink); background:var(--tm-surface); border:1.5px solid var(--tm-border); border-radius:var(--tm-r-sm); font:400 16px/1.4 var(--tm-font); box-shadow:none; }
/* Replace the old outline; one ring communicates keyboard and pointer focus. */
body.tm-ui #schritt-4 .form-control:focus,
body.tm-ui #schritt-4 .form-control:focus-visible { border-color:var(--tm-accent) !important; outline:0 !important; box-shadow:0 0 0 3px var(--tm-accent-ring) !important; }
body.tm-ui #schritt-4 .form-control[aria-invalid="true"] { border-color:var(--tm-danger); }
body.tm-ui #schritt-4 .form-control::placeholder { color:var(--tm-muted); opacity:1; }
body.tm-ui #schritt-4 .auszahlung-disclaimer { color:var(--tm-muted); font-size:var(--tm-fs-sm); margin-bottom:14px; }
body.tm-ui #schritt-4 .auszahlung-optionen { padding:0; margin:0; border:0; display:grid; grid-template-columns:1fr 1fr; gap:10px; }
body.tm-ui #schritt-4 .auszahlung-label { position:relative; margin:0; }
body.tm-ui #schritt-4 .auszahlung-label input[type="radio"] { display:block; position:absolute; width:1px; height:1px; opacity:0; }
body.tm-ui #schritt-4 .auszahlung-box { display:flex; align-items:center; gap:12px; min-height:56px; padding:12px 14px; margin:0; border:1.5px solid var(--tm-border) !important; border-radius:var(--tm-r-sm); background:var(--tm-surface) !important; color:var(--tm-ink); box-shadow:none; transform:none; font:600 var(--tm-fs-base)/1.3 var(--tm-font); cursor:pointer; }
body.tm-ui #schritt-4 .auszahlung-box::before { content:""; position:static; flex:none; width:20px; height:20px; border-radius:50%; border:1.5px solid var(--tm-border-strong); background:var(--tm-surface); box-sizing:border-box; }
body.tm-ui #schritt-4 .auszahlung-label input:checked+.auszahlung-box::before { border:6px solid var(--tm-blue); }
body.tm-ui #schritt-4 .auszahlung-box__text { flex:1; min-width:0; }
body.tm-ui #schritt-4 .auszahlung-label input:checked+.auszahlung-box { background:var(--tm-accent-soft) !important; border-color:var(--tm-accent) !important; color:var(--tm-accent-ink); box-shadow:none; }
body.tm-ui #schritt-4 .auszahlung-label input:focus-visible+.auszahlung-box { outline:2px solid var(--tm-accent); outline-offset:3px; }
body.tm-ui #schritt-4 .auszahlung-box::after { content:none; }
body.tm-ui #schritt-4 .auszahlung-box i { flex:none; width:22px; text-align:center; font-size:18px; color:var(--tm-blue); }
body.tm-ui #schritt-4 .auszahlung-label input:checked+.auszahlung-box i { color:var(--tm-accent-ink); }
body.tm-ui #schritt-4 .checkout-item-card { display:grid; grid-template-columns:72px minmax(0,1fr) auto; align-items:center; gap:18px; padding:24px; background:var(--tm-surface); border:1px solid var(--tm-border); border-radius:var(--tm-r-md); margin-bottom:16px; box-shadow:none; text-align:left; }
body.tm-ui #schritt-4 .checkout-item-card::before { content:none; }
body.tm-ui #schritt-4 .checkout-item-img { width:72px; height:72px; margin:0; padding:4px; border:0; background:var(--tm-surface-2); border-radius:var(--tm-r-sm); box-shadow:none; }
body.tm-ui #schritt-4 .checkout-item-name { color:var(--tm-ink); font-size:var(--tm-fs-lg); font-weight:650; }
body.tm-ui #schritt-4 .checkout-item-meta { color:var(--tm-muted); font-size:var(--tm-fs-sm); margin:4px 0 0; }
body.tm-ui #schritt-4 .checkout-item-preis-wrap { padding:0; border:0; text-align:right; min-width:0; }
body.tm-ui #schritt-4 .checkout-item-preis-label { color:var(--tm-muted); font-size:var(--tm-fs-xs); }
body.tm-ui #schritt-4 .checkout-item-preis { color:var(--tm-ink); font-size:var(--tm-fs-3xl); font-weight:700; line-height:1.1; letter-spacing:-.03em; }
body.tm-ui #schritt-4 .checkout-preis-hinweis { display:flex; gap:10px; color:var(--tm-muted); font-size:var(--tm-fs-sm); padding:0; margin:0 0 24px; border:0; background:transparent; }
body.tm-ui #schritt-4 .checkout-answer-summary { margin:0 0 24px; padding:24px; border:1px solid var(--tm-border); background:var(--tm-surface); }
body.tm-ui #schritt-4 .checkout-answer-summary h4 { font-size:var(--tm-fs-lg); font-weight:650; color:var(--tm-ink); }
body.tm-ui #schritt-4 #checkout-answer-summary-items { margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:0 28px; list-style:none; }
body.tm-ui #schritt-4 #checkout-answer-summary-items li { display:flex; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid var(--tm-border); font-size:var(--tm-fs-sm); color:var(--tm-ink); }
body.tm-ui #schritt-4 #checkout-answer-summary-items li span { color:var(--tm-muted); }
body.tm-ui #schritt-4 #checkout-answer-summary-items li strong { font-weight:600; text-align:right; }
body.tm-ui #schritt-4 .pflicht-box { display:grid; gap:8px; margin:0; }
body.tm-ui #schritt-4 .check-label { display:grid; grid-template-columns:22px 1fr; padding:14px 16px; gap:12px; margin:0; border:1px solid var(--tm-border); border-radius:var(--tm-r-sm); background:var(--tm-surface); color:var(--tm-ink-2); font-size:var(--tm-fs-sm); line-height:1.5; box-shadow:none; }
body.tm-ui #schritt-4 .check-label:has(input:checked) { border-color:var(--tm-accent); background:var(--tm-accent-soft); }
body.tm-ui #schritt-4 .check-label:focus-within { outline:0; }
body.tm-ui #schritt-4 .check-label input:focus-visible { outline:2px solid var(--tm-accent); outline-offset:3px; }
body.tm-ui #schritt-4 .check-label a { color:var(--tm-accent-ink); }
body.tm-ui #schritt-4 .checkout-final-hint { margin:20px 0; padding:0; background:transparent; border:0; color:var(--tm-muted); font-size:var(--tm-fs-sm); }
body.tm-ui #schritt-4 .checkout-actions { display:flex; flex-direction:row; justify-content:space-between; align-items:center; gap:12px; margin-top:28px; }
body.tm-ui #schritt-4 :is(.btn-checkout-next,.btn-checkout-final,.btn-checkout-back) { min-height:48px; padding:10px 22px; font:600 16px/1.4 var(--tm-font); letter-spacing:0; border-radius:var(--tm-r-pill) !important; border:1px solid transparent; box-shadow:none !important; animation:none !important; max-width:none; flex:0 1 auto; transform:none; white-space:normal; }
body.tm-ui #schritt-4 :is(.btn-checkout-next,.btn-checkout-final) { background:var(--tm-accent) !important; color:#fff !important; }
body.tm-ui #schritt-4 :is(.btn-checkout-next,.btn-checkout-final):hover { background:var(--tm-accent-ink) !important; }
body.tm-ui #schritt-4 :is(.btn-checkout-next,.btn-checkout-final):disabled { background:#b7b9e6 !important; cursor:not-allowed; }
body.tm-ui #schritt-4 .btn-checkout-back { background:transparent !important; color:var(--tm-accent) !important; }
body.tm-ui #schritt-4 :is(.btn-checkout-next,.btn-checkout-final)::before,body.tm-ui #schritt-4 :is(.btn-checkout-next,.btn-checkout-final)::after { content:none; }
body.tm-ui #schritt-4 :is(.btn-checkout-next,.btn-checkout-back,.btn-checkout-final):focus-visible { outline:2px solid var(--tm-accent); outline-offset:3px; }
body.tm-ui #schritt-4 .ssl-hinweis { color:var(--tm-muted); font-size:var(--tm-fs-xs); }
body.tm-ui #schritt-danke { padding:48px var(--tm-gutter) 72px; background:transparent; }
body.tm-ui #schritt-danke .danke-card { max-width:760px; margin:auto; padding:0; border:0; box-shadow:none; background:transparent; border-radius:0; }
body.tm-ui #schritt-danke .danke-titel { color:var(--tm-ink); font-size:clamp(26px,3.4vw,36px); font-weight:700; line-height:1.15; margin:0; }
body.tm-ui #schritt-danke .danke-lead { font-size:var(--tm-fs-base); line-height:1.6; margin:0; color:var(--tm-ink-2); }
body.tm-ui #schritt-danke .danke-steps { display:grid; gap:18px; width:100%; max-width:560px; padding:24px; border:1px solid var(--tm-border); border-radius:var(--tm-r-md); background:var(--tm-surface); text-align:left; }
body.tm-ui #schritt-danke .danke-step { display:flex; gap:14px; align-items:flex-start; padding:0; margin:0; background:transparent; box-shadow:none; border:0; }
body.tm-ui #schritt-danke .danke-step-nr { background:var(--tm-accent-soft); color:var(--tm-accent-ink); font-size:var(--tm-fs-sm); width:28px; height:28px; }
body.tm-ui #schritt-danke .danke-step strong { color:var(--tm-ink); font-weight:650; font-size:var(--tm-fs-base); }
body.tm-ui #schritt-danke .danke-step p { color:var(--tm-muted); margin:4px 0 0; font-size:var(--tm-fs-sm); }
body.tm-ui #schritt-danke .danke-note { color:var(--tm-muted); border:0; background:transparent; padding:0; font-size:var(--tm-fs-sm); }
body.tm-ui #schritt-danke .btn-ankauf-small { background:var(--tm-surface); border:1px solid var(--tm-border-strong); color:var(--tm-ink) !important; font-weight:600; box-shadow:none; }
body.tm-ui #cookie-banner { border-top:1px solid var(--tm-border) !important; border-radius:0 !important; box-shadow:0 -10px 32px rgba(17,24,39,.1) !important; font-family:var(--tm-font) !important; }
body.tm-ui #cookie-banner #tm24-privacy-accept { background:var(--tm-accent) !important; font-weight:600 !important; }
body.tm-ui #cookie-banner #tm24-privacy-reject { border:1px solid var(--tm-border-strong) !important; color:var(--tm-ink-2) !important; }
body.tm-ui .whatsapp-float-btn { box-shadow:0 6px 18px rgba(17,24,39,.18); width:52px; height:52px; right:16px; bottom:16px; }
@media(min-width:960px) { body.tm-ui #tm24-ankauf-hero { padding-top:48px; } body.tm-ui #kategorie-auswahl.tm-block { padding-top:40px !important; } body.tm-ui #faq-section { padding-block:80px !important; } body.tm-ui .tm-how.tm24-flyer-hero__process-wrap { padding-block:72px; } }
@media(min-width:900px) { body.tm-ui #tm24-category-grid { grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:16px !important; } body.tm-ui .tm-how-steps-four { grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px; } }
@media(max-width:959px) { body.tm-ui .tm24-header-left,body.tm-ui .tm24-header-right { gap:10px; } body.tm-ui #schritt-4 { padding-top:24px !important; } }
/* Mobil (<=768): Zeile 1 Logo + Auftragsstatus/Burger, Zeile 2 die Insel - identisch auf Shop, Ankauf, B2B. */
@media(max-width:768px) {
  /* ID-Selektoren: tm24-mobile-unified.css setzt #tm24-home-header .tm24-header-grid{display:flex!important}. */
  body.tm-ui #tm24-home-header .tm24-header-grid { display:grid !important; grid-template-columns:minmax(0,1fr) auto !important; grid-template-rows:auto auto !important; height:auto !important; min-height:0 !important; padding:8px var(--tm-gutter) 8px !important; gap:6px 8px !important; position:static !important; }
  body.tm-ui #tm24-home-header .tm24-header-left { display:contents !important; }
  body.tm-ui #tm24-home-header .tm24-header-left::after { display:none !important; content:none !important; }
  body.tm-ui #tm24-home-header .tm-brand { grid-column:1 !important; grid-row:1 !important; justify-self:start; order:0 !important; flex:none !important; line-height:0; }
  body.tm-ui #tm24-home-header .tm-brand img { height:28px !important; max-height:28px !important; max-width:130px !important; }
  body.tm-ui #tm24-home-header .tm24-pill-nav { grid-column:1/-1 !important; grid-row:2 !important; justify-self:center; display:inline-flex !important; width:auto !important; min-width:0 !important; max-width:100% !important; flex:none !important; margin:0 !important; padding:2px !important; overflow:visible !important; order:0 !important; }
  body.tm-ui #tm24-home-header .tm24-header-right { grid-column:2 !important; grid-row:1 !important; justify-self:end; position:static !important; top:auto !important; right:auto !important; display:flex !important; gap:8px !important; }
  body.tm-ui .ankauf-burger-btn { width:40px; height:40px; }
}
@media(max-width:639px) { body.tm-ui #schritt-4 .form-row { grid-template-columns:1fr; gap:0; } body.tm-ui #schritt-4 #checkout-answer-summary-items { grid-template-columns:1fr; } body.tm-ui #schritt-4 .checkout-item-card { grid-template-columns:56px minmax(0,1fr); padding:18px; gap:12px; } body.tm-ui #schritt-4 .checkout-item-img { width:56px; height:56px; } body.tm-ui #schritt-4 .checkout-item-preis-wrap { grid-column:1/-1; padding-top:14px; border-top:1px solid var(--tm-border); text-align:left; } body.tm-ui #schritt-4 .checkout-answer-summary { padding:18px; } body.tm-ui #schritt-4 .checkout-actions { align-items:stretch; } body.tm-ui #schritt-4 :is(.btn-checkout-next,.btn-checkout-final) { flex:1; } body.tm-ui #schritt-4 .btn-checkout-back { width:auto; } }
@media(max-width:480px) { body.tm-ui .tm-hero-search .tm-search { border-radius:var(--tm-r-md); } body.tm-ui #tm24-category-grid .tm24-category-card__name { font-size:15px !important; } body.tm-ui #schritt-4 .auszahlung-optionen { grid-template-columns:1fr; } body.tm-ui #schritt-4 :is(.btn-checkout-next,.btn-checkout-final,.btn-checkout-back) { padding-inline:16px; font-size:15px; } }
@media(prefers-reduced-motion:reduce) { body.tm-ui *,body.tm-ui *::before,body.tm-ui *::after { scroll-behavior:auto !important; animation:none !important; transition-duration:.01ms !important; } }
/* Checkout companion is fed by the existing renderer, never a second selection model. */
body.tm-ui #tm-checkout-summary { align-self:start; top:88px; min-width:0; }
body.tm-ui #tm-checkout-summary h2 { margin:0 0 18px; }
body.tm-ui #tm-checkout-summary .tm-price-hero { align-items:flex-start; }
body.tm-ui #tm-checkout-summary .tm-sum-total { margin-top:18px; gap:12px; }
body.tm-ui #tm-checkout-summary .tm-help { margin-top:16px; font-size:var(--tm-fs-xs); color:var(--tm-muted); }
body.tm-ui #tm-checkout-summary .tm-btn { margin:10px 0 0; padding:0; }
@media(min-width:960px) { body.tm-ui #schritt-4 { display:grid; grid-template-columns:minmax(0,7fr) minmax(300px,4fr); align-items:start; gap:48px; } body.tm-ui #schritt-4 .checkout-content { width:100%; max-width:none; } }
/* Incumbent factual/help sections stay in the page, with the same quiet visual world. */
body.tm-ui .ankauf-info-section { background:var(--tm-bg); }
body.tm-ui .ankauf-info-section :is(.container,.tm24-seo-kw-grid) { max-width:var(--tm-max); }
body.tm-ui .why-tm24-section { margin:0; padding:48px 0 0; background:transparent; }
body.tm-ui .why-tm24-head { text-align:left; margin-bottom:24px; }
body.tm-ui .why-tm24-head h2 { color:var(--tm-ink); font-size:30px; font-weight:700; letter-spacing:-.02em; }
body.tm-ui .why-tm24-head p { color:var(--tm-muted); }
body.tm-ui .why-grid { gap:24px; }
body.tm-ui .why-card { padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; text-align:left; transform:none; }
body.tm-ui .why-card .why-icon { width:32px; height:32px; background:transparent; color:var(--tm-accent); margin:0 0 12px; box-shadow:none; }
body.tm-ui .why-card h5 { font-size:18px; font-weight:650; color:var(--tm-ink); }
body.tm-ui .why-card p { color:var(--tm-muted); font-size:15px; line-height:1.6; }
body.tm-ui .b2b-banner { padding:32px 0; margin:0; background:var(--tm-surface); border-block:1px solid var(--tm-border); }
body.tm-ui .b2b-banner :is(.b2b-banner-deco,.b2b-banner-badge) { display:none; }
body.tm-ui .b2b-banner-title { color:var(--tm-ink); font-size:24px; }
body.tm-ui .b2b-banner-list { color:var(--tm-ink-2); font-size:15px; }
body.tm-ui .b2b-banner .b2b-check { color:var(--tm-success); }
body.tm-ui .b2b-banner .b2b-cta-btn { background:var(--tm-accent); color:#fff; border:0; box-shadow:none; font:600 15px/1.4 var(--tm-font); border-radius:var(--tm-r-pill); }
body.tm-ui .b2b-banner .b2b-cta-hint { color:var(--tm-muted); }
body.tm-ui .ankauf-seo-text,body.tm-ui .tm24-seo-kw-section { background:transparent; border:0; padding:40px 0; margin:0; }
body.tm-ui .ankauf-seo-text :is(h2,h3),body.tm-ui .tm24-seo-kw-block h3 { color:var(--tm-ink); font-weight:650; }
body.tm-ui .ankauf-seo-text p,body.tm-ui .tm24-seo-kw-block p { color:var(--tm-muted); font-size:15px; line-height:1.6; }
body.tm-ui .tm24-seo-kw-block { padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
body.tm-ui .tm24-seo-kw-block h3 i { color:var(--tm-accent); }
body.tm-ui .tm24-seo-kw-cta { color:var(--tm-accent-ink); background:transparent; border:0; box-shadow:none; padding:8px 0; }
body.tm-ui .tm-hero-search .tm-search>.tm-btn { min-height:44px; padding:0 20px; border:0; background:var(--tm-accent); color:#fff; font-size:var(--tm-fs-base); }
body.tm-ui .tm-hero-search .tm-search>.tm-btn:hover { background:var(--tm-accent-ink); }
@media(max-width:480px) { body.tm-ui .tm-hero-search .tm-search { padding:8px 8px 8px 16px; } body.tm-ui .tm-hero-search .suche-input { width:auto; } body.tm-ui .tm-hero-search .tm-search>.tm-btn { width:100%; } }
body.tm-ui #tm-checkout-sticky { z-index:1050; }
body.tm-ui #tm-checkout-sticky .tm-p { max-width:32vw; overflow-wrap:anywhere; }
body.tm-ui #tm-checkout-mobile-button { white-space:normal; min-width:0; max-width:62%; font-size:15px; line-height:1.25; padding:10px 18px; }
@media(max-width:959px) { body.tm-ui #schritt-4 { padding-bottom:124px !important; } body.tm-ui #schritt-4 .checkout-actions :is(.btn-checkout-next,.btn-checkout-final) { display:none; } body.tm-ui #schritt-4 .checkout-actions .btn-checkout-back { width:auto; } body.tm-ui:has(#schritt-4:not([style*="none"])) .whatsapp-float-btn { bottom:100px; } }
/* Explicit collision repairs identified against the real page, 1365px QA. */
body.tm-ui #tm24-home-header .lang-pill { color:var(--tm-ink-2) !important; background:var(--tm-surface-2) !important; border:1px solid var(--tm-border) !important; font-weight:500 !important; border-radius:var(--tm-r-sm) !important; }
body.tm-ui #tm24-home-header .lang-pill.active { color:var(--tm-accent-ink) !important; background:var(--tm-accent-soft) !important; border-color:var(--tm-border) !important; }
body.tm-ui #schritt-4 .checkout-tabs { border-radius:0 !important; overflow:visible !important; }
body.tm-ui #schritt-4 .checkout-tabs .checkout-tab.active { background:transparent !important; color:var(--tm-accent-ink) !important; }
body.tm-ui #schritt-4 .wizard-back-btn,body.tm-ui #schritt-4 .wizard-back-btn:hover { border:0 !important; background:transparent !important; color:var(--tm-accent) !important; padding:0 !important; border-radius:var(--tm-r-pill) !important; }
@media(max-width:400px) {
  body.tm-ui .tm-topbar .tm-brand img { height:26px !important; max-height:26px !important; max-width:110px !important; }
  body.tm-ui .ankauf-icon-link.tm-btn { padding:0 10px; font-size:12px; }
  body.tm-ui #schritt-4 .checkout-tab { overflow-wrap:anywhere; }
}

/* ===== Claude design review 2026-10-12 ======================================================
   Measured on the live cascade (shop template sheets from /templates/NOVAChild loaded too).
   Legacy component sheets set Inter, system-ui and Nunito on single elements and use
   !important, so these corrections are deliberately specific. */

/* One typeface. Inheritance from body cannot win against per-element legacy faces.
   Font Awesome elements keep their icon face. */
body.page-ankauf.tm-ui :is(h1,h2,h3,h4,h5,h6,p,a,li,dt,dd,span,strong,b,em,small,label,button,input,select,textarea,summary,div,td,th,legend,option):not(.fa):not(.fas):not(.far):not(.fab):not(.fa-solid):not(.fa-regular):not(.fa-brands){font-family:var(--tm-font)!important}

/* Start page: one heading scale below the hero (prototype: left aligned, 30 px, 650). */
body.page-ankauf.tm-ui :is(.tm24-category-section__title h2,#tm-how-title,#warum-tm24 .why-tm24-head h2,#faq-section .tm24-faq-title,.ankauf-seo-text h2){font-size:clamp(24px,2.6vw,30px)!important;font-weight:750!important;letter-spacing:-.02em!important;line-height:1.2!important;color:var(--tm-ink)!important;text-align:left!important;text-transform:none!important}
body.page-ankauf.tm-ui :is(.ankauf-seo-text h3,.tm24-seo-kw-block h3){font-weight:600!important;letter-spacing:0!important;color:var(--tm-ink)!important}

/* Categories and order-status entry share the section's left edge. */
body.page-ankauf.tm-ui #tm24-category-grid{max-width:none!important;margin-left:0!important;margin-right:0!important}
body.page-ankauf.tm-ui #tm24-category-grid .tm24-category-card__image{background:transparent!important;border:0!important;box-shadow:none!important}
body.page-ankauf.tm-ui .tm24-order-status-entry{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important}

/* The info wrapper only adds a coloured band between sections. */
body.page-ankauf.tm-ui .ankauf-info-section{padding:0!important;background:transparent!important}

/* "Warum TM24": calm cards in the shared line, no red/blue underline, no navy icon tiles. */
body.page-ankauf.tm-ui #warum-tm24{padding:56px 0!important;background:var(--tm-bg)!important;border:0!important}
body.page-ankauf.tm-ui #warum-tm24>.container{max-width:var(--tm-max)!important;padding:0 var(--tm-gutter)!important;margin:0 auto!important}
body.page-ankauf.tm-ui #warum-tm24 .why-tm24-head{text-align:left!important;margin:0 0 24px!important;padding:0!important}
body.page-ankauf.tm-ui #warum-tm24 .why-tm24-head h2::before,body.page-ankauf.tm-ui #warum-tm24 .why-tm24-head h2::after,body.page-ankauf.tm-ui #warum-tm24 .why-tm24-head::after{display:none!important}
body.page-ankauf.tm-ui #warum-tm24 .why-tm24-head p{margin:8px 0 0!important;text-align:left!important;color:var(--tm-muted)!important;font-size:var(--tm-fs-base)!important;font-weight:400!important}
body.page-ankauf.tm-ui #warum-tm24 .why-grid{gap:12px!important}
body.page-ankauf.tm-ui #warum-tm24 .why-card{text-align:left!important;padding:20px!important;background:var(--tm-surface)!important;border:1px solid var(--tm-border)!important;border-radius:var(--tm-r-md)!important;box-shadow:none!important;transform:none!important}
body.page-ankauf.tm-ui #warum-tm24 .why-icon{width:36px!important;height:36px!important;margin:0 0 14px!important;border-radius:10px!important;background:var(--tm-accent-soft)!important;box-shadow:none!important;font-size:15px!important}
body.page-ankauf.tm-ui #warum-tm24 .why-icon i{color:var(--tm-accent)!important}
body.page-ankauf.tm-ui #warum-tm24 .why-card h5{margin:0 0 6px!important;font-size:var(--tm-fs-md)!important;font-weight:600!important;line-height:1.35!important;color:var(--tm-ink)!important}
body.page-ankauf.tm-ui #warum-tm24 .why-card p{margin:0!important;font-size:var(--tm-fs-sm)!important;line-height:1.55!important;color:var(--tm-muted)!important}

/* FAQ as the prototype's quiet list: no card per question, no heavy system face. */
body.page-ankauf.tm-ui #faq-section{background:transparent!important}
body.page-ankauf.tm-ui #faq-section .tm24-faq{max-width:760px!important}
body.page-ankauf.tm-ui #faq-section .tm24-faq-sub{margin:0 0 16px!important;color:var(--tm-muted)!important;font-size:var(--tm-fs-base)!important;font-weight:400!important}
body.page-ankauf.tm-ui #faq-section .tm24-faq-item{margin:0!important;border:0!important;border-bottom:1px solid var(--tm-border)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
body.page-ankauf.tm-ui #faq-section .tm24-faq-q{padding:18px 0!important;background:transparent!important;color:var(--tm-ink)!important;font-size:var(--tm-fs-md)!important;font-weight:600!important;line-height:1.4!important}
body.page-ankauf.tm-ui #faq-section .tm24-faq-a{padding:0 0 18px!important;color:var(--tm-ink-2)!important;font-size:var(--tm-fs-base)!important;font-weight:400!important;line-height:1.6!important}

/* B2B: an honest secondary section in the light page instead of a navy gradient poster. */
body.page-ankauf.tm-ui .b2b-banner{padding:40px 0!important;background:var(--tm-surface)!important;background-image:none!important;border-block:1px solid var(--tm-border)!important;border-radius:0!important;box-shadow:none!important;color:var(--tm-ink)!important}
body.page-ankauf.tm-ui .b2b-banner .b2b-banner-deco{display:none!important}
body.page-ankauf.tm-ui .b2b-banner>.container{max-width:var(--tm-max)!important;padding:0 var(--tm-gutter)!important}
body.page-ankauf.tm-ui .b2b-banner .b2b-banner-title{margin:0 0 12px!important;color:var(--tm-ink)!important;font-size:var(--tm-fs-xl)!important;font-weight:650!important;letter-spacing:-.01em!important}
body.page-ankauf.tm-ui .b2b-banner .b2b-banner-list li{color:var(--tm-ink-2)!important;font-size:var(--tm-fs-base)!important;font-weight:400!important}
body.page-ankauf.tm-ui .b2b-banner .b2b-banner-list li i{color:var(--tm-success)!important}
body.page-ankauf.tm-ui .b2b-banner .b2b-cta-btn{min-height:44px!important;padding:0 20px!important;border:0!important;border-radius:var(--tm-r-pill)!important;background:var(--tm-blue)!important;color:#fff!important;box-shadow:none!important;font-size:var(--tm-fs-sm)!important;font-weight:600!important}
body.page-ankauf.tm-ui .b2b-banner .b2b-cta-hint{color:var(--tm-muted)!important;font-weight:500!important}

/* SEO keyword blocks: six full accent buttons competed with the one real CTA; quiet links instead.
   The scroll handler in index.php still binds .tm24-seo-kw-cta. */
body.page-ankauf.tm-ui .tm24-seo-kw-cta{display:inline-flex!important;align-items:center;gap:6px;min-height:44px!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;color:var(--tm-accent-ink)!important;font-size:var(--tm-fs-sm)!important;font-weight:600!important;text-decoration:underline;text-underline-offset:4px}
body.page-ankauf.tm-ui .tm24-seo-kw-cta:hover{color:var(--tm-ink)!important}

/* SEO containers share the section edge (legacy used 16 px). */
body.page-ankauf.tm-ui :is(.ankauf-seo-text,.tm24-seo-kw-section)>.container{max-width:var(--tm-max)!important;padding:0 var(--tm-gutter)!important}

/* Phones: legacy put icon, title and text of each "Warum" card in three narrow columns and centred the
   B2B list (staggered bullets). Stack and left-align both. */
body.page-ankauf.tm-ui #warum-tm24 .why-card{display:block!important;min-height:0!important}
body.page-ankauf.tm-ui .b2b-banner :is(.b2b-banner-inner,.b2b-banner-content,.b2b-banner-action,.b2b-banner-list){text-align:left!important}
@media(max-width:760px){body.page-ankauf.tm-ui .b2b-banner .b2b-banner-inner{flex-direction:column!important;align-items:flex-start!important;gap:20px!important}body.page-ankauf.tm-ui .b2b-banner :is(.b2b-banner-list,.b2b-banner-action){align-items:flex-start!important;justify-content:flex-start!important;margin:0!important;padding:0!important}body.page-ankauf.tm-ui .b2b-banner .b2b-banner-list li{justify-content:flex-start!important;margin-left:0!important;padding-left:0!important}}

/* Thank-you heading: legacy weight 800 (prototype 650). */
body.page-ankauf.tm-ui #schritt-danke :is(h1,h2){font-weight:750!important;letter-spacing:-.02em!important}

/* Claude review 2 (2026-10-13): a technical/request error notice is prepended to #schritt-4, which is a
   two-column grid from 960 px. It took the first cell, pushed the form into the 300 px column and the
   order summary into a second row. Let it span the grid. */
body.tm-ui #schritt-4>#tm24-order-validation{grid-column:1/-1}

/* ===== Claude design implementation 2026-10-13 =================================================
   Startseite: die Kategorieauswahl liegt im Hero-Raster (erster Viewport auf jeder Breite).
   Desktop: Text/Suche links, Bild rechts, Kategorien darunter. Mobil: kompakter Header ->
   kraeftige Ueberschrift -> kompaktes Hauptbild -> Kategorien -> direkte Geraetesuche -> weitere Infos. */
body.tm-ui #tm24-ankauf-hero .tm-hero-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); grid-template-areas:"copy visual" "cats cats"; gap:0 56px; align-items:center; }
body.tm-ui #tm24-ankauf-hero .tm-hero-copy { grid-area:copy; min-width:0; }
body.tm-ui #tm24-ankauf-hero .tm-hero-visual { grid-area:visual; width:min(100%,380px); justify-self:center; }
body.tm-ui #tm24-ankauf-hero #kategorie-auswahl { grid-area:cats; }
body.tm-ui #tm24-ankauf-hero .tm-facts-row { margin-top:32px; }
@media(max-width:959px) {
  body.tm-ui #tm24-ankauf-hero { padding-top:20px; }
  body.tm-ui #tm24-ankauf-hero .tm-hero-grid { display:flex; flex-direction:column; align-items:stretch; gap:0; }
  body.tm-ui #tm24-ankauf-hero .tm-hero-copy { display:contents; }
  body.tm-ui #tm24-ankauf-hero h1 { order:1; font-size:clamp(28px,7.4vw,36px); }
  body.tm-ui #tm24-ankauf-hero .tm-hero-visual { order:2; width:min(40%,170px); margin:16px auto 0; }
  body.tm-ui #tm24-ankauf-hero #kategorie-auswahl { order:3; padding-top:16px !important; }
  body.tm-ui #tm24-ankauf-hero .tm-hero-search { order:4; margin-top:20px; max-width:none; }
  body.tm-ui #tm24-ankauf-hero .tm-hero-sub { order:5; margin-top:18px; font-size:var(--tm-fs-base); }
  body.tm-ui #tm24-ankauf-hero .tm-facts-row { margin-top:24px; }
  body.tm-ui .tm24-category-section__title p { display:none; }
  body.tm-ui .tm24-category-section__title { margin-bottom:12px !important; }
  body.tm-ui #tm24-category-grid .tm-cat { padding:10px 10px 12px !important; gap:8px; }
}
@media(max-width:480px) { body.tm-ui #tm24-ankauf-hero .tm-hero-visual { width:min(38%,140px); } }

/* Mobile follow-up: keep the approved desktop/header arrangement and catalogue images. */
@media(max-width:767px) {
  body.tm-ui .tm-hero-visual { display:none; }
  body.tm-ui #schritt-4 { min-height:0; padding-bottom:32px !important; }
}
@media(max-width:959px) {
  body.tm-ui .tm24-footer#ankauf-footer { padding-bottom:var(--tm24-mobile-action-space,0px); }
}