/* Smartphone-Finder 1.5.2. Designs 1/2 aus der freigegebenen Vorschau. * Saemtliche Regeln sind auf den Finder begrenzt; keine Webfonts/Bibliotheken. */ #smartphone-finder.sf-v12 { width:100%;max-width:100%;margin:16px 0 28px;padding:0;text-align:left;font:14px/1.55 Roboto,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;scroll-margin-top:24px;color-scheme:light } #smartphone-finder.sf-v12, #smartphone-finder.sf-v12 * { box-sizing:border-box } #smartphone-finder.sf-v12 [hidden] { display:none!important } #smartphone-finder.sf-v12 :is(p,h4,h5,h6,figure,ul,dl,dd,form) {margin:0;padding:0} #smartphone-finder.sf-v12 :is(h4,h5,h6,strong) {font-family:inherit;color:inherit;font-size:inherit;font-weight:700;line-height:inherit} #smartphone-finder.sf-v12 :is(a,a:visited) {font:inherit;color:var(--sf-accent);text-decoration:none;overflow-wrap:anywhere} #smartphone-finder.sf-v12 a:hover {text-decoration:underline} #smartphone-finder.sf-v12 :is(button,input,select) {font:inherit;vertical-align:middle;max-width:100%} #smartphone-finder.sf-v12 :is(button,a,input,select,summary,[tabindex]):focus-visible {outline:3px solid var(--sf-outline);outline-offset:3px} #smartphone-finder.sf-v12 button {cursor:pointer;touch-action:manipulation} #smartphone-finder.sf-v12 button:disabled {opacity:.6;cursor:not-allowed} #smartphone-finder.sf-v12 .sf-sr {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0} #smartphone-finder.sf-v12 .sf-icon {width:19px;height:19px;flex:0 0 auto;vertical-align:middle} #smartphone-finder.sf-v12 { --sf-ink:#182d46;--sf-muted:#596b7e;--sf-accent:#245d9e;--sf-accent-dark:#174575;--sf-soft:#eef4fb;--sf-line:#dfe6ee;--sf-bg:#f2f5f9;--sf-surface:#fff;--sf-radius:19px;--sf-shadow:0 5px 22px #15365208,0 1px 3px #15365206;--sf-action:#205ba3;--sf-action-hover:#164680;--sf-outline:#3770b9;container-type:inline-size;container-name:finder;isolation:isolate;font-size:14px;line-height:1.55;color:var(--sf-ink);background:var(--sf-bg);border-radius:23px;overflow:clip;box-shadow:0 8px 32px #1d344b08;text-align:left } #smartphone-finder.sf-v12 :is(button,input,select) { font:inherit } #smartphone-finder.sf-v12 :is(button,input,select,summary):focus-visible { outline-color:var(--sf-outline) } #smartphone-finder.sf-v12 button { letter-spacing:0 } #smartphone-finder.sf-v12 .sf-header { position:relative;padding:30px 28px 24px;background:radial-gradient(ellipse at 95% 0%,#dfeaff 0%,#eef4fc66 42%,transparent 75%),#fff;border-bottom:1px solid var(--sf-line) } #smartphone-finder.sf-v12 .sf-title { font-size:30px;line-height:1.2;letter-spacing:-1.05px;font-weight:730;max-width:660px;text-wrap:balance } #smartphone-finder.sf-v12 .sf-lead { font-size:13px;line-height:1.6;color:var(--sf-muted);margin-top:10px;max-width:570px } #smartphone-finder.sf-v12 .sf-categories { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:24px } #smartphone-finder.sf-v12 .sf-category { display:flex;align-items:center;gap:9px;min-height:46px;background:#ffffffb8;border:1px solid #d5dfec;border-radius:10px;color:var(--sf-ink);font-size:12px!important;font-weight:650!important;padding:10px 12px;text-align:left;line-height:1.3!important;transition:background .16s,border-color .16s,transform .16s } #smartphone-finder.sf-v12 .sf-category .sf-icon { width:17px;height:17px;color:#6c8098 } #smartphone-finder.sf-v12 .sf-category:hover { border-color:#91afd3;background:#fff;transform:translateY(-1px) } #smartphone-finder.sf-v12 .sf-category[aria-current=true] { background:var(--sf-accent);border-color:var(--sf-accent);color:#fff;box-shadow:0 3px 8px #1d558f17 } #smartphone-finder.sf-v12 .sf-category[aria-current=true] .sf-icon { color:#fff } #smartphone-finder.sf-v12 .sf-content { padding:0 18px 20px } #smartphone-finder.sf-v12 .sf-filter-panel { border-bottom:1px solid var(--sf-line);margin:0 10px } #smartphone-finder.sf-v12 .sf-filter-panel>summary { display:flex;align-items:center;gap:10px;list-style:none;cursor:pointer;min-height:57px;font-size:12px;font-weight:650;color:var(--sf-ink) } #smartphone-finder.sf-v12 .sf-filter-panel>summary::-webkit-details-marker, #smartphone-finder.sf-v12 .sf-specifications>summary::-webkit-details-marker { display:none } #smartphone-finder.sf-v12 .sf-filter-panel>summary>.sf-icon:first-child { color:var(--sf-accent);width:17px;height:17px } #smartphone-finder.sf-v12 .sf-filter-subtitle { font-weight:400;font-size:11px;color:var(--sf-muted);margin-left:2px } #smartphone-finder.sf-v12 .sf-filter-panel>summary>.sf-icon:last-child { margin-left:auto;width:15px;height:15px;transition:transform .2s } #smartphone-finder.sf-v12 .sf-filter-panel[open]>summary>.sf-icon:last-child { transform:rotate(180deg) } #smartphone-finder.sf-v12 .sf-filter-grid { display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:12px;padding-bottom:16px } #smartphone-finder.sf-v12 .sf-field { display:flex;flex-direction:column;gap:6px;min-width:0;font-size:11px;font-weight:650 } #smartphone-finder.sf-v12 .sf-field input, #smartphone-finder.sf-v12 .sf-field select { background:var(--sf-surface);border:1px solid #becbd9;border-radius:8px;color:var(--sf-ink);min-width:0;width:100%;height:43px;padding:8px 10px;font-size:12px!important } #smartphone-finder.sf-v12 .sf-field input::placeholder { color:#6d7b89;opacity:1 } #smartphone-finder.sf-v12 .sf-filter-bottom { grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap } #smartphone-finder.sf-v12 .sf-esim-label { display:flex;gap:8px;align-items:center;font-size:12px;min-height:32px } #smartphone-finder.sf-v12 .sf-esim-label input, #smartphone-finder.sf-v12 .sf-compare-toggle input { accent-color:var(--sf-accent);width:17px;height:17px;margin:0;flex-shrink:0 } #smartphone-finder.sf-v12 .sf-reset { min-height:35px;border:0;border-bottom:1px solid var(--sf-accent);color:var(--sf-accent);background:none;padding:4px 1px;font-size:12px!important } #smartphone-finder.sf-v12 .sf-results-top { padding:25px 10px 19px } #smartphone-finder.sf-v12 .sf-results-title-row { display:flex;align-items:center;justify-content:space-between;gap:12px } #smartphone-finder.sf-v12 #sf-category-title { font-size:21px;font-weight:720;line-height:1.3;letter-spacing:-.45px } #smartphone-finder.sf-v12 .sf-sort { display:flex;align-items:center;gap:7px;font-size:11px;color:var(--sf-muted);flex-shrink:0 } #smartphone-finder.sf-v12 .sf-sort select { border:1px solid var(--sf-line);border-radius:7px;background:var(--sf-surface);color:var(--sf-ink);padding:6px 24px 6px 8px;min-height:34px;max-width:175px;font-size:11px!important } #smartphone-finder.sf-v12 .sf-category-description { color:var(--sf-muted);font-size:12px;line-height:1.7;margin-top:8px;max-width:620px } #smartphone-finder.sf-v12 .sf-meta-line { margin-top:11px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:10px;color:var(--sf-muted) } #smartphone-finder.sf-v12 .sf-count { font-weight:650;color:var(--sf-ink) } #smartphone-finder.sf-v12 .sf-meta-divider { width:3px;height:3px;border-radius:100%;background:#9bacbd } #smartphone-finder.sf-v12 .sf-list { display:flex;flex-direction:column;gap:13px } #smartphone-finder.sf-v12 .sf-card { display:grid;grid-template-columns:135px minmax(0,1fr) 167px;gap:0 19px;padding:23px 21px 0 16px;background:var(--sf-surface);border:1px solid #e0e7ef;border-radius:var(--sf-radius);box-shadow:var(--sf-shadow);transition:border-color .18s,box-shadow .18s;position:relative;min-width:0;scroll-margin-top:20px } #smartphone-finder.sf-v12 .sf-card:hover { border-color:#bdccdf;box-shadow:0 7px 24px #173d6810 } #smartphone-finder.sf-v12 .sf-card.is-selected { border-color:var(--sf-accent);box-shadow:0 0 0 1px var(--sf-accent) } #smartphone-finder.sf-v12 .sf-visual { position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;align-self:start;min-height:214px;padding-top:20px } #smartphone-finder.sf-v12 .sf-visual::before { content:"";position:absolute;top:16px;bottom:19px;left:0;right:0;border-radius:14px;background:linear-gradient(145deg,#f8fafc,#f0f3f7);z-index:0 } #smartphone-finder.sf-v12 .sf-rank { position:absolute;z-index:2;top:0;left:3px;background:#fff;border:1px solid var(--sf-line);font-size:11px;font-weight:750;line-height:1;display:grid;place-items:center;width:29px;height:29px;border-radius:50%;color:var(--sf-muted);font-variant-numeric:tabular-nums;box-shadow:0 2px 5px #18304806 } #smartphone-finder.sf-v12 .sf-visual figcaption { font-size:9px;color:#6c7c8d;position:relative;z-index:1;margin-top:0 } #smartphone-finder.sf-v12 .sf-product-body { min-width:0;padding:0 0 17px } #smartphone-finder.sf-v12 .sf-badge { display:inline-flex;font-size:9px;font-weight:720;line-height:1.4;letter-spacing:.15px;color:var(--sf-accent);background:var(--sf-soft);border-radius:5px;padding:4px 7px;margin-bottom:8px } #smartphone-finder.sf-v12 .sf-name { font-size:22px;font-weight:730;line-height:1.2;letter-spacing:-.6px;overflow-wrap:anywhere } #smartphone-finder.sf-v12 .sf-name span { display:block } #smartphone-finder.sf-v12 .sf-variant { font-size:10px;color:var(--sf-muted);margin-top:7px;display:flex;align-items:center;gap:7px } #smartphone-finder.sf-v12 .sf-description { font-size:13px;line-height:1.65;color:#435970;margin-top:12px } #smartphone-finder.sf-v12 .sf-highlights { list-style:none;padding:0;margin:13px 0 0;display:flex;flex-direction:column;gap:5px;font-size:11px;line-height:1.55;color:var(--sf-muted) } #smartphone-finder.sf-v12 .sf-highlights li { display:flex;gap:6px;align-items:flex-start } #smartphone-finder.sf-v12 .sf-highlights .sf-icon { width:13px;height:13px;margin-top:1px } #smartphone-finder.sf-v12 .sf-positive .sf-icon { color:#20765f } #smartphone-finder.sf-v12 .sf-negative .sf-icon { color:#8e785d } #smartphone-finder.sf-v12 .sf-offer { padding:5px 0 17px 16px;border-left:1px solid #e9eef4;display:flex;flex-direction:column;justify-content:center;align-items:stretch } #smartphone-finder.sf-v12 .sf-price-wrap { display:flex;flex-direction:column;align-items:flex-start } #smartphone-finder.sf-v12 .sf-price-label { font-size:9px;letter-spacing:.2px;color:var(--sf-muted) } #smartphone-finder.sf-v12 .sf-price { font-size:27px;font-weight:760;letter-spacing:-.8px;line-height:1.3;white-space:nowrap;font-variant-numeric:tabular-nums;margin-top:3px;color:var(--sf-ink) } #smartphone-finder.sf-v12 .sf-price--unknown { font-size:22px;letter-spacing:-.5px;white-space:normal;overflow-wrap:normal } #smartphone-finder.sf-v12 .sf-price-sub { font-size:9px;color:var(--sf-muted);margin-top:3px } #smartphone-finder.sf-v12 .sf-amazon { width:100%;background:var(--sf-action);color:#fff;border:1px solid transparent;border-radius:9px;min-height:43px;display:flex;align-items:center;justify-content:center;gap:5px;padding:10px 7px;font-size:11px!important;font-weight:680!important;white-space:nowrap;margin-top:18px;box-shadow:0 3px 7px #163d6620;transition:background .18s,transform .18s } #smartphone-finder.sf-v12 .sf-amazon .sf-icon { width:14px;height:14px } #smartphone-finder.sf-v12 .sf-amazon:hover { background:var(--sf-action-hover);transform:translateY(-1px) } #smartphone-finder.sf-v12 .sf-compare-toggle { display:flex;align-items:center;justify-content:center;gap:7px;min-height:40px;margin-top:4px;cursor:pointer;font-size:10px;color:var(--sf-muted) } #smartphone-finder.sf-v12 .sf-compare-toggle input { width:15px;height:15px } #smartphone-finder.sf-v12 .sf-specifications { grid-column:2/-1;border-top:1px solid var(--sf-line);font-size:11px;min-width:0 } #smartphone-finder.sf-v12 .sf-specifications>summary { list-style:none;min-height:43px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;color:var(--sf-accent);font-size:11px;font-weight:600;gap:10px } #smartphone-finder.sf-v12 .sf-specifications>summary>.sf-icon { width:14px;height:14px;transition:transform .16s } #smartphone-finder.sf-v12 .sf-specifications[open]>summary>.sf-icon { transform:rotate(180deg) } #smartphone-finder.sf-v12 .sf-specifications dl { display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;margin:5px 0 12px } #smartphone-finder.sf-v12 .sf-specifications dl div { min-width:0 } #smartphone-finder.sf-v12 .sf-specifications dt { font-size:9px;color:var(--sf-muted);margin-bottom:2px } #smartphone-finder.sf-v12 .sf-specifications dd { margin:0;color:var(--sf-ink);font-size:11px;overflow-wrap:anywhere } #smartphone-finder.sf-v12 .sf-spec-wide { grid-column:1/-1 } #smartphone-finder.sf-v12 .sf-example-hint { font-size:10px;color:var(--sf-muted);line-height:1.6;margin-bottom:16px } #smartphone-finder.sf-v12 .sf-bottom-note { display:flex;gap:8px;align-items:flex-start;font-size:10px;color:var(--sf-muted);padding:18px 9px 0;line-height:1.7 } #smartphone-finder.sf-v12 .sf-bottom-note .sf-icon { width:14px;height:14px;margin-top:2px } #smartphone-finder.sf-v12 .sf-empty { border:1px dashed #a9b9ca;border-radius:14px;text-align:center;padding:30px 18px;background:var(--sf-surface) } #smartphone-finder.sf-v12 .sf-empty h4 { font-size:17px;margin:0 0 7px } #smartphone-finder.sf-v12 .sf-empty p { color:var(--sf-muted);font-size:12px;margin-bottom:13px } #smartphone-finder.sf-v12[data-design=night] { --sf-ink:#1c2941;--sf-muted:#5b6980;--sf-accent:#4659bb;--sf-accent-dark:#34489b;--sf-soft:#eff0fc;--sf-line:#e0e5f0;--sf-bg:#f0f2f8;--sf-action:#3849aa;--sf-action-hover:#28398a;--sf-outline:#6281ff;--sf-shadow:0 5px 20px #1824440a;--sf-radius:17px } #smartphone-finder.sf-v12[data-design=night] .sf-header { background:radial-gradient(ellipse at 100% 0%,#45528b 0%,#28345580 34%,transparent 64%),linear-gradient(120deg,#101b2d,#202d47);color:#fff;border:0;padding-bottom:27px } #smartphone-finder.sf-v12[data-design=night] .sf-title { color:#fff } #smartphone-finder.sf-v12[data-design=night] .sf-lead { color:#c0cbe0 } #smartphone-finder.sf-v12[data-design=night] .sf-category { background:#ffffff09;color:#e3e9f7;border-color:#ffffff21;box-shadow:none } #smartphone-finder.sf-v12[data-design=night] .sf-category .sf-icon { color:#aebcd8 } #smartphone-finder.sf-v12[data-design=night] .sf-category:hover { background:#ffffff15;border-color:#ffffff50 } #smartphone-finder.sf-v12[data-design=night] .sf-category[aria-current=true] { color:#172849;background:#edf2ff;border-color:#edf2ff;box-shadow:0 2px 10px #0002 } #smartphone-finder.sf-v12[data-design=night] .sf-category[aria-current=true] .sf-icon { color:#4055a1 } #smartphone-finder.sf-v12[data-design=night] .sf-rank { background:#1d2c48;color:#eef2ff;border-color:#1d2c48 } #smartphone-finder.sf-v12[data-design=night] .sf-visual::before { background:radial-gradient(ellipse at 50% 65%,#e5e7f5,#f5f6fb 73%) } #smartphone-finder.sf-v12[data-design=night] .sf-offer { border-color:#e7eaf3 } #smartphone-finder.sf-v12[data-design=night] .sf-badge { border-radius:20px;padding:4px 9px } #smartphone-finder.sf-v12[data-design=night] .sf-amazon { box-shadow:0 4px 12px #33489825 } #smartphone-finder.sf-v12 .sf-comparison-bar { position:fixed;z-index:20;bottom:16px;left:50%;transform:translateX(-50%);width:min(768px,calc(100% - 32px));padding:12px 16px;display:flex;align-items:center;gap:14px;border:1px solid #43556b;border-radius:14px;background:#16273eee;color:#fff;box-shadow:0 10px 40px #0c1c4040;backdrop-filter:blur(14px) } #smartphone-finder.sf-v12 .sf-comparison-bar .sf-icon { color:#b4c9e3 } #smartphone-finder.sf-v12 .sf-comparison-bar-text { display:flex;flex-direction:column;gap:3px;font-size:12px;flex:1;min-width:0 } #smartphone-finder.sf-v12 .sf-comparison-bar-text strong { font-weight:650 } #smartphone-finder.sf-v12 .sf-comparison-bar-text small { font-size:10px;color:#d1dbe9;overflow-wrap:anywhere;line-height:1.5 } #smartphone-finder.sf-v12 .sf-comparison-bar button { border:1px solid #adc0dc;border-radius:7px;background:#fff;color:#193751;min-height:39px;padding:7px 12px;font-size:11px;font-weight:650;white-space:nowrap } #smartphone-finder.sf-v12 .sf-comparison-bar .sf-clear-compare { background:transparent;color:#e1e9f5;border-color:#6a7c95;font-weight:400 } #smartphone-finder.sf-v12 .sf-dialog { max-width:860px;width:calc(100% - 32px);max-height:calc(100dvh - 48px);padding:24px;border:1px solid #d7dfe7;border-radius:16px;color:#22354b;box-shadow:0 25px 100px #0005;background:#fff;overscroll-behavior:contain } #smartphone-finder.sf-v12 .sf-dialog::backdrop { background:#12213bbf;backdrop-filter:blur(4px) } #smartphone-finder.sf-v12 .sf-dialog-heading { display:flex;align-items:flex-start;justify-content:space-between;gap:20px } #smartphone-finder.sf-v12 .sf-dialog-heading h2 { font-size:23px;line-height:1.3;letter-spacing:-.5px } #smartphone-finder.sf-v12 .sf-dialog-heading p { margin-top:7px;font-size:12px;line-height:1.6;color:#5d6f81 } #smartphone-finder.sf-v12 .sf-close { display:grid;place-items:center;min-width:40px;min-height:40px;padding:7px;border:1px solid #d5dee7;background:#f8fafc;color:#20374c;border-radius:8px } #smartphone-finder.sf-v12 .sf-table-scroll { overflow-x:auto;margin-top:23px;border:1px solid #dce4eb;border-radius:10px } #smartphone-finder.sf-v12 .sf-comparison-table { border-collapse:collapse;width:100%;text-align:left;table-layout:fixed } #smartphone-finder.sf-v12 .sf-comparison-table th, #smartphone-finder.sf-v12 .sf-comparison-table td { padding:14px 12px;min-width:0;font-size:12px;border-bottom:1px solid #e0e6ec;vertical-align:top;line-height:1.6;overflow-wrap:anywhere } #smartphone-finder.sf-v12 .sf-comparison-table thead th { background:#eff4fb;font-size:13px } #smartphone-finder.sf-v12 .sf-comparison-table th:first-child { width:128px;color:#5d6e81;font-weight:550;font-size:11px } #smartphone-finder.sf-v12 .sf-comparison-table tr:last-child :is(th,td) { border-bottom:0 } #smartphone-finder.sf-v12 .sf-comparison-table tr:nth-child(even) { background:#fafbfd } #smartphone-finder.sf-v12 .sf-comparison-table td { min-width:170px } #smartphone-finder.sf-v12 .sf-comparison-table[data-count="3"] { min-width:685px } #smartphone-finder.sf-v12 .sf-comparison-table[data-count="2"] { min-width:490px } #smartphone-finder.sf-v12 .sf-dialog-mobile { display:none;font-size:11px;color:#5d6f81;margin-top:16px } @container finder (min-width:900px) { #smartphone-finder.sf-v12 .sf-categories { grid-template-columns:repeat(6,minmax(0,1fr)) } #smartphone-finder.sf-v12 .sf-category { font-size:11px!important;gap:7px;justify-content:center;padding:10px 7px } #smartphone-finder.sf-v12 .sf-card { grid-template-columns:170px minmax(0,1fr) 205px;gap:0 29px;padding:27px 27px 0 22px } #smartphone-finder.sf-v12 .sf-visual { min-height:239px } #smartphone-finder.sf-v12 .sf-name { font-size:25px } #smartphone-finder.sf-v12 .sf-name span { display:inline } #smartphone-finder.sf-v12 .sf-description { font-size:13px } #smartphone-finder.sf-v12 .sf-highlights { font-size:11px } #smartphone-finder.sf-v12 .sf-offer { padding-left:22px } #smartphone-finder.sf-v12 .sf-amazon { font-size:12px!important } #smartphone-finder.sf-v12 .sf-price { font-size:31px } #smartphone-finder.sf-v12 .sf-title { font-size:36px;max-width:none } #smartphone-finder.sf-v12 .sf-price--unknown { font-size:25px } } @container finder (max-width:690px) { #smartphone-finder.sf-v12 .sf-header { padding:23px 20px 20px } #smartphone-finder.sf-v12 .sf-title { font-size:28px } #smartphone-finder.sf-v12 .sf-content { padding:0 12px 17px } #smartphone-finder.sf-v12 .sf-categories { gap:7px } #smartphone-finder.sf-v12 .sf-category { font-size:11px!important;padding:9px 8px;gap:6px } #smartphone-finder.sf-v12 .sf-category .sf-icon { width:15px;height:15px } #smartphone-finder.sf-v12 .sf-results-top { padding:20px 7px 16px } #smartphone-finder.sf-v12 .sf-sort>span { display:none } #smartphone-finder.sf-v12 .sf-card { grid-template-columns:115px minmax(0,1fr);gap:0 17px;padding:19px 17px 0 13px } #smartphone-finder.sf-v12 .sf-visual { min-height:190px } #smartphone-finder.sf-v12 .sf-product-body { padding-bottom:15px } #smartphone-finder.sf-v12 .sf-offer { grid-column:2;border-left:0;border-top:1px solid var(--sf-line);padding:13px 0 15px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px 10px;align-items:center } #smartphone-finder.sf-v12 .sf-price-wrap { grid-row:1/3 } #smartphone-finder.sf-v12 .sf-amazon { margin-top:0;min-height:42px;grid-column:2 } #smartphone-finder.sf-v12 .sf-compare-toggle { margin:0;min-height:28px;grid-column:2 } #smartphone-finder.sf-v12 .sf-price { font-size:25px } #smartphone-finder.sf-v12 .sf-price--unknown { font-size:20px } #smartphone-finder.sf-v12 .sf-specifications { grid-column:1/-1 } #smartphone-finder.sf-v12 .sf-filter-panel { margin:0 7px } #smartphone-finder.sf-v12 .sf-filter-subtitle { display:none } #smartphone-finder.sf-v12 .sf-filter-grid { grid-template-columns:1fr 1fr } #smartphone-finder.sf-v12 .sf-field--search { grid-column:1/-1 } #smartphone-finder.sf-v12 .sf-description { font-size:12px } #smartphone-finder.sf-v12 .sf-name { font-size:21px } #smartphone-finder.sf-v12 .sf-highlights { font-size:10px } #smartphone-finder.sf-v12 #sf-category-title { font-size:20px } #smartphone-finder.sf-v12 .sf-sort select { max-width:160px;font-size:10px!important } } @container finder (max-width:470px) { #smartphone-finder.sf-v12 .sf-header { padding:22px 16px 18px } #smartphone-finder.sf-v12 .sf-title { font-size:27px;letter-spacing:-.9px } #smartphone-finder.sf-v12 .sf-lead { font-size:12px } #smartphone-finder.sf-v12 .sf-categories { grid-template-columns:1fr 1fr;margin-top:20px;gap:7px } #smartphone-finder.sf-v12 .sf-category { min-height:44px;font-size:10.5px!important;padding:8px;gap:7px;line-height:1.4!important } #smartphone-finder.sf-v12 .sf-content { padding:0 10px 17px } #smartphone-finder.sf-v12 .sf-results-title-row { display:block } #smartphone-finder.sf-v12 .sf-sort { margin-top:12px;justify-content:space-between } #smartphone-finder.sf-v12 .sf-sort>span { display:inline } #smartphone-finder.sf-v12 .sf-sort select { max-width:185px;min-height:36px } #smartphone-finder.sf-v12 .sf-category-description { font-size:11px } #smartphone-finder.sf-v12 .sf-results-top { padding:20px 5px 16px } #smartphone-finder.sf-v12 .sf-meta-line { font-size:9px;gap:7px } #smartphone-finder.sf-v12 .sf-card { grid-template-columns:88px minmax(0,1fr);gap:0 12px;padding:17px 13px 0 10px;border-radius:14px } #smartphone-finder.sf-v12 .sf-visual { min-height:164px;padding-top:23px } #smartphone-finder.sf-v12 .sf-visual::before { border-radius:9px } #smartphone-finder.sf-v12 .sf-visual figcaption { font-size:8px } #smartphone-finder.sf-v12 .sf-rank { width:24px;height:24px;font-size:9px;left:1px } #smartphone-finder.sf-v12 .sf-badge { font-size:8px;padding:3px 5px;margin-bottom:7px } #smartphone-finder.sf-v12 .sf-name { font-size:20px;letter-spacing:-.5px } #smartphone-finder.sf-v12 .sf-variant { font-size:9px;gap:5px;margin-top:6px } #smartphone-finder.sf-v12 .sf-description { font-size:12px;line-height:1.7;margin-top:10px } #smartphone-finder.sf-v12 .sf-highlights { font-size:10px;gap:5px;margin-top:11px } #smartphone-finder.sf-v12 .sf-highlights .sf-icon { width:12px;height:12px } #smartphone-finder.sf-v12 .sf-offer { grid-column:1/-1;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:4px 8px;padding:14px 0 10px } #smartphone-finder.sf-v12 .sf-amazon { font-size:11px!important } #smartphone-finder.sf-v12 .sf-price { font-size:26px } #smartphone-finder.sf-v12 .sf-price-label, #smartphone-finder.sf-v12 .sf-price-sub { font-size:8px } #smartphone-finder.sf-v12 .sf-price--unknown { font-size:21px } #smartphone-finder.sf-v12 .sf-compare-toggle { font-size:10px;min-height:32px } #smartphone-finder.sf-v12 .sf-specifications>summary { min-height:41px;font-size:10px } #smartphone-finder.sf-v12 .sf-filter-panel { margin:0 5px } #smartphone-finder.sf-v12 .sf-filter-panel>summary { font-size:11px;min-height:52px } #smartphone-finder.sf-v12 .sf-specifications dl { grid-template-columns:1fr } #smartphone-finder.sf-v12 .sf-specifications .sf-spec-wide { grid-column:auto } #smartphone-finder.sf-v12 .sf-field input, #smartphone-finder.sf-v12 .sf-field select { font-size:16px!important } #smartphone-finder.sf-v12 .sf-field { font-size:10px } #smartphone-finder.sf-v12 .sf-bottom-note { padding:15px 4px 0;font-size:9px } } @media (max-width:740px) { #smartphone-finder.sf-v12 .sf-dialog { padding:18px;max-height:calc(100dvh - 24px);border-radius:12px } #smartphone-finder.sf-v12 .sf-dialog-heading h2 { font-size:20px } #smartphone-finder.sf-v12 .sf-dialog-mobile { display:block } #smartphone-finder.sf-v12 .sf-comparison-bar { gap:8px;padding:11px 12px;bottom:10px } #smartphone-finder.sf-v12 .sf-comparison-bar>.sf-icon { display:none } #smartphone-finder.sf-v12 .sf-comparison-bar-text { font-size:11px } #smartphone-finder.sf-v12 .sf-comparison-bar-text small { font-size:9px } #smartphone-finder.sf-v12 .sf-comparison-bar button { font-size:10px;min-height:38px;padding:7px 9px } #smartphone-finder.sf-v12 .sf-comparison-bar .sf-clear-compare { padding:6px } } @media (max-width:359px) { #smartphone-finder.sf-v12 .sf-title { font-size:25px } #smartphone-finder.sf-v12 .sf-comparison-bar { flex-wrap:wrap } #smartphone-finder.sf-v12 .sf-comparison-bar-text { flex-basis:100%;padding-bottom:3px } #smartphone-finder.sf-v12 .sf-comparison-bar button { flex:1 } #smartphone-finder.sf-v12 .sf-amazon { font-size:10px!important;gap:3px } #smartphone-finder.sf-v12 .sf-amazon .sf-icon { width:12px;height:12px } } @media (forced-colors:active) { #smartphone-finder.sf-v12 .sf-card, #smartphone-finder.sf-v12 .sf-category, #smartphone-finder.sf-v12 .sf-amazon { border:1px solid ButtonText } #smartphone-finder.sf-v12 .sf-category[aria-current=true] { outline:2px solid Highlight;outline-offset:-3px } #smartphone-finder.sf-v12 .sf-card.is-selected { outline:2px solid Highlight } #smartphone-finder.sf-v12 .sf-visual::before { background:Canvas } #smartphone-finder.sf-v12 .sf-rank { border:1px solid CanvasText } } @media print { #smartphone-finder.sf-v12 .sf-filter-panel, #smartphone-finder.sf-v12 .sf-comparison-bar, #smartphone-finder.sf-v12 .sf-compare-toggle, #smartphone-finder.sf-v12 .sf-sort { display:none!important } #smartphone-finder.sf-v12 .sf-card { break-inside:avoid;box-shadow:none } #smartphone-finder.sf-v12 { box-shadow:none;border:0 } } /* Integration, echte Angebotsdaten und dezenter redaktioneller Farbakzent. */ #smartphone-finder.sf-v12 {overflow:visible;--sf-important:#87510d;--sf-important-bg:#fff3d8;--sf-important-line:#e4bf75} #smartphone-finder.sf-v12 .sf-header {border-radius:23px 23px 0 0} #smartphone-finder.sf-v12 .sf-category {flex-direction:row;margin:0;text-decoration:none!important;overflow-wrap:normal} #smartphone-finder.sf-v12 .sf-categories {margin-bottom:0} #smartphone-finder.sf-v12 .sf-title {font-size:30px;line-height:1.2;letter-spacing:-1px;font-weight:730;max-width:660px;text-wrap:balance} #smartphone-finder.sf-v12 .sf-name {font-size:22px;line-height:1.2;letter-spacing:-.6px;font-weight:730;overflow-wrap:anywhere} #smartphone-finder.sf-v12 .sf-filters {background:none;border:0;border-radius:0;padding:0} #smartphone-finder.sf-v12 .sf-field {color:var(--sf-ink)} #smartphone-finder.sf-v12 .sf-filter-grid {padding-bottom:16px} #smartphone-finder.sf-v12 .sf-filter-bottom {margin:0;min-width:0} #smartphone-finder.sf-v12 .sf-filter-bottom .sf-reset {margin-left:auto;white-space:normal} #smartphone-finder.sf-v12 .sf-sort {max-width:100%;min-width:0} #smartphone-finder.sf-v12 .sf-sort select {width:auto} #smartphone-finder.sf-v12 .sf-count {font-size:11px;line-height:1.5;margin-top:11px} #smartphone-finder.sf-v12 :is(.sf-price-hint,.sf-sort-note) {font-size:11px;line-height:1.65;color:var(--sf-muted);background:none;padding:0;border:0;margin-top:9px} #smartphone-finder.sf-v12 .sf-card {margin:0;align-items:start} #smartphone-finder.sf-v12 .sf-visual {grid-column:1;grid-row:1;min-width:0} #smartphone-finder.sf-v12 .sf-rank {padding:0;position:absolute;display:grid} #smartphone-finder.sf-v12 :is(.sf-product-image,.sf-placeholder) {position:relative;z-index:1;max-width:100%;display:flex;flex-direction:column;align-items:center} #smartphone-finder.sf-v12 .sf-product-image img {display:block;width:133px;height:173px;max-width:100%;object-fit:contain;mix-blend-mode:multiply} #smartphone-finder.sf-v12 .sf-product-image a {display:block} #smartphone-finder.sf-v12 :is(.sf-media-hint,.sf-placeholder small) {text-align:center;color:var(--sf-muted);font-size:9px;line-height:1.5;margin-top:7px} #smartphone-finder.sf-v12 .sf-phone {display:grid;place-items:center;position:relative;width:77px;height:145px;max-width:100%;border:4px solid #2e4258;border-radius:18px;background:radial-gradient(ellipse at 80% 15%,#a9cedf,#3e668b 55%,#152a47);box-shadow:7px 9px 15px #17365324;transform:rotate(-6deg)} #smartphone-finder.sf-v12 .sf-phone::before {content:"";position:absolute;top:5px;left:50%;width:19px;height:4px;border-radius:9px;background:#17283d;transform:translateX(-50%)} #smartphone-finder.sf-v12 .sf-phone span {color:#fff;font-size:22px;font-weight:650;letter-spacing:-.5px} #smartphone-finder.sf-v12 .sf-suitable {color:var(--sf-muted);font-size:11px;line-height:1.65;margin-top:12px} #smartphone-finder.sf-v12 .sf-suitable strong {font-weight:650;color:var(--sf-ink)} #smartphone-finder.sf-v12 .sf-description {margin-top:9px} #smartphone-finder.sf-v12 .sf-highlights {margin-top:12px;padding:0;list-style:none} #smartphone-finder.sf-v12 .sf-highlights li {margin:0;padding:0} #smartphone-finder.sf-v12 .sf-price-sub {font-size:10px;line-height:1.5;white-space:normal;overflow-wrap:anywhere} #smartphone-finder.sf-v12 .sf-price-wrap {min-width:0;max-width:100%} #smartphone-finder.sf-v12 :is(a.sf-amazon,a.sf-amazon:visited) {color:#fff;text-decoration:none;overflow-wrap:normal;line-height:1.4} #smartphone-finder.sf-v12 .sf-compare-choice {font-size:11px;line-height:1.4;text-align:left;min-height:44px;user-select:none} #smartphone-finder.sf-v12 .sf-compare-choice input {margin:0;position:static;opacity:1} #smartphone-finder.sf-v12 .sf-procon {display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:8px 0 17px} #smartphone-finder.sf-v12 .sf-procon h6 {font-size:12px;line-height:1.5;margin-bottom:7px} #smartphone-finder.sf-v12 :is(.sf-pros,.sf-cons) {font-size:12px;line-height:1.6;list-style:disc;padding-left:17px;margin:0;color:var(--sf-muted)} #smartphone-finder.sf-v12 :is(.sf-pros,.sf-cons) li {padding:0;margin:0 0 5px} #smartphone-finder.sf-v12 .sf-pros li::marker {color:#20765f} #smartphone-finder.sf-v12 .sf-cons li::marker {color:#8e785d} #smartphone-finder.sf-v12 .sf-facts {border:0;padding:0;margin:5px 0 15px;display:grid;grid-template-columns:1fr 1fr;gap:13px 20px} #smartphone-finder.sf-v12 .sf-facts div {display:block;padding:0;border:0;min-width:0} #smartphone-finder.sf-v12 .sf-facts dt {font-size:11px;color:var(--sf-muted);line-height:1.5} #smartphone-finder.sf-v12 .sf-facts dd {font-size:12px;line-height:1.6;margin:3px 0 0} #smartphone-finder.sf-v12 .sf-sources {font-size:10px;line-height:1.7;color:var(--sf-muted);padding-bottom:17px} #smartphone-finder.sf-v12 .sf-method {border:0;border-top:1px solid var(--sf-line);background:transparent;border-radius:0;margin:24px 9px 0;padding:0} #smartphone-finder.sf-v12 .sf-method>summary {font-size:12px;line-height:1.6;min-height:48px;padding:14px 0;cursor:pointer;color:var(--sf-ink);font-weight:650} #smartphone-finder.sf-v12 .sf-method>div {padding:0 0 10px} #smartphone-finder.sf-v12 .sf-method p {font-size:12px;line-height:1.75;color:var(--sf-muted);margin:0 0 10px} #smartphone-finder.sf-v12 .sf-bottom {border:0;padding:0 9px;background:none;margin:0} #smartphone-finder.sf-v12 .sf-bottom .sf-contract {border-top:1px solid var(--sf-line);padding:24px 8px 21px;margin-top:7px;display:flex;align-items:center;flex-direction:column;gap:11px;text-align:center} #smartphone-finder.sf-v12 .sf-contract-title {font-size:14px;line-height:1.5;color:var(--sf-ink)} #smartphone-finder.sf-v12 :is(a.sf-contract-cta,a.sf-contract-cta:visited) {display:inline-flex;justify-content:center;align-items:center;gap:11px;width:min(100%,410px);min-height:52px;padding:13px 18px;background:linear-gradient(115deg,#c34b00,#c94e00);color:#fff;border:1px solid transparent;border-radius:12px;box-shadow:0 5px 13px #a73b0033;font-size:14px!important;line-height:1.4;font-weight:750;text-decoration:none!important;text-align:center;overflow-wrap:normal;transition:background .16s,transform .16s,box-shadow .16s} #smartphone-finder.sf-v12 .sf-contract-cta .sf-icon {width:20px;height:20px;flex:none} #smartphone-finder.sf-v12 .sf-contract-cta:hover {background:#a83c00;box-shadow:0 6px 16px #a73b0040;transform:translateY(-1px)} #smartphone-finder.sf-v12 .sf-legal {border-top:1px solid var(--sf-line);padding-top:11px} #smartphone-finder.sf-v12 .sf-review-footer time {font-weight:650} #smartphone-finder.sf-v12 .sf-disclosure {font-size:10px;line-height:1.75;color:var(--sf-muted);margin-top:9px} #smartphone-finder.sf-v12 .sf-notice {font-size:12px;line-height:1.7;border:1px solid #dcc9a7;border-left:3px solid #b38536;border-radius:9px;background:#fff9ee;color:#604619;padding:11px 13px;margin:16px 8px} #smartphone-finder.sf-v12 .sf-empty h4 {font-size:18px;line-height:1.4} #smartphone-finder.sf-v12 .sf-empty p {margin-top:8px} #smartphone-finder.sf-v12 .sf-button {display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:9px 13px;border:1px solid transparent;border-radius:8px;background:var(--sf-action);color:#fff;font-size:12px;line-height:1.5;text-decoration:none} /* Link-Buttons duerfen nicht die allgemeine blaue Linkfarbe erben. */ #smartphone-finder.sf-v12 a.sf-button, #smartphone-finder.sf-v12 a.sf-button:visited, #smartphone-finder.sf-v12 a.sf-button:hover, #smartphone-finder.sf-v12 a.sf-button:active, #smartphone-finder.sf-v12 a.sf-button:focus-visible {color:#fff;text-decoration:none} #smartphone-finder.sf-v12 .sf-more {display:flex;justify-content:center;margin:20px 0 8px} #smartphone-finder.sf-v12 .sf-empty-alternative {margin:16px 0} #smartphone-finder.sf-v12 .sf-empty .sf-button {margin:5px;max-width:100%;text-align:center} #smartphone-finder.sf-v12 .sf-catalogue-scope {margin:-7px 0 18px;color:#526780;font-size:12px;line-height:1.6} #smartphone-finder.sf-v12 .sf-search-scope {margin:10px 0 0;color:#526780;font-size:12px;line-height:1.6} @media print {#smartphone-finder.sf-v12 .sf-more {display:none}} #smartphone-finder.sf-v12 .sf-button:hover {background:var(--sf-action-hover)} #smartphone-finder.sf-v12[data-accents=true] .sf-card[data-featured=true] .sf-badge {color:var(--sf-important);background:var(--sf-important-bg);box-shadow:inset 0 0 0 1px #eed8af} #smartphone-finder.sf-v12[data-accents=true] .sf-card[data-featured=true] .sf-rank {color:var(--sf-important);background:var(--sf-important-bg);border-color:var(--sf-important-line)} #smartphone-finder.sf-v12 .sf-comparison-bar {position:sticky;left:auto;transform:none;width:100%;max-width:100%;bottom:12px;z-index:10;display:flex;flex-wrap:wrap;padding:12px 14px;margin:17px 0;background:#17283ff5;border:1px solid #344961;border-radius:12px;box-shadow:0 7px 24px #132b4736} #smartphone-finder.sf-v12 .sf-comparison-bar>[data-sf-compare-count] {font-size:12px;flex:1;min-width:130px} #smartphone-finder.sf-v12 .sf-comparison-bar .sf-button {background:#fff;color:#173654;border:1px solid #bac9dc;margin:0;font-size:12px} #smartphone-finder.sf-v12 .sf-comparison-bar .sf-clear-compare {font-size:11px;background:transparent;border:1px solid #7a8ba4;color:#fff;min-height:40px;padding:8px;border-radius:7px} #smartphone-finder.sf-v12 .sf-comparison-feedback {flex-basis:100%;color:#e1e9f4;font-size:11px;line-height:1.6;display:block} #smartphone-finder.sf-v12 .sf-comparison-feedback:empty {display:none} #smartphone-finder.sf-v12 .sf-dialog {position:fixed;margin:auto;padding:24px;max-width:860px;width:calc(100% - 32px);max-height:calc(100dvh - 40px);color:var(--sf-ink);background:#fff;border:1px solid #cdd7e3;border-radius:16px;overflow:auto} #smartphone-finder.sf-v12 .sf-dialog:not([open]) {display:none} #smartphone-finder.sf-v12 .sf-dialog-heading h4 {font-size:23px;line-height:1.3;letter-spacing:-.5px} #smartphone-finder.sf-v12 .sf-dialog .sf-close {min-width:44px;font-size:12px;line-height:1.5;display:flex;gap:6px} #smartphone-finder.sf-v12 .sf-table-scroll {margin-top:20px;overflow-x:auto;border:1px solid var(--sf-line);border-radius:9px} #smartphone-finder.sf-v12 .sf-comparison-table {border-collapse:collapse;width:100%;table-layout:fixed} #smartphone-finder.sf-v12 .sf-comparison-table[data-count="2"] {min-width:560px} #smartphone-finder.sf-v12 .sf-comparison-table[data-count="3"] {min-width:720px} #smartphone-finder.sf-v12 .sf-comparison-table .sf-amazon {margin:0;white-space:normal} body:has(#smartphone-finder.sf-v12 .sf-dialog[open]) {overflow:hidden} @container finder (min-width:900px) { #smartphone-finder.sf-v12 .sf-title {font-size:36px;max-width:none} #smartphone-finder.sf-v12 .sf-name {font-size:25px} #smartphone-finder.sf-v12 .sf-product-image img {width:157px;height:195px} } @container finder (max-width:690px) { #smartphone-finder.sf-v12 .sf-title {font-size:28px} #smartphone-finder.sf-v12 .sf-name {font-size:21px} #smartphone-finder.sf-v12 .sf-product-image img {width:113px;height:150px} #smartphone-finder.sf-v12 .sf-phone {width:68px;height:128px;border-radius:16px} #smartphone-finder.sf-v12 .sf-offer {align-self:start} #smartphone-finder.sf-v12 .sf-compare-choice {font-size:10px;min-height:38px} } @container finder (max-width:470px) { #smartphone-finder.sf-v12 .sf-title {font-size:27px} #smartphone-finder.sf-v12 .sf-name {font-size:20px} #smartphone-finder.sf-v12 .sf-suitable {font-size:10px;line-height:1.6} #smartphone-finder.sf-v12 .sf-product-image img {width:88px;height:120px} #smartphone-finder.sf-v12 .sf-phone {width:57px;height:111px;border-radius:14px} #smartphone-finder.sf-v12 :is(.sf-facts,.sf-procon) {grid-template-columns:1fr} #smartphone-finder.sf-v12 .sf-price-sub {font-size:9px} #smartphone-finder.sf-v12 .sf-compare-choice {font-size:10px;min-height:40px} #smartphone-finder.sf-v12 .sf-dialog {padding:17px;width:calc(100% - 20px)} #smartphone-finder.sf-v12 .sf-dialog-heading h4 {font-size:20px} #smartphone-finder.sf-v12 .sf-method {margin-left:3px;margin-right:3px} #smartphone-finder.sf-v12 .sf-notice {margin-left:0;margin-right:0} } @media (prefers-reduced-motion:reduce) {#smartphone-finder.sf-v12 *,#smartphone-finder.sf-v12 *::before,#smartphone-finder.sf-v12 *::after {transition:none!important;animation:none!important;scroll-behavior:auto!important}} @media (forced-colors:active) {#smartphone-finder.sf-v12 .sf-category[aria-current=true],#smartphone-finder.sf-v12 .sf-card.is-selected {outline:2px solid Highlight;outline-offset:-2px}} @media print {#smartphone-finder.sf-v12 :is(.sf-filters,.sf-sort,.sf-comparison-bar,.sf-dialog,.sf-compare-choice) {display:none!important}} /* Lange redaktionelle Angaben duerfen die Karte nicht verbreitern. */ #smartphone-finder.sf-v12 :is(.sf-badge,.sf-name,.sf-price) {max-width:100%;overflow-wrap:anywhere} @container finder (max-width:470px) { #smartphone-finder.sf-v12 .sf-bottom .sf-contract {padding:19px 3px} #smartphone-finder.sf-v12 :is(a.sf-contract-cta,a.sf-contract-cta:visited) {font-size:13px!important;padding:12px 11px} } /* 1.3: Bild-Kopf und offene Suchleiste. Die Produktkarten bleiben unveraendert. */ #smartphone-finder.sf-v12 .sf-header.sf-header--photo { position:relative; display:grid; grid-template-columns:55% minmax(0,1fr); align-items:center; min-height:292px; min-height:clamp(292px,34cqi,390px); padding:28px; overflow:hidden; border:0; background:#e8f2ff; border-radius:23px 23px 0 0; } #smartphone-finder.sf-v12 .sf-header--photo::before { /* Nur hinter dem Text: das rechte Bilddrittel bleibt ohne Farbueberlagerung. */ content:""; position:absolute; inset:0 auto 0 0; width:65%; z-index:1; pointer-events:none; background:linear-gradient(90deg,rgba(248,251,255,.98) 0%,rgba(248,251,255,.98) 65%,rgba(248,251,255,.92) 83%,rgba(248,251,255,0) 100%); } #smartphone-finder.sf-v12 .sf-hero-media { position:absolute; inset:0; width:100%; display:block; overflow:hidden; pointer-events:none; } #smartphone-finder.sf-v12 .sf-hero-media img { display:block; width:100%; height:100%; max-width:none; object-fit:cover; object-position:center top; margin:0; padding:0; border:0; } #smartphone-finder.sf-v12 .sf-hero-copy { grid-column:1; position:relative; z-index:2; min-width:0 } #smartphone-finder.sf-v12 .sf-hero-copy .sf-hero-eyebrow { margin:0 0 13px; color:#355d99; font-size:10px; font-weight:700; line-height:1.6; letter-spacing:.075em; text-transform:uppercase; } #smartphone-finder.sf-v12 .sf-header--photo .sf-title { max-width:none; margin:0; font-size:30px; font-size:clamp(28px,3.85cqi,43px); font-weight:750; letter-spacing:-.045em; line-height:1.15; color:#0c2447; overflow-wrap:break-word; text-wrap:balance; } #smartphone-finder.sf-v12 .sf-header--photo .sf-lead { max-width:460px; margin:17px 0 0; font-size:13px; font-size:clamp(13px,1.55cqi,16px); line-height:1.7; color:#2f4b6e; overflow-wrap:break-word; } #smartphone-finder.sf-v12 .sf-header--photo .sf-lead--mobile { display:none } /* Drei Hinweise direkt unter der Einleitung; bei schmalen Ansichten umbrechen. */ #smartphone-finder.sf-v12 .sf-hero-copy .sf-hero-points { display:flex; flex-wrap:wrap; gap:9px 12px; list-style:none; padding:0; margin:18px 0 0 } #smartphone-finder.sf-v12 .sf-hero-points li { display:flex; align-items:center; gap:6px; min-width:0; font-size:11px; line-height:1.45; color:#244e7f; font-weight:600 } #smartphone-finder.sf-v12 .sf-hero-points .sf-icon { width:15px; height:15px; padding:2px; border-radius:50%; color:#fff; background:#d67905; stroke-width:3 } #smartphone-finder.sf-v12 .sf-hero-points span { min-width:0; overflow-wrap:break-word } /* Suchbereich: Ueberschrift bewusst VOR der Suche. */ #smartphone-finder.sf-v12 .sf-discovery { padding:25px 24px 20px; background:#fff } #smartphone-finder.sf-v12 .sf-recommendations-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px 18px; margin:0 0 18px } #smartphone-finder.sf-v12 .sf-recommendations-heading h4 { font-size:25px; line-height:1.25; letter-spacing:-.035em; font-weight:750; color:#142943; margin:0; overflow-wrap:break-word } #smartphone-finder.sf-v12 .sf-category-jump { display:inline-flex; align-items:center; gap:7px; min-height:38px; font-size:11px; font-weight:600; color:#0964cb } #smartphone-finder.sf-v12 .sf-category-jump .sf-icon { width:15px; height:15px } #smartphone-finder.sf-v12 .sf-discovery .sf-filter-panel { margin:0; padding:17px; border:1px solid #dce7f3; border-radius:15px; background:linear-gradient(110deg,#f9fbff,#fff); box-shadow:0 7px 22px rgba(31,80,137,.07); } #smartphone-finder.sf-v12 .sf-discovery .sf-filters { margin:0; padding:0; border:0; background:none } #smartphone-finder.sf-v12 .sf-discovery .sf-filter-grid { display:grid; grid-template-columns:1.45fr 1fr 1fr 170px; align-items:end; gap:11px; margin:0; padding:0; } #smartphone-finder.sf-v12 .sf-discovery .sf-field { gap:7px; font-size:11px; color:#25456d; font-weight:650; line-height:1.45; min-width:0 } #smartphone-finder.sf-v12 .sf-discovery .sf-field input, #smartphone-finder.sf-v12 .sf-discovery .sf-field select { height:46px; min-width:0; width:100%; background:#fff; border:1px solid #b9cce2; border-radius:8px; padding:9px 8px; color:#203e67; font-size:12px!important; box-shadow:0 1px 2px rgba(26,63,106,.02); } #smartphone-finder.sf-v12 .sf-discovery .sf-field input::placeholder { color:#627791; opacity:1 } #smartphone-finder.sf-v12 .sf-discovery .sf-apply { display:flex; align-items:center; justify-content:center; gap:7px; align-self:end; min-height:46px; height:auto; margin:0; padding:10px 9px; width:100%; border:1px solid #0660c9; border-radius:9px; background:linear-gradient(120deg,#0769d6,#005bc5); color:#fff; box-shadow:0 4px 12px rgba(0,91,197,.18); font-size:11px; font-weight:700; line-height:1.4; } #smartphone-finder.sf-v12 .sf-discovery .sf-apply .sf-icon { width:17px; height:17px } #smartphone-finder.sf-v12 .sf-discovery .sf-apply:hover { background:#0753ad; border-color:#0753ad } #smartphone-finder.sf-v12 .sf-discovery .sf-filter-bottom { grid-column:1/-1; margin:0; gap:8px 20px; align-items:center; justify-content:space-between; min-width:0 } #smartphone-finder.sf-v12 .sf-discovery .sf-esim-label { min-height:38px; font-size:11px; color:#415d7b; line-height:1.45 } #smartphone-finder.sf-v12 .sf-discovery .sf-reset { display:inline-flex; align-items:center; min-height:38px; font-size:11px!important; border:0; margin:0 0 0 auto; padding:3px 0; color:#335c8b } #smartphone-finder.sf-v12 .sf-discovery .sf-field--search { grid-column:auto } /* Vier Infopunkte statt zusaetzlicher Werbekacheln. */ #smartphone-finder.sf-v12 .sf-discovery .sf-benefits { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; list-style:none; margin:25px 0 0; padding:0 } #smartphone-finder.sf-v12 .sf-benefits li { display:grid; grid-template-columns:25px minmax(0,1fr); gap:10px; align-items:start; padding:0 13px; min-width:0; border-left:1px solid #e4edf6 } #smartphone-finder.sf-v12 .sf-benefits li:first-child { border-left:0; padding-left:0 } #smartphone-finder.sf-v12 .sf-benefits li:last-child { padding-right:0 } #smartphone-finder.sf-v12 .sf-benefits .sf-icon { width:25px; height:25px; color:#12559e; margin-top:2px; stroke-width:1.65 } #smartphone-finder.sf-v12 .sf-benefits strong { display:block; margin:0 0 5px; font-size:11px; font-weight:700; line-height:1.45; color:#183459 } #smartphone-finder.sf-v12 .sf-benefits p { margin:0; font-size:11px; line-height:1.6; color:#4f6684; overflow-wrap:break-word } #smartphone-finder.sf-v12 .sf-discovery .sf-categories { display:flex; flex-wrap:wrap; gap:7px; margin:0 0 18px; padding:0; scroll-margin-top:20px } #smartphone-finder.sf-v12 .sf-discovery .sf-category { display:flex; justify-content:center; align-items:center; flex:1 1 auto; min-height:46px; padding:10px 11px; border-radius:999px; border:1px solid #7697bc; background:linear-gradient(180deg,#fff,#e8f1fc); color:#153f70; font-size:12px!important; font-weight:700!important; line-height:1.4!important; text-align:center; box-shadow:0 2px 5px rgba(21,63,112,.08); text-decoration:none; transform:none; transition:border-color .16s,box-shadow .16s; } #smartphone-finder.sf-v12 .sf-discovery .sf-category:hover { background:#d9e9fb; border-color:#345f94; box-shadow:0 3px 8px rgba(21,63,112,.13) } #smartphone-finder.sf-v12 .sf-discovery .sf-category[aria-current=true] { color:#fff; background:linear-gradient(135deg,#0869d4,#084f9e); border-color:#084a98; box-shadow:0 0 0 2px #d5e7ff,0 4px 10px rgba(0,74,152,.2); } #smartphone-finder.sf-v12 .sf-discovery .sf-category[aria-current=true]:hover { background:#064286; border-color:#064286 } #smartphone-finder.sf-v12 .sf-discovery .sf-category:focus-visible { outline:3px solid #b45309; outline-offset:3px } #smartphone-finder.sf-v12 #sf-category-title { scroll-margin-top:24px } /* Design 2 bleibt ueber die vorhandene config.php waehlbar. */ #smartphone-finder.sf-v12[data-design=night] .sf-header.sf-header--photo { background:#1b2d49; color:#fff } #smartphone-finder.sf-v12[data-design=night] .sf-header--photo::before { background:linear-gradient(90deg,#142440 0%,rgba(20,36,64,.98) 65%,rgba(20,36,64,.92) 83%,rgba(20,36,64,0) 100%) } #smartphone-finder.sf-v12[data-design=night] .sf-header--photo .sf-title { color:#fff } #smartphone-finder.sf-v12[data-design=night] .sf-header--photo .sf-lead { color:#d8e5f7 } #smartphone-finder.sf-v12[data-design=night] .sf-hero-copy .sf-hero-eyebrow { color:#b7d4ff } #smartphone-finder.sf-v12[data-design=night] .sf-hero-points li { color:#e7f0ff } @container finder (min-width:1050px) { #smartphone-finder.sf-v12 .sf-header.sf-header--photo { padding:36px 38px } #smartphone-finder.sf-v12 .sf-hero-copy .sf-hero-eyebrow { font-size:12px } #smartphone-finder.sf-v12 .sf-hero-points li { font-size:13px } #smartphone-finder.sf-v12 .sf-discovery { padding:30px } #smartphone-finder.sf-v12 .sf-discovery .sf-field { font-size:12px } #smartphone-finder.sf-v12 .sf-discovery .sf-filter-grid { grid-template-columns:1.55fr 1fr 1fr 180px; gap:15px } #smartphone-finder.sf-v12 .sf-discovery .sf-apply { font-size:13px } #smartphone-finder.sf-v12 .sf-benefits strong { font-size:13px } #smartphone-finder.sf-v12 .sf-benefits p { font-size:12px } #smartphone-finder.sf-v12 .sf-benefits li { grid-template-columns:31px minmax(0,1fr); gap:13px; padding:0 20px } #smartphone-finder.sf-v12 .sf-benefits li:first-child { padding-left:0 } #smartphone-finder.sf-v12 .sf-benefits .sf-icon { width:31px; height:31px } #smartphone-finder.sf-v12 .sf-discovery .sf-category { font-size:13px!important; padding:11px 17px } } @container finder (max-width:740px) { #smartphone-finder.sf-v12 .sf-header.sf-header--photo { display:flex; flex-direction:column; align-items:stretch; min-height:0; padding:0 } #smartphone-finder.sf-v12 .sf-header--photo::before { display:none } #smartphone-finder.sf-v12 .sf-hero-copy { order:1; width:auto; padding:24px 23px 21px; background:#f3f8ff } #smartphone-finder.sf-v12 .sf-header--photo .sf-title { font-size:30px; letter-spacing:-.04em } #smartphone-finder.sf-v12 .sf-header--photo .sf-lead--desktop { display:none } #smartphone-finder.sf-v12 .sf-header--photo .sf-lead--mobile { display:block } #smartphone-finder.sf-v12 .sf-header--photo .sf-lead { max-width:none; margin-top:12px; font-size:14px; line-height:1.65 } #smartphone-finder.sf-v12 .sf-hero-copy .sf-hero-eyebrow { margin-bottom:10px; font-size:10px } #smartphone-finder.sf-v12 .sf-hero-media { position:relative; inset:auto; order:2; width:100%; height:clamp(195px,52cqi,300px); -webkit-mask-image:none; mask-image:none } #smartphone-finder.sf-v12 .sf-hero-media img { object-position:center top } #smartphone-finder.sf-v12 .sf-hero-points li { font-size:12px } #smartphone-finder.sf-v12[data-design=night] .sf-hero-copy { background:#142440 } #smartphone-finder.sf-v12 .sf-discovery { padding:22px 17px 20px } #smartphone-finder.sf-v12 .sf-recommendations-heading { margin-bottom:15px } #smartphone-finder.sf-v12 .sf-recommendations-heading h4 { font-size:24px } #smartphone-finder.sf-v12 .sf-discovery .sf-categories { margin:0 0 15px } #smartphone-finder.sf-v12 .sf-discovery .sf-filter-panel { padding:15px } #smartphone-finder.sf-v12 .sf-discovery .sf-filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px } #smartphone-finder.sf-v12 .sf-discovery .sf-field { font-size:12px } #smartphone-finder.sf-v12 .sf-discovery .sf-field input, #smartphone-finder.sf-v12 .sf-discovery .sf-field select { font-size:16px!important; height:46px } #smartphone-finder.sf-v12 .sf-discovery .sf-filter-bottom { grid-row:auto; gap:6px } #smartphone-finder.sf-v12 .sf-discovery .sf-apply { grid-column:1/-1; font-size:14px; min-height:46px } #smartphone-finder.sf-v12 .sf-discovery .sf-benefits { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 18px; margin:24px 0 0 } #smartphone-finder.sf-v12 .sf-benefits li { padding:0; border-left:0; gap:10px } #smartphone-finder.sf-v12 .sf-benefits strong { font-size:12px } #smartphone-finder.sf-v12 .sf-benefits p { font-size:11px } #smartphone-finder.sf-v12 .sf-discovery .sf-categories { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px } #smartphone-finder.sf-v12 .sf-discovery .sf-category { font-size:12px!important; min-height:46px; padding:9px; border-radius:13px } } @container finder (max-width:480px) { #smartphone-finder.sf-v12 .sf-benefits p { display:none } #smartphone-finder.sf-v12 .sf-discovery .sf-benefits { gap:17px 14px; margin:23px 0 } #smartphone-finder.sf-v12 .sf-benefits strong { margin:0; font-size:12px } #smartphone-finder.sf-v12 .sf-benefits li { align-items:center } } @container finder (max-width:360px) { #smartphone-finder.sf-v12 .sf-hero-copy { padding:21px 17px 19px } #smartphone-finder.sf-v12 .sf-header--photo .sf-title { font-size:27px } #smartphone-finder.sf-v12 .sf-header--photo .sf-lead { font-size:13px } #smartphone-finder.sf-v12 .sf-hero-copy .sf-hero-eyebrow { font-size:9px; letter-spacing:.055em } #smartphone-finder.sf-v12 .sf-discovery { padding:20px 12px 17px } #smartphone-finder.sf-v12 .sf-discovery .sf-categories { margin:0 0 14px } #smartphone-finder.sf-v12 .sf-discovery .sf-filter-panel { padding:12px } #smartphone-finder.sf-v12 .sf-discovery .sf-filter-grid { gap:12px 9px } #smartphone-finder.sf-v12 .sf-recommendations-heading h4 { font-size:23px } #smartphone-finder.sf-v12 .sf-benefits li { grid-template-columns:21px minmax(0,1fr); gap:8px } #smartphone-finder.sf-v12 .sf-benefits .sf-icon { width:21px; height:21px } #smartphone-finder.sf-v12 .sf-benefits strong { font-size:11px } #smartphone-finder.sf-v12 .sf-benefits p { font-size:10px } } @media (forced-colors:active) { #smartphone-finder.sf-v12 .sf-hero-media { visibility:hidden } #smartphone-finder.sf-v12 .sf-header--photo::before { display:none } #smartphone-finder.sf-v12 .sf-discovery .sf-category[aria-current=true] { outline:2px solid Highlight } } @media print { #smartphone-finder.sf-v12 .sf-header.sf-header--photo { display:block; min-height:0; background:none; color:#000 } #smartphone-finder.sf-v12 .sf-header--photo::before, #smartphone-finder.sf-v12 :is(.sf-hero-media,.sf-category-jump,.sf-benefits) { display:none } #smartphone-finder.sf-v12 .sf-hero-copy { padding:0; background:none } #smartphone-finder.sf-v12 .sf-header--photo :is(.sf-title,.sf-lead,.sf-hero-eyebrow,.sf-hero-points li) { color:#000!important } #smartphone-finder.sf-v12 .sf-discovery { padding-bottom:0 } } /* Preisstand und verlinkter Hinweis bleiben auch bei laengerem Ausfall sichtbar. */ #smartphone-finder.sf-v12 .sf-price-info { display:inline-block; margin-top:4px; color:#335c8b; font-size:11px; line-height:1.5; text-decoration:underline; text-underline-offset:2px; } #smartphone-finder.sf-v12 .sf-price-info:hover { color:#16467a } #smartphone-finder.sf-v12 .sf-price-info:focus-visible { outline:2px solid #0867d6; outline-offset:3px; border-radius:2px; } #smartphone-finder.sf-v12 #sf-price-disclaimer { scroll-margin-top:24px }