.puzzle-hero,
.puzzle-intro,
.puzzle-mode,
.preset-selector,
.puzzle-workspace,
.solutions-showcase {
    width: min(100%, 1560px);
    margin-inline: auto;
}

.puzzle-hero {
    min-height: min(820px, calc(100vh - 86px));
    padding: clamp(64px, 8vw, 130px) clamp(20px, 5vw, 78px);
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(400px, .98fr);
    gap: clamp(46px, 7vw, 120px);
    align-items: center;
    position: relative;
    isolation: isolate;
}

.puzzle-hero::before,
.puzzle-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    pointer-events: none;
    border-radius: 999px;
    filter: blur(90px);
}

.puzzle-hero::before {
    width: 420px;
    height: 420px;
    right: -120px;
    top: 40px;
    background: color-mix(in srgb, var(--accent) 20%, transparent);
}

.puzzle-hero::after {
    width: 310px;
    height: 310px;
    left: 30%;
    bottom: 20px;
    background: color-mix(in srgb, var(--signal) 13%, transparent);
}

.puzzle-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--accent);
    font-size: 11px;
    line-height: 1.3;
    font-weight: 950;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.puzzle-kicker i,
.summary-head i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--signal);
    box-shadow: 0 0 0 7px color-mix(in srgb, var(--signal) 14%, transparent);
    animation: puzzlePulse 1.8s infinite;
}

.puzzle-hero h1 {
    max-width: 840px;
    margin: 24px 0 28px;
    font-size: clamp(60px, 7.6vw, 126px);
    line-height: .84;
    letter-spacing: -.075em;
}

.puzzle-hero h1 em {
    color: var(--accent);
    font-style: normal;
}

.puzzle-hero__copy > p {
    max-width: 720px;
    color: var(--muted);
    font-size: clamp(18px, 1.5vw, 23px);
}

.puzzle-hero__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 34px;
}

.puzzle-text-link {
    font-size: 13px;
    font-weight: 900;
}

.puzzle-text-link span { color: var(--accent); }

.puzzle-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 18px 28px;
    padding: 0;
    margin: 46px 0 0;
    list-style: none;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.puzzle-trust li { display: flex; align-items: center; gap: 8px; }
.puzzle-trust svg { width: 20px; height: 20px; padding: 4px; border-radius: 7px; background: var(--accent-soft); stroke: var(--accent); fill: none; stroke-width: 2.2; }

.puzzle-hero__visual { position: relative; min-height: 520px; }

.puzzle-assembly {
    position: absolute;
    inset: 25px 30px 75px 20px;
    border-radius: 42px;
    background: var(--ink);
    box-shadow: 0 45px 110px rgba(16,17,24,.28);
    transform: rotate(2deg);
    overflow: hidden;
}

.puzzle-assembly::before {
    content: "";
    position: absolute;
    width: 330px;
    height: 330px;
    right: -120px;
    bottom: -120px;
    border: 85px solid var(--accent);
    border-radius: 50%;
    opacity: .34;
}

