/* Objednávka pozvánky (načítá se po d.css) */
body.order { background: var(--ivory); padding-bottom: 0; }
.order .nav, .order .petals { display: none; }

/* ---------- horní lišta a postup ---------- */
.obar { position: sticky; top: 0; z-index: 40; background: rgba(250, 246, 240, .94); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 1px 0 var(--line); }
.obar__in { max-width: 2200px; margin: 0 auto; display: flex; align-items: center; gap: 18px; padding: 8px 16px; min-height: 64px; }
.obar .brand { font-size: 12px; letter-spacing: .22em; white-space: nowrap; }
.obar .brand img { width: 34px; height: 34px; }
.obar__back { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; font-size: 16px; text-decoration: none; color: var(--soft); white-space: nowrap; }
.obar__back:hover { color: var(--rose-deep); }
.ostepper { flex: 1; min-width: 0; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 4px 2px; justify-content: flex-start; }
.ostepper::-webkit-scrollbar { display: none; }
.ostp { flex: 0 0 auto; display: grid; justify-items: center; gap: 3px; padding: 0; border: 0; background: none; color: var(--soft); font: inherit; cursor: pointer; }
.ostp__c { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; border: 1.5px solid rgba(74, 63, 51, .2); background: var(--ivory); font-size: 18px; transition: background .35s, color .35s, border-color .35s, scale .35s var(--ease); }
.ostp__l { display: none; font-size: 14px; line-height: 1.1; }
.ostp.is-done .ostp__c { border-color: var(--rose-deep); color: var(--rose-deep); background: #f6e6de; }
.ostp.is-on .ostp__c { background: linear-gradient(145deg, #C99A84, var(--rose-deep)); border-color: transparent; color: #fff; scale: 1.12; box-shadow: 0 8px 16px -8px rgba(156, 102, 80, .8); }
.ostp.is-on { color: var(--ink); }
.oprog { height: 3px; background: rgba(74, 63, 51, .08); }
.oprog i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #D9A58E, var(--rose-deep)); transition: width .5s var(--ease); }

/* ---------- rozvržení ---------- */
.omain { max-width: 2200px; margin: 0 auto; padding: 0 0 130px; display: grid; gap: 0; }
.oside { display: none; }
.oform { padding: 26px 16px 0; min-width: 0; }

/* ---------- krok ---------- */
.ostep__h { text-align: left; margin-bottom: 22px; }
.ostep__k { font-size: 13px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold); }
.ostep__h h1 { font: 400 clamp(46px, 12vw, 72px)/1.02 var(--script); margin-top: 6px; color: var(--ink); }
.ostep__h p { margin-top: 8px; color: var(--soft); font-size: 19px; max-width: 34em; }
.ostep__b { display: grid; gap: 22px; }
.ostep__b > * { min-width: 0; }
.ogroup h3 { font-weight: 500; font-size: 24px; margin: 0 0 10px; display: flex; align-items: baseline; gap: 10px; }
.ogroup h3 small { font-size: 15px; color: var(--soft); font-weight: 400; }
.ogroup__d { margin: -4px 0 12px; color: var(--soft); font-size: 17px; }
.ooff { padding: 26px; border-radius: var(--r); background: rgba(196, 145, 122, .1); color: var(--soft); text-align: center; }
.onote-box { padding: 14px 16px; border-radius: 14px; background: rgba(196, 145, 122, .12); font-size: 17px; line-height: 1.45; color: var(--ink); }
.onote-box a { color: var(--rose-deep); }

/* ---------- pole ---------- */
.ofld { display: grid; gap: 6px; position: relative; }
.ofld label { font-size: 17px; font-weight: 500; }
.ofld input, .ofld textarea, .ofld select { width: 100%; min-height: 54px; padding: 12px 16px; border-radius: 14px; border: 1.5px solid rgba(74, 63, 51, .22); background: #fffdfa; font: 400 19px/1.35 var(--serif); color: var(--ink); transition: border-color .25s, box-shadow .25s; -webkit-appearance: none; appearance: none; }
.ofld textarea { resize: vertical; min-height: 88px; }
.ofld select { background-image: linear-gradient(45deg, transparent 50%, #9c6650 50%), linear-gradient(135deg, #9c6650 50%, transparent 50%); background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50%; background-size: 6px 6px; background-repeat: no-repeat; padding-right: 40px; }
.ofld input:focus, .ofld textarea:focus, .ofld select:focus { outline: none; border-color: var(--rose-deep); box-shadow: 0 0 0 4px rgba(156, 102, 80, .16); }
.ofld input::placeholder, .ofld textarea::placeholder { color: #a8998a; }
.ofld .req, .req { color: var(--rose-deep); }
.ohint { color: var(--soft); font-size: 15px; line-height: 1.4; }
.ohint b { color: var(--ink); }
.oerr { color: #a3352b; font-size: 15px; }
.has-err input, .has-err textarea, .has-err select { border-color: #c4584c; background: #fff7f5; }
.oreset { justify-self: start; border: 0; background: none; padding: 2px 0; font: inherit; font-size: 15px; color: var(--rose-deep); cursor: pointer; display: inline-flex; gap: 6px; align-items: center; }
.oreset.is-hidden { display: none; }
.ogrid2 { display: grid; gap: 14px; grid-template-columns: 1fr; align-items: start; }
.ogrid3 { display: grid; gap: 14px; grid-template-columns: 86px 1fr; }
.ofld--w2 { grid-column: auto; }

.oseg { display: grid; gap: 10px; grid-template-columns: 1fr 1fr; }
.oseg__b { padding: 14px 16px; border-radius: 16px; border: 1.5px solid rgba(74, 63, 51, .22); background: #fffdfa; font: inherit; text-align: left; cursor: pointer; display: grid; gap: 2px; color: var(--ink); transition: border-color .3s, background .3s, box-shadow .3s; }
.oseg__b b { font-weight: 500; font-size: 19px; }
.oseg__b small { color: var(--soft); font-size: 14px; line-height: 1.3; }
.oseg__b.is-on { border-color: var(--rose-deep); background: #fbefe9; box-shadow: 0 0 0 3px rgba(156, 102, 80, .15); }

.osw { display: flex; align-items: center; gap: 14px; cursor: pointer; }
.osw input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.osw__t { position: relative; flex: 0 0 auto; width: 52px; height: 30px; border-radius: 999px; background: #d9cfc4; transition: background .3s; }
.osw__t::after { content: ''; position: absolute; top: 3px; left: 3px; width: 24px; height: 24px; border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(0, 0, 0, .2); transition: transform .35s var(--ease); }
.osw input:checked + .osw__t { background: var(--rose-deep); }
.osw input:checked + .osw__t::after { transform: translateX(22px); }
.osw input:focus-visible + .osw__t { outline: 2px solid var(--rose-deep); outline-offset: 3px; }
.osw__l { font-size: 18px; line-height: 1.3; }
.osw__l small { display: block; color: var(--soft); font-size: 14px; }
.osec { padding: 14px 16px; border-radius: 16px; background: rgba(196, 145, 122, .1); }
.ochecks { display: grid; gap: 12px; }
.ocheck { display: flex; gap: 12px; align-items: flex-start; font-size: 17px; line-height: 1.4; cursor: pointer; }
.ocheck input { flex: 0 0 auto; width: 24px; height: 24px; margin-top: 2px; accent-color: #9c6650; }
.ocheck a { color: var(--rose-deep); }
.ocheck.has-err { color: #a3352b; }

.onote { border-radius: 16px; border: 1px dashed rgba(74, 63, 51, .28); padding: 4px 14px; margin-top: 4px; }
.onote summary { cursor: pointer; padding: 12px 0; font-size: 17px; color: var(--soft); list-style: none; display: flex; gap: 8px; align-items: center; }
.onote summary::-webkit-details-marker { display: none; }
.onote textarea { width: 100%; margin: 0 0 12px; padding: 12px 14px; border-radius: 12px; border: 1.5px solid rgba(74, 63, 51, .22); background: #fffdfa; font: 400 18px/1.4 var(--serif); color: var(--ink); resize: vertical; }
.onote textarea:focus { outline: none; border-color: var(--rose-deep); }

/* ---------- volba vzhledu ---------- */
.opicks { display: grid; gap: 10px; grid-template-columns: repeat(3, 1fr); }
.opick { padding: 0; border: 0; background: none; font: inherit; color: inherit; cursor: pointer; text-align: center; }
.opick__i { display: block; aspect-ratio: 390 / 844; border-radius: 14px; overflow: hidden; background: var(--blush); box-shadow: 0 0 0 1px var(--line); transition: transform .4s var(--ease), box-shadow .3s; }
.opick__i img { width: 100%; height: 100%; object-fit: cover; }
.opick__n { display: block; margin-top: 6px; font-size: 14px; line-height: 1.15; color: var(--soft); }
.opick:hover .opick__i { transform: translateY(-4px); }
.opick.is-on .opick__i { box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--rose-deep), 0 16px 24px -12px rgba(120, 78, 58, .5); transform: translateY(-4px); }
.opick.is-on .opick__n { color: var(--ink); font-weight: 600; }
.opals { display: grid; gap: 10px; grid-template-columns: 1fr 1fr; }
.opal { padding: 12px; border: 1.5px solid rgba(74, 63, 51, .18); border-radius: 16px; background: #fffdfa; font: inherit; color: var(--ink); cursor: pointer; display: grid; gap: 8px; text-align: left; transition: border-color .3s, box-shadow .3s; }
.opal__c { display: flex; height: 38px; border-radius: 10px; overflow: hidden; }
.opal__c i { flex: 1; background: var(--c); }
.opal__n { font-size: 17px; display: flex; align-items: center; gap: 8px; }
.opal .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--rose-deep); }
.opal.is-on { border-color: var(--rose-deep); box-shadow: 0 0 0 3px rgba(156, 102, 80, .16); }
.ovars { display: grid; gap: 12px 10px; grid-template-columns: repeat(3, 1fr); }
.ovar { padding: 0; border: 0; background: none; font: inherit; color: inherit; cursor: pointer; text-align: center; }
.ovar__i { position: relative; display: block; aspect-ratio: 260 / 563; border-radius: 12px; overflow: hidden; background: var(--blush); box-shadow: 0 0 0 1px var(--line); transition: transform .4s var(--ease), box-shadow .3s; }
.ovar__i img { width: 100%; height: 100%; object-fit: cover; }
.ovar__i em { position: absolute; left: 6px; top: 6px; padding: 2px 8px; border-radius: 999px; font: 500 11px/1.4 var(--serif); font-style: normal; background: rgba(255, 252, 248, .94); color: var(--rose-deep); }
.ovar__n { display: block; margin-top: 6px; font-size: 14px; line-height: 1.15; color: var(--soft); }
.ovar:hover .ovar__i { transform: translateY(-3px); }
.ovar.is-on .ovar__i { box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--rose-deep); }
.ovar.is-on .ovar__n { color: var(--ink); font-weight: 600; }

/* ---------- balíčky ---------- */
.opacks { display: grid; gap: 14px; }
.opack { position: relative; padding: 24px 22px 20px; border-radius: 24px; border: 1.5px solid rgba(74, 63, 51, .18); background: #fffdfa; font: inherit; color: var(--ink); text-align: left; cursor: pointer; display: grid; gap: 4px; transition: border-color .3s, box-shadow .35s, transform .4s var(--ease); }
.opack:hover { transform: translateY(-3px); }
.opack__tag { justify-self: start; padding: 3px 12px; border-radius: 999px; background: rgba(196, 145, 122, .16); color: var(--rose-deep); font-size: 14px; }
.opack b { font: 400 44px/1.05 var(--script); margin-top: 6px; }
.opack__p { font-size: 28px; font-weight: 500; }
.opack ul { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 7px; font-size: 16px; color: var(--soft); }
.opack li { padding-left: 20px; position: relative; line-height: 1.35; }
.opack li::before { content: ''; position: absolute; left: 2px; top: .6em; width: 7px; height: 7px; border: 1px solid var(--gold); transform: rotate(45deg); }
.opack__c { margin-top: 14px; padding: 10px 16px; border-radius: 999px; text-align: center; border: 1.5px solid rgba(74, 63, 51, .28); font-size: 17px; }
.opack.is-on { border-color: var(--rose-deep); box-shadow: 0 0 0 3px rgba(156, 102, 80, .16), 0 26px 40px -26px rgba(110, 66, 46, .5); }
.opack.is-on .opack__c { background: linear-gradient(145deg, #C99A84, var(--rose-deep)); border-color: transparent; color: #fff; }
.opack.is-main::after { content: ''; }
.oaddons { display: grid; gap: 10px; }
.oaddon { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 16px; border: 1.5px solid rgba(74, 63, 51, .18); background: #fffdfa; cursor: pointer; transition: border-color .3s, background .3s; }
.oaddon input { width: 24px; height: 24px; accent-color: #9c6650; flex: 0 0 auto; }
.oaddon__b { flex: 1; display: grid; }
.oaddon__b b { font-weight: 500; font-size: 18px; }
.oaddon__b small { color: var(--soft); font-size: 15px; line-height: 1.3; }
.oaddon__p { white-space: nowrap; color: var(--rose-deep); font-weight: 500; }
.oaddon.is-on { border-color: var(--rose-deep); background: #fbefe9; }

/* ---------- seznamy ---------- */
.olist { display: grid; gap: 12px; }
.orow { display: grid; grid-template-columns: 34px 1fr 40px; gap: 10px; padding: 14px 12px; border-radius: 18px; background: #fffdfa; box-shadow: 0 0 0 1px var(--line); align-items: start; }
.orow__n { font-size: 30px; line-height: 1; color: var(--rose-deep); padding-top: 12px; text-align: center; }
.orow__f { display: grid; gap: 12px; min-width: 0; }
.orow__x { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; border: 0; background: rgba(196, 145, 122, .12); color: var(--rose-deep); font-size: 20px; cursor: pointer; margin-top: 8px; }
.orow__x:hover { background: rgba(196, 145, 122, .28); }
.oadd { display: inline-flex; align-items: center; gap: 10px; padding: 12px 20px; border-radius: 999px; border: 1.5px dashed rgba(156, 102, 80, .6); background: none; font: 500 17px var(--serif); color: var(--rose-deep); cursor: pointer; justify-self: start; }
.oadd:hover { background: rgba(196, 145, 122, .1); }
.oinfos { display: grid; gap: 10px; }
.oinfo { border-radius: 16px; border: 1.5px solid rgba(74, 63, 51, .18); background: #fffdfa; padding: 12px 14px; }
.oinfo.is-on { border-color: rgba(156, 102, 80, .5); }
.oinfo__h { display: flex; gap: 12px; align-items: center; cursor: pointer; font-size: 18px; }
.oinfo__h input { width: 22px; height: 22px; accent-color: #9c6650; }
.oinfo__b { display: grid; gap: 12px; margin-top: 12px; }

/* ---------- fotky ---------- */
.odrop { display: grid; place-items: center; gap: 4px; text-align: center; padding: 30px 18px; border-radius: 22px; border: 2px dashed rgba(156, 102, 80, .5); background: rgba(196, 145, 122, .08); color: var(--rose-deep); cursor: pointer; transition: background .3s, border-color .3s; }
.odrop i { font-size: 36px; }
.odrop b { font-weight: 500; font-size: 20px; color: var(--ink); }
.odrop small { color: var(--soft); font-size: 15px; }
.odrop:hover, .odrop.is-over { background: rgba(196, 145, 122, .18); border-color: var(--rose-deep); }
.ophotos { display: grid; gap: 12px; grid-template-columns: 1fr 1fr; }
.oph { margin: 0; display: grid; gap: 8px; }
.oph__i { position: relative; display: block; aspect-ratio: 4 / 5; border-radius: 16px; overflow: hidden; box-shadow: 0 0 0 1px var(--line); }
.oph__i img { width: 100%; height: 100%; object-fit: cover; }
.oph__n { position: absolute; left: 8px; top: 8px; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: rgba(255, 252, 248, .94); color: var(--rose-deep); font: 400 24px/1 var(--script); }
.oph__c { width: 100%; padding: 9px 12px; border-radius: 10px; border: 1.5px solid rgba(74, 63, 51, .2); background: #fffdfa; font: 400 16px var(--serif); color: var(--ink); }
.oph__a { display: flex; gap: 6px; }
.oph__a button { flex: 1; height: 38px; border-radius: 10px; border: 1px solid rgba(74, 63, 51, .22); background: #fffdfa; color: var(--ink); font-size: 18px; cursor: pointer; display: grid; place-items: center; }
.oph__a button[disabled] { opacity: .3; cursor: default; }
.oph__a button:last-child { color: #a3352b; }

/* ---------- shrnutí ---------- */
.osm { padding: 16px 18px; border-radius: 18px; background: #fffdfa; box-shadow: 0 0 0 1px var(--line); }
.osm__h { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.osm__h h3 { margin: 0; font-weight: 500; font-size: 20px; }
.osm p { margin: 4px 0 0; font-size: 18px; }
.osm__s { color: var(--soft); font-size: 16px !important; }
.olink { border: 0; background: none; font: inherit; font-size: 16px; color: var(--rose-deep); text-decoration: underline; cursor: pointer; }
.ototal { padding: 18px; border-radius: 18px; background: #fbefe9; box-shadow: inset 0 0 0 1px rgba(184, 149, 90, .3); display: grid; gap: 10px; }
.ototal p { display: flex; justify-content: space-between; gap: 12px; margin: 0 0 4px; font-size: 17px; }
.ototal__sum { display: flex; justify-content: space-between; align-items: baseline; padding-top: 10px; border-top: 1px solid rgba(184, 149, 90, .4); font-size: 20px; }
.ototal__sum b { font-size: 32px; font-weight: 500; color: var(--rose-deep); }

/* ---------- navigace ---------- */
.onav { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 30px; padding-top: 22px; border-top: 1px solid var(--line); }
.onav__n { color: var(--soft); font-size: 16px; }
.obtn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 54px; padding: 0 26px; border-radius: 999px; border: 1.5px solid transparent; font: 500 18px/1 var(--serif); text-decoration: none; cursor: pointer; transition: transform .3s var(--ease), box-shadow .3s, background .3s; }
.obtn:active { transform: scale(.97); }
.obtn--line { background: rgba(255, 252, 248, .7); border-color: rgba(74, 63, 51, .28); color: var(--ink); }
.obtn--solid { background: linear-gradient(145deg, #C99A84, var(--rose-deep)); color: #fff; box-shadow: 0 14px 24px -12px rgba(156, 102, 80, .9); }
.obtn--solid:hover { transform: translateY(-2px); }
.obtn[disabled] { opacity: .35; pointer-events: none; }
.obtn i { font-size: 20px; transition: transform .3s var(--ease); }
#onext:hover i { transform: translateX(4px); }
#oprev:hover i { transform: translateX(-4px); }
.onext.is-send, #onext.is-send { padding: 0 34px; }

/* ---------- spodní lišta na mobilu ---------- */
.obottom { position: fixed; z-index: 45; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: rgba(250, 246, 240, .95); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 -1px 0 var(--line), 0 -12px 24px -18px rgba(90, 52, 40, .4); }
.obottom__price { display: grid; line-height: 1.1; }
.obottom__price small { font-size: 13px; color: var(--soft); }
.obottom__price b { font-size: 24px; font-weight: 500; color: var(--rose-deep); }
.obottom .obtn { min-height: 48px; padding: 0 20px; }
.obtn--ic { padding: 0 !important; width: 48px; flex: 0 0 48px; }
.obottom__price { flex: 1; text-align: center; }
@media (max-width: 899px) { .onav { display: none; } .omain { padding-bottom: 120px; } }

.omodal[hidden] { display: none; }
.omodal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; animation: mfade .25s ease; }
@keyframes mfade { from { opacity: 0; } }
.omodal__bg { position: absolute; inset: 0; background: rgba(38, 26, 22, .78); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.omodal__box { position: relative; }
.omodal .phone { --pw: min(90vw, calc((100dvh - 60px) / 2.17)); }
.omodal__close { position: fixed; top: 14px; right: 14px; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; border: 0; background: rgba(253, 250, 246, .96); color: var(--ink); font-size: 22px; cursor: pointer; }
html.modal-open { overflow: hidden; }
.otoast { position: fixed; z-index: 120; left: 50%; bottom: 96px; transform: translate(-50%, 20px); max-width: min(92vw, 460px); padding: 13px 20px; border-radius: 999px; background: rgba(60, 40, 33, .94); color: #fff; font-size: 16px; text-align: center; opacity: 0; pointer-events: none; transition: opacity .35s, transform .45s var(--ease); }
.otoast.is-on { opacity: 1; transform: translate(-50%, 0); }

/* ---------- hotovo ---------- */
.odone { text-align: center; padding: 50px 10px 20px; display: grid; gap: 14px; justify-items: center; }
.odone__i { font-size: 64px; color: var(--rose-deep); }
.odone h1 { font: 400 clamp(56px, 14vw, 90px)/1 var(--script); }
.odone__ref { color: var(--soft); }
.odone__steps { display: grid; gap: 14px; margin: 14px 0 8px; text-align: left; max-width: 520px; }
.odone__steps > div { display: grid; grid-template-columns: 40px 1fr; gap: 14px; align-items: center; }
.odone__steps b { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: rgba(196, 145, 122, .2); color: var(--rose-deep); font: 400 26px/1 var(--script); }
.odone__steps p { margin: 0; }

/* ---------- počítač ---------- */
@media (min-width: 900px) {
  .obar__in { padding: 8px 30px 0; gap: 30px; min-height: 84px; align-items: flex-start; }
  .obar .brand, .obar__back { margin-top: 12px; }
  .obar .brand { font-size: 13px; }
  .ostepper { justify-content: center; gap: 12px; }
  .ostp__c { width: 44px; height: 44px; font-size: 22px; }
  .ostp { gap: 4px; }
  .ostp { position: relative; }
  .ostp__l { display: block; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); margin-top: 2px; white-space: nowrap; font-size: 13px; opacity: 0; pointer-events: none; transition: opacity .3s; }
  .ostp.is-on .ostp__l, .ostp:hover .ostp__l { opacity: 1; }
  .ostepper { padding: 4px 6px 24px; }
  .omain { grid-template-columns: minmax(380px, 520px) minmax(0, 1fr); gap: clamp(30px, 4vw, 90px); padding: 36px clamp(24px, 3vw, 60px) 90px; align-items: start; }
  .oside { display: grid; gap: 22px; position: sticky; top: 104px; align-self: start; }
  .oside__stage { position: relative; isolation: isolate; overflow: hidden; border-radius: 32px; padding: 38px 20px 22px; display: grid; justify-items: center; gap: 12px; background: color-mix(in srgb, var(--pal, #b8955a) 12%, #f7ece5); box-shadow: inset 0 0 0 1px rgba(184, 149, 90, .28), 0 40px 70px -50px rgba(110, 66, 46, .5); transition: background .8s ease; }
  .oside__bg { position: absolute; inset: 0; z-index: -1; }
  .oside__bg img { width: 100%; height: 100%; object-fit: cover; filter: blur(34px) saturate(1.2); transform: scale(1.2); opacity: .7; }
  .oside__bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(250, 246, 240, .15), color-mix(in srgb, var(--pal, #b8955a) 14%, rgba(250, 246, 240, .72))); }
  #ophone { --pw: min(310px, calc((100dvh - 330px) / 2.17)); margin: 0 auto; }
  .oside__cap { font: 400 38px/1 var(--script); color: var(--ink); text-align: center; }
  .oside__hint { text-align: center; font-size: 14px; line-height: 1.35; color: var(--soft); max-width: 24em; margin: 0; }
  .osum { padding: 22px 24px; border-radius: 24px; background: #fffdfa; box-shadow: 0 0 0 1px var(--line); }
  .osum h2 { font: 500 22px/1.2 var(--serif); margin: 0 0 10px; }
  .osum p { display: flex; justify-content: space-between; gap: 12px; margin: 0 0 6px; font-size: 17px; }
  .osum p:not(.osum__t) { display: none; }
  .osum h2 { display: none; }
  .osum { padding: 16px 22px; }
  .osum__t { margin-top: 0 !important; padding-top: 0 !important; border-top: 0 !important; }
  .oside__hint { display: none; }
  .osum__t { padding-top: 10px; margin-top: 8px !important; border-top: 1px solid var(--line); font-size: 20px !important; }
  .osum__t b { color: var(--rose-deep); font-size: 26px; font-weight: 500; }
  .osum small { display: block; margin-top: 8px; color: var(--soft); font-size: 14px; }
  .oform { padding: 0; }
  .ostep { padding: 38px 42px 34px; border-radius: 32px; background: rgba(255, 252, 248, .78); box-shadow: 0 0 0 1px var(--line), 0 40px 70px -56px rgba(110, 66, 46, .45); }
  .ostep__h { margin-bottom: 28px; }
  .ostep__h h1 { font-size: clamp(60px, 4.6vw, 88px); }
  .ostep__h p { font-size: 21px; }
  .ostep__b { gap: 28px; }
  .ogroup h3 { font-size: 26px; }
  .ofld label { font-size: 18px; }
  .ofld input, .ofld textarea, .ofld select { font-size: 20px; }
  .ogrid2 { grid-template-columns: 1fr 1fr; gap: 18px; }
  .ogrid3 { grid-template-columns: 110px 1fr; gap: 18px; }
  .opicks { grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 16px 14px; }
  .opick__n { font-size: 15px; }
  .opals { grid-template-columns: repeat(3, 1fr); }
  .ovars { grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 16px 14px; }
  .opacks { grid-template-columns: repeat(3, 1fr); gap: 18px; }
  .oaddons { grid-template-columns: 1fr 1fr; }
  .ophotos { grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .osm p { font-size: 19px; }
  .onav { margin-top: 34px; }
  .obottom { display: none; }
  .otoast { bottom: 40px; }
}
@media (min-width: 1500px) {
  .ostp__l { font-size: 14px; }
  .opicks { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
}
@media (max-width: 899px) { .obar__back span { display: none; } .obar__back { font-size: 22px; } .ostepper { padding: 4px 0; } }
@media (prefers-reduced-motion: reduce) { .oprog i, .opack, .opick__i, .ovar__i, .obtn { transition: none; } }

body.is-done .oside { display: none; }
@media (min-width: 900px) { body.is-done .omain { grid-template-columns: minmax(0, 860px); justify-content: center; } body.is-done .ostep, body.is-done .onav { display: none; } .odone { padding-top: 70px; } }

/* mobil: stepper pod lištou s logem, balíčky jako carousel */
.opchips { display: none; }
@media (max-width: 899px) {
  .obar__in { flex-wrap: wrap; gap: 4px 12px; padding-bottom: 6px; }
  .obar__back { order: 2; margin-left: auto; }
  .ostepper { order: 3; flex: 0 0 100%; padding: 6px 2px 4px; }
  .opchips { display: flex; justify-content: center; gap: 8px; margin: 2px 0 14px; }
  .opchips button { min-height: 42px; padding: 0 18px; border-radius: 999px; border: 1.5px solid rgba(74, 63, 51, .28); background: transparent; font: 500 16px var(--serif); color: var(--ink); cursor: pointer; transition: background .3s, color .3s, border-color .3s; }
  .opchips button.is-on { background: linear-gradient(145deg, #C99A84, var(--rose-deep)); border-color: transparent; color: #fff; }
  .opacks { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin: 0 -16px; padding: 18px calc((100vw - min(76vw, 320px)) / 2) 22px; }
  .opacks::-webkit-scrollbar { display: none; }
  .opack { flex: 0 0 min(76vw, 320px); scroll-snap-align: center; scale: calc(.92 + .08 * var(--k, 1)); opacity: calc(.62 + .38 * var(--k, 1)); transition: border-color .3s, box-shadow .35s; }
  .opack:hover { transform: none; }
}

.obtn--solid { position: relative; overflow: hidden; isolation: isolate; }
.obtn--solid::after { content: ""; position: absolute; top: 0; bottom: 0; width: 56px; left: -90px; z-index: -1; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .5), transparent); transform: skewX(-18deg); animation: osheen 5s ease-in-out infinite; }
@keyframes osheen { 0%, 55% { left: -90px; } 100% { left: 120%; } }
@media (prefers-reduced-motion: reduce) { .obtn--solid::after { animation: none; } }

/* PC: pozadí stránky z náhledu (scéna tématu a tón palety), telefon ani panely nejsou v rámu */
.obg { display: none; }
@media (min-width: 900px) {
  body.order { background: color-mix(in srgb, var(--pal, #b8955a) 12%, #f7ece5); transition: background .8s ease; }
  .obg { display: block; position: fixed; inset: 0; z-index: -1; overflow: hidden; }
  .obg img { width: 100%; height: 100%; object-fit: cover; filter: blur(40px) saturate(1.2); transform: scale(1.25); opacity: .7; transition: opacity .5s; }
  .obg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(115deg, rgba(250, 246, 240, .22), color-mix(in srgb, var(--pal, #b8955a) 14%, rgba(250, 246, 240, .72)) 60%); }
  .obar { background: rgba(250, 246, 240, .62); }
  .oside__stage { background: none; box-shadow: none; border-radius: 0; overflow: visible; padding: 8px 0 0; }
  .oside__stage::after { display: none; }
  .osum { background: rgba(255, 253, 250, .86); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
  .ostep { background: rgba(255, 252, 248, .86); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
}
