.solutions-showcase { gap:5vw; grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr); align-items:center; min-height:100svh; padding-top:85px; padding-bottom:85px; }
.solutions-showcase .solutions-copy { position:static; }
.solutions-showcase .solutions-copy h2 { font-size:clamp(2.6rem,3.8vw,4.5rem); }
.solution-explorer { min-width:0; }
.solution-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; padding:5px; margin-bottom:22px; border:1px solid #243654; border-radius:12px; background:#0d1e39; }
.solution-tabs button { min-width:0; display:flex; align-items:center; justify-content:center; gap:7px; padding:13px 4px; border:0; border-radius:8px; background:transparent; color:#96abc9; cursor:pointer; font-size:.73rem; font-weight:600; transition:background .2s,color .2s; }
.solution-tabs button:hover { color:#fff; background:#172d4e; }
.solution-tabs button[aria-selected="true"] { color:#fff; background:#1769ee; box-shadow:0 4px 14px #00163844; }
.solution-tabs .ui-icon { width:16px; height:16px; flex-shrink:0; }
.solution-tabs button:focus-visible,.solution-panel:focus-visible { outline:2px solid #a4caff; outline-offset:4px; }
.solution-panel[hidden] { display:none; }
.solution-panel:not([hidden]) .solution-window { animation:solution-visual-enter 420ms cubic-bezier(.22,1,.36,1) both; }
.solution-panel:not([hidden]) .solution-explanation { animation:solution-copy-enter 360ms ease-out 60ms both; }
@keyframes solution-visual-enter {
  from { opacity:0; transform:translateY(8px); }
  to { opacity:1; transform:translateY(0); }
}
@keyframes solution-copy-enter {
  from { opacity:0; transform:translateY(4px); }
  to { opacity:1; transform:translateY(0); }
}
.solution-window { border:1px solid #ccd9ed; border-radius:13px; overflow:hidden; color:#173057; background:#f3f6fc; box-shadow:0 25px 55px #0003; }
.solution-window-top { height:61px; padding:0 20px; display:flex; align-items:center; gap:11px; background:#fff; border-bottom:1px solid #dfe7f3; }
.solution-mark { display:grid; place-items:center; width:29px; height:29px; border-radius:7px; color:#fff; background:#1769ee; font-weight:800; }
.solution-window-top > div { display:grid; gap:4px; }
.solution-window-top strong { font-size:.75rem; }
.solution-window-top small { font-size:.6rem; color:#8191aa; }
.example-tag { margin-left:auto; color:#8390a5; font-size:.55rem; white-space:nowrap; }
.solution-explanation { position:relative; padding-top:25px; min-height:192px; }
.solution-index { position:absolute; right:0; top:30px; color:#6c91c3; font-size:.62rem; letter-spacing:.1em; }
.solution-explanation h3 { margin:0 65px 12px 0; font-size:1.25rem; letter-spacing:-.025em; }
.solution-explanation p { margin:0; color:#a8b8d0; font-size:.85rem; line-height:1.7; max-width:600px; }
.solution-explanation ul { display:flex; flex-wrap:wrap; gap:8px; padding:0; margin:18px 0 0; list-style:none; }
.solution-explanation li { padding:6px 10px; color:#b9d4fc; background:#122847; border:1px solid #263f60; border-radius:5px; font-size:.62rem; }
.planner-preview,.budget-preview,.labels-preview,.certificate-preview { height:285px; padding:22px; }
.planner-week { display:flex; justify-content:space-between; align-items:center; margin-bottom:17px; }
.planner-week strong { font-size:.72rem; }
.planner-week > span { font-size:.58rem; color:#6c82a0; }
.planner-grid { display:grid; grid-template-columns:1.9fr repeat(5,1fr); border:1px solid #dfe7f3; border-radius:8px; overflow:hidden; background:#fff; }
.planner-grid > b { padding:9px 0; text-align:center; font-size:.55rem; color:#7c8ea7; border-left:1px solid #e9eef6; }
.planner-grid > b span { display:block; margin-top:3px; color:#173057; font-size:.8rem; }
.planner-corner { align-self:center; padding-left:10px; color:#8393aa; font-size:.5rem; }
.planner-job { height:49px; display:flex; flex-direction:column; justify-content:center; gap:5px; padding-left:10px; border-top:1px solid #e9eef6; font-size:.58rem; font-weight:600; }
.planner-job small { color:#8393aa; font-size:.48rem; font-weight:400; }
.planner-track { grid-column:span 5; display:grid; grid-template-columns:repeat(5,1fr); align-items:center; border-top:1px solid #e9eef6; background:repeating-linear-gradient(90deg,#e9eef6 0 1px,transparent 1px 20%); }
.planner-bar { grid-column:var(--start) / span var(--span); margin:0 3px; padding:8px 6px; border-radius:5px; white-space:nowrap; font-size:.5rem; font-weight:600; }
.bar-blue { color:#2467d4; background:#e4eeff; border-left:3px solid #3479fa; }
.bar-purple { color:#7250c8; background:#eee8ff; border-left:3px solid #8260ec; }
.bar-green { color:#0b8762; background:#def6eb; border-left:3px solid #10af7e; }
.preview-legend { display:flex; justify-content:flex-end; gap:14px; margin-top:12px; font-size:.5rem; color:#8292aa; }
.preview-legend span { display:flex; align-items:center; gap:5px; }
.preview-legend i { width:5px; height:5px; border-radius:2px; }
.blue-dot { background:#3479fa; }.purple-dot { background:#8260ec; }.green-dot { background:#10af7e; }
.budget-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.budget-summary > div { padding:13px 10px; background:#fff; border:1px solid #dfe7f3; border-radius:8px; display:grid; gap:8px; }
.budget-summary span { font-size:.6rem; color:#7f90aa; }
.budget-summary strong { font-size:clamp(.8rem,1.2vw,1.2rem); letter-spacing:-.04em; }
.budget-summary > div:last-child strong { color:#0a9a71; }
.budget-consumption { display:flex; justify-content:space-between; font-size:.6rem; margin:20px 0 8px; }
.budget-consumption strong { color:#1769ee; }
.budget-meter { height:7px; background:#e0e9f7; border-radius:5px; overflow:hidden; }
.budget-meter span { display:block; height:100%; width:65%; background:#3479fa; border-radius:5px; }
.budget-row { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:7px; padding:12px 0; border-bottom:1px solid #dfe7f3; font-size:.61rem; }
.budget-row > :not(:first-child) { text-align:right; }
.budget-table-head { font-size:.48rem; color:#8393aa; margin-top:8px; }
.labels-preview { position:relative; display:grid; place-content:center; background:radial-gradient(#d8e2f2 1px,transparent 1px) 0 0 / 12px 12px; }
.asset-label { position:relative; z-index:2; width:325px; padding:20px; background:#fff; border:1px solid #ccd8e9; border-radius:6px; box-shadow:0 10px 25px #253e611a; transform:rotate(-3deg); }
.label-brand { display:flex; justify-content:space-between; align-items:center; font-size:.78rem; font-weight:800; letter-spacing:.1em; border-bottom:1px solid #e0e6f0; padding-bottom:11px; }
.label-brand span { font-size:.5rem; color:#8496ad; }
.label-detail { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px; }
.label-detail > div { display:grid; gap:7px; }
.label-detail span { color:#1769ee; font-size:.53rem; font-weight:700; }
.label-detail strong { font-size:.8rem; }
.label-detail p { margin:0; font-size:.58rem; line-height:1.5; color:#8090a5; }
.label-detail svg { width:78px; height:78px; flex-shrink:0; }
.label-footer { margin-top:12px; padding-top:9px; border-top:1px solid #e0e6f0; font-size:.42rem; letter-spacing:.08em; color:#8292aa; }
.label-sheet { position:absolute; z-index:1; width:290px; height:175px; background:#fff; border:1px solid #d4deeb; border-radius:5px; left:50%; top:37px; transform:translateX(-44%) rotate(5deg); }
.label-note { text-align:center; font-size:.58rem; color:#71849e; margin:18px 0 0; z-index:2; }
.certificate-preview { display:flex; justify-content:center; padding:19px 30px 0; overflow:hidden; background:#eaf0f9; }
.certificate-paper { width:350px; background:#fff; padding:23px 26px; border:1px solid #d5dfed; box-shadow:0 12px 30px #152e5112; }
.certificate-brand { display:flex; align-items:center; justify-content:space-between; padding-bottom:13px; border-bottom:2px solid #1769ee; }
.certificate-brand strong { font-size:.7rem; letter-spacing:.1em; }
.certificate-brand span { font-size:.44rem; color:#8999b0; }
.certificate-paper h4 { margin:17px 0 5px; font-size:.86rem; }
.certificate-paper > p { margin:0; color:#8392a9; font-size:.54rem; }
.certificate-fields { display:grid; gap:10px; margin-top:18px; }
.certificate-fields > div { display:grid; gap:3px; }
.certificate-fields span { color:#91a0b5; font-size:.42rem; letter-spacing:.07em; }
.certificate-fields strong { font-size:.56rem; font-weight:500; }
.certificate-bottom { margin-top:16px; padding-top:12px; border-top:1px solid #e6ecf4; display:flex; justify-content:space-between; gap:8px; color:#8999ae; font-size:.4rem; }
.document-badge { color:#16966f; }
@media (max-width:1100px) {
  .solutions-showcase { grid-template-columns:minmax(0,1fr); gap:40px; }
  .solutions-showcase .solutions-copy { max-width:680px; }
  .solution-explorer { width:100%; max-width:760px; }
}
@media (max-width:600px) {
  .solutions-showcase { padding-top:70px; padding-bottom:65px; gap:30px; }
  .solution-tabs { gap:2px; margin-bottom:16px; }
  .solution-tabs button { flex-direction:column; gap:7px; padding:10px 1px; font-size:.58rem; }
  .solution-window-top { padding:0 12px; gap:8px; height:56px; }
  .solution-window-top strong { font-size:.65rem; }
  .solution-window-top small { font-size:.52rem; }
  .example-tag { font-size:.43rem; }
  .solution-mark { width:24px; height:24px; font-size:.85rem; }
  .planner-preview,.budget-preview,.labels-preview,.certificate-preview { height:285px; padding:16px 10px; }
  .planner-grid { grid-template-columns:1.8fr repeat(5,1fr); }
  .planner-job { font-size:.46rem; padding-left:5px; }
  .planner-job small { font-size:.38rem; }
  .planner-bar { font-size:.37rem; padding:7px 2px; margin:0 2px; }
  .planner-week strong { font-size:.6rem; }
  .planner-week > span { font-size:.48rem; }
  .preview-legend { gap:8px; font-size:.43rem; }
  .budget-summary { gap:5px; }
  .budget-summary > div { padding:11px 6px; }
  .budget-summary span { font-size:.5rem; }
  .budget-summary strong { font-size:.78rem; }
  .budget-row { font-size:.5rem; }
  .budget-table-head { font-size:.4rem; }
  .asset-label { width:min(285px,100%); padding:15px; }
  .label-detail svg { width:65px; height:65px; }
  .label-sheet { width:240px; }
  .certificate-paper { padding:17px; }
  .solution-explanation { min-height:220px; }
  .solution-explanation h3 { font-size:1.12rem; }
  .solution-explanation p { font-size:.81rem; }
}
@media (prefers-reduced-motion:reduce) {
  .solution-tabs button { transition:none; }
  .solution-panel:not([hidden]) .solution-window,
  .solution-panel:not([hidden]) .solution-explanation { animation:none; }
}