.puzzle-sheet {
    position: absolute;
    inset: 100px 75px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 34px;
    color: var(--ink);
    border-radius: 24px;
    background: linear-gradient(145deg, var(--signal), #fff 54%, var(--accent-soft));
    transform: rotate(-6deg);
    box-shadow: 0 25px 65px rgba(0,0,0,.3);
}

.puzzle-sheet b { font-size: clamp(28px, 4vw, 58px); line-height: .9; letter-spacing: -.055em; }
.puzzle-sheet small { margin-top: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .11em; }

.puzzle-piece {
    position: absolute;
    z-index: 2;
    width: 74px;
    height: 74px;
    border-radius: 16px;
    background: var(--accent);
    box-shadow: 0 14px 35px rgba(0,0,0,.22);
}

.puzzle-piece::before,
.puzzle-piece::after { content: ""; position: absolute; width: 24px; height: 24px; border-radius: 50%; background: inherit; }
.puzzle-piece::before { right: -9px; top: 25px; }
.puzzle-piece::after { left: 25px; bottom: -9px; }
.puzzle-piece.p1 { left: 34px; top: 34px; transform: rotate(-11deg); }
.puzzle-piece.p2 { right: 45px; top: 50px; background: var(--signal); transform: rotate(16deg); }
.puzzle-piece.p3 { left: 55px; bottom: 46px; background: #fff; transform: rotate(8deg); }
.puzzle-piece.p4 { right: 55px; bottom: 40px; background: var(--accent-soft); transform: rotate(-18deg); }

.live-card {
    position: absolute;
    z-index: 4;
    right: 0;
    bottom: 10px;
    width: min(310px, 76%);
    padding: 22px;
    color: var(--ink);
    border: 1px solid rgba(16,17,24,.1);
    border-radius: 22px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 24px 70px rgba(16,17,24,.18);
    backdrop-filter: blur(16px);
}

.live-card > span { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: 10px; font-weight: 950; letter-spacing: .11em; text-transform: uppercase; }
.live-card > span i { width: 7px; height: 7px; border-radius: 50%; background: var(--ok); }
.live-card strong { display: block; margin: 10px 0 3px; font-size: 30px; letter-spacing: -.04em; }
.live-card small { color: var(--muted); }

.puzzle-intro {
    display: grid;
    grid-template-columns: minmax(0,1.2fr) minmax(300px,.8fr);
    gap: clamp(35px, 7vw, 110px);
    align-items: end;
    padding: clamp(76px, 9vw, 128px) clamp(20px, 5vw, 78px) 42px;
    border-top: 1px solid var(--line);
}

.puzzle-intro h2 { max-width: 840px; margin-top: 18px; font-size: clamp(38px, 5vw, 72px); }
.puzzle-intro > p { color: var(--muted); font-size: 17px; }

.puzzle-mode {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 0 clamp(20px, 5vw, 78px) 34px;
}

.puzzle-mode button {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 3px 14px;
    padding: 22px;
    text-align: left;
    color: var(--ink);
    border: 1px solid var(--line);
    border-radius: 20px;
    background: rgba(255,255,255,.7);
    cursor: pointer;
    transition: .22s;
}

.puzzle-mode button > span { grid-row: 1/3; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--accent-soft); color: var(--accent); font-size: 11px; font-weight: 950; }
.puzzle-mode button b { font-size: 15px; }
.puzzle-mode button small { color: var(--muted); }
.puzzle-mode button:hover,
.puzzle-mode button.is-active { color: #fff; border-color: var(--ink); background: var(--ink); transform: translateY(-2px); }
.puzzle-mode button.is-active small { color: #bfc3ce; }

.preset-selector {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 14px;
    padding: 0 clamp(20px, 5vw, 78px) 38px;
}

.preset-selector[hidden] { display: none !important; }
.preset-card { min-height: 220px; padding: 24px; text-align: left; border: 1px solid var(--line); border-radius: 22px; background: #fff; cursor: pointer; transition: .23s; }
.preset-card:hover,
.preset-card.is-selected { border-color: var(--accent); box-shadow: inset 0 0 0 2px var(--accent), 0 18px 50px rgba(16,17,24,.09); transform: translateY(-3px); }
.preset-card__number { display: block; color: var(--accent); font-size: 11px; font-weight: 950; }
.preset-card b { display: block; margin-top: 35px; font-size: 22px; letter-spacing: -.03em; }
.preset-card p { min-height: 43px; color: var(--muted); font-size: 13px; }
.preset-card__cta { color: var(--accent); font-size: 11px; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; }
.preset-card__cta i { font-style: normal; }
.preset-unlock { grid-column: 1/-1; justify-self: end; padding: 10px 15px; color: var(--accent); border: 0; background: none; font-weight: 900; cursor: pointer; }

.puzzle-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 430px;
    gap: 26px;
    align-items: start;
    padding: 0 clamp(20px, 5vw, 78px) clamp(88px, 9vw, 140px);
}

.puzzle-form { display: grid; gap: 18px; min-width: 0; }
.config-module { padding: clamp(25px, 4vw, 46px); border: 1px solid var(--line); border-radius: 28px; background: #fff; box-shadow: 0 20px 60px rgba(16,17,24,.055); transition: opacity .25s; }
.config-module > header { display: grid; grid-template-columns: 48px 1fr; gap: 18px; margin-bottom: 28px; }
.module-index { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 16px; color: var(--accent); background: var(--accent-soft); font-size: 12px; font-weight: 950; }
.module-overline { color: var(--accent); font-size: 10px; font-weight: 950; letter-spacing: .14em; text-transform: uppercase; }
.config-module h2 { margin: 8px 0 12px; font-size: clamp(27px, 3vw, 43px); line-height: 1; }
.config-module header p { max-width: 780px; margin: 0; color: var(--muted); font-size: 14px; }

.puzzle-form.is-preset .config-module:not(.module-quantity):not(.contact-module):not(.is-unlocked) .option-grid,
.puzzle-form.is-preset .config-module:not(.module-quantity):not(.contact-module):not(.is-unlocked) .switch-option,
.puzzle-form.is-preset .config-module:not(.module-quantity):not(.contact-module):not(.is-unlocked) .delivery-fields { pointer-events: none; opacity: .58; filter: grayscale(.25); }

.quantity-control { padding: 25px; border-radius: 20px; background: #f5f6fa; }
.quantity-control > div:first-child { display: flex; justify-content: space-between; gap: 20px; align-items: end; }
.quantity-control label { color: var(--muted); font-size: 12px; font-weight: 850; }
.quantity-control output { color: var(--accent); font-size: clamp(28px, 4vw, 48px); font-weight: 950; letter-spacing: -.05em; }
.quantity-control input[type="range"] { width: 100%; margin: 28px 0 7px; accent-color: var(--accent); }
.quantity-scale { display: flex; justify-content: space-between; color: var(--muted); font-size: 10px; }
.quantity-number { display: flex; justify-content: flex-end; align-items: center; gap: 12px; margin-top: 22px; }
.quantity-number input { width: 175px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: #fff; font-weight: 900; }
.quantity-number input:focus { outline: 2px solid var(--accent); border-color: var(--accent); }

.option-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.option-grid--dies { grid-template-columns: repeat(3, minmax(0,1fr)); }
.tech-option { position: relative; display: grid; grid-template-columns: 45px 1fr; grid-template-rows: auto auto; gap: 3px 14px; min-height: 98px; align-content: center; padding: 17px; border: 1px solid var(--line); border-radius: 17px; cursor: pointer; overflow: hidden; transition: .2s; }
.tech-option:hover { border-color: var(--accent); transform: translateY(-2px); }
.tech-option > input { position: absolute; opacity: 0; pointer-events: none; }
.tech-option > b { align-self: end; font-size: 14px; }
.tech-option > small { color: var(--muted); font-size: 11px; }
.tech-option > i:last-child { position: absolute; right: 13px; top: 13px; width: 16px; height: 16px; border: 1px solid var(--line); border-radius: 50%; background: #fff; }
.tech-option > input:checked ~ i:last-child { border: 5px solid var(--accent); }
.tech-option:has(input:checked) { border-color: var(--accent); background: color-mix(in srgb, var(--accent-soft) 58%, #fff); box-shadow: inset 0 0 0 1px var(--accent); }
.tech-option__icon,
.paper-swatch,
.board-swatch,
.bag-icon,
.box-icon { grid-row: 1/3; display: grid; place-items: center; width: 45px; height: 45px; border-radius: 13px; color: var(--accent); background: var(--accent-soft); font-size: 11px; font-weight: 950; }
.paper-swatch { background: repeating-linear-gradient(135deg,#fff 0 5px,#e9e9e4 5px 6px); border: 1px solid #d8d8d2; }
.paper-swatch.is-canvas { background: repeating-linear-gradient(45deg,#f7f4ec 0 3px,#ddd6c6 3px 4px); }
.paper-swatch.is-gloss { box-shadow: inset -14px 0 16px rgba(255,255,255,.8); }
.board-swatch { position: relative; background: #a9a7a1; }
.board-swatch.is-blue { background: #6b8fa9; }
.board-swatch i { width: 34px; height: 5px; background: rgba(255,255,255,.55); border-radius: 99px; }
.bag-icon::before { content: ""; width: 24px; height: 28px; border: 2px solid currentColor; border-radius: 3px 3px 8px 8px; }
.box-icon::before { content: ""; width: 25px; height: 20px; border: 2px solid currentColor; box-shadow: 6px -6px 0 -2px var(--accent-soft), 6px -6px 0 0 currentColor; }

.switch-option { display: flex; align-items: center; gap: 15px; margin-top: 14px; padding: 18px; border: 1px solid var(--line); border-radius: 16px; cursor: pointer; }
.switch-option > input { position: absolute; opacity: 0; }
.switch-option > span { position: relative; flex: 0 0 48px; height: 27px; border-radius: 99px; background: #c7c9d0; transition: .2s; }
.switch-option > span::after { content: ""; position: absolute; left: 4px; top: 4px; width: 19px; height: 19px; border-radius: 50%; background: #fff; transition: .2s; }
.switch-option > input:checked + span { background: var(--accent); }
.switch-option > input:checked + span::after { transform: translateX(21px); }
.switch-option b,
.switch-option small { display: block; }
.switch-option small { color: var(--muted); }

.knowledge-tip { display: flex; gap: 14px; margin-top: 20px; padding: 16px; border-radius: 15px; background: #f3f4f7; color: var(--muted); font-size: 12px; }
.knowledge-tip > span { display: grid; place-items: center; flex: 0 0 27px; height: 27px; color: var(--accent); border: 1px solid var(--accent); border-radius: 50%; font-weight: 950; }
.knowledge-tip b { color: var(--ink); }
.knowledge-tip p { margin: 3px 0; }
.knowledge-tip a { color: var(--accent); font-weight: 850; }
.knowledge-tip--warning { background: #fff6db; color: #685922; }

.module-note { margin-top: 18px; padding-top: 15px; border-top: 1px solid var(--line); }
.module-note summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; color: var(--muted); cursor: pointer; list-style: none; font-size: 11px; font-weight: 900; }
.module-note summary::-webkit-details-marker { display: none; }
.module-note summary span { display: grid; place-items: center; flex: 0 0 25px; height: 25px; color: var(--accent); border: 1px solid var(--accent); border-radius: 50%; transition: transform .2s; }
.module-note[open] summary span { transform: rotate(45deg); }
.module-note label { display: block; margin-top: 13px; }
.module-note label > span { display: block; margin-bottom: 7px; color: var(--muted); font-size: 10px; }
.module-note textarea { width: 100%; min-height: 92px; padding: 13px 14px; color: var(--ink); border: 1px solid var(--line); border-radius: 13px; background: #fff; resize: vertical; }
.module-note textarea:focus { outline: 2px solid var(--accent); border-color: var(--accent); }

.process-visual { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; padding: 28px; border-radius: 20px; background: #f5f6fa; }
.process-visual > i,
.process-visual > b { font-style: normal; color: var(--muted); }
.layer { padding: 13px 15px; border-radius: 10px; color: #fff; background: var(--accent); font-size: 11px; font-weight: 900; }
.layer-board { background: #8a8881; }
.layer-reverse { background: var(--accent-2); }
.layer-ready { color: var(--ink); background: var(--signal); }
.auto-value { display: flex; align-items: baseline; justify-content: flex-end; gap: 10px; margin-top: 18px; color: var(--muted); }
.auto-value span { padding: 5px 8px; color: var(--accent); border-radius: 8px; background: var(--accent-soft); font-size: 9px; font-weight: 950; text-transform: uppercase; }
.auto-value strong { color: var(--ink); font-size: 28px; }
.metric-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.metric-grid > div { padding: 20px; border-radius: 16px; background: #f5f6fa; }
.metric-grid span,
.metric-grid strong { display: block; }
.metric-grid span { color: var(--muted); font-size: 11px; }
.metric-grid strong { margin-top: 8px; font-size: 25px; }

.delivery-fields { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-top: 18px; }
.delivery-fields label { color: var(--muted); font-size: 11px; font-weight: 850; }
.delivery-fields input,
.delivery-fields select { display: block; width: 100%; margin-top: 7px; padding: 13px 14px; color: var(--ink); border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.delivery-fields input:focus,
.delivery-fields select:focus { outline: 2px solid var(--accent); border-color: var(--accent); }

.contact-module { border-style: dashed; }
.contact-module .delivery-fields { grid-template-columns: 1fr 1fr; }

.puzzle-summary { position: sticky; top: 104px; padding: 27px; color: #fff; border-radius: 28px; background: var(--ink); box-shadow: 0 35px 90px rgba(16,17,24,.25); overflow: hidden; }
.puzzle-summary::after { content: ""; position: absolute; z-index: 0; right: -120px; bottom: -170px; width: 300px; height: 300px; border: 78px solid var(--accent); border-radius: 50%; opacity: .2; pointer-events: none; }
.puzzle-summary > * { position: relative; z-index: 1; }
.summary-head { display: flex; justify-content: space-between; align-items: center; padding-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,.14); font-size: 10px; font-weight: 950; letter-spacing: .12em; text-transform: uppercase; }
.summary-head > span { display: flex; align-items: center; gap: 9px; }
.summary-head > b { color: var(--signal); }
.summary-price { padding: 22px 0; }
.summary-price span,
.summary-price small { display: block; color: #aeb3c1; }
.summary-price strong { display: block; margin: 4px 0; font-size: clamp(39px, 4vw, 59px); line-height: 1; letter-spacing: -.055em; }
.summary-selected { display: flex; flex-wrap: wrap; gap: 6px; padding-bottom: 18px; }
.summary-selected span { padding: 5px 8px; color: #d4d6dc; border: 1px solid #393c46; border-radius: 999px; font-size: 9px; }
.summary-modules { display: grid; }
.summary-modules > div { display: flex; justify-content: space-between; gap: 15px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,.1); color: #c6c9d2; font-size: 11px; }
.summary-modules strong { color: #fff; }
.summary-modules .is-provisional span::after { content: " *"; color: var(--signal); }
.cost-groups { margin-top: 13px; }
.cost-groups summary { display: flex; justify-content: space-between; color: var(--signal); font-size: 10px; font-weight: 900; cursor: pointer; list-style: none; text-transform: uppercase; letter-spacing: .08em; }
.cost-groups summary::-webkit-details-marker { display: none; }
.cost-groups[open] summary span { transform: rotate(45deg); }
.cost-groups p { display: flex; justify-content: space-between; margin: 8px 0; color: #aeb3c1; font-size: 10px; }
.cost-groups p strong { color: #fff; }
.quantity-chart { margin-top: 20px; padding: 16px; border-radius: 17px; background: rgba(255,255,255,.06); }
.quantity-chart > div { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.quantity-chart small { color: var(--signal); font-size: 9px; }
.quantity-chart svg { width: 100%; height: 110px; overflow: visible; }
.quantity-chart line { stroke: #555963; stroke-width: 1; }
.quantity-chart polyline { fill: none; stroke: var(--accent); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.quantity-chart circle { fill: var(--ink); stroke: var(--accent); stroke-width: 3; }
.quantity-chart circle.is-current { fill: var(--signal); stroke: #fff; }
.summary-timing { display: flex; justify-content: space-between; gap: 20px; margin: 17px 0; color: #aeb3c1; font-size: 10px; }
.summary-timing strong { color: #fff; }
.summary-pdf { width: 100%; border-color: var(--accent); background: var(--accent); }
.summary-pdf:hover { color: var(--ink); border-color: #fff; background: #fff; }
.summary-pdf:disabled { opacity: .5; cursor: wait; }
.summary-status { min-height: 18px; margin: 11px 0 0; color: var(--signal); font-size: 9px; }
.summary-status.is-error { color: #ff9b84; }
.summary-disclaimer { display: block; margin-top: 7px; color: #898e9b; font-size: 9px; }

.solutions-showcase { padding: 0 clamp(20px, 5vw, 78px) clamp(88px, 9vw, 140px); }
.solutions-showcase > .puzzle-intro { width: 100%; padding-inline: 0; }
.solution-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; }
.solution-grid article { display: flex; flex-direction: column; min-height: 470px; padding: 25px; border: 1px solid var(--line); border-radius: 24px; background: #fff; transition: .25s; }
.solution-grid article:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.solution-number { color: var(--accent); font-size: 10px; font-weight: 950; }
.solution-miniature { position: relative; display: grid; place-items: end start; height: 135px; margin: 18px 0 25px; padding: 18px; border-radius: 18px; color: #fff; background: var(--ink); overflow: hidden; }
.solution-miniature i { position: absolute; right: -25px; top: -30px; width: 130px; height: 130px; border: 35px solid var(--accent); border-radius: 50%; opacity: .55; }
.solution-miniature b { position: relative; z-index: 1; font-size: 19px; }
.solution-grid h3 { font-size: 26px; }
.solution-grid p { color: var(--muted); font-size: 13px; }
.solution-grid ul { padding-left: 17px; color: var(--muted); font-size: 12px; }
.solution-grid a { margin-top: auto; color: var(--accent); font-size: 11px; font-weight: 950; letter-spacing: .07em; text-transform: uppercase; }

@keyframes puzzlePulse { 50% { box-shadow: 0 0 0 12px transparent; } }

@media (max-width: 1180px) {
    .puzzle-hero { grid-template-columns: 1fr 430px; }
    .puzzle-workspace { grid-template-columns: minmax(0,1fr) 380px; padding-inline: 24px; }
    .option-grid--dies { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 980px) {
    .puzzle-hero { grid-template-columns: 1fr; min-height: auto; }
    .puzzle-hero__visual { min-height: 470px; max-width: 680px; width: 100%; }
    .puzzle-intro { grid-template-columns: 1fr; }
    .puzzle-workspace { grid-template-columns: 1fr; }
    .puzzle-summary { position: static; }
    .solution-grid { grid-template-columns: 1fr; }
    .solution-grid article { min-height: 400px; }
}

@media (max-width: 680px) {
    .puzzle-hero { padding-top: 54px; }
    .puzzle-hero h1 { font-size: clamp(54px, 17vw, 82px); }
    .puzzle-hero__visual { min-height: 360px; }
    .puzzle-assembly { inset: 15px 0 50px; border-radius: 28px; }
    .puzzle-sheet { inset: 72px 50px; padding: 22px; }
    .puzzle-piece { width: 52px; height: 52px; }
    .puzzle-piece::before,
    .puzzle-piece::after { width: 18px; height: 18px; }
    .puzzle-piece::before { top: 17px; }
    .puzzle-piece::after { left: 17px; }
    .puzzle-trust { display: grid; }
    .puzzle-mode,
    .preset-selector { grid-template-columns: 1fr; }
    .preset-unlock { grid-column: auto; }
    .config-module { padding: 22px 17px; border-radius: 22px; }
    .config-module > header { grid-template-columns: 38px 1fr; gap: 12px; }
    .module-index { width: 38px; height: 38px; border-radius: 12px; }
    .option-grid,
    .option-grid--dies,
    .delivery-fields,
    .contact-module .delivery-fields,
    .metric-grid { grid-template-columns: 1fr; }
    .quantity-control { padding: 18px; }
    .quantity-number { display: grid; justify-content: stretch; }
    .quantity-number input { width: 100%; }
    .puzzle-summary { padding: 22px 18px; border-radius: 22px; }
    .summary-price strong { font-size: 44px; }
}

@media (prefers-reduced-motion: reduce) {
    .puzzle-kicker i,
    .summary-head i { animation: none; }
}

/* alpha.14 — praktyczny konfigurator i jawny wpływ parametrów na cenę */
.configurator-launch {
    width: min(100%, 1560px);
    margin-inline: auto;
    padding: clamp(36px, 5vw, 72px) clamp(20px, 5vw, 78px) 30px;
}

.configurator-launch__intro {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 28px;
    align-items: end;
    padding-bottom: 27px;
    border-bottom: 1px solid var(--line);
}

.configurator-launch h1 {
    max-width: 980px;
    margin: 13px 0 9px;
    font-size: clamp(38px, 5vw, 72px);
    line-height: .94;
    letter-spacing: -.055em;
}

.configurator-launch__intro p { max-width: 850px; margin: 0; color: var(--muted); font-size: 15px; }
.configurator-share { display: grid; justify-items: end; gap: 8px; }
.configurator-share small { max-width: 310px; color: var(--muted); text-align: right; font-size: 10px; }

.configurator-choice { display: grid; gap: 17px; padding-top: 24px; }
.custom-choice {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr);
    gap: 2px 14px;
    align-items: center;
    max-width: 620px;
    padding: 17px 20px;
    color: var(--ink);
    text-align: left;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: #fff;
    cursor: pointer;
    transition: .2s;
}
.custom-choice > span { grid-row: 1 / 3; display: grid; place-items: center; width: 45px; height: 45px; color: var(--accent); border-radius: 13px; background: var(--accent-soft); font-size: 10px; font-weight: 950; }
.custom-choice b { font-size: 15px; }
.custom-choice small { color: var(--muted); }
.custom-choice:hover,
.custom-choice.is-active { color: #fff; border-color: var(--ink); background: var(--ink); transform: translateY(-2px); }
.custom-choice.is-active small { color: #c4c7d0; }

.verified-solutions { display: grid; gap: 13px; }
.verified-solutions__title { display: flex; align-items: center; gap: 13px; color: var(--ink); }
.verified-solutions__title > span { display: grid; place-items: center; width: 34px; height: 34px; color: var(--accent); border-radius: 10px; background: var(--accent-soft); font-size: 9px; font-weight: 950; }
.verified-solutions__title b,
.verified-solutions__title small { display: block; }
.verified-solutions__title small { margin-top: 2px; color: var(--muted); font-size: 11px; }

.configurator-launch .preset-selector { width: 100%; padding: 0; }
.configurator-launch .preset-card { display: flex; min-height: 205px; cursor: default; flex-direction: column; }
.configurator-launch .preset-card b { margin-top: 21px; }
.preset-card__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 15px; }
.preset-card__actions button,
.preset-card__actions a { padding: 9px 12px; border-radius: 10px; font-size: 10px; font-weight: 900; cursor: pointer; }
.preset-card__actions button { color: #fff; border: 1px solid var(--ink); background: var(--ink); }
.preset-card__actions a { color: var(--accent); border: 1px solid var(--line); background: #fff; }
.preset-card__actions button:hover { border-color: var(--accent); background: var(--accent); }
.preset-card__actions a:hover { border-color: var(--accent); }

.puzzle-workspace { padding-top: 12px; }
.config-module > header > div { min-width: 0; }
.module-price { display: block; width: max-content; max-width: 100%; margin-top: 13px; padding: 7px 10px; color: var(--accent); border-radius: 9px; background: var(--accent-soft); font-size: 11px; font-weight: 900; }
.module-unlock { display: inline-flex; margin-top: 12px; padding: 8px 11px; color: var(--ink); border: 1px solid var(--line); border-radius: 10px; background: #fff; font-size: 10px; font-weight: 900; cursor: pointer; }
.module-unlock:hover { color: #fff; border-color: var(--accent); background: var(--accent); }
.module-unlock[hidden] { display: none !important; }

.tech-option { grid-template-rows: auto auto auto; }
.tech-option__icon,
.paper-swatch,
.board-swatch,
.bag-icon,
.box-icon { grid-row: 1 / 4; }
.option-price-impact { display: block; margin-top: 5px; color: var(--accent); font-size: 9px; font-weight: 900; line-height: 1.25; }
.option-price-impact.is-selected { color: var(--ok); }
.switch-option .option-price-impact { margin-top: 7px; }

.puzzle-summary { max-height: calc(100vh - 122px); }
.summary-details { margin: 0 0 16px; border-top: 1px solid rgba(255,255,255,.13); border-bottom: 1px solid rgba(255,255,255,.13); }
.summary-details > summary { display: flex; justify-content: space-between; align-items: center; padding: 12px 0; color: var(--signal); list-style: none; cursor: pointer; font-size: 10px; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.summary-details > summary::-webkit-details-marker { display: none; }
.summary-details > summary span { transition: transform .2s; }
.summary-details[open] > summary span { transform: rotate(45deg); }
.summary-scroll { max-height: min(45vh, 490px); padding: 1px 9px 13px 0; overflow-y: auto; scrollbar-color: var(--accent) rgba(255,255,255,.08); scrollbar-width: thin; }
.summary-scroll::-webkit-scrollbar { width: 7px; }
.summary-scroll::-webkit-scrollbar-thumb { border-radius: 999px; background: var(--accent); }
.summary-scroll::-webkit-scrollbar-track { background: rgba(255,255,255,.08); }
.summary-selected { padding-top: 3px; }

@media (max-width: 980px) {
    .configurator-launch__intro { grid-template-columns: 1fr; align-items: start; }
    .configurator-share { justify-items: start; }
    .configurator-share small { text-align: left; }
    .puzzle-summary { max-height: none; }
    .summary-scroll { max-height: 520px; }
}

@media (max-width: 680px) {
    .configurator-launch { padding-top: 28px; }
    .configurator-launch h1 { font-size: clamp(37px, 12vw, 54px); }
    .configurator-share .button { width: 100%; }
    .custom-choice { max-width: none; }
    .preset-card__actions { display: grid; }
    .preset-card__actions button,
    .preset-card__actions a { text-align: center; }
    .module-price { width: 100%; }
}