.sic2026 {
--sic-navy: #1B3565;
--sic-navy-dark: #12244a;
--sic-sky: #5FA8D8;
--sic-sky-light: #EAF3FA;
--sic-ink: #22304a;
--sic-grey: #5d6b83;
--sic-line: #dde5ef;
--sic-bg-soft: #E3E3E3;
--sic-radius: 10px;
--sic-shadow: 0 10px 30px rgba(27, 53, 101, 0.10);
--sic-font-display: "Barlow Semi Condensed", "Arial Narrow", sans-serif;
--sic-font-body: "Inter", "Segoe UI", Arial, sans-serif;
font-family: var(--sic-font-body);
color: var(--sic-ink);
line-height: 1.65;
}
.sic2026 *, .sic2026 *::before, .sic2026 *::after { box-sizing: border-box; }
.sic2026 .sic-wrap { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
.sic2026 h1, .sic2026 h2, .sic2026 h3 {
font-family: var(--sic-font-display);
color: var(--sic-navy);
line-height: 1.15;
margin: 0 0 0.5em;
text-transform: none;
letter-spacing: -0.01em;
}
.sic2026 h1 { font-size: clamp(2rem, 4.5vw, 3.2rem); font-weight: 700; }
.sic2026 h2 { font-size: clamp(1.6rem, 3vw, 2.3rem); font-weight: 700; }
.sic2026 h3 { font-size: 1.25rem; font-weight: 600; }
.sic2026 p { margin: 0 0 1em; }
.sic2026 .sic-eyebrow {
display: inline-block;
font-family: var(--sic-font-display);
font-size: 0.85rem;
font-weight: 600;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--sic-sky);
margin-bottom: 0.6em;
}
.sic2026 .sic-btn {
display: inline-block;
font-family: var(--sic-font-display);
font-weight: 600;
font-size: 1.05rem;
text-decoration: none;
border-radius: 8px;
padding: 14px 26px;
border: 2px solid transparent;
cursor: pointer;
line-height: 1.3;
transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.sic2026 .sic-btn-primary { background: var(--sic-sky); color: #ffffff; }
.sic2026 .sic-btn-primary:hover { background: #7cbbe3; color: #ffffff; }
.sic2026 .sic-btn-outline { border-color: rgba(255,255,255,0.55); color: #fff; background: transparent; }
.sic2026 .sic-btn-outline:hover { border-color: #fff; background: rgba(255,255,255,0.08); color: #fff; }
.sic2026 .sic-btn-navy { background: var(--sic-navy); color: #fff; }
.sic2026 .sic-btn-navy:hover { background: var(--sic-navy-dark); color: #fff; }
.sic2026 .sic-btn-outline-navy { border-color: var(--sic-navy); color: var(--sic-navy); background: transparent; }
.sic2026 .sic-btn-outline-navy:hover { background: var(--sic-navy); color: #fff; }
.sic2026 .sic-btn[disabled] { opacity: 0.4; cursor: not-allowed; } .sic2026 .sic-konfigurator { max-width: 1100px; margin: 0 auto; padding: 56px 0 80px; } .sic2026 .konf-layout {
display: grid;
grid-template-columns: minmax(0, 1fr) 340px;
gap: 36px;
align-items: start;
}
.sic2026 .konf-preview {
position: sticky;
top: 100px;
background: var(--sic-bg-soft);
border: 1px solid var(--sic-line);
border-radius: var(--sic-radius);
padding: 22px;
}
.sic2026 .konf-preview h3 { margin: 12px 0 4px; font-size: 1.1rem; }
.sic2026 .konf-preview ul { margin: 8px 0 0; padding-left: 20px; }
.sic2026 .konf-preview li { margin-bottom: 5px; color: var(--sic-ink); font-size: 0.93rem; }
.sic2026 .sic-breadcrumbs { font-size: 0.88rem; color: var(--sic-grey); margin-bottom: 18px; }
.sic2026 .sic-breadcrumbs a { color: var(--sic-grey); }
.sic2026 .konf-progress { display: flex; gap: 6px; margin: 26px 0 34px; }
.sic2026 .konf-progress .step-dot { flex: 1; height: 6px; border-radius: 3px; background: var(--sic-line); }
.sic2026 .konf-progress .step-dot.active { background: var(--sic-sky); }
.sic2026 .konf-progress .step-dot.done { background: var(--sic-navy); }
.sic2026 .konf-step { display: none; }
.sic2026 .konf-step.active { display: block; animation: sicFadeIn 0.25s ease; }
@keyframes sicFadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
.sic2026 .konf-step.active { animation: none; }
.sic2026 .sic-card-img img, .sic2026 .sic-card:hover .sic-card-img img { transition: none; transform: none; }
}
.sic2026 .konf-step h2 { margin-bottom: 6px; }
.sic2026 .konf-step .step-label { color: var(--sic-grey); font-size: 0.9rem; margin-bottom: 22px; } .sic2026 .option-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.sic2026 .option-card {
border: 2px solid var(--sic-line);
border-radius: var(--sic-radius);
padding: 20px;
cursor: pointer;
background: #fff;
text-align: left;
font-family: var(--sic-font-body);
font-size: 1rem;
width: 100%;
transition: border-color 0.15s, box-shadow 0.15s;
}
.sic2026 .option-card:hover { border-color: var(--sic-sky); background: #fff; }
.sic2026 .option-card.selected { border-color: var(--sic-navy); background: var(--sic-sky-light); box-shadow: var(--sic-shadow); }
.sic2026 .option-card strong { display: block; font-family: var(--sic-font-display); font-size: 1.1rem; color: var(--sic-navy); margin-bottom: 4px; }
.sic2026 .option-card span { color: var(--sic-grey); font-size: 0.92rem; }
.sic2026 .konf-nav { display: flex; justify-content: space-between; margin-top: 34px; gap: 12px; } .sic2026 .option-card.is-hidden { display: none; }
.sic2026 .konf-result-visual { position: relative; }
.sic2026 .konf-sketch-badge {
position: absolute;
top: 8px;
left: 8px;
z-index: 1;
background: var(--sic-navy);
color: #fff;
font-family: var(--sic-font-display);
font-size: 0.68rem;
font-weight: 600;
letter-spacing: 0.08em;
text-transform: uppercase;
padding: 4px 9px;
border-radius: 5px;
}
.sic2026 .konf-result-visual-inner {
background: #fff;
border: 1px solid var(--sic-line);
border-radius: 8px;
padding: 12px;
display: flex;
align-items: center;
justify-content: center;
}
.sic2026 .konf-result-visual svg { width: 100%; height: auto; display: block; }
.sic2026 .konf-result-label {
font-family: var(--sic-font-display);
font-size: 0.8rem;
font-weight: 600;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--sic-sky);
display: block;
margin-bottom: 10px;
}
.sic2026 .konf-result-note { font-size: 0.85rem; color: var(--sic-grey); margin: 12px 0 0; }
.sic2026 .konf-summary {
background: #fff;
border: 1px solid var(--sic-line);
border-radius: var(--sic-radius);
padding: 22px;
margin-bottom: 26px;
}
.sic2026 .konf-summary dl { display: grid; grid-template-columns: 200px 1fr; gap: 8px 16px; margin: 0; }
.sic2026 .konf-summary dt { color: var(--sic-grey); }
.sic2026 .konf-summary dd { margin: 0; font-weight: 600; color: var(--sic-navy); }
.sic2026 .konf-form label { display: block; font-weight: 600; margin: 16px 0 6px; color: var(--sic-navy); }
.sic2026 .konf-form input[type="text"],
.sic2026 .konf-form input[type="email"],
.sic2026 .konf-form input[type="tel"],
.sic2026 .konf-form textarea {
width: 100%;
padding: 12px 14px;
border: 1px solid var(--sic-line);
border-radius: 8px;
font-family: var(--sic-font-body);
font-size: 1rem;
background: #fff;
box-shadow: none;
}
.sic2026 .konf-form input:focus, .sic2026 .konf-form textarea:focus {
border-color: var(--sic-sky);
outline: none;
box-shadow: 0 0 0 3px rgba(95,168,216,0.25);
}
.sic2026 .notice-success {
background: #e8f6ec;
border: 1px solid #9fd6ae;
color: #1d5a2f;
border-radius: var(--sic-radius);
padding: 18px 22px;
margin-bottom: 26px;
}
@media (max-width: 980px) {
.sic2026 .konf-layout { grid-template-columns: 1fr; }
.sic2026 .konf-preview { position: static; order: -1; }
}
@media (max-width: 620px) {
.sic2026 .option-grid { grid-template-columns: 1fr; }
.sic2026 .konf-summary dl { grid-template-columns: 1fr; }
}
.sic2026 .konf-steplabels {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 6px;
margin: -26px 0 30px;
font-size: 0.78rem;
color: var(--sic-grey);
}
.sic2026 .konf-steplabels span { text-align: center; }
.sic2026 .konf-steplabels span.active { color: var(--sic-navy); font-weight: 600; }
.sic2026 .konf-edit {
background: none;
border: none;
padding: 0;
margin-left: 8px;
font-family: var(--sic-font-body);
font-size: 0.8rem;
color: var(--sic-sky);
cursor: pointer;
text-decoration: underline;
}
.sic2026 .konf-edit:hover { color: var(--sic-navy); }
.sic2026 .konf-trust { font-size: 0.9rem; color: var(--sic-grey); margin: 18px 0 6px; }
.sic2026 .sic-cta-actions { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.sic2026 .konf-note {
background: var(--sic-sky-light, #eef6fc);
border-left: 4px solid var(--sic-sky);
border-radius: 8px;
padding: 12px 16px;
font-size: 0.92rem;
line-height: 1.5;
color: var(--sic-ink);
margin: 18px 0 20px;
}
.sic2026 .konf-note strong { color: var(--sic-navy); } .sic2026 .konf-trail {
list-style: none;
display: flex;
flex-wrap: wrap;
gap: 6px;
padding: 0;
margin: 0 0 26px;
}
.sic2026 .konf-trail li { display: flex; align-items: center; }
.sic2026 .konf-trail li + li::before { content: ""; width: 14px; height: 2px; background: var(--sic-line); margin: 0 6px 0 2px; }
.sic2026 .konf-trail button {
-webkit-appearance: none;
appearance: none;
border: 1px solid var(--sic-line);
background: #fff;
border-radius: 999px;
padding: 6px 12px;
font-family: var(--sic-font-body);
font-size: 0.8rem;
line-height: 1.2;
color: var(--sic-navy);
cursor: pointer;
display: flex;
gap: 6px;
align-items: baseline;
min-height: 0;
margin: 0;
box-shadow: none;
text-transform: none;
letter-spacing: 0;
}
.sic2026 .konf-trail button:hover { border-color: var(--sic-sky); background: #fff; color: var(--sic-navy); }
.sic2026 .konf-trail button em { font-style: normal; color: var(--sic-grey); max-width: 200px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sic2026 .konf-trail li.current span {
background: var(--sic-navy);
color: #fff;
border-radius: 999px;
padding: 7px 14px;
font-family: var(--sic-font-display);
font-size: 0.8rem;
font-weight: 600;
letter-spacing: 0.04em;
}
.sic2026 .konf-hint { color: var(--sic-grey); font-size: 0.92rem; margin: -10px 0 18px; }
.sic2026 .konf-group {
font-family: var(--sic-font-display);
font-size: 0.78rem;
font-weight: 600;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--sic-grey);
margin: 20px 0 8px;
}
.sic2026 .konf-group:first-of-type { margin-top: 0; }
.sic2026 .option-grid + .konf-group { margin-top: 22px; }
.sic2026 .option-card.selected strong::before { content: "\2713\00a0"; color: var(--sic-navy); }
.sic2026 .konf-nav-hint { align-self: center; color: var(--sic-grey); font-size: 0.85rem; } .sic2026 .konf-preview .konf-parts { list-style: none; padding: 0; margin: 8px 0 0; border-top: 1px solid var(--sic-line); }
.sic2026 .konf-preview .konf-parts li {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 4px;
padding: 8px 0;
border-bottom: 1px solid var(--sic-line);
font-size: 0.88rem;
margin: 0;
color: var(--sic-ink);
}
.sic2026 .konf-preview .konf-parts code {
font-size: 0.72rem;
color: var(--sic-grey);
background: #fff;
border: 1px solid var(--sic-line);
padding: 2px 6px;
border-radius: 4px;
white-space: normal;
font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.sic2026 .konf-preview .konf-parts .konf-parts-empty { color: var(--sic-grey); font-style: italic; border-bottom: 0; } .sic2026 .konf-final h2 { margin-bottom: 6px; }
.sic2026 .konf-final .konf-lead { color: var(--sic-grey); margin: 0 0 6px; }
.sic2026 .konf-final .konf-lead strong { color: var(--sic-navy); }
.sic2026 .konf-check { display: flex; gap: 10px; align-items: flex-start; font-weight: 400 !important; font-size: 0.88rem; color: var(--sic-ink); margin-top: 18px !important; }
.sic2026 .konf-check input { width: auto; margin-top: 4px; }
.sic2026 .konf-final .konf-nav { margin-top: 26px; } .sic2026 .konf-result-visual.has-photo .konf-result-visual-inner { padding: 6px; }
.sic2026 .konf-result-visual img { width: 100%; height: auto; max-height: 340px; object-fit: contain; display: block; }
.sic2026 .konf-thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 10px 0 4px; }
.sic2026 .konf-thumbs figure { margin: 0; background: #fff; border: 1px solid var(--sic-line); border-radius: 6px; padding: 4px; text-align: center; }
.sic2026 .konf-thumbs img { width: 100%; height: 56px; object-fit: contain; display: block; }
.sic2026 .konf-thumbs figcaption { font-size: 0.6rem; color: var(--sic-grey); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: ui-monospace, Menlo, Consolas, monospace; } .sic2026 .option-card.has-img { display: flex; flex-direction: column; align-items: flex-start; }
.sic2026 .option-card.has-img img { width: 100%; height: 110px; object-fit: contain; display: block; margin: -4px 0 8px; background: #fff; border-radius: 6px; }
.sic2026 .konf-result-visual .konf-placeholder { opacity: .9; }
.sic2026 .konf-sketch-badge { display: none; }
@media (max-width: 640px) { .sic2026 .option-card.has-img img { height: 84px; } } .sic2026 .konf-result-visual { position: relative; }
.sic2026 .konf-missing { position: absolute; left: 12px; bottom: 12px; background: #fff3cd; color: #7a5a00; border: 1px solid #ffe08a; border-radius: 6px; padding: 4px 8px; font-size: 0.72rem; font-family: var(--sic-font-display); letter-spacing: .04em; text-transform: uppercase; }
.sic2026 .konf-thumbs figure.is-missing { border-style: dashed; } .sic2026 .konf-form input[type="number"] { width: 100%; padding: 12px 14px; border: 1px solid var(--sic-line); border-radius: 8px; font: inherit; font-size: 1rem; color: var(--sic-ink); background: #fff; }
.sic2026 .konf-form input[type="number"]:focus { outline: none; border-color: var(--sic-sky); box-shadow: 0 0 0 3px rgba(95,168,216,0.2); }  .menu-item.sic-konf-menu-item > a.sic-konf-menu-btn,
.sic-konf-menu-btn { display: inline-block !important; background: #1B3565; color: #fff !important; border-radius: 8px; padding: 8px 16px !important; line-height: 1.3 !important; font-weight: 600; text-transform: none; }
.menu-item.sic-konf-menu-item > a.sic-konf-menu-btn:hover, .sic-konf-menu-btn:hover { background: #12244a; color: #ffffff !important; }
.mobile-sidebar .sic-konf-menu-btn { margin: 8px 20px; } .sic-konf-float { position: fixed; right: 20px; bottom: 20px; z-index: 9990; display: inline-flex; align-items: center; gap: 9px; background: #1B3565; color: #fff !important; text-decoration: none !important; font-family: "Barlow Semi Condensed", "Arial Narrow", sans-serif; font-weight: 600; font-size: 1rem; padding: 12px 18px; border-radius: 999px; box-shadow: 0 8px 24px rgba(27,53,101,0.28); transition: background .15s, transform .15s; }
.sic-konf-float:hover { background: #12244a; color: #ffffff !important; transform: translateY(-1px); }
@media (max-width: 640px) { .sic-konf-float { right: 12px; bottom: 12px; padding: 11px 14px; font-size: .95rem; } } .header-nav li.html .header-cta, .header-nav li.html .header-cta-en { white-space: nowrap; }
.header-nav li.html a.button.sic-hdr-btn { margin-bottom: 0; } .sic2026 .konf-lang-note { margin: 0 0 22px; padding: 12px 16px; border: 1px solid #cfdbe8; border-left: 4px solid #2068a0; border-radius: 8px; background: #eef3f8; color: #3c4a63; max-width: 680px; font-size: .95rem; line-height: 1.5; }
.sic2026 .konf-lang-note a { color: #2068a0; font-weight: 600; text-decoration: underline; } .sic-konf-front-row { margin-top: -14px; margin-bottom: 36px; }  .sic-konf-front-row .col-inner { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.sic-konf-front-row .sic-konf-front-btn { margin: 0; }
.sic2026 .konf-missing.konf-note { background: #eef3f8; color: #3c4a63; border-color: #cfdbe8; }
.sic2026 .konf-beratung { margin-top: 6px; } .sic2026 .sicnav { --nav-card: #ffffff; --nav-soft: #f4f7fb; --nav-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; margin-top: 8px; }
.sic2026 .sicnav [hidden] { display: none !important; }
.sic2026 .sicnav button {
font-family: var(--sic-font-body); font-size: 1rem; font-weight: 400; text-transform: none; letter-spacing: normal;
line-height: 1.3; min-height: 0; margin: 0; max-width: none; text-shadow: none; box-shadow: none; vertical-align: top;
-webkit-appearance: none; appearance: none;
} .sic2026 .sicnav-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin: 0 0 22px; }
.sic2026 .sicnav-path { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 0; }
.sic2026 .sicnav-path li { display: flex; align-items: center; margin: 0; }
.sic2026 .sicnav-path li + li::before { content: ""; width: 12px; height: 2px; background: var(--sic-line); margin: 0 6px 0 0; }
.sic2026 .sicnav-path button {
display: flex; gap: 6px; align-items: baseline; border: 1px solid var(--sic-line); background: #fff; border-radius: 999px;
padding: 6px 12px; font-size: 0.8rem; color: var(--sic-grey); cursor: pointer;
}
.sic2026 .sicnav-path button em { font-style: normal; color: var(--sic-navy); font-weight: 600; max-width: 220px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sic2026 .sicnav-path button:hover { border-color: var(--sic-sky); }
.sic2026 .sicnav-path li.current span { background: var(--sic-navy); color: #fff; border-radius: 999px; padding: 7px 14px; font-family: var(--sic-font-display); font-size: 0.82rem; font-weight: 600; letter-spacing: 0.03em; }
.sic2026 .sicnav-restart { background: none; border: 0; padding: 6px 0; color: var(--sic-grey); font-size: 0.85rem; text-decoration: underline; cursor: pointer; white-space: nowrap; }
.sic2026 .sicnav-restart:hover { color: var(--sic-navy); } .sic2026 .sicnav-grid { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 32px; align-items: start; }
.sic2026 .sicnav.is-summary .sicnav-grid { grid-template-columns: minmax(0, 1fr); }
.sic2026 .sicnav.is-summary .sicnav-side { display: none; } .sic2026 .sicnav-head { margin-bottom: 18px; }
.sic2026 .sicnav-kicker { font-family: var(--sic-font-display); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--sic-sky); margin: 0 0 6px; }
.sic2026 .sicnav-head h2 { margin: 0 0 4px; }
.sic2026 .sicnav-hint { color: var(--sic-grey); font-size: 0.92rem; margin: 4px 0 0; }
.sic2026 .sicnav-sec { font-family: var(--sic-font-display); font-size: 0.95rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--sic-navy); margin: 22px 0 10px; }
.sic2026 .sicnav-sec small { font-family: var(--sic-font-body); font-size: 0.82rem; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--sic-grey); margin-left: 6px; }
.sic2026 .sicnav-head + .sicnav-sec { margin-top: 6px; } .sic2026 .sicnav-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px; }
.sic2026 .sicnav-card {
position: relative; display: flex; flex-direction: column; align-items: stretch; text-align: left; width: 100%;
background: var(--nav-card); border: 1.5px solid var(--sic-line); border-radius: 12px; padding: 0; overflow: hidden; cursor: pointer;
color: var(--sic-ink); transition: border-color .15s, box-shadow .15s, transform .15s;
}
.sic2026 .sicnav-card:hover { border-color: var(--sic-sky); box-shadow: 0 8px 22px rgba(27, 53, 101, 0.10); transform: translateY(-1px); }
.sic2026 .sicnav-card:focus-visible { outline: 3px solid rgba(95, 168, 216, 0.5); outline-offset: 2px; }
.sic2026 .sicnav-card-img { display: flex; align-items: center; justify-content: center; height: 150px; padding: 12px; background: #fff; border-bottom: 1px solid #eef2f7; }
.sic2026 .sicnav-card-img img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; display: block; }
.sic2026 .sicnav-card.no-img .sicnav-card-img { display: none; }
.sic2026 .sicnav-card.is-group .sicnav-card-img { height: 170px; }
.sic2026 .sicnav-card-body { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px 14px; flex: 1; }
.sic2026 .sicnav-card-name { font-family: var(--sic-font-display); font-size: 1.08rem; font-weight: 600; color: var(--sic-navy); line-height: 1.2; padding-right: 22px; }
.sic2026 .sicnav-card-art { align-self: flex-start; font-family: var(--nav-mono); font-size: 0.76rem; color: var(--sic-grey); background: var(--nav-soft); border-radius: 6px; padding: 2px 7px; }
.sic2026 .sicnav-card-tick { position: absolute; top: 10px; right: 10px; width: 24px; height: 24px; border-radius: 50%; background: var(--sic-navy); opacity: 0; transform: scale(.6); transition: opacity .15s, transform .15s; }
.sic2026 .sicnav-card-tick::after { content: ""; position: absolute; left: 8px; top: 4px; width: 6px; height: 11px; border: solid #fff; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.sic2026 .sicnav-card.is-check .sicnav-card-tick, .sic2026 .sicnav-card.is-radio .sicnav-card-tick { opacity: 1; transform: none; background: #fff; border: 2px solid #b8c6d8; }
.sic2026 .sicnav-card.is-check .sicnav-card-tick { border-radius: 6px; }
.sic2026 .sicnav-card.is-check .sicnav-card-tick::after, .sic2026 .sicnav-card.is-radio .sicnav-card-tick::after { display: none; }
.sic2026 .sicnav-card.is-selected { border-color: var(--sic-navy); box-shadow: 0 0 0 1.5px var(--sic-navy) inset, 0 8px 22px rgba(27, 53, 101, 0.10); }
.sic2026 .sicnav-card.is-selected .sicnav-card-tick { opacity: 1; transform: none; background: var(--sic-navy); border-color: var(--sic-navy); }
.sic2026 .sicnav-card.is-selected .sicnav-card-tick::after { display: block; } .sic2026 .sicnav-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 26px; flex-wrap: wrap; }
.sic2026 .sicnav-btn { display: inline-block; font-family: var(--sic-font-display); font-weight: 600; font-size: 1.02rem; border-radius: 8px; padding: 12px 22px; border: 2px solid transparent; cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
.sic2026 .sicnav .sicnav-btn { font-family: var(--sic-font-display); font-weight: 600; font-size: 1.02rem; line-height: 1.3; }
.sic2026 .sicnav-btn-primary { background: var(--sic-navy); color: #fff; }
.sic2026 .sicnav-btn-primary:hover { background: var(--sic-navy-dark); color: #fff; }
.sic2026 .sicnav-btn-ghost { background: transparent; border-color: var(--sic-navy); color: var(--sic-navy); }
.sic2026 .sicnav-btn-ghost:hover { background: var(--sic-navy); color: #fff; }
.sic2026 .sicnav-btn[disabled] { opacity: 0.45; cursor: not-allowed; }
.sic2026 .sicnav-btn[disabled]:hover { background: transparent; color: var(--sic-navy); }
.sic2026 .sicnav-btn-primary[disabled]:hover { background: var(--sic-navy); color: #fff; }
.sic2026 .sicnav-auto { color: var(--sic-grey); font-size: 0.85rem; } .sic2026 .sicnav-side { position: sticky; top: 100px; background: #fff; border: 1px solid var(--sic-line); border-radius: 14px; box-shadow: 0 10px 30px rgba(27, 53, 101, 0.08); overflow: hidden; }
.sic2026 .sicnav-side-head { display: flex; width: 100%; justify-content: space-between; align-items: baseline; gap: 8px; background: var(--nav-soft); border: 0; border-bottom: 1px solid var(--sic-line); padding: 12px 18px; cursor: default; text-align: left; }
.sic2026 .sicnav-side-label { font-family: var(--sic-font-display); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--sic-sky); }
.sic2026 .sicnav-count { font-size: 0.8rem; color: var(--sic-grey); }
.sic2026 .sicnav-side-body { padding: 16px 18px 18px; }
.sic2026 .sicnav-visual { background: #fff; border: 1px solid #eef2f7; border-radius: 10px; padding: 8px; margin-bottom: 12px; }
.sic2026 .sicnav-visual img { display: block; width: 100%; height: auto; max-height: 300px; object-fit: contain; }
.sic2026 .sicnav-prod { font-size: 1.05rem; margin: 0 0 8px; }
.sic2026 .sicnav-list, .sic2026 .sicnav-ov-list { list-style: none; margin: 0; padding: 0; }
.sic2026 .sicnav-item, .sic2026 .sicnav-ov-item { display: grid; grid-template-columns: 40px 1fr; grid-template-rows: auto auto; column-gap: 10px; align-items: center; padding: 7px 0; border-bottom: 1px solid #eef2f7; margin: 0; font-size: 0.9rem; line-height: 1.3; }
.sic2026 .sicnav-item img, .sic2026 .sicnav-item .sicnav-nothumb { grid-row: span 2; width: 40px; height: 40px; object-fit: contain; background: #fff; border: 1px solid #eef2f7; border-radius: 6px; }
.sic2026 .sicnav-item .sicnav-nothumb { background: var(--nav-soft); }
.sic2026 .sicnav-pname { color: var(--sic-ink); }
.sic2026 .sicnav-item code, .sic2026 .sicnav-ov-item code { font-family: var(--nav-mono); font-size: 0.74rem; color: var(--sic-grey); background: none; padding: 0; }
.sic2026 .sicnav-empty { color: var(--sic-grey); font-style: italic; font-size: 0.9rem; }
.sic2026 .sicnav-note { font-size: 0.8rem; color: var(--sic-grey); margin: 12px 0 0; } .sic2026 .sicnav-summary { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: start; }
.sic2026 .sicnav-overview { background: #fff; border: 1px solid var(--sic-line); border-radius: 14px; padding: 22px; box-shadow: 0 10px 30px rgba(27, 53, 101, 0.06); }
.sic2026 .sicnav-overview h2 { font-size: clamp(1.3rem, 2.4vw, 1.7rem); margin: 0 0 12px; }
.sic2026 .sicnav-ov-img { border: 1px solid #eef2f7; border-radius: 10px; padding: 8px; margin-bottom: 12px; }
.sic2026 .sicnav-ov-img img { display: block; width: 100%; height: auto; max-height: 320px; object-fit: contain; }
.sic2026 .sicnav-ov-item { grid-template-columns: 56px 1fr; font-size: 0.95rem; }
.sic2026 .sicnav-ov-item img, .sic2026 .sicnav-ov-item .sicnav-nothumb { grid-row: span 2; width: 56px; height: 56px; object-fit: contain; border: 1px solid #eef2f7; border-radius: 8px; background: #fff; }
.sic2026 .sicnav-ov-item .sicnav-nothumb { background: var(--nav-soft); }
.sic2026 .sicnav-form h2 { font-size: clamp(1.3rem, 2.4vw, 1.7rem); margin: 0 0 6px; }
.sic2026 .sicnav-lead { color: var(--sic-grey); font-size: 0.92rem; margin: 0 0 6px; }
.sic2026 .sicnav-form input[type="number"] { width: 100%; padding: 12px 14px; border: 1px solid var(--sic-line); border-radius: 8px; font-family: var(--sic-font-body); font-size: 1rem; background: #fff; box-shadow: none; height: auto; }
.sic2026 .sicnav-form input[type="number"]:focus { border-color: var(--sic-sky); outline: none; box-shadow: 0 0 0 3px rgba(95,168,216,0.25); }
.sic2026 .sicnav-form .konf-check { font-weight: 400; color: var(--sic-ink); font-size: 0.9rem; }
@media (max-width: 980px) {
.sic2026 .sicnav-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
.sic2026 .sicnav-side { position: static; order: -1; }
.sic2026 .sicnav-side-head { cursor: pointer; }
.sic2026 .sicnav-side-head::after { content: "▾"; color: var(--sic-navy); margin-left: auto; transition: transform .15s; }
.sic2026 .sicnav.side-open .sicnav-side-head::after { transform: rotate(180deg); }
.sic2026 .sicnav-side-body { display: none; }
.sic2026 .sicnav.side-open .sicnav-side-body { display: block; }
.sic2026 .sicnav-summary { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 620px) {
.sic2026 .sicnav-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.sic2026 .sicnav-card-img, .sic2026 .sicnav-card.is-group .sicnav-card-img { height: 110px; padding: 8px; }
.sic2026 .sicnav-card-body { padding: 10px 10px 12px; }
.sic2026 .sicnav-card-name { font-size: 0.98rem; }
.sic2026 .sicnav-top { flex-direction: column; }
.sic2026 .sicnav-actions .sicnav-btn { flex: 1 1 auto; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
.sic2026 .sicnav-card, .sic2026 .sicnav-card-tick { transition: none; }
.sic2026 .sicnav-card:hover { transform: none; }
}
.sic2026 .sicnav-sub { color: var(--sic-grey); font-size: 0.9rem; margin: -8px 0 14px; } .sic2026 .sicnav-topbar { display: flex; align-items: center; justify-content: space-between; gap: 8px 16px; flex-wrap: wrap; margin: 0 0 16px; }
.sic2026 .sicnav .sicnav-back { font-size: 0.95rem; padding: 8px 16px 8px 14px; border-width: 1.5px; }
.sic2026 .sicnav-topbar .sicnav-auto { margin-left: auto; }
.sic2026 .sicnav-actions-end { justify-content: flex-end; }
.sic2026 .sicnav-sumbar { grid-column: 1 / -1; margin-bottom: 0; }
@media (max-width: 620px) {
.sic2026 .sicnav-topbar .sicnav-auto { margin-left: 0; flex-basis: 100%; }
}